@cryptlex/web-components 1.1.0 → 1.2.1

package/dist/components/ui/accordion.es.js

@@ -0,0 +1,47 @@
+import { jsx as a, jsxs as c } from "react/jsx-runtime";
+import * as i from "react";
+import * as e from "@radix-ui/react-accordion";
+import { cn as s } from "../../utils/index.es.js";
+import { ChevronDownIcon as d } from "@radix-ui/react-icons";
+const g = e.Root, m = i.forwardRef(({ className: o, ...t }, r) => /* @__PURE__ */ a(
+  e.Item,
+  {
+    ref: r,
+    className: s("border-b", o),
+    ...t
+  }
+));
+m.displayName = "AccordionItem";
+const l = i.forwardRef(({ className: o, children: t, ...r }, n) => /* @__PURE__ */ a(e.Header, { className: "flex", children: /* @__PURE__ */ c(
+  e.Trigger,
+  {
+    ref: n,
+    className: s(
+      "flex flex-1 items-center justify-between py-4 text-sm font-medium transition-all hover:underline text-left [&[data-state=open]>svg]:rotate-180",
+      o
+    ),
+    ...r,
+    children: [
+      t,
+      /* @__PURE__ */ a(d, { className: "h-4 w-4 shrink-0 text-muted-foreground transition-transform duration-200" })
+    ]
+  }
+) }));
+l.displayName = e.Trigger.displayName;
+const f = i.forwardRef(({ className: o, children: t, ...r }, n) => /* @__PURE__ */ a(
+  e.Content,
+  {
+    ref: n,
+    className: "overflow-hidden text-sm data-[state=closed]:animate-accordion-up data-[state=open]:animate-accordion-down",
+    ...r,
+    children: /* @__PURE__ */ a("div", { className: s("pb-4 pt-0", o), children: t })
+  }
+));
+f.displayName = e.Content.displayName;
+export {
+  g as Accordion,
+  f as AccordionContent,
+  m as AccordionItem,
+  l as AccordionTrigger
+};
+//# sourceMappingURL=accordion.es.js.map

package/dist/components/ui/accordion.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"accordion.es.js","sources":["../../../lib/components/ui/accordion.tsx"],"sourcesContent":["import * as React from \"react\"\nimport * as AccordionPrimitive from \"@radix-ui/react-accordion\"\nimport { cn } from \"@/utils\"\nimport { ChevronDownIcon } from \"@radix-ui/react-icons\"\n\nconst Accordion = AccordionPrimitive.Root\n\nconst AccordionItem = React.forwardRef<\n  React.ElementRef<typeof AccordionPrimitive.Item>,\n  React.ComponentPropsWithoutRef<typeof AccordionPrimitive.Item>\n>(({ className, ...props }, ref) => (\n  <AccordionPrimitive.Item\n    ref={ref}\n    className={cn(\"border-b\", className)}\n    {...props}\n  />\n))\nAccordionItem.displayName = \"AccordionItem\"\n\nconst AccordionTrigger = React.forwardRef<\n  React.ElementRef<typeof AccordionPrimitive.Trigger>,\n  React.ComponentPropsWithoutRef<typeof AccordionPrimitive.Trigger>\n>(({ className, children, ...props }, ref) => (\n  <AccordionPrimitive.Header className=\"flex\">\n    <AccordionPrimitive.Trigger\n      ref={ref}\n      className={cn(\n        \"flex flex-1 items-center justify-between py-4 text-sm font-medium transition-all hover:underline text-left [&[data-state=open]>svg]:rotate-180\",\n        className\n      )}\n      {...props}\n    >\n      {children}\n      <ChevronDownIcon className=\"h-4 w-4 shrink-0 text-muted-foreground transition-transform duration-200\" />\n    </AccordionPrimitive.Trigger>\n  </AccordionPrimitive.Header>\n))\nAccordionTrigger.displayName = AccordionPrimitive.Trigger.displayName\n\nconst AccordionContent = React.forwardRef<\n  React.ElementRef<typeof AccordionPrimitive.Content>,\n  React.ComponentPropsWithoutRef<typeof AccordionPrimitive.Content>\n>(({ className, children, ...props }, ref) => (\n  <AccordionPrimitive.Content\n    ref={ref}\n    className=\"overflow-hidden text-sm data-[state=closed]:animate-accordion-up data-[state=open]:animate-accordion-down\"\n    {...props}\n  >\n    <div className={cn(\"pb-4 pt-0\", className)}>{children}</div>\n  </AccordionPrimitive.Content>\n))\nAccordionContent.displayName = AccordionPrimitive.Content.displayName\n\nexport { Accordion, AccordionItem, AccordionTrigger, AccordionContent }\n"],"names":["Accordion","AccordionPrimitive","AccordionItem","React","className","props","ref","jsx","cn","AccordionTrigger","children","jsxs","ChevronDownIcon","AccordionContent"],"mappings":";;;;;AAKA,MAAMA,IAAYC,EAAmB,MAE/BC,IAAgBC,EAAM,WAG1B,CAAC,EAAE,WAAAC,GAAW,GAAGC,EAAM,GAAGC,MAC1B,gBAAAC;AAAA,EAACN,EAAmB;AAAA,EAAnB;AAAA,IACC,KAAAK;AAAA,IACA,WAAWE,EAAG,YAAYJ,CAAS;AAAA,IAClC,GAAGC;AAAA,EAAA;AACN,CACD;AACDH,EAAc,cAAc;AAE5B,MAAMO,IAAmBN,EAAM,WAG7B,CAAC,EAAE,WAAAC,GAAW,UAAAM,GAAU,GAAGL,EAAM,GAAGC,MACnC,gBAAAC,EAAAN,EAAmB,QAAnB,EAA0B,WAAU,QACnC,UAAA,gBAAAU;AAAA,EAACV,EAAmB;AAAA,EAAnB;AAAA,IACC,KAAAK;AAAA,IACA,WAAWE;AAAA,MACT;AAAA,MACAJ;AAAA,IACF;AAAA,IACC,GAAGC;AAAA,IAEH,UAAA;AAAA,MAAAK;AAAA,MACD,gBAAAH,EAACK,GAAgB,EAAA,WAAU,2EAA2E,CAAA;AAAA,IAAA;AAAA,EAAA;AACxG,GACF,CACD;AACDH,EAAiB,cAAcR,EAAmB,QAAQ;AAEpD,MAAAY,IAAmBV,EAAM,WAG7B,CAAC,EAAE,WAAAC,GAAW,UAAAM,GAAU,GAAGL,KAASC,MACpC,gBAAAC;AAAA,EAACN,EAAmB;AAAA,EAAnB;AAAA,IACC,KAAAK;AAAA,IACA,WAAU;AAAA,IACT,GAAGD;AAAA,IAEJ,4BAAC,OAAI,EAAA,WAAWG,EAAG,aAAaJ,CAAS,GAAI,UAAAM,EAAS,CAAA;AAAA,EAAA;AACxD,CACD;AACDG,EAAiB,cAAcZ,EAAmB,QAAQ;"}

package/dist/components/ui/input.es.js

