@alextheman/components 6.15.8 → 6.16.0

package/dist/index.d.cts

@@ -169,20 +169,23 @@ declare function NavigationBottom({
 //#region src/components/Page.d.ts
 interface PageProps {
   /** The Page title to show */
-  title: string;
+  title: ReactNode;
   /** The subtitle to show under the Page title */
-  subtitle?: string;
+  subtitle?: ReactNode;
   /** The actions to show in the page header */
   action?: ReactNode;
   /** The actual page contents */
   children: ReactNode;
+  /** Disable the inner padding of the Page contents. */
+  disablePadding?: boolean;
 }
 /** Renders a pre-styled Page that can be used to structure pages throughout your React apps. */
 declare function Page({
   title,
   subtitle,
   action,
-  children
+  children,
+  disablePadding
 }: PageProps): _$react_jsx_runtime0.JSX.Element;
 //#endregion
 //#region src/types/ContextHookOptions.d.ts

package/dist/index.d.ts

@@ -169,20 +169,23 @@ declare function NavigationBottom({
 //#region src/components/Page.d.ts
 interface PageProps {
   /** The Page title to show */
-  title: string;
+  title: ReactNode;
   /** The subtitle to show under the Page title */
-  subtitle?: string;
+  subtitle?: ReactNode;
   /** The actions to show in the page header */
   action?: ReactNode;
   /** The actual page contents */
   children: ReactNode;
+  /** Disable the inner padding of the Page contents. */
+  disablePadding?: boolean;
 }
 /** Renders a pre-styled Page that can be used to structure pages throughout your React apps. */
 declare function Page({
   title,
   subtitle,
   action,
-  children
+  children,
+  disablePadding
 }: PageProps): _$react_jsx_runtime0.JSX.Element;
 //#endregion
 //#region src/types/ContextHookOptions.d.ts

package/dist/index.js

@@ -1,3 +1,3 @@
-import e from"@mui/material/Box";import t from"@mui/material/Card";import n from"@mui/material/CardContent";import r from"@mui/material/CardHeader";import i from"@mui/material/Chip";import a from"@mui/material/Divider";import o from"@mui/material/Stack";import s from"@mui/material/Typography";import{Fragment as c,jsx as l,jsxs as u}from"react/jsx-runtime";import d from"@mui/material/ButtonBase";import f from"@mui/material/Collapse";import{Fragment as p,createContext as m,useCallback as h,useContext as g,useEffect as _,useId as v,useMemo as y,useRef as ee,useState as b}from"react";import{MdArrowDropDown as te,MdArrowDropUp as x,MdChevronLeft as ne,MdChevronRight as re,MdCloudUpload as ie,MdDelete as ae,MdMenu as oe,MdOutlineDarkMode as se,MdOutlineLightMode as ce,MdVisibility as le}from"react-icons/md";import ue from"@mui/material/Link";import S from"@mui/material/Button";import{ThemeProvider as de,createTheme as fe,styled as C,useTheme as pe}from"@mui/material/styles";import w from"@mui/material/IconButton";import T from"@mui/material/List";import E from"@mui/material/ListItem";import D from"@mui/material/ListItemText";import me from"@mui/material/Tooltip";import he from"@mui/material/Switch";import{DataError as O}from"@alextheman/utility/v6";import k from"@mui/material/CssBaseline";import A from"@mui/material/CircularProgress";import j from"@mui/material/Alert";import{fillArray as ge,truncate as M,wait as _e}from"@alextheman/utility";import ve from"@mui/material/Snackbar";import ye from"@mui/material/BottomNavigation";import be from"@mui/material/BottomNavigationAction";import xe from"@mui/material/Paper";import{Link as N,useLocation as Se}from"react-router-dom";import{stripIndent as Ce}from"common-tags";import{LiveEditor as we,LiveError as Te,LivePreview as Ee,LiveProvider as De}from"react-live";import Oe from"@mui/material/Skeleton";import ke from"@mui/material/TableCell";import Ae from"@mui/material/TableRow";import P from"@mui/material/Menu";import F from"@mui/material/AppBar";import I from"@mui/material/Drawer";import L from"@mui/material/ListItemButton";import je from"@mui/material/ListItemIcon";import Me from"@mui/material/Toolbar";import"wouter";import"@mui/material/AlertTitle";import"@mui/material/Container";import"wouter/memory-location";import"wouter/use-browser-location";import{createFormHookContexts as Ne}from"@tanstack/react-form";import"@mui/material/TextField";import R from"@mui/material/MenuItem";import Pe from"@mui/material/Popover";import{useFormContext as Fe}from"react-hook-form";function z({containerLabel:e,chipLabels:r}){return l(t,{sx:{width:320,height:420,backgroundColor:`rgba(255,255,255,0.07)`,backdropFilter:`blur(8px)`,border:`1px solid rgba(255,255,255,0.06)`,boxShadow:`0 10px 40px rgba(0,0,0,0.35)`},children:u(n,{children:[l(s,{variant:`h6`,gutterBottom:!0,sx:{color:`#f8fafc`},children:e}),l(o,{spacing:1,children:r.map(e=>l(i,{label:e,sx:{backgroundColor:`rgba(255,255,255,0.11)`,color:`rgba(255,255,255,0.88)`,border:`1px solid rgba(255,255,255,0.06)`}},e))})]})})}function Ie(){return l(e,{sx:{width:120,height:6,borderRadius:3,background:`linear-gradient(90deg, #f43f5e, #a78bfa, #22d3ee)`,boxShadow:`0 0 24px rgba(167,139,250,0.55)`}})}function Le(){return u(t,{sx:{width:1e3,height:1e3,display:`flex`,flexDirection:`column`,justifyContent:`space-between`,p:4,background:`radial-gradient(circle at 20% 10%, rgba(167,139,250,0.35) 0%, rgba(167,139,250,0.12) 35%, rgba(0,0,0,0) 55%), linear-gradient(135deg, #3a3380 0%, #1d2e5f 40%, #2d3f55 100%)`,color:`white`},elevation:0,children:[l(r,{title:`An Interface For You And I`,sx:{color:`#f8fafc`,textAlign:`center`,"& .MuiCardHeader-title":{fontSize:40,fontWeight:600,letterSpacing:2}}}),l(a,{sx:{borderColor:`rgba(255,255,255,0.2)`}}),l(n,{sx:{flex:1,display:`flex`,alignItems:`center`},children:u(o,{direction:`row`,spacing:4,sx:{width:`100%`,justifyContent:`center`,alignItems:`center`},children:[l(z,{containerLabel:`You`,chipLabels:[`state`,`context`,`input`,`event`,`focus`,`value`,`history`]}),l(Ie,{}),l(z,{containerLabel:`I`,chipLabels:[`render`,`effect`,`response`,`update`,`history`,`layout`,`provider`]})]})})]})}function Re({isInitiallyOpen:t,onOpen:n,onClose:r,children:i,buttonStyles:a,buttonContents:o,buttonComponent:s=d,collapseProps:c,openIcon:p=l(x,{}),closedIcon:m=l(te,{}),useDefaultStyling:h=s===d}){let[g,v]=b(!!t);return _(()=>{g&&n?n():!g&&r&&r()},[g]),u(e,{children:[u(s,{onClick:()=>{v(e=>!e)},sx:h?{width:`100%`,display:`flex`,alignItems:`center`,justifyContent:`center`,paddingY:1.5,paddingX:2,textAlign:`center`,"&:hover":s===d?{backgroundColor:`action.hover`}:null,...a}:a,"aria-expanded":g,children:[o,g?p:m]}),l(f,{in:g,...c,children:i})]})}function B({href:e,children:t,ref:n,...r}){return l(ue,{component:`a`,href:e,ref:n,target:`_blank`,rel:`noopener noreferrer`,...r,children:t})}const ze={PDF:`application/pdf`,PNG:`image/png`,JPEG:`image/jpeg`,JPG:`image/jpg`,XLSX:`application/vnd.openxmlformats-officedocument.spreadsheetml.sheet`,DOCX:`application/vnd.openxmlformats-officedocument.wordprocessingml.document`,MP3:`audio/mp3`,MP4:`video/mp4`,WAV:`audio/wav`},Be=C(`input`)({clip:`rect(0 0 0 0)`,clipPath:`inset(50%)`,height:1,overflow:`hidden`,position:`absolute`,bottom:0,left:0,whiteSpace:`nowrap`,width:1}),Ve=C(`div`)(({theme:e,$dragging:t})=>({border:`2px dashed`,borderColor:t?e.palette.primary.main:`#ccc`,backgroundColor:t?e.palette.action.hover:`transparent`,borderRadius:8,padding:`1.5rem`,textAlign:`center`,transition:`border-color 0.2s`,cursor:`pointer`}));function V({onFileInput:e,label:t=`Upload files`,multiple:n,accept:r,useDropzone:i,...a}){let[o,s]=b(!1),c=v(),d=u(S,{variant:`contained`,component:`label`,"aria-label":`File input button`,onKeyDown:e=>{(e.key===`Enter`||e.key===` `)&&(e.preventDefault(),document.getElementById(c)?.click())},...a,startIcon:a.startIcon??l(ie,{}),children:[t,l(Be,{id:c,type:`file`,onChange:t=>{let n=t.target;e(Array.from(n.files??[])),n.value=``},multiple:n,accept:r?.join(`,`),disabled:a.disabled})]});return i?l(Ve,{$dragging:o,onDragOver:e=>{e.preventDefault(),!a.disabled&&s(!0)},onDragLeave:e=>{e.preventDefault(),s(!1)},onDrop:t=>{t.preventDefault(),s(!1),!a.disabled&&e(Array.from(t.dataTransfer.files??[]))},children:d}):d}function He({files:t,setFiles:n,multiple:r=!0,...i}){function a(e){n(t=>[...t,...e])}return u(e,{children:[l(V,{...i,multiple:r,onFileInput:a}),l(T,{children:t.map(e=>l(E,{secondaryAction:l(w,{"aria-label":`Delete`,edge:`end`,onClick:()=>{n(t=>t.filter(t=>t!==e))},children:l(ae,{})}),children:l(D,{primary:e.name})},`${e.name}-${e.lastModified}`))})]})}const Ue=C(he)(()=>({padding:8,"& .MuiSwitch-track":{borderRadius:11,"&::before, &::after":{content:`""`,position:`absolute`,top:`50%`,transform:`translateY(-50%)`,fontSize:16,width:28,height:28}}}));function H({checkedIcon:t,checkedIconStyles:n,uncheckedIcon:r,uncheckedIconStyles:i,...a}){let o={borderRadius:`50%`,borderColor:`white`,backgroundColor:`white`,display:`flex`,alignItems:`center`,justifyContent:`center`,padding:.25},s={color:`black`,maxWidth:16.5,maxHeight:16.5};return l(Ue,{checkedIcon:l(e,{sx:o,children:l(t,{style:{...s,...n}})}),icon:l(e,{sx:o,children:l(r,{style:{...s,...i}})}),...a})}const U=m({toggleMode:()=>{},mode:`dark`});function W({strict:e=!0}={}){let t=g(U);if(e&&!t)throw new O({strict:e,context:t},`MODE_PROVIDER_NOT_FOUND`,`Could not find the ModeProvider context. Please double-check that it is present.`);return t}function We({children:e,mode:t=`dark`}){let[n,r]=b(t),i=y(()=>fe({palette:{mode:n},components:{MuiPaper:{styleOverrides:{root:({theme:e})=>({border:1,borderStyle:`solid`,borderColor:e.palette.divider})}}}}),[n]);return l(U.Provider,{value:{mode:n,toggleMode:()=>{r(e=>e===`light`?`dark`:`light`)}},children:u(de,{theme:i,children:[l(k,{}),e]})})}const G=m(void 0);function K({strict:e=!0}={}){let t=g(G);if(e&&!t)throw new O({strict:e,context:t},`LOADER_PROVIDER_NOT_FOUND`,`Could not find the QueryBoundaryProvider context. Please double-check that it is present.`);return t}function Ge({children:e,loadingComponent:t=l(A,{}),...n}){return l(G.Provider,{value:{loadingComponent:t,...n},children:e})}function q({children:e,dataParser:t,loadingComponent:n}){let{isLoading:r,data:i,dataParser:a,loadingComponent:o,error:s}=K(),u=t??a;return r?l(c,{children:n??o}):s||i==null?null:l(c,{children:typeof e==`function`?e(u?u(i):i):e})}function J({children:e,loadingComponent:t,itemKey:n,itemParser:r,dataParser:i,emptyComponent:a=l(s,{children:`No data present`}),strictlyRequireArray:o=!0}){let{isLoading:u,data:d,dataParser:f,loadingComponent:m,error:h}=K(),g=i??f,_=t??m;if(u)return l(c,{children:_});if(h||d==null)return null;if(!Array.isArray(d)){if(o)throw new O({data:d,strictlyRequireArray:o},`NOT_AN_ARRAY`,`Expected the data to be an array but it was not an array.`);return null}if(d.length===0)return l(c,{children:a});let v;return v=g?g(d):r?d.map(r):d,l(c,{children:v.map((t,r)=>l(p,{children:typeof e==`function`?e(t):e},n?n(t,r):r))})}function Y({children:e,undefinedComponent:t,nullComponent:n,nullableComponent:r,logError:i}){let{isLoading:a,data:o,error:s,errorComponent:u,logError:d}=K(),f=i??d,p=ee(!1),m=e??u;return o==null?s?(f&&!p.current&&(console.error(s),p.current=!0),typeof m==`function`?m(s):m?l(c,{children:m}):l(j,{severity:`error`,children:typeof s==`object`&&`message`in s&&typeof s.message==`string`?s.message:`An unknown error has occured. Please try again later.`})):!a&&o==null?r?(f&&!p.current&&(console.error(`Data is nullable after loading.`),p.current=!0),l(c,{children:r})):o===void 0&&(f&&!p.current&&(console.error(`Data is undefined after loading. This could either be an issue with the query or you have not passed in the data to QueryBoundaryProvider. Please double-check that you have provided data.`),p.current=!0),t)?l(c,{children:t}):o===null&&(f&&!p.current&&(console.error(`Data is null after loading.`),p.current=!0),n)?l(c,{children:n}):l(j,{severity:`error`,children:`Failed to load data. Please try again later.`}):null:null}var X=Ge;const Ke=m({windowWidth:0,windowHeight:0,isLargeScreen:!1});function qe({strict:e=!0}={}){let t=g(Ke);if(e&&!t)throw new O({strict:e,context:t},`SCREEN_SIZE_PROVIDER_NOT_FOUND`,`Could not find the ScreenSizeProvider context. Please double-check that it is present.`);return t}function Je({children:e,largeScreenWidth:t=669,largeScreenHeight:n=660}){let[r,i]=b(window.innerWidth),[a,o]=b(window.innerHeight);_(()=>{function e(){i(window.innerWidth),o(window.innerHeight)}return e(),window.addEventListener(`resize`,e),()=>{window.removeEventListener(`resize`,e)}},[]);let s=y(()=>r>t&&a>n,[r,a,t,n]);return l(Ke.Provider,{value:{isLargeScreen:s,windowWidth:r,windowHeight:a},children:e})}const Ye=m(void 0);function Xe({strict:e=!0}={}){let t=g(Ye);if(e&&!t)throw new O({strict:e,context:t},`SNACKBAR_PROVIDER_NOT_FOUND`,`Could not find the SnackbarProvider context. Please double-check that it is present.`);return t}function Ze({children:e,autoHideDuration:t=5e3}){let[n,r]=b(!1),[i,a]=b(t),[o,s]=b(``),[c,d]=b(`info`);function f(e,n,i){r(!0),a(i??t),d(n??`info`),s(e)}async function p(){r(!1),await _e(.2),s(``)}return u(Ye.Provider,{value:{addSnackbar:f},children:[l(ve,{open:n,autoHideDuration:i,onClose:p,children:l(j,{onClose:p,severity:c,children:o})}),e]})}function Qe(){let{mode:e,toggleMode:t}=W(),n=e===`dark`,r=`Enable ${n?`light`:`dark`} mode`;return l(me,{title:r,children:l(H,{uncheckedIcon:ce,checkedIcon:se,checked:n,onChange:t,"aria-label":r})})}function $e({children:t,navItems:n}){let[r,i]=b(``);return u(c,{children:[l(e,{sx:{paddingBottom:7},children:t}),l(xe,{sx:{position:`fixed`,bottom:0,left:0,right:0},children:l(ye,{showLabels:!0,value:r,onChange:(e,t)=>{i(t)},children:n.map(e=>l(be,{...e,component:N},e.value))})})]})}function et({title:e,subtitle:i,action:o,children:d}){return u(t,{children:[l(r,{title:u(c,{children:[l(s,{variant:`h6`,children:e}),i?l(s,{variant:`body2`,color:`text.secondary`,children:i}):null]}),action:o}),l(a,{}),l(n,{children:d})]})}function tt({children:e,errorComponent:t,undefinedComponent:n,nullComponent:r,nullableComponent:i,logError:a,loadingComponent:o=l(A,{}),...s}){return u(X,{loadingComponent:o,...s,children:[l(Y,{undefinedComponent:n,nullComponent:r,nullableComponent:i,logError:a,children:t}),l(q,{children:e})]})}function nt({loadingComponent:e,undefinedComponent:t,nullComponent:n,nullableComponent:r,logError:i,errorComponent:a,children:o,isLoading:s,error:c,data:d,...f}){return u(X,{loadingComponent:e,isLoading:s,error:c,data:d,children:[l(Y,{undefinedComponent:t,nullComponent:n,nullableComponent:r,logError:i,children:a}),l(J,{...f,children:o})]})}function rt({code:t,previewStyles:n,...r}){let{mode:i}=W(),a={backgroundColor:i===`dark`?`black`:`white`,border:.3,borderRadius:1,padding:2,borderColor:`darkgray`},o=n?{...a,...n}:{...a};return l(e,{sx:{borderRadius:1,border:.5,padding:2},children:u(De,{...r,code:Ce(t??``),children:[l(s,{variant:`h5`,children:`Code`}),l(e,{sx:{border:.3,borderRadius:.3,borderColor:`darkgray`},children:l(we,{})}),l(`br`,{}),l(s,{variant:`h5`,children:`Result`}),u(e,{sx:o,children:[l(Ee,{}),l(Te,{})]})]})})}function it({columns:e}){return l(Ae,{children:ge(e=>l(ke,{children:l(Oe,{})},e),e)})}const at=Qe;function ot({children:t,button:n=S,buttonChildren:r=`Menu`,buttonProps:i,isOpenIcon:a=l(x,{}),isClosedIcon:o=l(te,{}),onOpen:s,onClose:c}){let[d,f]=b(null),p=y(()=>!!d,[d]),m={...i,onClick:e=>{f(e.currentTarget)},"aria-controls":p?`dropdown-menu`:void 0,"aria-haspopup":`true`,"aria-expanded":p};return n===S&&(m.endIcon=p?a:o),_(()=>{p&&s?s():!p&&c&&c()},[p,s,c]),u(e,{children:[l(n,{...m,children:r}),l(P,{id:`dropdown-menu`,anchorEl:d,open:p,onClose:()=>{f(null)},children:typeof t==`function`?l(e,{children:t(()=>{f(null)})}):t})]})}function st(e){return{width:240,transition:e.transitions.create(`width`,{easing:e.transitions.easing.sharp,duration:e.transitions.duration.enteringScreen}),overflowX:`hidden`}}function ct(e){return{transition:e.transitions.create(`width`,{easing:e.transitions.easing.sharp,duration:e.transitions.duration.leavingScreen}),overflowX:`hidden`,width:`calc(${e.spacing(7)} + 1px)`,[e.breakpoints.up(`sm`)]:{width:`calc(${e.spacing(8)} + 1px)`}}}C(`div`)(({theme:e})=>({display:`flex`,alignItems:`center`,justifyContent:`flex-end`,padding:e.spacing(0,1),...e.mixins.toolbar})),C(F,{shouldForwardProp:e=>e!==`open`})(({theme:e})=>({zIndex:e.zIndex.drawer+1,transition:e.transitions.create([`width`,`margin`],{easing:e.transitions.easing.sharp,duration:e.transitions.duration.leavingScreen}),variants:[{props:({open:e})=>e,style:{marginLeft:240,width:`calc(100% - 240px)`,transition:e.transitions.create([`width`,`margin`],{easing:e.transitions.easing.sharp,duration:e.transitions.duration.enteringScreen})}}]})),C(I,{shouldForwardProp:e=>e!==`open`})(({theme:e})=>({width:240,flexShrink:0,whiteSpace:`nowrap`,boxSizing:`border-box`,variants:[{props:({open:e})=>e,style:{...st(e),"& .MuiDrawer-paper":st(e)}},{props:({open:e})=>!e,style:{...ct(e),"& .MuiDrawer-paper":ct(e)}}]}));const{fieldContext:lt,formContext:ut,useFieldContext:dt,useFormContext:ft}=Ne(),pt=m(void 0);function Z({strict:e=!0}={}){let t=g(pt);if(e&&!t)throw new O({strict:e,context:t},`DROPDOWN_MENU_NOT_FOUND`,`Could not find the DropdownMenu context. Please double-check that it is present.`);return t}function mt({strict:e=!0}={}){return Z({strict:e})}function ht({children:e,onClose:t,...n}){let{anchorElement:r,isDropdownOpen:i,closeMenu:a}=mt();return l(P,{anchorEl:r,open:i,onClose:(e,n)=>{e.defaultPrevented||a(),t&&t(e,n)},...n,children:e})}function gt({component:e,children:t,ref:n,onClick:r,...i}){let{closeMenu:a}=Z();return l(R,{component:e,ref:n,...i,onClick:e=>{r&&r(e),!e.defaultPrevented&&a()},children:t})}const Q=Z,_t=ht,vt=gt;var yt=_t;function bt({ref:e,href:t,children:n,onClick:r,...i}){let{closeMenu:a}=Q();return l(R,{component:B,href:t,ref:e,...i,onClick:e=>{e.defaultPrevented||a(),r&&r(e)},children:n})}function $({to:e,component:t=N,children:n,ref:r,...i}){return l(ue,{component:t,to:e,ref:r,...i,children:n})}function xt({to:e,ref:t,children:n,onClick:r,...i}){let{closeMenu:a}=Q();return l(R,{component:$,to:e,ref:t,...i,onClick:e=>{e.defaultPrevented||a(),r&&r(e)},children:n})}function St({icon:t=le,onOpen:n,onClose:r,iconProps:i,children:a}){let[o,s]=b(null),c=!!o,d=v();function f(e){s(e.currentTarget),n&&n()}function p(){s(null),r&&r()}return u(e,{children:[l(t,{"aria-owns":c?d:void 0,"aria-haspopup":`true`,onMouseEnter:f,onMouseLeave:p,...i}),l(Pe,{id:d,disablePortal:!0,disableScrollLock:!0,slotProps:{root:{disableEnforceFocus:!0,disableAutoFocus:!0,disableRestoreFocus:!0}},sx:{pointerEvents:`none`},open:c,anchorEl:o,anchorOrigin:{vertical:`bottom`,horizontal:`left`},transformOrigin:{vertical:`top`,horizontal:`left`},onClose:p,disableRestoreFocus:!0,children:a})]})}function Ct({children:e,...t}){return l(L,{component:$,...t,children:e})}const wt=tt,Tt=q,Et=Y,Dt=X;function Ot(e){return{width:240,transition:e.transitions.create(`width`,{easing:e.transitions.easing.sharp,duration:e.transitions.duration.enteringScreen}),overflowX:`hidden`}}function kt(e){return{transition:e.transitions.create(`width`,{easing:e.transitions.easing.sharp,duration:e.transitions.duration.leavingScreen}),overflowX:`hidden`,width:`calc(${e.spacing(7)} + 1px)`,[e.breakpoints.up(`sm`)]:{width:`calc(${e.spacing(8)} + 1px)`}}}const At=C(`div`)(({theme:e})=>({display:`flex`,alignItems:`center`,justifyContent:`flex-end`,padding:e.spacing(0,1),...e.mixins.toolbar})),jt=C(F,{shouldForwardProp:e=>e!==`open`})(({theme:e})=>({zIndex:e.zIndex.drawer+1,transition:e.transitions.create([`width`,`margin`],{easing:e.transitions.easing.sharp,duration:e.transitions.duration.leavingScreen}),variants:[{props:({open:e})=>e,style:{marginLeft:240,width:`calc(100% - 240px)`,transition:e.transitions.create([`width`,`margin`],{easing:e.transitions.easing.sharp,duration:e.transitions.duration.enteringScreen})}}]})),Mt=C(I,{shouldForwardProp:e=>e!==`open`})(({theme:e})=>({width:240,flexShrink:0,whiteSpace:`nowrap`,boxSizing:`border-box`,variants:[{props:({open:e})=>e,style:{...Ot(e),"& .MuiDrawer-paper":Ot(e)}},{props:({open:e})=>!e,style:{...kt(e),"& .MuiDrawer-paper":kt(e)}}]}));function Nt({title:t,navItems:n,children:r,headerElements:i}){let o=pe(),[c,d]=b(!0),f=Se();function m(){d(!0)}function h(){d(!1)}return u(e,{sx:{display:`flex`},children:[l(k,{}),l(jt,{position:`fixed`,open:c,children:u(Me,{children:[l(w,{color:`inherit`,"aria-label":`open drawer`,onClick:m,edge:`start`,sx:[{marginRight:5},c&&{display:`none`}],children:l(oe,{})}),l(s,{variant:`h6`,noWrap:!0,component:`div`,children:t}),i]})}),u(Mt,{variant:`permanent`,open:c,children:[l(At,{children:l(w,{onClick:h,children:o.direction===`rtl`?l(re,{}):l(ne,{})})}),l(a,{}),n.map(e=>u(p,{children:[u(T,{children:[l(s,{variant:c?`h5`:`h6`,sx:{paddingLeft:c?2:1},children:c?e.category:M(e.category,4)}),e.options.map(e=>l(E,{disablePadding:!0,sx:{display:`block`},children:u(L,{sx:[{minHeight:48,px:2.5},c?{justifyContent:`initial`}:{justifyContent:`center`}],component:N,to:e.to,selected:f.pathname===e.to,children:[l(je,{sx:[{minWidth:0,justifyContent:`center`},c?{mr:3}:{mr:`auto`}],children:e.icon?e.icon:c?null:l(s,{children:M(e.label,4)})}),l(D,{primary:e.label,sx:[c?{opacity:1}:{opacity:0}]})]})},e.to))]}),l(a,{})]},e.category))]}),u(e,{component:`main`,sx:{flexGrow:1,p:3},children:[l(At,{}),r]})]})}function Pt({text:e,sx:t,...n}){return l(c,{children:e.split(`
-`).map((e,r)=>l(s,{sx:{margin:1,...t},...n,children:e},r))})}function Ft({disableClean:e,label:t,...n}){let{formState:{disabled:r,isDirty:i,isSubmitting:a}}=Fe();return l(S,{color:`primary`,disabled:n.disabled||e&&!i||r,loading:a,type:`submit`,variant:`contained`,...n,children:t})}function It(e){let[t,n]=b(()=>{let t=window.location.hash.replace(`#`,``);return e&&t===``?e:t}),r=h(()=>{let t=window.location.hash.replace(`#`,``);n(e&&t===``?e:t)},[n,e]);return _(()=>(window.addEventListener(`hashchange`,r),()=>{window.removeEventListener(`hashchange`,r)}),[r]),[t,h(e=>{let n=typeof e==`function`?e(t):e;n!==t&&(window.location.hash=n)},[t])]}export{Le as Artwork,Re as CollapsableItem,at as DarkModeToggle,ot as DropdownMenu,yt as DropdownMenu2,bt as DropdownMenuExternalLink,xt as DropdownMenuInternalLink,vt as DropdownMenuItem,B as ExternalLink,V as FileInput,He as FileInputList,ze as FileType,St as IconWithPopover,$ as InternalLink,Ct as ListItemInternalLink,wt as Loader,Tt as LoaderData,Et as LoaderError,Dt as LoaderProvider,We as ModeProvider,Qe as ModeToggle,$e as NavigationBottom,Nt as NavigationDrawer,et as Page,Pt as PopoverText,tt as QueryBoundary,q as QueryBoundaryData,J as QueryBoundaryDataMap,Y as QueryBoundaryError,nt as QueryBoundaryMap,X as QueryBoundaryProvider,rt as ReactPlayground,Je as ScreenSizeProvider,it as SkeletonRow,Ze as SnackbarProvider,Ft as SubmitButton,H as SwitchWithIcons,Q as useDropdownMenu,It as useHash,W as useMode,qe as useScreenSize,Xe as useSnackbar};
+import e from"@mui/material/Box";import t from"@mui/material/Card";import n from"@mui/material/CardContent";import r from"@mui/material/CardHeader";import i from"@mui/material/Chip";import a from"@mui/material/Divider";import o from"@mui/material/Stack";import s from"@mui/material/Typography";import{Fragment as c,jsx as l,jsxs as u}from"react/jsx-runtime";import d from"@mui/material/ButtonBase";import f from"@mui/material/Collapse";import{Fragment as p,createContext as m,useCallback as h,useContext as g,useEffect as _,useId as v,useMemo as y,useRef as ee,useState as b}from"react";import{MdArrowDropDown as te,MdArrowDropUp as x,MdChevronLeft as ne,MdChevronRight as re,MdCloudUpload as ie,MdDelete as ae,MdMenu as oe,MdOutlineDarkMode as se,MdOutlineLightMode as ce,MdVisibility as le}from"react-icons/md";import S from"@mui/material/Link";import C from"@mui/material/Button";import{ThemeProvider as ue,createTheme as de,styled as w,useTheme as fe}from"@mui/material/styles";import T from"@mui/material/IconButton";import E from"@mui/material/List";import D from"@mui/material/ListItem";import O from"@mui/material/ListItemText";import pe from"@mui/material/Tooltip";import me from"@mui/material/Switch";import{DataError as k}from"@alextheman/utility/v6";import A from"@mui/material/CssBaseline";import j from"@mui/material/CircularProgress";import M from"@mui/material/Alert";import{fillArray as he,truncate as N,wait as ge}from"@alextheman/utility";import _e from"@mui/material/Snackbar";import ve from"@mui/material/BottomNavigation";import ye from"@mui/material/BottomNavigationAction";import be from"@mui/material/Paper";import{Link as P,useLocation as xe}from"react-router-dom";import{stripIndent as Se}from"common-tags";import{LiveEditor as Ce,LiveError as we,LivePreview as Te,LiveProvider as Ee}from"react-live";import De from"@mui/material/Skeleton";import Oe from"@mui/material/TableCell";import ke from"@mui/material/TableRow";import F from"@mui/material/Menu";import Ae from"@mui/material/AppBar";import je from"@mui/material/Drawer";import I from"@mui/material/ListItemButton";import Me from"@mui/material/ListItemIcon";import Ne from"@mui/material/Toolbar";import L from"@mui/material/MenuItem";import Pe from"@mui/material/Popover";import{useFormContext as Fe}from"react-hook-form";function R({containerLabel:e,chipLabels:r}){return l(t,{sx:{width:320,height:420,backgroundColor:`rgba(255,255,255,0.07)`,backdropFilter:`blur(8px)`,border:`1px solid rgba(255,255,255,0.06)`,boxShadow:`0 10px 40px rgba(0,0,0,0.35)`},children:u(n,{children:[l(s,{variant:`h6`,gutterBottom:!0,sx:{color:`#f8fafc`},children:e}),l(o,{spacing:1,children:r.map(e=>l(i,{label:e,sx:{backgroundColor:`rgba(255,255,255,0.11)`,color:`rgba(255,255,255,0.88)`,border:`1px solid rgba(255,255,255,0.06)`}},e))})]})})}function Ie(){return l(e,{sx:{width:120,height:6,borderRadius:3,background:`linear-gradient(90deg, #f43f5e, #a78bfa, #22d3ee)`,boxShadow:`0 0 24px rgba(167,139,250,0.55)`}})}function Le(){return u(t,{sx:{width:1e3,height:1e3,display:`flex`,flexDirection:`column`,justifyContent:`space-between`,p:4,background:`radial-gradient(circle at 20% 10%, rgba(167,139,250,0.35) 0%, rgba(167,139,250,0.12) 35%, rgba(0,0,0,0) 55%), linear-gradient(135deg, #3a3380 0%, #1d2e5f 40%, #2d3f55 100%)`,color:`white`},elevation:0,children:[l(r,{title:`An Interface For You And I`,sx:{color:`#f8fafc`,textAlign:`center`,"& .MuiCardHeader-title":{fontSize:40,fontWeight:600,letterSpacing:2}}}),l(a,{sx:{borderColor:`rgba(255,255,255,0.2)`}}),l(n,{sx:{flex:1,display:`flex`,alignItems:`center`},children:u(o,{direction:`row`,spacing:4,sx:{width:`100%`,justifyContent:`center`,alignItems:`center`},children:[l(R,{containerLabel:`You`,chipLabels:[`state`,`context`,`input`,`event`,`focus`,`value`,`history`]}),l(Ie,{}),l(R,{containerLabel:`I`,chipLabels:[`render`,`effect`,`response`,`update`,`history`,`layout`,`provider`]})]})})]})}function Re({isInitiallyOpen:t,onOpen:n,onClose:r,children:i,buttonStyles:a,buttonContents:o,buttonComponent:s=d,collapseProps:c,openIcon:p=l(x,{}),closedIcon:m=l(te,{}),useDefaultStyling:h=s===d}){let[g,v]=b(!!t);return _(()=>{g&&n?n():!g&&r&&r()},[g]),u(e,{children:[u(s,{onClick:()=>{v(e=>!e)},sx:h?{width:`100%`,display:`flex`,alignItems:`center`,justifyContent:`center`,paddingY:1.5,paddingX:2,textAlign:`center`,"&:hover":s===d?{backgroundColor:`action.hover`}:null,...a}:a,"aria-expanded":g,children:[o,g?p:m]}),l(f,{in:g,...c,children:i})]})}function z({href:e,children:t,ref:n,...r}){return l(S,{component:`a`,href:e,ref:n,target:`_blank`,rel:`noopener noreferrer`,...r,children:t})}const ze={PDF:`application/pdf`,PNG:`image/png`,JPEG:`image/jpeg`,JPG:`image/jpg`,XLSX:`application/vnd.openxmlformats-officedocument.spreadsheetml.sheet`,DOCX:`application/vnd.openxmlformats-officedocument.wordprocessingml.document`,MP3:`audio/mp3`,MP4:`video/mp4`,WAV:`audio/wav`},Be=w(`input`)({clip:`rect(0 0 0 0)`,clipPath:`inset(50%)`,height:1,overflow:`hidden`,position:`absolute`,bottom:0,left:0,whiteSpace:`nowrap`,width:1}),Ve=w(`div`)(({theme:e,$dragging:t})=>({border:`2px dashed`,borderColor:t?e.palette.primary.main:`#ccc`,backgroundColor:t?e.palette.action.hover:`transparent`,borderRadius:8,padding:`1.5rem`,textAlign:`center`,transition:`border-color 0.2s`,cursor:`pointer`}));function B({onFileInput:e,label:t=`Upload files`,multiple:n,accept:r,useDropzone:i,...a}){let[o,s]=b(!1),c=v(),d=u(C,{variant:`contained`,component:`label`,"aria-label":`File input button`,onKeyDown:e=>{(e.key===`Enter`||e.key===` `)&&(e.preventDefault(),document.getElementById(c)?.click())},...a,startIcon:a.startIcon??l(ie,{}),children:[t,l(Be,{id:c,type:`file`,onChange:t=>{let n=t.target;e(Array.from(n.files??[])),n.value=``},multiple:n,accept:r?.join(`,`),disabled:a.disabled})]});return i?l(Ve,{$dragging:o,onDragOver:e=>{e.preventDefault(),!a.disabled&&s(!0)},onDragLeave:e=>{e.preventDefault(),s(!1)},onDrop:t=>{t.preventDefault(),s(!1),!a.disabled&&e(Array.from(t.dataTransfer.files??[]))},children:d}):d}function He({files:t,setFiles:n,multiple:r=!0,...i}){function a(e){n(t=>[...t,...e])}return u(e,{children:[l(B,{...i,multiple:r,onFileInput:a}),l(E,{children:t.map(e=>l(D,{secondaryAction:l(T,{"aria-label":`Delete`,edge:`end`,onClick:()=>{n(t=>t.filter(t=>t!==e))},children:l(ae,{})}),children:l(O,{primary:e.name})},`${e.name}-${e.lastModified}`))})]})}const Ue=w(me)(()=>({padding:8,"& .MuiSwitch-track":{borderRadius:11,"&::before, &::after":{content:`""`,position:`absolute`,top:`50%`,transform:`translateY(-50%)`,fontSize:16,width:28,height:28}}}));function V({checkedIcon:t,checkedIconStyles:n,uncheckedIcon:r,uncheckedIconStyles:i,...a}){let o={borderRadius:`50%`,borderColor:`white`,backgroundColor:`white`,display:`flex`,alignItems:`center`,justifyContent:`center`,padding:.25},s={color:`black`,maxWidth:16.5,maxHeight:16.5};return l(Ue,{checkedIcon:l(e,{sx:o,children:l(t,{style:{...s,...n}})}),icon:l(e,{sx:o,children:l(r,{style:{...s,...i}})}),...a})}const H=m({toggleMode:()=>{},mode:`dark`});function U({strict:e=!0}={}){let t=g(H);if(e&&!t)throw new k({strict:e,context:t},`MODE_PROVIDER_NOT_FOUND`,`Could not find the ModeProvider context. Please double-check that it is present.`);return t}function We({children:e,mode:t=`dark`}){let[n,r]=b(t),i=y(()=>de({palette:{mode:n},components:{MuiPaper:{styleOverrides:{root:({theme:e})=>({border:1,borderStyle:`solid`,borderColor:e.palette.divider})}}}}),[n]);return l(H.Provider,{value:{mode:n,toggleMode:()=>{r(e=>e===`light`?`dark`:`light`)}},children:u(ue,{theme:i,children:[l(A,{}),e]})})}const W=m(void 0);function G({strict:e=!0}={}){let t=g(W);if(e&&!t)throw new k({strict:e,context:t},`LOADER_PROVIDER_NOT_FOUND`,`Could not find the QueryBoundaryProvider context. Please double-check that it is present.`);return t}function Ge({children:e,loadingComponent:t=l(j,{}),...n}){return l(W.Provider,{value:{loadingComponent:t,...n},children:e})}function K({children:e,dataParser:t,loadingComponent:n}){let{isLoading:r,data:i,dataParser:a,loadingComponent:o,error:s}=G(),u=t??a;return r?l(c,{children:n??o}):s||i==null?null:l(c,{children:typeof e==`function`?e(u?u(i):i):e})}function q({children:e,loadingComponent:t,itemKey:n,itemParser:r,dataParser:i,emptyComponent:a=l(s,{children:`No data present`}),strictlyRequireArray:o=!0}){let{isLoading:u,data:d,dataParser:f,loadingComponent:m,error:h}=G(),g=i??f,_=t??m;if(u)return l(c,{children:_});if(h||d==null)return null;if(!Array.isArray(d)){if(o)throw new k({data:d,strictlyRequireArray:o},`NOT_AN_ARRAY`,`Expected the data to be an array but it was not an array.`);return null}if(d.length===0)return l(c,{children:a});let v;return v=g?g(d):r?d.map(r):d,l(c,{children:v.map((t,r)=>l(p,{children:typeof e==`function`?e(t):e},n?n(t,r):r))})}function J({children:e,undefinedComponent:t,nullComponent:n,nullableComponent:r,logError:i}){let{isLoading:a,data:o,error:s,errorComponent:u,logError:d}=G(),f=i??d,p=ee(!1),m=e??u;return s?(f&&!p.current&&(o!=null&&console.error(`An error has occurred but data is still present. This may indicate an invalid query state.`,{data:o,error:s}),console.error(s),p.current=!0),typeof m==`function`?m(s):m?l(c,{children:m}):l(M,{severity:`error`,children:typeof s==`object`&&`message`in s&&typeof s.message==`string`?s.message:`An unknown error has occured. Please try again later.`})):!a&&o==null?r?(f&&!p.current&&(console.error(`Data is nullable after loading.`),p.current=!0),l(c,{children:r})):o===void 0&&(f&&!p.current&&(console.error(`Data is undefined after loading. This could either be an issue with the query or you have not passed in the data to QueryBoundaryProvider. Please double-check that you have provided data.`),p.current=!0),t)?l(c,{children:t}):o===null&&(f&&!p.current&&(console.error(`Data is null after loading.`),p.current=!0),n)?l(c,{children:n}):l(M,{severity:`error`,children:`Failed to load data. Please try again later.`}):null}var Y=Ge;const X=m({windowWidth:0,windowHeight:0,isLargeScreen:!1});function Ke({strict:e=!0}={}){let t=g(X);if(e&&!t)throw new k({strict:e,context:t},`SCREEN_SIZE_PROVIDER_NOT_FOUND`,`Could not find the ScreenSizeProvider context. Please double-check that it is present.`);return t}function qe({children:e,largeScreenWidth:t=669,largeScreenHeight:n=660}){let[r,i]=b(window.innerWidth),[a,o]=b(window.innerHeight);_(()=>{function e(){i(window.innerWidth),o(window.innerHeight)}return e(),window.addEventListener(`resize`,e),()=>{window.removeEventListener(`resize`,e)}},[]);let s=y(()=>r>t&&a>n,[r,a,t,n]);return l(X.Provider,{value:{isLargeScreen:s,windowWidth:r,windowHeight:a},children:e})}const Je=m(void 0);function Ye({strict:e=!0}={}){let t=g(Je);if(e&&!t)throw new k({strict:e,context:t},`SNACKBAR_PROVIDER_NOT_FOUND`,`Could not find the SnackbarProvider context. Please double-check that it is present.`);return t}function Xe({children:e,autoHideDuration:t=5e3}){let[n,r]=b(!1),[i,a]=b(t),[o,s]=b(``),[c,d]=b(`info`);function f(e,n,i){r(!0),a(i??t),d(n??`info`),s(e)}async function p(){r(!1),await ge(.2),s(``)}return u(Je.Provider,{value:{addSnackbar:f},children:[l(_e,{open:n,autoHideDuration:i,onClose:p,children:l(M,{onClose:p,severity:c,children:o})}),e]})}function Ze(){let{mode:e,toggleMode:t}=U(),n=e===`dark`,r=`Enable ${n?`light`:`dark`} mode`;return l(pe,{title:r,children:l(V,{uncheckedIcon:ce,checkedIcon:se,checked:n,onChange:t,"aria-label":r})})}function Qe({children:t,navItems:n}){let[r,i]=b(``);return u(c,{children:[l(e,{sx:{paddingBottom:7},children:t}),l(be,{sx:{position:`fixed`,bottom:0,left:0,right:0},children:l(ve,{showLabels:!0,value:r,onChange:(e,t)=>{i(t)},children:n.map(e=>l(ye,{...e,component:P},e.value))})})]})}function $e({title:e,subtitle:i,action:o,children:d,disablePadding:f}){return u(t,{children:[l(r,{title:u(c,{children:[typeof e==`string`?l(s,{variant:`h6`,children:e}):e,i?typeof i==`string`?l(s,{variant:`body2`,color:`text.secondary`,children:i}):i:null]}),action:o}),l(a,{}),f?d:l(n,{children:d})]})}function et({children:e,errorComponent:t,undefinedComponent:n,nullComponent:r,nullableComponent:i,logError:a,loadingComponent:o=l(j,{}),...s}){let c=l(J,{logError:a});return i?c=l(J,{nullableComponent:i,logError:a,children:t}):(n||r)&&(c=l(J,{undefinedComponent:n,nullComponent:r,logError:a,children:t})),u(Y,{loadingComponent:o,...s,children:[c,l(K,{children:e})]})}function tt({loadingComponent:e,undefinedComponent:t,nullComponent:n,nullableComponent:r,logError:i,errorComponent:a,children:o,isLoading:s,error:c,data:d,...f}){let p=null;return r?p=l(J,{nullableComponent:r,logError:i,children:a}):(t||n)&&(p=l(J,{undefinedComponent:t,nullComponent:n,logError:i,children:a})),u(Y,{loadingComponent:e,isLoading:s,error:c,data:d,children:[p,l(q,{...f,children:o})]})}function nt({code:t,previewStyles:n,...r}){let{mode:i}=U(),a={backgroundColor:i===`dark`?`black`:`white`,border:.3,borderRadius:1,padding:2,borderColor:`darkgray`},o=n?{...a,...n}:{...a};return l(e,{sx:{borderRadius:1,border:.5,padding:2},children:u(Ee,{...r,code:Se(t??``),children:[l(s,{variant:`h5`,children:`Code`}),l(e,{sx:{border:.3,borderRadius:.3,borderColor:`darkgray`},children:l(Ce,{})}),l(`br`,{}),l(s,{variant:`h5`,children:`Result`}),u(e,{sx:o,children:[l(Te,{}),l(we,{})]})]})})}function rt({columns:e}){return l(ke,{children:he(e=>l(Oe,{children:l(De,{})},e),e)})}const it=Ze;function at({children:t,button:n=C,buttonChildren:r=`Menu`,buttonProps:i,isOpenIcon:a=l(x,{}),isClosedIcon:o=l(te,{}),onOpen:s,onClose:c}){let[d,f]=b(null),p=y(()=>!!d,[d]),m={...i,onClick:e=>{f(e.currentTarget)},"aria-controls":p?`dropdown-menu`:void 0,"aria-haspopup":`true`,"aria-expanded":p};return n===C&&(m.endIcon=p?a:o),_(()=>{p&&s?s():!p&&c&&c()},[p,s,c]),u(e,{children:[l(n,{...m,children:r}),l(F,{id:`dropdown-menu`,anchorEl:d,open:p,onClose:()=>{f(null)},children:typeof t==`function`?l(e,{children:t(()=>{f(null)})}):t})]})}const ot=m(void 0);function Z({strict:e=!0}={}){let t=g(ot);if(e&&!t)throw new k({strict:e,context:t},`DROPDOWN_MENU_NOT_FOUND`,`Could not find the DropdownMenu context. Please double-check that it is present.`);return t}function st({strict:e=!0}={}){return Z({strict:e})}function ct({children:e,onClose:t,...n}){let{anchorElement:r,isDropdownOpen:i,closeMenu:a}=st();return l(F,{anchorEl:r,open:i,onClose:(e,n)=>{e.defaultPrevented||a(),t&&t(e,n)},...n,children:e})}function lt({component:e,children:t,ref:n,onClick:r,...i}){let{closeMenu:a}=Z();return l(L,{component:e,ref:n,...i,onClick:e=>{r&&r(e),!e.defaultPrevented&&a()},children:t})}const Q=Z,ut=ct,dt=lt;var ft=ut;function pt({ref:e,href:t,children:n,onClick:r,...i}){let{closeMenu:a}=Q();return l(L,{component:z,href:t,ref:e,...i,onClick:e=>{e.defaultPrevented||a(),r&&r(e)},children:n})}function $({to:e,component:t=P,children:n,ref:r,...i}){return l(S,{component:t,to:e,ref:r,...i,children:n})}function mt({to:e,ref:t,children:n,onClick:r,...i}){let{closeMenu:a}=Q();return l(L,{component:$,to:e,ref:t,...i,onClick:e=>{e.defaultPrevented||a(),r&&r(e)},children:n})}function ht({icon:t=le,onOpen:n,onClose:r,iconProps:i,children:a}){let[o,s]=b(null),c=!!o,d=v();function f(e){s(e.currentTarget),n&&n()}function p(){s(null),r&&r()}return u(e,{children:[l(t,{"aria-owns":c?d:void 0,"aria-haspopup":`true`,onMouseEnter:f,onMouseLeave:p,...i}),l(Pe,{id:d,disablePortal:!0,disableScrollLock:!0,slotProps:{root:{disableEnforceFocus:!0,disableAutoFocus:!0,disableRestoreFocus:!0}},sx:{pointerEvents:`none`},open:c,anchorEl:o,anchorOrigin:{vertical:`bottom`,horizontal:`left`},transformOrigin:{vertical:`top`,horizontal:`left`},onClose:p,disableRestoreFocus:!0,children:a})]})}function gt({children:e,...t}){return l(I,{component:$,...t,children:e})}const _t=et,vt=K,yt=J,bt=Y;function xt(e){return{width:240,transition:e.transitions.create(`width`,{easing:e.transitions.easing.sharp,duration:e.transitions.duration.enteringScreen}),overflowX:`hidden`}}function St(e){return{transition:e.transitions.create(`width`,{easing:e.transitions.easing.sharp,duration:e.transitions.duration.leavingScreen}),overflowX:`hidden`,width:`calc(${e.spacing(7)} + 1px)`,[e.breakpoints.up(`sm`)]:{width:`calc(${e.spacing(8)} + 1px)`}}}const Ct=w(`div`)(({theme:e})=>({display:`flex`,alignItems:`center`,justifyContent:`flex-end`,padding:e.spacing(0,1),...e.mixins.toolbar})),wt=w(Ae,{shouldForwardProp:e=>e!==`open`})(({theme:e})=>({zIndex:e.zIndex.drawer+1,transition:e.transitions.create([`width`,`margin`],{easing:e.transitions.easing.sharp,duration:e.transitions.duration.leavingScreen}),variants:[{props:({open:e})=>e,style:{marginLeft:240,width:`calc(100% - 240px)`,transition:e.transitions.create([`width`,`margin`],{easing:e.transitions.easing.sharp,duration:e.transitions.duration.enteringScreen})}}]})),Tt=w(je,{shouldForwardProp:e=>e!==`open`})(({theme:e})=>({width:240,flexShrink:0,whiteSpace:`nowrap`,boxSizing:`border-box`,variants:[{props:({open:e})=>e,style:{...xt(e),"& .MuiDrawer-paper":xt(e)}},{props:({open:e})=>!e,style:{...St(e),"& .MuiDrawer-paper":St(e)}}]}));function Et({title:t,navItems:n,children:r,headerElements:i}){let o=fe(),[c,d]=b(!0),f=xe();function m(){d(!0)}function h(){d(!1)}return u(e,{sx:{display:`flex`},children:[l(A,{}),l(wt,{position:`fixed`,open:c,children:u(Ne,{children:[l(T,{color:`inherit`,"aria-label":`open drawer`,onClick:m,edge:`start`,sx:[{marginRight:5},c&&{display:`none`}],children:l(oe,{})}),l(s,{variant:`h6`,noWrap:!0,component:`div`,children:t}),i]})}),u(Tt,{variant:`permanent`,open:c,children:[l(Ct,{children:l(T,{onClick:h,children:o.direction===`rtl`?l(re,{}):l(ne,{})})}),l(a,{}),n.map(e=>u(p,{children:[u(E,{children:[l(s,{variant:c?`h5`:`h6`,sx:{paddingLeft:c?2:1},children:c?e.category:N(e.category,4)}),e.options.map(e=>l(D,{disablePadding:!0,sx:{display:`block`},children:u(I,{sx:[{minHeight:48,px:2.5},c?{justifyContent:`initial`}:{justifyContent:`center`}],component:P,to:e.to,selected:f.pathname===e.to,children:[l(Me,{sx:[{minWidth:0,justifyContent:`center`},c?{mr:3}:{mr:`auto`}],children:e.icon?e.icon:c?null:l(s,{children:N(e.label,4)})}),l(O,{primary:e.label,sx:[c?{opacity:1}:{opacity:0}]})]})},e.to))]}),l(a,{})]},e.category))]}),u(e,{component:`main`,sx:{flexGrow:1,p:3},children:[l(Ct,{}),r]})]})}function Dt({text:e,sx:t,...n}){return l(c,{children:e.split(`
+`).map((e,r)=>l(s,{sx:{margin:1,...t},...n,children:e},r))})}function Ot({disableClean:e,label:t,...n}){let{formState:{disabled:r,isDirty:i,isSubmitting:a}}=Fe();return l(C,{color:`primary`,disabled:n.disabled||e&&!i||r,loading:a,type:`submit`,variant:`contained`,...n,children:t})}function kt(e){let[t,n]=b(()=>{let t=window.location.hash.replace(`#`,``);return e&&t===``?e:t}),r=h(()=>{let t=window.location.hash.replace(`#`,``);n(e&&t===``?e:t)},[n,e]);return _(()=>(window.addEventListener(`hashchange`,r),()=>{window.removeEventListener(`hashchange`,r)}),[r]),[t,h(e=>{let n=typeof e==`function`?e(t):e;n!==t&&(window.location.hash=n)},[t])]}export{Le as Artwork,Re as CollapsableItem,it as DarkModeToggle,at as DropdownMenu,ft as DropdownMenu2,pt as DropdownMenuExternalLink,mt as DropdownMenuInternalLink,dt as DropdownMenuItem,z as ExternalLink,B as FileInput,He as FileInputList,ze as FileType,ht as IconWithPopover,$ as InternalLink,gt as ListItemInternalLink,_t as Loader,vt as LoaderData,yt as LoaderError,bt as LoaderProvider,We as ModeProvider,Ze as ModeToggle,Qe as NavigationBottom,Et as NavigationDrawer,$e as Page,Dt as PopoverText,et as QueryBoundary,K as QueryBoundaryData,q as QueryBoundaryDataMap,J as QueryBoundaryError,tt as QueryBoundaryMap,Y as QueryBoundaryProvider,nt as ReactPlayground,qe as ScreenSizeProvider,rt as SkeletonRow,Xe as SnackbarProvider,Ot as SubmitButton,V as SwitchWithIcons,Q as useDropdownMenu,kt as useHash,U as useMode,Ke as useScreenSize,Ye as useSnackbar};
 //# sourceMappingURL=index.js.map