@sikka/hawa 0.26.29 → 0.26.31

package/dist/navigationMenu/index.js

@@ -0,0 +1,222 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// elements/navigationMenu/index.ts
+var navigationMenu_exports = {};
+__export(navigationMenu_exports, {
+  NavigationMenu: () => NavigationMenu,
+  NavigationMenuContent: () => NavigationMenuContent,
+  NavigationMenuIndicator: () => NavigationMenuIndicator,
+  NavigationMenuItem: () => NavigationMenuItem,
+  NavigationMenuLink: () => NavigationMenuLink,
+  NavigationMenuList: () => NavigationMenuList,
+  NavigationMenuRoot: () => NavigationMenuRoot,
+  NavigationMenuTrigger: () => NavigationMenuTrigger,
+  NavigationMenuViewport: () => NavigationMenuViewport,
+  StandardNavigationMenuItem: () => StandardNavigationMenuItem,
+  navigationMenuTriggerStyle: () => navigationMenuTriggerStyle
+});
+module.exports = __toCommonJS(navigationMenu_exports);
+
+// elements/navigationMenu/NavigationMenu.tsx
+var React = __toESM(require("react"));
+var NavigationMenuPrimitive = __toESM(require("@radix-ui/react-navigation-menu"));
+var import_class_variance_authority = require("class-variance-authority");
+
+// util/index.ts
+var import_clsx = require("clsx");
+var import_tailwind_merge = require("tailwind-merge");
+function cn(...inputs) {
+  return (0, import_tailwind_merge.twMerge)((0, import_clsx.clsx)(inputs));
+}
+
+// elements/navigationMenu/NavigationMenu.tsx
+var navigationMenuTriggerStyle = (0, import_class_variance_authority.cva)(
+  "hawa-group hawa-inline-flex hawa-h-10 hawa-w-max hawa-items-center hawa-gap-1 hawa-justify-center hawa-rounded-md hawa-bg-background hawa-px-4 hawa-py-2 hawa-text-sm hawa-font-medium hawa-transition-colors hover:hawa-bg-accent hover:hawa-text-accent-foreground focus:hawa-bg-accent focus:hawa-text-accent-foreground focus:hawa-outline-none disabled:hawa-pointer-events-none disabled:hawa-opacity-50 data-[active]:hawa-bg-accent/50 "
+);
+var NavigationMenuRoot = React.forwardRef(({ className, children, viewportClassNames, ...props }, ref) => /* @__PURE__ */ React.createElement(
+  NavigationMenuPrimitive.Root,
+  {
+    ref,
+    className: cn(
+      "hawa-relative hawa-z-10 hawa-flex  hawa-flex-1 hawa-items-center hawa-justify-center",
+      // "hawa-max-w-max",
+      className
+    ),
+    ...props
+  },
+  children,
+  /* @__PURE__ */ React.createElement(NavigationMenuViewport, { className: viewportClassNames })
+));
+var NavigationMenuList = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React.createElement(
+  NavigationMenuPrimitive.List,
+  {
+    ref,
+    className: cn(
+      "hawa-group hawa-flex hawa-flex-1 hawa-list-none hawa-items-center hawa-justify-center hawa-gap-1",
+      className
+    ),
+    ...props
+  }
+));
+var NavigationMenuTrigger = React.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ React.createElement(
+  NavigationMenuPrimitive.Trigger,
+  {
+    ref,
+    className: cn(navigationMenuTriggerStyle(), "hawa-group", className),
+    ...props
+  },
+  children,
+  /* @__PURE__ */ React.createElement(
+    "svg",
+    {
+      "aria-label": "Chevron Icon",
+      xmlns: "http://www.w3.org/2000/svg",
+      width: "24",
+      height: "24",
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: "2",
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      "aria-hidden": "true",
+      className: "hawa-icon hawa-relative hawa-top-[1px] hawa-transition hawa-duration-200 group-data-[state=open]:hawa-rotate-180"
+    },
+    /* @__PURE__ */ React.createElement("path", { d: "m6 9 6 6 6-6" })
+  )
+));
+var NavigationMenuContent = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React.createElement(
+  NavigationMenuPrimitive.Content,
+  {
+    ref,
+    className: cn(
+      "hawa-absolute  hawa-left-0 hawa-top-0 hawa-w-full hawa-rounded ",
+      // "md:hawa-absolute md:hawa-w-auto  hawa-left-0 hawa-top-0 ",
+      //   animation
+      "data-[motion^=from-]:hawa-animate-in data-[motion^=to-]:hawa-animate-out data-[motion^=from-]:hawa-fade-in data-[motion^=to-]:hawa-fade-out data-[motion=from-end]:hawa-slide-in-from-right-52 data-[motion=from-start]:hawa-slide-in-from-left-52 data-[motion=to-end]:hawa-slide-out-to-right-52 data-[motion=to-start]:hawa-slide-out-to-left-52",
+      className
+    ),
+    ...props
+  }
+));
+var StandardNavigationMenuItem = ({ icon, title, subtitle, ...linkProps }) => /* @__PURE__ */ React.createElement(NavigationMenuLink, { ...linkProps }, /* @__PURE__ */ React.createElement("div", { className: "hawa-flex hawa-max-w-md hawa-cursor-pointer hawa-flex-row hawa-items-center hawa-gap-4 hawa-rounded-inner hawa-p-4 hawa-py-2 hawa-transition-all  hover:hawa-bg-muted" }, icon && icon, /* @__PURE__ */ React.createElement("div", { className: "hawa-flex hawa-flex-col" }, /* @__PURE__ */ React.createElement("h1", { className: "hawa-text-xl hawa-font-bold" }, title), /* @__PURE__ */ React.createElement("p", { className: "hawa-text-sm" }, subtitle))));
+var NavigationMenuViewport = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React.createElement(
+  "div",
+  {
+    className: cn(
+      "hawa-absolute hawa-top-full hawa-flex hawa-w-full hawa-justify-center"
+    )
+  },
+  /* @__PURE__ */ React.createElement(
+    NavigationMenuPrimitive.Viewport,
+    {
+      className: cn(
+        "hawa-origin-top-center hawa-relative hawa-mt-1.5  hawa-w-full hawa-overflow-hidden hawa-rounded-md hawa-border hawa-bg-popover hawa-text-popover-foreground hawa-shadow-lg data-[state=open]:hawa-animate-in data-[state=closed]:hawa-animate-out data-[state=closed]:hawa-zoom-out-95 data-[state=open]:hawa-zoom-in-90 ",
+        // hawa-h-[var(--radix-navigation-menu-viewport-height)]
+        // "md:hawa-w-[var(--radix-navigation-menu-viewport-width)]",
+        className
+      ),
+      style: {
+        height: "calc(var(--radix-navigation-menu-viewport-height) + 1px)"
+      },
+      ref,
+      ...props
+    }
+  )
+));
+var NavigationMenuIndicator = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React.createElement(
+  NavigationMenuPrimitive.Indicator,
+  {
+    ref,
+    className: cn(
+      "hawa-top-full hawa-z-[1] hawa-flex hawa-h-1.5 hawa-items-end hawa-justify-center hawa-overflow-hidden data-[state=visible]:hawa-animate-in data-[state=hidden]:hawa-animate-out data-[state=hidden]:hawa-fade-out data-[state=visible]:hawa-fade-in",
+      className
+    ),
+    ...props
+  },
+  /* @__PURE__ */ React.createElement("div", { className: "hawa-relative hawa-top-[60%] hawa-h-2 hawa-w-2 hawa-rotate-45 hawa-rounded-tl-sm hawa-bg-border hawa-shadow-md" })
+));
+var NavigationMenu = ({
+  viewportClassNames,
+  rootClassNames,
+  triggerClassNames,
+  actionFirst,
+  ...props
+}) => {
+  return /* @__PURE__ */ React.createElement(
+    NavigationMenuRoot,
+    {
+      dir: props.direction,
+      delayDuration: 0,
+      className: rootClassNames,
+      viewportClassNames
+    },
+    /* @__PURE__ */ React.createElement(NavigationMenuList, null, props.items.map((item, i) => /* @__PURE__ */ React.createElement(NavigationMenuItem, { key: i }, item.content ? /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(NavigationMenuTrigger, { className: cn(triggerClassNames) }, item.trigger), /* @__PURE__ */ React.createElement(NavigationMenuContent, null, item.content)) : /* @__PURE__ */ React.createElement(
+      NavigationMenuLink,
+      {
+        href: actionFirst ? void 0 : item.path,
+        onClick: () => {
+          if (item.action) {
+            item.action();
+          }
+        },
+        className: cn(
+          navigationMenuTriggerStyle(),
+          "hawa-cursor-pointer hawa-select-none",
+          triggerClassNames
+        )
+      },
+      item.trigger
+    ))))
+  );
+};
+var NavigationMenuItem = NavigationMenuPrimitive.Item;
+var NavigationMenuLink = NavigationMenuPrimitive.Link;
+NavigationMenuContent.displayName = NavigationMenuPrimitive.Content.displayName;
+NavigationMenuTrigger.displayName = NavigationMenuPrimitive.Trigger.displayName;
+NavigationMenuList.displayName = NavigationMenuPrimitive.List.displayName;
+NavigationMenuRoot.displayName = NavigationMenuPrimitive.Root.displayName;
+NavigationMenuIndicator.displayName = NavigationMenuPrimitive.Indicator.displayName;
+NavigationMenuViewport.displayName = NavigationMenuPrimitive.Viewport.displayName;
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  NavigationMenu,
+  NavigationMenuContent,
+  NavigationMenuIndicator,
+  NavigationMenuItem,
+  NavigationMenuLink,
+  NavigationMenuList,
+  NavigationMenuRoot,
+  NavigationMenuTrigger,
+  NavigationMenuViewport,
+  StandardNavigationMenuItem,
+  navigationMenuTriggerStyle
+});
+//# sourceMappingURL=index.js.map

