@ngrok/mantle 0.60.2 → 0.61.0

package/dist/command.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/command/command.tsx","../src/components/command/meta-key.tsx"],"sourcesContent":["\"use client\";\n\nimport { MagnifyingGlassIcon } from \"@phosphor-icons/react/MagnifyingGlass\";\nimport { Command as CommandPrimitive, useCommandState } from \"cmdk\";\n\nimport {\n\ttype ComponentPropsWithoutRef,\n\ttype ComponentRef,\n\tforwardRef,\n} from \"react\";\nimport { cx } from \"../../utils/cx/cx.js\";\nimport { Dialog } from \"../dialog/dialog.js\";\n\ntype CommandRootProps = ComponentPropsWithoutRef<typeof CommandPrimitive>;\n\n/**\n * The root component for the Command. It provides the context for all other command sub-components.\n *\n * @see https://mantle.ngrok.com/components/preview/command#api-command-root\n *\n * @example\n * ```tsx\n * <Command.Root>\n *   <Command.Input placeholder=\"Type a command or search...\" />\n *   <Command.List>\n *     <Command.Empty>No results found.</Command.Empty>\n *     <Command.Group heading=\"Suggestions\">\n *       <Command.Item>\n *         <span>Calendar</span>\n *       </Command.Item>\n *     </Command.Group>\n *     <Command.Separator />\n *     <Command.Group heading=\"Settings\">\n *       <Command.Item>\n *         <span>Profile</span>\n *       </Command.Item>\n *     </Command.Group>\n *   </Command.List>\n * </Command.Root>\n */\nconst CommandRoot = forwardRef<ComponentRef<\"div\">, CommandRootProps>(\n\t({ className, ...props }, ref) => (\n\t\t<CommandPrimitive\n\t\t\tref={ref}\n\t\t\tdata-slot=\"command\"\n\t\t\tclassName={cx(\n\t\t\t\t\"bg-popover flex h-full w-full flex-col overflow-hidden rounded-md\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t),\n);\nCommandRoot.displayName = \"Command\";\n\n/**\n * The props for the CommandDialog component.\n *\n * @see https://mantle.ngrok.com/components/preview/command#api-command-dialog\n */\ntype CommandDialogProps = ComponentPropsWithoutRef<typeof Dialog.Root> & {\n\t/**\n\t * The title of the command dialog.\n\t */\n\ttitle?: string;\n\t/**\n\t * The description of the command dialog.\n\t */\n\tdescription?: string;\n\t/**\n\t * Class name(s) to apply to the command dialog content.\n\t */\n\tclassName?: string;\n\t/**\n\t * Whether to show the close button.\n\t */\n\tshowCloseButton?: boolean;\n\t/**\n\t * Custom filter function for the command list.\n\t *\n\t * @see https://github.com/pacocoursey/cmdk?tab=readme-ov-file#filtering\n\t */\n\tfilter?: CommandRootProps[\"filter\"];\n\t/**\n\t * Whether to enable filtering of command items. When false, disables built-in filtering.\n\t *\n\t * @see https://github.com/pacocoursey/cmdk?tab=readme-ov-file#filtering\n\t */\n\tshouldFilter?: CommandRootProps[\"shouldFilter\"];\n};\n\n/**\n * A window overlaid on either the primary window or another dialog window.\n * The root stateful component for the CommandDialog.\n *\n * @see https://mantle.ngrok.com/components/preview/command#api-command-dialog\n *\n * @example\n * ```tsx\n * <Command.Dialog>\n *   <Command.Input placeholder=\"Type a command or search...\" />\n *   <Command.List>\n *     <Command.Empty>No results found.</Command.Empty>\n *     <Command.Group heading=\"Suggestions\">\n *       <Command.Item>\n *         <span>Calendar</span>\n *       </Command.Item>\n *     </Command.Group>\n *     <Command.Separator />\n *     <Command.Group heading=\"Settings\">\n *       <Command.Item>\n *         <span>Profile</span>\n *       </Command.Item>\n *     </Command.Group>\n *   </Command.List>\n * </Command.Dialog>\n */\nconst CommandDialog = ({\n\tchildren,\n\tclassName,\n\tdescription = \"Search for a command to run...\",\n\tfilter,\n\tshouldFilter,\n\tshowCloseButton = true,\n\ttitle = \"Command Palette\",\n\t...props\n}: CommandDialogProps) => (\n\t<Dialog.Root {...props}>\n\t\t<Dialog.Header className=\"sr-only absolute\">\n\t\t\t<Dialog.Title>{title}</Dialog.Title>\n\t\t\t<Dialog.Description>{description}</Dialog.Description>\n\t\t</Dialog.Header>\n\t\t<Dialog.Content className={cx(\"overflow-hidden p-0 relative\", className)}>\n\t\t\t<CommandRoot\n\t\t\t\tclassName=\"**:[[cmdk-group-heading]]:text-muted **:data-[slot=command-input-wrapper]:h-12 **:[[cmdk-group-heading]]:px-2 **:[[cmdk-group-heading]]:font-medium **:[[cmdk-group]]:px-2 [&_[cmdk-group]:not([hidden])_~[cmdk-group]]:pt-0 [&_[cmdk-input-wrapper]_svg]:h-5 [&_[cmdk-input-wrapper]_svg]:w-5 **:[[cmdk-input]]:h-12 **:[[cmdk-item]]:px-2 **:[[cmdk-item]]:py-3 [&_[cmdk-item]_svg]:h-5 [&_[cmdk-item]_svg]:w-5\"\n\t\t\t\tfilter={filter}\n\t\t\t\tshouldFilter={shouldFilter}\n\t\t\t>\n\t\t\t\t{children}\n\t\t\t</CommandRoot>\n\t\t\t{showCloseButton && (\n\t\t\t\t<div className=\"absolute top-1.5 right-1.5\">\n\t\t\t\t\t<Dialog.CloseIconButton />\n\t\t\t\t</div>\n\t\t\t)}\n\t\t</Dialog.Content>\n\t</Dialog.Root>\n);\nCommandDialog.displayName = \"CommandDialog\";\n\n/**\n * The input component for the Command. It provides the input for the command palette.\n *\n * @see https://mantle.ngrok.com/components/preview/command#api-command-input\n *\n * @example\n * ```tsx\n * <Command.Dialog>\n *   <Command.Input placeholder=\"Type a command or search...\" />\n *   <Command.List>\n *     <Command.Empty>No results found.</Command.Empty>\n *     <Command.Group heading=\"Suggestions\">\n *       <Command.Item>\n *         <span>Calendar</span>\n *       </Command.Item>\n *     </Command.Group>\n *     <Command.Separator />\n *     <Command.Group heading=\"Settings\">\n *       <Command.Item>\n *         <span>Profile</span>\n *       </Command.Item>\n *     </Command.Group>\n *   </Command.List>\n * </Command.Dialog>\n */\nconst CommandInput = forwardRef<\n\tComponentRef<\"div\">,\n\tComponentPropsWithoutRef<typeof CommandPrimitive.Input>\n>(({ className, ...props }, ref) => (\n\t<div\n\t\tref={ref}\n\t\tdata-slot=\"command-input-wrapper\"\n\t\tclassName=\"flex h-9 items-center gap-2 border-b border-popover px-3\"\n\t>\n\t\t<MagnifyingGlassIcon className=\"size-4 shrink-0 opacity-50\" />\n\t\t<CommandPrimitive.Input\n\t\t\tdata-slot=\"command-input\"\n\t\t\tclassName={cx(\n\t\t\t\t\"placeholder:text-muted flex h-10 w-full rounded-md bg-transparent py-3 text-sm outline-hidden disabled:cursor-not-allowed disabled:opacity-50\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t</div>\n));\nCommandInput.displayName = \"CommandInput\";\n\n/**\n * The list component for the Command. It provides the list for the command palette.\n *\n * @see https://mantle.ngrok.com/components/preview/command#api-command-list\n *\n * @example\n * ```tsx\n * <Command.Dialog>\n *   <Command.Input placeholder=\"Type a command or search...\" />\n *   <Command.List>\n *     <Command.Empty>No results found.</Command.Empty>\n *     <Command.Group heading=\"Suggestions\">\n *       <Command.Item>\n *         <span>Calendar</span>\n *       </Command.Item>\n *     </Command.Group>\n *     <Command.Separator />\n *     <Command.Group heading=\"Settings\">\n *       <Command.Item>\n *         <span>Profile</span>\n *       </Command.Item>\n *     </Command.Group>\n *   </Command.List>\n * </Command.Dialog>\n */\nconst CommandList = forwardRef<\n\tComponentRef<\"div\">,\n\tComponentPropsWithoutRef<typeof CommandPrimitive.List>\n>(({ className, ...props }, ref) => (\n\t<CommandPrimitive.List\n\t\tref={ref}\n\t\tdata-slot=\"command-list\"\n\t\tclassName={cx(\n\t\t\t\"max-h-[300px] scroll-py-1 overflow-x-hidden overflow-y-auto scrollbar\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t/>\n));\nCommandList.displayName = \"CommandList\";\n\n/**\n * The empty component for the Command. It provides the empty state for the command palette.\n *\n * @see https://mantle.ngrok.com/components/preview/command#api-command-empty\n *\n * @example\n * ```tsx\n * <Command.Dialog>\n *   <Command.Input placeholder=\"Type a command or search...\" />\n *   <Command.List>\n *     <Command.Empty>No results found.</Command.Empty>\n *     <Command.Group heading=\"Suggestions\">\n *       <Command.Item>\n *         <span>Calendar</span>\n *       </Command.Item>\n *     </Command.Group>\n *     <Command.Separator />\n *     <Command.Group heading=\"Settings\">\n *       <Command.Item>\n *         <span>Profile</span>\n *       </Command.Item>\n *     </Command.Group>\n *   </Command.List>\n * </Command.Dialog>\n */\nconst CommandEmpty = forwardRef<\n\tComponentRef<\"div\">,\n\tComponentPropsWithoutRef<typeof CommandPrimitive.Empty>\n>(({ className, ...props }, ref) => (\n\t<CommandPrimitive.Empty\n\t\tref={ref}\n\t\tdata-slot=\"command-empty\"\n\t\tclassName=\"py-6 text-center text-sm\"\n\t\t{...props}\n\t/>\n));\nCommandEmpty.displayName = \"CommandEmpty\";\n\n/**\n * The group component for the Command. It provides the group for the command palette.\n *\n * @see https://mantle.ngrok.com/components/preview/command#api-command-group\n *\n * @example\n * ```tsx\n * <Command.Dialog>\n *   <Command.Input placeholder=\"Type a command or search...\" />\n *   <Command.List>\n *     <Command.Empty>No results found.</Command.Empty>\n *     <Command.Group heading=\"Suggestions\">\n *       <Command.Item>\n *         <span>Calendar</span>\n *       </Command.Item>\n *     </Command.Group>\n *     <Command.Separator />\n *     <Command.Group heading=\"Settings\">\n *       <Command.Item>\n *         <span>Profile</span>\n *       </Command.Item>\n *     </Command.Group>\n *   </Command.List>\n * </Command.Dialog>\n */\nconst CommandGroup = forwardRef<\n\tComponentRef<\"div\">,\n\tComponentPropsWithoutRef<typeof CommandPrimitive.Group>\n>(({ className, ...props }, ref) => (\n\t<CommandPrimitive.Group\n\t\tref={ref}\n\t\tdata-slot=\"command-group\"\n\t\tclassName={cx(\n\t\t\t\"**:[[cmdk-group-heading]]:text-muted overflow-hidden p-1 **:[[cmdk-group-heading]]:px-2 **:[[cmdk-group-heading]]:py-1.5 **:[[cmdk-group-heading]]:text-xs **:[[cmdk-group-heading]]:font-medium\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t/>\n));\nCommandGroup.displayName = \"CommandGroup\";\n\n/**\n * The separator component for the Command. It provides the separator for the command palette.\n *\n * @see https://mantle.ngrok.com/components/preview/command#api-command-separator\n *\n * @example\n * ```tsx\n * <Command.Dialog>\n *   <Command.Input placeholder=\"Type a command or search...\" />\n *   <Command.List>\n *     <Command.Empty>No results found.</Command.Empty>\n *     <Command.Group heading=\"Suggestions\">\n *       <Command.Item>\n *         <span>Calendar</span>\n *       </Command.Item>\n *     </Command.Group>\n *     <Command.Separator />\n *     <Command.Group heading=\"Settings\">\n *       <Command.Item>\n *         <span>Profile</span>\n *       </Command.Item>\n *     </Command.Group>\n *   </Command.List>\n * </Command.Dialog>\n */\nconst CommandSeparator = forwardRef<\n\tComponentRef<\"div\">,\n\tComponentPropsWithoutRef<typeof CommandPrimitive.Separator>\n>(({ className, ...props }, ref) => (\n\t<CommandPrimitive.Separator\n\t\tref={ref}\n\t\tdata-slot=\"command-separator\"\n\t\tclassName={cx(\n\t\t\t\"dark-high-contrast:bg-black high-contrast:bg-black bg-gray-500/20 dark:bg-gray-600/20 -mx-1 h-px\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t/>\n));\nCommandSeparator.displayName = \"CommandSeparator\";\n\n/**\n * The item component for the Command. It provides the item for the command palette.\n *\n * @see https://mantle.ngrok.com/components/preview/command#api-command-item\n *\n * @example\n * ```tsx\n * <Command.Dialog>\n *   <Command.Input placeholder=\"Type a command or search...\" />\n *   <Command.List>\n *     <Command.Empty>No results found.</Command.Empty>\n *     <Command.Group heading=\"Suggestions\">\n *       <Command.Item>\n *         <span>Calendar</span>\n *       </Command.Item>\n *     </Command.Group>\n *     <Command.Separator />\n *     <Command.Group heading=\"Settings\">\n *       <Command.Item>\n *         <span>Profile</span>\n *       </Command.Item>\n *     </Command.Group>\n *   </Command.List>\n * </Command.Dialog>\n */\nconst CommandItem = forwardRef<\n\tComponentRef<\"div\">,\n\tComponentPropsWithoutRef<typeof CommandPrimitive.Item>\n>(({ className, ...props }, ref) => (\n\t<CommandPrimitive.Item\n\t\tref={ref}\n\t\tdata-slot=\"command-item\"\n\t\tclassName={cx(\n\t\t\t\"data-[selected=true]:bg-popover-hover [&_svg:not([class*='text-'])]:text-muted relative flex cursor-pointer items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none data-[disabled=true]:pointer-events-none data-[disabled=true]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t/>\n));\nCommandItem.displayName = \"CommandItem\";\n\n/**\n * The shortcut component for the Command. It provides the shortcut for the command palette.\n *\n * @see https://mantle.ngrok.com/components/preview/command#api-command-shortcut\n *\n * @example\n * ```tsx\n * <Command.Dialog>\n *   <Command.Input placeholder=\"Type a command or search...\" />\n *   <Command.List>\n *     <Command.Empty>No results found.</Command.Empty>\n *     <Command.Group heading=\"Suggestions\">\n *       <Command.Item>\n *         <span>Calendar</span>\n *       </Command.Item>\n *     </Command.Group>\n *     <Command.Separator />\n *     <Command.Group heading=\"Settings\">\n *       <Command.Item>\n *         <span>Profile</span>\n *         <Command.Shortcut>⌘,</Command.Shortcut>\n *       </Command.Item>\n *     </Command.Group>\n *   </Command.List>\n * </Command.Dialog>\n */\nconst CommandShortcut = forwardRef<\n\tComponentRef<\"span\">,\n\tComponentPropsWithoutRef<\"span\">\n>(({ className, ...props }, ref) => (\n\t<span\n\t\tref={ref}\n\t\tdata-slot=\"command-shortcut\"\n\t\tclassName={cx(\"text-muted ml-auto text-xs tracking-widest\", className)}\n\t\t{...props}\n\t/>\n));\nCommandShortcut.displayName = \"CommandShortcut\";\n\n/**\n * The command component for the Command. It provides the command for the command palette.\n *\n * @see https://mantle.ngrok.com/components/preview/command#api-command\n *\n * @example\n * ```tsx\n * <Command.Dialog>\n *   <Command.Input placeholder=\"Type a command or search...\" />\n *   <Command.List>\n *     <Command.Empty>No results found.</Command.Empty>\n *     <Command.Group heading=\"Suggestions\">\n *       <Command.Item>\n *         <span>Calendar</span>\n *       </Command.Item>\n *     </Command.Group>\n *     <Command.Separator />\n *     <Command.Group heading=\"Settings\">\n *       <Command.Item>\n *         <span>Profile</span>\n *       </Command.Item>\n *     </Command.Group>\n *   </Command.List>\n * </Command.Dialog>\n */\nconst Command = {\n\t/**\n\t * The root component for the Command component.\n\t *\n\t * @see https://mantle.ngrok.com/components/preview/command#api-command-root\n\t *\n\t * @example\n\t * ```tsx\n\t * <Command.Root>\n\t *   <Command.Input placeholder=\"Type a command or search...\" />\n\t *   <Command.List>\n\t *     <Command.Empty>No results found.</Command.Empty>\n\t *   </Command.List>\n\t * </Command.Root>\n\t * ```\n\t */\n\tRoot: CommandRoot,\n\t/**\n\t * The dialog component for the Command component.\n\t *\n\t * @see https://mantle.ngrok.com/components/preview/command#api-command-dialog\n\t *\n\t * @example\n\t * ```tsx\n\t * <Command.Dialog>\n\t *   <Command.Input placeholder=\"Type a command or search...\" />\n\t *   <Command.List>\n\t *     <Command.Empty>No results found.</Command.Empty>\n\t *   </Command.List>\n\t * </Command.Dialog>\n\t * ```\n\t */\n\tDialog: CommandDialog,\n\t/**\n\t * The input component for the Command component.\n\t *\n\t * @see https://mantle.ngrok.com/components/preview/command#api-command-input\n\t *\n\t * @example\n\t * ```tsx\n\t * <Command.Input placeholder=\"Type a command or search...\" />\n\t * ```\n\t */\n\tInput: CommandInput,\n\t/**\n\t * The list component for the Command component.\n\t *\n\t * @see https://mantle.ngrok.com/components/preview/command#api-command-list\n\t *\n\t * @example\n\t * ```tsx\n\t * <Command.List>\n\t *   <Command.Empty>No results found.</Command.Empty>\n\t * </Command.List>\n\t */\n\tList: CommandList,\n\t/**\n\t * The empty component for the Command component.\n\t *\n\t * @see https://mantle.ngrok.com/components/preview/command#api-command-empty\n\t *\n\t * @example\n\t * ```tsx\n\t * <Command.Empty>No results found.</Command.Empty>\n\t * ```\n\t */\n\tEmpty: CommandEmpty,\n\t/**\n\t * The group component for the Command component.\n\t *\n\t * @see https://mantle.ngrok.com/components/preview/command#api-command-group\n\t *\n\t * @example\n\t * ```tsx\n\t * <Command.Group heading=\"Suggestions\">\n\t *   <Command.Item>\n\t *     Calendar\n\t *   </Command.Item>\n\t * </Command.Group>\n\t * ```\n\t */\n\tGroup: CommandGroup,\n\t/**\n\t * The item component for the Command component.\n\t *\n\t * @see https://mantle.ngrok.com/components/preview/command#api-command-item\n\t *\n\t * @example\n\t * ```tsx\n\t * <Command.Item>\n\t *   Calendar\n\t * </Command.Item>\n\t * ```\n\t */\n\tItem: CommandItem,\n\t/**\n\t * The shortcut component for the Command component.\n\t *\n\t * @see https://mantle.ngrok.com/components/preview/command#api-command-shortcut\n\t *\n\t * @example\n\t * ```tsx\n\t * <Command.Shortcut>⌘,</Command.Shortcut>\n\t * ```\n\t */\n\tShortcut: CommandShortcut,\n\t/**\n\t * The seprator component for the Command component.\n\t *\n\t * @see https://mantle.ngrok.com/components/preview/command#api-command-separator\n\t *\n\t * @example\n\t * ```tsx\n\t * <Command.Separator />\n\t * ```\n\t */\n\tSeparator: CommandSeparator,\n} as const;\n\nexport {\n\t//,\n\tCommand,\n\tuseCommandState,\n};\n","import { type ComponentProps, useEffect, useState } from \"react\";\nimport { cx } from \"../../utils/cx/cx.js\";\nimport { Kbd } from \"../kbd/kbd.js\";\n\ntype Props = Omit<ComponentProps<\"kbd\">, \"children\">;\n\ntype Mod = \"⌘\" | \"⌃\";\n\n/**\n * Renders the platform-appropriate meta key kbd (⌘ or ⌃).\n *\n * - Initializes to `\"⌃\"` to avoid SSR mismatch.\n * - Updates on mount using `detectMetaKey()`.\n */\nfunction MetaKey({ className, ...props }: Props) {\n\tconst [glyph, setGlyph] = useState<Mod>(\"⌃\");\n\n\tuseEffect(() => {\n\t\tsetGlyph(detectMetaKey());\n\t}, []);\n\n\tconst label = glyph === \"⌘\" ? \"Command\" : \"Control\";\n\n\treturn (\n\t\t<Kbd\n\t\t\t{...props}\n\t\t\tsuppressHydrationWarning\n\t\t\tclassName={cx(glyph === \"⌃\" && \"font-medium\", className)}\n\t\t>\n\t\t\t<span className=\"sr-only\">{label}</span>\n\t\t\t{glyph}\n\t\t</Kbd>\n\t);\n}\n\nexport {\n\t//,\n\tMetaKey,\n};\n\n/**\n * Type guard for `navigator.userAgentData` existence.\n * Useful for newer UA hints where `platform` may be available.\n *\n * @param navigator The global `navigator`\n * @returns `true` if UA Data hints exist; narrows `navigator` accordingly.\n */\nfunction hasUAData(\n\tnavigator: Navigator,\n): navigator is Navigator & { userAgentData: { platform?: string } } {\n\treturn \"userAgentData\" in navigator;\n}\n\n/**\n * Detects the appropriate meta key label for the current platform.\n *\n * SSR-safe: returns `\"⌃\"` when `navigator` is not available.\n *\n * @returns `\"⌘\"` for Apple platforms; otherwise `\"⌃\"`.\n */\nfunction detectMetaKey(): Mod {\n\tif (typeof navigator === \"undefined\") {\n\t\treturn \"⌃\"; // SSR default\n\t}\n\n\tlet platform = \"\";\n\n\tif (hasUAData(navigator)) {\n\t\tplatform = navigator.userAgentData.platform ?? \"\";\n\t}\n\n\tif (!platform) {\n\t\tplatform = navigator.platform || navigator.userAgent || \"\";\n\t}\n\n\tconst isApple = /mac|iphone|ipad|ipod/i.test(platform);\n\n\tif (isApple) {\n\t\treturn \"⌘\";\n\t}\n\n\treturn \"⌃\";\n}\n"],"mappings":"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","names":["MagnifyingGlassIcon","CommandPrimitive","useCommandState","forwardRef","jsx","jsxs","CommandRoot","forwardRef","className","props","ref","CommandPrimitive","cx","CommandDialog","children","description","filter","shouldFilter","showCloseButton","title","Dialog","CommandInput","MagnifyingGlassIcon","CommandList","CommandEmpty","CommandGroup","CommandSeparator","CommandItem","CommandShortcut","Command","useEffect","useState","jsx","jsxs","MetaKey","className","props","glyph","setGlyph","useState","useEffect","detectMetaKey","label","Kbd","cx","hasUAData","navigator","detectMetaKey","platform"]}
+{"version":3,"sources":["../src/components/command/command.tsx","../src/components/command/meta-key.tsx"],"sourcesContent":["\"use client\";\n\nimport { MagnifyingGlassIcon } from \"@phosphor-icons/react/MagnifyingGlass\";\nimport { Command as CommandPrimitive, useCommandState } from \"cmdk\";\n\nimport { type ComponentPropsWithoutRef, type ComponentRef, forwardRef } from \"react\";\nimport { cx } from \"../../utils/cx/cx.js\";\nimport { Dialog } from \"../dialog/dialog.js\";\n\ntype CommandRootProps = ComponentPropsWithoutRef<typeof CommandPrimitive>;\n\n/**\n * The root component for the Command. It provides the context for all other command sub-components.\n *\n * @see https://mantle.ngrok.com/components/preview/command#api-command-root\n *\n * @example\n * ```tsx\n * <Command.Root>\n *   <Command.Input placeholder=\"Type a command or search...\" />\n *   <Command.List>\n *     <Command.Empty>No results found.</Command.Empty>\n *     <Command.Group heading=\"Suggestions\">\n *       <Command.Item>\n *         <span>Calendar</span>\n *       </Command.Item>\n *     </Command.Group>\n *     <Command.Separator />\n *     <Command.Group heading=\"Settings\">\n *       <Command.Item>\n *         <span>Profile</span>\n *       </Command.Item>\n *     </Command.Group>\n *   </Command.List>\n * </Command.Root>\n */\nconst CommandRoot = forwardRef<ComponentRef<\"div\">, CommandRootProps>(\n\t({ className, ...props }, ref) => (\n\t\t<CommandPrimitive\n\t\t\tref={ref}\n\t\t\tdata-slot=\"command\"\n\t\t\tclassName={cx(\"bg-popover flex h-full w-full flex-col overflow-hidden rounded-md\", className)}\n\t\t\t{...props}\n\t\t/>\n\t),\n);\nCommandRoot.displayName = \"Command\";\n\n/**\n * The props for the CommandDialog component.\n *\n * @see https://mantle.ngrok.com/components/preview/command#api-command-dialog\n */\ntype CommandDialogProps = ComponentPropsWithoutRef<typeof Dialog.Root> & {\n\t/**\n\t * The title of the command dialog.\n\t */\n\ttitle?: string;\n\t/**\n\t * The description of the command dialog.\n\t */\n\tdescription?: string;\n\t/**\n\t * Class name(s) to apply to the command dialog content.\n\t */\n\tclassName?: string;\n\t/**\n\t * Whether to show the close button.\n\t */\n\tshowCloseButton?: boolean;\n\t/**\n\t * Custom filter function for the command list.\n\t *\n\t * @see https://github.com/pacocoursey/cmdk?tab=readme-ov-file#filtering\n\t */\n\tfilter?: CommandRootProps[\"filter\"];\n\t/**\n\t * Whether to enable filtering of command items. When false, disables built-in filtering.\n\t *\n\t * @see https://github.com/pacocoursey/cmdk?tab=readme-ov-file#filtering\n\t */\n\tshouldFilter?: CommandRootProps[\"shouldFilter\"];\n};\n\n/**\n * A window overlaid on either the primary window or another dialog window.\n * The root stateful component for the CommandDialog.\n *\n * @see https://mantle.ngrok.com/components/preview/command#api-command-dialog\n *\n * @example\n * ```tsx\n * <Command.Dialog>\n *   <Command.Input placeholder=\"Type a command or search...\" />\n *   <Command.List>\n *     <Command.Empty>No results found.</Command.Empty>\n *     <Command.Group heading=\"Suggestions\">\n *       <Command.Item>\n *         <span>Calendar</span>\n *       </Command.Item>\n *     </Command.Group>\n *     <Command.Separator />\n *     <Command.Group heading=\"Settings\">\n *       <Command.Item>\n *         <span>Profile</span>\n *       </Command.Item>\n *     </Command.Group>\n *   </Command.List>\n * </Command.Dialog>\n */\nconst CommandDialog = ({\n\tchildren,\n\tclassName,\n\tdescription = \"Search for a command to run...\",\n\tfilter,\n\tshouldFilter,\n\tshowCloseButton = true,\n\ttitle = \"Command Palette\",\n\t...props\n}: CommandDialogProps) => (\n\t<Dialog.Root {...props}>\n\t\t<Dialog.Header className=\"sr-only absolute\">\n\t\t\t<Dialog.Title>{title}</Dialog.Title>\n\t\t\t<Dialog.Description>{description}</Dialog.Description>\n\t\t</Dialog.Header>\n\t\t<Dialog.Content className={cx(\"overflow-hidden p-0 relative\", className)}>\n\t\t\t<CommandRoot\n\t\t\t\tclassName=\"**:[[cmdk-group-heading]]:text-muted **:data-[slot=command-input-wrapper]:h-12 **:[[cmdk-group-heading]]:px-2 **:[[cmdk-group-heading]]:font-medium **:[[cmdk-group]]:px-2 [&_[cmdk-group]:not([hidden])_~[cmdk-group]]:pt-0 [&_[cmdk-input-wrapper]_svg]:h-5 [&_[cmdk-input-wrapper]_svg]:w-5 **:[[cmdk-input]]:h-12 **:[[cmdk-item]]:px-2 **:[[cmdk-item]]:py-3 [&_[cmdk-item]_svg]:h-5 [&_[cmdk-item]_svg]:w-5\"\n\t\t\t\tfilter={filter}\n\t\t\t\tshouldFilter={shouldFilter}\n\t\t\t>\n\t\t\t\t{children}\n\t\t\t</CommandRoot>\n\t\t\t{showCloseButton && (\n\t\t\t\t<div className=\"absolute top-1.5 right-1.5\">\n\t\t\t\t\t<Dialog.CloseIconButton />\n\t\t\t\t</div>\n\t\t\t)}\n\t\t</Dialog.Content>\n\t</Dialog.Root>\n);\nCommandDialog.displayName = \"CommandDialog\";\n\n/**\n * The input component for the Command. It provides the input for the command palette.\n *\n * @see https://mantle.ngrok.com/components/preview/command#api-command-input\n *\n * @example\n * ```tsx\n * <Command.Dialog>\n *   <Command.Input placeholder=\"Type a command or search...\" />\n *   <Command.List>\n *     <Command.Empty>No results found.</Command.Empty>\n *     <Command.Group heading=\"Suggestions\">\n *       <Command.Item>\n *         <span>Calendar</span>\n *       </Command.Item>\n *     </Command.Group>\n *     <Command.Separator />\n *     <Command.Group heading=\"Settings\">\n *       <Command.Item>\n *         <span>Profile</span>\n *       </Command.Item>\n *     </Command.Group>\n *   </Command.List>\n * </Command.Dialog>\n */\nconst CommandInput = forwardRef<\n\tComponentRef<\"div\">,\n\tComponentPropsWithoutRef<typeof CommandPrimitive.Input>\n>(({ className, ...props }, ref) => (\n\t<div\n\t\tref={ref}\n\t\tdata-slot=\"command-input-wrapper\"\n\t\tclassName=\"flex h-9 items-center gap-2 border-b border-popover px-3\"\n\t>\n\t\t<MagnifyingGlassIcon className=\"size-4 shrink-0 opacity-50\" />\n\t\t<CommandPrimitive.Input\n\t\t\tdata-slot=\"command-input\"\n\t\t\tclassName={cx(\n\t\t\t\t\"placeholder:text-muted flex h-10 w-full rounded-md bg-transparent py-3 text-sm outline-hidden disabled:cursor-not-allowed disabled:opacity-50\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t</div>\n));\nCommandInput.displayName = \"CommandInput\";\n\n/**\n * The list component for the Command. It provides the list for the command palette.\n *\n * @see https://mantle.ngrok.com/components/preview/command#api-command-list\n *\n * @example\n * ```tsx\n * <Command.Dialog>\n *   <Command.Input placeholder=\"Type a command or search...\" />\n *   <Command.List>\n *     <Command.Empty>No results found.</Command.Empty>\n *     <Command.Group heading=\"Suggestions\">\n *       <Command.Item>\n *         <span>Calendar</span>\n *       </Command.Item>\n *     </Command.Group>\n *     <Command.Separator />\n *     <Command.Group heading=\"Settings\">\n *       <Command.Item>\n *         <span>Profile</span>\n *       </Command.Item>\n *     </Command.Group>\n *   </Command.List>\n * </Command.Dialog>\n */\nconst CommandList = forwardRef<\n\tComponentRef<\"div\">,\n\tComponentPropsWithoutRef<typeof CommandPrimitive.List>\n>(({ className, ...props }, ref) => (\n\t<CommandPrimitive.List\n\t\tref={ref}\n\t\tdata-slot=\"command-list\"\n\t\tclassName={cx(\"max-h-75 scroll-py-1 overflow-x-hidden overflow-y-auto scrollbar\", className)}\n\t\t{...props}\n\t/>\n));\nCommandList.displayName = \"CommandList\";\n\n/**\n * The empty component for the Command. It provides the empty state for the command palette.\n *\n * @see https://mantle.ngrok.com/components/preview/command#api-command-empty\n *\n * @example\n * ```tsx\n * <Command.Dialog>\n *   <Command.Input placeholder=\"Type a command or search...\" />\n *   <Command.List>\n *     <Command.Empty>No results found.</Command.Empty>\n *     <Command.Group heading=\"Suggestions\">\n *       <Command.Item>\n *         <span>Calendar</span>\n *       </Command.Item>\n *     </Command.Group>\n *     <Command.Separator />\n *     <Command.Group heading=\"Settings\">\n *       <Command.Item>\n *         <span>Profile</span>\n *       </Command.Item>\n *     </Command.Group>\n *   </Command.List>\n * </Command.Dialog>\n */\nconst CommandEmpty = forwardRef<\n\tComponentRef<\"div\">,\n\tComponentPropsWithoutRef<typeof CommandPrimitive.Empty>\n>(({ className, ...props }, ref) => (\n\t<CommandPrimitive.Empty\n\t\tref={ref}\n\t\tdata-slot=\"command-empty\"\n\t\tclassName={cx(\"py-6 text-center text-sm\", className)}\n\t\t{...props}\n\t/>\n));\nCommandEmpty.displayName = \"CommandEmpty\";\n\n/**\n * The group component for the Command. It provides the group for the command palette.\n *\n * @see https://mantle.ngrok.com/components/preview/command#api-command-group\n *\n * @example\n * ```tsx\n * <Command.Dialog>\n *   <Command.Input placeholder=\"Type a command or search...\" />\n *   <Command.List>\n *     <Command.Empty>No results found.</Command.Empty>\n *     <Command.Group heading=\"Suggestions\">\n *       <Command.Item>\n *         <span>Calendar</span>\n *       </Command.Item>\n *     </Command.Group>\n *     <Command.Separator />\n *     <Command.Group heading=\"Settings\">\n *       <Command.Item>\n *         <span>Profile</span>\n *       </Command.Item>\n *     </Command.Group>\n *   </Command.List>\n * </Command.Dialog>\n */\nconst CommandGroup = forwardRef<\n\tComponentRef<\"div\">,\n\tComponentPropsWithoutRef<typeof CommandPrimitive.Group>\n>(({ className, ...props }, ref) => (\n\t<CommandPrimitive.Group\n\t\tref={ref}\n\t\tdata-slot=\"command-group\"\n\t\tclassName={cx(\n\t\t\t\"**:[[cmdk-group-heading]]:text-muted overflow-hidden p-1 **:[[cmdk-group-heading]]:px-2 **:[[cmdk-group-heading]]:py-1.5 **:[[cmdk-group-heading]]:text-xs **:[[cmdk-group-heading]]:font-medium\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t/>\n));\nCommandGroup.displayName = \"CommandGroup\";\n\n/**\n * The separator component for the Command. It provides the separator for the command palette.\n *\n * @see https://mantle.ngrok.com/components/preview/command#api-command-separator\n *\n * @example\n * ```tsx\n * <Command.Dialog>\n *   <Command.Input placeholder=\"Type a command or search...\" />\n *   <Command.List>\n *     <Command.Empty>No results found.</Command.Empty>\n *     <Command.Group heading=\"Suggestions\">\n *       <Command.Item>\n *         <span>Calendar</span>\n *       </Command.Item>\n *     </Command.Group>\n *     <Command.Separator />\n *     <Command.Group heading=\"Settings\">\n *       <Command.Item>\n *         <span>Profile</span>\n *       </Command.Item>\n *     </Command.Group>\n *   </Command.List>\n * </Command.Dialog>\n */\nconst CommandSeparator = forwardRef<\n\tComponentRef<\"div\">,\n\tComponentPropsWithoutRef<typeof CommandPrimitive.Separator>\n>(({ className, ...props }, ref) => (\n\t<CommandPrimitive.Separator\n\t\tref={ref}\n\t\tdata-slot=\"command-separator\"\n\t\tclassName={cx(\n\t\t\t\"dark-high-contrast:bg-black high-contrast:bg-black bg-gray-500/20 dark:bg-gray-600/20 -mx-1 h-px\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t/>\n));\nCommandSeparator.displayName = \"CommandSeparator\";\n\n/**\n * The item component for the Command. It provides the item for the command palette.\n *\n * @see https://mantle.ngrok.com/components/preview/command#api-command-item\n *\n * @example\n * ```tsx\n * <Command.Dialog>\n *   <Command.Input placeholder=\"Type a command or search...\" />\n *   <Command.List>\n *     <Command.Empty>No results found.</Command.Empty>\n *     <Command.Group heading=\"Suggestions\">\n *       <Command.Item>\n *         <span>Calendar</span>\n *       </Command.Item>\n *     </Command.Group>\n *     <Command.Separator />\n *     <Command.Group heading=\"Settings\">\n *       <Command.Item>\n *         <span>Profile</span>\n *       </Command.Item>\n *     </Command.Group>\n *   </Command.List>\n * </Command.Dialog>\n */\nconst CommandItem = forwardRef<\n\tComponentRef<\"div\">,\n\tComponentPropsWithoutRef<typeof CommandPrimitive.Item>\n>(({ className, ...props }, ref) => (\n\t<CommandPrimitive.Item\n\t\tref={ref}\n\t\tdata-slot=\"command-item\"\n\t\tclassName={cx(\n\t\t\t\"data-[selected=true]:bg-popover-hover [&_svg:not([class*='text-'])]:text-muted relative flex cursor-pointer items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none data-[disabled=true]:pointer-events-none data-[disabled=true]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t/>\n));\nCommandItem.displayName = \"CommandItem\";\n\n/**\n * The shortcut component for the Command. It provides the shortcut for the command palette.\n *\n * @see https://mantle.ngrok.com/components/preview/command#api-command-shortcut\n *\n * @example\n * ```tsx\n * <Command.Dialog>\n *   <Command.Input placeholder=\"Type a command or search...\" />\n *   <Command.List>\n *     <Command.Empty>No results found.</Command.Empty>\n *     <Command.Group heading=\"Suggestions\">\n *       <Command.Item>\n *         <span>Calendar</span>\n *       </Command.Item>\n *     </Command.Group>\n *     <Command.Separator />\n *     <Command.Group heading=\"Settings\">\n *       <Command.Item>\n *         <span>Profile</span>\n *         <Command.Shortcut>⌘,</Command.Shortcut>\n *       </Command.Item>\n *     </Command.Group>\n *   </Command.List>\n * </Command.Dialog>\n */\nconst CommandShortcut = forwardRef<ComponentRef<\"span\">, ComponentPropsWithoutRef<\"span\">>(\n\t({ className, ...props }, ref) => (\n\t\t<span\n\t\t\tref={ref}\n\t\t\tdata-slot=\"command-shortcut\"\n\t\t\tclassName={cx(\"text-muted ml-auto text-xs tracking-widest\", className)}\n\t\t\t{...props}\n\t\t/>\n\t),\n);\nCommandShortcut.displayName = \"CommandShortcut\";\n\n/**\n * The command component for the Command. It provides the command for the command palette.\n *\n * @see https://mantle.ngrok.com/components/preview/command#api-command\n *\n * @example\n * ```tsx\n * <Command.Dialog>\n *   <Command.Input placeholder=\"Type a command or search...\" />\n *   <Command.List>\n *     <Command.Empty>No results found.</Command.Empty>\n *     <Command.Group heading=\"Suggestions\">\n *       <Command.Item>\n *         <span>Calendar</span>\n *       </Command.Item>\n *     </Command.Group>\n *     <Command.Separator />\n *     <Command.Group heading=\"Settings\">\n *       <Command.Item>\n *         <span>Profile</span>\n *       </Command.Item>\n *     </Command.Group>\n *   </Command.List>\n * </Command.Dialog>\n */\nconst Command = {\n\t/**\n\t * The root component for the Command component.\n\t *\n\t * @see https://mantle.ngrok.com/components/preview/command#api-command-root\n\t *\n\t * @example\n\t * ```tsx\n\t * <Command.Root>\n\t *   <Command.Input placeholder=\"Type a command or search...\" />\n\t *   <Command.List>\n\t *     <Command.Empty>No results found.</Command.Empty>\n\t *   </Command.List>\n\t * </Command.Root>\n\t * ```\n\t */\n\tRoot: CommandRoot,\n\t/**\n\t * The dialog component for the Command component.\n\t *\n\t * @see https://mantle.ngrok.com/components/preview/command#api-command-dialog\n\t *\n\t * @example\n\t * ```tsx\n\t * <Command.Dialog>\n\t *   <Command.Input placeholder=\"Type a command or search...\" />\n\t *   <Command.List>\n\t *     <Command.Empty>No results found.</Command.Empty>\n\t *   </Command.List>\n\t * </Command.Dialog>\n\t * ```\n\t */\n\tDialog: CommandDialog,\n\t/**\n\t * The input component for the Command component.\n\t *\n\t * @see https://mantle.ngrok.com/components/preview/command#api-command-input\n\t *\n\t * @example\n\t * ```tsx\n\t * <Command.Input placeholder=\"Type a command or search...\" />\n\t * ```\n\t */\n\tInput: CommandInput,\n\t/**\n\t * The list component for the Command component.\n\t *\n\t * @see https://mantle.ngrok.com/components/preview/command#api-command-list\n\t *\n\t * @example\n\t * ```tsx\n\t * <Command.List>\n\t *   <Command.Empty>No results found.</Command.Empty>\n\t * </Command.List>\n\t */\n\tList: CommandList,\n\t/**\n\t * The empty component for the Command component.\n\t *\n\t * @see https://mantle.ngrok.com/components/preview/command#api-command-empty\n\t *\n\t * @example\n\t * ```tsx\n\t * <Command.Empty>No results found.</Command.Empty>\n\t * ```\n\t */\n\tEmpty: CommandEmpty,\n\t/**\n\t * The group component for the Command component.\n\t *\n\t * @see https://mantle.ngrok.com/components/preview/command#api-command-group\n\t *\n\t * @example\n\t * ```tsx\n\t * <Command.Group heading=\"Suggestions\">\n\t *   <Command.Item>\n\t *     Calendar\n\t *   </Command.Item>\n\t * </Command.Group>\n\t * ```\n\t */\n\tGroup: CommandGroup,\n\t/**\n\t * The item component for the Command component.\n\t *\n\t * @see https://mantle.ngrok.com/components/preview/command#api-command-item\n\t *\n\t * @example\n\t * ```tsx\n\t * <Command.Item>\n\t *   Calendar\n\t * </Command.Item>\n\t * ```\n\t */\n\tItem: CommandItem,\n\t/**\n\t * The shortcut component for the Command component.\n\t *\n\t * @see https://mantle.ngrok.com/components/preview/command#api-command-shortcut\n\t *\n\t * @example\n\t * ```tsx\n\t * <Command.Shortcut>⌘,</Command.Shortcut>\n\t * ```\n\t */\n\tShortcut: CommandShortcut,\n\t/**\n\t * The seprator component for the Command component.\n\t *\n\t * @see https://mantle.ngrok.com/components/preview/command#api-command-separator\n\t *\n\t * @example\n\t * ```tsx\n\t * <Command.Separator />\n\t * ```\n\t */\n\tSeparator: CommandSeparator,\n} as const;\n\nexport {\n\t//,\n\tCommand,\n\tuseCommandState,\n};\n","import { type ComponentProps, useEffect, useState } from \"react\";\nimport { cx } from \"../../utils/cx/cx.js\";\nimport { Kbd } from \"../kbd/kbd.js\";\n\ntype Props = Omit<ComponentProps<\"kbd\">, \"children\">;\n\ntype Mod = \"⌘\" | \"⌃\";\n\n/**\n * Renders the platform-appropriate meta key kbd (⌘ or ⌃).\n *\n * - Initializes to `\"⌃\"` to avoid SSR mismatch.\n * - Updates on mount using `detectMetaKey()`.\n */\nfunction MetaKey({ className, ...props }: Props) {\n\tconst [glyph, setGlyph] = useState<Mod>(\"⌃\");\n\n\tuseEffect(() => {\n\t\tsetGlyph(detectMetaKey());\n\t}, []);\n\n\tconst label = glyph === \"⌘\" ? \"Command\" : \"Control\";\n\n\treturn (\n\t\t<Kbd\n\t\t\t{...props}\n\t\t\tsuppressHydrationWarning\n\t\t\tclassName={cx(glyph === \"⌃\" && \"font-medium\", className)}\n\t\t>\n\t\t\t<span className=\"sr-only\">{label}</span>\n\t\t\t{glyph}\n\t\t</Kbd>\n\t);\n}\n\nexport {\n\t//,\n\tMetaKey,\n};\n\n/**\n * Type guard for `navigator.userAgentData` existence.\n * Useful for newer UA hints where `platform` may be available.\n *\n * @param navigator The global `navigator`\n * @returns `true` if UA Data hints exist; narrows `navigator` accordingly.\n */\nfunction hasUAData(\n\tnavigator: Navigator,\n): navigator is Navigator & { userAgentData: { platform?: string } } {\n\treturn \"userAgentData\" in navigator;\n}\n\n/**\n * Detects the appropriate meta key label for the current platform.\n *\n * SSR-safe: returns `\"⌃\"` when `navigator` is not available.\n *\n * @returns `\"⌘\"` for Apple platforms; otherwise `\"⌃\"`.\n */\nfunction detectMetaKey(): Mod {\n\tif (typeof navigator === \"undefined\") {\n\t\treturn \"⌃\"; // SSR default\n\t}\n\n\tlet platform = \"\";\n\n\tif (hasUAData(navigator)) {\n\t\tplatform = navigator.userAgentData.platform ?? \"\";\n\t}\n\n\tif (!platform) {\n\t\tplatform = navigator.platform || navigator.userAgent || \"\";\n\t}\n\n\tconst isApple = /mac|iphone|ipad|ipod/i.test(platform);\n\n\tif (isApple) {\n\t\treturn \"⌘\";\n\t}\n\n\treturn \"⌃\";\n}\n"],"mappings":"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","names":["MagnifyingGlassIcon","CommandPrimitive","useCommandState","forwardRef","jsx","jsxs","CommandRoot","forwardRef","className","props","ref","CommandPrimitive","cx","CommandDialog","children","description","filter","shouldFilter","showCloseButton","title","Dialog","CommandInput","MagnifyingGlassIcon","CommandList","CommandEmpty","CommandGroup","CommandSeparator","CommandItem","CommandShortcut","Command","useEffect","useState","jsx","jsxs","MetaKey","className","props","glyph","setGlyph","useState","useEffect","detectMetaKey","label","Kbd","cx","hasUAData","navigator","detectMetaKey","platform"]}

