@libreapps/ui 5.4.1

package/dist/navigation/index.mjs

@@ -0,0 +1,79 @@
+"use client";
+import { jsx } from 'react/jsx-runtime';
+
+var __defProp = Object.defineProperty;
+var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
+function Component() {
+  return /* @__PURE__ */ jsx("div", { className: "flex items-center justify-center p-8", children: /* @__PURE__ */ jsx("p", { className: "text-muted-foreground", children: "Component coming soon" }) });
+}
+__name(Component, "Component");
+function Component2() {
+  return /* @__PURE__ */ jsx("div", { className: "flex items-center justify-center p-8", children: /* @__PURE__ */ jsx("p", { className: "text-muted-foreground", children: "Component coming soon" }) });
+}
+__name(Component2, "Component");
+function Component3() {
+  return /* @__PURE__ */ jsx("div", { className: "flex items-center justify-center p-8", children: /* @__PURE__ */ jsx("p", { className: "text-muted-foreground", children: "Component coming soon" }) });
+}
+__name(Component3, "Component");
+function Component4() {
+  return /* @__PURE__ */ jsx("div", { className: "flex items-center justify-center p-8", children: /* @__PURE__ */ jsx("p", { className: "text-muted-foreground", children: "Component coming soon" }) });
+}
+__name(Component4, "Component");
+function Component5() {
+  return /* @__PURE__ */ jsx("div", { className: "flex items-center justify-center p-8", children: /* @__PURE__ */ jsx("p", { className: "text-muted-foreground", children: "Component coming soon" }) });
+}
+__name(Component5, "Component");
+function Component6() {
+  return /* @__PURE__ */ jsx("div", { className: "flex items-center justify-center p-8", children: /* @__PURE__ */ jsx("p", { className: "text-muted-foreground", children: "Component coming soon" }) });
+}
+__name(Component6, "Component");
+function Component7() {
+  return /* @__PURE__ */ jsx("div", { className: "flex items-center justify-center p-8", children: /* @__PURE__ */ jsx("p", { className: "text-muted-foreground", children: "Component coming soon" }) });
+}
+__name(Component7, "Component");
+function Component8() {
+  return /* @__PURE__ */ jsx("div", { className: "flex items-center justify-center p-8", children: /* @__PURE__ */ jsx("p", { className: "text-muted-foreground", children: "Component coming soon" }) });
+}
+__name(Component8, "Component");
+function Component9() {
+  return /* @__PURE__ */ jsx("div", { className: "flex items-center justify-center p-8", children: /* @__PURE__ */ jsx("p", { className: "text-muted-foreground", children: "Component coming soon" }) });
+}
+__name(Component9, "Component");
+function Component10() {
+  return /* @__PURE__ */ jsx("div", { className: "flex items-center justify-center p-8", children: /* @__PURE__ */ jsx("p", { className: "text-muted-foreground", children: "Component coming soon" }) });
+}
+__name(Component10, "Component");
+function Component11() {
+  return /* @__PURE__ */ jsx("div", { className: "flex items-center justify-center p-8", children: /* @__PURE__ */ jsx("p", { className: "text-muted-foreground", children: "Component coming soon" }) });
+}
+__name(Component11, "Component");
+function Component12() {
+  return /* @__PURE__ */ jsx("div", { className: "flex items-center justify-center p-8", children: /* @__PURE__ */ jsx("p", { className: "text-muted-foreground", children: "Component coming soon" }) });
+}
+__name(Component12, "Component");
+function Component13() {
+  return /* @__PURE__ */ jsx("div", { className: "flex items-center justify-center p-8", children: /* @__PURE__ */ jsx("p", { className: "text-muted-foreground", children: "Component coming soon" }) });
+}
+__name(Component13, "Component");
+function Component14() {
+  return /* @__PURE__ */ jsx("div", { className: "flex items-center justify-center p-8", children: /* @__PURE__ */ jsx("p", { className: "text-muted-foreground", children: "Component coming soon" }) });
+}
+__name(Component14, "Component");
+function Component15() {
+  return /* @__PURE__ */ jsx("div", { className: "flex items-center justify-center p-8", children: /* @__PURE__ */ jsx("p", { className: "text-muted-foreground", children: "Component coming soon" }) });
+}
+__name(Component15, "Component");
+function Component16() {
+  return /* @__PURE__ */ jsx("div", { className: "flex items-center justify-center p-8", children: /* @__PURE__ */ jsx("p", { className: "text-muted-foreground", children: "Component coming soon" }) });
+}
+__name(Component16, "Component");
+function Component17() {
+  return /* @__PURE__ */ jsx("div", { className: "flex items-center justify-center p-8", children: /* @__PURE__ */ jsx("p", { className: "text-muted-foreground", children: "Component coming soon" }) });
+}
+__name(Component17, "Component");
+function Component18() {
+  return /* @__PURE__ */ jsx("div", { className: "flex items-center justify-center p-8", children: /* @__PURE__ */ jsx("p", { className: "text-muted-foreground", children: "Component coming soon" }) });
+}
+__name(Component18, "Component");
+
+export { Component2 as AIModelSelectorNavigationBar, Component as AdvancedNavigationBar, Component3 as AppSwitcherNavigationBar, Component4 as BreadcrumbAndFiltersNavigationBar, Component5 as BreadcrumbNavigationBar, Component6 as CenteredLogoNavigationBar, Component7 as CollaborationNavigationBar, Component8 as CommunicationNavigationBar, Component9 as ContextSwitcherNavigationBar, Component10 as DashboardNavigationBar, Component11 as ECommerceNavigationBar, Component12 as IconNavigationBar, Component13 as SearchAndToggleNavigationBar, Component14 as SimpleNavigationBar, Component15 as StatusDashboardNavigationBar, Component16 as TeamSwitcherNavigationBar, Component17 as TwoTierNavigationBar, Component18 as UnderlineNavigationBar };

