@ngrok/mantle 0.70.0 → 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 (213) hide show
  1. package/dist/accordion.d.ts +2 -2
  2. package/dist/accordion.js +1 -1
  3. package/dist/accordion.js.map +1 -1
  4. package/dist/alert-dialog.d.ts +6 -6
  5. package/dist/alert-dialog.js +1 -1
  6. package/dist/alert-dialog.js.map +1 -1
  7. package/dist/alert.d.ts +3 -3
  8. package/dist/alert.js +1 -1
  9. package/dist/alert.js.map +1 -1
  10. package/dist/anchor-2stEauOz.js +2 -0
  11. package/dist/anchor-2stEauOz.js.map +1 -0
  12. package/dist/anchor.d.ts +1 -1
  13. package/dist/anchor.js +1 -1
  14. package/dist/{as-child-CJ2vTesV.d.ts → as-child-DQHfEmYB.d.ts} +1 -1
  15. package/dist/badge.d.ts +2 -2
  16. package/dist/badge.js +1 -1
  17. package/dist/badge.js.map +1 -1
  18. package/dist/{button-DDK6nEac.d.ts → button-BMgAxAwM.d.ts} +3 -3
  19. package/dist/{button-BKykcpgJ.js → button-GokecthL.js} +2 -2
  20. package/dist/{button-BKykcpgJ.js.map → button-GokecthL.js.map} +1 -1
  21. package/dist/button-POMJ-20y.js +2 -0
  22. package/dist/button-POMJ-20y.js.map +1 -0
  23. package/dist/button.d.ts +3 -3
  24. package/dist/button.js +1 -1
  25. package/dist/calendar.js +1 -1
  26. package/dist/calendar.js.map +1 -1
  27. package/dist/card.d.ts +1 -1
  28. package/dist/card.js +1 -1
  29. package/dist/card.js.map +1 -1
  30. package/dist/checkbox.d.ts +2 -2
  31. package/dist/checkbox.js +1 -1
  32. package/dist/checkbox.js.map +1 -1
  33. package/dist/code-block.d.ts +3 -3
  34. package/dist/code-block.js +1 -1
  35. package/dist/code-block.js.map +1 -1
  36. package/dist/code-block_highlight-utils.d.ts +1 -1
  37. package/dist/code-block_highlight-utils.js +1 -1
  38. package/dist/code.d.ts +2 -2
  39. package/dist/code.js +1 -1
  40. package/dist/code.js.map +1 -1
  41. package/dist/color.d.ts +1 -1
  42. package/dist/combobox.d.ts +2 -2
  43. package/dist/combobox.js +1 -1
  44. package/dist/combobox.js.map +1 -1
  45. package/dist/command.d.ts +4 -4
  46. package/dist/command.js +1 -1
  47. package/dist/command.js.map +1 -1
  48. package/dist/compose-refs-DZ3cPi47.js +2 -0
  49. package/dist/compose-refs-DZ3cPi47.js.map +1 -0
  50. package/dist/copy-to-clipboard-DjOD_Mwb.js +2 -0
  51. package/dist/copy-to-clipboard-DjOD_Mwb.js.map +1 -0
  52. package/dist/data-table.d.ts +246 -72
  53. package/dist/data-table.js +1 -1
  54. package/dist/data-table.js.map +1 -1
  55. package/dist/{deep-non-nullable-DwBZzk4x.d.ts → deep-non-nullable-VFm1T3JZ.d.ts} +1 -1
  56. package/dist/description-list.d.ts +1 -1
  57. package/dist/description-list.js +1 -1
  58. package/dist/description-list.js.map +1 -1
  59. package/dist/dialog-BHzl9eye.js +2 -0
  60. package/dist/dialog-BHzl9eye.js.map +1 -0
  61. package/dist/dialog.d.ts +4 -4
  62. package/dist/dialog.js +1 -1
  63. package/dist/{direction-ClCocWIf.js → direction-DsB-pD9V.js} +1 -1
  64. package/dist/{direction-ClCocWIf.js.map → direction-DsB-pD9V.js.map} +1 -1
  65. package/dist/{direction-Jk7BkzGo.d.ts → direction-DtBAQn7p.d.ts} +1 -1
  66. package/dist/{dropdown-menu-BwQDoun1.d.ts → dropdown-menu-CzUNYIfA.d.ts} +3 -3
  67. package/dist/dropdown-menu-Ducs2SEn.js +2 -0
  68. package/dist/dropdown-menu-Ducs2SEn.js.map +1 -0
  69. package/dist/dropdown-menu.d.ts +1 -1
  70. package/dist/dropdown-menu.js +1 -1
  71. package/dist/empty.d.ts +6 -4
  72. package/dist/empty.js +1 -1
  73. package/dist/empty.js.map +1 -1
  74. package/dist/flag.js +1 -1
  75. package/dist/flag.js.map +1 -1
  76. package/dist/hooks.d.ts +5 -6
  77. package/dist/hooks.js +1 -1
  78. package/dist/hover-card.d.ts +9 -1
  79. package/dist/hover-card.js +1 -1
  80. package/dist/hover-card.js.map +1 -1
  81. package/dist/{icon-C7Dje_lR.d.ts → icon-DKMJm20j.d.ts} +2 -2
  82. package/dist/icon-bWc5yC3-.js +2 -0
  83. package/dist/{icon-BMH0fD_b.js.map → icon-bWc5yC3-.js.map} +1 -1
  84. package/dist/{icon-button-Cl30yTfu.d.ts → icon-button-BnK4K7YK.d.ts} +3 -3
  85. package/dist/{icon-button-CxxVPiKp.js → icon-button-ZKN0sRIJ.js} +2 -2
  86. package/dist/{icon-button-CxxVPiKp.js.map → icon-button-ZKN0sRIJ.js.map} +1 -1
  87. package/dist/icon.d.ts +3 -3
  88. package/dist/icon.js +1 -1
  89. package/dist/icons.d.ts +3 -3
  90. package/dist/icons.js +1 -1
  91. package/dist/{in-view-DsiWfQpY.d.ts → in-view-Da08Bx6l.d.ts} +15 -4
  92. package/dist/{in-view-BXzPPdcl.js → in-view-pia_SVdE.js} +1 -1
  93. package/dist/{in-view-BXzPPdcl.js.map → in-view-pia_SVdE.js.map} +1 -1
  94. package/dist/{index-A354MgUP.d.ts → index-DMAkXvFI.d.ts} +5 -5
  95. package/dist/{index-DFBA9X1i.d.ts → index-DOJUH34Z.d.ts} +4 -3
  96. package/dist/{index-B6SPk_xb.d.ts → index-DkMUaYsw.d.ts} +1 -1
  97. package/dist/{index-vOSpS5jv.d.ts → index-rtz7SwEq.d.ts} +1 -1
  98. package/dist/input.d.ts +2 -2
  99. package/dist/input.js +1 -1
  100. package/dist/input.js.map +1 -1
  101. package/dist/{is-input-Bh1rQhX3.js → is-input-CUEWaxtA.js} +1 -1
  102. package/dist/{is-input-Bh1rQhX3.js.map → is-input-CUEWaxtA.js.map} +1 -1
  103. package/dist/kbd-CAVUiqBT.js +2 -0
  104. package/dist/{kbd-GS-e4ICt.js.map → kbd-CAVUiqBT.js.map} +1 -1
  105. package/dist/kbd.js +1 -1
  106. package/dist/label.js +1 -1
  107. package/dist/label.js.map +1 -1
  108. package/dist/main.js +1 -1
  109. package/dist/main.js.map +1 -1
  110. package/dist/media-object.d.ts +1 -1
  111. package/dist/media-object.js +1 -1
  112. package/dist/media-object.js.map +1 -1
  113. package/dist/multi-select.d.ts +2 -2
  114. package/dist/multi-select.js +1 -1
  115. package/dist/pagination.d.ts +3 -3
  116. package/dist/pagination.js +1 -1
  117. package/dist/pagination.js.map +1 -1
  118. package/dist/popover.d.ts +12 -0
  119. package/dist/popover.js +1 -1
  120. package/dist/popover.js.map +1 -1
  121. package/dist/{primitive-pggbsddf.js → primitive-tXm_8n_t.js} +2 -2
  122. package/dist/{primitive-pggbsddf.js.map → primitive-tXm_8n_t.js.map} +1 -1
  123. package/dist/{primitive-DXo0gUqw.d.ts → primitive-tyw4V7Vf.d.ts} +1 -1
  124. package/dist/progress.js +1 -1
  125. package/dist/progress.js.map +1 -1
  126. package/dist/radio-group.d.ts +1 -1
  127. package/dist/radio-group.js +1 -1
  128. package/dist/radio-group.js.map +1 -1
  129. package/dist/{resolve-pre-rendered-props-BXv6e6fc.js → resolve-pre-rendered-props-C-kiaLHj.js} +1 -1
  130. package/dist/{resolve-pre-rendered-props-BXv6e6fc.js.map → resolve-pre-rendered-props-C-kiaLHj.js.map} +1 -1
  131. package/dist/{resolve-pre-rendered-props-kcQrtWPt.d.ts → resolve-pre-rendered-props-x-52gvQ1.d.ts} +2 -2
  132. package/dist/sandboxed-on-click.d.ts +1 -1
  133. package/dist/{select-DNJli9JO.d.ts → select-BjpP51vO.d.ts} +3 -3
  134. package/dist/select-DOgdZO0Q.js +2 -0
  135. package/dist/select-DOgdZO0Q.js.map +1 -0
  136. package/dist/select.d.ts +1 -1
  137. package/dist/select.js +1 -1
  138. package/dist/separator-DSOIrnhj.js +2 -0
  139. package/dist/separator-DSOIrnhj.js.map +1 -0
  140. package/dist/separator.d.ts +1 -1
  141. package/dist/separator.js +1 -1
  142. package/dist/sheet.d.ts +2 -2
  143. package/dist/sheet.js +1 -1
  144. package/dist/sheet.js.map +1 -1
  145. package/dist/skeleton.js +1 -1
  146. package/dist/skeleton.js.map +1 -1
  147. package/dist/skip-to-main-link.js +1 -1
  148. package/dist/skip-to-main-link.js.map +1 -1
  149. package/dist/{sort-C_Jbs1dH.js → sort-DzCsa6Qj.js} +2 -2
  150. package/dist/{sort-C_Jbs1dH.js.map → sort-DzCsa6Qj.js.map} +1 -1
  151. package/dist/split-button.d.ts +3 -3
  152. package/dist/split-button.js +1 -1
  153. package/dist/{svg-only-DnZldAY9.js → svg-only-7gYlsX8f.js} +2 -2
  154. package/dist/{svg-only-DnZldAY9.js.map → svg-only-7gYlsX8f.js.map} +1 -1
  155. package/dist/{svg-only-B-xzpaiu.d.ts → svg-only-BtBvFy-N.d.ts} +2 -2
  156. package/dist/switch.js +1 -1
  157. package/dist/switch.js.map +1 -1
  158. package/dist/{table-4q1UxE7L.d.ts → table--DsTqaWO.d.ts} +1 -1
  159. package/dist/table-Cl4nlRMR.js +2 -0
  160. package/dist/table-Cl4nlRMR.js.map +1 -0
  161. package/dist/table.d.ts +1 -1
  162. package/dist/table.js +1 -1
  163. package/dist/tabs.js +1 -1
  164. package/dist/tabs.js.map +1 -1
  165. package/dist/text-area.d.ts +1 -1
  166. package/dist/text-area.js +1 -1
  167. package/dist/text-area.js.map +1 -1
  168. package/dist/theme.d.ts +1 -1
  169. package/dist/{themes-DXb8Tk74.d.ts → themes-DIEYkvNl.d.ts} +1 -1
  170. package/dist/toast-CGnquSKO.js +2 -0
  171. package/dist/toast-CGnquSKO.js.map +1 -0
  172. package/dist/toast.d.ts +3 -3
  173. package/dist/toast.js +1 -1
  174. package/dist/tooltip.d.ts +9 -2
  175. package/dist/tooltip.js.map +1 -1
  176. package/dist/{traffic-policy-file-ChsoQtXQ.js → traffic-policy-file-C6LHYrIU.js} +1 -1
  177. package/dist/{traffic-policy-file-ChsoQtXQ.js.map → traffic-policy-file-C6LHYrIU.js.map} +1 -1
  178. package/dist/{types-BeTbgoJd.d.ts → types-DG0WQLTL.d.ts} +1 -1
  179. package/dist/types-DoV0R5Ja.d.ts +30 -0
  180. package/dist/types.d.ts +5 -5
  181. package/dist/use-copy-to-clipboard-C7vsjJe-.js +2 -0
  182. package/dist/use-copy-to-clipboard-C7vsjJe-.js.map +1 -0
  183. package/dist/{use-prefers-reduced-motion-BcwST13S.js → use-prefers-reduced-motion-aXfsyo-k.js} +1 -1
  184. package/dist/{use-prefers-reduced-motion-BcwST13S.js.map → use-prefers-reduced-motion-aXfsyo-k.js.map} +1 -1
  185. package/dist/utils.d.ts +3 -3
  186. package/dist/utils.js +1 -1
  187. package/dist/utils.js.map +1 -1
  188. package/dist/{variant-props-DszdagRm.d.ts → variant-props-DUmSIQK8.d.ts} +2 -2
  189. package/dist/{with-style-props-Dlz3G1tS.d.ts → with-style-props-3iFrBR08.d.ts} +1 -1
  190. package/package.json +1 -1
  191. package/dist/anchor-BtIZueBA.js +0 -2
  192. package/dist/anchor-BtIZueBA.js.map +0 -1
  193. package/dist/button-DdrxOnUb.js +0 -2
  194. package/dist/button-DdrxOnUb.js.map +0 -1
  195. package/dist/compose-refs-DFIaEnQH.js +0 -2
  196. package/dist/compose-refs-DFIaEnQH.js.map +0 -1
  197. package/dist/dialog-Cw3E0Wr9.js +0 -2
  198. package/dist/dialog-Cw3E0Wr9.js.map +0 -1
  199. package/dist/dropdown-menu-Bfi9ODPB.js +0 -2
  200. package/dist/dropdown-menu-Bfi9ODPB.js.map +0 -1
  201. package/dist/icon-BMH0fD_b.js +0 -2
  202. package/dist/kbd-GS-e4ICt.js +0 -2
  203. package/dist/select-BPzMl3gm.js +0 -2
  204. package/dist/select-BPzMl3gm.js.map +0 -1
  205. package/dist/separator-Yk9hMn8E.js +0 -2
  206. package/dist/separator-Yk9hMn8E.js.map +0 -1
  207. package/dist/table-BMGcRJlk.js +0 -2
  208. package/dist/table-BMGcRJlk.js.map +0 -1
  209. package/dist/toast-BhAyUXKL.js +0 -2
  210. package/dist/toast-BhAyUXKL.js.map +0 -1
  211. package/dist/types-zKzi66a6.d.ts +0 -9
  212. package/dist/use-copy-to-clipboard-Ds9MsSNU.js +0 -2
  213. package/dist/use-copy-to-clipboard-Ds9MsSNU.js.map +0 -1
