@ngrok/mantle 0.63.2 → 0.64.0

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 (155) hide show
  1. package/dist/accordion.d.ts +1 -1
  2. package/dist/accordion.js +1 -1
  3. package/dist/accordion.js.map +1 -1
  4. package/dist/alert-dialog.d.ts +13 -13
  5. package/dist/alert-dialog.js +1 -1
  6. package/dist/alert-dialog.js.map +1 -1
  7. package/dist/alert.d.ts +7 -7
  8. package/dist/alert.js +1 -1
  9. package/dist/alert.js.map +1 -1
  10. package/dist/anchor.d.ts +1 -1
  11. package/dist/anchor.js +1 -1
  12. package/dist/anchor.js.map +1 -1
  13. package/dist/badge.d.ts +1 -1
  14. package/dist/badge.js +1 -1
  15. package/dist/badge.js.map +1 -1
  16. package/dist/{button-DQcrsUyD.d.ts → button-DLUUf_c-.d.ts} +1 -1
  17. package/dist/button.d.ts +2 -2
  18. package/dist/button.js +1 -1
  19. package/dist/calendar.js +1 -1
  20. package/dist/card.d.ts +5 -5
  21. package/dist/card.js +1 -1
  22. package/dist/card.js.map +1 -1
  23. package/dist/checkbox.d.ts +1 -1
  24. package/dist/checkbox.js.map +1 -1
  25. package/dist/{chunk-TS7XNZ62.js → chunk-5XDZE2OU.js} +2 -2
  26. package/dist/chunk-5XDZE2OU.js.map +1 -0
  27. package/dist/chunk-ADF5DAYG.js +2 -0
  28. package/dist/chunk-ADF5DAYG.js.map +1 -0
  29. package/dist/{chunk-U32WN4A7.js → chunk-CBRSMQ26.js} +2 -2
  30. package/dist/{chunk-U32WN4A7.js.map → chunk-CBRSMQ26.js.map} +1 -1
  31. package/dist/{chunk-NQZYWYVH.js → chunk-ELZLLG6G.js} +2 -2
  32. package/dist/{chunk-73DPYKW5.js → chunk-HLRTYX4G.js} +2 -2
  33. package/dist/chunk-HLRTYX4G.js.map +1 -0
  34. package/dist/{chunk-SBVSECWW.js → chunk-IVQ626TU.js} +2 -2
  35. package/dist/chunk-IVQ626TU.js.map +1 -0
  36. package/dist/chunk-LB366VCO.js +2 -0
  37. package/dist/chunk-LB366VCO.js.map +1 -0
  38. package/dist/{chunk-LURP5WQR.js → chunk-MLXONRJD.js} +2 -2
  39. package/dist/chunk-MLXONRJD.js.map +1 -0
  40. package/dist/{chunk-3ESTDWHQ.js → chunk-QK3NV2Q3.js} +2 -2
  41. package/dist/chunk-QK3NV2Q3.js.map +1 -0
  42. package/dist/{chunk-5M264XXH.js → chunk-RED6SFAV.js} +1 -1
  43. package/dist/chunk-RED6SFAV.js.map +1 -0
  44. package/dist/{chunk-NZ6DRFAL.js → chunk-SBQHQ2SJ.js} +1 -1
  45. package/dist/chunk-SBQHQ2SJ.js.map +1 -0
  46. package/dist/{chunk-QWZXK2IF.js → chunk-W5A5HSFE.js} +2 -2
  47. package/dist/{chunk-QWZXK2IF.js.map → chunk-W5A5HSFE.js.map} +1 -1
  48. package/dist/{chunk-KVXXQCAI.js → chunk-ZS2HEB67.js} +2 -2
  49. package/dist/chunk-ZS2HEB67.js.map +1 -0
  50. package/dist/code-block.d.ts +9 -9
  51. package/dist/code-block.js +2 -2
  52. package/dist/code-block.js.map +1 -1
  53. package/dist/code.d.ts +1 -1
  54. package/dist/code.js.map +1 -1
  55. package/dist/combobox.d.ts +8 -8
  56. package/dist/combobox.js +1 -1
  57. package/dist/combobox.js.map +1 -1
  58. package/dist/command.d.ts +18 -21
  59. package/dist/command.js +1 -1
  60. package/dist/command.js.map +1 -1
  61. package/dist/data-table.d.ts +13 -13
  62. package/dist/data-table.js +1 -1
  63. package/dist/data-table.js.map +1 -1
  64. package/dist/description-list.d.ts +4 -4
  65. package/dist/description-list.js +1 -1
  66. package/dist/description-list.js.map +1 -1
  67. package/dist/dialog.d.ts +13 -13
  68. package/dist/dialog.js +1 -1
  69. package/dist/dropdown-menu.d.ts +14 -14
  70. package/dist/dropdown-menu.js +1 -1
  71. package/dist/flag.d.ts +1 -1
  72. package/dist/flag.js.map +1 -1
  73. package/dist/hooks.d.ts +2 -2
  74. package/dist/hooks.js +1 -1
  75. package/dist/hooks.js.map +1 -1
  76. package/dist/hover-card.d.ts +4 -4
  77. package/dist/hover-card.js.map +1 -1
  78. package/dist/{icon-CkvpQ4BK.d.ts → icon-DXTMiV1L.d.ts} +1 -1
  79. package/dist/{icon-button-D4BTvC7F.d.ts → icon-button-CT71Ti9V.d.ts} +1 -1
  80. package/dist/icon.d.ts +2 -2
  81. package/dist/icon.js +1 -1
  82. package/dist/icons.d.ts +20 -2
  83. package/dist/icons.js +1 -1
  84. package/dist/icons.js.map +1 -1
  85. package/dist/input.d.ts +3 -3
  86. package/dist/input.js +1 -1
  87. package/dist/input.js.map +1 -1
  88. package/dist/label.d.ts +1 -1
  89. package/dist/label.js.map +1 -1
  90. package/dist/media-object.d.ts +3 -3
  91. package/dist/media-object.js +1 -1
  92. package/dist/media-object.js.map +1 -1
  93. package/dist/pagination.d.ts +6 -6
  94. package/dist/pagination.js +1 -1
  95. package/dist/pagination.js.map +1 -1
  96. package/dist/popover.d.ts +5 -5
  97. package/dist/popover.js.map +1 -1
  98. package/dist/radio-group.d.ts +11 -11
  99. package/dist/radio-group.js +1 -1
  100. package/dist/radio-group.js.map +1 -1
  101. package/dist/sandboxed-on-click.d.ts +2 -2
  102. package/dist/sandboxed-on-click.js +1 -1
  103. package/dist/sandboxed-on-click.js.map +1 -1
  104. package/dist/select.d.ts +8 -8
  105. package/dist/select.js +1 -1
  106. package/dist/separator.d.ts +2 -2
  107. package/dist/separator.js +1 -1
  108. package/dist/sheet.d.ts +13 -13
  109. package/dist/sheet.js +1 -1
  110. package/dist/sheet.js.map +1 -1
  111. package/dist/skeleton.d.ts +1 -1
  112. package/dist/skeleton.js +1 -1
  113. package/dist/skeleton.js.map +1 -1
  114. package/dist/slider.d.ts +75 -0
  115. package/dist/slider.js +2 -0
  116. package/dist/slider.js.map +1 -0
  117. package/dist/slot.d.ts +1 -1
  118. package/dist/slot.js +1 -1
  119. package/dist/split-button.d.ts +8 -8
  120. package/dist/split-button.js +1 -1
  121. package/dist/split-button.js.map +1 -1
  122. package/dist/{svg-only-Bj2yffO4.d.ts → svg-only-Cp8Mu_sh.d.ts} +1 -1
  123. package/dist/switch.d.ts +1 -1
  124. package/dist/switch.js.map +1 -1
  125. package/dist/table.d.ts +9 -9
  126. package/dist/table.js +1 -1
  127. package/dist/tabs.d.ts +5 -5
  128. package/dist/tabs.js.map +1 -1
  129. package/dist/text-area.d.ts +1 -1
  130. package/dist/text-area.js.map +1 -1
  131. package/dist/theme.d.ts +28 -2
  132. package/dist/theme.js +1 -1
  133. package/dist/toast.d.ts +7 -7
  134. package/dist/toast.js +1 -1
  135. package/dist/tooltip.d.ts +6 -6
  136. package/dist/tooltip.js.map +1 -1
  137. package/package.json +11 -12
  138. package/dist/auto-scroll-to-hash.d.ts +0 -70
  139. package/dist/auto-scroll-to-hash.js +0 -2
  140. package/dist/auto-scroll-to-hash.js.map +0 -1
  141. package/dist/chunk-3ESTDWHQ.js.map +0 -1
  142. package/dist/chunk-5M264XXH.js.map +0 -1
  143. package/dist/chunk-73DPYKW5.js.map +0 -1
  144. package/dist/chunk-KVXXQCAI.js.map +0 -1
  145. package/dist/chunk-LURP5WQR.js.map +0 -1
  146. package/dist/chunk-NZ6DRFAL.js.map +0 -1
  147. package/dist/chunk-ODDNPNLN.js +0 -2
  148. package/dist/chunk-ODDNPNLN.js.map +0 -1
  149. package/dist/chunk-SBVSECWW.js.map +0 -1
  150. package/dist/chunk-SMYI7SUP.js +0 -2
  151. package/dist/chunk-SMYI7SUP.js.map +0 -1
  152. package/dist/chunk-TS7XNZ62.js.map +0 -1
  153. package/dist/chunk-ZYMZVPDT.js +0 -2
  154. package/dist/chunk-ZYMZVPDT.js.map +0 -1
  155. /package/dist/{chunk-NQZYWYVH.js.map → chunk-ELZLLG6G.js.map} +0 -0
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../src/components/toast/toast.tsx"],"sourcesContent":["\"use client\";\n\nimport { CheckCircleIcon } from \"@phosphor-icons/react/CheckCircle\";\nimport { InfoIcon } from \"@phosphor-icons/react/Info\";\nimport { WarningIcon } from \"@phosphor-icons/react/Warning\";\nimport { WarningDiamondIcon } from \"@phosphor-icons/react/WarningDiamond\";\nimport {\n\ttype ComponentProps,\n\ttype ComponentRef,\n\ttype ReactNode,\n\tcreateContext,\n\tforwardRef,\n\tuseContext,\n} from \"react\";\nimport * as ToastPrimitive from \"sonner\";\nimport type { WithAsChild } from \"../../types/as-child.js\";\nimport type { WithStyleProps } from \"../../types/with-style-props.js\";\nimport { cx } from \"../../utils/cx/cx.js\";\nimport { Icon as IconComponent } from \"../icon/icon.js\";\nimport type { SvgOnlyProps } from \"../icon/svg-only.js\";\nimport { Slot } from \"../slot/index.js\";\nimport { useAppliedTheme } from \"../theme/theme-provider.js\";\n\ntype ToasterPrimitiveProps = ComponentProps<typeof ToastPrimitive.Toaster>;\ntype ToasterPrimitiveTheme = ToasterPrimitiveProps[\"theme\"];\n\ntype ToasterProps = WithStyleProps &\n\tPick<ToasterPrimitiveProps, \"containerAriaLabel\" | \"dir\" | \"position\"> & {\n\t\t/**\n\t\t * Time in milliseconds that should elapse before automatically dismissing toasts.\n\t\t * When set here, this will be the default duration for all toasts.\n\t\t * @default 4000\n\t\t */\n\t\tduration_ms?: number;\n\t};\n\n/**\n * A container for displaying all toasts.\n *\n * Only one `<Toaster />` should be rendered in an app a time, preferably at the\n * root level of the app.\n *\n * @see https://mantle.ngrok.com/components/toast#api-toaster\n *\n * @example\n * ```tsx\n * <Toaster\n * position=\"top-right\"\n * duration_ms={5000}\n * />\n * ```\n */\nconst Toaster = ({\n\t//,\n\tclassName,\n\tcontainerAriaLabel,\n\tdir,\n\tduration_ms = 4000,\n\tposition = \"top-center\",\n\tstyle,\n}: ToasterProps) => {\n\tconst theme = useAppliedTheme();\n\n\treturn (\n\t\t<ToastPrimitive.Toaster\n\t\t\tclassName={cx(\"toaster overlay-prompt pointer-events-auto *:duration-200\", className)}\n\t\t\tcontainerAriaLabel={containerAriaLabel}\n\t\t\tdir={dir}\n\t\t\tduration={duration_ms}\n\t\t\tgap={12}\n\t\t\tposition={position ?? \"top-center\"}\n\t\t\tstyle={style}\n\t\t\ttheme={theme as ToasterPrimitiveTheme} // we have additional themes that are not in the sonner types, so we need to cast for now\n\t\t\ttoastOptions={{\n\t\t\t\tunstyled: true,\n\t\t\t}}\n\t\t/>\n\t);\n};\nToaster.displayName = \"Toaster\";\n\nconst ToastIdContext = createContext<string | number>(\"\");\n\ntype MakeToastOptions = {\n\t/**\n\t * Time in milliseconds that should elapse before automatically closing the toast.\n\t * Will default to the `<Toaster />`'s `duration_ms` if not provided.\n\t *\n\t * You can keep the toast open until manually dismissed by passing a value <= 0 or Number.POSITIVE_INFINITY\n\t */\n\tduration_ms?: number;\n\t/**\n\t * An optional custom ID for this toast. If not given, a unique ID is provided for you.\n\t */\n\tid?: string;\n};\n\n/**\n * Create a toast. Provide a `<Toast.Root>` component as the `children` to be rendered\n * inside the `<Toaster />` section.\n *\n * @see https://mantle.ngrok.com/components/toast#api-make-toast\n *\n * @example\n * ```tsx\n * // Basic toast with auto-dismiss (default 4000ms, inherits from `<Toaster>`)\n * makeToast(\n * <Toast.Root priority=\"success\">\n * <Toast.Icon />\n * <Toast.Message>Operation completed successfully!</Toast.Message>\n * <Toast.Action>Dismiss</Toast.Action>\n * </Toast.Root>\n * );\n *\n * // Toast that stays open until manually dismissed\n * makeToast(\n * <Toast.Root priority=\"warning\">\n * <Toast.Icon />\n * <Toast.Message>Action required</Toast.Message>\n * <Toast.Action>Dismiss</Toast.Action>\n * </Toast.Root>,\n * { duration_ms: Number.POSITIVE_INFINITY }\n * );\n * ```\n */\nfunction makeToast(children: ReactNode, options?: MakeToastOptions) {\n\tlet duration = options?.duration_ms;\n\tif (typeof duration === \"number\" && duration <= 0) {\n\t\tduration = Number.POSITIVE_INFINITY;\n\t}\n\n\treturn ToastPrimitive.toast.custom(\n\t\t(toastId) => <ToastIdContext.Provider value={toastId}>{children}</ToastIdContext.Provider>,\n\t\t{\n\t\t\t//\n\t\t\tduration,\n\t\t\t// If a custom ID is provided, use it, else use the toastId provided by the sonner library\n\t\t\t// don't set an ID to `undefined` as it breaks the sonner library\n\t\t\t...(options?.id ? { id: options.id } : {}),\n\t\t\tunstyled: true,\n\t\t},\n\t);\n}\n\nconst priorities = [\n\t//,\n\t\"danger\",\n\t\"info\",\n\t\"success\",\n\t\"warning\",\n] as const;\ntype Priority = (typeof priorities)[number];\n\ntype ToastState = {\n\tpriority: Priority;\n};\n\nconst ToastStateContext = createContext<ToastState>({\n\tpriority: \"info\",\n});\n\ntype ToastProps = ComponentProps<\"div\"> &\n\tWithAsChild & {\n\t\tpriority: Priority;\n\t};\n\n/**\n * A succinct message with a priority that is displayed temporarily.\n * Toasts are used to provide feedback to the user without interrupting their workflow.\n *\n * @see https://mantle.ngrok.com/components/toast#api-toast\n *\n * @example\n * ```tsx\n * <Toast.Root priority=\"success\">\n * <Toast.Icon />\n * <Toast.Message>Changes saved successfully!</Toast.Message>\n * <Toast.Action>Undo</Toast.Action>\n * </Toast.Root>\n * ```\n */\nconst Root = forwardRef<ComponentRef<\"div\">, ToastProps>(\n\t({ asChild, children, className, priority, ...props }, ref) => {\n\t\tconst Component = asChild ? Slot : \"div\";\n\n\t\treturn (\n\t\t\t<ToastStateContext.Provider value={{ priority }}>\n\t\t\t\t<Component\n\t\t\t\t\tclassName={cx(\n\t\t\t\t\t\t\"relative flex items-start gap-2 text-sm font-sans\",\n\t\t\t\t\t\t\"p-3 pl-3.75\",\n\t\t\t\t\t\t\"bg-popover high-contrast:border-popover rounded rounded-r-[0.3125rem] border border-gray-500/35 shadow-lg\",\n\t\t\t\t\t\t/**\n\t\t\t\t\t\t * Do not apply overflow-hidden because we want the priority bar accent\n\t\t\t\t\t\t * to overlap the toast border, else the border flows over the\n\t\t\t\t\t\t * priority bar.\n\t\t\t\t\t\t */\n\t\t\t\t\t\tclassName,\n\t\t\t\t\t)}\n\t\t\t\t\tref={ref}\n\t\t\t\t\t{...props}\n\t\t\t\t>\n\t\t\t\t\t<PriorityBarAccent priority={priority} />\n\t\t\t\t\t{children}\n\t\t\t\t</Component>\n\t\t\t</ToastStateContext.Provider>\n\t\t);\n\t},\n);\nRoot.displayName = \"Toast\";\n\ntype ToastIconProps = Partial<SvgOnlyProps>;\n\n/**\n * An icon that visually represents the priority of the toast.\n * If you do not provide an icon, the default icon and color for the priority is used.\n *\n * @see https://mantle.ngrok.com/components/toast#api-toast-icon\n *\n * @example\n * ```tsx\n * <Toast.Root priority=\"warning\">\n * <Toast.Icon />\n * <Toast.Message>Warning message</Toast.Message>\n * </Toast.Root>\n * ```\n */\nconst Icon = forwardRef<ComponentRef<\"svg\">, ToastIconProps>(\n\t({ className, svg, ...props }, ref) => {\n\t\tconst ctx = useContext(ToastStateContext);\n\n\t\tswitch (ctx.priority) {\n\t\t\tcase \"danger\":\n\t\t\t\treturn (\n\t\t\t\t\t<IconComponent\n\t\t\t\t\t\tclassName={cx(\"text-danger-600\", className)}\n\t\t\t\t\t\tref={ref}\n\t\t\t\t\t\tsvg={svg ?? <WarningIcon weight=\"fill\" />}\n\t\t\t\t\t\t{...props}\n\t\t\t\t\t/>\n\t\t\t\t);\n\t\t\tcase \"warning\":\n\t\t\t\treturn (\n\t\t\t\t\t<IconComponent\n\t\t\t\t\t\tclassName={cx(\"text-warning-600\", className)}\n\t\t\t\t\t\tref={ref}\n\t\t\t\t\t\tsvg={svg ?? <WarningDiamondIcon weight=\"fill\" />}\n\t\t\t\t\t\t{...props}\n\t\t\t\t\t/>\n\t\t\t\t);\n\t\t\tcase \"success\":\n\t\t\t\treturn (\n\t\t\t\t\t<IconComponent\n\t\t\t\t\t\tclassName={cx(\"text-success-600\", className)}\n\t\t\t\t\t\tref={ref}\n\t\t\t\t\t\tsvg={svg ?? <CheckCircleIcon weight=\"fill\" />}\n\t\t\t\t\t\t{...props}\n\t\t\t\t\t/>\n\t\t\t\t);\n\t\t\tcase \"info\":\n\t\t\t\treturn (\n\t\t\t\t\t<IconComponent\n\t\t\t\t\t\t//\n\t\t\t\t\t\tclassName={cx(\"text-accent-600\", className)}\n\t\t\t\t\t\tref={ref}\n\t\t\t\t\t\tsvg={<InfoIcon weight=\"fill\" />}\n\t\t\t\t\t\t{...props}\n\t\t\t\t\t/>\n\t\t\t\t);\n\t\t\tdefault:\n\t\t\t\tthrow new Error(`Unreachable Case: ${ctx.priority}`);\n\t\t}\n\t},\n);\nIcon.displayName = \"ToastIcon\";\n\ntype ToastActionProps = ComponentProps<\"button\"> & WithAsChild;\n\n/**\n * A button that dismisses the toast when clicked.\n * You can prevent the toast from being dismissed `onClick` by calling `event.preventDefault()`\n *\n * @see https://mantle.ngrok.com/components/toast#api-toast-action\n *\n * @example\n * ```tsx\n * <Toast.Root priority=\"info\">\n * <Toast.Icon />\n * <Toast.Message>File uploaded successfully</Toast.Message>\n * <Toast.Action>View File</Toast.Action>\n * </Toast.Root>\n * ```\n */\nconst Action = forwardRef<ComponentRef<\"button\">, ToastActionProps>(\n\t({ asChild, className, onClick, ...props }, ref) => {\n\t\tconst ctx = useContext(ToastIdContext);\n\n\t\tconst Component = asChild ? Slot : \"button\";\n\n\t\treturn (\n\t\t\t<Component\n\t\t\t\tclassName={cx(\n\t\t\t\t\t//,\n\t\t\t\t\t\"shrink-0\",\n\t\t\t\t\t// 👇 wiggle the bits so that icon buttons toast actions are aligned with the toast icon\n\t\t\t\t\t\"data-icon-button:-mr-0.5 data-icon-button:-mt-0.5 data-icon-button:rounded-xs\",\n\t\t\t\t\tclassName,\n\t\t\t\t)}\n\t\t\t\tonClick={(event) => {\n\t\t\t\t\tonClick?.(event);\n\t\t\t\t\tif (event.defaultPrevented) {\n\t\t\t\t\t\treturn;\n\t\t\t\t\t}\n\t\t\t\t\tToastPrimitive.toast.dismiss(ctx);\n\t\t\t\t}}\n\t\t\t\tref={ref}\n\t\t\t\t{...props}\n\t\t\t/>\n\t\t);\n\t},\n);\nAction.displayName = \"ToastAction\";\n\ntype ToastMessageProps = ComponentProps<\"p\"> & WithAsChild;\n\n/**\n * The message content of the toast.\n *\n * @see https://mantle.ngrok.com/components/toast#api-toast-message\n *\n * @example\n * ```tsx\n * <Toast.Root priority=\"success\">\n * <Toast.Icon />\n * <Toast.Message>Your changes have been saved</Toast.Message>\n * </Toast.Root>\n * ```\n */\nconst Message = forwardRef<ComponentRef<\"p\">, ToastMessageProps>(\n\t({ asChild, className, ...props }, ref) => {\n\t\tconst Component = asChild ? Slot : \"p\";\n\n\t\treturn (\n\t\t\t<Component\n\t\t\t\t//\n\t\t\t\tclassName={cx(\"text-strong flex-1 text-sm font-body\", className)}\n\t\t\t\tref={ref}\n\t\t\t\t{...props}\n\t\t\t/>\n\t\t);\n\t},\n);\nMessage.displayName = \"ToastMessage\";\n\n/**\n * A succinct message that is displayed temporarily. Toasts are used to provide\n * feedback to the user without interrupting their workflow.\n *\n * @see https://mantle.ngrok.com/components/toast\n *\n * @example\n * ```tsx\n * makeToast(\n * <Toast.Root priority=\"success\">\n * <Toast.Icon />\n * <Toast.Message>Operation completed successfully!</Toast.Message>\n * <Toast.Action>Dismiss</Toast.Action>\n * </Toast.Root>\n * );\n * ```\n */\nconst Toast = {\n\t/**\n\t * A succinct message with a priority that is displayed temporarily.\n\t *\n\t * @see https://mantle.ngrok.com/components/toast#api-toast-root\n\t *\n\t * @example\n\t * ```tsx\n\t * <Toast.Root priority=\"success\">\n\t * <Toast.Icon />\n\t * <Toast.Message>Changes saved successfully!</Toast.Message>\n\t * <Toast.Action>Undo</Toast.Action>\n\t * </Toast.Root>\n\t * ```\n\t */\n\tRoot,\n\t/**\n\t * A button that dismisses the toast when clicked.\n\t *\n\t * @see https://mantle.ngrok.com/components/toast#api-toast-action\n\t *\n\t * @example\n\t * ```tsx\n\t * <Toast.Root priority=\"info\">\n\t * <Toast.Icon />\n\t * <Toast.Message>File uploaded successfully</Toast.Message>\n\t * <Toast.Action>View File</Toast.Action>\n\t * </Toast.Root>\n\t * ```\n\t */\n\tAction,\n\t/**\n\t * An icon that visually represents the priority of the toast.\n\t *\n\t * @see https://mantle.ngrok.com/components/toast#api-toast-icon\n\t *\n\t * @example\n\t * ```tsx\n\t * <Toast.Root priority=\"warning\">\n\t * <Toast.Icon />\n\t * <Toast.Message>Warning message</Toast.Message>\n\t * </Toast.Root>\n\t * ```\n\t */\n\tIcon,\n\t/**\n\t * The message content of the toast.\n\t *\n\t * @see https://mantle.ngrok.com/components/toast#api-toast-message\n\t *\n\t * @example\n\t * ```tsx\n\t * <Toast.Root priority=\"success\">\n\t * <Toast.Icon />\n\t * <Toast.Message>Your changes have been saved</Toast.Message>\n\t * </Toast.Root>\n\t * ```\n\t */\n\tMessage,\n} as const;\n\nexport {\n\t//,\n\tmakeToast,\n\tToast,\n\tToaster,\n};\n\nexport type {\n\t//,\n\tPriority,\n};\n\n/**\n * @private\n *\n * Allows any mantle floating prompt (e.g. toasts and notifications) to be interacted with\n * even when a modaled view (e.g. dialog, sheet, etc) is open and a focus trap is active.\n *\n * Without this, interacting with the prompt would close the modaled view.\n *\n * @example\n * ```tsx\n * <Dialog.Root onInteractOutside={preventCloseOnPromptInteraction}>\n * <Dialog.Content>\n * <p>Dialog content</p>\n * </Dialog.Content>\n * </Dialog.Root>\n * ```\n */\nexport function preventCloseOnPromptInteraction(\n\tevent: CustomEvent | PointerEvent | MouseEvent | TouchEvent | FocusEvent,\n) {\n\tif (!(event.target instanceof Element)) {\n\t\treturn;\n\t}\n\n\tif (event.target.closest(\".overlay-prompt\")) {\n\t\tevent.preventDefault();\n\t}\n}\n\nconst priorityBackgroundColor = {\n\tinfo: \"bg-accent-600\",\n\twarning: \"bg-warning-600\",\n\tsuccess: \"bg-success-600\",\n\tdanger: \"bg-danger-600\",\n} as const satisfies Record<Priority, string>;\n\ntype PriorityBarAccentProps = Omit<ComponentProps<\"div\">, \"children\"> & {\n\tpriority: Priority;\n};\n\n/**\n * @private\n *\n * A colored bar that visually represents the priority of the toast.\n */\nfunction PriorityBarAccent({ className, priority, ...props }: PriorityBarAccentProps) {\n\treturn (\n\t\t<div\n\t\t\taria-hidden\n\t\t\tclassName={cx(\n\t\t\t\t//\n\t\t\t\t\"z-1 absolute -inset-px right-auto w-1.5 rounded-l\",\n\t\t\t\tpriorityBackgroundColor[priority],\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n"],"mappings":"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","names":["CheckCircleIcon","InfoIcon","WarningIcon","WarningDiamondIcon","createContext","forwardRef","useContext","ToastPrimitive","jsx","jsxs","Toaster","className","containerAriaLabel","dir","duration_ms","position","style","theme","useAppliedTheme","cx","ToastIdContext","createContext","makeToast","children","options","duration","toastId","ToastStateContext","createContext","Root","forwardRef","asChild","children","className","priority","props","ref","Component","Slot","jsx","jsxs","cx","PriorityBarAccent","Icon","svg","ctx","useContext","WarningIcon","WarningDiamondIcon","CheckCircleIcon","InfoIcon","Action","onClick","ToastIdContext","event","Message","Toast","preventCloseOnPromptInteraction","event","priorityBackgroundColor","PriorityBarAccent","className","priority","props","jsx","cx"]}
@@ -1,2 +0,0 @@
1
- import{a as R}from"./chunk-6J7D73WA.js";import{b as f}from"./chunk-NJNFZ2EG.js";import{a as Q}from"./chunk-PFXFESEN.js";import{Fragment as Z,jsx as K}from"react/jsx-runtime";var q="https://assets.ngrok.com",J=`${q}/fonts`,z=["/roobert/roobert-proportional-vf.woff2","/jetbrains/jetbrainsmono-wght.woff2","/jetbrains/jetbrainsmono-italic-wght.woff2","/family/family-regular.woff2","/family/family-italic.woff2"];function X(e){let t=e.startsWith("/")?e:`/${e}`;return`${J}${t}`}var L=()=>K(Z,{children:z.map(e=>K("link",{rel:"preload",href:X(e),as:"font",type:"font/woff2",crossOrigin:"anonymous"},e))});L.displayName="PreloadCoreFonts";var w=["light","dark","light-high-contrast","dark-high-contrast"],x=["system",...w],ye=e=>e;function k(e){return typeof e!="string"?!1:x.includes(e)}var ve=e=>e;function D(e){return typeof e!="string"?!1:w.includes(e)}import{createContext as ee,useContext as B,useEffect as te,useMemo as V,useRef as ne,useState as oe}from"react";import re from"tiny-invariant";import{Fragment as pe,jsx as E,jsxs as Te}from"react/jsx-runtime";var P="(prefers-color-scheme: dark)",M="(prefers-contrast: more)",g="mantle-ui-theme",C="system",se=["system",()=>null],O=ee(se);function ie({children:e}){let[t,o]=oe(()=>{let n=W({cookie:f()?document.cookie:null});return I(n),n}),r=ne(null);te(()=>{function n(c){let m=c??W({cookie:document.cookie});o(m),I(m)}n();try{"BroadcastChannel"in window&&(r.current=new BroadcastChannel(g),r.current.onmessage=c=>{let m=c?.data?.theme;k(m)&&n(m)})}catch{}function u(c){c.key===`${g}__ping`&&n()}window.addEventListener("storage",u);let a=window.matchMedia(P),p=window.matchMedia(M);function l(){n()}function y(){document.visibilityState==="visible"&&n()}return a.addEventListener("change",l),p.addEventListener("change",l),window.addEventListener("pageshow",l),document.addEventListener("visibilitychange",y),()=>{window.removeEventListener("storage",u),a.removeEventListener("change",l),p.removeEventListener("change",l),window.removeEventListener("pageshow",l),document.removeEventListener("visibilitychange",y);try{r.current?.close()}catch{}r.current=null}},[]);let i=V(()=>[t,n=>{ue(n),o(n),I(n),le(n,{broadcastChannel:r.current,pingKey:`${g}__ping`})}],[t]);return E(O.Provider,{value:i,children:e})}ie.displayName="ThemeProvider";function Ee(){let e=B(O);return re(e,"useTheme must be used within a ThemeProvider"),e}function I(e){if(!f())return;let t=window.document.documentElement,o=window.matchMedia(P).matches,r=window.matchMedia(M).matches,i=N(e,{prefersDarkMode:o,prefersHighContrast:r}),n=t.dataset.theme,u=t.dataset.appliedTheme,a=k(n)?n:void 0,p=D(u)?u:void 0;a===e&&p===i||(t.classList.remove(...w),t.classList.add(i),t.dataset.theme=e,t.dataset.appliedTheme=i)}function $e(){if(!f())return{appliedTheme:void 0,theme:void 0};let e=window.document.documentElement,t=k(e.dataset.theme)?e.dataset.theme:void 0;return{appliedTheme:D(e.dataset.appliedTheme)?e.dataset.appliedTheme:void 0,theme:t}}function N(e,{prefersDarkMode:t,prefersHighContrast:o}){return e==="system"?ae({prefersDarkMode:t,prefersHighContrast:o}):e}function Fe(){let e=B(O),t=e!=null?e[0]:"system",o=R(P),r=R(M);return N(t,{prefersDarkMode:o,prefersHighContrast:r})}function ae({prefersDarkMode:e,prefersHighContrast:t}){return t?e?"dark-high-contrast":"light-high-contrast":e?"dark":"light"}function me(e){let{storageKey:t,defaultTheme:o,themes:r,resolvedThemes:i,prefersDarkModeMediaQuery:n,prefersHighContrastMediaQuery:u}=e;function a(s){return typeof s=="string"&&r.includes(s)}function p(s){let h=document.cookie;if(!h)return null;try{let H=h.split(";").find(_=>_.trim().startsWith(`${s}=`))?.split("=")[1];return H?decodeURIComponent(H):null}catch{return null}}function l(s,h){let d=new Date;d.setFullYear(d.getFullYear()+1);let F=window.location.hostname,H=window.location.protocol,A=F==="ngrok.com"||F.endsWith(".ngrok.com")?"; domain=.ngrok.com":"",_=H==="https:"?"; Secure":"";return`${s}=${encodeURIComponent(h)}; expires=${d.toUTCString()}; path=/${A}; SameSite=Lax${_}`}function y(s,h){try{document.cookie=l(s,h)}catch{}}function c(s,h,d){return s==="system"?d?h?"dark-high-contrast":"light-high-contrast":h?"dark":"light":s}let m=null,v=null,S=null;try{m=p(t)}catch{}if(a(m))S=m;else{try{v=window.localStorage?.getItem(t)??null}catch{}a(v)&&(S=v)}let b=a(S)?S:o,G=matchMedia(n).matches,j=matchMedia(u).matches,$=c(b,G,j),T=document.documentElement;if(T.dataset.appliedTheme!==$||T.dataset.theme!==b){for(let s of i)T.classList.remove(s);T.classList.add($),T.dataset.theme=b,T.dataset.appliedTheme=$}let U=a(m);try{if(a(v)&&!U){y(t,v);try{window.localStorage.removeItem(t)}catch{}}else U||y(t,b)}catch{}}function ce(){let e={storageKey:g,defaultTheme:C,themes:x,resolvedThemes:w,prefersDarkModeMediaQuery:P,prefersHighContrastMediaQuery:M};return`(${me.toString()})(${JSON.stringify(e)})`}var Y=({nonce:e})=>E("script",{dangerouslySetInnerHTML:{__html:ce()},nonce:e,suppressHydrationWarning:!0});Y.displayName="PreventWrongThemeFlashScript";var he=({nonce:e})=>Te(pe,{children:[E(Y,{nonce:e}),E(L,{})]});he.displayName="MantleThemeHeadContent";function _e(e={}){let{className:t=""}=e??{};return V(()=>{let o,r;if(!f())o=C,r="light";else{let i=window.matchMedia(P).matches,n=window.matchMedia(M).matches;o=W({cookie:document.cookie}),r=N(o,{prefersDarkMode:i,prefersHighContrast:n})}return{className:Q(t,r),"data-applied-theme":r,"data-theme":o}},[t])}function W({cookie:e}){if(!e)return C;try{let r=e.split(";").find(n=>n.trim().startsWith(`${g}=`))?.split("=")[1],i=r?globalThis.decodeURIComponent(r):null;return k(i)?i:C}catch{return C}}function le(e,t){let{broadcastChannel:o,pingKey:r}=t;try{if(o){o.postMessage({theme:e,timestamp:Date.now()});return}}catch{}try{localStorage.setItem(r,JSON.stringify({theme:e,timestamp:Date.now()}))}catch{}}function de(e){let t=new Date;t.setFullYear(t.getFullYear()+1);let{hostname:o,protocol:r}=window.location,i=o==="ngrok.com"||o.endsWith(".ngrok.com")?"; domain=.ngrok.com":"",n=r==="https:"?"; Secure":"";return`${g}=${encodeURIComponent(e)}; expires=${t.toUTCString()}; path=/${i}; SameSite=Lax${n}`}function ue(e){if(f())try{document.cookie=de(e)}catch{}}export{q as a,X as b,L as c,w as d,x as e,ye as f,k as g,ve as h,D as i,ie as j,Ee as k,$e as l,Fe as m,ce as n,he as o,_e as p,W as q};
2
- //# sourceMappingURL=chunk-ZYMZVPDT.js.map
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../src/components/theme/fonts.tsx","../src/components/theme/themes.ts","../src/components/theme/theme-provider.tsx"],"sourcesContent":["/**\n * @fileoverview Helpers for preloading ngrok brand fonts from the CDN.\n * All font URLs resolve to `${assetsCdnOrigin}/fonts`.\n */\n\n/**\n * The origin for the assets CDN where custom ngrok fonts and assets are hosted.\n *\n * Keep this stable across the app so we can preconnect/DNS-prefetch consistently.\n * @public\n */\nconst assetsCdnOrigin = \"https://assets.ngrok.com\";\n\n/**\n * Base path for font assets on the CDN.\n * @internal\n */\nconst cdnBase = `${assetsCdnOrigin}/fonts`;\n\n/**\n * Canonical list of core font paths (relative to the CDN fonts base).\n */\nconst coreFonts = [\n\t\"/roobert/roobert-proportional-vf.woff2\",\n\t\"/jetbrains/jetbrainsmono-wght.woff2\",\n\t\"/jetbrains/jetbrainsmono-italic-wght.woff2\",\n\t\"/family/family-regular.woff2\",\n\t\"/family/family-italic.woff2\",\n] as const;\n\ntype FontPath = `/${string}` | (string & {});\n\n/**\n * Builds an absolute CDN URL for a given font.\n *\n * @returns {`https://assets.ngrok.com/fonts${T}`} An absolute, literal-typed CDN URL.\n *\n * @example\n * const href = fontHref(\"/roobert/roobert-proportional-vf.woff2\");\n * // -> \"https://assets.ngrok.com/fonts/roobert/roobert-proportional-vf.woff2\"\n */\nfunction fontHref<T extends FontPath = FontPath>(font: T) {\n\tconst path = font.startsWith(\"/\") ? font : `/${font}`;\n\treturn `${cdnBase}${path}` as const;\n}\n\n/**\n * Preload core fonts used in the mantle theme.\n *\n * Include this as early as possible in the document `<head>` so text renders\n * with the intended face without layout shifts. Uses `crossOrigin=\"anonymous\"`\n * so the browser can cache and reuse the font across origins.\n *\n * @remarks\n * For best performance, pair this with preconnect/dns-prefetch hints to the CDN.\n *\n * This is automatically included in `<MantleThemeHeadContent />`.\n *\n * @example\n * ```tsx\n * <head>\n * <meta charSet=\"utf-8\" />\n * <meta name=\"viewport\" content=\"width=device-width, initial-scale=1\" />\n *\n * // Preconnect and DNS-prefetch to the assets CDN\n * // either here or in app root headers\n * <link rel=\"preconnect\" href={assetsCdnOrigin} crossOrigin=\"anonymous\" />\n * <link rel=\"dns-prefetch\" href={assetsCdnOrigin} />\n *\n * <PreventWrongThemeFlashScript />\n * <PreloadCoreFonts />\n * // ... other head elements ...\n * </head>\n * ```\n */\nconst PreloadCoreFonts = () => (\n\t<>\n\t\t{coreFonts.map((font) => (\n\t\t\t<link\n\t\t\t\tkey={font}\n\t\t\t\trel=\"preload\"\n\t\t\t\thref={fontHref(font)}\n\t\t\t\tas=\"font\"\n\t\t\t\ttype=\"font/woff2\"\n\t\t\t\tcrossOrigin=\"anonymous\"\n\t\t\t/>\n\t\t))}\n\t</>\n);\nPreloadCoreFonts.displayName = \"PreloadCoreFonts\";\n\nexport {\n\t//,\n\tassetsCdnOrigin,\n\tfontHref,\n\tPreloadCoreFonts,\n};\n","/**\n * resolvedThemes is a tuple of valid themes that have been resolved from \"system\" to a specific theme.\n */\nconst resolvedThemes = [\"light\", \"dark\", \"light-high-contrast\", \"dark-high-contrast\"] as const;\n\n/**\n * ResolvedTheme is a type that represents a theme that has been resolved from \"system\" to a specific theme.\n */\ntype ResolvedTheme = (typeof resolvedThemes)[number];\n\n/**\n * themes is a tuple of valid themes.\n */\nconst themes = [\"system\", ...resolvedThemes] as const;\n\n/**\n * Theme is a string literal type that represents a valid theme.\n */\ntype Theme = (typeof themes)[number];\n\n/**\n * $theme is a helper which translates the Theme type into a string literal type.\n */\nconst $theme = <T extends Theme = Theme>(value: T) => value;\n\n/**\n * Type predicate that checks if a value is a valid theme.\n */\nfunction isTheme(value: unknown): value is Theme {\n\tif (typeof value !== \"string\") {\n\t\treturn false;\n\t}\n\n\treturn themes.includes(value as Theme);\n}\n\n/**\n * $resolvedTheme is a helper which translates the ResolvedTheme type into a string literal type.\n */\nconst $resolvedTheme = <T extends ResolvedTheme = ResolvedTheme>(value: T) => value;\n\n/**\n * Type predicate that checks if a value is a valid resolved theme.\n */\nfunction isResolvedTheme(value: unknown): value is ResolvedTheme {\n\tif (typeof value !== \"string\") {\n\t\treturn false;\n\t}\n\n\treturn resolvedThemes.includes(value as ResolvedTheme);\n}\n\nexport {\n\t//,\n\tthemes,\n\tresolvedThemes,\n\t$resolvedTheme,\n\t$theme,\n\tisResolvedTheme,\n\tisTheme,\n};\n\nexport type {\n\t//,\n\tTheme,\n\tResolvedTheme,\n};\n","\"use client\";\n\nimport type { PropsWithChildren } from \"react\";\nimport { createContext, useContext, useEffect, useMemo, useRef, useState } from \"react\";\nimport invariant from \"tiny-invariant\";\nimport { useMatchesMediaQuery } from \"../../hooks/use-matches-media-query.js\";\nimport { cx } from \"../../utils/cx/cx.js\";\nimport { canUseDOM } from \"../browser-only/browser-only.js\";\nimport { PreloadCoreFonts } from \"./fonts.js\";\nimport {\n\ttype ResolvedTheme,\n\ttype Theme,\n\tisResolvedTheme,\n\tisTheme,\n\tresolvedThemes,\n\tthemes,\n} from \"./themes.js\";\n\n/**\n * prefersDarkModeMediaQuery is the media query used to detect if the user prefers dark mode.\n */\nconst prefersDarkModeMediaQuery = \"(prefers-color-scheme: dark)\";\n\n/**\n * prefersHighContrastMediaQuery is the media query used to detect if the user prefers high contrast mode.\n */\nconst prefersHighContrastMediaQuery = \"(prefers-contrast: more)\";\n\n/**\n * THEME_STORAGE_KEY is the key used to store the theme in cookies.\n */\nconst THEME_STORAGE_KEY = \"mantle-ui-theme\";\n\n/**\n * DEFAULT_THEME is the initial theme to apply if no value is found in storage.\n * {@link themes}\n */\nconst DEFAULT_THEME = \"system\" satisfies Theme;\n\n/**\n * ThemeProviderState is the shape of the state returned by the ThemeProviderContext.\n */\ntype ThemeProviderState = [theme: Theme, setTheme: (theme: Theme) => void];\n\n/**\n * Initial state for the ThemeProviderContext.\n */\nconst initialState: ThemeProviderState = [\"system\", () => null];\n\n/**\n * ThemeProviderContext is a React Context that provides the current theme and a function to set the theme.\n */\nconst ThemeProviderContext = createContext<ThemeProviderState | null>(initialState);\n\ntype ThemeProviderProps = PropsWithChildren;\n\n/**\n * ThemeProvider is a React Context Provider that provides the current theme and a function to set the theme.\n *\n * @see https://mantle.ngrok.com/components/theme-provider#api-theme-provider\n *\n * @example\n * ```tsx\n * <ThemeProvider defaultTheme=\"system\" storageKey=\"app-theme\">\n * <App />\n * </ThemeProvider>\n * ```\n */\nfunction ThemeProvider({ children }: ThemeProviderProps) {\n\t// Init once from cookie and apply immediately to avoid flashes\n\tconst [theme, setTheme] = useState<Theme>(() => {\n\t\tconst storedTheme = getStoredTheme({\n\t\t\tcookie: canUseDOM() ? document.cookie : null,\n\t\t});\n\t\tapplyThemeToHtml(storedTheme);\n\t\treturn storedTheme;\n\t});\n\n\tconst broadcastChannelRef = useRef<BroadcastChannel | null>(null);\n\n\tuseEffect(() => {\n\t\tfunction syncThemeFromCookie(next?: Theme) {\n\t\t\tconst newTheme = next ?? getStoredTheme({ cookie: document.cookie });\n\t\t\tsetTheme(newTheme);\n\t\t\tapplyThemeToHtml(newTheme);\n\t\t}\n\n\t\t// initial sync in case defaultTheme or storageKey changed\n\t\tsyncThemeFromCookie();\n\n\t\t// add cross-tab listeners (prefer broadcast channel, use localStorage as fallback)\n\t\ttry {\n\t\t\tif (\"BroadcastChannel\" in window) {\n\t\t\t\tbroadcastChannelRef.current = new BroadcastChannel(THEME_STORAGE_KEY);\n\t\t\t\tbroadcastChannelRef.current.onmessage = (event) => {\n\t\t\t\t\tconst value: unknown = event?.data?.theme;\n\t\t\t\t\tif (isTheme(value)) {\n\t\t\t\t\t\tsyncThemeFromCookie(value);\n\t\t\t\t\t}\n\t\t\t\t};\n\t\t\t}\n\t\t\t// oxlint-disable-next-line no-unused-vars\n\t\t} catch (_) {\n\t\t\t// silently swallow errors\n\t\t}\n\n\t\tfunction onStorage(event: StorageEvent) {\n\t\t\tif (event.key === `${THEME_STORAGE_KEY}__ping`) {\n\t\t\t\tsyncThemeFromCookie();\n\t\t\t}\n\t\t}\n\t\twindow.addEventListener(\"storage\", onStorage);\n\n\t\t// add media query listeners for system theme changes\n\t\tconst prefersDarkMql = window.matchMedia(prefersDarkModeMediaQuery);\n\t\tconst prefersHighContrastMql = window.matchMedia(prefersHighContrastMediaQuery);\n\n\t\tfunction onChange() {\n\t\t\tsyncThemeFromCookie();\n\t\t}\n\n\t\tfunction onVisibilityChange() {\n\t\t\tif (document.visibilityState === \"visible\") {\n\t\t\t\tsyncThemeFromCookie();\n\t\t\t}\n\t\t}\n\n\t\tprefersDarkMql.addEventListener(\"change\", onChange);\n\t\tprefersHighContrastMql.addEventListener(\"change\", onChange);\n\n\t\t// pageshow fires on bfcache restore (event.persisted === true) and some restore-from-freeze cases.\n\t\twindow.addEventListener(\"pageshow\", onChange);\n\n\t\t// visibilitychange to handle coming back to a tab\n\t\tdocument.addEventListener(\"visibilitychange\", onVisibilityChange);\n\n\t\t// don't forget to clean up your slop!\n\t\treturn () => {\n\t\t\twindow.removeEventListener(\"storage\", onStorage);\n\t\t\tprefersDarkMql.removeEventListener(\"change\", onChange);\n\t\t\tprefersHighContrastMql.removeEventListener(\"change\", onChange);\n\t\t\twindow.removeEventListener(\"pageshow\", onChange);\n\t\t\tdocument.removeEventListener(\"visibilitychange\", onVisibilityChange);\n\n\t\t\ttry {\n\t\t\t\tbroadcastChannelRef.current?.close();\n\t\t\t\t// oxlint-disable-next-line no-unused-vars\n\t\t\t} catch (_) {\n\t\t\t\t// silently swallow errors\n\t\t\t}\n\t\t\tbroadcastChannelRef.current = null;\n\t\t};\n\t}, []);\n\n\tconst value: ThemeProviderState = useMemo(\n\t\t() => [\n\t\t\ttheme,\n\t\t\t(next: Theme) => {\n\t\t\t\tsetCookie(next);\n\t\t\t\tsetTheme(next);\n\t\t\t\tapplyThemeToHtml(next);\n\t\t\t\tnotifyOtherTabs(next, {\n\t\t\t\t\tbroadcastChannel: broadcastChannelRef.current,\n\t\t\t\t\tpingKey: `${THEME_STORAGE_KEY}__ping`,\n\t\t\t\t});\n\t\t\t},\n\t\t],\n\t\t[theme],\n\t);\n\n\treturn <ThemeProviderContext.Provider value={value}>{children}</ThemeProviderContext.Provider>;\n}\nThemeProvider.displayName = \"ThemeProvider\";\n\n/**\n * useTheme returns the current theme and a function to set the theme.\n *\n * @note This function will throw an error if used outside of a ThemeProvider context tree.\n */\nfunction useTheme() {\n\tconst context = useContext(ThemeProviderContext);\n\n\tinvariant(context, \"useTheme must be used within a ThemeProvider\");\n\n\treturn context;\n}\n\n/**\n * Applies the given theme to the `<html>` element.\n */\nfunction applyThemeToHtml(theme: Theme) {\n\tif (!canUseDOM()) {\n\t\treturn;\n\t}\n\n\tconst html = window.document.documentElement;\n\n\tconst prefersDarkMode = window.matchMedia(prefersDarkModeMediaQuery).matches;\n\tconst prefersHighContrast = window.matchMedia(prefersHighContrastMediaQuery).matches;\n\n\tconst resolvedTheme = resolveTheme(theme, {\n\t\tprefersDarkMode,\n\t\tprefersHighContrast,\n\t});\n\n\tconst htmlTheme = html.dataset.theme;\n\tconst htmlAppliedTheme = html.dataset.appliedTheme;\n\n\tconst currentTheme = isTheme(htmlTheme) ? htmlTheme : undefined;\n\tconst currentResolvedTheme = isResolvedTheme(htmlAppliedTheme) ? htmlAppliedTheme : undefined;\n\n\tif (currentTheme === theme && currentResolvedTheme === resolvedTheme) {\n\t\t// nothing to do: input theme and resolved class already match\n\t\treturn;\n\t}\n\n\t// Clear any stale theme class, then apply the new one\n\thtml.classList.remove(...resolvedThemes); // ✅ remove all potential theme classes\n\thtml.classList.add(resolvedTheme);\n\thtml.dataset.theme = theme;\n\thtml.dataset.appliedTheme = resolvedTheme;\n}\n\n/**\n * Read the theme and applied theme from the `<html>` element.\n */\nfunction readThemeFromHtmlElement() {\n\tif (!canUseDOM()) {\n\t\treturn {\n\t\t\tappliedTheme: undefined,\n\t\t\ttheme: undefined,\n\t\t};\n\t}\n\n\tconst htmlElement = window.document.documentElement;\n\tconst theme = isTheme(htmlElement.dataset.theme) ? htmlElement.dataset.theme : undefined;\n\tconst appliedTheme = isResolvedTheme(htmlElement.dataset.appliedTheme)\n\t\t? htmlElement.dataset.appliedTheme\n\t\t: undefined;\n\n\treturn {\n\t\tappliedTheme,\n\t\ttheme,\n\t};\n}\n\n/**\n * If the theme is \"system\", it will resolve the theme based on the user's media query preferences, otherwise it will return the theme as is.\n * This will mirror the result that gets applied to the <html> element.\n */\nfunction resolveTheme(\n\ttheme: Theme,\n\t{\n\t\tprefersDarkMode,\n\t\tprefersHighContrast,\n\t}: { prefersDarkMode: boolean; prefersHighContrast: boolean },\n) {\n\tif (theme === \"system\") {\n\t\treturn determineThemeFromMediaQuery({\n\t\t\tprefersDarkMode,\n\t\t\tprefersHighContrast,\n\t\t});\n\t}\n\n\treturn theme;\n}\n\n/**\n * If the theme is \"system\", it will resolve the theme based on the user's media query preferences, otherwise it will return the theme as is.\n * This will mirror the result that gets applied to the <html> element.\n */\nfunction useAppliedTheme() {\n\tconst themeContext = useContext(ThemeProviderContext);\n\tconst theme = themeContext != null ? themeContext[0] : \"system\";\n\n\tconst prefersDarkMode = useMatchesMediaQuery(prefersDarkModeMediaQuery);\n\tconst prefersHighContrast = useMatchesMediaQuery(prefersHighContrastMediaQuery);\n\n\treturn resolveTheme(theme, { prefersDarkMode, prefersHighContrast });\n}\n\n/**\n * determineThemeFromMediaQuery returns the theme that should be used based on the user's media query preferences.\n * @private\n *\n * @example\n * ```tsx\n * const theme = determineThemeFromMediaQuery({\n * prefersDarkMode: true,\n * prefersHighContrast: false\n * });\n * // Returns: \"dark\"\n *\n * const themeWithContrast = determineThemeFromMediaQuery({\n * prefersDarkMode: false,\n * prefersHighContrast: true\n * });\n * // Returns: \"light-high-contrast\"\n * ```\n */\nexport function determineThemeFromMediaQuery({\n\tprefersDarkMode,\n\tprefersHighContrast,\n}: {\n\tprefersDarkMode: boolean;\n\tprefersHighContrast: boolean;\n}): ResolvedTheme {\n\tif (prefersHighContrast) {\n\t\treturn prefersDarkMode ? \"dark-high-contrast\" : \"light-high-contrast\";\n\t}\n\n\treturn prefersDarkMode ? \"dark\" : \"light\";\n}\n\n/**\n * Script that runs synchronously to prevent FOUC by applying the correct theme\n * before the page renders. This is the actual function that gets stringified and inlined.\n */\nfunction preventThemeFlash(args: {\n\tstorageKey: string;\n\tdefaultTheme: Theme;\n\tthemes: readonly Theme[];\n\tresolvedThemes: readonly ResolvedTheme[];\n\tprefersDarkModeMediaQuery: string;\n\tprefersHighContrastMediaQuery: string;\n}) {\n\tconst {\n\t\tstorageKey,\n\t\tdefaultTheme,\n\t\tthemes,\n\t\tresolvedThemes,\n\t\tprefersDarkModeMediaQuery,\n\t\tprefersHighContrastMediaQuery,\n\t} = args;\n\n\tfunction isTheme(value: unknown): value is Theme {\n\t\treturn typeof value === \"string\" && themes.includes(value as Theme);\n\t}\n\n\tfunction getThemeFromCookie(name: string): string | null {\n\t\tconst cookie = document.cookie;\n\t\tif (!cookie) {\n\t\t\treturn null;\n\t\t}\n\n\t\ttry {\n\t\t\tconst cookies = cookie.split(\";\");\n\t\t\tconst themeCookie = cookies.find((c) => c.trim().startsWith(`${name}=`));\n\t\t\tconst cookieValue = themeCookie?.split(\"=\")[1];\n\t\t\tconst storedTheme = cookieValue ? decodeURIComponent(cookieValue) : null;\n\t\t\treturn storedTheme;\n\t\t\t// oxlint-disable-next-line no-unused-vars\n\t\t} catch (_) {\n\t\t\treturn null;\n\t\t}\n\t}\n\n\tfunction buildCookie(name: string, val: string): string {\n\t\tconst expires = new Date();\n\t\texpires.setFullYear(expires.getFullYear() + 1);\n\t\tconst hostname = window.location.hostname;\n\t\tconst protocol = window.location.protocol;\n\t\tconst domainAttribute =\n\t\t\thostname === \"ngrok.com\" || hostname.endsWith(\".ngrok.com\") ? \"; domain=.ngrok.com\" : \"\";\n\t\tconst secureAttribute = protocol === \"https:\" ? \"; Secure\" : \"\";\n\t\treturn `${name}=${encodeURIComponent(val)}; expires=${expires.toUTCString()}; path=/${domainAttribute}; SameSite=Lax${secureAttribute}`;\n\t}\n\n\tfunction writeCookie(name: string, val: string): void {\n\t\ttry {\n\t\t\tdocument.cookie = buildCookie(name, val);\n\t\t\t// oxlint-disable-next-line no-unused-vars\n\t\t} catch (_) {\n\t\t\t// silently swallow errors\n\t\t}\n\t}\n\n\tfunction resolveThemeValue(\n\t\ttheme: Theme,\n\t\tisDark: boolean,\n\t\tisHighContrast: boolean,\n\t): ResolvedTheme {\n\t\tif (theme === \"system\") {\n\t\t\tif (isHighContrast) {\n\t\t\t\treturn isDark ? \"dark-high-contrast\" : \"light-high-contrast\";\n\t\t\t}\n\t\t\treturn isDark ? \"dark\" : \"light\";\n\t\t}\n\t\treturn theme;\n\t}\n\n\t// 1) Read preference: cookie first, fallback to localStorage (migration support)\n\tlet cookieTheme: string | null = null;\n\tlet lsTheme: string | null = null;\n\tlet storedTheme: Theme | null = null;\n\n\ttry {\n\t\tcookieTheme = getThemeFromCookie(storageKey);\n\t\t// oxlint-disable-next-line no-unused-vars\n\t} catch (_) {\n\t\t// silently swallow errors\n\t}\n\n\tif (isTheme(cookieTheme)) {\n\t\tstoredTheme = cookieTheme;\n\t} else {\n\t\ttry {\n\t\t\tlsTheme = window.localStorage?.getItem(storageKey) ?? null;\n\t\t\t// oxlint-disable-next-line no-unused-vars\n\t\t} catch (_) {\n\t\t\t// silently swallow errors\n\t\t}\n\t\tif (isTheme(lsTheme)) {\n\t\t\tstoredTheme = lsTheme;\n\t\t}\n\t}\n\n\tconst preference = isTheme(storedTheme) ? storedTheme : defaultTheme;\n\n\t// 2) Resolve theme based on media queries\n\tconst isDark = matchMedia(prefersDarkModeMediaQuery).matches;\n\tconst isHighContrast = matchMedia(prefersHighContrastMediaQuery).matches;\n\tconst resolvedTheme = resolveThemeValue(preference, isDark, isHighContrast);\n\n\tconst html = document.documentElement;\n\t// 3) Apply theme to DOM (same order as applyThemeToHtml)\n\tif (html.dataset.appliedTheme !== resolvedTheme || html.dataset.theme !== preference) {\n\t\t// Remove all theme classes\n\t\tfor (const themeClass of resolvedThemes as readonly string[]) {\n\t\t\thtml.classList.remove(themeClass);\n\t\t}\n\t\t// Add resolved theme class\n\t\thtml.classList.add(resolvedTheme);\n\t\t// Set data attributes\n\t\thtml.dataset.theme = preference;\n\t\thtml.dataset.appliedTheme = resolvedTheme;\n\t}\n\n\t// 4) Handle persistence/migration synchronously to prevent FOUC\n\tconst hadValidCookie = isTheme(cookieTheme);\n\ttry {\n\t\tif (isTheme(lsTheme) && !hadValidCookie) {\n\t\t\t// Migrate from localStorage to cookie\n\t\t\twriteCookie(storageKey, lsTheme);\n\t\t\ttry {\n\t\t\t\twindow.localStorage.removeItem(storageKey);\n\t\t\t\t// oxlint-disable-next-line no-unused-vars\n\t\t\t} catch (_) {\n\t\t\t\t// silently swallow errors\n\t\t\t}\n\t\t} else if (!hadValidCookie) {\n\t\t\t// Set default cookie if none existed\n\t\t\twriteCookie(storageKey, preference);\n\t\t}\n\t\t// oxlint-disable-next-line no-unused-vars\n\t} catch (_) {\n\t\t// silently swallow errors\n\t}\n}\n\n/**\n * preventWrongThemeFlashScriptContent generates a script that prevents the wrong theme from flashing on initial page load.\n * It checks cookies for a stored theme, and if none is found, it sets the default theme.\n * It also applies the correct theme to the `<html>` element based on the user's media query preferences.\n */\nfunction preventWrongThemeFlashScriptContent() {\n\tconst args = {\n\t\tstorageKey: THEME_STORAGE_KEY,\n\t\tdefaultTheme: DEFAULT_THEME,\n\t\tthemes,\n\t\tresolvedThemes,\n\t\tprefersDarkModeMediaQuery,\n\t\tprefersHighContrastMediaQuery,\n\t} as const satisfies Parameters<typeof preventThemeFlash>[0];\n\n\treturn `(${preventThemeFlash.toString()})(${JSON.stringify(args)})`;\n}\n\ntype MantleThemeHeadContentProps = {\n\t/**\n\t * An optional CSP nonce to allowlist this inline script. Using this can help\n\t * you to avoid using the CSP `unsafe-inline` directive, which disables\n\t * XSS protection and would allowlist all inline scripts or styles.\n\t *\n\t * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Global_attributes/nonce\n\t */\n\tnonce?: string;\n};\n\nexport type PreventWrongThemeFlashScriptProps = MantleThemeHeadContentProps;\n\n/**\n * Renders an inline script that prevents Flash of Unstyled Content (FOUC) or the\n * wrong theme flashing on first paint.\n *\n * Use this when you want full control of the `<head>` contents. For a packaged,\n * one-stop solution that also handles font preloads, use {@link MantleThemeHeadContent}.\n * To add font preloads alongside this script, pair it with {@link PreloadCoreFonts}.\n *\n * Place this as early as possible in the `<head>`.\n *\n * @example\n * ```tsx\n * <head>\n * <PreventWrongThemeFlashScript nonce={nonce} />\n * <PreloadCoreFonts />\n * </head>\n * ```\n *\n * @param nonce - Optional CSP nonce to allowlist the inline script under a strict CSP.\n * @returns {JSX.Element} A script tag injected before first paint.\n * @see PreloadCoreFonts\n * @see MantleThemeHeadContent\n * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/nonce\n */\nconst PreventWrongThemeFlashScript = ({ nonce }: PreventWrongThemeFlashScriptProps) => (\n\t<script\n\t\tdangerouslySetInnerHTML={{\n\t\t\t__html: preventWrongThemeFlashScriptContent(),\n\t\t}}\n\t\tnonce={nonce}\n\t\tsuppressHydrationWarning\n\t/>\n);\nPreventWrongThemeFlashScript.displayName = \"PreventWrongThemeFlashScript\";\n\n/**\n * Renders the Mantle theme `<head>` content:\n * - an inline script to prevent FOUC / wrong-theme flash, and\n * - preload links for the core fonts.\n *\n * Use this when you want the one-liner that “just works.”\n * If you prefer fine-grained control, use {@link PreventWrongThemeFlashScript}\n * and {@link PreloadCoreFonts} directly.\n *\n * Place this as early as possible in the `<head>` so it runs before first paint\n * and fonts start fetching ASAP.\n *\n * @example\n * ```tsx\n * <head>\n * // Performance hints for the CDN (recommended)\n * <link rel=\"preconnect\" href={assetsCdnOrigin} crossOrigin=\"anonymous\" />\n * <link rel=\"dns-prefetch\" href={assetsCdnOrigin} />\n *\n * <MantleThemeHeadContent nonce={nonce} />\n * </head>\n * ```\n *\n * @param nonce - Optional CSP nonce to allowlist the inline script under a strict CSP.\n * @returns JSX.Element fragment containing the script and font preloads.\n * @see PreventWrongThemeFlashScript\n * @see PreloadCoreFonts\n * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/nonce\n */\nconst MantleThemeHeadContent = ({ nonce }: MantleThemeHeadContentProps) => (\n\t<>\n\t\t<PreventWrongThemeFlashScript nonce={nonce} />\n\t\t<PreloadCoreFonts />\n\t</>\n);\nMantleThemeHeadContent.displayName = \"MantleThemeHeadContent\";\n\ntype InitialThemeProps = {\n\tclassName: string;\n\t\"data-applied-theme\": ResolvedTheme;\n\t\"data-theme\": Theme;\n};\n\ntype UseInitialHtmlThemePropsOptions = {\n\tclassName?: string;\n};\n\n/**\n * useInitialHtmlThemeProps returns the initial props that should be applied to the <html> element to prevent react hydration errors.\n */\nfunction useInitialHtmlThemeProps(props: UseInitialHtmlThemePropsOptions = {}): InitialThemeProps {\n\tconst { className = \"\" } = props ?? {};\n\n\treturn useMemo(() => {\n\t\tlet initialTheme: Theme;\n\t\tlet resolvedTheme: ResolvedTheme;\n\n\t\tif (!canUseDOM()) {\n\t\t\tinitialTheme = DEFAULT_THEME;\n\t\t\tresolvedTheme = \"light\"; // assume \"light\" for SSR\n\t\t} else {\n\t\t\tconst prefersDarkMode = window.matchMedia(prefersDarkModeMediaQuery).matches;\n\t\t\tconst prefersHighContrast = window.matchMedia(prefersHighContrastMediaQuery).matches;\n\t\t\tinitialTheme = getStoredTheme({ cookie: document.cookie });\n\t\t\tresolvedTheme = resolveTheme(initialTheme, {\n\t\t\t\tprefersDarkMode,\n\t\t\t\tprefersHighContrast,\n\t\t\t});\n\t\t}\n\n\t\treturn {\n\t\t\tclassName: cx(className, resolvedTheme),\n\t\t\t\"data-applied-theme\": resolvedTheme,\n\t\t\t\"data-theme\": initialTheme,\n\t\t};\n\t}, [className]);\n}\n\ntype GetStoredThemeOptions = {\n\t/**\n\t * raw Cookie header (SSR) or document.cookie (client)\n\t */\n\tcookie: string | null | undefined;\n};\n\n/**\n * Returns the persisted UI theme from a Cookie header string.\n *\n * Looks for a cookie named by {@link THEME_STORAGE_KEY} and returns its value **iff**\n * it’s a valid `Theme` per `isTheme`. Otherwise, falls back to\n * {@link DEFAULT_THEME}. This function never throws; malformed encodings or\n * missing cookies quietly return the default.\n *\n * @example\n * getStoredTheme({ cookie: `${THEME_STORAGE_KEY}=dark; session=abc` }) // \"dark\"\n * @example\n * getStoredTheme({ cookie: \"\" }) // DEFAULT_THEME\n */\nfunction getStoredTheme({ cookie }: GetStoredThemeOptions): Theme {\n\tif (!cookie) {\n\t\treturn DEFAULT_THEME;\n\t}\n\n\ttry {\n\t\tconst cookies = cookie.split(\";\");\n\t\tconst themeCookie = cookies.find((cookie) => cookie.trim().startsWith(`${THEME_STORAGE_KEY}=`));\n\t\tconst cookieValue = themeCookie?.split(\"=\")[1];\n\t\tconst storedTheme = cookieValue ? globalThis.decodeURIComponent(cookieValue) : null;\n\n\t\treturn isTheme(storedTheme) ? storedTheme : DEFAULT_THEME;\n\t\t// oxlint-disable-next-line no-unused-vars\n\t} catch (_) {\n\t\treturn DEFAULT_THEME;\n\t}\n}\n\nexport {\n\tMantleThemeHeadContent,\n\tPreventWrongThemeFlashScript,\n\tThemeProvider,\n\t//,\n\tgetStoredTheme,\n\tpreventWrongThemeFlashScriptContent,\n\treadThemeFromHtmlElement,\n\tuseAppliedTheme,\n\tuseInitialHtmlThemeProps,\n\tuseTheme,\n};\n\n/**\n * Notifies other open tabs (same origin) that the theme changed.\n *\n * Prefers a shared {@link BroadcastChannel} for immediate, reliable delivery.\n * Falls back to writing a unique “ping” value to `localStorage`, which triggers\n * the cross-tab `storage` event. Both mechanisms only work across the same origin.\n *\n * Uses a timestamp to ensure the storage value always changes so the event fires.\n *\n * @remarks\n * - Same-origin only: BroadcastChannel and the `storage` event do not cross subdomains\n * or different schemes/ports. For cross-subdomain sync, use a postMessage hub or server push.\n * - This function is fire-and-forget and intentionally swallows errors.\n * - Receivers should re-read the cookie/source of truth and then apply the theme;\n * don’t trust the payload blindly.\n *\n * @example\n * // Sender (inside your setter)\n * notifyOtherTabs(nextTheme, {\n * broadcastChannel: broadcastChannelRef.current,\n * pingKey: `${storageKey}__ping`,\n * });\n *\n * @example\n * // Receiver (setup once per tab)\n * const bc = new BroadcastChannel(storageKey);\n * bc.onmessage = () => syncThemeFromCookie();\n * window.addEventListener('storage', (e) => {\n * if (e.key === `${storageKey}__ping`) syncThemeFromCookie();\n * });\n */\nfunction notifyOtherTabs(\n\ttheme: Theme,\n\toptions: {\n\t\tbroadcastChannel: BroadcastChannel | null;\n\t\tpingKey: `${string}__ping`;\n\t},\n) {\n\tconst { broadcastChannel, pingKey } = options;\n\n\t// first try BroadcastChannel\n\ttry {\n\t\tif (broadcastChannel) {\n\t\t\tbroadcastChannel.postMessage({\n\t\t\t\ttheme,\n\t\t\t\ttimestamp: Date.now(),\n\t\t\t});\n\t\t\treturn;\n\t\t}\n\t\t// oxlint-disable-next-line no-unused-vars\n\t} catch (_) {\n\t\t// silently swallow errors\n\t}\n\n\t// fallback to storage event: write a \"ping\" key (not the real storageKey)\n\ttry {\n\t\tlocalStorage.setItem(pingKey, JSON.stringify({ theme, timestamp: Date.now() }));\n\t\t// oxlint-disable-next-line no-unused-vars\n\t} catch (_) {\n\t\t// silently swallow errors\n\t}\n}\n\nfunction buildThemeCookie(value: string) {\n\tconst expires = new Date();\n\texpires.setFullYear(expires.getFullYear() + 1); // 1 year expiration\n\n\t// Only set .ngrok.com domain for ngrok domains, otherwise let it default to current domain\n\tconst { hostname, protocol } = window.location;\n\tconst domainAttribute =\n\t\thostname === \"ngrok.com\" || hostname.endsWith(\".ngrok.com\") ? \"; domain=.ngrok.com\" : \"\";\n\tconst secureAttribute = protocol === \"https:\" ? \"; Secure\" : \"\";\n\n\treturn `${THEME_STORAGE_KEY}=${encodeURIComponent(value)}; expires=${expires.toUTCString()}; path=/${domainAttribute}; SameSite=Lax${secureAttribute}` as const;\n}\n\n/**\n * Sets a cookie with appropriate domain for the current hostname.\n * Uses .ngrok.com for ngrok domains, otherwise no domain (current domain only).\n */\nfunction setCookie(value: string) {\n\tif (!canUseDOM()) {\n\t\treturn;\n\t}\n\n\ttry {\n\t\tdocument.cookie = buildThemeCookie(value);\n\t\t// oxlint-disable-next-line no-unused-vars\n\t} catch (_) {\n\t\t// silently swallow errors\n\t}\n}\n"],"mappings":"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","names":["Fragment","jsx","assetsCdnOrigin","cdnBase","coreFonts","fontHref","font","path","PreloadCoreFonts","resolvedThemes","themes","$theme","value","isTheme","$resolvedTheme","isResolvedTheme","createContext","useContext","useEffect","useMemo","useRef","useState","invariant","Fragment","jsx","jsxs","prefersDarkModeMediaQuery","prefersHighContrastMediaQuery","THEME_STORAGE_KEY","DEFAULT_THEME","initialState","ThemeProviderContext","createContext","ThemeProvider","children","theme","setTheme","useState","storedTheme","getStoredTheme","canUseDOM","applyThemeToHtml","broadcastChannelRef","useRef","useEffect","syncThemeFromCookie","next","newTheme","event","value","isTheme","onStorage","prefersDarkMql","prefersHighContrastMql","onChange","onVisibilityChange","useMemo","setCookie","notifyOtherTabs","useTheme","context","useContext","invariant","html","prefersDarkMode","prefersHighContrast","resolvedTheme","resolveTheme","htmlTheme","htmlAppliedTheme","currentTheme","currentResolvedTheme","isResolvedTheme","resolvedThemes","readThemeFromHtmlElement","htmlElement","determineThemeFromMediaQuery","useAppliedTheme","themeContext","useMatchesMediaQuery","preventThemeFlash","args","storageKey","defaultTheme","themes","getThemeFromCookie","name","cookie","cookieValue","c","buildCookie","val","expires","hostname","protocol","domainAttribute","secureAttribute","writeCookie","resolveThemeValue","isDark","isHighContrast","cookieTheme","lsTheme","preference","themeClass","hadValidCookie","preventWrongThemeFlashScriptContent","PreventWrongThemeFlashScript","nonce","MantleThemeHeadContent","PreloadCoreFonts","useInitialHtmlThemeProps","props","className","initialTheme","cx","notifyOtherTabs","theme","options","broadcastChannel","pingKey","buildThemeCookie","value","expires","hostname","protocol","domainAttribute","secureAttribute","THEME_STORAGE_KEY","setCookie","canUseDOM"]}