@nextui-org/theme 0.0.0-dev-v2-20230416134122 → 0.0.0-dev-v2-20230420024722

package/dist/chunk-64MHH33S.mjs

@@ -0,0 +1,200 @@
+// src/components/navbar.ts
+import { tv } from "tailwind-variants";
+var navbar = tv({
+  slots: {
+    base: [
+      "relative",
+      "z-50",
+      "w-full",
+      "h-auto",
+      "flex",
+      "items-center",
+      "justify-center",
+      "border-b",
+      "border-neutral-100",
+      "shadow-md"
+    ],
+    wrapper: [
+      "flex",
+      "flex-row",
+      "flex-nowrap",
+      "items-center",
+      "justify-between",
+      "w-full",
+      "h-[var(--navbar-height)]",
+      "px-6"
+    ],
+    toggle: [
+      "group",
+      "flex",
+      "items-center",
+      "justify-center",
+      "w-6",
+      "h-10",
+      "outline-none",
+      "rounded-sm",
+      "data-[focus-visible=true]:outline-none",
+      "data-[focus-visible=true]:ring-2",
+      "data-[focus-visible=true]:ring-primary",
+      "data-[focus-visible=true]:ring-offset-2",
+      "data-[focus-visible=true]:ring-offset-background",
+      "data-[focus-visible=true]:dark:ring-offset-background-dark"
+    ],
+    srOnly: ["sr-only"],
+    toggleIcon: [
+      "w-full",
+      "h-full",
+      "pointer-events-none",
+      "flex",
+      "flex-col",
+      "items-center",
+      "justify-center",
+      "text-foreground",
+      "group-data-[pressed=true]:opacity-70",
+      "transition-opacity",
+      "before:content-['']",
+      "before:block",
+      "before:h-px",
+      "before:w-6",
+      "before:bg-current",
+      "before:transition-transform",
+      "before:duration-150",
+      "before:-translate-y-1",
+      "before:rotate-0",
+      "group-data-[open=true]:before:translate-y-px",
+      "group-data-[open=true]:before:rotate-45",
+      "after:content-['']",
+      "after:block",
+      "after:h-px",
+      "after:w-6",
+      "after:bg-current",
+      "after:transition-transform",
+      "after:duration-150",
+      "after:translate-y-1",
+      "after:rotate-0",
+      "group-data-[open=true]:after:translate-y-0",
+      "group-data-[open=true]:after:-rotate-45"
+    ],
+    brand: [
+      "flex",
+      "flex-row",
+      "flex-nowrap",
+      "justify-start",
+      "bg-transparent",
+      "items-center",
+      "no-underline",
+      "text-base",
+      "whitespace-nowrap",
+      "box-border"
+    ],
+    content: ["flex", "h-full", "flex-row", "flex-nowrap", "items-center", "gap-4"],
+    item: [
+      "text-base",
+      "whitespace-nowrap",
+      "box-border",
+      "data-[active=true]:font-semibold"
+    ],
+    menu: [
+      "z-50",
+      "hidden",
+      "px-6",
+      "pt-4",
+      "absolute",
+      "max-w-full",
+      "top-[calc(var(--navbar-height)_+_1px)]",
+      "h-[calc(100vh_-_var(--navbar-height)_-_1px)]",
+      "inset-x-0",
+      "bottom-0",
+      "w-screen",
+      "bg-background",
+      "data-[open=true]:flex",
+      "flex-col",
+      "gap-3",
+      "overflow-y-auto"
+    ],
+    menuItem: ["text-lg"]
+  },
+  variants: {
+    position: {
+      static: {
+        base: "static"
+      },
+      sticky: {},
+      floating: {
+        base: "shadow-none border-b-0",
+        wrapper: "mt-4 mx-8 shadow-md border border-neutral-100 rounded-xl",
+        menu: "mt-5 mx-8 border border-neutral-100 rounded-xl max-w-[calc(100%_-_4rem)]"
+      }
+    },
+    maxWidth: {
+      sm: {
+        wrapper: "max-w-[640px]"
+      },
+      md: {
+        wrapper: "max-w-[768px]"
+      },
+      lg: {
+        wrapper: "max-w-[1024px]"
+      },
+      xl: {
+        wrapper: "max-w-[1280px]"
+      },
+      "2xl": {
+        wrapper: "max-w-[1536px]"
+      },
+      full: {
+        wrapper: "max-w-full"
+      }
+    },
+    hideOnScroll: {
+      true: {
+        base: [
+          "sticky",
+          "top-0",
+          "inset-x-0"
+        ]
+      }
+    },
+    isBordered: {
+      true: {}
+    },
+    isBlurred: {
+      false: {
+        base: "bg-background"
+      },
+      true: {}
+    }
+  },
+  defaultVariants: {
+    maxWidth: "lg",
+    position: "sticky",
+    isBlurred: true
+  },
+  compoundVariants: [
+    {
+      position: ["sticky", "floating"],
+      class: {
+        base: "sticky top-0 inset-x-0"
+      }
+    },
+    {
+      isBlurred: true,
+      position: ["static", "sticky"],
+      class: {
+        base: "backdrop-blur-xl backdrop-saturate-200 bg-background/50 data-[menu-open=true]:bg-background"
+      }
+    },
+    {
+      isBlurred: true,
+      position: "floating",
+      class: {
+        base: "bg-gradient-to-b from-background to-background/50",
+        wrapper: "backdrop-blur-xl backdrop-saturate-200 bg-background/50 data-[menu-open=true]:bg-background"
+      }
+    }
+  ]
+});
+
+export {
+  navbar
+};