package/dist/empty.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"empty.js","names":[],"sources":["../src/components/empty/empty.tsx"],"sourcesContent":["import type { ComponentProps, HTMLAttributes, ReactNode } from \"react\";\nimport type { WithAsChild } from \"../../types/as-child.js\";\nimport { cx } from \"../../utils/cx/cx.js\";\nimport { SvgOnly } from \"../icon/svg-only.js\";\nimport type { SvgAttributes } from \"../icon/types.js\";\nimport { Slot } from \"../slot/index.js\";\n\n/**\n * The root container for an empty state. Centers content horizontally\n * with consistent vertical padding and max-width.\n *\n * @see https://mantle.ngrok.com/components/empty\n *\n * @example\n * ```tsx\n * <Empty.Root>\n * <Empty.Icon svg={<GhostIcon />} />\n * <Empty.Title>No results found</Empty.Title>\n * <Empty.Description>Try adjusting your search or filters.</Empty.Description>\n * <Empty.Actions>\n * <Button>Clear filters</Button>\n * </Empty.Actions>\n * </Empty.Root>\n * ```\n */\nconst Root = ({ children, className, ...props }: ComponentProps<\"div\">) => {\n\treturn (\n\t\t<div\n\t\t\tclassName={cx(\"mx-auto flex max-w-lg flex-col items-center py-14 text-center\", className)}\n\t\t\t{...props}\n\t\t>\n\t\t\t{children}\n\t\t</div>\n\t);\n};\nRoot.displayName = \"Empty\";\n\ntype EmptyIconProps = Omit<SvgAttributes, \"children\"> & {\n\t/**\n\t * A single SVG icon element.\n\t */\n\tsvg: ReactNode;\n};\n\n/**\n * Renders a large icon for the empty state. Pass a single SVG icon element\n * via the `svg` prop (e.g. from `@phosphor-icons/react`).\n *\n * @see https://mantle.ngrok.com/components/empty\n *\n * @example\n * ```tsx\n * <Empty.Root>\n * <Empty.Icon svg={<GhostIcon />} />\n * <Empty.Title>No endpoints yet</Empty.Title>\n * <Empty.Description>Create your first endpoint to get started.</Empty.Description>\n * <Empty.Actions>\n * <Button>Create endpoint</Button>\n * </Empty.Actions>\n * </Empty.Root>\n * ```\n */\nconst Icon = ({ className, svg, ...props }: EmptyIconProps) => {\n\treturn <SvgOnly className={cx(\"mb-2 size-16 text-muted\", className)} svg={svg} {...props} />;\n};\nIcon.displayName = \"EmptyIcon\";\n\n/**\n * The heading text for the empty state. Renders as an `h3` by default. Use the\n * `asChild` prop to render as a different heading level (e.g. `h1`, `h2`).\n *\n * @see https://mantle.ngrok.com/components/empty\n *\n * @example\n * ```tsx\n * <Empty.Root>\n * <Empty.Icon svg={<GhostIcon />} />\n * <Empty.Title>No endpoints yet</Empty.Title>\n * <Empty.Description>Create your first endpoint to get started.</Empty.Description>\n * <Empty.Actions>\n * <Button>Create endpoint</Button>\n * </Empty.Actions>\n * </Empty.Root>\n *\n * <Empty.Title asChild>\n * <h2>No results found</h2>\n * </Empty.Title>\n * ```\n */\nconst Title = ({\n\tasChild,\n\tchildren,\n\tclassName,\n\t...props\n}: HTMLAttributes<HTMLHeadingElement> & WithAsChild) => {\n\tconst Comp = asChild ? Slot : \"h3\";\n\n\treturn (\n\t\t<Comp className={cx(\"text-strong text-xl font-medium\", className)} {...props}>\n\t\t\t{children}\n\t\t</Comp>\n\t);\n};\nTitle.displayName = \"EmptyTitle\";\n\n/**\n * Supporting descriptive text below the title. Renders as a `div` with\n * `space-y-4` so multiple paragraphs can be placed inside. Use the `asChild`\n * prop to render as a different element.\n *\n * @see https://mantle.ngrok.com/components/empty\n *\n * @example\n * ```tsx\n * <Empty.Root>\n * <Empty.Icon svg={<GhostIcon />} />\n * <Empty.Title>No endpoints yet</Empty.Title>\n * <Empty.Description>Create your first endpoint to get started.</Empty.Description>\n * <Empty.Actions>\n * <Button>Create endpoint</Button>\n * </Empty.Actions>\n * </Empty.Root>\n *\n * <Empty.Description>\n * <p>Something went wrong.</p>\n * <p>Please try again in a few minutes.</p>\n * </Empty.Description>\n * ```\n */\nconst Description = ({\n\tasChild,\n\tchildren,\n\tclassName,\n\t...props\n}: ComponentProps<\"div\"> & WithAsChild) => {\n\tconst Comp = asChild ? Slot : \"div\";\n\n\treturn (\n\t\t<Comp className={cx(\"text-body mt-1 space-y-4 text-sm\", className)} {...props}>\n\t\t\t{children}\n\t\t</Comp>\n\t);\n};\nDescription.displayName = \"EmptyDescription\";\n\n/**\n * A container for action buttons or links in the empty state.\n *\n * @see https://mantle.ngrok.com/components/empty\n *\n * @example\n * ```tsx\n * <Empty.Root>\n * <Empty.Icon svg={<GhostIcon />} />\n * <Empty.Title>No endpoints yet</Empty.Title>\n * <Empty.Description>Create your first endpoint to get started.</Empty.Description>\n * <Empty.Actions>\n * <Button>Create endpoint</Button>\n * <Button appearance=\"outlined\">Go back</Button>\n * </Empty.Actions>\n * </Empty.Root>\n * ```\n */\nconst Actions = ({ children, className, ...props }: ComponentProps<\"div\">) => {\n\treturn (\n\t\t<div className={cx(\"mt-4 flex items-center gap-2\", className)} {...props}>\n\t\t\t{children}\n\t\t</div>\n\t);\n};\nActions.displayName = \"EmptyActions\";\n\n/**\n * Compound component for rendering empty states. Use with `Empty.Root`,\n * `Empty.Icon`, `Empty.Title`, `Empty.Description`, and `Empty.Actions`.\n *\n * @see https://mantle.ngrok.com/components/empty\n *\n * @example\n * Composition:\n * ```\n * Empty.Root\n * ├── Empty.Icon\n * ├── Empty.Title\n * ├── Empty.Description\n * └── Empty.Actions\n * ```\n *\n * @example\n * ```tsx\n * <Empty.Root>\n * <Empty.Icon svg={<GhostIcon />} />\n * <Empty.Title>No endpoints yet</Empty.Title>\n * <Empty.Description>\n * Create your first endpoint to get started.\n * </Empty.Description>\n * <Empty.Actions>\n * <Button>Create endpoint</Button>\n * </Empty.Actions>\n * </Empty.Root>\n * ```\n */\nconst Empty = {\n\t/**\n\t * The root container for an empty state. Centers content vertically and\n\t * horizontally with consistent padding and max-width.\n\t *\n\t * @see https://mantle.ngrok.com/components/empty\n\t *\n\t * @example\n\t * ```tsx\n\t * <Empty.Root>\n\t * <Empty.Icon svg={<GhostIcon />} />\n\t * <Empty.Title>No endpoints yet</Empty.Title>\n\t * <Empty.Description>Create your first endpoint to get started.</Empty.Description>\n\t * <Empty.Actions>\n\t * <Button>Create endpoint</Button>\n\t * </Empty.Actions>\n\t * </Empty.Root>\n\t * ```\n\t */\n\tRoot,\n\t/**\n\t * Renders a large icon for the empty state. Pass a single SVG icon element\n\t * via the `svg` prop.\n\t *\n\t * @see https://mantle.ngrok.com/components/empty\n\t *\n\t * @example\n\t * ```tsx\n\t * <Empty.Root>\n\t * <Empty.Icon svg={<GhostIcon />} />\n\t * <Empty.Title>No endpoints yet</Empty.Title>\n\t * <Empty.Description>Create your first endpoint to get started.</Empty.Description>\n\t * <Empty.Actions>\n\t * <Button>Create endpoint</Button>\n\t * </Empty.Actions>\n\t * </Empty.Root>\n\t * ```\n\t */\n\tIcon,\n\t/**\n\t * The heading text for the empty state. Renders as an `h3` by default.\n\t * Use `asChild` to render as a different heading level.\n\t *\n\t * @see https://mantle.ngrok.com/components/empty\n\t *\n\t * @example\n\t * ```tsx\n\t * <Empty.Root>\n\t * <Empty.Icon svg={<GhostIcon />} />\n\t * <Empty.Title>No endpoints yet</Empty.Title>\n\t * <Empty.Description>Create your first endpoint to get started.</Empty.Description>\n\t * <Empty.Actions>\n\t * <Button>Create endpoint</Button>\n\t * </Empty.Actions>\n\t * </Empty.Root>\n\t *\n\t * <Empty.Title asChild>\n\t * <h2>No results found</h2>\n\t * </Empty.Title>\n\t * ```\n\t */\n\tTitle,\n\t/**\n\t * Supporting descriptive text below the title. Renders as a `div` with\n\t * `space-y-4` for multiple paragraphs. Use `asChild` to render as a\n\t * different element.\n\t *\n\t * @see https://mantle.ngrok.com/components/empty\n\t *\n\t * @example\n\t * ```tsx\n\t * <Empty.Root>\n\t * <Empty.Icon svg={<GhostIcon />} />\n\t * <Empty.Title>No endpoints yet</Empty.Title>\n\t * <Empty.Description>Create your first endpoint to get started.</Empty.Description>\n\t * <Empty.Actions>\n\t * <Button>Create endpoint</Button>\n\t * </Empty.Actions>\n\t * </Empty.Root>\n\t * ```\n\t */\n\tDescription,\n\t/**\n\t * A container for action buttons or links in the empty state.\n\t *\n\t * @see https://mantle.ngrok.com/components/empty\n\t *\n\t * @example\n\t * ```tsx\n\t * <Empty.Root>\n\t * <Empty.Icon svg={<GhostIcon />} />\n\t * <Empty.Title>No endpoints yet</Empty.Title>\n\t * <Empty.Description>Create your first endpoint to get started.</Empty.Description>\n\t * <Empty.Actions>\n\t * <Button>Create endpoint</Button>\n\t * </Empty.Actions>\n\t * </Empty.Root>\n\t * ```\n\t */\n\tActions,\n} as const;\n\nexport {\n\t//,\n\tEmpty,\n};\n"],"mappings":"0JAyBA,MAAM,GAAQ,CAAE,WAAU,YAAW,GAAG,KAEtC,EAAC,MAAD,CACC,UAAW,EAAG,gEAAiE,EAAU,CACzF,GAAI,EAEH,WACI,CAAA,CAGR,EAAK,YAAc,QA2BnB,MAAM,GAAQ,CAAE,YAAW,MAAK,GAAG,KAC3B,EAAC,EAAD,CAAS,UAAW,EAAG,0BAA2B,EAAU,CAAO,MAAK,GAAI,EAAS,CAAA,CAE7F,EAAK,YAAc,YAwBnB,MAAM,GAAS,CACd,UACA,WACA,YACA,GAAG,KAKF,EAHY,EAAU,EAAO,KAG7B,CAAM,UAAW,EAAG,kCAAmC,EAAU,CAAE,GAAI,EACrE,WACK,CAAA,CAGT,EAAM,YAAc,aA0BpB,MAAM,GAAe,CACpB,UACA,WACA,YACA,GAAG,KAKF,EAHY,EAAU,EAAO,MAG7B,CAAM,UAAW,EAAG,mCAAoC,EAAU,CAAE,GAAI,EACtE,WACK,CAAA,CAGT,EAAY,YAAc,mBAoB1B,MAAM,GAAW,CAAE,WAAU,YAAW,GAAG,KAEzC,EAAC,MAAD,CAAK,UAAW,EAAG,+BAAgC,EAAU,CAAE,GAAI,EACjE,WACI,CAAA,CAGR,EAAQ,YAAc,eAgCtB,MAAM,EAAQ,CAmBb,OAmBA,OAuBA,QAoBA,cAkBA,UACA"}
1
+ {"version":3,"file":"empty.js","names":[],"sources":["../src/components/empty/empty.tsx"],"sourcesContent":["import type { ComponentProps, HTMLAttributes, ReactNode } from \"react\";\nimport type { WithAsChild } from \"../../types/as-child.js\";\nimport { cx } from \"../../utils/cx/cx.js\";\nimport { SvgOnly } from \"../icon/svg-only.js\";\nimport type { SvgAttributes } from \"../icon/types.js\";\nimport { Slot } from \"../slot/index.js\";\n\n/**\n * The root container for an empty state. Centers content horizontally\n * with consistent vertical padding and max-width.\n *\n * @see https://mantle.ngrok.com/components/empty\n *\n * @example\n * ```tsx\n * <Empty.Root>\n * <Empty.Icon svg={<GhostIcon />} />\n * <Empty.Title>No results found</Empty.Title>\n * <Empty.Description>Try adjusting your search or filters.</Empty.Description>\n * <Empty.Actions>\n * <Button>Clear filters</Button>\n * </Empty.Actions>\n * </Empty.Root>\n * ```\n */\nconst Root = ({ asChild, children, className, ...props }: ComponentProps<\"div\"> & WithAsChild) => {\n\tconst Comp = asChild ? Slot : \"div\";\n\n\treturn (\n\t\t<Comp\n\t\t\tdata-slot=\"empty\"\n\t\t\tclassName={cx(\"mx-auto flex max-w-lg flex-col items-center py-14 text-center\", className)}\n\t\t\t{...props}\n\t\t>\n\t\t\t{children}\n\t\t</Comp>\n\t);\n};\nRoot.displayName = \"Empty\";\n\ntype EmptyIconProps = Omit<SvgAttributes, \"children\"> & {\n\t/**\n\t * A single SVG icon element.\n\t */\n\tsvg: ReactNode;\n};\n\n/**\n * Renders a large icon for the empty state. Pass a single SVG icon element\n * via the `svg` prop (e.g. from `@phosphor-icons/react`).\n *\n * @see https://mantle.ngrok.com/components/empty\n *\n * @example\n * ```tsx\n * <Empty.Root>\n * <Empty.Icon svg={<GhostIcon />} />\n * <Empty.Title>No endpoints yet</Empty.Title>\n * <Empty.Description>Create your first endpoint to get started.</Empty.Description>\n * <Empty.Actions>\n * <Button>Create endpoint</Button>\n * </Empty.Actions>\n * </Empty.Root>\n * ```\n */\nconst Icon = ({ className, svg, ...props }: EmptyIconProps) => {\n\treturn (\n\t\t<SvgOnly\n\t\t\tdata-slot=\"empty-icon\"\n\t\t\tclassName={cx(\"mb-2 size-16 text-muted\", className)}\n\t\t\tsvg={svg}\n\t\t\t{...props}\n\t\t/>\n\t);\n};\nIcon.displayName = \"EmptyIcon\";\n\n/**\n * The heading text for the empty state. Renders as an `h3` by default. Use the\n * `asChild` prop to render as a different heading level (e.g. `h1`, `h2`).\n *\n * @see https://mantle.ngrok.com/components/empty\n *\n * @example\n * ```tsx\n * <Empty.Root>\n * <Empty.Icon svg={<GhostIcon />} />\n * <Empty.Title>No endpoints yet</Empty.Title>\n * <Empty.Description>Create your first endpoint to get started.</Empty.Description>\n * <Empty.Actions>\n * <Button>Create endpoint</Button>\n * </Empty.Actions>\n * </Empty.Root>\n *\n * <Empty.Title asChild>\n * <h2>No results found</h2>\n * </Empty.Title>\n * ```\n */\nconst Title = ({\n\tasChild,\n\tchildren,\n\tclassName,\n\t...props\n}: HTMLAttributes<HTMLHeadingElement> & WithAsChild) => {\n\tconst Comp = asChild ? Slot : \"h3\";\n\n\treturn (\n\t\t<Comp\n\t\t\tdata-slot=\"empty-title\"\n\t\t\tclassName={cx(\"text-strong text-xl font-medium\", className)}\n\t\t\t{...props}\n\t\t>\n\t\t\t{children}\n\t\t</Comp>\n\t);\n};\nTitle.displayName = \"EmptyTitle\";\n\n/**\n * Supporting descriptive text below the title. Renders as a `div` with\n * `space-y-4` so multiple paragraphs can be placed inside. Use the `asChild`\n * prop to render as a different element.\n *\n * @see https://mantle.ngrok.com/components/empty\n *\n * @example\n * ```tsx\n * <Empty.Root>\n * <Empty.Icon svg={<GhostIcon />} />\n * <Empty.Title>No endpoints yet</Empty.Title>\n * <Empty.Description>Create your first endpoint to get started.</Empty.Description>\n * <Empty.Actions>\n * <Button>Create endpoint</Button>\n * </Empty.Actions>\n * </Empty.Root>\n *\n * <Empty.Description>\n * <p>Something went wrong.</p>\n * <p>Please try again in a few minutes.</p>\n * </Empty.Description>\n * ```\n */\nconst Description = ({\n\tasChild,\n\tchildren,\n\tclassName,\n\t...props\n}: ComponentProps<\"div\"> & WithAsChild) => {\n\tconst Comp = asChild ? Slot : \"div\";\n\n\treturn (\n\t\t<Comp\n\t\t\tdata-slot=\"empty-description\"\n\t\t\tclassName={cx(\"text-body mt-1 space-y-4 text-sm\", className)}\n\t\t\t{...props}\n\t\t>\n\t\t\t{children}\n\t\t</Comp>\n\t);\n};\nDescription.displayName = \"EmptyDescription\";\n\n/**\n * A container for action buttons or links in the empty state.\n *\n * @see https://mantle.ngrok.com/components/empty\n *\n * @example\n * ```tsx\n * <Empty.Root>\n * <Empty.Icon svg={<GhostIcon />} />\n * <Empty.Title>No endpoints yet</Empty.Title>\n * <Empty.Description>Create your first endpoint to get started.</Empty.Description>\n * <Empty.Actions>\n * <Button>Create endpoint</Button>\n * <Button appearance=\"outlined\">Go back</Button>\n * </Empty.Actions>\n * </Empty.Root>\n * ```\n */\nconst Actions = ({\n\tasChild,\n\tchildren,\n\tclassName,\n\t...props\n}: ComponentProps<\"div\"> & WithAsChild) => {\n\tconst Comp = asChild ? Slot : \"div\";\n\n\treturn (\n\t\t<Comp\n\t\t\tdata-slot=\"empty-actions\"\n\t\t\tclassName={cx(\"mt-4 flex items-center gap-2\", className)}\n\t\t\t{...props}\n\t\t>\n\t\t\t{children}\n\t\t</Comp>\n\t);\n};\nActions.displayName = \"EmptyActions\";\n\n/**\n * Compound component for rendering empty states. Use with `Empty.Root`,\n * `Empty.Icon`, `Empty.Title`, `Empty.Description`, and `Empty.Actions`.\n *\n * @see https://mantle.ngrok.com/components/empty\n *\n * @example\n * Composition:\n * ```\n * Empty.Root\n * ├── Empty.Icon\n * ├── Empty.Title\n * ├── Empty.Description\n * └── Empty.Actions\n * ```\n *\n * @example\n * ```tsx\n * <Empty.Root>\n * <Empty.Icon svg={<GhostIcon />} />\n * <Empty.Title>No endpoints yet</Empty.Title>\n * <Empty.Description>\n * Create your first endpoint to get started.\n * </Empty.Description>\n * <Empty.Actions>\n * <Button>Create endpoint</Button>\n * </Empty.Actions>\n * </Empty.Root>\n * ```\n */\nconst Empty = {\n\t/**\n\t * The root container for an empty state. Centers content vertically and\n\t * horizontally with consistent padding and max-width.\n\t *\n\t * @see https://mantle.ngrok.com/components/empty\n\t *\n\t * @example\n\t * ```tsx\n\t * <Empty.Root>\n\t * <Empty.Icon svg={<GhostIcon />} />\n\t * <Empty.Title>No endpoints yet</Empty.Title>\n\t * <Empty.Description>Create your first endpoint to get started.</Empty.Description>\n\t * <Empty.Actions>\n\t * <Button>Create endpoint</Button>\n\t * </Empty.Actions>\n\t * </Empty.Root>\n\t * ```\n\t */\n\tRoot,\n\t/**\n\t * Renders a large icon for the empty state. Pass a single SVG icon element\n\t * via the `svg` prop.\n\t *\n\t * @see https://mantle.ngrok.com/components/empty\n\t *\n\t * @example\n\t * ```tsx\n\t * <Empty.Root>\n\t * <Empty.Icon svg={<GhostIcon />} />\n\t * <Empty.Title>No endpoints yet</Empty.Title>\n\t * <Empty.Description>Create your first endpoint to get started.</Empty.Description>\n\t * <Empty.Actions>\n\t * <Button>Create endpoint</Button>\n\t * </Empty.Actions>\n\t * </Empty.Root>\n\t * ```\n\t */\n\tIcon,\n\t/**\n\t * The heading text for the empty state. Renders as an `h3` by default.\n\t * Use `asChild` to render as a different heading level.\n\t *\n\t * @see https://mantle.ngrok.com/components/empty\n\t *\n\t * @example\n\t * ```tsx\n\t * <Empty.Root>\n\t * <Empty.Icon svg={<GhostIcon />} />\n\t * <Empty.Title>No endpoints yet</Empty.Title>\n\t * <Empty.Description>Create your first endpoint to get started.</Empty.Description>\n\t * <Empty.Actions>\n\t * <Button>Create endpoint</Button>\n\t * </Empty.Actions>\n\t * </Empty.Root>\n\t *\n\t * <Empty.Title asChild>\n\t * <h2>No results found</h2>\n\t * </Empty.Title>\n\t * ```\n\t */\n\tTitle,\n\t/**\n\t * Supporting descriptive text below the title. Renders as a `div` with\n\t * `space-y-4` for multiple paragraphs. Use `asChild` to render as a\n\t * different element.\n\t *\n\t * @see https://mantle.ngrok.com/components/empty\n\t *\n\t * @example\n\t * ```tsx\n\t * <Empty.Root>\n\t * <Empty.Icon svg={<GhostIcon />} />\n\t * <Empty.Title>No endpoints yet</Empty.Title>\n\t * <Empty.Description>Create your first endpoint to get started.</Empty.Description>\n\t * <Empty.Actions>\n\t * <Button>Create endpoint</Button>\n\t * </Empty.Actions>\n\t * </Empty.Root>\n\t * ```\n\t */\n\tDescription,\n\t/**\n\t * A container for action buttons or links in the empty state.\n\t *\n\t * @see https://mantle.ngrok.com/components/empty\n\t *\n\t * @example\n\t * ```tsx\n\t * <Empty.Root>\n\t * <Empty.Icon svg={<GhostIcon />} />\n\t * <Empty.Title>No endpoints yet</Empty.Title>\n\t * <Empty.Description>Create your first endpoint to get started.</Empty.Description>\n\t * <Empty.Actions>\n\t * <Button>Create endpoint</Button>\n\t * </Empty.Actions>\n\t * </Empty.Root>\n\t * ```\n\t */\n\tActions,\n} as const;\n\nexport {\n\t//,\n\tEmpty,\n};\n"],"mappings":"0JAyBA,MAAM,GAAQ,CAAE,UAAS,WAAU,YAAW,GAAG,KAI/C,EAHY,EAAU,EAAO,MAG7B,CACC,YAAU,QACV,UAAW,EAAG,gEAAiE,EAAU,CACzF,GAAI,EAEH,WACK,CAAA,CAGT,EAAK,YAAc,QA2BnB,MAAM,GAAQ,CAAE,YAAW,MAAK,GAAG,KAEjC,EAAC,EAAD,CACC,YAAU,aACV,UAAW,EAAG,0BAA2B,EAAU,CAC9C,MACL,GAAI,EACH,CAAA,CAGJ,EAAK,YAAc,YAwBnB,MAAM,GAAS,CACd,UACA,WACA,YACA,GAAG,KAKF,EAHY,EAAU,EAAO,KAG7B,CACC,YAAU,cACV,UAAW,EAAG,kCAAmC,EAAU,CAC3D,GAAI,EAEH,WACK,CAAA,CAGT,EAAM,YAAc,aA0BpB,MAAM,GAAe,CACpB,UACA,WACA,YACA,GAAG,KAKF,EAHY,EAAU,EAAO,MAG7B,CACC,YAAU,oBACV,UAAW,EAAG,mCAAoC,EAAU,CAC5D,GAAI,EAEH,WACK,CAAA,CAGT,EAAY,YAAc,mBAoB1B,MAAM,GAAW,CAChB,UACA,WACA,YACA,GAAG,KAKF,EAHY,EAAU,EAAO,MAG7B,CACC,YAAU,gBACV,UAAW,EAAG,+BAAgC,EAAU,CACxD,GAAI,EAEH,WACK,CAAA,CAGT,EAAQ,YAAc,eAgCtB,MAAM,EAAQ,CAmBb,OAmBA,OAuBA,QAoBA,cAkBA,UACA"}
package/dist/flag.js CHANGED
@@ -1,2 +1,2 @@
1
- import{t as e}from"./cx-D1HYnpvA.js";import{jsx as t,jsxs as n}from"react/jsx-runtime";import{cva as r}from"class-variance-authority";const i=r(``,{variants:{size:{s:`rounded-[0.0625rem]`,m:`rounded-[0.09375rem]`,l:`rounded-xs`}}}),a=r(``,{variants:{size:{s:`w-4 h-3`,m:`w-5 h-3.75`,l:`w-8 h-6`}}});function o({className:r,code:o,size:s=`l`,loading:c=`lazy`,...l}){let u=i({size:s});return n(`div`,{className:e(`flag relative overflow-hidden`,u,a({size:s}),r),...l,children:[t(`div`,{"aria-hidden":!0,className:e(`absolute inset-0 border border-[#000]/10`,u)}),t(`img`,{className:`h-full w-full block object-cover`,src:`https://assets.ngrok.com/flags/${s}/${o}.svg`,alt:`flag for ${o}`,loading:c})]})}o.displayName=`Flag`;const s=`004.008.010.016.016.020.024.028.031.032.040.044.048.050.051.052.056.060.064.068.070.072.074.076.084.086.090.092.096.100.104.108.112.116.120.124.132.136.140.144.148.152.156.158.162.166.170.174.178.180.184.188.191.192.196.203.204.208.212.214.218.222.226.231.232.233.234.238.239.242.246.248.250.254.258.260.262.266.268.270.275.276.288.292.296.300.304.308.312.316.320.324.328.332.334.336.340.344.348.352.356.360.364.368.372.376.380.384.388.392.398.400.404.408.410.414.417.418.422.426.428.430.434.438.440.442.446.450.454.458.462.466.470.474.478.480.484.492.496.498.499.500.504.508.512.516.520.524.528.531.533.534.540.548.554.558.562.566.570.574.578.580.581.583.584.585.586.591.598.600.604.608.612.616.620.624.626.630.634.638.642.643.646.652.654.659.660.662.663.666.670.674.678.682.686.688.690.694.702.703.704.705.706.710.716.724.728.729.732.740.744.748.752.756.760.762.764.768.772.776.780.784.788.792.795.796.798.800.804.807.818.831.832.833.834.836.840.850.854.858.860.862.876.882.887.894.ABW.AD.AE.AF.AFG.AFRUN.AG.AGO.AI.AIA.AL.ALA.ALB.AM.AMS.AND.AO.AQ.AR.ARE.ARG.ARM.AS.ASM.AT.ATA.ATF.ATG.AU.AUS.AUT.AW.AX.AZ.AZE.BA.BB.BD.BDI.BE.BEL.BEN.BF.BFA.BG.BGD.BGR.BH.BHR.BHS.BI.BIH.BJ.BL.BLM.BLR.BLZ.BM.BMU.BN.BO.BOL.BQ-BO.BQ-SA.BQ-SE.BR.BRA.BRB.BRN.BS.BT.BTN.BV.BVT.BW.BWA.BY.BZ.CA.CAF.CAN.CC.CCK.CD.CF.CG.CH.CHE.CHL.CHN.CI.CIV.CK.CL.CM.CMR.CN.CO.COD.COG.COK.COL.COM.CPV.CR.CRI.CU.CUB.CUW.CV.CW.CX.CXR.CY.CYM.CYP.CZ.CZE.DE.DEU.DJ.DJI.DK.DM.DMA.DNK.DO.DOM.EC.ECU.EE.EG.EGY.EH.ER.ERI.ES.ESH.ESP.EST.ET.ETH.EU.FI.FIN.FJ.FJI.FK.FLK.FM.FO.FR.FRA.FRO.FSM.GA.GAB.GB-ENG.GB-NIR.GB-SCT.GB-UKM.GB-WLS.GB.GBR.GD.GE.GEO.GF.GG.GGY.GH.GHA.GI.GIB.GIN.GL.GLP.GM.GMB.GN.GNB.GNQ.GP.GQ.GR.GRC.GRD.GRL.GS.GT.GTM.GU.GUF.GUM.GUY.GW.GY.HK.HKG.HM.HMD.HN.HND.HR.HRV.HT.HTI.HU.HUN.ID.IDN.IE.IL.IM.IMN.IN.IND.IO.IOT.IQ.IR.IRL.IRN.IRQ.IS.ISL.ISR.IT.ITA.JAM.JE.JEY.JM.JO.JOR.JP.JPN.KAZ.KE.KEN.KG.KGZ.KH.KHM.KI.KIR.KM.KN-SK.KNA.KOR.KP.KR.KW.KWT.KY.KZ.LA.LAO.LB.LBN.LBR.LBY.LC.LCA.LI.LIE.LK.LKA.LR.LS.LSO.LT.LTU.LU.LUX.LV.LVA.LY.MA.MAC.MAF.MAR.MC.MCO.MD.MDA.MDG.MDV.ME.MEX.MF.MG.MH.MHL.MK.MKD.ML.MLI.MLT.MM.MMR.MN.MNE.MNG.MNP.MO.MOZ.MP.MQ.MR.MRT.MS.MSR.MT.MTQ.MU.MUS.MV.MW.MWI.MX.MY.MYS.MZ.NA.NAM.NC.NCL.NE.NER.NF.NFK.NG.NGA.NI.NIC.NIU.NL.NLD.NO.NOR.NP.NPL.NR.NRU.NU.NZ.NZL.OM.OMN.PA.PAK.PAN.PCN.PE.PER.PF.PG.PH.PHL.PK.PL.PLW.PM.PN.PNG.POL.PR.PRI.PRK.PRT.PRY.PS.PSE.PT.PW.PY.PYF.QA.QAT.RAINBOW.RE.REU.RO.ROU.RS.RU.RUS.RW.RWA.SA.SAU.SB.SC.SD.SDN.SE.SEN.SG.SGP.SGS.SH.SHN.SI.SJ.SJM.SK.SL.SLB.SLE.SLV.SM.SMR.SN.SO.SOM.SPM.SR.SRB.SS.SSD.ST.STP.SUR.SV.SVK.SVN.SWE.SWZ.SX.SXM.SY.SYC.SYR.SZ.TC.TCA.TCD.TD.TF.TG.TGO.TH.THA.TJ.TJK.TK.TKL.TKM.TL.TLS.TM.TN.TO.TON.TR.TT.TTO.TUN.TUR.TUV.TV.TW.TWN.TZ.TZA.UA.UG.UGA.UKR.UM.UMI.UNASUR.URY.US.USA.UY.UZ.UZB.VA.VAT.VC.VCT.VE.VEN.VG.VGB.VI.VIR.VN.VNM.VU.VUT.WF.WLF.WS.WSM.YE.YEM.ZA.ZAF.ZM.ZMB.ZW.ZWE`.split(`.`);function c(e){return s.includes(e)}export{o as Flag,s as countryCodes,c as isCountryCode};
1
+ import{t as e}from"./cx-D1HYnpvA.js";import{jsx as t,jsxs as n}from"react/jsx-runtime";import{cva as r}from"class-variance-authority";const i=r(``,{variants:{size:{s:`rounded-[0.0625rem]`,m:`rounded-[0.09375rem]`,l:`rounded-xs`}}}),a=r(``,{variants:{size:{s:`w-4 h-3`,m:`w-5 h-3.75`,l:`w-8 h-6`}}});function o({className:r,code:o,size:s=`l`,loading:c=`lazy`,...l}){let u=i({size:s});return n(`div`,{"data-slot":`flag`,className:e(`flag relative overflow-hidden`,u,a({size:s}),r),...l,children:[t(`div`,{"aria-hidden":!0,className:e(`absolute inset-0 border border-[#000]/10`,u)}),t(`img`,{className:`h-full w-full block object-cover`,src:`https://assets.ngrok.com/flags/${s}/${o}.svg`,alt:`flag for ${o}`,loading:c})]})}o.displayName=`Flag`;const s=`004.008.010.016.016.020.024.028.031.032.040.044.048.050.051.052.056.060.064.068.070.072.074.076.084.086.090.092.096.100.104.108.112.116.120.124.132.136.140.144.148.152.156.158.162.166.170.174.178.180.184.188.191.192.196.203.204.208.212.214.218.222.226.231.232.233.234.238.239.242.246.248.250.254.258.260.262.266.268.270.275.276.288.292.296.300.304.308.312.316.320.324.328.332.334.336.340.344.348.352.356.360.364.368.372.376.380.384.388.392.398.400.404.408.410.414.417.418.422.426.428.430.434.438.440.442.446.450.454.458.462.466.470.474.478.480.484.492.496.498.499.500.504.508.512.516.520.524.528.531.533.534.540.548.554.558.562.566.570.574.578.580.581.583.584.585.586.591.598.600.604.608.612.616.620.624.626.630.634.638.642.643.646.652.654.659.660.662.663.666.670.674.678.682.686.688.690.694.702.703.704.705.706.710.716.724.728.729.732.740.744.748.752.756.760.762.764.768.772.776.780.784.788.792.795.796.798.800.804.807.818.831.832.833.834.836.840.850.854.858.860.862.876.882.887.894.ABW.AD.AE.AF.AFG.AFRUN.AG.AGO.AI.AIA.AL.ALA.ALB.AM.AMS.AND.AO.AQ.AR.ARE.ARG.ARM.AS.ASM.AT.ATA.ATF.ATG.AU.AUS.AUT.AW.AX.AZ.AZE.BA.BB.BD.BDI.BE.BEL.BEN.BF.BFA.BG.BGD.BGR.BH.BHR.BHS.BI.BIH.BJ.BL.BLM.BLR.BLZ.BM.BMU.BN.BO.BOL.BQ-BO.BQ-SA.BQ-SE.BR.BRA.BRB.BRN.BS.BT.BTN.BV.BVT.BW.BWA.BY.BZ.CA.CAF.CAN.CC.CCK.CD.CF.CG.CH.CHE.CHL.CHN.CI.CIV.CK.CL.CM.CMR.CN.CO.COD.COG.COK.COL.COM.CPV.CR.CRI.CU.CUB.CUW.CV.CW.CX.CXR.CY.CYM.CYP.CZ.CZE.DE.DEU.DJ.DJI.DK.DM.DMA.DNK.DO.DOM.EC.ECU.EE.EG.EGY.EH.ER.ERI.ES.ESH.ESP.EST.ET.ETH.EU.FI.FIN.FJ.FJI.FK.FLK.FM.FO.FR.FRA.FRO.FSM.GA.GAB.GB-ENG.GB-NIR.GB-SCT.GB-UKM.GB-WLS.GB.GBR.GD.GE.GEO.GF.GG.GGY.GH.GHA.GI.GIB.GIN.GL.GLP.GM.GMB.GN.GNB.GNQ.GP.GQ.GR.GRC.GRD.GRL.GS.GT.GTM.GU.GUF.GUM.GUY.GW.GY.HK.HKG.HM.HMD.HN.HND.HR.HRV.HT.HTI.HU.HUN.ID.IDN.IE.IL.IM.IMN.IN.IND.IO.IOT.IQ.IR.IRL.IRN.IRQ.IS.ISL.ISR.IT.ITA.JAM.JE.JEY.JM.JO.JOR.JP.JPN.KAZ.KE.KEN.KG.KGZ.KH.KHM.KI.KIR.KM.KN-SK.KNA.KOR.KP.KR.KW.KWT.KY.KZ.LA.LAO.LB.LBN.LBR.LBY.LC.LCA.LI.LIE.LK.LKA.LR.LS.LSO.LT.LTU.LU.LUX.LV.LVA.LY.MA.MAC.MAF.MAR.MC.MCO.MD.MDA.MDG.MDV.ME.MEX.MF.MG.MH.MHL.MK.MKD.ML.MLI.MLT.MM.MMR.MN.MNE.MNG.MNP.MO.MOZ.MP.MQ.MR.MRT.MS.MSR.MT.MTQ.MU.MUS.MV.MW.MWI.MX.MY.MYS.MZ.NA.NAM.NC.NCL.NE.NER.NF.NFK.NG.NGA.NI.NIC.NIU.NL.NLD.NO.NOR.NP.NPL.NR.NRU.NU.NZ.NZL.OM.OMN.PA.PAK.PAN.PCN.PE.PER.PF.PG.PH.PHL.PK.PL.PLW.PM.PN.PNG.POL.PR.PRI.PRK.PRT.PRY.PS.PSE.PT.PW.PY.PYF.QA.QAT.RAINBOW.RE.REU.RO.ROU.RS.RU.RUS.RW.RWA.SA.SAU.SB.SC.SD.SDN.SE.SEN.SG.SGP.SGS.SH.SHN.SI.SJ.SJM.SK.SL.SLB.SLE.SLV.SM.SMR.SN.SO.SOM.SPM.SR.SRB.SS.SSD.ST.STP.SUR.SV.SVK.SVN.SWE.SWZ.SX.SXM.SY.SYC.SYR.SZ.TC.TCA.TCD.TD.TF.TG.TGO.TH.THA.TJ.TJK.TK.TKL.TKM.TL.TLS.TM.TN.TO.TON.TR.TT.TTO.TUN.TUR.TUV.TV.TW.TWN.TZ.TZA.UA.UG.UGA.UKR.UM.UMI.UNASUR.URY.US.USA.UY.UZ.UZB.VA.VAT.VC.VCT.VE.VEN.VG.VGB.VI.VIR.VN.VNM.VU.VUT.WF.WLF.WS.WSM.YE.YEM.ZA.ZAF.ZM.ZMB.ZW.ZWE`.split(`.`);function c(e){return s.includes(e)}export{o as Flag,s as countryCodes,c as isCountryCode};
2
2
  //# sourceMappingURL=flag.js.map
