@health-samurai/react-components 0.0.0-alpha.1 → 0.0.0-alpha.2

package/dist/src/shadcn/components/ui/navigation-menu.js.map

@@ -1 +1 @@
-{"version":3,"file":"navigation-menu.js","sourceRoot":"","sources":["../../../../../src/shadcn/components/ui/navigation-menu.tsx"],"names":[],"mappings":"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"}
+{"version":3,"sources":["../../../../../src/shadcn/components/ui/navigation-menu.tsx"],"sourcesContent":["import * as NavigationMenuPrimitive from \"@radix-ui/react-navigation-menu\";\nimport { cva } from \"class-variance-authority\";\nimport { ChevronDownIcon } from \"lucide-react\";\nimport type * as React from \"react\";\n\nimport { cn } from \"#shadcn/lib/utils\";\n\nfunction NavigationMenu({\n\tclassName,\n\tchildren,\n\tviewport = true,\n\t...props\n}: React.ComponentProps<typeof NavigationMenuPrimitive.Root> & {\n\tviewport?: boolean;\n}) {\n\treturn (\n\t\t<NavigationMenuPrimitive.Root\n\t\t\tdata-slot=\"navigation-menu\"\n\t\t\tdata-viewport={viewport}\n\t\t\tclassName={cn(\n\t\t\t\t\"group/navigation-menu relative flex max-w-max flex-1 items-center justify-center\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t>\n\t\t\t{children}\n\t\t\t{viewport && <NavigationMenuViewport />}\n\t\t</NavigationMenuPrimitive.Root>\n\t);\n}\n\nfunction NavigationMenuList({\n\tclassName,\n\t...props\n}: React.ComponentProps<typeof NavigationMenuPrimitive.List>) {\n\treturn (\n\t\t<NavigationMenuPrimitive.List\n\t\t\tdata-slot=\"navigation-menu-list\"\n\t\t\tclassName={cn(\n\t\t\t\t\"group flex flex-1 list-none items-center justify-center gap-1\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n\nfunction NavigationMenuItem({\n\tclassName,\n\t...props\n}: React.ComponentProps<typeof NavigationMenuPrimitive.Item>) {\n\treturn (\n\t\t<NavigationMenuPrimitive.Item\n\t\t\tdata-slot=\"navigation-menu-item\"\n\t\t\tclassName={cn(\"relative\", className)}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n\nconst navigationMenuTriggerStyle = cva(\n\t\"group inline-flex h-9 w-max items-center justify-center rounded-md bg-background px-4 py-2 text-sm font-medium hover:bg-accent hover:text-accent-foreground focus:bg-accent focus:text-accent-foreground disabled:pointer-events-none disabled:opacity-50 data-[state=open]:hover:bg-accent data-[state=open]:text-accent-foreground data-[state=open]:focus:bg-accent data-[state=open]:bg-accent/50 focus-visible:ring-ring/50 outline-none transition-[color,box-shadow] focus-visible:ring-[3px] focus-visible:outline-1\",\n);\n\nfunction NavigationMenuTrigger({\n\tclassName,\n\tchildren,\n\t...props\n}: React.ComponentProps<typeof NavigationMenuPrimitive.Trigger>) {\n\treturn (\n\t\t<NavigationMenuPrimitive.Trigger\n\t\t\tdata-slot=\"navigation-menu-trigger\"\n\t\t\tclassName={cn(navigationMenuTriggerStyle(), \"group\", className)}\n\t\t\t{...props}\n\t\t>\n\t\t\t{children}{\" \"}\n\t\t\t<ChevronDownIcon\n\t\t\t\tclassName=\"relative top-[1px] ml-1 size-3 transition duration-300 group-data-[state=open]:rotate-180\"\n\t\t\t\taria-hidden=\"true\"\n\t\t\t/>\n\t\t</NavigationMenuPrimitive.Trigger>\n\t);\n}\n\nfunction NavigationMenuContent({\n\tclassName,\n\t...props\n}: React.ComponentProps<typeof NavigationMenuPrimitive.Content>) {\n\treturn (\n\t\t<NavigationMenuPrimitive.Content\n\t\t\tdata-slot=\"navigation-menu-content\"\n\t\t\tclassName={cn(\n\t\t\t\t\"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 top-0 left-0 w-full p-2 pr-2.5 md:absolute md:w-auto\",\n\t\t\t\t\"group-data-[viewport=false]/navigation-menu:bg-popover group-data-[viewport=false]/navigation-menu:text-popover-foreground group-data-[viewport=false]/navigation-menu:data-[state=open]:animate-in group-data-[viewport=false]/navigation-menu:data-[state=closed]:animate-out group-data-[viewport=false]/navigation-menu:data-[state=closed]:zoom-out-95 group-data-[viewport=false]/navigation-menu:data-[state=open]:zoom-in-95 group-data-[viewport=false]/navigation-menu:data-[state=open]:fade-in-0 group-data-[viewport=false]/navigation-menu:data-[state=closed]:fade-out-0 group-data-[viewport=false]/navigation-menu:top-full group-data-[viewport=false]/navigation-menu:mt-1.5 group-data-[viewport=false]/navigation-menu:overflow-hidden group-data-[viewport=false]/navigation-menu:rounded-md group-data-[viewport=false]/navigation-menu:border group-data-[viewport=false]/navigation-menu:shadow group-data-[viewport=false]/navigation-menu:duration-200 **:data-[slot=navigation-menu-link]:focus:ring-0 **:data-[slot=navigation-menu-link]:focus:outline-none\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n\nfunction NavigationMenuViewport({\n\tclassName,\n\t...props\n}: React.ComponentProps<typeof NavigationMenuPrimitive.Viewport>) {\n\treturn (\n\t\t<div\n\t\t\tclassName={cn(\n\t\t\t\t\"absolute top-full left-0 isolate z-50 flex justify-center\",\n\t\t\t)}\n\t\t>\n\t\t\t<NavigationMenuPrimitive.Viewport\n\t\t\t\tdata-slot=\"navigation-menu-viewport\"\n\t\t\t\tclassName={cn(\n\t\t\t\t\t\"origin-top-center bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-90 relative mt-1.5 h-[var(--radix-navigation-menu-viewport-height)] w-full overflow-hidden rounded-md border shadow md:w-[var(--radix-navigation-menu-viewport-width)]\",\n\t\t\t\t\tclassName,\n\t\t\t\t)}\n\t\t\t\t{...props}\n\t\t\t/>\n\t\t</div>\n\t);\n}\n\nfunction NavigationMenuLink({\n\tclassName,\n\t...props\n}: React.ComponentProps<typeof NavigationMenuPrimitive.Link>) {\n\treturn (\n\t\t<NavigationMenuPrimitive.Link\n\t\t\tdata-slot=\"navigation-menu-link\"\n\t\t\tclassName={cn(\n\t\t\t\t\"data-[active=true]:focus:bg-accent data-[active=true]:hover:bg-accent data-[active=true]:bg-accent/50 data-[active=true]:text-accent-foreground hover:bg-accent hover:text-accent-foreground focus:bg-accent focus:text-accent-foreground focus-visible:ring-ring/50 [&_svg:not([class*='text-'])]:text-muted-foreground flex flex-col gap-1 rounded-sm p-2 text-sm transition-all outline-none focus-visible:ring-[3px] focus-visible:outline-1 [&_svg:not([class*='size-'])]:size-4\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n\nfunction NavigationMenuIndicator({\n\tclassName,\n\t...props\n}: React.ComponentProps<typeof NavigationMenuPrimitive.Indicator>) {\n\treturn (\n\t\t<NavigationMenuPrimitive.Indicator\n\t\t\tdata-slot=\"navigation-menu-indicator\"\n\t\t\tclassName={cn(\n\t\t\t\t\"data-[state=visible]:animate-in data-[state=hidden]:animate-out data-[state=hidden]:fade-out data-[state=visible]:fade-in top-full z-[1] flex h-1.5 items-end justify-center overflow-hidden\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t>\n\t\t\t<div className=\"bg-border relative top-[60%] h-2 w-2 rotate-45 rounded-tl-sm shadow-md\" />\n\t\t</NavigationMenuPrimitive.Indicator>\n\t);\n}\n\nexport {\n\tNavigationMenu,\n\tNavigationMenuList,\n\tNavigationMenuItem,\n\tNavigationMenuContent,\n\tNavigationMenuTrigger,\n\tNavigationMenuLink,\n\tNavigationMenuIndicator,\n\tNavigationMenuViewport,\n\tnavigationMenuTriggerStyle,\n};\n"],"names":["NavigationMenuPrimitive","cva","ChevronDownIcon","cn","NavigationMenu","className","children","viewport","props","Root","data-slot","data-viewport","NavigationMenuViewport","NavigationMenuList","List","NavigationMenuItem","Item","navigationMenuTriggerStyle","NavigationMenuTrigger","Trigger","aria-hidden","NavigationMenuContent","Content","div","Viewport","NavigationMenuLink","Link","NavigationMenuIndicator","Indicator"],"mappings":";AAAA,YAAYA,6BAA6B,kCAAkC;AAC3E,SAASC,GAAG,QAAQ,2BAA2B;AAC/C,SAASC,eAAe,QAAQ,eAAe;AAG/C,SAASC,EAAE,QAAQ,qBAAoB;AAEvC,SAASC,eAAe,EACvBC,SAAS,EACTC,QAAQ,EACRC,WAAW,IAAI,EACf,GAAGC,OAGH;IACA,qBACC,MAACR,wBAAwBS,IAAI;QAC5BC,aAAU;QACVC,iBAAeJ;QACfF,WAAWF,GACV,oFACAE;QAEA,GAAGG,KAAK;;YAERF;YACAC,0BAAY,KAACK;;;AAGjB;AAEA,SAASC,mBAAmB,EAC3BR,SAAS,EACT,GAAGG,OACwD;IAC3D,qBACC,KAACR,wBAAwBc,IAAI;QAC5BJ,aAAU;QACVL,WAAWF,GACV,iEACAE;QAEA,GAAGG,KAAK;;AAGZ;AAEA,SAASO,mBAAmB,EAC3BV,SAAS,EACT,GAAGG,OACwD;IAC3D,qBACC,KAACR,wBAAwBgB,IAAI;QAC5BN,aAAU;QACVL,WAAWF,GAAG,YAAYE;QACzB,GAAGG,KAAK;;AAGZ;AAEA,MAAMS,6BAA6BhB,IAClC;AAGD,SAASiB,sBAAsB,EAC9Bb,SAAS,EACTC,QAAQ,EACR,GAAGE,OAC2D;IAC9D,qBACC,MAACR,wBAAwBmB,OAAO;QAC/BT,aAAU;QACVL,WAAWF,GAAGc,8BAA8B,SAASZ;QACpD,GAAGG,KAAK;;YAERF;YAAU;0BACX,KAACJ;gBACAG,WAAU;gBACVe,eAAY;;;;AAIhB;AAEA,SAASC,sBAAsB,EAC9BhB,SAAS,EACT,GAAGG,OAC2D;IAC9D,qBACC,KAACR,wBAAwBsB,OAAO;QAC/BZ,aAAU;QACVL,WAAWF,GACV,oWACA,6hCACAE;QAEA,GAAGG,KAAK;;AAGZ;AAEA,SAASI,uBAAuB,EAC/BP,SAAS,EACT,GAAGG,OAC4D;IAC/D,qBACC,KAACe;QACAlB,WAAWF,GACV;kBAGD,cAAA,KAACH,wBAAwBwB,QAAQ;YAChCd,aAAU;YACVL,WAAWF,GACV,sVACAE;YAEA,GAAGG,KAAK;;;AAIb;AAEA,SAASiB,mBAAmB,EAC3BpB,SAAS,EACT,GAAGG,OACwD;IAC3D,qBACC,KAACR,wBAAwB0B,IAAI;QAC5BhB,aAAU;QACVL,WAAWF,GACV,ydACAE;QAEA,GAAGG,KAAK;;AAGZ;AAEA,SAASmB,wBAAwB,EAChCtB,SAAS,EACT,GAAGG,OAC6D;IAChE,qBACC,KAACR,wBAAwB4B,SAAS;QACjClB,aAAU;QACVL,WAAWF,GACV,gMACAE;QAEA,GAAGG,KAAK;kBAET,cAAA,KAACe;YAAIlB,WAAU;;;AAGlB;AAEA,SACCD,cAAc,EACdS,kBAAkB,EAClBE,kBAAkB,EAClBM,qBAAqB,EACrBH,qBAAqB,EACrBO,kBAAkB,EAClBE,uBAAuB,EACvBf,sBAAsB,EACtBK,0BAA0B,GACzB"}

