@shuriken-ui/tailwind 2.0.0-next.0 → 2.0.0-next.10

package/dist/index.d.cts

@@ -1,7 +1,7 @@
-import { S as ShurikenUIConfig } from './shared/tailwind.8efc2b9e.cjs';
-export { c as createPreset, h as hasPreset, p as preset } from './shared/tailwind.8efc2b9e.cjs';
-import 'tailwindcss';
+import { S as ShurikenUIConfig } from './shared/tailwind.d65f80d7.cjs';
+export { c as createPreset, h as hasPreset, p as preset } from './shared/tailwind.d65f80d7.cjs';
 import 'tailwindcss/types/config';
+import 'tailwindcss';
 import '@tailwindcss/typography';
 
 declare function withShurikenUI(config: ShurikenUIConfig): ShurikenUIConfig;

package/dist/index.d.mts

@@ -1,7 +1,7 @@
-import { S as ShurikenUIConfig } from './shared/tailwind.8efc2b9e.mjs';
-export { c as createPreset, h as hasPreset, p as preset } from './shared/tailwind.8efc2b9e.mjs';
-import 'tailwindcss';
+import { S as ShurikenUIConfig } from './shared/tailwind.d65f80d7.mjs';
+export { c as createPreset, h as hasPreset, p as preset } from './shared/tailwind.d65f80d7.mjs';
 import 'tailwindcss/types/config';
+import 'tailwindcss';
 import '@tailwindcss/typography';
 
 declare function withShurikenUI(config: ShurikenUIConfig): ShurikenUIConfig;

package/dist/index.d.ts

@@ -1,7 +1,7 @@
-import { S as ShurikenUIConfig } from './shared/tailwind.8efc2b9e.js';
-export { c as createPreset, h as hasPreset, p as preset } from './shared/tailwind.8efc2b9e.js';
-import 'tailwindcss';
+import { S as ShurikenUIConfig } from './shared/tailwind.d65f80d7.js';
+export { c as createPreset, h as hasPreset, p as preset } from './shared/tailwind.d65f80d7.js';
 import 'tailwindcss/types/config';
+import 'tailwindcss';
 import '@tailwindcss/typography';
 
 declare function withShurikenUI(config: ShurikenUIConfig): ShurikenUIConfig;

package/dist/preset.cjs

