@mcp-use/inspector 20.0.0-beta.14 → 20.0.0-beta.16

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 (140) hide show
  1. package/README.md +2 -2
  2. package/dist/cdn/inspector.js +76909 -9272
  3. package/dist/cli.js +1 -1
  4. package/dist/server/cdn-shell.js +2 -2
  5. package/dist/server/{chunk-3XD7J5NX.js → chunk-FHC5ZGMM.js} +1 -1
  6. package/dist/server/{chunk-N3VXWLT6.js → chunk-QXOCY5ZE.js} +1 -1
  7. package/dist/server/{chunk-DLHO3Q42.js → chunk-R5ZEVRE5.js} +1 -1
  8. package/dist/server/cli.js +2 -2
  9. package/dist/server/index.js +3 -3
  10. package/dist/server/middleware.js +3 -3
  11. package/dist/server/version.js +1 -1
  12. package/dist/web/assets/index-BgHcVJO3.js +643 -0
  13. package/dist/web/index.html +2 -10
  14. package/package.json +4 -4
  15. package/dist/cdn/AnimatePresence-D1bZ5_-l.js +0 -394
  16. package/dist/cdn/ChatTab-D_2TXR3X.js +0 -6811
  17. package/dist/cdn/CheckboxIndicator-BjF73mGX.js +0 -252
  18. package/dist/cdn/ConnectionSettingsForm-BqH0PcZF.js +0 -929
  19. package/dist/cdn/ConnectionSettingsTab-Duhb1uQP.js +0 -151
  20. package/dist/cdn/ElicitationTab-PEmEDvC5.js +0 -655
  21. package/dist/cdn/FormContext-NtUiZclE.js +0 -135
  22. package/dist/cdn/InspectorContext-BBKCdfmK.js +0 -123
  23. package/dist/cdn/JSONDisplay-BJqMz7Ny.js +0 -324
  24. package/dist/cdn/ListTabHeader-DzmTtN1e.js +0 -89
  25. package/dist/cdn/MCPAppsDebugControls-w5NRWhlZ.js +0 -2174
  26. package/dist/cdn/ManufactOAuthCallback-ChbbjFIT.js +0 -31
  27. package/dist/cdn/MarkdownRenderer-BIsUE0bf.js +0 -3610
  28. package/dist/cdn/McpAppsViewPanel-B3_76u7O.js +0 -56
  29. package/dist/cdn/NotificationsTab-B7uebqMV.js +0 -290
  30. package/dist/cdn/OAuthCallback-CtLoXa3h.js +0 -58
  31. package/dist/cdn/PromptsTab-DpE0XLzk.js +0 -902
  32. package/dist/cdn/ResourcesTab-DQS24z5p.js +0 -566
  33. package/dist/cdn/SamplingTab-ZDeu0CjJ.js +0 -659
  34. package/dist/cdn/ServerMetadataTab-BM3VhSLf.js +0 -244
  35. package/dist/cdn/StatusIcon-Q3n3YRtE.js +0 -65
  36. package/dist/cdn/ToolsTab-LtviZSWA.js +0 -2045
  37. package/dist/cdn/ViewPreview-BwC_tbF_.js +0 -238
  38. package/dist/cdn/WidgetDebugContext-B6yoOVVV.js +0 -314
  39. package/dist/cdn/WidgetWrapper-BlbQAh_X.js +0 -12
  40. package/dist/cdn/basePath-B8HuhIMu.js +0 -25
  41. package/dist/cdn/bell-GrTZcnD2.js +0 -10
  42. package/dist/cdn/browser-DG2Z8392.js +0 -42
  43. package/dist/cdn/brush-CelVvMGp.js +0 -17
  44. package/dist/cdn/button-CB4uOoUV.js +0 -2509
  45. package/dist/cdn/card-BA-DQk-G.js +0 -41
  46. package/dist/cdn/cfWorker-Bxcs9rNe.js +0 -10799
  47. package/dist/cdn/checkbox-kwVa4gRX.js +0 -20
  48. package/dist/cdn/chunk-QUQL4437-XnDcYQEx.js +0 -1508
  49. package/dist/cdn/clock-YMF8Gtw5.js +0 -12
  50. package/dist/cdn/code-C8sN2OGR.js +0 -10
  51. package/dist/cdn/createLucideIcon-BONxC1L5.js +0 -213
  52. package/dist/cdn/dialog-CJGnC5Ag.js +0 -1028
  53. package/dist/cdn/dist-CHKts0NS.js +0 -2307
  54. package/dist/cdn/dist-CTJnCYmk.js +0 -616
  55. package/dist/cdn/external-link-Bo4lQxr1.js +0 -17
  56. package/dist/cdn/eye-pSGG7nvf.js +0 -29
  57. package/dist/cdn/folder-open-aM8CPtBO.js +0 -7
  58. package/dist/cdn/hash-DDs2vE1k.js +0 -33
  59. package/dist/cdn/history-BfUFpL1d.js +0 -17
  60. package/dist/cdn/index-browser-DO-sd0TA.js +0 -1853
  61. package/dist/cdn/info-BMkB68mB.js +0 -19
  62. package/dist/cdn/input-BCpgLXU1.js +0 -9654
  63. package/dist/cdn/inspector-settings-layout-0VDsjeqb.js +0 -4
  64. package/dist/cdn/label-A0UGV8FE.js +0 -60
  65. package/dist/cdn/loader-circle-BKRHJEB7.js +0 -7
  66. package/dist/cdn/manufact-auth-BQMHhbLV.js +0 -423
  67. package/dist/cdn/maximize-2-DdrB_spi.js +0 -21
  68. package/dist/cdn/maximize-hSOCz133.js +0 -21
  69. package/dist/cdn/message-square-D3tKB3uJ.js +0 -7
  70. package/dist/cdn/not-found-BajFyZpp.js +0 -32
  71. package/dist/cdn/play-B1leulYf.js +0 -7
  72. package/dist/cdn/providerMeta-CjGU4rID.js +0 -436
  73. package/dist/cdn/react-BDA-xrgK.js +0 -5421
  74. package/dist/cdn/react-BIs9pQ3H.js +0 -926
  75. package/dist/cdn/refresh-cw-CyvXrS91.js +0 -21
  76. package/dist/cdn/save-CmdEPUAm.js +0 -34
  77. package/dist/cdn/schemaHelpers-DTV38jGq.js +0 -16
  78. package/dist/cdn/select-CCFHjOGk.js +0 -2595
  79. package/dist/cdn/servers-Dd0Vcp81.js +0 -30
  80. package/dist/cdn/shared-CJVHJhag.js +0 -1700
  81. package/dist/cdn/sheet-oyq1mIyg.js +0 -2078
  82. package/dist/cdn/sparkles-CxeZpVtX.js +0 -23
  83. package/dist/cdn/spinner-Be1GlSGX.js +0 -15
  84. package/dist/cdn/square-check-big-C_4wbfwF.js +0 -10
  85. package/dist/cdn/switch-DHXEA_N5.js +0 -665
  86. package/dist/cdn/tabs-subtle-Dubd6Kj8.js +0 -788
  87. package/dist/cdn/telemetry-e4uEESP7.js +0 -208
  88. package/dist/cdn/textarea-CwmI8_uI.js +0 -14
  89. package/dist/cdn/trash-2-BhumJAFE.js +0 -25
  90. package/dist/cdn/useAriaLabelledBy-Cra6w3YY.js +0 -30
  91. package/dist/cdn/useCompositeItem-Dhnm-7el.js +0 -26
  92. package/dist/cdn/useConfig-Dw_6Ztzr.js +0 -235
  93. package/dist/cdn/useSavedRequests-mSIsDd4c.js +0 -51
  94. package/dist/cdn/useViewHostProps-BPApUBaM.js +0 -364
  95. package/dist/cdn/wrench-DvK20LUT.js +0 -7
  96. package/dist/cdn/x-EilKPiCX.js +0 -10
  97. package/dist/cdn/zap-0Wr9QO7N.js +0 -10
  98. package/dist/web/assets/AnimatePresence-FfDQQNFJ.js +0 -9
  99. package/dist/web/assets/ChatTab-BhoU_ges.js +0 -18
  100. package/dist/web/assets/ConnectionSettingsTab-vJcr7uI3.js +0 -1
  101. package/dist/web/assets/ElicitationTab-4my-wtXf.js +0 -1
  102. package/dist/web/assets/FormContext-sV-yByKz.js +0 -1
  103. package/dist/web/assets/ListTabHeader-CrGae306.js +0 -1
  104. package/dist/web/assets/MCPAppsDebugControls-Cd4s9mr1.js +0 -34
  105. package/dist/web/assets/ManufactOAuthCallback-CCRWJhuT.js +0 -1
  106. package/dist/web/assets/MarkdownRenderer-BUDZYHqm.js +0 -47
  107. package/dist/web/assets/McpAppsViewPanel-Cil7Fdy4.js +0 -1
  108. package/dist/web/assets/NotificationsTab-Bl3O5PRb.js +0 -1
  109. package/dist/web/assets/OAuthCallback-CceVgo-9.js +0 -1
  110. package/dist/web/assets/PromptsTab-8lSxb8x-.js +0 -15
  111. package/dist/web/assets/ResourcesTab-DtGfgsPv.js +0 -2
  112. package/dist/web/assets/SamplingTab-XC-DTfOo.js +0 -1
  113. package/dist/web/assets/ServerMetadataTab-C5d_dI3_.js +0 -1
  114. package/dist/web/assets/ToolsTab-DuHPXItY.js +0 -8
  115. package/dist/web/assets/ViewPreview-DXswO9q8.js +0 -1
  116. package/dist/web/assets/WidgetWrapper-cv_BM1bY.js +0 -1
  117. package/dist/web/assets/brush-DX0UZ_pI.js +0 -1
  118. package/dist/web/assets/button-C8Xa2k4x.js +0 -1
  119. package/dist/web/assets/checkbox-DAfdiGl1.js +0 -1
  120. package/dist/web/assets/code-B14rVdNt.js +0 -1
  121. package/dist/web/assets/createLucideIcon-BEHeJH0M.js +0 -1
  122. package/dist/web/assets/dist-C2Y1wkk6.js +0 -21
  123. package/dist/web/assets/index-tu5-QdSJ.js +0 -499
  124. package/dist/web/assets/input-C0OQCUZy.js +0 -1
  125. package/dist/web/assets/inspector-settings-layout-yjKRJDai.js +0 -1
  126. package/dist/web/assets/label-CI7JWQOo.js +0 -1
  127. package/dist/web/assets/maximize-2-Br1WQzT2.js +0 -1
  128. package/dist/web/assets/maximize-CJNgRe6S.js +0 -1
  129. package/dist/web/assets/react-CU_d2d5K.js +0 -1
  130. package/dist/web/assets/refresh-cw-B5iaAZKn.js +0 -1
  131. package/dist/web/assets/save-TM6fvNrt.js +0 -1
  132. package/dist/web/assets/schemaHelpers-DLNTQr_6.js +0 -1
  133. package/dist/web/assets/select-D6jzbLJn.js +0 -1
  134. package/dist/web/assets/shared-c1Yr-wvV.js +0 -1
  135. package/dist/web/assets/sparkles-BGYTDThM.js +0 -1
  136. package/dist/web/assets/tabs-subtle-CHvFXVIA.js +0 -1
  137. package/dist/web/assets/textarea-CRTXuRmE.js +0 -1
  138. package/dist/web/assets/useConfig-9UVqLmR_.js +0 -1
  139. package/dist/web/assets/useViewHostProps-BBoPQYEl.js +0 -1
  140. package/dist/web/assets/zap-BDWHCVHU.js +0 -1