package/dist/data-table.d.ts

@@ -3,7 +3,7 @@ export * from '@tanstack/react-table';
 import * as react from 'react';
 import { ComponentProps, ReactNode } from 'react';
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { k as SortingMode } from './direction-veAOo2is.js';
+import { d as SortingMode } from './direction-DHheuUag.js';
 import { B as Button } from './button-CGzhQiwo.js';
 import { Table } from './table.js';
 import './deep-non-nullable-SmpSvoSd.js';
@@ -106,7 +106,7 @@ type DataTableHeaderProps = ComponentProps<typeof Table.Header>;
  * </DataTable.Header>
  * ```
  */
-declare function Header<TData, TValue>({ children, className, ...props }: DataTableHeaderProps): react_jsx_runtime.JSX.Element;
+declare function Header({ children, className, ...props }: DataTableHeaderProps): react_jsx_runtime.JSX.Element;
 declare namespace Header {
     var displayName: string;
 }

package/dist/data-table.js

@@ -1,2 +1,2 @@
-import{a as r}from"./chunk-STC52KT6.js";import{a as b}from"./chunk-2PHWBRBD.js";import{m}from"./chunk-GYPSB3OK.js";import"./chunk-MF2QITTY.js";import{a as D}from"./chunk-M6TUHYJA.js";import"./chunk-4LSFAAZW.js";import"./chunk-72TJUKMV.js";import"./chunk-3C5O3AQA.js";import"./chunk-2NIR7PCL.js";import"./chunk-UNFO4DZV.js";import"./chunk-NZ6DRFAL.js";import{a as c}from"./chunk-PFXFESEN.js";export*from"@tanstack/react-table";import{flexRender as S}from"@tanstack/react-table";import{Fragment as g,createContext as E,useContext as M,useMemo as j}from"react";import F from"tiny-invariant";var O=["unsorted","asc","desc"],V=["unsorted","desc","asc"];function f(t,o){return A(o==="alphanumeric"?O:V,t)??"unsorted"}function A(t,o,e){if(t.length===0)return e;let n=t.findIndex(i=>i===o);if(n===-1)return e;let l=(n+1)%t.length;return t.at(l)??e}import{jsx as a,jsxs as y}from"react/jsx-runtime";var C=E(null);function x(){let t=M(C);return F(t,"useDataTableContext should only be used within a DataTable child component"),t}function P({children:t,table:o,...e}){let n=j(()=>({table:o}),[o]);return a(C.Provider,{value:n,children:a(r.Root,{...e,children:a(r.Element,{children:t})})})}function R({children:t,className:o,column:e,disableSorting:n=!1,iconPlacement:l="end",sortingMode:i,sortIcon:B,onClick:v,..._}){let u=e.getIsSorted(),p=!n&&e.getCanSort(),s=p&&typeof u=="string"?u:"unsorted",k=B?.(s)??a(L,{mode:i,direction:s});return y(D,{appearance:"ghost",className:c("flex justify-start w-full h-full rounded-none",o),"data-sort-direction":s,"data-table-header-action":!0,icon:k,iconPlacement:l,onClick:T=>{v?.(T),!T.defaultPrevented&&(!p||n||typeof i>"u"||$(e,i))},priority:"neutral",type:"button",..._,children:[p&&s!=="unsorted"&&y("span",{className:"sr-only",children:["Column sorted in"," ",i==="alphanumeric"?s==="asc"?"ascending":"descending":m(s)," ","order"]}),t]})}function w({children:t,className:o,...e}){return a(r.Header,{className:c("has-[[data-table-header-action]]:px-0",o),...e,children:t})}var d=r.Body;d.displayName="DataTableBody";function h(t){let{table:o}=x();return a(r.Head,{...t,children:o.getHeaderGroups().map(e=>a(r.Row,{children:e.headers.map(n=>a(g,{children:n.isPlaceholder?a(r.Header,{},n.id):S(n.column.columnDef.header,n.getContext())},n.id))},e.id))})}function H({row:t,...o}){return a(r.Row,{...o,children:t.getVisibleCells().map(e=>a(g,{children:S(e.column.columnDef.cell,e.getContext())},e.id))})}function N({children:t,...o}){let{table:e}=x(),n=e.getAllColumns().length;return a(r.Row,{...o,children:a(r.Cell,{colSpan:n,children:t})})}function I({children:t,className:o,...e}){return a(r.Cell,{className:c("sticky z-10 right-0 top-px -bottom-px group-data-[sticky-active]/table:[box-shadow:inset_10px_0_8px_-8px_oklch(0_0_0_/_15%)]",o),...e,children:a("div",{className:"flex justify-end",children:t})})}P.displayName="DataTable";I.displayName="DataTableActionCell";d.displayName="DataTableBody";N.displayName="DataTableEmptyRow";h.displayName="DataTableHead";w.displayName="DataTableHeader";R.displayName="DataTableHeaderSortButton";H.displayName="DataTableRow";var z={Root:P,ActionCell:I,Cell:r.Cell,Body:d,EmptyRow:N,Head:h,Header:w,HeaderSortButton:R,Row:H};function L({direction:t,mode:o,...e}){return t==="unsorted"||!o||!t?a("svg",{"aria-hidden":!0,...e}):a(b,{mode:o,direction:t,...e})}function $(t,o){if(!t.getCanSort())return;let e=t.getIsSorted();switch(f(typeof e=="string"?e:"unsorted",o)){case"unsorted":t.clearSorting();return;case"asc":t.toggleSorting(!1);return;case"desc":t.toggleSorting(!0);return;default:return}}export{z as DataTable};
+import{a as r}from"./chunk-U5GD6FHU.js";import{a as b}from"./chunk-HL2HWYKP.js";import{m}from"./chunk-7MJQGBE4.js";import"./chunk-MF2QITTY.js";import{a as D}from"./chunk-SK2YHT6N.js";import"./chunk-4LSFAAZW.js";import"./chunk-72TJUKMV.js";import"./chunk-OP6JMBKJ.js";import"./chunk-SBVSECWW.js";import"./chunk-ODDNPNLN.js";import"./chunk-NZ6DRFAL.js";import{a as c}from"./chunk-PFXFESEN.js";export*from"@tanstack/react-table";import{flexRender as S}from"@tanstack/react-table";import{Fragment as g,createContext as E,useContext as M,useMemo as j}from"react";import F from"tiny-invariant";var _=["unsorted","asc","desc"],A=["unsorted","desc","asc"];function f(t,o){return V(o==="alphanumeric"?_:A,t)??"unsorted"}function V(t,o,e){if(t.length===0)return e;let n=t.findIndex(i=>i===o);if(n===-1)return e;let l=(n+1)%t.length;return t.at(l)??e}import{jsx as a,jsxs as y}from"react/jsx-runtime";var C=E(null);function x(){let t=M(C);return F(t,"useDataTableContext should only be used within a DataTable child component"),t}function P({children:t,table:o,...e}){let n=j(()=>({table:o}),[o]);return a(C.Provider,{value:n,children:a(r.Root,{...e,children:a(r.Element,{children:t})})})}function R({children:t,className:o,column:e,disableSorting:n=!1,iconPlacement:l="end",sortingMode:i,sortIcon:B,onClick:v,...k}){let u=e.getIsSorted(),p=!n&&e.getCanSort(),s=p&&typeof u=="string"?u:"unsorted",O=B?.(s)??a(L,{mode:i,direction:s});return y(D,{appearance:"ghost",className:c("flex justify-start w-full h-full rounded-none",o),"data-sort-direction":s,"data-table-header-action":!0,icon:O,iconPlacement:l,onClick:T=>{v?.(T),!T.defaultPrevented&&(!p||n||typeof i>"u"||$(e,i))},priority:"neutral",type:"button",...k,children:[p&&s!=="unsorted"&&y("span",{className:"sr-only",children:["Column sorted in"," ",i==="alphanumeric"?s==="asc"?"ascending":"descending":m(s)," ","order"]}),t]})}function w({children:t,className:o,...e}){return a(r.Header,{className:c("has-data-table-header-action:px-0",o),...e,children:t})}var d=r.Body;d.displayName="DataTableBody";function h(t){let{table:o}=x();return a(r.Head,{...t,children:o.getHeaderGroups().map(e=>a(r.Row,{children:e.headers.map(n=>a(g,{children:n.isPlaceholder?a(r.Header,{},n.id):S(n.column.columnDef.header,n.getContext())},n.id))},e.id))})}function H({row:t,...o}){return a(r.Row,{...o,children:t.getVisibleCells().map(e=>a(g,{children:S(e.column.columnDef.cell,e.getContext())},e.id))})}function N({children:t,...o}){let{table:e}=x(),n=e.getAllColumns().length;return a(r.Row,{...o,children:a(r.Cell,{colSpan:n,children:t})})}function I({children:t,className:o,...e}){return a(r.Cell,{className:c("sticky z-10 right-0 top-px -bottom-px group-data-sticky-active/table:[box-shadow:inset_10px_0_8px_-8px_oklch(0_0_0/15%)]",o),...e,children:a("div",{className:"flex justify-end",children:t})})}P.displayName="DataTable";I.displayName="DataTableActionCell";d.displayName="DataTableBody";N.displayName="DataTableEmptyRow";h.displayName="DataTableHead";w.displayName="DataTableHeader";R.displayName="DataTableHeaderSortButton";H.displayName="DataTableRow";var z={Root:P,ActionCell:I,Cell:r.Cell,Body:d,EmptyRow:N,Head:h,Header:w,HeaderSortButton:R,Row:H};function L({direction:t,mode:o,...e}){return t==="unsorted"||!o||!t?a("svg",{"aria-hidden":!0,...e}):a(b,{mode:o,direction:t,...e})}function $(t,o){if(!t.getCanSort())return;let e=t.getIsSorted();switch(f(typeof e=="string"?e:"unsorted",o)){case"unsorted":t.clearSorting();return;case"asc":t.toggleSorting(!1);return;case"desc":t.toggleSorting(!0);return;default:return}}export{z as DataTable};
 //# sourceMappingURL=data-table.js.map

package/dist/data-table.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/data-table/index.ts","../src/components/data-table/data-table.tsx","../src/components/data-table/helpers.ts"],"sourcesContent":["export * from \"@tanstack/react-table\";\n\nexport {\n\t//,\n\tDataTable,\n} from \"./data-table.js\";\n","import {\n\ttype Column,\n\ttype HeaderContext,\n\ttype Table as TableInstance,\n\ttype Row as TableRow,\n\tflexRender,\n} from \"@tanstack/react-table\";\nimport {\n\ttype ComponentProps,\n\tFragment,\n\ttype ReactNode,\n\tcreateContext,\n\tuseContext,\n\tuseMemo,\n} from \"react\";\nimport invariant from \"tiny-invariant\";\nimport { cx } from \"../../utils/cx/cx.js\";\nimport {\n\t$timeSortingDirection,\n\ttype SortingMode,\n} from \"../../utils/sorting/direction.js\";\nimport { Button } from \"../button/button.js\";\nimport type { SvgAttributes } from \"../icon/types.js\";\nimport { SortIcon } from \"../icons/sort.js\";\nimport { Table } from \"../table/table.js\";\nimport { getNextSortDirection } from \"./helpers.js\";\nimport type { SortDirection } from \"./types.js\";\n\ntype DataTableContextShape<TData = unknown> = {\n\ttable: TableInstance<TData>;\n};\n\nconst DataTableContext = createContext<DataTableContextShape<any> | null>(null);\n\n/**\n * @private\n */\nfunction useDataTableContext<TData>() {\n\tconst context = useContext(DataTableContext);\n\n\tinvariant(\n\t\tcontext,\n\t\t\"useDataTableContext should only be used within a DataTable child component\",\n\t);\n\n\treturn context as DataTableContextShape<TData>;\n}\n\ntype DataTableProps<TData> = ComponentProps<typeof Table.Root> & {\n\ttable: TableInstance<TData>;\n};\n\n/**\n * A data table component that provides sorting and other data table functionality.\n * Built on top of TanStack Table for advanced table features.\n *\n * @see https://mantle.ngrok.com/components/data-table#api-data-table\n *\n * @example\n * ```tsx\n * <DataTable table={table}>\n *   <DataTable.Head />\n *   <DataTable.Body>\n *     <DataTable.Rows />\n *   </DataTable.Body>\n * </DataTable>\n * ```\n */\nfunction Root<TData>({ children, table, ...props }: DataTableProps<TData>) {\n\tconst context: DataTableContextShape<TData> = useMemo(\n\t\t() => ({ table }),\n\t\t[table],\n\t);\n\n\treturn (\n\t\t<DataTableContext.Provider value={context}>\n\t\t\t<Table.Root {...props}>\n\t\t\t\t<Table.Element>{children}</Table.Element>\n\t\t\t</Table.Root>\n\t\t</DataTableContext.Provider>\n\t);\n}\n\ntype DataTableHeaderSortButtonProps<TData, TValue> = Omit<\n\tComponentProps<typeof Button>,\n\t\"icon\"\n> &\n\tPick<HeaderContext<TData, TValue>, \"column\"> &\n\t(\n\t\t| {\n\t\t\t\t/**\n\t\t\t\t * Disable sorting for this column.\n\t\t\t\t * It will prevent the sorting direction from being toggled and any icon\n\t\t\t\t * from being shown.\n\t\t\t\t */\n\t\t\t\tdisableSorting: true;\n\t\t\t\t/**\n\t\t\t\t * Use this to render a custom sort icon for the column if it is sortable\n\t\t\t\t * and you want to override the default sort icon\n\t\t\t\t */\n\t\t\t\tsortIcon?: undefined;\n\t\t\t\t/**\n\t\t\t\t * The sorting mode of the column, whether it is alphanumeric or time based.\n\t\t\t\t */\n\t\t\t\tsortingMode?: undefined;\n\t\t  }\n\t\t| {\n\t\t\t\tdisableSorting?: false;\n\t\t\t\t/**\n\t\t\t\t * Use this to render a custom sort icon for the column if it is sortable\n\t\t\t\t * and you want to override the default sort icon\n\t\t\t\t */\n\t\t\t\tsortIcon?: (sortDirection: SortDirection) => ReactNode;\n\t\t\t\t/**\n\t\t\t\t * The sorting mode of the column, whether it is alphanumeric or time based.\n\t\t\t\t */\n\t\t\t\tsortingMode: SortingMode;\n\t\t  }\n\t);\n\n/**\n * A sortable button toggle for a column header in a data table.\n * If the column is sortable, clicking the button will toggle the sorting\n * direction.\n *\n * @see https://mantle.ngrok.com/components/data-table#api-data-table-header-sort-button\n *\n * @example\n * ```tsx\n * <DataTable.HeaderSortButton\n *   column={column}\n *   sortingMode=\"alphanumeric\"\n * >\n *   Column Title\n * </DataTable.HeaderSortButton>\n * ```\n *\n * Each click cycles through:\n * - For alphanumeric sorting: unsorted ➡️ ascending ➡️ descending ➡️ unsorted\n * - For time sorting: unsorted ➡️ newest-to-oldest ➡️ oldest-to-newest ➡️ unsorted\n */\nfunction HeaderSortButton<TData, TValue>({\n\tchildren,\n\tclassName,\n\tcolumn,\n\tdisableSorting = false,\n\ticonPlacement = \"end\",\n\tsortingMode,\n\tsortIcon: propSortIcon,\n\tonClick,\n\t...props\n}: DataTableHeaderSortButtonProps<TData, TValue>) {\n\tconst _sortDirection = column.getIsSorted();\n\tconst canSort = !disableSorting && column.getCanSort();\n\n\tconst sortDirection: SortDirection =\n\t\tcanSort && typeof _sortDirection === \"string\" ? _sortDirection : \"unsorted\";\n\n\tconst sortIcon = propSortIcon?.(sortDirection) ?? (\n\t\t<DefaultSortIcon mode={sortingMode} direction={sortDirection} />\n\t);\n\n\treturn (\n\t\t<Button\n\t\t\tappearance=\"ghost\"\n\t\t\tclassName={cx(\"flex justify-start w-full h-full rounded-none\", className)}\n\t\t\tdata-sort-direction={sortDirection}\n\t\t\tdata-table-header-action\n\t\t\ticon={sortIcon}\n\t\t\ticonPlacement={iconPlacement}\n\t\t\tonClick={(event) => {\n\t\t\t\tonClick?.(event);\n\t\t\t\tif (event.defaultPrevented) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\t\t\t\tif (!canSort || disableSorting || typeof sortingMode === \"undefined\") {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\t\t\t\ttoggleNextSortingDirection(column, sortingMode);\n\t\t\t}}\n\t\t\tpriority=\"neutral\"\n\t\t\ttype=\"button\"\n\t\t\t{...props}\n\t\t>\n\t\t\t{canSort && sortDirection !== \"unsorted\" && (\n\t\t\t\t<span className=\"sr-only\">\n\t\t\t\t\tColumn sorted in{\" \"}\n\t\t\t\t\t{sortingMode === \"alphanumeric\"\n\t\t\t\t\t\t? sortDirection === \"asc\"\n\t\t\t\t\t\t\t? \"ascending\"\n\t\t\t\t\t\t\t: \"descending\"\n\t\t\t\t\t\t: $timeSortingDirection(sortDirection)}{\" \"}\n\t\t\t\t\torder\n\t\t\t\t</span>\n\t\t\t)}\n\t\t\t{children}\n\t\t</Button>\n\t);\n}\n\ntype DataTableHeaderProps = ComponentProps<typeof Table.Header>;\n\n/**\n * A header for a data table.\n * This is typically used to wrap the `DataTable.HeaderSortButton` component.\n *\n * @see https://mantle.ngrok.com/components/data-table#api-data-table-header\n *\n * @example\n * ```tsx\n * <DataTable.Header>\n *   <DataTable.HeaderSortButton column={column} sortingMode=\"alphanumeric\">\n *     Column Title\n *   </DataTable.HeaderSortButton>\n * </DataTable.Header>\n * ```\n */\nfunction Header<TData, TValue>({\n\tchildren,\n\tclassName,\n\t...props\n}: DataTableHeaderProps) {\n\treturn (\n\t\t<Table.Header\n\t\t\tclassName={cx(\"has-[[data-table-header-action]]:px-0\", className)}\n\t\t\t{...props}\n\t\t>\n\t\t\t{children}\n\t\t</Table.Header>\n\t);\n}\n\nconst Body = Table.Body;\nBody.displayName = \"DataTableBody\";\n\ntype DataTableHeadProps = Omit<ComponentProps<typeof Table.Head>, \"children\">;\n\nfunction Head<TData>(props: DataTableHeadProps) {\n\tconst { table } = useDataTableContext<TData>();\n\n\treturn (\n\t\t<Table.Head {...props}>\n\t\t\t{table.getHeaderGroups().map((headerGroup) => (\n\t\t\t\t<Table.Row key={headerGroup.id}>\n\t\t\t\t\t{headerGroup.headers.map((header) => (\n\t\t\t\t\t\t<Fragment key={header.id}>\n\t\t\t\t\t\t\t{header.isPlaceholder ? (\n\t\t\t\t\t\t\t\t<Table.Header key={header.id} />\n\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\tflexRender(header.column.columnDef.header, header.getContext())\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</Fragment>\n\t\t\t\t\t))}\n\t\t\t\t</Table.Row>\n\t\t\t))}\n\t\t</Table.Head>\n\t);\n}\n\ntype DataTableRowProps<TData> = Omit<\n\tComponentProps<typeof Table.Row>,\n\t\"children\"\n> & {\n\trow: TableRow<TData>;\n};\n\nfunction Row<TData>({ row, ...props }: DataTableRowProps<TData>) {\n\treturn (\n\t\t<Table.Row {...props}>\n\t\t\t{row.getVisibleCells().map((cell) => (\n\t\t\t\t<Fragment key={cell.id}>\n\t\t\t\t\t{flexRender(cell.column.columnDef.cell, cell.getContext())}\n\t\t\t\t</Fragment>\n\t\t\t))}\n\t\t</Table.Row>\n\t);\n}\n\ntype DataTableEmptyRowProps = ComponentProps<typeof Table.Row>;\n\nfunction EmptyRow<TData>({ children, ...props }: DataTableEmptyRowProps) {\n\tconst { table } = useDataTableContext<TData>();\n\tconst numberOfColumns = table.getAllColumns().length;\n\n\treturn (\n\t\t<Table.Row {...props}>\n\t\t\t<Table.Cell colSpan={numberOfColumns}>{children}</Table.Cell>\n\t\t</Table.Row>\n\t);\n}\n\ntype DataTableActionCellProps = ComponentProps<typeof Table.Cell>;\n\nfunction ActionCell({\n\tchildren,\n\tclassName,\n\t...props\n}: DataTableActionCellProps) {\n\treturn (\n\t\t<Table.Cell\n\t\t\tclassName={cx(\n\t\t\t\t\"sticky z-10 right-0 top-px -bottom-px group-data-[sticky-active]/table:[box-shadow:inset_10px_0_8px_-8px_oklch(0_0_0_/_15%)]\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t>\n\t\t\t<div className=\"flex justify-end\">{children}</div>\n\t\t</Table.Cell>\n\t);\n}\n\n// Set display names to preserve original component names for debugging\nRoot.displayName = \"DataTable\";\nActionCell.displayName = \"DataTableActionCell\";\nBody.displayName = \"DataTableBody\";\nEmptyRow.displayName = \"DataTableEmptyRow\";\nHead.displayName = \"DataTableHead\";\nHeader.displayName = \"DataTableHeader\";\nHeaderSortButton.displayName = \"DataTableHeaderSortButton\";\nRow.displayName = \"DataTableRow\";\n\n/**\n * A data table component that provides sorting and other data table functionality.\n * Built on top of TanStack Table for advanced table features.\n *\n * @see https://mantle.ngrok.com/components/data-table\n *\n * @example\n * ```tsx\n * <DataTable table={table}>\n *   <DataTable.Head />\n *   <DataTable.Body>\n *     <DataTable.Rows />\n *   </DataTable.Body>\n * </DataTable>\n * ```\n */\nconst DataTable = {\n\t/**\n\t * The root container of the data table component.\n\t *\n\t * @see https://mantle.ngrok.com/components/data-table#api-data-table\n\t *\n\t * @example\n\t * ```tsx\n\t * <DataTable.Root table={table}>\n\t *   <DataTable.Head />\n\t *   <DataTable.Body>\n\t *     <DataTable.Rows />\n\t *   </DataTable.Body>\n\t * </DataTable.Root>\n\t * ```\n\t */\n\tRoot,\n\t/**\n\t * A sticky action cell positioned at the end of each row for action buttons.\n\t *\n\t * @see https://mantle.ngrok.com/components/data-table#api-data-table-action-cell\n\t *\n\t * @example\n\t * ```tsx\n\t * <DataTable.ActionCell>\n\t *   <Button size=\"sm\">Edit</Button>\n\t *   <Button size=\"sm\">Delete</Button>\n\t * </DataTable.ActionCell>\n\t * ```\n\t */\n\tActionCell,\n\t/**\n\t * A table cell component for rendering individual data cells.\n\t *\n\t * @see https://mantle.ngrok.com/components/data-table#api-data-table-cell\n\t *\n\t * @example\n\t * ```tsx\n\t * <DataTable.Cell>\n\t *   Cell content\n\t * </DataTable.Cell>\n\t * ```\n\t */\n\tCell: Table.Cell,\n\t/**\n\t * The table body container for rows of data.\n\t *\n\t * @see https://mantle.ngrok.com/components/data-table#api-data-table-body\n\t *\n\t * @example\n\t * ```tsx\n\t * <DataTable.Body>\n\t *   <DataTable.Rows />\n\t * </DataTable.Body>\n\t * ```\n\t */\n\tBody,\n\t/**\n\t * An empty state row that spans all columns when there's no data to display.\n\t *\n\t * @see https://mantle.ngrok.com/components/data-table#api-data-table-empty-row\n\t *\n\t * @example\n\t * ```tsx\n\t * <DataTable.EmptyRow>\n\t *   No data available\n\t * </DataTable.EmptyRow>\n\t * ```\n\t */\n\tEmptyRow,\n\t/**\n\t * The table header container that renders column headers automatically.\n\t *\n\t * @see https://mantle.ngrok.com/components/data-table#api-data-table-head\n\t *\n\t * @example\n\t * ```tsx\n\t * <DataTable.Head />\n\t * ```\n\t */\n\tHead,\n\t/**\n\t * A header cell component optimized for data table header actions.\n\t *\n\t * @see https://mantle.ngrok.com/components/data-table#api-data-table-header\n\t *\n\t * @example\n\t * ```tsx\n\t * <DataTable.Header>\n\t *   <DataTable.HeaderSortButton column={column} sortingMode=\"alphanumeric\">\n\t *     Column Title\n\t *   </DataTable.HeaderSortButton>\n\t * </DataTable.Header>\n\t * ```\n\t */\n\tHeader,\n\t/**\n\t * A sortable button toggle for column headers with sorting functionality.\n\t *\n\t * @see https://mantle.ngrok.com/components/data-table#api-data-table-header-sort-button\n\t *\n\t * @example\n\t * ```tsx\n\t * <DataTable.HeaderSortButton\n\t *   column={column}\n\t *   sortingMode=\"alphanumeric\"\n\t * >\n\t *   Column Title\n\t * </DataTable.HeaderSortButton>\n\t * ```\n\t */\n\tHeaderSortButton,\n\t/**\n\t * A single data table row component for rendering custom row layouts.\n\t *\n\t * @see https://mantle.ngrok.com/components/data-table#api-data-table-row\n\t *\n\t * @example\n\t * ```tsx\n\t * <DataTable.Row row={row} />\n\t * ```\n\t */\n\tRow,\n} as const;\n\nexport {\n\t//,\n\tDataTable,\n};\n\ntype DefaultSortIconProps = SvgAttributes & {\n\tdirection: SortDirection | undefined;\n\tmode: SortingMode | undefined;\n};\n\nfunction DefaultSortIcon({ direction, mode, ...props }: DefaultSortIconProps) {\n\tif (direction === \"unsorted\" || !mode || !direction) {\n\t\treturn <svg aria-hidden {...props} />;\n\t}\n\n\treturn <SortIcon mode={mode} direction={direction} {...props} />;\n}\n\n/**\n * Toggle the sorting direction of a column.\n * This ordering is typically toggled by clicking the column header.\n *\n * @example\n * ```md\n * Each click cycles through...\n *\n * For alphanumeric sorting:\n *   unsorted ➡️ ascending ➡️ descending ➡️ unsorted ➡️ ...\n *\n * For time sorting:\n *   unsorted ➡️ newest-to-oldest ➡️ oldest-to-newest ➡️ unsorted ➡️ ...\n *\n *   this is equivalent to the inverse of alphanumeric sorting, or\n *   unsorted ➡️ descending ➡️ ascending ➡️ unsorted ➡️ ...\n * ```\n */\nfunction toggleNextSortingDirection<TData, TValue>(\n\tcolumn: Column<TData, TValue>,\n\tsortingMode: SortingMode,\n) {\n\tif (!column.getCanSort()) {\n\t\treturn;\n\t}\n\n\tconst sortDirection = column.getIsSorted();\n\tconst currentSortDirection: SortDirection =\n\t\ttypeof sortDirection === \"string\" ? sortDirection : \"unsorted\";\n\n\tconst nextSortDirection = getNextSortDirection(\n\t\tcurrentSortDirection,\n\t\tsortingMode,\n\t);\n\n\tswitch (nextSortDirection) {\n\t\tcase \"unsorted\":\n\t\t\tcolumn.clearSorting();\n\t\t\treturn;\n\t\tcase \"asc\":\n\t\t\tcolumn.toggleSorting(false);\n\t\t\treturn;\n\t\tcase \"desc\":\n\t\t\tcolumn.toggleSorting(true);\n\t\t\treturn;\n\t\tdefault:\n\t\t\treturn;\n\t}\n}\n","import type { SortingMode } from \"../../utils/sorting/direction.js\";\nimport type { SortDirection } from \"./types.js\";\n\nconst alphanumericSortingOrder = [\n\t\"unsorted\",\n\t\"asc\",\n\t\"desc\",\n] as const satisfies SortDirection[];\n\nconst timeSortingOrder = [\n\t\"unsorted\",\n\t\"desc\",\n\t\"asc\",\n] as const satisfies SortDirection[];\n\n/**\n * Get the next sort direction based on the current sort direction and sorting mode.\n */\nfunction getNextSortDirection(\n\tcurrentSortDirection: SortDirection,\n\tsortingMode: SortingMode,\n) {\n\tconst sortOrder =\n\t\tsortingMode === \"alphanumeric\"\n\t\t\t? alphanumericSortingOrder\n\t\t\t: timeSortingOrder;\n\n\treturn getNextInCircularList(sortOrder, currentSortDirection) ?? \"unsorted\";\n}\n\n/**\n * Get the next item in a circular list.\n * If the current item is not found in the list (or it's empty), return the fallback value.\n */\nfunction getNextInCircularList<T>(\n\tlist: T[],\n\tcurrentItem: T,\n\tfallback?: T | undefined,\n) {\n\tif (list.length === 0) {\n\t\treturn fallback;\n\t}\n\n\tconst currentItemIndex = list.findIndex((item) => item === currentItem);\n\tif (currentItemIndex === -1) {\n\t\treturn fallback;\n\t}\n\n\tconst nextIndex = (currentItemIndex + 1) % list.length;\n\treturn list.at(nextIndex) ?? fallback;\n}\n\nexport {\n\t//,\n\tgetNextSortDirection,\n\tgetNextInCircularList,\n};\n"],"mappings":"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","names":["flexRender","Fragment","createContext","useContext","useMemo","invariant","alphanumericSortingOrder","timeSortingOrder","getNextSortDirection","currentSortDirection","sortingMode","getNextInCircularList","list","currentItem","fallback","currentItemIndex","item","nextIndex","jsx","jsxs","DataTableContext","createContext","useDataTableContext","context","useContext","invariant","Root","children","table","props","useMemo","Table","HeaderSortButton","className","column","disableSorting","iconPlacement","sortingMode","propSortIcon","onClick","_sortDirection","canSort","sortDirection","sortIcon","DefaultSortIcon","Button","cx","event","toggleNextSortingDirection","$timeSortingDirection","Header","Body","Head","headerGroup","header","Fragment","flexRender","Row","row","cell","EmptyRow","numberOfColumns","ActionCell","DataTable","DefaultSortIcon","direction","mode","props","jsx","SortIcon","toggleNextSortingDirection","column","sortingMode","sortDirection","getNextSortDirection"]}
+{"version":3,"sources":["../src/components/data-table/index.ts","../src/components/data-table/data-table.tsx","../src/components/data-table/helpers.ts"],"sourcesContent":["export * from \"@tanstack/react-table\";\n\nexport {\n\t//,\n\tDataTable,\n} from \"./data-table.js\";\n","import {\n\ttype Column,\n\ttype HeaderContext,\n\ttype Table as TableInstance,\n\ttype Row as TableRow,\n\tflexRender,\n} from \"@tanstack/react-table\";\nimport {\n\ttype ComponentProps,\n\tFragment,\n\ttype ReactNode,\n\tcreateContext,\n\tuseContext,\n\tuseMemo,\n} from \"react\";\nimport invariant from \"tiny-invariant\";\nimport { cx } from \"../../utils/cx/cx.js\";\nimport { $timeSortingDirection, type SortingMode } from \"../../utils/sorting/direction.js\";\nimport { Button } from \"../button/button.js\";\nimport type { SvgAttributes } from \"../icon/types.js\";\nimport { SortIcon } from \"../icons/sort.js\";\nimport { Table } from \"../table/table.js\";\nimport { getNextSortDirection } from \"./helpers.js\";\nimport type { SortDirection } from \"./types.js\";\n\ntype DataTableContextShape<TData = unknown> = {\n\ttable: TableInstance<TData>;\n};\n\nconst DataTableContext = createContext<DataTableContextShape<any> | null>(null);\n\n/**\n * @private\n */\nfunction useDataTableContext<TData>() {\n\tconst context = useContext(DataTableContext);\n\n\tinvariant(context, \"useDataTableContext should only be used within a DataTable child component\");\n\n\treturn context as DataTableContextShape<TData>;\n}\n\ntype DataTableProps<TData> = ComponentProps<typeof Table.Root> & {\n\ttable: TableInstance<TData>;\n};\n\n/**\n * A data table component that provides sorting and other data table functionality.\n * Built on top of TanStack Table for advanced table features.\n *\n * @see https://mantle.ngrok.com/components/data-table#api-data-table\n *\n * @example\n * ```tsx\n * <DataTable table={table}>\n *   <DataTable.Head />\n *   <DataTable.Body>\n *     <DataTable.Rows />\n *   </DataTable.Body>\n * </DataTable>\n * ```\n */\nfunction Root<TData>({ children, table, ...props }: DataTableProps<TData>) {\n\tconst context: DataTableContextShape<TData> = useMemo(() => ({ table }), [table]);\n\n\treturn (\n\t\t<DataTableContext.Provider value={context}>\n\t\t\t<Table.Root {...props}>\n\t\t\t\t<Table.Element>{children}</Table.Element>\n\t\t\t</Table.Root>\n\t\t</DataTableContext.Provider>\n\t);\n}\n\ntype DataTableHeaderSortButtonProps<TData, TValue> = Omit<ComponentProps<typeof Button>, \"icon\"> &\n\tPick<HeaderContext<TData, TValue>, \"column\"> &\n\t(\n\t\t| {\n\t\t\t\t/**\n\t\t\t\t * Disable sorting for this column.\n\t\t\t\t * It will prevent the sorting direction from being toggled and any icon\n\t\t\t\t * from being shown.\n\t\t\t\t */\n\t\t\t\tdisableSorting: true;\n\t\t\t\t/**\n\t\t\t\t * Use this to render a custom sort icon for the column if it is sortable\n\t\t\t\t * and you want to override the default sort icon\n\t\t\t\t */\n\t\t\t\tsortIcon?: undefined;\n\t\t\t\t/**\n\t\t\t\t * The sorting mode of the column, whether it is alphanumeric or time based.\n\t\t\t\t */\n\t\t\t\tsortingMode?: undefined;\n\t\t  }\n\t\t| {\n\t\t\t\tdisableSorting?: false;\n\t\t\t\t/**\n\t\t\t\t * Use this to render a custom sort icon for the column if it is sortable\n\t\t\t\t * and you want to override the default sort icon\n\t\t\t\t */\n\t\t\t\tsortIcon?: (sortDirection: SortDirection) => ReactNode;\n\t\t\t\t/**\n\t\t\t\t * The sorting mode of the column, whether it is alphanumeric or time based.\n\t\t\t\t */\n\t\t\t\tsortingMode: SortingMode;\n\t\t  }\n\t);\n\n/**\n * A sortable button toggle for a column header in a data table.\n * If the column is sortable, clicking the button will toggle the sorting\n * direction.\n *\n * @see https://mantle.ngrok.com/components/data-table#api-data-table-header-sort-button\n *\n * @example\n * ```tsx\n * <DataTable.HeaderSortButton\n *   column={column}\n *   sortingMode=\"alphanumeric\"\n * >\n *   Column Title\n * </DataTable.HeaderSortButton>\n * ```\n *\n * Each click cycles through:\n * - For alphanumeric sorting: unsorted ➡️ ascending ➡️ descending ➡️ unsorted\n * - For time sorting: unsorted ➡️ newest-to-oldest ➡️ oldest-to-newest ➡️ unsorted\n */\nfunction HeaderSortButton<TData, TValue>({\n\tchildren,\n\tclassName,\n\tcolumn,\n\tdisableSorting = false,\n\ticonPlacement = \"end\",\n\tsortingMode,\n\tsortIcon: propSortIcon,\n\tonClick,\n\t...props\n}: DataTableHeaderSortButtonProps<TData, TValue>) {\n\tconst _sortDirection = column.getIsSorted();\n\tconst canSort = !disableSorting && column.getCanSort();\n\n\tconst sortDirection: SortDirection =\n\t\tcanSort && typeof _sortDirection === \"string\" ? _sortDirection : \"unsorted\";\n\n\tconst sortIcon = propSortIcon?.(sortDirection) ?? (\n\t\t<DefaultSortIcon mode={sortingMode} direction={sortDirection} />\n\t);\n\n\treturn (\n\t\t<Button\n\t\t\tappearance=\"ghost\"\n\t\t\tclassName={cx(\"flex justify-start w-full h-full rounded-none\", className)}\n\t\t\tdata-sort-direction={sortDirection}\n\t\t\tdata-table-header-action\n\t\t\ticon={sortIcon}\n\t\t\ticonPlacement={iconPlacement}\n\t\t\tonClick={(event) => {\n\t\t\t\tonClick?.(event);\n\t\t\t\tif (event.defaultPrevented) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\t\t\t\tif (!canSort || disableSorting || typeof sortingMode === \"undefined\") {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\t\t\t\ttoggleNextSortingDirection(column, sortingMode);\n\t\t\t}}\n\t\t\tpriority=\"neutral\"\n\t\t\ttype=\"button\"\n\t\t\t{...props}\n\t\t>\n\t\t\t{canSort && sortDirection !== \"unsorted\" && (\n\t\t\t\t<span className=\"sr-only\">\n\t\t\t\t\tColumn sorted in{\" \"}\n\t\t\t\t\t{sortingMode === \"alphanumeric\"\n\t\t\t\t\t\t? sortDirection === \"asc\"\n\t\t\t\t\t\t\t? \"ascending\"\n\t\t\t\t\t\t\t: \"descending\"\n\t\t\t\t\t\t: $timeSortingDirection(sortDirection)}{\" \"}\n\t\t\t\t\torder\n\t\t\t\t</span>\n\t\t\t)}\n\t\t\t{children}\n\t\t</Button>\n\t);\n}\n\ntype DataTableHeaderProps = ComponentProps<typeof Table.Header>;\n\n/**\n * A header for a data table.\n * This is typically used to wrap the `DataTable.HeaderSortButton` component.\n *\n * @see https://mantle.ngrok.com/components/data-table#api-data-table-header\n *\n * @example\n * ```tsx\n * <DataTable.Header>\n *   <DataTable.HeaderSortButton column={column} sortingMode=\"alphanumeric\">\n *     Column Title\n *   </DataTable.HeaderSortButton>\n * </DataTable.Header>\n * ```\n */\nfunction Header({ children, className, ...props }: DataTableHeaderProps) {\n\treturn (\n\t\t<Table.Header className={cx(\"has-data-table-header-action:px-0\", className)} {...props}>\n\t\t\t{children}\n\t\t</Table.Header>\n\t);\n}\n\nconst Body = Table.Body;\nBody.displayName = \"DataTableBody\";\n\ntype DataTableHeadProps = Omit<ComponentProps<typeof Table.Head>, \"children\">;\n\nfunction Head<TData>(props: DataTableHeadProps) {\n\tconst { table } = useDataTableContext<TData>();\n\n\treturn (\n\t\t<Table.Head {...props}>\n\t\t\t{table.getHeaderGroups().map((headerGroup) => (\n\t\t\t\t<Table.Row key={headerGroup.id}>\n\t\t\t\t\t{headerGroup.headers.map((header) => (\n\t\t\t\t\t\t<Fragment key={header.id}>\n\t\t\t\t\t\t\t{header.isPlaceholder ? (\n\t\t\t\t\t\t\t\t<Table.Header key={header.id} />\n\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\tflexRender(header.column.columnDef.header, header.getContext())\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</Fragment>\n\t\t\t\t\t))}\n\t\t\t\t</Table.Row>\n\t\t\t))}\n\t\t</Table.Head>\n\t);\n}\n\ntype DataTableRowProps<TData> = Omit<ComponentProps<typeof Table.Row>, \"children\"> & {\n\trow: TableRow<TData>;\n};\n\nfunction Row<TData>({ row, ...props }: DataTableRowProps<TData>) {\n\treturn (\n\t\t<Table.Row {...props}>\n\t\t\t{row.getVisibleCells().map((cell) => (\n\t\t\t\t<Fragment key={cell.id}>\n\t\t\t\t\t{flexRender(cell.column.columnDef.cell, cell.getContext())}\n\t\t\t\t</Fragment>\n\t\t\t))}\n\t\t</Table.Row>\n\t);\n}\n\ntype DataTableEmptyRowProps = ComponentProps<typeof Table.Row>;\n\nfunction EmptyRow<TData>({ children, ...props }: DataTableEmptyRowProps) {\n\tconst { table } = useDataTableContext<TData>();\n\tconst numberOfColumns = table.getAllColumns().length;\n\n\treturn (\n\t\t<Table.Row {...props}>\n\t\t\t<Table.Cell colSpan={numberOfColumns}>{children}</Table.Cell>\n\t\t</Table.Row>\n\t);\n}\n\ntype DataTableActionCellProps = ComponentProps<typeof Table.Cell>;\n\nfunction ActionCell({ children, className, ...props }: DataTableActionCellProps) {\n\treturn (\n\t\t<Table.Cell\n\t\t\tclassName={cx(\n\t\t\t\t\"sticky z-10 right-0 top-px -bottom-px group-data-sticky-active/table:[box-shadow:inset_10px_0_8px_-8px_oklch(0_0_0/15%)]\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t>\n\t\t\t<div className=\"flex justify-end\">{children}</div>\n\t\t</Table.Cell>\n\t);\n}\n\n// Set display names to preserve original component names for debugging\nRoot.displayName = \"DataTable\";\nActionCell.displayName = \"DataTableActionCell\";\nBody.displayName = \"DataTableBody\";\nEmptyRow.displayName = \"DataTableEmptyRow\";\nHead.displayName = \"DataTableHead\";\nHeader.displayName = \"DataTableHeader\";\nHeaderSortButton.displayName = \"DataTableHeaderSortButton\";\nRow.displayName = \"DataTableRow\";\n\n/**\n * A data table component that provides sorting and other data table functionality.\n * Built on top of TanStack Table for advanced table features.\n *\n * @see https://mantle.ngrok.com/components/data-table\n *\n * @example\n * ```tsx\n * <DataTable table={table}>\n *   <DataTable.Head />\n *   <DataTable.Body>\n *     <DataTable.Rows />\n *   </DataTable.Body>\n * </DataTable>\n * ```\n */\nconst DataTable = {\n\t/**\n\t * The root container of the data table component.\n\t *\n\t * @see https://mantle.ngrok.com/components/data-table#api-data-table\n\t *\n\t * @example\n\t * ```tsx\n\t * <DataTable.Root table={table}>\n\t *   <DataTable.Head />\n\t *   <DataTable.Body>\n\t *     <DataTable.Rows />\n\t *   </DataTable.Body>\n\t * </DataTable.Root>\n\t * ```\n\t */\n\tRoot,\n\t/**\n\t * A sticky action cell positioned at the end of each row for action buttons.\n\t *\n\t * @see https://mantle.ngrok.com/components/data-table#api-data-table-action-cell\n\t *\n\t * @example\n\t * ```tsx\n\t * <DataTable.ActionCell>\n\t *   <Button size=\"sm\">Edit</Button>\n\t *   <Button size=\"sm\">Delete</Button>\n\t * </DataTable.ActionCell>\n\t * ```\n\t */\n\tActionCell,\n\t/**\n\t * A table cell component for rendering individual data cells.\n\t *\n\t * @see https://mantle.ngrok.com/components/data-table#api-data-table-cell\n\t *\n\t * @example\n\t * ```tsx\n\t * <DataTable.Cell>\n\t *   Cell content\n\t * </DataTable.Cell>\n\t * ```\n\t */\n\tCell: Table.Cell,\n\t/**\n\t * The table body container for rows of data.\n\t *\n\t * @see https://mantle.ngrok.com/components/data-table#api-data-table-body\n\t *\n\t * @example\n\t * ```tsx\n\t * <DataTable.Body>\n\t *   <DataTable.Rows />\n\t * </DataTable.Body>\n\t * ```\n\t */\n\tBody,\n\t/**\n\t * An empty state row that spans all columns when there's no data to display.\n\t *\n\t * @see https://mantle.ngrok.com/components/data-table#api-data-table-empty-row\n\t *\n\t * @example\n\t * ```tsx\n\t * <DataTable.EmptyRow>\n\t *   No data available\n\t * </DataTable.EmptyRow>\n\t * ```\n\t */\n\tEmptyRow,\n\t/**\n\t * The table header container that renders column headers automatically.\n\t *\n\t * @see https://mantle.ngrok.com/components/data-table#api-data-table-head\n\t *\n\t * @example\n\t * ```tsx\n\t * <DataTable.Head />\n\t * ```\n\t */\n\tHead,\n\t/**\n\t * A header cell component optimized for data table header actions.\n\t *\n\t * @see https://mantle.ngrok.com/components/data-table#api-data-table-header\n\t *\n\t * @example\n\t * ```tsx\n\t * <DataTable.Header>\n\t *   <DataTable.HeaderSortButton column={column} sortingMode=\"alphanumeric\">\n\t *     Column Title\n\t *   </DataTable.HeaderSortButton>\n\t * </DataTable.Header>\n\t * ```\n\t */\n\tHeader,\n\t/**\n\t * A sortable button toggle for column headers with sorting functionality.\n\t *\n\t * @see https://mantle.ngrok.com/components/data-table#api-data-table-header-sort-button\n\t *\n\t * @example\n\t * ```tsx\n\t * <DataTable.HeaderSortButton\n\t *   column={column}\n\t *   sortingMode=\"alphanumeric\"\n\t * >\n\t *   Column Title\n\t * </DataTable.HeaderSortButton>\n\t * ```\n\t */\n\tHeaderSortButton,\n\t/**\n\t * A single data table row component for rendering custom row layouts.\n\t *\n\t * @see https://mantle.ngrok.com/components/data-table#api-data-table-row\n\t *\n\t * @example\n\t * ```tsx\n\t * <DataTable.Row row={row} />\n\t * ```\n\t */\n\tRow,\n} as const;\n\nexport {\n\t//,\n\tDataTable,\n};\n\ntype DefaultSortIconProps = SvgAttributes & {\n\tdirection: SortDirection | undefined;\n\tmode: SortingMode | undefined;\n};\n\nfunction DefaultSortIcon({ direction, mode, ...props }: DefaultSortIconProps) {\n\tif (direction === \"unsorted\" || !mode || !direction) {\n\t\treturn <svg aria-hidden {...props} />;\n\t}\n\n\treturn <SortIcon mode={mode} direction={direction} {...props} />;\n}\n\n/**\n * Toggle the sorting direction of a column.\n * This ordering is typically toggled by clicking the column header.\n *\n * @example\n * ```md\n * Each click cycles through...\n *\n * For alphanumeric sorting:\n *   unsorted ➡️ ascending ➡️ descending ➡️ unsorted ➡️ ...\n *\n * For time sorting:\n *   unsorted ➡️ newest-to-oldest ➡️ oldest-to-newest ➡️ unsorted ➡️ ...\n *\n *   this is equivalent to the inverse of alphanumeric sorting, or\n *   unsorted ➡️ descending ➡️ ascending ➡️ unsorted ➡️ ...\n * ```\n */\nfunction toggleNextSortingDirection<TData, TValue>(\n\tcolumn: Column<TData, TValue>,\n\tsortingMode: SortingMode,\n) {\n\tif (!column.getCanSort()) {\n\t\treturn;\n\t}\n\n\tconst sortDirection = column.getIsSorted();\n\tconst currentSortDirection: SortDirection =\n\t\ttypeof sortDirection === \"string\" ? sortDirection : \"unsorted\";\n\n\tconst nextSortDirection = getNextSortDirection(currentSortDirection, sortingMode);\n\n\tswitch (nextSortDirection) {\n\t\tcase \"unsorted\":\n\t\t\tcolumn.clearSorting();\n\t\t\treturn;\n\t\tcase \"asc\":\n\t\t\tcolumn.toggleSorting(false);\n\t\t\treturn;\n\t\tcase \"desc\":\n\t\t\tcolumn.toggleSorting(true);\n\t\t\treturn;\n\t\tdefault:\n\t\t\treturn;\n\t}\n}\n","import type { SortingMode } from \"../../utils/sorting/direction.js\";\nimport type { SortDirection } from \"./types.js\";\n\nconst alphanumericSortingOrder = [\"unsorted\", \"asc\", \"desc\"] as const satisfies SortDirection[];\n\nconst timeSortingOrder = [\"unsorted\", \"desc\", \"asc\"] as const satisfies SortDirection[];\n\n/**\n * Get the next sort direction based on the current sort direction and sorting mode.\n */\nfunction getNextSortDirection(currentSortDirection: SortDirection, sortingMode: SortingMode) {\n\tconst sortOrder = sortingMode === \"alphanumeric\" ? alphanumericSortingOrder : timeSortingOrder;\n\n\treturn getNextInCircularList(sortOrder, currentSortDirection) ?? \"unsorted\";\n}\n\n/**\n * Get the next item in a circular list.\n * If the current item is not found in the list (or it's empty), return the fallback value.\n */\nfunction getNextInCircularList<T>(list: T[], currentItem: T, fallback?: T | undefined) {\n\tif (list.length === 0) {\n\t\treturn fallback;\n\t}\n\n\tconst currentItemIndex = list.findIndex((item) => item === currentItem);\n\tif (currentItemIndex === -1) {\n\t\treturn fallback;\n\t}\n\n\tconst nextIndex = (currentItemIndex + 1) % list.length;\n\treturn list.at(nextIndex) ?? fallback;\n}\n\nexport {\n\t//,\n\tgetNextSortDirection,\n\tgetNextInCircularList,\n};\n"],"mappings":"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","names":["flexRender","Fragment","createContext","useContext","useMemo","invariant","alphanumericSortingOrder","timeSortingOrder","getNextSortDirection","currentSortDirection","sortingMode","getNextInCircularList","list","currentItem","fallback","currentItemIndex","item","nextIndex","jsx","jsxs","DataTableContext","createContext","useDataTableContext","context","useContext","invariant","Root","children","table","props","useMemo","Table","HeaderSortButton","className","column","disableSorting","iconPlacement","sortingMode","propSortIcon","onClick","_sortDirection","canSort","sortDirection","sortIcon","DefaultSortIcon","Button","cx","event","toggleNextSortingDirection","$timeSortingDirection","Header","Body","Head","headerGroup","header","Fragment","flexRender","Row","row","cell","EmptyRow","numberOfColumns","ActionCell","DataTable","DefaultSortIcon","direction","mode","props","jsx","SortIcon","toggleNextSortingDirection","column","sortingMode","sortDirection","getNextSortDirection"]}

