@ngrok/mantle 0.27.4 → 0.28.0

package/dist/dropdown-menu.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/dropdown-menu/dropdown-menu.tsx"],"sourcesContent":["import { CaretRight } from \"@phosphor-icons/react/CaretRight\";\nimport { Check } 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 { Separator } from \"../separator/separator.js\";\n\nconst DropdownMenu = DropdownMenuPrimitive.Root;\n\nconst DropdownMenuTrigger = DropdownMenuPrimitive.Trigger;\n\nconst DropdownMenuGroup = DropdownMenuPrimitive.Group;\n\nconst DropdownMenuPortal = DropdownMenuPrimitive.Portal;\n\nconst DropdownMenuSub = DropdownMenuPrimitive.Sub;\n\nconst DropdownMenuRadioGroup = DropdownMenuPrimitive.RadioGroup;\n\nconst DropdownMenuSubTrigger = 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 cursor-pointer select-none items-center rounded py-1.5 pl-2 pr-9 text-sm outline-none\",\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<CaretRight className=\"size-4 shrink-0\" weight=\"bold\" />\n\t\t</span>\n\t</DropdownMenuPrimitive.SubTrigger>\n));\nDropdownMenuSubTrigger.displayName = \"DropdownMenuSubTrigger\";\n\nconst DropdownMenuSubContent = forwardRef<\n\tComponentRef<typeof DropdownMenuPrimitive.SubContent>,\n\tComponentPropsWithoutRef<typeof DropdownMenuPrimitive.SubContent>\n>(({ className, loop = true, ...props }, ref) => (\n\t<DropdownMenuPortal>\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</DropdownMenuPortal>\n));\nDropdownMenuSubContent.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\nconst DropdownMenuContent = forwardRef<\n\tComponentRef<typeof DropdownMenuPrimitive.Content>,\n\tDropdownMenuContentProps\n>(({ className, onClick, loop = true, width, ...props }, ref) => (\n\t<DropdownMenuPortal>\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-none\",\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</DropdownMenuPortal>\n));\nDropdownMenuContent.displayName = \"DropdownMenuContent\";\n\nconst DropdownMenuItem = 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\"focus:bg-accent focus:text-accent-foreground data-disabled:pointer-events-none data-disabled:opacity-50 data-highlighted:bg-popover-hover data-active-item:dark:bg-popover-hover relative flex cursor-pointer select-none items-center rounded px-2 py-1.5 text-sm font-normal outline-none transition-colors\",\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));\nDropdownMenuItem.displayName = \"DropdownMenuItem\";\n\nconst DropdownMenuCheckboxItem = 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-none\",\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<Check className=\"size-5 shrink-0 sm:size-4\" weight=\"bold\" />\n\t\t\t</DropdownMenuPrimitive.ItemIndicator>\n\t\t</span>\n\t\t{children}\n\t</DropdownMenuPrimitive.CheckboxItem>\n));\nDropdownMenuCheckboxItem.displayName = \"DropdownMenuCheckboxItem\";\n\ntype DropdownMenuRadioItemProps = ComponentPropsWithoutRef<\n\ttypeof DropdownMenuPrimitive.RadioItem\n> & {\n\tname?: string;\n\tid?: string;\n};\n\nconst DropdownMenuRadioItem = forwardRef<\n\tComponentRef<\"input\">,\n\tDropdownMenuRadioItemProps\n>(({ className, children, ...props }, ref) => (\n\t<DropdownMenuPrimitive.RadioItem\n\t\tclassName={cx(\n\t\t\t\"group/dropdown-menu-radio-item\",\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 px-2 text-sm font-normal outline-none\",\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 aria-checked:pr-9\",\n\t\t\t\"[&>svg]:size-5 [&_svg]:shrink-0\",\n\t\t\tclassName,\n\t\t)}\n\t\tref={ref}\n\t\t{...props}\n\t>\n\t\t<span className=\"absolute right-2 items-center hidden group-aria-checked/dropdown-menu-radio-item:flex\">\n\t\t\t<DropdownMenuPrimitive.ItemIndicator>\n\t\t\t\t<Check className=\"size-4 shrink-0\" weight=\"bold\" />\n\t\t\t</DropdownMenuPrimitive.ItemIndicator>\n\t\t</span>\n\t\t{children}\n\t</DropdownMenuPrimitive.RadioItem>\n));\nDropdownMenuRadioItem.displayName = \"DropdownMenuRadioItem\";\n\nconst DropdownMenuLabel = 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-semibold\",\n\t\t\tinset && \"pl-8\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t/>\n));\nDropdownMenuLabel.displayName = \"DropdownMenuLabel\";\n\nconst DropdownMenuSeparator = 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));\nDropdownMenuSeparator.displayName = \"DropdownMenuSeparator\";\n\nconst DropdownMenuShortcut = ({\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};\nDropdownMenuShortcut.displayName = \"DropdownMenuShortcut\";\n\nexport {\n\tDropdownMenu,\n\tDropdownMenuCheckboxItem,\n\tDropdownMenuContent,\n\tDropdownMenuGroup,\n\tDropdownMenuItem,\n\tDropdownMenuLabel,\n\tDropdownMenuPortal,\n\tDropdownMenuRadioGroup,\n\tDropdownMenuRadioItem,\n\tDropdownMenuSeparator,\n\tDropdownMenuShortcut,\n\tDropdownMenuSub,\n\tDropdownMenuSubContent,\n\tDropdownMenuSubTrigger,\n\tDropdownMenuTrigger,\n};\n"],"mappings":"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","names":["CaretRight","Check","DropdownMenuPrimitive","forwardRef","jsx","jsxs","DropdownMenu","DropdownMenuTrigger","DropdownMenuGroup","DropdownMenuPortal","DropdownMenuSub","DropdownMenuRadioGroup","DropdownMenuSubTrigger","forwardRef","className","inset","children","props","ref","cx","CaretRight","DropdownMenuSubContent","loop","DropdownMenuContent","onClick","width","event","DropdownMenuItem","DropdownMenuCheckboxItem","checked","Check","DropdownMenuRadioItem","DropdownMenuLabel","DropdownMenuSeparator","Separator","DropdownMenuShortcut"]}
+{"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\nconst DropdownMenu = DropdownMenuPrimitive.Root;\n\nconst DropdownMenuTrigger = DropdownMenuPrimitive.Trigger;\n\nconst DropdownMenuGroup = DropdownMenuPrimitive.Group;\n\nconst DropdownMenuPortal = DropdownMenuPrimitive.Portal;\n\nconst DropdownMenuSub = DropdownMenuPrimitive.Sub;\n\nconst DropdownMenuRadioGroup = DropdownMenuPrimitive.RadioGroup;\n\nconst DropdownMenuSubTrigger = 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 cursor-pointer select-none items-center rounded py-1.5 pl-2 pr-9 text-sm outline-none\",\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));\nDropdownMenuSubTrigger.displayName = \"DropdownMenuSubTrigger\";\n\nconst DropdownMenuSubContent = forwardRef<\n\tComponentRef<typeof DropdownMenuPrimitive.SubContent>,\n\tComponentPropsWithoutRef<typeof DropdownMenuPrimitive.SubContent>\n>(({ className, loop = true, ...props }, ref) => (\n\t<DropdownMenuPortal>\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</DropdownMenuPortal>\n));\nDropdownMenuSubContent.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\nconst DropdownMenuContent = forwardRef<\n\tComponentRef<typeof DropdownMenuPrimitive.Content>,\n\tDropdownMenuContentProps\n>(({ className, onClick, loop = true, width, ...props }, ref) => (\n\t<DropdownMenuPortal>\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-none\",\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</DropdownMenuPortal>\n));\nDropdownMenuContent.displayName = \"DropdownMenuContent\";\n\nconst DropdownMenuItem = 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\"focus:bg-accent focus:text-accent-foreground data-disabled:pointer-events-none data-disabled:opacity-50 data-highlighted:bg-popover-hover data-active-item:dark:bg-popover-hover relative flex cursor-pointer select-none items-center rounded px-2 py-1.5 text-sm font-normal outline-none transition-colors\",\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));\nDropdownMenuItem.displayName = \"DropdownMenuItem\";\n\nconst DropdownMenuCheckboxItem = 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-none\",\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));\nDropdownMenuCheckboxItem.displayName = \"DropdownMenuCheckboxItem\";\n\ntype DropdownMenuRadioItemProps = ComponentPropsWithoutRef<\n\ttypeof DropdownMenuPrimitive.RadioItem\n> & {\n\tname?: string;\n\tid?: string;\n};\n\nconst DropdownMenuRadioItem = forwardRef<\n\tComponentRef<\"input\">,\n\tDropdownMenuRadioItemProps\n>(({ className, children, ...props }, ref) => (\n\t<DropdownMenuPrimitive.RadioItem\n\t\tclassName={cx(\n\t\t\t\"group/dropdown-menu-radio-item\",\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 px-2 text-sm font-normal outline-none\",\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 aria-checked:pr-9\",\n\t\t\t\"[&>svg]:size-5 [&_svg]:shrink-0\",\n\t\t\tclassName,\n\t\t)}\n\t\tref={ref}\n\t\t{...props}\n\t>\n\t\t<span className=\"absolute right-2 items-center hidden group-aria-checked/dropdown-menu-radio-item:flex\">\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.RadioItem>\n));\nDropdownMenuRadioItem.displayName = \"DropdownMenuRadioItem\";\n\nconst DropdownMenuLabel = 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-semibold\",\n\t\t\tinset && \"pl-8\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t/>\n));\nDropdownMenuLabel.displayName = \"DropdownMenuLabel\";\n\nconst DropdownMenuSeparator = 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));\nDropdownMenuSeparator.displayName = \"DropdownMenuSeparator\";\n\nconst DropdownMenuShortcut = ({\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};\nDropdownMenuShortcut.displayName = \"DropdownMenuShortcut\";\n\nexport {\n\tDropdownMenu,\n\tDropdownMenuCheckboxItem,\n\tDropdownMenuContent,\n\tDropdownMenuGroup,\n\tDropdownMenuItem,\n\tDropdownMenuLabel,\n\tDropdownMenuPortal,\n\tDropdownMenuRadioGroup,\n\tDropdownMenuRadioItem,\n\tDropdownMenuSeparator,\n\tDropdownMenuShortcut,\n\tDropdownMenuSub,\n\tDropdownMenuSubContent,\n\tDropdownMenuSubTrigger,\n\tDropdownMenuTrigger,\n};\n"],"mappings":"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","names":["CaretRightIcon","CheckIcon","DropdownMenuPrimitive","forwardRef","jsx","jsxs","DropdownMenu","DropdownMenuTrigger","DropdownMenuGroup","DropdownMenuPortal","DropdownMenuSub","DropdownMenuRadioGroup","DropdownMenuSubTrigger","forwardRef","className","inset","children","props","ref","cx","Icon","CaretRightIcon","DropdownMenuSubContent","loop","DropdownMenuContent","onClick","width","event","DropdownMenuItem","DropdownMenuCheckboxItem","checked","CheckIcon","DropdownMenuRadioItem","DropdownMenuLabel","DropdownMenuSeparator","Separator","DropdownMenuShortcut"]}

package/dist/{icon-CS9xptlK.d.ts → icon-Cu-iYUjr.d.ts}

