@ngrok/mantle 0.76.11 → 0.78.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (194) hide show
  1. package/dist/accordion.d.ts +63 -21
  2. package/dist/accordion.js +1 -1
  3. package/dist/agent.json +7 -1
  4. package/dist/alert-dialog.d.ts +19 -26
  5. package/dist/alert-dialog.js +1 -1
  6. package/dist/alert.d.ts +16 -24
  7. package/dist/alert.js +1 -1
  8. package/dist/{anchor-BtgEJoPN.js → anchor-C_tjSVy6.js} +1 -1
  9. package/dist/anchor.d.ts +3 -4
  10. package/dist/anchor.js +1 -1
  11. package/dist/{as-child-uN_018tj.d.ts → as-child-CYEVu1WY.d.ts} +0 -7
  12. package/dist/badge.d.ts +5 -56
  13. package/dist/badge.js +1 -1
  14. package/dist/breadcrumb.d.ts +212 -0
  15. package/dist/breadcrumb.js +1 -0
  16. package/dist/browser-only-CPH56Xw_.js +1 -0
  17. package/dist/browser-only.d.ts +2 -6
  18. package/dist/browser-only.js +1 -1
  19. package/dist/{button-CERx95KE.js → button-5t6-JS_I.js} +1 -1
  20. package/dist/button-AS5Ir3DE.js +1 -0
  21. package/dist/{button-mfYak6Rx.d.ts → button-Bw9MpShl.d.ts} +26 -8
  22. package/dist/button.d.ts +5 -4
  23. package/dist/button.js +1 -1
  24. package/dist/calendar.d.ts +2 -8
  25. package/dist/calendar.js +1 -1
  26. package/dist/card.d.ts +8 -8
  27. package/dist/card.js +1 -1
  28. package/dist/centered-layout.d.ts +147 -0
  29. package/dist/centered-layout.js +1 -0
  30. package/dist/checkbox-DJ2xl7Rc.js +1 -0
  31. package/dist/checkbox.d.ts +11 -9
  32. package/dist/checkbox.js +1 -1
  33. package/dist/choice-DOdyNzFC.js +1 -0
  34. package/dist/choice.d.ts +253 -0
  35. package/dist/choice.js +1 -0
  36. package/dist/code-block.d.ts +5 -17
  37. package/dist/code-block.js +1 -1
  38. package/dist/code-block_highlight-utils.d.ts +1 -1
  39. package/dist/code-block_highlight-utils.js +1 -1
  40. package/dist/code.d.ts +4 -5
  41. package/dist/code.js +1 -1
  42. package/dist/combobox.d.ts +40 -19
  43. package/dist/combobox.js +1 -1
  44. package/dist/command.d.ts +60 -38
  45. package/dist/command.js +1 -1
  46. package/dist/{copy-to-clipboard-Baw30q9O.js → copy-to-clipboard-BsCQ9m6K.js} +1 -1
  47. package/dist/cx-IiQEAKf5.js +1 -0
  48. package/dist/cx.js +1 -1
  49. package/dist/data-slot-CChfb_cv.d.ts +17 -0
  50. package/dist/data-table.d.ts +45 -131
  51. package/dist/data-table.js +1 -1
  52. package/dist/description-list.d.ts +7 -7
  53. package/dist/description-list.js +1 -1
  54. package/dist/{dialog-Cp0S2jsG.js → dialog-DVDFVT_-.js} +1 -1
  55. package/dist/dialog.d.ts +155 -48
  56. package/dist/dialog.js +1 -1
  57. package/dist/{direction-CcTY0FmA.d.ts → direction-BjU0bPST.d.ts} +1 -1
  58. package/dist/{dropdown-menu-OEuW4GLp.js → dropdown-menu-ByUQkAvJ.js} +1 -1
  59. package/dist/{dropdown-menu-CADgs9gz.d.ts → dropdown-menu-DT30TQzL.d.ts} +21 -24
  60. package/dist/dropdown-menu.d.ts +2 -1
  61. package/dist/dropdown-menu.js +1 -1
  62. package/dist/empty.d.ts +133 -53
  63. package/dist/empty.js +1 -1
  64. package/dist/{field-context-4k1kI7Bo.js → field-context-BR01g789.js} +1 -1
  65. package/dist/field.d.ts +24 -36
  66. package/dist/field.js +1 -1
  67. package/dist/flag.d.ts +2 -9
  68. package/dist/flag.js +1 -1
  69. package/dist/hooks.d.ts +139 -81
  70. package/dist/hooks.js +1 -1
  71. package/dist/hover-card.d.ts +34 -14
  72. package/dist/hover-card.js +1 -1
  73. package/dist/icon-CDtYjF_H.js +1 -0
  74. package/dist/{icon-n49kOh4_.d.ts → icon-Cevjo93X.d.ts} +2 -3
  75. package/dist/{icon-button-DiX9iZ9n.js → icon-button-CxVsZ2N1.js} +1 -1
  76. package/dist/{icon-button-D7hs6bX2.d.ts → icon-button-DuRSCsPh.d.ts} +5 -6
  77. package/dist/icon.d.ts +3 -3
  78. package/dist/icon.js +1 -1
  79. package/dist/icons.d.ts +7 -19
  80. package/dist/icons.js +1 -1
  81. package/dist/{in-view-BC3wmz-a.d.ts → in-view-nkSOdED2.d.ts} +21 -10
  82. package/dist/index-BnI3OppC.d.ts +1 -0
  83. package/dist/{index-CTU6apE6.d.ts → index-CDwfBOAA.d.ts} +5 -4
  84. package/dist/{index-Bed_XLWa.d.ts → index-D47aqlpz.d.ts} +3 -2
  85. package/dist/index-Rv8RL7xy.d.ts +25 -0
  86. package/dist/input-Ct1YOqSy.js +1 -0
  87. package/dist/input.d.ts +10 -56
  88. package/dist/input.js +1 -1
  89. package/dist/{kbd-D6k4Dnrf.js → kbd-K8iaZ-Ti.js} +1 -1
  90. package/dist/kbd.d.ts +3 -8
  91. package/dist/kbd.js +1 -1
  92. package/dist/{label-BLXfnQmn.js → label-BMlHW_2D.js} +1 -1
  93. package/dist/label-v2-bv98k.d.ts +69 -0
  94. package/dist/label.d.ts +1 -68
  95. package/dist/label.js +1 -1
  96. package/dist/list.d.ts +295 -0
  97. package/dist/list.js +1 -0
  98. package/dist/llms.txt +7 -1
  99. package/dist/main.d.ts +4 -27
  100. package/dist/main.js +1 -1
  101. package/dist/mantle.css +6 -6
  102. package/dist/media-object.d.ts +6 -7
  103. package/dist/media-object.js +1 -1
  104. package/dist/multi-select.d.ts +80 -33
  105. package/dist/multi-select.js +1 -1
  106. package/dist/otp-input.d.ts +7 -8
  107. package/dist/otp-input.js +1 -1
  108. package/dist/pagination.d.ts +11 -22
  109. package/dist/pagination.js +1 -1
  110. package/dist/{popover-Bq52EC7X.js → popover-D5WxxnBY.js} +1 -1
  111. package/dist/popover.d.ts +6 -7
  112. package/dist/popover.js +1 -1
  113. package/dist/{primitive-FoWela9a.d.ts → primitive-C64-m48O.d.ts} +0 -1
  114. package/dist/{primitive-BFUir4UB.js → primitive-wm7Wk-gy.js} +1 -1
  115. package/dist/progress.d.ts +55 -46
  116. package/dist/progress.js +1 -1
  117. package/dist/qr-code.d.ts +10 -9
  118. package/dist/qr-code.js +1 -1
  119. package/dist/radio-group.d.ts +71 -60
  120. package/dist/radio-group.js +1 -1
  121. package/dist/{resolve-pre-rendered-props-DxJ9-DAl.d.ts → resolve-pre-rendered-props-B6OlZrSI.d.ts} +13 -26
  122. package/dist/{resolve-pre-rendered-props-DwIF_M_K.js → resolve-pre-rendered-props-C3e5Auo3.js} +1 -1
  123. package/dist/sandboxed-on-click.d.ts +4 -8
  124. package/dist/sandboxed-on-click.js +1 -1
  125. package/dist/{select-BUGOJMER.d.ts → select-Bwt2YduR.d.ts} +11 -12
  126. package/dist/{select-xfyY5Vt1.js → select-D-5u0Blc.js} +1 -1
  127. package/dist/select.d.ts +1 -1
  128. package/dist/select.js +1 -1
  129. package/dist/selectable-list.d.ts +725 -0
  130. package/dist/selectable-list.js +1 -0
  131. package/dist/{separator-CqohKk4z.js → separator-kBnnv3Cw.js} +1 -1
  132. package/dist/separator.d.ts +6 -37
  133. package/dist/separator.js +1 -1
  134. package/dist/sheet.d.ts +231 -47
  135. package/dist/sheet.js +1 -1
  136. package/dist/sizes-Dje_rwKc.d.ts +29 -0
  137. package/dist/skeleton-Bu3tgNcW.js +1 -0
  138. package/dist/skeleton.d.ts +2 -2
  139. package/dist/skeleton.js +1 -1
  140. package/dist/skip-to-main-link.d.ts +4 -34
  141. package/dist/skip-to-main-link.js +1 -1
  142. package/dist/slider.d.ts +2 -21
  143. package/dist/slider.js +1 -1
  144. package/dist/slot-DmPrjM7N.js +1 -0
  145. package/dist/slot.d.ts +1 -1
  146. package/dist/slot.js +1 -1
  147. package/dist/split-button.d.ts +20 -12
  148. package/dist/split-button.js +1 -1
  149. package/dist/{svg-only-f6ToFLH0.d.ts → svg-only-BFeFS1aa.d.ts} +2 -3
  150. package/dist/{svg-only-CSOaF1tL.js → svg-only-DDx6FtJd.js} +1 -1
  151. package/dist/switch.d.ts +6 -3
  152. package/dist/switch.js +1 -1
  153. package/dist/{table-CAitdL78.js → table-CPH2md2-.js} +1 -1
  154. package/dist/{table-BWD9IlIN.d.ts → table-CwFHXC-G.d.ts} +10 -10
  155. package/dist/table.d.ts +1 -1
  156. package/dist/table.js +1 -1
  157. package/dist/tabs.d.ts +29 -15
  158. package/dist/tabs.js +1 -1
  159. package/dist/text-area.d.ts +2 -3
  160. package/dist/text-area.js +1 -1
  161. package/dist/theme-D8kZCOzM.js +1 -0
  162. package/dist/theme-provider-Djj_jBo6.js +1 -0
  163. package/dist/theme-switcher.d.ts +45 -0
  164. package/dist/theme-switcher.js +1 -0
  165. package/dist/theme.d.ts +15 -101
  166. package/dist/theme.js +1 -1
  167. package/dist/{toast-Bwno5LUs.js → toast-RkhbliFh.js} +1 -1
  168. package/dist/toast.d.ts +13 -37
  169. package/dist/toast.js +1 -1
  170. package/dist/tooltip.d.ts +10 -44
  171. package/dist/tooltip.js +1 -1
  172. package/dist/types-C19IR7jf.d.ts +48 -0
  173. package/dist/{types-BvUzforF.d.ts → types-D1RY5Tcj.d.ts} +0 -1
  174. package/dist/types.d.ts +3 -3
  175. package/dist/use-copy-to-clipboard-DqQ0_N3E.js +1 -0
  176. package/dist/use-prefers-reduced-motion-CagaNRgm.js +1 -0
  177. package/dist/utils.d.ts +2 -3
  178. package/dist/utils.js +1 -1
  179. package/dist/{validation-xyX_6kph.d.ts → validation-7QeiTFwl.d.ts} +3 -12
  180. package/dist/{validation-DCyx-ceH.js → validation-Bpptk_9t.js} +1 -1
  181. package/dist/virtual-DZMBu7Ch.js +1 -0
  182. package/dist/well.d.ts +3 -3
  183. package/dist/well.js +1 -1
  184. package/dist/{with-style-props-CyImx7vd.d.ts → with-style-props-Dq5Vntqy.d.ts} +0 -1
  185. package/package.json +79 -344
  186. package/dist/browser-only-BSl_hruR.js +0 -1
  187. package/dist/button-C9GW9nAr.js +0 -1
  188. package/dist/cx-C1UYP5We.js +0 -1
  189. package/dist/icon-SUx16Sl3.js +0 -1
  190. package/dist/index-CJbKEKr2.d.ts +0 -20
  191. package/dist/slot-DT_E5BQx.js +0 -1
  192. package/dist/theme-provider-BNFS3Acf.js +0 -1
  193. package/dist/use-copy-to-clipboard-BLpquU9d.js +0 -1
  194. package/dist/use-prefers-reduced-motion-CWIoFA6W.js +0 -1
