feat(aspect-ratio)!: integration with v11 (#1955)

This commit is contained in:
Eric Liu 2024-04-21 11:14:52 -07:00 committed by GitHub
commit 08036e105c
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
5 changed files with 48 additions and 7 deletions

View file

@ -1,12 +1,21 @@
<script>
// @ts-check
/**
* Specify the aspect ratio
* @type {"2x1" | "2x3" | "16x9" | "4x3" | "1x1" | "3x4" | "3x2" | "9x16" | "1x2"}
*/
export let ratio = "2x1";
/**
* Specify the tag name
* @type {keyof HTMLElementTagNameMap}
*/
export let tag = "div";
</script>
<div
<svelte:element
this="{tag}"
class:bx--aspect-ratio="{true}"
class:bx--aspect-ratio--2x1="{ratio === '2x1'}"
class:bx--aspect-ratio--2x3="{ratio === '2x3'}"
@ -20,4 +29,4 @@
{...$$restProps}
>
<slot />
</div>
</svelte:element>