@optiaxiom/proteus 0.2.9 → 0.2.10

package/dist/esm/assets/src/proteus-chart/{ProteusChart.css.ts.vanilla-BO0-TwP_.css → ProteusChart.css.ts.vanilla-9aXajeqc.css}

@@ -1,5 +1,5 @@
-@layer optiaxiom._1fgw1dd;
-@layer optiaxiom._1fgw1dd {
+@layer optiaxiom._13gldnk;
+@layer optiaxiom._13gldnk {
   .ProteusChart__jmlqij1 {
     border-radius: 16px;
   }

package/dist/esm/assets/src/proteus-chart/{ProteusChartTooltipContent.css.ts.vanilla-ETMXhILd.css → ProteusChartTooltipContent.css.ts.vanilla-BvKLAJt6.css}

@@ -1,5 +1,5 @@
-@layer optiaxiom._1fgw1dd;
-@layer optiaxiom._1fgw1dd {
+@layer optiaxiom._13gldnk;
+@layer optiaxiom._13gldnk {
   .ProteusChartTooltipContent__1gsvq810 {
     min-width: 128px;
     position: absolute;

package/dist/esm/assets/src/proteus-document/{ProteusDocumentShell.css.ts.vanilla-CDxANCyw.css → ProteusDocumentShell.css.ts.vanilla-DKjJk3n9.css}

@@ -1,5 +1,5 @@
-@layer optiaxiom._1fgw1dd;
-@layer optiaxiom._1fgw1dd {
+@layer optiaxiom._13gldnk;
+@layer optiaxiom._13gldnk {
   .ProteusDocumentShell__vpuvfj1 {
     margin: -4px;
   }

package/dist/esm/assets/src/proteus-image-carousel/{ProteusImageCarousel.css.ts.vanilla-CVLALefb.css → ProteusImageCarousel.css.ts.vanilla-CVsqKi1-.css}

@@ -1,5 +1,5 @@
-@layer optiaxiom._1fgw1dd;
-@layer optiaxiom._1fgw1dd {
+@layer optiaxiom._13gldnk;
+@layer optiaxiom._13gldnk {
   .ProteusImageCarousel__1t6qej70 {
     outline: none;
     user-select: none;

package/dist/esm/assets/src/proteus-question/{ProteusQuestion.css.ts.vanilla-DKDk8HIF.css → ProteusQuestion.css.ts.vanilla-DAuhHkyp.css}

@@ -1,5 +1,5 @@
-@layer optiaxiom._1fgw1dd;
-@layer optiaxiom._1fgw1dd {
+@layer optiaxiom._13gldnk;
+@layer optiaxiom._13gldnk {
   .ProteusQuestion__8f590p0 {
     outline: none;
   }

package/dist/esm/index.js

@@ -5,6 +5,7 @@ export { ProteusDataTable } from './proteus-data-table/ProteusDataTable.js';
 export { ProteusDocumentRenderer } from './proteus-document/ProteusDocumentRenderer.js';
 export { ProteusDocumentShell } from './proteus-document/ProteusDocumentShell.js';
 export { safeParseDocument } from './proteus-document/schemas.js';
+export { ProteusFederated } from './proteus-federated/ProteusFederated.js';
 export { ProteusFileUpload } from './proteus-file-upload/ProteusFileUpload.js';
 export { ProteusImage } from './proteus-image/ProteusImage.js';
 export { ProteusImageCarousel } from './proteus-image-carousel/ProteusImageCarousel.js';

package/dist/esm/proteus-chart/ProteusChart-css.js

@@ -1,4 +1,4 @@
-import './../assets/src/proteus-chart/ProteusChart.css.ts.vanilla-BO0-TwP_.css';
+import './../assets/src/proteus-chart/ProteusChart.css.ts.vanilla-9aXajeqc.css';
 import { recipe } from '@optiaxiom/react/css-runtime';
 
 var chart = recipe({base:[{border:'1',borderColor:'border.tertiary',fontSize:'sm',p:'16'},'ProteusChart__jmlqij1','ProteusChart__jmlqij0']});

package/dist/esm/proteus-chart/ProteusChartTooltipContent-css.js

@@ -1,4 +1,4 @@
-import './../assets/src/proteus-chart/ProteusChartTooltipContent.css.ts.vanilla-ETMXhILd.css';
+import './../assets/src/proteus-chart/ProteusChartTooltipContent.css.ts.vanilla-BvKLAJt6.css';
 import { recipe } from '@optiaxiom/react/css-runtime';
 
 var tooltip = recipe({base:[{bg:'bg.default',border:'1',borderColor:'border.secondary',display:'grid',fontSize:'sm',gap:'6',pointerEvents:'none',px:'8',py:'10',rounded:'lg',shadow:'lg',transition:'all',z:'popover'},'ProteusChartTooltipContent__1gsvq810']});

package/dist/esm/proteus-document/ProteusDocumentShell-css.js

@@ -1,4 +1,4 @@
-import './../assets/src/proteus-document/ProteusDocumentShell.css.ts.vanilla-CDxANCyw.css';
+import './../assets/src/proteus-document/ProteusDocumentShell.css.ts.vanilla-DKjJk3n9.css';
 import { recipe } from '@optiaxiom/react/css-runtime';
 
 var body = recipe({base:[{flexDirection:'column',gap:'16'},'ProteusDocumentShell__vpuvfj0'],variants:{truncate:{false:{},true:[{maxH:'sm',overflow:'auto',p:'4'},'ProteusDocumentShell__vpuvfj1']}}});

package/dist/esm/proteus-element/ProteusElement.js

@@ -11,6 +11,7 @@ import { useProteusDocumentContext } from '../proteus-document/ProteusDocumentCo
 import { useProteusDocumentPathContext } from '../proteus-document/ProteusDocumentPathContext.js';
 import { resolveProteusProp } from '../proteus-document/resolveProteusProp.js';
 import { safeParseElement } from '../proteus-document/schemas.js';
+import { ProteusFederated } from '../proteus-federated/ProteusFederated.js';
 import { ProteusFileUpload } from '../proteus-file-upload/ProteusFileUpload.js';
 import { ProteusImageCarousel } from '../proteus-image-carousel/ProteusImageCarousel.js';
 import { ProteusImage } from '../proteus-image/ProteusImage.js';
@@ -96,6 +97,13 @@ const ProteusElement = ({
           ...resolve(element)
         }
       );
+    case "Federated":
+      return /* @__PURE__ */ jsx(
+        ProteusFederated,
+        {
+          ...resolve(element)
+        }
+      );
     case "Field":
       return /* @__PURE__ */ jsx(Field, { ...resolve(element) });
     case "FileUpload":

package/dist/esm/proteus-federated/ProteusFederated.js

@@ -0,0 +1,58 @@
+"use client";
+import { jsx, Fragment } from 'react/jsx-runtime';
+import { registerRemotes, loadRemote, getInstance, init } from '@module-federation/enhanced/runtime';
+import { useId, useState, useEffect, Suspense } from 'react';
+import { useProteusDocumentContext } from '../proteus-document/ProteusDocumentContext.js';
+
+function ProteusFederated({
+  entry,
+  exposeKey = ".",
+  fallback
+}) {
+  const { data, onEvent } = useProteusDocumentContext(
+    "@optiaxiom/proteus/ProteusFederated"
+  );
+  const id = useId();
+  const name = `proteus_${id.replace(/[^a-zA-Z0-9]/g, "_")}`;
+  const [Component, setComponent] = useState(null);
+  const [error, setError] = useState(false);
+  useEffect(() => {
+    if (!entry) {
+      setError(true);
+      return;
+    }
+    let cancelled = false;
+    ensureInstance();
+    registerRemotes([{ entry, name, type: "esm" }], { force: false });
+    const modulePath = exposeKey === "." ? "" : exposeKey.replace(/^\.\//, "");
+    const remoteId = modulePath ? `${name}/${modulePath}` : name;
+    loadRemote(remoteId).then((mod) => {
+      if (!cancelled && mod) {
+        setComponent(() => mod.default);
+      } else if (!cancelled) {
+        setError(true);
+      }
+    }).catch(() => {
+      if (!cancelled)
+        setError(true);
+    });
+    return () => {
+      cancelled = true;
+    };
+  }, [entry, exposeKey, name]);
+  if (error) {
+    return fallback ? /* @__PURE__ */ jsx(Fragment, { children: fallback }) : null;
+  }
+  if (!Component) {
+    return null;
+  }
+  return /* @__PURE__ */ jsx(Suspense, { fallback: null, children: /* @__PURE__ */ jsx(Component, { data, onEvent }) });
+}
+function ensureInstance() {
+  if (!getInstance()) {
+    init({ name: "proteus-federated", remotes: [] });
+  }
+}
+ProteusFederated.displayName = "@optiaxiom/proteus/ProteusFederated";
+
+export { ProteusFederated };

package/dist/esm/proteus-image-carousel/ProteusImageCarousel-css.js

@@ -1,4 +1,4 @@
-import './../assets/src/proteus-image-carousel/ProteusImageCarousel.css.ts.vanilla-CVLALefb.css';
+import './../assets/src/proteus-image-carousel/ProteusImageCarousel.css.ts.vanilla-CVsqKi1-.css';
 import { recipe } from '@optiaxiom/react/css-runtime';
 
 var carousel = recipe({base:[{flexDirection:'column',gap:'12'},'ProteusImageCarousel__1t6qej70']});

package/dist/esm/proteus-question/ProteusQuestion-css.js

@@ -1,4 +1,4 @@
-import './../assets/src/proteus-question/ProteusQuestion.css.ts.vanilla-DKDk8HIF.css';
+import './../assets/src/proteus-question/ProteusQuestion.css.ts.vanilla-DAuhHkyp.css';
 import { recipe } from '@optiaxiom/react/css-runtime';
 
 var addon = recipe({base:[{display:'grid',fontWeight:'500',placeItems:'center',rounded:'lg',size:'md',transition:'colors'},'ProteusQuestion__8f590p3'],variants:{cursor:{pointer:{cursor:'pointer'}}}});

package/dist/esm/schema/public-schema.json.js

@@ -2731,6 +2731,9 @@ var definitions = {
 			{
 				$ref: "#/definitions/ProteusDataTable"
 			},
+			{
+				$ref: "#/definitions/ProteusFederated"
+			},
 			{
 				$ref: "#/definitions/ProteusField"
 			},
@@ -4948,6 +4951,38 @@ var definitions = {
 		],
 		type: "object"
 	},
+	ProteusFederated: {
+		additionalProperties: false,
+		examples: [
+			{
+				$type: "Federated",
+				entry: "https://widgets.example.com/remoteEntry.js"
+			}
+		],
+		properties: {
+			$type: {
+				"const": "Federated"
+			},
+			entry: {
+				description: "URL to the remote application's remoteEntry.js or mf-manifest.json",
+				type: "string"
+			},
+			exposeKey: {
+				"default": ".",
+				description: "The key from the remote's ModuleFederationPlugin exposes config (e.g. './App'). Defaults to '.' (root export)",
+				type: "string"
+			},
+			fallback: {
+				$ref: "#/definitions/ProteusNode",
+				description: "Content rendered when the federated component fails to load"
+			}
+		},
+		required: [
+			"$type",
+			"entry"
+		],
+		type: "object"
+	},
 	ProteusField: {
 		additionalProperties: false,
 		examples: [

package/dist/esm/schema/runtime-schema.json.js

@@ -2719,6 +2719,9 @@ var definitions = {
 			{
 				$ref: "#/definitions/ProteusDataTable"
 			},
+			{
+				$ref: "#/definitions/ProteusFederated"
+			},
 			{
 				$ref: "#/definitions/ProteusField"
 			},
@@ -4915,6 +4918,37 @@ var definitions = {
 		],
 		type: "object"
 	},
+	ProteusFederated: {
+		examples: [
+			{
+				$type: "Federated",
+				entry: "https://widgets.example.com/remoteEntry.js"
+			}
+		],
+		properties: {
+			$type: {
+				"const": "Federated"
+			},
+			entry: {
+				description: "URL to the remote application's remoteEntry.js or mf-manifest.json",
+				type: "string"
+			},
+			exposeKey: {
+				"default": ".",
+				description: "The key from the remote's ModuleFederationPlugin exposes config (e.g. './App'). Defaults to '.' (root export)",
+				type: "string"
+			},
+			fallback: {
+				$ref: "#/definitions/ProteusNode",
+				description: "Content rendered when the federated component fails to load"
+			}
+		},
+		required: [
+			"$type",
+			"entry"
+		],
+		type: "object"
+	},
 	ProteusField: {
 		examples: [
 			{

package/dist/index.d.ts

@@ -77,6 +77,25 @@ declare const ProteusDataTable: {
     displayName: string;
 };
 
+type ProteusFederatedProps = {
+    /**
+     * URL to the remote's remoteEntry.js or mf-manifest.json
+     */
+    entry: string;
+    /**
+     * The key from the remote's ModuleFederationPlugin exposes config (e.g. './App'). Defaults to '.' (root export)
+     */
+    exposeKey?: string;
+    /**
+     * Content rendered when the federated component fails to load
+     */
+    fallback?: ReactNode;
+};
+declare function ProteusFederated({ entry, exposeKey, fallback, }: ProteusFederatedProps): react_jsx_runtime.JSX.Element | null;
+declare namespace ProteusFederated {
+    var displayName: string;
+}
+
 type ProteusFileUploadProps = {
     /**
      * File types to accept; array of MIME types or extensions.
@@ -400,5 +419,5 @@ declare namespace ProteusTextarea {
 
 declare function useProteusValue(element: ProteusValueProps): any;
 
-export { ProteusAction, ProteusBridge, ProteusChart, ProteusDataTable, ProteusDocumentRenderer, ProteusDocumentShell, ProteusFileUpload, ProteusImage, ProteusImageCarousel, ProteusInput, ProteusMap, ProteusSelect, ProteusShow, ProteusTextarea, safeParseDocument, useProteusValue };
+export { ProteusAction, ProteusBridge, ProteusChart, ProteusDataTable, ProteusDocumentRenderer, ProteusDocumentShell, ProteusFederated, ProteusFileUpload, ProteusImage, ProteusImageCarousel, ProteusInput, ProteusMap, ProteusSelect, ProteusShow, ProteusTextarea, safeParseDocument, useProteusValue };
 export type { ProteusDocumentRendererProps, ProteusDocumentShellProps, ProteusFileUploadProps, StructuredMessage, UploadFile };