@alextheman/components 5.9.0 → 6.1.0

package/dist/index.d.cts

@@ -1,4 +1,4 @@
-import * as react_jsx_runtime1 from "react/jsx-runtime";
+import * as react_jsx_runtime4 from "react/jsx-runtime";
 import { CollapseProps } from "@mui/material/Collapse";
 import { PaletteMode, SxProps, Theme } from "@mui/material/styles";
 import * as react0 from "react";
@@ -40,10 +40,10 @@ declare function CollapsableItem({
   openIcon,
   closedIcon,
   useDefaultStyling
-}: CollapsableItemProps): react_jsx_runtime1.JSX.Element;
+}: CollapsableItemProps): react_jsx_runtime4.JSX.Element;
 //#endregion
 //#region src/components/DarkModeToggle.d.ts
-declare function DarkModeToggle(): react_jsx_runtime1.JSX.Element;
+declare function DarkModeToggle(): react_jsx_runtime4.JSX.Element;
 //#endregion
 //#region src/components/DropdownMenu.d.ts
 interface DropdownMenuProps {
@@ -65,7 +65,7 @@ declare function DropdownMenu({
   isClosedIcon,
   onOpen,
   onClose
-}: DropdownMenuProps): react_jsx_runtime1.JSX.Element;
+}: DropdownMenuProps): react_jsx_runtime4.JSX.Element;
 //#endregion
 //#region src/components/ExternalLink.d.ts
 interface ExternalLinkProps extends Omit<LinkProps, "to" | "target" | "rel"> {
@@ -79,7 +79,7 @@ declare function ExternalLink({
   children,
   ref,
   ...linkProps
-}: ExternalLinkProps): react_jsx_runtime1.JSX.Element;
+}: ExternalLinkProps): react_jsx_runtime4.JSX.Element;
 //#endregion
 //#region src/components/FileInput.d.ts
 declare const FileType: {
@@ -108,7 +108,7 @@ declare function FileInput({
   accept,
   useDropzone,
   ...buttonProps
-}: FileInputProps): react_jsx_runtime1.JSX.Element;
+}: FileInputProps): react_jsx_runtime4.JSX.Element;
 //#endregion
 //#region src/components/FileInputList.d.ts
 interface FileInputListProps extends Omit<FileInputProps, "onFileInput"> {
@@ -119,7 +119,7 @@ declare function FileInputList({
   files,
   setFiles,
   ...fileInputProps
-}: FileInputListProps): react_jsx_runtime1.JSX.Element;
+}: FileInputListProps): react_jsx_runtime4.JSX.Element;
 //#endregion
 //#region src/components/IconWithPopover.d.ts
 interface IconWithPopoverProps {
@@ -137,7 +137,7 @@ declare function IconWithPopover({
   onClose,
   iconProps,
   children
-}: IconWithPopoverProps): react_jsx_runtime1.JSX.Element;
+}: IconWithPopoverProps): react_jsx_runtime4.JSX.Element;
 //#endregion
 //#region src/components/InternalLink.d.ts
 interface InternalLinkProps extends Omit<LinkProps, "href"> {
@@ -151,7 +151,7 @@ declare function InternalLink({
   children,
   ref,
   ...linkProps
-}: InternalLinkProps): react_jsx_runtime1.JSX.Element;
+}: InternalLinkProps): react_jsx_runtime4.JSX.Element;
 //#endregion
 //#region src/components/ListItemInternalLink.d.ts
 interface ListItemInternalLinkProps extends Omit<ListItemButtonProps, "href"> {
@@ -161,14 +161,14 @@ interface ListItemInternalLinkProps extends Omit<ListItemButtonProps, "href"> {
 declare function ListItemInternalLink({
   children,
   ...listItemButtonProps
-}: ListItemInternalLinkProps): react_jsx_runtime1.JSX.Element;
+}: ListItemInternalLinkProps): react_jsx_runtime4.JSX.Element;
 //#endregion
 //#region src/types/ContextHookOptions.d.ts
 interface ContextHookOptions<S extends boolean = true> {
   strict?: S;
 }
 //#endregion
-//#region src/providers/LoaderProvider/index.d.ts
+//#region src/providers/LoaderProvider/LoaderProvider.d.ts
 interface LoaderProviderBaseProps<T> {
   /** The current loading status (true if loading, false if not) */
   isLoading: boolean;
@@ -196,9 +196,6 @@ type LoaderContextValue<T> = LoaderProviderPropsWithNoError<T> | LoaderProviderP
 type LoaderProviderProps<T> = LoaderContextValue<T> & {
   children: ReactNode;
 };
-declare function useLoader<T, Strict extends boolean = true>({
-  strict
-}?: ContextHookOptions<Strict>): OptionalOnCondition<Strict, LoaderContextValue<T>>;
 /** 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.
  */
@@ -206,10 +203,10 @@ declare function LoaderProvider<T>({
   children,
   loadingComponent,
   ...contextProps
-}: LoaderProviderProps<T>): react_jsx_runtime1.JSX.Element;
+}: LoaderProviderProps<T>): react_jsx_runtime4.JSX.Element;
 //#endregion
 //#region src/providers/LoaderProvider/LoaderData.d.ts
