@ngrok/mantle 0.71.1 → 0.72.0

package/dist/mantle.css

@@ -617,6 +617,11 @@ MARK: SHIKI SYNTAX HIGHLIGHT
 	--mantle-code-line-number-color: var(--text-color-muted);
 	--mantle-code-line-number-width: 2rem;
 	--mantle-code-line-number-gap: 1rem;
+	--mantle-code-fold-gutter-width: 1.125rem;
+	--mantle-code-fold-gutter-gap: 0.25rem;
+	--mantle-code-fold-toggle-color: var(--text-color-muted);
+	--mantle-code-fold-toggle-hover-color: var(--text-color-strong);
+	--mantle-code-fold-ellipsis-color: var(--text-color-muted);
 }
 
 .mantle-code-line {
@@ -627,6 +632,10 @@ MARK: SHIKI SYNTAX HIGHLIGHT
 	padding-right: 3.5rem; /* space for the copy button overlay */
 }
 
+.mantle-code-line[data-fold-hidden="true"] {
+	display: none;
+}
+
 .mantle-code-line-highlighted {
 	background-color: var(--mantle-code-line-highlight-bg);
 }
@@ -641,6 +650,70 @@ MARK: SHIKI SYNTAX HIGHLIGHT
 	color: var(--mantle-code-line-number-color);
 }
 