package/dist/flag.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"flag.js","names":[],"sources":["../src/components/flag/flag.tsx","../src/components/flag/country-code.ts"],"sourcesContent":["import { cva } from \"class-variance-authority\";\nimport type { ComponentProps } from \"react\";\nimport { cx } from \"../../utils/cx/cx.js\";\nimport type { CountryCode } from \"./country-code.js\";\n\nconst cdnOrigin = \"https://assets.ngrok.com\";\n\nconst sizes = [\"s\", \"m\", \"l\"] as const;\ntype Size = (typeof sizes)[number];\n\ntype Props = Omit<ComponentProps<\"div\">, \"children\"> & {\n\t/**\n\t * The country code for the flag to display\n\t * @example \"US\"\n\t */\n\tcode: CountryCode;\n\t/**\n\t * The size of flag to render, \"s\", \"m\", or \"l\"\n\t * @default \"l\"\n\t */\n\tsize?: Size;\n\t/**\n\t * A string providing a hint to the user agent as to how to best schedule the loading of the image to optimize page performance.\n\t * @see https://developer.mozilla.org/en-US/docs/Web/API/HTMLImageElement/loading\n\t * @default \"lazy\"\n\t */\n\tloading?: ComponentProps<\"img\">[\"loading\"];\n};\n\nconst borderRadiusVariants = cva(\"\", {\n\tvariants: {\n\t\tsize: {\n\t\t\ts: \"rounded-[0.0625rem]\",\n\t\t\tm: \"rounded-[0.09375rem]\",\n\t\t\tl: \"rounded-xs\",\n\t\t} as const satisfies Record<Size, string>,\n\t},\n});\n\nconst sizingVariants = cva(\"\", {\n\tvariants: {\n\t\tsize: {\n\t\t\ts: \"w-4 h-3\",\n\t\t\tm: \"w-5 h-3.75\",\n\t\t\tl: \"w-8 h-6\",\n\t\t} as const satisfies Record<Size, string>,\n\t},\n});\n\n/**\n * A flag component that displays a flag based on the provided country code.\n * Inspired by [react-flagpack](https://flagpack.xyz/docs/development/react).\n *\n * @see https://mantle.ngrok.com/components/flag#flag\n *\n * @example\n * ```tsx\n * <Flag code=\"US\" />\n * <Flag code=\"JP\" size=\"m\" loading=\"eager\" />\n * <Flag code=\"CA\" size=\"s\" loading=\"lazy\" />\n * <Flag code=\"GB\" size=\"l\" />\n * ```\n */\nfunction Flag({\n\t//,\n\tclassName,\n\tcode,\n\tsize = \"l\",\n\tloading = \"lazy\",\n\t...props\n}: Props) {\n\tconst borderRadius = borderRadiusVariants({ size });\n\tconst sizing = sizingVariants({ size });\n\n\treturn (\n\t\t<div\n\t\t\tclassName={cx(\"flag relative overflow-hidden\", borderRadius, sizing, className)}\n\t\t\t{...props}\n\t\t>\n\t\t\t<div aria-hidden className={cx(\"absolute inset-0 border border-[#000]/10\", borderRadius)} />\n\t\t\t<img\n\t\t\t\tclassName=\"h-full w-full block object-cover\"\n\t\t\t\tsrc={`${cdnOrigin}/flags/${size}/${code}.svg`}\n\t\t\t\talt={`flag for ${code}`}\n\t\t\t\tloading={loading}\n\t\t\t/>\n\t\t</div>\n\t);\n}\nFlag.displayName = \"Flag\";\n\nexport {\n\t//,\n\tFlag,\n};\n\nexport type {\n\t//,\n\tProps as FlagProps,\n};\n","/** All valid values for a flag\n * @see https://www.flagpack.xyz/docs/flag-index\n */\nconst countryCodes = [\n\t\"004\",\n\t\"008\",\n\t\"010\",\n\t\"016\",\n\t\"016\",\n\t\"020\",\n\t\"024\",\n\t\"028\",\n\t\"031\",\n\t\"032\",\n\t\"040\",\n\t\"044\",\n\t\"048\",\n\t\"050\",\n\t\"051\",\n\t\"052\",\n\t\"056\",\n\t\"060\",\n\t\"064\",\n\t\"068\",\n\t\"070\",\n\t\"072\",\n\t\"074\",\n\t\"076\",\n\t\"084\",\n\t\"086\",\n\t\"090\",\n\t\"092\",\n\t\"096\",\n\t\"100\",\n\t\"104\",\n\t\"108\",\n\t\"112\",\n\t\"116\",\n\t\"120\",\n\t\"124\",\n\t\"132\",\n\t\"136\",\n\t\"140\",\n\t\"144\",\n\t\"148\",\n\t\"152\",\n\t\"156\",\n\t\"158\",\n\t\"162\",\n\t\"166\",\n\t\"170\",\n\t\"174\",\n\t\"178\",\n\t\"180\",\n\t\"184\",\n\t\"188\",\n\t\"191\",\n\t\"192\",\n\t\"196\",\n\t\"203\",\n\t\"204\",\n\t\"208\",\n\t\"212\",\n\t\"214\",\n\t\"218\",\n\t\"222\",\n\t\"226\",\n\t\"231\",\n\t\"232\",\n\t\"233\",\n\t\"234\",\n\t\"238\",\n\t\"239\",\n\t\"242\",\n\t\"246\",\n\t\"248\",\n\t\"250\",\n\t\"254\",\n\t\"258\",\n\t\"260\",\n\t\"262\",\n\t\"266\",\n\t\"268\",\n\t\"270\",\n\t\"275\",\n\t\"276\",\n\t\"288\",\n\t\"292\",\n\t\"296\",\n\t\"300\",\n\t\"304\",\n\t\"308\",\n\t\"312\",\n\t\"316\",\n\t\"320\",\n\t\"324\",\n\t\"328\",\n\t\"332\",\n\t\"334\",\n\t\"336\",\n\t\"340\",\n\t\"344\",\n\t\"348\",\n\t\"352\",\n\t\"356\",\n\t\"360\",\n\t\"364\",\n\t\"368\",\n\t\"372\",\n\t\"376\",\n\t\"380\",\n\t\"384\",\n\t\"388\",\n\t\"392\",\n\t\"398\",\n\t\"400\",\n\t\"404\",\n\t\"408\",\n\t\"410\",\n\t\"414\",\n\t\"417\",\n\t\"418\",\n\t\"422\",\n\t\"426\",\n\t\"428\",\n\t\"430\",\n\t\"434\",\n\t\"438\",\n\t\"440\",\n\t\"442\",\n\t\"446\",\n\t\"450\",\n\t\"454\",\n\t\"458\",\n\t\"462\",\n\t\"466\",\n\t\"470\",\n\t\"474\",\n\t\"478\",\n\t\"480\",\n\t\"484\",\n\t\"492\",\n\t\"496\",\n\t\"498\",\n\t\"499\",\n\t\"500\",\n\t\"504\",\n\t\"508\",\n\t\"512\",\n\t\"516\",\n\t\"520\",\n\t\"524\",\n\t\"528\",\n\t\"531\",\n\t\"533\",\n\t\"534\",\n\t\"540\",\n\t\"548\",\n\t\"554\",\n\t\"558\",\n\t\"562\",\n\t\"566\",\n\t\"570\",\n\t\"574\",\n\t\"578\",\n\t\"580\",\n\t\"581\",\n\t\"583\",\n\t\"584\",\n\t\"585\",\n\t\"586\",\n\t\"591\",\n\t\"598\",\n\t\"600\",\n\t\"604\",\n\t\"608\",\n\t\"612\",\n\t\"616\",\n\t\"620\",\n\t\"624\",\n\t\"626\",\n\t\"630\",\n\t\"634\",\n\t\"638\",\n\t\"642\",\n\t\"643\",\n\t\"646\",\n\t\"652\",\n\t\"654\",\n\t\"659\",\n\t\"660\",\n\t\"662\",\n\t\"663\",\n\t\"666\",\n\t\"670\",\n\t\"674\",\n\t\"678\",\n\t\"682\",\n\t\"686\",\n\t\"688\",\n\t\"690\",\n\t\"694\",\n\t\"702\",\n\t\"703\",\n\t\"704\",\n\t\"705\",\n\t\"706\",\n\t\"710\",\n\t\"716\",\n\t\"724\",\n\t\"728\",\n\t\"729\",\n\t\"732\",\n\t\"740\",\n\t\"744\",\n\t\"748\",\n\t\"752\",\n\t\"756\",\n\t\"760\",\n\t\"762\",\n\t\"764\",\n\t\"768\",\n\t\"772\",\n\t\"776\",\n\t\"780\",\n\t\"784\",\n\t\"788\",\n\t\"792\",\n\t\"795\",\n\t\"796\",\n\t\"798\",\n\t\"800\",\n\t\"804\",\n\t\"807\",\n\t\"818\",\n\t\"831\",\n\t\"832\",\n\t\"833\",\n\t\"834\",\n\t\"836\",\n\t\"840\",\n\t\"850\",\n\t\"854\",\n\t\"858\",\n\t\"860\",\n\t\"862\",\n\t\"876\",\n\t\"882\",\n\t\"887\",\n\t\"894\",\n\t\"ABW\",\n\t\"AD\",\n\t\"AE\",\n\t\"AF\",\n\t\"AFG\",\n\t\"AFRUN\",\n\t\"AG\",\n\t\"AGO\",\n\t\"AI\",\n\t\"AIA\",\n\t\"AL\",\n\t\"ALA\",\n\t\"ALB\",\n\t\"AM\",\n\t\"AMS\",\n\t\"AND\",\n\t\"AO\",\n\t\"AQ\",\n\t\"AR\",\n\t\"ARE\",\n\t\"ARG\",\n\t\"ARM\",\n\t\"AS\",\n\t\"ASM\",\n\t\"AT\",\n\t\"ATA\",\n\t\"ATF\",\n\t\"ATG\",\n\t\"AU\",\n\t\"AUS\",\n\t\"AUT\",\n\t\"AW\",\n\t\"AX\",\n\t\"AZ\",\n\t\"AZE\",\n\t\"BA\",\n\t\"BB\",\n\t\"BD\",\n\t\"BDI\",\n\t\"BE\",\n\t\"BEL\",\n\t\"BEN\",\n\t\"BF\",\n\t\"BFA\",\n\t\"BG\",\n\t\"BGD\",\n\t\"BGR\",\n\t\"BH\",\n\t\"BHR\",\n\t\"BHS\",\n\t\"BI\",\n\t\"BIH\",\n\t\"BJ\",\n\t\"BL\",\n\t\"BLM\",\n\t\"BLR\",\n\t\"BLZ\",\n\t\"BM\",\n\t\"BMU\",\n\t\"BN\",\n\t\"BO\",\n\t\"BOL\",\n\t\"BQ-BO\",\n\t\"BQ-SA\",\n\t\"BQ-SE\",\n\t\"BR\",\n\t\"BRA\",\n\t\"BRB\",\n\t\"BRN\",\n\t\"BS\",\n\t\"BT\",\n\t\"BTN\",\n\t\"BV\",\n\t\"BVT\",\n\t\"BW\",\n\t\"BWA\",\n\t\"BY\",\n\t\"BZ\",\n\t\"CA\",\n\t\"CAF\",\n\t\"CAN\",\n\t\"CC\",\n\t\"CCK\",\n\t\"CD\",\n\t\"CF\",\n\t\"CG\",\n\t\"CH\",\n\t\"CHE\",\n\t\"CHL\",\n\t\"CHN\",\n\t\"CI\",\n\t\"CIV\",\n\t\"CK\",\n\t\"CL\",\n\t\"CM\",\n\t\"CMR\",\n\t\"CN\",\n\t\"CO\",\n\t\"COD\",\n\t\"COG\",\n\t\"COK\",\n\t\"COL\",\n\t\"COM\",\n\t\"CPV\",\n\t\"CR\",\n\t\"CRI\",\n\t\"CU\",\n\t\"CUB\",\n\t\"CUW\",\n\t\"CV\",\n\t\"CW\",\n\t\"CX\",\n\t\"CXR\",\n\t\"CY\",\n\t\"CYM\",\n\t\"CYP\",\n\t\"CZ\",\n\t\"CZE\",\n\t\"DE\",\n\t\"DEU\",\n\t\"DJ\",\n\t\"DJI\",\n\t\"DK\",\n\t\"DM\",\n\t\"DMA\",\n\t\"DNK\",\n\t\"DO\",\n\t\"DOM\",\n\t\"EC\",\n\t\"ECU\",\n\t\"EE\",\n\t\"EG\",\n\t\"EGY\",\n\t\"EH\",\n\t\"ER\",\n\t\"ERI\",\n\t\"ES\",\n\t\"ESH\",\n\t\"ESP\",\n\t\"EST\",\n\t\"ET\",\n\t\"ETH\",\n\t\"EU\",\n\t\"FI\",\n\t\"FIN\",\n\t\"FJ\",\n\t\"FJI\",\n\t\"FK\",\n\t\"FLK\",\n\t\"FM\",\n\t\"FO\",\n\t\"FR\",\n\t\"FRA\",\n\t\"FRO\",\n\t\"FSM\",\n\t\"GA\",\n\t\"GAB\",\n\t\"GB-ENG\",\n\t\"GB-NIR\",\n\t\"GB-SCT\",\n\t\"GB-UKM\",\n\t\"GB-WLS\",\n\t\"GB\",\n\t\"GBR\",\n\t\"GD\",\n\t\"GE\",\n\t\"GEO\",\n\t\"GF\",\n\t\"GG\",\n\t\"GGY\",\n\t\"GH\",\n\t\"GHA\",\n\t\"GI\",\n\t\"GIB\",\n\t\"GIN\",\n\t\"GL\",\n\t\"GLP\",\n\t\"GM\",\n\t\"GMB\",\n\t\"GN\",\n\t\"GNB\",\n\t\"GNQ\",\n\t\"GP\",\n\t\"GQ\",\n\t\"GR\",\n\t\"GRC\",\n\t\"GRD\",\n\t\"GRL\",\n\t\"GS\",\n\t\"GT\",\n\t\"GTM\",\n\t\"GU\",\n\t\"GUF\",\n\t\"GUM\",\n\t\"GUY\",\n\t\"GW\",\n\t\"GY\",\n\t\"HK\",\n\t\"HKG\",\n\t\"HM\",\n\t\"HMD\",\n\t\"HN\",\n\t\"HND\",\n\t\"HR\",\n\t\"HRV\",\n\t\"HT\",\n\t\"HTI\",\n\t\"HU\",\n\t\"HUN\",\n\t\"ID\",\n\t\"IDN\",\n\t\"IE\",\n\t\"IL\",\n\t\"IM\",\n\t\"IMN\",\n\t\"IN\",\n\t\"IND\",\n\t\"IO\",\n\t\"IOT\",\n\t\"IQ\",\n\t\"IR\",\n\t\"IRL\",\n\t\"IRN\",\n\t\"IRQ\",\n\t\"IS\",\n\t\"ISL\",\n\t\"ISR\",\n\t\"IT\",\n\t\"ITA\",\n\t\"JAM\",\n\t\"JE\",\n\t\"JEY\",\n\t\"JM\",\n\t\"JO\",\n\t\"JOR\",\n\t\"JP\",\n\t\"JPN\",\n\t\"KAZ\",\n\t\"KE\",\n\t\"KEN\",\n\t\"KG\",\n\t\"KGZ\",\n\t\"KH\",\n\t\"KHM\",\n\t\"KI\",\n\t\"KIR\",\n\t\"KM\",\n\t\"KN-SK\",\n\t\"KNA\",\n\t\"KOR\",\n\t\"KP\",\n\t\"KR\",\n\t\"KW\",\n\t\"KWT\",\n\t\"KY\",\n\t\"KZ\",\n\t\"LA\",\n\t\"LAO\",\n\t\"LB\",\n\t\"LBN\",\n\t\"LBR\",\n\t\"LBY\",\n\t\"LC\",\n\t\"LCA\",\n\t\"LI\",\n\t\"LIE\",\n\t\"LK\",\n\t\"LKA\",\n\t\"LR\",\n\t\"LS\",\n\t\"LSO\",\n\t\"LT\",\n\t\"LTU\",\n\t\"LU\",\n\t\"LUX\",\n\t\"LV\",\n\t\"LVA\",\n\t\"LY\",\n\t\"MA\",\n\t\"MAC\",\n\t\"MAF\",\n\t\"MAR\",\n\t\"MC\",\n\t\"MCO\",\n\t\"MD\",\n\t\"MDA\",\n\t\"MDG\",\n\t\"MDV\",\n\t\"ME\",\n\t\"MEX\",\n\t\"MF\",\n\t\"MG\",\n\t\"MH\",\n\t\"MHL\",\n\t\"MK\",\n\t\"MKD\",\n\t\"ML\",\n\t\"MLI\",\n\t\"MLT\",\n\t\"MM\",\n\t\"MMR\",\n\t\"MN\",\n\t\"MNE\",\n\t\"MNG\",\n\t\"MNP\",\n\t\"MO\",\n\t\"MOZ\",\n\t\"MP\",\n\t\"MQ\",\n\t\"MR\",\n\t\"MRT\",\n\t\"MS\",\n\t\"MSR\",\n\t\"MT\",\n\t\"MTQ\",\n\t\"MU\",\n\t\"MUS\",\n\t\"MV\",\n\t\"MW\",\n\t\"MWI\",\n\t\"MX\",\n\t\"MY\",\n\t\"MYS\",\n\t\"MZ\",\n\t\"NA\",\n\t\"NAM\",\n\t\"NC\",\n\t\"NCL\",\n\t\"NE\",\n\t\"NER\",\n\t\"NF\",\n\t\"NFK\",\n\t\"NG\",\n\t\"NGA\",\n\t\"NI\",\n\t\"NIC\",\n\t\"NIU\",\n\t\"NL\",\n\t\"NLD\",\n\t\"NO\",\n\t\"NOR\",\n\t\"NP\",\n\t\"NPL\",\n\t\"NR\",\n\t\"NRU\",\n\t\"NU\",\n\t\"NZ\",\n\t\"NZL\",\n\t\"OM\",\n\t\"OMN\",\n\t\"PA\",\n\t\"PAK\",\n\t\"PAN\",\n\t\"PCN\",\n\t\"PE\",\n\t\"PER\",\n\t\"PF\",\n\t\"PG\",\n\t\"PH\",\n\t\"PHL\",\n\t\"PK\",\n\t\"PL\",\n\t\"PLW\",\n\t\"PM\",\n\t\"PN\",\n\t\"PNG\",\n\t\"POL\",\n\t\"PR\",\n\t\"PRI\",\n\t\"PRK\",\n\t\"PRT\",\n\t\"PRY\",\n\t\"PS\",\n\t\"PSE\",\n\t\"PT\",\n\t\"PW\",\n\t\"PY\",\n\t\"PYF\",\n\t\"QA\",\n\t\"QAT\",\n\t\"RAINBOW\",\n\t\"RE\",\n\t\"REU\",\n\t\"RO\",\n\t\"ROU\",\n\t\"RS\",\n\t\"RU\",\n\t\"RUS\",\n\t\"RW\",\n\t\"RWA\",\n\t\"SA\",\n\t\"SAU\",\n\t\"SB\",\n\t\"SC\",\n\t\"SD\",\n\t\"SDN\",\n\t\"SE\",\n\t\"SEN\",\n\t\"SG\",\n\t\"SGP\",\n\t\"SGS\",\n\t\"SH\",\n\t\"SHN\",\n\t\"SI\",\n\t\"SJ\",\n\t\"SJM\",\n\t\"SK\",\n\t\"SL\",\n\t\"SLB\",\n\t\"SLE\",\n\t\"SLV\",\n\t\"SM\",\n\t\"SMR\",\n\t\"SN\",\n\t\"SO\",\n\t\"SOM\",\n\t\"SPM\",\n\t\"SR\",\n\t\"SRB\",\n\t\"SS\",\n\t\"SSD\",\n\t\"ST\",\n\t\"STP\",\n\t\"SUR\",\n\t\"SV\",\n\t\"SVK\",\n\t\"SVN\",\n\t\"SWE\",\n\t\"SWZ\",\n\t\"SX\",\n\t\"SXM\",\n\t\"SY\",\n\t\"SYC\",\n\t\"SYR\",\n\t\"SZ\",\n\t\"TC\",\n\t\"TCA\",\n\t\"TCD\",\n\t\"TD\",\n\t\"TF\",\n\t\"TG\",\n\t\"TGO\",\n\t\"TH\",\n\t\"THA\",\n\t\"TJ\",\n\t\"TJK\",\n\t\"TK\",\n\t\"TKL\",\n\t\"TKM\",\n\t\"TL\",\n\t\"TLS\",\n\t\"TM\",\n\t\"TN\",\n\t\"TO\",\n\t\"TON\",\n\t\"TR\",\n\t\"TT\",\n\t\"TTO\",\n\t\"TUN\",\n\t\"TUR\",\n\t\"TUV\",\n\t\"TV\",\n\t\"TW\",\n\t\"TWN\",\n\t\"TZ\",\n\t\"TZA\",\n\t\"UA\",\n\t\"UG\",\n\t\"UGA\",\n\t\"UKR\",\n\t\"UM\",\n\t\"UMI\",\n\t\"UNASUR\",\n\t\"URY\",\n\t\"US\",\n\t\"USA\",\n\t\"UY\",\n\t\"UZ\",\n\t\"UZB\",\n\t\"VA\",\n\t\"VAT\",\n\t\"VC\",\n\t\"VCT\",\n\t\"VE\",\n\t\"VEN\",\n\t\"VG\",\n\t\"VGB\",\n\t\"VI\",\n\t\"VIR\",\n\t\"VN\",\n\t\"VNM\",\n\t\"VU\",\n\t\"VUT\",\n\t\"WF\",\n\t\"WLF\",\n\t\"WS\",\n\t\"WSM\",\n\t\"YE\",\n\t\"YEM\",\n\t\"ZA\",\n\t\"ZAF\",\n\t\"ZM\",\n\t\"ZMB\",\n\t\"ZW\",\n\t\"ZWE\",\n] as const;\ntype CountryCode = (typeof countryCodes)[number];\n\n/**\n * Type Predicate: check if the given value is a valid country code\n */\nfunction isCountryCode(value: unknown): value is CountryCode {\n\treturn countryCodes.includes(value as CountryCode);\n}\n\nexport {\n\t//,\n\tisCountryCode,\n\tcountryCodes,\n};\n\nexport type {\n\t//,\n\tCountryCode,\n};\n"],"mappings":"sIAKA,MAwBM,EAAuB,EAAI,GAAI,CACpC,SAAU,CACT,KAAM,CACL,EAAG,sBACH,EAAG,uBACH,EAAG,aACH,CACD,CACD,CAAC,CAEI,EAAiB,EAAI,GAAI,CAC9B,SAAU,CACT,KAAM,CACL,EAAG,UACH,EAAG,aACH,EAAG,UACH,CACD,CACD,CAAC,CAgBF,SAAS,EAAK,CAEb,YACA,OACA,OAAO,IACP,UAAU,OACV,GAAG,GACM,CACT,IAAM,EAAe,EAAqB,CAAE,OAAM,CAAC,CAGnD,OACC,EAAC,MAAD,CACC,UAAW,EAAG,gCAAiC,EAJlC,EAAe,CAAE,OAAM,CAAC,CAIgC,EAAU,CAC/E,GAAI,WAFL,CAIC,EAAC,MAAD,CAAK,cAAA,GAAY,UAAW,EAAG,2CAA4C,EAAa,CAAI,CAAA,CAC5F,EAAC,MAAD,CACC,UAAU,mCACV,IAAK,kCAAsB,EAAK,GAAG,EAAK,MACxC,IAAK,YAAY,IACR,UACR,CAAA,CACG,GAGR,EAAK,YAAc,OCtFnB,MAAM,EAAe,kvFAgvBpB,CAMD,SAAS,EAAc,EAAsC,CAC5D,OAAO,EAAa,SAAS,EAAqB"}
1
+ {"version":3,"file":"flag.js","names":[],"sources":["../src/components/flag/flag.tsx","../src/components/flag/country-code.ts"],"sourcesContent":["import { cva } from \"class-variance-authority\";\nimport type { ComponentProps } from \"react\";\nimport { cx } from \"../../utils/cx/cx.js\";\nimport type { CountryCode } from \"./country-code.js\";\n\nconst cdnOrigin = \"https://assets.ngrok.com\";\n\nconst sizes = [\"s\", \"m\", \"l\"] as const;\ntype Size = (typeof sizes)[number];\n\ntype Props = Omit<ComponentProps<\"div\">, \"children\"> & {\n\t/**\n\t * The country code for the flag to display\n\t * @example \"US\"\n\t */\n\tcode: CountryCode;\n\t/**\n\t * The size of flag to render, \"s\", \"m\", or \"l\"\n\t * @default \"l\"\n\t */\n\tsize?: Size;\n\t/**\n\t * A string providing a hint to the user agent as to how to best schedule the loading of the image to optimize page performance.\n\t * @see https://developer.mozilla.org/en-US/docs/Web/API/HTMLImageElement/loading\n\t * @default \"lazy\"\n\t */\n\tloading?: ComponentProps<\"img\">[\"loading\"];\n};\n\nconst borderRadiusVariants = cva(\"\", {\n\tvariants: {\n\t\tsize: {\n\t\t\ts: \"rounded-[0.0625rem]\",\n\t\t\tm: \"rounded-[0.09375rem]\",\n\t\t\tl: \"rounded-xs\",\n\t\t} as const satisfies Record<Size, string>,\n\t},\n});\n\nconst sizingVariants = cva(\"\", {\n\tvariants: {\n\t\tsize: {\n\t\t\ts: \"w-4 h-3\",\n\t\t\tm: \"w-5 h-3.75\",\n\t\t\tl: \"w-8 h-6\",\n\t\t} as const satisfies Record<Size, string>,\n\t},\n});\n\n/**\n * A flag component that displays a flag based on the provided country code.\n * Inspired by [react-flagpack](https://flagpack.xyz/docs/development/react).\n *\n * @see https://mantle.ngrok.com/components/flag#flag\n *\n * @example\n * ```tsx\n * <Flag code=\"US\" />\n * <Flag code=\"JP\" size=\"m\" loading=\"eager\" />\n * <Flag code=\"CA\" size=\"s\" loading=\"lazy\" />\n * <Flag code=\"GB\" size=\"l\" />\n * ```\n */\nfunction Flag({\n\t//,\n\tclassName,\n\tcode,\n\tsize = \"l\",\n\tloading = \"lazy\",\n\t...props\n}: Props) {\n\tconst borderRadius = borderRadiusVariants({ size });\n\tconst sizing = sizingVariants({ size });\n\n\treturn (\n\t\t<div\n\t\t\tdata-slot=\"flag\"\n\t\t\tclassName={cx(\"flag relative overflow-hidden\", borderRadius, sizing, className)}\n\t\t\t{...props}\n\t\t>\n\t\t\t<div aria-hidden className={cx(\"absolute inset-0 border border-[#000]/10\", borderRadius)} />\n\t\t\t<img\n\t\t\t\tclassName=\"h-full w-full block object-cover\"\n\t\t\t\tsrc={`${cdnOrigin}/flags/${size}/${code}.svg`}\n\t\t\t\talt={`flag for ${code}`}\n\t\t\t\tloading={loading}\n\t\t\t/>\n\t\t</div>\n\t);\n}\nFlag.displayName = \"Flag\";\n\nexport {\n\t//,\n\tFlag,\n};\n\nexport type {\n\t//,\n\tProps as FlagProps,\n};\n","/** All valid values for a flag\n * @see https://www.flagpack.xyz/docs/flag-index\n */\nconst countryCodes = [\n\t\"004\",\n\t\"008\",\n\t\"010\",\n\t\"016\",\n\t\"016\",\n\t\"020\",\n\t\"024\",\n\t\"028\",\n\t\"031\",\n\t\"032\",\n\t\"040\",\n\t\"044\",\n\t\"048\",\n\t\"050\",\n\t\"051\",\n\t\"052\",\n\t\"056\",\n\t\"060\",\n\t\"064\",\n\t\"068\",\n\t\"070\",\n\t\"072\",\n\t\"074\",\n\t\"076\",\n\t\"084\",\n\t\"086\",\n\t\"090\",\n\t\"092\",\n\t\"096\",\n\t\"100\",\n\t\"104\",\n\t\"108\",\n\t\"112\",\n\t\"116\",\n\t\"120\",\n\t\"124\",\n\t\"132\",\n\t\"136\",\n\t\"140\",\n\t\"144\",\n\t\"148\",\n\t\"152\",\n\t\"156\",\n\t\"158\",\n\t\"162\",\n\t\"166\",\n\t\"170\",\n\t\"174\",\n\t\"178\",\n\t\"180\",\n\t\"184\",\n\t\"188\",\n\t\"191\",\n\t\"192\",\n\t\"196\",\n\t\"203\",\n\t\"204\",\n\t\"208\",\n\t\"212\",\n\t\"214\",\n\t\"218\",\n\t\"222\",\n\t\"226\",\n\t\"231\",\n\t\"232\",\n\t\"233\",\n\t\"234\",\n\t\"238\",\n\t\"239\",\n\t\"242\",\n\t\"246\",\n\t\"248\",\n\t\"250\",\n\t\"254\",\n\t\"258\",\n\t\"260\",\n\t\"262\",\n\t\"266\",\n\t\"268\",\n\t\"270\",\n\t\"275\",\n\t\"276\",\n\t\"288\",\n\t\"292\",\n\t\"296\",\n\t\"300\",\n\t\"304\",\n\t\"308\",\n\t\"312\",\n\t\"316\",\n\t\"320\",\n\t\"324\",\n\t\"328\",\n\t\"332\",\n\t\"334\",\n\t\"336\",\n\t\"340\",\n\t\"344\",\n\t\"348\",\n\t\"352\",\n\t\"356\",\n\t\"360\",\n\t\"364\",\n\t\"368\",\n\t\"372\",\n\t\"376\",\n\t\"380\",\n\t\"384\",\n\t\"388\",\n\t\"392\",\n\t\"398\",\n\t\"400\",\n\t\"404\",\n\t\"408\",\n\t\"410\",\n\t\"414\",\n\t\"417\",\n\t\"418\",\n\t\"422\",\n\t\"426\",\n\t\"428\",\n\t\"430\",\n\t\"434\",\n\t\"438\",\n\t\"440\",\n\t\"442\",\n\t\"446\",\n\t\"450\",\n\t\"454\",\n\t\"458\",\n\t\"462\",\n\t\"466\",\n\t\"470\",\n\t\"474\",\n\t\"478\",\n\t\"480\",\n\t\"484\",\n\t\"492\",\n\t\"496\",\n\t\"498\",\n\t\"499\",\n\t\"500\",\n\t\"504\",\n\t\"508\",\n\t\"512\",\n\t\"516\",\n\t\"520\",\n\t\"524\",\n\t\"528\",\n\t\"531\",\n\t\"533\",\n\t\"534\",\n\t\"540\",\n\t\"548\",\n\t\"554\",\n\t\"558\",\n\t\"562\",\n\t\"566\",\n\t\"570\",\n\t\"574\",\n\t\"578\",\n\t\"580\",\n\t\"581\",\n\t\"583\",\n\t\"584\",\n\t\"585\",\n\t\"586\",\n\t\"591\",\n\t\"598\",\n\t\"600\",\n\t\"604\",\n\t\"608\",\n\t\"612\",\n\t\"616\",\n\t\"620\",\n\t\"624\",\n\t\"626\",\n\t\"630\",\n\t\"634\",\n\t\"638\",\n\t\"642\",\n\t\"643\",\n\t\"646\",\n\t\"652\",\n\t\"654\",\n\t\"659\",\n\t\"660\",\n\t\"662\",\n\t\"663\",\n\t\"666\",\n\t\"670\",\n\t\"674\",\n\t\"678\",\n\t\"682\",\n\t\"686\",\n\t\"688\",\n\t\"690\",\n\t\"694\",\n\t\"702\",\n\t\"703\",\n\t\"704\",\n\t\"705\",\n\t\"706\",\n\t\"710\",\n\t\"716\",\n\t\"724\",\n\t\"728\",\n\t\"729\",\n\t\"732\",\n\t\"740\",\n\t\"744\",\n\t\"748\",\n\t\"752\",\n\t\"756\",\n\t\"760\",\n\t\"762\",\n\t\"764\",\n\t\"768\",\n\t\"772\",\n\t\"776\",\n\t\"780\",\n\t\"784\",\n\t\"788\",\n\t\"792\",\n\t\"795\",\n\t\"796\",\n\t\"798\",\n\t\"800\",\n\t\"804\",\n\t\"807\",\n\t\"818\",\n\t\"831\",\n\t\"832\",\n\t\"833\",\n\t\"834\",\n\t\"836\",\n\t\"840\",\n\t\"850\",\n\t\"854\",\n\t\"858\",\n\t\"860\",\n\t\"862\",\n\t\"876\",\n\t\"882\",\n\t\"887\",\n\t\"894\",\n\t\"ABW\",\n\t\"AD\",\n\t\"AE\",\n\t\"AF\",\n\t\"AFG\",\n\t\"AFRUN\",\n\t\"AG\",\n\t\"AGO\",\n\t\"AI\",\n\t\"AIA\",\n\t\"AL\",\n\t\"ALA\",\n\t\"ALB\",\n\t\"AM\",\n\t\"AMS\",\n\t\"AND\",\n\t\"AO\",\n\t\"AQ\",\n\t\"AR\",\n\t\"ARE\",\n\t\"ARG\",\n\t\"ARM\",\n\t\"AS\",\n\t\"ASM\",\n\t\"AT\",\n\t\"ATA\",\n\t\"ATF\",\n\t\"ATG\",\n\t\"AU\",\n\t\"AUS\",\n\t\"AUT\",\n\t\"AW\",\n\t\"AX\",\n\t\"AZ\",\n\t\"AZE\",\n\t\"BA\",\n\t\"BB\",\n\t\"BD\",\n\t\"BDI\",\n\t\"BE\",\n\t\"BEL\",\n\t\"BEN\",\n\t\"BF\",\n\t\"BFA\",\n\t\"BG\",\n\t\"BGD\",\n\t\"BGR\",\n\t\"BH\",\n\t\"BHR\",\n\t\"BHS\",\n\t\"BI\",\n\t\"BIH\",\n\t\"BJ\",\n\t\"BL\",\n\t\"BLM\",\n\t\"BLR\",\n\t\"BLZ\",\n\t\"BM\",\n\t\"BMU\",\n\t\"BN\",\n\t\"BO\",\n\t\"BOL\",\n\t\"BQ-BO\",\n\t\"BQ-SA\",\n\t\"BQ-SE\",\n\t\"BR\",\n\t\"BRA\",\n\t\"BRB\",\n\t\"BRN\",\n\t\"BS\",\n\t\"BT\",\n\t\"BTN\",\n\t\"BV\",\n\t\"BVT\",\n\t\"BW\",\n\t\"BWA\",\n\t\"BY\",\n\t\"BZ\",\n\t\"CA\",\n\t\"CAF\",\n\t\"CAN\",\n\t\"CC\",\n\t\"CCK\",\n\t\"CD\",\n\t\"CF\",\n\t\"CG\",\n\t\"CH\",\n\t\"CHE\",\n\t\"CHL\",\n\t\"CHN\",\n\t\"CI\",\n\t\"CIV\",\n\t\"CK\",\n\t\"CL\",\n\t\"CM\",\n\t\"CMR\",\n\t\"CN\",\n\t\"CO\",\n\t\"COD\",\n\t\"COG\",\n\t\"COK\",\n\t\"COL\",\n\t\"COM\",\n\t\"CPV\",\n\t\"CR\",\n\t\"CRI\",\n\t\"CU\",\n\t\"CUB\",\n\t\"CUW\",\n\t\"CV\",\n\t\"CW\",\n\t\"CX\",\n\t\"CXR\",\n\t\"CY\",\n\t\"CYM\",\n\t\"CYP\",\n\t\"CZ\",\n\t\"CZE\",\n\t\"DE\",\n\t\"DEU\",\n\t\"DJ\",\n\t\"DJI\",\n\t\"DK\",\n\t\"DM\",\n\t\"DMA\",\n\t\"DNK\",\n\t\"DO\",\n\t\"DOM\",\n\t\"EC\",\n\t\"ECU\",\n\t\"EE\",\n\t\"EG\",\n\t\"EGY\",\n\t\"EH\",\n\t\"ER\",\n\t\"ERI\",\n\t\"ES\",\n\t\"ESH\",\n\t\"ESP\",\n\t\"EST\",\n\t\"ET\",\n\t\"ETH\",\n\t\"EU\",\n\t\"FI\",\n\t\"FIN\",\n\t\"FJ\",\n\t\"FJI\",\n\t\"FK\",\n\t\"FLK\",\n\t\"FM\",\n\t\"FO\",\n\t\"FR\",\n\t\"FRA\",\n\t\"FRO\",\n\t\"FSM\",\n\t\"GA\",\n\t\"GAB\",\n\t\"GB-ENG\",\n\t\"GB-NIR\",\n\t\"GB-SCT\",\n\t\"GB-UKM\",\n\t\"GB-WLS\",\n\t\"GB\",\n\t\"GBR\",\n\t\"GD\",\n\t\"GE\",\n\t\"GEO\",\n\t\"GF\",\n\t\"GG\",\n\t\"GGY\",\n\t\"GH\",\n\t\"GHA\",\n\t\"GI\",\n\t\"GIB\",\n\t\"GIN\",\n\t\"GL\",\n\t\"GLP\",\n\t\"GM\",\n\t\"GMB\",\n\t\"GN\",\n\t\"GNB\",\n\t\"GNQ\",\n\t\"GP\",\n\t\"GQ\",\n\t\"GR\",\n\t\"GRC\",\n\t\"GRD\",\n\t\"GRL\",\n\t\"GS\",\n\t\"GT\",\n\t\"GTM\",\n\t\"GU\",\n\t\"GUF\",\n\t\"GUM\",\n\t\"GUY\",\n\t\"GW\",\n\t\"GY\",\n\t\"HK\",\n\t\"HKG\",\n\t\"HM\",\n\t\"HMD\",\n\t\"HN\",\n\t\"HND\",\n\t\"HR\",\n\t\"HRV\",\n\t\"HT\",\n\t\"HTI\",\n\t\"HU\",\n\t\"HUN\",\n\t\"ID\",\n\t\"IDN\",\n\t\"IE\",\n\t\"IL\",\n\t\"IM\",\n\t\"IMN\",\n\t\"IN\",\n\t\"IND\",\n\t\"IO\",\n\t\"IOT\",\n\t\"IQ\",\n\t\"IR\",\n\t\"IRL\",\n\t\"IRN\",\n\t\"IRQ\",\n\t\"IS\",\n\t\"ISL\",\n\t\"ISR\",\n\t\"IT\",\n\t\"ITA\",\n\t\"JAM\",\n\t\"JE\",\n\t\"JEY\",\n\t\"JM\",\n\t\"JO\",\n\t\"JOR\",\n\t\"JP\",\n\t\"JPN\",\n\t\"KAZ\",\n\t\"KE\",\n\t\"KEN\",\n\t\"KG\",\n\t\"KGZ\",\n\t\"KH\",\n\t\"KHM\",\n\t\"KI\",\n\t\"KIR\",\n\t\"KM\",\n\t\"KN-SK\",\n\t\"KNA\",\n\t\"KOR\",\n\t\"KP\",\n\t\"KR\",\n\t\"KW\",\n\t\"KWT\",\n\t\"KY\",\n\t\"KZ\",\n\t\"LA\",\n\t\"LAO\",\n\t\"LB\",\n\t\"LBN\",\n\t\"LBR\",\n\t\"LBY\",\n\t\"LC\",\n\t\"LCA\",\n\t\"LI\",\n\t\"LIE\",\n\t\"LK\",\n\t\"LKA\",\n\t\"LR\",\n\t\"LS\",\n\t\"LSO\",\n\t\"LT\",\n\t\"LTU\",\n\t\"LU\",\n\t\"LUX\",\n\t\"LV\",\n\t\"LVA\",\n\t\"LY\",\n\t\"MA\",\n\t\"MAC\",\n\t\"MAF\",\n\t\"MAR\",\n\t\"MC\",\n\t\"MCO\",\n\t\"MD\",\n\t\"MDA\",\n\t\"MDG\",\n\t\"MDV\",\n\t\"ME\",\n\t\"MEX\",\n\t\"MF\",\n\t\"MG\",\n\t\"MH\",\n\t\"MHL\",\n\t\"MK\",\n\t\"MKD\",\n\t\"ML\",\n\t\"MLI\",\n\t\"MLT\",\n\t\"MM\",\n\t\"MMR\",\n\t\"MN\",\n\t\"MNE\",\n\t\"MNG\",\n\t\"MNP\",\n\t\"MO\",\n\t\"MOZ\",\n\t\"MP\",\n\t\"MQ\",\n\t\"MR\",\n\t\"MRT\",\n\t\"MS\",\n\t\"MSR\",\n\t\"MT\",\n\t\"MTQ\",\n\t\"MU\",\n\t\"MUS\",\n\t\"MV\",\n\t\"MW\",\n\t\"MWI\",\n\t\"MX\",\n\t\"MY\",\n\t\"MYS\",\n\t\"MZ\",\n\t\"NA\",\n\t\"NAM\",\n\t\"NC\",\n\t\"NCL\",\n\t\"NE\",\n\t\"NER\",\n\t\"NF\",\n\t\"NFK\",\n\t\"NG\",\n\t\"NGA\",\n\t\"NI\",\n\t\"NIC\",\n\t\"NIU\",\n\t\"NL\",\n\t\"NLD\",\n\t\"NO\",\n\t\"NOR\",\n\t\"NP\",\n\t\"NPL\",\n\t\"NR\",\n\t\"NRU\",\n\t\"NU\",\n\t\"NZ\",\n\t\"NZL\",\n\t\"OM\",\n\t\"OMN\",\n\t\"PA\",\n\t\"PAK\",\n\t\"PAN\",\n\t\"PCN\",\n\t\"PE\",\n\t\"PER\",\n\t\"PF\",\n\t\"PG\",\n\t\"PH\",\n\t\"PHL\",\n\t\"PK\",\n\t\"PL\",\n\t\"PLW\",\n\t\"PM\",\n\t\"PN\",\n\t\"PNG\",\n\t\"POL\",\n\t\"PR\",\n\t\"PRI\",\n\t\"PRK\",\n\t\"PRT\",\n\t\"PRY\",\n\t\"PS\",\n\t\"PSE\",\n\t\"PT\",\n\t\"PW\",\n\t\"PY\",\n\t\"PYF\",\n\t\"QA\",\n\t\"QAT\",\n\t\"RAINBOW\",\n\t\"RE\",\n\t\"REU\",\n\t\"RO\",\n\t\"ROU\",\n\t\"RS\",\n\t\"RU\",\n\t\"RUS\",\n\t\"RW\",\n\t\"RWA\",\n\t\"SA\",\n\t\"SAU\",\n\t\"SB\",\n\t\"SC\",\n\t\"SD\",\n\t\"SDN\",\n\t\"SE\",\n\t\"SEN\",\n\t\"SG\",\n\t\"SGP\",\n\t\"SGS\",\n\t\"SH\",\n\t\"SHN\",\n\t\"SI\",\n\t\"SJ\",\n\t\"SJM\",\n\t\"SK\",\n\t\"SL\",\n\t\"SLB\",\n\t\"SLE\",\n\t\"SLV\",\n\t\"SM\",\n\t\"SMR\",\n\t\"SN\",\n\t\"SO\",\n\t\"SOM\",\n\t\"SPM\",\n\t\"SR\",\n\t\"SRB\",\n\t\"SS\",\n\t\"SSD\",\n\t\"ST\",\n\t\"STP\",\n\t\"SUR\",\n\t\"SV\",\n\t\"SVK\",\n\t\"SVN\",\n\t\"SWE\",\n\t\"SWZ\",\n\t\"SX\",\n\t\"SXM\",\n\t\"SY\",\n\t\"SYC\",\n\t\"SYR\",\n\t\"SZ\",\n\t\"TC\",\n\t\"TCA\",\n\t\"TCD\",\n\t\"TD\",\n\t\"TF\",\n\t\"TG\",\n\t\"TGO\",\n\t\"TH\",\n\t\"THA\",\n\t\"TJ\",\n\t\"TJK\",\n\t\"TK\",\n\t\"TKL\",\n\t\"TKM\",\n\t\"TL\",\n\t\"TLS\",\n\t\"TM\",\n\t\"TN\",\n\t\"TO\",\n\t\"TON\",\n\t\"TR\",\n\t\"TT\",\n\t\"TTO\",\n\t\"TUN\",\n\t\"TUR\",\n\t\"TUV\",\n\t\"TV\",\n\t\"TW\",\n\t\"TWN\",\n\t\"TZ\",\n\t\"TZA\",\n\t\"UA\",\n\t\"UG\",\n\t\"UGA\",\n\t\"UKR\",\n\t\"UM\",\n\t\"UMI\",\n\t\"UNASUR\",\n\t\"URY\",\n\t\"US\",\n\t\"USA\",\n\t\"UY\",\n\t\"UZ\",\n\t\"UZB\",\n\t\"VA\",\n\t\"VAT\",\n\t\"VC\",\n\t\"VCT\",\n\t\"VE\",\n\t\"VEN\",\n\t\"VG\",\n\t\"VGB\",\n\t\"VI\",\n\t\"VIR\",\n\t\"VN\",\n\t\"VNM\",\n\t\"VU\",\n\t\"VUT\",\n\t\"WF\",\n\t\"WLF\",\n\t\"WS\",\n\t\"WSM\",\n\t\"YE\",\n\t\"YEM\",\n\t\"ZA\",\n\t\"ZAF\",\n\t\"ZM\",\n\t\"ZMB\",\n\t\"ZW\",\n\t\"ZWE\",\n] as const;\ntype CountryCode = (typeof countryCodes)[number];\n\n/**\n * Type Predicate: check if the given value is a valid country code\n */\nfunction isCountryCode(value: unknown): value is CountryCode {\n\treturn countryCodes.includes(value as CountryCode);\n}\n\nexport {\n\t//,\n\tisCountryCode,\n\tcountryCodes,\n};\n\nexport type {\n\t//,\n\tCountryCode,\n};\n"],"mappings":"sIAKA,MAwBM,EAAuB,EAAI,GAAI,CACpC,SAAU,CACT,KAAM,CACL,EAAG,sBACH,EAAG,uBACH,EAAG,aACH,CACD,CACD,CAAC,CAEI,EAAiB,EAAI,GAAI,CAC9B,SAAU,CACT,KAAM,CACL,EAAG,UACH,EAAG,aACH,EAAG,UACH,CACD,CACD,CAAC,CAgBF,SAAS,EAAK,CAEb,YACA,OACA,OAAO,IACP,UAAU,OACV,GAAG,GACM,CACT,IAAM,EAAe,EAAqB,CAAE,OAAM,CAAC,CAGnD,OACC,EAAC,MAAD,CACC,YAAU,OACV,UAAW,EAAG,gCAAiC,EALlC,EAAe,CAAE,OAAM,CAAC,CAKgC,EAAU,CAC/E,GAAI,WAHL,CAKC,EAAC,MAAD,CAAK,cAAA,GAAY,UAAW,EAAG,2CAA4C,EAAa,CAAI,CAAA,CAC5F,EAAC,MAAD,CACC,UAAU,mCACV,IAAK,kCAAsB,EAAK,GAAG,EAAK,MACxC,IAAK,YAAY,IACR,UACR,CAAA,CACG,GAGR,EAAK,YAAc,OCvFnB,MAAM,EAAe,kvFAgvBpB,CAMD,SAAS,EAAc,EAAsC,CAC5D,OAAO,EAAa,SAAS,EAAqB"}
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
@@ -7,6 +7,14 @@ import * as HoverCardPrimitive from "@radix-ui/react-hover-card";
7
7
  /**
8
8
  * A floating card that appears when a user hovers over a trigger element.
9
9
  *
10
+ * `HoverCard` is intended primarily for sighted users — it is not a
11
+ * reliably discoverable path for keyboard or screen reader users, since it
12
+ * opens on pointer hover. Use it for supplemental previews of content that
13
+ * is already available through another accessible path (typically the
14
+ * underlying link). Prefer `Popover` when the floating content must be
15
+ * reachable by all users, or `Tooltip` for short, non-interactive labels on
16
+ * controls.
17
+ *
10
18
  * @see https://mantle.ngrok.com/components/hover-card
11
19
  *
12
20
  * @example
@@ -121,7 +129,7 @@ declare const HoverCard: {
121
129
  * </HoverCard.Root>
122
130
  * ```
123
131
  */
