@nextui-org/theme 2.1.12 → 2.1.13

package/dist/components/index.mjs

@@ -44,7 +44,7 @@ import {
 } from "../chunk-VGHVBXXT.mjs";
 import {
   select
-} from "../chunk-TLWI2J7W.mjs";
+} from "../chunk-DNEFEC5I.mjs";
 import {
   skeleton
 } from "../chunk-JX6O4KJS.mjs";
@@ -53,7 +53,7 @@ import {
 } from "../chunk-F36W5Y6O.mjs";
 import {
   input
-} from "../chunk-RNXUUR27.mjs";
+} from "../chunk-D4RGWEG7.mjs";
 import {
   kbd
 } from "../chunk-J7FVLFSZ.mjs";

package/dist/components/input.d.ts

@@ -24,20 +24,30 @@ declare const input: tailwind_variants.TVReturnType<{
     variant: {
         flat: {
             inputWrapper: string[];
+            input: string;
+            label: string;
         };
         faded: {
             inputWrapper: string[];
+            input: string;
+            label: string;
         };
         bordered: {
             inputWrapper: string[];
+            input: string;
+            label: string;
         };
         underlined: {
             inputWrapper: string[];
             innerWrapper: string;
+            input: string;
+            label: string;
         };
     };
     color: {
-        default: {};
+        default: {
+            label: string;
+        };
         primary: {};
         secondary: {};
         success: {};
@@ -145,7 +155,7 @@ declare const input: tailwind_variants.TVReturnType<{
         };
     };
 }, {
-    base: string[];
+    base: string;
     label: string[];
     mainWrapper: string;
     inputWrapper: string;
@@ -159,20 +169,30 @@ declare const input: tailwind_variants.TVReturnType<{
     variant: {
         flat: {
             inputWrapper: string[];
+            input: string;
+            label: string;
         };
         faded: {
             inputWrapper: string[];
+            input: string;
+            label: string;
         };
         bordered: {
             inputWrapper: string[];
+            input: string;
+            label: string;
         };
         underlined: {
             inputWrapper: string[];
             innerWrapper: string;
+            input: string;
+            label: string;
         };
     };
     color: {
-        default: {};
+        default: {
+            label: string;
+        };
         primary: {};
         secondary: {};
         success: {};
@@ -283,20 +303,30 @@ declare const input: tailwind_variants.TVReturnType<{
     variant: {
         flat: {
             inputWrapper: string[];
+            input: string;
+            label: string;
         };
         faded: {
             inputWrapper: string[];
+            input: string;
+            label: string;
         };
         bordered: {
             inputWrapper: string[];
+            input: string;
+            label: string;
         };
         underlined: {
             inputWrapper: string[];
             innerWrapper: string;
+            input: string;
+            label: string;
         };
     };
     color: {
-        default: {};
+        default: {
+            label: string;
+        };
         primary: {};
         secondary: {};
         success: {};
@@ -407,20 +437,30 @@ declare const input: tailwind_variants.TVReturnType<{
     variant: {
         flat: {
             inputWrapper: string[];
+            input: string;
+            label: string;
         };
         faded: {
             inputWrapper: string[];
+            input: string;
+            label: string;
         };
         bordered: {
             inputWrapper: string[];
+            input: string;
+            label: string;
         };
         underlined: {
             inputWrapper: string[];
             innerWrapper: string;
+            input: string;
+            label: string;
         };
     };
     color: {
-        default: {};
+        default: {
+            label: string;
+        };
         primary: {};
         secondary: {};
         success: {};
@@ -528,7 +568,7 @@ declare const input: tailwind_variants.TVReturnType<{
         };
     };
 }, {
-    base: string[];
+    base: string;
     label: string[];
     mainWrapper: string;
     inputWrapper: string;
@@ -542,20 +582,30 @@ declare const input: tailwind_variants.TVReturnType<{
     variant: {
         flat: {
             inputWrapper: string[];
+            input: string;
+            label: string;
         };
         faded: {
             inputWrapper: string[];
+            input: string;
+            label: string;
         };
         bordered: {
             inputWrapper: string[];
+            input: string;
+            label: string;
         };
         underlined: {
             inputWrapper: string[];
             innerWrapper: string;
+            input: string;
+            label: string;
         };
     };
     color: {
-        default: {};
+        default: {
+            label: string;
+        };
         primary: {};
         secondary: {};
         success: {};
@@ -663,7 +713,7 @@ declare const input: tailwind_variants.TVReturnType<{
         };
     };
 }, {
-    base: string[];
+    base: string;
     label: string[];
     mainWrapper: string;
     inputWrapper: string;
@@ -677,20 +727,30 @@ declare const input: tailwind_variants.TVReturnType<{
     variant: {
         flat: {
             inputWrapper: string[];
+            input: string;
+            label: string;
         };
         faded: {
             inputWrapper: string[];
+            input: string;
+            label: string;
         };
         bordered: {
             inputWrapper: string[];
+            input: string;
+            label: string;
         };
         underlined: {
             inputWrapper: string[];
             innerWrapper: string;
+            input: string;
+            label: string;
         };
     };
     color: {
-        default: {};
+        default: {
+            label: string;
+        };
         primary: {};
         secondary: {};
         success: {};
@@ -801,20 +861,30 @@ declare const input: tailwind_variants.TVReturnType<{
     variant: {
         flat: {
             inputWrapper: string[];
+            input: string;
+            label: string;
         };
         faded: {
             inputWrapper: string[];
+            input: string;
+            label: string;
         };
         bordered: {
             inputWrapper: string[];
+            input: string;
+            label: string;
         };
         underlined: {
             inputWrapper: string[];
             innerWrapper: string;
+            input: string;
+            label: string;
         };
     };
     color: {
-        default: {};
+        default: {
+            label: string;
+        };
         primary: {};
         secondary: {};
         success: {};

package/dist/components/input.js

@@ -129,7 +129,7 @@ var groupDataFocusVisibleClasses = [
 // src/components/input.ts
 var input = tv({
   slots: {
-    base: ["group flex relative flex-col", "data-[has-helper=true]:mb-4"],
+    base: "group flex flex-col",
     label: [
       "absolute",
       "z-10",
@@ -138,15 +138,19 @@ var input = tv({
       "subpixel-antialiased",
       "block",
       "text-small",
-      "text-foreground-500"
+      "text-foreground-500",
+      "opacity-70",
+      "group-data-[filled-within=true]:opacity-100"
     ],
     mainWrapper: "h-full",
     inputWrapper: "relative w-full inline-flex tap-highlight-transparent flex-row items-center shadow-sm px-3 gap-3",
     innerWrapper: "inline-flex w-full items-center h-full box-border",
     input: [
+      "opacity-70",
       "w-full font-normal bg-transparent !outline-none placeholder:text-foreground-500 focus-visible:outline-none",
       "data-[has-start-content=true]:ps-1.5",
-      "data-[has-end-content=true]:pe-1.5"
+      "data-[has-end-content=true]:pe-1.5",
+      "group-data-[has-value=true]:opacity-100"
     ],
     clearButton: [
       "p-2",
@@ -165,7 +169,7 @@ var input = tv({
       "rounded-full",
       ...dataFocusVisibleClasses
     ],
-    helperWrapper: "flex absolute -bottom-[calc(theme(fontSize.tiny)*1.5)] flex-col gap-1.5 px-1",
+    helperWrapper: "p-1 flex relative flex-col gap-1.5",
     description: "text-tiny text-foreground-400",
     errorMessage: "text-tiny text-danger"
   },
@@ -176,7 +180,9 @@ var input = tv({
           "bg-default-100",
           "data-[hover=true]:bg-default-200",
           "group-data-[focus=true]:bg-default-100"
-        ]
+        ],
+        input: "placeholder:text-default-foreground",
+        label: "text-default-foreground"
       },
       faded: {
         inputWrapper: [
@@ -184,15 +190,19 @@ var input = tv({
           "border-medium",
           "border-default-200",
           "data-[hover=true]:border-default-400"
-        ]
+        ],
+        input: "placeholder:text-default-foreground",
+        label: "text-default-foreground"
       },
       bordered: {
         inputWrapper: [
           "border-medium",
           "border-default-200",
           "data-[hover=true]:border-default-400",
-          "group-data-[focus=true]:border-foreground"
-        ]
+          "group-data-[focus=true]:border-default-foreground"
+        ],
+        input: "placeholder:text-foreground",
+        label: "text-foreground"
       },
       underlined: {
         inputWrapper: [
@@ -209,7 +219,7 @@ var input = tv({
           "after:content-['']",
           "after:w-0",
           "after:origin-center",
-          "after:bg-foreground",
+          "after:bg-default-foreground",
           "after:absolute",
           "after:left-1/2",
           "after:-translate-x-1/2",
@@ -217,11 +227,15 @@ var input = tv({
           "after:h-[2px]",
           "group-data-[focus=true]:after:w-full"
         ],
-        innerWrapper: "pb-1"
+        innerWrapper: "pb-1",
+        input: "placeholder:text-foreground",
+        label: "text-foreground"
       }
     },
     color: {
-      default: {},
+      default: {
+        label: "group-data-[filled-within=true]:opacity-80"
+      },
       primary: {},
       secondary: {},
       success: {},
@@ -590,13 +604,6 @@ var input = tv({
         ]
       }
     },
-    {
-      labelPlacement: "inside",
-      color: "default",
-      class: {
-        label: "group-data-[filled-within=true]:text-foreground-600"
-      }
-    },
     {
       isInvalid: true,
       variant: "flat",
@@ -672,11 +679,9 @@ var input = tv({
         label: [
           "pb-0",
           "z-20",
-          "opacity-60",
           "top-1/2",
           "-translate-y-1/2",
-          "group-data-[filled-within=true]:left-0",
-          "group-data-[filled-within=true]:opacity-100"
+          "group-data-[filled-within=true]:left-0"
         ]
       }
     },
@@ -689,7 +694,6 @@ var input = tv({
     {
       labelPlacement: ["inside"],
       variant: "flat",
-      size: ["md", "lg"],
       class: {
         innerWrapper: "pb-0.5"
       }
@@ -887,6 +891,12 @@ var input = tv({
       class: {
         input: "transition-height !duration-100 motion-reduce:transition-none"
       }
+    },
+    {
+      labelPlacement: ["inside", "outside"],
+      class: {
+        label: ["pe-2", "max-w-full", "text-ellipsis", "overflow-hidden"]
+      }
     }
   ]
 });

package/dist/components/input.mjs

@@ -1,6 +1,6 @@
 import {
   input
-} from "../chunk-RNXUUR27.mjs";
+} from "../chunk-D4RGWEG7.mjs";
 import "../chunk-CMYR6AOY.mjs";
 import "../chunk-K7LK7NCE.mjs";
 import "../chunk-2PIR7DFM.mjs";

package/dist/components/select.d.ts

@@ -6,20 +6,28 @@ declare const select: tailwind_variants.TVReturnType<{
     variant: {
         flat: {
             trigger: string[];
+            label: string;
+            value: string;
         };
         faded: {
             trigger: string[];
+            label: string;
+            value: string;
         };
         bordered: {
             trigger: string[];
+            label: string;
+            value: string;
         };
         underlined: {
             trigger: string[];
+            label: string;
+            value: string;
         };
     };
     color: {
         default: {
-            value: string[];
+            label: string;
         };
         primary: {};
         secondary: {};
@@ -143,20 +151,28 @@ declare const select: tailwind_variants.TVReturnType<{
     variant: {
         flat: {
             trigger: string[];
+            label: string;
+            value: string;
         };
         faded: {
             trigger: string[];
+            label: string;
+            value: string;
         };
         bordered: {
             trigger: string[];
+            label: string;
+            value: string;
         };
         underlined: {
             trigger: string[];
+            label: string;
+            value: string;
         };
     };
     color: {
         default: {
-            value: string[];
+            label: string;
         };
         primary: {};
         secondary: {};
@@ -265,20 +281,28 @@ declare const select: tailwind_variants.TVReturnType<{
     variant: {
         flat: {
             trigger: string[];
+            label: string;
+            value: string;
         };
         faded: {
             trigger: string[];
+            label: string;
+            value: string;
         };
         bordered: {
             trigger: string[];
+            label: string;
+            value: string;
         };
         underlined: {
             trigger: string[];
+            label: string;
+            value: string;
         };
     };
     color: {
         default: {
-            value: string[];
+            label: string;
         };
         primary: {};
         secondary: {};
@@ -387,20 +411,28 @@ declare const select: tailwind_variants.TVReturnType<{
     variant: {
         flat: {
             trigger: string[];
+            label: string;
+            value: string;
         };
         faded: {
             trigger: string[];
+            label: string;
+            value: string;
         };
         bordered: {
             trigger: string[];
+            label: string;
+            value: string;
         };
         underlined: {
             trigger: string[];
+            label: string;
+            value: string;
         };
     };
     color: {
         default: {
-            value: string[];
+            label: string;
         };
         primary: {};
         secondary: {};
@@ -524,20 +556,28 @@ declare const select: tailwind_variants.TVReturnType<{
     variant: {
         flat: {
             trigger: string[];
+            label: string;
+            value: string;
         };
         faded: {
             trigger: string[];
+            label: string;
+            value: string;
         };
         bordered: {
             trigger: string[];
+            label: string;
+            value: string;
         };
         underlined: {
             trigger: string[];
+            label: string;
+            value: string;
         };
     };
     color: {
         default: {
-            value: string[];
+            label: string;
         };
         primary: {};
         secondary: {};
@@ -661,20 +701,28 @@ declare const select: tailwind_variants.TVReturnType<{
     variant: {
         flat: {
             trigger: string[];
+            label: string;
+            value: string;
         };
         faded: {
             trigger: string[];
+            label: string;
+            value: string;
         };
         bordered: {
             trigger: string[];
+            label: string;
+            value: string;
         };
         underlined: {
             trigger: string[];
+            label: string;
+            value: string;
         };
     };
     color: {
         default: {
-            value: string[];
+            label: string;
         };
         primary: {};
         secondary: {};
@@ -783,20 +831,28 @@ declare const select: tailwind_variants.TVReturnType<{
     variant: {
         flat: {
             trigger: string[];
+            label: string;
+            value: string;
         };
         faded: {
             trigger: string[];
+            label: string;
+            value: string;
         };
         bordered: {
             trigger: string[];
+            label: string;
+            value: string;
         };
         underlined: {
             trigger: string[];
+            label: string;
+            value: string;
         };
     };
     color: {
         default: {
-            value: string[];
+            label: string;
         };
         primary: {};
         secondary: {};