@superblocksteam/library 2.0.175-next.0 → 2.0.176-next.0
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.
- package/dist/build-manifest-BQAcrmit.js +6 -0
- package/dist/{build-manifest-tU0L2vSJ.js.map → build-manifest-BQAcrmit.js.map} +1 -1
- package/dist/{devtools-consolidated-DLnb73OV.js → devtools-consolidated-C5sXwPGD.js} +5 -3
- package/dist/{devtools-consolidated-DLnb73OV.js.map → devtools-consolidated-C5sXwPGD.js.map} +1 -1
- package/dist/{early-console-buffer-B88uX-DV.js → early-console-buffer-DMR1SCsN.js} +5 -4
- package/dist/{early-console-buffer-B88uX-DV.js.map → early-console-buffer-DMR1SCsN.js.map} +1 -1
- package/dist/jsx-dev-runtime/index.d.ts +7 -2
- package/dist/jsx-dev-runtime/index.d.ts.map +1 -1
- package/dist/jsx-dev-runtime/index.js +6 -3
- package/dist/jsx-dev-runtime/index.js.map +1 -1
- package/dist/jsx-runtime/index.d.ts +6 -3
- package/dist/jsx-runtime/index.d.ts.map +1 -1
- package/dist/jsx-runtime/index.js +2 -1
- package/dist/jsx-wrapper-B0I9j3Al.js +639 -0
- package/dist/jsx-wrapper-B0I9j3Al.js.map +1 -0
- package/dist/lib/index.d.ts +179 -72
- package/dist/lib/index.d.ts.map +1 -1
- package/dist/lib/index.js +378 -311
- package/dist/lib/index.js.map +1 -1
- package/dist/{logs-rwNn0yg7.js → logs-CUUgkcJf.js} +13 -13
- package/dist/{logs-rwNn0yg7.js.map → logs-CUUgkcJf.js.map} +1 -1
- package/dist/rolldown-runtime-CiIaOW0V.js +13 -0
- package/dist/{jsx-wrapper-BAO7prWO.js → root-store-G9HJE1Mf.js} +107 -771
- package/dist/root-store-G9HJE1Mf.js.map +1 -0
- package/dist/{sdk-api-discovery-CtyMcIGP.js → sdk-api-discovery-_lfMr9d5.js} +12 -8
- package/dist/{sdk-api-discovery-CtyMcIGP.js.map → sdk-api-discovery-_lfMr9d5.js.map} +1 -1
- package/dist/utils-DXaAwgS_.js +61 -0
- package/dist/utils-DXaAwgS_.js.map +1 -0
- package/package.json +22 -17
- package/dist/build-manifest-tU0L2vSJ.js +0 -5
- package/dist/jsx-wrapper-BAO7prWO.js.map +0 -1
|
@@ -1,36 +1,19 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { t as getTracer } from "./utils-DXaAwgS_.js";
|
|
2
2
|
import { action, entries, isComputedProp, isObservableArray, isObservableMap, isObservableObject, makeAutoObservable, makeObservable, observable, observe, reaction, toJS, values } from "mobx";
|
|
3
3
|
import { matchRoutes } from "react-router";
|
|
4
|
-
import {
|
|
4
|
+
import { URL_PARAMS, getQueryParams, pathStringToArray, toMobXPatch } from "@superblocksteam/library-shared";
|
|
5
5
|
import * as React$1 from "react";
|
|
6
|
-
import
|
|
7
|
-
import { throttle } from "lodash
|
|
8
|
-
import { ApiResponseType, SUPERBLOCKS_AUTHORIZATION_HEADER, SUPERBLOCKS_REQUEST_ID_HEADER, ViewMode, decodeBytestrings } from "@superblocksteam/shared";
|
|
6
|
+
import { createContext, isValidElement, useCallback, useContext, useMemo, useSyncExternalStore } from "react";
|
|
7
|
+
import { pick, throttle } from "lodash";
|
|
8
|
+
import { ApiResponseType, OrchestratorViewMode, SUPERBLOCKS_AUTHORIZATION_HEADER, SUPERBLOCKS_REQUEST_ID_HEADER, ViewMode, decodeBytestrings } from "@superblocksteam/shared";
|
|
9
|
+
import isString from "lodash/isString.js";
|
|
9
10
|
import { toast } from "sonner";
|
|
10
|
-
import styled
|
|
11
|
+
import styled from "styled-components";
|
|
11
12
|
import { NotificationPosition } from "@superblocksteam/library-shared/types";
|
|
12
|
-
import { jsx
|
|
13
|
+
import { jsx } from "react/jsx-runtime";
|
|
13
14
|
import { ROOT_CONTEXT, context, propagation, trace } from "@opentelemetry/api";
|
|
14
|
-
import { CompositePropagator, W3CBaggagePropagator, W3CTraceContextPropagator } from "@opentelemetry/core";
|
|
15
|
-
import { OTLPTraceExporter } from "@opentelemetry/exporter-trace-otlp-http";
|
|
16
|
-
import { resourceFromAttributes } from "@opentelemetry/resources";
|
|
17
|
-
import { BatchSpanProcessor } from "@opentelemetry/sdk-trace-base";
|
|
18
|
-
import { WebTracerProvider } from "@opentelemetry/sdk-trace-web";
|
|
19
|
-
import { ATTR_SERVICE_NAME } from "@opentelemetry/semantic-conventions";
|
|
20
15
|
import diff from "microdiff";
|
|
21
|
-
|
|
22
|
-
// \0rolldown/runtime.js
|
|
23
|
-
var __defProp = Object.defineProperty;
|
|
24
|
-
var __exportAll = (all, no_symbols) => {
|
|
25
|
-
let target = {};
|
|
26
|
-
for (var name in all) __defProp(target, name, {
|
|
27
|
-
get: all[name],
|
|
28
|
-
enumerable: true
|
|
29
|
-
});
|
|
30
|
-
if (!no_symbols) __defProp(target, Symbol.toStringTag, { value: "Module" });
|
|
31
|
-
return target;
|
|
32
|
-
};
|
|
33
|
-
// src/lib/internal-details/is-edit-mode.ts
|
|
16
|
+
//#region src/lib/internal-details/is-edit-mode.ts
|
|
34
17
|
const getIsEditMode = () => {
|
|
35
18
|
return window._SB_VIEW_MODE === "dev";
|
|
36
19
|
};
|
|
@@ -39,7 +22,8 @@ const isEditMode = () => {
|
|
|
39
22
|
if (editMode === void 0) editMode = getIsEditMode();
|
|
40
23
|
return editMode;
|
|
41
24
|
};
|
|
42
|
-
|
|
25
|
+
//#endregion
|
|
26
|
+
//#region src/lib/utils/clean-object.ts
|
|
43
27
|
const isReactElement = (obj) => {
|
|
44
28
|
return obj && (obj.$$typeof === Symbol.for("react.element") || isValidElement(obj) || typeof Node !== "undefined" && obj instanceof Node);
|
|
45
29
|
};
|
|
@@ -76,7 +60,8 @@ function cleanObject(obj) {
|
|
|
76
60
|
return acc;
|
|
77
61
|
}, {});
|
|
78
62
|
}
|
|
79
|
-
|
|
63
|
+
//#endregion
|
|
64
|
+
//#region src/lib/internal-details/lib/iframe.ts
|
|
80
65
|
function isEmbeddedBySuperblocksFirstParty() {
|
|
81
66
|
return typeof window !== "undefined" && window !== window.parent;
|
|
82
67
|
}
|
|
@@ -144,7 +129,8 @@ var SbIframeEventInternal = class extends Event {
|
|
|
144
129
|
};
|
|
145
130
|
var SbMessageHandler = class extends EventTarget {};
|
|
146
131
|
const iframeMessageHandler = new SbMessageHandler();
|
|
147
|
-
|
|
132
|
+
//#endregion
|
|
133
|
+
//#region src/edit-mode/base-editor-bridge.ts
|
|
148
134
|
var DeployedParentBridge = class {
|
|
149
135
|
navigateTo(url, newWindow) {
|
|
150
136
|
sendMessageImmediately({
|
|
@@ -205,7 +191,8 @@ var DeployedParentBridge = class {
|
|
|
205
191
|
});
|
|
206
192
|
}
|
|
207
193
|
};
|
|
208
|
-
|
|
194
|
+
//#endregion
|
|
195
|
+
//#region src/edit-mode/get-edit-store.ts
|
|
209
196
|
/**
|
|
210
197
|
* Get the global EditStore instance
|
|
211
198
|
* @returns The EditStore instance
|
|
@@ -214,7 +201,8 @@ function getEditStore() {
|
|
|
214
201
|
if (!window.__SUPERBLOCKS_EDITOR_HOOK__ || !window.__SUPERBLOCKS_EDITOR_HOOK__.isInitialized) throw new Error("EditStore not initialized");
|
|
215
202
|
return window.__SUPERBLOCKS_EDITOR_HOOK__;
|
|
216
203
|
}
|
|
217
|
-
|
|
204
|
+
//#endregion
|
|
205
|
+
//#region src/edit-mode/load-timings.ts
|
|
218
206
|
const MARK_PREFIX = "sb-load:";
|
|
219
207
|
const SLOWEST_RESOURCE_COUNT = 5;
|
|
220
208
|
/** Records the first time this iframe document reaches a load milestone. */
|
|
@@ -277,7 +265,8 @@ function summarizeLoadTimings(input) {
|
|
|
277
265
|
}))
|
|
278
266
|
};
|
|
279
267
|
}
|
|
280
|
-
|
|
268
|
+
//#endregion
|
|
269
|
+
//#region src/edit-mode/message-queue.ts
|
|
281
270
|
const MESSAGE_BATCH_TIME = 50;
|
|
282
271
|
const DEFAULT_KEY = "default";
|
|
283
272
|
var MessageQueue = class {
|
|
@@ -306,7 +295,8 @@ var MessageQueue = class {
|
|
|
306
295
|
}
|
|
307
296
|
};
|
|
308
297
|
var message_queue_default = new MessageQueue();
|
|
309
|
-
|
|
298
|
+
//#endregion
|
|
299
|
+
//#region src/edit-mode/superblocks-editor-bridge.ts
|
|
310
300
|
var SuperblocksEditorBridge = class SuperblocksEditorBridge {
|
|
311
301
|
static instance;
|
|
312
302
|
messagesToSend = [];
|
|
@@ -666,11 +656,12 @@ const MAX_AI_PROMPT_LENGTH = 16e3;
|
|
|
666
656
|
const TRUNCATION_SUFFIX = "... (truncated)";
|
|
667
657
|
function clampPromptLength(prompt) {
|
|
668
658
|
if (prompt.length <= MAX_AI_PROMPT_LENGTH) return prompt;
|
|
669
|
-
const available = Math.max(
|
|
659
|
+
const available = Math.max(MAX_AI_PROMPT_LENGTH - 15, 0);
|
|
670
660
|
return `${prompt.slice(0, available)}${TRUNCATION_SUFFIX}`;
|
|
671
661
|
}
|
|
672
662
|
const editorBridge = SuperblocksEditorBridge.getInstance();
|
|
673
|
-
|
|
663
|
+
//#endregion
|
|
664
|
+
//#region src/lib/internal-details/location-store.ts
|
|
674
665
|
var LocationStore = class {
|
|
675
666
|
route;
|
|
676
667
|
rootStore;
|
|
@@ -716,101 +707,106 @@ var LocationStore = class {
|
|
|
716
707
|
};
|
|
717
708
|
}
|
|
718
709
|
};
|
|
719
|
-
|
|
720
|
-
|
|
721
|
-
|
|
722
|
-
|
|
710
|
+
//#endregion
|
|
711
|
+
//#region src/lib/user-facing/assets/icons/system-danger.svg
|
|
712
|
+
var _path$3;
|
|
713
|
+
function _extends$3() {
|
|
714
|
+
return _extends$3 = Object.assign ? Object.assign.bind() : function(n) {
|
|
723
715
|
for (var e = 1; e < arguments.length; e++) {
|
|
724
716
|
var t = arguments[e];
|
|
725
717
|
for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
|
|
726
718
|
}
|
|
727
719
|
return n;
|
|
728
|
-
}, _extends$
|
|
720
|
+
}, _extends$3.apply(null, arguments);
|
|
729
721
|
}
|
|
730
722
|
var SvgSystemDanger = function SvgSystemDanger(props) {
|
|
731
|
-
return
|
|
723
|
+
return /* @__PURE__ */ React$1.createElement("svg", _extends$3({
|
|
732
724
|
xmlns: "http://www.w3.org/2000/svg",
|
|
733
725
|
width: 16,
|
|
734
726
|
height: 16,
|
|
735
727
|
fill: "none"
|
|
736
|
-
}, props), _path$
|
|
728
|
+
}, props), _path$3 || (_path$3 = /* @__PURE__ */ React$1.createElement("path", {
|
|
737
729
|
fill: "currentColor",
|
|
738
730
|
fillRule: "evenodd",
|
|
739
731
|
d: "M8 15A7 7 0 1 0 8 1a7 7 0 0 0 0 14m.75-10a.75.75 0 0 0-1.5 0v3a.75.75 0 1 0 1.5 0zM8 9.75a1 1 0 1 0 0 2 1 1 0 0 0 0-2",
|
|
740
732
|
clipRule: "evenodd"
|
|
741
733
|
})));
|
|
742
734
|
};
|
|
743
|
-
|
|
744
|
-
|
|
745
|
-
|
|
746
|
-
|
|
735
|
+
//#endregion
|
|
736
|
+
//#region src/lib/user-facing/assets/icons/system-error.svg
|
|
737
|
+
var _path$2;
|
|
738
|
+
function _extends$2() {
|
|
739
|
+
return _extends$2 = Object.assign ? Object.assign.bind() : function(n) {
|
|
747
740
|
for (var e = 1; e < arguments.length; e++) {
|
|
748
741
|
var t = arguments[e];
|
|
749
742
|
for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
|
|
750
743
|
}
|
|
751
744
|
return n;
|
|
752
|
-
}, _extends$
|
|
745
|
+
}, _extends$2.apply(null, arguments);
|
|
753
746
|
}
|
|
754
747
|
var SvgSystemError = function SvgSystemError(props) {
|
|
755
|
-
return
|
|
748
|
+
return /* @__PURE__ */ React$1.createElement("svg", _extends$2({
|
|
756
749
|
xmlns: "http://www.w3.org/2000/svg",
|
|
757
750
|
width: 16,
|
|
758
751
|
height: 16,
|
|
759
752
|
fill: "none"
|
|
760
|
-
}, props), _path$
|
|
753
|
+
}, props), _path$2 || (_path$2 = /* @__PURE__ */ React$1.createElement("path", {
|
|
761
754
|
fill: "currentColor",
|
|
762
755
|
fillRule: "evenodd",
|
|
763
756
|
d: "M15 8A7 7 0 1 1 1 8a7 7 0 0 1 14 0M5.942 5.058a.625.625 0 1 0-.884.884L7.116 8l-2.058 2.058a.625.625 0 1 0 .884.884L8 8.884l2.058 2.058a.625.625 0 1 0 .884-.884L8.884 8l2.058-2.058a.625.625 0 1 0-.884-.884L8 7.116z",
|
|
764
757
|
clipRule: "evenodd"
|
|
765
758
|
})));
|
|
766
759
|
};
|
|
767
|
-
|
|
768
|
-
|
|
769
|
-
|
|
770
|
-
|
|
760
|
+
//#endregion
|
|
761
|
+
//#region src/lib/user-facing/assets/icons/system-info.svg
|
|
762
|
+
var _path$1;
|
|
763
|
+
function _extends$1() {
|
|
764
|
+
return _extends$1 = Object.assign ? Object.assign.bind() : function(n) {
|
|
771
765
|
for (var e = 1; e < arguments.length; e++) {
|
|
772
766
|
var t = arguments[e];
|
|
773
767
|
for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
|
|
774
768
|
}
|
|
775
769
|
return n;
|
|
776
|
-
}, _extends$
|
|
770
|
+
}, _extends$1.apply(null, arguments);
|
|
777
771
|
}
|
|
778
772
|
var SvgSystemInfo = function SvgSystemInfo(props) {
|
|
779
|
-
return
|
|
773
|
+
return /* @__PURE__ */ React$1.createElement("svg", _extends$1({
|
|
780
774
|
xmlns: "http://www.w3.org/2000/svg",
|
|
781
775
|
width: 16,
|
|
782
776
|
height: 16,
|
|
783
777
|
fill: "none"
|
|
784
|
-
}, props), _path$
|
|
778
|
+
}, props), _path$1 || (_path$1 = /* @__PURE__ */ React$1.createElement("path", {
|
|
785
779
|
fill: "currentColor",
|
|
786
780
|
d: "M8 1a7 7 0 1 0 7 7 7.014 7.014 0 0 0-7-7m-.135 3.23a.808.808 0 1 1 0 1.616.808.808 0 0 1 0-1.615m.673 7.54H8a.54.54 0 0 1-.538-.54V8a.538.538 0 1 1 0-1.077H8a.54.54 0 0 1 .538.539v3.23a.538.538 0 1 1 0 1.077"
|
|
787
781
|
})));
|
|
788
782
|
};
|
|
789
|
-
|
|
790
|
-
|
|
791
|
-
|
|
792
|
-
|
|
783
|
+
//#endregion
|
|
784
|
+
//#region src/lib/user-facing/assets/icons/system-success.svg
|
|
785
|
+
var _path;
|
|
786
|
+
function _extends() {
|
|
787
|
+
return _extends = Object.assign ? Object.assign.bind() : function(n) {
|
|
793
788
|
for (var e = 1; e < arguments.length; e++) {
|
|
794
789
|
var t = arguments[e];
|
|
795
790
|
for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
|
|
796
791
|
}
|
|
797
792
|
return n;
|
|
798
|
-
}, _extends
|
|
793
|
+
}, _extends.apply(null, arguments);
|
|
799
794
|
}
|
|
800
795
|
var SvgSystemSuccess = function SvgSystemSuccess(props) {
|
|
801
|
-
return
|
|
796
|
+
return /* @__PURE__ */ React$1.createElement("svg", _extends({
|
|
802
797
|
xmlns: "http://www.w3.org/2000/svg",
|
|
803
798
|
width: 16,
|
|
804
799
|
height: 16,
|
|
805
800
|
fill: "none"
|
|
806
|
-
}, props), _path
|
|
801
|
+
}, props), _path || (_path = /* @__PURE__ */ React$1.createElement("path", {
|
|
807
802
|
fill: "currentColor",
|
|
808
803
|
fillRule: "evenodd",
|
|
809
804
|
d: "M8 15A7 7 0 1 0 8 1a7 7 0 0 0 0 14m3.442-8.058a.625.625 0 1 0-.884-.884L7.5 9.116 5.942 7.558a.625.625 0 1 0-.884.884l2 2c.244.244.64.244.884 0z",
|
|
810
805
|
clipRule: "evenodd"
|
|
811
806
|
})));
|
|
812
807
|
};
|
|
813
|
-
|
|
808
|
+
//#endregion
|
|
809
|
+
//#region src/lib/user-facing/styling/colors.ts
|
|
814
810
|
const colors = {
|
|
815
811
|
WHITE: "#FFFFFF",
|
|
816
812
|
BLACK: "#000000",
|
|
@@ -940,7 +936,8 @@ const CLASS_NAMES = {
|
|
|
940
936
|
CODE_EDITOR: "sb-code-editor",
|
|
941
937
|
ERROR_INLINE_MESSAGE: "sb-error-inline-message"
|
|
942
938
|
};
|
|
943
|
-
|
|
939
|
+
//#endregion
|
|
940
|
+
//#region src/lib/user-facing/utils/notification.tsx
|
|
944
941
|
const activeNotifications = /* @__PURE__ */ new Map();
|
|
945
942
|
const StatusIconWrapper = styled.div`
|
|
946
943
|
color: ${(props) => props.color};
|
|
@@ -983,7 +980,7 @@ const messageWithCount = (key, message, dataTest) => {
|
|
|
983
980
|
count,
|
|
984
981
|
message
|
|
985
982
|
});
|
|
986
|
-
if (count > 1 &&
|
|
983
|
+
if (count > 1 && isString(message)) updatedMessage = `${message} (${count} times)`;
|
|
987
984
|
}
|
|
988
985
|
return styleMessage(updatedMessage, dataTest);
|
|
989
986
|
};
|
|
@@ -993,7 +990,7 @@ const messageWithCount = (key, message, dataTest) => {
|
|
|
993
990
|
* @returns A string key based on inputs
|
|
994
991
|
*/
|
|
995
992
|
const getKey = (type, message, description, duration) => {
|
|
996
|
-
return
|
|
993
|
+
return isString(message) ? `${type}--${String(message)}--${description}--${duration}` : void 0;
|
|
997
994
|
};
|
|
998
995
|
const removeNotificationsWithKey = (key) => {
|
|
999
996
|
document.querySelectorAll(`[data-testid="notification_${key}"]`).forEach((el) => {
|
|
@@ -1022,6 +1019,7 @@ const getIcon = (type) => {
|
|
|
1022
1019
|
case "warning":
|
|
1023
1020
|
icon = /* @__PURE__ */ jsx(SvgSystemDanger, {});
|
|
1024
1021
|
color = colors.WARNING;
|
|
1022
|
+
break;
|
|
1025
1023
|
}
|
|
1026
1024
|
return /* @__PURE__ */ jsx(StatusIconWrapper, {
|
|
1027
1025
|
color,
|
|
@@ -1062,11 +1060,13 @@ function sendNotification({ message, description, duration, key = getKey("succes
|
|
|
1062
1060
|
onAutoClose: handleClose
|
|
1063
1061
|
});
|
|
1064
1062
|
}
|
|
1065
|
-
|
|
1063
|
+
//#endregion
|
|
1064
|
+
//#region src/lib/utils/generate-id.ts
|
|
1066
1065
|
const generateId = () => {
|
|
1067
1066
|
return Math.random().toString(36).substring(2, 15);
|
|
1068
1067
|
};
|
|
1069
|
-
|
|
1068
|
+
//#endregion
|
|
1069
|
+
//#region src/lib/internal-details/embed-store.ts
|
|
1070
1070
|
/**
|
|
1071
1071
|
* Store for managing embed properties and events.
|
|
1072
1072
|
* Used when the library is embedded in an external application (third-party embedding).
|
|
@@ -1117,13 +1117,15 @@ var EmbedStore = class {
|
|
|
1117
1117
|
}
|
|
1118
1118
|
};
|
|
1119
1119
|
const embedStore = new EmbedStore();
|
|
1120
|
-
|
|
1120
|
+
//#endregion
|
|
1121
|
+
//#region src/lib/internal-details/scope/types.ts
|
|
1121
1122
|
const AppMode = {
|
|
1122
1123
|
EDIT: "EDIT",
|
|
1123
1124
|
PUBLISHED: "PUBLISHED",
|
|
1124
1125
|
PREVIEW: "PREVIEW"
|
|
1125
1126
|
};
|
|
1126
|
-
|
|
1127
|
+
//#endregion
|
|
1128
|
+
//#region src/lib/internal-details/superblocks-context.tsx
|
|
1127
1129
|
var SuperblocksAppContext = class {
|
|
1128
1130
|
context;
|
|
1129
1131
|
constructor() {
|
|
@@ -1224,7 +1226,8 @@ function getAppMode() {
|
|
|
1224
1226
|
}
|
|
1225
1227
|
return appMode;
|
|
1226
1228
|
}
|
|
1227
|
-
|
|
1229
|
+
//#endregion
|
|
1230
|
+
//#region src/lib/internal-details/lib/resolve-id-singleton.ts
|
|
1228
1231
|
const EMBED_STRING = `embedded-`;
|
|
1229
1232
|
let promiseCount = 0;
|
|
1230
1233
|
const resolverMap = /* @__PURE__ */ new Map();
|
|
@@ -1328,55 +1331,8 @@ const tracker = new class ApiHmrTracker {
|
|
|
1328
1331
|
if (import.meta.hot) import.meta.hot.on("vite:beforeUpdate", () => {
|
|
1329
1332
|
tracker.incReloadCount();
|
|
1330
1333
|
});
|
|
1331
|
-
|
|
1332
|
-
|
|
1333
|
-
getTracer: () => getTracer,
|
|
1334
|
-
initTracerProviderWithOrigin: () => initTracerProviderWithOrigin
|
|
1335
|
-
});
|
|
1336
|
-
const serviceName = "superblocks-ui-framework";
|
|
1337
|
-
let otlpEndpoint = void 0;
|
|
1338
|
-
const otlpPath = "/api/v1/traces";
|
|
1339
|
-
let metricsInitialized = false;
|
|
1340
|
-
let currentProvider;
|
|
1341
|
-
const ATTR_DEPLOYMENT_ENVIRONMENT_NAME = "deployment.environment.name";
|
|
1342
|
-
function initTracerProviderWithOrigin(windowOriginUrl) {
|
|
1343
|
-
otlpEndpoint = windowOriginUrl + otlpPath;
|
|
1344
|
-
const resource = resourceFromAttributes({
|
|
1345
|
-
[ATTR_DEPLOYMENT_ENVIRONMENT_NAME]: getEnvironmentFromHostname(new URL(windowOriginUrl).hostname),
|
|
1346
|
-
[ATTR_SERVICE_NAME]: serviceName
|
|
1347
|
-
});
|
|
1348
|
-
if (!metricsInitialized) {
|
|
1349
|
-
initBrowserMetrics({
|
|
1350
|
-
otlpUrl: windowOriginUrl + "/api/v1/metrics",
|
|
1351
|
-
resource,
|
|
1352
|
-
serviceName
|
|
1353
|
-
});
|
|
1354
|
-
metricsInitialized = true;
|
|
1355
|
-
}
|
|
1356
|
-
console.debug("Initializing direct OTLP tracer provider for iframe to:", otlpEndpoint);
|
|
1357
|
-
const provider = new WebTracerProvider({
|
|
1358
|
-
resource,
|
|
1359
|
-
spanProcessors: [new BatchSpanProcessor(new OTLPTraceExporter({ url: otlpEndpoint }))]
|
|
1360
|
-
});
|
|
1361
|
-
provider.register({ propagator: new CompositePropagator({ propagators: [new W3CBaggagePropagator(), new W3CTraceContextPropagator()] }) });
|
|
1362
|
-
currentProvider = provider;
|
|
1363
|
-
console.debug("Direct OTLP tracing initialized for iframe with dynamic origin");
|
|
1364
|
-
return provider;
|
|
1365
|
-
}
|
|
1366
|
-
function getEnvironmentFromHostname(hostname) {
|
|
1367
|
-
if (hostname.match(/^app\.superblocks(?:hq)?\.com/)) return "prod";
|
|
1368
|
-
else if (hostname.match(/^eu\.superblocks(?:hq)?\.com/)) return "prod-eu";
|
|
1369
|
-
else if (hostname.match(/^staging\.superblocks(?:hq)?\.com/)) return "staging";
|
|
1370
|
-
else if (hostname.match(/^dev\.superblocks(?:hq)?\.com/)) return "dev";
|
|
1371
|
-
else if (hostname.match(/^pr-[0-9]+(?:-cp)?\.superblocks(?:hq)?\.dev/)) return "ephemeral";
|
|
1372
|
-
else if (hostname.match(/^localhost/)) return "local";
|
|
1373
|
-
else return "other";
|
|
1374
|
-
}
|
|
1375
|
-
function getTracer(name) {
|
|
1376
|
-
if (!currentProvider) console.error("Tracer provider not initialized. Call initTracerProviderWithOrigin() first with a valid windowOriginUrl. Tracing will be disabled.");
|
|
1377
|
-
return trace.getTracer(name || serviceName);
|
|
1378
|
-
}
|
|
1379
|
-
// src/lib/tracing/context-utils.ts
|
|
1334
|
+
//#endregion
|
|
1335
|
+
//#region src/lib/tracing/context-utils.ts
|
|
1380
1336
|
function getContextFromTraceHeaders(traceHeaders) {
|
|
1381
1337
|
let parentContext = context.active();
|
|
1382
1338
|
try {
|
|
@@ -1395,7 +1351,8 @@ function getTraceContextHeadersFromSpan(span) {
|
|
|
1395
1351
|
propagation.inject(contextWithSpan, traceContextHeaders);
|
|
1396
1352
|
return traceContextHeaders;
|
|
1397
1353
|
}
|
|
1398
|
-
|
|
1354
|
+
//#endregion
|
|
1355
|
+
//#region src/lib/internal-details/lib/features/api-utils.ts
|
|
1399
1356
|
async function executeV2Api(params) {
|
|
1400
1357
|
const { body, apiName, controlFlowOnlyFiles, notifyOnSystemError, eventType, onMessage, processStreamEvents, responseType, abortController, baseUrl, viewMode, accessToken, token, maxResponseBytes, traceHeaders } = params;
|
|
1401
1358
|
let parentContext = context.active();
|
|
@@ -1728,7 +1685,6 @@ const boundRunRecordStepLogs = (stepLogs, reuse) => {
|
|
|
1728
1685
|
};
|
|
1729
1686
|
};
|
|
1730
1687
|
var ResponseSizeLimitError = class extends Error {
|
|
1731
|
-
limitBytes;
|
|
1732
1688
|
constructor(limitBytes) {
|
|
1733
1689
|
super(`Response blocked: exceeded orchestrator /execute response limit of ${limitBytes} bytes.`);
|
|
1734
1690
|
this.limitBytes = limitBytes;
|
|
@@ -1810,7 +1766,8 @@ const decodeBytestringsInV2ExecutionResponse = (response) => {
|
|
|
1810
1766
|
if (typedEvent?.end?.output?.result != null) typedEvent.end.output.result = decodeBytestrings(typedEvent.end.output.result, false);
|
|
1811
1767
|
});
|
|
1812
1768
|
};
|
|
1813
|
-
|
|
1769
|
+
//#endregion
|
|
1770
|
+
//#region src/lib/internal-details/lib/features/file-utils.ts
|
|
1814
1771
|
function isNativeFile(value) {
|
|
1815
1772
|
return typeof File !== "undefined" && value instanceof File;
|
|
1816
1773
|
}
|
|
@@ -1884,7 +1841,8 @@ async function getInputsWithFileMetadata(inputs) {
|
|
|
1884
1841
|
files: Object.values(filesForRequest)
|
|
1885
1842
|
};
|
|
1886
1843
|
}
|
|
1887
|
-
|
|
1844
|
+
//#endregion
|
|
1845
|
+
//#region src/lib/internal-details/lib/features/url-utils.ts
|
|
1888
1846
|
/**
|
|
1889
1847
|
* Ensures a base URL has a trailing slash for proper path joining.
|
|
1890
1848
|
*
|
|
@@ -1900,13 +1858,9 @@ async function getInputsWithFileMetadata(inputs) {
|
|
|
1900
1858
|
function withTrailingSlash(baseUrl) {
|
|
1901
1859
|
return baseUrl.endsWith("/") ? baseUrl : `${baseUrl}/`;
|
|
1902
1860
|
}
|
|
1903
|
-
|
|
1861
|
+
//#endregion
|
|
1862
|
+
//#region src/lib/internal-details/lib/features/api-store.ts
|
|
1904
1863
|
const ENVIRONMENT_ALL = "*";
|
|
1905
|
-
const OrchestratorViewMode = {
|
|
1906
|
-
EDIT: 1,
|
|
1907
|
-
PREVIEW: 2,
|
|
1908
|
-
DEPLOYED: 3
|
|
1909
|
-
};
|
|
1910
1864
|
function getFetchByPathViewMode(appMode, editMode) {
|
|
1911
1865
|
if (appMode === AppMode.PREVIEW) return OrchestratorViewMode.PREVIEW;
|
|
1912
1866
|
if (appMode === AppMode.PUBLISHED) return OrchestratorViewMode.DEPLOYED;
|
|
@@ -1925,7 +1879,6 @@ function isAgentProfileSupported(agent, targetEnvironment) {
|
|
|
1925
1879
|
return supportedProfiles.includes(targetEnvironment);
|
|
1926
1880
|
}
|
|
1927
1881
|
var ApiManager = class {
|
|
1928
|
-
rootStore;
|
|
1929
1882
|
/**
|
|
1930
1883
|
* Pre-filtered agent URLs for the current profile, sent by the parent.
|
|
1931
1884
|
* Used as fallback for cloud orgs where URLs come from
|
|
@@ -2451,10 +2404,8 @@ var ApiManager = class {
|
|
|
2451
2404
|
const abortController = new AbortController();
|
|
2452
2405
|
(this.runningApiControllers[apiName] ??= /* @__PURE__ */ new Set()).add(abortController);
|
|
2453
2406
|
const forwardAbort = () => abortController.abort();
|
|
2454
|
-
if (options?.signal)
|
|
2455
|
-
|
|
2456
|
-
else options.signal.addEventListener("abort", forwardAbort, { once: true });
|
|
2457
|
-
}
|
|
2407
|
+
if (options?.signal) if (options.signal.aborted) abortController.abort();
|
|
2408
|
+
else options.signal.addEventListener("abort", forwardAbort, { once: true });
|
|
2458
2409
|
try {
|
|
2459
2410
|
let entryPoint = this.rootStore.getApiEntryPoint(apiName);
|
|
2460
2411
|
if (!entryPoint) {
|
|
@@ -2466,7 +2417,7 @@ var ApiManager = class {
|
|
|
2466
2417
|
}
|
|
2467
2418
|
if (!entryPoint && this.rootStore.sdkApiEnabled) try {
|
|
2468
2419
|
const rediscoveryT0 = performance.now();
|
|
2469
|
-
const { discoverAndRegisterSdkApis } = await import("./sdk-api-discovery-
|
|
2420
|
+
const { discoverAndRegisterSdkApis } = await import("./sdk-api-discovery-_lfMr9d5.js").then((n) => n.n);
|
|
2470
2421
|
await discoverAndRegisterSdkApis();
|
|
2471
2422
|
const rediscoveryMs = Math.round(performance.now() - rediscoveryT0);
|
|
2472
2423
|
discoveryMs += rediscoveryMs;
|
|
@@ -2679,7 +2630,8 @@ var ApiManager = class {
|
|
|
2679
2630
|
});
|
|
2680
2631
|
}
|
|
2681
2632
|
};
|
|
2682
|
-
|
|
2633
|
+
//#endregion
|
|
2634
|
+
//#region src/lib/internal-details/lib/evaluator/sanitize-object.ts
|
|
2683
2635
|
const objectFallbackCache = /* @__PURE__ */ new WeakMap();
|
|
2684
2636
|
function sanitizeObject(obj) {
|
|
2685
2637
|
if (!objectFallbackCache.has(obj)) objectFallbackCache.set(obj, {});
|
|
@@ -2699,7 +2651,8 @@ function sanitizedToJS(value) {
|
|
|
2699
2651
|
if (value === null || value === void 0 || typeof value !== "object") return toJS(value);
|
|
2700
2652
|
return toJS(sanitizeObject(value));
|
|
2701
2653
|
}
|
|
2702
|
-
|
|
2654
|
+
//#endregion
|
|
2655
|
+
//#region src/edit-mode/mobx-sync/create-patch.ts
|
|
2703
2656
|
const microPatches = (oldValue, newValue, baseStr) => {
|
|
2704
2657
|
const cleanedOldValue = removeBindAndReactElements(oldValue);
|
|
2705
2658
|
const cleanedNewValue = removeBindAndReactElements(newValue);
|
|
@@ -2753,7 +2706,8 @@ const removeBindAndReactElements = (value) => {
|
|
|
2753
2706
|
return [key, removeBindAndReactElements(value)];
|
|
2754
2707
|
}));
|
|
2755
2708
|
};
|
|
2756
|
-
|
|
2709
|
+
//#endregion
|
|
2710
|
+
//#region src/edit-mode/mobx-sync/deep-observe.ts
|
|
2757
2711
|
function buildPath(entry) {
|
|
2758
2712
|
if (!entry) return "ROOT";
|
|
2759
2713
|
const res = [];
|
|
@@ -2811,6 +2765,7 @@ function deepObserve(target, listener) {
|
|
|
2811
2765
|
const entry = entrySet.get(change.object[i]);
|
|
2812
2766
|
if (entry) entry.path = "" + i;
|
|
2813
2767
|
}
|
|
2768
|
+
break;
|
|
2814
2769
|
}
|
|
2815
2770
|
}
|
|
2816
2771
|
function observeRecursively(thing, parent, path) {
|
|
@@ -2843,7 +2798,8 @@ function deepObserve(target, listener) {
|
|
|
2843
2798
|
unobserveRecursively(target);
|
|
2844
2799
|
};
|
|
2845
2800
|
}
|
|
2846
|
-
|
|
2801
|
+
//#endregion
|
|
2802
|
+
//#region src/edit-mode/mobx-sync/mobx-editor-sync.ts
|
|
2847
2803
|
/**
|
|
2848
2804
|
* Syncs a mobx store to the editor automatically through postmessage
|
|
2849
2805
|
*/
|
|
@@ -2855,7 +2811,7 @@ function startEditorSync(options) {
|
|
|
2855
2811
|
name: `editor-sync(${storeId})`
|
|
2856
2812
|
};
|
|
2857
2813
|
let initialState;
|
|
2858
|
-
if (keys) initialState = sanitizedToJS(
|
|
2814
|
+
if (keys) initialState = sanitizedToJS(pick(store, Object.keys(keys)));
|
|
2859
2815
|
else if (projection) initialState = sanitizedToJS(projection(store));
|
|
2860
2816
|
else initialState = sanitizedToJS(store);
|
|
2861
2817
|
editorBridge.initializeEditorSyncedStore({
|
|
@@ -2947,7 +2903,8 @@ function startEditorSync(options) {
|
|
|
2947
2903
|
disposers.forEach((disposer) => disposer());
|
|
2948
2904
|
};
|
|
2949
2905
|
}
|
|
2950
|
-
|
|
2906
|
+
//#endregion
|
|
2907
|
+
//#region src/lib/internal-details/lib/features/type-defs-utils.ts
|
|
2951
2908
|
const analyzePropertyType = (propData, prop) => {
|
|
2952
2909
|
let dataType;
|
|
2953
2910
|
if (propData.dataType === "composite" && prop && typeof prop.getProps === "function") {
|
|
@@ -2966,13 +2923,13 @@ const analyzePropertyType = (propData, prop) => {
|
|
|
2966
2923
|
else dataType = "unknown";
|
|
2967
2924
|
return dataType;
|
|
2968
2925
|
};
|
|
2969
|
-
|
|
2926
|
+
//#endregion
|
|
2927
|
+
//#region src/lib/internal-details/lib/features/component-registry.ts
|
|
2970
2928
|
/**
|
|
2971
2929
|
* TODO: The component registry could be split into two a thin layer always on, and move some stuff to the EditStore.
|
|
2972
2930
|
* Some of the actions (rename, delete) and some of the data (isDroppable) are editor-only.
|
|
2973
2931
|
*/
|
|
2974
2932
|
var ComponentRegistry = class {
|
|
2975
|
-
rootStore;
|
|
2976
2933
|
_componentRegistry = /* @__PURE__ */ new Map();
|
|
2977
2934
|
_componentToType = /* @__PURE__ */ new WeakMap();
|
|
2978
2935
|
constructor(rootStore) {
|
|
@@ -3084,7 +3041,8 @@ var ComponentRegistry = class {
|
|
|
3084
3041
|
return this._componentToType.has(component);
|
|
3085
3042
|
}
|
|
3086
3043
|
};
|
|
3087
|
-
|
|
3044
|
+
//#endregion
|
|
3045
|
+
//#region src/lib/internal-details/lib/root-store.ts
|
|
3088
3046
|
const ORCHESTRATOR_EXECUTE_RESPONSE_SIZE_LIMIT_FLAG = "orchestrator.execute.response-size-limit.bytes";
|
|
3089
3047
|
/**
|
|
3090
3048
|
* Default user object for when no user info is available.
|
|
@@ -3292,629 +3250,7 @@ var RootStore = class {
|
|
|
3292
3250
|
}
|
|
3293
3251
|
};
|
|
3294
3252
|
var root_store_default = new RootStore();
|
|
3295
|
-
|
|
3296
|
-
|
|
3297
|
-
var _path2;
|
|
3298
|
-
var _path3;
|
|
3299
|
-
var _path4;
|
|
3300
|
-
var _path5;
|
|
3301
|
-
var _path6;
|
|
3302
|
-
var _path7;
|
|
3303
|
-
var _defs;
|
|
3304
|
-
function _extends$1() {
|
|
3305
|
-
return _extends$1 = Object.assign ? Object.assign.bind() : function(n) {
|
|
3306
|
-
for (var e = 1; e < arguments.length; e++) {
|
|
3307
|
-
var t = arguments[e];
|
|
3308
|
-
for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
|
|
3309
|
-
}
|
|
3310
|
-
return n;
|
|
3311
|
-
}, _extends$1.apply(null, arguments);
|
|
3312
|
-
}
|
|
3313
|
-
var SvgClark = function SvgClark(props) {
|
|
3314
|
-
return /*#__PURE__*/ React$1.createElement("svg", _extends$1({
|
|
3315
|
-
xmlns: "http://www.w3.org/2000/svg",
|
|
3316
|
-
width: 28,
|
|
3317
|
-
height: 20,
|
|
3318
|
-
fill: "none"
|
|
3319
|
-
}, props), _path$1 || (_path$1 = /*#__PURE__*/ React$1.createElement("path", {
|
|
3320
|
-
fill: "url(#clark_svg__a)",
|
|
3321
|
-
d: "M20.41 1.239a5.16 5.16 0 0 0-4.703 5.413l2.648-.232a2.227 2.227 0 1 1 2.886 2.49l.18 2.062.035.02c.575-.05 1.213-.454 1.57-.748 1.617-1.337 1.71-3.2 1.705-3.672 0-.063.047-.117.11-.123l.27-.024a.18.18 0 0 0 .167-.206c-.068-.444-.304-1.577-1.018-2.419-.064-.074-.019-.194.079-.203l.402-.035c.142-.012.218-.166.13-.28-.492-.64-1.994-2.26-4.46-2.043"
|
|
3322
|
-
})), _path2 || (_path2 = /*#__PURE__*/ React$1.createElement("path", {
|
|
3323
|
-
fill: "#2A333D",
|
|
3324
|
-
d: "M18.333 6.987a2.226 2.226 0 0 0 2.411 2.024l.555-.048c-.612-2.74-1.987-3.551-1.987-3.551.153-.386 1.044-.836 1.044-.836a2.226 2.226 0 0 0-2.023 2.411",
|
|
3325
|
-
opacity: .12
|
|
3326
|
-
})), _path3 || (_path3 = /*#__PURE__*/ React$1.createElement("path", {
|
|
3327
|
-
fill: "url(#clark_svg__b)",
|
|
3328
|
-
d: "m6.65 12.564.045.492-.228-2.607A2.338 2.338 0 1 1 8.58 6.587l2.588-.226a5.16 5.16 0 0 0-5.371-3.584c-2.467.216-3.665 2.072-4.039 2.787-.066.127.035.266.177.253l.403-.035c.097-.008.162.102.113.186-.558.953-.593 2.11-.583 2.56a.18.18 0 0 0 .2.173l.27-.023a.12.12 0 0 1 .13.101c.078.467.492 2.285 2.317 3.32.402.228 1.291.515 1.866.465"
|
|
3329
|
-
})), _path4 || (_path4 = /*#__PURE__*/ React$1.createElement("path", {
|
|
3330
|
-
fill: "#2A333D",
|
|
3331
|
-
d: "M9.161 7.938a2.337 2.337 0 0 1-2.124 2.53l-.582.052c.133-2.944 1.406-4.032 1.406-4.032-.227-.371-1.231-.675-1.231-.675A2.337 2.337 0 0 1 9.16 7.938",
|
|
3332
|
-
opacity: .12
|
|
3333
|
-
})), _path5 || (_path5 = /*#__PURE__*/ React$1.createElement("path", {
|
|
3334
|
-
fill: "currentColor",
|
|
3335
|
-
fillRule: "evenodd",
|
|
3336
|
-
d: "M21.72 10.543c-.461-3.366-2.697-6.01-6.685-6.252-.109-.006-.163-.01-.202-.031a.2.2 0 0 1-.078-.084c-.02-.04-.02-.092-.02-.197v-.572a.192.192 0 0 0-.308-.153l-.938.708a.192.192 0 0 1-.309-.154v-.361a.192.192 0 0 0-.318-.145l-.807.717a9 9 0 0 1-.5.431 2 2 0 0 1-.305.2c-.119.069-.414.205-1.004.477-2.794 1.29-4.104 3.885-3.852 6.757.43 4.911 3.404 6.652 8.266 6.226 4.215-.368 7.758-2.469 7.06-7.567M11.64 10.2c.142.62-.16 1.221-.678 1.34-.518.12-1.053-.286-1.197-.907a1.3 1.3 0 0 1-.018-.521.384.384 0 1 0 .376-.667.8.8 0 0 1 .32-.153c.517-.12 1.053.287 1.196.908m7.042-.148c.51-.146.782-.761.606-1.374-.176-.612-.732-.99-1.242-.844a.83.83 0 0 0-.375.23.384.384 0 1 1-.284.713q-.01.211.052.431c.176.613.732.99 1.243.844m-5.448 3.596-.253-2.896a2.08 2.08 0 0 1 4.092-.685l.704 2.82a2.31 2.31 0 1 1-4.543.761",
|
|
3337
|
-
clipRule: "evenodd"
|
|
3338
|
-
})), _path6 || (_path6 = /*#__PURE__*/ React$1.createElement("path", {
|
|
3339
|
-
fill: "url(#clark_svg__c)",
|
|
3340
|
-
d: "M13.88 14.096a2.3 2.3 0 0 0 1.847.492 2.3 2.3 0 0 0 1.585-1.066 1.79 1.79 0 0 1-3.431.574",
|
|
3341
|
-
opacity: .5
|
|
3342
|
-
})), _path7 || (_path7 = /*#__PURE__*/ React$1.createElement("path", {
|
|
3343
|
-
fill: "url(#clark_svg__d)",
|
|
3344
|
-
d: "M13.191 13.144a2.312 2.312 0 0 0 4.465-.748l.123.491a2.31 2.31 0 1 1-4.544.761z",
|
|
3345
|
-
opacity: .5
|
|
3346
|
-
})), _defs || (_defs = /*#__PURE__*/ React$1.createElement("defs", null, /*#__PURE__*/ React$1.createElement("linearGradient", {
|
|
3347
|
-
id: "clark_svg__a",
|
|
3348
|
-
x1: 21.636,
|
|
3349
|
-
x2: 17.027,
|
|
3350
|
-
y1: 4.149,
|
|
3351
|
-
y2: 8.785,
|
|
3352
|
-
gradientUnits: "userSpaceOnUse"
|
|
3353
|
-
}, /*#__PURE__*/ React$1.createElement("stop", { stopColor: "currentColor" }), /*#__PURE__*/ React$1.createElement("stop", {
|
|
3354
|
-
offset: 1,
|
|
3355
|
-
stopColor: "currentColor",
|
|
3356
|
-
stopOpacity: .84
|
|
3357
|
-
})), /*#__PURE__*/ React$1.createElement("linearGradient", {
|
|
3358
|
-
id: "clark_svg__b",
|
|
3359
|
-
x1: 4.534,
|
|
3360
|
-
x2: 10.643,
|
|
3361
|
-
y1: 6.603,
|
|
3362
|
-
y2: 9.712,
|
|
3363
|
-
gradientUnits: "userSpaceOnUse"
|
|
3364
|
-
}, /*#__PURE__*/ React$1.createElement("stop", { stopColor: "currentColor" }), /*#__PURE__*/ React$1.createElement("stop", {
|
|
3365
|
-
offset: 1,
|
|
3366
|
-
stopColor: "currentColor",
|
|
3367
|
-
stopOpacity: .84
|
|
3368
|
-
})), /*#__PURE__*/ React$1.createElement("linearGradient", {
|
|
3369
|
-
id: "clark_svg__c",
|
|
3370
|
-
x1: 15.788,
|
|
3371
|
-
x2: 16.004,
|
|
3372
|
-
y1: 13.866,
|
|
3373
|
-
y2: 15.093,
|
|
3374
|
-
gradientUnits: "userSpaceOnUse"
|
|
3375
|
-
}, /*#__PURE__*/ React$1.createElement("stop", {
|
|
3376
|
-
stopColor: "currentColor",
|
|
3377
|
-
stopOpacity: .6
|
|
3378
|
-
}), /*#__PURE__*/ React$1.createElement("stop", {
|
|
3379
|
-
offset: 1,
|
|
3380
|
-
stopColor: "currentColor"
|
|
3381
|
-
})), /*#__PURE__*/ React$1.createElement("linearGradient", {
|
|
3382
|
-
id: "clark_svg__d",
|
|
3383
|
-
x1: 15.704,
|
|
3384
|
-
x2: 16.07,
|
|
3385
|
-
y1: 13.597,
|
|
3386
|
-
y2: 15.67,
|
|
3387
|
-
gradientUnits: "userSpaceOnUse"
|
|
3388
|
-
}, /*#__PURE__*/ React$1.createElement("stop", {
|
|
3389
|
-
stopColor: "currentColor",
|
|
3390
|
-
stopOpacity: .6
|
|
3391
|
-
}), /*#__PURE__*/ React$1.createElement("stop", {
|
|
3392
|
-
offset: 1,
|
|
3393
|
-
stopColor: "currentColor"
|
|
3394
|
-
})))));
|
|
3395
|
-
};
|
|
3396
|
-
// src/lib/internal-details/internal-components/common.ts
|
|
3397
|
-
const ErrorIconContainer = styled.div`
|
|
3398
|
-
width: 60px;
|
|
3399
|
-
height: 60px;
|
|
3400
|
-
min-width: 60px;
|
|
3401
|
-
min-height: 60px;
|
|
3402
|
-
background: linear-gradient(135deg, #aab 0%, #000033 50%, #000066 100%);
|
|
3403
|
-
border-radius: 16px;
|
|
3404
|
-
display: flex;
|
|
3405
|
-
align-items: center;
|
|
3406
|
-
justify-content: center;
|
|
3407
|
-
margin: 0 auto 16px;
|
|
3408
|
-
flex-shrink: 0;
|
|
3409
|
-
animation: scaleIn 0.3s ease-out forwards;
|
|
3410
|
-
opacity: 0;
|
|
3411
|
-
box-shadow:
|
|
3412
|
-
0 0 1px black,
|
|
3413
|
-
0 4px 12px rgba(0, 85, 187, 0.15),
|
|
3414
|
-
0 2px 4px rgba(0, 85, 187, 0.05);
|
|
3415
|
-
|
|
3416
|
-
@keyframes scaleIn {
|
|
3417
|
-
from {
|
|
3418
|
-
transform: scale(0.8);
|
|
3419
|
-
opacity: 0;
|
|
3420
|
-
}
|
|
3421
|
-
to {
|
|
3422
|
-
transform: scale(1);
|
|
3423
|
-
opacity: 1;
|
|
3424
|
-
}
|
|
3425
|
-
}
|
|
3426
|
-
`;
|
|
3427
|
-
const StyledClarkIcon = styled(SvgClark)`
|
|
3428
|
-
width: 54px;
|
|
3429
|
-
height: 54px;
|
|
3430
|
-
color: white;
|
|
3431
|
-
margin-top: 3px;
|
|
3432
|
-
margin-left: 1px;
|
|
3433
|
-
animation: scaleIn 0.7s cubic-bezier(0.34, 1.56, 0.64, 1) forwards;
|
|
3434
|
-
opacity: 0;
|
|
3435
|
-
|
|
3436
|
-
@keyframes scaleIn {
|
|
3437
|
-
0% {
|
|
3438
|
-
transform: scale(0.6);
|
|
3439
|
-
opacity: 0;
|
|
3440
|
-
}
|
|
3441
|
-
50% {
|
|
3442
|
-
transform: scale(1.1);
|
|
3443
|
-
}
|
|
3444
|
-
100% {
|
|
3445
|
-
transform: scale(1);
|
|
3446
|
-
opacity: 1;
|
|
3447
|
-
}
|
|
3448
|
-
}
|
|
3449
|
-
`;
|
|
3450
|
-
const ErrorTitle = styled.h2`
|
|
3451
|
-
font-family: Inter;
|
|
3452
|
-
color: rgba(0, 0, 0, 0.85);
|
|
3453
|
-
font-weight: 600;
|
|
3454
|
-
font-size: 24px;
|
|
3455
|
-
line-height: 1.35;
|
|
3456
|
-
text-align: center;
|
|
3457
|
-
margin-bottom: 6px;
|
|
3458
|
-
flex-shrink: 0;
|
|
3459
|
-
`;
|
|
3460
|
-
const ErrorMessage = styled.p`
|
|
3461
|
-
font-family: Inter;
|
|
3462
|
-
font-size: 14px;
|
|
3463
|
-
color: #6c7689;
|
|
3464
|
-
line-height: 1.5715;
|
|
3465
|
-
text-align: center;
|
|
3466
|
-
flex-shrink: 0;
|
|
3467
|
-
margin-top: 0;
|
|
3468
|
-
margin-bottom: 16px;
|
|
3469
|
-
`;
|
|
3470
|
-
const ErrorDetails = styled.details`
|
|
3471
|
-
margin-top: 24px;
|
|
3472
|
-
text-align: left;
|
|
3473
|
-
background-color: #f9fafb;
|
|
3474
|
-
border-radius: 6px;
|
|
3475
|
-
padding: 16px;
|
|
3476
|
-
box-shadow:
|
|
3477
|
-
0px 0px 1px 0px #22272f52,
|
|
3478
|
-
0px 1px 3px 0px #22272f1f;
|
|
3479
|
-
flex-shrink: 0;
|
|
3480
|
-
font-family: Inter;
|
|
3481
|
-
|
|
3482
|
-
&[open] summary {
|
|
3483
|
-
margin-bottom: 12px;
|
|
3484
|
-
}
|
|
3485
|
-
`;
|
|
3486
|
-
const ErrorSummary = styled.summary`
|
|
3487
|
-
cursor: pointer;
|
|
3488
|
-
font-weight: 500;
|
|
3489
|
-
color: #374151;
|
|
3490
|
-
font-size: 14px;
|
|
3491
|
-
user-select: none;
|
|
3492
|
-
`;
|
|
3493
|
-
const ErrorStack = styled.pre`
|
|
3494
|
-
font-size: 12px;
|
|
3495
|
-
color: #dc2626;
|
|
3496
|
-
overflow: auto;
|
|
3497
|
-
white-space: pre-wrap;
|
|
3498
|
-
margin: 16px;
|
|
3499
|
-
font-family: monospace;
|
|
3500
|
-
`;
|
|
3501
|
-
const ErrorContainer = styled.div`
|
|
3502
|
-
position: absolute;
|
|
3503
|
-
inset: 0;
|
|
3504
|
-
display: flex;
|
|
3505
|
-
align-items: center;
|
|
3506
|
-
justify-content: center;
|
|
3507
|
-
z-index: 10;
|
|
3508
|
-
background: rgba(255, 255, 255, 0.5);
|
|
3509
|
-
pointer-events: auto;
|
|
3510
|
-
`;
|
|
3511
|
-
const ErrorContent = styled.div`
|
|
3512
|
-
max-width: 700px;
|
|
3513
|
-
padding: 40px;
|
|
3514
|
-
overflow-y: auto;
|
|
3515
|
-
flex: 1;
|
|
3516
|
-
display: flex;
|
|
3517
|
-
flex-direction: column;
|
|
3518
|
-
gap: 20px;
|
|
3519
|
-
|
|
3520
|
-
opacity: 0;
|
|
3521
|
-
animation: fadeIn 0.3s ease-out forwards;
|
|
3522
|
-
|
|
3523
|
-
@keyframes fadeIn {
|
|
3524
|
-
from {
|
|
3525
|
-
opacity: 0;
|
|
3526
|
-
}
|
|
3527
|
-
to {
|
|
3528
|
-
opacity: 1;
|
|
3529
|
-
}
|
|
3530
|
-
}
|
|
3531
|
-
`;
|
|
3532
|
-
const SecondaryButton = styled.button`
|
|
3533
|
-
color: ${colors.GREY_700};
|
|
3534
|
-
border: 1px solid ${colors.GREY_100};
|
|
3535
|
-
width: fit-content;
|
|
3536
|
-
border-radius: 4px;
|
|
3537
|
-
padding: 6px 12px;
|
|
3538
|
-
cursor: pointer;
|
|
3539
|
-
height: fit-content;
|
|
3540
|
-
font-size: 12px;
|
|
3541
|
-
|
|
3542
|
-
&:hover {
|
|
3543
|
-
opacity: 0.8;
|
|
3544
|
-
}
|
|
3545
|
-
|
|
3546
|
-
&:active {
|
|
3547
|
-
opacity: 0.6;
|
|
3548
|
-
}
|
|
3549
|
-
`;
|
|
3550
|
-
const ActionsContainer = styled.div`
|
|
3551
|
-
display: flex;
|
|
3552
|
-
gap: 12px;
|
|
3553
|
-
align-items: center;
|
|
3554
|
-
justify-content: center;
|
|
3555
|
-
`;
|
|
3556
|
-
// src/edit-mode/assets/ai-stars.svg
|
|
3557
|
-
var _path;
|
|
3558
|
-
function _extends() {
|
|
3559
|
-
return _extends = Object.assign ? Object.assign.bind() : function(n) {
|
|
3560
|
-
for (var e = 1; e < arguments.length; e++) {
|
|
3561
|
-
var t = arguments[e];
|
|
3562
|
-
for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
|
|
3563
|
-
}
|
|
3564
|
-
return n;
|
|
3565
|
-
}, _extends.apply(null, arguments);
|
|
3566
|
-
}
|
|
3567
|
-
var SvgAiStars = function SvgAiStars(props) {
|
|
3568
|
-
return /*#__PURE__*/ React$1.createElement("svg", _extends({
|
|
3569
|
-
xmlns: "http://www.w3.org/2000/svg",
|
|
3570
|
-
width: 13,
|
|
3571
|
-
height: 14,
|
|
3572
|
-
fill: "none"
|
|
3573
|
-
}, props), _path || (_path = /*#__PURE__*/ React$1.createElement("path", {
|
|
3574
|
-
fill: "currentColor",
|
|
3575
|
-
fillRule: "evenodd",
|
|
3576
|
-
d: "M10.5.9a.6.6 0 0 1 .586.472l.133.605a.4.4 0 0 0 .305.305l.605.132a.6.6 0 0 1 0 1.172l-.605.133a.4.4 0 0 0-.305.305l-.133.605a.6.6 0 0 1-1.172 0l-.132-.605a.4.4 0 0 0-.305-.305l-.605-.133a.6.6 0 0 1 0-1.172l.605-.132a.4.4 0 0 0 .305-.305l.132-.605A.6.6 0 0 1 10.5.9M5.077 3.833a.6.6 0 0 0-1.153 0l-.215.74A2.4 2.4 0 0 1 2.074 6.21l-.741.215a.6.6 0 0 0 0 1.153l.74.215A2.4 2.4 0 0 1 3.71 9.427l.215.74a.6.6 0 0 0 1.153 0l.215-.74a2.4 2.4 0 0 1 1.635-1.635l.74-.215a.6.6 0 0 0 0-1.153l-.74-.215a2.4 2.4 0 0 1-1.635-1.635zm6.01 5.539a.6.6 0 0 0-1.173 0l-.132.605a.4.4 0 0 1-.305.305l-.605.133a.6.6 0 0 0 0 1.172l.605.132a.4.4 0 0 1 .305.305l.132.605a.6.6 0 0 0 1.172 0l.133-.605a.4.4 0 0 1 .305-.305l.605-.132a.6.6 0 0 0 0-1.172l-.605-.133a.4.4 0 0 1-.305-.305z",
|
|
3577
|
-
clipRule: "evenodd"
|
|
3578
|
-
})));
|
|
3579
|
-
};
|
|
3580
|
-
// src/lib/internal-details/internal-components/fix-with-clark-button.tsx
|
|
3581
|
-
const MAX_STACK_FRAMES = 10;
|
|
3582
|
-
const MAX_PROMPT_LENGTH = 8e3;
|
|
3583
|
-
function buildRuntimeErrorPrompt(error) {
|
|
3584
|
-
const defaultPrompt = "Fix this error: Unknown error";
|
|
3585
|
-
if (!error) return defaultPrompt;
|
|
3586
|
-
const [messageLine, ...rawFrames] = error.stack?.split("\n") ?? [];
|
|
3587
|
-
const message = (messageLine || error.message || error.toString()).trim();
|
|
3588
|
-
const filteredFrames = rawFrames.filter((line) => line && !line.includes("node_modules"));
|
|
3589
|
-
const selectedFrames = filteredFrames.slice(0, MAX_STACK_FRAMES);
|
|
3590
|
-
const omittedCount = filteredFrames.length - selectedFrames.length;
|
|
3591
|
-
const frameSection = [...selectedFrames, ...omittedCount > 0 ? [`... (${omittedCount} additional frame${omittedCount > 1 ? "s" : ""} omitted)`] : []].map((line) => line.trimEnd()).join("\n");
|
|
3592
|
-
const prompt = `Fix this error: ${frameSection ? `${message}\n${frameSection}` : message}`;
|
|
3593
|
-
if (prompt.length <= MAX_PROMPT_LENGTH) return prompt;
|
|
3594
|
-
const suffix = "... (truncated)";
|
|
3595
|
-
const availableChars = Math.max(7985, 0);
|
|
3596
|
-
return `${prompt.slice(0, availableChars)}${suffix}`;
|
|
3597
|
-
}
|
|
3598
|
-
const FixWithClarkButtonContainer = styled.button`
|
|
3599
|
-
padding: 6px 12px;
|
|
3600
|
-
background-color: ${colors.ACCENT_BLUE_500};
|
|
3601
|
-
border-radius: 4px;
|
|
3602
|
-
border: none;
|
|
3603
|
-
color: white;
|
|
3604
|
-
height: fit-content;
|
|
3605
|
-
display: flex;
|
|
3606
|
-
gap: 4px;
|
|
3607
|
-
cursor: pointer;
|
|
3608
|
-
transition: opacity 0.2s;
|
|
3609
|
-
font-size: 12px;
|
|
3610
|
-
align-items: center;
|
|
3611
|
-
|
|
3612
|
-
&:hover:not(:disabled) {
|
|
3613
|
-
opacity: 0.8;
|
|
3614
|
-
}
|
|
3615
|
-
|
|
3616
|
-
&:disabled {
|
|
3617
|
-
opacity: 0.5;
|
|
3618
|
-
cursor: not-allowed;
|
|
3619
|
-
}
|
|
3620
|
-
`;
|
|
3621
|
-
function FixWithClarkButton({ identifier, error, onClick }) {
|
|
3622
|
-
const isAiEditing = root_store_default.editStore?.ai.getIsEditing() ?? false;
|
|
3623
|
-
const handleFixWithAi = () => {
|
|
3624
|
-
onClick?.();
|
|
3625
|
-
if (identifier) editorBridge.addComponentToAiContext(identifier.sourceId, identifier.selectorId);
|
|
3626
|
-
const prompt = buildRuntimeErrorPrompt(error);
|
|
3627
|
-
editorBridge.aiGenerate(prompt, true);
|
|
3628
|
-
};
|
|
3629
|
-
return /* @__PURE__ */ jsxs(FixWithClarkButtonContainer, {
|
|
3630
|
-
onClick: handleFixWithAi,
|
|
3631
|
-
disabled: isAiEditing,
|
|
3632
|
-
children: [/* @__PURE__ */ jsx(SvgAiStars, {}), " Fix with Clark"]
|
|
3633
|
-
});
|
|
3634
|
-
}
|
|
3635
|
-
// src/lib/internal-details/css-constants.ts
|
|
3636
|
-
const CSS_CLASSES = {
|
|
3637
|
-
SUSPENSE_FALLBACK: "sb-suspense-fallback",
|
|
3638
|
-
ANCHOR_NAME: "sb-anchor-name"
|
|
3639
|
-
};
|
|
3640
|
-
// src/lib/internal-details/lib/suspense/suspense-fallback.tsx
|
|
3641
|
-
const shimmerAnimation = keyframes`
|
|
3642
|
-
0% {
|
|
3643
|
-
background-position: -200px 0;
|
|
3644
|
-
}
|
|
3645
|
-
100% {
|
|
3646
|
-
background-position: calc(200px + 100%) 0;
|
|
3647
|
-
}
|
|
3648
|
-
`;
|
|
3649
|
-
const ShimmerDiv = styled.div`
|
|
3650
|
-
min-height: 12px;
|
|
3651
|
-
min-width: 12px;
|
|
3652
|
-
background-color: ${(props) => props.$backgroundColor};
|
|
3653
|
-
border-radius: ${(props) => props.$borderRadius};
|
|
3654
|
-
position: relative;
|
|
3655
|
-
overflow: hidden;
|
|
3656
|
-
background: linear-gradient(
|
|
3657
|
-
90deg,
|
|
3658
|
-
${(props) => props.$backgroundColor} 25%,
|
|
3659
|
-
${(props) => props.$shimmerHighlight} 50%,
|
|
3660
|
-
${(props) => props.$backgroundColor} 75%
|
|
3661
|
-
);
|
|
3662
|
-
background-size: max(100%, 200px) 100%;
|
|
3663
|
-
animation: ${shimmerAnimation} 5s infinite linear;
|
|
3664
|
-
`;
|
|
3665
|
-
/**
|
|
3666
|
-
* Default fallback component displayed while components are suspended.
|
|
3667
|
-
*/
|
|
3668
|
-
function SuspenseFallback({ style, className, noBorderRadius }) {
|
|
3669
|
-
const backgroundColor = "#f8f9fa";
|
|
3670
|
-
const shimmerHighlight = "#ffffff";
|
|
3671
|
-
const borderRadius = noBorderRadius ? "0px" : "4px";
|
|
3672
|
-
const classes = useMemo(() => [CSS_CLASSES.ANCHOR_NAME, className].filter(Boolean).join(" "), [className]);
|
|
3673
|
-
return /* @__PURE__ */ jsx(ShimmerDiv, {
|
|
3674
|
-
$backgroundColor: backgroundColor,
|
|
3675
|
-
$shimmerHighlight: shimmerHighlight,
|
|
3676
|
-
$borderRadius: borderRadius,
|
|
3677
|
-
style: style?.(),
|
|
3678
|
-
className: classes,
|
|
3679
|
-
"data-test": "suspense-fallback"
|
|
3680
|
-
});
|
|
3681
|
-
}
|
|
3682
|
-
// src/lib/user-facing/component-base/error-boundary.tsx
|
|
3683
|
-
const ErrorBoundaryContainer = styled.div`
|
|
3684
|
-
background: white;
|
|
3685
|
-
padding: 10px;
|
|
3686
|
-
display: flex;
|
|
3687
|
-
flex-direction: column;
|
|
3688
|
-
gap: 8px;
|
|
3689
|
-
border: 1px solid ${colors.GREY_100};
|
|
3690
|
-
border-left: 3px solid ${colors.RED_500};
|
|
3691
|
-
border-radius: 4px;
|
|
3692
|
-
width: 100%;
|
|
3693
|
-
color: ${colors.GREY_700};
|
|
3694
|
-
`;
|
|
3695
|
-
const ErrorDetailsContainer = styled.div`
|
|
3696
|
-
display: flex;
|
|
3697
|
-
flex-direction: column;
|
|
3698
|
-
gap: 8px;
|
|
3699
|
-
`;
|
|
3700
|
-
const ErrorActionsContainer = styled.div`
|
|
3701
|
-
display: flex;
|
|
3702
|
-
justify-content: flex-end;
|
|
3703
|
-
align-items: center;
|
|
3704
|
-
gap: 8px;
|
|
3705
|
-
`;
|
|
3706
|
-
var ErrorBoundary = class extends Component {
|
|
3707
|
-
state = {
|
|
3708
|
-
id: generateId(),
|
|
3709
|
-
hasError: false
|
|
3710
|
-
};
|
|
3711
|
-
disposeAutoReset;
|
|
3712
|
-
static getDerivedStateFromError(e) {
|
|
3713
|
-
const error = e instanceof Error ? e : new Error(typeof e === "object" && e !== null ? JSON.stringify(e) : String(e));
|
|
3714
|
-
return {
|
|
3715
|
-
id: generateId(),
|
|
3716
|
-
hasError: true,
|
|
3717
|
-
error
|
|
3718
|
-
};
|
|
3719
|
-
}
|
|
3720
|
-
componentDidCatch(error, errorInfo) {
|
|
3721
|
-
if (isEditMode()) root_store_default.editStore?.ai.handleRuntimeError({
|
|
3722
|
-
id: this.state.id,
|
|
3723
|
-
error: String(error),
|
|
3724
|
-
errorInfo,
|
|
3725
|
-
identifier: this.props.identifier
|
|
3726
|
-
});
|
|
3727
|
-
}
|
|
3728
|
-
reset = () => {
|
|
3729
|
-
if (isEditMode()) root_store_default.editStore?.ai.clearRuntimeError(this.state.id);
|
|
3730
|
-
this.setState({
|
|
3731
|
-
hasError: false,
|
|
3732
|
-
error: void 0
|
|
3733
|
-
});
|
|
3734
|
-
};
|
|
3735
|
-
componentWillUnmount() {
|
|
3736
|
-
if (this.state.hasError && isEditMode()) root_store_default.editStore?.ai.clearRuntimeError(this.state.id);
|
|
3737
|
-
this.disposeAutoReset?.();
|
|
3738
|
-
}
|
|
3739
|
-
handleFixWithClarkInitiated = () => {
|
|
3740
|
-
const ai = root_store_default.editStore?.ai;
|
|
3741
|
-
if (!ai) return;
|
|
3742
|
-
this.disposeAutoReset?.();
|
|
3743
|
-
this.disposeAutoReset = void 0;
|
|
3744
|
-
let sawStart = ai.getIsEditing();
|
|
3745
|
-
this.disposeAutoReset = reaction(() => ai.getIsEditing(), (isEditing) => {
|
|
3746
|
-
if (!sawStart && isEditing) sawStart = true;
|
|
3747
|
-
if (sawStart && !isEditing) {
|
|
3748
|
-
this.reset();
|
|
3749
|
-
this.disposeAutoReset?.();
|
|
3750
|
-
this.disposeAutoReset = void 0;
|
|
3751
|
-
}
|
|
3752
|
-
}, {
|
|
3753
|
-
fireImmediately: true,
|
|
3754
|
-
name: "error-boundary-ai-auto-reset"
|
|
3755
|
-
});
|
|
3756
|
-
};
|
|
3757
|
-
handleFixWithAi() {
|
|
3758
|
-
const { identifier } = this.props;
|
|
3759
|
-
if (identifier) editorBridge.addComponentToAiContext(identifier.sourceId, identifier.selectorId);
|
|
3760
|
-
let prompt = `Fix this error: `;
|
|
3761
|
-
if (this.state.error?.stack) {
|
|
3762
|
-
const lines = this.state.error.stack.split("\n");
|
|
3763
|
-
const nodeModulesIndex = lines.findIndex((line) => line.includes("node_modules"));
|
|
3764
|
-
const relevantLines = nodeModulesIndex > -1 ? lines.slice(0, nodeModulesIndex) : lines;
|
|
3765
|
-
prompt += relevantLines.slice(0, 5).join("\n");
|
|
3766
|
-
} else prompt += this.state.error?.toString();
|
|
3767
|
-
editorBridge.aiGenerate(prompt);
|
|
3768
|
-
}
|
|
3769
|
-
render() {
|
|
3770
|
-
if (this.state.hasError) return /* @__PURE__ */ jsx(Observer, { children: () => {
|
|
3771
|
-
if (root_store_default.editStore?.ai.getIsEditing() ?? false) return /* @__PURE__ */ jsx(SuspenseFallback, {});
|
|
3772
|
-
return /* @__PURE__ */ jsxs(ErrorBoundaryContainer, { children: [/* @__PURE__ */ jsxs(ErrorDetailsContainer, {
|
|
3773
|
-
"data-testid": "runtime-error-details",
|
|
3774
|
-
children: [/* @__PURE__ */ jsx("h3", { children: this.props.header || "Something went wrong." }), /* @__PURE__ */ jsxs("details", {
|
|
3775
|
-
style: { fontSize: "0.8em" },
|
|
3776
|
-
children: [/* @__PURE__ */ jsx("summary", {
|
|
3777
|
-
style: { paddingLeft: "0.25rem" },
|
|
3778
|
-
children: "Error details"
|
|
3779
|
-
}), /* @__PURE__ */ jsx("div", {
|
|
3780
|
-
style: {
|
|
3781
|
-
marginTop: "0.5rem",
|
|
3782
|
-
maxWidth: "100%",
|
|
3783
|
-
overflowX: "auto",
|
|
3784
|
-
scrollbarWidth: "thin"
|
|
3785
|
-
},
|
|
3786
|
-
children: /* @__PURE__ */ jsx("pre", {
|
|
3787
|
-
style: { color: "gray" },
|
|
3788
|
-
children: /* @__PURE__ */ jsx("code", { children: this.state.error?.stack ? this.state.error.stack : this.state.error?.toString() })
|
|
3789
|
-
})
|
|
3790
|
-
})]
|
|
3791
|
-
})]
|
|
3792
|
-
}), /* @__PURE__ */ jsxs(ErrorActionsContainer, { children: [isEditMode() && /* @__PURE__ */ jsx(FixWithClarkButton, {
|
|
3793
|
-
onClick: this.handleFixWithClarkInitiated,
|
|
3794
|
-
error: this.state.error,
|
|
3795
|
-
identifier: this.props.identifier
|
|
3796
|
-
}), /* @__PURE__ */ jsx(SecondaryButton, {
|
|
3797
|
-
onClick: this.reset,
|
|
3798
|
-
children: "Try again"
|
|
3799
|
-
})] })] });
|
|
3800
|
-
} });
|
|
3801
|
-
return this.props.children;
|
|
3802
|
-
}
|
|
3803
|
-
};
|
|
3804
|
-
// src/lib/utils/widget-wrapper-naming.ts
|
|
3805
|
-
const getWidgetAnchorName = (selectorId) => {
|
|
3806
|
-
return `--widget-${selectorId}`;
|
|
3807
|
-
};
|
|
3808
|
-
const getWidgetRectAnchorName = (selectorId) => {
|
|
3809
|
-
return `--widget-rect-${selectorId}`;
|
|
3810
|
-
};
|
|
3811
|
-
// src/edit-mode/edit-wrapper.tsx
|
|
3812
|
-
if (typeof window !== "undefined" && typeof document.documentElement !== "undefined" && !("anchorName" in document.documentElement.style) && isEditMode()) import("@oddbird/css-anchor-positioning/fn").then(({ default: polyfill }) => polyfill()).catch((error) => console.warn("Failed to load the CSS anchor positioning polyfill", error));
|
|
3813
|
-
const createAnchorNameStyle = (props) => {
|
|
3814
|
-
return { "--anchor-name": getWidgetAnchorName(props.selectorId) };
|
|
3815
|
-
};
|
|
3816
|
-
// src/edit-mode/instance-tracker.ts
|
|
3817
|
-
/**
|
|
3818
|
-
* Tracks and recycles instance numbers for each sourceId to generate stable, unique selector IDs.
|
|
3819
|
-
* When components unmount, their instance numbers are released and can be reused.
|
|
3820
|
-
*/
|
|
3821
|
-
var InstanceTracker = class {
|
|
3822
|
-
sourceIdToUsedInstances = /* @__PURE__ */ new Map();
|
|
3823
|
-
getNextAvailableInstance(sourceId) {
|
|
3824
|
-
const usedInstances = this.sourceIdToUsedInstances.get(sourceId) ?? /* @__PURE__ */ new Set();
|
|
3825
|
-
let instance = 0;
|
|
3826
|
-
while (usedInstances.has(instance)) instance++;
|
|
3827
|
-
usedInstances.add(instance);
|
|
3828
|
-
this.sourceIdToUsedInstances.set(sourceId, usedInstances);
|
|
3829
|
-
return instance;
|
|
3830
|
-
}
|
|
3831
|
-
releaseInstance(sourceId, instance) {
|
|
3832
|
-
const usedInstances = this.sourceIdToUsedInstances.get(sourceId);
|
|
3833
|
-
if (usedInstances) {
|
|
3834
|
-
usedInstances.delete(instance);
|
|
3835
|
-
if (usedInstances.size === 0) this.sourceIdToUsedInstances.delete(sourceId);
|
|
3836
|
-
}
|
|
3837
|
-
}
|
|
3838
|
-
};
|
|
3839
|
-
const instanceTracker = new InstanceTracker();
|
|
3840
|
-
// src/edit-mode/jsx-wrapper.tsx
|
|
3841
|
-
const JSXContext = React.createContext({
|
|
3842
|
-
selectorId: "S-<unknown>",
|
|
3843
|
-
sourceId: "SB-<unknown>"
|
|
3844
|
-
});
|
|
3845
|
-
const makeWrappedComponent = (type) => {
|
|
3846
|
-
const isTag = typeof type === "string";
|
|
3847
|
-
const isRegisteredSbComponent = root_store_default.componentRegistry.hasComponent(type);
|
|
3848
|
-
const Component = React.forwardRef((props, ref) => {
|
|
3849
|
-
const { selectorId: parentSelectorId } = useJSXContext();
|
|
3850
|
-
const sourceId = props[SOURCE_ID_ATTRIBUTE];
|
|
3851
|
-
const noSelect = props[NO_SELECT_ATTRIBUTE];
|
|
3852
|
-
const instanceNumberRef = useRef();
|
|
3853
|
-
const selectorId = useRef("S-<unknown>");
|
|
3854
|
-
if (selectorId.current === "S-<unknown>") {
|
|
3855
|
-
instanceNumberRef.current = instanceTracker.getNextAvailableInstance(sourceId);
|
|
3856
|
-
selectorId.current = `S-x-${sourceId}-${instanceNumberRef.current}`;
|
|
3857
|
-
}
|
|
3858
|
-
useEffect(() => {
|
|
3859
|
-
root_store_default.editStore?.runtimeTrackingStore.registerComponent(selectorId.current, {
|
|
3860
|
-
sourceId,
|
|
3861
|
-
type,
|
|
3862
|
-
parentSelectorId,
|
|
3863
|
-
isSbComponent: isRegisteredSbComponent,
|
|
3864
|
-
isHtmlElement: isTag,
|
|
3865
|
-
noSelect
|
|
3866
|
-
});
|
|
3867
|
-
return () => {
|
|
3868
|
-
root_store_default.editStore?.runtimeTrackingStore.unregisterComponent(selectorId.current);
|
|
3869
|
-
if (instanceNumberRef.current !== void 0) instanceTracker.releaseInstance(sourceId, instanceNumberRef.current);
|
|
3870
|
-
};
|
|
3871
|
-
}, []);
|
|
3872
|
-
const disabled = Boolean(props.disabled);
|
|
3873
|
-
useEffect(() => {
|
|
3874
|
-
root_store_default.editStore?.runtimeTrackingStore.setComponentDisabled(selectorId.current, disabled);
|
|
3875
|
-
}, [disabled]);
|
|
3876
|
-
const jsxContext = useMemo(() => ({
|
|
3877
|
-
selectorId: selectorId.current,
|
|
3878
|
-
sourceId
|
|
3879
|
-
}), [sourceId]);
|
|
3880
|
-
const selectorProps = { [SELECTOR_ID_ATTRIBUTE]: selectorId.current };
|
|
3881
|
-
if (parentSelectorId) selectorProps["data-sb-parent-selector-id"] = parentSelectorId;
|
|
3882
|
-
const { style: propsStyle, className: propsClassName } = props;
|
|
3883
|
-
const style = useMemo(() => {
|
|
3884
|
-
return {
|
|
3885
|
-
...propsStyle,
|
|
3886
|
-
...createAnchorNameStyle({ selectorId: selectorId.current })
|
|
3887
|
-
};
|
|
3888
|
-
}, [propsStyle]);
|
|
3889
|
-
const className = useMemo(() => {
|
|
3890
|
-
return typeof propsClassName === "function" ? (...args) => ["sb-anchor-name", propsClassName(...args)].filter(Boolean).join(" ") : ["sb-anchor-name", propsClassName].filter(Boolean).join(" ");
|
|
3891
|
-
}, [propsClassName]);
|
|
3892
|
-
const element = React.createElement(type, {
|
|
3893
|
-
ref,
|
|
3894
|
-
...props,
|
|
3895
|
-
...selectorProps,
|
|
3896
|
-
className,
|
|
3897
|
-
style
|
|
3898
|
-
});
|
|
3899
|
-
if (!root_store_default.editStore?.isInitialized) return /* @__PURE__ */ jsx(JSXContext.Provider, {
|
|
3900
|
-
value: jsxContext,
|
|
3901
|
-
children: element
|
|
3902
|
-
});
|
|
3903
|
-
return /* @__PURE__ */ jsx(JSXContext.Provider, {
|
|
3904
|
-
value: jsxContext,
|
|
3905
|
-
children: /* @__PURE__ */ jsx(ErrorBoundary, { children: element })
|
|
3906
|
-
});
|
|
3907
|
-
});
|
|
3908
|
-
try {
|
|
3909
|
-
Component.displayName = typeof type === "string" ? type : type.displayName || type.name || "Component";
|
|
3910
|
-
} catch (e) {
|
|
3911
|
-
console.error("Error setting displayName", e);
|
|
3912
|
-
}
|
|
3913
|
-
return Component;
|
|
3914
|
-
};
|
|
3915
|
-
const useJSXContext = () => {
|
|
3916
|
-
return React.useContext(JSXContext);
|
|
3917
|
-
};
|
|
3918
|
-
export { useSuperblocksDataTags as A, getEditStore as B, tracker as C, SuperblocksContextProvider as D, resolveById as E, generateId as F, isEditMode as G, iframeMessageHandler as H, sendNotification as I, __exportAll as K, colors as L, useSuperblocksProfiles as M, useSuperblocksUser as N, getAppMode as O, embedStore as P, editorBridge as R, utils_exports as S, rejectById as T, isEmbeddedBySuperblocksFirstParty as U, getParentOrigin as V, sendMessageImmediately as W, ORCHESTRATOR_EXECUTE_RESPONSE_SIZE_LIMIT_FLAG as _, FixWithClarkButton as a, getContextFromTraceHeaders as b, ErrorContent as c, ErrorMessage as d, ErrorStack as f, StyledClarkIcon as g, SecondaryButton as h, getWidgetRectAnchorName as i, useSuperblocksGroups as j, useSuperblocksContext as k, ErrorDetails as l, ErrorTitle as m, useJSXContext as n, ActionsContainer as o, ErrorSummary as p, getWidgetAnchorName as r, ErrorContainer as s, makeWrappedComponent as t, ErrorIconContainer as u, root_store_default as v, addNewPromise as w, initTracerProviderWithOrigin as x, createIframeSpan as y, markLoad as z };
|
|
3253
|
+
//#endregion
|
|
3254
|
+
export { getParentOrigin as C, isEditMode as D, sendMessageImmediately as E, getEditStore as S, isEmbeddedBySuperblocksFirstParty as T, generateId as _, tracker as a, editorBridge as b, resolveById as c, useSuperblocksContext as d, useSuperblocksDataTags as f, embedStore as g, useSuperblocksUser as h, getContextFromTraceHeaders as i, SuperblocksContextProvider as l, useSuperblocksProfiles as m, root_store_default as n, addNewPromise as o, useSuperblocksGroups as p, createIframeSpan as r, rejectById as s, ORCHESTRATOR_EXECUTE_RESPONSE_SIZE_LIMIT_FLAG as t, getAppMode as u, sendNotification as v, iframeMessageHandler as w, markLoad as x, colors as y };
|
|
3919
3255
|
|
|
3920
|
-
//# sourceMappingURL=
|
|
3256
|
+
//# sourceMappingURL=root-store-G9HJE1Mf.js.map
|