npm - @shuriken-ui/tailwind - Versions diffs - 1.2.6 → 1.5.0 - Mend

@shuriken-ui/tailwind 1.2.6 → 1.5.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (15) hide show

package/dist/config.d.cts +1 -193
package/dist/config.d.mts +1 -193
package/dist/config.d.ts +1 -193
package/dist/index.d.cts +4 -3
package/dist/index.d.mts +4 -3
package/dist/index.d.ts +4 -3
package/dist/preset.cjs +1025 -447
package/dist/preset.d.cts +4 -389
package/dist/preset.d.mts +4 -389
package/dist/preset.d.ts +4 -389
package/dist/preset.mjs +1025 -447
package/dist/shared/tailwind.6e716239.d.cts +4724 -0
package/dist/shared/tailwind.6e716239.d.mts +4724 -0
package/dist/shared/tailwind.6e716239.d.ts +4724 -0
package/package.json +24 -24

package/dist/preset.mjs CHANGED Viewed

@@ -15,7 +15,8 @@ const defaultPluginOptions = {
   prefix: "nui"
 };
-const defaultAccordionConfig = {
+const key$R = "accordion";
+const defaultConfig$Q = {
   size: "full",
   border: "muted-200",
   borderDark: "muted-700",
@@ -70,6 +71,7 @@ const defaultAccordionConfig = {
     curved: "xl"
   }
 };
 const accordion = plugin.withOptions(
   function(options) {
     let { prefix } = defu(options, defaultPluginOptions);
@@ -77,9 +79,7 @@ const accordion = plugin.withOptions(
       prefix = `${prefix}-`;
     }
     return function({ addComponents, theme }) {
-      const config = theme(
-        "shurikenUi.accordion"
-      );
+      const config = theme(`shurikenUi.${key$R}`);
       addComponents({
         [`.${prefix}accordion`]: {
           [`@apply w-${config.size} border-${config.border} dark:border-${config.borderDark} dark:bg-${config.bgDark} block overflow-hidden border bg-${config.bg}`]: {},
@@ -168,14 +168,15 @@ const accordion = plugin.withOptions(
     return {
       theme: {
         shurikenUi: {
-          accordion: defaultAccordionConfig
+          [key$R]: defaultConfig$Q
         }
       }
     };
   }
 );
-const defaultAutocompleteConfig = {
+const key$Q = "autocomplete";
+const defaultConfig$P = {
   labelFloat: {
     text: "primary-500",
     size: "5",
@@ -445,6 +446,7 @@ const defaultAutocompleteConfig = {
     }
   }
 };
 const autocomplete = plugin.withOptions(
   function(options) {
     let { prefix } = defu(options, defaultPluginOptions);
@@ -452,9 +454,7 @@ const autocomplete = plugin.withOptions(
       prefix = `${prefix}-`;
     }
     return function({ addComponents, theme }) {
-      const config = theme(
-        "shurikenUi.autocomplete"
-      );
+      const config = theme(`shurikenUi.${key$Q}`);
       addComponents({
         [`.${prefix}autocomplete`]: {
           [`@apply w-full relative`]: {},
@@ -810,14 +810,15 @@ const autocomplete = plugin.withOptions(
     return {
       theme: {
         shurikenUi: {
-          autocomplete: defaultAutocompleteConfig
+          [key$Q]: defaultConfig$P
         }
       }
     };
   }
 );
-const defaultAvatarConfig = {
+const key$P = "avatar";
+const defaultConfig$O = {
   avatarInner: {
     size: "full",
     duration: "300"
@@ -1056,6 +1057,7 @@ const defaultAvatarConfig = {
     avatarBadgePosition: "0"
   }
 };
 const avatar = plugin.withOptions(
   function(options) {
     let { prefix } = defu(options, defaultPluginOptions);
@@ -1063,9 +1065,7 @@ const avatar = plugin.withOptions(
       prefix = `${prefix}-`;
     }
     return function({ addComponents, theme }) {
-      const config = theme(
-        "shurikenUi.avatar"
-      );
+      const config = theme(`shurikenUi.${key$P}`);
       addComponents({
         [`.${prefix}avatar`]: {
           [`@apply relative inline-flex shrink-0 items-center justify-center outline-none`]: {},
@@ -1556,14 +1556,15 @@ const avatar = plugin.withOptions(
     return {
       theme: {
         shurikenUi: {
-          avatar: defaultAvatarConfig
+          [key$P]: defaultConfig$O
         }
       }
     };
   }
 );
-const defaultAvatarGroupConfig = {
+const key$O = "avatarGroup";
+const defaultConfig$N = {
   avatarOuter: {
     bg: "white",
     bgDark: "muted-800",
@@ -1639,6 +1640,7 @@ const defaultAvatarGroupConfig = {
     }
   }
 };
 const avatarGroup = plugin.withOptions(
   function(options) {
     let { prefix } = defu(options, defaultPluginOptions);
@@ -1646,9 +1648,7 @@ const avatarGroup = plugin.withOptions(
       prefix = `${prefix}-`;
     }
     return function({ addComponents, theme }) {
-      const config = theme(
-        "shurikenUi.avatarGroup"
-      );
+      const config = theme(`shurikenUi.${key$O}`);
       addComponents({
         [`.${prefix}avatar-group`]: {
           [`@apply flex`]: {},
@@ -1760,14 +1760,15 @@ const avatarGroup = plugin.withOptions(
     return {
       theme: {
         shurikenUi: {
-          avatarGroup: defaultAvatarGroupConfig
+          [key$O]: defaultConfig$N
         }
       }
     };
   }
 );
-const defaultBreadcrumbConfig = {
+const key$N = "breadcrumb";
+const defaultConfig$M = {
   list: {
     font: "sans",
     text: "[0.85rem]",
@@ -1791,6 +1792,7 @@ const defaultBreadcrumbConfig = {
     }
   }
 };
 const breadcrumb = plugin.withOptions(
   function(options) {
     let { prefix } = defu(options, defaultPluginOptions);
@@ -1798,9 +1800,7 @@ const breadcrumb = plugin.withOptions(
       prefix = `${prefix}-`;
     }
     return function({ addComponents, theme }) {
-      const config = theme(
-        "shurikenUi.breadcrumb"
-      );
+      const config = theme(`shurikenUi.${key$N}`);
       addComponents({
         [`.${prefix}breadcrumb`]: {
           [`.${prefix}breadcrumb-list`]: {
@@ -1838,14 +1838,15 @@ const breadcrumb = plugin.withOptions(
     return {
       theme: {
         shurikenUi: {
-          breadcrumb: defaultBreadcrumbConfig
+          [key$N]: defaultConfig$M
         }
       }
     };
   }
 );
-const defaultButtonActionConfig = {
+const key$M = "buttonAction";
+const defaultConfig$L = {
   font: "normal",
   text: "sm",
   duration: "300",
@@ -1970,6 +1971,7 @@ const defaultButtonActionConfig = {
     focusWithinDark: "danger-400"
   }
 };
 const buttonAction = plugin.withOptions(
   function(options) {
     let { prefix } = defu(options, defaultPluginOptions);
@@ -1977,9 +1979,7 @@ const buttonAction = plugin.withOptions(
       prefix = `${prefix}-`;
     }
     return function({ addComponents, theme }) {
-      const config = theme(
-        "shurikenUi.buttonAction"
-      );
+      const config = theme(`shurikenUi.${key$M}`);
       addComponents({
         [`.${prefix}button-action`]: {
           [`@apply relative font-sans font-${config.font} text-${config.text} inline-flex items-center justify-center leading-5 no-underline h-8 px-3 py-2 space-x-1 border ${prefix}focus transition-all duration-${config.duration} disabled:opacity-60 disabled:cursor-not-allowed hover:enabled:shadow-none`]: {},
@@ -2027,14 +2027,15 @@ const buttonAction = plugin.withOptions(
     return {
       theme: {
         shurikenUi: {
-          buttonAction: defaultButtonActionConfig
+          [key$M]: defaultConfig$L
         }
       }
     };
   }
 );
-const defaultButtonCloseConfig = {
+const key$L = "buttonClose";
+const defaultConfig$K = {
   size: "9",
   duration: "300",
   buttonIcon: {
@@ -2085,6 +2086,7 @@ const defaultButtonCloseConfig = {
     text: "danger-500"
   }
 };
 const buttonClose = plugin.withOptions(
   function(options) {
     let { prefix } = defu(options, defaultPluginOptions);
@@ -2092,12 +2094,10 @@ const buttonClose = plugin.withOptions(
       prefix = `${prefix}-`;
     }
     return function({ addComponents, theme }) {
-      const config = theme(
-        "shurikenUi.buttonClose"
-      );
+      const config = theme(`shurikenUi.${key$L}`);
       addComponents({
         [`.${prefix}button-close`]: {
-          [`@apply flex h-${config.size} w-${config.size} items-center justify-center transition-colors duration-${config.duration} disabled:opacity-30 cursor-pointer`]: {},
+          [`@apply ${prefix}focus flex h-${config.size} w-${config.size} items-center justify-center transition-colors duration-${config.duration} disabled:opacity-30 cursor-pointer`]: {},
           [`.${prefix}button-icon`]: {
             [`@apply h-${config.buttonIcon.size} w-${config.buttonIcon.size} fill-current`]: {}
           },
@@ -2142,14 +2142,16 @@ const buttonClose = plugin.withOptions(
     return {
       theme: {
         shurikenUi: {
-          buttonClose: defaultButtonCloseConfig
+          [key$L]: defaultConfig$K
         }
       }
     };
   }
 );
-const defaultButtonGroupConfig = {};
+const key$K = "buttonAction";
+const defaultConfig$J = {};
 const buttonGroup = plugin.withOptions(
   function(options) {
     let { prefix } = defu(options, defaultPluginOptions);
@@ -2157,9 +2159,7 @@ const buttonGroup = plugin.withOptions(
       prefix = `${prefix}-`;
     }
     return function({ addComponents, theme }) {
-      theme(
-        "shurikenUi.buttonGroup"
-      );
+      theme(`shurikenUi.${key$K}`);
       addComponents({
         [`.${prefix}button-group`]: {
           [`@apply flex`]: {},
@@ -2258,14 +2258,15 @@ const buttonGroup = plugin.withOptions(
     return {
       theme: {
         shurikenUi: {
-          buttonGroup: defaultButtonGroupConfig
+          [key$K]: defaultConfig$J
         }
       }
     };
   }
 );
-const defaultButtonIconConfig = {
+const key$J = "buttonIcon";
+const defaultConfig$I = {
   text: "sm",
   font: "normal",
   duration: "300",
@@ -2330,6 +2331,7 @@ const defaultButtonIconConfig = {
     text: "danger-500"
   }
 };
 const buttonIcon = plugin.withOptions(
   function(options) {
     let { prefix } = defu(options, defaultPluginOptions);
@@ -2337,12 +2339,10 @@ const buttonIcon = plugin.withOptions(
       prefix = `${prefix}-`;
     }
     return function({ addComponents, theme }) {
-      const config = theme(
-        "shurikenUi.buttonIcon"
-      );
+      const config = theme(`shurikenUi.${key$J}`);
       addComponents({
         [`.${prefix}button-icon`]: {
-          [`@apply ${prefix}focus relative inline-flex items-center justify-center space-x-1 font-sans text-${config.text} font-${config.font} leading-5 no-underline outline-none transition-all duration-${config.duration} disabled:opacity-60 disabled:cursor-not-allowed hover:shadow-none`]: {},
+          [`@apply ${prefix}focus relative inline-flex items-center justify-center space-x-1 font-sans text-${config.text} font-${config.font} leading-5 no-underline transition-all duration-${config.duration} disabled:opacity-60 disabled:cursor-not-allowed hover:shadow-none`]: {},
           [`&.${prefix}button-small`]: {
             [`@apply h-${config.buttonSmall.size} w-${config.buttonSmall.size} p-${config.buttonSmall.space}`]: {}
           },
@@ -2396,14 +2396,15 @@ const buttonIcon = plugin.withOptions(
     return {
       theme: {
         shurikenUi: {
-          buttonIcon: defaultButtonIconConfig
+          [key$J]: defaultConfig$I
         }
       }
     };
   }
 );
-const defaultButtonConfig = {
+const key$I = "button";
+const defaultConfig$H = {
   duration: "300",
   font: "normal",
   badge: {
@@ -2833,6 +2834,7 @@ const defaultButtonConfig = {
     }
   }
 };
 const button = plugin.withOptions(
   function(options) {
     let { prefix } = defu(options, defaultPluginOptions);
@@ -2840,9 +2842,7 @@ const button = plugin.withOptions(
       prefix = `${prefix}-`;
     }
     return function({ addComponents, theme }) {
-      const config = theme(
-        "shurikenUi.button"
-      );
+      const config = theme(`shurikenUi.${key$I}`);
       addComponents({
         [`.${prefix}button`]: {
           [`@apply relative font-sans font-${config.font} leading-5 no-underline inline-flex justify-center items-center space-x-1 ${prefix}focus transition-all duration-${config.duration} disabled:opacity-60 disabled:cursor-not-allowed hover:shadow-none`]: {},
@@ -3091,14 +3091,15 @@ const button = plugin.withOptions(
     return {
       theme: {
         shurikenUi: {
-          button: defaultButtonConfig
+          [key$I]: defaultConfig$H
         }
       }
     };
   }
 );
-const defaultCardConfig = {
+const key$H = "card";
+const defaultConfig$G = {
   size: "full",
   duration: "300",
   cardWhite: {
@@ -3161,6 +3162,7 @@ const defaultCardConfig = {
     size: "xl"
   }
 };
 const card = plugin.withOptions(
   function(options) {
     let { prefix } = defu(options, defaultPluginOptions);
@@ -3168,7 +3170,7 @@ const card = plugin.withOptions(
       prefix = `${prefix}-`;
     }
     return function({ addComponents, theme }) {
-      const config = theme("shurikenUi.card");
+      const config = theme(`shurikenUi.${key$H}`);
       addComponents({
         [`.${prefix}card`]: {
           [`@apply relative w-${config.size} transition-all duration-${config.duration}`]: {},
@@ -3224,14 +3226,15 @@ const card = plugin.withOptions(
     return {
       theme: {
         shurikenUi: {
-          card: defaultCardConfig
+          [key$H]: defaultConfig$G
         }
       }
     };
   }
 );
-const defaultCheckboxConfig = {
+const key$G = "checkbox";
+const defaultConfig$F = {
   outer: {
     size: "5"
   },
@@ -3280,6 +3283,7 @@ const defaultCheckboxConfig = {
   warning: "warning-500",
   danger: "danger-500"
 };
 const checkbox = plugin.withOptions(
   function(options) {
     let { prefix } = defu(options, defaultPluginOptions);
@@ -3287,9 +3291,7 @@ const checkbox = plugin.withOptions(
       prefix = `${prefix}-`;
     }
     return function({ addComponents, theme }) {
-      const config = theme(
-        "shurikenUi.checkbox"
-      );
+      const config = theme(`shurikenUi.${key$G}`);
       addComponents({
         [`.${prefix}checkbox`]: {
           [`@apply relative inline-flex items-start gap-1`]: {},
@@ -3329,16 +3331,16 @@ const checkbox = plugin.withOptions(
           [`.${prefix}checkbox-error`]: {
             [`@apply text-${config.error.text} ms-1 inline-block font-${config.error.font} text-${config.error.textSixe}`]: {}
           },
-          [`&.${prefix}checkbox-rounded .${prefix}checkbox-inner`]: {
+          [`&.${prefix}checkbox-rounded .${prefix}checkbox-outer, &.${prefix}checkbox-rounded .${prefix}checkbox-inner`]: {
             [`@apply rounded`]: {}
           },
-          [`&.${prefix}checkbox-smooth .${prefix}checkbox-inner`]: {
+          [`&.${prefix}checkbox-smooth .${prefix}checkbox-outer, &.${prefix}checkbox-smooth .${prefix}checkbox-inner`]: {
             [`@apply rounded-${config.rounded.smooth}`]: {}
           },
-          [`&.${prefix}checkbox-curved .${prefix}checkbox-inner`]: {
+          [`&.${prefix}checkbox-curved .${prefix}checkbox-outer, &.${prefix}checkbox-curved .${prefix}checkbox-inner`]: {
             [`@apply rounded-${config.rounded.curved}`]: {}
           },
-          [`&.${prefix}checkbox-full .${prefix}checkbox-inner`]: {
+          [`&.${prefix}checkbox-full .${prefix}checkbox-outer, &.${prefix}checkbox-full .${prefix}checkbox-inner`]: {
             [`@apply rounded-${config.rounded.full}`]: {}
           },
           [`&.${prefix}checkbox-default`]: {
@@ -3373,18 +3375,20 @@ const checkbox = plugin.withOptions(
     return {
       theme: {
         shurikenUi: {
-          checkbox: defaultCheckboxConfig
+          [key$G]: defaultConfig$F
         }
       }
     };
   }
 );
-const defaultDropdownDividerConfig = {
+const key$F = "drodownDivider";
+const defaultConfig$E = {
   space: "2",
   border: "muted-200",
   borderDark: "muted-600"
 };
 const dropdownDivider = plugin.withOptions(
   function(options) {
     let { prefix } = defu(options, defaultPluginOptions);
@@ -3392,9 +3396,7 @@ const dropdownDivider = plugin.withOptions(
       prefix = `${prefix}-`;
     }
     return function({ addComponents, theme }) {
-      const config = theme(
-        "shurikenUi.dropdownDivider"
-      );
+      const config = theme(`shurikenUi.${key$F}`);
       addComponents({
         [`.${prefix}dropdown-divider`]: {
           [`@apply my-${config.space} block h-px w-full border-t border-${config.border} dark:border-${config.borderDark}`]: {}
@@ -3406,14 +3408,15 @@ const dropdownDivider = plugin.withOptions(
     return {
       theme: {
         shurikenUi: {
-          dropdownDivider: defaultDropdownDividerConfig
+          [key$F]: defaultConfig$E
         }
       }
     };
   }
 );
-const defaultDropdownItemConfig = {
+const key$E = "dropdownItem";
+const defaultConfig$D = {
   itemRounded: "md",
   textPosition: "left",
   textSize: "sm",
@@ -3438,6 +3441,7 @@ const defaultDropdownItemConfig = {
     curved: "xl"
   }
 };
 const dropdownItem = plugin.withOptions(
   function(options) {
     let { prefix } = defu(options, defaultPluginOptions);
@@ -3445,12 +3449,10 @@ const dropdownItem = plugin.withOptions(
       prefix = `${prefix}-`;
     }
     return function({ addComponents, theme }) {
-      const config = theme(
-        "shurikenUi.dropdownItem"
-      );
+      const config = theme(`shurikenUi.${key$E}`);
       addComponents({
         [`.${prefix}dropdown-item`]: {
-          [`@apply flex w-full items-center justify-start gap-2 px-3 py-2 text-${config.textPosition} text-${config.textSize} cursor-pointer transition-colors duration-${config.duration}`]: {},
+          [`@apply ${prefix}focus flex w-full items-center justify-start gap-2 px-3 py-2 text-${config.textPosition} text-${config.textSize} cursor-pointer transition-colors duration-${config.duration}`]: {},
           [`.${prefix}item-content`]: {
             [`@apply grow`]: {}
           },
@@ -3484,14 +3486,15 @@ const dropdownItem = plugin.withOptions(
     return {
       theme: {
         shurikenUi: {
-          dropdownItem: defaultDropdownItemConfig
+          [key$E]: defaultConfig$D
         }
       }
     };
   }
 );
-const defaultDropdownConfig = {
+const key$D = "dropdown";
+const defaultConfig$C = {
   textPosition: "start",
   contextButton: {
     ringOffsetDark: "muted-900",
@@ -3589,6 +3592,7 @@ const defaultDropdownConfig = {
     ringDark: "muted-700/70"
   }
 };
 const dropdown = plugin.withOptions(
   function(options) {
     let { prefix } = defu(options, defaultPluginOptions);
@@ -3596,9 +3600,7 @@ const dropdown = plugin.withOptions(
       prefix = `${prefix}-`;
     }
     return function({ addComponents, theme }) {
-      const config = theme(
-        "shurikenUi.dropdown"
-      );
+      const config = theme(`shurikenUi.${key$D}`);
       addComponents({
         [`.${prefix}dropdown`]: {
           [`@apply text-${config.textPosition}`]: {},
@@ -3706,20 +3708,23 @@ const dropdown = plugin.withOptions(
     return {
       theme: {
         shurikenUi: {
-          dropdown: defaultDropdownConfig
+          [key$D]: defaultConfig$C
         }
       }
     };
   }
 );
-const defaultFocusConfig = {
+const key$C = "focus";
+const defaultConfig$B = {
   offset: "2",
-  width: "1",
+  width: "2",
   style: "dashed",
   color: "muted-300",
-  colorDark: "muted-600"
+  colorDark: "muted-600",
+  mode: "always"
 };
 const focus = plugin.withOptions(
   function(options) {
     let { prefix } = defu(options, defaultPluginOptions);
@@ -3727,19 +3732,15 @@ const focus = plugin.withOptions(
       prefix = `${prefix}-`;
     }
     return function({ addComponents, theme }) {
-      const config = theme(
-        "shurikenUi.focus"
-      );
+      const config = theme(`shurikenUi.${key$C}`);
+      const mode = config.mode === "focus-visible" ? "&:has(:focus-visible), &:focus-visible" : "&:focus-within";
       addComponents({
         [`.${prefix}focus`]: {
           [`@apply outline-${config.width} outline-${config.style} outline-offset-${config.offset}`]: {},
           "@apply outline-transparent": {},
-          "&:focus-within": {
+          [mode]: {
             [`@apply outline-${config.color} dark:outline-${config.colorDark}`]: {},
             [`@apply outline-${config.style} ring-0`]: {}
-          },
-          "&:focus-visible": {
-            [`@apply outline-${config.width}`]: {}
           }
         }
       });
@@ -3749,14 +3750,15 @@ const focus = plugin.withOptions(
     return {
       theme: {
         shurikenUi: {
-          focus: defaultFocusConfig
+          [key$C]: defaultConfig$B
         }
       }
     };
   }
 );
-const defaultFullscreenDropfileConfig = {
+const key$B = "fullscreenDropfile";
+const defaultConfig$A = {
   border: "primary-500",
   height: "[230px]",
   width: "[500px]",
@@ -3766,6 +3768,7 @@ const defaultFullscreenDropfileConfig = {
   },
   labelTextSize: "base"
 };
 const fullscreenDropfile = plugin.withOptions(
   function(options) {
     let { prefix } = defu(options, defaultPluginOptions);
@@ -3774,7 +3777,7 @@ const fullscreenDropfile = plugin.withOptions(
     }
     return function({ addComponents, theme }) {
       const config = theme(
-        "shurikenUi.fullscreenDropfile"
+        `shurikenUi.${key$B}`
       );
       addComponents({
         [`.${prefix}fullscreen-dropfile`]: {
@@ -3804,14 +3807,15 @@ const fullscreenDropfile = plugin.withOptions(
     return {
       theme: {
         shurikenUi: {
-          fullscreenDropfile: defaultFullscreenDropfileConfig
+          [key$B]: defaultConfig$A
         }
       }
     };
   }
 );
-const defaultHeadingConfig = {
+const key$A = "heading";
+const defaultConfig$z = {
   textXS: "xs",
   textSM: "sm",
   textMD: "base",
@@ -3837,6 +3841,7 @@ const defaultHeadingConfig = {
   textLeadSnug: "snug",
   textLeadLoose: "loose"
 };
 const heading = plugin.withOptions(
   function(options) {
     let { prefix } = defu(options, defaultPluginOptions);
@@ -3844,9 +3849,7 @@ const heading = plugin.withOptions(
       prefix = `${prefix}-`;
     }
     return function({ addComponents, theme }) {
-      const config = theme(
-        "shurikenUi.heading"
-      );
+      const config = theme(`shurikenUi.${key$A}`);
       addComponents({
         [`.${prefix}heading`]: {
           [`@apply font-sans`]: {},
@@ -3930,14 +3933,15 @@ const heading = plugin.withOptions(
     return {
       theme: {
         shurikenUi: {
-          heading: defaultHeadingConfig
+          [key$A]: defaultConfig$z
         }
       }
     };
   }
 );
-const defaultIconBoxConfig = {
+const key$z = "iconBox";
+const defaultConfig$y = {
   boxXS: {
     size: "8",
     rounded: {
@@ -4074,6 +4078,7 @@ const defaultIconBoxConfig = {
     borderColor: "current"
   }
 };
 const iconBox = plugin.withOptions(
   function(options) {
     let { prefix } = defu(options, defaultPluginOptions);
@@ -4081,9 +4086,7 @@ const iconBox = plugin.withOptions(
       prefix = `${prefix}-`;
     }
     return function({ addComponents, theme }) {
-      const config = theme(
-        "shurikenUi.iconBox"
-      );
+      const config = theme(`shurikenUi.${key$z}`);
       addComponents({
         [`.${prefix}icon-box`]: {
           [`@apply relative inline-flex shrink-0 items-center justify-center`]: {},
@@ -4221,14 +4224,15 @@ const iconBox = plugin.withOptions(
     return {
       theme: {
         shurikenUi: {
-          iconBox: defaultIconBoxConfig
+          [key$z]: defaultConfig$y
         }
       }
     };
   }
 );
-const defaultInputFileRegularConfig = {
+const key$y = "inputFileRegular";
+const defaultConfig$x = {
   inner: {
     size: "full",
     font: "sans",
@@ -4316,6 +4320,7 @@ const defaultInputFileRegularConfig = {
   hover: "primary-500",
   focusWhitin: "primary-500"
 };
 const inputFileRegular = plugin.withOptions(
   function(options) {
     let { prefix } = defu(options, defaultPluginOptions);
@@ -4323,9 +4328,7 @@ const inputFileRegular = plugin.withOptions(
       prefix = `${prefix}-`;
     }
     return function({ addComponents, theme }) {
-      const config = theme(
-        "shurikenUi.inputFileRegular"
-      );
+      const config = theme(`shurikenUi.${key$y}`);
       addComponents({
         [`.${prefix}input-file-regular`]: {
           [`@apply relative w-full`]: {},
@@ -4336,7 +4339,7 @@ const inputFileRegular = plugin.withOptions(
             [`@apply relative`]: {}
           },
           [`.${prefix}input-file-inner`]: {
-            [`@apply relative ${prefix}focus flex w-${config.inner.size} cursor-pointer items-center overflow-hidden font-${config.inner.font} transition-colors duration-${config.inner.duration} focus-within:outline-1 disabled:cursor-not-allowed disabled:opacity-75`]: {}
+            [`@apply relative ${prefix}focus flex w-${config.inner.size} cursor-pointer items-center overflow-hidden font-${config.inner.font} transition-colors duration-${config.inner.duration} disabled:cursor-not-allowed disabled:opacity-75`]: {}
           },
           [`.${prefix}input-file-addon`]: {
             [`@apply pointer-events-none flex shrink-0 items-center justify-center gap-1 transition-colors duration-100`]: {}
@@ -4511,14 +4514,15 @@ const inputFileRegular = plugin.withOptions(
     return {
       theme: {
         shurikenUi: {
-          inputFileRegular: defaultInputFileRegularConfig
+          [key$y]: defaultConfig$x
         }
       }
     };
   }
 );
-const defaultInputFileConfig = {
+const key$x = "inputFile";
+const defaultConfig$w = {
   drop: {
     size: "64",
     border: "muted-200",
@@ -4599,6 +4603,7 @@ const defaultInputFileConfig = {
     full: "full"
   }
 };
 const inputFile = plugin.withOptions(
   function(options) {
     let { prefix } = defu(options, defaultPluginOptions);
@@ -4606,12 +4611,10 @@ const inputFile = plugin.withOptions(
       prefix = `${prefix}-`;
     }
     return function({ addComponents, theme }) {
-      const config = theme(
-        "shurikenUi.inputFile"
-      );
+      const config = theme(`shurikenUi.${key$x}`);
       addComponents({
         [`.${prefix}input-file`]: {
-          [`@apply relative block`]: {},
+          [`@apply relative block ${prefix}focus`]: {},
           [`&.${prefix}input-file-drop`]: {
             [`@apply relative h-${config.drop.size} border-dashed border-2 border-${config.drop.border} dark:border-${config.drop.borderDark} hover:border-${config.drop.borderHover} dark:hover:border-${config.drop.borderHoverDark} bg-${config.drop.bg} dark:bg-${config.drop.bgDark} flex justify-center items-center transition-colors duration-${config.drop.duration}`]: {},
             [`.${prefix}drop-area-inner`]: {
@@ -4653,7 +4656,7 @@ const inputFile = plugin.withOptions(
               [`@apply font-${config.combo.label.font} sr-only text-${config.combo.label.text}`]: {}
             },
             [`.${prefix}combo-input`]: {
-              [`@apply block w-${config.combo.input.size} text-${config.combo.input.textSize} text-${config.combo.input.text} dark:text-${config.combo.input.textDark} file:me-4 file:py-2 file:px-4 file:border-0 file:cursor-pointer file:text-${config.combo.input.textFileSize} file:transition-colors file:bg-${config.combo.input.bgFile} file:text-${config.combo.input.textFile} hover:file:bg-${config.combo.input.bgFileHover}`]: {}
+              [`@apply outline-none block w-${config.combo.input.size} text-${config.combo.input.textSize} text-${config.combo.input.text} dark:text-${config.combo.input.textDark} file:me-4 file:py-2 file:px-4 file:border-0 file:cursor-pointer file:text-${config.combo.input.textFileSize} file:transition-colors file:bg-${config.combo.input.bgFile} file:text-${config.combo.input.textFile} hover:file:bg-${config.combo.input.bgFileHover}`]: {}
             }
           },
           [`&.${prefix}input-file-rounded`]: {
@@ -4708,14 +4711,15 @@ const inputFile = plugin.withOptions(
     return {
       theme: {
         shurikenUi: {
-          inputFile: defaultInputFileConfig
+          [key$x]: defaultConfig$w
         }
       }
     };
   }
 );
-const defaultInputConfig = {
+const key$w = "input";
+const defaultConfig$v = {
   label: {
     float: {
       text: "primary-500",
@@ -4912,6 +4916,7 @@ const defaultInputConfig = {
     }
   }
 };
 const input = plugin.withOptions(
   function(options) {
     let { prefix } = defu(options, defaultPluginOptions);
@@ -4919,9 +4924,7 @@ const input = plugin.withOptions(
       prefix = `${prefix}-`;
     }
     return function({ addComponents, theme }) {
-      const config = theme(
-        "shurikenUi.input"
-      );
+      const config = theme(`shurikenUi.${key$w}`);
       addComponents({
         [`.${prefix}input-wrapper`]: {
           [`@apply relative`]: {},
@@ -5205,212 +5208,768 @@ const input = plugin.withOptions(
     return {
       theme: {
         shurikenUi: {
-          input: defaultInputConfig
-        }
-      }
-    };
-  }
-);
-const defaultLabelConfig = {
-  font: "sans",
-  text: "muted-400",
-  textDark: "muted-400/80"
-};
-const label = plugin.withOptions(
-  function(options) {
-    let { prefix } = defu(options, defaultPluginOptions);
-    if (prefix) {
-      prefix = `${prefix}-`;
-    }
-    return function({ addComponents, theme }) {
-      const config = theme(
-        "shurikenUi.label"
-      );
-      addComponents({
-        [`.${prefix}label`]: {
-          [`@apply inline-block font-${config.font} leading-none text-${config.text} dark:text-${config.textDark}`]: {}
-        }
-      });
-    };
-  },
-  function() {
-    return {
-      theme: {
-        shurikenUi: {
-          label: defaultLabelConfig
-        }
-      }
-    };
-  }
-);
-const defaultLinkConfig = {
-  font: "sans",
-  textHover: "primary-500",
-  textHoverDark: "primary-400",
-  textFocus: "primary-500",
-  textFocusDark: "primary-400"
-};
-const link = plugin.withOptions(
-  function(options) {
-    let { prefix } = defu(options, defaultPluginOptions);
-    if (prefix) {
-      prefix = `${prefix}-`;
-    }
-    return function({ addComponents, theme }) {
-      const config = theme("shurikenUi.link");
-      addComponents({
-        [`.${prefix}link`]: {
-          [`@apply font-${config.font} hover:text-${config.textHover} dark:hover:text-${config.textHoverDark} underline-offset-4 hover:underline focus:text-${config.textFocus} dark:focus:text-${config.textFocusDark} focus:underline`]: {}
-        }
-      });
-    };
-  },
-  function() {
-    return {
-      theme: {
-        shurikenUi: {
-          link: defaultLinkConfig
-        }
-      }
-    };
-  }
-);
-const defaultListConfig = {
-  ul: "disc",
-  ol: "decimal",
-  base: {
-    textMarker: "muted-500",
-    textMarkerDark: "muted-400",
-    text: "slate-700",
-    textDark: "slate-300",
-    font: "sans"
-  },
-  media: {
-    textMarker: "slate-500",
-    textMarkerDark: "slate-400"
-  }
-};
-const list = plugin.withOptions(
-  function(options) {
-    let { prefix } = defu(options, defaultPluginOptions);
-    if (prefix) {
-      prefix = `${prefix}-`;
-    }
-    return function({ addComponents, theme }) {
-      const config = theme("shurikenUi.list");
-      addComponents({
-        [`.${prefix}list`]: {
-          [`&.${prefix}list-ul`]: {
-            [`@apply list-${config.ul}`]: {}
-          },
-          [`&.${prefix}list-ol`]: {
-            [`@apply list-${config.ol}`]: {}
-          },
-          [`&.${prefix}list-base`]: {
-            [`@apply space-y-1 marker:text-${config.base.textMarker} dark:marker:text-${config.base.textMarkerDark} font-${config.base.font} text-${config.base.text} dark:text-${config.base.textDark}`]: {}
-          },
-          [`&.${prefix}list-media`]: {
-            [`@apply space-y-4 marker:text-${config.media.textMarker} dark:marker:text-${config.media.textMarkerDark}`]: {},
-            [`.${prefix}list-item`]: {
-              [`@apply flex gap-2`]: {}
-            }
-          }
-        }
-      });
-    };
-  },
-  function() {
-    return {
-      theme: {
-        shurikenUi: {
-          list: defaultListConfig
+          [key$w]: defaultConfig$v
         }
       }
     };
   }
 );
-const defaultListboxConfig = {
-  labelFloat: {
-    text: "primary-500",
-    size: "5",
-    duration: "300"
-  },
-  button: {
-    size: "full",
-    text: "sm",
-    textPosition: "start",
-    font: "sans",
-    iconBox: {
-      space: "2",
-      size: "6",
-      innerSize: "4"
-    },
-    placeholder: {
-      text: "muted-300",
-      textDark: "muted-500",
-      textPosition: "left"
+const key$v = "inputNumber";
+const defaultConfig$u = {
+  label: {
+    float: {
+      text: "primary-500",
+      duration: "300",
+      size: "5"
     }
   },
   icon: {
     text: "muted-400",
     duration: "300"
   },
-  chevron: {
-    inner: {
-      size: "4",
-      text: "muted-400",
-      duration: "300"
-    }
-  },
-  options: {
-    ringFocus: "primary-500/50",
-    space: "2",
-    text: "base",
-    shadowSize: "lg",
-    shadow: "muted-500/10",
-    shadowDark: "muted-800/10"
-  },
-  option: {
-    duration: "300",
-    iconBox: {
-      text: "muted-200",
-      textDark: "muted-400",
-      innerSize: "5"
-    },
-    inner: {
-      heading: {
-        text: "muted-800",
-        textDark: "white"
-      },
-      text: "muted-400"
-    },
-    icon: {
-      text: "primary-600"
-    },
-    iconInner: {
-      size: "4"
-    },
-    activeOrHover: {
-      text: "primary-600",
-      textDark: "primary-400",
-      bg: "primary-500/10"
-    }
-  },
   errorText: {
     text: "danger-600",
     textSize: "[0.65rem]",
     font: "sans",
     fontWeight: "medium"
   },
-  sm: {
-    text: "xs",
-    icon: {
-      size: "8",
-      innerSize: "4"
+  input: {
+    focusSize: "full",
+    font: "sans",
+    duration: "300",
+    focusVisible: {
+      labelFloat: {
+        text: "primary-500",
+        textDark: "primary-500"
+      },
+      icon: {
+        text: "primary-500"
+      }
+    },
+    action: {
+      text: "muted-400",
+      duration: "300"
+    },
+    rounded: {
+      default: "md",
+      smooth: "lg",
+      curved: "xl",
+      full: "full"
+    },
+    sm: {
+      label: {
+        text: "xs"
+      },
+      iconOrAction: {
+        size: "8"
+      },
+      iconOrAcionInner: {
+        size: "4"
+      },
+      placeload: {
+        size: "8"
+      }
+    },
+    md: {
+      label: {
+        text: "[0.825rem]"
+      },
+      iconOrAction: {
+        size: "10"
+      },
+      iconOrAcionInner: {
+        size: "[1.15rem]"
+      },
+      placeload: {
+        size: "10"
+      }
+    },
+    lg: {
+      label: {
+        text: "sm"
+      },
+      iconOrAction: {
+        size: "12"
+      },
+      iconOrAcionInner: {
+        size: "5"
+      },
+      placeload: {
+        size: "12"
+      }
+    },
+    default: {
+      bg: "white",
+      bgDark: "muted-900",
+      border: "muted-300",
+      borderDark: "muted-700",
+      text: "muted-600",
+      textDark: "muted-200",
+      textPlaceholder: "muted-300",
+      textPlaceholderDark: "muted-500"
+    },
+    defaultContrast: {
+      bg: "white",
+      bgDark: "muted-950",
+      border: "muted-300",
+      borderDark: "muted-800",
+      text: "muted-600",
+      textDark: "muted-200",
+      textPlaceholder: "muted-300",
+      textPlaceholderDark: "muted-600"
+    },
+    muted: {
+      bg: "muted-100",
+      bgDark: "muted-900",
+      border: "muted-200",
+      borderDark: "muted-700",
+      text: "muted-600",
+      textDark: "muted-200",
+      textPlaceholder: "muted-300",
+      textPlaceholderDark: "muted-500"
+    },
+    mutedContrast: {
+      bg: "muted-100",
+      bgDark: "muted-950",
+      border: "muted-100",
+      borderDark: "muted-800",
+      text: "muted-600",
+      textDark: "muted-200",
+      textPlaceholder: "muted-300",
+      textPlaceholderDark: "muted-600"
+    },
+    notLoading: {
+      text: "muted-300",
+      textDark: "muted-600"
+    },
+    error: {
+      border: "danger-500",
+      borderDark: "danger-500",
+      icon: {
+        text: "danger-500"
+      }
+    },
+    hasNotIcon: {
+      text: {
+        sm: "xs",
+        md: "sm",
+        lg: "sm"
+      },
+      labelFloat: {
+        sm: "xs",
+        md: {
+          text: "xs",
+          focusVisible: {
+            text: "xs"
+          },
+          placeholderShown: {
+            text: "[0.825rem]"
+          }
+        },
+        lg: {
+          text: "xs",
+          focusVisible: {
+            text: "xs"
+          },
+          placeholderShown: {
+            text: "[0.825rem]"
+          }
+        }
+      }
+    },
+    hasIcon: {
+      text: {
+        sm: "xs",
+        md: "sm",
+        lg: "base"
+      },
+      labelFloat: {
+        sm: "xs",
+        md: {
+          text: "xs",
+          focusVisible: {
+            text: "xs"
+          },
+          placeholderShown: {
+            text: "[0.825rem]"
+          }
+        },
+        lg: {
+          text: "xs",
+          focusVisible: {
+            text: "xs"
+          },
+          placeholderShown: {
+            text: "[0.825rem]"
+          }
+        }
+      }
+    },
+    hasAction: {
+      spaceSM: "8",
+      spaceMD: "10",
+      spaceLG: "12"
+    }
+  }
+};
+const inputNumber = plugin.withOptions(
+  function(options) {
+    let { prefix } = defu(options, defaultPluginOptions);
+    if (prefix) {
+      prefix = `${prefix}-`;
+    }
+    return function({ addComponents, theme }) {
+      const config = theme(`shurikenUi.${key$v}`);
+      addComponents({
+        [`.${prefix}input-number-wrapper`]: {
+          [`@apply relative`]: {},
+          [`.${prefix}input-number-label, .${prefix}label-float`]: {
+            [`@apply ${prefix}label`]: {}
+          },
+          [`.${prefix}label-float`]: {
+            [`@apply text-${config.label.float.text} pointer-events-none absolute inline-flex h-${config.label.float.size} select-none items-center leading-none transition-all duration-${config.label.float.duration}`]: {}
+          },
+          [`.${prefix}input-number-outer`]: {
+            [`@apply ${prefix}focus relative`]: {}
+          },
+          [`.${prefix}input-number-icon`]: {
+            [`@apply text-${config.icon.text} absolute start-0 top-0 z-10 flex items-center justify-center transition-colors duration-${config.icon.duration}`]: {}
+          },
+          [`.${prefix}input-number-buttons`]: {
+            [`@apply absolute top-1 end-1 flex`]: {}
+          },
+          [`.${prefix}input-number-buttons button`]: {
+            [`@apply outline-none flex items-center justify-center`]: {},
+            [`@apply border border-muted-200 dark:border-muted-800 last:border-s-0`]: {},
+            [`@apply text-muted-400 hover:text-muted-600 dark:hover:text-muted-100`]: {},
+            [`@apply focus:text-muted-600 dark:focus:text-muted-100`]: {},
+            [`@apply transition-colors duration-300`]: {}
+          },
+          [`.${prefix}input-number-buttons svg`]: {
+            [`@apply h-4 w-4`]: {}
+          },
+          [`.${prefix}input-number-error-text`]: {
+            [`@apply text-${config.errorText.text} mt-1 block font-${config.errorText.font} text-${config.errorText.textSize} font-${config.errorText.fontWeight} leading-none`]: {}
+          },
+          [`.${prefix}input-number`]: {
+            [`@apply outline-none w-${config.input.focusSize} font-${config.input.font} transition-all duration-${config.input.duration} disabled:cursor-not-allowed disabled:opacity-75`]: {},
+            [`&:focus-visible ~ .${prefix}label-float`]: {
+              [`@apply !text-${config.input.focusVisible.labelFloat.text} dark:!text-${config.input.focusVisible.labelFloat.textDark}`]: {}
+            },
+            [`&:focus-visible ~ .${prefix}input-number-icon`]: {
+              [`@apply !text-${config.input.focusVisible.icon.text}`]: {}
+            },
+            [`&:disabled ~ .${prefix}input-number-icon`]: {
+              [`@apply cursor-not-allowed opacity-75`]: {}
+            }
+          },
+          [`.${prefix}input-number-placeload`]: {
+            [`@apply absolute start-0 top-0 flex w-full items-center px-4`]: {},
+            [`.${prefix}placeload`]: {
+              [`@apply h-3 w-full max-w-[50%] rounded`]: {}
+            }
+          },
+          [`.${prefix}input-number-action`]: {
+            [`@apply text-${config.input.action.text} absolute end-0 top-0 flex items-center justify-center transition-colors duration-${config.input.action.duration}`]: {}
+          },
+          [`&.${prefix}input-number-focus`]: {
+            [`.${prefix}input-number`]: {
+              [`@apply focus:border-primary-500 dark:focus:border-primary-500`]: {}
+            }
+          },
+          [`&.${prefix}input-number-rounded`]: {
+            [`.${prefix}input-number, .${prefix}input-number-outer`]: {
+              [`@apply rounded-${config.input.rounded.default}`]: {}
+            },
+            [`.${prefix}input-number-buttons button`]: {
+              [`@apply first:rounded-s-${config.input.rounded.default}`]: {},
+              [`@apply last:rounded-e-${config.input.rounded.default}`]: {}
+            }
+          },
+          [`&.${prefix}input-number-smooth`]: {
+            [`.${prefix}input-number, .${prefix}input-number-outer`]: {
+              [`@apply rounded-${config.input.rounded.smooth}`]: {}
+            },
+            [`.${prefix}input-number-buttons button`]: {
+              [`@apply first:rounded-s-${config.input.rounded.smooth}`]: {},
+              [`@apply last:rounded-e-${config.input.rounded.smooth}`]: {}
+            }
+          },
+          [`&.${prefix}input-number-curved`]: {
+            [`.${prefix}input-number, .${prefix}input-number-outer`]: {
+              [`@apply rounded-${config.input.rounded.curved}`]: {}
+            },
+            [`.${prefix}input-number-buttons button`]: {
+              [`@apply first:rounded-s-${config.input.rounded.curved}`]: {},
+              [`@apply last:rounded-e-${config.input.rounded.curved}`]: {}
+            }
+          },
+          [`&.${prefix}input-number-full`]: {
+            [`.${prefix}input-number, .${prefix}input-number-outer`]: {
+              [`@apply rounded-${config.input.rounded.full}`]: {}
+            },
+            [`.${prefix}input-number-buttons button`]: {
+              [`@apply first:rounded-s-${config.input.rounded.full}`]: {},
+              [`@apply last:rounded-e-${config.input.rounded.full}`]: {}
+            }
+          },
+          [`&.${prefix}input-number-sm`]: {
+            [`.${prefix}input-number-label`]: {
+              [`@apply pb-1 text-${config.input.sm.label.text}`]: {}
+            },
+            [`.${prefix}label-float`]: {
+              [`@apply top-1.5`]: {}
+            },
+            [`.${prefix}input-number-icon, .${prefix}input-number-action`]: {
+              [`@apply h-${config.input.sm.iconOrAction.size} w-${config.input.sm.iconOrAction.size}`]: {},
+              [`.${prefix}input-number-icon-inner, .${prefix}input-number-action-inner`]: {
+                [`@apply h-${config.input.sm.iconOrAcionInner.size} w-${config.input.sm.iconOrAcionInner.size}`]: {}
+              }
+            },
+            [`.${prefix}input-number-placeload`]: {
+              [`@apply h-${config.input.sm.placeload.size}`]: {}
+            },
+            [`.${prefix}input-number-buttons button`]: {
+              [`@apply h-6 w-6`]: {}
+            }
+          },
+          [`&.${prefix}input-number-md`]: {
+            [`.${prefix}input-number-label`]: {
+              [`@apply pb-1 text-${config.input.md.label.text}`]: {}
+            },
+            [`.${prefix}label-float`]: {
+              [`@apply top-2.5`]: {}
+            },
+            [`.${prefix}input-number-icon, .${prefix}input-number-action`]: {
+              [`@apply h-${config.input.md.iconOrAction.size} w-${config.input.md.iconOrAction.size}`]: {},
+              [`.${prefix}input-number-icon-inner, .${prefix}input-number-action-inner`]: {
+                [`@apply h-${config.input.md.iconOrAcionInner.size} w-${config.input.md.iconOrAcionInner.size}`]: {}
+              }
+            },
+            [`.${prefix}input-number-placeload`]: {
+              [`@apply h-${config.input.md.placeload.size}`]: {}
+            },
+            [`.${prefix}input-number-buttons button`]: {
+              [`@apply  h-8 w-8`]: {}
+            }
+          },
+          [`&.${prefix}input-number-lg`]: {
+            [`.${prefix}input-number-label`]: {
+              [`@apply pb-1 text-${config.input.lg.label.text}`]: {}
+            },
+            [`.${prefix}label-float`]: {
+              [`@apply top-3.5`]: {}
+            },
+            [`.${prefix}input-number-icon, .${prefix}input-number-action`]: {
+              [`@apply h-${config.input.lg.iconOrAction.size} w-${config.input.lg.iconOrAction.size}`]: {},
+              [`.${prefix}input-number-icon-inner, .${prefix}input-number-action-inner`]: {
+                [`@apply h-${config.input.lg.iconOrAcionInner.size} w-${config.input.lg.iconOrAcionInner.size}`]: {}
+              }
+            },
+            [`.${prefix}input-number-placeload`]: {
+              [`@apply h-${config.input.lg.placeload.size}`]: {}
+            },
+            [`.${prefix}input-number-buttons button`]: {
+              [`@apply h-10 w-10`]: {}
+            }
+          },
+          [`&.${prefix}input-number-default`]: {
+            [`.${prefix}input-number`]: {
+              [`@apply border bg-${config.input.default.bg} border-${config.input.default.border} text-${config.input.default.text} placeholder:text-${config.input.default.textPlaceholder} dark:border-${config.input.default.borderDark} dark:bg-${config.input.default.bgDark} dark:text-${config.input.default.textDark} dark:placeholder:text-${config.input.default.textPlaceholderDark}`]: {}
+            },
+            [`.${prefix}input-number-buttons button`]: {
+              [`@apply hover:bg-muted-100 dark:hover:bg-muted-800`]: {},
+              [`@apply focus:bg-muted-100 dark:focus:bg-muted-800`]: {}
+            }
+          },
+          [`&.${prefix}input-number-default-contrast`]: {
+            [`.${prefix}input-number`]: {
+              [`@apply border bg-${config.input.defaultContrast.bg} border-${config.input.defaultContrast.border} text-${config.input.defaultContrast.text} placeholder:text-${config.input.defaultContrast.textPlaceholder} dark:border-${config.input.defaultContrast.borderDark} dark:bg-${config.input.defaultContrast.bgDark} dark:text-${config.input.defaultContrast.textDark} dark:placeholder:text-${config.input.defaultContrast.textPlaceholderDark}`]: {}
+            },
+            [`.${prefix}input-number-buttons button`]: {
+              [`@apply hover:bg-muted-100 dark:hover:bg-muted-900`]: {},
+              [`@apply focus:bg-muted-100 dark:focus:bg-muted-900`]: {}
+            }
+          },
+          [`&.${prefix}input-number-muted`]: {
+            [`.${prefix}input-number`]: {
+              [`@apply border bg-${config.input.muted.bg} border-${config.input.muted.border} text-${config.input.muted.text} placeholder:text-${config.input.muted.textPlaceholder} dark:border-${config.input.muted.borderDark} dark:bg-${config.input.muted.bgDark} dark:text-${config.input.muted.textDark} dark:placeholder:text-${config.input.muted.textPlaceholderDark}`]: {}
+            },
+            [`.${prefix}input-number-buttons button`]: {
+              [`@apply hover:bg-white dark:hover:bg-muted-800`]: {},
+              [`@apply focus:bg-white dark:focus:bg-muted-800`]: {}
+            }
+          },
+          [`&.${prefix}input-number-muted-contrast`]: {
+            [`.${prefix}input-number`]: {
+              [`@apply border bg-${config.input.mutedContrast.bg} border-${config.input.mutedContrast.border} text-${config.input.mutedContrast.text} placeholder:text-${config.input.mutedContrast.textPlaceholder} dark:border-${config.input.mutedContrast.borderDark} dark:bg-${config.input.mutedContrast.bgDark} dark:text-${config.input.mutedContrast.textDark} dark:placeholder:text-${config.input.mutedContrast.textPlaceholderDark}`]: {}
+            },
+            [`.${prefix}input-number-buttons button`]: {
+              [`@apply hover:bg-white dark:hover:bg-muted-900`]: {},
+              [`@apply focus:bg-white dark:focus:bg-muted-900`]: {}
+            }
+          },
+          [`&:not(.${prefix}input-number-loading)`]: {
+            [`.${prefix}input-number:placeholder-shown ~ .${prefix}label-float`]: {
+              [`@apply text-${config.input.notLoading.text} dark:text-${config.input.notLoading.textDark}`]: {}
+            }
+          },
+          [`&.${prefix}input-number-loading`]: {
+            [`.${prefix}input-number`]: {
+              [`@apply !text-transparent placeholder:!text-transparent dark:placeholder:!text-transparent`]: {}
+            },
+            [`.${prefix}input-number:placeholder-shown ~ .${prefix}label-float`]: {
+              [`@apply text-transparent`]: {}
+            },
+            [`.${prefix}input-number-icon`]: {
+              [`@apply opacity-0`]: {}
+            }
+          },
+          [`&.${prefix}input-number-label-float`]: {
+            [`.${prefix}input-number`]: {
+              [`@apply placeholder:text-transparent dark:placeholder:text-transparent`]: {}
+            }
+          },
+          [`&.${prefix}input-number-error`]: {
+            [`.${prefix}input-number`]: {
+              [`@apply !border-${config.input.error.border} dark:!border-${config.input.error.borderDark}`]: {}
+            },
+            [`.${prefix}input-number-icon`]: {
+              [`@apply !text-${config.input.error.icon.text}`]: {}
+            }
+          },
+          [`&:not(.${prefix}has-icon).${prefix}input-number-sm`]: {
+            [`.${prefix}input-number`]: {
+              [`@apply h-8 py-1 text-${config.input.hasNotIcon.text.sm} leading-4 ps-2 pe-14`]: {}
+            }
+          },
+          [`&.${prefix}has-icon.${prefix}input-number-sm`]: {
+            [`.${prefix}input-number`]: {
+              [`@apply h-8 py-1 text-${config.input.hasIcon.text.sm} leading-4 pe-14 ps-8`]: {}
+            }
+          },
+          [`&:not(.${prefix}has-icon).${prefix}input-number-md`]: {
+            [`.${prefix}input-number`]: {
+              [`@apply h-10 py-2 text-${config.input.hasNotIcon.text.md} leading-5 ps-3 pe-20`]: {}
+            }
+          },
+          [`&.${prefix}has-icon.${prefix}input-number-md`]: {
+            [`.${prefix}input-number`]: {
+              [`@apply h-10 py-2 text-${config.input.hasIcon.text.md} leading-5 pe-20 ps-10`]: {}
+            }
+          },
+          [`&:not(.${prefix}has-icon).${prefix}input-number-lg`]: {
+            [`.${prefix}input-number`]: {
+              [`@apply h-12 py-2 text-${config.input.hasNotIcon.text.lg} leading-5 ps-4 pe-24`]: {}
+            }
+          },
+          [`&.${prefix}has-icon.${prefix}input-number-lg`]: {
+            [`.${prefix}input-number`]: {
+              [`@apply h-12 py-2 text-${config.input.hasIcon.text.lg} leading-5 pe-24 ps-11`]: {}
+            }
+          },
+          [`&.${prefix}has-action.${prefix}input-number-sm`]: {
+            [`.${prefix}input-number`]: {
+              [`@apply pe-${config.input.hasAction.spaceSM}`]: {}
+            }
+          },
+          [`&.${prefix}has-action.${prefix}input-number-md`]: {
+            [`.${prefix}input-number`]: {
+              [`@apply pe-${config.input.hasAction.spaceMD}`]: {}
+            }
+          },
+          [`&.${prefix}has-action.${prefix}input-number-lg`]: {
+            [`.${prefix}input-number`]: {
+              [`@apply pe-${config.input.hasAction.spaceLG}`]: {}
+            }
+          },
+          [`&.${prefix}input-number-label-float:not(.${prefix}has-icon).${prefix}input-number-sm`]: {
+            [`.${prefix}label-float`]: {
+              [`@apply start-3 -ms-3 -mt-7 text-${config.input.hasNotIcon.labelFloat.sm}`]: {}
+            },
+            [`.${prefix}input-number:focus-visible ~ .${prefix}label-float`]: {
+              [`@apply !-ms-3 !-mt-7`]: {}
+            },
+            [`.${prefix}input-number:placeholder-shown ~ .${prefix}label-float`]: {
+              [`@apply ms-0 mt-0`]: {}
+            }
+          },
+          [`&.${prefix}input-number-label-float.${prefix}has-icon.${prefix}input-number-sm`]: {
+            [`.${prefix}label-float`]: {
+              [`@apply start-8 -ms-8 -mt-7 text-${config.input.hasIcon.labelFloat.sm}`]: {}
+            },
+            [`.${prefix}input-number:focus-visible ~ .${prefix}label-float`]: {
+              [`@apply !-ms-8 !-mt-7`]: {}
+            },
+            [`.${prefix}input-number:placeholder-shown ~ .${prefix}label-float`]: {
+              [`@apply ms-0 mt-0`]: {}
+            }
+          },
+          [`&.${prefix}input-number-label-float:not(.${prefix}has-icon).${prefix}input-number-md`]: {
+            [`.${prefix}label-float`]: {
+              [`@apply start-3 -ms-3 -mt-8 text-${config.input.hasNotIcon.labelFloat.md.text}`]: {}
+            },
+            [`.${prefix}input-number:focus-visible ~ .${prefix}label-float`]: {
+              [`@apply !-ms-3 !-mt-8 !text-${config.input.hasNotIcon.labelFloat.md.focusVisible.text}`]: {}
+            },
+            [`.${prefix}input-number:placeholder-shown ~ .${prefix}label-float`]: {
+              [`@apply ms-0 mt-0 text-${config.input.hasNotIcon.labelFloat.md.placeholderShown.text}`]: {}
+            }
+          },
+          [`&.${prefix}input-number-label-float.${prefix}has-icon.${prefix}input-number-md`]: {
+            [`.${prefix}label-float`]: {
+              [`@apply start-10 -ms-10 -mt-8 text-${config.input.hasIcon.labelFloat.md.text}`]: {}
+            },
+            [`.${prefix}input-number:focus-visible ~ .${prefix}label-float`]: {
+              [`@apply !-ms-10 !-mt-8 !text-${config.input.hasIcon.labelFloat.md.focusVisible.text}`]: {}
+            },
+            [`.${prefix}input-number:placeholder-shown ~ .${prefix}label-float`]: {
+              [`@apply ms-0 mt-0 text-${config.input.hasIcon.labelFloat.md.placeholderShown.text}`]: {}
+            }
+          },
+          [`&.${prefix}input-number-label-float:not(.${prefix}has-icon).${prefix}input-number-lg`]: {
+            [`.${prefix}label-float`]: {
+              [`@apply start-3 -ms-3 -mt-8 text-${config.input.hasNotIcon.labelFloat.lg.text}`]: {}
+            },
+            [`.${prefix}input-number:focus-visible ~ .${prefix}label-float`]: {
+              [`@apply !-ms-3 !-mt-9 !text-${config.input.hasNotIcon.labelFloat.lg.focusVisible.text}`]: {}
+            },
+            [`.${prefix}input-number:placeholder-shown ~ .${prefix}label-float`]: {
+              [`@apply ms-0 mt-0 text-${config.input.hasNotIcon.labelFloat.lg.placeholderShown.text}`]: {}
+            }
+          },
+          [`&.${prefix}input-number-label-float.${prefix}has-icon.${prefix}input-number-lg`]: {
+            [`.${prefix}label-float`]: {
+              [`@apply start-11 -ms-10 -mt-8 text-${config.input.hasIcon.labelFloat.lg.text}`]: {}
+            },
+            [`.${prefix}input-number:focus-visible ~ .${prefix}label-float`]: {
+              [`@apply !-ms-10 !-mt-9 !text-${config.input.hasIcon.labelFloat.lg.focusVisible.text}`]: {}
+            },
+            [`.${prefix}input-number:placeholder-shown ~ .${prefix}label-float`]: {
+              [`@apply ms-0 mt-0 text-${config.input.hasIcon.labelFloat.lg.placeholderShown.text}`]: {}
+            }
+          }
+        }
+      });
+    };
+  },
+  function() {
+    return {
+      theme: {
+        shurikenUi: {
+          [key$v]: defaultConfig$u
+        }
+      }
+    };
+  }
+);
+const key$u = "label";
+const defaultConfig$t = {
+  font: "sans",
+  text: "muted-400",
+  textDark: "muted-400/80"
+};
+const label = plugin.withOptions(
+  function(options) {
+    let { prefix } = defu(options, defaultPluginOptions);
+    if (prefix) {
+      prefix = `${prefix}-`;
+    }
+    return function({ addComponents, theme }) {
+      const config = theme(`shurikenUi.${key$u}`);
+      addComponents({
+        [`.${prefix}label`]: {
+          [`@apply inline-block font-${config.font} leading-none text-${config.text} dark:text-${config.textDark}`]: {}
+        }
+      });
+    };
+  },
+  function() {
+    return {
+      theme: {
+        shurikenUi: {
+          [key$u]: defaultConfig$t
+        }
+      }
+    };
+  }
+);
+const key$t = "link";
+const defaultConfig$s = {
+  font: "sans",
+  textHover: "primary-500",
+  textHoverDark: "primary-400",
+  textFocus: "primary-500",
+  textFocusDark: "primary-400"
+};
+const link = plugin.withOptions(
+  function(options) {
+    let { prefix } = defu(options, defaultPluginOptions);
+    if (prefix) {
+      prefix = `${prefix}-`;
+    }
+    return function({ addComponents, theme }) {
+      const config = theme(`shurikenUi.${key$t}`);
+      addComponents({
+        [`.${prefix}link`]: {
+          [`@apply font-${config.font} hover:text-${config.textHover} dark:hover:text-${config.textHoverDark} underline-offset-4 hover:underline focus:text-${config.textFocus} dark:focus:text-${config.textFocusDark} focus:underline`]: {}
+        }
+      });
+    };
+  },
+  function() {
+    return {
+      theme: {
+        shurikenUi: {
+          [key$t]: defaultConfig$s
+        }
+      }
+    };
+  }
+);
+const key$s = "list";
+const defaultConfig$r = {
+  ul: "disc",
+  ol: "decimal",
+  base: {
+    textMarker: "muted-500",
+    textMarkerDark: "muted-400",
+    text: "slate-700",
+    textDark: "slate-300",
+    font: "sans"
+  },
+  media: {
+    textMarker: "slate-500",
+    textMarkerDark: "slate-400"
+  }
+};
+const list = plugin.withOptions(
+  function(options) {
+    let { prefix } = defu(options, defaultPluginOptions);
+    if (prefix) {
+      prefix = `${prefix}-`;
+    }
+    return function({ addComponents, theme }) {
+      const config = theme(`shurikenUi.${key$s}`);
+      addComponents({
+        [`.${prefix}list`]: {
+          [`&.${prefix}list-ul`]: {
+            [`@apply list-${config.ul}`]: {}
+          },
+          [`&.${prefix}list-ol`]: {
+            [`@apply list-${config.ol}`]: {}
+          },
+          [`&.${prefix}list-base`]: {
+            [`@apply space-y-1 marker:text-${config.base.textMarker} dark:marker:text-${config.base.textMarkerDark} font-${config.base.font} text-${config.base.text} dark:text-${config.base.textDark}`]: {}
+          },
+          [`&.${prefix}list-media`]: {
+            [`@apply space-y-4 marker:text-${config.media.textMarker} dark:marker:text-${config.media.textMarkerDark}`]: {},
+            [`.${prefix}list-item`]: {
+              [`@apply flex gap-2`]: {}
+            }
+          }
+        }
+      });
+    };
+  },
+  function() {
+    return {
+      theme: {
+        shurikenUi: {
+          [key$s]: defaultConfig$r
+        }
+      }
+    };
+  }
+);
+const key$r = "listbox";
+const defaultConfig$q = {
+  labelFloat: {
+    text: "primary-500",
+    size: "5",
+    duration: "300"
+  },
+  button: {
+    size: "full",
+    text: "sm",
+    textPosition: "start",
+    font: "sans",
+    iconBox: {
+      space: "2",
+      size: "6",
+      innerSize: "4"
+    },
+    placeholder: {
+      text: "muted-300",
+      textDark: "muted-500",
+      textPosition: "left"
+    }
+  },
+  icon: {
+    text: "muted-400",
+    duration: "300"
+  },
+  chevron: {
+    inner: {
+      size: "4",
+      text: "muted-400",
+      duration: "300"
+    }
+  },
+  options: {
+    ringFocus: "primary-500/50",
+    space: "2",
+    text: "base",
+    shadowSize: "lg",
+    shadow: "muted-500/10",
+    shadowDark: "muted-800/10"
+  },
+  option: {
+    duration: "300",
+    iconBox: {
+      text: "muted-200",
+      textDark: "muted-400",
+      innerSize: "5"
+    },
+    inner: {
+      heading: {
+        text: "muted-800",
+        textDark: "white"
+      },
+      text: "muted-400"
+    },
+    icon: {
+      text: "primary-600"
+    },
+    iconInner: {
+      size: "4"
+    },
+    activeOrHover: {
+      text: "primary-600",
+      textDark: "primary-400",
+      bg: "primary-500/10"
+    }
+  },
+  errorText: {
+    text: "danger-600",
+    textSize: "[0.65rem]",
+    font: "sans",
+    fontWeight: "medium"
+  },
+  sm: {
+    text: "xs",
+    icon: {
+      size: "8",
+      innerSize: "4"
     },
     placeload: {
       size: "8"
@@ -5635,6 +6194,7 @@ const defaultListboxConfig = {
     }
   }
 };
 const listbox = plugin.withOptions(
   function(options) {
     let { prefix } = defu(options, defaultPluginOptions);
@@ -5642,9 +6202,7 @@ const listbox = plugin.withOptions(
       prefix = `${prefix}-`;
     }
     return function({ addComponents, theme }) {
-      const config = theme(
-        "shurikenUi.listbox"
-      );
+      const config = theme(`shurikenUi.${key$r}`);
       addComponents({
         [`.${prefix}listbox`]: {
           [`@apply relative w-full`]: {},
@@ -5994,19 +6552,21 @@ const listbox = plugin.withOptions(
     return {
       theme: {
         shurikenUi: {
-          listbox: defaultListboxConfig
+          [key$r]: defaultConfig$q
         }
       }
     };
   }
 );
-const defaultMarkConfig = {
+const key$q = "mark";
+const defaultConfig$p = {
   bg: "primary-100",
   bgDark: "primary-800",
   text: "primary-800",
   textDark: "primary-200"
 };
 const mark = plugin.withOptions(
   function(options) {
     let { prefix } = defu(options, defaultPluginOptions);
@@ -6014,7 +6574,7 @@ const mark = plugin.withOptions(
       prefix = `${prefix}-`;
     }
     return function({ addComponents, theme }) {
-      const config = theme("shurikenUi.mark");
+      const config = theme(`shurikenUi.${key$q}`);
       addComponents({
         [`.${prefix}mark`]: {
           [`@apply bg-${config.bg} dark:bg-${config.bgDark}`]: {},
@@ -6027,20 +6587,24 @@ const mark = plugin.withOptions(
     return {
       theme: {
         shurikenUi: {
-          mark: defaultMarkConfig
+          [key$q]: defaultConfig$p
         }
       }
     };
   }
 );
+const key$p = "mask";
+const defaultConfig$o = {};
 const mask = plugin.withOptions(
   function(options) {
     let { prefix } = defu(options, defaultPluginOptions);
     if (prefix) {
       prefix = `${prefix}-`;
     }
-    return function({ addComponents }) {
+    return function({ addComponents, theme }) {
+      theme(`shurikenUi.${key$p}`);
       addComponents({
         [`.${prefix}mask`]: {
           "mask-size": "contain",
@@ -6066,11 +6630,18 @@ const mask = plugin.withOptions(
     };
   },
   function() {
-    return {};
+    return {
+      theme: {
+        shurikenUi: {
+          [key$p]: defaultConfig$o
+        }
+      }
+    };
   }
 );
-const defaultMessageTextConfig = {
+const key$o = "messageText";
+const defaultConfig$n = {
   space: "6",
   head: {
     space: "2"
@@ -6144,6 +6715,7 @@ const defaultMessageTextConfig = {
     curved: "xl"
   }
 };
 const messageText = plugin.withOptions(
   function(options) {
     let { prefix } = defu(options, defaultPluginOptions);
@@ -6151,9 +6723,7 @@ const messageText = plugin.withOptions(
       prefix = `${prefix}-`;
     }
     return function({ addComponents, theme }) {
-      const config = theme(
-        "shurikenUi.messageText"
-      );
+      const config = theme(`shurikenUi.${key$o}`);
       addComponents({
         [`.${prefix}message-text`]: {
           [`@apply relative p-${config.space}`]: {},
@@ -6231,14 +6801,15 @@ const messageText = plugin.withOptions(
     return {
       theme: {
         shurikenUi: {
-          messageText: defaultMessageTextConfig
+          [key$o]: defaultConfig$n
         }
       }
     };
   }
 );
-const defaultMessageConfig = {
+const key$n = "message";
+const defaultConfig$m = {
   messageIconOuter: {
     size: "10",
     icon: {
@@ -6407,6 +6978,7 @@ const defaultMessageConfig = {
     }
   }
 };
 const message = plugin.withOptions(
   function(options) {
     let { prefix } = defu(options, defaultPluginOptions);
@@ -6414,9 +6986,7 @@ const message = plugin.withOptions(
       prefix = `${prefix}-`;
     }
     return function({ addComponents, theme }) {
-      const config = theme(
-        "shurikenUi.message"
-      );
+      const config = theme(`shurikenUi.${key$n}`);
       addComponents({
         [`.${prefix}message`]: {
           [`@apply flex min-h-[3rem] items-center border p-1 pe-2`]: {},
@@ -6430,7 +7000,7 @@ const message = plugin.withOptions(
             [`@apply text-${config.messageInnerText.textColor} px-3 block font-${config.messageInnerText.font} text-${config.messageInnerText.text}`]: {}
           },
           [`.${prefix}message-close`]: {
-            [`@apply ${prefix}focus text-${config.messageClose.text} me-2 ms-auto flex cursor-pointer items-center justify-center p-${config.messageClose.space} outline-none rounded-${config.messageClose.rounded} transition-colors duration-${config.messageClose.duration}`]: {},
+            [`@apply ${prefix}focus text-${config.messageClose.text} me-2 ms-auto flex cursor-pointer items-center justify-center p-${config.messageClose.space} rounded-${config.messageClose.rounded} transition-colors duration-${config.messageClose.duration}`]: {},
             [`.${prefix}close-icon`]: {
               [`@apply h-${config.messageClose.iconSize} w-${config.messageClose.iconSize}`]: {}
             }
@@ -6551,14 +7121,15 @@ const message = plugin.withOptions(
     return {
       theme: {
         shurikenUi: {
-          message: defaultMessageConfig
+          [key$n]: defaultConfig$m
         }
       }
     };
   }
 );
-const defaultModalConfig = {
+const key$m = "modal";
+const defaultConfig$l = {
   backdrop: {
     bg: "muted-800/70",
     bgDark: "muted-900/80"
@@ -6577,6 +7148,7 @@ const defaultModalConfig = {
   modal2XL: "3xl",
   modal3XL: "5xl"
 };
 const modal = plugin.withOptions(
   function(options) {
     let { prefix } = defu(options, defaultPluginOptions);
@@ -6584,9 +7156,7 @@ const modal = plugin.withOptions(
       prefix = `${prefix}-`;
     }
     return function({ addComponents, theme }) {
-      const config = theme(
-        "shurikenUi.modal"
-      );
+      const config = theme(`shurikenUi.${key$m}`);
       addComponents({
         [`.${prefix}modal`]: {
           [`@apply fixed inset-0 z-[9999] flex items-center justify-center`]: {},
@@ -6643,14 +7213,15 @@ const modal = plugin.withOptions(
     return {
       theme: {
         shurikenUi: {
-          modal: defaultModalConfig
+          [key$m]: defaultConfig$l
         }
       }
     };
   }
 );
-const defaultPaginationConfig = {
+const key$l = "pagination";
+const defaultConfig$k = {
   size: "full",
   list: {
     border: "muted-200",
@@ -6727,6 +7298,7 @@ const defaultPaginationConfig = {
     full: "full"
   }
 };
 const pagination = plugin.withOptions(
   function(options) {
     let { prefix } = defu(options, defaultPluginOptions);
@@ -6734,9 +7306,7 @@ const pagination = plugin.withOptions(
       prefix = `${prefix}-`;
     }
     return function({ addComponents, theme }) {
-      const config = theme(
-        "shurikenUi.pagination"
-      );
+      const config = theme(`shurikenUi.${key$l}`);
       addComponents({
         [`.${prefix}pagination`]: {
           [`@apply inline-flex w-${config.size} flex-col md:flex-row md:justify-between`]: {},
@@ -6784,14 +7354,15 @@ const pagination = plugin.withOptions(
     return {
       theme: {
         shurikenUi: {
-          pagination: defaultPaginationConfig
+          [key$l]: defaultConfig$k
         }
       }
     };
   }
 );
-const defaultParagraphConfig = {
+const key$k = "paragraph";
+const defaultConfig$j = {
   textXS: "xs",
   textSM: "sm",
   textMD: "base",
@@ -6817,6 +7388,7 @@ const defaultParagraphConfig = {
   textLeadSnug: "snug",
   textLeadLoose: "loose"
 };
 const paragraph = plugin.withOptions(
   function(options) {
     let { prefix } = defu(options, defaultPluginOptions);
@@ -6824,9 +7396,7 @@ const paragraph = plugin.withOptions(
       prefix = `${prefix}-`;
     }
     return function({ addComponents, theme }) {
-      const config = theme(
-        "shurikenUi.paragraph"
-      );
+      const config = theme(`shurikenUi.${key$k}`);
       addComponents({
         [`.${prefix}paragraph`]: {
           [`@apply font-sans`]: {},
@@ -6910,14 +7480,15 @@ const paragraph = plugin.withOptions(
     return {
       theme: {
         shurikenUi: {
-          paragraph: defaultParagraphConfig
+          [key$k]: defaultConfig$j
         }
       }
     };
   }
 );
-const defaultPlaceholderPageConfig = {
+const key$j = "placeholderPage";
+const defaultConfig$i = {
   minSize: "[400px]",
   innerSize: "full",
   maxContentSize: "sm",
@@ -6934,6 +7505,7 @@ const defaultPlaceholderPageConfig = {
     text: "muted-400"
   }
 };
 const placeholderPage = plugin.withOptions(
   function(options) {
     let { prefix } = defu(options, defaultPluginOptions);
@@ -6941,9 +7513,7 @@ const placeholderPage = plugin.withOptions(
       prefix = `${prefix}-`;
     }
     return function({ addComponents, theme }) {
-      const config = theme(
-        "shurikenUi.placeholderPage"
-      );
+      const config = theme(`shurikenUi.${key$j}`);
       addComponents({
         [`.${prefix}placeholder-page`]: {
           [`@apply flex min-h-${config.minSize} items-center justify-center`]: {},
@@ -6988,20 +7558,24 @@ const placeholderPage = plugin.withOptions(
     return {
       theme: {
         shurikenUi: {
-          placeholderPage: defaultPlaceholderPageConfig
+          [key$j]: defaultConfig$i
         }
       }
     };
   }
 );
+const key$i = "placeload";
+const defaultConfig$h = {};
 const placeload = plugin.withOptions(
   function(options) {
     let { prefix } = defu(options, defaultPluginOptions);
     if (prefix) {
       prefix = `${prefix}-`;
     }
-    return function({ addComponents }) {
+    return function({ addComponents, theme }) {
+      theme(`shurikenUi.${key$i}`);
       addComponents({
         [`.${prefix}placeload`]: {
           position: "relative",
@@ -7023,6 +7597,9 @@ const placeload = plugin.withOptions(
     }
     return {
       theme: {
+        shurikenUi: {
+          [key$i]: defaultConfig$h
+        },
         extend: {
           keyframes: {
             [`${prefix}placeload`]: {
@@ -7039,7 +7616,8 @@ const placeload = plugin.withOptions(
   }
 );
-const defaultProgressCircleConfig = {
+const key$h = "progressCircle";
+const defaultConfig$g = {
   circleDuration: "500",
   default: {
     text: "muted-200",
@@ -7052,6 +7630,7 @@ const defaultProgressCircleConfig = {
     stroke: "current"
   }
 };
 const progressCircle = plugin.withOptions(
   function(options) {
     let { prefix } = defu(options, defaultPluginOptions);
@@ -7059,9 +7638,7 @@ const progressCircle = plugin.withOptions(
       prefix = `${prefix}-`;
     }
     return function({ addComponents, theme }) {
-      const config = theme(
-        "shurikenUi.progressCircle"
-      );
+      const config = theme(`shurikenUi.${key$h}`);
       addComponents({
         [`.${prefix}progress-circle`]: {
           [`@apply relative inline-flex items-center justify-center`]: {},
@@ -7082,14 +7659,15 @@ const progressCircle = plugin.withOptions(
     return {
       theme: {
         shurikenUi: {
-          progressCircle: defaultProgressCircleConfig
+          [key$h]: defaultConfig$g
         }
       }
     };
   }
 );
-const defaultProgressConfig = {
+const key$g = "progress";
+const defaultConfig$f = {
   size: "full",
   bar: {
     duration: "300"
@@ -7117,6 +7695,7 @@ const defaultProgressConfig = {
   warning: "warning-500",
   danger: "danger-500"
 };
 const progress = plugin.withOptions(
   function(options) {
     let { prefix } = defu(options, defaultPluginOptions);
@@ -7124,9 +7703,7 @@ const progress = plugin.withOptions(
       prefix = `${prefix}-`;
     }
     return function({ addComponents, theme }) {
-      const config = theme(
-        "shurikenUi.progress"
-      );
+      const config = theme(`shurikenUi.${key$g}`);
       addComponents({
         [`.${prefix}progress`]: {
           [`@apply relative w-${config.size} overflow-hidden`]: {},
@@ -7203,7 +7780,7 @@ const progress = plugin.withOptions(
     return {
       theme: {
         shurikenUi: {
-          progress: defaultProgressConfig
+          [key$g]: defaultConfig$f
         },
         extend: {
           keyframes: {
@@ -7222,7 +7799,8 @@ const progress = plugin.withOptions(
   }
 );
-const defaultProseConfig = {
+const key$f = "prose";
+const defaultConfig$e = {
   color: "muted",
   dark: "invert",
   space: "4",
@@ -7241,6 +7819,7 @@ const defaultProseConfig = {
     tdBorderDark: "muted-700"
   }
 };
 const prose = plugin.withOptions(
   function(options) {
     let { prefix } = defu(options, defaultPluginOptions);
@@ -7248,9 +7827,7 @@ const prose = plugin.withOptions(
       prefix = `${prefix}-`;
     }
     return function({ addComponents, theme }) {
-      const config = theme(
-        "shurikenUi.prose"
-      );
+      const config = theme(`shurikenUi.${key$f}`);
       addComponents({
         [`.${prefix}prose`]: {
           [`@apply prose prose-primary prose-${config.color} dark:prose-${config.dark} prose-th:p-${config.space} prose-td:p-${config.space} prose-table:bg-${config.bgTable} dark:prose-table:bg-${config.bgTableDark} prose-table:border prose-table:border-${config.borderTable} dark:prose-table:border-${config.borderTableDark}`]: {},
@@ -7271,14 +7848,15 @@ const prose = plugin.withOptions(
     return {
       theme: {
         shurikenUi: {
-          prose: defaultProseConfig
+          [key$f]: defaultConfig$e
         }
       }
     };
   }
 );
-const defaultRadioConfig = {
+const key$e = "radio";
+const defaultConfig$d = {
   outer: {
     size: "5"
   },
@@ -7321,6 +7899,7 @@ const defaultRadioConfig = {
   warning: "warning-500",
   danger: "danger-500"
 };
 const radio = plugin.withOptions(
   function(options) {
     let { prefix } = defu(options, defaultPluginOptions);
@@ -7328,9 +7907,7 @@ const radio = plugin.withOptions(
       prefix = `${prefix}-`;
     }
     return function({ addComponents, theme }) {
-      const config = theme(
-        "shurikenUi.radio"
-      );
+      const config = theme(`shurikenUi.${key$e}`);
       addComponents({
         [`.${prefix}radio`]: {
           [`@apply relative inline-flex items-start gap-1`]: {},
@@ -7393,14 +7970,15 @@ const radio = plugin.withOptions(
     return {
       theme: {
         shurikenUi: {
-          radio: defaultRadioConfig
+          [key$e]: defaultConfig$d
         }
       }
     };
   }
 );
-const defaultSelectConfig = {
+const key$d = "select";
+const defaultConfig$c = {
   labelFloat: {
     text: "primary-500",
     size: "5",
@@ -7569,6 +8147,7 @@ const defaultSelectConfig = {
     }
   }
 };
 const select = plugin.withOptions(
   function(options) {
     let { prefix } = defu(options, defaultPluginOptions);
@@ -7576,9 +8155,7 @@ const select = plugin.withOptions(
       prefix = `${prefix}-`;
     }
     return function({ addComponents, theme }) {
-      const config = theme(
-        "shurikenUi.select"
-      );
+      const config = theme(`shurikenUi.${key$d}`);
       addComponents({
         [`.${prefix}select-wrapper`]: {
           [`@apply relative`]: {},
@@ -7860,20 +8437,22 @@ const select = plugin.withOptions(
     return {
       theme: {
         shurikenUi: {
-          select: defaultSelectConfig
+          [key$d]: defaultConfig$c
         }
       }
     };
   }
 );
-const defaultSlimscrollConfig = {
+const key$c = "slimscroll";
+const defaultConfig$b = {
   width: "[6px]",
   bg: "black/5",
   bgDark: "white/5",
   bgHover: "black/20",
   bgHoverDark: "white/20"
 };
 const slimscroll = plugin.withOptions(
   function(options) {
     let { prefix } = defu(options, defaultPluginOptions);
@@ -7881,9 +8460,7 @@ const slimscroll = plugin.withOptions(
       prefix = `${prefix}-`;
     }
     return function({ addComponents, theme }) {
-      const config = theme(
-        "shurikenUi.slimscroll"
-      );
+      const config = theme(`shurikenUi.${key$c}`);
       addComponents({
         [`.${prefix}slimscroll::-webkit-scrollbar, .${prefix}slimscroll-opaque::-webkit-scrollbar`]: {
           scrollBehavior: "smooth",
@@ -7906,14 +8483,15 @@ const slimscroll = plugin.withOptions(
     return {
       theme: {
         shurikenUi: {
-          slimscroll: defaultSlimscrollConfig
+          [key$c]: defaultConfig$b
         }
       }
     };
   }
 );
-const defaultSnackConfig = {
+const key$b = "snack";
+const defaultConfig$a = {
   rounded: "full",
   icon: {
     border: "muted-200",
@@ -7967,6 +8545,7 @@ const defaultSnackConfig = {
     bgDark: "muted-700"
   }
 };
 const snack = plugin.withOptions(
   function(options) {
     let { prefix } = defu(options, defaultPluginOptions);
@@ -7974,12 +8553,10 @@ const snack = plugin.withOptions(
       prefix = `${prefix}-`;
     }
     return function({ addComponents, theme }) {
-      const config = theme(
-        "shurikenUi.snack"
-      );
+      const config = theme(`shurikenUi.${key$b}`);
       addComponents({
         [`.${prefix}snack`]: {
-          [`@apply ${prefix}focus inline-flex items-center gap-1 rounded-${config.rounded} outline-transparent overflow-hidden`]: {},
+          [`@apply inline-flex items-center gap-1 rounded-${config.rounded} outline-transparent`]: {},
           [`.${prefix}snack-icon`]: {
             [`@apply border-${config.icon.border} -ms-0.5 flex items-center justify-center rounded-${config.icon.rounded} border bg-${config.icon.bg}`]: {}
           },
@@ -8036,14 +8613,15 @@ const snack = plugin.withOptions(
     return {
       theme: {
         shurikenUi: {
-          snack: defaultSnackConfig
+          [key$b]: defaultConfig$a
         }
       }
     };
   }
 );
-const defaultSwitchBallConfig = {
+const key$a = "switchBall";
+const defaulConfig = {
   handle: {
     border: "muted-300",
     borderDark: "muted-600",
@@ -8091,6 +8669,7 @@ const defaultSwitchBallConfig = {
   warning: "warning-400",
   danger: "danger-400"
 };
 const switchBall = plugin.withOptions(
   function(options) {
     let { prefix } = defu(options, defaultPluginOptions);
@@ -8098,20 +8677,18 @@ const switchBall = plugin.withOptions(
       prefix = `${prefix}-`;
     }
     return function({ addComponents, theme }) {
-      const config = theme(
-        "shurikenUi.switchBall"
-      );
+      const config = theme(`shurikenUi.${key$a}`);
       addComponents({
         [`.${prefix}switch-ball`]: {
           [`@apply flex cursor-pointer items-center`]: {},
           [`.${prefix}switch-ball-outer`]: {
-            [`@apply relative block`]: {}
+            [`@apply ${prefix}focus relative block rounded-${config.handle.rounded}`]: {}
           },
           [`.${prefix}switch-ball-handle`]: {
             [`@apply border-${config.handle.border} dark:border-${config.handle.borderDark} dark:bg-${config.handle.bgDark} absolute start-0.5 top-1/2 z-10 flex h-${config.handle.size} w-${config.handle.size} -translate-y-1/2 items-center justify-center rounded-${config.handle.rounded} border bg-${config.handle.bg} shadow transition focus:w-6`]: {}
           },
           [`.${prefix}switch-ball-track`]: {
-            [`@apply bg-${config.track.bg} dark:bg-${config.track.bgDark} block h-6 w-11 rounded-${config.track.rounded} shadow-inner outline-1 outline-transparent transition-all duration-${config.track.duration}`]: {}
+            [`@apply bg-${config.track.bg} dark:bg-${config.track.bgDark} block h-6 w-11 rounded-${config.track.rounded} shadow-inner transition-all duration-${config.track.duration}`]: {}
           },
           [`.${prefix}switch-ball-icon`]: {
             [`@apply pointer-events-none absolute start-2 top-1/2 z-10 h-${config.icon.size} w-${config.icon.size} translate-y-0 fill-current text-${config.icon.text} opacity-0 transition duration-${config.icon.duration}`]: {}
@@ -8133,9 +8710,6 @@ const switchBall = plugin.withOptions(
             [`&:checked ~ .${prefix}switch-ball-handle`]: {
               [`@apply -translate-y-1/2 translate-x-full rtl:-translate-x-full`]: {}
             },
-            [`&:checked ~ .${prefix}switch-ball-track`]: {
-              [`@apply outline-dashed outline-offset-2 ring-0 dark:outline-muted-600 outline-muted-300`]: {}
-            },
             [`&:checked ~ .${prefix}switch-ball-icon`]: {
               [`@apply -translate-y-1/2 opacity-100`]: {}
             }
@@ -8163,14 +8737,15 @@ const switchBall = plugin.withOptions(
     return {
       theme: {
         shurikenUi: {
-          switchBall: defaultSwitchBallConfig
+          [key$a]: defaulConfig
         }
       }
     };
   }
 );
-const defaultSwitchThinConfig = {
+const key$9 = "switchThin";
+const defaultConfig$9 = {
   handle: {
     border: "muted-300",
     borderDark: "muted-600",
@@ -8213,6 +8788,7 @@ const defaultSwitchThinConfig = {
   warning: "warning-400",
   danger: "danger-400"
 };
 const switchThin = plugin.withOptions(
   function(options) {
     let { prefix } = defu(options, defaultPluginOptions);
@@ -8220,20 +8796,18 @@ const switchThin = plugin.withOptions(
       prefix = `${prefix}-`;
     }
     return function({ addComponents, theme }) {
-      const config = theme(
-        "shurikenUi.switchThin"
-      );
+      const config = theme(`shurikenUi.switchThin`);
       addComponents({
         [`.${prefix}switch-thin`]: {
           [`@apply flex cursor-pointer items-center`]: {},
           [`.${prefix}switch-thin-outer`]: {
-            [`@apply relative block h-4`]: {}
+            [`@apply ${prefix}focus relative block h-4 rounded-${config.handle.rounded}`]: {}
           },
           [`.${prefix}switch-thin-handle`]: {
             [`@apply border-${config.handle.border} dark:border-${config.handle.borderDark} dark:bg-${config.handle.bgDark} absolute -start-1 top-1/2 flex h-${config.handle.size} w-${config.handle.size} -translate-y-1/2 items-center justify-center rounded-${config.handle.rounded} border bg-${config.handle.bg} shadow transition`]: {}
           },
           [`.${prefix}switch-thin-track`]: {
-            [`@apply bg-${config.track.bg} dark:bg-${config.track.bgDark} block h-4 w-10 rounded-${config.track.rounded} shadow-inner outline-1 outline-transparent transition-all duration-${config.track.duration}`]: {}
+            [`@apply bg-${config.track.bg} dark:bg-${config.track.bgDark} block h-4 w-10 rounded-${config.track.rounded} shadow-inner transition-all duration-${config.track.duration}`]: {}
           },
           [`.${prefix}switch-thin-single-label`]: {
             [`@apply text-${config.singleLabel.text} relative ms-3 cursor-pointer select-none font-${config.singleLabel.font} text-${config.singleLabel.textSize}`]: {}
@@ -8251,9 +8825,6 @@ const switchThin = plugin.withOptions(
             [`@apply absolute z-20 h-${config.input.size} w-${config.input.size} cursor-pointer opacity-0`]: {},
             [`&:checked ~ .${prefix}switch-thin-handle`]: {
               [`@apply -translate-y-1/2 translate-x-full rtl:-translate-x-full`]: {}
-            },
-            [`&:checked ~ .${prefix}switch-thin-track`]: {
-              [`@apply outline-dashed outline-offset-2 ring-0 dark:outline-muted-600 outline-muted-300`]: {}
             }
           },
           [`&.${prefix}switch-thin-primary .${prefix}switch-thin-input:checked ~ .${prefix}switch-thin-track`]: {
@@ -8279,14 +8850,15 @@ const switchThin = plugin.withOptions(
     return {
       theme: {
         shurikenUi: {
-          switchThin: defaultSwitchThinConfig
+          [key$9]: defaultConfig$9
         }
       }
     };
   }
 );
-const defaultTabSliderConfig = {
+const key$8 = "tabSlider";
+const defaultConfig$8 = {
   track: {
     bg: "muted-100",
     bgDark: "muted-700",
@@ -8320,6 +8892,7 @@ const defaultTabSliderConfig = {
     track: "10"
   }
 };
 const tabSlider = plugin.withOptions(
   function(options) {
     let { prefix } = defu(options, defaultPluginOptions);
@@ -8327,9 +8900,7 @@ const tabSlider = plugin.withOptions(
       prefix = `${prefix}-`;
     }
     return function({ addComponents, theme }) {
-      const config = theme(
-        "shurikenUi.tabSlider"
-      );
+      const config = theme(`shurikenUi.${key$8}`);
       addComponents({
         [`.${prefix}tab-slider`]: {
           [`@apply relative`]: {},
@@ -8440,14 +9011,15 @@ const tabSlider = plugin.withOptions(
     return {
       theme: {
         shurikenUi: {
-          tabSlider: defaultTabSliderConfig
+          [key$8]: defaultConfig$8
         }
       }
     };
   }
 );
-const defaultTabsConfig = {
+const key$7 = "tabs";
+const defaultConfig$7 = {
   inner: {
     font: "sans",
     space: "6"
@@ -8480,6 +9052,7 @@ const defaultTabsConfig = {
     }
   }
 };
 const tabs = plugin.withOptions(
   function(options) {
     let { prefix } = defu(options, defaultPluginOptions);
@@ -8487,7 +9060,7 @@ const tabs = plugin.withOptions(
       prefix = `${prefix}-`;
     }
     return function({ addComponents, theme }) {
-      const config = theme("shurikenUi.tabs");
+      const config = theme(`shurikenUi.${key$7}`);
       addComponents({
         [`.${prefix}tabs`]: {
           [`@apply relative`]: {},
@@ -8542,14 +9115,15 @@ const tabs = plugin.withOptions(
     return {
       theme: {
         shurikenUi: {
-          tabs: defaultTabsConfig
+          [key$7]: defaultConfig$7
         }
       }
     };
   }
 );
-const defaultTagConfig = {
+const key$6 = "tag";
+const defaultConfig$6 = {
   space: "3",
   font: "sans",
   duration: "300",
@@ -8711,6 +9285,7 @@ const defaultTagConfig = {
     }
   }
 };
 const tag = plugin.withOptions(
   function(options) {
     let { prefix } = defu(options, defaultPluginOptions);
@@ -8718,7 +9293,7 @@ const tag = plugin.withOptions(
       prefix = `${prefix}-`;
     }
     return function({ addComponents, theme }) {
-      const config = theme("shurikenUi.tag");
+      const config = theme(`shurikenUi.${key$6}`);
       addComponents({
         [`.${prefix}tag`]: {
           [`@apply inline-block px-${config.space} font-${config.font} transition-shadow duration-${config.duration}`]: {},
@@ -8847,14 +9422,15 @@ const tag = plugin.withOptions(
     return {
       theme: {
         shurikenUi: {
-          tag: defaultTagConfig
+          [key$6]: defaultConfig$6
         }
       }
     };
   }
 );
-const defaultTextConfig = {
+const key$5 = "text";
+const defaultConfig$5 = {
   textXS: "xs",
   textSM: "sm",
   textMD: "base",
@@ -8880,6 +9456,7 @@ const defaultTextConfig = {
   textLeadSnug: "snug",
   textLeadLoose: "loose"
 };
 const text$1 = plugin.withOptions(
   function(options) {
     let { prefix } = defu(options, defaultPluginOptions);
@@ -8887,7 +9464,7 @@ const text$1 = plugin.withOptions(
       prefix = `${prefix}-`;
     }
     return function({ addComponents, theme }) {
-      const config = theme("shurikenUi.text");
+      const config = theme(`shurikenUi.${key$5}`);
       addComponents({
         [`.${prefix}text`]: {
           [`@apply font-sans`]: {},
@@ -8971,14 +9548,15 @@ const text$1 = plugin.withOptions(
     return {
       theme: {
         shurikenUi: {
-          text: defaultTextConfig
+          [key$5]: defaultConfig$5
         }
       }
     };
   }
 );
-const defaultTextareaConfig = {
+const key$4 = "textarea";
+const defaultConfig$4 = {
   labelFloat: {
     text: "primary-500",
     size: "5",
@@ -9095,6 +9673,7 @@ const defaultTextareaConfig = {
     }
   }
 };
 const textarea = plugin.withOptions(
   function(options) {
     let { prefix } = defu(options, defaultPluginOptions);
@@ -9102,9 +9681,7 @@ const textarea = plugin.withOptions(
       prefix = `${prefix}-`;
     }
     return function({ addComponents, theme }) {
-      const config = theme(
-        "shurikenUi.textarea"
-      );
+      const config = theme(`shurikenUi.${key$4}`);
       addComponents({
         [`.${prefix}textarea-wrapper`]: {
           [`@apply relative`]: {},
@@ -9294,14 +9871,15 @@ const textarea = plugin.withOptions(
     return {
       theme: {
         shurikenUi: {
-          textarea: defaultTextareaConfig
+          [key$4]: defaultConfig$4
         }
       }
     };
   }
 );
-const defaultThemeSwitchConfig = {
+const key$3 = "themeSwitch";
+const defaultConfig$3 = {
   bg: "muted-200",
   bgDark: "muted-700",
   rounded: "full",
@@ -9328,6 +9906,7 @@ const defaultThemeSwitchConfig = {
     duration: "300"
   }
 };
 const themeSwitch = plugin.withOptions(
   function(options) {
     let { prefix } = defu(options, defaultPluginOptions);
@@ -9335,9 +9914,7 @@ const themeSwitch = plugin.withOptions(
       prefix = `${prefix}-`;
     }
     return function({ addComponents, theme }) {
-      const config = theme(
-        "shurikenUi.themeSwitch"
-      );
+      const config = theme(`shurikenUi.${key$3}`);
       addComponents({
         [`.${prefix}theme-switch`]: {
           [`@apply bg-${config.bg} dark:bg-${config.bgDark} relative block h-6 w-14 scale-[0.8] rounded-${config.rounded}`]: {},
@@ -9376,14 +9953,15 @@ const themeSwitch = plugin.withOptions(
     return {
       theme: {
         shurikenUi: {
-          themeSwitch: defaultThemeSwitchConfig
+          [key$3]: defaultConfig$3
         }
       }
     };
   }
 );
-const defaultThemeToggleConfig = {
+const key$2 = "themeToggle";
+const defaultConfig$2 = {
   size: "9",
   rounded: "full",
   duration: "300",
@@ -9426,6 +10004,7 @@ const defaultThemeToggleConfig = {
     }
   }
 };
 const themeToggle = plugin.withOptions(
   function(options) {
     let { prefix } = defu(options, defaultPluginOptions);
@@ -9433,9 +10012,7 @@ const themeToggle = plugin.withOptions(
       prefix = `${prefix}-`;
     }
     return function({ addComponents, theme }) {
-      const config = theme(
-        "shurikenUi.themeToggle"
-      );
+      const config = theme(`shurikenUi.${key$2}`);
       addComponents({
         [`.${prefix}theme-toggle`]: {
           [`@apply ${prefix}focus relative block h-${config.size} w-${config.size} shrink-0 overflow-hidden rounded-${config.rounded} transition-all duration-${config.duration} focus-visible:outline-2 dark:ring-offset-${config.ringDark}`]: {},
@@ -9483,14 +10060,15 @@ const themeToggle = plugin.withOptions(
     return {
       theme: {
         shurikenUi: {
-          themeToggle: defaultThemeToggleConfig
+          [key$2]: defaultConfig$2
         }
       }
     };
   }
 );
-const defaultToastConfig = {
+const key$1 = "toast";
+const defaultConfig$1 = {
   font: "sans",
   title: {
     heading: "sm",
@@ -9590,6 +10168,7 @@ const defaultToastConfig = {
     shadowSize: "xl"
   }
 };
 const toast = plugin.withOptions(
   function(options) {
     let { prefix } = defu(options, defaultPluginOptions);
@@ -9597,9 +10176,7 @@ const toast = plugin.withOptions(
       prefix = `${prefix}-`;
     }
     return function({ addComponents, theme }) {
-      const config = theme(
-        "shurikenUi.toast"
-      );
+      const config = theme(`shurikenUi.${key$1}`);
       addComponents({
         [`.${prefix}toast`]: {
           [`@apply relative flex font-${config.font} overflow-hidden`]: {},
@@ -9710,14 +10287,15 @@ const toast = plugin.withOptions(
     return {
       theme: {
         shurikenUi: {
-          toast: defaultToastConfig
+          [key$1]: defaultConfig$1
         }
       }
     };
   }
 );
-const defaultTooltipConfig = {
+const key = "tooltip";
+const defaultConfig = {
   font: "sans",
   bg: "[#1e293b]",
   bgDark: "[#ec4899]",
@@ -9726,6 +10304,7 @@ const defaultTooltipConfig = {
   minWidth: "3rem",
   maxWidth: "21rem"
 };
 const tooltip = plugin.withOptions(
   function(options) {
     let { prefix } = defu(options, defaultPluginOptions);
@@ -9733,9 +10312,7 @@ const tooltip = plugin.withOptions(
       prefix = `${prefix}-`;
     }
     return function({ addComponents, theme }) {
-      const config = theme(
-        "shurikenUi.tooltip"
-      );
+      const config = theme(`shurikenUi.${key}`);
       const tooltip = `data-${prefix}tooltip`;
       const position = `data-${prefix}tooltip-position`;
       addComponents({
@@ -9897,6 +10474,9 @@ const tooltip = plugin.withOptions(
     }
     return {
       theme: {
+        shurikenUi: {
+          [key]: defaultConfig
+        },
         extend: {
           keyframes: {
             [`${prefix}tooltip-x`]: {
@@ -9916,9 +10496,6 @@ const tooltip = plugin.withOptions(
             [`${prefix}tooltip-x`]: `${prefix}tooltip-x 300ms ease-out forwards`,
             [`${prefix}tooltip-y`]: `${prefix}tooltip-y 300ms ease-out forwards`
           }
-        },
-        shurikenUi: {
-          tooltip: defaultTooltipConfig
         }
       }
     };
@@ -9948,6 +10525,7 @@ const components = [
   inputFileRegular,
   inputFile,
   input,
+  inputNumber,
   label,
   link,
   list,