package/dist/navigationMenu/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../elements/navigationMenu/index.ts","../../elements/navigationMenu/NavigationMenu.tsx","../../util/index.ts"],"sourcesContent":["export * from \"./NavigationMenu\";\n","import * as React from \"react\";\n\nimport * as NavigationMenuPrimitive from \"@radix-ui/react-navigation-menu\";\nimport { cva } from \"class-variance-authority\";\n\nimport { DirectionType } from \"@_types/commonTypes\";\n\nimport { cn } from \"@util/index\";\n\nconst navigationMenuTriggerStyle = cva(\n  \"hawa-group hawa-inline-flex hawa-h-10 hawa-w-max hawa-items-center hawa-gap-1 hawa-justify-center hawa-rounded-md hawa-bg-background hawa-px-4 hawa-py-2 hawa-text-sm hawa-font-medium hawa-transition-colors hover:hawa-bg-accent hover:hawa-text-accent-foreground focus:hawa-bg-accent focus:hawa-text-accent-foreground focus:hawa-outline-none disabled:hawa-pointer-events-none disabled:hawa-opacity-50 data-[active]:hawa-bg-accent/50 \"\n);\n\ntype StandardNavigationMenuItemProps = {\n  icon?: React.ReactNode;\n  title: string;\n  subtitle?: string;\n};\ntype NavigationMenuRootProps = React.ComponentPropsWithoutRef<\n  typeof NavigationMenuPrimitive.Root\n> & {\n  viewportClassNames?: string;\n};\ntype NavigationMenuItemProps = {\n  trigger: any;\n  content?: any;\n  action?: any;\n  path?: string;\n};\ntype NavigationMenuTypes = {\n  items: NavigationMenuItemProps[];\n  rootClassNames?: string;\n  viewportClassNames?: string;\n  triggerClassNames?: string;\n  actionFirst?: boolean;\n  direction?: DirectionType;\n};\n\nconst NavigationMenuRoot = React.forwardRef<\n  React.ElementRef<typeof NavigationMenuPrimitive.Root>,\n  NavigationMenuRootProps\n>(({ className, children, viewportClassNames, ...props }, ref) => (\n  <NavigationMenuPrimitive.Root\n    ref={ref}\n    className={cn(\n      \"hawa-relative hawa-z-10 hawa-flex  hawa-flex-1 hawa-items-center hawa-justify-center\",\n      // \"hawa-max-w-max\",\n      className\n    )}\n    {...props}\n  >\n    {children}\n    <NavigationMenuViewport className={viewportClassNames} />\n  </NavigationMenuPrimitive.Root>\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      \"hawa-group hawa-flex hawa-flex-1 hawa-list-none hawa-items-center hawa-justify-center hawa-gap-1\",\n      className\n    )}\n    {...props}\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(), \"hawa-group\", className)}\n    {...props}\n  >\n    {children}\n    <svg\n      aria-label=\"Chevron Icon\"\n      xmlns=\"http://www.w3.org/2000/svg\"\n      width=\"24\"\n      height=\"24\"\n      viewBox=\"0 0 24 24\"\n      fill=\"none\"\n      stroke=\"currentColor\"\n      strokeWidth=\"2\"\n      strokeLinecap=\"round\"\n      strokeLinejoin=\"round\"\n      aria-hidden=\"true\"\n      className=\"hawa-icon hawa-relative hawa-top-[1px] hawa-transition hawa-duration-200 group-data-[state=open]:hawa-rotate-180\"\n    >\n      <path d=\"m6 9 6 6 6-6\" />\n    </svg>\n  </NavigationMenuPrimitive.Trigger>\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      \"hawa-absolute  hawa-left-0 hawa-top-0 hawa-w-full hawa-rounded \",\n      // \"md:hawa-absolute md:hawa-w-auto  hawa-left-0 hawa-top-0 \",\n      //   animation\n      \"data-[motion^=from-]:hawa-animate-in data-[motion^=to-]:hawa-animate-out data-[motion^=from-]:hawa-fade-in data-[motion^=to-]:hawa-fade-out data-[motion=from-end]:hawa-slide-in-from-right-52 data-[motion=from-start]:hawa-slide-in-from-left-52 data-[motion=to-end]:hawa-slide-out-to-right-52 data-[motion=to-start]:hawa-slide-out-to-left-52\",\n      className\n    )}\n    {...props}\n  />\n));\nconst StandardNavigationMenuItem: React.FC<\n  StandardNavigationMenuItemProps &\n    React.ComponentProps<typeof NavigationMenuPrimitive.Link>\n> = ({ icon, title, subtitle, ...linkProps }) => (\n  <NavigationMenuLink {...linkProps}>\n    <div className=\"hawa-flex hawa-max-w-md hawa-cursor-pointer hawa-flex-row hawa-items-center hawa-gap-4 hawa-rounded-inner hawa-p-4 hawa-py-2 hawa-transition-all  hover:hawa-bg-muted\">\n      {icon && icon}\n      <div className=\"hawa-flex hawa-flex-col\">\n        <h1 className=\"hawa-text-xl hawa-font-bold\">{title}</h1>\n        <p className=\"hawa-text-sm\">{subtitle}</p>\n      </div>\n    </div>\n  </NavigationMenuLink>\n);\nconst NavigationMenuViewport = React.forwardRef<\n  React.ElementRef<typeof NavigationMenuPrimitive.Viewport>,\n  React.ComponentPropsWithoutRef<typeof NavigationMenuPrimitive.Viewport>\n>(({ className, ...props }, ref) => (\n  <div\n    className={cn(\n      \"hawa-absolute hawa-top-full hawa-flex hawa-w-full hawa-justify-center\"\n    )}\n  >\n    <NavigationMenuPrimitive.Viewport\n      className={cn(\n        \"hawa-origin-top-center hawa-relative hawa-mt-1.5  hawa-w-full hawa-overflow-hidden hawa-rounded-md hawa-border hawa-bg-popover hawa-text-popover-foreground hawa-shadow-lg data-[state=open]:hawa-animate-in data-[state=closed]:hawa-animate-out data-[state=closed]:hawa-zoom-out-95 data-[state=open]:hawa-zoom-in-90 \",\n        // hawa-h-[var(--radix-navigation-menu-viewport-height)]\n        // \"md:hawa-w-[var(--radix-navigation-menu-viewport-width)]\",\n        className\n      )}\n      style={{\n        height: \"calc(var(--radix-navigation-menu-viewport-height) + 1px)\"\n      }}\n      ref={ref}\n      {...props}\n    />\n  </div>\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      \"hawa-top-full hawa-z-[1] hawa-flex hawa-h-1.5 hawa-items-end hawa-justify-center hawa-overflow-hidden data-[state=visible]:hawa-animate-in data-[state=hidden]:hawa-animate-out data-[state=hidden]:hawa-fade-out data-[state=visible]:hawa-fade-in\",\n      className\n    )}\n    {...props}\n  >\n    <div className=\"hawa-relative hawa-top-[60%] hawa-h-2 hawa-w-2 hawa-rotate-45 hawa-rounded-tl-sm hawa-bg-border hawa-shadow-md\" />\n  </NavigationMenuPrimitive.Indicator>\n));\n\nconst NavigationMenu: React.FC<NavigationMenuTypes> = ({\n  viewportClassNames,\n  rootClassNames,\n  triggerClassNames,\n  actionFirst,\n  ...props\n}) => {\n  return (\n    <NavigationMenuRoot\n      dir={props.direction}\n      delayDuration={0}\n      className={rootClassNames}\n      viewportClassNames={viewportClassNames}\n    >\n      <NavigationMenuList>\n        {props.items.map((item, i) => (\n          <NavigationMenuItem key={i}>\n            {item.content ? (\n              <>\n                <NavigationMenuTrigger className={cn(triggerClassNames)}>\n                  {item.trigger}\n                </NavigationMenuTrigger>\n                <NavigationMenuContent>{item.content}</NavigationMenuContent>\n              </>\n            ) : (\n              <NavigationMenuLink\n                href={actionFirst ? undefined : item.path}\n                onClick={() => {\n                  if (item.action) {\n                    item.action();\n                  }\n                }}\n                className={cn(\n                  navigationMenuTriggerStyle(),\n                  \"hawa-cursor-pointer hawa-select-none\",\n                  triggerClassNames\n                )}\n              >\n                {item.trigger}\n              </NavigationMenuLink>\n            )}\n          </NavigationMenuItem>\n        ))}\n      </NavigationMenuList>\n    </NavigationMenuRoot>\n  );\n};\n\nconst NavigationMenuItem = NavigationMenuPrimitive.Item;\nconst NavigationMenuLink = NavigationMenuPrimitive.Link;\n\nNavigationMenuContent.displayName = NavigationMenuPrimitive.Content.displayName;\nNavigationMenuTrigger.displayName = NavigationMenuPrimitive.Trigger.displayName;\nNavigationMenuList.displayName = NavigationMenuPrimitive.List.displayName;\nNavigationMenuRoot.displayName = NavigationMenuPrimitive.Root.displayName;\nNavigationMenuIndicator.displayName =\n  NavigationMenuPrimitive.Indicator.displayName;\nNavigationMenuViewport.displayName =\n  NavigationMenuPrimitive.Viewport.displayName;\n\nexport {\n  NavigationMenuLink,\n  NavigationMenuItem,\n  NavigationMenu,\n  NavigationMenuIndicator,\n  NavigationMenuContent,\n  NavigationMenuList,\n  navigationMenuTriggerStyle,\n  NavigationMenuRoot,\n  NavigationMenuTrigger,\n  NavigationMenuViewport,\n  StandardNavigationMenuItem\n};\n","import { clsx, type ClassValue } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\nexport function cn(...inputs: ClassValue[]) {\n  return twMerge(clsx(inputs));\n}\n\ntype Palette = {\n  name: string;\n  colors: {\n    [key: number]: string;\n  };\n};\ntype Rgb = {\n  r: number;\n  g: number;\n  b: number;\n};\nfunction hexToRgb(hex: string): Rgb | null {\n  const sanitizedHex = hex.replaceAll(\"##\", \"#\");\n  const colorParts = /^#?([a-f\\d]{2})([a-f\\d]{2})([a-f\\d]{2})$/i.exec(\n    sanitizedHex\n  );\n\n  if (!colorParts) {\n    return null;\n  }\n\n  const [, r, g, b] = colorParts;\n\n  return {\n    r: parseInt(r, 16),\n    g: parseInt(g, 16),\n    b: parseInt(b, 16)\n  } as Rgb;\n}\n\nfunction rgbToHex(r: number, g: number, b: number): string {\n  const toHex = (c: number) => `0${c.toString(16)}`.slice(-2);\n  return `#${toHex(r)}${toHex(g)}${toHex(b)}`;\n}\n\nexport function getTextColor(color: string): \"#FFF\" | \"#333\" {\n  const rgbColor = hexToRgb(color);\n\n  if (!rgbColor) {\n    return \"#333\";\n  }\n\n  const { r, g, b } = rgbColor;\n  const luma = 0.2126 * r + 0.7152 * g + 0.0722 * b;\n\n  return luma < 120 ? \"#FFF\" : \"#333\";\n}\n\nfunction lighten(hex: string, intensity: number): string {\n  const color = hexToRgb(`#${hex}`);\n\n  if (!color) {\n    return \"\";\n  }\n\n  const r = Math.round(color.r + (255 - color.r) * intensity);\n  const g = Math.round(color.g + (255 - color.g) * intensity);\n  const b = Math.round(color.b + (255 - color.b) * intensity);\n\n  return rgbToHex(r, g, b);\n}\n\nfunction darken(hex: string, intensity: number): string {\n  const color = hexToRgb(hex);\n\n  if (!color) {\n    return \"\";\n  }\n\n  const r = Math.round(color.r * intensity);\n  const g = Math.round(color.g * intensity);\n  const b = Math.round(color.b * intensity);\n\n  return rgbToHex(r, g, b);\n}\nconst parseColor = (color: any) => {\n  if (color.startsWith(\"#\")) {\n    // Convert hex to RGB\n    let r = parseInt(color.slice(1, 3), 16);\n    let g = parseInt(color.slice(3, 5), 16);\n    let b = parseInt(color.slice(5, 7), 16);\n    return [r, g, b];\n  } else if (color.startsWith(\"rgb\")) {\n    // Extract RGB values from rgb() format\n    return color.match(/\\d+/g).map(Number);\n  }\n  // Default to white if format is unrecognized\n  return [255, 255, 255];\n};\nexport const calculateLuminance = (color: any) => {\n  const [r, g, b] = parseColor(color)?.map((c: any) => {\n    c /= 255;\n    return c <= 0.03928 ? c / 12.92 : ((c + 0.055) / 1.055) ** 2.4;\n  });\n  return 0.2126 * r + 0.7152 * g + 0.0722 * b;\n};\n\nfunction getPallette(baseColor: string): Palette {\n  const name = baseColor;\n\n  const response: Palette = {\n    name,\n    colors: {\n      500: `#${baseColor}`.replace(\"##\", \"#\")\n    }\n  };\n\n  const intensityMap: {\n    [key: number]: number;\n  } = {\n    50: 0.95,\n    100: 0.9,\n    200: 0.75,\n    300: 0.6,\n    400: 0.3,\n    600: 0.9,\n    700: 0.75,\n    800: 0.6,\n    900: 0.49\n  };\n\n  [50, 100, 200, 300, 400].forEach((level) => {\n    response.colors[level] = lighten(baseColor, intensityMap[level]);\n  });\n  [600, 700, 800, 900].forEach((level) => {\n    response.colors[level] = darken(baseColor, intensityMap[level]);\n  });\n\n  return response as Palette;\n}\n\nexport { getPallette };\n\n// const hexToRgb = (hex) => {\n//   let d = hex?.split(\"#\")[1];\n//   var aRgbHex = d?.match(/.{1,2}/g);\n//   var aRgb = [\n//     parseInt(aRgbHex[0], 16),\n//     parseInt(aRgbHex[1], 16),\n//     parseInt(aRgbHex[2], 16)\n//   ];\n//   return aRgb;\n// };\n// const getTextColor = (backColor) => {\n//   let rgbArray = hexToRgb(backColor);\n//   if (rgbArray[0] * 0.299 + rgbArray[1] * 0.587 + rgbArray[2] * 0.114 > 186) {\n//     return \"#000000\";\n//   } else {\n//     return \"#ffffff\";\n//   }\n// };\n// const replaceAt = function (string, index, replacement) {\n//   // if (replacement == \"\" || replacement == \" \") {\n//   //   return (\n//   //     string.substring(0, index) +\n//   //     string.substring(index + replacement.length )\n//   //   );\n//   // }\n//   const replaced = string.substring(0, index) + replacement + string.substring(index + 1)\n//   return replaced\n// };\n\n// export { hexToRgb, getTextColor, replaceAt };\n"],"mappings":"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","names":[]}

