@ngrok/mantle 0.64.0 → 0.64.2
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/dist/alert-dialog.js +1 -1
- package/dist/{chunk-5XDZE2OU.js → chunk-EIEPGCIG.js} +2 -2
- package/dist/{chunk-LB366VCO.js → chunk-HF3KJHO3.js} +2 -2
- package/dist/chunk-HF3KJHO3.js.map +1 -0
- package/dist/{chunk-HLRTYX4G.js → chunk-KCF3KPUB.js} +2 -2
- package/dist/{chunk-GLSHD37P.js → chunk-PNL7JOXI.js} +2 -2
- package/dist/chunk-PNL7JOXI.js.map +1 -0
- package/dist/code-block.js +1 -1
- package/dist/code-block.js.map +1 -1
- package/dist/command.js +1 -1
- package/dist/dialog.js +1 -1
- package/dist/hooks.js +1 -1
- package/dist/icons.js +1 -1
- package/dist/input.js +1 -1
- package/dist/input.js.map +1 -1
- package/dist/mantle.css +30 -15
- package/dist/pagination.js.map +1 -1
- package/dist/radio-group.js +1 -1
- package/dist/radio-group.js.map +1 -1
- package/dist/sheet.js +1 -1
- package/dist/slider.d.ts +13 -2
- package/dist/slider.js +1 -1
- package/dist/slider.js.map +1 -1
- package/dist/theme.js +1 -1
- package/dist/toast.js +1 -1
- package/package.json +3 -3
- package/dist/chunk-GLSHD37P.js.map +0 -1
- package/dist/chunk-LB366VCO.js.map +0 -1
- /package/dist/{chunk-5XDZE2OU.js.map → chunk-EIEPGCIG.js.map} +0 -0
- /package/dist/{chunk-HLRTYX4G.js.map → chunk-KCF3KPUB.js.map} +0 -0
package/dist/alert-dialog.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{a as y,b as A,c as u,d as c,e as D,f as C,g as P,h as v}from"./chunk-ELZLLG6G.js";import{d as f}from"./chunk-
|
|
1
|
+
import{a as y,b as A,c as u,d as c,e as D,f as C,g as P,h as v}from"./chunk-ELZLLG6G.js";import{d as f}from"./chunk-EIEPGCIG.js";import"./chunk-HF3KJHO3.js";import"./chunk-6J7D73WA.js";import"./chunk-NJNFZ2EG.js";import"./chunk-KMNACVH6.js";import{a as d}from"./chunk-W5A5HSFE.js";import"./chunk-63ZAW25Z.js";import"./chunk-72TJUKMV.js";import"./chunk-OP6JMBKJ.js";import"./chunk-IVQ626TU.js";import{a as p}from"./chunk-ADF5DAYG.js";import{a as g}from"./chunk-SBQHQ2SJ.js";import{a}from"./chunk-PFXFESEN.js";import{InfoIcon as H}from"@phosphor-icons/react/Info";import{WarningIcon as k}from"@phosphor-icons/react/Warning";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:r="max-w-md",...l},m)=>J(b,{children:[i(W,{}),i("div",{className:"fixed inset-4 z-50 flex items-center justify-center",children:i(C,{ref:m,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",r,t),onInteractOutside:s=>{f(s),e?.(s)},onPointerDownOutside:s=>{f(s),o?.(s)},...l})})]}));I.displayName="AlertDialogContent";var O=n(({asChild:t=!1,className:e,...o},r)=>i(t?p:"div",{className:a("flex-1 space-y-4",e),ref:r,...o}));O.displayName="AlertDialogBody";var w=n(({asChild:t=!1,className:e,...o},r)=>i(t?p:"div",{className:a("flex flex-col space-y-2 text-center sm:text-start",e),ref:r,...o}));w.displayName="AlertDialogHeader";var B=n(({asChild:t=!1,className:e,...o},r)=>i(t?p:"div",{className:a("flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2",e),ref:r,...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 r=N(),l="default";return r.priority==="danger"&&(l="danger"),i(d,{appearance:t,priority:l,ref:o,...e})});S.displayName="AlertDialogAction";var j=n(({appearance:t="outlined",className:e,priority:o="neutral",...r},l)=>i(c,{asChild:!0,children:i(d,{appearance:t,className:a("mt-2 sm:mt-0",e),priority:o,ref:l,...r})}));j.displayName="AlertDialogCancel";var V=n(({className:t,svg:e,...o},r)=>{let l=N(),m=l.priority==="danger"?"text-danger-600":"text-accent-600",s=l.priority==="danger"?i(k,{}):i(H,{});return i(g,{ref:r,className:a("size-12 sm:size-7",m,t),svg:e??s,...o})});V.displayName="AlertDialogIcon";var F=c;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
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{m as y}from"./chunk-
|
|
2
|
-
//# sourceMappingURL=chunk-
|
|
1
|
+
import{m as y}from"./chunk-HF3KJHO3.js";import{a as p}from"./chunk-IVQ626TU.js";import{a as d}from"./chunk-ADF5DAYG.js";import{a as n}from"./chunk-PFXFESEN.js";import{CheckCircleIcon as x}from"@phosphor-icons/react/CheckCircle";import{InfoIcon as w}from"@phosphor-icons/react/Info";import{WarningIcon as I}from"@phosphor-icons/react/Warning";import{WarningDiamondIcon as N}from"@phosphor-icons/react/WarningDiamond";import{createContext as P,forwardRef as l,useContext as f}from"react";import*as c from"sonner";import{jsx as s,jsxs as k}from"react/jsx-runtime";var A=({className:t,containerAriaLabel:e,dir:o,duration_ms:r=4e3,position:i="top-center",style:a})=>{let m=y();return s(c.Toaster,{className:n("toaster overlay-prompt pointer-events-auto *:duration-200",t),containerAriaLabel:e,dir:o,duration:r,gap:12,position:i??"top-center",style:a,theme:m,toastOptions:{unstyled:!0}})};A.displayName="Toaster";var g=P("");function L(t,e){let o=e?.duration_ms;return typeof o=="number"&&o<=0&&(o=Number.POSITIVE_INFINITY),c.toast.custom(r=>s(g.Provider,{value:r,children:t}),{duration:o,...e?.id?{id:e.id}:{},unstyled:!0})}var T=P({priority:"info"}),v=l(({asChild:t,children:e,className:o,priority:r,...i},a)=>{let m=t?d:"div";return s(T.Provider,{value:{priority:r},children:k(m,{className:n("relative flex items-start gap-2 text-sm font-sans","p-3 pl-3.75","bg-popover high-contrast:border-popover rounded rounded-r-[0.3125rem] border border-gray-500/35 shadow-lg",o),ref:a,...i,children:[s(S,{priority:r}),e]})})});v.displayName="Toast";var h=l(({className:t,svg:e,...o},r)=>{let i=f(T);switch(i.priority){case"danger":return s(p,{className:n("text-danger-600",t),ref:r,svg:e??s(I,{weight:"fill"}),...o});case"warning":return s(p,{className:n("text-warning-600",t),ref:r,svg:e??s(N,{weight:"fill"}),...o});case"success":return s(p,{className:n("text-success-600",t),ref:r,svg:e??s(x,{weight:"fill"}),...o});case"info":return s(p,{className:n("text-accent-600",t),ref:r,svg:s(w,{weight:"fill"}),...o});default:throw new Error(`Unreachable Case: ${i.priority}`)}});h.displayName="ToastIcon";var C=l(({asChild:t,className:e,onClick:o,...r},i)=>{let a=f(g);return s(t?d:"button",{className:n("shrink-0","data-icon-button:-mr-0.5 data-icon-button:-mt-0.5 data-icon-button:rounded-xs",e),onClick:u=>{o?.(u),!u.defaultPrevented&&c.toast.dismiss(a)},ref:i,...r})});C.displayName="ToastAction";var b=l(({asChild:t,className:e,...o},r)=>s(t?d:"p",{className:n("text-strong flex-1 text-sm font-body",e),ref:r,...o}));b.displayName="ToastMessage";var z={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:e,...o}){return s("div",{"aria-hidden":!0,className:n("z-1 absolute -inset-px right-auto w-1.5 rounded-l",R[e],t),...o})}export{A as a,L as b,z as c,U as d};
|
|
2
|
+
//# sourceMappingURL=chunk-EIEPGCIG.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{a as
|
|
2
|
-
//# sourceMappingURL=chunk-
|
|
1
|
+
import{a as D}from"./chunk-6J7D73WA.js";import{b as g}from"./chunk-NJNFZ2EG.js";import{a as Q}from"./chunk-PFXFESEN.js";import{Fragment as Z,jsx as K}from"react/jsx-runtime";var q="https://assets.ngrok.com",J=`${q}/fonts`,z=["/roobert/roobert-proportional-vf.woff2","/jetbrains/jetbrainsmono-wght.woff2","/jetbrains/jetbrainsmono-italic-wght.woff2","/family/family-regular.woff2","/family/family-italic.woff2"];function X(e){let t=e.startsWith("/")?e:`/${e}`;return`${J}${t}`}var W=()=>K(Z,{children:z.map(e=>K("link",{rel:"preload",href:X(e),as:"font",type:"font/woff2",crossOrigin:"anonymous"},e))});W.displayName="PreloadCoreFonts";var k=["light","dark","light-high-contrast","dark-high-contrast"],I=["system",...k],ye=e=>e;function C(e){return typeof e!="string"?!1:I.includes(e)}var ve=e=>e;function O(e){return typeof e!="string"?!1:k.includes(e)}import{createContext as ee,useContext as B,useEffect as te,useMemo as V,useRef as ne,useState as oe}from"react";import re from"tiny-invariant";import{Fragment as pe,jsx as F,jsxs as fe}from"react/jsx-runtime";var w="(prefers-color-scheme: dark)",M="(prefers-contrast: more)",u="mantle-ui-theme",H="system",se=["system",()=>null],N=ee(se);function ie({children:e}){let[t,r]=oe(()=>{let o=E({cookie:g()?document.cookie:null});return _(o),o}),n=ne(null);te(()=>{function o(d){let m=d??E({cookie:document.cookie});r(m),_(m)}o();try{"BroadcastChannel"in window&&(n.current=new BroadcastChannel(u),n.current.onmessage=d=>{let m=d?.data?.theme;C(m)&&o(m)})}catch{}function c(d){d.key===`${u}__ping`&&o()}window.addEventListener("storage",c);let a=window.matchMedia(w),p=window.matchMedia(M);function l(){o()}function y(){document.visibilityState==="visible"&&o()}return a.addEventListener("change",l),p.addEventListener("change",l),window.addEventListener("pageshow",l),document.addEventListener("visibilitychange",y),()=>{window.removeEventListener("storage",c),a.removeEventListener("change",l),p.removeEventListener("change",l),window.removeEventListener("pageshow",l),document.removeEventListener("visibilitychange",y);try{n.current?.close()}catch{}n.current=null}},[]);let s=V(()=>[t,o=>{ue(o),r(o),_(o),le(o,{broadcastChannel:n.current,pingKey:`${u}__ping`})}],[t]);return F(N.Provider,{value:s,children:e})}ie.displayName="ThemeProvider";function $e(){let e=B(N);return re(e,"useTheme must be used within a ThemeProvider"),e}function _(e){if(!g())return;let t=window.document.documentElement,r=window.matchMedia(w).matches,n=window.matchMedia(M).matches,s=$(e,{prefersDarkMode:r,prefersHighContrast:n}),o=t.dataset.theme,c=t.dataset.appliedTheme,a=C(o)?o:void 0,p=O(c)?c:void 0;a===e&&p===s||(t.classList.remove(...k),t.classList.add(s),t.dataset.theme=e,t.dataset.appliedTheme=s)}function Ee(){if(!g())return{appliedTheme:void 0,theme:void 0};let e=window.document.documentElement,t=C(e.dataset.theme)?e.dataset.theme:void 0;return{appliedTheme:O(e.dataset.appliedTheme)?e.dataset.appliedTheme:void 0,theme:t}}function $(e,{prefersDarkMode:t,prefersHighContrast:r}){return e==="system"?ae({prefersDarkMode:t,prefersHighContrast:r}):e}function Fe(){let e=B(N),t=e!=null?e[0]:"system",r=D(w),n=D(M);return $(t,{prefersDarkMode:r,prefersHighContrast:n})}function ae({prefersDarkMode:e,prefersHighContrast:t}){return t?e?"dark-high-contrast":"light-high-contrast":e?"dark":"light"}function me(e){let{storageKey:t,defaultTheme:r,themes:n,resolvedThemes:s,prefersDarkModeMediaQuery:o,prefersHighContrastMediaQuery:c}=e;function a(i){return typeof i=="string"&&n.includes(i)}function p(i){let h=document.cookie;if(!h)return null;try{let b=h.split(";").find(L=>L.trim().startsWith(`${i}=`))?.split("=")[1];return b?decodeURIComponent(b):null}catch{return null}}function l(i,h){let T=new Date;T.setFullYear(T.getFullYear()+1);let x=window.location.hostname,b=window.location.protocol,A=x==="ngrok.com"||x.endsWith(".ngrok.com")?"; domain=.ngrok.com":"",L=b==="https:"?"; Secure":"";return`${i}=${encodeURIComponent(h)}; expires=${T.toUTCString()}; path=/${A}; SameSite=Lax${L}`}function y(i,h){try{document.cookie=l(i,h)}catch{}}function d(i,h,T){return i==="system"?T?h?"dark-high-contrast":"light-high-contrast":h?"dark":"light":i}let m=null,v=null,P=null;try{m=p(t)}catch{}if(a(m))P=m;else{try{v=window.localStorage?.getItem(t)??null}catch{}a(v)&&(P=v)}let S=a(P)?P:r,G=matchMedia(o).matches,j=matchMedia(c).matches,R=d(S,G,j),f=document.documentElement;if(f.dataset.appliedTheme!==R||f.dataset.theme!==S){for(let i of s)f.classList.remove(i);f.classList.add(R),f.dataset.theme=S,f.dataset.appliedTheme=R}let U=a(m);try{if(a(v)&&!U){y(t,v);try{window.localStorage.removeItem(t)}catch{}}else U||y(t,S)}catch{}}function ce(){let e={storageKey:u,defaultTheme:H,themes:I,resolvedThemes:k,prefersDarkModeMediaQuery:w,prefersHighContrastMediaQuery:M};return`(${me.toString()})(${JSON.stringify(e)})`}var Y=({nonce:e})=>F("script",{dangerouslySetInnerHTML:{__html:ce()},nonce:e,suppressHydrationWarning:!0});Y.displayName="PreventWrongThemeFlashScript";var he=({nonce:e})=>fe(pe,{children:[F(Y,{nonce:e}),F(W,{})]});he.displayName="MantleThemeHeadContent";function Re(e={}){let{className:t="",ssrCookie:r}=e??{};return V(()=>{let n,s;if(!g())n=E({cookie:r}),s=$(n,{prefersDarkMode:!1,prefersHighContrast:!1});else{let o=window.matchMedia(w).matches,c=window.matchMedia(M).matches;n=E({cookie:document.cookie}),s=$(n,{prefersDarkMode:o,prefersHighContrast:c})}return{className:Q(t,s),"data-applied-theme":s,"data-theme":n}},[t,r])}function E({cookie:e}){if(!e)return H;try{let n=e.split(";").find(o=>o.trim().startsWith(`${u}=`))?.split("=")[1],s=n?globalThis.decodeURIComponent(n):null;return C(s)?s:H}catch{return H}}function xe(e){if(e)return e.split(";").map(t=>t.trim()).find(t=>t.startsWith(`${u}=`))}function le(e,t){let{broadcastChannel:r,pingKey:n}=t;try{if(r){r.postMessage({theme:e,timestamp:Date.now()});return}}catch{}try{localStorage.setItem(n,JSON.stringify({theme:e,timestamp:Date.now()}))}catch{}}function de(e){let t=new Date;t.setFullYear(t.getFullYear()+1);let{hostname:r,protocol:n}=window.location,s=r==="ngrok.com"||r.endsWith(".ngrok.com")?"; domain=.ngrok.com":"",o=n==="https:"?"; Secure":"";return`${u}=${encodeURIComponent(e)}; expires=${t.toUTCString()}; path=/${s}; SameSite=Lax${o}`}function ue(e){if(g())try{document.cookie=de(e)}catch{}}export{q as a,X as b,W as c,k as d,I as e,ye as f,C as g,ve as h,O as i,ie as j,$e as k,Ee as l,Fe as m,ce as n,he as o,Re as p,E as q,xe as r};
|
|
2
|
+
//# sourceMappingURL=chunk-HF3KJHO3.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/components/theme/fonts.tsx","../src/components/theme/themes.ts","../src/components/theme/theme-provider.tsx"],"sourcesContent":["/**\n * @fileoverview Helpers for preloading ngrok brand fonts from the CDN.\n * All font URLs resolve to `${assetsCdnOrigin}/fonts`.\n */\n\n/**\n * The origin for the assets CDN where custom ngrok fonts and assets are hosted.\n *\n * Keep this stable across the app so we can preconnect/DNS-prefetch consistently.\n * @public\n */\nconst assetsCdnOrigin = \"https://assets.ngrok.com\";\n\n/**\n * Base path for font assets on the CDN.\n * @internal\n */\nconst cdnBase = `${assetsCdnOrigin}/fonts`;\n\n/**\n * Canonical list of core font paths (relative to the CDN fonts base).\n */\nconst coreFonts = [\n\t\"/roobert/roobert-proportional-vf.woff2\",\n\t\"/jetbrains/jetbrainsmono-wght.woff2\",\n\t\"/jetbrains/jetbrainsmono-italic-wght.woff2\",\n\t\"/family/family-regular.woff2\",\n\t\"/family/family-italic.woff2\",\n] as const;\n\ntype FontPath = `/${string}` | (string & {});\n\n/**\n * Builds an absolute CDN URL for a given font.\n *\n * @returns {`https://assets.ngrok.com/fonts${T}`} An absolute, literal-typed CDN URL.\n *\n * @example\n * const href = fontHref(\"/roobert/roobert-proportional-vf.woff2\");\n * // -> \"https://assets.ngrok.com/fonts/roobert/roobert-proportional-vf.woff2\"\n */\nfunction fontHref<T extends FontPath = FontPath>(font: T) {\n\tconst path = font.startsWith(\"/\") ? font : `/${font}`;\n\treturn `${cdnBase}${path}` as const;\n}\n\n/**\n * Preload core fonts used in the mantle theme.\n *\n * Include this as early as possible in the document `<head>` so text renders\n * with the intended face without layout shifts. Uses `crossOrigin=\"anonymous\"`\n * so the browser can cache and reuse the font across origins.\n *\n * @remarks\n * For best performance, pair this with preconnect/dns-prefetch hints to the CDN.\n *\n * This is automatically included in `<MantleThemeHeadContent />`.\n *\n * @example\n * ```tsx\n * <head>\n * <meta charSet=\"utf-8\" />\n * <meta name=\"viewport\" content=\"width=device-width, initial-scale=1\" />\n *\n * // Preconnect and DNS-prefetch to the assets CDN\n * // either here or in app root headers\n * <link rel=\"preconnect\" href={assetsCdnOrigin} crossOrigin=\"anonymous\" />\n * <link rel=\"dns-prefetch\" href={assetsCdnOrigin} />\n *\n * <PreventWrongThemeFlashScript />\n * <PreloadCoreFonts />\n * // ... other head elements ...\n * </head>\n * ```\n */\nconst PreloadCoreFonts = () => (\n\t<>\n\t\t{coreFonts.map((font) => (\n\t\t\t<link\n\t\t\t\tkey={font}\n\t\t\t\trel=\"preload\"\n\t\t\t\thref={fontHref(font)}\n\t\t\t\tas=\"font\"\n\t\t\t\ttype=\"font/woff2\"\n\t\t\t\tcrossOrigin=\"anonymous\"\n\t\t\t/>\n\t\t))}\n\t</>\n);\nPreloadCoreFonts.displayName = \"PreloadCoreFonts\";\n\nexport {\n\t//,\n\tassetsCdnOrigin,\n\tfontHref,\n\tPreloadCoreFonts,\n};\n","/**\n * resolvedThemes is a tuple of valid themes that have been resolved from \"system\" to a specific theme.\n */\nconst resolvedThemes = [\"light\", \"dark\", \"light-high-contrast\", \"dark-high-contrast\"] as const;\n\n/**\n * ResolvedTheme is a type that represents a theme that has been resolved from \"system\" to a specific theme.\n */\ntype ResolvedTheme = (typeof resolvedThemes)[number];\n\n/**\n * themes is a tuple of valid themes.\n */\nconst themes = [\"system\", ...resolvedThemes] as const;\n\n/**\n * Theme is a string literal type that represents a valid theme.\n */\ntype Theme = (typeof themes)[number];\n\n/**\n * $theme is a helper which translates the Theme type into a string literal type.\n */\nconst $theme = <T extends Theme = Theme>(value: T) => value;\n\n/**\n * Type predicate that checks if a value is a valid theme.\n */\nfunction isTheme(value: unknown): value is Theme {\n\tif (typeof value !== \"string\") {\n\t\treturn false;\n\t}\n\n\treturn themes.includes(value as Theme);\n}\n\n/**\n * $resolvedTheme is a helper which translates the ResolvedTheme type into a string literal type.\n */\nconst $resolvedTheme = <T extends ResolvedTheme = ResolvedTheme>(value: T) => value;\n\n/**\n * Type predicate that checks if a value is a valid resolved theme.\n */\nfunction isResolvedTheme(value: unknown): value is ResolvedTheme {\n\tif (typeof value !== \"string\") {\n\t\treturn false;\n\t}\n\n\treturn resolvedThemes.includes(value as ResolvedTheme);\n}\n\nexport {\n\t//,\n\tthemes,\n\tresolvedThemes,\n\t$resolvedTheme,\n\t$theme,\n\tisResolvedTheme,\n\tisTheme,\n};\n\nexport type {\n\t//,\n\tTheme,\n\tResolvedTheme,\n};\n","\"use client\";\n\nimport type { PropsWithChildren } from \"react\";\nimport { createContext, useContext, useEffect, useMemo, useRef, useState } from \"react\";\nimport invariant from \"tiny-invariant\";\nimport { useMatchesMediaQuery } from \"../../hooks/use-matches-media-query.js\";\nimport { cx } from \"../../utils/cx/cx.js\";\nimport { canUseDOM } from \"../browser-only/browser-only.js\";\nimport { PreloadCoreFonts } from \"./fonts.js\";\nimport {\n\ttype ResolvedTheme,\n\ttype Theme,\n\tisResolvedTheme,\n\tisTheme,\n\tresolvedThemes,\n\tthemes,\n} from \"./themes.js\";\n\n/**\n * prefersDarkModeMediaQuery is the media query used to detect if the user prefers dark mode.\n */\nconst prefersDarkModeMediaQuery = \"(prefers-color-scheme: dark)\";\n\n/**\n * prefersHighContrastMediaQuery is the media query used to detect if the user prefers high contrast mode.\n */\nconst prefersHighContrastMediaQuery = \"(prefers-contrast: more)\";\n\n/**\n * THEME_STORAGE_KEY is the key used to store the theme in cookies.\n */\nconst THEME_STORAGE_KEY = \"mantle-ui-theme\";\n\n/**\n * DEFAULT_THEME is the initial theme to apply if no value is found in storage.\n * {@link themes}\n */\nconst DEFAULT_THEME = \"system\" satisfies Theme;\n\n/**\n * ThemeProviderState is the shape of the state returned by the ThemeProviderContext.\n */\ntype ThemeProviderState = [theme: Theme, setTheme: (theme: Theme) => void];\n\n/**\n * Initial state for the ThemeProviderContext.\n */\nconst initialState: ThemeProviderState = [\"system\", () => null];\n\n/**\n * ThemeProviderContext is a React Context that provides the current theme and a function to set the theme.\n */\nconst ThemeProviderContext = createContext<ThemeProviderState | null>(initialState);\n\ntype ThemeProviderProps = PropsWithChildren;\n\n/**\n * ThemeProvider is a React Context Provider that provides the current theme and a function to set the theme.\n *\n * @see https://mantle.ngrok.com/components/theme-provider#themeprovider\n *\n * @example\n * ```tsx\n * <ThemeProvider defaultTheme=\"system\" storageKey=\"app-theme\">\n * <App />\n * </ThemeProvider>\n * ```\n */\nfunction ThemeProvider({ children }: ThemeProviderProps) {\n\t// Init once from cookie and apply immediately to avoid flashes\n\tconst [theme, setTheme] = useState<Theme>(() => {\n\t\tconst storedTheme = getStoredTheme({\n\t\t\tcookie: canUseDOM() ? document.cookie : null,\n\t\t});\n\t\tapplyThemeToHtml(storedTheme);\n\t\treturn storedTheme;\n\t});\n\n\tconst broadcastChannelRef = useRef<BroadcastChannel | null>(null);\n\n\tuseEffect(() => {\n\t\tfunction syncThemeFromCookie(next?: Theme) {\n\t\t\tconst newTheme = next ?? getStoredTheme({ cookie: document.cookie });\n\t\t\tsetTheme(newTheme);\n\t\t\tapplyThemeToHtml(newTheme);\n\t\t}\n\n\t\t// initial sync in case defaultTheme or storageKey changed\n\t\tsyncThemeFromCookie();\n\n\t\t// add cross-tab listeners (prefer broadcast channel, use localStorage as fallback)\n\t\ttry {\n\t\t\tif (\"BroadcastChannel\" in window) {\n\t\t\t\tbroadcastChannelRef.current = new BroadcastChannel(THEME_STORAGE_KEY);\n\t\t\t\tbroadcastChannelRef.current.onmessage = (event) => {\n\t\t\t\t\tconst value: unknown = event?.data?.theme;\n\t\t\t\t\tif (isTheme(value)) {\n\t\t\t\t\t\tsyncThemeFromCookie(value);\n\t\t\t\t\t}\n\t\t\t\t};\n\t\t\t}\n\t\t} catch {\n\t\t\t// silently swallow errors\n\t\t}\n\n\t\tfunction onStorage(event: StorageEvent) {\n\t\t\tif (event.key === `${THEME_STORAGE_KEY}__ping`) {\n\t\t\t\tsyncThemeFromCookie();\n\t\t\t}\n\t\t}\n\t\twindow.addEventListener(\"storage\", onStorage);\n\n\t\t// add media query listeners for system theme changes\n\t\tconst prefersDarkMql = window.matchMedia(prefersDarkModeMediaQuery);\n\t\tconst prefersHighContrastMql = window.matchMedia(prefersHighContrastMediaQuery);\n\n\t\tfunction onChange() {\n\t\t\tsyncThemeFromCookie();\n\t\t}\n\n\t\tfunction onVisibilityChange() {\n\t\t\tif (document.visibilityState === \"visible\") {\n\t\t\t\tsyncThemeFromCookie();\n\t\t\t}\n\t\t}\n\n\t\tprefersDarkMql.addEventListener(\"change\", onChange);\n\t\tprefersHighContrastMql.addEventListener(\"change\", onChange);\n\n\t\t// pageshow fires on bfcache restore (event.persisted === true) and some restore-from-freeze cases.\n\t\twindow.addEventListener(\"pageshow\", onChange);\n\n\t\t// visibilitychange to handle coming back to a tab\n\t\tdocument.addEventListener(\"visibilitychange\", onVisibilityChange);\n\n\t\t// don't forget to clean up your slop!\n\t\treturn () => {\n\t\t\twindow.removeEventListener(\"storage\", onStorage);\n\t\t\tprefersDarkMql.removeEventListener(\"change\", onChange);\n\t\t\tprefersHighContrastMql.removeEventListener(\"change\", onChange);\n\t\t\twindow.removeEventListener(\"pageshow\", onChange);\n\t\t\tdocument.removeEventListener(\"visibilitychange\", onVisibilityChange);\n\n\t\t\ttry {\n\t\t\t\tbroadcastChannelRef.current?.close();\n\t\t\t} catch {\n\t\t\t\t// silently swallow errors\n\t\t\t}\n\t\t\tbroadcastChannelRef.current = null;\n\t\t};\n\t}, []);\n\n\tconst value: ThemeProviderState = useMemo(\n\t\t() => [\n\t\t\ttheme,\n\t\t\t(next: Theme) => {\n\t\t\t\tsetCookie(next);\n\t\t\t\tsetTheme(next);\n\t\t\t\tapplyThemeToHtml(next);\n\t\t\t\tnotifyOtherTabs(next, {\n\t\t\t\t\tbroadcastChannel: broadcastChannelRef.current,\n\t\t\t\t\tpingKey: `${THEME_STORAGE_KEY}__ping`,\n\t\t\t\t});\n\t\t\t},\n\t\t],\n\t\t[theme],\n\t);\n\n\treturn <ThemeProviderContext.Provider value={value}>{children}</ThemeProviderContext.Provider>;\n}\nThemeProvider.displayName = \"ThemeProvider\";\n\n/**\n * useTheme returns the current theme and a function to set the theme.\n *\n * @note This function will throw an error if used outside of a ThemeProvider context tree.\n */\nfunction useTheme() {\n\tconst context = useContext(ThemeProviderContext);\n\n\tinvariant(context, \"useTheme must be used within a ThemeProvider\");\n\n\treturn context;\n}\n\n/**\n * Applies the given theme to the `<html>` element.\n */\nfunction applyThemeToHtml(theme: Theme) {\n\tif (!canUseDOM()) {\n\t\treturn;\n\t}\n\n\tconst html = window.document.documentElement;\n\n\tconst prefersDarkMode = window.matchMedia(prefersDarkModeMediaQuery).matches;\n\tconst prefersHighContrast = window.matchMedia(prefersHighContrastMediaQuery).matches;\n\n\tconst resolvedTheme = resolveTheme(theme, {\n\t\tprefersDarkMode,\n\t\tprefersHighContrast,\n\t});\n\n\tconst htmlTheme = html.dataset.theme;\n\tconst htmlAppliedTheme = html.dataset.appliedTheme;\n\n\tconst currentTheme = isTheme(htmlTheme) ? htmlTheme : undefined;\n\tconst currentResolvedTheme = isResolvedTheme(htmlAppliedTheme) ? htmlAppliedTheme : undefined;\n\n\tif (currentTheme === theme && currentResolvedTheme === resolvedTheme) {\n\t\t// nothing to do: input theme and resolved class already match\n\t\treturn;\n\t}\n\n\t// Clear any stale theme class, then apply the new one\n\thtml.classList.remove(...resolvedThemes); // ✅ remove all potential theme classes\n\thtml.classList.add(resolvedTheme);\n\thtml.dataset.theme = theme;\n\thtml.dataset.appliedTheme = resolvedTheme;\n}\n\n/**\n * Read the theme and applied theme from the `<html>` element.\n */\nfunction readThemeFromHtmlElement() {\n\tif (!canUseDOM()) {\n\t\treturn {\n\t\t\tappliedTheme: undefined,\n\t\t\ttheme: undefined,\n\t\t};\n\t}\n\n\tconst htmlElement = window.document.documentElement;\n\tconst theme = isTheme(htmlElement.dataset.theme) ? htmlElement.dataset.theme : undefined;\n\tconst appliedTheme = isResolvedTheme(htmlElement.dataset.appliedTheme)\n\t\t? htmlElement.dataset.appliedTheme\n\t\t: undefined;\n\n\treturn {\n\t\tappliedTheme,\n\t\ttheme,\n\t};\n}\n\n/**\n * If the theme is \"system\", it will resolve the theme based on the user's media query preferences, otherwise it will return the theme as is.\n * This will mirror the result that gets applied to the <html> element.\n */\nfunction resolveTheme(\n\ttheme: Theme,\n\t{\n\t\tprefersDarkMode,\n\t\tprefersHighContrast,\n\t}: { prefersDarkMode: boolean; prefersHighContrast: boolean },\n) {\n\tif (theme === \"system\") {\n\t\treturn determineThemeFromMediaQuery({\n\t\t\tprefersDarkMode,\n\t\t\tprefersHighContrast,\n\t\t});\n\t}\n\n\treturn theme;\n}\n\n/**\n * If the theme is \"system\", it will resolve the theme based on the user's media query preferences, otherwise it will return the theme as is.\n * This will mirror the result that gets applied to the <html> element.\n */\nfunction useAppliedTheme() {\n\tconst themeContext = useContext(ThemeProviderContext);\n\tconst theme = themeContext != null ? themeContext[0] : \"system\";\n\n\tconst prefersDarkMode = useMatchesMediaQuery(prefersDarkModeMediaQuery);\n\tconst prefersHighContrast = useMatchesMediaQuery(prefersHighContrastMediaQuery);\n\n\treturn resolveTheme(theme, { prefersDarkMode, prefersHighContrast });\n}\n\n/**\n * determineThemeFromMediaQuery returns the theme that should be used based on the user's media query preferences.\n * @private\n *\n * @example\n * ```tsx\n * const theme = determineThemeFromMediaQuery({\n * prefersDarkMode: true,\n * prefersHighContrast: false\n * });\n * // Returns: \"dark\"\n *\n * const themeWithContrast = determineThemeFromMediaQuery({\n * prefersDarkMode: false,\n * prefersHighContrast: true\n * });\n * // Returns: \"light-high-contrast\"\n * ```\n */\nexport function determineThemeFromMediaQuery({\n\tprefersDarkMode,\n\tprefersHighContrast,\n}: {\n\tprefersDarkMode: boolean;\n\tprefersHighContrast: boolean;\n}): ResolvedTheme {\n\tif (prefersHighContrast) {\n\t\treturn prefersDarkMode ? \"dark-high-contrast\" : \"light-high-contrast\";\n\t}\n\n\treturn prefersDarkMode ? \"dark\" : \"light\";\n}\n\n/**\n * Script that runs synchronously to prevent FOUC by applying the correct theme\n * before the page renders. This is the actual function that gets stringified and inlined.\n */\nfunction preventThemeFlash(args: {\n\tstorageKey: string;\n\tdefaultTheme: Theme;\n\tthemes: readonly Theme[];\n\tresolvedThemes: readonly ResolvedTheme[];\n\tprefersDarkModeMediaQuery: string;\n\tprefersHighContrastMediaQuery: string;\n}) {\n\tconst {\n\t\tstorageKey,\n\t\tdefaultTheme,\n\t\tthemes,\n\t\tresolvedThemes,\n\t\tprefersDarkModeMediaQuery,\n\t\tprefersHighContrastMediaQuery,\n\t} = args;\n\n\tfunction isTheme(value: unknown): value is Theme {\n\t\treturn typeof value === \"string\" && themes.includes(value as Theme);\n\t}\n\n\tfunction getThemeFromCookie(name: string): string | null {\n\t\tconst cookie = document.cookie;\n\t\tif (!cookie) {\n\t\t\treturn null;\n\t\t}\n\n\t\ttry {\n\t\t\tconst cookies = cookie.split(\";\");\n\t\t\tconst themeCookie = cookies.find((c) => c.trim().startsWith(`${name}=`));\n\t\t\tconst cookieValue = themeCookie?.split(\"=\")[1];\n\t\t\tconst storedTheme = cookieValue ? decodeURIComponent(cookieValue) : null;\n\t\t\treturn storedTheme;\n\t\t} catch {\n\t\t\treturn null;\n\t\t}\n\t}\n\n\tfunction buildCookie(name: string, val: string): string {\n\t\tconst expires = new Date();\n\t\texpires.setFullYear(expires.getFullYear() + 1);\n\t\tconst hostname = window.location.hostname;\n\t\tconst protocol = window.location.protocol;\n\t\tconst domainAttribute =\n\t\t\thostname === \"ngrok.com\" || hostname.endsWith(\".ngrok.com\") ? \"; domain=.ngrok.com\" : \"\";\n\t\tconst secureAttribute = protocol === \"https:\" ? \"; Secure\" : \"\";\n\t\treturn `${name}=${encodeURIComponent(val)}; expires=${expires.toUTCString()}; path=/${domainAttribute}; SameSite=Lax${secureAttribute}`;\n\t}\n\n\tfunction writeCookie(name: string, val: string): void {\n\t\ttry {\n\t\t\tdocument.cookie = buildCookie(name, val);\n\t\t} catch {\n\t\t\t// silently swallow errors\n\t\t}\n\t}\n\n\tfunction resolveThemeValue(\n\t\ttheme: Theme,\n\t\tisDark: boolean,\n\t\tisHighContrast: boolean,\n\t): ResolvedTheme {\n\t\tif (theme === \"system\") {\n\t\t\tif (isHighContrast) {\n\t\t\t\treturn isDark ? \"dark-high-contrast\" : \"light-high-contrast\";\n\t\t\t}\n\t\t\treturn isDark ? \"dark\" : \"light\";\n\t\t}\n\t\treturn theme;\n\t}\n\n\t// 1) Read preference: cookie first, fallback to localStorage (migration support)\n\tlet cookieTheme: string | null = null;\n\tlet lsTheme: string | null = null;\n\tlet storedTheme: Theme | null = null;\n\n\ttry {\n\t\tcookieTheme = getThemeFromCookie(storageKey);\n\t} catch {\n\t\t// silently swallow errors\n\t}\n\n\tif (isTheme(cookieTheme)) {\n\t\tstoredTheme = cookieTheme;\n\t} else {\n\t\ttry {\n\t\t\tlsTheme = window.localStorage?.getItem(storageKey) ?? null;\n\t\t} catch {\n\t\t\t// silently swallow errors\n\t\t}\n\t\tif (isTheme(lsTheme)) {\n\t\t\tstoredTheme = lsTheme;\n\t\t}\n\t}\n\n\tconst preference = isTheme(storedTheme) ? storedTheme : defaultTheme;\n\n\t// 2) Resolve theme based on media queries\n\tconst isDark = matchMedia(prefersDarkModeMediaQuery).matches;\n\tconst isHighContrast = matchMedia(prefersHighContrastMediaQuery).matches;\n\tconst resolvedTheme = resolveThemeValue(preference, isDark, isHighContrast);\n\n\tconst html = document.documentElement;\n\t// 3) Apply theme to DOM (same order as applyThemeToHtml)\n\tif (html.dataset.appliedTheme !== resolvedTheme || html.dataset.theme !== preference) {\n\t\t// Remove all theme classes\n\t\tfor (const themeClass of resolvedThemes as readonly string[]) {\n\t\t\thtml.classList.remove(themeClass);\n\t\t}\n\t\t// Add resolved theme class\n\t\thtml.classList.add(resolvedTheme);\n\t\t// Set data attributes\n\t\thtml.dataset.theme = preference;\n\t\thtml.dataset.appliedTheme = resolvedTheme;\n\t}\n\n\t// 4) Handle persistence/migration synchronously to prevent FOUC\n\tconst hadValidCookie = isTheme(cookieTheme);\n\ttry {\n\t\tif (isTheme(lsTheme) && !hadValidCookie) {\n\t\t\t// Migrate from localStorage to cookie\n\t\t\twriteCookie(storageKey, lsTheme);\n\t\t\ttry {\n\t\t\t\twindow.localStorage.removeItem(storageKey);\n\t\t\t} catch {\n\t\t\t\t// silently swallow errors\n\t\t\t}\n\t\t} else if (!hadValidCookie) {\n\t\t\t// Set default cookie if none existed\n\t\t\twriteCookie(storageKey, preference);\n\t\t}\n\t} catch {\n\t\t// silently swallow errors\n\t}\n}\n\n/**\n * preventWrongThemeFlashScriptContent generates a script that prevents the wrong theme from flashing on initial page load.\n * It checks cookies for a stored theme, and if none is found, it sets the default theme.\n * It also applies the correct theme to the `<html>` element based on the user's media query preferences.\n */\nfunction preventWrongThemeFlashScriptContent() {\n\tconst args = {\n\t\tstorageKey: THEME_STORAGE_KEY,\n\t\tdefaultTheme: DEFAULT_THEME,\n\t\tthemes,\n\t\tresolvedThemes,\n\t\tprefersDarkModeMediaQuery,\n\t\tprefersHighContrastMediaQuery,\n\t} as const satisfies Parameters<typeof preventThemeFlash>[0];\n\n\treturn `(${preventThemeFlash.toString()})(${JSON.stringify(args)})`;\n}\n\ntype MantleThemeHeadContentProps = {\n\t/**\n\t * An optional CSP nonce to allowlist this inline script. Using this can help\n\t * you to avoid using the CSP `unsafe-inline` directive, which disables\n\t * XSS protection and would allowlist all inline scripts or styles.\n\t *\n\t * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Global_attributes/nonce\n\t */\n\tnonce?: string;\n};\n\nexport type PreventWrongThemeFlashScriptProps = MantleThemeHeadContentProps;\n\n/**\n * Renders an inline script that prevents Flash of Unstyled Content (FOUC) or the\n * wrong theme flashing on first paint.\n *\n * Use this when you want full control of the `<head>` contents. For a packaged,\n * one-stop solution that also handles font preloads, use {@link MantleThemeHeadContent}.\n * To add font preloads alongside this script, pair it with {@link PreloadCoreFonts}.\n *\n * Place this as early as possible in the `<head>`.\n *\n * @example\n * ```tsx\n * <head>\n * <PreventWrongThemeFlashScript nonce={nonce} />\n * <PreloadCoreFonts />\n * </head>\n * ```\n *\n * @param nonce - Optional CSP nonce to allowlist the inline script under a strict CSP.\n * @returns {JSX.Element} A script tag injected before first paint.\n * @see PreloadCoreFonts\n * @see MantleThemeHeadContent\n * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/nonce\n */\nconst PreventWrongThemeFlashScript = ({ nonce }: PreventWrongThemeFlashScriptProps) => (\n\t<script\n\t\tdangerouslySetInnerHTML={{\n\t\t\t__html: preventWrongThemeFlashScriptContent(),\n\t\t}}\n\t\tnonce={nonce}\n\t\tsuppressHydrationWarning\n\t/>\n);\nPreventWrongThemeFlashScript.displayName = \"PreventWrongThemeFlashScript\";\n\n/**\n * Renders the Mantle theme `<head>` content:\n * - an inline script to prevent FOUC / wrong-theme flash, and\n * - preload links for the core fonts.\n *\n * Use this when you want the one-liner that “just works.”\n * If you prefer fine-grained control, use {@link PreventWrongThemeFlashScript}\n * and {@link PreloadCoreFonts} directly.\n *\n * Place this as early as possible in the `<head>` so it runs before first paint\n * and fonts start fetching ASAP.\n *\n * @example\n * ```tsx\n * <head>\n * // Performance hints for the CDN (recommended)\n * <link rel=\"preconnect\" href={assetsCdnOrigin} crossOrigin=\"anonymous\" />\n * <link rel=\"dns-prefetch\" href={assetsCdnOrigin} />\n *\n * <MantleThemeHeadContent nonce={nonce} />\n * </head>\n * ```\n *\n * @param nonce - Optional CSP nonce to allowlist the inline script under a strict CSP.\n * @returns JSX.Element fragment containing the script and font preloads.\n * @see PreventWrongThemeFlashScript\n * @see PreloadCoreFonts\n * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/nonce\n */\nconst MantleThemeHeadContent = ({ nonce }: MantleThemeHeadContentProps) => (\n\t<>\n\t\t<PreventWrongThemeFlashScript nonce={nonce} />\n\t\t<PreloadCoreFonts />\n\t</>\n);\nMantleThemeHeadContent.displayName = \"MantleThemeHeadContent\";\n\ntype InitialThemeProps = {\n\tclassName: string;\n\t\"data-applied-theme\": ResolvedTheme;\n\t\"data-theme\": Theme;\n};\n\ntype UseInitialHtmlThemePropsOptions = {\n\tclassName?: string;\n\t/**\n\t * Theme cookie string for SSR theme resolution. Pass only the theme cookie\n\t * pair (via {@link extractThemeCookie}) rather than the full raw `Cookie`\n\t * header to avoid leaking sensitive cookies in serialized loader data.\n\t */\n\tssrCookie?: string;\n};\n\n/**\n * useInitialHtmlThemeProps returns the initial props that should be applied to the <html> element to prevent react hydration errors.\n */\nfunction useInitialHtmlThemeProps(props: UseInitialHtmlThemePropsOptions = {}): InitialThemeProps {\n\tconst { className = \"\", ssrCookie } = props ?? {};\n\n\treturn useMemo(() => {\n\t\tlet initialTheme: Theme;\n\t\tlet resolvedTheme: ResolvedTheme;\n\n\t\tif (!canUseDOM()) {\n\t\t\tinitialTheme = getStoredTheme({ cookie: ssrCookie });\n\t\t\tresolvedTheme = resolveTheme(initialTheme, {\n\t\t\t\t// During SSR we can't detect media queries, so assume light/no high contrast.\n\t\t\t\t// The inline script will correct this before paint for \"system\" theme users.\n\t\t\t\tprefersDarkMode: false,\n\t\t\t\tprefersHighContrast: false,\n\t\t\t});\n\t\t} else {\n\t\t\tconst prefersDarkMode = window.matchMedia(prefersDarkModeMediaQuery).matches;\n\t\t\tconst prefersHighContrast = window.matchMedia(prefersHighContrastMediaQuery).matches;\n\t\t\tinitialTheme = getStoredTheme({ cookie: document.cookie });\n\t\t\tresolvedTheme = resolveTheme(initialTheme, {\n\t\t\t\tprefersDarkMode,\n\t\t\t\tprefersHighContrast,\n\t\t\t});\n\t\t}\n\n\t\treturn {\n\t\t\tclassName: cx(className, resolvedTheme),\n\t\t\t\"data-applied-theme\": resolvedTheme,\n\t\t\t\"data-theme\": initialTheme,\n\t\t};\n\t}, [className, ssrCookie]);\n}\n\ntype GetStoredThemeOptions = {\n\t/**\n\t * raw Cookie header (SSR) or document.cookie (client)\n\t */\n\tcookie: string | null | undefined;\n};\n\n/**\n * Returns the persisted UI theme from a Cookie header string.\n *\n * Looks for a cookie named by {@link THEME_STORAGE_KEY} and returns its value **iff**\n * it’s a valid `Theme` per `isTheme`. Otherwise, falls back to\n * {@link DEFAULT_THEME}. This function never throws; malformed encodings or\n * missing cookies quietly return the default.\n *\n * @example\n * getStoredTheme({ cookie: `${THEME_STORAGE_KEY}=dark; session=abc` }) // \"dark\"\n * @example\n * getStoredTheme({ cookie: \"\" }) // DEFAULT_THEME\n */\nfunction getStoredTheme({ cookie }: GetStoredThemeOptions): Theme {\n\tif (!cookie) {\n\t\treturn DEFAULT_THEME;\n\t}\n\n\ttry {\n\t\tconst cookies = cookie.split(\";\");\n\t\tconst themeCookie = cookies.find((cookieStr) =>\n\t\t\tcookieStr.trim().startsWith(`${THEME_STORAGE_KEY}=`),\n\t\t);\n\t\tconst cookieValue = themeCookie?.split(\"=\")[1];\n\t\tconst storedTheme = cookieValue ? globalThis.decodeURIComponent(cookieValue) : null;\n\n\t\treturn isTheme(storedTheme) ? storedTheme : DEFAULT_THEME;\n\t} catch {\n\t\treturn DEFAULT_THEME;\n\t}\n}\n\n/**\n * Extract just the mantle theme cookie from a raw `Cookie` header string.\n *\n * Use this in SSR loaders to safely pass the theme cookie to\n * {@link useInitialHtmlThemeProps} without exposing the full `Cookie` header\n * (which may contain HttpOnly/session cookies) in serialized loader data.\n *\n * @example\n * ```ts\n * // app/root.tsx loader\n * export const loader = async ({ request }: Route.LoaderArgs) => {\n * const themeCookie = extractThemeCookie(request.headers.get(\"Cookie\"));\n * return { themeCookie };\n * };\n * ```\n *\n * @param cookieHeader - The raw `Cookie` header string from the request, or null/undefined.\n * @returns The `mantle-ui-theme=<value>` cookie string, or undefined if not found.\n */\nfunction extractThemeCookie(cookieHeader: string | null | undefined): string | undefined {\n\tif (!cookieHeader) {\n\t\treturn undefined;\n\t}\n\n\treturn cookieHeader\n\t\t.split(\";\")\n\t\t.map((part) => part.trim())\n\t\t.find((part) => part.startsWith(`${THEME_STORAGE_KEY}=`));\n}\n\nexport {\n\tMantleThemeHeadContent,\n\tPreventWrongThemeFlashScript,\n\tThemeProvider,\n\t//,\n\textractThemeCookie,\n\tgetStoredTheme,\n\tpreventWrongThemeFlashScriptContent,\n\treadThemeFromHtmlElement,\n\tuseAppliedTheme,\n\tuseInitialHtmlThemeProps,\n\tuseTheme,\n};\n\n/**\n * Notifies other open tabs (same origin) that the theme changed.\n *\n * Prefers a shared {@link BroadcastChannel} for immediate, reliable delivery.\n * Falls back to writing a unique “ping” value to `localStorage`, which triggers\n * the cross-tab `storage` event. Both mechanisms only work across the same origin.\n *\n * Uses a timestamp to ensure the storage value always changes so the event fires.\n *\n * @remarks\n * - Same-origin only: BroadcastChannel and the `storage` event do not cross subdomains\n * or different schemes/ports. For cross-subdomain sync, use a postMessage hub or server push.\n * - This function is fire-and-forget and intentionally swallows errors.\n * - Receivers should re-read the cookie/source of truth and then apply the theme;\n * don’t trust the payload blindly.\n *\n * @example\n * // Sender (inside your setter)\n * notifyOtherTabs(nextTheme, {\n * broadcastChannel: broadcastChannelRef.current,\n * pingKey: `${storageKey}__ping`,\n * });\n *\n * @example\n * // Receiver (setup once per tab)\n * const bc = new BroadcastChannel(storageKey);\n * bc.onmessage = () => syncThemeFromCookie();\n * window.addEventListener('storage', (e) => {\n * if (e.key === `${storageKey}__ping`) syncThemeFromCookie();\n * });\n */\nfunction notifyOtherTabs(\n\ttheme: Theme,\n\toptions: {\n\t\tbroadcastChannel: BroadcastChannel | null;\n\t\tpingKey: `${string}__ping`;\n\t},\n) {\n\tconst { broadcastChannel, pingKey } = options;\n\n\t// first try BroadcastChannel\n\ttry {\n\t\tif (broadcastChannel) {\n\t\t\tbroadcastChannel.postMessage({\n\t\t\t\ttheme,\n\t\t\t\ttimestamp: Date.now(),\n\t\t\t});\n\t\t\treturn;\n\t\t}\n\t} catch {\n\t\t// silently swallow errors\n\t}\n\n\t// fallback to storage event: write a \"ping\" key (not the real storageKey)\n\ttry {\n\t\tlocalStorage.setItem(pingKey, JSON.stringify({ theme, timestamp: Date.now() }));\n\t} catch {\n\t\t// silently swallow errors\n\t}\n}\n\nfunction buildThemeCookie(value: string) {\n\tconst expires = new Date();\n\texpires.setFullYear(expires.getFullYear() + 1); // 1 year expiration\n\n\t// Only set .ngrok.com domain for ngrok domains, otherwise let it default to current domain\n\tconst { hostname, protocol } = window.location;\n\tconst domainAttribute =\n\t\thostname === \"ngrok.com\" || hostname.endsWith(\".ngrok.com\") ? \"; domain=.ngrok.com\" : \"\";\n\tconst secureAttribute = protocol === \"https:\" ? \"; Secure\" : \"\";\n\n\treturn `${THEME_STORAGE_KEY}=${encodeURIComponent(value)}; expires=${expires.toUTCString()}; path=/${domainAttribute}; SameSite=Lax${secureAttribute}` as const;\n}\n\n/**\n * Sets a cookie with appropriate domain for the current hostname.\n * Uses .ngrok.com for ngrok domains, otherwise no domain (current domain only).\n */\nfunction setCookie(value: string) {\n\tif (!canUseDOM()) {\n\t\treturn;\n\t}\n\n\ttry {\n\t\tdocument.cookie = buildThemeCookie(value);\n\t} catch {\n\t\t// silently swallow errors\n\t}\n}\n"],"mappings":"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","names":["Fragment","jsx","assetsCdnOrigin","cdnBase","coreFonts","fontHref","font","path","PreloadCoreFonts","resolvedThemes","themes","$theme","value","isTheme","$resolvedTheme","isResolvedTheme","createContext","useContext","useEffect","useMemo","useRef","useState","invariant","Fragment","jsx","jsxs","prefersDarkModeMediaQuery","prefersHighContrastMediaQuery","THEME_STORAGE_KEY","DEFAULT_THEME","initialState","ThemeProviderContext","createContext","ThemeProvider","children","theme","setTheme","useState","storedTheme","getStoredTheme","canUseDOM","applyThemeToHtml","broadcastChannelRef","useRef","useEffect","syncThemeFromCookie","next","newTheme","event","value","isTheme","onStorage","prefersDarkMql","prefersHighContrastMql","onChange","onVisibilityChange","useMemo","setCookie","notifyOtherTabs","useTheme","context","useContext","invariant","html","prefersDarkMode","prefersHighContrast","resolvedTheme","resolveTheme","htmlTheme","htmlAppliedTheme","currentTheme","currentResolvedTheme","isResolvedTheme","resolvedThemes","readThemeFromHtmlElement","htmlElement","determineThemeFromMediaQuery","useAppliedTheme","themeContext","useMatchesMediaQuery","preventThemeFlash","args","storageKey","defaultTheme","themes","getThemeFromCookie","name","cookie","cookieValue","c","buildCookie","val","expires","hostname","protocol","domainAttribute","secureAttribute","writeCookie","resolveThemeValue","isDark","isHighContrast","cookieTheme","lsTheme","preference","themeClass","hadValidCookie","preventWrongThemeFlashScriptContent","PreventWrongThemeFlashScript","nonce","MantleThemeHeadContent","PreloadCoreFonts","useInitialHtmlThemeProps","props","className","ssrCookie","initialTheme","cx","cookieStr","extractThemeCookie","cookieHeader","part","notifyOtherTabs","theme","options","broadcastChannel","pingKey","buildThemeCookie","value","expires","hostname","protocol","domainAttribute","secureAttribute","THEME_STORAGE_KEY","setCookie","canUseDOM"]}
|
|
@@ -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-ELZLLG6G.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-ELZLLG6G.js";import{d as p}from"./chunk-EIEPGCIG.js";import{c as g}from"./chunk-CBRSMQ26.js";import{a}from"./chunk-PFXFESEN.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-KCF3KPUB.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{useCallback as r,useState as a}from"react";function
|
|
2
|
-
//# sourceMappingURL=chunk-
|
|
1
|
+
import{useCallback as r,useState as a}from"react";function p(){let[e,t]=a(""),n=r(o=>{(async()=>{try{if(typeof window.navigator?.clipboard?.writeText=="function")await navigator.clipboard.writeText(o),t(o);else throw new Error("writeText not supported")}catch{c(o),t(o)}})()},[]);return[e,n]}function c(e){let t=document.createElement("textarea");t.value=e,document.body.appendChild(t),t.select(),document.execCommand("copy"),document.body.removeChild(t)}export{p as a};
|
|
2
|
+
//# sourceMappingURL=chunk-PNL7JOXI.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/hooks/use-copy-to-clipboard.tsx"],"sourcesContent":["import { useCallback, useState } from \"react\";\n\n/**\n * A hook that allows you to copy a string to the clipboard.\n *\n * Inspired by: https://usehooks.com/usecopytoclipboard\n */\nfunction useCopyToClipboard() {\n\tconst [state, setState] = useState<string>(\"\");\n\n\tconst copyToClipboard = useCallback((value: string) => {\n\t\tconst handleCopy = async () => {\n\t\t\ttry {\n\t\t\t\tif (typeof window.navigator?.clipboard?.writeText === \"function\") {\n\t\t\t\t\tawait navigator.clipboard.writeText(value);\n\t\t\t\t\tsetState(value);\n\t\t\t\t} else {\n\t\t\t\t\tthrow new Error(\"writeText not supported\");\n\t\t\t\t}\n\t\t\t} catch {\n\t\t\t\tcopyToClipboardPolyfill(value);\n\t\t\t\tsetState(value);\n\t\t\t}\n\t\t};\n\n\t\thandleCopy();\n\t}, []);\n\n\treturn [state, copyToClipboard] as const;\n}\n\nexport {\n\t//,\n\tuseCopyToClipboard,\n};\n\n/**\n * A fallback copy to clipboard function for older browsers.\n */\nfunction copyToClipboardPolyfill(text: string) {\n\tconst tempTextArea = document.createElement(\"textarea\");\n\ttempTextArea.value = text;\n\tdocument.body.appendChild(tempTextArea);\n\ttempTextArea.select();\n\tdocument.execCommand(\"copy\");\n\tdocument.body.removeChild(tempTextArea);\n}\n"],"mappings":"AAAA,OAAS,eAAAA,EAAa,YAAAC,MAAgB,QAOtC,SAASC,GAAqB,CAC7B,GAAM,CAACC,EAAOC,CAAQ,EAAIH,EAAiB,EAAE,EAEvCI,EAAkBL,EAAaM,GAAkB,EACnC,SAAY,CAC9B,GAAI,CACH,GAAI,OAAO,OAAO,WAAW,WAAW,WAAc,WACrD,MAAM,UAAU,UAAU,UAAUA,CAAK,EACzCF,EAASE,CAAK,MAEd,OAAM,IAAI,MAAM,yBAAyB,CAE3C,MAAQ,CACPC,EAAwBD,CAAK,EAC7BF,EAASE,CAAK,CACf,CACD,GAEW,CACZ,EAAG,CAAC,CAAC,EAEL,MAAO,CAACH,EAAOE,CAAe,CAC/B,CAUA,SAASG,EAAwBC,EAAc,CAC9C,IAAMC,EAAe,SAAS,cAAc,UAAU,EACtDA,EAAa,MAAQD,EACrB,SAAS,KAAK,YAAYC,CAAY,EACtCA,EAAa,OAAO,EACpB,SAAS,YAAY,MAAM,EAC3B,SAAS,KAAK,YAAYA,CAAY,CACvC","names":["useCallback","useState","useCopyToClipboard","state","setState","copyToClipboard","value","copyToClipboardPolyfill","copyToClipboardPolyfill","text","tempTextArea"]}
|
package/dist/code-block.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{a as _}from"./chunk-
|
|
1
|
+
import{a as _}from"./chunk-PNL7JOXI.js";import{a as O}from"./chunk-W2YQRWR5.js";import{a as B}from"./chunk-OP6JMBKJ.js";import{a as I}from"./chunk-IVQ626TU.js";import{a as C}from"./chunk-ADF5DAYG.js";import"./chunk-SBQHQ2SJ.js";import{a as m}from"./chunk-PFXFESEN.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 ce from"clsx";import{createContext as me,forwardRef as h,useContext as A,useEffect as v,useId as ge,useMemo as F,useRef as fe,useState as x}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 S(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 T=["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"&&T.includes(e);function H(e="sh"){return`language-${e??"sh"}`}import{Fragment as Ce,jsx as s,jsxs as j}from"react/jsx-runtime";var w=me({codeId:void 0,copyText:"",hasCodeExpander:!1,isCodeExpanded:!1,registerCodeId:()=>{},setCopyText:()=>{},setHasCodeExpander:()=>{},setIsCodeExpanded:()=>{},unregisterCodeId:()=>{}}),V=h(({asChild:e=!1,className:t,...o},n)=>{let[r,a]=x(""),[p,l]=x(!1),[c,f]=x(!1),[u,i]=x(void 0),L=F(()=>({codeId:u,copyText:r,hasCodeExpander:p,isCodeExpanded:c,registerCodeId:g=>{i(b=>(P(b==null,"You can only render a single CodeBlockCode within a CodeBlock."),g))},setCopyText:a,setHasCodeExpander:l,setIsCodeExpanded:f,unregisterCodeId:g=>{i(b=>{P(b===g,"You can only render a single CodeBlockCode within a CodeBlock.")})}}),[u,r,p,c]),y=e?C:"div";return s(w.Provider,{value:L,children:s(y,{"data-slot":"code-block",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=h(({asChild:e=!1,className:t,...o},n)=>s(e?C:"div",{className:m("relative",t),ref:n,...o}));Y.displayName="CodeBlockBody";var J=h(({className:e,highlightLines:t,indentation:o,language:n="text",showLineNumbers:r,style:a,tabIndex:p,value:l,...c},f)=>{let u=ge(),{hasCodeExpander:i,isCodeExpanded:L,registerCodeId:y,setCopyText:g,unregisterCodeId:b}=A(w),M=$(n,o),k=F(()=>S(l,{indentation:M}),[l,M]),[X,Z]=x(N(S(l,{indentation:M})));v(()=>{let z=E.languages[n];P(z,`CodeBlock does not support the language "${n}". The syntax highlighter does not have a grammar for this language. The supported languages are: ${T.join(", ")}.`);let ee=E.highlight(k,z,n);Z(ee)},[k,n]),v(()=>{g(k)},[k,g]),v(()=>(y(u),()=>{b(u)}),[u,y,b]);let R=H(n);return s("pre",{"aria-expanded":i?L: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:u,ref:f,style:{...a,tabSize:2,MozTabSize:2},tabIndex:p??-1,...c,children:s("code",{className:ce("text-size-inherit",R),dangerouslySetInnerHTML:{__html:X},suppressHydrationWarning:!0})})});J.displayName="CodeBlockCode";var q=h(({asChild:e=!1,className:t,...o},n)=>s(e?C:"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=h(({asChild:e=!1,className:t,...o},n)=>s(e?C:"h3",{ref:n,className:m("text-mono m-0 font-mono font-normal",t),...o}));Q.displayName="CodeBlockTitle";var G=h(({asChild:e=!1,className:t,onCopy:o,onCopyError:n,onClick:r,...a},p)=>{let{copyText:l}=A(w),[,c]=_(),[f,u]=x(!1),i=fe(void 0);return v(()=>()=>{i.current!=null&&clearTimeout(i.current)},[]),j(e?C:"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:p,onClick:async y=>{try{if(r?.(y),y.defaultPrevented){i.current!=null&&clearTimeout(i.current);return}await c(l),o?.(l),u(!0),i.current!=null&&clearTimeout(i.current),i.current=setTimeout(()=>{u(!1)},2e3)}catch(g){n?.(g)}},...a,children:[s("span",{className:"sr-only",children:"Copy code"}),f?j(Ce,{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=h(({asChild:e=!1,className:t,onClick:o,...n},r)=>{let{codeId:a,isCodeExpanded:p,setIsCodeExpanded:l,setHasCodeExpander:c}=A(w);return v(()=>(c(!0),()=>{c(!1)}),[c]),j(e?C:"button",{...n,"aria-controls":a,"aria-expanded":p,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:u=>{l(i=>!i),o?.(u)},children:[p?"Show less":"Show more"," ",s(I,{svg:s(ie,{weight:"bold"}),className:m("size-4",p&&"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 ye={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
2
|
`).map(a=>/^\S+/.test(a)?a:a.slice(n)).join(`
|
|
3
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"],d={collapsible:!1,disableCopy:!1,indentation:void 0,mode:void 0,title:void 0};function ve(e){let t=e?.trim()??"";if(!t)return d;let o=ke(t).reduce((n,r)=>{let[a,p]=r.split("=");if(!a)return n;let l=Le(p);return n[a]=l??!0,n},{});try{let n=Te(o);return{...d,...n}}catch{return d}}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 Se(e){return Ie.includes(e)}function Te(e){let{collapsible:t=d.collapsible,disableCopy:o=d.disableCopy,indentation:n=d.indentation,mode:r=d.mode,title:a=d.title}=e;return{collapsible:typeof t=="string"||typeof t=="boolean"?B(t):d.collapsible,disableCopy:typeof o=="string"||typeof o=="boolean"?B(o):d.disableCopy,indentation:W(n)?n:d.indentation,mode:Se(r)?r:d.mode,title:typeof a=="string"?a.trim():d.title}}export{ye as CodeBlock,d as defaultMeta,N as escapeHtml,he as fmtCode,H as formatLanguageClassName,D as isSupportedLanguage,S as normalizeIndentation,se as parseLanguage,ve as parseMetastring,T as supportedLanguages};
|
|
4
4
|
//# sourceMappingURL=code-block.js.map
|
package/dist/code-block.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/code-block/code-block.tsx","../src/components/code-block/escape-html.ts","../src/components/code-block/highlighter.ts","../src/components/code-block/indentation.ts","../src/components/code-block/normalize.ts","../src/components/code-block/supported-languages.ts","../src/components/code-block/fmt-code.ts","../src/components/code-block/parse-metastring.ts"],"sourcesContent":["\"use client\";\n\nimport { CaretDownIcon } from \"@phosphor-icons/react/CaretDown\";\nimport { CheckIcon } from \"@phosphor-icons/react/Check\";\nimport { CopyIcon } from \"@phosphor-icons/react/Copy\";\nimport { FileTextIcon } from \"@phosphor-icons/react/FileText\";\nimport { TerminalIcon } from \"@phosphor-icons/react/Terminal\";\nimport clsx from \"clsx\";\nimport type {\n\tComponentProps,\n\tComponentRef,\n\tDispatch,\n\tHTMLAttributes,\n\tReactNode,\n\tSetStateAction,\n} from \"react\";\nimport {\n\tcreateContext,\n\tforwardRef,\n\tuseContext,\n\tuseEffect,\n\tuseId,\n\tuseMemo,\n\tuseRef,\n\tuseState,\n} from \"react\";\nimport assert from \"tiny-invariant\";\nimport { useCopyToClipboard } from \"../../hooks/use-copy-to-clipboard.js\";\nimport type { WithAsChild } from \"../../types/as-child.js\";\nimport { cx } from \"../../utils/cx/cx.js\";\nimport { Icon as MantleIcon } from \"../icon/icon.js\";\nimport type { SvgAttributes } from \"../icon/types.js\";\nimport { TrafficPolicyFileIcon } from \"../icons/traffic-policy-file.js\";\nimport { Slot } from \"../slot/index.js\";\nimport { escapeHtml } from \"./escape-html.js\";\nimport { Highlighter } from \"./highlighter.js\";\nimport { type Indentation, inferIndentation } from \"./indentation.js\";\nimport type { LineRange } from \"./line-numbers.js\";\nimport { normalizeIndentation } from \"./normalize.js\";\nimport type { Mode } from \"./parse-metastring.js\";\nimport type { SupportedLanguage } from \"./supported-languages.js\";\nimport { formatLanguageClassName, supportedLanguages } from \"./supported-languages.js\";\n\n/**\n * TODO(cody):\n * - fix line numbers, maybe try grid instead of :before and flex?\n * - fix line hightlighting\n * - fix line wrapping? horizontal scrolling has problems w/ line highlighting :(\n */\n\ntype CodeBlockContextType = {\n\tcodeId: string | undefined;\n\tcopyText: string;\n\thasCodeExpander: boolean;\n\tisCodeExpanded: boolean;\n\tregisterCodeId: (id: string) => void;\n\tsetCopyText: (newCopyText: string) => void;\n\tsetHasCodeExpander: (value: boolean) => void;\n\tsetIsCodeExpanded: Dispatch<SetStateAction<boolean>>;\n\tunregisterCodeId: (id: string) => void;\n};\n\nconst CodeBlockContext = createContext<CodeBlockContextType>({\n\tcodeId: undefined,\n\tcopyText: \"\",\n\thasCodeExpander: false,\n\tisCodeExpanded: false,\n\tregisterCodeId: () => {},\n\tsetCopyText: () => {},\n\tsetHasCodeExpander: () => {},\n\tsetIsCodeExpanded: () => {},\n\tunregisterCodeId: () => {},\n});\n\n/**\n * Code blocks render and apply syntax highlighting to blocks of code.\n * This is the root component for all code block components.\n *\n * @see https://mantle.ngrok.com/components/code-block#codeblockroot\n *\n * @example\n * ```tsx\n * <CodeBlock.Root>\n * <CodeBlock.Header>\n * <CodeBlock.Icon preset=\"file\" />\n * <CodeBlock.Title>…</CodeBlock.Title>\n * </CodeBlock.Header>\n * <CodeBlock.Body>\n * <CodeBlock.CopyButton />\n * <CodeBlock.Code language=\"…\" value={fmtCode\\`…\\`} />\n * </CodeBlock.Body>\n * <CodeBlock.ExpanderButton />\n * </CodeBlock.Root>\n * ```\n */\nconst Root = forwardRef<ComponentRef<\"div\">, Omit<ComponentProps<\"div\">, \"align\"> & WithAsChild>(\n\t({ asChild = false, className, ...props }, ref) => {\n\t\tconst [copyText, setCopyText] = useState(\"\");\n\t\tconst [hasCodeExpander, setHasCodeExpander] = useState(false);\n\t\tconst [isCodeExpanded, setIsCodeExpanded] = useState(false);\n\t\tconst [codeId, setCodeId] = useState<string | undefined>(undefined);\n\n\t\tconst context: CodeBlockContextType = useMemo(\n\t\t\t() =>\n\t\t\t\t({\n\t\t\t\t\tcodeId,\n\t\t\t\t\tcopyText,\n\t\t\t\t\thasCodeExpander,\n\t\t\t\t\tisCodeExpanded,\n\t\t\t\t\tregisterCodeId: (id) => {\n\t\t\t\t\t\tsetCodeId((old) => {\n\t\t\t\t\t\t\tassert(old == null, \"You can only render a single CodeBlockCode within a CodeBlock.\");\n\t\t\t\t\t\t\treturn id;\n\t\t\t\t\t\t});\n\t\t\t\t\t},\n\t\t\t\t\tsetCopyText,\n\t\t\t\t\tsetHasCodeExpander,\n\t\t\t\t\tsetIsCodeExpanded,\n\t\t\t\t\tunregisterCodeId: (id) => {\n\t\t\t\t\t\tsetCodeId((old) => {\n\t\t\t\t\t\t\tassert(old === id, \"You can only render a single CodeBlockCode within a CodeBlock.\");\n\t\t\t\t\t\t\treturn undefined;\n\t\t\t\t\t\t});\n\t\t\t\t\t},\n\t\t\t\t}) as const,\n\t\t\t[codeId, copyText, hasCodeExpander, isCodeExpanded],\n\t\t);\n\n\t\tconst Component = asChild ? Slot : \"div\";\n\n\t\treturn (\n\t\t\t<CodeBlockContext.Provider value={context}>\n\t\t\t\t<Component\n\t\t\t\t\tdata-slot=\"code-block\"\n\t\t\t\t\tclassName={cx(\n\t\t\t\t\t\t\"text-mono overflow-hidden rounded-md border border-gray-300 bg-gray-50 font-mono\",\n\t\t\t\t\t\t\"[&_svg]:shrink-0\",\n\t\t\t\t\t\tclassName,\n\t\t\t\t\t)}\n\t\t\t\t\tref={ref}\n\t\t\t\t\t{...props}\n\t\t\t\t/>\n\t\t\t</CodeBlockContext.Provider>\n\t\t);\n\t},\n);\nRoot.displayName = \"CodeBlock\";\n\n/**\n * The body of the `CodeBlock`. This is where the `CodeBlock.Code` and optional\n * `CodeBlock.CopyButton` is rendered.\n *\n * @see https://mantle.ngrok.com/components/code-block#codeblockbody\n *\n * @example\n * ```tsx\n * <CodeBlock.Root>\n * <CodeBlock.Header>\n * <CodeBlock.Icon preset=\"file\" />\n * <CodeBlock.Title>…</CodeBlock.Title>\n * </CodeBlock.Header>\n * <CodeBlock.Body>\n * <CodeBlock.CopyButton />\n * <CodeBlock.Code language=\"…\" value={fmtCode\\`…\\`} />\n * </CodeBlock.Body>\n * <CodeBlock.ExpanderButton />\n * </CodeBlock.Root>\n * ```\n */\nconst Body = forwardRef<ComponentRef<\"div\">, ComponentProps<\"div\"> & WithAsChild>(\n\t({ asChild = false, className, ...props }, ref) => {\n\t\tconst Component = asChild ? Slot : \"div\";\n\n\t\treturn <Component className={cx(\"relative\", className)} ref={ref} {...props} />;\n\t},\n);\nBody.displayName = \"CodeBlockBody\";\n\ntype CodeBlockCodeProps = Omit<ComponentProps<\"pre\">, \"children\"> & {\n\t/**\n\t * The code to display in the code block. Should be code formatted as a string. This code will be passed to our syntax highlighter.\n\t */\n\tvalue: string;\n\t/**\n\t * @todo not implemented yet\n\t */\n\thighlightLines?: (LineRange | number)[];\n\t/**\n\t * The type of indentation to use. Can be either \"tabs\" or \"spaces\".\n\t * @default inferred from the given language, fallback to `spaces`\n\t */\n\tindentation?: Indentation;\n\t/**\n\t * The language of the code block. This will be used to determine how to syntax highlight the code.\n\t * @default `\"text\"`.\n\t */\n\tlanguage?: SupportedLanguage;\n\t/**\n\t * @todo not implemented yet\n\t */\n\tshowLineNumbers?: boolean;\n};\n\n/**\n * The `CodeBlock` content. This is where the code is rendered and syntax highlighted.\n *\n * @see https://mantle.ngrok.com/components/code-block#codeblockcode\n *\n * @example\n * ```tsx\n * <CodeBlock.Root>\n * <CodeBlock.Header>\n * <CodeBlock.Icon preset=\"file\" />\n * <CodeBlock.Title>…</CodeBlock.Title>\n * </CodeBlock.Header>\n * <CodeBlock.Body>\n * <CodeBlock.CopyButton />\n * <CodeBlock.Code\n * language=\"sh\"\n * value={fmtCode`ffmpeg -i multichannel.mxf -map 0:v:0 -map 0:a:0 -map 0:a:0 -c:a:0 ac3 -b:a:0 640k -ac:a:1 2 -c:a:1 aac -b:2 128k out.mp4`}\n * />\n * </CodeBlock.Body>\n * <CodeBlock.ExpanderButton />\n * </CodeBlock.Root>\n * ```\n */\nconst Code = forwardRef<ComponentRef<\"pre\">, CodeBlockCodeProps>(\n\t(\n\t\t{\n\t\t\tclassName,\n\t\t\thighlightLines: _unusedHighlightLines, // not implemented yet\n\t\t\tindentation: propIndentation,\n\t\t\tlanguage = \"text\",\n\t\t\tshowLineNumbers: _unusedShowLineNumbers, // not implemented yet\n\t\t\tstyle,\n\t\t\ttabIndex,\n\t\t\tvalue,\n\t\t\t...props\n\t\t},\n\t\tref,\n\t) => {\n\t\tconst id = useId();\n\t\tconst { hasCodeExpander, isCodeExpanded, registerCodeId, setCopyText, unregisterCodeId } =\n\t\t\tuseContext(CodeBlockContext);\n\t\tconst indentation = inferIndentation(language, propIndentation);\n\n\t\t// trim any leading and trailing whitespace/empty lines, convert leading tabs to spaces\n\t\tconst normalizedAndTrimmedValue = useMemo(\n\t\t\t() => normalizeIndentation(value, { indentation }),\n\t\t\t[value, indentation],\n\t\t);\n\t\tconst [highlightedCodeInnerHtml, setHighlightedCodeInnerHtml] = useState(\n\t\t\t// initialize the <code> inner html with escaped HTML since we are using\n\t\t\t// dangerouslySetInnerHTML to set the inner html of the <code> element\n\t\t\t// and use Prism.js to \"highlight\" the code in a useEffect (client-side only)\n\t\t\tescapeHtml(normalizeIndentation(value, { indentation })),\n\t\t);\n\n\t\tuseEffect(() => {\n\t\t\tconst grammar = Highlighter.languages[language];\n\t\t\tassert(\n\t\t\t\tgrammar,\n\t\t\t\t`CodeBlock does not support the language \"${language}\". The syntax highlighter does not have a grammar for this language. The supported languages are: ${supportedLanguages.join(\", \")}.`,\n\t\t\t);\n\t\t\tconst newHighlightedCodeInnerHtml = Highlighter.highlight(\n\t\t\t\tnormalizedAndTrimmedValue,\n\t\t\t\tgrammar,\n\t\t\t\tlanguage,\n\t\t\t);\n\t\t\tsetHighlightedCodeInnerHtml(newHighlightedCodeInnerHtml);\n\t\t}, [normalizedAndTrimmedValue, language]);\n\n\t\tuseEffect(() => {\n\t\t\tsetCopyText(normalizedAndTrimmedValue);\n\t\t}, [normalizedAndTrimmedValue, setCopyText]);\n\n\t\tuseEffect(() => {\n\t\t\tregisterCodeId(id);\n\n\t\t\treturn () => {\n\t\t\t\tunregisterCodeId(id);\n\t\t\t};\n\t\t}, [id, registerCodeId, unregisterCodeId]);\n\n\t\tconst languageClassName = formatLanguageClassName(language);\n\n\t\treturn (\n\t\t\t<pre\n\t\t\t\taria-expanded={hasCodeExpander ? isCodeExpanded : undefined}\n\t\t\t\tclassName={cx(\n\t\t\t\t\t\"scrollbar overflow-x-auto overflow-y-hidden p-4 pr-14\",\n\t\t\t\t\t\"text-mono m-0 font-mono\",\n\t\t\t\t\t\"aria-collapsed:max-h-[13.6rem]\",\n\t\t\t\t\tlanguageClassName, // place it last because prism does weird stuff client side, causes hydration mismatches\n\t\t\t\t\tclassName,\n\t\t\t\t)}\n\t\t\t\tdata-lang={language}\n\t\t\t\tid={id}\n\t\t\t\tref={ref}\n\t\t\t\tstyle={{\n\t\t\t\t\t...style,\n\t\t\t\t\ttabSize: 2,\n\t\t\t\t\tMozTabSize: 2,\n\t\t\t\t}}\n\t\t\t\t// prism.js adds a tabindex of 0 to the pre element by default (unless it's set)\n\t\t\t\t// this is unnecessary, we do not want this automatic behavior!\n\t\t\t\ttabIndex={tabIndex ?? -1}\n\t\t\t\t{...props}\n\t\t\t>\n\t\t\t\t<code\n\t\t\t\t\tclassName={clsx(\"text-size-inherit\", languageClassName)}\n\t\t\t\t\tdangerouslySetInnerHTML={{\n\t\t\t\t\t\t__html: highlightedCodeInnerHtml,\n\t\t\t\t\t}}\n\t\t\t\t\t// we need to suppress the hydration warning because we are setting the innerHTML of the code block\n\t\t\t\t\t// and using Prism.js to \"highlight\" the code in a useEffect (client-side only), which does different things on the client and server\n\t\t\t\t\tsuppressHydrationWarning\n\t\t\t\t/>\n\t\t\t</pre>\n\t\t);\n\t},\n);\nCode.displayName = \"CodeBlockCode\";\n\n/**\n * The (optional) header slot of the `CodeBlock`. This is where things like the\n * `CodeBlock.Icon` and `CodeBlock.Title` are rendered.\n *\n * @see https://mantle.ngrok.com/components/code-block#codeblockheader\n *\n * @example\n * ```tsx\n * <CodeBlock.Root>\n * <CodeBlock.Header>\n * <CodeBlock.Icon preset=\"file\" />\n * <CodeBlock.Title>…</CodeBlock.Title>\n * </CodeBlock.Header>\n * <CodeBlock.Body>\n * <CodeBlock.CopyButton />\n * <CodeBlock.Code language=\"…\" value={fmtCode\\`…\\`} />\n * </CodeBlock.Body>\n * <CodeBlock.ExpanderButton />\n * </CodeBlock.Root>\n * ```\n */\nconst Header = forwardRef<ComponentRef<\"div\">, ComponentProps<\"div\"> & WithAsChild>(\n\t({ asChild = false, className, ...props }, ref) => {\n\t\tconst Component = asChild ? Slot : \"div\";\n\n\t\treturn (\n\t\t\t<Component\n\t\t\t\tclassName={cx(\n\t\t\t\t\t\"flex items-center gap-1 border-b border-gray-300 bg-gray-100 px-4 py-2 text-gray-700\",\n\t\t\t\t\tclassName,\n\t\t\t\t)}\n\t\t\t\tref={ref}\n\t\t\t\t{...props}\n\t\t\t/>\n\t\t);\n\t},\n);\nHeader.displayName = \"CodeBlockHeader\";\n\n/**\n * The (optional) title of the `CodeBlock`. Default renders as an h3 element,\n * use asChild to render something else.\n *\n * @see https://mantle.ngrok.com/components/code-block#codeblocktitle\n *\n * @example\n * ```tsx\n * <CodeBlock.Root>\n * <CodeBlock.Header>\n * <CodeBlock.Icon preset=\"file\" />\n * <CodeBlock.Title>…</CodeBlock.Title>\n * </CodeBlock.Header>\n * <CodeBlock.Body>\n * <CodeBlock.CopyButton />\n * <CodeBlock.Code language=\"…\" value={fmtCode\\`…\\`} />\n * </CodeBlock.Body>\n * <CodeBlock.ExpanderButton />\n * </CodeBlock.Root>\n * ```\n */\nconst Title = forwardRef<\n\tHTMLHeadingElement,\n\tHTMLAttributes<HTMLHeadingElement> & { asChild?: boolean }\n>(({ asChild = false, className, ...props }, ref) => {\n\tconst Component = asChild ? Slot : \"h3\";\n\n\treturn (\n\t\t<Component\n\t\t\tref={ref}\n\t\t\tclassName={cx(\"text-mono m-0 font-mono font-normal\", className)}\n\t\t\t{...props}\n\t\t/>\n\t);\n});\nTitle.displayName = \"CodeBlockTitle\";\n\ntype CodeBlockCopyButtonProps = Omit<ComponentProps<\"button\">, \"children\" | \"type\"> &\n\tWithAsChild & {\n\t\t/**\n\t\t * Callback fired when the copy button is clicked, passes the copied text as an argument.\n\t\t */\n\t\tonCopy?: (value: string) => void;\n\t\t/**\n\t\t * Callback fired when an error occurs during copying.\n\t\t */\n\t\tonCopyError?: (error: unknown) => void;\n\t};\n\n/**\n * The (optional) copy button of the `CodeBlock`. Render this as a child of the\n * `CodeBlock.Body` to allow users to copy the code block contents to their\n * clipboard.\n *\n * @see https://mantle.ngrok.com/components/code-block#codeblockcopybutton\n *\n * @example\n * ```tsx\n * <CodeBlock.Root>\n * <CodeBlock.Header>\n * <CodeBlock.Icon preset=\"file\" />\n * <CodeBlock.Title>…</CodeBlock.Title>\n * </CodeBlock.Header>\n * <CodeBlock.Body>\n * <CodeBlock.CopyButton />\n * <CodeBlock.Code language=\"…\" value={fmtCode\\`…\\`} />\n * </CodeBlock.Body>\n * <CodeBlock.ExpanderButton />\n * </CodeBlock.Root>\n * ```\n */\nconst CopyButton = forwardRef<ComponentRef<\"button\">, CodeBlockCopyButtonProps>(\n\t({ asChild = false, className, onCopy, onCopyError, onClick, ...props }, ref) => {\n\t\tconst { copyText } = useContext(CodeBlockContext);\n\t\tconst [, copyToClipboard] = useCopyToClipboard();\n\t\tconst [wasCopied, setWasCopied] = useState(false);\n\t\tconst timeoutHandle = useRef<ReturnType<typeof setTimeout> | undefined>(undefined);\n\n\t\tuseEffect(() => {\n\t\t\treturn () => {\n\t\t\t\tif (timeoutHandle.current != null) {\n\t\t\t\t\tclearTimeout(timeoutHandle.current);\n\t\t\t\t}\n\t\t\t};\n\t\t}, []);\n\n\t\tconst Component = asChild ? Slot : \"button\";\n\n\t\treturn (\n\t\t\t<Component\n\t\t\t\ttype=\"button\"\n\t\t\t\tclassName={cx(\n\t\t\t\t\t\"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\",\n\t\t\t\t\twasCopied &&\n\t\t\t\t\t\t\"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\",\n\t\t\t\t\tclassName,\n\t\t\t\t)}\n\t\t\t\tref={ref}\n\t\t\t\tonClick={async (event) => {\n\t\t\t\t\ttry {\n\t\t\t\t\t\tonClick?.(event);\n\t\t\t\t\t\tif (event.defaultPrevented) {\n\t\t\t\t\t\t\t// Clear any existing timeout\n\t\t\t\t\t\t\tif (timeoutHandle.current != null) {\n\t\t\t\t\t\t\t\tclearTimeout(timeoutHandle.current);\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\tawait copyToClipboard(copyText);\n\t\t\t\t\t\tonCopy?.(copyText);\n\t\t\t\t\t\tsetWasCopied(true);\n\n\t\t\t\t\t\t// Clear any existing timeout\n\t\t\t\t\t\tif (timeoutHandle.current != null) {\n\t\t\t\t\t\t\tclearTimeout(timeoutHandle.current);\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\t// Reset the copied state after a short delay\n\t\t\t\t\t\ttimeoutHandle.current = setTimeout(() => {\n\t\t\t\t\t\t\tsetWasCopied(false);\n\t\t\t\t\t\t}, 2000);\n\t\t\t\t\t} catch (error) {\n\t\t\t\t\t\tonCopyError?.(error);\n\t\t\t\t\t}\n\t\t\t\t}}\n\t\t\t\t{...props}\n\t\t\t>\n\t\t\t\t<span className=\"sr-only\">Copy code</span>\n\t\t\t\t{wasCopied ? (\n\t\t\t\t\t<>\n\t\t\t\t\t\tCopied\n\t\t\t\t\t\t<MantleIcon svg={<CheckIcon weight=\"bold\" />} className=\"size-4\" />\n\t\t\t\t\t</>\n\t\t\t\t) : (\n\t\t\t\t\t<MantleIcon svg={<CopyIcon />} className=\"-ml-px\" />\n\t\t\t\t)}\n\t\t\t</Component>\n\t\t);\n\t},\n);\nCopyButton.displayName = \"CodeBlockCopyButton\";\n\ntype CodeBlockExpanderButtonProps = Omit<\n\tComponentProps<\"button\">,\n\t\"children\" | \"aria-controls\" | \"aria-expanded\"\n> &\n\tWithAsChild;\n\n/**\n * The (optional) expander button of the `CodeBlock`. Render this as a child of the\n * `CodeBlock.Body` to allow users to expand/collapse the code block contents.\n *\n * @note If this component is preset, the `CodeBlock` will automatically know\n * that it should be collapsible. Don't use this component if you don't want\n * the code block to be collapsible.\n *\n * @see https://mantle.ngrok.com/components/code-block#codeblockexpanderbutton\n *\n * @example\n * ```tsx\n * <CodeBlock.Root>\n * <CodeBlock.Header>\n * <CodeBlock.Icon preset=\"file\" />\n * <CodeBlock.Title>…</CodeBlock.Title>\n * </CodeBlock.Header>\n * <CodeBlock.Body>\n * <CodeBlock.CopyButton />\n * <CodeBlock.Code language=\"…\" value={fmtCode\\`…\\`} />\n * </CodeBlock.Body>\n * <CodeBlock.ExpanderButton />\n * </CodeBlock.Root>\n * ```\n */\nconst ExpanderButton = forwardRef<ComponentRef<\"button\">, CodeBlockExpanderButtonProps>(\n\t({ asChild = false, className, onClick, ...props }, ref) => {\n\t\tconst { codeId, isCodeExpanded, setIsCodeExpanded, setHasCodeExpander } =\n\t\t\tuseContext(CodeBlockContext);\n\n\t\tuseEffect(() => {\n\t\t\tsetHasCodeExpander(true);\n\n\t\t\treturn () => {\n\t\t\t\tsetHasCodeExpander(false);\n\t\t\t};\n\t\t}, [setHasCodeExpander]);\n\n\t\tconst Component = asChild ? Slot : \"button\";\n\n\t\treturn (\n\t\t\t<Component\n\t\t\t\t{...props}\n\t\t\t\taria-controls={codeId}\n\t\t\t\taria-expanded={isCodeExpanded}\n\t\t\t\tclassName={cx(\n\t\t\t\t\t\"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\",\n\t\t\t\t\tclassName,\n\t\t\t\t)}\n\t\t\t\tref={ref}\n\t\t\t\ttype=\"button\"\n\t\t\t\tonClick={(event) => {\n\t\t\t\t\tsetIsCodeExpanded((prev) => !prev);\n\t\t\t\t\tonClick?.(event);\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t{isCodeExpanded ? \"Show less\" : \"Show more\"}{\" \"}\n\t\t\t\t<MantleIcon\n\t\t\t\t\tsvg={<CaretDownIcon weight=\"bold\" />}\n\t\t\t\t\tclassName={cx(\"size-4\", isCodeExpanded && \"rotate-180\", \"transition-all duration-150\")}\n\t\t\t\t/>\n\t\t\t</Component>\n\t\t);\n\t},\n);\nExpanderButton.displayName = \"CodeBlockExpanderButton\";\n\ntype CodeBlockIconProps = Omit<SvgAttributes, \"children\"> &\n\t(\n\t\t| {\n\t\t\t\t/**\n\t\t\t\t * A custom icon to display in the code block header.\n\t\t\t\t * (Pass only one of `svg` or `preset`.)\n\t\t\t\t */\n\t\t\t\tsvg: ReactNode;\n\t\t\t\t/**\n\t\t\t\t * A preset icon to display in the code block header.\n\t\t\t\t * (Pass only one of `svg` or `preset`.)\n\t\t\t\t */\n\t\t\t\tpreset?: undefined | never;\n\t\t }\n\t\t| {\n\t\t\t\t/**\n\t\t\t\t * A custom icon to display in the code block header.\n\t\t\t\t * (Pass only one of `svg` or `preset`.)\n\t\t\t\t */\n\t\t\t\tsvg?: undefined | never;\n\t\t\t\t/**\n\t\t\t\t * A preset icon to display in the code block header.\n\t\t\t\t * (Pass only one of `svg` or `preset`.)\n\t\t\t\t */\n\t\t\t\tpreset: Mode;\n\t\t }\n\t);\n\n/**\n * A small icon that represents the type of code block being displayed,\n * rendered as an SVG next to the code block title in the code block header.\n *\n * You can pass in a custom SVG component or use one of the presets\n * (pass only one of `svg` or `preset`).\n *\n * @see https://mantle.ngrok.com/components/code-block#codeblockicon\n *\n * @example\n * ```tsx\n * <CodeBlock.Root>\n * <CodeBlock.Header>\n * <CodeBlock.Icon preset=\"file\" />\n * <CodeBlock.Title>…</CodeBlock.Title>\n * </CodeBlock.Header>\n * <CodeBlock.Body>\n * <CodeBlock.CopyButton />\n * <CodeBlock.Code language=\"…\" value={fmtCode\\`…\\`} />\n * </CodeBlock.Body>\n * <CodeBlock.ExpanderButton />\n * </CodeBlock.Root>\n * ```\n */\nfunction CodeBlockIconComponent({\n\tclassName,\n\tpreset,\n\tsvg: _svgProp,\n\t...props\n}: CodeBlockIconProps) {\n\tlet svg = _svgProp;\n\tif (preset != null) {\n\t\tswitch (preset) {\n\t\t\tcase \"file\":\n\t\t\t\tsvg = <FileTextIcon weight=\"fill\" />;\n\t\t\t\tbreak;\n\t\t\tcase \"cli\":\n\t\t\t\tsvg = <TerminalIcon weight=\"fill\" />;\n\t\t\t\tbreak;\n\t\t\tcase \"traffic-policy\":\n\t\t\t\tsvg = <TrafficPolicyFileIcon />;\n\t\t\t\tbreak;\n\t\t}\n\t}\n\n\treturn <MantleIcon className={className} svg={svg} {...props} />;\n}\nCodeBlockIconComponent.displayName = \"CodeBlockIcon\";\n\n/**\n * Code blocks render and apply syntax highlighting to blocks of code.\n *\n * @see https://mantle.ngrok.com/components/code-block\n *\n * @example\n * ```tsx\n * <CodeBlock.Root>\n * <CodeBlock.Header>\n * <CodeBlock.Icon preset=\"file\" />\n * <CodeBlock.Title>…</CodeBlock.Title>\n * </CodeBlock.Header>\n * <CodeBlock.Body>\n * <CodeBlock.CopyButton />\n * <CodeBlock.Code language=\"…\" value={fmtCode\\`…\\`} />\n * </CodeBlock.Body>\n * <CodeBlock.ExpanderButton />\n * </CodeBlock.Root>\n * ```\n */\nconst CodeBlock = {\n\t/**\n\t * Code blocks render and apply syntax highlighting to blocks of code.\n\t * This is the root component for all code block components.\n\t *\n\t * @see https://mantle.ngrok.com/components/code-block#codeblockroot\n\t *\n\t * @example\n\t * ```tsx\n\t * <CodeBlock.Root>\n\t * <CodeBlock.Header>\n\t * <CodeBlock.Icon preset=\"file\" />\n\t * <CodeBlock.Title>…</CodeBlock.Title>\n\t * </CodeBlock.Header>\n\t * <CodeBlock.Body>\n\t * <CodeBlock.CopyButton />\n\t * <CodeBlock.Code language=\"…\" value={fmtCode\\`…\\`} />\n\t * </CodeBlock.Body>\n\t * <CodeBlock.ExpanderButton />\n\t * </CodeBlock.Root>\n\t * ```\n\t */\n\tRoot,\n\t/**\n\t * The body of the `CodeBlock`. This is where the `CodeBlock.Code` and optional\n\t * `CodeBlock.CopyButton` is rendered.\n\t *\n\t * @see https://mantle.ngrok.com/components/code-block#codeblockbody\n\t *\n\t * @example\n\t * ```tsx\n\t * <CodeBlock.Root>\n\t * <CodeBlock.Body>\n\t * <CodeBlock.CopyButton />\n\t * <CodeBlock.Code language=\"…\" value={fmtCode\\`…\\`} />\n\t * </CodeBlock.Body>\n\t * </CodeBlock.Root>\n\t * ```\n\t */\n\tBody,\n\t/**\n\t * The `CodeBlock` content. This is where the code is rendered and syntax highlighted.\n\t *\n\t * @see https://mantle.ngrok.com/components/code-block#codeblockcode\n\t *\n\t * @example\n\t * ```tsx\n\t * <CodeBlock.Root>\n\t * <CodeBlock.Body>\n\t * <CodeBlock.Code\n\t * language=\"sh\"\n\t * value={fmtCode`ffmpeg -i multichannel.mxf -map 0:v:0 -map 0:a:0`}\n\t * />\n\t * </CodeBlock.Body>\n\t * </CodeBlock.Root>\n\t * ```\n\t */\n\tCode,\n\t/**\n\t * The (optional) copy button of the `CodeBlock`. Render this as a child of the\n\t * `CodeBlock.Body` to allow users to copy the code block contents to their\n\t * clipboard.\n\t *\n\t * @see https://mantle.ngrok.com/components/code-block#codeblockcopybutton\n\t *\n\t * @example\n\t * ```tsx\n\t * <CodeBlock.Root>\n\t * <CodeBlock.Body>\n\t * <CodeBlock.CopyButton />\n\t * <CodeBlock.Code language=\"…\" value={fmtCode\\`…\\`} />\n\t * </CodeBlock.Body>\n\t * </CodeBlock.Root>\n\t * ```\n\t */\n\tCopyButton,\n\t/**\n\t * The (optional) expander button of the `CodeBlock`. Render this as a child of the\n\t * `CodeBlock.Body` to allow users to expand/collapse the code block contents.\n\t *\n\t * @see https://mantle.ngrok.com/components/code-block#codeblockexpanderbutton\n\t *\n\t * @example\n\t * ```tsx\n\t * <CodeBlock.Root>\n\t * <CodeBlock.Body>\n\t * <CodeBlock.Code language=\"…\" value={fmtCode\\`…\\`} />\n\t * </CodeBlock.Body>\n\t * <CodeBlock.ExpanderButton />\n\t * </CodeBlock.Root>\n\t * ```\n\t */\n\tExpanderButton,\n\t/**\n\t * The (optional) header slot of the `CodeBlock`. This is where things like the\n\t * `CodeBlock.Icon` and `CodeBlock.Title` are rendered.\n\t *\n\t * @see https://mantle.ngrok.com/components/code-block#codeblockheader\n\t *\n\t * @example\n\t * ```tsx\n\t * <CodeBlock.Root>\n\t * <CodeBlock.Header>\n\t * <CodeBlock.Icon preset=\"file\" />\n\t * <CodeBlock.Title>…</CodeBlock.Title>\n\t * </CodeBlock.Header>\n\t * <CodeBlock.Body>\n\t * <CodeBlock.Code language=\"…\" value={fmtCode\\`…\\`} />\n\t * </CodeBlock.Body>\n\t * </CodeBlock.Root>\n\t * ```\n\t */\n\tHeader,\n\t/**\n\t * A small icon that represents the type of code block being displayed,\n\t * rendered as an SVG next to the code block title in the code block header.\n\t *\n\t * You can pass in a custom SVG component or use one of the presets\n\t * (pass only one of `svg` or `preset`).\n\t *\n\t * @see https://mantle.ngrok.com/components/code-block#codeblockicon\n\t *\n\t * @example\n\t * ```tsx\n\t * <CodeBlock.Root>\n\t * <CodeBlock.Header>\n\t * <CodeBlock.Icon preset=\"file\" />\n\t * <CodeBlock.Title>…</CodeBlock.Title>\n\t * </CodeBlock.Header>\n\t * </CodeBlock.Root>\n\t * ```\n\t */\n\tIcon: CodeBlockIconComponent,\n\t/**\n\t * The (optional) title of the `CodeBlock`. Default renders as an h3 element,\n\t * use asChild to render something else.\n\t *\n\t * @see https://mantle.ngrok.com/components/code-block#codeblocktitle\n\t *\n\t * @example\n\t * ```tsx\n\t * <CodeBlock.Root>\n\t * <CodeBlock.Header>\n\t * <CodeBlock.Icon preset=\"file\" />\n\t * <CodeBlock.Title>example.js</CodeBlock.Title>\n\t * </CodeBlock.Header>\n\t * </CodeBlock.Root>\n\t * ```\n\t */\n\tTitle,\n} as const;\n\nexport {\n\t//,\n\tCodeBlock,\n};\n","/**\n * Escapes special HTML characters in a string to their corresponding\n * HTML entities, preventing issues like unintended HTML rendering or\n * cross-site scripting (XSS) when injecting raw strings into the DOM\n * using `dangerouslySetInnerHTML`.\n *\n * Characters escaped:\n * - \\& => `&`;\n * - \\< => `<`;\n * - \\> => `>`;\n * - \\\" => `"`;\n * - \\' => `'`;\n *\n * @param {string} value The raw string to be escaped.\n *\n * @example\n * escapeHtml('<div>Hello & \"world\"</div>');\n * // Returns: '<div>Hello & "world"</div>'\n */\nfunction escapeHtml(value: string): string {\n\tlet escaped = \"\";\n\tfor (const character of value) {\n\t\tswitch (character) {\n\t\t\tcase \"&\":\n\t\t\t\tescaped += \"&\";\n\t\t\t\tbreak;\n\t\t\tcase \"<\":\n\t\t\t\tescaped += \"<\";\n\t\t\t\tbreak;\n\t\t\tcase \">\":\n\t\t\t\tescaped += \">\";\n\t\t\t\tbreak;\n\t\t\tcase '\"':\n\t\t\t\tescaped += \""\";\n\t\t\t\tbreak;\n\t\t\tcase \"'\":\n\t\t\t\tescaped += \"'\";\n\t\t\t\tbreak;\n\t\t\tdefault:\n\t\t\t\tescaped += character;\n\t\t}\n\t}\n\treturn escaped;\n}\n\nexport {\n\t//,\n\tescapeHtml,\n};\n","import Prism from \"prismjs\";\nimport \"prismjs/components/prism-bash.js\";\nimport \"prismjs/components/prism-csharp.js\";\nimport \"prismjs/components/prism-css.js\";\nimport \"prismjs/components/prism-go.js\";\nimport \"prismjs/components/prism-java.js\";\nimport \"prismjs/components/prism-javascript.js\";\nimport \"prismjs/components/prism-json.js\";\nimport \"prismjs/components/prism-jsx.js\";\nimport \"prismjs/components/prism-markup.js\";\nimport \"prismjs/components/prism-python.js\";\nimport \"prismjs/components/prism-ruby.js\";\nimport \"prismjs/components/prism-rust.js\";\nimport \"prismjs/components/prism-tsx.js\";\nimport \"prismjs/components/prism-typescript.js\";\nimport \"prismjs/components/prism-yaml.js\";\n\nexport {\n\t//,\n\tPrism as Highlighter,\n};\n","import type { SupportedLanguage } from \"./supported-languages.js\";\n\nconst indentations = [\"tabs\", \"spaces\"] as const;\ntype Indentation = (typeof indentations)[number];\n\n/**\n * Type Predicate: checks if the given value is a valid indentation type.\n */\nfunction isIndentation(input: unknown): input is Indentation {\n\treturn indentations.includes(input as Indentation);\n}\n\n/**\n * Infers the indentation type based on the language and preferred indentation.\n *\n * @param language - The language to check.\n * @param preferredIndentation - The preferred indentation type (overrides what is detected).\n */\nfunction inferIndentation(\n\tlanguage: SupportedLanguage,\n\tpreferredIndentation: Indentation | undefined,\n) {\n\t// if the user has a preferred indentation, use that regardless of the language\n\tif (preferredIndentation) {\n\t\treturn preferredIndentation;\n\t}\n\n\tif (isTabIndentedLanguage(language)) {\n\t\treturn \"tabs\";\n\t}\n\n\tif (isSpaceIndentedLanguage(language)) {\n\t\treturn \"spaces\";\n\t}\n\n\treturn \"spaces\";\n}\n\nexport {\n\t//,\n\tindentations,\n\tinferIndentation,\n\tisIndentation,\n};\n\nexport type {\n\t//,\n\tIndentation,\n};\n\n/**\n * Languages that require or strongly prefer tabs\n */\nconst tabIndentedLanguages = [\n\t\"csharp\",\n\t\"css\",\n\t\"go\",\n\t\"html\",\n\t\"java\",\n\t\"javascript\",\n\t\"js\",\n\t\"jsx\",\n\t\"ts\",\n\t\"tsx\",\n\t\"typescript\",\n\t\"xml\",\n] as const satisfies SupportedLanguage[];\n\n/**\n * Languages that require or strongly prefer spaces\n */\nconst spaceIndentedLanguages = [\n\t\"python\",\n\t\"py\",\n\t\"yaml\",\n\t\"yml\",\n\t\"ruby\",\n\t\"rb\",\n] as const satisfies SupportedLanguage[];\n\ntype TabIndentedLanguage = (typeof tabIndentedLanguages)[number];\ntype SpaceIndentedLanguage = (typeof spaceIndentedLanguages)[number];\n\n/**\n * Type Predicate: checks if the given value is a required/preferred tab-indented language.\n */\nfunction isTabIndentedLanguage(value: SupportedLanguage): value is TabIndentedLanguage {\n\treturn tabIndentedLanguages.includes(value as TabIndentedLanguage);\n}\n\n/**\n * Type Predicate: checks if the given value is a required/preferred space-indented language.\n */\nfunction isSpaceIndentedLanguage(value: SupportedLanguage): value is SpaceIndentedLanguage {\n\treturn spaceIndentedLanguages.includes(value as SpaceIndentedLanguage);\n}\n","import type { Indentation } from \"./indentation.js\";\n\ntype Options = {\n\t/**\n\t * The indentation type to use. Can be either \"tabs\" or \"spaces\".\n\t * @default \"spaces\"\n\t */\n\tindentation?: Indentation;\n};\n\n/**\n * Trim any leading and trailing whitespace/empty lines, convert leading\n * indentation to the given options.indentation\n */\nfunction normalizeIndentation(value: string, options?: Options): string {\n\tconst { indentation = \"spaces\" } = options || {};\n\n\treturn value.trim().replace(/^[ \\t]*(?=\\S)/gm, (match) => {\n\t\t// 1 tab === 2 spaces\n\t\t// convert tabs to spaces and spaces to tabs\n\t\tif (indentation === \"spaces\") {\n\t\t\treturn match.replace(/\\t/g, \" \");\n\t\t}\n\t\treturn match.replace(/ {2}/g, \"\\t\");\n\t});\n}\n\nexport {\n\t//,\n\tnormalizeIndentation,\n};\n","/**\n * List of supported languages for syntax highlighting.\n * @private\n */\nexport const supportedLanguages = [\n\t\"bash\",\n\t\"cs\",\n\t\"csharp\",\n\t\"css\",\n\t\"dotnet\",\n\t\"go\",\n\t\"html\",\n\t\"java\",\n\t\"javascript\",\n\t\"js\",\n\t\"json\",\n\t\"jsx\",\n\t\"markup\",\n\t\"plain\",\n\t\"plaintext\",\n\t\"py\",\n\t\"python\",\n\t\"rb\",\n\t\"ruby\",\n\t\"rust\",\n\t\"sh\",\n\t\"shell\",\n\t\"text\",\n\t\"ts\",\n\t\"tsx\",\n\t\"txt\",\n\t\"typescript\",\n\t\"xml\",\n\t\"yaml\",\n\t\"yml\",\n] as const;\n\n/**\n * Supported languages for syntax highlighting.\n */\ntype SupportedLanguage = (typeof supportedLanguages)[number];\n\n/**\n * Parses a markdown code block (```) language class into a SupportedLanguage.\n * Defaults to \"sh\" if no supported language is found.\n */\nfunction parseLanguage(\n\tvalue: `language-${string}` | `lang-${string}` | (string & {}) | undefined,\n): SupportedLanguage {\n\tif (!value) {\n\t\treturn \"sh\";\n\t}\n\n\t// remove leading \"language-\" and \"lang-\" prefixes\n\t// find first '-' and slice from there\n\tconst maybeLanguage = value.trim().slice(value.indexOf(\"-\") + 1);\n\n\treturn isSupportedLanguage(maybeLanguage) ? maybeLanguage : \"sh\";\n}\n\n/**\n * Type Predicate: checks if an arbitrary value is a supported syntax highlighting language.\n */\nconst isSupportedLanguage = (value: unknown): value is SupportedLanguage => {\n\treturn typeof value === \"string\" && supportedLanguages.includes(value as SupportedLanguage);\n};\n\n/**\n * A class name for a language that Prism.js can understand.\n */\ntype LanguageClass = `language-${SupportedLanguage}`;\n\n/**\n * Formats a language name into a class name that Prism.js can understand.\n * @default \"language-sh\"\n */\nfunction formatLanguageClassName(language: SupportedLanguage | undefined = \"sh\") {\n\tconst lang = language ?? \"sh\";\n\tconst className: LanguageClass = `language-${lang}`;\n\treturn className;\n}\n\nexport { isSupportedLanguage, parseLanguage, formatLanguageClassName };\nexport type { SupportedLanguage };\n","type Primitive = string | number | boolean | undefined | null;\n\n/**\n * Tagged template literal to format code blocks and normalize leading indentation\n */\nfunction fmtCode(strings: TemplateStringsArray, ...values: Primitive[]): string {\n\tif (!isTemplateStringsArray(strings) || !Array.isArray(values)) {\n\t\tthrow new Error(\n\t\t\t\"It looks like you tried to call `fmtCode` as a function. Make sure to use it as a tagged template.\\n\\tExample: fmtCode`SELECT * FROM users`, not fmtCode('SELECT * FROM users')\",\n\t\t);\n\t}\n\n\tconst text = String.raw({ raw: strings }, ...values);\n\n\t// fine the minimum indentation of the code block\n\tconst minIndent = findMinIndent(text);\n\tconst lines = text.trim().split(\"\\n\");\n\n\treturn lines\n\t\t.map((line) => {\n\t\t\t// remove nothing if the line doesn't start with indentation\n\t\t\tif (/^\\S+/.test(line)) {\n\t\t\t\treturn line;\n\t\t\t}\n\t\t\treturn line.slice(minIndent);\n\t\t})\n\t\t.join(\"\\n\");\n}\n\nexport {\n\t//,\n\tfmtCode,\n};\n\n/**\n * Find the shortest indentation of a multiline string\n */\nfunction findMinIndent(value: string): number {\n\tconst match = value.match(/^[ \\t]*(?=\\S)/gm);\n\n\tif (!match) {\n\t\treturn 0;\n\t}\n\n\treturn match.reduce((acc, curr) => Math.min(acc, curr.length), Number.POSITIVE_INFINITY);\n}\n\n/**\n * Type guard to check if a value is a `TemplateStringsArray`\n */\nfunction isTemplateStringsArray(strings: unknown): strings is TemplateStringsArray {\n\treturn Array.isArray(strings) && \"raw\" in strings && Array.isArray(strings.raw);\n}\n","import { parseBooleanish } from \"../../types/booleanish.js\";\nimport { type Indentation, isIndentation } from \"./indentation.js\";\n\nconst modes = [\n\t//,\n\t\"cli\",\n\t\"file\",\n\t\"traffic-policy\",\n] as const;\ntype Mode = (typeof modes)[number];\n\ntype MetaInput = {\n\tcollapsible?: boolean | undefined;\n\tdisableCopy?: boolean | undefined;\n\tindentation?: Indentation | undefined;\n\tmode?: Mode | undefined;\n\ttitle?: string | undefined;\n};\n\ntype Meta = {\n\tcollapsible: boolean;\n\tdisableCopy: boolean;\n\tindentation?: Indentation | undefined;\n\tmode?: Mode | undefined;\n\ttitle?: string | undefined;\n};\n\nconst defaultMeta = {\n\tcollapsible: false,\n\tdisableCopy: false,\n\tindentation: undefined,\n\tmode: undefined,\n\ttitle: undefined,\n} as const satisfies Meta;\n\ntype DefaultMeta = typeof defaultMeta;\n\n/**\n * Parses a markdown code block (```) metastring into a meta object.\n * Defaults to DefaultMeta if no metastring given or if metastring is invalid.\n * Useful for parsing the metastring from a markdown code block to pass into the\n * CodeBlock components as props.\n */\nfunction parseMetastring(input: string | undefined): Meta {\n\tconst metastring = input?.trim() ?? \"\";\n\tif (!metastring) {\n\t\treturn defaultMeta;\n\t}\n\n\tconst metaJson = tokenizeMetastring(metastring).reduce<Record<string, unknown>>((acc, token) => {\n\t\tconst [key, value] = token.split(\"=\");\n\t\tif (!key) {\n\t\t\treturn acc;\n\t\t}\n\t\tconst normalizedValue = normalizeValue(value);\n\t\tacc[key] = normalizedValue ?? true;\n\t\treturn acc;\n\t}, {});\n\n\ttry {\n\t\tconst parsed = parseMetaJson(metaJson);\n\n\t\t// return the parsed meta object, with default values filled in\n\t\treturn {\n\t\t\t...defaultMeta,\n\t\t\t...parsed,\n\t\t};\n\t\t// oxlint-disable-next-line no-unused-vars\n\t} catch (_) {\n\t\treturn defaultMeta;\n\t}\n}\n\nexport {\n\t//,\n\tdefaultMeta,\n\tparseMetastring,\n};\nexport type {\n\t//,\n\tMeta,\n\tMetaInput,\n\tMode,\n\tDefaultMeta,\n};\n\n/**\n * Remove leading and trailing `\"` quotes around value\n * @private\n *\n * @example\n * ```tsx\n * const normalized = normalizeValue('\"hello world\"');\n * // Returns: \"hello world\"\n *\n * const unchanged = normalizeValue('hello');\n * // Returns: \"hello\"\n * ```\n */\nexport function normalizeValue(value: string | undefined) {\n\treturn value?.trim().replace(/^\"(.*)\"$/, \"$1\");\n}\n\n/**\n * Splits a metastring into an array of tokens that can be parsed into a meta object.\n * Should allow for quotes and spaces in tokens\n * @private\n *\n * @example\n * ```tsx\n * const tokens = tokenizeMetastring('title=\"My File\" collapsible mode=cli');\n * // Returns: ['title=\"My File\"', 'collapsible', 'mode=cli']\n *\n * const simpleTokens = tokenizeMetastring('collapsible disableCopy');\n * // Returns: ['collapsible', 'disableCopy']\n * ```\n */\nexport function tokenizeMetastring(value: string | undefined): string[] {\n\tconst input = value?.trim() ?? \"\";\n\tconst result: string[] = [];\n\n\tlet currentString = \"\";\n\tlet inQuotes = false;\n\n\tfor (const char of input) {\n\t\tif (char === \" \" && !inQuotes) {\n\t\t\tif (currentString) {\n\t\t\t\tresult.push(currentString);\n\t\t\t\tcurrentString = \"\";\n\t\t\t}\n\t\t} else if (char === '\"') {\n\t\t\tinQuotes = !inQuotes;\n\t\t\tcurrentString += char;\n\t\t} else {\n\t\t\tcurrentString += char;\n\t\t}\n\t}\n\n\tif (currentString) {\n\t\tresult.push(currentString);\n\t}\n\n\treturn result;\n}\n\n/**\n * Type Predicate: checks if the given value is a valid mode.\n * @private\n */\nfunction isMode(input: unknown): input is Mode {\n\treturn modes.includes(input as Mode);\n}\n\n/**\n * Parses a meta JSON object into a Meta object.\n * @private\n */\nfunction parseMetaJson(input: Record<string, unknown>): Meta {\n\tconst {\n\t\tcollapsible = defaultMeta.collapsible,\n\t\tdisableCopy = defaultMeta.disableCopy,\n\t\tindentation = defaultMeta.indentation,\n\t\tmode = defaultMeta.mode,\n\t\ttitle = defaultMeta.title,\n\t} = input;\n\n\treturn {\n\t\tcollapsible:\n\t\t\ttypeof collapsible === \"string\" || typeof collapsible === \"boolean\"\n\t\t\t\t? parseBooleanish(collapsible)\n\t\t\t\t: defaultMeta.collapsible,\n\t\tdisableCopy:\n\t\t\ttypeof disableCopy === \"string\" || typeof disableCopy === \"boolean\"\n\t\t\t\t? parseBooleanish(disableCopy)\n\t\t\t\t: defaultMeta.disableCopy,\n\t\tindentation: isIndentation(indentation) ? indentation : defaultMeta.indentation,\n\t\tmode: isMode(mode) ? mode : defaultMeta.mode,\n\t\ttitle: typeof title === \"string\" ? title.trim() : defaultMeta.title,\n\t};\n}\n"],"mappings":"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","names":["CaretDownIcon","CheckIcon","CopyIcon","FileTextIcon","TerminalIcon","clsx","createContext","forwardRef","useContext","useEffect","useId","useMemo","useRef","useState","assert","escapeHtml","value","escaped","character","Prism","indentations","isIndentation","input","inferIndentation","language","preferredIndentation","isTabIndentedLanguage","isSpaceIndentedLanguage","tabIndentedLanguages","spaceIndentedLanguages","isTabIndentedLanguage","value","isSpaceIndentedLanguage","normalizeIndentation","value","options","indentation","match","supportedLanguages","parseLanguage","value","maybeLanguage","isSupportedLanguage","formatLanguageClassName","language","Fragment","jsx","jsxs","CodeBlockContext","createContext","Root","forwardRef","asChild","className","props","ref","copyText","setCopyText","useState","hasCodeExpander","setHasCodeExpander","isCodeExpanded","setIsCodeExpanded","codeId","setCodeId","context","useMemo","id","old","assert","Component","Slot","cx","Body","Code","_unusedHighlightLines","propIndentation","language","_unusedShowLineNumbers","style","tabIndex","value","useId","registerCodeId","unregisterCodeId","useContext","indentation","inferIndentation","normalizedAndTrimmedValue","normalizeIndentation","highlightedCodeInnerHtml","setHighlightedCodeInnerHtml","escapeHtml","useEffect","grammar","Prism","supportedLanguages","newHighlightedCodeInnerHtml","languageClassName","formatLanguageClassName","clsx","Header","Title","CopyButton","onCopy","onCopyError","onClick","copyToClipboard","useCopyToClipboard","wasCopied","setWasCopied","timeoutHandle","useRef","event","error","Icon","CheckIcon","CopyIcon","ExpanderButton","prev","CaretDownIcon","CodeBlockIconComponent","preset","_svgProp","svg","FileTextIcon","TerminalIcon","TrafficPolicyFileIcon","CodeBlock","fmtCode","strings","values","isTemplateStringsArray","text","minIndent","findMinIndent","line","findMinIndent","value","match","acc","curr","isTemplateStringsArray","strings","modes","defaultMeta","parseMetastring","input","metastring","metaJson","tokenizeMetastring","acc","token","key","value","normalizedValue","normalizeValue","parsed","parseMetaJson","normalizeValue","value","tokenizeMetastring","input","result","currentString","inQuotes","char","isMode","modes","parseMetaJson","collapsible","defaultMeta","disableCopy","indentation","mode","title","parseBooleanish","isIndentation"]}
|
|
1
|
+
{"version":3,"sources":["../src/components/code-block/code-block.tsx","../src/components/code-block/escape-html.ts","../src/components/code-block/highlighter.ts","../src/components/code-block/indentation.ts","../src/components/code-block/normalize.ts","../src/components/code-block/supported-languages.ts","../src/components/code-block/fmt-code.ts","../src/components/code-block/parse-metastring.ts"],"sourcesContent":["\"use client\";\n\nimport { CaretDownIcon } from \"@phosphor-icons/react/CaretDown\";\nimport { CheckIcon } from \"@phosphor-icons/react/Check\";\nimport { CopyIcon } from \"@phosphor-icons/react/Copy\";\nimport { FileTextIcon } from \"@phosphor-icons/react/FileText\";\nimport { TerminalIcon } from \"@phosphor-icons/react/Terminal\";\nimport clsx from \"clsx\";\nimport type {\n\tComponentProps,\n\tComponentRef,\n\tDispatch,\n\tHTMLAttributes,\n\tReactNode,\n\tSetStateAction,\n} from \"react\";\nimport {\n\tcreateContext,\n\tforwardRef,\n\tuseContext,\n\tuseEffect,\n\tuseId,\n\tuseMemo,\n\tuseRef,\n\tuseState,\n} from \"react\";\nimport assert from \"tiny-invariant\";\nimport { useCopyToClipboard } from \"../../hooks/use-copy-to-clipboard.js\";\nimport type { WithAsChild } from \"../../types/as-child.js\";\nimport { cx } from \"../../utils/cx/cx.js\";\nimport { Icon as MantleIcon } from \"../icon/icon.js\";\nimport type { SvgAttributes } from \"../icon/types.js\";\nimport { TrafficPolicyFileIcon } from \"../icons/traffic-policy-file.js\";\nimport { Slot } from \"../slot/index.js\";\nimport { escapeHtml } from \"./escape-html.js\";\nimport { Highlighter } from \"./highlighter.js\";\nimport { type Indentation, inferIndentation } from \"./indentation.js\";\nimport type { LineRange } from \"./line-numbers.js\";\nimport { normalizeIndentation } from \"./normalize.js\";\nimport type { Mode } from \"./parse-metastring.js\";\nimport type { SupportedLanguage } from \"./supported-languages.js\";\nimport { formatLanguageClassName, supportedLanguages } from \"./supported-languages.js\";\n\n/**\n * TODO(cody):\n * - fix line numbers, maybe try grid instead of :before and flex?\n * - fix line hightlighting\n * - fix line wrapping? horizontal scrolling has problems w/ line highlighting :(\n */\n\ntype CodeBlockContextType = {\n\tcodeId: string | undefined;\n\tcopyText: string;\n\thasCodeExpander: boolean;\n\tisCodeExpanded: boolean;\n\tregisterCodeId: (id: string) => void;\n\tsetCopyText: (newCopyText: string) => void;\n\tsetHasCodeExpander: (value: boolean) => void;\n\tsetIsCodeExpanded: Dispatch<SetStateAction<boolean>>;\n\tunregisterCodeId: (id: string) => void;\n};\n\nconst CodeBlockContext = createContext<CodeBlockContextType>({\n\tcodeId: undefined,\n\tcopyText: \"\",\n\thasCodeExpander: false,\n\tisCodeExpanded: false,\n\tregisterCodeId: () => {},\n\tsetCopyText: () => {},\n\tsetHasCodeExpander: () => {},\n\tsetIsCodeExpanded: () => {},\n\tunregisterCodeId: () => {},\n});\n\n/**\n * Code blocks render and apply syntax highlighting to blocks of code.\n * This is the root component for all code block components.\n *\n * @see https://mantle.ngrok.com/components/code-block#codeblockroot\n *\n * @example\n * ```tsx\n * <CodeBlock.Root>\n * <CodeBlock.Header>\n * <CodeBlock.Icon preset=\"file\" />\n * <CodeBlock.Title>…</CodeBlock.Title>\n * </CodeBlock.Header>\n * <CodeBlock.Body>\n * <CodeBlock.CopyButton />\n * <CodeBlock.Code language=\"…\" value={fmtCode\\`…\\`} />\n * </CodeBlock.Body>\n * <CodeBlock.ExpanderButton />\n * </CodeBlock.Root>\n * ```\n */\nconst Root = forwardRef<ComponentRef<\"div\">, Omit<ComponentProps<\"div\">, \"align\"> & WithAsChild>(\n\t({ asChild = false, className, ...props }, ref) => {\n\t\tconst [copyText, setCopyText] = useState(\"\");\n\t\tconst [hasCodeExpander, setHasCodeExpander] = useState(false);\n\t\tconst [isCodeExpanded, setIsCodeExpanded] = useState(false);\n\t\tconst [codeId, setCodeId] = useState<string | undefined>(undefined);\n\n\t\tconst context: CodeBlockContextType = useMemo(\n\t\t\t() =>\n\t\t\t\t({\n\t\t\t\t\tcodeId,\n\t\t\t\t\tcopyText,\n\t\t\t\t\thasCodeExpander,\n\t\t\t\t\tisCodeExpanded,\n\t\t\t\t\tregisterCodeId: (id) => {\n\t\t\t\t\t\tsetCodeId((old) => {\n\t\t\t\t\t\t\tassert(old == null, \"You can only render a single CodeBlockCode within a CodeBlock.\");\n\t\t\t\t\t\t\treturn id;\n\t\t\t\t\t\t});\n\t\t\t\t\t},\n\t\t\t\t\tsetCopyText,\n\t\t\t\t\tsetHasCodeExpander,\n\t\t\t\t\tsetIsCodeExpanded,\n\t\t\t\t\tunregisterCodeId: (id) => {\n\t\t\t\t\t\tsetCodeId((old) => {\n\t\t\t\t\t\t\tassert(old === id, \"You can only render a single CodeBlockCode within a CodeBlock.\");\n\t\t\t\t\t\t\treturn undefined;\n\t\t\t\t\t\t});\n\t\t\t\t\t},\n\t\t\t\t}) as const,\n\t\t\t[codeId, copyText, hasCodeExpander, isCodeExpanded],\n\t\t);\n\n\t\tconst Component = asChild ? Slot : \"div\";\n\n\t\treturn (\n\t\t\t<CodeBlockContext.Provider value={context}>\n\t\t\t\t<Component\n\t\t\t\t\tdata-slot=\"code-block\"\n\t\t\t\t\tclassName={cx(\n\t\t\t\t\t\t\"text-mono overflow-hidden rounded-md border border-gray-300 bg-gray-50 font-mono\",\n\t\t\t\t\t\t\"[&_svg]:shrink-0\",\n\t\t\t\t\t\tclassName,\n\t\t\t\t\t)}\n\t\t\t\t\tref={ref}\n\t\t\t\t\t{...props}\n\t\t\t\t/>\n\t\t\t</CodeBlockContext.Provider>\n\t\t);\n\t},\n);\nRoot.displayName = \"CodeBlock\";\n\n/**\n * The body of the `CodeBlock`. This is where the `CodeBlock.Code` and optional\n * `CodeBlock.CopyButton` is rendered.\n *\n * @see https://mantle.ngrok.com/components/code-block#codeblockbody\n *\n * @example\n * ```tsx\n * <CodeBlock.Root>\n * <CodeBlock.Header>\n * <CodeBlock.Icon preset=\"file\" />\n * <CodeBlock.Title>…</CodeBlock.Title>\n * </CodeBlock.Header>\n * <CodeBlock.Body>\n * <CodeBlock.CopyButton />\n * <CodeBlock.Code language=\"…\" value={fmtCode\\`…\\`} />\n * </CodeBlock.Body>\n * <CodeBlock.ExpanderButton />\n * </CodeBlock.Root>\n * ```\n */\nconst Body = forwardRef<ComponentRef<\"div\">, ComponentProps<\"div\"> & WithAsChild>(\n\t({ asChild = false, className, ...props }, ref) => {\n\t\tconst Component = asChild ? Slot : \"div\";\n\n\t\treturn <Component className={cx(\"relative\", className)} ref={ref} {...props} />;\n\t},\n);\nBody.displayName = \"CodeBlockBody\";\n\ntype CodeBlockCodeProps = Omit<ComponentProps<\"pre\">, \"children\"> & {\n\t/**\n\t * The code to display in the code block. Should be code formatted as a string. This code will be passed to our syntax highlighter.\n\t */\n\tvalue: string;\n\t/**\n\t * @todo not implemented yet\n\t */\n\thighlightLines?: (LineRange | number)[];\n\t/**\n\t * The type of indentation to use. Can be either \"tabs\" or \"spaces\".\n\t * @default inferred from the given language, fallback to `spaces`\n\t */\n\tindentation?: Indentation;\n\t/**\n\t * The language of the code block. This will be used to determine how to syntax highlight the code.\n\t * @default `\"text\"`.\n\t */\n\tlanguage?: SupportedLanguage;\n\t/**\n\t * @todo not implemented yet\n\t */\n\tshowLineNumbers?: boolean;\n};\n\n/**\n * The `CodeBlock` content. This is where the code is rendered and syntax highlighted.\n *\n * @see https://mantle.ngrok.com/components/code-block#codeblockcode\n *\n * @example\n * ```tsx\n * <CodeBlock.Root>\n * <CodeBlock.Header>\n * <CodeBlock.Icon preset=\"file\" />\n * <CodeBlock.Title>…</CodeBlock.Title>\n * </CodeBlock.Header>\n * <CodeBlock.Body>\n * <CodeBlock.CopyButton />\n * <CodeBlock.Code\n * language=\"sh\"\n * value={fmtCode`ffmpeg -i multichannel.mxf -map 0:v:0 -map 0:a:0 -map 0:a:0 -c:a:0 ac3 -b:a:0 640k -ac:a:1 2 -c:a:1 aac -b:2 128k out.mp4`}\n * />\n * </CodeBlock.Body>\n * <CodeBlock.ExpanderButton />\n * </CodeBlock.Root>\n * ```\n */\nconst Code = forwardRef<ComponentRef<\"pre\">, CodeBlockCodeProps>(\n\t(\n\t\t{\n\t\t\tclassName,\n\t\t\thighlightLines: _unusedHighlightLines, // not implemented yet\n\t\t\tindentation: propIndentation,\n\t\t\tlanguage = \"text\",\n\t\t\tshowLineNumbers: _unusedShowLineNumbers, // not implemented yet\n\t\t\tstyle,\n\t\t\ttabIndex,\n\t\t\tvalue,\n\t\t\t...props\n\t\t},\n\t\tref,\n\t) => {\n\t\tconst id = useId();\n\t\tconst { hasCodeExpander, isCodeExpanded, registerCodeId, setCopyText, unregisterCodeId } =\n\t\t\tuseContext(CodeBlockContext);\n\t\tconst indentation = inferIndentation(language, propIndentation);\n\n\t\t// trim any leading and trailing whitespace/empty lines, convert leading tabs to spaces\n\t\tconst normalizedAndTrimmedValue = useMemo(\n\t\t\t() => normalizeIndentation(value, { indentation }),\n\t\t\t[value, indentation],\n\t\t);\n\t\tconst [highlightedCodeInnerHtml, setHighlightedCodeInnerHtml] = useState(\n\t\t\t// initialize the <code> inner html with escaped HTML since we are using\n\t\t\t// dangerouslySetInnerHTML to set the inner html of the <code> element\n\t\t\t// and use Prism.js to \"highlight\" the code in a useEffect (client-side only)\n\t\t\tescapeHtml(normalizeIndentation(value, { indentation })),\n\t\t);\n\n\t\tuseEffect(() => {\n\t\t\tconst grammar = Highlighter.languages[language];\n\t\t\tassert(\n\t\t\t\tgrammar,\n\t\t\t\t`CodeBlock does not support the language \"${language}\". The syntax highlighter does not have a grammar for this language. The supported languages are: ${supportedLanguages.join(\", \")}.`,\n\t\t\t);\n\t\t\tconst newHighlightedCodeInnerHtml = Highlighter.highlight(\n\t\t\t\tnormalizedAndTrimmedValue,\n\t\t\t\tgrammar,\n\t\t\t\tlanguage,\n\t\t\t);\n\t\t\tsetHighlightedCodeInnerHtml(newHighlightedCodeInnerHtml);\n\t\t}, [normalizedAndTrimmedValue, language]);\n\n\t\tuseEffect(() => {\n\t\t\tsetCopyText(normalizedAndTrimmedValue);\n\t\t}, [normalizedAndTrimmedValue, setCopyText]);\n\n\t\tuseEffect(() => {\n\t\t\tregisterCodeId(id);\n\n\t\t\treturn () => {\n\t\t\t\tunregisterCodeId(id);\n\t\t\t};\n\t\t}, [id, registerCodeId, unregisterCodeId]);\n\n\t\tconst languageClassName = formatLanguageClassName(language);\n\n\t\treturn (\n\t\t\t<pre\n\t\t\t\taria-expanded={hasCodeExpander ? isCodeExpanded : undefined}\n\t\t\t\tclassName={cx(\n\t\t\t\t\t\"scrollbar overflow-x-auto overflow-y-hidden p-4 pr-14\",\n\t\t\t\t\t\"text-mono m-0 font-mono\",\n\t\t\t\t\t\"aria-collapsed:max-h-[13.6rem]\",\n\t\t\t\t\tlanguageClassName, // place it last because prism does weird stuff client side, causes hydration mismatches\n\t\t\t\t\tclassName,\n\t\t\t\t)}\n\t\t\t\tdata-lang={language}\n\t\t\t\tid={id}\n\t\t\t\tref={ref}\n\t\t\t\tstyle={{\n\t\t\t\t\t...style,\n\t\t\t\t\ttabSize: 2,\n\t\t\t\t\tMozTabSize: 2,\n\t\t\t\t}}\n\t\t\t\t// prism.js adds a tabindex of 0 to the pre element by default (unless it's set)\n\t\t\t\t// this is unnecessary, we do not want this automatic behavior!\n\t\t\t\ttabIndex={tabIndex ?? -1}\n\t\t\t\t{...props}\n\t\t\t>\n\t\t\t\t<code\n\t\t\t\t\tclassName={clsx(\"text-size-inherit\", languageClassName)}\n\t\t\t\t\tdangerouslySetInnerHTML={{\n\t\t\t\t\t\t__html: highlightedCodeInnerHtml,\n\t\t\t\t\t}}\n\t\t\t\t\t// we need to suppress the hydration warning because we are setting the innerHTML of the code block\n\t\t\t\t\t// and using Prism.js to \"highlight\" the code in a useEffect (client-side only), which does different things on the client and server\n\t\t\t\t\tsuppressHydrationWarning\n\t\t\t\t/>\n\t\t\t</pre>\n\t\t);\n\t},\n);\nCode.displayName = \"CodeBlockCode\";\n\n/**\n * The (optional) header slot of the `CodeBlock`. This is where things like the\n * `CodeBlock.Icon` and `CodeBlock.Title` are rendered.\n *\n * @see https://mantle.ngrok.com/components/code-block#codeblockheader\n *\n * @example\n * ```tsx\n * <CodeBlock.Root>\n * <CodeBlock.Header>\n * <CodeBlock.Icon preset=\"file\" />\n * <CodeBlock.Title>…</CodeBlock.Title>\n * </CodeBlock.Header>\n * <CodeBlock.Body>\n * <CodeBlock.CopyButton />\n * <CodeBlock.Code language=\"…\" value={fmtCode\\`…\\`} />\n * </CodeBlock.Body>\n * <CodeBlock.ExpanderButton />\n * </CodeBlock.Root>\n * ```\n */\nconst Header = forwardRef<ComponentRef<\"div\">, ComponentProps<\"div\"> & WithAsChild>(\n\t({ asChild = false, className, ...props }, ref) => {\n\t\tconst Component = asChild ? Slot : \"div\";\n\n\t\treturn (\n\t\t\t<Component\n\t\t\t\tclassName={cx(\n\t\t\t\t\t\"flex items-center gap-1 border-b border-gray-300 bg-gray-100 px-4 py-2 text-gray-700\",\n\t\t\t\t\tclassName,\n\t\t\t\t)}\n\t\t\t\tref={ref}\n\t\t\t\t{...props}\n\t\t\t/>\n\t\t);\n\t},\n);\nHeader.displayName = \"CodeBlockHeader\";\n\n/**\n * The (optional) title of the `CodeBlock`. Default renders as an h3 element,\n * use asChild to render something else.\n *\n * @see https://mantle.ngrok.com/components/code-block#codeblocktitle\n *\n * @example\n * ```tsx\n * <CodeBlock.Root>\n * <CodeBlock.Header>\n * <CodeBlock.Icon preset=\"file\" />\n * <CodeBlock.Title>…</CodeBlock.Title>\n * </CodeBlock.Header>\n * <CodeBlock.Body>\n * <CodeBlock.CopyButton />\n * <CodeBlock.Code language=\"…\" value={fmtCode\\`…\\`} />\n * </CodeBlock.Body>\n * <CodeBlock.ExpanderButton />\n * </CodeBlock.Root>\n * ```\n */\nconst Title = forwardRef<\n\tHTMLHeadingElement,\n\tHTMLAttributes<HTMLHeadingElement> & { asChild?: boolean }\n>(({ asChild = false, className, ...props }, ref) => {\n\tconst Component = asChild ? Slot : \"h3\";\n\n\treturn (\n\t\t<Component\n\t\t\tref={ref}\n\t\t\tclassName={cx(\"text-mono m-0 font-mono font-normal\", className)}\n\t\t\t{...props}\n\t\t/>\n\t);\n});\nTitle.displayName = \"CodeBlockTitle\";\n\ntype CodeBlockCopyButtonProps = Omit<ComponentProps<\"button\">, \"children\" | \"type\"> &\n\tWithAsChild & {\n\t\t/**\n\t\t * Callback fired when the copy button is clicked, passes the copied text as an argument.\n\t\t */\n\t\tonCopy?: (value: string) => void;\n\t\t/**\n\t\t * Callback fired when an error occurs during copying.\n\t\t */\n\t\tonCopyError?: (error: unknown) => void;\n\t};\n\n/**\n * The (optional) copy button of the `CodeBlock`. Render this as a child of the\n * `CodeBlock.Body` to allow users to copy the code block contents to their\n * clipboard.\n *\n * @see https://mantle.ngrok.com/components/code-block#codeblockcopybutton\n *\n * @example\n * ```tsx\n * <CodeBlock.Root>\n * <CodeBlock.Header>\n * <CodeBlock.Icon preset=\"file\" />\n * <CodeBlock.Title>…</CodeBlock.Title>\n * </CodeBlock.Header>\n * <CodeBlock.Body>\n * <CodeBlock.CopyButton />\n * <CodeBlock.Code language=\"…\" value={fmtCode\\`…\\`} />\n * </CodeBlock.Body>\n * <CodeBlock.ExpanderButton />\n * </CodeBlock.Root>\n * ```\n */\nconst CopyButton = forwardRef<ComponentRef<\"button\">, CodeBlockCopyButtonProps>(\n\t({ asChild = false, className, onCopy, onCopyError, onClick, ...props }, ref) => {\n\t\tconst { copyText } = useContext(CodeBlockContext);\n\t\tconst [, copyToClipboard] = useCopyToClipboard();\n\t\tconst [wasCopied, setWasCopied] = useState(false);\n\t\tconst timeoutHandle = useRef<ReturnType<typeof setTimeout> | undefined>(undefined);\n\n\t\tuseEffect(() => {\n\t\t\treturn () => {\n\t\t\t\tif (timeoutHandle.current != null) {\n\t\t\t\t\tclearTimeout(timeoutHandle.current);\n\t\t\t\t}\n\t\t\t};\n\t\t}, []);\n\n\t\tconst Component = asChild ? Slot : \"button\";\n\n\t\treturn (\n\t\t\t<Component\n\t\t\t\ttype=\"button\"\n\t\t\t\tclassName={cx(\n\t\t\t\t\t\"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\",\n\t\t\t\t\twasCopied &&\n\t\t\t\t\t\t\"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\",\n\t\t\t\t\tclassName,\n\t\t\t\t)}\n\t\t\t\tref={ref}\n\t\t\t\tonClick={async (event) => {\n\t\t\t\t\ttry {\n\t\t\t\t\t\tonClick?.(event);\n\t\t\t\t\t\tif (event.defaultPrevented) {\n\t\t\t\t\t\t\t// Clear any existing timeout\n\t\t\t\t\t\t\tif (timeoutHandle.current != null) {\n\t\t\t\t\t\t\t\tclearTimeout(timeoutHandle.current);\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\tawait copyToClipboard(copyText);\n\t\t\t\t\t\tonCopy?.(copyText);\n\t\t\t\t\t\tsetWasCopied(true);\n\n\t\t\t\t\t\t// Clear any existing timeout\n\t\t\t\t\t\tif (timeoutHandle.current != null) {\n\t\t\t\t\t\t\tclearTimeout(timeoutHandle.current);\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\t// Reset the copied state after a short delay\n\t\t\t\t\t\ttimeoutHandle.current = setTimeout(() => {\n\t\t\t\t\t\t\tsetWasCopied(false);\n\t\t\t\t\t\t}, 2000);\n\t\t\t\t\t} catch (error) {\n\t\t\t\t\t\tonCopyError?.(error);\n\t\t\t\t\t}\n\t\t\t\t}}\n\t\t\t\t{...props}\n\t\t\t>\n\t\t\t\t<span className=\"sr-only\">Copy code</span>\n\t\t\t\t{wasCopied ? (\n\t\t\t\t\t<>\n\t\t\t\t\t\tCopied\n\t\t\t\t\t\t<MantleIcon svg={<CheckIcon weight=\"bold\" />} className=\"size-4\" />\n\t\t\t\t\t</>\n\t\t\t\t) : (\n\t\t\t\t\t<MantleIcon svg={<CopyIcon />} className=\"-ml-px\" />\n\t\t\t\t)}\n\t\t\t</Component>\n\t\t);\n\t},\n);\nCopyButton.displayName = \"CodeBlockCopyButton\";\n\ntype CodeBlockExpanderButtonProps = Omit<\n\tComponentProps<\"button\">,\n\t\"children\" | \"aria-controls\" | \"aria-expanded\"\n> &\n\tWithAsChild;\n\n/**\n * The (optional) expander button of the `CodeBlock`. Render this as a child of the\n * `CodeBlock.Body` to allow users to expand/collapse the code block contents.\n *\n * @note If this component is preset, the `CodeBlock` will automatically know\n * that it should be collapsible. Don't use this component if you don't want\n * the code block to be collapsible.\n *\n * @see https://mantle.ngrok.com/components/code-block#codeblockexpanderbutton\n *\n * @example\n * ```tsx\n * <CodeBlock.Root>\n * <CodeBlock.Header>\n * <CodeBlock.Icon preset=\"file\" />\n * <CodeBlock.Title>…</CodeBlock.Title>\n * </CodeBlock.Header>\n * <CodeBlock.Body>\n * <CodeBlock.CopyButton />\n * <CodeBlock.Code language=\"…\" value={fmtCode\\`…\\`} />\n * </CodeBlock.Body>\n * <CodeBlock.ExpanderButton />\n * </CodeBlock.Root>\n * ```\n */\nconst ExpanderButton = forwardRef<ComponentRef<\"button\">, CodeBlockExpanderButtonProps>(\n\t({ asChild = false, className, onClick, ...props }, ref) => {\n\t\tconst { codeId, isCodeExpanded, setIsCodeExpanded, setHasCodeExpander } =\n\t\t\tuseContext(CodeBlockContext);\n\n\t\tuseEffect(() => {\n\t\t\tsetHasCodeExpander(true);\n\n\t\t\treturn () => {\n\t\t\t\tsetHasCodeExpander(false);\n\t\t\t};\n\t\t}, [setHasCodeExpander]);\n\n\t\tconst Component = asChild ? Slot : \"button\";\n\n\t\treturn (\n\t\t\t<Component\n\t\t\t\t{...props}\n\t\t\t\taria-controls={codeId}\n\t\t\t\taria-expanded={isCodeExpanded}\n\t\t\t\tclassName={cx(\n\t\t\t\t\t\"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\",\n\t\t\t\t\tclassName,\n\t\t\t\t)}\n\t\t\t\tref={ref}\n\t\t\t\ttype=\"button\"\n\t\t\t\tonClick={(event) => {\n\t\t\t\t\tsetIsCodeExpanded((prev) => !prev);\n\t\t\t\t\tonClick?.(event);\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t{isCodeExpanded ? \"Show less\" : \"Show more\"}{\" \"}\n\t\t\t\t<MantleIcon\n\t\t\t\t\tsvg={<CaretDownIcon weight=\"bold\" />}\n\t\t\t\t\tclassName={cx(\"size-4\", isCodeExpanded && \"rotate-180\", \"transition-all duration-150\")}\n\t\t\t\t/>\n\t\t\t</Component>\n\t\t);\n\t},\n);\nExpanderButton.displayName = \"CodeBlockExpanderButton\";\n\ntype CodeBlockIconProps = Omit<SvgAttributes, \"children\"> &\n\t(\n\t\t| {\n\t\t\t\t/**\n\t\t\t\t * A custom icon to display in the code block header.\n\t\t\t\t * (Pass only one of `svg` or `preset`.)\n\t\t\t\t */\n\t\t\t\tsvg: ReactNode;\n\t\t\t\t/**\n\t\t\t\t * A preset icon to display in the code block header.\n\t\t\t\t * (Pass only one of `svg` or `preset`.)\n\t\t\t\t */\n\t\t\t\tpreset?: undefined | never;\n\t\t }\n\t\t| {\n\t\t\t\t/**\n\t\t\t\t * A custom icon to display in the code block header.\n\t\t\t\t * (Pass only one of `svg` or `preset`.)\n\t\t\t\t */\n\t\t\t\tsvg?: undefined | never;\n\t\t\t\t/**\n\t\t\t\t * A preset icon to display in the code block header.\n\t\t\t\t * (Pass only one of `svg` or `preset`.)\n\t\t\t\t */\n\t\t\t\tpreset: Mode;\n\t\t }\n\t);\n\n/**\n * A small icon that represents the type of code block being displayed,\n * rendered as an SVG next to the code block title in the code block header.\n *\n * You can pass in a custom SVG component or use one of the presets\n * (pass only one of `svg` or `preset`).\n *\n * @see https://mantle.ngrok.com/components/code-block#codeblockicon\n *\n * @example\n * ```tsx\n * <CodeBlock.Root>\n * <CodeBlock.Header>\n * <CodeBlock.Icon preset=\"file\" />\n * <CodeBlock.Title>…</CodeBlock.Title>\n * </CodeBlock.Header>\n * <CodeBlock.Body>\n * <CodeBlock.CopyButton />\n * <CodeBlock.Code language=\"…\" value={fmtCode\\`…\\`} />\n * </CodeBlock.Body>\n * <CodeBlock.ExpanderButton />\n * </CodeBlock.Root>\n * ```\n */\nfunction CodeBlockIconComponent({\n\tclassName,\n\tpreset,\n\tsvg: _svgProp,\n\t...props\n}: CodeBlockIconProps) {\n\tlet svg = _svgProp;\n\tif (preset != null) {\n\t\tswitch (preset) {\n\t\t\tcase \"file\":\n\t\t\t\tsvg = <FileTextIcon weight=\"fill\" />;\n\t\t\t\tbreak;\n\t\t\tcase \"cli\":\n\t\t\t\tsvg = <TerminalIcon weight=\"fill\" />;\n\t\t\t\tbreak;\n\t\t\tcase \"traffic-policy\":\n\t\t\t\tsvg = <TrafficPolicyFileIcon />;\n\t\t\t\tbreak;\n\t\t}\n\t}\n\n\treturn <MantleIcon className={className} svg={svg} {...props} />;\n}\nCodeBlockIconComponent.displayName = \"CodeBlockIcon\";\n\n/**\n * Code blocks render and apply syntax highlighting to blocks of code.\n *\n * @see https://mantle.ngrok.com/components/code-block\n *\n * @example\n * ```tsx\n * <CodeBlock.Root>\n * <CodeBlock.Header>\n * <CodeBlock.Icon preset=\"file\" />\n * <CodeBlock.Title>…</CodeBlock.Title>\n * </CodeBlock.Header>\n * <CodeBlock.Body>\n * <CodeBlock.CopyButton />\n * <CodeBlock.Code language=\"…\" value={fmtCode\\`…\\`} />\n * </CodeBlock.Body>\n * <CodeBlock.ExpanderButton />\n * </CodeBlock.Root>\n * ```\n */\nconst CodeBlock = {\n\t/**\n\t * Code blocks render and apply syntax highlighting to blocks of code.\n\t * This is the root component for all code block components.\n\t *\n\t * @see https://mantle.ngrok.com/components/code-block#codeblockroot\n\t *\n\t * @example\n\t * ```tsx\n\t * <CodeBlock.Root>\n\t * <CodeBlock.Header>\n\t * <CodeBlock.Icon preset=\"file\" />\n\t * <CodeBlock.Title>…</CodeBlock.Title>\n\t * </CodeBlock.Header>\n\t * <CodeBlock.Body>\n\t * <CodeBlock.CopyButton />\n\t * <CodeBlock.Code language=\"…\" value={fmtCode\\`…\\`} />\n\t * </CodeBlock.Body>\n\t * <CodeBlock.ExpanderButton />\n\t * </CodeBlock.Root>\n\t * ```\n\t */\n\tRoot,\n\t/**\n\t * The body of the `CodeBlock`. This is where the `CodeBlock.Code` and optional\n\t * `CodeBlock.CopyButton` is rendered.\n\t *\n\t * @see https://mantle.ngrok.com/components/code-block#codeblockbody\n\t *\n\t * @example\n\t * ```tsx\n\t * <CodeBlock.Root>\n\t * <CodeBlock.Body>\n\t * <CodeBlock.CopyButton />\n\t * <CodeBlock.Code language=\"…\" value={fmtCode\\`…\\`} />\n\t * </CodeBlock.Body>\n\t * </CodeBlock.Root>\n\t * ```\n\t */\n\tBody,\n\t/**\n\t * The `CodeBlock` content. This is where the code is rendered and syntax highlighted.\n\t *\n\t * @see https://mantle.ngrok.com/components/code-block#codeblockcode\n\t *\n\t * @example\n\t * ```tsx\n\t * <CodeBlock.Root>\n\t * <CodeBlock.Body>\n\t * <CodeBlock.Code\n\t * language=\"sh\"\n\t * value={fmtCode`ffmpeg -i multichannel.mxf -map 0:v:0 -map 0:a:0`}\n\t * />\n\t * </CodeBlock.Body>\n\t * </CodeBlock.Root>\n\t * ```\n\t */\n\tCode,\n\t/**\n\t * The (optional) copy button of the `CodeBlock`. Render this as a child of the\n\t * `CodeBlock.Body` to allow users to copy the code block contents to their\n\t * clipboard.\n\t *\n\t * @see https://mantle.ngrok.com/components/code-block#codeblockcopybutton\n\t *\n\t * @example\n\t * ```tsx\n\t * <CodeBlock.Root>\n\t * <CodeBlock.Body>\n\t * <CodeBlock.CopyButton />\n\t * <CodeBlock.Code language=\"…\" value={fmtCode\\`…\\`} />\n\t * </CodeBlock.Body>\n\t * </CodeBlock.Root>\n\t * ```\n\t */\n\tCopyButton,\n\t/**\n\t * The (optional) expander button of the `CodeBlock`. Render this as a child of the\n\t * `CodeBlock.Body` to allow users to expand/collapse the code block contents.\n\t *\n\t * @see https://mantle.ngrok.com/components/code-block#codeblockexpanderbutton\n\t *\n\t * @example\n\t * ```tsx\n\t * <CodeBlock.Root>\n\t * <CodeBlock.Body>\n\t * <CodeBlock.Code language=\"…\" value={fmtCode\\`…\\`} />\n\t * </CodeBlock.Body>\n\t * <CodeBlock.ExpanderButton />\n\t * </CodeBlock.Root>\n\t * ```\n\t */\n\tExpanderButton,\n\t/**\n\t * The (optional) header slot of the `CodeBlock`. This is where things like the\n\t * `CodeBlock.Icon` and `CodeBlock.Title` are rendered.\n\t *\n\t * @see https://mantle.ngrok.com/components/code-block#codeblockheader\n\t *\n\t * @example\n\t * ```tsx\n\t * <CodeBlock.Root>\n\t * <CodeBlock.Header>\n\t * <CodeBlock.Icon preset=\"file\" />\n\t * <CodeBlock.Title>…</CodeBlock.Title>\n\t * </CodeBlock.Header>\n\t * <CodeBlock.Body>\n\t * <CodeBlock.Code language=\"…\" value={fmtCode\\`…\\`} />\n\t * </CodeBlock.Body>\n\t * </CodeBlock.Root>\n\t * ```\n\t */\n\tHeader,\n\t/**\n\t * A small icon that represents the type of code block being displayed,\n\t * rendered as an SVG next to the code block title in the code block header.\n\t *\n\t * You can pass in a custom SVG component or use one of the presets\n\t * (pass only one of `svg` or `preset`).\n\t *\n\t * @see https://mantle.ngrok.com/components/code-block#codeblockicon\n\t *\n\t * @example\n\t * ```tsx\n\t * <CodeBlock.Root>\n\t * <CodeBlock.Header>\n\t * <CodeBlock.Icon preset=\"file\" />\n\t * <CodeBlock.Title>…</CodeBlock.Title>\n\t * </CodeBlock.Header>\n\t * </CodeBlock.Root>\n\t * ```\n\t */\n\tIcon: CodeBlockIconComponent,\n\t/**\n\t * The (optional) title of the `CodeBlock`. Default renders as an h3 element,\n\t * use asChild to render something else.\n\t *\n\t * @see https://mantle.ngrok.com/components/code-block#codeblocktitle\n\t *\n\t * @example\n\t * ```tsx\n\t * <CodeBlock.Root>\n\t * <CodeBlock.Header>\n\t * <CodeBlock.Icon preset=\"file\" />\n\t * <CodeBlock.Title>example.js</CodeBlock.Title>\n\t * </CodeBlock.Header>\n\t * </CodeBlock.Root>\n\t * ```\n\t */\n\tTitle,\n} as const;\n\nexport {\n\t//,\n\tCodeBlock,\n};\n","/**\n * Escapes special HTML characters in a string to their corresponding\n * HTML entities, preventing issues like unintended HTML rendering or\n * cross-site scripting (XSS) when injecting raw strings into the DOM\n * using `dangerouslySetInnerHTML`.\n *\n * Characters escaped:\n * - \\& => `&`;\n * - \\< => `<`;\n * - \\> => `>`;\n * - \\\" => `"`;\n * - \\' => `'`;\n *\n * @param {string} value The raw string to be escaped.\n *\n * @example\n * escapeHtml('<div>Hello & \"world\"</div>');\n * // Returns: '<div>Hello & "world"</div>'\n */\nfunction escapeHtml(value: string): string {\n\tlet escaped = \"\";\n\tfor (const character of value) {\n\t\tswitch (character) {\n\t\t\tcase \"&\":\n\t\t\t\tescaped += \"&\";\n\t\t\t\tbreak;\n\t\t\tcase \"<\":\n\t\t\t\tescaped += \"<\";\n\t\t\t\tbreak;\n\t\t\tcase \">\":\n\t\t\t\tescaped += \">\";\n\t\t\t\tbreak;\n\t\t\tcase '\"':\n\t\t\t\tescaped += \""\";\n\t\t\t\tbreak;\n\t\t\tcase \"'\":\n\t\t\t\tescaped += \"'\";\n\t\t\t\tbreak;\n\t\t\tdefault:\n\t\t\t\tescaped += character;\n\t\t}\n\t}\n\treturn escaped;\n}\n\nexport {\n\t//,\n\tescapeHtml,\n};\n","import Prism from \"prismjs\";\nimport \"prismjs/components/prism-bash.js\";\nimport \"prismjs/components/prism-csharp.js\";\nimport \"prismjs/components/prism-css.js\";\nimport \"prismjs/components/prism-go.js\";\nimport \"prismjs/components/prism-java.js\";\nimport \"prismjs/components/prism-javascript.js\";\nimport \"prismjs/components/prism-json.js\";\nimport \"prismjs/components/prism-jsx.js\";\nimport \"prismjs/components/prism-markup.js\";\nimport \"prismjs/components/prism-python.js\";\nimport \"prismjs/components/prism-ruby.js\";\nimport \"prismjs/components/prism-rust.js\";\nimport \"prismjs/components/prism-tsx.js\";\nimport \"prismjs/components/prism-typescript.js\";\nimport \"prismjs/components/prism-yaml.js\";\n\nexport {\n\t//,\n\tPrism as Highlighter,\n};\n","import type { SupportedLanguage } from \"./supported-languages.js\";\n\nconst indentations = [\"tabs\", \"spaces\"] as const;\ntype Indentation = (typeof indentations)[number];\n\n/**\n * Type Predicate: checks if the given value is a valid indentation type.\n */\nfunction isIndentation(input: unknown): input is Indentation {\n\treturn indentations.includes(input as Indentation);\n}\n\n/**\n * Infers the indentation type based on the language and preferred indentation.\n *\n * @param language - The language to check.\n * @param preferredIndentation - The preferred indentation type (overrides what is detected).\n */\nfunction inferIndentation(\n\tlanguage: SupportedLanguage,\n\tpreferredIndentation: Indentation | undefined,\n) {\n\t// if the user has a preferred indentation, use that regardless of the language\n\tif (preferredIndentation) {\n\t\treturn preferredIndentation;\n\t}\n\n\tif (isTabIndentedLanguage(language)) {\n\t\treturn \"tabs\";\n\t}\n\n\tif (isSpaceIndentedLanguage(language)) {\n\t\treturn \"spaces\";\n\t}\n\n\treturn \"spaces\";\n}\n\nexport {\n\t//,\n\tindentations,\n\tinferIndentation,\n\tisIndentation,\n};\n\nexport type {\n\t//,\n\tIndentation,\n};\n\n/**\n * Languages that require or strongly prefer tabs\n */\nconst tabIndentedLanguages = [\n\t\"csharp\",\n\t\"css\",\n\t\"go\",\n\t\"html\",\n\t\"java\",\n\t\"javascript\",\n\t\"js\",\n\t\"jsx\",\n\t\"ts\",\n\t\"tsx\",\n\t\"typescript\",\n\t\"xml\",\n] as const satisfies SupportedLanguage[];\n\n/**\n * Languages that require or strongly prefer spaces\n */\nconst spaceIndentedLanguages = [\n\t\"python\",\n\t\"py\",\n\t\"yaml\",\n\t\"yml\",\n\t\"ruby\",\n\t\"rb\",\n] as const satisfies SupportedLanguage[];\n\ntype TabIndentedLanguage = (typeof tabIndentedLanguages)[number];\ntype SpaceIndentedLanguage = (typeof spaceIndentedLanguages)[number];\n\n/**\n * Type Predicate: checks if the given value is a required/preferred tab-indented language.\n */\nfunction isTabIndentedLanguage(value: SupportedLanguage): value is TabIndentedLanguage {\n\treturn tabIndentedLanguages.includes(value as TabIndentedLanguage);\n}\n\n/**\n * Type Predicate: checks if the given value is a required/preferred space-indented language.\n */\nfunction isSpaceIndentedLanguage(value: SupportedLanguage): value is SpaceIndentedLanguage {\n\treturn spaceIndentedLanguages.includes(value as SpaceIndentedLanguage);\n}\n","import type { Indentation } from \"./indentation.js\";\n\ntype Options = {\n\t/**\n\t * The indentation type to use. Can be either \"tabs\" or \"spaces\".\n\t * @default \"spaces\"\n\t */\n\tindentation?: Indentation;\n};\n\n/**\n * Trim any leading and trailing whitespace/empty lines, convert leading\n * indentation to the given options.indentation\n */\nfunction normalizeIndentation(value: string, options?: Options): string {\n\tconst { indentation = \"spaces\" } = options || {};\n\n\treturn value.trim().replace(/^[ \\t]*(?=\\S)/gm, (match) => {\n\t\t// 1 tab === 2 spaces\n\t\t// convert tabs to spaces and spaces to tabs\n\t\tif (indentation === \"spaces\") {\n\t\t\treturn match.replace(/\\t/g, \" \");\n\t\t}\n\t\treturn match.replace(/ {2}/g, \"\\t\");\n\t});\n}\n\nexport {\n\t//,\n\tnormalizeIndentation,\n};\n","/**\n * List of supported languages for syntax highlighting.\n * @private\n */\nexport const supportedLanguages = [\n\t\"bash\",\n\t\"cs\",\n\t\"csharp\",\n\t\"css\",\n\t\"dotnet\",\n\t\"go\",\n\t\"html\",\n\t\"java\",\n\t\"javascript\",\n\t\"js\",\n\t\"json\",\n\t\"jsx\",\n\t\"markup\",\n\t\"plain\",\n\t\"plaintext\",\n\t\"py\",\n\t\"python\",\n\t\"rb\",\n\t\"ruby\",\n\t\"rust\",\n\t\"sh\",\n\t\"shell\",\n\t\"text\",\n\t\"ts\",\n\t\"tsx\",\n\t\"txt\",\n\t\"typescript\",\n\t\"xml\",\n\t\"yaml\",\n\t\"yml\",\n] as const;\n\n/**\n * Supported languages for syntax highlighting.\n */\ntype SupportedLanguage = (typeof supportedLanguages)[number];\n\n/**\n * Parses a markdown code block (```) language class into a SupportedLanguage.\n * Defaults to \"sh\" if no supported language is found.\n */\nfunction parseLanguage(\n\tvalue: `language-${string}` | `lang-${string}` | (string & {}) | undefined,\n): SupportedLanguage {\n\tif (!value) {\n\t\treturn \"sh\";\n\t}\n\n\t// remove leading \"language-\" and \"lang-\" prefixes\n\t// find first '-' and slice from there\n\tconst maybeLanguage = value.trim().slice(value.indexOf(\"-\") + 1);\n\n\treturn isSupportedLanguage(maybeLanguage) ? maybeLanguage : \"sh\";\n}\n\n/**\n * Type Predicate: checks if an arbitrary value is a supported syntax highlighting language.\n */\nconst isSupportedLanguage = (value: unknown): value is SupportedLanguage => {\n\treturn typeof value === \"string\" && supportedLanguages.includes(value as SupportedLanguage);\n};\n\n/**\n * A class name for a language that Prism.js can understand.\n */\ntype LanguageClass = `language-${SupportedLanguage}`;\n\n/**\n * Formats a language name into a class name that Prism.js can understand.\n * @default \"language-sh\"\n */\nfunction formatLanguageClassName(language: SupportedLanguage | undefined = \"sh\") {\n\tconst lang = language ?? \"sh\";\n\tconst className: LanguageClass = `language-${lang}`;\n\treturn className;\n}\n\nexport { isSupportedLanguage, parseLanguage, formatLanguageClassName };\nexport type { SupportedLanguage };\n","type Primitive = string | number | boolean | undefined | null;\n\n/**\n * Tagged template literal to format code blocks and normalize leading indentation\n */\nfunction fmtCode(strings: TemplateStringsArray, ...values: Primitive[]): string {\n\tif (!isTemplateStringsArray(strings) || !Array.isArray(values)) {\n\t\tthrow new Error(\n\t\t\t\"It looks like you tried to call `fmtCode` as a function. Make sure to use it as a tagged template.\\n\\tExample: fmtCode`SELECT * FROM users`, not fmtCode('SELECT * FROM users')\",\n\t\t);\n\t}\n\n\tconst text = String.raw({ raw: strings }, ...values);\n\n\t// fine the minimum indentation of the code block\n\tconst minIndent = findMinIndent(text);\n\tconst lines = text.trim().split(\"\\n\");\n\n\treturn lines\n\t\t.map((line) => {\n\t\t\t// remove nothing if the line doesn't start with indentation\n\t\t\tif (/^\\S+/.test(line)) {\n\t\t\t\treturn line;\n\t\t\t}\n\t\t\treturn line.slice(minIndent);\n\t\t})\n\t\t.join(\"\\n\");\n}\n\nexport {\n\t//,\n\tfmtCode,\n};\n\n/**\n * Find the shortest indentation of a multiline string\n */\nfunction findMinIndent(value: string): number {\n\tconst match = value.match(/^[ \\t]*(?=\\S)/gm);\n\n\tif (!match) {\n\t\treturn 0;\n\t}\n\n\treturn match.reduce((acc, curr) => Math.min(acc, curr.length), Number.POSITIVE_INFINITY);\n}\n\n/**\n * Type guard to check if a value is a `TemplateStringsArray`\n */\nfunction isTemplateStringsArray(strings: unknown): strings is TemplateStringsArray {\n\treturn Array.isArray(strings) && \"raw\" in strings && Array.isArray(strings.raw);\n}\n","import { parseBooleanish } from \"../../types/booleanish.js\";\nimport { type Indentation, isIndentation } from \"./indentation.js\";\n\nconst modes = [\n\t//,\n\t\"cli\",\n\t\"file\",\n\t\"traffic-policy\",\n] as const;\ntype Mode = (typeof modes)[number];\n\ntype MetaInput = {\n\tcollapsible?: boolean | undefined;\n\tdisableCopy?: boolean | undefined;\n\tindentation?: Indentation | undefined;\n\tmode?: Mode | undefined;\n\ttitle?: string | undefined;\n};\n\ntype Meta = {\n\tcollapsible: boolean;\n\tdisableCopy: boolean;\n\tindentation?: Indentation | undefined;\n\tmode?: Mode | undefined;\n\ttitle?: string | undefined;\n};\n\nconst defaultMeta = {\n\tcollapsible: false,\n\tdisableCopy: false,\n\tindentation: undefined,\n\tmode: undefined,\n\ttitle: undefined,\n} as const satisfies Meta;\n\ntype DefaultMeta = typeof defaultMeta;\n\n/**\n * Parses a markdown code block (```) metastring into a meta object.\n * Defaults to DefaultMeta if no metastring given or if metastring is invalid.\n * Useful for parsing the metastring from a markdown code block to pass into the\n * CodeBlock components as props.\n */\nfunction parseMetastring(input: string | undefined): Meta {\n\tconst metastring = input?.trim() ?? \"\";\n\tif (!metastring) {\n\t\treturn defaultMeta;\n\t}\n\n\tconst metaJson = tokenizeMetastring(metastring).reduce<Record<string, unknown>>((acc, token) => {\n\t\tconst [key, value] = token.split(\"=\");\n\t\tif (!key) {\n\t\t\treturn acc;\n\t\t}\n\t\tconst normalizedValue = normalizeValue(value);\n\t\tacc[key] = normalizedValue ?? true;\n\t\treturn acc;\n\t}, {});\n\n\ttry {\n\t\tconst parsed = parseMetaJson(metaJson);\n\n\t\t// return the parsed meta object, with default values filled in\n\t\treturn {\n\t\t\t...defaultMeta,\n\t\t\t...parsed,\n\t\t};\n\t} catch {\n\t\treturn defaultMeta;\n\t}\n}\n\nexport {\n\t//,\n\tdefaultMeta,\n\tparseMetastring,\n};\nexport type {\n\t//,\n\tMeta,\n\tMetaInput,\n\tMode,\n\tDefaultMeta,\n};\n\n/**\n * Remove leading and trailing `\"` quotes around value\n * @private\n *\n * @example\n * ```tsx\n * const normalized = normalizeValue('\"hello world\"');\n * // Returns: \"hello world\"\n *\n * const unchanged = normalizeValue('hello');\n * // Returns: \"hello\"\n * ```\n */\nexport function normalizeValue(value: string | undefined) {\n\treturn value?.trim().replace(/^\"(.*)\"$/, \"$1\");\n}\n\n/**\n * Splits a metastring into an array of tokens that can be parsed into a meta object.\n * Should allow for quotes and spaces in tokens\n * @private\n *\n * @example\n * ```tsx\n * const tokens = tokenizeMetastring('title=\"My File\" collapsible mode=cli');\n * // Returns: ['title=\"My File\"', 'collapsible', 'mode=cli']\n *\n * const simpleTokens = tokenizeMetastring('collapsible disableCopy');\n * // Returns: ['collapsible', 'disableCopy']\n * ```\n */\nexport function tokenizeMetastring(value: string | undefined): string[] {\n\tconst input = value?.trim() ?? \"\";\n\tconst result: string[] = [];\n\n\tlet currentString = \"\";\n\tlet inQuotes = false;\n\n\tfor (const char of input) {\n\t\tif (char === \" \" && !inQuotes) {\n\t\t\tif (currentString) {\n\t\t\t\tresult.push(currentString);\n\t\t\t\tcurrentString = \"\";\n\t\t\t}\n\t\t} else if (char === '\"') {\n\t\t\tinQuotes = !inQuotes;\n\t\t\tcurrentString += char;\n\t\t} else {\n\t\t\tcurrentString += char;\n\t\t}\n\t}\n\n\tif (currentString) {\n\t\tresult.push(currentString);\n\t}\n\n\treturn result;\n}\n\n/**\n * Type Predicate: checks if the given value is a valid mode.\n * @private\n */\nfunction isMode(input: unknown): input is Mode {\n\treturn modes.includes(input as Mode);\n}\n\n/**\n * Parses a meta JSON object into a Meta object.\n * @private\n */\nfunction parseMetaJson(input: Record<string, unknown>): Meta {\n\tconst {\n\t\tcollapsible = defaultMeta.collapsible,\n\t\tdisableCopy = defaultMeta.disableCopy,\n\t\tindentation = defaultMeta.indentation,\n\t\tmode = defaultMeta.mode,\n\t\ttitle = defaultMeta.title,\n\t} = input;\n\n\treturn {\n\t\tcollapsible:\n\t\t\ttypeof collapsible === \"string\" || typeof collapsible === \"boolean\"\n\t\t\t\t? parseBooleanish(collapsible)\n\t\t\t\t: defaultMeta.collapsible,\n\t\tdisableCopy:\n\t\t\ttypeof disableCopy === \"string\" || typeof disableCopy === \"boolean\"\n\t\t\t\t? parseBooleanish(disableCopy)\n\t\t\t\t: defaultMeta.disableCopy,\n\t\tindentation: isIndentation(indentation) ? indentation : defaultMeta.indentation,\n\t\tmode: isMode(mode) ? mode : defaultMeta.mode,\n\t\ttitle: typeof title === \"string\" ? title.trim() : defaultMeta.title,\n\t};\n}\n"],"mappings":"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","names":["CaretDownIcon","CheckIcon","CopyIcon","FileTextIcon","TerminalIcon","clsx","createContext","forwardRef","useContext","useEffect","useId","useMemo","useRef","useState","assert","escapeHtml","value","escaped","character","Prism","indentations","isIndentation","input","inferIndentation","language","preferredIndentation","isTabIndentedLanguage","isSpaceIndentedLanguage","tabIndentedLanguages","spaceIndentedLanguages","isTabIndentedLanguage","value","isSpaceIndentedLanguage","normalizeIndentation","value","options","indentation","match","supportedLanguages","parseLanguage","value","maybeLanguage","isSupportedLanguage","formatLanguageClassName","language","Fragment","jsx","jsxs","CodeBlockContext","createContext","Root","forwardRef","asChild","className","props","ref","copyText","setCopyText","useState","hasCodeExpander","setHasCodeExpander","isCodeExpanded","setIsCodeExpanded","codeId","setCodeId","context","useMemo","id","old","assert","Component","Slot","cx","Body","Code","_unusedHighlightLines","propIndentation","language","_unusedShowLineNumbers","style","tabIndex","value","useId","registerCodeId","unregisterCodeId","useContext","indentation","inferIndentation","normalizedAndTrimmedValue","normalizeIndentation","highlightedCodeInnerHtml","setHighlightedCodeInnerHtml","escapeHtml","useEffect","grammar","Prism","supportedLanguages","newHighlightedCodeInnerHtml","languageClassName","formatLanguageClassName","clsx","Header","Title","CopyButton","onCopy","onCopyError","onClick","copyToClipboard","useCopyToClipboard","wasCopied","setWasCopied","timeoutHandle","useRef","event","error","Icon","CheckIcon","CopyIcon","ExpanderButton","prev","CaretDownIcon","CodeBlockIconComponent","preset","_svgProp","svg","FileTextIcon","TerminalIcon","TrafficPolicyFileIcon","CodeBlock","fmtCode","strings","values","isTemplateStringsArray","text","minIndent","findMinIndent","line","findMinIndent","value","match","acc","curr","isTemplateStringsArray","strings","modes","defaultMeta","parseMetastring","input","metastring","metaJson","tokenizeMetastring","acc","token","key","value","normalizedValue","normalizeValue","parsed","parseMetaJson","normalizeValue","value","tokenizeMetastring","input","result","currentString","inQuotes","char","isMode","modes","parseMetaJson","collapsible","defaultMeta","disableCopy","indentation","mode","title","parseBooleanish","isIndentation"]}
|