@@ -1,2174 +0,0 @@
1
- import { s as e, t } from "./react-BIs9pQ3H.js";
2
- import { G as n, K as r, a as i, n as a, r as o, t as s } from "./input-BCpgLXU1.js";
3
- import { n as c, t as l } from "./createLucideIcon-BONxC1L5.js";
4
- import { U as u, t as d } from "./button-CB4uOoUV.js";
5
- import { _ as f, a as p, c as m, d as h, i as g, l as _, n as v, o as y, s as b, t as x, u as S, v as C } from "./sheet-oyq1mIyg.js";
6
- import { t as w } from "./label-A0UGV8FE.js";
7
- import { a as T, i as E, n as D, r as O, t as k } from "./select-CCFHjOGk.js";
8
- import { A, E as j, S as ee, T as M, a as N, b as P, c as te, i as F, l as ne, n as re, o as ie, r as ae, s as oe, t as se, w as I } from "./dialog-CJGnC5Ag.js";
9
- import { i as L, t as R } from "./browser-DG2Z8392.js";
10
- import { t as ce } from "./clock-YMF8Gtw5.js";
11
- import { t as le } from "./JSONDisplay-BJqMz7Ny.js";
12
- import { t as ue } from "./loader-circle-BKRHJEB7.js";
13
- import { t as de } from "./maximize-2-DdrB_spi.js";
14
- import { t as fe } from "./sparkles-CxeZpVtX.js";
15
- import { t as pe } from "./trash-2-BhumJAFE.js";
16
- import { t as me } from "./x-EilKPiCX.js";
17
- import { t as he } from "./switch-DHXEA_N5.js";
18
- import { n as z } from "./dist-CTJnCYmk.js";
19
- import { r as ge, s as _e } from "./WidgetDebugContext-B6yoOVVV.js";
20
- import { a as B } from "./dist-CHKts0NS.js";
21
- import { t as V } from "./textarea-CwmI8_uI.js";
22
- import { a as ve, i as ye, n as be, o as xe, r as Se } from "./useViewHostProps-BPApUBaM.js";
23
- var Ce = l("braces", [["path", {
24
- d: "M8 3H7a2 2 0 0 0-2 2v5a2 2 0 0 1-2 2 2 2 0 0 1 2 2v5c0 1.1.9 2 2 2h1",
25
- key: "ezmyqa"
26
- }], ["path", {
27
- d: "M16 21h1a2 2 0 0 0 2-2v-5c0-1.1.9-2 2-2a2 2 0 0 1-2-2V5a2 2 0 0 0-2-2h-1",
28
- key: "e1hn23"
29
- }]]), we = l("database", [
30
- ["ellipse", {
31
- cx: "12",
32
- cy: "5",
33
- rx: "9",
34
- ry: "3",
35
- key: "msslwz"
36
- }],
37
- ["path", {
38
- d: "M3 5V19A9 3 0 0 0 21 19V5",
39
- key: "1wlel7"
40
- }],
41
- ["path", {
42
- d: "M3 12A9 3 0 0 0 21 12",
43
- key: "mv7ke4"
44
- }]
45
- ]), Te = l("mouse-pointer-2", [["path", {
46
- d: "M4.037 4.688a.495.495 0 0 1 .651-.651l16 6.5a.5.5 0 0 1-.063.947l-6.124 1.58a2 2 0 0 0-1.438 1.435l-1.579 6.126a.5.5 0 0 1-.947.063z",
47
- key: "edeuup"
48
- }]]), Ee = l("picture-in-picture", [
49
- ["path", {
50
- d: "M2 10h6V4",
51
- key: "zwrco"
52
- }],
53
- ["path", {
54
- d: "m2 4 6 6",
55
- key: "ug085t"
56
- }],
57
- ["path", {
58
- d: "M21 10V7a2 2 0 0 0-2-2h-7",
59
- key: "git5jr"
60
- }],
61
- ["path", {
62
- d: "M3 14v2a2 2 0 0 0 2 2h3",
63
- key: "1f7fh3"
64
- }],
65
- ["rect", {
66
- x: "12",
67
- y: "14",
68
- width: "10",
69
- height: "7",
70
- rx: "1",
71
- key: "1wjs3o"
72
- }]
73
- ]), De = l("pointer", [
74
- ["path", {
75
- d: "M22 14a8 8 0 0 1-8 8",
76
- key: "56vcr3"
77
- }],
78
- ["path", {
79
- d: "M18 11v-1a2 2 0 0 0-2-2a2 2 0 0 0-2 2",
80
- key: "1agjmk"
81
- }],
82
- ["path", {
83
- d: "M14 10V9a2 2 0 0 0-2-2a2 2 0 0 0-2 2v1",
84
- key: "wdbh2u"
85
- }],
86
- ["path", {
87
- d: "M10 9.5V4a2 2 0 0 0-2-2a2 2 0 0 0-2 2v10",
88
- key: "1ibuk9"
89
- }],
90
- ["path", {
91
- d: "M18 11a2 2 0 1 1 4 0v3a8 8 0 0 1-8 8h-2c-2.8 0-4.5-.86-5.99-2.34l-3.6-3.6a2 2 0 0 1 2.83-2.82L7 15",
92
- key: "g6ys72"
93
- }]
94
- ]), Oe = l("shield-check", [["path", {
95
- d: "M20 13c0 5-3.5 7.5-7.66 8.95a1 1 0 0 1-.67-.01C7.5 20.5 4 18 4 13V6a1 1 0 0 1 1-1c2 0 4.5-1.2 6.24-2.72a1.17 1.17 0 0 1 1.52 0C14.51 3.81 17 5 19 5a1 1 0 0 1 1 1z",
96
- key: "oel41y"
97
- }], ["path", {
98
- d: "m9 12 2 2 4-4",
99
- key: "dzmm74"
100
- }]]), ke = l("shield-off", [
101
- ["path", {
102
- d: "m2 2 20 20",
103
- key: "1ooewy"
104
- }],
105
- ["path", {
106
- d: "M5 5a1 1 0 0 0-1 1v7c0 5 3.5 7.5 7.67 8.94a1 1 0 0 0 .67.01c2.35-.82 4.48-1.97 5.9-3.71",
107
- key: "1jlk70"
108
- }],
109
- ["path", {
110
- d: "M9.309 3.652A12.252 12.252 0 0 0 11.24 2.28a1.17 1.17 0 0 1 1.52 0C14.51 3.81 17 5 19 5a1 1 0 0 1 1 1v7a9.784 9.784 0 0 1-.08 1.264",
111
- key: "18rp1v"
112
- }]
113
- ]), Ae = l("smartphone", [["rect", {
114
- width: "14",
115
- height: "20",
116
- x: "5",
117
- y: "2",
118
- rx: "2",
119
- ry: "2",
120
- key: "1yt0o3"
121
- }], ["path", {
122
- d: "M12 18h.01",
123
- key: "mhygvu"
124
- }]]), je = l("square-dashed-mouse-pointer", [
125
- ["path", {
126
- d: "M12.034 12.681a.498.498 0 0 1 .647-.647l9 3.5a.5.5 0 0 1-.033.943l-3.444 1.068a1 1 0 0 0-.66.66l-1.067 3.443a.5.5 0 0 1-.943.033z",
127
- key: "xwnzip"
128
- }],
129
- ["path", {
130
- d: "M5 3a2 2 0 0 0-2 2",
131
- key: "y57alp"
132
- }],
133
- ["path", {
134
- d: "M19 3a2 2 0 0 1 2 2",
135
- key: "18rm91"
136
- }],
137
- ["path", {
138
- d: "M5 21a2 2 0 0 1-2-2",
139
- key: "sbafld"
140
- }],
141
- ["path", {
142
- d: "M9 3h1",
143
- key: "1yesri"
144
- }],
145
- ["path", {
146
- d: "M9 21h2",
147
- key: "1qve2z"
148
- }],
149
- ["path", {
150
- d: "M14 3h1",
151
- key: "1ec4yj"
152
- }],
153
- ["path", {
154
- d: "M3 9v1",
155
- key: "1r0deq"
156
- }],
157
- ["path", {
158
- d: "M21 9v2",
159
- key: "p14lih"
160
- }],
161
- ["path", {
162
- d: "M3 14v1",
163
- key: "vnatye"
164
- }]
165
- ]), H = l("terminal", [["path", {
166
- d: "M12 19h8",
167
- key: "baeox8"
168
- }], ["path", {
169
- d: "m4 17 6-6-6-6",
170
- key: "1yngyt"
171
- }]]), Me = l("trash", [
172
- ["path", {
173
- d: "M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6",
174
- key: "miytrc"
175
- }],
176
- ["path", {
177
- d: "M3 6h18",
178
- key: "d0wm0j"
179
- }],
180
- ["path", {
181
- d: "M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2",
182
- key: "e791ji"
183
- }]
184
- ]), U = /* @__PURE__ */ e(t(), 1), Ne = [
185
- {
186
- value: "en-US",
187
- label: "English (US)"
188
- },
189
- {
190
- value: "en-GB",
191
- label: "English (UK)"
192
- },
193
- {
194
- value: "en-CA",
195
- label: "English (Canada)"
196
- },
197
- {
198
- value: "en-AU",
199
- label: "English (Australia)"
200
- },
201
- {
202
- value: "en-IN",
203
- label: "English (India)"
204
- },
205
- {
206
- value: "es-ES",
207
- label: "Spanish (Spain)"
208
- },
209
- {
210
- value: "es-MX",
211
- label: "Spanish (Mexico)"
212
- },
213
- {
214
- value: "es-AR",
215
- label: "Spanish (Argentina)"
216
- },
217
- {
218
- value: "es-CO",
219
- label: "Spanish (Colombia)"
220
- },
221
- {
222
- value: "fr-FR",
223
- label: "French (France)"
224
- },
225
- {
226
- value: "fr-CA",
227
- label: "French (Canada)"
228
- },
229
- {
230
- value: "fr-BE",
231
- label: "French (Belgium)"
232
- },
233
- {
234
- value: "fr-CH",
235
- label: "French (Switzerland)"
236
- },
237
- {
238
- value: "de-DE",
239
- label: "German (Germany)"
240
- },
241
- {
242
- value: "de-AT",
243
- label: "German (Austria)"
244
- },
245
- {
246
- value: "de-CH",
247
- label: "German (Switzerland)"
248
- },
249
- {
250
- value: "pt-BR",
251
- label: "Portuguese (Brazil)"
252
- },
253
- {
254
- value: "pt-PT",
255
- label: "Portuguese (Portugal)"
256
- },
257
- {
258
- value: "zh-CN",
259
- label: "Chinese (Simplified, China)"
260
- },
261
- {
262
- value: "zh-TW",
263
- label: "Chinese (Traditional, Taiwan)"
264
- },
265
- {
266
- value: "zh-HK",
267
- label: "Chinese (Traditional, Hong Kong)"
268
- },
269
- {
270
- value: "ja-JP",
271
- label: "Japanese (Japan)"
272
- },
273
- {
274
- value: "ko-KR",
275
- label: "Korean (Korea)"
276
- },
277
- {
278
- value: "ar-SA",
279
- label: "Arabic (Saudi Arabia)"
280
- },
281
- {
282
- value: "ar-EG",
283
- label: "Arabic (Egypt)"
284
- },
285
- {
286
- value: "hi-IN",
287
- label: "Hindi (India)"
288
- },
289
- {
290
- value: "ru-RU",
291
- label: "Russian (Russia)"
292
- },
293
- {
294
- value: "it-IT",
295
- label: "Italian (Italy)"
296
- },
297
- {
298
- value: "nl-NL",
299
- label: "Dutch (Netherlands)"
300
- },
301
- {
302
- value: "nl-BE",
303
- label: "Dutch (Belgium)"
304
- },
305
- {
306
- value: "pl-PL",
307
- label: "Polish (Poland)"
308
- },
309
- {
310
- value: "sv-SE",
311
- label: "Swedish (Sweden)"
312
- },
313
- {
314
- value: "no-NO",
315
- label: "Norwegian (Norway)"
316
- },
317
- {
318
- value: "da-DK",
319
- label: "Danish (Denmark)"
320
- },
321
- {
322
- value: "fi-FI",
323
- label: "Finnish (Finland)"
324
- },
325
- {
326
- value: "tr-TR",
327
- label: "Turkish (Turkey)"
328
- },
329
- {
330
- value: "el-GR",
331
- label: "Greek (Greece)"
332
- },
333
- {
334
- value: "cs-CZ",
335
- label: "Czech (Czech Republic)"
336
- },
337
- {
338
- value: "hu-HU",
339
- label: "Hungarian (Hungary)"
340
- },
341
- {
342
- value: "ro-RO",
343
- label: "Romanian (Romania)"
344
- },
345
- {
346
- value: "th-TH",
347
- label: "Thai (Thailand)"
348
- },
349
- {
350
- value: "vi-VN",
351
- label: "Vietnamese (Vietnam)"
352
- },
353
- {
354
- value: "id-ID",
355
- label: "Indonesian (Indonesia)"
356
- },
357
- {
358
- value: "ms-MY",
359
- label: "Malay (Malaysia)"
360
- },
361
- {
362
- value: "tl-PH",
363
- label: "Tagalog (Philippines)"
364
- },
365
- {
366
- value: "he-IL",
367
- label: "Hebrew (Israel)"
368
- },
369
- {
370
- value: "uk-UA",
371
- label: "Ukrainian (Ukraine)"
372
- },
373
- {
374
- value: "bg-BG",
375
- label: "Bulgarian (Bulgaria)"
376
- },
377
- {
378
- value: "hr-HR",
379
- label: "Croatian (Croatia)"
380
- },
381
- {
382
- value: "sk-SK",
383
- label: "Slovak (Slovakia)"
384
- },
385
- {
386
- value: "sl-SI",
387
- label: "Slovenian (Slovenia)"
388
- },
389
- {
390
- value: "sr-RS",
391
- label: "Serbian (Serbia)"
392
- },
393
- {
394
- value: "bn-BD",
395
- label: "Bengali (Bangladesh)"
396
- },
397
- {
398
- value: "ta-IN",
399
- label: "Tamil (India)"
400
- },
401
- {
402
- value: "te-IN",
403
- label: "Telugu (India)"
404
- },
405
- {
406
- value: "mr-IN",
407
- label: "Marathi (India)"
408
- },
409
- {
410
- value: "ur-PK",
411
- label: "Urdu (Pakistan)"
412
- },
413
- {
414
- value: "fa-IR",
415
- label: "Persian (Iran)"
416
- },
417
- {
418
- value: "sw-KE",
419
- label: "Swahili (Kenya)"
420
- }
421
- ];
422
- function Pe() {
423
- return Intl.supportedValuesOf("timeZone").map((e) => ({
424
- value: e,
425
- label: e.replace(/_/g, " ")
426
- }));
427
- }
428
- var Fe = Pe(), W = (e) => `mcp-inspector-resource-props-${e}`;
429
- function Ie(e) {
430
- let [t, n] = (0, U.useState)([]), [r, i] = (0, U.useState)(null);
431
- return (0, U.useEffect)(() => {
432
- (() => {
433
- try {
434
- let t = W(e), r = localStorage.getItem(t);
435
- if (r) {
436
- let e = JSON.parse(r);
437
- n(e.presets || []), i(e.activePresetId || null);
438
- } else n([]), i(null);
439
- } catch (e) {
440
- console.error("[useResourceProps] Failed to load presets:", e), n([]), i(null);
441
- }
442
- })();
443
- }, [e]), (0, U.useEffect)(() => {
444
- let n = W(e), i = {
445
- presets: t,
446
- activePresetId: r
447
- };
448
- localStorage.setItem(n, JSON.stringify(i));
449
- }, [
450
- e,
451
- t,
452
- r
453
- ]), {
454
- presets: t,
455
- activePresetId: r,
456
- savePreset: (0, U.useCallback)((e) => {
457
- n((t) => {
458
- let n = t.findIndex((t) => t.id === e.id), r;
459
- return n >= 0 ? (r = [...t], r[n] = e) : r = [...t, e], r;
460
- });
461
- }, []),
462
- deletePreset: (0, U.useCallback)((e) => {
463
- n((t) => t.filter((t) => t.id !== e)), i((t) => t === e ? null : t);
464
- }, []),
465
- setActivePreset: (0, U.useCallback)((e) => {
466
- i(e);
467
- }, []),
468
- getActiveProps: (0, U.useCallback)(() => r && t.find((e) => e.id === r)?.props || null, [r, t])
469
- };
470
- }
471
- //#endregion
472
- //#region src/client/hooks/useIframeConsole.ts
473
- function G(e = {}) {
474
- let { enabled: t = !0, maxLogs: n = 1e3, proxyToPageConsole: r = !1 } = e, [i, a] = (0, U.useState)([]), [o, s] = (0, U.useState)(!1), c = (0, U.useRef)(0), l = (0, U.useCallback)((e) => {
475
- if (!t) return;
476
- let i = {
477
- ...e,
478
- id: `log-${++c.current}-${Date.now()}`
479
- };
480
- if (a((e) => [...e, i].slice(-n)), r) {
481
- let t = "[WIDGET CONSOLE]", n = e.args.map((e) => {
482
- if (typeof e == "object" && e) try {
483
- return JSON.stringify(e, null, 2);
484
- } catch {
485
- return String(e);
486
- }
487
- return e;
488
- });
489
- switch (e.level) {
490
- case "error":
491
- console.error(t, ...n);
492
- break;
493
- case "warn":
494
- console.warn(t, ...n);
495
- break;
496
- case "info":
497
- console.info(t, ...n);
498
- break;
499
- case "debug":
500
- console.debug(t, ...n);
501
- break;
502
- case "trace":
503
- console.trace(t, ...n);
504
- break;
505
- default: console.log(t, ...n);
506
- }
507
- }
508
- }, [
509
- t,
510
- n,
511
- r
512
- ]), u = (0, U.useCallback)(() => {
513
- a([]), c.current = 0;
514
- }, []);
515
- return (0, U.useEffect)(() => {
516
- if (!t) return;
517
- let e = (e) => {
518
- e.data && e.data.type === "iframe-console-log" && e.data.level && Array.isArray(e.data.args) && l({
519
- level: e.data.level,
520
- args: e.data.args,
521
- timestamp: e.data.timestamp || (/* @__PURE__ */ new Date()).toISOString(),
522
- url: e.data.url
523
- });
524
- };
525
- return window.addEventListener("message", e), () => {
526
- window.removeEventListener("message", e);
527
- };
528
- }, [t, l]), (0, U.useEffect)(() => {
529
- if (t) return xe.subscribe(l);
530
- }, [t, l]), {
531
- logs: i,
532
- addLog: l,
533
- clearLogs: u,
534
- isOpen: o,
535
- setIsOpen: s
536
- };
537
- }
538
- //#endregion
539
- //#region src/client/components/IframeConsole.tsx
540
- var K = c(), Le = 200, Re = .9;
541
- function q(e) {
542
- if (e === null) return "null";
543
- if (e === void 0) return "undefined";
544
- if (typeof e == "string") return e;
545
- if (typeof e == "object") try {
546
- return JSON.stringify(e, null, 2);
547
- } catch {
548
- return String(e);
549
- }
550
- return String(e);
551
- }
552
- function J(e) {
553
- if (e.length === 0) return [];
554
- let t = e[0];
555
- if (typeof t != "string" || !/%[oOdisfc]/.test(t)) return e.map(q);
556
- let n = e.slice(1), r = 0, i = "";
557
- for (let e = 0; e < t.length; e++) {
558
- let a = t[e];
559
- if (a === "%" && e + 1 < t.length) {
560
- let o = t[e + 1], s = n[r++];
561
- switch (o) {
562
- case "o":
563
- case "O":
564
- i += q(s), e++;
565
- break;
566
- case "s":
567
- i += s === void 0 ? "undefined" : String(s), e++;
568
- break;
569
- case "d":
570
- case "i":
571
- i += String(Number.parseInt(String(s ?? ""), 10) || 0), e++;
572
- break;
573
- case "f":
574
- i += String(Number.parseFloat(String(s ?? "")) || 0), e++;
575
- break;
576
- case "c":
577
- e++;
578
- break;
579
- default: i += a;
580
- }
581
- continue;
582
- }
583
- i += a;
584
- }
585
- let a = [i.trim()];
586
- for (; r < n.length;) a.push(q(n[r++]));
587
- return a.filter((e) => e.length > 0);
588
- }
589
- function ze({ level: e }) {
590
- return /* @__PURE__ */ (0, K.jsx)("span", {
591
- className: u("px-1.5 py-0.5 text-[11px] font-mono font-semibold rounded-full text-white shrink-0", {
592
- log: "bg-zinc-500",
593
- info: "bg-blue-500",
594
- warn: "bg-yellow-500",
595
- error: "bg-red-500",
596
- debug: "bg-purple-500",
597
- trace: "bg-gray-500"
598
- }[e]),
599
- children: e.toUpperCase()
600
- });
601
- }
602
- function Be({ log: e }) {
603
- let [t, n] = (0, U.useState)(!1), i = (0, U.useMemo)(() => {
604
- try {
605
- return new Date(e.timestamp).toLocaleTimeString();
606
- } catch {
607
- return "";
608
- }
609
- }, [e.timestamp]), a = (0, U.useMemo)(() => J(e.args), [e.args]), o = (0, U.useMemo)(() => {
610
- if (a.length === 0) return "";
611
- let e = a[0].replace(/\s*\n\s*/g, " ").trim();
612
- return (e.length > 120 ? e.slice(0, 120) + "…" : e) + (a.length > 1 ? ` +${a.length - 1}` : "");
613
- }, [a]), s = async (e) => {
614
- e.stopPropagation();
615
- try {
616
- await R(a.join("\n")), z.success("Copied to clipboard");
617
- } catch {
618
- z.error("Failed to copy");
619
- }
620
- }, c = u("font-mono text-xs border-b border-zinc-200 dark:border-zinc-800", e.level === "error" && "bg-red-50/30 dark:bg-red-950/10", e.level === "warn" && "bg-yellow-50/30 dark:bg-yellow-950/10"), l = u("cursor-pointer select-none", e.level === "error" && "hover:bg-red-50/50 dark:hover:bg-red-950/20", e.level === "warn" && "hover:bg-yellow-50/50 dark:hover:bg-yellow-950/20", e.level !== "error" && e.level !== "warn" && "hover:bg-zinc-100/70 dark:hover:bg-zinc-800/40");
621
- return /* @__PURE__ */ (0, K.jsxs)("div", {
622
- className: u(c, "group"),
623
- children: [/* @__PURE__ */ (0, K.jsxs)("div", {
624
- className: u("flex items-center gap-2 px-2 py-1.5", l),
625
- onClick: () => n((e) => !e),
626
- children: [
627
- /* @__PURE__ */ (0, K.jsx)("span", {
628
- className: "text-zinc-400 dark:text-zinc-500 shrink-0",
629
- children: t ? /* @__PURE__ */ (0, K.jsx)(A, { className: "size-3" }) : /* @__PURE__ */ (0, K.jsx)(r, { className: "size-3" })
630
- }),
631
- /* @__PURE__ */ (0, K.jsx)(ze, { level: e.level }),
632
- /* @__PURE__ */ (0, K.jsx)("span", {
633
- className: "text-zinc-500 dark:text-zinc-400 text-[10px] shrink-0",
634
- children: i
635
- }),
636
- !t && /* @__PURE__ */ (0, K.jsx)("span", {
637
- className: u("truncate text-[11px]", e.level === "error" && "text-red-700 dark:text-red-400", e.level === "warn" && "text-yellow-700 dark:text-yellow-400", e.level !== "error" && e.level !== "warn" && "text-zinc-700 dark:text-zinc-300"),
638
- children: o
639
- }),
640
- t && e.url && /* @__PURE__ */ (0, K.jsx)("span", {
641
- className: "text-zinc-400 dark:text-zinc-500 text-[10px] truncate flex-1",
642
- children: (() => {
643
- try {
644
- return new URL(e.url).pathname;
645
- } catch {
646
- return e.url;
647
- }
648
- })()
649
- }),
650
- t && /* @__PURE__ */ (0, K.jsx)("button", {
651
- onClick: s,
652
- "aria-label": "Copy log",
653
- className: "ml-auto shrink-0 opacity-0 group-hover:opacity-100 transition-opacity p-0.5 rounded text-zinc-400 hover:text-zinc-700 dark:hover:text-zinc-200",
654
- children: /* @__PURE__ */ (0, K.jsx)(L, { className: "size-3" })
655
- })
656
- ]
657
- }), t && /* @__PURE__ */ (0, K.jsx)("div", {
658
- className: "pl-8 pr-2 pb-2 select-text",
659
- children: a.map((t, n) => /* @__PURE__ */ (0, K.jsx)("pre", {
660
- className: u("whitespace-pre-wrap wrap-break-word text-[11px]", e.level === "error" && "text-red-700 dark:text-red-400", e.level === "warn" && "text-yellow-700 dark:text-yellow-400", e.level !== "error" && e.level !== "warn" && "text-zinc-700 dark:text-zinc-300"),
661
- children: t
662
- }, n))
663
- })]
664
- });
665
- }
666
- var Y = "mcp-inspector-console-proxy-enabled", Ve = "mcp-inspector-console-height", He = [
667
- "log",
668
- "info",
669
- "warn",
670
- "error",
671
- "debug",
672
- "trace"
673
- ], Ue = {
674
- log: "text-zinc-500",
675
- info: "text-blue-500",
676
- warn: "text-yellow-500",
677
- error: "text-red-500",
678
- debug: "text-purple-500",
679
- trace: "text-gray-500"
680
- };
681
- function We({ iframeId: e, enabled: t = !0 }) {
682
- let [r, s] = (0, U.useState)(() => {
683
- if (typeof window > "u") return !0;
684
- try {
685
- return localStorage.getItem(Y) === "true";
686
- } catch {
687
- return !0;
688
- }
689
- }), [c, l] = (0, U.useState)(() => {
690
- if (typeof window > "u") return 400;
691
- try {
692
- let e = localStorage.getItem(Ve);
693
- return e ? Math.max(Le, parseInt(e, 10)) : 400;
694
- } catch {
695
- return 400;
696
- }
697
- }), f = (0, U.useRef)(!1), m = (0, U.useCallback)((e) => {
698
- e.preventDefault(), f.current = !0;
699
- let t = (e) => {
700
- if (!f.current) return;
701
- let t = Math.floor(window.innerHeight * Re);
702
- l(Math.min(t, Math.max(Le, window.innerHeight - e.clientY)));
703
- }, n = () => {
704
- f.current = !1, window.removeEventListener("mousemove", t), window.removeEventListener("mouseup", n);
705
- };
706
- window.addEventListener("mousemove", t), window.addEventListener("mouseup", n);
707
- }, []);
708
- (0, U.useEffect)(() => {
709
- try {
710
- localStorage.setItem(Ve, String(c));
711
- } catch {}
712
- }, [c]);
713
- let [h, _] = (0, U.useState)("all"), [b, S] = (0, U.useState)(""), { logs: C, clearLogs: T, isOpen: E, setIsOpen: D } = G({
714
- enabled: t,
715
- proxyToPageConsole: r
716
- }), O = (0, U.useRef)(null);
717
- (0, U.useEffect)(() => {
718
- try {
719
- localStorage.setItem(Y, String(r));
720
- } catch {}
721
- }, [r]);
722
- let k = (0, U.useMemo)(() => {
723
- let e = {
724
- log: 0,
725
- info: 0,
726
- warn: 0,
727
- error: 0,
728
- debug: 0,
729
- trace: 0
730
- };
731
- for (let t of C) e[t.level]++;
732
- return e;
733
- }, [C]), A = k.error, j = k.warn, ee = k.log + k.info + k.debug + k.trace, M = C.length, N = (0, U.useMemo)(() => A > 0 ? "bg-red-500" : j > 0 ? "bg-yellow-500" : "bg-zinc-500", [
734
- A,
735
- j,
736
- ee
737
- ]), P = (0, U.useMemo)(() => {
738
- let e = h === "all" ? C : C.filter((e) => e.level === h), t = b.trim().toLowerCase();
739
- return t && (e = e.filter((e) => {
740
- let n = J(e.args).join(" ").toLowerCase(), r = (e.url ?? "").toLowerCase();
741
- return n.includes(t) || r.includes(t);
742
- })), e;
743
- }, [
744
- C,
745
- h,
746
- b
747
- ]);
748
- return (0, U.useEffect)(() => {
749
- E && !b && O.current && (O.current.scrollTop = O.current.scrollHeight);
750
- }, [
751
- P,
752
- E,
753
- b
754
- ]), /* @__PURE__ */ (0, K.jsxs)(x, {
755
- open: E,
756
- onOpenChange: D,
757
- children: [/* @__PURE__ */ (0, K.jsx)(y, {
758
- render: /* @__PURE__ */ (0, K.jsxs)(a, { children: [/* @__PURE__ */ (0, K.jsx)(i, {
759
- render: /* @__PURE__ */ (0, K.jsxs)(d, {
760
- variant: "outline",
761
- size: "sm",
762
- className: "relative bg-white/90 dark:bg-zinc-900/90 backdrop-blur-sm shadow-sm hover:bg-white dark:hover:bg-zinc-900",
763
- onClick: () => D(!0),
764
- children: [/* @__PURE__ */ (0, K.jsx)(H, { className: "size-4" }), M > 0 && /* @__PURE__ */ (0, K.jsx)("span", {
765
- className: u("ml-2 px-1.5 py-0.5 text-xs rounded-full text-white font-semibold", N),
766
- children: M
767
- })]
768
- }),
769
- nativeButton: !0
770
- }), /* @__PURE__ */ (0, K.jsx)(o, { children: /* @__PURE__ */ (0, K.jsxs)("div", {
771
- className: "text-xs space-y-1",
772
- children: [
773
- /* @__PURE__ */ (0, K.jsxs)("p", {
774
- className: "font-semibold",
775
- children: [
776
- M,
777
- " console ",
778
- M === 1 ? "log" : "logs"
779
- ]
780
- }),
781
- A > 0 && /* @__PURE__ */ (0, K.jsxs)("p", {
782
- className: "text-red-400",
783
- children: [
784
- A,
785
- " error",
786
- A === 1 ? "" : "s"
787
- ]
788
- }),
789
- j > 0 && /* @__PURE__ */ (0, K.jsxs)("p", {
790
- className: "text-yellow-400",
791
- children: [
792
- j,
793
- " warning",
794
- j === 1 ? "" : "s"
795
- ]
796
- }),
797
- ee > 0 && /* @__PURE__ */ (0, K.jsxs)("p", {
798
- className: "text-zinc-400",
799
- children: [ee, " info"]
800
- })
801
- ]
802
- }) })] }),
803
- nativeButton: !1
804
- }), /* @__PURE__ */ (0, K.jsxs)(v, {
805
- side: "bottom",
806
- className: "flex flex-col p-0 transition-none m-0 gap-0",
807
- style: { height: c },
808
- children: [
809
- /* @__PURE__ */ (0, K.jsx)("div", {
810
- className: "h-1.5 w-full shrink-0 cursor-ns-resize bg-zinc-200 dark:bg-zinc-700 hover:bg-zinc-300 dark:hover:bg-zinc-600 transition-colors",
811
- onMouseDown: m
812
- }),
813
- /* @__PURE__ */ (0, K.jsxs)(g, {
814
- className: "px-4 py-4 m-0 border-b border-zinc-200 dark:border-zinc-800 shrink-0",
815
- children: [/* @__PURE__ */ (0, K.jsxs)("div", {
816
- className: "flex items-center justify-between",
817
- children: [/* @__PURE__ */ (0, K.jsxs)(p, {
818
- className: "flex items-center gap-2",
819
- children: [
820
- /* @__PURE__ */ (0, K.jsx)(H, { className: "size-4" }),
821
- "Widget Console Logs",
822
- C.length > 0 && /* @__PURE__ */ (0, K.jsxs)("span", {
823
- className: "text-sm font-normal text-zinc-500 dark:text-zinc-400",
824
- children: [
825
- "(",
826
- C.length,
827
- " ",
828
- C.length === 1 ? "log" : "logs",
829
- ")"
830
- ]
831
- })
832
- ]
833
- }), /* @__PURE__ */ (0, K.jsxs)("div", {
834
- className: "flex items-center gap-4 pr-4",
835
- children: [/* @__PURE__ */ (0, K.jsxs)("div", {
836
- className: "flex items-center gap-2",
837
- children: [/* @__PURE__ */ (0, K.jsx)(he, {
838
- id: "proxy-console-toggle",
839
- checked: r,
840
- onCheckedChange: s
841
- }), /* @__PURE__ */ (0, K.jsx)(w, {
842
- htmlFor: "proxy-console-toggle",
843
- className: "text-sm font-normal cursor-pointer",
844
- children: "Proxy logs to page console"
845
- })]
846
- }), C.length > 0 && /* @__PURE__ */ (0, K.jsxs)(K.Fragment, { children: [/* @__PURE__ */ (0, K.jsxs)(d, {
847
- variant: "ghost",
848
- size: "sm",
849
- onClick: async () => {
850
- try {
851
- await R(P.map((e) => {
852
- let t = new Date(e.timestamp).toLocaleTimeString();
853
- return `[${e.level.toUpperCase()}] ${t}${e.url ? ` ${e.url}` : ""}\n${J(e.args).join("\n")}`;
854
- }).join("\n\n")), z.success(`Copied ${P.length} logs to clipboard`);
855
- } catch {
856
- z.error("Failed to copy logs to clipboard");
857
- }
858
- },
859
- className: "-my-2",
860
- children: [/* @__PURE__ */ (0, K.jsx)(L, { className: "size-4 mr-1" }), "Copy All"]
861
- }), /* @__PURE__ */ (0, K.jsxs)(d, {
862
- variant: "ghost",
863
- size: "sm",
864
- onClick: T,
865
- className: "-my-2",
866
- children: [/* @__PURE__ */ (0, K.jsx)(Me, { className: "size-4 mr-1" }), "Clear"]
867
- })] })]
868
- })]
869
- }), /* @__PURE__ */ (0, K.jsxs)("div", {
870
- className: "flex items-center gap-1 pt-1",
871
- children: [
872
- /* @__PURE__ */ (0, K.jsxs)("button", {
873
- onClick: () => _("all"),
874
- className: u("px-2 py-0.5 text-xs rounded font-medium transition-colors", h === "all" ? "bg-zinc-200 dark:bg-zinc-700 text-zinc-900 dark:text-zinc-100" : "text-zinc-500 dark:text-zinc-400 hover:bg-zinc-100 dark:hover:bg-zinc-800"),
875
- children: ["All", M > 0 && /* @__PURE__ */ (0, K.jsx)("span", {
876
- className: "ml-1 text-[10px] opacity-70",
877
- children: M
878
- })]
879
- }),
880
- He.map((e) => {
881
- let t = k[e];
882
- return /* @__PURE__ */ (0, K.jsxs)("button", {
883
- onClick: () => _(h === e ? "all" : e),
884
- className: u("px-2 py-0.5 text-xs rounded font-medium transition-colors", h === e ? "bg-zinc-200 dark:bg-zinc-700 text-zinc-900 dark:text-zinc-100" : "text-zinc-500 dark:text-zinc-400 hover:bg-zinc-100 dark:hover:bg-zinc-800"),
885
- children: [/* @__PURE__ */ (0, K.jsx)("span", {
886
- className: u(t > 0 && Ue[e]),
887
- children: e.charAt(0).toUpperCase() + e.slice(1)
888
- }), t > 0 && /* @__PURE__ */ (0, K.jsx)("span", {
889
- className: u("ml-1 text-[10px]", Ue[e]),
890
- children: t
891
- })]
892
- }, e);
893
- }),
894
- /* @__PURE__ */ (0, K.jsxs)("div", {
895
- className: "ml-auto flex items-center gap-1 relative",
896
- children: [
897
- /* @__PURE__ */ (0, K.jsx)(n, { className: "absolute left-2 size-3 text-zinc-400 dark:text-zinc-500 pointer-events-none" }),
898
- /* @__PURE__ */ (0, K.jsx)("input", {
899
- type: "text",
900
- placeholder: "Filter logs…",
901
- value: b,
902
- onChange: (e) => S(e.target.value),
903
- className: "pl-6 pr-6 py-0.5 text-xs rounded border border-zinc-200 dark:border-zinc-700 bg-white dark:bg-zinc-900 text-zinc-900 dark:text-zinc-100 placeholder-zinc-400 dark:placeholder-zinc-500 focus:outline-none focus:ring-1 focus:ring-zinc-400 dark:focus:ring-zinc-500 w-44"
904
- }),
905
- b && /* @__PURE__ */ (0, K.jsx)("button", {
906
- onClick: () => S(""),
907
- "aria-label": "Clear search",
908
- className: "absolute right-1.5 text-zinc-400 hover:text-zinc-600 dark:hover:text-zinc-300",
909
- children: /* @__PURE__ */ (0, K.jsx)(me, { className: "size-3" })
910
- })
911
- ]
912
- })
913
- ]
914
- })]
915
- }),
916
- /* @__PURE__ */ (0, K.jsx)("div", {
917
- ref: O,
918
- className: "flex-1 overflow-auto bg-zinc-50 dark:bg-zinc-950",
919
- children: P.length === 0 ? /* @__PURE__ */ (0, K.jsx)("div", {
920
- className: "flex items-center justify-center h-full text-zinc-500 dark:text-zinc-400",
921
- children: /* @__PURE__ */ (0, K.jsxs)("div", {
922
- className: "text-center",
923
- children: [
924
- /* @__PURE__ */ (0, K.jsx)(H, { className: "size-8 mx-auto mb-2 opacity-50" }),
925
- /* @__PURE__ */ (0, K.jsx)("p", {
926
- className: "text-sm",
927
- children: C.length === 0 ? "No console logs yet" : b ? `No logs match "${b}"` : "No logs match the current filter"
928
- }),
929
- /* @__PURE__ */ (0, K.jsx)("p", {
930
- className: "text-xs mt-1",
931
- children: C.length === 0 ? "Logs from iframes will appear here" : `${C.length} log${C.length === 1 ? "" : "s"} hidden by filter`
932
- })
933
- ]
934
- })
935
- }) : /* @__PURE__ */ (0, K.jsx)("div", { children: P.map((e) => /* @__PURE__ */ (0, K.jsx)(Be, { log: e }, e.id)) })
936
- })
937
- ]
938
- })]
939
- });
940
- }
941
- //#endregion
942
- //#region src/client/hooks/usePropsLLM.ts
943
- function Ge(e) {
944
- let t = e.trim(), n = t.match(/```(?:json)?\s*([\s\S]*?)```/);
945
- n && (t = n[1].trim());
946
- let r = t.indexOf("{");
947
- if (r < 0) return null;
948
- let i = 0;
949
- for (let e = r; e < t.length; e++) if (t[e] === "{") i++;
950
- else if (t[e] === "}" && (i--, i === 0)) try {
951
- return JSON.parse(t.slice(r, e + 1));
952
- } catch {
953
- return null;
954
- }
955
- return null;
956
- }
957
- function Ke({ llmConfig: e }) {
958
- return {
959
- generateProps: (0, U.useCallback)(async ({ resource: t, resourceAnnotations: n, propsSchema: r }) => {
960
- if (!e) throw Error("LLM config is not available");
961
- let i = t.mimeType || n?.mimeType || "unknown", a = t.description || n?.description || "N/A";
962
- if (r?.properties) {
963
- let n = Object.keys(r.properties).map((e) => {
964
- let t = r.properties[e], n = ` - ${e} (${t.type || "string"})`, i = t.description ? `: ${t.description}` : "", a = "";
965
- return t.type === "array" && t.items?.type === "object" && t.items?.properties && (a = ` — array of objects with keys: {${Object.keys(t.items.properties).join(", ")}}`), `${n}${a}${i}`;
966
- }).join("\n"), i = [{
967
- role: "system",
968
- content: "You are helping a developer configure props for a UI widget. The widget has a defined schema with specific props. Generate appropriate values for ONLY the props listed in the schema. Return ONLY a JSON object with these exact keys. For array props, each item must match the specified structure."
969
- }, {
970
- role: "user",
971
- content: `Widget: ${t.name || t.uri}
972
- Description: ${a}
973
-
974
- Props Schema:
975
- ${n}
976
-
977
- Generate appropriate default/example values for these props. Return ONLY a JSON object with the exact prop names as keys.
978
- Example: {"query": "example search term", "results": [{"fruit": "Apple", "color": "red"}]}`
979
- }], o = Ge(await B({
980
- config: {
981
- provider: e.provider,
982
- model: e.model,
983
- apiKey: e.apiKey,
984
- temperature: e.temperature,
985
- baseUrl: e.baseUrl
986
- },
987
- messages: i
988
- }));
989
- if (o) return Object.entries(o).map(([e, t]) => ({
990
- key: e,
991
- value: typeof t == "object" && t ? JSON.stringify(t) : String(t)
992
- }));
993
- throw Error("Could not parse props from LLM response");
994
- }
995
- let o = t.uri?.startsWith("ui://") || t.mimeType === "text/html;profile=mcp-app" || !!n?.ui, s = o ? "You are helping preview an MCP App widget in the inspector.\nGenerate sample tool result data (structuredContent) that the widget receives via useToolContext().\nReturn ONLY a JSON object with realistic sample data the widget needs to render — query strings, item arrays, IDs, labels, etc.\nDo NOT generate UI styling props like theme, width, height, or showFilters unless explicitly required.\nFor search/list widgets, always include the collection array (e.g. \"items\") with at least 2 sample entries." : "You are helping a developer configure props for a UI widget/resource.\nAnalyze the provided information and suggest appropriate props in key-value format.\nReturn ONLY a JSON object with key-value pairs, where both keys and values are strings.\nExample format: {\"theme\": \"dark\", \"width\": \"400\", \"title\": \"My Widget\"}", c = o ? `Widget: ${t.name || t.uri}
996
- Description: ${a}
997
-
998
- Generate sample structuredContent for previewing this widget in the inspector.
999
- Include every data field the widget likely reads from toolOutput (arrays must be non-empty).
1000
- Example for a fruit search widget: {"query": "apple", "items": [{"id": "apple", "name": "Apple"}, {"id": "banana", "name": "Banana"}]}
1001
- Return ONLY JSON.` : `Resource Information:
1002
- - URI: ${t.uri}
1003
- - Name: ${t.name || "N/A"}
1004
- - Type: ${i}
1005
- - Description: ${a}
1006
-
1007
- Based on this information, suggest 3-5 common customizable properties like theme, dimensions, colors, titles, or configuration options that would be useful for this type of resource. Keep it simple and practical.`, l = [{
1008
- role: "system",
1009
- content: s
1010
- }, {
1011
- role: "user",
1012
- content: c
1013
- }], u = await B({
1014
- config: {
1015
- provider: e.provider,
1016
- model: e.model,
1017
- apiKey: e.apiKey,
1018
- temperature: e.temperature,
1019
- baseUrl: e.baseUrl
1020
- },
1021
- messages: l
1022
- });
1023
- try {
1024
- let e = Ge(u);
1025
- if (e) return Object.entries(e).map(([e, t]) => ({
1026
- key: e,
1027
- value: typeof t == "object" && t ? JSON.stringify(t) : String(t)
1028
- }));
1029
- let t = u.split("\n"), n = [];
1030
- for (let e of t) {
1031
- let t = e.match(/^\s*["']?(\w+)["']?\s*[:=]\s*["']?(.+?)["']?\s*,?\s*$/);
1032
- t && n.push({
1033
- key: t[1].trim(),
1034
- value: t[2].trim().replace(/^["']|["']$/g, "")
1035
- });
1036
- }
1037
- if (n.length > 0) return n;
1038
- throw Error("Could not parse props from LLM response");
1039
- } catch (e) {
1040
- throw console.error("[usePropsLLM] Failed to parse LLM response:", e), Error(`Failed to parse props from LLM response: ${u.slice(0, 100)}...`);
1041
- }
1042
- }, [e]),
1043
- isAvailable: e !== null
1044
- };
1045
- }
1046
- //#endregion
1047
- //#region src/client/components/shared/SchemaFormField.tsx
1048
- function qe(e, t) {
1049
- if (!e?.$ref) return e;
1050
- let n = e.$ref;
1051
- if (n.startsWith("#/")) {
1052
- let r = n.substring(2).split("/"), i = t;
1053
- for (let t of r) if (i && typeof i == "object" && t in i) i = i[t];
1054
- else return console.warn(`Could not resolve $ref: ${n}`), e;
1055
- return i;
1056
- }
1057
- return e;
1058
- }
1059
- function Je(e, t) {
1060
- if (e.anyOf && Array.isArray(e.anyOf)) {
1061
- let n = e.anyOf.find((e) => e.type !== "null");
1062
- if (n) return {
1063
- ...qe(n, t),
1064
- nullable: !0
1065
- };
1066
- }
1067
- return e;
1068
- }
1069
- function Ye(e) {
1070
- return Array.isArray(e.enum) ? e.enum : null;
1071
- }
1072
- function X({ name: e, schema: t, value: n, onChange: r, required: i = !1, disabled: a = !1, rootSchema: o }) {
1073
- let c = o || t, l = Je(t, c);
1074
- l = qe(l, c);
1075
- let u = Ye(l), d = l.type === "string" && u !== null, f = l;
1076
- return f.type === "object" || f.type === "array" ? /* @__PURE__ */ (0, K.jsxs)("div", {
1077
- className: "space-y-2",
1078
- children: [
1079
- /* @__PURE__ */ (0, K.jsxs)(w, {
1080
- htmlFor: e,
1081
- className: "text-sm font-medium",
1082
- children: [e, i && /* @__PURE__ */ (0, K.jsx)("span", {
1083
- className: "text-red-500 ml-1",
1084
- children: "*"
1085
- })]
1086
- }),
1087
- /* @__PURE__ */ (0, K.jsx)(V, {
1088
- id: e,
1089
- value: n,
1090
- onChange: (e) => r(e.target.value),
1091
- placeholder: f?.description || f?.default ? JSON.stringify(f.default, null, 2) : `Enter ${e}`,
1092
- className: "min-h-[100px]",
1093
- disabled: a
1094
- }),
1095
- f?.description && /* @__PURE__ */ (0, K.jsx)("p", {
1096
- className: "text-xs text-gray-500 dark:text-gray-400",
1097
- children: f.description
1098
- })
1099
- ]
1100
- }) : d && u ? /* @__PURE__ */ (0, K.jsxs)("div", {
1101
- className: "space-y-2",
1102
- children: [
1103
- /* @__PURE__ */ (0, K.jsxs)(w, {
1104
- htmlFor: e,
1105
- className: "text-sm font-medium",
1106
- children: [e, i && /* @__PURE__ */ (0, K.jsx)("span", {
1107
- className: "text-red-500 ml-1",
1108
- children: "*"
1109
- })]
1110
- }),
1111
- /* @__PURE__ */ (0, K.jsxs)(k, {
1112
- value: n || "",
1113
- onValueChange: r,
1114
- disabled: a,
1115
- children: [/* @__PURE__ */ (0, K.jsx)(E, {
1116
- id: e,
1117
- className: "w-full",
1118
- children: /* @__PURE__ */ (0, K.jsx)(T, { placeholder: f.description || "Select an option" })
1119
- }), /* @__PURE__ */ (0, K.jsx)(D, { children: u.map((e, t) => /* @__PURE__ */ (0, K.jsx)(O, {
1120
- value: e,
1121
- children: f.enumNames?.[t] || e
1122
- }, e)) })]
1123
- }),
1124
- f.description && /* @__PURE__ */ (0, K.jsx)("p", {
1125
- className: "text-xs text-gray-500 dark:text-gray-400",
1126
- children: f.description
1127
- })
1128
- ]
1129
- }) : /* @__PURE__ */ (0, K.jsxs)("div", {
1130
- className: "space-y-2",
1131
- children: [
1132
- /* @__PURE__ */ (0, K.jsxs)(w, {
1133
- htmlFor: e,
1134
- className: "text-sm font-medium",
1135
- children: [e, i && /* @__PURE__ */ (0, K.jsx)("span", {
1136
- className: "text-red-500 ml-1",
1137
- children: "*"
1138
- })]
1139
- }),
1140
- /* @__PURE__ */ (0, K.jsx)(s, {
1141
- id: e,
1142
- value: n,
1143
- onChange: (e) => r(e.target.value),
1144
- placeholder: f?.description || (f?.default === void 0 ? `Enter ${e}` : String(f.default)),
1145
- type: f.type === "number" ? "number" : "text",
1146
- disabled: a
1147
- }),
1148
- f?.description && /* @__PURE__ */ (0, K.jsx)("p", {
1149
- className: "text-xs text-gray-500 dark:text-gray-400",
1150
- children: f.description
1151
- })
1152
- ]
1153
- });
1154
- }
1155
- //#endregion
1156
- //#region src/client/components/resources/PropsConfigDialog.tsx
1157
- function Xe({ open: e, onOpenChange: t, onSave: n, existingPresets: r, resource: i, resourceAnnotations: a, llmConfig: o, editingPreset: c }) {
1158
- let l = (0, U.useMemo)(() => {
1159
- let e = (e) => {
1160
- if (!e) return null;
1161
- if (e.type === "object" && e.properties) return e;
1162
- let t = e?.def?.shape ?? e?._def?.shape;
1163
- if (t && typeof t == "object") {
1164
- let e = {}, n = [], r = (e) => ({
1165
- ZodString: "string",
1166
- string: "string",
1167
- ZodNumber: "number",
1168
- number: "number",
1169
- ZodBoolean: "boolean",
1170
- boolean: "boolean",
1171
- ZodArray: "array",
1172
- array: "array",
1173
- ZodObject: "object",
1174
- object: "object"
1175
- })[e] || "string", i = (e) => e?.typeName ?? e?.type ?? "", a = (e) => {
1176
- let t = e?._def ?? e?.def ?? {}, n = e, a = i(t);
1177
- for (; a === "ZodOptional" || a === "ZodDefault" || a === "ZodNullable";) n = t.innerType ?? n, a = i(n?._def ?? n?.def ?? {});
1178
- let o = r(a);
1179
- if (o === "array") {
1180
- let e = n?._def?.type ?? n?.def?.element ?? n?.element;
1181
- if (e) {
1182
- let t = e._def ?? e.def ?? {};
1183
- if (r(i(t)) === "object") {
1184
- let n = t.shape ?? e._def?.shape ?? e.def?.shape ?? {};
1185
- return {
1186
- type: "array",
1187
- items: {
1188
- type: "object",
1189
- properties: Object.fromEntries(Object.entries(n).map(([e, t]) => [e, { type: r(i(t?._def ?? t?.def ?? {})) }]))
1190
- }
1191
- };
1192
- }
1193
- }
1194
- return { type: "array" };
1195
- }
1196
- return { type: o };
1197
- };
1198
- for (let [r, o] of Object.entries(t)) {
1199
- let t = o, s = t?._def ?? t?.def ?? {}, c = i(s), l = c === "ZodOptional" || c === "ZodDefault" || c === "ZodNullable", u = a(t);
1200
- e[r] = {
1201
- type: u.type,
1202
- ...u.items && { items: u.items },
1203
- description: t?.description ?? s.description
1204
- }, l || n.push(r);
1205
- }
1206
- if (Object.keys(e).length > 0) return {
1207
- type: "object",
1208
- properties: e,
1209
- required: n.length > 0 ? n : void 0
1210
- };
1211
- }
1212
- return null;
1213
- }, t = a;
1214
- if (t?.["mcp-use/propsSchema"]) return e(t["mcp-use/propsSchema"]);
1215
- let n = i.annotations;
1216
- return n?.["mcp-use/propsSchema"] ? e(n["mcp-use/propsSchema"]) : null;
1217
- }, [
1218
- a,
1219
- i.annotations,
1220
- i.uri,
1221
- i.name
1222
- ]), u = !!l, [f, p] = (0, U.useState)(""), [m, h] = (0, U.useState)({}), [g, _] = (0, U.useState)([{
1223
- id: crypto.randomUUID(),
1224
- key: "",
1225
- value: ""
1226
- }]), [v, y] = (0, U.useState)(!1), [b, x] = (0, U.useState)(null), { generateProps: S, isAvailable: C } = Ke({ llmConfig: o });
1227
- (0, U.useEffect)(() => {
1228
- if (e) {
1229
- if (c) if (p(c.name), u) h(c.props);
1230
- else {
1231
- let e = Object.entries(c.props).map(([e, t]) => ({
1232
- id: crypto.randomUUID(),
1233
- key: e,
1234
- value: t
1235
- }));
1236
- _(e.length > 0 ? e : [{
1237
- id: crypto.randomUUID(),
1238
- key: "",
1239
- value: ""
1240
- }]);
1241
- }
1242
- else p(""), u ? h({}) : _([{
1243
- id: crypto.randomUUID(),
1244
- key: "",
1245
- value: ""
1246
- }]);
1247
- x(null);
1248
- }
1249
- }, [
1250
- e,
1251
- c,
1252
- u
1253
- ]);
1254
- let T = () => {
1255
- _([...g, {
1256
- id: crypto.randomUUID(),
1257
- key: "",
1258
- value: ""
1259
- }]);
1260
- }, E = (e) => {
1261
- g.length > 1 && _(g.filter((t) => t.id !== e));
1262
- }, D = (e, t, n) => {
1263
- _(g.map((r) => r.id === e ? {
1264
- ...r,
1265
- [t]: n
1266
- } : r));
1267
- };
1268
- return /* @__PURE__ */ (0, K.jsx)(se, {
1269
- open: e,
1270
- onOpenChange: t,
1271
- children: /* @__PURE__ */ (0, K.jsxs)(ae, {
1272
- scrollable: !0,
1273
- className: "sm:max-w-[600px] max-h-[80vh]",
1274
- "data-testid": "props-config-dialog",
1275
- children: [
1276
- /* @__PURE__ */ (0, K.jsxs)(ie, { children: [/* @__PURE__ */ (0, K.jsx)(te, { children: c ? "Edit Preset" : "Create Props Preset" }), /* @__PURE__ */ (0, K.jsxs)(F, { children: [
1277
- "Configure props for ",
1278
- i.name || i.uri,
1279
- ". You can manually add key-value pairs or generate them with AI."
1280
- ] })] }),
1281
- /* @__PURE__ */ (0, K.jsxs)(re, {
1282
- className: "space-y-4 py-4",
1283
- children: [
1284
- /* @__PURE__ */ (0, K.jsxs)("div", {
1285
- className: "space-y-2",
1286
- children: [/* @__PURE__ */ (0, K.jsx)(w, {
1287
- htmlFor: "preset-name",
1288
- children: "Preset Name"
1289
- }), /* @__PURE__ */ (0, K.jsx)(s, {
1290
- id: "preset-name",
1291
- "data-testid": "props-config-preset-name",
1292
- value: f,
1293
- onChange: (e) => p(e.target.value),
1294
- placeholder: "e.g., Dark Theme, Production Config",
1295
- disabled: v
1296
- })]
1297
- }),
1298
- /* @__PURE__ */ (0, K.jsxs)("div", {
1299
- className: "space-y-2 p-3 bg-muted rounded-lg",
1300
- children: [
1301
- /* @__PURE__ */ (0, K.jsxs)("div", {
1302
- className: "flex items-center justify-between",
1303
- children: [/* @__PURE__ */ (0, K.jsx)(w, {
1304
- className: "text-sm font-medium",
1305
- children: "Generate with AI"
1306
- }), C && /* @__PURE__ */ (0, K.jsxs)("span", {
1307
- className: "text-xs text-muted-foreground",
1308
- children: [
1309
- "Using ",
1310
- o?.provider,
1311
- " (",
1312
- o?.model,
1313
- ")"
1314
- ]
1315
- })]
1316
- }),
1317
- C ? /* @__PURE__ */ (0, K.jsx)(d, {
1318
- onClick: async () => {
1319
- if (!C) {
1320
- z.error("LLM not configured", { description: "Please configure LLM in the Chat tab first." });
1321
- return;
1322
- }
1323
- y(!0), x(null);
1324
- try {
1325
- let e = await S({
1326
- resource: i,
1327
- resourceAnnotations: a,
1328
- propsSchema: u ? l : void 0
1329
- });
1330
- if (u) {
1331
- let t = {};
1332
- for (let n of e) l.properties?.[n.key] && (t[n.key] = n.value);
1333
- h(t);
1334
- } else _(e.map((e) => ({
1335
- id: crypto.randomUUID(),
1336
- key: e.key,
1337
- value: e.value
1338
- })));
1339
- z.success("Props generated successfully", { description: `Generated ${e.length} prop(s) using ${o?.provider}` });
1340
- } catch (e) {
1341
- let t = e instanceof Error ? e.message : "Failed to generate props";
1342
- x(t), z.error("LLM Generation Failed", { description: t });
1343
- } finally {
1344
- y(!1);
1345
- }
1346
- },
1347
- disabled: v,
1348
- size: "sm",
1349
- variant: "outline",
1350
- className: "w-full",
1351
- "data-testid": "props-config-generate-llm-button",
1352
- children: v ? /* @__PURE__ */ (0, K.jsxs)("span", {
1353
- "data-testid": "props-config-generating",
1354
- className: "flex items-center gap-2",
1355
- children: [/* @__PURE__ */ (0, K.jsx)(ue, { className: "h-4 w-4 mr-2 animate-spin" }), "Generating..."]
1356
- }) : /* @__PURE__ */ (0, K.jsxs)(K.Fragment, { children: [/* @__PURE__ */ (0, K.jsx)(fe, { className: "h-4 w-4 mr-2" }), "Generate Props with LLM"] })
1357
- }) : /* @__PURE__ */ (0, K.jsx)("p", {
1358
- className: "text-xs text-muted-foreground",
1359
- children: "LLM not configured. Please configure LLM in the Chat tab to use this feature."
1360
- }),
1361
- b && /* @__PURE__ */ (0, K.jsx)("p", {
1362
- className: "text-xs text-destructive",
1363
- "data-testid": "props-config-error",
1364
- children: b
1365
- })
1366
- ]
1367
- }),
1368
- /* @__PURE__ */ (0, K.jsxs)("div", {
1369
- className: "space-y-3",
1370
- children: [/* @__PURE__ */ (0, K.jsx)(w, {
1371
- className: "text-sm font-medium",
1372
- children: "Props"
1373
- }), u ? /* @__PURE__ */ (0, K.jsx)("div", {
1374
- className: "space-y-4",
1375
- children: Object.entries(l.properties || {}).map(([e, t]) => /* @__PURE__ */ (0, K.jsx)(X, {
1376
- name: e,
1377
- schema: t,
1378
- value: m[e] || "",
1379
- onChange: (t) => h((n) => ({
1380
- ...n,
1381
- [e]: t
1382
- })),
1383
- required: l.required?.includes(e),
1384
- disabled: v,
1385
- rootSchema: l
1386
- }, e))
1387
- }) : /* @__PURE__ */ (0, K.jsxs)(K.Fragment, { children: [/* @__PURE__ */ (0, K.jsx)("div", {
1388
- className: "flex items-center justify-between",
1389
- children: /* @__PURE__ */ (0, K.jsxs)(d, {
1390
- onClick: T,
1391
- size: "sm",
1392
- variant: "ghost",
1393
- disabled: v,
1394
- "data-testid": "props-config-add-prop",
1395
- children: [/* @__PURE__ */ (0, K.jsx)(I, { className: "h-4 w-4 mr-1" }), "Add Prop"]
1396
- })
1397
- }), g.map((e, t) => /* @__PURE__ */ (0, K.jsxs)("div", {
1398
- className: "flex items-center gap-2",
1399
- children: [/* @__PURE__ */ (0, K.jsxs)("div", {
1400
- className: "flex-1 grid grid-cols-2 gap-2",
1401
- children: [/* @__PURE__ */ (0, K.jsx)(s, {
1402
- placeholder: "Key",
1403
- value: e.key,
1404
- onChange: (t) => D(e.id, "key", t.target.value),
1405
- disabled: v,
1406
- "data-testid": `props-config-key-${t}`
1407
- }), /* @__PURE__ */ (0, K.jsx)(s, {
1408
- placeholder: "Value",
1409
- value: e.value,
1410
- onChange: (t) => D(e.id, "value", t.target.value),
1411
- disabled: v,
1412
- "data-testid": `props-config-value-${t}`
1413
- })]
1414
- }), /* @__PURE__ */ (0, K.jsx)(d, {
1415
- variant: "ghost",
1416
- size: "sm",
1417
- onClick: () => E(e.id),
1418
- disabled: g.length === 1 || v,
1419
- className: "h-9 w-9 p-0",
1420
- "data-testid": `props-config-remove-${t}`,
1421
- children: /* @__PURE__ */ (0, K.jsx)(pe, { className: "h-4 w-4 text-muted-foreground" })
1422
- })]
1423
- }, e.id))] })]
1424
- })
1425
- ]
1426
- }),
1427
- /* @__PURE__ */ (0, K.jsxs)(N, { children: [/* @__PURE__ */ (0, K.jsx)(d, {
1428
- variant: "outline",
1429
- onClick: () => t(!1),
1430
- disabled: v,
1431
- "data-testid": "props-config-cancel-button",
1432
- children: "Cancel"
1433
- }), /* @__PURE__ */ (0, K.jsxs)(d, {
1434
- onClick: () => {
1435
- if (!f.trim()) {
1436
- z.error("Preset name required", { description: "Please enter a name for this preset." });
1437
- return;
1438
- }
1439
- if (r.find((e) => e.name.toLowerCase() === f.toLowerCase() && e.id !== c?.id)) {
1440
- z.error("Duplicate preset name", { description: "A preset with this name already exists." });
1441
- return;
1442
- }
1443
- let e;
1444
- if (u) e = { ...m };
1445
- else {
1446
- e = {};
1447
- for (let t of g) t.key.trim() && (e[t.key.trim()] = t.value);
1448
- }
1449
- if (Object.keys(e).length === 0) {
1450
- z.error("No props defined", { description: "Please add at least one prop with a key." });
1451
- return;
1452
- }
1453
- let i = {
1454
- id: c?.id || crypto.randomUUID(),
1455
- name: f.trim(),
1456
- props: e
1457
- };
1458
- n(i), t(!1), z.success(c ? "Preset updated" : "Preset created", { description: `Preset "${i.name}" saved successfully.` });
1459
- },
1460
- disabled: v,
1461
- "data-testid": "props-config-save-button",
1462
- children: [c ? "Update" : "Create", " Preset"]
1463
- })] })
1464
- ]
1465
- })
1466
- });
1467
- }
1468
- //#endregion
1469
- //#region src/client/components/ui-playground/shared/SafeAreaInsetsEditor.tsx
1470
- function Ze({ value: e, onChange: t }) {
1471
- let n = (n, r) => {
1472
- let i = parseInt(r, 10);
1473
- isNaN(i) || t({
1474
- ...e,
1475
- [n]: i
1476
- });
1477
- };
1478
- return /* @__PURE__ */ (0, K.jsxs)("div", {
1479
- className: "grid grid-cols-2 gap-2",
1480
- children: [
1481
- /* @__PURE__ */ (0, K.jsxs)("div", {
1482
- className: "space-y-1",
1483
- children: [/* @__PURE__ */ (0, K.jsx)("label", {
1484
- className: "text-xs text-muted-foreground",
1485
- children: "Top"
1486
- }), /* @__PURE__ */ (0, K.jsx)(s, {
1487
- type: "number",
1488
- min: "0",
1489
- value: e.top,
1490
- onChange: (e) => n("top", e.target.value),
1491
- className: "h-8",
1492
- "data-testid": "debugger-safe-area-top"
1493
- })]
1494
- }),
1495
- /* @__PURE__ */ (0, K.jsxs)("div", {
1496
- className: "space-y-1",
1497
- children: [/* @__PURE__ */ (0, K.jsx)("label", {
1498
- className: "text-xs text-muted-foreground",
1499
- children: "Right"
1500
- }), /* @__PURE__ */ (0, K.jsx)(s, {
1501
- type: "number",
1502
- min: "0",
1503
- value: e.right,
1504
- onChange: (e) => n("right", e.target.value),
1505
- className: "h-8",
1506
- "data-testid": "debugger-safe-area-right"
1507
- })]
1508
- }),
1509
- /* @__PURE__ */ (0, K.jsxs)("div", {
1510
- className: "space-y-1",
1511
- children: [/* @__PURE__ */ (0, K.jsx)("label", {
1512
- className: "text-xs text-muted-foreground",
1513
- children: "Bottom"
1514
- }), /* @__PURE__ */ (0, K.jsx)(s, {
1515
- type: "number",
1516
- min: "0",
1517
- value: e.bottom,
1518
- onChange: (e) => n("bottom", e.target.value),
1519
- className: "h-8",
1520
- "data-testid": "debugger-safe-area-bottom"
1521
- })]
1522
- }),
1523
- /* @__PURE__ */ (0, K.jsxs)("div", {
1524
- className: "space-y-1",
1525
- children: [/* @__PURE__ */ (0, K.jsx)("label", {
1526
- className: "text-xs text-muted-foreground",
1527
- children: "Left"
1528
- }), /* @__PURE__ */ (0, K.jsx)(s, {
1529
- type: "number",
1530
- min: "0",
1531
- value: e.left,
1532
- onChange: (e) => n("left", e.target.value),
1533
- className: "h-8",
1534
- "data-testid": "debugger-safe-area-left"
1535
- })]
1536
- })
1537
- ]
1538
- });
1539
- }
1540
- //#endregion
1541
- //#region src/client/mcp-apps/debug/csp-suggestions.ts
1542
- function Qe(e, t) {
1543
- let n = new Set(t?.connectDomains ?? []), r = new Set(t?.resourceDomains ?? []), i = new Set(t?.frameDomains ?? []), a = new Set([
1544
- "script-src",
1545
- "style-src",
1546
- "img-src",
1547
- "font-src",
1548
- "media-src"
1549
- ]);
1550
- for (let t of e) {
1551
- let e = (t.blockedUri || "").trim();
1552
- if (!e || e === "(inline)" || e.startsWith("blob:") || e.startsWith("data:")) continue;
1553
- let o = null;
1554
- try {
1555
- o = new URL(e).origin;
1556
- } catch {
1557
- continue;
1558
- }
1559
- if (!o) continue;
1560
- let s = (t.effectiveDirective || t.directive || "").toLowerCase();
1561
- s === "connect-src" ? (n.add(o), o.startsWith("http://") ? n.add(o.replace("http://", "ws://")) : o.startsWith("https://") && n.add(o.replace("https://", "wss://"))) : a.has(s) ? r.add(o) : s === "frame-src" && i.add(o);
1562
- }
1563
- let o = {
1564
- connectDomains: Array.from(n).sort(),
1565
- resourceDomains: Array.from(r).sort()
1566
- };
1567
- return i.size > 0 && (o.frameDomains = Array.from(i).sort()), o;
1568
- }
1569
- var Z = "https://raw.githubusercontent.com/modelcontextprotocol/ext-apps/bcfffb6585ea4fb1e3a9da39fb8911b83399fa71/specification/2026-01-26/apps.mdx", $e = "https://mcp-use.com/docs/typescript/server/csp";
1570
- function et(e, t, n, r) {
1571
- let i = [
1572
- "Fix the Content Security Policy (CSP) for this MCP Apps widget. The widget has CSP violations that block network requests and resources.",
1573
- "",
1574
- "**References:**",
1575
- `- MCP Apps CSP spec: ${Z}`,
1576
- `- mcp-use CSP docs: ${$e}`,
1577
- ""
1578
- ];
1579
- if (i.push("**Current declared CSP:**"), e ? (i.push(`connectDomains: ${JSON.stringify(e.connectDomains ?? [])}`), i.push(`resourceDomains: ${JSON.stringify(e.resourceDomains ?? [])}`), i.push(`frameDomains: ${JSON.stringify(e.frameDomains ?? [])}`), i.push(`baseUriDomains: ${JSON.stringify(e.baseUriDomains ?? [])}`)) : i.push("No CSP declared."), i.push(""), t && (i.push("**Effective policy (originalPolicy):**"), i.push("```"), i.push(t), i.push("```"), i.push("")), n.length > 0) {
1580
- i.push(`**Blocked requests (${n.length}):**`);
1581
- for (let e of n) {
1582
- let t = e.effectiveDirective || e.directive, n = e.blockedUri || "(inline)";
1583
- i.push(`- ${t}: ${n}`);
1584
- }
1585
- i.push("");
1586
- }
1587
- return r ? (i.push("**Apply this CSP config to fix the violations:**"), i.push("Add these domains to the widget's CSP metadata (resource _meta.ui.csp). Use camelCase for MCP Apps (connectDomains, resourceDomains)."), i.push(""), i.push("```json"), i.push(JSON.stringify({
1588
- connectDomains: r.connectDomains,
1589
- resourceDomains: r.resourceDomains,
1590
- ...r.frameDomains?.length ? { frameDomains: r.frameDomains } : {}
1591
- }, null, 2)), i.push("```")) : i.push("No blocked requests - no fix needed."), i.join("\n");
1592
- }
1593
- //#endregion
1594
- //#region src/client/components/MCPAppsDebugControls.tsx
1595
- var Q = "__no_props__", $ = "__tool_props__", tt = "__create_preset__", nt = [{
1596
- value: "desktop",
1597
- label: "Desktop",
1598
- icon: j
1599
- }, {
1600
- value: "mobile",
1601
- label: "Mobile",
1602
- icon: Ae
1603
- }];
1604
- function rt({ options: e, value: t, onValueChange: n, placeholder: r, contentTestId: i, searchTestId: a, optionTestId: o, trigger: c }) {
1605
- let [l, u] = (0, U.useState)(!1), [d, f] = (0, U.useState)(""), p = (0, U.useRef)(null);
1606
- (0, U.useEffect)(() => {
1607
- if (!l) {
1608
- f("");
1609
- return;
1610
- }
1611
- let e = requestAnimationFrame(() => p.current?.focus());
1612
- return () => cancelAnimationFrame(e);
1613
- }, [l]);
1614
- let m = (0, U.useMemo)(() => {
1615
- let t = d.trim().toLowerCase();
1616
- return t ? e.filter((e) => e.label.toLowerCase().includes(t) || e.value.toLowerCase().includes(t)) : [...e];
1617
- }, [e, d]), g = m.findIndex((e) => e.value === t);
1618
- return /* @__PURE__ */ (0, K.jsxs)(S, {
1619
- open: l,
1620
- onOpenChange: u,
1621
- children: [c, /* @__PURE__ */ (0, K.jsxs)(h, {
1622
- "data-testid": i,
1623
- checkedIndex: g >= 0 ? g : void 0,
1624
- className: "w-80 overflow-hidden",
1625
- children: [/* @__PURE__ */ (0, K.jsx)("div", {
1626
- className: "border-b border-border p-2",
1627
- onKeyDown: (e) => e.stopPropagation(),
1628
- children: /* @__PURE__ */ (0, K.jsx)(s, {
1629
- ref: p,
1630
- value: d,
1631
- onChange: (e) => f(e.target.value),
1632
- placeholder: r,
1633
- "data-testid": a,
1634
- className: "h-8"
1635
- })
1636
- }), /* @__PURE__ */ (0, K.jsx)("div", {
1637
- className: "max-h-64 overflow-y-auto",
1638
- children: m.length === 0 ? /* @__PURE__ */ (0, K.jsx)("p", {
1639
- className: "px-3 py-4 text-xs text-muted-foreground",
1640
- children: "No results found."
1641
- }) : m.map((e, r) => /* @__PURE__ */ (0, K.jsx)(C, {
1642
- index: r,
1643
- label: e.label,
1644
- checked: t === e.value,
1645
- "data-testid": o(e.value),
1646
- onSelect: () => {
1647
- n(e.value), u(!1);
1648
- }
1649
- }, e.value))
1650
- })]
1651
- })]
1652
- });
1653
- }
1654
- function it({ displayMode: e, onDisplayModeChange: t, toolCallId: n, propsContext: s, resourceUri: c, toolInput: l, resourceAnnotations: u, llmConfig: p, resource: g, onPropsChange: v, requiredProps: y }) {
1655
- let { resolvedTheme: x, setTheme: w } = _e(), { playground: T, updatePlaygroundSettings: E, widgets: D, clearCspViolations: O } = ge(), k = D.get(n), N = k?.cspViolations ?? [], F = k?.declaredCsp, I = k?.effectivePolicy, ue = N.length > 0 ? Qe(N, F) : null, fe = N.length > 0 ? et(F, I, N, ue) : "", me = e === "fullscreen", he = e === "pip", { presets: B, activePresetId: V, savePreset: xe, deletePreset: we, setActivePreset: H, getActiveProps: Me } = Ie(c), [Pe, W] = (0, U.useState)(!1), G = !!y?.length && !V, [Le, Re] = (0, U.useState)(() => G);
1656
- (0, U.useEffect)(() => {
1657
- G && Re(!0);
1658
- }, [G]);
1659
- let [q, J] = (0, U.useState)(null), [ze, Be] = (0, U.useState)(!1), [Y, Ve] = (0, U.useState)("mode"), [He, Ue] = (0, U.useState)(!0), Ge = (0, U.useMemo)(() => ve(F), [F]), Ke = (0, U.useMemo)(() => ye(I), [I]), qe = (0, U.useMemo)(() => Se(Ge, Ke), [Ge, Ke]), Je = (0, U.useMemo)(() => be({
1660
- mode: T.cspMode,
1661
- declared: F,
1662
- effectivePolicy: I,
1663
- violations: N
1664
- }), [
1665
- T.cspMode,
1666
- F,
1667
- I,
1668
- N
1669
- ]), Ye = (0, U.useCallback)(() => s === "tool" && l ? $ : Q, [s, l]), [X, Z] = (0, U.useState)(Ye());
1670
- (0, U.useEffect)(() => {
1671
- V && s !== "tool" ? Z(V) : X !== Q && X !== $ && Z(Ye());
1672
- }, [
1673
- V,
1674
- X,
1675
- Ye,
1676
- s
1677
- ]), (0, U.useEffect)(() => {
1678
- if (v) {
1679
- if (X === Q || X === $) v(null);
1680
- else if (V && X === V) {
1681
- let e = Me();
1682
- e && v(e);
1683
- }
1684
- }
1685
- }, [
1686
- X,
1687
- V,
1688
- l,
1689
- Me,
1690
- v,
1691
- B
1692
- ]);
1693
- let $e = (e) => {
1694
- if (e === tt) {
1695
- J(null), W(!0);
1696
- return;
1697
- }
1698
- if (e === Q || e === $) H(null), Z(e), v?.(null);
1699
- else {
1700
- H(e), Z(e);
1701
- let t = B.find((t) => t.id === e);
1702
- v?.(t?.props ?? null);
1703
- }
1704
- }, it = (e) => {
1705
- xe(e), H(e.id), Z(e.id), v?.(e.props);
1706
- }, at = (e, t) => {
1707
- t.stopPropagation();
1708
- let n = B.find((t) => t.id === e);
1709
- n && (we(e), z.success("Preset deleted", { description: `Preset "${n.name}" has been deleted.` }));
1710
- }, ot = (e, t) => {
1711
- t.stopPropagation(), J(e), W(!0);
1712
- }, st = () => T.deviceType === "mobile" ? /* @__PURE__ */ (0, K.jsx)(Ae, { className: "size-3" }) : /* @__PURE__ */ (0, K.jsx)(j, { className: "size-3" }), ct = nt.findIndex((e) => e.value === T.deviceType);
1713
- return /* @__PURE__ */ (0, K.jsxs)("div", {
1714
- className: "flex items-center gap-2",
1715
- children: [
1716
- !me && !he && /* @__PURE__ */ (0, K.jsxs)(K.Fragment, { children: [/* @__PURE__ */ (0, K.jsxs)(a, { children: [/* @__PURE__ */ (0, K.jsx)(i, {
1717
- render: /* @__PURE__ */ (0, K.jsx)(d, {
1718
- "data-testid": "debugger-fullscreen-button",
1719
- variant: "outline",
1720
- size: "sm",
1721
- className: "bg-white/90 dark:bg-zinc-900/90 backdrop-blur-sm shadow-sm hover:bg-white dark:hover:bg-zinc-900",
1722
- onClick: () => t("fullscreen"),
1723
- children: /* @__PURE__ */ (0, K.jsx)(de, { className: "size-4" })
1724
- }),
1725
- nativeButton: !0
1726
- }), /* @__PURE__ */ (0, K.jsx)(o, { children: "Enter fullscreen mode" })] }), /* @__PURE__ */ (0, K.jsxs)(a, { children: [/* @__PURE__ */ (0, K.jsx)(i, {
1727
- render: /* @__PURE__ */ (0, K.jsx)(d, {
1728
- "data-testid": "debugger-pip-button",
1729
- variant: "outline",
1730
- size: "sm",
1731
- className: "bg-white/90 dark:bg-zinc-900/90 backdrop-blur-sm shadow-sm hover:bg-white dark:hover:bg-zinc-900",
1732
- onClick: () => t("pip"),
1733
- children: /* @__PURE__ */ (0, K.jsx)(Ee, { className: "size-4" })
1734
- }),
1735
- nativeButton: !0
1736
- }), /* @__PURE__ */ (0, K.jsx)(o, { children: "Picture-in-picture" })] })] }),
1737
- /* @__PURE__ */ (0, K.jsxs)(S, { children: [/* @__PURE__ */ (0, K.jsxs)(a, { children: [/* @__PURE__ */ (0, K.jsx)(i, {
1738
- render: /* @__PURE__ */ (0, K.jsx)(f, {
1739
- render: /* @__PURE__ */ (0, K.jsx)(d, {
1740
- "data-testid": "debugger-device-button",
1741
- variant: "outline",
1742
- size: "sm",
1743
- className: "h-8 w-8 p-0 bg-white/90 dark:bg-zinc-900/90 backdrop-blur-sm shadow-sm hover:bg-white dark:hover:bg-zinc-900",
1744
- children: st()
1745
- }),
1746
- nativeButton: !0
1747
- }),
1748
- nativeButton: !0
1749
- }), /* @__PURE__ */ (0, K.jsxs)(o, { children: ["Device: ", T.deviceType] })] }), /* @__PURE__ */ (0, K.jsx)(h, {
1750
- "data-testid": "debugger-device-dialog",
1751
- checkedIndex: ct >= 0 ? ct : void 0,
1752
- className: "w-56",
1753
- children: nt.map((e, t) => /* @__PURE__ */ (0, K.jsx)(C, {
1754
- index: t,
1755
- icon: e.icon,
1756
- label: e.label,
1757
- checked: T.deviceType === e.value,
1758
- "data-testid": `debugger-device-option-${e.value}`,
1759
- onSelect: () => E({ deviceType: e.value })
1760
- }, e.value))
1761
- })] }),
1762
- /* @__PURE__ */ (0, K.jsxs)(a, { children: [/* @__PURE__ */ (0, K.jsx)(i, {
1763
- render: /* @__PURE__ */ (0, K.jsx)(d, {
1764
- "data-testid": "debugger-theme-button",
1765
- variant: "outline",
1766
- size: "sm",
1767
- className: "h-8 w-8 p-0 bg-white/90 dark:bg-zinc-900/90 backdrop-blur-sm shadow-sm hover:bg-white dark:hover:bg-zinc-900",
1768
- onClick: () => {
1769
- w(x === "dark" ? "light" : "dark");
1770
- },
1771
- children: x === "dark" ? /* @__PURE__ */ (0, K.jsx)(M, { className: "size-3.5" }) : /* @__PURE__ */ (0, K.jsx)(P, { className: "size-3.5" })
1772
- }),
1773
- nativeButton: !0
1774
- }), /* @__PURE__ */ (0, K.jsxs)(o, { children: ["Theme: ", x === "dark" ? "Dark" : "Light"] })] }),
1775
- /* @__PURE__ */ (0, K.jsx)(rt, {
1776
- options: Ne,
1777
- value: T.locale,
1778
- onValueChange: (e) => E({ locale: e }),
1779
- placeholder: "Search locales...",
1780
- contentTestId: "debugger-locale-dialog",
1781
- searchTestId: "debugger-locale-search",
1782
- optionTestId: (e) => `debugger-locale-option-${e}`,
1783
- trigger: /* @__PURE__ */ (0, K.jsxs)(a, { children: [/* @__PURE__ */ (0, K.jsx)(i, {
1784
- render: /* @__PURE__ */ (0, K.jsx)(f, {
1785
- render: /* @__PURE__ */ (0, K.jsx)(d, {
1786
- "data-testid": "debugger-locale-button",
1787
- variant: "outline",
1788
- size: "sm",
1789
- className: "h-8 min-w-[50px] px-2 bg-white/90 dark:bg-zinc-900/90 backdrop-blur-sm shadow-sm hover:bg-white dark:hover:bg-zinc-900",
1790
- children: /* @__PURE__ */ (0, K.jsx)("span", {
1791
- className: "text-xs font-mono",
1792
- children: T.locale
1793
- })
1794
- }),
1795
- nativeButton: !0
1796
- }),
1797
- nativeButton: !0
1798
- }), /* @__PURE__ */ (0, K.jsx)(o, { children: "Locale" })] })
1799
- }),
1800
- /* @__PURE__ */ (0, K.jsx)(rt, {
1801
- options: Fe,
1802
- value: T.timeZone,
1803
- onValueChange: (e) => E({ timeZone: e }),
1804
- placeholder: "Search timezones...",
1805
- contentTestId: "debugger-timezone-dialog",
1806
- searchTestId: "debugger-timezone-search",
1807
- optionTestId: (e) => `debugger-timezone-option-${e.replace(/\//g, "-")}`,
1808
- trigger: /* @__PURE__ */ (0, K.jsxs)(a, { children: [/* @__PURE__ */ (0, K.jsx)(i, {
1809
- render: /* @__PURE__ */ (0, K.jsx)(f, {
1810
- render: /* @__PURE__ */ (0, K.jsx)(d, {
1811
- "data-testid": "debugger-timezone-button",
1812
- variant: "outline",
1813
- size: "sm",
1814
- className: "h-8 w-8 p-0 bg-white/90 dark:bg-zinc-900/90 backdrop-blur-sm shadow-sm hover:bg-white dark:hover:bg-zinc-900",
1815
- children: /* @__PURE__ */ (0, K.jsx)(ce, { className: "size-3.5" })
1816
- }),
1817
- nativeButton: !0
1818
- }),
1819
- nativeButton: !0
1820
- }), /* @__PURE__ */ (0, K.jsxs)(o, { children: ["Timezone: ", T.timeZone] })] })
1821
- }),
1822
- /* @__PURE__ */ (0, K.jsxs)(se, {
1823
- open: ze,
1824
- onOpenChange: Be,
1825
- children: [/* @__PURE__ */ (0, K.jsxs)(a, { children: [/* @__PURE__ */ (0, K.jsx)(i, {
1826
- render: /* @__PURE__ */ (0, K.jsx)(ne, {
1827
- render: /* @__PURE__ */ (0, K.jsxs)(d, {
1828
- "data-testid": "debugger-csp-button",
1829
- variant: "outline",
1830
- size: "sm",
1831
- className: "relative h-8 w-8 p-0 bg-white/90 dark:bg-zinc-900/90 backdrop-blur-sm shadow-sm hover:bg-white dark:hover:bg-zinc-900",
1832
- children: [T.cspMode === "permissive" ? /* @__PURE__ */ (0, K.jsx)(ke, { className: "size-3.5" }) : /* @__PURE__ */ (0, K.jsx)(Oe, { className: "size-3.5" }), N.length > 0 && /* @__PURE__ */ (0, K.jsx)("span", {
1833
- className: `absolute -top-1.5 -right-1.5 flex h-4 min-w-4 items-center justify-center rounded-full px-0.5 text-[9px] font-bold text-white leading-none ${T.cspMode === "permissive" ? "bg-yellow-500" : "bg-red-500"}`,
1834
- children: N.length > 99 ? "99+" : N.length
1835
- })]
1836
- }),
1837
- nativeButton: !0
1838
- }),
1839
- nativeButton: !0
1840
- }), /* @__PURE__ */ (0, K.jsxs)(o, { children: [
1841
- "CSP:",
1842
- " ",
1843
- T.cspMode === "permissive" ? "Permissive" : "Declared",
1844
- N.length > 0 && ` · ${N.length} ${T.cspMode === "permissive" ? "would be blocked" : "blocked"}`
1845
- ] })] }), /* @__PURE__ */ (0, K.jsxs)(ae, {
1846
- scrollable: !0,
1847
- className: "sm:max-w-[520px] max-h-[85vh]",
1848
- "data-testid": "debugger-csp-dialog",
1849
- children: [/* @__PURE__ */ (0, K.jsx)(ie, { children: /* @__PURE__ */ (0, K.jsx)(te, { children: "CSP Mode" }) }), /* @__PURE__ */ (0, K.jsxs)(re, {
1850
- className: "space-y-3",
1851
- children: [
1852
- /* @__PURE__ */ (0, K.jsx)("div", {
1853
- role: "tablist",
1854
- "aria-label": "CSP diagnostics",
1855
- className: "grid grid-cols-3 rounded-md border border-zinc-200 dark:border-zinc-700 p-1",
1856
- children: [
1857
- ["mode", "Mode"],
1858
- ["diff", "Policy Diff"],
1859
- ["findings", "Findings"]
1860
- ].map(([e, t]) => /* @__PURE__ */ (0, K.jsx)("button", {
1861
- type: "button",
1862
- role: "tab",
1863
- "aria-selected": Y === e,
1864
- onClick: () => Ve(e),
1865
- className: `rounded px-2 py-1.5 text-xs font-medium ${Y === e ? "bg-zinc-100 dark:bg-zinc-800" : "text-muted-foreground"}`,
1866
- children: t
1867
- }, e))
1868
- }),
1869
- Y === "mode" && /* @__PURE__ */ (0, K.jsxs)("div", {
1870
- role: "tabpanel",
1871
- className: "space-y-2",
1872
- children: [
1873
- /* @__PURE__ */ (0, K.jsxs)(d, {
1874
- "data-testid": "debugger-csp-option-permissive",
1875
- variant: T.cspMode === "permissive" ? "default" : "outline",
1876
- className: "w-full justify-start",
1877
- onClick: () => E({ cspMode: "permissive" }),
1878
- children: [/* @__PURE__ */ (0, K.jsx)(ke, { className: "size-4 mr-2" }), "Permissive"]
1879
- }),
1880
- /* @__PURE__ */ (0, K.jsxs)(d, {
1881
- "data-testid": "debugger-csp-option-widget-declared",
1882
- variant: T.cspMode === "widget-declared" ? "default" : "outline",
1883
- className: "w-full justify-start",
1884
- onClick: () => E({ cspMode: "widget-declared" }),
1885
- children: [/* @__PURE__ */ (0, K.jsx)(Oe, { className: "size-4 mr-2" }), "Widget-Declared"]
1886
- }),
1887
- /* @__PURE__ */ (0, K.jsx)("p", {
1888
- className: "text-xs text-muted-foreground",
1889
- children: "Permissive records would-be blocks; Widget-Declared enforces the resource metadata policy."
1890
- })
1891
- ]
1892
- }),
1893
- Y === "diff" && /* @__PURE__ */ (0, K.jsxs)("div", {
1894
- role: "tabpanel",
1895
- className: "space-y-2",
1896
- children: [qe.length ? /* @__PURE__ */ (0, K.jsx)("div", {
1897
- className: "max-h-64 overflow-y-auto rounded border border-zinc-200 dark:border-zinc-700",
1898
- children: qe.map((e) => /* @__PURE__ */ (0, K.jsxs)("div", {
1899
- className: "border-b border-zinc-100 dark:border-zinc-800 p-2 text-xs last:border-0",
1900
- children: [/* @__PURE__ */ (0, K.jsxs)("div", {
1901
- className: "flex items-center justify-between",
1902
- children: [/* @__PURE__ */ (0, K.jsx)("code", { children: e.directive }), /* @__PURE__ */ (0, K.jsx)("span", {
1903
- className: "text-[10px] uppercase text-muted-foreground",
1904
- children: e.status
1905
- })]
1906
- }), /* @__PURE__ */ (0, K.jsxs)("div", {
1907
- className: "mt-1 font-mono text-[10px] text-muted-foreground break-all",
1908
- children: [
1909
- "requested: ",
1910
- e.requested.join(" ") || "—",
1911
- /* @__PURE__ */ (0, K.jsx)("br", {}),
1912
- "effective: ",
1913
- e.effective.join(" ") || "—"
1914
- ]
1915
- })]
1916
- }, e.directive))
1917
- }) : /* @__PURE__ */ (0, K.jsx)("p", {
1918
- className: "text-xs text-muted-foreground",
1919
- children: "No requested or effective policy data yet."
1920
- }), I && /* @__PURE__ */ (0, K.jsxs)(d, {
1921
- variant: "outline",
1922
- size: "sm",
1923
- onClick: async () => {
1924
- try {
1925
- await R(I), z.success("Policy copied to clipboard");
1926
- } catch {
1927
- z.error("Failed to copy");
1928
- }
1929
- },
1930
- children: [/* @__PURE__ */ (0, K.jsx)(L, { className: "size-3.5 mr-2" }), "Copy effective policy"]
1931
- })]
1932
- }),
1933
- Y === "findings" && /* @__PURE__ */ (0, K.jsxs)("div", {
1934
- role: "tabpanel",
1935
- className: "space-y-2",
1936
- children: [/* @__PURE__ */ (0, K.jsx)("div", {
1937
- className: "space-y-1.5",
1938
- children: Je.map((e, t) => /* @__PURE__ */ (0, K.jsxs)("div", {
1939
- className: "rounded border border-zinc-200 dark:border-zinc-700 p-2",
1940
- children: [/* @__PURE__ */ (0, K.jsx)("div", {
1941
- className: "text-xs font-medium",
1942
- children: e.title
1943
- }), /* @__PURE__ */ (0, K.jsx)("div", {
1944
- className: "text-[11px] text-muted-foreground break-all",
1945
- children: e.detail
1946
- })]
1947
- }, `${e.title}-${t}`))
1948
- }), N.length > 0 && /* @__PURE__ */ (0, K.jsxs)(K.Fragment, { children: [/* @__PURE__ */ (0, K.jsxs)("div", {
1949
- className: "flex items-center justify-between",
1950
- children: [/* @__PURE__ */ (0, K.jsxs)("span", {
1951
- className: "text-xs font-medium",
1952
- children: [
1953
- N.length,
1954
- " observed request",
1955
- N.length === 1 ? "" : "s"
1956
- ]
1957
- }), /* @__PURE__ */ (0, K.jsx)("button", {
1958
- className: "text-xs text-muted-foreground underline",
1959
- onClick: () => O(n),
1960
- children: "Clear"
1961
- })]
1962
- }), /* @__PURE__ */ (0, K.jsxs)("div", {
1963
- className: "border border-amber-200 dark:border-amber-800 rounded-md overflow-hidden",
1964
- children: [/* @__PURE__ */ (0, K.jsxs)("div", {
1965
- className: "flex items-center justify-between bg-amber-50 dark:bg-amber-950/30 px-3 py-2",
1966
- children: [/* @__PURE__ */ (0, K.jsxs)("button", {
1967
- type: "button",
1968
- className: "flex items-center gap-2 text-xs font-medium text-amber-800 dark:text-amber-200",
1969
- onClick: () => Ue((e) => !e),
1970
- children: [He ? /* @__PURE__ */ (0, K.jsx)(A, { className: "size-3.5" }) : /* @__PURE__ */ (0, K.jsx)(r, { className: "size-3.5" }), "Prompt for Agents"]
1971
- }), /* @__PURE__ */ (0, K.jsx)(d, {
1972
- variant: "ghost",
1973
- size: "sm",
1974
- className: "h-7 w-7 p-0",
1975
- onClick: () => void R(fe),
1976
- "aria-label": "Copy prompt for agents",
1977
- children: /* @__PURE__ */ (0, K.jsx)(L, { className: "size-3.5" })
1978
- })]
1979
- }), He && /* @__PURE__ */ (0, K.jsx)("pre", {
1980
- className: "max-h-48 overflow-auto whitespace-pre-wrap p-2 text-[11px]",
1981
- "data-testid": "debugger-csp-prompt-for-agents",
1982
- children: fe
1983
- })]
1984
- })] })]
1985
- })
1986
- ]
1987
- })]
1988
- })]
1989
- }),
1990
- /* @__PURE__ */ (0, K.jsxs)(a, { children: [/* @__PURE__ */ (0, K.jsx)(i, {
1991
- render: /* @__PURE__ */ (0, K.jsx)(d, {
1992
- "data-testid": "debugger-touch-button",
1993
- variant: "outline",
1994
- size: "sm",
1995
- className: `h-8 w-8 p-0 bg-white/90 dark:bg-zinc-900/90 backdrop-blur-sm shadow-sm hover:bg-white dark:hover:bg-zinc-900 ${T.capabilities.touch ? "border-blue-500 dark:border-blue-400" : ""}`,
1996
- onClick: () => {
1997
- E({ capabilities: {
1998
- ...T.capabilities,
1999
- touch: !T.capabilities.touch
2000
- } });
2001
- },
2002
- children: /* @__PURE__ */ (0, K.jsx)(De, { className: `size-3.5 ${T.capabilities.touch ? "text-blue-600 dark:text-blue-400" : ""}` })
2003
- }),
2004
- nativeButton: !0
2005
- }), /* @__PURE__ */ (0, K.jsxs)(o, { children: ["Touch: ", T.capabilities.touch ? "Enabled" : "Disabled"] })] }),
2006
- /* @__PURE__ */ (0, K.jsxs)(a, { children: [/* @__PURE__ */ (0, K.jsx)(i, {
2007
- render: /* @__PURE__ */ (0, K.jsx)(d, {
2008
- "data-testid": "debugger-hover-button",
2009
- variant: "outline",
2010
- size: "sm",
2011
- className: `h-8 w-8 p-0 bg-white/90 dark:bg-zinc-900/90 backdrop-blur-sm shadow-sm hover:bg-white dark:hover:bg-zinc-900 ${T.capabilities.hover ? "border-blue-500 dark:border-blue-400" : ""}`,
2012
- onClick: () => {
2013
- E({ capabilities: {
2014
- ...T.capabilities,
2015
- hover: !T.capabilities.hover
2016
- } });
2017
- },
2018
- children: /* @__PURE__ */ (0, K.jsx)(Te, { className: `size-3.5 ${T.capabilities.hover ? "text-blue-600 dark:text-blue-400" : ""}` })
2019
- }),
2020
- nativeButton: !0
2021
- }), /* @__PURE__ */ (0, K.jsxs)(o, { children: ["Hover: ", T.capabilities.hover ? "Enabled" : "Disabled"] })] }),
2022
- /* @__PURE__ */ (0, K.jsxs)(b, { children: [/* @__PURE__ */ (0, K.jsx)(_, {
2023
- render: /* @__PURE__ */ (0, K.jsx)(d, {
2024
- "data-testid": "debugger-safe-area-button",
2025
- variant: "outline",
2026
- size: "sm",
2027
- className: "h-8 w-8 p-0 bg-white/90 dark:bg-zinc-900/90 backdrop-blur-sm shadow-sm hover:bg-white dark:hover:bg-zinc-900",
2028
- children: /* @__PURE__ */ (0, K.jsx)(je, { className: "size-3.5" })
2029
- }),
2030
- nativeButton: !0
2031
- }), /* @__PURE__ */ (0, K.jsx)(m, {
2032
- className: "w-64 p-3",
2033
- "data-testid": "debugger-safe-area-dialog",
2034
- children: /* @__PURE__ */ (0, K.jsxs)("div", {
2035
- className: "space-y-2",
2036
- children: [/* @__PURE__ */ (0, K.jsx)("label", {
2037
- className: "text-xs font-medium",
2038
- children: "Safe Area Insets"
2039
- }), /* @__PURE__ */ (0, K.jsx)(Ze, {
2040
- value: T.safeAreaInsets,
2041
- onChange: (e) => {
2042
- E({ safeAreaInsets: e });
2043
- }
2044
- })]
2045
- })
2046
- })] }),
2047
- s === "tool" ? /* @__PURE__ */ (0, K.jsxs)(se, { children: [/* @__PURE__ */ (0, K.jsxs)(a, { children: [/* @__PURE__ */ (0, K.jsx)(i, {
2048
- render: /* @__PURE__ */ (0, K.jsx)(ne, {
2049
- render: /* @__PURE__ */ (0, K.jsx)(d, {
2050
- variant: "outline",
2051
- size: "sm",
2052
- className: "h-8 w-8 p-0 bg-white/90 dark:bg-zinc-900/90 backdrop-blur-sm shadow-sm hover:bg-white dark:hover:bg-zinc-900",
2053
- "data-testid": "debugger-props-button",
2054
- children: /* @__PURE__ */ (0, K.jsx)(Ce, { className: "size-3.5" })
2055
- }),
2056
- nativeButton: !0
2057
- }),
2058
- nativeButton: !0
2059
- }), /* @__PURE__ */ (0, K.jsx)(o, { children: "View Tool Props" })] }), /* @__PURE__ */ (0, K.jsxs)(ae, {
2060
- scrollable: !0,
2061
- className: "sm:max-w-[600px] max-h-[85vh]",
2062
- "data-testid": "debugger-props-dialog",
2063
- children: [/* @__PURE__ */ (0, K.jsx)(ie, { children: /* @__PURE__ */ (0, K.jsx)(te, { children: "Tool Props" }) }), /* @__PURE__ */ (0, K.jsx)(re, { children: /* @__PURE__ */ (0, K.jsx)(oe, { children: /* @__PURE__ */ (0, K.jsx)(le, {
2064
- data: l ?? {},
2065
- filename: "tool-props.json"
2066
- }) }) })]
2067
- })] }) : /* @__PURE__ */ (0, K.jsxs)(b, {
2068
- open: Le,
2069
- onOpenChange: Re,
2070
- children: [/* @__PURE__ */ (0, K.jsxs)(a, { children: [/* @__PURE__ */ (0, K.jsx)(i, {
2071
- render: /* @__PURE__ */ (0, K.jsx)(_, {
2072
- render: /* @__PURE__ */ (0, K.jsx)(d, {
2073
- variant: "outline",
2074
- size: "sm",
2075
- className: `h-8 w-8 p-0 backdrop-blur-sm shadow-sm ${G ? "bg-amber-50 dark:bg-amber-950/40 border-amber-300 dark:border-amber-700 hover:bg-amber-100 dark:hover:bg-amber-900/50 animate-pulse" : "bg-white/90 dark:bg-zinc-900/90 hover:bg-white dark:hover:bg-zinc-900"}`,
2076
- "data-testid": "debugger-props-button",
2077
- children: /* @__PURE__ */ (0, K.jsx)(Ce, { className: `size-3.5 ${G ? "text-amber-500" : ""}` })
2078
- }),
2079
- nativeButton: !0
2080
- }),
2081
- nativeButton: !0
2082
- }), /* @__PURE__ */ (0, K.jsxs)(o, { children: [
2083
- "Props:",
2084
- " ",
2085
- X === Q ? "No Props" : X === $ ? "Tool Props" : B.find((e) => e.id === X)?.name || "Custom"
2086
- ] })] }), /* @__PURE__ */ (0, K.jsxs)(m, {
2087
- className: "w-64 p-2",
2088
- "data-testid": "debugger-props-popover",
2089
- children: [G && /* @__PURE__ */ (0, K.jsxs)("div", {
2090
- className: "mb-2 rounded-md border border-amber-200 dark:border-amber-800/50 bg-amber-50 dark:bg-amber-950/30 px-3 py-2",
2091
- children: [
2092
- /* @__PURE__ */ (0, K.jsx)("p", {
2093
- className: "text-xs font-medium text-amber-700 dark:text-amber-300 mb-0.5",
2094
- children: "Props required to render this widget:"
2095
- }),
2096
- /* @__PURE__ */ (0, K.jsx)("p", {
2097
- className: "text-xs font-mono text-amber-600 dark:text-amber-400",
2098
- children: y.join(", ")
2099
- }),
2100
- /* @__PURE__ */ (0, K.jsx)("p", {
2101
- className: "text-xs text-amber-500 dark:text-amber-400 mt-1",
2102
- children: "Create a preset below to set them."
2103
- })
2104
- ]
2105
- }), /* @__PURE__ */ (0, K.jsxs)("div", {
2106
- className: "space-y-1",
2107
- children: [
2108
- /* @__PURE__ */ (0, K.jsx)(d, {
2109
- variant: X === Q ? "secondary" : "ghost",
2110
- size: "sm",
2111
- className: "w-full justify-start",
2112
- onClick: () => $e(Q),
2113
- "data-testid": "debugger-props-no-props",
2114
- children: "No Props"
2115
- }),
2116
- B.map((e) => /* @__PURE__ */ (0, K.jsxs)("div", {
2117
- className: "relative group flex items-center",
2118
- children: [/* @__PURE__ */ (0, K.jsx)(d, {
2119
- variant: X === e.id ? "secondary" : "ghost",
2120
- size: "sm",
2121
- className: "w-full justify-start pr-14",
2122
- onClick: () => $e(e.id),
2123
- "data-testid": `debugger-props-preset-${e.id}`,
2124
- children: e.name
2125
- }), /* @__PURE__ */ (0, K.jsxs)("div", {
2126
- className: "absolute right-2 flex items-center gap-1 opacity-0 group-hover:opacity-100 transition-opacity",
2127
- children: [/* @__PURE__ */ (0, K.jsx)(d, {
2128
- variant: "ghost",
2129
- size: "sm",
2130
- className: "h-6 w-6 p-0",
2131
- onClick: (t) => ot(e, t),
2132
- "data-testid": `debugger-props-edit-${e.id}`,
2133
- children: /* @__PURE__ */ (0, K.jsx)(ee, { className: "h-3 w-3" })
2134
- }), /* @__PURE__ */ (0, K.jsx)(d, {
2135
- variant: "ghost",
2136
- size: "sm",
2137
- className: "h-6 w-6 p-0",
2138
- onClick: (t) => at(e.id, t),
2139
- "data-testid": `debugger-props-delete-${e.id}`,
2140
- children: /* @__PURE__ */ (0, K.jsx)(pe, { className: "h-3 w-3 text-destructive" })
2141
- })]
2142
- })]
2143
- }, e.id)),
2144
- /* @__PURE__ */ (0, K.jsx)(d, {
2145
- variant: "ghost",
2146
- size: "sm",
2147
- className: "w-full justify-start text-primary",
2148
- onClick: () => $e(tt),
2149
- "data-testid": "debugger-props-create-preset",
2150
- children: "+ Create Preset..."
2151
- })
2152
- ]
2153
- })]
2154
- })]
2155
- }),
2156
- /* @__PURE__ */ (0, K.jsx)(We, {
2157
- iframeId: n,
2158
- enabled: !0
2159
- }),
2160
- g && /* @__PURE__ */ (0, K.jsx)(Xe, {
2161
- open: Pe,
2162
- onOpenChange: W,
2163
- onSave: it,
2164
- existingPresets: B,
2165
- resource: g,
2166
- resourceAnnotations: u,
2167
- llmConfig: p || null,
2168
- editingPreset: q
2169
- })
2170
- ]
2171
- });
2172
- }
2173
- //#endregion
2174
- export { we as n, it as t };