package/dist/navigationMenu/index.mjs

@@ -0,0 +1,170 @@
+import {
+  cn
+} from "../chunk-CBRGWUZG.mjs";
+
+// elements/navigationMenu/NavigationMenu.tsx
+import * as React from "react";
+import * as NavigationMenuPrimitive from "@radix-ui/react-navigation-menu";
+import { cva } from "class-variance-authority";
+var navigationMenuTriggerStyle = cva(
+  "hawa-group hawa-inline-flex hawa-h-10 hawa-w-max hawa-items-center hawa-gap-1 hawa-justify-center hawa-rounded-md hawa-bg-background hawa-px-4 hawa-py-2 hawa-text-sm hawa-font-medium hawa-transition-colors hover:hawa-bg-accent hover:hawa-text-accent-foreground focus:hawa-bg-accent focus:hawa-text-accent-foreground focus:hawa-outline-none disabled:hawa-pointer-events-none disabled:hawa-opacity-50 data-[active]:hawa-bg-accent/50 "
+);
+var NavigationMenuRoot = React.forwardRef(({ className, children, viewportClassNames, ...props }, ref) => /* @__PURE__ */ React.createElement(
+  NavigationMenuPrimitive.Root,
+  {
+    ref,
+    className: cn(
+      "hawa-relative hawa-z-10 hawa-flex  hawa-flex-1 hawa-items-center hawa-justify-center",
+      // "hawa-max-w-max",
+      className
+    ),
+    ...props
+  },
+  children,
+  /* @__PURE__ */ React.createElement(NavigationMenuViewport, { className: viewportClassNames })
+));
+var NavigationMenuList = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React.createElement(
+  NavigationMenuPrimitive.List,
+  {
+    ref,
+    className: cn(
+      "hawa-group hawa-flex hawa-flex-1 hawa-list-none hawa-items-center hawa-justify-center hawa-gap-1",
+      className
+    ),
+    ...props
+  }
+));
+var NavigationMenuTrigger = React.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ React.createElement(
+  NavigationMenuPrimitive.Trigger,
+  {
+    ref,
+    className: cn(navigationMenuTriggerStyle(), "hawa-group", className),
+    ...props
+  },
+  children,
+  /* @__PURE__ */ React.createElement(
+    "svg",
+    {
+      "aria-label": "Chevron Icon",
+      xmlns: "http://www.w3.org/2000/svg",
+      width: "24",
+      height: "24",
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: "2",
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      "aria-hidden": "true",
+      className: "hawa-icon hawa-relative hawa-top-[1px] hawa-transition hawa-duration-200 group-data-[state=open]:hawa-rotate-180"
+    },
+    /* @__PURE__ */ React.createElement("path", { d: "m6 9 6 6 6-6" })
+  )
+));
+var NavigationMenuContent = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React.createElement(
+  NavigationMenuPrimitive.Content,
+  {
+    ref,
+    className: cn(
+      "hawa-absolute  hawa-left-0 hawa-top-0 hawa-w-full hawa-rounded ",
+      // "md:hawa-absolute md:hawa-w-auto  hawa-left-0 hawa-top-0 ",
+      //   animation
+      "data-[motion^=from-]:hawa-animate-in data-[motion^=to-]:hawa-animate-out data-[motion^=from-]:hawa-fade-in data-[motion^=to-]:hawa-fade-out data-[motion=from-end]:hawa-slide-in-from-right-52 data-[motion=from-start]:hawa-slide-in-from-left-52 data-[motion=to-end]:hawa-slide-out-to-right-52 data-[motion=to-start]:hawa-slide-out-to-left-52",
+      className
+    ),
+    ...props
+  }
+));
+var StandardNavigationMenuItem = ({ icon, title, subtitle, ...linkProps }) => /* @__PURE__ */ React.createElement(NavigationMenuLink, { ...linkProps }, /* @__PURE__ */ React.createElement("div", { className: "hawa-flex hawa-max-w-md hawa-cursor-pointer hawa-flex-row hawa-items-center hawa-gap-4 hawa-rounded-inner hawa-p-4 hawa-py-2 hawa-transition-all  hover:hawa-bg-muted" }, icon && icon, /* @__PURE__ */ React.createElement("div", { className: "hawa-flex hawa-flex-col" }, /* @__PURE__ */ React.createElement("h1", { className: "hawa-text-xl hawa-font-bold" }, title), /* @__PURE__ */ React.createElement("p", { className: "hawa-text-sm" }, subtitle))));
+var NavigationMenuViewport = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React.createElement(
+  "div",
+  {
+    className: cn(
+      "hawa-absolute hawa-top-full hawa-flex hawa-w-full hawa-justify-center"
+    )
+  },
+  /* @__PURE__ */ React.createElement(
+    NavigationMenuPrimitive.Viewport,
+    {
+      className: cn(
+        "hawa-origin-top-center hawa-relative hawa-mt-1.5  hawa-w-full hawa-overflow-hidden hawa-rounded-md hawa-border hawa-bg-popover hawa-text-popover-foreground hawa-shadow-lg data-[state=open]:hawa-animate-in data-[state=closed]:hawa-animate-out data-[state=closed]:hawa-zoom-out-95 data-[state=open]:hawa-zoom-in-90 ",
+        // hawa-h-[var(--radix-navigation-menu-viewport-height)]
+        // "md:hawa-w-[var(--radix-navigation-menu-viewport-width)]",
+        className
+      ),
+      style: {
+        height: "calc(var(--radix-navigation-menu-viewport-height) + 1px)"
+      },
+      ref,
+      ...props
+    }
+  )
+));
+var NavigationMenuIndicator = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React.createElement(
+  NavigationMenuPrimitive.Indicator,
+  {
+    ref,
+    className: cn(
+      "hawa-top-full hawa-z-[1] hawa-flex hawa-h-1.5 hawa-items-end hawa-justify-center hawa-overflow-hidden data-[state=visible]:hawa-animate-in data-[state=hidden]:hawa-animate-out data-[state=hidden]:hawa-fade-out data-[state=visible]:hawa-fade-in",
+      className
+    ),
+    ...props
+  },
+  /* @__PURE__ */ React.createElement("div", { className: "hawa-relative hawa-top-[60%] hawa-h-2 hawa-w-2 hawa-rotate-45 hawa-rounded-tl-sm hawa-bg-border hawa-shadow-md" })
+));
+var NavigationMenu = ({
+  viewportClassNames,
+  rootClassNames,
+  triggerClassNames,
+  actionFirst,
+  ...props
+}) => {
+  return /* @__PURE__ */ React.createElement(
+    NavigationMenuRoot,
+    {
+      dir: props.direction,
+      delayDuration: 0,
+      className: rootClassNames,
+      viewportClassNames
+    },
+    /* @__PURE__ */ React.createElement(NavigationMenuList, null, props.items.map((item, i) => /* @__PURE__ */ React.createElement(NavigationMenuItem, { key: i }, item.content ? /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(NavigationMenuTrigger, { className: cn(triggerClassNames) }, item.trigger), /* @__PURE__ */ React.createElement(NavigationMenuContent, null, item.content)) : /* @__PURE__ */ React.createElement(
+      NavigationMenuLink,
+      {
+        href: actionFirst ? void 0 : item.path,
+        onClick: () => {
+          if (item.action) {
+            item.action();
+          }
+        },
+        className: cn(
+          navigationMenuTriggerStyle(),
+          "hawa-cursor-pointer hawa-select-none",
+          triggerClassNames
+        )
+      },
+      item.trigger
+    ))))
+  );
+};
+var NavigationMenuItem = NavigationMenuPrimitive.Item;
+var NavigationMenuLink = NavigationMenuPrimitive.Link;
+NavigationMenuContent.displayName = NavigationMenuPrimitive.Content.displayName;
+NavigationMenuTrigger.displayName = NavigationMenuPrimitive.Trigger.displayName;
+NavigationMenuList.displayName = NavigationMenuPrimitive.List.displayName;
+NavigationMenuRoot.displayName = NavigationMenuPrimitive.Root.displayName;
+NavigationMenuIndicator.displayName = NavigationMenuPrimitive.Indicator.displayName;
+NavigationMenuViewport.displayName = NavigationMenuPrimitive.Viewport.displayName;
+export {
+  NavigationMenu,
+  NavigationMenuContent,
+  NavigationMenuIndicator,
+  NavigationMenuItem,
+  NavigationMenuLink,
+  NavigationMenuList,
+  NavigationMenuRoot,
+  NavigationMenuTrigger,
+  NavigationMenuViewport,
+  StandardNavigationMenuItem,
+  navigationMenuTriggerStyle
+};
+//# sourceMappingURL=index.mjs.map