package/dist/{chunk-7MQD7UA2.mjs → chunk-B66JRVEO.mjs}

@@ -1,6 +1,6 @@
 import {
   semanticColors
-} from "./chunk-Y52EXP4A.mjs";
+} from "./chunk-BOKISNDL.mjs";
 import {
   commonColors
 } from "./chunk-CRCBVLUP.mjs";

package/dist/{chunk-Y52EXP4A.mjs → chunk-BOKISNDL.mjs}

@@ -1,9 +1,9 @@
-import {
-  swapColorValues
-} from "./chunk-37PIXVP4.mjs";
 import {
   commonColors
 } from "./chunk-CRCBVLUP.mjs";
+import {
+  swapColorValues
+} from "./chunk-37PIXVP4.mjs";
 
 // src/colors/semantic.ts
 import twColors from "tailwindcss/colors";
@@ -38,7 +38,7 @@ var base = {
   },
   dark: {
     background: {
-      DEFAULT: "#000000"
+      DEFAULT: "#0B0B0C"
     },
     foreground: {
       DEFAULT: "#ECEDEE"

package/dist/{chunk-KWYOTFZ4.mjs → chunk-KVW35URF.mjs}

@@ -26,7 +26,7 @@ var dropdownItem = tv({
     ],
     wrapper: "w-full flex flex-col items-start justify-center",
     title: "flex-1",
-    description: ["text-xs", "text-neutral-500", "truncate", "group-hover:text-current"],
+    description: ["text-xs", "w-full", "text-neutral-500", "group-hover:text-current"],
     selectedIcon: ["text-inherit", "w-3", "h-3", "flex-shrink-0"],
     shortcut: [
       "px-1",

package/dist/{chunk-XSFNJVJG.mjs → chunk-OCKSB2YQ.mjs}

@@ -1,21 +1,21 @@
+import {
+  animations
+} from "./chunk-DMASP6FA.mjs";
 import {
   utilities
 } from "./chunk-XLATS5QU.mjs";
-import {
-  baseStyles
-} from "./chunk-INZK6TTL.mjs";
 import {
   semanticColors
-} from "./chunk-Y52EXP4A.mjs";
+} from "./chunk-BOKISNDL.mjs";
+import {
+  commonColors
+} from "./chunk-CRCBVLUP.mjs";
 import {
   removeDefaultKeys
 } from "./chunk-37PIXVP4.mjs";
 import {
-  animations
-} from "./chunk-DMASP6FA.mjs";
-import {
-  commonColors
-} from "./chunk-CRCBVLUP.mjs";
+  baseStyles
+} from "./chunk-INZK6TTL.mjs";
 
 // src/plugin.ts
 import Color from "color";
@@ -125,7 +125,8 @@ var corePlugin = (config = {}, defaultTheme) => {
           },
           transitionDuration: {
             0: "0ms",
-            250: "250ms"
+            250: "250ms",
+            400: "400ms"
           },
           transitionTimingFunction: {
             "soft-spring": "cubic-bezier(0.155, 1.105, 0.295, 1.12)"

package/dist/colors/index.js

@@ -196,7 +196,7 @@ var base = {
   },
   dark: {
     background: {
-      DEFAULT: "#000000"
+      DEFAULT: "#0B0B0C"
     },
     foreground: {
       DEFAULT: "#ECEDEE"

package/dist/colors/index.mjs

@@ -1,10 +1,9 @@
 import {
   colors
-} from "../chunk-7MQD7UA2.mjs";
+} from "../chunk-B66JRVEO.mjs";
 import {
   semanticColors
-} from "../chunk-Y52EXP4A.mjs";
-import "../chunk-37PIXVP4.mjs";
+} from "../chunk-BOKISNDL.mjs";
 import "../chunk-M63AFAHO.mjs";
 import {
   commonColors
@@ -16,6 +15,7 @@ import "../chunk-Y4YW5MKL.mjs";
 import "../chunk-KZJBCC2H.mjs";
 import "../chunk-T3GWIVAM.mjs";
 import "../chunk-OR5PUD24.mjs";
+import "../chunk-37PIXVP4.mjs";
 export {
   colors,
   commonColors,

package/dist/colors/semantic.js

@@ -194,7 +194,7 @@ var base = {
   },
   dark: {
     background: {
-      DEFAULT: "#000000"
+      DEFAULT: "#0B0B0C"
     },
     foreground: {
       DEFAULT: "#ECEDEE"

package/dist/colors/semantic.mjs

@@ -2,8 +2,7 @@ import {
   semanticColors,
   semanticColorsDark,
   semanticColorsLight
-} from "../chunk-Y52EXP4A.mjs";
-import "../chunk-37PIXVP4.mjs";
+} from "../chunk-BOKISNDL.mjs";
 import "../chunk-CRCBVLUP.mjs";
 import "../chunk-DCEG5LGX.mjs";
 import "../chunk-L2OL7R23.mjs";
@@ -12,6 +11,7 @@ import "../chunk-Y4YW5MKL.mjs";
 import "../chunk-KZJBCC2H.mjs";
 import "../chunk-T3GWIVAM.mjs";
 import "../chunk-OR5PUD24.mjs";
+import "../chunk-37PIXVP4.mjs";
 export {
   semanticColors,
   semanticColorsDark,

package/dist/colors.js

@@ -196,7 +196,7 @@ var base = {
   },
   dark: {
     background: {
-      DEFAULT: "#000000"
+      DEFAULT: "#0B0B0C"
     },
     foreground: {
       DEFAULT: "#ECEDEE"

package/dist/colors.mjs

@@ -1,11 +1,10 @@
 import "./chunk-WQEDQHKX.mjs";
 import {
   colors
-} from "./chunk-7MQD7UA2.mjs";
+} from "./chunk-B66JRVEO.mjs";
 import {
   semanticColors
-} from "./chunk-Y52EXP4A.mjs";
-import "./chunk-37PIXVP4.mjs";
+} from "./chunk-BOKISNDL.mjs";
 import "./chunk-M63AFAHO.mjs";
 import {
   commonColors
@@ -17,6 +16,7 @@ import "./chunk-Y4YW5MKL.mjs";
 import "./chunk-KZJBCC2H.mjs";
 import "./chunk-T3GWIVAM.mjs";
 import "./chunk-OR5PUD24.mjs";
+import "./chunk-37PIXVP4.mjs";
 export {
   colors,
   commonColors,

package/dist/components/avatar.mjs

@@ -2,8 +2,8 @@ import {
   avatar
 } from "../chunk-7GYSEREC.mjs";
 import "../chunk-CMYR6AOY.mjs";
-import "../chunk-K7LK7NCE.mjs";
 import "../chunk-LGGZKBOO.mjs";
+import "../chunk-K7LK7NCE.mjs";
 import "../chunk-INZK6TTL.mjs";
 export {
   avatar

package/dist/components/badge.mjs

@@ -2,8 +2,8 @@ import {
   badge
 } from "../chunk-5Z3NCB7W.mjs";
 import "../chunk-CMYR6AOY.mjs";
-import "../chunk-K7LK7NCE.mjs";
 import "../chunk-LGGZKBOO.mjs";
+import "../chunk-K7LK7NCE.mjs";
 import "../chunk-INZK6TTL.mjs";
 export {
   badge

package/dist/components/button.mjs

@@ -2,8 +2,8 @@ import {
   button
 } from "../chunk-Y63UYKP7.mjs";
 import "../chunk-CMYR6AOY.mjs";
-import "../chunk-K7LK7NCE.mjs";
 import "../chunk-LGGZKBOO.mjs";
+import "../chunk-K7LK7NCE.mjs";
 import "../chunk-INZK6TTL.mjs";
 export {
   button

package/dist/components/chip.mjs

@@ -2,8 +2,8 @@ import {
   chip
 } from "../chunk-QRMWQXOX.mjs";
 import "../chunk-CMYR6AOY.mjs";
-import "../chunk-K7LK7NCE.mjs";
 import "../chunk-LGGZKBOO.mjs";
+import "../chunk-K7LK7NCE.mjs";
 import "../chunk-INZK6TTL.mjs";
 export {
   chip

package/dist/components/code.mjs

@@ -2,8 +2,8 @@ import {
   code
 } from "../chunk-B5S7HT6N.mjs";
 import "../chunk-CMYR6AOY.mjs";
-import "../chunk-K7LK7NCE.mjs";
 import "../chunk-LGGZKBOO.mjs";
+import "../chunk-K7LK7NCE.mjs";
 import "../chunk-INZK6TTL.mjs";
 export {
   code

package/dist/components/dropdown-item.js

@@ -50,7 +50,7 @@ var dropdownItem = (0, import_tailwind_variants.tv)({
     ],
     wrapper: "w-full flex flex-col items-start justify-center",
     title: "flex-1",
-    description: ["text-xs", "text-neutral-500", "truncate", "group-hover:text-current"],
+    description: ["text-xs", "w-full", "text-neutral-500", "group-hover:text-current"],
     selectedIcon: ["text-inherit", "w-3", "h-3", "flex-shrink-0"],
     shortcut: [
       "px-1",

package/dist/components/dropdown-item.mjs

@@ -1,6 +1,6 @@
 import {
   dropdownItem
-} from "../chunk-KWYOTFZ4.mjs";
+} from "../chunk-KVW35URF.mjs";
 export {
   dropdownItem
 };

package/dist/components/index.d.ts

@@ -29,5 +29,6 @@ export { DropdownSectionSlots, DropdownSectionVariantProps, dropdownSection } fr
 export { dropdownMenu } from './dropdown-menu.js';
 export { ImageSlots, ImageVariantProps, image } from './image.js';
 export { ModalSlots, ModalVariantProps, modal } from './modal.js';
+export { NavbarSlots, NavbarVariantProps, navbar } from './navbar.js';
 import 'tailwind-variants';
 import 'tailwind-variants/dist/config';

package/dist/components/index.js

@@ -42,6 +42,7 @@ __export(components_exports, {
   input: () => input,
   link: () => link,
   modal: () => modal,
+  navbar: () => navbar,
   pagination: () => pagination,
   popover: () => popover,
   progress: () => progress,
@@ -4590,7 +4591,7 @@ var dropdownItem = (0, import_tailwind_variants27.tv)({
     ],
     wrapper: "w-full flex flex-col items-start justify-center",
     title: "flex-1",
-    description: ["text-xs", "text-neutral-500", "truncate", "group-hover:text-current"],
+    description: ["text-xs", "w-full", "text-neutral-500", "group-hover:text-current"],
     selectedIcon: ["text-inherit", "w-3", "h-3", "flex-shrink-0"],
     shortcut: [
       "px-1",
@@ -5247,6 +5248,203 @@ var modal = (0, import_tailwind_variants31.tv)({
     }
   ]
 });
+
+// src/components/navbar.ts
+var import_tailwind_variants32 = require("tailwind-variants");
+var navbar = (0, import_tailwind_variants32.tv)({
+  slots: {
+    base: [
+      "relative",
+      "z-50",
+      "w-full",
+      "h-auto",
+      "flex",
+      "items-center",
+      "justify-center",
+      "border-b",
+      "border-neutral-100",
+      "shadow-md"
+    ],
+    wrapper: [
+      "flex",
+      "flex-row",
+      "flex-nowrap",
+      "items-center",
+      "justify-between",
+      "w-full",
+      "h-[var(--navbar-height)]",
+      "px-6"
+    ],
+    toggle: [
+      "group",
+      "flex",
+      "items-center",
+      "justify-center",
+      "w-6",
+      "h-10",
+      "outline-none",
+      "rounded-sm",
+      "data-[focus-visible=true]:outline-none",
+      "data-[focus-visible=true]:ring-2",
+      "data-[focus-visible=true]:ring-primary",
+      "data-[focus-visible=true]:ring-offset-2",
+      "data-[focus-visible=true]:ring-offset-background",
+      "data-[focus-visible=true]:dark:ring-offset-background-dark"
+    ],
+    srOnly: ["sr-only"],
+    toggleIcon: [
+      "w-full",
+      "h-full",
+      "pointer-events-none",
+      "flex",
+      "flex-col",
+      "items-center",
+      "justify-center",
+      "text-foreground",
+      "group-data-[pressed=true]:opacity-70",
+      "transition-opacity",
+      "before:content-['']",
+      "before:block",
+      "before:h-px",
+      "before:w-6",
+      "before:bg-current",
+      "before:transition-transform",
+      "before:duration-150",
+      "before:-translate-y-1",
+      "before:rotate-0",
+      "group-data-[open=true]:before:translate-y-px",
+      "group-data-[open=true]:before:rotate-45",
+      "after:content-['']",
+      "after:block",
+      "after:h-px",
+      "after:w-6",
+      "after:bg-current",
+      "after:transition-transform",
+      "after:duration-150",
+      "after:translate-y-1",
+      "after:rotate-0",
+      "group-data-[open=true]:after:translate-y-0",
+      "group-data-[open=true]:after:-rotate-45"
+    ],
+    brand: [
+      "flex",
+      "flex-row",
+      "flex-nowrap",
+      "justify-start",
+      "bg-transparent",
+      "items-center",
+      "no-underline",
+      "text-base",
+      "whitespace-nowrap",
+      "box-border"
+    ],
+    content: ["flex", "h-full", "flex-row", "flex-nowrap", "items-center", "gap-4"],
+    item: [
+      "text-base",
+      "whitespace-nowrap",
+      "box-border",
+      "data-[active=true]:font-semibold"
+    ],
+    menu: [
+      "z-50",
+      "hidden",
+      "px-6",
+      "pt-4",
+      "absolute",
+      "max-w-full",
+      "top-[calc(var(--navbar-height)_+_1px)]",
+      "h-[calc(100vh_-_var(--navbar-height)_-_1px)]",
+      "inset-x-0",
+      "bottom-0",
+      "w-screen",
+      "bg-background",
+      "data-[open=true]:flex",
+      "flex-col",
+      "gap-3",
+      "overflow-y-auto"
+    ],
+    menuItem: ["text-lg"]
+  },
+  variants: {
+    position: {
+      static: {
+        base: "static"
+      },
+      sticky: {},
+      floating: {
+        base: "shadow-none border-b-0",
+        wrapper: "mt-4 mx-8 shadow-md border border-neutral-100 rounded-xl",
+        menu: "mt-5 mx-8 border border-neutral-100 rounded-xl max-w-[calc(100%_-_4rem)]"
+      }
+    },
+    maxWidth: {
+      sm: {
+        wrapper: "max-w-[640px]"
+      },
+      md: {
+        wrapper: "max-w-[768px]"
+      },
+      lg: {
+        wrapper: "max-w-[1024px]"
+      },
+      xl: {
+        wrapper: "max-w-[1280px]"
+      },
+      "2xl": {
+        wrapper: "max-w-[1536px]"
+      },
+      full: {
+        wrapper: "max-w-full"
+      }
+    },
+    hideOnScroll: {
+      true: {
+        base: [
+          "sticky",
+          "top-0",
+          "inset-x-0"
+        ]
+      }
+    },
+    isBordered: {
+      true: {}
+    },
+    isBlurred: {
+      false: {
+        base: "bg-background"
+      },
+      true: {}
+    }
+  },
+  defaultVariants: {
+    maxWidth: "lg",
+    position: "sticky",
+    isBlurred: true
+  },
+  compoundVariants: [
+    {
+      position: ["sticky", "floating"],
+      class: {
+        base: "sticky top-0 inset-x-0"
+      }
+    },
+    {
+      isBlurred: true,
+      position: ["static", "sticky"],
+      class: {
+        base: "backdrop-blur-xl backdrop-saturate-200 bg-background/50 data-[menu-open=true]:bg-background"
+      }
+    },
+    {
+      isBlurred: true,
+      position: "floating",
+      class: {
+        base: "bg-gradient-to-b from-background to-background/50",
+        wrapper: "backdrop-blur-xl backdrop-saturate-200 bg-background/50 data-[menu-open=true]:bg-background"
+      }
+    }
+  ]
+});
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   accordion,
@@ -5271,6 +5469,7 @@ var modal = (0, import_tailwind_variants31.tv)({
   input,
   link,
   modal,
+  navbar,
   pagination,
   popover,
   progress,