-interface LoaderDataBaseProps<T> {
+interface LoaderDataProps<T> {
   /** 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.
    */
@@ -219,32 +216,12 @@ interface LoaderDataBaseProps<T> {
   /** The component to show when the data is being fetched. */
   loadingComponent?: ReactNode;
 }
-interface LoaderDataPropsOnNullable<T> extends LoaderDataBaseProps<T> {
-  onUndefined?: never;
-  onNull?: never;
-  /** A function to run if the data is undefined or null, and not loading. This may either return React components or nothing.
-   * @deprecated Please use the nullableComponent prop on LoaderError instead */
-  onNullable: () => ReactNode | void;
-}
-interface LoaderDataPropsOnUndefinedOrNull<T> extends LoaderDataBaseProps<T> {
-  /** A function to run if the data is undefined and not loading. This may either return React components or nothing.
-   * @deprecated Please use the nullableComponent prop on LoaderError instead */
-  onUndefined?: () => ReactNode | void;
-  /** A function to run if the data is null and not loading. This may either return React components or nothing.
-   * @deprecated Please use the nullableComponent prop on LoaderError instead */
-  onNull?: () => ReactNode | void;
-  onNullable?: never;
-}
-type LoaderDataProps<T> = LoaderDataPropsOnUndefinedOrNull<T> | LoaderDataPropsOnNullable<T>;
 /** The component responsible for showing the data provided by LoaderProvider. */
 declare function LoaderData<T>({
   children,
   dataParser: loaderDataParser,
-  loadingComponent,
-  onNullable,
-  onUndefined,
-  onNull
-}: LoaderDataProps<T>): string | number | bigint | boolean | react_jsx_runtime1.JSX.Element | Iterable<ReactNode> | Promise<string | number | bigint | boolean | react0.ReactPortal | react0.ReactElement<unknown, string | react0.JSXElementConstructor<any>> | Iterable<ReactNode> | null | undefined>;
+  loadingComponent
+}: LoaderDataProps<T>): react_jsx_runtime4.JSX.Element;
 //#endregion
 //#region src/providers/LoaderProvider/LoaderError.d.ts
 interface LoaderErrorBaseProps {
@@ -274,17 +251,14 @@ interface LoaderErrorPropsWithNullable extends LoaderErrorBaseProps {
 type LoaderErrorProps = LoaderErrorPropsWithUndefinedOrNull | LoaderErrorPropsWithNullable;
 /** The component responsible for showing any errors provided by LoaderProvider. */
 declare function LoaderError({
-  errorComponent: propsErrorComponent,
   children,
   undefinedComponent,
   nullComponent,
   nullableComponent,
   logError: propsLogError
-}: LoaderErrorProps): string | number | bigint | boolean | react_jsx_runtime1.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_runtime4.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
-/** @deprecated Please use `PaletteMode` from `@mui/material/styles` instead. */
-type Mode = "light" | "dark";
 interface ModeContextValue {
   toggleMode: () => void;
   mode: PaletteMode;
@@ -299,7 +273,7 @@ interface ModeProviderProps {
 declare function ModeProvider({
   children,
   mode: modeProp
-}: ModeProviderProps): react_jsx_runtime1.JSX.Element;
+}: ModeProviderProps): react_jsx_runtime4.JSX.Element;
 //#endregion
 //#region src/providers/ScreenSizeProvider.d.ts
 interface ScreenSizeProps {
@@ -319,7 +293,7 @@ declare function ScreenSizeProvider({
   children,
   largeScreenWidth,
   largeScreenHeight
-}: ScreenSizeProps): react_jsx_runtime1.JSX.Element;
+}: ScreenSizeProps): react_jsx_runtime4.JSX.Element;
 //#endregion
 //#region src/providers/SnackbarProvider.d.ts
 interface SnackbarProviderProps {
@@ -335,7 +309,7 @@ declare function useSnackbar<Strict extends boolean = true>({
 declare function SnackbarProvider({
   children,
   autoHideDuration
-}: SnackbarProviderProps): react_jsx_runtime1.JSX.Element;
+}: SnackbarProviderProps): react_jsx_runtime4.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">;
@@ -350,7 +324,7 @@ declare function Loader<T>({
   nullableComponent,
   loadingComponent,
   ...loaderProviderProps
-}: LoaderProps<T>): react_jsx_runtime1.JSX.Element;
+}: LoaderProps<T>): react_jsx_runtime4.JSX.Element;
 //#endregion
 //#region src/components/NavigationBottom.d.ts
 interface NavItemBottom {
@@ -366,7 +340,7 @@ interface NavigationBottomProps {
 declare function NavigationBottom({
   children,
   navItems
-}: NavigationBottomProps): react_jsx_runtime1.JSX.Element;
+}: NavigationBottomProps): react_jsx_runtime4.JSX.Element;
 //#endregion
 //#region src/components/NavigationDrawer.d.ts
 interface NavMenuItem {
@@ -388,7 +362,7 @@ declare function NavigationDrawer({
   navItems,
   children,
   headerElements
-}: NavigationDrawerProps): react_jsx_runtime1.JSX.Element;
+}: NavigationDrawerProps): react_jsx_runtime4.JSX.Element;
 //#endregion
 //#region src/components/PopoverText.d.ts
 interface PopoverTextProps extends TypographyProps {
@@ -398,7 +372,7 @@ declare function PopoverText({
   text,
   sx,
   ...typographyProps
-}: PopoverTextProps): react_jsx_runtime1.JSX.Element;
+}: PopoverTextProps): react_jsx_runtime4.JSX.Element;
 //#endregion
 //#region src/components/ReactPlayground.d.ts
 interface ReactPlaygroundProps extends ComponentProps<typeof LiveProvider> {
@@ -408,7 +382,7 @@ declare function ReactPlayground({
   code,
   previewStyles,
   ...liveProviderProps
-}: ReactPlaygroundProps): react_jsx_runtime1.JSX.Element;
+}: ReactPlaygroundProps): react_jsx_runtime4.JSX.Element;
 //#endregion
 //#region src/components/SkeletonRow.d.ts
 interface SkeletonRowProps {
@@ -416,7 +390,7 @@ interface SkeletonRowProps {
 }
 declare function SkeletonRow({
   columns
-}: SkeletonRowProps): react_jsx_runtime1.JSX.Element;
+}: SkeletonRowProps): react_jsx_runtime4.JSX.Element;
 //#endregion
 //#region src/components/SubmitButton.d.ts
 interface SubmitButtonProps extends Omit<ButtonProps, "type"> {
@@ -427,7 +401,7 @@ declare function SubmitButton({
   disableClean,
   label,
   ...buttonProps
-}: SubmitButtonProps): react_jsx_runtime1.JSX.Element;
+}: SubmitButtonProps): react_jsx_runtime4.JSX.Element;
 //#endregion
 //#region src/components/SwitchWithIcons.d.ts
 interface SwitchWithIconsProps extends Omit<SwitchProps, "icon" | "checkedIcon"> {
@@ -446,10 +420,10 @@ declare function SwitchWithIcons({
   uncheckedIcon: UncheckedIcon,
   uncheckedIconStyles,
   ...switchProps
-}: SwitchWithIconsProps): react_jsx_runtime1.JSX.Element;
+}: SwitchWithIconsProps): react_jsx_runtime4.JSX.Element;
 //#endregion
 //#region src/hooks/useHash.d.ts
 declare function useHash<S extends string>(initialHash: S | undefined): [S, Dispatch<SetStateAction<S>>];
 //#endregion