package/dist/dialog.js

@@ -1,2 +1,2 @@
-import{a as r}from"./chunk-BR4ZHK5A.js";import{i as o}from"./chunk-OE4YWO7O.js";import"./chunk-UGWSBMHH.js";import"./chunk-PEGWGFY7.js";import"./chunk-6J7D73WA.js";import"./chunk-NJNFZ2EG.js";import"./chunk-KMNACVH6.js";import"./chunk-3AUCEZTZ.js";import"./chunk-4LSFAAZW.js";import"./chunk-72TJUKMV.js";import"./chunk-3C5O3AQA.js";import"./chunk-2NIR7PCL.js";import"./chunk-UNFO4DZV.js";import"./chunk-NZ6DRFAL.js";import"./chunk-PFXFESEN.js";export{r as Dialog,o as isDialogOverlayTarget};
+import{a as r}from"./chunk-RLW7NBZU.js";import{i as o}from"./chunk-NQZYWYVH.js";import"./chunk-HG2MWNPU.js";import"./chunk-B2CXQETQ.js";import"./chunk-6J7D73WA.js";import"./chunk-NJNFZ2EG.js";import"./chunk-KMNACVH6.js";import"./chunk-ZCTK5X4D.js";import"./chunk-4LSFAAZW.js";import"./chunk-72TJUKMV.js";import"./chunk-OP6JMBKJ.js";import"./chunk-SBVSECWW.js";import"./chunk-ODDNPNLN.js";import"./chunk-NZ6DRFAL.js";import"./chunk-PFXFESEN.js";export{r as Dialog,o as isDialogOverlayTarget};
 //# sourceMappingURL=dialog.js.map