@@ -1,12 +1,15 @@
1
- import { o as WithValidation } from "./validation-xyX_6kph.js";
2
-
1
+ import { o as WithValidation } from "./validation-7QeiTFwl.js";
3
2
  //#region src/components/checkbox/checkbox.d.ts
4
3
  type CheckedState = boolean | "indeterminate";
5
4
  /**
6
5
  * A form control that allows the user to toggle between checked and not checked.
7
6
  * Supports indeterminate state.
8
7
  *
9
- * @see https://mantle.ngrok.com/components/checkbox
8
+ * Pair it with a [`Label`](/components/forms/label) for a single-line caption, or
9
+ * compose it inside [`Choice`](/components/forms/choice) for a titled, multi-line
10
+ * label with a supplementary description.
11
+ *
12
+ * @see https://mantle.ngrok.com/components/forms/checkbox
10
13
  *
11
14
  * @example
12
15
  * ```tsx
@@ -18,7 +21,7 @@ type CheckedState = boolean | "indeterminate";
18
21
  * </form>
19
22
  * ```
20
23
  */
21
- declare const Checkbox: import("react").ForwardRefExoticComponent<Omit<Omit<import("react").DetailedHTMLProps<import("react").InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "ref">, "defaultChecked" | "checked" | "type"> & WithValidation & {
24
+ declare const Checkbox: import("react").ForwardRefExoticComponent<Omit<Omit<import("react").DetailedHTMLProps<import("react").InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "ref">, "checked" | "defaultChecked" | "type"> & WithValidation & {
22
25
  /**
23
26
  * The controlled checked state of the checkbox. Must be used in conjunction with onChange.
24
27
  */
@@ -50,11 +53,10 @@ declare const Checkbox: import("react").ForwardRefExoticComponent<Omit<Omit<impo
50
53
  * />
51
54
  * ```
52
55
  */
53
- declare function selectAllChecked({
54
- allSelected,
55
- someSelected
56
- }: {
57
- /** Whether every selectable item is currently selected. */allSelected: boolean; /** Whether some (but not necessarily all) items are selected. */
56
+ declare function selectAllChecked({ allSelected, someSelected }: {
57
+ /** Whether every selectable item is currently selected. */
58
+ allSelected: boolean;
59
+ /** Whether some (but not necessarily all) items are selected. */
58
60
  someSelected: boolean;
59
61
  }): CheckedState;
60
62
  //#endregion
package/dist/checkbox.js CHANGED
@@ -1 +1 @@
1
- import{t as e}from"./compose-refs-Cjf2gfB8.js";import{t}from"./clsx-DUGZgXfJ.js";import{a as n,r}from"./validation-DCyx-ceH.js";import{forwardRef as i,useEffect as a,useRef as o,useState as s}from"react";import{jsx as c}from"react/jsx-runtime";const l=e=>e===`indeterminate`,u=i(({"aria-invalid":i,className:u,checked:d,defaultChecked:f,defaultValue:p=`on`,onClick:m,readOnly:h,validation:g,..._},v)=>{let y=o(null),[b]=s(f),x=n(),{ariaInvalid:S,validation:C}=r({"aria-invalid":i,validation:g??x}),w=d??b;a(()=>{y.current&&(y.current.indeterminate=l(w))},[w]);let T=d==null?{defaultChecked:l(b)?void 0:b}:{checked:l(d)?!1:d};return c(`input`,{"aria-checked":l(d)?`mixed`:d,"aria-invalid":S,"data-slot":`checkbox`,className:t(`border-form bg-form shrink-0 cursor-pointer select-none appearance-none rounded border disabled:cursor-default disabled:opacity-50`,`bg-center bg-no-repeat focus:outline-hidden`,`focus-visible:border-accent-600 focus-visible:ring-focus-accent focus-visible:outline-hidden focus-visible:ring-4`,`checked:border-accent-600 checked:bg-accent-600 checked:bg-checked-icon`,`indeterminate:border-accent-600 indeterminate:bg-accent-600 indeterminate:bg-indeterminate-icon`,`data-validation-success:border-success-600 data-validation-success:checked:bg-success-600 data-validation-success:indeterminate:bg-success-600 focus-visible:data-validation-success:border-success-600 focus-visible:data-validation-success:ring-focus-success`,`data-validation-warning:border-warning-600 data-validation-warning:checked:bg-warning-600 data-validation-warning:indeterminate:bg-warning-600 focus-visible:data-validation-warning:border-warning-600 focus-visible:data-validation-warning:ring-focus-warning`,`data-validation-error:border-danger-600 data-validation-error:checked:bg-danger-600 data-validation-error:indeterminate:bg-danger-600 focus-visible:data-validation-error:border-danger-600 focus-visible:data-validation-error:ring-focus-danger`,`where:block where:size-4 where:p-0`,u),...T,"data-validation":C||void 0,defaultValue:p,onClick:e=>{if(h){e.preventDefault();return}m?.(e)},readOnly:h,ref:e(y,v),type:`checkbox`,..._})});u.displayName=`Checkbox`;function d({allSelected:e,someSelected:t}){return e?!0:t?`indeterminate`:!1}export{u as Checkbox,d as selectAllChecked};
1
+ import{n as e,t}from"./checkbox-DJ2xl7Rc.js";export{t as Checkbox,e as selectAllChecked};
@@ -0,0 +1 @@
1
+ import{t as e}from"./cx-IiQEAKf5.js";import{t}from"./slot-DmPrjM7N.js";import{t as n}from"./field-context-BR01g789.js";import{t as r}from"./label-BMlHW_2D.js";import{cloneElement as i,createContext as a,forwardRef as o,isValidElement as s,useContext as c,useId as l,useMemo as u}from"react";import d from"tiny-invariant";import{jsx as f}from"react/jsx-runtime";const p=a(null);function m(e){let t=c(p);return d(t,`Choice.${e} must be rendered inside Choice.Root.`),t}const h=o(({"aria-describedby":t,"aria-errormessage":r,"aria-invalid":i,children:a,className:o,disabled:s=!1,id:d,name:m,...h},g)=>{let _=c(n),v=_?.id,y=_?.name,b=_?.[`aria-describedby`],x=_?.[`aria-invalid`],S=_?.[`aria-errormessage`],C=l(),w=l(),T=v??d??C,E=[b??t,w].filter(Boolean).join(` `)||void 0,D=u(()=>({controlId:T,descriptionId:w,disabled:s,controlProps:{id:T,name:y??m,disabled:s,"aria-describedby":E,"aria-invalid":x??i,"aria-errormessage":S??r}}),[T,w,s,E,y,m,x,i,S,r]);return f(p.Provider,{value:D,children:f(`div`,{ref:g,"data-slot":`choice`,className:e(`flex w-full items-start gap-2`,o),...h,children:a})})});h.displayName=`Choice`;const g=o(({children:t,className:n,...r},a)=>{let{controlProps:o}=m(`Indicator`),c=s(t)?i(t,{...o,disabled:o.disabled||t.props.disabled===!0,name:o.name??t.props.name,"aria-invalid":o[`aria-invalid`]??t.props[`aria-invalid`],"aria-errormessage":o[`aria-errormessage`]??t.props[`aria-errormessage`]}):t;return f(`span`,{ref:a,"data-slot":`choice-indicator`,className:e(`flex h-lh shrink-0 items-center text-sm`,n),...r,children:c})});g.displayName=`ChoiceIndicator`;const _=o(({asChild:n,className:r,...i},a)=>f(n?t:`div`,{ref:a,"data-slot":`choice-content`,className:e(`flex min-w-0 flex-1 flex-col gap-0.5`,r),...i}));_.displayName=`ChoiceContent`;const v=o(({className:t,...n},i)=>{let{controlId:a,disabled:o}=m(`Label`);return f(r,{ref:i,"data-slot":`choice-label`,className:e(o&&`opacity-50`,t),...n,htmlFor:a,disabled:o})});v.displayName=`ChoiceLabel`;const y=o(({asChild:n,className:r,...i},a)=>{let{disabled:o}=m(`Title`);return f(n?t:`p`,{ref:a,"data-slot":`choice-title`,className:e(`text-strong text-sm font-medium font-sans`,o&&`opacity-50`,r),...i})});y.displayName=`ChoiceTitle`;const b=o(({asChild:n,className:r,...i},a)=>{let{descriptionId:o,disabled:s}=m(`Description`);return f(n?t:`p`,{ref:a,id:o,"data-slot":`choice-description`,className:e(`text-body text-sm leading-4`,s&&`opacity-50`,r),...i})});b.displayName=`ChoiceDescription`;const x={Root:h,Indicator:g,Content:_,Label:v,Title:y,Description:b};export{x as t};
@@ -0,0 +1,253 @@
1
+ import { t as WithAsChild } from "./as-child-CYEVu1WY.js";
2
+ import { t as Label } from "./label-v2-bv98k.js";
3
+ import { ComponentProps, ReactNode } from "react";
4
+ //#region src/components/choice/choice.d.ts
5
+ /**
6
+ * Props for `Choice.Root`. Extends `<div>` props (minus `id`, narrowed below)
7
+ * with the disabled / id / name controls. Inside a `Field.Control`, the field's
8
+ * `id` / `name` / `aria-*` take precedence over these.
9
+ *
10
+ * @see https://mantle.ngrok.com/components/forms/choice
11
+ *
12
+ * @example
13
+ * ```tsx
14
+ * <Choice.Root name="notify">
15
+ * <Choice.Indicator>
16
+ * <Checkbox />
17
+ * </Choice.Indicator>
18
+ * <Choice.Content>
19
+ * <Choice.Label>Email</Choice.Label>
20
+ * <Choice.Description>Get notified by email.</Choice.Description>
21
+ * </Choice.Content>
22
+ * </Choice.Root>
23
+ * ```
24
+ */
25
+ type ChoiceRootProps = Omit<ComponentProps<"div">, "id"> & {
26
+ /** Marks the choice disabled — dims the text and is injected onto the control. */
27
+ disabled?: boolean;
28
+ /**
29
+ * Explicit control id. Defaults to a generated id, or — when composed inside a
30
+ * `Field.Control` — the field's id, so `Field.Label` and `Choice.Label` resolve
31
+ * to the same control.
32
+ */
33
+ id?: string;
34
+ /** Form value name for the control. Inherited from `Field` when composed within one. */
35
+ name?: string;
36
+ /** `Choice.Indicator`, a `Choice.Content` (with `Label` / `Title` + `Description`). */
37
+ children: ReactNode;
38
+ };
39
+ /**
40
+ * Root of a `Choice`: the indicator-left / content-right layout for pairing a
41
+ * checkbox or radio with a titled, multi-line label. Owns the control's `id` and the
42
+ * description's `id`, and — when rendered inside a `Field.Control` — reads the
43
+ * field's `id` / `name` / `aria-*` from `FieldControlContext` and merges them
44
+ * into the props `Indicator` injects onto the control (the field's
45
+ * `aria-describedby` is concatenated with this `Choice`'s own description id).
46
+ * Outside a `Field` it falls back to its own generated ids, so the two compose
47
+ * but neither requires the other.
48
+ *
49
+ * @see https://mantle.ngrok.com/components/forms/choice
50
+ *
51
+ * @example
52
+ * ```tsx
53
+ * <Choice.Root name="notify">
54
+ * <Choice.Indicator>
55
+ * <Checkbox />
56
+ * </Choice.Indicator>
57
+ * <Choice.Content>
58
+ * <Choice.Label>Email</Choice.Label>
59
+ * <Choice.Description>Get notified by email.</Choice.Description>
60
+ * </Choice.Content>
61
+ * </Choice.Root>
62
+ * ```
63
+ */
64
+ declare const Root: import("react").ForwardRefExoticComponent<Omit<ChoiceRootProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
65
+ /**
66
+ * The left control slot of a `Choice` — drop the control here (a `Checkbox`, a
67
+ * radio indicator, a `Switch`, …). Its single element child is cloned with the
68
+ * shared `id` / `name` / `aria-*` / `disabled` from `Root`, so a control placed
69
+ * here is wired to `Choice.Label` and the description without the caller
70
+ * threading ids. A non-element child (or none) is rendered untouched.
71
+ *
72
+ * The slot is one line tall (`h-lh`) using the same `text-sm` line box as the
73
+ * title, and centers its child — so the control sits centered on the title's
74
+ * first line and stays put when the title wraps.
75
+ *
76
+ * @see https://mantle.ngrok.com/components/forms/choice
77
+ *
78
+ * @example
79
+ * ```tsx
80
+ * <Choice.Root name="notify">
81
+ * <Choice.Indicator>
82
+ * <Checkbox />
83
+ * </Choice.Indicator>
84
+ * <Choice.Content>
85
+ * <Choice.Label>Email</Choice.Label>
86
+ * <Choice.Description>Get notified by email.</Choice.Description>
87
+ * </Choice.Content>
88
+ * </Choice.Root>
89
+ * ```
90
+ */
91
+ declare const Indicator: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & import("react").RefAttributes<HTMLSpanElement>>;
92
+ type ChoiceContentProps = ComponentProps<"div"> & WithAsChild;
93
+ /**
94
+ * The right column of a `Choice` — stacks a `Choice.Label` / `Choice.Title` over
95
+ * an optional `Choice.Description`. `min-w-0` so long titles truncate instead of
96
+ * pushing the row wide.
97
+ *
98
+ * @see https://mantle.ngrok.com/components/forms/choice
99
+ *
100
+ * @example
101
+ * ```tsx
102
+ * <Choice.Root name="notify">
103
+ * <Choice.Indicator>
104
+ * <Checkbox />
105
+ * </Choice.Indicator>
106
+ * <Choice.Content>
107
+ * <Choice.Label>Email</Choice.Label>
108
+ * <Choice.Description>Get notified by email.</Choice.Description>
109
+ * </Choice.Content>
110
+ * </Choice.Root>
111
+ * ```
112
+ */
113
+ declare const Content: import("react").ForwardRefExoticComponent<Omit<ChoiceContentProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
114
+ /**
115
+ * Props for `Choice.Label`. The mantle `Label` props, minus `htmlFor` and
116
+ * `disabled` — those are owned by `Choice.Root` (the control id and the choice's
117
+ * disabled state) and are not part of the public surface, so consumer props can
118
+ * never override the label-to-control wiring.
119
+ */
120
+ type ChoiceLabelProps = Omit<ComponentProps<typeof Label>, "htmlFor" | "disabled">;
121
+ /**
122
+ * The emphasized title of a `Choice`, rendered as a real `<label>` wired to the
123
+ * control by `htmlFor`, so clicking it toggles the control and it supplies the
124
+ * control's accessible name. Use this when the `Choice` owns the labeling (a
125
+ * standalone checkbox, a raw `<form>`, React-state-only).
126
+ *
127
+ * It is the mantle {@link Label} (not a re-implementation), so it keeps every
128
+ * base-label behavior — cursor, the double-click text-selection guard, and the
129
+ * auto `font-medium` — and mirrors how `Field.Label` reuses `Label`. When an
130
+ * ancestor already owns the labeling and click target (a fully-clickable list
131
+ * row or a Headless radio item), use `Choice.Title` instead — a label-less `<p>`
132
+ * (it accepts `asChild`) — so labels never nest or compete.
133
+ *
134
+ * @see https://mantle.ngrok.com/components/forms/choice
135
+ *
136
+ * @example
137
+ * ```tsx
138
+ * <Choice.Root name="notify">
139
+ * <Choice.Indicator>
140
+ * <Checkbox />
141
+ * </Choice.Indicator>
142
+ * <Choice.Content>
143
+ * <Choice.Label>Email</Choice.Label>
144
+ * <Choice.Description>Get notified by email.</Choice.Description>
145
+ * </Choice.Content>
146
+ * </Choice.Root>
147
+ * ```
148
+ */
149
+ declare const ChoiceLabel: import("react").ForwardRefExoticComponent<Omit<ChoiceLabelProps, "ref"> & import("react").RefAttributes<HTMLLabelElement>>;
150
+ /**
151
+ * The emphasized title of a `Choice`, label-styled but **not** a `<label>` —
152
+ * renders a `<p>`. Mirrors `Field.LabelText`. Use this when something else owns
153
+ * the control's labeling and click target: a fully-clickable list row or a
154
+ * Headless radio item. It avoids nesting two `<label>`s or splitting
155
+ * the click target. Pass `asChild` to supply your own element. For a standalone
156
+ * control — or inside a `Field` — where the title can be the label, use
157
+ * `Choice.Label`.
158
+ *
159
+ * @see https://mantle.ngrok.com/components/forms/choice
160
+ *
161
+ * @example
162
+ * ```tsx
163
+ * <Choice.Root id="onboarding-key">
164
+ * <Choice.Indicator>
165
+ * <Checkbox />
166
+ * </Choice.Indicator>
167
+ * <Choice.Content>
168
+ * <Choice.Title>Onboarding Key</Choice.Title>
169
+ * <Choice.Description>ng-3FaThZL***8xiA</Choice.Description>
170
+ * </Choice.Content>
171
+ * </Choice.Root>
172
+ * ```
173
+ */
174
+ declare const Title: import("react").ForwardRefExoticComponent<Omit<import("react").ClassAttributes<HTMLParagraphElement> & import("react").HTMLAttributes<HTMLParagraphElement> & WithAsChild, "ref"> & import("react").RefAttributes<HTMLParagraphElement>>;
175
+ /**
176
+ * The de-emphasized supplementary line of a `Choice`, in the muted body color
177
+ * and wired to the control via `aria-describedby` (never a second label).
178
+ * Renders a `<p>`; pass `asChild` to supply your own element.
179
+ *
180
+ * @see https://mantle.ngrok.com/components/forms/choice
181
+ *
182
+ * @example
183
+ * ```tsx
184
+ * <Choice.Root name="notify">
185
+ * <Choice.Indicator>
186
+ * <Checkbox />
187
+ * </Choice.Indicator>
188
+ * <Choice.Content>
189
+ * <Choice.Label>Email</Choice.Label>
190
+ * <Choice.Description>Get notified by email.</Choice.Description>
191
+ * </Choice.Content>
192
+ * </Choice.Root>
193
+ * ```
194
+ */
195
+ declare const Description: import("react").ForwardRefExoticComponent<Omit<import("react").ClassAttributes<HTMLParagraphElement> & import("react").HTMLAttributes<HTMLParagraphElement> & WithAsChild, "ref"> & import("react").RefAttributes<HTMLParagraphElement>>;
196
+ /**
197
+ * A reusable indicator-left / content-right layout for a single choice: a
198
+ * control (checkbox, radio, switch) beside an emphasized title and an optional
199
+ * de-emphasized description. Use it to pair a checkbox or radio with a rich,
200
+ * titled label, or reach for it directly to build your own choice-like rows.
201
+ *
202
+ * It is a pure layout + association primitive: it owns the control's `id` and
203
+ * the description's `id` and wires them together, but does **not** own the
204
+ * control's value — drop your own control into `Choice.Indicator`. Pick
205
+ * `Choice.Label` (a real `<label>`) when the `Choice` owns the labeling, or
206
+ * `Choice.Title` (label-less text) when an ancestor (a clickable row or a
207
+ * Headless radio item) already does.
208
+ *
209
+ * **Use it for choice-like layouts** — a checkbox or radio input that needs an
210
+ * associated label and an optional supplementary description. It is not a
211
+ * general-purpose layout primitive; for laying out non-control content, reach
212
+ * for a plain flex/grid or `MediaObject` instead.
213
+ *
214
+ * **Field interop.** Inside a `Field.Control`, `Choice.Root` reads the field's
215
+ * `id` / `name` / `aria-*` and merges its description into the control's
216
+ * `aria-describedby`. Outside a `Field` it uses its own generated ids — the two
217
+ * are aware of each other but neither is required.
218
+ *
219
+ * @see https://mantle.ngrok.com/components/forms/choice
220
+ *
221
+ * @example
222
+ * Composition:
223
+ * ```
224
+ * Choice.Root
225
+ * ├── Choice.Indicator
226
+ * └── Choice.Content
227
+ * ├── Choice.Label (or Choice.Title — pick one)
228
+ * └── Choice.Description
229
+ * ```
230
+ *
231
+ * @example
232
+ * ```tsx
233
+ * <Choice.Root name="notify">
234
+ * <Choice.Indicator>
235
+ * <Checkbox />
236
+ * </Choice.Indicator>
237
+ * <Choice.Content>
238
+ * <Choice.Label>Email</Choice.Label>
239
+ * <Choice.Description>Get notified by email.</Choice.Description>
240
+ * </Choice.Content>
241
+ * </Choice.Root>
242
+ * ```
243
+ */
244
+ declare const Choice: {
245
+ Root: typeof Root;
246
+ Indicator: typeof Indicator;
247
+ Content: typeof Content;
248
+ Label: typeof ChoiceLabel;
249
+ Title: typeof Title;
250
+ Description: typeof Description;
251
+ };
252
+ //#endregion
253
+ export { Choice, type ChoiceRootProps };
package/dist/choice.js ADDED
@@ -0,0 +1 @@
1
+ import{t as e}from"./choice-DOdyNzFC.js";export{e as Choice};
@@ -1,9 +1,8 @@
1
- import { t as WithAsChild } from "./as-child-uN_018tj.js";
2
- import { t as SvgAttributes } from "./types-BvUzforF.js";
3
- import { A as FoldStrategy, B as computeJsonFoldRanges, C as Indentation, D as FoldExplanation, E as ComputeFoldRangesInput, F as isSupportedLanguage, H as finalizeFoldRanges, I as parseLanguage, L as supportedLanguages, M as computeFoldRanges, N as foldStrategyFor, O as FoldLine, P as SupportedLanguage, S as normalizeIndentation, T as isIndentation, U as LineRange, V as FoldableRange, _ as MantleCodeBlockValue, a as Mode, c as ResolvedPreRenderedCodeBlockProps, d as parseMetastring, f as resolvePreRenderedCodeBlockProps, g as parseCodeBlockShowLineNumbers, h as parseCodeBlockLineNumberStart, i as MetaInput, j as FoldToken, k as FoldScope, l as defaultMeta, m as parseCodeBlockHighlightLines, n as DefaultMeta, o as ResolvePreRenderedCodeBlockPropsInput, p as tokenizeMetastring, r as Meta, s as ResolvePreRenderedCodeBlockPropsResult, t as CodeBlockPreElementInput, u as normalizeValue, v as MantleCodeOptions, w as inferIndentation, x as mantleCode, y as createMantleCodeBlockValue, z as decorateHighlightedHtml } from "./resolve-pre-rendered-props-DxJ9-DAl.js";
1
+ import { t as WithAsChild } from "./as-child-CYEVu1WY.js";
2
+ import { t as SvgAttributes } from "./types-D1RY5Tcj.js";
3
+ import { A as FoldStrategy, B as computeJsonFoldRanges, C as Indentation, D as FoldExplanation, E as ComputeFoldRangesInput, F as isSupportedLanguage, H as finalizeFoldRanges, I as parseLanguage, L as supportedLanguages, M as computeFoldRanges, N as foldStrategyFor, O as FoldLine, P as SupportedLanguage, S as normalizeIndentation, T as isIndentation, U as LineRange, V as FoldableRange, _ as MantleCodeBlockValue, a as Mode, c as ResolvedPreRenderedCodeBlockProps, d as parseMetastring, f as resolvePreRenderedCodeBlockProps, g as parseCodeBlockShowLineNumbers, h as parseCodeBlockLineNumberStart, i as MetaInput, j as FoldToken, k as FoldScope, l as defaultMeta, m as parseCodeBlockHighlightLines, n as DefaultMeta, o as ResolvePreRenderedCodeBlockPropsInput, p as tokenizeMetastring, r as Meta, s as ResolvePreRenderedCodeBlockPropsResult, t as CodeBlockPreElementInput, u as normalizeValue, v as MantleCodeOptions, w as inferIndentation, x as mantleCode, y as createMantleCodeBlockValue, z as decorateHighlightedHtml } from "./resolve-pre-rendered-props-B6OlZrSI.js";
4
4
  import { ComponentProps, HTMLAttributes, ReactNode } from "react";
5
5
  import { Content, List, Trigger } from "@radix-ui/react-tabs";
6
-
7
6
  //#region src/components/code-block/code-block.d.ts
8
7
  type CodeBlockRootProps = Omit<ComponentProps<"div">, "align"> & WithAsChild & {
9
8
  /**
@@ -73,15 +72,7 @@ type CodeBlockIconProps = Omit<SvgAttributes, "children"> & ({
73
72
  * </CodeBlock.Root>
74
73
  * ```
75
74
  */
76
- declare function CodeBlockIconComponent({
77
- className,
78
- preset,
79
- svg: _svgProp,
80
- ...props
81
- }: CodeBlockIconProps): import("react").JSX.Element;
82
- declare namespace CodeBlockIconComponent {
83
- var displayName: string;
84
- }
75
+ declare function CodeBlockIconComponent({ className, preset, svg: _svgProp, ...props }: CodeBlockIconProps): import("react").JSX.Element;
85
76
  type CodeBlockTabListProps = Omit<ComponentProps<typeof List>, "asChild" | "loop">;
86
77
  type CodeBlockTabTriggerProps = Omit<ComponentProps<typeof Trigger>, "asChild">;
87
78
  type CodeBlockTabContentProps = Omit<ComponentProps<typeof Content>, "asChild" | "forceMount">;
@@ -486,10 +477,7 @@ type JsonCodeBlockValueOptions = {
486
477
  * </CodeBlock.Root>
487
478
  * ```
488
479
  */
489
- declare function jsonCodeBlockValue(value: unknown, {
490
- showLineNumbers,
491
- foldable
492
- }?: JsonCodeBlockValueOptions): MantleCodeBlockValue;
480
+ declare function jsonCodeBlockValue(value: unknown, { showLineNumbers, foldable }?: JsonCodeBlockValueOptions): MantleCodeBlockValue;
493
481
  //#endregion
494
482
  //#region src/components/code-block/escape-html.d.ts
495
483
  /**
@@ -1,4 +1,4 @@
1
- import{t as e}from"./compose-refs-Cjf2gfB8.js";import{t}from"./cx-C1UYP5We.js";import{t as n}from"./icon-SUx16Sl3.js";import{t as r}from"./slot-DT_E5BQx.js";import{t as i}from"./icon-button-DiX9iZ9n.js";import{t as a}from"./use-copy-to-clipboard-BLpquU9d.js";import{t as o}from"./traffic-policy-file-0g5RXFqu.js";import{S as s,_ as c,a as l,b as u,c as d,d as f,f as p,g as m,h,i as g,l as _,m as v,n as y,o as b,p as x,r as S,s as C,t as w,u as T,v as E,y as D}from"./resolve-pre-rendered-props-DwIF_M_K.js";import{CaretDownIcon as O}from"@phosphor-icons/react/CaretDown";import{createContext as ee,forwardRef as k,useCallback as A,useContext as te,useEffect as j,useId as ne,useLayoutEffect as re,useMemo as M,useRef as N,useState as P}from"react";import F from"tiny-invariant";import{jsx as I,jsxs as ie}from"react/jsx-runtime";import{CheckIcon as ae}from"@phosphor-icons/react/Check";import{CopyIcon as oe}from"@phosphor-icons/react/Copy";import{FileTextIcon as se}from"@phosphor-icons/react/FileText";import{TerminalIcon as ce}from"@phosphor-icons/react/Terminal";import{Content as le,List as ue,Root as de,Trigger as fe}from"@radix-ui/react-tabs";function L(e){let t=-1;for(let n=0;n<e.length;n++){let r=e[n];if(r===`&`||r===`<`||r===`>`||r===`"`||r===`'`){t=n;break}}if(t===-1)return e;let n=e.slice(0,t);for(let r=t;r<e.length;r++){let t=e[r];switch(t){case`&`:n+=`&amp;`;break;case`<`:n+=`&lt;`;break;case`>`:n+=`&gt;`;break;case`"`:n+=`&quot;`;break;case`'`:n+=`&#39;`;break;default:n+=t}}return n}const R=new WeakMap;function z(e){let t=new Set;if(e==null||e===``)return t;for(let n of e.split(` `))n!==``&&t.add(n);return t}function pe(e){let t=R.get(e);if(t!=null&&ge(t))return t;let n=new Map,r=new WeakMap,i=e.querySelectorAll(`[data-fold-regions]`);for(let e=0;e<i.length;e+=1){let t=i[e];if(!(t instanceof HTMLElement))continue;let a=z(t.dataset.foldRegions);if(a.size!==0){r.set(t,a);for(let e of a){let r=n.get(e);r??(r=[],n.set(e,r)),r.push(t)}}}let a={regionToLines:n,lineToRegions:r};return R.set(e,a),a}function me(e){R.delete(e)}function he(e){me(e),e.removeAttribute(`data-folded-regions`)}function ge(e){for(let t of e.regionToLines.values()){if(t.length===0)continue;let e=t[0];if(e!=null)return e.isConnected}return!0}function _e(e,t,n){let r=!1;for(let e of n)if(t.has(e)){r=!0;break}r?e.dataset.foldHidden=`true`:delete e.dataset.foldHidden}function ve(e){let t=e.dataset.foldLine;if(t==null||t===``)return!1;let n=e.closest(`[data-slot='code-block-code']`)?.querySelector(`code`);if(n==null)return!1;let r=z(n.getAttribute(`data-folded-regions`)),i=!r.has(t);i?r.add(t):r.delete(t),r.size===0?n.removeAttribute(`data-folded-regions`):n.setAttribute(`data-folded-regions`,[...r].join(` `)),e.setAttribute(`aria-expanded`,i?`false`:`true`);let{regionToLines:a,lineToRegions:o}=pe(n),s=a.get(t);if(s!=null)for(let e of s){let t=o.get(e);t!=null&&_e(e,r,t)}return!0}function ye(e){let t=e=>{let t=e.target;if(!(t instanceof Element))return;let n=t.closest(`.mantle-code-fold-toggle`);n instanceof HTMLButtonElement&&ve(n)};return e.addEventListener(`click`,t),()=>{e.removeEventListener(`click`,t)}}const B=ee(null);function V(){let e=te(B);return F(e!=null,`CodeBlock subcomponents must be rendered within a <CodeBlock.Root>.`),e}const H=k(({asChild:e=!1,className:n,defaultTab:i,activeTab:a,onActiveTabChange:o,...s},c)=>{let l=N(``),[u,d]=P(!1),[f,p]=P(!1),[m,h]=P(void 0),g=A(e=>{h(t=>(F(t==null,`You can only render a single CodeBlock.Code within a CodeBlock.`),e))},[]),_=A(e=>{h(t=>{F(t===e,`You can only render a single CodeBlock.Code within a CodeBlock.`)})},[]),v=M(()=>({codeId:m,copyTextRef:l,hasCodeExpander:u,isCodeExpanded:f,registerCodeId:g,setHasCodeExpander:d,setIsCodeExpanded:p,unregisterCodeId:_}),[m,u,f,g,_]),y=i!=null||a!=null,b=I(e?r:`div`,{"data-slot":`code-block`,className:t(`text-mono w-full overflow-hidden rounded-md border border-gray-300 bg-card font-mono`,`[&_svg]:shrink-0`,n),ref:c,...s});return I(B.Provider,{value:v,children:y?I(de,{asChild:!0,defaultValue:i,value:a,onValueChange:o,children:b}):b})});H.displayName=`CodeBlock`;const U=k(({asChild:e=!1,className:n,...i},a)=>I(e?r:`div`,{"data-slot":`code-block-body`,className:t(`relative`,n),ref:a,...i}));U.displayName=`CodeBlockBody`;const be=/SHIKI_VAL_(\d+)/g;function xe(e){return e.replace(/[.*+?^${}()|[\]\\]/g,`\\$&`)}const W=new Map;function Se(e){if(e==null||e.length===0)return be;let t=W.get(e);return t??(W.size>=500&&W.clear(),t=RegExp(`${xe(e)}(\\d+)__`,`g`),W.set(e,t)),t}function G(e,t,n,r){if(n==null){if(!e.includes(`SHIKI_VAL_`))return e}else if(!e.includes(n))return e;return e.replaceAll(Se(n),(e,n)=>{let i=Number.parseInt(n,10);return Number.isNaN(i)||i<0||i>=t.length?e:r(t[i])})}function Ce(e,t,n){return G(e,t,n,e=>L(String(e)))}function we(e,t,n){return G(e,t,n,e=>String(e))}const K=k(({className:n,style:r,value:i,...a},o)=>{let s=ne(),c=N(null),{copyTextRef:l,hasCodeExpander:u,isCodeExpanded:d,registerCodeId:f,unregisterCodeId:p}=V(),{language:m,code:h,"~preValToken":g,"~preVals":_,"~highlightLines":v,"~lineNumberStart":y,"~preHtml":b,"~showLineNumbers":x}=i,S=v,C=y??1,w=x??!1,T=M(()=>_!=null&&_.length>0?we(h,_,g):h,[g,_,h]);re(()=>{l.current=T},[l,T]),j(()=>(f(s),()=>{p(s)}),[s,f,p]);let E=M(()=>{if(b!=null)return _!=null&&_.length>0?Ce(b,_,g):b},[b,g,_]);j(()=>{let e=c.current;if(e==null)return;let t=e.querySelector(`code`);return t!=null&&he(t),ye(e)},[E]);let D=E!=null,O=E??L(T),ee=M(()=>({__html:O}),[O]);return I(`pre`,{"data-slot":`code-block-code`,"aria-expanded":u?d:void 0,className:t(`scrollbar overflow-x-auto overflow-y-hidden py-4`,!D&&`pr-14`,`data-[mantle-line-numbers~='false']:pl-4`,`text-mono m-0 font-mono outline-hidden`,`aria-collapsed:max-h-[13.6rem]`,n),"data-highlighted":D?`true`:`false`,"data-lang":m,"data-mantle-highlight-lines":D&&S!=null&&S.length>0?S.join(`,`):void 0,"data-mantle-line-number-start":D&&w?String(C):`1`,"data-mantle-line-numbers":D&&w?`true`:`false`,id:s,ref:e(c,o),style:{...r,"--mantle-line-number-start":String(C),tabSize:2,MozTabSize:2},...a,children:I(`code`,{className:`text-size-inherit block min-w-full w-max`,dangerouslySetInnerHTML:ee})})});K.displayName=`CodeBlockCode`;const q=k(({asChild:e=!1,className:n,...i},a)=>I(e?r:`div`,{"data-slot":`code-block-header`,className:t(`flex items-center gap-1 border-b border-gray-300 bg-base px-4 py-2 text-gray-700`,n),ref:a,...i}));q.displayName=`CodeBlockHeader`;const J=k(({asChild:e=!1,className:n,...i},a)=>I(e?r:`h3`,{"data-slot":`code-block-title`,ref:a,className:t(`text-mono m-0 font-mono font-normal`,n),...i}));J.displayName=`CodeBlockTitle`;const Y=k(({className:e,label:t=`Copy code`,onCopy:n,onCopyError:r,onClick:o,...s},c)=>{let{copyTextRef:l}=V(),u=a(),[d,f]=P(!1),p=N(void 0);return j(()=>()=>{p.current!=null&&clearTimeout(p.current)},[]),I(`span`,{"data-slot":`code-block-copy-button`,className:`absolute right-3 top-3 z-10 inline-flex size-7 items-center justify-center rounded-[var(--icon-button-border-radius,0.375rem)] bg-card`,children:I(i,{type:`button`,appearance:`ghost`,size:`sm`,label:t,icon:I(d?ae:oe,{}),className:e,ref:c,onClick:async e=>{try{if(o?.(e),e.defaultPrevented){p.current!=null&&clearTimeout(p.current);return}let t=l.current;await u(t),n?.(t),f(!0),p.current!=null&&clearTimeout(p.current),p.current=setTimeout(()=>{f(!1)},2e3)}catch(e){r?.(e)}},...s})})});Y.displayName=`CodeBlockCopyButton`;const X=k(({asChild:e=!1,className:i,onClick:a,...o},s)=>{let{codeId:c,isCodeExpanded:l,setIsCodeExpanded:u,setHasCodeExpander:d}=V();return j(()=>(d(!0),()=>{d(!1)}),[d]),ie(e?r:`button`,{...o,"data-slot":`code-block-expander-button`,"aria-controls":c,"aria-expanded":l,className:t(`flex w-full items-center justify-center gap-0.5 border-t border-gray-300 bg-card px-4 py-2 font-sans text-gray-700 hover:bg-gray-100`,i),ref:s,type:`button`,onClick:e=>{u(e=>!e),a?.(e)},children:[l?`Show less`:`Show more`,` `,I(n,{svg:I(O,{weight:`bold`}),className:t(`size-4`,l&&`rotate-180`,`transition-all duration-150`)})]})});X.displayName=`CodeBlockExpanderButton`;function Z({className:e,preset:t,svg:r,...i}){let a=r;if(t!=null)switch(t){case`file`:a=I(se,{weight:`fill`});break;case`cli`:a=I(ce,{weight:`fill`});break;case`traffic-policy`:a=I(o,{});break}return I(n,{"data-slot":`code-block-icon`,className:e,svg:a,...i})}Z.displayName=`CodeBlockIcon`;const Q=k(({className:e,...n},r)=>I(ue,{"data-slot":`code-block-tab-list`,className:t(`flex items-center gap-1`,e),ref:r,...n}));Q.displayName=`CodeBlockTabList`;const Te=k(({className:e,...n},r)=>I(fe,{"data-slot":`code-block-tab-trigger`,className:t(`cursor-pointer rounded px-1.5 py-0.5 text-xs font-medium`,`text-gray-600 outline-hidden`,`hover:text-gray-900`,`data-[state=active]:bg-neutral-500/15 data-[state=active]:text-strong`,`focus-visible:ring-focus-accent focus-visible:ring-4`,e),ref:r,...n}));Te.displayName=`CodeBlockTabTrigger`;const Ee=k((e,t)=>I(le,{"data-slot":`code-block-tab-content`,ref:t,...e}));Ee.displayName=`CodeBlockTabContent`;const De={Root:H,Body:U,Code:K,CopyButton:Y,ExpanderButton:X,Header:q,Icon:Z,TabContent:Ee,TabList:Q,TabTrigger:Te,Title:J},Oe=`var(--shiki-foreground)`;function ke(e){return e.replace(/[&<]/g,e=>e===`&`?`&#x26;`:`&#x3C;`)}function Ae(e){return e===` `||e===` `||e===`
1
+ import{t as e}from"./compose-refs-Cjf2gfB8.js";import{t}from"./cx-IiQEAKf5.js";import{t as n}from"./icon-CDtYjF_H.js";import{t as r}from"./slot-DmPrjM7N.js";import{t as i}from"./icon-button-CxVsZ2N1.js";import{t as a}from"./use-copy-to-clipboard-DqQ0_N3E.js";import{t as o}from"./traffic-policy-file-0g5RXFqu.js";import{S as s,_ as c,a as l,b as u,c as d,d as f,f as p,g as m,h,i as g,l as _,m as v,n as y,o as b,p as x,r as S,s as C,t as w,u as T,v as E,y as D}from"./resolve-pre-rendered-props-C3e5Auo3.js";import{CaretDownIcon as O}from"@phosphor-icons/react/CaretDown";import{createContext as ee,forwardRef as k,useCallback as A,useContext as te,useEffect as j,useId as ne,useLayoutEffect as re,useMemo as M,useRef as N,useState as P}from"react";import F from"tiny-invariant";import{jsx as I,jsxs as ie}from"react/jsx-runtime";import{CheckIcon as ae}from"@phosphor-icons/react/Check";import{CopyIcon as oe}from"@phosphor-icons/react/Copy";import{FileTextIcon as se}from"@phosphor-icons/react/FileText";import{TerminalIcon as ce}from"@phosphor-icons/react/Terminal";import{Content as le,List as ue,Root as de,Trigger as fe}from"@radix-ui/react-tabs";function L(e){let t=-1;for(let n=0;n<e.length;n++){let r=e[n];if(r===`&`||r===`<`||r===`>`||r===`"`||r===`'`){t=n;break}}if(t===-1)return e;let n=e.slice(0,t);for(let r=t;r<e.length;r++){let t=e[r];switch(t){case`&`:n+=`&amp;`;break;case`<`:n+=`&lt;`;break;case`>`:n+=`&gt;`;break;case`"`:n+=`&quot;`;break;case`'`:n+=`&#39;`;break;default:n+=t}}return n}const R=new WeakMap;function z(e){let t=new Set;if(e==null||e===``)return t;for(let n of e.split(` `))n!==``&&t.add(n);return t}function pe(e){let t=R.get(e);if(t!=null&&ge(t))return t;let n=new Map,r=new WeakMap,i=e.querySelectorAll(`[data-fold-regions]`);for(let e=0;e<i.length;e+=1){let t=i[e];if(!(t instanceof HTMLElement))continue;let a=z(t.dataset.foldRegions);if(a.size!==0){r.set(t,a);for(let e of a){let r=n.get(e);r??(r=[],n.set(e,r)),r.push(t)}}}let a={regionToLines:n,lineToRegions:r};return R.set(e,a),a}function me(e){R.delete(e)}function he(e){me(e),e.removeAttribute(`data-folded-regions`)}function ge(e){for(let t of e.regionToLines.values()){if(t.length===0)continue;let e=t[0];if(e!=null)return e.isConnected}return!0}function _e(e,t,n){let r=!1;for(let e of n)if(t.has(e)){r=!0;break}r?e.dataset.foldHidden=`true`:delete e.dataset.foldHidden}function ve(e){let t=e.dataset.foldLine;if(t==null||t===``)return!1;let n=e.closest(`[data-slot='code-block-code']`)?.querySelector(`code`);if(n==null)return!1;let r=z(n.getAttribute(`data-folded-regions`)),i=!r.has(t);i?r.add(t):r.delete(t),r.size===0?n.removeAttribute(`data-folded-regions`):n.setAttribute(`data-folded-regions`,[...r].join(` `)),e.setAttribute(`aria-expanded`,i?`false`:`true`);let{regionToLines:a,lineToRegions:o}=pe(n),s=a.get(t);if(s!=null)for(let e of s){let t=o.get(e);t!=null&&_e(e,r,t)}return!0}function ye(e){let t=e=>{let t=e.target;if(!(t instanceof Element))return;let n=t.closest(`.mantle-code-fold-toggle`);n instanceof HTMLButtonElement&&ve(n)};return e.addEventListener(`click`,t),()=>{e.removeEventListener(`click`,t)}}const B=ee(null);function V(){let e=te(B);return F(e!=null,`CodeBlock subcomponents must be rendered within a <CodeBlock.Root>.`),e}const H=k(({asChild:e=!1,className:n,defaultTab:i,activeTab:a,onActiveTabChange:o,...s},c)=>{let l=N(``),[u,d]=P(!1),[f,p]=P(!1),[m,h]=P(void 0),g=A(e=>{h(t=>(F(t==null,`You can only render a single CodeBlock.Code within a CodeBlock.`),e))},[]),_=A(e=>{h(t=>{F(t===e,`You can only render a single CodeBlock.Code within a CodeBlock.`)})},[]),v=M(()=>({codeId:m,copyTextRef:l,hasCodeExpander:u,isCodeExpanded:f,registerCodeId:g,setHasCodeExpander:d,setIsCodeExpanded:p,unregisterCodeId:_}),[m,u,f,g,_]),y=i!=null||a!=null,b=I(e?r:`div`,{"data-slot":`code-block`,className:t(`text-mono w-full overflow-hidden rounded-md border border-gray-300 bg-card font-mono`,`[&_svg]:shrink-0`,n),ref:c,...s});return I(B.Provider,{value:v,children:y?I(de,{asChild:!0,defaultValue:i,value:a,onValueChange:o,children:b}):b})});H.displayName=`CodeBlock`;const U=k(({asChild:e=!1,className:n,...i},a)=>I(e?r:`div`,{"data-slot":`code-block-body`,className:t(`relative`,n),ref:a,...i}));U.displayName=`CodeBlockBody`;const be=/SHIKI_VAL_(\d+)/g;function xe(e){return e.replace(/[.*+?^${}()|[\]\\]/g,`\\$&`)}const W=new Map;function Se(e){if(e==null||e.length===0)return be;let t=W.get(e);return t??(W.size>=500&&W.clear(),t=RegExp(`${xe(e)}(\\d+)__`,`g`),W.set(e,t)),t}function G(e,t,n,r){if(n==null){if(!e.includes(`SHIKI_VAL_`))return e}else if(!e.includes(n))return e;return e.replaceAll(Se(n),(e,n)=>{let i=Number.parseInt(n,10);return Number.isNaN(i)||i<0||i>=t.length?e:r(t[i])})}function Ce(e,t,n){return G(e,t,n,e=>L(String(e)))}function we(e,t,n){return G(e,t,n,e=>String(e))}const K=k(({className:n,style:r,value:i,...a},o)=>{let s=ne(),c=N(null),{copyTextRef:l,hasCodeExpander:u,isCodeExpanded:d,registerCodeId:f,unregisterCodeId:p}=V(),{language:m,code:h,"~preValToken":g,"~preVals":_,"~highlightLines":v,"~lineNumberStart":y,"~preHtml":b,"~showLineNumbers":x}=i,S=v,C=y??1,w=x??!1,T=M(()=>_!=null&&_.length>0?we(h,_,g):h,[g,_,h]);re(()=>{l.current=T},[l,T]),j(()=>(f(s),()=>{p(s)}),[s,f,p]);let E=M(()=>{if(b!=null)return _!=null&&_.length>0?Ce(b,_,g):b},[b,g,_]);j(()=>{let e=c.current;if(e==null)return;let t=e.querySelector(`code`);return t!=null&&he(t),ye(e)},[E]);let D=E!=null,O=E??L(T),ee=M(()=>({__html:O}),[O]);return I(`pre`,{"data-slot":`code-block-code`,"aria-expanded":u?d:void 0,className:t(`scrollbar overflow-x-auto overflow-y-hidden py-4`,!D&&`pr-14`,`data-[mantle-line-numbers~='false']:pl-4`,`text-mono m-0 font-mono outline-hidden`,`aria-collapsed:max-h-[13.6rem]`,n),"data-highlighted":D?`true`:`false`,"data-lang":m,"data-mantle-highlight-lines":D&&S!=null&&S.length>0?S.join(`,`):void 0,"data-mantle-line-number-start":D&&w?String(C):`1`,"data-mantle-line-numbers":D&&w?`true`:`false`,id:s,ref:e(c,o),style:{...r,"--mantle-line-number-start":String(C),tabSize:2,MozTabSize:2},...a,children:I(`code`,{className:`text-size-inherit block min-w-full w-max`,dangerouslySetInnerHTML:ee})})});K.displayName=`CodeBlockCode`;const q=k(({asChild:e=!1,className:n,...i},a)=>I(e?r:`div`,{"data-slot":`code-block-header`,className:t(`flex items-center gap-1 border-b border-gray-300 bg-base px-4 py-2 text-gray-700`,n),ref:a,...i}));q.displayName=`CodeBlockHeader`;const J=k(({asChild:e=!1,className:n,...i},a)=>I(e?r:`h3`,{"data-slot":`code-block-title`,ref:a,className:t(`text-mono m-0 font-mono font-normal`,n),...i}));J.displayName=`CodeBlockTitle`;const Y=k(({className:e,label:t=`Copy code`,onCopy:n,onCopyError:r,onClick:o,...s},c)=>{let{copyTextRef:l}=V(),u=a(),[d,f]=P(!1),p=N(void 0);return j(()=>()=>{p.current!=null&&clearTimeout(p.current)},[]),I(`span`,{"data-slot":`code-block-copy-button`,className:`absolute right-3 top-3 z-10 inline-flex size-7 items-center justify-center rounded-[var(--icon-button-border-radius,0.375rem)] bg-card`,children:I(i,{type:`button`,appearance:`ghost`,size:`sm`,label:t,icon:I(d?ae:oe,{}),className:e,ref:c,onClick:async e=>{try{if(o?.(e),e.defaultPrevented){p.current!=null&&clearTimeout(p.current);return}let t=l.current;await u(t),n?.(t),f(!0),p.current!=null&&clearTimeout(p.current),p.current=setTimeout(()=>{f(!1)},2e3)}catch(e){r?.(e)}},...s})})});Y.displayName=`CodeBlockCopyButton`;const X=k(({asChild:e=!1,className:i,onClick:a,...o},s)=>{let{codeId:c,isCodeExpanded:l,setIsCodeExpanded:u,setHasCodeExpander:d}=V();return j(()=>(d(!0),()=>{d(!1)}),[d]),ie(e?r:`button`,{...o,"data-slot":`code-block-expander-button`,"aria-controls":c,"aria-expanded":l,className:t(`flex w-full items-center justify-center gap-0.5 border-t border-gray-300 bg-card px-4 py-2 font-sans text-gray-700 hover:bg-gray-100`,i),ref:s,type:`button`,onClick:e=>{u(e=>!e),a?.(e)},children:[l?`Show less`:`Show more`,` `,I(n,{svg:I(O,{weight:`bold`}),className:t(`size-4`,l&&`rotate-180`,`transition-all duration-150`)})]})});X.displayName=`CodeBlockExpanderButton`;function Z({className:e,preset:t,svg:r,...i}){let a=r;if(t!=null)switch(t){case`file`:a=I(se,{weight:`fill`});break;case`cli`:a=I(ce,{weight:`fill`});break;case`traffic-policy`:a=I(o,{});break}return I(n,{"data-slot":`code-block-icon`,className:e,svg:a,...i})}Z.displayName=`CodeBlockIcon`;const Q=k(({className:e,...n},r)=>I(ue,{"data-slot":`code-block-tab-list`,className:t(`scroll-fade-x flex min-w-0 items-center gap-1 overflow-x-auto overscroll-x-none`,`-m-1 p-1`,e),ref:r,...n}));Q.displayName=`CodeBlockTabList`;const Te=k(({className:e,...n},r)=>I(fe,{"data-slot":`code-block-tab-trigger`,className:t(`shrink-0 cursor-pointer rounded px-1.5 py-0.5 text-xs font-medium whitespace-nowrap`,`text-gray-600 outline-hidden`,`hover:text-gray-900`,`data-[state=active]:bg-neutral-500/15 data-[state=active]:text-strong`,`focus-visible:ring-focus-accent focus-visible:ring-4`,e),ref:r,...n}));Te.displayName=`CodeBlockTabTrigger`;const Ee=k((e,t)=>I(le,{"data-slot":`code-block-tab-content`,ref:t,...e}));Ee.displayName=`CodeBlockTabContent`;const De={Root:H,Body:U,Code:K,CopyButton:Y,ExpanderButton:X,Header:q,Icon:Z,TabContent:Ee,TabList:Q,TabTrigger:Te,Title:J},Oe=`var(--shiki-foreground)`;function ke(e){return e.replace(/[&<]/g,e=>e===`&`?`&#x26;`:`&#x3C;`)}function Ae(e){return e===` `||e===` `||e===`
2
2
  `||e===`\r`||e===`{`||e===`}`||e===`[`||e===`]`||e===`:`||e===`,`||e===`"`}function je(e,t,n){let r=e.length,i=[],a=`"`,o=t+1;for(;o<r;){let t=e[o];if(t===`\\`){let t=e[o+1]===`u`&&/^[0-9a-fA-F]{4}$/.test(e.slice(o+2,o+6))?6:2;a!==``&&(i.push({text:a,isEscape:!1}),a=``),i.push({text:e.slice(o,o+t),isEscape:!0}),o+=t;continue}if(t===`"`){a+=`"`,o+=1;break}a+=t,o+=1}a!==``&&i.push({text:a,isEscape:!1});let s=o;for(;s<r;){let t=e[s];if(t===` `||t===` `||t===`
3
3
  `||t===`\r`){s+=1;continue}break}let c=e[s]===`:`?`var(--shiki-token-keyword)`:`var(--shiki-token-string-expression)`;for(let e of i)n(e.text,e.isEscape?`var(--shiki-token-escape, var(--shiki-token-constant))`:c);return o}function Me(e){for(let t=0;t<e.length;t+=1){let n=e[t];if(n!=null&&n.color==null){let r=Oe;for(let n=t+1;n<e.length;n+=1){let t=e[n];if(t!=null&&t.color!=null){r=t.color;break}}n.color=r}}let t=``,n=``,r=null,i=()=>{r!=null&&(t+=`<span style="color:${r}">${ke(n)}</span>`),n=``,r=null};for(let t of e)t!=null&&(t.color===r?n+=t.text:(i(),n=t.text,r=t.color));return i(),`<span class="line">${t}</span>`}function $(e){let t=[[]],n=t[0]??[],r=e.length,i=0,a=(e,t)=>{n.push({text:e,color:t})};for(;i<r;){let o=e[i];if(o===`
4
4
  `||o===`\r`){o===`\r`&&e[i+1]===`
@@ -1,2 +1,2 @@
1
- import { A as FoldStrategy, B as computeJsonFoldRanges, C as Indentation, D as FoldExplanation, E as ComputeFoldRangesInput, F as isSupportedLanguage, H as finalizeFoldRanges, I as parseLanguage, L as supportedLanguages, M as computeFoldRanges, N as foldStrategyFor, O as FoldLine, P as SupportedLanguage, R as DecorateHighlightedHtmlInput, S as normalizeIndentation, T as isIndentation, U as LineRange, V as FoldableRange, b as defaultShowLineNumbers, g as parseCodeBlockShowLineNumbers, h as parseCodeBlockLineNumberStart, j as FoldToken, k as FoldScope, m as parseCodeBlockHighlightLines, p as tokenizeMetastring, u as normalizeValue, w as inferIndentation, z as decorateHighlightedHtml } from "./resolve-pre-rendered-props-DxJ9-DAl.js";
1
+ import { A as FoldStrategy, B as computeJsonFoldRanges, C as Indentation, D as FoldExplanation, E as ComputeFoldRangesInput, F as isSupportedLanguage, H as finalizeFoldRanges, I as parseLanguage, L as supportedLanguages, M as computeFoldRanges, N as foldStrategyFor, O as FoldLine, P as SupportedLanguage, R as DecorateHighlightedHtmlInput, S as normalizeIndentation, T as isIndentation, U as LineRange, V as FoldableRange, b as defaultShowLineNumbers, g as parseCodeBlockShowLineNumbers, h as parseCodeBlockLineNumberStart, j as FoldToken, k as FoldScope, m as parseCodeBlockHighlightLines, p as tokenizeMetastring, u as normalizeValue, w as inferIndentation, z as decorateHighlightedHtml } from "./resolve-pre-rendered-props-B6OlZrSI.js";
2
2
  export { type ComputeFoldRangesInput, type DecorateHighlightedHtmlInput, type FoldExplanation, type FoldLine, type FoldScope, type FoldStrategy, type FoldToken, type FoldableRange, type Indentation, type LineRange, type SupportedLanguage, computeFoldRanges, computeJsonFoldRanges, decorateHighlightedHtml, defaultShowLineNumbers, finalizeFoldRanges, foldStrategyFor, inferIndentation, isIndentation, isSupportedLanguage, normalizeIndentation, normalizeValue, parseCodeBlockHighlightLines, parseCodeBlockLineNumberStart, parseCodeBlockShowLineNumbers, parseLanguage, supportedLanguages, tokenizeMetastring };
@@ -1 +1 @@
1
- import{_ as e,a as t,c as n,d as r,f as i,g as a,h as o,l as s,m as c,n as l,o as u,p as d,s as f,u as p,v as m,x as h,y as g}from"./resolve-pre-rendered-props-DwIF_M_K.js";export{o as computeFoldRanges,m as computeJsonFoldRanges,e as decorateHighlightedHtml,h as defaultShowLineNumbers,g as finalizeFoldRanges,a as foldStrategyFor,d as inferIndentation,c as isIndentation,s as isSupportedLanguage,i as normalizeIndentation,l as normalizeValue,u as parseCodeBlockHighlightLines,f as parseCodeBlockLineNumberStart,n as parseCodeBlockShowLineNumbers,p as parseLanguage,r as supportedLanguages,t as tokenizeMetastring};
1
+ import{_ as e,a as t,c as n,d as r,f as i,g as a,h as o,l as s,m as c,n as l,o as u,p as d,s as f,u as p,v as m,x as h,y as g}from"./resolve-pre-rendered-props-C3e5Auo3.js";export{o as computeFoldRanges,m as computeJsonFoldRanges,e as decorateHighlightedHtml,h as defaultShowLineNumbers,g as finalizeFoldRanges,a as foldStrategyFor,d as inferIndentation,c as isIndentation,s as isSupportedLanguage,i as normalizeIndentation,l as normalizeValue,u as parseCodeBlockHighlightLines,f as parseCodeBlockLineNumberStart,n as parseCodeBlockShowLineNumbers,p as parseLanguage,r as supportedLanguages,t as tokenizeMetastring};
package/dist/code.d.ts CHANGED
@@ -1,5 +1,4 @@
1
- import { t as WithAsChild } from "./as-child-uN_018tj.js";
2
-
1
+ import { t as WithAsChild } from "./as-child-CYEVu1WY.js";
3
2
  //#region src/components/code/code.d.ts
4
3
  /**
5
4
  * Marks a short fragment of inline computer code — a function name, a
@@ -11,14 +10,14 @@ import { t as WithAsChild } from "./as-child-uN_018tj.js";
11
10
  * - Wrap technical terms that should visually stand apart from running text.
12
11
  *
13
12
  * **When not to use**
14
- * - For multi-line or syntax-highlighted blocks. Use {@link https://mantle.ngrok.com/components/code-block CodeBlock} instead.
15
- * - For keyboard shortcuts. Use {@link https://mantle.ngrok.com/components/kbd Kbd}.
13
+ * - For multi-line or syntax-highlighted blocks. Use {@link https://mantle.ngrok.com/components/data-display/code-block CodeBlock} instead.
14
+ * - For keyboard shortcuts. Use {@link https://mantle.ngrok.com/components/data-display/kbd Kbd}.
16
15
  * - For arbitrary monospace text that isn't code (use a plain monospace utility class).
17
16
  *
18
17
  * **Polymorphism.** Pass `asChild` to render `Code` styling on a different
19
18
  * element (e.g. a link wrapping a code-styled label).
20
19
  *
21
- * @see https://mantle.ngrok.com/components/code
20
+ * @see https://mantle.ngrok.com/components/data-display/code
22
21
  *
23
22
  * @example
24
23
  * ```tsx
package/dist/code.js CHANGED
@@ -1 +1 @@
1
- import{t as e}from"./cx-C1UYP5We.js";import{t}from"./slot-DT_E5BQx.js";import{forwardRef as n}from"react";import{jsx as r}from"react/jsx-runtime";const i=n(({asChild:n,className:i,...a},o)=>r(n?t:`code`,{ref:o,"data-slot":`code`,className:e(`border-gray-500/15 rounded-md border bg-gray-500/5 px-1 font-mono text-[0.8em]`,i),...a}));i.displayName=`Code`;export{i as Code};
1
+ import{t as e}from"./cx-IiQEAKf5.js";import{t}from"./slot-DmPrjM7N.js";import{forwardRef as n}from"react";import{jsx as r}from"react/jsx-runtime";const i=n(({asChild:n,className:i,...a},o)=>r(n?t:`code`,{ref:o,"data-slot":`code`,className:e(`border-gray-500/15 rounded-md border bg-gray-500/5 px-1 font-mono text-[0.8em]`,i),...a}));i.displayName=`Code`;export{i as Code};
@@ -1,9 +1,36 @@
1
- import { t as WithAsChild } from "./as-child-uN_018tj.js";
2
- import { o as WithValidation } from "./validation-xyX_6kph.js";
1
+ import { t as WithAsChild } from "./as-child-CYEVu1WY.js";
2
+ import { o as WithValidation } from "./validation-7QeiTFwl.js";
3
3
  import * as Primitive from "@ariakit/react";
4
-
5
4
  //#region src/components/combobox/combobox.d.ts
6
5
  type ComboboxProps = Primitive.ComboboxProviderProps;
6
+ /**
7
+ * Root component for a combobox. Provides a combobox store that controls the state of Combobox components.
8
+ *
9
+ * Use Combobox for a list of options where the user types to filter — large static lists,
10
+ * async/server-side data, or any single-select where search is helpful. For very small
11
+ * finite lists with no filtering, prefer Select. For multi-selection, prefer MultiSelect.
12
+ *
13
+ * `Combobox.Content` renders at Tailwind `z-50`, Mantle's shared floating
14
+ * z-index. When multiple shared layers are open, the most recently mounted
15
+ * layer renders on top.
16
+ *
17
+ * @see https://mantle.ngrok.com/components/forms/combobox#comboboxroot
18
+ *
19
+ * @example
20
+ * ```tsx
21
+ * <Combobox.Root>
22
+ * <Combobox.Input />
23
+ * <Combobox.Content>
24
+ * <Combobox.Item value="Apple" />
25
+ * <Combobox.Item value="Banana" />
26
+ * </Combobox.Content>
27
+ * </Combobox.Root>
28
+ * ```
29
+ */
30
+ declare const Root: {
31
+ ({ children, ...props }: ComboboxProps): import("react").JSX.Element;
32
+ displayName: string;
33
+ };
7
34
  type ComboboxInputProps = Omit<Primitive.ComboboxProps, "render"> & WithValidation;
8
35
  type ComboboxContentProps = Omit<Primitive.ComboboxPopoverProps, "render"> & WithAsChild;
9
36
  type ComboboxItemProps = Omit<Primitive.ComboboxItemProps, "render"> & WithAsChild;
@@ -27,7 +54,7 @@ type ComboboxItemValueProps = Omit<Primitive.ComboboxItemValueProps<"span">, "re
27
54
  * @see https://www.w3.org/WAI/ARIA/apg/patterns/combobox/
28
55
  * @see https://ariakit.org/components/combobox
29
56
  *
30
- * @see https://mantle.ngrok.com/components/combobox
57
+ * @see https://mantle.ngrok.com/components/forms/combobox
31
58
  *
32
59
  * @example
33
60
  * Composition:
@@ -65,7 +92,7 @@ declare const Combobox: {
65
92
  * z-index. When multiple shared layers are open, the most recently mounted
66
93
  * layer renders on top.
67
94
  *
68
- * @see https://mantle.ngrok.com/components/combobox#comboboxroot
95
+ * @see https://mantle.ngrok.com/components/forms/combobox#comboboxroot
69
96
  *
70
97
  * @example
71
98
  * ```tsx
@@ -78,13 +105,7 @@ declare const Combobox: {
78
105
  * </Combobox.Root>
79
106
  * ```
80
107
  */
81
- readonly Root: {
82
- ({
83
- children,
84
- ...props
85
- }: ComboboxProps): import("react").JSX.Element;
86
- displayName: string;
87
- };
108
+ readonly Root: typeof Root;
88
109
  /**
89
110
  * Renders a popover that contains combobox content, e.g. Combobox.Items, Combobox.Groups, and Combobox.Separators.
90
111
  *
@@ -92,7 +113,7 @@ declare const Combobox: {
92
113
  * z-index. When multiple shared layers are open, the most recently mounted
93
114
  * layer renders on top.
94
115
  *
95
- * @see https://mantle.ngrok.com/components/combobox#comboboxcontent
116
+ * @see https://mantle.ngrok.com/components/forms/combobox#comboboxcontent
96
117
  *
97
118
  * @example
98
119
  * ```tsx
@@ -109,7 +130,7 @@ declare const Combobox: {
109
130
  /**
110
131
  * Renders a group for Combobox.Item elements.
111
132
  *
112
- * @see https://mantle.ngrok.com/components/combobox#comboboxgroup
133
+ * @see https://mantle.ngrok.com/components/forms/combobox#comboboxgroup
113
134
  *
114
135
  * @example
115
136
  * ```tsx
@@ -129,7 +150,7 @@ declare const Combobox: {
129
150
  /**
130
151
  * Renders a label in a combobox group.
131
152
  *
132
- * @see https://mantle.ngrok.com/components/combobox#comboboxgrouplabel
153
+ * @see https://mantle.ngrok.com/components/forms/combobox#comboboxgrouplabel
133
154
  *
134
155
  * @example
135
156
  * ```tsx
@@ -149,7 +170,7 @@ declare const Combobox: {
149
170
  /**
150
171
  * Renders a combobox input element that can be used to filter a list of items.
151
172
  *
152
- * @see https://mantle.ngrok.com/components/combobox#comboboxinput
173
+ * @see https://mantle.ngrok.com/components/forms/combobox#comboboxinput
153
174
  *
154
175
  * @example
155
176
  * ```tsx
@@ -166,7 +187,7 @@ declare const Combobox: {
166
187
  /**
167
188
  * Renders a combobox item inside a Combobox.Content component.
168
189
  *
169
- * @see https://mantle.ngrok.com/components/combobox#comboboxitem
190
+ * @see https://mantle.ngrok.com/components/forms/combobox#comboboxitem
170
191
  *
171
192
  * @example
172
193
  * ```tsx
@@ -184,7 +205,7 @@ declare const Combobox: {
184
205
  /**
185
206
  * Highlights the match between the current Combobox.Input value and parent Combobox.Item value.
186
207
  *
187
- * @see https://mantle.ngrok.com/components/combobox#comboboxitemvalue
208
+ * @see https://mantle.ngrok.com/components/forms/combobox#comboboxitemvalue
188
209
  *
189
210
  * @example
190
211
  * ```tsx
@@ -207,7 +228,7 @@ declare const Combobox: {
207
228
  /**
208
229
  * Renders a separator between Combobox.Items or Combobox.Groups.
209
230
  *
210
- * @see https://mantle.ngrok.com/components/combobox#comboboxseparator
231
+ * @see https://mantle.ngrok.com/components/forms/combobox#comboboxseparator
211
232
  *
212
233
  * @example
213
234
  * ```tsx
package/dist/combobox.js CHANGED
@@ -1 +1 @@
1
- import{t as e}from"./cx-C1UYP5We.js";import{t}from"./slot-DT_E5BQx.js";import{a as n,r}from"./validation-DCyx-ceH.js";import{n as i}from"./separator-CqohKk4z.js";import{createContext as a,forwardRef as o}from"react";import{jsx as s}from"react/jsx-runtime";import*as c from"@ariakit/react";const l=({children:e,...t})=>s(c.ComboboxProvider,{...t,children:e});l.displayName=`Combobox`;const u=o(({"aria-invalid":t,autoComplete:i=`list`,autoSelect:a=`always`,className:o,validation:l,...u},d)=>{let f=n(),{ariaInvalid:p,validation:m}=r({"aria-invalid":t,validation:l??f});return s(c.Combobox,{"aria-invalid":p,autoComplete:i,autoSelect:a,"data-slot":`combobox-input`,className:e(`pointer-coarse:text-base h-9 text-sm`,`bg-form relative block w-full rounded-md border px-3 py-2 border-form text-strong font-sans`,`placeholder:text-placeholder`,`aria-disabled:opacity-50`,`hover:border-neutral-400`,`focus:outline-hidden focus:ring-4 aria-expanded:ring-4`,`focus:border-accent-600 focus:ring-focus-accent aria-expanded:border-accent-600 aria-expanded:ring-focus-accent`,`data-validation-success:border-success-600 data-validation-success:focus:border-success-600 data-validation-success:focus:ring-focus-success data-validation-success:aria-expanded:border-success-600 data-validation-success:aria-expanded:ring-focus-success`,`data-validation-warning:border-warning-600 data-validation-warning:focus:border-warning-600 data-validation-warning:focus:ring-focus-warning data-validation-warning:aria-expanded:border-warning-600 data-validation-warning:aria-expanded:ring-focus-warning`,`data-validation-error:border-danger-600 data-validation-error:focus:border-danger-600 data-validation-error:focus:ring-focus-danger data-validation-error:aria-expanded:border-danger-600 data-validation-error:aria-expanded:ring-focus-danger`,`autofill:shadow-(--color-blue-50) autofill:bg-blue-50 autofill:[-webkit-text-fill-color:var(--text-color-strong)]`,o),"data-validation":m||void 0,ref:d,...u})});u.displayName=`ComboboxInput`;const d=o(({asChild:n=!1,children:r,className:i,sameWidth:a=!0,unmountOnHide:o=!0,...l},u)=>s(c.ComboboxPopover,{"data-slot":`combobox-content`,className:e(`border-popover bg-popover relative z-50 max-h-96 min-w-32 scrollbar overflow-y-scroll overflow-x-hidden rounded-md border shadow-md p-1 my-2 space-y-px font-sans focus:outline-hidden`,i),ref:u,render:n?({ref:e,...n})=>s(t,{ref:e,...n}):void 0,sameWidth:a,unmountOnHide:o,...l,children:r}));d.displayName=`ComboboxContent`;const f=a(void 0),p=o(({asChild:n=!1,children:r,className:i,focusOnHover:a=!0,value:o,...l},u)=>s(f.Provider,{value:o,children:s(c.ComboboxItem,{"data-slot":`combobox-item`,className:e(`cursor-pointer rounded-md px-2 py-1.5 text-strong text-sm flex min-w-0 gap-2 items-center [&>svg]:size-5 [&_svg]:shrink-0`,`data-active-item:bg-active-menu-item`,`aria-disabled:opacity-50`,i),focusOnHover:a,ref:u,render:n?({ref:e,...n})=>s(t,{ref:e,...n}):void 0,value:o,...l,children:r})}));p.displayName=`ComboboxItem`;const m=o(({asChild:n=!1,children:r,className:i,...a},o)=>s(c.ComboboxGroup,{"data-slot":`combobox-group`,className:e(`space-y-px`,i),ref:o,render:n?({ref:e,...n})=>s(t,{ref:e,...n}):void 0,...a,children:r}));m.displayName=`ComboboxGroup`;const h=o(({asChild:n=!1,children:r,className:i,...a},o)=>s(c.ComboboxGroupLabel,{"data-slot":`combobox-group-label`,className:e(`text-muted px-2 py-1 text-xs font-medium`,i),ref:o,render:n?({ref:e,...n})=>s(t,{ref:e,...n}):void 0,...a,children:r}));h.displayName=`ComboboxGroupLabel`;const g=o(({asChild:n=!1,className:r,...i},a)=>s(c.ComboboxItemValue,{"data-slot":`combobox-item-value`,className:e(`*:data-user-value:font-medium flex-1 shrink-0 text-strong font-normal`,r),ref:a,render:n?({ref:e,...n})=>s(t,{ref:e,...n}):void 0,...i}));g.displayName=`ComboboxItemValue`;const _=o(({className:t,...n},r)=>s(i,{ref:r,"data-slot":`combobox-separator`,className:e(`-mx-1.25 my-1 w-auto`,t),...n}));_.displayName=`ComboboxSeparator`;const v={Root:l,Content:d,Group:m,GroupLabel:h,Input:u,Item:p,ItemValue:g,Separator:_};export{v as Combobox};
1
+ import{t as e}from"./cx-IiQEAKf5.js";import{t}from"./slot-DmPrjM7N.js";import{a as n,r}from"./validation-Bpptk_9t.js";import{n as i}from"./separator-kBnnv3Cw.js";import{createContext as a,forwardRef as o}from"react";import{jsx as s}from"react/jsx-runtime";import*as c from"@ariakit/react";const l=({children:e,...t})=>s(c.ComboboxProvider,{...t,children:e});l.displayName=`Combobox`;const u=o(({"aria-invalid":t,autoComplete:i=`list`,autoSelect:a=`always`,className:o,validation:l,...u},d)=>{let f=n(),{ariaInvalid:p,validation:m}=r({"aria-invalid":t,validation:l??f});return s(c.Combobox,{"aria-invalid":p,autoComplete:i,autoSelect:a,"data-slot":`combobox-input`,className:e(`pointer-coarse:text-base h-9 text-sm`,`bg-form relative block w-full rounded-md border px-3 py-2 border-form text-strong font-sans`,`placeholder:text-placeholder`,`aria-disabled:opacity-50`,`hover:border-neutral-400`,`focus:outline-hidden focus:ring-4 aria-expanded:ring-4`,`focus:border-accent-600 focus:ring-focus-accent aria-expanded:border-accent-600 aria-expanded:ring-focus-accent`,`data-validation-success:border-success-600 data-validation-success:focus:border-success-600 data-validation-success:focus:ring-focus-success data-validation-success:aria-expanded:border-success-600 data-validation-success:aria-expanded:ring-focus-success`,`data-validation-warning:border-warning-600 data-validation-warning:focus:border-warning-600 data-validation-warning:focus:ring-focus-warning data-validation-warning:aria-expanded:border-warning-600 data-validation-warning:aria-expanded:ring-focus-warning`,`data-validation-error:border-danger-600 data-validation-error:focus:border-danger-600 data-validation-error:focus:ring-focus-danger data-validation-error:aria-expanded:border-danger-600 data-validation-error:aria-expanded:ring-focus-danger`,`autofill:shadow-(--color-blue-50) autofill:bg-blue-50 autofill:[-webkit-text-fill-color:var(--text-color-strong)]`,o),"data-validation":m||void 0,ref:d,...u})});u.displayName=`ComboboxInput`;const d=o(({asChild:n=!1,children:r,className:i,sameWidth:a=!0,unmountOnHide:o=!0,...l},u)=>s(c.ComboboxPopover,{"data-slot":`combobox-content`,className:e(`border-popover bg-popover relative z-50 max-h-96 min-w-32 scrollbar overflow-y-scroll overflow-x-hidden rounded-md border shadow-md p-1 my-2 space-y-px font-sans focus:outline-hidden`,i),ref:u,render:n?({ref:e,...n})=>s(t,{ref:e,...n}):void 0,sameWidth:a,unmountOnHide:o,...l,children:r}));d.displayName=`ComboboxContent`;const f=a(void 0),p=o(({asChild:n=!1,children:r,className:i,focusOnHover:a=!0,value:o,...l},u)=>s(f.Provider,{value:o,children:s(c.ComboboxItem,{"data-slot":`combobox-item`,className:e(`cursor-pointer rounded-md px-2 py-1.5 text-strong text-sm flex min-w-0 gap-2 items-center [&>svg]:size-5 [&_svg]:shrink-0`,`data-active-item:bg-active-menu-item`,`aria-disabled:opacity-50`,i),focusOnHover:a,ref:u,render:n?({ref:e,...n})=>s(t,{ref:e,...n}):void 0,value:o,...l,children:r})}));p.displayName=`ComboboxItem`;const m=o(({asChild:n=!1,children:r,className:i,...a},o)=>s(c.ComboboxGroup,{"data-slot":`combobox-group`,className:e(`space-y-px`,i),ref:o,render:n?({ref:e,...n})=>s(t,{ref:e,...n}):void 0,...a,children:r}));m.displayName=`ComboboxGroup`;const h=o(({asChild:n=!1,children:r,className:i,...a},o)=>s(c.ComboboxGroupLabel,{"data-slot":`combobox-group-label`,className:e(`text-muted px-2 py-1 text-xs font-medium`,i),ref:o,render:n?({ref:e,...n})=>s(t,{ref:e,...n}):void 0,...a,children:r}));h.displayName=`ComboboxGroupLabel`;const g=o(({asChild:n=!1,className:r,...i},a)=>s(c.ComboboxItemValue,{"data-slot":`combobox-item-value`,className:e(`*:data-user-value:font-medium flex-1 shrink-0 text-strong font-normal`,r),ref:a,render:n?({ref:e,...n})=>s(t,{ref:e,...n}):void 0,...i}));g.displayName=`ComboboxItemValue`;const _=o(({className:t,...n},r)=>s(i,{ref:r,"data-slot":`combobox-separator`,className:e(`-mx-1.25 my-1 w-auto`,t),...n}));_.displayName=`ComboboxSeparator`;const v={Root:l,Content:d,Group:m,GroupLabel:h,Input:u,Item:p,ItemValue:g,Separator:_};export{v as Combobox};