@ngrok/mantle 0.70.1 → 0.70.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (122) hide show
  1. package/dist/accordion.d.ts +1 -1
  2. package/dist/alert-dialog.d.ts +4 -4
  3. package/dist/alert.d.ts +3 -3
  4. package/dist/anchor.d.ts +1 -1
  5. package/dist/{as-child-CJ2vTesV.d.ts → as-child-DQHfEmYB.d.ts} +1 -1
  6. package/dist/badge.d.ts +2 -2
  7. package/dist/{button-DDK6nEac.d.ts → button-BMgAxAwM.d.ts} +3 -3
  8. package/dist/button.d.ts +3 -3
  9. package/dist/card.d.ts +1 -1
  10. package/dist/checkbox.d.ts +2 -2
  11. package/dist/checkbox.js +1 -1
  12. package/dist/code-block.d.ts +3 -3
  13. package/dist/code-block.js +1 -1
  14. package/dist/code-block.js.map +1 -1
  15. package/dist/code-block_highlight-utils.d.ts +1 -1
  16. package/dist/code-block_highlight-utils.js +1 -1
  17. package/dist/code.d.ts +1 -1
  18. package/dist/color.d.ts +1 -1
  19. package/dist/combobox.d.ts +2 -2
  20. package/dist/combobox.js +1 -1
  21. package/dist/command.d.ts +3 -3
  22. package/dist/command.js +1 -1
  23. package/dist/compose-refs-DZ3cPi47.js +2 -0
  24. package/dist/compose-refs-DZ3cPi47.js.map +1 -0
  25. package/dist/copy-to-clipboard-DjOD_Mwb.js +2 -0
  26. package/dist/copy-to-clipboard-DjOD_Mwb.js.map +1 -0
  27. package/dist/data-table.d.ts +245 -71
  28. package/dist/data-table.js +1 -1
  29. package/dist/data-table.js.map +1 -1
  30. package/dist/{deep-non-nullable-DwBZzk4x.d.ts → deep-non-nullable-VFm1T3JZ.d.ts} +1 -1
  31. package/dist/description-list.d.ts +1 -1
  32. package/dist/{dialog-MiS_Q-ge.js → dialog-BHzl9eye.js} +1 -1
  33. package/dist/{dialog-MiS_Q-ge.js.map → dialog-BHzl9eye.js.map} +1 -1
  34. package/dist/dialog.d.ts +2 -2
  35. package/dist/dialog.js +1 -1
  36. package/dist/{direction-ClCocWIf.js → direction-DsB-pD9V.js} +1 -1
  37. package/dist/{direction-ClCocWIf.js.map → direction-DsB-pD9V.js.map} +1 -1
  38. package/dist/{direction-Jk7BkzGo.d.ts → direction-DtBAQn7p.d.ts} +1 -1
  39. package/dist/{dropdown-menu-C9f9Y8Ov.d.ts → dropdown-menu-CzUNYIfA.d.ts} +2 -2
  40. package/dist/{dropdown-menu-Ff97BIJe.js → dropdown-menu-Ducs2SEn.js} +2 -2
  41. package/dist/{dropdown-menu-Ff97BIJe.js.map → dropdown-menu-Ducs2SEn.js.map} +1 -1
  42. package/dist/dropdown-menu.d.ts +1 -1
  43. package/dist/dropdown-menu.js +1 -1
  44. package/dist/empty.d.ts +2 -2
  45. package/dist/hooks.d.ts +5 -6
  46. package/dist/hooks.js +1 -1
  47. package/dist/{icon-C0YAAaLZ.d.ts → icon-DKMJm20j.d.ts} +2 -2
  48. package/dist/{icon-button-Cl30yTfu.d.ts → icon-button-BnK4K7YK.d.ts} +3 -3
  49. package/dist/icon.d.ts +3 -3
  50. package/dist/icons.d.ts +3 -3
  51. package/dist/icons.js +1 -1
  52. package/dist/{in-view-DsiWfQpY.d.ts → in-view-Da08Bx6l.d.ts} +15 -4
  53. package/dist/{in-view-BXzPPdcl.js → in-view-pia_SVdE.js} +1 -1
  54. package/dist/{in-view-BXzPPdcl.js.map → in-view-pia_SVdE.js.map} +1 -1
  55. package/dist/{index-ddHz7L9f.d.ts → index-DMAkXvFI.d.ts} +2 -2
  56. package/dist/{index-DU3SQJ46.d.ts → index-DOJUH34Z.d.ts} +4 -4
  57. package/dist/{index-B6SPk_xb.d.ts → index-DkMUaYsw.d.ts} +1 -1
  58. package/dist/{index-vOSpS5jv.d.ts → index-rtz7SwEq.d.ts} +1 -1
  59. package/dist/input.d.ts +2 -2
  60. package/dist/input.js +1 -1
  61. package/dist/{is-input-Bh1rQhX3.js → is-input-CUEWaxtA.js} +1 -1
  62. package/dist/{is-input-Bh1rQhX3.js.map → is-input-CUEWaxtA.js.map} +1 -1
  63. package/dist/{kbd-B0wWeV_0.js → kbd-CAVUiqBT.js} +1 -1
  64. package/dist/{kbd-B0wWeV_0.js.map → kbd-CAVUiqBT.js.map} +1 -1
  65. package/dist/kbd.js +1 -1
  66. package/dist/media-object.d.ts +1 -1
  67. package/dist/multi-select.d.ts +2 -2
  68. package/dist/multi-select.js +1 -1
  69. package/dist/pagination.d.ts +3 -3
  70. package/dist/pagination.js +1 -1
  71. package/dist/{primitive-DXo0gUqw.d.ts → primitive-tyw4V7Vf.d.ts} +1 -1
  72. package/dist/radio-group.d.ts +1 -1
  73. package/dist/radio-group.js +1 -1
  74. package/dist/{resolve-pre-rendered-props-BXv6e6fc.js → resolve-pre-rendered-props-C-kiaLHj.js} +1 -1
  75. package/dist/{resolve-pre-rendered-props-BXv6e6fc.js.map → resolve-pre-rendered-props-C-kiaLHj.js.map} +1 -1
  76. package/dist/{resolve-pre-rendered-props-kcQrtWPt.d.ts → resolve-pre-rendered-props-x-52gvQ1.d.ts} +2 -2
  77. package/dist/sandboxed-on-click.d.ts +1 -1
  78. package/dist/{select-DNJli9JO.d.ts → select-BjpP51vO.d.ts} +3 -3
  79. package/dist/{select-LJmfG--I.js → select-DOgdZO0Q.js} +2 -2
  80. package/dist/{select-LJmfG--I.js.map → select-DOgdZO0Q.js.map} +1 -1
  81. package/dist/select.d.ts +1 -1
  82. package/dist/select.js +1 -1
  83. package/dist/{separator-DyOGgFCs.js → separator-DSOIrnhj.js} +1 -1
  84. package/dist/{separator-DyOGgFCs.js.map → separator-DSOIrnhj.js.map} +1 -1
  85. package/dist/separator.d.ts +1 -1
  86. package/dist/separator.js +1 -1
  87. package/dist/sheet.d.ts +2 -2
  88. package/dist/{sort-C_Jbs1dH.js → sort-DzCsa6Qj.js} +2 -2
  89. package/dist/{sort-C_Jbs1dH.js.map → sort-DzCsa6Qj.js.map} +1 -1
  90. package/dist/split-button.d.ts +3 -3
  91. package/dist/split-button.js +1 -1
  92. package/dist/{svg-only-BnnbLx6R.d.ts → svg-only-BtBvFy-N.d.ts} +2 -2
  93. package/dist/{table-4q1UxE7L.d.ts → table--DsTqaWO.d.ts} +1 -1
  94. package/dist/{table-12T25gGa.js → table-Cl4nlRMR.js} +2 -2
  95. package/dist/{table-12T25gGa.js.map → table-Cl4nlRMR.js.map} +1 -1
  96. package/dist/table.d.ts +1 -1
  97. package/dist/table.js +1 -1
  98. package/dist/tabs.js +1 -1
  99. package/dist/text-area.d.ts +1 -1
  100. package/dist/text-area.js +1 -1
  101. package/dist/theme.d.ts +1 -1
  102. package/dist/{themes-DXb8Tk74.d.ts → themes-DIEYkvNl.d.ts} +1 -1
  103. package/dist/toast.d.ts +3 -3
  104. package/dist/{traffic-policy-file-ChsoQtXQ.js → traffic-policy-file-C6LHYrIU.js} +1 -1
  105. package/dist/{traffic-policy-file-ChsoQtXQ.js.map → traffic-policy-file-C6LHYrIU.js.map} +1 -1
  106. package/dist/{types-BeTbgoJd.d.ts → types-DG0WQLTL.d.ts} +1 -1
  107. package/dist/{types-DEYyl5LX.d.ts → types-DoV0R5Ja.d.ts} +1 -1
  108. package/dist/types.d.ts +5 -5
  109. package/dist/use-copy-to-clipboard-C7vsjJe-.js +2 -0
  110. package/dist/use-copy-to-clipboard-C7vsjJe-.js.map +1 -0
  111. package/dist/{use-prefers-reduced-motion-BcwST13S.js → use-prefers-reduced-motion-aXfsyo-k.js} +1 -1
  112. package/dist/{use-prefers-reduced-motion-BcwST13S.js.map → use-prefers-reduced-motion-aXfsyo-k.js.map} +1 -1
  113. package/dist/utils.d.ts +3 -3
  114. package/dist/utils.js +1 -1
  115. package/dist/utils.js.map +1 -1
  116. package/dist/{variant-props-DszdagRm.d.ts → variant-props-DUmSIQK8.d.ts} +2 -2
  117. package/dist/{with-style-props-Dlz3G1tS.d.ts → with-style-props-3iFrBR08.d.ts} +1 -1
  118. package/package.json +1 -1
  119. package/dist/compose-refs-DFIaEnQH.js +0 -2
  120. package/dist/compose-refs-DFIaEnQH.js.map +0 -1
  121. package/dist/use-copy-to-clipboard-Ds9MsSNU.js +0 -2
  122. package/dist/use-copy-to-clipboard-Ds9MsSNU.js.map +0 -1