package/dist/{direction-veAOo2is.d.ts → direction-DHheuUag.d.ts}

@@ -140,4 +140,4 @@ declare function $timeSortingDirection<T extends TimeSortingDirection | SortingD
     readonly desc: "newest-to-oldest";
 }[(T & "asc") | (T & "desc")] | (T & "newest-to-oldest") | (T & "oldest-to-newest");
 
-export { $alphanumericSortingDirection as $, type AlphanumericSortingDirection as A, type SortingDirection as S, type TimeSortingDirection as T, $sortingDirection as a, $sortingMode as b, $timeSortingDirection as c, alphanumericSortingDirections as d, isSortingDirection as e, isSortingMode as f, isTimeSortingDirection as g, sortingModes as h, isAlphanumericSortingDirection as i, timeSortingDirections as j, type SortingMode as k, sortingDirections as s, timeSortingByDirection as t };
+export { $alphanumericSortingDirection as $, type AlphanumericSortingDirection as A, type SortingDirection as S, type TimeSortingDirection as T, $sortingDirection as a, $sortingMode as b, $timeSortingDirection as c, type SortingMode as d, alphanumericSortingDirections as e, isSortingDirection as f, isSortingMode as g, isTimeSortingDirection as h, isAlphanumericSortingDirection as i, sortingModes as j, timeSortingDirections as k, sortingDirections as s, timeSortingByDirection as t };