-export { CollapsableItem, type CollapsableItemProps, ContextHookOptions, DarkModeToggle, DropdownMenu, type DropdownMenuProps, ExternalLink, type ExternalLinkProps, FileInput, FileInputList, type FileInputListProps, type FileInputProps, FileType, IconWithPopover, type IconWithPopoverProps, InternalLink, type InternalLinkProps, ListItemInternalLink, type ListItemInternalLinkProps, Loader, type LoaderContextValue, LoaderData, type LoaderDataBaseProps, type LoaderDataProps, type LoaderDataPropsOnNullable, type LoaderDataPropsOnUndefinedOrNull, LoaderError, type LoaderErrorBaseProps, type LoaderErrorProps, type LoaderErrorPropsWithNullable, type LoaderErrorPropsWithUndefinedOrNull, type LoaderProps, LoaderProvider, type LoaderProviderBaseProps, type LoaderProviderProps, type LoaderProviderPropsWithError, type LoaderProviderPropsWithNoError, type Mode, ModeProvider, type ModeProviderProps, type NavItemBottom, type NavMenuItem, NavigationBottom, type NavigationBottomProps, NavigationDrawer, type NavigationDrawerProps, PopoverText, type PopoverTextProps, ReactPlayground, type ReactPlaygroundProps, type ScreenSizeContextValue, type ScreenSizeProps, ScreenSizeProvider, SkeletonRow, type SkeletonRowProps, SnackbarProvider, type SnackbarProviderProps, SubmitButton, type SubmitButtonProps, SwitchWithIcons, type SwitchWithIconsProps, useHash, useLoader, useMode, useScreenSize, useSnackbar };
+export { CollapsableItem, type CollapsableItemProps, ContextHookOptions, DarkModeToggle, DropdownMenu, type DropdownMenuProps, ExternalLink, type ExternalLinkProps, FileInput, FileInputList, type FileInputListProps, type FileInputProps, FileType, IconWithPopover, type IconWithPopoverProps, InternalLink, type InternalLinkProps, ListItemInternalLink, type ListItemInternalLinkProps, Loader, LoaderData, type LoaderDataProps, LoaderError, type LoaderErrorBaseProps, type LoaderErrorProps, type LoaderErrorPropsWithNullable, type LoaderErrorPropsWithUndefinedOrNull, type LoaderProps, LoaderProvider, type LoaderProviderBaseProps, type LoaderProviderProps, type LoaderProviderPropsWithError, type LoaderProviderPropsWithNoError, ModeProvider, type ModeProviderProps, type NavItemBottom, type NavMenuItem, NavigationBottom, type NavigationBottomProps, NavigationDrawer, type NavigationDrawerProps, PopoverText, type PopoverTextProps, ReactPlayground, type ReactPlaygroundProps, type ScreenSizeContextValue, type ScreenSizeProps, ScreenSizeProvider, SkeletonRow, type SkeletonRowProps, SnackbarProvider, type SnackbarProviderProps, SubmitButton, type SubmitButtonProps, SwitchWithIcons, type SwitchWithIconsProps, useHash, useMode, useScreenSize, useSnackbar };
 //# sourceMappingURL=index.d.cts.map

package/dist/index.d.ts

@@ -1,7 +1,7 @@
 import { CollapseProps } from "@mui/material/Collapse";
 import * as react0 from "react";
 import { CSSProperties, ComponentProps, ComponentType, Dispatch, ElementType, JSX, ReactNode, Ref, SetStateAction } from "react";
-import * as react_jsx_runtime6 from "react/jsx-runtime";
+import * as react_jsx_runtime2 from "react/jsx-runtime";
 import { AlertColor } from "@mui/material/Alert";
 import { PaletteMode, SxProps, Theme } from "@mui/material/styles";
 import { OptionalOnCondition } from "@alextheman/utility";
@@ -40,10 +40,10 @@ declare function CollapsableItem({
   openIcon,
   closedIcon,
   useDefaultStyling
-}: CollapsableItemProps): react_jsx_runtime6.JSX.Element;
+}: CollapsableItemProps): react_jsx_runtime2.JSX.Element;
 //#endregion
 //#region src/components/DarkModeToggle.d.ts
-declare function DarkModeToggle(): react_jsx_runtime6.JSX.Element;
+declare function DarkModeToggle(): react_jsx_runtime2.JSX.Element;
 //#endregion
 //#region src/components/DropdownMenu.d.ts
 interface DropdownMenuProps {
@@ -65,7 +65,7 @@ declare function DropdownMenu({
   isClosedIcon,
   onOpen,
   onClose
-}: DropdownMenuProps): react_jsx_runtime6.JSX.Element;
+}: DropdownMenuProps): react_jsx_runtime2.JSX.Element;
 //#endregion
 //#region src/components/ExternalLink.d.ts
 interface ExternalLinkProps extends Omit<LinkProps, "to" | "target" | "rel"> {
@@ -79,7 +79,7 @@ declare function ExternalLink({
   children,
   ref,
   ...linkProps
-}: ExternalLinkProps): react_jsx_runtime6.JSX.Element;
+}: ExternalLinkProps): react_jsx_runtime2.JSX.Element;
 //#endregion
 //#region src/components/FileInput.d.ts
 declare const FileType: {
@@ -108,7 +108,7 @@ declare function FileInput({
   accept,
   useDropzone,
   ...buttonProps
-}: FileInputProps): react_jsx_runtime6.JSX.Element;
+}: FileInputProps): react_jsx_runtime2.JSX.Element;
 //#endregion
 //#region src/components/FileInputList.d.ts
 interface FileInputListProps extends Omit<FileInputProps, "onFileInput"> {
@@ -119,7 +119,7 @@ declare function FileInputList({
   files,
   setFiles,
   ...fileInputProps
-}: FileInputListProps): react_jsx_runtime6.JSX.Element;
+}: FileInputListProps): react_jsx_runtime2.JSX.Element;
 //#endregion
 //#region src/components/IconWithPopover.d.ts
 interface IconWithPopoverProps {
@@ -137,7 +137,7 @@ declare function IconWithPopover({
   onClose,
   iconProps,
   children
-}: IconWithPopoverProps): react_jsx_runtime6.JSX.Element;
+}: IconWithPopoverProps): react_jsx_runtime2.JSX.Element;
 //#endregion
 //#region src/components/InternalLink.d.ts
 interface InternalLinkProps extends Omit<LinkProps, "href"> {
@@ -151,7 +151,7 @@ declare function InternalLink({
   children,
   ref,
   ...linkProps
-}: InternalLinkProps): react_jsx_runtime6.JSX.Element;
+}: InternalLinkProps): react_jsx_runtime2.JSX.Element;
 //#endregion
 //#region src/components/ListItemInternalLink.d.ts
 interface ListItemInternalLinkProps extends Omit<ListItemButtonProps, "href"> {
@@ -161,14 +161,14 @@ interface ListItemInternalLinkProps extends Omit<ListItemButtonProps, "href"> {
 declare function ListItemInternalLink({
   children,
   ...listItemButtonProps
-}: ListItemInternalLinkProps): react_jsx_runtime6.JSX.Element;
+}: ListItemInternalLinkProps): react_jsx_runtime2.JSX.Element;
 //#endregion
 //#region src/types/ContextHookOptions.d.ts
 interface ContextHookOptions<S extends boolean = true> {
   strict?: S;
 }
 //#endregion