package/dist/src/shadcn/components/ui/navigation-menu.stories.js

@@ -1,46 +1,298 @@
+// biome-ignore-all lint/a11y/useValidAnchor: Useless in stories
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { CircleCheckIcon, CircleHelpIcon, CircleIcon } from "lucide-react";
-import { NavigationMenu, NavigationMenuContent, NavigationMenuItem, NavigationMenuLink, NavigationMenuList, NavigationMenuTrigger, navigationMenuTriggerStyle, } from "#shadcn/components/ui/navigation-menu";
+import { NavigationMenu, NavigationMenuContent, NavigationMenuItem, NavigationMenuLink, NavigationMenuList, NavigationMenuTrigger, navigationMenuTriggerStyle } from "./navigation-menu.js";
 const components = [
     {
         title: "Alert Dialog",
         href: "/docs/primitives/alert-dialog",
-        description: "A modal dialog that interrupts the user with important content and expects a response.",
+        description: "A modal dialog that interrupts the user with important content and expects a response."
     },
     {
         title: "Hover Card",
         href: "/docs/primitives/hover-card",
-        description: "For sighted users to preview content available behind a link.",
+        description: "For sighted users to preview content available behind a link."
     },
     {
         title: "Progress",
         href: "/docs/primitives/progress",
-        description: "Displays an indicator showing the completion progress of a task, typically displayed as a progress bar.",
+        description: "Displays an indicator showing the completion progress of a task, typically displayed as a progress bar."
     },
     {
         title: "Scroll-area",
         href: "/docs/primitives/scroll-area",
-        description: "Visually or semantically separates content.",
+        description: "Visually or semantically separates content."
     },
     {
         title: "Tabs",
         href: "/docs/primitives/tabs",
-        description: "A set of layered sections of content—known as tab panels—that are displayed one at a time.",
+        description: "A set of layered sections of content—known as tab panels—that are displayed one at a time."
     },
     {
         title: "Tooltip",
         href: "/docs/primitives/tooltip",
-        description: "A popup that displays information related to an element when the element receives keyboard focus or the mouse hovers over it.",
-    },
+        description: "A popup that displays information related to an element when the element receives keyboard focus or the mouse hovers over it."
+    }
 ];
 function ListItem({ title, children, href, ...props }) {
-    return (_jsx("li", { ...props, children: _jsx(NavigationMenuLink, { asChild: true, children: _jsxs("a", { href: href, children: [_jsx("div", { className: "text-sm leading-none font-medium", children: title }), _jsx("p", { className: "text-muted-foreground line-clamp-2 text-sm leading-snug", children: children })] }) }) }));
+    return /*#__PURE__*/ _jsx("li", {
+        ...props,
+        children: /*#__PURE__*/ _jsx(NavigationMenuLink, {
+            asChild: true,
+            children: /*#__PURE__*/ _jsxs("a", {
+                href: href,
+                children: [
+                    /*#__PURE__*/ _jsx("div", {
+                        className: "text-sm leading-none font-medium",
+                        children: title
+                    }),
+                    /*#__PURE__*/ _jsx("p", {
+                        className: "text-muted-foreground line-clamp-2 text-sm leading-snug",
+                        children: children
+                    })
+                ]
+            })
+        })
+    });
 }
 const meta = {
-    title: "Component/Navigation menu",
+    title: "Component/Navigation menu"
 };
 export default meta;
 export const Demo = {
-    render: () => (_jsx(NavigationMenu, { viewport: false, children: _jsxs(NavigationMenuList, { children: [_jsxs(NavigationMenuItem, { children: [_jsx(NavigationMenuTrigger, { children: "Home" }), _jsx(NavigationMenuContent, { children: _jsxs("ul", { className: "grid gap-2 md:w-[400px] lg:w-[500px] lg:grid-cols-[.75fr_1fr]", children: [_jsx("li", { className: "row-span-3", children: _jsx(NavigationMenuLink, { asChild: true, children: _jsxs("a", { className: "from-muted/50 to-muted flex h-full w-full flex-col justify-end rounded-md bg-linear-to-b p-6 no-underline outline-hidden select-none focus:shadow-md", href: "/", children: [_jsx("div", { className: "mt-4 mb-2 text-lg font-medium", children: "shadcn/ui" }), _jsx("p", { className: "text-muted-foreground text-sm leading-tight", children: "Beautifully designed components built with Tailwind CSS." })] }) }) }), _jsx(ListItem, { href: "/docs", title: "Introduction", children: "Re-usable components built using Radix UI and Tailwind CSS." }), _jsx(ListItem, { href: "/docs/installation", title: "Installation", children: "How to install dependencies and structure your app." }), _jsx(ListItem, { href: "/docs/primitives/typography", title: "Typography", children: "Styles for headings, paragraphs, lists...etc" })] }) })] }), _jsxs(NavigationMenuItem, { children: [_jsx(NavigationMenuTrigger, { children: "Components" }), _jsx(NavigationMenuContent, { children: _jsx("ul", { className: "grid w-[400px] gap-2 md:w-[500px] md:grid-cols-2 lg:w-[600px]", children: components.map((component) => (_jsx(ListItem, { title: component.title, href: component.href, children: component.description }, component.title))) }) })] }), _jsx(NavigationMenuItem, { children: _jsx(NavigationMenuLink, { asChild: true, className: navigationMenuTriggerStyle(), children: _jsx("a", { href: "/docs", children: "Docs" }) }) }), _jsxs(NavigationMenuItem, { children: [_jsx(NavigationMenuTrigger, { children: "List" }), _jsx(NavigationMenuContent, { children: _jsx("ul", { className: "grid w-[300px] gap-4", children: _jsxs("li", { children: [_jsx(NavigationMenuLink, { asChild: true, children: _jsxs("a", { href: "#", children: [_jsx("div", { className: "font-medium", children: "Components" }), _jsx("div", { className: "text-muted-foreground", children: "Browse all components in the library." })] }) }), _jsx(NavigationMenuLink, { asChild: true, children: _jsxs("a", { href: "#", children: [_jsx("div", { className: "font-medium", children: "Documentation" }), _jsx("div", { className: "text-muted-foreground", children: "Learn how to use the library." })] }) }), _jsx(NavigationMenuLink, { asChild: true, children: _jsxs("a", { href: "#", children: [_jsx("div", { className: "font-medium", children: "Blog" }), _jsx("div", { className: "text-muted-foreground", children: "Read our latest blog posts." })] }) })] }) }) })] }), _jsxs(NavigationMenuItem, { children: [_jsx(NavigationMenuTrigger, { children: "Simple" }), _jsx(NavigationMenuContent, { children: _jsx("ul", { className: "grid w-[200px] gap-4", children: _jsxs("li", { children: [_jsx(NavigationMenuLink, { asChild: true, children: _jsx("a", { href: "#", children: "Components" }) }), _jsx(NavigationMenuLink, { asChild: true, children: _jsx("a", { href: "#", children: "Documentation" }) }), _jsx(NavigationMenuLink, { asChild: true, children: _jsx("a", { href: "#", children: "Blocks" }) })] }) }) })] }), _jsxs(NavigationMenuItem, { children: [_jsx(NavigationMenuTrigger, { children: "With Icon" }), _jsx(NavigationMenuContent, { children: _jsx("ul", { className: "grid w-[200px] gap-4", children: _jsxs("li", { children: [_jsx(NavigationMenuLink, { asChild: true, children: _jsxs("a", { href: "#", className: "flex-row items-center gap-2", children: [_jsx(CircleHelpIcon, {}), "Backlog"] }) }), _jsx(NavigationMenuLink, { asChild: true, children: _jsxs("a", { href: "#", className: "flex-row items-center gap-2", children: [_jsx(CircleIcon, {}), "To Do"] }) }), _jsx(NavigationMenuLink, { asChild: true, children: _jsxs("a", { href: "#", className: "flex-row items-center gap-2", children: [_jsx(CircleCheckIcon, {}), "Done"] }) })] }) }) })] })] }) })),
+    render: ()=>/*#__PURE__*/ _jsx(NavigationMenu, {
+            viewport: false,
+            children: /*#__PURE__*/ _jsxs(NavigationMenuList, {
+                children: [
+                    /*#__PURE__*/ _jsxs(NavigationMenuItem, {
+                        children: [
+                            /*#__PURE__*/ _jsx(NavigationMenuTrigger, {
+                                children: "Home"
+                            }),
+                            /*#__PURE__*/ _jsx(NavigationMenuContent, {
+                                children: /*#__PURE__*/ _jsxs("ul", {
+                                    className: "grid gap-2 md:w-[400px] lg:w-[500px] lg:grid-cols-[.75fr_1fr]",
+                                    children: [
+                                        /*#__PURE__*/ _jsx("li", {
+                                            className: "row-span-3",
+                                            children: /*#__PURE__*/ _jsx(NavigationMenuLink, {
+                                                asChild: true,
+                                                children: /*#__PURE__*/ _jsxs("a", {
+                                                    className: "from-muted/50 to-muted flex h-full w-full flex-col justify-end rounded-md bg-linear-to-b p-6 no-underline outline-hidden select-none focus:shadow-md",
+                                                    href: "/",
+                                                    children: [
+                                                        /*#__PURE__*/ _jsx("div", {
+                                                            className: "mt-4 mb-2 text-lg font-medium",
+                                                            children: "shadcn/ui"
+                                                        }),
+                                                        /*#__PURE__*/ _jsx("p", {
+                                                            className: "text-muted-foreground text-sm leading-tight",
+                                                            children: "Beautifully designed components built with Tailwind CSS."
+                                                        })
+                                                    ]
+                                                })
+                                            })
+                                        }),
+                                        /*#__PURE__*/ _jsx(ListItem, {
+                                            href: "/docs",
+                                            title: "Introduction",
+                                            children: "Re-usable components built using Radix UI and Tailwind CSS."
+                                        }),
+                                        /*#__PURE__*/ _jsx(ListItem, {
+                                            href: "/docs/installation",
+                                            title: "Installation",
+                                            children: "How to install dependencies and structure your app."
+                                        }),
+                                        /*#__PURE__*/ _jsx(ListItem, {
+                                            href: "/docs/primitives/typography",
+                                            title: "Typography",
+                                            children: "Styles for headings, paragraphs, lists...etc"
+                                        })
+                                    ]
+                                })
+                            })
+                        ]
+                    }),
+                    /*#__PURE__*/ _jsxs(NavigationMenuItem, {
+                        children: [
+                            /*#__PURE__*/ _jsx(NavigationMenuTrigger, {
+                                children: "Components"
+                            }),
+                            /*#__PURE__*/ _jsx(NavigationMenuContent, {
+                                children: /*#__PURE__*/ _jsx("ul", {
+                                    className: "grid w-[400px] gap-2 md:w-[500px] md:grid-cols-2 lg:w-[600px]",
+                                    children: components.map((component)=>/*#__PURE__*/ _jsx(ListItem, {
+                                            title: component.title,
+                                            href: component.href,
+                                            children: component.description
+                                        }, component.title))
+                                })
+                            })
+                        ]
+                    }),
+                    /*#__PURE__*/ _jsx(NavigationMenuItem, {
+                        children: /*#__PURE__*/ _jsx(NavigationMenuLink, {
+                            asChild: true,
+                            className: navigationMenuTriggerStyle(),
+                            children: /*#__PURE__*/ _jsx("a", {
+                                href: "/docs",
+                                children: "Docs"
+                            })
+                        })
+                    }),
+                    /*#__PURE__*/ _jsxs(NavigationMenuItem, {
+                        children: [
+                            /*#__PURE__*/ _jsx(NavigationMenuTrigger, {
+                                children: "List"
+                            }),
+                            /*#__PURE__*/ _jsx(NavigationMenuContent, {
+                                children: /*#__PURE__*/ _jsx("ul", {
+                                    className: "grid w-[300px] gap-4",
+                                    children: /*#__PURE__*/ _jsxs("li", {
+                                        children: [
+                                            /*#__PURE__*/ _jsx(NavigationMenuLink, {
+                                                asChild: true,
+                                                children: /*#__PURE__*/ _jsxs("a", {
+                                                    href: "#",
+                                                    children: [
+                                                        /*#__PURE__*/ _jsx("div", {
+                                                            className: "font-medium",
+                                                            children: "Components"
+                                                        }),
+                                                        /*#__PURE__*/ _jsx("div", {
+                                                            className: "text-muted-foreground",
+                                                            children: "Browse all components in the library."
+                                                        })
+                                                    ]
+                                                })
+                                            }),
+                                            /*#__PURE__*/ _jsx(NavigationMenuLink, {
+                                                asChild: true,
+                                                children: /*#__PURE__*/ _jsxs("a", {
+                                                    href: "#",
+                                                    children: [
+                                                        /*#__PURE__*/ _jsx("div", {
+                                                            className: "font-medium",
+                                                            children: "Documentation"
+                                                        }),
+                                                        /*#__PURE__*/ _jsx("div", {
+                                                            className: "text-muted-foreground",
+                                                            children: "Learn how to use the library."
+                                                        })
+                                                    ]
+                                                })
+                                            }),
+                                            /*#__PURE__*/ _jsx(NavigationMenuLink, {
+                                                asChild: true,
+                                                children: /*#__PURE__*/ _jsxs("a", {
+                                                    href: "#",
+                                                    children: [
+                                                        /*#__PURE__*/ _jsx("div", {
+                                                            className: "font-medium",
+                                                            children: "Blog"
+                                                        }),
+                                                        /*#__PURE__*/ _jsx("div", {
+                                                            className: "text-muted-foreground",
+                                                            children: "Read our latest blog posts."
+                                                        })
+                                                    ]
+                                                })
+                                            })
+                                        ]
+                                    })
+                                })
+                            })
+                        ]
+                    }),
+                    /*#__PURE__*/ _jsxs(NavigationMenuItem, {
+                        children: [
+                            /*#__PURE__*/ _jsx(NavigationMenuTrigger, {
+                                children: "Simple"
+                            }),
+                            /*#__PURE__*/ _jsx(NavigationMenuContent, {
+                                children: /*#__PURE__*/ _jsx("ul", {
+                                    className: "grid w-[200px] gap-4",
+                                    children: /*#__PURE__*/ _jsxs("li", {
+                                        children: [
+                                            /*#__PURE__*/ _jsx(NavigationMenuLink, {
+                                                asChild: true,
+                                                children: /*#__PURE__*/ _jsx("a", {
+                                                    href: "#",
+                                                    children: "Components"
+                                                })
+                                            }),
+                                            /*#__PURE__*/ _jsx(NavigationMenuLink, {
+                                                asChild: true,
+                                                children: /*#__PURE__*/ _jsx("a", {
+                                                    href: "#",
+                                                    children: "Documentation"
+                                                })
+                                            }),
+                                            /*#__PURE__*/ _jsx(NavigationMenuLink, {
+                                                asChild: true,
+                                                children: /*#__PURE__*/ _jsx("a", {
+                                                    href: "#",
+                                                    children: "Blocks"
+                                                })
+                                            })
+                                        ]
+                                    })
+                                })
+                            })
+                        ]
+                    }),
+                    /*#__PURE__*/ _jsxs(NavigationMenuItem, {
+                        children: [
+                            /*#__PURE__*/ _jsx(NavigationMenuTrigger, {
+                                children: "With Icon"
+                            }),
+                            /*#__PURE__*/ _jsx(NavigationMenuContent, {
+                                children: /*#__PURE__*/ _jsx("ul", {
+                                    className: "grid w-[200px] gap-4",
+                                    children: /*#__PURE__*/ _jsxs("li", {
+                                        children: [
+                                            /*#__PURE__*/ _jsx(NavigationMenuLink, {
+                                                asChild: true,
+                                                children: /*#__PURE__*/ _jsxs("a", {
+                                                    href: "#",
+                                                    className: "flex-row items-center gap-2",
+                                                    children: [
+                                                        /*#__PURE__*/ _jsx(CircleHelpIcon, {}),
+                                                        "Backlog"
+                                                    ]
+                                                })
+                                            }),
+                                            /*#__PURE__*/ _jsx(NavigationMenuLink, {
+                                                asChild: true,
+                                                children: /*#__PURE__*/ _jsxs("a", {
+                                                    href: "#",
+                                                    className: "flex-row items-center gap-2",
+                                                    children: [
+                                                        /*#__PURE__*/ _jsx(CircleIcon, {}),
+                                                        "To Do"
+                                                    ]
+                                                })
+                                            }),
+                                            /*#__PURE__*/ _jsx(NavigationMenuLink, {
+                                                asChild: true,
+                                                children: /*#__PURE__*/ _jsxs("a", {
+                                                    href: "#",
+                                                    className: "flex-row items-center gap-2",
+                                                    children: [
+                                                        /*#__PURE__*/ _jsx(CircleCheckIcon, {}),
+                                                        "Done"
+                                                    ]
+                                                })
+                                            })
+                                        ]
+                                    })
+                                })
+                            })
+                        ]
+                    })
+                ]
+            })
+        })
 };