package/dist/dropdown-menu.js

@@ -1,2 +1,2 @@
-import{b as c}from"./chunk-YKYEISYH.js";import{a as s}from"./chunk-2NIR7PCL.js";import"./chunk-UNFO4DZV.js";import"./chunk-NZ6DRFAL.js";import{a}from"./chunk-PFXFESEN.js";import{CaretRightIcon as S}from"@phosphor-icons/react/CaretRight";import{CheckIcon as f}from"@phosphor-icons/react/Check";import*as e from"@radix-ui/react-dropdown-menu";import{forwardRef as d}from"react";import{jsx as o,jsxs as l}from"react/jsx-runtime";var g=e.Root;g.displayName="DropdownMenu";var h=e.Trigger;h.displayName="DropdownMenuTrigger";var v=e.Group;v.displayName="DropdownMenuGroup";var m=e.Portal;m.displayName="DropdownMenuPortal";var w=e.Sub;w.displayName="DropdownMenuSub";var b=e.RadioGroup;b.displayName="DropdownMenuRadioGroup";var M=d(({className:t,inset:n,children:r,...i},p)=>l(e.SubTrigger,{className:a("focus:bg-accent data-state-open:bg-accent relative flex select-none items-center rounded py-1.5 pl-2 pr-9 text-sm outline-hidden","data-highlighted:bg-popover-hover data-state-open:bg-popover-hover","[&>svg]:size-5 [&_svg]:shrink-0",n&&"pl-8",t),ref:p,...i,children:[r,o("span",{className:"absolute right-2 flex items-center",children:o(s,{svg:o(S,{weight:"bold"}),className:"size-4"})})]}));M.displayName="DropdownMenuSubTrigger";var D=d(({className:t,loop:n=!0,...r},i)=>o(m,{children:o(e.SubContent,{className:a("scrollbar","text-popover-foreground border-popover bg-popover p-1.25 data-state-closed:animate-out data-state-closed:fade-out-0 data-state-closed:zoom-out-95 data-state-open:animate-in data-state-open:fade-in-0 data-state-open:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 min-w-[8rem] overflow-hidden rounded-md border shadow-xl","my-2 max-h-[calc(var(--radix-dropdown-menu-content-available-height)_-_16px)] overflow-auto",t),loop:n,ref:i,...r})}));D.displayName="DropdownMenuSubContent";var P=d(({className:t,onClick:n,loop:r=!0,width:i,...p},k)=>o(m,{children:o(e.Content,{ref:k,className:a("scrollbar","text-popover-foreground border-popover bg-popover p-1.25 z-50 min-w-[8rem] overflow-hidden rounded-md border shadow-xl outline-hidden","data-side-bottom:slide-in-from-top-2 data-side-left:slide-in-from-right-2 data-side-right:slide-in-from-left-2 data-side-top:slide-in-from-bottom-2 data-state-closed:animate-out data-state-closed:fade-out-0 data-state-closed:zoom-out-95 data-state-open:animate-in data-state-open:fade-in-0 data-state-open:zoom-in-95","my-2 max-h-[calc(var(--radix-dropdown-menu-content-available-height)_-_16px)] overflow-auto",i==="trigger"&&"w-[var(--radix-dropdown-menu-trigger-width)]",t),loop:r,onClick:u=>{u.stopPropagation(),n?.(u)},...p})}));P.displayName="DropdownMenuContent";var y=d(({className:t,inset:n,...r},i)=>o(e.Item,{ref:i,className:a("relative flex cursor-pointer select-none items-center rounded px-2 py-1.5 text-sm font-normal outline-hidden transition-colors","data-highlighted:bg-popover-hover data-active-item:dark:bg-popover-hover","focus:bg-accent focus:text-accent-foreground","data-disabled:cursor-default data-disabled:opacity-50","[&>svg]:size-5 [&_svg]:shrink-0",n&&"pl-8",t),...r}));y.displayName="DropdownMenuItem";var x=d(({className:t,children:n,checked:r,...i},p)=>l(e.CheckboxItem,{ref:p,className:a("text-strong data-disabled:pointer-events-none data-disabled:opacity-50 relative flex cursor-pointer select-none items-center gap-2 rounded py-1.5 pl-2 pr-9 text-sm font-normal outline-hidden","data-highlighted:bg-popover-hover data-highlighted:dark:bg-popover-hover","aria-checked:!bg-filled-accent aria-checked:text-on-filled aria-checked:font-medium","[&>svg]:size-5 [&_svg]:shrink-0",t),checked:r,...i,children:[o("span",{className:"absolute right-2 flex items-center",children:o(e.ItemIndicator,{children:o(s,{svg:o(f,{weight:"bold"}),className:"size-4"})})}),n]}));x.displayName="DropdownMenuCheckboxItem";var C=d(({className:t,children:n,...r},i)=>l(e.RadioItem,{className:a("group/dropdown-menu-radio-item","text-strong data-disabled:pointer-events-none data-disabled:opacity-50 relative flex cursor-pointer select-none items-center gap-2 rounded py-1.5 px-2 text-sm font-normal outline-none","data-highlighted:bg-popover-hover data-highlighted:dark:bg-popover-hover","aria-checked:!bg-filled-accent aria-checked:text-on-filled aria-checked:font-medium aria-checked:pr-9","[&>svg]:size-5 [&_svg]:shrink-0",t),ref:i,...r,children:[o("span",{className:"absolute right-2 items-center hidden group-aria-checked/dropdown-menu-radio-item:flex",children:o(e.ItemIndicator,{children:o(s,{svg:o(f,{weight:"bold"}),className:"size-4"})})}),n]}));C.displayName="DropdownMenuRadioItem";var R=d(({className:t,inset:n,...r},i)=>o(e.Label,{ref:i,className:a("px-2 py-1.5 text-sm font-medium",n&&"pl-8",t),...r}));R.displayName="DropdownMenuLabel";var N=d(({className:t,...n},r)=>o(c,{ref:r,className:a("-mx-1.25 my-1 w-auto",t),...n}));N.displayName="DropdownMenuSeparator";var I=({className:t,...n})=>o("span",{className:a("ml-auto text-xs tracking-widest opacity-60",t),...n});I.displayName="DropdownMenuShortcut";var z={Root:g,CheckboxItem:x,Content:P,Group:v,Item:y,Label:R,RadioGroup:b,RadioItem:C,Separator:N,Shortcut:I,Sub:w,SubContent:D,SubTrigger:M,Trigger:h};export{z as DropdownMenu};
+import{b as c}from"./chunk-LURP5WQR.js";import{a as s}from"./chunk-SBVSECWW.js";import"./chunk-ODDNPNLN.js";import"./chunk-NZ6DRFAL.js";import{a}from"./chunk-PFXFESEN.js";import{CaretRightIcon as S}from"@phosphor-icons/react/CaretRight";import{CheckIcon as f}from"@phosphor-icons/react/Check";import*as e from"@radix-ui/react-dropdown-menu";import{forwardRef as d}from"react";import{jsx as o,jsxs as l}from"react/jsx-runtime";var g=e.Root;g.displayName="DropdownMenu";var h=e.Trigger;h.displayName="DropdownMenuTrigger";var v=e.Group;v.displayName="DropdownMenuGroup";var m=e.Portal;m.displayName="DropdownMenuPortal";var w=e.Sub;w.displayName="DropdownMenuSub";var b=e.RadioGroup;b.displayName="DropdownMenuRadioGroup";var M=d(({className:t,inset:n,children:r,...i},p)=>l(e.SubTrigger,{className:a("focus:bg-accent data-state-open:bg-accent relative flex select-none items-center rounded py-1.5 pl-2 pr-9 text-sm outline-hidden","data-highlighted:bg-popover-hover data-state-open:bg-popover-hover","[&>svg]:size-5 [&_svg]:shrink-0",n&&"pl-8",t),ref:p,...i,children:[r,o("span",{className:"absolute right-2 flex items-center",children:o(s,{svg:o(S,{weight:"bold"}),className:"size-4"})})]}));M.displayName="DropdownMenuSubTrigger";var D=d(({className:t,loop:n=!0,...r},i)=>o(m,{children:o(e.SubContent,{className:a("scrollbar","text-popover-foreground border-popover bg-popover p-1.25 data-state-closed:animate-out data-state-closed:fade-out-0 data-state-closed:zoom-out-95 data-state-open:animate-in data-state-open:fade-in-0 data-state-open:zoom-in-95 data-side-bottom:slide-in-from-top-2 data-side-left:slide-in-from-right-2 data-side-right:slide-in-from-left-2 data-side-top:slide-in-from-bottom-2 z-50 min-w-32 overflow-hidden rounded-md border shadow-xl","my-2 max-h-[calc(var(--radix-dropdown-menu-content-available-height)-16px)] overflow-auto",t),loop:n,ref:i,...r})}));D.displayName="DropdownMenuSubContent";var P=d(({className:t,onClick:n,loop:r=!0,width:i,...p},k)=>o(m,{children:o(e.Content,{ref:k,className:a("scrollbar","text-popover-foreground border-popover bg-popover p-1.25 z-50 min-w-32 overflow-hidden rounded-md border shadow-xl outline-hidden","data-side-bottom:slide-in-from-top-2 data-side-left:slide-in-from-right-2 data-side-right:slide-in-from-left-2 data-side-top:slide-in-from-bottom-2 data-state-closed:animate-out data-state-closed:fade-out-0 data-state-closed:zoom-out-95 data-state-open:animate-in data-state-open:fade-in-0 data-state-open:zoom-in-95","my-2 max-h-[calc(var(--radix-dropdown-menu-content-available-height)-16px)] overflow-auto",i==="trigger"&&"w-(--radix-dropdown-menu-trigger-width)",t),loop:r,onClick:u=>{u.stopPropagation(),n?.(u)},...p})}));P.displayName="DropdownMenuContent";var y=d(({className:t,inset:n,...r},i)=>o(e.Item,{ref:i,className:a("relative flex cursor-pointer select-none items-center rounded px-2 py-1.5 text-sm font-normal outline-hidden transition-colors","data-highlighted:bg-popover-hover data-active-item:dark:bg-popover-hover","focus:bg-accent focus:text-accent-foreground","data-disabled:cursor-default data-disabled:opacity-50","[&>svg]:size-5 [&_svg]:shrink-0",n&&"pl-8",t),...r}));y.displayName="DropdownMenuItem";var x=d(({className:t,children:n,checked:r,...i},p)=>l(e.CheckboxItem,{ref:p,className:a("text-strong data-disabled:pointer-events-none data-disabled:opacity-50 relative flex cursor-pointer select-none items-center gap-2 rounded py-1.5 pl-2 pr-9 text-sm font-normal outline-hidden","data-highlighted:bg-popover-hover data-highlighted:dark:bg-popover-hover","aria-checked:bg-filled-accent! aria-checked:text-on-filled aria-checked:font-medium","[&>svg]:size-5 [&_svg]:shrink-0",t),checked:r,...i,children:[o("span",{className:"absolute right-2 flex items-center",children:o(e.ItemIndicator,{children:o(s,{svg:o(f,{weight:"bold"}),className:"size-4"})})}),n]}));x.displayName="DropdownMenuCheckboxItem";var C=d(({className:t,children:n,...r},i)=>l(e.RadioItem,{className:a("group/dropdown-menu-radio-item","text-strong data-disabled:pointer-events-none data-disabled:opacity-50 relative flex cursor-pointer select-none items-center gap-2 rounded py-1.5 px-2 text-sm font-normal outline-none","data-highlighted:bg-popover-hover data-highlighted:dark:bg-popover-hover","aria-checked:bg-filled-accent! aria-checked:text-on-filled aria-checked:font-medium aria-checked:pr-9","[&>svg]:size-5 [&_svg]:shrink-0",t),ref:i,...r,children:[o("span",{className:"absolute right-2 items-center hidden group-aria-checked/dropdown-menu-radio-item:flex",children:o(e.ItemIndicator,{children:o(s,{svg:o(f,{weight:"bold"}),className:"size-4"})})}),n]}));C.displayName="DropdownMenuRadioItem";var R=d(({className:t,inset:n,...r},i)=>o(e.Label,{ref:i,className:a("px-2 py-1.5 text-sm font-medium",n&&"pl-8",t),...r}));R.displayName="DropdownMenuLabel";var N=d(({className:t,...n},r)=>o(c,{ref:r,className:a("-mx-1.25 my-1 w-auto",t),...n}));N.displayName="DropdownMenuSeparator";var I=({className:t,...n})=>o("span",{className:a("ml-auto text-xs tracking-widest opacity-60",t),...n});I.displayName="DropdownMenuShortcut";var z={Root:g,CheckboxItem:x,Content:P,Group:v,Item:y,Label:R,RadioGroup:b,RadioItem:C,Separator:N,Shortcut:I,Sub:w,SubContent:D,SubTrigger:M,Trigger:h};export{z as DropdownMenu};
 //# sourceMappingURL=dropdown-menu.js.map

