@frontmcp/ui 0.12.2 → 1.0.0-beta.1

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 (310) hide show
  1. package/README.md +279 -72
  2. package/bridge/adapters/claude.adapter.d.ts.map +1 -1
  3. package/bridge/adapters/gemini.adapter.d.ts.map +1 -1
  4. package/bridge/index.js +2 -36
  5. package/components/Alert/Alert.d.ts +11 -0
  6. package/components/Alert/Alert.d.ts.map +1 -0
  7. package/components/Alert/index.d.ts +4 -0
  8. package/components/Alert/index.d.ts.map +1 -0
  9. package/components/Alert/index.js +61 -0
  10. package/components/Avatar/Avatar.d.ts +10 -0
  11. package/components/Avatar/Avatar.d.ts.map +1 -0
  12. package/components/Avatar/index.d.ts +4 -0
  13. package/components/Avatar/index.d.ts.map +1 -0
  14. package/components/Avatar/index.js +43 -0
  15. package/components/Badge/Badge.d.ts +13 -0
  16. package/components/Badge/Badge.d.ts.map +1 -0
  17. package/components/Badge/index.d.ts +4 -0
  18. package/components/Badge/index.d.ts.map +1 -0
  19. package/{render → components/Badge}/index.js +54 -42
  20. package/components/Button/Button.d.ts +16 -0
  21. package/components/Button/Button.d.ts.map +1 -0
  22. package/components/Button/index.d.ts +4 -0
  23. package/components/Button/index.d.ts.map +1 -0
  24. package/components/Button/index.js +91 -0
  25. package/components/Card/Card.d.ts +25 -0
  26. package/components/Card/Card.d.ts.map +1 -0
  27. package/components/Card/index.d.ts +4 -0
  28. package/components/Card/index.d.ts.map +1 -0
  29. package/components/Card/index.js +110 -0
  30. package/components/List/List.d.ts +15 -0
  31. package/components/List/List.d.ts.map +1 -0
  32. package/components/List/index.d.ts +4 -0
  33. package/components/List/index.d.ts.map +1 -0
  34. package/components/List/index.js +58 -0
  35. package/components/Loader/Loader.d.ts +28 -0
  36. package/components/Loader/Loader.d.ts.map +1 -0
  37. package/components/Loader/LoaderContext.d.ts +20 -0
  38. package/components/Loader/LoaderContext.d.ts.map +1 -0
  39. package/components/Loader/index.d.ts +6 -0
  40. package/components/Loader/index.d.ts.map +1 -0
  41. package/components/Loader/index.js +174 -0
  42. package/components/Modal/Modal.d.ts +22 -0
  43. package/components/Modal/Modal.d.ts.map +1 -0
  44. package/components/Modal/index.d.ts +4 -0
  45. package/components/Modal/index.d.ts.map +1 -0
  46. package/components/Modal/index.js +80 -0
  47. package/components/Select/Select.d.ts +21 -0
  48. package/components/Select/Select.d.ts.map +1 -0
  49. package/components/Select/index.d.ts +4 -0
  50. package/components/Select/index.d.ts.map +1 -0
  51. package/components/Select/index.js +78 -0
  52. package/components/Table/Table.d.ts +15 -0
  53. package/components/Table/Table.d.ts.map +1 -0
  54. package/components/Table/index.d.ts +4 -0
  55. package/components/Table/index.d.ts.map +1 -0
  56. package/components/Table/index.js +70 -0
  57. package/components/TextField/TextField.d.ts +19 -0
  58. package/components/TextField/TextField.d.ts.map +1 -0
  59. package/components/TextField/index.d.ts +4 -0
  60. package/components/TextField/index.d.ts.map +1 -0
  61. package/components/TextField/index.js +77 -0
  62. package/components/index.d.ts +22 -28
  63. package/components/index.d.ts.map +1 -1
  64. package/components/index.js +523 -2521
  65. package/esm/bridge/index.mjs +2 -6
  66. package/esm/components/Alert/index.mjs +28 -0
  67. package/esm/components/Avatar/index.mjs +10 -0
  68. package/esm/components/Badge/index.mjs +56 -0
  69. package/esm/components/Button/index.mjs +58 -0
  70. package/esm/components/Card/index.mjs +77 -0
  71. package/esm/components/List/index.mjs +25 -0
  72. package/esm/components/Loader/index.mjs +141 -0
  73. package/esm/components/Modal/index.mjs +47 -0
  74. package/esm/components/Select/index.mjs +45 -0
  75. package/esm/components/Table/index.mjs +37 -0
  76. package/esm/components/TextField/index.mjs +44 -0
  77. package/esm/components/index.mjs +513 -2415
  78. package/esm/index.mjs +62 -4652
  79. package/esm/package.json +372 -16
  80. package/esm/react/index.mjs +2 -285
  81. package/esm/renderer/charts/index.mjs +336 -0
  82. package/esm/renderer/common/index.mjs +135 -0
  83. package/esm/renderer/csv/index.mjs +193 -0
  84. package/esm/renderer/flow/index.mjs +259 -0
  85. package/esm/renderer/html/index.mjs +99 -0
  86. package/esm/renderer/image/index.mjs +125 -0
  87. package/esm/renderer/index.mjs +2173 -0
  88. package/esm/renderer/maps/index.mjs +217 -0
  89. package/esm/renderer/math/index.mjs +229 -0
  90. package/esm/renderer/mdx/index.mjs +261 -0
  91. package/esm/renderer/media/index.mjs +235 -0
  92. package/esm/renderer/mermaid/index.mjs +220 -0
  93. package/esm/renderer/pdf/index.mjs +229 -0
  94. package/esm/renderer/react/index.mjs +230 -0
  95. package/esm/runtime/index.mjs +194 -0
  96. package/esm/theme/index.mjs +93 -0
  97. package/index.d.ts +10 -18
  98. package/index.d.ts.map +1 -1
  99. package/index.js +63 -4806
  100. package/package.json +372 -16
  101. package/react/index.d.ts +8 -54
  102. package/react/index.d.ts.map +1 -1
  103. package/react/index.js +2 -295
  104. package/renderer/auto-detect.d.ts +39 -0
  105. package/renderer/auto-detect.d.ts.map +1 -0
  106. package/renderer/charts/index.d.ts +22 -0
  107. package/renderer/charts/index.d.ts.map +1 -0
  108. package/renderer/charts/index.js +367 -0
  109. package/renderer/common/index.d.ts +5 -0
  110. package/renderer/common/index.d.ts.map +1 -0
  111. package/renderer/common/index.js +158 -0
  112. package/renderer/common/inject-stylesheet.d.ts +9 -0
  113. package/renderer/common/inject-stylesheet.d.ts.map +1 -0
  114. package/renderer/common/lazy-import.d.ts +85 -0
  115. package/renderer/common/lazy-import.d.ts.map +1 -0
  116. package/renderer/common/use-lazy-module.d.ts +13 -0
  117. package/renderer/common/use-lazy-module.d.ts.map +1 -0
  118. package/renderer/common/use-renderer-theme.d.ts +35 -0
  119. package/renderer/common/use-renderer-theme.d.ts.map +1 -0
  120. package/renderer/csv/index.d.ts +12 -0
  121. package/renderer/csv/index.d.ts.map +1 -0
  122. package/renderer/csv/index.js +224 -0
  123. package/renderer/flow/index.d.ts +40 -0
  124. package/renderer/flow/index.d.ts.map +1 -0
  125. package/renderer/flow/index.js +290 -0
  126. package/renderer/html/index.d.ts +12 -0
  127. package/renderer/html/index.d.ts.map +1 -0
  128. package/renderer/html/index.js +130 -0
  129. package/renderer/image/index.d.ts +11 -0
  130. package/renderer/image/index.d.ts.map +1 -0
  131. package/renderer/image/index.js +156 -0
  132. package/renderer/index.d.ts +32 -0
  133. package/renderer/index.d.ts.map +1 -0
  134. package/renderer/index.js +2206 -0
  135. package/renderer/maps/index.d.ts +27 -0
  136. package/renderer/maps/index.d.ts.map +1 -0
  137. package/renderer/maps/index.js +248 -0
  138. package/renderer/math/index.d.ts +11 -0
  139. package/renderer/math/index.d.ts.map +1 -0
  140. package/renderer/math/index.js +260 -0
  141. package/renderer/mdx/index.d.ts +10 -0
  142. package/renderer/mdx/index.d.ts.map +1 -0
  143. package/renderer/mdx/index.js +292 -0
  144. package/renderer/media/index.d.ts +20 -0
  145. package/renderer/media/index.d.ts.map +1 -0
  146. package/renderer/media/index.js +266 -0
  147. package/renderer/mermaid/index.d.ts +11 -0
  148. package/renderer/mermaid/index.d.ts.map +1 -0
  149. package/renderer/mermaid/index.js +251 -0
  150. package/renderer/pdf/index.d.ts +10 -0
  151. package/renderer/pdf/index.d.ts.map +1 -0
  152. package/renderer/pdf/index.js +260 -0
  153. package/renderer/react/index.d.ts +45 -0
  154. package/renderer/react/index.d.ts.map +1 -0
  155. package/renderer/react/index.js +261 -0
  156. package/renderer/types.d.ts +24 -0
  157. package/renderer/types.d.ts.map +1 -0
  158. package/runtime/babel-runtime.d.ts +70 -0
  159. package/runtime/babel-runtime.d.ts.map +1 -0
  160. package/runtime/content-detector.d.ts +43 -0
  161. package/runtime/content-detector.d.ts.map +1 -0
  162. package/runtime/index.d.ts +10 -0
  163. package/runtime/index.d.ts.map +1 -0
  164. package/runtime/index.js +217 -0
  165. package/theme/FrontMcpThemeProvider.d.ts +4 -0
  166. package/theme/FrontMcpThemeProvider.d.ts.map +1 -0
  167. package/theme/create-theme.d.ts +9 -0
  168. package/theme/create-theme.d.ts.map +1 -0
  169. package/theme/index.d.ts +5 -0
  170. package/theme/index.d.ts.map +1 -0
  171. package/theme/index.js +126 -0
  172. package/theme/types.d.ts +28 -0
  173. package/theme/types.d.ts.map +1 -0
  174. package/theme/use-theme.d.ts +3 -0
  175. package/theme/use-theme.d.ts.map +1 -0
  176. package/bundler/browser-components.d.ts +0 -42
  177. package/bundler/browser-components.d.ts.map +0 -1
  178. package/bundler/bundler.d.ts +0 -282
  179. package/bundler/bundler.d.ts.map +0 -1
  180. package/bundler/index.d.ts +0 -43
  181. package/bundler/index.d.ts.map +0 -1
  182. package/bundler/index.js +0 -3168
  183. package/bundler/types.d.ts +0 -883
  184. package/bundler/types.d.ts.map +0 -1
  185. package/components/alert.d.ts +0 -83
  186. package/components/alert.d.ts.map +0 -1
  187. package/components/alert.schema.d.ts +0 -98
  188. package/components/alert.schema.d.ts.map +0 -1
  189. package/components/avatar.d.ts +0 -77
  190. package/components/avatar.d.ts.map +0 -1
  191. package/components/avatar.schema.d.ts +0 -170
  192. package/components/avatar.schema.d.ts.map +0 -1
  193. package/components/badge.d.ts +0 -78
  194. package/components/badge.d.ts.map +0 -1
  195. package/components/badge.schema.d.ts +0 -91
  196. package/components/badge.schema.d.ts.map +0 -1
  197. package/components/button.d.ts +0 -100
  198. package/components/button.d.ts.map +0 -1
  199. package/components/button.schema.d.ts +0 -120
  200. package/components/button.schema.d.ts.map +0 -1
  201. package/components/card.d.ts +0 -76
  202. package/components/card.d.ts.map +0 -1
  203. package/components/card.schema.d.ts +0 -93
  204. package/components/card.schema.d.ts.map +0 -1
  205. package/components/form.d.ts +0 -227
  206. package/components/form.d.ts.map +0 -1
  207. package/components/form.schema.d.ts +0 -365
  208. package/components/form.schema.d.ts.map +0 -1
  209. package/components/list.d.ts +0 -121
  210. package/components/list.d.ts.map +0 -1
  211. package/components/list.schema.d.ts +0 -129
  212. package/components/list.schema.d.ts.map +0 -1
  213. package/components/modal.d.ts +0 -100
  214. package/components/modal.d.ts.map +0 -1
  215. package/components/modal.schema.d.ts +0 -151
  216. package/components/modal.schema.d.ts.map +0 -1
  217. package/components/table.d.ts +0 -91
  218. package/components/table.d.ts.map +0 -1
  219. package/components/table.schema.d.ts +0 -123
  220. package/components/table.schema.d.ts.map +0 -1
  221. package/esm/bundler/index.mjs +0 -3136
  222. package/esm/layouts/index.mjs +0 -409
  223. package/esm/render/index.mjs +0 -45
  224. package/esm/renderers/index.mjs +0 -621
  225. package/esm/universal/index.mjs +0 -1946
  226. package/esm/web-components/index.mjs +0 -2023
  227. package/layouts/base.d.ts +0 -86
  228. package/layouts/base.d.ts.map +0 -1
  229. package/layouts/index.d.ts +0 -8
  230. package/layouts/index.d.ts.map +0 -1
  231. package/layouts/index.js +0 -437
  232. package/layouts/presets.d.ts +0 -134
  233. package/layouts/presets.d.ts.map +0 -1
  234. package/react/Alert.d.ts +0 -101
  235. package/react/Alert.d.ts.map +0 -1
  236. package/react/Badge.d.ts +0 -100
  237. package/react/Badge.d.ts.map +0 -1
  238. package/react/Button.d.ts +0 -108
  239. package/react/Button.d.ts.map +0 -1
  240. package/react/Card.d.ts +0 -103
  241. package/react/Card.d.ts.map +0 -1
  242. package/react/types.d.ts +0 -105
  243. package/react/types.d.ts.map +0 -1
  244. package/render/index.d.ts +0 -8
  245. package/render/index.d.ts.map +0 -1
  246. package/render/prerender.d.ts +0 -57
  247. package/render/prerender.d.ts.map +0 -1
  248. package/renderers/index.d.ts +0 -26
  249. package/renderers/index.d.ts.map +0 -1
  250. package/renderers/index.js +0 -666
  251. package/renderers/mdx.renderer.d.ts +0 -99
  252. package/renderers/mdx.renderer.d.ts.map +0 -1
  253. package/renderers/react.adapter.d.ts +0 -70
  254. package/renderers/react.adapter.d.ts.map +0 -1
  255. package/renderers/react.renderer.d.ts +0 -105
  256. package/renderers/react.renderer.d.ts.map +0 -1
  257. package/renderers/transpiler.d.ts +0 -49
  258. package/renderers/transpiler.d.ts.map +0 -1
  259. package/universal/UniversalApp.d.ts +0 -108
  260. package/universal/UniversalApp.d.ts.map +0 -1
  261. package/universal/cached-runtime.d.ts +0 -139
  262. package/universal/cached-runtime.d.ts.map +0 -1
  263. package/universal/context.d.ts +0 -122
  264. package/universal/context.d.ts.map +0 -1
  265. package/universal/index.d.ts +0 -57
  266. package/universal/index.d.ts.map +0 -1
  267. package/universal/index.js +0 -2032
  268. package/universal/renderers/html.renderer.d.ts +0 -36
  269. package/universal/renderers/html.renderer.d.ts.map +0 -1
  270. package/universal/renderers/index.d.ts +0 -112
  271. package/universal/renderers/index.d.ts.map +0 -1
  272. package/universal/renderers/markdown.renderer.d.ts +0 -33
  273. package/universal/renderers/markdown.renderer.d.ts.map +0 -1
  274. package/universal/renderers/mdx.renderer.d.ts +0 -38
  275. package/universal/renderers/mdx.renderer.d.ts.map +0 -1
  276. package/universal/renderers/react.renderer.d.ts +0 -46
  277. package/universal/renderers/react.renderer.d.ts.map +0 -1
  278. package/universal/runtime-builder.d.ts +0 -33
  279. package/universal/runtime-builder.d.ts.map +0 -1
  280. package/universal/store.d.ts +0 -135
  281. package/universal/store.d.ts.map +0 -1
  282. package/universal/types.d.ts +0 -199
  283. package/universal/types.d.ts.map +0 -1
  284. package/web-components/core/attribute-parser.d.ts +0 -82
  285. package/web-components/core/attribute-parser.d.ts.map +0 -1
  286. package/web-components/core/base-element.d.ts +0 -197
  287. package/web-components/core/base-element.d.ts.map +0 -1
  288. package/web-components/core/index.d.ts +0 -9
  289. package/web-components/core/index.d.ts.map +0 -1
  290. package/web-components/elements/fmcp-alert.d.ts +0 -46
  291. package/web-components/elements/fmcp-alert.d.ts.map +0 -1
  292. package/web-components/elements/fmcp-badge.d.ts +0 -47
  293. package/web-components/elements/fmcp-badge.d.ts.map +0 -1
  294. package/web-components/elements/fmcp-button.d.ts +0 -117
  295. package/web-components/elements/fmcp-button.d.ts.map +0 -1
  296. package/web-components/elements/fmcp-card.d.ts +0 -53
  297. package/web-components/elements/fmcp-card.d.ts.map +0 -1
  298. package/web-components/elements/fmcp-input.d.ts +0 -96
  299. package/web-components/elements/fmcp-input.d.ts.map +0 -1
  300. package/web-components/elements/fmcp-select.d.ts +0 -100
  301. package/web-components/elements/fmcp-select.d.ts.map +0 -1
  302. package/web-components/elements/index.d.ts +0 -13
  303. package/web-components/elements/index.d.ts.map +0 -1
  304. package/web-components/index.d.ts +0 -49
  305. package/web-components/index.d.ts.map +0 -1
  306. package/web-components/index.js +0 -2058
  307. package/web-components/register.d.ts +0 -57
  308. package/web-components/register.d.ts.map +0 -1
  309. package/web-components/types.d.ts +0 -122
  310. package/web-components/types.d.ts.map +0 -1
