@ngrok/mantle 0.76.11 → 0.77.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 (52) hide show
  1. package/dist/agent.json +4 -1
  2. package/dist/alert-dialog.js +1 -1
  3. package/dist/browser-only-CPH56Xw_.js +1 -0
  4. package/dist/browser-only.js +1 -1
  5. package/dist/checkbox-Apow0ipK.js +1 -0
  6. package/dist/checkbox.d.ts +4 -0
  7. package/dist/checkbox.js +1 -1
  8. package/dist/choice-D6S38dPs.js +1 -0
  9. package/dist/choice.d.ts +251 -0
  10. package/dist/choice.js +1 -0
  11. package/dist/code-block.js +1 -1
  12. package/dist/command.js +1 -1
  13. package/dist/{copy-to-clipboard-Baw30q9O.js → copy-to-clipboard-BsCQ9m6K.js} +1 -1
  14. package/dist/{dialog-Cp0S2jsG.js → dialog-uyJcNks7.js} +1 -1
  15. package/dist/dialog.js +1 -1
  16. package/dist/field.js +1 -1
  17. package/dist/hooks.d.ts +127 -67
  18. package/dist/hooks.js +1 -1
  19. package/dist/icons.js +1 -1
  20. package/dist/{in-view-BC3wmz-a.d.ts → in-view-bItE1fkG.d.ts} +20 -4
  21. package/dist/input-B3TS9yAP.js +1 -0
  22. package/dist/input.d.ts +1 -46
  23. package/dist/input.js +1 -1
  24. package/dist/label-PY0qM0G5.d.ts +69 -0
  25. package/dist/label.d.ts +1 -68
  26. package/dist/list.d.ts +337 -0
  27. package/dist/list.js +1 -0
  28. package/dist/llms.txt +4 -1
  29. package/dist/multi-select.js +1 -1
  30. package/dist/pagination.js +1 -1
  31. package/dist/{primitive-BFUir4UB.js → primitive-BuVqb6zf.js} +1 -1
  32. package/dist/{select-xfyY5Vt1.js → select-Bxq_N-_o.js} +1 -1
  33. package/dist/select.js +1 -1
  34. package/dist/selectable-list.d.ts +711 -0
  35. package/dist/selectable-list.js +1 -0
  36. package/dist/sheet.js +1 -1
  37. package/dist/switch.d.ts +4 -0
  38. package/dist/tabs.js +1 -1
  39. package/dist/{theme-provider-BNFS3Acf.js → theme-provider-C5XYi2-H.js} +1 -1
  40. package/dist/theme.d.ts +3 -3
  41. package/dist/theme.js +1 -1
  42. package/dist/{toast-Bwno5LUs.js → toast-CZBWjXcP.js} +1 -1
  43. package/dist/toast.js +1 -1
  44. package/dist/types-CTam1uIW.d.ts +47 -0
  45. package/dist/use-copy-to-clipboard-DqQ0_N3E.js +1 -0
  46. package/dist/{use-prefers-reduced-motion-CWIoFA6W.js → use-prefers-reduced-motion-DBqNw1wB.js} +1 -1
  47. package/dist/utils.d.ts +1 -1
  48. package/dist/utils.js +1 -1
  49. package/dist/virtual-PBNiHjMK.js +1 -0
  50. package/package.json +64 -332
  51. package/dist/browser-only-BSl_hruR.js +0 -1
  52. package/dist/use-copy-to-clipboard-BLpquU9d.js +0 -1
package/dist/agent.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ngrok/mantle",
3
- "version": "0.76.11",
3
+ "version": "0.77.0",
4
4
  "origin": "https://mantle.ngrok.com",