package/dist/dropdown-menu.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/dropdown-menu/dropdown-menu.tsx"],"sourcesContent":["import { CaretRightIcon } from \"@phosphor-icons/react/CaretRight\";\nimport { CheckIcon } from \"@phosphor-icons/react/Check\";\nimport * as DropdownMenuPrimitive from \"@radix-ui/react-dropdown-menu\";\nimport type { ComponentPropsWithoutRef, ComponentRef } from \"react\";\nimport { forwardRef } from \"react\";\nimport { cx } from \"../../utils/cx/cx.js\";\nimport { Icon } from \"../icon/icon.js\";\nimport { Separator } from \"../separator/separator.js\";\n\n/**\n * A menu of options or actions, triggered by a button.\n * This is the root, stateful component that manages the open/closed state of the dropdown menu.\n *\n * @see https://mantle.ngrok.com/components/dropdown-menu#api-dropdown-menu\n *\n * @example\n * ```tsx\n * <DropdownMenu.Root>\n *   <DropdownMenu.Trigger asChild>\n *     <Button type=\"button\" appearance=\"outlined\">\n *       Open Menu\n *     </Button>\n *   </DropdownMenu.Trigger>\n *   <DropdownMenu.Content>\n *     <DropdownMenu.Item>Item 1</DropdownMenu.Item>\n *     <DropdownMenu.Item>Item 2</DropdownMenu.Item>\n *   </DropdownMenu.Content>\n * </DropdownMenu.Root>\n * ```\n */\nconst Root = DropdownMenuPrimitive.Root;\nRoot.displayName = \"DropdownMenu\";\n\n/**\n * The trigger button that opens the dropdown menu.\n *\n * @see https://mantle.ngrok.com/components/dropdown-menu#api-dropdown-menu-trigger\n *\n * @example\n * ```tsx\n * <DropdownMenu.Root>\n *   <DropdownMenu.Trigger asChild>\n *     <Button type=\"button\" appearance=\"outlined\">\n *       Open Menu\n *     </Button>\n *   </DropdownMenu.Trigger>\n *   <DropdownMenu.Content>\n *     <DropdownMenu.Item>Item 1</DropdownMenu.Item>\n *   </DropdownMenu.Content>\n * </DropdownMenu.Root>\n * ```\n */\nconst Trigger = DropdownMenuPrimitive.Trigger;\nTrigger.displayName = \"DropdownMenuTrigger\";\n\nconst Group = DropdownMenuPrimitive.Group;\nGroup.displayName = \"DropdownMenuGroup\";\n\n/**\n * The portal container for rendering dropdown content outside the normal DOM tree.\n */\nconst Portal = DropdownMenuPrimitive.Portal;\nPortal.displayName = \"DropdownMenuPortal\";\n\nconst Sub = DropdownMenuPrimitive.Sub;\nSub.displayName = \"DropdownMenuSub\";\n\nconst RadioGroup = DropdownMenuPrimitive.RadioGroup;\nRadioGroup.displayName = \"DropdownMenuRadioGroup\";\n\n/**\n * A trigger for a dropdown menu sub-menu.\n *\n * @see https://mantle.ngrok.com/components/dropdown-menu#api-dropdown-menu-sub-trigger\n */\nconst SubTrigger = forwardRef<\n\tComponentRef<typeof DropdownMenuPrimitive.SubTrigger>,\n\tComponentPropsWithoutRef<typeof DropdownMenuPrimitive.SubTrigger> & {\n\t\tinset?: boolean;\n\t}\n>(({ className, inset, children, ...props }, ref) => (\n\t<DropdownMenuPrimitive.SubTrigger\n\t\tclassName={cx(\n\t\t\t\"focus:bg-accent data-state-open:bg-accent relative flex select-none items-center rounded py-1.5 pl-2 pr-9 text-sm outline-hidden\",\n\t\t\t\"data-highlighted:bg-popover-hover data-state-open:bg-popover-hover\",\n\t\t\t\"[&>svg]:size-5 [&_svg]:shrink-0\",\n\t\t\tinset && \"pl-8\",\n\t\t\tclassName,\n\t\t)}\n\t\tref={ref}\n\t\t{...props}\n\t>\n\t\t{children}\n\t\t<span className=\"absolute right-2 flex items-center\">\n\t\t\t<Icon svg={<CaretRightIcon weight=\"bold\" />} className=\"size-4\" />\n\t\t</span>\n\t</DropdownMenuPrimitive.SubTrigger>\n));\nSubTrigger.displayName = \"DropdownMenuSubTrigger\";\n\n/**\n * The content container for a dropdown menu sub-menu.\n *\n * @see https://mantle.ngrok.com/components/dropdown-menu#api-dropdown-menu-sub-content\n */\nconst SubContent = forwardRef<\n\tComponentRef<typeof DropdownMenuPrimitive.SubContent>,\n\tComponentPropsWithoutRef<typeof DropdownMenuPrimitive.SubContent>\n>(({ className, loop = true, ...props }, ref) => (\n\t<Portal>\n\t\t<DropdownMenuPrimitive.SubContent\n\t\t\tclassName={cx(\n\t\t\t\t\"scrollbar\",\n\t\t\t\t\"text-popover-foreground border-popover bg-popover p-1.25 data-state-closed:animate-out data-state-closed:fade-out-0 data-state-closed:zoom-out-95 data-state-open:animate-in data-state-open:fade-in-0 data-state-open:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 min-w-[8rem] overflow-hidden rounded-md border shadow-xl\",\n\t\t\t\t\"my-2 max-h-[calc(var(--radix-dropdown-menu-content-available-height)_-_16px)] overflow-auto\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\tloop={loop}\n\t\t\tref={ref}\n\t\t\t{...props}\n\t\t/>\n\t</Portal>\n));\nSubContent.displayName = \"DropdownMenuSubContent\";\n\ntype DropdownMenuContentProps = ComponentPropsWithoutRef<\n\ttypeof DropdownMenuPrimitive.Content\n> & {\n\t/**\n\t * Whether the DropdownMenuContent should match the width of the trigger or use the intrinsic content width.\n\t */\n\twidth?: \"trigger\" | \"content\";\n};\n\n/**\n * The container for the dropdown menu content.\n *\n * @see https://mantle.ngrok.com/components/dropdown-menu#api-dropdown-menu-content\n *\n * @example\n * ```tsx\n * <DropdownMenu.Root>\n *   <DropdownMenu.Trigger asChild>\n *     <Button type=\"button\" appearance=\"outlined\">\n *       Open Menu\n *     </Button>\n *   </DropdownMenu.Trigger>\n *   <DropdownMenu.Content>\n *     <DropdownMenu.Item>Item 1</DropdownMenu.Item>\n *     <DropdownMenu.Item>Item 2</DropdownMenu.Item>\n *   </DropdownMenu.Content>\n * </DropdownMenu.Root>\n * ```\n */\nconst Content = forwardRef<\n\tComponentRef<typeof DropdownMenuPrimitive.Content>,\n\tDropdownMenuContentProps\n>(({ className, onClick, loop = true, width, ...props }, ref) => (\n\t<Portal>\n\t\t<DropdownMenuPrimitive.Content\n\t\t\tref={ref}\n\t\t\tclassName={cx(\n\t\t\t\t\"scrollbar\",\n\t\t\t\t\"text-popover-foreground border-popover bg-popover p-1.25 z-50 min-w-[8rem] overflow-hidden rounded-md border shadow-xl outline-hidden\",\n\t\t\t\t\"data-side-bottom:slide-in-from-top-2 data-side-left:slide-in-from-right-2 data-side-right:slide-in-from-left-2 data-side-top:slide-in-from-bottom-2 data-state-closed:animate-out data-state-closed:fade-out-0 data-state-closed:zoom-out-95 data-state-open:animate-in data-state-open:fade-in-0 data-state-open:zoom-in-95\",\n\t\t\t\t\"my-2 max-h-[calc(var(--radix-dropdown-menu-content-available-height)_-_16px)] overflow-auto\",\n\t\t\t\twidth === \"trigger\" && \"w-[var(--radix-dropdown-menu-trigger-width)]\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\tloop={loop}\n\t\t\tonClick={(event) => {\n\t\t\t\t/**\n\t\t\t\t * Prevent the click event from propagating up to parent/containing elements\n\t\t\t\t * of the DropdownMenu\n\t\t\t\t */\n\t\t\t\tevent.stopPropagation();\n\t\t\t\tonClick?.(event);\n\t\t\t}}\n\t\t\t{...props}\n\t\t/>\n\t</Portal>\n));\nContent.displayName = \"DropdownMenuContent\";\n\n/**\n * An item in the dropdown menu.\n *\n * @see https://mantle.ngrok.com/components/dropdown-menu#api-dropdown-menu-item\n *\n * @example\n * ```tsx\n * <DropdownMenu.Root>\n *   <DropdownMenu.Trigger asChild>\n *     <Button type=\"button\" appearance=\"outlined\">\n *       Open Menu\n *     </Button>\n *   </DropdownMenu.Trigger>\n *   <DropdownMenu.Content>\n *     <DropdownMenu.Item>Item 1</DropdownMenu.Item>\n *     <DropdownMenu.Item>Item 2</DropdownMenu.Item>\n *   </DropdownMenu.Content>\n * </DropdownMenu.Root>\n * ```\n */\nconst Item = forwardRef<\n\tComponentRef<typeof DropdownMenuPrimitive.Item>,\n\tComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Item> & {\n\t\tinset?: boolean;\n\t}\n>(({ className, inset, ...props }, ref) => (\n\t<DropdownMenuPrimitive.Item\n\t\tref={ref}\n\t\tclassName={cx(\n\t\t\t\"relative flex cursor-pointer select-none items-center rounded px-2 py-1.5 text-sm font-normal outline-hidden transition-colors\",\n\t\t\t\"data-highlighted:bg-popover-hover data-active-item:dark:bg-popover-hover\",\n\t\t\t\"focus:bg-accent focus:text-accent-foreground\",\n\t\t\t\"data-disabled:cursor-default data-disabled:opacity-50\",\n\t\t\t\"[&>svg]:size-5 [&_svg]:shrink-0\",\n\t\t\tinset && \"pl-8\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t/>\n));\nItem.displayName = \"DropdownMenuItem\";\n\n/**\n * A menu item with a checkbox that can be controlled or uncontrolled.\n *\n * @see https://mantle.ngrok.com/components/dropdown-menu#api-dropdown-menu-checkbox-item\n */\nconst CheckboxItem = forwardRef<\n\tComponentRef<typeof DropdownMenuPrimitive.CheckboxItem>,\n\tComponentPropsWithoutRef<typeof DropdownMenuPrimitive.CheckboxItem>\n>(({ className, children, checked, ...props }, ref) => (\n\t<DropdownMenuPrimitive.CheckboxItem\n\t\tref={ref}\n\t\tclassName={cx(\n\t\t\t\"text-strong data-disabled:pointer-events-none data-disabled:opacity-50 relative flex cursor-pointer select-none items-center gap-2 rounded py-1.5 pl-2 pr-9 text-sm font-normal outline-hidden\",\n\t\t\t\"data-highlighted:bg-popover-hover data-highlighted:dark:bg-popover-hover\",\n\t\t\t\"aria-checked:!bg-filled-accent aria-checked:text-on-filled aria-checked:font-medium\",\n\t\t\t\"[&>svg]:size-5 [&_svg]:shrink-0\",\n\t\t\tclassName,\n\t\t)}\n\t\tchecked={checked}\n\t\t{...props}\n\t>\n\t\t<span className=\"absolute right-2 flex items-center\">\n\t\t\t<DropdownMenuPrimitive.ItemIndicator>\n\t\t\t\t<Icon svg={<CheckIcon weight=\"bold\" />} className=\"size-4\" />\n\t\t\t</DropdownMenuPrimitive.ItemIndicator>\n\t\t</span>\n\t\t{children}\n\t</DropdownMenuPrimitive.CheckboxItem>\n));\nCheckboxItem.displayName = \"DropdownMenuCheckboxItem\";\n\ntype DropdownMenuRadioItemProps = ComponentPropsWithoutRef<\n\ttypeof DropdownMenuPrimitive.RadioItem\n> & {\n\tname?: string;\n\tid?: string;\n};\n\n/**\n * A menu item with a radio button that can be controlled or uncontrolled.\n * Used within a RadioGroup to create a set of mutually exclusive options.\n *\n * @see https://mantle.ngrok.com/components/dropdown-menu#api-dropdown-menu-radio-item\n */\nconst RadioItem = forwardRef<ComponentRef<\"input\">, DropdownMenuRadioItemProps>(\n\t({ className, children, ...props }, ref) => (\n\t\t<DropdownMenuPrimitive.RadioItem\n\t\t\tclassName={cx(\n\t\t\t\t\"group/dropdown-menu-radio-item\",\n\t\t\t\t\"text-strong data-disabled:pointer-events-none data-disabled:opacity-50 relative flex cursor-pointer select-none items-center gap-2 rounded py-1.5 px-2 text-sm font-normal outline-none\",\n\t\t\t\t\"data-highlighted:bg-popover-hover data-highlighted:dark:bg-popover-hover\",\n\t\t\t\t\"aria-checked:!bg-filled-accent aria-checked:text-on-filled aria-checked:font-medium aria-checked:pr-9\",\n\t\t\t\t\"[&>svg]:size-5 [&_svg]:shrink-0\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\tref={ref}\n\t\t\t{...props}\n\t\t>\n\t\t\t<span className=\"absolute right-2 items-center hidden group-aria-checked/dropdown-menu-radio-item:flex\">\n\t\t\t\t<DropdownMenuPrimitive.ItemIndicator>\n\t\t\t\t\t<Icon svg={<CheckIcon weight=\"bold\" />} className=\"size-4\" />\n\t\t\t\t</DropdownMenuPrimitive.ItemIndicator>\n\t\t\t</span>\n\t\t\t{children}\n\t\t</DropdownMenuPrimitive.RadioItem>\n\t),\n);\nRadioItem.displayName = \"DropdownMenuRadioItem\";\n\n/**\n * A label for a group of dropdown menu items.\n *\n * @see https://mantle.ngrok.com/components/dropdown-menu#api-dropdown-menu-label\n */\nconst Label = forwardRef<\n\tComponentRef<typeof DropdownMenuPrimitive.Label>,\n\tComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Label> & {\n\t\tinset?: boolean;\n\t}\n>(({ className, inset, ...props }, ref) => (\n\t<DropdownMenuPrimitive.Label\n\t\tref={ref}\n\t\tclassName={cx(\n\t\t\t\"px-2 py-1.5 text-sm font-medium\",\n\t\t\tinset && \"pl-8\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t/>\n));\nLabel.displayName = \"DropdownMenuLabel\";\n\n/**\n * A visual separator between dropdown menu items or groups.\n *\n * @see https://mantle.ngrok.com/components/dropdown-menu#api-dropdown-menu-separator\n */\nconst DropdownSeparator = forwardRef<\n\tComponentRef<typeof Separator>,\n\tComponentPropsWithoutRef<typeof Separator>\n>(({ className, ...props }, ref) => (\n\t<Separator\n\t\tref={ref}\n\t\tclassName={cx(\"-mx-1.25 my-1 w-auto\", className)}\n\t\t{...props}\n\t/>\n));\nDropdownSeparator.displayName = \"DropdownMenuSeparator\";\n\nconst Shortcut = ({\n\tclassName,\n\t...props\n}: React.HTMLAttributes<HTMLSpanElement>) => {\n\treturn (\n\t\t<span\n\t\t\tclassName={cx(\"ml-auto text-xs tracking-widest opacity-60\", className)}\n\t\t\t{...props}\n\t\t/>\n\t);\n};\nShortcut.displayName = \"DropdownMenuShortcut\";\n\n/**\n * A menu of options or actions, triggered by a button.\n *\n * @see https://mantle.ngrok.com/components/dropdown-menu\n *\n * @example\n * ```tsx\n * <DropdownMenu.Root>\n *   <DropdownMenu.Trigger asChild>\n *     <Button type=\"button\" appearance=\"outlined\">\n *       Open Menu\n *     </Button>\n *   </DropdownMenu.Trigger>\n *   <DropdownMenu.Content>\n *     <DropdownMenu.Item>Item 1</DropdownMenu.Item>\n *     <DropdownMenu.Item>Item 2</DropdownMenu.Item>\n *   </DropdownMenu.Content>\n * </DropdownMenu.Root>\n * ```\n */\nconst DropdownMenu = {\n\t/**\n\t * The root, stateful component that manages the open/closed state of the dropdown menu.\n\t *\n\t * @see https://mantle.ngrok.com/components/dropdown-menu#api-dropdown-menu\n\t *\n\t * @example\n\t * ```tsx\n\t * <DropdownMenu.Root>\n\t *   <DropdownMenu.Trigger asChild>\n\t *     <Button>Open Menu</Button>\n\t *   </DropdownMenu.Trigger>\n\t *   <DropdownMenu.Content>\n\t *     <DropdownMenu.Item>Item 1</DropdownMenu.Item>\n\t *   </DropdownMenu.Content>\n\t * </DropdownMenu.Root>\n\t * ```\n\t */\n\tRoot,\n\t/**\n\t * A checkbox item in the dropdown menu that can be toggled on and off.\n\t *\n\t * @see https://mantle.ngrok.com/components/dropdown-menu#api-dropdown-menu-checkbox-item\n\t *\n\t * @example\n\t * ```tsx\n\t * <DropdownMenu.Root>\n\t *   <DropdownMenu.Trigger>Open</DropdownMenu.Trigger>\n\t *   <DropdownMenu.Content>\n\t *     <DropdownMenu.CheckboxItem checked={true} onCheckedChange={setChecked}>\n\t *       Show notifications\n\t *     </DropdownMenu.CheckboxItem>\n\t *   </DropdownMenu.Content>\n\t * </DropdownMenu.Root>\n\t * ```\n\t */\n\tCheckboxItem,\n\t/**\n\t * The container for the dropdown menu content. Appears in a portal with scrolling and animations.\n\t *\n\t * @see https://mantle.ngrok.com/components/dropdown-menu#api-dropdown-menu-content\n\t *\n\t * @example\n\t * ```tsx\n\t * <DropdownMenu.Root>\n\t *   <DropdownMenu.Trigger>Open</DropdownMenu.Trigger>\n\t *   <DropdownMenu.Content width=\"trigger\">\n\t *     <DropdownMenu.Item>Edit</DropdownMenu.Item>\n\t *     <DropdownMenu.Item>Delete</DropdownMenu.Item>\n\t *   </DropdownMenu.Content>\n\t * </DropdownMenu.Root>\n\t * ```\n\t */\n\tContent,\n\t/**\n\t * A group container for organizing related dropdown menu items.\n\t *\n\t * @see https://mantle.ngrok.com/components/dropdown-menu#api-dropdown-menu-group\n\t *\n\t * @example\n\t * ```tsx\n\t * <DropdownMenu.Root>\n\t *   <DropdownMenu.Trigger>Open</DropdownMenu.Trigger>\n\t *   <DropdownMenu.Content>\n\t *     <DropdownMenu.Group>\n\t *       <DropdownMenu.Label>Account</DropdownMenu.Label>\n\t *       <DropdownMenu.Item>Profile</DropdownMenu.Item>\n\t *       <DropdownMenu.Item>Settings</DropdownMenu.Item>\n\t *     </DropdownMenu.Group>\n\t *   </DropdownMenu.Content>\n\t * </DropdownMenu.Root>\n\t * ```\n\t */\n\tGroup,\n\t/**\n\t * A standard item in the dropdown menu that can be selected or activated.\n\t *\n\t * @see https://mantle.ngrok.com/components/dropdown-menu#api-dropdown-menu-item\n\t *\n\t * @example\n\t * ```tsx\n\t * <DropdownMenu.Root>\n\t *   <DropdownMenu.Trigger>Open</DropdownMenu.Trigger>\n\t *   <DropdownMenu.Content>\n\t *     <DropdownMenu.Item onSelect={() => handleEdit()}>\n\t *       Edit\n\t *     </DropdownMenu.Item>\n\t *     <DropdownMenu.Item disabled>\n\t *       Delete\n\t *     </DropdownMenu.Item>\n\t *   </DropdownMenu.Content>\n\t * </DropdownMenu.Root>\n\t * ```\n\t */\n\tItem,\n\t/**\n\t * A label for grouping and describing sections within the dropdown menu.\n\t *\n\t * @see https://mantle.ngrok.com/components/dropdown-menu#api-dropdown-menu-label\n\t *\n\t * @example\n\t * ```tsx\n\t * <DropdownMenu.Root>\n\t *   <DropdownMenu.Trigger>Open</DropdownMenu.Trigger>\n\t *   <DropdownMenu.Content>\n\t *     <DropdownMenu.Label>My Account</DropdownMenu.Label>\n\t *     <DropdownMenu.Item>Profile</DropdownMenu.Item>\n\t *     <DropdownMenu.Item>Settings</DropdownMenu.Item>\n\t *   </DropdownMenu.Content>\n\t * </DropdownMenu.Root>\n\t * ```\n\t */\n\tLabel,\n\t/**\n\t * A radio group container for exclusive selection within the dropdown menu.\n\t *\n\t * @see https://mantle.ngrok.com/components/dropdown-menu#api-dropdown-menu-radio-group\n\t *\n\t * @example\n\t * ```tsx\n\t * <DropdownMenu.Root>\n\t *   <DropdownMenu.Trigger>Open</DropdownMenu.Trigger>\n\t *   <DropdownMenu.Content>\n\t *     <DropdownMenu.RadioGroup value={value} onValueChange={setValue}>\n\t *       <DropdownMenu.RadioItem value=\"option1\">Option 1</DropdownMenu.RadioItem>\n\t *       <DropdownMenu.RadioItem value=\"option2\">Option 2</DropdownMenu.RadioItem>\n\t *     </DropdownMenu.RadioGroup>\n\t *   </DropdownMenu.Content>\n\t * </DropdownMenu.Root>\n\t * ```\n\t */\n\tRadioGroup,\n\t/**\n\t * A radio item in the dropdown menu where only one item in the group can be selected.\n\t *\n\t * @see https://mantle.ngrok.com/components/dropdown-menu#api-dropdown-menu-radio-item\n\t *\n\t * @example\n\t * ```tsx\n\t * <DropdownMenu.Root>\n\t *   <DropdownMenu.Trigger>Open</DropdownMenu.Trigger>\n\t *   <DropdownMenu.Content>\n\t *     <DropdownMenu.RadioGroup value=\"small\" onValueChange={setSize}>\n\t *       <DropdownMenu.RadioItem value=\"small\">Small</DropdownMenu.RadioItem>\n\t *       <DropdownMenu.RadioItem value=\"medium\">Medium</DropdownMenu.RadioItem>\n\t *       <DropdownMenu.RadioItem value=\"large\">Large</DropdownMenu.RadioItem>\n\t *     </DropdownMenu.RadioGroup>\n\t *   </DropdownMenu.Content>\n\t * </DropdownMenu.Root>\n\t * ```\n\t */\n\tRadioItem,\n\t/**\n\t * A visual separator for dividing sections within the dropdown menu.\n\t *\n\t * @see https://mantle.ngrok.com/components/dropdown-menu#api-dropdown-menu-separator\n\t *\n\t * @example\n\t * ```tsx\n\t * <DropdownMenu.Root>\n\t *   <DropdownMenu.Trigger>Open</DropdownMenu.Trigger>\n\t *   <DropdownMenu.Content>\n\t *     <DropdownMenu.Item>Edit</DropdownMenu.Item>\n\t *     <DropdownMenu.Item>Copy</DropdownMenu.Item>\n\t *     <DropdownMenu.Separator />\n\t *     <DropdownMenu.Item>Delete</DropdownMenu.Item>\n\t *   </DropdownMenu.Content>\n\t * </DropdownMenu.Root>\n\t * ```\n\t */\n\tSeparator: DropdownSeparator,\n\t/**\n\t * A keyboard shortcut indicator for dropdown menu items.\n\t *\n\t * @see https://mantle.ngrok.com/components/dropdown-menu#api-dropdown-menu-shortcut\n\t *\n\t * @example\n\t * ```tsx\n\t * <DropdownMenu.Root>\n\t *   <DropdownMenu.Trigger>Open</DropdownMenu.Trigger>\n\t *   <DropdownMenu.Content>\n\t *     <DropdownMenu.Item>\n\t *       Save\n\t *       <DropdownMenu.Shortcut>⌘S</DropdownMenu.Shortcut>\n\t *     </DropdownMenu.Item>\n\t *   </DropdownMenu.Content>\n\t * </DropdownMenu.Root>\n\t * ```\n\t */\n\tShortcut,\n\t/**\n\t * A submenu container for creating nested dropdown menus.\n\t *\n\t * @see https://mantle.ngrok.com/components/dropdown-menu#api-dropdown-menu-sub\n\t *\n\t * @example\n\t * ```tsx\n\t * <DropdownMenu.Root>\n\t *   <DropdownMenu.Trigger>Open</DropdownMenu.Trigger>\n\t *   <DropdownMenu.Content>\n\t *     <DropdownMenu.Sub>\n\t *       <DropdownMenu.SubTrigger>More options</DropdownMenu.SubTrigger>\n\t *       <DropdownMenu.SubContent>\n\t *         <DropdownMenu.Item>Sub item 1</DropdownMenu.Item>\n\t *         <DropdownMenu.Item>Sub item 2</DropdownMenu.Item>\n\t *       </DropdownMenu.SubContent>\n\t *     </DropdownMenu.Sub>\n\t *   </DropdownMenu.Content>\n\t * </DropdownMenu.Root>\n\t * ```\n\t */\n\tSub,\n\t/**\n\t * The content container for submenu items.\n\t *\n\t * @see https://mantle.ngrok.com/components/dropdown-menu#api-dropdown-menu-sub-content\n\t *\n\t * @example\n\t * ```tsx\n\t * <DropdownMenu.Root>\n\t *   <DropdownMenu.Trigger>Open</DropdownMenu.Trigger>\n\t *   <DropdownMenu.Content>\n\t *     <DropdownMenu.Sub>\n\t *       <DropdownMenu.SubTrigger>Export</DropdownMenu.SubTrigger>\n\t *       <DropdownMenu.SubContent>\n\t *         <DropdownMenu.Item>Export as PDF</DropdownMenu.Item>\n\t *         <DropdownMenu.Item>Export as CSV</DropdownMenu.Item>\n\t *       </DropdownMenu.SubContent>\n\t *     </DropdownMenu.Sub>\n\t *   </DropdownMenu.Content>\n\t * </DropdownMenu.Root>\n\t * ```\n\t */\n\tSubContent,\n\t/**\n\t * The trigger item that opens a submenu when hovered or focused.\n\t *\n\t * @see https://mantle.ngrok.com/components/dropdown-menu#api-dropdown-menu-sub-trigger\n\t *\n\t * @example\n\t * ```tsx\n\t * <DropdownMenu.Root>\n\t *   <DropdownMenu.Trigger>Open</DropdownMenu.Trigger>\n\t *   <DropdownMenu.Content>\n\t *     <DropdownMenu.Sub>\n\t *       <DropdownMenu.SubTrigger>Share</DropdownMenu.SubTrigger>\n\t *       <DropdownMenu.SubContent>\n\t *         <DropdownMenu.Item>Email</DropdownMenu.Item>\n\t *         <DropdownMenu.Item>Copy link</DropdownMenu.Item>\n\t *       </DropdownMenu.SubContent>\n\t *     </DropdownMenu.Sub>\n\t *   </DropdownMenu.Content>\n\t * </DropdownMenu.Root>\n\t * ```\n\t */\n\tSubTrigger,\n\t/**\n\t * The trigger button that opens the dropdown menu.\n\t *\n\t * @see https://mantle.ngrok.com/components/dropdown-menu#api-dropdown-menu-trigger\n\t *\n\t * @example\n\t * ```tsx\n\t * <DropdownMenu.Root>\n\t *   <DropdownMenu.Trigger asChild>\n\t *     <Button type=\"button\" appearance=\"outlined\">\n\t *       Open Menu\n\t *     </Button>\n\t *   </DropdownMenu.Trigger>\n\t *   <DropdownMenu.Content>\n\t *     <DropdownMenu.Item>Item 1</DropdownMenu.Item>\n\t *   </DropdownMenu.Content>\n\t * </DropdownMenu.Root>\n\t * ```\n\t */\n\tTrigger,\n} as const;\n\nexport {\n\t//,\n\tDropdownMenu,\n};\n"],"mappings":"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","names":["CaretRightIcon","CheckIcon","DropdownMenuPrimitive","forwardRef","jsx","jsxs","Root","Trigger","Group","Portal","Sub","RadioGroup","SubTrigger","forwardRef","className","inset","children","props","ref","cx","Icon","CaretRightIcon","SubContent","loop","Content","onClick","width","event","Item","CheckboxItem","checked","CheckIcon","RadioItem","Label","DropdownSeparator","Separator","Shortcut","DropdownMenu"]}
+{"version":3,"sources":["../src/components/dropdown-menu/dropdown-menu.tsx"],"sourcesContent":["import { CaretRightIcon } from \"@phosphor-icons/react/CaretRight\";\nimport { CheckIcon } from \"@phosphor-icons/react/Check\";\nimport * as DropdownMenuPrimitive from \"@radix-ui/react-dropdown-menu\";\nimport type { ComponentPropsWithoutRef, ComponentRef } from \"react\";\nimport { forwardRef } from \"react\";\nimport { cx } from \"../../utils/cx/cx.js\";\nimport { Icon } from \"../icon/icon.js\";\nimport { Separator } from \"../separator/separator.js\";\n\n/**\n * A menu of options or actions, triggered by a button.\n * This is the root, stateful component that manages the open/closed state of the dropdown menu.\n *\n * @see https://mantle.ngrok.com/components/dropdown-menu#api-dropdown-menu\n *\n * @example\n * ```tsx\n * <DropdownMenu.Root>\n *   <DropdownMenu.Trigger asChild>\n *     <Button type=\"button\" appearance=\"outlined\">\n *       Open Menu\n *     </Button>\n *   </DropdownMenu.Trigger>\n *   <DropdownMenu.Content>\n *     <DropdownMenu.Item>Item 1</DropdownMenu.Item>\n *     <DropdownMenu.Item>Item 2</DropdownMenu.Item>\n *   </DropdownMenu.Content>\n * </DropdownMenu.Root>\n * ```\n */\nconst Root = DropdownMenuPrimitive.Root;\nRoot.displayName = \"DropdownMenu\";\n\n/**\n * The trigger button that opens the dropdown menu.\n *\n * @see https://mantle.ngrok.com/components/dropdown-menu#api-dropdown-menu-trigger\n *\n * @example\n * ```tsx\n * <DropdownMenu.Root>\n *   <DropdownMenu.Trigger asChild>\n *     <Button type=\"button\" appearance=\"outlined\">\n *       Open Menu\n *     </Button>\n *   </DropdownMenu.Trigger>\n *   <DropdownMenu.Content>\n *     <DropdownMenu.Item>Item 1</DropdownMenu.Item>\n *   </DropdownMenu.Content>\n * </DropdownMenu.Root>\n * ```\n */\nconst Trigger = DropdownMenuPrimitive.Trigger;\nTrigger.displayName = \"DropdownMenuTrigger\";\n\nconst Group = DropdownMenuPrimitive.Group;\nGroup.displayName = \"DropdownMenuGroup\";\n\n/**\n * The portal container for rendering dropdown content outside the normal DOM tree.\n */\nconst Portal = DropdownMenuPrimitive.Portal;\nPortal.displayName = \"DropdownMenuPortal\";\n\nconst Sub = DropdownMenuPrimitive.Sub;\nSub.displayName = \"DropdownMenuSub\";\n\nconst RadioGroup = DropdownMenuPrimitive.RadioGroup;\nRadioGroup.displayName = \"DropdownMenuRadioGroup\";\n\n/**\n * A trigger for a dropdown menu sub-menu.\n *\n * @see https://mantle.ngrok.com/components/dropdown-menu#api-dropdown-menu-sub-trigger\n */\nconst SubTrigger = forwardRef<\n\tComponentRef<typeof DropdownMenuPrimitive.SubTrigger>,\n\tComponentPropsWithoutRef<typeof DropdownMenuPrimitive.SubTrigger> & {\n\t\tinset?: boolean;\n\t}\n>(({ className, inset, children, ...props }, ref) => (\n\t<DropdownMenuPrimitive.SubTrigger\n\t\tclassName={cx(\n\t\t\t\"focus:bg-accent data-state-open:bg-accent relative flex select-none items-center rounded py-1.5 pl-2 pr-9 text-sm outline-hidden\",\n\t\t\t\"data-highlighted:bg-popover-hover data-state-open:bg-popover-hover\",\n\t\t\t\"[&>svg]:size-5 [&_svg]:shrink-0\",\n\t\t\tinset && \"pl-8\",\n\t\t\tclassName,\n\t\t)}\n\t\tref={ref}\n\t\t{...props}\n\t>\n\t\t{children}\n\t\t<span className=\"absolute right-2 flex items-center\">\n\t\t\t<Icon svg={<CaretRightIcon weight=\"bold\" />} className=\"size-4\" />\n\t\t</span>\n\t</DropdownMenuPrimitive.SubTrigger>\n));\nSubTrigger.displayName = \"DropdownMenuSubTrigger\";\n\n/**\n * The content container for a dropdown menu sub-menu.\n *\n * @see https://mantle.ngrok.com/components/dropdown-menu#api-dropdown-menu-sub-content\n */\nconst SubContent = forwardRef<\n\tComponentRef<typeof DropdownMenuPrimitive.SubContent>,\n\tComponentPropsWithoutRef<typeof DropdownMenuPrimitive.SubContent>\n>(({ className, loop = true, ...props }, ref) => (\n\t<Portal>\n\t\t<DropdownMenuPrimitive.SubContent\n\t\t\tclassName={cx(\n\t\t\t\t\"scrollbar\",\n\t\t\t\t\"text-popover-foreground border-popover bg-popover p-1.25 data-state-closed:animate-out data-state-closed:fade-out-0 data-state-closed:zoom-out-95 data-state-open:animate-in data-state-open:fade-in-0 data-state-open:zoom-in-95 data-side-bottom:slide-in-from-top-2 data-side-left:slide-in-from-right-2 data-side-right:slide-in-from-left-2 data-side-top:slide-in-from-bottom-2 z-50 min-w-32 overflow-hidden rounded-md border shadow-xl\",\n\t\t\t\t\"my-2 max-h-[calc(var(--radix-dropdown-menu-content-available-height)-16px)] overflow-auto\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\tloop={loop}\n\t\t\tref={ref}\n\t\t\t{...props}\n\t\t/>\n\t</Portal>\n));\nSubContent.displayName = \"DropdownMenuSubContent\";\n\ntype DropdownMenuContentProps = ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Content> & {\n\t/**\n\t * Whether the DropdownMenuContent should match the width of the trigger or use the intrinsic content width.\n\t */\n\twidth?: \"trigger\" | \"content\";\n};\n\n/**\n * The container for the dropdown menu content.\n *\n * @see https://mantle.ngrok.com/components/dropdown-menu#api-dropdown-menu-content\n *\n * @example\n * ```tsx\n * <DropdownMenu.Root>\n *   <DropdownMenu.Trigger asChild>\n *     <Button type=\"button\" appearance=\"outlined\">\n *       Open Menu\n *     </Button>\n *   </DropdownMenu.Trigger>\n *   <DropdownMenu.Content>\n *     <DropdownMenu.Item>Item 1</DropdownMenu.Item>\n *     <DropdownMenu.Item>Item 2</DropdownMenu.Item>\n *   </DropdownMenu.Content>\n * </DropdownMenu.Root>\n * ```\n */\nconst Content = forwardRef<\n\tComponentRef<typeof DropdownMenuPrimitive.Content>,\n\tDropdownMenuContentProps\n>(({ className, onClick, loop = true, width, ...props }, ref) => (\n\t<Portal>\n\t\t<DropdownMenuPrimitive.Content\n\t\t\tref={ref}\n\t\t\tclassName={cx(\n\t\t\t\t\"scrollbar\",\n\t\t\t\t\"text-popover-foreground border-popover bg-popover p-1.25 z-50 min-w-32 overflow-hidden rounded-md border shadow-xl outline-hidden\",\n\t\t\t\t\"data-side-bottom:slide-in-from-top-2 data-side-left:slide-in-from-right-2 data-side-right:slide-in-from-left-2 data-side-top:slide-in-from-bottom-2 data-state-closed:animate-out data-state-closed:fade-out-0 data-state-closed:zoom-out-95 data-state-open:animate-in data-state-open:fade-in-0 data-state-open:zoom-in-95\",\n\t\t\t\t\"my-2 max-h-[calc(var(--radix-dropdown-menu-content-available-height)-16px)] overflow-auto\",\n\t\t\t\twidth === \"trigger\" && \"w-(--radix-dropdown-menu-trigger-width)\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\tloop={loop}\n\t\t\tonClick={(event) => {\n\t\t\t\t/**\n\t\t\t\t * Prevent the click event from propagating up to parent/containing elements\n\t\t\t\t * of the DropdownMenu\n\t\t\t\t */\n\t\t\t\tevent.stopPropagation();\n\t\t\t\tonClick?.(event);\n\t\t\t}}\n\t\t\t{...props}\n\t\t/>\n\t</Portal>\n));\nContent.displayName = \"DropdownMenuContent\";\n\n/**\n * An item in the dropdown menu.\n *\n * @see https://mantle.ngrok.com/components/dropdown-menu#api-dropdown-menu-item\n *\n * @example\n * ```tsx\n * <DropdownMenu.Root>\n *   <DropdownMenu.Trigger asChild>\n *     <Button type=\"button\" appearance=\"outlined\">\n *       Open Menu\n *     </Button>\n *   </DropdownMenu.Trigger>\n *   <DropdownMenu.Content>\n *     <DropdownMenu.Item>Item 1</DropdownMenu.Item>\n *     <DropdownMenu.Item>Item 2</DropdownMenu.Item>\n *   </DropdownMenu.Content>\n * </DropdownMenu.Root>\n * ```\n */\nconst Item = forwardRef<\n\tComponentRef<typeof DropdownMenuPrimitive.Item>,\n\tComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Item> & {\n\t\tinset?: boolean;\n\t}\n>(({ className, inset, ...props }, ref) => (\n\t<DropdownMenuPrimitive.Item\n\t\tref={ref}\n\t\tclassName={cx(\n\t\t\t\"relative flex cursor-pointer select-none items-center rounded px-2 py-1.5 text-sm font-normal outline-hidden transition-colors\",\n\t\t\t\"data-highlighted:bg-popover-hover data-active-item:dark:bg-popover-hover\",\n\t\t\t\"focus:bg-accent focus:text-accent-foreground\",\n\t\t\t\"data-disabled:cursor-default data-disabled:opacity-50\",\n\t\t\t\"[&>svg]:size-5 [&_svg]:shrink-0\",\n\t\t\tinset && \"pl-8\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t/>\n));\nItem.displayName = \"DropdownMenuItem\";\n\n/**\n * A menu item with a checkbox that can be controlled or uncontrolled.\n *\n * @see https://mantle.ngrok.com/components/dropdown-menu#api-dropdown-menu-checkbox-item\n */\nconst CheckboxItem = forwardRef<\n\tComponentRef<typeof DropdownMenuPrimitive.CheckboxItem>,\n\tComponentPropsWithoutRef<typeof DropdownMenuPrimitive.CheckboxItem>\n>(({ className, children, checked, ...props }, ref) => (\n\t<DropdownMenuPrimitive.CheckboxItem\n\t\tref={ref}\n\t\tclassName={cx(\n\t\t\t\"text-strong data-disabled:pointer-events-none data-disabled:opacity-50 relative flex cursor-pointer select-none items-center gap-2 rounded py-1.5 pl-2 pr-9 text-sm font-normal outline-hidden\",\n\t\t\t\"data-highlighted:bg-popover-hover data-highlighted:dark:bg-popover-hover\",\n\t\t\t\"aria-checked:bg-filled-accent! aria-checked:text-on-filled aria-checked:font-medium\",\n\t\t\t\"[&>svg]:size-5 [&_svg]:shrink-0\",\n\t\t\tclassName,\n\t\t)}\n\t\tchecked={checked}\n\t\t{...props}\n\t>\n\t\t<span className=\"absolute right-2 flex items-center\">\n\t\t\t<DropdownMenuPrimitive.ItemIndicator>\n\t\t\t\t<Icon svg={<CheckIcon weight=\"bold\" />} className=\"size-4\" />\n\t\t\t</DropdownMenuPrimitive.ItemIndicator>\n\t\t</span>\n\t\t{children}\n\t</DropdownMenuPrimitive.CheckboxItem>\n));\nCheckboxItem.displayName = \"DropdownMenuCheckboxItem\";\n\ntype DropdownMenuRadioItemProps = ComponentPropsWithoutRef<\n\ttypeof DropdownMenuPrimitive.RadioItem\n> & {\n\tname?: string;\n\tid?: string;\n};\n\n/**\n * A menu item with a radio button that can be controlled or uncontrolled.\n * Used within a RadioGroup to create a set of mutually exclusive options.\n *\n * @see https://mantle.ngrok.com/components/dropdown-menu#api-dropdown-menu-radio-item\n */\nconst RadioItem = forwardRef<ComponentRef<\"input\">, DropdownMenuRadioItemProps>(\n\t({ className, children, ...props }, ref) => (\n\t\t<DropdownMenuPrimitive.RadioItem\n\t\t\tclassName={cx(\n\t\t\t\t\"group/dropdown-menu-radio-item\",\n\t\t\t\t\"text-strong data-disabled:pointer-events-none data-disabled:opacity-50 relative flex cursor-pointer select-none items-center gap-2 rounded py-1.5 px-2 text-sm font-normal outline-none\",\n\t\t\t\t\"data-highlighted:bg-popover-hover data-highlighted:dark:bg-popover-hover\",\n\t\t\t\t\"aria-checked:bg-filled-accent! aria-checked:text-on-filled aria-checked:font-medium aria-checked:pr-9\",\n\t\t\t\t\"[&>svg]:size-5 [&_svg]:shrink-0\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\tref={ref}\n\t\t\t{...props}\n\t\t>\n\t\t\t<span className=\"absolute right-2 items-center hidden group-aria-checked/dropdown-menu-radio-item:flex\">\n\t\t\t\t<DropdownMenuPrimitive.ItemIndicator>\n\t\t\t\t\t<Icon svg={<CheckIcon weight=\"bold\" />} className=\"size-4\" />\n\t\t\t\t</DropdownMenuPrimitive.ItemIndicator>\n\t\t\t</span>\n\t\t\t{children}\n\t\t</DropdownMenuPrimitive.RadioItem>\n\t),\n);\nRadioItem.displayName = \"DropdownMenuRadioItem\";\n\n/**\n * A label for a group of dropdown menu items.\n *\n * @see https://mantle.ngrok.com/components/dropdown-menu#api-dropdown-menu-label\n */\nconst Label = forwardRef<\n\tComponentRef<typeof DropdownMenuPrimitive.Label>,\n\tComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Label> & {\n\t\tinset?: boolean;\n\t}\n>(({ className, inset, ...props }, ref) => (\n\t<DropdownMenuPrimitive.Label\n\t\tref={ref}\n\t\tclassName={cx(\"px-2 py-1.5 text-sm font-medium\", inset && \"pl-8\", className)}\n\t\t{...props}\n\t/>\n));\nLabel.displayName = \"DropdownMenuLabel\";\n\n/**\n * A visual separator between dropdown menu items or groups.\n *\n * @see https://mantle.ngrok.com/components/dropdown-menu#api-dropdown-menu-separator\n */\nconst DropdownSeparator = forwardRef<\n\tComponentRef<typeof Separator>,\n\tComponentPropsWithoutRef<typeof Separator>\n>(({ className, ...props }, ref) => (\n\t<Separator ref={ref} className={cx(\"-mx-1.25 my-1 w-auto\", className)} {...props} />\n));\nDropdownSeparator.displayName = \"DropdownMenuSeparator\";\n\nconst Shortcut = ({ className, ...props }: React.HTMLAttributes<HTMLSpanElement>) => {\n\treturn (\n\t\t<span className={cx(\"ml-auto text-xs tracking-widest opacity-60\", className)} {...props} />\n\t);\n};\nShortcut.displayName = \"DropdownMenuShortcut\";\n\n/**\n * A menu of options or actions, triggered by a button.\n *\n * @see https://mantle.ngrok.com/components/dropdown-menu\n *\n * @example\n * ```tsx\n * <DropdownMenu.Root>\n *   <DropdownMenu.Trigger asChild>\n *     <Button type=\"button\" appearance=\"outlined\">\n *       Open Menu\n *     </Button>\n *   </DropdownMenu.Trigger>\n *   <DropdownMenu.Content>\n *     <DropdownMenu.Item>Item 1</DropdownMenu.Item>\n *     <DropdownMenu.Item>Item 2</DropdownMenu.Item>\n *   </DropdownMenu.Content>\n * </DropdownMenu.Root>\n * ```\n */\nconst DropdownMenu = {\n\t/**\n\t * The root, stateful component that manages the open/closed state of the dropdown menu.\n\t *\n\t * @see https://mantle.ngrok.com/components/dropdown-menu#api-dropdown-menu\n\t *\n\t * @example\n\t * ```tsx\n\t * <DropdownMenu.Root>\n\t *   <DropdownMenu.Trigger asChild>\n\t *     <Button>Open Menu</Button>\n\t *   </DropdownMenu.Trigger>\n\t *   <DropdownMenu.Content>\n\t *     <DropdownMenu.Item>Item 1</DropdownMenu.Item>\n\t *   </DropdownMenu.Content>\n\t * </DropdownMenu.Root>\n\t * ```\n\t */\n\tRoot,\n\t/**\n\t * A checkbox item in the dropdown menu that can be toggled on and off.\n\t *\n\t * @see https://mantle.ngrok.com/components/dropdown-menu#api-dropdown-menu-checkbox-item\n\t *\n\t * @example\n\t * ```tsx\n\t * <DropdownMenu.Root>\n\t *   <DropdownMenu.Trigger>Open</DropdownMenu.Trigger>\n\t *   <DropdownMenu.Content>\n\t *     <DropdownMenu.CheckboxItem checked={true} onCheckedChange={setChecked}>\n\t *       Show notifications\n\t *     </DropdownMenu.CheckboxItem>\n\t *   </DropdownMenu.Content>\n\t * </DropdownMenu.Root>\n\t * ```\n\t */\n\tCheckboxItem,\n\t/**\n\t * The container for the dropdown menu content. Appears in a portal with scrolling and animations.\n\t *\n\t * @see https://mantle.ngrok.com/components/dropdown-menu#api-dropdown-menu-content\n\t *\n\t * @example\n\t * ```tsx\n\t * <DropdownMenu.Root>\n\t *   <DropdownMenu.Trigger>Open</DropdownMenu.Trigger>\n\t *   <DropdownMenu.Content width=\"trigger\">\n\t *     <DropdownMenu.Item>Edit</DropdownMenu.Item>\n\t *     <DropdownMenu.Item>Delete</DropdownMenu.Item>\n\t *   </DropdownMenu.Content>\n\t * </DropdownMenu.Root>\n\t * ```\n\t */\n\tContent,\n\t/**\n\t * A group container for organizing related dropdown menu items.\n\t *\n\t * @see https://mantle.ngrok.com/components/dropdown-menu#api-dropdown-menu-group\n\t *\n\t * @example\n\t * ```tsx\n\t * <DropdownMenu.Root>\n\t *   <DropdownMenu.Trigger>Open</DropdownMenu.Trigger>\n\t *   <DropdownMenu.Content>\n\t *     <DropdownMenu.Group>\n\t *       <DropdownMenu.Label>Account</DropdownMenu.Label>\n\t *       <DropdownMenu.Item>Profile</DropdownMenu.Item>\n\t *       <DropdownMenu.Item>Settings</DropdownMenu.Item>\n\t *     </DropdownMenu.Group>\n\t *   </DropdownMenu.Content>\n\t * </DropdownMenu.Root>\n\t * ```\n\t */\n\tGroup,\n\t/**\n\t * A standard item in the dropdown menu that can be selected or activated.\n\t *\n\t * @see https://mantle.ngrok.com/components/dropdown-menu#api-dropdown-menu-item\n\t *\n\t * @example\n\t * ```tsx\n\t * <DropdownMenu.Root>\n\t *   <DropdownMenu.Trigger>Open</DropdownMenu.Trigger>\n\t *   <DropdownMenu.Content>\n\t *     <DropdownMenu.Item onSelect={() => handleEdit()}>\n\t *       Edit\n\t *     </DropdownMenu.Item>\n\t *     <DropdownMenu.Item disabled>\n\t *       Delete\n\t *     </DropdownMenu.Item>\n\t *   </DropdownMenu.Content>\n\t * </DropdownMenu.Root>\n\t * ```\n\t */\n\tItem,\n\t/**\n\t * A label for grouping and describing sections within the dropdown menu.\n\t *\n\t * @see https://mantle.ngrok.com/components/dropdown-menu#api-dropdown-menu-label\n\t *\n\t * @example\n\t * ```tsx\n\t * <DropdownMenu.Root>\n\t *   <DropdownMenu.Trigger>Open</DropdownMenu.Trigger>\n\t *   <DropdownMenu.Content>\n\t *     <DropdownMenu.Label>My Account</DropdownMenu.Label>\n\t *     <DropdownMenu.Item>Profile</DropdownMenu.Item>\n\t *     <DropdownMenu.Item>Settings</DropdownMenu.Item>\n\t *   </DropdownMenu.Content>\n\t * </DropdownMenu.Root>\n\t * ```\n\t */\n\tLabel,\n\t/**\n\t * A radio group container for exclusive selection within the dropdown menu.\n\t *\n\t * @see https://mantle.ngrok.com/components/dropdown-menu#api-dropdown-menu-radio-group\n\t *\n\t * @example\n\t * ```tsx\n\t * <DropdownMenu.Root>\n\t *   <DropdownMenu.Trigger>Open</DropdownMenu.Trigger>\n\t *   <DropdownMenu.Content>\n\t *     <DropdownMenu.RadioGroup value={value} onValueChange={setValue}>\n\t *       <DropdownMenu.RadioItem value=\"option1\">Option 1</DropdownMenu.RadioItem>\n\t *       <DropdownMenu.RadioItem value=\"option2\">Option 2</DropdownMenu.RadioItem>\n\t *     </DropdownMenu.RadioGroup>\n\t *   </DropdownMenu.Content>\n\t * </DropdownMenu.Root>\n\t * ```\n\t */\n\tRadioGroup,\n\t/**\n\t * A radio item in the dropdown menu where only one item in the group can be selected.\n\t *\n\t * @see https://mantle.ngrok.com/components/dropdown-menu#api-dropdown-menu-radio-item\n\t *\n\t * @example\n\t * ```tsx\n\t * <DropdownMenu.Root>\n\t *   <DropdownMenu.Trigger>Open</DropdownMenu.Trigger>\n\t *   <DropdownMenu.Content>\n\t *     <DropdownMenu.RadioGroup value=\"small\" onValueChange={setSize}>\n\t *       <DropdownMenu.RadioItem value=\"small\">Small</DropdownMenu.RadioItem>\n\t *       <DropdownMenu.RadioItem value=\"medium\">Medium</DropdownMenu.RadioItem>\n\t *       <DropdownMenu.RadioItem value=\"large\">Large</DropdownMenu.RadioItem>\n\t *     </DropdownMenu.RadioGroup>\n\t *   </DropdownMenu.Content>\n\t * </DropdownMenu.Root>\n\t * ```\n\t */\n\tRadioItem,\n\t/**\n\t * A visual separator for dividing sections within the dropdown menu.\n\t *\n\t * @see https://mantle.ngrok.com/components/dropdown-menu#api-dropdown-menu-separator\n\t *\n\t * @example\n\t * ```tsx\n\t * <DropdownMenu.Root>\n\t *   <DropdownMenu.Trigger>Open</DropdownMenu.Trigger>\n\t *   <DropdownMenu.Content>\n\t *     <DropdownMenu.Item>Edit</DropdownMenu.Item>\n\t *     <DropdownMenu.Item>Copy</DropdownMenu.Item>\n\t *     <DropdownMenu.Separator />\n\t *     <DropdownMenu.Item>Delete</DropdownMenu.Item>\n\t *   </DropdownMenu.Content>\n\t * </DropdownMenu.Root>\n\t * ```\n\t */\n\tSeparator: DropdownSeparator,\n\t/**\n\t * A keyboard shortcut indicator for dropdown menu items.\n\t *\n\t * @see https://mantle.ngrok.com/components/dropdown-menu#api-dropdown-menu-shortcut\n\t *\n\t * @example\n\t * ```tsx\n\t * <DropdownMenu.Root>\n\t *   <DropdownMenu.Trigger>Open</DropdownMenu.Trigger>\n\t *   <DropdownMenu.Content>\n\t *     <DropdownMenu.Item>\n\t *       Save\n\t *       <DropdownMenu.Shortcut>⌘S</DropdownMenu.Shortcut>\n\t *     </DropdownMenu.Item>\n\t *   </DropdownMenu.Content>\n\t * </DropdownMenu.Root>\n\t * ```\n\t */\n\tShortcut,\n\t/**\n\t * A submenu container for creating nested dropdown menus.\n\t *\n\t * @see https://mantle.ngrok.com/components/dropdown-menu#api-dropdown-menu-sub\n\t *\n\t * @example\n\t * ```tsx\n\t * <DropdownMenu.Root>\n\t *   <DropdownMenu.Trigger>Open</DropdownMenu.Trigger>\n\t *   <DropdownMenu.Content>\n\t *     <DropdownMenu.Sub>\n\t *       <DropdownMenu.SubTrigger>More options</DropdownMenu.SubTrigger>\n\t *       <DropdownMenu.SubContent>\n\t *         <DropdownMenu.Item>Sub item 1</DropdownMenu.Item>\n\t *         <DropdownMenu.Item>Sub item 2</DropdownMenu.Item>\n\t *       </DropdownMenu.SubContent>\n\t *     </DropdownMenu.Sub>\n\t *   </DropdownMenu.Content>\n\t * </DropdownMenu.Root>\n\t * ```\n\t */\n\tSub,\n\t/**\n\t * The content container for submenu items.\n\t *\n\t * @see https://mantle.ngrok.com/components/dropdown-menu#api-dropdown-menu-sub-content\n\t *\n\t * @example\n\t * ```tsx\n\t * <DropdownMenu.Root>\n\t *   <DropdownMenu.Trigger>Open</DropdownMenu.Trigger>\n\t *   <DropdownMenu.Content>\n\t *     <DropdownMenu.Sub>\n\t *       <DropdownMenu.SubTrigger>Export</DropdownMenu.SubTrigger>\n\t *       <DropdownMenu.SubContent>\n\t *         <DropdownMenu.Item>Export as PDF</DropdownMenu.Item>\n\t *         <DropdownMenu.Item>Export as CSV</DropdownMenu.Item>\n\t *       </DropdownMenu.SubContent>\n\t *     </DropdownMenu.Sub>\n\t *   </DropdownMenu.Content>\n\t * </DropdownMenu.Root>\n\t * ```\n\t */\n\tSubContent,\n\t/**\n\t * The trigger item that opens a submenu when hovered or focused.\n\t *\n\t * @see https://mantle.ngrok.com/components/dropdown-menu#api-dropdown-menu-sub-trigger\n\t *\n\t * @example\n\t * ```tsx\n\t * <DropdownMenu.Root>\n\t *   <DropdownMenu.Trigger>Open</DropdownMenu.Trigger>\n\t *   <DropdownMenu.Content>\n\t *     <DropdownMenu.Sub>\n\t *       <DropdownMenu.SubTrigger>Share</DropdownMenu.SubTrigger>\n\t *       <DropdownMenu.SubContent>\n\t *         <DropdownMenu.Item>Email</DropdownMenu.Item>\n\t *         <DropdownMenu.Item>Copy link</DropdownMenu.Item>\n\t *       </DropdownMenu.SubContent>\n\t *     </DropdownMenu.Sub>\n\t *   </DropdownMenu.Content>\n\t * </DropdownMenu.Root>\n\t * ```\n\t */\n\tSubTrigger,\n\t/**\n\t * The trigger button that opens the dropdown menu.\n\t *\n\t * @see https://mantle.ngrok.com/components/dropdown-menu#api-dropdown-menu-trigger\n\t *\n\t * @example\n\t * ```tsx\n\t * <DropdownMenu.Root>\n\t *   <DropdownMenu.Trigger asChild>\n\t *     <Button type=\"button\" appearance=\"outlined\">\n\t *       Open Menu\n\t *     </Button>\n\t *   </DropdownMenu.Trigger>\n\t *   <DropdownMenu.Content>\n\t *     <DropdownMenu.Item>Item 1</DropdownMenu.Item>\n\t *   </DropdownMenu.Content>\n\t * </DropdownMenu.Root>\n\t * ```\n\t */\n\tTrigger,\n} as const;\n\nexport {\n\t//,\n\tDropdownMenu,\n};\n"],"mappings":"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","names":["CaretRightIcon","CheckIcon","DropdownMenuPrimitive","forwardRef","jsx","jsxs","Root","Trigger","Group","Portal","Sub","RadioGroup","SubTrigger","forwardRef","className","inset","children","props","ref","cx","Icon","CaretRightIcon","SubContent","loop","Content","onClick","width","event","Item","CheckboxItem","checked","CheckIcon","RadioItem","Label","DropdownSeparator","Separator","Shortcut","DropdownMenu"]}