+.mantle-code-fold-toggle {
+	flex-shrink: 0;
+	display: inline-flex;
+	align-items: center;
+	justify-content: center;
+	width: var(--mantle-code-fold-gutter-width);
+	height: 1.5em; /* match line-height so the button is line-aligned */
+	margin-right: var(--mantle-code-fold-gutter-gap);
+	padding: 0;
+	border: 0;
+	background: transparent;
+	color: var(--mantle-code-fold-toggle-color);
+	cursor: pointer;
+	user-select: none;
+	appearance: none;
+	border-radius: 0.125rem;
+}
+
+.mantle-code-fold-toggle:hover {
+	color: var(--mantle-code-fold-toggle-hover-color);
+}
+
+.mantle-code-fold-toggle:focus-visible {
+	outline: 2px solid var(--color-accent-500);
+	outline-offset: 1px;
+}
+
+.mantle-code-fold-caret {
+	width: 0.75rem;
+	height: 0.75rem;
+	transition: transform 120ms ease;
+}
+
+.mantle-code-fold-toggle[aria-expanded="false"] .mantle-code-fold-caret {
+	transform: rotate(-90deg);
+}
+
+/*
+ * Reserve the fold-gutter column on every line in a fold-enabled <pre>, so
+ * lines without a toggle button stay aligned with opener lines. Doing this in
+ * CSS instead of emitting a per-line spacer span keeps HTML payload small for
+ * very large JSON blocks (a 1000-line block sheds ~75 kB of repeated markup).
+ */
+pre[data-slot="code-block-code"]:has(.mantle-code-fold-toggle)
+	.mantle-code-line:not(:has(> .mantle-code-fold-toggle))
+	> .mantle-code-line-content {
+	margin-left: calc(var(--mantle-code-fold-gutter-width) + var(--mantle-code-fold-gutter-gap));
+}
+
+.mantle-code-fold-ellipsis {
+	display: none;
+	margin-left: 0.25rem;
+	padding: 0 0.375rem;
+	border-radius: 0.25rem;
+	background-color: --alpha(var(--text-color-muted) / 18%);
+	color: var(--mantle-code-fold-ellipsis-color);
+	user-select: none;
+}
+
+.mantle-code-line:has(> .mantle-code-fold-toggle[aria-expanded="false"])
+	.mantle-code-fold-ellipsis {
+	display: inline;
+}
+
 .mantle-code-line-content {
 	display: block;
 	min-width: 0;

package/dist/otp-input.d.ts

@@ -1,10 +1,11 @@
 import { t as WithAsChild } from "./as-child-DQHfEmYB.js";
+import { o as WithValidation } from "./types-DG0WQLTL.js";
 import * as _$react from "react";
 import { ComponentProps, ReactNode } from "react";
 import { OTPInput, REGEXP_ONLY_CHARS, REGEXP_ONLY_DIGITS, REGEXP_ONLY_DIGITS_AND_CHARS } from "input-otp";
 
 //#region src/components/otp-input/otp-input.d.ts
-type OtpInputRootProps = Omit<ComponentProps<typeof OTPInput>, "render" | "children"> & {
+type OtpInputRootProps = Omit<ComponentProps<typeof OTPInput>, "render" | "children"> & WithValidation & {
   children?: ReactNode;
 };
 type OtpInputGroupProps = ComponentProps<"div"> & WithAsChild;

package/dist/otp-input.js

@@ -1,2 +1,2 @@
-import{t as e}from"./cx-D1HYnpvA.js";import{t}from"./slot-D_ZUrdEW.js";import{forwardRef as n,useContext as r}from"react";import{jsx as i,jsxs as a}from"react/jsx-runtime";import{MinusIcon as o}from"@phosphor-icons/react/Minus";import{OTPInput as s,OTPInputContext as c,REGEXP_ONLY_CHARS as l,REGEXP_ONLY_DIGITS as u,REGEXP_ONLY_DIGITS_AND_CHARS as d}from"input-otp";const f=({totalActive:e,total:t})=>e===0?`idle`:e===1?`caret`:e===t?`all`:`range`,p=({children:e})=>{let t=r(c),n=t.slots.length;return i(`div`,{className:`group/otp contents`,"data-otp-state":f({totalActive:t.slots.reduce((e,t)=>e+ +!!t.isActive,0),total:n}),children:e})},m=n(({children:t,className:n,containerClassName:r,...a},o)=>i(s,{ref:o,"data-slot":`otp-input`,containerClassName:e(`flex items-center gap-2 has-disabled:opacity-50`,r),className:e(`disabled:cursor-not-allowed`,n),...a,children:i(p,{children:t})}));m.displayName=`OtpInput`;const h=n(({asChild:n,children:r,className:a,...o},s)=>i(n?t:`div`,{ref:s,"data-slot":`otp-input-group`,className:e(`relative flex items-center rounded-md`,`has-[[data-active]~[data-active]]:ring-focus-accent has-[[data-active]~[data-active]]:ring-4`,a),...o,children:r}));h.displayName=`OtpInputGroup`;const g=n(({className:t,index:n,...o},s)=>{let l=r(c).slots[n],u=l?.char??null,d=l?.hasFakeCaret??!1;return a(`div`,{ref:s,"data-slot":`otp-input-slot`,"data-active":l?.isActive??!1?``:void 0,className:e(`border-form bg-form text-strong relative flex h-10 w-10 items-center justify-center border-y border-r text-sm shadow-sm outline-hidden transition-all duration-150 ease-out`,`first:rounded-l-md first:border-l last:rounded-r-md`,`[&:has(+[data-active])]:group-data-[otp-state=caret]/otp:border-r-transparent`,`data-active:group-data-[otp-state=caret]/otp:border-accent-600`,`data-active:group-data-[otp-state=caret]/otp:border-l`,`data-active:group-data-[otp-state=caret]/otp:ring-focus-accent`,`data-active:group-data-[otp-state=caret]/otp:z-20`,`data-active:group-data-[otp-state=caret]/otp:ring-4`,`group-data-[otp-state=all]/otp:border-accent-600`,t),...o,children:[u,d&&i(`div`,{className:`pointer-events-none absolute inset-0 flex items-center justify-center`,children:i(`div`,{className:`bg-strong h-4 w-px animate-pulse`})})]})});g.displayName=`OtpInputSlot`;const _=n(({asChild:n,children:r,className:a,semantic:s=!1,...c},l)=>{let u=n?t:`div`,d=s?{role:`separator`}:{"aria-hidden":!0,role:`none`};return i(u,{ref:l,"data-slot":`otp-input-separator`,className:e(`text-muted flex items-center`,a),...d,...c,children:r??i(o,{weight:`bold`})})});_.displayName=`OtpInputSeparator`;const v={Root:m,Group:h,Slot:g,Separator:_};export{v as OtpInput,l as REGEXP_ONLY_CHARS,u as REGEXP_ONLY_DIGITS,d as REGEXP_ONLY_DIGITS_AND_CHARS};
+import{t as e}from"./cx-D1HYnpvA.js";import{t}from"./types-884RJJqm.js";import{t as n}from"./slot-D_ZUrdEW.js";import{forwardRef as r,useContext as i}from"react";import{jsx as a,jsxs as o}from"react/jsx-runtime";import{MinusIcon as s}from"@phosphor-icons/react/Minus";import{OTPInput as c,OTPInputContext as l,REGEXP_ONLY_CHARS as u,REGEXP_ONLY_DIGITS as d,REGEXP_ONLY_DIGITS_AND_CHARS as f}from"input-otp";const p={error:`danger`,success:`success`,warning:`warning`},m=e=>`var(--color-${e}-600)`,h=e=>`var(--ring-color-focus-${e})`,g=({totalActive:e,total:t})=>e===0?`idle`:e===1?`caret`:e===t?`all`:`range`,_=({children:e,validation:n})=>{let r=i(l),o=r.slots.length,s=g({totalActive:r.slots.reduce((e,t)=>e+ +!!t.isActive,0),total:o}),c=n?p[n]:void 0,u=c?t({"--otp-validation-border":m(c),"--otp-validation-ring":h(c)}):void 0;return a(`div`,{className:`group/otp contents`,"data-otp-state":s,"data-validation":n||void 0,style:u,children:e})},v=r(({"aria-invalid":t,children:n,className:r,containerClassName:i,validation:o,...s},l)=>{let u=t!=null&&t!==`false`?`error`:(typeof o==`function`?o():o)||void 0;return a(c,{ref:l,"aria-invalid":t??(u===`error`||void 0),"data-slot":`otp-input`,containerClassName:e(`flex items-center gap-2 has-disabled:opacity-50`,i),className:e(`disabled:cursor-not-allowed`,r),...s,children:a(_,{validation:u,children:n})})});v.displayName=`OtpInput`;const y=r(({asChild:t,children:r,className:i,...o},s)=>a(t?n:`div`,{ref:s,"data-slot":`otp-input-group`,className:e(`relative flex items-center rounded-md`,`has-[[data-active]~[data-active]]:ring-focus-accent has-[[data-active]~[data-active]]:ring-4`,`group-data-validation/otp:has-[[data-active]~[data-active]]:ring-(--otp-validation-ring)`,i),...o,children:r}));y.displayName=`OtpInputGroup`;const b=r(({className:t,index:n,...r},s)=>{let c=i(l).slots[n],u=c?.char??null,d=c?.hasFakeCaret??!1;return o(`div`,{ref:s,"data-slot":`otp-input-slot`,"data-active":c?.isActive??!1?``:void 0,className:e(`border-form bg-form text-strong relative flex h-10 w-10 items-center justify-center border-y border-r text-sm shadow-sm outline-hidden transition-all duration-150 ease-out`,`first:rounded-l-md first:border-l last:rounded-r-md`,`[&:has(+[data-active])]:group-data-[otp-state=caret]/otp:border-r-transparent`,`data-active:group-data-[otp-state=caret]/otp:border-accent-600`,`data-active:group-data-[otp-state=caret]/otp:border-l`,`data-active:group-data-[otp-state=caret]/otp:ring-focus-accent`,`data-active:group-data-[otp-state=caret]/otp:z-20`,`data-active:group-data-[otp-state=caret]/otp:ring-4`,`group-data-[otp-state=all]/otp:border-accent-600`,`group-data-validation/otp:border-y-(--otp-validation-border)`,`group-data-validation/otp:first:border-l-(--otp-validation-border)`,`group-data-validation/otp:last:border-r-(--otp-validation-border)`,`group-data-validation/otp:data-active:group-data-[otp-state=caret]/otp:border-(--otp-validation-border)`,`group-data-validation/otp:data-active:group-data-[otp-state=caret]/otp:ring-(--otp-validation-ring)`,`group-data-validation/otp:group-data-[otp-state=all]/otp:border-(--otp-validation-border)`,t),...r,children:[u,d&&a(`div`,{className:`pointer-events-none absolute inset-0 flex items-center justify-center`,children:a(`div`,{className:`bg-strong h-4 w-px animate-pulse`})})]})});b.displayName=`OtpInputSlot`;const x=r(({asChild:t,children:r,className:i,semantic:o=!1,...c},l)=>{let u=t?n:`div`,d=o?{role:`separator`}:{"aria-hidden":!0,role:`none`};return a(u,{ref:l,"data-slot":`otp-input-separator`,className:e(`text-muted flex items-center`,i),...d,...c,children:r??a(s,{weight:`bold`})})});x.displayName=`OtpInputSeparator`;const S={Root:v,Group:y,Slot:b,Separator:x};export{S as OtpInput,u as REGEXP_ONLY_CHARS,d as REGEXP_ONLY_DIGITS,f as REGEXP_ONLY_DIGITS_AND_CHARS};
 //# sourceMappingURL=otp-input.js.map

package/dist/otp-input.js.map

@@ -1 +1 @@
-{"version":3,"file":"otp-input.js","names":["AsChildSlot"],"sources":["../src/components/otp-input/otp-input.tsx"],"sourcesContent":["\"use client\";\n\nimport { MinusIcon } from \"@phosphor-icons/react/Minus\";\nimport { OTPInput, OTPInputContext } from \"input-otp\";\nimport type { ComponentProps, ComponentRef, ReactNode } from \"react\";\nimport { forwardRef, useContext } from \"react\";\nimport type { WithAsChild } from \"../../types/as-child.js\";\nimport { cx } from \"../../utils/cx/cx.js\";\nimport { Slot as AsChildSlot } from \"../slot/index.js\";\n\ntype OtpState = \"idle\" | \"caret\" | \"range\" | \"all\";\n\n/**\n * Map the count of active slots to a discrete `data-otp-state` value used by\n * descendant CSS selectors. Split out from the rendering component so the\n * decision tree reads as a flat `if`/`else` chain rather than a nested\n * ternary.\n */\nconst computeOtpState = ({\n\ttotalActive,\n\ttotal,\n}: {\n\ttotalActive: number;\n\ttotal: number;\n}): OtpState => {\n\tif (totalActive === 0) {\n\t\treturn \"idle\";\n\t}\n\tif (totalActive === 1) {\n\t\treturn \"caret\";\n\t}\n\tif (totalActive === total) {\n\t\treturn \"all\";\n\t}\n\treturn \"range\";\n};\n\n/**\n * Bridge component that lives inside `<OTPInput>` (so it can read\n * `OTPInputContext`) and exposes the current selection state as a DOM data\n * attribute. Descendant `OtpInput.Group` / `OtpInput.Slot` parts read this\n * via Tailwind's `group-data-*` selector, so all conditional styling lives\n * in CSS — no React context.\n *\n * `data-otp-state` is one of:\n * - `\"idle\"` — no slot active (input not focused)\n * - `\"caret\"` — exactly one slot active (typing caret)\n * - `\"range\"` — multiple but not all slots active (partial selection)\n * - `\"all\"` — every slot active (cmd+a / select-all)\n */\nconst MantleOtpBridge = ({ children }: { children: ReactNode }) => {\n\tconst inputOtpContext = useContext(OTPInputContext);\n\tconst total = inputOtpContext.slots.length;\n\tconst totalActive = inputOtpContext.slots.reduce(\n\t\t(count, slot) => count + (slot.isActive ? 1 : 0),\n\t\t0,\n\t);\n\tconst otpState = computeOtpState({ totalActive, total });\n\n\t// `display: contents` keeps this element in the DOM tree (so `group/`\n\t// ancestor selectors resolve) without producing a layout box.\n\treturn (\n\t\t<div className=\"group/otp contents\" data-otp-state={otpState}>\n\t\t\t{children}\n\t\t</div>\n\t);\n};\n\n// Drop the `render` / `children?: never` branch of input-otp's discriminated\n// union — `OtpInput.Root` always wraps its children in `MantleOtpBridge`,\n// so consumers compose with `OtpInput.Group` / `OtpInput.Slot` children\n// rather than a render prop.\ntype OtpInputRootProps = Omit<ComponentProps<typeof OTPInput>, \"render\" | \"children\"> & {\n\tchildren?: ReactNode;\n};\n\n/**\n * The root of the OTP input. Renders an accessible single hidden input that\n * captures keystrokes, paste events, and autofill, and exposes per-slot state\n * (active, char, fake caret) to descendant `OtpInput.Slot` parts via context.\n *\n * Wraps the `input-otp` library by Guilherme Rodz.\n *\n * @see https://mantle.ngrok.com/components/otp-input\n *\n * @example\n * ```tsx\n * <OtpInput.Root maxLength={6}>\n *   <OtpInput.Group>\n *     <OtpInput.Slot index={0} />\n *     <OtpInput.Slot index={1} />\n *     <OtpInput.Slot index={2} />\n *   </OtpInput.Group>\n *   <OtpInput.Separator />\n *   <OtpInput.Group>\n *     <OtpInput.Slot index={3} />\n *     <OtpInput.Slot index={4} />\n *     <OtpInput.Slot index={5} />\n *   </OtpInput.Group>\n * </OtpInput.Root>\n * ```\n */\n// `OtpInput.Root` does not support `asChild`: the underlying `OTPInput`\n// owns its hidden `<input>` and its render contract — swapping the element\n// would break input-otp's internal focus and selection management.\nconst Root = forwardRef<ComponentRef<typeof OTPInput>, OtpInputRootProps>(\n\t({ children, className, containerClassName, ...props }, ref) => {\n\t\treturn (\n\t\t\t<OTPInput\n\t\t\t\tref={ref}\n\t\t\t\tdata-slot=\"otp-input\"\n\t\t\t\tcontainerClassName={cx(\n\t\t\t\t\t\"flex items-center gap-2 has-disabled:opacity-50\",\n\t\t\t\t\tcontainerClassName,\n\t\t\t\t)}\n\t\t\t\tclassName={cx(\"disabled:cursor-not-allowed\", className)}\n\t\t\t\t{...props}\n\t\t\t>\n\t\t\t\t<MantleOtpBridge>{children}</MantleOtpBridge>\n\t\t\t</OTPInput>\n\t\t);\n\t},\n);\nRoot.displayName = \"OtpInput\";\n\ntype OtpInputGroupProps = ComponentProps<\"div\"> & WithAsChild;\n\n/**\n * Groups one or more `OtpInput.Slot` parts into a visually-connected segment.\n * Slots inside a group share rounded corners on the outer edges and join with\n * shared borders between adjacent slots.\n *\n * @see https://mantle.ngrok.com/components/otp-input\n *\n * @example\n * ```tsx\n * <OtpInput.Root maxLength={6}>\n *   <OtpInput.Group>\n *     <OtpInput.Slot index={0} />\n *     <OtpInput.Slot index={1} />\n *     <OtpInput.Slot index={2} />\n *   </OtpInput.Group>\n *   <OtpInput.Separator />\n *   <OtpInput.Group>\n *     <OtpInput.Slot index={3} />\n *     <OtpInput.Slot index={4} />\n *     <OtpInput.Slot index={5} />\n *   </OtpInput.Group>\n * </OtpInput.Root>\n * ```\n */\nconst Group = forwardRef<HTMLDivElement, OtpInputGroupProps>(\n\t({ asChild, children, className, ...props }, ref) => {\n\t\tconst Comp = asChild ? AsChildSlot : \"div\";\n\n\t\treturn (\n\t\t\t<Comp\n\t\t\t\tref={ref}\n\t\t\t\tdata-slot=\"otp-input-group\"\n\t\t\t\tclassName={cx(\n\t\t\t\t\t\"relative flex items-center rounded-md\",\n\t\t\t\t\t// A \"range\" selection within this group means two or more\n\t\t\t\t\t// slots are simultaneously active. CSS `:has()` with the\n\t\t\t\t\t// general sibling combinator catches that without us\n\t\t\t\t\t// having to count: if any active slot is preceded by\n\t\t\t\t\t// another active slot at the same nesting level, the\n\t\t\t\t\t// group has at least 2 actives → draw the ring.\n\t\t\t\t\t\"has-[[data-active]~[data-active]]:ring-focus-accent has-[[data-active]~[data-active]]:ring-4\",\n\t\t\t\t\tclassName,\n\t\t\t\t)}\n\t\t\t\t{...props}\n\t\t\t>\n\t\t\t\t{children}\n\t\t\t</Comp>\n\t\t);\n\t},\n);\nGroup.displayName = \"OtpInputGroup\";\n\ntype OtpInputSlotProps = ComponentProps<\"div\"> & {\n\t/**\n\t * The zero-based index of the character slot to render. Must be a valid\n\t * index within the parent `OtpInput.Root`'s `maxLength`.\n\t */\n\tindex: number;\n};\n\n/**\n * Renders a single character slot for the OTP input. Reads its display state\n * (the typed character, active/focused state, and fake caret position) from\n * the nearest `OtpInput.Root` via context — so this part must always be\n * rendered inside an `OtpInput.Root`.\n *\n * @see https://mantle.ngrok.com/components/otp-input\n *\n * @example\n * ```tsx\n * <OtpInput.Root maxLength={6}>\n *   <OtpInput.Group>\n *     <OtpInput.Slot index={0} />\n *     <OtpInput.Slot index={1} />\n *     <OtpInput.Slot index={2} />\n *   </OtpInput.Group>\n *   <OtpInput.Separator />\n *   <OtpInput.Group>\n *     <OtpInput.Slot index={3} />\n *     <OtpInput.Slot index={4} />\n *     <OtpInput.Slot index={5} />\n *   </OtpInput.Group>\n * </OtpInput.Root>\n * ```\n */\n// `OtpInput.Slot` does not support `asChild`: the slot reads context-driven\n// state (char, fake caret, active) from `OTPInputContext` and renders that\n// state into a fixed visual structure. Letting consumers swap the element\n// would lose the caret overlay and the active-ring focus styling.\nconst OtpInputSlotImpl = forwardRef<HTMLDivElement, OtpInputSlotProps>(\n\t({ className, index, ...props }, ref) => {\n\t\tconst context = useContext(OTPInputContext);\n\t\tconst slot = context.slots[index];\n\t\tconst char = slot?.char ?? null;\n\t\tconst hasFakeCaret = slot?.hasFakeCaret ?? false;\n\t\tconst isActive = slot?.isActive ?? false;\n\n\t\treturn (\n\t\t\t<div\n\t\t\t\tref={ref}\n\t\t\t\tdata-slot=\"otp-input-slot\"\n\t\t\t\tdata-active={isActive ? \"\" : undefined}\n\t\t\t\tclassName={cx(\n\t\t\t\t\t\"border-form bg-form text-strong relative flex h-10 w-10 items-center justify-center border-y border-r text-sm shadow-sm outline-hidden transition-all duration-150 ease-out\",\n\t\t\t\t\t\"first:rounded-l-md first:border-l last:rounded-r-md\",\n\t\t\t\t\t// When this slot is immediately followed by the caret\n\t\t\t\t\t// slot, hide our `border-r` so the active slot's\n\t\t\t\t\t// `border-l` is the only line at the boundary — without\n\t\t\t\t\t// this, the two adjacent 1px borders read as a doubled\n\t\t\t\t\t// edge. We use an arbitrary `&:has(+ ...)` variant\n\t\t\t\t\t// because Tailwind's `has-[...]` shorthand doesn't\n\t\t\t\t\t// parse the nested bracketed attribute selector here.\n\t\t\t\t\t\"[&:has(+[data-active])]:group-data-[otp-state=caret]/otp:border-r-transparent\",\n\t\t\t\t\t// Per-slot ring renders only in `caret` state (single\n\t\t\t\t\t// active slot). When more than one slot is active, the\n\t\t\t\t\t// surrounding `OtpInput.Group` draws a single ring\n\t\t\t\t\t// around the whole group — see Group's `:has()` rule.\n\t\t\t\t\t// We also recolor the slot's own borders to accent and\n\t\t\t\t\t// fill in `border-l` (groups normally only render\n\t\t\t\t\t// `border-l` on `:first-child`), so the slot reads as\n\t\t\t\t\t// one cohesive highlighted box rather than a ring with\n\t\t\t\t\t// a gray box inside.\n\t\t\t\t\t\"data-active:group-data-[otp-state=caret]/otp:border-accent-600\",\n\t\t\t\t\t\"data-active:group-data-[otp-state=caret]/otp:border-l\",\n\t\t\t\t\t\"data-active:group-data-[otp-state=caret]/otp:ring-focus-accent\",\n\t\t\t\t\t\"data-active:group-data-[otp-state=caret]/otp:z-20\",\n\t\t\t\t\t\"data-active:group-data-[otp-state=caret]/otp:ring-4\",\n\t\t\t\t\t// Select-all: tint *every* border on the slot accent.\n\t\t\t\t\t// Tinting only the outside edges leaves the internal\n\t\t\t\t\t// vertical divider (gray `border-r`) meeting the\n\t\t\t\t\t// accent top/bottom borders at the corner, producing a\n\t\t\t\t\t// visible 1px miter spike. Coloring all borders the\n\t\t\t\t\t// same accent-600 hue makes the corner blend\n\t\t\t\t\t// seamlessly while still keeping the slot grid\n\t\t\t\t\t// readable at full opacity.\n\t\t\t\t\t\"group-data-[otp-state=all]/otp:border-accent-600\",\n\t\t\t\t\tclassName,\n\t\t\t\t)}\n\t\t\t\t{...props}\n\t\t\t>\n\t\t\t\t{char}\n\t\t\t\t{hasFakeCaret && (\n\t\t\t\t\t<div className=\"pointer-events-none absolute inset-0 flex items-center justify-center\">\n\t\t\t\t\t\t<div className=\"bg-strong h-4 w-px animate-pulse\" />\n\t\t\t\t\t</div>\n\t\t\t\t)}\n\t\t\t</div>\n\t\t);\n\t},\n);\nOtpInputSlotImpl.displayName = \"OtpInputSlot\";\n\ntype OtpInputSeparatorProps = ComponentProps<\"div\"> &\n\tWithAsChild & {\n\t\t/**\n\t\t * If `true`, the separator will be rendered with `role=\"separator\"` so\n\t\t * assistive tech announces it as a divider between OTP groups.\n\t\t * If `false`, the separator is purely decorative and is removed from\n\t\t * the accessibility tree — preferred inside an OTP control where the\n\t\t * minus icon is just visual chrome between slot groups.\n\t\t *\n\t\t * @default false\n\t\t */\n\t\tsemantic?: boolean;\n\t};\n\n/**\n * A visual separator between two `OtpInput.Group` segments. Renders a minus\n * icon by default; pass `children` to override the visual.\n *\n * @see https://mantle.ngrok.com/components/otp-input\n *\n * @example\n * ```tsx\n * <OtpInput.Root maxLength={6}>\n *   <OtpInput.Group>\n *     <OtpInput.Slot index={0} />\n *     <OtpInput.Slot index={1} />\n *     <OtpInput.Slot index={2} />\n *   </OtpInput.Group>\n *   <OtpInput.Separator />\n *   <OtpInput.Group>\n *     <OtpInput.Slot index={3} />\n *     <OtpInput.Slot index={4} />\n *     <OtpInput.Slot index={5} />\n *   </OtpInput.Group>\n * </OtpInput.Root>\n * ```\n */\nconst Separator = forwardRef<HTMLDivElement, OtpInputSeparatorProps>(\n\t({ asChild, children, className, semantic = false, ...props }, ref) => {\n\t\tconst Comp = asChild ? AsChildSlot : \"div\";\n\t\tconst semanticProps = semantic ? { role: \"separator\" } : { \"aria-hidden\": true, role: \"none\" };\n\n\t\treturn (\n\t\t\t<Comp\n\t\t\t\tref={ref}\n\t\t\t\tdata-slot=\"otp-input-separator\"\n\t\t\t\tclassName={cx(\"text-muted flex items-center\", className)}\n\t\t\t\t{...semanticProps}\n\t\t\t\t{...props}\n\t\t\t>\n\t\t\t\t{children ?? <MinusIcon weight=\"bold\" />}\n\t\t\t</Comp>\n\t\t);\n\t},\n);\nSeparator.displayName = \"OtpInputSeparator\";\n\n/**\n * Compound component for capturing one-time passcodes (OTP). Combines a\n * single hidden input (handling paste, autofill, and IME) with a row of\n * styled character slots.\n *\n * @see https://mantle.ngrok.com/components/otp-input\n *\n * @example\n * Composition:\n * ```\n * OtpInput.Root\n * ├── OtpInput.Group\n * │   └── OtpInput.Slot\n * ├── OtpInput.Separator\n * └── OtpInput.Group\n *     └── OtpInput.Slot\n * ```\n *\n * @example\n * ```tsx\n * <OtpInput.Root maxLength={6}>\n *   <OtpInput.Group>\n *     <OtpInput.Slot index={0} />\n *     <OtpInput.Slot index={1} />\n *     <OtpInput.Slot index={2} />\n *   </OtpInput.Group>\n *   <OtpInput.Separator />\n *   <OtpInput.Group>\n *     <OtpInput.Slot index={3} />\n *     <OtpInput.Slot index={4} />\n *     <OtpInput.Slot index={5} />\n *   </OtpInput.Group>\n * </OtpInput.Root>\n * ```\n */\nconst OtpInput = {\n\t/**\n\t * The root of the OTP input. Wraps the hidden input that captures\n\t * keystrokes, paste, and autofill, and provides per-slot state to\n\t * descendant `OtpInput.Slot` parts.\n\t *\n\t * @see https://mantle.ngrok.com/components/otp-input\n\t *\n\t * @example\n\t * ```tsx\n\t * <OtpInput.Root maxLength={6}>\n\t *   <OtpInput.Group>\n\t *     <OtpInput.Slot index={0} />\n\t *     <OtpInput.Slot index={1} />\n\t *     <OtpInput.Slot index={2} />\n\t *   </OtpInput.Group>\n\t *   <OtpInput.Separator />\n\t *   <OtpInput.Group>\n\t *     <OtpInput.Slot index={3} />\n\t *     <OtpInput.Slot index={4} />\n\t *     <OtpInput.Slot index={5} />\n\t *   </OtpInput.Group>\n\t * </OtpInput.Root>\n\t * ```\n\t */\n\tRoot,\n\t/**\n\t * Groups one or more `OtpInput.Slot` parts into a visually-connected\n\t * segment with shared rounded corners and joined borders.\n\t *\n\t * @see https://mantle.ngrok.com/components/otp-input\n\t *\n\t * @example\n\t * ```tsx\n\t * <OtpInput.Root maxLength={6}>\n\t *   <OtpInput.Group>\n\t *     <OtpInput.Slot index={0} />\n\t *     <OtpInput.Slot index={1} />\n\t *     <OtpInput.Slot index={2} />\n\t *   </OtpInput.Group>\n\t *   <OtpInput.Separator />\n\t *   <OtpInput.Group>\n\t *     <OtpInput.Slot index={3} />\n\t *     <OtpInput.Slot index={4} />\n\t *     <OtpInput.Slot index={5} />\n\t *   </OtpInput.Group>\n\t * </OtpInput.Root>\n\t * ```\n\t */\n\tGroup,\n\t/**\n\t * A single character slot. Must be rendered inside an `OtpInput.Root`.\n\t * Reads its character, active state, and fake caret position from the\n\t * root via context.\n\t *\n\t * @see https://mantle.ngrok.com/components/otp-input\n\t *\n\t * @example\n\t * ```tsx\n\t * <OtpInput.Root maxLength={6}>\n\t *   <OtpInput.Group>\n\t *     <OtpInput.Slot index={0} />\n\t *     <OtpInput.Slot index={1} />\n\t *     <OtpInput.Slot index={2} />\n\t *   </OtpInput.Group>\n\t *   <OtpInput.Separator />\n\t *   <OtpInput.Group>\n\t *     <OtpInput.Slot index={3} />\n\t *     <OtpInput.Slot index={4} />\n\t *     <OtpInput.Slot index={5} />\n\t *   </OtpInput.Group>\n\t * </OtpInput.Root>\n\t * ```\n\t */\n\tSlot: OtpInputSlotImpl,\n\t/**\n\t * A visual separator between two `OtpInput.Group` segments. Renders a\n\t * minus icon by default; pass `children` to override.\n\t *\n\t * @see https://mantle.ngrok.com/components/otp-input\n\t *\n\t * @example\n\t * ```tsx\n\t * <OtpInput.Root maxLength={6}>\n\t *   <OtpInput.Group>\n\t *     <OtpInput.Slot index={0} />\n\t *     <OtpInput.Slot index={1} />\n\t *     <OtpInput.Slot index={2} />\n\t *   </OtpInput.Group>\n\t *   <OtpInput.Separator />\n\t *   <OtpInput.Group>\n\t *     <OtpInput.Slot index={3} />\n\t *     <OtpInput.Slot index={4} />\n\t *     <OtpInput.Slot index={5} />\n\t *   </OtpInput.Group>\n\t * </OtpInput.Root>\n\t * ```\n\t */\n\tSeparator,\n} as const;\n\nexport {\n\t//,\n\tOtpInput,\n};\n\nexport {\n\t//,\n\tREGEXP_ONLY_CHARS,\n\tREGEXP_ONLY_DIGITS,\n\tREGEXP_ONLY_DIGITS_AND_CHARS,\n} from \"input-otp\";\n"],"mappings":"+WAkBA,MAAM,GAAmB,CACxB,cACA,WAKI,IAAgB,EACZ,OAEJ,IAAgB,EACZ,QAEJ,IAAgB,EACZ,MAED,QAgBF,GAAmB,CAAE,cAAwC,CAClE,IAAM,EAAkB,EAAW,EAAgB,CAC7C,EAAQ,EAAgB,MAAM,OASpC,OACC,EAAC,MAAD,CAAK,UAAU,qBAAqB,iBALpB,EAAgB,CAAE,YAJf,EAAgB,MAAM,QACxC,EAAO,IAAS,GAAS,KAAK,SAC/B,EAE6C,CAAE,QAAO,CAKM,CAC1D,WACI,CAAA,EAyCF,EAAO,GACX,CAAE,WAAU,YAAW,qBAAoB,GAAG,GAAS,IAEtD,EAAC,EAAD,CACM,MACL,YAAU,YACV,mBAAoB,EACnB,kDACA,EACA,CACD,UAAW,EAAG,8BAA+B,EAAU,CACvD,GAAI,WAEJ,EAAC,EAAD,CAAkB,WAA2B,CAAA,CACnC,CAAA,CAGb,CACD,EAAK,YAAc,WA4BnB,MAAM,EAAQ,GACZ,CAAE,UAAS,WAAU,YAAW,GAAG,GAAS,IAI3C,EAHY,EAAUA,EAAc,MAGpC,CACM,MACL,YAAU,kBACV,UAAW,EACV,wCAOA,+FACA,EACA,CACD,GAAI,EAEH,WACK,CAAA,CAGT,CACD,EAAM,YAAc,gBAuCpB,MAAM,EAAmB,GACvB,CAAE,YAAW,QAAO,GAAG,GAAS,IAAQ,CAExC,IAAM,EADU,EAAW,EACP,CAAC,MAAM,GACrB,EAAO,GAAM,MAAQ,KACrB,EAAe,GAAM,cAAgB,GAG3C,OACC,EAAC,MAAD,CACM,MACL,YAAU,iBACV,cANe,GAAM,UAAY,GAMT,GAAK,IAAA,GAC7B,UAAW,EACV,8KACA,sDAQA,gFAUA,iEACA,wDACA,iEACA,oDACA,sDASA,mDACA,EACA,CACD,GAAI,WAxCL,CA0CE,EACA,GACA,EAAC,MAAD,CAAK,UAAU,iFACd,EAAC,MAAD,CAAK,UAAU,mCAAqC,CAAA,CAC/C,CAAA,CAEF,IAGR,CACD,EAAiB,YAAc,eAuC/B,MAAM,EAAY,GAChB,CAAE,UAAS,WAAU,YAAW,WAAW,GAAO,GAAG,GAAS,IAAQ,CACtE,IAAM,EAAO,EAAUA,EAAc,MAC/B,EAAgB,EAAW,CAAE,KAAM,YAAa,CAAG,CAAE,cAAe,GAAM,KAAM,OAAQ,CAE9F,OACC,EAAC,EAAD,CACM,MACL,YAAU,sBACV,UAAW,EAAG,+BAAgC,EAAU,CACxD,GAAI,EACJ,GAAI,WAEH,GAAY,EAAC,EAAD,CAAW,OAAO,OAAS,CAAA,CAClC,CAAA,EAGT,CACD,EAAU,YAAc,oBAqCxB,MAAM,EAAW,CAyBhB,OAwBA,QAyBA,KAAM,EAwBN,YACA"}
+{"version":3,"file":"otp-input.js","names":["AsChildSlot"],"sources":["../src/components/otp-input/otp-input.tsx"],"sourcesContent":["\"use client\";\n\nimport { MinusIcon } from \"@phosphor-icons/react/Minus\";\nimport { OTPInput, OTPInputContext } from \"input-otp\";\nimport type { ComponentProps, ComponentRef, ReactNode } from \"react\";\nimport { forwardRef, useContext } from \"react\";\nimport type { WithAsChild } from \"../../types/as-child.js\";\nimport { $cssProperties } from \"../../types/index.js\";\nimport { cx } from \"../../utils/cx/cx.js\";\nimport { Slot as AsChildSlot } from \"../slot/index.js\";\nimport type { Validation, WithValidation } from \"../input/types.js\";\n\ntype OtpState = \"idle\" | \"caret\" | \"range\" | \"all\";\n\n/**\n * The color token name (`danger` / `success` / `warning`) that backs each\n * validation value. The `Validation` vocabulary (`\"error\"` / `\"success\"` /\n * `\"warning\"`) doesn't exactly match the color-token vocabulary — the\n * `error` validation maps to the `danger` color hue.\n */\ntype ValidationHue = \"danger\" | \"success\" | \"warning\";\n\nconst validationHues = {\n\terror: \"danger\",\n\tsuccess: \"success\",\n\twarning: \"warning\",\n} as const satisfies Record<Exclude<Validation, false>, ValidationHue>;\n\nconst validationBorderColor = <T extends ValidationHue = ValidationHue>(hue: T) =>\n\t`var(--color-${hue}-600)`;\n\nconst validationRingColor = <T extends ValidationHue = ValidationHue>(hue: T) =>\n\t`var(--ring-color-focus-${hue})`;\n\n/**\n * Map the count of active slots to a discrete `data-otp-state` value used by\n * descendant CSS selectors. Split out from the rendering component so the\n * decision tree reads as a flat `if`/`else` chain rather than a nested\n * ternary.\n */\nconst computeOtpState = ({\n\ttotalActive,\n\ttotal,\n}: {\n\ttotalActive: number;\n\ttotal: number;\n}): OtpState => {\n\tif (totalActive === 0) {\n\t\treturn \"idle\";\n\t}\n\tif (totalActive === 1) {\n\t\treturn \"caret\";\n\t}\n\tif (totalActive === total) {\n\t\treturn \"all\";\n\t}\n\treturn \"range\";\n};\n\n/**\n * Bridge component that lives inside `<OTPInput>` (so it can read\n * `OTPInputContext`) and exposes the current selection state as a DOM data\n * attribute. Descendant `OtpInput.Group` / `OtpInput.Slot` parts read this\n * via Tailwind's `group-data-*` selector, so all conditional styling lives\n * in CSS — no React context.\n *\n * `data-otp-state` is one of:\n * - `\"idle\"` — no slot active (input not focused)\n * - `\"caret\"` — exactly one slot active (typing caret)\n * - `\"range\"` — multiple but not all slots active (partial selection)\n * - `\"all\"` — every slot active (cmd+a / select-all)\n */\nconst MantleOtpBridge = ({\n\tchildren,\n\tvalidation,\n}: {\n\tchildren: ReactNode;\n\tvalidation?: Validation;\n}) => {\n\tconst inputOtpContext = useContext(OTPInputContext);\n\tconst total = inputOtpContext.slots.length;\n\tconst totalActive = inputOtpContext.slots.reduce(\n\t\t(count, slot) => count + (slot.isActive ? 1 : 0),\n\t\t0,\n\t);\n\tconst otpState = computeOtpState({ totalActive, total });\n\n\t// Map the validation hue to two CSS custom properties — descendant\n\t// slot/group classes reference these vars instead of having one\n\t// branch per validation value. When no validation is set, the vars\n\t// are left undefined and the validation utilities (gated on\n\t// `group-data-validation`) don't apply.\n\tconst hue = validation ? validationHues[validation] : undefined;\n\tconst validationStyle = hue\n\t\t? $cssProperties({\n\t\t\t\t\"--otp-validation-border\": validationBorderColor(hue),\n\t\t\t\t\"--otp-validation-ring\": validationRingColor(hue),\n\t\t\t})\n\t\t: undefined;\n\n\t// `display: contents` keeps this element in the DOM tree (so `group/`\n\t// ancestor selectors resolve) without producing a layout box.\n\treturn (\n\t\t<div\n\t\t\tclassName=\"group/otp contents\"\n\t\t\tdata-otp-state={otpState}\n\t\t\tdata-validation={validation || undefined}\n\t\t\tstyle={validationStyle}\n\t\t>\n\t\t\t{children}\n\t\t</div>\n\t);\n};\n\n// Drop the `render` / `children?: never` branch of input-otp's discriminated\n// union — `OtpInput.Root` always wraps its children in `MantleOtpBridge`,\n// so consumers compose with `OtpInput.Group` / `OtpInput.Slot` children\n// rather than a render prop.\ntype OtpInputRootProps = Omit<ComponentProps<typeof OTPInput>, \"render\" | \"children\"> &\n\tWithValidation & {\n\t\tchildren?: ReactNode;\n\t};\n\n/**\n * The root of the OTP input. Renders an accessible single hidden input that\n * captures keystrokes, paste events, and autofill, and exposes per-slot state\n * (active, char, fake caret) to descendant `OtpInput.Slot` parts via context.\n *\n * Wraps the `input-otp` library by Guilherme Rodz.\n *\n * Pass `validation=\"error\"` (or `\"success\"` / `\"warning\"`) to recolor each\n * group's outer borders and the active focus ring with the matching validation hue.\n * `validation=\"error\"` also sets `aria-invalid` on the underlying input so\n * assistive tech announces the failure state.\n *\n * @see https://mantle.ngrok.com/components/otp-input\n *\n * @example\n * ```tsx\n * <OtpInput.Root maxLength={6}>\n *   <OtpInput.Group>\n *     <OtpInput.Slot index={0} />\n *     <OtpInput.Slot index={1} />\n *     <OtpInput.Slot index={2} />\n *   </OtpInput.Group>\n *   <OtpInput.Separator />\n *   <OtpInput.Group>\n *     <OtpInput.Slot index={3} />\n *     <OtpInput.Slot index={4} />\n *     <OtpInput.Slot index={5} />\n *   </OtpInput.Group>\n * </OtpInput.Root>\n * ```\n */\n// `OtpInput.Root` does not support `asChild`: the underlying `OTPInput`\n// owns its hidden `<input>` and its render contract — swapping the element\n// would break input-otp's internal focus and selection management.\nconst Root = forwardRef<ComponentRef<typeof OTPInput>, OtpInputRootProps>(\n\t(\n\t\t{\n\t\t\t\"aria-invalid\": ariaInvalid,\n\t\t\tchildren,\n\t\t\tclassName,\n\t\t\tcontainerClassName,\n\t\t\tvalidation: _validation,\n\t\t\t...props\n\t\t},\n\t\tref,\n\t) => {\n\t\tconst isInvalid = ariaInvalid != null && ariaInvalid !== \"false\";\n\t\tconst validation = isInvalid\n\t\t\t? \"error\"\n\t\t\t: (typeof _validation === \"function\" ? _validation() : _validation) || undefined;\n\t\tconst resolvedAriaInvalid = ariaInvalid ?? (validation === \"error\" || undefined);\n\n\t\treturn (\n\t\t\t<OTPInput\n\t\t\t\tref={ref}\n\t\t\t\taria-invalid={resolvedAriaInvalid}\n\t\t\t\tdata-slot=\"otp-input\"\n\t\t\t\tcontainerClassName={cx(\n\t\t\t\t\t\"flex items-center gap-2 has-disabled:opacity-50\",\n\t\t\t\t\tcontainerClassName,\n\t\t\t\t)}\n\t\t\t\tclassName={cx(\"disabled:cursor-not-allowed\", className)}\n\t\t\t\t{...props}\n\t\t\t>\n\t\t\t\t<MantleOtpBridge validation={validation}>{children}</MantleOtpBridge>\n\t\t\t</OTPInput>\n\t\t);\n\t},\n);\nRoot.displayName = \"OtpInput\";\n\ntype OtpInputGroupProps = ComponentProps<\"div\"> & WithAsChild;\n\n/**\n * Groups one or more `OtpInput.Slot` parts into a visually-connected segment.\n * Slots inside a group share rounded corners on the outer edges and join with\n * shared borders between adjacent slots.\n *\n * @see https://mantle.ngrok.com/components/otp-input\n *\n * @example\n * ```tsx\n * <OtpInput.Root maxLength={6}>\n *   <OtpInput.Group>\n *     <OtpInput.Slot index={0} />\n *     <OtpInput.Slot index={1} />\n *     <OtpInput.Slot index={2} />\n *   </OtpInput.Group>\n *   <OtpInput.Separator />\n *   <OtpInput.Group>\n *     <OtpInput.Slot index={3} />\n *     <OtpInput.Slot index={4} />\n *     <OtpInput.Slot index={5} />\n *   </OtpInput.Group>\n * </OtpInput.Root>\n * ```\n */\nconst Group = forwardRef<HTMLDivElement, OtpInputGroupProps>(\n\t({ asChild, children, className, ...props }, ref) => {\n\t\tconst Comp = asChild ? AsChildSlot : \"div\";\n\n\t\treturn (\n\t\t\t<Comp\n\t\t\t\tref={ref}\n\t\t\t\tdata-slot=\"otp-input-group\"\n\t\t\t\tclassName={cx(\n\t\t\t\t\t\"relative flex items-center rounded-md\",\n\t\t\t\t\t// A \"range\" selection within this group means two or more\n\t\t\t\t\t// slots are simultaneously active. CSS `:has()` with the\n\t\t\t\t\t// general sibling combinator catches that without us\n\t\t\t\t\t// having to count: if any active slot is preceded by\n\t\t\t\t\t// another active slot at the same nesting level, the\n\t\t\t\t\t// group has at least 2 actives → draw the ring.\n\t\t\t\t\t\"has-[[data-active]~[data-active]]:ring-focus-accent has-[[data-active]~[data-active]]:ring-4\",\n\t\t\t\t\t// Validation override for the group-level range/all ring.\n\t\t\t\t\t// `--otp-validation-ring` is set on the bridge based on\n\t\t\t\t\t// the validation value, so a single class covers\n\t\t\t\t\t// error/success/warning instead of one per hue.\n\t\t\t\t\t\"group-data-validation/otp:has-[[data-active]~[data-active]]:ring-(--otp-validation-ring)\",\n\t\t\t\t\tclassName,\n\t\t\t\t)}\n\t\t\t\t{...props}\n\t\t\t>\n\t\t\t\t{children}\n\t\t\t</Comp>\n\t\t);\n\t},\n);\nGroup.displayName = \"OtpInputGroup\";\n\ntype OtpInputSlotProps = ComponentProps<\"div\"> & {\n\t/**\n\t * The zero-based index of the character slot to render. Must be a valid\n\t * index within the parent `OtpInput.Root`'s `maxLength`.\n\t */\n\tindex: number;\n};\n\n/**\n * Renders a single character slot for the OTP input. Reads its display state\n * (the typed character, active/focused state, and fake caret position) from\n * the nearest `OtpInput.Root` via context — so this part must always be\n * rendered inside an `OtpInput.Root`.\n *\n * @see https://mantle.ngrok.com/components/otp-input\n *\n * @example\n * ```tsx\n * <OtpInput.Root maxLength={6}>\n *   <OtpInput.Group>\n *     <OtpInput.Slot index={0} />\n *     <OtpInput.Slot index={1} />\n *     <OtpInput.Slot index={2} />\n *   </OtpInput.Group>\n *   <OtpInput.Separator />\n *   <OtpInput.Group>\n *     <OtpInput.Slot index={3} />\n *     <OtpInput.Slot index={4} />\n *     <OtpInput.Slot index={5} />\n *   </OtpInput.Group>\n * </OtpInput.Root>\n * ```\n */\n// `OtpInput.Slot` does not support `asChild`: the slot reads context-driven\n// state (char, fake caret, active) from `OTPInputContext` and renders that\n// state into a fixed visual structure. Letting consumers swap the element\n// would lose the caret overlay and the active-ring focus styling.\nconst OtpInputSlotImpl = forwardRef<HTMLDivElement, OtpInputSlotProps>(\n\t({ className, index, ...props }, ref) => {\n\t\tconst context = useContext(OTPInputContext);\n\t\tconst slot = context.slots[index];\n\t\tconst char = slot?.char ?? null;\n\t\tconst hasFakeCaret = slot?.hasFakeCaret ?? false;\n\t\tconst isActive = slot?.isActive ?? false;\n\n\t\treturn (\n\t\t\t<div\n\t\t\t\tref={ref}\n\t\t\t\tdata-slot=\"otp-input-slot\"\n\t\t\t\tdata-active={isActive ? \"\" : undefined}\n\t\t\t\tclassName={cx(\n\t\t\t\t\t\"border-form bg-form text-strong relative flex h-10 w-10 items-center justify-center border-y border-r text-sm shadow-sm outline-hidden transition-all duration-150 ease-out\",\n\t\t\t\t\t\"first:rounded-l-md first:border-l last:rounded-r-md\",\n\t\t\t\t\t// When this slot is immediately followed by the caret\n\t\t\t\t\t// slot, hide our `border-r` so the active slot's\n\t\t\t\t\t// `border-l` is the only line at the boundary — without\n\t\t\t\t\t// this, the two adjacent 1px borders read as a doubled\n\t\t\t\t\t// edge. We use an arbitrary `&:has(+ ...)` variant\n\t\t\t\t\t// because Tailwind's `has-[...]` shorthand doesn't\n\t\t\t\t\t// parse the nested bracketed attribute selector here.\n\t\t\t\t\t\"[&:has(+[data-active])]:group-data-[otp-state=caret]/otp:border-r-transparent\",\n\t\t\t\t\t// Per-slot ring renders only in `caret` state (single\n\t\t\t\t\t// active slot). When more than one slot is active, the\n\t\t\t\t\t// surrounding `OtpInput.Group` draws a single ring\n\t\t\t\t\t// around the whole group — see Group's `:has()` rule.\n\t\t\t\t\t// We also recolor the slot's own borders to accent and\n\t\t\t\t\t// fill in `border-l` (groups normally only render\n\t\t\t\t\t// `border-l` on `:first-child`), so the slot reads as\n\t\t\t\t\t// one cohesive highlighted box rather than a ring with\n\t\t\t\t\t// a gray box inside.\n\t\t\t\t\t\"data-active:group-data-[otp-state=caret]/otp:border-accent-600\",\n\t\t\t\t\t\"data-active:group-data-[otp-state=caret]/otp:border-l\",\n\t\t\t\t\t\"data-active:group-data-[otp-state=caret]/otp:ring-focus-accent\",\n\t\t\t\t\t\"data-active:group-data-[otp-state=caret]/otp:z-20\",\n\t\t\t\t\t\"data-active:group-data-[otp-state=caret]/otp:ring-4\",\n\t\t\t\t\t// Select-all: tint *every* border on the slot accent.\n\t\t\t\t\t// Tinting only the outside edges leaves the internal\n\t\t\t\t\t// vertical divider (gray `border-r`) meeting the\n\t\t\t\t\t// accent top/bottom borders at the corner, producing a\n\t\t\t\t\t// visible 1px miter spike. Coloring all borders the\n\t\t\t\t\t// same accent-600 hue makes the corner blend\n\t\t\t\t\t// seamlessly while still keeping the slot grid\n\t\t\t\t\t// readable at full opacity.\n\t\t\t\t\t\"group-data-[otp-state=all]/otp:border-accent-600\",\n\t\t\t\t\t// Validation overrides. Only the *outer* edges of the\n\t\t\t\t\t// group are tinted (top + bottom on every slot, left on\n\t\t\t\t\t// the first slot, right on the last slot) so adjacent\n\t\t\t\t\t// slots still join with a neutral divider — matching how\n\t\t\t\t\t// `Input` tints the container border, not the internal\n\t\t\t\t\t// elements. The all-state and caret-active overrides\n\t\t\t\t\t// still recolor every border so a fully-active slot or\n\t\t\t\t\t// select-all reads as a solid tinted box. The bridge\n\t\t\t\t\t// sets `--otp-validation-{border,ring}` per validation\n\t\t\t\t\t// value, so a single set of classes covers\n\t\t\t\t\t// error/success/warning.\n\t\t\t\t\t\"group-data-validation/otp:border-y-(--otp-validation-border)\",\n\t\t\t\t\t\"group-data-validation/otp:first:border-l-(--otp-validation-border)\",\n\t\t\t\t\t\"group-data-validation/otp:last:border-r-(--otp-validation-border)\",\n\t\t\t\t\t\"group-data-validation/otp:data-active:group-data-[otp-state=caret]/otp:border-(--otp-validation-border)\",\n\t\t\t\t\t\"group-data-validation/otp:data-active:group-data-[otp-state=caret]/otp:ring-(--otp-validation-ring)\",\n\t\t\t\t\t\"group-data-validation/otp:group-data-[otp-state=all]/otp:border-(--otp-validation-border)\",\n\t\t\t\t\tclassName,\n\t\t\t\t)}\n\t\t\t\t{...props}\n\t\t\t>\n\t\t\t\t{char}\n\t\t\t\t{hasFakeCaret && (\n\t\t\t\t\t<div className=\"pointer-events-none absolute inset-0 flex items-center justify-center\">\n\t\t\t\t\t\t<div className=\"bg-strong h-4 w-px animate-pulse\" />\n\t\t\t\t\t</div>\n\t\t\t\t)}\n\t\t\t</div>\n\t\t);\n\t},\n);\nOtpInputSlotImpl.displayName = \"OtpInputSlot\";\n\ntype OtpInputSeparatorProps = ComponentProps<\"div\"> &\n\tWithAsChild & {\n\t\t/**\n\t\t * If `true`, the separator will be rendered with `role=\"separator\"` so\n\t\t * assistive tech announces it as a divider between OTP groups.\n\t\t * If `false`, the separator is purely decorative and is removed from\n\t\t * the accessibility tree — preferred inside an OTP control where the\n\t\t * minus icon is just visual chrome between slot groups.\n\t\t *\n\t\t * @default false\n\t\t */\n\t\tsemantic?: boolean;\n\t};\n\n/**\n * A visual separator between two `OtpInput.Group` segments. Renders a minus\n * icon by default; pass `children` to override the visual.\n *\n * @see https://mantle.ngrok.com/components/otp-input\n *\n * @example\n * ```tsx\n * <OtpInput.Root maxLength={6}>\n *   <OtpInput.Group>\n *     <OtpInput.Slot index={0} />\n *     <OtpInput.Slot index={1} />\n *     <OtpInput.Slot index={2} />\n *   </OtpInput.Group>\n *   <OtpInput.Separator />\n *   <OtpInput.Group>\n *     <OtpInput.Slot index={3} />\n *     <OtpInput.Slot index={4} />\n *     <OtpInput.Slot index={5} />\n *   </OtpInput.Group>\n * </OtpInput.Root>\n * ```\n */\nconst Separator = forwardRef<HTMLDivElement, OtpInputSeparatorProps>(\n\t({ asChild, children, className, semantic = false, ...props }, ref) => {\n\t\tconst Comp = asChild ? AsChildSlot : \"div\";\n\t\tconst semanticProps = semantic ? { role: \"separator\" } : { \"aria-hidden\": true, role: \"none\" };\n\n\t\treturn (\n\t\t\t<Comp\n\t\t\t\tref={ref}\n\t\t\t\tdata-slot=\"otp-input-separator\"\n\t\t\t\tclassName={cx(\"text-muted flex items-center\", className)}\n\t\t\t\t{...semanticProps}\n\t\t\t\t{...props}\n\t\t\t>\n\t\t\t\t{children ?? <MinusIcon weight=\"bold\" />}\n\t\t\t</Comp>\n\t\t);\n\t},\n);\nSeparator.displayName = \"OtpInputSeparator\";\n\n/**\n * Compound component for capturing one-time passcodes (OTP). Combines a\n * single hidden input (handling paste, autofill, and IME) with a row of\n * styled character slots.\n *\n * @see https://mantle.ngrok.com/components/otp-input\n *\n * @example\n * Composition:\n * ```\n * OtpInput.Root\n * ├── OtpInput.Group\n * │   └── OtpInput.Slot\n * ├── OtpInput.Separator\n * └── OtpInput.Group\n *     └── OtpInput.Slot\n * ```\n *\n * @example\n * ```tsx\n * <OtpInput.Root maxLength={6}>\n *   <OtpInput.Group>\n *     <OtpInput.Slot index={0} />\n *     <OtpInput.Slot index={1} />\n *     <OtpInput.Slot index={2} />\n *   </OtpInput.Group>\n *   <OtpInput.Separator />\n *   <OtpInput.Group>\n *     <OtpInput.Slot index={3} />\n *     <OtpInput.Slot index={4} />\n *     <OtpInput.Slot index={5} />\n *   </OtpInput.Group>\n * </OtpInput.Root>\n * ```\n */\nconst OtpInput = {\n\t/**\n\t * The root of the OTP input. Wraps the hidden input that captures\n\t * keystrokes, paste, and autofill, and provides per-slot state to\n\t * descendant `OtpInput.Slot` parts.\n\t *\n\t * @see https://mantle.ngrok.com/components/otp-input\n\t *\n\t * @example\n\t * ```tsx\n\t * <OtpInput.Root maxLength={6}>\n\t *   <OtpInput.Group>\n\t *     <OtpInput.Slot index={0} />\n\t *     <OtpInput.Slot index={1} />\n\t *     <OtpInput.Slot index={2} />\n\t *   </OtpInput.Group>\n\t *   <OtpInput.Separator />\n\t *   <OtpInput.Group>\n\t *     <OtpInput.Slot index={3} />\n\t *     <OtpInput.Slot index={4} />\n\t *     <OtpInput.Slot index={5} />\n\t *   </OtpInput.Group>\n\t * </OtpInput.Root>\n\t * ```\n\t */\n\tRoot,\n\t/**\n\t * Groups one or more `OtpInput.Slot` parts into a visually-connected\n\t * segment with shared rounded corners and joined borders.\n\t *\n\t * @see https://mantle.ngrok.com/components/otp-input\n\t *\n\t * @example\n\t * ```tsx\n\t * <OtpInput.Root maxLength={6}>\n\t *   <OtpInput.Group>\n\t *     <OtpInput.Slot index={0} />\n\t *     <OtpInput.Slot index={1} />\n\t *     <OtpInput.Slot index={2} />\n\t *   </OtpInput.Group>\n\t *   <OtpInput.Separator />\n\t *   <OtpInput.Group>\n\t *     <OtpInput.Slot index={3} />\n\t *     <OtpInput.Slot index={4} />\n\t *     <OtpInput.Slot index={5} />\n\t *   </OtpInput.Group>\n\t * </OtpInput.Root>\n\t * ```\n\t */\n\tGroup,\n\t/**\n\t * A single character slot. Must be rendered inside an `OtpInput.Root`.\n\t * Reads its character, active state, and fake caret position from the\n\t * root via context.\n\t *\n\t * @see https://mantle.ngrok.com/components/otp-input\n\t *\n\t * @example\n\t * ```tsx\n\t * <OtpInput.Root maxLength={6}>\n\t *   <OtpInput.Group>\n\t *     <OtpInput.Slot index={0} />\n\t *     <OtpInput.Slot index={1} />\n\t *     <OtpInput.Slot index={2} />\n\t *   </OtpInput.Group>\n\t *   <OtpInput.Separator />\n\t *   <OtpInput.Group>\n\t *     <OtpInput.Slot index={3} />\n\t *     <OtpInput.Slot index={4} />\n\t *     <OtpInput.Slot index={5} />\n\t *   </OtpInput.Group>\n\t * </OtpInput.Root>\n\t * ```\n\t */\n\tSlot: OtpInputSlotImpl,\n\t/**\n\t * A visual separator between two `OtpInput.Group` segments. Renders a\n\t * minus icon by default; pass `children` to override.\n\t *\n\t * @see https://mantle.ngrok.com/components/otp-input\n\t *\n\t * @example\n\t * ```tsx\n\t * <OtpInput.Root maxLength={6}>\n\t *   <OtpInput.Group>\n\t *     <OtpInput.Slot index={0} />\n\t *     <OtpInput.Slot index={1} />\n\t *     <OtpInput.Slot index={2} />\n\t *   </OtpInput.Group>\n\t *   <OtpInput.Separator />\n\t *   <OtpInput.Group>\n\t *     <OtpInput.Slot index={3} />\n\t *     <OtpInput.Slot index={4} />\n\t *     <OtpInput.Slot index={5} />\n\t *   </OtpInput.Group>\n\t * </OtpInput.Root>\n\t * ```\n\t */\n\tSeparator,\n} as const;\n\nexport {\n\t//,\n\tOtpInput,\n};\n\nexport {\n\t//,\n\tREGEXP_ONLY_CHARS,\n\tREGEXP_ONLY_DIGITS,\n\tREGEXP_ONLY_DIGITS_AND_CHARS,\n} from \"input-otp\";\n"],"mappings":"uZAsBA,MAAM,EAAiB,CACtB,MAAO,SACP,QAAS,UACT,QAAS,UACT,CAEK,EAAkE,GACvE,eAAe,EAAI,OAEd,EAAgE,GACrE,0BAA0B,EAAI,GAQzB,GAAmB,CACxB,cACA,WAKI,IAAgB,EACZ,OAEJ,IAAgB,EACZ,QAEJ,IAAgB,EACZ,MAED,QAgBF,GAAmB,CACxB,WACA,gBAIK,CACL,IAAM,EAAkB,EAAW,EAAgB,CAC7C,EAAQ,EAAgB,MAAM,OAK9B,EAAW,EAAgB,CAAE,YAJf,EAAgB,MAAM,QACxC,EAAO,IAAS,GAAS,KAAK,SAC/B,EAE6C,CAAE,QAAO,CAAC,CAOlD,EAAM,EAAa,EAAe,GAAc,IAAA,GAChD,EAAkB,EACrB,EAAe,CACf,0BAA2B,EAAsB,EAAI,CACrD,wBAAyB,EAAoB,EAAI,CACjD,CAAC,CACD,IAAA,GAIH,OACC,EAAC,MAAD,CACC,UAAU,qBACV,iBAAgB,EAChB,kBAAiB,GAAc,IAAA,GAC/B,MAAO,EAEN,WACI,CAAA,EA+CF,EAAO,GAEX,CACC,eAAgB,EAChB,WACA,YACA,qBACA,WAAY,EACZ,GAAG,GAEJ,IACI,CAEJ,IAAM,EADY,GAAe,MAAQ,IAAgB,QAEtD,SACC,OAAO,GAAgB,WAAa,GAAa,CAAG,IAAgB,IAAA,GAGxE,OACC,EAAC,EAAD,CACM,MACL,eAL0B,IAAgB,IAAe,SAAW,IAAA,IAMpE,YAAU,YACV,mBAAoB,EACnB,kDACA,EACA,CACD,UAAW,EAAG,8BAA+B,EAAU,CACvD,GAAI,WAEJ,EAAC,EAAD,CAA6B,aAAa,WAA2B,CAAA,CAC3D,CAAA,EAGb,CACD,EAAK,YAAc,WA4BnB,MAAM,EAAQ,GACZ,CAAE,UAAS,WAAU,YAAW,GAAG,GAAS,IAI3C,EAHY,EAAUA,EAAc,MAGpC,CACM,MACL,YAAU,kBACV,UAAW,EACV,wCAOA,+FAKA,2FACA,EACA,CACD,GAAI,EAEH,WACK,CAAA,CAGT,CACD,EAAM,YAAc,gBAuCpB,MAAM,EAAmB,GACvB,CAAE,YAAW,QAAO,GAAG,GAAS,IAAQ,CAExC,IAAM,EADU,EAAW,EACP,CAAC,MAAM,GACrB,EAAO,GAAM,MAAQ,KACrB,EAAe,GAAM,cAAgB,GAG3C,OACC,EAAC,MAAD,CACM,MACL,YAAU,iBACV,cANe,GAAM,UAAY,GAMT,GAAK,IAAA,GAC7B,UAAW,EACV,8KACA,sDAQA,gFAUA,iEACA,wDACA,iEACA,oDACA,sDASA,mDAYA,+DACA,qEACA,oEACA,0GACA,sGACA,4FACA,EACA,CACD,GAAI,WAzDL,CA2DE,EACA,GACA,EAAC,MAAD,CAAK,UAAU,iFACd,EAAC,MAAD,CAAK,UAAU,mCAAqC,CAAA,CAC/C,CAAA,CAEF,IAGR,CACD,EAAiB,YAAc,eAuC/B,MAAM,EAAY,GAChB,CAAE,UAAS,WAAU,YAAW,WAAW,GAAO,GAAG,GAAS,IAAQ,CACtE,IAAM,EAAO,EAAUA,EAAc,MAC/B,EAAgB,EAAW,CAAE,KAAM,YAAa,CAAG,CAAE,cAAe,GAAM,KAAM,OAAQ,CAE9F,OACC,EAAC,EAAD,CACM,MACL,YAAU,sBACV,UAAW,EAAG,+BAAgC,EAAU,CACxD,GAAI,EACJ,GAAI,WAEH,GAAY,EAAC,EAAD,CAAW,OAAO,OAAS,CAAA,CAClC,CAAA,EAGT,CACD,EAAU,YAAc,oBAqCxB,MAAM,EAAW,CAyBhB,OAwBA,QAyBA,KAAM,EAwBN,YACA"}

package/dist/progress.js

@@ -1,2 +1,2 @@
-import{t as e}from"./cx-D1HYnpvA.js";import{createContext as t,useContext as n,useId as r,useMemo as i}from"react";import a from"clsx";import{jsx as o,jsxs as s}from"react/jsx-runtime";import*as c from"@radix-ui/react-progress";function l(e,{min:t,max:n}){return Math.min(n,Math.max(t,e))}function u(e){return typeof e==`number`}function d(e,t){return u(e)&&!Number.isNaN(e)&&e<=t&&e>=0}function f(e){return u(e)&&!Number.isNaN(e)&&e>0}const p={max:100,strokeWidth:`0.25rem`,value:0},m=t(p),h=({children:t,className:n,max:r=100,strokeWidth:a=4,value:c,indeterminateRotationSpeed:l,...h})=>{let g=f(r)?r:100,_=d(c,g)?c:c==null?0:`indeterminate`,b=v(a??p.strokeWidth),x=u(_)?_:void 0,S=y(b),C=i(()=>({max:g,strokeWidth:b,value:_}),[g,b,_]);return o(m.Provider,{value:C,children:s(`svg`,{"data-slot":`progress-donut`,"aria-valuemax":g,"aria-valuemin":0,"aria-valuenow":x,className:e(`size-6 text-gray-200 dark:text-gray-300`,_===`indeterminate`&&[`animate-spin`,l??`animation-duration-[15s]`],n),"data-max":g,"data-min":0,"data-value":x,height:`100%`,role:`progressbar`,width:`100%`,...h,children:[o(`circle`,{className:`[r:var(--radius)]`,cx:`50%`,cy:`50%`,fill:`transparent`,stroke:`currentColor`,strokeWidth:b,style:{"--radius":S}}),t]})})};h.displayName=`ProgressDonut`;const g=({className:t,...i})=>{let c=r(),l=n(m)??p,u=(l.value===`indeterminate`?.6:l.value/l.max)*100,d=v(l.strokeWidth),f=y(d);return s(`g`,{"data-slot":`progress-donut-indicator`,className:e(`text-accent-600`,t),...i,children:[l.value===`indeterminate`&&o(`defs`,{children:s(`linearGradient`,{id:c,children:[o(`stop`,{className:`stop-opacity-100 stop-color-current`,offset:`0%`}),o(`stop`,{className:`stop-opacity-0 stop-color-current`,offset:`95%`})]})}),o(`circle`,{className:a(`[r:var(--radius)]`,`origin-center`),cx:`50%`,cy:`50%`,fill:`transparent`,pathLength:100,stroke:l.value===`indeterminate`?`url(#${c})`:`currentColor`,strokeDasharray:100,strokeDashoffset:100-u,strokeLinecap:`round`,strokeWidth:d,style:{"--radius":f},transform:`rotate(-90)`})]})};g.displayName=`ProgressDonutIndicator`;const _={Root:h,Indicator:g};function v(e){let t=4;return e==null?t:(t=typeof e==`number`?e:e.endsWith(`rem`)?Number(e.replace(`rem`,``))*16:Number(e),l(Number.isNaN(t)?4:t,{min:1,max:12}))}function y(e){return`calc(50% - ${e/2}px)`}const b=t({max:100,value:0});function x({className:t,children:n,max:r=100,value:a,...s}){let l=f(r)?r:100,p=d(a,l)?a:a==null?0:`indeterminate`,m=u(p)?p:void 0,h=i(()=>({max:l,value:p}),[l,p]);return o(b.Provider,{value:h,children:o(c.Root,{"data-slot":`progress-bar`,className:e(`bg-base-hover dark:bg-base shadow-inner relative h-3 w-full overflow-hidden rounded-md`,t),value:m,max:l,...s,children:n})})}x.displayName=`Root`;function S({className:t,style:r,...i}){let a=n(b),{max:s}=a,l=(s-(a.value===`indeterminate`?0:a.value))/s*100;return o(c.Indicator,{"data-slot":`progress-bar-indicator`,className:e(`bg-accent-600 h-full w-full flex-1 transition-all`,t),style:{...r,transform:`translateX(-${l}%)`},...i})}S.displayName=`Indicator`;const C={Root:x,Indicator:S};export{C as ProgressBar,_ as ProgressDonut};
+import{t as e}from"./cx-D1HYnpvA.js";import{t}from"./types-884RJJqm.js";import{createContext as n,useContext as r,useId as i,useMemo as a}from"react";import o from"clsx";import{jsx as s,jsxs as c}from"react/jsx-runtime";import*as l from"@radix-ui/react-progress";function u(e,{min:t,max:n}){return Math.min(n,Math.max(t,e))}function d(e){return typeof e==`number`}function f(e,t){return d(e)&&!Number.isNaN(e)&&e<=t&&e>=0}function p(e){return d(e)&&!Number.isNaN(e)&&e>0}const m={max:100,strokeWidth:`0.25rem`,value:0},h=n(m),g=({children:n,className:r,max:i=100,strokeWidth:o=4,value:l,indeterminateRotationSpeed:u,...g})=>{let _=p(i)?i:100,v=f(l,_)?l:l==null?0:`indeterminate`,x=y(o??m.strokeWidth),S=d(v)?v:void 0,C=b(x),w=a(()=>({max:_,strokeWidth:x,value:v}),[_,x,v]);return s(h.Provider,{value:w,children:c(`svg`,{"data-slot":`progress-donut`,"aria-valuemax":_,"aria-valuemin":0,"aria-valuenow":S,className:e(`size-6 text-gray-200 dark:text-gray-300`,v===`indeterminate`&&[`animate-spin`,u??`animation-duration-[15s]`],r),"data-max":_,"data-min":0,"data-value":S,height:`100%`,role:`progressbar`,width:`100%`,...g,children:[s(`circle`,{className:`[r:var(--radius)]`,cx:`50%`,cy:`50%`,fill:`transparent`,stroke:`currentColor`,strokeWidth:x,style:t({"--radius":C})}),n]})})};g.displayName=`ProgressDonut`;const _=({className:n,...a})=>{let l=i(),u=r(h)??m,d=(u.value===`indeterminate`?.6:u.value/u.max)*100,f=y(u.strokeWidth),p=b(f);return c(`g`,{"data-slot":`progress-donut-indicator`,className:e(`text-accent-600`,n),...a,children:[u.value===`indeterminate`&&s(`defs`,{children:c(`linearGradient`,{id:l,children:[s(`stop`,{className:`stop-opacity-100 stop-color-current`,offset:`0%`}),s(`stop`,{className:`stop-opacity-0 stop-color-current`,offset:`95%`})]})}),s(`circle`,{className:o(`[r:var(--radius)]`,`origin-center`),cx:`50%`,cy:`50%`,fill:`transparent`,pathLength:100,stroke:u.value===`indeterminate`?`url(#${l})`:`currentColor`,strokeDasharray:100,strokeDashoffset:100-d,strokeLinecap:`round`,strokeWidth:f,style:t({"--radius":p}),transform:`rotate(-90)`})]})};_.displayName=`ProgressDonutIndicator`;const v={Root:g,Indicator:_};function y(e){let t=4;return e==null?t:(t=typeof e==`number`?e:e.endsWith(`rem`)?Number(e.replace(`rem`,``))*16:Number(e),u(Number.isNaN(t)?4:t,{min:1,max:12}))}function b(e){return`calc(50% - ${e/2}px)`}const x=n({max:100,value:0});function S({className:t,children:n,max:r=100,value:i,...o}){let c=p(r)?r:100,u=f(i,c)?i:i==null?0:`indeterminate`,m=d(u)?u:void 0,h=a(()=>({max:c,value:u}),[c,u]);return s(x.Provider,{value:h,children:s(l.Root,{"data-slot":`progress-bar`,className:e(`bg-base-hover dark:bg-base shadow-inner relative h-3 w-full overflow-hidden rounded-md`,t),value:m,max:c,...o,children:n})})}S.displayName=`Root`;function C({className:t,style:n,...i}){let a=r(x),{max:o}=a,c=(o-(a.value===`indeterminate`?0:a.value))/o*100;return s(l.Indicator,{"data-slot":`progress-bar-indicator`,className:e(`bg-accent-600 h-full w-full flex-1 transition-all`,t),style:{...n,transform:`translateX(-${c}%)`},...i})}C.displayName=`Indicator`;const w={Root:S,Indicator:C};export{w as ProgressBar,v as ProgressDonut};
 //# sourceMappingURL=progress.js.map

package/dist/progress.js.map

@@ -1 +1 @@
-{"version":3,"file":"progress.js","names":["defaultMax","ProgressContext","Root","Indicator","clsx"],"sources":["../src/components/progress/math.ts","../src/components/progress/progress-donut.tsx","../src/components/progress/progress-bar.tsx"],"sourcesContent":["/**\n * Clamp a value between a minimum and maximum value.\n */\nfunction clamp(value: number, { min, max }: { min: number; max: number }): number {\n\treturn Math.min(max, Math.max(min, value));\n}\n\n/**\n * Check if a value is a number.\n */\nfunction isNumber(value: unknown): value is number {\n\treturn typeof value === \"number\";\n}\n\n/**\n * Check if a value is a valid number within the range of 0 to `max`.\n */\nfunction isValidValueNumber(value: unknown, max: number): value is number {\n\treturn isNumber(value) && !Number.isNaN(value) && value <= max && value >= 0;\n}\n\n/**\n * Check if a value is a valid number greater than 0.\n */\nfunction isValidMaxNumber(value: unknown): value is number {\n\treturn isNumber(value) && !Number.isNaN(value) && value > 0;\n}\n\nexport {\n\t//,\n\tclamp,\n\tisNumber,\n\tisValidValueNumber,\n\tisValidMaxNumber,\n};\n","import clsx from \"clsx\";\nimport { createContext, useContext, useId, useMemo } from \"react\";\nimport type { CSSProperties, ComponentProps, HTMLAttributes } from \"react\";\nimport { cx } from \"../../utils/cx/cx.js\";\nimport { clamp, isNumber, isValidMaxNumber, isValidValueNumber } from \"./math.js\";\nimport type { ValueType } from \"./types.js\";\n\ntype RemValue = `${number}rem`;\ntype StrokeWidth = number | RemValue;\n\n/**\n * The default maximum value of the progress bar.\n */\nconst defaultMax = 100;\n\ntype ProgressContextValue = {\n\tmax: number;\n\tstrokeWidth: StrokeWidth;\n\tvalue: ValueType;\n};\n\nconst defaultContextValue = {\n\tmax: defaultMax,\n\tstrokeWidth: \"0.25rem\",\n\tvalue: 0,\n} as const satisfies ProgressContextValue;\n\nconst ProgressContext = createContext<ProgressContextValue>(defaultContextValue);\n\ntype SvgAttributes = Omit<\n\tHTMLAttributes<SVGElement>,\n\t\"viewBox\" | \"role\" | \"aria-valuemax\" | \"aria-valuemin\" | \"aria-valuenow\" | \"width\" | \"height\"\n>;\n\ntype Props = SvgAttributes & {\n\t/**\n\t * The maximum value of the progress bar.\n\t * This attribute describes how much work the task indicated by the progress element requires.\n\t * The max attribute, if present, must have a value greater than 0. The default value is 100.\n\t *\n\t * @default 100\n\t */\n\tmax?: number | undefined;\n\t/**\n\t * The width of the progress bar stroke.\n\t * Note, we clamp the stroke width to a minimum of 1px and max of 12px since\n\t * it is proportional to the viewbox size (0 0 32 32).\n\t *\n\t * @default 0.25rem (4px)\n\t */\n\tstrokeWidth?: StrokeWidth;\n\t/**\n\t * The current value of the progress bar.\n\t * This attribute specifies how much of the task that has been completed.\n\t * It must be a valid floating point number between 0 and max, or between 0 and 100 if max is omitted.\n\t * If set to `\"indeterminate\"`, the progress bar is considered indeterminate.\n\t *\n\t * @default 0\n\t */\n\tvalue?: ValueType | undefined;\n\t/**\n\t * Controls the rotation speed of the indeterminate spinner state.\n\t *\n\t * Accepts a Tailwind `animation-duration-*` utility (e.g. `animation-duration-[2s]`).\n\t *\n\t * This prop is applied in addition to `animate-spin` to control the speed of the indeterminate spinner.\n\t * @default `animation-duration-[15s]`\n\t */\n\tindeterminateRotationSpeed?: `animation-duration-${string}`;\n};\n\n/**\n * A simple circular progress bar which shows the completion progress of a task.\n *\n * The indicator color is inherited via `currentColor`. Override the default\n * (`accent-600`) by setting the `ProgressDonut.Indicator`'s text color.\n *\n * @see https://mantle.ngrok.com/components/progress#api-progress-donut\n *\n * @example\n * ```tsx\n * <ProgressDonut.Root value={60}>\n *   <ProgressDonut.Indicator />\n * </ProgressDonut.Root>\n *\n * <ProgressDonut.Root value={60}>\n *   <ProgressDonut.Indicator color=\"text-danger-600\" />\n * </ProgressDonut.Root>\n * ```\n */\nconst Root = ({\n\tchildren,\n\tclassName,\n\tmax: _max = defaultMax,\n\tstrokeWidth: _strokeWidth = 4,\n\tvalue: _value,\n\tindeterminateRotationSpeed,\n\t...props\n}: Props) => {\n\tconst max = isValidMaxNumber(_max) ? _max : defaultMax;\n\tconst value = (\n\t\tisValidValueNumber(_value, max) ? _value : _value == null ? 0 : \"indeterminate\"\n\t) satisfies ValueType;\n\tconst strokeWidthPx = deriveStrokeWidthPx(_strokeWidth ?? defaultContextValue.strokeWidth);\n\tconst valueNow = isNumber(value) ? value : undefined;\n\tconst radius = calcRadius(strokeWidthPx);\n\n\tconst ctx: ProgressContextValue = useMemo(\n\t\t() => ({\n\t\t\tmax,\n\t\t\tstrokeWidth: strokeWidthPx,\n\t\t\tvalue,\n\t\t}),\n\t\t[max, strokeWidthPx, value],\n\t);\n\n\treturn (\n\t\t<ProgressContext.Provider value={ctx}>\n\t\t\t{/* biome-ignore lint/a11y/useFocusableInteractive: progress bars don't need to be focusable */}\n\t\t\t<svg\n\t\t\t\tdata-slot=\"progress-donut\"\n\t\t\t\taria-valuemax={max}\n\t\t\t\taria-valuemin={0}\n\t\t\t\taria-valuenow={valueNow}\n\t\t\t\tclassName={cx(\n\t\t\t\t\t\"size-6 text-gray-200 dark:text-gray-300\",\n\t\t\t\t\tvalue === \"indeterminate\" && [\n\t\t\t\t\t\t\"animate-spin\",\n\t\t\t\t\t\t// Default duration only if consumer hasn't set one.\n\t\t\t\t\t\t// Without this guard, both our `[15s]` and consumer overrides (e.g. `[2s]`)\n\t\t\t\t\t\t// end up in the DOM. Since tw-animate-css utilities aren't currently deduped by\n\t\t\t\t\t\t// tailwind-merge, whichever class Tailwind happened to emit last wins,\n\t\t\t\t\t\t// which isn't reliable.\n\t\t\t\t\t\tindeterminateRotationSpeed ?? \"animation-duration-[15s]\",\n\t\t\t\t\t],\n\t\t\t\t\tclassName,\n\t\t\t\t)}\n\t\t\t\tdata-max={max}\n\t\t\t\tdata-min={0}\n\t\t\t\tdata-value={valueNow}\n\t\t\t\theight=\"100%\"\n\t\t\t\t// biome-ignore lint/a11y/noNoninteractiveElementToInteractiveRole: this is a radial progress bar, which is possible by SVG\n\t\t\t\trole=\"progressbar\"\n\t\t\t\twidth=\"100%\"\n\t\t\t\t{...props}\n\t\t\t>\n\t\t\t\t<circle\n\t\t\t\t\tclassName=\"[r:var(--radius)]\"\n\t\t\t\t\tcx=\"50%\"\n\t\t\t\t\tcy=\"50%\"\n\t\t\t\t\tfill=\"transparent\"\n\t\t\t\t\tstroke=\"currentColor\"\n\t\t\t\t\tstrokeWidth={strokeWidthPx}\n\t\t\t\t\tstyle={{ \"--radius\": radius } as CSSProperties}\n\t\t\t\t/>\n\t\t\t\t{children}\n\t\t\t</svg>\n\t\t</ProgressContext.Provider>\n\t);\n};\nRoot.displayName = \"ProgressDonut\";\n\n/**\n * Length (value) of the progress indicator tail when the progress bar is indeterminate.\n */\nconst indeterminateTailPercent = 0.6;\n\ntype ProgressDonutIndicatorProps = Omit<ComponentProps<\"g\">, \"children\">;\n\n/**\n * The indicator for the circular progress bar.\n *\n * @see https://mantle.ngrok.com/components/progress#api-progress-donut-indicator\n *\n * @example\n * ```tsx\n * <ProgressDonut.Root value={60}>\n *   <ProgressDonut.Indicator />\n * </ProgressDonut.Root>\n *\n * <ProgressDonut.Root value={60}>\n *   <ProgressDonut.Indicator color=\"text-danger-600\" />\n * </ProgressDonut.Root>\n * ```\n */\nconst Indicator = ({ className, ...props }: ProgressDonutIndicatorProps) => {\n\tconst gradientId = useId();\n\tconst ctx = useContext(ProgressContext) ?? defaultContextValue;\n\tconst percentage =\n\t\t(ctx.value === \"indeterminate\" ? indeterminateTailPercent : ctx.value / ctx.max) * 100;\n\tconst strokeWidthPx = deriveStrokeWidthPx(ctx.strokeWidth);\n\tconst radius = calcRadius(strokeWidthPx);\n\n\treturn (\n\t\t<g data-slot=\"progress-donut-indicator\" className={cx(\"text-accent-600\", className)} {...props}>\n\t\t\t{ctx.value === \"indeterminate\" && (\n\t\t\t\t<defs>\n\t\t\t\t\t<linearGradient id={gradientId}>\n\t\t\t\t\t\t<stop className=\"stop-opacity-100 stop-color-current\" offset=\"0%\" />\n\t\t\t\t\t\t<stop className=\"stop-opacity-0 stop-color-current\" offset=\"95%\" />\n\t\t\t\t\t</linearGradient>\n\t\t\t\t</defs>\n\t\t\t)}\n\t\t\t<circle\n\t\t\t\tclassName={clsx(\n\t\t\t\t\t\"[r:var(--radius)]\", // set the circle radius to be the value of the calc'd CSS variable set on the style\n\t\t\t\t\t\"origin-center\",\n\t\t\t\t)}\n\t\t\t\tcx=\"50%\"\n\t\t\t\tcy=\"50%\"\n\t\t\t\tfill=\"transparent\"\n\t\t\t\tpathLength={100}\n\t\t\t\tstroke={ctx.value === \"indeterminate\" ? `url(#${gradientId})` : \"currentColor\"}\n\t\t\t\tstrokeDasharray={100}\n\t\t\t\tstrokeDashoffset={100 - percentage}\n\t\t\t\tstrokeLinecap=\"round\"\n\t\t\t\tstrokeWidth={strokeWidthPx}\n\t\t\t\tstyle={{ \"--radius\": radius } as CSSProperties}\n\t\t\t\ttransform=\"rotate(-90)\" // rotate -90 degrees so it starts from the top\n\t\t\t/>\n\t\t</g>\n\t);\n};\nIndicator.displayName = \"ProgressDonutIndicator\";\n\n/**\n * A simple circular progress bar which shows the completion progress of a task.\n *\n * The indicator color is inherited via `currentColor`. Override the default\n * (`accent-600`) by setting the `ProgressDonut.Indicator`'s text color.\n *\n * @see https://mantle.ngrok.com/components/progress\n *\n * @example\n * Composition:\n * ```\n * ProgressDonut.Root\n * └── ProgressDonut.Indicator\n * ```\n *\n * @example\n * ```tsx\n * <ProgressDonut.Root value={60}>\n *   <ProgressDonut.Indicator />\n * </ProgressDonut.Root>\n *\n * <ProgressDonut.Root value={60}>\n *   <ProgressDonut.Indicator color=\"text-danger-600\" />\n * </ProgressDonut.Root>\n * ```\n */\nconst ProgressDonut = {\n\t/**\n\t * A simple circular progress bar which shows the completion progress of a task.\n\t *\n\t * The indicator color is inherited via `currentColor`. Override the default\n\t * (`accent-600`) by setting the `ProgressDonut.Indicator`'s text color.\n\t *\n\t * @see https://mantle.ngrok.com/components/progress#api-progress-donut-root\n\t *\n\t * @example\n\t * ```tsx\n\t * <ProgressDonut.Root value={60}>\n\t *   <ProgressDonut.Indicator />\n\t * </ProgressDonut.Root>\n\t *\n\t * <ProgressDonut.Root value={60}>\n\t *   <ProgressDonut.Indicator color=\"text-danger-600\" />\n\t * </ProgressDonut.Root>\n\t * ```\n\t */\n\tRoot,\n\t/**\n\t * The indicator for the circular progress bar.\n\t *\n\t * @see https://mantle.ngrok.com/components/progress#api-progress-donut-indicator\n\t *\n\t * @example\n\t * ```tsx\n\t * <ProgressDonut.Root value={60}>\n\t *   <ProgressDonut.Indicator />\n\t * </ProgressDonut.Root>\n\t *\n\t * <ProgressDonut.Root value={60}>\n\t *   <ProgressDonut.Indicator color=\"text-danger-600\" />\n\t * </ProgressDonut.Root>\n\t * ```\n\t */\n\tIndicator,\n} as const;\n\nexport {\n\t//,\n\tProgressDonut,\n};\n\n/**\n * Derive the stroke width in pixels as a number value or pixels/rem from a string value.\n * Note, this function clamps the stroke width to a minimum of 1 and max of 12 since\n * it is proportional to the viewbox size (0 0 32 32).\n *\n * @example\n * ```tsx\n * const strokeWidth1 = deriveStrokeWidthPx(8);\n * // Returns: 8\n *\n * const strokeWidth2 = deriveStrokeWidthPx(\"0.5rem\");\n * // Returns: 8 (0.5 * 16)\n *\n * const strokeWidth3 = deriveStrokeWidthPx(20);\n * // Returns: 12 (clamped to maximum)\n * ```\n */\nexport function deriveStrokeWidthPx(strokeWidth: number | string | undefined | null): number {\n\tlet value = 4;\n\tif (strokeWidth == null) {\n\t\treturn value;\n\t}\n\n\tif (typeof strokeWidth === \"number\") {\n\t\tvalue = strokeWidth;\n\t} else if (strokeWidth.endsWith(\"rem\")) {\n\t\tvalue = Number(strokeWidth.replace(\"rem\", \"\")) * 16;\n\t} else {\n\t\tvalue = Number(strokeWidth);\n\t}\n\n\tconst stroke = Number.isNaN(value) ? 4 : value;\n\treturn clamp(stroke, { min: 1, max: 12 });\n}\n\n/**\n * Calculate the radius of the progress donut and indicator based on the stroke\n * width in pixels.\n */\nfunction calcRadius(strokeWidthPx: number) {\n\treturn `calc(50% - ${strokeWidthPx / 2}px)` as const;\n}\n","\"use client\";\n\nimport * as ProgressPrimitive from \"@radix-ui/react-progress\";\n\nimport { type ComponentProps, createContext, useContext, useMemo } from \"react\";\nimport { cx } from \"../../utils/cx/cx.js\";\nimport { isNumber, isValidMaxNumber, isValidValueNumber } from \"./math.js\";\nimport type { ValueType } from \"./types.js\";\n\n/**\n * The default maximum value of the progress bar.\n */\nconst defaultMax = 100;\n\ntype ProgressContextValue = {\n\tmax: number;\n\tvalue: ValueType;\n};\n\nconst defaultContextValue = {\n\tmax: defaultMax,\n\tvalue: 0,\n} as const satisfies ProgressContextValue;\n\nconst ProgressContext = createContext<ProgressContextValue>(defaultContextValue);\n\ntype RootProps = ComponentProps<\"div\"> & {\n\t/**\n\t * The maximum value of the progress bar.\n\t * This attribute describes how much work the task indicated by the progress element requires.\n\t * The max attribute, if present, must have a value greater than 0. The default value is 100.\n\t *\n\t * @default 100\n\t */\n\tmax?: number | undefined;\n\t/**\n\t * The current value of the progress bar.\n\t * This attribute specifies how much of the task that has been completed.\n\t * It must be a valid floating point number between 0 and max, or between 0 and 100 if max is omitted.\n\t * If set to `\"indeterminate\"`, the progress bar is considered indeterminate. (for now there is no visual difference than 0)\n\t *\n\t * @default 0\n\t */\n\tvalue?: ValueType | undefined;\n};\n\n/**\n * Displays an indicator showing the completion progress of a task, typically displayed as a progress bar.\n *\n * A horizontal progress bar that shows the completion progress of a task.\n * Use this component for linear progress indication.\n *\n * @see https://mantle.ngrok.com/components/progress#api-progress-bar\n *\n * @example\n * ```tsx\n * <ProgressBar.Root value={60}>\n *   <ProgressBar.Indicator />\n * </ProgressBar.Root>\n *\n * <ProgressBar.Root value={75} max={100}>\n *   <ProgressBar.Indicator />\n * </ProgressBar.Root>\n *\n * // Indeterminate progress\n * <ProgressBar.Root value=\"indeterminate\">\n *   <ProgressBar.Indicator />\n * </ProgressBar.Root>\n * ```\n */\nfunction Root({ className, children, max: _max = defaultMax, value: _value, ...props }: RootProps) {\n\tconst max = isValidMaxNumber(_max) ? _max : defaultMax;\n\tconst value = (\n\t\tisValidValueNumber(_value, max) ? _value : _value == null ? 0 : \"indeterminate\"\n\t) satisfies ValueType;\n\n\tconst valueNow = isNumber(value) ? value : undefined;\n\n\tconst ctx: ProgressContextValue = useMemo(\n\t\t() => ({\n\t\t\tmax,\n\t\t\tvalue,\n\t\t}),\n\t\t[max, value],\n\t);\n\n\treturn (\n\t\t<ProgressContext.Provider value={ctx}>\n\t\t\t<ProgressPrimitive.Root\n\t\t\t\tdata-slot=\"progress-bar\"\n\t\t\t\tclassName={cx(\n\t\t\t\t\t\"bg-base-hover dark:bg-base shadow-inner relative h-3 w-full overflow-hidden rounded-md\",\n\t\t\t\t\tclassName,\n\t\t\t\t)}\n\t\t\t\tvalue={valueNow}\n\t\t\t\tmax={max}\n\t\t\t\t{...props}\n\t\t\t>\n\t\t\t\t{children}\n\t\t\t</ProgressPrimitive.Root>\n\t\t</ProgressContext.Provider>\n\t);\n}\nRoot.displayName = \"Root\";\n\ntype IndicatorProps = ComponentProps<typeof ProgressPrimitive.Indicator>;\n\n/**\n * Displays the progress indicator, which visually represents the completion progress of a task.\n *\n * The visual indicator that shows the actual progress within the progress bar.\n * This component should be used inside a ProgressBar.Root component.\n *\n * @see https://mantle.ngrok.com/components/progress#api-progress-bar-indicator\n *\n * @example\n * ```tsx\n * <ProgressBar.Root value={60}>\n *   <ProgressBar.Indicator />\n * </ProgressBar.Root>\n *\n * // Custom styled indicator\n * <ProgressBar.Root value={60}>\n *   <ProgressBar.Indicator className=\"bg-success-600\" />\n * </ProgressBar.Root>\n * ```\n */\nfunction Indicator({ className, style, ...props }: IndicatorProps) {\n\tconst ctx = useContext(ProgressContext);\n\tconst { max } = ctx;\n\tconst value = ctx.value === \"indeterminate\" ? 0 : ctx.value;\n\tconst translatePercent = ((max - value) / max) * 100;\n\n\treturn (\n\t\t<ProgressPrimitive.Indicator\n\t\t\tdata-slot=\"progress-bar-indicator\"\n\t\t\tclassName={cx(\"bg-accent-600 h-full w-full flex-1 transition-all\", className)}\n\t\t\tstyle={{ ...style, transform: `translateX(-${translatePercent}%)` }}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\nIndicator.displayName = \"Indicator\";\n\n/**\n * Displays an indicator showing the completion progress of a task, typically displayed as a progress bar.\n *\n * A horizontal progress bar that shows the completion progress of a task.\n * Use this component for linear progress indication.\n *\n * @see https://mantle.ngrok.com/components/progress\n *\n * @example\n * Composition:\n * ```\n * ProgressBar.Root\n * └── ProgressBar.Indicator\n * ```\n *\n * @example\n * ```tsx\n * <ProgressBar.Root value={60}>\n *   <ProgressBar.Indicator />\n * </ProgressBar.Root>\n *\n * <ProgressBar.Root value={75} max={100}>\n *   <ProgressBar.Indicator />\n * </ProgressBar.Root>\n *\n * // Indeterminate progress\n * <ProgressBar.Root value=\"indeterminate\">\n *   <ProgressBar.Indicator />\n * </ProgressBar.Root>\n * ```\n */\nconst ProgressBar = {\n\t/**\n\t * Displays an indicator showing the completion progress of a task, typically displayed as a progress bar.\n\t *\n\t * A horizontal progress bar that shows the completion progress of a task.\n\t * Use this component for linear progress indication.\n\t *\n\t * @see https://mantle.ngrok.com/components/progress#api-progress-bar\n\t *\n\t * @example\n\t * ```tsx\n\t * <ProgressBar.Root value={60}>\n\t *   <ProgressBar.Indicator />\n\t * </ProgressBar.Root>\n\t *\n\t * <ProgressBar.Root value={75} max={100}>\n\t *   <ProgressBar.Indicator />\n\t * </ProgressBar.Root>\n\t *\n\t * // Indeterminate progress\n\t * <ProgressBar.Root value=\"indeterminate\">\n\t *   <ProgressBar.Indicator />\n\t * </ProgressBar.Root>\n\t * ```\n\t */\n\tRoot,\n\t/**\n\t * Displays the progress indicator, which visually represents the completion progress of a task.\n\t *\n\t * The visual indicator that shows the actual progress within the progress bar.\n\t * This component should be used inside a ProgressBar.Root component.\n\t *\n\t * @see https://mantle.ngrok.com/components/progress#api-progress-bar-indicator\n\t *\n\t * @example\n\t * ```tsx\n\t * <ProgressBar.Root value={60}>\n\t *   <ProgressBar.Indicator />\n\t * </ProgressBar.Root>\n\t *\n\t * // Custom styled indicator\n\t * <ProgressBar.Root value={60}>\n\t *   <ProgressBar.Indicator className=\"bg-success-600\" />\n\t * </ProgressBar.Root>\n\t * ```\n\t */\n\tIndicator,\n} as const;\n\nexport {\n\t//,\n\tProgressBar,\n};\n"],"mappings":"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"}
+{"version":3,"file":"progress.js","names":["defaultMax","ProgressContext","Root","Indicator","clsx"],"sources":["../src/components/progress/math.ts","../src/components/progress/progress-donut.tsx","../src/components/progress/progress-bar.tsx"],"sourcesContent":["/**\n * Clamp a value between a minimum and maximum value.\n */\nfunction clamp(value: number, { min, max }: { min: number; max: number }): number {\n\treturn Math.min(max, Math.max(min, value));\n}\n\n/**\n * Check if a value is a number.\n */\nfunction isNumber(value: unknown): value is number {\n\treturn typeof value === \"number\";\n}\n\n/**\n * Check if a value is a valid number within the range of 0 to `max`.\n */\nfunction isValidValueNumber(value: unknown, max: number): value is number {\n\treturn isNumber(value) && !Number.isNaN(value) && value <= max && value >= 0;\n}\n\n/**\n * Check if a value is a valid number greater than 0.\n */\nfunction isValidMaxNumber(value: unknown): value is number {\n\treturn isNumber(value) && !Number.isNaN(value) && value > 0;\n}\n\nexport {\n\t//,\n\tclamp,\n\tisNumber,\n\tisValidValueNumber,\n\tisValidMaxNumber,\n};\n","import clsx from \"clsx\";\nimport { createContext, useContext, useId, useMemo } from \"react\";\nimport type { ComponentProps, HTMLAttributes } from \"react\";\nimport { $cssProperties } from \"../../types/index.js\";\nimport { cx } from \"../../utils/cx/cx.js\";\nimport { clamp, isNumber, isValidMaxNumber, isValidValueNumber } from \"./math.js\";\nimport type { ValueType } from \"./types.js\";\n\ntype RemValue = `${number}rem`;\ntype StrokeWidth = number | RemValue;\n\n/**\n * The default maximum value of the progress bar.\n */\nconst defaultMax = 100;\n\ntype ProgressContextValue = {\n\tmax: number;\n\tstrokeWidth: StrokeWidth;\n\tvalue: ValueType;\n};\n\nconst defaultContextValue = {\n\tmax: defaultMax,\n\tstrokeWidth: \"0.25rem\",\n\tvalue: 0,\n} as const satisfies ProgressContextValue;\n\nconst ProgressContext = createContext<ProgressContextValue>(defaultContextValue);\n\ntype SvgAttributes = Omit<\n\tHTMLAttributes<SVGElement>,\n\t\"viewBox\" | \"role\" | \"aria-valuemax\" | \"aria-valuemin\" | \"aria-valuenow\" | \"width\" | \"height\"\n>;\n\ntype Props = SvgAttributes & {\n\t/**\n\t * The maximum value of the progress bar.\n\t * This attribute describes how much work the task indicated by the progress element requires.\n\t * The max attribute, if present, must have a value greater than 0. The default value is 100.\n\t *\n\t * @default 100\n\t */\n\tmax?: number | undefined;\n\t/**\n\t * The width of the progress bar stroke.\n\t * Note, we clamp the stroke width to a minimum of 1px and max of 12px since\n\t * it is proportional to the viewbox size (0 0 32 32).\n\t *\n\t * @default 0.25rem (4px)\n\t */\n\tstrokeWidth?: StrokeWidth;\n\t/**\n\t * The current value of the progress bar.\n\t * This attribute specifies how much of the task that has been completed.\n\t * It must be a valid floating point number between 0 and max, or between 0 and 100 if max is omitted.\n\t * If set to `\"indeterminate\"`, the progress bar is considered indeterminate.\n\t *\n\t * @default 0\n\t */\n\tvalue?: ValueType | undefined;\n\t/**\n\t * Controls the rotation speed of the indeterminate spinner state.\n\t *\n\t * Accepts a Tailwind `animation-duration-*` utility (e.g. `animation-duration-[2s]`).\n\t *\n\t * This prop is applied in addition to `animate-spin` to control the speed of the indeterminate spinner.\n\t * @default `animation-duration-[15s]`\n\t */\n\tindeterminateRotationSpeed?: `animation-duration-${string}`;\n};\n\n/**\n * A simple circular progress bar which shows the completion progress of a task.\n *\n * The indicator color is inherited via `currentColor`. Override the default\n * (`accent-600`) by setting the `ProgressDonut.Indicator`'s text color.\n *\n * @see https://mantle.ngrok.com/components/progress#api-progress-donut\n *\n * @example\n * ```tsx\n * <ProgressDonut.Root value={60}>\n *   <ProgressDonut.Indicator />\n * </ProgressDonut.Root>\n *\n * <ProgressDonut.Root value={60}>\n *   <ProgressDonut.Indicator color=\"text-danger-600\" />\n * </ProgressDonut.Root>\n * ```\n */\nconst Root = ({\n\tchildren,\n\tclassName,\n\tmax: _max = defaultMax,\n\tstrokeWidth: _strokeWidth = 4,\n\tvalue: _value,\n\tindeterminateRotationSpeed,\n\t...props\n}: Props) => {\n\tconst max = isValidMaxNumber(_max) ? _max : defaultMax;\n\tconst value = (\n\t\tisValidValueNumber(_value, max) ? _value : _value == null ? 0 : \"indeterminate\"\n\t) satisfies ValueType;\n\tconst strokeWidthPx = deriveStrokeWidthPx(_strokeWidth ?? defaultContextValue.strokeWidth);\n\tconst valueNow = isNumber(value) ? value : undefined;\n\tconst radius = calcRadius(strokeWidthPx);\n\n\tconst ctx: ProgressContextValue = useMemo(\n\t\t() => ({\n\t\t\tmax,\n\t\t\tstrokeWidth: strokeWidthPx,\n\t\t\tvalue,\n\t\t}),\n\t\t[max, strokeWidthPx, value],\n\t);\n\n\treturn (\n\t\t<ProgressContext.Provider value={ctx}>\n\t\t\t{/* biome-ignore lint/a11y/useFocusableInteractive: progress bars don't need to be focusable */}\n\t\t\t<svg\n\t\t\t\tdata-slot=\"progress-donut\"\n\t\t\t\taria-valuemax={max}\n\t\t\t\taria-valuemin={0}\n\t\t\t\taria-valuenow={valueNow}\n\t\t\t\tclassName={cx(\n\t\t\t\t\t\"size-6 text-gray-200 dark:text-gray-300\",\n\t\t\t\t\tvalue === \"indeterminate\" && [\n\t\t\t\t\t\t\"animate-spin\",\n\t\t\t\t\t\t// Default duration only if consumer hasn't set one.\n\t\t\t\t\t\t// Without this guard, both our `[15s]` and consumer overrides (e.g. `[2s]`)\n\t\t\t\t\t\t// end up in the DOM. Since tw-animate-css utilities aren't currently deduped by\n\t\t\t\t\t\t// tailwind-merge, whichever class Tailwind happened to emit last wins,\n\t\t\t\t\t\t// which isn't reliable.\n\t\t\t\t\t\tindeterminateRotationSpeed ?? \"animation-duration-[15s]\",\n\t\t\t\t\t],\n\t\t\t\t\tclassName,\n\t\t\t\t)}\n\t\t\t\tdata-max={max}\n\t\t\t\tdata-min={0}\n\t\t\t\tdata-value={valueNow}\n\t\t\t\theight=\"100%\"\n\t\t\t\t// biome-ignore lint/a11y/noNoninteractiveElementToInteractiveRole: this is a radial progress bar, which is possible by SVG\n\t\t\t\trole=\"progressbar\"\n\t\t\t\twidth=\"100%\"\n\t\t\t\t{...props}\n\t\t\t>\n\t\t\t\t<circle\n\t\t\t\t\tclassName=\"[r:var(--radius)]\"\n\t\t\t\t\tcx=\"50%\"\n\t\t\t\t\tcy=\"50%\"\n\t\t\t\t\tfill=\"transparent\"\n\t\t\t\t\tstroke=\"currentColor\"\n\t\t\t\t\tstrokeWidth={strokeWidthPx}\n\t\t\t\t\tstyle={$cssProperties({ \"--radius\": radius })}\n\t\t\t\t/>\n\t\t\t\t{children}\n\t\t\t</svg>\n\t\t</ProgressContext.Provider>\n\t);\n};\nRoot.displayName = \"ProgressDonut\";\n\n/**\n * Length (value) of the progress indicator tail when the progress bar is indeterminate.\n */\nconst indeterminateTailPercent = 0.6;\n\ntype ProgressDonutIndicatorProps = Omit<ComponentProps<\"g\">, \"children\">;\n\n/**\n * The indicator for the circular progress bar.\n *\n * @see https://mantle.ngrok.com/components/progress#api-progress-donut-indicator\n *\n * @example\n * ```tsx\n * <ProgressDonut.Root value={60}>\n *   <ProgressDonut.Indicator />\n * </ProgressDonut.Root>\n *\n * <ProgressDonut.Root value={60}>\n *   <ProgressDonut.Indicator color=\"text-danger-600\" />\n * </ProgressDonut.Root>\n * ```\n */\nconst Indicator = ({ className, ...props }: ProgressDonutIndicatorProps) => {\n\tconst gradientId = useId();\n\tconst ctx = useContext(ProgressContext) ?? defaultContextValue;\n\tconst percentage =\n\t\t(ctx.value === \"indeterminate\" ? indeterminateTailPercent : ctx.value / ctx.max) * 100;\n\tconst strokeWidthPx = deriveStrokeWidthPx(ctx.strokeWidth);\n\tconst radius = calcRadius(strokeWidthPx);\n\n\treturn (\n\t\t<g data-slot=\"progress-donut-indicator\" className={cx(\"text-accent-600\", className)} {...props}>\n\t\t\t{ctx.value === \"indeterminate\" && (\n\t\t\t\t<defs>\n\t\t\t\t\t<linearGradient id={gradientId}>\n\t\t\t\t\t\t<stop className=\"stop-opacity-100 stop-color-current\" offset=\"0%\" />\n\t\t\t\t\t\t<stop className=\"stop-opacity-0 stop-color-current\" offset=\"95%\" />\n\t\t\t\t\t</linearGradient>\n\t\t\t\t</defs>\n\t\t\t)}\n\t\t\t<circle\n\t\t\t\tclassName={clsx(\n\t\t\t\t\t\"[r:var(--radius)]\", // set the circle radius to be the value of the calc'd CSS variable set on the style\n\t\t\t\t\t\"origin-center\",\n\t\t\t\t)}\n\t\t\t\tcx=\"50%\"\n\t\t\t\tcy=\"50%\"\n\t\t\t\tfill=\"transparent\"\n\t\t\t\tpathLength={100}\n\t\t\t\tstroke={ctx.value === \"indeterminate\" ? `url(#${gradientId})` : \"currentColor\"}\n\t\t\t\tstrokeDasharray={100}\n\t\t\t\tstrokeDashoffset={100 - percentage}\n\t\t\t\tstrokeLinecap=\"round\"\n\t\t\t\tstrokeWidth={strokeWidthPx}\n\t\t\t\tstyle={$cssProperties({ \"--radius\": radius })}\n\t\t\t\ttransform=\"rotate(-90)\" // rotate -90 degrees so it starts from the top\n\t\t\t/>\n\t\t</g>\n\t);\n};\nIndicator.displayName = \"ProgressDonutIndicator\";\n\n/**\n * A simple circular progress bar which shows the completion progress of a task.\n *\n * The indicator color is inherited via `currentColor`. Override the default\n * (`accent-600`) by setting the `ProgressDonut.Indicator`'s text color.\n *\n * @see https://mantle.ngrok.com/components/progress\n *\n * @example\n * Composition:\n * ```\n * ProgressDonut.Root\n * └── ProgressDonut.Indicator\n * ```\n *\n * @example\n * ```tsx\n * <ProgressDonut.Root value={60}>\n *   <ProgressDonut.Indicator />\n * </ProgressDonut.Root>\n *\n * <ProgressDonut.Root value={60}>\n *   <ProgressDonut.Indicator color=\"text-danger-600\" />\n * </ProgressDonut.Root>\n * ```\n */\nconst ProgressDonut = {\n\t/**\n\t * A simple circular progress bar which shows the completion progress of a task.\n\t *\n\t * The indicator color is inherited via `currentColor`. Override the default\n\t * (`accent-600`) by setting the `ProgressDonut.Indicator`'s text color.\n\t *\n\t * @see https://mantle.ngrok.com/components/progress#api-progress-donut-root\n\t *\n\t * @example\n\t * ```tsx\n\t * <ProgressDonut.Root value={60}>\n\t *   <ProgressDonut.Indicator />\n\t * </ProgressDonut.Root>\n\t *\n\t * <ProgressDonut.Root value={60}>\n\t *   <ProgressDonut.Indicator color=\"text-danger-600\" />\n\t * </ProgressDonut.Root>\n\t * ```\n\t */\n\tRoot,\n\t/**\n\t * The indicator for the circular progress bar.\n\t *\n\t * @see https://mantle.ngrok.com/components/progress#api-progress-donut-indicator\n\t *\n\t * @example\n\t * ```tsx\n\t * <ProgressDonut.Root value={60}>\n\t *   <ProgressDonut.Indicator />\n\t * </ProgressDonut.Root>\n\t *\n\t * <ProgressDonut.Root value={60}>\n\t *   <ProgressDonut.Indicator color=\"text-danger-600\" />\n\t * </ProgressDonut.Root>\n\t * ```\n\t */\n\tIndicator,\n} as const;\n\nexport {\n\t//,\n\tProgressDonut,\n};\n\n/**\n * Derive the stroke width in pixels as a number value or pixels/rem from a string value.\n * Note, this function clamps the stroke width to a minimum of 1 and max of 12 since\n * it is proportional to the viewbox size (0 0 32 32).\n *\n * @example\n * ```tsx\n * const strokeWidth1 = deriveStrokeWidthPx(8);\n * // Returns: 8\n *\n * const strokeWidth2 = deriveStrokeWidthPx(\"0.5rem\");\n * // Returns: 8 (0.5 * 16)\n *\n * const strokeWidth3 = deriveStrokeWidthPx(20);\n * // Returns: 12 (clamped to maximum)\n * ```\n */\nexport function deriveStrokeWidthPx(strokeWidth: number | string | undefined | null): number {\n\tlet value = 4;\n\tif (strokeWidth == null) {\n\t\treturn value;\n\t}\n\n\tif (typeof strokeWidth === \"number\") {\n\t\tvalue = strokeWidth;\n\t} else if (strokeWidth.endsWith(\"rem\")) {\n\t\tvalue = Number(strokeWidth.replace(\"rem\", \"\")) * 16;\n\t} else {\n\t\tvalue = Number(strokeWidth);\n\t}\n\n\tconst stroke = Number.isNaN(value) ? 4 : value;\n\treturn clamp(stroke, { min: 1, max: 12 });\n}\n\n/**\n * Calculate the radius of the progress donut and indicator based on the stroke\n * width in pixels.\n */\nfunction calcRadius(strokeWidthPx: number) {\n\treturn `calc(50% - ${strokeWidthPx / 2}px)` as const;\n}\n","\"use client\";\n\nimport * as ProgressPrimitive from \"@radix-ui/react-progress\";\n\nimport { type ComponentProps, createContext, useContext, useMemo } from \"react\";\nimport { cx } from \"../../utils/cx/cx.js\";\nimport { isNumber, isValidMaxNumber, isValidValueNumber } from \"./math.js\";\nimport type { ValueType } from \"./types.js\";\n\n/**\n * The default maximum value of the progress bar.\n */\nconst defaultMax = 100;\n\ntype ProgressContextValue = {\n\tmax: number;\n\tvalue: ValueType;\n};\n\nconst defaultContextValue = {\n\tmax: defaultMax,\n\tvalue: 0,\n} as const satisfies ProgressContextValue;\n\nconst ProgressContext = createContext<ProgressContextValue>(defaultContextValue);\n\ntype RootProps = ComponentProps<\"div\"> & {\n\t/**\n\t * The maximum value of the progress bar.\n\t * This attribute describes how much work the task indicated by the progress element requires.\n\t * The max attribute, if present, must have a value greater than 0. The default value is 100.\n\t *\n\t * @default 100\n\t */\n\tmax?: number | undefined;\n\t/**\n\t * The current value of the progress bar.\n\t * This attribute specifies how much of the task that has been completed.\n\t * It must be a valid floating point number between 0 and max, or between 0 and 100 if max is omitted.\n\t * If set to `\"indeterminate\"`, the progress bar is considered indeterminate. (for now there is no visual difference than 0)\n\t *\n\t * @default 0\n\t */\n\tvalue?: ValueType | undefined;\n};\n\n/**\n * Displays an indicator showing the completion progress of a task, typically displayed as a progress bar.\n *\n * A horizontal progress bar that shows the completion progress of a task.\n * Use this component for linear progress indication.\n *\n * @see https://mantle.ngrok.com/components/progress#api-progress-bar\n *\n * @example\n * ```tsx\n * <ProgressBar.Root value={60}>\n *   <ProgressBar.Indicator />\n * </ProgressBar.Root>\n *\n * <ProgressBar.Root value={75} max={100}>\n *   <ProgressBar.Indicator />\n * </ProgressBar.Root>\n *\n * // Indeterminate progress\n * <ProgressBar.Root value=\"indeterminate\">\n *   <ProgressBar.Indicator />\n * </ProgressBar.Root>\n * ```\n */\nfunction Root({ className, children, max: _max = defaultMax, value: _value, ...props }: RootProps) {\n\tconst max = isValidMaxNumber(_max) ? _max : defaultMax;\n\tconst value = (\n\t\tisValidValueNumber(_value, max) ? _value : _value == null ? 0 : \"indeterminate\"\n\t) satisfies ValueType;\n\n\tconst valueNow = isNumber(value) ? value : undefined;\n\n\tconst ctx: ProgressContextValue = useMemo(\n\t\t() => ({\n\t\t\tmax,\n\t\t\tvalue,\n\t\t}),\n\t\t[max, value],\n\t);\n\n\treturn (\n\t\t<ProgressContext.Provider value={ctx}>\n\t\t\t<ProgressPrimitive.Root\n\t\t\t\tdata-slot=\"progress-bar\"\n\t\t\t\tclassName={cx(\n\t\t\t\t\t\"bg-base-hover dark:bg-base shadow-inner relative h-3 w-full overflow-hidden rounded-md\",\n\t\t\t\t\tclassName,\n\t\t\t\t)}\n\t\t\t\tvalue={valueNow}\n\t\t\t\tmax={max}\n\t\t\t\t{...props}\n\t\t\t>\n\t\t\t\t{children}\n\t\t\t</ProgressPrimitive.Root>\n\t\t</ProgressContext.Provider>\n\t);\n}\nRoot.displayName = \"Root\";\n\ntype IndicatorProps = ComponentProps<typeof ProgressPrimitive.Indicator>;\n\n/**\n * Displays the progress indicator, which visually represents the completion progress of a task.\n *\n * The visual indicator that shows the actual progress within the progress bar.\n * This component should be used inside a ProgressBar.Root component.\n *\n * @see https://mantle.ngrok.com/components/progress#api-progress-bar-indicator\n *\n * @example\n * ```tsx\n * <ProgressBar.Root value={60}>\n *   <ProgressBar.Indicator />\n * </ProgressBar.Root>\n *\n * // Custom styled indicator\n * <ProgressBar.Root value={60}>\n *   <ProgressBar.Indicator className=\"bg-success-600\" />\n * </ProgressBar.Root>\n * ```\n */\nfunction Indicator({ className, style, ...props }: IndicatorProps) {\n\tconst ctx = useContext(ProgressContext);\n\tconst { max } = ctx;\n\tconst value = ctx.value === \"indeterminate\" ? 0 : ctx.value;\n\tconst translatePercent = ((max - value) / max) * 100;\n\n\treturn (\n\t\t<ProgressPrimitive.Indicator\n\t\t\tdata-slot=\"progress-bar-indicator\"\n\t\t\tclassName={cx(\"bg-accent-600 h-full w-full flex-1 transition-all\", className)}\n\t\t\tstyle={{ ...style, transform: `translateX(-${translatePercent}%)` }}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\nIndicator.displayName = \"Indicator\";\n\n/**\n * Displays an indicator showing the completion progress of a task, typically displayed as a progress bar.\n *\n * A horizontal progress bar that shows the completion progress of a task.\n * Use this component for linear progress indication.\n *\n * @see https://mantle.ngrok.com/components/progress\n *\n * @example\n * Composition:\n * ```\n * ProgressBar.Root\n * └── ProgressBar.Indicator\n * ```\n *\n * @example\n * ```tsx\n * <ProgressBar.Root value={60}>\n *   <ProgressBar.Indicator />\n * </ProgressBar.Root>\n *\n * <ProgressBar.Root value={75} max={100}>\n *   <ProgressBar.Indicator />\n * </ProgressBar.Root>\n *\n * // Indeterminate progress\n * <ProgressBar.Root value=\"indeterminate\">\n *   <ProgressBar.Indicator />\n * </ProgressBar.Root>\n * ```\n */\nconst ProgressBar = {\n\t/**\n\t * Displays an indicator showing the completion progress of a task, typically displayed as a progress bar.\n\t *\n\t * A horizontal progress bar that shows the completion progress of a task.\n\t * Use this component for linear progress indication.\n\t *\n\t * @see https://mantle.ngrok.com/components/progress#api-progress-bar\n\t *\n\t * @example\n\t * ```tsx\n\t * <ProgressBar.Root value={60}>\n\t *   <ProgressBar.Indicator />\n\t * </ProgressBar.Root>\n\t *\n\t * <ProgressBar.Root value={75} max={100}>\n\t *   <ProgressBar.Indicator />\n\t * </ProgressBar.Root>\n\t *\n\t * // Indeterminate progress\n\t * <ProgressBar.Root value=\"indeterminate\">\n\t *   <ProgressBar.Indicator />\n\t * </ProgressBar.Root>\n\t * ```\n\t */\n\tRoot,\n\t/**\n\t * Displays the progress indicator, which visually represents the completion progress of a task.\n\t *\n\t * The visual indicator that shows the actual progress within the progress bar.\n\t * This component should be used inside a ProgressBar.Root component.\n\t *\n\t * @see https://mantle.ngrok.com/components/progress#api-progress-bar-indicator\n\t *\n\t * @example\n\t * ```tsx\n\t * <ProgressBar.Root value={60}>\n\t *   <ProgressBar.Indicator />\n\t * </ProgressBar.Root>\n\t *\n\t * // Custom styled indicator\n\t * <ProgressBar.Root value={60}>\n\t *   <ProgressBar.Indicator className=\"bg-success-600\" />\n\t * </ProgressBar.Root>\n\t * ```\n\t */\n\tIndicator,\n} as const;\n\nexport {\n\t//,\n\tProgressBar,\n};\n"],"mappings":"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"}

package/dist/resolve-pre-rendered-props-Bqg41IkV.js

@@ -0,0 +1,13 @@
+import{t as e}from"./cx-D1HYnpvA.js";import{t}from"./booleanish-CBGdPL3Q.js";const n=new Set([`bash`,`sh`,`shell`]);function r(e,t){return!(n.has(e)&&!t.trim().includes(`
+`))}const i=Symbol(`MantleCodeBlockValue`);function a({preHtml:e,preValToken:t,preVals:n,highlightLines:r,lineNumberStart:a,showLineNumbers:o,code:s,language:c}){return{[i]:!0,language:c,code:s,"~preHtml":e,"~preValToken":t,"~preVals":n,"~highlightLines":r,"~lineNumberStart":a,"~showLineNumbers":o}}function o(e,t){let n=``;for(let r=0;r<e.length;r+=1)n+=e[r]??``,r<t.length&&(n+=String(t[r]));return n}function s(e,t={}){let{showLineNumbers:n,highlightLines:i,lineNumberStart:s}=t;return(t,...c)=>{let l=o(t,c);return a({language:e,code:l,preHtml:void 0,preVals:c.length>0?c:void 0,highlightLines:i,lineNumberStart:s,showLineNumbers:n??r(e,l)})}}function c(...e){let t=new Set;for(let n of e)if(typeof n==`number`){if(!l(n))continue;let e=Math.floor(n);t.add(e)}else{let e=n.indexOf(`-`),r=n.slice(0,e),i=n.slice(e+1),a=Number.parseInt(r,10),o=Number.parseInt(i,10);if(!l(a)||!l(o)||(a>o&&([a,o]=[o,a]),o-a+1>1e3))continue;for(let e=a;e<=o;e++)t.add(e)}return t}const l=e=>e!=null&&!Number.isNaN(e)&&e>0&&Number.isFinite(e);function u(e){let t=e.length;for(;t>0&&(e.charCodeAt(t-1)===10||e.charCodeAt(t-1)===13);)--t;return t===e.length?e:e.slice(0,t)}function d(e){let t=u(e).replaceAll(`\r
+`,`
+`).replaceAll(`\r`,`
+`).split(`
+`);for(let e=0;e<t.length;e++){let n=t[e]??``;n.startsWith(`<span class="line">`)&&n.endsWith(`</span>`)&&(t[e]=n.slice(19,n.length-7))}return t}function f(e){return encodeURIComponent(e)}function p({foldableRanges:t,highlightLines:n,html:r,lineNumberStart:i=1,showLineNumbers:a=!1}){let o=c(...n??[]),s=d(r),l=new Map,u=new Map,p=t!=null&&t.length>0;if(p&&t!=null)for(let e of t){let t=f(e.id);l.set(e.startLine,t);for(let n=e.startLine+1;n<e.endLine;n+=1){let e=u.get(n);e??(e=[],u.set(n,e)),e.push(t)}}let m=``;for(let t=0;t<s.length;t++){let n=s[t]??``,r=t+1,c=i+t,d=e(`mantle-code-line`,o.has(c)&&`mantle-code-line-highlighted`),f=a?`<span class="mantle-code-line-number" data-slot="line-number">${c}</span>`:``,h=``,g=``,_=``;if(p){let e=l.get(r);e!=null&&(h=`<button type="button" class="mantle-code-fold-toggle" data-slot="fold-toggle" data-fold-line="${e}" aria-expanded="true" aria-label="Toggle code folding"><svg class="mantle-code-fold-caret" viewBox="0 0 16 16" aria-hidden="true" focusable="false"><path fill="currentColor" fill-rule="evenodd" d="M3.22 5.97a.75.75 0 0 1 1.06 0L8 9.69l3.72-3.72a.75.75 0 1 1 1.06 1.06l-4.25 4.25a.75.75 0 0 1-1.06 0L3.22 7.03a.75.75 0 0 1 0-1.06Z"/></svg></button>`,_=`<span class="mantle-code-fold-ellipsis" data-slot="fold-ellipsis" aria-hidden="true">⋯</span>`);let t=u.get(r);t!=null&&t.length>0&&(g=` data-fold-regions="${t.join(` `)}"`)}let v=`<span class="mantle-code-line-content" data-slot="line-content">${n===``?` `:n}${_}</span>`;m+=`<span class="${d}" data-line-number="${c}"${g}>${f}${h}${v}</span>`}return m}function m(e){if(e.length<=1)return e;e.sort((e,t)=>e.startLine===t.startLine?t.endLine-e.endLine:e.startLine-t.startLine);let t=[],n=-1;for(let r of e)r.startLine!==n&&(t.push(r),n=r.startLine);return t}function h(e){let t=e.length;if(t===0)return[];let n=[],r=[],i=1,a=0;for(;a<t;){let o=e.charCodeAt(a);if(o===10){i+=1,a+=1;continue}if(o===13){i+=1,a+=1,a<t&&e.charCodeAt(a)===10&&(a+=1);continue}if(o===34){for(a+=1;a<t;){let t=e.charCodeAt(a);if(t===92){a+=2;continue}if(t===34){a+=1;break}if(t===10||t===13)break;a+=1}continue}if(o===123||o===91){n.push({opener:o,line:i}),a+=1;continue}if(o===125||o===93){let e=o===125?123:91,t=n[n.length-1];t?.opener===e?(n.pop(),t.line!==i&&r.push({id:String(t.line),startLine:t.line,endLine:i})):t!=null&&(n.length=0),a+=1;continue}a+=1}return m(r)}function g(e){switch(e){case`python`:case`py`:case`yaml`:case`yml`:return`indentation`;case`html`:case`xml`:return`tag`;case`bash`:case`sh`:case`shell`:case`plain`:case`plaintext`:case`text`:case`txt`:return`none`;default:return`bracket`}}function _({language:e,tokens:t}){switch(g(e)){case`bracket`:return S(t);case`indentation`:return w(t);case`tag`:return ee(t);case`none`:return[]}}function v(e){if(e.length===0)return!1;let t=e[e.length-1]?.scopeName??``;return t===`string`||t===`comment`||t.startsWith(`string.`)||t.startsWith(`comment.`)||t.startsWith(`constant.character.escape`)}function y(e){return e.explanation!=null&&e.explanation.length>0?e.explanation:[{content:e.content,scopes:[]}]}function b(e){let t=``;for(let n of e){let e=y(n),r=!1;for(let t of e)if(v(t.scopes)){r=!0;break}if(!r){t+=n.content;continue}for(let n of e)v(n.scopes)||(t+=n.content)}return t}function x(e){if(e==null||e.length===0)return-1;let t=0;for(let n of e){let e=n.content;for(let n=0;n<e.length;n+=1){let r=e.charCodeAt(n);if(r===32||r===9){t+=1;continue}return t}}return-1}function S(e){let t=[],n=[];for(let r=0;r<e.length;r+=1){let i=e[r];if(i==null)continue;let a=r+1;for(let e of i)if(C(e.content))for(let r of y(e)){if(v(r.scopes))continue;let e=r.content;for(let r=0;r<e.length;r+=1){let i=e.charCodeAt(r);if(i===123||i===91)t.push(a);else if(i===125||i===93){let e=t.pop();e!=null&&e!==a&&n.push({id:String(e),startLine:e,endLine:a})}}}}return m(n)}function C(e){for(let t=0;t<e.length;t+=1){let n=e.charCodeAt(t);if(n===123||n===125||n===91||n===93)return!0}return!1}function w(e){let t=Array(e.length);for(let n=0;n<e.length;n+=1)t[n]=x(e[n]);let n=[];for(let e=0;e<t.length;e+=1){let r=t[e]??-1;if(r<0)continue;let i=-1,a=e+1;for(;a<t.length;){let e=t[a]??-1;if(e<0){a+=1;continue}if(e>r){i=a,a+=1;continue}break}i>e&&n.push({id:String(e+1),startLine:e+1,endLine:i+2})}return m(n)}function ee(e){let t=[],n=[];for(let r=0;r<e.length;r+=1){let i=e[r];if(i==null)continue;let a=r+1,o=E(b(i));for(let e of o)if(e.kind===`open`)t.push({name:e.name,line:a});else{let r=t.length>0?t[t.length-1]:void 0;r!=null&&r.name.toLowerCase()===e.name.toLowerCase()&&(t.pop(),r.line!==a&&n.push({id:String(r.line),startLine:r.line,endLine:a}))}}return m(n)}const T=new Set([`area`,`base`,`br`,`col`,`embed`,`hr`,`img`,`input`,`link`,`meta`,`param`,`source`,`track`,`wbr`]);function E(e){let t=[],n=0;for(;n<e.length;){let r=e.indexOf(`<`,n);if(r===-1)break;let i=O(e,r+1),a=e.charCodeAt(i)===47;if(a&&(i=O(e,i+1)),!k(e.charCodeAt(i))){n=r+1;continue}let o=i;for(i+=1;i<e.length&&A(e.charCodeAt(i));)i+=1;let s=e.slice(o,i),c=j(e,i);if(c===-1){n=r+1;continue}if(a){t.push({name:s,kind:`close`}),n=c+1;continue}if(te(e,c)||T.has(s.toLowerCase())){n=c+1;continue}t.push({name:s,kind:`open`}),n=c+1}return t}function D(e){return e===9||e===10||e===11||e===12||e===13||e===32}function O(e,t){let n=t;for(;n<e.length&&D(e.charCodeAt(n));)n+=1;return n}function k(e){return e>=65&&e<=90||e>=97&&e<=122}function A(e){return k(e)||e>=48&&e<=57||e===45||e===58||e===95}function j(e,t){let n;for(let r=t;r<e.length;r+=1){let t=e.charCodeAt(r);if(n!=null){t===n&&(n=void 0);continue}if(t===34||t===39){n=t;continue}if(t===62)return r}return-1}function te(e,t){let n=t-1;for(;n>=0&&D(e.charCodeAt(n));)--n;return n>=0&&e.charCodeAt(n)===47}const ne=[`tabs`,`spaces`];function M(e){return ne.includes(e)}function N(e,t){return t||(I(e)?`tabs`:(L(e),`spaces`))}const P=new Set([`csharp`,`css`,`go`,`html`,`java`,`javascript`,`js`,`jsx`,`ts`,`tsx`,`typescript`,`xml`]),F=new Set([`python`,`py`,`yaml`,`yml`,`ruby`,`rb`]);function I(e){return P.has(e)}function L(e){return F.has(e)}function R(e,t){let n=t?.indentation??`spaces`,r=e.replace(/\r\n?/g,`
+`),i=r.trim();if(i===``)return``;let a=V(r),o=i.split(`
+`),s=Array(o.length);for(let e=0;e<o.length;e++){let t=o[e];t!=null&&(s[e]=z(B(t)?t:t.slice(a),n))}return s.join(`
+`)}function z(e,t){let n=0;for(;n<e.length;){let t=e[n];if(t!==` `&&t!==`	`)break;n+=1}if(n===0||n===e.length)return e;let r=e.slice(0,n);return(t===`spaces`?r.replace(/\t/g,`  `):r.replace(/ {2}/g,`	`))+e.slice(n)}function B(e){let t=e[0];return t!=null&&t!==` `&&t!==`	`}function V(e){let t=1/0,n=0,r=!0;for(let i=0;i<e.length;i++){let a=e[i];if(r){if(a===` `||a===`	`){n+=1;continue}if(a===`
+`||a===`\r`){n=0;continue}if(n<t&&(t=n,t===0))return 0;r=!1;continue}(a===`
+`||a===`\r`)&&(r=!0,n=0)}return t===1/0?0:t}const H=`bash.cs.csharp.css.go.html.java.javascript.js.json.jsx.plain.plaintext.py.python.rb.ruby.rust.sh.shell.text.ts.tsx.txt.typescript.xml.yaml.yml`.split(`.`),U=new Set(H),W=`text`;function G(e){let t=e?.trim()??``;if(!t)return W;let n=t.indexOf(`-`),r=n===-1?t:t.slice(n+1);return K(r)?r:W}const K=e=>typeof e==`string`&&U.has(e);function q(e){if(typeof e==`boolean`)return e;if(typeof e==`string`){if(e===`true`)return!0;if(e===`false`)return!1}}function J(e){if(typeof e==`number`&&Number.isFinite(e)&&e>0)return Math.floor(e);if(typeof e==`string`&&/^\d+$/.test(e)){let t=Number.parseInt(e,10);return t>0?t:void 0}}function Y(e){let t=e=>{if(typeof e==`number`)return Number.isFinite(e)&&e>0?Math.floor(e):void 0;if(typeof e==`string`){let t=e.trim();if(/^\d+$/.test(t)){let e=Number.parseInt(t,10);return e>0?e:void 0}if(/^\d+-\d+$/.test(t)){let[e,n]=t.split(`-`);return Number.parseInt(e??``,10)>0&&Number.parseInt(n??``,10)>0?t:void 0}}};if(typeof e==`string`){let n=[],r=e.split(`,`);for(let e of r){let r=t(e);r!=null&&n.push(r)}return n.length>0?n:void 0}if(!Array.isArray(e))return;let n=[];for(let r of e){let e=t(r);e!=null&&n.push(e)}return n.length>0?n:void 0}const X={collapsible:!1,disableCopy:!1,indentation:void 0,mode:void 0,title:void 0};function re(e){let t=e?.trim()??``;if(!t)return X;let n={},r=Q(t);for(let e of r){let t=e.indexOf(`=`),r=t===-1?e:e.slice(0,t),i=t===-1?void 0:e.slice(t+1);r&&(n[r]=Z(i)??!0)}return ae(n)}function Z(e){if(e==null)return;let t=e.trim(),n=t.length-1;return n>=1&&t.charCodeAt(0)===34&&t.charCodeAt(n)===34?t.slice(1,n):t}function Q(e){let t=e?.trim()??``,n=[],r=``,i=!1;for(let e=0;e<t.length;e++){let a=t[e]??``;!i&&ie(a)?r&&=(n.push(r),``):(a===`"`&&(i=!i),r+=a)}return r&&n.push(r),n}function ie(e){return e===` `||e===`	`||e===`
+`||e===`\r`}function $(e){return e===`cli`||e===`file`||e===`traffic-policy`}function ae(e){let{collapsible:n=X.collapsible,disableCopy:r=X.disableCopy,indentation:i=X.indentation,mode:a=X.mode,title:o=X.title}=e;return{collapsible:typeof n==`string`||typeof n==`boolean`?t(n):X.collapsible,disableCopy:typeof r==`string`||typeof r==`boolean`?t(r):X.disableCopy,indentation:M(i)?i:X.indentation,mode:$(a)?a:X.mode,title:typeof o==`string`?o.trim():X.title}}function oe(e){let{collapsible:n,disableCopy:r,mantleCode:i,mantleCollapsible:a,mantleDisableCopy:o,mantleHighlightLines:s,mantleLanguage:c,mantleLineNumberStart:l,mantleMode:u,mantlePreHtml:d,mantleShowLineNumbers:f,mantleTitle:p,mode:m,title:h,...g}=e;return c!=null||i!=null||d!=null||f!=null||s!=null||l!=null||a!=null||o!=null||u!=null||p!=null?{mantleCode:{code:typeof i==`string`?i:void 0,collapsible:(typeof a==`string`||typeof a==`boolean`?t(a):void 0)??(typeof n==`string`||typeof n==`boolean`?t(n):void 0),disableCopy:typeof o==`string`||typeof o==`boolean`?t(o):typeof r==`string`||typeof r==`boolean`?t(r):void 0,highlightLines:Y(s),language:typeof c==`string`&&K(c)?c:void 0,lineNumberStart:J(l),mode:$(u)?u:$(m)?m:void 0,preHtml:typeof d==`string`?d:void 0,rawLanguage:c,showLineNumbers:q(f),title:typeof p==`string`?p.trim():typeof h==`string`?h.trim():void 0},props:g}:{mantleCode:void 0,props:g}}export{s as S,h as _,Q as a,a as b,q as c,H as d,R as f,g,_ as h,oe as i,K as l,M as m,Z as n,Y as o,N as p,re as r,J as s,X as t,G as u,m as v,r as x,p as y};
+//# sourceMappingURL=resolve-pre-rendered-props-Bqg41IkV.js.map