diff --git a/src/theme/accordion.ts b/src/theme/accordion.ts index 038c18f3..63ac5736 100644 --- a/src/theme/accordion.ts +++ b/src/theme/accordion.ts @@ -3,7 +3,7 @@ export default { root: 'w-full', item: 'border-b border-gray-200 dark:border-gray-800 last:border-b-0', header: 'flex', - trigger: 'group flex-1 flex items-center gap-1.5 font-medium text-sm hover:underline py-3.5 disabled:cursor-not-allowed disabled:opacity-75 disabled:hover:no-underline focus-visible:ring-2 focus-visible:ring-primary-500 dark:focus-visible:ring-primary-400 focus-visible:outline-0', + trigger: 'group flex-1 flex items-center gap-1.5 font-medium text-sm py-3.5 disabled:cursor-not-allowed disabled:opacity-75 focus-visible:outline-primary-500 dark:focus-visible:outline-primary-400', content: 'text-sm pb-3.5 data-[state=open]:animate-[accordion-down_200ms_ease-in-out] data-[state=closed]:animate-[accordion-up_200ms_ease-in-out] overflow-hidden focus:outline-none', leadingIcon: 'shrink-0 size-5', trailingIcon: 'ms-auto size-5 group-data-[state=open]:rotate-180 transition-transform duration-200', diff --git a/src/theme/button.ts b/src/theme/button.ts index 76186f00..8f40b8cf 100644 --- a/src/theme/button.ts +++ b/src/theme/button.ts @@ -1,6 +1,6 @@ export default (config: { colors: string[] }) => ({ slots: { - base: 'rounded-md font-medium inline-flex items-center focus:outline-none focus-visible:outline-0 disabled:cursor-not-allowed disabled:opacity-75', + base: 'rounded-md font-medium inline-flex items-center focus:outline-none disabled:cursor-not-allowed disabled:opacity-75', label: '', leadingIcon: 'shrink-0', trailingIcon: 'shrink-0' @@ -78,7 +78,7 @@ export default (config: { colors: string[] }) => ({ compoundVariants: [...config.colors.map((color: string) => ({ color, variant: 'solid', - class: `shadow-sm text-white dark:text-gray-900 bg-${color}-500 hover:bg-${color}-600 disabled:bg-${color}-500 dark:bg-${color}-400 dark:hover:bg-${color}-500 dark:disabled:bg-${color}-400 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-${color}-500 dark:focus-visible:outline-${color}-400` + class: `shadow-sm text-white dark:text-gray-900 bg-${color}-500 hover:bg-${color}-600 disabled:bg-${color}-500 dark:bg-${color}-400 dark:hover:bg-${color}-500 dark:disabled:bg-${color}-400 focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-${color}-500 dark:focus-visible:outline-${color}-400` })), ...config.colors.map((color: string) => ({ color, variant: 'outline', diff --git a/src/theme/checkbox.ts b/src/theme/checkbox.ts index f84fb4c1..ec15564a 100644 --- a/src/theme/checkbox.ts +++ b/src/theme/checkbox.ts @@ -1,7 +1,7 @@ export default (config: { colors: string[] }) => ({ slots: { root: 'relative flex items-start', - base: 'shrink-0 text-white dark:text-gray-900 rounded ring ring-inset ring-gray-300 dark:ring-gray-700 focus:outline-none focus-visible:outline-0 focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-offset-white dark:focus-visible:ring-offset-gray-900', + base: 'shrink-0 text-white dark:text-gray-900 rounded ring ring-inset ring-gray-300 dark:ring-gray-700 focus:outline-none focus-visible:outline-2 focus-visible:outline-offset-2', container: 'flex items-center', wrapper: 'ms-2', indicator: 'flex', @@ -10,7 +10,7 @@ export default (config: { colors: string[] }) => ({ description: 'text-gray-500 dark:text-gray-400' }, variants: { - color: Object.fromEntries(config.colors.map((color: string) => [color, `focus-visible:ring-${color}-500 dark:focus-visible:ring-${color}-400`])), + color: Object.fromEntries(config.colors.map((color: string) => [color, `focus-visible:outline-${color}-500 dark:focus-visible:outline-${color}-400`])), size: { '2xs': { base: 'size-3', diff --git a/src/theme/tabs.ts b/src/theme/tabs.ts index bf3721e4..22f0c4d4 100644 --- a/src/theme/tabs.ts +++ b/src/theme/tabs.ts @@ -4,7 +4,7 @@ export default { list: 'relative w-full flex data-[orientation=vertical]:flex-col data-[orientation=vertical]:items-center justify-center rounded-lg bg-gray-50 dark:bg-gray-800 data-[orientation=horizontal]:h-10 p-1 group', // FIXME: Replace transition with `transition-[width,transform]` when available indicator: 'absolute group-data-[orientation=horizontal]:left-0 group-data-[orientation=vertical]:top-0 group-data-[orientation=horizontal]:inset-y-1 group-data-[orientation=vertical]:inset-x-1 group-data-[orientation=horizontal]:w-[--radix-tabs-indicator-size] group-data-[orientation=vertical]:h-[--radix-tabs-indicator-size] group-data-[orientation=horizontal]:translate-x-[--radix-tabs-indicator-position] group-data-[orientation=vertical]:translate-y-[--radix-tabs-indicator-position] transition-transform duration-200 bg-white dark:bg-gray-900 rounded-md shadow-sm', - trigger: 'relative inline-flex items-center justify-center shrink-0 w-full h-8 text-gray-500 data-[state=active]:text-gray-900 dark:text-gray-400 dark:data-[state=active]:text-white px-3 text-sm font-medium rounded-md disabled:cursor-not-allowed disabled:opacity-75 transition-colors duration-200 ease-out focus-visible:ring-2 focus-visible:ring-primary-500 dark:focus-visible:ring-primary-400 focus-visible:outline-0', + trigger: 'relative inline-flex items-center justify-center shrink-0 w-full h-8 text-gray-500 data-[state=active]:text-gray-900 dark:text-gray-400 dark:data-[state=active]:text-white px-3 text-sm font-medium rounded-md disabled:cursor-not-allowed disabled:opacity-75 transition-colors duration-200 ease-out focus-visible:ring-2 focus-visible:ring-primary-500 dark:focus-visible:ring-primary-400 focus:outline-none', content: 'focus:outline-none', label: 'truncate' } diff --git a/test/components/__snapshots__/Accordion.spec.ts.snap b/test/components/__snapshots__/Accordion.spec.ts.snap index 613d3563..cbf4b54f 100644 --- a/test/components/__snapshots__/Accordion.spec.ts.snap +++ b/test/components/__snapshots__/Accordion.spec.ts.snap @@ -3,7 +3,7 @@ exports[`Accordion > renders basic case correctly 1`] = ` "
-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

-

" `; -exports[`Button > renders with class correctly 1`] = `""`; +exports[`Button > renders with class correctly 1`] = `""`; exports[`Button > renders with color correctly 1`] = ` -"" `; exports[`Button > renders with default slot correctly 1`] = ` -"" `; exports[`Button > renders with disabled correctly 1`] = ` -"" `; exports[`Button > renders with icon correctly 1`] = ` -"" `; exports[`Button > renders with leading and icon correctly 1`] = ` -"" `; exports[`Button > renders with size lg correctly 1`] = ` -"" `; exports[`Button > renders with size md correctly 1`] = ` -"" `; exports[`Button > renders with size sm correctly 1`] = ` -"" `; exports[`Button > renders with size xl correctly 1`] = ` -"" `; exports[`Button > renders with size xs correctly 1`] = ` -"" `; exports[`Button > renders with square correctly 1`] = ` -"" `; exports[`Button > renders with trailing and icon correctly 1`] = ` -"" `; exports[`Button > renders with variant ghost correctly 1`] = ` -"" `; exports[`Button > renders with variant link correctly 1`] = ` -"" `; exports[`Button > renders with variant outline correctly 1`] = ` -"" `; exports[`Button > renders with variant soft correctly 1`] = ` -"" diff --git a/test/components/__snapshots__/Checkbox.spec.ts.snap b/test/components/__snapshots__/Checkbox.spec.ts.snap index e494edb0..1b0f3511 100644 --- a/test/components/__snapshots__/Checkbox.spec.ts.snap +++ b/test/components/__snapshots__/Checkbox.spec.ts.snap @@ -2,7 +2,7 @@ exports[`Checkbox > renders basic case correctly 1`] = ` "
-
@@ -13,7 +13,7 @@ exports[`Checkbox > renders basic case correctly 1`] = ` exports[`Checkbox > renders with custom color correctly 1`] = ` "
-
@@ -26,7 +26,7 @@ exports[`Checkbox > renders with custom color correctly 1`] = ` exports[`Checkbox > renders with custom id correctly 1`] = ` "
-
@@ -37,7 +37,7 @@ exports[`Checkbox > renders with custom id correctly 1`] = ` exports[`Checkbox > renders with custom name correctly 1`] = ` "
-
@@ -48,7 +48,7 @@ exports[`Checkbox > renders with custom name correctly 1`] = ` exports[`Checkbox > renders with custom value correctly 1`] = ` "
-
@@ -59,7 +59,7 @@ exports[`Checkbox > renders with custom value correctly 1`] = ` exports[`Checkbox > renders with disabled correctly 1`] = ` "
-
@@ -70,7 +70,7 @@ exports[`Checkbox > renders with disabled correctly 1`] = ` exports[`Checkbox > renders with help correctly 1`] = ` "
-
@@ -83,7 +83,7 @@ exports[`Checkbox > renders with help correctly 1`] = ` exports[`Checkbox > renders with indeterminate correctly 1`] = ` "
-
+
@@ -92,7 +92,7 @@ exports[`Checkbox > renders with indeterminate correctly 1`] = ` exports[`Checkbox > renders with label correctly 1`] = ` "
-
@@ -105,7 +105,7 @@ exports[`Checkbox > renders with label correctly 1`] = ` exports[`Checkbox > renders with required correctly 1`] = ` "
-
@@ -118,7 +118,7 @@ exports[`Checkbox > renders with required correctly 1`] = ` exports[`Checkbox > renders with size 2xs correctly 1`] = ` "
-
@@ -129,7 +129,7 @@ exports[`Checkbox > renders with size 2xs correctly 1`] = ` exports[`Checkbox > renders with size lg correctly 1`] = ` "
-
@@ -140,7 +140,7 @@ exports[`Checkbox > renders with size lg correctly 1`] = ` exports[`Checkbox > renders with size md correctly 1`] = ` "
-
@@ -151,7 +151,7 @@ exports[`Checkbox > renders with size md correctly 1`] = ` exports[`Checkbox > renders with size sm correctly 1`] = ` "
-
@@ -162,7 +162,7 @@ exports[`Checkbox > renders with size sm correctly 1`] = ` exports[`Checkbox > renders with size xl correctly 1`] = ` "
-
@@ -173,7 +173,7 @@ exports[`Checkbox > renders with size xl correctly 1`] = ` exports[`Checkbox > renders with size xs correctly 1`] = ` "
-
@@ -184,7 +184,7 @@ exports[`Checkbox > renders with size xs correctly 1`] = ` exports[`Checkbox > renders with slot correctly 1`] = ` "
-
@@ -195,7 +195,7 @@ exports[`Checkbox > renders with slot correctly 1`] = ` exports[`Checkbox > renders with slot label correctly 1`] = ` "
-
diff --git a/test/components/__snapshots__/Modal.spec.ts.snap b/test/components/__snapshots__/Modal.spec.ts.snap index bd0dc689..78bb12ef 100644 --- a/test/components/__snapshots__/Modal.spec.ts.snap +++ b/test/components/__snapshots__/Modal.spec.ts.snap @@ -9,7 +9,7 @@ exports[`Modal > renders basic case correctly 1`] = `