package/dist/navigationMenu/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../elements/navigationMenu/NavigationMenu.tsx"],"sourcesContent":["import * as React from \"react\";\n\nimport * as NavigationMenuPrimitive from \"@radix-ui/react-navigation-menu\";\nimport { cva } from \"class-variance-authority\";\n\nimport { DirectionType } from \"@_types/commonTypes\";\n\nimport { cn } from \"@util/index\";\n\nconst navigationMenuTriggerStyle = cva(\n  \"hawa-group hawa-inline-flex hawa-h-10 hawa-w-max hawa-items-center hawa-gap-1 hawa-justify-center hawa-rounded-md hawa-bg-background hawa-px-4 hawa-py-2 hawa-text-sm hawa-font-medium hawa-transition-colors hover:hawa-bg-accent hover:hawa-text-accent-foreground focus:hawa-bg-accent focus:hawa-text-accent-foreground focus:hawa-outline-none disabled:hawa-pointer-events-none disabled:hawa-opacity-50 data-[active]:hawa-bg-accent/50 \"\n);\n\ntype StandardNavigationMenuItemProps = {\n  icon?: React.ReactNode;\n  title: string;\n  subtitle?: string;\n};\ntype NavigationMenuRootProps = React.ComponentPropsWithoutRef<\n  typeof NavigationMenuPrimitive.Root\n> & {\n  viewportClassNames?: string;\n};\ntype NavigationMenuItemProps = {\n  trigger: any;\n  content?: any;\n  action?: any;\n  path?: string;\n};\ntype NavigationMenuTypes = {\n  items: NavigationMenuItemProps[];\n  rootClassNames?: string;\n  viewportClassNames?: string;\n  triggerClassNames?: string;\n  actionFirst?: boolean;\n  direction?: DirectionType;\n};\n\nconst NavigationMenuRoot = React.forwardRef<\n  React.ElementRef<typeof NavigationMenuPrimitive.Root>,\n  NavigationMenuRootProps\n>(({ className, children, viewportClassNames, ...props }, ref) => (\n  <NavigationMenuPrimitive.Root\n    ref={ref}\n    className={cn(\n      \"hawa-relative hawa-z-10 hawa-flex  hawa-flex-1 hawa-items-center hawa-justify-center\",\n      // \"hawa-max-w-max\",\n      className\n    )}\n    {...props}\n  >\n    {children}\n    <NavigationMenuViewport className={viewportClassNames} />\n  </NavigationMenuPrimitive.Root>\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      \"hawa-group hawa-flex hawa-flex-1 hawa-list-none hawa-items-center hawa-justify-center hawa-gap-1\",\n      className\n    )}\n    {...props}\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(), \"hawa-group\", className)}\n    {...props}\n  >\n    {children}\n    <svg\n      aria-label=\"Chevron Icon\"\n      xmlns=\"http://www.w3.org/2000/svg\"\n      width=\"24\"\n      height=\"24\"\n      viewBox=\"0 0 24 24\"\n      fill=\"none\"\n      stroke=\"currentColor\"\n      strokeWidth=\"2\"\n      strokeLinecap=\"round\"\n      strokeLinejoin=\"round\"\n      aria-hidden=\"true\"\n      className=\"hawa-icon hawa-relative hawa-top-[1px] hawa-transition hawa-duration-200 group-data-[state=open]:hawa-rotate-180\"\n    >\n      <path d=\"m6 9 6 6 6-6\" />\n    </svg>\n  </NavigationMenuPrimitive.Trigger>\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      \"hawa-absolute  hawa-left-0 hawa-top-0 hawa-w-full hawa-rounded \",\n      // \"md:hawa-absolute md:hawa-w-auto  hawa-left-0 hawa-top-0 \",\n      //   animation\n      \"data-[motion^=from-]:hawa-animate-in data-[motion^=to-]:hawa-animate-out data-[motion^=from-]:hawa-fade-in data-[motion^=to-]:hawa-fade-out data-[motion=from-end]:hawa-slide-in-from-right-52 data-[motion=from-start]:hawa-slide-in-from-left-52 data-[motion=to-end]:hawa-slide-out-to-right-52 data-[motion=to-start]:hawa-slide-out-to-left-52\",\n      className\n    )}\n    {...props}\n  />\n));\nconst StandardNavigationMenuItem: React.FC<\n  StandardNavigationMenuItemProps &\n    React.ComponentProps<typeof NavigationMenuPrimitive.Link>\n> = ({ icon, title, subtitle, ...linkProps }) => (\n  <NavigationMenuLink {...linkProps}>\n    <div className=\"hawa-flex hawa-max-w-md hawa-cursor-pointer hawa-flex-row hawa-items-center hawa-gap-4 hawa-rounded-inner hawa-p-4 hawa-py-2 hawa-transition-all  hover:hawa-bg-muted\">\n      {icon && icon}\n      <div className=\"hawa-flex hawa-flex-col\">\n        <h1 className=\"hawa-text-xl hawa-font-bold\">{title}</h1>\n        <p className=\"hawa-text-sm\">{subtitle}</p>\n      </div>\n    </div>\n  </NavigationMenuLink>\n);\nconst NavigationMenuViewport = React.forwardRef<\n  React.ElementRef<typeof NavigationMenuPrimitive.Viewport>,\n  React.ComponentPropsWithoutRef<typeof NavigationMenuPrimitive.Viewport>\n>(({ className, ...props }, ref) => (\n  <div\n    className={cn(\n      \"hawa-absolute hawa-top-full hawa-flex hawa-w-full hawa-justify-center\"\n    )}\n  >\n    <NavigationMenuPrimitive.Viewport\n      className={cn(\n        \"hawa-origin-top-center hawa-relative hawa-mt-1.5  hawa-w-full hawa-overflow-hidden hawa-rounded-md hawa-border hawa-bg-popover hawa-text-popover-foreground hawa-shadow-lg data-[state=open]:hawa-animate-in data-[state=closed]:hawa-animate-out data-[state=closed]:hawa-zoom-out-95 data-[state=open]:hawa-zoom-in-90 \",\n        // hawa-h-[var(--radix-navigation-menu-viewport-height)]\n        // \"md:hawa-w-[var(--radix-navigation-menu-viewport-width)]\",\n        className\n      )}\n      style={{\n        height: \"calc(var(--radix-navigation-menu-viewport-height) + 1px)\"\n      }}\n      ref={ref}\n      {...props}\n    />\n  </div>\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      \"hawa-top-full hawa-z-[1] hawa-flex hawa-h-1.5 hawa-items-end hawa-justify-center hawa-overflow-hidden data-[state=visible]:hawa-animate-in data-[state=hidden]:hawa-animate-out data-[state=hidden]:hawa-fade-out data-[state=visible]:hawa-fade-in\",\n      className\n    )}\n    {...props}\n  >\n    <div className=\"hawa-relative hawa-top-[60%] hawa-h-2 hawa-w-2 hawa-rotate-45 hawa-rounded-tl-sm hawa-bg-border hawa-shadow-md\" />\n  </NavigationMenuPrimitive.Indicator>\n));\n\nconst NavigationMenu: React.FC<NavigationMenuTypes> = ({\n  viewportClassNames,\n  rootClassNames,\n  triggerClassNames,\n  actionFirst,\n  ...props\n}) => {\n  return (\n    <NavigationMenuRoot\n      dir={props.direction}\n      delayDuration={0}\n      className={rootClassNames}\n      viewportClassNames={viewportClassNames}\n    >\n      <NavigationMenuList>\n        {props.items.map((item, i) => (\n          <NavigationMenuItem key={i}>\n            {item.content ? (\n              <>\n                <NavigationMenuTrigger className={cn(triggerClassNames)}>\n                  {item.trigger}\n                </NavigationMenuTrigger>\n                <NavigationMenuContent>{item.content}</NavigationMenuContent>\n              </>\n            ) : (\n              <NavigationMenuLink\n                href={actionFirst ? undefined : item.path}\n                onClick={() => {\n                  if (item.action) {\n                    item.action();\n                  }\n                }}\n                className={cn(\n                  navigationMenuTriggerStyle(),\n                  \"hawa-cursor-pointer hawa-select-none\",\n                  triggerClassNames\n                )}\n              >\n                {item.trigger}\n              </NavigationMenuLink>\n            )}\n          </NavigationMenuItem>\n        ))}\n      </NavigationMenuList>\n    </NavigationMenuRoot>\n  );\n};\n\nconst NavigationMenuItem = NavigationMenuPrimitive.Item;\nconst NavigationMenuLink = NavigationMenuPrimitive.Link;\n\nNavigationMenuContent.displayName = NavigationMenuPrimitive.Content.displayName;\nNavigationMenuTrigger.displayName = NavigationMenuPrimitive.Trigger.displayName;\nNavigationMenuList.displayName = NavigationMenuPrimitive.List.displayName;\nNavigationMenuRoot.displayName = NavigationMenuPrimitive.Root.displayName;\nNavigationMenuIndicator.displayName =\n  NavigationMenuPrimitive.Indicator.displayName;\nNavigationMenuViewport.displayName =\n  NavigationMenuPrimitive.Viewport.displayName;\n\nexport {\n  NavigationMenuLink,\n  NavigationMenuItem,\n  NavigationMenu,\n  NavigationMenuIndicator,\n  NavigationMenuContent,\n  NavigationMenuList,\n  navigationMenuTriggerStyle,\n  NavigationMenuRoot,\n  NavigationMenuTrigger,\n  NavigationMenuViewport,\n  StandardNavigationMenuItem\n};\n"],"mappings":"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","names":[]}

