@tiny-server/core 0.0.0 → 0.0.1

package/dist/app/features/extensions/Extension.d.ts

@@ -1,6 +1,6 @@
 import { ReactNode } from 'react';
 import { ExtensionName, ExtensionParams } from './types';
-export interface ExtensionProps<TName extends ExtensionName | (string & {})> {
+export interface ExtensionProps<TName extends ExtensionName> {
     /**
      * The name of the extension to render.
      */
@@ -8,7 +8,7 @@ export interface ExtensionProps<TName extends ExtensionName | (string & {})> {
     /**
      * The parameters to be forwarded to the extension component.
      */
-    params: TName extends ExtensionName ? ExtensionParams<TName> : Record<string, unknown>;
+    params: ExtensionParams<TName>;
     /**
      * An optional fallback to render if:
      * - there is no extension with the given name.
@@ -29,4 +29,4 @@ export interface ExtensionProps<TName extends ExtensionName | (string & {})> {
  * Renders registered extension componentsmatching the given name.
  * If no such extension components are known, renders a fallback.
  */
-export declare function Extension<Name extends ExtensionName | (string & {})>({ name, params, fallback, loadingFallback, errorFallback, }: ExtensionProps<Name>): string | number | bigint | boolean | Iterable<ReactNode> | Promise<string | number | bigint | boolean | import('react').ReactPortal | import('react').ReactElement<unknown, string | import('react').JSXElementConstructor<any>> | Iterable<ReactNode> | null | undefined> | import("react/jsx-runtime").JSX.Element | null | undefined;
+export declare function Extension<TName extends ExtensionName>({ name, params, fallback, loadingFallback, errorFallback, }: ExtensionProps<TName>): string | number | bigint | boolean | Iterable<ReactNode> | Promise<string | number | bigint | boolean | import('react').ReactPortal | import('react').ReactElement<unknown, string | import('react').JSXElementConstructor<any>> | Iterable<ReactNode> | null | undefined> | import("react/jsx-runtime").JSX.Element | null | undefined;

package/dist/app/features/extensions/types.d.ts

@@ -12,16 +12,19 @@ import { ComponentType } from 'react';
  * ```
  */
 export interface ExtensionParamsMap {
-    '': never;
 }
 /**
- * Defines all known extension names.
+ * Defines all typed/known extension names.
  */
-export type ExtensionName = keyof ExtensionParamsMap;
+export type KnownExtensionName = keyof ExtensionParamsMap;
+/**
+ * Defines an extension name, both typed/known and untyped/unknown.
+ */
+export type ExtensionName = KnownExtensionName | (string & {});
 /**
  * The parameters of the extension with the given `TName`.
  */
-export type ExtensionParams<TName extends ExtensionName> = ExtensionParamsMap[TName];
+export type ExtensionParams<TName extends ExtensionName> = TName extends KnownExtensionName ? ExtensionParamsMap[TName] : Record<string, unknown>;
 export interface ExtensionComponentProps<TName extends ExtensionName> {
     /**
      * The parameters to be forwarded to the extension component.

package/dist/app/features/menu/types.d.ts

@@ -23,13 +23,17 @@ export interface MenuParamsMap {
     default: {};
 }
 /**
- * Defines all known menu types.
+ * Defines all typed/known menu types.
  */
-export type MenuType = keyof MenuParamsMap;
+export type KnownMenuType = keyof MenuParamsMap;
+/**
+ * Defines a menu type, both typed/known and untyped/unknown.
+ */
+export type MenuType = KnownMenuType | (string & {});
 /**
  * The parameters of the menu with the given `TType`.
  */
-export type MenuParams<TType extends MenuType> = MenuParamsMap[TType];
+export type MenuParams<TType extends MenuType> = TType extends KnownMenuType ? MenuParamsMap[TType] : unknown;
 export interface MenuComponentProps<TMenuType extends MenuType = MenuType> extends PropsWithChildren {
     /**
      * The type of the menu that the item belongs to.

package/dist/app/features/modals/types.d.ts

@@ -32,16 +32,19 @@ declare module '../../types' {
  * ```
  */
 export interface ModalParamsMap {
-    '': never;
 }
 /**
- * Defines all known modal types.
+ * Defines all typed/known modal names.
  */
-export type ModalName = keyof ModalParamsMap;
+export type KnownModalName = keyof ModalParamsMap;
+/**
+ * Defines a modal name, both typed/known and untyped/unknown.
+ */
+export type ModalName = KnownModalName | (string & {});
 /**
  * The parameters of the modal with the given `TName`.
  */
-export type ModalParams<TName extends ModalName> = ModalParamsMap[TName];
+export type ModalParams<TName extends ModalName> = TName extends KnownModalName ? ModalParamsMap[TName] : unknown;
 export interface ModalComponentProps<TName extends ModalName> {
     /**
      * The modal name.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tiny-server/core",
-  "version": "0.0.0",
+  "version": "0.0.1",
   "description": "The Tiny Server core frontend package.",
   "keywords": [
     "tiny-server",
@@ -48,5 +48,6 @@
     "react-i18next": "^17",
     "react-router": "^7",
     "zustand": "^5"
-  }
+  },
+  "gitHead": "446a1f901f369fb4534e20fd3cf95c71ca2cbbf1"
 }

package/src/app/features/extensions/Extension.tsx

@@ -1,69 +1,69 @@
-import { type ReactNode, useMemo, Suspense, type ComponentType } from 'react';
-import { ErrorBoundary } from '../../../components';
-import type { ExtensionComponentProps, ExtensionName, ExtensionParams } from './types';
-import { useApp } from '../../context';
-
-export interface ExtensionProps<TName extends ExtensionName> {
-  /**
-   * The name of the extension to render.
-   */
-  name: TName;
-  /**
-   * The parameters to be forwarded to the extension component.
-   */
-  params: ExtensionParams<TName>;
-  /**
-   * An optional fallback to render if:
-   * - there is no extension with the given name.
-   * - no {@link loadingFallback} is provided and the extension is loading.
-   * - no {@link errorFallback} is provided and the extension errored.
-   */
-  fallback?: ReactNode;
-  /**
-   * An optional fallback to render while the extension is being lazy-loaded.
-   */
-  loadingFallback?: ReactNode;
-  /**
-   * An optional fallback to render if an error is caught while rendering the extension.
-   */
-  errorFallback?: ReactNode;
-}
-
-/**
- * Renders registered extension componentsmatching the given name.
- * If no such extension components are known, renders a fallback.
- */
-export function Extension<TName extends ExtensionName>({
-  name,
-  params,
-  fallback,
-  loadingFallback,
-  errorFallback,
-}: ExtensionProps<TName>) {
-  const app = useApp();
-  const { Loading, Error } = app.components;
-
-  loadingFallback ??= <Loading kind="extension" />;
-  errorFallback ??= <Error kind="extension" />;
-
-  const extensionComponents = useMemo(() => {
-    return app.modules
-      .flatMap((m) => m.extensions)
-      .filter((registration) => registration.name === name)
-      .map((registration) => registration.component) as Array<ComponentType<ExtensionComponentProps<ExtensionName>>>;
-  }, [name, app.modules]);
-
-  if (extensionComponents.length === 0) {
-    return fallback;
-  }
-
-  return (
-    <ErrorBoundary fallback={errorFallback ?? fallback}>
-      <Suspense fallback={loadingFallback ?? fallback}>
-        {extensionComponents.map((ExtensionComponent, index) => (
-          <ExtensionComponent key={index} params={params} />
-        ))}
-      </Suspense>
-    </ErrorBoundary>
-  );
-}
+import { type ReactNode, useMemo, Suspense, type ComponentType } from 'react';
+import { ErrorBoundary } from '../../../components';
+import type { ExtensionComponentProps, ExtensionName, ExtensionParams } from './types';
+import { useApp } from '../../context';
+
+export interface ExtensionProps<TName extends ExtensionName> {
+  /**
+   * The name of the extension to render.
+   */
+  name: TName;
+  /**
+   * The parameters to be forwarded to the extension component.
+   */
+  params: ExtensionParams<TName>;
+  /**
+   * An optional fallback to render if:
+   * - there is no extension with the given name.
+   * - no {@link loadingFallback} is provided and the extension is loading.
+   * - no {@link errorFallback} is provided and the extension errored.
+   */
+  fallback?: ReactNode;
+  /**
+   * An optional fallback to render while the extension is being lazy-loaded.
+   */
+  loadingFallback?: ReactNode;
+  /**
+   * An optional fallback to render if an error is caught while rendering the extension.
+   */
+  errorFallback?: ReactNode;
+}
+
+/**
+ * Renders registered extension componentsmatching the given name.
+ * If no such extension components are known, renders a fallback.
+ */
+export function Extension<TName extends ExtensionName>({
+  name,
+  params,
+  fallback,
+  loadingFallback,
+  errorFallback,
+}: ExtensionProps<TName>) {
+  const app = useApp();
+  const { Loading, Error } = app.components;
+
+  loadingFallback ??= <Loading kind="extension" />;
+  errorFallback ??= <Error kind="extension" />;
+
+  const extensionComponents = useMemo(() => {
+    return app.modules
+      .flatMap((m) => m.extensions)
+      .filter((registration) => registration.name === name)
+      .map((registration) => registration.component) as Array<ComponentType<ExtensionComponentProps<ExtensionName>>>;
+  }, [name, app.modules]);
+
+  if (extensionComponents.length === 0) {
+    return fallback;
+  }
+
+  return (
+    <ErrorBoundary fallback={errorFallback ?? fallback}>
+      <Suspense fallback={loadingFallback ?? fallback}>
+        {extensionComponents.map((ExtensionComponent, index) => (
+          <ExtensionComponent key={index} params={params} />
+        ))}
+      </Suspense>
+    </ErrorBoundary>
+  );
+}

package/src/app/features/extensions/types.tsx

@@ -1,52 +1,52 @@
-import type { ComponentType } from 'react';
-
-/**
- * Maps extension keys to their corresponding component props.
- * This interface can be extended by modules via declaration merging.
- *
- * ```ts
- * declare module '@tiny-server/core' {
- *   export interface ExtensionParamsMap {
- *     'my-extension': MyExtensionProps;
- *   }
- * }
- * ```
- */
-export interface ExtensionParamsMap {}
-
-/**
- * Defines all typed/known extension names.
- */
-export type KnownExtensionName = keyof ExtensionParamsMap;
-
-/**
- * Defines an extension name, both typed/known and untyped/unknown.
- */
-export type ExtensionName = KnownExtensionName | (string & {});
-
-/**
- * The parameters of the extension with the given `TName`.
- */
-export type ExtensionParams<TName extends ExtensionName> = TName extends KnownExtensionName
-  ? ExtensionParamsMap[TName]
-  : Record<string, unknown>;
-
-export interface ExtensionComponentProps<TName extends ExtensionName> {
-  /**
-   * The parameters to be forwarded to the extension component.
-   */
-  params: ExtensionParams<TName>;
-}
-
-export interface ExtensionRegistration<TName extends ExtensionName> {
-  /**
-   * The name of the extension to be registered.
-   */
-  name: TName;
-  /**
-   * The component to be rendered for the extension.
-   */
-  component: ComponentType<ExtensionComponentProps<TName>>;
-}
-
-export type AnyExtensionRegistration = { [Key in ExtensionName]: ExtensionRegistration<Key> }[ExtensionName];
+import type { ComponentType } from 'react';
+
+/**
+ * Maps extension keys to their corresponding component props.
+ * This interface can be extended by modules via declaration merging.
+ *
+ * ```ts
+ * declare module '@tiny-server/core' {
+ *   export interface ExtensionParamsMap {
+ *     'my-extension': MyExtensionProps;
+ *   }
+ * }
+ * ```
+ */
+export interface ExtensionParamsMap {}
+
+/**
+ * Defines all typed/known extension names.
+ */
+export type KnownExtensionName = keyof ExtensionParamsMap;
+
+/**
+ * Defines an extension name, both typed/known and untyped/unknown.
+ */
+export type ExtensionName = KnownExtensionName | (string & {});
+
+/**
+ * The parameters of the extension with the given `TName`.
+ */
+export type ExtensionParams<TName extends ExtensionName> = TName extends KnownExtensionName
+  ? ExtensionParamsMap[TName]
+  : Record<string, unknown>;
+
+export interface ExtensionComponentProps<TName extends ExtensionName> {
+  /**
+   * The parameters to be forwarded to the extension component.
+   */
+  params: ExtensionParams<TName>;
+}
+
+export interface ExtensionRegistration<TName extends ExtensionName> {
+  /**
+   * The name of the extension to be registered.
+   */
+  name: TName;
+  /**
+   * The component to be rendered for the extension.
+   */
+  component: ComponentType<ExtensionComponentProps<TName>>;
+}
+
+export type AnyExtensionRegistration = { [Key in ExtensionName]: ExtensionRegistration<Key> }[ExtensionName];

package/src/app/features/menu/Menu.tsx

@@ -1,66 +1,66 @@
-import { Suspense, useMemo, type ComponentType } from 'react';
-import type {
-  AnyMenuItemRegistration,
-  MenuComponentProps,
-  MenuItemComponentProps,
-  MenuParams,
-  MenuType,
-} from './types';
-import { ErrorBoundary } from '../../../components';
-import { useApp } from '../../context';
-
-export interface MenuProps<TMenuType extends MenuType = MenuType> extends MenuComponentProps<TMenuType> {}
-
-/**
- * Renders the menu of the given type.
- */
-export function Menu({ type, params }: MenuProps) {
-  const {
-    components: { MenuContainer, Loading, Error },
-    modules,
-  } = useApp();
-
-  const items = useMemo(() => {
-    const itemsOfType = modules.flatMap((m) => m.menuItems).filter((item) => item.menu === type);
-    const rootItems = itemsOfType.filter((item) => !item.parentId);
-    return rootItems.map((item) => (
-      <MenuItem key={item.id} type={type} params={params} thisItem={item} allItems={itemsOfType} />
-    ));
-  }, [type, params, modules]);
-
-  return (
-    <ErrorBoundary fallback={<Error kind="menu" />}>
-      <Suspense fallback={<Loading kind="menu" />}>
-        <MenuContainer type={type} params={params}>
-          {items}
-        </MenuContainer>
-      </Suspense>
-    </ErrorBoundary>
-  );
-}
-
-interface MenuItemProps {
-  type: MenuType;
-  params: MenuParams<MenuType>;
-  thisItem: AnyMenuItemRegistration;
-  allItems: Array<AnyMenuItemRegistration>;
-}
-
-function MenuItem({ type, params, thisItem, allItems }: MenuItemProps) {
-  const Component = thisItem.component as ComponentType<MenuItemComponentProps>;
-
-  const children = useMemo(() => {
-    const childItems = allItems
-      .filter((item) => item.parentId === thisItem.id)
-      .map((item) => <MenuItem key={item.id} type={type} params={params} thisItem={item} allItems={allItems} />);
-
-    // Do not return empty arrays. This plays better with Mantine's NavLink children.
-    return childItems.length > 0 ? childItems : undefined;
-  }, [type, params, thisItem, allItems]);
-
-  return (
-    <Component id={thisItem.id} type={type} params={params}>
-      {children}
-    </Component>
-  );
-}
+import { Suspense, useMemo, type ComponentType } from 'react';
+import type {
+  AnyMenuItemRegistration,
+  MenuComponentProps,
+  MenuItemComponentProps,
+  MenuParams,
+  MenuType,
+} from './types';
+import { ErrorBoundary } from '../../../components';
+import { useApp } from '../../context';
+
+export interface MenuProps<TMenuType extends MenuType = MenuType> extends MenuComponentProps<TMenuType> {}
+
+/**
+ * Renders the menu of the given type.
+ */
+export function Menu({ type, params }: MenuProps) {
+  const {
+    components: { MenuContainer, Loading, Error },
+    modules,
+  } = useApp();
+
+  const items = useMemo(() => {
+    const itemsOfType = modules.flatMap((m) => m.menuItems).filter((item) => item.menu === type);
+    const rootItems = itemsOfType.filter((item) => !item.parentId);
+    return rootItems.map((item) => (
+      <MenuItem key={item.id} type={type} params={params} thisItem={item} allItems={itemsOfType} />
+    ));
+  }, [type, params, modules]);
+
+  return (
+    <ErrorBoundary fallback={<Error kind="menu" />}>
+      <Suspense fallback={<Loading kind="menu" />}>
+        <MenuContainer type={type} params={params}>
+          {items}
+        </MenuContainer>
+      </Suspense>
+    </ErrorBoundary>
+  );
+}
+
+interface MenuItemProps {
+  type: MenuType;
+  params: MenuParams<MenuType>;
+  thisItem: AnyMenuItemRegistration;
+  allItems: Array<AnyMenuItemRegistration>;
+}
+
+function MenuItem({ type, params, thisItem, allItems }: MenuItemProps) {
+  const Component = thisItem.component as ComponentType<MenuItemComponentProps>;
+
+  const children = useMemo(() => {
+    const childItems = allItems
+      .filter((item) => item.parentId === thisItem.id)
+      .map((item) => <MenuItem key={item.id} type={type} params={params} thisItem={item} allItems={allItems} />);
+
+    // Do not return empty arrays. This plays better with Mantine's NavLink children.
+    return childItems.length > 0 ? childItems : undefined;
+  }, [type, params, thisItem, allItems]);
+
+  return (
+    <Component id={thisItem.id} type={type} params={params}>
+      {children}
+    </Component>
+  );
+}

package/src/app/features/menu/types.ts

@@ -1,84 +1,84 @@
-import type { ComponentType, PropsWithChildren } from 'react';
-import type { MenuContainerProps } from './MenuContainer';
-import type { MenuItemProps } from './MenuItem';
-
-declare module '../../types' {
-  export interface AppComponents {
-    MenuContainer: ComponentType<MenuContainerProps>;
-    MenuItem: ComponentType<MenuItemProps>;
-  }
-}
-
-/**
- * A map of all known menus.
- * This interface can be extended by modules via declaration merging.
- *
- * ```ts
- * declare module '@tiny-server/core' {
- *   export interface MenuParamsMap {
- *     'my-menu': MyMenuParams;
- *   }
- * }
- * ```
- */
-export interface MenuParamsMap {
-  default: {};
-}
-
-/**
- * Defines all typed/known menu types.
- */
-export type KnownMenuType = keyof MenuParamsMap;
-
-/**
- * Defines a menu type, both typed/known and untyped/unknown.
- */
-export type MenuType = KnownMenuType | (string & {});
-
-/**
- * The parameters of the menu with the given `TType`.
- */
-export type MenuParams<TType extends MenuType> = TType extends KnownMenuType ? MenuParamsMap[TType] : unknown;
-
-export interface MenuComponentProps<TMenuType extends MenuType = MenuType> extends PropsWithChildren {
-  /**
-   * The type of the menu that the item belongs to.
-   */
-  type: TMenuType;
-  /**
-   * The parameters to be forwarded to the menu item component.
-   */
-  params: MenuParams<TMenuType>;
-}
-
-export interface MenuItemComponentProps<TMenuType extends MenuType = MenuType> extends MenuComponentProps<TMenuType> {
-  /**
-   * The unique identifier of the menu item.
-   */
-  id: string;
-}
-
-export interface MenuItemRegistration<TMenuType extends MenuType> {
-  /**
-   * A unique identifier for the menu item.
-   */
-  id: string;
-  /**
-   * The unique identifier of the parent menu item.
-   * Must reference an existing parent menu item within the same menu.
-   * If no parent is found, the child is not rendered.
-   */
-  parentId?: string;
-  /**
-   * The menu that the item belongs to.
-   */
-  menu: TMenuType;
-  /**
-   * The component to be rendered for the menu item.
-   */
-  component: ComponentType<MenuItemComponentProps<TMenuType>>;
-}
-
-export type AnyMenuItemRegistration = {
-  [TMenuType in MenuType]: MenuItemRegistration<TMenuType>;
-}[MenuType];
+import type { ComponentType, PropsWithChildren } from 'react';
+import type { MenuContainerProps } from './MenuContainer';
+import type { MenuItemProps } from './MenuItem';
+
+declare module '../../types' {
+  export interface AppComponents {
+    MenuContainer: ComponentType<MenuContainerProps>;
+    MenuItem: ComponentType<MenuItemProps>;
+  }
+}
+
+/**
+ * A map of all known menus.
+ * This interface can be extended by modules via declaration merging.
+ *
+ * ```ts
+ * declare module '@tiny-server/core' {
+ *   export interface MenuParamsMap {
+ *     'my-menu': MyMenuParams;
+ *   }
+ * }
+ * ```
+ */
+export interface MenuParamsMap {
+  default: {};
+}
+
+/**
+ * Defines all typed/known menu types.
+ */
+export type KnownMenuType = keyof MenuParamsMap;
+
+/**
+ * Defines a menu type, both typed/known and untyped/unknown.
+ */
+export type MenuType = KnownMenuType | (string & {});
+
+/**
+ * The parameters of the menu with the given `TType`.
+ */
+export type MenuParams<TType extends MenuType> = TType extends KnownMenuType ? MenuParamsMap[TType] : unknown;
+
+export interface MenuComponentProps<TMenuType extends MenuType = MenuType> extends PropsWithChildren {
+  /**
+   * The type of the menu that the item belongs to.
+   */
+  type: TMenuType;
+  /**
+   * The parameters to be forwarded to the menu item component.
+   */
+  params: MenuParams<TMenuType>;
+}
+
+export interface MenuItemComponentProps<TMenuType extends MenuType = MenuType> extends MenuComponentProps<TMenuType> {
+  /**
+   * The unique identifier of the menu item.
+   */
+  id: string;
+}
+
+export interface MenuItemRegistration<TMenuType extends MenuType> {
+  /**
+   * A unique identifier for the menu item.
+   */
+  id: string;
+  /**
+   * The unique identifier of the parent menu item.
+   * Must reference an existing parent menu item within the same menu.
+   * If no parent is found, the child is not rendered.
+   */
+  parentId?: string;
+  /**
+   * The menu that the item belongs to.
+   */
+  menu: TMenuType;
+  /**
+   * The component to be rendered for the menu item.
+   */
+  component: ComponentType<MenuItemComponentProps<TMenuType>>;
+}
+
+export type AnyMenuItemRegistration = {
+  [TMenuType in MenuType]: MenuItemRegistration<TMenuType>;
+}[MenuType];

package/src/app/features/modals/types.ts

@@ -1,94 +1,94 @@
-import type { ComponentType } from 'react';
-import type { ModalProps } from './Modal';
-import type { ModalBodyProps } from './ModalBody';
-import type { ModalFooterProps } from './ModalFooter';
-import type { ModalHeaderProps } from './ModalHeader';
-
-declare module '../../types' {
-  export interface AppInstance {
-    /**
-     * Shows a registered modal window.
-     * @param name The name of the modal to be shown.
-     * @param params The parameters to be passed to the modal.
-     */
-    showModal<TModalName extends ModalName>(name: TModalName, params: ModalParams<TModalName>): void;
-  }
-
-  export interface AppComponents {
-    Modal: ComponentType<ModalProps>;
-    ModalBody: ComponentType<ModalBodyProps>;
-    ModalFooter: ComponentType<ModalFooterProps>;
-    ModalHeader: ComponentType<ModalHeaderProps>;
-  }
-}
-
-/**
- * A map of all known modals.
- * This interface can be extended by modules via declaration merging.
- *
- * ```ts
- * declare module '@tiny-server/core' {
- *   export interface ModalParamsMap {
- *     'my-modal': MyModalParams;
- *   }
- * }
- * ```
- */
-export interface ModalParamsMap {}
-
-/**
- * Defines all typed/known modal names.
- */
-export type KnownModalName = keyof ModalParamsMap;
-
-/**
- * Defines a modal name, both typed/known and untyped/unknown.
- */
-export type ModalName = KnownModalName | (string & {});
-
-/**
- * The parameters of the modal with the given `TName`.
- */
-export type ModalParams<TName extends ModalName> = TName extends KnownModalName ? ModalParamsMap[TName] : unknown;
-
-export interface ModalComponentProps<TName extends ModalName> {
-  /**
-   * The modal name.
-   */
-  name: TName;
-  /**
-   * The parameters to be forwarded to the modal component.
-   */
-  params: ModalParams<TName>;
-  /**
-   * Closes/unmounts the modal.
-   */
-  onClose(): void;
-}
-
-/**
- * Optional configuration values for the modal container.
- */
-export interface ModalOptions {
-  /**
-   * The modal's size.
-   */
-  size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl' | 'auto' | (string & {});
-}
-
-export interface ModalRegistration<TName extends ModalName> {
-  /**
-   * The name of the modal to be registered.
-   */
-  name: TName;
-  /**
-   * Optional configuration values for the modal container.
-   */
-  options?: ModalOptions;
-  /**
-   * The component to be rendered for the modal.
-   */
-  component: ComponentType<ModalComponentProps<TName>>;
-}
-
-export type AnyModalRegistration = { [Key in ModalName]: ModalRegistration<Key> }[ModalName];
+import type { ComponentType } from 'react';
+import type { ModalProps } from './Modal';
+import type { ModalBodyProps } from './ModalBody';
+import type { ModalFooterProps } from './ModalFooter';
+import type { ModalHeaderProps } from './ModalHeader';
+
+declare module '../../types' {
+  export interface AppInstance {
+    /**
+     * Shows a registered modal window.
+     * @param name The name of the modal to be shown.
+     * @param params The parameters to be passed to the modal.
+     */
+    showModal<TModalName extends ModalName>(name: TModalName, params: ModalParams<TModalName>): void;
+  }
+
+  export interface AppComponents {
+    Modal: ComponentType<ModalProps>;
+    ModalBody: ComponentType<ModalBodyProps>;
+    ModalFooter: ComponentType<ModalFooterProps>;
+    ModalHeader: ComponentType<ModalHeaderProps>;
+  }
+}
+
+/**
+ * A map of all known modals.
+ * This interface can be extended by modules via declaration merging.
+ *
+ * ```ts
+ * declare module '@tiny-server/core' {
+ *   export interface ModalParamsMap {
+ *     'my-modal': MyModalParams;
+ *   }
+ * }
+ * ```
+ */
+export interface ModalParamsMap {}
+
+/**
+ * Defines all typed/known modal names.
+ */
+export type KnownModalName = keyof ModalParamsMap;
+
+/**
+ * Defines a modal name, both typed/known and untyped/unknown.
+ */
+export type ModalName = KnownModalName | (string & {});
+
+/**
+ * The parameters of the modal with the given `TName`.
+ */
+export type ModalParams<TName extends ModalName> = TName extends KnownModalName ? ModalParamsMap[TName] : unknown;
+
+export interface ModalComponentProps<TName extends ModalName> {
+  /**
+   * The modal name.
+   */
+  name: TName;
+  /**
+   * The parameters to be forwarded to the modal component.
+   */
+  params: ModalParams<TName>;
+  /**
+   * Closes/unmounts the modal.
+   */
+  onClose(): void;
+}
+
+/**
+ * Optional configuration values for the modal container.
+ */
+export interface ModalOptions {
+  /**
+   * The modal's size.
+   */
+  size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl' | 'auto' | (string & {});
+}
+
+export interface ModalRegistration<TName extends ModalName> {
+  /**
+   * The name of the modal to be registered.
+   */
+  name: TName;
+  /**
+   * Optional configuration values for the modal container.
+   */
+  options?: ModalOptions;
+  /**
+   * The component to be rendered for the modal.
+   */
+  component: ComponentType<ModalComponentProps<TName>>;
+}
+
+export type AnyModalRegistration = { [Key in ModalName]: ModalRegistration<Key> }[ModalName];