-//#region src/providers/LoaderProvider/index.d.ts
+//#region src/providers/LoaderProvider/LoaderProvider.d.ts
 interface LoaderProviderBaseProps<T> {
   /** The current loading status (true if loading, false if not) */
   isLoading: boolean;
@@ -196,9 +196,6 @@ type LoaderContextValue<T> = LoaderProviderPropsWithNoError<T> | LoaderProviderP
 type LoaderProviderProps<T> = LoaderContextValue<T> & {
   children: ReactNode;
 };
-declare function useLoader<T, Strict extends boolean = true>({
-  strict
-}?: ContextHookOptions<Strict>): OptionalOnCondition<Strict, LoaderContextValue<T>>;
 /** 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.
  */
@@ -206,10 +203,10 @@ declare function LoaderProvider<T>({
   children,
   loadingComponent,
   ...contextProps
-}: LoaderProviderProps<T>): react_jsx_runtime6.JSX.Element;
+}: LoaderProviderProps<T>): react_jsx_runtime2.JSX.Element;
 //#endregion
 //#region src/providers/LoaderProvider/LoaderData.d.ts
-interface LoaderDataBaseProps<T> {
+interface LoaderDataProps<T> {
   /** 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.
    */
@@ -219,32 +216,12 @@ interface LoaderDataBaseProps<T> {
   /** The component to show when the data is being fetched. */
   loadingComponent?: ReactNode;
 }
-interface LoaderDataPropsOnNullable<T> extends LoaderDataBaseProps<T> {
-  onUndefined?: never;
-  onNull?: never;
-  /** A function to run if the data is undefined or null, and not loading. This may either return React components or nothing.
-   * @deprecated Please use the nullableComponent prop on LoaderError instead */
-  onNullable: () => ReactNode | void;
-}
-interface LoaderDataPropsOnUndefinedOrNull<T> extends LoaderDataBaseProps<T> {
-  /** A function to run if the data is undefined and not loading. This may either return React components or nothing.
-   * @deprecated Please use the nullableComponent prop on LoaderError instead */
-  onUndefined?: () => ReactNode | void;
-  /** A function to run if the data is null and not loading. This may either return React components or nothing.
-   * @deprecated Please use the nullableComponent prop on LoaderError instead */
-  onNull?: () => ReactNode | void;
-  onNullable?: never;
-}
-type LoaderDataProps<T> = LoaderDataPropsOnUndefinedOrNull<T> | LoaderDataPropsOnNullable<T>;
 /** The component responsible for showing the data provided by LoaderProvider. */
 declare function LoaderData<T>({
   children,
   dataParser: loaderDataParser,
-  loadingComponent,
-  onNullable,
-  onUndefined,
-  onNull
-}: LoaderDataProps<T>): string | number | bigint | boolean | react_jsx_runtime6.JSX.Element | Iterable<ReactNode> | Promise<string | number | bigint | boolean | react0.ReactPortal | react0.ReactElement<unknown, string | react0.JSXElementConstructor<any>> | Iterable<ReactNode> | null | undefined>;
+  loadingComponent
+}: LoaderDataProps<T>): react_jsx_runtime2.JSX.Element;
 //#endregion
 //#region src/providers/LoaderProvider/LoaderError.d.ts
 interface LoaderErrorBaseProps {
@@ -274,17 +251,14 @@ interface LoaderErrorPropsWithNullable extends LoaderErrorBaseProps {
 type LoaderErrorProps = LoaderErrorPropsWithUndefinedOrNull | LoaderErrorPropsWithNullable;
 /** The component responsible for showing any errors provided by LoaderProvider. */
 declare function LoaderError({
-  errorComponent: propsErrorComponent,
   children,
   undefinedComponent,
   nullComponent,
   nullableComponent,
   logError: propsLogError
-}: LoaderErrorProps): string | number | bigint | boolean | react_jsx_runtime6.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_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;
 //#endregion
 //#region src/providers/ModeProvider.d.ts
-/** @deprecated Please use `PaletteMode` from `@mui/material/styles` instead. */
-type Mode = "light" | "dark";
 interface ModeContextValue {
   toggleMode: () => void;
   mode: PaletteMode;
@@ -299,7 +273,7 @@ interface ModeProviderProps {
 declare function ModeProvider({
   children,
   mode: modeProp
-}: ModeProviderProps): react_jsx_runtime6.JSX.Element;
+}: ModeProviderProps): react_jsx_runtime2.JSX.Element;
 //#endregion
 //#region src/providers/ScreenSizeProvider.d.ts
 interface ScreenSizeProps {
@@ -319,7 +293,7 @@ declare function ScreenSizeProvider({
   children,
   largeScreenWidth,
   largeScreenHeight
-}: ScreenSizeProps): react_jsx_runtime6.JSX.Element;
+}: ScreenSizeProps): react_jsx_runtime2.JSX.Element;
 //#endregion
 //#region src/providers/SnackbarProvider.d.ts
 interface SnackbarProviderProps {
@@ -335,7 +309,7 @@ declare function useSnackbar<Strict extends boolean = true>({
 declare function SnackbarProvider({
   children,
   autoHideDuration
-}: SnackbarProviderProps): react_jsx_runtime6.JSX.Element;
+}: SnackbarProviderProps): react_jsx_runtime2.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">;
@@ -350,7 +324,7 @@ declare function Loader<T>({
   nullableComponent,
   loadingComponent,
   ...loaderProviderProps
-}: LoaderProps<T>): react_jsx_runtime6.JSX.Element;
+}: LoaderProps<T>): react_jsx_runtime2.JSX.Element;
 //#endregion
 //#region src/components/NavigationBottom.d.ts
 interface NavItemBottom {
@@ -366,7 +340,7 @@ interface NavigationBottomProps {
 declare function NavigationBottom({
   children,
   navItems
-}: NavigationBottomProps): react_jsx_runtime6.JSX.Element;
+}: NavigationBottomProps): react_jsx_runtime2.JSX.Element;
 //#endregion
 //#region src/components/NavigationDrawer.d.ts
 interface NavMenuItem {
@@ -388,7 +362,7 @@ declare function NavigationDrawer({
   navItems,
   children,
   headerElements
-}: NavigationDrawerProps): react_jsx_runtime6.JSX.Element;
+}: NavigationDrawerProps): react_jsx_runtime2.JSX.Element;
 //#endregion
 //#region src/components/PopoverText.d.ts
 interface PopoverTextProps extends TypographyProps {
@@ -398,7 +372,7 @@ declare function PopoverText({
   text,
   sx,
   ...typographyProps
-}: PopoverTextProps): react_jsx_runtime6.JSX.Element;
+}: PopoverTextProps): react_jsx_runtime2.JSX.Element;
 //#endregion
 //#region src/components/ReactPlayground.d.ts
 interface ReactPlaygroundProps extends ComponentProps<typeof LiveProvider> {
@@ -408,7 +382,7 @@ declare function ReactPlayground({
   code,
   previewStyles,
   ...liveProviderProps
-}: ReactPlaygroundProps): react_jsx_runtime6.JSX.Element;
+}: ReactPlaygroundProps): react_jsx_runtime2.JSX.Element;
 //#endregion
 //#region src/components/SkeletonRow.d.ts
 interface SkeletonRowProps {
@@ -416,7 +390,7 @@ interface SkeletonRowProps {
 }
 declare function SkeletonRow({
   columns
-}: SkeletonRowProps): react_jsx_runtime6.JSX.Element;
+}: SkeletonRowProps): react_jsx_runtime2.JSX.Element;
 //#endregion
 //#region src/components/SubmitButton.d.ts
 interface SubmitButtonProps extends Omit<ButtonProps, "type"> {
@@ -427,7 +401,7 @@ declare function SubmitButton({
   disableClean,
   label,
   ...buttonProps
-}: SubmitButtonProps): react_jsx_runtime6.JSX.Element;
+}: SubmitButtonProps): react_jsx_runtime2.JSX.Element;
 //#endregion
 //#region src/components/SwitchWithIcons.d.ts
 interface SwitchWithIconsProps extends Omit<SwitchProps, "icon" | "checkedIcon"> {
@@ -446,10 +420,10 @@ declare function SwitchWithIcons({
   uncheckedIcon: UncheckedIcon,
   uncheckedIconStyles,
   ...switchProps
-}: SwitchWithIconsProps): react_jsx_runtime6.JSX.Element;
+}: SwitchWithIconsProps): react_jsx_runtime2.JSX.Element;
 //#endregion
 //#region src/hooks/useHash.d.ts
 declare function useHash<S extends string>(initialHash: S | undefined): [S, Dispatch<SetStateAction<S>>];
 //#endregion