@@ -1,23 +1,22 @@
-import { jsx as t } from "react/jsx-runtime";
-import * as n from "react";
-import { cn as s } from "../../utils/index.es.js";
-const f = n.forwardRef(
-  ({ className: e, type: r, ...o }, i) => /* @__PURE__ */ t(
+import { jsx as i } from "react/jsx-runtime";
+import * as l from "react";
+import { cn as d } from "../../utils/index.es.js";
+const s = l.forwardRef(
+  ({ className: e, type: r, ...o }, t) => /* @__PURE__ */ i(
     "input",
     {
       type: r,
-      className: s(
-        "flex h-10 w-full rounded-lg border border-input bg-background px-3 py-2 text-sm ring-offset-background file:border-0 file:bg-transparent file:text-sm file:font-medium placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary focus-visible:ring-offset-1 disabled:cursor-not-allowed disabled:opacity-50",
-        // Change 'ring' class to 'ring-primary'
+      className: d(
+        "flex h-10 w-full rounded-lg border border-input bg-background px-3 py-2 text-sm  file:border-0 file:bg-transparent file:text-sm file:font-medium placeholder:text-muted-foreground focus-visible:outline-none focus-visible:border-2 focus-visible:border-primary disabled:cursor-not-allowed disabled:opacity-50",
         e
       ),
-      ref: i,
+      ref: t,
       ...o
     }
   )
 );
-f.displayName = "Input";
+s.displayName = "Input";
 export {
-  f as Input
+  s as Input
 };
 //# sourceMappingURL=input.es.js.map

package/dist/components/ui/input.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"input.es.js","sources":["../../../lib/components/ui/input.tsx"],"sourcesContent":["import * as React from \"react\"\n\nimport { cn } from \"@/utils\"\n\nexport interface InputProps\n  extends React.InputHTMLAttributes<HTMLInputElement> {}\n//Input\nconst Input = React.forwardRef<HTMLInputElement, InputProps>(\n  ({ className, type, ...props }, ref) => {\n    return (\n      <input\n        type={type}\n        className={cn(\n          \"flex h-10 w-full rounded-lg border border-input bg-background px-3 py-2 text-sm ring-offset-background file:border-0 file:bg-transparent file:text-sm file:font-medium placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary focus-visible:ring-offset-1 disabled:cursor-not-allowed disabled:opacity-50\", // Change 'ring' class to 'ring-primary'\n          className\n        )}\n        ref={ref}\n        {...props}\n      />\n    );\n  }\n);\nInput.displayName = \"Input\";\n\nexport { Input };"],"names":["Input","React","className","type","props","ref","jsx","cn"],"mappings":";;;AAOA,MAAMA,IAAQC,EAAM;AAAA,EAClB,CAAC,EAAE,WAAAC,GAAW,MAAAC,GAAM,GAAGC,EAAA,GAASC,MAE5B,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,MAAAH;AAAA,MACA,WAAWI;AAAA,QACT;AAAA;AAAA,QACAL;AAAA,MACF;AAAA,MACA,KAAAG;AAAA,MACC,GAAGD;AAAA,IAAA;AAAA,EACN;AAGN;AACAJ,EAAM,cAAc;"}
+{"version":3,"file":"input.es.js","sources":["../../../lib/components/ui/input.tsx"],"sourcesContent":["import * as React from \"react\"\n\nimport { cn } from \"@/utils\"\n\nexport interface InputProps\n  extends React.InputHTMLAttributes<HTMLInputElement> {}\n//Input\nconst Input = React.forwardRef<HTMLInputElement, InputProps>(\n  ({ className, type, ...props }, ref) => {\n    return (\n      <input\n        type={type}\n        className={cn(\n          \"flex h-10 w-full rounded-lg border border-input bg-background px-3 py-2 text-sm  file:border-0 file:bg-transparent file:text-sm file:font-medium placeholder:text-muted-foreground focus-visible:outline-none focus-visible:border-2 focus-visible:border-primary disabled:cursor-not-allowed disabled:opacity-50\",\n          className\n        )}\n        ref={ref}\n        {...props}\n      />\n    );\n  }\n);\nInput.displayName = \"Input\";\n\nexport { Input };"],"names":["Input","React","className","type","props","ref","jsx","cn"],"mappings":";;;AAOA,MAAMA,IAAQC,EAAM;AAAA,EAClB,CAAC,EAAE,WAAAC,GAAW,MAAAC,GAAM,GAAGC,EAAA,GAASC,MAE5B,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,MAAAH;AAAA,MACA,WAAWI;AAAA,QACT;AAAA,QACAL;AAAA,MACF;AAAA,MACA,KAAAG;AAAA,MACC,GAAGD;AAAA,IAAA;AAAA,EACN;AAGN;AACAJ,EAAM,cAAc;"}

package/dist/components/ui/navigation-menu.es.js

@@ -0,0 +1,122 @@
+import { jsxs as s, jsx as n } from "react/jsx-runtime";
+import * as r from "react";
+import * as e from "@radix-ui/react-navigation-menu";
+import { cva as c } from "class-variance-authority";
+import { cn as i } from "../../utils/index.es.js";
+import { ChevronDownIcon as f } from "@radix-ui/react-icons";
+const u = r.forwardRef(({ className: t, children: a, ...o }, d) => /* @__PURE__ */ s(
+  e.Root,
+  {
+    ref: d,
+    className: i(
+      "relative z-10 flex max-w-max flex-1 items-center justify-center",
+      t
+    ),
+    ...o,
+    children: [
+      a,
+      /* @__PURE__ */ n(m, {})
+    ]
+  }
+));
+u.displayName = e.Root.displayName;
+const p = r.forwardRef(({ className: t, ...a }, o) => /* @__PURE__ */ n(
+  e.List,
+  {
+    ref: o,
+    className: i(
+      "group flex flex-1 list-none items-center justify-center space-x-1 flex-wrap",
+      t
+    ),
+    ...a
+  }
+));
+p.displayName = e.List.displayName;
+const I = e.Item, g = c(
+  "group inline-flex h-9 w-max items-center justify-center rounded-md bg-background px-4 py-2 text-sm font-medium transition-colors hover:bg-accent hover:text-accent-foreground focus:bg-accent focus:text-accent-foreground focus:outline-none disabled:pointer-events-none disabled:opacity-50 data-[active]:bg-accent data-[state=open]:bg-accent data-[state=open]:text-accent-foreground"
+), v = r.forwardRef(({ className: t, children: a, ...o }, d) => /* @__PURE__ */ s(
+  e.Trigger,
+  {
+    ref: d,
+    className: i(g(), "group", t),
+    ...o,
+    children: [
+      a,
+      " ",
+      /* @__PURE__ */ n(
+        f,
+        {
+          className: "relative top-[1px] ml-1 h-3 w-3 transition duration-300 group-data-[state=open]:rotate-180",
+          "aria-hidden": "true"
+        }
+      )
+    ]
+  }
+));
+v.displayName = e.Trigger.displayName;
+const N = r.forwardRef(({ className: t, ...a }, o) => /* @__PURE__ */ n(
+  e.Content,
+  {
+    ref: o,
+    className: i(
+      "left-0 top-0 w-full data-[motion^=from-]:animate-in data-[motion^=to-]:animate-out data-[motion^=from-]:fade-in data-[motion^=to-]:fade-out data-[motion=from-end]:slide-in-from-right-52 data-[motion=from-start]:slide-in-from-left-52 data-[motion=to-end]:slide-out-to-right-52 data-[motion=to-start]:slide-out-to-left-52 md:absolute md:w-auto ",
+      t
+    ),
+    ...a
+  }
+));
+N.displayName = e.Content.displayName;
+const h = e.Link, m = r.forwardRef(({ className: t, ...a }, o) => /* @__PURE__ */ n("div", { className: i("absolute left-0 top-full flex justify-center"), children: /* @__PURE__ */ n(
+  e.Viewport,
+  {
+    className: i(
+      "origin-top-center relative mt-1.5 h-[var(--radix-navigation-menu-viewport-height)] w-full overflow-hidden rounded-md border bg-popover text-popover-foreground shadow data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-90 md:w-[var(--radix-navigation-menu-viewport-width)]",
+      t
+    ),
+    ref: o,
+    ...a
+  }
+) }));
+m.displayName = e.Viewport.displayName;
+const x = r.forwardRef(({ className: t, ...a }, o) => /* @__PURE__ */ n(
+  e.Indicator,
+  {
+    ref: o,
+    className: i(
+      "top-full z-[1] flex h-1.5 items-end justify-center overflow-hidden data-[state=visible]:animate-in data-[state=hidden]:animate-out data-[state=hidden]:fade-out data-[state=visible]:fade-in",
+      t
+    ),
+    ...a,
+    children: /* @__PURE__ */ n("div", { className: "relative top-[60%] h-2 w-2 rotate-45 rounded-tl-sm bg-border shadow-md" })
+  }
+));
+x.displayName = e.Indicator.displayName;
+const w = r.forwardRef(({ className: t, title: a, children: o, ...d }, l) => /* @__PURE__ */ n("li", { children: /* @__PURE__ */ n(h, { asChild: !0, children: /* @__PURE__ */ s(
+  "a",
+  {
+    ref: l,
+    className: i(
+      "block select-none space-y-1 rounded-md p-3 leading-none no-underline outline-none transition-colors hover:bg-accent hover:text-accent-foreground focus:bg-accent focus:text-accent-foreground",
+      t
+    ),
+    ...d,
+    children: [
+      /* @__PURE__ */ n("div", { className: "text-sm font-medium leading-none", children: a }),
+      /* @__PURE__ */ n("p", { className: "line-clamp-2 text-sm leading-snug text-muted-foreground", children: o })
+    ]
+  }
+) }) }));
+w.displayName = "NavigationItemListItem";
+export {
+  u as NavigationMenu,
+  N as NavigationMenuContent,
+  x as NavigationMenuIndicator,
+  I as NavigationMenuItem,
+  h as NavigationMenuLink,
+  p as NavigationMenuList,
+  w as NavigationMenuListItem,
+  v as NavigationMenuTrigger,
+  m as NavigationMenuViewport,
+  g as navigationMenuTriggerStyle
+};
+//# sourceMappingURL=navigation-menu.es.js.map

package/dist/components/ui/navigation-menu.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"navigation-menu.es.js","sources":["../../../lib/components/ui/navigation-menu.tsx"],"sourcesContent":["import * as React from \"react\"\nimport * as NavigationMenuPrimitive from \"@radix-ui/react-navigation-menu\"\nimport { cva } from \"class-variance-authority\"\nimport { cn } from \"@/utils\"\nimport { ChevronDownIcon } from \"@radix-ui/react-icons\"\n\nconst NavigationMenu = React.forwardRef<\n  React.ElementRef<typeof NavigationMenuPrimitive.Root>,\n  React.ComponentPropsWithoutRef<typeof NavigationMenuPrimitive.Root>\n>(({ className, children, ...props }, ref) => (\n  <NavigationMenuPrimitive.Root\n    ref={ref}\n    className={cn(\n      \"relative z-10 flex max-w-max flex-1 items-center justify-center\",\n      className\n    )}\n    {...props}\n  >\n    {children}\n    <NavigationMenuViewport />\n  </NavigationMenuPrimitive.Root>\n))\nNavigationMenu.displayName = NavigationMenuPrimitive.Root.displayName\n\nconst NavigationMenuList = React.forwardRef<\n  React.ElementRef<typeof NavigationMenuPrimitive.List>,\n  React.ComponentPropsWithoutRef<typeof NavigationMenuPrimitive.List>\n>(({ className, ...props }, ref) => (\n  <NavigationMenuPrimitive.List\n    ref={ref}\n    className={cn(\n      \"group flex flex-1 list-none items-center justify-center space-x-1 flex-wrap\",\n      className\n    )}\n    {...props}\n  />\n))\nNavigationMenuList.displayName = NavigationMenuPrimitive.List.displayName\n\nconst NavigationMenuItem = NavigationMenuPrimitive.Item\n\nconst navigationMenuTriggerStyle = cva(\n  \"group inline-flex h-9 w-max items-center justify-center rounded-md bg-background px-4 py-2 text-sm font-medium transition-colors hover:bg-accent hover:text-accent-foreground focus:bg-accent focus:text-accent-foreground focus:outline-none disabled:pointer-events-none disabled:opacity-50 data-[active]:bg-accent data-[state=open]:bg-accent data-[state=open]:text-accent-foreground\"\n)\n\nconst NavigationMenuTrigger = React.forwardRef<\n  React.ElementRef<typeof NavigationMenuPrimitive.Trigger>,\n  React.ComponentPropsWithoutRef<typeof NavigationMenuPrimitive.Trigger>\n>(({ className, children, ...props }, ref) => (\n  <NavigationMenuPrimitive.Trigger\n    ref={ref}\n    className={cn(navigationMenuTriggerStyle(), \"group\", className)}\n    {...props}\n  >\n    {children}{\" \"}\n    <ChevronDownIcon\n      className=\"relative top-[1px] ml-1 h-3 w-3 transition duration-300 group-data-[state=open]:rotate-180\"\n      aria-hidden=\"true\"\n    />\n  </NavigationMenuPrimitive.Trigger>\n))\nNavigationMenuTrigger.displayName = NavigationMenuPrimitive.Trigger.displayName\n\nconst NavigationMenuContent = React.forwardRef<\n  React.ElementRef<typeof NavigationMenuPrimitive.Content>,\n  React.ComponentPropsWithoutRef<typeof NavigationMenuPrimitive.Content>\n>(({ className, ...props }, ref) => (\n  <NavigationMenuPrimitive.Content\n    ref={ref}\n    className={cn(\n      \"left-0 top-0 w-full data-[motion^=from-]:animate-in data-[motion^=to-]:animate-out data-[motion^=from-]:fade-in data-[motion^=to-]:fade-out data-[motion=from-end]:slide-in-from-right-52 data-[motion=from-start]:slide-in-from-left-52 data-[motion=to-end]:slide-out-to-right-52 data-[motion=to-start]:slide-out-to-left-52 md:absolute md:w-auto \",\n      className\n    )}\n    {...props}\n  />\n))\nNavigationMenuContent.displayName = NavigationMenuPrimitive.Content.displayName\n\nconst NavigationMenuLink = NavigationMenuPrimitive.Link\n\nconst NavigationMenuViewport = React.forwardRef<\n  React.ElementRef<typeof NavigationMenuPrimitive.Viewport>,\n  React.ComponentPropsWithoutRef<typeof NavigationMenuPrimitive.Viewport>\n>(({ className, ...props }, ref) => (\n  <div className={cn(\"absolute left-0 top-full flex justify-center\")}>\n    <NavigationMenuPrimitive.Viewport\n      className={cn(\n        \"origin-top-center relative mt-1.5 h-[var(--radix-navigation-menu-viewport-height)] w-full overflow-hidden rounded-md border bg-popover text-popover-foreground shadow data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-90 md:w-[var(--radix-navigation-menu-viewport-width)]\",\n        className\n      )}\n      ref={ref}\n      {...props}\n    />\n  </div>\n))\nNavigationMenuViewport.displayName =\n  NavigationMenuPrimitive.Viewport.displayName\n\nconst NavigationMenuIndicator = React.forwardRef<\n  React.ElementRef<typeof NavigationMenuPrimitive.Indicator>,\n  React.ComponentPropsWithoutRef<typeof NavigationMenuPrimitive.Indicator>\n>(({ className, ...props }, ref) => (\n  <NavigationMenuPrimitive.Indicator\n    ref={ref}\n    className={cn(\n      \"top-full z-[1] flex h-1.5 items-end justify-center overflow-hidden data-[state=visible]:animate-in data-[state=hidden]:animate-out data-[state=hidden]:fade-out data-[state=visible]:fade-in\",\n      className\n    )}\n    {...props}\n  >\n    <div className=\"relative top-[60%] h-2 w-2 rotate-45 rounded-tl-sm bg-border shadow-md\" />\n  </NavigationMenuPrimitive.Indicator>\n))\nNavigationMenuIndicator.displayName =\n  NavigationMenuPrimitive.Indicator.displayName\n\nconst NavigationMenuListItem = React.forwardRef<\n  React.ElementRef<\"a\">,\n  React.ComponentPropsWithoutRef<\"a\">\n>(({ className, title, children, ...props }, ref) => {\n  return (\n    <li>\n      <NavigationMenuLink asChild>\n        <a\n          ref={ref}\n          className={cn(\n            \"block select-none space-y-1 rounded-md p-3 leading-none no-underline outline-none transition-colors hover:bg-accent hover:text-accent-foreground focus:bg-accent focus:text-accent-foreground\",\n            className\n          )}\n          {...props}\n        >\n          <div className=\"text-sm font-medium leading-none\">{title}</div>\n          <p className=\"line-clamp-2 text-sm leading-snug text-muted-foreground\">\n            {children}\n          </p>\n        </a>\n      </NavigationMenuLink>\n    </li>\n  )\n})\nNavigationMenuListItem.displayName = \"NavigationItemListItem\"\n\nexport {\n  navigationMenuTriggerStyle,\n  NavigationMenu,\n  NavigationMenuList,\n  NavigationMenuItem,\n  NavigationMenuContent,\n  NavigationMenuTrigger,\n  NavigationMenuLink,\n  NavigationMenuIndicator,\n  NavigationMenuViewport,\n  NavigationMenuListItem\n}\n"],"names":["NavigationMenu","React","className","children","props","ref","jsxs","NavigationMenuPrimitive","cn","NavigationMenuViewport","NavigationMenuList","jsx","NavigationMenuItem","navigationMenuTriggerStyle","cva","NavigationMenuTrigger","ChevronDownIcon","NavigationMenuContent","NavigationMenuLink","NavigationMenuIndicator","NavigationMenuListItem","title"],"mappings":";;;;;;AAMM,MAAAA,IAAiBC,EAAM,WAG3B,CAAC,EAAE,WAAAC,GAAW,UAAAC,GAAU,GAAGC,KAASC,MACpC,gBAAAC;AAAA,EAACC,EAAwB;AAAA,EAAxB;AAAA,IACC,KAAAF;AAAA,IACA,WAAWG;AAAA,MACT;AAAA,MACAN;AAAA,IACF;AAAA,IACC,GAAGE;AAAA,IAEH,UAAA;AAAA,MAAAD;AAAA,wBACAM,GAAuB,CAAA,CAAA;AAAA,IAAA;AAAA,EAAA;AAC1B,CACD;AACDT,EAAe,cAAcO,EAAwB,KAAK;AAEpD,MAAAG,IAAqBT,EAAM,WAG/B,CAAC,EAAE,WAAAC,GAAW,GAAGE,EAAM,GAAGC,MAC1B,gBAAAM;AAAA,EAACJ,EAAwB;AAAA,EAAxB;AAAA,IACC,KAAAF;AAAA,IACA,WAAWG;AAAA,MACT;AAAA,MACAN;AAAA,IACF;AAAA,IACC,GAAGE;AAAA,EAAA;AACN,CACD;AACDM,EAAmB,cAAcH,EAAwB,KAAK;AAE9D,MAAMK,IAAqBL,EAAwB,MAE7CM,IAA6BC;AAAA,EACjC;AACF,GAEMC,IAAwBd,EAAM,WAGlC,CAAC,EAAE,WAAAC,GAAW,UAAAC,GAAU,GAAGC,KAASC,MACpC,gBAAAC;AAAA,EAACC,EAAwB;AAAA,EAAxB;AAAA,IACC,KAAAF;AAAA,IACA,WAAWG,EAAGK,KAA8B,SAASX,CAAS;AAAA,IAC7D,GAAGE;AAAA,IAEH,UAAA;AAAA,MAAAD;AAAA,MAAU;AAAA,MACX,gBAAAQ;AAAA,QAACK;AAAA,QAAA;AAAA,UACC,WAAU;AAAA,UACV,eAAY;AAAA,QAAA;AAAA,MAAA;AAAA,IACd;AAAA,EAAA;AACF,CACD;AACDD,EAAsB,cAAcR,EAAwB,QAAQ;AAE9D,MAAAU,IAAwBhB,EAAM,WAGlC,CAAC,EAAE,WAAAC,GAAW,GAAGE,EAAM,GAAGC,MAC1B,gBAAAM;AAAA,EAACJ,EAAwB;AAAA,EAAxB;AAAA,IACC,KAAAF;AAAA,IACA,WAAWG;AAAA,MACT;AAAA,MACAN;AAAA,IACF;AAAA,IACC,GAAGE;AAAA,EAAA;AACN,CACD;AACDa,EAAsB,cAAcV,EAAwB,QAAQ;AAEpE,MAAMW,IAAqBX,EAAwB,MAE7CE,IAAyBR,EAAM,WAGnC,CAAC,EAAE,WAAAC,GAAW,GAAGE,KAASC,MACzB,gBAAAM,EAAA,OAAA,EAAI,WAAWH,EAAG,8CAA8C,GAC/D,UAAA,gBAAAG;AAAA,EAACJ,EAAwB;AAAA,EAAxB;AAAA,IACC,WAAWC;AAAA,MACT;AAAA,MACAN;AAAA,IACF;AAAA,IACA,KAAAG;AAAA,IACC,GAAGD;AAAA,EAAA;AACN,GACF,CACD;AACDK,EAAuB,cACrBF,EAAwB,SAAS;AAE7B,MAAAY,IAA0BlB,EAAM,WAGpC,CAAC,EAAE,WAAAC,GAAW,GAAGE,EAAM,GAAGC,MAC1B,gBAAAM;AAAA,EAACJ,EAAwB;AAAA,EAAxB;AAAA,IACC,KAAAF;AAAA,IACA,WAAWG;AAAA,MACT;AAAA,MACAN;AAAA,IACF;AAAA,IACC,GAAGE;AAAA,IAEJ,UAAA,gBAAAO,EAAC,OAAI,EAAA,WAAU,yEAAyE,CAAA;AAAA,EAAA;AAC1F,CACD;AACDQ,EAAwB,cACtBZ,EAAwB,UAAU;AAE9B,MAAAa,IAAyBnB,EAAM,WAGnC,CAAC,EAAE,WAAAC,GAAW,OAAAmB,GAAO,UAAAlB,GAAU,GAAGC,EAAM,GAAGC,MAExC,gBAAAM,EAAA,MAAA,EACC,UAAC,gBAAAA,EAAAO,GAAA,EAAmB,SAAO,IACzB,UAAA,gBAAAZ;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,KAAAD;AAAA,IACA,WAAWG;AAAA,MACT;AAAA,MACAN;AAAA,IACF;AAAA,IACC,GAAGE;AAAA,IAEJ,UAAA;AAAA,MAAC,gBAAAO,EAAA,OAAA,EAAI,WAAU,oCAAoC,UAAMU,GAAA;AAAA,MACxD,gBAAAV,EAAA,KAAA,EAAE,WAAU,2DACV,UAAAR,EACH,CAAA;AAAA,IAAA;AAAA,EAAA;GAEJ,EACF,CAAA,CAEH;AACDiB,EAAuB,cAAc;"}

package/dist/components/ui/password-input.es.js

@@ -1,20 +1,20 @@
 import { jsxs as n, jsx as e } from "react/jsx-runtime";
-import * as r from "react";
-import { EyeIcon as m, EyeOffIcon as d } from "lucide-react";
+import * as o from "react";
+import { EyeIcon as d, EyeOffIcon as m } from "lucide-react";
 import { Input as i } from "./input.es.js";
 import { Button as p } from "./button.es.js";
-const u = r.forwardRef(
-  ({ className: c, ...o }, s) => {
-    const [t, a] = r.useState(!1);
+const u = o.forwardRef(
+  ({ className: c, ...r }, s) => {
+    const [t, a] = o.useState(!1);
     return /* @__PURE__ */ n("div", { className: "flex flex-row items-center relative", children: [
-      /* @__PURE__ */ e(i, { type: t ? "text" : "password", ref: s, ...o }),
+      /* @__PURE__ */ e(i, { type: t ? "text" : "password", ref: s, ...r }),
       /* @__PURE__ */ e(
         p,
         {
           type: "button",
-          className: "absolute right-0 top-0 mr-2 rounded-md bg-transparent p-2 text-muted-foreground hover:bg-muted/5 focus:outline-none",
+          className: "absolute right-0 top-0 rounded-md bg-transparent p-2 text-muted-foreground hover:bg-muted/5 focus:outline-none",
           onClick: () => a(!t),
-          children: t ? /* @__PURE__ */ e(d, { className: "h-4 w-4", "aria-hidden": "true" }) : /* @__PURE__ */ e(m, { className: "h-4 w-4", "aria-hidden": "true" })
+          children: t ? /* @__PURE__ */ e(m, { className: "h-4 w-4", "aria-hidden": "true" }) : /* @__PURE__ */ e(d, { className: "h-4 w-4", "aria-hidden": "true" })
         }
       )
     ] });

package/dist/components/ui/password-input.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"password-input.es.js","sources":["../../../lib/components/ui/password-input.tsx"],"sourcesContent":["import * as React from \"react\";\n\nimport { EyeIcon, EyeOffIcon } from \"lucide-react\";\nimport { Input, InputProps } from \"./input\";\nimport { Button } from \"./button\";\n\nconst PasswordInput = React.forwardRef<HTMLInputElement, InputProps>(\n  ({ className, ...props }, ref) => {\n    const [showPassword, setShowPassword] = React.useState<boolean>(false);\n    return (\n      <div className=\"flex flex-row items-center relative\">\n        <Input type={showPassword ? \"text\" : \"password\"} ref={ref} {...props} />\n        <Button\n          type=\"button\"\n          className=\"absolute right-0 top-0 mr-2 rounded-md bg-transparent p-2 text-muted-foreground hover:bg-muted/5 focus:outline-none\"\n          onClick={() => setShowPassword(!showPassword)}\n        >\n          {!showPassword ? (\n            <EyeIcon className=\"h-4 w-4\" aria-hidden=\"true\" />\n          ) : (\n            <EyeOffIcon className=\"h-4 w-4\" aria-hidden=\"true\" />\n          )}\n        </Button>\n      </div>\n    );\n  }\n);\nPasswordInput.displayName = \"PasswordInput\";\n\nexport { PasswordInput };\n"],"names":["PasswordInput","React","className","props","ref","showPassword","setShowPassword","jsxs","jsx","Input","Button","EyeOffIcon","EyeIcon"],"mappings":";;;;;AAMA,MAAMA,IAAgBC,EAAM;AAAA,EAC1B,CAAC,EAAE,WAAAC,GAAW,GAAGC,EAAA,GAASC,MAAQ;AAChC,UAAM,CAACC,GAAcC,CAAe,IAAIL,EAAM,SAAkB,EAAK;AAEnE,WAAA,gBAAAM,EAAC,OAAI,EAAA,WAAU,uCACb,UAAA;AAAA,MAAA,gBAAAC,EAACC,KAAM,MAAMJ,IAAe,SAAS,YAAY,KAAAD,GAAW,GAAGD,GAAO;AAAA,MACtE,gBAAAK;AAAA,QAACE;AAAA,QAAA;AAAA,UACC,MAAK;AAAA,UACL,WAAU;AAAA,UACV,SAAS,MAAMJ,EAAgB,CAACD,CAAY;AAAA,UAE3C,UAACA,IAGC,gBAAAG,EAAAG,GAAA,EAAW,WAAU,WAAU,eAAY,OAAO,CAAA,IAFlD,gBAAAH,EAAAI,GAAA,EAAQ,WAAU,WAAU,eAAY,OAAO,CAAA;AAAA,QAEG;AAAA,MAAA;AAAA,IAEvD,GACF;AAAA,EAAA;AAGN;AACAZ,EAAc,cAAc;"}
+{"version":3,"file":"password-input.es.js","sources":["../../../lib/components/ui/password-input.tsx"],"sourcesContent":["import * as React from \"react\";\n\nimport { EyeIcon, EyeOffIcon } from \"lucide-react\";\nimport { Input, InputProps } from \"./input\";\nimport { Button } from \"./button\";\n\nconst PasswordInput = React.forwardRef<HTMLInputElement, InputProps>(\n  ({ className, ...props }, ref) => {\n    const [showPassword, setShowPassword] = React.useState<boolean>(false);\n    return (\n      <div className=\"flex flex-row items-center relative\">\n        <Input type={showPassword ? \"text\" : \"password\"} ref={ref} {...props} />\n        <Button\n          type=\"button\"\n          className=\"absolute right-0 top-0 rounded-md bg-transparent p-2 text-muted-foreground hover:bg-muted/5 focus:outline-none\"\n          onClick={() => setShowPassword(!showPassword)}\n        >\n          {!showPassword ? (\n            <EyeIcon className=\"h-4 w-4\" aria-hidden=\"true\" />\n          ) : (\n            <EyeOffIcon className=\"h-4 w-4\" aria-hidden=\"true\" />\n          )}\n        </Button>\n      </div>\n    );\n  }\n);\nPasswordInput.displayName = \"PasswordInput\";\n\nexport { PasswordInput };\n"],"names":["PasswordInput","React","className","props","ref","showPassword","setShowPassword","jsxs","jsx","Input","Button","EyeOffIcon","EyeIcon"],"mappings":";;;;;AAMA,MAAMA,IAAgBC,EAAM;AAAA,EAC1B,CAAC,EAAE,WAAAC,GAAW,GAAGC,EAAA,GAASC,MAAQ;AAChC,UAAM,CAACC,GAAcC,CAAe,IAAIL,EAAM,SAAkB,EAAK;AAEnE,WAAA,gBAAAM,EAAC,OAAI,EAAA,WAAU,uCACb,UAAA;AAAA,MAAA,gBAAAC,EAACC,KAAM,MAAMJ,IAAe,SAAS,YAAY,KAAAD,GAAW,GAAGD,GAAO;AAAA,MACtE,gBAAAK;AAAA,QAACE;AAAA,QAAA;AAAA,UACC,MAAK;AAAA,UACL,WAAU;AAAA,UACV,SAAS,MAAMJ,EAAgB,CAACD,CAAY;AAAA,UAE3C,UAACA,IAGC,gBAAAG,EAAAG,GAAA,EAAW,WAAU,WAAU,eAAY,OAAO,CAAA,IAFlD,gBAAAH,EAAAI,GAAA,EAAQ,WAAU,WAAU,eAAY,OAAO,CAAA;AAAA,QAEG;AAAA,MAAA;AAAA,IAEvD,GACF;AAAA,EAAA;AAGN;AACAZ,EAAc,cAAc;"}

package/dist/components/ui/sonner.es.js

@@ -0,0 +1,21 @@
+import { jsx as o } from "react/jsx-runtime";
+import { Toaster as r } from "sonner";
+const s = ({ ...t }) => /* @__PURE__ */ o(
+  r,
+  {
+    className: "toaster group",
+    toastOptions: {
+      classNames: {
+        toast: "group toast group-[.toaster]:bg-background group-[.toaster]:text-foreground group-[.toaster]:border-border group-[.toaster]:shadow-lg",
+        description: "group-[.toast]:text-muted-foreground",
+        actionButton: "group-[.toast]:bg-primary group-[.toast]:text-primary-foreground",
+        cancelButton: "group-[.toast]:bg-muted group-[.toast]:text-muted-foreground"
+      }
+    },
+    ...t
+  }
+);
+export {
+  s as Toaster
+};
+//# sourceMappingURL=sonner.es.js.map

package/dist/components/ui/sonner.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"sonner.es.js","sources":["../../../lib/components/ui/sonner.tsx"],"sourcesContent":["import { Toaster as Sonner } from \"sonner\"\n\ntype ToasterProps = React.ComponentProps<typeof Sonner>\n\nconst Toaster = ({ ...props }: ToasterProps) => {\n\n\n  return (\n    <Sonner\n      className=\"toaster group\"\n      toastOptions={{\n        classNames: {\n          toast:\n            \"group toast group-[.toaster]:bg-background group-[.toaster]:text-foreground group-[.toaster]:border-border group-[.toaster]:shadow-lg\",\n          description: \"group-[.toast]:text-muted-foreground\",\n          actionButton:\n            \"group-[.toast]:bg-primary group-[.toast]:text-primary-foreground\",\n          cancelButton:\n            \"group-[.toast]:bg-muted group-[.toast]:text-muted-foreground\",\n        },\n      }}\n      {...props}\n    />\n  )\n}\n\nexport { Toaster }\n"],"names":["Toaster","props","jsx","Sonner"],"mappings":";;AAIA,MAAMA,IAAU,CAAC,EAAE,GAAGC,QAIlB,gBAAAC;AAAA,EAACC;AAAAA,EAAA;AAAA,IACC,WAAU;AAAA,IACV,cAAc;AAAA,MACZ,YAAY;AAAA,QACV,OACE;AAAA,QACF,aAAa;AAAA,QACb,cACE;AAAA,QACF,cACE;AAAA,MAAA;AAAA,IAEN;AAAA,IACC,GAAGF;AAAA,EAAA;AACN;"}

package/dist/index.es.d.ts

@@ -1,3 +1,4 @@
+import * as AccordionPrimitive from '@radix-ui/react-accordion';
 import { AllowInDimension } from 'recharts/types/util/types';
 import { AnimationDuration } from 'recharts/types/util/types';
 import { AnimationTiming } from 'recharts/types/util/types';
@@ -22,6 +23,7 @@ import { JSX as JSX_2 } from 'react/jsx-runtime';
 import * as LabelPrimitive from '@radix-ui/react-label';
 import { LucideIcon } from 'lucide-react';
 import { NameType } from 'recharts/types/component/DefaultTooltipContent';
+import * as NavigationMenuPrimitive from '@radix-ui/react-navigation-menu';
 import { Payload } from 'recharts/types/component/DefaultTooltipContent';
 import * as PopoverPrimitive from '@radix-ui/react-popover';
 import * as RadioGroupPrimitive from '@radix-ui/react-radio-group';
@@ -32,11 +34,20 @@ import * as SelectPrimitive from '@radix-ui/react-select';
 import * as SeparatorPrimitive from '@radix-ui/react-separator';
 import { SeparatorProps } from '@radix-ui/react-separator';
 import { SlotProps } from '@radix-ui/react-slot';
+import { Toaster as Toaster_2 } from 'sonner';
 import * as TooltipPrimitive from '@radix-ui/react-tooltip';
 import { UniqueOption } from 'recharts/types/util/payload/getUniqPayload';
 import { ValueType } from 'recharts/types/component/DefaultTooltipContent';
 import { VariantProps } from 'class-variance-authority';
 
+export declare const Accordion: React_2.ForwardRefExoticComponent<(AccordionPrimitive.AccordionSingleProps | AccordionPrimitive.AccordionMultipleProps) & React_2.RefAttributes<HTMLDivElement>>;
+
+export declare const AccordionContent: React_2.ForwardRefExoticComponent<Omit<AccordionPrimitive.AccordionContentProps & React_2.RefAttributes<HTMLDivElement>, "ref"> & React_2.RefAttributes<HTMLDivElement>>;
+
+export declare const AccordionItem: React_2.ForwardRefExoticComponent<Omit<AccordionPrimitive.AccordionItemProps & React_2.RefAttributes<HTMLDivElement>, "ref"> & React_2.RefAttributes<HTMLDivElement>>;
+
+export declare const AccordionTrigger: React_2.ForwardRefExoticComponent<Omit<AccordionPrimitive.AccordionTriggerProps & React_2.RefAttributes<HTMLButtonElement>, "ref"> & React_2.RefAttributes<HTMLButtonElement>>;
+
 export declare function Badge({ className, variant, ...props }: BadgeProps): JSX_2.Element;
 
 export declare interface BadgeProps extends React_2.HTMLAttributes<HTMLDivElement>, VariantProps<typeof badgeVariants> {
@@ -356,6 +367,26 @@ declare interface LoaderProps {
     className?: string;
 }
 
+export declare const NavigationMenu: React_2.ForwardRefExoticComponent<Omit<NavigationMenuPrimitive.NavigationMenuProps & React_2.RefAttributes<HTMLElement>, "ref"> & React_2.RefAttributes<HTMLElement>>;
+
+export declare const NavigationMenuContent: React_2.ForwardRefExoticComponent<Omit<NavigationMenuPrimitive.NavigationMenuContentProps & React_2.RefAttributes<HTMLDivElement>, "ref"> & React_2.RefAttributes<HTMLDivElement>>;
+
+export declare const NavigationMenuIndicator: React_2.ForwardRefExoticComponent<Omit<NavigationMenuPrimitive.NavigationMenuIndicatorProps & React_2.RefAttributes<HTMLDivElement>, "ref"> & React_2.RefAttributes<HTMLDivElement>>;
+
+export declare const NavigationMenuItem: React_2.ForwardRefExoticComponent<NavigationMenuPrimitive.NavigationMenuItemProps & React_2.RefAttributes<HTMLLIElement>>;
+
+export declare const NavigationMenuLink: React_2.ForwardRefExoticComponent<NavigationMenuPrimitive.NavigationMenuLinkProps & React_2.RefAttributes<HTMLAnchorElement>>;
+
+export declare const NavigationMenuList: React_2.ForwardRefExoticComponent<Omit<NavigationMenuPrimitive.NavigationMenuListProps & React_2.RefAttributes<HTMLUListElement>, "ref"> & React_2.RefAttributes<HTMLUListElement>>;
+
+export declare const NavigationMenuListItem: React_2.ForwardRefExoticComponent<Omit<React_2.DetailedHTMLProps<React_2.AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>, "ref"> & React_2.RefAttributes<HTMLAnchorElement>>;
+
+export declare const NavigationMenuTrigger: React_2.ForwardRefExoticComponent<Omit<NavigationMenuPrimitive.NavigationMenuTriggerProps & React_2.RefAttributes<HTMLButtonElement>, "ref"> & React_2.RefAttributes<HTMLButtonElement>>;
+
+export declare const navigationMenuTriggerStyle: (props?: ClassProp | undefined) => string;
+
+export declare const NavigationMenuViewport: React_2.ForwardRefExoticComponent<Omit<NavigationMenuPrimitive.NavigationMenuViewportProps & React_2.RefAttributes<HTMLDivElement>, "ref"> & React_2.RefAttributes<HTMLDivElement>>;
+
 export declare const Pagination: {
     ({ className, ...props }: React_2.ComponentProps<"nav">): JSX_2.Element;
     displayName: string;
@@ -567,6 +598,10 @@ declare const THEMES: {
     readonly dark: ".dark";
 };
 
+export declare const Toaster: ({ ...props }: ToasterProps) => JSX_2.Element;
+
+declare type ToasterProps = React.ComponentProps<typeof Toaster_2>;
+
 export declare const Tooltip: React_2.FC<TooltipPrimitive.TooltipProps>;
 
 export declare const TooltipContent: React_2.ForwardRefExoticComponent<Omit<TooltipPrimitive.TooltipContentProps & React_2.RefAttributes<HTMLDivElement>, "ref"> & React_2.RefAttributes<HTMLDivElement>>;

package/dist/index.es.js

@@ -1,61 +1,68 @@
 import { Badge as r, badgeVariants as t } from "./components/ui/badge.es.js";
-import { Breadcrumb as n, BreadcrumbEllipsis as i, BreadcrumbItem as p, BreadcrumbLink as d, BreadcrumbList as l, BreadcrumbPage as m, BreadcrumbSeparator as u } from "./components/ui/breadcrumb.es.js";
-import { Button as b, buttonVariants as C } from "./components/ui/button.es.js";
+import { Breadcrumb as n, BreadcrumbEllipsis as i, BreadcrumbItem as d, BreadcrumbLink as p, BreadcrumbList as l, BreadcrumbPage as m, BreadcrumbSeparator as u } from "./components/ui/breadcrumb.es.js";
+import { Button as g, buttonVariants as b } from "./components/ui/button.es.js";
 import { Calendar as c } from "./components/ui/calendar.es.js";
-import { Card as D, CardContent as f, CardDescription as s, CardFooter as M, CardHeader as T, CardTitle as h } from "./components/ui/card.es.js";
-import { ChartContainer as w, ChartLegend as I, ChartLegendContent as B, ChartStyle as F, ChartTooltip as L, ChartTooltipContent as G } from "./components/ui/chart.es.js";
-import { Checkbox as k } from "./components/ui/checkbox.es.js";
-import { Collapsible as R, CollapsibleContent as y, CollapsibleTrigger as A } from "./components/ui/collapsible.es.js";
-import { Command as V, CommandDialog as O, CommandEmpty as N, CommandGroup as U, CommandInput as j, CommandItem as q, CommandList as z, CommandSeparator as J, CommandShortcut as K } from "./components/ui/command.es.js";
+import { Card as x, CardContent as f, CardDescription as D, CardFooter as s, CardHeader as T, CardTitle as h } from "./components/ui/card.es.js";
+import { ChartContainer as v, ChartLegend as w, ChartLegendContent as P, ChartStyle as B, ChartTooltip as F, ChartTooltipContent as L } from "./components/ui/chart.es.js";
+import { Checkbox as N } from "./components/ui/checkbox.es.js";
+import { Collapsible as A, CollapsibleContent as y, CollapsibleTrigger as H } from "./components/ui/collapsible.es.js";
+import { Command as V, CommandDialog as E, CommandEmpty as O, CommandGroup as U, CommandInput as j, CommandItem as q, CommandList as z, CommandSeparator as J, CommandShortcut as K } from "./components/ui/command.es.js";
 import { Dialog as W, DialogClose as X, DialogContent as Y, DialogDescription as Z, DialogFooter as _, DialogHeader as $, DialogOverlay as ee, DialogPortal as oe, DialogTitle as re, DialogTrigger as te } from "./components/ui/dialog.es.js";
-import { DropdownMenu as ne, DropdownMenuCheckboxItem as ie, DropdownMenuContent as pe, DropdownMenuGroup as de, DropdownMenuItem as le, DropdownMenuLabel as me, DropdownMenuPortal as ue, DropdownMenuRadioGroup as Se, DropdownMenuRadioItem as be, DropdownMenuSeparator as Ce, DropdownMenuShortcut as ge, DropdownMenuSub as ce, DropdownMenuSubContent as xe, DropdownMenuSubTrigger as De, DropdownMenuTrigger as fe } from "./components/ui/dropdown-menu.es.js";
-import { Form as Me, FormControl as Te, FormDescription as he, FormField as Pe, FormItem as we, FormLabel as Ie, FormMessage as Be, useFormField as Fe } from "./components/ui/form.es.js";
-import { Input as Ge } from "./components/ui/input.es.js";
-import { Label as ke } from "./components/ui/label.es.js";
-import { Loader as Re } from "./components/ui/loader.es.js";
-import { Pagination as Ae, PaginationContent as Ee, PaginationEllipsis as Ve, PaginationItem as Oe, PaginationLink as Ne, PaginationNext as Ue, PaginationPrevious as je } from "./components/ui/pagination.es.js";
+import { DropdownMenu as ne, DropdownMenuCheckboxItem as ie, DropdownMenuContent as de, DropdownMenuGroup as pe, DropdownMenuItem as le, DropdownMenuLabel as me, DropdownMenuPortal as ue, DropdownMenuRadioGroup as Se, DropdownMenuRadioItem as ge, DropdownMenuSeparator as be, DropdownMenuShortcut as Ce, DropdownMenuSub as ce, DropdownMenuSubContent as Me, DropdownMenuSubTrigger as xe, DropdownMenuTrigger as fe } from "./components/ui/dropdown-menu.es.js";
+import { Form as se, FormControl as Te, FormDescription as he, FormField as Ie, FormItem as ve, FormLabel as we, FormMessage as Pe, useFormField as Be } from "./components/ui/form.es.js";
+import { Input as Le } from "./components/ui/input.es.js";
+import { Label as Ne } from "./components/ui/label.es.js";
+import { Loader as Ae } from "./components/ui/loader.es.js";
+import { Pagination as He, PaginationContent as Re, PaginationEllipsis as Ve, PaginationItem as Ee, PaginationLink as Oe, PaginationNext as Ue, PaginationPrevious as je } from "./components/ui/pagination.es.js";
 import { PasswordInput as ze } from "./components/ui/password-input.es.js";
 import { Popover as Ke, PopoverAnchor as Qe, PopoverContent as We, PopoverTrigger as Xe } from "./components/ui/popover.es.js";
 import { RadioGroup as Ze, RadioGroupItem as _e } from "./components/ui/radio-group.es.js";
 import { Select as eo, SelectContent as oo, SelectGroup as ro, SelectItem as to, SelectLabel as ao, SelectScrollDownButton as no, SelectScrollUpButton as io, SelectSeparator as po, SelectTrigger as lo, SelectValue as mo } from "./components/ui/select.es.js";
 import { Separator as So } from "./components/ui/separator.es.js";
-import { Sheet as Co, SheetClose as go, SheetContent as co, SheetDescription as xo, SheetFooter as Do, SheetHeader as fo, SheetOverlay as so, SheetPortal as Mo, SheetTitle as To, SheetTrigger as ho } from "./components/ui/sheet.es.js";
-import { Sidebar as wo, SidebarContent as Io, SidebarFooter as Bo, SidebarGroup as Fo, SidebarGroupAction as Lo, SidebarGroupContent as Go, SidebarGroupLabel as vo, SidebarHeader as ko, SidebarInput as Ho, SidebarInset as Ro, SidebarMenu as yo, SidebarMenuAction as Ao, SidebarMenuBadge as Eo, SidebarMenuButton as Vo, SidebarMenuItem as Oo, SidebarMenuSkeleton as No, SidebarMenuSub as Uo, SidebarMenuSubButton as jo, SidebarMenuSubItem as qo, SidebarProvider as zo, SidebarRail as Jo, SidebarSeparator as Ko, SidebarTrigger as Qo, useSidebar as Wo } from "./components/ui/sidebar.es.js";
+import { Sheet as bo, SheetClose as Co, SheetContent as co, SheetDescription as Mo, SheetFooter as xo, SheetHeader as fo, SheetOverlay as Do, SheetPortal as so, SheetTitle as To, SheetTrigger as ho } from "./components/ui/sheet.es.js";
+import { Sidebar as vo, SidebarContent as wo, SidebarFooter as Po, SidebarGroup as Bo, SidebarGroupAction as Fo, SidebarGroupContent as Lo, SidebarGroupLabel as Go, SidebarHeader as No, SidebarInput as ko, SidebarInset as Ao, SidebarMenu as yo, SidebarMenuAction as Ho, SidebarMenuBadge as Ro, SidebarMenuButton as Vo, SidebarMenuItem as Eo, SidebarMenuSkeleton as Oo, SidebarMenuSub as Uo, SidebarMenuSubButton as jo, SidebarMenuSubItem as qo, SidebarProvider as zo, SidebarRail as Jo, SidebarSeparator as Ko, SidebarTrigger as Qo, useSidebar as Wo } from "./components/ui/sidebar.es.js";
 import { Skeleton as Yo } from "./components/ui/skeleton.es.js";
 import { Table as _o, TableBody as $o, TableCaption as er, TableCell as or, TableFooter as rr, TableHead as tr, TableHeader as ar, TableRow as nr } from "./components/ui/table.es.js";
-import { Tooltip as pr, TooltipContent as dr, TooltipProvider as lr, TooltipTrigger as mr } from "./components/ui/tooltip.es.js";
-import { useIsMobile as Sr } from "./hooks/use-mobile.es.js";
-import { cn as Cr } from "./utils/index.es.js";
+import { Tooltip as dr, TooltipContent as pr, TooltipProvider as lr, TooltipTrigger as mr } from "./components/ui/tooltip.es.js";
+import { Accordion as Sr, AccordionContent as gr, AccordionItem as br, AccordionTrigger as Cr } from "./components/ui/accordion.es.js";
+import { NavigationMenu as Mr, NavigationMenuContent as xr, NavigationMenuIndicator as fr, NavigationMenuItem as Dr, NavigationMenuLink as sr, NavigationMenuList as Tr, NavigationMenuListItem as hr, NavigationMenuTrigger as Ir, NavigationMenuViewport as vr, navigationMenuTriggerStyle as wr } from "./components/ui/navigation-menu.es.js";
+import { Toaster as Br } from "./components/ui/sonner.es.js";
+import { useIsMobile as Lr } from "./hooks/use-mobile.es.js";
+import { cn as Nr } from "./utils/index.es.js";
 export {
+  Sr as Accordion,
+  gr as AccordionContent,
+  br as AccordionItem,
+  Cr as AccordionTrigger,
   r as Badge,
   n as Breadcrumb,
   i as BreadcrumbEllipsis,
-  p as BreadcrumbItem,
-  d as BreadcrumbLink,
+  d as BreadcrumbItem,
+  p as BreadcrumbLink,
   l as BreadcrumbList,
   m as BreadcrumbPage,
   u as BreadcrumbSeparator,
-  b as Button,
+  g as Button,
   c as Calendar,
-  D as Card,
+  x as Card,
   f as CardContent,
-  s as CardDescription,
-  M as CardFooter,
+  D as CardDescription,
+  s as CardFooter,
   T as CardHeader,
   h as CardTitle,
-  w as ChartContainer,
-  I as ChartLegend,
-  B as ChartLegendContent,
-  F as ChartStyle,
-  L as ChartTooltip,
-  G as ChartTooltipContent,
-  k as Checkbox,
-  R as Collapsible,
+  v as ChartContainer,
+  w as ChartLegend,
+  P as ChartLegendContent,
+  B as ChartStyle,
+  F as ChartTooltip,
+  L as ChartTooltipContent,
+  N as Checkbox,
+  A as Collapsible,
   y as CollapsibleContent,
-  A as CollapsibleTrigger,
+  H as CollapsibleTrigger,
   V as Command,
-  O as CommandDialog,
-  N as CommandEmpty,
+  E as CommandDialog,
+  O as CommandEmpty,
   U as CommandGroup,
   j as CommandInput,
   q as CommandItem,
@@ -74,34 +81,43 @@ export {
   te as DialogTrigger,
   ne as DropdownMenu,
   ie as DropdownMenuCheckboxItem,
-  pe as DropdownMenuContent,
-  de as DropdownMenuGroup,
+  de as DropdownMenuContent,
+  pe as DropdownMenuGroup,
   le as DropdownMenuItem,
   me as DropdownMenuLabel,
   ue as DropdownMenuPortal,
   Se as DropdownMenuRadioGroup,
-  be as DropdownMenuRadioItem,
-  Ce as DropdownMenuSeparator,
-  ge as DropdownMenuShortcut,
+  ge as DropdownMenuRadioItem,
+  be as DropdownMenuSeparator,
+  Ce as DropdownMenuShortcut,
   ce as DropdownMenuSub,
-  xe as DropdownMenuSubContent,
-  De as DropdownMenuSubTrigger,
+  Me as DropdownMenuSubContent,
+  xe as DropdownMenuSubTrigger,
   fe as DropdownMenuTrigger,
-  Me as Form,
+  se as Form,
   Te as FormControl,
   he as FormDescription,
-  Pe as FormField,
-  we as FormItem,
-  Ie as FormLabel,
-  Be as FormMessage,
-  Ge as Input,
-  ke as Label,
-  Re as Loader,
-  Ae as Pagination,
-  Ee as PaginationContent,
+  Ie as FormField,
+  ve as FormItem,
+  we as FormLabel,
+  Pe as FormMessage,
+  Le as Input,
+  Ne as Label,
+  Ae as Loader,
+  Mr as NavigationMenu,
+  xr as NavigationMenuContent,
+  fr as NavigationMenuIndicator,
+  Dr as NavigationMenuItem,
+  sr as NavigationMenuLink,
+  Tr as NavigationMenuList,
+  hr as NavigationMenuListItem,
+  Ir as NavigationMenuTrigger,
+  vr as NavigationMenuViewport,
+  He as Pagination,
+  Re as PaginationContent,
   Ve as PaginationEllipsis,
-  Oe as PaginationItem,
-  Ne as PaginationLink,
+  Ee as PaginationItem,
+  Oe as PaginationLink,
   Ue as PaginationNext,
   je as PaginationPrevious,
   ze as PasswordInput,
@@ -122,32 +138,32 @@ export {
   lo as SelectTrigger,
   mo as SelectValue,
   So as Separator,
-  Co as Sheet,
-  go as SheetClose,
+  bo as Sheet,
+  Co as SheetClose,
   co as SheetContent,
-  xo as SheetDescription,
-  Do as SheetFooter,
+  Mo as SheetDescription,
+  xo as SheetFooter,
   fo as SheetHeader,
-  so as SheetOverlay,
-  Mo as SheetPortal,
+  Do as SheetOverlay,
+  so as SheetPortal,
   To as SheetTitle,
   ho as SheetTrigger,
-  wo as Sidebar,
-  Io as SidebarContent,
-  Bo as SidebarFooter,
-  Fo as SidebarGroup,
-  Lo as SidebarGroupAction,
-  Go as SidebarGroupContent,
-  vo as SidebarGroupLabel,
-  ko as SidebarHeader,
-  Ho as SidebarInput,
-  Ro as SidebarInset,
+  vo as Sidebar,
+  wo as SidebarContent,
+  Po as SidebarFooter,
+  Bo as SidebarGroup,
+  Fo as SidebarGroupAction,
+  Lo as SidebarGroupContent,
+  Go as SidebarGroupLabel,
+  No as SidebarHeader,
+  ko as SidebarInput,
+  Ao as SidebarInset,
   yo as SidebarMenu,
-  Ao as SidebarMenuAction,
-  Eo as SidebarMenuBadge,
+  Ho as SidebarMenuAction,
+  Ro as SidebarMenuBadge,
   Vo as SidebarMenuButton,
-  Oo as SidebarMenuItem,
-  No as SidebarMenuSkeleton,
+  Eo as SidebarMenuItem,
+  Oo as SidebarMenuSkeleton,
   Uo as SidebarMenuSub,
   jo as SidebarMenuSubButton,
   qo as SidebarMenuSubItem,
@@ -164,15 +180,17 @@ export {
   tr as TableHead,
   ar as TableHeader,
   nr as TableRow,
-  pr as Tooltip,
-  dr as TooltipContent,
+  Br as Toaster,
+  dr as Tooltip,
+  pr as TooltipContent,
   lr as TooltipProvider,
   mr as TooltipTrigger,
   t as badgeVariants,
-  C as buttonVariants,
-  Cr as cn,
-  Fe as useFormField,
-  Sr as useIsMobile,
+  b as buttonVariants,
+  Nr as cn,
+  wr as navigationMenuTriggerStyle,
+  Be as useFormField,
+  Lr as useIsMobile,
   Wo as useSidebar
 };
 //# sourceMappingURL=index.es.js.map

package/dist/index.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.es.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"index.es.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/lib/index.css

@@ -20,10 +20,10 @@
   --secondary-foreground: var(--secondary-2);
 
   --muted: var(--neutral-7);
-  --muted-foreground: var(--neutral-3);
+  --muted-foreground: var(--neutral-4);
 
-  --accent: var(--neutral-8);
-  --accent-foreground: var(--neutral-2);
+  --accent: var(--neutral-7);
+  --accent-foreground: var(--neutral-4);
 
   --destructive: var(--destructive-8);
   --destructive-foreground: var(--destructive-2);
@@ -31,9 +31,9 @@
   --success: var(--success-8);
   --succcess-foreground: var(--success-2);
 
-  --border: var(--muted);
-  --input: var(--muted);
-  --ring: var(--muted-foreground);
+  --border: var(--neutral-3);
+  --input: var(--border);
+  --ring: var(--neutral-5);
 
   --chart-1: var(--primary-5);
   --chart-2: var(--primary-4);
@@ -41,7 +41,7 @@
   --chart-4: var(--secondary-4);
   --chart-5: var(--secondary-2);
 
-  --radius: 0rem;
+  --radius: 0.25rem;
 
   --sidebar-background: var(--background);
   --sidebar-foreground: var(--foreground);
@@ -61,8 +61,46 @@
     @apply border-border;
   }
 
+  a {
+    @apply link;
+  }
+
+  h1 {
+    @apply text-heading-1 my-v3;
+  }
+
+  h2 {
+    @apply text-heading-2 mt-v4 mb-v5;
+  }
+
+  h3 {
+    @apply text-heading-3 mt-v3 mb-v5;
+  }
+
+  h4 {
+    @apply text-heading-4 mt-v4 mb-v5;
+  }
+
+  h5 {
+    @apply text-heading-5 mt-v4 mb-v5;
+  }
+
+  h6 {
+    @apply text-heading-6 mt-v4 mb-v5;
+  }
+
+  p {
+    @apply text-body my-v1;
+  }
+
   body {
     @apply bg-background text-foreground;
   }
 
+}
+
+@layer components {
+  .link {
+    @apply text-primary underline hover:underline-offset-2 hover:text-primary/70;
+  }
 }

package/lib/tokens.css

@@ -12,8 +12,8 @@
   --xprimary-6: 0.5 0.13 var(--primary-hue);
   --xprimary-7: 0.35 0.13 var(--primary-hue);
   --xprimary-8: 0.25 0.13 var(--primary-hue);
-  --xprimary-9: 0.13 0.13 var(--primary-hue);
-  --xprimary-10: 0.05 0.13 var(--primary-hue);
+  --xprimary-9: 0.20 0.09 var(--primary-hue);
+  --xprimary-10: 0.10 0.03 var(--primary-hue);
   --primary-1: var(--xprimary-1);
   --primary-2: var(--xprimary-2);
   --primary-3: var(--xprimary-3);
@@ -33,8 +33,8 @@
   --xsecondary-6: 0.5 0.13 var(--secondary-hue);
   --xsecondary-7: 0.35 0.13 var(--secondary-hue);
   --xsecondary-8: 0.25 0.13 var(--secondary-hue);
-  --xsecondary-9: 0.13 0.13 var(--secondary-hue);
-  --xsecondary-10: 0.05 0.13 var(--secondary-hue);
+  --xsecondary-9: 0.20 0.09 var(--secondary-hue);
+  --xsecondary-10: 0.10 0.03 var(--secondary-hue);
   --secondary-1: var(--xsecondary-1);
   --secondary-2: var(--xsecondary-2);
   --secondary-3: var(--xsecondary-3);
@@ -54,8 +54,8 @@
   --xdestructive-6: 0.5 0.13 var(--destructive-hue);
   --xdestructive-7: 0.35 0.13 var(--destructive-hue);
   --xdestructive-8: 0.25 0.13 var(--destructive-hue);
-  --xdestructive-9: 0.13 0.13 var(--destructive-hue);
-  --xdestructive-10: 0.05 0.13 var(--destructive-hue);
+  --xdestructive-9: 0.20 0.09 var(--destructive-hue);
+  --xdestructive-10: 0.10 0.03 var(--destructive-hue);
   --destructive-1: var(--xdestructive-1);
   --destructive-2: var(--xdestructive-2);
   --destructive-3: var(--xdestructive-3);
@@ -75,8 +75,8 @@
   --xsuccess-6: 0.5 0.13 var(--success-hue);
   --xsuccess-7: 0.35 0.13 var(--success-hue);
   --xsuccess-8: 0.25 0.13 var(--success-hue);
-  --xsuccess-9: 0.13 0.13 var(--success-hue);
-  --xsuccess-10: 0.05 0.13 var(--success-hue);
+  --xsuccess-9: 0.20 0.09 var(--success-hue);
+  --xsuccess-10: 0.10 0.03 var(--success-hue);
   --success-1: var(--xsuccess-1);
   --success-2: var(--xsuccess-2);
   --success-3: var(--xsuccess-3);
@@ -109,6 +109,15 @@
   --neutral-8: var(--xneutral-8);
   --neutral-9: var(--xneutral-9);
   --neutral-10: var(--xneutral-10);
+  /* Increase or decrease the number to change the vertical spacing globally*/
+  /* Base Vertical Spacing */
+  --space: 1.2;
+  /* Vertical Spacing - multiplier */
+  --vspace-1: calc(var(--space) * 1rem);
+  --vspace-2: calc(3 * var(--space) * 1rem);
+  --vspace-3: calc(2 * var(--space) * 1rem);
+  --vspace-4: calc(1.5 * var(--space) * 1rem);
+  --vspace-5: calc(0.5 * var(--space) * 1rem);
 }
 
 .dark {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cryptlex/web-components",
-  "version": "1.1.0",
+  "version": "1.2.1",
   "description": "React component library for Cryptlex web applications",
   "author": "Cryptlex",
   "type": "module",
@@ -42,18 +42,21 @@
     "access": "public"
   },
   "peerDependencies": {
+    "@radix-ui/react-accordion": "^1.2.1",
     "@radix-ui/react-checkbox": "^1.1.2",
     "@radix-ui/react-collapsible": "^1.1.1",
     "@radix-ui/react-dialog": "^1.1.2",
     "@radix-ui/react-dropdown-menu": "^2.1.2",
     "@radix-ui/react-icons": "^1.3.0",
     "@radix-ui/react-label": "^2.1.0",
+    "@radix-ui/react-navigation-menu": "^1.2.1",
     "@radix-ui/react-popover": "^1.1.2",
     "@radix-ui/react-radio-group": "^1.2.1",
     "@radix-ui/react-select": "^2.1.2",
     "@radix-ui/react-separator": "^1.1.0",
     "@radix-ui/react-slot": "^1.1.0",
     "@radix-ui/react-tooltip": "^1.1.3",
+    "sonner": "^1.7.0",
     "@tanstack/react-table": "^8.20.5",
     "class-variance-authority": "^0.7.0",
     "clsx": "^2.1.1",
@@ -71,15 +74,15 @@
   },
   "devDependencies": {
     "@eslint/js": "^9.11.1",
-    "@storybook/addon-docs": "^8.3.6",
-    "@storybook/addon-essentials": "^8.3.6",
-    "@storybook/addon-interactions": "^8.3.6",
-    "@storybook/addon-links": "^8.3.6",
-    "@storybook/addon-onboarding": "^8.3.6",
-    "@storybook/blocks": "^8.3.6",
-    "@storybook/react": "^8.3.6",
-    "@storybook/react-vite": "^8.3.6",
-    "@storybook/test": "^8.3.6",
+    "@storybook/addon-docs": "^8.4.2",
+    "@storybook/addon-essentials": "^8.4.2",
+    "@storybook/addon-interactions": "^8.4.2",
+    "@storybook/addon-links": "^8.4.2",
+    "@storybook/addon-onboarding": "^8.4.2",
+    "@storybook/blocks": "^8.4.2",
+    "@storybook/react": "^8.4.2",
+    "@storybook/react-vite": "^8.4.2",
+    "@storybook/test": "^8.4.2",
     "@types/node": "^22.7.8",
     "@types/react": "^18.3.10",
     "@types/react-dom": "^18.3.0",
@@ -88,11 +91,11 @@
     "eslint": "^9.11.1",
     "eslint-plugin-react-hooks": "^5.1.0-rc.0",
     "eslint-plugin-react-refresh": "^0.4.12",
-    "eslint-plugin-storybook": "^0.10.1",
+    "eslint-plugin-storybook": "^0.11.0",
     "globals": "^15.9.0",
     "postcss": "^8.4.47",
     "sass": "^1.80.6",
-    "storybook": "^8.3.6",
+    "storybook": "^8.4.2",
     "typescript": "^5.5.3",
     "typescript-eslint": "^8.7.0",
     "vite": "^5.4.8",

package/tailwind.preset.ts

@@ -1,5 +1,12 @@
 import type { Config } from 'tailwindcss';
 
+const tokenRamps = (paletteName: string) => {
+  const ramps = {};
+  for (let i = 1; i <= 10; i++) {
+    ramps[i] = `oklch(var(--${paletteName}-${i}) / <alpha-value>)`
+  }
+  return ramps;
+}
 export default {
   // Enable dark mode based on class.
   darkMode: ['class'],
@@ -12,6 +19,10 @@ export default {
       sm: 'calc(var(--radius) - 4px)',
     },
     colors: {
+      transparent: 'transparent',
+      current: 'currentColor',
+      white: '#ffffff',
+      black: '#000000',
       background: 'oklch(var(--background) / <alpha-value>)',
       foreground: 'oklch(var(--foreground) / <alpha-value>)',
       card: {
@@ -25,10 +36,15 @@ export default {
       primary: {
         DEFAULT: 'oklch(var(--primary) / <alpha-value>)',
         foreground: 'oklch(var(--primary-foreground) / <alpha-value>)',
+        ...tokenRamps('primary')
       },
       secondary: {
         DEFAULT: 'oklch(var(--secondary) / <alpha-value>)',
         foreground: 'oklch(var(--secondary-foreground) / <alpha-value>)',
+        ...tokenRamps('secondary')
+      },
+      neutral: {
+        ...tokenRamps('neutral')
       },
       muted: {
         DEFAULT: 'oklch(var(--muted) / <alpha-value>)',
@@ -41,10 +57,12 @@ export default {
       destructive: {
         DEFAULT: 'oklch(var(--destructive) / <alpha-value>)',
         foreground: 'oklch(var(--destructive-foreground) / <alpha-value>)',
+        ...tokenRamps('destructive')
       },
       success: {
         DEFAULT: 'oklch(var(--success) / <alpha-value>)',
         foreground: 'oklch(var(--success-foreground) / <alpha-value>)',
+        ...tokenRamps('success')
       },
       border: 'oklch(var(--border) / <alpha-value>)',
       input: 'oklch(var(--input) / <alpha-value>)',
@@ -69,6 +87,103 @@ export default {
         ring: 'oklch(var(--sidebar-ring) / <alpha-value>)',
       },
     },
+    extend: {
+      keyframes: {
+        'accordion-down': {
+          from: {
+            height: '0'
+          },
+          to: {
+            height: 'var(--radix-accordion-content-height)'
+          }
+        },
+        'accordion-up': {
+          from: {
+            height: 'var(--radix-accordion-content-height)'
+          },
+          to: {
+            height: '0'
+          }
+        }
+      },
+      animation: {
+        'accordion-down': 'accordion-down 0.2s ease-out',
+        'accordion-up': 'accordion-up 0.2s ease-out'
+      },
+      spacing: {
+        'v1': 'var(--vspace-1)',
+        'v2': 'var(--vspace-2)',
+        'v3': 'var(--vspace-3)',
+        'v4': 'var(--vspace-4)',
+        'v5': 'var(--vspace-5)',
+      },
+      fontSize: {
+        // text-caption
+        caption: [
+          "0.7708em",
+          {
+            lineHeight: "16px",
+            fontWeight: "400",
+          },
+        ],
+        // text-body
+        body: [
+          "14px",
+          {
+            lineHeight: "20px",
+            fontWeight: "400",
+          },
+        ],
+        // text-heading-6
+        "heading-6": [
+          "1em",
+          {
+            lineHeight: "var(--vspace-1)",
+            letterSpacing: "0em"
+          },
+        ],
+        // text-heading-5
+        "heading-5": [
+          "1.1667em",
+          {
+            lineHeight: "var(--vspace-1)"
+          },
+        ],
+        // text-heading-4
+        "heading-4": [
+          "1.3333em",
+          {
+            lineHeight: "var(--vspace-1)"
+          },
+        ],
+        // text-heading-3
+        "heading-3": [
+          "1.75em",
+          {
+            lineHeight: "1em",
+            fontWeight: "500",
+          },
+        ],
+
+        // text-heading-2
+        "heading-2": [
+          "2.6458em",
+          {
+            lineHeight: "1em",
+            fontWeight: "300",
+          },
+        ],
+
+        // text-heading-1
+        "heading-1": [
+          "5.2917em",
+          {
+            lineHeight: "calc(5.2917/var(--space) * var(--vspace-1))",
+            fontWeight: "400",
+          },
+        ],
+      },
+    }
   },
   plugins: [require('tailwindcss-animate')], // Include any plugins you need
 } satisfies Config;