124
- readonly Trigger: _$react.ForwardRefExoticComponent<HoverCardPrimitive.HoverCardTriggerProps & _$react.RefAttributes<HTMLAnchorElement>>;
132
+ readonly Trigger: _$react.ForwardRefExoticComponent<Omit<HoverCardPrimitive.HoverCardTriggerProps & _$react.RefAttributes<HTMLAnchorElement>, "ref"> & _$react.RefAttributes<HTMLAnchorElement>>;
125
133
  };
126
134
  //#endregion
127
135
  export { HoverCard };
@@ -1,2 +1,2 @@
1
- import{t as e}from"./cx-D1HYnpvA.js";import{forwardRef as t}from"react";import{jsx as n}from"react/jsx-runtime";import*as r from"@radix-ui/react-hover-card";const i=({closeDelay:e=300,openDelay:t=100,...i})=>n(r.Root,{closeDelay:e,openDelay:t,...i});i.displayName=`HoverCard`;const a=r.Trigger;a.displayName=`HoverCardTrigger`;const o=r.Portal;o.displayName=`HoverCardPortal`;const s=t(({className:t,onClick:i,align:a=`center`,sideOffset:s=4,...c},l)=>n(o,{children:n(r.Content,{ref:l,align:a,sideOffset:s,className:e(`bg-popover border-popover z-50 w-64 rounded-md border p-4 shadow-md outline-hidden`,`data-state-open:animate-in data-state-closed:animate-out data-state-closed:fade-out-0 data-state-open:fade-in-0 data-state-closed:zoom-out-95 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`,t),onClick:e=>{e.stopPropagation(),i?.(e)},...c})}));s.displayName=r.Content.displayName;const c={Root:i,Content:s,Portal:o,Trigger:a};export{c as HoverCard};
1
+ import{t as e}from"./cx-D1HYnpvA.js";import{forwardRef as t}from"react";import{jsx as n}from"react/jsx-runtime";import*as r from"@radix-ui/react-hover-card";const i=({closeDelay:e=300,openDelay:t=100,...i})=>n(r.Root,{closeDelay:e,openDelay:t,...i});i.displayName=`HoverCard`;const a=t((e,t)=>n(r.Trigger,{ref:t,"data-slot":`hover-card-trigger`,...e}));a.displayName=`HoverCardTrigger`;const o=r.Portal;o.displayName=`HoverCardPortal`;const s=t(({className:t,onClick:i,align:a=`center`,sideOffset:s=4,...c},l)=>n(o,{children:n(r.Content,{ref:l,"data-slot":`hover-card-content`,align:a,sideOffset:s,className:e(`bg-popover border-popover z-50 w-64 rounded-md border p-4 shadow-md outline-hidden`,`data-state-open:animate-in data-state-closed:animate-out data-state-closed:fade-out-0 data-state-open:fade-in-0 data-state-closed:zoom-out-95 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`,t),onClick:e=>{e.stopPropagation(),i?.(e)},...c})}));s.displayName=r.Content.displayName;const c={Root:i,Content:s,Portal:o,Trigger:a};export{c as HoverCard};
2
2
  //# sourceMappingURL=hover-card.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"hover-card.js","names":[],"sources":["../src/components/hover-card/hover-card.tsx"],"sourcesContent":["\"use client\";\n\nimport * as HoverCardPrimitive from \"@radix-ui/react-hover-card\";\nimport { forwardRef } from \"react\";\nimport type { ComponentPropsWithoutRef, ComponentRef } from \"react\";\nimport { cx } from \"../../utils/cx/cx.js\";\n\n/**\n * A floating card that appears when a user hovers over a trigger element.\n * This is the root, stateful component that manages the open/closed state of the hover card.\n *\n * @see https://mantle.ngrok.com/components/hover-card#hovercardroot\n *\n * @example\n * ```tsx\n * <HoverCard.Root>\n * <HoverCard.Trigger asChild>\n * <Button type=\"button\" appearance=\"outlined\">\n * Hover me\n * </Button>\n * </HoverCard.Trigger>\n * <HoverCard.Content>\n * <p>This is the hover card content.</p>\n * </HoverCard.Content>\n * </HoverCard.Root>\n * ```\n */\nconst Root = ({\n\tcloseDelay = 300,\n\topenDelay = 100,\n\t...props\n}: ComponentPropsWithoutRef<typeof HoverCardPrimitive.Root>) => (\n\t<HoverCardPrimitive.Root closeDelay={closeDelay} openDelay={openDelay} {...props} />\n);\nRoot.displayName = \"HoverCard\";\n\n/**\n * The trigger element that opens the hover card when hovered.\n *\n * @see https://mantle.ngrok.com/components/hover-card#hovercardtrigger\n *\n * @example\n * ```tsx\n * <HoverCard.Root>\n * <HoverCard.Trigger asChild>\n * <Button type=\"button\" appearance=\"outlined\">\n * Hover me\n * </Button>\n * </HoverCard.Trigger>\n * <HoverCard.Content>\n * <p>This is the hover card content.</p>\n * </HoverCard.Content>\n * </HoverCard.Root>\n * ```\n */\nconst Trigger = HoverCardPrimitive.Trigger;\nTrigger.displayName = \"HoverCardTrigger\";\n\n/**\n * The portal for a HoverCard. Should be rendered as a child of the `HoverCard` component.\n * Renders a portal that the `HoverCard.Content` is rendered into.\n *\n * You likely don't need to use this component directly, as it is used internally by the `HoverCard.Content` component.\n */\nconst Portal = HoverCardPrimitive.Portal;\nPortal.displayName = \"HoverCardPortal\";\n\n/**\n * The content to render inside the hover card.\n *\n * @see https://mantle.ngrok.com/components/hover-card#hovercardcontent\n *\n * @example\n * ```tsx\n * <HoverCard.Root>\n * <HoverCard.Trigger asChild>\n * <Button type=\"button\" appearance=\"outlined\">\n * Hover me\n * </Button>\n * </HoverCard.Trigger>\n * <HoverCard.Content>\n * <p>This is the hover card content.</p>\n * </HoverCard.Content>\n * </HoverCard.Root>\n * ```\n */\nconst Content = forwardRef<\n\tComponentRef<typeof HoverCardPrimitive.Content>,\n\tComponentPropsWithoutRef<typeof HoverCardPrimitive.Content>\n>(({ className, onClick, align = \"center\", sideOffset = 4, ...props }, ref) => (\n\t<Portal>\n\t\t<HoverCardPrimitive.Content\n\t\t\tref={ref}\n\t\t\talign={align}\n\t\t\tsideOffset={sideOffset}\n\t\t\tclassName={cx(\n\t\t\t\t\"bg-popover border-popover z-50 w-64 rounded-md border p-4 shadow-md outline-hidden\",\n\t\t\t\t\"data-state-open:animate-in data-state-closed:animate-out data-state-closed:fade-out-0 data-state-open:fade-in-0 data-state-closed:zoom-out-95 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\",\n\t\t\t\tclassName,\n\t\t\t)}\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 */\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 = HoverCardPrimitive.Content.displayName;\n\n/**\n * A floating card that appears when a user hovers over a trigger element.\n *\n * @see https://mantle.ngrok.com/components/hover-card\n *\n * @example\n * Composition:\n * ```\n * HoverCard.Root\n * ├── HoverCard.Trigger\n * └── HoverCard.Content\n * ```\n *\n * @example\n * ```tsx\n * <HoverCard.Root>\n * <HoverCard.Trigger asChild>\n * <Button type=\"button\" appearance=\"outlined\">\n * Hover me\n * </Button>\n * </HoverCard.Trigger>\n * <HoverCard.Content>\n * <p>This is the hover card content.</p>\n * </HoverCard.Content>\n * </HoverCard.Root>\n * ```\n */\nconst HoverCard = {\n\t/**\n\t * The root, stateful component that manages the open/closed state of the hover card.\n\t *\n\t * @see https://mantle.ngrok.com/components/hover-card#hovercardroot\n\t *\n\t * @example\n\t * ```tsx\n\t * <HoverCard.Root>\n\t * <HoverCard.Trigger asChild>\n\t * <Button>Hover me</Button>\n\t * </HoverCard.Trigger>\n\t * <HoverCard.Content>\n\t * <p>This is the hover card content.</p>\n\t * </HoverCard.Content>\n\t * </HoverCard.Root>\n\t * ```\n\t */\n\tRoot,\n\t/**\n\t * The content to render inside the hover card. Appears in a portal with rich styling and animations.\n\t *\n\t * @see https://mantle.ngrok.com/components/hover-card#hovercardcontent\n\t *\n\t * @example\n\t * ```tsx\n\t * <HoverCard.Root>\n\t * <HoverCard.Trigger asChild>\n\t * <Button type=\"button\" variant=\"link\">@username</Button>\n\t * </HoverCard.Trigger>\n\t * <HoverCard.Content side=\"top\">\n\t * <div className=\"space-y-2\">\n\t * <Text weight=\"strong\">User Profile</Text>\n\t * <Text>Additional information about the user.</Text>\n\t * <Button type=\"button\" size=\"sm\">Follow</Button>\n\t * </div>\n\t * </HoverCard.Content>\n\t * </HoverCard.Root>\n\t * ```\n\t */\n\tContent,\n\t/**\n\t * The portal container for rendering hover card content outside the normal DOM tree.\n\t *\n\t * @see https://mantle.ngrok.com/components/hover-card#api-reference\n\t *\n\t * @example\n\t * ```tsx\n\t * <HoverCard.Root>\n\t * <HoverCard.Trigger asChild>\n\t * <Text>Hover over me</Text>\n\t * </HoverCard.Trigger>\n\t * <HoverCard.Portal>\n\t * <HoverCard.Content>\n\t * <Text>This content is rendered in a portal.</Text>\n\t * </HoverCard.Content>\n\t * </HoverCard.Portal>\n\t * </HoverCard.Root>\n\t * ```\n\t */\n\tPortal,\n\t/**\n\t * The trigger element that opens the hover card when hovered.\n\t *\n\t * @see https://mantle.ngrok.com/components/hover-card#hovercardtrigger\n\t *\n\t * @example\n\t * ```tsx\n\t * <HoverCard.Root>\n\t * <HoverCard.Trigger asChild>\n\t * <Button type=\"button\" variant=\"ghost\">\n\t * Hover for details\n\t * </Button>\n\t * </HoverCard.Trigger>\n\t * <HoverCard.Content>\n\t * <div className=\"space-y-1\">\n\t * <Text weight=\"strong\">Quick Info</Text>\n\t * <Text>This appears when you hover over the trigger.</Text>\n\t * </div>\n\t * </HoverCard.Content>\n\t * </HoverCard.Root>\n\t * ```\n\t */\n\tTrigger,\n} as const;\n\nexport {\n\t//,\n\tHoverCard,\n};\n"],"mappings":"6JA2BA,MAAM,GAAQ,CACb,aAAa,IACb,YAAY,IACZ,GAAG,KAEH,EAAC,EAAmB,KAApB,CAAqC,aAAuB,YAAW,GAAI,EAAS,CAAA,CAErF,EAAK,YAAc,YAqBnB,MAAM,EAAU,EAAmB,QACnC,EAAQ,YAAc,mBAQtB,MAAM,EAAS,EAAmB,OAClC,EAAO,YAAc,kBAqBrB,MAAM,EAAU,GAGb,CAAE,YAAW,UAAS,QAAQ,SAAU,aAAa,EAAG,GAAG,GAAS,IACtE,EAAC,EAAD,CAAA,SACC,EAAC,EAAmB,QAApB,CACM,MACE,QACK,aACZ,UAAW,EACV,qFACA,+TACA,EACA,CACD,QAAU,GAAU,CAInB,EAAM,iBAAiB,CACvB,IAAU,EAAM,EAEjB,GAAI,EACH,CAAA,CACM,CAAA,CACR,CACF,EAAQ,YAAc,EAAmB,QAAQ,YA6BjD,MAAM,EAAY,CAkBjB,OAsBA,UAoBA,SAuBA,UACA"}