@@ -1,2032 +0,0 @@
1
- "use strict";
2
- var __create = Object.create;
3
- var __defProp = Object.defineProperty;
4
- var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
5
- var __getOwnPropNames = Object.getOwnPropertyNames;
6
- var __getProtoOf = Object.getPrototypeOf;
7
- var __hasOwnProp = Object.prototype.hasOwnProperty;
8
- var __export = (target, all) => {
9
- for (var name in all)
10
- __defProp(target, name, { get: all[name], enumerable: true });
11
- };
12
- var __copyProps = (to, from, except, desc) => {
13
- if (from && typeof from === "object" || typeof from === "function") {
14
- for (let key of __getOwnPropNames(from))
15
- if (!__hasOwnProp.call(to, key) && key !== except)
16
- __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
17
- }
18
- return to;
19
- };
20
- var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
21
- // If the importer is in node compatibility mode or this is not an ESM
22
- // file that has been converted to a CommonJS file using a Babel-
23
- // compatible transform (i.e. "__esModule" has not been set), then set
24
- // "default" to the CommonJS "module.exports" for node compatibility.
25
- isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
26
- mod
27
- ));
28
- var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
29
-
30
- // libs/ui/src/universal/index.ts
31
- var universal_exports = {};
32
- __export(universal_exports, {
33
- ComponentsProvider: () => ComponentsProvider,
34
- DEFAULT_FRONTMCP_STATE: () => DEFAULT_FRONTMCP_STATE,
35
- EmptyState: () => EmptyState,
36
- ErrorDisplay: () => ErrorDisplay,
37
- FrontMCPProvider: () => FrontMCPProvider,
38
- LoadingSpinner: () => LoadingSpinner,
39
- RUNTIME_PLACEHOLDERS: () => RUNTIME_PLACEHOLDERS,
40
- RendererRegistry: () => RendererRegistry,
41
- UNIVERSAL_CDN: () => UNIVERSAL_CDN,
42
- UniversalApp: () => UniversalApp,
43
- UniversalAppWithProvider: () => UniversalAppWithProvider,
44
- UniversalProvider: () => UniversalProvider,
45
- buildAppScript: () => buildAppScript,
46
- buildComponentCode: () => buildComponentCode,
47
- buildDataInjectionCode: () => buildDataInjectionCode,
48
- buildMinimalRuntime: () => buildMinimalRuntime,
49
- buildUniversalRuntime: () => buildUniversalRuntime,
50
- clearRuntimeCache: () => clearRuntimeCache,
51
- createContent: () => createContent,
52
- createFrontMCPStore: () => createFrontMCPStore,
53
- createMarkdownRenderer: () => createMarkdownRenderer,
54
- createMdxRenderer: () => createMdxRenderer,
55
- createStoreSelector: () => createStoreSelector,
56
- detectContentType: () => detectContentType,
57
- detectRenderer: () => detectRenderer,
58
- getCachedRuntime: () => getCachedRuntime,
59
- getGlobalStore: () => getGlobalStore,
60
- getRuntimeCacheStats: () => getRuntimeCacheStats,
61
- htmlRenderer: () => htmlRenderer,
62
- initializeStoreFromWindow: () => initializeStoreFromWindow,
63
- isMdxSupported: () => isMdxSupported,
64
- isReactComponent: () => isReactComponent,
65
- markdownRenderer: () => markdownRenderer,
66
- mdxRenderer: () => mdxRenderer,
67
- reactRenderer: () => reactRenderer,
68
- renderContent: () => renderContent,
69
- rendererRegistry: () => rendererRegistry,
70
- resetGlobalStore: () => resetGlobalStore,
71
- safeHtmlRenderer: () => safeHtmlRenderer,
72
- setGlobalStore: () => setGlobalStore,
73
- useComponents: () => useComponents,
74
- useContent: () => useContent,
75
- useFrontMCPContext: () => useFrontMCPContext,
76
- useFrontMCPContextSafe: () => useFrontMCPContextSafe,
77
- useFrontMCPStore: () => useFrontMCPStore,
78
- useLoadingState: () => useLoadingState,
79
- useToolInput: () => useToolInput,
80
- useToolName: () => useToolName,
81
- useToolOutput: () => useToolOutput,
82
- withFrontMCP: () => withFrontMCP
83
- });
84
- module.exports = __toCommonJS(universal_exports);
85
-
86
- // libs/ui/src/universal/types.ts
87
- var DEFAULT_FRONTMCP_STATE = {
88
- toolName: null,
89
- input: null,
90
- output: null,
91
- content: null,
92
- structuredContent: null,
93
- loading: false,
94
- error: null
95
- };
96
- var UNIVERSAL_CDN = {
97
- esm: {
98
- reactMarkdown: "https://esm.sh/react-markdown@9",
99
- mdxReact: "https://esm.sh/@mdx-js/react@3",
100
- remarkGfm: "https://esm.sh/remark-gfm@4"
101
- }
102
- // Note: These libraries are not available on cdnjs
103
- // For Claude, we use inline implementations
104
- };
105
- function detectContentType(source) {
106
- if (typeof source === "function") {
107
- return "react";
108
- }
109
- if (typeof source !== "string") {
110
- return "html";
111
- }
112
- const hasModuleSyntax = /^import\s+/m.test(source) || /^export\s+(default\s+)?/m.test(source) || /^const\s+\w+\s*=\s*\([^)]*\)\s*=>/m.test(source) || // Arrow function components
113
- /^function\s+\w+\s*\(/m.test(source);
114
- const hasJsxTags = /<[A-Z][a-zA-Z]*/.test(source);
115
- const hasMarkdown = /^#{1,6}\s/m.test(source) || /^\*\s/m.test(source) || /^-\s/m.test(source) || /^\d+\.\s/m.test(source);
116
- if (hasModuleSyntax && hasJsxTags) {
117
- return "react";
118
- }
119
- if (hasJsxTags && hasMarkdown && !hasModuleSyntax) {
120
- return "mdx";
121
- }
122
- if (hasMarkdown || /\*\*[^*]+\*\*/.test(source) || /\[[^\]]+\]\([^)]+\)/.test(source)) {
123
- return "markdown";
124
- }
125
- if (hasJsxTags && !hasModuleSyntax) {
126
- return "mdx";
127
- }
128
- return "html";
129
- }
130
-
131
- // libs/ui/src/universal/store.ts
132
- var import_react = require("react");
133
- function createFrontMCPStore(initialState) {
134
- let state = {
135
- ...DEFAULT_FRONTMCP_STATE,
136
- ...initialState
137
- };
138
- const listeners = /* @__PURE__ */ new Set();
139
- const getState = () => state;
140
- const getServerState = () => state;
141
- const setState = (partial) => {
142
- const hasChanged = Object.keys(partial).some(
143
- (key) => partial[key] !== state[key]
144
- );
145
- if (hasChanged) {
146
- state = { ...state, ...partial };
147
- listeners.forEach((listener) => listener());
148
- }
149
- };
150
- const subscribe = (listener) => {
151
- listeners.add(listener);
152
- return () => {
153
- listeners.delete(listener);
154
- };
155
- };
156
- const reset = () => {
157
- setState({
158
- ...DEFAULT_FRONTMCP_STATE,
159
- ...initialState
160
- });
161
- };
162
- return {
163
- getState,
164
- getServerState,
165
- setState,
166
- subscribe,
167
- reset
168
- };
169
- }
170
- var globalStore = null;
171
- function getGlobalStore() {
172
- if (!globalStore) {
173
- globalStore = createFrontMCPStore();
174
- }
175
- return globalStore;
176
- }
177
- function setGlobalStore(store) {
178
- globalStore = store;
179
- }
180
- function resetGlobalStore(initialState) {
181
- globalStore = createFrontMCPStore(initialState);
182
- }
183
- function useFrontMCPStore(store) {
184
- const targetStore = store ?? getGlobalStore();
185
- return (0, import_react.useSyncExternalStore)(targetStore.subscribe, targetStore.getState, targetStore.getServerState);
186
- }
187
- function useToolOutput(store) {
188
- const state = useFrontMCPStore(store);
189
- return state.output;
190
- }
191
- function useToolInput(store) {
192
- const state = useFrontMCPStore(store);
193
- return state.input;
194
- }
195
- function useContent(store) {
196
- const state = useFrontMCPStore(store);
197
- return state.content;
198
- }
199
- function useToolName(store) {
200
- const state = useFrontMCPStore(store);
201
- return state.toolName;
202
- }
203
- function useLoadingState(store) {
204
- const state = useFrontMCPStore(store);
205
- return { loading: state.loading, error: state.error };
206
- }
207
- function initializeStoreFromWindow(store) {
208
- const targetStore = store ?? getGlobalStore();
209
- const windowData = typeof window !== "undefined" ? window.__frontmcp : void 0;
210
- if (windowData?.context) {
211
- targetStore.setState({
212
- toolName: windowData.context.toolName ?? null,
213
- input: windowData.context.toolInput ?? null,
214
- output: windowData.context.toolOutput ?? null,
215
- structuredContent: windowData.context.structuredContent ?? null,
216
- loading: false,
217
- error: null
218
- });
219
- }
220
- }
221
- function createStoreSelector(selector) {
222
- return (store) => {
223
- const state = useFrontMCPStore(store);
224
- return selector(state);
225
- };
226
- }
227
-
228
- // libs/ui/src/universal/context.tsx
229
- var import_react2 = require("react");
230
- var import_jsx_runtime = require("react/jsx-runtime");
231
- var FrontMCPContext = (0, import_react2.createContext)(null);
232
- var ComponentsContext = (0, import_react2.createContext)({});
233
- function FrontMCPProvider({ store, initialState, children }) {
234
- const storeRef = (0, import_react2.useRef)(null);
235
- if (!storeRef.current) {
236
- storeRef.current = store ?? createFrontMCPStore(initialState);
237
- }
238
- const actualStore = storeRef.current;
239
- (0, import_react2.useEffect)(() => {
240
- if (typeof window !== "undefined" && !store) {
241
- initializeStoreFromWindow(actualStore);
242
- }
243
- }, [actualStore, store]);
244
- return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(FrontMCPContext.Provider, { value: actualStore, children });
245
- }
246
- function ComponentsProvider({ components, children }) {
247
- const parentComponents = (0, import_react2.useContext)(ComponentsContext);
248
- const mergedComponents = (0, import_react2.useMemo)(
249
- () => ({
250
- ...parentComponents,
251
- ...components
252
- }),
253
- [parentComponents, components]
254
- );
255
- return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ComponentsContext.Provider, { value: mergedComponents, children });
256
- }
257
- function useFrontMCPContext() {
258
- const store = (0, import_react2.useContext)(FrontMCPContext);
259
- if (!store) {
260
- throw new Error("useFrontMCPContext must be used within a FrontMCPProvider");
261
- }
262
- return store;
263
- }
264
- function useComponents() {
265
- return (0, import_react2.useContext)(ComponentsContext);
266
- }
267
- function useFrontMCPContextSafe() {
268
- return (0, import_react2.useContext)(FrontMCPContext);
269
- }
270
- function UniversalProvider({
271
- store,
272
- initialState,
273
- components = {},
274
- children
275
- }) {
276
- return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(FrontMCPProvider, { store, initialState, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ComponentsProvider, { components, children }) });
277
- }
278
- function withFrontMCP(Component) {
279
- const WrappedComponent = (props) => {
280
- const store = useFrontMCPContext();
281
- const state = store.getState();
282
- return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Component, { ...props, state });
283
- };
284
- WrappedComponent.displayName = `withFrontMCP(${Component.displayName || Component.name || "Component"})`;
285
- return WrappedComponent;
286
- }
287
-
288
- // libs/ui/src/universal/renderers/html.renderer.ts
289
- var import_react3 = __toESM(require("react"));
290
- var import_runtime = require("@frontmcp/uipack/runtime");
291
- var sanitizeHtml = import_runtime.sanitizeHtmlContent;
292
- var htmlRenderer = {
293
- type: "html",
294
- priority: 0,
295
- // Lowest priority (fallback)
296
- canHandle(content) {
297
- return content.type === "html" || typeof content.source === "string";
298
- },
299
- render(content, _context) {
300
- const source = content.source;
301
- if (typeof source !== "string") {
302
- return import_react3.default.createElement("div", { className: "frontmcp-error" }, "HTML renderer requires a string source");
303
- }
304
- return import_react3.default.createElement("div", {
305
- className: "frontmcp-html-content",
306
- dangerouslySetInnerHTML: { __html: source }
307
- });
308
- }
309
- };
310
- var safeHtmlRenderer = {
311
- type: "html",
312
- priority: 0,
313
- canHandle(content) {
314
- return content.type === "html" && typeof content.source === "string";
315
- },
316
- render(content, _context) {
317
- const source = content.source;
318
- if (typeof source !== "string") {
319
- return import_react3.default.createElement("div", { className: "frontmcp-error" }, "HTML renderer requires a string source");
320
- }
321
- const sanitized = sanitizeHtml(source);
322
- return import_react3.default.createElement("div", {
323
- className: "frontmcp-html-content",
324
- dangerouslySetInnerHTML: { __html: sanitized }
325
- });
326
- }
327
- };
328
-
329
- // libs/ui/src/universal/renderers/markdown.renderer.ts
330
- var import_react4 = __toESM(require("react"));
331
- var import_utils = require("@frontmcp/uipack/utils");
332
- function isSafeUrl(url) {
333
- if (!url) return false;
334
- const lower = url.toLowerCase().trim();
335
- return lower.startsWith("http://") || lower.startsWith("https://") || lower.startsWith("/") || lower.startsWith("#") || lower.startsWith("mailto:") || lower.startsWith("tel:");
336
- }
337
- function getReactMarkdown() {
338
- if (typeof window !== "undefined" && window.ReactMarkdown) {
339
- return window.ReactMarkdown;
340
- }
341
- return null;
342
- }
343
- function parseMarkdownToHtml(markdown) {
344
- let html = (0, import_utils.escapeHtml)(markdown);
345
- html = html.replace(/^######\s+(.*)$/gm, "<h6>$1</h6>");
346
- html = html.replace(/^#####\s+(.*)$/gm, "<h5>$1</h5>");
347
- html = html.replace(/^####\s+(.*)$/gm, "<h4>$1</h4>");
348
- html = html.replace(/^###\s+(.*)$/gm, "<h3>$1</h3>");
349
- html = html.replace(/^##\s+(.*)$/gm, "<h2>$1</h2>");
350
- html = html.replace(/^#\s+(.*)$/gm, "<h1>$1</h1>");
351
- html = html.replace(/\*\*\*(.+?)\*\*\*/g, "<strong><em>$1</em></strong>");
352
- html = html.replace(/\*\*(.+?)\*\*/g, "<strong>$1</strong>");
353
- html = html.replace(/\*(.+?)\*/g, "<em>$1</em>");
354
- html = html.replace(/___(.+?)___/g, "<strong><em>$1</em></strong>");
355
- html = html.replace(/__(.+?)__/g, "<strong>$1</strong>");
356
- html = html.replace(/_(.+?)_/g, "<em>$1</em>");
357
- html = html.replace(/`([^`]+)`/g, "<code>$1</code>");
358
- html = html.replace(/\[([^\]]+)\]\(([^)]+)\)/g, (_match, text, url) => {
359
- return isSafeUrl(url) ? `<a href="${url}">${text}</a>` : text;
360
- });
361
- html = html.replace(/^[-*]\s+(.*)$/gm, "<li>$1</li>");
362
- html = html.replace(/(<li>.*<\/li>\n?)+/g, "<ul>$&</ul>");
363
- html = html.replace(/^\d+\.\s+(.*)$/gm, "<li>$1</li>");
364
- html = html.replace(/\n\n+/g, "</p><p>");
365
- html = "<p>" + html + "</p>";
366
- html = html.replace(/<p>\s*<\/p>/g, "");
367
- html = html.replace(/<p>\s*(<h[1-6]>)/g, "$1");
368
- html = html.replace(/(<\/h[1-6]>)\s*<\/p>/g, "$1");
369
- html = html.replace(/<p>\s*(<ul>)/g, "$1");
370
- html = html.replace(/(<\/ul>)\s*<\/p>/g, "$1");
371
- return html;
372
- }
373
- var markdownRenderer = {
374
- type: "markdown",
375
- priority: 10,
376
- // Medium priority
377
- canHandle(content) {
378
- if (content.type === "markdown") {
379
- return true;
380
- }
381
- if (typeof content.source === "string") {
382
- const source = content.source;
383
- const hasMarkdown = /^#{1,6}\s/m.test(source) || // Headers
384
- /^\*\s/m.test(source) || // Unordered list
385
- /^-\s/m.test(source) || // Unordered list
386
- /^\d+\.\s/m.test(source) || // Ordered list
387
- /\*\*[^*]+\*\*/.test(source) || // Bold
388
- /\[[^\]]+\]\([^)]+\)/.test(source);
389
- const hasJsx = /<[A-Z][a-zA-Z]*/.test(source);
390
- return hasMarkdown && !hasJsx;
391
- }
392
- return false;
393
- },
394
- render(content, context) {
395
- const source = content.source;
396
- if (typeof source !== "string") {
397
- return import_react4.default.createElement("div", { className: "frontmcp-error" }, "Markdown renderer requires a string source");
398
- }
399
- const ReactMarkdown = getReactMarkdown();
400
- if (ReactMarkdown) {
401
- const components = {
402
- ...context.components,
403
- ...content.components
404
- };
405
- return import_react4.default.createElement(ReactMarkdown, { components }, source);
406
- }
407
- const html = parseMarkdownToHtml(source);
408
- return import_react4.default.createElement("div", {
409
- className: "frontmcp-markdown-content prose",
410
- dangerouslySetInnerHTML: { __html: html }
411
- });
412
- }
413
- };
414
- function createMarkdownRenderer(defaultComponents) {
415
- return {
416
- ...markdownRenderer,
417
- render(content, context) {
418
- const enhancedContext = {
419
- ...context,
420
- components: {
421
- ...defaultComponents,
422
- ...context.components
423
- }
424
- };
425
- return markdownRenderer.render(content, enhancedContext);
426
- }
427
- };
428
- }
429
-
430
- // libs/ui/src/universal/renderers/react.renderer.ts
431
- var import_react5 = __toESM(require("react"));
432
- var reactRenderer = {
433
- type: "react",
434
- priority: 30,
435
- // Highest priority for function components
436
- canHandle(content) {
437
- return content.type === "react" || typeof content.source === "function";
438
- },
439
- render(content, context) {
440
- const Component = content.source;
441
- if (typeof Component !== "function") {
442
- return import_react5.default.createElement("div", {
443
- className: "frontmcp-error",
444
- children: "React renderer requires a component function"
445
- });
446
- }
447
- const props = {
448
- // Default props from context
449
- output: context.output,
450
- input: context.input,
451
- state: context.state,
452
- // Override with content-specific props
453
- ...content.props
454
- };
455
- return import_react5.default.createElement(Component, props);
456
- }
457
- };
458
- function isReactComponent(value) {
459
- if (typeof value !== "function") {
460
- return false;
461
- }
462
- const fn = value;
463
- const typeofSymbol = fn.$$typeof;
464
- if (typeofSymbol) {
465
- const symbolString = typeofSymbol.toString();
466
- return symbolString.includes("react.memo") || symbolString.includes("react.forward_ref") || symbolString.includes("react.lazy");
467
- }
468
- if (fn.prototype?.isReactComponent) {
469
- return true;
470
- }
471
- if (fn.name && /^[A-Z]/.test(fn.name)) {
472
- return true;
473
- }
474
- return false;
475
- }
476
-
477
- // libs/ui/src/universal/renderers/mdx.renderer.ts
478
- var import_react6 = __toESM(require("react"));
479
- var import_utils2 = require("@frontmcp/uipack/utils");
480
- function getMDXRuntime() {
481
- if (typeof window !== "undefined" && window.MDXProvider) {
482
- return { MDXProvider: window.MDXProvider };
483
- }
484
- return null;
485
- }
486
- function containsMdxSyntax(source) {
487
- if (/<[A-Z][a-zA-Z]*/.test(source)) {
488
- return true;
489
- }
490
- if (/\{[^}"']+\}/.test(source)) {
491
- return true;
492
- }
493
- if (/^(import|export)\s/m.test(source)) {
494
- return true;
495
- }
496
- if (/\s(className|onClick|onChange)=/.test(source)) {
497
- return true;
498
- }
499
- return false;
500
- }
501
- var mdxRenderer = {
502
- type: "mdx",
503
- priority: 20,
504
- // Higher than markdown, lower than React
505
- canHandle(content) {
506
- if (content.type === "mdx") {
507
- return true;
508
- }
509
- if (typeof content.source === "string") {
510
- const source = content.source;
511
- const hasMarkdown = /^#{1,6}\s/m.test(source) || /^\*\s/m.test(source) || /^-\s/m.test(source) || /^\d+\.\s/m.test(source);
512
- return hasMarkdown && containsMdxSyntax(source);
513
- }
514
- return false;
515
- },
516
- render(content, context) {
517
- const source = content.source;
518
- if (typeof source !== "string") {
519
- return import_react6.default.createElement("div", { className: "frontmcp-error" }, "MDX renderer requires a string source");
520
- }
521
- const mdxRuntime = getMDXRuntime();
522
- if (!mdxRuntime) {
523
- console.warn("[FrontMCP] MDX runtime not available. Content will be displayed as-is.");
524
- const escapedContent = (0, import_utils2.escapeHtml)(source).replace(/\n/g, "<br>");
525
- return import_react6.default.createElement(
526
- "div",
527
- { className: "frontmcp-mdx-fallback" },
528
- import_react6.default.createElement(
529
- "div",
530
- {
531
- key: "warning",
532
- className: "frontmcp-warning bg-yellow-50 border border-yellow-200 rounded p-2 mb-4 text-sm text-yellow-800"
533
- },
534
- "MDX rendering is not available on this platform. Content is shown as raw text."
535
- ),
536
- import_react6.default.createElement("pre", {
537
- key: "content",
538
- className: "bg-gray-100 p-4 rounded overflow-auto",
539
- dangerouslySetInnerHTML: { __html: escapedContent }
540
- })
541
- );
542
- }
543
- const components = {
544
- ...context.components,
545
- ...content.components
546
- };
547
- if (typeof content.compiledContent === "function") {
548
- const CompiledContent = content.compiledContent;
549
- return import_react6.default.createElement(
550
- mdxRuntime.MDXProvider,
551
- { components },
552
- import_react6.default.createElement(CompiledContent, {
553
- output: context.output,
554
- input: context.input
555
- })
556
- );
557
- }
558
- console.warn("[FrontMCP] MDX content needs to be pre-compiled. Raw MDX string rendering is not supported.");
559
- return import_react6.default.createElement(
560
- "div",
561
- { className: "frontmcp-mdx-uncompiled" },
562
- import_react6.default.createElement("pre", { className: "bg-gray-100 p-4 rounded overflow-auto text-sm" }, source)
563
- );
564
- }
565
- };
566
- function isMdxSupported() {
567
- return getMDXRuntime() !== null;
568
- }
569
- function createMdxRenderer(defaultComponents) {
570
- return {
571
- ...mdxRenderer,
572
- render(content, context) {
573
- const enhancedContext = {
574
- ...context,
575
- components: {
576
- ...defaultComponents,
577
- ...context.components
578
- }
579
- };
580
- return mdxRenderer.render(content, enhancedContext);
581
- }
582
- };
583
- }
584
-
585
- // libs/ui/src/universal/renderers/index.ts
586
- var RendererRegistry = class {
587
- renderers = /* @__PURE__ */ new Map();
588
- sortedRenderers = [];
589
- constructor() {
590
- this.register(htmlRenderer);
591
- this.register(markdownRenderer);
592
- this.register(reactRenderer);
593
- this.register(mdxRenderer);
594
- }
595
- /**
596
- * Register a renderer.
597
- * Renderers are sorted by priority (highest first) for auto-detection.
598
- */
599
- register(renderer) {
600
- this.renderers.set(renderer.type, renderer);
601
- this.updateSortedList();
602
- }
603
- /**
604
- * Unregister a renderer by type.
605
- */
606
- unregister(type) {
607
- const removed = this.renderers.delete(type);
608
- if (removed) {
609
- this.updateSortedList();
610
- }
611
- return removed;
612
- }
613
- /**
614
- * Get a renderer by type.
615
- */
616
- get(type) {
617
- return this.renderers.get(type);
618
- }
619
- /**
620
- * Check if a renderer type is registered.
621
- */
622
- has(type) {
623
- return this.renderers.has(type);
624
- }
625
- /**
626
- * Get all registered renderer types.
627
- */
628
- getTypes() {
629
- return Array.from(this.renderers.keys());
630
- }
631
- /**
632
- * Auto-detect the best renderer for content.
633
- *
634
- * Checks renderers in priority order (highest first).
635
- * Falls back to HTML renderer if no match.
636
- */
637
- detect(content) {
638
- if (content.type) {
639
- const explicit = this.renderers.get(content.type);
640
- if (explicit) {
641
- return explicit;
642
- }
643
- }
644
- for (const renderer of this.sortedRenderers) {
645
- if (renderer.canHandle(content)) {
646
- return renderer;
647
- }
648
- }
649
- return htmlRenderer;
650
- }
651
- /**
652
- * Render content using auto-detection.
653
- */
654
- render(content, context) {
655
- const renderer = this.detect(content);
656
- return renderer.render(content, context);
657
- }
658
- /**
659
- * Render with a specific renderer type.
660
- */
661
- renderWith(type, content, context) {
662
- const renderer = this.renderers.get(type);
663
- if (!renderer) {
664
- throw new Error(`Renderer '${type}' not registered`);
665
- }
666
- return renderer.render(content, context);
667
- }
668
- /**
669
- * Get registry statistics.
670
- */
671
- getStats() {
672
- return {
673
- registeredTypes: this.getTypes(),
674
- priorityOrder: this.sortedRenderers.map((r) => ({
675
- type: r.type,
676
- priority: r.priority
677
- }))
678
- };
679
- }
680
- /**
681
- * Update the sorted renderer list by priority.
682
- */
683
- updateSortedList() {
684
- this.sortedRenderers = Array.from(this.renderers.values()).sort((a, b) => b.priority - a.priority);
685
- }
686
- };
687
- var rendererRegistry = new RendererRegistry();
688
- function detectRenderer(content) {
689
- return rendererRegistry.detect(content);
690
- }
691
- function renderContent(content, context) {
692
- return rendererRegistry.render(content, context);
693
- }
694
- function createContent(source, options) {
695
- return {
696
- type: options?.type ?? detectContentType(source),
697
- source,
698
- props: options?.props,
699
- components: options?.components
700
- };
701
- }
702
-
703
- // libs/ui/src/universal/UniversalApp.tsx
704
- var import_react9 = __toESM(require("react"));
705
- var import_utils3 = require("@frontmcp/uipack/utils");
706
- function LoadingSpinner() {
707
- return import_react9.default.createElement(
708
- "div",
709
- { className: "frontmcp-loading flex items-center justify-center min-h-[200px]" },
710
- import_react9.default.createElement("div", {
711
- className: "frontmcp-spinner w-6 h-6 border-2 border-gray-200 border-t-blue-500 rounded-full animate-spin"
712
- })
713
- );
714
- }
715
- function ErrorDisplay({ error }) {
716
- return import_react9.default.createElement(
717
- "div",
718
- {
719
- className: "frontmcp-error bg-red-50 border border-red-200 rounded-lg p-4 text-red-800"
720
- },
721
- [
722
- import_react9.default.createElement("div", { key: "title", className: "font-medium" }, "Error"),
723
- import_react9.default.createElement("div", { key: "message", className: "text-sm mt-1" }, (0, import_utils3.escapeHtml)(error))
724
- ]
725
- );
726
- }
727
- function EmptyState() {
728
- return import_react9.default.createElement(
729
- "div",
730
- {
731
- className: "frontmcp-empty text-gray-500 text-center py-8"
732
- },
733
- "No content to display"
734
- );
735
- }
736
- function UniversalRenderer({
737
- content,
738
- state
739
- }) {
740
- const components = useComponents();
741
- const context = {
742
- output: state.output,
743
- input: state.input,
744
- components: {
745
- ...components,
746
- ...content.components
747
- },
748
- state
749
- };
750
- const rendered = renderContent(content, context);
751
- return import_react9.default.createElement("div", { className: "frontmcp-content" }, rendered);
752
- }
753
- function UniversalApp({
754
- content: contentOverride,
755
- components,
756
- fallback,
757
- errorFallback: ErrorFallback = ErrorDisplay
758
- }) {
759
- const state = useFrontMCPStore();
760
- if (state.loading) {
761
- return fallback ? import_react9.default.createElement(import_react9.default.Fragment, null, fallback) : import_react9.default.createElement(LoadingSpinner, null);
762
- }
763
- if (state.error) {
764
- return import_react9.default.createElement(ErrorFallback, { error: state.error });
765
- }
766
- const content = contentOverride ?? state.content;
767
- if (!content) {
768
- return import_react9.default.createElement(EmptyState, null);
769
- }
770
- if (components) {
771
- return import_react9.default.createElement(
772
- ComponentsProvider,
773
- { components },
774
- import_react9.default.createElement(UniversalRenderer, { content, state })
775
- );
776
- }
777
- return import_react9.default.createElement(UniversalRenderer, { content, state });
778
- }
779
- function UniversalAppWithProvider({
780
- initialState,
781
- components,
782
- ...appProps
783
- }) {
784
- return import_react9.default.createElement(
785
- FrontMCPProvider,
786
- { initialState },
787
- components ? import_react9.default.createElement(ComponentsProvider, { components }, import_react9.default.createElement(UniversalApp, appProps)) : import_react9.default.createElement(UniversalApp, appProps)
788
- );
789
- }
790
-
791
- // libs/ui/src/universal/runtime-builder.ts
792
- function buildStoreRuntime() {
793
- return `
794
- // FrontMCP Store
795
- (function() {
796
- var state = {
797
- toolName: null,
798
- input: null,
799
- output: null,
800
- content: null,
801
- structuredContent: null,
802
- loading: false,
803
- error: null
804
- };
805
-
806
- var listeners = new Set();
807
-
808
- window.__frontmcp = {
809
- // Store methods
810
- getState: function() { return state; },
811
- setState: function(partial) {
812
- state = Object.assign({}, state, partial);
813
- listeners.forEach(function(fn) { fn(); });
814
- },
815
- subscribe: function(fn) {
816
- listeners.add(fn);
817
- return function() { listeners.delete(fn); };
818
- },
819
- reset: function() {
820
- state = {
821
- toolName: null,
822
- input: null,
823
- output: null,
824
- content: null,
825
- structuredContent: null,
826
- loading: false,
827
- error: null
828
- };
829
- },
830
-
831
- // Context (legacy support)
832
- context: state,
833
- setContext: function(ctx) {
834
- this.setState(ctx);
835
- }
836
- };
837
-
838
- // Hooks for React components
839
- window.useFrontMCPStore = function() {
840
- var store = window.__frontmcp;
841
- return React.useSyncExternalStore(
842
- store.subscribe,
843
- store.getState,
844
- store.getState
845
- );
846
- };
847
-
848
- window.useToolOutput = function() {
849
- return window.useFrontMCPStore().output;
850
- };
851
-
852
- window.useToolInput = function() {
853
- return window.useFrontMCPStore().input;
854
- };
855
-
856
- window.useContent = function() {
857
- return window.useFrontMCPStore().content;
858
- };
859
- })();
860
- `;
861
- }
862
- function buildInlineMarkdownParser(options) {
863
- const allowUnsafeLinks = options?.contentSecurity?.bypassSanitization || options?.contentSecurity?.allowUnsafeLinks;
864
- return `
865
- // Inline Markdown Parser
866
- (function() {
867
- // XSS protection settings (configured at build time)
868
- var __allowUnsafeLinks = ${allowUnsafeLinks ? "true" : "false"};
869
-
870
- // URL scheme validation to prevent XSS via javascript: URLs
871
- function isSafeUrl(url) {
872
- // If unsafe links are allowed, all URLs are considered safe
873
- if (__allowUnsafeLinks) return true;
874
- if (!url) return false;
875
- var lower = url.toLowerCase().trim();
876
- return lower.startsWith('http://') ||
877
- lower.startsWith('https://') ||
878
- lower.startsWith('/') ||
879
- lower.startsWith('#') ||
880
- lower.startsWith('mailto:');
881
- }
882
-
883
- function parseMarkdown(md) {
884
- var html = md;
885
- // Escape HTML
886
- html = html.replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;');
887
- // Headers
888
- html = html.replace(/^######\\s+(.*)$/gm, '<h6>$1</h6>');
889
- html = html.replace(/^#####\\s+(.*)$/gm, '<h5>$1</h5>');
890
- html = html.replace(/^####\\s+(.*)$/gm, '<h4>$1</h4>');
891
- html = html.replace(/^###\\s+(.*)$/gm, '<h3>$1</h3>');
892
- html = html.replace(/^##\\s+(.*)$/gm, '<h2>$1</h2>');
893
- html = html.replace(/^#\\s+(.*)$/gm, '<h1>$1</h1>');
894
- // Bold and italic
895
- html = html.replace(/\\*\\*\\*(.+?)\\*\\*\\*/g, '<strong><em>$1</em></strong>');
896
- html = html.replace(/\\*\\*(.+?)\\*\\*/g, '<strong>$1</strong>');
897
- html = html.replace(/\\*(.+?)\\*/g, '<em>$1</em>');
898
- // Inline code
899
- html = html.replace(/\`([^\`]+)\`/g, '<code>$1</code>');
900
- // Links - validate URL scheme to prevent XSS (unless bypassed)
901
- html = html.replace(/\\[([^\\]]+)\\]\\(([^)]+)\\)/g, function(match, text, url) {
902
- return isSafeUrl(url) ? '<a href="' + url + '">' + text + '</a>' : text;
903
- });
904
- // Lists
905
- html = html.replace(/^[-*]\\s+(.*)$/gm, '<li>$1</li>');
906
- // Paragraphs
907
- html = html.replace(/\\n\\n+/g, '</p><p>');
908
- html = '<p>' + html + '</p>';
909
- return html;
910
- }
911
-
912
- window.__frontmcp.parseMarkdown = parseMarkdown;
913
-
914
- // Simple ReactMarkdown replacement
915
- window.ReactMarkdown = function(props) {
916
- var html = parseMarkdown(props.children || '');
917
- return React.createElement('div', {
918
- className: 'frontmcp-markdown prose',
919
- dangerouslySetInnerHTML: { __html: html }
920
- });
921
- };
922
- })();
923
- `;
924
- }
925
- function buildRenderersRuntime(options) {
926
- const bypassSanitization = options?.contentSecurity?.bypassSanitization;
927
- const allowInlineScripts = bypassSanitization || options?.contentSecurity?.allowInlineScripts;
928
- return `
929
- // Universal Renderers
930
- (function() {
931
- var renderers = {};
932
-
933
- // XSS protection settings (configured at build time)
934
- var __allowInlineScripts = ${allowInlineScripts ? "true" : "false"};
935
-
936
- // HTML Renderer
937
- renderers.html = {
938
- type: 'html',
939
- priority: 0,
940
- canHandle: function(c) { return c.type === 'html'; },
941
- render: function(c, ctx) {
942
- var html = c.source;
943
- // Apply XSS protection unless bypassed
944
- if (!__allowInlineScripts) {
945
- // Remove script tags and event handlers
946
- html = html.replace(/<script[^>]*>[\\s\\S]*?<\\/script>/gi, '');
947
- html = html.replace(/\\s+on\\w+\\s*=/gi, ' data-removed-handler=');
948
- }
949
- return React.createElement('div', {
950
- className: 'frontmcp-html-content',
951
- dangerouslySetInnerHTML: { __html: html }
952
- });
953
- }
954
- };
955
-
956
- // Markdown Renderer
957
- renderers.markdown = {
958
- type: 'markdown',
959
- priority: 10,
960
- canHandle: function(c) {
961
- if (c.type === 'markdown') return true;
962
- if (typeof c.source !== 'string') return false;
963
- var s = c.source;
964
- return /^#{1,6}\\s/m.test(s) || /^[-*]\\s/m.test(s) || /\\*\\*[^*]+\\*\\*/.test(s);
965
- },
966
- render: function(c, ctx) {
967
- if (window.ReactMarkdown) {
968
- return React.createElement(window.ReactMarkdown, {
969
- children: c.source,
970
- components: Object.assign({}, ctx.components, c.components)
971
- });
972
- }
973
- // Fallback to inline parser
974
- var html = window.__frontmcp.parseMarkdown ? window.__frontmcp.parseMarkdown(c.source) : c.source;
975
- return React.createElement('div', {
976
- className: 'frontmcp-markdown prose',
977
- dangerouslySetInnerHTML: { __html: html }
978
- });
979
- }
980
- };
981
-
982
- // React Renderer
983
- renderers.react = {
984
- type: 'react',
985
- priority: 30,
986
- canHandle: function(c) { return c.type === 'react' || typeof c.source === 'function'; },
987
- render: function(c, ctx) {
988
- var Component = c.source;
989
- var props = Object.assign({
990
- output: ctx.output,
991
- input: ctx.input,
992
- state: ctx.state
993
- }, c.props);
994
- return React.createElement(Component, props);
995
- }
996
- };
997
-
998
- // MDX Renderer
999
- renderers.mdx = {
1000
- type: 'mdx',
1001
- priority: 20,
1002
- canHandle: function(c) {
1003
- if (c.type === 'mdx') return true;
1004
- if (typeof c.source !== 'string') return false;
1005
- var s = c.source;
1006
- return /<[A-Z][a-zA-Z]*/.test(s) && /^#{1,6}\\s/m.test(s);
1007
- },
1008
- render: function(c, ctx) {
1009
- // MDX requires pre-compilation, fallback to showing source
1010
- if (typeof c.compiledContent === 'function') {
1011
- var MDXContent = c.compiledContent;
1012
- return React.createElement(MDXContent, {
1013
- output: ctx.output,
1014
- input: ctx.input,
1015
- components: Object.assign({}, ctx.components, c.components)
1016
- });
1017
- }
1018
- // Show warning
1019
- return React.createElement('div', { className: 'frontmcp-mdx-fallback' }, [
1020
- React.createElement('div', {
1021
- key: 'warn',
1022
- className: 'bg-yellow-50 border border-yellow-200 rounded p-2 mb-2 text-sm text-yellow-800'
1023
- }, 'MDX requires pre-compilation. Showing raw content.'),
1024
- React.createElement('pre', {
1025
- key: 'pre',
1026
- className: 'bg-gray-100 p-4 rounded text-sm overflow-auto'
1027
- }, c.source)
1028
- ]);
1029
- }
1030
- };
1031
-
1032
- // Sorted by priority
1033
- var sortedRenderers = [renderers.react, renderers.mdx, renderers.markdown, renderers.html];
1034
-
1035
- // Detect renderer
1036
- window.__frontmcp.detectRenderer = function(content) {
1037
- if (content.type && renderers[content.type]) {
1038
- return renderers[content.type];
1039
- }
1040
- for (var i = 0; i < sortedRenderers.length; i++) {
1041
- if (sortedRenderers[i].canHandle(content)) {
1042
- return sortedRenderers[i];
1043
- }
1044
- }
1045
- return renderers.html;
1046
- };
1047
-
1048
- // Render content
1049
- window.__frontmcp.renderContent = function(content, context) {
1050
- var renderer = window.__frontmcp.detectRenderer(content);
1051
- return renderer.render(content, context);
1052
- };
1053
-
1054
- window.__frontmcp.renderers = renderers;
1055
- })();
1056
- `;
1057
- }
1058
- function buildUniversalAppRuntime() {
1059
- return `
1060
- // Universal App Component
1061
- (function() {
1062
- var LoadingSpinner = function() {
1063
- return React.createElement('div', {
1064
- className: 'frontmcp-loading flex items-center justify-center min-h-[200px]'
1065
- }, React.createElement('div', {
1066
- className: 'frontmcp-spinner w-6 h-6 border-2 border-gray-200 border-t-blue-500 rounded-full animate-spin'
1067
- }));
1068
- };
1069
-
1070
- var ErrorDisplay = function(props) {
1071
- return React.createElement('div', {
1072
- className: 'frontmcp-error bg-red-50 border border-red-200 rounded-lg p-4 text-red-800'
1073
- }, [
1074
- React.createElement('div', { key: 'title', className: 'font-medium' }, 'Error'),
1075
- React.createElement('div', { key: 'msg', className: 'text-sm mt-1' }, props.error)
1076
- ]);
1077
- };
1078
-
1079
- var EmptyState = function() {
1080
- return React.createElement('div', {
1081
- className: 'frontmcp-empty text-gray-500 text-center py-8'
1082
- }, 'No content to display');
1083
- };
1084
-
1085
- window.__frontmcp.UniversalApp = function(props) {
1086
- var state = window.useFrontMCPStore();
1087
-
1088
- if (state.loading) {
1089
- return props.fallback || React.createElement(LoadingSpinner);
1090
- }
1091
-
1092
- if (state.error) {
1093
- var ErrorComp = props.errorFallback || ErrorDisplay;
1094
- return React.createElement(ErrorComp, { error: state.error });
1095
- }
1096
-
1097
- var content = props.content || state.content;
1098
-
1099
- if (!content) {
1100
- return React.createElement(EmptyState);
1101
- }
1102
-
1103
- var context = {
1104
- output: state.output,
1105
- input: state.input,
1106
- state: state,
1107
- components: props.components || {}
1108
- };
1109
-
1110
- var rendered = window.__frontmcp.renderContent(content, context);
1111
- return React.createElement('div', { className: 'frontmcp-content' }, rendered);
1112
- };
1113
-
1114
- window.__frontmcp.LoadingSpinner = LoadingSpinner;
1115
- window.__frontmcp.ErrorDisplay = ErrorDisplay;
1116
- window.__frontmcp.EmptyState = EmptyState;
1117
- })();
1118
- `;
1119
- }
1120
- function buildCdnImports(options) {
1121
- const parts = [];
1122
- if (options.cdnType === "esm") {
1123
- if (options.includeMarkdown) {
1124
- parts.push(`
1125
- <script type="module">
1126
- import ReactMarkdown from '${UNIVERSAL_CDN.esm.reactMarkdown}';
1127
- window.ReactMarkdown = ReactMarkdown;
1128
- </script>`);
1129
- }
1130
- if (options.includeMdx) {
1131
- parts.push(`
1132
- <script type="module">
1133
- import { MDXProvider } from '${UNIVERSAL_CDN.esm.mdxReact}';
1134
- window.MDXProvider = MDXProvider;
1135
- </script>`);
1136
- }
1137
- }
1138
- return parts.join("\n");
1139
- }
1140
- function buildUniversalRuntime(options) {
1141
- const parts = [];
1142
- parts.push(buildStoreRuntime());
1143
- if (options.cdnType === "umd" || options.includeMarkdown) {
1144
- parts.push(buildInlineMarkdownParser(options));
1145
- }
1146
- parts.push(buildRenderersRuntime(options));
1147
- parts.push(buildUniversalAppRuntime());
1148
- if (options.customComponents) {
1149
- parts.push(`
1150
- // Custom Components
1151
- (function() {
1152
- ${options.customComponents}
1153
- })();
1154
- `);
1155
- }
1156
- let script = parts.join("\n");
1157
- if (options.minify) {
1158
- script = script.replace(/\/\*[\s\S]*?\*\//g, "").replace(/^\s*\/\/[^\n]*$/gm, "").replace(/\n\s*\n/g, "\n").replace(/^\s+/gm, "").trim();
1159
- }
1160
- return {
1161
- script,
1162
- cdnImports: buildCdnImports(options),
1163
- size: script.length
1164
- };
1165
- }
1166
- function buildMinimalRuntime(options) {
1167
- let script = buildStoreRuntime();
1168
- if (options.minify) {
1169
- script = script.replace(/\/\*[\s\S]*?\*\//g, "").replace(/^\s*\/\/[^\n]*$/gm, "").replace(/\n\s*\n/g, "\n").replace(/^\s+/gm, "").trim();
1170
- }
1171
- return script;
1172
- }
1173
-
1174
- // libs/ui/src/universal/cached-runtime.ts
1175
- var import_runtime2 = require("@frontmcp/uipack/runtime");
1176
- var import_build = require("@frontmcp/uipack/build");
1177
- var RUNTIME_PLACEHOLDERS = {
1178
- /** Placeholder for transpiled component code */
1179
- COMPONENT_CODE: "/*__FRONTMCP_COMPONENT_CODE__*/",
1180
- /** Placeholder for data injection */
1181
- DATA_INJECTION: "/*__FRONTMCP_DATA_INJECTION__*/",
1182
- /** Placeholder for custom components */
1183
- CUSTOM_COMPONENTS: "/*__FRONTMCP_CUSTOM_COMPONENTS__*/"
1184
- };
1185
- var runtimeCache = /* @__PURE__ */ new Map();
1186
- var DEFAULT_CACHE_CONFIG = {
1187
- maxEntries: 10,
1188
- ttl: 0
1189
- // Forever by default
1190
- };
1191
- function generateCacheKey(options) {
1192
- const securityKey = options.contentSecurity ? [
1193
- options.contentSecurity.allowUnsafeLinks ? "unsafeLinks" : "",
1194
- options.contentSecurity.allowInlineScripts ? "unsafeScripts" : "",
1195
- options.contentSecurity.bypassSanitization ? "bypass" : ""
1196
- ].filter(Boolean).join("+") || "secure" : "secure";
1197
- return [
1198
- options.cdnType,
1199
- options.includeMarkdown ? "md" : "",
1200
- options.includeMdx ? "mdx" : "",
1201
- options.minify ? "min" : "",
1202
- options.includeBridge ? "bridge" : "",
1203
- securityKey
1204
- ].filter(Boolean).join(":");
1205
- }
1206
- function buildStoreRuntime2() {
1207
- return `
1208
- // FrontMCP Store (Vendor)
1209
- (function() {
1210
- var state = {
1211
- toolName: null,
1212
- input: null,
1213
- output: null,
1214
- content: null,
1215
- structuredContent: null,
1216
- loading: false,
1217
- error: null
1218
- };
1219
-
1220
- var listeners = new Set();
1221
-
1222
- window.__frontmcp = {
1223
- getState: function() { return state; },
1224
- setState: function(partial) {
1225
- state = Object.assign({}, state, partial);
1226
- listeners.forEach(function(fn) { fn(); });
1227
- },
1228
- subscribe: function(fn) {
1229
- listeners.add(fn);
1230
- return function() { listeners.delete(fn); };
1231
- },
1232
- reset: function() {
1233
- state = {
1234
- toolName: null,
1235
- input: null,
1236
- output: null,
1237
- content: null,
1238
- structuredContent: null,
1239
- loading: false,
1240
- error: null
1241
- };
1242
- },
1243
- context: state,
1244
- setContext: function(ctx) {
1245
- this.setState(ctx);
1246
- },
1247
- // Dynamic mode: update output and re-render
1248
- updateOutput: function(output) {
1249
- this.setState({ output: output, loading: false });
1250
- // Also update the global window variable for compatibility
1251
- window.__mcpToolOutput = output;
1252
- },
1253
- // Dynamic mode: update input and re-render
1254
- updateInput: function(input) {
1255
- this.setState({ input: input });
1256
- window.__mcpToolInput = input;
1257
- }
1258
- };
1259
-
1260
- // React hooks
1261
- window.useFrontMCPStore = function() {
1262
- var store = window.__frontmcp;
1263
- return React.useSyncExternalStore(
1264
- store.subscribe,
1265
- store.getState,
1266
- store.getState
1267
- );
1268
- };
1269
-
1270
- window.useToolOutput = function() {
1271
- return window.useFrontMCPStore().output;
1272
- };
1273
-
1274
- window.useToolInput = function() {
1275
- return window.useFrontMCPStore().input;
1276
- };
1277
-
1278
- window.useContent = function() {
1279
- return window.useFrontMCPStore().content;
1280
- };
1281
-
1282
- // Connect to MCP Bridge for platform data detection
1283
- function initFromBridge() {
1284
- // Check for data from mcpBridge (handles OpenAI, ext-apps, etc.)
1285
- if (window.mcpBridge && window.mcpBridge.toolOutput != null) {
1286
- window.__frontmcp.setState({
1287
- output: window.mcpBridge.toolOutput,
1288
- loading: false
1289
- });
1290
- }
1291
-
1292
- // Subscribe to bridge updates via onToolResult
1293
- if (window.mcpBridge && window.mcpBridge.onToolResult) {
1294
- window.mcpBridge.onToolResult(function(result) {
1295
- window.__frontmcp.updateOutput(result);
1296
- });
1297
- }
1298
- }
1299
-
1300
- // Initialize from bridge when ready
1301
- if (window.mcpBridge) {
1302
- initFromBridge();
1303
- } else {
1304
- // Wait for bridge to be ready
1305
- window.addEventListener('mcp:bridge-ready', initFromBridge);
1306
- }
1307
- })();
1308
- `;
1309
- }
1310
- function buildRequireShim() {
1311
- return `
1312
- // Module Require Shim (Vendor)
1313
- (function() {
1314
- window.__moduleCache = {};
1315
- window.require = function(moduleName) {
1316
- if (window.__moduleCache[moduleName]) {
1317
- return window.__moduleCache[moduleName];
1318
- }
1319
-
1320
- var moduleMap = {
1321
- 'react': function() { return window.React; },
1322
- 'react-dom': function() { return window.ReactDOM; },
1323
- 'react-dom/client': function() { return window.ReactDOM; },
1324
- 'react/jsx-runtime': function() { return window.jsx_runtime_namespaceObject; },
1325
- 'react/jsx-dev-runtime': function() { return window.jsx_runtime_namespaceObject; },
1326
- '@frontmcp/ui': function() { return window.frontmcp_ui_namespaceObject; },
1327
- '@frontmcp/ui/react': function() { return window.frontmcp_ui_namespaceObject; }
1328
- };
1329
-
1330
- var resolver = moduleMap[moduleName];
1331
- if (resolver) {
1332
- var mod = resolver();
1333
- window.__moduleCache[moduleName] = mod;
1334
- return mod;
1335
- }
1336
-
1337
- console.warn('[FrontMCP] Unknown module:', moduleName);
1338
- return {};
1339
- };
1340
- })();
1341
- `;
1342
- }
1343
- function buildInlineMarkdownParser2(options) {
1344
- const allowUnsafeLinks = options?.contentSecurity?.bypassSanitization || options?.contentSecurity?.allowUnsafeLinks;
1345
- return `
1346
- // Inline Markdown Parser (Vendor)
1347
- (function() {
1348
- // XSS protection settings (configured at build time)
1349
- // Set to true if contentSecurity.allowUnsafeLinks or bypassSanitization is enabled
1350
- var __allowUnsafeLinks = ${allowUnsafeLinks ? "true" : "false"};
1351
-
1352
- // URL scheme validation to prevent XSS via javascript: URLs
1353
- function isSafeUrl(url) {
1354
- // If unsafe links are explicitly allowed, skip validation
1355
- if (__allowUnsafeLinks) return true;
1356
- if (!url) return false;
1357
- var lower = url.toLowerCase().trim();
1358
- return lower.startsWith('http://') ||
1359
- lower.startsWith('https://') ||
1360
- lower.startsWith('/') ||
1361
- lower.startsWith('#') ||
1362
- lower.startsWith('mailto:');
1363
- }
1364
-
1365
- function parseMarkdown(md) {
1366
- var html = md;
1367
- html = html.replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;');
1368
- html = html.replace(/^######\\s+(.*)$/gm, '<h6>$1</h6>');
1369
- html = html.replace(/^#####\\s+(.*)$/gm, '<h5>$1</h5>');
1370
- html = html.replace(/^####\\s+(.*)$/gm, '<h4>$1</h4>');
1371
- html = html.replace(/^###\\s+(.*)$/gm, '<h3>$1</h3>');
1372
- html = html.replace(/^##\\s+(.*)$/gm, '<h2>$1</h2>');
1373
- html = html.replace(/^#\\s+(.*)$/gm, '<h1>$1</h1>');
1374
- html = html.replace(/\\*\\*\\*(.+?)\\*\\*\\*/g, '<strong><em>$1</em></strong>');
1375
- html = html.replace(/\\*\\*(.+?)\\*\\*/g, '<strong>$1</strong>');
1376
- html = html.replace(/\\*(.+?)\\*/g, '<em>$1</em>');
1377
- html = html.replace(/\`([^\`]+)\`/g, '<code>$1</code>');
1378
- // Links - validate URL scheme to prevent XSS (unless bypassed)
1379
- html = html.replace(/\\[([^\\]]+)\\]\\(([^)]+)\\)/g, function(match, text, url) {
1380
- return isSafeUrl(url) ? '<a href="' + url + '">' + text + '</a>' : text;
1381
- });
1382
- html = html.replace(/^[-*]\\s+(.*)$/gm, '<li>$1</li>');
1383
- html = html.replace(/\\n\\n+/g, '</p><p>');
1384
- html = '<p>' + html + '</p>';
1385
- return html;
1386
- }
1387
-
1388
- window.__frontmcp.parseMarkdown = parseMarkdown;
1389
-
1390
- window.ReactMarkdown = function(props) {
1391
- var html = parseMarkdown(props.children || '');
1392
- return React.createElement('div', {
1393
- className: 'frontmcp-markdown prose',
1394
- dangerouslySetInnerHTML: { __html: html }
1395
- });
1396
- };
1397
- })();
1398
- `;
1399
- }
1400
- function buildRenderersRuntime2(options) {
1401
- const bypassSanitization = options?.contentSecurity?.bypassSanitization;
1402
- const allowInlineScripts = bypassSanitization || options?.contentSecurity?.allowInlineScripts;
1403
- return `
1404
- // Universal Renderers (Vendor)
1405
- (function() {
1406
- var renderers = {};
1407
-
1408
- // XSS protection settings (configured at build time)
1409
- // Set to true if contentSecurity.allowInlineScripts or bypassSanitization is enabled
1410
- var __allowInlineScripts = ${allowInlineScripts ? "true" : "false"};
1411
-
1412
- renderers.html = {
1413
- type: 'html',
1414
- priority: 0,
1415
- canHandle: function(c) { return c.type === 'html'; },
1416
- render: function(c, ctx) {
1417
- var html = c.source;
1418
- // Apply XSS protection unless bypassed
1419
- if (!__allowInlineScripts) {
1420
- // Remove script tags and event handlers to prevent XSS
1421
- html = html.replace(/<script[^>]*>[\\s\\S]*?<\\/script>/gi, '');
1422
- html = html.replace(/\\s+on\\w+\\s*=/gi, ' data-removed-handler=');
1423
- }
1424
- return React.createElement('div', {
1425
- className: 'frontmcp-html-content',
1426
- dangerouslySetInnerHTML: { __html: html }
1427
- });
1428
- }
1429
- };
1430
-
1431
- renderers.markdown = {
1432
- type: 'markdown',
1433
- priority: 10,
1434
- canHandle: function(c) {
1435
- if (c.type === 'markdown') return true;
1436
- if (typeof c.source !== 'string') return false;
1437
- var s = c.source;
1438
- return /^#{1,6}\\s/m.test(s) || /^[-*]\\s/m.test(s) || /\\*\\*[^*]+\\*\\*/.test(s);
1439
- },
1440
- render: function(c, ctx) {
1441
- if (window.ReactMarkdown) {
1442
- return React.createElement(window.ReactMarkdown, {
1443
- children: c.source,
1444
- components: Object.assign({}, ctx.components, c.components)
1445
- });
1446
- }
1447
- var html = window.__frontmcp.parseMarkdown ? window.__frontmcp.parseMarkdown(c.source) : c.source;
1448
- return React.createElement('div', {
1449
- className: 'frontmcp-markdown prose',
1450
- dangerouslySetInnerHTML: { __html: html }
1451
- });
1452
- }
1453
- };
1454
-
1455
- renderers.react = {
1456
- type: 'react',
1457
- priority: 30,
1458
- canHandle: function(c) { return c.type === 'react' || typeof c.source === 'function'; },
1459
- render: function(c, ctx) {
1460
- var Component = c.source;
1461
- var props = Object.assign({
1462
- output: ctx.output,
1463
- input: ctx.input,
1464
- state: ctx.state,
1465
- data: ctx.output // Alias for convenience
1466
- }, c.props);
1467
- return React.createElement(Component, props);
1468
- }
1469
- };
1470
-
1471
- renderers.mdx = {
1472
- type: 'mdx',
1473
- priority: 20,
1474
- canHandle: function(c) {
1475
- if (c.type === 'mdx') return true;
1476
- if (typeof c.source !== 'string') return false;
1477
- var s = c.source;
1478
- return /<[A-Z][a-zA-Z]*/.test(s) && /^#{1,6}\\s/m.test(s);
1479
- },
1480
- render: function(c, ctx) {
1481
- if (typeof c.compiledContent === 'function') {
1482
- var MDXContent = c.compiledContent;
1483
- return React.createElement(MDXContent, {
1484
- output: ctx.output,
1485
- input: ctx.input,
1486
- components: Object.assign({}, ctx.components, c.components)
1487
- });
1488
- }
1489
- return React.createElement('div', { className: 'frontmcp-mdx-fallback' }, [
1490
- React.createElement('div', {
1491
- key: 'warn',
1492
- className: 'bg-yellow-50 border border-yellow-200 rounded p-2 mb-2 text-sm text-yellow-800'
1493
- }, 'MDX requires pre-compilation. Showing raw content.'),
1494
- React.createElement('pre', {
1495
- key: 'pre',
1496
- className: 'bg-gray-100 p-4 rounded text-sm overflow-auto'
1497
- }, c.source)
1498
- ]);
1499
- }
1500
- };
1501
-
1502
- var sortedRenderers = [renderers.react, renderers.mdx, renderers.markdown, renderers.html];
1503
-
1504
- window.__frontmcp.detectRenderer = function(content) {
1505
- if (content.type && renderers[content.type]) {
1506
- return renderers[content.type];
1507
- }
1508
- for (var i = 0; i < sortedRenderers.length; i++) {
1509
- if (sortedRenderers[i].canHandle(content)) {
1510
- return sortedRenderers[i];
1511
- }
1512
- }
1513
- return renderers.html;
1514
- };
1515
-
1516
- window.__frontmcp.renderContent = function(content, context) {
1517
- var renderer = window.__frontmcp.detectRenderer(content);
1518
- return renderer.render(content, context);
1519
- };
1520
-
1521
- window.__frontmcp.renderers = renderers;
1522
- })();
1523
- `;
1524
- }
1525
- function buildUIComponentsRuntime() {
1526
- return (0, import_build.buildUIComponentsRuntime)();
1527
- }
1528
- function buildUniversalAppRuntime2() {
1529
- return `
1530
- // Universal App (Vendor)
1531
- (function() {
1532
- var LoadingSpinner = function() {
1533
- return React.createElement('div', {
1534
- className: 'frontmcp-loading flex items-center justify-center min-h-[200px]'
1535
- }, React.createElement('div', {
1536
- className: 'frontmcp-spinner w-6 h-6 border-2 border-gray-200 border-t-blue-500 rounded-full animate-spin'
1537
- }));
1538
- };
1539
-
1540
- var ErrorDisplay = function(props) {
1541
- return React.createElement('div', {
1542
- className: 'frontmcp-error bg-red-50 border border-red-200 rounded-lg p-4 text-red-800'
1543
- }, [
1544
- React.createElement('div', { key: 'title', className: 'font-medium' }, 'Error'),
1545
- React.createElement('div', { key: 'msg', className: 'text-sm mt-1' }, props.error)
1546
- ]);
1547
- };
1548
-
1549
- var EmptyState = function() {
1550
- return React.createElement('div', {
1551
- className: 'frontmcp-empty text-gray-500 text-center py-8'
1552
- }, 'No content to display');
1553
- };
1554
-
1555
- window.__frontmcp.UniversalApp = function(props) {
1556
- var state = window.useFrontMCPStore();
1557
-
1558
- if (state.loading) {
1559
- return props.fallback || React.createElement(LoadingSpinner);
1560
- }
1561
-
1562
- if (state.error) {
1563
- var ErrorComp = props.errorFallback || ErrorDisplay;
1564
- return React.createElement(ErrorComp, { error: state.error });
1565
- }
1566
-
1567
- var content = props.content || state.content;
1568
-
1569
- if (!content) {
1570
- return React.createElement(EmptyState);
1571
- }
1572
-
1573
- var context = {
1574
- output: state.output,
1575
- input: state.input,
1576
- state: state,
1577
- components: props.components || {}
1578
- };
1579
-
1580
- var rendered = window.__frontmcp.renderContent(content, context);
1581
- return React.createElement('div', { className: 'frontmcp-content' }, rendered);
1582
- };
1583
-
1584
- window.__frontmcp.LoadingSpinner = LoadingSpinner;
1585
- window.__frontmcp.ErrorDisplay = ErrorDisplay;
1586
- window.__frontmcp.EmptyState = EmptyState;
1587
- })();
1588
- `;
1589
- }
1590
- function buildComponentWrapper() {
1591
- return `
1592
- // Component Execution (App Chunk)
1593
- (function() {
1594
- ${RUNTIME_PLACEHOLDERS.COMPONENT_CODE}
1595
- })();
1596
- `;
1597
- }
1598
- function buildDataInjectionWrapper() {
1599
- return `
1600
- // Data Injection (App Chunk)
1601
- (function() {
1602
- ${RUNTIME_PLACEHOLDERS.DATA_INJECTION}
1603
- })();
1604
- `;
1605
- }
1606
- function buildCustomComponentsWrapper() {
1607
- return `
1608
- // Custom Components (App Chunk)
1609
- (function() {
1610
- ${RUNTIME_PLACEHOLDERS.CUSTOM_COMPONENTS}
1611
- })();
1612
- `;
1613
- }
1614
- function buildCdnImports2(options) {
1615
- const parts = [];
1616
- if (options.cdnType === "esm") {
1617
- if (options.includeMarkdown) {
1618
- parts.push(`
1619
- <script type="module">
1620
- import ReactMarkdown from '${UNIVERSAL_CDN.esm.reactMarkdown}';
1621
- window.ReactMarkdown = ReactMarkdown;
1622
- </script>`);
1623
- }
1624
- if (options.includeMdx) {
1625
- parts.push(`
1626
- <script type="module">
1627
- import { MDXProvider } from '${UNIVERSAL_CDN.esm.mdxReact}';
1628
- window.MDXProvider = MDXProvider;
1629
- </script>`);
1630
- }
1631
- }
1632
- return parts.join("\n");
1633
- }
1634
- function getCachedRuntime(options, config = {}) {
1635
- const cacheKey = generateCacheKey(options);
1636
- const cacheConfig = { ...DEFAULT_CACHE_CONFIG, ...config };
1637
- const cached = runtimeCache.get(cacheKey);
1638
- if (cached) {
1639
- if (cacheConfig.ttl === 0 || Date.now() - cached.cachedAt < cacheConfig.ttl) {
1640
- return {
1641
- vendorScript: cached.script,
1642
- appTemplate: buildAppTemplate(),
1643
- cdnImports: cached.cdnImports,
1644
- vendorSize: cached.size,
1645
- cached: true,
1646
- cacheKey
1647
- };
1648
- }
1649
- runtimeCache.delete(cacheKey);
1650
- }
1651
- const vendorParts = [];
1652
- if (options.includeBridge) {
1653
- vendorParts.push((0, import_runtime2.getMCPBridgeScript)());
1654
- }
1655
- vendorParts.push(buildStoreRuntime2(), buildRequireShim());
1656
- if (options.cdnType === "umd" || options.includeMarkdown) {
1657
- vendorParts.push(buildInlineMarkdownParser2(options));
1658
- }
1659
- vendorParts.push(buildRenderersRuntime2(options));
1660
- vendorParts.push(buildUIComponentsRuntime());
1661
- vendorParts.push(buildUniversalAppRuntime2());
1662
- let vendorScript = vendorParts.join("\n");
1663
- if (options.minify) {
1664
- vendorScript = minifyScript(vendorScript);
1665
- }
1666
- const cdnImports = buildCdnImports2(options);
1667
- const entry = {
1668
- script: vendorScript,
1669
- cdnImports,
1670
- size: vendorScript.length,
1671
- cacheKey,
1672
- cachedAt: Date.now()
1673
- };
1674
- if (runtimeCache.size >= cacheConfig.maxEntries) {
1675
- const oldestKey = runtimeCache.keys().next().value;
1676
- if (oldestKey) {
1677
- runtimeCache.delete(oldestKey);
1678
- }
1679
- }
1680
- runtimeCache.set(cacheKey, entry);
1681
- return {
1682
- vendorScript,
1683
- appTemplate: buildAppTemplate(),
1684
- cdnImports,
1685
- vendorSize: vendorScript.length,
1686
- cached: false,
1687
- cacheKey
1688
- };
1689
- }
1690
- function buildAppTemplate() {
1691
- return [buildCustomComponentsWrapper(), buildComponentWrapper(), buildDataInjectionWrapper()].join("\n");
1692
- }
1693
- function minifyScript(script) {
1694
- return script.replace(/\/\*[\s\S]*?\*\//g, "").replace(/^\s*\/\/[^\n]*$/gm, "").replace(/\n\s*\n/g, "\n").replace(/^\s+/gm, "").trim();
1695
- }
1696
- function clearRuntimeCache() {
1697
- runtimeCache.clear();
1698
- }
1699
- function getRuntimeCacheStats() {
1700
- let totalSize = 0;
1701
- const keys = [];
1702
- for (const [key, entry] of runtimeCache) {
1703
- keys.push(key);
1704
- totalSize += entry.size;
1705
- }
1706
- return {
1707
- entries: runtimeCache.size,
1708
- totalSize,
1709
- keys
1710
- };
1711
- }
1712
- function buildAppScript(appTemplate, componentCode, dataInjection, customComponents = "") {
1713
- return appTemplate.replace(RUNTIME_PLACEHOLDERS.CUSTOM_COMPONENTS, customComponents || "// No custom components").replace(RUNTIME_PLACEHOLDERS.COMPONENT_CODE, componentCode || "// No component code").replace(RUNTIME_PLACEHOLDERS.DATA_INJECTION, dataInjection);
1714
- }
1715
- var DEFAULT_OUTPUT_PLACEHOLDER = "__FRONTMCP_OUTPUT_PLACEHOLDER__";
1716
- var DEFAULT_INPUT_PLACEHOLDER = "__FRONTMCP_INPUT_PLACEHOLDER__";
1717
- function buildDataInjectionCode(toolName, input, output, structuredContent, contentType, source, hasComponent, options) {
1718
- const buildMode = options?.buildMode ?? "static";
1719
- const cdnType = options?.cdnType ?? "esm";
1720
- switch (buildMode) {
1721
- case "dynamic":
1722
- return buildDynamicDataInjectionCode(
1723
- toolName,
1724
- input,
1725
- output,
1726
- structuredContent,
1727
- contentType,
1728
- source,
1729
- hasComponent,
1730
- cdnType,
1731
- options?.dynamicOptions
1732
- );
1733
- case "hybrid":
1734
- return buildHybridDataInjectionCode(
1735
- toolName,
1736
- structuredContent,
1737
- contentType,
1738
- source,
1739
- hasComponent,
1740
- options?.hybridOptions
1741
- );
1742
- default:
1743
- return buildStaticDataInjectionCode(
1744
- toolName,
1745
- input,
1746
- output,
1747
- structuredContent,
1748
- contentType,
1749
- source,
1750
- hasComponent
1751
- );
1752
- }
1753
- }
1754
- function buildStaticDataInjectionCode(toolName, input, output, structuredContent, contentType, source, hasComponent) {
1755
- const safeJson = (value) => {
1756
- try {
1757
- return JSON.stringify(value);
1758
- } catch {
1759
- return "null";
1760
- }
1761
- };
1762
- if (hasComponent) {
1763
- return `
1764
- // Static Mode - Data baked at build time
1765
- window.__frontmcp.setState({
1766
- toolName: ${safeJson(toolName)},
1767
- input: ${safeJson(input ?? null)},
1768
- output: ${safeJson(output ?? null)},
1769
- structuredContent: ${safeJson(structuredContent ?? null)},
1770
- content: {
1771
- type: 'react',
1772
- source: window.__frontmcp_component
1773
- },
1774
- loading: false,
1775
- error: null
1776
- });`;
1777
- }
1778
- return `
1779
- // Static Mode - Data baked at build time
1780
- window.__frontmcp.setState({
1781
- toolName: ${safeJson(toolName)},
1782
- input: ${safeJson(input ?? null)},
1783
- output: ${safeJson(output ?? null)},
1784
- structuredContent: ${safeJson(structuredContent ?? null)},
1785
- content: {
1786
- type: ${safeJson(contentType)},
1787
- source: ${safeJson(source)}
1788
- },
1789
- loading: false,
1790
- error: null
1791
- });`;
1792
- }
1793
- function buildDynamicDataInjectionCode(toolName, input, output, structuredContent, contentType, source, hasComponent, cdnType, dynamicOptions) {
1794
- if (cdnType === "umd") {
1795
- return buildDynamicWithPlaceholdersCode(
1796
- toolName,
1797
- structuredContent,
1798
- contentType,
1799
- source,
1800
- hasComponent,
1801
- dynamicOptions
1802
- );
1803
- }
1804
- return buildDynamicWithSubscriptionCode(
1805
- toolName,
1806
- input,
1807
- output,
1808
- structuredContent,
1809
- contentType,
1810
- source,
1811
- hasComponent,
1812
- dynamicOptions
1813
- );
1814
- }
1815
- function buildDynamicWithPlaceholdersCode(toolName, structuredContent, contentType, source, hasComponent, dynamicOptions) {
1816
- const safeJson = (value) => {
1817
- try {
1818
- return JSON.stringify(value);
1819
- } catch {
1820
- return "null";
1821
- }
1822
- };
1823
- const outputPlaceholder = DEFAULT_OUTPUT_PLACEHOLDER;
1824
- const inputPlaceholder = DEFAULT_INPUT_PLACEHOLDER;
1825
- const includeInitialData = dynamicOptions?.includeInitialData ?? true;
1826
- const contentBlock = hasComponent ? `content: { type: 'react', source: window.__frontmcp_component }` : `content: { type: ${safeJson(contentType)}, source: ${safeJson(source)} }`;
1827
- return `
1828
- // Dynamic Mode - Placeholder-based for non-OpenAI platforms
1829
- var __outputRaw = "${outputPlaceholder}";
1830
- var __inputRaw = "${inputPlaceholder}";
1831
- var __output = null;
1832
- var __input = null;
1833
- var __error = null;
1834
- var __outputNotReplaced = false;
1835
- var __includeInitialData = ${includeInitialData};
1836
-
1837
- // Parse output placeholder
1838
- if (typeof __outputRaw === 'string' && __outputRaw !== "${outputPlaceholder}") {
1839
- try { __output = JSON.parse(__outputRaw); } catch (e) {
1840
- console.warn('[FrontMCP] Failed to parse output:', e);
1841
- __error = 'Failed to parse output data';
1842
- }
1843
- } else if (__outputRaw === "${outputPlaceholder}") {
1844
- __outputNotReplaced = true;
1845
- }
1846
-
1847
- // Parse input placeholder
1848
- if (typeof __inputRaw === 'string' && __inputRaw !== "${inputPlaceholder}") {
1849
- try { __input = JSON.parse(__inputRaw); } catch (e) { console.warn('[FrontMCP] Failed to parse input:', e); }
1850
- }
1851
-
1852
- // Handle placeholder not replaced - show error if expecting initial data
1853
- if (__outputNotReplaced && __includeInitialData) {
1854
- __error = 'No data provided. The output placeholder was not replaced.';
1855
- }
1856
-
1857
- window.__frontmcp.setState({
1858
- toolName: ${safeJson(toolName)},
1859
- input: __input,
1860
- output: __output,
1861
- structuredContent: ${safeJson(structuredContent ?? null)},
1862
- ${contentBlock},
1863
- loading: !__includeInitialData && __output === null && !__error,
1864
- error: __error
1865
- });`;
1866
- }
1867
- function buildDynamicWithSubscriptionCode(toolName, input, output, structuredContent, contentType, source, hasComponent, dynamicOptions) {
1868
- const safeJson = (value) => {
1869
- try {
1870
- return JSON.stringify(value);
1871
- } catch {
1872
- return "null";
1873
- }
1874
- };
1875
- const includeInitialData = dynamicOptions?.includeInitialData ?? true;
1876
- const subscribeToUpdates = dynamicOptions?.subscribeToUpdates ?? true;
1877
- const contentBlock = hasComponent ? `content: { type: 'react', source: window.__frontmcp_component }` : `content: { type: ${safeJson(contentType)}, source: ${safeJson(source)} }`;
1878
- const initialState = includeInitialData ? `{
1879
- toolName: ${safeJson(toolName)},
1880
- input: ${safeJson(input ?? null)},
1881
- output: ${safeJson(output ?? null)},
1882
- structuredContent: ${safeJson(structuredContent ?? null)},
1883
- ${contentBlock},
1884
- loading: false,
1885
- error: null
1886
- }` : `{
1887
- toolName: ${safeJson(toolName)},
1888
- input: ${safeJson(input ?? null)},
1889
- output: null,
1890
- structuredContent: ${safeJson(structuredContent ?? null)},
1891
- ${contentBlock},
1892
- loading: true,
1893
- error: null
1894
- }`;
1895
- const subscriptionBlock = subscribeToUpdates ? `
1896
- // Subscribe to platform tool result events
1897
- (function() {
1898
- function subscribeToUpdates() {
1899
- if (window.openai && window.openai.canvas && window.openai.canvas.onToolResult) {
1900
- window.openai.canvas.onToolResult(function(result) {
1901
- window.__frontmcp.updateOutput(result);
1902
- window.dispatchEvent(new CustomEvent('frontmcp:toolResult', { detail: result }));
1903
- });
1904
- }
1905
- }
1906
- if (document.readyState === 'loading') {
1907
- document.addEventListener('DOMContentLoaded', subscribeToUpdates);
1908
- } else {
1909
- subscribeToUpdates();
1910
- }
1911
- })();` : "";
1912
- return `
1913
- // Dynamic Mode - OpenAI Subscription
1914
- window.__frontmcp.setState(${initialState});
1915
- ${subscriptionBlock}`;
1916
- }
1917
- function buildHybridDataInjectionCode(toolName, structuredContent, contentType, source, hasComponent, hybridOptions) {
1918
- const safeJson = (value) => {
1919
- try {
1920
- return JSON.stringify(value);
1921
- } catch {
1922
- return "null";
1923
- }
1924
- };
1925
- const outputPlaceholder = hybridOptions?.placeholder ?? DEFAULT_OUTPUT_PLACEHOLDER;
1926
- const inputPlaceholder = hybridOptions?.inputPlaceholder ?? DEFAULT_INPUT_PLACEHOLDER;
1927
- const contentBlock = hasComponent ? `content: { type: 'react', source: window.__frontmcp_component }` : `content: { type: ${safeJson(contentType)}, source: ${safeJson(source)} }`;
1928
- return `
1929
- // Hybrid Mode - Placeholders replaced at runtime
1930
- var __outputRaw = "${outputPlaceholder}";
1931
- var __inputRaw = "${inputPlaceholder}";
1932
- var __output = null;
1933
- var __input = null;
1934
- var __error = null;
1935
- var __outputNotReplaced = false;
1936
-
1937
- // Parse output placeholder
1938
- if (typeof __outputRaw === 'string' && __outputRaw !== "${outputPlaceholder}") {
1939
- try { __output = JSON.parse(__outputRaw); } catch (e) {
1940
- console.warn('[FrontMCP] Failed to parse output:', e);
1941
- __error = 'Failed to parse output data';
1942
- }
1943
- } else if (__outputRaw === "${outputPlaceholder}") {
1944
- // Placeholder not replaced - no data was injected
1945
- __outputNotReplaced = true;
1946
- }
1947
-
1948
- // Parse input placeholder
1949
- if (typeof __inputRaw === 'string' && __inputRaw !== "${inputPlaceholder}") {
1950
- try { __input = JSON.parse(__inputRaw); } catch (e) { console.warn('[FrontMCP] Failed to parse input:', e); }
1951
- }
1952
-
1953
- // Set error if output placeholder was not replaced (no data provided)
1954
- if (__outputNotReplaced) {
1955
- __error = 'No data provided. The output placeholder was not replaced.';
1956
- }
1957
-
1958
- window.__frontmcp.setState({
1959
- toolName: ${safeJson(toolName)},
1960
- input: __input,
1961
- output: __output,
1962
- structuredContent: ${safeJson(structuredContent ?? null)},
1963
- ${contentBlock},
1964
- loading: false,
1965
- error: __error
1966
- });`;
1967
- }
1968
- function buildComponentCode(transpiledCode) {
1969
- return `
1970
- // CommonJS module shim
1971
- var module = { exports: {} };
1972
- var exports = module.exports;
1973
-
1974
- // Execute transpiled component
1975
- ${transpiledCode}
1976
-
1977
- // Capture component
1978
- window.__frontmcp_component = module.exports.default || module.exports;`;
1979
- }
1980
- // Annotate the CommonJS export names for ESM import in node:
1981
- 0 && (module.exports = {
1982
- ComponentsProvider,
1983
- DEFAULT_FRONTMCP_STATE,
1984
- EmptyState,
1985
- ErrorDisplay,
1986
- FrontMCPProvider,
1987
- LoadingSpinner,
1988
- RUNTIME_PLACEHOLDERS,
1989
- RendererRegistry,
1990
- UNIVERSAL_CDN,
1991
- UniversalApp,
1992
- UniversalAppWithProvider,
1993
- UniversalProvider,
1994
- buildAppScript,
1995
- buildComponentCode,
1996
- buildDataInjectionCode,
1997
- buildMinimalRuntime,
1998
- buildUniversalRuntime,
1999
- clearRuntimeCache,
2000
- createContent,
2001
- createFrontMCPStore,
2002
- createMarkdownRenderer,
2003
- createMdxRenderer,
2004
- createStoreSelector,
2005
- detectContentType,
2006
- detectRenderer,
2007
- getCachedRuntime,
2008
- getGlobalStore,
2009
- getRuntimeCacheStats,
2010
- htmlRenderer,
2011
- initializeStoreFromWindow,
2012
- isMdxSupported,
2013
- isReactComponent,
2014
- markdownRenderer,
2015
- mdxRenderer,
2016
- reactRenderer,
2017
- renderContent,
2018
- rendererRegistry,
2019
- resetGlobalStore,
2020
- safeHtmlRenderer,
2021
- setGlobalStore,
2022
- useComponents,
2023
- useContent,
2024
- useFrontMCPContext,
2025
- useFrontMCPContextSafe,
2026
- useFrontMCPStore,
2027
- useLoadingState,
2028
- useToolInput,
2029
- useToolName,
2030
- useToolOutput,
2031
- withFrontMCP
2032
- });