@bluealba/pae-ui-react-core 4.5.0 → 4.5.1-develop-364

package/dist/src/components/FragmentSlot.d.ts

@@ -0,0 +1,82 @@
+import { default as React, FC } from 'react';
+
+export interface FragmentSlotProps {
+    /** Full module name of the fragment (e.g. "@org/myapp-admin") */
+    moduleName: string;
+    /** Additional CSS classes for the host element */
+    className?: string;
+    /** Additional inline styles for the host element */
+    style?: React.CSSProperties;
+    /**
+     * Component to render while the fragment bundle is loading.
+     * Receives `{ moduleName }` as props. Renders nothing if not provided.
+     */
+    LoadingComponent?: FC<{
+        moduleName: string;
+    }>;
+    /**
+     * Component to render when the fragment bundle fails to load.
+     * Receives `{ moduleName }` as props. Renders nothing if not provided.
+     */
+    ErrorComponent?: FC<{
+        moduleName: string;
+    }>;
+    /**
+     * Component to render when the fragment is in an inactive state — i.e. registered in
+     * single-spa but not currently loading, mounted, or broken. This covers the statuses:
+     * `NOT_LOADED`, `NOT_BOOTSTRAPPED`, `NOT_MOUNTED`, and `UNMOUNTING`.
+     *
+     * Receives `{ moduleName, status }` where `status` is the raw single-spa status string,
+     * useful for branching on specific inactive phases.
+     * Renders nothing if not provided.
+     */
+    IdleComponent?: FC<{
+        moduleName: string;
+        status: string;
+    }>;
+}
+/**
+ * Renders the host element where a `fragment` microfrontend will be mounted by single-spa.
+ *
+ * The component looks up the module in the platform catalog by `moduleName`, validates that it
+ * is of type `fragment`, derives the element `id` from `ui.mountAtSelector`, and renders a
+ * plain `<div>` with that `id`. single-spa then mounts/unmounts the fragment into that element
+ * automatically when the fragment's route matches.
+ *
+ * The component intentionally does NOT manage the fragment lifecycle — that is single-spa's
+ * responsibility. The parent app is only responsible for rendering (or not rendering) this host
+ * element at the right time.
+ *
+ * Optional `LoadingComponent`, `ErrorComponent`, and `IdleComponent` props can be provided to
+ * show feedback during the various single-spa lifecycle phases. All three render as **siblings**
+ * of the host `<div>` (not children) because single-spa owns the host element's DOM content
+ * exclusively — mixing React-managed children inside it causes `removeChild` errors.
+ * When not provided, nothing extra is rendered.
+ *
+ * @example
+ * // Minimal usage:
+ * <FragmentSlot moduleName="@myorg/myapp-admin" className="admin-host" />
+ *
+ * @example
+ * // With loading and error feedback:
+ * <FragmentSlot
+ *   moduleName="@myorg/myapp-admin"
+ *   LoadingComponent={({ moduleName }) => <span>Loading {moduleName}…</span>}
+ *   ErrorComponent={({ moduleName }) => <span>Failed to load {moduleName}</span>}
+ * />
+ *
+ * @example
+ * // With all three slots and branching on idle status:
+ * <FragmentSlot
+ *   moduleName="@myorg/myapp-admin"
+ *   LoadingComponent={({ moduleName }) => <Spinner label={moduleName} />}
+ *   ErrorComponent={({ moduleName }) => <Alert>Failed to load {moduleName}</Alert>}
+ *   IdleComponent={({ moduleName, status }) =>
+ *     status === 'NOT_MOUNTED'
+ *       ? <p>{moduleName} is ready — navigate to its route to activate it.</p>
+ *       : null
+ *   }
+ * />
+ */
+declare const FragmentSlot: FC<FragmentSlotProps>;
+export default FragmentSlot;

package/dist/src/components/index.d.ts

@@ -6,3 +6,5 @@ export { default as PlatformEventListener } from './PlatformEventListener';
 export { default as ApplicationIcon } from './ApplicationIcon';
 export { default as ThemeToggle } from './ThemeToggle/ThemeToggle';
 export { useTheme } from './ThemeToggle/useTheme';
+export { default as FragmentSlot } from './FragmentSlot';
+export type { FragmentSlotProps } from './FragmentSlot';

package/dist/src/hooks/index.d.ts

@@ -42,3 +42,4 @@ export { useResourceActions } from './commons/useResourceActions';
 export { useResource } from './commons/useResource';
 export { useTenants } from './tenants/useTenants';
 export { useUserState } from './userState/useUserState';
+export { useAppStatus } from './useAppStatus';

package/dist/src/model/ModuleMetadata.d.ts

@@ -1,6 +1,18 @@
 import { ModuleMetadata } from '@bluealba/pae-core';
 import { PlatformApplication } from '../hooks';
 
+/**
+ * Returns true for modules that are the *primary* UI of an application (`app` or `tool`).
+ * These are eligible to appear in the navbar/launcher and to be resolved as "the UI" of an app.
+ * `fragment` modules are intentionally excluded — they are embedded UIs, not primary UIs.
+ */
 export declare const isUIModule: (module: ModuleMetadata) => boolean;
+/**
+ * Returns true for any module that is a microfrontend registered in single-spa,
+ * including embedded fragments. Use this predicate when deciding whether a module
+ * should appear in the import-map or be registered with single-spa.
+ * Contrast with `isUIModule` which only covers primary (navbar-visible) UIs.
+ */
+export declare const isMicrofrontendModule: (module: ModuleMetadata) => boolean;
 export declare const isShellUIModule: (module: ModuleMetadata) => boolean;
 export declare const isUIApplication: (app: PlatformApplication) => boolean | "" | undefined;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bluealba/pae-ui-react-core",
-  "version": "4.5.0",
+  "version": "4.5.1-develop-364",
   "type": "module",
   "main": "./dist/index.cjs.js",
   "module": "./dist/index.esm.js",