@@ -21,9 +21,9 @@ type IconProps = Omit<SvgAttributes, "children"> & {
  *
  * @example
  * ```tsx
- * import { Shrimp } from "@phosphor-icons/react/Shrimp";
+ * import { ShrimpIcon } from "@phosphor-icons/react/Shrimp";
  *
- * <Icon svg={<Shrimp />} />
+ * <Icon svg={<ShrimpIcon />} />
  * ```
  */
 declare const Icon: react.ForwardRefExoticComponent<Omit<IconProps, "ref"> & react.RefAttributes<SVGSVGElement>>;

package/dist/icon.d.ts

@@ -1,4 +1,4 @@
-export { I as Icon, a as IconProps } from './icon-CS9xptlK.js';
+export { I as Icon, a as IconProps } from './icon-Cu-iYUjr.js';
 export { S as SvgOnly, a as SvgOnlyProps } from './svg-only-CS2INnEL.js';
 export { S as SvgAttributes } from './types-BuKAGhC-.js';
 import 'react';

package/dist/icon.js

@@ -1,2 +1,2 @@
-import"./chunk-72TJUKMV.js";import{a as b}from"./chunk-7O36LG52.js";import{a}from"./chunk-HDPLH5HC.js";import"./chunk-AZ56JGNY.js";export{b as Icon,a as SvgOnly};
+import"./chunk-72TJUKMV.js";import{a as b}from"./chunk-XQVVOOLT.js";import{a}from"./chunk-HDPLH5HC.js";import"./chunk-AZ56JGNY.js";export{b as Icon,a as SvgOnly};
 //# sourceMappingURL=icon.js.map

package/dist/icons.d.ts

@@ -24,7 +24,7 @@ type Props = SvgAttributes & ({
  * A sorting icon that can be used to indicate the sorting direction of a table column or list.
  * It is aware of the sorting mode (alphanumeric or time) and the sorting direction (ascending or descending).
  */
-declare const Sort: {
+declare const SortIcon: {
     ({ mode, direction, ...props }: Props): react_jsx_runtime.JSX.Element;
     displayName: string;
 };
@@ -32,6 +32,6 @@ declare const Sort: {
 /**
  * An icon representing a traffic policy file.
  */
-declare function TrafficPolicyFile(props: SvgAttributes): react_jsx_runtime.JSX.Element;
+declare function TrafficPolicyFileIcon(props: SvgAttributes): react_jsx_runtime.JSX.Element;
 
-export { Sort, TrafficPolicyFile };
+export { SortIcon, TrafficPolicyFileIcon };

package/dist/icons.js

@@ -1,2 +1,2 @@
-import{a as o}from"./chunk-GOXG4BVJ.js";import{a as r}from"./chunk-PLUW72NW.js";import"./chunk-GYPSB3OK.js";export{r as Sort,o as TrafficPolicyFile};
+import{a as o}from"./chunk-3MDQ3LC2.js";import{a as r}from"./chunk-2PHWBRBD.js";import"./chunk-GYPSB3OK.js";export{r as SortIcon,o as TrafficPolicyFileIcon};
 //# sourceMappingURL=icons.js.map

package/dist/input.d.ts

@@ -11,14 +11,14 @@ type InputProps = Omit<InputHTMLAttributes<HTMLInputElement>, "autoComplete" | "
 /**
  * Used to create interactive controls for web-based forms in order to accept data from the user
  */
-declare const Input: react.ForwardRefExoticComponent<Omit<InputHTMLAttributes<HTMLInputElement>, "autoComplete" | "type"> & WithAutoComplete & WithInputType & WithValidation & {
+declare const Input: react.ForwardRefExoticComponent<Omit<InputHTMLAttributes<HTMLInputElement>, "type" | "autoComplete"> & WithAutoComplete & WithInputType & WithValidation & {
     children?: react.ReactNode | undefined;
 } & react.RefAttributes<HTMLInputElement>>;
 type InputCaptureProps = Omit<InputHTMLAttributes<HTMLInputElement>, "autoComplete" | "type"> & BaseProps;
 /**
  * The actual <input /> element that captures user input.
  */
-declare const InputCapture: react.ForwardRefExoticComponent<Omit<InputHTMLAttributes<HTMLInputElement>, "autoComplete" | "type"> & WithAutoComplete & WithInputType & WithValidation & react.RefAttributes<HTMLInputElement>>;
+declare const InputCapture: react.ForwardRefExoticComponent<Omit<InputHTMLAttributes<HTMLInputElement>, "type" | "autoComplete"> & WithAutoComplete & WithInputType & WithValidation & react.RefAttributes<HTMLInputElement>>;
 
 type PasswordInputProps = Omit<InputHTMLAttributes<HTMLInputElement>, "autoComplete" | "type"> & WithValidation & WithAutoComplete & {
     /**
@@ -31,7 +31,7 @@ type PasswordInputProps = Omit<InputHTMLAttributes<HTMLInputElement>, "autoCompl
      */
     showValue?: boolean;
 };
-declare const PasswordInput: react.ForwardRefExoticComponent<Omit<InputHTMLAttributes<HTMLInputElement>, "autoComplete" | "type"> & WithValidation & WithAutoComplete & {
+declare const PasswordInput: react.ForwardRefExoticComponent<Omit<InputHTMLAttributes<HTMLInputElement>, "type" | "autoComplete"> & WithValidation & WithAutoComplete & {
     /**
      * Callback for when the visibility of the password value changes.
      */

package/dist/input.js

@@ -1,2 +1,2 @@
-import{a as M}from"./chunk-ERBZR6SY.js";import{a as y}from"./chunk-MF2QITTY.js";import{a as v}from"./chunk-AZ56JGNY.js";import{CheckCircle as R}from"@phosphor-icons/react/CheckCircle";import{Warning as H}from"@phosphor-icons/react/Warning";import{WarningDiamond as L}from"@phosphor-icons/react/WarningDiamond";import E from"clsx";import{createContext as W,forwardRef as x,useContext as A,useRef as N}from"react";import{jsx as o,jsxs as g}from"react/jsx-runtime";var f=x(({children:t,className:e,...r},a)=>{let n=!!t,i=N(null);return n?o(w,{className:e,forwardedRef:a,innerRef:i,...r,children:t}):o(w,{...r,className:e,forwardedRef:a,innerRef:i,children:o(c,{...r})})});f.displayName="Input";var c=x(({"aria-invalid":t,className:e,validation:r,...a},n)=>{let{"aria-invalid":i,forwardedRef:s,innerRef:d,validation:m,...u}=A(C),p=m??r,h=(typeof p=="function"?p():p)||void 0,l=i??t??p==="error",I={...u,...a,type:a.type??u.type??"text"};return o("input",{"aria-invalid":l,"data-validation":h,className:v("placeholder:text-placeholder min-w-0 flex-1 bg-transparent text-left autofill:shadow-[inset_0_0_0px_1000px_hsl(var(--blue-50))] focus:outline-none",e),ref:y(n,s,d),...I})});c.displayName="InputCapture";var C=W({validation:void 0,innerRef:{current:null}}),w=({"aria-invalid":t,"aria-disabled":e,children:r,className:a,disabled:n,forwardedRef:i,innerRef:s,style:d,type:m,validation:u,...p})=>{let l=t!=null&&t!=="false"?"error":typeof u=="function"?u():u,I=t??l==="error";return o(C.Provider,{value:{"aria-invalid":t,"aria-disabled":e,disabled:n,type:m,validation:l,...p,forwardedRef:i,innerRef:s},children:g("div",{"aria-invalid":I,"aria-disabled":n??e,"data-validation":l||void 0,className:v("pointer-coarse:text-base h-9 text-sm","bg-form relative flex w-full items-center gap-1.5 rounded-md border px-3 py-2 file:border-0 file:bg-transparent file:text-sm file:font-medium focus-within:outline-none focus-within:ring-4 focus-visible:outline-none focus-visible:ring-4","aria-disabled:opacity-50","has-[input:not(:first-child)]:ps-2.5 has-[input:not(:last-child)]:pe-2.5 [&>:not(input)]:shrink-0 [&_svg]:size-5","border-form text-strong has-[:focus-visible]:border-accent-600 has-[:focus-visible]:ring-focus-accent","data-validation-success:border-success-600 has-[:focus-visible]:data-validation-success:border-success-600 has-[:focus-visible]:data-validation-success:ring-focus-success","data-validation-warning:border-warning-600 has-[:focus-visible]:data-validation-warning:border-warning-600 has-[:focus-visible]:data-validation-warning:ring-focus-warning","data-validation-error:border-danger-600 has-[:focus-visible]:data-validation-error:border-danger-600 has-[:focus-visible]:data-validation-error:ring-focus-danger","autofill:shadow-[inset_0_0_0px_1000px_hsl(var(--blue-50))] has-[:autofill]:bg-blue-50 has-[:autofill]:[-webkit-text-fill-color:hsl(var(--text-strong))]",a),onClick:()=>{s?.current?.focus()},onKeyDown:()=>{s?.current!==document.activeElement&&s?.current?.focus()},style:d,children:[r,o(V,{name:p.name,validation:l})]})})};var V=({name:t,validation:e})=>{switch(e){case"error":return g("div",{className:"text-danger-600 pointer-events-none order-last select-none",children:[o("span",{className:"sr-only",children:E("The value entered for the",t,"input has failed validation.")}),o(H,{"aria-hidden":!0,weight:"fill"})]});case"success":return o("div",{className:"text-success-600 pointer-events-none order-last select-none",children:o(R,{weight:"fill"})});case"warning":return o("div",{className:"text-warning-600 pointer-events-none order-last select-none",children:o(L,{weight:"fill"})});default:return null}};import{Eye as O}from"@phosphor-icons/react/Eye";import{EyeClosed as j}from"@phosphor-icons/react/EyeClosed";import{forwardRef as k,useEffect as B,useState as F}from"react";import{jsx as P,jsxs as b}from"react/jsx-runtime";var T=k(({onValueVisibilityChange:t,showValue:e=!1,...r},a)=>{let[n,i]=F(e),s=n?"text":"password",d=n?O:j;return B(()=>{i(e)},[e]),b(f,{type:s,ref:a,...r,children:[P(c,{}),b("button",{type:"button",tabIndex:-1,className:"text-body hover:text-strong ml-1 cursor-pointer bg-inherit p-0",onClick:()=>{i(!n),t?.(!n)},children:[b("span",{className:"sr-only",children:["Turn password visibility ",n?"off":"on"]}),P(d,{"aria-hidden":!0})]})]})});T.displayName="PasswordInput";export{f as Input,c as InputCapture,T as PasswordInput,M as isInput};
+import{a as R}from"./chunk-ERBZR6SY.js";import{a as x}from"./chunk-MF2QITTY.js";import{a as d}from"./chunk-XQVVOOLT.js";import"./chunk-HDPLH5HC.js";import{a as b}from"./chunk-AZ56JGNY.js";import{CheckCircleIcon as H}from"@phosphor-icons/react/CheckCircle";import{WarningIcon as L}from"@phosphor-icons/react/Warning";import{WarningDiamondIcon as E}from"@phosphor-icons/react/WarningDiamond";import W from"clsx";import{createContext as A,forwardRef as g,useContext as N,useRef as V}from"react";import{jsx as t,jsxs as T}from"react/jsx-runtime";var m=g(({children:e,className:n,...r},a)=>{let o=!!e,i=V(null);return o?t(C,{className:n,forwardedRef:a,innerRef:i,...r,children:e}):t(C,{...r,className:n,forwardedRef:a,innerRef:i,children:t(f,{...r})})});m.displayName="Input";var f=g(({"aria-invalid":e,className:n,validation:r,...a},o)=>{let{"aria-invalid":i,forwardedRef:s,innerRef:c,validation:I,...u}=N(P),p=I??r,w=(typeof p=="function"?p():p)||void 0,l=i??e??p==="error",v={...u,...a,type:a.type??u.type??"text"};return t("input",{"aria-invalid":l,"data-validation":w,className:b("placeholder:text-placeholder min-w-0 flex-1 bg-transparent text-left autofill:shadow-[inset_0_0_0px_1000px_hsl(var(--blue-50))] focus:outline-none",n),ref:x(o,s,c),...v})});f.displayName="InputCapture";var P=A({validation:void 0,innerRef:{current:null}}),C=({"aria-invalid":e,"aria-disabled":n,children:r,className:a,disabled:o,forwardedRef:i,innerRef:s,style:c,type:I,validation:u,...p})=>{let l=e!=null&&e!=="false"?"error":typeof u=="function"?u():u,v=e??l==="error";return t(P.Provider,{value:{"aria-invalid":e,"aria-disabled":n,disabled:o,type:I,validation:l,...p,forwardedRef:i,innerRef:s},children:T("div",{"aria-invalid":v,"aria-disabled":o??n,"data-validation":l||void 0,className:b("pointer-coarse:text-base h-9 text-sm","bg-form relative flex w-full items-center gap-1.5 rounded-md border px-3 py-2 file:border-0 file:bg-transparent file:text-sm file:font-medium focus-within:outline-none focus-within:ring-4 focus-visible:outline-none focus-visible:ring-4","aria-disabled:opacity-50","has-[input:not(:first-child)]:ps-2.5 has-[input:not(:last-child)]:pe-2.5 [&>:not(input)]:shrink-0 [&_svg]:size-5","border-form text-strong has-[:focus-visible]:border-accent-600 has-[:focus-visible]:ring-focus-accent","data-validation-success:border-success-600 has-[:focus-visible]:data-validation-success:border-success-600 has-[:focus-visible]:data-validation-success:ring-focus-success","data-validation-warning:border-warning-600 has-[:focus-visible]:data-validation-warning:border-warning-600 has-[:focus-visible]:data-validation-warning:ring-focus-warning","data-validation-error:border-danger-600 has-[:focus-visible]:data-validation-error:border-danger-600 has-[:focus-visible]:data-validation-error:ring-focus-danger","autofill:shadow-[inset_0_0_0px_1000px_hsl(var(--blue-50))] has-[:autofill]:bg-blue-50 has-[:autofill]:[-webkit-text-fill-color:hsl(var(--text-strong))]",a),onClick:()=>{s?.current?.focus()},onKeyDown:()=>{s?.current!==document.activeElement&&s?.current?.focus()},style:c,children:[r,t(O,{name:p.name,validation:l})]})})};var O=({name:e,validation:n})=>{switch(n){case"error":return T("div",{className:"text-danger-600 pointer-events-none order-last select-none",children:[t("span",{className:"sr-only",children:W("The value entered for the",e,"input has failed validation.")}),t(d,{svg:t(L,{"aria-hidden":!0,weight:"fill"})})]});case"success":return t("div",{className:"text-success-600 pointer-events-none order-last select-none",children:t(d,{svg:t(H,{weight:"fill"})})});case"warning":return t("div",{className:"text-warning-600 pointer-events-none order-last select-none",children:t(d,{svg:t(E,{weight:"fill"})})});default:return null}};import{EyeIcon as j}from"@phosphor-icons/react/Eye";import{EyeClosedIcon as k}from"@phosphor-icons/react/EyeClosed";import{forwardRef as B,useEffect as F,useState as _}from"react";import{jsx as h,jsxs as y}from"react/jsx-runtime";var M=B(({onValueVisibilityChange:e,showValue:n=!1,...r},a)=>{let[o,i]=_(n),s=o?"text":"password",c=o?j:k;return F(()=>{i(n)},[n]),y(m,{type:s,ref:a,...r,children:[h(f,{}),y("button",{type:"button",tabIndex:-1,className:"text-body hover:text-strong ml-1 cursor-pointer bg-inherit p-0",onClick:()=>{i(!o),e?.(!o)},children:[y("span",{className:"sr-only",children:["Turn password visibility ",o?"off":"on"]}),h(d,{svg:h(c,{"aria-hidden":!0})})]})]})});M.displayName="PasswordInput";export{m as Input,f as InputCapture,M as PasswordInput,R as isInput};
 //# sourceMappingURL=input.js.map

package/dist/input.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/input/input.tsx","../src/components/input/password-input.tsx"],"sourcesContent":["import { CheckCircle } from \"@phosphor-icons/react/CheckCircle\";\nimport { Warning } from \"@phosphor-icons/react/Warning\";\nimport { WarningDiamond } from \"@phosphor-icons/react/WarningDiamond\";\nimport clsx from \"clsx\";\nimport type {\n\tComponentRef,\n\tForwardedRef,\n\tInputHTMLAttributes,\n\tMutableRefObject,\n\tPropsWithChildren,\n} from \"react\";\nimport { createContext, forwardRef, useContext, useRef } from \"react\";\nimport { composeRefs } from \"../../utils/compose-refs/compose-refs.js\";\nimport { cx } from \"../../utils/cx/cx.js\";\nimport type {\n\tValidation,\n\tWithAutoComplete,\n\tWithInputType,\n\tWithValidation,\n} from \"./types.js\";\n\ntype BaseProps = WithAutoComplete & WithInputType & WithValidation;\n\n/**\n * The props for the `Input` component.\n */\ntype InputProps = Omit<\n\tInputHTMLAttributes<HTMLInputElement>,\n\t\"autoComplete\" | \"type\"\n> &\n\tBaseProps &\n\tPropsWithChildren;\n\n/**\n * Used to create interactive controls for web-based forms in order to accept data from the user\n */\nconst Input = forwardRef<HTMLInputElement, InputProps>(\n\t({ children, className, ...props }, forwardedRef) => {\n\t\tconst hasChildren = Boolean(children);\n\t\tconst innerRef = useRef<ComponentRef<\"input\">>(null);\n\n\t\tif (hasChildren) {\n\t\t\treturn (\n\t\t\t\t<InputContainer\n\t\t\t\t\tclassName={className}\n\t\t\t\t\tforwardedRef={forwardedRef}\n\t\t\t\t\tinnerRef={innerRef}\n\t\t\t\t\t{...props}\n\t\t\t\t>\n\t\t\t\t\t{children}\n\t\t\t\t</InputContainer>\n\t\t\t);\n\t\t}\n\n\t\treturn (\n\t\t\t<InputContainer\n\t\t\t\t{...props}\n\t\t\t\tclassName={className}\n\t\t\t\tforwardedRef={forwardedRef}\n\t\t\t\tinnerRef={innerRef}\n\t\t\t>\n\t\t\t\t<InputCapture {...props} />\n\t\t\t</InputContainer>\n\t\t);\n\t},\n);\nInput.displayName = \"Input\";\n\ntype InputCaptureProps = Omit<\n\tInputHTMLAttributes<HTMLInputElement>,\n\t\"autoComplete\" | \"type\"\n> &\n\tBaseProps;\n\n/**\n * The actual <input /> element that captures user input.\n */\nconst InputCapture = forwardRef<HTMLInputElement, InputCaptureProps>(\n\t(\n\t\t{\n\t\t\t\"aria-invalid\": _ariaInvalid,\n\t\t\tclassName,\n\t\t\tvalidation: _validation,\n\t\t\t...restProps\n\t\t},\n\t\tref,\n\t) => {\n\t\tconst {\n\t\t\t\"aria-invalid\": ctxAriaInvalid,\n\t\t\tforwardedRef: ctxForwardedRef,\n\t\t\tinnerRef: ctxInnerRef,\n\t\t\tvalidation: ctxValidation,\n\t\t\t...ctx\n\t\t} = useContext(InputContext);\n\n\t\tconst validation = ctxValidation ?? _validation;\n\t\tconst validationValue =\n\t\t\t(typeof validation === \"function\" ? validation() : validation) ||\n\t\t\tundefined;\n\t\tconst ariaInvalid =\n\t\t\tctxAriaInvalid ?? _ariaInvalid ?? validation === \"error\";\n\t\tconst props = {\n\t\t\t...ctx,\n\t\t\t...restProps,\n\t\t\ttype: restProps.type ?? ctx.type ?? \"text\",\n\t\t};\n\n\t\treturn (\n\t\t\t<input\n\t\t\t\taria-invalid={ariaInvalid}\n\t\t\t\tdata-validation={validationValue}\n\t\t\t\tclassName={cx(\n\t\t\t\t\t\"placeholder:text-placeholder min-w-0 flex-1 bg-transparent text-left autofill:shadow-[inset_0_0_0px_1000px_hsl(var(--blue-50))] focus:outline-none\",\n\t\t\t\t\tclassName,\n\t\t\t\t)}\n\t\t\t\tref={composeRefs(ref, ctxForwardedRef, ctxInnerRef)}\n\t\t\t\t{...props}\n\t\t\t/>\n\t\t);\n\t},\n);\nInputCapture.displayName = \"InputCapture\";\n\ntype InputContextType = Omit<\n\tInputHTMLAttributes<HTMLInputElement>,\n\t\"autoComplete\" | \"type\"\n> &\n\tBaseProps & {\n\t\t/**\n\t\t * inner ref for the input element, controlled by `Input`\n\t\t */\n\t\tinnerRef: MutableRefObject<HTMLInputElement | null>;\n\t\t/**\n\t\t * forwarded ref to the input element, forwarded from `Input` to `InputCapture`\n\t\t */\n\t\tforwardedRef?: ForwardedRef<HTMLInputElement>;\n\t};\n\nconst InputContext = createContext<InputContextType>({\n\tvalidation: undefined,\n\tinnerRef: { current: null },\n});\n\ntype InputContainerProps = InputHTMLAttributes<HTMLInputElement> &\n\tBaseProps & {\n\t\t/**\n\t\t * @private inner ref for the input element, controlled by `Input`\n\t\t */\n\t\tinnerRef: MutableRefObject<HTMLInputElement | null>;\n\t\t/**\n\t\t * @private ref to the input element, forwarded from `Input` to `InputCapture`\n\t\t */\n\t\tforwardedRef: ForwardedRef<HTMLInputElement>;\n\t};\n\n/**\n * The container for the input element.\n */\nconst InputContainer = ({\n\t\"aria-invalid\": _ariaInvalid,\n\t\"aria-disabled\": _ariaDisabled,\n\tchildren,\n\tclassName,\n\tdisabled,\n\tforwardedRef,\n\tinnerRef,\n\tstyle,\n\ttype,\n\tvalidation: _validation,\n\t...props\n}: InputContainerProps) => {\n\tconst isInvalid = _ariaInvalid != null && _ariaInvalid !== \"false\";\n\tconst validation = isInvalid\n\t\t? \"error\"\n\t\t: typeof _validation === \"function\"\n\t\t\t? _validation()\n\t\t\t: _validation;\n\tconst ariaInvalid = _ariaInvalid ?? validation === \"error\";\n\n\treturn (\n\t\t<InputContext.Provider\n\t\t\tvalue={{\n\t\t\t\t\"aria-invalid\": _ariaInvalid,\n\t\t\t\t\"aria-disabled\": _ariaDisabled,\n\t\t\t\tdisabled,\n\t\t\t\ttype,\n\t\t\t\tvalidation,\n\t\t\t\t...props,\n\t\t\t\tforwardedRef,\n\t\t\t\tinnerRef,\n\t\t\t}}\n\t\t>\n\t\t\t<div\n\t\t\t\taria-invalid={ariaInvalid}\n\t\t\t\taria-disabled={disabled ?? _ariaDisabled}\n\t\t\t\tdata-validation={validation || undefined}\n\t\t\t\tclassName={cx(\n\t\t\t\t\t\"pointer-coarse:text-base h-9 text-sm\",\n\t\t\t\t\t\"bg-form relative flex w-full items-center gap-1.5 rounded-md border px-3 py-2 file:border-0 file:bg-transparent file:text-sm file:font-medium focus-within:outline-none focus-within:ring-4 focus-visible:outline-none focus-visible:ring-4\",\n\t\t\t\t\t\"aria-disabled:opacity-50\",\n\t\t\t\t\t\"has-[input:not(:first-child)]:ps-2.5 has-[input:not(:last-child)]:pe-2.5 [&>:not(input)]:shrink-0 [&_svg]:size-5\",\n\t\t\t\t\t\"border-form text-strong has-[:focus-visible]:border-accent-600 has-[:focus-visible]:ring-focus-accent\",\n\t\t\t\t\t\"data-validation-success:border-success-600 has-[:focus-visible]:data-validation-success:border-success-600 has-[:focus-visible]:data-validation-success:ring-focus-success\",\n\t\t\t\t\t\"data-validation-warning:border-warning-600 has-[:focus-visible]:data-validation-warning:border-warning-600 has-[:focus-visible]:data-validation-warning:ring-focus-warning\",\n\t\t\t\t\t\"data-validation-error:border-danger-600 has-[:focus-visible]:data-validation-error:border-danger-600 has-[:focus-visible]:data-validation-error:ring-focus-danger\",\n\t\t\t\t\t\"autofill:shadow-[inset_0_0_0px_1000px_hsl(var(--blue-50))] has-[:autofill]:bg-blue-50 has-[:autofill]:[-webkit-text-fill-color:hsl(var(--text-strong))]\", // Autofill styling on the input itself and any children with autofill styling\n\t\t\t\t\tclassName,\n\t\t\t\t)}\n\t\t\t\tonClick={() => {\n\t\t\t\t\tinnerRef?.current?.focus();\n\t\t\t\t}}\n\t\t\t\tonKeyDown={() => {\n\t\t\t\t\tif (innerRef?.current !== document.activeElement) {\n\t\t\t\t\t\tinnerRef?.current?.focus();\n\t\t\t\t\t}\n\t\t\t\t}}\n\t\t\t\tstyle={style}\n\t\t\t>\n\t\t\t\t{children}\n\t\t\t\t<ValidationFeedback name={props.name} validation={validation} />\n\t\t\t</div>\n\t\t</InputContext.Provider>\n\t);\n};\n\nexport { Input, InputCapture };\nexport type { InputProps, InputCaptureProps };\n\nconst ValidationFeedback = ({\n\tname,\n\tvalidation,\n}: { name?: string; validation: Validation | undefined }) => {\n\tswitch (validation) {\n\t\tcase \"error\":\n\t\t\treturn (\n\t\t\t\t<div className=\"text-danger-600 pointer-events-none order-last select-none\">\n\t\t\t\t\t<span className=\"sr-only\">\n\t\t\t\t\t\t{clsx(\n\t\t\t\t\t\t\t\"The value entered for the\",\n\t\t\t\t\t\t\tname,\n\t\t\t\t\t\t\t\"input has failed validation.\",\n\t\t\t\t\t\t)}\n\t\t\t\t\t</span>\n\t\t\t\t\t<Warning aria-hidden weight=\"fill\" />\n\t\t\t\t</div>\n\t\t\t);\n\t\tcase \"success\":\n\t\t\treturn (\n\t\t\t\t<div className=\"text-success-600 pointer-events-none order-last select-none\">\n\t\t\t\t\t<CheckCircle weight=\"fill\" />\n\t\t\t\t</div>\n\t\t\t);\n\t\tcase \"warning\":\n\t\t\treturn (\n\t\t\t\t<div className=\"text-warning-600 pointer-events-none order-last select-none\">\n\t\t\t\t\t<WarningDiamond weight=\"fill\" />\n\t\t\t\t</div>\n\t\t\t);\n\t\tdefault:\n\t\t\treturn null;\n\t}\n};\n","import { Eye } from \"@phosphor-icons/react/Eye\";\nimport { EyeClosed } from \"@phosphor-icons/react/EyeClosed\";\nimport { forwardRef, useEffect, useState } from \"react\";\nimport type { InputHTMLAttributes } from \"react\";\nimport { Input, InputCapture } from \"./input.js\";\nimport type { InputType, WithAutoComplete, WithValidation } from \"./types.js\";\n\ntype PasswordInputProps = Omit<\n\tInputHTMLAttributes<HTMLInputElement>,\n\t\"autoComplete\" | \"type\"\n> &\n\tWithValidation &\n\tWithAutoComplete & {\n\t\t/**\n\t\t * Callback for when the visibility of the password value changes.\n\t\t */\n\t\tonValueVisibilityChange?: (visible: boolean) => void;\n\t\t/**\n\t\t * Show/hide the password value as a controlled state.\n\t\t * @default false\n\t\t */\n\t\tshowValue?: boolean;\n\t};\n\ntype PasswordInputType = Extract<InputType, \"text\" | \"password\">;\n\nconst PasswordInput = forwardRef<HTMLInputElement, PasswordInputProps>(\n\t({ onValueVisibilityChange, showValue = false, ...props }, ref) => {\n\t\tconst [showPassword, setShowPassword] = useState<boolean>(showValue);\n\t\tconst type: PasswordInputType = showPassword ? \"text\" : \"password\";\n\t\tconst EyeCon = showPassword ? Eye : EyeClosed;\n\n\t\tuseEffect(() => {\n\t\t\tsetShowPassword(showValue);\n\t\t}, [showValue]);\n\n\t\treturn (\n\t\t\t<Input type={type} ref={ref} {...props}>\n\t\t\t\t<InputCapture />\n\t\t\t\t<button\n\t\t\t\t\ttype=\"button\"\n\t\t\t\t\ttabIndex={-1}\n\t\t\t\t\tclassName=\"text-body hover:text-strong ml-1 cursor-pointer bg-inherit p-0\"\n\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\tsetShowPassword(!showPassword);\n\t\t\t\t\t\tonValueVisibilityChange?.(!showPassword);\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<span className=\"sr-only\">\n\t\t\t\t\t\tTurn password visibility {showPassword ? \"off\" : \"on\"}\n\t\t\t\t\t</span>\n\t\t\t\t\t<EyeCon aria-hidden />\n\t\t\t\t</button>\n\t\t\t</Input>\n\t\t);\n\t},\n);\nPasswordInput.displayName = \"PasswordInput\";\n\nexport { PasswordInput };\nexport type { PasswordInputProps };\n"],"mappings":"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","names":["CheckCircle","Warning","WarningDiamond","clsx","createContext","forwardRef","useContext","useRef","jsx","jsxs","Input","forwardRef","children","className","props","forwardedRef","hasChildren","innerRef","useRef","InputContainer","InputCapture","_ariaInvalid","_validation","restProps","ref","ctxAriaInvalid","ctxForwardedRef","ctxInnerRef","ctxValidation","ctx","useContext","InputContext","validation","validationValue","ariaInvalid","cx","composeRefs","createContext","_ariaDisabled","disabled","style","type","ValidationFeedback","ValidationFeedback","name","validation","jsxs","jsx","clsx","Warning","CheckCircle","WarningDiamond","Eye","EyeClosed","forwardRef","useEffect","useState","jsx","jsxs","PasswordInput","forwardRef","onValueVisibilityChange","showValue","props","ref","showPassword","setShowPassword","useState","type","EyeCon","Eye","EyeClosed","useEffect","Input","InputCapture"]}
+{"version":3,"sources":["../src/components/input/input.tsx","../src/components/input/password-input.tsx"],"sourcesContent":["import { CheckCircleIcon } from \"@phosphor-icons/react/CheckCircle\";\nimport { WarningIcon } from \"@phosphor-icons/react/Warning\";\nimport { WarningDiamondIcon } from \"@phosphor-icons/react/WarningDiamond\";\nimport clsx from \"clsx\";\nimport type {\n\tComponentRef,\n\tForwardedRef,\n\tInputHTMLAttributes,\n\tMutableRefObject,\n\tPropsWithChildren,\n} from \"react\";\nimport { createContext, forwardRef, useContext, useRef } from \"react\";\nimport { composeRefs } from \"../../utils/compose-refs/compose-refs.js\";\nimport { cx } from \"../../utils/cx/cx.js\";\nimport { Icon } from \"../icon/icon.js\";\nimport type {\n\tValidation,\n\tWithAutoComplete,\n\tWithInputType,\n\tWithValidation,\n} from \"./types.js\";\n\ntype BaseProps = WithAutoComplete & WithInputType & WithValidation;\n\n/**\n * The props for the `Input` component.\n */\ntype InputProps = Omit<\n\tInputHTMLAttributes<HTMLInputElement>,\n\t\"autoComplete\" | \"type\"\n> &\n\tBaseProps &\n\tPropsWithChildren;\n\n/**\n * Used to create interactive controls for web-based forms in order to accept data from the user\n */\nconst Input = forwardRef<HTMLInputElement, InputProps>(\n\t({ children, className, ...props }, forwardedRef) => {\n\t\tconst hasChildren = Boolean(children);\n\t\tconst innerRef = useRef<ComponentRef<\"input\">>(null);\n\n\t\tif (hasChildren) {\n\t\t\treturn (\n\t\t\t\t<InputContainer\n\t\t\t\t\tclassName={className}\n\t\t\t\t\tforwardedRef={forwardedRef}\n\t\t\t\t\tinnerRef={innerRef}\n\t\t\t\t\t{...props}\n\t\t\t\t>\n\t\t\t\t\t{children}\n\t\t\t\t</InputContainer>\n\t\t\t);\n\t\t}\n\n\t\treturn (\n\t\t\t<InputContainer\n\t\t\t\t{...props}\n\t\t\t\tclassName={className}\n\t\t\t\tforwardedRef={forwardedRef}\n\t\t\t\tinnerRef={innerRef}\n\t\t\t>\n\t\t\t\t<InputCapture {...props} />\n\t\t\t</InputContainer>\n\t\t);\n\t},\n);\nInput.displayName = \"Input\";\n\ntype InputCaptureProps = Omit<\n\tInputHTMLAttributes<HTMLInputElement>,\n\t\"autoComplete\" | \"type\"\n> &\n\tBaseProps;\n\n/**\n * The actual <input /> element that captures user input.\n */\nconst InputCapture = forwardRef<HTMLInputElement, InputCaptureProps>(\n\t(\n\t\t{\n\t\t\t\"aria-invalid\": _ariaInvalid,\n\t\t\tclassName,\n\t\t\tvalidation: _validation,\n\t\t\t...restProps\n\t\t},\n\t\tref,\n\t) => {\n\t\tconst {\n\t\t\t\"aria-invalid\": ctxAriaInvalid,\n\t\t\tforwardedRef: ctxForwardedRef,\n\t\t\tinnerRef: ctxInnerRef,\n\t\t\tvalidation: ctxValidation,\n\t\t\t...ctx\n\t\t} = useContext(InputContext);\n\n\t\tconst validation = ctxValidation ?? _validation;\n\t\tconst validationValue =\n\t\t\t(typeof validation === \"function\" ? validation() : validation) ||\n\t\t\tundefined;\n\t\tconst ariaInvalid =\n\t\t\tctxAriaInvalid ?? _ariaInvalid ?? validation === \"error\";\n\t\tconst props = {\n\t\t\t...ctx,\n\t\t\t...restProps,\n\t\t\ttype: restProps.type ?? ctx.type ?? \"text\",\n\t\t};\n\n\t\treturn (\n\t\t\t<input\n\t\t\t\taria-invalid={ariaInvalid}\n\t\t\t\tdata-validation={validationValue}\n\t\t\t\tclassName={cx(\n\t\t\t\t\t\"placeholder:text-placeholder min-w-0 flex-1 bg-transparent text-left autofill:shadow-[inset_0_0_0px_1000px_hsl(var(--blue-50))] focus:outline-none\",\n\t\t\t\t\tclassName,\n\t\t\t\t)}\n\t\t\t\tref={composeRefs(ref, ctxForwardedRef, ctxInnerRef)}\n\t\t\t\t{...props}\n\t\t\t/>\n\t\t);\n\t},\n);\nInputCapture.displayName = \"InputCapture\";\n\ntype InputContextType = Omit<\n\tInputHTMLAttributes<HTMLInputElement>,\n\t\"autoComplete\" | \"type\"\n> &\n\tBaseProps & {\n\t\t/**\n\t\t * inner ref for the input element, controlled by `Input`\n\t\t */\n\t\tinnerRef: MutableRefObject<HTMLInputElement | null>;\n\t\t/**\n\t\t * forwarded ref to the input element, forwarded from `Input` to `InputCapture`\n\t\t */\n\t\tforwardedRef?: ForwardedRef<HTMLInputElement>;\n\t};\n\nconst InputContext = createContext<InputContextType>({\n\tvalidation: undefined,\n\tinnerRef: { current: null },\n});\n\ntype InputContainerProps = InputHTMLAttributes<HTMLInputElement> &\n\tBaseProps & {\n\t\t/**\n\t\t * @private inner ref for the input element, controlled by `Input`\n\t\t */\n\t\tinnerRef: MutableRefObject<HTMLInputElement | null>;\n\t\t/**\n\t\t * @private ref to the input element, forwarded from `Input` to `InputCapture`\n\t\t */\n\t\tforwardedRef: ForwardedRef<HTMLInputElement>;\n\t};\n\n/**\n * The container for the input element.\n */\nconst InputContainer = ({\n\t\"aria-invalid\": _ariaInvalid,\n\t\"aria-disabled\": _ariaDisabled,\n\tchildren,\n\tclassName,\n\tdisabled,\n\tforwardedRef,\n\tinnerRef,\n\tstyle,\n\ttype,\n\tvalidation: _validation,\n\t...props\n}: InputContainerProps) => {\n\tconst isInvalid = _ariaInvalid != null && _ariaInvalid !== \"false\";\n\tconst validation = isInvalid\n\t\t? \"error\"\n\t\t: typeof _validation === \"function\"\n\t\t\t? _validation()\n\t\t\t: _validation;\n\tconst ariaInvalid = _ariaInvalid ?? validation === \"error\";\n\n\treturn (\n\t\t<InputContext.Provider\n\t\t\tvalue={{\n\t\t\t\t\"aria-invalid\": _ariaInvalid,\n\t\t\t\t\"aria-disabled\": _ariaDisabled,\n\t\t\t\tdisabled,\n\t\t\t\ttype,\n\t\t\t\tvalidation,\n\t\t\t\t...props,\n\t\t\t\tforwardedRef,\n\t\t\t\tinnerRef,\n\t\t\t}}\n\t\t>\n\t\t\t<div\n\t\t\t\taria-invalid={ariaInvalid}\n\t\t\t\taria-disabled={disabled ?? _ariaDisabled}\n\t\t\t\tdata-validation={validation || undefined}\n\t\t\t\tclassName={cx(\n\t\t\t\t\t\"pointer-coarse:text-base h-9 text-sm\",\n\t\t\t\t\t\"bg-form relative flex w-full items-center gap-1.5 rounded-md border px-3 py-2 file:border-0 file:bg-transparent file:text-sm file:font-medium focus-within:outline-none focus-within:ring-4 focus-visible:outline-none focus-visible:ring-4\",\n\t\t\t\t\t\"aria-disabled:opacity-50\",\n\t\t\t\t\t\"has-[input:not(:first-child)]:ps-2.5 has-[input:not(:last-child)]:pe-2.5 [&>:not(input)]:shrink-0 [&_svg]:size-5\",\n\t\t\t\t\t\"border-form text-strong has-[:focus-visible]:border-accent-600 has-[:focus-visible]:ring-focus-accent\",\n\t\t\t\t\t\"data-validation-success:border-success-600 has-[:focus-visible]:data-validation-success:border-success-600 has-[:focus-visible]:data-validation-success:ring-focus-success\",\n\t\t\t\t\t\"data-validation-warning:border-warning-600 has-[:focus-visible]:data-validation-warning:border-warning-600 has-[:focus-visible]:data-validation-warning:ring-focus-warning\",\n\t\t\t\t\t\"data-validation-error:border-danger-600 has-[:focus-visible]:data-validation-error:border-danger-600 has-[:focus-visible]:data-validation-error:ring-focus-danger\",\n\t\t\t\t\t\"autofill:shadow-[inset_0_0_0px_1000px_hsl(var(--blue-50))] has-[:autofill]:bg-blue-50 has-[:autofill]:[-webkit-text-fill-color:hsl(var(--text-strong))]\", // Autofill styling on the input itself and any children with autofill styling\n\t\t\t\t\tclassName,\n\t\t\t\t)}\n\t\t\t\tonClick={() => {\n\t\t\t\t\tinnerRef?.current?.focus();\n\t\t\t\t}}\n\t\t\t\tonKeyDown={() => {\n\t\t\t\t\tif (innerRef?.current !== document.activeElement) {\n\t\t\t\t\t\tinnerRef?.current?.focus();\n\t\t\t\t\t}\n\t\t\t\t}}\n\t\t\t\tstyle={style}\n\t\t\t>\n\t\t\t\t{children}\n\t\t\t\t<ValidationFeedback name={props.name} validation={validation} />\n\t\t\t</div>\n\t\t</InputContext.Provider>\n\t);\n};\n\nexport { Input, InputCapture };\nexport type { InputProps, InputCaptureProps };\n\nconst ValidationFeedback = ({\n\tname,\n\tvalidation,\n}: { name?: string; validation: Validation | undefined }) => {\n\tswitch (validation) {\n\t\tcase \"error\":\n\t\t\treturn (\n\t\t\t\t<div className=\"text-danger-600 pointer-events-none order-last select-none\">\n\t\t\t\t\t<span className=\"sr-only\">\n\t\t\t\t\t\t{clsx(\n\t\t\t\t\t\t\t\"The value entered for the\",\n\t\t\t\t\t\t\tname,\n\t\t\t\t\t\t\t\"input has failed validation.\",\n\t\t\t\t\t\t)}\n\t\t\t\t\t</span>\n\t\t\t\t\t<Icon svg={<WarningIcon aria-hidden weight=\"fill\" />} />\n\t\t\t\t</div>\n\t\t\t);\n\t\tcase \"success\":\n\t\t\treturn (\n\t\t\t\t<div className=\"text-success-600 pointer-events-none order-last select-none\">\n\t\t\t\t\t<Icon svg={<CheckCircleIcon weight=\"fill\" />} />\n\t\t\t\t</div>\n\t\t\t);\n\t\tcase \"warning\":\n\t\t\treturn (\n\t\t\t\t<div className=\"text-warning-600 pointer-events-none order-last select-none\">\n\t\t\t\t\t<Icon svg={<WarningDiamondIcon weight=\"fill\" />} />\n\t\t\t\t</div>\n\t\t\t);\n\t\tdefault:\n\t\t\treturn null;\n\t}\n};\n","import { EyeIcon } from \"@phosphor-icons/react/Eye\";\nimport { EyeClosedIcon } from \"@phosphor-icons/react/EyeClosed\";\nimport { forwardRef, useEffect, useState } from \"react\";\nimport type { InputHTMLAttributes } from \"react\";\nimport { Icon } from \"../icon/icon.js\";\nimport { Input, InputCapture } from \"./input.js\";\nimport type { InputType, WithAutoComplete, WithValidation } from \"./types.js\";\n\ntype PasswordInputProps = Omit<\n\tInputHTMLAttributes<HTMLInputElement>,\n\t\"autoComplete\" | \"type\"\n> &\n\tWithValidation &\n\tWithAutoComplete & {\n\t\t/**\n\t\t * Callback for when the visibility of the password value changes.\n\t\t */\n\t\tonValueVisibilityChange?: (visible: boolean) => void;\n\t\t/**\n\t\t * Show/hide the password value as a controlled state.\n\t\t * @default false\n\t\t */\n\t\tshowValue?: boolean;\n\t};\n\ntype PasswordInputType = Extract<InputType, \"text\" | \"password\">;\n\nconst PasswordInput = forwardRef<HTMLInputElement, PasswordInputProps>(\n\t({ onValueVisibilityChange, showValue = false, ...props }, ref) => {\n\t\tconst [showPassword, setShowPassword] = useState<boolean>(showValue);\n\t\tconst type: PasswordInputType = showPassword ? \"text\" : \"password\";\n\t\tconst EyeCon = showPassword ? EyeIcon : EyeClosedIcon;\n\n\t\tuseEffect(() => {\n\t\t\tsetShowPassword(showValue);\n\t\t}, [showValue]);\n\n\t\treturn (\n\t\t\t<Input type={type} ref={ref} {...props}>\n\t\t\t\t<InputCapture />\n\t\t\t\t<button\n\t\t\t\t\ttype=\"button\"\n\t\t\t\t\ttabIndex={-1}\n\t\t\t\t\tclassName=\"text-body hover:text-strong ml-1 cursor-pointer bg-inherit p-0\"\n\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\tsetShowPassword(!showPassword);\n\t\t\t\t\t\tonValueVisibilityChange?.(!showPassword);\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<span className=\"sr-only\">\n\t\t\t\t\t\tTurn password visibility {showPassword ? \"off\" : \"on\"}\n\t\t\t\t\t</span>\n\t\t\t\t\t<Icon svg={<EyeCon aria-hidden />} />\n\t\t\t\t</button>\n\t\t\t</Input>\n\t\t);\n\t},\n);\nPasswordInput.displayName = \"PasswordInput\";\n\nexport { PasswordInput };\nexport type { PasswordInputProps };\n"],"mappings":"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","names":["CheckCircleIcon","WarningIcon","WarningDiamondIcon","clsx","createContext","forwardRef","useContext","useRef","jsx","jsxs","Input","forwardRef","children","className","props","forwardedRef","hasChildren","innerRef","useRef","InputContainer","InputCapture","_ariaInvalid","_validation","restProps","ref","ctxAriaInvalid","ctxForwardedRef","ctxInnerRef","ctxValidation","ctx","useContext","InputContext","validation","validationValue","ariaInvalid","cx","composeRefs","createContext","_ariaDisabled","disabled","style","type","ValidationFeedback","ValidationFeedback","name","validation","jsxs","jsx","clsx","Icon","WarningIcon","CheckCircleIcon","WarningDiamondIcon","EyeIcon","EyeClosedIcon","forwardRef","useEffect","useState","jsx","jsxs","PasswordInput","forwardRef","onValueVisibilityChange","showValue","props","ref","showPassword","setShowPassword","useState","type","EyeCon","EyeIcon","EyeClosedIcon","useEffect","Input","InputCapture","Icon"]}

package/dist/pagination.js

@@ -1,2 +1,2 @@
-import{a as b,c as v,d as x,e as y,g as h}from"./chunk-WGF5NYWL.js";import"./chunk-MF2QITTY.js";import{b as z}from"./chunk-UXH22BMO.js";import{a as d}from"./chunk-7XIZZ4HQ.js";import{a as l}from"./chunk-XBVAQ3DV.js";import"./chunk-J3NVDJIE.js";import"./chunk-4LSFAAZW.js";import"./chunk-3C5O3AQA.js";import"./chunk-72TJUKMV.js";import"./chunk-7O36LG52.js";import"./chunk-HDPLH5HC.js";import{a as p}from"./chunk-AZ56JGNY.js";import{CaretLeft as k}from"@phosphor-icons/react/CaretLeft";import{CaretRight as A}from"@phosphor-icons/react/CaretRight";import{Slot as E}from"@radix-ui/react-slot";import{createContext as F,forwardRef as m,useContext as N,useState as W}from"react";import P from"tiny-invariant";import{jsx as s,jsxs as f}from"react/jsx-runtime";var c=F(void 0),O=m(({className:n,children:e,defaultPageSize:a,...t},i)=>{let[o,r]=W(a);return s(c.Provider,{value:{defaultPageSize:a,pageSize:o,setPageSize:r},children:s("div",{className:p("inline-flex items-center justify-between gap-2",n),ref:i,...t,children:e})})});O.displayName="CursorPagination";var T=m(({hasNextPage:n,hasPreviousPage:e,onNextPage:a,onPreviousPage:t,...i},o)=>f(d,{appearance:"panel",ref:o,...i,children:[s(l,{appearance:"ghost",disabled:!e,icon:s(k,{}),label:"Previous page",onClick:t,size:"sm",type:"button"}),s(z,{orientation:"vertical",className:"min-h-5"}),s(l,{appearance:"ghost",disabled:!n,icon:s(A,{}),label:"Next page",onClick:a,size:"sm",type:"button"})]}));T.displayName="CursorButtons";var $=[5,10,20,50,100],B=m(({className:n,pageSizes:e=$,onChangePageSize:a,...t},i)=>{let o=N(c);return P(o,"CursorPageSizeSelect must be used as a child of a CursorPagination component"),P(e.includes(o.defaultPageSize),"CursorPagination.defaultPageSize must be included in CursorPageSizeSelect.pageSizes"),P(e.includes(o.pageSize),"CursorPagination.pageSize must be included in CursorPageSizeSelect.pageSizes"),f(b,{defaultValue:`${o.pageSize}`,onValueChange:r=>{let g=Number.parseInt(r,10);Number.isNaN(g)&&(g=o.defaultPageSize),o.setPageSize(g),a?.(g)},children:[s(x,{ref:i,className:p("w-auto min-w-36",n),value:o.pageSize,...t,children:s(v,{})}),s(y,{width:"trigger",children:e.map(r=>f(h,{value:`${r}`,children:[r," per page"]},r))})]})});B.displayName="CursorPageSizeSelect";function D({asChild:n=!1,className:e,...a}){let t=N(c);return P(t,"CursorPageSizeValue must be used as a child of a CursorPagination component"),f(n?E:"span",{className:p("text-muted text-sm font-normal",e),...a,children:[t.pageSize," per page"]})}import{useEffect as V,useState as w}from"react";function H({listSize:n,pageSize:e}){let[a,t]=w(1),[i,o]=w(e);V(()=>{o(e),t(1)},[e]),V(()=>{t(1)},[n]);let r=Math.ceil(n/i),g=(a-1)*i,S=a>1,C=a<r;function M(u){let j=Math.max(1,Math.min(u,r));t(j)}function R(){C&&t(u=>Math.min(u+1,r))}function G(){S&&t(u=>Math.max(u-1,1))}function I(u){o(u),t(1)}function L(){t(r)}function U(){t(1)}return{currentPage:a,goToFirstPage:U,goToLastPage:L,goToPage:M,hasNextPage:C,hasPreviousPage:S,nextPage:R,offset:g,pageSize:i,previousPage:G,setPageSize:I,totalPages:r}}function q(n,e){return n.slice(e.offset,e.offset+e.pageSize)}export{T as CursorButtons,B as CursorPageSizeSelect,D as CursorPageSizeValue,O as CursorPagination,q as getOffsetPaginatedSlice,H as useOffsetPagination};
+import{a as b,c as v,d as x,e as y,g as h}from"./chunk-WVHMNFQD.js";import"./chunk-MF2QITTY.js";import{b as z}from"./chunk-UXH22BMO.js";import{a as d}from"./chunk-7XIZZ4HQ.js";import{a as l}from"./chunk-BK4P33ZH.js";import"./chunk-VTCWSFFJ.js";import"./chunk-4LSFAAZW.js";import"./chunk-3C5O3AQA.js";import"./chunk-72TJUKMV.js";import"./chunk-XQVVOOLT.js";import"./chunk-HDPLH5HC.js";import{a as p}from"./chunk-AZ56JGNY.js";import{CaretLeftIcon as k}from"@phosphor-icons/react/CaretLeft";import{CaretRightIcon as A}from"@phosphor-icons/react/CaretRight";import{Slot as E}from"@radix-ui/react-slot";import{createContext as F,forwardRef as c,useContext as N,useState as W}from"react";import P from"tiny-invariant";import{jsx as s,jsxs as f}from"react/jsx-runtime";var m=F(void 0),O=c(({className:n,children:e,defaultPageSize:a,...t},i)=>{let[o,r]=W(a);return s(m.Provider,{value:{defaultPageSize:a,pageSize:o,setPageSize:r},children:s("div",{className:p("inline-flex items-center justify-between gap-2",n),ref:i,...t,children:e})})});O.displayName="CursorPagination";var T=c(({hasNextPage:n,hasPreviousPage:e,onNextPage:a,onPreviousPage:t,...i},o)=>f(d,{appearance:"panel",ref:o,...i,children:[s(l,{appearance:"ghost",disabled:!e,icon:s(k,{}),label:"Previous page",onClick:t,size:"sm",type:"button"}),s(z,{orientation:"vertical",className:"min-h-5"}),s(l,{appearance:"ghost",disabled:!n,icon:s(A,{}),label:"Next page",onClick:a,size:"sm",type:"button"})]}));T.displayName="CursorButtons";var $=[5,10,20,50,100],B=c(({className:n,pageSizes:e=$,onChangePageSize:a,...t},i)=>{let o=N(m);return P(o,"CursorPageSizeSelect must be used as a child of a CursorPagination component"),P(e.includes(o.defaultPageSize),"CursorPagination.defaultPageSize must be included in CursorPageSizeSelect.pageSizes"),P(e.includes(o.pageSize),"CursorPagination.pageSize must be included in CursorPageSizeSelect.pageSizes"),f(b,{defaultValue:`${o.pageSize}`,onValueChange:r=>{let g=Number.parseInt(r,10);Number.isNaN(g)&&(g=o.defaultPageSize),o.setPageSize(g),a?.(g)},children:[s(x,{ref:i,className:p("w-auto min-w-36",n),value:o.pageSize,...t,children:s(v,{})}),s(y,{width:"trigger",children:e.map(r=>f(h,{value:`${r}`,children:[r," per page"]},r))})]})});B.displayName="CursorPageSizeSelect";function D({asChild:n=!1,className:e,...a}){let t=N(m);return P(t,"CursorPageSizeValue must be used as a child of a CursorPagination component"),f(n?E:"span",{className:p("text-muted text-sm font-normal",e),...a,children:[t.pageSize," per page"]})}import{useEffect as V,useState as w}from"react";function H({listSize:n,pageSize:e}){let[a,t]=w(1),[i,o]=w(e);V(()=>{o(e),t(1)},[e]),V(()=>{t(1)},[n]);let r=Math.ceil(n/i),g=(a-1)*i,S=a>1,C=a<r;function I(u){let j=Math.max(1,Math.min(u,r));t(j)}function M(){C&&t(u=>Math.min(u+1,r))}function R(){S&&t(u=>Math.max(u-1,1))}function G(u){o(u),t(1)}function L(){t(r)}function U(){t(1)}return{currentPage:a,goToFirstPage:U,goToLastPage:L,goToPage:I,hasNextPage:C,hasPreviousPage:S,nextPage:M,offset:g,pageSize:i,previousPage:R,setPageSize:G,totalPages:r}}function q(n,e){return n.slice(e.offset,e.offset+e.pageSize)}export{T as CursorButtons,B as CursorPageSizeSelect,D as CursorPageSizeValue,O as CursorPagination,q as getOffsetPaginatedSlice,H as useOffsetPagination};
 //# sourceMappingURL=pagination.js.map

package/dist/pagination.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/pagination/cursor-pagination.tsx","../src/components/pagination/use-offset-pagination.tsx"],"sourcesContent":["import { CaretLeft } from \"@phosphor-icons/react/CaretLeft\";\nimport { CaretRight } from \"@phosphor-icons/react/CaretRight\";\nimport { Slot } from \"@radix-ui/react-slot\";\nimport {\n\ttype ComponentProps,\n\ttype ComponentRef,\n\tcreateContext,\n\tforwardRef,\n\tuseContext,\n\tuseState,\n} from \"react\";\nimport invariant from \"tiny-invariant\";\nimport type { WithAsChild } from \"../../types/as-child.js\";\nimport { cx } from \"../../utils/cx/cx.js\";\nimport { ButtonGroup, IconButton } from \"../button/index.js\";\nimport {\n\tSelect,\n\tSelectContent,\n\tSelectItem,\n\tSelectTrigger,\n\tSelectValue,\n} from \"../select/select.js\";\nimport { Separator } from \"../separator/separator.js\";\n\ntype CursorPaginationContextValue = {\n\t/**\n\t * The default number of items per page.\n\t */\n\tdefaultPageSize: number;\n\t/**\n\t * The current number of items per page.\n\t */\n\tpageSize: number;\n\t/**\n\t * A function to set the number of items per page.\n\t */\n\tsetPageSize: (value: number) => void;\n};\n\nconst CursorPaginationContext = createContext<\n\tCursorPaginationContextValue | undefined\n>(undefined);\n\ntype CursorPaginationProps = ComponentProps<\"div\"> & {\n\t/**\n\t * The default number of items per page.\n\t */\n\tdefaultPageSize: number;\n};\n\n/**\n * A pagination component for use with cursor-based pagination.\n *\n * Cursor-based pagination is a way of loading data in chunks by using a cursor\n * from the last item on the current page to know where to start the next set,\n * making sure nothing is missed or repeated. Like a linked list, but for chunks\n * of data. It doesn't let you jump to a specific page or know how many total pages\n * there are, but it's more efficient for large or real-time data sets.\n */\nconst CursorPagination = forwardRef<HTMLDivElement, CursorPaginationProps>(\n\t({ className, children, defaultPageSize, ...props }, ref) => {\n\t\tconst [pageSize, setPageSize] = useState<number>(defaultPageSize);\n\n\t\treturn (\n\t\t\t<CursorPaginationContext.Provider\n\t\t\t\tvalue={{ defaultPageSize, pageSize, setPageSize }}\n\t\t\t>\n\t\t\t\t<div\n\t\t\t\t\tclassName={cx(\n\t\t\t\t\t\t\"inline-flex items-center justify-between gap-2\",\n\t\t\t\t\t\tclassName,\n\t\t\t\t\t)}\n\t\t\t\t\tref={ref}\n\t\t\t\t\t{...props}\n\t\t\t\t>\n\t\t\t\t\t{children}\n\t\t\t\t</div>\n\t\t\t</CursorPaginationContext.Provider>\n\t\t);\n\t},\n);\nCursorPagination.displayName = \"CursorPagination\";\n\ntype CursorButtonsProps = Omit<\n\tComponentProps<typeof ButtonGroup>,\n\t\"appearance\"\n> & {\n\t/**\n\t * Whether there is a next page of data to load.\n\t */\n\thasNextPage: boolean;\n\t/**\n\t * Whether there is a previous page of data to load.\n\t */\n\thasPreviousPage: boolean;\n\t/**\n\t * A callback that is called when the next page button is clicked.\n\t */\n\tonNextPage?: () => void;\n\t/**\n\t * A callback that is called when the previous page button is clicked.\n\t */\n\tonPreviousPage?: () => void;\n};\n\n/**\n * A pair of buttons for navigating between pages of data when using cursor-based pagination.\n */\nconst CursorButtons = forwardRef<\n\tComponentRef<typeof ButtonGroup>,\n\tCursorButtonsProps\n>(\n\t(\n\t\t{ hasNextPage, hasPreviousPage, onNextPage, onPreviousPage, ...props },\n\t\tref,\n\t) => {\n\t\t// TODO(cody): this _feels_ like a good spot for left and right arrow keys to navigate between pages when focused on the buttons\n\n\t\treturn (\n\t\t\t<ButtonGroup appearance=\"panel\" ref={ref} {...props}>\n\t\t\t\t<IconButton\n\t\t\t\t\tappearance=\"ghost\"\n\t\t\t\t\tdisabled={!hasPreviousPage}\n\t\t\t\t\ticon={<CaretLeft />}\n\t\t\t\t\tlabel=\"Previous page\"\n\t\t\t\t\tonClick={onPreviousPage}\n\t\t\t\t\tsize=\"sm\"\n\t\t\t\t\ttype=\"button\"\n\t\t\t\t/>\n\t\t\t\t<Separator orientation=\"vertical\" className=\"min-h-5\" />\n\t\t\t\t<IconButton\n\t\t\t\t\tappearance=\"ghost\"\n\t\t\t\t\tdisabled={!hasNextPage}\n\t\t\t\t\ticon={<CaretRight />}\n\t\t\t\t\tlabel=\"Next page\"\n\t\t\t\t\tonClick={onNextPage}\n\t\t\t\t\tsize=\"sm\"\n\t\t\t\t\ttype=\"button\"\n\t\t\t\t/>\n\t\t\t</ButtonGroup>\n\t\t);\n\t},\n);\nCursorButtons.displayName = \"CursorButtons\";\n\nconst defaultPageSizes = [5, 10, 20, 50, 100] as const;\n\ntype CursorPageSizeSelectProps = Omit<\n\tComponentProps<typeof SelectTrigger>,\n\t\"children\"\n> & {\n\t/**\n\t * A list of page sizes to choose from. The default page size must be included in this list.\n\t */\n\tpageSizes?: typeof defaultPageSizes | readonly number[];\n\t/**\n\t * A callback that is called when the page size is changed.\n\t */\n\tonChangePageSize?: (value: number) => void;\n};\n\n/**\n * A select input for changing the number of items per page when using cursor-based pagination.\n */\nconst CursorPageSizeSelect = forwardRef<\n\tComponentRef<typeof SelectTrigger>,\n\tCursorPageSizeSelectProps\n>(\n\t(\n\t\t{ className, pageSizes = defaultPageSizes, onChangePageSize, ...rest },\n\t\tref,\n\t) => {\n\t\tconst ctx = useContext(CursorPaginationContext);\n\n\t\tinvariant(\n\t\t\tctx,\n\t\t\t\"CursorPageSizeSelect must be used as a child of a CursorPagination component\",\n\t\t);\n\n\t\tinvariant(\n\t\t\tpageSizes.includes(ctx.defaultPageSize),\n\t\t\t\"CursorPagination.defaultPageSize must be included in CursorPageSizeSelect.pageSizes\",\n\t\t);\n\n\t\tinvariant(\n\t\t\tpageSizes.includes(ctx.pageSize),\n\t\t\t\"CursorPagination.pageSize must be included in CursorPageSizeSelect.pageSizes\",\n\t\t);\n\n\t\treturn (\n\t\t\t<Select\n\t\t\t\tdefaultValue={`${ctx.pageSize}`}\n\t\t\t\tonValueChange={(value) => {\n\t\t\t\t\tlet newPageSize = Number.parseInt(value, 10);\n\t\t\t\t\tif (Number.isNaN(newPageSize)) {\n\t\t\t\t\t\tnewPageSize = ctx.defaultPageSize;\n\t\t\t\t\t}\n\t\t\t\t\tctx.setPageSize(newPageSize);\n\t\t\t\t\tonChangePageSize?.(newPageSize);\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t<SelectTrigger\n\t\t\t\t\tref={ref}\n\t\t\t\t\tclassName={cx(\"w-auto min-w-36\", className)}\n\t\t\t\t\tvalue={ctx.pageSize}\n\t\t\t\t\t{...rest}\n\t\t\t\t>\n\t\t\t\t\t<SelectValue />\n\t\t\t\t</SelectTrigger>\n\t\t\t\t<SelectContent width=\"trigger\">\n\t\t\t\t\t{pageSizes.map((size) => (\n\t\t\t\t\t\t<SelectItem key={size} value={`${size}`}>\n\t\t\t\t\t\t\t{size} per page\n\t\t\t\t\t\t</SelectItem>\n\t\t\t\t\t))}\n\t\t\t\t</SelectContent>\n\t\t\t</Select>\n\t\t);\n\t},\n);\nCursorPageSizeSelect.displayName = \"CursorPageSizeSelect\";\n\ntype CursorPageSizeValueProps = Omit<ComponentProps<\"span\">, \"children\"> &\n\tWithAsChild;\n\n/**\n * Displays the current page size when using cursor-based pagination as a read-only value.\n */\nfunction CursorPageSizeValue({\n\tasChild = false,\n\tclassName,\n\t...props\n}: CursorPageSizeValueProps) {\n\tconst ctx = useContext(CursorPaginationContext);\n\n\tinvariant(\n\t\tctx,\n\t\t\"CursorPageSizeValue must be used as a child of a CursorPagination component\",\n\t);\n\n\tconst Component = asChild ? Slot : \"span\";\n\n\treturn (\n\t\t<Component\n\t\t\tclassName={cx(\"text-muted text-sm font-normal\", className)}\n\t\t\t{...props}\n\t\t>\n\t\t\t{ctx.pageSize} per page\n\t\t</Component>\n\t);\n}\n\nexport {\n\t//,\n\tCursorButtons,\n\tCursorPageSizeSelect,\n\tCursorPageSizeValue,\n\tCursorPagination,\n};\n\nexport type {\n\t//,\n\tCursorButtonsProps,\n\tCursorPageSizeSelectProps,\n\tCursorPageSizeValueProps,\n\tCursorPaginationProps,\n};\n","import { useEffect, useState } from \"react\";\n\ntype UseOffsetPaginationProps = {\n\t/**\n\t * The total number of items in the list to be paginated.\n\t */\n\tlistSize: number;\n\t/**\n\t * The number of items per page.\n\t */\n\tpageSize: number;\n};\n\ntype OffsetPaginationState = {\n\t/**\n\t * The current page number, 1-indexed (starting at 1).\n\t */\n\tcurrentPage: number;\n\t/**\n\t * Whether there is a previous page.\n\t */\n\thasPreviousPage: boolean;\n\t/**\n\t * Whether there is a next page.\n\t */\n\thasNextPage: boolean;\n\t/**\n\t * Go to a specific page.\n\t */\n\tgoToPage: (page: number) => void;\n\t/**\n\t * Go to the first page.\n\t */\n\tgoToFirstPage: () => void;\n\t/**\n\t * Go to the last page.\n\t */\n\tgoToLastPage: () => void;\n\t/**\n\t * Go to the next page.\n\t */\n\tnextPage: () => void;\n\t/**\n\t * The offset of the current page in the list.\n\t */\n\toffset: number;\n\t/**\n\t * The number of items per page.\n\t */\n\tpageSize: number;\n\t/**\n\t * Go to the previous page.\n\t */\n\tpreviousPage: () => void;\n\t/**\n\t * Set the number of items per page. This will reset the current page to the first page.\n\t */\n\tsetPageSize: (size: number) => void;\n\t/**\n\t * The total number of pages.\n\t */\n\ttotalPages: number;\n};\n\n/**\n * A headless hook for managing offset-based pagination state\n */\nfunction useOffsetPagination({\n\tlistSize,\n\tpageSize,\n}: UseOffsetPaginationProps): OffsetPaginationState {\n\tconst [currentPage, setCurrentPage] = useState(1);\n\tconst [currentPageSize, setCurrentPageSize] = useState(pageSize);\n\n\t// Reset the current page to 1 when the page size prop changes\n\tuseEffect(() => {\n\t\tsetCurrentPageSize(pageSize);\n\t\tsetCurrentPage(1);\n\t}, [pageSize]);\n\n\t// Reset the current page to 1 when the list size prop changes\n\t// biome-ignore lint/correctness/useExhaustiveDependencies: when the listSize prop changes, we want to reset the current page to the start\n\tuseEffect(() => {\n\t\tsetCurrentPage(1);\n\t}, [listSize]);\n\n\tconst totalPages = Math.ceil(listSize / currentPageSize);\n\tconst offset = (currentPage - 1) * currentPageSize;\n\n\tconst hasPreviousPage = currentPage > 1;\n\tconst hasNextPage = currentPage < totalPages;\n\n\tfunction goToPage(page: number) {\n\t\tconst nextPage = Math.max(1, Math.min(page, totalPages));\n\t\tsetCurrentPage(nextPage);\n\t}\n\n\tfunction nextPage() {\n\t\tif (hasNextPage) {\n\t\t\tsetCurrentPage((prev) => Math.min(prev + 1, totalPages));\n\t\t}\n\t}\n\n\tfunction previousPage() {\n\t\tif (hasPreviousPage) {\n\t\t\tsetCurrentPage((prev) => Math.max(prev - 1, 1));\n\t\t}\n\t}\n\n\tfunction setPageSize(size: number) {\n\t\tsetCurrentPageSize(size);\n\t\tsetCurrentPage(1); // reset to the first page when page size changes\n\t}\n\n\tfunction goToLastPage() {\n\t\tsetCurrentPage(totalPages);\n\t}\n\n\tfunction goToFirstPage() {\n\t\tsetCurrentPage(1);\n\t}\n\n\treturn {\n\t\tcurrentPage,\n\t\tgoToFirstPage,\n\t\tgoToLastPage,\n\t\tgoToPage,\n\t\thasNextPage,\n\t\thasPreviousPage,\n\t\tnextPage,\n\t\toffset,\n\t\tpageSize: currentPageSize,\n\t\tpreviousPage,\n\t\tsetPageSize,\n\t\ttotalPages,\n\t};\n}\n\n/**\n * Get a paginated slice of a list based on the current offset pagination state.\n */\nfunction getOffsetPaginatedSlice<T>(\n\tlist: readonly T[],\n\tpagination: OffsetPaginationState,\n): T[] {\n\treturn list.slice(pagination.offset, pagination.offset + pagination.pageSize);\n}\n\nexport {\n\t//,\n\tgetOffsetPaginatedSlice,\n\tuseOffsetPagination,\n};\n\nexport type {\n\t//,\n\tOffsetPaginationState,\n\tUseOffsetPaginationProps,\n};\n"],"mappings":"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","names":["CaretLeft","CaretRight","Slot","createContext","forwardRef","useContext","useState","invariant","jsx","jsxs","CursorPaginationContext","createContext","CursorPagination","forwardRef","className","children","defaultPageSize","props","ref","pageSize","setPageSize","useState","cx","CursorButtons","hasNextPage","hasPreviousPage","onNextPage","onPreviousPage","ButtonGroup","IconButton","CaretLeft","Separator","CaretRight","defaultPageSizes","CursorPageSizeSelect","pageSizes","onChangePageSize","rest","ctx","useContext","invariant","Select","value","newPageSize","SelectTrigger","SelectValue","SelectContent","size","SelectItem","CursorPageSizeValue","asChild","Slot","useEffect","useState","useOffsetPagination","listSize","pageSize","currentPage","setCurrentPage","currentPageSize","setCurrentPageSize","totalPages","offset","hasPreviousPage","hasNextPage","goToPage","page","nextPage","prev","previousPage","setPageSize","size","goToLastPage","goToFirstPage","getOffsetPaginatedSlice","list","pagination"]}
+{"version":3,"sources":["../src/components/pagination/cursor-pagination.tsx","../src/components/pagination/use-offset-pagination.tsx"],"sourcesContent":["import { CaretLeftIcon } from \"@phosphor-icons/react/CaretLeft\";\nimport { CaretRightIcon } from \"@phosphor-icons/react/CaretRight\";\nimport { Slot } from \"@radix-ui/react-slot\";\nimport {\n\ttype ComponentProps,\n\ttype ComponentRef,\n\tcreateContext,\n\tforwardRef,\n\tuseContext,\n\tuseState,\n} from \"react\";\nimport invariant from \"tiny-invariant\";\nimport type { WithAsChild } from \"../../types/as-child.js\";\nimport { cx } from \"../../utils/cx/cx.js\";\nimport { ButtonGroup, IconButton } from \"../button/index.js\";\nimport {\n\tSelect,\n\tSelectContent,\n\tSelectItem,\n\tSelectTrigger,\n\tSelectValue,\n} from \"../select/select.js\";\nimport { Separator } from \"../separator/separator.js\";\n\ntype CursorPaginationContextValue = {\n\t/**\n\t * The default number of items per page.\n\t */\n\tdefaultPageSize: number;\n\t/**\n\t * The current number of items per page.\n\t */\n\tpageSize: number;\n\t/**\n\t * A function to set the number of items per page.\n\t */\n\tsetPageSize: (value: number) => void;\n};\n\nconst CursorPaginationContext = createContext<\n\tCursorPaginationContextValue | undefined\n>(undefined);\n\ntype CursorPaginationProps = ComponentProps<\"div\"> & {\n\t/**\n\t * The default number of items per page.\n\t */\n\tdefaultPageSize: number;\n};\n\n/**\n * A pagination component for use with cursor-based pagination.\n *\n * Cursor-based pagination is a way of loading data in chunks by using a cursor\n * from the last item on the current page to know where to start the next set,\n * making sure nothing is missed or repeated. Like a linked list, but for chunks\n * of data. It doesn't let you jump to a specific page or know how many total pages\n * there are, but it's more efficient for large or real-time data sets.\n */\nconst CursorPagination = forwardRef<HTMLDivElement, CursorPaginationProps>(\n\t({ className, children, defaultPageSize, ...props }, ref) => {\n\t\tconst [pageSize, setPageSize] = useState<number>(defaultPageSize);\n\n\t\treturn (\n\t\t\t<CursorPaginationContext.Provider\n\t\t\t\tvalue={{ defaultPageSize, pageSize, setPageSize }}\n\t\t\t>\n\t\t\t\t<div\n\t\t\t\t\tclassName={cx(\n\t\t\t\t\t\t\"inline-flex items-center justify-between gap-2\",\n\t\t\t\t\t\tclassName,\n\t\t\t\t\t)}\n\t\t\t\t\tref={ref}\n\t\t\t\t\t{...props}\n\t\t\t\t>\n\t\t\t\t\t{children}\n\t\t\t\t</div>\n\t\t\t</CursorPaginationContext.Provider>\n\t\t);\n\t},\n);\nCursorPagination.displayName = \"CursorPagination\";\n\ntype CursorButtonsProps = Omit<\n\tComponentProps<typeof ButtonGroup>,\n\t\"appearance\"\n> & {\n\t/**\n\t * Whether there is a next page of data to load.\n\t */\n\thasNextPage: boolean;\n\t/**\n\t * Whether there is a previous page of data to load.\n\t */\n\thasPreviousPage: boolean;\n\t/**\n\t * A callback that is called when the next page button is clicked.\n\t */\n\tonNextPage?: () => void;\n\t/**\n\t * A callback that is called when the previous page button is clicked.\n\t */\n\tonPreviousPage?: () => void;\n};\n\n/**\n * A pair of buttons for navigating between pages of data when using cursor-based pagination.\n */\nconst CursorButtons = forwardRef<\n\tComponentRef<typeof ButtonGroup>,\n\tCursorButtonsProps\n>(\n\t(\n\t\t{ hasNextPage, hasPreviousPage, onNextPage, onPreviousPage, ...props },\n\t\tref,\n\t) => {\n\t\t// TODO(cody): this _feels_ like a good spot for left and right arrow keys to navigate between pages when focused on the buttons\n\n\t\treturn (\n\t\t\t<ButtonGroup appearance=\"panel\" ref={ref} {...props}>\n\t\t\t\t<IconButton\n\t\t\t\t\tappearance=\"ghost\"\n\t\t\t\t\tdisabled={!hasPreviousPage}\n\t\t\t\t\ticon={<CaretLeftIcon />}\n\t\t\t\t\tlabel=\"Previous page\"\n\t\t\t\t\tonClick={onPreviousPage}\n\t\t\t\t\tsize=\"sm\"\n\t\t\t\t\ttype=\"button\"\n\t\t\t\t/>\n\t\t\t\t<Separator orientation=\"vertical\" className=\"min-h-5\" />\n\t\t\t\t<IconButton\n\t\t\t\t\tappearance=\"ghost\"\n\t\t\t\t\tdisabled={!hasNextPage}\n\t\t\t\t\ticon={<CaretRightIcon />}\n\t\t\t\t\tlabel=\"Next page\"\n\t\t\t\t\tonClick={onNextPage}\n\t\t\t\t\tsize=\"sm\"\n\t\t\t\t\ttype=\"button\"\n\t\t\t\t/>\n\t\t\t</ButtonGroup>\n\t\t);\n\t},\n);\nCursorButtons.displayName = \"CursorButtons\";\n\nconst defaultPageSizes = [5, 10, 20, 50, 100] as const;\n\ntype CursorPageSizeSelectProps = Omit<\n\tComponentProps<typeof SelectTrigger>,\n\t\"children\"\n> & {\n\t/**\n\t * A list of page sizes to choose from. The default page size must be included in this list.\n\t */\n\tpageSizes?: typeof defaultPageSizes | readonly number[];\n\t/**\n\t * A callback that is called when the page size is changed.\n\t */\n\tonChangePageSize?: (value: number) => void;\n};\n\n/**\n * A select input for changing the number of items per page when using cursor-based pagination.\n */\nconst CursorPageSizeSelect = forwardRef<\n\tComponentRef<typeof SelectTrigger>,\n\tCursorPageSizeSelectProps\n>(\n\t(\n\t\t{ className, pageSizes = defaultPageSizes, onChangePageSize, ...rest },\n\t\tref,\n\t) => {\n\t\tconst ctx = useContext(CursorPaginationContext);\n\n\t\tinvariant(\n\t\t\tctx,\n\t\t\t\"CursorPageSizeSelect must be used as a child of a CursorPagination component\",\n\t\t);\n\n\t\tinvariant(\n\t\t\tpageSizes.includes(ctx.defaultPageSize),\n\t\t\t\"CursorPagination.defaultPageSize must be included in CursorPageSizeSelect.pageSizes\",\n\t\t);\n\n\t\tinvariant(\n\t\t\tpageSizes.includes(ctx.pageSize),\n\t\t\t\"CursorPagination.pageSize must be included in CursorPageSizeSelect.pageSizes\",\n\t\t);\n\n\t\treturn (\n\t\t\t<Select\n\t\t\t\tdefaultValue={`${ctx.pageSize}`}\n\t\t\t\tonValueChange={(value) => {\n\t\t\t\t\tlet newPageSize = Number.parseInt(value, 10);\n\t\t\t\t\tif (Number.isNaN(newPageSize)) {\n\t\t\t\t\t\tnewPageSize = ctx.defaultPageSize;\n\t\t\t\t\t}\n\t\t\t\t\tctx.setPageSize(newPageSize);\n\t\t\t\t\tonChangePageSize?.(newPageSize);\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t<SelectTrigger\n\t\t\t\t\tref={ref}\n\t\t\t\t\tclassName={cx(\"w-auto min-w-36\", className)}\n\t\t\t\t\tvalue={ctx.pageSize}\n\t\t\t\t\t{...rest}\n\t\t\t\t>\n\t\t\t\t\t<SelectValue />\n\t\t\t\t</SelectTrigger>\n\t\t\t\t<SelectContent width=\"trigger\">\n\t\t\t\t\t{pageSizes.map((size) => (\n\t\t\t\t\t\t<SelectItem key={size} value={`${size}`}>\n\t\t\t\t\t\t\t{size} per page\n\t\t\t\t\t\t</SelectItem>\n\t\t\t\t\t))}\n\t\t\t\t</SelectContent>\n\t\t\t</Select>\n\t\t);\n\t},\n);\nCursorPageSizeSelect.displayName = \"CursorPageSizeSelect\";\n\ntype CursorPageSizeValueProps = Omit<ComponentProps<\"span\">, \"children\"> &\n\tWithAsChild;\n\n/**\n * Displays the current page size when using cursor-based pagination as a read-only value.\n */\nfunction CursorPageSizeValue({\n\tasChild = false,\n\tclassName,\n\t...props\n}: CursorPageSizeValueProps) {\n\tconst ctx = useContext(CursorPaginationContext);\n\n\tinvariant(\n\t\tctx,\n\t\t\"CursorPageSizeValue must be used as a child of a CursorPagination component\",\n\t);\n\n\tconst Component = asChild ? Slot : \"span\";\n\n\treturn (\n\t\t<Component\n\t\t\tclassName={cx(\"text-muted text-sm font-normal\", className)}\n\t\t\t{...props}\n\t\t>\n\t\t\t{ctx.pageSize} per page\n\t\t</Component>\n\t);\n}\n\nexport {\n\t//,\n\tCursorButtons,\n\tCursorPageSizeSelect,\n\tCursorPageSizeValue,\n\tCursorPagination,\n};\n\nexport type {\n\t//,\n\tCursorButtonsProps,\n\tCursorPageSizeSelectProps,\n\tCursorPageSizeValueProps,\n\tCursorPaginationProps,\n};\n","import { useEffect, useState } from \"react\";\n\ntype UseOffsetPaginationProps = {\n\t/**\n\t * The total number of items in the list to be paginated.\n\t */\n\tlistSize: number;\n\t/**\n\t * The number of items per page.\n\t */\n\tpageSize: number;\n};\n\ntype OffsetPaginationState = {\n\t/**\n\t * The current page number, 1-indexed (starting at 1).\n\t */\n\tcurrentPage: number;\n\t/**\n\t * Whether there is a previous page.\n\t */\n\thasPreviousPage: boolean;\n\t/**\n\t * Whether there is a next page.\n\t */\n\thasNextPage: boolean;\n\t/**\n\t * Go to a specific page.\n\t */\n\tgoToPage: (page: number) => void;\n\t/**\n\t * Go to the first page.\n\t */\n\tgoToFirstPage: () => void;\n\t/**\n\t * Go to the last page.\n\t */\n\tgoToLastPage: () => void;\n\t/**\n\t * Go to the next page.\n\t */\n\tnextPage: () => void;\n\t/**\n\t * The offset of the current page in the list.\n\t */\n\toffset: number;\n\t/**\n\t * The number of items per page.\n\t */\n\tpageSize: number;\n\t/**\n\t * Go to the previous page.\n\t */\n\tpreviousPage: () => void;\n\t/**\n\t * Set the number of items per page. This will reset the current page to the first page.\n\t */\n\tsetPageSize: (size: number) => void;\n\t/**\n\t * The total number of pages.\n\t */\n\ttotalPages: number;\n};\n\n/**\n * A headless hook for managing offset-based pagination state\n */\nfunction useOffsetPagination({\n\tlistSize,\n\tpageSize,\n}: UseOffsetPaginationProps): OffsetPaginationState {\n\tconst [currentPage, setCurrentPage] = useState(1);\n\tconst [currentPageSize, setCurrentPageSize] = useState(pageSize);\n\n\t// Reset the current page to 1 when the page size prop changes\n\tuseEffect(() => {\n\t\tsetCurrentPageSize(pageSize);\n\t\tsetCurrentPage(1);\n\t}, [pageSize]);\n\n\t// Reset the current page to 1 when the list size prop changes\n\t// biome-ignore lint/correctness/useExhaustiveDependencies: when the listSize prop changes, we want to reset the current page to the start\n\tuseEffect(() => {\n\t\tsetCurrentPage(1);\n\t}, [listSize]);\n\n\tconst totalPages = Math.ceil(listSize / currentPageSize);\n\tconst offset = (currentPage - 1) * currentPageSize;\n\n\tconst hasPreviousPage = currentPage > 1;\n\tconst hasNextPage = currentPage < totalPages;\n\n\tfunction goToPage(page: number) {\n\t\tconst nextPage = Math.max(1, Math.min(page, totalPages));\n\t\tsetCurrentPage(nextPage);\n\t}\n\n\tfunction nextPage() {\n\t\tif (hasNextPage) {\n\t\t\tsetCurrentPage((prev) => Math.min(prev + 1, totalPages));\n\t\t}\n\t}\n\n\tfunction previousPage() {\n\t\tif (hasPreviousPage) {\n\t\t\tsetCurrentPage((prev) => Math.max(prev - 1, 1));\n\t\t}\n\t}\n\n\tfunction setPageSize(size: number) {\n\t\tsetCurrentPageSize(size);\n\t\tsetCurrentPage(1); // reset to the first page when page size changes\n\t}\n\n\tfunction goToLastPage() {\n\t\tsetCurrentPage(totalPages);\n\t}\n\n\tfunction goToFirstPage() {\n\t\tsetCurrentPage(1);\n\t}\n\n\treturn {\n\t\tcurrentPage,\n\t\tgoToFirstPage,\n\t\tgoToLastPage,\n\t\tgoToPage,\n\t\thasNextPage,\n\t\thasPreviousPage,\n\t\tnextPage,\n\t\toffset,\n\t\tpageSize: currentPageSize,\n\t\tpreviousPage,\n\t\tsetPageSize,\n\t\ttotalPages,\n\t};\n}\n\n/**\n * Get a paginated slice of a list based on the current offset pagination state.\n */\nfunction getOffsetPaginatedSlice<T>(\n\tlist: readonly T[],\n\tpagination: OffsetPaginationState,\n): T[] {\n\treturn list.slice(pagination.offset, pagination.offset + pagination.pageSize);\n}\n\nexport {\n\t//,\n\tgetOffsetPaginatedSlice,\n\tuseOffsetPagination,\n};\n\nexport type {\n\t//,\n\tOffsetPaginationState,\n\tUseOffsetPaginationProps,\n};\n"],"mappings":"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","names":["CaretLeftIcon","CaretRightIcon","Slot","createContext","forwardRef","useContext","useState","invariant","jsx","jsxs","CursorPaginationContext","createContext","CursorPagination","forwardRef","className","children","defaultPageSize","props","ref","pageSize","setPageSize","useState","cx","CursorButtons","hasNextPage","hasPreviousPage","onNextPage","onPreviousPage","ButtonGroup","IconButton","CaretLeftIcon","Separator","CaretRightIcon","defaultPageSizes","CursorPageSizeSelect","pageSizes","onChangePageSize","rest","ctx","useContext","invariant","Select","value","newPageSize","SelectTrigger","SelectValue","SelectContent","size","SelectItem","CursorPageSizeValue","asChild","Slot","useEffect","useState","useOffsetPagination","listSize","pageSize","currentPage","setCurrentPage","currentPageSize","setCurrentPageSize","totalPages","offset","hasPreviousPage","hasNextPage","goToPage","page","nextPage","prev","previousPage","setPageSize","size","goToLastPage","goToFirstPage","getOffsetPaginatedSlice","list","pagination"]}

package/dist/select.js

@@ -1,2 +1,2 @@
-import{a as e,b as t,c as l,d as S,e as c,f as r,g as o,h as a}from"./chunk-WGF5NYWL.js";import"./chunk-MF2QITTY.js";import"./chunk-UXH22BMO.js";import"./chunk-AZ56JGNY.js";export{e as Select,c as SelectContent,t as SelectGroup,o as SelectItem,r as SelectLabel,a as SelectSeparator,S as SelectTrigger,l as SelectValue};
+import{a as e,b as t,c as l,d as S,e as c,f as r,g as o,h as a}from"./chunk-WVHMNFQD.js";import"./chunk-MF2QITTY.js";import"./chunk-UXH22BMO.js";import"./chunk-XQVVOOLT.js";import"./chunk-HDPLH5HC.js";import"./chunk-AZ56JGNY.js";export{e as Select,c as SelectContent,t as SelectGroup,o as SelectItem,r as SelectLabel,a as SelectSeparator,S as SelectTrigger,l as SelectValue};
 //# sourceMappingURL=select.js.map

package/dist/sheet.js

@@ -1,2 +1,2 @@
-import{a as S,b as u,c as v,d as m,e as p,f as d,g as h,h as f}from"./chunk-PBARMKNJ.js";import{g as c}from"./chunk-UBD43AUE.js";import"./chunk-XN5RN6JW.js";import"./chunk-D3XF6J5A.js";import{a as P}from"./chunk-XBVAQ3DV.js";import"./chunk-4LSFAAZW.js";import"./chunk-3C5O3AQA.js";import"./chunk-72TJUKMV.js";import"./chunk-7O36LG52.js";import"./chunk-HDPLH5HC.js";import{a as r}from"./chunk-AZ56JGNY.js";import{X as D}from"@phosphor-icons/react/X";import{cva as L}from"class-variance-authority";import{forwardRef as n}from"react";import{jsx as i,jsxs as k}from"react/jsx-runtime";var M=S,w=u,A=m,B=v,y=n(({className:e,...t},o)=>i(p,{className:r("bg-overlay data-state-closed:animate-out data-state-closed:fade-out-0 data-state-open:animate-in data-state-open:fade-in-0 fixed inset-0 z-40 backdrop-blur-sm",e),...t,ref:o}));y.displayName=p.displayName;var I=L("bg-dialog border-dialog inset-y-0 h-full w-full fixed z-40 flex flex-col shadow-lg outline-none transition ease-in-out focus-within:outline-none data-state-closed:duration-100 data-state-closed:animate-out data-state-open:duration-100 data-state-open:animate-in",{variants:{side:{left:"data-state-closed:slide-out-to-left data-state-open:slide-in-from-left left-0 border-r",right:"data-state-closed:slide-out-to-right data-state-open:slide-in-from-right right-0 border-l"}},defaultVariants:{side:"right"}}),C=n(({children:e,className:t,onInteractOutside:o,onPointerDownOutside:a,preferredWidth:l="sm:max-w-[30rem]",side:N="right",...R},H)=>k(B,{children:[i(y,{}),i(d,{className:r(I({side:N}),l,t),onInteractOutside:s=>{c(s),o?.(s)},onPointerDownOutside:s=>{c(s),a?.(s)},ref:H,...R,children:e})]}));C.displayName=d.displayName;var O=({size:e="md",type:t="button",label:o="Close Sheet",appearance:a="ghost",...l})=>i(m,{asChild:!0,children:i(P,{appearance:a,icon:i(D,{}),label:o,size:e,type:t,...l})}),W=({className:e,...t})=>i("div",{className:r("scrollbar text-body flex-1 overflow-y-auto p-6",e),...t}),E=({className:e,...t})=>i("div",{className:r("border-dialog-muted flex shrink-0 flex-col gap-2 border-b py-4 pl-6 pr-4","has-[.icon-button]:pr-4",e),...t}),V=({className:e,...t})=>i("div",{className:r("border-dialog-muted flex shrink-0 justify-end gap-2 border-t px-6 py-2.5",e),...t}),g=n(({className:e,...t},o)=>i(h,{ref:o,className:r("text-strong flex-1 truncate text-lg font-medium",e),...t}));g.displayName=h.displayName;var b=n(({children:e,className:t,...o},a)=>i("div",{className:r("flex items-center justify-between gap-2",t),...o,ref:a,children:e}));b.displayName="SheetTitleGroup";var T=n(({className:e,...t},o)=>i(f,{ref:o,className:r("text-body text-sm",e),...t}));T.displayName=f.displayName;var x=n(({children:e,className:t,...o},a)=>i("div",{className:r("flex h-full items-center gap-2",t),...o,ref:a,children:e}));x.displayName="SheetActions";export{M as Sheet,x as SheetActions,W as SheetBody,A as SheetClose,O as SheetCloseIconButton,C as SheetContent,T as SheetDescription,V as SheetFooter,E as SheetHeader,g as SheetTitle,b as SheetTitleGroup,w as SheetTrigger};
+import{a as S,b as u,c as v,d as m,e as p,f as d,g as h,h as f}from"./chunk-PBARMKNJ.js";import{g as c}from"./chunk-3DXMGSDU.js";import"./chunk-XN5RN6JW.js";import"./chunk-D3XF6J5A.js";import{a as P}from"./chunk-BK4P33ZH.js";import"./chunk-4LSFAAZW.js";import"./chunk-3C5O3AQA.js";import"./chunk-72TJUKMV.js";import"./chunk-XQVVOOLT.js";import"./chunk-HDPLH5HC.js";import{a as r}from"./chunk-AZ56JGNY.js";import{XIcon as D}from"@phosphor-icons/react/X";import{cva as L}from"class-variance-authority";import{forwardRef as a}from"react";import{jsx as i,jsxs as k}from"react/jsx-runtime";var M=S,I=u,w=m,A=v,y=a(({className:e,...t},o)=>i(p,{className:r("bg-overlay data-state-closed:animate-out data-state-closed:fade-out-0 data-state-open:animate-in data-state-open:fade-in-0 fixed inset-0 z-40 backdrop-blur-sm",e),...t,ref:o}));y.displayName=p.displayName;var B=L("bg-dialog border-dialog inset-y-0 h-full w-full fixed z-40 flex flex-col shadow-lg outline-none transition ease-in-out focus-within:outline-none data-state-closed:duration-100 data-state-closed:animate-out data-state-open:duration-100 data-state-open:animate-in",{variants:{side:{left:"data-state-closed:slide-out-to-left data-state-open:slide-in-from-left left-0 border-r",right:"data-state-closed:slide-out-to-right data-state-open:slide-in-from-right right-0 border-l"}},defaultVariants:{side:"right"}}),C=a(({children:e,className:t,onInteractOutside:o,onPointerDownOutside:n,preferredWidth:l="sm:max-w-[30rem]",side:N="right",...R},H)=>k(A,{children:[i(y,{}),i(d,{className:r(B({side:N}),l,t),onInteractOutside:s=>{c(s),o?.(s)},onPointerDownOutside:s=>{c(s),n?.(s)},ref:H,...R,children:e})]}));C.displayName=d.displayName;var O=({size:e="md",type:t="button",label:o="Close Sheet",appearance:n="ghost",...l})=>i(m,{asChild:!0,children:i(P,{appearance:n,icon:i(D,{}),label:o,size:e,type:t,...l})}),W=({className:e,...t})=>i("div",{className:r("scrollbar text-body flex-1 overflow-y-auto p-6",e),...t}),E=({className:e,...t})=>i("div",{className:r("border-dialog-muted flex shrink-0 flex-col gap-2 border-b py-4 pl-6 pr-4","has-[.icon-button]:pr-4",e),...t}),V=({className:e,...t})=>i("div",{className:r("border-dialog-muted flex shrink-0 justify-end gap-2 border-t px-6 py-2.5",e),...t}),g=a(({className:e,...t},o)=>i(h,{ref:o,className:r("text-strong flex-1 truncate text-lg font-medium",e),...t}));g.displayName=h.displayName;var b=a(({children:e,className:t,...o},n)=>i("div",{className:r("flex items-center justify-between gap-2",t),...o,ref:n,children:e}));b.displayName="SheetTitleGroup";var T=a(({className:e,...t},o)=>i(f,{ref:o,className:r("text-body text-sm",e),...t}));T.displayName=f.displayName;var x=a(({children:e,className:t,...o},n)=>i("div",{className:r("flex h-full items-center gap-2",t),...o,ref:n,children:e}));x.displayName="SheetActions";export{M as Sheet,x as SheetActions,W as SheetBody,w as SheetClose,O as SheetCloseIconButton,C as SheetContent,T as SheetDescription,V as SheetFooter,E as SheetHeader,g as SheetTitle,b as SheetTitleGroup,I as SheetTrigger};
 //# sourceMappingURL=sheet.js.map

package/dist/sheet.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/sheet/sheet.tsx"],"sourcesContent":["import { X } from \"@phosphor-icons/react/X\";\nimport { type VariantProps, cva } from \"class-variance-authority\";\nimport type {\n\tComponentPropsWithoutRef,\n\tComponentRef,\n\tHTMLAttributes,\n} from \"react\";\nimport { forwardRef } from \"react\";\nimport { cx } from \"../../utils/cx/cx.js\";\nimport { IconButton, type IconButtonProps } from \"../button/icon-button.js\";\nimport * as SheetPrimitive from \"../dialog/primitive.js\";\nimport { preventCloseOnPromptInteraction } from \"../toast/toast.js\";\n\n/**\n * The root component for a `Sheet`. Should compose the `SheetTrigger` and `SheetContent`.\n * Acts as a stateful provider for the Sheet's open/closed state.\n *\n * @see https://mantle.ngrok.com/components/sheet#api-sheet\n *\n * @example\n * ```tsx\n * // Triggering a stateful sheet\n * <Sheet>\n *   <SheetTrigger asChild>\n *     <Button type=\"button\" appearance=\"filled\">\n *       Open Sheet\n *     </Button>\n *   </SheetTrigger>\n *   <SheetContent>\n *     <SheetHeader>\n *       <SheetTitleGroup>\n *         <SheetTitle>Are you absolutely sure?</SheetTitle>\n *         <SheetActions>\n *           <IconButton\n *             appearance=\"ghost\"\n *             type=\"button\"\n *             icon={<TrashSimple />}\n *             label=\"Delete\"\n *           />\n *           <Separator orientation=\"vertical\" className=\"h-[80%]\" />\n *           <SheetCloseIconButton />\n *         </SheetActions>\n *       </SheetTitleGroup>\n *       <SheetDescription>\n *         This action cannot be undone. This will permanently delete your account and remove your data from our servers.\n *       </SheetDescription>\n *     </SheetHeader>\n *     <SheetBody>\n *       <p>\n *         Consequat do voluptate culpa fugiat consequat nostrud duis\n *         aliqua minim. Tempor voluptate cillum elit velit. Voluptate\n *         aliqua ipsum aliqua dolore in nisi ea fugiat aliqua velit\n *         proident amet.\n *       </p>\n *     </SheetBody>\n *     <SheetFooter>\n *       <SheetClose asChild>\n *         <Button type=\"button\">Close</Button>\n *       </SheetClose>\n *       <Button type=\"button\" appearance=\"filled\">\n *         Save\n *       </Button>\n *     </SheetFooter>\n *   </SheetContent>\n * </Sheet>\n * ```\n *\n * @example\n * ```tsx\n * // Sheet without a trigger (e.g. router controlled)\n * <Sheet open opOpenChange={() => onClose()}>\n *   <SheetContent>\n *     <SheetHeader>\n *       <SheetTitleGroup>\n *         <SheetTitle>Are you absolutely sure?</SheetTitle>\n *         <SheetActions>\n *           <IconButton\n *             appearance=\"ghost\"\n *             type=\"button\"\n *             icon={<TrashSimple />}\n *             label=\"Delete\"\n *           />\n *           <Separator orientation=\"vertical\" className=\"h-[80%]\" />\n *           <SheetCloseIconButton />\n *         </SheetActions>\n *       </SheetTitleGroup>\n *       <SheetDescription>\n *         This action cannot be undone. This will permanently delete your account and remove your data from our servers.\n *       </SheetDescription>\n *     </SheetHeader>\n *     <SheetBody>\n *       <p>\n *         Consequat do voluptate culpa fugiat consequat nostrud duis\n *         aliqua minim. Tempor voluptate cillum elit velit. Voluptate\n *         aliqua ipsum aliqua dolore in nisi ea fugiat aliqua velit\n *         proident amet.\n *       </p>\n *     </SheetBody>\n *     <SheetFooter>\n *       <SheetClose asChild>\n *         <Button type=\"button\">Close</Button>\n *       </SheetClose>\n *       <Button type=\"button\" appearance=\"filled\">\n *         Save\n *       </Button>\n *     </SheetFooter>\n *   </SheetContent>\n * </Sheet>\n * ```\n */\nconst Sheet = SheetPrimitive.Root;\n\n/**\n * The button trigger for a `Sheet`. Should be rendered as a child of the `Sheet` component.\n * Renders an unstyled button by default, but can be customized with the `asChild` prop.\n *\n * @see https://mantle.ngrok.com/components/sheet#api-sheet-trigger\n *\n * @example\n * ```tsx\n * <Sheet>\n *   <SheetTrigger asChild>\n *     <Button type=\"button\" appearance=\"filled\">\n *       Open Sheet\n *     </Button>\n *   </SheetTrigger>\n *   <SheetContent>\n *     <p>\n *       Consequat do voluptate culpa fugiat consequat nostrud duis\n *       aliqua minim. Tempor voluptate cillum elit velit. Voluptate\n *       aliqua ipsum aliqua dolore in nisi ea fugiat aliqua velit\n *       proident amet.\n *     </p>\n *   </SheetContent>\n * </Sheet>\n * ```\n */\nconst SheetTrigger = SheetPrimitive.Trigger;\n\n/**\n * The close button for a `Sheet`. Should be rendered as a child of the `SheetContent` component.\n * Usually contained within the `SheetFooter` component.\n * Renders an unstyled button by default, but can be customized with the `asChild` prop.\n *\n * @see https://mantle.ngrok.com/components/sheet#api-sheet-close\n *\n * @example\n * ```tsx\n * <Sheet>\n *   <SheetTrigger asChild>\n *     <Button type=\"button\" appearance=\"filled\">\n *       Open Sheet\n *     </Button>\n *   </SheetTrigger>\n *   <SheetContent>\n *     <p>\n *       Consequat do voluptate culpa fugiat consequat nostrud duis\n *       aliqua minim. Tempor voluptate cillum elit velit. Voluptate\n *       aliqua ipsum aliqua dolore in nisi ea fugiat aliqua velit\n *       proident amet.\n *     </p>\n *     <SheetFooter>\n *       <SheetClose asChild>\n *         <Button type=\"button\">Close</Button>\n *       </SheetClose>\n *     </SheetFooter>\n *   </SheetContent>\n * </Sheet>\n * ```\n */\nconst SheetClose = SheetPrimitive.Close;\n\n/**\n * The portal for a sheet. Should be rendered as a child of the `Sheet` component.\n * Renders a portal that the `SheetOverlay` and `SheetContent` is rendered into.\n *\n * @private\n */\nconst SheetPortal = SheetPrimitive.Portal;\n\n/**\n * The overlay backdrop for a sheet. Should be rendered as a child of the `SheetPortal` component.\n *\n * You likely don't need to use this component directly, as it is used internally by the `SheetContent` component.\n *\n * @private\n */\nconst SheetOverlay = forwardRef<\n\tComponentRef<typeof SheetPrimitive.Overlay>,\n\tComponentPropsWithoutRef<typeof SheetPrimitive.Overlay>\n>(({ className, ...props }, ref) => (\n\t<SheetPrimitive.Overlay\n\t\tclassName={cx(\n\t\t\t\"bg-overlay data-state-closed:animate-out data-state-closed:fade-out-0 data-state-open:animate-in data-state-open:fade-in-0 fixed inset-0 z-40 backdrop-blur-sm\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t\tref={ref}\n\t/>\n));\nSheetOverlay.displayName = SheetPrimitive.Overlay.displayName;\n\nconst SheetVariants = cva(\n\t\"bg-dialog border-dialog inset-y-0 h-full w-full fixed z-40 flex flex-col shadow-lg outline-none transition ease-in-out focus-within:outline-none data-state-closed:duration-100 data-state-closed:animate-out data-state-open:duration-100 data-state-open:animate-in\",\n\t{\n\t\tvariants: {\n\t\t\t/**\n\t\t\t * The side of the screen the sheet should slide in from.\n\t\t\t */\n\t\t\tside: {\n\t\t\t\tleft: \"data-state-closed:slide-out-to-left data-state-open:slide-in-from-left left-0 border-r\",\n\t\t\t\tright:\n\t\t\t\t\t\"data-state-closed:slide-out-to-right data-state-open:slide-in-from-right right-0 border-l\",\n\t\t\t},\n\t\t},\n\t\tdefaultVariants: {\n\t\t\tside: \"right\",\n\t\t},\n\t},\n);\n\ntype SheetContentProps = ComponentPropsWithoutRef<\n\ttypeof SheetPrimitive.Content\n> &\n\tVariantProps<typeof SheetVariants> & {\n\t\t/**\n\t\t * The preferred width of the `SheetContent` as a tailwind `max-w-` class.\n\t\t *\n\t\t * By default, a `Sheet`'s content width is responsive with a default\n\t\t * preferred width: the maximum width of the `SheetContent` when the window\n\t\t * viewport is larger than the mobile breakpoint (`sm`).\n\t\t *\n\t\t * @default `sm:max-w-[30rem]`\n\t\t */\n\t\tpreferredWidth?: `sm:max-w-${string}`;\n\t};\n\n/**\n * The main container for a `Sheet`. Should be rendered as a child of the `Sheet` component.\n * Renders on top of the overlay backdrop.\n * Should contain the `SheetHeader`, `SheetBody`, and `SheetFooter`.\n *\n * @see https://mantle.ngrok.com/components/sheet#api-sheet-content\n *\n * @example\n * ```tsx\n * // Sheet without a trigger (e.g. router controlled)\n * <Sheet open opOpenChange={() => onClose()}>\n *   <SheetContent>\n *     <SheetHeader>\n *       <SheetTitleGroup>\n *         <SheetTitle>Are you absolutely sure?</SheetTitle>\n *         <SheetActions>\n *           <IconButton\n *             appearance=\"ghost\"\n *             type=\"button\"\n *             icon={<TrashSimple />}\n *             label=\"Delete\"\n *           />\n *           <Separator orientation=\"vertical\" className=\"h-[80%]\" />\n *           <SheetCloseIconButton />\n *         </SheetActions>\n *       </SheetTitleGroup>\n *       <SheetDescription>\n *         This action cannot be undone. This will permanently delete your account and remove your data from our servers.\n *       </SheetDescription>\n *     </SheetHeader>\n *     <SheetBody>\n *       <p>\n *         Consequat do voluptate culpa fugiat consequat nostrud duis\n *         aliqua minim. Tempor voluptate cillum elit velit. Voluptate\n *         aliqua ipsum aliqua dolore in nisi ea fugiat aliqua velit\n *         proident amet.\n *       </p>\n *     </SheetBody>\n *     <SheetFooter>\n *       <SheetClose asChild>\n *         <Button type=\"button\">Close</Button>\n *       </SheetClose>\n *       <Button type=\"button\" appearance=\"filled\">\n *         Save\n *       </Button>\n *     </SheetFooter>\n *   </SheetContent>\n * </Sheet>\n * ```\n */\nconst SheetContent = forwardRef<ComponentRef<\"div\">, SheetContentProps>(\n\t(\n\t\t{\n\t\t\tchildren,\n\t\t\tclassName,\n\t\t\tonInteractOutside,\n\t\t\tonPointerDownOutside,\n\t\t\tpreferredWidth = \"sm:max-w-[30rem]\",\n\t\t\tside = \"right\",\n\t\t\t...props\n\t\t},\n\t\tref,\n\t) => (\n\t\t<SheetPortal>\n\t\t\t<SheetOverlay />\n\t\t\t<SheetPrimitive.Content\n\t\t\t\tclassName={cx(SheetVariants({ side }), preferredWidth, className)}\n\t\t\t\tonInteractOutside={(event) => {\n\t\t\t\t\tpreventCloseOnPromptInteraction(event);\n\t\t\t\t\tonInteractOutside?.(event);\n\t\t\t\t}}\n\t\t\t\tonPointerDownOutside={(event) => {\n\t\t\t\t\tpreventCloseOnPromptInteraction(event);\n\t\t\t\t\tonPointerDownOutside?.(event);\n\t\t\t\t}}\n\t\t\t\tref={ref}\n\t\t\t\t{...props}\n\t\t\t>\n\t\t\t\t{children}\n\t\t\t</SheetPrimitive.Content>\n\t\t</SheetPortal>\n\t),\n);\nSheetContent.displayName = SheetPrimitive.Content.displayName;\n\ntype SheetCloseIconButtonProps = Partial<Omit<IconButtonProps, \"icon\">>;\n\n/**\n * An icon button that closes the `Sheet` when clicked.\n * Should be rendered within the `SheetHeader` as a child of `SheetActions`.\n *\n * @see https://mantle.ngrok.com/components/sheet#api-sheet-close-icon-button\n *\n * @example\n * ```tsx\n * // Sheet without a trigger (e.g. router controlled)\n * <Sheet open opOpenChange={() => onClose()}>\n *   <SheetContent>\n *     <SheetHeader>\n *       <SheetTitleGroup>\n *         <SheetTitle>Are you absolutely sure?</SheetTitle>\n *         <SheetActions>\n *           <IconButton\n *             appearance=\"ghost\"\n *             type=\"button\"\n *             icon={<TrashSimple />}\n *             label=\"Delete\"\n *           />\n *           <Separator orientation=\"vertical\" className=\"h-[80%]\" />\n *           <SheetCloseIconButton />\n *         </SheetActions>\n *       </SheetTitleGroup>\n *       <SheetDescription>\n *         This action cannot be undone. This will permanently delete your account and remove your data from our servers.\n *       </SheetDescription>\n *     </SheetHeader>\n *     <SheetBody>\n *       <p>\n *         Consequat do voluptate culpa fugiat consequat nostrud duis\n *         aliqua minim. Tempor voluptate cillum elit velit. Voluptate\n *         aliqua ipsum aliqua dolore in nisi ea fugiat aliqua velit\n *         proident amet.\n *       </p>\n *     </SheetBody>\n *     <SheetFooter>\n *       <SheetClose asChild>\n *         <Button type=\"button\">Close</Button>\n *       </SheetClose>\n *       <Button type=\"button\" appearance=\"filled\">\n *         Save\n *       </Button>\n *     </SheetFooter>\n *   </SheetContent>\n * </Sheet>\n * ```\n */\nconst SheetCloseIconButton = ({\n\tsize = \"md\",\n\ttype = \"button\",\n\tlabel = \"Close Sheet\",\n\tappearance = \"ghost\",\n\t...props\n}: SheetCloseIconButtonProps) => (\n\t<SheetPrimitive.Close asChild>\n\t\t<IconButton\n\t\t\tappearance={appearance}\n\t\t\ticon={<X />}\n\t\t\tlabel={label}\n\t\t\tsize={size}\n\t\t\ttype={type}\n\t\t\t{...props}\n\t\t/>\n\t</SheetPrimitive.Close>\n);\n\n/**\n * The body container for a `Sheet`. This is where you would typically place the main content of the sheet, such as forms or text.\n * Should be rendered as a child of `SheetContent`.\n *\n * @see https://mantle.ngrok.com/components/sheet#api-sheet-body\n *\n * @example\n * ```tsx\n * // Sheet without a trigger (e.g. router controlled)\n * <Sheet open opOpenChange={() => onClose()}>\n *   <SheetContent>\n *     <SheetHeader>\n *       <SheetTitleGroup>\n *         <SheetTitle>Are you absolutely sure?</SheetTitle>\n *         <SheetActions>\n *           <IconButton\n *             appearance=\"ghost\"\n *             type=\"button\"\n *             icon={<TrashSimple />}\n *             label=\"Delete\"\n *           />\n *           <Separator orientation=\"vertical\" className=\"h-[80%]\" />\n *           <SheetCloseIconButton />\n *         </SheetActions>\n *       </SheetTitleGroup>\n *       <SheetDescription>\n *         This action cannot be undone. This will permanently delete your account and remove your data from our servers.\n *       </SheetDescription>\n *     </SheetHeader>\n *     <SheetBody>\n *       <p>\n *         Consequat do voluptate culpa fugiat consequat nostrud duis\n *         aliqua minim. Tempor voluptate cillum elit velit. Voluptate\n *         aliqua ipsum aliqua dolore in nisi ea fugiat aliqua velit\n *         proident amet.\n *       </p>\n *     </SheetBody>\n *     <SheetFooter>\n *       <SheetClose asChild>\n *         <Button type=\"button\">Close</Button>\n *       </SheetClose>\n *       <Button type=\"button\" appearance=\"filled\">\n *         Save\n *       </Button>\n *     </SheetFooter>\n *   </SheetContent>\n * </Sheet>\n * ```\n */\nconst SheetBody = ({ className, ...props }: HTMLAttributes<HTMLDivElement>) => (\n\t<div\n\t\tclassName={cx(\"scrollbar text-body flex-1 overflow-y-auto p-6\", className)}\n\t\t{...props}\n\t/>\n);\n\n/**\n * The header container for a `Sheet`. This is where you would typically place the title, description, and actions.\n * Should be rendered as a child of `SheetContent`.\n *\n * @see https://mantle.ngrok.com/components/sheet#api-sheet-header\n *\n * @example\n * ```tsx\n * // Sheet without a trigger (e.g. router controlled)\n * <Sheet open opOpenChange={() => onClose()}>\n *   <SheetContent>\n *     <SheetHeader>\n *       <SheetTitleGroup>\n *         <SheetTitle>Are you absolutely sure?</SheetTitle>\n *         <SheetActions>\n *           <IconButton\n *             appearance=\"ghost\"\n *             type=\"button\"\n *             icon={<TrashSimple />}\n *             label=\"Delete\"\n *           />\n *           <Separator orientation=\"vertical\" className=\"h-[80%]\" />\n *           <SheetCloseIconButton />\n *         </SheetActions>\n *       </SheetTitleGroup>\n *       <SheetDescription>\n *         This action cannot be undone. This will permanently delete your account and remove your data from our servers.\n *       </SheetDescription>\n *     </SheetHeader>\n *     <SheetBody>\n *       <p>\n *         Consequat do voluptate culpa fugiat consequat nostrud duis\n *         aliqua minim. Tempor voluptate cillum elit velit. Voluptate\n *         aliqua ipsum aliqua dolore in nisi ea fugiat aliqua velit\n *         proident amet.\n *       </p>\n *     </SheetBody>\n *     <SheetFooter>\n *       <SheetClose asChild>\n *         <Button type=\"button\">Close</Button>\n *       </SheetClose>\n *       <Button type=\"button\" appearance=\"filled\">\n *         Save\n *       </Button>\n *     </SheetFooter>\n *   </SheetContent>\n * </Sheet>\n * ```\n */\nconst SheetHeader = ({\n\tclassName,\n\t...props\n}: HTMLAttributes<HTMLDivElement>) => (\n\t<div\n\t\tclassName={cx(\n\t\t\t\"border-dialog-muted flex shrink-0 flex-col gap-2 border-b py-4 pl-6 pr-4\",\n\t\t\t\"has-[.icon-button]:pr-4\", // when there are actions in the header, shorten the padding\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t/>\n);\n\n/**\n * The footer container for a `Sheet`. This is where you would typically place close and submit buttons.\n * Should be rendered as a child of `SheetContent`.\n *\n * @see https://mantle.ngrok.com/components/sheet#api-sheet-footer\n *\n * @example\n * ```tsx\n * // Sheet without a trigger (e.g. router controlled)\n * <Sheet open opOpenChange={() => onClose()}>\n *   <SheetContent>\n *     <SheetHeader>\n *       <SheetTitleGroup>\n *         <SheetTitle>Are you absolutely sure?</SheetTitle>\n *         <SheetActions>\n *           <IconButton\n *             appearance=\"ghost\"\n *             type=\"button\"\n *             icon={<TrashSimple />}\n *             label=\"Delete\"\n *           />\n *           <Separator orientation=\"vertical\" className=\"h-[80%]\" />\n *           <SheetCloseIconButton />\n *         </SheetActions>\n *       </SheetTitleGroup>\n *       <SheetDescription>\n *         This action cannot be undone. This will permanently delete your account and remove your data from our servers.\n *       </SheetDescription>\n *     </SheetHeader>\n *     <SheetBody>\n *       <p>\n *         Consequat do voluptate culpa fugiat consequat nostrud duis\n *         aliqua minim. Tempor voluptate cillum elit velit. Voluptate\n *         aliqua ipsum aliqua dolore in nisi ea fugiat aliqua velit\n *         proident amet.\n *       </p>\n *     </SheetBody>\n *     <SheetFooter>\n *       <SheetClose asChild>\n *         <Button type=\"button\">Close</Button>\n *       </SheetClose>\n *       <Button type=\"button\" appearance=\"filled\">\n *         Save\n *       </Button>\n *     </SheetFooter>\n *   </SheetContent>\n * </Sheet>\n * ```\n */\nconst SheetFooter = ({\n\tclassName,\n\t...props\n}: HTMLAttributes<HTMLDivElement>) => (\n\t<div\n\t\tclassName={cx(\n\t\t\t\"border-dialog-muted flex shrink-0 justify-end gap-2 border-t px-6 py-2.5\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t/>\n);\n\n/**\n * The title for a `Sheet`. Typically rendered as a child of `SheetTitleGroup`.\n * Defaults to an `h2` element, but can be changed via the `asChild` prop.\n *\n * @see https://mantle.ngrok.com/components/sheet#api-sheet-title\n *\n * @example\n * ```tsx\n * // Sheet without a trigger (e.g. router controlled)\n * <Sheet open opOpenChange={() => onClose()}>\n *   <SheetContent>\n *     <SheetHeader>\n *       <SheetTitleGroup>\n *         <SheetTitle>Are you absolutely sure?</SheetTitle>\n *         <SheetActions>\n *           <IconButton\n *             appearance=\"ghost\"\n *             type=\"button\"\n *             icon={<TrashSimple />}\n *             label=\"Delete\"\n *           />\n *           <Separator orientation=\"vertical\" className=\"h-[80%]\" />\n *           <SheetCloseIconButton />\n *         </SheetActions>\n *       </SheetTitleGroup>\n *       <SheetDescription>\n *         This action cannot be undone. This will permanently delete your account and remove your data from our servers.\n *       </SheetDescription>\n *     </SheetHeader>\n *     <SheetBody>\n *       <p>\n *         Consequat do voluptate culpa fugiat consequat nostrud duis\n *         aliqua minim. Tempor voluptate cillum elit velit. Voluptate\n *         aliqua ipsum aliqua dolore in nisi ea fugiat aliqua velit\n *         proident amet.\n *       </p>\n *     </SheetBody>\n *     <SheetFooter>\n *       <SheetClose asChild>\n *         <Button type=\"button\">Close</Button>\n *       </SheetClose>\n *       <Button type=\"button\" appearance=\"filled\">\n *         Save\n *       </Button>\n *     </SheetFooter>\n *   </SheetContent>\n * </Sheet>\n * ```\n */\nconst SheetTitle = forwardRef<\n\tComponentRef<typeof SheetPrimitive.Title>,\n\tComponentPropsWithoutRef<typeof SheetPrimitive.Title>\n>(({ className, ...props }, ref) => (\n\t<SheetPrimitive.Title\n\t\tref={ref}\n\t\tclassName={cx(\"text-strong flex-1 truncate text-lg font-medium\", className)}\n\t\t{...props}\n\t/>\n));\nSheetTitle.displayName = SheetPrimitive.Title.displayName;\n\n/**\n * A group container for the title and actions of a sheet. Typically rendered as a child of `SheetHeader`.\n *\n * @see https://mantle.ngrok.com/components/sheet#api-sheet-title-group\n *\n * @example\n * ```tsx\n * // Sheet without a trigger (e.g. router controlled)\n * <Sheet open opOpenChange={() => onClose()}>\n *   <SheetContent>\n *     <SheetHeader>\n *       <SheetTitleGroup>\n *         <SheetTitle>Are you absolutely sure?</SheetTitle>\n *         <SheetActions>\n *           <IconButton\n *             appearance=\"ghost\"\n *             type=\"button\"\n *             icon={<TrashSimple />}\n *             label=\"Delete\"\n *           />\n *           <Separator orientation=\"vertical\" className=\"h-[80%]\" />\n *           <SheetCloseIconButton />\n *         </SheetActions>\n *       </SheetTitleGroup>\n *       <SheetDescription>\n *         This action cannot be undone. This will permanently delete your account and remove your data from our servers.\n *       </SheetDescription>\n *     </SheetHeader>\n *     <SheetBody>\n *       <p>\n *         Consequat do voluptate culpa fugiat consequat nostrud duis\n *         aliqua minim. Tempor voluptate cillum elit velit. Voluptate\n *         aliqua ipsum aliqua dolore in nisi ea fugiat aliqua velit\n *         proident amet.\n *       </p>\n *     </SheetBody>\n *     <SheetFooter>\n *       <SheetClose asChild>\n *         <Button type=\"button\">Close</Button>\n *       </SheetClose>\n *       <Button type=\"button\" appearance=\"filled\">\n *         Save\n *       </Button>\n *     </SheetFooter>\n *   </SheetContent>\n * </Sheet>\n * ```\n */\nconst SheetTitleGroup = forwardRef<\n\tComponentRef<\"div\">,\n\tHTMLAttributes<HTMLDivElement>\n>(({ children, className, ...props }, ref) => (\n\t<div\n\t\tclassName={cx(\"flex items-center justify-between gap-2\", className)}\n\t\t{...props}\n\t\tref={ref}\n\t>\n\t\t{children}\n\t</div>\n));\nSheetTitleGroup.displayName = \"SheetTitleGroup\";\n\n/**\n * A description for a sheet. Typically rendered as a child of `SheetHeader`.\n *\n * @see https://mantle.ngrok.com/components/sheet#api-sheet-description\n *\n * @example\n * ```tsx\n * // Sheet without a trigger (e.g. router controlled)\n * <Sheet open opOpenChange={() => onClose()}>\n *   <SheetContent>\n *     <SheetHeader>\n *       <SheetTitleGroup>\n *         <SheetTitle>Are you absolutely sure?</SheetTitle>\n *         <SheetActions>\n *           <IconButton\n *             appearance=\"ghost\"\n *             type=\"button\"\n *             icon={<TrashSimple />}\n *             label=\"Delete\"\n *           />\n *           <Separator orientation=\"vertical\" className=\"h-[80%]\" />\n *           <SheetCloseIconButton />\n *         </SheetActions>\n *       </SheetTitleGroup>\n *       <SheetDescription>\n *         This action cannot be undone. This will permanently delete your account and remove your data from our servers.\n *       </SheetDescription>\n *     </SheetHeader>\n *     <SheetBody>\n *       <p>\n *         Consequat do voluptate culpa fugiat consequat nostrud duis\n *         aliqua minim. Tempor voluptate cillum elit velit. Voluptate\n *         aliqua ipsum aliqua dolore in nisi ea fugiat aliqua velit\n *         proident amet.\n *       </p>\n *     </SheetBody>\n *     <SheetFooter>\n *       <SheetClose asChild>\n *         <Button type=\"button\">Close</Button>\n *       </SheetClose>\n *       <Button type=\"button\" appearance=\"filled\">\n *         Save\n *       </Button>\n *     </SheetFooter>\n *   </SheetContent>\n * </Sheet>\n * ```\n */\nconst SheetDescription = forwardRef<\n\tComponentRef<typeof SheetPrimitive.Description>,\n\tComponentPropsWithoutRef<typeof SheetPrimitive.Description>\n>(({ className, ...props }, ref) => (\n\t<SheetPrimitive.Description\n\t\tref={ref}\n\t\tclassName={cx(\"text-body text-sm\", className)}\n\t\t{...props}\n\t/>\n));\nSheetDescription.displayName = SheetPrimitive.Description.displayName;\n\n/**\n * A group container for the actions of a `Sheet`. Typically rendered as a child of `SheetTitleGroup`.\n *\n * @see https://mantle.ngrok.com/components/sheet#api-sheet-actions\n *\n * @example\n * ```tsx\n * // Sheet without a trigger (e.g. router controlled)\n * <Sheet open opOpenChange={() => onClose()}>\n *   <SheetContent>\n *     <SheetHeader>\n *       <SheetTitleGroup>\n *         <SheetTitle>Are you absolutely sure?</SheetTitle>\n *         <SheetActions>\n *           <IconButton\n *             appearance=\"ghost\"\n *             type=\"button\"\n *             icon={<TrashSimple />}\n *             label=\"Delete\"\n *           />\n *           <Separator orientation=\"vertical\" className=\"h-[80%]\" />\n *           <SheetCloseIconButton />\n *         </SheetActions>\n *       </SheetTitleGroup>\n *       <SheetDescription>\n *         This action cannot be undone. This will permanently delete your account and remove your data from our servers.\n *       </SheetDescription>\n *     </SheetHeader>\n *     <SheetBody>\n *       <p>\n *         Consequat do voluptate culpa fugiat consequat nostrud duis\n *         aliqua minim. Tempor voluptate cillum elit velit. Voluptate\n *         aliqua ipsum aliqua dolore in nisi ea fugiat aliqua velit\n *         proident amet.\n *       </p>\n *     </SheetBody>\n *     <SheetFooter>\n *       <SheetClose asChild>\n *         <Button type=\"button\">Close</Button>\n *       </SheetClose>\n *       <Button type=\"button\" appearance=\"filled\">\n *         Save\n *       </Button>\n *     </SheetFooter>\n *   </SheetContent>\n * </Sheet>\n * ```\n */\nconst SheetActions = forwardRef<\n\tComponentRef<\"div\">,\n\tHTMLAttributes<HTMLDivElement>\n>(({ children, className, ...props }, ref) => (\n\t<div\n\t\tclassName={cx(\"flex h-full items-center gap-2\", className)}\n\t\t{...props}\n\t\tref={ref}\n\t>\n\t\t{children}\n\t</div>\n));\nSheetActions.displayName = \"SheetActions\";\n\nexport {\n\t//,\n\tSheet,\n\tSheetActions,\n\tSheetBody,\n\tSheetClose,\n\tSheetCloseIconButton,\n\tSheetContent,\n\tSheetDescription,\n\tSheetFooter,\n\tSheetHeader,\n\tSheetTitle,\n\tSheetTitleGroup,\n\tSheetTrigger,\n};\n"],"mappings":"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","names":["X","cva","forwardRef","jsx","jsxs","Sheet","Root","SheetTrigger","Trigger","SheetClose","Close","SheetPortal","Portal","SheetOverlay","forwardRef","className","props","ref","Overlay","cx","SheetVariants","cva","SheetContent","children","onInteractOutside","onPointerDownOutside","preferredWidth","side","Content","event","preventCloseOnPromptInteraction","SheetCloseIconButton","size","type","label","appearance","IconButton","X","SheetBody","SheetHeader","SheetFooter","SheetTitle","Title","SheetTitleGroup","SheetDescription","Description","SheetActions"]}
+{"version":3,"sources":["../src/components/sheet/sheet.tsx"],"sourcesContent":["import { XIcon } from \"@phosphor-icons/react/X\";\nimport { type VariantProps, cva } from \"class-variance-authority\";\nimport type {\n\tComponentPropsWithoutRef,\n\tComponentRef,\n\tHTMLAttributes,\n} from \"react\";\nimport { forwardRef } from \"react\";\nimport { cx } from \"../../utils/cx/cx.js\";\nimport { IconButton, type IconButtonProps } from \"../button/icon-button.js\";\nimport * as SheetPrimitive from \"../dialog/primitive.js\";\nimport { preventCloseOnPromptInteraction } from \"../toast/toast.js\";\n\n/**\n * The root component for a `Sheet`. Should compose the `SheetTrigger` and `SheetContent`.\n * Acts as a stateful provider for the Sheet's open/closed state.\n *\n * @see https://mantle.ngrok.com/components/sheet#api-sheet\n *\n * @example\n * ```tsx\n * // Triggering a stateful sheet\n * <Sheet>\n *   <SheetTrigger asChild>\n *     <Button type=\"button\" appearance=\"filled\">\n *       Open Sheet\n *     </Button>\n *   </SheetTrigger>\n *   <SheetContent>\n *     <SheetHeader>\n *       <SheetTitleGroup>\n *         <SheetTitle>Are you absolutely sure?</SheetTitle>\n *         <SheetActions>\n *           <IconButton\n *             appearance=\"ghost\"\n *             type=\"button\"\n *             icon={<TrashSimple />}\n *             label=\"Delete\"\n *           />\n *           <Separator orientation=\"vertical\" className=\"h-[80%]\" />\n *           <SheetCloseIconButton />\n *         </SheetActions>\n *       </SheetTitleGroup>\n *       <SheetDescription>\n *         This action cannot be undone. This will permanently delete your account and remove your data from our servers.\n *       </SheetDescription>\n *     </SheetHeader>\n *     <SheetBody>\n *       <p>\n *         Consequat do voluptate culpa fugiat consequat nostrud duis\n *         aliqua minim. Tempor voluptate cillum elit velit. Voluptate\n *         aliqua ipsum aliqua dolore in nisi ea fugiat aliqua velit\n *         proident amet.\n *       </p>\n *     </SheetBody>\n *     <SheetFooter>\n *       <SheetClose asChild>\n *         <Button type=\"button\">Close</Button>\n *       </SheetClose>\n *       <Button type=\"button\" appearance=\"filled\">\n *         Save\n *       </Button>\n *     </SheetFooter>\n *   </SheetContent>\n * </Sheet>\n * ```\n *\n * @example\n * ```tsx\n * // Sheet without a trigger (e.g. router controlled)\n * <Sheet open opOpenChange={() => onClose()}>\n *   <SheetContent>\n *     <SheetHeader>\n *       <SheetTitleGroup>\n *         <SheetTitle>Are you absolutely sure?</SheetTitle>\n *         <SheetActions>\n *           <IconButton\n *             appearance=\"ghost\"\n *             type=\"button\"\n *             icon={<TrashSimple />}\n *             label=\"Delete\"\n *           />\n *           <Separator orientation=\"vertical\" className=\"h-[80%]\" />\n *           <SheetCloseIconButton />\n *         </SheetActions>\n *       </SheetTitleGroup>\n *       <SheetDescription>\n *         This action cannot be undone. This will permanently delete your account and remove your data from our servers.\n *       </SheetDescription>\n *     </SheetHeader>\n *     <SheetBody>\n *       <p>\n *         Consequat do voluptate culpa fugiat consequat nostrud duis\n *         aliqua minim. Tempor voluptate cillum elit velit. Voluptate\n *         aliqua ipsum aliqua dolore in nisi ea fugiat aliqua velit\n *         proident amet.\n *       </p>\n *     </SheetBody>\n *     <SheetFooter>\n *       <SheetClose asChild>\n *         <Button type=\"button\">Close</Button>\n *       </SheetClose>\n *       <Button type=\"button\" appearance=\"filled\">\n *         Save\n *       </Button>\n *     </SheetFooter>\n *   </SheetContent>\n * </Sheet>\n * ```\n */\nconst Sheet = SheetPrimitive.Root;\n\n/**\n * The button trigger for a `Sheet`. Should be rendered as a child of the `Sheet` component.\n * Renders an unstyled button by default, but can be customized with the `asChild` prop.\n *\n * @see https://mantle.ngrok.com/components/sheet#api-sheet-trigger\n *\n * @example\n * ```tsx\n * <Sheet>\n *   <SheetTrigger asChild>\n *     <Button type=\"button\" appearance=\"filled\">\n *       Open Sheet\n *     </Button>\n *   </SheetTrigger>\n *   <SheetContent>\n *     <p>\n *       Consequat do voluptate culpa fugiat consequat nostrud duis\n *       aliqua minim. Tempor voluptate cillum elit velit. Voluptate\n *       aliqua ipsum aliqua dolore in nisi ea fugiat aliqua velit\n *       proident amet.\n *     </p>\n *   </SheetContent>\n * </Sheet>\n * ```\n */\nconst SheetTrigger = SheetPrimitive.Trigger;\n\n/**\n * The close button for a `Sheet`. Should be rendered as a child of the `SheetContent` component.\n * Usually contained within the `SheetFooter` component.\n * Renders an unstyled button by default, but can be customized with the `asChild` prop.\n *\n * @see https://mantle.ngrok.com/components/sheet#api-sheet-close\n *\n * @example\n * ```tsx\n * <Sheet>\n *   <SheetTrigger asChild>\n *     <Button type=\"button\" appearance=\"filled\">\n *       Open Sheet\n *     </Button>\n *   </SheetTrigger>\n *   <SheetContent>\n *     <p>\n *       Consequat do voluptate culpa fugiat consequat nostrud duis\n *       aliqua minim. Tempor voluptate cillum elit velit. Voluptate\n *       aliqua ipsum aliqua dolore in nisi ea fugiat aliqua velit\n *       proident amet.\n *     </p>\n *     <SheetFooter>\n *       <SheetClose asChild>\n *         <Button type=\"button\">Close</Button>\n *       </SheetClose>\n *     </SheetFooter>\n *   </SheetContent>\n * </Sheet>\n * ```\n */\nconst SheetClose = SheetPrimitive.Close;\n\n/**\n * The portal for a sheet. Should be rendered as a child of the `Sheet` component.\n * Renders a portal that the `SheetOverlay` and `SheetContent` is rendered into.\n *\n * @private\n */\nconst SheetPortal = SheetPrimitive.Portal;\n\n/**\n * The overlay backdrop for a sheet. Should be rendered as a child of the `SheetPortal` component.\n *\n * You likely don't need to use this component directly, as it is used internally by the `SheetContent` component.\n *\n * @private\n */\nconst SheetOverlay = forwardRef<\n\tComponentRef<typeof SheetPrimitive.Overlay>,\n\tComponentPropsWithoutRef<typeof SheetPrimitive.Overlay>\n>(({ className, ...props }, ref) => (\n\t<SheetPrimitive.Overlay\n\t\tclassName={cx(\n\t\t\t\"bg-overlay data-state-closed:animate-out data-state-closed:fade-out-0 data-state-open:animate-in data-state-open:fade-in-0 fixed inset-0 z-40 backdrop-blur-sm\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t\tref={ref}\n\t/>\n));\nSheetOverlay.displayName = SheetPrimitive.Overlay.displayName;\n\nconst SheetVariants = cva(\n\t\"bg-dialog border-dialog inset-y-0 h-full w-full fixed z-40 flex flex-col shadow-lg outline-none transition ease-in-out focus-within:outline-none data-state-closed:duration-100 data-state-closed:animate-out data-state-open:duration-100 data-state-open:animate-in\",\n\t{\n\t\tvariants: {\n\t\t\t/**\n\t\t\t * The side of the screen the sheet should slide in from.\n\t\t\t */\n\t\t\tside: {\n\t\t\t\tleft: \"data-state-closed:slide-out-to-left data-state-open:slide-in-from-left left-0 border-r\",\n\t\t\t\tright:\n\t\t\t\t\t\"data-state-closed:slide-out-to-right data-state-open:slide-in-from-right right-0 border-l\",\n\t\t\t},\n\t\t},\n\t\tdefaultVariants: {\n\t\t\tside: \"right\",\n\t\t},\n\t},\n);\n\ntype SheetContentProps = ComponentPropsWithoutRef<\n\ttypeof SheetPrimitive.Content\n> &\n\tVariantProps<typeof SheetVariants> & {\n\t\t/**\n\t\t * The preferred width of the `SheetContent` as a tailwind `max-w-` class.\n\t\t *\n\t\t * By default, a `Sheet`'s content width is responsive with a default\n\t\t * preferred width: the maximum width of the `SheetContent` when the window\n\t\t * viewport is larger than the mobile breakpoint (`sm`).\n\t\t *\n\t\t * @default `sm:max-w-[30rem]`\n\t\t */\n\t\tpreferredWidth?: `sm:max-w-${string}`;\n\t};\n\n/**\n * The main container for a `Sheet`. Should be rendered as a child of the `Sheet` component.\n * Renders on top of the overlay backdrop.\n * Should contain the `SheetHeader`, `SheetBody`, and `SheetFooter`.\n *\n * @see https://mantle.ngrok.com/components/sheet#api-sheet-content\n *\n * @example\n * ```tsx\n * // Sheet without a trigger (e.g. router controlled)\n * <Sheet open opOpenChange={() => onClose()}>\n *   <SheetContent>\n *     <SheetHeader>\n *       <SheetTitleGroup>\n *         <SheetTitle>Are you absolutely sure?</SheetTitle>\n *         <SheetActions>\n *           <IconButton\n *             appearance=\"ghost\"\n *             type=\"button\"\n *             icon={<TrashSimple />}\n *             label=\"Delete\"\n *           />\n *           <Separator orientation=\"vertical\" className=\"h-[80%]\" />\n *           <SheetCloseIconButton />\n *         </SheetActions>\n *       </SheetTitleGroup>\n *       <SheetDescription>\n *         This action cannot be undone. This will permanently delete your account and remove your data from our servers.\n *       </SheetDescription>\n *     </SheetHeader>\n *     <SheetBody>\n *       <p>\n *         Consequat do voluptate culpa fugiat consequat nostrud duis\n *         aliqua minim. Tempor voluptate cillum elit velit. Voluptate\n *         aliqua ipsum aliqua dolore in nisi ea fugiat aliqua velit\n *         proident amet.\n *       </p>\n *     </SheetBody>\n *     <SheetFooter>\n *       <SheetClose asChild>\n *         <Button type=\"button\">Close</Button>\n *       </SheetClose>\n *       <Button type=\"button\" appearance=\"filled\">\n *         Save\n *       </Button>\n *     </SheetFooter>\n *   </SheetContent>\n * </Sheet>\n * ```\n */\nconst SheetContent = forwardRef<ComponentRef<\"div\">, SheetContentProps>(\n\t(\n\t\t{\n\t\t\tchildren,\n\t\t\tclassName,\n\t\t\tonInteractOutside,\n\t\t\tonPointerDownOutside,\n\t\t\tpreferredWidth = \"sm:max-w-[30rem]\",\n\t\t\tside = \"right\",\n\t\t\t...props\n\t\t},\n\t\tref,\n\t) => (\n\t\t<SheetPortal>\n\t\t\t<SheetOverlay />\n\t\t\t<SheetPrimitive.Content\n\t\t\t\tclassName={cx(SheetVariants({ side }), preferredWidth, className)}\n\t\t\t\tonInteractOutside={(event) => {\n\t\t\t\t\tpreventCloseOnPromptInteraction(event);\n\t\t\t\t\tonInteractOutside?.(event);\n\t\t\t\t}}\n\t\t\t\tonPointerDownOutside={(event) => {\n\t\t\t\t\tpreventCloseOnPromptInteraction(event);\n\t\t\t\t\tonPointerDownOutside?.(event);\n\t\t\t\t}}\n\t\t\t\tref={ref}\n\t\t\t\t{...props}\n\t\t\t>\n\t\t\t\t{children}\n\t\t\t</SheetPrimitive.Content>\n\t\t</SheetPortal>\n\t),\n);\nSheetContent.displayName = SheetPrimitive.Content.displayName;\n\ntype SheetCloseIconButtonProps = Partial<Omit<IconButtonProps, \"icon\">>;\n\n/**\n * An icon button that closes the `Sheet` when clicked.\n * Should be rendered within the `SheetHeader` as a child of `SheetActions`.\n *\n * @see https://mantle.ngrok.com/components/sheet#api-sheet-close-icon-button\n *\n * @example\n * ```tsx\n * // Sheet without a trigger (e.g. router controlled)\n * <Sheet open opOpenChange={() => onClose()}>\n *   <SheetContent>\n *     <SheetHeader>\n *       <SheetTitleGroup>\n *         <SheetTitle>Are you absolutely sure?</SheetTitle>\n *         <SheetActions>\n *           <IconButton\n *             appearance=\"ghost\"\n *             type=\"button\"\n *             icon={<TrashSimple />}\n *             label=\"Delete\"\n *           />\n *           <Separator orientation=\"vertical\" className=\"h-[80%]\" />\n *           <SheetCloseIconButton />\n *         </SheetActions>\n *       </SheetTitleGroup>\n *       <SheetDescription>\n *         This action cannot be undone. This will permanently delete your account and remove your data from our servers.\n *       </SheetDescription>\n *     </SheetHeader>\n *     <SheetBody>\n *       <p>\n *         Consequat do voluptate culpa fugiat consequat nostrud duis\n *         aliqua minim. Tempor voluptate cillum elit velit. Voluptate\n *         aliqua ipsum aliqua dolore in nisi ea fugiat aliqua velit\n *         proident amet.\n *       </p>\n *     </SheetBody>\n *     <SheetFooter>\n *       <SheetClose asChild>\n *         <Button type=\"button\">Close</Button>\n *       </SheetClose>\n *       <Button type=\"button\" appearance=\"filled\">\n *         Save\n *       </Button>\n *     </SheetFooter>\n *   </SheetContent>\n * </Sheet>\n * ```\n */\nconst SheetCloseIconButton = ({\n\tsize = \"md\",\n\ttype = \"button\",\n\tlabel = \"Close Sheet\",\n\tappearance = \"ghost\",\n\t...props\n}: SheetCloseIconButtonProps) => (\n\t<SheetPrimitive.Close asChild>\n\t\t<IconButton\n\t\t\tappearance={appearance}\n\t\t\ticon={<XIcon />}\n\t\t\tlabel={label}\n\t\t\tsize={size}\n\t\t\ttype={type}\n\t\t\t{...props}\n\t\t/>\n\t</SheetPrimitive.Close>\n);\n\n/**\n * The body container for a `Sheet`. This is where you would typically place the main content of the sheet, such as forms or text.\n * Should be rendered as a child of `SheetContent`.\n *\n * @see https://mantle.ngrok.com/components/sheet#api-sheet-body\n *\n * @example\n * ```tsx\n * // Sheet without a trigger (e.g. router controlled)\n * <Sheet open opOpenChange={() => onClose()}>\n *   <SheetContent>\n *     <SheetHeader>\n *       <SheetTitleGroup>\n *         <SheetTitle>Are you absolutely sure?</SheetTitle>\n *         <SheetActions>\n *           <IconButton\n *             appearance=\"ghost\"\n *             type=\"button\"\n *             icon={<TrashSimple />}\n *             label=\"Delete\"\n *           />\n *           <Separator orientation=\"vertical\" className=\"h-[80%]\" />\n *           <SheetCloseIconButton />\n *         </SheetActions>\n *       </SheetTitleGroup>\n *       <SheetDescription>\n *         This action cannot be undone. This will permanently delete your account and remove your data from our servers.\n *       </SheetDescription>\n *     </SheetHeader>\n *     <SheetBody>\n *       <p>\n *         Consequat do voluptate culpa fugiat consequat nostrud duis\n *         aliqua minim. Tempor voluptate cillum elit velit. Voluptate\n *         aliqua ipsum aliqua dolore in nisi ea fugiat aliqua velit\n *         proident amet.\n *       </p>\n *     </SheetBody>\n *     <SheetFooter>\n *       <SheetClose asChild>\n *         <Button type=\"button\">Close</Button>\n *       </SheetClose>\n *       <Button type=\"button\" appearance=\"filled\">\n *         Save\n *       </Button>\n *     </SheetFooter>\n *   </SheetContent>\n * </Sheet>\n * ```\n */\nconst SheetBody = ({ className, ...props }: HTMLAttributes<HTMLDivElement>) => (\n\t<div\n\t\tclassName={cx(\"scrollbar text-body flex-1 overflow-y-auto p-6\", className)}\n\t\t{...props}\n\t/>\n);\n\n/**\n * The header container for a `Sheet`. This is where you would typically place the title, description, and actions.\n * Should be rendered as a child of `SheetContent`.\n *\n * @see https://mantle.ngrok.com/components/sheet#api-sheet-header\n *\n * @example\n * ```tsx\n * // Sheet without a trigger (e.g. router controlled)\n * <Sheet open opOpenChange={() => onClose()}>\n *   <SheetContent>\n *     <SheetHeader>\n *       <SheetTitleGroup>\n *         <SheetTitle>Are you absolutely sure?</SheetTitle>\n *         <SheetActions>\n *           <IconButton\n *             appearance=\"ghost\"\n *             type=\"button\"\n *             icon={<TrashSimple />}\n *             label=\"Delete\"\n *           />\n *           <Separator orientation=\"vertical\" className=\"h-[80%]\" />\n *           <SheetCloseIconButton />\n *         </SheetActions>\n *       </SheetTitleGroup>\n *       <SheetDescription>\n *         This action cannot be undone. This will permanently delete your account and remove your data from our servers.\n *       </SheetDescription>\n *     </SheetHeader>\n *     <SheetBody>\n *       <p>\n *         Consequat do voluptate culpa fugiat consequat nostrud duis\n *         aliqua minim. Tempor voluptate cillum elit velit. Voluptate\n *         aliqua ipsum aliqua dolore in nisi ea fugiat aliqua velit\n *         proident amet.\n *       </p>\n *     </SheetBody>\n *     <SheetFooter>\n *       <SheetClose asChild>\n *         <Button type=\"button\">Close</Button>\n *       </SheetClose>\n *       <Button type=\"button\" appearance=\"filled\">\n *         Save\n *       </Button>\n *     </SheetFooter>\n *   </SheetContent>\n * </Sheet>\n * ```\n */\nconst SheetHeader = ({\n\tclassName,\n\t...props\n}: HTMLAttributes<HTMLDivElement>) => (\n\t<div\n\t\tclassName={cx(\n\t\t\t\"border-dialog-muted flex shrink-0 flex-col gap-2 border-b py-4 pl-6 pr-4\",\n\t\t\t\"has-[.icon-button]:pr-4\", // when there are actions in the header, shorten the padding\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t/>\n);\n\n/**\n * The footer container for a `Sheet`. This is where you would typically place close and submit buttons.\n * Should be rendered as a child of `SheetContent`.\n *\n * @see https://mantle.ngrok.com/components/sheet#api-sheet-footer\n *\n * @example\n * ```tsx\n * // Sheet without a trigger (e.g. router controlled)\n * <Sheet open opOpenChange={() => onClose()}>\n *   <SheetContent>\n *     <SheetHeader>\n *       <SheetTitleGroup>\n *         <SheetTitle>Are you absolutely sure?</SheetTitle>\n *         <SheetActions>\n *           <IconButton\n *             appearance=\"ghost\"\n *             type=\"button\"\n *             icon={<TrashSimple />}\n *             label=\"Delete\"\n *           />\n *           <Separator orientation=\"vertical\" className=\"h-[80%]\" />\n *           <SheetCloseIconButton />\n *         </SheetActions>\n *       </SheetTitleGroup>\n *       <SheetDescription>\n *         This action cannot be undone. This will permanently delete your account and remove your data from our servers.\n *       </SheetDescription>\n *     </SheetHeader>\n *     <SheetBody>\n *       <p>\n *         Consequat do voluptate culpa fugiat consequat nostrud duis\n *         aliqua minim. Tempor voluptate cillum elit velit. Voluptate\n *         aliqua ipsum aliqua dolore in nisi ea fugiat aliqua velit\n *         proident amet.\n *       </p>\n *     </SheetBody>\n *     <SheetFooter>\n *       <SheetClose asChild>\n *         <Button type=\"button\">Close</Button>\n *       </SheetClose>\n *       <Button type=\"button\" appearance=\"filled\">\n *         Save\n *       </Button>\n *     </SheetFooter>\n *   </SheetContent>\n * </Sheet>\n * ```\n */\nconst SheetFooter = ({\n\tclassName,\n\t...props\n}: HTMLAttributes<HTMLDivElement>) => (\n\t<div\n\t\tclassName={cx(\n\t\t\t\"border-dialog-muted flex shrink-0 justify-end gap-2 border-t px-6 py-2.5\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t/>\n);\n\n/**\n * The title for a `Sheet`. Typically rendered as a child of `SheetTitleGroup`.\n * Defaults to an `h2` element, but can be changed via the `asChild` prop.\n *\n * @see https://mantle.ngrok.com/components/sheet#api-sheet-title\n *\n * @example\n * ```tsx\n * // Sheet without a trigger (e.g. router controlled)\n * <Sheet open opOpenChange={() => onClose()}>\n *   <SheetContent>\n *     <SheetHeader>\n *       <SheetTitleGroup>\n *         <SheetTitle>Are you absolutely sure?</SheetTitle>\n *         <SheetActions>\n *           <IconButton\n *             appearance=\"ghost\"\n *             type=\"button\"\n *             icon={<TrashSimple />}\n *             label=\"Delete\"\n *           />\n *           <Separator orientation=\"vertical\" className=\"h-[80%]\" />\n *           <SheetCloseIconButton />\n *         </SheetActions>\n *       </SheetTitleGroup>\n *       <SheetDescription>\n *         This action cannot be undone. This will permanently delete your account and remove your data from our servers.\n *       </SheetDescription>\n *     </SheetHeader>\n *     <SheetBody>\n *       <p>\n *         Consequat do voluptate culpa fugiat consequat nostrud duis\n *         aliqua minim. Tempor voluptate cillum elit velit. Voluptate\n *         aliqua ipsum aliqua dolore in nisi ea fugiat aliqua velit\n *         proident amet.\n *       </p>\n *     </SheetBody>\n *     <SheetFooter>\n *       <SheetClose asChild>\n *         <Button type=\"button\">Close</Button>\n *       </SheetClose>\n *       <Button type=\"button\" appearance=\"filled\">\n *         Save\n *       </Button>\n *     </SheetFooter>\n *   </SheetContent>\n * </Sheet>\n * ```\n */\nconst SheetTitle = forwardRef<\n\tComponentRef<typeof SheetPrimitive.Title>,\n\tComponentPropsWithoutRef<typeof SheetPrimitive.Title>\n>(({ className, ...props }, ref) => (\n\t<SheetPrimitive.Title\n\t\tref={ref}\n\t\tclassName={cx(\"text-strong flex-1 truncate text-lg font-medium\", className)}\n\t\t{...props}\n\t/>\n));\nSheetTitle.displayName = SheetPrimitive.Title.displayName;\n\n/**\n * A group container for the title and actions of a sheet. Typically rendered as a child of `SheetHeader`.\n *\n * @see https://mantle.ngrok.com/components/sheet#api-sheet-title-group\n *\n * @example\n * ```tsx\n * // Sheet without a trigger (e.g. router controlled)\n * <Sheet open opOpenChange={() => onClose()}>\n *   <SheetContent>\n *     <SheetHeader>\n *       <SheetTitleGroup>\n *         <SheetTitle>Are you absolutely sure?</SheetTitle>\n *         <SheetActions>\n *           <IconButton\n *             appearance=\"ghost\"\n *             type=\"button\"\n *             icon={<TrashSimple />}\n *             label=\"Delete\"\n *           />\n *           <Separator orientation=\"vertical\" className=\"h-[80%]\" />\n *           <SheetCloseIconButton />\n *         </SheetActions>\n *       </SheetTitleGroup>\n *       <SheetDescription>\n *         This action cannot be undone. This will permanently delete your account and remove your data from our servers.\n *       </SheetDescription>\n *     </SheetHeader>\n *     <SheetBody>\n *       <p>\n *         Consequat do voluptate culpa fugiat consequat nostrud duis\n *         aliqua minim. Tempor voluptate cillum elit velit. Voluptate\n *         aliqua ipsum aliqua dolore in nisi ea fugiat aliqua velit\n *         proident amet.\n *       </p>\n *     </SheetBody>\n *     <SheetFooter>\n *       <SheetClose asChild>\n *         <Button type=\"button\">Close</Button>\n *       </SheetClose>\n *       <Button type=\"button\" appearance=\"filled\">\n *         Save\n *       </Button>\n *     </SheetFooter>\n *   </SheetContent>\n * </Sheet>\n * ```\n */\nconst SheetTitleGroup = forwardRef<\n\tComponentRef<\"div\">,\n\tHTMLAttributes<HTMLDivElement>\n>(({ children, className, ...props }, ref) => (\n\t<div\n\t\tclassName={cx(\"flex items-center justify-between gap-2\", className)}\n\t\t{...props}\n\t\tref={ref}\n\t>\n\t\t{children}\n\t</div>\n));\nSheetTitleGroup.displayName = \"SheetTitleGroup\";\n\n/**\n * A description for a sheet. Typically rendered as a child of `SheetHeader`.\n *\n * @see https://mantle.ngrok.com/components/sheet#api-sheet-description\n *\n * @example\n * ```tsx\n * // Sheet without a trigger (e.g. router controlled)\n * <Sheet open opOpenChange={() => onClose()}>\n *   <SheetContent>\n *     <SheetHeader>\n *       <SheetTitleGroup>\n *         <SheetTitle>Are you absolutely sure?</SheetTitle>\n *         <SheetActions>\n *           <IconButton\n *             appearance=\"ghost\"\n *             type=\"button\"\n *             icon={<TrashSimple />}\n *             label=\"Delete\"\n *           />\n *           <Separator orientation=\"vertical\" className=\"h-[80%]\" />\n *           <SheetCloseIconButton />\n *         </SheetActions>\n *       </SheetTitleGroup>\n *       <SheetDescription>\n *         This action cannot be undone. This will permanently delete your account and remove your data from our servers.\n *       </SheetDescription>\n *     </SheetHeader>\n *     <SheetBody>\n *       <p>\n *         Consequat do voluptate culpa fugiat consequat nostrud duis\n *         aliqua minim. Tempor voluptate cillum elit velit. Voluptate\n *         aliqua ipsum aliqua dolore in nisi ea fugiat aliqua velit\n *         proident amet.\n *       </p>\n *     </SheetBody>\n *     <SheetFooter>\n *       <SheetClose asChild>\n *         <Button type=\"button\">Close</Button>\n *       </SheetClose>\n *       <Button type=\"button\" appearance=\"filled\">\n *         Save\n *       </Button>\n *     </SheetFooter>\n *   </SheetContent>\n * </Sheet>\n * ```\n */\nconst SheetDescription = forwardRef<\n\tComponentRef<typeof SheetPrimitive.Description>,\n\tComponentPropsWithoutRef<typeof SheetPrimitive.Description>\n>(({ className, ...props }, ref) => (\n\t<SheetPrimitive.Description\n\t\tref={ref}\n\t\tclassName={cx(\"text-body text-sm\", className)}\n\t\t{...props}\n\t/>\n));\nSheetDescription.displayName = SheetPrimitive.Description.displayName;\n\n/**\n * A group container for the actions of a `Sheet`. Typically rendered as a child of `SheetTitleGroup`.\n *\n * @see https://mantle.ngrok.com/components/sheet#api-sheet-actions\n *\n * @example\n * ```tsx\n * // Sheet without a trigger (e.g. router controlled)\n * <Sheet open opOpenChange={() => onClose()}>\n *   <SheetContent>\n *     <SheetHeader>\n *       <SheetTitleGroup>\n *         <SheetTitle>Are you absolutely sure?</SheetTitle>\n *         <SheetActions>\n *           <IconButton\n *             appearance=\"ghost\"\n *             type=\"button\"\n *             icon={<TrashSimple />}\n *             label=\"Delete\"\n *           />\n *           <Separator orientation=\"vertical\" className=\"h-[80%]\" />\n *           <SheetCloseIconButton />\n *         </SheetActions>\n *       </SheetTitleGroup>\n *       <SheetDescription>\n *         This action cannot be undone. This will permanently delete your account and remove your data from our servers.\n *       </SheetDescription>\n *     </SheetHeader>\n *     <SheetBody>\n *       <p>\n *         Consequat do voluptate culpa fugiat consequat nostrud duis\n *         aliqua minim. Tempor voluptate cillum elit velit. Voluptate\n *         aliqua ipsum aliqua dolore in nisi ea fugiat aliqua velit\n *         proident amet.\n *       </p>\n *     </SheetBody>\n *     <SheetFooter>\n *       <SheetClose asChild>\n *         <Button type=\"button\">Close</Button>\n *       </SheetClose>\n *       <Button type=\"button\" appearance=\"filled\">\n *         Save\n *       </Button>\n *     </SheetFooter>\n *   </SheetContent>\n * </Sheet>\n * ```\n */\nconst SheetActions = forwardRef<\n\tComponentRef<\"div\">,\n\tHTMLAttributes<HTMLDivElement>\n>(({ children, className, ...props }, ref) => (\n\t<div\n\t\tclassName={cx(\"flex h-full items-center gap-2\", className)}\n\t\t{...props}\n\t\tref={ref}\n\t>\n\t\t{children}\n\t</div>\n));\nSheetActions.displayName = \"SheetActions\";\n\nexport {\n\t//,\n\tSheet,\n\tSheetActions,\n\tSheetBody,\n\tSheetClose,\n\tSheetCloseIconButton,\n\tSheetContent,\n\tSheetDescription,\n\tSheetFooter,\n\tSheetHeader,\n\tSheetTitle,\n\tSheetTitleGroup,\n\tSheetTrigger,\n};\n"],"mappings":"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","names":["XIcon","cva","forwardRef","jsx","jsxs","Sheet","Root","SheetTrigger","Trigger","SheetClose","Close","SheetPortal","Portal","SheetOverlay","forwardRef","className","props","ref","Overlay","cx","SheetVariants","cva","SheetContent","children","onInteractOutside","onPointerDownOutside","preferredWidth","side","Content","event","preventCloseOnPromptInteraction","SheetCloseIconButton","size","type","label","appearance","IconButton","XIcon","SheetBody","SheetHeader","SheetFooter","SheetTitle","Title","SheetTitleGroup","SheetDescription","Description","SheetActions"]}

package/dist/toast.js

@@ -1,2 +1,2 @@
-import{a as o,b as t,c as s,d as a,e,f as r}from"./chunk-UBD43AUE.js";import"./chunk-XN5RN6JW.js";import"./chunk-D3XF6J5A.js";import"./chunk-7O36LG52.js";import"./chunk-HDPLH5HC.js";import"./chunk-AZ56JGNY.js";export{s as Toast,e as ToastAction,a as ToastIcon,r as ToastMessage,o as Toaster,t as makeToast};
+import{a as o,b as t,c as s,d as a,e,f as r}from"./chunk-3DXMGSDU.js";import"./chunk-XN5RN6JW.js";import"./chunk-D3XF6J5A.js";import"./chunk-XQVVOOLT.js";import"./chunk-HDPLH5HC.js";import"./chunk-AZ56JGNY.js";export{s as Toast,e as ToastAction,a as ToastIcon,r as ToastMessage,o as Toaster,t as makeToast};
 //# sourceMappingURL=toast.js.map