+
 //# sourceMappingURL=navigation-menu.stories.js.map

package/dist/src/shadcn/components/ui/navigation-menu.stories.js.map

@@ -1 +1 @@
-{"version":3,"file":"navigation-menu.stories.js","sourceRoot":"","sources":["../../../../../src/shadcn/components/ui/navigation-menu.stories.tsx"],"names":[],"mappings":"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"}
+{"version":3,"sources":["../../../../../src/shadcn/components/ui/navigation-menu.stories.tsx"],"sourcesContent":["// biome-ignore-all lint/a11y/useValidAnchor: Useless in stories\nimport type { Meta, StoryObj } from \"@storybook/react-vite\";\nimport { CircleCheckIcon, CircleHelpIcon, CircleIcon } from \"lucide-react\";\nimport type * as React from \"react\";\nimport {\n\tNavigationMenu,\n\tNavigationMenuContent,\n\tNavigationMenuItem,\n\tNavigationMenuLink,\n\tNavigationMenuList,\n\tNavigationMenuTrigger,\n\tnavigationMenuTriggerStyle,\n} from \"#shadcn/components/ui/navigation-menu\";\n\nconst components: { title: string; href: string; description: string }[] = [\n\t{\n\t\ttitle: \"Alert Dialog\",\n\t\thref: \"/docs/primitives/alert-dialog\",\n\t\tdescription:\n\t\t\t\"A modal dialog that interrupts the user with important content and expects a response.\",\n\t},\n\t{\n\t\ttitle: \"Hover Card\",\n\t\thref: \"/docs/primitives/hover-card\",\n\t\tdescription:\n\t\t\t\"For sighted users to preview content available behind a link.\",\n\t},\n\t{\n\t\ttitle: \"Progress\",\n\t\thref: \"/docs/primitives/progress\",\n\t\tdescription:\n\t\t\t\"Displays an indicator showing the completion progress of a task, typically displayed as a progress bar.\",\n\t},\n\t{\n\t\ttitle: \"Scroll-area\",\n\t\thref: \"/docs/primitives/scroll-area\",\n\t\tdescription: \"Visually or semantically separates content.\",\n\t},\n\t{\n\t\ttitle: \"Tabs\",\n\t\thref: \"/docs/primitives/tabs\",\n\t\tdescription:\n\t\t\t\"A set of layered sections of content—known as tab panels—that are displayed one at a time.\",\n\t},\n\t{\n\t\ttitle: \"Tooltip\",\n\t\thref: \"/docs/primitives/tooltip\",\n\t\tdescription:\n\t\t\t\"A popup that displays information related to an element when the element receives keyboard focus or the mouse hovers over it.\",\n\t},\n];\n\nfunction ListItem({\n\ttitle,\n\tchildren,\n\thref,\n\t...props\n}: React.ComponentPropsWithoutRef<\"li\"> & { href: string }) {\n\treturn (\n\t\t<li {...props}>\n\t\t\t<NavigationMenuLink asChild>\n\t\t\t\t<a href={href}>\n\t\t\t\t\t<div className=\"text-sm leading-none font-medium\">{title}</div>\n\t\t\t\t\t<p className=\"text-muted-foreground line-clamp-2 text-sm leading-snug\">\n\t\t\t\t\t\t{children}\n\t\t\t\t\t</p>\n\t\t\t\t</a>\n\t\t\t</NavigationMenuLink>\n\t\t</li>\n\t);\n}\n\nconst meta = {\n\ttitle: \"Component/Navigation menu\",\n} satisfies Meta;\nexport default meta;\n\ntype Story = StoryObj<typeof meta>;\n\nexport const Demo = {\n\trender: () => (\n\t\t<NavigationMenu viewport={false}>\n\t\t\t<NavigationMenuList>\n\t\t\t\t<NavigationMenuItem>\n\t\t\t\t\t<NavigationMenuTrigger>Home</NavigationMenuTrigger>\n\t\t\t\t\t<NavigationMenuContent>\n\t\t\t\t\t\t<ul className=\"grid gap-2 md:w-[400px] lg:w-[500px] lg:grid-cols-[.75fr_1fr]\">\n\t\t\t\t\t\t\t<li className=\"row-span-3\">\n\t\t\t\t\t\t\t\t<NavigationMenuLink asChild>\n\t\t\t\t\t\t\t\t\t<a\n\t\t\t\t\t\t\t\t\t\tclassName=\"from-muted/50 to-muted flex h-full w-full flex-col justify-end rounded-md bg-linear-to-b p-6 no-underline outline-hidden select-none focus:shadow-md\"\n\t\t\t\t\t\t\t\t\t\thref=\"/\"\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t<div className=\"mt-4 mb-2 text-lg font-medium\">\n\t\t\t\t\t\t\t\t\t\t\tshadcn/ui\n\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t<p className=\"text-muted-foreground text-sm leading-tight\">\n\t\t\t\t\t\t\t\t\t\t\tBeautifully designed components built with Tailwind CSS.\n\t\t\t\t\t\t\t\t\t\t</p>\n\t\t\t\t\t\t\t\t\t</a>\n\t\t\t\t\t\t\t\t</NavigationMenuLink>\n\t\t\t\t\t\t\t</li>\n\t\t\t\t\t\t\t<ListItem href=\"/docs\" title=\"Introduction\">\n\t\t\t\t\t\t\t\tRe-usable components built using Radix UI and Tailwind CSS.\n\t\t\t\t\t\t\t</ListItem>\n\t\t\t\t\t\t\t<ListItem href=\"/docs/installation\" title=\"Installation\">\n\t\t\t\t\t\t\t\tHow to install dependencies and structure your app.\n\t\t\t\t\t\t\t</ListItem>\n\t\t\t\t\t\t\t<ListItem href=\"/docs/primitives/typography\" title=\"Typography\">\n\t\t\t\t\t\t\t\tStyles for headings, paragraphs, lists...etc\n\t\t\t\t\t\t\t</ListItem>\n\t\t\t\t\t\t</ul>\n\t\t\t\t\t</NavigationMenuContent>\n\t\t\t\t</NavigationMenuItem>\n\t\t\t\t<NavigationMenuItem>\n\t\t\t\t\t<NavigationMenuTrigger>Components</NavigationMenuTrigger>\n\t\t\t\t\t<NavigationMenuContent>\n\t\t\t\t\t\t<ul className=\"grid w-[400px] gap-2 md:w-[500px] md:grid-cols-2 lg:w-[600px]\">\n\t\t\t\t\t\t\t{components.map((component) => (\n\t\t\t\t\t\t\t\t<ListItem\n\t\t\t\t\t\t\t\t\tkey={component.title}\n\t\t\t\t\t\t\t\t\ttitle={component.title}\n\t\t\t\t\t\t\t\t\thref={component.href}\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{component.description}\n\t\t\t\t\t\t\t\t</ListItem>\n\t\t\t\t\t\t\t))}\n\t\t\t\t\t\t</ul>\n\t\t\t\t\t</NavigationMenuContent>\n\t\t\t\t</NavigationMenuItem>\n\t\t\t\t<NavigationMenuItem>\n\t\t\t\t\t<NavigationMenuLink asChild className={navigationMenuTriggerStyle()}>\n\t\t\t\t\t\t<a href=\"/docs\">Docs</a>\n\t\t\t\t\t</NavigationMenuLink>\n\t\t\t\t</NavigationMenuItem>\n\t\t\t\t<NavigationMenuItem>\n\t\t\t\t\t<NavigationMenuTrigger>List</NavigationMenuTrigger>\n\t\t\t\t\t<NavigationMenuContent>\n\t\t\t\t\t\t<ul className=\"grid w-[300px] gap-4\">\n\t\t\t\t\t\t\t<li>\n\t\t\t\t\t\t\t\t<NavigationMenuLink asChild>\n\t\t\t\t\t\t\t\t\t<a href=\"#\">\n\t\t\t\t\t\t\t\t\t\t<div className=\"font-medium\">Components</div>\n\t\t\t\t\t\t\t\t\t\t<div className=\"text-muted-foreground\">\n\t\t\t\t\t\t\t\t\t\t\tBrowse all components in the library.\n\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t</a>\n\t\t\t\t\t\t\t\t</NavigationMenuLink>\n\t\t\t\t\t\t\t\t<NavigationMenuLink asChild>\n\t\t\t\t\t\t\t\t\t<a href=\"#\">\n\t\t\t\t\t\t\t\t\t\t<div className=\"font-medium\">Documentation</div>\n\t\t\t\t\t\t\t\t\t\t<div className=\"text-muted-foreground\">\n\t\t\t\t\t\t\t\t\t\t\tLearn how to use the library.\n\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t</a>\n\t\t\t\t\t\t\t\t</NavigationMenuLink>\n\t\t\t\t\t\t\t\t<NavigationMenuLink asChild>\n\t\t\t\t\t\t\t\t\t<a href=\"#\">\n\t\t\t\t\t\t\t\t\t\t<div className=\"font-medium\">Blog</div>\n\t\t\t\t\t\t\t\t\t\t<div className=\"text-muted-foreground\">\n\t\t\t\t\t\t\t\t\t\t\tRead our latest blog posts.\n\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t</a>\n\t\t\t\t\t\t\t\t</NavigationMenuLink>\n\t\t\t\t\t\t\t</li>\n\t\t\t\t\t\t</ul>\n\t\t\t\t\t</NavigationMenuContent>\n\t\t\t\t</NavigationMenuItem>\n\t\t\t\t<NavigationMenuItem>\n\t\t\t\t\t<NavigationMenuTrigger>Simple</NavigationMenuTrigger>\n\t\t\t\t\t<NavigationMenuContent>\n\t\t\t\t\t\t<ul className=\"grid w-[200px] gap-4\">\n\t\t\t\t\t\t\t<li>\n\t\t\t\t\t\t\t\t<NavigationMenuLink asChild>\n\t\t\t\t\t\t\t\t\t<a href=\"#\">Components</a>\n\t\t\t\t\t\t\t\t</NavigationMenuLink>\n\t\t\t\t\t\t\t\t<NavigationMenuLink asChild>\n\t\t\t\t\t\t\t\t\t<a href=\"#\">Documentation</a>\n\t\t\t\t\t\t\t\t</NavigationMenuLink>\n\t\t\t\t\t\t\t\t<NavigationMenuLink asChild>\n\t\t\t\t\t\t\t\t\t<a href=\"#\">Blocks</a>\n\t\t\t\t\t\t\t\t</NavigationMenuLink>\n\t\t\t\t\t\t\t</li>\n\t\t\t\t\t\t</ul>\n\t\t\t\t\t</NavigationMenuContent>\n\t\t\t\t</NavigationMenuItem>\n\t\t\t\t<NavigationMenuItem>\n\t\t\t\t\t<NavigationMenuTrigger>With Icon</NavigationMenuTrigger>\n\t\t\t\t\t<NavigationMenuContent>\n\t\t\t\t\t\t<ul className=\"grid w-[200px] gap-4\">\n\t\t\t\t\t\t\t<li>\n\t\t\t\t\t\t\t\t<NavigationMenuLink asChild>\n\t\t\t\t\t\t\t\t\t<a href=\"#\" className=\"flex-row items-center gap-2\">\n\t\t\t\t\t\t\t\t\t\t<CircleHelpIcon />\n\t\t\t\t\t\t\t\t\t\tBacklog\n\t\t\t\t\t\t\t\t\t</a>\n\t\t\t\t\t\t\t\t</NavigationMenuLink>\n\t\t\t\t\t\t\t\t<NavigationMenuLink asChild>\n\t\t\t\t\t\t\t\t\t<a href=\"#\" className=\"flex-row items-center gap-2\">\n\t\t\t\t\t\t\t\t\t\t<CircleIcon />\n\t\t\t\t\t\t\t\t\t\tTo Do\n\t\t\t\t\t\t\t\t\t</a>\n\t\t\t\t\t\t\t\t</NavigationMenuLink>\n\t\t\t\t\t\t\t\t<NavigationMenuLink asChild>\n\t\t\t\t\t\t\t\t\t<a href=\"#\" className=\"flex-row items-center gap-2\">\n\t\t\t\t\t\t\t\t\t\t<CircleCheckIcon />\n\t\t\t\t\t\t\t\t\t\tDone\n\t\t\t\t\t\t\t\t\t</a>\n\t\t\t\t\t\t\t\t</NavigationMenuLink>\n\t\t\t\t\t\t\t</li>\n\t\t\t\t\t\t</ul>\n\t\t\t\t\t</NavigationMenuContent>\n\t\t\t\t</NavigationMenuItem>\n\t\t\t</NavigationMenuList>\n\t\t</NavigationMenu>\n\t),\n} satisfies Story;\n"],"names":["CircleCheckIcon","CircleHelpIcon","CircleIcon","NavigationMenu","NavigationMenuContent","NavigationMenuItem","NavigationMenuLink","NavigationMenuList","NavigationMenuTrigger","navigationMenuTriggerStyle","components","title","href","description","ListItem","children","props","li","asChild","a","div","className","p","meta","Demo","render","viewport","ul","map","component"],"mappings":"AAAA,gEAAgE;;AAEhE,SAASA,eAAe,EAAEC,cAAc,EAAEC,UAAU,QAAQ,eAAe;AAE3E,SACCC,cAAc,EACdC,qBAAqB,EACrBC,kBAAkB,EAClBC,kBAAkB,EAClBC,kBAAkB,EAClBC,qBAAqB,EACrBC,0BAA0B,QACpB,uBAAwC;AAE/C,MAAMC,aAAqE;IAC1E;QACCC,OAAO;QACPC,MAAM;QACNC,aACC;IACF;IACA;QACCF,OAAO;QACPC,MAAM;QACNC,aACC;IACF;IACA;QACCF,OAAO;QACPC,MAAM;QACNC,aACC;IACF;IACA;QACCF,OAAO;QACPC,MAAM;QACNC,aAAa;IACd;IACA;QACCF,OAAO;QACPC,MAAM;QACNC,aACC;IACF;IACA;QACCF,OAAO;QACPC,MAAM;QACNC,aACC;IACF;CACA;AAED,SAASC,SAAS,EACjBH,KAAK,EACLI,QAAQ,EACRH,IAAI,EACJ,GAAGI,OACsD;IACzD,qBACC,KAACC;QAAI,GAAGD,KAAK;kBACZ,cAAA,KAACV;YAAmBY,OAAO;sBAC1B,cAAA,MAACC;gBAAEP,MAAMA;;kCACR,KAACQ;wBAAIC,WAAU;kCAAoCV;;kCACnD,KAACW;wBAAED,WAAU;kCACXN;;;;;;AAMP;AAEA,MAAMQ,OAAO;IACZZ,OAAO;AACR;AACA,eAAeY,KAAK;AAIpB,OAAO,MAAMC,OAAO;IACnBC,QAAQ,kBACP,KAACtB;YAAeuB,UAAU;sBACzB,cAAA,MAACnB;;kCACA,MAACF;;0CACA,KAACG;0CAAsB;;0CACvB,KAACJ;0CACA,cAAA,MAACuB;oCAAGN,WAAU;;sDACb,KAACJ;4CAAGI,WAAU;sDACb,cAAA,KAACf;gDAAmBY,OAAO;0DAC1B,cAAA,MAACC;oDACAE,WAAU;oDACVT,MAAK;;sEAEL,KAACQ;4DAAIC,WAAU;sEAAgC;;sEAG/C,KAACC;4DAAED,WAAU;sEAA8C;;;;;;sDAM9D,KAACP;4CAASF,MAAK;4CAAQD,OAAM;sDAAe;;sDAG5C,KAACG;4CAASF,MAAK;4CAAqBD,OAAM;sDAAe;;sDAGzD,KAACG;4CAASF,MAAK;4CAA8BD,OAAM;sDAAa;;;;;;;kCAMnE,MAACN;;0CACA,KAACG;0CAAsB;;0CACvB,KAACJ;0CACA,cAAA,KAACuB;oCAAGN,WAAU;8CACZX,WAAWkB,GAAG,CAAC,CAACC,0BAChB,KAACf;4CAEAH,OAAOkB,UAAUlB,KAAK;4CACtBC,MAAMiB,UAAUjB,IAAI;sDAEnBiB,UAAUhB,WAAW;2CAJjBgB,UAAUlB,KAAK;;;;;kCAUzB,KAACN;kCACA,cAAA,KAACC;4BAAmBY,OAAO;4BAACG,WAAWZ;sCACtC,cAAA,KAACU;gCAAEP,MAAK;0CAAQ;;;;kCAGlB,MAACP;;0CACA,KAACG;0CAAsB;;0CACvB,KAACJ;0CACA,cAAA,KAACuB;oCAAGN,WAAU;8CACb,cAAA,MAACJ;;0DACA,KAACX;gDAAmBY,OAAO;0DAC1B,cAAA,MAACC;oDAAEP,MAAK;;sEACP,KAACQ;4DAAIC,WAAU;sEAAc;;sEAC7B,KAACD;4DAAIC,WAAU;sEAAwB;;;;;0DAKzC,KAACf;gDAAmBY,OAAO;0DAC1B,cAAA,MAACC;oDAAEP,MAAK;;sEACP,KAACQ;4DAAIC,WAAU;sEAAc;;sEAC7B,KAACD;4DAAIC,WAAU;sEAAwB;;;;;0DAKzC,KAACf;gDAAmBY,OAAO;0DAC1B,cAAA,MAACC;oDAAEP,MAAK;;sEACP,KAACQ;4DAAIC,WAAU;sEAAc;;sEAC7B,KAACD;4DAAIC,WAAU;sEAAwB;;;;;;;;;;;kCAS7C,MAAChB;;0CACA,KAACG;0CAAsB;;0CACvB,KAACJ;0CACA,cAAA,KAACuB;oCAAGN,WAAU;8CACb,cAAA,MAACJ;;0DACA,KAACX;gDAAmBY,OAAO;0DAC1B,cAAA,KAACC;oDAAEP,MAAK;8DAAI;;;0DAEb,KAACN;gDAAmBY,OAAO;0DAC1B,cAAA,KAACC;oDAAEP,MAAK;8DAAI;;;0DAEb,KAACN;gDAAmBY,OAAO;0DAC1B,cAAA,KAACC;oDAAEP,MAAK;8DAAI;;;;;;;;;kCAMjB,MAACP;;0CACA,KAACG;0CAAsB;;0CACvB,KAACJ;0CACA,cAAA,KAACuB;oCAAGN,WAAU;8CACb,cAAA,MAACJ;;0DACA,KAACX;gDAAmBY,OAAO;0DAC1B,cAAA,MAACC;oDAAEP,MAAK;oDAAIS,WAAU;;sEACrB,KAACpB;wDAAiB;;;;0DAIpB,KAACK;gDAAmBY,OAAO;0DAC1B,cAAA,MAACC;oDAAEP,MAAK;oDAAIS,WAAU;;sEACrB,KAACnB;wDAAa;;;;0DAIhB,KAACI;gDAAmBY,OAAO;0DAC1B,cAAA,MAACC;oDAAEP,MAAK;oDAAIS,WAAU;;sEACrB,KAACrB;wDAAkB;;;;;;;;;;;;;AAW7B,EAAkB"}

