@alextheman/components 6.16.1 → 6.18.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (7) hide show
  1. package/dist/index.cjs +2 -2
  2. package/dist/index.cjs.map +1 -1
  3. package/dist/index.d.cts +44 -23
  4. package/dist/index.d.ts +47 -26
  5. package/dist/index.js +2 -2
  6. package/dist/index.js.map +1 -1
  7. package/package.json +13 -12
package/dist/index.d.cts CHANGED
@@ -178,6 +178,8 @@ interface PageProps {
178
178
  children: ReactNode;
179
179
  /** Disable the inner padding of the Page contents. */
180
180
  disablePadding?: boolean;
181
+ /** Optional tabs to display in the header. */
182
+ tabs?: ReactNode;
181
183
  }
182
184
  /** Renders a pre-styled Page that can be used to structure pages throughout your React apps. */
183
185
  declare function Page({
@@ -185,6 +187,7 @@ declare function Page({
185
187
  subtitle,
186
188
  action,
187
189
  children,
190
+ tabs,
188
191
  disablePadding
189
192
  }: PageProps): _$react_jsx_runtime0.JSX.Element;
190
193
  //#endregion
@@ -334,36 +337,54 @@ declare function QueryBoundaryDataMap<ItemType>({
334
337
  }: QueryBoundaryDataMapProps<ItemType>): _$react_jsx_runtime0.JSX.Element | null;
335
338
  //#endregion
336
339
  //#region src/providers/QueryBoundaryProvider/QueryBoundaryError.d.ts
337
- interface QueryBoundaryErrorBaseProps {
340
+ interface QueryBoundaryErrorProps {
338
341
  /** The component to show if an error has been thrown. */
339
342
  children?: ReactNode | ((error: unknown) => ReactNode);
340
343
  /** An option to log the error to the console. */
341
344
  logError?: boolean;
342
345
  }
343
- interface QueryBoundaryErrorPropsWithUndefinedOrNull extends QueryBoundaryErrorBaseProps {
346
+ /**
347
+ * The component responsible for showing any errors provided by QueryBoundaryProvider.
348
+ */
349
+ declare function QueryBoundaryError({
350
+ children,
351
+ logError: propsLogError
352
+ }: QueryBoundaryErrorProps): string | number | bigint | boolean | _$react_jsx_runtime0.JSX.Element | Iterable<ReactNode> | Promise<string | number | bigint | boolean | _$react.ReactPortal | _$react.ReactElement<unknown, string | _$react.JSXElementConstructor<any>> | Iterable<ReactNode> | null | undefined> | null | undefined;
353
+ //#endregion
354
+ //#region src/providers/QueryBoundaryProvider/QueryBoundaryNullable.d.ts
355
+ interface QueryBoundaryNullablePropsWithUndefinedOrNull {
344
356
  /** The component to show if no error was thrown but data is undefined */
345
357
  undefinedComponent?: ReactNode;
346
358
  /** The component to show if no error was thrown but data is null */
347
359
  nullComponent?: ReactNode;
348
360
  nullableComponent?: never;
349
361
  }
350
- interface QueryBoundaryErrorPropsWithNullable extends QueryBoundaryErrorBaseProps {
362
+ interface QueryBoundaryNullablePropsWithNullable {
351
363
  undefinedComponent?: never;
352
364
  nullComponent?: never;
353
365
  /** The component to show if no error was thrown but data is undefined or null */
354
366
  nullableComponent?: ReactNode;
355
367
  }
356
- type QueryBoundaryErrorProps = QueryBoundaryErrorPropsWithUndefinedOrNull | QueryBoundaryErrorPropsWithNullable;
357
- /**
358
- * The component responsible for showing any errors provided by QueryBoundaryProvider.
359
- */
360
- declare function QueryBoundaryError({
361
- children,
368
+ type QueryBoundaryNullableProps = QueryBoundaryNullablePropsWithUndefinedOrNull | QueryBoundaryNullablePropsWithNullable;
369
+ /** The component responsible for handling cases when the data provided by `QueryBoundaryProvider` may be missing. */
370
+ declare function QueryBoundaryNullable({
362
371
  undefinedComponent,
363
372
  nullComponent,
364
- nullableComponent,
365
- logError: propsLogError
366
- }: QueryBoundaryErrorProps): string | number | bigint | boolean | _$react_jsx_runtime0.JSX.Element | Iterable<ReactNode> | Promise<string | number | bigint | boolean | _$react.ReactPortal | _$react.ReactElement<unknown, string | _$react.JSXElementConstructor<any>> | Iterable<ReactNode> | null | undefined> | null | undefined;
373
+ nullableComponent
374
+ }: QueryBoundaryNullableProps): _$react_jsx_runtime0.JSX.Element | null;
375
+ //#endregion
376
+ //#region src/providers/QueryBoundaryProvider/QueryBoundaryFallback.d.ts
377
+ type QueryBoundaryFallbackProps = Omit<QueryBoundaryErrorProps, "children"> & {
378
+ /** The component to show if an error has been thrown. */errorComponent?: ReactNode;
379
+ } & QueryBoundaryNullableProps;
380
+ /**
381
+ * The component responsible for handling both errors and nullable data from `QueryBoundaryProvider`
382
+ */
383
+ declare function QueryBoundaryFallback({
384
+ errorComponent,
385
+ logError,
386
+ ...queryBoundaryNullableProps
387
+ }: QueryBoundaryFallbackProps): _$react_jsx_runtime0.JSX.Element;
367
388
  //#endregion
368
389
  //#region src/providers/ScreenSizeProvider.d.ts
369
390
  interface ScreenSizeProps {
@@ -415,7 +436,7 @@ declare function SnackbarProvider({
415
436
  }: SnackbarProviderProps): _$react_jsx_runtime0.JSX.Element;
416
437
  //#endregion
417
438
  //#region src/components/QueryBoundary.d.ts
418
- type QueryBoundaryProps<DataType> = Omit<QueryBoundaryProviderProps<DataType>, "children" | "logError"> & Omit<QueryBoundaryErrorProps, "children"> & Omit<QueryBoundaryDataProps<DataType>, "showOnError" | "onUndefined" | "onNull" | "onNullable">;
439
+ type QueryBoundaryProps<DataType> = Omit<QueryBoundaryProviderProps<DataType>, "children" | "logError"> & Omit<QueryBoundaryFallbackProps, "children"> & Omit<QueryBoundaryDataProps<DataType>, "showOnError" | "onUndefined" | "onNull" | "onNullable">;
419
440
  /**
420
441
  * An in-line component that deals with state management when fetching data from an API.
421
442
  * This may be used over QueryBoundaryProvider if you don't require as much control over the placement of the error message and data display.
@@ -434,7 +455,7 @@ declare function QueryBoundary<DataType>({
434
455
  }: QueryBoundaryProps<DataType>): _$react_jsx_runtime0.JSX.Element;
435
456
  //#endregion
436
457
  //#region src/components/QueryBoundaryMap.d.ts
437
- type QueryBoundaryMapProps<ItemType> = Omit<QueryBoundaryProviderProps<Array<ItemType>>, "children" | "logError"> & Omit<QueryBoundaryErrorProps, "children"> & QueryBoundaryDataMapProps<ItemType>;
458
+ type QueryBoundaryMapProps<ItemType> = Omit<QueryBoundaryProviderProps<Array<ItemType>>, "children" | "logError"> & Omit<QueryBoundaryFallbackProps, "children"> & QueryBoundaryDataMapProps<ItemType>;
438
459
  /**
439
460
  * An in-line component that handles an array of data provided by `QueryBoundaryProvider`.
440
461
  *
@@ -722,16 +743,16 @@ type LoaderDataProps<DataType> = QueryBoundaryDataProps<DataType>;
722
743
  declare const LoaderData: typeof QueryBoundaryData;
723
744
  //#endregion
724
745
  //#region src/deprecated/LoaderError.d.ts
725
- /** @deprecated This type has been renamed to QueryBoundaryErrorBaseProps. */
726
- type LoaderErrorBaseProps = QueryBoundaryErrorBaseProps;
727
- /** @deprecated This type has been renamed to QueryBoundaryErrorPropsWithUndefinedOrNull. */
728
- type LoaderErrorPropsWithUndefinedOrNull = QueryBoundaryErrorPropsWithUndefinedOrNull;
729
- /** @deprecated This type has been renamed to QueryBoundaryErrorPropsWithNullable. */
730
- type LoaderErrorPropsWithNullable = QueryBoundaryErrorPropsWithNullable;
731
746
  /** @deprecated This type has been renamed to QueryBoundaryErrorProps. */
732
- type LoaderErrorProps = QueryBoundaryErrorProps;
747
+ type LoaderErrorBaseProps = QueryBoundaryErrorProps;
748
+ /** @deprecated This type has been renamed to QueryBoundaryNullablePropsWithUndefinedOrNull. */
749
+ type LoaderErrorPropsWithUndefinedOrNull = LoaderErrorBaseProps & QueryBoundaryNullablePropsWithUndefinedOrNull;
750
+ /** @deprecated This type has been renamed to QueryBoundaryNullablePropsWithNullable. */
751
+ type LoaderErrorPropsWithNullable = LoaderErrorBaseProps & QueryBoundaryNullablePropsWithNullable;
752
+ /** @deprecated This type has been renamed to QueryBoundaryFallbackProps. */
753
+ type LoaderErrorProps = QueryBoundaryFallbackProps;
733
754
  /** @deprecated This component has been renamed to LoaderError. */
734
- declare const LoaderError: typeof QueryBoundaryError;
755
+ declare const LoaderError: typeof QueryBoundaryFallback;
735
756
  //#endregion
736
757
  //#region src/deprecated/LoaderProvider.d.ts
737
758
  /** @deprecated This type has been renamed to QueryBoundaryProviderBaseProps. */
@@ -827,5 +848,5 @@ declare function SubmitButton({
827
848
  */
828
849
  declare function useHash<StateType extends string>(initialHash: StateType | undefined): [StateType, Dispatch<SetStateAction<StateType>>];
829
850
  //#endregion
830
- export { Artwork, CollapsableItem, type CollapsableItemProps, ContextHookOptions, DarkModeToggle, DropdownMenu, DropdownMenu2, type DropdownMenu2Props, DropdownMenuExternalLink, DropdownMenuInternalLink, DropdownMenuItem, type DropdownMenuItemProps, type DropdownMenuProps, ExternalLink, type ExternalLinkProps, FileInput, FileInputList, type FileInputListProps, type FileInputProps, FileType, IconWithPopover, type IconWithPopoverProps, InternalLink, type InternalLinkProps, ListItemInternalLink, Loader, type LoaderContextValue, LoaderData, type LoaderDataProps, LoaderError, type LoaderErrorBaseProps, type LoaderErrorProps, type LoaderErrorPropsWithNullable, type LoaderErrorPropsWithUndefinedOrNull, LoaderProvider, type LoaderProviderBaseProps, type LoaderProviderProps, type LoaderProviderPropsWithError, type LoaderProviderPropsWithNoError, ModeProvider, type ModeProviderProps, ModeToggle, type NavItemBottom, type NavMenuItem, NavigationBottom, type NavigationBottomProps, NavigationDrawer, type NavigationDrawerProps, Page, PopoverText, type PopoverTextProps, QueryBoundary, QueryBoundaryData, QueryBoundaryDataMap, type QueryBoundaryDataMapBaseProps, type QueryBoundaryDataMapProps, type QueryBoundaryDataMapPropsWithDataParser, type QueryBoundaryDataMapPropsWithItemParser, type QueryBoundaryDataMapPropsWithNoParser, type QueryBoundaryDataProps, QueryBoundaryError, type QueryBoundaryErrorBaseProps, type QueryBoundaryErrorProps, type QueryBoundaryErrorPropsWithNullable, type QueryBoundaryErrorPropsWithUndefinedOrNull, QueryBoundaryMap, type QueryBoundaryMapProps, type QueryBoundaryProps, QueryBoundaryProvider, type QueryBoundaryProviderBaseProps, type QueryBoundaryProviderProps, type QueryBoundaryProviderPropsWithError, type QueryBoundaryProviderPropsWithNoError, ReactPlayground, type ReactPlaygroundProps, type ScreenSizeContextValue, type ScreenSizeProps, ScreenSizeProvider, SkeletonRow, type SkeletonRowProps, SnackbarProvider, type SnackbarProviderProps, SubmitButton, type SubmitButtonProps, SwitchWithIcons, type SwitchWithIconsProps, useDropdownMenu, useHash, useMode, useScreenSize, useSnackbar };
851
+ export { Artwork, CollapsableItem, type CollapsableItemProps, ContextHookOptions, DarkModeToggle, DropdownMenu, DropdownMenu2, type DropdownMenu2Props, DropdownMenuExternalLink, DropdownMenuInternalLink, DropdownMenuItem, type DropdownMenuItemProps, type DropdownMenuProps, ExternalLink, type ExternalLinkProps, FileInput, FileInputList, type FileInputListProps, type FileInputProps, FileType, IconWithPopover, type IconWithPopoverProps, InternalLink, type InternalLinkProps, ListItemInternalLink, Loader, type LoaderContextValue, LoaderData, type LoaderDataProps, LoaderError, type LoaderErrorBaseProps, type LoaderErrorProps, type LoaderErrorPropsWithNullable, type LoaderErrorPropsWithUndefinedOrNull, LoaderProvider, type LoaderProviderBaseProps, type LoaderProviderProps, type LoaderProviderPropsWithError, type LoaderProviderPropsWithNoError, ModeProvider, type ModeProviderProps, ModeToggle, type NavItemBottom, type NavMenuItem, NavigationBottom, type NavigationBottomProps, NavigationDrawer, type NavigationDrawerProps, Page, PopoverText, type PopoverTextProps, QueryBoundary, QueryBoundaryData, QueryBoundaryDataMap, type QueryBoundaryDataMapBaseProps, type QueryBoundaryDataMapProps, type QueryBoundaryDataMapPropsWithDataParser, type QueryBoundaryDataMapPropsWithItemParser, type QueryBoundaryDataMapPropsWithNoParser, type QueryBoundaryDataProps, QueryBoundaryError, type QueryBoundaryErrorProps, QueryBoundaryFallback, type QueryBoundaryFallbackProps, QueryBoundaryMap, type QueryBoundaryMapProps, QueryBoundaryNullable, type QueryBoundaryNullableProps, type QueryBoundaryNullablePropsWithNullable, type QueryBoundaryNullablePropsWithUndefinedOrNull, type QueryBoundaryProps, QueryBoundaryProvider, type QueryBoundaryProviderBaseProps, type QueryBoundaryProviderProps, type QueryBoundaryProviderPropsWithError, type QueryBoundaryProviderPropsWithNoError, ReactPlayground, type ReactPlaygroundProps, type ScreenSizeContextValue, type ScreenSizeProps, ScreenSizeProvider, SkeletonRow, type SkeletonRowProps, SnackbarProvider, type SnackbarProviderProps, SubmitButton, type SubmitButtonProps, SwitchWithIcons, type SwitchWithIconsProps, useDropdownMenu, useHash, useMode, useScreenSize, useSnackbar };
831
852
  //# sourceMappingURL=index.d.cts.map
package/dist/index.d.ts CHANGED
@@ -4,7 +4,7 @@ import { CollapseProps } from "@mui/material/Collapse";
4
4
  import * as _$react from "react";
5
5
  import { CSSProperties, ComponentProps, ComponentPropsWithRef, ComponentPropsWithoutRef, ComponentType, Dispatch, ElementType, JSX, Key, MouseEventHandler, ReactNode, Ref, SetStateAction } from "react";
6
6
  import { LinkProps } from "@mui/material/Link";
7
- import MUIButton, { ButtonOwnProps, ButtonProps } from "@mui/material/Button";
7
+ import Button$1, { ButtonOwnProps, ButtonProps } from "@mui/material/Button";
8
8
  import { PaletteMode, SxProps, Theme } from "@mui/material/styles";
9
9
  import { SwitchProps } from "@mui/material/Switch";
10
10
  import { AlertColor } from "@mui/material/Alert";
@@ -178,6 +178,8 @@ interface PageProps {
178
178
  children: ReactNode;
179
179
  /** Disable the inner padding of the Page contents. */
180
180
  disablePadding?: boolean;
181
+ /** Optional tabs to display in the header. */
182
+ tabs?: ReactNode;
181
183
  }
182
184
  /** Renders a pre-styled Page that can be used to structure pages throughout your React apps. */
183
185
  declare function Page({
@@ -185,6 +187,7 @@ declare function Page({
185
187
  subtitle,
186
188
  action,
187
189
  children,
190
+ tabs,
188
191
  disablePadding
189
192
  }: PageProps): _$react_jsx_runtime0.JSX.Element;
190
193
  //#endregion
@@ -334,36 +337,54 @@ declare function QueryBoundaryDataMap<ItemType>({
334
337
  }: QueryBoundaryDataMapProps<ItemType>): _$react_jsx_runtime0.JSX.Element | null;
335
338
  //#endregion
336
339
  //#region src/providers/QueryBoundaryProvider/QueryBoundaryError.d.ts
337
- interface QueryBoundaryErrorBaseProps {
340
+ interface QueryBoundaryErrorProps {
338
341
  /** The component to show if an error has been thrown. */
339
342
  children?: ReactNode | ((error: unknown) => ReactNode);
340
343
  /** An option to log the error to the console. */
341
344
  logError?: boolean;
342
345
  }
343
- interface QueryBoundaryErrorPropsWithUndefinedOrNull extends QueryBoundaryErrorBaseProps {
346
+ /**
347
+ * The component responsible for showing any errors provided by QueryBoundaryProvider.
348
+ */
349
+ declare function QueryBoundaryError({
350
+ children,
351
+ logError: propsLogError
352
+ }: QueryBoundaryErrorProps): string | number | bigint | boolean | _$react_jsx_runtime0.JSX.Element | Iterable<ReactNode> | Promise<string | number | bigint | boolean | _$react.ReactPortal | _$react.ReactElement<unknown, string | _$react.JSXElementConstructor<any>> | Iterable<ReactNode> | null | undefined> | null | undefined;
353
+ //#endregion
354
+ //#region src/providers/QueryBoundaryProvider/QueryBoundaryNullable.d.ts
355
+ interface QueryBoundaryNullablePropsWithUndefinedOrNull {
344
356
  /** The component to show if no error was thrown but data is undefined */
345
357
  undefinedComponent?: ReactNode;
346
358
  /** The component to show if no error was thrown but data is null */
347
359
  nullComponent?: ReactNode;
348
360
  nullableComponent?: never;
349
361
  }
350
- interface QueryBoundaryErrorPropsWithNullable extends QueryBoundaryErrorBaseProps {
362
+ interface QueryBoundaryNullablePropsWithNullable {
351
363
  undefinedComponent?: never;
352
364
  nullComponent?: never;
353
365
  /** The component to show if no error was thrown but data is undefined or null */
354
366
  nullableComponent?: ReactNode;
355
367
  }
356
- type QueryBoundaryErrorProps = QueryBoundaryErrorPropsWithUndefinedOrNull | QueryBoundaryErrorPropsWithNullable;
357
- /**
358
- * The component responsible for showing any errors provided by QueryBoundaryProvider.
359
- */
360
- declare function QueryBoundaryError({
361
- children,
368
+ type QueryBoundaryNullableProps = QueryBoundaryNullablePropsWithUndefinedOrNull | QueryBoundaryNullablePropsWithNullable;
369
+ /** The component responsible for handling cases when the data provided by `QueryBoundaryProvider` may be missing. */
370
+ declare function QueryBoundaryNullable({
362
371
  undefinedComponent,
363
372
  nullComponent,
364
- nullableComponent,
365
- logError: propsLogError
366
- }: QueryBoundaryErrorProps): string | number | bigint | boolean | _$react_jsx_runtime0.JSX.Element | Iterable<ReactNode> | Promise<string | number | bigint | boolean | _$react.ReactPortal | _$react.ReactElement<unknown, string | _$react.JSXElementConstructor<any>> | Iterable<ReactNode> | null | undefined> | null | undefined;
373
+ nullableComponent
374
+ }: QueryBoundaryNullableProps): _$react_jsx_runtime0.JSX.Element | null;
375
+ //#endregion
376
+ //#region src/providers/QueryBoundaryProvider/QueryBoundaryFallback.d.ts
377
+ type QueryBoundaryFallbackProps = Omit<QueryBoundaryErrorProps, "children"> & {
378
+ /** The component to show if an error has been thrown. */errorComponent?: ReactNode;
379
+ } & QueryBoundaryNullableProps;
380
+ /**
381
+ * The component responsible for handling both errors and nullable data from `QueryBoundaryProvider`
382
+ */
383
+ declare function QueryBoundaryFallback({
384
+ errorComponent,
385
+ logError,
386
+ ...queryBoundaryNullableProps
387
+ }: QueryBoundaryFallbackProps): _$react_jsx_runtime0.JSX.Element;
367
388
  //#endregion
368
389
  //#region src/providers/ScreenSizeProvider.d.ts
369
390
  interface ScreenSizeProps {
@@ -415,7 +436,7 @@ declare function SnackbarProvider({
415
436
  }: SnackbarProviderProps): _$react_jsx_runtime0.JSX.Element;
416
437
  //#endregion
417
438
  //#region src/components/QueryBoundary.d.ts
418
- type QueryBoundaryProps<DataType> = Omit<QueryBoundaryProviderProps<DataType>, "children" | "logError"> & Omit<QueryBoundaryErrorProps, "children"> & Omit<QueryBoundaryDataProps<DataType>, "showOnError" | "onUndefined" | "onNull" | "onNullable">;
439
+ type QueryBoundaryProps<DataType> = Omit<QueryBoundaryProviderProps<DataType>, "children" | "logError"> & Omit<QueryBoundaryFallbackProps, "children"> & Omit<QueryBoundaryDataProps<DataType>, "showOnError" | "onUndefined" | "onNull" | "onNullable">;
419
440
  /**
420
441
  * An in-line component that deals with state management when fetching data from an API.
421
442
  * This may be used over QueryBoundaryProvider if you don't require as much control over the placement of the error message and data display.
@@ -434,7 +455,7 @@ declare function QueryBoundary<DataType>({
434
455
  }: QueryBoundaryProps<DataType>): _$react_jsx_runtime0.JSX.Element;
435
456
  //#endregion
436
457
  //#region src/components/QueryBoundaryMap.d.ts
437
- type QueryBoundaryMapProps<ItemType> = Omit<QueryBoundaryProviderProps<Array<ItemType>>, "children" | "logError"> & Omit<QueryBoundaryErrorProps, "children"> & QueryBoundaryDataMapProps<ItemType>;
458
+ type QueryBoundaryMapProps<ItemType> = Omit<QueryBoundaryProviderProps<Array<ItemType>>, "children" | "logError"> & Omit<QueryBoundaryFallbackProps, "children"> & QueryBoundaryDataMapProps<ItemType>;
438
459
  /**
439
460
  * An in-line component that handles an array of data provided by `QueryBoundaryProvider`.
440
461
  *
@@ -548,7 +569,7 @@ declare function DropdownMenu$1({
548
569
  }: DropdownMenuProps$1): _$react_jsx_runtime0.JSX.Element;
549
570
  //#endregion
550
571
  //#region src/v7/components/DropdownMenu/DropdownMenuItem.d.ts
551
- type DropdownMenuItemProps$1<RootComponent extends ElementType = typeof MUIButton> = {
572
+ type DropdownMenuItemProps$1<RootComponent extends ElementType = typeof Button$1> = {
552
573
  /**
553
574
  * An optional component to provide to override the current component.
554
575
  *
@@ -563,7 +584,7 @@ type DropdownMenuItemProps$1<RootComponent extends ElementType = typeof MUIButto
563
584
  onClick?: ComponentProps<RootComponent>["onClick"];
564
585
  } & Omit<ComponentPropsWithoutRef<RootComponent>, "children" | "ref"> & MenuItemOwnProps;
565
586
  /** Represents a menu item to be used inside the `DropdownMenu`. It must be used as children of the `DropdownMenu` component. */
566
- declare function DropdownMenuItem$1<RootComponent extends ElementType = typeof MUIButton>({
587
+ declare function DropdownMenuItem$1<RootComponent extends ElementType = typeof Button$1>({
567
588
  component,
568
589
  children,
569
590
  ref,
@@ -722,16 +743,16 @@ type LoaderDataProps<DataType> = QueryBoundaryDataProps<DataType>;
722
743
  declare const LoaderData: typeof QueryBoundaryData;
723
744
  //#endregion
724
745
  //#region src/deprecated/LoaderError.d.ts
725
- /** @deprecated This type has been renamed to QueryBoundaryErrorBaseProps. */
726
- type LoaderErrorBaseProps = QueryBoundaryErrorBaseProps;
727
- /** @deprecated This type has been renamed to QueryBoundaryErrorPropsWithUndefinedOrNull. */
728
- type LoaderErrorPropsWithUndefinedOrNull = QueryBoundaryErrorPropsWithUndefinedOrNull;
729
- /** @deprecated This type has been renamed to QueryBoundaryErrorPropsWithNullable. */
730
- type LoaderErrorPropsWithNullable = QueryBoundaryErrorPropsWithNullable;
731
746
  /** @deprecated This type has been renamed to QueryBoundaryErrorProps. */
732
- type LoaderErrorProps = QueryBoundaryErrorProps;
747
+ type LoaderErrorBaseProps = QueryBoundaryErrorProps;
748
+ /** @deprecated This type has been renamed to QueryBoundaryNullablePropsWithUndefinedOrNull. */
749
+ type LoaderErrorPropsWithUndefinedOrNull = LoaderErrorBaseProps & QueryBoundaryNullablePropsWithUndefinedOrNull;
750
+ /** @deprecated This type has been renamed to QueryBoundaryNullablePropsWithNullable. */
751
+ type LoaderErrorPropsWithNullable = LoaderErrorBaseProps & QueryBoundaryNullablePropsWithNullable;
752
+ /** @deprecated This type has been renamed to QueryBoundaryFallbackProps. */
753
+ type LoaderErrorProps = QueryBoundaryFallbackProps;
733
754
  /** @deprecated This component has been renamed to LoaderError. */
734
- declare const LoaderError: typeof QueryBoundaryError;
755
+ declare const LoaderError: typeof QueryBoundaryFallback;
735
756
  //#endregion
736
757
  //#region src/deprecated/LoaderProvider.d.ts
737
758
  /** @deprecated This type has been renamed to QueryBoundaryProviderBaseProps. */
@@ -827,5 +848,5 @@ declare function SubmitButton({
827
848
  */
828
849
  declare function useHash<StateType extends string>(initialHash: StateType | undefined): [StateType, Dispatch<SetStateAction<StateType>>];
829
850
  //#endregion
830
- export { Artwork, CollapsableItem, type CollapsableItemProps, ContextHookOptions, DarkModeToggle, DropdownMenu, DropdownMenu2, type DropdownMenu2Props, DropdownMenuExternalLink, DropdownMenuInternalLink, DropdownMenuItem, type DropdownMenuItemProps, type DropdownMenuProps, ExternalLink, type ExternalLinkProps, FileInput, FileInputList, type FileInputListProps, type FileInputProps, FileType, IconWithPopover, type IconWithPopoverProps, InternalLink, type InternalLinkProps, ListItemInternalLink, Loader, type LoaderContextValue, LoaderData, type LoaderDataProps, LoaderError, type LoaderErrorBaseProps, type LoaderErrorProps, type LoaderErrorPropsWithNullable, type LoaderErrorPropsWithUndefinedOrNull, LoaderProvider, type LoaderProviderBaseProps, type LoaderProviderProps, type LoaderProviderPropsWithError, type LoaderProviderPropsWithNoError, ModeProvider, type ModeProviderProps, ModeToggle, type NavItemBottom, type NavMenuItem, NavigationBottom, type NavigationBottomProps, NavigationDrawer, type NavigationDrawerProps, Page, PopoverText, type PopoverTextProps, QueryBoundary, QueryBoundaryData, QueryBoundaryDataMap, type QueryBoundaryDataMapBaseProps, type QueryBoundaryDataMapProps, type QueryBoundaryDataMapPropsWithDataParser, type QueryBoundaryDataMapPropsWithItemParser, type QueryBoundaryDataMapPropsWithNoParser, type QueryBoundaryDataProps, QueryBoundaryError, type QueryBoundaryErrorBaseProps, type QueryBoundaryErrorProps, type QueryBoundaryErrorPropsWithNullable, type QueryBoundaryErrorPropsWithUndefinedOrNull, QueryBoundaryMap, type QueryBoundaryMapProps, type QueryBoundaryProps, QueryBoundaryProvider, type QueryBoundaryProviderBaseProps, type QueryBoundaryProviderProps, type QueryBoundaryProviderPropsWithError, type QueryBoundaryProviderPropsWithNoError, ReactPlayground, type ReactPlaygroundProps, type ScreenSizeContextValue, type ScreenSizeProps, ScreenSizeProvider, SkeletonRow, type SkeletonRowProps, SnackbarProvider, type SnackbarProviderProps, SubmitButton, type SubmitButtonProps, SwitchWithIcons, type SwitchWithIconsProps, useDropdownMenu, useHash, useMode, useScreenSize, useSnackbar };
851
+ export { Artwork, CollapsableItem, type CollapsableItemProps, ContextHookOptions, DarkModeToggle, DropdownMenu, DropdownMenu2, type DropdownMenu2Props, DropdownMenuExternalLink, DropdownMenuInternalLink, DropdownMenuItem, type DropdownMenuItemProps, type DropdownMenuProps, ExternalLink, type ExternalLinkProps, FileInput, FileInputList, type FileInputListProps, type FileInputProps, FileType, IconWithPopover, type IconWithPopoverProps, InternalLink, type InternalLinkProps, ListItemInternalLink, Loader, type LoaderContextValue, LoaderData, type LoaderDataProps, LoaderError, type LoaderErrorBaseProps, type LoaderErrorProps, type LoaderErrorPropsWithNullable, type LoaderErrorPropsWithUndefinedOrNull, LoaderProvider, type LoaderProviderBaseProps, type LoaderProviderProps, type LoaderProviderPropsWithError, type LoaderProviderPropsWithNoError, ModeProvider, type ModeProviderProps, ModeToggle, type NavItemBottom, type NavMenuItem, NavigationBottom, type NavigationBottomProps, NavigationDrawer, type NavigationDrawerProps, Page, PopoverText, type PopoverTextProps, QueryBoundary, QueryBoundaryData, QueryBoundaryDataMap, type QueryBoundaryDataMapBaseProps, type QueryBoundaryDataMapProps, type QueryBoundaryDataMapPropsWithDataParser, type QueryBoundaryDataMapPropsWithItemParser, type QueryBoundaryDataMapPropsWithNoParser, type QueryBoundaryDataProps, QueryBoundaryError, type QueryBoundaryErrorProps, QueryBoundaryFallback, type QueryBoundaryFallbackProps, QueryBoundaryMap, type QueryBoundaryMapProps, QueryBoundaryNullable, type QueryBoundaryNullableProps, type QueryBoundaryNullablePropsWithNullable, type QueryBoundaryNullablePropsWithUndefinedOrNull, type QueryBoundaryProps, QueryBoundaryProvider, type QueryBoundaryProviderBaseProps, type QueryBoundaryProviderProps, type QueryBoundaryProviderPropsWithError, type QueryBoundaryProviderPropsWithNoError, ReactPlayground, type ReactPlaygroundProps, type ScreenSizeContextValue, type ScreenSizeProps, ScreenSizeProvider, SkeletonRow, type SkeletonRowProps, SnackbarProvider, type SnackbarProviderProps, SubmitButton, type SubmitButtonProps, SwitchWithIcons, type SwitchWithIconsProps, useDropdownMenu, useHash, useMode, useScreenSize, useSnackbar };
831
852
  //# sourceMappingURL=index.d.ts.map
package/dist/index.js CHANGED
@@ -1,3 +1,3 @@
1
- import e from"@mui/material/Box";import t from"@mui/material/Card";import n from"@mui/material/CardContent";import r from"@mui/material/CardHeader";import i from"@mui/material/Chip";import a from"@mui/material/Divider";import o from"@mui/material/Stack";import s from"@mui/material/Typography";import{Fragment as c,jsx as l,jsxs as u}from"react/jsx-runtime";import d from"@mui/material/ButtonBase";import f from"@mui/material/Collapse";import{Fragment as p,createContext as m,useCallback as h,useContext as g,useEffect as _,useId as v,useMemo as y,useRef as ee,useState as b}from"react";import{MdArrowDropDown as te,MdArrowDropUp as x,MdChevronLeft as ne,MdChevronRight as re,MdCloudUpload as ie,MdDelete as ae,MdMenu as oe,MdOutlineDarkMode as se,MdOutlineLightMode as ce,MdVisibility as le}from"react-icons/md";import S from"@mui/material/Link";import C from"@mui/material/Button";import{ThemeProvider as ue,createTheme as de,styled as w,useTheme as fe}from"@mui/material/styles";import T from"@mui/material/IconButton";import E from"@mui/material/List";import D from"@mui/material/ListItem";import O from"@mui/material/ListItemText";import pe from"@mui/material/Tooltip";import me from"@mui/material/Switch";import{DataError as k}from"@alextheman/utility/v6";import A from"@mui/material/CssBaseline";import j from"@mui/material/CircularProgress";import M from"@mui/material/Alert";import{fillArray as he,truncate as N,wait as ge}from"@alextheman/utility";import _e from"@mui/material/Snackbar";import ve from"@mui/material/BottomNavigation";import ye from"@mui/material/BottomNavigationAction";import be from"@mui/material/Paper";import{Link as P,useLocation as xe}from"react-router-dom";import{stripIndent as Se}from"common-tags";import{LiveEditor as Ce,LiveError as we,LivePreview as Te,LiveProvider as Ee}from"react-live";import De from"@mui/material/Skeleton";import Oe from"@mui/material/TableCell";import ke from"@mui/material/TableRow";import F from"@mui/material/Menu";import Ae from"@mui/material/AppBar";import je from"@mui/material/Drawer";import I from"@mui/material/ListItemButton";import Me from"@mui/material/ListItemIcon";import Ne from"@mui/material/Toolbar";import L from"@mui/material/MenuItem";import Pe from"@mui/material/Popover";import{useFormContext as Fe}from"react-hook-form";function R({containerLabel:e,chipLabels:r}){return l(t,{sx:{width:320,height:420,backgroundColor:`rgba(255,255,255,0.07)`,backdropFilter:`blur(8px)`,border:`1px solid rgba(255,255,255,0.06)`,boxShadow:`0 10px 40px rgba(0,0,0,0.35)`},children:u(n,{children:[l(s,{variant:`h6`,gutterBottom:!0,sx:{color:`#f8fafc`},children:e}),l(o,{spacing:1,children:r.map(e=>l(i,{label:e,sx:{backgroundColor:`rgba(255,255,255,0.11)`,color:`rgba(255,255,255,0.88)`,border:`1px solid rgba(255,255,255,0.06)`}},e))})]})})}function Ie(){return l(e,{sx:{width:120,height:6,borderRadius:3,background:`linear-gradient(90deg, #f43f5e, #a78bfa, #22d3ee)`,boxShadow:`0 0 24px rgba(167,139,250,0.55)`}})}function Le(){return u(t,{sx:{width:1e3,height:1e3,display:`flex`,flexDirection:`column`,justifyContent:`space-between`,p:4,background:`radial-gradient(circle at 20% 10%, rgba(167,139,250,0.35) 0%, rgba(167,139,250,0.12) 35%, rgba(0,0,0,0) 55%), linear-gradient(135deg, #3a3380 0%, #1d2e5f 40%, #2d3f55 100%)`,color:`white`},elevation:0,children:[l(r,{title:`An Interface For You And I`,sx:{color:`#f8fafc`,textAlign:`center`,"& .MuiCardHeader-title":{fontSize:40,fontWeight:600,letterSpacing:2}}}),l(a,{sx:{borderColor:`rgba(255,255,255,0.2)`}}),l(n,{sx:{flex:1,display:`flex`,alignItems:`center`},children:u(o,{direction:`row`,spacing:4,sx:{width:`100%`,justifyContent:`center`,alignItems:`center`},children:[l(R,{containerLabel:`You`,chipLabels:[`state`,`context`,`input`,`event`,`focus`,`value`,`history`]}),l(Ie,{}),l(R,{containerLabel:`I`,chipLabels:[`render`,`effect`,`response`,`update`,`history`,`layout`,`provider`]})]})})]})}function Re({isInitiallyOpen:t,onOpen:n,onClose:r,children:i,buttonStyles:a,buttonContents:o,buttonComponent:s=d,collapseProps:c,openIcon:p=l(x,{}),closedIcon:m=l(te,{}),useDefaultStyling:h=s===d}){let[g,v]=b(!!t);return _(()=>{g&&n?n():!g&&r&&r()},[g]),u(e,{children:[u(s,{onClick:()=>{v(e=>!e)},sx:h?{width:`100%`,display:`flex`,alignItems:`center`,justifyContent:`center`,paddingY:1.5,paddingX:2,textAlign:`center`,"&:hover":s===d?{backgroundColor:`action.hover`}:null,...a}:a,"aria-expanded":g,children:[o,g?p:m]}),l(f,{in:g,...c,children:i})]})}function z({href:e,children:t,ref:n,...r}){return l(S,{component:`a`,href:e,ref:n,target:`_blank`,rel:`noopener noreferrer`,...r,children:t})}const ze={PDF:`application/pdf`,PNG:`image/png`,JPEG:`image/jpeg`,JPG:`image/jpg`,XLSX:`application/vnd.openxmlformats-officedocument.spreadsheetml.sheet`,DOCX:`application/vnd.openxmlformats-officedocument.wordprocessingml.document`,MP3:`audio/mp3`,MP4:`video/mp4`,WAV:`audio/wav`},Be=w(`input`)({clip:`rect(0 0 0 0)`,clipPath:`inset(50%)`,height:1,overflow:`hidden`,position:`absolute`,bottom:0,left:0,whiteSpace:`nowrap`,width:1}),Ve=w(`div`)(({theme:e,$dragging:t})=>({border:`2px dashed`,borderColor:t?e.palette.primary.main:`#ccc`,backgroundColor:t?e.palette.action.hover:`transparent`,borderRadius:8,padding:`1.5rem`,textAlign:`center`,transition:`border-color 0.2s`,cursor:`pointer`}));function B({onFileInput:e,label:t=`Upload files`,multiple:n,accept:r,useDropzone:i,...a}){let[o,s]=b(!1),c=v(),d=u(C,{variant:`contained`,component:`label`,"aria-label":`File input button`,onKeyDown:e=>{(e.key===`Enter`||e.key===` `)&&(e.preventDefault(),document.getElementById(c)?.click())},...a,startIcon:a.startIcon??l(ie,{}),children:[t,l(Be,{id:c,type:`file`,onChange:t=>{let n=t.target;e(Array.from(n.files??[])),n.value=``},multiple:n,accept:r?.join(`,`),disabled:a.disabled})]});return i?l(Ve,{$dragging:o,onDragOver:e=>{e.preventDefault(),!a.disabled&&s(!0)},onDragLeave:e=>{e.preventDefault(),s(!1)},onDrop:t=>{t.preventDefault(),s(!1),!a.disabled&&e(Array.from(t.dataTransfer.files??[]))},children:d}):d}function He({files:t,setFiles:n,multiple:r=!0,...i}){function a(e){n(t=>[...t,...e])}return u(e,{children:[l(B,{...i,multiple:r,onFileInput:a}),l(E,{children:t.map(e=>l(D,{secondaryAction:l(T,{"aria-label":`Delete`,edge:`end`,onClick:()=>{n(t=>t.filter(t=>t!==e))},children:l(ae,{})}),children:l(O,{primary:e.name})},`${e.name}-${e.lastModified}`))})]})}const Ue=w(me)(()=>({padding:8,"& .MuiSwitch-track":{borderRadius:11,"&::before, &::after":{content:`""`,position:`absolute`,top:`50%`,transform:`translateY(-50%)`,fontSize:16,width:28,height:28}}}));function V({checkedIcon:t,checkedIconStyles:n,uncheckedIcon:r,uncheckedIconStyles:i,...a}){let o={borderRadius:`50%`,borderColor:`white`,backgroundColor:`white`,display:`flex`,alignItems:`center`,justifyContent:`center`,padding:.25},s={color:`black`,maxWidth:16.5,maxHeight:16.5};return l(Ue,{checkedIcon:l(e,{sx:o,children:l(t,{style:{...s,...n}})}),icon:l(e,{sx:o,children:l(r,{style:{...s,...i}})}),...a})}const H=m({toggleMode:()=>{},mode:`dark`});function U({strict:e=!0}={}){let t=g(H);if(e&&!t)throw new k({strict:e,context:t},`MODE_PROVIDER_NOT_FOUND`,`Could not find the ModeProvider context. Please double-check that it is present.`);return t}function We({children:e,mode:t=`dark`}){let[n,r]=b(t),i=y(()=>de({palette:{mode:n},components:{MuiPaper:{styleOverrides:{root:({theme:e})=>({border:1,borderStyle:`solid`,borderColor:e.palette.divider})}}}}),[n]);return l(H.Provider,{value:{mode:n,toggleMode:()=>{r(e=>e===`light`?`dark`:`light`)}},children:u(ue,{theme:i,children:[l(A,{}),e]})})}const W=m(void 0);function G({strict:e=!0}={}){let t=g(W);if(e&&!t)throw new k({strict:e,context:t},`LOADER_PROVIDER_NOT_FOUND`,`Could not find the QueryBoundaryProvider context. Please double-check that it is present.`);return t}function Ge({children:e,loadingComponent:t=l(j,{}),...n}){return l(W.Provider,{value:{loadingComponent:t,...n},children:e})}function K({children:e,dataParser:t,loadingComponent:n}){let{isLoading:r,data:i,dataParser:a,loadingComponent:o,error:s}=G(),u=t??a;return r?l(c,{children:n??o}):s||i==null?null:l(c,{children:typeof e==`function`?e(u?u(i):i):e})}function q({children:e,loadingComponent:t,itemKey:n,itemParser:r,dataParser:i,emptyComponent:a=l(s,{children:`No data present`}),strictlyRequireArray:o=!0}){let{isLoading:u,data:d,dataParser:f,loadingComponent:m,error:h}=G(),g=i??f,_=t??m;if(u)return l(c,{children:_});if(h||d==null)return null;if(!Array.isArray(d)){if(o)throw new k({data:d,strictlyRequireArray:o},`NOT_AN_ARRAY`,`Expected the data to be an array but it was not an array.`);return null}if(d.length===0)return l(c,{children:a});let v;return v=g?g(d):r?d.map(r):d,l(c,{children:v.map((t,r)=>l(p,{children:typeof e==`function`?e(t):e},n?n(t,r):r))})}function J({children:e,undefinedComponent:t,nullComponent:n,nullableComponent:r,logError:i}){let{isLoading:a,data:o,error:s,errorComponent:u,logError:d}=G(),f=i??d,p=ee(!1),m=e??u;return s?(f&&!p.current&&(o!=null&&console.error(`An error has occurred but data is still present. This may indicate an invalid query state.`,{data:o,error:s}),console.error(s),p.current=!0),typeof m==`function`?m(s):m?l(c,{children:m}):l(M,{severity:`error`,children:typeof s==`object`&&`message`in s&&typeof s.message==`string`?s.message:`An unknown error has occured. Please try again later.`})):!a&&o==null?r?(f&&!p.current&&(console.error(`Data is nullable after loading.`),p.current=!0),l(c,{children:r})):o===void 0&&(f&&!p.current&&(console.error(`Data is undefined after loading. This could either be an issue with the query or you have not passed in the data to QueryBoundaryProvider. Please double-check that you have provided data.`),p.current=!0),t)?l(c,{children:t}):o===null&&(f&&!p.current&&(console.error(`Data is null after loading.`),p.current=!0),n)?l(c,{children:n}):l(M,{severity:`error`,children:`Failed to load data. Please try again later.`}):null}var Y=Ge;const X=m({windowWidth:0,windowHeight:0,isLargeScreen:!1});function Ke({strict:e=!0}={}){let t=g(X);if(e&&!t)throw new k({strict:e,context:t},`SCREEN_SIZE_PROVIDER_NOT_FOUND`,`Could not find the ScreenSizeProvider context. Please double-check that it is present.`);return t}function qe({children:e,largeScreenWidth:t=669,largeScreenHeight:n=660}){let[r,i]=b(window.innerWidth),[a,o]=b(window.innerHeight);_(()=>{function e(){i(window.innerWidth),o(window.innerHeight)}return e(),window.addEventListener(`resize`,e),()=>{window.removeEventListener(`resize`,e)}},[]);let s=y(()=>r>t&&a>n,[r,a,t,n]);return l(X.Provider,{value:{isLargeScreen:s,windowWidth:r,windowHeight:a},children:e})}const Je=m(void 0);function Ye({strict:e=!0}={}){let t=g(Je);if(e&&!t)throw new k({strict:e,context:t},`SNACKBAR_PROVIDER_NOT_FOUND`,`Could not find the SnackbarProvider context. Please double-check that it is present.`);return t}function Xe({children:e,autoHideDuration:t=5e3}){let[n,r]=b(!1),[i,a]=b(t),[o,s]=b(``),[c,d]=b(`info`);function f(e,n,i){r(!0),a(i??t),d(n??`info`),s(e)}async function p(){r(!1),await ge(.2),s(``)}return u(Je.Provider,{value:{addSnackbar:f},children:[l(_e,{open:n,autoHideDuration:i,onClose:p,children:l(M,{onClose:p,severity:c,children:o})}),e]})}function Ze(){let{mode:e,toggleMode:t}=U(),n=e===`dark`,r=`Enable ${n?`light`:`dark`} mode`;return l(pe,{title:r,children:l(V,{uncheckedIcon:ce,checkedIcon:se,checked:n,onChange:t,"aria-label":r})})}function Qe({children:t,navItems:n}){let[r,i]=b(``);return u(c,{children:[l(e,{sx:{paddingBottom:7},children:t}),l(be,{sx:{position:`fixed`,bottom:0,left:0,right:0},children:l(ve,{showLabels:!0,value:r,onChange:(e,t)=>{i(t)},children:n.map(e=>l(ye,{...e,component:P},e.value))})})]})}function $e({title:e,subtitle:i,action:o,children:d,disablePadding:f}){return u(t,{children:[l(r,{title:u(c,{children:[typeof e==`string`?l(s,{variant:`h6`,children:e}):e,i?typeof i==`string`?l(s,{variant:`body2`,color:`text.secondary`,children:i}):i:null]}),action:o}),l(a,{}),f?d:l(n,{children:d})]})}function et({children:e,errorComponent:t,undefinedComponent:n,nullComponent:r,nullableComponent:i,logError:a,loadingComponent:o=l(j,{}),...s}){let c=l(J,{logError:a,children:t});return i?c=l(J,{nullableComponent:i,logError:a,children:t}):(n||r)&&(c=l(J,{undefinedComponent:n,nullComponent:r,logError:a,children:t})),u(Y,{loadingComponent:o,...s,children:[c,l(K,{children:e})]})}function tt({loadingComponent:e,undefinedComponent:t,nullComponent:n,nullableComponent:r,logError:i,errorComponent:a,children:o,isLoading:s,error:c,data:d,...f}){let p=l(J,{logError:i,children:a});return r?p=l(J,{nullableComponent:r,logError:i,children:a}):(t||n)&&(p=l(J,{undefinedComponent:t,nullComponent:n,logError:i,children:a})),u(Y,{loadingComponent:e,isLoading:s,error:c,data:d,children:[p,l(q,{...f,children:o})]})}function nt({code:t,previewStyles:n,...r}){let{mode:i}=U(),a={backgroundColor:i===`dark`?`black`:`white`,border:.3,borderRadius:1,padding:2,borderColor:`darkgray`},o=n?{...a,...n}:{...a};return l(e,{sx:{borderRadius:1,border:.5,padding:2},children:u(Ee,{...r,code:Se(t??``),children:[l(s,{variant:`h5`,children:`Code`}),l(e,{sx:{border:.3,borderRadius:.3,borderColor:`darkgray`},children:l(Ce,{})}),l(`br`,{}),l(s,{variant:`h5`,children:`Result`}),u(e,{sx:o,children:[l(Te,{}),l(we,{})]})]})})}function rt({columns:e}){return l(ke,{children:he(e=>l(Oe,{children:l(De,{})},e),e)})}const it=Ze;function at({children:t,button:n=C,buttonChildren:r=`Menu`,buttonProps:i,isOpenIcon:a=l(x,{}),isClosedIcon:o=l(te,{}),onOpen:s,onClose:c}){let[d,f]=b(null),p=y(()=>!!d,[d]),m={...i,onClick:e=>{f(e.currentTarget)},"aria-controls":p?`dropdown-menu`:void 0,"aria-haspopup":`true`,"aria-expanded":p};return n===C&&(m.endIcon=p?a:o),_(()=>{p&&s?s():!p&&c&&c()},[p,s,c]),u(e,{children:[l(n,{...m,children:r}),l(F,{id:`dropdown-menu`,anchorEl:d,open:p,onClose:()=>{f(null)},children:typeof t==`function`?l(e,{children:t(()=>{f(null)})}):t})]})}const ot=m(void 0);function Z({strict:e=!0}={}){let t=g(ot);if(e&&!t)throw new k({strict:e,context:t},`DROPDOWN_MENU_NOT_FOUND`,`Could not find the DropdownMenu context. Please double-check that it is present.`);return t}function st({strict:e=!0}={}){return Z({strict:e})}function ct({children:e,onClose:t,...n}){let{anchorElement:r,isDropdownOpen:i,closeMenu:a}=st();return l(F,{anchorEl:r,open:i,onClose:(e,n)=>{e.defaultPrevented||a(),t&&t(e,n)},...n,children:e})}function lt({component:e,children:t,ref:n,onClick:r,...i}){let{closeMenu:a}=Z();return l(L,{component:e,ref:n,...i,onClick:e=>{r&&r(e),!e.defaultPrevented&&a()},children:t})}const Q=Z,ut=ct,dt=lt;var ft=ut;function pt({ref:e,href:t,children:n,onClick:r,...i}){let{closeMenu:a}=Q();return l(L,{component:z,href:t,ref:e,...i,onClick:e=>{e.defaultPrevented||a(),r&&r(e)},children:n})}function $({to:e,component:t=P,children:n,ref:r,...i}){return l(S,{component:t,to:e,ref:r,...i,children:n})}function mt({to:e,ref:t,children:n,onClick:r,...i}){let{closeMenu:a}=Q();return l(L,{component:$,to:e,ref:t,...i,onClick:e=>{e.defaultPrevented||a(),r&&r(e)},children:n})}function ht({icon:t=le,onOpen:n,onClose:r,iconProps:i,children:a}){let[o,s]=b(null),c=!!o,d=v();function f(e){s(e.currentTarget),n&&n()}function p(){s(null),r&&r()}return u(e,{children:[l(t,{"aria-owns":c?d:void 0,"aria-haspopup":`true`,onMouseEnter:f,onMouseLeave:p,...i}),l(Pe,{id:d,disablePortal:!0,disableScrollLock:!0,slotProps:{root:{disableEnforceFocus:!0,disableAutoFocus:!0,disableRestoreFocus:!0}},sx:{pointerEvents:`none`},open:c,anchorEl:o,anchorOrigin:{vertical:`bottom`,horizontal:`left`},transformOrigin:{vertical:`top`,horizontal:`left`},onClose:p,disableRestoreFocus:!0,children:a})]})}function gt({children:e,...t}){return l(I,{component:$,...t,children:e})}const _t=et,vt=K,yt=J,bt=Y;function xt(e){return{width:240,transition:e.transitions.create(`width`,{easing:e.transitions.easing.sharp,duration:e.transitions.duration.enteringScreen}),overflowX:`hidden`}}function St(e){return{transition:e.transitions.create(`width`,{easing:e.transitions.easing.sharp,duration:e.transitions.duration.leavingScreen}),overflowX:`hidden`,width:`calc(${e.spacing(7)} + 1px)`,[e.breakpoints.up(`sm`)]:{width:`calc(${e.spacing(8)} + 1px)`}}}const Ct=w(`div`)(({theme:e})=>({display:`flex`,alignItems:`center`,justifyContent:`flex-end`,padding:e.spacing(0,1),...e.mixins.toolbar})),wt=w(Ae,{shouldForwardProp:e=>e!==`open`})(({theme:e})=>({zIndex:e.zIndex.drawer+1,transition:e.transitions.create([`width`,`margin`],{easing:e.transitions.easing.sharp,duration:e.transitions.duration.leavingScreen}),variants:[{props:({open:e})=>e,style:{marginLeft:240,width:`calc(100% - 240px)`,transition:e.transitions.create([`width`,`margin`],{easing:e.transitions.easing.sharp,duration:e.transitions.duration.enteringScreen})}}]})),Tt=w(je,{shouldForwardProp:e=>e!==`open`})(({theme:e})=>({width:240,flexShrink:0,whiteSpace:`nowrap`,boxSizing:`border-box`,variants:[{props:({open:e})=>e,style:{...xt(e),"& .MuiDrawer-paper":xt(e)}},{props:({open:e})=>!e,style:{...St(e),"& .MuiDrawer-paper":St(e)}}]}));function Et({title:t,navItems:n,children:r,headerElements:i}){let o=fe(),[c,d]=b(!0),f=xe();function m(){d(!0)}function h(){d(!1)}return u(e,{sx:{display:`flex`},children:[l(A,{}),l(wt,{position:`fixed`,open:c,children:u(Ne,{children:[l(T,{color:`inherit`,"aria-label":`open drawer`,onClick:m,edge:`start`,sx:[{marginRight:5},c&&{display:`none`}],children:l(oe,{})}),l(s,{variant:`h6`,noWrap:!0,component:`div`,children:t}),i]})}),u(Tt,{variant:`permanent`,open:c,children:[l(Ct,{children:l(T,{onClick:h,children:o.direction===`rtl`?l(re,{}):l(ne,{})})}),l(a,{}),n.map(e=>u(p,{children:[u(E,{children:[l(s,{variant:c?`h5`:`h6`,sx:{paddingLeft:c?2:1},children:c?e.category:N(e.category,4)}),e.options.map(e=>l(D,{disablePadding:!0,sx:{display:`block`},children:u(I,{sx:[{minHeight:48,px:2.5},c?{justifyContent:`initial`}:{justifyContent:`center`}],component:P,to:e.to,selected:f.pathname===e.to,children:[l(Me,{sx:[{minWidth:0,justifyContent:`center`},c?{mr:3}:{mr:`auto`}],children:e.icon?e.icon:c?null:l(s,{children:N(e.label,4)})}),l(O,{primary:e.label,sx:[c?{opacity:1}:{opacity:0}]})]})},e.to))]}),l(a,{})]},e.category))]}),u(e,{component:`main`,sx:{flexGrow:1,p:3},children:[l(Ct,{}),r]})]})}function Dt({text:e,sx:t,...n}){return l(c,{children:e.split(`
2
- `).map((e,r)=>l(s,{sx:{margin:1,...t},...n,children:e},r))})}function Ot({disableClean:e,label:t,...n}){let{formState:{disabled:r,isDirty:i,isSubmitting:a}}=Fe();return l(C,{color:`primary`,disabled:n.disabled||e&&!i||r,loading:a,type:`submit`,variant:`contained`,...n,children:t})}function kt(e){let[t,n]=b(()=>{let t=window.location.hash.replace(`#`,``);return e&&t===``?e:t}),r=h(()=>{let t=window.location.hash.replace(`#`,``);n(e&&t===``?e:t)},[n,e]);return _(()=>(window.addEventListener(`hashchange`,r),()=>{window.removeEventListener(`hashchange`,r)}),[r]),[t,h(e=>{let n=typeof e==`function`?e(t):e;n!==t&&(window.location.hash=n)},[t])]}export{Le as Artwork,Re as CollapsableItem,it as DarkModeToggle,at as DropdownMenu,ft as DropdownMenu2,pt as DropdownMenuExternalLink,mt as DropdownMenuInternalLink,dt as DropdownMenuItem,z as ExternalLink,B as FileInput,He as FileInputList,ze as FileType,ht as IconWithPopover,$ as InternalLink,gt as ListItemInternalLink,_t as Loader,vt as LoaderData,yt as LoaderError,bt as LoaderProvider,We as ModeProvider,Ze as ModeToggle,Qe as NavigationBottom,Et as NavigationDrawer,$e as Page,Dt as PopoverText,et as QueryBoundary,K as QueryBoundaryData,q as QueryBoundaryDataMap,J as QueryBoundaryError,tt as QueryBoundaryMap,Y as QueryBoundaryProvider,nt as ReactPlayground,qe as ScreenSizeProvider,rt as SkeletonRow,Xe as SnackbarProvider,Ot as SubmitButton,V as SwitchWithIcons,Q as useDropdownMenu,kt as useHash,U as useMode,Ke as useScreenSize,Ye as useSnackbar};
1
+ import e from"@mui/material/Box";import t from"@mui/material/Card";import n from"@mui/material/CardContent";import r from"@mui/material/CardHeader";import i from"@mui/material/Chip";import a from"@mui/material/Divider";import o from"@mui/material/Stack";import s from"@mui/material/Typography";import{Fragment as c,jsx as l,jsxs as u}from"react/jsx-runtime";import d from"@mui/material/ButtonBase";import f from"@mui/material/Collapse";import{Fragment as p,createContext as m,useCallback as h,useContext as g,useEffect as _,useId as v,useMemo as y,useRef as ee,useState as b}from"react";import{MdArrowDropDown as te,MdArrowDropUp as x,MdChevronLeft as ne,MdChevronRight as re,MdCloudUpload as ie,MdDelete as ae,MdMenu as oe,MdOutlineDarkMode as se,MdOutlineLightMode as ce,MdVisibility as le}from"react-icons/md";import ue from"@mui/material/Link";import S from"@mui/material/Button";import{ThemeProvider as de,createTheme as fe,styled as C,useTheme as pe}from"@mui/material/styles";import w from"@mui/material/IconButton";import T from"@mui/material/List";import E from"@mui/material/ListItem";import D from"@mui/material/ListItemText";import me from"@mui/material/Tooltip";import he from"@mui/material/Switch";import{DataError as O}from"@alextheman/utility/v6";import k from"@mui/material/CssBaseline";import A from"@mui/material/CircularProgress";import j from"@mui/material/Alert";import{fillArray as ge,truncate as M,wait as _e}from"@alextheman/utility";import ve from"@mui/material/Snackbar";import ye from"@mui/material/BottomNavigation";import be from"@mui/material/BottomNavigationAction";import xe from"@mui/material/Paper";import{Link as N,useLocation as Se}from"react-router-dom";import{stripIndent as Ce}from"common-tags";import{LiveEditor as we,LiveError as Te,LivePreview as Ee,LiveProvider as De}from"react-live";import Oe from"@mui/material/Skeleton";import ke from"@mui/material/TableCell";import Ae from"@mui/material/TableRow";import P from"@mui/material/Menu";import je from"@mui/material/AppBar";import Me from"@mui/material/Drawer";import F from"@mui/material/ListItemButton";import Ne from"@mui/material/ListItemIcon";import Pe from"@mui/material/Toolbar";import I from"@mui/material/MenuItem";import Fe from"@mui/material/Popover";import{useFormContext as Ie}from"react-hook-form";function L({containerLabel:e,chipLabels:r}){return l(t,{sx:{width:320,height:420,backgroundColor:`rgba(255,255,255,0.07)`,backdropFilter:`blur(8px)`,border:`1px solid rgba(255,255,255,0.06)`,boxShadow:`0 10px 40px rgba(0,0,0,0.35)`},children:u(n,{children:[l(s,{variant:`h6`,gutterBottom:!0,sx:{color:`#f8fafc`},children:e}),l(o,{spacing:1,children:r.map(e=>l(i,{label:e,sx:{backgroundColor:`rgba(255,255,255,0.11)`,color:`rgba(255,255,255,0.88)`,border:`1px solid rgba(255,255,255,0.06)`}},e))})]})})}function Le(){return l(e,{sx:{width:120,height:6,borderRadius:3,background:`linear-gradient(90deg, #f43f5e, #a78bfa, #22d3ee)`,boxShadow:`0 0 24px rgba(167,139,250,0.55)`}})}function Re(){return u(t,{sx:{width:1e3,height:1e3,display:`flex`,flexDirection:`column`,justifyContent:`space-between`,p:4,background:`radial-gradient(circle at 20% 10%, rgba(167,139,250,0.35) 0%, rgba(167,139,250,0.12) 35%, rgba(0,0,0,0) 55%), linear-gradient(135deg, #3a3380 0%, #1d2e5f 40%, #2d3f55 100%)`,color:`white`},elevation:0,children:[l(r,{title:`An Interface For You And I`,sx:{color:`#f8fafc`,textAlign:`center`,"& .MuiCardHeader-title":{fontSize:40,fontWeight:600,letterSpacing:2}}}),l(a,{sx:{borderColor:`rgba(255,255,255,0.2)`}}),l(n,{sx:{flex:1,display:`flex`,alignItems:`center`},children:u(o,{direction:`row`,spacing:4,sx:{width:`100%`,justifyContent:`center`,alignItems:`center`},children:[l(L,{containerLabel:`You`,chipLabels:[`state`,`context`,`input`,`event`,`focus`,`value`,`history`]}),l(Le,{}),l(L,{containerLabel:`I`,chipLabels:[`render`,`effect`,`response`,`update`,`history`,`layout`,`provider`]})]})})]})}function ze({isInitiallyOpen:t,onOpen:n,onClose:r,children:i,buttonStyles:a,buttonContents:o,buttonComponent:s=d,collapseProps:c,openIcon:p=l(x,{}),closedIcon:m=l(te,{}),useDefaultStyling:h=s===d}){let[g,v]=b(!!t);return _(()=>{g&&n?n():!g&&r&&r()},[g]),u(e,{children:[u(s,{onClick:()=>{v(e=>!e)},sx:h?{width:`100%`,display:`flex`,alignItems:`center`,justifyContent:`center`,paddingY:1.5,paddingX:2,textAlign:`center`,"&:hover":s===d?{backgroundColor:`action.hover`}:null,...a}:a,"aria-expanded":g,children:[o,g?p:m]}),l(f,{in:g,...c,children:i})]})}function R({href:e,children:t,ref:n,...r}){return l(ue,{component:`a`,href:e,ref:n,target:`_blank`,rel:`noopener noreferrer`,...r,children:t})}const Be={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`},Ve=C(`input`)({clip:`rect(0 0 0 0)`,clipPath:`inset(50%)`,height:1,overflow:`hidden`,position:`absolute`,bottom:0,left:0,whiteSpace:`nowrap`,width:1}),He=C(`div`)(({theme:e,$dragging:t})=>({border:`2px dashed`,borderColor:t?e.palette.primary.main:`#ccc`,backgroundColor:t?e.palette.action.hover:`transparent`,borderRadius:8,padding:`1.5rem`,textAlign:`center`,transition:`border-color 0.2s`,cursor:`pointer`}));function z({onFileInput:e,label:t=`Upload files`,multiple:n,accept:r,useDropzone:i,...a}){let[o,s]=b(!1),c=v(),d=u(S,{variant:`contained`,component:`label`,"aria-label":`File input button`,onKeyDown:e=>{(e.key===`Enter`||e.key===` `)&&(e.preventDefault(),document.getElementById(c)?.click())},...a,startIcon:a.startIcon??l(ie,{}),children:[t,l(Ve,{id:c,type:`file`,onChange:t=>{let n=t.target;e(Array.from(n.files??[])),n.value=``},multiple:n,accept:r?.join(`,`),disabled:a.disabled})]});return i?l(He,{$dragging:o,onDragOver:e=>{e.preventDefault(),!a.disabled&&s(!0)},onDragLeave:e=>{e.preventDefault(),s(!1)},onDrop:t=>{t.preventDefault(),s(!1),!a.disabled&&e(Array.from(t.dataTransfer.files??[]))},children:d}):d}function Ue({files:t,setFiles:n,multiple:r=!0,...i}){function a(e){n(t=>[...t,...e])}return u(e,{children:[l(z,{...i,multiple:r,onFileInput:a}),l(T,{children:t.map(e=>l(E,{secondaryAction:l(w,{"aria-label":`Delete`,edge:`end`,onClick:()=>{n(t=>t.filter(t=>t!==e))},children:l(ae,{})}),children:l(D,{primary:e.name})},`${e.name}-${e.lastModified}`))})]})}const We=C(he)(()=>({padding:8,"& .MuiSwitch-track":{borderRadius:11,"&::before, &::after":{content:`""`,position:`absolute`,top:`50%`,transform:`translateY(-50%)`,fontSize:16,width:28,height:28}}}));function B({checkedIcon:t,checkedIconStyles:n,uncheckedIcon:r,uncheckedIconStyles:i,...a}){let o={borderRadius:`50%`,borderColor:`white`,backgroundColor:`white`,display:`flex`,alignItems:`center`,justifyContent:`center`,padding:.25},s={color:`black`,maxWidth:16.5,maxHeight:16.5};return l(We,{checkedIcon:l(e,{sx:o,children:l(t,{style:{...s,...n}})}),icon:l(e,{sx:o,children:l(r,{style:{...s,...i}})}),...a})}const V=m({toggleMode:()=>{},mode:`dark`});function H({strict:e=!0}={}){let t=g(V);if(e&&!t)throw new O({strict:e,context:t},`MODE_PROVIDER_NOT_FOUND`,`Could not find the ModeProvider context. Please double-check that it is present.`);return t}function Ge({children:e,mode:t=`dark`}){let[n,r]=b(t),i=y(()=>fe({palette:{mode:n},components:{MuiPaper:{styleOverrides:{root:({theme:e})=>({border:1,borderStyle:`solid`,borderColor:e.palette.divider})}}}}),[n]);return l(V.Provider,{value:{mode:n,toggleMode:()=>{r(e=>e===`light`?`dark`:`light`)}},children:u(de,{theme:i,children:[l(k,{}),e]})})}const U=m(void 0);function W({strict:e=!0}={}){let t=g(U);if(e&&!t)throw new O({strict:e,context:t},`LOADER_PROVIDER_NOT_FOUND`,`Could not find the QueryBoundaryProvider context. Please double-check that it is present.`);return t}function Ke({children:e,loadingComponent:t=l(A,{}),...n}){return l(U.Provider,{value:{loadingComponent:t,...n},children:e})}function G({children:e,dataParser:t,loadingComponent:n}){let{isLoading:r,data:i,dataParser:a,loadingComponent:o,error:s}=W(),u=t??a;return r?l(c,{children:n??o}):s||i==null?null:l(c,{children:typeof e==`function`?e(u?u(i):i):e})}function K({children:e,loadingComponent:t,itemKey:n,itemParser:r,dataParser:i,emptyComponent:a=l(s,{children:`No data present`}),strictlyRequireArray:o=!0}){let{isLoading:u,data:d,dataParser:f,loadingComponent:m,error:h}=W(),g=i??f,_=t??m;if(u)return l(c,{children:_});if(h||d==null)return null;if(!Array.isArray(d)){if(o)throw new O({data:d,strictlyRequireArray:o},`NOT_AN_ARRAY`,`Expected the data to be an array but it was not an array.`);return null}if(d.length===0)return l(c,{children:a});let v;return v=g?g(d):r?d.map(r):d,l(c,{children:v.map((t,r)=>l(p,{children:typeof e==`function`?e(t):e},n?n(t,r):r))})}function q({children:e,logError:t}){let{data:n,error:r,errorComponent:i,logError:a}=W(),o=t??a,s=ee(!1),u=e??i;return r?(o&&!s.current&&(n!=null&&console.error(`An error has occurred but data is still present. This may indicate an invalid query state.`,{data:n,error:r}),console.error(r),s.current=!0),typeof u==`function`?u(r):u?l(c,{children:u}):l(j,{severity:`error`,children:typeof r==`object`&&`message`in r&&typeof r.message==`string`?r.message:`An unknown error has occured. Please try again later.`})):null}function J({undefinedComponent:e,nullComponent:t,nullableComponent:n}){let{isLoading:r,data:i,error:a}=W();return r||a?null:i==null?n?l(c,{children:n}):i===void 0&&e?l(c,{children:e}):i===null&&t?l(c,{children:t}):l(j,{severity:`error`,children:`Failed to load data. Please try again later.`}):null}function Y({errorComponent:e,logError:t,...n}){return u(c,{children:[l(q,{logError:t,children:e}),l(J,{...n})]})}var X=Ke;const qe=m({windowWidth:0,windowHeight:0,isLargeScreen:!1});function Je({strict:e=!0}={}){let t=g(qe);if(e&&!t)throw new O({strict:e,context:t},`SCREEN_SIZE_PROVIDER_NOT_FOUND`,`Could not find the ScreenSizeProvider context. Please double-check that it is present.`);return t}function Ye({children:e,largeScreenWidth:t=669,largeScreenHeight:n=660}){let[r,i]=b(window.innerWidth),[a,o]=b(window.innerHeight);_(()=>{function e(){i(window.innerWidth),o(window.innerHeight)}return e(),window.addEventListener(`resize`,e),()=>{window.removeEventListener(`resize`,e)}},[]);let s=y(()=>r>t&&a>n,[r,a,t,n]);return l(qe.Provider,{value:{isLargeScreen:s,windowWidth:r,windowHeight:a},children:e})}const Xe=m(void 0);function Ze({strict:e=!0}={}){let t=g(Xe);if(e&&!t)throw new O({strict:e,context:t},`SNACKBAR_PROVIDER_NOT_FOUND`,`Could not find the SnackbarProvider context. Please double-check that it is present.`);return t}function Qe({children:e,autoHideDuration:t=5e3}){let[n,r]=b(!1),[i,a]=b(t),[o,s]=b(``),[c,d]=b(`info`);function f(e,n,i){r(!0),a(i??t),d(n??`info`),s(e)}async function p(){r(!1),await _e(.2),s(``)}return u(Xe.Provider,{value:{addSnackbar:f},children:[l(ve,{open:n,autoHideDuration:i,onClose:p,children:l(j,{onClose:p,severity:c,children:o})}),e]})}function $e(){let{mode:e,toggleMode:t}=H(),n=e===`dark`,r=`Enable ${n?`light`:`dark`} mode`;return l(me,{title:r,children:l(B,{uncheckedIcon:ce,checkedIcon:se,checked:n,onChange:t,"aria-label":r})})}function et({children:t,navItems:n}){let[r,i]=b(``);return u(c,{children:[l(e,{sx:{paddingBottom:7},children:t}),l(xe,{sx:{position:`fixed`,bottom:0,left:0,right:0},children:l(ye,{showLabels:!0,value:r,onChange:(e,t)=>{i(t)},children:n.map(e=>l(be,{...e,component:N},e.value))})})]})}function tt({title:e,subtitle:i,action:o,children:d,tabs:f,disablePadding:p}){return u(t,{children:[l(r,{title:u(c,{children:[typeof e==`string`?l(s,{variant:`h6`,children:e}):e,i?typeof i==`string`?l(s,{variant:`body2`,color:`text.secondary`,children:i}):i:null]}),action:o}),f,l(a,{}),p?d:l(n,{children:d})]})}function nt({children:e,errorComponent:t,undefinedComponent:n,nullComponent:r,nullableComponent:i,logError:a,loadingComponent:o=l(A,{}),...s}){let c=l(Y,{logError:a,errorComponent:t});return i?c=l(Y,{nullableComponent:i,logError:a,errorComponent:t}):(n||r)&&(c=l(Y,{undefinedComponent:n,nullComponent:r,logError:a,errorComponent:t})),u(X,{loadingComponent:o,...s,children:[c,l(G,{children:e})]})}function rt({loadingComponent:e,undefinedComponent:t,nullComponent:n,nullableComponent:r,logError:i,errorComponent:a,children:o,isLoading:s,error:c,data:d,...f}){let p=l(Y,{logError:i,errorComponent:a});return r?p=l(Y,{nullableComponent:r,logError:i,errorComponent:a}):(t||n)&&(p=l(Y,{undefinedComponent:t,nullComponent:n,logError:i,errorComponent:a})),u(X,{loadingComponent:e,isLoading:s,error:c,data:d,children:[p,l(K,{...f,children:o})]})}function it({code:t,previewStyles:n,...r}){let{mode:i}=H(),a={backgroundColor:i===`dark`?`black`:`white`,border:.3,borderRadius:1,padding:2,borderColor:`darkgray`},o=n?{...a,...n}:{...a};return l(e,{sx:{borderRadius:1,border:.5,padding:2},children:u(De,{...r,code:Ce(t??``),children:[l(s,{variant:`h5`,children:`Code`}),l(e,{sx:{border:.3,borderRadius:.3,borderColor:`darkgray`},children:l(we,{})}),l(`br`,{}),l(s,{variant:`h5`,children:`Result`}),u(e,{sx:o,children:[l(Ee,{}),l(Te,{})]})]})})}function at({columns:e}){return l(Ae,{children:ge(e=>l(ke,{children:l(Oe,{})},e),e)})}const ot=$e;function st({children:t,button:n=S,buttonChildren:r=`Menu`,buttonProps:i,isOpenIcon:a=l(x,{}),isClosedIcon:o=l(te,{}),onOpen:s,onClose:c}){let[d,f]=b(null),p=y(()=>!!d,[d]),m={...i,onClick:e=>{f(e.currentTarget)},"aria-controls":p?`dropdown-menu`:void 0,"aria-haspopup":`true`,"aria-expanded":p};return n===S&&(m.endIcon=p?a:o),_(()=>{p&&s?s():!p&&c&&c()},[p,s,c]),u(e,{children:[l(n,{...m,children:r}),l(P,{id:`dropdown-menu`,anchorEl:d,open:p,onClose:()=>{f(null)},children:typeof t==`function`?l(e,{children:t(()=>{f(null)})}):t})]})}const ct=m(void 0);function Z({strict:e=!0}={}){let t=g(ct);if(e&&!t)throw new O({strict:e,context:t},`DROPDOWN_MENU_NOT_FOUND`,`Could not find the DropdownMenu context. Please double-check that it is present.`);return t}function lt({strict:e=!0}={}){return Z({strict:e})}function ut({children:e,onClose:t,...n}){let{anchorElement:r,isDropdownOpen:i,closeMenu:a}=lt();return l(P,{anchorEl:r,open:i,onClose:(e,n)=>{e.defaultPrevented||a(),t&&t(e,n)},...n,children:e})}function dt({component:e,children:t,ref:n,onClick:r,...i}){let{closeMenu:a}=Z();return l(I,{component:e,ref:n,...i,onClick:e=>{r&&r(e),!e.defaultPrevented&&a()},children:t})}const Q=Z,ft=ut,pt=dt;var mt=ft;function ht({ref:e,href:t,children:n,onClick:r,...i}){let{closeMenu:a}=Q();return l(I,{component:R,href:t,ref:e,...i,onClick:e=>{e.defaultPrevented||a(),r&&r(e)},children:n})}function $({to:e,component:t=N,children:n,ref:r,...i}){return l(ue,{component:t,to:e,ref:r,...i,children:n})}function gt({to:e,ref:t,children:n,onClick:r,...i}){let{closeMenu:a}=Q();return l(I,{component:$,to:e,ref:t,...i,onClick:e=>{e.defaultPrevented||a(),r&&r(e)},children:n})}function _t({icon:t=le,onOpen:n,onClose:r,iconProps:i,children:a}){let[o,s]=b(null),c=!!o,d=v();function f(e){s(e.currentTarget),n&&n()}function p(){s(null),r&&r()}return u(e,{children:[l(t,{"aria-owns":c?d:void 0,"aria-haspopup":`true`,onMouseEnter:f,onMouseLeave:p,...i}),l(Fe,{id:d,disablePortal:!0,disableScrollLock:!0,slotProps:{root:{disableEnforceFocus:!0,disableAutoFocus:!0,disableRestoreFocus:!0}},sx:{pointerEvents:`none`},open:c,anchorEl:o,anchorOrigin:{vertical:`bottom`,horizontal:`left`},transformOrigin:{vertical:`top`,horizontal:`left`},onClose:p,disableRestoreFocus:!0,children:a})]})}function vt({children:e,...t}){return l(F,{component:$,...t,children:e})}const yt=nt,bt=G,xt=Y,St=X;function Ct(e){return{width:240,transition:e.transitions.create(`width`,{easing:e.transitions.easing.sharp,duration:e.transitions.duration.enteringScreen}),overflowX:`hidden`}}function wt(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 Tt=C(`div`)(({theme:e})=>({display:`flex`,alignItems:`center`,justifyContent:`flex-end`,padding:e.spacing(0,1),...e.mixins.toolbar})),Et=C(je,{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})}}]})),Dt=C(Me,{shouldForwardProp:e=>e!==`open`})(({theme:e})=>({width:240,flexShrink:0,whiteSpace:`nowrap`,boxSizing:`border-box`,variants:[{props:({open:e})=>e,style:{...Ct(e),"& .MuiDrawer-paper":Ct(e)}},{props:({open:e})=>!e,style:{...wt(e),"& .MuiDrawer-paper":wt(e)}}]}));function Ot({title:t,navItems:n,children:r,headerElements:i}){let o=pe(),[c,d]=b(!0),f=Se();function m(){d(!0)}function h(){d(!1)}return u(e,{sx:{display:`flex`},children:[l(k,{}),l(Et,{position:`fixed`,open:c,children:u(Pe,{children:[l(w,{color:`inherit`,"aria-label":`open drawer`,onClick:m,edge:`start`,sx:[{marginRight:5},c&&{display:`none`}],children:l(oe,{})}),l(s,{variant:`h6`,noWrap:!0,component:`div`,children:t}),i]})}),u(Dt,{variant:`permanent`,open:c,children:[l(Tt,{children:l(w,{onClick:h,children:o.direction===`rtl`?l(re,{}):l(ne,{})})}),l(a,{}),n.map(e=>u(p,{children:[u(T,{children:[l(s,{variant:c?`h5`:`h6`,sx:{paddingLeft:c?2:1},children:c?e.category:M(e.category,4)}),e.options.map(e=>l(E,{disablePadding:!0,sx:{display:`block`},children:u(F,{sx:[{minHeight:48,px:2.5},c?{justifyContent:`initial`}:{justifyContent:`center`}],component:N,to:e.to,selected:f.pathname===e.to,children:[l(Ne,{sx:[{minWidth:0,justifyContent:`center`},c?{mr:3}:{mr:`auto`}],children:e.icon?e.icon:c?null:l(s,{children:M(e.label,4)})}),l(D,{primary:e.label,sx:[c?{opacity:1}:{opacity:0}]})]})},e.to))]}),l(a,{})]},e.category))]}),u(e,{component:`main`,sx:{flexGrow:1,p:3},children:[l(Tt,{}),r]})]})}function kt({text:e,sx:t,...n}){return l(c,{children:e.split(`
2
+ `).map((e,r)=>l(s,{sx:{margin:1,...t},...n,children:e},r))})}function At({disableClean:e,label:t,...n}){let{formState:{disabled:r,isDirty:i,isSubmitting:a}}=Ie();return l(S,{color:`primary`,disabled:n.disabled||e&&!i||r,loading:a,type:`submit`,variant:`contained`,...n,children:t})}function jt(e){let[t,n]=b(()=>{let t=window.location.hash.replace(`#`,``);return e&&t===``?e:t}),r=h(()=>{let t=window.location.hash.replace(`#`,``);n(e&&t===``?e:t)},[n,e]);return _(()=>(window.addEventListener(`hashchange`,r),()=>{window.removeEventListener(`hashchange`,r)}),[r]),[t,h(e=>{let n=typeof e==`function`?e(t):e;n!==t&&(window.location.hash=n)},[t])]}export{Re as Artwork,ze as CollapsableItem,ot as DarkModeToggle,st as DropdownMenu,mt as DropdownMenu2,ht as DropdownMenuExternalLink,gt as DropdownMenuInternalLink,pt as DropdownMenuItem,R as ExternalLink,z as FileInput,Ue as FileInputList,Be as FileType,_t as IconWithPopover,$ as InternalLink,vt as ListItemInternalLink,yt as Loader,bt as LoaderData,xt as LoaderError,St as LoaderProvider,Ge as ModeProvider,$e as ModeToggle,et as NavigationBottom,Ot as NavigationDrawer,tt as Page,kt as PopoverText,nt as QueryBoundary,G as QueryBoundaryData,K as QueryBoundaryDataMap,q as QueryBoundaryError,Y as QueryBoundaryFallback,rt as QueryBoundaryMap,J as QueryBoundaryNullable,X as QueryBoundaryProvider,it as ReactPlayground,Ye as ScreenSizeProvider,at as SkeletonRow,Qe as SnackbarProvider,At as SubmitButton,B as SwitchWithIcons,Q as useDropdownMenu,jt as useHash,H as useMode,Je as useScreenSize,Ze as useSnackbar};
3
3
  //# sourceMappingURL=index.js.map