1
+ {"version":3,"file":"hover-card.js","names":[],"sources":["../src/components/hover-card/hover-card.tsx"],"sourcesContent":["\"use client\";\n\nimport * as HoverCardPrimitive from \"@radix-ui/react-hover-card\";\nimport { forwardRef } from \"react\";\nimport type { ComponentPropsWithoutRef, ComponentRef } from \"react\";\nimport { cx } from \"../../utils/cx/cx.js\";\n\n/**\n * A floating card that appears when a user hovers over a trigger element.\n * This is the root, stateful component that manages the open/closed state of the hover card.\n *\n * @see https://mantle.ngrok.com/components/hover-card#hovercardroot\n *\n * @example\n * ```tsx\n * <HoverCard.Root>\n * <HoverCard.Trigger asChild>\n * <Button type=\"button\" appearance=\"outlined\">\n * Hover me\n * </Button>\n * </HoverCard.Trigger>\n * <HoverCard.Content>\n * <p>This is the hover card content.</p>\n * </HoverCard.Content>\n * </HoverCard.Root>\n * ```\n */\nconst Root = ({\n\tcloseDelay = 300,\n\topenDelay = 100,\n\t...props\n}: ComponentPropsWithoutRef<typeof HoverCardPrimitive.Root>) => (\n\t<HoverCardPrimitive.Root closeDelay={closeDelay} openDelay={openDelay} {...props} />\n);\nRoot.displayName = \"HoverCard\";\n\n/**\n * The trigger element that opens the hover card when hovered.\n *\n * @see https://mantle.ngrok.com/components/hover-card#hovercardtrigger\n *\n * @example\n * ```tsx\n * <HoverCard.Root>\n * <HoverCard.Trigger asChild>\n * <Button type=\"button\" appearance=\"outlined\">\n * Hover me\n * </Button>\n * </HoverCard.Trigger>\n * <HoverCard.Content>\n * <p>This is the hover card content.</p>\n * </HoverCard.Content>\n * </HoverCard.Root>\n * ```\n */\nconst Trigger = forwardRef<\n\tComponentRef<typeof HoverCardPrimitive.Trigger>,\n\tComponentPropsWithoutRef<typeof HoverCardPrimitive.Trigger>\n>((props, ref) => (\n\t<HoverCardPrimitive.Trigger ref={ref} data-slot=\"hover-card-trigger\" {...props} />\n));\nTrigger.displayName = \"HoverCardTrigger\";\n\n/**\n * The portal for a HoverCard. Should be rendered as a child of the `HoverCard` component.\n * Renders a portal that the `HoverCard.Content` is rendered into.\n *\n * You likely don't need to use this component directly, as it is used internally by the `HoverCard.Content` component.\n */\nconst Portal = HoverCardPrimitive.Portal;\nPortal.displayName = \"HoverCardPortal\";\n\n/**\n * The content to render inside the hover card.\n *\n * @see https://mantle.ngrok.com/components/hover-card#hovercardcontent\n *\n * @example\n * ```tsx\n * <HoverCard.Root>\n * <HoverCard.Trigger asChild>\n * <Button type=\"button\" appearance=\"outlined\">\n * Hover me\n * </Button>\n * </HoverCard.Trigger>\n * <HoverCard.Content>\n * <p>This is the hover card content.</p>\n * </HoverCard.Content>\n * </HoverCard.Root>\n * ```\n */\nconst Content = forwardRef<\n\tComponentRef<typeof HoverCardPrimitive.Content>,\n\tComponentPropsWithoutRef<typeof HoverCardPrimitive.Content>\n>(({ className, onClick, align = \"center\", sideOffset = 4, ...props }, ref) => (\n\t<Portal>\n\t\t<HoverCardPrimitive.Content\n\t\t\tref={ref}\n\t\t\tdata-slot=\"hover-card-content\"\n\t\t\talign={align}\n\t\t\tsideOffset={sideOffset}\n\t\t\tclassName={cx(\n\t\t\t\t\"bg-popover border-popover z-50 w-64 rounded-md border p-4 shadow-md outline-hidden\",\n\t\t\t\t\"data-state-open:animate-in data-state-closed:animate-out data-state-closed:fade-out-0 data-state-open:fade-in-0 data-state-closed:zoom-out-95 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\",\n\t\t\t\tclassName,\n\t\t\t)}\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 */\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 = HoverCardPrimitive.Content.displayName;\n\n/**\n * A floating card that appears when a user hovers over a trigger element.\n *\n * `HoverCard` is intended primarily for sighted users — it is not a\n * reliably discoverable path for keyboard or screen reader users, since it\n * opens on pointer hover. Use it for supplemental previews of content that\n * is already available through another accessible path (typically the\n * underlying link). Prefer `Popover` when the floating content must be\n * reachable by all users, or `Tooltip` for short, non-interactive labels on\n * controls.\n *\n * @see https://mantle.ngrok.com/components/hover-card\n *\n * @example\n * Composition:\n * ```\n * HoverCard.Root\n * ├── HoverCard.Trigger\n * └── HoverCard.Content\n * ```\n *\n * @example\n * ```tsx\n * <HoverCard.Root>\n * <HoverCard.Trigger asChild>\n * <Button type=\"button\" appearance=\"outlined\">\n * Hover me\n * </Button>\n * </HoverCard.Trigger>\n * <HoverCard.Content>\n * <p>This is the hover card content.</p>\n * </HoverCard.Content>\n * </HoverCard.Root>\n * ```\n */\nconst HoverCard = {\n\t/**\n\t * The root, stateful component that manages the open/closed state of the hover card.\n\t *\n\t * @see https://mantle.ngrok.com/components/hover-card#hovercardroot\n\t *\n\t * @example\n\t * ```tsx\n\t * <HoverCard.Root>\n\t * <HoverCard.Trigger asChild>\n\t * <Button>Hover me</Button>\n\t * </HoverCard.Trigger>\n\t * <HoverCard.Content>\n\t * <p>This is the hover card content.</p>\n\t * </HoverCard.Content>\n\t * </HoverCard.Root>\n\t * ```\n\t */\n\tRoot,\n\t/**\n\t * The content to render inside the hover card. Appears in a portal with rich styling and animations.\n\t *\n\t * @see https://mantle.ngrok.com/components/hover-card#hovercardcontent\n\t *\n\t * @example\n\t * ```tsx\n\t * <HoverCard.Root>\n\t * <HoverCard.Trigger asChild>\n\t * <Button type=\"button\" variant=\"link\">@username</Button>\n\t * </HoverCard.Trigger>\n\t * <HoverCard.Content side=\"top\">\n\t * <div className=\"space-y-2\">\n\t * <Text weight=\"strong\">User Profile</Text>\n\t * <Text>Additional information about the user.</Text>\n\t * <Button type=\"button\" size=\"sm\">Follow</Button>\n\t * </div>\n\t * </HoverCard.Content>\n\t * </HoverCard.Root>\n\t * ```\n\t */\n\tContent,\n\t/**\n\t * The portal container for rendering hover card content outside the normal DOM tree.\n\t *\n\t * @see https://mantle.ngrok.com/components/hover-card#api-reference\n\t *\n\t * @example\n\t * ```tsx\n\t * <HoverCard.Root>\n\t * <HoverCard.Trigger asChild>\n\t * <Text>Hover over me</Text>\n\t * </HoverCard.Trigger>\n\t * <HoverCard.Portal>\n\t * <HoverCard.Content>\n\t * <Text>This content is rendered in a portal.</Text>\n\t * </HoverCard.Content>\n\t * </HoverCard.Portal>\n\t * </HoverCard.Root>\n\t * ```\n\t */\n\tPortal,\n\t/**\n\t * The trigger element that opens the hover card when hovered.\n\t *\n\t * @see https://mantle.ngrok.com/components/hover-card#hovercardtrigger\n\t *\n\t * @example\n\t * ```tsx\n\t * <HoverCard.Root>\n\t * <HoverCard.Trigger asChild>\n\t * <Button type=\"button\" variant=\"ghost\">\n\t * Hover for details\n\t * </Button>\n\t * </HoverCard.Trigger>\n\t * <HoverCard.Content>\n\t * <div className=\"space-y-1\">\n\t * <Text weight=\"strong\">Quick Info</Text>\n\t * <Text>This appears when you hover over the trigger.</Text>\n\t * </div>\n\t * </HoverCard.Content>\n\t * </HoverCard.Root>\n\t * ```\n\t */\n\tTrigger,\n} as const;\n\nexport {\n\t//,\n\tHoverCard,\n};\n"],"mappings":"6JA2BA,MAAM,GAAQ,CACb,aAAa,IACb,YAAY,IACZ,GAAG,KAEH,EAAC,EAAmB,KAApB,CAAqC,aAAuB,YAAW,GAAI,EAAS,CAAA,CAErF,EAAK,YAAc,YAqBnB,MAAM,EAAU,GAGb,EAAO,IACT,EAAC,EAAmB,QAApB,CAAiC,MAAK,YAAU,qBAAqB,GAAI,EAAS,CAAA,CACjF,CACF,EAAQ,YAAc,mBAQtB,MAAM,EAAS,EAAmB,OAClC,EAAO,YAAc,kBAqBrB,MAAM,EAAU,GAGb,CAAE,YAAW,UAAS,QAAQ,SAAU,aAAa,EAAG,GAAG,GAAS,IACtE,EAAC,EAAD,CAAA,SACC,EAAC,EAAmB,QAApB,CACM,MACL,YAAU,qBACH,QACK,aACZ,UAAW,EACV,qFACA,+TACA,EACA,CACD,QAAU,GAAU,CAInB,EAAM,iBAAiB,CACvB,IAAU,EAAM,EAEjB,GAAI,EACH,CAAA,CACM,CAAA,CACR,CACF,EAAQ,YAAc,EAAmB,QAAQ,YAqCjD,MAAM,EAAY,CAkBjB,OAsBA,UAoBA,SAuBA,UACA"}
@@ -1,4 +1,4 @@
1
- import { t as SvgAttributes } from "./types-zKzi66a6.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-C7Dje_lR.d.ts.map
27
+ //# sourceMappingURL=icon-DKMJm20j.d.ts.map
@@ -0,0 +1,2 @@
1
+ import{t as e}from"./cx-D1HYnpvA.js";import{t}from"./svg-only-7gYlsX8f.js";import{forwardRef as n}from"react";import{jsx as r}from"react/jsx-runtime";const i=n(({className:n,style:i,svg:a,...o},s)=>r(t,{ref:s,"data-slot":`icon`,className:e(`size-5`,n),style:i,svg:a,...o}));i.displayName=`Icon`;export{i as t};
2
+ //# sourceMappingURL=icon-bWc5yC3-.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"icon-BMH0fD_b.js","names":[],"sources":["../src/components/icon/icon.tsx"],"sourcesContent":["import { type ComponentRef, type ReactNode, forwardRef } from \"react\";\nimport { cx } from \"../../utils/cx/cx.js\";\nimport { SvgOnly } from \"./svg-only.js\";\nimport type { SvgAttributes } from \"./types.js\";\n\ntype IconProps = Omit<SvgAttributes, \"children\"> & {\n\t/**\n\t * A single SVG icon element.\n\t */\n\tsvg: ReactNode;\n};\n\n/**\n * Decorates an svg icon with automatic sizing styles and a `shrink-0` class.\n *\n * @see https://mantle.ngrok.com/components/icon\n *\n * @example\n * ```tsx\n * import { ShrimpIcon } from \"@phosphor-icons/react/Shrimp\";\n *\n * <Icon svg={<ShrimpIcon />} />\n * ```\n */\nconst Icon = forwardRef<ComponentRef<\"svg\">, IconProps>(\n\t({ className, style, svg, ...props }, ref) => (\n\t\t<SvgOnly ref={ref} className={cx(\"size-5\", className)} style={style} svg={svg} {...props} />\n\t),\n);\nIcon.displayName = \"Icon\";\n\nexport {\n\t//,\n\tIcon,\n};\n\nexport type {\n\t//,\n\tIconProps,\n};\n"],"mappings":"sJAwBA,MAAM,EAAO,GACX,CAAE,YAAW,QAAO,MAAK,GAAG,GAAS,IACrC,EAAC,EAAD,CAAc,MAAK,UAAW,EAAG,SAAU,EAAU,CAAS,QAAY,MAAK,GAAI,EAAS,CAAA,CAE7F,CACD,EAAK,YAAc"}
1
+ {"version":3,"file":"icon-bWc5yC3-.js","names":[],"sources":["../src/components/icon/icon.tsx"],"sourcesContent":["import { type ComponentRef, type ReactNode, forwardRef } from \"react\";\nimport { cx } from \"../../utils/cx/cx.js\";\nimport { SvgOnly } from \"./svg-only.js\";\nimport type { SvgAttributes } from \"./types.js\";\n\ntype IconProps = Omit<SvgAttributes, \"children\"> & {\n\t/**\n\t * A single SVG icon element.\n\t */\n\tsvg: ReactNode;\n};\n\n/**\n * Decorates an svg icon with automatic sizing styles and a `shrink-0` class.\n *\n * @see https://mantle.ngrok.com/components/icon\n *\n * @example\n * ```tsx\n * import { ShrimpIcon } from \"@phosphor-icons/react/Shrimp\";\n *\n * <Icon svg={<ShrimpIcon />} />\n * ```\n */\nconst Icon = forwardRef<ComponentRef<\"svg\">, IconProps>(\n\t({ className, style, svg, ...props }, ref) => (\n\t\t<SvgOnly\n\t\t\tref={ref}\n\t\t\tdata-slot=\"icon\"\n\t\t\tclassName={cx(\"size-5\", className)}\n\t\t\tstyle={style}\n\t\t\tsvg={svg}\n\t\t\t{...props}\n\t\t/>\n\t),\n);\nIcon.displayName = \"Icon\";\n\nexport {\n\t//,\n\tIcon,\n};\n\nexport type {\n\t//,\n\tIconProps,\n};\n"],"mappings":"sJAwBA,MAAM,EAAO,GACX,CAAE,YAAW,QAAO,MAAK,GAAG,GAAS,IACrC,EAAC,EAAD,CACM,MACL,YAAU,OACV,UAAW,EAAG,SAAU,EAAU,CAC3B,QACF,MACL,GAAI,EACH,CAAA,CAEH,CACD,EAAK,YAAc"}
@@ -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
@@ -1,2 +1,2 @@
1
- import{t as e}from"./cx-D1HYnpvA.js";import{t}from"./icon-BMH0fD_b.js";import{t as n}from"./booleanish-CBGdPL3Q.js";import{t as r}from"./slot-D_ZUrdEW.js";import{Children as i,cloneElement as a,forwardRef as o,isValidElement as s}from"react";import c from"tiny-invariant";import{Fragment as l,jsx as u,jsxs as d}from"react/jsx-runtime";import{cva as f}from"class-variance-authority";import{CircleNotchIcon as p}from"@phosphor-icons/react/CircleNotch";const m=e(`icon-button`,`inline-flex shrink-0 items-center justify-center rounded-[var(--icon-button-border-radius,0.375rem)] border`,`focus:outline-hidden focus-visible:ring-4`,`disabled:cursor-default disabled:opacity-50`,`not-disabled:active:scale-97 ease-out transition-transform duration-150`),h=f(m,{variants:{appearance:{ghost:`text-strong focus-visible:ring-focus-accent not-disabled:hover:bg-neutral-500/10 not-disabled:hover:text-strong border-transparent`,outlined:`border-form bg-form text-strong focus-visible:border-accent-600 focus-visible:ring-focus-accent not-disabled:hover:border-neutral-400 not-disabled:hover:bg-form-hover not-disabled:hover:text-strong focus-visible:not-disabled:hover:border-accent-600 focus-visible:not-disabled:active:border-accent-600`},isLoading:{false:``,true:`opacity-50`},size:{xs:`size-6`,sm:`size-7`,md:`size-9`}},defaultVariants:{appearance:`outlined`,size:`md`}}),g=o(({"aria-disabled":o,appearance:f,asChild:m=!1,children:g,className:_,disabled:v,icon:y,isLoading:b=!1,label:x,size:S,type:C,...w},T)=>{let E=n(o??v??b),D=b?u(p,{className:`animate-spin`}):y,O={"aria-disabled":E,className:e(h({appearance:f,isLoading:b,size:S}),_),"data-appearance":f,"data-disabled":E,"data-icon-button":!0,"data-loading":b,"data-size":S,disabled:E,ref:T,...w},k=d(l,{children:[u(`span`,{className:`sr-only`,children:x}),u(t,{svg:D})]});return m?(c(s(g)&&i.only(g),"When using `asChild`, IconButton must be passed a single child as a JSX tag."),u(r,{...O,children:a(g,{},k)})):u(`button`,{...O,type:C,children:k})});g.displayName=`IconButton`;export{m as n,h as r,g as t};
2
- //# sourceMappingURL=icon-button-CxxVPiKp.js.map
1
+ import{t as e}from"./cx-D1HYnpvA.js";import{t}from"./icon-bWc5yC3-.js";import{t as n}from"./booleanish-CBGdPL3Q.js";import{t as r}from"./slot-D_ZUrdEW.js";import{Children as i,cloneElement as a,forwardRef as o,isValidElement as s}from"react";import c from"tiny-invariant";import{Fragment as l,jsx as u,jsxs as d}from"react/jsx-runtime";import{cva as f}from"class-variance-authority";import{CircleNotchIcon as p}from"@phosphor-icons/react/CircleNotch";const m=e(`icon-button`,`inline-flex shrink-0 items-center justify-center rounded-[var(--icon-button-border-radius,0.375rem)] border`,`focus:outline-hidden focus-visible:ring-4`,`disabled:cursor-default disabled:opacity-50`,`not-disabled:active:scale-97 ease-out transition-transform duration-150`),h=f(m,{variants:{appearance:{ghost:`text-strong focus-visible:ring-focus-accent not-disabled:hover:bg-neutral-500/10 not-disabled:hover:text-strong border-transparent`,outlined:`border-form bg-form text-strong focus-visible:border-accent-600 focus-visible:ring-focus-accent not-disabled:hover:border-neutral-400 not-disabled:hover:bg-form-hover not-disabled:hover:text-strong focus-visible:not-disabled:hover:border-accent-600 focus-visible:not-disabled:active:border-accent-600`},isLoading:{false:``,true:`opacity-50`},size:{xs:`size-6`,sm:`size-7`,md:`size-9`}},defaultVariants:{appearance:`outlined`,size:`md`}}),g=o(({"aria-disabled":o,appearance:f,asChild:m=!1,children:g,className:_,disabled:v,icon:y,isLoading:b=!1,label:x,size:S,type:C,...w},T)=>{let E=n(o??v??b),D=b?u(p,{className:`animate-spin`}):y,O={"aria-disabled":E,"data-slot":`icon-button`,className:e(h({appearance:f,isLoading:b,size:S}),_),"data-appearance":f,"data-disabled":E,"data-icon-button":!0,"data-loading":b,"data-size":S,disabled:E,ref:T,...w},k=d(l,{children:[u(`span`,{className:`sr-only`,children:x}),u(t,{svg:D})]});return m?(c(s(g)&&i.only(g),"When using `asChild`, IconButton must be passed a single child as a JSX tag."),u(r,{...O,children:a(g,{},k)})):u(`button`,{...O,type:C,children:k})});g.displayName=`IconButton`;export{m as n,h as r,g as t};
2
+ //# sourceMappingURL=icon-button-ZKN0sRIJ.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"icon-button-CxxVPiKp.js","names":[],"sources":["../src/components/button/icon-button.tsx"],"sourcesContent":["import { CircleNotchIcon } from \"@phosphor-icons/react/CircleNotch\";\nimport { cva } from \"class-variance-authority\";\nimport type { ButtonHTMLAttributes, ReactNode } from \"react\";\nimport { Children, cloneElement, forwardRef, isValidElement } from \"react\";\nimport invariant from \"tiny-invariant\";\nimport type { VariantProps, WithAsChild } from \"../../types/index.js\";\nimport { parseBooleanish } from \"../../types/index.js\";\nimport { cx } from \"../../utils/cx/cx.js\";\nimport { Icon } from \"../icon/index.js\";\nimport { Slot } from \"../slot/index.js\";\n\nconst baseIconButtonClasses = cx(\n\t\"icon-button\",\n\t\"inline-flex shrink-0 items-center justify-center rounded-[var(--icon-button-border-radius,0.375rem)] border\",\n\t\"focus:outline-hidden focus-visible:ring-4\",\n\t\"disabled:cursor-default disabled:opacity-50\",\n\t\"not-disabled:active:scale-97 ease-out transition-transform duration-150\",\n);\n\nconst iconButtonVariants = cva(baseIconButtonClasses, {\n\tvariants: {\n\t\t/**\n\t\t * Defines the visual style of the Button.\n\t\t */\n\t\tappearance: {\n\t\t\tghost:\n\t\t\t\t\"text-strong focus-visible:ring-focus-accent not-disabled:hover:bg-neutral-500/10 not-disabled:hover:text-strong border-transparent\",\n\t\t\toutlined:\n\t\t\t\t\"border-form bg-form text-strong focus-visible:border-accent-600 focus-visible:ring-focus-accent not-disabled:hover:border-neutral-400 not-disabled:hover:bg-form-hover not-disabled:hover:text-strong focus-visible:not-disabled:hover:border-accent-600 focus-visible:not-disabled:active:border-accent-600\",\n\t\t},\n\t\t/**\n\t\t * Whether or not the button is in a loading state, default `false`. Setting `isLoading` will\n\t\t * replace the `icon` with a spinner.\n\t\t * It will also disable user interaction with the button and set `aria-disabled`.\n\t\t */\n\t\tisLoading: {\n\t\t\tfalse: \"\",\n\t\t\ttrue: \"opacity-50\",\n\t\t},\n\t\t/**\n\t\t * The size of the IconButton.\n\t\t */\n\t\tsize: {\n\t\t\txs: \"size-6\",\n\t\t\tsm: \"size-7\",\n\t\t\tmd: \"size-9\",\n\t\t},\n\t},\n\tdefaultVariants: {\n\t\tappearance: \"outlined\",\n\t\tsize: \"md\",\n\t},\n});\n\ntype IconButtonVariants = VariantProps<typeof iconButtonVariants>;\n\n/**\n * The props for the `Button` component.\n */\ntype IconButtonProps = ButtonHTMLAttributes<HTMLButtonElement> &\n\tWithAsChild &\n\tIconButtonVariants & {\n\t\t/**\n\t\t * The accessible label for the icon. This label will be visually hidden but announced to screen reader users, similar to alt text for img tags.\n\t\t */\n\t\tlabel: string;\n\t\t/**\n\t\t * An icon to render inside the button. If the `state` is `\"pending\"`, then\n\t\t * the icon will automatically be replaced with a spinner.\n\t\t */\n\t\ticon: ReactNode;\n\t} & (\n\t\t| {\n\t\t\t\t/**\n\t\t\t\t * Use the `asChild` prop to compose Radix's functionality onto alternative\n\t\t\t\t * element types or your own React components.\n\t\t\t\t *\n\t\t\t\t * When `asChild` is set to `true`, mantle will not render a default DOM\n\t\t\t\t * element, instead cloning the component's child and passing it the props and\n\t\t\t\t * behavior required to make it functional.\n\t\t\t\t *\n\t\t\t\t * asChild can be used as deeply as you need to. This means it is a great way\n\t\t\t\t * to compose multiple primitive's behavior together.\n\t\t\t\t *\n\t\t\t\t * @see https://www.radix-ui.com/docs/primitives/guides/composition#composition\n\t\t\t\t */\n\t\t\t\tasChild: true;\n\t\t\t\t/**\n\t\t\t\t * The default behavior of the button. Possible values are: `\"button\"`, `\"submit\"`, and `\"reset\"`.\n\t\t\t\t *\n\t\t\t\t * if `asChild` is NOT used: Unlike the native `<button>` element, this prop is required and has no default value.\n\t\t\t\t *\n\t\t\t\t * If `asChild` IS used: This prop HAS NO EFFECT, is REMOVED, and has no default value. This is because we do not want the `button` `type` to automatically merge with any child anchor `type` attribute because the `anchor` `type` is _strictly different_ than the `button` type, see: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#type\n\t\t\t\t *\n\t\t\t\t * @enum\n\t\t\t\t * - `\"button\"`: The button has no default behavior, and does nothing when pressed by default. It can have client-side scripts listen to the element's events, which are triggered when the events occur.\n\t\t\t\t * - `\"reset\"`: The button resets all the controls to their initial values.\n\t\t\t\t * - `\"submit\"`: The button submits the form data to the server.\n\t\t\t\t *\n\t\t\t\t * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#type\n\t\t\t\t */\n\t\t\t\ttype?: ButtonHTMLAttributes<HTMLButtonElement>[\"type\"];\n\t\t }\n\t\t| {\n\t\t\t\tasChild?: false | undefined;\n\t\t\t\t/**\n\t\t\t\t * The default behavior of the button. Possible values are: `\"button\"`, `\"submit\"`, and `\"reset\"`.\n\t\t\t\t *\n\t\t\t\t * if `asChild` is NOT used: Unlike the native `<button>` element, this prop is required and has no default value.\n\t\t\t\t *\n\t\t\t\t * If `asChild` IS used: This prop HAS NO EFFECT, is REMOVED, and has no default value. This is because we do not want the `button` `type` to automatically merge with any child anchor `type` attribute because the `anchor` `type` is _strictly different_ than the `button` type, see: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#type\n\t\t\t\t *\n\t\t\t\t * @enum\n\t\t\t\t * - `\"button\"`: The button has no default behavior, and does nothing when pressed by default. It can have client-side scripts listen to the element's events, which are triggered when the events occur.\n\t\t\t\t * - `\"reset\"`: The button resets all the controls to their initial values.\n\t\t\t\t * - `\"submit\"`: The button submits the form data to the server.\n\t\t\t\t *\n\t\t\t\t * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#type\n\t\t\t\t */\n\t\t\t\ttype: Exclude<ButtonHTMLAttributes<HTMLButtonElement>[\"type\"], undefined>;\n\t\t }\n\t);\n\n/**\n * Renders a button or a component that looks like a button, an interactive\n * element activated by a user with a mouse, keyboard, finger, voice command, or\n * other assistive technology. Once activated, it then performs an action, such\n * as submitting a form or opening a dialog.\n * Renders only a single icon as children with an accessible, screen-reader-only label.\n *\n * @see https://mantle.ngrok.com/components/button\n *\n * @example\n * ```tsx\n * <IconButton\n * type=\"button\"\n * icon={<TrashIcon />}\n * label=\"Delete item\"\n * appearance=\"ghost\"\n * size=\"sm\"\n * />\n * ```\n */\nconst IconButton = forwardRef<HTMLButtonElement, IconButtonProps>(\n\t(\n\t\t{\n\t\t\t\"aria-disabled\": _ariaDisabled,\n\t\t\tappearance,\n\t\t\tasChild = false,\n\t\t\tchildren,\n\t\t\tclassName,\n\t\t\tdisabled: _disabled,\n\t\t\ticon: propIcon,\n\t\t\tisLoading = false,\n\t\t\tlabel,\n\t\t\tsize,\n\t\t\ttype,\n\t\t\t...props\n\t\t},\n\t\tref,\n\t) => {\n\t\tconst disabled = parseBooleanish(_ariaDisabled ?? _disabled ?? isLoading);\n\t\tconst icon = isLoading ? <CircleNotchIcon className=\"animate-spin\" /> : propIcon;\n\n\t\tconst buttonProps = {\n\t\t\t\"aria-disabled\": disabled,\n\t\t\tclassName: cx(iconButtonVariants({ appearance, isLoading, size }), className),\n\t\t\t\"data-appearance\": appearance,\n\t\t\t\"data-disabled\": disabled,\n\t\t\t\"data-icon-button\": true,\n\t\t\t\"data-loading\": isLoading,\n\t\t\t\"data-size\": size,\n\t\t\tdisabled,\n\t\t\tref,\n\t\t\t...props,\n\t\t};\n\n\t\tconst innerChildren = (\n\t\t\t<>\n\t\t\t\t<span className=\"sr-only\">{label}</span>\n\t\t\t\t<Icon svg={icon} />\n\t\t\t</>\n\t\t);\n\n\t\tif (asChild) {\n\t\t\tinvariant(\n\t\t\t\tisValidElement(children) && Children.only(children),\n\t\t\t\t\"When using `asChild`, IconButton must be passed a single child as a JSX tag.\",\n\t\t\t);\n\n\t\t\treturn <Slot {...buttonProps}>{cloneElement(children, {}, innerChildren)}</Slot>;\n\t\t}\n\n\t\treturn (\n\t\t\t<button {...buttonProps} type={type}>\n\t\t\t\t{innerChildren}\n\t\t\t</button>\n\t\t);\n\t},\n);\nIconButton.displayName = \"IconButton\";\n\nexport {\n\tbaseIconButtonClasses,\n\t//,\n\tIconButton,\n\ticonButtonVariants,\n};\n\nexport type {\n\t//,\n\tIconButtonProps,\n};\n"],"mappings":"mcAWA,MAAM,EAAwB,EAC7B,cACA,8GACA,4CACA,8CACA,0EACA,CAEK,EAAqB,EAAI,EAAuB,CACrD,SAAU,CAIT,WAAY,CACX,MACC,qIACD,SACC,+SACD,CAMD,UAAW,CACV,MAAO,GACP,KAAM,aACN,CAID,KAAM,CACL,GAAI,SACJ,GAAI,SACJ,GAAI,SACJ,CACD,CACD,gBAAiB,CAChB,WAAY,WACZ,KAAM,KACN,CACD,CAAC,CA2FI,EAAa,GAEjB,CACC,gBAAiB,EACjB,aACA,UAAU,GACV,WACA,YACA,SAAU,EACV,KAAM,EACN,YAAY,GACZ,QACA,OACA,OACA,GAAG,GAEJ,IACI,CACJ,IAAM,EAAW,EAAgB,GAAiB,GAAa,EAAU,CACnE,EAAO,EAAY,EAAC,EAAD,CAAiB,UAAU,eAAiB,CAAA,CAAG,EAElE,EAAc,CACnB,gBAAiB,EACjB,UAAW,EAAG,EAAmB,CAAE,aAAY,YAAW,OAAM,CAAC,CAAE,EAAU,CAC7E,kBAAmB,EACnB,gBAAiB,EACjB,mBAAoB,GACpB,eAAgB,EAChB,YAAa,EACb,WACA,MACA,GAAG,EACH,CAEK,EACL,EAAA,EAAA,CAAA,SAAA,CACC,EAAC,OAAD,CAAM,UAAU,mBAAW,EAAa,CAAA,CACxC,EAAC,EAAD,CAAM,IAAK,EAAQ,CAAA,CACjB,CAAA,CAAA,CAYJ,OATI,GACH,EACC,EAAe,EAAS,EAAI,EAAS,KAAK,EAAS,CACnD,+EACA,CAEM,EAAC,EAAD,CAAM,GAAI,WAAc,EAAa,EAAU,EAAE,CAAE,EAAc,CAAQ,CAAA,EAIhF,EAAC,SAAD,CAAQ,GAAI,EAAmB,gBAC7B,EACO,CAAA,EAGX,CACD,EAAW,YAAc"}
1
+ {"version":3,"file":"icon-button-ZKN0sRIJ.js","names":[],"sources":["../src/components/button/icon-button.tsx"],"sourcesContent":["import { CircleNotchIcon } from \"@phosphor-icons/react/CircleNotch\";\nimport { cva } from \"class-variance-authority\";\nimport type { ButtonHTMLAttributes, ReactNode } from \"react\";\nimport { Children, cloneElement, forwardRef, isValidElement } from \"react\";\nimport invariant from \"tiny-invariant\";\nimport type { VariantProps, WithAsChild } from \"../../types/index.js\";\nimport { parseBooleanish } from \"../../types/index.js\";\nimport { cx } from \"../../utils/cx/cx.js\";\nimport { Icon } from \"../icon/index.js\";\nimport { Slot } from \"../slot/index.js\";\n\nconst baseIconButtonClasses = cx(\n\t\"icon-button\",\n\t\"inline-flex shrink-0 items-center justify-center rounded-[var(--icon-button-border-radius,0.375rem)] border\",\n\t\"focus:outline-hidden focus-visible:ring-4\",\n\t\"disabled:cursor-default disabled:opacity-50\",\n\t\"not-disabled:active:scale-97 ease-out transition-transform duration-150\",\n);\n\nconst iconButtonVariants = cva(baseIconButtonClasses, {\n\tvariants: {\n\t\t/**\n\t\t * Defines the visual style of the Button.\n\t\t */\n\t\tappearance: {\n\t\t\tghost:\n\t\t\t\t\"text-strong focus-visible:ring-focus-accent not-disabled:hover:bg-neutral-500/10 not-disabled:hover:text-strong border-transparent\",\n\t\t\toutlined:\n\t\t\t\t\"border-form bg-form text-strong focus-visible:border-accent-600 focus-visible:ring-focus-accent not-disabled:hover:border-neutral-400 not-disabled:hover:bg-form-hover not-disabled:hover:text-strong focus-visible:not-disabled:hover:border-accent-600 focus-visible:not-disabled:active:border-accent-600\",\n\t\t},\n\t\t/**\n\t\t * Whether or not the button is in a loading state, default `false`. Setting `isLoading` will\n\t\t * replace the `icon` with a spinner.\n\t\t * It will also disable user interaction with the button and set `aria-disabled`.\n\t\t */\n\t\tisLoading: {\n\t\t\tfalse: \"\",\n\t\t\ttrue: \"opacity-50\",\n\t\t},\n\t\t/**\n\t\t * The size of the IconButton.\n\t\t */\n\t\tsize: {\n\t\t\txs: \"size-6\",\n\t\t\tsm: \"size-7\",\n\t\t\tmd: \"size-9\",\n\t\t},\n\t},\n\tdefaultVariants: {\n\t\tappearance: \"outlined\",\n\t\tsize: \"md\",\n\t},\n});\n\ntype IconButtonVariants = VariantProps<typeof iconButtonVariants>;\n\n/**\n * The props for the `Button` component.\n */\ntype IconButtonProps = ButtonHTMLAttributes<HTMLButtonElement> &\n\tWithAsChild &\n\tIconButtonVariants & {\n\t\t/**\n\t\t * The accessible label for the icon. This label will be visually hidden but announced to screen reader users, similar to alt text for img tags.\n\t\t */\n\t\tlabel: string;\n\t\t/**\n\t\t * An icon to render inside the button. If the `state` is `\"pending\"`, then\n\t\t * the icon will automatically be replaced with a spinner.\n\t\t */\n\t\ticon: ReactNode;\n\t} & (\n\t\t| {\n\t\t\t\t/**\n\t\t\t\t * Use the `asChild` prop to compose Radix's functionality onto alternative\n\t\t\t\t * element types or your own React components.\n\t\t\t\t *\n\t\t\t\t * When `asChild` is set to `true`, mantle will not render a default DOM\n\t\t\t\t * element, instead cloning the component's child and passing it the props and\n\t\t\t\t * behavior required to make it functional.\n\t\t\t\t *\n\t\t\t\t * asChild can be used as deeply as you need to. This means it is a great way\n\t\t\t\t * to compose multiple primitive's behavior together.\n\t\t\t\t *\n\t\t\t\t * @see https://www.radix-ui.com/docs/primitives/guides/composition#composition\n\t\t\t\t */\n\t\t\t\tasChild: true;\n\t\t\t\t/**\n\t\t\t\t * The default behavior of the button. Possible values are: `\"button\"`, `\"submit\"`, and `\"reset\"`.\n\t\t\t\t *\n\t\t\t\t * if `asChild` is NOT used: Unlike the native `<button>` element, this prop is required and has no default value.\n\t\t\t\t *\n\t\t\t\t * If `asChild` IS used: This prop HAS NO EFFECT, is REMOVED, and has no default value. This is because we do not want the `button` `type` to automatically merge with any child anchor `type` attribute because the `anchor` `type` is _strictly different_ than the `button` type, see: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#type\n\t\t\t\t *\n\t\t\t\t * @enum\n\t\t\t\t * - `\"button\"`: The button has no default behavior, and does nothing when pressed by default. It can have client-side scripts listen to the element's events, which are triggered when the events occur.\n\t\t\t\t * - `\"reset\"`: The button resets all the controls to their initial values.\n\t\t\t\t * - `\"submit\"`: The button submits the form data to the server.\n\t\t\t\t *\n\t\t\t\t * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#type\n\t\t\t\t */\n\t\t\t\ttype?: ButtonHTMLAttributes<HTMLButtonElement>[\"type\"];\n\t\t }\n\t\t| {\n\t\t\t\tasChild?: false | undefined;\n\t\t\t\t/**\n\t\t\t\t * The default behavior of the button. Possible values are: `\"button\"`, `\"submit\"`, and `\"reset\"`.\n\t\t\t\t *\n\t\t\t\t * if `asChild` is NOT used: Unlike the native `<button>` element, this prop is required and has no default value.\n\t\t\t\t *\n\t\t\t\t * If `asChild` IS used: This prop HAS NO EFFECT, is REMOVED, and has no default value. This is because we do not want the `button` `type` to automatically merge with any child anchor `type` attribute because the `anchor` `type` is _strictly different_ than the `button` type, see: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#type\n\t\t\t\t *\n\t\t\t\t * @enum\n\t\t\t\t * - `\"button\"`: The button has no default behavior, and does nothing when pressed by default. It can have client-side scripts listen to the element's events, which are triggered when the events occur.\n\t\t\t\t * - `\"reset\"`: The button resets all the controls to their initial values.\n\t\t\t\t * - `\"submit\"`: The button submits the form data to the server.\n\t\t\t\t *\n\t\t\t\t * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#type\n\t\t\t\t */\n\t\t\t\ttype: Exclude<ButtonHTMLAttributes<HTMLButtonElement>[\"type\"], undefined>;\n\t\t }\n\t);\n\n/**\n * Renders a button or a component that looks like a button, an interactive\n * element activated by a user with a mouse, keyboard, finger, voice command, or\n * other assistive technology. Once activated, it then performs an action, such\n * as submitting a form or opening a dialog.\n * Renders only a single icon as children with an accessible, screen-reader-only label.\n *\n * @see https://mantle.ngrok.com/components/button\n *\n * @example\n * ```tsx\n * <IconButton\n * type=\"button\"\n * icon={<TrashIcon />}\n * label=\"Delete item\"\n * appearance=\"ghost\"\n * size=\"sm\"\n * />\n * ```\n */\nconst IconButton = forwardRef<HTMLButtonElement, IconButtonProps>(\n\t(\n\t\t{\n\t\t\t\"aria-disabled\": _ariaDisabled,\n\t\t\tappearance,\n\t\t\tasChild = false,\n\t\t\tchildren,\n\t\t\tclassName,\n\t\t\tdisabled: _disabled,\n\t\t\ticon: propIcon,\n\t\t\tisLoading = false,\n\t\t\tlabel,\n\t\t\tsize,\n\t\t\ttype,\n\t\t\t...props\n\t\t},\n\t\tref,\n\t) => {\n\t\tconst disabled = parseBooleanish(_ariaDisabled ?? _disabled ?? isLoading);\n\t\tconst icon = isLoading ? <CircleNotchIcon className=\"animate-spin\" /> : propIcon;\n\n\t\tconst buttonProps = {\n\t\t\t\"aria-disabled\": disabled,\n\t\t\t\"data-slot\": \"icon-button\",\n\t\t\tclassName: cx(iconButtonVariants({ appearance, isLoading, size }), className),\n\t\t\t\"data-appearance\": appearance,\n\t\t\t\"data-disabled\": disabled,\n\t\t\t\"data-icon-button\": true,\n\t\t\t\"data-loading\": isLoading,\n\t\t\t\"data-size\": size,\n\t\t\tdisabled,\n\t\t\tref,\n\t\t\t...props,\n\t\t};\n\n\t\tconst innerChildren = (\n\t\t\t<>\n\t\t\t\t<span className=\"sr-only\">{label}</span>\n\t\t\t\t<Icon svg={icon} />\n\t\t\t</>\n\t\t);\n\n\t\tif (asChild) {\n\t\t\tinvariant(\n\t\t\t\tisValidElement(children) && Children.only(children),\n\t\t\t\t\"When using `asChild`, IconButton must be passed a single child as a JSX tag.\",\n\t\t\t);\n\n\t\t\treturn <Slot {...buttonProps}>{cloneElement(children, {}, innerChildren)}</Slot>;\n\t\t}\n\n\t\treturn (\n\t\t\t<button {...buttonProps} type={type}>\n\t\t\t\t{innerChildren}\n\t\t\t</button>\n\t\t);\n\t},\n);\nIconButton.displayName = \"IconButton\";\n\nexport {\n\tbaseIconButtonClasses,\n\t//,\n\tIconButton,\n\ticonButtonVariants,\n};\n\nexport type {\n\t//,\n\tIconButtonProps,\n};\n"],"mappings":"mcAWA,MAAM,EAAwB,EAC7B,cACA,8GACA,4CACA,8CACA,0EACA,CAEK,EAAqB,EAAI,EAAuB,CACrD,SAAU,CAIT,WAAY,CACX,MACC,qIACD,SACC,+SACD,CAMD,UAAW,CACV,MAAO,GACP,KAAM,aACN,CAID,KAAM,CACL,GAAI,SACJ,GAAI,SACJ,GAAI,SACJ,CACD,CACD,gBAAiB,CAChB,WAAY,WACZ,KAAM,KACN,CACD,CAAC,CA2FI,EAAa,GAEjB,CACC,gBAAiB,EACjB,aACA,UAAU,GACV,WACA,YACA,SAAU,EACV,KAAM,EACN,YAAY,GACZ,QACA,OACA,OACA,GAAG,GAEJ,IACI,CACJ,IAAM,EAAW,EAAgB,GAAiB,GAAa,EAAU,CACnE,EAAO,EAAY,EAAC,EAAD,CAAiB,UAAU,eAAiB,CAAA,CAAG,EAElE,EAAc,CACnB,gBAAiB,EACjB,YAAa,cACb,UAAW,EAAG,EAAmB,CAAE,aAAY,YAAW,OAAM,CAAC,CAAE,EAAU,CAC7E,kBAAmB,EACnB,gBAAiB,EACjB,mBAAoB,GACpB,eAAgB,EAChB,YAAa,EACb,WACA,MACA,GAAG,EACH,CAEK,EACL,EAAA,EAAA,CAAA,SAAA,CACC,EAAC,OAAD,CAAM,UAAU,mBAAW,EAAa,CAAA,CACxC,EAAC,EAAD,CAAM,IAAK,EAAQ,CAAA,CACjB,CAAA,CAAA,CAYJ,OATI,GACH,EACC,EAAe,EAAS,EAAI,EAAS,KAAK,EAAS,CACnD,+EACA,CAEM,EAAC,EAAD,CAAM,GAAI,WAAc,EAAa,EAAU,EAAE,CAAE,EAAc,CAAQ,CAAA,EAIhF,EAAC,SAAD,CAAQ,GAAI,EAAmB,gBAC7B,EACO,CAAA,EAGX,CACD,EAAW,YAAc"}
package/dist/icon.d.ts CHANGED
@@ -1,4 +1,4 @@
1
- import { t as SvgAttributes } from "./types-zKzi66a6.js";
2
- import { n as IconProps, t as Icon } from "./icon-C7Dje_lR.js";
3
- import { n as SvgOnlyProps, t as SvgOnly } from "./svg-only-B-xzpaiu.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/icon.js CHANGED
@@ -1 +1 @@
1
- import{t as e}from"./svg-only-DnZldAY9.js";import{t}from"./icon-BMH0fD_b.js";export{t as Icon,e as SvgOnly};
1
+ import{t as e}from"./svg-only-7gYlsX8f.js";import{t}from"./icon-bWc5yC3-.js";export{t as Icon,e as SvgOnly};
package/dist/icons.d.ts CHANGED
@@ -1,6 +1,6 @@
1
- import { t as SvgAttributes } from "./types-zKzi66a6.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
 