package/dist/src/shadcn/components/ui/pagination.js

@@ -1,34 +1,91 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { ChevronLeftIcon, ChevronRightIcon, MoreHorizontalIcon, } from "lucide-react";
-import { buttonVariants } from "#shadcn/components/ui/button";
-import { cn } from "#shadcn/lib/utils";
+import { ChevronLeftIcon, ChevronRightIcon, MoreHorizontalIcon } from "lucide-react";
+import { buttonVariants } from "./button.js";
+import { cn } from "../../lib/utils.js";
 function Pagination({ className, ...props }) {
-    return (
-    // biome-ignore lint/a11y/useSemanticElements: FIXME: unchanged shadcn
-    _jsx("nav", { 
+    return(// biome-ignore lint/a11y/useSemanticElements: FIXME: unchanged shadcn
+    /*#__PURE__*/ _jsx("nav", {
         // biome-ignore lint/a11y/noRedundantRoles: FIXME: unchanged shadcn
-        role: "navigation", "aria-label": "pagination", "data-slot": "pagination", className: cn("mx-auto flex w-full justify-center", className), ...props }));
+        role: "navigation",
+        "aria-label": "pagination",
+        "data-slot": "pagination",
+        className: cn("mx-auto flex w-full justify-center", className),
+        ...props
+    }));
 }
 function PaginationContent({ className, ...props }) {
-    return (_jsx("ul", { "data-slot": "pagination-content", className: cn("flex flex-row items-center gap-1", className), ...props }));
+    return /*#__PURE__*/ _jsx("ul", {
+        "data-slot": "pagination-content",
+        className: cn("flex flex-row items-center gap-1", className),
+        ...props
+    });
 }
 function PaginationItem({ ...props }) {
-    return (_jsx("li", { className: "hover:bg-accent rounded-md", "data-slot": "pagination-item", ...props }));
+    return /*#__PURE__*/ _jsx("li", {
+        className: "hover:bg-accent rounded-md",
+        "data-slot": "pagination-item",
+        ...props
+    });
 }
 function PaginationLink({ className, isActive, size = "small", ...props }) {
-    return (_jsx("a", { "aria-current": isActive ? "page" : undefined, "data-slot": "pagination-link", "data-active": isActive, className: cn(buttonVariants({
+    return /*#__PURE__*/ _jsx("a", {
+        "aria-current": isActive ? "page" : undefined,
+        "data-slot": "pagination-link",
+        "data-active": isActive,
+        className: cn(buttonVariants({
             variant: isActive ? "secondary" : "ghost",
-            size,
-        }), className), ...props }));
+            size
+        }), className),
+        ...props
+    });
 }
 function PaginationPrevious({ className, ...props }) {
-    return (_jsxs(PaginationLink, { "aria-label": "Go to previous page", size: "small", className: cn("gap-1 px-2.5 sm:pl-2.5", className), ...props, children: [_jsx(ChevronLeftIcon, {}), _jsx("span", { className: "hidden sm:block", children: "Previous" })] }));
+    return /*#__PURE__*/ _jsxs(PaginationLink, {
+        "aria-label": "Go to previous page",
+        size: "small",
+        className: cn("gap-1 px-2.5 sm:pl-2.5", className),
+        ...props,
+        children: [
+            /*#__PURE__*/ _jsx(ChevronLeftIcon, {}),
+            /*#__PURE__*/ _jsx("span", {
+                className: "hidden sm:block",
+                children: "Previous"
+            })
+        ]
+    });
 }
 function PaginationNext({ className, ...props }) {
-    return (_jsxs(PaginationLink, { "aria-label": "Go to next page", size: "regular", className: cn("gap-1 px-2.5 sm:pr-2.5", className), ...props, children: [_jsx("span", { className: "hidden sm:block", children: "Next" }), _jsx(ChevronRightIcon, {})] }));
+    return /*#__PURE__*/ _jsxs(PaginationLink, {
+        "aria-label": "Go to next page",
+        size: "regular",
+        className: cn("gap-1 px-2.5 sm:pr-2.5", className),
+        ...props,
+        children: [
+            /*#__PURE__*/ _jsx("span", {
+                className: "hidden sm:block",
+                children: "Next"
+            }),
+            /*#__PURE__*/ _jsx(ChevronRightIcon, {})
+        ]
+    });
 }
 function PaginationEllipsis({ className, ...props }) {
-    return (_jsxs("span", { "aria-hidden": true, "data-slot": "pagination-ellipsis", className: cn("flex size-9 items-center justify-center", className), ...props, children: [_jsx(MoreHorizontalIcon, { className: "size-4" }), _jsx("span", { className: "sr-only", children: "More pages" })] }));
+    return /*#__PURE__*/ _jsxs("span", {
+        "aria-hidden": true,
+        "data-slot": "pagination-ellipsis",
+        className: cn("flex size-9 items-center justify-center", className),
+        ...props,
+        children: [
+            /*#__PURE__*/ _jsx(MoreHorizontalIcon, {
+                className: "size-4"
+            }),
+            /*#__PURE__*/ _jsx("span", {
+                className: "sr-only",
+                children: "More pages"
+            })
+        ]
+    });
 }
