@alextheman/components 6.2.0 → 6.2.1

package/dist/index.d.ts

@@ -1,7 +1,7 @@
 import { CollapseProps } from "@mui/material/Collapse";
 import * as react0 from "react";
 import { CSSProperties, ComponentProps, ComponentPropsWithRef, ComponentPropsWithoutRef, ComponentType, Dispatch, ElementType, JSX, MouseEvent, MouseEventHandler, ReactNode, Ref, SetStateAction } from "react";
-import * as react_jsx_runtime2 from "react/jsx-runtime";
+import * as react_jsx_runtime0 from "react/jsx-runtime";
 import MUIButton, { ButtonOwnProps, ButtonProps } from "@mui/material/Button";
 import { MenuItemOwnProps } from "@mui/material/MenuItem";
 import { AlertColor } from "@mui/material/Alert";
@@ -41,10 +41,10 @@ declare function CollapsableItem({
   openIcon,
   closedIcon,
   useDefaultStyling
-}: CollapsableItemProps): react_jsx_runtime2.JSX.Element;
+}: CollapsableItemProps): react_jsx_runtime0.JSX.Element;
 //#endregion
 //#region src/components/DarkModeToggle.d.ts
-declare function DarkModeToggle(): react_jsx_runtime2.JSX.Element;
+declare function DarkModeToggle(): react_jsx_runtime0.JSX.Element;
 //#endregion
 //#region src/components/DropdownMenu.d.ts
 interface DropdownMenuProps {
@@ -57,7 +57,18 @@ interface DropdownMenuProps {
   onOpen?: () => void;
   onClose?: () => void;
 }
-/** @deprecated This component does not support the new context-based pattern and individual DropdownMenuItem components. Please use DropdownMenu2 instead. */
+/**
+ * @param root0
+ * @param root0.children
+ * @param root0.button
+ * @param root0.buttonChildren
+ * @param root0.buttonProps
+ * @param root0.isOpenIcon
+ * @param root0.isClosedIcon
+ * @param root0.onOpen
+ * @param root0.onClose
+ * @deprecated This component does not support the new context-based pattern and individual DropdownMenuItem components. Please use DropdownMenu2 instead.
+ */
 declare function DropdownMenu({
   children,
   button: Button,
@@ -67,7 +78,7 @@ declare function DropdownMenu({
   isClosedIcon,
   onOpen,
   onClose
-}: DropdownMenuProps): react_jsx_runtime2.JSX.Element;
+}: DropdownMenuProps): react_jsx_runtime0.JSX.Element;
 //#endregion
 //#region src/components/ExternalLink.d.ts
 interface ExternalLinkProps extends Omit<LinkProps, "to" | "target" | "rel"> {
@@ -81,7 +92,7 @@ declare function ExternalLink({
   children,
   ref,
   ...linkProps
-}: ExternalLinkProps): react_jsx_runtime2.JSX.Element;
+}: ExternalLinkProps): react_jsx_runtime0.JSX.Element;
 //#endregion
 //#region src/components/FileInput.d.ts
 declare const FileType: {
@@ -110,7 +121,7 @@ declare function FileInput({
   accept,
   useDropzone,
   ...buttonProps
-}: FileInputProps): react_jsx_runtime2.JSX.Element;
+}: FileInputProps): react_jsx_runtime0.JSX.Element;
 //#endregion
 //#region src/components/FileInputList.d.ts
 interface FileInputListProps extends Omit<FileInputProps, "onFileInput"> {
@@ -121,7 +132,7 @@ declare function FileInputList({
   files,
   setFiles,
   ...fileInputProps
-}: FileInputListProps): react_jsx_runtime2.JSX.Element;
+}: FileInputListProps): react_jsx_runtime0.JSX.Element;
 //#endregion
 //#region src/components/IconWithPopover.d.ts
 interface IconWithPopoverProps {
@@ -139,7 +150,7 @@ declare function IconWithPopover({
   onClose,
   iconProps,
   children
-}: IconWithPopoverProps): react_jsx_runtime2.JSX.Element;
+}: IconWithPopoverProps): react_jsx_runtime0.JSX.Element;
 //#endregion
 //#region src/components/InternalLink.d.ts
 interface InternalLinkProps extends Omit<LinkProps, "href"> {
@@ -153,7 +164,7 @@ declare function InternalLink({
   children,
   ref,
   ...linkProps
-}: InternalLinkProps): react_jsx_runtime2.JSX.Element;
+}: InternalLinkProps): react_jsx_runtime0.JSX.Element;
 //#endregion
 //#region src/components/ListItemInternalLink.d.ts
 interface ListItemInternalLinkProps extends Omit<ListItemButtonProps, "href"> {
@@ -163,7 +174,7 @@ interface ListItemInternalLinkProps extends Omit<ListItemButtonProps, "href"> {
 declare function ListItemInternalLink({
   children,
   ...listItemButtonProps
-}: ListItemInternalLinkProps): react_jsx_runtime2.JSX.Element;
+}: ListItemInternalLinkProps): react_jsx_runtime0.JSX.Element;
 //#endregion
 //#region src/types/ContextHookOptions.d.ts
 interface ContextHookOptions<S extends boolean = true> {
@@ -193,7 +204,7 @@ declare function DropdownMenu2({
   buttonProps,
   openIcon,
   closedIcon
-}: DropdownMenu2Props): react_jsx_runtime2.JSX.Element;
+}: DropdownMenu2Props): react_jsx_runtime0.JSX.Element;
 //#endregion
 //#region src/providers/DropdownMenu2/DropdownMenuExternalLink.d.ts
 interface DropdownMenuExternalLinkProps extends MenuItemOwnProps {
@@ -208,7 +219,7 @@ declare function DropdownMenuExternalLink({
   children,
   onClick,
   ...menuItemProps
-}: DropdownMenuExternalLinkProps): react_jsx_runtime2.JSX.Element;
+}: DropdownMenuExternalLinkProps): react_jsx_runtime0.JSX.Element;
 //#endregion
 //#region src/providers/DropdownMenu2/DropdownMenuInternalLink.d.ts
 interface DropdownMenuInternalLinkProps extends MenuItemOwnProps {
@@ -223,7 +234,7 @@ declare function DropdownMenuInternalLink({
   children,
   onClick,
   ...menuItemProps
-}: DropdownMenuInternalLinkProps): react_jsx_runtime2.JSX.Element;
+}: DropdownMenuInternalLinkProps): react_jsx_runtime0.JSX.Element;
 //#endregion
 //#region src/providers/DropdownMenu2/DropdownMenuItem.d.ts
 type DropdownMenuItemProps<RootComponent extends ElementType = typeof MUIButton> = {
@@ -238,25 +249,25 @@ declare function DropdownMenuItem<RootComponent extends ElementType>({
   ref,
   onClick,
   ...menuItemProps
-}: DropdownMenuItemProps<RootComponent>): react_jsx_runtime2.JSX.Element;
+}: DropdownMenuItemProps<RootComponent>): react_jsx_runtime0.JSX.Element;
 //#endregion
 //#region src/providers/LoaderProvider/LoaderProvider.d.ts