@@ -23,7 +23,7 @@ type InputProps = Omit<InputHTMLAttributes<HTMLInputElement>, "autoComplete" | "
23
23
  * />
24
24
  * ```
25
25
  */
26
- declare const Input: _$react.ForwardRefExoticComponent<Omit<InputHTMLAttributes<HTMLInputElement>, "type" | "autoComplete"> & WithAutoComplete & WithInputType & WithValidation & {
26
+ declare const Input: _$react.ForwardRefExoticComponent<Omit<InputHTMLAttributes<HTMLInputElement>, "autoComplete" | "type"> & WithAutoComplete & WithInputType & WithValidation & {
27
27
  children?: _$react.ReactNode | undefined;
28
28
  } & _$react.RefAttributes<HTMLInputElement>>;
29
29
  type InputCaptureProps = Omit<InputHTMLAttributes<HTMLInputElement>, "autoComplete" | "type"> & BaseProps;
@@ -41,7 +41,7 @@ type InputCaptureProps = Omit<InputHTMLAttributes<HTMLInputElement>, "autoComple
41
41
  * </Input>
42
42
  * ```
43
43
  */
44
- declare const InputCapture: _$react.ForwardRefExoticComponent<Omit<InputHTMLAttributes<HTMLInputElement>, "type" | "autoComplete"> & WithAutoComplete & WithInputType & WithValidation & _$react.RefAttributes<HTMLInputElement>>;
44
+ declare const InputCapture: _$react.ForwardRefExoticComponent<Omit<InputHTMLAttributes<HTMLInputElement>, "autoComplete" | "type"> & WithAutoComplete & WithInputType & WithValidation & _$react.RefAttributes<HTMLInputElement>>;
45
45
  //#endregion
46
46
  //#region src/components/input/password-input.d.ts
47
47
  type PasswordInputProps = Omit<InputHTMLAttributes<HTMLInputElement>, "autoComplete" | "type"> & WithValidation & WithAutoComplete & {
@@ -70,7 +70,7 @@ type PasswordInputProps = Omit<InputHTMLAttributes<HTMLInputElement>, "autoCompl
70
70
  * />
71
71
  * ```
72
72
  */
73
- declare const PasswordInput: _$react.ForwardRefExoticComponent<Omit<InputHTMLAttributes<HTMLInputElement>, "type" | "autoComplete"> & WithValidation & WithAutoComplete & {
73
+ declare const PasswordInput: _$react.ForwardRefExoticComponent<Omit<InputHTMLAttributes<HTMLInputElement>, "autoComplete" | "type"> & WithValidation & WithAutoComplete & {
74
74
  /**
75
75
  * Callback for when the visibility of the password value changes.
76
76
  */
@@ -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-A354MgUP.d.ts.map
103
+ //# sourceMappingURL=index-DMAkXvFI.d.ts.map