5
5
  "endpoints": {
6
6
  "docs": "https://mantle.ngrok.com/",
@@ -26,6 +26,7 @@
26
26
  "@ngrok/mantle/calendar",
27
27
  "@ngrok/mantle/card",
28
28
  "@ngrok/mantle/checkbox",
29
+ "@ngrok/mantle/choice",
29
30
  "@ngrok/mantle/code",
30
31
  "@ngrok/mantle/code-block",
31
32
  "@ngrok/mantle/color",
@@ -47,6 +48,7 @@
47
48
  "@ngrok/mantle/input",
48
49
  "@ngrok/mantle/kbd",
49
50
  "@ngrok/mantle/label",
51
+ "@ngrok/mantle/list",
50
52
  "@ngrok/mantle/main",
51
53
  "@ngrok/mantle/media-object",
52
54
  "@ngrok/mantle/multi-select",
@@ -58,6 +60,7 @@
58
60
  "@ngrok/mantle/radio-group",
59
61
  "@ngrok/mantle/sandboxed-on-click",
60
62
  "@ngrok/mantle/select",
63
+ "@ngrok/mantle/selectable-list",
61
64
  "@ngrok/mantle/separator",
62
65
  "@ngrok/mantle/sheet",
63
66
  "@ngrok/mantle/skeleton",
@@ -1 +1 @@
1
- import{t as e}from"./cx-C1UYP5We.js";import{t}from"./svg-only-CSOaF1tL.js";import{t as n}from"./slot-DT_E5BQx.js";import{t as r}from"./button-C9GW9nAr.js";import{a as i,c as a,i as o,n as s,o as c,r as l,s as u,t as d}from"./primitive-BFUir4UB.js";import{createContext as f,forwardRef as p,useContext as m,useMemo as h}from"react";import g from"tiny-invariant";import{jsx as _,jsxs as v}from"react/jsx-runtime";import{InfoIcon as y}from"@phosphor-icons/react/Info";import{WarningIcon as b}from"@phosphor-icons/react/Warning";const x=f(null);function S(){let e=m(x);return g(e,`AlertDialog child component used outside of AlertDialog parent!`),e}function C({priority:e,...t}){let n=h(()=>({priority:e}),[e]);return _(x.Provider,{value:n,children:_(c,{...t})})}C.displayName=`AlertDialog`;const w=p(({...e},t)=>_(a,{ref:t,"data-slot":`alert-dialog-trigger`,...e}));w.displayName=`AlertDialogTrigger`;const T=i;T.displayName=`AlertDialogPortal`;const E=p(({className:t,...n},r)=>_(o,{"data-slot":`alert-dialog-overlay`,className:e(`data-state-open:animate-in data-state-closed:animate-out data-state-closed:fade-out-0 data-state-open:fade-in-0 bg-overlay fixed inset-0 z-50 backdrop-blur-xs`,t),...n,ref:r}));E.displayName=`AlertDialogOverlay`;const D=p(({className:t,preferredWidth:n=`max-w-md`,...r},i)=>v(T,{children:[_(E,{}),_(`div`,{className:`fixed inset-4 z-50 flex items-center justify-center`,children:_(s,{"data-slot":`alert-dialog-content`,"data-mantle-modal-content":!0,ref:i,className:e(`flex w-full flex-1 flex-col items-center gap-4 sm:flex-row sm:items-start`,`outline-hidden focus-within:outline-hidden`,`p-6`,`border-dialog bg-dialog rounded-xl border shadow-lg transition-transform duration-200`,`data-state-closed:animate-out data-state-closed:fade-out-0 data-state-closed:zoom-out-95 data-state-open:animate-in data-state-open:fade-in-0 data-state-open:zoom-in-95`,n,t),...r})})]}));D.displayName=`AlertDialogContent`;const O=p(({asChild:t=!1,className:r,...i},a)=>_(t?n:`div`,{"data-slot":`alert-dialog-body`,className:e(`flex-1 space-y-4`,r),ref:a,...i}));O.displayName=`AlertDialogBody`;const k=p(({asChild:t=!1,className:r,...i},a)=>_(t?n:`div`,{"data-slot":`alert-dialog-header`,className:e(`flex flex-col space-y-2 text-center sm:text-start`,r),ref:a,...i}));k.displayName=`AlertDialogHeader`;const A=p(({asChild:t=!1,className:r,...i},a)=>_(t?n:`div`,{"data-slot":`alert-dialog-footer`,className:e(`flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2`,r),ref:a,...i}));A.displayName=`AlertDialogFooter`;const j=p(({className:t,...n},r)=>_(u,{ref:r,"data-slot":`alert-dialog-title`,className:e(`text-strong text-center text-lg font-medium sm:text-start`,t),...n}));j.displayName=`AlertDialogTitle`;const M=p(({className:t,...n},r)=>_(l,{ref:r,"data-slot":`alert-dialog-description`,className:e(`text-body text-center text-sm font-normal sm:text-start`,t),...n}));M.displayName=`AlertDialogDescription`;const N=p(({appearance:e=`filled`,...t},n)=>{let i=S(),a=`default`;return i.priority===`danger`&&(a=`danger`),_(r,{appearance:e,"data-slot":`alert-dialog-action`,priority:a,ref:n,...t})});N.displayName=`AlertDialogAction`;const P=p(({appearance:t=`outlined`,className:n,priority:i=`neutral`,...a},o)=>_(d,{asChild:!0,children:_(r,{appearance:t,"data-slot":`alert-dialog-cancel`,className:e(`mt-2 sm:mt-0`,n),priority:i,ref:o,...a})}));P.displayName=`AlertDialogCancel`;const F=p(({className:n,svg:r,...i},a)=>{let o=S(),s=o.priority===`danger`?`text-danger-600`:`text-accent-600`,c=o.priority===`danger`?_(b,{}):_(y,{});return _(t,{ref:a,"data-slot":`alert-dialog-icon`,className:e(`size-12 sm:size-7`,s,n),svg:r??c,...i})});F.displayName=`AlertDialogIcon`;const I=p(({...e},t)=>_(d,{ref:t,"data-slot":`alert-dialog-close`,...e}));I.displayName=`AlertDialogClose`;const L={Root:C,Action:N,Body:O,Cancel:P,Close:I,Content:D,Description:M,Footer:A,Header:k,Icon:F,Title:j,Trigger:w};export{L as AlertDialog};
1
+ import{t as e}from"./cx-C1UYP5We.js";import{t}from"./svg-only-CSOaF1tL.js";import{t as n}from"./slot-DT_E5BQx.js";import{t as r}from"./button-C9GW9nAr.js";import{a as i,c as a,i as o,n as s,o as c,r as l,s as u,t as d}from"./primitive-BuVqb6zf.js";import{createContext as f,forwardRef as p,useContext as m,useMemo as h}from"react";import g from"tiny-invariant";import{jsx as _,jsxs as v}from"react/jsx-runtime";import{InfoIcon as y}from"@phosphor-icons/react/Info";import{WarningIcon as b}from"@phosphor-icons/react/Warning";const x=f(null);function S(){let e=m(x);return g(e,`AlertDialog child component used outside of AlertDialog parent!`),e}function C({priority:e,...t}){let n=h(()=>({priority:e}),[e]);return _(x.Provider,{value:n,children:_(c,{...t})})}C.displayName=`AlertDialog`;const w=p(({...e},t)=>_(a,{ref:t,"data-slot":`alert-dialog-trigger`,...e}));w.displayName=`AlertDialogTrigger`;const T=i;T.displayName=`AlertDialogPortal`;const E=p(({className:t,...n},r)=>_(o,{"data-slot":`alert-dialog-overlay`,className:e(`data-state-open:animate-in data-state-closed:animate-out data-state-closed:fade-out-0 data-state-open:fade-in-0 bg-overlay fixed inset-0 z-50 backdrop-blur-xs`,t),...n,ref:r}));E.displayName=`AlertDialogOverlay`;const D=p(({className:t,preferredWidth:n=`max-w-md`,...r},i)=>v(T,{children:[_(E,{}),_(`div`,{className:`fixed inset-4 z-50 flex items-center justify-center`,children:_(s,{"data-slot":`alert-dialog-content`,"data-mantle-modal-content":!0,ref:i,className:e(`flex w-full flex-1 flex-col items-center gap-4 sm:flex-row sm:items-start`,`outline-hidden focus-within:outline-hidden`,`p-6`,`border-dialog bg-dialog rounded-xl border shadow-lg transition-transform duration-200`,`data-state-closed:animate-out data-state-closed:fade-out-0 data-state-closed:zoom-out-95 data-state-open:animate-in data-state-open:fade-in-0 data-state-open:zoom-in-95`,n,t),...r})})]}));D.displayName=`AlertDialogContent`;const O=p(({asChild:t=!1,className:r,...i},a)=>_(t?n:`div`,{"data-slot":`alert-dialog-body`,className:e(`flex-1 space-y-4`,r),ref:a,...i}));O.displayName=`AlertDialogBody`;const k=p(({asChild:t=!1,className:r,...i},a)=>_(t?n:`div`,{"data-slot":`alert-dialog-header`,className:e(`flex flex-col space-y-2 text-center sm:text-start`,r),ref:a,...i}));k.displayName=`AlertDialogHeader`;const A=p(({asChild:t=!1,className:r,...i},a)=>_(t?n:`div`,{"data-slot":`alert-dialog-footer`,className:e(`flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2`,r),ref:a,...i}));A.displayName=`AlertDialogFooter`;const j=p(({className:t,...n},r)=>_(u,{ref:r,"data-slot":`alert-dialog-title`,className:e(`text-strong text-center text-lg font-medium sm:text-start`,t),...n}));j.displayName=`AlertDialogTitle`;const M=p(({className:t,...n},r)=>_(l,{ref:r,"data-slot":`alert-dialog-description`,className:e(`text-body text-center text-sm font-normal sm:text-start`,t),...n}));M.displayName=`AlertDialogDescription`;const N=p(({appearance:e=`filled`,...t},n)=>{let i=S(),a=`default`;return i.priority===`danger`&&(a=`danger`),_(r,{appearance:e,"data-slot":`alert-dialog-action`,priority:a,ref:n,...t})});N.displayName=`AlertDialogAction`;const P=p(({appearance:t=`outlined`,className:n,priority:i=`neutral`,...a},o)=>_(d,{asChild:!0,children:_(r,{appearance:t,"data-slot":`alert-dialog-cancel`,className:e(`mt-2 sm:mt-0`,n),priority:i,ref:o,...a})}));P.displayName=`AlertDialogCancel`;const F=p(({className:n,svg:r,...i},a)=>{let o=S(),s=o.priority===`danger`?`text-danger-600`:`text-accent-600`,c=o.priority===`danger`?_(b,{}):_(y,{});return _(t,{ref:a,"data-slot":`alert-dialog-icon`,className:e(`size-12 sm:size-7`,s,n),svg:r??c,...i})});F.displayName=`AlertDialogIcon`;const I=p(({...e},t)=>_(d,{ref:t,"data-slot":`alert-dialog-close`,...e}));I.displayName=`AlertDialogClose`;const L={Root:C,Action:N,Body:O,Cancel:P,Close:I,Content:D,Description:M,Footer:A,Header:k,Icon:F,Title:j,Trigger:w};export{L as AlertDialog};
@@ -0,0 +1 @@
1
+ import{useSyncExternalStore as e}from"react";function t(){return()=>{}}function n(){return!0}function r(){return!1}function i(){return e(t,n,r)}function a({children:e,fallback:t=null}){return i()?e():t}function o(){return typeof window<`u`&&typeof document<`u`}export{o as n,i as r,a as t};
@@ -1 +1 @@
1
- import{n as e,t}from"./browser-only-BSl_hruR.js";export{t as BrowserOnly,e as canUseDOM};
1
+ import{n as e,t}from"./browser-only-CPH56Xw_.js";export{t as BrowserOnly,e as canUseDOM};
@@ -0,0 +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{d as n,u as t};
@@ -6,6 +6,10 @@ type CheckedState = boolean | "indeterminate";
6
6
  * A form control that allows the user to toggle between checked and not checked.
7
7
  * Supports indeterminate state.
8
8
  *
9
+ * Pair it with a [`Label`](/components/label) for a single-line caption, or
10
+ * compose it inside [`Choice`](/components/choice) for a titled, multi-line
11
+ * label with a supplementary description.
12
+ *
9
13
  * @see https://mantle.ngrok.com/components/checkbox
10
14
  *
11
15
  * @example
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-Apow0ipK.js";export{t as Checkbox,e as selectAllChecked};
@@ -0,0 +1 @@
1
+ import{t as e}from"./cx-C1UYP5We.js";import{t}from"./slot-DT_E5BQx.js";import{t as n}from"./field-context-4k1kI7Bo.js";import{t as r}from"./label-BLXfnQmn.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,251 @@
1
+ import { t as WithAsChild } from "./as-child-uN_018tj.js";
2
+ import { t as Label } from "./label-PY0qM0G5.js";
3
+ import { ComponentProps, ReactNode } from "react";
4
+
5
+ //#region src/components/choice/choice.d.ts
6
+ /**
7
+ * Props for `Choice.Root`. Extends `<div>` props (minus `id`, narrowed below)
8
+ * with the disabled / id / name controls. Inside a `Field.Control`, the field's
9
+ * `id` / `name` / `aria-*` take precedence over these.
10
+ *
11
+ * @see https://mantle.ngrok.com/components/choice
12
+ *
13
+ * @example
14
+ * ```tsx
15
+ * <Choice.Root name="notify">
16
+ * <Choice.Indicator>
17
+ * <Checkbox />
18
+ * </Choice.Indicator>
19
+ * <Choice.Content>
20
+ * <Choice.Label>Email</Choice.Label>
21
+ * <Choice.Description>Get notified by email.</Choice.Description>
22
+ * </Choice.Content>
23
+ * </Choice.Root>
24
+ * ```
25
+ */
26
+ type ChoiceRootProps = Omit<ComponentProps<"div">, "id"> & {
27
+ /** Marks the choice disabled — dims the text and is injected onto the control. */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; /** Form value name for the control. Inherited from `Field` when composed within one. */
34
+ name?: string; /** `Choice.Indicator`, a `Choice.Content` (with `Label` / `Title` + `Description`). */
35
+ children: ReactNode;
36
+ };
37
+ /**
38
+ * Root of a `Choice`: the indicator-left / content-right layout for pairing a
39
+ * checkbox or radio with a titled, multi-line label. Owns the control's `id` and the
40
+ * description's `id`, and — when rendered inside a `Field.Control` — reads the
41
+ * field's `id` / `name` / `aria-*` from `FieldControlContext` and merges them
42
+ * into the props `Indicator` injects onto the control (the field's
43
+ * `aria-describedby` is concatenated with this `Choice`'s own description id).
44
+ * Outside a `Field` it falls back to its own generated ids, so the two compose
45
+ * but neither requires the other.
46
+ *
47
+ * @see https://mantle.ngrok.com/components/choice
48
+ *
49
+ * @example
50
+ * ```tsx
51
+ * <Choice.Root name="notify">
52
+ * <Choice.Indicator>
53
+ * <Checkbox />
54
+ * </Choice.Indicator>
55
+ * <Choice.Content>
56
+ * <Choice.Label>Email</Choice.Label>
57
+ * <Choice.Description>Get notified by email.</Choice.Description>
58
+ * </Choice.Content>
59
+ * </Choice.Root>
60
+ * ```
61
+ */
62
+ declare const Root: import("react").ForwardRefExoticComponent<Omit<ChoiceRootProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
63
+ /**
64
+ * The left control slot of a `Choice` — drop the control here (a `Checkbox`, a
65
+ * radio indicator, a `Switch`, …). Its single element child is cloned with the
66
+ * shared `id` / `name` / `aria-*` / `disabled` from `Root`, so a control placed
67
+ * here is wired to `Choice.Label` and the description without the caller
68
+ * threading ids. A non-element child (or none) is rendered untouched.
69
+ *
70
+ * The slot is one line tall (`h-lh`) using the same `text-sm` line box as the
71
+ * title, and centers its child — so the control sits centered on the title's
72
+ * first line and stays put when the title wraps.
73
+ *
74
+ * @see https://mantle.ngrok.com/components/choice
75
+ *
76
+ * @example
77
+ * ```tsx
78
+ * <Choice.Root name="notify">
79
+ * <Choice.Indicator>
80
+ * <Checkbox />
81
+ * </Choice.Indicator>
82
+ * <Choice.Content>
83
+ * <Choice.Label>Email</Choice.Label>
84
+ * <Choice.Description>Get notified by email.</Choice.Description>
85
+ * </Choice.Content>
86
+ * </Choice.Root>
87
+ * ```
88
+ */
89
+ declare const Indicator: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & import("react").RefAttributes<HTMLSpanElement>>;
90
+ type ChoiceContentProps = ComponentProps<"div"> & WithAsChild;
91
+ /**
92
+ * The right column of a `Choice` — stacks a `Choice.Label` / `Choice.Title` over
93
+ * an optional `Choice.Description`. `min-w-0` so long titles truncate instead of
94
+ * pushing the row wide.
95
+ *
96
+ * @see https://mantle.ngrok.com/components/choice
97
+ *
98
+ * @example
99
+ * ```tsx
100
+ * <Choice.Root name="notify">
101
+ * <Choice.Indicator>
102
+ * <Checkbox />
103
+ * </Choice.Indicator>
104
+ * <Choice.Content>
105
+ * <Choice.Label>Email</Choice.Label>
106
+ * <Choice.Description>Get notified by email.</Choice.Description>
107
+ * </Choice.Content>
108
+ * </Choice.Root>
109
+ * ```
110
+ */
111
+ declare const Content: import("react").ForwardRefExoticComponent<Omit<ChoiceContentProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
112
+ /**
113
+ * Props for `Choice.Label`. The mantle `Label` props, minus `htmlFor` and
114
+ * `disabled` — those are owned by `Choice.Root` (the control id and the choice's
115
+ * disabled state) and are not part of the public surface, so consumer props can
116
+ * never override the label-to-control wiring.
117
+ */
118
+ type ChoiceLabelProps = Omit<ComponentProps<typeof Label>, "htmlFor" | "disabled">;
119
+ /**
120
+ * The emphasized title of a `Choice`, rendered as a real `<label>` wired to the
121
+ * control by `htmlFor`, so clicking it toggles the control and it supplies the
122
+ * control's accessible name. Use this when the `Choice` owns the labeling (a
123
+ * standalone checkbox, a raw `<form>`, React-state-only).
124
+ *
125
+ * It is the mantle {@link Label} (not a re-implementation), so it keeps every
126
+ * base-label behavior — cursor, the double-click text-selection guard, and the
127
+ * auto `font-medium` — and mirrors how `Field.Label` reuses `Label`. When an
128
+ * ancestor already owns the labeling and click target (a fully-clickable list
129
+ * row or a Headless radio item), use `Choice.Title` instead — a label-less `<p>`
130
+ * (it accepts `asChild`) — so labels never nest or compete.
131
+ *
132
+ * @see https://mantle.ngrok.com/components/choice
133
+ *
134
+ * @example
135
+ * ```tsx
136
+ * <Choice.Root name="notify">
137
+ * <Choice.Indicator>
138
+ * <Checkbox />
139
+ * </Choice.Indicator>
140
+ * <Choice.Content>
141
+ * <Choice.Label>Email</Choice.Label>
142
+ * <Choice.Description>Get notified by email.</Choice.Description>
143
+ * </Choice.Content>
144
+ * </Choice.Root>
145
+ * ```
146
+ */
147
+ declare const ChoiceLabel: import("react").ForwardRefExoticComponent<Omit<ChoiceLabelProps, "ref"> & import("react").RefAttributes<HTMLLabelElement>>;
148
+ /**
149
+ * The emphasized title of a `Choice`, label-styled but **not** a `<label>` —
150
+ * renders a `<p>`. Mirrors `Field.LabelText`. Use this when something else owns
151
+ * the control's labeling and click target: a fully-clickable list row or a
152
+ * Headless radio item. It avoids nesting two `<label>`s or splitting
153
+ * the click target. Pass `asChild` to supply your own element. For a standalone
154
+ * control — or inside a `Field` — where the title can be the label, use
155
+ * `Choice.Label`.
156
+ *
157
+ * @see https://mantle.ngrok.com/components/choice
158
+ *
159
+ * @example
160
+ * ```tsx
161
+ * <Choice.Root id="onboarding-key">
162
+ * <Choice.Indicator>
163
+ * <Checkbox />
164
+ * </Choice.Indicator>
165
+ * <Choice.Content>
166
+ * <Choice.Title>Onboarding Key</Choice.Title>
167
+ * <Choice.Description>ng-3FaThZL***8xiA</Choice.Description>
168
+ * </Choice.Content>
169
+ * </Choice.Root>
170
+ * ```
171
+ */
172
+ declare const Title: import("react").ForwardRefExoticComponent<Omit<import("react").ClassAttributes<HTMLParagraphElement> & import("react").HTMLAttributes<HTMLParagraphElement> & WithAsChild, "ref"> & import("react").RefAttributes<HTMLParagraphElement>>;
173
+ /**
174
+ * The de-emphasized supplementary line of a `Choice`, in the muted body color
175
+ * and wired to the control via `aria-describedby` (never a second label).
176
+ * Renders a `<p>`; pass `asChild` to supply your own element.
177
+ *
178
+ * @see https://mantle.ngrok.com/components/choice
179
+ *
180
+ * @example
181
+ * ```tsx
182
+ * <Choice.Root name="notify">
183
+ * <Choice.Indicator>
184
+ * <Checkbox />
185
+ * </Choice.Indicator>
186
+ * <Choice.Content>
187
+ * <Choice.Label>Email</Choice.Label>
188
+ * <Choice.Description>Get notified by email.</Choice.Description>
189
+ * </Choice.Content>
190
+ * </Choice.Root>
191
+ * ```
192
+ */
193
+ declare const Description: import("react").ForwardRefExoticComponent<Omit<import("react").ClassAttributes<HTMLParagraphElement> & import("react").HTMLAttributes<HTMLParagraphElement> & WithAsChild, "ref"> & import("react").RefAttributes<HTMLParagraphElement>>;
194
+ /**
195
+ * A reusable indicator-left / content-right layout for a single choice: a
196
+ * control (checkbox, radio, switch) beside an emphasized title and an optional
197
+ * de-emphasized description. Use it to pair a checkbox or radio with a rich,
198
+ * titled label, or reach for it directly to build your own choice-like rows.
199
+ *
200
+ * It is a pure layout + association primitive: it owns the control's `id` and
201
+ * the description's `id` and wires them together, but does **not** own the
202
+ * control's value — drop your own control into `Choice.Indicator`. Pick
203
+ * `Choice.Label` (a real `<label>`) when the `Choice` owns the labeling, or
204
+ * `Choice.Title` (label-less text) when an ancestor (a clickable row or a
205
+ * Headless radio item) already does.
206
+ *
207
+ * **Use it for choice-like layouts** — a checkbox or radio input that needs an
208
+ * associated label and an optional supplementary description. It is not a
209
+ * general-purpose layout primitive; for laying out non-control content, reach
210
+ * for a plain flex/grid or `MediaObject` instead.
211
+ *
212
+ * **Field interop.** Inside a `Field.Control`, `Choice.Root` reads the field's
213
+ * `id` / `name` / `aria-*` and merges its description into the control's
214
+ * `aria-describedby`. Outside a `Field` it uses its own generated ids — the two
215
+ * are aware of each other but neither is required.
216
+ *
217
+ * @see https://mantle.ngrok.com/components/choice
218
+ *
219
+ * @example
220
+ * Composition:
221
+ * ```
222
+ * Choice.Root
223
+ * ├── Choice.Indicator
224
+ * └── Choice.Content
225
+ * ├── Choice.Label (or Choice.Title — pick one)
226
+ * └── Choice.Description
227
+ * ```
228
+ *
229
+ * @example
230
+ * ```tsx
231
+ * <Choice.Root name="notify">
232
+ * <Choice.Indicator>
233
+ * <Checkbox />
234
+ * </Choice.Indicator>
235
+ * <Choice.Content>
236
+ * <Choice.Label>Email</Choice.Label>
237
+ * <Choice.Description>Get notified by email.</Choice.Description>
238
+ * </Choice.Content>
239
+ * </Choice.Root>
240
+ * ```
241
+ */
242
+ declare const Choice: {
243
+ Root: typeof Root;
244
+ Indicator: typeof Indicator;
245
+ Content: typeof Content;
246
+ Label: typeof ChoiceLabel;
247
+ Title: typeof Title;
248
+ Description: typeof Description;
249
+ };
250
+ //#endregion
251
+ export { Choice, type ChoiceRootProps };
package/dist/choice.js ADDED
@@ -0,0 +1 @@
1
+ import{t as e}from"./choice-D6S38dPs.js";export{e as Choice};
@@ -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-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-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-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(`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]===`
package/dist/command.js CHANGED
@@ -1 +1 @@
1
- import{t as e}from"./cx-C1UYP5We.js";import{n as t}from"./separator-CqohKk4z.js";import{t as n}from"./dialog-Cp0S2jsG.js";import{t as r}from"./kbd-D6k4Dnrf.js";import{forwardRef as i,useEffect as a,useState as o}from"react";import{jsx as s,jsxs as c}from"react/jsx-runtime";import{MagnifyingGlassIcon as l}from"@phosphor-icons/react/MagnifyingGlass";import{Command as u,useCommandState as d}from"cmdk";const f=i(({className:t,...n},r)=>s(u,{ref:r,"data-slot":`command`,className:e(`bg-popover flex h-full w-full flex-col overflow-hidden rounded-md`,t),...n}));f.displayName=`Command`;const p=({children:t,className:r,description:i=`Search for a command to run...`,filter:a,shouldFilter:o,showCloseButton:l=!0,title:u=`Command Palette`})=>c(n.Content,{className:e(`overflow-hidden p-0 relative`,r),children:[c(n.Header,{className:`sr-only absolute`,children:[s(n.Title,{children:u}),s(n.Description,{children:i})]}),s(f,{className:`**:data-[slot=command-input-wrapper]:h-12 **:[[cmdk-input]]:h-12 **:data-[slot=command-group]:px-2 **:data-[slot=command-list]:pb-1`,filter:a,shouldFilter:o,children:t}),l&&s(`div`,{className:`absolute top-1.5 right-1.5`,children:s(n.CloseIconButton,{})})]});p.displayName=`CommandDialogContent`;const m=i(({className:t,...n},r)=>c(`div`,{ref:r,"data-slot":`command-input-wrapper`,className:`flex h-9 items-center gap-2 border-b border-popover px-3`,children:[s(l,{className:`size-5 shrink-0 opacity-50`}),s(u.Input,{"data-slot":`command-input`,className:e(`placeholder:text-muted flex h-10 w-full rounded-md bg-transparent py-3 text-sm outline-hidden disabled:cursor-not-allowed disabled:opacity-50`,t),...n})]}));m.displayName=`CommandInput`;const h=i(({className:t,...n},r)=>s(u.List,{ref:r,"data-slot":`command-list`,className:e(`max-h-75 scroll-py-1 overflow-x-hidden overflow-y-auto scrollbar`,t),...n}));h.displayName=`CommandList`;const g=i(({className:t,...n},r)=>s(u.Empty,{ref:r,"data-slot":`command-empty`,className:e(`py-6 text-center text-sm`,t),...n}));g.displayName=`CommandEmpty`;const _=i(({className:t,...n},r)=>s(u.Group,{ref:r,"data-slot":`command-group`,className:e(`[&>[cmdk-group-heading]]:text-muted overflow-hidden p-1 [&>[cmdk-group-heading]]:px-2 [&>[cmdk-group-heading]]:py-1.5 [&>[cmdk-group-heading]]:text-xs [&>[cmdk-group-heading]]:font-medium`,t),...n}));_.displayName=`CommandGroup`;const v=i(({className:n,...r},i)=>s(u.Separator,{ref:i,"data-slot":`command-separator`,asChild:!0,...r,children:s(t,{className:e(`-mx-1 my-1 w-auto`,n)})}));v.displayName=`CommandSeparator`;const y=i(({className:t,...n},r)=>s(u.Item,{ref:r,"data-slot":`command-item`,className:e(`data-[selected=true]:bg-active-menu-item [:where(&_svg)]:text-muted relative flex cursor-pointer items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none data-[disabled=true]:pointer-events-none data-[disabled=true]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [:where(&_svg)]:size-5`,t),...n}));y.displayName=`CommandItem`;const b=i(({className:t,...n},r)=>s(`span`,{ref:r,"data-slot":`command-shortcut`,className:e(`text-muted ml-auto text-xs tracking-widest`,t),...n}));b.displayName=`CommandShortcut`;const x={Root:f,DialogRoot:n.Root,DialogTrigger:n.Trigger,DialogContent:p,Input:m,List:h,Empty:g,Group:_,Item:y,Shortcut:b,Separator:v};function S({className:t,...n}){let[i,l]=o(`⌃`);a(()=>{l(w())},[]);let u=i===`⌘`?`Command`:`Control`;return c(r,{...n,suppressHydrationWarning:!0,"data-slot":`meta-key`,className:e(i===`⌃`&&`font-medium`,t),children:[s(`span`,{className:`sr-only`,children:u}),i]})}function C(e){return`userAgentData`in e}function w(){if(typeof navigator>`u`)return`⌃`;let e=``;return C(navigator)&&(e=navigator.userAgentData.platform??``),e||=navigator.platform||navigator.userAgent||``,/mac|iphone|ipad|ipod/i.test(e)?`⌘`:`⌃`}export{x as Command,S as MetaKey,d as useCommandState};
1
+ import{t as e}from"./cx-C1UYP5We.js";import{n as t}from"./separator-CqohKk4z.js";import{t as n}from"./dialog-uyJcNks7.js";import{t as r}from"./kbd-D6k4Dnrf.js";import{forwardRef as i,useEffect as a,useState as o}from"react";import{jsx as s,jsxs as c}from"react/jsx-runtime";import{MagnifyingGlassIcon as l}from"@phosphor-icons/react/MagnifyingGlass";import{Command as u,useCommandState as d}from"cmdk";const f=i(({className:t,...n},r)=>s(u,{ref:r,"data-slot":`command`,className:e(`bg-popover flex h-full w-full flex-col overflow-hidden rounded-md`,t),...n}));f.displayName=`Command`;const p=({children:t,className:r,description:i=`Search for a command to run...`,filter:a,shouldFilter:o,showCloseButton:l=!0,title:u=`Command Palette`})=>c(n.Content,{className:e(`overflow-hidden p-0 relative`,r),children:[c(n.Header,{className:`sr-only absolute`,children:[s(n.Title,{children:u}),s(n.Description,{children:i})]}),s(f,{className:`**:data-[slot=command-input-wrapper]:h-12 **:[[cmdk-input]]:h-12 **:data-[slot=command-group]:px-2 **:data-[slot=command-list]:pb-1`,filter:a,shouldFilter:o,children:t}),l&&s(`div`,{className:`absolute top-1.5 right-1.5`,children:s(n.CloseIconButton,{})})]});p.displayName=`CommandDialogContent`;const m=i(({className:t,...n},r)=>c(`div`,{ref:r,"data-slot":`command-input-wrapper`,className:`flex h-9 items-center gap-2 border-b border-popover px-3`,children:[s(l,{className:`size-5 shrink-0 opacity-50`}),s(u.Input,{"data-slot":`command-input`,className:e(`placeholder:text-muted flex h-10 w-full rounded-md bg-transparent py-3 text-sm outline-hidden disabled:cursor-not-allowed disabled:opacity-50`,t),...n})]}));m.displayName=`CommandInput`;const h=i(({className:t,...n},r)=>s(u.List,{ref:r,"data-slot":`command-list`,className:e(`max-h-75 scroll-py-1 overflow-x-hidden overflow-y-auto scrollbar`,t),...n}));h.displayName=`CommandList`;const g=i(({className:t,...n},r)=>s(u.Empty,{ref:r,"data-slot":`command-empty`,className:e(`py-6 text-center text-sm`,t),...n}));g.displayName=`CommandEmpty`;const _=i(({className:t,...n},r)=>s(u.Group,{ref:r,"data-slot":`command-group`,className:e(`[&>[cmdk-group-heading]]:text-muted overflow-hidden p-1 [&>[cmdk-group-heading]]:px-2 [&>[cmdk-group-heading]]:py-1.5 [&>[cmdk-group-heading]]:text-xs [&>[cmdk-group-heading]]:font-medium`,t),...n}));_.displayName=`CommandGroup`;const v=i(({className:n,...r},i)=>s(u.Separator,{ref:i,"data-slot":`command-separator`,asChild:!0,...r,children:s(t,{className:e(`-mx-1 my-1 w-auto`,n)})}));v.displayName=`CommandSeparator`;const y=i(({className:t,...n},r)=>s(u.Item,{ref:r,"data-slot":`command-item`,className:e(`data-[selected=true]:bg-active-menu-item [:where(&_svg)]:text-muted relative flex cursor-pointer items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none data-[disabled=true]:pointer-events-none data-[disabled=true]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [:where(&_svg)]:size-5`,t),...n}));y.displayName=`CommandItem`;const b=i(({className:t,...n},r)=>s(`span`,{ref:r,"data-slot":`command-shortcut`,className:e(`text-muted ml-auto text-xs tracking-widest`,t),...n}));b.displayName=`CommandShortcut`;const x={Root:f,DialogRoot:n.Root,DialogTrigger:n.Trigger,DialogContent:p,Input:m,List:h,Empty:g,Group:_,Item:y,Shortcut:b,Separator:v};function S({className:t,...n}){let[i,l]=o(`⌃`);a(()=>{l(w())},[]);let u=i===`⌘`?`Command`:`Control`;return c(r,{...n,suppressHydrationWarning:!0,"data-slot":`meta-key`,className:e(i===`⌃`&&`font-medium`,t),children:[s(`span`,{className:`sr-only`,children:u}),i]})}function C(e){return`userAgentData`in e}function w(){if(typeof navigator>`u`)return`⌃`;let e=``;return C(navigator)&&(e=navigator.userAgentData.platform??``),e||=navigator.platform||navigator.userAgent||``,/mac|iphone|ipad|ipod/i.test(e)?`⌘`:`⌃`}export{x as Command,S as MetaKey,d as useCommandState};
@@ -1 +1 @@
1
- import{n as e}from"./browser-only-BSl_hruR.js";async function t(t){if(!e())throw Error(`copyToClipboard requires a DOM environment`);try{if(typeof navigator.clipboard?.writeText==`function`)await navigator.clipboard.writeText(t);else throw Error(`writeText not supported`)}catch(e){try{n(t)}catch{throw e}}}function n(e){let t=document.createElement(`textarea`);t.value=e,document.body.appendChild(t);try{if(t.select(),!document.execCommand(`copy`))throw Error(`document.execCommand("copy") failed`)}finally{document.body.removeChild(t)}}export{t};
1
+ import{n as e}from"./browser-only-CPH56Xw_.js";async function t(t){if(!e())throw Error(`copyToClipboard requires a DOM environment`);try{if(typeof navigator.clipboard?.writeText==`function`)await navigator.clipboard.writeText(t);else throw Error(`writeText not supported`)}catch(e){try{n(t)}catch{throw e}}}function n(e){let t=document.createElement(`textarea`);t.value=e,document.body.appendChild(t);try{if(t.select(),!document.execCommand(`copy`))throw Error(`document.execCommand("copy") failed`)}finally{document.body.removeChild(t)}}export{t};
@@ -1 +1 @@
1
- import{t as e}from"./cx-C1UYP5We.js";import{t}from"./icon-button-DiX9iZ9n.js";import{a as n,c as r,i,n as a,o,r as s,s as c,t as l}from"./primitive-BFUir4UB.js";import{forwardRef as u}from"react";import{jsx as d,jsxs as f}from"react/jsx-runtime";import{XIcon as p}from"@phosphor-icons/react/X";const m=o;m.displayName=`Dialog`;const h=u((e,t)=>d(r,{ref:t,"data-slot":`dialog-trigger`,...e}));h.displayName=`DialogTrigger`;const g=n;g.displayName=`DialogPortal`;const _=u((e,t)=>d(l,{ref:t,"data-slot":`dialog-close`,...e}));_.displayName=`DialogClose`;const v=u(({className:t,...n},r)=>d(i,{ref:r,"data-slot":`dialog-overlay`,className:e(`bg-overlay data-state-closed:animate-out data-state-closed:fade-out-0 data-state-open:animate-in data-state-open:fade-in-0 fixed inset-0 z-50 backdrop-blur-xs`,t),...n}));v.displayName=`DialogOverlay`;const y=u(({children:t,className:n,preferredWidth:r=`max-w-lg`,...i},o)=>f(g,{children:[d(v,{}),d(`div`,{className:`fixed inset-4 z-50 flex items-center justify-center`,children:d(a,{"data-mantle-modal-content":!0,"data-slot":`dialog-content`,className:e(`flex max-h-full w-full flex-1 flex-col`,`outline-hidden focus-within:outline-hidden`,`border-dialog bg-dialog rounded-xl border shadow-lg transition-transform duration-200`,`data-state-closed:animate-out data-state-closed:fade-out-0 data-state-closed:zoom-out-95 data-state-open:animate-in data-state-open:fade-in-0 data-state-open:zoom-in-95`,r,n),ref:o,...i,children:t})})]}));y.displayName=`DialogContent`;const b=({className:t,children:n,...r})=>d(`div`,{"data-slot":`dialog-header`,className:e(`border-dialog-muted text-strong relative flex shrink-0 items-center justify-between gap-2 border-b px-6 py-4`,`has-[.icon-button]:pr-4`,t),...r,children:n});b.displayName=`DialogHeader`;const x=({size:e=`md`,type:n=`button`,label:r=`Close Dialog`,appearance:i=`ghost`,...a})=>d(l,{asChild:!0,children:d(t,{appearance:i,"data-slot":`dialog-close-icon-button`,icon:d(p,{}),label:r,size:e,type:n,...a})});x.displayName=`DialogCloseIconButton`;const S=({className:t,...n})=>d(`div`,{"data-slot":`dialog-body`,className:e(`scrollbar scrollbar-gutter-stable text-body flex-1 overflow-y-auto p-6`,t),...n});S.displayName=`DialogBody`;const C=({className:t,...n})=>d(`div`,{"data-slot":`dialog-footer`,className:e(`border-dialog-muted flex shrink-0 justify-end gap-2 border-t px-6 py-4`,t),...n});C.displayName=`DialogFooter`;const w=u(({className:t,...n},r)=>d(c,{ref:r,"data-slot":`dialog-title`,className:e(`text-strong truncate text-lg font-medium`,t),...n}));w.displayName=`DialogTitle`;const T=u(({className:t,...n},r)=>d(s,{ref:r,"data-slot":`dialog-description`,className:e(`text-muted`,t),...n}));T.displayName=`DialogDescription`;const E={Root:m,Body:S,Close:_,CloseIconButton:x,Content:y,Description:T,Footer:C,Header:b,Overlay:v,Portal:g,Title:w,Trigger:h};export{E as t};
1
+ import{t as e}from"./cx-C1UYP5We.js";import{t}from"./icon-button-DiX9iZ9n.js";import{a as n,c as r,i,n as a,o,r as s,s as c,t as l}from"./primitive-BuVqb6zf.js";import{forwardRef as u}from"react";import{jsx as d,jsxs as f}from"react/jsx-runtime";import{XIcon as p}from"@phosphor-icons/react/X";const m=o;m.displayName=`Dialog`;const h=u((e,t)=>d(r,{ref:t,"data-slot":`dialog-trigger`,...e}));h.displayName=`DialogTrigger`;const g=n;g.displayName=`DialogPortal`;const _=u((e,t)=>d(l,{ref:t,"data-slot":`dialog-close`,...e}));_.displayName=`DialogClose`;const v=u(({className:t,...n},r)=>d(i,{ref:r,"data-slot":`dialog-overlay`,className:e(`bg-overlay data-state-closed:animate-out data-state-closed:fade-out-0 data-state-open:animate-in data-state-open:fade-in-0 fixed inset-0 z-50 backdrop-blur-xs`,t),...n}));v.displayName=`DialogOverlay`;const y=u(({children:t,className:n,preferredWidth:r=`max-w-lg`,...i},o)=>f(g,{children:[d(v,{}),d(`div`,{className:`fixed inset-4 z-50 flex items-center justify-center`,children:d(a,{"data-mantle-modal-content":!0,"data-slot":`dialog-content`,className:e(`flex max-h-full w-full flex-1 flex-col`,`outline-hidden focus-within:outline-hidden`,`border-dialog bg-dialog rounded-xl border shadow-lg transition-transform duration-200`,`data-state-closed:animate-out data-state-closed:fade-out-0 data-state-closed:zoom-out-95 data-state-open:animate-in data-state-open:fade-in-0 data-state-open:zoom-in-95`,r,n),ref:o,...i,children:t})})]}));y.displayName=`DialogContent`;const b=({className:t,children:n,...r})=>d(`div`,{"data-slot":`dialog-header`,className:e(`border-dialog-muted text-strong relative flex shrink-0 items-center justify-between gap-2 border-b px-6 py-4`,`has-[.icon-button]:pr-4`,t),...r,children:n});b.displayName=`DialogHeader`;const x=({size:e=`md`,type:n=`button`,label:r=`Close Dialog`,appearance:i=`ghost`,...a})=>d(l,{asChild:!0,children:d(t,{appearance:i,"data-slot":`dialog-close-icon-button`,icon:d(p,{}),label:r,size:e,type:n,...a})});x.displayName=`DialogCloseIconButton`;const S=({className:t,...n})=>d(`div`,{"data-slot":`dialog-body`,className:e(`scrollbar scrollbar-gutter-stable text-body flex-1 overflow-y-auto p-6`,t),...n});S.displayName=`DialogBody`;const C=({className:t,...n})=>d(`div`,{"data-slot":`dialog-footer`,className:e(`border-dialog-muted flex shrink-0 justify-end gap-2 border-t px-6 py-4`,t),...n});C.displayName=`DialogFooter`;const w=u(({className:t,...n},r)=>d(c,{ref:r,"data-slot":`dialog-title`,className:e(`text-strong truncate text-lg font-medium`,t),...n}));w.displayName=`DialogTitle`;const T=u(({className:t,...n},r)=>d(s,{ref:r,"data-slot":`dialog-description`,className:e(`text-muted`,t),...n}));T.displayName=`DialogDescription`;const E={Root:m,Body:S,Close:_,CloseIconButton:x,Content:y,Description:T,Footer:C,Header:b,Overlay:v,Portal:g,Title:w,Trigger:h};export{E as t};
package/dist/dialog.js CHANGED
@@ -1 +1 @@
1
- import{l as e}from"./primitive-BFUir4UB.js";import{t}from"./dialog-Cp0S2jsG.js";export{t as Dialog,e as isDialogOverlayTarget};
1
+ import{l as e}from"./primitive-BuVqb6zf.js";import{t}from"./dialog-uyJcNks7.js";export{t as Dialog,e as isDialogOverlayTarget};
package/dist/field.js CHANGED
@@ -1 +1 @@
1
- import{t as e}from"./use-isomorphic-layout-effect-DdTRtMY-.js";import{t}from"./cx-C1UYP5We.js";import{t as n}from"./slot-DT_E5BQx.js";import{t as r}from"./icon-button-DiX9iZ9n.js";import{i,n as a,r as o,t as s}from"./validation-DCyx-ceH.js";import{t as c}from"./label-BLXfnQmn.js";import{t as l}from"./popover-Bq52EC7X.js";import{n as u,r as d,t as f}from"./field-context-4k1kI7Bo.js";import{Children as p,Fragment as m,cloneElement as h,forwardRef as g,isValidElement as _,useCallback as v,useContext as y,useId as b,useMemo as x,useState as S}from"react";import C from"tiny-invariant";import{jsx as w}from"react/jsx-runtime";import{QuestionIcon as T}from"@phosphor-icons/react/Question";const E=e=>{let t=[],n=new Set;for(let r of e??[]){if(typeof r!=`string`)continue;let e=r.trim();e.length===0||n.has(e)||(n.add(e),t.push(e))}return t},D=e=>!(e==null||typeof e==`boolean`||typeof e==`string`&&e.trim().length===0),O=({children:e,errorItemType:t})=>{let n=!1;return p.forEach(e,e=>{if(!(n||e==null||typeof e==`boolean`)){if(typeof e==`string`){e.trim().length>0&&(n=!0);return}if(!_(e)){n=!0;return}if(e.type===t){n=D(e.props.children);return}if(e.type===m){n=O({children:e.props.children,errorItemType:t});return}n=!0}}),n},k=g(({className:e,...n},r)=>w(`fieldset`,{ref:r,"data-slot":`field-set`,className:t(`flex w-full min-w-0 flex-col gap-4 border-0 p-0`,e),...n}));k.displayName=`FieldSet`;const A=g(({className:e,...n},r)=>w(`legend`,{ref:r,"data-slot":`field-legend`,className:t(`text-strong mb-1.5 text-sm font-medium font-sans`,e),...n}));A.displayName=`FieldLegend`;const j=g(({htmlFor:e,...t},n)=>{let r=y(u);return w(c,{ref:n,htmlFor:e??r?.controlId,...t})});j.displayName=`FieldLabel`;const M=g(({asChild:e,className:r,...i},a)=>w(e?n:`p`,{ref:a,"data-slot":`field-label-text`,className:t(`text-strong text-sm font-medium font-sans`,r),...i}));M.displayName=`FieldLabelText`;const N=g(({asChild:e,className:r,...i},a)=>w(e?n:`div`,{ref:a,"data-slot":`field-label-row`,className:t(`flex items-center gap-1`,r),...i}));N.displayName=`FieldLabelRow`;const P=l.Root,F=w(T,{}),I=g(({appearance:e=`ghost`,className:n,icon:i=F,label:a,size:o=`xs`,type:s=`button`,...c},u)=>w(l.Trigger,{asChild:!0,children:w(r,{ref:u,appearance:e,className:t(`text-body -my-0.5`,n),icon:i,label:a,size:o,type:s,...c})}));I.displayName=`FieldHelpTrigger`;const L=g((e,t)=>w(l.Content,{ref:t,"data-slot":`field-help-content`,...e}));L.displayName=`FieldHelpContent`;const R=g(({asChild:e,children:r,className:i,...a},o)=>w(e?n:`span`,{ref:o,"data-slot":`field-optional`,className:t(`text-muted text-sm font-normal font-sans`,i),...a,children:r??`(Optional)`}));R.displayName=`FieldOptional`;const z=g(({asChild:e,className:r,...i},a)=>w(e?n:`div`,{ref:a,"data-slot":`field-group`,className:t(`flex w-full flex-col gap-4`,r),...i}));z.displayName=`FieldGroup`;const B=g(({asChild:e,children:r,className:a,name:o,validation:c,...l},d)=>{let f=e?n:`div`,p=b(),m=b(),h=b(),[g,_]=S(!1),y=i(c??(g?`error`:void 0)),C=v(()=>(_(!0),()=>{_(!1)}),[]),T=x(()=>({controlId:p,descriptionId:m,errorId:h,hasErrors:g,name:o,registerError:C,validation:y}),[p,m,h,g,o,C,y]);return w(u.Provider,{value:T,children:w(s,{validation:y,children:w(f,{ref:d,"data-slot":`field-item`,"data-validation":y,className:t(`flex w-full flex-col gap-1.5`,a),...l,children:r})})})});B.displayName=`FieldItem`;const V=g(({children:e,...t},r)=>{let i=y(u),a=d({context:i});return typeof e==`function`?w(s,{validation:a.validation,children:w(f.Provider,{value:i?a.ariaProps:null,children:e(a.ariaProps)})}):(C(_(e),`Field.Control expects a single React element child (or a render-prop function). Got a non-element value (string, array, fragment, null, or undefined). Wrap the control in a single element, or use the function child form: <Field.Control>{(props) => <YourControl {...props} />}</Field.Control>.`),w(s,{validation:a.validation,children:w(f.Provider,{value:i?a.ariaProps:null,children:w(n,{ref:r,...t,children:h(e,a.ariaProps)})})}))});V.displayName=`FieldControl`;const H=g(({asChild:e,className:r,...i},a)=>w(e?n:`p`,{ref:a,"data-slot":`field-description`,id:y(u)?.descriptionId,className:t(`text-body text-sm leading-4`,`[:where([data-slot=field-error-list]+&)]:-mt-1.5`,r),...i}));H.displayName=`FieldDescription`;const U=g(({children:e,className:n,...r},i)=>D(e)?w(`li`,{ref:i,"data-slot":`field-error`,className:t(`text-danger-600 text-sm leading-4`,n),...r,children:e}):null);U.displayName=`FieldErrorItem`;const W=g(({messages:e,...t},n)=>w(G,{ref:n,...t,children:E(e).map(e=>w(U,{children:e},e))}));W.displayName=`FieldErrors`;const G=g(({asChild:r,children:i,className:a,...o},s)=>{let c=O({children:i,errorItemType:U}),l=y(u),d=l?.registerError;return e(()=>{if(!(!c||d==null))return d()},[c,d]),c?w(r?n:`ul`,{ref:s,"data-slot":`field-error-list`,id:l?.errorId,role:`list`,className:t(`m-0 flex w-full flex-col list-none p-0`,a),...o,children:i}):null});G.displayName=`FieldErrorList`;const K={Item:B,Control:V,Group:z,Set:k,Legend:A,Label:j,LabelText:M,LabelRow:N,Help:P,HelpTrigger:I,HelpContent:L,Optional:R,Description:H,Errors:W,ErrorList:G,ErrorItem:U},q=e=>E(e?.map(e=>typeof e==`string`||!e?e:e.message));export{K as Field,a as isAriaInvalid,o as parseValidation,i as resolveValidation,q as toErrorMessages};
1
+ import{t as e}from"./use-isomorphic-layout-effect-DdTRtMY-.js";import{t}from"./cx-C1UYP5We.js";import{t as n}from"./slot-DT_E5BQx.js";import{t as r}from"./icon-button-DiX9iZ9n.js";import{i,n as a,r as o,t as s}from"./validation-DCyx-ceH.js";import{n as c,r as l,t as u}from"./field-context-4k1kI7Bo.js";import{t as d}from"./label-BLXfnQmn.js";import{t as f}from"./popover-Bq52EC7X.js";import{Children as p,Fragment as m,cloneElement as h,forwardRef as g,isValidElement as _,useCallback as v,useContext as y,useId as b,useMemo as x,useState as S}from"react";import C from"tiny-invariant";import{jsx as w}from"react/jsx-runtime";import{QuestionIcon as T}from"@phosphor-icons/react/Question";const E=e=>{let t=[],n=new Set;for(let r of e??[]){if(typeof r!=`string`)continue;let e=r.trim();e.length===0||n.has(e)||(n.add(e),t.push(e))}return t},D=e=>!(e==null||typeof e==`boolean`||typeof e==`string`&&e.trim().length===0),O=({children:e,errorItemType:t})=>{let n=!1;return p.forEach(e,e=>{if(!(n||e==null||typeof e==`boolean`)){if(typeof e==`string`){e.trim().length>0&&(n=!0);return}if(!_(e)){n=!0;return}if(e.type===t){n=D(e.props.children);return}if(e.type===m){n=O({children:e.props.children,errorItemType:t});return}n=!0}}),n},k=g(({className:e,...n},r)=>w(`fieldset`,{ref:r,"data-slot":`field-set`,className:t(`flex w-full min-w-0 flex-col gap-4 border-0 p-0`,e),...n}));k.displayName=`FieldSet`;const A=g(({className:e,...n},r)=>w(`legend`,{ref:r,"data-slot":`field-legend`,className:t(`text-strong mb-1.5 text-sm font-medium font-sans`,e),...n}));A.displayName=`FieldLegend`;const j=g(({htmlFor:e,...t},n)=>{let r=y(c);return w(d,{ref:n,htmlFor:e??r?.controlId,...t})});j.displayName=`FieldLabel`;const M=g(({asChild:e,className:r,...i},a)=>w(e?n:`p`,{ref:a,"data-slot":`field-label-text`,className:t(`text-strong text-sm font-medium font-sans`,r),...i}));M.displayName=`FieldLabelText`;const N=g(({asChild:e,className:r,...i},a)=>w(e?n:`div`,{ref:a,"data-slot":`field-label-row`,className:t(`flex items-center gap-1`,r),...i}));N.displayName=`FieldLabelRow`;const P=f.Root,F=w(T,{}),I=g(({appearance:e=`ghost`,className:n,icon:i=F,label:a,size:o=`xs`,type:s=`button`,...c},l)=>w(f.Trigger,{asChild:!0,children:w(r,{ref:l,appearance:e,className:t(`text-body -my-0.5`,n),icon:i,label:a,size:o,type:s,...c})}));I.displayName=`FieldHelpTrigger`;const L=g((e,t)=>w(f.Content,{ref:t,"data-slot":`field-help-content`,...e}));L.displayName=`FieldHelpContent`;const R=g(({asChild:e,children:r,className:i,...a},o)=>w(e?n:`span`,{ref:o,"data-slot":`field-optional`,className:t(`text-muted text-sm font-normal font-sans`,i),...a,children:r??`(Optional)`}));R.displayName=`FieldOptional`;const z=g(({asChild:e,className:r,...i},a)=>w(e?n:`div`,{ref:a,"data-slot":`field-group`,className:t(`flex w-full flex-col gap-4`,r),...i}));z.displayName=`FieldGroup`;const B=g(({asChild:e,children:r,className:a,name:o,validation:l,...u},d)=>{let f=e?n:`div`,p=b(),m=b(),h=b(),[g,_]=S(!1),y=i(l??(g?`error`:void 0)),C=v(()=>(_(!0),()=>{_(!1)}),[]),T=x(()=>({controlId:p,descriptionId:m,errorId:h,hasErrors:g,name:o,registerError:C,validation:y}),[p,m,h,g,o,C,y]);return w(c.Provider,{value:T,children:w(s,{validation:y,children:w(f,{ref:d,"data-slot":`field-item`,"data-validation":y,className:t(`flex w-full flex-col gap-1.5`,a),...u,children:r})})})});B.displayName=`FieldItem`;const V=g(({children:e,...t},r)=>{let i=y(c),a=l({context:i});return typeof e==`function`?w(s,{validation:a.validation,children:w(u.Provider,{value:i?a.ariaProps:null,children:e(a.ariaProps)})}):(C(_(e),`Field.Control expects a single React element child (or a render-prop function). Got a non-element value (string, array, fragment, null, or undefined). Wrap the control in a single element, or use the function child form: <Field.Control>{(props) => <YourControl {...props} />}</Field.Control>.`),w(s,{validation:a.validation,children:w(u.Provider,{value:i?a.ariaProps:null,children:w(n,{ref:r,...t,children:h(e,a.ariaProps)})})}))});V.displayName=`FieldControl`;const H=g(({asChild:e,className:r,...i},a)=>w(e?n:`p`,{ref:a,"data-slot":`field-description`,id:y(c)?.descriptionId,className:t(`text-body text-sm leading-4`,`[:where([data-slot=field-error-list]+&)]:-mt-1.5`,r),...i}));H.displayName=`FieldDescription`;const U=g(({children:e,className:n,...r},i)=>D(e)?w(`li`,{ref:i,"data-slot":`field-error`,className:t(`text-danger-600 text-sm leading-4`,n),...r,children:e}):null);U.displayName=`FieldErrorItem`;const W=g(({messages:e,...t},n)=>w(G,{ref:n,...t,children:E(e).map(e=>w(U,{children:e},e))}));W.displayName=`FieldErrors`;const G=g(({asChild:r,children:i,className:a,...o},s)=>{let l=O({children:i,errorItemType:U}),u=y(c),d=u?.registerError;return e(()=>{if(!(!l||d==null))return d()},[l,d]),l?w(r?n:`ul`,{ref:s,"data-slot":`field-error-list`,id:u?.errorId,role:`list`,className:t(`m-0 flex w-full flex-col list-none p-0`,a),...o,children:i}):null});G.displayName=`FieldErrorList`;const K={Item:B,Control:V,Group:z,Set:k,Legend:A,Label:j,LabelText:M,LabelRow:N,Help:P,HelpTrigger:I,HelpContent:L,Optional:R,Description:H,Errors:W,ErrorList:G,ErrorItem:U},q=e=>E(e?.map(e=>typeof e==`string`||!e?e:e.message));export{K as Field,a as isAriaInvalid,o as parseValidation,i as resolveValidation,q as toErrorMessages};