@@ -1 +1 @@
1
- {"version":3,"file":"dropdown-menu-Ff97BIJe.js","names":[],"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 { ComponentProps, ComponentPropsWithoutRef, ComponentRef } from \"react\";\nimport { forwardRef } from \"react\";\nimport { cx } from \"../../utils/cx/cx.js\";\nimport { Icon } from \"../icon/icon.js\";\nimport { Separator } from \"../separator/separator.js\";\n\n/**\n * A menu of options or actions, triggered by a button.\n * This is the root, stateful component that manages the open/closed state of the dropdown menu.\n *\n * @see https://mantle.ngrok.com/components/dropdown-menu#dropdownmenuroot\n *\n * @example\n * ```tsx\n * <DropdownMenu.Root>\n * <DropdownMenu.Trigger asChild>\n * <Button type=\"button\" appearance=\"outlined\">\n * Open Menu\n * </Button>\n * </DropdownMenu.Trigger>\n * <DropdownMenu.Content>\n * <DropdownMenu.Item>Item 1</DropdownMenu.Item>\n * <DropdownMenu.Item>Item 2</DropdownMenu.Item>\n * </DropdownMenu.Content>\n * </DropdownMenu.Root>\n * ```\n */\nconst Root = DropdownMenuPrimitive.Root;\nRoot.displayName = \"DropdownMenu\";\n\n/**\n * The trigger button that opens the dropdown menu.\n *\n * @see https://mantle.ngrok.com/components/dropdown-menu#dropdownmenutrigger\n *\n * @example\n * ```tsx\n * <DropdownMenu.Root>\n * <DropdownMenu.Trigger asChild>\n * <Button type=\"button\" appearance=\"outlined\">\n * Open Menu\n * </Button>\n * </DropdownMenu.Trigger>\n * <DropdownMenu.Content>\n * <DropdownMenu.Item>Item 1</DropdownMenu.Item>\n * </DropdownMenu.Content>\n * </DropdownMenu.Root>\n * ```\n */\nconst Trigger = forwardRef<\n\tComponentRef<typeof DropdownMenuPrimitive.Trigger>,\n\tComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Trigger>\n>((props, ref) => (\n\t<DropdownMenuPrimitive.Trigger ref={ref} data-slot=\"dropdown-menu-trigger\" {...props} />\n));\nTrigger.displayName = \"DropdownMenuTrigger\";\n\nconst Group = forwardRef<\n\tComponentRef<typeof DropdownMenuPrimitive.Group>,\n\tComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Group>\n>(({ className, ...props }, ref) => (\n\t<DropdownMenuPrimitive.Group\n\t\tref={ref}\n\t\tdata-slot=\"dropdown-menu-group\"\n\t\tclassName={cx(\"space-y-px\", className)}\n\t\t{...props}\n\t/>\n));\nGroup.displayName = \"DropdownMenuGroup\";\n\n/**\n * The portal container for rendering dropdown content outside the normal DOM tree.\n */\nconst Portal = DropdownMenuPrimitive.Portal;\nPortal.displayName = \"DropdownMenuPortal\";\n\nconst Sub = DropdownMenuPrimitive.Sub;\nSub.displayName = \"DropdownMenuSub\";\n\nconst RadioGroup = forwardRef<\n\tComponentRef<typeof DropdownMenuPrimitive.RadioGroup>,\n\tComponentPropsWithoutRef<typeof DropdownMenuPrimitive.RadioGroup>\n>(({ className, ...props }, ref) => (\n\t<DropdownMenuPrimitive.RadioGroup\n\t\tref={ref}\n\t\tdata-slot=\"dropdown-menu-radio-group\"\n\t\tclassName={cx(\"space-y-px\", className)}\n\t\t{...props}\n\t/>\n));\nRadioGroup.displayName = \"DropdownMenuRadioGroup\";\n\n/**\n * A trigger for a dropdown menu sub-menu.\n *\n * @see https://mantle.ngrok.com/components/dropdown-menu#dropdownmenusubtrigger\n */\nconst SubTrigger = forwardRef<\n\tComponentRef<typeof DropdownMenuPrimitive.SubTrigger>,\n\tComponentPropsWithoutRef<typeof DropdownMenuPrimitive.SubTrigger> & {\n\t\tinset?: boolean;\n\t}\n>(({ className, inset, children, ...props }, ref) => (\n\t<DropdownMenuPrimitive.SubTrigger\n\t\tdata-slot=\"dropdown-menu-sub-trigger\"\n\t\tclassName={cx(\n\t\t\t\"focus:bg-accent data-state-open:bg-accent relative flex select-none items-center rounded-md py-1.5 pl-2 pr-9 text-sm outline-hidden\",\n\t\t\t\"data-highlighted:bg-active-menu-item data-state-open:bg-active-menu-item\",\n\t\t\t\"[&>svg]:size-5 [&_svg]:shrink-0\",\n\t\t\tinset && \"pl-8\",\n\t\t\tclassName,\n\t\t)}\n\t\tref={ref}\n\t\t{...props}\n\t>\n\t\t{children}\n\t\t<span className=\"absolute right-2 flex items-center\">\n\t\t\t<Icon svg={<CaretRightIcon weight=\"bold\" />} className=\"size-4\" />\n\t\t</span>\n\t</DropdownMenuPrimitive.SubTrigger>\n));\nSubTrigger.displayName = \"DropdownMenuSubTrigger\";\n\n/**\n * The content container for a dropdown menu sub-menu.\n *\n * @see https://mantle.ngrok.com/components/dropdown-menu#dropdownmenusubcontent\n */\nconst SubContent = forwardRef<\n\tComponentRef<typeof DropdownMenuPrimitive.SubContent>,\n\tComponentPropsWithoutRef<typeof DropdownMenuPrimitive.SubContent>\n>(({ className, loop = true, ...props }, ref) => (\n\t<Portal>\n\t\t<DropdownMenuPrimitive.SubContent\n\t\t\tdata-slot=\"dropdown-menu-sub-content\"\n\t\t\tclassName={cx(\n\t\t\t\t\"scrollbar\",\n\t\t\t\t\"text-popover-foreground border-popover bg-popover p-1.25 data-state-closed:animate-out data-state-closed:fade-out-0 data-state-closed:zoom-out-95 data-state-open:animate-in data-state-open:fade-in-0 data-state-open:zoom-in-95 data-side-bottom:slide-in-from-top-2 data-side-left:slide-in-from-right-2 data-side-right:slide-in-from-left-2 data-side-top:slide-in-from-bottom-2 z-50 min-w-32 overflow-hidden rounded-md border shadow-xl space-y-px font-sans\",\n\t\t\t\t\"my-2 max-h-[calc(var(--radix-dropdown-menu-content-available-height)-16px)] overflow-auto\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\tloop={loop}\n\t\t\tref={ref}\n\t\t\t{...props}\n\t\t/>\n\t</Portal>\n));\nSubContent.displayName = \"DropdownMenuSubContent\";\n\ntype DropdownMenuContentProps = ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Content> & {\n\t/**\n\t * Whether the DropdownMenuContent should match the width of the trigger or use the intrinsic content width.\n\t */\n\twidth?: \"trigger\" | \"content\";\n};\n\n/**\n * The container for the dropdown menu content.\n *\n * @see https://mantle.ngrok.com/components/dropdown-menu#dropdownmenucontent\n *\n * @example\n * ```tsx\n * <DropdownMenu.Root>\n * <DropdownMenu.Trigger asChild>\n * <Button type=\"button\" appearance=\"outlined\">\n * Open Menu\n * </Button>\n * </DropdownMenu.Trigger>\n * <DropdownMenu.Content>\n * <DropdownMenu.Item>Item 1</DropdownMenu.Item>\n * <DropdownMenu.Item>Item 2</DropdownMenu.Item>\n * </DropdownMenu.Content>\n * </DropdownMenu.Root>\n * ```\n */\nconst Content = forwardRef<\n\tComponentRef<typeof DropdownMenuPrimitive.Content>,\n\tDropdownMenuContentProps\n>(({ className, onClick, loop = true, width, ...props }, ref) => (\n\t<Portal>\n\t\t<DropdownMenuPrimitive.Content\n\t\t\tref={ref}\n\t\t\tdata-slot=\"dropdown-menu-content\"\n\t\t\tclassName={cx(\n\t\t\t\t\"scrollbar\",\n\t\t\t\t\"text-popover-foreground border-popover bg-popover p-1.25 z-50 min-w-32 overflow-hidden rounded-md border shadow-xl outline-hidden space-y-px font-sans\",\n\t\t\t\t\"data-side-bottom:slide-in-from-top-2 data-side-left:slide-in-from-right-2 data-side-right:slide-in-from-left-2 data-side-top:slide-in-from-bottom-2 data-state-closed:animate-out data-state-closed:fade-out-0 data-state-closed:zoom-out-95 data-state-open:animate-in data-state-open:fade-in-0 data-state-open:zoom-in-95\",\n\t\t\t\t\"my-2 max-h-[calc(var(--radix-dropdown-menu-content-available-height)-16px)] overflow-auto\",\n\t\t\t\twidth === \"trigger\" && \"w-(--radix-dropdown-menu-trigger-width)\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\tloop={loop}\n\t\t\tonClick={(event) => {\n\t\t\t\t/**\n\t\t\t\t * Prevent the click event from propagating up to parent/containing elements\n\t\t\t\t * of the DropdownMenu\n\t\t\t\t */\n\t\t\t\tevent.stopPropagation();\n\t\t\t\tonClick?.(event);\n\t\t\t}}\n\t\t\t{...props}\n\t\t/>\n\t</Portal>\n));\nContent.displayName = \"DropdownMenuContent\";\n\n/**\n * An item in the dropdown menu.\n *\n * @see https://mantle.ngrok.com/components/dropdown-menu#dropdownmenuitem\n *\n * @example\n * ```tsx\n * <DropdownMenu.Root>\n * <DropdownMenu.Trigger asChild>\n * <Button type=\"button\" appearance=\"outlined\">\n * Open Menu\n * </Button>\n * </DropdownMenu.Trigger>\n * <DropdownMenu.Content>\n * <DropdownMenu.Item>Item 1</DropdownMenu.Item>\n * <DropdownMenu.Item>Item 2</DropdownMenu.Item>\n * </DropdownMenu.Content>\n * </DropdownMenu.Root>\n * ```\n */\nconst Item = forwardRef<\n\tComponentRef<typeof DropdownMenuPrimitive.Item>,\n\tComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Item> & {\n\t\tinset?: boolean;\n\t}\n>(({ className, inset, ...props }, ref) => (\n\t<DropdownMenuPrimitive.Item\n\t\tref={ref}\n\t\tdata-slot=\"dropdown-menu-item\"\n\t\tclassName={cx(\n\t\t\t\"relative flex cursor-pointer select-none items-center rounded-md px-2 py-1.5 text-strong text-sm font-normal outline-hidden transition-colors\",\n\t\t\t\"data-highlighted:bg-active-menu-item\",\n\t\t\t\"focus:bg-accent focus:text-accent-foreground\",\n\t\t\t\"data-disabled:cursor-default data-disabled:opacity-50\",\n\t\t\t\"[&>svg]:size-5 [&_svg]:shrink-0\",\n\t\t\tinset && \"pl-8\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t/>\n));\nItem.displayName = \"DropdownMenuItem\";\n\n/**\n * A menu item with a checkbox that can be controlled or uncontrolled.\n *\n * @see https://mantle.ngrok.com/components/dropdown-menu#dropdownmenucheckboxitem\n */\nconst CheckboxItem = forwardRef<\n\tComponentRef<typeof DropdownMenuPrimitive.CheckboxItem>,\n\tComponentPropsWithoutRef<typeof DropdownMenuPrimitive.CheckboxItem>\n>(({ className, children, checked, ...props }, ref) => (\n\t<DropdownMenuPrimitive.CheckboxItem\n\t\tref={ref}\n\t\tdata-slot=\"dropdown-menu-checkbox-item\"\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-md py-1.5 pl-2 pr-9 text-sm font-normal outline-hidden\",\n\t\t\t\"data-highlighted:bg-active-menu-item\",\n\t\t\t\"aria-checked:bg-selected-menu-item\",\n\t\t\t\"data-highlighted:aria-checked:bg-active-selected-menu-item!\",\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 text-accent-600\" />\n\t\t\t</DropdownMenuPrimitive.ItemIndicator>\n\t\t</span>\n\t\t{children}\n\t</DropdownMenuPrimitive.CheckboxItem>\n));\nCheckboxItem.displayName = \"DropdownMenuCheckboxItem\";\n\ntype DropdownMenuRadioItemProps = ComponentPropsWithoutRef<\n\ttypeof DropdownMenuPrimitive.RadioItem\n> & {\n\tname?: string;\n\tid?: string;\n};\n\n/**\n * A menu item with a radio button that can be controlled or uncontrolled.\n * Used within a RadioGroup to create a set of mutually exclusive options.\n *\n * @see https://mantle.ngrok.com/components/dropdown-menu#dropdownmenuradioitem\n */\nconst RadioItem = forwardRef<ComponentRef<\"input\">, DropdownMenuRadioItemProps>(\n\t({ className, children, ...props }, ref) => (\n\t\t<DropdownMenuPrimitive.RadioItem\n\t\t\tdata-slot=\"dropdown-menu-radio-item\"\n\t\t\tclassName={cx(\n\t\t\t\t\"group/dropdown-menu-radio-item\",\n\t\t\t\t\"text-strong data-disabled:pointer-events-none data-disabled:opacity-50 relative flex cursor-pointer select-none items-center gap-2 rounded-md py-1.5 px-2 text-sm font-normal outline-none\",\n\t\t\t\t\"data-highlighted:bg-active-menu-item\",\n\t\t\t\t\"aria-checked:bg-selected-menu-item aria-checked:pr-9\",\n\t\t\t\t\"data-highlighted:aria-checked:bg-active-selected-menu-item!\",\n\t\t\t\t\"[&>svg]:size-5 [&_svg]:shrink-0\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\tref={ref}\n\t\t\t{...props}\n\t\t>\n\t\t\t<span className=\"absolute right-2 items-center hidden group-aria-checked/dropdown-menu-radio-item:flex\">\n\t\t\t\t<DropdownMenuPrimitive.ItemIndicator>\n\t\t\t\t\t<Icon svg={<CheckIcon weight=\"bold\" />} className=\"size-4 text-accent-600\" />\n\t\t\t\t</DropdownMenuPrimitive.ItemIndicator>\n\t\t\t</span>\n\t\t\t{children}\n\t\t</DropdownMenuPrimitive.RadioItem>\n\t),\n);\nRadioItem.displayName = \"DropdownMenuRadioItem\";\n\n/**\n * A label for a group of dropdown menu items.\n *\n * @see https://mantle.ngrok.com/components/dropdown-menu#dropdownmenulabel\n */\nconst Label = forwardRef<\n\tComponentRef<typeof DropdownMenuPrimitive.Label>,\n\tComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Label> & {\n\t\tinset?: boolean;\n\t}\n>(({ className, inset, ...props }, ref) => (\n\t<DropdownMenuPrimitive.Label\n\t\tref={ref}\n\t\tdata-slot=\"dropdown-menu-label\"\n\t\tclassName={cx(\"px-2 py-1.5 text-sm font-medium\", inset && \"pl-8\", className)}\n\t\t{...props}\n\t/>\n));\nLabel.displayName = \"DropdownMenuLabel\";\n\n/**\n * A visual separator between dropdown menu items or groups.\n *\n * @see https://mantle.ngrok.com/components/dropdown-menu#dropdownmenuseparator\n */\nconst DropdownSeparator = forwardRef<\n\tComponentRef<typeof Separator>,\n\tComponentPropsWithoutRef<typeof Separator>\n>(({ className, ...props }, ref) => (\n\t<Separator\n\t\tref={ref}\n\t\tdata-slot=\"dropdown-menu-separator\"\n\t\tclassName={cx(\"-mx-1.25 my-1 w-auto\", className)}\n\t\t{...props}\n\t/>\n));\nDropdownSeparator.displayName = \"DropdownMenuSeparator\";\n\nconst Shortcut = ({ className, ...props }: ComponentProps<\"span\">) => {\n\treturn (\n\t\t<span\n\t\t\tdata-slot=\"dropdown-menu-shortcut\"\n\t\t\tclassName={cx(\"ml-auto text-xs tracking-widest opacity-60\", className)}\n\t\t\t{...props}\n\t\t/>\n\t);\n};\nShortcut.displayName = \"DropdownMenuShortcut\";\n\n/**\n * A menu of options or actions, triggered by a button.\n *\n * @see https://mantle.ngrok.com/components/dropdown-menu\n *\n * @example\n * Composition:\n * ```\n * DropdownMenu.Root\n * ├── DropdownMenu.Trigger\n * └── DropdownMenu.Content\n * ├── DropdownMenu.Group\n * │ ├── DropdownMenu.Label\n * │ ├── DropdownMenu.Item\n * │ │ └── DropdownMenu.Shortcut\n * │ ├── DropdownMenu.CheckboxItem\n * │ └── DropdownMenu.RadioGroup\n * │ └── DropdownMenu.RadioItem\n * ├── DropdownMenu.Separator\n * └── DropdownMenu.Sub\n * ├── DropdownMenu.SubTrigger\n * └── DropdownMenu.SubContent\n * ```\n *\n * @example\n * ```tsx\n * <DropdownMenu.Root>\n * <DropdownMenu.Trigger asChild>\n * <Button type=\"button\" appearance=\"outlined\">\n * Open Menu\n * </Button>\n * </DropdownMenu.Trigger>\n * <DropdownMenu.Content>\n * <DropdownMenu.Item>Item 1</DropdownMenu.Item>\n * <DropdownMenu.Item>Item 2</DropdownMenu.Item>\n * </DropdownMenu.Content>\n * </DropdownMenu.Root>\n * ```\n */\nconst DropdownMenu = {\n\t/**\n\t * The root, stateful component that manages the open/closed state of the dropdown menu.\n\t *\n\t * @see https://mantle.ngrok.com/components/dropdown-menu#dropdownmenuroot\n\t *\n\t * @example\n\t * ```tsx\n\t * <DropdownMenu.Root>\n\t * <DropdownMenu.Trigger asChild>\n\t * <Button>Open Menu</Button>\n\t * </DropdownMenu.Trigger>\n\t * <DropdownMenu.Content>\n\t * <DropdownMenu.Item>Item 1</DropdownMenu.Item>\n\t * </DropdownMenu.Content>\n\t * </DropdownMenu.Root>\n\t * ```\n\t */\n\tRoot,\n\t/**\n\t * A checkbox item in the dropdown menu that can be toggled on and off.\n\t *\n\t * @see https://mantle.ngrok.com/components/dropdown-menu#dropdownmenucheckboxitem\n\t *\n\t * @example\n\t * ```tsx\n\t * <DropdownMenu.Root>\n\t * <DropdownMenu.Trigger>Open</DropdownMenu.Trigger>\n\t * <DropdownMenu.Content>\n\t * <DropdownMenu.CheckboxItem checked={true} onCheckedChange={setChecked}>\n\t * Show notifications\n\t * </DropdownMenu.CheckboxItem>\n\t * </DropdownMenu.Content>\n\t * </DropdownMenu.Root>\n\t * ```\n\t */\n\tCheckboxItem,\n\t/**\n\t * The container for the dropdown menu content. Appears in a portal with scrolling and animations.\n\t *\n\t * @see https://mantle.ngrok.com/components/dropdown-menu#dropdownmenucontent\n\t *\n\t * @example\n\t * ```tsx\n\t * <DropdownMenu.Root>\n\t * <DropdownMenu.Trigger>Open</DropdownMenu.Trigger>\n\t * <DropdownMenu.Content width=\"trigger\">\n\t * <DropdownMenu.Item>Edit</DropdownMenu.Item>\n\t * <DropdownMenu.Item>Delete</DropdownMenu.Item>\n\t * </DropdownMenu.Content>\n\t * </DropdownMenu.Root>\n\t * ```\n\t */\n\tContent,\n\t/**\n\t * A group container for organizing related dropdown menu items.\n\t *\n\t * @see https://mantle.ngrok.com/components/dropdown-menu#dropdownmenugroup\n\t *\n\t * @example\n\t * ```tsx\n\t * <DropdownMenu.Root>\n\t * <DropdownMenu.Trigger>Open</DropdownMenu.Trigger>\n\t * <DropdownMenu.Content>\n\t * <DropdownMenu.Group>\n\t * <DropdownMenu.Label>Account</DropdownMenu.Label>\n\t * <DropdownMenu.Item>Profile</DropdownMenu.Item>\n\t * <DropdownMenu.Item>Settings</DropdownMenu.Item>\n\t * </DropdownMenu.Group>\n\t * </DropdownMenu.Content>\n\t * </DropdownMenu.Root>\n\t * ```\n\t */\n\tGroup,\n\t/**\n\t * A standard item in the dropdown menu that can be selected or activated.\n\t *\n\t * @see https://mantle.ngrok.com/components/dropdown-menu#dropdownmenuitem\n\t *\n\t * @example\n\t * ```tsx\n\t * <DropdownMenu.Root>\n\t * <DropdownMenu.Trigger>Open</DropdownMenu.Trigger>\n\t * <DropdownMenu.Content>\n\t * <DropdownMenu.Item onSelect={() => handleEdit()}>\n\t * Edit\n\t * </DropdownMenu.Item>\n\t * <DropdownMenu.Item disabled>\n\t * Delete\n\t * </DropdownMenu.Item>\n\t * </DropdownMenu.Content>\n\t * </DropdownMenu.Root>\n\t * ```\n\t */\n\tItem,\n\t/**\n\t * A label for grouping and describing sections within the dropdown menu.\n\t *\n\t * @see https://mantle.ngrok.com/components/dropdown-menu#dropdownmenulabel\n\t *\n\t * @example\n\t * ```tsx\n\t * <DropdownMenu.Root>\n\t * <DropdownMenu.Trigger>Open</DropdownMenu.Trigger>\n\t * <DropdownMenu.Content>\n\t * <DropdownMenu.Label>My Account</DropdownMenu.Label>\n\t * <DropdownMenu.Item>Profile</DropdownMenu.Item>\n\t * <DropdownMenu.Item>Settings</DropdownMenu.Item>\n\t * </DropdownMenu.Content>\n\t * </DropdownMenu.Root>\n\t * ```\n\t */\n\tLabel,\n\t/**\n\t * A radio group container for exclusive selection within the dropdown menu.\n\t *\n\t * @see https://mantle.ngrok.com/components/dropdown-menu#dropdownmenuradiogroup\n\t *\n\t * @example\n\t * ```tsx\n\t * <DropdownMenu.Root>\n\t * <DropdownMenu.Trigger>Open</DropdownMenu.Trigger>\n\t * <DropdownMenu.Content>\n\t * <DropdownMenu.RadioGroup value={value} onValueChange={setValue}>\n\t * <DropdownMenu.RadioItem value=\"option1\">Option 1</DropdownMenu.RadioItem>\n\t * <DropdownMenu.RadioItem value=\"option2\">Option 2</DropdownMenu.RadioItem>\n\t * </DropdownMenu.RadioGroup>\n\t * </DropdownMenu.Content>\n\t * </DropdownMenu.Root>\n\t * ```\n\t */\n\tRadioGroup,\n\t/**\n\t * A radio item in the dropdown menu where only one item in the group can be selected.\n\t *\n\t * @see https://mantle.ngrok.com/components/dropdown-menu#dropdownmenuradioitem\n\t *\n\t * @example\n\t * ```tsx\n\t * <DropdownMenu.Root>\n\t * <DropdownMenu.Trigger>Open</DropdownMenu.Trigger>\n\t * <DropdownMenu.Content>\n\t * <DropdownMenu.RadioGroup value=\"small\" onValueChange={setSize}>\n\t * <DropdownMenu.RadioItem value=\"small\">Small</DropdownMenu.RadioItem>\n\t * <DropdownMenu.RadioItem value=\"medium\">Medium</DropdownMenu.RadioItem>\n\t * <DropdownMenu.RadioItem value=\"large\">Large</DropdownMenu.RadioItem>\n\t * </DropdownMenu.RadioGroup>\n\t * </DropdownMenu.Content>\n\t * </DropdownMenu.Root>\n\t * ```\n\t */\n\tRadioItem,\n\t/**\n\t * A visual separator for dividing sections within the dropdown menu.\n\t *\n\t * @see https://mantle.ngrok.com/components/dropdown-menu#dropdownmenuseparator\n\t *\n\t * @example\n\t * ```tsx\n\t * <DropdownMenu.Root>\n\t * <DropdownMenu.Trigger>Open</DropdownMenu.Trigger>\n\t * <DropdownMenu.Content>\n\t * <DropdownMenu.Item>Edit</DropdownMenu.Item>\n\t * <DropdownMenu.Item>Copy</DropdownMenu.Item>\n\t * <DropdownMenu.Separator />\n\t * <DropdownMenu.Item>Delete</DropdownMenu.Item>\n\t * </DropdownMenu.Content>\n\t * </DropdownMenu.Root>\n\t * ```\n\t */\n\tSeparator: DropdownSeparator,\n\t/**\n\t * A keyboard shortcut indicator for dropdown menu items.\n\t *\n\t * @see https://mantle.ngrok.com/components/dropdown-menu#dropdownmenushortcut\n\t *\n\t * @example\n\t * ```tsx\n\t * <DropdownMenu.Root>\n\t * <DropdownMenu.Trigger>Open</DropdownMenu.Trigger>\n\t * <DropdownMenu.Content>\n\t * <DropdownMenu.Item>\n\t * Save\n\t * <DropdownMenu.Shortcut>⌘S</DropdownMenu.Shortcut>\n\t * </DropdownMenu.Item>\n\t * </DropdownMenu.Content>\n\t * </DropdownMenu.Root>\n\t * ```\n\t */\n\tShortcut,\n\t/**\n\t * A submenu container for creating nested dropdown menus.\n\t *\n\t * @see https://mantle.ngrok.com/components/dropdown-menu#dropdownmenusub\n\t *\n\t * @example\n\t * ```tsx\n\t * <DropdownMenu.Root>\n\t * <DropdownMenu.Trigger>Open</DropdownMenu.Trigger>\n\t * <DropdownMenu.Content>\n\t * <DropdownMenu.Sub>\n\t * <DropdownMenu.SubTrigger>More options</DropdownMenu.SubTrigger>\n\t * <DropdownMenu.SubContent>\n\t * <DropdownMenu.Item>Sub item 1</DropdownMenu.Item>\n\t * <DropdownMenu.Item>Sub item 2</DropdownMenu.Item>\n\t * </DropdownMenu.SubContent>\n\t * </DropdownMenu.Sub>\n\t * </DropdownMenu.Content>\n\t * </DropdownMenu.Root>\n\t * ```\n\t */\n\tSub,\n\t/**\n\t * The content container for submenu items.\n\t *\n\t * @see https://mantle.ngrok.com/components/dropdown-menu#dropdownmenusubcontent\n\t *\n\t * @example\n\t * ```tsx\n\t * <DropdownMenu.Root>\n\t * <DropdownMenu.Trigger>Open</DropdownMenu.Trigger>\n\t * <DropdownMenu.Content>\n\t * <DropdownMenu.Sub>\n\t * <DropdownMenu.SubTrigger>Export</DropdownMenu.SubTrigger>\n\t * <DropdownMenu.SubContent>\n\t * <DropdownMenu.Item>Export as PDF</DropdownMenu.Item>\n\t * <DropdownMenu.Item>Export as CSV</DropdownMenu.Item>\n\t * </DropdownMenu.SubContent>\n\t * </DropdownMenu.Sub>\n\t * </DropdownMenu.Content>\n\t * </DropdownMenu.Root>\n\t * ```\n\t */\n\tSubContent,\n\t/**\n\t * The trigger item that opens a submenu when hovered or focused.\n\t *\n\t * @see https://mantle.ngrok.com/components/dropdown-menu#dropdownmenusubtrigger\n\t *\n\t * @example\n\t * ```tsx\n\t * <DropdownMenu.Root>\n\t * <DropdownMenu.Trigger>Open</DropdownMenu.Trigger>\n\t * <DropdownMenu.Content>\n\t * <DropdownMenu.Sub>\n\t * <DropdownMenu.SubTrigger>Share</DropdownMenu.SubTrigger>\n\t * <DropdownMenu.SubContent>\n\t * <DropdownMenu.Item>Email</DropdownMenu.Item>\n\t * <DropdownMenu.Item>Copy link</DropdownMenu.Item>\n\t * </DropdownMenu.SubContent>\n\t * </DropdownMenu.Sub>\n\t * </DropdownMenu.Content>\n\t * </DropdownMenu.Root>\n\t * ```\n\t */\n\tSubTrigger,\n\t/**\n\t * The trigger button that opens the dropdown menu.\n\t *\n\t * @see https://mantle.ngrok.com/components/dropdown-menu#dropdownmenutrigger\n\t *\n\t * @example\n\t * ```tsx\n\t * <DropdownMenu.Root>\n\t * <DropdownMenu.Trigger asChild>\n\t * <Button type=\"button\" appearance=\"outlined\">\n\t * Open Menu\n\t * </Button>\n\t * </DropdownMenu.Trigger>\n\t * <DropdownMenu.Content>\n\t * <DropdownMenu.Item>Item 1</DropdownMenu.Item>\n\t * </DropdownMenu.Content>\n\t * </DropdownMenu.Root>\n\t * ```\n\t */\n\tTrigger,\n} as const;\n\nexport {\n\t//,\n\tDropdownMenu,\n};\n"],"mappings":"6WA8BA,MAAM,EAAO,EAAsB,KACnC,EAAK,YAAc,eAqBnB,MAAM,EAAU,GAGb,EAAO,IACT,EAAC,EAAsB,QAAvB,CAAoC,MAAK,YAAU,wBAAwB,GAAI,EAAS,CAAA,CACvF,CACF,EAAQ,YAAc,sBAEtB,MAAM,EAAQ,GAGX,CAAE,YAAW,GAAG,GAAS,IAC3B,EAAC,EAAsB,MAAvB,CACM,MACL,YAAU,sBACV,UAAW,EAAG,aAAc,EAAU,CACtC,GAAI,EACH,CAAA,CACD,CACF,EAAM,YAAc,oBAKpB,MAAM,EAAS,EAAsB,OACrC,EAAO,YAAc,qBAErB,MAAM,EAAM,EAAsB,IAClC,EAAI,YAAc,kBAElB,MAAM,EAAa,GAGhB,CAAE,YAAW,GAAG,GAAS,IAC3B,EAAC,EAAsB,WAAvB,CACM,MACL,YAAU,4BACV,UAAW,EAAG,aAAc,EAAU,CACtC,GAAI,EACH,CAAA,CACD,CACF,EAAW,YAAc,yBAOzB,MAAM,EAAa,GAKhB,CAAE,YAAW,QAAO,WAAU,GAAG,GAAS,IAC5C,EAAC,EAAsB,WAAvB,CACC,YAAU,4BACV,UAAW,EACV,sIACA,2EACA,kCACA,GAAS,OACT,EACA,CACI,MACL,GAAI,WAVL,CAYE,EACD,EAAC,OAAD,CAAM,UAAU,8CACf,EAAC,EAAD,CAAM,IAAK,EAAC,EAAD,CAAgB,OAAO,OAAS,CAAA,CAAE,UAAU,SAAW,CAAA,CAC5D,CAAA,CAC2B,GAClC,CACF,EAAW,YAAc,yBAOzB,MAAM,EAAa,GAGhB,CAAE,YAAW,OAAO,GAAM,GAAG,GAAS,IACxC,EAAC,EAAD,CAAA,SACC,EAAC,EAAsB,WAAvB,CACC,YAAU,4BACV,UAAW,EACV,YACA,ucACA,4FACA,EACA,CACK,OACD,MACL,GAAI,EACH,CAAA,CACM,CAAA,CACR,CACF,EAAW,YAAc,yBA6BzB,MAAM,EAAU,GAGb,CAAE,YAAW,UAAS,OAAO,GAAM,QAAO,GAAG,GAAS,IACxD,EAAC,EAAD,CAAA,SACC,EAAC,EAAsB,QAAvB,CACM,MACL,YAAU,wBACV,UAAW,EACV,YACA,yJACA,+TACA,4FACA,IAAU,WAAa,0CACvB,EACA,CACK,OACN,QAAU,GAAU,CAKnB,EAAM,iBAAiB,CACvB,IAAU,EAAM,EAEjB,GAAI,EACH,CAAA,CACM,CAAA,CACR,CACF,EAAQ,YAAc,sBAsBtB,MAAM,EAAO,GAKV,CAAE,YAAW,QAAO,GAAG,GAAS,IAClC,EAAC,EAAsB,KAAvB,CACM,MACL,YAAU,qBACV,UAAW,EACV,gJACA,uCACA,+CACA,wDACA,kCACA,GAAS,OACT,EACA,CACD,GAAI,EACH,CAAA,CACD,CACF,EAAK,YAAc,mBAOnB,MAAM,EAAe,GAGlB,CAAE,YAAW,WAAU,UAAS,GAAG,GAAS,IAC9C,EAAC,EAAsB,aAAvB,CACM,MACL,YAAU,8BACV,UAAW,EACV,oMACA,uCACA,qCACA,8DACA,kCACA,EACA,CACQ,UACT,GAAI,WAZL,CAcC,EAAC,OAAD,CAAM,UAAU,8CACf,EAAC,EAAsB,cAAvB,CAAA,SACC,EAAC,EAAD,CAAM,IAAK,EAAC,EAAD,CAAW,OAAO,OAAS,CAAA,CAAE,UAAU,yBAA2B,CAAA,CACxC,CAAA,CAChC,CAAA,CACN,EACmC,GACpC,CACF,EAAa,YAAc,2BAe3B,MAAM,EAAY,GAChB,CAAE,YAAW,WAAU,GAAG,GAAS,IACnC,EAAC,EAAsB,UAAvB,CACC,YAAU,2BACV,UAAW,EACV,iCACA,6LACA,uCACA,uDACA,8DACA,kCACA,EACA,CACI,MACL,GAAI,WAZL,CAcC,EAAC,OAAD,CAAM,UAAU,iGACf,EAAC,EAAsB,cAAvB,CAAA,SACC,EAAC,EAAD,CAAM,IAAK,EAAC,EAAD,CAAW,OAAO,OAAS,CAAA,CAAE,UAAU,yBAA2B,CAAA,CACxC,CAAA,CAChC,CAAA,CACN,EACgC,GAEnC,CACD,EAAU,YAAc,wBAOxB,MAAM,EAAQ,GAKX,CAAE,YAAW,QAAO,GAAG,GAAS,IAClC,EAAC,EAAsB,MAAvB,CACM,MACL,YAAU,sBACV,UAAW,EAAG,kCAAmC,GAAS,OAAQ,EAAU,CAC5E,GAAI,EACH,CAAA,CACD,CACF,EAAM,YAAc,oBAOpB,MAAM,EAAoB,GAGvB,CAAE,YAAW,GAAG,GAAS,IAC3B,EAAC,EAAD,CACM,MACL,YAAU,0BACV,UAAW,EAAG,uBAAwB,EAAU,CAChD,GAAI,EACH,CAAA,CACD,CACF,EAAkB,YAAc,wBAEhC,MAAM,GAAY,CAAE,YAAW,GAAG,KAEhC,EAAC,OAAD,CACC,YAAU,yBACV,UAAW,EAAG,6CAA8C,EAAU,CACtE,GAAI,EACH,CAAA,CAGJ,EAAS,YAAc,uBAyCvB,MAAM,EAAe,CAkBpB,OAkBA,eAiBA,UAoBA,QAqBA,OAkBA,QAmBA,aAoBA,YAmBA,UAAW,EAmBX,WAsBA,MAsBA,aAsBA,aAoBA,UACA"}
1
+ {"version":3,"file":"dropdown-menu-Ducs2SEn.js","names":[],"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 { ComponentProps, ComponentPropsWithoutRef, ComponentRef } from \"react\";\nimport { forwardRef } from \"react\";\nimport { cx } from \"../../utils/cx/cx.js\";\nimport { Icon } from \"../icon/icon.js\";\nimport { Separator } from \"../separator/separator.js\";\n\n/**\n * A menu of options or actions, triggered by a button.\n * This is the root, stateful component that manages the open/closed state of the dropdown menu.\n *\n * @see https://mantle.ngrok.com/components/dropdown-menu#dropdownmenuroot\n *\n * @example\n * ```tsx\n * <DropdownMenu.Root>\n * <DropdownMenu.Trigger asChild>\n * <Button type=\"button\" appearance=\"outlined\">\n * Open Menu\n * </Button>\n * </DropdownMenu.Trigger>\n * <DropdownMenu.Content>\n * <DropdownMenu.Item>Item 1</DropdownMenu.Item>\n * <DropdownMenu.Item>Item 2</DropdownMenu.Item>\n * </DropdownMenu.Content>\n * </DropdownMenu.Root>\n * ```\n */\nconst Root = DropdownMenuPrimitive.Root;\nRoot.displayName = \"DropdownMenu\";\n\n/**\n * The trigger button that opens the dropdown menu.\n *\n * @see https://mantle.ngrok.com/components/dropdown-menu#dropdownmenutrigger\n *\n * @example\n * ```tsx\n * <DropdownMenu.Root>\n * <DropdownMenu.Trigger asChild>\n * <Button type=\"button\" appearance=\"outlined\">\n * Open Menu\n * </Button>\n * </DropdownMenu.Trigger>\n * <DropdownMenu.Content>\n * <DropdownMenu.Item>Item 1</DropdownMenu.Item>\n * </DropdownMenu.Content>\n * </DropdownMenu.Root>\n * ```\n */\nconst Trigger = forwardRef<\n\tComponentRef<typeof DropdownMenuPrimitive.Trigger>,\n\tComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Trigger>\n>((props, ref) => (\n\t<DropdownMenuPrimitive.Trigger ref={ref} data-slot=\"dropdown-menu-trigger\" {...props} />\n));\nTrigger.displayName = \"DropdownMenuTrigger\";\n\nconst Group = forwardRef<\n\tComponentRef<typeof DropdownMenuPrimitive.Group>,\n\tComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Group>\n>(({ className, ...props }, ref) => (\n\t<DropdownMenuPrimitive.Group\n\t\tref={ref}\n\t\tdata-slot=\"dropdown-menu-group\"\n\t\tclassName={cx(\"space-y-px\", className)}\n\t\t{...props}\n\t/>\n));\nGroup.displayName = \"DropdownMenuGroup\";\n\n/**\n * The portal container for rendering dropdown content outside the normal DOM tree.\n */\nconst Portal = DropdownMenuPrimitive.Portal;\nPortal.displayName = \"DropdownMenuPortal\";\n\nconst Sub = DropdownMenuPrimitive.Sub;\nSub.displayName = \"DropdownMenuSub\";\n\nconst RadioGroup = forwardRef<\n\tComponentRef<typeof DropdownMenuPrimitive.RadioGroup>,\n\tComponentPropsWithoutRef<typeof DropdownMenuPrimitive.RadioGroup>\n>(({ className, ...props }, ref) => (\n\t<DropdownMenuPrimitive.RadioGroup\n\t\tref={ref}\n\t\tdata-slot=\"dropdown-menu-radio-group\"\n\t\tclassName={cx(\"space-y-px\", className)}\n\t\t{...props}\n\t/>\n));\nRadioGroup.displayName = \"DropdownMenuRadioGroup\";\n\n/**\n * A trigger for a dropdown menu sub-menu.\n *\n * @see https://mantle.ngrok.com/components/dropdown-menu#dropdownmenusubtrigger\n */\nconst SubTrigger = forwardRef<\n\tComponentRef<typeof DropdownMenuPrimitive.SubTrigger>,\n\tComponentPropsWithoutRef<typeof DropdownMenuPrimitive.SubTrigger> & {\n\t\tinset?: boolean;\n\t}\n>(({ className, inset, children, ...props }, ref) => (\n\t<DropdownMenuPrimitive.SubTrigger\n\t\tdata-slot=\"dropdown-menu-sub-trigger\"\n\t\tclassName={cx(\n\t\t\t\"focus:bg-accent data-state-open:bg-accent relative flex select-none items-center rounded-md py-1.5 pl-2 pr-9 text-sm outline-hidden\",\n\t\t\t\"data-highlighted:bg-active-menu-item data-state-open:bg-active-menu-item\",\n\t\t\t\"[&>svg]:size-5 [&_svg]:shrink-0\",\n\t\t\tinset && \"pl-8\",\n\t\t\tclassName,\n\t\t)}\n\t\tref={ref}\n\t\t{...props}\n\t>\n\t\t{children}\n\t\t<span className=\"absolute right-2 flex items-center\">\n\t\t\t<Icon svg={<CaretRightIcon weight=\"bold\" />} className=\"size-4\" />\n\t\t</span>\n\t</DropdownMenuPrimitive.SubTrigger>\n));\nSubTrigger.displayName = \"DropdownMenuSubTrigger\";\n\n/**\n * The content container for a dropdown menu sub-menu.\n *\n * @see https://mantle.ngrok.com/components/dropdown-menu#dropdownmenusubcontent\n */\nconst SubContent = forwardRef<\n\tComponentRef<typeof DropdownMenuPrimitive.SubContent>,\n\tComponentPropsWithoutRef<typeof DropdownMenuPrimitive.SubContent>\n>(({ className, loop = true, ...props }, ref) => (\n\t<Portal>\n\t\t<DropdownMenuPrimitive.SubContent\n\t\t\tdata-slot=\"dropdown-menu-sub-content\"\n\t\t\tclassName={cx(\n\t\t\t\t\"scrollbar\",\n\t\t\t\t\"text-popover-foreground border-popover bg-popover p-1.25 data-state-closed:animate-out data-state-closed:fade-out-0 data-state-closed:zoom-out-95 data-state-open:animate-in data-state-open:fade-in-0 data-state-open:zoom-in-95 data-side-bottom:slide-in-from-top-2 data-side-left:slide-in-from-right-2 data-side-right:slide-in-from-left-2 data-side-top:slide-in-from-bottom-2 z-50 min-w-32 overflow-hidden rounded-md border shadow-xl space-y-px font-sans\",\n\t\t\t\t\"my-2 max-h-[calc(var(--radix-dropdown-menu-content-available-height)-16px)] overflow-auto\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\tloop={loop}\n\t\t\tref={ref}\n\t\t\t{...props}\n\t\t/>\n\t</Portal>\n));\nSubContent.displayName = \"DropdownMenuSubContent\";\n\ntype DropdownMenuContentProps = ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Content> & {\n\t/**\n\t * Whether the DropdownMenuContent should match the width of the trigger or use the intrinsic content width.\n\t */\n\twidth?: \"trigger\" | \"content\";\n};\n\n/**\n * The container for the dropdown menu content.\n *\n * @see https://mantle.ngrok.com/components/dropdown-menu#dropdownmenucontent\n *\n * @example\n * ```tsx\n * <DropdownMenu.Root>\n * <DropdownMenu.Trigger asChild>\n * <Button type=\"button\" appearance=\"outlined\">\n * Open Menu\n * </Button>\n * </DropdownMenu.Trigger>\n * <DropdownMenu.Content>\n * <DropdownMenu.Item>Item 1</DropdownMenu.Item>\n * <DropdownMenu.Item>Item 2</DropdownMenu.Item>\n * </DropdownMenu.Content>\n * </DropdownMenu.Root>\n * ```\n */\nconst Content = forwardRef<\n\tComponentRef<typeof DropdownMenuPrimitive.Content>,\n\tDropdownMenuContentProps\n>(({ className, onClick, loop = true, width, ...props }, ref) => (\n\t<Portal>\n\t\t<DropdownMenuPrimitive.Content\n\t\t\tref={ref}\n\t\t\tdata-slot=\"dropdown-menu-content\"\n\t\t\tclassName={cx(\n\t\t\t\t\"scrollbar\",\n\t\t\t\t\"text-popover-foreground border-popover bg-popover p-1.25 z-50 min-w-32 overflow-hidden rounded-md border shadow-xl outline-hidden space-y-px font-sans\",\n\t\t\t\t\"data-side-bottom:slide-in-from-top-2 data-side-left:slide-in-from-right-2 data-side-right:slide-in-from-left-2 data-side-top:slide-in-from-bottom-2 data-state-closed:animate-out data-state-closed:fade-out-0 data-state-closed:zoom-out-95 data-state-open:animate-in data-state-open:fade-in-0 data-state-open:zoom-in-95\",\n\t\t\t\t\"my-2 max-h-[calc(var(--radix-dropdown-menu-content-available-height)-16px)] overflow-auto\",\n\t\t\t\twidth === \"trigger\" && \"w-(--radix-dropdown-menu-trigger-width)\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\tloop={loop}\n\t\t\tonClick={(event) => {\n\t\t\t\t/**\n\t\t\t\t * Prevent the click event from propagating up to parent/containing elements\n\t\t\t\t * of the DropdownMenu\n\t\t\t\t */\n\t\t\t\tevent.stopPropagation();\n\t\t\t\tonClick?.(event);\n\t\t\t}}\n\t\t\t{...props}\n\t\t/>\n\t</Portal>\n));\nContent.displayName = \"DropdownMenuContent\";\n\n/**\n * An item in the dropdown menu.\n *\n * @see https://mantle.ngrok.com/components/dropdown-menu#dropdownmenuitem\n *\n * @example\n * ```tsx\n * <DropdownMenu.Root>\n * <DropdownMenu.Trigger asChild>\n * <Button type=\"button\" appearance=\"outlined\">\n * Open Menu\n * </Button>\n * </DropdownMenu.Trigger>\n * <DropdownMenu.Content>\n * <DropdownMenu.Item>Item 1</DropdownMenu.Item>\n * <DropdownMenu.Item>Item 2</DropdownMenu.Item>\n * </DropdownMenu.Content>\n * </DropdownMenu.Root>\n * ```\n */\nconst Item = forwardRef<\n\tComponentRef<typeof DropdownMenuPrimitive.Item>,\n\tComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Item> & {\n\t\tinset?: boolean;\n\t}\n>(({ className, inset, ...props }, ref) => (\n\t<DropdownMenuPrimitive.Item\n\t\tref={ref}\n\t\tdata-slot=\"dropdown-menu-item\"\n\t\tclassName={cx(\n\t\t\t\"relative flex cursor-pointer select-none items-center rounded-md px-2 py-1.5 text-strong text-sm font-normal outline-hidden transition-colors\",\n\t\t\t\"data-highlighted:bg-active-menu-item\",\n\t\t\t\"focus:bg-accent focus:text-accent-foreground\",\n\t\t\t\"data-disabled:cursor-default data-disabled:opacity-50\",\n\t\t\t\"[&>svg]:size-5 [&_svg]:shrink-0\",\n\t\t\tinset && \"pl-8\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t/>\n));\nItem.displayName = \"DropdownMenuItem\";\n\n/**\n * A menu item with a checkbox that can be controlled or uncontrolled.\n *\n * @see https://mantle.ngrok.com/components/dropdown-menu#dropdownmenucheckboxitem\n */\nconst CheckboxItem = forwardRef<\n\tComponentRef<typeof DropdownMenuPrimitive.CheckboxItem>,\n\tComponentPropsWithoutRef<typeof DropdownMenuPrimitive.CheckboxItem>\n>(({ className, children, checked, ...props }, ref) => (\n\t<DropdownMenuPrimitive.CheckboxItem\n\t\tref={ref}\n\t\tdata-slot=\"dropdown-menu-checkbox-item\"\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-md py-1.5 pl-2 pr-9 text-sm font-normal outline-hidden\",\n\t\t\t\"data-highlighted:bg-active-menu-item\",\n\t\t\t\"aria-checked:bg-selected-menu-item\",\n\t\t\t\"data-highlighted:aria-checked:bg-active-selected-menu-item!\",\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 text-accent-600\" />\n\t\t\t</DropdownMenuPrimitive.ItemIndicator>\n\t\t</span>\n\t\t{children}\n\t</DropdownMenuPrimitive.CheckboxItem>\n));\nCheckboxItem.displayName = \"DropdownMenuCheckboxItem\";\n\ntype DropdownMenuRadioItemProps = ComponentPropsWithoutRef<\n\ttypeof DropdownMenuPrimitive.RadioItem\n> & {\n\tname?: string;\n\tid?: string;\n};\n\n/**\n * A menu item with a radio button that can be controlled or uncontrolled.\n * Used within a RadioGroup to create a set of mutually exclusive options.\n *\n * @see https://mantle.ngrok.com/components/dropdown-menu#dropdownmenuradioitem\n */\nconst RadioItem = forwardRef<ComponentRef<\"input\">, DropdownMenuRadioItemProps>(\n\t({ className, children, ...props }, ref) => (\n\t\t<DropdownMenuPrimitive.RadioItem\n\t\t\tdata-slot=\"dropdown-menu-radio-item\"\n\t\t\tclassName={cx(\n\t\t\t\t\"group/dropdown-menu-radio-item\",\n\t\t\t\t\"text-strong data-disabled:pointer-events-none data-disabled:opacity-50 relative flex cursor-pointer select-none items-center gap-2 rounded-md py-1.5 px-2 text-sm font-normal outline-none\",\n\t\t\t\t\"data-highlighted:bg-active-menu-item\",\n\t\t\t\t\"aria-checked:bg-selected-menu-item aria-checked:pr-9\",\n\t\t\t\t\"data-highlighted:aria-checked:bg-active-selected-menu-item!\",\n\t\t\t\t\"[&>svg]:size-5 [&_svg]:shrink-0\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\tref={ref}\n\t\t\t{...props}\n\t\t>\n\t\t\t<span className=\"absolute right-2 items-center hidden group-aria-checked/dropdown-menu-radio-item:flex\">\n\t\t\t\t<DropdownMenuPrimitive.ItemIndicator>\n\t\t\t\t\t<Icon svg={<CheckIcon weight=\"bold\" />} className=\"size-4 text-accent-600\" />\n\t\t\t\t</DropdownMenuPrimitive.ItemIndicator>\n\t\t\t</span>\n\t\t\t{children}\n\t\t</DropdownMenuPrimitive.RadioItem>\n\t),\n);\nRadioItem.displayName = \"DropdownMenuRadioItem\";\n\n/**\n * A label for a group of dropdown menu items.\n *\n * @see https://mantle.ngrok.com/components/dropdown-menu#dropdownmenulabel\n */\nconst Label = forwardRef<\n\tComponentRef<typeof DropdownMenuPrimitive.Label>,\n\tComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Label> & {\n\t\tinset?: boolean;\n\t}\n>(({ className, inset, ...props }, ref) => (\n\t<DropdownMenuPrimitive.Label\n\t\tref={ref}\n\t\tdata-slot=\"dropdown-menu-label\"\n\t\tclassName={cx(\"px-2 py-1.5 text-sm font-medium\", inset && \"pl-8\", className)}\n\t\t{...props}\n\t/>\n));\nLabel.displayName = \"DropdownMenuLabel\";\n\n/**\n * A visual separator between dropdown menu items or groups.\n *\n * @see https://mantle.ngrok.com/components/dropdown-menu#dropdownmenuseparator\n */\nconst DropdownSeparator = forwardRef<\n\tComponentRef<typeof Separator>,\n\tComponentPropsWithoutRef<typeof Separator>\n>(({ className, ...props }, ref) => (\n\t<Separator\n\t\tref={ref}\n\t\tdata-slot=\"dropdown-menu-separator\"\n\t\tclassName={cx(\"-mx-1.25 my-1 w-auto\", className)}\n\t\t{...props}\n\t/>\n));\nDropdownSeparator.displayName = \"DropdownMenuSeparator\";\n\nconst Shortcut = ({ className, ...props }: ComponentProps<\"span\">) => {\n\treturn (\n\t\t<span\n\t\t\tdata-slot=\"dropdown-menu-shortcut\"\n\t\t\tclassName={cx(\"ml-auto text-xs tracking-widest opacity-60\", className)}\n\t\t\t{...props}\n\t\t/>\n\t);\n};\nShortcut.displayName = \"DropdownMenuShortcut\";\n\n/**\n * A menu of options or actions, triggered by a button.\n *\n * @see https://mantle.ngrok.com/components/dropdown-menu\n *\n * @example\n * Composition:\n * ```\n * DropdownMenu.Root\n * ├── DropdownMenu.Trigger\n * └── DropdownMenu.Content\n * ├── DropdownMenu.Group\n * │ ├── DropdownMenu.Label\n * │ ├── DropdownMenu.Item\n * │ │ └── DropdownMenu.Shortcut\n * │ ├── DropdownMenu.CheckboxItem\n * │ └── DropdownMenu.RadioGroup\n * │ └── DropdownMenu.RadioItem\n * ├── DropdownMenu.Separator\n * └── DropdownMenu.Sub\n * ├── DropdownMenu.SubTrigger\n * └── DropdownMenu.SubContent\n * ```\n *\n * @example\n * ```tsx\n * <DropdownMenu.Root>\n * <DropdownMenu.Trigger asChild>\n * <Button type=\"button\" appearance=\"outlined\">\n * Open Menu\n * </Button>\n * </DropdownMenu.Trigger>\n * <DropdownMenu.Content>\n * <DropdownMenu.Item>Item 1</DropdownMenu.Item>\n * <DropdownMenu.Item>Item 2</DropdownMenu.Item>\n * </DropdownMenu.Content>\n * </DropdownMenu.Root>\n * ```\n */\nconst DropdownMenu = {\n\t/**\n\t * The root, stateful component that manages the open/closed state of the dropdown menu.\n\t *\n\t * @see https://mantle.ngrok.com/components/dropdown-menu#dropdownmenuroot\n\t *\n\t * @example\n\t * ```tsx\n\t * <DropdownMenu.Root>\n\t * <DropdownMenu.Trigger asChild>\n\t * <Button>Open Menu</Button>\n\t * </DropdownMenu.Trigger>\n\t * <DropdownMenu.Content>\n\t * <DropdownMenu.Item>Item 1</DropdownMenu.Item>\n\t * </DropdownMenu.Content>\n\t * </DropdownMenu.Root>\n\t * ```\n\t */\n\tRoot,\n\t/**\n\t * A checkbox item in the dropdown menu that can be toggled on and off.\n\t *\n\t * @see https://mantle.ngrok.com/components/dropdown-menu#dropdownmenucheckboxitem\n\t *\n\t * @example\n\t * ```tsx\n\t * <DropdownMenu.Root>\n\t * <DropdownMenu.Trigger>Open</DropdownMenu.Trigger>\n\t * <DropdownMenu.Content>\n\t * <DropdownMenu.CheckboxItem checked={true} onCheckedChange={setChecked}>\n\t * Show notifications\n\t * </DropdownMenu.CheckboxItem>\n\t * </DropdownMenu.Content>\n\t * </DropdownMenu.Root>\n\t * ```\n\t */\n\tCheckboxItem,\n\t/**\n\t * The container for the dropdown menu content. Appears in a portal with scrolling and animations.\n\t *\n\t * @see https://mantle.ngrok.com/components/dropdown-menu#dropdownmenucontent\n\t *\n\t * @example\n\t * ```tsx\n\t * <DropdownMenu.Root>\n\t * <DropdownMenu.Trigger>Open</DropdownMenu.Trigger>\n\t * <DropdownMenu.Content width=\"trigger\">\n\t * <DropdownMenu.Item>Edit</DropdownMenu.Item>\n\t * <DropdownMenu.Item>Delete</DropdownMenu.Item>\n\t * </DropdownMenu.Content>\n\t * </DropdownMenu.Root>\n\t * ```\n\t */\n\tContent,\n\t/**\n\t * A group container for organizing related dropdown menu items.\n\t *\n\t * @see https://mantle.ngrok.com/components/dropdown-menu#dropdownmenugroup\n\t *\n\t * @example\n\t * ```tsx\n\t * <DropdownMenu.Root>\n\t * <DropdownMenu.Trigger>Open</DropdownMenu.Trigger>\n\t * <DropdownMenu.Content>\n\t * <DropdownMenu.Group>\n\t * <DropdownMenu.Label>Account</DropdownMenu.Label>\n\t * <DropdownMenu.Item>Profile</DropdownMenu.Item>\n\t * <DropdownMenu.Item>Settings</DropdownMenu.Item>\n\t * </DropdownMenu.Group>\n\t * </DropdownMenu.Content>\n\t * </DropdownMenu.Root>\n\t * ```\n\t */\n\tGroup,\n\t/**\n\t * A standard item in the dropdown menu that can be selected or activated.\n\t *\n\t * @see https://mantle.ngrok.com/components/dropdown-menu#dropdownmenuitem\n\t *\n\t * @example\n\t * ```tsx\n\t * <DropdownMenu.Root>\n\t * <DropdownMenu.Trigger>Open</DropdownMenu.Trigger>\n\t * <DropdownMenu.Content>\n\t * <DropdownMenu.Item onSelect={() => handleEdit()}>\n\t * Edit\n\t * </DropdownMenu.Item>\n\t * <DropdownMenu.Item disabled>\n\t * Delete\n\t * </DropdownMenu.Item>\n\t * </DropdownMenu.Content>\n\t * </DropdownMenu.Root>\n\t * ```\n\t */\n\tItem,\n\t/**\n\t * A label for grouping and describing sections within the dropdown menu.\n\t *\n\t * @see https://mantle.ngrok.com/components/dropdown-menu#dropdownmenulabel\n\t *\n\t * @example\n\t * ```tsx\n\t * <DropdownMenu.Root>\n\t * <DropdownMenu.Trigger>Open</DropdownMenu.Trigger>\n\t * <DropdownMenu.Content>\n\t * <DropdownMenu.Label>My Account</DropdownMenu.Label>\n\t * <DropdownMenu.Item>Profile</DropdownMenu.Item>\n\t * <DropdownMenu.Item>Settings</DropdownMenu.Item>\n\t * </DropdownMenu.Content>\n\t * </DropdownMenu.Root>\n\t * ```\n\t */\n\tLabel,\n\t/**\n\t * A radio group container for exclusive selection within the dropdown menu.\n\t *\n\t * @see https://mantle.ngrok.com/components/dropdown-menu#dropdownmenuradiogroup\n\t *\n\t * @example\n\t * ```tsx\n\t * <DropdownMenu.Root>\n\t * <DropdownMenu.Trigger>Open</DropdownMenu.Trigger>\n\t * <DropdownMenu.Content>\n\t * <DropdownMenu.RadioGroup value={value} onValueChange={setValue}>\n\t * <DropdownMenu.RadioItem value=\"option1\">Option 1</DropdownMenu.RadioItem>\n\t * <DropdownMenu.RadioItem value=\"option2\">Option 2</DropdownMenu.RadioItem>\n\t * </DropdownMenu.RadioGroup>\n\t * </DropdownMenu.Content>\n\t * </DropdownMenu.Root>\n\t * ```\n\t */\n\tRadioGroup,\n\t/**\n\t * A radio item in the dropdown menu where only one item in the group can be selected.\n\t *\n\t * @see https://mantle.ngrok.com/components/dropdown-menu#dropdownmenuradioitem\n\t *\n\t * @example\n\t * ```tsx\n\t * <DropdownMenu.Root>\n\t * <DropdownMenu.Trigger>Open</DropdownMenu.Trigger>\n\t * <DropdownMenu.Content>\n\t * <DropdownMenu.RadioGroup value=\"small\" onValueChange={setSize}>\n\t * <DropdownMenu.RadioItem value=\"small\">Small</DropdownMenu.RadioItem>\n\t * <DropdownMenu.RadioItem value=\"medium\">Medium</DropdownMenu.RadioItem>\n\t * <DropdownMenu.RadioItem value=\"large\">Large</DropdownMenu.RadioItem>\n\t * </DropdownMenu.RadioGroup>\n\t * </DropdownMenu.Content>\n\t * </DropdownMenu.Root>\n\t * ```\n\t */\n\tRadioItem,\n\t/**\n\t * A visual separator for dividing sections within the dropdown menu.\n\t *\n\t * @see https://mantle.ngrok.com/components/dropdown-menu#dropdownmenuseparator\n\t *\n\t * @example\n\t * ```tsx\n\t * <DropdownMenu.Root>\n\t * <DropdownMenu.Trigger>Open</DropdownMenu.Trigger>\n\t * <DropdownMenu.Content>\n\t * <DropdownMenu.Item>Edit</DropdownMenu.Item>\n\t * <DropdownMenu.Item>Copy</DropdownMenu.Item>\n\t * <DropdownMenu.Separator />\n\t * <DropdownMenu.Item>Delete</DropdownMenu.Item>\n\t * </DropdownMenu.Content>\n\t * </DropdownMenu.Root>\n\t * ```\n\t */\n\tSeparator: DropdownSeparator,\n\t/**\n\t * A keyboard shortcut indicator for dropdown menu items.\n\t *\n\t * @see https://mantle.ngrok.com/components/dropdown-menu#dropdownmenushortcut\n\t *\n\t * @example\n\t * ```tsx\n\t * <DropdownMenu.Root>\n\t * <DropdownMenu.Trigger>Open</DropdownMenu.Trigger>\n\t * <DropdownMenu.Content>\n\t * <DropdownMenu.Item>\n\t * Save\n\t * <DropdownMenu.Shortcut>⌘S</DropdownMenu.Shortcut>\n\t * </DropdownMenu.Item>\n\t * </DropdownMenu.Content>\n\t * </DropdownMenu.Root>\n\t * ```\n\t */\n\tShortcut,\n\t/**\n\t * A submenu container for creating nested dropdown menus.\n\t *\n\t * @see https://mantle.ngrok.com/components/dropdown-menu#dropdownmenusub\n\t *\n\t * @example\n\t * ```tsx\n\t * <DropdownMenu.Root>\n\t * <DropdownMenu.Trigger>Open</DropdownMenu.Trigger>\n\t * <DropdownMenu.Content>\n\t * <DropdownMenu.Sub>\n\t * <DropdownMenu.SubTrigger>More options</DropdownMenu.SubTrigger>\n\t * <DropdownMenu.SubContent>\n\t * <DropdownMenu.Item>Sub item 1</DropdownMenu.Item>\n\t * <DropdownMenu.Item>Sub item 2</DropdownMenu.Item>\n\t * </DropdownMenu.SubContent>\n\t * </DropdownMenu.Sub>\n\t * </DropdownMenu.Content>\n\t * </DropdownMenu.Root>\n\t * ```\n\t */\n\tSub,\n\t/**\n\t * The content container for submenu items.\n\t *\n\t * @see https://mantle.ngrok.com/components/dropdown-menu#dropdownmenusubcontent\n\t *\n\t * @example\n\t * ```tsx\n\t * <DropdownMenu.Root>\n\t * <DropdownMenu.Trigger>Open</DropdownMenu.Trigger>\n\t * <DropdownMenu.Content>\n\t * <DropdownMenu.Sub>\n\t * <DropdownMenu.SubTrigger>Export</DropdownMenu.SubTrigger>\n\t * <DropdownMenu.SubContent>\n\t * <DropdownMenu.Item>Export as PDF</DropdownMenu.Item>\n\t * <DropdownMenu.Item>Export as CSV</DropdownMenu.Item>\n\t * </DropdownMenu.SubContent>\n\t * </DropdownMenu.Sub>\n\t * </DropdownMenu.Content>\n\t * </DropdownMenu.Root>\n\t * ```\n\t */\n\tSubContent,\n\t/**\n\t * The trigger item that opens a submenu when hovered or focused.\n\t *\n\t * @see https://mantle.ngrok.com/components/dropdown-menu#dropdownmenusubtrigger\n\t *\n\t * @example\n\t * ```tsx\n\t * <DropdownMenu.Root>\n\t * <DropdownMenu.Trigger>Open</DropdownMenu.Trigger>\n\t * <DropdownMenu.Content>\n\t * <DropdownMenu.Sub>\n\t * <DropdownMenu.SubTrigger>Share</DropdownMenu.SubTrigger>\n\t * <DropdownMenu.SubContent>\n\t * <DropdownMenu.Item>Email</DropdownMenu.Item>\n\t * <DropdownMenu.Item>Copy link</DropdownMenu.Item>\n\t * </DropdownMenu.SubContent>\n\t * </DropdownMenu.Sub>\n\t * </DropdownMenu.Content>\n\t * </DropdownMenu.Root>\n\t * ```\n\t */\n\tSubTrigger,\n\t/**\n\t * The trigger button that opens the dropdown menu.\n\t *\n\t * @see https://mantle.ngrok.com/components/dropdown-menu#dropdownmenutrigger\n\t *\n\t * @example\n\t * ```tsx\n\t * <DropdownMenu.Root>\n\t * <DropdownMenu.Trigger asChild>\n\t * <Button type=\"button\" appearance=\"outlined\">\n\t * Open Menu\n\t * </Button>\n\t * </DropdownMenu.Trigger>\n\t * <DropdownMenu.Content>\n\t * <DropdownMenu.Item>Item 1</DropdownMenu.Item>\n\t * </DropdownMenu.Content>\n\t * </DropdownMenu.Root>\n\t * ```\n\t */\n\tTrigger,\n} as const;\n\nexport {\n\t//,\n\tDropdownMenu,\n};\n"],"mappings":"6WA8BA,MAAM,EAAO,EAAsB,KACnC,EAAK,YAAc,eAqBnB,MAAM,EAAU,GAGb,EAAO,IACT,EAAC,EAAsB,QAAvB,CAAoC,MAAK,YAAU,wBAAwB,GAAI,EAAS,CAAA,CACvF,CACF,EAAQ,YAAc,sBAEtB,MAAM,EAAQ,GAGX,CAAE,YAAW,GAAG,GAAS,IAC3B,EAAC,EAAsB,MAAvB,CACM,MACL,YAAU,sBACV,UAAW,EAAG,aAAc,EAAU,CACtC,GAAI,EACH,CAAA,CACD,CACF,EAAM,YAAc,oBAKpB,MAAM,EAAS,EAAsB,OACrC,EAAO,YAAc,qBAErB,MAAM,EAAM,EAAsB,IAClC,EAAI,YAAc,kBAElB,MAAM,EAAa,GAGhB,CAAE,YAAW,GAAG,GAAS,IAC3B,EAAC,EAAsB,WAAvB,CACM,MACL,YAAU,4BACV,UAAW,EAAG,aAAc,EAAU,CACtC,GAAI,EACH,CAAA,CACD,CACF,EAAW,YAAc,yBAOzB,MAAM,EAAa,GAKhB,CAAE,YAAW,QAAO,WAAU,GAAG,GAAS,IAC5C,EAAC,EAAsB,WAAvB,CACC,YAAU,4BACV,UAAW,EACV,sIACA,2EACA,kCACA,GAAS,OACT,EACA,CACI,MACL,GAAI,WAVL,CAYE,EACD,EAAC,OAAD,CAAM,UAAU,8CACf,EAAC,EAAD,CAAM,IAAK,EAAC,EAAD,CAAgB,OAAO,OAAS,CAAA,CAAE,UAAU,SAAW,CAAA,CAC5D,CAAA,CAC2B,GAClC,CACF,EAAW,YAAc,yBAOzB,MAAM,EAAa,GAGhB,CAAE,YAAW,OAAO,GAAM,GAAG,GAAS,IACxC,EAAC,EAAD,CAAA,SACC,EAAC,EAAsB,WAAvB,CACC,YAAU,4BACV,UAAW,EACV,YACA,ucACA,4FACA,EACA,CACK,OACD,MACL,GAAI,EACH,CAAA,CACM,CAAA,CACR,CACF,EAAW,YAAc,yBA6BzB,MAAM,EAAU,GAGb,CAAE,YAAW,UAAS,OAAO,GAAM,QAAO,GAAG,GAAS,IACxD,EAAC,EAAD,CAAA,SACC,EAAC,EAAsB,QAAvB,CACM,MACL,YAAU,wBACV,UAAW,EACV,YACA,yJACA,+TACA,4FACA,IAAU,WAAa,0CACvB,EACA,CACK,OACN,QAAU,GAAU,CAKnB,EAAM,iBAAiB,CACvB,IAAU,EAAM,EAEjB,GAAI,EACH,CAAA,CACM,CAAA,CACR,CACF,EAAQ,YAAc,sBAsBtB,MAAM,EAAO,GAKV,CAAE,YAAW,QAAO,GAAG,GAAS,IAClC,EAAC,EAAsB,KAAvB,CACM,MACL,YAAU,qBACV,UAAW,EACV,gJACA,uCACA,+CACA,wDACA,kCACA,GAAS,OACT,EACA,CACD,GAAI,EACH,CAAA,CACD,CACF,EAAK,YAAc,mBAOnB,MAAM,EAAe,GAGlB,CAAE,YAAW,WAAU,UAAS,GAAG,GAAS,IAC9C,EAAC,EAAsB,aAAvB,CACM,MACL,YAAU,8BACV,UAAW,EACV,oMACA,uCACA,qCACA,8DACA,kCACA,EACA,CACQ,UACT,GAAI,WAZL,CAcC,EAAC,OAAD,CAAM,UAAU,8CACf,EAAC,EAAsB,cAAvB,CAAA,SACC,EAAC,EAAD,CAAM,IAAK,EAAC,EAAD,CAAW,OAAO,OAAS,CAAA,CAAE,UAAU,yBAA2B,CAAA,CACxC,CAAA,CAChC,CAAA,CACN,EACmC,GACpC,CACF,EAAa,YAAc,2BAe3B,MAAM,EAAY,GAChB,CAAE,YAAW,WAAU,GAAG,GAAS,IACnC,EAAC,EAAsB,UAAvB,CACC,YAAU,2BACV,UAAW,EACV,iCACA,6LACA,uCACA,uDACA,8DACA,kCACA,EACA,CACI,MACL,GAAI,WAZL,CAcC,EAAC,OAAD,CAAM,UAAU,iGACf,EAAC,EAAsB,cAAvB,CAAA,SACC,EAAC,EAAD,CAAM,IAAK,EAAC,EAAD,CAAW,OAAO,OAAS,CAAA,CAAE,UAAU,yBAA2B,CAAA,CACxC,CAAA,CAChC,CAAA,CACN,EACgC,GAEnC,CACD,EAAU,YAAc,wBAOxB,MAAM,EAAQ,GAKX,CAAE,YAAW,QAAO,GAAG,GAAS,IAClC,EAAC,EAAsB,MAAvB,CACM,MACL,YAAU,sBACV,UAAW,EAAG,kCAAmC,GAAS,OAAQ,EAAU,CAC5E,GAAI,EACH,CAAA,CACD,CACF,EAAM,YAAc,oBAOpB,MAAM,EAAoB,GAGvB,CAAE,YAAW,GAAG,GAAS,IAC3B,EAAC,EAAD,CACM,MACL,YAAU,0BACV,UAAW,EAAG,uBAAwB,EAAU,CAChD,GAAI,EACH,CAAA,CACD,CACF,EAAkB,YAAc,wBAEhC,MAAM,GAAY,CAAE,YAAW,GAAG,KAEhC,EAAC,OAAD,CACC,YAAU,yBACV,UAAW,EAAG,6CAA8C,EAAU,CACtE,GAAI,EACH,CAAA,CAGJ,EAAS,YAAc,uBAyCvB,MAAM,EAAe,CAkBpB,OAkBA,eAiBA,UAoBA,QAqBA,OAkBA,QAmBA,aAoBA,YAmBA,UAAW,EAmBX,WAsBA,MAsBA,aAsBA,aAoBA,UACA"}
@@ -1,2 +1,2 @@
1
- import { t as DropdownMenu } from "./dropdown-menu-C9f9Y8Ov.js";
1
+ import { t as DropdownMenu } from "./dropdown-menu-CzUNYIfA.js";
2
2
  export { DropdownMenu };