package/dist/navigation-menu.js

@@ -0,0 +1,149 @@
+"use client";
+'use strict';
+
+var React = require('react');
+var NavigationMenuPrimitive = require('@radix-ui/react-navigation-menu');
+var classVarianceAuthority = require('class-variance-authority');
+var lucideReact = require('lucide-react');
+var clsx = require('clsx');
+var tailwindMerge = require('tailwind-merge');
+var jsxRuntime = require('react/jsx-runtime');
+
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+
+function _interopNamespace(e) {
+  if (e && e.__esModule) return e;
+  var n = Object.create(null);
+  if (e) {
+    Object.keys(e).forEach(function (k) {
+      if (k !== 'default') {
+        var d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: function () { return e[k]; }
+        });
+      }
+    });
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
+
+var React__default = /*#__PURE__*/_interopDefault(React);
+var NavigationMenuPrimitive__namespace = /*#__PURE__*/_interopNamespace(NavigationMenuPrimitive);
+
+var __defProp = Object.defineProperty;
+var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
+function cn(...inputs) {
+  return tailwindMerge.twMerge(clsx.clsx(inputs));
+}
+__name(cn, "cn");
+var NavigationMenu = React__default.default.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+  NavigationMenuPrimitive__namespace.Root,
+  {
+    ref,
+    className: cn(
+      "relative z-10 flex max-w-max flex-1 items-center justify-center",
+      className
+    ),
+    ...props,
+    children
+  }
+));
+NavigationMenu.displayName = NavigationMenuPrimitive__namespace.Root.displayName;
+var NavigationMenuList = React__default.default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+  NavigationMenuPrimitive__namespace.List,
+  {
+    ref,
+    className: cn(
+      "group flex flex-1 list-none items-center justify-center space-x-1",
+      className
+    ),
+    ...props
+  }
+));
+NavigationMenuList.displayName = NavigationMenuPrimitive__namespace.List.displayName;
+var NavigationMenuItem = React__default.default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+  NavigationMenuPrimitive__namespace.Item,
+  {
+    ref,
+    className: cn("relative", className),
+    ...props
+  }
+));
+NavigationMenuItem.displayName = "NavigationMenuItem";
+var navigationMenuTriggerStyle = classVarianceAuthority.cva(
+  "group inline-flex h-10 w-max items-center justify-center rounded-md bg-background px-4 py-2 text-sm font-medium transition-colors hover:bg-level-1 text-foreground hover:text-accent  focus:text-accent focus:outline-none disabled:pointer-events-none disabled:opacity-50 data-[active]:bg-level-1/50 data-[state=open]:bg-level-1/50"
+);
+var NavigationMenuTrigger = React__default.default.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(
+  NavigationMenuPrimitive__namespace.Trigger,
+  {
+    ref,
+    className: cn(navigationMenuTriggerStyle(), "group", className),
+    ...props,
+    children: [
+      children,
+      " ",
+      /* @__PURE__ */ jsxRuntime.jsx(
+        lucideReact.ChevronDown,
+        {
+          className: "relative top-[1px] ml-1 h-3 w-3 transition duration-200 group-data-[state=open]:rotate-180",
+          "aria-hidden": "true"
+        }
+      )
+    ]
+  }
+));
+NavigationMenuTrigger.displayName = NavigationMenuPrimitive__namespace.Trigger.displayName;
+var NavigationMenuContent = React__default.default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+  NavigationMenuPrimitive__namespace.Content,
+  {
+    ref,
+    className: cn(
+      "right-0  absolute",
+      "absolute top-full w-fit bg-popover mt-[5px]",
+      "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 bg-background overflow-hidden rounded-md border",
+      className
+    ),
+    ...props
+  }
+));
+NavigationMenuContent.displayName = NavigationMenuPrimitive__namespace.Content.displayName;
+var NavigationMenuLink = NavigationMenuPrimitive__namespace.Link;
+var NavigationMenuViewport = React__default.default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("absolute left-0 top-full flex justify-center"), children: /* @__PURE__ */ jsxRuntime.jsx(
+  NavigationMenuPrimitive__namespace.Viewport,
+  {
+    className: cn(
+      "origin-top-center relative mt-1.5 h-[var(--radix-navigation-menu-viewport-height)] w-full overflow-hidden rounded-md border ",
+      "bg-background text-foreground shadow-lg 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)]",
+      className
+    ),
+    ref,
+    ...props
+  }
+) }));
+NavigationMenuViewport.displayName = NavigationMenuPrimitive__namespace.Viewport.displayName;
+var NavigationMenuIndicator = React__default.default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+  NavigationMenuPrimitive__namespace.Indicator,
+  {
+    ref,
+    className: cn(
+      "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",
+      className
+    ),
+    ...props,
+    children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "relative top-[60%] h-2 w-2 rotate-45 rounded-tl-sm bg-border shadow-md" })
+  }
+));
+NavigationMenuIndicator.displayName = NavigationMenuPrimitive__namespace.Indicator.displayName;
+
+exports.NavigationMenu = NavigationMenu;
+exports.NavigationMenuContent = NavigationMenuContent;
+exports.NavigationMenuIndicator = NavigationMenuIndicator;
+exports.NavigationMenuItem = NavigationMenuItem;
+exports.NavigationMenuLink = NavigationMenuLink;
+exports.NavigationMenuList = NavigationMenuList;
+exports.NavigationMenuTrigger = NavigationMenuTrigger;
+exports.NavigationMenuViewport = NavigationMenuViewport;
+exports.navigationMenuTriggerStyle = navigationMenuTriggerStyle;

