@ngrok/mantle 0.57.1 → 0.57.3
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.
- package/assets/mantle.css +2 -7
- package/dist/accordion.js +1 -1
- package/dist/alert-dialog.js +1 -1
- package/dist/alert.js +1 -1
- package/dist/anchor.js +1 -1
- package/dist/badge.js +1 -1
- package/dist/button.js +1 -1
- package/dist/calendar.js +1 -1
- package/dist/card.js +1 -1
- package/dist/{chunk-NPTDRQT5.js → chunk-6Y2VYL62.js} +2 -2
- package/dist/chunk-EZZ6SKYQ.js +2 -0
- package/dist/{chunk-T5U5KWUW.js → chunk-GBXNMVEO.js} +2 -2
- package/dist/{chunk-3H3EUKI7.js → chunk-GC7PLMDA.js} +2 -2
- package/dist/{chunk-M32D7HYM.js → chunk-J25T6WVI.js} +2 -2
- package/dist/{chunk-EBW5W235.js → chunk-OXGP2BVP.js} +2 -2
- package/dist/{chunk-HEDEMKFP.js → chunk-OY2IJ2ZI.js} +2 -2
- package/dist/chunk-Q4HHIW35.js +2 -0
- package/dist/chunk-Q4HHIW35.js.map +1 -0
- package/dist/{chunk-J6ZF5J72.js → chunk-RECDN726.js} +2 -2
- package/dist/{chunk-5TI54DZZ.js → chunk-T4AM2PHQ.js} +2 -2
- package/dist/{chunk-F4JGJRR5.js → chunk-WIE557RC.js} +2 -2
- package/dist/{chunk-4R4RBAKU.js → chunk-WR57IFOM.js} +2 -2
- package/dist/chunk-WR57IFOM.js.map +1 -0
- package/dist/code-block.d.ts +1 -1
- package/dist/code-block.js +3 -3
- package/dist/code-block.js.map +1 -1
- package/dist/code.js +1 -1
- package/dist/combobox.js +1 -1
- package/dist/command.js +1 -1
- package/dist/cx.js +1 -1
- package/dist/data-table.js +1 -1
- package/dist/dialog.js +1 -1
- package/dist/dropdown-menu.js +1 -1
- package/dist/flag.js +1 -1
- package/dist/hover-card.js +1 -1
- package/dist/icon.js +1 -1
- package/dist/icons.js +1 -1
- package/dist/input.js +1 -1
- package/dist/label.js +1 -1
- package/dist/media-object.js +1 -1
- package/dist/pagination.js +1 -1
- package/dist/popover.js +1 -1
- package/dist/progress.js +1 -1
- package/dist/radio-group.js +1 -1
- package/dist/select.js +1 -1
- package/dist/separator.js +1 -1
- package/dist/sheet.js +1 -1
- package/dist/skeleton.js +1 -1
- package/dist/switch.js +1 -1
- package/dist/table.js +1 -1
- package/dist/tabs.js +1 -1
- package/dist/text-area.js +1 -1
- package/dist/theme.js +1 -1
- package/dist/toast.js +1 -1
- package/dist/tooltip.js +1 -1
- package/package.json +1 -1
- package/dist/chunk-4R4RBAKU.js.map +0 -1
- package/dist/chunk-AZ56JGNY.js +0 -2
- package/dist/chunk-AZ56JGNY.js.map +0 -1
- package/dist/chunk-I6T6YV2L.js +0 -2
- /package/dist/{chunk-NPTDRQT5.js.map → chunk-6Y2VYL62.js.map} +0 -0
- /package/dist/{chunk-I6T6YV2L.js.map → chunk-EZZ6SKYQ.js.map} +0 -0
- /package/dist/{chunk-T5U5KWUW.js.map → chunk-GBXNMVEO.js.map} +0 -0
- /package/dist/{chunk-3H3EUKI7.js.map → chunk-GC7PLMDA.js.map} +0 -0
- /package/dist/{chunk-M32D7HYM.js.map → chunk-J25T6WVI.js.map} +0 -0
- /package/dist/{chunk-EBW5W235.js.map → chunk-OXGP2BVP.js.map} +0 -0
- /package/dist/{chunk-HEDEMKFP.js.map → chunk-OY2IJ2ZI.js.map} +0 -0
- /package/dist/{chunk-J6ZF5J72.js.map → chunk-RECDN726.js.map} +0 -0
- /package/dist/{chunk-5TI54DZZ.js.map → chunk-T4AM2PHQ.js.map} +0 -0
- /package/dist/{chunk-F4JGJRR5.js.map → chunk-WIE557RC.js.map} +0 -0
package/assets/mantle.css
CHANGED
|
@@ -1194,8 +1194,8 @@
|
|
|
1194
1194
|
|
|
1195
1195
|
--breakpoint-xs: 30rem;
|
|
1196
1196
|
|
|
1197
|
-
--text-
|
|
1198
|
-
--text-
|
|
1197
|
+
--text-mono: 0.8125rem;
|
|
1198
|
+
--text-mono--line-height: 1.25rem;
|
|
1199
1199
|
|
|
1200
1200
|
--shadow-sm: 0px 1px 2px 0
|
|
1201
1201
|
--alpha(var(--shadow-color) / var(--shadow-first-opacity));
|
|
@@ -1353,11 +1353,6 @@
|
|
|
1353
1353
|
cursor: inherit;
|
|
1354
1354
|
}
|
|
1355
1355
|
|
|
1356
|
-
@utility text-size-mono {
|
|
1357
|
-
line-height: 1.25rem;
|
|
1358
|
-
font-size: var(--text-size-mono);
|
|
1359
|
-
}
|
|
1360
|
-
|
|
1361
1356
|
@utility scrollbar {
|
|
1362
1357
|
scrollbar-color: --alpha(var(--color-neutral-800) / 50%) transparent;
|
|
1363
1358
|
|
package/dist/accordion.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{a}from"./chunk-
|
|
1
|
+
import{a}from"./chunk-EZZ6SKYQ.js";import"./chunk-6Y2VYL62.js";import{a as r}from"./chunk-Q4HHIW35.js";import{CaretDownIcon as A}from"@phosphor-icons/react/CaretDown";import*as o from"@radix-ui/react-accordion";import{forwardRef as c}from"react";import{jsx as n}from"react/jsx-runtime";var p=c(({className:e,...i},t)=>n(o.Root,{ref:t,className:r("w-full space-y-2.5",e),...i}));p.displayName="Accordion";var d=o.Item;d.displayName="AccordionItem";var s=c(({className:e,...i},t)=>n(o.Header,{ref:t,className:r("flex items-center gap-2",e),...i}));s.displayName="AccordionHeading";var f=c(({className:e,children:i,...t},m)=>n(o.Trigger,{ref:m,className:r("group flex items-center gap-1.5",e),...t,children:i}));f.displayName="AccordionTrigger";var g=({className:e,...i})=>n(a,{...i,svg:n(A,{weight:"fill"}),className:r("group-data-state-open:rotate-0 -rotate-90",e)});g.displayName="AccordionTriggerIcon";var l=c(({className:e,children:i,...t},m)=>n(o.Content,{ref:m,className:r("data-state-closed:animate-accordion-up data-state-open:animate-accordion-down overflow-hidden pt-4",e),...t,children:i}));l.displayName="AccordionContent";var P={Root:p,Content:l,Heading:s,Item:d,Trigger:f,TriggerIcon:g};export{P as Accordion};
|
|
2
2
|
//# sourceMappingURL=accordion.js.map
|
package/dist/alert-dialog.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{a as y,b as A,c as u,d,e as D,f as C,g as P,h as v}from"./chunk-VIKPHWPP.js";import{d as c}from"./chunk-
|
|
1
|
+
import{a as y,b as A,c as u,d,e as D,f as C,g as P,h as v}from"./chunk-VIKPHWPP.js";import{d as c}from"./chunk-J25T6WVI.js";import"./chunk-WIE557RC.js";import"./chunk-6J7D73WA.js";import"./chunk-NJNFZ2EG.js";import"./chunk-KMNACVH6.js";import{a as m}from"./chunk-GBXNMVEO.js";import"./chunk-4LSFAAZW.js";import"./chunk-72TJUKMV.js";import"./chunk-3C5O3AQA.js";import"./chunk-EZZ6SKYQ.js";import{a as g}from"./chunk-6Y2VYL62.js";import{a}from"./chunk-Q4HHIW35.js";import{InfoIcon as H}from"@phosphor-icons/react/Info";import{WarningIcon as k}from"@phosphor-icons/react/Warning";import{Slot as f}from"@radix-ui/react-slot";import{createContext as M,forwardRef as n,useContext as $,useMemo as q}from"react";import E from"tiny-invariant";import{jsx as i,jsxs as J}from"react/jsx-runtime";var x=M(null);function N(){let t=$(x);return E(t,"AlertDialog child component used outside of AlertDialog parent!"),t}function h({priority:t,...e}){let o=q(()=>({priority:t}),[t]);return i(x.Provider,{value:o,children:i(y,{...e})})}h.displayName="AlertDialog";var R=A;R.displayName="AlertDialogTrigger";var b=u;b.displayName="AlertDialogPortal";var W=n(({className:t,...e},o)=>i(D,{className:a("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),...e,ref:o}));W.displayName="AlertDialogOverlay";var I=n(({className:t,onInteractOutside:e,onPointerDownOutside:o,preferredWidth:l="max-w-md",...r},p)=>J(b,{children:[i(W,{}),i("div",{className:"fixed inset-4 z-50 flex items-center justify-center",children:i(C,{ref:p,className:a("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",l,t),onInteractOutside:s=>{c(s),e?.(s)},onPointerDownOutside:s=>{c(s),o?.(s)},...r})})]}));I.displayName="AlertDialogContent";var O=n(({asChild:t=!1,className:e,...o},l)=>i(t?f:"div",{className:a("flex-1 space-y-4",e),ref:l,...o}));O.displayName="AlertDialogBody";var w=n(({asChild:t=!1,className:e,...o},l)=>i(t?f:"div",{className:a("flex flex-col space-y-2 text-center sm:text-start",e),...o}));w.displayName="AlertDialogHeader";var B=n(({asChild:t=!1,className:e,...o},l)=>i(t?f:"div",{className:a("flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2",e),...o}));B.displayName="AlertDialogFooter";var T=n(({className:t,...e},o)=>i(P,{ref:o,className:a("text-strong text-center text-lg font-medium sm:text-start",t),...e}));T.displayName="AlertDialogTitle";var z=n(({className:t,...e},o)=>i(v,{ref:o,className:a("text-body text-center text-sm font-normal sm:text-start",t),...e}));z.displayName="AlertDialogDescription";var S=n(({appearance:t="filled",...e},o)=>{let l=N(),r="default";return l.priority==="danger"&&(r="danger"),i(m,{appearance:t,priority:r,ref:o,...e})});S.displayName="AlertDialogAction";var j=n(({appearance:t="outlined",className:e,priority:o="neutral",...l},r)=>i(d,{asChild:!0,children:i(m,{appearance:t,className:a("mt-2 sm:mt-0",e),priority:o,ref:r,...l})}));j.displayName="AlertDialogCancel";var V=n(({className:t,svg:e,...o},l)=>{let r=N(),p=r.priority==="danger"?"text-danger-600":"text-accent-600",s=r.priority==="danger"?i(k,{}):i(H,{});return i(g,{ref:l,className:a("size-12 sm:size-7",p,t),svg:e??s,...o})});V.displayName="AlertDialogIcon";var F=d;F.displayName="AlertDialogClose";var G={Root:h,Action:S,Body:O,Cancel:j,Close:F,Content:I,Description:z,Footer:B,Header:w,Icon:V,Title:T,Trigger:R};export{G as AlertDialog};
|
|
2
2
|
//# sourceMappingURL=alert-dialog.js.map
|
package/dist/alert.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{c as d}from"./chunk-
|
|
1
|
+
import{c as d}from"./chunk-T4AM2PHQ.js";import"./chunk-4LSFAAZW.js";import"./chunk-72TJUKMV.js";import"./chunk-3C5O3AQA.js";import"./chunk-EZZ6SKYQ.js";import{a as l}from"./chunk-6Y2VYL62.js";import{a as i}from"./chunk-Q4HHIW35.js";import{CheckCircleIcon as C}from"@phosphor-icons/react/CheckCircle";import{InfoIcon as P}from"@phosphor-icons/react/Info";import{WarningIcon as I}from"@phosphor-icons/react/Warning";import{WarningDiamondIcon as N}from"@phosphor-icons/react/WarningDiamond";import{XIcon as h}from"@phosphor-icons/react/X";import{Slot as m}from"@radix-ui/react-slot";import{cva as w}from"class-variance-authority";import{createContext as R,forwardRef as c,useContext as D,useMemo as T}from"react";import B from"tiny-invariant";import{jsx as r}from"react/jsx-runtime";var u=R(null);function f(){let t=D(u);return B(t,"useAlertContext hook used outside of Alert parent!"),t}var H=w("relative flex w-full gap-1.5 rounded-md border p-2.5 text-sm",{variants:{priority:{danger:"border-danger-500/50 bg-danger-500/10 text-danger-700",info:"border-accent-500/50 bg-accent-500/10 text-accent-700",success:"border-success-500/50 bg-success-500/10 text-success-700",warning:"border-warning-500/50 bg-warning-500/10 text-warning-700"},appearance:{banner:"border-x-0 border-t-0 rounded-none z-50 sticky",default:""}},compoundVariants:[{priority:"danger",appearance:"banner",className:""},{priority:"info",appearance:"banner",className:""},{priority:"success",appearance:"banner",className:""},{priority:"warning",appearance:"banner",className:""}]}),g=c(({appearance:t="default",className:o,priority:e,...n},s)=>{let a=T(()=>({priority:e}),[e]);return r(u.Provider,{value:a,children:r("div",{ref:s,className:i(H({appearance:t,priority:e}),o),...n})})});g.displayName="Alert";var M={danger:r(I,{}),info:r(P,{}),success:r(C,{}),warning:r(N,{})},y=c(({className:t,svg:o,...e},n)=>{let s=f(),a=M[s.priority];return r(l,{ref:n,className:i("size-5",t),svg:o??a,...e})});y.displayName="AlertIcon";var x=c(({className:t,...o},e)=>r("div",{ref:e,className:i("min-w-0 flex-1 has-[[data-alert-dismiss]]:pr-6",t),...o}));x.displayName="AlertContent";var A=c(({asChild:t=!1,className:o,...e},n)=>r(t?m:"h5",{ref:n,className:i("font-medium",o),...e}));A.displayName="AlertTitle";var b=c(({asChild:t=!1,className:o,...e},n)=>r(t?m:"div",{ref:n,className:i("text-sm",o),...e}));b.displayName="AlertDescription";var v=({size:t="sm",type:o="button",label:e="Dismiss Alert",appearance:n="ghost",className:s,...a})=>{let p=f();return r(d,{appearance:n,icon:r(h,{}),label:e,size:t,"data-alert-dismiss":!0,className:i("right-1.5 top-1.5 absolute",{"text-danger-700 not-disabled:hover:text-danger-800 not-disabled:active:text-danger-900":p.priority==="danger","text-accent-700 not-disabled:hover:text-accent-800 not-disabled:active:text-accent-900":p.priority==="info","text-success-700 not-disabled:hover:text-success-800 not-disabled:active:text-success-900":p.priority==="success","text-warning-700 not-disabled:hover:text-warning-800 not-disabled:active:text-warning-900":p.priority==="warning"},s),type:o,...a})};v.displayName="AlertDismissIconButton";var V={Root:g,Content:x,Description:b,DismissIconButton:v,Icon:y,Title:A};export{V as Alert};
|
|
2
2
|
//# sourceMappingURL=alert.js.map
|
package/dist/anchor.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{a as t}from"./chunk-
|
|
1
|
+
import{a as t}from"./chunk-EZZ6SKYQ.js";import"./chunk-6Y2VYL62.js";import{a as m}from"./chunk-Q4HHIW35.js";import{Slot as y}from"@radix-ui/react-slot";import{Children as b,cloneElement as v,forwardRef as N,isValidElement as C}from"react";import x from"tiny-invariant";import{Fragment as T,jsx as n,jsxs as p}from"react/jsx-runtime";var d=r=>m("cursor-pointer rounded bg-transparent text-accent-600 hover:underline focus:outline-hidden focus-visible:ring-3 focus-visible:ring-focus-accent",r),u=N(({asChild:r,children:s,className:a,rel:l,icon:e,iconPlacement:o="start",...h},g)=>{let A=f(l),c={className:d(a),ref:g,rel:A,...h};if(r){let i=b.only(s);x(C(i),"When using `asChild`, Anchor must be passed a single child as a JSX tag.");let R=i.props?.children;return n(y,{...c,children:v(i,{},p(T,{children:[e&&o==="start"&&n(t,{className:"inline-block mr-1.5",svg:e}),R,e&&o==="end"&&n(t,{className:"inline-block ml-1.5",svg:e})]}))})}return p("a",{...c,children:[e&&o==="start"&&n(t,{className:"inline-block mr-1.5",svg:e}),s,e&&o==="end"&&n(t,{className:"inline-block ml-1.5",svg:e})]})});u.displayName="Anchor";function f(r){return Array.isArray(r)?[...new Set(r)].map(l=>l?.trim()).filter(Boolean).sort().join(" ")||void 0:r?.trim()||void 0}export{u as Anchor,d as anchorClassNames,f as resolveRel};
|
|
2
2
|
//# sourceMappingURL=anchor.js.map
|
package/dist/badge.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{a as o}from"./chunk-
|
|
1
|
+
import{a as o}from"./chunk-6Y2VYL62.js";import{a as c}from"./chunk-Q4HHIW35.js";import{Slot as f}from"@radix-ui/react-slot";import{Children as C,cloneElement as h,isValidElement as k}from"react";import n from"tiny-invariant";import{Fragment as P,jsx as s,jsxs as d}from"react/jsx-runtime";var m=({appearance:t,asChild:e=!1,children:l,className:u,color:g="neutral",icon:r,...i})=>{let b=B(g,t),x=N(g,t),p=c("inline-flex w-fit shrink-0 cursor-default items-center gap-1 rounded px-1.5 py-0.5 font-medium text-xs",r&&"ps-1",b,x,u);if(e){let a=C.only(l);n(k(a),"When using `asChild`, Badge must be passed a single child as a JSX tag.");let y=a.props?.children;return s(f,{className:p,...i,children:h(a,{},d(P,{children:[r&&s(o,{className:"size-4",svg:r}),y]}))})}return d("span",{className:p,...i,children:[r&&s(o,{className:"size-4",svg:r}),l]})};m.displayName="Badge";var w={amber:"bg-amber-500/20",blue:"bg-blue-500/20",cyan:"bg-cyan-500/20",emerald:"bg-emerald-500/20",fuchsia:"bg-fuchsia-500/20",gray:"bg-gray-500/20",green:"bg-green-500/20",indigo:"bg-indigo-500/20",lime:"bg-lime-500/20",orange:"bg-orange-500/20",pink:"bg-pink-500/20",purple:"bg-purple-500/20",red:"bg-red-500/20",rose:"bg-rose-500/20",sky:"bg-sky-500/20",teal:"bg-teal-500/20",violet:"bg-violet-500/20",yellow:"bg-yellow-500/20",accent:"bg-accent-500/20",danger:"bg-danger-500/20",neutral:"bg-neutral-500/20",success:"bg-success-500/20",warning:"bg-warning-500/20"};function B(t,e){switch(e){case"muted":return w[t];default:n(!1,`Invalid appearance: ${String(e)}`)}}var v={amber:"text-amber-700",blue:"text-blue-700",cyan:"text-cyan-700",emerald:"text-emerald-700",fuchsia:"text-fuchsia-700",gray:"text-gray-700",green:"text-green-700",indigo:"text-indigo-700",lime:"text-lime-700",orange:"text-orange-700",pink:"text-pink-700",purple:"text-purple-700",red:"text-red-700",rose:"text-rose-700",sky:"text-sky-700",teal:"text-teal-700",violet:"text-violet-700",yellow:"text-yellow-700",accent:"text-accent-700",danger:"text-danger-700",neutral:"text-neutral-700",success:"text-success-700",warning:"text-warning-700"};function N(t,e){switch(e){case"muted":return v[t];default:n(!1,`Invalid appearance: ${String(e)}`)}}export{m as Badge};
|
|
2
2
|
//# sourceMappingURL=badge.js.map
|
package/dist/button.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{a as c}from"./chunk-
|
|
1
|
+
import{a as c}from"./chunk-GC7PLMDA.js";import{c as a}from"./chunk-T4AM2PHQ.js";import{a as b}from"./chunk-GBXNMVEO.js";import"./chunk-4LSFAAZW.js";import"./chunk-72TJUKMV.js";import"./chunk-3C5O3AQA.js";import"./chunk-EZZ6SKYQ.js";import"./chunk-6Y2VYL62.js";import"./chunk-Q4HHIW35.js";export{b as Button,c as ButtonGroup,a as IconButton};
|
|
2
2
|
//# sourceMappingURL=button.js.map
|
package/dist/calendar.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{a,b as o}from"./chunk-
|
|
1
|
+
import{a,b as o}from"./chunk-T4AM2PHQ.js";import"./chunk-4LSFAAZW.js";import"./chunk-72TJUKMV.js";import"./chunk-3C5O3AQA.js";import{a as r}from"./chunk-EZZ6SKYQ.js";import"./chunk-6Y2VYL62.js";import{a as e}from"./chunk-Q4HHIW35.js";import{CaretLeftIcon as p}from"@phosphor-icons/react/CaretLeft";import{CaretRightIcon as f}from"@phosphor-icons/react/CaretRight";import{DayPicker as u}from"react-day-picker";import{jsx as t}from"react/jsx-runtime";function d({className:l,classNames:s,showOutsideDays:i=!1,...n}){return t(u,{animate:!1,components:{Chevron:c=>{let m=c.orientation==="left"?t(p,{}):t(f,{});return t(r,{svg:m,className:"size-4"})}},classNames:{root:e("isolate",l),button_next:e(a,o({appearance:"ghost",size:"sm"}),"absolute right-0"),button_previous:e(a,o({appearance:"ghost",size:"sm"}),"absolute left-0"),caption_label:"text-sm font-medium",day:e("overflow-hidden text-center text-sm p-0 relative focus-within:relative focus-within:z-20 size-7 rounded-md",n.mode==="range"?"first:has-aria-selected:rounded-l-md last:has-aria-selected:rounded-r-md":""),day_button:"day size-full rounded-md not-aria-selected:not-disabled:hover:bg-filled-accent/15",disabled:"text-muted opacity-50",hidden:"invisible",month:"space-y-4",month_caption:"flex justify-center pt-1 relative items-center",month_grid:"w-full border-collapse space-y-1",months:"flex flex-col sm:flex-row gap-y-4 sm:gap-x-4 sm:gap-y-0 relative max-w-min",nav:"flex items-center absolute inset-x-0 top-1 h-5 justify-between z-10",outside:"day-outside aria-selected:text-on-filled opacity-50 text-muted",range_end:"day-range-end [&:not(.day-range-start)]:rounded-l-none",range_middle:"day-range-middle not-disabled:aria-selected:bg-filled-accent/15 aria-selected:text-strong rounded-none not-disabled:aria-selected:hover:bg-filled-accent/25",range_start:"day-range-start [&:not(.day-range-end)]:rounded-r-none",selected:"not-disabled:bg-filled-accent text-on-filled not-disabled:hover:bg-filled-accent",today:"not-aria-selected:not-disabled:text-accent-600 font-medium not-aria-selected:not-disabled:bg-filled-accent/10 rounded-md",week:"flex w-full mt-1",weekday:"text-body w-7 text-[0.8rem] text-center font-normal",weekdays:"flex",...s},showOutsideDays:i,...n})}d.displayName="Calendar";export{d as Calendar};
|
|
2
2
|
//# sourceMappingURL=calendar.js.map
|
package/dist/card.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{a as n}from"./chunk-
|
|
1
|
+
import{a as n}from"./chunk-Q4HHIW35.js";import{Slot as p}from"@radix-ui/react-slot";import{forwardRef as s}from"react";import{jsx as a}from"react/jsx-runtime";var C=s(({asChild:o=!1,className:r,children:e,...t},d)=>a(o?p:"div",{ref:d,className:n("border-card bg-card relative rounded-md border",r),...t,children:e}));C.displayName="Card";var i=s(({asChild:o=!1,className:r,children:e,...t},d)=>a(o?p:"div",{ref:d,className:n("p-6 border-t border-card-muted first:border-t-0",r),...t,children:e}));i.displayName="CardBody";var f=s(({asChild:o=!1,className:r,children:e,...t},d)=>a(o?p:"div",{ref:d,className:n("px-6 py-3 border-t border-card-muted first:border-t-0",r),...t,children:e}));f.displayName="CardFooter";var l=s(({asChild:o=!1,className:r,children:e,...t},d)=>a(o?p:"div",{ref:d,className:n("px-6 py-3 border-t border-card-muted first:border-t-0",r),...t,children:e}));l.displayName="CardHeader";var c=s(({className:o,asChild:r,...e},t)=>a(r?p:"h3",{ref:t,className:n("text-strong text-base font-medium",o),...e}));c.displayName="CardTitle";var y={Root:C,Body:i,Footer:f,Header:l,Title:c};export{y as Card};
|
|
2
2
|
//# sourceMappingURL=card.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{a as t}from"./chunk-
|
|
2
|
-
//# sourceMappingURL=chunk-
|
|
1
|
+
import{a as t}from"./chunk-Q4HHIW35.js";import{Children as s,cloneElement as i,forwardRef as l,isValidElement as m}from"react";import a from"tiny-invariant";var y=l(({className:r,style:o,svg:e,...n},p)=>(a(m(e)&&s.only(e),"SvgOnly must be passed a single SVG icon as a JSX tag."),i(e,{...n,className:t("shrink-0",r,e.props.className),style:{...o,...e.props.style},ref:p})));y.displayName="SvgOnly";export{y as a};
|
|
2
|
+
//# sourceMappingURL=chunk-6Y2VYL62.js.map
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{a as e}from"./chunk-6Y2VYL62.js";import{a as o}from"./chunk-Q4HHIW35.js";import{forwardRef as n}from"react";import{jsx as f}from"react/jsx-runtime";var c=n(({className:t,style:p,svg:r,...s},m)=>f(e,{ref:m,className:o("size-5",t),style:p,svg:r,...s}));c.displayName="Icon";export{c as a};
|
|
2
|
+
//# sourceMappingURL=chunk-EZZ6SKYQ.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{a as b}from"./chunk-3C5O3AQA.js";import{a as i}from"./chunk-
|
|
2
|
-
//# sourceMappingURL=chunk-
|
|
1
|
+
import{a as b}from"./chunk-3C5O3AQA.js";import{a as i}from"./chunk-EZZ6SKYQ.js";import{a as l}from"./chunk-Q4HHIW35.js";import{CircleNotchIcon as V}from"@phosphor-icons/react/CircleNotch";import{Slot as C}from"@radix-ui/react-slot";import{cva as N}from"class-variance-authority";import p from"clsx";import{Children as k,cloneElement as E,forwardRef as S,isValidElement as w}from"react";import I from"tiny-invariant";import{Fragment as j,jsx as o,jsxs as u}from"react/jsx-runtime";var R=N("",{variants:{appearance:{filled:"bg-filled-accent text-on-filled focus-visible:border-accent-600 focus-visible:ring-focus-accent not-disabled:hover:bg-filled-accent-hover not-disabled:active:bg-filled-accent-active h-9 border border-transparent px-3 text-sm font-medium",ghost:"text-accent-600 focus-visible:ring-focus-accent not-disabled:hover:bg-accent-500/10 not-disabled:hover:text-accent-700 not-disabled:active:bg-accent-500/15 not-disabled:active:text-accent-700 h-9 border border-transparent px-3 text-sm font-medium",outlined:"border-accent-600 bg-form text-accent-600 focus-visible:ring-focus-accent not-disabled:hover:border-accent-700 not-disabled:hover:bg-accent-500/10 not-disabled:hover:text-accent-700 not-disabled:active:border-accent-700 not-disabled:active:bg-accent-500/15 not-disabled:active:text-accent-700 h-9 border px-3 text-sm font-medium",link:"text-accent-600 focus-visible:ring-focus-accent not-disabled:hover:underline group/button-link border-transparent"},isLoading:{false:"",true:"opacity-50"},priority:{danger:"",default:"",neutral:""}},defaultVariants:{appearance:"outlined",isLoading:!1,priority:"default"},compoundVariants:[{appearance:"ghost",priority:"danger",class:"text-danger-600 focus-visible:ring-focus-danger not-disabled:hover:bg-danger-500/10 not-disabled:hover:text-danger-700 not-disabled:active:bg-danger-500/15 not-disabled:active:text-danger-700 border-transparent"},{appearance:"outlined",priority:"danger",class:"border-danger-600 bg-form text-danger-600 focus-visible:ring-focus-danger not-disabled:hover:border-danger-700 not-disabled:hover:bg-danger-500/10 not-disabled:hover:text-danger-700 not-disabled:active:border-danger-700 not-disabled:active:bg-danger-500/15 not-disabled:active:text-danger-700"},{appearance:"filled",priority:"danger",class:"bg-filled-danger focus-visible:border-danger-600 focus-visible:ring-focus-danger not-disabled:hover:bg-filled-danger-hover not-disabled:active:bg-filled-danger-active border-transparent"},{appearance:"link",priority:"danger",class:"text-danger-600 focus-visible:ring-focus-danger"},{appearance:"ghost",priority:"neutral",class:"text-strong focus-visible:ring-focus-accent not-disabled:hover:bg-neutral-500/10 not-disabled:hover:text-strong not-disabled:active:bg-neutral-500/15 not-disabled:active:text-strong border-transparent"},{appearance:"outlined",priority:"neutral",class:"border-form bg-form text-strong focus-visible:border-accent-600 focus-visible:ring-focus-accent not-disabled:hover:border-neutral-400 not-disabled:hover:bg-form-hover not-disabled:hover:text-strong not-disabled:active:border-neutral-400 not-disabled:active:bg-neutral-500/10 not-disabled:active:text-strong focus-visible:not-disabled:active:border-accent-600"},{appearance:"filled",priority:"neutral",class:"bg-filled-neutral focus-visible:ring-focus-neutral not-disabled:hover:bg-filled-neutral-hover not-disabled:active:bg-filled-neutral-active border-transparent focus-visible:border-neutral-600"},{appearance:"link",priority:"neutral",class:"text-strong focus-visible:ring-focus-accent"}]}),A=S(({"aria-disabled":g,appearance:d="outlined",asChild:f,children:e,className:v,disabled:m,icon:h,iconPlacement:a="start",isLoading:r=!1,priority:x="default",type:y,...B},P)=>{let n=b(g??m??r),t=r?o(V,{className:"animate-spin"}):h,s=t&&d!=="link",c={"aria-disabled":n,className:l("inline-flex items-center justify-center gap-1.5 whitespace-nowrap rounded-md","focus:outline-hidden focus-visible:ring-4","disabled:cursor-default disabled:opacity-50","not-disabled:active:scale-[0.97]",R({appearance:d,priority:x,isLoading:r}),s&&a==="start"&&"ps-2.5",s&&a==="end"&&"pe-2.5",v),"data-disabled":n,"data-loading":r,disabled:n,ref:P,...B};return f?(I(w(e)&&k.only(e),"When using `asChild`, Button must be passed a single child as a JSX tag."),o(C,{...c,children:E(e,{},u(j,{children:[t&&o(i,{svg:t,className:p(a==="end"&&"order-last")}),e.props.children]}))})):u("button",{...c,type:y,children:[t&&o(i,{svg:t,className:p(a==="end"&&"order-last")}),e]})});A.displayName="Button";export{A as a};
|
|
2
|
+
//# sourceMappingURL=chunk-GBXNMVEO.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{a as o}from"./chunk-
|
|
2
|
-
//# sourceMappingURL=chunk-
|
|
1
|
+
import{a as o}from"./chunk-Q4HHIW35.js";import{cva as s}from"class-variance-authority";import{forwardRef as a}from"react";import{jsx as f}from"react/jsx-runtime";var m=s("border-form inline-flex items-center rounded-md",{variants:{appearance:{panel:"bg-form gap-0.5 border p-[0.1875rem] [--icon-button-border-radius:0.125rem] [&>.separator]:mx-px",ghost:"gap-0.5",outlined:""}}}),t=a(({appearance:r,className:p,children:e,...n},u)=>f("fieldset",{className:o(m({appearance:r}),p),ref:u,...n,children:e}));t.displayName="ButtonGroup";export{t as a};
|
|
2
|
+
//# sourceMappingURL=chunk-GC7PLMDA.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{n as y}from"./chunk-
|
|
2
|
-
//# sourceMappingURL=chunk-
|
|
1
|
+
import{n as y}from"./chunk-WIE557RC.js";import{a as p}from"./chunk-EZZ6SKYQ.js";import{a as n}from"./chunk-Q4HHIW35.js";import{CheckCircleIcon as x}from"@phosphor-icons/react/CheckCircle";import{InfoIcon as w}from"@phosphor-icons/react/Info";import{WarningIcon as A}from"@phosphor-icons/react/Warning";import{WarningDiamondIcon as I}from"@phosphor-icons/react/WarningDiamond";import{Slot as l}from"@radix-ui/react-slot";import{createContext as P,forwardRef as d,useContext as f}from"react";import*as c from"sonner";import{jsx as r,jsxs as k}from"react/jsx-runtime";var N=({className:t,containerAriaLabel:o,dir:e,duration_ms:s=4e3,position:i="top-center",style:a})=>{let m=y();return r(c.Toaster,{className:n("toaster overlay-prompt pointer-events-auto *:duration-200",t),containerAriaLabel:o,dir:e,duration:s,gap:12,position:i??"top-center",style:a,theme:m,toastOptions:{unstyled:!0}})};N.displayName="Toaster";var g=P("");function z(t,o){return c.toast.custom(e=>r(g.Provider,{value:e,children:t}),{duration:o?.duration_ms,...o?.id?{id:o.id}:{},unstyled:!0})}var T=P({priority:"info"}),v=d(({asChild:t,children:o,className:e,priority:s,...i},a)=>{let m=t?l:"div";return r(T.Provider,{value:{priority:s},children:k(m,{className:n("relative flex items-start gap-2 text-sm","p-3 pl-[0.9375rem]","bg-popover high-contrast:border-popover rounded rounded-r-[0.3125rem] border border-gray-500/35 shadow-lg",e),ref:a,...i,children:[r(S,{priority:s}),o]})})});v.displayName="Toast";var h=d(({className:t,svg:o,...e},s)=>{let i=f(T);switch(i.priority){case"danger":return r(p,{className:n("text-danger-600",t),ref:s,svg:o??r(A,{weight:"fill"}),...e});case"warning":return r(p,{className:n("text-warning-600",t),ref:s,svg:o??r(I,{weight:"fill"}),...e});case"success":return r(p,{className:n("text-success-600",t),ref:s,svg:o??r(x,{weight:"fill"}),...e});case"info":return r(p,{className:n("text-accent-600",t),ref:s,svg:r(w,{weight:"fill"}),...e});default:throw new Error(`Unreachable Case: ${i.priority}`)}});h.displayName="ToastIcon";var C=d(({asChild:t,className:o,onClick:e,...s},i)=>{let a=f(g);return r(t?l:"button",{className:n("shrink-0","data-[icon-button]:-mr-0.5 data-[icon-button]:-mt-0.5 data-[icon-button]:rounded-xs",o),onClick:u=>{e?.(u),!u.defaultPrevented&&c.toast.dismiss(a)},ref:i,...s})});C.displayName="ToastAction";var b=d(({asChild:t,className:o,...e},s)=>r(t?l:"p",{className:n("text-strong flex-1 text-sm font-body",o),ref:s,...e}));b.displayName="ToastMessage";var F={Root:v,Action:C,Icon:h,Message:b};function U(t){t.target instanceof Element&&t.target.closest(".overlay-prompt")&&t.preventDefault()}var R={info:"bg-accent-600",warning:"bg-warning-600",success:"bg-success-600",danger:"bg-danger-600"};function S({className:t,priority:o,...e}){return r("div",{"aria-hidden":!0,className:n("z-1 absolute -inset-px right-auto w-1.5 rounded-l",R[o],t),...e})}export{N as a,z as b,F as c,U as d};
|
|
2
|
+
//# sourceMappingURL=chunk-J25T6WVI.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{b as h}from"./chunk-
|
|
2
|
-
//# sourceMappingURL=chunk-
|
|
1
|
+
import{b as h}from"./chunk-RECDN726.js";import{a as P}from"./chunk-MF2QITTY.js";import{a as d}from"./chunk-EZZ6SKYQ.js";import{a as r}from"./chunk-Q4HHIW35.js";import{CaretDownIcon as b}from"@phosphor-icons/react/CaretDown";import{CaretUpIcon as z}from"@phosphor-icons/react/CaretUp";import{CheckIcon as D}from"@phosphor-icons/react/Check";import*as e from"@radix-ui/react-select";import{createContext as H,forwardRef as n,useContext as M}from"react";import{jsx as t,jsxs as g}from"react/jsx-runtime";var y=H({}),C=n(({"aria-invalid":o,children:a,id:i,validation:l,onBlur:s,onValueChange:p,onChange:u,...c},m)=>t(e.Root,{...c,onValueChange:f=>{u?.(f),p?.(f)},children:t(y.Provider,{value:{"aria-invalid":o,id:i,validation:l,onBlur:s,ref:m},children:a})}));C.displayName="Select";var x=e.Group;x.displayName="SelectGroup";var w=e.Value;w.displayName="SelectValue";var I=n(({"aria-invalid":o,className:a,children:i,id:l,validation:s,...p},u)=>{let c=M(y),m=c["aria-invalid"]??o,f=m!=null&&m!=="false",v=c.validation??s,S=f?"error":typeof v=="function"?v():v,V=m??S==="error",E=c.id??l;return g(e.Trigger,{"aria-invalid":V,className:r("h-9 text-sm","border-form bg-form text-strong placeholder:text-placeholder hover:bg-form-hover hover:text-strong flex w-full items-center justify-between gap-1.5 rounded-md border px-3 py-2 disabled:pointer-events-none disabled:opacity-50 [&>span]:line-clamp-1 [&>span]:text-left","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",a),"data-validation":S||void 0,id:E,ref:P(u,c.ref),...p,children:[i,t(e.Icon,{asChild:!0,children:t(d,{svg:t(b,{weight:"bold"}),className:"size-4"})})]})});I.displayName="SelectTrigger";var N=n(({className:o,...a},i)=>t(e.ScrollUpButton,{ref:i,className:r("flex cursor-default items-center justify-center py-1",o),...a,children:t(d,{svg:t(z,{weight:"bold"}),className:"size-4"})}));N.displayName="SelectScrollUpButton";var R=n(({className:o,...a},i)=>t(e.ScrollDownButton,{ref:i,className:r("flex cursor-default items-center justify-center py-1",o),...a,children:t(d,{svg:t(b,{weight:"bold"}),className:"size-4"})}));R.displayName="SelectScrollDownButton";var T=n(({className:o,children:a,position:i="popper",width:l="trigger",...s},p)=>t(e.Portal,{children:g(e.Content,{ref:p,className:r("border-popover data-side-bottom:slide-in-from-top-2 data-side-left:slide-in-from-right-2 data-side-right:slide-in-from-left-2 data-side-top:slide-in-from-bottom-2 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 relative z-50 max-h-96 min-w-[8rem] overflow-hidden rounded-md border shadow-md","bg-popover",i==="popper"&&"data-side-bottom:translate-y-2 data-side-left:-translate-x-2 data-side-right:translate-x-2 data-side-top:-translate-y-2 max-h-[var(--radix-select-content-available-height)]",l==="trigger"&&"w-[var(--radix-select-trigger-width)]",o),position:i,...s,children:[t(N,{}),t(e.Viewport,{className:r("p-1",i==="popper"&&"h-[var(--radix-select-trigger-height)] w-full"),children:a}),t(R,{})]})}));T.displayName="SelectContent";var B=n(({className:o,...a},i)=>t(e.Label,{ref:i,className:r("px-2 py-1.5 text-sm font-semibold",o),...a}));B.displayName="SelectLabel";var W=n(({className:o,children:a,icon:i,...l},s)=>g(e.Item,{ref:s,className:r("relative flex gap-2 w-full cursor-pointer select-none items-center rounded py-1.5 pl-2 pr-8 text-sm outline-hidden","focus:bg-popover-hover","data-disabled:pointer-events-none data-disabled:opacity-50","data-state-checked:bg-filled-accent data-state-checked:text-on-filled","focus:data-state-checked:bg-filled-accent",o),...l,children:[i&&t(d,{svg:i}),t(e.ItemText,{children:a}),t(e.ItemIndicator,{className:"absolute right-2 flex h-3.5 w-3.5 items-center justify-center",children:t(d,{svg:t(D,{weight:"bold"}),className:"size-4"})})]}));W.displayName="SelectItem";var L=n(({className:o,...a},i)=>t(h,{ref:i,className:r("-mx-1 my-1 h-px w-auto",o),...a}));L.displayName="SelectSeparator";var q={Root:C,Content:T,Group:x,Item:W,Label:B,Separator:L,Trigger:I,Value:w};export{q as a};
|
|
2
|
+
//# sourceMappingURL=chunk-OXGP2BVP.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{a as f,b as P,c as D,d as m,e as u,f as v,g as y,h as C}from"./chunk-VIKPHWPP.js";import{d as p}from"./chunk-
|
|
2
|
-
//# sourceMappingURL=chunk-
|
|
1
|
+
import{a as f,b as P,c as D,d as m,e as u,f as v,g as y,h as C}from"./chunk-VIKPHWPP.js";import{d as p}from"./chunk-J25T6WVI.js";import{c as g}from"./chunk-T4AM2PHQ.js";import{a}from"./chunk-Q4HHIW35.js";import{XIcon as k}from"@phosphor-icons/react/X";import{forwardRef as r}from"react";import{jsx as e,jsxs as F}from"react/jsx-runtime";var x=f;x.displayName="Dialog";var N=P;N.displayName="DialogTrigger";var d=D;d.displayName="DialogPortal";var b=m;b.displayName="DialogClose";var c=r(({className:o,...t},i)=>e(u,{ref:i,className:a("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",o),...t}));c.displayName="DialogOverlay";var h=r(({children:o,className:t,onInteractOutside:i,onPointerDownOutside:l,preferredWidth:s="max-w-lg",...W},z)=>F(d,{children:[e(c,{}),e("div",{className:"fixed inset-4 z-50 flex items-center justify-center",children:e(v,{className:a("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",s,t),onInteractOutside:n=>{p(n),i?.(n)},onPointerDownOutside:n=>{p(n),l?.(n)},ref:z,...W,children:o})})]}));h.displayName="DialogContent";var R=({className:o,children:t,...i})=>e("div",{className:a("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",o),...i,children:t});R.displayName="DialogHeader";var w=({size:o="md",type:t="button",label:i="Close Dialog",appearance:l="ghost",...s})=>e(m,{asChild:!0,children:e(g,{appearance:l,icon:e(k,{}),label:i,size:o,type:t,...s})});w.displayName="DialogCloseIconButton";var I=({className:o,...t})=>e("div",{className:a("scrollbar text-body flex-1 overflow-y-auto p-6",o),...t});I.displayName="DialogBody";var B=({className:o,...t})=>e("div",{className:a("border-dialog-muted flex shrink-0 flex-row-reverse gap-2 border-t px-6 py-4",o),...t});B.displayName="DialogFooter";var O=r(({className:o,...t},i)=>e(y,{ref:i,className:a("text-strong truncate text-lg font-medium",o),...t}));O.displayName="DialogTitle";var T=r(({className:o,...t},i)=>e(C,{ref:i,className:a("text-muted",o),...t}));T.displayName="DialogDescription";var E={Root:x,Body:I,Close:b,CloseIconButton:w,Content:h,Description:T,Footer:B,Header:R,Overlay:c,Portal:d,Title:O,Trigger:N};export{E as a};
|
|
2
|
+
//# sourceMappingURL=chunk-OY2IJ2ZI.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/utils/cx/cx.ts"],"sourcesContent":["import { type ClassValue, clsx } from \"clsx\";\nimport { extendTailwindMerge } from \"tailwind-merge\";\n\nconst twMerge = extendTailwindMerge({\n\textend: {\n\t\tclassGroups: {\n\t\t\t\"font-size\": [\"text-mono\"],\n\t\t},\n\t},\n});\n\n/**\n * Conditionally add Tailwind (and other) CSS classes.\n *\n * Allows for tailwind overrides in LTR-specificity-like order of applied classes.\n */\nexport function cx(...inputs: ClassValue[]) {\n\treturn twMerge(clsx(inputs));\n}\n"],"mappings":"AAAA,OAA0B,QAAAA,MAAY,OACtC,OAAS,uBAAAC,MAA2B,iBAEpC,IAAMC,EAAUD,EAAoB,CACnC,OAAQ,CACP,YAAa,CACZ,YAAa,CAAC,WAAW,CAC1B,CACD,CACD,CAAC,EAOM,SAASE,KAAMC,EAAsB,CAC3C,OAAOF,EAAQF,EAAKI,CAAM,CAAC,CAC5B","names":["clsx","extendTailwindMerge","twMerge","cx","inputs"]}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{a as i}from"./chunk-
|
|
2
|
-
//# sourceMappingURL=chunk-
|
|
1
|
+
import{a as i}from"./chunk-Q4HHIW35.js";import{Slot as s}from"@radix-ui/react-slot";import{createContext as h,forwardRef as f,useContext as C}from"react";import{jsx as p}from"react/jsx-runtime";var g=["horizontal","vertical"],l=h({}),x=({className:t,children:a,asChild:e,...o})=>{let n=e?s:"div";return p(l.Provider,{value:{orientation:"horizontal"},children:p(n,{"data-horizontal-separator-group":!0,className:i("group flex items-center gap-2 [&_*:not([data-separator])]:shrink-0",t),...o,children:a})})};x.displayName="HorizontalSeparatorGroup";var y=f(({asChild:t=!1,children:a,className:e,orientation:o,semantic:n=!1,...c},m)=>{let d=t?s:"div",r=C(l).orientation??(S(o)?o:"horizontal"),u=n?{"aria-orientation":r==="vertical"?r:void 0,role:"separator"}:{role:"none"};return p(d,{className:i("separator","dark-high-contrast:bg-black high-contrast:bg-black bg-gray-500/20 dark:bg-gray-600/20",r==="horizontal"?"h-px w-full group-data-[horizontal-separator-group]:flex-1":"h-full w-px",e),"data-orientation":r,"data-separator":!0,...u,ref:m,...t?{children:a}:{},...c})});y.displayName="Separator";function S(t){return typeof t=="string"&&g.includes(t)}export{x as a,y as b};
|
|
2
|
+
//# sourceMappingURL=chunk-RECDN726.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{a as l}from"./chunk-3C5O3AQA.js";import{a as d}from"./chunk-
|
|
2
|
-
//# sourceMappingURL=chunk-
|
|
1
|
+
import{a as l}from"./chunk-3C5O3AQA.js";import{a as d}from"./chunk-EZZ6SKYQ.js";import{a as r}from"./chunk-Q4HHIW35.js";import{CircleNotchIcon as x}from"@phosphor-icons/react/CircleNotch";import{Slot as I}from"@radix-ui/react-slot";import{cva as C}from"class-variance-authority";import{clsx as H}from"clsx";import{Children as M,cloneElement as T,forwardRef as V,isValidElement as E}from"react";import N from"tiny-invariant";import{Fragment as z,jsx as t,jsxs as R}from"react/jsx-runtime";var A=H("icon-button","inline-flex shrink-0 items-center justify-center rounded-[var(--icon-button-border-radius,0.375rem)] border","focus:outline-hidden focus-visible:ring-4","disabled:cursor-default disabled:opacity-50","not-disabled:active:scale-[0.97]"),L=C("",{variants:{appearance:{ghost:"text-strong focus-visible:ring-focus-accent not-disabled:hover:bg-neutral-500/10 not-disabled:hover:text-strong not-disabled:active:bg-neutral-500/15 not-disabled:active:text-strong border-transparent",outlined:"border-form bg-form text-strong focus-visible:border-accent-600 focus-visible:ring-focus-accent not-disabled:hover:border-neutral-400 not-disabled:hover:bg-form-hover not-disabled:hover:text-strong not-disabled:active:border-neutral-400 not-disabled:active:bg-neutral-500/10 not-disabled:active:text-strong focus-visible:not-disabled:active:border-accent-600"},isLoading:{false:"",true:"opacity-50"},size:{xs:"size-6",sm:"size-7",md:"size-9"}},defaultVariants:{appearance:"outlined",size:"md"}}),P=V(({"aria-disabled":c,appearance:u,asChild:b=!1,children:o,className:p,disabled:m,icon:f,isLoading:e=!1,label:v,size:a,type:h,...B},g)=>{let n=l(c??m??e),y=e?t(x,{className:"animate-spin"}):f,s={"aria-disabled":n,className:r(A,L({appearance:u,isLoading:e,size:a}),p),"data-disabled":n,"data-icon-button":!0,"data-loading":e,"data-size":a,disabled:n,ref:g,...B},i=R(z,{children:[t("span",{className:"sr-only",children:v}),t(d,{svg:y})]});return b?(N(E(o)&&M.only(o),"When using `asChild`, IconButton must be passed a single child as a JSX tag."),t(I,{...s,children:T(o,{},i)})):t("button",{...s,type:h,children:i})});P.displayName="IconButton";export{A as a,L as b,P as c};
|
|
2
|
+
//# sourceMappingURL=chunk-T4AM2PHQ.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{a as $}from"./chunk-6J7D73WA.js";import{b as f}from"./chunk-NJNFZ2EG.js";import{a as A}from"./chunk-
|
|
2
|
-
//# sourceMappingURL=chunk-
|
|
1
|
+
import{a as $}from"./chunk-6J7D73WA.js";import{b as f}from"./chunk-NJNFZ2EG.js";import{a as A}from"./chunk-Q4HHIW35.js";import{Fragment as K,jsx as x}from"react/jsx-runtime";var X="https://assets.ngrok.com",Z=`${X}/fonts`,j=["/euclid-square/EuclidSquare-Regular-WebS.woff","/euclid-square/EuclidSquare-RegularItalic-WebS.woff","/euclid-square/EuclidSquare-Medium-WebS.woff","/euclid-square/EuclidSquare-MediumItalic-WebS.woff","/ibm-plex-mono/IBMPlexMono-Text.woff","/ibm-plex-mono/IBMPlexMono-TextItalic.woff","/ibm-plex-mono/IBMPlexMono-SemiBold.woff","/ibm-plex-mono/IBMPlexMono-SemiBoldItalic.woff"];function Q(e){let t=e.startsWith("/")?e:`/${e}`;return`${Z}${t}`}var _=()=>x(K,{children:j.map(e=>x("link",{rel:"preload",href:Q(e),as:"font",type:"font/woff",crossOrigin:"anonymous"},e))});_.displayName="PreloadCoreFonts";var ee=["/inter/Inter-VariableFont.ttf","/inter/Inter-Italic-VariableFont.ttf"],ge=()=>x(K,{children:ee.map(e=>x("link",{rel:"preload",href:Q(e),as:"font",type:"font/ttf",crossOrigin:"anonymous"},e))});var k=["light","dark","light-high-contrast","dark-high-contrast"],L=["system",...k],ke=e=>e;function w(e){return typeof e!="string"?!1:L.includes(e)}var we=e=>e;function W(e){return typeof e!="string"?!1:k.includes(e)}import{createContext as te,useContext as V,useEffect as ne,useMemo as Y,useRef as oe,useState as re}from"react";import se from"tiny-invariant";import{Fragment as Te,jsx as F,jsxs as fe}from"react/jsx-runtime";var M="(prefers-color-scheme: dark)",P="(prefers-contrast: more)",g="mantle-ui-theme",C="system",ie=["system",()=>null],B=te(ie);function ae({children:e}){let[t,o]=re(()=>{let n=O({cookie:f()?document.cookie:null});return D(n),n}),r=oe(null);ne(()=>{function n(c){let m=c??O({cookie:document.cookie});o(m),D(m)}n();try{"BroadcastChannel"in window&&(r.current=new BroadcastChannel(g),r.current.onmessage=c=>{let m=c?.data?.theme;w(m)&&n(m)})}catch{}function u(c){c.key===`${g}__ping`&&n()}window.addEventListener("storage",u);let a=window.matchMedia(M),p=window.matchMedia(P);function l(){n()}function y(){document.visibilityState==="visible"&&n()}return a.addEventListener("change",l),p.addEventListener("change",l),window.addEventListener("pageshow",l),document.addEventListener("visibilitychange",y),()=>{window.removeEventListener("storage",u),a.removeEventListener("change",l),p.removeEventListener("change",l),window.removeEventListener("pageshow",l),document.removeEventListener("visibilitychange",y);try{r.current?.close()}catch{}r.current=null}},[]);let i=Y(()=>[t,n=>{pe(n),o(n),D(n),de(n,{broadcastChannel:r.current,pingKey:`${g}__ping`})}],[t]);return F(B.Provider,{value:i,children:e})}ae.displayName="ThemeProvider";function He(){let e=V(B);return se(e,"useTheme must be used within a ThemeProvider"),e}function D(e){if(!f())return;let t=window.document.documentElement,o=window.matchMedia(M).matches,r=window.matchMedia(P).matches,i=q(e,{prefersDarkMode:o,prefersHighContrast:r}),n=t.dataset.theme,u=t.dataset.appliedTheme,a=w(n)?n:void 0,p=W(u)?u:void 0;a===e&&p===i||(t.classList.remove(...k),t.classList.add(i),t.dataset.theme=e,t.dataset.appliedTheme=i)}function Ie(){if(!f())return{appliedTheme:void 0,theme:void 0};let e=window.document.documentElement,t=w(e.dataset.theme)?e.dataset.theme:void 0;return{appliedTheme:W(e.dataset.appliedTheme)?e.dataset.appliedTheme:void 0,theme:t}}function q(e,{prefersDarkMode:t,prefersHighContrast:o}){return e==="system"?me({prefersDarkMode:t,prefersHighContrast:o}):e}function Re(){let e=V(B),t=e!=null?e[0]:"system",o=$(M),r=$(P);return q(t,{prefersDarkMode:o,prefersHighContrast:r})}function me({prefersDarkMode:e,prefersHighContrast:t}){return t?e?"dark-high-contrast":"light-high-contrast":e?"dark":"light"}function ce(e){let{storageKey:t,defaultTheme:o,themes:r,resolvedThemes:i,prefersDarkModeMediaQuery:n,prefersHighContrastMediaQuery:u}=e;function a(s){return typeof s=="string"&&r.includes(s)}function p(s){let h=document.cookie;if(!h)return null;try{let E=h.split(";").find(R=>R.trim().startsWith(`${s}=`))?.split("=")[1];return E?decodeURIComponent(E):null}catch{return null}}function l(s,h){let d=new Date;d.setFullYear(d.getFullYear()+1);let I=location.hostname,E=location.protocol,U=I==="ngrok.com"||I.endsWith(".ngrok.com")?"; domain=.ngrok.com":"",R=E==="https:"?"; Secure":"";return`${s}=${encodeURIComponent(h)}; expires=${d.toUTCString()}; path=/${U}; SameSite=Lax${R}`}function y(s,h){try{document.cookie=l(s,h)}catch{}}function c(s,h,d){return s==="system"?d?h?"dark-high-contrast":"light-high-contrast":h?"dark":"light":s}let m=null,v=null,S=null;try{m=p(t)}catch{}if(a(m))S=m;else{try{v=window.localStorage?.getItem(t)??null}catch{}a(v)&&(S=v)}let b=a(S)?S:o,J=matchMedia(n).matches,z=matchMedia(u).matches,H=c(b,J,z),T=document.documentElement;if(T.dataset.appliedTheme!==H||T.dataset.theme!==b){for(let s of i)T.classList.remove(s);T.classList.add(H),T.dataset.theme=b,T.dataset.appliedTheme=H}let N=a(m);try{if(a(v)&&!N){y(t,v);try{window.localStorage.removeItem(t)}catch{}}else N||y(t,b)}catch{}}function he(){let e={storageKey:g,defaultTheme:C,themes:L,resolvedThemes:k,prefersDarkModeMediaQuery:M,prefersHighContrastMediaQuery:P};return`(${ce.toString()})(${JSON.stringify(e)})`}var G=({nonce:e})=>F("script",{dangerouslySetInnerHTML:{__html:he()},nonce:e,suppressHydrationWarning:!0});G.displayName="PreventWrongThemeFlashScript";var le=({nonce:e})=>fe(Te,{children:[F(G,{nonce:e}),F(_,{})]});le.displayName="MantleThemeHeadContent";function $e(e={}){let{className:t=""}=e??{};return Y(()=>{let o,r;if(!f())o=C,r="light";else{let i=window.matchMedia(M).matches,n=window.matchMedia(P).matches;o=O({cookie:document.cookie}),r=q(o,{prefersDarkMode:i,prefersHighContrast:n})}return{className:A(t,r),"data-applied-theme":r,"data-theme":o}},[t])}function O({cookie:e}){if(!e)return C;try{let r=e.split(";").find(n=>n.trim().startsWith(`${g}=`))?.split("=")[1],i=r?globalThis.decodeURIComponent(r):null;return w(i)?i:C}catch{return C}}function de(e,t){let{broadcastChannel:o,pingKey:r}=t;try{if(o){o.postMessage({theme:e,timestamp:Date.now()});return}}catch{}try{localStorage.setItem(r,JSON.stringify({theme:e,timestamp:Date.now()}))}catch{}}function ue(e){let t=new Date;t.setFullYear(t.getFullYear()+1);let{hostname:o,protocol:r}=window.location,i=o==="ngrok.com"||o.endsWith(".ngrok.com")?"; domain=.ngrok.com":"",n=r==="https:"?"; Secure":"";return`${g}=${encodeURIComponent(e)}; expires=${t.toUTCString()}; path=/${i}; SameSite=Lax${n}`}function pe(e){if(f())try{document.cookie=ue(e)}catch{}}export{X as a,Q as b,_ as c,ge as d,k as e,L as f,ke as g,w as h,we as i,W as j,ae as k,He as l,Ie as m,Re as n,he as o,le as p,$e as q,O as r};
|
|
2
|
+
//# sourceMappingURL=chunk-WIE557RC.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{a as p}from"./chunk-MF2QITTY.js";import{a as n}from"./chunk-
|
|
2
|
-
//# sourceMappingURL=chunk-
|
|
1
|
+
import{a as p}from"./chunk-MF2QITTY.js";import{a as n}from"./chunk-Q4HHIW35.js";import{forwardRef as s,useEffect as N,useMemo as T,useRef as g,useState as O}from"react";import{jsx as d}from"react/jsx-runtime";var b=s(({children:t,className:o,...r},e)=>{let a=E();return d("div",{className:n("group/table scrollbar overflow-x-auto overscroll-x-none rounded-lg border border-card bg-white dark:bg-gray-100 relative w-full",o),"data-sticky-active":a.state.hasOverflow&&!a.state.scrolledToEnd||void 0,"data-x-overflow":a.state.hasOverflow,"data-x-scroll-end":a.state.hasOverflow&&a.state.scrolledToEnd,ref:p(a.ref,e),...r,children:t})});b.displayName="TableRoot";var v=s(({children:t,className:o,...r},e)=>d("table",{ref:e,className:n("table-auto border-collapse caption-bottom w-full min-w-full text-left",o),...r,children:t}));v.displayName="TableElement";var u=s(({children:t,className:o,...r},e)=>d("thead",{ref:e,className:n("border-b border-card-muted","divide-y divide-card-muted","text-strong bg-base","[&>tr]:bg-base",o),...r,children:t}));u.displayName="TableHead";var h=s(({children:t,className:o,...r},e)=>d("tbody",{className:n("divide-y divide-card-muted","text-body","[thead+&]:border-t [thead+&]:border-card-muted","[&>tr]:bg-card [&>tr]:not-only:hover:bg-card-hover",o),ref:e,...r,children:t}));h.displayName="TableBody";var y=s(({children:t,className:o,...r},e)=>d("tfoot",{ref:e,className:n("font-medium text-body","border-t border-card-muted","divide-y divide-card-muted","[&>tr]:bg-gray-50/50 [&>tr]:hover:bg-card-hover",o),...r,children:t}));y.displayName="TableFoot";var C=s(({children:t,className:o,...r},e)=>d("tr",{ref:e,className:n(o),...r,children:t}));C.displayName="TableRow";var w=s(({children:t,className:o,...r},e)=>d("th",{ref:e,className:n("h-12 px-4 text-left align-middle text-sm font-medium [&:has([role=checkbox])]:pr-0",o),...r,children:t}));w.displayName="TableHeader";var R=s(({children:t,className:o,...r},e)=>d("td",{ref:e,className:n("p-4 align-middle [&:has([role=checkbox])]:pr-0 font-mono text-mono",o),...r,children:t}));R.displayName="TableCell";var x=s(({children:t,className:o,...r},e)=>d("caption",{ref:e,className:n("py-4 text-sm text-gray-500","border-t border-card-muted",o),...r,children:t}));x.displayName="TableCaption";var L={Body:h,Caption:x,Cell:R,Element:v,Foot:y,Head:u,Header:w,Root:b,Row:C};function E(){let t=g(null),[o,r]=O({hasOverflow:!1,scrolledToEnd:!1});return N(()=>{let e=t.current;if(!e)return;let a=()=>{let i=e.scrollWidth>e.clientWidth,f=Math.abs(e.scrollWidth-e.scrollLeft-e.clientWidth)<1;r(l=>l.hasOverflow!==i||l.scrolledToEnd!==f?{hasOverflow:i,scrolledToEnd:f}:l)},c=new ResizeObserver(a);c.observe(e);let m=new MutationObserver(a);return m.observe(e,{childList:!0,subtree:!0}),e.addEventListener("scroll",a,{passive:!0}),a(),()=>{c.disconnect(),m.disconnect(),e.removeEventListener("scroll",a)}},[]),T(()=>({ref:t,state:o}),[o])}export{L as a};
|
|
2
|
+
//# sourceMappingURL=chunk-WR57IFOM.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/components/table/table.tsx"],"sourcesContent":["import type { ComponentProps, ComponentRef } from \"react\";\nimport { forwardRef, useEffect, useMemo, useRef, useState } from \"react\";\nimport { composeRefs } from \"../../utils/compose-refs/compose-refs.js\";\nimport { cx } from \"../../utils/cx/cx.js\";\n\n/**\n * The `<Table.Root>` is the root container element for all `Table`s.\n * It provides styling and additional functionality, such as horizontal overflow\n * detection.\n *\n * Must be used as the parent of a `<Table.Element>`.\n *\n * @example\n * ```tsx\n * <Table.Root>\n * <Table.Element>\n * <Table.Caption>A list of your recent invoices.</Table.Caption>\n * <Table.Head>\n * <Table.Row>\n * <Table.Header className=\"w-[100px]\">Invoice</Table.Header>\n * <Table.Header>Status</Table.Header>\n * <Table.Header>Method</Table.Header>\n * <Table.Header className=\"text-right\">Amount</Table.Header>\n * </Table.Row>\n * </Table.Head>\n * <Table.Body>\n * {invoices.map((invoice) => (\n * <Table.Row key={invoice.invoice}>\n * <Table.Cell className=\"font-medium\">{invoice.invoice}</Table.Cell>\n * <Table.Cell>{invoice.paymentStatus}</Table.Cell>\n * <Table.Cell>{invoice.paymentMethod}</Table.Cell>\n * <Table.Cell className=\"text-right\">{invoice.totalAmount}</Table.Cell>\n * </Table.Row>\n * ))}\n * </Table.Body>\n * <Table.Foot>\n * <Table.Row>\n * <Table.Cell colSpan={3}>Total</Table.Cell>\n * <Table.Cell className=\"text-right\">$2,500.00</Table.Cell>\n * </Table.Row>\n * </Table.Foot>\n * </Table.Element>\n * </Table.Root>\n * ```\n *\n * @see https://mantle.ngrok.com/components/table#api-table-root\n */\nconst Root = forwardRef<ComponentRef<\"div\">, ComponentProps<\"div\">>(\n\t({ children, className, ...props }, ref) => {\n\t\tconst horizontalOverflow =\n\t\t\tuseHorizontalOverflowObserver<ComponentRef<\"div\">>();\n\n\t\treturn (\n\t\t\t<div\n\t\t\t\tclassName={cx(\n\t\t\t\t\t\"group/table scrollbar overflow-x-auto overscroll-x-none rounded-lg border border-card bg-white dark:bg-gray-100 relative w-full\",\n\t\t\t\t\tclassName,\n\t\t\t\t)}\n\t\t\t\tdata-sticky-active={\n\t\t\t\t\t(horizontalOverflow.state.hasOverflow &&\n\t\t\t\t\t\t!horizontalOverflow.state.scrolledToEnd) ||\n\t\t\t\t\tundefined\n\t\t\t\t}\n\t\t\t\tdata-x-overflow={horizontalOverflow.state.hasOverflow}\n\t\t\t\tdata-x-scroll-end={\n\t\t\t\t\thorizontalOverflow.state.hasOverflow &&\n\t\t\t\t\thorizontalOverflow.state.scrolledToEnd\n\t\t\t\t}\n\t\t\t\tref={composeRefs(horizontalOverflow.ref, ref)}\n\t\t\t\t{...props}\n\t\t\t>\n\t\t\t\t{children}\n\t\t\t</div>\n\t\t);\n\t},\n);\nRoot.displayName = \"TableRoot\";\n\n/**\n * The `<Table.Element>` is a structured way to display data in rows and columns. The API\n * matches the HTML `<table>` element 1:1.\n *\n * Permitted content in this order:\n * 1. optional: `<Table.Caption>`\n * 2. 0 or more: `<colgroup>` elements\n * 3. optional: `<Table.Head>`\n * 4. either one of the following:\n * - 0 or more: `<Table.Body>`\n * - 0 or more: `<Table.Row>`\n * 5. optional: `<Table.Foot>`\n *\n * @description\n * Establishes a table formatting context. Elements inside the `<Table.Element>`\n * generate rectangular boxes. Each box occupies a number of table cells\n * according to the following rules:\n * 1. The row boxes fill the table in the source code order from top to bottom.\n * Each row box occupies one row of cells.\n * 2. A row group box occupies one or more row boxes.\n * 3. Column boxes are placed next to each other in source code order.\n * Depending on the value of the dir attribute, the columns are laid in\n * left-to-right or right-to-left direction. A column box occupies one or\n * more columns of table cells.\n * 4. A column group box occupies one or more column boxes.\n * 5. A cell box may span over multiple rows and columns. User agents trim\n * cells to fit in the available number of rows and columns.\n * Table cells do have padding. Boxes that make up a table do not have margins.\n * For more in depth information, see the [MDN documentation](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/table).\n *\n * @example\n * ```tsx\n * <Table.Root>\n * <Table.Element>\n * <Table.Caption>A list of your recent invoices.</Table.Caption>\n * <Table.Head>\n * <Table.Row>\n * <Table.Header className=\"w-[100px]\">Invoice</Table.Header>\n * <Table.Header>Status</Table.Header>\n * <Table.Header>Method</Table.Header>\n * <Table.Header className=\"text-right\">Amount</Table.Header>\n * </Table.Row>\n * </Table.Head>\n * <Table.Body>\n * {invoices.map((invoice) => (\n * <Table.Row key={invoice.invoice}>\n * <Table.Cell className=\"font-medium\">{invoice.invoice}</Table.Cell>\n * <Table.Cell>{invoice.paymentStatus}</Table.Cell>\n * <Table.Cell>{invoice.paymentMethod}</Table.Cell>\n * <Table.Cell className=\"text-right\">{invoice.totalAmount}</Table.Cell>\n * </Table.Row>\n * ))}\n * </Table.Body>\n * <Table.Foot>\n * <Table.Row>\n * <Table.Cell colSpan={3}>Total</Table.Cell>\n * <Table.Cell className=\"text-right\">$2,500.00</Table.Cell>\n * </Table.Row>\n * </Table.Foot>\n * </Table.Element>\n * </Table.Root>\n * ```\n *\n * @see https://mantle.ngrok.com/components/table#api-table\n */\nconst Element = forwardRef<ComponentRef<\"table\">, ComponentProps<\"table\">>(\n\t({ children, className, ...props }, ref) => {\n\t\treturn (\n\t\t\t<table\n\t\t\t\tref={ref}\n\t\t\t\tclassName={cx(\n\t\t\t\t\t\"table-auto border-collapse caption-bottom w-full min-w-full text-left\",\n\t\t\t\t\tclassName,\n\t\t\t\t)}\n\t\t\t\t{...props}\n\t\t\t>\n\t\t\t\t{children}\n\t\t\t</table>\n\t\t);\n\t},\n);\nElement.displayName = \"TableElement\";\n\n/**\n * The `<Table.Head>` is a container for the table's column headers.\n * Encapsulates a set of `<Table.Row>`s, indicating that they comprise the head\n * of a table with information about the table's columns. This is usually in the\n * form of column headers (`<Table.Header>`).\n *\n * Must be used as a child of a `<Table.Element>`. It should only come after any\n * `<Table.Caption>` or `<colgroup>` and before any `<Table.Body>` or `<Table.Foot>`.\n *\n * Permitted Content:\n * 1. 0 or more: `<Table.Row>`\n *\n * @example\n * ```tsx\n * <Table.Root>\n * <Table.Element>\n * <Table.Caption>A list of your recent invoices.</Table.Caption>\n * <Table.Head>\n * <Table.Row>\n * <Table.Header className=\"w-[100px]\">Invoice</Table.Header>\n * <Table.Header>Status</Table.Header>\n * <Table.Header>Method</Table.Header>\n * <Table.Header className=\"text-right\">Amount</Table.Header>\n * </Table.Row>\n * </Table.Head>\n * <Table.Body>\n * {invoices.map((invoice) => (\n * <Table.Row key={invoice.invoice}>\n * <Table.Cell className=\"font-medium\">{invoice.invoice}</Table.Cell>\n * <Table.Cell>{invoice.paymentStatus}</Table.Cell>\n * <Table.Cell>{invoice.paymentMethod}</Table.Cell>\n * <Table.Cell className=\"text-right\">{invoice.totalAmount}</Table.Cell>\n * </Table.Row>\n * ))}\n * </Table.Body>\n * <Table.Foot>\n * <Table.Row>\n * <Table.Cell colSpan={3}>Total</Table.Cell>\n * <Table.Cell className=\"text-right\">$2,500.00</Table.Cell>\n * </Table.Row>\n * </Table.Foot>\n * </Table.Element>\n * </Table.Root>\n * ```\n *\n * @see https://mantle.ngrok.com/components/table#api-table-header\n */\nconst Head = forwardRef<ComponentRef<\"thead\">, ComponentProps<\"thead\">>(\n\t({ children, className, ...props }, ref) => (\n\t\t<thead\n\t\t\tref={ref}\n\t\t\tclassName={cx(\n\t\t\t\t//,\n\t\t\t\t\"border-b border-card-muted\",\n\t\t\t\t\"divide-y divide-card-muted\",\n\t\t\t\t\"text-strong bg-base\",\n\t\t\t\t\"[&>tr]:bg-base\", // Row styling\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t>\n\t\t\t{children}\n\t\t</thead>\n\t),\n);\nHead.displayName = \"TableHead\";\n\n/**\n * The `<Table.Body>` encapsulates a set of `<Table.Row>`s, indicating that they\n * comprise the body of a table's (main) data.\n *\n * Must be used as a child of a `<Table.Element>` and only come after any\n * `<Table.Caption>`, `<colgroup>`, or `<Table.Head>`.\n *\n * Permitted Content:\n * 1. 0 or more: `<Table.Row>`\n *\n * @example\n * ```tsx\n * <Table.Root>\n * <Table.Element>\n * <Table.Caption>A list of your recent invoices.</Table.Caption>\n * <Table.Head>\n * <Table.Row>\n * <Table.Header className=\"w-[100px]\">Invoice</Table.Header>\n * <Table.Header>Status</Table.Header>\n * <Table.Header>Method</Table.Header>\n * <Table.Header className=\"text-right\">Amount</Table.Header>\n * </Table.Row>\n * </Table.Head>\n * <Table.Body>\n * {invoices.map((invoice) => (\n * <Table.Row key={invoice.invoice}>\n * <Table.Cell className=\"font-medium\">{invoice.invoice}</Table.Cell>\n * <Table.Cell>{invoice.paymentStatus}</Table.Cell>\n * <Table.Cell>{invoice.paymentMethod}</Table.Cell>\n * <Table.Cell className=\"text-right\">{invoice.totalAmount}</Table.Cell>\n * </Table.Row>\n * ))}\n * </Table.Body>\n * <Table.Foot>\n * <Table.Row>\n * <Table.Cell colSpan={3}>Total</Table.Cell>\n * <Table.Cell className=\"text-right\">$2,500.00</Table.Cell>\n * </Table.Row>\n * </Table.Foot>\n * </Table.Element>\n * </Table.Root>\n * ```\n *\n * @see https://mantle.ngrok.com/components/table#api-table-body\n */\nconst Body = forwardRef<ComponentRef<\"tbody\">, ComponentProps<\"tbody\">>(\n\t({ children, className, ...props }, ref) => (\n\t\t<tbody\n\t\t\tclassName={cx(\n\t\t\t\t//,\n\t\t\t\t\"divide-y divide-card-muted\",\n\t\t\t\t\"text-body\",\n\t\t\t\t\"[thead+&]:border-t [thead+&]:border-card-muted\",\n\t\t\t\t\"[&>tr]:bg-card [&>tr]:not-only:hover:bg-card-hover\", // Body row styling\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\tref={ref}\n\t\t\t{...props}\n\t\t>\n\t\t\t{children}\n\t\t</tbody>\n\t),\n);\nBody.displayName = \"TableBody\";\n\n/**\n * The `<Table.Foot>` encapsulates a set of `<Table.Row>`s, indicating that they\n * comprise the foot of a table with information about the table's columns. This\n * is usually a summary of the columns, e.g., a sum of the given numbers in a\n * column.\n *\n * Must be used as a child of a `<Table.Element>` and only come after any\n * `<Table.Caption>`, `<colgroup>`, `<Table.Head>`, and `<Table.Body>`.\n *\n * Permitted Content:\n * 1. 0 or more: `<Table.Row>` elements\n *\n * @example\n * ```tsx\n * <Table.Root>\n * <Table.Element>\n * <Table.Caption>A list of your recent invoices.</Table.Caption>\n * <Table.Head>\n * <Table.Row>\n * <Table.Header className=\"w-[100px]\">Invoice</Table.Header>\n * <Table.Header>Status</Table.Header>\n * <Table.Header>Method</Table.Header>\n * <Table.Header className=\"text-right\">Amount</Table.Header>\n * </Table.Row>\n * </Table.Head>\n * <Table.Body>\n * {invoices.map((invoice) => (\n * <Table.Row key={invoice.invoice}>\n * <Table.Cell className=\"font-medium\">{invoice.invoice}</Table.Cell>\n * <Table.Cell>{invoice.paymentStatus}</Table.Cell>\n * <Table.Cell>{invoice.paymentMethod}</Table.Cell>\n * <Table.Cell className=\"text-right\">{invoice.totalAmount}</Table.Cell>\n * </Table.Row>\n * ))}\n * </Table.Body>\n * <Table.Foot>\n * <Table.Row>\n * <Table.Cell colSpan={3}>Total</Table.Cell>\n * <Table.Cell className=\"text-right\">$2,500.00</Table.Cell>\n * </Table.Row>\n * </Table.Foot>\n * </Table.Element>\n * </Table.Root>\n * ```\n *\n * @see https://mantle.ngrok.com/components/table#api-table-foot\n */\nconst Foot = forwardRef<ComponentRef<\"tfoot\">, ComponentProps<\"tfoot\">>(\n\t({ children, className, ...props }, ref) => (\n\t\t<tfoot\n\t\t\tref={ref}\n\t\t\tclassName={cx(\n\t\t\t\t//,\n\t\t\t\t\"font-medium text-body\",\n\t\t\t\t\"border-t border-card-muted\",\n\t\t\t\t\"divide-y divide-card-muted\",\n\t\t\t\t\"[&>tr]:bg-gray-50/50 [&>tr]:hover:bg-card-hover\", // Row styling\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t>\n\t\t\t{children}\n\t\t</tfoot>\n\t),\n);\nFoot.displayName = \"TableFoot\";\n\n/**\n * The `<Table.Row>` defines a row of cells in a table. The row's cells can then\n * be established using a mix of `<Table.Cell>` and `<Table.Header>` components.\n *\n * Must be used as a child of a `<Table.Head>`, `<Table.Body>`, or `<Table.Foot>`.\n *\n * Permitted Content:\n * 1. 0 or more: `<Table.Header>` or `<Table.Cell>`\n *\n * @example\n * ```tsx\n * <Table.Root>\n * <Table.Element>\n * <Table.Caption>A list of your recent invoices.</Table.Caption>\n * <Table.Head>\n * <Table.Row>\n * <Table.Header className=\"w-[100px]\">Invoice</Table.Header>\n * <Table.Header>Status</Table.Header>\n * <Table.Header>Method</Table.Header>\n * <Table.Header className=\"text-right\">Amount</Table.Header>\n * </Table.Row>\n * </Table.Head>\n * <Table.Body>\n * {invoices.map((invoice) => (\n * <Table.Row key={invoice.invoice}>\n * <Table.Cell className=\"font-medium\">{invoice.invoice}</Table.Cell>\n * <Table.Cell>{invoice.paymentStatus}</Table.Cell>\n * <Table.Cell>{invoice.paymentMethod}</Table.Cell>\n * <Table.Cell className=\"text-right\">{invoice.totalAmount}</Table.Cell>\n * </Table.Row>\n * ))}\n * </Table.Body>\n * <Table.Foot>\n * <Table.Row>\n * <Table.Cell colSpan={3}>Total</Table.Cell>\n * <Table.Cell className=\"text-right\">$2,500.00</Table.Cell>\n * </Table.Row>\n * </Table.Foot>\n * </Table.Element>\n * </Table.Root>\n * ```\n *\n * @see https://mantle.ngrok.com/components/table#api-table-row\n */\nconst Row = forwardRef<ComponentRef<\"tr\">, ComponentProps<\"tr\">>(\n\t({ children, className, ...props }, ref) => (\n\t\t<tr\n\t\t\tref={ref}\n\t\t\tclassName={cx(\n\t\t\t\t// This could be removed, or simplified\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t>\n\t\t\t{children}\n\t\t</tr>\n\t),\n);\nRow.displayName = \"TableRow\";\n\n/**\n * The `<Table.Header>` defines a cell as the header of a group of table cells\n * and may be used as a child of a `<Table.Row>`. The exact nature of this group\n * is defined by the scope and headers attributes.\n *\n * Must be used as a child of a `<Table.Row>`.\n *\n * Permitted Content:\n * 1. Flow content, but with no header, footer, sectioning content, or heading\n * content descendants.\n *\n * @example\n * ```tsx\n * <Table.Root>\n * <Table.Element>\n * <Table.Caption>A list of your recent invoices.</Table.Caption>\n * <Table.Head>\n * <Table.Row>\n * <Table.Header className=\"w-[100px]\">Invoice</Table.Header>\n * <Table.Header>Status</Table.Header>\n * <Table.Header>Method</Table.Header>\n * <Table.Header className=\"text-right\">Amount</Table.Header>\n * </Table.Row>\n * </Table.Head>\n * <Table.Body>\n * {invoices.map((invoice) => (\n * <Table.Row key={invoice.invoice}>\n * <Table.Cell className=\"font-medium\">{invoice.invoice}</Table.Cell>\n * <Table.Cell>{invoice.paymentStatus}</Table.Cell>\n * <Table.Cell>{invoice.paymentMethod}</Table.Cell>\n * <Table.Cell className=\"text-right\">{invoice.totalAmount}</Table.Cell>\n * </Table.Row>\n * ))}\n * </Table.Body>\n * <Table.Foot>\n * <Table.Row>\n * <Table.Cell colSpan={3}>Total</Table.Cell>\n * <Table.Cell className=\"text-right\">$2,500.00</Table.Cell>\n * </Table.Row>\n * </Table.Foot>\n * </Table.Element>\n * </Table.Root>\n * ```\n *\n * @see https://mantle.ngrok.com/components/table#api-table-header\n */\nconst Header = forwardRef<ComponentRef<\"th\">, ComponentProps<\"th\">>(\n\t({ children, className, ...props }, ref) => (\n\t\t<th\n\t\t\tref={ref}\n\t\t\tclassName={cx(\n\t\t\t\t\"h-12 px-4 text-left align-middle text-sm font-medium [&:has([role=checkbox])]:pr-0\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t>\n\t\t\t{children}\n\t\t</th>\n\t),\n);\nHeader.displayName = \"TableHeader\";\n\n/**\n * The `<Table.Cell>` defines a cell of a table that contains data and may be\n * used as a child of a `<Table.Row>`.\n *\n * Must be used as a child of a `<Table.Row>`.\n *\n * Permitted Content:\n * 1. Flow content\n *\n * @example\n * ```tsx\n * <Table.Root>\n * <Table.Element>\n * <Table.Caption>A list of your recent invoices.</Table.Caption>\n * <Table.Head>\n * <Table.Row>\n * <Table.Header className=\"w-[100px]\">Invoice</Table.Header>\n * <Table.Header>Status</Table.Header>\n * <Table.Header>Method</Table.Header>\n * <Table.Header className=\"text-right\">Amount</Table.Header>\n * </Table.Row>\n * </Table.Head>\n * <Table.Body>\n * {invoices.map((invoice) => (\n * <Table.Row key={invoice.invoice}>\n * <Table.Cell className=\"font-medium\">{invoice.invoice}</Table.Cell>\n * <Table.Cell>{invoice.paymentStatus}</Table.Cell>\n * <Table.Cell>{invoice.paymentMethod}</Table.Cell>\n * <Table.Cell className=\"text-right\">{invoice.totalAmount}</Table.Cell>\n * </Table.Row>\n * ))}\n * </Table.Body>\n * <Table.Foot>\n * <Table.Row>\n * <Table.Cell colSpan={3}>Total</Table.Cell>\n * <Table.Cell className=\"text-right\">$2,500.00</Table.Cell>\n * </Table.Row>\n * </Table.Foot>\n * </Table.Element>\n * </Table.Root>\n * ```\n *\n * @see https://mantle.ngrok.com/components/table#api-table-cell\n */\nconst Cell = forwardRef<ComponentRef<\"td\">, ComponentProps<\"td\">>(\n\t({ children, className, ...props }, ref) => (\n\t\t<td\n\t\t\tref={ref}\n\t\t\tclassName={cx(\n\t\t\t\t\"p-4 align-middle [&:has([role=checkbox])]:pr-0 font-mono text-mono\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t>\n\t\t\t{children}\n\t\t</td>\n\t),\n);\nCell.displayName = \"TableCell\";\n\n/**\n * The optional `<Table.Caption>` specifies the caption (or title) of a table,\n * providing the table an accessible description.\n *\n * If used, must be the first child of a `<Table.Element>`.\n *\n * Permitted Content:\n * 1. Flow content\n *\n * @example\n * ```tsx\n * <Table.Root>\n * <Table.Element>\n * <Table.Caption>A list of your recent invoices.</Table.Caption>\n * <Table.Head>\n * <Table.Row>\n * <Table.Header className=\"w-[100px]\">Invoice</Table.Header>\n * <Table.Header>Status</Table.Header>\n * <Table.Header>Method</Table.Header>\n * <Table.Header className=\"text-right\">Amount</Table.Header>\n * </Table.Row>\n * </Table.Head>\n * <Table.Body>\n * {invoices.map((invoice) => (\n * <Table.Row key={invoice.invoice}>\n * <Table.Cell className=\"font-medium\">{invoice.invoice}</Table.Cell>\n * <Table.Cell>{invoice.paymentStatus}</Table.Cell>\n * <Table.Cell>{invoice.paymentMethod}</Table.Cell>\n * <Table.Cell className=\"text-right\">{invoice.totalAmount}</Table.Cell>\n * </Table.Row>\n * ))}\n * </Table.Body>\n * <Table.Foot>\n * <Table.Row>\n * <Table.Cell colSpan={3}>Total</Table.Cell>\n * <Table.Cell className=\"text-right\">$2,500.00</Table.Cell>\n * </Table.Row>\n * </Table.Foot>\n * </Table.Element>\n * </Table.Root>\n * ```\n *\n * @see https://mantle.ngrok.com/components/table#api-table-caption\n */\nconst Caption = forwardRef<ComponentRef<\"caption\">, ComponentProps<\"caption\">>(\n\t({ children, className, ...props }, ref) => (\n\t\t<caption\n\t\t\tref={ref}\n\t\t\tclassName={cx(\n\t\t\t\t\"py-4 text-sm text-gray-500\",\n\t\t\t\t\"border-t border-card-muted\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t>\n\t\t\t{children}\n\t\t</caption>\n\t),\n);\nCaption.displayName = \"TableCaption\";\n\n/**\n * A structured way to display data in rows and columns. The API matches the\n * HTML table element 1:1.\n *\n * @see https://mantle.ngrok.com/components/table\n *\n * @example\n * ```tsx\n * <Table.Root>\n * <Table.Element>\n * <Table.Caption>A list of your recent invoices.</Table.Caption>\n * <Table.Head>\n * <Table.Row>\n * <Table.Header className=\"w-[100px]\">Invoice</Table.Header>\n * <Table.Header>Status</Table.Header>\n * <Table.Header>Method</Table.Header>\n * <Table.Header className=\"text-right\">Amount</Table.Header>\n * </Table.Row>\n * </Table.Head>\n * <Table.Body>\n * {invoices.map((invoice) => (\n * <Table.Row key={invoice.invoice}>\n * <Table.Cell className=\"font-medium\">{invoice.invoice}</Table.Cell>\n * <Table.Cell>{invoice.paymentStatus}</Table.Cell>\n * <Table.Cell>{invoice.paymentMethod}</Table.Cell>\n * <Table.Cell className=\"text-right\">{invoice.totalAmount}</Table.Cell>\n * </Table.Row>\n * ))}\n * </Table.Body>\n * <Table.Foot>\n * <Table.Row>\n * <Table.Cell colSpan={3}>Total</Table.Cell>\n * <Table.Cell className=\"text-right\">$2,500.00</Table.Cell>\n * </Table.Row>\n * </Table.Foot>\n * </Table.Element>\n * </Table.Root>\n * ```\n */\nconst Table = {\n\t/**\n\t * The body section of the table. Encapsulates a set of table rows comprising the body of a table's main data.\n\t *\n\t * @see https://mantle.ngrok.com/components/table#api-table-body\n\t *\n\t * @example\n\t * ```tsx\n\t * <Table.Root>\n\t * <Table.Element>\n\t * <Table.Caption>A list of your recent invoices.</Table.Caption>\n\t * <Table.Head>\n\t * <Table.Row>\n\t * <Table.Header className=\"w-[100px]\">Invoice</Table.Header>\n\t * <Table.Header>Status</Table.Header>\n\t * <Table.Header>Method</Table.Header>\n\t * <Table.Header className=\"text-right\">Amount</Table.Header>\n\t * </Table.Row>\n\t * </Table.Head>\n\t * <Table.Body>\n\t * {invoices.map((invoice) => (\n\t * <Table.Row key={invoice.invoice}>\n\t * <Table.Cell className=\"font-medium\">{invoice.invoice}</Table.Cell>\n\t * <Table.Cell>{invoice.paymentStatus}</Table.Cell>\n\t * <Table.Cell>{invoice.paymentMethod}</Table.Cell>\n\t * <Table.Cell className=\"text-right\">{invoice.totalAmount}</Table.Cell>\n\t * </Table.Row>\n\t * ))}\n\t * </Table.Body>\n\t * <Table.Foot>\n\t * <Table.Row>\n\t * <Table.Cell colSpan={3}>Total</Table.Cell>\n\t * <Table.Cell className=\"text-right\">$2,500.00</Table.Cell>\n\t * </Table.Row>\n\t * </Table.Foot>\n\t * </Table.Element>\n\t * </Table.Root>\n\t * ```\n\t */\n\tBody,\n\t/**\n\t * An optional caption that specifies the caption (or title) of a table, providing an accessible description.\n\t *\n\t * @see https://mantle.ngrok.com/components/table#api-table-caption\n\t *\n\t * @example\n\t * ```tsx\n\t * <Table.Root>\n\t * <Table.Element>\n\t * <Table.Caption>A list of your recent invoices.</Table.Caption>\n\t * <Table.Head>\n\t * <Table.Row>\n\t * <Table.Header className=\"w-[100px]\">Invoice</Table.Header>\n\t * <Table.Header>Status</Table.Header>\n\t * <Table.Header>Method</Table.Header>\n\t * <Table.Header className=\"text-right\">Amount</Table.Header>\n\t * </Table.Row>\n\t * </Table.Head>\n\t * <Table.Body>\n\t * {invoices.map((invoice) => (\n\t * <Table.Row key={invoice.invoice}>\n\t * <Table.Cell className=\"font-medium\">{invoice.invoice}</Table.Cell>\n\t * <Table.Cell>{invoice.paymentStatus}</Table.Cell>\n\t * <Table.Cell>{invoice.paymentMethod}</Table.Cell>\n\t * <Table.Cell className=\"text-right\">{invoice.totalAmount}</Table.Cell>\n\t * </Table.Row>\n\t * ))}\n\t * </Table.Body>\n\t * <Table.Foot>\n\t * <Table.Row>\n\t * <Table.Cell colSpan={3}>Total</Table.Cell>\n\t * <Table.Cell className=\"text-right\">$2,500.00</Table.Cell>\n\t * </Table.Row>\n\t * </Table.Foot>\n\t * </Table.Element>\n\t * </Table.Root>\n\t * ```\n\t */\n\tCaption,\n\t/**\n\t * A cell that contains data and may be used as a child of a table row.\n\t *\n\t * @see https://mantle.ngrok.com/components/table#api-table-cell\n\t *\n\t * @example\n\t * ```tsx\n\t * <Table.Root>\n\t * <Table.Element>\n\t * <Table.Caption>A list of your recent invoices.</Table.Caption>\n\t * <Table.Head>\n\t * <Table.Row>\n\t * <Table.Header className=\"w-[100px]\">Invoice</Table.Header>\n\t * <Table.Header>Status</Table.Header>\n\t * <Table.Header>Method</Table.Header>\n\t * <Table.Header className=\"text-right\">Amount</Table.Header>\n\t * </Table.Row>\n\t * </Table.Head>\n\t * <Table.Body>\n\t * {invoices.map((invoice) => (\n\t * <Table.Row key={invoice.invoice}>\n\t * <Table.Cell className=\"font-medium\">{invoice.invoice}</Table.Cell>\n\t * <Table.Cell>{invoice.paymentStatus}</Table.Cell>\n\t * <Table.Cell>{invoice.paymentMethod}</Table.Cell>\n\t * <Table.Cell className=\"text-right\">{invoice.totalAmount}</Table.Cell>\n\t * </Table.Row>\n\t * ))}\n\t * </Table.Body>\n\t * <Table.Foot>\n\t * <Table.Row>\n\t * <Table.Cell colSpan={3}>Total</Table.Cell>\n\t * <Table.Cell className=\"text-right\">$2,500.00</Table.Cell>\n\t * </Table.Row>\n\t * </Table.Foot>\n\t * </Table.Element>\n\t * </Table.Root>\n\t * ```\n\t */\n\tCell,\n\t/**\n\t * A structured way to display data in rows and columns. The API matches the HTML table element 1:1.\n\t *\n\t * @see https://mantle.ngrok.com/components/table#api-table-element\n\t *\n\t * @example\n\t * ```tsx\n\t * <Table.Root>\n\t * <Table.Element>\n\t * <Table.Caption>A list of your recent invoices.</Table.Caption>\n\t * <Table.Head>\n\t * <Table.Row>\n\t * <Table.Header className=\"w-[100px]\">Invoice</Table.Header>\n\t * <Table.Header>Status</Table.Header>\n\t * <Table.Header>Method</Table.Header>\n\t * <Table.Header className=\"text-right\">Amount</Table.Header>\n\t * </Table.Row>\n\t * </Table.Head>\n\t * <Table.Body>\n\t * {invoices.map((invoice) => (\n\t * <Table.Row key={invoice.invoice}>\n\t * <Table.Cell className=\"font-medium\">{invoice.invoice}</Table.Cell>\n\t * <Table.Cell>{invoice.paymentStatus}</Table.Cell>\n\t * <Table.Cell>{invoice.paymentMethod}</Table.Cell>\n\t * <Table.Cell className=\"text-right\">{invoice.totalAmount}</Table.Cell>\n\t * </Table.Row>\n\t * ))}\n\t * </Table.Body>\n\t * <Table.Foot>\n\t * <Table.Row>\n\t * <Table.Cell colSpan={3}>Total</Table.Cell>\n\t * <Table.Cell className=\"text-right\">$2,500.00</Table.Cell>\n\t * </Table.Row>\n\t * </Table.Foot>\n\t * </Table.Element>\n\t * </Table.Root>\n\t * ```\n\t */\n\tElement,\n\t/**\n\t * The foot section of a table. Encapsulates a set of table rows comprising the foot with summary information.\n\t *\n\t * @see https://mantle.ngrok.com/components/table#api-table-foot\n\t *\n\t * @example\n\t * ```tsx\n\t * <Table.Root>\n\t * <Table.Element>\n\t * <Table.Caption>A list of your recent invoices.</Table.Caption>\n\t * <Table.Head>\n\t * <Table.Row>\n\t * <Table.Header className=\"w-[100px]\">Invoice</Table.Header>\n\t * <Table.Header>Status</Table.Header>\n\t * <Table.Header>Method</Table.Header>\n\t * <Table.Header className=\"text-right\">Amount</Table.Header>\n\t * </Table.Row>\n\t * </Table.Head>\n\t * <Table.Body>\n\t * {invoices.map((invoice) => (\n\t * <Table.Row key={invoice.invoice}>\n\t * <Table.Cell className=\"font-medium\">{invoice.invoice}</Table.Cell>\n\t * <Table.Cell>{invoice.paymentStatus}</Table.Cell>\n\t * <Table.Cell>{invoice.paymentMethod}</Table.Cell>\n\t * <Table.Cell className=\"text-right\">{invoice.totalAmount}</Table.Cell>\n\t * </Table.Row>\n\t * ))}\n\t * </Table.Body>\n\t * <Table.Foot>\n\t * <Table.Row>\n\t * <Table.Cell colSpan={3}>Total</Table.Cell>\n\t * <Table.Cell className=\"text-right\">$2,500.00</Table.Cell>\n\t * </Table.Row>\n\t * </Table.Foot>\n\t * </Table.Element>\n\t * </Table.Root>\n\t * ```\n\t */\n\tFoot,\n\t/**\n\t * The head section of a table. Contains the table's column headers information.\n\t *\n\t * @see https://mantle.ngrok.com/components/table#api-table-header\n\t *\n\t * @example\n\t * ```tsx\n\t * <Table.Root>\n\t * <Table.Element>\n\t * <Table.Caption>A list of your recent invoices.</Table.Caption>\n\t * <Table.Head>\n\t * <Table.Row>\n\t * <Table.Header className=\"w-[100px]\">Invoice</Table.Header>\n\t * <Table.Header>Status</Table.Header>\n\t * <Table.Header>Method</Table.Header>\n\t * <Table.Header className=\"text-right\">Amount</Table.Header>\n\t * </Table.Row>\n\t * </Table.Head>\n\t * <Table.Body>\n\t * {invoices.map((invoice) => (\n\t * <Table.Row key={invoice.invoice}>\n\t * <Table.Cell className=\"font-medium\">{invoice.invoice}</Table.Cell>\n\t * <Table.Cell>{invoice.paymentStatus}</Table.Cell>\n\t * <Table.Cell>{invoice.paymentMethod}</Table.Cell>\n\t * <Table.Cell className=\"text-right\">{invoice.totalAmount}</Table.Cell>\n\t * </Table.Row>\n\t * ))}\n\t * </Table.Body>\n\t * <Table.Foot>\n\t * <Table.Row>\n\t * <Table.Cell colSpan={3}>Total</Table.Cell>\n\t * <Table.Cell className=\"text-right\">$2,500.00</Table.Cell>\n\t * </Table.Row>\n\t * </Table.Foot>\n\t * </Table.Element>\n\t * </Table.Root>\n\t * ```\n\t */\n\tHead,\n\t/**\n\t * A cell that defines the header of a group of table cells as a child of a table row.\n\t *\n\t * @see https://mantle.ngrok.com/components/table#api-table-header\n\t *\n\t * @example\n\t * ```tsx\n\t * <Table.Root>\n\t * <Table.Element>\n\t * <Table.Caption>A list of your recent invoices.</Table.Caption>\n\t * <Table.Head>\n\t * <Table.Row>\n\t * <Table.Header className=\"w-[100px]\">Invoice</Table.Header>\n\t * <Table.Header>Status</Table.Header>\n\t * <Table.Header>Method</Table.Header>\n\t * <Table.Header className=\"text-right\">Amount</Table.Header>\n\t * </Table.Row>\n\t * </Table.Head>\n\t * <Table.Body>\n\t * {invoices.map((invoice) => (\n\t * <Table.Row key={invoice.invoice}>\n\t * <Table.Cell className=\"font-medium\">{invoice.invoice}</Table.Cell>\n\t * <Table.Cell>{invoice.paymentStatus}</Table.Cell>\n\t * <Table.Cell>{invoice.paymentMethod}</Table.Cell>\n\t * <Table.Cell className=\"text-right\">{invoice.totalAmount}</Table.Cell>\n\t * </Table.Row>\n\t * ))}\n\t * </Table.Body>\n\t * <Table.Foot>\n\t * <Table.Row>\n\t * <Table.Cell colSpan={3}>Total</Table.Cell>\n\t * <Table.Cell className=\"text-right\">$2,500.00</Table.Cell>\n\t * </Table.Row>\n\t * </Table.Foot>\n\t * </Table.Element>\n\t * </Table.Root>\n\t * ```\n\t */\n\tHeader,\n\t/**\n\t * The root container element for all tables. Provides styling and additional functionality like horizontal overflow detection.\n\t *\n\t * @see https://mantle.ngrok.com/components/table#api-table-root\n\t *\n\t * @example\n\t * ```tsx\n\t * <Table.Root>\n\t * <Table.Element>\n\t * <Table.Caption>A list of your recent invoices.</Table.Caption>\n\t * <Table.Head>\n\t * <Table.Row>\n\t * <Table.Header className=\"w-[100px]\">Invoice</Table.Header>\n\t * <Table.Header>Status</Table.Header>\n\t * <Table.Header>Method</Table.Header>\n\t * <Table.Header className=\"text-right\">Amount</Table.Header>\n\t * </Table.Row>\n\t * </Table.Head>\n\t * <Table.Body>\n\t * {invoices.map((invoice) => (\n\t * <Table.Row key={invoice.invoice}>\n\t * <Table.Cell className=\"font-medium\">{invoice.invoice}</Table.Cell>\n\t * <Table.Cell>{invoice.paymentStatus}</Table.Cell>\n\t * <Table.Cell>{invoice.paymentMethod}</Table.Cell>\n\t * <Table.Cell className=\"text-right\">{invoice.totalAmount}</Table.Cell>\n\t * </Table.Row>\n\t * ))}\n\t * </Table.Body>\n\t * <Table.Foot>\n\t * <Table.Row>\n\t * <Table.Cell colSpan={3}>Total</Table.Cell>\n\t * <Table.Cell className=\"text-right\">$2,500.00</Table.Cell>\n\t * </Table.Row>\n\t * </Table.Foot>\n\t * </Table.Element>\n\t * </Table.Root>\n\t * ```\n\t */\n\tRoot,\n\t/**\n\t * Defines a row of cells in a table. Contains a mix of table cells and table headers.\n\t *\n\t * @see https://mantle.ngrok.com/components/table#api-table-row\n\t *\n\t * @example\n\t * ```tsx\n\t * <Table.Root>\n\t * <Table.Element>\n\t * <Table.Caption>A list of your recent invoices.</Table.Caption>\n\t * <Table.Head>\n\t * <Table.Row>\n\t * <Table.Header className=\"w-[100px]\">Invoice</Table.Header>\n\t * <Table.Header>Status</Table.Header>\n\t * <Table.Header>Method</Table.Header>\n\t * <Table.Header className=\"text-right\">Amount</Table.Header>\n\t * </Table.Row>\n\t * </Table.Head>\n\t * <Table.Body>\n\t * {invoices.map((invoice) => (\n\t * <Table.Row key={invoice.invoice}>\n\t * <Table.Cell className=\"font-medium\">{invoice.invoice}</Table.Cell>\n\t * <Table.Cell>{invoice.paymentStatus}</Table.Cell>\n\t * <Table.Cell>{invoice.paymentMethod}</Table.Cell>\n\t * <Table.Cell className=\"text-right\">{invoice.totalAmount}</Table.Cell>\n\t * </Table.Row>\n\t * ))}\n\t * </Table.Body>\n\t * <Table.Foot>\n\t * <Table.Row>\n\t * <Table.Cell colSpan={3}>Total</Table.Cell>\n\t * <Table.Cell className=\"text-right\">$2,500.00</Table.Cell>\n\t * </Table.Row>\n\t * </Table.Foot>\n\t * </Table.Element>\n\t * </Table.Root>\n\t * ```\n\t */\n\tRow,\n} as const;\n\nexport {\n\t//,\n\tTable,\n};\n\n/**\n * A custom hook that observes the horizontal overflow of an element and determines\n * if it has overflow and if it is scrolled to the end.\n *\n * @private\n */\nfunction useHorizontalOverflowObserver<T extends HTMLElement>() {\n\tconst ref = useRef<T | null>(null);\n\tconst [state, setState] = useState({\n\t\thasOverflow: false,\n\t\tscrolledToEnd: false,\n\t});\n\n\tuseEffect(() => {\n\t\tconst element = ref.current;\n\t\tif (!element) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst checkState = () => {\n\t\t\tconst hasOverflow = element.scrollWidth > element.clientWidth;\n\t\t\tconst scrolledToEnd =\n\t\t\t\tMath.abs(\n\t\t\t\t\telement.scrollWidth - element.scrollLeft - element.clientWidth,\n\t\t\t\t) < 1;\n\n\t\t\tsetState((previous) => {\n\t\t\t\tif (\n\t\t\t\t\tprevious.hasOverflow !== hasOverflow ||\n\t\t\t\t\tprevious.scrolledToEnd !== scrolledToEnd\n\t\t\t\t) {\n\t\t\t\t\treturn { hasOverflow, scrolledToEnd };\n\t\t\t\t}\n\t\t\t\treturn previous; // No state change\n\t\t\t});\n\t\t};\n\n\t\tconst resizeObserver = new ResizeObserver(checkState);\n\t\tresizeObserver.observe(element);\n\n\t\tconst mutationObserver = new MutationObserver(checkState);\n\t\tmutationObserver.observe(element, { childList: true, subtree: true });\n\n\t\telement.addEventListener(\"scroll\", checkState, { passive: true });\n\n\t\tcheckState();\n\n\t\treturn () => {\n\t\t\tresizeObserver.disconnect();\n\t\t\tmutationObserver.disconnect();\n\t\t\telement.removeEventListener(\"scroll\", checkState);\n\t\t};\n\t}, []);\n\n\treturn useMemo(() => ({ ref, state }), [state]);\n}\n"],"mappings":"gFACA,OAAS,cAAAA,EAAY,aAAAC,EAAW,WAAAC,EAAS,UAAAC,EAAQ,YAAAC,MAAgB,QAoD9D,cAAAC,MAAA,oBANH,IAAMC,EAAOC,EACZ,CAAC,CAAE,SAAAC,EAAU,UAAAC,EAAW,GAAGC,CAAM,EAAGC,IAAQ,CAC3C,IAAMC,EACLC,EAAmD,EAEpD,OACCR,EAAC,OACA,UAAWS,EACV,kIACAL,CACD,EACA,qBACEG,EAAmB,MAAM,aACzB,CAACA,EAAmB,MAAM,eAC3B,OAED,kBAAiBA,EAAmB,MAAM,YAC1C,oBACCA,EAAmB,MAAM,aACzBA,EAAmB,MAAM,cAE1B,IAAKG,EAAYH,EAAmB,IAAKD,CAAG,EAC3C,GAAGD,EAEH,SAAAF,EACF,CAEF,CACD,EACAF,EAAK,YAAc,YAmEnB,IAAMU,EAAUT,EACf,CAAC,CAAE,SAAAC,EAAU,UAAAC,EAAW,GAAGC,CAAM,EAAGC,IAElCN,EAAC,SACA,IAAKM,EACL,UAAWG,EACV,wEACAL,CACD,EACC,GAAGC,EAEH,SAAAF,EACF,CAGH,EACAQ,EAAQ,YAAc,eAiDtB,IAAMC,EAAOV,EACZ,CAAC,CAAE,SAAAC,EAAU,UAAAC,EAAW,GAAGC,CAAM,EAAGC,IACnCN,EAAC,SACA,IAAKM,EACL,UAAWG,EAEV,6BACA,6BACA,sBACA,iBACAL,CACD,EACC,GAAGC,EAEH,SAAAF,EACF,CAEF,EACAS,EAAK,YAAc,YA+CnB,IAAMC,EAAOX,EACZ,CAAC,CAAE,SAAAC,EAAU,UAAAC,EAAW,GAAGC,CAAM,EAAGC,IACnCN,EAAC,SACA,UAAWS,EAEV,6BACA,YACA,iDACA,qDACAL,CACD,EACA,IAAKE,EACJ,GAAGD,EAEH,SAAAF,EACF,CAEF,EACAU,EAAK,YAAc,YAiDnB,IAAMC,EAAOZ,EACZ,CAAC,CAAE,SAAAC,EAAU,UAAAC,EAAW,GAAGC,CAAM,EAAGC,IACnCN,EAAC,SACA,IAAKM,EACL,UAAWG,EAEV,wBACA,6BACA,6BACA,kDACAL,CACD,EACC,GAAGC,EAEH,SAAAF,EACF,CAEF,EACAW,EAAK,YAAc,YA8CnB,IAAMC,EAAMb,EACX,CAAC,CAAE,SAAAC,EAAU,UAAAC,EAAW,GAAGC,CAAM,EAAGC,IACnCN,EAAC,MACA,IAAKM,EACL,UAAWG,EAEVL,CACD,EACC,GAAGC,EAEH,SAAAF,EACF,CAEF,EACAY,EAAI,YAAc,WAgDlB,IAAMC,EAASd,EACd,CAAC,CAAE,SAAAC,EAAU,UAAAC,EAAW,GAAGC,CAAM,EAAGC,IACnCN,EAAC,MACA,IAAKM,EACL,UAAWG,EACV,qFACAL,CACD,EACC,GAAGC,EAEH,SAAAF,EACF,CAEF,EACAa,EAAO,YAAc,cA8CrB,IAAMC,EAAOf,EACZ,CAAC,CAAE,SAAAC,EAAU,UAAAC,EAAW,GAAGC,CAAM,EAAGC,IACnCN,EAAC,MACA,IAAKM,EACL,UAAWG,EACV,qEACAL,CACD,EACC,GAAGC,EAEH,SAAAF,EACF,CAEF,EACAc,EAAK,YAAc,YA8CnB,IAAMC,EAAUhB,EACf,CAAC,CAAE,SAAAC,EAAU,UAAAC,EAAW,GAAGC,CAAM,EAAGC,IACnCN,EAAC,WACA,IAAKM,EACL,UAAWG,EACV,6BACA,6BACAL,CACD,EACC,GAAGC,EAEH,SAAAF,EACF,CAEF,EACAe,EAAQ,YAAc,eAyCtB,IAAMC,EAAQ,CAuCb,KAAAN,EAuCA,QAAAK,EAuCA,KAAAD,EAuCA,QAAAN,EAuCA,KAAAG,EAuCA,KAAAF,EAuCA,OAAAI,EAuCA,KAAAf,EAuCA,IAAAc,CACD,EAaA,SAASK,GAAuD,CAC/D,IAAMC,EAAMC,EAAiB,IAAI,EAC3B,CAACC,EAAOC,CAAQ,EAAIC,EAAS,CAClC,YAAa,GACb,cAAe,EAChB,CAAC,EAED,OAAAC,EAAU,IAAM,CACf,IAAMC,EAAUN,EAAI,QACpB,GAAI,CAACM,EACJ,OAGD,IAAMC,EAAa,IAAM,CACxB,IAAMC,EAAcF,EAAQ,YAAcA,EAAQ,YAC5CG,EACL,KAAK,IACJH,EAAQ,YAAcA,EAAQ,WAAaA,EAAQ,WACpD,EAAI,EAELH,EAAUO,GAERA,EAAS,cAAgBF,GACzBE,EAAS,gBAAkBD,EAEpB,CAAE,YAAAD,EAAa,cAAAC,CAAc,EAE9BC,CACP,CACF,EAEMC,EAAiB,IAAI,eAAeJ,CAAU,EACpDI,EAAe,QAAQL,CAAO,EAE9B,IAAMM,EAAmB,IAAI,iBAAiBL,CAAU,EACxD,OAAAK,EAAiB,QAAQN,EAAS,CAAE,UAAW,GAAM,QAAS,EAAK,CAAC,EAEpEA,EAAQ,iBAAiB,SAAUC,EAAY,CAAE,QAAS,EAAK,CAAC,EAEhEA,EAAW,EAEJ,IAAM,CACZI,EAAe,WAAW,EAC1BC,EAAiB,WAAW,EAC5BN,EAAQ,oBAAoB,SAAUC,CAAU,CACjD,CACD,EAAG,CAAC,CAAC,EAEEM,EAAQ,KAAO,CAAE,IAAAb,EAAK,MAAAE,CAAM,GAAI,CAACA,CAAK,CAAC,CAC/C","names":["forwardRef","useEffect","useMemo","useRef","useState","jsx","Root","forwardRef","children","className","props","ref","horizontalOverflow","useHorizontalOverflowObserver","cx","composeRefs","Element","Head","Body","Foot","Row","Header","Cell","Caption","Table","useHorizontalOverflowObserver","ref","useRef","state","setState","useState","useEffect","element","checkState","hasOverflow","scrolledToEnd","previous","resizeObserver","mutationObserver","useMemo"]}
|
package/dist/code-block.d.ts
CHANGED
|
@@ -26,7 +26,7 @@ declare const isSupportedLanguage: (value: unknown) => value is SupportedLanguag
|
|
|
26
26
|
* Formats a language name into a class name that Prism.js can understand.
|
|
27
27
|
* @default "language-sh"
|
|
28
28
|
*/
|
|
29
|
-
declare function formatLanguageClassName(language?: SupportedLanguage | undefined): "language-html" | "language-ruby" | "language-text" | "language-plaintext" | "language-bash" | "language-cs" | "language-csharp" | "language-css" | "language-dotnet" | "language-go" | "language-java" | "language-javascript" | "language-js" | "language-json" | "language-jsx" | "language-markup" | "language-plain" | "language-
|
|
29
|
+
declare function formatLanguageClassName(language?: SupportedLanguage | undefined): "language-html" | "language-ruby" | "language-py" | "language-text" | "language-plaintext" | "language-bash" | "language-cs" | "language-csharp" | "language-css" | "language-dotnet" | "language-go" | "language-java" | "language-javascript" | "language-js" | "language-json" | "language-jsx" | "language-markup" | "language-plain" | "language-python" | "language-rb" | "language-rust" | "language-sh" | "language-shell" | "language-ts" | "language-tsx" | "language-txt" | "language-typescript" | "language-xml" | "language-yaml" | "language-yml";
|
|
30
30
|
|
|
31
31
|
declare const indentations: readonly ["tabs", "spaces"];
|
|
32
32
|
type Indentation = (typeof indentations)[number];
|
package/dist/code-block.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{a as
|
|
2
|
-
`).map(
|
|
3
|
-
`)}function be(e){let t=e.match(/^[ \t]*(?=\S)/gm);return t?t.reduce((o,n)=>Math.min(o,n.length),Number.POSITIVE_INFINITY):0}function xe(e){return Array.isArray(e)&&"raw"in e&&Array.isArray(e.raw)}var Ie=["cli","file","traffic-policy"],i={collapsible:!1,disableCopy:!1,indentation:void 0,mode:void 0,title:void 0};function ve(e){let t=e?.trim()??"";if(!t)return i;let o=ke(t).reduce((n,r)=>{let[
|
|
1
|
+
import{a as z}from"./chunk-X7RUBITL.js";import{a as O}from"./chunk-W2YQRWR5.js";import{a as B}from"./chunk-3C5O3AQA.js";import{a as I}from"./chunk-EZZ6SKYQ.js";import"./chunk-6Y2VYL62.js";import{a as m}from"./chunk-Q4HHIW35.js";import{CaretDownIcon as ie}from"@phosphor-icons/react/CaretDown";import{CheckIcon as de}from"@phosphor-icons/react/Check";import{CopyIcon as pe}from"@phosphor-icons/react/Copy";import{FileTextIcon as le}from"@phosphor-icons/react/FileText";import{TerminalIcon as ue}from"@phosphor-icons/react/Terminal";import{Slot as x}from"@radix-ui/react-slot";import ce from"clsx";import{createContext as me,forwardRef as y,useContext as A,useEffect as S,useId as ge,useMemo as F,useRef as fe,useState as b}from"react";import P from"tiny-invariant";function N(e){let t="";for(let o of e)switch(o){case"&":t+="&";break;case"<":t+="<";break;case">":t+=">";break;case'"':t+=""";break;case"'":t+="'";break;default:t+=o}return t}import E from"prismjs";import"prismjs/components/prism-bash.js";import"prismjs/components/prism-csharp.js";import"prismjs/components/prism-css.js";import"prismjs/components/prism-go.js";import"prismjs/components/prism-java.js";import"prismjs/components/prism-javascript.js";import"prismjs/components/prism-json.js";import"prismjs/components/prism-jsx.js";import"prismjs/components/prism-markup.js";import"prismjs/components/prism-python.js";import"prismjs/components/prism-ruby.js";import"prismjs/components/prism-rust.js";import"prismjs/components/prism-tsx.js";import"prismjs/components/prism-typescript.js";import"prismjs/components/prism-yaml.js";var te=["tabs","spaces"];function W(e){return te.includes(e)}function $(e,t){return t||(re(e)?"tabs":(ae(e),"spaces"))}var ne=["csharp","css","go","html","java","javascript","js","jsx","ts","tsx","typescript","xml"],oe=["python","py","yaml","yml","ruby","rb"];function re(e){return ne.includes(e)}function ae(e){return oe.includes(e)}function k(e,t){let{indentation:o="spaces"}=t||{};return e.trim().replace(/^[ \t]*(?=\S)/gm,n=>o==="spaces"?n.replace(/\t/g," "):n.replace(/ {2}/g," "))}var w=["bash","cs","csharp","css","dotnet","go","html","java","javascript","js","json","jsx","markup","plain","plaintext","py","python","rb","ruby","rust","sh","shell","text","ts","tsx","txt","typescript","xml","yaml","yml"];function se(e){if(!e)return"sh";let t=e.trim().slice(e.indexOf("-")+1);return D(t)?t:"sh"}var D=e=>typeof e=="string"&&w.includes(e);function H(e="sh"){return`language-${e??"sh"}`}import{Fragment as ye,jsx as s,jsxs as j}from"react/jsx-runtime";var M=me({codeId:void 0,copyText:"",hasCodeExpander:!1,isCodeExpanded:!1,registerCodeId:()=>{},setCopyText:()=>{},setHasCodeExpander:()=>{},setIsCodeExpanded:()=>{},unregisterCodeId:()=>{}}),V=y(({asChild:e=!1,className:t,...o},n)=>{let[r,a]=b(""),[d,p]=b(!1),[u,f]=b(!1),[l,c]=b(void 0),v=F(()=>({codeId:l,copyText:r,hasCodeExpander:d,isCodeExpanded:u,registerCodeId:g=>{c(h=>(P(h==null,"You can only render a single CodeBlockCode within a CodeBlock."),g))},setCopyText:a,setHasCodeExpander:p,setIsCodeExpanded:f,unregisterCodeId:g=>{c(h=>{P(h===g,"You can only render a single CodeBlockCode within a CodeBlock.")})}}),[l,r,d,u]),C=e?x:"div";return s(M.Provider,{value:v,children:s(C,{className:m("text-mono overflow-hidden rounded-md border border-gray-300 bg-gray-50 font-mono","[&_svg]:shrink-0",t),ref:n,...o})})});V.displayName="CodeBlock";var Y=y(({asChild:e=!1,className:t,...o},n)=>s(e?x:"div",{className:m("relative",t),ref:n,...o}));Y.displayName="CodeBlockBody";var J=y(({className:e,highlightLines:t,indentation:o,language:n="text",showLineNumbers:r,style:a,tabIndex:d,value:p,...u},f)=>{let l=ge(),{hasCodeExpander:c,isCodeExpanded:v,registerCodeId:C,setCopyText:g,unregisterCodeId:h}=A(M),T=$(n,o),L=F(()=>k(p,{indentation:T}),[p,T]),[X,Z]=b(N(k(p,{indentation:T})));S(()=>{let _=E.languages[n];P(_,`CodeBlock does not support the language "${n}". The syntax highlighter does not have a grammar for this language. The supported languages are: ${w.join(", ")}.`);let ee=E.highlight(L,_,n);Z(ee)},[L,n]),S(()=>{g(L)},[L,g]),S(()=>(C(l),()=>{h(l)}),[l,C,h]);let R=H(n);return s("pre",{"aria-expanded":c?v:void 0,className:m("scrollbar overflow-x-auto overflow-y-hidden p-4 pr-14","text-mono m-0 font-mono","aria-collapsed:max-h-[13.6rem]",R,e),"data-lang":n,id:l,ref:f,style:{...a,tabSize:2,MozTabSize:2},tabIndex:d??-1,...u,children:s("code",{className:ce("text-inherit",R),dangerouslySetInnerHTML:{__html:X},suppressHydrationWarning:!0})})});J.displayName="CodeBlockCode";var q=y(({asChild:e=!1,className:t,...o},n)=>s(e?x:"div",{className:m("flex items-center gap-1 border-b border-gray-300 bg-gray-100 px-4 py-2 text-gray-700",t),ref:n,...o}));q.displayName="CodeBlockHeader";var Q=y(({asChild:e=!1,className:t,...o},n)=>s(e?x:"h3",{ref:n,className:m("text-mono m-0 font-mono font-normal",t),...o}));Q.displayName="CodeBlockTitle";var G=y(({asChild:e=!1,className:t,onCopy:o,onCopyError:n,onClick:r,...a},d)=>{let{copyText:p}=A(M),[,u]=z(),[f,l]=b(!1),c=fe(0);return j(e?x:"button",{type:"button",className:m("focus-visible:border-accent-600 focus-visible:ring-focus-accent absolute right-2.5 top-2.5 z-10 flex size-7 items-center justify-center rounded border border-gray-300 bg-gray-50 shadow-[-1rem_0_0.75rem_-0.375rem_var(--color-gray-50),1rem_0_0_-0.25rem_var(--color-gray-50)] hover:border-gray-400 hover:bg-gray-200 focus-visible:outline-hidden focus-visible:ring-4",f&&"bg-filled-success text-on-filled hover:bg-filled-success focus:bg-filled-success focus-visible:border-success-600 focus-visible:ring-focus-success w-auto gap-1 border-transparent pl-2 pr-1.5 hover:border-transparent",t),ref:d,onClick:async C=>{try{if(r?.(C),C.defaultPrevented){window.clearTimeout(c.current);return}await u(p),o?.(p),l(!0),window.clearTimeout(c.current),c.current=window.setTimeout(()=>{l(!1)},2e3)}catch(g){n?.(g)}},...a,children:[s("span",{className:"sr-only",children:"Copy code"}),f?j(ye,{children:["Copied",s(I,{svg:s(de,{weight:"bold"}),className:"size-4"})]}):s(I,{svg:s(pe,{}),className:"-ml-px"})]})});G.displayName="CodeBlockCopyButton";var K=y(({asChild:e=!1,className:t,onClick:o,...n},r)=>{let{codeId:a,isCodeExpanded:d,setIsCodeExpanded:p,setHasCodeExpander:u}=A(M);return S(()=>(u(!0),()=>{u(!1)}),[u]),j(e?x:"button",{...n,"aria-controls":a,"aria-expanded":d,className:m("flex w-full items-center justify-center gap-0.5 border-t border-gray-300 bg-gray-50 px-4 py-2 font-sans text-gray-700 hover:bg-gray-100",t),ref:r,type:"button",onClick:l=>{p(c=>!c),o?.(l)},children:[d?"Show less":"Show more"," ",s(I,{svg:s(ie,{weight:"bold"}),className:m("size-4",d&&"rotate-180","transition-all duration-150")})]})});K.displayName="CodeBlockExpanderButton";function U({className:e,preset:t,svg:o,...n}){let r=o;if(t!=null)switch(t){case"file":r=s(le,{weight:"fill"});break;case"cli":r=s(ue,{weight:"fill"});break;case"traffic-policy":r=s(O,{});break}return s(I,{className:e,svg:r,...n})}U.displayName="CodeBlockIcon";var Ce={Root:V,Body:Y,Code:J,CopyButton:G,ExpanderButton:K,Header:q,Icon:U,Title:Q};function he(e,...t){if(!xe(e)||!Array.isArray(t))throw new Error("It looks like you tried to call `fmtCode` as a function. Make sure to use it as a tagged template.\n Example: fmtCode`SELECT * FROM users`, not fmtCode('SELECT * FROM users')");let o=String.raw({raw:e},...t),n=be(o);return o.trim().split(`
|
|
2
|
+
`).map(a=>/^\S+/.test(a)?a:a.slice(n)).join(`
|
|
3
|
+
`)}function be(e){let t=e.match(/^[ \t]*(?=\S)/gm);return t?t.reduce((o,n)=>Math.min(o,n.length),Number.POSITIVE_INFINITY):0}function xe(e){return Array.isArray(e)&&"raw"in e&&Array.isArray(e.raw)}var Ie=["cli","file","traffic-policy"],i={collapsible:!1,disableCopy:!1,indentation:void 0,mode:void 0,title:void 0};function ve(e){let t=e?.trim()??"";if(!t)return i;let o=ke(t).reduce((n,r)=>{let[a,d]=r.split("=");if(!a)return n;let p=Le(d);return n[a]=p??!0,n},{});try{let n=Se(o);return{...i,...n}}catch{return i}}function Le(e){return e?.trim().replace(/^"(.*)"$/,"$1")}function ke(e){let t=e?.trim()??"",o=[],n="",r=!1;for(let a of t)a===" "&&!r?n&&(o.push(n),n=""):(a==='"'&&(r=!r),n+=a);return n&&o.push(n),o}function we(e){return Ie.includes(e)}function Se(e){let{collapsible:t=i.collapsible,disableCopy:o=i.disableCopy,indentation:n=i.indentation,mode:r=i.mode,title:a=i.title}=e;return{collapsible:typeof t=="string"||typeof t=="boolean"?B(t):i.collapsible,disableCopy:typeof o=="string"||typeof o=="boolean"?B(o):i.disableCopy,indentation:W(n)?n:i.indentation,mode:we(r)?r:i.mode,title:typeof a=="string"?a.trim():i.title}}export{Ce as CodeBlock,i as defaultMeta,N as escapeHtml,he as fmtCode,H as formatLanguageClassName,D as isSupportedLanguage,k as normalizeIndentation,se as parseLanguage,ve as parseMetastring,w as supportedLanguages};
|
|
4
4
|
//# sourceMappingURL=code-block.js.map
|