-export { CollapsableItem, type CollapsableItemProps, ContextHookOptions, DarkModeToggle, DropdownMenu, type DropdownMenuProps, ExternalLink, type ExternalLinkProps, FileInput, FileInputList, type FileInputListProps, type FileInputProps, FileType, IconWithPopover, type IconWithPopoverProps, InternalLink, type InternalLinkProps, ListItemInternalLink, type ListItemInternalLinkProps, Loader, type LoaderContextValue, LoaderData, type LoaderDataBaseProps, type LoaderDataProps, type LoaderDataPropsOnNullable, type LoaderDataPropsOnUndefinedOrNull, LoaderError, type LoaderErrorBaseProps, type LoaderErrorProps, type LoaderErrorPropsWithNullable, type LoaderErrorPropsWithUndefinedOrNull, type LoaderProps, LoaderProvider, type LoaderProviderBaseProps, type LoaderProviderProps, type LoaderProviderPropsWithError, type LoaderProviderPropsWithNoError, type Mode, ModeProvider, type ModeProviderProps, type NavItemBottom, type NavMenuItem, NavigationBottom, type NavigationBottomProps, NavigationDrawer, type NavigationDrawerProps, PopoverText, type PopoverTextProps, ReactPlayground, type ReactPlaygroundProps, type ScreenSizeContextValue, type ScreenSizeProps, ScreenSizeProvider, SkeletonRow, type SkeletonRowProps, SnackbarProvider, type SnackbarProviderProps, SubmitButton, type SubmitButtonProps, SwitchWithIcons, type SwitchWithIconsProps, useHash, useLoader, useMode, useScreenSize, useSnackbar };
+export { CollapsableItem, type CollapsableItemProps, ContextHookOptions, DarkModeToggle, DropdownMenu, type DropdownMenuProps, ExternalLink, type ExternalLinkProps, FileInput, FileInputList, type FileInputListProps, type FileInputProps, FileType, IconWithPopover, type IconWithPopoverProps, InternalLink, type InternalLinkProps, ListItemInternalLink, type ListItemInternalLinkProps, Loader, LoaderData, type LoaderDataProps, LoaderError, type LoaderErrorBaseProps, type LoaderErrorProps, type LoaderErrorPropsWithNullable, type LoaderErrorPropsWithUndefinedOrNull, type LoaderProps, LoaderProvider, type LoaderProviderBaseProps, type LoaderProviderProps, type LoaderProviderPropsWithError, type LoaderProviderPropsWithNoError, ModeProvider, type ModeProviderProps, type NavItemBottom, type NavMenuItem, NavigationBottom, type NavigationBottomProps, NavigationDrawer, type NavigationDrawerProps, PopoverText, type PopoverTextProps, ReactPlayground, type ReactPlaygroundProps, type ScreenSizeContextValue, type ScreenSizeProps, ScreenSizeProvider, SkeletonRow, type SkeletonRowProps, SnackbarProvider, type SnackbarProviderProps, SubmitButton, type SubmitButtonProps, SwitchWithIcons, type SwitchWithIconsProps, useHash, useMode, useScreenSize, useSnackbar };
 //# sourceMappingURL=index.d.ts.map

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/CircularProgress";import S from"@mui/material/Alert";import C from"@mui/material/CssBaseline";import{ThemeProvider as ee,createTheme as te,styled as w,useTheme as ne}from"@mui/material/styles";import{fillArray as re,truncate as T,wait as ie}from"@alextheman/utility";import ae from"@mui/material/Snackbar";import E from"@mui/material/Button";import D from"@mui/material/Menu";import O from"@mui/material/Link";import oe from"@mui/icons-material/CloudUpload";import se from"@mui/icons-material/Delete";import k from"@mui/material/List";import A from"@mui/material/ListItem";import j from"@mui/material/ListItemText";import ce from"@mui/material/Popover";import{Link as M,useLocation as le}from"react-router-dom";import N 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 P from"@mui/material/Divider";import F from"@mui/material/Drawer";import I from"@mui/material/ListItemIcon";import L from"@mui/material/Toolbar";import R from"@mui/material/Typography";import{stripIndent as _e}from"common-tags";import{LiveEditor as ve,LiveError as ye,LivePreview as be,LiveProvider as xe}from"react-live";import Se from"@mui/material/Skeleton";import Ce from"@mui/material/TableCell";import we from"@mui/material/TableRow";import{useFormContext as Te}from"react-hook-form";import Ee from"@mui/material/Switch";function De({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 Oe=De;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 ke({children:e,loadingComponent:t=h(x,{}),...n}){return h(z.Provider,{value:{loadingComponent:t,...n},children:e})}var V=ke;function Ae({children:e,dataParser:t,loadingComponent:n,onNullable:r,onUndefined:i,onNull:a}){let{isLoading:o,data:s,dataParser:c,loadingComponent:l,error:u}=B(),d=t??c;return o?h(m,{children:n??l}):u?h(m,{}):s==null?r?r()??h(m,{}):s===void 0&&i?i()??h(m,{}):s===null&&a?a()??h(m,{}):h(m,{}):d?typeof e==`function`?h(m,{children:e(d(s))}):h(m,{children:e}):typeof e==`function`?h(m,{children:e(s)}):h(m,{children:e})}var H=Ae;function je({errorComponent:e,children:t,undefinedComponent:n,nullComponent:r,nullableComponent:i,logError:a}){let{isLoading:o,data:s,error:c,errorComponent:l,logError:u}=B(),d=a??u,p=f(!1),g=t??e??l;return c?(d&&!p.current&&(console.error(c),p.current=!0),typeof g==`function`?g(c):g?h(m,{children:g}):h(S,{severity:`error`,children:c?.message??`An unknown error has occured. Please try again later.`})):!o&&s==null?i?(d&&!p.current&&(console.error(`Data is nullable after loading.`),p.current=!0),h(m,{children:i})):s===void 0&&(d&&!p.current&&(console.error(`Data is undefined after loading. This could either be an issue with the query or you have not passed in the data to LoaderProvider. Please double-check that you have provided data.`),p.current=!0),n)?h(m,{children:n}):s===null&&(d&&!p.current&&(console.error(`Data is null after loading.`),p.current=!0),r)?h(m,{children:r}):h(S,{severity:`error`,children:`Failed to load data. Please try again later.`}):h(m,{})}var U=je;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 Me({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(C,{}),e]})})}var Ne=Me;const K=o({windowWidth:0,windowHeight:0,isLargeScreen:!1});function Pe({strict:e=!0}={}){let t=c(K);if(e&&!t)throw Error(`SCREEN_SIZE_PROVIDER_NOT_FOUND`);return t}function Fe({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 Ie=Fe;const q=o(void 0);function Le({strict:e=!0}={}){let t=c(q);if(e&&!t)throw Error(`SNACKBAR_PROVIDER_NOT_FOUND`);return t}function Re({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(S,{onClose:d,severity:c,children:o})}),e]})}var ze=Re;function Be(){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 Ve=Be;function He({children:r,button:i=E,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===E&&(y.endIcon=v?s:c),l(()=>{v&&u?u():!v&&f&&f()},[v,u,f]),g(n,{children:[h(i,{...y,children:a}),h(D,{id:`dropdown-menu`,anchorEl:m,open:v,onClose:()=>{_(null)},children:typeof r==`function`?h(n,{children:r(()=>{_(null)})}):r})]})}var Ue=He;function We({href:e,children:t,ref:n,...r}){return h(O,{component:`a`,href:e,ref:n,target:`_blank`,rel:`noopener noreferrer`,...r,children:t})}var Ge=We;const Ke={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`},qe=w(`input`)({clip:`rect(0 0 0 0)`,clipPath:`inset(50%)`,height:1,overflow:`hidden`,position:`absolute`,bottom:0,left:0,whiteSpace:`nowrap`,width:1}),Je=w(`div`)(({theme:e,$dragging:t})=>({border:`2px dashed`,borderColor:t?e.palette.primary.main:`#ccc`,backgroundColor:t?e.palette.action.hover:`transparent`,borderRadius:8,padding:`1.5rem`,textAlign:`center`,transition:`border-color 0.2s`,cursor:`pointer`}));function Ye({onFileInput:e,label:t=`Upload files`,multiple:n,accept:r,useDropzone:i,...a}){let[o,s]=p(!1),c=g(E,{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(qe,{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(Je,{$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 J=Ye;function Xe({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(J,{...a}),h(k,{children:e.map(e=>h(A,{secondaryAction:h(y,{"aria-label":`Delete`,edge:`end`,onClick:()=>{t(t=>t.filter(t=>t!==e))},children:h(se,{})}),children:h(j,{primary:e.name})},e.name))})]})}var Ze=Xe;function Qe({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 $e=Qe;function et({to:e,children:t,ref:n,...r}){return h(O,{component:M,to:e,ref:n,...r,children:t})}var Y=et;function tt({children:e,...t}){return h(N,{component:Y,...t,children:e})}var nt=tt;function rt({children:e,errorComponent:t,undefinedComponent:n,nullComponent:r,nullableComponent:i,loadingComponent:a=h(x,{}),...o}){return g(V,{loadingComponent:a,...o,children:[h(U,{undefinedComponent:n,nullComponent:r,nullableComponent:i,children:t}),h(H,{children:e})]})}var it=rt;function at({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:M},e.value))})})]})}var ot=at;function X(e){return{width:240,transition:e.transitions.create(`width`,{easing:e.transitions.easing.sharp,duration:e.transitions.duration.enteringScreen}),overflowX:`hidden`}}function Z(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 Q=w(`div`)(({theme:e})=>({display:`flex`,alignItems:`center`,justifyContent:`flex-end`,padding:e.spacing(0,1),...e.mixins.toolbar})),st=w(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})}}]})),ct=w(F,{shouldForwardProp:e=>e!==`open`})(({theme:e})=>({width:240,flexShrink:0,whiteSpace:`nowrap`,boxSizing:`border-box`,variants:[{props:({open:e})=>e,style:{...X(e),"& .MuiDrawer-paper":X(e)}},{props:({open:e})=>!e,style:{...Z(e),"& .MuiDrawer-paper":Z(e)}}]}));function lt({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(C,{}),h(st,{position:`fixed`,open:s,children:g(L,{children:[h(y,{color:`inherit`,"aria-label":`open drawer`,onClick:u,edge:`start`,sx:[{marginRight:5},s&&{display:`none`}],children:h(he,{})}),h(R,{variant:`h6`,noWrap:!0,component:`div`,children:e}),i]})}),g(ct,{variant:`permanent`,open:s,children:[h(Q,{children:h(y,{onClick:d,children:o.direction===`rtl`?h(me,{}):h(pe,{})})}),h(P,{}),t.map(e=>g(a,{children:[g(k,{children:[h(R,{variant:s?`h5`:`h6`,paddingLeft:s?2:1,children:s?e.category:T(e.category,4)}),e.options.map(e=>h(A,{disablePadding:!0,sx:{display:`block`},children:g(N,{sx:[{minHeight:48,px:2.5},s?{justifyContent:`initial`}:{justifyContent:`center`}],component:M,to:e.to,selected:l.pathname===e.to,children:[h(I,{sx:[{minWidth:0,justifyContent:`center`},s?{mr:3}:{mr:`auto`}],children:e.icon?e.icon:s?null:h(R,{children:T(e.label,4)})}),h(j,{primary:e.label,sx:[s?{opacity:1}:{opacity:0}]})]})},e.to))]}),h(P,{})]},e.category))]}),g(n,{component:`main`,sx:{flexGrow:1,p:3},children:[h(Q,{}),r]})]})}var ut=lt;function dt({text:e,sx:t,...n}){return h(m,{children:e.split(`
-`).map((e,r)=>h(R,{sx:{margin:1,...t},...n,children:e},r))})}var ft=dt;function pt({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(xe,{...r,code:_e(e??``),children:[h(R,{variant:`h5`,children:`Code`}),h(n,{sx:{border:.3,borderRadius:.3,borderColor:`darkgray`},children:h(ve,{})}),h(`br`,{}),h(R,{variant:`h5`,children:`Result`}),g(n,{sx:o,children:[h(be,{}),h(ye,{})]})]})})}var mt=pt;function ht({columns:e}){return h(we,{children:re(e=>h(Ce,{children:h(Se,{})},e),e)})}var gt=ht;function _t({disableClean:e,label:t,...n}){let{formState:{disabled:r,isDirty:i,isSubmitting:a}}=Te();return h(E,{color:`primary`,disabled:n.disabled||e&&!i||r,loading:a,type:`submit`,variant:`contained`,...n,children:t})}var vt=_t;const $=w(Ee)(()=>({padding:8,"& .MuiSwitch-track":{borderRadius:11,"&::before, &::after":{content:`""`,position:`absolute`,top:`50%`,transform:`translateY(-50%)`,fontSize:16,width:28,height:28}}}));function yt({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($,{checkedIcon:h(n,{sx:o,children:h(e,{style:{...s,...t}})}),icon:h(n,{sx:o,children:h(r,{style:{...s,...i}})}),...a})}var bt=yt;function xt(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 St=xt;export{Oe as CollapsableItem,Ve as DarkModeToggle,Ue as DropdownMenu,Ge as ExternalLink,J as FileInput,Ze as FileInputList,Ke as FileType,$e as IconWithPopover,Y as InternalLink,nt as ListItemInternalLink,it as Loader,H as LoaderData,U as LoaderError,V as LoaderProvider,Ne as ModeProvider,ot as NavigationBottom,ut as NavigationDrawer,ft as PopoverText,mt as ReactPlayground,Ie as ScreenSizeProvider,gt as SkeletonRow,ze as SnackbarProvider,vt as SubmitButton,bt as SwitchWithIcons,St as useHash,B as useLoader,G as useMode,Pe as useScreenSize,Le as useSnackbar};
+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/CircularProgress";import S from"@mui/material/Alert";import C from"@mui/material/CssBaseline";import{ThemeProvider as ee,createTheme as te,styled as w,useTheme as ne}from"@mui/material/styles";import{fillArray as re,truncate as T,wait as ie}from"@alextheman/utility";import ae from"@mui/material/Snackbar";import E from"@mui/material/Button";import D from"@mui/material/Menu";import O from"@mui/material/Link";import oe from"@mui/icons-material/CloudUpload";import se from"@mui/icons-material/Delete";import k from"@mui/material/List";import A from"@mui/material/ListItem";import j from"@mui/material/ListItemText";import ce from"@mui/material/Popover";import{Link as M,useLocation as le}from"react-router-dom";import N 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 P from"@mui/material/Divider";import F from"@mui/material/Drawer";import I from"@mui/material/ListItemIcon";import L from"@mui/material/Toolbar";import R from"@mui/material/Typography";import{stripIndent as _e}from"common-tags";import{LiveEditor as ve,LiveError as ye,LivePreview as be,LiveProvider as xe}from"react-live";import Se from"@mui/material/Skeleton";import Ce from"@mui/material/TableCell";import we from"@mui/material/TableRow";import{useFormContext as Te}from"react-hook-form";import Ee from"@mui/material/Switch";function De({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 Oe=De;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 ke({children:e,loadingComponent:t=h(x,{}),...n}){return h(z.Provider,{value:{loadingComponent:t,...n},children:e})}var Ae=ke;function je({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=je;function Me({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(S,{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(S,{severity:`error`,children:`Failed to load data. Please try again later.`}):h(m,{})}var H=Me,U=Ae;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 Ne({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(C,{}),e]})})}var Pe=Ne;const K=o({windowWidth:0,windowHeight:0,isLargeScreen:!1});function Fe({strict:e=!0}={}){let t=c(K);if(e&&!t)throw Error(`SCREEN_SIZE_PROVIDER_NOT_FOUND`);return t}function Ie({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 Le=Ie;const q=o(void 0);function Re({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(S,{onClose:d,severity:c,children:o})}),e]})}var Be=ze;function Ve(){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 He=Ve;function Ue({children:r,button:i=E,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===E&&(y.endIcon=v?s:c),l(()=>{v&&u?u():!v&&f&&f()},[v,u,f]),g(n,{children:[h(i,{...y,children:a}),h(D,{id:`dropdown-menu`,anchorEl:m,open:v,onClose:()=>{_(null)},children:typeof r==`function`?h(n,{children:r(()=>{_(null)})}):r})]})}var We=Ue;function Ge({href:e,children:t,ref:n,...r}){return h(O,{component:`a`,href:e,ref:n,target:`_blank`,rel:`noopener noreferrer`,...r,children:t})}var Ke=Ge;const qe={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`},Je=w(`input`)({clip:`rect(0 0 0 0)`,clipPath:`inset(50%)`,height:1,overflow:`hidden`,position:`absolute`,bottom:0,left:0,whiteSpace:`nowrap`,width:1}),Ye=w(`div`)(({theme:e,$dragging:t})=>({border:`2px dashed`,borderColor:t?e.palette.primary.main:`#ccc`,backgroundColor:t?e.palette.action.hover:`transparent`,borderRadius:8,padding:`1.5rem`,textAlign:`center`,transition:`border-color 0.2s`,cursor:`pointer`}));function Xe({onFileInput:e,label:t=`Upload files`,multiple:n,accept:r,useDropzone:i,...a}){let[o,s]=p(!1),c=g(E,{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(Je,{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(Ye,{$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 J=Xe;function Ze({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(J,{...a}),h(k,{children:e.map(e=>h(A,{secondaryAction:h(y,{"aria-label":`Delete`,edge:`end`,onClick:()=>{t(t=>t.filter(t=>t!==e))},children:h(se,{})}),children:h(j,{primary:e.name})},e.name))})]})}var Qe=Ze;function $e({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 et=$e;function tt({to:e,children:t,ref:n,...r}){return h(O,{component:M,to:e,ref:n,...r,children:t})}var Y=tt;function nt({children:e,...t}){return h(N,{component:Y,...t,children:e})}var rt=nt;function it({children:e,errorComponent:t,undefinedComponent:n,nullComponent:r,nullableComponent:i,loadingComponent:a=h(x,{}),...o}){return g(U,{loadingComponent:a,...o,children:[h(H,{undefinedComponent:n,nullComponent:r,nullableComponent:i,children:t}),h(V,{children:e})]})}var at=it;function ot({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:M},e.value))})})]})}var st=ot;function X(e){return{width:240,transition:e.transitions.create(`width`,{easing:e.transitions.easing.sharp,duration:e.transitions.duration.enteringScreen}),overflowX:`hidden`}}function Z(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 Q=w(`div`)(({theme:e})=>({display:`flex`,alignItems:`center`,justifyContent:`flex-end`,padding:e.spacing(0,1),...e.mixins.toolbar})),ct=w(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})}}]})),lt=w(F,{shouldForwardProp:e=>e!==`open`})(({theme:e})=>({width:240,flexShrink:0,whiteSpace:`nowrap`,boxSizing:`border-box`,variants:[{props:({open:e})=>e,style:{...X(e),"& .MuiDrawer-paper":X(e)}},{props:({open:e})=>!e,style:{...Z(e),"& .MuiDrawer-paper":Z(e)}}]}));function ut({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(C,{}),h(ct,{position:`fixed`,open:s,children:g(L,{children:[h(y,{color:`inherit`,"aria-label":`open drawer`,onClick:u,edge:`start`,sx:[{marginRight:5},s&&{display:`none`}],children:h(he,{})}),h(R,{variant:`h6`,noWrap:!0,component:`div`,children:e}),i]})}),g(lt,{variant:`permanent`,open:s,children:[h(Q,{children:h(y,{onClick:d,children:o.direction===`rtl`?h(me,{}):h(pe,{})})}),h(P,{}),t.map(e=>g(a,{children:[g(k,{children:[h(R,{variant:s?`h5`:`h6`,paddingLeft:s?2:1,children:s?e.category:T(e.category,4)}),e.options.map(e=>h(A,{disablePadding:!0,sx:{display:`block`},children:g(N,{sx:[{minHeight:48,px:2.5},s?{justifyContent:`initial`}:{justifyContent:`center`}],component:M,to:e.to,selected:l.pathname===e.to,children:[h(I,{sx:[{minWidth:0,justifyContent:`center`},s?{mr:3}:{mr:`auto`}],children:e.icon?e.icon:s?null:h(R,{children:T(e.label,4)})}),h(j,{primary:e.label,sx:[s?{opacity:1}:{opacity:0}]})]})},e.to))]}),h(P,{})]},e.category))]}),g(n,{component:`main`,sx:{flexGrow:1,p:3},children:[h(Q,{}),r]})]})}var dt=ut;function ft({text:e,sx:t,...n}){return h(m,{children:e.split(`
+`).map((e,r)=>h(R,{sx:{margin:1,...t},...n,children:e},r))})}var pt=ft;function mt({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(xe,{...r,code:_e(e??``),children:[h(R,{variant:`h5`,children:`Code`}),h(n,{sx:{border:.3,borderRadius:.3,borderColor:`darkgray`},children:h(ve,{})}),h(`br`,{}),h(R,{variant:`h5`,children:`Result`}),g(n,{sx:o,children:[h(be,{}),h(ye,{})]})]})})}var ht=mt;function gt({columns:e}){return h(we,{children:re(e=>h(Ce,{children:h(Se,{})},e),e)})}var _t=gt;function vt({disableClean:e,label:t,...n}){let{formState:{disabled:r,isDirty:i,isSubmitting:a}}=Te();return h(E,{color:`primary`,disabled:n.disabled||e&&!i||r,loading:a,type:`submit`,variant:`contained`,...n,children:t})}var $=vt;const yt=w(Ee)(()=>({padding:8,"& .MuiSwitch-track":{borderRadius:11,"&::before, &::after":{content:`""`,position:`absolute`,top:`50%`,transform:`translateY(-50%)`,fontSize:16,width:28,height:28}}}));function bt({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(yt,{checkedIcon:h(n,{sx:o,children:h(e,{style:{...s,...t}})}),icon:h(n,{sx:o,children:h(r,{style:{...s,...i}})}),...a})}var xt=bt;function St(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 Ct=St;export{Oe as CollapsableItem,He as DarkModeToggle,We as DropdownMenu,Ke as ExternalLink,J as FileInput,Qe as FileInputList,qe as FileType,et as IconWithPopover,Y as InternalLink,rt as ListItemInternalLink,at as Loader,V as LoaderData,H as LoaderError,U as LoaderProvider,Pe as ModeProvider,st as NavigationBottom,dt as NavigationDrawer,pt as PopoverText,ht as ReactPlayground,Le as ScreenSizeProvider,_t as SkeletonRow,Be as SnackbarProvider,$ as SubmitButton,xt as SwitchWithIcons,Ct as useHash,G as useMode,Fe as useScreenSize,Re as useSnackbar};
 //# sourceMappingURL=index.js.map