package/dist/navigation-menu.mjs

@@ -0,0 +1,116 @@
+"use client";
+import React from 'react';
+import * as NavigationMenuPrimitive from '@radix-ui/react-navigation-menu';
+import { cva } from 'class-variance-authority';
+import { ChevronDown } from 'lucide-react';
+import { clsx } from 'clsx';
+import { twMerge } from 'tailwind-merge';
+import { jsx, jsxs } from 'react/jsx-runtime';
+
+var __defProp = Object.defineProperty;
+var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
+function cn(...inputs) {
+  return twMerge(clsx(inputs));
+}
+__name(cn, "cn");
+var NavigationMenu = React.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsx(
+  NavigationMenuPrimitive.Root,
+  {
+    ref,
+    className: cn(
+      "relative z-10 flex max-w-max flex-1 items-center justify-center",
+      className
+    ),
+    ...props,
+    children
+  }
+));
+NavigationMenu.displayName = NavigationMenuPrimitive.Root.displayName;
+var NavigationMenuList = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+  NavigationMenuPrimitive.List,
+  {
+    ref,
+    className: cn(
+      "group flex flex-1 list-none items-center justify-center space-x-1",
+      className
+    ),
+    ...props
+  }
+));
+NavigationMenuList.displayName = NavigationMenuPrimitive.List.displayName;
+var NavigationMenuItem = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+  NavigationMenuPrimitive.Item,
+  {
+    ref,
+    className: cn("relative", className),
+    ...props
+  }
+));
+NavigationMenuItem.displayName = "NavigationMenuItem";
+var navigationMenuTriggerStyle = cva(
+  "group inline-flex h-10 w-max items-center justify-center rounded-md bg-background px-4 py-2 text-sm font-medium transition-colors hover:bg-level-1 text-foreground hover:text-accent  focus:text-accent focus:outline-none disabled:pointer-events-none disabled:opacity-50 data-[active]:bg-level-1/50 data-[state=open]:bg-level-1/50"
+);
+var NavigationMenuTrigger = React.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs(
+  NavigationMenuPrimitive.Trigger,
+  {
+    ref,
+    className: cn(navigationMenuTriggerStyle(), "group", className),
+    ...props,
+    children: [
+      children,
+      " ",
+      /* @__PURE__ */ jsx(
+        ChevronDown,
+        {
+          className: "relative top-[1px] ml-1 h-3 w-3 transition duration-200 group-data-[state=open]:rotate-180",
+          "aria-hidden": "true"
+        }
+      )
+    ]
+  }
+));
+NavigationMenuTrigger.displayName = NavigationMenuPrimitive.Trigger.displayName;
+var NavigationMenuContent = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+  NavigationMenuPrimitive.Content,
+  {
+    ref,
+    className: cn(
+      "right-0  absolute",
+      "absolute top-full w-fit bg-popover mt-[5px]",
+      "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 bg-background overflow-hidden rounded-md border",
+      className
+    ),
+    ...props
+  }
+));
+NavigationMenuContent.displayName = NavigationMenuPrimitive.Content.displayName;
+var NavigationMenuLink = NavigationMenuPrimitive.Link;
+var NavigationMenuViewport = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { className: cn("absolute left-0 top-full flex justify-center"), children: /* @__PURE__ */ jsx(
+  NavigationMenuPrimitive.Viewport,
+  {
+    className: cn(
+      "origin-top-center relative mt-1.5 h-[var(--radix-navigation-menu-viewport-height)] w-full overflow-hidden rounded-md border ",
+      "bg-background text-foreground shadow-lg 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)]",
+      className
+    ),
+    ref,
+    ...props
+  }
+) }));
+NavigationMenuViewport.displayName = NavigationMenuPrimitive.Viewport.displayName;
+var NavigationMenuIndicator = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+  NavigationMenuPrimitive.Indicator,
+  {
+    ref,
+    className: cn(
+      "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",
+      className
+    ),
+    ...props,
+    children: /* @__PURE__ */ jsx("div", { className: "relative top-[60%] h-2 w-2 rotate-45 rounded-tl-sm bg-border shadow-md" })
+  }
+));
+NavigationMenuIndicator.displayName = NavigationMenuPrimitive.Indicator.displayName;
+
+export { NavigationMenu, NavigationMenuContent, NavigationMenuIndicator, NavigationMenuItem, NavigationMenuLink, NavigationMenuList, NavigationMenuTrigger, NavigationMenuViewport, navigationMenuTriggerStyle };