-export { Pagination, PaginationContent, PaginationLink, PaginationItem, PaginationPrevious, PaginationNext, PaginationEllipsis, };
+export { Pagination, PaginationContent, PaginationLink, PaginationItem, PaginationPrevious, PaginationNext, PaginationEllipsis };
+
 //# sourceMappingURL=pagination.js.map

package/dist/src/shadcn/components/ui/pagination.js.map

@@ -1 +1 @@
-{"version":3,"file":"pagination.js","sourceRoot":"","sources":["../../../../../src/shadcn/components/ui/pagination.tsx"],"names":[],"mappings":";AAAA,OAAO,EACN,eAAe,EACf,gBAAgB,EAChB,kBAAkB,GAClB,MAAM,cAAc,CAAC;AAEtB,OAAO,EAAe,cAAc,EAAE,MAAM,8BAA8B,CAAC;AAC3E,OAAO,EAAE,EAAE,EAAE,MAAM,mBAAmB,CAAC;AAEvC,SAAS,UAAU,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAA+B;IACvE,OAAO;IACN,sEAAsE;IACtE;QACC,mEAAmE;QACnE,IAAI,EAAC,YAAY,gBACN,YAAY,eACb,YAAY,EACtB,SAAS,EAAE,EAAE,CAAC,oCAAoC,EAAE,SAAS,CAAC,KAC1D,KAAK,GACR,CACF,CAAC;AACH,CAAC;AAED,SAAS,iBAAiB,CAAC,EAC1B,SAAS,EACT,GAAG,KAAK,EACoB;IAC5B,OAAO,CACN,0BACW,oBAAoB,EAC9B,SAAS,EAAE,EAAE,CAAC,kCAAkC,EAAE,SAAS,CAAC,KACxD,KAAK,GACR,CACF,CAAC;AACH,CAAC;AAED,SAAS,cAAc,CAAC,EAAE,GAAG,KAAK,EAA8B;IAC/D,OAAO,CACN,aACC,SAAS,EAAC,4BAA4B,eAC5B,iBAAiB,KACvB,KAAK,GACR,CACF,CAAC;AACH,CAAC;AAOD,SAAS,cAAc,CAAC,EACvB,SAAS,EACT,QAAQ,EACR,IAAI,GAAG,OAAO,EACd,GAAG,KAAK,EACa;IACrB,OAAO,CACN,4BACe,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,eACjC,iBAAiB,iBACd,QAAQ,EACrB,SAAS,EAAE,EAAE,CACZ,cAAc,CAAC;YACd,OAAO,EAAE,QAAQ,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,OAAO;YACzC,IAAI;SACJ,CAAC,EACF,SAAS,CACT,KACG,KAAK,GACR,CACF,CAAC;AACH,CAAC;AAED,SAAS,kBAAkB,CAAC,EAC3B,SAAS,EACT,GAAG,KAAK,EACqC;IAC7C,OAAO,CACN,MAAC,cAAc,kBACH,qBAAqB,EAChC,IAAI,EAAC,OAAO,EACZ,SAAS,EAAE,EAAE,CAAC,wBAAwB,EAAE,SAAS,CAAC,KAC9C,KAAK,aAET,KAAC,eAAe,KAAG,EACnB,eAAM,SAAS,EAAC,iBAAiB,yBAAgB,IACjC,CACjB,CAAC;AACH,CAAC;AAED,SAAS,cAAc,CAAC,EACvB,SAAS,EACT,GAAG,KAAK,EACqC;IAC7C,OAAO,CACN,MAAC,cAAc,kBACH,iBAAiB,EAC5B,IAAI,EAAC,SAAS,EACd,SAAS,EAAE,EAAE,CAAC,wBAAwB,EAAE,SAAS,CAAC,KAC9C,KAAK,aAET,eAAM,SAAS,EAAC,iBAAiB,qBAAY,EAC7C,KAAC,gBAAgB,KAAG,IACJ,CACjB,CAAC;AACH,CAAC;AAED,SAAS,kBAAkB,CAAC,EAC3B,SAAS,EACT,GAAG,KAAK,EACsB;IAC9B,OAAO,CACN,kDAEW,qBAAqB,EAC/B,SAAS,EAAE,EAAE,CAAC,yCAAyC,EAAE,SAAS,CAAC,KAC/D,KAAK,aAET,KAAC,kBAAkB,IAAC,SAAS,EAAC,QAAQ,GAAG,EACzC,eAAM,SAAS,EAAC,SAAS,2BAAkB,IACrC,CACP,CAAC;AACH,CAAC;AAED,OAAO,EACN,UAAU,EACV,iBAAiB,EACjB,cAAc,EACd,cAAc,EACd,kBAAkB,EAClB,cAAc,EACd,kBAAkB,GAClB,CAAC"}
+{"version":3,"sources":["../../../../../src/shadcn/components/ui/pagination.tsx"],"sourcesContent":["import {\n\tChevronLeftIcon,\n\tChevronRightIcon,\n\tMoreHorizontalIcon,\n} from \"lucide-react\";\nimport type * as React from \"react\";\nimport { type Button, buttonVariants } from \"#shadcn/components/ui/button\";\nimport { cn } from \"#shadcn/lib/utils\";\n\nfunction Pagination({ className, ...props }: React.ComponentProps<\"nav\">) {\n\treturn (\n\t\t// biome-ignore lint/a11y/useSemanticElements: FIXME: unchanged shadcn\n\t\t<nav\n\t\t\t// biome-ignore lint/a11y/noRedundantRoles: FIXME: unchanged shadcn\n\t\t\trole=\"navigation\"\n\t\t\taria-label=\"pagination\"\n\t\t\tdata-slot=\"pagination\"\n\t\t\tclassName={cn(\"mx-auto flex w-full justify-center\", className)}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n\nfunction PaginationContent({\n\tclassName,\n\t...props\n}: React.ComponentProps<\"ul\">) {\n\treturn (\n\t\t<ul\n\t\t\tdata-slot=\"pagination-content\"\n\t\t\tclassName={cn(\"flex flex-row items-center gap-1\", className)}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n\nfunction PaginationItem({ ...props }: React.ComponentProps<\"li\">) {\n\treturn (\n\t\t<li\n\t\t\tclassName=\"hover:bg-accent rounded-md\"\n\t\t\tdata-slot=\"pagination-item\"\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n\ntype PaginationLinkProps = {\n\tisActive?: boolean;\n} & Pick<React.ComponentProps<typeof Button>, \"size\"> &\n\tReact.ComponentProps<\"a\">;\n\nfunction PaginationLink({\n\tclassName,\n\tisActive,\n\tsize = \"small\",\n\t...props\n}: PaginationLinkProps) {\n\treturn (\n\t\t<a\n\t\t\taria-current={isActive ? \"page\" : undefined}\n\t\t\tdata-slot=\"pagination-link\"\n\t\t\tdata-active={isActive}\n\t\t\tclassName={cn(\n\t\t\t\tbuttonVariants({\n\t\t\t\t\tvariant: isActive ? \"secondary\" : \"ghost\",\n\t\t\t\t\tsize,\n\t\t\t\t}),\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n\nfunction PaginationPrevious({\n\tclassName,\n\t...props\n}: React.ComponentProps<typeof PaginationLink>) {\n\treturn (\n\t\t<PaginationLink\n\t\t\taria-label=\"Go to previous page\"\n\t\t\tsize=\"small\"\n\t\t\tclassName={cn(\"gap-1 px-2.5 sm:pl-2.5\", className)}\n\t\t\t{...props}\n\t\t>\n\t\t\t<ChevronLeftIcon />\n\t\t\t<span className=\"hidden sm:block\">Previous</span>\n\t\t</PaginationLink>\n\t);\n}\n\nfunction PaginationNext({\n\tclassName,\n\t...props\n}: React.ComponentProps<typeof PaginationLink>) {\n\treturn (\n\t\t<PaginationLink\n\t\t\taria-label=\"Go to next page\"\n\t\t\tsize=\"regular\"\n\t\t\tclassName={cn(\"gap-1 px-2.5 sm:pr-2.5\", className)}\n\t\t\t{...props}\n\t\t>\n\t\t\t<span className=\"hidden sm:block\">Next</span>\n\t\t\t<ChevronRightIcon />\n\t\t</PaginationLink>\n\t);\n}\n\nfunction PaginationEllipsis({\n\tclassName,\n\t...props\n}: React.ComponentProps<\"span\">) {\n\treturn (\n\t\t<span\n\t\t\taria-hidden\n\t\t\tdata-slot=\"pagination-ellipsis\"\n\t\t\tclassName={cn(\"flex size-9 items-center justify-center\", className)}\n\t\t\t{...props}\n\t\t>\n\t\t\t<MoreHorizontalIcon className=\"size-4\" />\n\t\t\t<span className=\"sr-only\">More pages</span>\n\t\t</span>\n\t);\n}\n\nexport {\n\tPagination,\n\tPaginationContent,\n\tPaginationLink,\n\tPaginationItem,\n\tPaginationPrevious,\n\tPaginationNext,\n\tPaginationEllipsis,\n};\n"],"names":["ChevronLeftIcon","ChevronRightIcon","MoreHorizontalIcon","buttonVariants","cn","Pagination","className","props","nav","role","aria-label","data-slot","PaginationContent","ul","PaginationItem","li","PaginationLink","isActive","size","a","aria-current","undefined","data-active","variant","PaginationPrevious","span","PaginationNext","PaginationEllipsis","aria-hidden"],"mappings":";AAAA,SACCA,eAAe,EACfC,gBAAgB,EAChBC,kBAAkB,QACZ,eAAe;AAEtB,SAAsBC,cAAc,QAAQ,cAA+B;AAC3E,SAASC,EAAE,QAAQ,qBAAoB;AAEvC,SAASC,WAAW,EAAEC,SAAS,EAAE,GAAGC,OAAoC;IACvE,OACC,sEAAsE;kBACtE,KAACC;QACA,mEAAmE;QACnEC,MAAK;QACLC,cAAW;QACXC,aAAU;QACVL,WAAWF,GAAG,sCAAsCE;QACnD,GAAGC,KAAK;;AAGZ;AAEA,SAASK,kBAAkB,EAC1BN,SAAS,EACT,GAAGC,OACyB;IAC5B,qBACC,KAACM;QACAF,aAAU;QACVL,WAAWF,GAAG,oCAAoCE;QACjD,GAAGC,KAAK;;AAGZ;AAEA,SAASO,eAAe,EAAE,GAAGP,OAAmC;IAC/D,qBACC,KAACQ;QACAT,WAAU;QACVK,aAAU;QACT,GAAGJ,KAAK;;AAGZ;AAOA,SAASS,eAAe,EACvBV,SAAS,EACTW,QAAQ,EACRC,OAAO,OAAO,EACd,GAAGX,OACkB;IACrB,qBACC,KAACY;QACAC,gBAAcH,WAAW,SAASI;QAClCV,aAAU;QACVW,eAAaL;QACbX,WAAWF,GACVD,eAAe;YACdoB,SAASN,WAAW,cAAc;YAClCC;QACD,IACAZ;QAEA,GAAGC,KAAK;;AAGZ;AAEA,SAASiB,mBAAmB,EAC3BlB,SAAS,EACT,GAAGC,OAC0C;IAC7C,qBACC,MAACS;QACAN,cAAW;QACXQ,MAAK;QACLZ,WAAWF,GAAG,0BAA0BE;QACvC,GAAGC,KAAK;;0BAET,KAACP;0BACD,KAACyB;gBAAKnB,WAAU;0BAAkB;;;;AAGrC;AAEA,SAASoB,eAAe,EACvBpB,SAAS,EACT,GAAGC,OAC0C;IAC7C,qBACC,MAACS;QACAN,cAAW;QACXQ,MAAK;QACLZ,WAAWF,GAAG,0BAA0BE;QACvC,GAAGC,KAAK;;0BAET,KAACkB;gBAAKnB,WAAU;0BAAkB;;0BAClC,KAACL;;;AAGJ;AAEA,SAAS0B,mBAAmB,EAC3BrB,SAAS,EACT,GAAGC,OAC2B;IAC9B,qBACC,MAACkB;QACAG,aAAW;QACXjB,aAAU;QACVL,WAAWF,GAAG,2CAA2CE;QACxD,GAAGC,KAAK;;0BAET,KAACL;gBAAmBI,WAAU;;0BAC9B,KAACmB;gBAAKnB,WAAU;0BAAU;;;;AAG7B;AAEA,SACCD,UAAU,EACVO,iBAAiB,EACjBI,cAAc,EACdF,cAAc,EACdU,kBAAkB,EAClBE,cAAc,EACdC,kBAAkB,GACjB"}

