@optiaxiom/proteus 0.1.23 → 0.1.25

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 (21) hide show
  1. package/dist/esm/_virtual/_openai-shim-script.js +81 -0
  2. package/dist/esm/assets/src/proteus-chart/{ProteusChart.css.ts.vanilla-BCN2MOqI.css → ProteusChart.css.ts.vanilla-B-FJ2e1F.css} +2 -2
  3. package/dist/esm/assets/src/proteus-chart/{ProteusChartTooltipContent.css.ts.vanilla-DmqHa3bY.css → ProteusChartTooltipContent.css.ts.vanilla-B7GlVdiy.css} +2 -2
  4. package/dist/esm/assets/src/proteus-document/ProteusDocumentShell.css.ts.vanilla-GbLC1fdW.css +17 -0
  5. package/dist/esm/assets/src/proteus-image-carousel/{ProteusImageCarousel.css.ts.vanilla-Bbo2TbLv.css → ProteusImageCarousel.css.ts.vanilla-B21Y_xyv.css} +2 -2
  6. package/dist/esm/assets/src/proteus-question/{ProteusQuestion.css.ts.vanilla-DRvLrb5J.css → ProteusQuestion.css.ts.vanilla--FkursVc.css} +2 -2
  7. package/dist/esm/index.js +1 -0
  8. package/dist/esm/proteus-bridge/ProteusBridge.js +90 -0
  9. package/dist/esm/proteus-chart/ProteusChart-css.js +1 -1
  10. package/dist/esm/proteus-chart/ProteusChartTooltipContent-css.js +1 -1
  11. package/dist/esm/proteus-document/ProteusDocumentShell-css.js +7 -0
  12. package/dist/esm/proteus-document/ProteusDocumentShell.js +38 -3
  13. package/dist/esm/proteus-element/ProteusElement.js +8 -0
  14. package/dist/esm/proteus-image-carousel/ProteusImageCarousel-css.js +1 -1
  15. package/dist/esm/proteus-question/ProteusQuestion-css.js +1 -1
  16. package/dist/esm/proteus-question/ProteusQuestion.js +5 -5
  17. package/dist/esm/schema/public-schema.json.js +45 -0
  18. package/dist/esm/schema/runtime-schema.json.js +44 -0
  19. package/dist/index.d.ts +37 -3
  20. package/dist/spec.d.ts +2941 -2887
  21. package/package.json +5 -3