@@ -1290,11 +1290,7 @@ const defaultConfig$P = {
   },
   img: {
     size: "full",
-    shadow: "sm",
-    border: {
-      light: "transparent",
-      dark: "transparent"
-    }
+    shadow: "sm"
   },
   text: {
     font: {
@@ -1674,8 +1670,6 @@ const avatar = plugin__default.withOptions(
             [`@apply object-cover`]: {},
             //Size & Radius
             [`@apply h-${config.img.size} max-h-${config.img.size} w-${config.img.size} max-w-${config.img.size}`]: {},
-            //Border
-            [`@apply border border-${config.img.border.light} dark:border-${config.img.border.dark}`]: {},
             //Shadow
             [`@apply shadow-${config.img.shadow}`]: {}
           },
@@ -4343,7 +4337,7 @@ const defaultConfig$I = {
           },
           dark: {
             base: "transparent",
-            hover: "muted-800",
+            hover: "white",
             active: "muted-700",
             focus: "muted-800"
           }
@@ -4415,7 +4409,7 @@ const defaultConfig$I = {
         background: {
           light: {
             base: "transparent",
-            hover: "white",
+            hover: "muted-300",
             active: "muted-400",
             focus: "muted-300"
           },
@@ -5389,63 +5383,63 @@ const card = plugin__default.withOptions(
           //Color:white
           [`&.${prefix}card-white`]: {
             //Border
-            [`@apply border border-${config.color.white.border.light} dark:border-${config.color.white.border.light}`]: {},
+            [`@apply border border-${config.color.white.border.light} dark:border-${config.color.white.border.dark}`]: {},
             //Background
             [`@apply bg-${config.color.white.background.light} dark:bg-${config.color.white.background.dark}`]: {}
           },
           //Color:whiteContrast
           [`&.${prefix}card-white-contrast`]: {
             //Border
-            [`@apply border border-${config.color.whiteContrast.border.light} dark:border-${config.color.whiteContrast.border.light}`]: {},
+            [`@apply border border-${config.color.whiteContrast.border.light} dark:border-${config.color.whiteContrast.border.dark}`]: {},
             //Background
             [`@apply bg-${config.color.whiteContrast.background.light} dark:bg-${config.color.whiteContrast.background.dark}`]: {}
           },
           //Color:muted
           [`&.${prefix}card-muted`]: {
             //Border
-            [`@apply border border-${config.color.muted.border.light} dark:border-${config.color.muted.border.light}`]: {},
+            [`@apply border border-${config.color.muted.border.light} dark:border-${config.color.muted.border.dark}`]: {},
             //Background
             [`@apply bg-${config.color.muted.background.light} dark:bg-${config.color.muted.background.dark}`]: {}
           },
           //Color:mutedContrast
           [`&.${prefix}card-muted-contrast`]: {
             //Border
-            [`@apply border border-${config.color.mutedContrast.border.light} dark:border-${config.color.mutedContrast.border.light}`]: {},
+            [`@apply border border-${config.color.mutedContrast.border.light} dark:border-${config.color.mutedContrast.border.dark}`]: {},
             //Background
             [`@apply bg-${config.color.mutedContrast.background.light} dark:bg-${config.color.mutedContrast.background.dark}`]: {}
           },
           //Color:primary
           [`&.${prefix}card-primary`]: {
             //Border
-            [`@apply border border-${config.color.primary.border.light} dark:border-${config.color.primary.border.light}`]: {},
+            [`@apply border border-${config.color.primary.border.light} dark:border-${config.color.primary.border.dark}`]: {},
             //Background
             [`@apply bg-${config.color.primary.background.light} dark:bg-${config.color.primary.background.dark}`]: {}
           },
           //Color:info
           [`&.${prefix}card-info`]: {
             //Border
-            [`@apply border border-${config.color.info.border.light} dark:border-${config.color.info.border.light}`]: {},
+            [`@apply border border-${config.color.info.border.light} dark:border-${config.color.info.border.dark}`]: {},
             //Background
             [`@apply bg-${config.color.info.background.light} dark:bg-${config.color.info.background.dark}`]: {}
           },
           //Color:success
           [`&.${prefix}card-success`]: {
             //Border
-            [`@apply border border-${config.color.success.border.light} dark:border-${config.color.success.border.light}`]: {},
+            [`@apply border border-${config.color.success.border.light} dark:border-${config.color.success.border.dark}`]: {},
             //Background
             [`@apply bg-${config.color.success.background.light} dark:bg-${config.color.success.background.dark}`]: {}
           },
           //Color:warning
           [`&.${prefix}card-warning`]: {
             //Border
-            [`@apply border border-${config.color.warning.border.light} dark:border-${config.color.warning.border.light}`]: {},
+            [`@apply border border-${config.color.warning.border.light} dark:border-${config.color.warning.border.dark}`]: {},
             //Background
             [`@apply bg-${config.color.warning.background.light} dark:bg-${config.color.warning.background.dark}`]: {}
           },
           //Color:danger
           [`&.${prefix}card-danger`]: {
             //Border
-            [`@apply border border-${config.color.danger.border.light} dark:border-${config.color.danger.border.light}`]: {},
+            [`@apply border border-${config.color.danger.border.light} dark:border-${config.color.danger.border.dark}`]: {},
             //Background
             [`@apply bg-${config.color.danger.background.light} dark:bg-${config.color.danger.background.dark}`]: {}
           },
@@ -5600,7 +5594,7 @@ const checkbox = plugin__default.withOptions(
           [`.${prefix}checkbox-inner`]: {
             [`@apply absolute start-0 top-0 z-0 h-${config.inner.size} w-${config.inner.size}`]: {},
             //Background
-            [`@apply bg-${config.inner.background.light} dark:bg-${config.inner.background.light}`]: {},
+            [`@apply bg-${config.inner.background.light} dark:bg-${config.inner.background.dark}`]: {},
             //Border
             [`@apply border-2 border-${config.inner.border.light} dark:border-${config.inner.border.dark}`]: {}
           },
@@ -5832,7 +5826,11 @@ const dropdownItem = plugin__default.withOptions(
           },
           //Color:default
           [`&.${prefix}item-default`]: {
-            [`&.${prefix}active, &:hover`]: {
+            //Background:hover
+            [`@apply hover:bg-${config.color.default.background.light} dark:hover:bg-${config.color.default.background.dark}`]: {},
+            //Font:hover
+            [`@apply hover:text-${config.color.default.font.color.light} dark:hover:text-${config.color.default.font.color.dark}`]: {},
+            [`&.${prefix}active`]: {
               //Background:hover
               [`@apply bg-${config.color.default.background.light} dark:bg-${config.color.default.background.dark}`]: {},
               //Font:hover
@@ -5841,7 +5839,11 @@ const dropdownItem = plugin__default.withOptions(
           },
           //Color:contrast
           [`&.${prefix}item-contrast`]: {
-            [`&.${prefix}active, &:hover`]: {
+            //Background:hover
+            [`@apply hover:bg-${config.color.contrast.background.light} dark:hover:bg-${config.color.contrast.background.dark}`]: {},
+            //Font:hover
+            [`@apply hover:text-${config.color.contrast.font.color.light} dark:hover:text-${config.color.contrast.font.color.dark}`]: {},
+            [`&.${prefix}active`]: {
               //Background:hover
               [`@apply bg-${config.color.contrast.background.light} dark:bg-${config.color.contrast.background.dark}`]: {},
               //Font:hover
@@ -10561,7 +10563,7 @@ const listbox = plugin__default.withOptions(
             [`@apply text-${config.error.font.color.light} dark:text-${config.error.font.color.dark}`]: {}
           },
           //Listbox:placeload
-          [`.${prefix}listbox-placeload`]: {
+          [`.${prefix}listbox-placeload.${prefix}loading-placeload`]: {
             [`@apply absolute start-0 top-0 flex w-full items-center px-4`]: {},
             [`.${prefix}placeload`]: {
               [`@apply h-3 w-full max-w-[75%] rounded`]: {}
@@ -10795,7 +10797,7 @@ const listbox = plugin__default.withOptions(
           //Listbox:loading
           [`&.${prefix}listbox-loading`]: {
             [`.${prefix}listbox-button`]: {
-              [`@apply !text-transparent placeholder:!text-transparent dark:placeholder:!text-transparent`]: {}
+              [`@apply !text-transparent placeholder:!text-transparent dark:placeholder:!text-transparent pointer-events-none`]: {}
             },
             [`.${prefix}listbox-button ~ .${prefix}label-float`]: {
               [`@apply text-transparent`]: {}
@@ -10861,7 +10863,7 @@ const listbox = plugin__default.withOptions(
             [`.${prefix}label-float`]: {
               [`@apply start-3 -ms-3 -mt-7 text-${config.icon.disabled.label.float.sm.font.size} text-transparent`]: {}
             },
-            [`.${prefix}listbox-button:focus-visible ~ .${prefix}label-float, .${prefix}listbox-button:focus ~ .${prefix}label-float`]: {
+            [`.${prefix}listbox-button:focus-visible ~ .${prefix}label-float, .${prefix}listbox-button:focus ~ .${prefix}label-float, .${prefix}label-float-active`]: {
               [`@apply !-ms-3 !-mt-7 !text-${config.label.float.font.color}`]: {}
             },
             [`.${prefix}listbox-button ~ .${prefix}label-float`]: {
@@ -10873,7 +10875,7 @@ const listbox = plugin__default.withOptions(
             [`.${prefix}label-float`]: {
               [`@apply start-8 -ms-8 -mt-7 text-${config.icon.disabled.label.float.sm.font.size} text-transparent`]: {}
             },
-            [`.${prefix}listbox-button:focus-visible ~ .${prefix}label-float, .${prefix}listbox-button:focus ~ .${prefix}label-float`]: {
+            [`.${prefix}listbox-button:focus-visible ~ .${prefix}label-float, .${prefix}listbox-button:focus ~ .${prefix}label-float, .${prefix}label-float-active`]: {
               [`@apply !-ms-8 !-mt-7 !text-${config.label.float.font.color}`]: {}
             },
             [`.${prefix}listbox-button ~ .${prefix}label-float`]: {
@@ -10883,10 +10885,10 @@ const listbox = plugin__default.withOptions(
           //Without:icon && Size:md && Label:float
           [`&.${prefix}listbox-label-float:not(.${prefix}has-icon).${prefix}listbox-md`]: {
             [`.${prefix}label-float`]: {
-              [`@apply start-3 -ms-3 -mt-8 text-${config.icon.disabled.label.float.md.font.size.base} text-transparent`]: {}
+              [`@apply start-3 -ms-3 -mt-7 text-${config.icon.disabled.label.float.md.font.size.base} text-transparent`]: {}
             },
-            [`.${prefix}listbox-button:focus-visible ~ .${prefix}label-float, .${prefix}listbox-button:focus ~ .${prefix}label-float`]: {
-              [`@apply !-ms-3 !-mt-8 !text-${config.icon.disabled.label.float.md.font.size.focus} !text-${config.label.float.font.color}`]: {}
+            [`.${prefix}listbox-button:focus-visible ~ .${prefix}label-float, .${prefix}listbox-button:focus ~ .${prefix}label-float, .${prefix}label-float-active`]: {
+              [`@apply !-ms-3 !-mt-7 !text-${config.icon.disabled.label.float.md.font.size.focus} !text-${config.label.float.font.color}`]: {}
             },
             [`.${prefix}listbox-button ~ .${prefix}label-float`]: {
               [`@apply ms-0 mt-0 text-${config.icon.disabled.label.float.md.font.size.base}`]: {}
@@ -10895,10 +10897,10 @@ const listbox = plugin__default.withOptions(
           //With:icon && Size:md && Label:float
           [`&.${prefix}listbox-label-float.${prefix}has-icon.${prefix}listbox-md`]: {
             [`.${prefix}label-float`]: {
-              [`@apply start-10 -ms-10 -mt-8 text-${config.icon.enabled.label.float.md.font.size.base} text-transparent`]: {}
+              [`@apply start-10 -ms-10 -mt-7 text-${config.icon.enabled.label.float.md.font.size.base} text-transparent`]: {}
             },
-            [`.${prefix}listbox-button:focus-visible ~ .${prefix}label-float, .${prefix}listbox-button:focus ~ .${prefix}label-float`]: {
-              [`@apply !-ms-10 !-mt-8 !text-${config.icon.enabled.label.float.md.font.size.focus} !text-${config.label.float.font.color}`]: {}
+            [`.${prefix}listbox-button:focus-visible ~ .${prefix}label-float, .${prefix}listbox-button:focus ~ .${prefix}label-float, .${prefix}label-float-active`]: {
+              [`@apply !-ms-10 !-mt-7 !text-${config.icon.enabled.label.float.md.font.size.focus} !text-${config.label.float.font.color}`]: {}
             },
             [`.${prefix}listbox-button ~ .${prefix}label-float`]: {
               [`@apply ms-0 mt-0 text-${config.icon.enabled.label.float.md.font.size.unfocus}`]: {}
@@ -10907,10 +10909,10 @@ const listbox = plugin__default.withOptions(
           //Without:icon && Size:lg && Label:float
           [`&.${prefix}listbox-label-float:not(.${prefix}has-icon).${prefix}listbox-lg`]: {
             [`.${prefix}label-float`]: {
-              [`@apply start-3 -ms-3 -mt-8 text-${config.icon.disabled.label.float.lg.font.size.base} text-transparent`]: {}
+              [`@apply start-3 -ms-3 -mt-7 text-${config.icon.disabled.label.float.lg.font.size.base} text-transparent`]: {}
             },
-            [`.${prefix}listbox-button:focus-visible ~ .${prefix}label-float, .${prefix}listbox-button:focus ~ .${prefix}label-float`]: {
-              [`@apply !-ms-3 !-mt-9 !text-${config.icon.disabled.label.float.lg.font.size.focus} !text-${config.label.float.font.color}`]: {}
+            [`.${prefix}listbox-button:focus-visible ~ .${prefix}label-float, .${prefix}listbox-button:focus ~ .${prefix}label-float, .${prefix}label-float-active`]: {
+              [`@apply !-ms-3 !-mt-7 !text-${config.icon.disabled.label.float.lg.font.size.focus} !text-${config.label.float.font.color}`]: {}
             },
             [`.${prefix}listbox-button ~ .${prefix}label-float`]: {
               [`@apply ms-0 mt-0 text-${config.icon.disabled.label.float.lg.font.size.unfocus}`]: {}
@@ -10919,10 +10921,10 @@ const listbox = plugin__default.withOptions(
           //With:icon && Size:lg && Label:float
           [`&.${prefix}listbox-label-float.${prefix}has-icon.${prefix}listbox-lg`]: {
             [`.${prefix}label-float`]: {
-              [`@apply start-11 -ms-10 -mt-8 text-${config.icon.enabled.label.float.lg.font.size.base} text-transparent`]: {}
+              [`@apply start-11 -ms-10 -mt-7 text-${config.icon.enabled.label.float.lg.font.size.base} text-transparent`]: {}
             },
-            [`.${prefix}listbox-button:focus-visible ~ .${prefix}label-float, .${prefix}listbox-button:focus ~ .${prefix}label-float`]: {
-              [`@apply !-ms-10 !-mt-9 !text-${config.icon.enabled.label.float.lg.font.size.focus} !text-${config.label.float.font.color}`]: {}
+            [`.${prefix}listbox-button:focus-visible ~ .${prefix}label-float, .${prefix}listbox-button:focus ~ .${prefix}label-float, .${prefix}label-float-active`]: {
+              [`@apply !-ms-10 !-mt-7 !text-${config.icon.enabled.label.float.lg.font.size.focus} !text-${config.label.float.font.color}`]: {}
             },
             [`.${prefix}listbox-button ~ .${prefix}label-float`]: {
               [`@apply ms-0 mt-0 text-${config.icon.enabled.label.float.lg.font.size.unfocus}`]: {}
@@ -14070,7 +14072,7 @@ const defaultConfig$a = {
     },
     background: {
       light: "white",
-      dark: "white"
+      dark: "muted-950"
     }
   },
   image: {
@@ -15561,7 +15563,7 @@ const tag = plugin__default.withOptions(
               },
               //Shadow:hover
               [`&.${prefix}tag-shadow-hover`]: {
-                [`@apply hover:shadow-${config.variant.solid.primary.shadow.size} hover:shadow-${config.variant.solid.primary.shadow.light} hover:shadow-${config.variant.solid.primary.shadow.dark}`]: {}
+                [`@apply hover:shadow-${config.variant.solid.info.shadow.size} hover:shadow-${config.variant.solid.info.shadow.light} hover:shadow-${config.variant.solid.info.shadow.dark}`]: {}
               }
             },
             //Color:success
@@ -15576,7 +15578,7 @@ const tag = plugin__default.withOptions(
               },
               //Shadow:hover
               [`&.${prefix}tag-shadow-hover`]: {
-                [`@apply hover:shadow-${config.variant.solid.primary.shadow.size} hover:shadow-${config.variant.solid.primary.shadow.light} hover:shadow-${config.variant.solid.primary.shadow.dark}`]: {}
+                [`@apply hover:shadow-${config.variant.solid.success.shadow.size} hover:shadow-${config.variant.solid.success.shadow.light} hover:shadow-${config.variant.solid.success.shadow.dark}`]: {}
               }
             },
             //Color:warning
@@ -15591,7 +15593,7 @@ const tag = plugin__default.withOptions(
               },
               //Shadow:hover
               [`&.${prefix}tag-shadow-hover`]: {
-                [`@apply hover:shadow-${config.variant.solid.primary.shadow.size} hover:shadow-${config.variant.solid.primary.shadow.light} hover:shadow-${config.variant.solid.primary.shadow.dark}`]: {}
+                [`@apply hover:shadow-${config.variant.solid.warning.shadow.size} hover:shadow-${config.variant.solid.warning.shadow.light} hover:shadow-${config.variant.solid.warning.shadow.dark}`]: {}
               }
             },
             //Color:danger
@@ -16182,7 +16184,7 @@ const textarea = plugin__default.withOptions(
           },
           //Textarea
           [`.${prefix}textarea`]: {
-            [`@apply ${prefix}focus w-${config.textarea.width}`]: {},
+            [`@apply ${prefix}focus w-${config.textarea.width} enabled:cursor-default cursor-not-allowed`]: {},
             //Focus:label:float
             [`&:focus-visible ~ .${prefix}label-float`]: {
               [`@apply !text-${config.label.float.font.color} dark:!text-${config.label.float.font.color}`]: {}
@@ -16602,7 +16604,7 @@ const themeSwitch = plugin__default.withOptions(
             [`@apply ring-offset-${config.inverted.disabled.ring.light} dark:ring-offset-${config.inverted.disabled.ring.dark}`]: {},
             [`.${prefix}theme-switch-inner`]: {
               //Border
-              [`@apply border border-${config.inverted.disabled.inner.background.light} dark:border-${config.inverted.disabled.inner.background.dark}`]: {},
+              [`@apply border border-${config.inverted.disabled.inner.border.light} dark:border-${config.inverted.disabled.inner.border.dark}`]: {},
               //Background
               [`@apply bg-${config.inverted.disabled.inner.background.light} dark:bg-${config.inverted.disabled.inner.background.dark}`]: {}
             }

package/dist/preset.d.cts

@@ -1,4 +1,4 @@
-import 'tailwindcss';
 import 'tailwindcss/types/config';
-export { c as createPreset, h as hasPreset, p as preset } from './shared/tailwind.8efc2b9e.cjs';
+export { c as createPreset, h as hasPreset, p as preset } from './shared/tailwind.d65f80d7.cjs';
 import '@tailwindcss/typography';
+import 'tailwindcss';

package/dist/preset.d.mts

@@ -1,4 +1,4 @@
-import 'tailwindcss';
 import 'tailwindcss/types/config';
-export { c as createPreset, h as hasPreset, p as preset } from './shared/tailwind.8efc2b9e.mjs';
+export { c as createPreset, h as hasPreset, p as preset } from './shared/tailwind.d65f80d7.mjs';
 import '@tailwindcss/typography';
+import 'tailwindcss';

package/dist/preset.d.ts

@@ -1,4 +1,4 @@
-import 'tailwindcss';
 import 'tailwindcss/types/config';
-export { c as createPreset, h as hasPreset, p as preset } from './shared/tailwind.8efc2b9e.js';
+export { c as createPreset, h as hasPreset, p as preset } from './shared/tailwind.d65f80d7.js';
 import '@tailwindcss/typography';
+import 'tailwindcss';

package/dist/preset.mjs

@@ -1280,11 +1280,7 @@ const defaultConfig$P = {
   },
   img: {
     size: "full",
-    shadow: "sm",
-    border: {
-      light: "transparent",
-      dark: "transparent"
-    }
+    shadow: "sm"
   },
   text: {
     font: {
@@ -1664,8 +1660,6 @@ const avatar = plugin.withOptions(
             [`@apply object-cover`]: {},
             //Size & Radius
             [`@apply h-${config.img.size} max-h-${config.img.size} w-${config.img.size} max-w-${config.img.size}`]: {},
-            //Border
-            [`@apply border border-${config.img.border.light} dark:border-${config.img.border.dark}`]: {},
             //Shadow
             [`@apply shadow-${config.img.shadow}`]: {}
           },
@@ -4333,7 +4327,7 @@ const defaultConfig$I = {
           },
           dark: {
             base: "transparent",
-            hover: "muted-800",
+            hover: "white",
             active: "muted-700",
             focus: "muted-800"
           }
@@ -4405,7 +4399,7 @@ const defaultConfig$I = {
         background: {
           light: {
             base: "transparent",
-            hover: "white",
+            hover: "muted-300",
             active: "muted-400",
             focus: "muted-300"
           },
@@ -5379,63 +5373,63 @@ const card = plugin.withOptions(
           //Color:white
           [`&.${prefix}card-white`]: {
             //Border
-            [`@apply border border-${config.color.white.border.light} dark:border-${config.color.white.border.light}`]: {},
+            [`@apply border border-${config.color.white.border.light} dark:border-${config.color.white.border.dark}`]: {},
             //Background
             [`@apply bg-${config.color.white.background.light} dark:bg-${config.color.white.background.dark}`]: {}
           },
           //Color:whiteContrast
           [`&.${prefix}card-white-contrast`]: {
             //Border
-            [`@apply border border-${config.color.whiteContrast.border.light} dark:border-${config.color.whiteContrast.border.light}`]: {},
+            [`@apply border border-${config.color.whiteContrast.border.light} dark:border-${config.color.whiteContrast.border.dark}`]: {},
             //Background
             [`@apply bg-${config.color.whiteContrast.background.light} dark:bg-${config.color.whiteContrast.background.dark}`]: {}
           },
           //Color:muted
           [`&.${prefix}card-muted`]: {
             //Border
-            [`@apply border border-${config.color.muted.border.light} dark:border-${config.color.muted.border.light}`]: {},
+            [`@apply border border-${config.color.muted.border.light} dark:border-${config.color.muted.border.dark}`]: {},
             //Background
             [`@apply bg-${config.color.muted.background.light} dark:bg-${config.color.muted.background.dark}`]: {}
           },
           //Color:mutedContrast
           [`&.${prefix}card-muted-contrast`]: {
             //Border
-            [`@apply border border-${config.color.mutedContrast.border.light} dark:border-${config.color.mutedContrast.border.light}`]: {},
+            [`@apply border border-${config.color.mutedContrast.border.light} dark:border-${config.color.mutedContrast.border.dark}`]: {},
             //Background
             [`@apply bg-${config.color.mutedContrast.background.light} dark:bg-${config.color.mutedContrast.background.dark}`]: {}
           },
           //Color:primary
           [`&.${prefix}card-primary`]: {
             //Border
-            [`@apply border border-${config.color.primary.border.light} dark:border-${config.color.primary.border.light}`]: {},
+            [`@apply border border-${config.color.primary.border.light} dark:border-${config.color.primary.border.dark}`]: {},
             //Background
             [`@apply bg-${config.color.primary.background.light} dark:bg-${config.color.primary.background.dark}`]: {}
           },
           //Color:info
           [`&.${prefix}card-info`]: {
             //Border
-            [`@apply border border-${config.color.info.border.light} dark:border-${config.color.info.border.light}`]: {},
+            [`@apply border border-${config.color.info.border.light} dark:border-${config.color.info.border.dark}`]: {},
             //Background
             [`@apply bg-${config.color.info.background.light} dark:bg-${config.color.info.background.dark}`]: {}
           },
           //Color:success
           [`&.${prefix}card-success`]: {
             //Border
-            [`@apply border border-${config.color.success.border.light} dark:border-${config.color.success.border.light}`]: {},
+            [`@apply border border-${config.color.success.border.light} dark:border-${config.color.success.border.dark}`]: {},
             //Background
             [`@apply bg-${config.color.success.background.light} dark:bg-${config.color.success.background.dark}`]: {}
           },
           //Color:warning
           [`&.${prefix}card-warning`]: {
             //Border
-            [`@apply border border-${config.color.warning.border.light} dark:border-${config.color.warning.border.light}`]: {},
+            [`@apply border border-${config.color.warning.border.light} dark:border-${config.color.warning.border.dark}`]: {},
             //Background
             [`@apply bg-${config.color.warning.background.light} dark:bg-${config.color.warning.background.dark}`]: {}
           },
           //Color:danger
           [`&.${prefix}card-danger`]: {
             //Border
-            [`@apply border border-${config.color.danger.border.light} dark:border-${config.color.danger.border.light}`]: {},
+            [`@apply border border-${config.color.danger.border.light} dark:border-${config.color.danger.border.dark}`]: {},
             //Background
             [`@apply bg-${config.color.danger.background.light} dark:bg-${config.color.danger.background.dark}`]: {}
           },
@@ -5590,7 +5584,7 @@ const checkbox = plugin.withOptions(
           [`.${prefix}checkbox-inner`]: {
             [`@apply absolute start-0 top-0 z-0 h-${config.inner.size} w-${config.inner.size}`]: {},
             //Background
-            [`@apply bg-${config.inner.background.light} dark:bg-${config.inner.background.light}`]: {},
+            [`@apply bg-${config.inner.background.light} dark:bg-${config.inner.background.dark}`]: {},
             //Border
             [`@apply border-2 border-${config.inner.border.light} dark:border-${config.inner.border.dark}`]: {}
           },
@@ -5822,7 +5816,11 @@ const dropdownItem = plugin.withOptions(
           },
           //Color:default
           [`&.${prefix}item-default`]: {
-            [`&.${prefix}active, &:hover`]: {
+            //Background:hover
+            [`@apply hover:bg-${config.color.default.background.light} dark:hover:bg-${config.color.default.background.dark}`]: {},
+            //Font:hover
+            [`@apply hover:text-${config.color.default.font.color.light} dark:hover:text-${config.color.default.font.color.dark}`]: {},
+            [`&.${prefix}active`]: {
               //Background:hover
               [`@apply bg-${config.color.default.background.light} dark:bg-${config.color.default.background.dark}`]: {},
               //Font:hover
@@ -5831,7 +5829,11 @@ const dropdownItem = plugin.withOptions(
           },
           //Color:contrast
           [`&.${prefix}item-contrast`]: {
-            [`&.${prefix}active, &:hover`]: {
+            //Background:hover
+            [`@apply hover:bg-${config.color.contrast.background.light} dark:hover:bg-${config.color.contrast.background.dark}`]: {},
+            //Font:hover
+            [`@apply hover:text-${config.color.contrast.font.color.light} dark:hover:text-${config.color.contrast.font.color.dark}`]: {},
+            [`&.${prefix}active`]: {
               //Background:hover
               [`@apply bg-${config.color.contrast.background.light} dark:bg-${config.color.contrast.background.dark}`]: {},
               //Font:hover
@@ -10551,7 +10553,7 @@ const listbox = plugin.withOptions(
             [`@apply text-${config.error.font.color.light} dark:text-${config.error.font.color.dark}`]: {}
           },
           //Listbox:placeload
-          [`.${prefix}listbox-placeload`]: {
+          [`.${prefix}listbox-placeload.${prefix}loading-placeload`]: {
             [`@apply absolute start-0 top-0 flex w-full items-center px-4`]: {},
             [`.${prefix}placeload`]: {
               [`@apply h-3 w-full max-w-[75%] rounded`]: {}
@@ -10785,7 +10787,7 @@ const listbox = plugin.withOptions(
           //Listbox:loading
           [`&.${prefix}listbox-loading`]: {
             [`.${prefix}listbox-button`]: {
-              [`@apply !text-transparent placeholder:!text-transparent dark:placeholder:!text-transparent`]: {}
+              [`@apply !text-transparent placeholder:!text-transparent dark:placeholder:!text-transparent pointer-events-none`]: {}
             },
             [`.${prefix}listbox-button ~ .${prefix}label-float`]: {
               [`@apply text-transparent`]: {}
@@ -10851,7 +10853,7 @@ const listbox = plugin.withOptions(
             [`.${prefix}label-float`]: {
               [`@apply start-3 -ms-3 -mt-7 text-${config.icon.disabled.label.float.sm.font.size} text-transparent`]: {}
             },
-            [`.${prefix}listbox-button:focus-visible ~ .${prefix}label-float, .${prefix}listbox-button:focus ~ .${prefix}label-float`]: {
+            [`.${prefix}listbox-button:focus-visible ~ .${prefix}label-float, .${prefix}listbox-button:focus ~ .${prefix}label-float, .${prefix}label-float-active`]: {
               [`@apply !-ms-3 !-mt-7 !text-${config.label.float.font.color}`]: {}
             },
             [`.${prefix}listbox-button ~ .${prefix}label-float`]: {
@@ -10863,7 +10865,7 @@ const listbox = plugin.withOptions(
             [`.${prefix}label-float`]: {
               [`@apply start-8 -ms-8 -mt-7 text-${config.icon.disabled.label.float.sm.font.size} text-transparent`]: {}
             },
-            [`.${prefix}listbox-button:focus-visible ~ .${prefix}label-float, .${prefix}listbox-button:focus ~ .${prefix}label-float`]: {
+            [`.${prefix}listbox-button:focus-visible ~ .${prefix}label-float, .${prefix}listbox-button:focus ~ .${prefix}label-float, .${prefix}label-float-active`]: {
               [`@apply !-ms-8 !-mt-7 !text-${config.label.float.font.color}`]: {}
             },
             [`.${prefix}listbox-button ~ .${prefix}label-float`]: {
@@ -10873,10 +10875,10 @@ const listbox = plugin.withOptions(
           //Without:icon && Size:md && Label:float
           [`&.${prefix}listbox-label-float:not(.${prefix}has-icon).${prefix}listbox-md`]: {
             [`.${prefix}label-float`]: {
-              [`@apply start-3 -ms-3 -mt-8 text-${config.icon.disabled.label.float.md.font.size.base} text-transparent`]: {}
+              [`@apply start-3 -ms-3 -mt-7 text-${config.icon.disabled.label.float.md.font.size.base} text-transparent`]: {}
             },
-            [`.${prefix}listbox-button:focus-visible ~ .${prefix}label-float, .${prefix}listbox-button:focus ~ .${prefix}label-float`]: {
-              [`@apply !-ms-3 !-mt-8 !text-${config.icon.disabled.label.float.md.font.size.focus} !text-${config.label.float.font.color}`]: {}
+            [`.${prefix}listbox-button:focus-visible ~ .${prefix}label-float, .${prefix}listbox-button:focus ~ .${prefix}label-float, .${prefix}label-float-active`]: {
+              [`@apply !-ms-3 !-mt-7 !text-${config.icon.disabled.label.float.md.font.size.focus} !text-${config.label.float.font.color}`]: {}
             },
             [`.${prefix}listbox-button ~ .${prefix}label-float`]: {
               [`@apply ms-0 mt-0 text-${config.icon.disabled.label.float.md.font.size.base}`]: {}
@@ -10885,10 +10887,10 @@ const listbox = plugin.withOptions(
           //With:icon && Size:md && Label:float
           [`&.${prefix}listbox-label-float.${prefix}has-icon.${prefix}listbox-md`]: {
             [`.${prefix}label-float`]: {
-              [`@apply start-10 -ms-10 -mt-8 text-${config.icon.enabled.label.float.md.font.size.base} text-transparent`]: {}
+              [`@apply start-10 -ms-10 -mt-7 text-${config.icon.enabled.label.float.md.font.size.base} text-transparent`]: {}
             },
-            [`.${prefix}listbox-button:focus-visible ~ .${prefix}label-float, .${prefix}listbox-button:focus ~ .${prefix}label-float`]: {
-              [`@apply !-ms-10 !-mt-8 !text-${config.icon.enabled.label.float.md.font.size.focus} !text-${config.label.float.font.color}`]: {}
+            [`.${prefix}listbox-button:focus-visible ~ .${prefix}label-float, .${prefix}listbox-button:focus ~ .${prefix}label-float, .${prefix}label-float-active`]: {
+              [`@apply !-ms-10 !-mt-7 !text-${config.icon.enabled.label.float.md.font.size.focus} !text-${config.label.float.font.color}`]: {}
             },
             [`.${prefix}listbox-button ~ .${prefix}label-float`]: {
               [`@apply ms-0 mt-0 text-${config.icon.enabled.label.float.md.font.size.unfocus}`]: {}
@@ -10897,10 +10899,10 @@ const listbox = plugin.withOptions(
           //Without:icon && Size:lg && Label:float
           [`&.${prefix}listbox-label-float:not(.${prefix}has-icon).${prefix}listbox-lg`]: {
             [`.${prefix}label-float`]: {
-              [`@apply start-3 -ms-3 -mt-8 text-${config.icon.disabled.label.float.lg.font.size.base} text-transparent`]: {}
+              [`@apply start-3 -ms-3 -mt-7 text-${config.icon.disabled.label.float.lg.font.size.base} text-transparent`]: {}
             },
-            [`.${prefix}listbox-button:focus-visible ~ .${prefix}label-float, .${prefix}listbox-button:focus ~ .${prefix}label-float`]: {
-              [`@apply !-ms-3 !-mt-9 !text-${config.icon.disabled.label.float.lg.font.size.focus} !text-${config.label.float.font.color}`]: {}
+            [`.${prefix}listbox-button:focus-visible ~ .${prefix}label-float, .${prefix}listbox-button:focus ~ .${prefix}label-float, .${prefix}label-float-active`]: {
+              [`@apply !-ms-3 !-mt-7 !text-${config.icon.disabled.label.float.lg.font.size.focus} !text-${config.label.float.font.color}`]: {}
             },
             [`.${prefix}listbox-button ~ .${prefix}label-float`]: {
               [`@apply ms-0 mt-0 text-${config.icon.disabled.label.float.lg.font.size.unfocus}`]: {}
@@ -10909,10 +10911,10 @@ const listbox = plugin.withOptions(
           //With:icon && Size:lg && Label:float
           [`&.${prefix}listbox-label-float.${prefix}has-icon.${prefix}listbox-lg`]: {
             [`.${prefix}label-float`]: {
-              [`@apply start-11 -ms-10 -mt-8 text-${config.icon.enabled.label.float.lg.font.size.base} text-transparent`]: {}
+              [`@apply start-11 -ms-10 -mt-7 text-${config.icon.enabled.label.float.lg.font.size.base} text-transparent`]: {}
             },
-            [`.${prefix}listbox-button:focus-visible ~ .${prefix}label-float, .${prefix}listbox-button:focus ~ .${prefix}label-float`]: {
-              [`@apply !-ms-10 !-mt-9 !text-${config.icon.enabled.label.float.lg.font.size.focus} !text-${config.label.float.font.color}`]: {}
+            [`.${prefix}listbox-button:focus-visible ~ .${prefix}label-float, .${prefix}listbox-button:focus ~ .${prefix}label-float, .${prefix}label-float-active`]: {
+              [`@apply !-ms-10 !-mt-7 !text-${config.icon.enabled.label.float.lg.font.size.focus} !text-${config.label.float.font.color}`]: {}
             },
             [`.${prefix}listbox-button ~ .${prefix}label-float`]: {
               [`@apply ms-0 mt-0 text-${config.icon.enabled.label.float.lg.font.size.unfocus}`]: {}
@@ -14060,7 +14062,7 @@ const defaultConfig$a = {
     },
     background: {
       light: "white",
-      dark: "white"
+      dark: "muted-950"
     }
   },
   image: {
@@ -15551,7 +15553,7 @@ const tag = plugin.withOptions(
               },
               //Shadow:hover
               [`&.${prefix}tag-shadow-hover`]: {
-                [`@apply hover:shadow-${config.variant.solid.primary.shadow.size} hover:shadow-${config.variant.solid.primary.shadow.light} hover:shadow-${config.variant.solid.primary.shadow.dark}`]: {}
+                [`@apply hover:shadow-${config.variant.solid.info.shadow.size} hover:shadow-${config.variant.solid.info.shadow.light} hover:shadow-${config.variant.solid.info.shadow.dark}`]: {}
               }
             },
             //Color:success
@@ -15566,7 +15568,7 @@ const tag = plugin.withOptions(
               },
               //Shadow:hover
               [`&.${prefix}tag-shadow-hover`]: {
-                [`@apply hover:shadow-${config.variant.solid.primary.shadow.size} hover:shadow-${config.variant.solid.primary.shadow.light} hover:shadow-${config.variant.solid.primary.shadow.dark}`]: {}
+                [`@apply hover:shadow-${config.variant.solid.success.shadow.size} hover:shadow-${config.variant.solid.success.shadow.light} hover:shadow-${config.variant.solid.success.shadow.dark}`]: {}
               }
             },
             //Color:warning
@@ -15581,7 +15583,7 @@ const tag = plugin.withOptions(
               },
               //Shadow:hover
               [`&.${prefix}tag-shadow-hover`]: {
-                [`@apply hover:shadow-${config.variant.solid.primary.shadow.size} hover:shadow-${config.variant.solid.primary.shadow.light} hover:shadow-${config.variant.solid.primary.shadow.dark}`]: {}
+                [`@apply hover:shadow-${config.variant.solid.warning.shadow.size} hover:shadow-${config.variant.solid.warning.shadow.light} hover:shadow-${config.variant.solid.warning.shadow.dark}`]: {}
               }
             },
             //Color:danger
@@ -16172,7 +16174,7 @@ const textarea = plugin.withOptions(
           },
           //Textarea
           [`.${prefix}textarea`]: {
-            [`@apply ${prefix}focus w-${config.textarea.width}`]: {},
+            [`@apply ${prefix}focus w-${config.textarea.width} enabled:cursor-default cursor-not-allowed`]: {},
             //Focus:label:float
             [`&:focus-visible ~ .${prefix}label-float`]: {
               [`@apply !text-${config.label.float.font.color} dark:!text-${config.label.float.font.color}`]: {}
@@ -16592,7 +16594,7 @@ const themeSwitch = plugin.withOptions(
             [`@apply ring-offset-${config.inverted.disabled.ring.light} dark:ring-offset-${config.inverted.disabled.ring.dark}`]: {},
             [`.${prefix}theme-switch-inner`]: {
               //Border
-              [`@apply border border-${config.inverted.disabled.inner.background.light} dark:border-${config.inverted.disabled.inner.background.dark}`]: {},
+              [`@apply border border-${config.inverted.disabled.inner.border.light} dark:border-${config.inverted.disabled.inner.border.dark}`]: {},
               //Background
               [`@apply bg-${config.inverted.disabled.inner.background.light} dark:bg-${config.inverted.disabled.inner.background.dark}`]: {}
             }

package/dist/shared/{tailwind.8efc2b9e.d.cts → tailwind.d65f80d7.d.cts}

@@ -1,6 +1,5 @@
-import * as tailwindcss from 'tailwindcss';
-import { Config } from 'tailwindcss';
 import * as tailwindcss_types_config from 'tailwindcss/types/config';
+import { Config } from 'tailwindcss';
 import typography from '@tailwindcss/typography';
 
 declare const key$P: "accordion";
@@ -608,10 +607,6 @@ declare const defaultConfig$P: {
     img: {
         size: string;
         shadow: string;
-        border: {
-            light: string;
-            dark: string;
-        };
     };
     text: {
         font: {
@@ -8020,7 +8015,7 @@ declare function createPreset(options?: PluginOption): {
     content: never[];
     plugins: (typeof typography | {
         handler: tailwindcss_types_config.PluginCreator;
-        config?: Partial<tailwindcss.Config> | undefined;
+        config?: Partial<tailwindcss_types_config.Config> | undefined;
     })[];
     theme: {
         fontFamily: {
@@ -8210,7 +8205,7 @@ declare const preset: {
     content: never[];
     plugins: (typeof typography | {
         handler: tailwindcss_types_config.PluginCreator;
-        config?: Partial<tailwindcss.Config> | undefined;
+        config?: Partial<tailwindcss_types_config.Config> | undefined;
     })[];
     theme: {
         fontFamily: {

package/dist/shared/{tailwind.8efc2b9e.d.mts → tailwind.d65f80d7.d.mts}

@@ -1,6 +1,5 @@
-import * as tailwindcss from 'tailwindcss';
-import { Config } from 'tailwindcss';
 import * as tailwindcss_types_config from 'tailwindcss/types/config';
+import { Config } from 'tailwindcss';
 import typography from '@tailwindcss/typography';
 
 declare const key$P: "accordion";
@@ -608,10 +607,6 @@ declare const defaultConfig$P: {
     img: {
         size: string;
         shadow: string;
-        border: {
-            light: string;
-            dark: string;
-        };
     };
     text: {
         font: {
@@ -8020,7 +8015,7 @@ declare function createPreset(options?: PluginOption): {
     content: never[];
     plugins: (typeof typography | {
         handler: tailwindcss_types_config.PluginCreator;
-        config?: Partial<tailwindcss.Config> | undefined;
+        config?: Partial<tailwindcss_types_config.Config> | undefined;
     })[];
     theme: {
         fontFamily: {
@@ -8210,7 +8205,7 @@ declare const preset: {
     content: never[];
     plugins: (typeof typography | {
         handler: tailwindcss_types_config.PluginCreator;
-        config?: Partial<tailwindcss.Config> | undefined;
+        config?: Partial<tailwindcss_types_config.Config> | undefined;
     })[];
     theme: {
         fontFamily: {

package/dist/shared/{tailwind.8efc2b9e.d.ts → tailwind.d65f80d7.d.ts}

@@ -1,6 +1,5 @@
-import * as tailwindcss from 'tailwindcss';
-import { Config } from 'tailwindcss';
 import * as tailwindcss_types_config from 'tailwindcss/types/config';
+import { Config } from 'tailwindcss';
 import typography from '@tailwindcss/typography';
 
 declare const key$P: "accordion";
@@ -608,10 +607,6 @@ declare const defaultConfig$P: {
     img: {
         size: string;
         shadow: string;
-        border: {
-            light: string;
-            dark: string;
-        };
     };
     text: {
         font: {
@@ -8020,7 +8015,7 @@ declare function createPreset(options?: PluginOption): {
     content: never[];
     plugins: (typeof typography | {
         handler: tailwindcss_types_config.PluginCreator;
-        config?: Partial<tailwindcss.Config> | undefined;
+        config?: Partial<tailwindcss_types_config.Config> | undefined;
     })[];
     theme: {
         fontFamily: {
@@ -8210,7 +8205,7 @@ declare const preset: {
     content: never[];
     plugins: (typeof typography | {
         handler: tailwindcss_types_config.PluginCreator;
-        config?: Partial<tailwindcss.Config> | undefined;
+        config?: Partial<tailwindcss_types_config.Config> | undefined;
     })[];
     theme: {
         fontFamily: {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@shuriken-ui/tailwind",
-  "version": "2.0.0-next.0",
+  "version": "2.0.0-next.10",
   "license": "MIT",
   "author": "Css Ninja <hello@cssninja.io> (https://cssninja.io)",
   "repository": "shuriken-ui/tailwind",