package/dist/src/shadcn/components/ui/pagination.stories.js

@@ -1,10 +1,48 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Pagination, PaginationContent, PaginationEllipsis, PaginationItem, PaginationLink, PaginationNext, PaginationPrevious, } from "#shadcn/components/ui/pagination";
+import { Pagination, PaginationContent, PaginationEllipsis, PaginationItem, PaginationLink, PaginationNext, PaginationPrevious } from "./pagination.js";
 const meta = {
-    title: "Component/Pagination",
+    title: "Component/Pagination"
 };
 export default meta;
 export const Demo = {
-    render: () => (_jsx(Pagination, { children: _jsxs(PaginationContent, { children: [_jsx(PaginationItem, { children: _jsx(PaginationPrevious, { href: "#" }) }), _jsx(PaginationItem, { children: _jsx(PaginationLink, { href: "#", children: "1" }) }), _jsx(PaginationItem, { children: _jsx(PaginationLink, { href: "#", isActive: true, children: "2" }) }), _jsx(PaginationItem, { children: _jsx(PaginationLink, { href: "#", children: "3" }) }), _jsx(PaginationItem, { children: _jsx(PaginationEllipsis, {}) }), _jsx(PaginationItem, { children: _jsx(PaginationNext, { href: "#" }) })] }) })),
+    render: ()=>/*#__PURE__*/ _jsx(Pagination, {
+            children: /*#__PURE__*/ _jsxs(PaginationContent, {
+                children: [
+                    /*#__PURE__*/ _jsx(PaginationItem, {
+                        children: /*#__PURE__*/ _jsx(PaginationPrevious, {
+                            href: "#"
+                        })
+                    }),
+                    /*#__PURE__*/ _jsx(PaginationItem, {
+                        children: /*#__PURE__*/ _jsx(PaginationLink, {
+                            href: "#",
+                            children: "1"
+                        })
+                    }),
+                    /*#__PURE__*/ _jsx(PaginationItem, {
+                        children: /*#__PURE__*/ _jsx(PaginationLink, {
+                            href: "#",
+                            isActive: true,
+                            children: "2"
+                        })
+                    }),
+                    /*#__PURE__*/ _jsx(PaginationItem, {
+                        children: /*#__PURE__*/ _jsx(PaginationLink, {
+                            href: "#",
+                            children: "3"
+                        })
+                    }),
+                    /*#__PURE__*/ _jsx(PaginationItem, {
+                        children: /*#__PURE__*/ _jsx(PaginationEllipsis, {})
+                    }),
+                    /*#__PURE__*/ _jsx(PaginationItem, {
+                        children: /*#__PURE__*/ _jsx(PaginationNext, {
+                            href: "#"
+                        })
+                    })
+                ]
+            })
+        })
 };