@@ -1,5 +1,5 @@
1
- @layer optiaxiom.tmkl1w;
2
- @layer optiaxiom.tmkl1w {
1
+ @layer optiaxiom._1fktkd1;
2
+ @layer optiaxiom._1fktkd1 {
3
3
  .ProteusChart__jmlqij1 {
4
4
  border-radius: 16px;
5
5
  }
@@ -1,5 +1,5 @@
1
- @layer optiaxiom.tmkl1w;
2
- @layer optiaxiom.tmkl1w {
1
+ @layer optiaxiom._1fktkd1;
2
+ @layer optiaxiom._1fktkd1 {
3
3
  .ProteusChartTooltipContent__1gsvq810 {
4
4
  min-width: 128px;
5
5
  }
@@ -0,0 +1,17 @@
1
+ @layer optiaxiom._1fktkd1;
2
+ @layer optiaxiom._1fktkd1 {
3
+ .ProteusDocumentShell__vpuvfj1 {
4
+ margin: -4px;
5
+ }
6
+ .ProteusDocumentShell__vpuvfj2 {
7
+ align-self: center;
8
+ bottom: 8px;
9
+ margin-top: -56px;
10
+ opacity: 0;
11
+ position: sticky;
12
+ z-index: 10;
13
+ }
14
+ .ProteusDocumentShell__vpuvfj0[data-can-scroll] .ProteusDocumentShell__vpuvfj2 {
15
+ opacity: 1;
16
+ }
17
+ }
@@ -1,5 +1,5 @@
1
- @layer optiaxiom.tmkl1w;
2
- @layer optiaxiom.tmkl1w {
1
+ @layer optiaxiom._1fktkd1;
2
+ @layer optiaxiom._1fktkd1 {
3
3
  .ProteusImageCarousel__1t6qej70 {
4
4
  outline: none;
5
5
  user-select: none;
@@ -1,5 +1,5 @@
1
- @layer optiaxiom.tmkl1w;
2
- @layer optiaxiom.tmkl1w {
1
+ @layer optiaxiom._1fktkd1;
2
+ @layer optiaxiom._1fktkd1 {
3
3
  .ProteusQuestion__8f590p0 {
4
4
  outline: none;
5
5
  }
package/dist/esm/index.js CHANGED
@@ -1,4 +1,5 @@
1
1
  export { ProteusAction } from './proteus-action/ProteusAction.js';
2
+ export { ProteusBridge } from './proteus-bridge/ProteusBridge.js';
2
3
  export { ProteusChart } from './proteus-chart/ProteusChart.js';
3
4
  export { ProteusDataTable } from './proteus-data-table/ProteusDataTable.js';
4
5
  export { ProteusDocumentRenderer } from './proteus-document/ProteusDocumentRenderer.js';
@@ -0,0 +1,90 @@
1
+ "use client";
2
+ import { jsx } from 'react/jsx-runtime';
3
+ import { AppBridge, PostMessageTransport } from '@modelcontextprotocol/ext-apps/app-bridge';
4
+ import { useState, useRef, useEffect } from 'react';
5
+ import { OPENAI_SHIM_SCRIPT } from '../_virtual/_openai-shim-script.js';
6
+ import { useProteusDocumentContext } from '../proteus-document/ProteusDocumentContext.js';
7
+
8
+ function ProteusBridge({ height = 400, resource }) {
9
+ const { data, onEvent, useResource } = useProteusDocumentContext(
10
+ "@optiaxiom/proteus/ProteusBridge"
11
+ );
12
+ const result = useResource?.(resource);
13
+ const html = result?.data?.text ?? "";
14
+ const mimeType = result?.data?.mimeType;
15
+ const [iframe, setIframe] = useState(null);
16
+ const dataRef = useRef(data);
17
+ dataRef.current = data;
18
+ useEffect(() => {
19
+ if (!iframe?.contentWindow) {
20
+ return;
21
+ }
22
+ const bridge = new AppBridge(
23
+ null,
24
+ { name: "Opal", version: "1.0.0" },
25
+ { logging: {}, openLinks: {}, serverTools: {} },
26
+ {
27
+ hostContext: {
28
+ containerDimensions: { maxHeight: iframe.clientHeight },
29
+ displayMode: "inline"
30
+ }
31
+ }
32
+ );
33
+ bridge.oncalltool = async (params) => {
34
+ const result2 = await onEvent({
35
+ interaction: params.name,
36
+ params: params.arguments ?? {}
37
+ });
38
+ return {
39
+ content: [
40
+ { text: JSON.stringify(result2 ?? ""), type: "text" }
41
+ ]
42
+ };
43
+ };
44
+ bridge.onmessage = async (params) => {
45
+ const message = params.content?.filter((content) => content.type === "text").map((content) => content.text).join("\n\n") ?? "";
46
+ await onEvent({ message });
47
+ return {};
48
+ };
49
+ bridge.onopenlink = async ({ url }) => {
50
+ window.open(url, "_blank", "noopener");
51
+ return {};
52
+ };
53
+ bridge.addEventListener("sizechange", ({ height: height2 }) => {
54
+ if (height2 != null) {
55
+ iframe.style.height = `${height2}px`;
56
+ }
57
+ });
58
+ bridge.addEventListener("initialized", () => {
59
+ void bridge.sendToolResult({
60
+ content: [
61
+ {
62
+ text: JSON.stringify(dataRef.current),
63
+ type: "text"
64
+ }
65
+ ]
66
+ });
67
+ });
68
+ const transport = new PostMessageTransport(
69
+ iframe.contentWindow,
70
+ iframe.contentWindow
71
+ );
72
+ void bridge.connect(transport);
73
+ return () => {
74
+ void bridge.close();
75
+ };
76
+ }, [iframe, onEvent]);
77
+ return result?.isError || !html ? null : /* @__PURE__ */ jsx(
78
+ "iframe",
79
+ {
80
+ ref: setIframe,
81
+ sandbox: "allow-scripts allow-popups allow-popups-to-escape-sandbox allow-forms",
82
+ srcDoc: mimeType === "text/html;profile=openai-app" ? OPENAI_SHIM_SCRIPT + html : html,
83
+ style: { border: "none", height, width: "100%" },
84
+ title: "Opal Widget"
85
+ }
86
+ );
87
+ }
88
+ ProteusBridge.displayName = "@optiaxiom/proteus/ProteusBridge";
89
+
90
+ export { ProteusBridge };
@@ -1,4 +1,4 @@
1
- import './../assets/src/proteus-chart/ProteusChart.css.ts.vanilla-BCN2MOqI.css';
1
+ import './../assets/src/proteus-chart/ProteusChart.css.ts.vanilla-B-FJ2e1F.css';
2
2
  import { recipe } from '@optiaxiom/react/css-runtime';
3
3
 
4
4
  var chart = recipe({base:[{border:'1',borderColor:'border.tertiary',fontSize:'sm',p:'16'},'ProteusChart__jmlqij1','ProteusChart__jmlqij0']});
@@ -1,4 +1,4 @@
1
- import './../assets/src/proteus-chart/ProteusChartTooltipContent.css.ts.vanilla-DmqHa3bY.css';
1
+ import './../assets/src/proteus-chart/ProteusChartTooltipContent.css.ts.vanilla-B7GlVdiy.css';
2
2
  import { recipe } from '@optiaxiom/react/css-runtime';
3
3
 
4
4
  var tooltip = recipe({base:[{bg:'bg.default',border:'1',borderColor:'border.secondary',display:'grid',fontSize:'sm',gap:'6',px:'8',py:'10',rounded:'lg',shadow:'lg'},'ProteusChartTooltipContent__1gsvq810']});
@@ -0,0 +1,7 @@
1
+ import './../assets/src/proteus-document/ProteusDocumentShell.css.ts.vanilla-GbLC1fdW.css';
2
+ import { recipe } from '@optiaxiom/react/css-runtime';
3
+
4
+ var body = recipe({base:[{flexDirection:'column',gap:'16'},'ProteusDocumentShell__vpuvfj0'],variants:{truncate:{false:{},true:[{maxH:'sm',overflow:'auto',p:'4'},'ProteusDocumentShell__vpuvfj1']}}});
5
+ var scrollIndicator = recipe({base:[{bg:'bg.secondary',border:'1',borderColor:'border.secondary',color:'fg.secondary',display:'grid',flex:'none',placeItems:'center',pointerEvents:'none',rounded:'full',shadow:'sm',size:'lg',transition:'opacity'},'ProteusDocumentShell__vpuvfj2']});
6
+
7
+ export { body, scrollIndicator };
@@ -1,5 +1,6 @@
1
1
  "use client";
2
2
  import { jsx, jsxs } from 'react/jsx-runtime';
3
+ import { IconArrowDown } from '@optiaxiom/icons';
3
4
  import { Disclosure, DisclosureTrigger, Box, Group, Text, DisclosureContent, Heading, Tooltip } from '@optiaxiom/react';
4
5
  import { useControllableState } from '@radix-ui/react-use-controllable-state';
5
6
  import { set } from 'jsonpointer';
@@ -7,6 +8,7 @@ import { useState, useRef, useEffect } from 'react';
7
8
  import { useEffectEvent } from '../hooks/useEffectEvent.js';
8
9
  import { downloadFile } from '../proteus-image/downloadFile.js';
9
10
  import { ProteusDocumentProvider } from './ProteusDocumentContext.js';
11
+ import { scrollIndicator, body } from './ProteusDocumentShell-css.js';
10
12
 
11
13
  function ProteusDocumentShell({
12
14
  collapsible: collapsibleProp,
@@ -20,7 +22,8 @@ function ProteusDocumentShell({
20
22
  onOpenChange,
21
23
  open: openProp,
22
24
  readOnly = false,
23
- strict
25
+ strict,
26
+ useResource
24
27
  }) {
25
28
  const [valid, setValid] = useState(false);
26
29
  const formRef = useRef(null);
@@ -34,6 +37,26 @@ function ProteusDocumentShell({
34
37
  onChange: onOpenChange,
35
38
  prop: openProp
36
39
  });
40
+ const bodyRef = useRef(null);
41
+ useEffect(() => {
42
+ const node = bodyRef.current;
43
+ if (!node)
44
+ return;
45
+ const update = () => {
46
+ if (node.scrollHeight - node.scrollTop - node.clientHeight > 1) {
47
+ node.dataset.canScroll = "";
48
+ } else {
49
+ delete node.dataset.canScroll;
50
+ }
51
+ };
52
+ const observer = new ResizeObserver(update);
53
+ observer.observe(node);
54
+ node.addEventListener("scroll", update, { passive: true });
55
+ return () => {
56
+ observer.disconnect();
57
+ node.removeEventListener("scroll", update);
58
+ };
59
+ }, []);
37
60
  const collapsible = collapsibleProp && element.appName;
38
61
  const Trigger = collapsible ? DisclosureTrigger : Box;
39
62
  return /* @__PURE__ */ jsx(
@@ -47,7 +70,7 @@ function ProteusDocumentShell({
47
70
  }),
48
71
  onEvent: useEffectEvent(async (event) => {
49
72
  if ("interaction" in event) {
50
- await onInteraction?.(event.interaction);
73
+ return await onInteraction?.(event.interaction, event.params);
51
74
  } else if ("message" in event) {
52
75
  await onMessage?.(event.message);
53
76
  } else if (event.action === "download") {
@@ -70,9 +93,11 @@ function ProteusDocumentShell({
70
93
  await Promise.all(urls.map((u) => downloadFile(u)));
71
94
  }
72
95
  }
96
+ return;
73
97
  }),
74
98
  readOnly,
75
99
  strict,
100
+ useResource,
76
101
  valid,
77
102
  children: /* @__PURE__ */ jsxs(
78
103
  Disclosure,
@@ -151,7 +176,17 @@ function ProteusDocumentShell({
151
176
  },
152
177
  ref: formRef,
153
178
  children: [
154
- element.body,
179
+ /* @__PURE__ */ jsxs(
180
+ Group,
181
+ {
182
+ ref: element.compact ? bodyRef : void 0,
183
+ ...body({ truncate: element.compact }),
184
+ children: [
185
+ element.body,
186
+ element.compact && /* @__PURE__ */ jsx(Box, { ...scrollIndicator(), children: /* @__PURE__ */ jsx(IconArrowDown, {}) })
187
+ ]
188
+ }
189
+ ),
155
190
  element.actions && !readOnly && /* @__PURE__ */ jsx(Group, { gap: "16", justifyContent: "end", w: "full", children: element.actions })
156
191
  ]
157
192
  }
@@ -5,6 +5,7 @@ import { Time, Range } from '@optiaxiom/react/unstable';
5
5
  import { lazy, Suspense } from 'react';
6
6
  import { IconCalendar } from '../icons/IconCalendar.js';
7
7
  import { ProteusAction } from '../proteus-action/ProteusAction.js';
8
+ import { ProteusBridge } from '../proteus-bridge/ProteusBridge.js';
8
9
  import { ProteusDataTable } from '../proteus-data-table/ProteusDataTable.js';
9
10
  import { useProteusDocumentContext } from '../proteus-document/ProteusDocumentContext.js';
10
11
  import { useProteusDocumentPathContext } from '../proteus-document/ProteusDocumentPathContext.js';
@@ -65,6 +66,13 @@ const ProteusElement = ({
65
66
  return /* @__PURE__ */ jsx(Avatar, { ...resolve(element) });
66
67
  case "Badge":
67
68
  return /* @__PURE__ */ jsx(Badge, { ...resolve(element) });
69
+ case "Bridge":
70
+ return /* @__PURE__ */ jsx(
71
+ ProteusBridge,
72
+ {
73
+ ...resolve(element)
74
+ }
75
+ );
68
76
  case "Button":
69
77
  return /* @__PURE__ */ jsx(ProteusAction, { ...resolve(element) });
70
78
  case "Card":
@@ -1,4 +1,4 @@
1
- import './../assets/src/proteus-image-carousel/ProteusImageCarousel.css.ts.vanilla-Bbo2TbLv.css';
1
+ import './../assets/src/proteus-image-carousel/ProteusImageCarousel.css.ts.vanilla-B21Y_xyv.css';
2
2
  import { recipe } from '@optiaxiom/react/css-runtime';
3
3
 
4
4
  var carousel = recipe({base:[{flexDirection:'column',gap:'12'},'ProteusImageCarousel__1t6qej70']});
@@ -1,4 +1,4 @@
1
- import './../assets/src/proteus-question/ProteusQuestion.css.ts.vanilla-DRvLrb5J.css';
1
+ import './../assets/src/proteus-question/ProteusQuestion.css.ts.vanilla--FkursVc.css';
2
2
  import { recipe } from '@optiaxiom/react/css-runtime';
3
3
 
4
4
  var addon = recipe({base:[{display:'grid',fontWeight:'500',placeItems:'center',rounded:'lg',size:'md',transition:'colors'},'ProteusQuestion__8f590p3'],variants:{cursor:{pointer:{cursor:'pointer'}}}});
@@ -1,6 +1,6 @@
1
1
  "use client";
2
2
  import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
3
- import { IconArrowRightAlt, IconEdit } from '@optiaxiom/icons';
3
+ import { IconArrowRight, IconPen } from '@optiaxiom/icons';
4
4
  import { Group, Text, Button, Box, Checkbox } from '@optiaxiom/react';
5
5
  import { InlineInput } from '@optiaxiom/react/unstable';
6
6
  import * as RovingFocus from '@radix-ui/react-roving-focus';
@@ -226,7 +226,7 @@ A: ${value2 || "[Not specified]"}`
226
226
  h: "24",
227
227
  ml: "auto",
228
228
  w: "24",
229
- children: /* @__PURE__ */ jsx(IconArrowRightAlt, {})
229
+ children: /* @__PURE__ */ jsx(IconArrowRight, {})
230
230
  }
231
231
  )
232
232
  ] })
@@ -241,7 +241,7 @@ A: ${value2 || "[Not specified]"}`
241
241
  role: "group",
242
242
  ...choice({ cursor: "text" }),
243
243
  children: /* @__PURE__ */ jsxs(Group, { gap: "12", children: [
244
- type === "single_select" ? /* @__PURE__ */ jsx(Box, { ...addon({ cursor: "pointer" }), children: /* @__PURE__ */ jsx(IconEdit, {}) }) : /* @__PURE__ */ jsx(
244
+ type === "single_select" ? /* @__PURE__ */ jsx(Box, { ...addon({ cursor: "pointer" }), children: /* @__PURE__ */ jsx(IconPen, {}) }) : /* @__PURE__ */ jsx(
245
245
  Checkbox,
246
246
  {
247
247
  checked: otherChecked,
@@ -303,7 +303,7 @@ A: ${value2 || "[Not specified]"}`
303
303
  {
304
304
  appearance: otherValue ? "primary-opal" : "default",
305
305
  "aria-label": otherValue && (isLast ? "Submit" : "Next"),
306
- icon: otherValue && /* @__PURE__ */ jsx(IconArrowRightAlt, {}),
306
+ icon: otherValue && /* @__PURE__ */ jsx(IconArrowRight, {}),
307
307
  ml: "auto",
308
308
  onClick: (event) => {
309
309
  event.preventDefault();
@@ -354,7 +354,7 @@ A: ${value2 || "[Not specified]"}`
354
354
  appearance: valid ? "primary-opal" : "default",
355
355
  "aria-label": isLast ? "Submit" : "Next",
356
356
  disabled: !valid,
357
- icon: /* @__PURE__ */ jsx(IconArrowRightAlt, {}),
357
+ icon: /* @__PURE__ */ jsx(IconArrowRight, {}),
358
358
  onClick: (event) => {
359
359
  event.preventDefault();
360
360
  onSubmit();
@@ -2673,6 +2673,10 @@ var definitions = {
2673
2673
  $ref: "#/definitions/ProteusNode",
2674
2674
  description: "The main content of the document."
2675
2675
  },
2676
+ compact: {
2677
+ description: "If true, constrains the body to a max height and makes it scrollable when content overflows.",
2678
+ type: "boolean"
2679
+ },
2676
2680
  subtitle: {
2677
2681
  $ref: "#/definitions/ProteusNode",
2678
2682
  description: "A brief description or tagline that provides additional context about the Proteus document's purpose."
@@ -2703,6 +2707,9 @@ var definitions = {
2703
2707
  {
2704
2708
  $ref: "#/definitions/ProteusBadge"
2705
2709
  },
2710
+ {
2711
+ $ref: "#/definitions/ProteusBridge"
2712
+ },
2706
2713
  {
2707
2714
  $ref: "#/definitions/ProteusButton"
2708
2715
  },
@@ -2802,6 +2809,12 @@ var definitions = {
2802
2809
  interaction: {
2803
2810
  description: "Name of registered interaction to call",
2804
2811
  type: "string"
2812
+ },
2813
+ params: {
2814
+ additionalProperties: {
2815
+ },
2816
+ description: "Parameters to pass to the interaction handler",
2817
+ type: "object"
2805
2818
  }
2806
2819
  },
2807
2820
  required: [
@@ -3703,6 +3716,38 @@ var definitions = {
3703
3716
  ],
3704
3717
  type: "object"
3705
3718
  },
3719
+ ProteusBridge: {
3720
+ additionalProperties: false,
3721
+ examples: [
3722
+ {
3723
+ $type: "Bridge",
3724
+ height: 400,
3725
+ resource: "ui://sample-widget"
3726
+ }
3727
+ ],
3728
+ properties: {
3729
+ $type: {
3730
+ "const": "Bridge"
3731
+ },
3732
+ fallback: {
3733
+ $ref: "#/definitions/ProteusNode",
3734
+ description: "Content rendered on platforms without iframe support (Teams, Slack, mobile). If omitted, a default 'View in Opal web' message is shown."
3735
+ },
3736
+ height: {
3737
+ description: "Height of the iframe in pixels",
3738
+ type: "number"
3739
+ },
3740
+ resource: {
3741
+ description: "Resource URI identifying the MCP app to render (e.g., 'ui://sample-widget')",
3742
+ type: "string"
3743
+ }
3744
+ },
3745
+ required: [
3746
+ "$type",
3747
+ "resource"
3748
+ ],
3749
+ type: "object"
3750
+ },
3706
3751
  ProteusButton: {
3707
3752
  additionalProperties: false,
3708
3753
  examples: [
@@ -2661,6 +2661,10 @@ var definitions = {
2661
2661
  $ref: "#/definitions/ProteusNode",
2662
2662
  description: "The main content of the document."
2663
2663
  },
2664
+ compact: {
2665
+ description: "If true, constrains the body to a max height and makes it scrollable when content overflows.",
2666
+ type: "boolean"
2667
+ },
2664
2668
  subtitle: {
2665
2669
  $ref: "#/definitions/ProteusNode",
2666
2670
  description: "A brief description or tagline that provides additional context about the Proteus document's purpose."
@@ -2691,6 +2695,9 @@ var definitions = {
2691
2695
  {
2692
2696
  $ref: "#/definitions/ProteusBadge"
2693
2697
  },
2698
+ {
2699
+ $ref: "#/definitions/ProteusBridge"
2700
+ },
2694
2701
  {
2695
2702
  $ref: "#/definitions/ProteusButton"
2696
2703
  },
@@ -2789,6 +2796,12 @@ var definitions = {
2789
2796
  interaction: {
2790
2797
  description: "Name of registered interaction to call",
2791
2798
  type: "string"
2799
+ },
2800
+ params: {
2801
+ additionalProperties: {
2802
+ },
2803
+ description: "Parameters to pass to the interaction handler",
2804
+ type: "object"
2792
2805
  }
2793
2806
  },
2794
2807
  required: [
@@ -3683,6 +3696,37 @@ var definitions = {
3683
3696
  ],
3684
3697
  type: "object"
3685
3698
  },
3699
+ ProteusBridge: {
3700
+ examples: [
3701
+ {
3702
+ $type: "Bridge",
3703
+ height: 400,
3704
+ resource: "ui://sample-widget"
3705
+ }
3706
+ ],
3707
+ properties: {
3708
+ $type: {
3709
+ "const": "Bridge"
3710
+ },
3711
+ fallback: {
3712
+ $ref: "#/definitions/ProteusNode",
3713
+ description: "Content rendered on platforms without iframe support (Teams, Slack, mobile). If omitted, a default 'View in Opal web' message is shown."
3714
+ },
3715
+ height: {
3716
+ description: "Height of the iframe in pixels",
3717
+ type: "number"
3718
+ },
3719
+ resource: {
3720
+ description: "Resource URI identifying the MCP app to render (e.g., 'ui://sample-widget')",
3721
+ type: "string"
3722
+ }
3723
+ },
3724
+ required: [
3725
+ "$type",
3726
+ "resource"
3727
+ ],
3728
+ type: "object"
3729
+ },
3686
3730
  ProteusButton: {
3687
3731
  examples: [
3688
3732
  {
package/dist/index.d.ts CHANGED
@@ -2,6 +2,25 @@ import * as react_jsx_runtime from 'react/jsx-runtime';
2
2
  import { BoxProps, SelectProps, Disclosure, ButtonProps, InputProps, TextareaProps } from '@optiaxiom/react';
3
3
  import { ReactNode, ComponentPropsWithoutRef } from 'react';
4
4
 
5
+ type ProteusBridgeProps = {
6
+ /**
7
+ * Content rendered on platforms without iframe support
8
+ */
9
+ fallback?: ReactNode;
10
+ /**
11
+ * Height of the iframe in pixels
12
+ */
13
+ height?: number;
14
+ /**
15
+ * Resource URI identifying the MCP app to render
16
+ */
17
+ resource: string;
18
+ };
19
+ declare function ProteusBridge({ height, resource }: ProteusBridgeProps): react_jsx_runtime.JSX.Element | null;
20
+ declare namespace ProteusBridge {
21
+ var displayName: string;
22
+ }
23
+
5
24
  type Series = {
6
25
  dataKey: string;
7
26
  name?: string;
@@ -194,6 +213,14 @@ type ProteusValueProps = {
194
213
  path: string;
195
214
  };
196
215
 
216
+ type UseResource = (resource: string) => {
217
+ data: undefined | {
218
+ mimeType: string;
219
+ text: string;
220
+ };
221
+ isError: boolean;
222
+ };
223
+
197
224
  type ProteusDocumentShellProps = Pick<ComponentPropsWithoutRef<typeof Disclosure>, "defaultOpen" | "onOpenChange" | "open"> & {
198
225
  /**
199
226
  * Whether block is collapsible
@@ -220,7 +247,7 @@ type ProteusDocumentShellProps = Pick<ComponentPropsWithoutRef<typeof Disclosure
220
247
  /**
221
248
  * Callback when user clicks a Action button with interaction handler
222
249
  */
223
- onInteraction?: (name: string) => Promise<void> | void;
250
+ onInteraction?: (name: string, params?: Record<string, unknown>) => Promise<unknown> | unknown;
224
251
  /**
225
252
  * Callback when user sends a message action
226
253
  */
@@ -233,6 +260,10 @@ type ProteusDocumentShellProps = Pick<ComponentPropsWithoutRef<typeof Disclosure
233
260
  * If true, the renderer will throw an error if the provided document is invalid. Otherwise, it will fail silently and render nothing.
234
261
  */
235
262
  strict?: boolean;
263
+ /**
264
+ * Hook to resolve a resource URI to HTML content for Bridge elements
265
+ */
266
+ useResource?: UseResource;
236
267
  };
237
268
  type ProteusDocument$2 = {
238
269
  actions?: ReactNode;
@@ -240,11 +271,12 @@ type ProteusDocument$2 = {
240
271
  appName?: string;
241
272
  blocking?: boolean;
242
273
  body: ReactNode;
274
+ compact?: boolean;
243
275
  subtitle?: ReactNode;
244
276
  title?: ReactNode;
245
277
  titleIcon?: string;
246
278
  };
247
- declare function ProteusDocumentShell({ collapsible: collapsibleProp, data, defaultOpen, element, onDataChange, onDownload, onInteraction, onMessage, onOpenChange, open: openProp, readOnly, strict, }: ProteusDocumentShellProps): react_jsx_runtime.JSX.Element;
279
+ declare function ProteusDocumentShell({ collapsible: collapsibleProp, data, defaultOpen, element, onDataChange, onDownload, onInteraction, onMessage, onOpenChange, open: openProp, readOnly, strict, useResource, }: ProteusDocumentShellProps): react_jsx_runtime.JSX.Element;
248
280
  declare namespace ProteusDocumentShell {
249
281
  var displayName: string;
250
282
  }
@@ -256,6 +288,7 @@ type ProteusEventHandler = {
256
288
  }) | string | string[];
257
289
  } | {
258
290
  interaction: string;
291
+ params?: Record<string, unknown>;
259
292
  } | {
260
293
  message: string;
261
294
  };
@@ -299,6 +332,7 @@ type ProteusDocument = {
299
332
  appName?: string;
300
333
  blocking?: boolean;
301
334
  body: unknown;
335
+ compact?: boolean;
302
336
  subtitle?: unknown;
303
337
  title?: unknown;
304
338
  titleIcon?: string;
@@ -320,5 +354,5 @@ declare namespace ProteusTextarea {
320
354
 
321
355
  declare function useProteusValue(element: ProteusValueProps): any;
322
356
 
323
- export { ProteusAction, ProteusChart, ProteusDataTable, ProteusDocumentRenderer, ProteusDocumentShell, ProteusImage, ProteusImageCarousel, ProteusInput, ProteusMap, ProteusSelect, ProteusShow, ProteusTextarea, safeParseDocument, useProteusValue };
357
+ export { ProteusAction, ProteusBridge, ProteusChart, ProteusDataTable, ProteusDocumentRenderer, ProteusDocumentShell, ProteusImage, ProteusImageCarousel, ProteusInput, ProteusMap, ProteusSelect, ProteusShow, ProteusTextarea, safeParseDocument, useProteusValue };
324
358
  export type { ProteusDocumentRendererProps, ProteusDocumentShellProps };