@alextheman/components 6.19.0 → 6.19.1

package/dist/index.d.cts

@@ -455,7 +455,9 @@ declare function QueryBoundaryMap<ItemType>({
   isLoading,
   error,
   data,
-  ...props
+  dataParser,
+  itemParser,
+  itemKey
 }: QueryBoundaryMapProps<ItemType>): _$react_jsx_runtime0.JSX.Element;
 //#endregion
 //#region src/components/QueryBoundaryWrapper.d.ts
@@ -477,7 +479,7 @@ declare function QueryBoundaryWrapper<DataType>({
   isLoading,
   error,
   data,
-  ...loaderProviderProps
+  dataParser
 }: QueryBoundaryWrapperProps<DataType>): _$react_jsx_runtime0.JSX.Element;
 //#endregion
 //#region src/components/ReactPlayground.d.ts
@@ -846,14 +848,6 @@ declare function SubmitButton({
 }: SubmitButtonProps): _$react_jsx_runtime0.JSX.Element;
 //#endregion
 //#region src/hooks/createQueryBoundary.d.ts
-interface DefaultQueryBoundaryComponents<DataType> {
-  Context: typeof QueryBoundaryProvider<DataType>;
-  Error: typeof QueryBoundaryError;
-  Data: typeof QueryBoundaryData<DataType>;
-  DataMap: typeof QueryBoundaryDataMap<DataType>;
-  Fallback: typeof QueryBoundaryFallback;
-  Nullable: typeof QueryBoundaryNullable;
-}
 interface QueryBase {
   /** The current loading status (true if loading, false if not) */
   isLoading?: boolean;
@@ -874,6 +868,16 @@ type Query<DataType> = QuerySingle<DataType> | QueryMultiple<DataType>;
 interface CreateQueryBoundaryParameters<DataType> {
   query: Query<DataType>;
 }
+interface DefaultQueryBoundaryComponents<DataType> {
+  Context: (props: {
+    children: ReactNode;
+  }) => JSX.Element;
+  Error: typeof QueryBoundaryError;
+  Data: typeof QueryBoundaryData<DataType>;
+  DataMap: typeof QueryBoundaryDataMap<DataType>;
+  Fallback: typeof QueryBoundaryFallback;
+  Nullable: typeof QueryBoundaryNullable;
+}
 /** A creator function to create a system of QueryBoundary components with the data fully typed throughout. */
 declare function createQueryBoundary<DataType>({
   query

package/dist/index.d.ts

@@ -4,7 +4,7 @@ import { CollapseProps } from "@mui/material/Collapse";
 import * as _$react from "react";
 import { CSSProperties, ComponentProps, ComponentPropsWithRef, ComponentPropsWithoutRef, ComponentType, Dispatch, ElementType, JSX, Key, MouseEventHandler, ReactNode, Ref, SetStateAction } from "react";
 import { LinkProps } from "@mui/material/Link";
-import Button$1, { ButtonOwnProps, ButtonProps } from "@mui/material/Button";
+import MUIButton, { ButtonOwnProps, ButtonProps } from "@mui/material/Button";
 import { PaletteMode, SxProps, Theme } from "@mui/material/styles";
 import { SwitchProps } from "@mui/material/Switch";
 import { AlertColor } from "@mui/material/Alert";
@@ -455,7 +455,9 @@ declare function QueryBoundaryMap<ItemType>({
   isLoading,
   error,
   data,
-  ...props
+  dataParser,
+  itemParser,
+  itemKey
 }: QueryBoundaryMapProps<ItemType>): _$react_jsx_runtime0.JSX.Element;
 //#endregion
 //#region src/components/QueryBoundaryWrapper.d.ts
@@ -477,7 +479,7 @@ declare function QueryBoundaryWrapper<DataType>({
   isLoading,
   error,
   data,
-  ...loaderProviderProps
+  dataParser
 }: QueryBoundaryWrapperProps<DataType>): _$react_jsx_runtime0.JSX.Element;
 //#endregion
 //#region src/components/ReactPlayground.d.ts
@@ -572,7 +574,7 @@ declare function DropdownMenu$1({
 }: DropdownMenuProps$1): _$react_jsx_runtime0.JSX.Element;
 //#endregion
 //#region src/v7/components/DropdownMenu/DropdownMenuItem.d.ts
-type DropdownMenuItemProps$1<RootComponent extends ElementType = typeof Button$1> = {
+type DropdownMenuItemProps$1<RootComponent extends ElementType = typeof MUIButton> = {
   /**
    * An optional component to provide to override the current component.
    *
@@ -587,7 +589,7 @@ type DropdownMenuItemProps$1<RootComponent extends ElementType = typeof Button$1
   onClick?: ComponentProps<RootComponent>["onClick"];
 } & Omit<ComponentPropsWithoutRef<RootComponent>, "children" | "ref"> & MenuItemOwnProps;
 /** Represents a menu item to be used inside the `DropdownMenu`. It must be used as children of the `DropdownMenu` component. */
-declare function DropdownMenuItem$1<RootComponent extends ElementType = typeof Button$1>({
+declare function DropdownMenuItem$1<RootComponent extends ElementType = typeof MUIButton>({
   component,
   children,
   ref,
@@ -846,14 +848,6 @@ declare function SubmitButton({
 }: SubmitButtonProps): _$react_jsx_runtime0.JSX.Element;
 //#endregion
 //#region src/hooks/createQueryBoundary.d.ts
-interface DefaultQueryBoundaryComponents<DataType> {
-  Context: typeof QueryBoundaryProvider<DataType>;
-  Error: typeof QueryBoundaryError;
-  Data: typeof QueryBoundaryData<DataType>;
-  DataMap: typeof QueryBoundaryDataMap<DataType>;
-  Fallback: typeof QueryBoundaryFallback;
-  Nullable: typeof QueryBoundaryNullable;
-}
 interface QueryBase {
   /** The current loading status (true if loading, false if not) */
   isLoading?: boolean;
@@ -874,6 +868,16 @@ type Query<DataType> = QuerySingle<DataType> | QueryMultiple<DataType>;
 interface CreateQueryBoundaryParameters<DataType> {
   query: Query<DataType>;
 }
+interface DefaultQueryBoundaryComponents<DataType> {
+  Context: (props: {
+    children: ReactNode;
+  }) => JSX.Element;
+  Error: typeof QueryBoundaryError;
+  Data: typeof QueryBoundaryData<DataType>;
+  DataMap: typeof QueryBoundaryDataMap<DataType>;
+  Fallback: typeof QueryBoundaryFallback;
+  Nullable: typeof QueryBoundaryNullable;
+}
 /** A creator function to create a system of QueryBoundary components with the data fully typed throughout. */
 declare function createQueryBoundary<DataType>({
   query

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 x,MdArrowDropUp as te,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 pe from"@mui/material/List";import me from"@mui/material/ListItem";import he from"@mui/material/ListItemText";import ge from"@mui/material/Tooltip";import _e from"@mui/material/Switch";import{DataError as E}from"@alextheman/utility/v6";import D from"@mui/material/CssBaseline";import O from"@mui/material/CircularProgress";import k from"@mui/material/Alert";import{fillArray as ve,truncate as A,wait as ye}from"@alextheman/utility";import be from"@mui/material/Snackbar";import xe from"@mui/material/BottomNavigation";import Se from"@mui/material/BottomNavigationAction";import Ce from"@mui/material/Paper";import{Link as j,useLocation as we}from"react-router-dom";import{stripIndent as Te}from"common-tags";import{LiveEditor as Ee,LiveError as De,LivePreview as Oe,LiveProvider as ke}from"react-live";import Ae from"@mui/material/Skeleton";import je from"@mui/material/TableCell";import Me from"@mui/material/TableRow";import M from"@mui/material/Menu";import Ne from"@mui/material/AppBar";import Pe from"@mui/material/Drawer";import N from"@mui/material/ListItemButton";import Fe from"@mui/material/ListItemIcon";import Ie from"@mui/material/Toolbar";import P from"@mui/material/MenuItem";import Le from"@mui/material/Popover";import{useFormContext as Re}from"react-hook-form";function F({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 ze(){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 Be(){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(F,{containerLabel:`You`,chipLabels:[`state`,`context`,`input`,`event`,`focus`,`value`,`history`]}),l(ze,{}),l(F,{containerLabel:`I`,chipLabels:[`render`,`effect`,`response`,`update`,`history`,`layout`,`provider`]})]})})]})}function Ve({isInitiallyOpen:t,onOpen:n,onClose:r,children:i,buttonStyles:a,buttonContents:o,buttonComponent:s=d,collapseProps:c,openIcon:p=l(te,{}),closedIcon:m=l(x,{}),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 I({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 He={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`},Ue=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}),We=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 L({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(Ue,{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(We,{$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 Ge({files:t,setFiles:n,multiple:r=!0,...i}){function a(e){n(t=>[...t,...e])}return u(e,{children:[l(L,{...i,multiple:r,onFileInput:a}),l(pe,{children:t.map(e=>l(me,{secondaryAction:l(T,{"aria-label":`Delete`,edge:`end`,onClick:()=>{n(t=>t.filter(t=>t!==e))},children:l(ae,{})}),children:l(he,{primary:e.name})},`${e.name}-${e.lastModified}`))})]})}const Ke=w(_e)(()=>({padding:8,"& .MuiSwitch-track":{borderRadius:11,"&::before, &::after":{content:`""`,position:`absolute`,top:`50%`,transform:`translateY(-50%)`,fontSize:16,width:28,height:28}}}));function R({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(Ke,{checkedIcon:l(e,{sx:o,children:l(t,{style:{...s,...n}})}),icon:l(e,{sx:o,children:l(r,{style:{...s,...i}})}),...a})}const z=m({toggleMode:()=>{},mode:`dark`});function B({strict:e=!0}={}){let t=g(z);if(e&&!t)throw new E({strict:e,context:t},`MODE_PROVIDER_NOT_FOUND`,`Could not find the ModeProvider context. Please double-check that it is present.`);return t}function qe({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(z.Provider,{value:{mode:n,toggleMode:()=>{r(e=>e===`light`?`dark`:`light`)}},children:u(ue,{theme:i,children:[l(D,{}),e]})})}const V=m(void 0);function H({strict:e=!0}={}){let t=g(V);if(e&&!t)throw new E({strict:e,context:t},`QUERY_BOUNDARY_PROVIDER_NOT_FOUND`,`Could not find the QueryBoundaryProvider context. Please double-check that it is present.`);return t}function Je({children:e,loadingComponent:t=l(O,{}),...n}){return l(V.Provider,{value:{loadingComponent:t,...n},children:e})}function U({children:e,dataParser:t,loadingComponent:n}){let{isLoading:r,data:i,dataParser:a,loadingComponent:o,error:s}=H(),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 W({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}=H(),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 E({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 G({children:e,logError:t}){let{data:n,error:r,errorComponent:i,logError:a}=H(),o=t??a,s=ee(!1),u=e??i;return r?(o&&!s.current&&(n!=null&&console.error(`An error has occurred but data is still present. This may indicate an invalid query state.`,{data:n,error:r}),console.error(r),s.current=!0),typeof u==`function`?u(r):u?l(c,{children:u}):l(k,{severity:`error`,children:typeof r==`object`&&`message`in r&&typeof r.message==`string`?r.message:`An unknown error has occured. Please try again later.`})):null}function K({undefinedComponent:e,nullComponent:t,nullableComponent:n}){let{isLoading:r,data:i,error:a}=H();return r||a?null:i==null?n?l(c,{children:n}):i===void 0&&e?l(c,{children:e}):i===null&&t?l(c,{children:t}):l(k,{severity:`error`,children:`Failed to load data. Please try again later.`}):null}function q({errorComponent:e,logError:t,...n}){return u(c,{children:[l(G,{logError:t,children:e}),l(K,{...n})]})}var J=Je;const Ye=m({windowWidth:0,windowHeight:0,isLargeScreen:!1});function Xe({strict:e=!0}={}){let t=g(Ye);if(e&&!t)throw new E({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 Ze({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(Ye.Provider,{value:{isLargeScreen:s,windowWidth:r,windowHeight:a},children:e})}const Qe=m(void 0);function $e({strict:e=!0}={}){let t=g(Qe);if(e&&!t)throw new E({strict:e,context:t},`SNACKBAR_PROVIDER_NOT_FOUND`,`Could not find the SnackbarProvider context. Please double-check that it is present.`);return t}function et({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 ye(.2),s(``)}return u(Qe.Provider,{value:{addSnackbar:f},children:[l(be,{open:n,autoHideDuration:i,onClose:p,children:l(k,{onClose:p,severity:c,children:o})}),e]})}function tt(){let{mode:e,toggleMode:t}=B(),n=e===`dark`,r=`Enable ${n?`light`:`dark`} mode`;return l(ge,{title:r,children:l(R,{uncheckedIcon:ce,checkedIcon:se,checked:n,onChange:t,"aria-label":r})})}function nt({children:t,navItems:n}){let[r,i]=b(``);return u(c,{children:[l(e,{sx:{paddingBottom:7},children:t}),l(Ce,{sx:{position:`fixed`,bottom:0,left:0,right:0},children:l(xe,{showLabels:!0,value:r,onChange:(e,t)=>{i(t)},children:n.map(e=>l(Se,{...e,component:j},e.value))})})]})}function rt({title:e,subtitle:i,action:o,children:d,tabs:f,disablePadding:p}){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}),f,l(a,{}),p?d:l(n,{children:d})]})}function it({loadingComponent:e,undefinedComponent:t,nullComponent:n,nullableComponent:r,logError:i,errorComponent:a,children:o,isLoading:s,error:c,data:d,...f}){let p=l(q,{logError:i,errorComponent:a});return r?p=l(q,{nullableComponent:r,logError:i,errorComponent:a}):(t||n)&&(p=l(q,{undefinedComponent:t,nullComponent:n,logError:i,errorComponent:a})),u(J,{loadingComponent:e,isLoading:s,error:c,data:d,children:[p,l(W,{...f,children:o})]})}function at({query:e}){return{Context:({children:t,...n})=>l(J,{isLoading:e.isLoading,error:e.error,data:e.data??e.dataCollection,...n,children:t}),Error:G,Data:U,DataMap:W,Fallback:q,Nullable:K}}function ot(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])]}function Y({children:e,errorComponent:t,undefinedComponent:n,nullComponent:r,nullableComponent:i,logError:a,loadingComponent:o=l(O,{}),isLoading:s,error:c,data:d,...f}){let p=at({query:{isLoading:s,error:c,data:d}}),m=l(p.Fallback,{logError:a,errorComponent:t});return i?m=l(p.Fallback,{nullableComponent:i,logError:a,errorComponent:t}):(n||r)&&(m=l(p.Fallback,{undefinedComponent:n,nullComponent:r,logError:a,errorComponent:t})),u(p.Context,{loadingComponent:o,...f,children:[m,l(p.Data,{children:e})]})}function st({code:t,previewStyles:n,...r}){let{mode:i}=B(),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(ke,{...r,code:Te(t??``),children:[l(s,{variant:`h5`,children:`Code`}),l(e,{sx:{border:.3,borderRadius:.3,borderColor:`darkgray`},children:l(Ee,{})}),l(`br`,{}),l(s,{variant:`h5`,children:`Result`}),u(e,{sx:o,children:[l(Oe,{}),l(De,{})]})]})})}function ct({columns:e}){return l(Me,{children:ve(e=>l(je,{children:l(Ae,{})},e),e)})}const lt=tt;function ut({children:t,button:n=C,buttonChildren:r=`Menu`,buttonProps:i,isOpenIcon:a=l(te,{}),isClosedIcon:o=l(x,{}),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(M,{id:`dropdown-menu`,anchorEl:d,open:p,onClose:()=>{f(null)},children:typeof t==`function`?l(e,{children:t(()=>{f(null)})}):t})]})}const dt=m(void 0);function X({strict:e=!0}={}){let t=g(dt);if(e&&!t)throw new E({strict:e,context:t},`DROPDOWN_MENU_NOT_FOUND`,`Could not find the DropdownMenu context. Please double-check that it is present.`);return t}function ft({strict:e=!0}={}){return X({strict:e})}function pt({children:e,onClose:t,...n}){let{anchorElement:r,isDropdownOpen:i,closeMenu:a}=ft();return l(M,{anchorEl:r,open:i,onClose:(e,n)=>{e.defaultPrevented||a(),t&&t(e,n)},...n,children:e})}function mt({component:e,children:t,ref:n,onClick:r,...i}){let{closeMenu:a}=X();return l(P,{component:e,ref:n,...i,onClick:e=>{r&&r(e),!e.defaultPrevented&&a()},children:t})}const Z=X,ht=pt,gt=mt;var _t=ht;function vt({ref:e,href:t,children:n,onClick:r,...i}){let{closeMenu:a}=Z();return l(P,{component:I,href:t,ref:e,...i,onClick:e=>{e.defaultPrevented||a(),r&&r(e)},children:n})}function Q({to:e,component:t=j,children:n,ref:r,...i}){return l(S,{component:t,to:e,ref:r,...i,children:n})}function yt({to:e,ref:t,children:n,onClick:r,...i}){let{closeMenu:a}=Z();return l(P,{component:Q,to:e,ref:t,...i,onClick:e=>{e.defaultPrevented||a(),r&&r(e)},children:n})}function bt({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(Le,{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 xt({children:e,...t}){return l(N,{component:Q,...t,children:e})}const St=Y,Ct=U,wt=q,Tt=J;function Et(e){return{width:240,transition:e.transitions.create(`width`,{easing:e.transitions.easing.sharp,duration:e.transitions.duration.enteringScreen}),overflowX:`hidden`}}function Dt(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 $=w(`div`)(({theme:e})=>({display:`flex`,alignItems:`center`,justifyContent:`flex-end`,padding:e.spacing(0,1),...e.mixins.toolbar})),Ot=w(Ne,{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})}}]})),kt=w(Pe,{shouldForwardProp:e=>e!==`open`})(({theme:e})=>({width:240,flexShrink:0,whiteSpace:`nowrap`,boxSizing:`border-box`,variants:[{props:({open:e})=>e,style:{...Et(e),"& .MuiDrawer-paper":Et(e)}},{props:({open:e})=>!e,style:{...Dt(e),"& .MuiDrawer-paper":Dt(e)}}]}));function At({title:t,navItems:n,children:r,headerElements:i}){let o=fe(),[c,d]=b(!0),f=we();function m(){d(!0)}function h(){d(!1)}return u(e,{sx:{display:`flex`},children:[l(D,{}),l(Ot,{position:`fixed`,open:c,children:u(Ie,{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(kt,{variant:`permanent`,open:c,children:[l($,{children:l(T,{onClick:h,children:o.direction===`rtl`?l(re,{}):l(ne,{})})}),l(a,{}),n.map(e=>u(p,{children:[u(pe,{children:[l(s,{variant:c?`h5`:`h6`,sx:{paddingLeft:c?2:1},children:c?e.category:A(e.category,4)}),e.options.map(e=>l(me,{disablePadding:!0,sx:{display:`block`},children:u(N,{sx:[{minHeight:48,px:2.5},c?{justifyContent:`initial`}:{justifyContent:`center`}],component:j,to:e.to,selected:f.pathname===e.to,children:[l(Fe,{sx:[{minWidth:0,justifyContent:`center`},c?{mr:3}:{mr:`auto`}],children:e.icon?e.icon:c?null:l(s,{children:A(e.label,4)})}),l(he,{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($,{}),r]})]})}function jt({text:e,sx:t,...n}){return l(c,{children:e.split(`
-`).map((e,r)=>l(s,{sx:{margin:1,...t},...n,children:e},r))})}const Mt=Y;function Nt({disableClean:e,label:t,...n}){let{formState:{disabled:r,isDirty:i,isSubmitting:a}}=Re();return l(C,{color:`primary`,disabled:n.disabled||e&&!i||r,loading:a,type:`submit`,variant:`contained`,...n,children:t})}export{Be as Artwork,Ve as CollapsableItem,lt as DarkModeToggle,ut as DropdownMenu,_t as DropdownMenu2,vt as DropdownMenuExternalLink,yt as DropdownMenuInternalLink,gt as DropdownMenuItem,I as ExternalLink,L as FileInput,Ge as FileInputList,He as FileType,bt as IconWithPopover,Q as InternalLink,xt as ListItemInternalLink,St as Loader,Ct as LoaderData,wt as LoaderError,Tt as LoaderProvider,qe as ModeProvider,tt as ModeToggle,nt as NavigationBottom,At as NavigationDrawer,rt as Page,jt as PopoverText,Mt as QueryBoundary,U as QueryBoundaryData,W as QueryBoundaryDataMap,G as QueryBoundaryError,q as QueryBoundaryFallback,it as QueryBoundaryMap,K as QueryBoundaryNullable,J as QueryBoundaryProvider,Y as QueryBoundaryWrapper,st as ReactPlayground,Ze as ScreenSizeProvider,ct as SkeletonRow,et as SnackbarProvider,Nt as SubmitButton,R as SwitchWithIcons,at as createQueryBoundary,Z as useDropdownMenu,ot as useHash,B as useMode,Xe as useScreenSize,$e 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 ne,MdChevronLeft as re,MdChevronRight as ie,MdCloudUpload as ae,MdDelete as oe,MdMenu as se,MdOutlineDarkMode as ce,MdOutlineLightMode as le,MdVisibility as ue}from"react-icons/md";import x 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 me from"@mui/material/List";import he from"@mui/material/ListItem";import ge from"@mui/material/ListItemText";import _e from"@mui/material/Tooltip";import ve from"@mui/material/Switch";import{DataError as T}from"@alextheman/utility/v6";import E from"@mui/material/CssBaseline";import D from"@mui/material/CircularProgress";import O from"@mui/material/Alert";import{fillArray as ye,truncate as k,wait as be}from"@alextheman/utility";import xe from"@mui/material/Snackbar";import Se from"@mui/material/BottomNavigation";import Ce from"@mui/material/BottomNavigationAction";import we from"@mui/material/Paper";import{Link as A,useLocation as Te}from"react-router-dom";import{stripIndent as Ee}from"common-tags";import{LiveEditor as De,LiveError as Oe,LivePreview as ke,LiveProvider as Ae}from"react-live";import je from"@mui/material/Skeleton";import Me from"@mui/material/TableCell";import Ne from"@mui/material/TableRow";import j from"@mui/material/Menu";import Pe from"@mui/material/AppBar";import Fe from"@mui/material/Drawer";import M from"@mui/material/ListItemButton";import Ie from"@mui/material/ListItemIcon";import Le from"@mui/material/Toolbar";import N from"@mui/material/MenuItem";import Re from"@mui/material/Popover";import{useFormContext as ze}from"react-hook-form";function P({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 Be(){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 Ve(){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(P,{containerLabel:`You`,chipLabels:[`state`,`context`,`input`,`event`,`focus`,`value`,`history`]}),l(Be,{}),l(P,{containerLabel:`I`,chipLabels:[`render`,`effect`,`response`,`update`,`history`,`layout`,`provider`]})]})})]})}function He({isInitiallyOpen:t,onOpen:n,onClose:r,children:i,buttonStyles:a,buttonContents:o,buttonComponent:s=d,collapseProps:c,openIcon:p=l(ne,{}),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 F({href:e,children:t,ref:n,...r}){return l(x,{component:`a`,href:e,ref:n,target:`_blank`,rel:`noopener noreferrer`,...r,children:t})}const Ue={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`},We=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}),Ge=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 I({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(ae,{}),children:[t,l(We,{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(Ge,{$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 Ke({files:t,setFiles:n,multiple:r=!0,...i}){function a(e){n(t=>[...t,...e])}return u(e,{children:[l(I,{...i,multiple:r,onFileInput:a}),l(me,{children:t.map(e=>l(he,{secondaryAction:l(w,{"aria-label":`Delete`,edge:`end`,onClick:()=>{n(t=>t.filter(t=>t!==e))},children:l(oe,{})}),children:l(ge,{primary:e.name})},`${e.name}-${e.lastModified}`))})]})}const qe=C(ve)(()=>({padding:8,"& .MuiSwitch-track":{borderRadius:11,"&::before, &::after":{content:`""`,position:`absolute`,top:`50%`,transform:`translateY(-50%)`,fontSize:16,width:28,height:28}}}));function L({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(qe,{checkedIcon:l(e,{sx:o,children:l(t,{style:{...s,...n}})}),icon:l(e,{sx:o,children:l(r,{style:{...s,...i}})}),...a})}const R=m({toggleMode:()=>{},mode:`dark`});function z({strict:e=!0}={}){let t=g(R);if(e&&!t)throw new T({strict:e,context:t},`MODE_PROVIDER_NOT_FOUND`,`Could not find the ModeProvider context. Please double-check that it is present.`);return t}function Je({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(R.Provider,{value:{mode:n,toggleMode:()=>{r(e=>e===`light`?`dark`:`light`)}},children:u(de,{theme:i,children:[l(E,{}),e]})})}const B=m(void 0);function V({strict:e=!0}={}){let t=g(B);if(e&&!t)throw new T({strict:e,context:t},`QUERY_BOUNDARY_PROVIDER_NOT_FOUND`,`Could not find the QueryBoundaryProvider context. Please double-check that it is present.`);return t}function Ye({children:e,loadingComponent:t=l(D,{}),...n}){return l(B.Provider,{value:{loadingComponent:t,...n},children:e})}function H({children:e,dataParser:t,loadingComponent:n}){let{isLoading:r,data:i,dataParser:a,loadingComponent:o,error:s}=V(),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 U({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}=V(),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 T({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 W({children:e,logError:t}){let{data:n,error:r,errorComponent:i,logError:a}=V(),o=t??a,s=ee(!1),u=e??i;return r?(o&&!s.current&&(n!=null&&console.error(`An error has occurred but data is still present. This may indicate an invalid query state.`,{data:n,error:r}),console.error(r),s.current=!0),typeof u==`function`?u(r):u?l(c,{children:u}):l(O,{severity:`error`,children:typeof r==`object`&&`message`in r&&typeof r.message==`string`?r.message:`An unknown error has occured. Please try again later.`})):null}function G({undefinedComponent:e,nullComponent:t,nullableComponent:n}){let{isLoading:r,data:i,error:a}=V();return r||a?null:i==null?n?l(c,{children:n}):i===void 0&&e?l(c,{children:e}):i===null&&t?l(c,{children:t}):l(O,{severity:`error`,children:`Failed to load data. Please try again later.`}):null}function K({errorComponent:e,logError:t,...n}){return u(c,{children:[l(W,{logError:t,children:e}),l(G,{...n})]})}var q=Ye;const Xe=m({windowWidth:0,windowHeight:0,isLargeScreen:!1});function Ze({strict:e=!0}={}){let t=g(Xe);if(e&&!t)throw new T({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(Xe.Provider,{value:{isLargeScreen:s,windowWidth:r,windowHeight:a},children:e})}const $e=m(void 0);function et({strict:e=!0}={}){let t=g($e);if(e&&!t)throw new T({strict:e,context:t},`SNACKBAR_PROVIDER_NOT_FOUND`,`Could not find the SnackbarProvider context. Please double-check that it is present.`);return t}function tt({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 be(.2),s(``)}return u($e.Provider,{value:{addSnackbar:f},children:[l(xe,{open:n,autoHideDuration:i,onClose:p,children:l(O,{onClose:p,severity:c,children:o})}),e]})}function nt(){let{mode:e,toggleMode:t}=z(),n=e===`dark`,r=`Enable ${n?`light`:`dark`} mode`;return l(_e,{title:r,children:l(L,{uncheckedIcon:le,checkedIcon:ce,checked:n,onChange:t,"aria-label":r})})}function rt({children:t,navItems:n}){let[r,i]=b(``);return u(c,{children:[l(e,{sx:{paddingBottom:7},children:t}),l(we,{sx:{position:`fixed`,bottom:0,left:0,right:0},children:l(Se,{showLabels:!0,value:r,onChange:(e,t)=>{i(t)},children:n.map(e=>l(Ce,{...e,component:A},e.value))})})]})}function it({title:e,subtitle:i,action:o,children:d,tabs:f,disablePadding:p}){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}),f,l(a,{}),p?d:l(n,{children:d})]})}function J({query:e}){return{Context:({children:t})=>l(q,{isLoading:e.isLoading,error:e.error,data:e.data??e.dataCollection,children:t}),Error:W,Data:H,DataMap:U,Fallback:K,Nullable:G}}function at(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])]}function ot({loadingComponent:e,undefinedComponent:t,nullComponent:n,nullableComponent:r,logError:i,errorComponent:a,children:o,isLoading:s,error:c,data:d,dataParser:f,itemParser:p,itemKey:m}){let h=J({query:{isLoading:s,error:c,dataCollection:d}}),g=l(h.Fallback,{logError:i,errorComponent:a});r?g=l(h.Fallback,{nullableComponent:r,logError:i,errorComponent:a}):(t||n)&&(g=l(h.Fallback,{undefinedComponent:t,nullComponent:n,logError:i,errorComponent:a}));let _=l(h.DataMap,{loadingComponent:e,itemKey:m,children:o});return f?_=l(h.DataMap,{loadingComponent:e,itemKey:m,dataParser:f,children:o}):p&&(_=l(h.DataMap,{loadingComponent:e,itemKey:m,itemParser:p,children:o})),u(h.Context,{children:[g,_]})}function Y({children:e,errorComponent:t,undefinedComponent:n,nullComponent:r,nullableComponent:i,logError:a,loadingComponent:o=l(D,{}),isLoading:s,error:c,data:d,dataParser:f}){let p=J({query:{isLoading:s,error:c,data:d}}),m=l(p.Fallback,{logError:a,errorComponent:t});return i?m=l(p.Fallback,{nullableComponent:i,logError:a,errorComponent:t}):(n||r)&&(m=l(p.Fallback,{undefinedComponent:n,nullComponent:r,logError:a,errorComponent:t})),u(p.Context,{children:[m,l(p.Data,{loadingComponent:o,dataParser:f,children:e})]})}function st({code:t,previewStyles:n,...r}){let{mode:i}=z(),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(Ae,{...r,code:Ee(t??``),children:[l(s,{variant:`h5`,children:`Code`}),l(e,{sx:{border:.3,borderRadius:.3,borderColor:`darkgray`},children:l(De,{})}),l(`br`,{}),l(s,{variant:`h5`,children:`Result`}),u(e,{sx:o,children:[l(ke,{}),l(Oe,{})]})]})})}function ct({columns:e}){return l(Ne,{children:ye(e=>l(Me,{children:l(je,{})},e),e)})}const lt=nt;function ut({children:t,button:n=S,buttonChildren:r=`Menu`,buttonProps:i,isOpenIcon:a=l(ne,{}),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(j,{id:`dropdown-menu`,anchorEl:d,open:p,onClose:()=>{f(null)},children:typeof t==`function`?l(e,{children:t(()=>{f(null)})}):t})]})}const dt=m(void 0);function X({strict:e=!0}={}){let t=g(dt);if(e&&!t)throw new T({strict:e,context:t},`DROPDOWN_MENU_NOT_FOUND`,`Could not find the DropdownMenu context. Please double-check that it is present.`);return t}function ft({strict:e=!0}={}){return X({strict:e})}function pt({children:e,onClose:t,...n}){let{anchorElement:r,isDropdownOpen:i,closeMenu:a}=ft();return l(j,{anchorEl:r,open:i,onClose:(e,n)=>{e.defaultPrevented||a(),t&&t(e,n)},...n,children:e})}function mt({component:e,children:t,ref:n,onClick:r,...i}){let{closeMenu:a}=X();return l(N,{component:e,ref:n,...i,onClick:e=>{r&&r(e),!e.defaultPrevented&&a()},children:t})}const Z=X,ht=pt,gt=mt;var _t=ht;function vt({ref:e,href:t,children:n,onClick:r,...i}){let{closeMenu:a}=Z();return l(N,{component:F,href:t,ref:e,...i,onClick:e=>{e.defaultPrevented||a(),r&&r(e)},children:n})}function Q({to:e,component:t=A,children:n,ref:r,...i}){return l(x,{component:t,to:e,ref:r,...i,children:n})}function yt({to:e,ref:t,children:n,onClick:r,...i}){let{closeMenu:a}=Z();return l(N,{component:Q,to:e,ref:t,...i,onClick:e=>{e.defaultPrevented||a(),r&&r(e)},children:n})}function bt({icon:t=ue,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(Re,{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 xt({children:e,...t}){return l(M,{component:Q,...t,children:e})}const St=Y,Ct=H,wt=K,Tt=q;function Et(e){return{width:240,transition:e.transitions.create(`width`,{easing:e.transitions.easing.sharp,duration:e.transitions.duration.enteringScreen}),overflowX:`hidden`}}function Dt(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 $=C(`div`)(({theme:e})=>({display:`flex`,alignItems:`center`,justifyContent:`flex-end`,padding:e.spacing(0,1),...e.mixins.toolbar})),Ot=C(Pe,{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})}}]})),kt=C(Fe,{shouldForwardProp:e=>e!==`open`})(({theme:e})=>({width:240,flexShrink:0,whiteSpace:`nowrap`,boxSizing:`border-box`,variants:[{props:({open:e})=>e,style:{...Et(e),"& .MuiDrawer-paper":Et(e)}},{props:({open:e})=>!e,style:{...Dt(e),"& .MuiDrawer-paper":Dt(e)}}]}));function At({title:t,navItems:n,children:r,headerElements:i}){let o=pe(),[c,d]=b(!0),f=Te();function m(){d(!0)}function h(){d(!1)}return u(e,{sx:{display:`flex`},children:[l(E,{}),l(Ot,{position:`fixed`,open:c,children:u(Le,{children:[l(w,{color:`inherit`,"aria-label":`open drawer`,onClick:m,edge:`start`,sx:[{marginRight:5},c&&{display:`none`}],children:l(se,{})}),l(s,{variant:`h6`,noWrap:!0,component:`div`,children:t}),i]})}),u(kt,{variant:`permanent`,open:c,children:[l($,{children:l(w,{onClick:h,children:o.direction===`rtl`?l(ie,{}):l(re,{})})}),l(a,{}),n.map(e=>u(p,{children:[u(me,{children:[l(s,{variant:c?`h5`:`h6`,sx:{paddingLeft:c?2:1},children:c?e.category:k(e.category,4)}),e.options.map(e=>l(he,{disablePadding:!0,sx:{display:`block`},children:u(M,{sx:[{minHeight:48,px:2.5},c?{justifyContent:`initial`}:{justifyContent:`center`}],component:A,to:e.to,selected:f.pathname===e.to,children:[l(Ie,{sx:[{minWidth:0,justifyContent:`center`},c?{mr:3}:{mr:`auto`}],children:e.icon?e.icon:c?null:l(s,{children:k(e.label,4)})}),l(ge,{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($,{}),r]})]})}function jt({text:e,sx:t,...n}){return l(c,{children:e.split(`
+`).map((e,r)=>l(s,{sx:{margin:1,...t},...n,children:e},r))})}const Mt=Y;function Nt({disableClean:e,label:t,...n}){let{formState:{disabled:r,isDirty:i,isSubmitting:a}}=ze();return l(S,{color:`primary`,disabled:n.disabled||e&&!i||r,loading:a,type:`submit`,variant:`contained`,...n,children:t})}export{Ve as Artwork,He as CollapsableItem,lt as DarkModeToggle,ut as DropdownMenu,_t as DropdownMenu2,vt as DropdownMenuExternalLink,yt as DropdownMenuInternalLink,gt as DropdownMenuItem,F as ExternalLink,I as FileInput,Ke as FileInputList,Ue as FileType,bt as IconWithPopover,Q as InternalLink,xt as ListItemInternalLink,St as Loader,Ct as LoaderData,wt as LoaderError,Tt as LoaderProvider,Je as ModeProvider,nt as ModeToggle,rt as NavigationBottom,At as NavigationDrawer,it as Page,jt as PopoverText,Mt as QueryBoundary,H as QueryBoundaryData,U as QueryBoundaryDataMap,W as QueryBoundaryError,K as QueryBoundaryFallback,ot as QueryBoundaryMap,G as QueryBoundaryNullable,q as QueryBoundaryProvider,Y as QueryBoundaryWrapper,st as ReactPlayground,Qe as ScreenSizeProvider,ct as SkeletonRow,tt as SnackbarProvider,Nt as SubmitButton,L as SwitchWithIcons,J as createQueryBoundary,Z as useDropdownMenu,at as useHash,z as useMode,Ze as useScreenSize,et as useSnackbar};
 //# sourceMappingURL=index.js.map