@@ -1 +1 @@
1
- import{t as e}from"./dropdown-menu-Ff97BIJe.js";export{e as DropdownMenu};
1
+ import{t as e}from"./dropdown-menu-Ducs2SEn.js";export{e as DropdownMenu};
package/dist/empty.d.ts CHANGED
@@ -1,5 +1,5 @@
1
- import { t as SvgAttributes } from "./types-DEYyl5LX.js";
2
- import { t as WithAsChild } from "./as-child-CJ2vTesV.js";
1
+ import { t as SvgAttributes } from "./types-DoV0R5Ja.js";
2
+ import { t as WithAsChild } from "./as-child-DQHfEmYB.js";
3
3
  import { ComponentProps, HTMLAttributes, ReactNode } from "react";
4
4
  import * as _$react_jsx_runtime0 from "react/jsx-runtime";
5
5
 
package/dist/hooks.d.ts CHANGED
@@ -1,4 +1,4 @@
1
- import { n as MarginType, o as useComposedRefs } from "./in-view-DsiWfQpY.js";
1
+ import { n as MarginType, o as useComposedRefs, s as copyToClipboard } from "./in-view-Da08Bx6l.js";
2
2
  import { RefObject, useEffect } from "react";
3
3
 
4
4
  //#region src/hooks/use-breakpoint.d.ts
