@nextui-org/theme 2.1.8 → 2.1.10

package/dist/{chunk-EUS2SEYI.mjs → chunk-JX6O4KJS.mjs}

@@ -1,6 +1,6 @@
 import {
   tv
-} from "./chunk-6AEINX52.mjs";
+} from "./chunk-WBUVHAJX.mjs";
 
 // src/components/skeleton.ts
 var skeleton = tv({
@@ -28,7 +28,7 @@ var skeleton = tv({
       "after:-z-10",
       "after:bg-content3",
       "dark:after:bg-content2",
-      "data-[loaded=true]:bg-transparent",
+      "data-[loaded=true]:!bg-transparent",
       "data-[loaded=true]:before:opacity-0 data-[loaded=true]:before:animate-none",
       "data-[loaded=true]:after:opacity-0"
     ],

package/dist/{chunk-YSXRNNDV.mjs → chunk-N7N2LONM.mjs}

@@ -1,6 +1,6 @@
 import {
   tv
-} from "./chunk-6AEINX52.mjs";
+} from "./chunk-WBUVHAJX.mjs";
 
 // src/components/divider.ts
 var divider = tv({

package/dist/{chunk-RHIZZ5XX.mjs → chunk-ODGTGSNM.mjs}

@@ -3,10 +3,10 @@ import {
 } from "./chunk-2PIR7DFM.mjs";
 import {
   tv
-} from "./chunk-6AEINX52.mjs";
+} from "./chunk-WBUVHAJX.mjs";
 import {
   dataFocusVisibleClasses
-} from "./chunk-T7JNS25F.mjs";
+} from "./chunk-XHQUSKIE.mjs";
 
 // src/components/tabs.ts
 var tabs = tv({

package/dist/{chunk-EC4F6RJF.mjs → chunk-PFGLTKGJ.mjs}

@@ -1,6 +1,6 @@
 import {
   tv
-} from "./chunk-6AEINX52.mjs";
+} from "./chunk-WBUVHAJX.mjs";
 
 // src/components/spacer.ts
 var spacer = tv({

package/dist/{chunk-FZZINZOQ.mjs → chunk-QF56VSRK.mjs}

@@ -3,10 +3,10 @@ import {
 } from "./chunk-2PIR7DFM.mjs";
 import {
   tv
-} from "./chunk-6AEINX52.mjs";
+} from "./chunk-WBUVHAJX.mjs";
 import {
   dataFocusVisibleClasses
-} from "./chunk-T7JNS25F.mjs";
+} from "./chunk-XHQUSKIE.mjs";
 
 // src/components/pagination.ts
 var pagination = tv({
@@ -35,6 +35,7 @@ var pagination = tv({
       "left-0",
       "select-none",
       "touch-none",
+      "pointer-events-none",
       "z-20"
     ],
     forwardIcon: "hidden group-hover:block group-data-[focus-visible=true]:block data-[before=true]:rotate-180",
@@ -124,7 +125,12 @@ var pagination = tv({
       },
       false: {
         item: ["data-[pressed=true]:scale-[0.97]", "transition-transform-background"],
-        cursor: ["transition-transform", "!duration-300"]
+        cursor: [
+          "data-[moving=true]:transition-transform",
+          "!data-[moving=true]:duration-300",
+          "opacity-0",
+          "data-[moving]:opacity-100"
+        ]
       }
     }
   },
@@ -329,17 +335,28 @@ var pagination = tv({
     {
       slots: ["item", "prev", "next"],
       variant: "flat",
-      class: ["bg-default-100", "data-[hover=true]:bg-default-200", "active:bg-default-300"]
+      class: [
+        "bg-default-100",
+        "[&[data-hover=true]:not([data-active=true])]:bg-default-200",
+        "active:bg-default-300"
+      ]
     },
     {
       slots: ["item", "prev", "next"],
       variant: "faded",
-      class: ["bg-default-50", "data-[hover=true]:bg-default-100", "active:bg-default-200"]
+      class: [
+        "bg-default-50",
+        "[&[data-hover=true]:not([data-active=true])]:bg-default-100",
+        "active:bg-default-200"
+      ]
     },
     {
       slots: ["item", "prev", "next"],
       variant: "light",
-      class: ["data-[hover=true]:bg-default-100", "active:bg-default-200"]
+      class: [
+        "[&[data-hover=true]:not([data-active=true])]:bg-default-100",
+        "active:bg-default-200"
+      ]
     },
     {
       slots: ["item", "cursor", "prev", "next"],

package/dist/{chunk-YKWIBFFV.mjs → chunk-QWYWYOG6.mjs}

@@ -1,13 +1,25 @@
 import {
   tv
-} from "./chunk-6AEINX52.mjs";
+} from "./chunk-WBUVHAJX.mjs";
 import {
   dataFocusVisibleClasses
-} from "./chunk-T7JNS25F.mjs";
+} from "./chunk-XHQUSKIE.mjs";
 
 // src/components/menu.ts
 var menu = tv({
-  base: "w-full flex flex-col gap-0.5 p-1 outline-none"
+  slots: {
+    base: "w-full relative flex flex-col gap-1 p-1",
+    list: "w-full flex flex-col gap-0.5 outline-none",
+    emptyContent: [
+      "h-10",
+      "px-2",
+      "py-1.5",
+      "w-full",
+      "h-full",
+      "text-foreground-400",
+      "text-start"
+    ]
+  }
 });
 var menuItem = tv({
   slots: {
@@ -101,7 +113,9 @@ var menuItem = tv({
     },
     disableAnimation: {
       true: {},
-      false: {}
+      false: {
+        base: "data-[hover=true]:transition-colors"
+      }
     }
   },
   defaultVariants: {

package/dist/{chunk-Y32IWEMZ.mjs → chunk-S7W5DQP2.mjs}

@@ -1,12 +1,12 @@
-import {
-  transition_default
-} from "./chunk-KPK2JQIF.mjs";
 import {
   custom_default
 } from "./chunk-DI2L75XK.mjs";
 import {
   scrollbar_hide_default
 } from "./chunk-4Z22WXZX.mjs";
+import {
+  transition_default
+} from "./chunk-G3PB7L4N.mjs";
 
 // src/utilities/index.ts
 var utilities = {

package/dist/{chunk-F76574GG.mjs → chunk-SCQJ4BM3.mjs}

@@ -1,24 +1,33 @@
 import {
   tv
-} from "./chunk-6AEINX52.mjs";
+} from "./chunk-WBUVHAJX.mjs";
 import {
   dataFocusVisibleClasses
-} from "./chunk-T7JNS25F.mjs";
+} from "./chunk-XHQUSKIE.mjs";
 
 // src/components/select.ts
 var select = tv({
   slots: {
     base: "group inline-flex flex-col relative w-full",
-    label: "block text-small font-medium text-foreground-500 pointer-events-none",
+    label: [
+      "block",
+      "absolute",
+      "z-10",
+      "origin-top-left",
+      "subpixel-antialiased",
+      "text-small",
+      "text-foreground-500",
+      "pointer-events-none"
+    ],
     mainWrapper: "w-full flex flex-col",
     trigger: "relative px-3 gap-3 w-full inline-flex flex-row items-center shadow-sm outline-none tap-highlight-transparent",
     innerWrapper: "inline-flex h-full w-[calc(100%_-_theme(spacing.unit-6))] items-center gap-1.5 box-border",
     selectorIcon: "absolute right-3 w-unit-4 h-unit-4",
     spinner: "absolute right-3",
-    value: "font-normal w-full text-left opacity-60 group-data-[filled=true]:opacity-100",
+    value: ["font-normal", "w-full", "text-left"],
     listboxWrapper: "scroll-py-6 max-h-64 w-full",
     listbox: "",
-    popover: "w-full p-1 overflow-hidden",
+    popoverContent: "w-full p-1 overflow-hidden",
     helperWrapper: "flex relative flex-col gap-1.5 pt-1 px-1",
     description: "text-tiny text-foreground-400",
     errorMessage: "text-tiny text-danger"
@@ -76,7 +85,9 @@ var select = tv({
       }
     },
     color: {
-      default: {},
+      default: {
+        value: ["text-foreground-500", "group-data-[has-value=true]:text-foreground"]
+      },
       primary: {},
       secondary: {},
       success: {},
@@ -122,7 +133,7 @@ var select = tv({
       },
       "outside-left": {
         base: "flex-row items-center flex-nowrap items-start",
-        label: "text-foreground pr-2"
+        label: "relative text-foreground pr-2"
       },
       inside: {
         label: "text-tiny cursor-pointer",
@@ -134,11 +145,6 @@ var select = tv({
         base: "w-full"
       }
     },
-    isLabelPlaceholder: {
-      true: {
-        label: "absolute z-10"
-      }
-    },
     isDisabled: {
       true: {
         base: "opacity-disabled pointer-events-none",
@@ -148,7 +154,7 @@ var select = tv({
     isInvalid: {
       true: {
         label: "!text-danger",
-        value: "text-danger",
+        value: "!text-danger",
         selectorIcon: "text-danger"
       }
     },
@@ -177,9 +183,9 @@ var select = tv({
         label: [
           "will-change-auto",
           "origin-top-left",
-          "transition-all",
           "!duration-200",
           "!ease-out",
+          "transition-[transform,color,left,opacity]",
           "motion-reduce:transition-none"
         ],
         selectorIcon: "transition-transform duration-150 ease motion-reduce:transition-none"
@@ -440,6 +446,13 @@ var select = tv({
         ]
       }
     },
+    {
+      labelPlacement: "inside",
+      color: "default",
+      class: {
+        label: "group-data-[filled=true]:text-foreground-600"
+      }
+    },
     {
       isInvalid: true,
       variant: "flat",
@@ -488,18 +501,12 @@ var select = tv({
       }
     },
     {
-      isLabelPlaceholder: true,
       labelPlacement: ["inside", "outside"],
       class: {
-        label: [
-          "font-normal",
-          "group-data-[filled=true]:font-medium",
-          "group-data-[filled=true]:pointer-events-auto"
-        ]
+        label: ["group-data-[filled=true]:pointer-events-auto"]
       }
     },
     {
-      isLabelPlaceholder: true,
       labelPlacement: "outside",
       class: {
         base: "group relative justify-end",
@@ -515,62 +522,121 @@ var select = tv({
       }
     },
     {
-      isLabelPlaceholder: true,
+      labelPlacement: ["inside"],
+      class: {
+        label: "group-data-[filled=true]:scale-85"
+      }
+    },
+    {
       labelPlacement: "inside",
       size: ["sm", "md"],
       class: {
-        label: ["text-small", "group-data-[filled=true]:text-tiny"],
+        label: "text-small",
         input: "pt-4"
       }
     },
     {
-      isLabelPlaceholder: true,
       labelPlacement: "inside",
       size: "sm",
       class: {
-        label: ["group-data-[filled=true]:-translate-y-[calc(50%_+_theme(fontSize.tiny)/2_-_3px)]"],
+        label: ["group-data-[filled=true]:-translate-y-[calc(50%_+_theme(fontSize.tiny)/2_-_8px)]"],
         innerWrapper: "pt-4"
       }
     },
     {
-      isLabelPlaceholder: true,
       labelPlacement: "inside",
       size: "md",
       class: {
         label: [
-          "group-data-[filled=true]:-translate-y-[calc(50%_+_theme(fontSize.small)/2_-_4px)]"
+          "group-data-[filled=true]:-translate-y-[calc(50%_+_theme(fontSize.small)/2_-_6px)]"
         ],
         innerWrapper: "pt-4"
       }
     },
     {
-      isLabelPlaceholder: true,
       labelPlacement: "inside",
       size: "lg",
       class: {
         label: [
           "text-medium",
-          "group-data-[filled=true]:text-small",
-          "group-data-[filled=true]:-translate-y-[calc(50%_+_theme(fontSize.small)/2_-_5px)]"
+          "group-data-[filled=true]:-translate-y-[calc(50%_+_theme(fontSize.small)/2_-_8px)]"
         ],
         innerWrapper: "pt-5"
       }
     },
     {
-      isLabelPlaceholder: true,
+      labelPlacement: "inside",
+      variant: ["faded", "bordered"],
+      size: "sm",
+      class: {
+        label: [
+          "group-data-[filled=true]:-translate-y-[calc(50%_+_theme(fontSize.tiny)/2_-_8px_-_theme(borderWidth.medium))]"
+        ]
+      }
+    },
+    {
+      labelPlacement: "inside",
+      variant: ["faded", "bordered"],
+      size: "md",
+      class: {
+        label: [
+          "group-data-[filled=true]:-translate-y-[calc(50%_+_theme(fontSize.small)/2_-_6px_-_theme(borderWidth.medium))]"
+        ]
+      }
+    },
+    {
+      labelPlacement: "inside",
+      variant: ["faded", "bordered"],
+      size: "lg",
+      class: {
+        label: [
+          "text-medium",
+          "group-data-[filled=true]:-translate-y-[calc(50%_+_theme(fontSize.small)/2_-_8px_-_theme(borderWidth.medium))]"
+        ]
+      }
+    },
+    {
+      labelPlacement: "inside",
+      variant: "underlined",
+      size: "sm",
+      class: {
+        label: ["group-data-[filled=true]:-translate-y-[calc(50%_+_theme(fontSize.tiny)/2_-_5px)]"]
+      }
+    },
+    {
+      labelPlacement: "inside",
+      variant: "underlined",
+      size: "md",
+      class: {
+        label: [
+          "group-data-[filled=true]:-translate-y-[calc(50%_+_theme(fontSize.small)/2_-_3.5px)]"
+        ]
+      }
+    },
+    {
+      labelPlacement: "inside",
+      variant: "underlined",
+      size: "lg",
+      class: {
+        label: [
+          "text-medium",
+          "group-data-[filled=true]:-translate-y-[calc(50%_+_theme(fontSize.small)/2_-_4px)]"
+        ]
+      }
+    },
+    {
       labelPlacement: "outside",
       size: "sm",
       class: {
         label: [
           "left-2",
-          "text-small",
-          "group-data-[filled=true]:text-tiny",
+          "text-tiny",
           "group-data-[filled=true]:-translate-y-[calc(100%_+_theme(fontSize.tiny)/2_+_16px)]"
-        ]
+        ],
+        base: "data-[has-label=true]:mt-[calc(theme(fontSize.small)_+_8px)]"
       }
     },
     {
-      isLabelPlaceholder: true,
       labelPlacement: "outside",
       size: "md",
       class: {
@@ -578,20 +644,20 @@ var select = tv({
           "left-3",
           "text-small",
           "group-data-[filled=true]:-translate-y-[calc(100%_+_theme(fontSize.small)/2_+_20px)]"
-        ]
+        ],
+        base: "data-[has-label=true]:mt-[calc(theme(fontSize.small)_+_10px)]"
       }
     },
     {
-      isLabelPlaceholder: true,
       labelPlacement: "outside",
       size: "lg",
       class: {
         label: [
           "left-3",
           "text-medium",
-          "group-data-[filled=true]:text-small",
           "group-data-[filled=true]:-translate-y-[calc(100%_+_theme(fontSize.small)/2_+_24px)]"
-        ]
+        ],
+        base: "data-[has-label=true]:mt-[calc(theme(fontSize.small)_+_12px)]"
       }
     }
   ]

package/dist/{chunk-TIMHSW45.mjs → chunk-TUUOVVH3.mjs}

@@ -1,9 +1,9 @@
 import {
   tv
-} from "./chunk-6AEINX52.mjs";
+} from "./chunk-WBUVHAJX.mjs";
 import {
   groupDataFocusVisibleClasses
-} from "./chunk-T7JNS25F.mjs";
+} from "./chunk-XHQUSKIE.mjs";
 
 // src/components/toggle.ts
 var toggle = tv({

package/dist/{chunk-B55QBA5E.mjs → chunk-VD4MGTVP.mjs}

@@ -3,7 +3,7 @@ import {
 } from "./chunk-2PIR7DFM.mjs";
 import {
   tv
-} from "./chunk-6AEINX52.mjs";
+} from "./chunk-WBUVHAJX.mjs";
 
 // src/components/snippet.ts
 var snippet = tv({

package/dist/{chunk-4JBYJQSP.mjs → chunk-VGHVBXXT.mjs}

@@ -1,6 +1,6 @@
 import {
   tv
-} from "./chunk-6AEINX52.mjs";
+} from "./chunk-WBUVHAJX.mjs";
 
 // src/components/scroll-shadow.ts
 var verticalShadow = [

package/dist/{chunk-WM43BKYH.mjs → chunk-VOTIIGIW.mjs}

@@ -3,10 +3,10 @@ import {
 } from "./chunk-2PIR7DFM.mjs";
 import {
   tv
-} from "./chunk-6AEINX52.mjs";
+} from "./chunk-WBUVHAJX.mjs";
 import {
   ringClasses
-} from "./chunk-T7JNS25F.mjs";
+} from "./chunk-XHQUSKIE.mjs";
 
 // src/components/chip.ts
 var chip = tv({
@@ -76,7 +76,7 @@ var chip = tv({
     },
     size: {
       sm: {
-        base: "px-1 h-6 text-small",
+        base: "px-1 h-6 text-tiny",
         content: "px-1",
         closeButton: "text-medium",
         avatar: "w-4 h-4"

package/dist/{chunk-O24TFHPZ.mjs → chunk-VPYXYIZ5.mjs}

@@ -1,9 +1,9 @@
 import {
   tv
-} from "./chunk-6AEINX52.mjs";
+} from "./chunk-WBUVHAJX.mjs";
 import {
   dataFocusVisibleClasses
-} from "./chunk-T7JNS25F.mjs";
+} from "./chunk-XHQUSKIE.mjs";
 
 // src/components/user.ts
 var user = tv({

package/dist/{chunk-ADNJ6GPZ.mjs → chunk-VU5TSYMO.mjs}

@@ -1,9 +1,9 @@
 import {
   tv
-} from "./chunk-6AEINX52.mjs";
+} from "./chunk-WBUVHAJX.mjs";
 import {
   dataFocusVisibleClasses
-} from "./chunk-T7JNS25F.mjs";
+} from "./chunk-XHQUSKIE.mjs";
 
 // src/components/table.ts
 var table = tv({

package/dist/{chunk-7MCHEQXT.mjs → chunk-VZI6SR6H.mjs}

@@ -31,8 +31,11 @@ var defaultLayout = {
     large: "0px 0px 30px 0px rgb(0 0 0 / 0.04), 0px 30px 60px 0px rgb(0 0 0 / 0.12), 0px 0px 1px 0px rgb(0 0 0 / 0.3)"
   }
 };
-var lightLayout = {};
+var lightLayout = {
+  hoverOpacity: ".8"
+};
 var darkLayout = {
+  hoverOpacity: ".9",
   boxShadow: {
     small: "0px 0px 5px 0px rgb(0 0 0 / 0.05), 0px 2px 10px 0px rgb(0 0 0 / 0.2), inset 0px 0px 1px 0px rgb(255 255 255 / 0.15)",
     medium: "0px 0px 15px 0px rgb(0 0 0 / 0.06), 0px 2px 30px 0px rgb(0 0 0 / 0.22), inset 0px 0px 1px 0px rgb(255 255 255 / 0.15)",

package/dist/chunk-WBUVHAJX.mjs

@@ -0,0 +1,37 @@
+import {
+  mappedSpacingScaleKeys
+} from "./chunk-WA5F6AED.mjs";
+
+// src/utils/tv.ts
+import { createTV } from "tailwind-variants";
+var COMMON_UNITS = ["small", "medium", "large"];
+var tv = createTV({
+  twMerge: true,
+  twMergeConfig: {
+    theme: {
+      opacity: ["disabled"],
+      spacing: ["divider", "unit", ...mappedSpacingScaleKeys],
+      borderWidth: COMMON_UNITS,
+      borderRadius: COMMON_UNITS
+    },
+    classGroups: {
+      shadow: [{ shadow: COMMON_UNITS }],
+      "font-size": [{ text: ["tiny", ...COMMON_UNITS] }],
+      "bg-image": ["bg-stripe-gradient"],
+      "min-w": [
+        {
+          "min-w": ["unit", ...mappedSpacingScaleKeys]
+        }
+      ],
+      "min-h": [
+        {
+          "min-h": ["unit", ...mappedSpacingScaleKeys]
+        }
+      ]
+    }
+  }
+});
+
+export {
+  tv
+};

package/dist/chunk-WHT6K6RC.mjs

@@ -0,0 +1,58 @@
+import {
+  tv
+} from "./chunk-WBUVHAJX.mjs";
+
+// src/components/autocomplete.ts
+var autocomplete = tv({
+  slots: {
+    base: "group inline-flex flex-column w-full",
+    listboxWrapper: "scroll-py-6 max-h-64 w-full",
+    listbox: "",
+    popoverContent: "w-full p-1 overflow-hidden",
+    endContentWrapper: "relative flex h-full items-center -mr-2",
+    clearButton: [
+      "text-medium",
+      "translate-x-1",
+      "cursor-text",
+      "opacity-0",
+      "text-default-500",
+      "group-data-[invalid=true]:text-danger",
+      "data-[visible=true]:opacity-100",
+      "data-[visible=true]:cursor-pointer",
+      "sm:data-[visible=true]:opacity-0",
+      "sm:group-data-[hover=true]:data-[visible=true]:opacity-100"
+    ],
+    selectorButton: "text-medium"
+  },
+  variants: {
+    disableClearable: {
+      true: {
+        clearButton: "hidden"
+      },
+      false: {}
+    },
+    disableAnimation: {
+      true: {
+        selectorButton: "transition-none"
+      },
+      false: {
+        selectorButton: "transition-transform duration-150 ease motion-reduce:transition-none"
+      }
+    },
+    disableSelectorIconRotation: {
+      true: {},
+      false: {
+        selectorButton: "data-[open=true]:rotate-180"
+      }
+    }
+  },
+  defaultVariants: {
+    disableAnimation: false,
+    disableClearable: false,
+    disableSelectorIconRotation: false
+  }
+});
+
+export {
+  autocomplete
+};