package/dist/flag.js

@@ -1,2 +1,2 @@
-import{a as A}from"./chunk-PFXFESEN.js";import{cva as R}from"class-variance-authority";import{jsx as N,jsxs as L}from"react/jsx-runtime";var B="https://assets.ngrok.com";var T=R("",{variants:{size:{s:"rounded-[0.0625rem]",m:"rounded-[0.09375rem]",l:"rounded-xs"}}}),n=R("",{variants:{size:{s:"w-4 h-3",m:"w-5 h-[0.9375rem]",l:"w-8 h-6"}}});function r({className:o,code:S,size:M="l",loading:G="lazy",...s}){let C=T({size:M}),t=n({size:M});return L("div",{className:A("flag relative overflow-hidden",C,t,o),...s,children:[N("div",{"aria-hidden":!0,className:A("absolute inset-0 border border-[#000]/10",C)}),N("img",{className:"h-full w-full block object-cover",src:`${B}/flags/${M}/${S}.svg`,alt:`flag for ${S}`,loading:G})]})}r.displayName="Flag";var e=["004","008","010","016","016","020","024","028","031","032","040","044","048","050","051","052","056","060","064","068","070","072","074","076","084","086","090","092","096","100","104","108","112","116","120","124","132","136","140","144","148","152","156","158","162","166","170","174","178","180","184","188","191","192","196","203","204","208","212","214","218","222","226","231","232","233","234","238","239","242","246","248","250","254","258","260","262","266","268","270","275","276","288","292","296","300","304","308","312","316","320","324","328","332","334","336","340","344","348","352","356","360","364","368","372","376","380","384","388","392","398","400","404","408","410","414","417","418","422","426","428","430","434","438","440","442","446","450","454","458","462","466","470","474","478","480","484","492","496","498","499","500","504","508","512","516","520","524","528","531","533","534","540","548","554","558","562","566","570","574","578","580","581","583","584","585","586","591","598","600","604","608","612","616","620","624","626","630","634","638","642","643","646","652","654","659","660","662","663","666","670","674","678","682","686","688","690","694","702","703","704","705","706","710","716","724","728","729","732","740","744","748","752","756","760","762","764","768","772","776","780","784","788","792","795","796","798","800","804","807","818","831","832","833","834","836","840","850","854","858","860","862","876","882","887","894","ABW","AD","AE","AF","AFG","AFRUN","AG","AGO","AI","AIA","AL","ALA","ALB","AM","AMS","AND","AO","AQ","AR","ARE","ARG","ARM","AS","ASM","AT","ATA","ATF","ATG","AU","AUS","AUT","AW","AX","AZ","AZE","BA","BB","BD","BDI","BE","BEL","BEN","BF","BFA","BG","BGD","BGR","BH","BHR","BHS","BI","BIH","BJ","BL","BLM","BLR","BLZ","BM","BMU","BN","BO","BOL","BQ-BO","BQ-SA","BQ-SE","BR","BRA","BRB","BRN","BS","BT","BTN","BV","BVT","BW","BWA","BY","BZ","CA","CAF","CAN","CC","CCK","CD","CF","CG","CH","CHE","CHL","CHN","CI","CIV","CK","CL","CM","CMR","CN","CO","COD","COG","COK","COL","COM","CPV","CR","CRI","CU","CUB","CUW","CV","CW","CX","CXR","CY","CYM","CYP","CZ","CZE","DE","DEU","DJ","DJI","DK","DM","DMA","DNK","DO","DOM","EC","ECU","EE","EG","EGY","EH","ER","ERI","ES","ESH","ESP","EST","ET","ETH","EU","FI","FIN","FJ","FJI","FK","FLK","FM","FO","FR","FRA","FRO","FSM","GA","GAB","GB-ENG","GB-NIR","GB-SCT","GB-UKM","GB-WLS","GB","GBR","GD","GE","GEO","GF","GG","GGY","GH","GHA","GI","GIB","GIN","GL","GLP","GM","GMB","GN","GNB","GNQ","GP","GQ","GR","GRC","GRD","GRL","GS","GT","GTM","GU","GUF","GUM","GUY","GW","GY","HK","HKG","HM","HMD","HN","HND","HR","HRV","HT","HTI","HU","HUN","ID","IDN","IE","IL","IM","IMN","IN","IND","IO","IOT","IQ","IR","IRL","IRN","IRQ","IS","ISL","ISR","IT","ITA","JAM","JE","JEY","JM","JO","JOR","JP","JPN","KAZ","KE","KEN","KG","KGZ","KH","KHM","KI","KIR","KM","KN-SK","KNA","KOR","KP","KR","KW","KWT","KY","KZ","LA","LAO","LB","LBN","LBR","LBY","LC","LCA","LI","LIE","LK","LKA","LR","LS","LSO","LT","LTU","LU","LUX","LV","LVA","LY","MA","MAC","MAF","MAR","MC","MCO","MD","MDA","MDG","MDV","ME","MEX","MF","MG","MH","MHL","MK","MKD","ML","MLI","MLT","MM","MMR","MN","MNE","MNG","MNP","MO","MOZ","MP","MQ","MR","MRT","MS","MSR","MT","MTQ","MU","MUS","MV","MW","MWI","MX","MY","MYS","MZ","NA","NAM","NC","NCL","NE","NER","NF","NFK","NG","NGA","NI","NIC","NIU","NL","NLD","NO","NOR","NP","NPL","NR","NRU","NU","NZ","NZL","OM","OMN","PA","PAK","PAN","PCN","PE","PER","PF","PG","PH","PHL","PK","PL","PLW","PM","PN","PNG","POL","PR","PRI","PRK","PRT","PRY","PS","PSE","PT","PW","PY","PYF","QA","QAT","RAINBOW","RE","REU","RO","ROU","RS","RU","RUS","RW","RWA","SA","SAU","SB","SC","SD","SDN","SE","SEN","SG","SGP","SGS","SH","SHN","SI","SJ","SJM","SK","SL","SLB","SLE","SLV","SM","SMR","SN","SO","SOM","SPM","SR","SRB","SS","SSD","ST","STP","SUR","SV","SVK","SVN","SWE","SWZ","SX","SXM","SY","SYC","SYR","SZ","TC","TCA","TCD","TD","TF","TG","TGO","TH","THA","TJ","TJK","TK","TKL","TKM","TL","TLS","TM","TN","TO","TON","TR","TT","TTO","TUN","TUR","TUV","TV","TW","TWN","TZ","TZA","UA","UG","UGA","UKR","UM","UMI","UNASUR","URY","US","USA","UY","UZ","UZB","VA","VAT","VC","VCT","VE","VEN","VG","VGB","VI","VIR","VN","VNM","VU","VUT","WF","WLF","WS","WSM","YE","YEM","ZA","ZAF","ZM","ZMB","ZW","ZWE"];function E(o){return e.includes(o)}export{r as Flag,e as countryCodes,E as isCountryCode};
+import{a as A}from"./chunk-PFXFESEN.js";import{cva as R}from"class-variance-authority";import{jsx as N,jsxs as L}from"react/jsx-runtime";var B="https://assets.ngrok.com";var T=R("",{variants:{size:{s:"rounded-[0.0625rem]",m:"rounded-[0.09375rem]",l:"rounded-xs"}}}),n=R("",{variants:{size:{s:"w-4 h-3",m:"w-5 h-3.75",l:"w-8 h-6"}}});function r({className:o,code:S,size:M="l",loading:G="lazy",...s}){let C=T({size:M}),t=n({size:M});return L("div",{className:A("flag relative overflow-hidden",C,t,o),...s,children:[N("div",{"aria-hidden":!0,className:A("absolute inset-0 border border-[#000]/10",C)}),N("img",{className:"h-full w-full block object-cover",src:`${B}/flags/${M}/${S}.svg`,alt:`flag for ${S}`,loading:G})]})}r.displayName="Flag";var e=["004","008","010","016","016","020","024","028","031","032","040","044","048","050","051","052","056","060","064","068","070","072","074","076","084","086","090","092","096","100","104","108","112","116","120","124","132","136","140","144","148","152","156","158","162","166","170","174","178","180","184","188","191","192","196","203","204","208","212","214","218","222","226","231","232","233","234","238","239","242","246","248","250","254","258","260","262","266","268","270","275","276","288","292","296","300","304","308","312","316","320","324","328","332","334","336","340","344","348","352","356","360","364","368","372","376","380","384","388","392","398","400","404","408","410","414","417","418","422","426","428","430","434","438","440","442","446","450","454","458","462","466","470","474","478","480","484","492","496","498","499","500","504","508","512","516","520","524","528","531","533","534","540","548","554","558","562","566","570","574","578","580","581","583","584","585","586","591","598","600","604","608","612","616","620","624","626","630","634","638","642","643","646","652","654","659","660","662","663","666","670","674","678","682","686","688","690","694","702","703","704","705","706","710","716","724","728","729","732","740","744","748","752","756","760","762","764","768","772","776","780","784","788","792","795","796","798","800","804","807","818","831","832","833","834","836","840","850","854","858","860","862","876","882","887","894","ABW","AD","AE","AF","AFG","AFRUN","AG","AGO","AI","AIA","AL","ALA","ALB","AM","AMS","AND","AO","AQ","AR","ARE","ARG","ARM","AS","ASM","AT","ATA","ATF","ATG","AU","AUS","AUT","AW","AX","AZ","AZE","BA","BB","BD","BDI","BE","BEL","BEN","BF","BFA","BG","BGD","BGR","BH","BHR","BHS","BI","BIH","BJ","BL","BLM","BLR","BLZ","BM","BMU","BN","BO","BOL","BQ-BO","BQ-SA","BQ-SE","BR","BRA","BRB","BRN","BS","BT","BTN","BV","BVT","BW","BWA","BY","BZ","CA","CAF","CAN","CC","CCK","CD","CF","CG","CH","CHE","CHL","CHN","CI","CIV","CK","CL","CM","CMR","CN","CO","COD","COG","COK","COL","COM","CPV","CR","CRI","CU","CUB","CUW","CV","CW","CX","CXR","CY","CYM","CYP","CZ","CZE","DE","DEU","DJ","DJI","DK","DM","DMA","DNK","DO","DOM","EC","ECU","EE","EG","EGY","EH","ER","ERI","ES","ESH","ESP","EST","ET","ETH","EU","FI","FIN","FJ","FJI","FK","FLK","FM","FO","FR","FRA","FRO","FSM","GA","GAB","GB-ENG","GB-NIR","GB-SCT","GB-UKM","GB-WLS","GB","GBR","GD","GE","GEO","GF","GG","GGY","GH","GHA","GI","GIB","GIN","GL","GLP","GM","GMB","GN","GNB","GNQ","GP","GQ","GR","GRC","GRD","GRL","GS","GT","GTM","GU","GUF","GUM","GUY","GW","GY","HK","HKG","HM","HMD","HN","HND","HR","HRV","HT","HTI","HU","HUN","ID","IDN","IE","IL","IM","IMN","IN","IND","IO","IOT","IQ","IR","IRL","IRN","IRQ","IS","ISL","ISR","IT","ITA","JAM","JE","JEY","JM","JO","JOR","JP","JPN","KAZ","KE","KEN","KG","KGZ","KH","KHM","KI","KIR","KM","KN-SK","KNA","KOR","KP","KR","KW","KWT","KY","KZ","LA","LAO","LB","LBN","LBR","LBY","LC","LCA","LI","LIE","LK","LKA","LR","LS","LSO","LT","LTU","LU","LUX","LV","LVA","LY","MA","MAC","MAF","MAR","MC","MCO","MD","MDA","MDG","MDV","ME","MEX","MF","MG","MH","MHL","MK","MKD","ML","MLI","MLT","MM","MMR","MN","MNE","MNG","MNP","MO","MOZ","MP","MQ","MR","MRT","MS","MSR","MT","MTQ","MU","MUS","MV","MW","MWI","MX","MY","MYS","MZ","NA","NAM","NC","NCL","NE","NER","NF","NFK","NG","NGA","NI","NIC","NIU","NL","NLD","NO","NOR","NP","NPL","NR","NRU","NU","NZ","NZL","OM","OMN","PA","PAK","PAN","PCN","PE","PER","PF","PG","PH","PHL","PK","PL","PLW","PM","PN","PNG","POL","PR","PRI","PRK","PRT","PRY","PS","PSE","PT","PW","PY","PYF","QA","QAT","RAINBOW","RE","REU","RO","ROU","RS","RU","RUS","RW","RWA","SA","SAU","SB","SC","SD","SDN","SE","SEN","SG","SGP","SGS","SH","SHN","SI","SJ","SJM","SK","SL","SLB","SLE","SLV","SM","SMR","SN","SO","SOM","SPM","SR","SRB","SS","SSD","ST","STP","SUR","SV","SVK","SVN","SWE","SWZ","SX","SXM","SY","SYC","SYR","SZ","TC","TCA","TCD","TD","TF","TG","TGO","TH","THA","TJ","TJK","TK","TKL","TKM","TL","TLS","TM","TN","TO","TON","TR","TT","TTO","TUN","TUR","TUV","TV","TW","TWN","TZ","TZA","UA","UG","UGA","UKR","UM","UMI","UNASUR","URY","US","USA","UY","UZ","UZB","VA","VAT","VC","VCT","VE","VEN","VG","VGB","VI","VIR","VN","VNM","VU","VUT","WF","WLF","WS","WSM","YE","YEM","ZA","ZAF","ZM","ZMB","ZW","ZWE"];function E(o){return e.includes(o)}export{r as Flag,e as countryCodes,E as isCountryCode};
 //# sourceMappingURL=flag.js.map