@@ -117,15 +117,14 @@ declare function useCallbackRef<T extends (...args: unknown[]) => unknown>(callb
117
117
  //#endregion
118
118
  //#region src/hooks/use-copy-to-clipboard.d.ts
119
119
  /**
120
- * A hook that allows you to copy a string to the clipboard.
120
+ * A hook that returns an async function to copy a string to the clipboard.
121
121
  *
122
- * The returned `copyToClipboard` function is async `await` it to know
123
- * whether the write succeeded. It throws when both the Clipboard API and
124
- * the `execCommand` polyfill fail.
122
+ * `await` the returned function to know whether the write succeeded. It
123
+ * throws when both the Clipboard API and the `execCommand` polyfill fail.
125
124
  *
126
125
  * Inspired by: https://usehooks.com/usecopytoclipboard
127
126
  */
128
- declare function useCopyToClipboard(): readonly [string, (value: string) => Promise<void>];
127
+ declare function useCopyToClipboard(): typeof copyToClipboard;
129
128
  //#endregion
130
129
  //#region src/hooks/use-debounced-callback.d.ts
131
130
  type Options = {
package/dist/hooks.js CHANGED
@@ -1,2 +1,2 @@
1
- import{t as e}from"./use-matches-media-query-CojcYxlA.js";import{r as t}from"./browser-only-QPyyfLaB.js";import{n}from"./compose-refs-DFIaEnQH.js";import{t as r}from"./use-copy-to-clipboard-Ds9MsSNU.js";import{n as i,t as a}from"./use-prefers-reduced-motion-BcwST13S.js";import{t as o}from"./in-view-BXzPPdcl.js";import{useCallback as s,useEffect as c,useLayoutEffect as l,useMemo as u,useReducer as d,useRef as f,useState as p,useSyncExternalStore as m}from"react";const h=[`2xl`,`xl`,`lg`,`md`,`sm`,`xs`,`2xs`],g=[`default`,...h];function _(){return m(j,M,()=>`default`)}function v(e){return m(P(e),I(e),()=>!1)}const y={"2xl":`(min-width: 96rem)`,xl:`(min-width: 80rem)`,lg:`(min-width: 64rem)`,md:`(min-width: 48rem)`,sm:`(min-width: 40rem)`,xs:`(min-width: 30rem)`,"2xs":`(min-width: 22.5rem)`},b={"2xl":`(max-width: 95.99rem)`,xl:`(max-width: 79.99rem)`,lg:`(max-width: 63.99rem)`,md:`(max-width: 47.99rem)`,sm:`(max-width: 39.99rem)`,xs:`(max-width: 29.99rem)`,"2xs":`(max-width: 22.49rem)`};let x=null,S=null;function C(){return x||={"2xl":window.matchMedia(y[`2xl`]),xl:window.matchMedia(y.xl),lg:window.matchMedia(y.lg),md:window.matchMedia(y.md),sm:window.matchMedia(y.sm),xs:window.matchMedia(y.xs),"2xs":window.matchMedia(y[`2xs`])},x}function w(e){return S||={"2xl":window.matchMedia(b[`2xl`]),xl:window.matchMedia(b.xl),lg:window.matchMedia(b.lg),md:window.matchMedia(b.md),sm:window.matchMedia(b.sm),xs:window.matchMedia(b.xs),"2xs":window.matchMedia(b[`2xs`])},S[e]}let T=`default`;const E=new Set;let D=!1;function O(){let e=C();for(let t of h)if(e[t].matches)return t;return`default`}let k=!1;function A(){k||(k=!0,requestAnimationFrame(()=>{k=!1;let e=O();if(e!==T){T=e;for(let e of E)e()}}))}function j(e){if(E.add(e),!D){D=!0;let e=C();T=O();for(let t of Object.values(e))t.addEventListener(`change`,A)}return e(),()=>{if(E.delete(e),E.size===0&&D){D=!1;let e=C();for(let t of Object.values(e))t.removeEventListener(`change`,A)}}}function M(){return T}const N=new Map;function P(e){let t=N.get(e);return t||(t=t=>{let n=w(e),r=!1,i=()=>{r||(r=!0,requestAnimationFrame(()=>{r=!1,t()}))};return n.addEventListener(`change`,i),()=>{n.removeEventListener(`change`,i)}},N.set(e,t),t)}const F=new Map;function I(e){let t=F.get(e);return t||(t=()=>w(e).matches,F.set(e,t),t)}function L(e){let t=f(e);return c(()=>{t.current=e}),u(()=>((...e)=>t.current?.(...e)),[])}function R(e,t){let n=L(e),r=f(0);return c(()=>()=>window.clearTimeout(r.current),[]),s((...e)=>{window.clearTimeout(r.current),r.current=window.setTimeout(()=>n(...e),t.waitMs)},[n,t.waitMs])}const z=typeof window<`u`?l:c,B=(e=`mantle`)=>u(()=>V(e),[e]);function V(e=`mantle`){return[e.trim()||`mantle`,H()].join(`-`)}function H(){return Math.random().toString(36).substring(2,9)}function U(){let e=i();return u(()=>e?`auto`:`smooth`,[e])}function W(e,{root:t,margin:n,amount:r,once:i=!1,initial:a=!1}={}){let[s,l]=p(a);return c(()=>{if(!e.current||i&&s)return;function a(){return l(!0),i?void 0:()=>l(!1)}let c={root:t&&t.current||void 0,margin:n,amount:r};return o(e.current,a,c)},[t,e,n,i,r]),s}function G(e,t){switch(t.type){case`push`:return{undoStack:[...e.undoStack,t.snapshot],redoStack:[]};case`undo`:{if(e.undoStack.length===0)return e;let n=e.undoStack.slice(0,-1);return e.undoStack[e.undoStack.length-1]===void 0?e:{undoStack:n,redoStack:[...e.redoStack,t.current]}}case`redo`:{if(e.redoStack.length===0)return e;let n=e.redoStack.slice(0,-1);return e.redoStack[e.redoStack.length-1]===void 0?e:{undoStack:[...e.undoStack,t.current],redoStack:n}}}}function K(){let[e,t]=d(G,{undoStack:[],redoStack:[]}),n=s(e=>{t({type:`push`,snapshot:e})},[]),r=s(n=>{let r=e.undoStack[e.undoStack.length-1];if(r!==void 0)return t({type:`undo`,current:n}),r},[e.undoStack]),i=s(n=>{let r=e.redoStack[e.redoStack.length-1];if(r!==void 0)return t({type:`redo`,current:n}),r},[e.redoStack]);return u(()=>({canUndo:e.undoStack.length>0,canRedo:e.redoStack.length>0,push:n,undo:r,redo:i}),[e.undoStack.length,e.redoStack.length,n,r,i])}export{g as breakpoints,a as getPrefersReducedMotion,_ as useBreakpoint,L as useCallbackRef,n as useComposedRefs,r as useCopyToClipboard,R as useDebouncedCallback,W as useInView,v as useIsBelowBreakpoint,t as useIsHydrated,z as useIsomorphicLayoutEffect,e as useMatchesMediaQuery,i as usePrefersReducedMotion,B as useRandomStableId,U as useScrollBehavior,K as useUndoRedo};
1
+ import{t as e}from"./use-matches-media-query-CojcYxlA.js";import{r as t}from"./browser-only-QPyyfLaB.js";import{n}from"./compose-refs-DZ3cPi47.js";import{t as r}from"./use-copy-to-clipboard-C7vsjJe-.js";import{n as i,t as a}from"./use-prefers-reduced-motion-aXfsyo-k.js";import{t as o}from"./in-view-pia_SVdE.js";import{useCallback as s,useEffect as c,useLayoutEffect as l,useMemo as u,useReducer as d,useRef as f,useState as p,useSyncExternalStore as m}from"react";const h=[`2xl`,`xl`,`lg`,`md`,`sm`,`xs`,`2xs`],g=[`default`,...h];function _(){return m(j,M,()=>`default`)}function v(e){return m(P(e),I(e),()=>!1)}const y={"2xl":`(min-width: 96rem)`,xl:`(min-width: 80rem)`,lg:`(min-width: 64rem)`,md:`(min-width: 48rem)`,sm:`(min-width: 40rem)`,xs:`(min-width: 30rem)`,"2xs":`(min-width: 22.5rem)`},b={"2xl":`(max-width: 95.99rem)`,xl:`(max-width: 79.99rem)`,lg:`(max-width: 63.99rem)`,md:`(max-width: 47.99rem)`,sm:`(max-width: 39.99rem)`,xs:`(max-width: 29.99rem)`,"2xs":`(max-width: 22.49rem)`};let x=null,S=null;function C(){return x||={"2xl":window.matchMedia(y[`2xl`]),xl:window.matchMedia(y.xl),lg:window.matchMedia(y.lg),md:window.matchMedia(y.md),sm:window.matchMedia(y.sm),xs:window.matchMedia(y.xs),"2xs":window.matchMedia(y[`2xs`])},x}function w(e){return S||={"2xl":window.matchMedia(b[`2xl`]),xl:window.matchMedia(b.xl),lg:window.matchMedia(b.lg),md:window.matchMedia(b.md),sm:window.matchMedia(b.sm),xs:window.matchMedia(b.xs),"2xs":window.matchMedia(b[`2xs`])},S[e]}let T=`default`;const E=new Set;let D=!1;function O(){let e=C();for(let t of h)if(e[t].matches)return t;return`default`}let k=!1;function A(){k||(k=!0,requestAnimationFrame(()=>{k=!1;let e=O();if(e!==T){T=e;for(let e of E)e()}}))}function j(e){if(E.add(e),!D){D=!0;let e=C();T=O();for(let t of Object.values(e))t.addEventListener(`change`,A)}return e(),()=>{if(E.delete(e),E.size===0&&D){D=!1;let e=C();for(let t of Object.values(e))t.removeEventListener(`change`,A)}}}function M(){return T}const N=new Map;function P(e){let t=N.get(e);return t||(t=t=>{let n=w(e),r=!1,i=()=>{r||(r=!0,requestAnimationFrame(()=>{r=!1,t()}))};return n.addEventListener(`change`,i),()=>{n.removeEventListener(`change`,i)}},N.set(e,t),t)}const F=new Map;function I(e){let t=F.get(e);return t||(t=()=>w(e).matches,F.set(e,t),t)}function L(e){let t=f(e);return c(()=>{t.current=e}),u(()=>((...e)=>t.current?.(...e)),[])}function R(e,t){let n=L(e),r=f(0);return c(()=>()=>window.clearTimeout(r.current),[]),s((...e)=>{window.clearTimeout(r.current),r.current=window.setTimeout(()=>n(...e),t.waitMs)},[n,t.waitMs])}const z=typeof window<`u`?l:c,B=(e=`mantle`)=>u(()=>V(e),[e]);function V(e=`mantle`){return[e.trim()||`mantle`,H()].join(`-`)}function H(){return Math.random().toString(36).substring(2,9)}function U(){let e=i();return u(()=>e?`auto`:`smooth`,[e])}function W(e,{root:t,margin:n,amount:r,once:i=!1,initial:a=!1}={}){let[s,l]=p(a);return c(()=>{if(!e.current||i&&s)return;function a(){return l(!0),i?void 0:()=>l(!1)}let c={root:t&&t.current||void 0,margin:n,amount:r};return o(e.current,a,c)},[t,e,n,i,r]),s}function G(e,t){switch(t.type){case`push`:return{undoStack:[...e.undoStack,t.snapshot],redoStack:[]};case`undo`:{if(e.undoStack.length===0)return e;let n=e.undoStack.slice(0,-1);return e.undoStack[e.undoStack.length-1]===void 0?e:{undoStack:n,redoStack:[...e.redoStack,t.current]}}case`redo`:{if(e.redoStack.length===0)return e;let n=e.redoStack.slice(0,-1);return e.redoStack[e.redoStack.length-1]===void 0?e:{undoStack:[...e.undoStack,t.current],redoStack:n}}}}function K(){let[e,t]=d(G,{undoStack:[],redoStack:[]}),n=s(e=>{t({type:`push`,snapshot:e})},[]),r=s(n=>{let r=e.undoStack[e.undoStack.length-1];if(r!==void 0)return t({type:`undo`,current:n}),r},[e.undoStack]),i=s(n=>{let r=e.redoStack[e.redoStack.length-1];if(r!==void 0)return t({type:`redo`,current:n}),r},[e.redoStack]);return u(()=>({canUndo:e.undoStack.length>0,canRedo:e.redoStack.length>0,push:n,undo:r,redo:i}),[e.undoStack.length,e.redoStack.length,n,r,i])}export{g as breakpoints,a as getPrefersReducedMotion,_ as useBreakpoint,L as useCallbackRef,n as useComposedRefs,r as useCopyToClipboard,R as useDebouncedCallback,W as useInView,v as useIsBelowBreakpoint,t as useIsHydrated,z as useIsomorphicLayoutEffect,e as useMatchesMediaQuery,i as usePrefersReducedMotion,B as useRandomStableId,U as useScrollBehavior,K as useUndoRedo};
2
2
  //# sourceMappingURL=hooks.js.map
@@ -1,4 +1,4 @@
1
- import { t as SvgAttributes } from "./types-DEYyl5LX.js";
1
+ import { t as SvgAttributes } from "./types-DoV0R5Ja.js";
2
2
  import * as _$react from "react";
3
3
  import { ReactNode } from "react";
4
4
 
@@ -24,4 +24,4 @@ type IconProps = Omit<SvgAttributes, "children"> & {
24
24
  declare const Icon: _$react.ForwardRefExoticComponent<Omit<IconProps, "ref"> & _$react.RefAttributes<SVGSVGElement>>;
25
25
  //#endregion
26
26
  export { IconProps as n, Icon as t };
27
- //# sourceMappingURL=icon-C0YAAaLZ.d.ts.map
27
+ //# sourceMappingURL=icon-DKMJm20j.d.ts.map
@@ -1,5 +1,5 @@
1
- import { t as WithAsChild } from "./as-child-CJ2vTesV.js";
2
- import { t as VariantProps } from "./variant-props-DszdagRm.js";
1
+ import { t as WithAsChild } from "./as-child-DQHfEmYB.js";
2
+ import { t as VariantProps } from "./variant-props-DUmSIQK8.js";
3
3
  import * as _$react from "react";
4
4
  import { ButtonHTMLAttributes, ReactNode } from "react";
5
5
  import * as _$class_variance_authority_types0 from "class-variance-authority/types";
@@ -95,4 +95,4 @@ type IconButtonProps = ButtonHTMLAttributes<HTMLButtonElement> & WithAsChild & I
95
95
  declare const IconButton: _$react.ForwardRefExoticComponent<IconButtonProps & _$react.RefAttributes<HTMLButtonElement>>;
96
96
  //#endregion
97
97
  export { IconButtonProps as n, IconButton as t };
98
- //# sourceMappingURL=icon-button-Cl30yTfu.d.ts.map
98
+ //# sourceMappingURL=icon-button-BnK4K7YK.d.ts.map
package/dist/icon.d.ts CHANGED
@@ -1,4 +1,4 @@
1
- import { t as SvgAttributes } from "./types-DEYyl5LX.js";
2
- import { n as IconProps, t as Icon } from "./icon-C0YAAaLZ.js";
3
- import { n as SvgOnlyProps, t as SvgOnly } from "./svg-only-BnnbLx6R.js";
1
+ import { t as SvgAttributes } from "./types-DoV0R5Ja.js";
2
+ import { n as IconProps, t as Icon } from "./icon-DKMJm20j.js";
3
+ import { n as SvgOnlyProps, t as SvgOnly } from "./svg-only-BtBvFy-N.js";
4
4
  export { Icon, type IconProps, type SvgAttributes, SvgOnly, type SvgOnlyProps };
package/dist/icons.d.ts CHANGED
@@ -1,6 +1,6 @@
1
- import { t as SvgAttributes } from "./types-DEYyl5LX.js";
2
- import { a as AlphanumericSortingDirection, c as TimeSortingDirection, o as SortingDirection, s as SortingMode } from "./direction-Jk7BkzGo.js";
3
- import { i as Theme } from "./themes-DXb8Tk74.js";
1
+ import { t as SvgAttributes } from "./types-DoV0R5Ja.js";
2
+ import { a as AlphanumericSortingDirection, c as TimeSortingDirection, o as SortingDirection, s as SortingMode } from "./direction-DtBAQn7p.js";
3
+ import { i as Theme } from "./themes-DIEYkvNl.js";
4
4
  import { ComponentProps } from "react";
5
5
  import * as _$react_jsx_runtime0 from "react/jsx-runtime";
6
6
 
package/dist/icons.js CHANGED
@@ -1,2 +1,2 @@
1
- import{s as e}from"./theme-provider-BFcnjeME.js";import{t}from"./traffic-policy-file-ChsoQtXQ.js";import{t as n}from"./sort-C_Jbs1dH.js";import{jsx as r}from"react/jsx-runtime";import{DesktopIcon as i}from"@phosphor-icons/react/Desktop";import{MoonIcon as a}from"@phosphor-icons/react/Moon";import{SunIcon as o}from"@phosphor-icons/react/Sun";function s(t){return r(c,{theme:e(),...t})}s.displayName=`AutoThemeIcon`;function c({theme:e,...t}){switch(e){case`system`:return r(i,{...t});case`light`:return r(o,{...t});case`dark`:return r(a,{...t});case`light-high-contrast`:return r(o,{...t,weight:`fill`});case`dark-high-contrast`:return r(a,{...t,weight:`fill`})}}c.displayName=`ThemeIcon`;function l(e){return r(`svg`,{fill:`currentColor`,height:`1em`,viewBox:`0 0 94 36`,width:`2.61em`,...e,children:r(`path`,{d:`M32.272 12.011c-1.298-1.466-2.904-2.205-4.812-2.205-1.176 0-2.26.233-3.255.7a7.995 7.995 0 0 0-2.581 1.906 9.205 9.205 0 0 0-1.715 2.853 9.773 9.773 0 0 0-.628 3.546c0 1.25.194 2.39.58 3.419.362.98.918 1.877 1.635 2.636A7.543 7.543 0 0 0 24 26.584c.965.41 2.025.617 3.176.617.522 0 1.005-.041 1.445-.116.439-.075.858-.2 1.26-.37.4-.175.79-.398 1.18-.664.385-.27.792-.612 1.21-1.018v4.353h-.005v.421h-5.33l-4.005 4.64v.798h15.037v-24.98h-5.697v1.746Zm-.014 7.979a4.25 4.25 0 0 1-.786 1.215 3.555 3.555 0 0 1-2.592 1.1 3.627 3.627 0 0 1-1.464-.292 3.508 3.508 0 0 1-1.166-.808 3.93 3.93 0 0 1-1.054-2.72c0-.519.097-1.006.298-1.457a3.77 3.77 0 0 1 .804-1.181 4.114 4.114 0 0 1 1.162-.808 3.484 3.484 0 0 1 2.817-.016c.448.19.844.463 1.181.81.336.347.6.743.804 1.194.202.452.298.95.298 1.493 0 .505-.104 1.005-.302 1.47m-16.261-7.708a6.173 6.173 0 0 0-2.06-1.602 4.875 4.875 0 0 0-.57-.22 6.383 6.383 0 0 0-.923-.216H8.383L5.697 13.39v-3.082H.002v16.61h5.695V15.712h5.35l.444-.01v11.214h5.697V16.528c0-.885-.084-1.674-.25-2.366a4.655 4.655 0 0 0-.941-1.877zm38.367-2.018h-6.213l-2.47 2.863v-2.864h-5.7v16.61h5.71l.004-11.117h4.144l4.526-5.26zm31.051 7.672 7.79-7.392v-.281H85.7l-5.975 5.991V0h-5.696v26.87h5.696v-6.766l6.262 6.763h7.663v-.316l-8.233-8.617zm-16.11-5.78a9.436 9.436 0 0 0-3.085-1.842 10.953 10.953 0 0 0-3.855-.664c-1.407 0-2.705.226-3.884.678a9.611 9.611 0 0 0-3.072 1.858 8.488 8.488 0 0 0-2.016 2.788 8.281 8.281 0 0 0-.722 3.449c0 1.362.24 2.596.722 3.707a8.52 8.52 0 0 0 2.002 2.862c.85.798 1.86 1.415 3.036 1.847 1.177.432 2.455.647 3.842.647 1.406 0 2.707-.215 3.919-.647 1.204-.431 2.24-1.04 3.098-1.833a8.583 8.583 0 0 0 2.031-2.816c.493-1.09.742-2.29.742-3.611 0-1.316-.244-2.52-.722-3.612a8.424 8.424 0 0 0-2.035-2.81Zm-3.558 7.864c-.2.461-.463.869-.786 1.215a3.573 3.573 0 0 1-2.592 1.1c-.502 0-.981-.096-1.434-.291a3.44 3.44 0 0 1-1.16-.809 4.155 4.155 0 0 1-.788-1.215 3.825 3.825 0 0 1-.297-1.537c0-.517.098-1.004.297-1.456.201-.451.46-.849.787-1.194a3.579 3.579 0 0 1 2.597-1.1c.502 0 .98.096 1.43.29.448.19.839.461 1.16.81.328.345.586.752.786 1.214.2.461.297.954.297 1.471 0 .538-.096 1.04-.297 1.502`})})}function u(e){return r(`svg`,{fill:`currentColor`,height:`1em`,viewBox:`0 0 32 32`,width:`1em`,...e,children:r(`path`,{d:`M27.2 6.18a9.47 9.47 0 0 0-3.12-2.5A9.42 9.42 0 0 0 21.82 3h-6.14l-4.06 4.9V3.1H3V29h8.62V11.53h8.09l.67-.02v17.48H29V12.8c0-1.37-.13-2.6-.38-3.68a7.35 7.35 0 0 0-1.42-2.93Z`})})}export{s as AutoThemeIcon,u as NgrokLettermarkIcon,l as NgrokWordmarkIcon,n as SortIcon,c as ThemeIcon,t as TrafficPolicyFileIcon};
1
+ import{s as e}from"./theme-provider-BFcnjeME.js";import{t}from"./traffic-policy-file-C6LHYrIU.js";import{t as n}from"./sort-DzCsa6Qj.js";import{jsx as r}from"react/jsx-runtime";import{DesktopIcon as i}from"@phosphor-icons/react/Desktop";import{MoonIcon as a}from"@phosphor-icons/react/Moon";import{SunIcon as o}from"@phosphor-icons/react/Sun";function s(t){return r(c,{theme:e(),...t})}s.displayName=`AutoThemeIcon`;function c({theme:e,...t}){switch(e){case`system`:return r(i,{...t});case`light`:return r(o,{...t});case`dark`:return r(a,{...t});case`light-high-contrast`:return r(o,{...t,weight:`fill`});case`dark-high-contrast`:return r(a,{...t,weight:`fill`})}}c.displayName=`ThemeIcon`;function l(e){return r(`svg`,{fill:`currentColor`,height:`1em`,viewBox:`0 0 94 36`,width:`2.61em`,...e,children:r(`path`,{d:`M32.272 12.011c-1.298-1.466-2.904-2.205-4.812-2.205-1.176 0-2.26.233-3.255.7a7.995 7.995 0 0 0-2.581 1.906 9.205 9.205 0 0 0-1.715 2.853 9.773 9.773 0 0 0-.628 3.546c0 1.25.194 2.39.58 3.419.362.98.918 1.877 1.635 2.636A7.543 7.543 0 0 0 24 26.584c.965.41 2.025.617 3.176.617.522 0 1.005-.041 1.445-.116.439-.075.858-.2 1.26-.37.4-.175.79-.398 1.18-.664.385-.27.792-.612 1.21-1.018v4.353h-.005v.421h-5.33l-4.005 4.64v.798h15.037v-24.98h-5.697v1.746Zm-.014 7.979a4.25 4.25 0 0 1-.786 1.215 3.555 3.555 0 0 1-2.592 1.1 3.627 3.627 0 0 1-1.464-.292 3.508 3.508 0 0 1-1.166-.808 3.93 3.93 0 0 1-1.054-2.72c0-.519.097-1.006.298-1.457a3.77 3.77 0 0 1 .804-1.181 4.114 4.114 0 0 1 1.162-.808 3.484 3.484 0 0 1 2.817-.016c.448.19.844.463 1.181.81.336.347.6.743.804 1.194.202.452.298.95.298 1.493 0 .505-.104 1.005-.302 1.47m-16.261-7.708a6.173 6.173 0 0 0-2.06-1.602 4.875 4.875 0 0 0-.57-.22 6.383 6.383 0 0 0-.923-.216H8.383L5.697 13.39v-3.082H.002v16.61h5.695V15.712h5.35l.444-.01v11.214h5.697V16.528c0-.885-.084-1.674-.25-2.366a4.655 4.655 0 0 0-.941-1.877zm38.367-2.018h-6.213l-2.47 2.863v-2.864h-5.7v16.61h5.71l.004-11.117h4.144l4.526-5.26zm31.051 7.672 7.79-7.392v-.281H85.7l-5.975 5.991V0h-5.696v26.87h5.696v-6.766l6.262 6.763h7.663v-.316l-8.233-8.617zm-16.11-5.78a9.436 9.436 0 0 0-3.085-1.842 10.953 10.953 0 0 0-3.855-.664c-1.407 0-2.705.226-3.884.678a9.611 9.611 0 0 0-3.072 1.858 8.488 8.488 0 0 0-2.016 2.788 8.281 8.281 0 0 0-.722 3.449c0 1.362.24 2.596.722 3.707a8.52 8.52 0 0 0 2.002 2.862c.85.798 1.86 1.415 3.036 1.847 1.177.432 2.455.647 3.842.647 1.406 0 2.707-.215 3.919-.647 1.204-.431 2.24-1.04 3.098-1.833a8.583 8.583 0 0 0 2.031-2.816c.493-1.09.742-2.29.742-3.611 0-1.316-.244-2.52-.722-3.612a8.424 8.424 0 0 0-2.035-2.81Zm-3.558 7.864c-.2.461-.463.869-.786 1.215a3.573 3.573 0 0 1-2.592 1.1c-.502 0-.981-.096-1.434-.291a3.44 3.44 0 0 1-1.16-.809 4.155 4.155 0 0 1-.788-1.215 3.825 3.825 0 0 1-.297-1.537c0-.517.098-1.004.297-1.456.201-.451.46-.849.787-1.194a3.579 3.579 0 0 1 2.597-1.1c.502 0 .98.096 1.43.29.448.19.839.461 1.16.81.328.345.586.752.786 1.214.2.461.297.954.297 1.471 0 .538-.096 1.04-.297 1.502`})})}function u(e){return r(`svg`,{fill:`currentColor`,height:`1em`,viewBox:`0 0 32 32`,width:`1em`,...e,children:r(`path`,{d:`M27.2 6.18a9.47 9.47 0 0 0-3.12-2.5A9.42 9.42 0 0 0 21.82 3h-6.14l-4.06 4.9V3.1H3V29h8.62V11.53h8.09l.67-.02v17.48H29V12.8c0-1.37-.13-2.6-.38-3.68a7.35 7.35 0 0 0-1.42-2.93Z`})})}export{s as AutoThemeIcon,u as NgrokLettermarkIcon,l as NgrokWordmarkIcon,n as SortIcon,c as ThemeIcon,t as TrafficPolicyFileIcon};
2
2
  //# sourceMappingURL=icons.js.map
@@ -1,17 +1,28 @@
1
1
  import { Ref } from "react";
2
2
 
3
+ //#region src/utils/copy-to-clipboard.d.ts
4
+ /**
5
+ * Copy the given string to the clipboard. Uses the Clipboard API when
6
+ * available and falls back to an `execCommand("copy")` polyfill for older
7
+ * browsers.
8
+ *
9
+ * Throws when called outside a DOM environment, or when both the Clipboard
10
+ * API and the polyfill fail — `await` the call to observe success.
11
+ */
12
+ declare function copyToClipboard(value: string): Promise<void>;
13
+ //#endregion
3
14
  //#region src/utils/compose-refs/compose-refs.d.ts
4
15
  type PossibleRef<T> = Ref<T> | undefined;
5
16
  /**
6
17
  * A utility to compose multiple refs together
7
18
  * Accepts callback refs and RefObject(s)
8
19
  */
9
- declare function composeRefs<T>(...refs: PossibleRef<T>[]): (node: T) => void;
20
+ declare function composeRefs<T>(...refs: PossibleRef<T>[]): (node: T | null) => void;
10
21
  /**
11
22
  * A custom hook that composes multiple refs
12
23
  * Accepts callback refs and RefObject(s)
13
24
  */
14
- declare function useComposedRefs<T>(...refs: PossibleRef<T>[]): () => (node: T) => void;
25
+ declare function useComposedRefs<T>(...refs: PossibleRef<T>[]): (node: T | null) => void;
15
26
  //#endregion
16
27
  //#region src/utils/in-view.d.ts
17
28
  type MarginValue = `${number}${"px" | "%"}`;
@@ -81,5 +92,5 @@ declare function inView(element: Element, onStart: (element: Element, entry: Int
81
92
  amount
82
93
  }?: InViewOptions): VoidFunction;
83
94
  //#endregion
84
- export { composeRefs as a, inView as i, MarginType as n, useComposedRefs as o, ViewChangeHandler as r, InViewOptions as t };
85
- //# sourceMappingURL=in-view-DsiWfQpY.d.ts.map
95
+ export { composeRefs as a, inView as i, MarginType as n, useComposedRefs as o, ViewChangeHandler as r, copyToClipboard as s, InViewOptions as t };
96
+ //# sourceMappingURL=in-view-Da08Bx6l.d.ts.map
@@ -1,2 +1,2 @@
1
1
  const e={some:0,all:1};function t(t,n,{root:r,margin:i,amount:a=`some`}={}){let o=new WeakMap,s=new IntersectionObserver(e=>{e.forEach(e=>{let t=o.get(e.target);if(e.isIntersecting!==!!t)if(e.isIntersecting){let t=n(e.target,e);typeof t==`function`?o.set(e.target,t):s.unobserve(e.target)}else typeof t==`function`&&(t(e),o.delete(e.target))})},{root:r,rootMargin:i,threshold:typeof a==`number`?a:e[a]});return s.observe(t),()=>{s.unobserve(t),s.disconnect()}}export{t};
2
- //# sourceMappingURL=in-view-BXzPPdcl.js.map
2
+ //# sourceMappingURL=in-view-pia_SVdE.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"in-view-BXzPPdcl.js","names":[],"sources":["../src/utils/in-view.ts"],"sourcesContent":["type MarginValue = `${number}${\"px\" | \"%\"}`;\n\n/**\n * Margin string used to expand or contract the intersection root's bounding box.\n * Follows the same syntax as the CSS `margin` shorthand (1–4 values).\n *\n * @example \"10px\"\n * @example \"10% 20px\"\n * @example \"10px 20px 10px 20px\"\n */\ntype MarginType =\n\t| MarginValue\n\t| `${MarginValue} ${MarginValue}`\n\t| `${MarginValue} ${MarginValue} ${MarginValue}`\n\t| `${MarginValue} ${MarginValue} ${MarginValue} ${MarginValue}`;\n\n/**\n * Options for the `inView` helper.\n */\ntype InViewOptions = {\n\t/**\n\t * The scrollable container element (or `Document`) to use as the intersection root.\n\t * Defaults to the browser viewport.\n\t */\n\troot?: Element | Document;\n\n\t/**\n\t * Expand or contract the detected area from each side of the root's bounding box.\n\t * Uses the same syntax as the CSS `margin` shorthand (e.g. `\"10px\"`, `\"10% 20px\"`).\n\t */\n\tmargin?: MarginType;\n\n\t/**\n\t * How much of the element must be visible before it is considered in view.\n\t * - `\"some\"` (default): Any part of the element is visible.\n\t * - `\"all\"`: The entire element is visible.\n\t * - `number`: An intersection ratio between `0` and `1` (e.g. `0.5` for 50%).\n\t */\n\tamount?: \"some\" | \"all\" | number;\n};\n\n/**\n * Callback invoked when an observed element leaves the viewport.\n * Receives the `IntersectionObserverEntry` for the departing element.\n */\ntype ViewChangeHandler = (entry: IntersectionObserverEntry) => void;\n\nconst thresholds = {\n\tsome: 0,\n\tall: 1,\n};\n\n/**\n * Observe when a DOM element enters or leaves the viewport (or a scrollable\n * container) using the `IntersectionObserver` API.\n *\n * When the element enters the viewport, `onStart` is called. If `onStart`\n * returns a function, that function is called when the element leaves the\n * viewport. If `onStart` returns nothing, the element is unobserved after\n * the first entry.\n *\n * @param element - The DOM element to observe.\n * @param onStart - Called when the element enters the viewport. Optionally\n * returns a cleanup function called when the element leaves.\n * @param options - Options for the intersection root, margin, and threshold.\n * @returns A cleanup function that disconnects the observer.\n *\n * @example\n * const stop = inView(element, (el) => {\n * el.classList.add(\"visible\");\n * return () => el.classList.remove(\"visible\");\n * });\n *\n * // Later, stop observing:\n * stop();\n */\nfunction inView(\n\telement: Element,\n\tonStart: (element: Element, entry: IntersectionObserverEntry) => void | ViewChangeHandler,\n\t{ root, margin: rootMargin, amount = \"some\" }: InViewOptions = {},\n): VoidFunction {\n\tconst activeIntersections = new WeakMap<Element, ViewChangeHandler>();\n\n\tconst onIntersectionChange: IntersectionObserverCallback = (entries) => {\n\t\tentries.forEach((entry) => {\n\t\t\tconst onEnd = activeIntersections.get(entry.target);\n\n\t\t\t/**\n\t\t\t * If there's no change to the intersection, we don't need to\n\t\t\t * do anything here.\n\t\t\t */\n\t\t\tif (entry.isIntersecting === Boolean(onEnd)) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tif (entry.isIntersecting) {\n\t\t\t\tconst newOnEnd = onStart(entry.target, entry);\n\t\t\t\tif (typeof newOnEnd === \"function\") {\n\t\t\t\t\tactiveIntersections.set(entry.target, newOnEnd);\n\t\t\t\t} else {\n\t\t\t\t\tobserver.unobserve(entry.target);\n\t\t\t\t}\n\t\t\t} else if (typeof onEnd === \"function\") {\n\t\t\t\tonEnd(entry);\n\t\t\t\tactiveIntersections.delete(entry.target);\n\t\t\t}\n\t\t});\n\t};\n\n\tconst observer = new IntersectionObserver(onIntersectionChange, {\n\t\troot,\n\t\trootMargin,\n\t\tthreshold: typeof amount === \"number\" ? amount : thresholds[amount],\n\t});\n\n\tobserver.observe(element);\n\n\treturn () => {\n\t\tobserver.unobserve(element);\n\t\tobserver.disconnect();\n\t};\n}\n\nexport { inView };\nexport type { InViewOptions, MarginType, ViewChangeHandler };\n"],"mappings":"AA+CA,MAAM,EAAa,CAClB,KAAM,EACN,IAAK,EACL,CA0BD,SAAS,EACR,EACA,EACA,CAAE,OAAM,OAAQ,EAAY,SAAS,QAA0B,EAAE,CAClD,CACf,IAAM,EAAsB,IAAI,QA4B1B,EAAW,IAAI,qBA1BuC,GAAY,CACvE,EAAQ,QAAS,GAAU,CAC1B,IAAM,EAAQ,EAAoB,IAAI,EAAM,OAAO,CAM/C,KAAM,iBAAmB,EAAQ,EAIrC,GAAI,EAAM,eAAgB,CACzB,IAAM,EAAW,EAAQ,EAAM,OAAQ,EAAM,CACzC,OAAO,GAAa,WACvB,EAAoB,IAAI,EAAM,OAAQ,EAAS,CAE/C,EAAS,UAAU,EAAM,OAAO,MAEvB,OAAO,GAAU,aAC3B,EAAM,EAAM,CACZ,EAAoB,OAAO,EAAM,OAAO,GAExC,EAG6D,CAC/D,OACA,aACA,UAAW,OAAO,GAAW,SAAW,EAAS,EAAW,GAC5D,CAAC,CAIF,OAFA,EAAS,QAAQ,EAAQ,KAEZ,CACZ,EAAS,UAAU,EAAQ,CAC3B,EAAS,YAAY"}
1
+ {"version":3,"file":"in-view-pia_SVdE.js","names":[],"sources":["../src/utils/in-view.ts"],"sourcesContent":["type MarginValue = `${number}${\"px\" | \"%\"}`;\n\n/**\n * Margin string used to expand or contract the intersection root's bounding box.\n * Follows the same syntax as the CSS `margin` shorthand (1–4 values).\n *\n * @example \"10px\"\n * @example \"10% 20px\"\n * @example \"10px 20px 10px 20px\"\n */\ntype MarginType =\n\t| MarginValue\n\t| `${MarginValue} ${MarginValue}`\n\t| `${MarginValue} ${MarginValue} ${MarginValue}`\n\t| `${MarginValue} ${MarginValue} ${MarginValue} ${MarginValue}`;\n\n/**\n * Options for the `inView` helper.\n */\ntype InViewOptions = {\n\t/**\n\t * The scrollable container element (or `Document`) to use as the intersection root.\n\t * Defaults to the browser viewport.\n\t */\n\troot?: Element | Document;\n\n\t/**\n\t * Expand or contract the detected area from each side of the root's bounding box.\n\t * Uses the same syntax as the CSS `margin` shorthand (e.g. `\"10px\"`, `\"10% 20px\"`).\n\t */\n\tmargin?: MarginType;\n\n\t/**\n\t * How much of the element must be visible before it is considered in view.\n\t * - `\"some\"` (default): Any part of the element is visible.\n\t * - `\"all\"`: The entire element is visible.\n\t * - `number`: An intersection ratio between `0` and `1` (e.g. `0.5` for 50%).\n\t */\n\tamount?: \"some\" | \"all\" | number;\n};\n\n/**\n * Callback invoked when an observed element leaves the viewport.\n * Receives the `IntersectionObserverEntry` for the departing element.\n */\ntype ViewChangeHandler = (entry: IntersectionObserverEntry) => void;\n\nconst thresholds = {\n\tsome: 0,\n\tall: 1,\n};\n\n/**\n * Observe when a DOM element enters or leaves the viewport (or a scrollable\n * container) using the `IntersectionObserver` API.\n *\n * When the element enters the viewport, `onStart` is called. If `onStart`\n * returns a function, that function is called when the element leaves the\n * viewport. If `onStart` returns nothing, the element is unobserved after\n * the first entry.\n *\n * @param element - The DOM element to observe.\n * @param onStart - Called when the element enters the viewport. Optionally\n * returns a cleanup function called when the element leaves.\n * @param options - Options for the intersection root, margin, and threshold.\n * @returns A cleanup function that disconnects the observer.\n *\n * @example\n * const stop = inView(element, (el) => {\n * el.classList.add(\"visible\");\n * return () => el.classList.remove(\"visible\");\n * });\n *\n * // Later, stop observing:\n * stop();\n */\nfunction inView(\n\telement: Element,\n\tonStart: (element: Element, entry: IntersectionObserverEntry) => void | ViewChangeHandler,\n\t{ root, margin: rootMargin, amount = \"some\" }: InViewOptions = {},\n): VoidFunction {\n\tconst activeIntersections = new WeakMap<Element, ViewChangeHandler>();\n\n\tconst onIntersectionChange: IntersectionObserverCallback = (entries) => {\n\t\tentries.forEach((entry) => {\n\t\t\tconst onEnd = activeIntersections.get(entry.target);\n\n\t\t\t/**\n\t\t\t * If there's no change to the intersection, we don't need to\n\t\t\t * do anything here.\n\t\t\t */\n\t\t\tif (entry.isIntersecting === Boolean(onEnd)) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tif (entry.isIntersecting) {\n\t\t\t\tconst newOnEnd = onStart(entry.target, entry);\n\t\t\t\tif (typeof newOnEnd === \"function\") {\n\t\t\t\t\tactiveIntersections.set(entry.target, newOnEnd);\n\t\t\t\t} else {\n\t\t\t\t\tobserver.unobserve(entry.target);\n\t\t\t\t}\n\t\t\t} else if (typeof onEnd === \"function\") {\n\t\t\t\tonEnd(entry);\n\t\t\t\tactiveIntersections.delete(entry.target);\n\t\t\t}\n\t\t});\n\t};\n\n\tconst observer = new IntersectionObserver(onIntersectionChange, {\n\t\troot,\n\t\trootMargin,\n\t\tthreshold: typeof amount === \"number\" ? amount : thresholds[amount],\n\t});\n\n\tobserver.observe(element);\n\n\treturn () => {\n\t\tobserver.unobserve(element);\n\t\tobserver.disconnect();\n\t};\n}\n\nexport { inView };\nexport type { InViewOptions, MarginType, ViewChangeHandler };\n"],"mappings":"AA+CA,MAAM,EAAa,CAClB,KAAM,EACN,IAAK,EACL,CA0BD,SAAS,EACR,EACA,EACA,CAAE,OAAM,OAAQ,EAAY,SAAS,QAA0B,EAAE,CAClD,CACf,IAAM,EAAsB,IAAI,QA4B1B,EAAW,IAAI,qBA1BuC,GAAY,CACvE,EAAQ,QAAS,GAAU,CAC1B,IAAM,EAAQ,EAAoB,IAAI,EAAM,OAAO,CAM/C,KAAM,iBAAmB,EAAQ,EAIrC,GAAI,EAAM,eAAgB,CACzB,IAAM,EAAW,EAAQ,EAAM,OAAQ,EAAM,CACzC,OAAO,GAAa,WACvB,EAAoB,IAAI,EAAM,OAAQ,EAAS,CAE/C,EAAS,UAAU,EAAM,OAAO,MAEvB,OAAO,GAAU,aAC3B,EAAM,EAAM,CACZ,EAAoB,OAAO,EAAM,OAAO,GAExC,EAG6D,CAC/D,OACA,aACA,UAAW,OAAO,GAAW,SAAW,EAAS,EAAW,GAC5D,CAAC,CAIF,OAFA,EAAS,QAAQ,EAAQ,KAEZ,CACZ,EAAS,UAAU,EAAQ,CAC3B,EAAS,YAAY"}
@@ -1,4 +1,4 @@
1
- import { a as WithInputType, i as WithAutoComplete, o as WithValidation } from "./types-BeTbgoJd.js";
1
+ import { a as WithInputType, i as WithAutoComplete, o as WithValidation } from "./types-DG0WQLTL.js";
2
2
  import * as _$react from "react";
3
3
  import { InputHTMLAttributes, PropsWithChildren } from "react";
4
4
 
@@ -100,4 +100,4 @@ declare const PasswordInput: _$react.ForwardRefExoticComponent<Omit<InputHTMLAtt
100
100
  declare function isInput(value: unknown): value is HTMLInputElement;
101
101
  //#endregion
102
102
  export { InputCapture as a, Input as i, PasswordInput as n, InputCaptureProps as o, PasswordInputProps as r, InputProps as s, isInput as t };
103
- //# sourceMappingURL=index-ddHz7L9f.d.ts.map
103
+ //# sourceMappingURL=index-DMAkXvFI.d.ts.map
@@ -1,12 +1,12 @@
1
- import { t as WithAsChild } from "./as-child-CJ2vTesV.js";
2
- import { t as VariantProps } from "./variant-props-DszdagRm.js";
1
+ import { t as WithAsChild } from "./as-child-DQHfEmYB.js";
2
+ import { t as VariantProps } from "./variant-props-DUmSIQK8.js";
3
3
  import * as _$react from "react";
4
4
  import { ComponentProps } from "react";
5
5
  import * as _$class_variance_authority_types0 from "class-variance-authority/types";
6
6
 
7
7
  //#region src/components/button/button-group.d.ts
8
8
  declare const buttonGroupVariants: (props?: ({
9
- appearance?: "panel" | "ghost" | "outlined" | null | undefined;
9
+ appearance?: "ghost" | "outlined" | "panel" | null | undefined;
10
10
  } & _$class_variance_authority_types0.ClassProp) | undefined) => string;
11
11
  type ButtonGroupVariants = VariantProps<typeof buttonGroupVariants>;
12
12
  type ButtonGroupProps = ComponentProps<"div"> & ButtonGroupVariants & WithAsChild;
@@ -27,4 +27,4 @@ type ButtonGroupProps = ComponentProps<"div"> & ButtonGroupVariants & WithAsChil
27
27
  declare const ButtonGroup: _$react.ForwardRefExoticComponent<Omit<ButtonGroupProps, "ref"> & _$react.RefAttributes<HTMLDivElement>>;
28
28
  //#endregion
29
29
  export { ButtonGroupProps as n, ButtonGroup as t };
30
- //# sourceMappingURL=index-DU3SQJ46.d.ts.map
30
+ //# sourceMappingURL=index-DOJUH34Z.d.ts.map
@@ -37,4 +37,4 @@ type Color = (typeof colors)[number];
37
37
  declare const isColor: (value: unknown) => value is Color;
38
38
  //#endregion
39
39
  export { functionalColors as a, isNamedColor as c, colors as i, namedColors as l, FunctionalColor as n, isColor as o, NamedColor as r, isFunctionalColor as s, Color as t };
40
- //# sourceMappingURL=index-B6SPk_xb.d.ts.map
40
+ //# sourceMappingURL=index-DkMUaYsw.d.ts.map
@@ -44,4 +44,4 @@ type CssProperties = CSSProperties & Record<CssVariableName, string | number>;
44
44
  declare const $cssProperties: <T extends CssProperties = CssProperties>(input: T) => CSSProperties;
45
45
  //#endregion
46
46
  export { parseBooleanish as i, CssProperties as n, Booleanish as r, $cssProperties as t };
47
- //# sourceMappingURL=index-vOSpS5jv.d.ts.map
47
+ //# sourceMappingURL=index-rtz7SwEq.d.ts.map
package/dist/input.d.ts CHANGED
@@ -1,3 +1,3 @@
1
- import { a as WithInputType, i as WithAutoComplete, n as InputType, o as WithValidation, r as Validation, t as AutoComplete } from "./types-BeTbgoJd.js";
2
- import { a as InputCapture, i as Input, n as PasswordInput, o as InputCaptureProps, r as PasswordInputProps, s as InputProps, t as isInput } from "./index-ddHz7L9f.js";
1
+ import { a as WithInputType, i as WithAutoComplete, n as InputType, o as WithValidation, r as Validation, t as AutoComplete } from "./types-DG0WQLTL.js";
2
+ import { a as InputCapture, i as Input, n as PasswordInput, o as InputCaptureProps, r as PasswordInputProps, s as InputProps, t as isInput } from "./index-DMAkXvFI.js";
3
3
  export { AutoComplete, Input, InputCapture, InputCaptureProps, InputProps, InputType, PasswordInput, PasswordInputProps, Validation, WithAutoComplete, WithInputType, WithValidation, isInput };
package/dist/input.js CHANGED
@@ -1,2 +1,2 @@
1
- import{t as e}from"./cx-D1HYnpvA.js";import{t}from"./icon-bWc5yC3-.js";import{t as n}from"./compose-refs-DFIaEnQH.js";import{t as r}from"./use-prefers-reduced-motion-BcwST13S.js";import{t as i}from"./is-input-Bh1rQhX3.js";import{createContext as a,forwardRef as o,useContext as s,useEffect as c,useRef as l,useState as u}from"react";import d from"clsx";import{jsx as f,jsxs as p}from"react/jsx-runtime";import{CheckCircleIcon as m}from"@phosphor-icons/react/CheckCircle";import{WarningIcon as h}from"@phosphor-icons/react/Warning";import{WarningDiamondIcon as g}from"@phosphor-icons/react/WarningDiamond";import{EyeIcon as _}from"@phosphor-icons/react/Eye";import{EyeClosedIcon as v}from"@phosphor-icons/react/EyeClosed";import{flushSync as y}from"react-dom";const b=o(({children:e,className:t,...n},r)=>{let i=!!e,a=l(null);return i?f(C,{className:t,forwardedRef:r,innerRef:a,...n,children:e}):f(C,{...n,className:t,forwardedRef:r,innerRef:a,children:f(x,{...n})})});b.displayName=`Input`;const x=o(({"aria-invalid":t,className:r,validation:i,...a},o)=>{let{"aria-invalid":c,forwardedRef:l,innerRef:u,validation:d,...p}=s(S),m=d??i,h=(typeof m==`function`?m():m)||void 0,g=c??t??m===`error`,_={...p,...a,type:a.type??p.type??`text`};return f(`input`,{"aria-invalid":g,"data-slot":`input-capture`,"data-validation":h,className:e(`placeholder:text-placeholder min-w-0 flex-1 bg-transparent text-left autofill:shadow-[inset_0_0_0px_1000px_var(--color-blue-50)] focus:outline-hidden`,r),ref:n(o,l,u),..._})});x.displayName=`InputCapture`;const S=a({validation:void 0,innerRef:{current:null}}),C=({"aria-invalid":t,"aria-disabled":n,"data-slot":r=`input`,children:i,className:a,disabled:o,forwardedRef:s,innerRef:c,style:l,type:u,validation:d,...m})=>{let h=t!=null&&t!==`false`?`error`:typeof d==`function`?d():d;return f(S.Provider,{value:{"aria-invalid":t,"aria-disabled":n,disabled:o,type:u,validation:h,...m,forwardedRef:s,innerRef:c},children:p(`div`,{role:`none`,"data-slot":r,"data-disabled":(o??n)||void 0,"data-validation":h||void 0,className:e(`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-hidden focus-within:ring-4`,`data-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 focus-within:border-accent-600 focus-within:ring-focus-accent`,`data-validation-success:border-success-600 focus-within:data-validation-success:border-success-600 focus-within:data-validation-success:ring-focus-success`,`data-validation-warning:border-warning-600 focus-within:data-validation-warning:border-warning-600 focus-within:data-validation-warning:ring-focus-warning`,`data-validation-error:border-danger-600 focus-within:data-validation-error:border-danger-600 focus-within:data-validation-error:ring-focus-danger`,`autofill:shadow-[inset_0_0_0px_1000px_var(--color-blue-50)] has-autofill:bg-blue-50 has-autofill:[-webkit-text-fill-color:var(--text-color-strong)]`,a),onMouseDown:e=>{e.target!==c?.current&&e.preventDefault()},onClick:()=>{c?.current?.focus()},onKeyDown:()=>{c?.current!==document.activeElement&&c?.current?.focus()},style:l,children:[i,f(w,{name:m.name,validation:h})]})})};C.displayName=`InputContainer`;const w=({name:e,validation:n})=>{switch(n){case`error`:return p(`div`,{className:`text-danger-600 order-last select-none`,children:[f(`span`,{className:`sr-only`,children:d(`The value entered for the`,e,`input has failed validation.`)}),f(t,{svg:f(h,{"aria-hidden":!0,weight:`fill`})})]});case`success`:return f(`div`,{className:`text-success-600 order-last select-none`,children:f(t,{svg:f(m,{weight:`fill`})})});case`warning`:return f(`div`,{className:`text-warning-600 order-last select-none`,children:f(t,{svg:f(g,{weight:`fill`})})});default:return null}};w.displayName=`ValidationFeedback`;const T=o(({onValueVisibilityChange:e,showValue:n=!1,...i},a)=>{let[o,s]=u(n),d=o?`text`:`password`,m=o?_:v,h=l(null),g=l(null);return c(()=>{s(n)},[n]),p(b,{"data-slot":`password-input`,type:d,ref:a,...i,children:[f(x,{}),p(`button`,{type:`button`,tabIndex:-1,className:`text-body hover:text-strong ml-1 cursor-pointer bg-inherit p-0`,onClick:()=>{g.current&&=(g.current.cancel(),null);let t=!o;y(()=>{s(t)}),e?.(t);let n=h.current;n&&!r()&&(g.current=n.animate([{transform:`scaleY(0)`},{transform:`scaleY(1)`}],{duration:200,easing:`ease-out`}),g.current.onfinish=()=>{g.current=null})},children:[p(`span`,{className:`sr-only`,children:[`Turn password visibility `,o?`off`:`on`]}),f(t,{ref:h,svg:f(m,{"aria-hidden":!0})})]})]})});T.displayName=`PasswordInput`;export{b as Input,x as InputCapture,T as PasswordInput,i as isInput};
1
+ import{t as e}from"./cx-D1HYnpvA.js";import{t}from"./icon-bWc5yC3-.js";import{t as n}from"./compose-refs-DZ3cPi47.js";import{t as r}from"./use-prefers-reduced-motion-aXfsyo-k.js";import{t as i}from"./is-input-CUEWaxtA.js";import{createContext as a,forwardRef as o,useContext as s,useEffect as c,useRef as l,useState as u}from"react";import d from"clsx";import{jsx as f,jsxs as p}from"react/jsx-runtime";import{CheckCircleIcon as m}from"@phosphor-icons/react/CheckCircle";import{WarningIcon as h}from"@phosphor-icons/react/Warning";import{WarningDiamondIcon as g}from"@phosphor-icons/react/WarningDiamond";import{EyeIcon as _}from"@phosphor-icons/react/Eye";import{EyeClosedIcon as v}from"@phosphor-icons/react/EyeClosed";import{flushSync as y}from"react-dom";const b=o(({children:e,className:t,...n},r)=>{let i=!!e,a=l(null);return i?f(C,{className:t,forwardedRef:r,innerRef:a,...n,children:e}):f(C,{...n,className:t,forwardedRef:r,innerRef:a,children:f(x,{...n})})});b.displayName=`Input`;const x=o(({"aria-invalid":t,className:r,validation:i,...a},o)=>{let{"aria-invalid":c,forwardedRef:l,innerRef:u,validation:d,...p}=s(S),m=d??i,h=(typeof m==`function`?m():m)||void 0,g=c??t??m===`error`,_={...p,...a,type:a.type??p.type??`text`};return f(`input`,{"aria-invalid":g,"data-slot":`input-capture`,"data-validation":h,className:e(`placeholder:text-placeholder min-w-0 flex-1 bg-transparent text-left autofill:shadow-[inset_0_0_0px_1000px_var(--color-blue-50)] focus:outline-hidden`,r),ref:n(o,l,u),..._})});x.displayName=`InputCapture`;const S=a({validation:void 0,innerRef:{current:null}}),C=({"aria-invalid":t,"aria-disabled":n,"data-slot":r=`input`,children:i,className:a,disabled:o,forwardedRef:s,innerRef:c,style:l,type:u,validation:d,...m})=>{let h=t!=null&&t!==`false`?`error`:typeof d==`function`?d():d;return f(S.Provider,{value:{"aria-invalid":t,"aria-disabled":n,disabled:o,type:u,validation:h,...m,forwardedRef:s,innerRef:c},children:p(`div`,{role:`none`,"data-slot":r,"data-disabled":(o??n)||void 0,"data-validation":h||void 0,className:e(`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-hidden focus-within:ring-4`,`data-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 focus-within:border-accent-600 focus-within:ring-focus-accent`,`data-validation-success:border-success-600 focus-within:data-validation-success:border-success-600 focus-within:data-validation-success:ring-focus-success`,`data-validation-warning:border-warning-600 focus-within:data-validation-warning:border-warning-600 focus-within:data-validation-warning:ring-focus-warning`,`data-validation-error:border-danger-600 focus-within:data-validation-error:border-danger-600 focus-within:data-validation-error:ring-focus-danger`,`autofill:shadow-[inset_0_0_0px_1000px_var(--color-blue-50)] has-autofill:bg-blue-50 has-autofill:[-webkit-text-fill-color:var(--text-color-strong)]`,a),onMouseDown:e=>{e.target!==c?.current&&e.preventDefault()},onClick:()=>{c?.current?.focus()},onKeyDown:()=>{c?.current!==document.activeElement&&c?.current?.focus()},style:l,children:[i,f(w,{name:m.name,validation:h})]})})};C.displayName=`InputContainer`;const w=({name:e,validation:n})=>{switch(n){case`error`:return p(`div`,{className:`text-danger-600 order-last select-none`,children:[f(`span`,{className:`sr-only`,children:d(`The value entered for the`,e,`input has failed validation.`)}),f(t,{svg:f(h,{"aria-hidden":!0,weight:`fill`})})]});case`success`:return f(`div`,{className:`text-success-600 order-last select-none`,children:f(t,{svg:f(m,{weight:`fill`})})});case`warning`:return f(`div`,{className:`text-warning-600 order-last select-none`,children:f(t,{svg:f(g,{weight:`fill`})})});default:return null}};w.displayName=`ValidationFeedback`;const T=o(({onValueVisibilityChange:e,showValue:n=!1,...i},a)=>{let[o,s]=u(n),d=o?`text`:`password`,m=o?_:v,h=l(null),g=l(null);return c(()=>{s(n)},[n]),p(b,{"data-slot":`password-input`,type:d,ref:a,...i,children:[f(x,{}),p(`button`,{type:`button`,tabIndex:-1,className:`text-body hover:text-strong ml-1 cursor-pointer bg-inherit p-0`,onClick:()=>{g.current&&=(g.current.cancel(),null);let t=!o;y(()=>{s(t)}),e?.(t);let n=h.current;n&&!r()&&(g.current=n.animate([{transform:`scaleY(0)`},{transform:`scaleY(1)`}],{duration:200,easing:`ease-out`}),g.current.onfinish=()=>{g.current=null})},children:[p(`span`,{className:`sr-only`,children:[`Turn password visibility `,o?`off`:`on`]}),f(t,{ref:h,svg:f(m,{"aria-hidden":!0})})]})]})});T.displayName=`PasswordInput`;export{b as Input,x as InputCapture,T as PasswordInput,i as isInput};
2
2
  //# sourceMappingURL=input.js.map
@@ -1,2 +1,2 @@
1
1
  function e(e){return e!=null&&e instanceof HTMLInputElement}export{e as t};
2
- //# sourceMappingURL=is-input-Bh1rQhX3.js.map
2
+ //# sourceMappingURL=is-input-CUEWaxtA.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"is-input-Bh1rQhX3.js","names":[],"sources":["../src/components/input/is-input.ts"],"sourcesContent":["/**\n * Type guard for an HTMLInputElement.\n *\n * @example\n * ```tsx\n * function handleElement(element: HTMLElement) {\n * if (isInput(element)) {\n * // TypeScript now knows element is HTMLInputElement\n * element.value = \"new value\";\n * element.focus();\n * }\n * }\n * ```\n */\nexport function isInput(value: unknown): value is HTMLInputElement {\n\treturn value != null && value instanceof HTMLInputElement;\n}\n"],"mappings":"AAcA,SAAgB,EAAQ,EAA2C,CAClE,OAAO,GAAS,MAAQ,aAAiB"}
1
+ {"version":3,"file":"is-input-CUEWaxtA.js","names":[],"sources":["../src/components/input/is-input.ts"],"sourcesContent":["/**\n * Type guard for an HTMLInputElement.\n *\n * @example\n * ```tsx\n * function handleElement(element: HTMLElement) {\n * if (isInput(element)) {\n * // TypeScript now knows element is HTMLInputElement\n * element.value = \"new value\";\n * element.focus();\n * }\n * }\n * ```\n */\nexport function isInput(value: unknown): value is HTMLInputElement {\n\treturn value != null && value instanceof HTMLInputElement;\n}\n"],"mappings":"AAcA,SAAgB,EAAQ,EAA2C,CAClE,OAAO,GAAS,MAAQ,aAAiB"}
@@ -1,2 +1,2 @@
1
1
  import{t as e}from"./cx-D1HYnpvA.js";import{jsx as t}from"react/jsx-runtime";function n({children:n,className:r,...i}){return t(`kbd`,{"data-slot":`kbd`,className:e(`[font-kerning:normal] [font-variant-ligatures:common-ligatures_contextual]`,`appearance-none tabular-nums inline-grid place-items-center size-5 bg-neutral-500/15 px-1 rounded text-mono leading-none font-mono`,r),...i,children:n})}export{n as t};
2
- //# sourceMappingURL=kbd-B0wWeV_0.js.map
2
+ //# sourceMappingURL=kbd-CAVUiqBT.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"kbd-B0wWeV_0.js","names":[],"sources":["../src/components/kbd/kbd.tsx"],"sourcesContent":["import type { ComponentProps } from \"react\";\nimport { cx } from \"../../utils/cx/cx.js\";\n\n/**\n * A square, centered keyboard “key” chip for rendering shortcut hints\n * (e.g., \"K\", \"⌘\", \"⌃\"). Designed so every key—letters and modifiers—shares\n * the same visual height/width and baseline. Renders a native `<kbd>` element.\n *\n * Accessibility:\n * - When showing a symbol (⌘/⌃), provide an accessible name via `aria-label`\n * or include an sr-only label inside. The visible glyph may be marked\n * `aria-hidden`.\n *\n * @example Basic letter key\n * <Kbd>K</Kbd>\n */\nfunction Kbd({ children, className, ...props }: ComponentProps<\"kbd\">) {\n\treturn (\n\t\t<kbd\n\t\t\tdata-slot=\"kbd\"\n\t\t\tclassName={cx(\n\t\t\t\t\"[font-kerning:normal] [font-variant-ligatures:common-ligatures_contextual]\",\n\t\t\t\t\"appearance-none tabular-nums inline-grid place-items-center size-5 bg-neutral-500/15 px-1 rounded text-mono leading-none font-mono\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t>\n\t\t\t{children}\n\t\t</kbd>\n\t);\n}\n\nexport {\n\t//,\n\tKbd,\n};\n"],"mappings":"6EAgBA,SAAS,EAAI,CAAE,WAAU,YAAW,GAAG,GAAgC,CACtE,OACC,EAAC,MAAD,CACC,YAAU,MACV,UAAW,EACV,6EACA,qIACA,EACA,CACD,GAAI,EAEH,WACI,CAAA"}
1
+ {"version":3,"file":"kbd-CAVUiqBT.js","names":[],"sources":["../src/components/kbd/kbd.tsx"],"sourcesContent":["import type { ComponentProps } from \"react\";\nimport { cx } from \"../../utils/cx/cx.js\";\n\n/**\n * A square, centered keyboard “key” chip for rendering shortcut hints\n * (e.g., \"K\", \"⌘\", \"⌃\"). Designed so every key—letters and modifiers—shares\n * the same visual height/width and baseline. Renders a native `<kbd>` element.\n *\n * Accessibility:\n * - When showing a symbol (⌘/⌃), provide an accessible name via `aria-label`\n * or include an sr-only label inside. The visible glyph may be marked\n * `aria-hidden`.\n *\n * @example Basic letter key\n * <Kbd>K</Kbd>\n */\nfunction Kbd({ children, className, ...props }: ComponentProps<\"kbd\">) {\n\treturn (\n\t\t<kbd\n\t\t\tdata-slot=\"kbd\"\n\t\t\tclassName={cx(\n\t\t\t\t\"[font-kerning:normal] [font-variant-ligatures:common-ligatures_contextual]\",\n\t\t\t\t\"appearance-none tabular-nums inline-grid place-items-center size-5 bg-neutral-500/15 px-1 rounded text-mono leading-none font-mono\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t>\n\t\t\t{children}\n\t\t</kbd>\n\t);\n}\n\nexport {\n\t//,\n\tKbd,\n};\n"],"mappings":"6EAgBA,SAAS,EAAI,CAAE,WAAU,YAAW,GAAG,GAAgC,CACtE,OACC,EAAC,MAAD,CACC,YAAU,MACV,UAAW,EACV,6EACA,qIACA,EACA,CACD,GAAI,EAEH,WACI,CAAA"}
package/dist/kbd.js CHANGED
@@ -1 +1 @@
1
- import{t as e}from"./kbd-B0wWeV_0.js";export{e as Kbd};
1
+ import{t as e}from"./kbd-CAVUiqBT.js";export{e as Kbd};
@@ -1,4 +1,4 @@
1
- import { t as WithAsChild } from "./as-child-CJ2vTesV.js";
1
+ import { t as WithAsChild } from "./as-child-DQHfEmYB.js";
2
2
  import * as _$react from "react";
3
3
  import { ComponentProps } from "react";
4
4
 
@@ -1,5 +1,5 @@
1
- import { t as WithAsChild } from "./as-child-CJ2vTesV.js";
2
- import { o as WithValidation } from "./types-BeTbgoJd.js";
1
+ import { t as WithAsChild } from "./as-child-DQHfEmYB.js";
2
+ import { o as WithValidation } from "./types-DG0WQLTL.js";
3
3
  import * as _$react from "react";
4
4
  import { ComponentProps, ReactNode } from "react";
5
5
  import * as _$react_jsx_runtime0 from "react/jsx-runtime";
@@ -1,2 +1,2 @@
1
- import{t as e}from"./cx-D1HYnpvA.js";import{t}from"./icon-bWc5yC3-.js";import{t as n}from"./slot-D_ZUrdEW.js";import{t as r}from"./compose-refs-DFIaEnQH.js";import{n as i}from"./separator-DyOGgFCs.js";import{t as a}from"./use-prefers-reduced-motion-BcwST13S.js";import{createContext as o,forwardRef as s,useCallback as c,useContext as l,useEffect as u,useMemo as d,useRef as f}from"react";import{Fragment as p,jsx as m,jsxs as h}from"react/jsx-runtime";import{XIcon as g}from"@phosphor-icons/react/X";import{CheckIcon as _}from"@phosphor-icons/react/Check";import*as v from"@ariakit/react";import{LockIcon as y}from"@phosphor-icons/react/Lock";const b=e=>Array.isArray(e)&&e.every(e=>typeof e==`string`),x=[],S=o({current:null}),C=o({current:[]}),w=o({onInputKeyDownRef:{current:void 0},inputRef:{current:null}}),T=({children:e,defaultSelectedValue:t=[],...n})=>{let r=f(null),i=f(void 0),a=f(null),o=f([]),s=d(()=>({onInputKeyDownRef:i,inputRef:a}),[]);return m(S.Provider,{value:r,children:m(w.Provider,{value:s,children:m(C.Provider,{value:o,children:m(v.ComboboxProvider,{defaultSelectedValue:t,...n,children:e})})})})};T.displayName=`MultiSelect`;const E=s(({"aria-invalid":t,className:n,children:i,onKeyDown:a,onMouseDown:o,validation:s,...c},u)=>{let d=l(S),{inputRef:f}=l(w),p=v.useComboboxContext(),h=t!=null&&t!==`false`?`error`:typeof s==`function`?s():s;return m(`div`,{role:`group`,"data-slot":`multi-select-trigger`,className:e(`cursor-text select-none font-sans text-sm`,`border-form bg-form text-strong flex min-h-9 w-full flex-wrap items-center gap-1 rounded-md border px-3 py-1 has-[[data-slot=multi-select-tag]]:px-1`,`has-focus:outline-hidden has-focus-within:ring-4 has-aria-expanded:ring-4`,`has-focus-within:border-accent-600 has-focus-within:ring-focus-accent has-aria-expanded:border-accent-600 has-aria-expanded:ring-focus-accent`,`data-validation-success:border-success-600 data-validation-success:has-focus-within:border-success-600 data-validation-success:has-focus-within:ring-focus-success data-validation-success:has-aria-expanded:border-success-600 data-validation-success:has-aria-expanded:ring-focus-success`,`data-validation-warning:border-warning-600 data-validation-warning:has-focus-within:border-warning-600 data-validation-warning:has-focus-within:ring-focus-warning data-validation-warning:has-aria-expanded:border-warning-600 data-validation-warning:has-aria-expanded:ring-focus-warning`,`data-validation-error:border-danger-600 data-validation-error:has-focus-within:border-danger-600 data-validation-error:has-focus-within:ring-focus-danger data-validation-error:has-aria-expanded:border-danger-600 data-validation-error:has-aria-expanded:ring-focus-danger`,n),"data-validation":h||void 0,onKeyDown:e=>{e.key===`Escape`&&p?.getState().open&&(e.preventDefault(),p.hide()),a?.(e)},onMouseDown:e=>{e.target instanceof HTMLElement&&!e.target.closest(`button, input, [role='option']`)&&(e.preventDefault(),f.current?.focus()),o?.(e)},ref:r(d,u),...c,children:i})});E.displayName=`MultiSelectTrigger`;const D=s(({className:n,value:i,onRemove:a,locked:o=!1,onKeyDown:s,...c},l)=>{let u=f(null);return h(`span`,{ref:r(u,l),role:`option`,"aria-selected":!0,tabIndex:-1,"data-slot":`multi-select-tag`,"data-locked":o||void 0,className:e(`cursor-default bg-neutral-500/10 border border-neutral-500/20 rounded-xs text-strong inline-flex items-center gap-1 pl-2 pr-0.5 py-0.5 text-sm font-normal`,`focus-visible:outline-hidden focus-visible:border-accent-600/50 focus-visible:ring-3 focus-visible:ring-focus-accent`,n),onKeyDown:e=>{if(o&&(e.key===`Backspace`||e.key===`Delete`)){e.preventDefault(),z(e.currentTarget);return}s?.(e)},...c,children:[i,m(`button`,{type:`button`,"aria-label":`Remove ${i}`,tabIndex:-1,"aria-disabled":o||void 0,className:e(`cursor-pointer text-strong/40 hover:bg-neutral-500/15 hover:text-strong rounded-xs p-0.5`,`aria-disabled:cursor-default aria-disabled:hover:bg-transparent aria-disabled:hover:text-strong/40`),onClick:e=>{if(e.stopPropagation(),o){let e=u.current;e&&z(e);return}a?.()},onMouseDown:e=>{e.preventDefault()},children:m(t,{svg:o?m(y,{}):m(g,{weight:`bold`}),className:`size-4`})})]})});D.displayName=`MultiSelectTag`;const O=({children:e,lockedValues:t=[]})=>{let n=v.useComboboxContext(),r=v.useStoreState(n,`selectedValue`),i=(b(r)?r:void 0)??x,a=f(i);a.current=i;let o=l(C);o.current=t;let s=d(()=>new Set(t),[t]),c=f(new Map),{onInputKeyDownRef:h,inputRef:g}=l(w),_=f(new Set);u(()=>()=>{_.current.forEach(cancelAnimationFrame)},[]);let y=e=>{let t;t=requestAnimationFrame(()=>{_.current.delete(t),e()}),_.current.add(t)},S=e=>{if(n){let t=n.getState().selectedValue;if(!b(t))return;n.setSelectedValue(t.filter(t=>t!==e))}},T=e=>{let t=a.current[e];if(t==null)return;let r=c.current.get(t);r&&(r.focus(),n?.show())},E=()=>{g.current?.focus()},O=(e,t)=>{let n=i[t];switch(e.key){case`ArrowLeft`:e.preventDefault(),t>0&&T(t-1);break;case`ArrowRight`:e.preventDefault(),t<i.length-1?T(t+1):E();break;case`Backspace`:case`Delete`:if(e.preventDefault(),n!=null){if(s.has(n)){let e=c.current.get(n);e&&z(e);break}if(S(n),e.key===`Backspace`)if(t>0){let e=t-1;y(()=>T(e))}else y(()=>{a.current.length>0?T(0):E()});else y(()=>{t<a.current.length?T(t):E()})}break;case`ArrowUp`:case`ArrowDown`:e.preventDefault(),E(),g.current?.dispatchEvent(new KeyboardEvent(`keydown`,{key:e.key,bubbles:!0,cancelable:!0,shiftKey:e.shiftKey,ctrlKey:e.ctrlKey,metaKey:e.metaKey,altKey:e.altKey}));break;default:e.key.length===1&&!e.ctrlKey&&!e.metaKey&&E();break}};return h.current=e=>{if(e.key===`ArrowLeft`&&e.currentTarget.selectionStart===0&&e.currentTarget.selectionEnd===0&&i.length>0){e.preventDefault(),T(i.length-1);return}if(e.key===`Backspace`&&e.currentTarget.value===``&&i.length>0){let e=i[i.length-1];if(e!=null)if(o.current.includes(e)){let t=c.current.get(e);t&&z(t)}else S(e)}},m(p,{children:i.map((t,n)=>{let r={value:t,locked:s.has(t),onRemove:()=>{if(s.has(t)){let e=c.current.get(t);e&&z(e);return}S(t)},ref:e=>{e?c.current.set(t,e):c.current.delete(t)},onKeyDown:e=>O(e,n),onClick:()=>T(n)};return e?e(r):m(D,{...r},t)})})};O.displayName=`MultiSelectTagValues`;const k=s(({className:t,onBlur:n,onChange:i,onFocus:a,onKeyDown:o,onValueChange:s,placeholder:c,...u},d)=>{let f=v.useComboboxContext(),{onInputKeyDownRef:p,inputRef:h}=l(w),g=v.useStoreState(f,`selectedValue`),_=((b(g)?g:void 0)?.length??0)>0;return m(v.Combobox,{autoSelect:!0,"data-slot":`multi-select-input`,className:e(`pointer-coarse:text-base min-w-20 flex-1 select-text border-0 bg-transparent text-sm outline-hidden`,`placeholder:select-none placeholder:text-placeholder`,t),onChange:e=>{s?.(e.target.value),i?.(e)},onKeyDown:e=>{p.current?.(e),o?.(e)},onBlur:e=>{e.relatedTarget instanceof HTMLElement&&e.relatedTarget.closest(`[data-slot="multi-select-tag"]`)&&f?.show(),n?.(e)},onFocus:e=>{f?.show(),a?.(e)},placeholder:_?void 0:c,ref:r(h,d),...u})});k.displayName=`MultiSelectInput`;const A=s(({asChild:t=!1,backdrop:r=!1,children:i,className:a,modal:o=!0,portalElement:s,sameWidth:u=!0,unmountOnHide:d=!0,...f},p)=>{let h=l(S),g=c(()=>h.current?.getBoundingClientRect()??null,[h]),_=c(e=>typeof s==`function`?s(e):s??h.current?.closest(`[data-mantle-modal-content]`)??e.ownerDocument.body,[s,h]),y=c(e=>!(e.target instanceof Node&&h.current?.contains(e.target)),[h]);return m(v.ComboboxPopover,{"data-slot":`multi-select-content`,className:e(`border-popover bg-popover relative z-50 max-h-96 min-w-32 scrollbar overflow-y-scroll overflow-x-hidden overscroll-y-none rounded-md border shadow-md pt-1 pb-1 has-data-content-footer:pb-0 font-sans flex flex-col gap-px focus:outline-hidden`,a),backdrop:r,getAnchorRect:g,gutter:4,hideOnInteractOutside:y,modal:o,portalElement:_,ref:p,render:t?({ref:e,...t})=>m(n,{ref:e,...t}):void 0,sameWidth:u,unmountOnHide:d,...f,children:i})});A.displayName=`MultiSelectContent`;const j=s(({asChild:r=!1,children:i,className:a,focusOnHover:o=!0,value:s,onClick:c,...u},d)=>{let f=l(C),p=s!=null&&f.current.includes(s);return h(v.ComboboxItem,{"data-slot":`multi-select-item`,className:e(`relative mx-1 cursor-pointer rounded-md pl-2 pr-8 py-1.5 text-strong text-sm font-normal flex min-w-0 items-center gap-2`,`[[role=option]+&]:mt-px`,`data-active-item:bg-active-menu-item`,`aria-disabled:opacity-50`,`aria-selected:bg-selected-menu-item aria-selected:data-active-item:bg-active-selected-menu-item`,a),focusOnHover:o,onClick:e=>{if(p){e.preventDefault();return}c?.(e)},ref:d,render:r?({ref:e,...t})=>m(n,{ref:e,...t}):void 0,resetValueOnSelect:!0,value:s,...u,children:[i,m(v.ComboboxItemCheck,{className:`absolute right-2 flex h-3.5 w-3.5 items-center justify-center`,children:m(t,{svg:m(_,{weight:`bold`}),className:`size-4 text-accent-600`})})]})});j.displayName=`MultiSelectItem`;const M=s(({asChild:e=!1,children:t,...r},i)=>m(v.ComboboxGroup,{"data-slot":`multi-select-group`,className:`mx-1`,ref:i,render:e?({ref:e,...t})=>m(n,{ref:e,...t}):void 0,...r,children:t}));M.displayName=`MultiSelectGroup`;const N=s(({asChild:t=!1,children:r,className:i,...a},o)=>m(v.ComboboxGroupLabel,{"data-slot":`multi-select-group-label`,className:e(`text-muted px-2 py-1 text-xs font-medium`,i),ref:o,render:t?({ref:e,...t})=>m(n,{ref:e,...t}):void 0,...a,children:r}));N.displayName=`MultiSelectGroupLabel`;const P=s(({className:t,children:n,...r},i)=>m(`p`,{"data-slot":`multi-select-group-description`,className:e(`text-muted px-2 pb-1 text-xs`,t),ref:i,...r,children:n}));P.displayName=`MultiSelectGroupDescription`;const F=s(({className:t,...n},r)=>m(i,{"data-slot":`multi-select-separator`,ref:r,className:e(`my-1 w-auto`,t),...n}));F.displayName=`MultiSelectSeparator`;const I=s(({className:t,children:n,...r},i)=>m(`div`,{"data-slot":`multi-select-empty`,className:e(`mx-1 text-muted px-2 py-6 text-center text-sm`,t),ref:i,role:`presentation`,...r,children:n}));I.displayName=`MultiSelectEmpty`;const L=s(({className:t,children:n,...r},i)=>m(`div`,{ref:i,"data-slot":`multi-select-content-footer`,"data-content-footer":!0,className:e(`bg-popover sticky bottom-0 border-t border-popover`,t),...r,children:n}));L.displayName=`MultiSelectContentFooter`;const R={Root:T,Trigger:E,TagValues:O,Input:k,Tag:D,Content:A,ContentFooter:L,Item:j,Group:M,GroupLabel:N,GroupDescription:P,Separator:F,Empty:I};function z(e){a()||e.animate([{transform:`translateX(0)`},{transform:`translateX(-4px)`},{transform:`translateX(4px)`},{transform:`translateX(-4px)`},{transform:`translateX(4px)`},{transform:`translateX(0)`}],{duration:300,easing:`ease-in-out`})}export{R as MultiSelect};
1
+ import{t as e}from"./cx-D1HYnpvA.js";import{t}from"./icon-bWc5yC3-.js";import{t as n}from"./slot-D_ZUrdEW.js";import{t as r}from"./compose-refs-DZ3cPi47.js";import{n as i}from"./separator-DSOIrnhj.js";import{t as a}from"./use-prefers-reduced-motion-aXfsyo-k.js";import{createContext as o,forwardRef as s,useCallback as c,useContext as l,useEffect as u,useMemo as d,useRef as f}from"react";import{Fragment as p,jsx as m,jsxs as h}from"react/jsx-runtime";import{XIcon as g}from"@phosphor-icons/react/X";import{CheckIcon as _}from"@phosphor-icons/react/Check";import*as v from"@ariakit/react";import{LockIcon as y}from"@phosphor-icons/react/Lock";const b=e=>Array.isArray(e)&&e.every(e=>typeof e==`string`),x=[],S=o({current:null}),C=o({current:[]}),w=o({onInputKeyDownRef:{current:void 0},inputRef:{current:null}}),T=({children:e,defaultSelectedValue:t=[],...n})=>{let r=f(null),i=f(void 0),a=f(null),o=f([]),s=d(()=>({onInputKeyDownRef:i,inputRef:a}),[]);return m(S.Provider,{value:r,children:m(w.Provider,{value:s,children:m(C.Provider,{value:o,children:m(v.ComboboxProvider,{defaultSelectedValue:t,...n,children:e})})})})};T.displayName=`MultiSelect`;const E=s(({"aria-invalid":t,className:n,children:i,onKeyDown:a,onMouseDown:o,validation:s,...c},u)=>{let d=l(S),{inputRef:f}=l(w),p=v.useComboboxContext(),h=t!=null&&t!==`false`?`error`:typeof s==`function`?s():s;return m(`div`,{role:`group`,"data-slot":`multi-select-trigger`,className:e(`cursor-text select-none font-sans text-sm`,`border-form bg-form text-strong flex min-h-9 w-full flex-wrap items-center gap-1 rounded-md border px-3 py-1 has-[[data-slot=multi-select-tag]]:px-1`,`has-focus:outline-hidden has-focus-within:ring-4 has-aria-expanded:ring-4`,`has-focus-within:border-accent-600 has-focus-within:ring-focus-accent has-aria-expanded:border-accent-600 has-aria-expanded:ring-focus-accent`,`data-validation-success:border-success-600 data-validation-success:has-focus-within:border-success-600 data-validation-success:has-focus-within:ring-focus-success data-validation-success:has-aria-expanded:border-success-600 data-validation-success:has-aria-expanded:ring-focus-success`,`data-validation-warning:border-warning-600 data-validation-warning:has-focus-within:border-warning-600 data-validation-warning:has-focus-within:ring-focus-warning data-validation-warning:has-aria-expanded:border-warning-600 data-validation-warning:has-aria-expanded:ring-focus-warning`,`data-validation-error:border-danger-600 data-validation-error:has-focus-within:border-danger-600 data-validation-error:has-focus-within:ring-focus-danger data-validation-error:has-aria-expanded:border-danger-600 data-validation-error:has-aria-expanded:ring-focus-danger`,n),"data-validation":h||void 0,onKeyDown:e=>{e.key===`Escape`&&p?.getState().open&&(e.preventDefault(),p.hide()),a?.(e)},onMouseDown:e=>{e.target instanceof HTMLElement&&!e.target.closest(`button, input, [role='option']`)&&(e.preventDefault(),f.current?.focus()),o?.(e)},ref:r(d,u),...c,children:i})});E.displayName=`MultiSelectTrigger`;const D=s(({className:n,value:i,onRemove:a,locked:o=!1,onKeyDown:s,...c},l)=>{let u=f(null);return h(`span`,{ref:r(u,l),role:`option`,"aria-selected":!0,tabIndex:-1,"data-slot":`multi-select-tag`,"data-locked":o||void 0,className:e(`cursor-default bg-neutral-500/10 border border-neutral-500/20 rounded-xs text-strong inline-flex items-center gap-1 pl-2 pr-0.5 py-0.5 text-sm font-normal`,`focus-visible:outline-hidden focus-visible:border-accent-600/50 focus-visible:ring-3 focus-visible:ring-focus-accent`,n),onKeyDown:e=>{if(o&&(e.key===`Backspace`||e.key===`Delete`)){e.preventDefault(),z(e.currentTarget);return}s?.(e)},...c,children:[i,m(`button`,{type:`button`,"aria-label":`Remove ${i}`,tabIndex:-1,"aria-disabled":o||void 0,className:e(`cursor-pointer text-strong/40 hover:bg-neutral-500/15 hover:text-strong rounded-xs p-0.5`,`aria-disabled:cursor-default aria-disabled:hover:bg-transparent aria-disabled:hover:text-strong/40`),onClick:e=>{if(e.stopPropagation(),o){let e=u.current;e&&z(e);return}a?.()},onMouseDown:e=>{e.preventDefault()},children:m(t,{svg:o?m(y,{}):m(g,{weight:`bold`}),className:`size-4`})})]})});D.displayName=`MultiSelectTag`;const O=({children:e,lockedValues:t=[]})=>{let n=v.useComboboxContext(),r=v.useStoreState(n,`selectedValue`),i=(b(r)?r:void 0)??x,a=f(i);a.current=i;let o=l(C);o.current=t;let s=d(()=>new Set(t),[t]),c=f(new Map),{onInputKeyDownRef:h,inputRef:g}=l(w),_=f(new Set);u(()=>()=>{_.current.forEach(cancelAnimationFrame)},[]);let y=e=>{let t;t=requestAnimationFrame(()=>{_.current.delete(t),e()}),_.current.add(t)},S=e=>{if(n){let t=n.getState().selectedValue;if(!b(t))return;n.setSelectedValue(t.filter(t=>t!==e))}},T=e=>{let t=a.current[e];if(t==null)return;let r=c.current.get(t);r&&(r.focus(),n?.show())},E=()=>{g.current?.focus()},O=(e,t)=>{let n=i[t];switch(e.key){case`ArrowLeft`:e.preventDefault(),t>0&&T(t-1);break;case`ArrowRight`:e.preventDefault(),t<i.length-1?T(t+1):E();break;case`Backspace`:case`Delete`:if(e.preventDefault(),n!=null){if(s.has(n)){let e=c.current.get(n);e&&z(e);break}if(S(n),e.key===`Backspace`)if(t>0){let e=t-1;y(()=>T(e))}else y(()=>{a.current.length>0?T(0):E()});else y(()=>{t<a.current.length?T(t):E()})}break;case`ArrowUp`:case`ArrowDown`:e.preventDefault(),E(),g.current?.dispatchEvent(new KeyboardEvent(`keydown`,{key:e.key,bubbles:!0,cancelable:!0,shiftKey:e.shiftKey,ctrlKey:e.ctrlKey,metaKey:e.metaKey,altKey:e.altKey}));break;default:e.key.length===1&&!e.ctrlKey&&!e.metaKey&&E();break}};return h.current=e=>{if(e.key===`ArrowLeft`&&e.currentTarget.selectionStart===0&&e.currentTarget.selectionEnd===0&&i.length>0){e.preventDefault(),T(i.length-1);return}if(e.key===`Backspace`&&e.currentTarget.value===``&&i.length>0){let e=i[i.length-1];if(e!=null)if(o.current.includes(e)){let t=c.current.get(e);t&&z(t)}else S(e)}},m(p,{children:i.map((t,n)=>{let r={value:t,locked:s.has(t),onRemove:()=>{if(s.has(t)){let e=c.current.get(t);e&&z(e);return}S(t)},ref:e=>{e?c.current.set(t,e):c.current.delete(t)},onKeyDown:e=>O(e,n),onClick:()=>T(n)};return e?e(r):m(D,{...r},t)})})};O.displayName=`MultiSelectTagValues`;const k=s(({className:t,onBlur:n,onChange:i,onFocus:a,onKeyDown:o,onValueChange:s,placeholder:c,...u},d)=>{let f=v.useComboboxContext(),{onInputKeyDownRef:p,inputRef:h}=l(w),g=v.useStoreState(f,`selectedValue`),_=((b(g)?g:void 0)?.length??0)>0;return m(v.Combobox,{autoSelect:!0,"data-slot":`multi-select-input`,className:e(`pointer-coarse:text-base min-w-20 flex-1 select-text border-0 bg-transparent text-sm outline-hidden`,`placeholder:select-none placeholder:text-placeholder`,t),onChange:e=>{s?.(e.target.value),i?.(e)},onKeyDown:e=>{p.current?.(e),o?.(e)},onBlur:e=>{e.relatedTarget instanceof HTMLElement&&e.relatedTarget.closest(`[data-slot="multi-select-tag"]`)&&f?.show(),n?.(e)},onFocus:e=>{f?.show(),a?.(e)},placeholder:_?void 0:c,ref:r(h,d),...u})});k.displayName=`MultiSelectInput`;const A=s(({asChild:t=!1,backdrop:r=!1,children:i,className:a,modal:o=!0,portalElement:s,sameWidth:u=!0,unmountOnHide:d=!0,...f},p)=>{let h=l(S),g=c(()=>h.current?.getBoundingClientRect()??null,[h]),_=c(e=>typeof s==`function`?s(e):s??h.current?.closest(`[data-mantle-modal-content]`)??e.ownerDocument.body,[s,h]),y=c(e=>!(e.target instanceof Node&&h.current?.contains(e.target)),[h]);return m(v.ComboboxPopover,{"data-slot":`multi-select-content`,className:e(`border-popover bg-popover relative z-50 max-h-96 min-w-32 scrollbar overflow-y-scroll overflow-x-hidden overscroll-y-none rounded-md border shadow-md pt-1 pb-1 has-data-content-footer:pb-0 font-sans flex flex-col gap-px focus:outline-hidden`,a),backdrop:r,getAnchorRect:g,gutter:4,hideOnInteractOutside:y,modal:o,portalElement:_,ref:p,render:t?({ref:e,...t})=>m(n,{ref:e,...t}):void 0,sameWidth:u,unmountOnHide:d,...f,children:i})});A.displayName=`MultiSelectContent`;const j=s(({asChild:r=!1,children:i,className:a,focusOnHover:o=!0,value:s,onClick:c,...u},d)=>{let f=l(C),p=s!=null&&f.current.includes(s);return h(v.ComboboxItem,{"data-slot":`multi-select-item`,className:e(`relative mx-1 cursor-pointer rounded-md pl-2 pr-8 py-1.5 text-strong text-sm font-normal flex min-w-0 items-center gap-2`,`[[role=option]+&]:mt-px`,`data-active-item:bg-active-menu-item`,`aria-disabled:opacity-50`,`aria-selected:bg-selected-menu-item aria-selected:data-active-item:bg-active-selected-menu-item`,a),focusOnHover:o,onClick:e=>{if(p){e.preventDefault();return}c?.(e)},ref:d,render:r?({ref:e,...t})=>m(n,{ref:e,...t}):void 0,resetValueOnSelect:!0,value:s,...u,children:[i,m(v.ComboboxItemCheck,{className:`absolute right-2 flex h-3.5 w-3.5 items-center justify-center`,children:m(t,{svg:m(_,{weight:`bold`}),className:`size-4 text-accent-600`})})]})});j.displayName=`MultiSelectItem`;const M=s(({asChild:e=!1,children:t,...r},i)=>m(v.ComboboxGroup,{"data-slot":`multi-select-group`,className:`mx-1`,ref:i,render:e?({ref:e,...t})=>m(n,{ref:e,...t}):void 0,...r,children:t}));M.displayName=`MultiSelectGroup`;const N=s(({asChild:t=!1,children:r,className:i,...a},o)=>m(v.ComboboxGroupLabel,{"data-slot":`multi-select-group-label`,className:e(`text-muted px-2 py-1 text-xs font-medium`,i),ref:o,render:t?({ref:e,...t})=>m(n,{ref:e,...t}):void 0,...a,children:r}));N.displayName=`MultiSelectGroupLabel`;const P=s(({className:t,children:n,...r},i)=>m(`p`,{"data-slot":`multi-select-group-description`,className:e(`text-muted px-2 pb-1 text-xs`,t),ref:i,...r,children:n}));P.displayName=`MultiSelectGroupDescription`;const F=s(({className:t,...n},r)=>m(i,{"data-slot":`multi-select-separator`,ref:r,className:e(`my-1 w-auto`,t),...n}));F.displayName=`MultiSelectSeparator`;const I=s(({className:t,children:n,...r},i)=>m(`div`,{"data-slot":`multi-select-empty`,className:e(`mx-1 text-muted px-2 py-6 text-center text-sm`,t),ref:i,role:`presentation`,...r,children:n}));I.displayName=`MultiSelectEmpty`;const L=s(({className:t,children:n,...r},i)=>m(`div`,{ref:i,"data-slot":`multi-select-content-footer`,"data-content-footer":!0,className:e(`bg-popover sticky bottom-0 border-t border-popover`,t),...r,children:n}));L.displayName=`MultiSelectContentFooter`;const R={Root:T,Trigger:E,TagValues:O,Input:k,Tag:D,Content:A,ContentFooter:L,Item:j,Group:M,GroupLabel:N,GroupDescription:P,Separator:F,Empty:I};function z(e){a()||e.animate([{transform:`translateX(0)`},{transform:`translateX(-4px)`},{transform:`translateX(4px)`},{transform:`translateX(-4px)`},{transform:`translateX(4px)`},{transform:`translateX(0)`}],{duration:300,easing:`ease-in-out`})}export{R as MultiSelect};
2
2
  //# sourceMappingURL=multi-select.js.map
@@ -1,6 +1,6 @@
1
- import { t as WithAsChild } from "./as-child-CJ2vTesV.js";
2
- import { t as ButtonGroup } from "./index-DU3SQJ46.js";
3
- import { t as Select } from "./select-DNJli9JO.js";
1
+ import { t as WithAsChild } from "./as-child-DQHfEmYB.js";
2
+ import { t as ButtonGroup } from "./index-DOJUH34Z.js";
3
+ import { t as Select } from "./select-BjpP51vO.js";
4
4
  import * as _$react from "react";
5
5
  import { ComponentProps } from "react";
6
6
  import * as _$react_jsx_runtime0 from "react/jsx-runtime";
@@ -1,2 +1,2 @@
1
- import{t as e}from"./cx-D1HYnpvA.js";import{t}from"./slot-D_ZUrdEW.js";import{t as n}from"./icon-button-ZKN0sRIJ.js";import{t as r}from"./button-POMJ-20y.js";import{n as i}from"./separator-DyOGgFCs.js";import{t as a}from"./select-LJmfG--I.js";import{createContext as o,forwardRef as s,useContext as c,useEffect as l,useState as u}from"react";import d from"tiny-invariant";import{jsx as f,jsxs as p}from"react/jsx-runtime";import{CaretLeftIcon as m}from"@phosphor-icons/react/CaretLeft";import{CaretRightIcon as h}from"@phosphor-icons/react/CaretRight";const g=o(void 0),_=s(({className:t,children:n,defaultPageSize:r,...i},a)=>{let[o,s]=u(r);return f(g.Provider,{value:{defaultPageSize:r,pageSize:o,setPageSize:s},children:f(`div`,{"data-slot":`cursor-pagination`,className:e(`inline-flex items-center justify-between gap-2`,t),ref:a,...i,children:n})})});_.displayName=`CursorPagination`;const v=s(({hasNextPage:e,hasPreviousPage:t,onNextPage:a,onPreviousPage:o,...s},c)=>p(r,{"data-slot":`cursor-pagination-buttons`,appearance:`panel`,ref:c,...s,children:[f(n,{"data-slot":`cursor-pagination-previous`,appearance:`ghost`,disabled:!t,icon:f(m,{}),label:`Previous page`,onClick:o,size:`sm`,type:`button`}),f(i,{"data-slot":`cursor-pagination-separator`,orientation:`vertical`,className:`min-h-5`}),f(n,{"data-slot":`cursor-pagination-next`,appearance:`ghost`,disabled:!e,icon:f(h,{}),label:`Next page`,onClick:a,size:`sm`,type:`button`})]}));v.displayName=`CursorButtons`;const y=[5,10,20,50,100],b=s(({className:t,pageSizes:n=y,onChangePageSize:r,...i},o)=>{let s=c(g);return d(s,`CursorPageSizeSelect must be used as a child of a CursorPagination component`),d(n.includes(s.defaultPageSize),`CursorPagination.defaultPageSize must be included in CursorPageSizeSelect.pageSizes`),d(n.includes(s.pageSize),`CursorPagination.pageSize must be included in CursorPageSizeSelect.pageSizes`),p(a.Root,{defaultValue:`${s.pageSize}`,onValueChange:e=>{let t=Number.parseInt(e,10);Number.isNaN(t)&&(t=s.defaultPageSize),s.setPageSize(t),r?.(t)},children:[f(a.Trigger,{ref:o,"data-slot":`cursor-pagination-page-size-select`,className:e(`w-auto min-w-36`,t),value:s.pageSize,...i,children:f(a.Value,{})}),f(a.Content,{width:`trigger`,children:n.map(e=>p(a.Item,{value:`${e}`,children:[e,` per page`]},e))})]})});b.displayName=`CursorPageSizeSelect`;function x({asChild:n=!1,className:r,...i}){let a=c(g);return d(a,`CursorPageSizeValue must be used as a child of a CursorPagination component`),p(n?t:`span`,{"data-slot":`cursor-pagination-page-size-value`,className:e(`text-muted text-sm font-normal`,r),...i,children:[a.pageSize,` per page`]})}x.displayName=`CursorPageSizeValue`;const S={Root:_,Buttons:v,PageSizeSelect:b,PageSizeValue:x};function C({listSize:e,pageSize:t}){let[n,r]=u(1),[i,a]=u(t);l(()=>{a(t),r(1)},[t]),l(()=>{r(1)},[e]);let o=Math.ceil(e/i),s=(n-1)*i,c=n>1,d=n<o;function f(e){r(Math.max(1,Math.min(e,o)))}function p(){d&&r(e=>Math.min(e+1,o))}function m(){c&&r(e=>Math.max(e-1,1))}function h(e){a(e),r(1)}function g(){r(o)}function _(){r(1)}return{currentPage:n,goToFirstPage:_,goToLastPage:g,goToPage:f,hasNextPage:d,hasPreviousPage:c,nextPage:p,offset:s,pageSize:i,previousPage:m,setPageSize:h,totalPages:o}}function w(e,t){return e.slice(t.offset,t.offset+t.pageSize)}export{S as CursorPagination,w as getOffsetPaginatedSlice,C as useOffsetPagination};
1
+ import{t as e}from"./cx-D1HYnpvA.js";import{t}from"./slot-D_ZUrdEW.js";import{t as n}from"./icon-button-ZKN0sRIJ.js";import{t as r}from"./button-POMJ-20y.js";import{n as i}from"./separator-DSOIrnhj.js";import{t as a}from"./select-DOgdZO0Q.js";import{createContext as o,forwardRef as s,useContext as c,useEffect as l,useState as u}from"react";import d from"tiny-invariant";import{jsx as f,jsxs as p}from"react/jsx-runtime";import{CaretLeftIcon as m}from"@phosphor-icons/react/CaretLeft";import{CaretRightIcon as h}from"@phosphor-icons/react/CaretRight";const g=o(void 0),_=s(({className:t,children:n,defaultPageSize:r,...i},a)=>{let[o,s]=u(r);return f(g.Provider,{value:{defaultPageSize:r,pageSize:o,setPageSize:s},children:f(`div`,{"data-slot":`cursor-pagination`,className:e(`inline-flex items-center justify-between gap-2`,t),ref:a,...i,children:n})})});_.displayName=`CursorPagination`;const v=s(({hasNextPage:e,hasPreviousPage:t,onNextPage:a,onPreviousPage:o,...s},c)=>p(r,{"data-slot":`cursor-pagination-buttons`,appearance:`panel`,ref:c,...s,children:[f(n,{"data-slot":`cursor-pagination-previous`,appearance:`ghost`,disabled:!t,icon:f(m,{}),label:`Previous page`,onClick:o,size:`sm`,type:`button`}),f(i,{"data-slot":`cursor-pagination-separator`,orientation:`vertical`,className:`min-h-5`}),f(n,{"data-slot":`cursor-pagination-next`,appearance:`ghost`,disabled:!e,icon:f(h,{}),label:`Next page`,onClick:a,size:`sm`,type:`button`})]}));v.displayName=`CursorButtons`;const y=[5,10,20,50,100],b=s(({className:t,pageSizes:n=y,onChangePageSize:r,...i},o)=>{let s=c(g);return d(s,`CursorPageSizeSelect must be used as a child of a CursorPagination component`),d(n.includes(s.defaultPageSize),`CursorPagination.defaultPageSize must be included in CursorPageSizeSelect.pageSizes`),d(n.includes(s.pageSize),`CursorPagination.pageSize must be included in CursorPageSizeSelect.pageSizes`),p(a.Root,{defaultValue:`${s.pageSize}`,onValueChange:e=>{let t=Number.parseInt(e,10);Number.isNaN(t)&&(t=s.defaultPageSize),s.setPageSize(t),r?.(t)},children:[f(a.Trigger,{ref:o,"data-slot":`cursor-pagination-page-size-select`,className:e(`w-auto min-w-36`,t),value:s.pageSize,...i,children:f(a.Value,{})}),f(a.Content,{width:`trigger`,children:n.map(e=>p(a.Item,{value:`${e}`,children:[e,` per page`]},e))})]})});b.displayName=`CursorPageSizeSelect`;function x({asChild:n=!1,className:r,...i}){let a=c(g);return d(a,`CursorPageSizeValue must be used as a child of a CursorPagination component`),p(n?t:`span`,{"data-slot":`cursor-pagination-page-size-value`,className:e(`text-muted text-sm font-normal`,r),...i,children:[a.pageSize,` per page`]})}x.displayName=`CursorPageSizeValue`;const S={Root:_,Buttons:v,PageSizeSelect:b,PageSizeValue:x};function C({listSize:e,pageSize:t}){let[n,r]=u(1),[i,a]=u(t);l(()=>{a(t),r(1)},[t]),l(()=>{r(1)},[e]);let o=Math.ceil(e/i),s=(n-1)*i,c=n>1,d=n<o;function f(e){r(Math.max(1,Math.min(e,o)))}function p(){d&&r(e=>Math.min(e+1,o))}function m(){c&&r(e=>Math.max(e-1,1))}function h(e){a(e),r(1)}function g(){r(o)}function _(){r(1)}return{currentPage:n,goToFirstPage:_,goToLastPage:g,goToPage:f,hasNextPage:d,hasPreviousPage:c,nextPage:p,offset:s,pageSize:i,previousPage:m,setPageSize:h,totalPages:o}}function w(e,t){return e.slice(t.offset,t.offset+t.pageSize)}export{S as CursorPagination,w as getOffsetPaginatedSlice,C as useOffsetPagination};
2
2
  //# sourceMappingURL=pagination.js.map
@@ -13,4 +13,4 @@ declare namespace Root {
13
13
  declare function isDialogOverlayTarget(target: EventTarget | null): boolean;
14
14
  //#endregion
15
15
  export { isDialogOverlayTarget as n, Root as t };
16
- //# sourceMappingURL=primitive-DXo0gUqw.d.ts.map
16
+ //# sourceMappingURL=primitive-tyw4V7Vf.d.ts.map