-interface LoaderProviderBaseProps<T> {
+interface LoaderProviderBaseProps<DataType> {
   /** The current loading status (true if loading, false if not) */
   isLoading: boolean;
   /** The data being loaded. */
-  data?: T;
+  data?: DataType;
   /** A parser for the data. */
-  dataParser?: (data: unknown) => NonNullable<T>;
+  dataParser?: (data: unknown) => NonNullable<DataType>;
   /** The component to show when the data is being fetched. */
   loadingComponent?: ReactNode;
 }
-interface LoaderProviderPropsWithNoError<T> extends LoaderProviderBaseProps<T> {
+interface LoaderProviderPropsWithNoError<DataType> extends LoaderProviderBaseProps<DataType> {
   error?: never;
   errorComponent?: never;
   logError?: never;
 }
-interface LoaderProviderPropsWithError<T> extends LoaderProviderBaseProps<T> {
+interface LoaderProviderPropsWithError<DataType> extends LoaderProviderBaseProps<DataType> {
   /** The error given if the request gave an error. */
   error: unknown;
   /** 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. */
@@ -268,18 +279,28 @@ type LoaderContextValue<T> = LoaderProviderPropsWithNoError<T> | LoaderProviderP
 type LoaderProviderProps<T> = LoaderContextValue<T> & {
   children: ReactNode;
 };
-/** A provider for a context that deals with state management when fetching data from an API.
+/**
+ * A provider for a context that deals with state management when fetching data from an API.
  * This may be used over Loader if you require more control over the placement of the error message and data display.
+ * @template DataType - The type of data being loaded.
+ * @param root0 - Props to pass to LoaderProvider.
+ * @param root0.children - The components that may receive access to the LoaderContext value.
+ * @param root0.loadingComponent - The component to show when the data is being fetched.
+ * @param root0.isLoading - The current loading status (true if loading, false if not)
+ * @param root0.error - The error given if the request gave an error.
+ * @param root0.errorComponent - 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.
+ * @param root0.logError - An option to log the error to the console. Note that this may not be provided unless the error prop has also been provided.
  */
-declare function LoaderProvider<T>({
+declare function LoaderProvider<DataType>({
   children,
   loadingComponent,
   ...contextProps
-}: LoaderProviderProps<T>): react_jsx_runtime2.JSX.Element;
+}: LoaderProviderProps<DataType>): react_jsx_runtime0.JSX.Element;
 //#endregion
 //#region src/providers/LoaderProvider/LoaderData.d.ts
 interface LoaderDataProps<T> {
-  /** The elements to show after data has been loaded.
+  /**
+   * The elements to show after data has been loaded.
    * 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.
    */
   children: ReactNode | ((data: NonNullable<T>) => ReactNode);
@@ -288,23 +309,26 @@ interface LoaderDataProps<T> {
   /** The component to show when the data is being fetched. */
   loadingComponent?: ReactNode;
 }
-/** The component responsible for showing the data provided by LoaderProvider. */
-declare function LoaderData<T>({
+/**
+ * The component responsible for showing the data provided by LoaderProvider.
+ * @template DataType - The type of data being loaded.
+ * @param root0 - Props to pass to LoaderData.
+ * @param root0.children - The elements to show after data has been loaded.
+ * 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.
+ * @param root0.dataParser - A parser for the data.
+ * @param root0.loadingComponent - The component to show when the data is being fetched.
+ */
+declare function LoaderData<DataType>({
   children,
   dataParser: loaderDataParser,
   loadingComponent
-}: LoaderDataProps<T>): react_jsx_runtime2.JSX.Element;
+}: LoaderDataProps<DataType>): react_jsx_runtime0.JSX.Element;
 //#endregion
 //#region src/providers/LoaderProvider/LoaderError.d.ts
 interface LoaderErrorBaseProps {
-  /**
-   * The component to show if an error has been thrown.
-   * @deprecated Please pass in the content to show on error as children instead.
-   */
-  errorComponent?: ReactNode | ((error: unknown) => ReactNode);
   /** The component to show if an error has been thrown. */
   children?: ReactNode | ((error: unknown) => ReactNode);
-  /** Whether you want to log the error to the console or not. */
+  /** An option to log the error to the console. */
   logError?: boolean;
 }
 interface LoaderErrorPropsWithUndefinedOrNull extends LoaderErrorBaseProps {
@@ -321,14 +345,22 @@ interface LoaderErrorPropsWithNullable extends LoaderErrorBaseProps {
   nullableComponent?: ReactNode;
 }
 type LoaderErrorProps = LoaderErrorPropsWithUndefinedOrNull | LoaderErrorPropsWithNullable;
-/** The component responsible for showing any errors provided by LoaderProvider. */
+/**
+ * The component responsible for showing any errors provided by LoaderProvider.
+ * @param root0 - The props to be passed to LoaderError.
+ * @param root0.children - The component to show if an error has been thrown.
+ * @param root0.undefinedComponent - The component to show if no error was thrown but the data is undefined.
+ * @param root0.nullComponent - The component to show if no error was thrown but the data is null.
+ * @param root0.nullableComponent - The component to show if no error was thrown but the data is nullable (undefined or null).
+ * @param root0.logError - An option to log the error to the console.
+ */
 declare function LoaderError({
   children,
   undefinedComponent,
   nullComponent,
   nullableComponent,
   logError: propsLogError
-}: LoaderErrorProps): string | number | bigint | boolean | react_jsx_runtime2.JSX.Element | Iterable<ReactNode> | Promise<string | number | bigint | boolean | react0.ReactPortal | react0.ReactElement<unknown, string | react0.JSXElementConstructor<any>> | Iterable<ReactNode> | null | undefined> | null | undefined;
+}: LoaderErrorProps): string | number | bigint | boolean | react_jsx_runtime0.JSX.Element | Iterable<ReactNode> | Promise<string | number | bigint | boolean | react0.ReactPortal | react0.ReactElement<unknown, string | react0.JSXElementConstructor<any>> | Iterable<ReactNode> | null | undefined> | null | undefined;
 //#endregion
 //#region src/providers/ModeProvider.d.ts
 interface ModeContextValue {
@@ -345,7 +377,7 @@ interface ModeProviderProps {
 declare function ModeProvider({
   children,
   mode: modeProp
-}: ModeProviderProps): react_jsx_runtime2.JSX.Element;
+}: ModeProviderProps): react_jsx_runtime0.JSX.Element;
 //#endregion
 //#region src/providers/ScreenSizeProvider.d.ts
 interface ScreenSizeProps {
@@ -365,7 +397,7 @@ declare function ScreenSizeProvider({
   children,
   largeScreenWidth,
   largeScreenHeight
-}: ScreenSizeProps): react_jsx_runtime2.JSX.Element;
+}: ScreenSizeProps): react_jsx_runtime0.JSX.Element;
 //#endregion
 //#region src/providers/SnackbarProvider.d.ts
 interface SnackbarProviderProps {
@@ -381,22 +413,33 @@ declare function useSnackbar<Strict extends boolean = true>({
 declare function SnackbarProvider({
   children,
   autoHideDuration
-}: SnackbarProviderProps): react_jsx_runtime2.JSX.Element;
+}: SnackbarProviderProps): react_jsx_runtime0.JSX.Element;
 //#endregion
 //#region src/components/Loader.d.ts
-type LoaderProps<T> = Omit<LoaderProviderProps<T>, "children"> & Omit<LoaderErrorProps, "errorComponent" | "children"> & Omit<LoaderDataProps<T>, "showOnError" | "onUndefined" | "onNull" | "onNullable">;
-/** An in-line component that deals with state management when fetching data from an API.
+type LoaderProps<DataType> = Omit<LoaderProviderProps<DataType>, "children" | "logError"> & Omit<LoaderErrorProps, "errorComponent" | "children"> & Omit<LoaderDataProps<DataType>, "showOnError" | "onUndefined" | "onNull" | "onNullable">;
+/**
+ * An in-line component that deals with state management when fetching data from an API.
  * This may be used over LoaderProvider if you don't require as much control over the placement of the error message and data display.
+ * @template DataType - The type of data being loaded.
+ * @param root0 - Props to pass to Loader.
+ * @param root0.children - The elements to show after data has been loaded.
+ * @param root0.errorComponent - 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.
+ * @param root0.undefinedComponent - The component to show if no error was thrown but the data is undefined.
+ * @param root0.nullComponent - The component to show if no error was thrown but the data is null.
+ * @param root0.nullableComponent - The component to show if no error was thrown but the data is nullable (undefined or null).
+ * @param root0.loadingComponent - The component to show when the data is being fetched.
+ * @param root0.logError - An option to log the error to the console.
  */
-declare function Loader<T>({
+declare function Loader<DataType>({
   children,
   errorComponent,
   undefinedComponent,
   nullComponent,
   nullableComponent,
+  logError,
   loadingComponent,
   ...loaderProviderProps
-}: LoaderProps<T>): react_jsx_runtime2.JSX.Element;
+}: LoaderProps<DataType>): react_jsx_runtime0.JSX.Element;
 //#endregion
 //#region src/components/NavigationBottom.d.ts
 interface NavItemBottom {
@@ -412,7 +455,7 @@ interface NavigationBottomProps {
 declare function NavigationBottom({
   children,
   navItems
-}: NavigationBottomProps): react_jsx_runtime2.JSX.Element;
+}: NavigationBottomProps): react_jsx_runtime0.JSX.Element;
 //#endregion
 //#region src/components/NavigationDrawer.d.ts
 interface NavMenuItem {
@@ -434,7 +477,7 @@ declare function NavigationDrawer({
   navItems,
   children,
   headerElements
-}: NavigationDrawerProps): react_jsx_runtime2.JSX.Element;
+}: NavigationDrawerProps): react_jsx_runtime0.JSX.Element;
 //#endregion
 //#region src/components/PopoverText.d.ts
 interface PopoverTextProps extends TypographyProps {
@@ -444,7 +487,7 @@ declare function PopoverText({
   text,
   sx,
   ...typographyProps
-}: PopoverTextProps): react_jsx_runtime2.JSX.Element;
+}: PopoverTextProps): react_jsx_runtime0.JSX.Element;
 //#endregion
 //#region src/components/ReactPlayground.d.ts
 interface ReactPlaygroundProps extends ComponentProps<typeof LiveProvider> {
@@ -454,7 +497,7 @@ declare function ReactPlayground({
   code,
   previewStyles,
   ...liveProviderProps
-}: ReactPlaygroundProps): react_jsx_runtime2.JSX.Element;
+}: ReactPlaygroundProps): react_jsx_runtime0.JSX.Element;
 //#endregion
 //#region src/components/SkeletonRow.d.ts
 interface SkeletonRowProps {
@@ -462,7 +505,7 @@ interface SkeletonRowProps {
 }
 declare function SkeletonRow({
   columns
-}: SkeletonRowProps): react_jsx_runtime2.JSX.Element;
+}: SkeletonRowProps): react_jsx_runtime0.JSX.Element;
 //#endregion
 //#region src/components/SubmitButton.d.ts
 interface SubmitButtonProps extends Omit<ButtonProps, "type"> {
@@ -473,7 +516,7 @@ declare function SubmitButton({
   disableClean,
   label,
   ...buttonProps
-}: SubmitButtonProps): react_jsx_runtime2.JSX.Element;
+}: SubmitButtonProps): react_jsx_runtime0.JSX.Element;
 //#endregion
 //#region src/components/SwitchWithIcons.d.ts
 interface SwitchWithIconsProps extends Omit<SwitchProps, "icon" | "checkedIcon"> {
@@ -492,7 +535,7 @@ declare function SwitchWithIcons({
   uncheckedIcon: UncheckedIcon,
   uncheckedIconStyles,
   ...switchProps
-}: SwitchWithIconsProps): react_jsx_runtime2.JSX.Element;
+}: SwitchWithIconsProps): react_jsx_runtime0.JSX.Element;
 //#endregion
 //#region src/hooks/useHash.d.ts
 declare function useHash<S extends string>(initialHash: S | undefined): [S, Dispatch<SetStateAction<S>>];

