From f01c73e29b61fdc38d616e9dadca542bf10b8a7f Mon Sep 17 00:00:00 2001 From: Benjamin Palko Date: Tue, 25 Mar 2025 20:41:32 -0400 Subject: [PATCH] add XL --- .../src/lib/components/Actions/Button.svelte | 1 + .../DataDisplay/Avatar.stories.svelte | 25 ++++++++++++++++++- .../lib/components/DataDisplay/Avatar.svelte | 6 +++-- .../DataDisplay/Badge.stories.svelte | 2 +- .../lib/components/DataDisplay/Badge.svelte | 2 +- .../DataInput/Textarea.stories.svelte | 4 +-- .../lib/components/DataInput/Textarea.svelte | 6 +++-- .../Feedback/Loading.stories.svelte | 4 +-- .../lib/components/Feedback/Loading.svelte | 5 ++-- .../Navigation/Tabs/Tabs.stories.svelte | 4 +-- .../components/Navigation/Tabs/Tabs.svelte | 3 ++- packages/svelte/src/lib/types/daisy-sizes.ts | 2 +- 12 files changed, 47 insertions(+), 17 deletions(-) diff --git a/packages/svelte/src/lib/components/Actions/Button.svelte b/packages/svelte/src/lib/components/Actions/Button.svelte index e99bd9f..8a4630b 100644 --- a/packages/svelte/src/lib/components/Actions/Button.svelte +++ b/packages/svelte/src/lib/components/Actions/Button.svelte @@ -56,6 +56,7 @@ class:btn-sm={size === 'sm'} class:btn-md={size === 'md'} class:btn-lg={size === 'lg'} + class:btn-xl={size === 'xl'} class:btn-outline={style === 'outline'} class:btn-dash={style === 'dash'} class:btn-soft={style === 'soft'} diff --git a/packages/svelte/src/lib/components/DataDisplay/Avatar.stories.svelte b/packages/svelte/src/lib/components/DataDisplay/Avatar.stories.svelte index d0e18e4..4d4a3a9 100644 --- a/packages/svelte/src/lib/components/DataDisplay/Avatar.stories.svelte +++ b/packages/svelte/src/lib/components/DataDisplay/Avatar.stories.svelte @@ -40,7 +40,7 @@ }, size: { control: 'radio', - options: ['xs', 'sm', 'md', 'lg'], + options: ['xs', 'sm', 'md', 'lg', 'xl'], }, }, }); @@ -60,6 +60,29 @@ + + {@render template({ + size: 'xs', + placeholder: 'XS', + })} + {@render template({ + size: 'sm', + placeholder: 'SM', + })} + {@render template({ + size: 'md', + placeholder: 'MD', + })} + {@render template({ + size: 'lg', + placeholder: 'LG', + })} + {@render template({ + size: 'xl', + placeholder: 'XL', + })} + + {@render template({ placeholder: 'BP' })} diff --git a/packages/svelte/src/lib/components/DataDisplay/Avatar.svelte b/packages/svelte/src/lib/components/DataDisplay/Avatar.svelte index f89b792..3ee4342 100644 --- a/packages/svelte/src/lib/components/DataDisplay/Avatar.svelte +++ b/packages/svelte/src/lib/components/DataDisplay/Avatar.svelte @@ -46,7 +46,8 @@ 'w-12': size === 'xs', 'w-16': size === 'sm', 'w-20': size === 'md', - 'w-32': size === 'lg', + 'w-24': size === 'lg', + 'w-32': size === 'xl', 'avatar-ring ring-offset-base-100 ring ring-offset-2': !!ring, }) )} @@ -64,8 +65,9 @@ {placeholder} {:else} {placeholder} {/if} diff --git a/packages/svelte/src/lib/components/DataDisplay/Badge.stories.svelte b/packages/svelte/src/lib/components/DataDisplay/Badge.stories.svelte index 28b1b6e..b7e3f49 100644 --- a/packages/svelte/src/lib/components/DataDisplay/Badge.stories.svelte +++ b/packages/svelte/src/lib/components/DataDisplay/Badge.stories.svelte @@ -23,7 +23,7 @@ }, size: { control: 'radio', - options: ['xs', 'sm', 'md', 'lg'], + options: ['xs', 'sm', 'md', 'lg', 'xl'], }, style: { control: 'radio', diff --git a/packages/svelte/src/lib/components/DataDisplay/Badge.svelte b/packages/svelte/src/lib/components/DataDisplay/Badge.svelte index ceabc13..f0693a1 100644 --- a/packages/svelte/src/lib/components/DataDisplay/Badge.svelte +++ b/packages/svelte/src/lib/components/DataDisplay/Badge.svelte @@ -9,7 +9,7 @@ type Props = { children: Snippet; color?: DaisyColor; - size?: DaisySize | 'xl'; + size?: DaisySize; style?: BadgeStyle; }; diff --git a/packages/svelte/src/lib/components/DataInput/Textarea.stories.svelte b/packages/svelte/src/lib/components/DataInput/Textarea.stories.svelte index 8aa4d9b..b34f54b 100644 --- a/packages/svelte/src/lib/components/DataInput/Textarea.stories.svelte +++ b/packages/svelte/src/lib/components/DataInput/Textarea.stories.svelte @@ -38,7 +38,7 @@ }, size: { control: 'select', - options: ['xs', 'sm', '-', 'lg'], + options: ['xs', 'sm', 'md', 'lg', 'xl'], }, }, }); @@ -48,4 +48,4 @@ - + \ No newline at end of file diff --git a/packages/svelte/src/lib/components/Feedback/Loading.stories.svelte b/packages/svelte/src/lib/components/Feedback/Loading.stories.svelte index 8de2377..9a66813 100644 --- a/packages/svelte/src/lib/components/Feedback/Loading.stories.svelte +++ b/packages/svelte/src/lib/components/Feedback/Loading.stories.svelte @@ -20,7 +20,7 @@ 'error', ], }, - size: { control: 'select', options: ['xs', 'sm', 'md', 'lg'] }, + size: { control: 'select', options: ['xs', 'sm', 'md', 'lg', 'xl'] }, variant: { control: 'select', options: ['spinner', 'dots', 'ring', 'ball', 'bars', 'infinity'], @@ -37,4 +37,4 @@ name="Default" args={{ color: 'neutral', size: 'md', variant: 'spinner' }} children={template} -/> +/> \ No newline at end of file diff --git a/packages/svelte/src/lib/components/Feedback/Loading.svelte b/packages/svelte/src/lib/components/Feedback/Loading.svelte index 8f43e88..2371bd4 100644 --- a/packages/svelte/src/lib/components/Feedback/Loading.svelte +++ b/packages/svelte/src/lib/components/Feedback/Loading.svelte @@ -6,7 +6,7 @@ type Props = { color?: Exclude; - size?: DaisySize | 'md'; + size?: DaisySize; variant?: 'spinner' | 'dots' | 'ring' | 'ball' | 'bars' | 'infinity'; } & Pick; let { class: className, color, size = 'md', variant = 'spinner' }: Props = $props(); @@ -25,10 +25,11 @@ class:loading-sm={size === 'sm'} class:loading-md={size === 'md'} class:loading-lg={size === 'lg'} + class:loading-xl={size === 'xl'} class:loading-spinner={variant === 'spinner'} class:loading-dots={variant === 'dots'} class:loading-ring={variant === 'ring'} class:loading-ball={variant === 'ball'} class:loading-bars={variant === 'bars'} class:loading-infinity={variant === 'infinity'} -> +> \ No newline at end of file diff --git a/packages/svelte/src/lib/components/Navigation/Tabs/Tabs.stories.svelte b/packages/svelte/src/lib/components/Navigation/Tabs/Tabs.stories.svelte index 828b063..8eede22 100644 --- a/packages/svelte/src/lib/components/Navigation/Tabs/Tabs.stories.svelte +++ b/packages/svelte/src/lib/components/Navigation/Tabs/Tabs.stories.svelte @@ -10,7 +10,7 @@ argTypes: { size: { control: 'select', - options: ['xs', 'sm', 'rg', 'lg'], + options: ['xs', 'sm', 'md', 'lg', 'xl'], }, variant: { control: 'select', @@ -24,4 +24,4 @@ {/snippet} - + \ No newline at end of file diff --git a/packages/svelte/src/lib/components/Navigation/Tabs/Tabs.svelte b/packages/svelte/src/lib/components/Navigation/Tabs/Tabs.svelte index a0a7e77..06a981d 100644 --- a/packages/svelte/src/lib/components/Navigation/Tabs/Tabs.svelte +++ b/packages/svelte/src/lib/components/Navigation/Tabs/Tabs.svelte @@ -18,6 +18,7 @@ class:tabs-xs={size === 'xs'} class:tabs-sm={size === 'sm'} class:tabs-lg={size === 'lg'} + class:tabs-xl={size === 'xl'} class:tabs-bordered={variant === 'bordered'} class:tabs-lifted={variant === 'lifted'} class:tabs-boxed={variant === 'boxed'} @@ -33,4 +34,4 @@ /> {/key} {/each} - + \ No newline at end of file diff --git a/packages/svelte/src/lib/types/daisy-sizes.ts b/packages/svelte/src/lib/types/daisy-sizes.ts index ebbd8de..b73cc8b 100644 --- a/packages/svelte/src/lib/types/daisy-sizes.ts +++ b/packages/svelte/src/lib/types/daisy-sizes.ts @@ -1 +1 @@ -export type DaisySize = 'xs' | 'sm' | 'md' | 'lg'; \ No newline at end of file +export type DaisySize = 'xs' | 'sm' | 'md' | 'lg' | 'xl'; \ No newline at end of file