package/dist/pattern/grid-pattern.js

@@ -0,0 +1,333 @@
+"use client";
+'use strict';
+
+var React = require('react');
+var clsx = require('clsx');
+var tailwindMerge = require('tailwind-merge');
+var jsxRuntime = require('react/jsx-runtime');
+
+function _interopNamespace(e) {
+  if (e && e.__esModule) return e;
+  var n = Object.create(null);
+  if (e) {
+    Object.keys(e).forEach(function (k) {
+      if (k !== 'default') {
+        var d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: function () { return e[k]; }
+        });
+      }
+    });
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
+
+var React__namespace = /*#__PURE__*/_interopNamespace(React);
+
+var __defProp = Object.defineProperty;
+var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
+function cn(...inputs) {
+  return tailwindMerge.twMerge(clsx.clsx(inputs));
+}
+__name(cn, "cn");
+var GridPattern = React__namespace.forwardRef(
+  ({
+    variant = "dots",
+    size = 4,
+    gap = 20,
+    color = "currentColor",
+    opacity = 0.4,
+    strokeWidth = 1,
+    fade = false,
+    gradient,
+    animation,
+    offset,
+    maxArea,
+    className,
+    style,
+    ...props
+  }, ref) => {
+    const patternId = React__namespace.useId();
+    const maskId = React__namespace.useId();
+    const gradientId = React__namespace.useId();
+    const normalizedSize = typeof size === "number" ? { width: size, height: size } : { width: size.width ?? 4, height: size.height ?? 4 };
+    const normalizedGap = typeof gap === "number" ? { x: gap, y: gap } : { x: gap.x ?? 20, y: gap.y ?? 20 };
+    const normalizedOffset = {
+      x: offset?.x ?? 0,
+      y: offset?.y ?? 0
+    };
+    const renderPattern = /* @__PURE__ */ __name(() => {
+      switch (variant) {
+        case "dots":
+          return /* @__PURE__ */ jsxRuntime.jsx(
+            "circle",
+            {
+              cx: normalizedSize.width / 2,
+              cy: normalizedSize.height / 2,
+              r: normalizedSize.width / 2,
+              fill: color,
+              opacity
+            }
+          );
+        case "lines":
+          return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+            /* @__PURE__ */ jsxRuntime.jsx(
+              "line",
+              {
+                x1: "0",
+                y1: "0",
+                x2: "0",
+                y2: normalizedGap.y,
+                stroke: color,
+                strokeWidth,
+                opacity
+              }
+            ),
+            /* @__PURE__ */ jsxRuntime.jsx(
+              "line",
+              {
+                x1: "0",
+                y1: "0",
+                x2: normalizedGap.x,
+                y2: "0",
+                stroke: color,
+                strokeWidth,
+                opacity
+              }
+            )
+          ] });
+        case "crosses":
+          return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+            /* @__PURE__ */ jsxRuntime.jsx(
+              "line",
+              {
+                x1: normalizedSize.width / 2,
+                y1: "0",
+                x2: normalizedSize.width / 2,
+                y2: normalizedSize.height,
+                stroke: color,
+                strokeWidth,
+                opacity
+              }
+            ),
+            /* @__PURE__ */ jsxRuntime.jsx(
+              "line",
+              {
+                x1: "0",
+                y1: normalizedSize.height / 2,
+                x2: normalizedSize.width,
+                y2: normalizedSize.height / 2,
+                stroke: color,
+                strokeWidth,
+                opacity
+              }
+            )
+          ] });
+        case "plus":
+          return /* @__PURE__ */ jsxRuntime.jsx(
+            "path",
+            {
+              d: `M ${normalizedSize.width / 2} 0 L ${normalizedSize.width / 2} ${normalizedSize.height} M 0 ${normalizedSize.height / 2} L ${normalizedSize.width} ${normalizedSize.height / 2}`,
+              stroke: color,
+              strokeWidth,
+              opacity,
+              fill: "none",
+              strokeLinecap: "round"
+            }
+          );
+        case "squares":
+          return /* @__PURE__ */ jsxRuntime.jsx(
+            "rect",
+            {
+              width: normalizedSize.width,
+              height: normalizedSize.height,
+              fill: "none",
+              stroke: color,
+              strokeWidth,
+              opacity
+            }
+          );
+        default:
+          return null;
+      }
+    }, "renderPattern");
+    const renderFadeMask = /* @__PURE__ */ __name(() => {
+      if (!fade) return null;
+      switch (fade) {
+        case "edges":
+        case true:
+          return /* @__PURE__ */ jsxRuntime.jsxs("linearGradient", { id: maskId, gradientUnits: "userSpaceOnUse", children: [
+            /* @__PURE__ */ jsxRuntime.jsx("stop", { offset: "0%", stopColor: "white", stopOpacity: "0" }),
+            /* @__PURE__ */ jsxRuntime.jsx("stop", { offset: "10%", stopColor: "white", stopOpacity: "1" }),
+            /* @__PURE__ */ jsxRuntime.jsx("stop", { offset: "90%", stopColor: "white", stopOpacity: "1" }),
+            /* @__PURE__ */ jsxRuntime.jsx("stop", { offset: "100%", stopColor: "white", stopOpacity: "0" })
+          ] });
+        case "center":
+          return /* @__PURE__ */ jsxRuntime.jsxs("radialGradient", { id: maskId, gradientUnits: "userSpaceOnUse", children: [
+            /* @__PURE__ */ jsxRuntime.jsx("stop", { offset: "0%", stopColor: "white", stopOpacity: "1" }),
+            /* @__PURE__ */ jsxRuntime.jsx("stop", { offset: "70%", stopColor: "white", stopOpacity: "1" }),
+            /* @__PURE__ */ jsxRuntime.jsx("stop", { offset: "100%", stopColor: "white", stopOpacity: "0" })
+          ] });
+        case "radial":
+          return /* @__PURE__ */ jsxRuntime.jsxs("radialGradient", { id: maskId, gradientUnits: "userSpaceOnUse", children: [
+            /* @__PURE__ */ jsxRuntime.jsx("stop", { offset: "0%", stopColor: "white", stopOpacity: "0" }),
+            /* @__PURE__ */ jsxRuntime.jsx("stop", { offset: "30%", stopColor: "white", stopOpacity: "1" }),
+            /* @__PURE__ */ jsxRuntime.jsx("stop", { offset: "100%", stopColor: "white", stopOpacity: "1" })
+          ] });
+        default:
+          return null;
+      }
+    }, "renderFadeMask");
+    const animationStyle = animation ? {
+      animation: `grid-pattern-move ${animation.duration ?? 10}s ${animation.timing ?? "linear"} infinite ${animation.direction ?? "normal"}`
+    } : {};
+    return /* @__PURE__ */ jsxRuntime.jsxs(
+      "div",
+      {
+        ref,
+        className: cn(
+          "pointer-events-none absolute inset-0 overflow-hidden",
+          className
+        ),
+        style: {
+          ...style,
+          ...animationStyle
+        },
+        ...props,
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsxs(
+            "svg",
+            {
+              className: "absolute h-full w-full",
+              style: {
+                transform: `translate(${normalizedOffset.x}px, ${normalizedOffset.y}px)`
+              },
+              children: [
+                /* @__PURE__ */ jsxRuntime.jsxs("defs", { children: [
+                  /* @__PURE__ */ jsxRuntime.jsx(
+                    "pattern",
+                    {
+                      id: patternId,
+                      x: "0",
+                      y: "0",
+                      width: normalizedGap.x,
+                      height: normalizedGap.y,
+                      patternUnits: "userSpaceOnUse",
+                      children: renderPattern()
+                    }
+                  ),
+                  renderFadeMask(),
+                  gradient && /* @__PURE__ */ jsxRuntime.jsxs(
+                    "linearGradient",
+                    {
+                      id: gradientId,
+                      x1: "0%",
+                      y1: "0%",
+                      x2: "100%",
+                      y2: "100%",
+                      children: [
+                        /* @__PURE__ */ jsxRuntime.jsx("stop", { offset: "0%", stopColor: gradient.from ?? "transparent" }),
+                        gradient.via && /* @__PURE__ */ jsxRuntime.jsx("stop", { offset: "50%", stopColor: gradient.via }),
+                        /* @__PURE__ */ jsxRuntime.jsx("stop", { offset: "100%", stopColor: gradient.to ?? "transparent" })
+                      ]
+                    }
+                  )
+                ] }),
+                /* @__PURE__ */ jsxRuntime.jsx(
+                  "rect",
+                  {
+                    width: maxArea?.width ?? "100%",
+                    height: maxArea?.height ?? "100%",
+                    fill: `url(#${patternId})`,
+                    mask: fade ? `url(#${maskId})` : void 0
+                  }
+                ),
+                gradient && /* @__PURE__ */ jsxRuntime.jsx(
+                  "rect",
+                  {
+                    width: maxArea?.width ?? "100%",
+                    height: maxArea?.height ?? "100%",
+                    fill: `url(#${gradientId})`,
+                    opacity: gradient.opacity ?? 0.5,
+                    className: "mix-blend-multiply dark:mix-blend-screen"
+                  }
+                )
+              ]
+            }
+          ),
+          /* @__PURE__ */ jsxRuntime.jsx("style", { children: `
+          @keyframes grid-pattern-move {
+            0% {
+              transform: translate(0, 0);
+            }
+            100% {
+              transform: translate(${normalizedGap.x}px, ${normalizedGap.y}px);
+            }
+          }
+        ` })
+        ]
+      }
+    );
+  }
+);
+GridPattern.displayName = "GridPattern";
+var GridPatternPresets = {
+  dotMatrix: {
+    variant: "dots",
+    size: 3,
+    gap: 30,
+    opacity: 0.3
+  },
+  fineDots: {
+    variant: "dots",
+    size: 1,
+    gap: 10,
+    opacity: 0.4
+  },
+  gridLines: {
+    variant: "lines",
+    gap: 40,
+    strokeWidth: 1,
+    opacity: 0.2
+  },
+  crosshatch: {
+    variant: "crosses",
+    size: 10,
+    gap: 20,
+    strokeWidth: 1,
+    opacity: 0.3
+  },
+  blueprint: {
+    variant: "lines",
+    gap: 20,
+    strokeWidth: 0.5,
+    color: "#3b82f6",
+    opacity: 0.3
+  },
+  graph: {
+    variant: "lines",
+    gap: { x: 50, y: 50 },
+    strokeWidth: 1,
+    opacity: 0.15,
+    fade: "edges"
+  },
+  isometric: {
+    variant: "lines",
+    gap: { x: 30, y: 17.32 },
+    // 30deg isometric
+    strokeWidth: 0.5,
+    opacity: 0.2
+  },
+  hexagon: {
+    variant: "dots",
+    size: 2,
+    gap: { x: 30, y: 26 },
+    // Hexagonal pattern
+    opacity: 0.3
+  }
+};
+
+exports.GridPattern = GridPattern;
+exports.GridPatternPresets = GridPatternPresets;