package/dist/pagination/index.d.mts

@@ -0,0 +1,11 @@
+import React__default from 'react';
+import { D as DirectionType } from '../commonTypes-ko_NGEoT.mjs';
+
+type PaginationProps = {
+    direction?: DirectionType;
+    totalPages: number;
+    currentPage?: number;
+};
+declare const Pagination: React__default.FC<PaginationProps>;
+
+export { Pagination };

package/dist/pagination/index.d.ts

@@ -0,0 +1,11 @@
+import React__default from 'react';
+import { D as DirectionType } from '../commonTypes-ko_NGEoT.js';
+
+type PaginationProps = {
+    direction?: DirectionType;
+    totalPages: number;
+    currentPage?: number;
+};
+declare const Pagination: React__default.FC<PaginationProps>;
+
+export { Pagination };

package/dist/pagination/index.js

@@ -0,0 +1,161 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// elements/pagination/index.ts
+var pagination_exports = {};
+__export(pagination_exports, {
+  Pagination: () => Pagination
+});
+module.exports = __toCommonJS(pagination_exports);
+
+// elements/pagination/Pagination.tsx
+var import_react = __toESM(require("react"));
+var import_react_headless_pagination = require("react-headless-pagination");
+
+// util/index.ts
+var import_clsx = require("clsx");
+var import_tailwind_merge = require("tailwind-merge");
+function cn(...inputs) {
+  return (0, import_tailwind_merge.twMerge)((0, import_clsx.clsx)(inputs));
+}
+
+// elements/pagination/Pagination.tsx
+var Pagination = ({
+  direction,
+  totalPages,
+  currentPage
+}) => {
+  const [page, setPage] = import_react.default.useState(currentPage || 0);
+  const handlePageChange = (page2) => {
+    setPage(page2);
+  };
+  return /* @__PURE__ */ import_react.default.createElement(
+    import_react_headless_pagination.Pagination,
+    {
+      totalPages,
+      edgePageCount: 2,
+      middlePagesSiblingCount: 1,
+      currentPage: page,
+      setCurrentPage: handlePageChange,
+      className: "hawa-flex hawa-h-9 hawa-w-full hawa-select-none hawa-items-center hawa-text-sm hawa-transition-all",
+      truncableText: "...",
+      truncableClassName: "hawa-w-10 hawa-px-0.5 hawa-text-center"
+    },
+    /* @__PURE__ */ import_react.default.createElement(
+      import_react_headless_pagination.Pagination.PrevButton,
+      {
+        as: /* @__PURE__ */ import_react.default.createElement(
+          "button",
+          {
+            "aria-label": "Previous Table Page",
+            className: cn(
+              "hawa-min-w-9 hawa-flex hawa-h-9 hawa-w-9 hawa-items-center hawa-justify-center hawa-rounded hawa-border hawa-bg-card",
+              direction === "rtl" && "hawa-rotate-180"
+            ),
+            style: { minWidth: 36 }
+          },
+          /* @__PURE__ */ import_react.default.createElement(
+            "svg",
+            {
+              xmlns: "http://www.w3.org/2000/svg",
+              width: "24",
+              height: "24",
+              viewBox: "0 0 24 24",
+              fill: "none",
+              stroke: "currentColor",
+              strokeWidth: "2",
+              strokeLinecap: "round",
+              strokeLinejoin: "round"
+            },
+            /* @__PURE__ */ import_react.default.createElement("path", { d: "m15 18-6-6 6-6" })
+          )
+        ),
+        className: cn(
+          "hawa-mr-2 hawa-flex hawa-items-center hawa-text-gray-500 hover:hawa-text-gray-600 dark:hover:hawa-text-gray-200",
+          {
+            "hawa-cursor-pointer": page !== 0,
+            "hawa-opacity-50": page === 0
+          }
+        )
+      },
+      "Previous"
+    ),
+    /* @__PURE__ */ import_react.default.createElement("nav", { className: "hawa-flex hawa-flex-grow hawa-justify-center" }, /* @__PURE__ */ import_react.default.createElement("ul", { className: "hawa-flex hawa-items-center hawa-gap-1" }, /* @__PURE__ */ import_react.default.createElement(
+      import_react_headless_pagination.Pagination.PageButton,
+      {
+        className: "hawa-tap-highlight-transparent hawa-text-default-foreground data-[focus-visible=true]:hawa-outline-focus data-[disabled=true]:hawa-text-default-300 hawa-min-w-9 hawa-text-small hawa-box-border hawa-flex hawa-h-9 hawa-w-9 hawa-cursor-pointer hawa-touch-none hawa-select-none hawa-flex-wrap hawa-items-center hawa-justify-center hawa-truncate hawa-rounded hawa-border hawa-bg-card hawa-outline-none hawa-transition-all hover:hawa-scale-[1.1] data-[disabled=true]:hawa-pointer-events-none data-[focus-visible=true]:hawa-z-10 data-[pressed=true]:hawa-scale-[0.97] data-[focus-visible=true]:hawa-outline-2 data-[focus-visible=true]:hawa-outline-offset-2",
+        activeClassName: "hawa-bg-primary hawa-text-primary-foreground hawa-transition-all"
+      }
+    ))),
+    /* @__PURE__ */ import_react.default.createElement(
+      import_react_headless_pagination.Pagination.NextButton,
+      {
+        as: /* @__PURE__ */ import_react.default.createElement(
+          "button",
+          {
+            "aria-label": "Previous Table Page",
+            className: cn(
+              "hawa-min-w-9 hawa-flex hawa-h-9 hawa-w-9 hawa-items-center hawa-justify-center hawa-rounded hawa-border hawa-bg-card",
+              direction === "ltr" && "hawa-rotate-180"
+            ),
+            style: { minWidth: 36 }
+          },
+          /* @__PURE__ */ import_react.default.createElement(
+            "svg",
+            {
+              xmlns: "http://www.w3.org/2000/svg",
+              width: "24",
+              height: "24",
+              viewBox: "0 0 24 24",
+              fill: "none",
+              stroke: "currentColor",
+              strokeWidth: "2",
+              strokeLinecap: "round",
+              strokeLinejoin: "round"
+            },
+            /* @__PURE__ */ import_react.default.createElement("path", { d: "m15 18-6-6 6-6" })
+          )
+        ),
+        className: cn(
+          "hawa-mr-2 hawa-flex hawa-items-center hawa-text-gray-500 hover:hawa-text-gray-600 dark:hover:hawa-text-gray-200",
+          {
+            "hawa-cursor-pointer": page !== totalPages - 1,
+            "hawa-opacity-50": page === totalPages - 1
+          }
+        )
+      },
+      "Next"
+    )
+  );
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  Pagination
+});
+//# sourceMappingURL=index.js.map