+
 //# sourceMappingURL=pagination.stories.js.map

package/dist/src/shadcn/components/ui/pagination.stories.js.map

@@ -1 +1 @@
-{"version":3,"file":"pagination.stories.js","sourceRoot":"","sources":["../../../../../src/shadcn/components/ui/pagination.stories.tsx"],"names":[],"mappings":";AAEA,OAAO,EACN,UAAU,EACV,iBAAiB,EACjB,kBAAkB,EAClB,cAAc,EACd,cAAc,EACd,cAAc,EACd,kBAAkB,GAClB,MAAM,kCAAkC,CAAC;AAE1C,MAAM,IAAI,GAAG;IACZ,KAAK,EAAE,sBAAsB;CACd,CAAC;AACjB,eAAe,IAAI,CAAC;AAIpB,MAAM,CAAC,MAAM,IAAI,GAAG;IACnB,MAAM,EAAE,GAAG,EAAE,CAAC,CACb,KAAC,UAAU,cACV,MAAC,iBAAiB,eACjB,KAAC,cAAc,cACd,KAAC,kBAAkB,IAAC,IAAI,EAAC,GAAG,GAAG,GACf,EACjB,KAAC,cAAc,cACd,KAAC,cAAc,IAAC,IAAI,EAAC,GAAG,kBAAmB,GAC3B,EACjB,KAAC,cAAc,cACd,KAAC,cAAc,IAAC,IAAI,EAAC,GAAG,EAAC,QAAQ,wBAEhB,GACD,EACjB,KAAC,cAAc,cACd,KAAC,cAAc,IAAC,IAAI,EAAC,GAAG,kBAAmB,GAC3B,EACjB,KAAC,cAAc,cACd,KAAC,kBAAkB,KAAG,GACN,EACjB,KAAC,cAAc,cACd,KAAC,cAAc,IAAC,IAAI,EAAC,GAAG,GAAG,GACX,IACE,GACR,CACb;CACe,CAAC"}
+{"version":3,"sources":["../../../../../src/shadcn/components/ui/pagination.stories.tsx"],"sourcesContent":["import type { Meta, StoryObj } from \"@storybook/react-vite\";\n\nimport {\n\tPagination,\n\tPaginationContent,\n\tPaginationEllipsis,\n\tPaginationItem,\n\tPaginationLink,\n\tPaginationNext,\n\tPaginationPrevious,\n} from \"#shadcn/components/ui/pagination\";\n\nconst meta = {\n\ttitle: \"Component/Pagination\",\n} satisfies Meta;\nexport default meta;\n\ntype Story = StoryObj<typeof meta>;\n\nexport const Demo = {\n\trender: () => (\n\t\t<Pagination>\n\t\t\t<PaginationContent>\n\t\t\t\t<PaginationItem>\n\t\t\t\t\t<PaginationPrevious href=\"#\" />\n\t\t\t\t</PaginationItem>\n\t\t\t\t<PaginationItem>\n\t\t\t\t\t<PaginationLink href=\"#\">1</PaginationLink>\n\t\t\t\t</PaginationItem>\n\t\t\t\t<PaginationItem>\n\t\t\t\t\t<PaginationLink href=\"#\" isActive>\n\t\t\t\t\t\t2\n\t\t\t\t\t</PaginationLink>\n\t\t\t\t</PaginationItem>\n\t\t\t\t<PaginationItem>\n\t\t\t\t\t<PaginationLink href=\"#\">3</PaginationLink>\n\t\t\t\t</PaginationItem>\n\t\t\t\t<PaginationItem>\n\t\t\t\t\t<PaginationEllipsis />\n\t\t\t\t</PaginationItem>\n\t\t\t\t<PaginationItem>\n\t\t\t\t\t<PaginationNext href=\"#\" />\n\t\t\t\t</PaginationItem>\n\t\t\t</PaginationContent>\n\t\t</Pagination>\n\t),\n} satisfies Story;\n"],"names":["Pagination","PaginationContent","PaginationEllipsis","PaginationItem","PaginationLink","PaginationNext","PaginationPrevious","meta","title","Demo","render","href","isActive"],"mappings":";AAEA,SACCA,UAAU,EACVC,iBAAiB,EACjBC,kBAAkB,EAClBC,cAAc,EACdC,cAAc,EACdC,cAAc,EACdC,kBAAkB,QACZ,kBAAmC;AAE1C,MAAMC,OAAO;IACZC,OAAO;AACR;AACA,eAAeD,KAAK;AAIpB,OAAO,MAAME,OAAO;IACnBC,QAAQ,kBACP,KAACV;sBACA,cAAA,MAACC;;kCACA,KAACE;kCACA,cAAA,KAACG;4BAAmBK,MAAK;;;kCAE1B,KAACR;kCACA,cAAA,KAACC;4BAAeO,MAAK;sCAAI;;;kCAE1B,KAACR;kCACA,cAAA,KAACC;4BAAeO,MAAK;4BAAIC,QAAQ;sCAAC;;;kCAInC,KAACT;kCACA,cAAA,KAACC;4BAAeO,MAAK;sCAAI;;;kCAE1B,KAACR;kCACA,cAAA,KAACD;;kCAEF,KAACC;kCACA,cAAA,KAACE;4BAAeM,MAAK;;;;;;AAK1B,EAAkB"}