package/dist/index.js

@@ -1,3 +1,3 @@
-import e from"@mui/icons-material/ArrowDropDown";import t from"@mui/icons-material/ArrowDropUp";import n from"@mui/material/Box";import r from"@mui/material/ButtonBase";import i from"@mui/material/Collapse";import{Fragment as a,createContext as o,useCallback as s,useContext as c,useEffect as l,useId as u,useMemo as d,useRef as f,useState as p}from"react";import{Fragment as m,jsx as h,jsxs as g}from"react/jsx-runtime";import _ from"@mui/icons-material/DarkMode";import v from"@mui/icons-material/LightMode";import y from"@mui/material/IconButton";import b from"@mui/material/Tooltip";import x from"@mui/material/Button";import S from"@mui/material/Menu";import C from"@mui/material/MenuItem";import w from"@mui/material/CircularProgress";import T from"@mui/material/Alert";import E from"@mui/material/CssBaseline";import{ThemeProvider as ee,createTheme as te,styled as D,useTheme as ne}from"@mui/material/styles";import{fillArray as re,truncate as O,wait as ie}from"@alextheman/utility";import ae from"@mui/material/Snackbar";import k from"@mui/material/Link";import oe from"@mui/icons-material/CloudUpload";import se from"@mui/icons-material/Delete";import A from"@mui/material/List";import j from"@mui/material/ListItem";import M from"@mui/material/ListItemText";import ce from"@mui/material/Popover";import{Link as N,useLocation as le}from"react-router-dom";import P from"@mui/material/ListItemButton";import ue from"@mui/material/BottomNavigation";import de from"@mui/material/BottomNavigationAction";import fe from"@mui/material/Paper";import pe from"@mui/icons-material/ChevronLeft";import me from"@mui/icons-material/ChevronRight";import he from"@mui/icons-material/Menu";import ge from"@mui/material/AppBar";import F from"@mui/material/Divider";import _e from"@mui/material/Drawer";import ve from"@mui/material/ListItemIcon";import ye from"@mui/material/Toolbar";import I from"@mui/material/Typography";import{stripIndent as be}from"common-tags";import{LiveEditor as xe,LiveError as Se,LivePreview as Ce,LiveProvider as we}from"react-live";import Te from"@mui/material/Skeleton";import Ee from"@mui/material/TableCell";import De from"@mui/material/TableRow";import{useFormContext as Oe}from"react-hook-form";import ke from"@mui/material/Switch";function Ae({isInitiallyOpen:a,onOpen:o,onClose:s,children:c,buttonStyles:u,buttonContents:d,buttonComponent:f=r,collapseProps:m,openIcon:_=h(t,{}),closedIcon:v=h(e,{}),useDefaultStyling:y=f===r}){let[b,x]=p(!!a);return l(()=>{b&&o?o():!b&&s&&s()},[b]),g(n,{children:[g(f,{onClick:()=>{x(e=>!e)},sx:y?{width:`100%`,display:`flex`,alignItems:`center`,justifyContent:`center`,paddingY:1.5,paddingX:2,textAlign:`center`,"&:hover":f===r?{backgroundColor:`action.hover`}:null,...u}:u,"aria-expanded":b,children:[d,b?_:v]}),h(i,{in:b,...m,children:c})]})}var je=Ae;const L=o(void 0);function R({strict:e=!0}={}){let t=c(L);if(e&&!t)throw Error(`DROPDOWN_MENU_NOT_FOUND`);return t}function Me({children:n,button:r=x,buttonProps:i,openIcon:a=h(t,{}),closedIcon:o=h(e,{})}){let[s,c]=p(null),l=d(()=>!!s,[s]);function u(){c(null)}return g(L.Provider,{value:{closeMenu:u,isDropdownOpen:l},children:[h(r,{"aria-controls":l?`dropdown-menu`:void 0,"aria-haspopup":`true`,"aria-expanded":l,endIcon:l?a:o,...i,onClick:e=>{e.defaultPrevented||c(e.currentTarget),i?.onClick&&i?.onClick(e)}}),h(S,{anchorEl:s,open:l,onClose:u,children:n})]})}var Ne=Me;function Pe({ref:e,href:t,children:n,onClick:r,...i}){let{closeMenu:a}=R();return h(C,{component:J,href:t,ref:e,...i,onClick:e=>{e.defaultPrevented||a(),r&&r(e)},children:n})}var Fe=Pe;function Ie({to:e,ref:t,children:n,onClick:r,...i}){let{closeMenu:a}=R();return h(C,{component:X,to:e,ref:t,...i,onClick:e=>{e.defaultPrevented||a(),r&&r(e)},children:n})}var Le=Ie;function Re({component:e,children:t,ref:n,onClick:r,...i}){let{closeMenu:a}=R();return h(C,{component:e??x,ref:n,...i,onClick:e=>{e.defaultPrevented||a(),r&&r(e)},children:t})}var ze=Re,Be=Ne;const z=o(void 0);function B({strict:e=!0}={}){let t=c(z);if(e&&!t)throw Error(`LOADER_PROVIDER_NOT_FOUND`);return t}function Ve({children:e,loadingComponent:t=h(w,{}),...n}){return h(z.Provider,{value:{loadingComponent:t,...n},children:e})}var He=Ve;function Ue({children:e,dataParser:t,loadingComponent:n}){let{isLoading:r,data:i,dataParser:a,loadingComponent:o,error:s}=B(),c=t??a;return r?h(m,{children:n??o}):s||i==null?h(m,{}):c?typeof e==`function`?h(m,{children:e(c(i))}):h(m,{children:e}):typeof e==`function`?h(m,{children:e(i)}):h(m,{children:e})}var V=Ue;function We({children:e,undefinedComponent:t,nullComponent:n,nullableComponent:r,logError:i}){let{isLoading:a,data:o,error:s,errorComponent:c,logError:l}=B(),u=i??l,d=f(!1),p=e??c;return s?(u&&!d.current&&(console.error(s),d.current=!0),typeof p==`function`?p(s):p?h(m,{children:p}):h(T,{severity:`error`,children:s?.message??`An unknown error has occured. Please try again later.`})):!a&&o==null?r?(u&&!d.current&&(console.error(`Data is nullable after loading.`),d.current=!0),h(m,{children:r})):o===void 0&&(u&&!d.current&&(console.error(`Data is undefined after loading. This could either be an issue with the query or you have not passed in the data to LoaderProvider. Please double-check that you have provided data.`),d.current=!0),t)?h(m,{children:t}):o===null&&(u&&!d.current&&(console.error(`Data is null after loading.`),d.current=!0),n)?h(m,{children:n}):h(T,{severity:`error`,children:`Failed to load data. Please try again later.`}):h(m,{})}var H=We,U=He;const W=o({toggleMode:()=>{},mode:`dark`});function G({strict:e=!0}={}){let t=c(W);if(e&&!t)throw Error(`MODE_PROVIDER_NOT_FOUND`);return t}function Ge({children:e,mode:t=`dark`}){let[n,r]=p(t),i=d(()=>te({palette:{mode:n}}),[n]);return h(W.Provider,{value:{mode:n,toggleMode:()=>{r(e=>e===`light`?`dark`:`light`)}},children:g(ee,{theme:i,children:[h(E,{}),e]})})}var Ke=Ge;const K=o({windowWidth:0,windowHeight:0,isLargeScreen:!1});function qe({strict:e=!0}={}){let t=c(K);if(e&&!t)throw Error(`SCREEN_SIZE_PROVIDER_NOT_FOUND`);return t}function Je({children:e,largeScreenWidth:t=669,largeScreenHeight:n=660}){let[r,i]=p(window.innerWidth),[a,o]=p(window.innerHeight);l(()=>{function e(){i(window.innerWidth),o(window.innerHeight)}return e(),window.addEventListener(`resize`,e),()=>{window.removeEventListener(`resize`,e)}},[]);let s=d(()=>r>t&&a>n,[r,a,t,n]);return h(K.Provider,{value:{isLargeScreen:s,windowWidth:r,windowHeight:a},children:e})}var Ye=Je;const q=o(void 0);function Xe({strict:e=!0}={}){let t=c(q);if(e&&!t)throw Error(`SNACKBAR_PROVIDER_NOT_FOUND`);return t}function Ze({children:e,autoHideDuration:t=5e3}){let[n,r]=p(!1),[i,a]=p(t),[o,s]=p(``),[c,l]=p(`info`);function u(e,n,i){r(!0),a(i??t),l(n??`info`),s(e)}async function d(){r(!1),await ie(.2),s(``)}return g(q.Provider,{value:{addSnackbar:u},children:[h(ae,{open:n,autoHideDuration:i,onClose:d,children:h(T,{onClose:d,severity:c,children:o})}),e]})}var Qe=Ze;function $e(){let{mode:e,toggleMode:t}=G();return h(b,{title:`Enable ${e===`dark`?`light`:`dark`} mode`,children:h(y,{sx:{marginLeft:`auto`},onClick:t,"aria-label":`Enable ${e===`dark`?`light`:`dark`} mode`,children:h(e===`dark`?v:_,{})})})}var et=$e;function tt({children:r,button:i=x,buttonChildren:a=`Menu`,buttonProps:o,isOpenIcon:s=h(t,{}),isClosedIcon:c=h(e,{}),onOpen:u,onClose:f}){let[m,_]=p(null),v=d(()=>!!m,[m]),y={...o,onClick:e=>{_(e.currentTarget)},"aria-controls":v?`dropdown-menu`:void 0,"aria-haspopup":`true`,"aria-expanded":v};return i===x&&(y.endIcon=v?s:c),l(()=>{v&&u?u():!v&&f&&f()},[v,u,f]),g(n,{children:[h(i,{...y,children:a}),h(S,{id:`dropdown-menu`,anchorEl:m,open:v,onClose:()=>{_(null)},children:typeof r==`function`?h(n,{children:r(()=>{_(null)})}):r})]})}var nt=tt;function rt({href:e,children:t,ref:n,...r}){return h(k,{component:`a`,href:e,ref:n,target:`_blank`,rel:`noopener noreferrer`,...r,children:t})}var J=rt;const it={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`},at=D(`input`)({clip:`rect(0 0 0 0)`,clipPath:`inset(50%)`,height:1,overflow:`hidden`,position:`absolute`,bottom:0,left:0,whiteSpace:`nowrap`,width:1}),ot=D(`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 st({onFileInput:e,label:t=`Upload files`,multiple:n,accept:r,useDropzone:i,...a}){let[o,s]=p(!1),c=g(x,{variant:`contained`,component:`label`,"aria-label":`File upload button`,onKeyDown:e=>{(e.key===`Enter`||e.key===` `)&&(e.preventDefault(),document.getElementById(`file-input`)?.click())},...a,startIcon:a.startIcon??h(oe,{}),children:[t,h(at,{id:`file-input`,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?h(ot,{$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:c}):c}var Y=st;function ct({files:e,setFiles:t,...r}){function i(e){t(t=>[...t,...e])}let a={...r,onFileInput:i};return a?.multiple===void 0&&(a.multiple=!0),g(n,{children:[h(Y,{...a}),h(A,{children:e.map(e=>h(j,{secondaryAction:h(y,{"aria-label":`Delete`,edge:`end`,onClick:()=>{t(t=>t.filter(t=>t!==e))},children:h(se,{})}),children:h(M,{primary:e.name})},e.name))})]})}var lt=ct;function ut({icon:e,onOpen:t,onClose:r,iconProps:i,children:a}){let[o,s]=p(null),c=!!o,l=u();function d(e){s(e.currentTarget),t&&t()}function f(){s(null),r&&r()}return g(n,{children:[h(e,{"aria-owns":c?l:void 0,"aria-haspopup":`true`,onMouseEnter:d,onMouseLeave:f,...i}),h(ce,{id:l,sx:{pointerEvents:`none`},open:c,anchorEl:o,anchorOrigin:{vertical:`bottom`,horizontal:`left`},transformOrigin:{vertical:`top`,horizontal:`left`},onClose:f,disableRestoreFocus:!0,children:a})]})}var dt=ut;function ft({to:e,children:t,ref:n,...r}){return h(k,{component:N,to:e,ref:n,...r,children:t})}var X=ft;function pt({children:e,...t}){return h(P,{component:X,...t,children:e})}var mt=pt;function ht({children:e,errorComponent:t,undefinedComponent:n,nullComponent:r,nullableComponent:i,loadingComponent:a=h(w,{}),...o}){return g(U,{loadingComponent:a,...o,children:[h(H,{undefinedComponent:n,nullComponent:r,nullableComponent:i,children:t}),h(V,{children:e})]})}var gt=ht;function _t({children:e,navItems:t}){let[r,i]=p(``);return g(m,{children:[h(n,{sx:{paddingBottom:7},children:e}),h(fe,{sx:{position:`fixed`,bottom:0,left:0,right:0},children:h(ue,{showLabels:!0,value:r,onChange:(e,t)=>{i(t)},children:t.map(e=>h(de,{...e,component:N},e.value))})})]})}var vt=_t;function Z(e){return{width:240,transition:e.transitions.create(`width`,{easing:e.transitions.easing.sharp,duration:e.transitions.duration.enteringScreen}),overflowX:`hidden`}}function Q(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 $=D(`div`)(({theme:e})=>({display:`flex`,alignItems:`center`,justifyContent:`flex-end`,padding:e.spacing(0,1),...e.mixins.toolbar})),yt=D(ge,{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})}}]})),bt=D(_e,{shouldForwardProp:e=>e!==`open`})(({theme:e})=>({width:240,flexShrink:0,whiteSpace:`nowrap`,boxSizing:`border-box`,variants:[{props:({open:e})=>e,style:{...Z(e),"& .MuiDrawer-paper":Z(e)}},{props:({open:e})=>!e,style:{...Q(e),"& .MuiDrawer-paper":Q(e)}}]}));function xt({title:e,navItems:t,children:r,headerElements:i}){let o=ne(),[s,c]=p(!0),l=le();function u(){c(!0)}function d(){c(!1)}return g(n,{sx:{display:`flex`},children:[h(E,{}),h(yt,{position:`fixed`,open:s,children:g(ye,{children:[h(y,{color:`inherit`,"aria-label":`open drawer`,onClick:u,edge:`start`,sx:[{marginRight:5},s&&{display:`none`}],children:h(he,{})}),h(I,{variant:`h6`,noWrap:!0,component:`div`,children:e}),i]})}),g(bt,{variant:`permanent`,open:s,children:[h($,{children:h(y,{onClick:d,children:o.direction===`rtl`?h(me,{}):h(pe,{})})}),h(F,{}),t.map(e=>g(a,{children:[g(A,{children:[h(I,{variant:s?`h5`:`h6`,paddingLeft:s?2:1,children:s?e.category:O(e.category,4)}),e.options.map(e=>h(j,{disablePadding:!0,sx:{display:`block`},children:g(P,{sx:[{minHeight:48,px:2.5},s?{justifyContent:`initial`}:{justifyContent:`center`}],component:N,to:e.to,selected:l.pathname===e.to,children:[h(ve,{sx:[{minWidth:0,justifyContent:`center`},s?{mr:3}:{mr:`auto`}],children:e.icon?e.icon:s?null:h(I,{children:O(e.label,4)})}),h(M,{primary:e.label,sx:[s?{opacity:1}:{opacity:0}]})]})},e.to))]}),h(F,{})]},e.category))]}),g(n,{component:`main`,sx:{flexGrow:1,p:3},children:[h($,{}),r]})]})}var St=xt;function Ct({text:e,sx:t,...n}){return h(m,{children:e.split(`
+import e from"@mui/icons-material/ArrowDropDown";import t from"@mui/icons-material/ArrowDropUp";import n from"@mui/material/Box";import r from"@mui/material/ButtonBase";import i from"@mui/material/Collapse";import{Fragment as a,createContext as o,useCallback as s,useContext as c,useEffect as l,useId as u,useMemo as d,useRef as f,useState as p}from"react";import{Fragment as m,jsx as h,jsxs as g}from"react/jsx-runtime";import _ from"@mui/icons-material/DarkMode";import v from"@mui/icons-material/LightMode";import y from"@mui/material/IconButton";import b from"@mui/material/Tooltip";import x from"@mui/material/Button";import S from"@mui/material/Menu";import C from"@mui/material/MenuItem";import w from"@mui/material/CircularProgress";import T from"@mui/material/Alert";import E from"@mui/material/CssBaseline";import{ThemeProvider as ee,createTheme as te,styled as D,useTheme as ne}from"@mui/material/styles";import{fillArray as re,truncate as O,wait as ie}from"@alextheman/utility";import ae from"@mui/material/Snackbar";import k from"@mui/material/Link";import oe from"@mui/icons-material/CloudUpload";import se from"@mui/icons-material/Delete";import A from"@mui/material/List";import j from"@mui/material/ListItem";import M from"@mui/material/ListItemText";import ce from"@mui/material/Popover";import{Link as N,useLocation as le}from"react-router-dom";import P from"@mui/material/ListItemButton";import ue from"@mui/material/BottomNavigation";import de from"@mui/material/BottomNavigationAction";import fe from"@mui/material/Paper";import pe from"@mui/icons-material/ChevronLeft";import me from"@mui/icons-material/ChevronRight";import he from"@mui/icons-material/Menu";import ge from"@mui/material/AppBar";import F from"@mui/material/Divider";import _e from"@mui/material/Drawer";import ve from"@mui/material/ListItemIcon";import ye from"@mui/material/Toolbar";import I from"@mui/material/Typography";import{stripIndent as be}from"common-tags";import{LiveEditor as xe,LiveError as Se,LivePreview as Ce,LiveProvider as we}from"react-live";import Te from"@mui/material/Skeleton";import Ee from"@mui/material/TableCell";import De from"@mui/material/TableRow";import{useFormContext as Oe}from"react-hook-form";import ke from"@mui/material/Switch";function Ae({isInitiallyOpen:a,onOpen:o,onClose:s,children:c,buttonStyles:u,buttonContents:d,buttonComponent:f=r,collapseProps:m,openIcon:_=h(t,{}),closedIcon:v=h(e,{}),useDefaultStyling:y=f===r}){let[b,x]=p(!!a);return l(()=>{b&&o?o():!b&&s&&s()},[b]),g(n,{children:[g(f,{onClick:()=>{x(e=>!e)},sx:y?{width:`100%`,display:`flex`,alignItems:`center`,justifyContent:`center`,paddingY:1.5,paddingX:2,textAlign:`center`,"&:hover":f===r?{backgroundColor:`action.hover`}:null,...u}:u,"aria-expanded":b,children:[d,b?_:v]}),h(i,{in:b,...m,children:c})]})}var je=Ae;const L=o(void 0);function R({strict:e=!0}={}){let t=c(L);if(e&&!t)throw Error(`DROPDOWN_MENU_NOT_FOUND`);return t}function Me({children:n,button:r=x,buttonProps:i,openIcon:a=h(t,{}),closedIcon:o=h(e,{})}){let[s,c]=p(null),l=d(()=>!!s,[s]);function u(){c(null)}return g(L.Provider,{value:{closeMenu:u,isDropdownOpen:l},children:[h(r,{"aria-controls":l?`dropdown-menu`:void 0,"aria-haspopup":`true`,"aria-expanded":l,endIcon:l?a:o,...i,onClick:e=>{e.defaultPrevented||c(e.currentTarget),i?.onClick&&i?.onClick(e)}}),h(S,{anchorEl:s,open:l,onClose:u,children:n})]})}var Ne=Me;function Pe({ref:e,href:t,children:n,onClick:r,...i}){let{closeMenu:a}=R();return h(C,{component:J,href:t,ref:e,...i,onClick:e=>{e.defaultPrevented||a(),r&&r(e)},children:n})}var Fe=Pe;function Ie({to:e,ref:t,children:n,onClick:r,...i}){let{closeMenu:a}=R();return h(C,{component:X,to:e,ref:t,...i,onClick:e=>{e.defaultPrevented||a(),r&&r(e)},children:n})}var Le=Ie;function Re({component:e,children:t,ref:n,onClick:r,...i}){let{closeMenu:a}=R();return h(C,{component:e??x,ref:n,...i,onClick:e=>{e.defaultPrevented||a(),r&&r(e)},children:t})}var ze=Re,Be=Ne;const z=o(void 0);function B({strict:e=!0}={}){let t=c(z);if(e&&!t)throw Error(`LOADER_PROVIDER_NOT_FOUND`);return t}function Ve({children:e,loadingComponent:t=h(w,{}),...n}){return h(z.Provider,{value:{loadingComponent:t,...n},children:e})}var He=Ve;function Ue({children:e,dataParser:t,loadingComponent:n}){let{isLoading:r,data:i,dataParser:a,loadingComponent:o,error:s}=B(),c=t??a;return r?h(m,{children:n??o}):s||i==null?h(m,{}):c?typeof e==`function`?h(m,{children:e(c(i))}):h(m,{children:e}):typeof e==`function`?h(m,{children:e(i)}):h(m,{children:e})}var V=Ue;function We({children:e,undefinedComponent:t,nullComponent:n,nullableComponent:r,logError:i}){let{isLoading:a,data:o,error:s,errorComponent:c,logError:l}=B(),u=i??l,d=f(!1),p=e??c;return s?(u&&!d.current&&(console.error(s),d.current=!0),typeof p==`function`?p(s):p?h(m,{children:p}):h(T,{severity:`error`,children:s?.message??`An unknown error has occured. Please try again later.`})):!a&&o==null?r?(u&&!d.current&&(console.error(`Data is nullable after loading.`),d.current=!0),h(m,{children:r})):o===void 0&&(u&&!d.current&&(console.error(`Data is undefined after loading. This could either be an issue with the query or you have not passed in the data to LoaderProvider. Please double-check that you have provided data.`),d.current=!0),t)?h(m,{children:t}):o===null&&(u&&!d.current&&(console.error(`Data is null after loading.`),d.current=!0),n)?h(m,{children:n}):h(T,{severity:`error`,children:`Failed to load data. Please try again later.`}):h(m,{})}var H=We,U=He;const W=o({toggleMode:()=>{},mode:`dark`});function G({strict:e=!0}={}){let t=c(W);if(e&&!t)throw Error(`MODE_PROVIDER_NOT_FOUND`);return t}function Ge({children:e,mode:t=`dark`}){let[n,r]=p(t),i=d(()=>te({palette:{mode:n}}),[n]);return h(W.Provider,{value:{mode:n,toggleMode:()=>{r(e=>e===`light`?`dark`:`light`)}},children:g(ee,{theme:i,children:[h(E,{}),e]})})}var Ke=Ge;const K=o({windowWidth:0,windowHeight:0,isLargeScreen:!1});function qe({strict:e=!0}={}){let t=c(K);if(e&&!t)throw Error(`SCREEN_SIZE_PROVIDER_NOT_FOUND`);return t}function Je({children:e,largeScreenWidth:t=669,largeScreenHeight:n=660}){let[r,i]=p(window.innerWidth),[a,o]=p(window.innerHeight);l(()=>{function e(){i(window.innerWidth),o(window.innerHeight)}return e(),window.addEventListener(`resize`,e),()=>{window.removeEventListener(`resize`,e)}},[]);let s=d(()=>r>t&&a>n,[r,a,t,n]);return h(K.Provider,{value:{isLargeScreen:s,windowWidth:r,windowHeight:a},children:e})}var Ye=Je;const q=o(void 0);function Xe({strict:e=!0}={}){let t=c(q);if(e&&!t)throw Error(`SNACKBAR_PROVIDER_NOT_FOUND`);return t}function Ze({children:e,autoHideDuration:t=5e3}){let[n,r]=p(!1),[i,a]=p(t),[o,s]=p(``),[c,l]=p(`info`);function u(e,n,i){r(!0),a(i??t),l(n??`info`),s(e)}async function d(){r(!1),await ie(.2),s(``)}return g(q.Provider,{value:{addSnackbar:u},children:[h(ae,{open:n,autoHideDuration:i,onClose:d,children:h(T,{onClose:d,severity:c,children:o})}),e]})}var Qe=Ze;function $e(){let{mode:e,toggleMode:t}=G();return h(b,{title:`Enable ${e===`dark`?`light`:`dark`} mode`,children:h(y,{sx:{marginLeft:`auto`},onClick:t,"aria-label":`Enable ${e===`dark`?`light`:`dark`} mode`,children:h(e===`dark`?v:_,{})})})}var et=$e;function tt({children:r,button:i=x,buttonChildren:a=`Menu`,buttonProps:o,isOpenIcon:s=h(t,{}),isClosedIcon:c=h(e,{}),onOpen:u,onClose:f}){let[m,_]=p(null),v=d(()=>!!m,[m]),y={...o,onClick:e=>{_(e.currentTarget)},"aria-controls":v?`dropdown-menu`:void 0,"aria-haspopup":`true`,"aria-expanded":v};return i===x&&(y.endIcon=v?s:c),l(()=>{v&&u?u():!v&&f&&f()},[v,u,f]),g(n,{children:[h(i,{...y,children:a}),h(S,{id:`dropdown-menu`,anchorEl:m,open:v,onClose:()=>{_(null)},children:typeof r==`function`?h(n,{children:r(()=>{_(null)})}):r})]})}var nt=tt;function rt({href:e,children:t,ref:n,...r}){return h(k,{component:`a`,href:e,ref:n,target:`_blank`,rel:`noopener noreferrer`,...r,children:t})}var J=rt;const it={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`},at=D(`input`)({clip:`rect(0 0 0 0)`,clipPath:`inset(50%)`,height:1,overflow:`hidden`,position:`absolute`,bottom:0,left:0,whiteSpace:`nowrap`,width:1}),ot=D(`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 st({onFileInput:e,label:t=`Upload files`,multiple:n,accept:r,useDropzone:i,...a}){let[o,s]=p(!1),c=g(x,{variant:`contained`,component:`label`,"aria-label":`File upload button`,onKeyDown:e=>{(e.key===`Enter`||e.key===` `)&&(e.preventDefault(),document.getElementById(`file-input`)?.click())},...a,startIcon:a.startIcon??h(oe,{}),children:[t,h(at,{id:`file-input`,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?h(ot,{$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:c}):c}var Y=st;function ct({files:e,setFiles:t,...r}){function i(e){t(t=>[...t,...e])}let a={...r,onFileInput:i};return a?.multiple===void 0&&(a.multiple=!0),g(n,{children:[h(Y,{...a}),h(A,{children:e.map(e=>h(j,{secondaryAction:h(y,{"aria-label":`Delete`,edge:`end`,onClick:()=>{t(t=>t.filter(t=>t!==e))},children:h(se,{})}),children:h(M,{primary:e.name})},e.name))})]})}var lt=ct;function ut({icon:e,onOpen:t,onClose:r,iconProps:i,children:a}){let[o,s]=p(null),c=!!o,l=u();function d(e){s(e.currentTarget),t&&t()}function f(){s(null),r&&r()}return g(n,{children:[h(e,{"aria-owns":c?l:void 0,"aria-haspopup":`true`,onMouseEnter:d,onMouseLeave:f,...i}),h(ce,{id:l,sx:{pointerEvents:`none`},open:c,anchorEl:o,anchorOrigin:{vertical:`bottom`,horizontal:`left`},transformOrigin:{vertical:`top`,horizontal:`left`},onClose:f,disableRestoreFocus:!0,children:a})]})}var dt=ut;function ft({to:e,children:t,ref:n,...r}){return h(k,{component:N,to:e,ref:n,...r,children:t})}var X=ft;function pt({children:e,...t}){return h(P,{component:X,...t,children:e})}var mt=pt;function ht({children:e,errorComponent:t,undefinedComponent:n,nullComponent:r,nullableComponent:i,logError:a,loadingComponent:o=h(w,{}),...s}){return g(U,{loadingComponent:o,...s,children:[h(H,{undefinedComponent:n,nullComponent:r,nullableComponent:i,logError:a,children:t}),h(V,{children:e})]})}var gt=ht;function _t({children:e,navItems:t}){let[r,i]=p(``);return g(m,{children:[h(n,{sx:{paddingBottom:7},children:e}),h(fe,{sx:{position:`fixed`,bottom:0,left:0,right:0},children:h(ue,{showLabels:!0,value:r,onChange:(e,t)=>{i(t)},children:t.map(e=>h(de,{...e,component:N},e.value))})})]})}var vt=_t;function Z(e){return{width:240,transition:e.transitions.create(`width`,{easing:e.transitions.easing.sharp,duration:e.transitions.duration.enteringScreen}),overflowX:`hidden`}}function Q(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 $=D(`div`)(({theme:e})=>({display:`flex`,alignItems:`center`,justifyContent:`flex-end`,padding:e.spacing(0,1),...e.mixins.toolbar})),yt=D(ge,{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})}}]})),bt=D(_e,{shouldForwardProp:e=>e!==`open`})(({theme:e})=>({width:240,flexShrink:0,whiteSpace:`nowrap`,boxSizing:`border-box`,variants:[{props:({open:e})=>e,style:{...Z(e),"& .MuiDrawer-paper":Z(e)}},{props:({open:e})=>!e,style:{...Q(e),"& .MuiDrawer-paper":Q(e)}}]}));function xt({title:e,navItems:t,children:r,headerElements:i}){let o=ne(),[s,c]=p(!0),l=le();function u(){c(!0)}function d(){c(!1)}return g(n,{sx:{display:`flex`},children:[h(E,{}),h(yt,{position:`fixed`,open:s,children:g(ye,{children:[h(y,{color:`inherit`,"aria-label":`open drawer`,onClick:u,edge:`start`,sx:[{marginRight:5},s&&{display:`none`}],children:h(he,{})}),h(I,{variant:`h6`,noWrap:!0,component:`div`,children:e}),i]})}),g(bt,{variant:`permanent`,open:s,children:[h($,{children:h(y,{onClick:d,children:o.direction===`rtl`?h(me,{}):h(pe,{})})}),h(F,{}),t.map(e=>g(a,{children:[g(A,{children:[h(I,{variant:s?`h5`:`h6`,paddingLeft:s?2:1,children:s?e.category:O(e.category,4)}),e.options.map(e=>h(j,{disablePadding:!0,sx:{display:`block`},children:g(P,{sx:[{minHeight:48,px:2.5},s?{justifyContent:`initial`}:{justifyContent:`center`}],component:N,to:e.to,selected:l.pathname===e.to,children:[h(ve,{sx:[{minWidth:0,justifyContent:`center`},s?{mr:3}:{mr:`auto`}],children:e.icon?e.icon:s?null:h(I,{children:O(e.label,4)})}),h(M,{primary:e.label,sx:[s?{opacity:1}:{opacity:0}]})]})},e.to))]}),h(F,{})]},e.category))]}),g(n,{component:`main`,sx:{flexGrow:1,p:3},children:[h($,{}),r]})]})}var St=xt;function Ct({text:e,sx:t,...n}){return h(m,{children:e.split(`
 `).map((e,r)=>h(I,{sx:{margin:1,...t},...n,children:e},r))})}var wt=Ct;function Tt({code:e,previewStyles:t,...r}){let{mode:i}=G(),a={backgroundColor:i===`dark`?`black`:`white`,border:.3,borderRadius:1,padding:2,borderColor:`darkgray`},o=t?{...a,...t}:{...a};return h(n,{sx:{borderRadius:1,border:.5,padding:2},children:g(we,{...r,code:be(e??``),children:[h(I,{variant:`h5`,children:`Code`}),h(n,{sx:{border:.3,borderRadius:.3,borderColor:`darkgray`},children:h(xe,{})}),h(`br`,{}),h(I,{variant:`h5`,children:`Result`}),g(n,{sx:o,children:[h(Ce,{}),h(Se,{})]})]})})}var Et=Tt;function Dt({columns:e}){return h(De,{children:re(e=>h(Ee,{children:h(Te,{})},e),e)})}var Ot=Dt;function kt({disableClean:e,label:t,...n}){let{formState:{disabled:r,isDirty:i,isSubmitting:a}}=Oe();return h(x,{color:`primary`,disabled:n.disabled||e&&!i||r,loading:a,type:`submit`,variant:`contained`,...n,children:t})}var At=kt;const jt=D(ke)(()=>({padding:8,"& .MuiSwitch-track":{borderRadius:11,"&::before, &::after":{content:`""`,position:`absolute`,top:`50%`,transform:`translateY(-50%)`,fontSize:16,width:28,height:28}}}));function Mt({checkedIcon:e,checkedIconStyles:t,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 h(jt,{checkedIcon:h(n,{sx:o,children:h(e,{style:{...s,...t}})}),icon:h(n,{sx:o,children:h(r,{style:{...s,...i}})}),...a})}var Nt=Mt;function Pt(e){let[t,n]=p(()=>{let t=window.location.hash.replace(`#`,``);return e&&t===``?e:t}),r=s(()=>{let t=window.location.hash.replace(`#`,``);n(e&&t===``?e:t)},[n,e]);return l(()=>(window.addEventListener(`hashchange`,r),()=>{window.removeEventListener(`hashchange`,r)}),[r]),[t,s(e=>{let n=typeof e==`function`?e(t):e;n!==t&&(window.location.hash=n)},[t])]}var Ft=Pt;export{je as CollapsableItem,et as DarkModeToggle,nt as DropdownMenu,Be as DropdownMenu2,Fe as DropdownMenuExternalLink,Le as DropdownMenuInternalLink,ze as DropdownMenuItem,J as ExternalLink,Y as FileInput,lt as FileInputList,it as FileType,dt as IconWithPopover,X as InternalLink,mt as ListItemInternalLink,gt as Loader,V as LoaderData,H as LoaderError,U as LoaderProvider,Ke as ModeProvider,vt as NavigationBottom,St as NavigationDrawer,wt as PopoverText,Et as ReactPlayground,Ye as ScreenSizeProvider,Ot as SkeletonRow,Qe as SnackbarProvider,At as SubmitButton,Nt as SwitchWithIcons,R as useDropdownMenu,Ft as useHash,G as useMode,qe as useScreenSize,Xe as useSnackbar};
 //# sourceMappingURL=index.js.map