@alextheman/components 5.2.0 → 5.3.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (7) hide show
  1. package/dist/index.cjs +2 -2
  2. package/dist/index.cjs.map +1 -1
  3. package/dist/index.d.cts +41 -12
  4. package/dist/index.d.ts +41 -12
  5. package/dist/index.js +2 -2
  6. package/dist/index.js.map +1 -1
  7. package/package.json +2 -2
package/dist/index.d.cts CHANGED
@@ -8,7 +8,6 @@ import { LinkProps } from '@mui/material/Link';
8
8
  import { OverridableComponent, CommonProps } from '@mui/material/OverridableComponent';
9
9
  import { SvgIconTypeMap } from '@mui/material/SvgIcon';
10
10
  import { ListItemButtonProps } from '@mui/material/ListItemButton';
11
- import { DisallowUndefined } from '@alextheman/utility';
12
11
  import { TypographyProps } from '@mui/material/Typography';
13
12
  import { SwitchProps } from '@mui/material/Switch';
14
13
  import { AlertColor } from '@mui/material/Alert';
@@ -101,9 +100,13 @@ interface ListItemInternalLinkProps extends Omit<ListItemButtonProps, "href"> {
101
100
  declare function ListItemInternalLink({ children, ...listItemButtonProps }: ListItemInternalLinkProps): react_jsx_runtime.JSX.Element;
102
101
 
103
102
  interface LoaderProviderBaseProps<T> {
103
+ /** The component to show when the data is being fetched. */
104
104
  isLoading: boolean;
105
+ /** The data being loaded. */
105
106
  data?: T;
106
- dataParser?: (data: unknown) => T;
107
+ /** A parser for the data. */
108
+ dataParser?: (data: unknown) => NonNullable<T>;
109
+ /** The component to show when loading. */
107
110
  loadingComponent?: ReactNode;
108
111
  }
109
112
  interface LoaderProviderPropsWithNoError<T> extends LoaderProviderBaseProps<T> {
@@ -111,7 +114,9 @@ interface LoaderProviderPropsWithNoError<T> extends LoaderProviderBaseProps<T> {
111
114
  errorComponent?: never;
112
115
  }
113
116
  interface LoaderProviderPropsWithError<T> extends LoaderProviderBaseProps<T> {
117
+ /** The error given if the request gave an error. */
114
118
  error: unknown;
119
+ /** The component to show if an error has been thrown. Note that this may not be provided unless the error prop has also been provided. */
115
120
  errorComponent?: ReactNode | ((error: unknown) => ReactNode);
116
121
  }
117
122
  type LoaderContextValue<T> = LoaderProviderPropsWithNoError<T> | LoaderProviderPropsWithError<T>;
@@ -119,17 +124,41 @@ type LoaderProviderProps<T> = LoaderContextValue<T> & {
119
124
  children: ReactNode;
120
125
  };
121
126
  declare function useLoader<T>(): LoaderContextValue<T>;
127
+ /** A provider for a context that deals with state management when fetching data from an API.
128
+ * This may be used over Loader if you require more control over the placement of the error message and data display.
129
+ */
122
130
  declare function LoaderProvider<T>({ children, loadingComponent, ...contextProps }: LoaderProviderProps<T>): react_jsx_runtime.JSX.Element;
123
131
 
124
- interface LoaderDataProps<T> {
125
- children: ReactNode | ((data: DisallowUndefined<T>) => ReactNode);
126
- dataParser?: (data: unknown) => T;
132
+ interface LoaderDataBaseProps<T> {
133
+ /** The elements to show after data has been loaded.
134
+ * This is best provided as a function with a data argument that guarantees the data will not be undefined by the time you receive it here.
135
+ */
136
+ children: ReactNode | ((data: NonNullable<T>) => ReactNode);
137
+ /** A parser for the data. */
138
+ dataParser?: (data: unknown) => NonNullable<T>;
139
+ /** The component to show when the data is being fetched. */
127
140
  loadingComponent?: ReactNode;
128
- onUndefined?: () => ReactNode | void;
141
+ /** An option to show the children of this component if an error has been thrown. */
129
142
  showOnError?: boolean;
130
143
  }
131
- declare function LoaderData<T>({ children, dataParser: loaderDataParser, loadingComponent, onUndefined, showOnError, }: LoaderDataProps<T>): string | number | bigint | boolean | Iterable<ReactNode> | Promise<string | number | bigint | boolean | react.ReactPortal | react.ReactElement<unknown, string | react.JSXElementConstructor<any>> | Iterable<ReactNode> | null | undefined> | react_jsx_runtime.JSX.Element;
144
+ interface LoaderDataPropsOnNullable<T> extends LoaderDataBaseProps<T> {
145
+ onUndefined?: never;
146
+ onNull?: never;
147
+ /** A function to run if the data is undefined or null, and not loading. This may either return React components or nothing. */
148
+ onNullable: () => ReactNode | void;
149
+ }
150
+ interface LoaderDataPropsOnUndefinedOrNull<T> extends LoaderDataBaseProps<T> {
151
+ /** A function to run if the data is undefined and not loading. This may either return React components or nothing. */
152
+ onUndefined?: () => ReactNode | void;
153
+ /** A function to run if the data is null and not loading. This may either return React components or nothing. */
154
+ onNull?: () => ReactNode | void;
155
+ onNullable?: never;
156
+ }
157
+ type LoaderDataProps<T> = LoaderDataPropsOnUndefinedOrNull<T> | LoaderDataPropsOnNullable<T>;
158
+ /** The component responsible for showing the data provided by LoaderProvider. */
159
+ declare function LoaderData<T>({ children, dataParser: loaderDataParser, loadingComponent, onNullable, onUndefined, onNull, showOnError, }: LoaderDataProps<T>): string | number | bigint | boolean | Iterable<ReactNode> | Promise<string | number | bigint | boolean | react.ReactPortal | react.ReactElement<unknown, string | react.JSXElementConstructor<any>> | Iterable<ReactNode> | null | undefined> | react_jsx_runtime.JSX.Element;
132
160
 
161
+ /** The component responsible for showing any errors provided by LoaderProvider. */
133
162
  declare function LoaderError(): string | number | bigint | boolean | Iterable<react.ReactNode> | Promise<string | number | bigint | boolean | react.ReactPortal | react.ReactElement<unknown, string | react.JSXElementConstructor<any>> | Iterable<react.ReactNode> | null | undefined> | react_jsx_runtime.JSX.Element | null | undefined;
134
163
 
135
164
  declare function useMode(): {
@@ -166,11 +195,11 @@ interface SnackbarContextValue {
166
195
  declare function useSnackbar(): SnackbarContextValue;
167
196
  declare function SnackbarProvider({ children, autoHideDuration }: SnackbarProviderProps): react_jsx_runtime.JSX.Element;
168
197
 
169
- type LoaderProps<T> = Omit<LoaderProviderProps<T>, "children"> & {
170
- children: ReactNode | ((data: DisallowUndefined<T>) => ReactNode);
171
- onUndefined?: () => ReactNode | void;
172
- };
173
- declare function Loader<T>({ children, onUndefined, loadingComponent, ...loaderProviderProps }: LoaderProps<T>): react_jsx_runtime.JSX.Element;
198
+ type LoaderProps<T> = Omit<LoaderProviderProps<T>, "children"> & Omit<LoaderDataProps<T>, "showOnError">;
199
+ /** An in-line component that deals with state management when fetching data from an API.
200
+ * This may be used over LoaderProvider if you don't require as much control over the placement of the error message and data display.
201
+ */
202
+ declare function Loader<T>({ children, onUndefined, onNull, onNullable, loadingComponent, ...loaderProviderProps }: LoaderProps<T>): react_jsx_runtime.JSX.Element;
174
203
 
175
204
  interface NavItemBottom {
176
205
  value: string;
package/dist/index.d.ts CHANGED
@@ -8,7 +8,6 @@ import { LinkProps } from '@mui/material/Link';
8
8
  import { OverridableComponent, CommonProps } from '@mui/material/OverridableComponent';
9
9
  import { SvgIconTypeMap } from '@mui/material/SvgIcon';
10
10
  import { ListItemButtonProps } from '@mui/material/ListItemButton';
11
- import { DisallowUndefined } from '@alextheman/utility';
12
11
  import { TypographyProps } from '@mui/material/Typography';
13
12
  import { SwitchProps } from '@mui/material/Switch';
14
13
  import { AlertColor } from '@mui/material/Alert';
@@ -101,9 +100,13 @@ interface ListItemInternalLinkProps extends Omit<ListItemButtonProps, "href"> {
101
100
  declare function ListItemInternalLink({ children, ...listItemButtonProps }: ListItemInternalLinkProps): react_jsx_runtime.JSX.Element;
102
101
 
103
102
  interface LoaderProviderBaseProps<T> {
103
+ /** The component to show when the data is being fetched. */
104
104
  isLoading: boolean;
105
+ /** The data being loaded. */
105
106
  data?: T;
106
- dataParser?: (data: unknown) => T;
107
+ /** A parser for the data. */
108
+ dataParser?: (data: unknown) => NonNullable<T>;
109
+ /** The component to show when loading. */
107
110
  loadingComponent?: ReactNode;
108
111
  }
109
112
  interface LoaderProviderPropsWithNoError<T> extends LoaderProviderBaseProps<T> {
@@ -111,7 +114,9 @@ interface LoaderProviderPropsWithNoError<T> extends LoaderProviderBaseProps<T> {
111
114
  errorComponent?: never;
112
115
  }
113
116
  interface LoaderProviderPropsWithError<T> extends LoaderProviderBaseProps<T> {
117
+ /** The error given if the request gave an error. */
114
118
  error: unknown;
119
+ /** The component to show if an error has been thrown. Note that this may not be provided unless the error prop has also been provided. */
115
120
  errorComponent?: ReactNode | ((error: unknown) => ReactNode);
116
121
  }
117
122
  type LoaderContextValue<T> = LoaderProviderPropsWithNoError<T> | LoaderProviderPropsWithError<T>;
@@ -119,17 +124,41 @@ type LoaderProviderProps<T> = LoaderContextValue<T> & {
119
124
  children: ReactNode;
120
125
  };
121
126
  declare function useLoader<T>(): LoaderContextValue<T>;
127
+ /** A provider for a context that deals with state management when fetching data from an API.
128
+ * This may be used over Loader if you require more control over the placement of the error message and data display.
129
+ */
122
130
  declare function LoaderProvider<T>({ children, loadingComponent, ...contextProps }: LoaderProviderProps<T>): react_jsx_runtime.JSX.Element;
123
131
 
124
- interface LoaderDataProps<T> {
125
- children: ReactNode | ((data: DisallowUndefined<T>) => ReactNode);
126
- dataParser?: (data: unknown) => T;
132
+ interface LoaderDataBaseProps<T> {
133
+ /** The elements to show after data has been loaded.
134
+ * This is best provided as a function with a data argument that guarantees the data will not be undefined by the time you receive it here.
135
+ */
136
+ children: ReactNode | ((data: NonNullable<T>) => ReactNode);
137
+ /** A parser for the data. */
138
+ dataParser?: (data: unknown) => NonNullable<T>;
139
+ /** The component to show when the data is being fetched. */
127
140
  loadingComponent?: ReactNode;
128
- onUndefined?: () => ReactNode | void;
141
+ /** An option to show the children of this component if an error has been thrown. */
129
142
  showOnError?: boolean;
130
143
  }
131
- declare function LoaderData<T>({ children, dataParser: loaderDataParser, loadingComponent, onUndefined, showOnError, }: LoaderDataProps<T>): string | number | bigint | boolean | Iterable<ReactNode> | Promise<string | number | bigint | boolean | react.ReactPortal | react.ReactElement<unknown, string | react.JSXElementConstructor<any>> | Iterable<ReactNode> | null | undefined> | react_jsx_runtime.JSX.Element;
144
+ interface LoaderDataPropsOnNullable<T> extends LoaderDataBaseProps<T> {
145
+ onUndefined?: never;
146
+ onNull?: never;
147
+ /** A function to run if the data is undefined or null, and not loading. This may either return React components or nothing. */
148
+ onNullable: () => ReactNode | void;
149
+ }
150
+ interface LoaderDataPropsOnUndefinedOrNull<T> extends LoaderDataBaseProps<T> {
151
+ /** A function to run if the data is undefined and not loading. This may either return React components or nothing. */
152
+ onUndefined?: () => ReactNode | void;
153
+ /** A function to run if the data is null and not loading. This may either return React components or nothing. */
154
+ onNull?: () => ReactNode | void;
155
+ onNullable?: never;
156
+ }
157
+ type LoaderDataProps<T> = LoaderDataPropsOnUndefinedOrNull<T> | LoaderDataPropsOnNullable<T>;
158
+ /** The component responsible for showing the data provided by LoaderProvider. */
159
+ declare function LoaderData<T>({ children, dataParser: loaderDataParser, loadingComponent, onNullable, onUndefined, onNull, showOnError, }: LoaderDataProps<T>): string | number | bigint | boolean | Iterable<ReactNode> | Promise<string | number | bigint | boolean | react.ReactPortal | react.ReactElement<unknown, string | react.JSXElementConstructor<any>> | Iterable<ReactNode> | null | undefined> | react_jsx_runtime.JSX.Element;
132
160
 
161
+ /** The component responsible for showing any errors provided by LoaderProvider. */
133
162
  declare function LoaderError(): string | number | bigint | boolean | Iterable<react.ReactNode> | Promise<string | number | bigint | boolean | react.ReactPortal | react.ReactElement<unknown, string | react.JSXElementConstructor<any>> | Iterable<react.ReactNode> | null | undefined> | react_jsx_runtime.JSX.Element | null | undefined;
134
163
 
135
164
  declare function useMode(): {
@@ -166,11 +195,11 @@ interface SnackbarContextValue {
166
195
  declare function useSnackbar(): SnackbarContextValue;
167
196
  declare function SnackbarProvider({ children, autoHideDuration }: SnackbarProviderProps): react_jsx_runtime.JSX.Element;
168
197
 
169
- type LoaderProps<T> = Omit<LoaderProviderProps<T>, "children"> & {
170
- children: ReactNode | ((data: DisallowUndefined<T>) => ReactNode);
171
- onUndefined?: () => ReactNode | void;
172
- };
173
- declare function Loader<T>({ children, onUndefined, loadingComponent, ...loaderProviderProps }: LoaderProps<T>): react_jsx_runtime.JSX.Element;
198
+ type LoaderProps<T> = Omit<LoaderProviderProps<T>, "children"> & Omit<LoaderDataProps<T>, "showOnError">;
199
+ /** An in-line component that deals with state management when fetching data from an API.
200
+ * This may be used over LoaderProvider if you don't require as much control over the placement of the error message and data display.
201
+ */
202
+ declare function Loader<T>({ children, onUndefined, onNull, onNullable, loadingComponent, ...loaderProviderProps }: LoaderProps<T>): react_jsx_runtime.JSX.Element;
174
203
 
175
204
  interface NavItemBottom {
176
205
  value: string;
package/dist/index.js CHANGED
@@ -1,3 +1,3 @@
1
- var Le=Object.defineProperty,Ie=Object.defineProperties;var ke=Object.getOwnPropertyDescriptors;var T=Object.getOwnPropertySymbols;var Y=Object.prototype.hasOwnProperty,q=Object.prototype.propertyIsEnumerable;var K=(e,o,r)=>o in e?Le(e,o,{enumerable:!0,configurable:!0,writable:!0,value:r}):e[o]=r,a=(e,o)=>{for(var r in o||(o={}))Y.call(o,r)&&K(e,r,o[r]);if(T)for(var r of T(o))q.call(o,r)&&K(e,r,o[r]);return e},c=(e,o)=>Ie(e,ke(o));var x=(e,o)=>{var r={};for(var n in e)Y.call(e,n)&&o.indexOf(n)<0&&(r[n]=e[n]);if(e!=null&&T)for(var n of T(e))o.indexOf(n)<0&&q.call(e,n)&&(r[n]=e[n]);return r};var Q=(e,o,r)=>new Promise((n,i)=>{var t=d=>{try{s(r.next(d))}catch(u){i(u)}},p=d=>{try{s(r.throw(d))}catch(u){i(u)}},s=d=>d.done?n(d.value):Promise.resolve(d.value).then(t,p);s((r=r.apply(e,o)).next())});import Ce from"@mui/icons-material/ArrowDropDown";import Te from"@mui/icons-material/ArrowDropUp";import Be from"@mui/material/Box";import M from"@mui/material/ButtonBase";import Re from"@mui/material/Collapse";import{useEffect as Ne,useState as De}from"react";import{jsx as E,jsxs as Z}from"react/jsx-runtime";function Me({isInitiallyOpen:e,onOpen:o,onClose:r,children:n,buttonStyles:i,buttonContents:t,buttonComponent:p=M,collapseProps:s,openIcon:d=E(Te,{}),closedIcon:u=E(Ce,{}),useDefaultStyling:m=p===M}){let[l,f]=De(!!e);return Ne(()=>{l&&o?o():!l&&r&&r()},[l]),Z(Be,{children:[Z(p,{onClick:()=>{f(g=>!g)},sx:m?a({width:"100%",display:"flex",alignItems:"center",justifyContent:"center",paddingY:1.5,paddingX:2,textAlign:"center","&:hover":p===M?{backgroundColor:"action.hover"}:null},i):i,"aria-expanded":l,children:[t,l?d:u]}),E(Re,c(a({in:l},s),{children:n}))]})}var Ee=Me;import xo from"@mui/icons-material/DarkMode";import Po from"@mui/icons-material/LightMode";import go from"@mui/material/IconButton";import yo from"@mui/material/Tooltip";import Ae from"@mui/material/CircularProgress";import{createContext as Oe,useContext as Fe}from"react";import{jsx as j}from"react/jsx-runtime";var ee=Oe(void 0);function L(){let e=Fe(ee);if(!e)throw new Error("LOADER_CONTEXT_NOT_SET");return e}function We(n){var i=n,{children:e,loadingComponent:o=j(Ae,{})}=i,r=x(i,["children","loadingComponent"]);return j(ee.Provider,{value:a({loadingComponent:o},r),children:e})}var A=We;import{useRef as ze}from"react";import{Fragment as h,jsx as v}from"react/jsx-runtime";function Ue({children:e,dataParser:o,loadingComponent:r,onUndefined:n,showOnError:i}){let{isLoading:t,data:p,dataParser:s,loadingComponent:d,error:u}=L(),m=ze(!1),l=o!=null?o:s;if(t)return v(h,{children:r!=null?r:d});if(u&&!i)return v(h,{});if(p===void 0){if(m.current||(console.warn("Data is undefined after loading. This could either be an issue with the query or you have not passed in the data to LoaderProvider. Please double-check that you have provided data."),m.current=!0),n){let f=n();return f!=null?f:v(h,{})}return v(h,{})}return l?typeof e=="function"?v(h,{children:e(l(p))}):v(h,{children:e}):typeof e=="function"?v(h,{children:e(p)}):v(h,{children:e})}var O=Ue;import He from"@mui/material/Alert";import{Fragment as oe,jsx as F}from"react/jsx-runtime";function Ve(){var r;let{error:e,errorComponent:o}=L();return e?typeof o=="function"?o(e):o?F(oe,{children:o}):F(He,{severity:"error",children:(r=e==null?void 0:e.message)!=null?r:"An unknown error has occured. Please try again later."}):F(oe,{})}var W=Ve;import Xe from"@mui/material/CssBaseline";import{createTheme as $e,ThemeProvider as _e}from"@mui/material/styles";import{createContext as Ge,useContext as Je,useMemo as Ke,useState as Ye}from"react";import{jsx as re,jsxs as Ze}from"react/jsx-runtime";var te=Ge({toggleMode:()=>{},mode:"dark"});function I(){return Je(te)}function qe({children:e,mode:o="dark"}){let[r,n]=Ye(o),i=Ke(()=>$e({palette:{mode:r}}),[r]);return re(te.Provider,{value:{mode:r,toggleMode:()=>{n(t=>t==="light"?"dark":"light")}},children:Ze(_e,{theme:i,children:[re(Xe,{}),e]})})}var Qe=qe;import{createContext as je,useContext as eo,useEffect as ne,useState as z}from"react";import{jsx as no}from"react/jsx-runtime";var ie=je({windowWidth:0,windowHeight:0,isLargeScreen:!1});function oo(){return eo(ie)}function ro({children:e,largeScreenWidth:o,largeScreenHeight:r}){let[n,i]=z(window.innerWidth),[t,p]=z(window.innerHeight);function s(m,l,f=669,g=600){return m>f&&l>g}let[d,u]=z(s(window.innerWidth,window.innerHeight,o,r));return ne(()=>{function m(){i(window.innerWidth),p(window.innerHeight)}return m(),window.addEventListener("resize",m),()=>{window.removeEventListener("resize",m)}},[]),ne(()=>{u(s(n,t,o,r))},[n,t,o,r]),no(ie.Provider,{value:{isLargeScreen:d,windowWidth:n,windowHeight:t},children:e})}var to=ro;import{wait as io}from"@alextheman/utility";import ao from"@mui/material/Alert";import po from"@mui/material/Snackbar";import{createContext as so,useContext as mo,useState as B}from"react";import{jsx as ae,jsxs as fo}from"react/jsx-runtime";var pe=so(void 0);function lo(){let e=mo(pe);if(!e)throw new Error("SNACKBAR_CONTEXT_NOT_SET");return e}function co({children:e,autoHideDuration:o=5e3}){let[r,n]=B(!1),[i,t]=B(o),[p,s]=B(""),[d,u]=B("info");function m(f,g,y){n(!0),t(y!=null?y:o),u(g!=null?g:"info"),s(f)}function l(){return Q(this,null,function*(){n(!1),yield io(.2),s("")})}return fo(pe.Provider,{value:{addSnackbar:m},children:[ae(po,{open:r,autoHideDuration:i,onClose:l,children:ae(ao,{onClose:l,severity:d,children:p})}),e]})}var uo=co;import{jsx as R}from"react/jsx-runtime";function ho(){let{mode:e,toggleMode:o}=I();return R(yo,{title:`Enable ${e==="dark"?"light":"dark"} mode`,children:R(go,{sx:{marginLeft:"auto"},onClick:o,"aria-label":`Enable ${e==="dark"?"light":"dark"} mode`,children:e==="dark"?R(Po,{}):R(xo,{})})})}var vo=ho;import wo from"@mui/icons-material/ArrowDropDown";import So from"@mui/icons-material/ArrowDropUp";import se from"@mui/material/Box";import de from"@mui/material/Button";import bo from"@mui/material/Menu";import{useEffect as Lo,useMemo as Io,useState as ko}from"react";import{jsx as k,jsxs as Bo}from"react/jsx-runtime";function Co({children:e,button:o=de,buttonChildren:r="Menu",buttonProps:n,isOpenIcon:i=k(So,{}),isClosedIcon:t=k(wo,{}),onOpen:p,onClose:s}){let[d,u]=ko(null),m=Io(()=>!!d,[d]),l=c(a({},n),{onClick:f=>{u(f.currentTarget)},"aria-controls":m?"dropdown-menu":void 0,"aria-haspopup":"true","aria-expanded":m});return o===de&&(l.endIcon=m?i:t),Lo(()=>{m&&p?p():!m&&s&&s()},[m,p,s]),Bo(se,{children:[k(o,c(a({},l),{children:r})),k(bo,{id:"dropdown-menu",anchorEl:d,open:m,onClose:()=>{u(null)},children:typeof e=="function"?k(se,{children:e(()=>{u(null)})}):e})]})}var To=Co;import Ro from"@mui/material/Link";import{jsx as Mo}from"react/jsx-runtime";function No(n){var i=n,{href:e,children:o}=i,r=x(i,["href","children"]);return Mo(Ro,c(a({component:"a",href:e,target:"_blank",rel:"noopener noreferrer"},r),{children:o}))}var Do=No;import Eo from"@mui/icons-material/CloudUpload";import Ao from"@mui/material/Button";import{styled as me}from"@mui/material/styles";import{useState as Oo}from"react";import{jsx as U,jsxs as Ho}from"react/jsx-runtime";var Fo={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"},Wo=me("input")({clip:"rect(0 0 0 0)",clipPath:"inset(50%)",height:1,overflow:"hidden",position:"absolute",bottom:0,left:0,whiteSpace:"nowrap",width:1}),zo=me("div")(({theme:e,$dragging:o})=>({border:"2px dashed",borderColor:o?e.palette.primary.main:"#ccc",backgroundColor:o?e.palette.action.hover:"transparent",borderRadius:8,padding:"1.5rem",textAlign:"center",transition:"border-color 0.2s",cursor:"pointer"}));function Uo(p){var s=p,{onFileInput:e,label:o="Upload files",multiple:r,accept:n,useDropzone:i}=s,t=x(s,["onFileInput","label","multiple","accept","useDropzone"]);var l;let[d,u]=Oo(!1),m=Ho(Ao,c(a({variant:"contained",component:"label","aria-label":"File upload button",onKeyDown:f=>{var g;(f.key==="Enter"||f.key===" ")&&(f.preventDefault(),(g=document.getElementById("file-input"))==null||g.click())}},t),{startIcon:(l=t.startIcon)!=null?l:U(Eo,{}),children:[o,U(Wo,{id:"file-input",type:"file",onChange:f=>{var y;let g=f.target;e(Array.from((y=g.files)!=null?y:[])),g.value=""},multiple:r,accept:n==null?void 0:n.join(","),disabled:t.disabled})]}));return i?U(zo,{$dragging:d,onDragOver:f=>{f.preventDefault(),!t.disabled&&u(!0)},onDragLeave:f=>{f.preventDefault(),u(!1)},onDrop:f=>{var y;if(f.preventDefault(),u(!1),t.disabled)return;let g=Array.from((y=f.dataTransfer.files)!=null?y:[]);e(g)},children:m}):m}var H=Uo;import Vo from"@mui/icons-material/Delete";import Xo from"@mui/material/Box";import $o from"@mui/material/IconButton";import _o from"@mui/material/List";import Go from"@mui/material/ListItem";import Jo from"@mui/material/ListItemText";import{jsx as b,jsxs as qo}from"react/jsx-runtime";function Ko(n){var i=n,{files:e,setFiles:o}=i,r=x(i,["files","setFiles"]);function t(s){o(d=>[...d,...s])}let p=c(a({},r),{onFileInput:t});return(p==null?void 0:p.multiple)===void 0&&(p.multiple=!0),qo(Xo,{children:[b(H,a({},p)),b(_o,{children:e.map(s=>b(Go,{secondaryAction:b($o,{"aria-label":"Delete",edge:"end",onClick:()=>{o(d=>d.filter(u=>u!==s))},children:b(Vo,{})}),children:b(Jo,{primary:s.name})},s.name))})]})}var Yo=Ko;import Qo from"@mui/material/Box";import Zo from"@mui/material/Popover";import{useId as jo,useState as er}from"react";import{jsx as le,jsxs as tr}from"react/jsx-runtime";function or({icon:e,onOpen:o,onClose:r,iconProps:n,children:i}){let[t,p]=er(null),s=!!t,d=jo();function u(l){p(l.currentTarget),o&&o()}function m(){p(null),r&&r()}return tr(Qo,{children:[le(e,a({"aria-owns":s?d:void 0,"aria-haspopup":"true",onMouseEnter:u,onMouseLeave:m},n)),le(Zo,{id:d,sx:{pointerEvents:"none"},open:s,anchorEl:t,anchorOrigin:{vertical:"bottom",horizontal:"left"},transformOrigin:{vertical:"top",horizontal:"left"},onClose:m,disableRestoreFocus:!0,children:i})]})}var rr=or;import nr from"@mui/material/Link";import{Link as ir}from"react-router-dom";import{jsx as pr}from"react/jsx-runtime";function ar(n){var i=n,{to:e,children:o}=i,r=x(i,["to","children"]);return pr(nr,c(a({component:ir,to:e},r),{children:o}))}var V=ar;import sr from"@mui/material/ListItemButton";import{jsx as lr}from"react/jsx-runtime";function dr(r){var n=r,{children:e}=n,o=x(n,["children"]);return lr(sr,c(a({component:V},o),{children:e}))}var mr=dr;import cr from"@mui/material/CircularProgress";import{jsx as X,jsxs as xr}from"react/jsx-runtime";function ur(i){var t=i,{children:e,onUndefined:o,loadingComponent:r=X(cr,{})}=t,n=x(t,["children","onUndefined","loadingComponent"]);return xr(A,c(a({loadingComponent:r},n),{children:[X(W,{}),X(O,{onUndefined:o,children:e})]}))}var fr=ur;import Pr from"@mui/material/BottomNavigation";import gr from"@mui/material/BottomNavigationAction";import yr from"@mui/material/Box";import hr from"@mui/material/Paper";import{useState as vr}from"react";import{Link as wr}from"react-router-dom";import{Fragment as Lr,jsx as N,jsxs as Ir}from"react/jsx-runtime";function Sr({children:e,navItems:o}){let[r,n]=vr("");return Ir(Lr,{children:[N(yr,{sx:{paddingBottom:7},children:e}),N(hr,{sx:{position:"fixed",bottom:0,left:0,right:0},children:N(Pr,{showLabels:!0,value:r,onChange:(i,t)=>{n(t)},children:o.map(i=>N(gr,c(a({},i),{component:wr}),i.value))})})]})}var br=Sr;import{truncate as ce}from"@alextheman/utility";import kr from"@mui/icons-material/ChevronLeft";import Cr from"@mui/icons-material/ChevronRight";import Tr from"@mui/icons-material/Menu";import Br from"@mui/material/AppBar";import ue from"@mui/material/Box";import Rr from"@mui/material/CssBaseline";import fe from"@mui/material/Divider";import Nr from"@mui/material/Drawer";import xe from"@mui/material/IconButton";import Dr from"@mui/material/List";import Mr from"@mui/material/ListItem";import Er from"@mui/material/ListItemButton";import Ar from"@mui/material/ListItemIcon";import Or from"@mui/material/ListItemText";import{styled as _,useTheme as Fr}from"@mui/material/styles";import Wr from"@mui/material/Toolbar";import $ from"@mui/material/Typography";import{Fragment as zr,useState as Ur}from"react";import{Link as Hr,useLocation as Vr}from"react-router-dom";import{jsx as P,jsxs as S}from"react/jsx-runtime";var D=240;function Pe(e){return{width:D,transition:e.transitions.create("width",{easing:e.transitions.easing.sharp,duration:e.transitions.duration.enteringScreen}),overflowX:"hidden"}}function ge(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)`}}}var ye=_("div")(({theme:e})=>a({display:"flex",alignItems:"center",justifyContent:"flex-end",padding:e.spacing(0,1)},e.mixins.toolbar)),Xr=_(Br,{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:o})=>o,style:{marginLeft:D,width:`calc(100% - ${D}px)`,transition:e.transitions.create(["width","margin"],{easing:e.transitions.easing.sharp,duration:e.transitions.duration.enteringScreen})}}]})),$r=_(Nr,{shouldForwardProp:e=>e!=="open"})(({theme:e})=>({width:D,flexShrink:0,whiteSpace:"nowrap",boxSizing:"border-box",variants:[{props:({open:o})=>o,style:c(a({},Pe(e)),{"& .MuiDrawer-paper":Pe(e)})},{props:({open:o})=>!o,style:c(a({},ge(e)),{"& .MuiDrawer-paper":ge(e)})}]}));function _r({title:e,navItems:o,children:r,headerElements:n}){let i=Fr(),[t,p]=Ur(!0),s=Vr();function d(){p(!0)}function u(){p(!1)}return S(ue,{sx:{display:"flex"},children:[P(Rr,{}),P(Xr,{position:"fixed",open:t,children:S(Wr,{children:[P(xe,{color:"inherit","aria-label":"open drawer",onClick:d,edge:"start",sx:[{marginRight:5},t&&{display:"none"}],children:P(Tr,{})}),P($,{variant:"h6",noWrap:!0,component:"div",children:e}),n]})}),S($r,{variant:"permanent",open:t,children:[P(ye,{children:P(xe,{onClick:u,children:i.direction==="rtl"?P(Cr,{}):P(kr,{})})}),P(fe,{}),o.map(m=>S(zr,{children:[S(Dr,{children:[P($,{variant:t?"h5":"h6",paddingLeft:t?2:1,children:t?m.category:ce(m.category,4)}),m.options.map(l=>P(Mr,{disablePadding:!0,sx:{display:"block"},children:S(Er,{sx:[{minHeight:48,px:2.5},t?{justifyContent:"initial"}:{justifyContent:"center"}],component:Hr,to:l.to,selected:s.pathname===l.to,children:[P(Ar,{sx:[{minWidth:0,justifyContent:"center"},t?{mr:3}:{mr:"auto"}],children:l.icon?l.icon:t?null:P($,{children:ce(l.label,4)})}),P(Or,{primary:l.label,sx:[t?{opacity:1}:{opacity:0}]})]})},l.to))]}),P(fe,{})]},m.category))]}),S(ue,{component:"main",sx:{flexGrow:1,p:3},children:[P(ye,{}),r]})]})}var Gr=_r;import Jr from"@mui/material/Typography";import{Fragment as qr,jsx as he}from"react/jsx-runtime";function Kr(n){var i=n,{text:e,sx:o}=i,r=x(i,["text","sx"]);return he(qr,{children:e.split(`
2
- `).map((t,p)=>he(Jr,c(a({sx:a({margin:1},o)},r),{children:t}),p))})}var Yr=Kr;import G from"@mui/material/Box";import ve from"@mui/material/Typography";import{stripIndent as Qr}from"common-tags";import{LiveEditor as Zr,LiveError as jr,LivePreview as et,LiveProvider as ot}from"react-live";import{jsx as w,jsxs as we}from"react/jsx-runtime";function rt({code:e,scope:o,previewStyles:r,noInline:n,enableTypeScript:i,language:t}){let{mode:p}=I(),s={backgroundColor:p==="dark"?"black":"white",border:.3,borderRadius:1,padding:2,borderColor:"darkgray"},d=r?a(a({},s),r):a({},s);return w(G,{sx:{borderRadius:1,border:.5,padding:2},children:we(ot,{code:Qr(e),scope:o,noInline:n,enableTypeScript:i,language:t,children:[w(ve,{variant:"h5",children:"Code"}),w(G,{sx:{border:.3,borderRadius:.3,borderColor:"darkgray"},children:w(Zr,{})}),w("br",{}),w(ve,{variant:"h5",children:"Result"}),we(G,{sx:d,children:[w(et,{}),w(jr,{})]})]})})}var tt=rt;import{fillArray as nt}from"@alextheman/utility";import it from"@mui/material/Skeleton";import at from"@mui/material/TableCell";import pt from"@mui/material/TableRow";import{jsx as J}from"react/jsx-runtime";function st({columns:e}){return J(pt,{children:nt(o=>J(at,{children:J(it,{})},o),e)})}var dt=st;import mt from"@mui/material/Button";import{useFormContext as lt}from"react-hook-form";import{jsx as ft}from"react/jsx-runtime";function ct(n){var i=n,{disableClean:e,label:o}=i,r=x(i,["disableClean","label"]);let{formState:{disabled:t,isDirty:p,isSubmitting:s}}=lt();return ft(mt,c(a({color:"primary",disabled:r.disabled||e&&!p||t,loading:s,type:"submit",variant:"contained"},r),{children:o}))}var ut=ct;import Se from"@mui/material/Box";import{styled as xt}from"@mui/material/styles";import Pt from"@mui/material/Switch";import{jsx as C}from"react/jsx-runtime";var gt=xt(Pt)(()=>({padding:8,"& .MuiSwitch-track":{borderRadius:11,"&::before, &::after":{content:'""',position:"absolute",top:"50%",transform:"translateY(-50%)",fontSize:16,width:28,height:28}}}));function yt(t){var p=t,{checkedIcon:e,checkedIconStyles:o,uncheckedIcon:r,uncheckedIconStyles:n}=p,i=x(p,["checkedIcon","checkedIconStyles","uncheckedIcon","uncheckedIconStyles"]);let s={borderRadius:"50%",borderColor:"white",backgroundColor:"white",display:"flex",alignItems:"center",justifyContent:"center",padding:.25},d={color:"black",maxWidth:16.5,maxHeight:16.5};return C(gt,a({checkedIcon:C(Se,{sx:s,children:C(e,{style:a(a({},d),o)})}),icon:C(Se,{sx:s,children:C(r,{style:a(a({},d),n)})})},i))}var ht=yt;import{useCallback as be,useEffect as vt,useState as wt}from"react";function St(e){let[o,r]=wt(()=>{let t=window.location.hash.replace("#","");return e&&t===""?e:t}),n=be(()=>{let t=window.location.hash.replace("#","");r(e&&t===""?e:t)},[r,e]);vt(()=>(window.addEventListener("hashchange",n),()=>{window.removeEventListener("hashchange",n)}),[n]);let i=be(t=>{let p=typeof t=="function"?t(o):t;p!==o&&(window.location.hash=p)},[o]);return[o,i]}var bt=St;export{Ee as CollapsableItem,vo as DarkModeToggle,To as DropdownMenu,Do as ExternalLink,H as FileInput,Yo as FileInputList,Fo as FileType,rr as IconWithPopover,V as InternalLink,mr as ListItemInternalLink,fr as Loader,O as LoaderData,W as LoaderError,A as LoaderProvider,Qe as ModeProvider,br as NavigationBottom,Gr as NavigationDrawer,Yr as PopoverText,tt as ReactPlayground,to as ScreenSizeProvider,dt as SkeletonRow,uo as SnackbarProvider,ut as SubmitButton,ht as SwitchWithIcons,bt as useHash,L as useLoader,I as useMode,oo as useScreenSize,lo as useSnackbar};
1
+ var Ie=Object.defineProperty,ke=Object.defineProperties;var Ce=Object.getOwnPropertyDescriptors;var T=Object.getOwnPropertySymbols;var Y=Object.prototype.hasOwnProperty,q=Object.prototype.propertyIsEnumerable;var K=(e,o,r)=>o in e?Ie(e,o,{enumerable:!0,configurable:!0,writable:!0,value:r}):e[o]=r,a=(e,o)=>{for(var r in o||(o={}))Y.call(o,r)&&K(e,r,o[r]);if(T)for(var r of T(o))q.call(o,r)&&K(e,r,o[r]);return e},c=(e,o)=>ke(e,Ce(o));var P=(e,o)=>{var r={};for(var n in e)Y.call(e,n)&&o.indexOf(n)<0&&(r[n]=e[n]);if(e!=null&&T)for(var n of T(e))o.indexOf(n)<0&&q.call(e,n)&&(r[n]=e[n]);return r};var Q=(e,o,r)=>new Promise((n,i)=>{var t=d=>{try{p(r.next(d))}catch(u){i(u)}},s=d=>{try{p(r.throw(d))}catch(u){i(u)}},p=d=>d.done?n(d.value):Promise.resolve(d.value).then(t,s);p((r=r.apply(e,o)).next())});import Te from"@mui/icons-material/ArrowDropDown";import Be from"@mui/icons-material/ArrowDropUp";import Ne from"@mui/material/Box";import M from"@mui/material/ButtonBase";import De from"@mui/material/Collapse";import{useEffect as Re,useState as Me}from"react";import{jsx as E,jsxs as Z}from"react/jsx-runtime";function Ee({isInitiallyOpen:e,onOpen:o,onClose:r,children:n,buttonStyles:i,buttonContents:t,buttonComponent:s=M,collapseProps:p,openIcon:d=E(Be,{}),closedIcon:u=E(Te,{}),useDefaultStyling:m=s===M}){let[l,f]=Me(!!e);return Re(()=>{l&&o?o():!l&&r&&r()},[l]),Z(Ne,{children:[Z(s,{onClick:()=>{f(g=>!g)},sx:m?a({width:"100%",display:"flex",alignItems:"center",justifyContent:"center",paddingY:1.5,paddingX:2,textAlign:"center","&:hover":s===M?{backgroundColor:"action.hover"}:null},i):i,"aria-expanded":l,children:[t,l?d:u]}),E(De,c(a({in:l},p),{children:n}))]})}var Oe=Ee;import Po from"@mui/icons-material/DarkMode";import go from"@mui/icons-material/LightMode";import vo from"@mui/material/IconButton";import yo from"@mui/material/Tooltip";import Ae from"@mui/material/CircularProgress";import{createContext as Fe,useContext as We}from"react";import{jsx as j}from"react/jsx-runtime";var ee=Fe(void 0);function w(){let e=We(ee);if(!e)throw new Error("LOADER_CONTEXT_NOT_SET");return e}function ze(n){var i=n,{children:e,loadingComponent:o=j(Ae,{})}=i,r=P(i,["children","loadingComponent"]);return j(ee.Provider,{value:a({loadingComponent:o},r),children:e})}var O=ze;import{useRef as He}from"react";import{Fragment as y,jsx as h}from"react/jsx-runtime";var oe="Data is undefined after loading. This could either be an issue with the query or you have not passed in the data to LoaderProvider. Please double-check that you have provided data.";function Ve({children:e,dataParser:o,loadingComponent:r,onNullable:n,onUndefined:i,onNull:t,showOnError:s}){let{isLoading:p,data:d,dataParser:u,loadingComponent:m,error:l}=w(),f=He(!1),g=o!=null?o:u;if(p)return h(y,{children:r!=null?r:m});if(l&&!s)return h(y,{});if(!d){if(n){d===void 0&&!f.current&&(console.warn(oe),f.current=!0);let x=n();return x!=null?x:h(y,{})}if(d===void 0&&i){f.current||(console.warn(oe),f.current=!0);let x=i();return x!=null?x:h(y,{})}if(d===null&&t){let x=t();return x!=null?x:h(y,{})}return h(y,{})}return g?typeof e=="function"?h(y,{children:e(g(d))}):h(y,{children:e}):typeof e=="function"?h(y,{children:e(d)}):h(y,{children:e})}var A=Ve;import Ue from"@mui/material/Alert";import{Fragment as re,jsx as F}from"react/jsx-runtime";function Xe(){var r;let{error:e,errorComponent:o}=w();return e?typeof o=="function"?o(e):o?F(re,{children:o}):F(Ue,{severity:"error",children:(r=e==null?void 0:e.message)!=null?r:"An unknown error has occured. Please try again later."}):F(re,{})}var W=Xe;import $e from"@mui/material/CssBaseline";import{createTheme as _e,ThemeProvider as Ge}from"@mui/material/styles";import{createContext as Je,useContext as Ke,useMemo as Ye,useState as qe}from"react";import{jsx as te,jsxs as je}from"react/jsx-runtime";var ne=Je({toggleMode:()=>{},mode:"dark"});function I(){return Ke(ne)}function Qe({children:e,mode:o="dark"}){let[r,n]=qe(o),i=Ye(()=>_e({palette:{mode:r}}),[r]);return te(ne.Provider,{value:{mode:r,toggleMode:()=>{n(t=>t==="light"?"dark":"light")}},children:je(Ge,{theme:i,children:[te($e,{}),e]})})}var Ze=Qe;import{createContext as eo,useContext as oo,useEffect as ie,useState as z}from"react";import{jsx as io}from"react/jsx-runtime";var ae=eo({windowWidth:0,windowHeight:0,isLargeScreen:!1});function ro(){return oo(ae)}function to({children:e,largeScreenWidth:o,largeScreenHeight:r}){let[n,i]=z(window.innerWidth),[t,s]=z(window.innerHeight);function p(m,l,f=669,g=600){return m>f&&l>g}let[d,u]=z(p(window.innerWidth,window.innerHeight,o,r));return ie(()=>{function m(){i(window.innerWidth),s(window.innerHeight)}return m(),window.addEventListener("resize",m),()=>{window.removeEventListener("resize",m)}},[]),ie(()=>{u(p(n,t,o,r))},[n,t,o,r]),io(ae.Provider,{value:{isLargeScreen:d,windowWidth:n,windowHeight:t},children:e})}var no=to;import{wait as ao}from"@alextheman/utility";import po from"@mui/material/Alert";import so from"@mui/material/Snackbar";import{createContext as mo,useContext as lo,useState as B}from"react";import{jsx as pe,jsxs as xo}from"react/jsx-runtime";var se=mo(void 0);function co(){let e=lo(se);if(!e)throw new Error("SNACKBAR_CONTEXT_NOT_SET");return e}function uo({children:e,autoHideDuration:o=5e3}){let[r,n]=B(!1),[i,t]=B(o),[s,p]=B(""),[d,u]=B("info");function m(f,g,x){n(!0),t(x!=null?x:o),u(g!=null?g:"info"),p(f)}function l(){return Q(this,null,function*(){n(!1),yield ao(.2),p("")})}return xo(se.Provider,{value:{addSnackbar:m},children:[pe(so,{open:r,autoHideDuration:i,onClose:l,children:pe(po,{onClose:l,severity:d,children:s})}),e]})}var fo=uo;import{jsx as N}from"react/jsx-runtime";function ho(){let{mode:e,toggleMode:o}=I();return N(yo,{title:`Enable ${e==="dark"?"light":"dark"} mode`,children:N(vo,{sx:{marginLeft:"auto"},onClick:o,"aria-label":`Enable ${e==="dark"?"light":"dark"} mode`,children:e==="dark"?N(go,{}):N(Po,{})})})}var So=ho;import bo from"@mui/icons-material/ArrowDropDown";import Lo from"@mui/icons-material/ArrowDropUp";import de from"@mui/material/Box";import me from"@mui/material/Button";import wo from"@mui/material/Menu";import{useEffect as Io,useMemo as ko,useState as Co}from"react";import{jsx as k,jsxs as No}from"react/jsx-runtime";function To({children:e,button:o=me,buttonChildren:r="Menu",buttonProps:n,isOpenIcon:i=k(Lo,{}),isClosedIcon:t=k(bo,{}),onOpen:s,onClose:p}){let[d,u]=Co(null),m=ko(()=>!!d,[d]),l=c(a({},n),{onClick:f=>{u(f.currentTarget)},"aria-controls":m?"dropdown-menu":void 0,"aria-haspopup":"true","aria-expanded":m});return o===me&&(l.endIcon=m?i:t),Io(()=>{m&&s?s():!m&&p&&p()},[m,s,p]),No(de,{children:[k(o,c(a({},l),{children:r})),k(wo,{id:"dropdown-menu",anchorEl:d,open:m,onClose:()=>{u(null)},children:typeof e=="function"?k(de,{children:e(()=>{u(null)})}):e})]})}var Bo=To;import Do from"@mui/material/Link";import{jsx as Eo}from"react/jsx-runtime";function Ro(n){var i=n,{href:e,children:o}=i,r=P(i,["href","children"]);return Eo(Do,c(a({component:"a",href:e,target:"_blank",rel:"noopener noreferrer"},r),{children:o}))}var Mo=Ro;import Oo from"@mui/icons-material/CloudUpload";import Ao from"@mui/material/Button";import{styled as le}from"@mui/material/styles";import{useState as Fo}from"react";import{jsx as H,jsxs as Uo}from"react/jsx-runtime";var Wo={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"},zo=le("input")({clip:"rect(0 0 0 0)",clipPath:"inset(50%)",height:1,overflow:"hidden",position:"absolute",bottom:0,left:0,whiteSpace:"nowrap",width:1}),Ho=le("div")(({theme:e,$dragging:o})=>({border:"2px dashed",borderColor:o?e.palette.primary.main:"#ccc",backgroundColor:o?e.palette.action.hover:"transparent",borderRadius:8,padding:"1.5rem",textAlign:"center",transition:"border-color 0.2s",cursor:"pointer"}));function Vo(s){var p=s,{onFileInput:e,label:o="Upload files",multiple:r,accept:n,useDropzone:i}=p,t=P(p,["onFileInput","label","multiple","accept","useDropzone"]);var l;let[d,u]=Fo(!1),m=Uo(Ao,c(a({variant:"contained",component:"label","aria-label":"File upload button",onKeyDown:f=>{var g;(f.key==="Enter"||f.key===" ")&&(f.preventDefault(),(g=document.getElementById("file-input"))==null||g.click())}},t),{startIcon:(l=t.startIcon)!=null?l:H(Oo,{}),children:[o,H(zo,{id:"file-input",type:"file",onChange:f=>{var x;let g=f.target;e(Array.from((x=g.files)!=null?x:[])),g.value=""},multiple:r,accept:n==null?void 0:n.join(","),disabled:t.disabled})]}));return i?H(Ho,{$dragging:d,onDragOver:f=>{f.preventDefault(),!t.disabled&&u(!0)},onDragLeave:f=>{f.preventDefault(),u(!1)},onDrop:f=>{var x;if(f.preventDefault(),u(!1),t.disabled)return;let g=Array.from((x=f.dataTransfer.files)!=null?x:[]);e(g)},children:m}):m}var V=Vo;import Xo from"@mui/icons-material/Delete";import $o from"@mui/material/Box";import _o from"@mui/material/IconButton";import Go from"@mui/material/List";import Jo from"@mui/material/ListItem";import Ko from"@mui/material/ListItemText";import{jsx as L,jsxs as Qo}from"react/jsx-runtime";function Yo(n){var i=n,{files:e,setFiles:o}=i,r=P(i,["files","setFiles"]);function t(p){o(d=>[...d,...p])}let s=c(a({},r),{onFileInput:t});return(s==null?void 0:s.multiple)===void 0&&(s.multiple=!0),Qo($o,{children:[L(V,a({},s)),L(Go,{children:e.map(p=>L(Jo,{secondaryAction:L(_o,{"aria-label":"Delete",edge:"end",onClick:()=>{o(d=>d.filter(u=>u!==p))},children:L(Xo,{})}),children:L(Ko,{primary:p.name})},p.name))})]})}var qo=Yo;import Zo from"@mui/material/Box";import jo from"@mui/material/Popover";import{useId as er,useState as or}from"react";import{jsx as ce,jsxs as nr}from"react/jsx-runtime";function rr({icon:e,onOpen:o,onClose:r,iconProps:n,children:i}){let[t,s]=or(null),p=!!t,d=er();function u(l){s(l.currentTarget),o&&o()}function m(){s(null),r&&r()}return nr(Zo,{children:[ce(e,a({"aria-owns":p?d:void 0,"aria-haspopup":"true",onMouseEnter:u,onMouseLeave:m},n)),ce(jo,{id:d,sx:{pointerEvents:"none"},open:p,anchorEl:t,anchorOrigin:{vertical:"bottom",horizontal:"left"},transformOrigin:{vertical:"top",horizontal:"left"},onClose:m,disableRestoreFocus:!0,children:i})]})}var tr=rr;import ir from"@mui/material/Link";import{Link as ar}from"react-router-dom";import{jsx as sr}from"react/jsx-runtime";function pr(n){var i=n,{to:e,children:o}=i,r=P(i,["to","children"]);return sr(ir,c(a({component:ar,to:e},r),{children:o}))}var U=pr;import dr from"@mui/material/ListItemButton";import{jsx as cr}from"react/jsx-runtime";function mr(r){var n=r,{children:e}=n,o=P(n,["children"]);return cr(dr,c(a({component:U},o),{children:e}))}var lr=mr;import ur from"@mui/material/CircularProgress";import{jsx as X,jsxs as Pr}from"react/jsx-runtime";function fr(s){var p=s,{children:e,onUndefined:o,onNull:r,onNullable:n,loadingComponent:i=X(ur,{})}=p,t=P(p,["children","onUndefined","onNull","onNullable","loadingComponent"]);return Pr(O,c(a({loadingComponent:i},t),{children:[X(W,{}),X(A,{onUndefined:o,onNull:r,onNullable:n,children:e})]}))}var xr=fr;import gr from"@mui/material/BottomNavigation";import vr from"@mui/material/BottomNavigationAction";import yr from"@mui/material/Box";import hr from"@mui/material/Paper";import{useState as Sr}from"react";import{Link as br}from"react-router-dom";import{Fragment as Ir,jsx as D,jsxs as kr}from"react/jsx-runtime";function Lr({children:e,navItems:o}){let[r,n]=Sr("");return kr(Ir,{children:[D(yr,{sx:{paddingBottom:7},children:e}),D(hr,{sx:{position:"fixed",bottom:0,left:0,right:0},children:D(gr,{showLabels:!0,value:r,onChange:(i,t)=>{n(t)},children:o.map(i=>D(vr,c(a({},i),{component:br}),i.value))})})]})}var wr=Lr;import{truncate as ue}from"@alextheman/utility";import Cr from"@mui/icons-material/ChevronLeft";import Tr from"@mui/icons-material/ChevronRight";import Br from"@mui/icons-material/Menu";import Nr from"@mui/material/AppBar";import fe from"@mui/material/Box";import Dr from"@mui/material/CssBaseline";import xe from"@mui/material/Divider";import Rr from"@mui/material/Drawer";import Pe from"@mui/material/IconButton";import Mr from"@mui/material/List";import Er from"@mui/material/ListItem";import Or from"@mui/material/ListItemButton";import Ar from"@mui/material/ListItemIcon";import Fr from"@mui/material/ListItemText";import{styled as _,useTheme as Wr}from"@mui/material/styles";import zr from"@mui/material/Toolbar";import $ from"@mui/material/Typography";import{Fragment as Hr,useState as Vr}from"react";import{Link as Ur,useLocation as Xr}from"react-router-dom";import{jsx as v,jsxs as b}from"react/jsx-runtime";var R=240;function ge(e){return{width:R,transition:e.transitions.create("width",{easing:e.transitions.easing.sharp,duration:e.transitions.duration.enteringScreen}),overflowX:"hidden"}}function ve(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)`}}}var ye=_("div")(({theme:e})=>a({display:"flex",alignItems:"center",justifyContent:"flex-end",padding:e.spacing(0,1)},e.mixins.toolbar)),$r=_(Nr,{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:o})=>o,style:{marginLeft:R,width:`calc(100% - ${R}px)`,transition:e.transitions.create(["width","margin"],{easing:e.transitions.easing.sharp,duration:e.transitions.duration.enteringScreen})}}]})),_r=_(Rr,{shouldForwardProp:e=>e!=="open"})(({theme:e})=>({width:R,flexShrink:0,whiteSpace:"nowrap",boxSizing:"border-box",variants:[{props:({open:o})=>o,style:c(a({},ge(e)),{"& .MuiDrawer-paper":ge(e)})},{props:({open:o})=>!o,style:c(a({},ve(e)),{"& .MuiDrawer-paper":ve(e)})}]}));function Gr({title:e,navItems:o,children:r,headerElements:n}){let i=Wr(),[t,s]=Vr(!0),p=Xr();function d(){s(!0)}function u(){s(!1)}return b(fe,{sx:{display:"flex"},children:[v(Dr,{}),v($r,{position:"fixed",open:t,children:b(zr,{children:[v(Pe,{color:"inherit","aria-label":"open drawer",onClick:d,edge:"start",sx:[{marginRight:5},t&&{display:"none"}],children:v(Br,{})}),v($,{variant:"h6",noWrap:!0,component:"div",children:e}),n]})}),b(_r,{variant:"permanent",open:t,children:[v(ye,{children:v(Pe,{onClick:u,children:i.direction==="rtl"?v(Tr,{}):v(Cr,{})})}),v(xe,{}),o.map(m=>b(Hr,{children:[b(Mr,{children:[v($,{variant:t?"h5":"h6",paddingLeft:t?2:1,children:t?m.category:ue(m.category,4)}),m.options.map(l=>v(Er,{disablePadding:!0,sx:{display:"block"},children:b(Or,{sx:[{minHeight:48,px:2.5},t?{justifyContent:"initial"}:{justifyContent:"center"}],component:Ur,to:l.to,selected:p.pathname===l.to,children:[v(Ar,{sx:[{minWidth:0,justifyContent:"center"},t?{mr:3}:{mr:"auto"}],children:l.icon?l.icon:t?null:v($,{children:ue(l.label,4)})}),v(Fr,{primary:l.label,sx:[t?{opacity:1}:{opacity:0}]})]})},l.to))]}),v(xe,{})]},m.category))]}),b(fe,{component:"main",sx:{flexGrow:1,p:3},children:[v(ye,{}),r]})]})}var Jr=Gr;import Kr from"@mui/material/Typography";import{Fragment as Qr,jsx as he}from"react/jsx-runtime";function Yr(n){var i=n,{text:e,sx:o}=i,r=P(i,["text","sx"]);return he(Qr,{children:e.split(`
2
+ `).map((t,s)=>he(Kr,c(a({sx:a({margin:1},o)},r),{children:t}),s))})}var qr=Yr;import G from"@mui/material/Box";import Se from"@mui/material/Typography";import{stripIndent as Zr}from"common-tags";import{LiveEditor as jr,LiveError as et,LivePreview as ot,LiveProvider as rt}from"react-live";import{jsx as S,jsxs as be}from"react/jsx-runtime";function tt({code:e,scope:o,previewStyles:r,noInline:n,enableTypeScript:i,language:t}){let{mode:s}=I(),p={backgroundColor:s==="dark"?"black":"white",border:.3,borderRadius:1,padding:2,borderColor:"darkgray"},d=r?a(a({},p),r):a({},p);return S(G,{sx:{borderRadius:1,border:.5,padding:2},children:be(rt,{code:Zr(e),scope:o,noInline:n,enableTypeScript:i,language:t,children:[S(Se,{variant:"h5",children:"Code"}),S(G,{sx:{border:.3,borderRadius:.3,borderColor:"darkgray"},children:S(jr,{})}),S("br",{}),S(Se,{variant:"h5",children:"Result"}),be(G,{sx:d,children:[S(ot,{}),S(et,{})]})]})})}var nt=tt;import{fillArray as it}from"@alextheman/utility";import at from"@mui/material/Skeleton";import pt from"@mui/material/TableCell";import st from"@mui/material/TableRow";import{jsx as J}from"react/jsx-runtime";function dt({columns:e}){return J(st,{children:it(o=>J(pt,{children:J(at,{})},o),e)})}var mt=dt;import lt from"@mui/material/Button";import{useFormContext as ct}from"react-hook-form";import{jsx as xt}from"react/jsx-runtime";function ut(n){var i=n,{disableClean:e,label:o}=i,r=P(i,["disableClean","label"]);let{formState:{disabled:t,isDirty:s,isSubmitting:p}}=ct();return xt(lt,c(a({color:"primary",disabled:r.disabled||e&&!s||t,loading:p,type:"submit",variant:"contained"},r),{children:o}))}var ft=ut;import Le from"@mui/material/Box";import{styled as Pt}from"@mui/material/styles";import gt from"@mui/material/Switch";import{jsx as C}from"react/jsx-runtime";var vt=Pt(gt)(()=>({padding:8,"& .MuiSwitch-track":{borderRadius:11,"&::before, &::after":{content:'""',position:"absolute",top:"50%",transform:"translateY(-50%)",fontSize:16,width:28,height:28}}}));function yt(t){var s=t,{checkedIcon:e,checkedIconStyles:o,uncheckedIcon:r,uncheckedIconStyles:n}=s,i=P(s,["checkedIcon","checkedIconStyles","uncheckedIcon","uncheckedIconStyles"]);let p={borderRadius:"50%",borderColor:"white",backgroundColor:"white",display:"flex",alignItems:"center",justifyContent:"center",padding:.25},d={color:"black",maxWidth:16.5,maxHeight:16.5};return C(vt,a({checkedIcon:C(Le,{sx:p,children:C(e,{style:a(a({},d),o)})}),icon:C(Le,{sx:p,children:C(r,{style:a(a({},d),n)})})},i))}var ht=yt;import{useCallback as we,useEffect as St,useState as bt}from"react";function Lt(e){let[o,r]=bt(()=>{let t=window.location.hash.replace("#","");return e&&t===""?e:t}),n=we(()=>{let t=window.location.hash.replace("#","");r(e&&t===""?e:t)},[r,e]);St(()=>(window.addEventListener("hashchange",n),()=>{window.removeEventListener("hashchange",n)}),[n]);let i=we(t=>{let s=typeof t=="function"?t(o):t;s!==o&&(window.location.hash=s)},[o]);return[o,i]}var wt=Lt;export{Oe as CollapsableItem,So as DarkModeToggle,Bo as DropdownMenu,Mo as ExternalLink,V as FileInput,qo as FileInputList,Wo as FileType,tr as IconWithPopover,U as InternalLink,lr as ListItemInternalLink,xr as Loader,A as LoaderData,W as LoaderError,O as LoaderProvider,Ze as ModeProvider,wr as NavigationBottom,Jr as NavigationDrawer,qr as PopoverText,nt as ReactPlayground,no as ScreenSizeProvider,mt as SkeletonRow,fo as SnackbarProvider,ft as SubmitButton,ht as SwitchWithIcons,wt as useHash,w as useLoader,I as useMode,ro as useScreenSize,co as useSnackbar};
3
3
  //# sourceMappingURL=index.js.map