@builder.io/sdk-solid 0.13.0 → 0.13.2
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/lib/browser/dev.js +1140 -371
- package/lib/browser/dev.jsx +964 -296
- package/lib/browser/index.js +1138 -369
- package/lib/browser/index.jsx +964 -296
- package/lib/edge/dev.js +1142 -373
- package/lib/edge/dev.jsx +964 -296
- package/lib/edge/index.js +1140 -371
- package/lib/edge/index.jsx +964 -296
- package/lib/node/dev.js +1140 -371
- package/lib/node/dev.jsx +964 -296
- package/lib/node/index.js +1138 -369
- package/lib/node/index.jsx +964 -296
- package/package.json +1 -1
package/lib/node/dev.jsx
CHANGED
|
@@ -917,7 +917,7 @@ function BlockStyles(props) {
|
|
|
917
917
|
}
|
|
918
918
|
return true;
|
|
919
919
|
}
|
|
920
|
-
function
|
|
920
|
+
function css5() {
|
|
921
921
|
const processedBlock = getProcessedBlock({
|
|
922
922
|
block: props.block,
|
|
923
923
|
localState: props.context.localState,
|
|
@@ -960,7 +960,7 @@ function BlockStyles(props) {
|
|
|
960
960
|
}) : "";
|
|
961
961
|
return [largeStylesClass, mediumStylesClass, smallStylesClass].join(" ");
|
|
962
962
|
}
|
|
963
|
-
return <Show2 when={TARGET !== "reactNative" &&
|
|
963
|
+
return <Show2 when={TARGET !== "reactNative" && css5() && canShowBlock()}><Inlined_styles_default styles={css5()} /></Show2>;
|
|
964
964
|
}
|
|
965
965
|
var Block_styles_default = BlockStyles;
|
|
966
966
|
|
|
@@ -1249,10 +1249,10 @@ function Block(props) {
|
|
|
1249
1249
|
componentOptions: {
|
|
1250
1250
|
...getBlockComponentOptions(processedBlock()),
|
|
1251
1251
|
builderContext: props.context,
|
|
1252
|
-
...blockComponent()?.name === "Core:Button" || blockComponent()?.name === "Symbol" || blockComponent()?.name === "Columns" ? {
|
|
1252
|
+
...blockComponent()?.name === "Core:Button" || blockComponent()?.name === "Symbol" || blockComponent()?.name === "Columns" || blockComponent()?.name === "Form:Form" ? {
|
|
1253
1253
|
builderLinkComponent: props.linkComponent
|
|
1254
1254
|
} : {},
|
|
1255
|
-
...blockComponent()?.name === "Symbol" || blockComponent()?.name === "Columns" ? {
|
|
1255
|
+
...blockComponent()?.name === "Symbol" || blockComponent()?.name === "Columns" || blockComponent()?.name === "Form:Form" ? {
|
|
1256
1256
|
builderComponents: props.registeredComponents
|
|
1257
1257
|
} : {}
|
|
1258
1258
|
},
|
|
@@ -1724,10 +1724,10 @@ function SectionComponent(props) {
|
|
|
1724
1724
|
var section_default = SectionComponent;
|
|
1725
1725
|
|
|
1726
1726
|
// src/blocks/symbol/symbol.tsx
|
|
1727
|
-
import { onMount as onMount5, on as on3, createEffect as createEffect3, createSignal as
|
|
1727
|
+
import { onMount as onMount5, on as on3, createEffect as createEffect3, createSignal as createSignal15 } from "solid-js";
|
|
1728
1728
|
|
|
1729
1729
|
// src/components/content-variants/content-variants.tsx
|
|
1730
|
-
import { Show as
|
|
1730
|
+
import { Show as Show12, For as For7, onMount as onMount4, createSignal as createSignal14 } from "solid-js";
|
|
1731
1731
|
|
|
1732
1732
|
// src/helpers/url.ts
|
|
1733
1733
|
var getTopLevelDomain = (host) => {
|
|
@@ -1921,7 +1921,7 @@ var handleABTesting = async ({
|
|
|
1921
1921
|
var getDefaultCanTrack = (canTrack) => checkIsDefined(canTrack) ? canTrack : true;
|
|
1922
1922
|
|
|
1923
1923
|
// src/components/content/content.tsx
|
|
1924
|
-
import { Show as
|
|
1924
|
+
import { Show as Show11, createSignal as createSignal13 } from "solid-js";
|
|
1925
1925
|
|
|
1926
1926
|
// src/blocks/button/component-info.ts
|
|
1927
1927
|
var componentInfo = {
|
|
@@ -2179,164 +2179,8 @@ var componentInfo2 = {
|
|
|
2179
2179
|
}]
|
|
2180
2180
|
};
|
|
2181
2181
|
|
|
2182
|
-
// src/blocks/custom-code/component-info.ts
|
|
2183
|
-
var componentInfo3 = {
|
|
2184
|
-
name: "Custom Code",
|
|
2185
|
-
static: true,
|
|
2186
|
-
requiredPermissions: ["editCode"],
|
|
2187
|
-
inputs: [{
|
|
2188
|
-
name: "code",
|
|
2189
|
-
type: "html",
|
|
2190
|
-
required: true,
|
|
2191
|
-
defaultValue: "<p>Hello there, I am custom HTML code!</p>",
|
|
2192
|
-
code: true
|
|
2193
|
-
}, {
|
|
2194
|
-
name: "replaceNodes",
|
|
2195
|
-
type: "boolean",
|
|
2196
|
-
helperText: "Preserve server rendered dom nodes",
|
|
2197
|
-
advanced: true
|
|
2198
|
-
}, {
|
|
2199
|
-
name: "scriptsClientOnly",
|
|
2200
|
-
type: "boolean",
|
|
2201
|
-
defaultValue: false,
|
|
2202
|
-
helperText: "Only print and run scripts on the client. Important when scripts influence DOM that could be replaced when client loads",
|
|
2203
|
-
advanced: true
|
|
2204
|
-
}]
|
|
2205
|
-
};
|
|
2206
|
-
|
|
2207
|
-
// src/blocks/custom-code/custom-code.tsx
|
|
2208
|
-
import { onMount as onMount2, createSignal as createSignal7 } from "solid-js";
|
|
2209
|
-
function CustomCode(props) {
|
|
2210
|
-
const [scriptsInserted, setScriptsInserted] = createSignal7([]);
|
|
2211
|
-
const [scriptsRun, setScriptsRun] = createSignal7([]);
|
|
2212
|
-
let elementRef;
|
|
2213
|
-
onMount2(() => {
|
|
2214
|
-
if (!elementRef?.getElementsByTagName || typeof window === "undefined") {
|
|
2215
|
-
return;
|
|
2216
|
-
}
|
|
2217
|
-
const scripts = elementRef.getElementsByTagName("script");
|
|
2218
|
-
for (let i = 0; i < scripts.length; i++) {
|
|
2219
|
-
const script = scripts[i];
|
|
2220
|
-
if (script.src) {
|
|
2221
|
-
if (scriptsInserted().includes(script.src)) {
|
|
2222
|
-
continue;
|
|
2223
|
-
}
|
|
2224
|
-
scriptsInserted().push(script.src);
|
|
2225
|
-
const newScript = document.createElement("script");
|
|
2226
|
-
newScript.async = true;
|
|
2227
|
-
newScript.src = script.src;
|
|
2228
|
-
document.head.appendChild(newScript);
|
|
2229
|
-
} else if (!script.type || [
|
|
2230
|
-
"text/javascript",
|
|
2231
|
-
"application/javascript",
|
|
2232
|
-
"application/ecmascript"
|
|
2233
|
-
].includes(script.type)) {
|
|
2234
|
-
if (scriptsRun().includes(script.innerText)) {
|
|
2235
|
-
continue;
|
|
2236
|
-
}
|
|
2237
|
-
try {
|
|
2238
|
-
scriptsRun().push(script.innerText);
|
|
2239
|
-
new Function(script.innerText)();
|
|
2240
|
-
} catch (error2) {
|
|
2241
|
-
console.warn("`CustomCode`: Error running script:", error2);
|
|
2242
|
-
}
|
|
2243
|
-
}
|
|
2244
|
-
}
|
|
2245
|
-
});
|
|
2246
|
-
return <div
|
|
2247
|
-
class={"builder-custom-code" + (props.replaceNodes ? " replace-nodes" : "")}
|
|
2248
|
-
ref={elementRef}
|
|
2249
|
-
innerHTML={props.code}
|
|
2250
|
-
/>;
|
|
2251
|
-
}
|
|
2252
|
-
var custom_code_default = CustomCode;
|
|
2253
|
-
|
|
2254
|
-
// src/blocks/embed/component-info.ts
|
|
2255
|
-
var componentInfo4 = {
|
|
2256
|
-
name: "Embed",
|
|
2257
|
-
static: true,
|
|
2258
|
-
inputs: [{
|
|
2259
|
-
name: "url",
|
|
2260
|
-
type: "url",
|
|
2261
|
-
required: true,
|
|
2262
|
-
defaultValue: "",
|
|
2263
|
-
helperText: "e.g. enter a youtube url, google map, etc",
|
|
2264
|
-
onChange: (options) => {
|
|
2265
|
-
const url = options.get("url");
|
|
2266
|
-
if (url) {
|
|
2267
|
-
options.set("content", "Loading...");
|
|
2268
|
-
const apiKey = "ae0e60e78201a3f2b0de4b";
|
|
2269
|
-
return fetch(`https://iframe.ly/api/iframely?url=${url}&api_key=${apiKey}`).then((res) => res.json()).then((data) => {
|
|
2270
|
-
if (options.get("url") === url) {
|
|
2271
|
-
if (data.html) {
|
|
2272
|
-
options.set("content", data.html);
|
|
2273
|
-
} else {
|
|
2274
|
-
options.set("content", "Invalid url, please try another");
|
|
2275
|
-
}
|
|
2276
|
-
}
|
|
2277
|
-
}).catch((_err) => {
|
|
2278
|
-
options.set("content", "There was an error embedding this URL, please try again or another URL");
|
|
2279
|
-
});
|
|
2280
|
-
} else {
|
|
2281
|
-
options.delete("content");
|
|
2282
|
-
}
|
|
2283
|
-
}
|
|
2284
|
-
}, {
|
|
2285
|
-
name: "content",
|
|
2286
|
-
type: "html",
|
|
2287
|
-
defaultValue: '<div style="padding: 20px; text-align: center">(Choose an embed URL)<div>',
|
|
2288
|
-
hideFromUI: true
|
|
2289
|
-
}]
|
|
2290
|
-
};
|
|
2291
|
-
|
|
2292
|
-
// src/blocks/embed/embed.tsx
|
|
2293
|
-
import { on, createEffect, createSignal as createSignal8 } from "solid-js";
|
|
2294
|
-
|
|
2295
|
-
// src/blocks/embed/helpers.ts
|
|
2296
|
-
var SCRIPT_MIME_TYPES = ["text/javascript", "application/javascript", "application/ecmascript"];
|
|
2297
|
-
var isJsScript = (script) => SCRIPT_MIME_TYPES.includes(script.type);
|
|
2298
|
-
|
|
2299
|
-
// src/blocks/embed/embed.tsx
|
|
2300
|
-
function Embed(props) {
|
|
2301
|
-
const [scriptsInserted, setScriptsInserted] = createSignal8([]);
|
|
2302
|
-
const [scriptsRun, setScriptsRun] = createSignal8([]);
|
|
2303
|
-
const [ranInitFn, setRanInitFn] = createSignal8(false);
|
|
2304
|
-
function findAndRunScripts() {
|
|
2305
|
-
if (!elem || !elem.getElementsByTagName)
|
|
2306
|
-
return;
|
|
2307
|
-
const scripts = elem.getElementsByTagName("script");
|
|
2308
|
-
for (let i = 0; i < scripts.length; i++) {
|
|
2309
|
-
const script = scripts[i];
|
|
2310
|
-
if (script.src && !scriptsInserted().includes(script.src)) {
|
|
2311
|
-
scriptsInserted().push(script.src);
|
|
2312
|
-
const newScript = document.createElement("script");
|
|
2313
|
-
newScript.async = true;
|
|
2314
|
-
newScript.src = script.src;
|
|
2315
|
-
document.head.appendChild(newScript);
|
|
2316
|
-
} else if (isJsScript(script) && !scriptsRun().includes(script.innerText)) {
|
|
2317
|
-
try {
|
|
2318
|
-
scriptsRun().push(script.innerText);
|
|
2319
|
-
new Function(script.innerText)();
|
|
2320
|
-
} catch (error2) {
|
|
2321
|
-
console.warn("`Embed`: Error running script:", error2);
|
|
2322
|
-
}
|
|
2323
|
-
}
|
|
2324
|
-
}
|
|
2325
|
-
}
|
|
2326
|
-
let elem;
|
|
2327
|
-
function onUpdateFn_0() {
|
|
2328
|
-
if (elem && !ranInitFn()) {
|
|
2329
|
-
setRanInitFn(true);
|
|
2330
|
-
findAndRunScripts();
|
|
2331
|
-
}
|
|
2332
|
-
}
|
|
2333
|
-
createEffect(on(() => [elem, ranInitFn()], onUpdateFn_0));
|
|
2334
|
-
return <div class="builder-embed" ref={elem} innerHTML={props.content} />;
|
|
2335
|
-
}
|
|
2336
|
-
var embed_default = Embed;
|
|
2337
|
-
|
|
2338
2182
|
// src/blocks/fragment/component-info.ts
|
|
2339
|
-
var
|
|
2183
|
+
var componentInfo3 = {
|
|
2340
2184
|
name: "Fragment",
|
|
2341
2185
|
static: true,
|
|
2342
2186
|
hidden: true,
|
|
@@ -2345,7 +2189,7 @@ var componentInfo5 = {
|
|
|
2345
2189
|
};
|
|
2346
2190
|
|
|
2347
2191
|
// src/blocks/image/component-info.ts
|
|
2348
|
-
var
|
|
2192
|
+
var componentInfo4 = {
|
|
2349
2193
|
name: "Image",
|
|
2350
2194
|
static: true,
|
|
2351
2195
|
image: "https://firebasestorage.googleapis.com/v0/b/builder-3b0a2.appspot.com/o/images%2Fbaseline-insert_photo-24px.svg?alt=media&token=4e5d0ef4-f5e8-4e57-b3a9-38d63a9b9dc4",
|
|
@@ -2467,41 +2311,8 @@ var componentInfo6 = {
|
|
|
2467
2311
|
}]
|
|
2468
2312
|
};
|
|
2469
2313
|
|
|
2470
|
-
// src/blocks/img/component-info.ts
|
|
2471
|
-
var componentInfo7 = {
|
|
2472
|
-
// friendlyName?
|
|
2473
|
-
name: "Raw:Img",
|
|
2474
|
-
hideFromInsertMenu: true,
|
|
2475
|
-
image: "https://firebasestorage.googleapis.com/v0/b/builder-3b0a2.appspot.com/o/images%2Fbaseline-insert_photo-24px.svg?alt=media&token=4e5d0ef4-f5e8-4e57-b3a9-38d63a9b9dc4",
|
|
2476
|
-
inputs: [{
|
|
2477
|
-
name: "image",
|
|
2478
|
-
bubble: true,
|
|
2479
|
-
type: "file",
|
|
2480
|
-
allowedFileTypes: ["jpeg", "jpg", "png", "svg", "gif", "webp"],
|
|
2481
|
-
required: true
|
|
2482
|
-
}],
|
|
2483
|
-
noWrap: true,
|
|
2484
|
-
static: true
|
|
2485
|
-
};
|
|
2486
|
-
|
|
2487
|
-
// src/blocks/img/img.tsx
|
|
2488
|
-
function ImgComponent(props) {
|
|
2489
|
-
return <img
|
|
2490
|
-
style={{
|
|
2491
|
-
"object-fit": props.backgroundSize || "cover",
|
|
2492
|
-
"object-position": props.backgroundPosition || "center"
|
|
2493
|
-
}}
|
|
2494
|
-
key={isEditing() && props.imgSrc || "default-key"}
|
|
2495
|
-
alt={props.altText}
|
|
2496
|
-
src={props.imgSrc || props.image}
|
|
2497
|
-
{...{}}
|
|
2498
|
-
{...props.attributes}
|
|
2499
|
-
/>;
|
|
2500
|
-
}
|
|
2501
|
-
var img_default = ImgComponent;
|
|
2502
|
-
|
|
2503
2314
|
// src/blocks/section/component-info.ts
|
|
2504
|
-
var
|
|
2315
|
+
var componentInfo5 = {
|
|
2505
2316
|
name: "Core:Section",
|
|
2506
2317
|
static: true,
|
|
2507
2318
|
image: "https://cdn.builder.io/api/v1/image/assets%2FIsxPKMo2gPRRKeakUztj1D6uqed2%2F682efef23ace49afac61748dd305c70a",
|
|
@@ -2543,7 +2354,7 @@ var componentInfo8 = {
|
|
|
2543
2354
|
};
|
|
2544
2355
|
|
|
2545
2356
|
// src/blocks/slot/component-info.ts
|
|
2546
|
-
var
|
|
2357
|
+
var componentInfo6 = {
|
|
2547
2358
|
name: "Slot",
|
|
2548
2359
|
isRSC: true,
|
|
2549
2360
|
description: "Allow child blocks to be inserted into this content when used as a Symbol",
|
|
@@ -2577,7 +2388,7 @@ function Slot(props) {
|
|
|
2577
2388
|
var slot_default = Slot;
|
|
2578
2389
|
|
|
2579
2390
|
// src/blocks/symbol/component-info.ts
|
|
2580
|
-
var
|
|
2391
|
+
var componentInfo7 = {
|
|
2581
2392
|
name: "Symbol",
|
|
2582
2393
|
noWrap: true,
|
|
2583
2394
|
static: true,
|
|
@@ -2613,7 +2424,7 @@ var componentInfo10 = {
|
|
|
2613
2424
|
};
|
|
2614
2425
|
|
|
2615
2426
|
// src/blocks/text/component-info.ts
|
|
2616
|
-
var
|
|
2427
|
+
var componentInfo8 = {
|
|
2617
2428
|
name: "Text",
|
|
2618
2429
|
static: true,
|
|
2619
2430
|
isRSC: true,
|
|
@@ -2645,52 +2456,894 @@ function Text(props) {
|
|
|
2645
2456
|
}
|
|
2646
2457
|
var text_default = Text;
|
|
2647
2458
|
|
|
2648
|
-
// src/blocks/
|
|
2649
|
-
var
|
|
2650
|
-
name: "
|
|
2651
|
-
|
|
2652
|
-
|
|
2653
|
-
minHeight: "20px",
|
|
2654
|
-
minWidth: "20px"
|
|
2655
|
-
},
|
|
2656
|
-
image: "https://firebasestorage.googleapis.com/v0/b/builder-3b0a2.appspot.com/o/images%2Fbaseline-videocam-24px%20(1).svg?alt=media&token=49a84e4a-b20e-4977-a650-047f986874bb",
|
|
2459
|
+
// src/blocks/custom-code/component-info.ts
|
|
2460
|
+
var componentInfo9 = {
|
|
2461
|
+
name: "Custom Code",
|
|
2462
|
+
static: true,
|
|
2463
|
+
requiredPermissions: ["editCode"],
|
|
2657
2464
|
inputs: [{
|
|
2658
|
-
name: "
|
|
2659
|
-
type: "
|
|
2660
|
-
|
|
2661
|
-
|
|
2662
|
-
|
|
2663
|
-
required: true
|
|
2664
|
-
}, {
|
|
2665
|
-
name: "posterImage",
|
|
2666
|
-
type: "file",
|
|
2667
|
-
allowedFileTypes: ["jpeg", "png"],
|
|
2668
|
-
helperText: "Image to show before the video plays"
|
|
2669
|
-
}, {
|
|
2670
|
-
name: "autoPlay",
|
|
2671
|
-
type: "boolean",
|
|
2672
|
-
defaultValue: true
|
|
2673
|
-
}, {
|
|
2674
|
-
name: "controls",
|
|
2675
|
-
type: "boolean",
|
|
2676
|
-
defaultValue: false
|
|
2677
|
-
}, {
|
|
2678
|
-
name: "muted",
|
|
2679
|
-
type: "boolean",
|
|
2680
|
-
defaultValue: true
|
|
2465
|
+
name: "code",
|
|
2466
|
+
type: "html",
|
|
2467
|
+
required: true,
|
|
2468
|
+
defaultValue: "<p>Hello there, I am custom HTML code!</p>",
|
|
2469
|
+
code: true
|
|
2681
2470
|
}, {
|
|
2682
|
-
name: "
|
|
2471
|
+
name: "replaceNodes",
|
|
2683
2472
|
type: "boolean",
|
|
2684
|
-
|
|
2473
|
+
helperText: "Preserve server rendered dom nodes",
|
|
2474
|
+
advanced: true
|
|
2685
2475
|
}, {
|
|
2686
|
-
name: "
|
|
2476
|
+
name: "scriptsClientOnly",
|
|
2687
2477
|
type: "boolean",
|
|
2688
|
-
defaultValue:
|
|
2689
|
-
|
|
2690
|
-
|
|
2691
|
-
|
|
2692
|
-
|
|
2693
|
-
|
|
2478
|
+
defaultValue: false,
|
|
2479
|
+
helperText: "Only print and run scripts on the client. Important when scripts influence DOM that could be replaced when client loads",
|
|
2480
|
+
advanced: true
|
|
2481
|
+
}]
|
|
2482
|
+
};
|
|
2483
|
+
|
|
2484
|
+
// src/blocks/custom-code/custom-code.tsx
|
|
2485
|
+
import { onMount as onMount2, createSignal as createSignal7 } from "solid-js";
|
|
2486
|
+
function CustomCode(props) {
|
|
2487
|
+
const [scriptsInserted, setScriptsInserted] = createSignal7([]);
|
|
2488
|
+
const [scriptsRun, setScriptsRun] = createSignal7([]);
|
|
2489
|
+
let elementRef;
|
|
2490
|
+
onMount2(() => {
|
|
2491
|
+
if (!elementRef?.getElementsByTagName || typeof window === "undefined") {
|
|
2492
|
+
return;
|
|
2493
|
+
}
|
|
2494
|
+
const scripts = elementRef.getElementsByTagName("script");
|
|
2495
|
+
for (let i = 0; i < scripts.length; i++) {
|
|
2496
|
+
const script = scripts[i];
|
|
2497
|
+
if (script.src) {
|
|
2498
|
+
if (scriptsInserted().includes(script.src)) {
|
|
2499
|
+
continue;
|
|
2500
|
+
}
|
|
2501
|
+
scriptsInserted().push(script.src);
|
|
2502
|
+
const newScript = document.createElement("script");
|
|
2503
|
+
newScript.async = true;
|
|
2504
|
+
newScript.src = script.src;
|
|
2505
|
+
document.head.appendChild(newScript);
|
|
2506
|
+
} else if (!script.type || [
|
|
2507
|
+
"text/javascript",
|
|
2508
|
+
"application/javascript",
|
|
2509
|
+
"application/ecmascript"
|
|
2510
|
+
].includes(script.type)) {
|
|
2511
|
+
if (scriptsRun().includes(script.innerText)) {
|
|
2512
|
+
continue;
|
|
2513
|
+
}
|
|
2514
|
+
try {
|
|
2515
|
+
scriptsRun().push(script.innerText);
|
|
2516
|
+
new Function(script.innerText)();
|
|
2517
|
+
} catch (error2) {
|
|
2518
|
+
console.warn("`CustomCode`: Error running script:", error2);
|
|
2519
|
+
}
|
|
2520
|
+
}
|
|
2521
|
+
}
|
|
2522
|
+
});
|
|
2523
|
+
return <div
|
|
2524
|
+
class={"builder-custom-code" + (props.replaceNodes ? " replace-nodes" : "")}
|
|
2525
|
+
ref={elementRef}
|
|
2526
|
+
innerHTML={props.code}
|
|
2527
|
+
/>;
|
|
2528
|
+
}
|
|
2529
|
+
var custom_code_default = CustomCode;
|
|
2530
|
+
|
|
2531
|
+
// src/blocks/embed/component-info.ts
|
|
2532
|
+
var componentInfo10 = {
|
|
2533
|
+
name: "Embed",
|
|
2534
|
+
static: true,
|
|
2535
|
+
inputs: [{
|
|
2536
|
+
name: "url",
|
|
2537
|
+
type: "url",
|
|
2538
|
+
required: true,
|
|
2539
|
+
defaultValue: "",
|
|
2540
|
+
helperText: "e.g. enter a youtube url, google map, etc",
|
|
2541
|
+
onChange: (options) => {
|
|
2542
|
+
const url = options.get("url");
|
|
2543
|
+
if (url) {
|
|
2544
|
+
options.set("content", "Loading...");
|
|
2545
|
+
const apiKey = "ae0e60e78201a3f2b0de4b";
|
|
2546
|
+
return fetch(`https://iframe.ly/api/iframely?url=${url}&api_key=${apiKey}`).then((res) => res.json()).then((data) => {
|
|
2547
|
+
if (options.get("url") === url) {
|
|
2548
|
+
if (data.html) {
|
|
2549
|
+
options.set("content", data.html);
|
|
2550
|
+
} else {
|
|
2551
|
+
options.set("content", "Invalid url, please try another");
|
|
2552
|
+
}
|
|
2553
|
+
}
|
|
2554
|
+
}).catch((_err) => {
|
|
2555
|
+
options.set("content", "There was an error embedding this URL, please try again or another URL");
|
|
2556
|
+
});
|
|
2557
|
+
} else {
|
|
2558
|
+
options.delete("content");
|
|
2559
|
+
}
|
|
2560
|
+
}
|
|
2561
|
+
}, {
|
|
2562
|
+
name: "content",
|
|
2563
|
+
type: "html",
|
|
2564
|
+
defaultValue: '<div style="padding: 20px; text-align: center">(Choose an embed URL)<div>',
|
|
2565
|
+
hideFromUI: true
|
|
2566
|
+
}]
|
|
2567
|
+
};
|
|
2568
|
+
|
|
2569
|
+
// src/blocks/embed/embed.tsx
|
|
2570
|
+
import { on, createEffect, createSignal as createSignal8 } from "solid-js";
|
|
2571
|
+
|
|
2572
|
+
// src/blocks/embed/helpers.ts
|
|
2573
|
+
var SCRIPT_MIME_TYPES = ["text/javascript", "application/javascript", "application/ecmascript"];
|
|
2574
|
+
var isJsScript = (script) => SCRIPT_MIME_TYPES.includes(script.type);
|
|
2575
|
+
|
|
2576
|
+
// src/blocks/embed/embed.tsx
|
|
2577
|
+
function Embed(props) {
|
|
2578
|
+
const [scriptsInserted, setScriptsInserted] = createSignal8([]);
|
|
2579
|
+
const [scriptsRun, setScriptsRun] = createSignal8([]);
|
|
2580
|
+
const [ranInitFn, setRanInitFn] = createSignal8(false);
|
|
2581
|
+
function findAndRunScripts() {
|
|
2582
|
+
if (!elem || !elem.getElementsByTagName)
|
|
2583
|
+
return;
|
|
2584
|
+
const scripts = elem.getElementsByTagName("script");
|
|
2585
|
+
for (let i = 0; i < scripts.length; i++) {
|
|
2586
|
+
const script = scripts[i];
|
|
2587
|
+
if (script.src && !scriptsInserted().includes(script.src)) {
|
|
2588
|
+
scriptsInserted().push(script.src);
|
|
2589
|
+
const newScript = document.createElement("script");
|
|
2590
|
+
newScript.async = true;
|
|
2591
|
+
newScript.src = script.src;
|
|
2592
|
+
document.head.appendChild(newScript);
|
|
2593
|
+
} else if (isJsScript(script) && !scriptsRun().includes(script.innerText)) {
|
|
2594
|
+
try {
|
|
2595
|
+
scriptsRun().push(script.innerText);
|
|
2596
|
+
new Function(script.innerText)();
|
|
2597
|
+
} catch (error2) {
|
|
2598
|
+
console.warn("`Embed`: Error running script:", error2);
|
|
2599
|
+
}
|
|
2600
|
+
}
|
|
2601
|
+
}
|
|
2602
|
+
}
|
|
2603
|
+
let elem;
|
|
2604
|
+
function onUpdateFn_0() {
|
|
2605
|
+
if (elem && !ranInitFn()) {
|
|
2606
|
+
setRanInitFn(true);
|
|
2607
|
+
findAndRunScripts();
|
|
2608
|
+
}
|
|
2609
|
+
}
|
|
2610
|
+
createEffect(on(() => [elem, ranInitFn()], onUpdateFn_0));
|
|
2611
|
+
return <div class="builder-embed" ref={elem} innerHTML={props.content} />;
|
|
2612
|
+
}
|
|
2613
|
+
var embed_default = Embed;
|
|
2614
|
+
|
|
2615
|
+
// src/blocks/form/form/component-info.ts
|
|
2616
|
+
var componentInfo11 = {
|
|
2617
|
+
name: "Form:Form",
|
|
2618
|
+
// editableTags: ['builder-form-error']
|
|
2619
|
+
defaults: {
|
|
2620
|
+
responsiveStyles: {
|
|
2621
|
+
large: {
|
|
2622
|
+
marginTop: "15px",
|
|
2623
|
+
paddingBottom: "15px"
|
|
2624
|
+
}
|
|
2625
|
+
}
|
|
2626
|
+
},
|
|
2627
|
+
image: "https://cdn.builder.io/api/v1/image/assets%2FIsxPKMo2gPRRKeakUztj1D6uqed2%2Fef36d2a846134910b64b88e6d18c5ca5",
|
|
2628
|
+
inputs: [{
|
|
2629
|
+
name: "sendSubmissionsTo",
|
|
2630
|
+
type: "string",
|
|
2631
|
+
// TODO: save to builder data and user can download as csv
|
|
2632
|
+
// TODO: easy for mode too or computed add/remove fields form mode
|
|
2633
|
+
// so you can edit details and high level mode at same time...
|
|
2634
|
+
// Later - more integrations like mailchimp
|
|
2635
|
+
// /api/v1/form-submit?to=mailchimp
|
|
2636
|
+
enum: [{
|
|
2637
|
+
label: "Send to email",
|
|
2638
|
+
value: "email",
|
|
2639
|
+
helperText: "Send form submissions to the email address of your choosing"
|
|
2640
|
+
}, {
|
|
2641
|
+
label: "Custom",
|
|
2642
|
+
value: "custom",
|
|
2643
|
+
helperText: "Handle where the form requests go manually with a little code, e.g. to your own custom backend"
|
|
2644
|
+
}],
|
|
2645
|
+
defaultValue: "email"
|
|
2646
|
+
}, {
|
|
2647
|
+
name: "sendSubmissionsToEmail",
|
|
2648
|
+
type: "string",
|
|
2649
|
+
required: true,
|
|
2650
|
+
// TODO: required: () => options.get("sendSubmissionsTo") === "email"
|
|
2651
|
+
defaultValue: "your@email.com",
|
|
2652
|
+
showIf: 'options.get("sendSubmissionsTo") === "email"'
|
|
2653
|
+
}, {
|
|
2654
|
+
name: "sendWithJs",
|
|
2655
|
+
type: "boolean",
|
|
2656
|
+
helperText: "Set to false to use basic html form action",
|
|
2657
|
+
defaultValue: true,
|
|
2658
|
+
showIf: 'options.get("sendSubmissionsTo") === "custom"'
|
|
2659
|
+
}, {
|
|
2660
|
+
name: "name",
|
|
2661
|
+
type: "string",
|
|
2662
|
+
defaultValue: "My form"
|
|
2663
|
+
// advanced: true
|
|
2664
|
+
}, {
|
|
2665
|
+
name: "action",
|
|
2666
|
+
type: "string",
|
|
2667
|
+
helperText: "URL to send the form data to",
|
|
2668
|
+
showIf: 'options.get("sendSubmissionsTo") === "custom"'
|
|
2669
|
+
}, {
|
|
2670
|
+
name: "contentType",
|
|
2671
|
+
type: "string",
|
|
2672
|
+
defaultValue: "application/json",
|
|
2673
|
+
advanced: true,
|
|
2674
|
+
// TODO: do automatically if file input
|
|
2675
|
+
enum: ["application/json", "multipart/form-data", "application/x-www-form-urlencoded"],
|
|
2676
|
+
showIf: 'options.get("sendSubmissionsTo") === "custom" && options.get("sendWithJs") === true'
|
|
2677
|
+
}, {
|
|
2678
|
+
name: "method",
|
|
2679
|
+
type: "string",
|
|
2680
|
+
showIf: 'options.get("sendSubmissionsTo") === "custom"',
|
|
2681
|
+
defaultValue: "POST",
|
|
2682
|
+
advanced: true
|
|
2683
|
+
}, {
|
|
2684
|
+
name: "previewState",
|
|
2685
|
+
type: "string",
|
|
2686
|
+
// TODO: persist: false flag
|
|
2687
|
+
enum: ["unsubmitted", "sending", "success", "error"],
|
|
2688
|
+
defaultValue: "unsubmitted",
|
|
2689
|
+
helperText: 'Choose a state to edit, e.g. choose "success" to show what users see on success and edit the message',
|
|
2690
|
+
showIf: 'options.get("sendSubmissionsTo") !== "zapier" && options.get("sendWithJs") === true'
|
|
2691
|
+
}, {
|
|
2692
|
+
name: "successUrl",
|
|
2693
|
+
type: "url",
|
|
2694
|
+
helperText: "Optional URL to redirect the user to on form submission success",
|
|
2695
|
+
showIf: 'options.get("sendSubmissionsTo") !== "zapier" && options.get("sendWithJs") === true'
|
|
2696
|
+
}, {
|
|
2697
|
+
name: "resetFormOnSubmit",
|
|
2698
|
+
type: "boolean",
|
|
2699
|
+
showIf: "options.get('sendSubmissionsTo') === 'custom' && options.get('sendWithJs') === true",
|
|
2700
|
+
advanced: true
|
|
2701
|
+
}, {
|
|
2702
|
+
name: "successMessage",
|
|
2703
|
+
type: "uiBlocks",
|
|
2704
|
+
hideFromUI: true,
|
|
2705
|
+
defaultValue: [{
|
|
2706
|
+
"@type": "@builder.io/sdk:Element",
|
|
2707
|
+
responsiveStyles: {
|
|
2708
|
+
large: {
|
|
2709
|
+
marginTop: "10px"
|
|
2710
|
+
}
|
|
2711
|
+
},
|
|
2712
|
+
component: {
|
|
2713
|
+
name: "Text",
|
|
2714
|
+
options: {
|
|
2715
|
+
text: "<span>Thanks!</span>"
|
|
2716
|
+
}
|
|
2717
|
+
}
|
|
2718
|
+
}]
|
|
2719
|
+
}, {
|
|
2720
|
+
name: "validate",
|
|
2721
|
+
type: "boolean",
|
|
2722
|
+
defaultValue: true,
|
|
2723
|
+
advanced: true
|
|
2724
|
+
}, {
|
|
2725
|
+
name: "errorMessagePath",
|
|
2726
|
+
type: "text",
|
|
2727
|
+
advanced: true,
|
|
2728
|
+
helperText: 'Path to where to get the error message from in a JSON response to display to the user, e.g. "error.message" for a response like { "error": { "message": "this username is taken" }}'
|
|
2729
|
+
}, {
|
|
2730
|
+
name: "errorMessage",
|
|
2731
|
+
type: "uiBlocks",
|
|
2732
|
+
hideFromUI: true,
|
|
2733
|
+
defaultValue: [{
|
|
2734
|
+
"@type": "@builder.io/sdk:Element",
|
|
2735
|
+
responsiveStyles: {
|
|
2736
|
+
large: {
|
|
2737
|
+
marginTop: "10px"
|
|
2738
|
+
}
|
|
2739
|
+
},
|
|
2740
|
+
bindings: {
|
|
2741
|
+
"component.options.text": "state.formErrorMessage || block.component.options.text"
|
|
2742
|
+
},
|
|
2743
|
+
component: {
|
|
2744
|
+
name: "Text",
|
|
2745
|
+
options: {
|
|
2746
|
+
text: "<span>Form submission error :( Please check your answers and try again</span>"
|
|
2747
|
+
}
|
|
2748
|
+
}
|
|
2749
|
+
}]
|
|
2750
|
+
}, {
|
|
2751
|
+
name: "sendingMessage",
|
|
2752
|
+
type: "uiBlocks",
|
|
2753
|
+
hideFromUI: true,
|
|
2754
|
+
defaultValue: [{
|
|
2755
|
+
"@type": "@builder.io/sdk:Element",
|
|
2756
|
+
responsiveStyles: {
|
|
2757
|
+
large: {
|
|
2758
|
+
marginTop: "10px"
|
|
2759
|
+
}
|
|
2760
|
+
},
|
|
2761
|
+
component: {
|
|
2762
|
+
name: "Text",
|
|
2763
|
+
options: {
|
|
2764
|
+
text: "<span>Sending...</span>"
|
|
2765
|
+
}
|
|
2766
|
+
}
|
|
2767
|
+
}]
|
|
2768
|
+
}, {
|
|
2769
|
+
name: "customHeaders",
|
|
2770
|
+
type: "map",
|
|
2771
|
+
valueType: {
|
|
2772
|
+
type: "string"
|
|
2773
|
+
},
|
|
2774
|
+
advanced: true,
|
|
2775
|
+
showIf: 'options.get("sendSubmissionsTo") === "custom" && options.get("sendWithJs") === true'
|
|
2776
|
+
}],
|
|
2777
|
+
noWrap: true,
|
|
2778
|
+
canHaveChildren: true,
|
|
2779
|
+
defaultChildren: [{
|
|
2780
|
+
"@type": "@builder.io/sdk:Element",
|
|
2781
|
+
responsiveStyles: {
|
|
2782
|
+
large: {
|
|
2783
|
+
marginTop: "10px"
|
|
2784
|
+
}
|
|
2785
|
+
},
|
|
2786
|
+
component: {
|
|
2787
|
+
name: "Text",
|
|
2788
|
+
options: {
|
|
2789
|
+
text: "<span>Enter your name</span>"
|
|
2790
|
+
}
|
|
2791
|
+
}
|
|
2792
|
+
}, {
|
|
2793
|
+
"@type": "@builder.io/sdk:Element",
|
|
2794
|
+
responsiveStyles: {
|
|
2795
|
+
large: {
|
|
2796
|
+
marginTop: "10px"
|
|
2797
|
+
}
|
|
2798
|
+
},
|
|
2799
|
+
component: {
|
|
2800
|
+
name: "Form:Input",
|
|
2801
|
+
options: {
|
|
2802
|
+
name: "name",
|
|
2803
|
+
placeholder: "Jane Doe"
|
|
2804
|
+
}
|
|
2805
|
+
}
|
|
2806
|
+
}, {
|
|
2807
|
+
"@type": "@builder.io/sdk:Element",
|
|
2808
|
+
responsiveStyles: {
|
|
2809
|
+
large: {
|
|
2810
|
+
marginTop: "10px"
|
|
2811
|
+
}
|
|
2812
|
+
},
|
|
2813
|
+
component: {
|
|
2814
|
+
name: "Text",
|
|
2815
|
+
options: {
|
|
2816
|
+
text: "<span>Enter your email</span>"
|
|
2817
|
+
}
|
|
2818
|
+
}
|
|
2819
|
+
}, {
|
|
2820
|
+
"@type": "@builder.io/sdk:Element",
|
|
2821
|
+
responsiveStyles: {
|
|
2822
|
+
large: {
|
|
2823
|
+
marginTop: "10px"
|
|
2824
|
+
}
|
|
2825
|
+
},
|
|
2826
|
+
component: {
|
|
2827
|
+
name: "Form:Input",
|
|
2828
|
+
options: {
|
|
2829
|
+
name: "email",
|
|
2830
|
+
placeholder: "jane@doe.com"
|
|
2831
|
+
}
|
|
2832
|
+
}
|
|
2833
|
+
}, {
|
|
2834
|
+
"@type": "@builder.io/sdk:Element",
|
|
2835
|
+
responsiveStyles: {
|
|
2836
|
+
large: {
|
|
2837
|
+
marginTop: "10px"
|
|
2838
|
+
}
|
|
2839
|
+
},
|
|
2840
|
+
component: {
|
|
2841
|
+
name: "Form:SubmitButton",
|
|
2842
|
+
options: {
|
|
2843
|
+
text: "Submit"
|
|
2844
|
+
}
|
|
2845
|
+
}
|
|
2846
|
+
}]
|
|
2847
|
+
};
|
|
2848
|
+
|
|
2849
|
+
// src/blocks/form/form/form.tsx
|
|
2850
|
+
import { Show as Show8, For as For5, createSignal as createSignal9 } from "solid-js";
|
|
2851
|
+
import { css as css4 } from "solid-styled-components";
|
|
2852
|
+
|
|
2853
|
+
// src/functions/get-env.ts
|
|
2854
|
+
var validEnvList = ["production", "qa", "test", "development", "dev", "cdn-qa", "cloud", "fast", "cdn2", "cdn-prod"];
|
|
2855
|
+
var getEnv = () => {
|
|
2856
|
+
const env = "development";
|
|
2857
|
+
return validEnvList.includes(env) ? env : "production";
|
|
2858
|
+
};
|
|
2859
|
+
|
|
2860
|
+
// src/functions/get.ts
|
|
2861
|
+
var get = (obj, path, defaultValue) => {
|
|
2862
|
+
const result = String.prototype.split.call(path, /[,[\].]+?/).filter(Boolean).reduce((res, key) => res !== null && res !== void 0 ? res[key] : res, obj);
|
|
2863
|
+
return result === void 0 || result === obj ? defaultValue : result;
|
|
2864
|
+
};
|
|
2865
|
+
|
|
2866
|
+
// src/blocks/form/form/form.tsx
|
|
2867
|
+
function FormComponent(props) {
|
|
2868
|
+
const [formState, setFormState] = createSignal9("unsubmitted");
|
|
2869
|
+
const [responseData, setResponseData] = createSignal9(null);
|
|
2870
|
+
const [formErrorMessage, setFormErrorMessage] = createSignal9("");
|
|
2871
|
+
function mergeNewRootState(newData) {
|
|
2872
|
+
const combinedState = {
|
|
2873
|
+
...props.builderContext.rootState,
|
|
2874
|
+
...newData
|
|
2875
|
+
};
|
|
2876
|
+
if (props.builderContext.rootSetState) {
|
|
2877
|
+
props.builderContext.rootSetState?.(combinedState);
|
|
2878
|
+
} else {
|
|
2879
|
+
props.builderContext.rootState = combinedState;
|
|
2880
|
+
}
|
|
2881
|
+
}
|
|
2882
|
+
function submissionState() {
|
|
2883
|
+
return isEditing() && props.previewState || formState();
|
|
2884
|
+
}
|
|
2885
|
+
function onSubmit(event) {
|
|
2886
|
+
const sendWithJsProp = props.sendWithJs || props.sendSubmissionsTo === "email";
|
|
2887
|
+
if (props.sendSubmissionsTo === "zapier") {
|
|
2888
|
+
event.preventDefault();
|
|
2889
|
+
} else if (sendWithJsProp) {
|
|
2890
|
+
if (!(props.action || props.sendSubmissionsTo === "email")) {
|
|
2891
|
+
event.preventDefault();
|
|
2892
|
+
return;
|
|
2893
|
+
}
|
|
2894
|
+
event.preventDefault();
|
|
2895
|
+
const el = event.currentTarget;
|
|
2896
|
+
const headers = props.customHeaders || {};
|
|
2897
|
+
let body;
|
|
2898
|
+
const formData = new FormData(el);
|
|
2899
|
+
const formPairs = Array.from(
|
|
2900
|
+
event.currentTarget.querySelectorAll("input,select,textarea")
|
|
2901
|
+
).filter((el2) => !!el2.name).map((el2) => {
|
|
2902
|
+
let value;
|
|
2903
|
+
const key = el2.name;
|
|
2904
|
+
if (el2 instanceof HTMLInputElement) {
|
|
2905
|
+
if (el2.type === "radio") {
|
|
2906
|
+
if (el2.checked) {
|
|
2907
|
+
value = el2.name;
|
|
2908
|
+
return {
|
|
2909
|
+
key,
|
|
2910
|
+
value
|
|
2911
|
+
};
|
|
2912
|
+
}
|
|
2913
|
+
} else if (el2.type === "checkbox") {
|
|
2914
|
+
value = el2.checked;
|
|
2915
|
+
} else if (el2.type === "number" || el2.type === "range") {
|
|
2916
|
+
const num = el2.valueAsNumber;
|
|
2917
|
+
if (!isNaN(num)) {
|
|
2918
|
+
value = num;
|
|
2919
|
+
}
|
|
2920
|
+
} else if (el2.type === "file") {
|
|
2921
|
+
value = el2.files;
|
|
2922
|
+
} else {
|
|
2923
|
+
value = el2.value;
|
|
2924
|
+
}
|
|
2925
|
+
} else {
|
|
2926
|
+
value = el2.value;
|
|
2927
|
+
}
|
|
2928
|
+
return {
|
|
2929
|
+
key,
|
|
2930
|
+
value
|
|
2931
|
+
};
|
|
2932
|
+
});
|
|
2933
|
+
let formContentType = props.contentType;
|
|
2934
|
+
if (props.sendSubmissionsTo === "email") {
|
|
2935
|
+
formContentType = "multipart/form-data";
|
|
2936
|
+
}
|
|
2937
|
+
Array.from(formPairs).forEach(({ value }) => {
|
|
2938
|
+
if (value instanceof File || Array.isArray(value) && value[0] instanceof File || value instanceof FileList) {
|
|
2939
|
+
formContentType = "multipart/form-data";
|
|
2940
|
+
}
|
|
2941
|
+
});
|
|
2942
|
+
if (formContentType !== "application/json") {
|
|
2943
|
+
body = formData;
|
|
2944
|
+
} else {
|
|
2945
|
+
const json = {};
|
|
2946
|
+
Array.from(formPairs).forEach(({ value, key }) => {
|
|
2947
|
+
set(json, key, value);
|
|
2948
|
+
});
|
|
2949
|
+
body = JSON.stringify(json);
|
|
2950
|
+
}
|
|
2951
|
+
if (formContentType && formContentType !== "multipart/form-data") {
|
|
2952
|
+
if (
|
|
2953
|
+
/* Zapier doesn't allow content-type header to be sent from browsers */
|
|
2954
|
+
!(sendWithJsProp && props.action?.includes("zapier.com"))
|
|
2955
|
+
) {
|
|
2956
|
+
headers["content-type"] = formContentType;
|
|
2957
|
+
}
|
|
2958
|
+
}
|
|
2959
|
+
const presubmitEvent = new CustomEvent("presubmit", {
|
|
2960
|
+
detail: {
|
|
2961
|
+
body
|
|
2962
|
+
}
|
|
2963
|
+
});
|
|
2964
|
+
if (formRef) {
|
|
2965
|
+
formRef.dispatchEvent(presubmitEvent);
|
|
2966
|
+
if (presubmitEvent.defaultPrevented) {
|
|
2967
|
+
return;
|
|
2968
|
+
}
|
|
2969
|
+
}
|
|
2970
|
+
setFormState("sending");
|
|
2971
|
+
const formUrl = `${getEnv() === "dev" ? "http://localhost:5000" : "https://builder.io"}/api/v1/form-submit?apiKey=${props.builderContext.apiKey}&to=${btoa(
|
|
2972
|
+
props.sendSubmissionsToEmail || ""
|
|
2973
|
+
)}&name=${encodeURIComponent(props.name || "")}`;
|
|
2974
|
+
fetch(
|
|
2975
|
+
props.sendSubmissionsTo === "email" ? formUrl : props.action,
|
|
2976
|
+
{
|
|
2977
|
+
body,
|
|
2978
|
+
headers,
|
|
2979
|
+
method: props.method || "post"
|
|
2980
|
+
}
|
|
2981
|
+
).then(
|
|
2982
|
+
async (res) => {
|
|
2983
|
+
let body2;
|
|
2984
|
+
const contentType = res.headers.get("content-type");
|
|
2985
|
+
if (contentType && contentType.indexOf("application/json") !== -1) {
|
|
2986
|
+
body2 = await res.json();
|
|
2987
|
+
} else {
|
|
2988
|
+
body2 = await res.text();
|
|
2989
|
+
}
|
|
2990
|
+
if (!res.ok && props.errorMessagePath) {
|
|
2991
|
+
let message = get(body2, props.errorMessagePath);
|
|
2992
|
+
if (message) {
|
|
2993
|
+
if (typeof message !== "string") {
|
|
2994
|
+
message = JSON.stringify(message);
|
|
2995
|
+
}
|
|
2996
|
+
setFormErrorMessage(message);
|
|
2997
|
+
mergeNewRootState({
|
|
2998
|
+
formErrorMessage: message
|
|
2999
|
+
});
|
|
3000
|
+
}
|
|
3001
|
+
}
|
|
3002
|
+
setResponseData(body2);
|
|
3003
|
+
setFormState(res.ok ? "success" : "error");
|
|
3004
|
+
if (res.ok) {
|
|
3005
|
+
const submitSuccessEvent = new CustomEvent("submit:success", {
|
|
3006
|
+
detail: {
|
|
3007
|
+
res,
|
|
3008
|
+
body: body2
|
|
3009
|
+
}
|
|
3010
|
+
});
|
|
3011
|
+
if (formRef) {
|
|
3012
|
+
formRef.dispatchEvent(submitSuccessEvent);
|
|
3013
|
+
if (submitSuccessEvent.defaultPrevented) {
|
|
3014
|
+
return;
|
|
3015
|
+
}
|
|
3016
|
+
if (props.resetFormOnSubmit !== false) {
|
|
3017
|
+
formRef.reset();
|
|
3018
|
+
}
|
|
3019
|
+
}
|
|
3020
|
+
if (props.successUrl) {
|
|
3021
|
+
if (formRef) {
|
|
3022
|
+
const event2 = new CustomEvent("route", {
|
|
3023
|
+
detail: {
|
|
3024
|
+
url: props.successUrl
|
|
3025
|
+
}
|
|
3026
|
+
});
|
|
3027
|
+
formRef.dispatchEvent(event2);
|
|
3028
|
+
if (!event2.defaultPrevented) {
|
|
3029
|
+
location.href = props.successUrl;
|
|
3030
|
+
}
|
|
3031
|
+
} else {
|
|
3032
|
+
location.href = props.successUrl;
|
|
3033
|
+
}
|
|
3034
|
+
}
|
|
3035
|
+
}
|
|
3036
|
+
},
|
|
3037
|
+
(err) => {
|
|
3038
|
+
const submitErrorEvent = new CustomEvent("submit:error", {
|
|
3039
|
+
detail: {
|
|
3040
|
+
error: err
|
|
3041
|
+
}
|
|
3042
|
+
});
|
|
3043
|
+
if (formRef) {
|
|
3044
|
+
formRef.dispatchEvent(submitErrorEvent);
|
|
3045
|
+
if (submitErrorEvent.defaultPrevented) {
|
|
3046
|
+
return;
|
|
3047
|
+
}
|
|
3048
|
+
}
|
|
3049
|
+
setResponseData(err);
|
|
3050
|
+
setFormState("error");
|
|
3051
|
+
}
|
|
3052
|
+
);
|
|
3053
|
+
}
|
|
3054
|
+
}
|
|
3055
|
+
let formRef;
|
|
3056
|
+
return <form
|
|
3057
|
+
validate={props.validate}
|
|
3058
|
+
ref={formRef}
|
|
3059
|
+
action={!props.sendWithJs && props.action}
|
|
3060
|
+
method={props.method}
|
|
3061
|
+
name={props.name}
|
|
3062
|
+
onSubmit={(event) => onSubmit(event)}
|
|
3063
|
+
{...{}}
|
|
3064
|
+
{...props.attributes}
|
|
3065
|
+
>
|
|
3066
|
+
<Show8 when={props.builderBlock && props.builderBlock.children}><For5 each={props.builderBlock?.children}>{(block, _index) => {
|
|
3067
|
+
const idx = _index();
|
|
3068
|
+
return <Block_default
|
|
3069
|
+
key={`form-block-${idx}`}
|
|
3070
|
+
block={block}
|
|
3071
|
+
context={props.builderContext}
|
|
3072
|
+
registeredComponents={props.builderComponents}
|
|
3073
|
+
linkComponent={props.builderLinkComponent}
|
|
3074
|
+
/>;
|
|
3075
|
+
}}</For5></Show8>
|
|
3076
|
+
<Show8 when={submissionState() === "error"}><Blocks_default
|
|
3077
|
+
path="errorMessage"
|
|
3078
|
+
blocks={props.errorMessage}
|
|
3079
|
+
context={props.builderContext}
|
|
3080
|
+
/></Show8>
|
|
3081
|
+
<Show8 when={submissionState() === "sending"}><Blocks_default
|
|
3082
|
+
path="sendingMessage"
|
|
3083
|
+
blocks={props.sendingMessage}
|
|
3084
|
+
context={props.builderContext}
|
|
3085
|
+
/></Show8>
|
|
3086
|
+
<Show8 when={submissionState() === "error" && responseData()}><pre
|
|
3087
|
+
class={"builder-form-error-text " + css4({
|
|
3088
|
+
padding: "10px",
|
|
3089
|
+
color: "red",
|
|
3090
|
+
textAlign: "center"
|
|
3091
|
+
})}
|
|
3092
|
+
>{JSON.stringify(responseData(), null, 2)}</pre></Show8>
|
|
3093
|
+
<Show8 when={submissionState() === "success"}><Blocks_default
|
|
3094
|
+
path="successMessage"
|
|
3095
|
+
blocks={props.successMessage}
|
|
3096
|
+
context={props.builderContext}
|
|
3097
|
+
/></Show8>
|
|
3098
|
+
</form>;
|
|
3099
|
+
}
|
|
3100
|
+
var form_default = FormComponent;
|
|
3101
|
+
|
|
3102
|
+
// src/blocks/form/input/component-info.ts
|
|
3103
|
+
var componentInfo12 = {
|
|
3104
|
+
name: "Form:Input",
|
|
3105
|
+
image: "https://cdn.builder.io/api/v1/image/assets%2FIsxPKMo2gPRRKeakUztj1D6uqed2%2Fad6f37889d9e40bbbbc72cdb5875d6ca",
|
|
3106
|
+
inputs: [
|
|
3107
|
+
{
|
|
3108
|
+
name: "type",
|
|
3109
|
+
type: "text",
|
|
3110
|
+
enum: ["text", "number", "email", "url", "checkbox", "radio", "range", "date", "datetime-local", "search", "tel", "time", "file", "month", "week", "password", "color", "hidden"],
|
|
3111
|
+
defaultValue: "text"
|
|
3112
|
+
},
|
|
3113
|
+
{
|
|
3114
|
+
name: "name",
|
|
3115
|
+
type: "string",
|
|
3116
|
+
required: true,
|
|
3117
|
+
helperText: 'Every input in a form needs a unique name describing what it takes, e.g. "email"'
|
|
3118
|
+
},
|
|
3119
|
+
{
|
|
3120
|
+
name: "placeholder",
|
|
3121
|
+
type: "string",
|
|
3122
|
+
defaultValue: "Hello there",
|
|
3123
|
+
helperText: "Text to display when there is no value"
|
|
3124
|
+
},
|
|
3125
|
+
// TODO: handle value vs default value automatically like ng-model
|
|
3126
|
+
{
|
|
3127
|
+
name: "defaultValue",
|
|
3128
|
+
type: "string"
|
|
3129
|
+
},
|
|
3130
|
+
{
|
|
3131
|
+
name: "value",
|
|
3132
|
+
type: "string",
|
|
3133
|
+
advanced: true
|
|
3134
|
+
},
|
|
3135
|
+
{
|
|
3136
|
+
name: "required",
|
|
3137
|
+
type: "boolean",
|
|
3138
|
+
helperText: "Is this input required to be filled out to submit a form",
|
|
3139
|
+
defaultValue: false
|
|
3140
|
+
}
|
|
3141
|
+
],
|
|
3142
|
+
noWrap: true,
|
|
3143
|
+
static: true,
|
|
3144
|
+
defaultStyles: {
|
|
3145
|
+
paddingTop: "10px",
|
|
3146
|
+
paddingBottom: "10px",
|
|
3147
|
+
paddingLeft: "10px",
|
|
3148
|
+
paddingRight: "10px",
|
|
3149
|
+
borderRadius: "3px",
|
|
3150
|
+
borderWidth: "1px",
|
|
3151
|
+
borderStyle: "solid",
|
|
3152
|
+
borderColor: "#ccc"
|
|
3153
|
+
}
|
|
3154
|
+
};
|
|
3155
|
+
|
|
3156
|
+
// src/blocks/form/input/input.tsx
|
|
3157
|
+
function FormInputComponent(props) {
|
|
3158
|
+
return <input
|
|
3159
|
+
{...{}}
|
|
3160
|
+
{...props.attributes}
|
|
3161
|
+
key={isEditing() && props.defaultValue ? props.defaultValue : "default-key"}
|
|
3162
|
+
placeholder={props.placeholder}
|
|
3163
|
+
type={props.type}
|
|
3164
|
+
name={props.name}
|
|
3165
|
+
value={props.value}
|
|
3166
|
+
defaultValue={props.defaultValue}
|
|
3167
|
+
required={props.required}
|
|
3168
|
+
/>;
|
|
3169
|
+
}
|
|
3170
|
+
var input_default = FormInputComponent;
|
|
3171
|
+
|
|
3172
|
+
// src/blocks/form/select/component-info.ts
|
|
3173
|
+
var componentInfo13 = {
|
|
3174
|
+
name: "Form:Select",
|
|
3175
|
+
image: "https://cdn.builder.io/api/v1/image/assets%2FIsxPKMo2gPRRKeakUztj1D6uqed2%2F83acca093fb24aaf94dee136e9a4b045",
|
|
3176
|
+
defaultStyles: {
|
|
3177
|
+
alignSelf: "flex-start"
|
|
3178
|
+
},
|
|
3179
|
+
inputs: [{
|
|
3180
|
+
name: "options",
|
|
3181
|
+
type: "list",
|
|
3182
|
+
required: true,
|
|
3183
|
+
subFields: [{
|
|
3184
|
+
name: "value",
|
|
3185
|
+
type: "text",
|
|
3186
|
+
required: true
|
|
3187
|
+
}, {
|
|
3188
|
+
name: "name",
|
|
3189
|
+
type: "text"
|
|
3190
|
+
}],
|
|
3191
|
+
defaultValue: [{
|
|
3192
|
+
value: "option 1"
|
|
3193
|
+
}, {
|
|
3194
|
+
value: "option 2"
|
|
3195
|
+
}]
|
|
3196
|
+
}, {
|
|
3197
|
+
name: "name",
|
|
3198
|
+
type: "string",
|
|
3199
|
+
required: true,
|
|
3200
|
+
helperText: 'Every select in a form needs a unique name describing what it gets, e.g. "email"'
|
|
3201
|
+
}, {
|
|
3202
|
+
name: "defaultValue",
|
|
3203
|
+
type: "string"
|
|
3204
|
+
}, {
|
|
3205
|
+
name: "value",
|
|
3206
|
+
type: "string",
|
|
3207
|
+
advanced: true
|
|
3208
|
+
}, {
|
|
3209
|
+
name: "required",
|
|
3210
|
+
type: "boolean",
|
|
3211
|
+
defaultValue: false
|
|
3212
|
+
}],
|
|
3213
|
+
static: true,
|
|
3214
|
+
noWrap: true
|
|
3215
|
+
};
|
|
3216
|
+
|
|
3217
|
+
// src/blocks/form/select/select.tsx
|
|
3218
|
+
import { For as For6 } from "solid-js";
|
|
3219
|
+
function SelectComponent(props) {
|
|
3220
|
+
return <select
|
|
3221
|
+
{...{}}
|
|
3222
|
+
{...props.attributes}
|
|
3223
|
+
value={props.value}
|
|
3224
|
+
key={isEditing() && props.defaultValue ? props.defaultValue : "default-key"}
|
|
3225
|
+
defaultValue={props.defaultValue}
|
|
3226
|
+
name={props.name}
|
|
3227
|
+
><For6 each={props.options}>{(option, _index) => {
|
|
3228
|
+
const index = _index();
|
|
3229
|
+
return <option value={option.value}>{option.name || option.value}</option>;
|
|
3230
|
+
}}</For6></select>;
|
|
3231
|
+
}
|
|
3232
|
+
var select_default = SelectComponent;
|
|
3233
|
+
|
|
3234
|
+
// src/blocks/form/submit-button/component-info.ts
|
|
3235
|
+
var componentInfo14 = {
|
|
3236
|
+
name: "Form:SubmitButton",
|
|
3237
|
+
image: "https://cdn.builder.io/api/v1/image/assets%2FIsxPKMo2gPRRKeakUztj1D6uqed2%2Fdf2820ffed1f4349a94c40b3221f5b98",
|
|
3238
|
+
defaultStyles: {
|
|
3239
|
+
appearance: "none",
|
|
3240
|
+
paddingTop: "15px",
|
|
3241
|
+
paddingBottom: "15px",
|
|
3242
|
+
paddingLeft: "25px",
|
|
3243
|
+
paddingRight: "25px",
|
|
3244
|
+
backgroundColor: "#3898EC",
|
|
3245
|
+
color: "white",
|
|
3246
|
+
borderRadius: "4px",
|
|
3247
|
+
cursor: "pointer"
|
|
3248
|
+
},
|
|
3249
|
+
inputs: [{
|
|
3250
|
+
name: "text",
|
|
3251
|
+
type: "text",
|
|
3252
|
+
defaultValue: "Click me"
|
|
3253
|
+
}],
|
|
3254
|
+
static: true,
|
|
3255
|
+
noWrap: true
|
|
3256
|
+
// TODO: optional children? maybe as optional form input
|
|
3257
|
+
// that only shows if advanced setting is flipped
|
|
3258
|
+
// TODO: defaultChildren
|
|
3259
|
+
// canHaveChildren: true,
|
|
3260
|
+
};
|
|
3261
|
+
|
|
3262
|
+
// src/blocks/form/submit-button/submit-button.tsx
|
|
3263
|
+
function SubmitButton(props) {
|
|
3264
|
+
return <button type="submit" {...{}} {...props.attributes}>{props.text}</button>;
|
|
3265
|
+
}
|
|
3266
|
+
var submit_button_default = SubmitButton;
|
|
3267
|
+
|
|
3268
|
+
// src/blocks/img/component-info.ts
|
|
3269
|
+
var componentInfo15 = {
|
|
3270
|
+
// friendlyName?
|
|
3271
|
+
name: "Raw:Img",
|
|
3272
|
+
hideFromInsertMenu: true,
|
|
3273
|
+
image: "https://firebasestorage.googleapis.com/v0/b/builder-3b0a2.appspot.com/o/images%2Fbaseline-insert_photo-24px.svg?alt=media&token=4e5d0ef4-f5e8-4e57-b3a9-38d63a9b9dc4",
|
|
3274
|
+
inputs: [{
|
|
3275
|
+
name: "image",
|
|
3276
|
+
bubble: true,
|
|
3277
|
+
type: "file",
|
|
3278
|
+
allowedFileTypes: ["jpeg", "jpg", "png", "svg", "gif", "webp"],
|
|
3279
|
+
required: true
|
|
3280
|
+
}],
|
|
3281
|
+
noWrap: true,
|
|
3282
|
+
static: true
|
|
3283
|
+
};
|
|
3284
|
+
|
|
3285
|
+
// src/blocks/img/img.tsx
|
|
3286
|
+
function ImgComponent(props) {
|
|
3287
|
+
return <img
|
|
3288
|
+
style={{
|
|
3289
|
+
"object-fit": props.backgroundSize || "cover",
|
|
3290
|
+
"object-position": props.backgroundPosition || "center"
|
|
3291
|
+
}}
|
|
3292
|
+
key={isEditing() && props.imgSrc || "default-key"}
|
|
3293
|
+
alt={props.altText}
|
|
3294
|
+
src={props.imgSrc || props.image}
|
|
3295
|
+
{...{}}
|
|
3296
|
+
{...props.attributes}
|
|
3297
|
+
/>;
|
|
3298
|
+
}
|
|
3299
|
+
var img_default = ImgComponent;
|
|
3300
|
+
|
|
3301
|
+
// src/blocks/video/component-info.ts
|
|
3302
|
+
var componentInfo16 = {
|
|
3303
|
+
name: "Video",
|
|
3304
|
+
canHaveChildren: true,
|
|
3305
|
+
defaultStyles: {
|
|
3306
|
+
minHeight: "20px",
|
|
3307
|
+
minWidth: "20px"
|
|
3308
|
+
},
|
|
3309
|
+
image: "https://firebasestorage.googleapis.com/v0/b/builder-3b0a2.appspot.com/o/images%2Fbaseline-videocam-24px%20(1).svg?alt=media&token=49a84e4a-b20e-4977-a650-047f986874bb",
|
|
3310
|
+
inputs: [{
|
|
3311
|
+
name: "video",
|
|
3312
|
+
type: "file",
|
|
3313
|
+
allowedFileTypes: ["mp4"],
|
|
3314
|
+
bubble: true,
|
|
3315
|
+
defaultValue: "https://firebasestorage.googleapis.com/v0/b/builder-3b0a2.appspot.com/o/assets%2FKQlEmWDxA0coC3PK6UvkrjwkIGI2%2F28cb070609f546cdbe5efa20e931aa4b?alt=media&token=912e9551-7a7c-4dfb-86b6-3da1537d1a7f",
|
|
3316
|
+
required: true
|
|
3317
|
+
}, {
|
|
3318
|
+
name: "posterImage",
|
|
3319
|
+
type: "file",
|
|
3320
|
+
allowedFileTypes: ["jpeg", "png"],
|
|
3321
|
+
helperText: "Image to show before the video plays"
|
|
3322
|
+
}, {
|
|
3323
|
+
name: "autoPlay",
|
|
3324
|
+
type: "boolean",
|
|
3325
|
+
defaultValue: true
|
|
3326
|
+
}, {
|
|
3327
|
+
name: "controls",
|
|
3328
|
+
type: "boolean",
|
|
3329
|
+
defaultValue: false
|
|
3330
|
+
}, {
|
|
3331
|
+
name: "muted",
|
|
3332
|
+
type: "boolean",
|
|
3333
|
+
defaultValue: true
|
|
3334
|
+
}, {
|
|
3335
|
+
name: "loop",
|
|
3336
|
+
type: "boolean",
|
|
3337
|
+
defaultValue: true
|
|
3338
|
+
}, {
|
|
3339
|
+
name: "playsInline",
|
|
3340
|
+
type: "boolean",
|
|
3341
|
+
defaultValue: true
|
|
3342
|
+
}, {
|
|
3343
|
+
name: "fit",
|
|
3344
|
+
type: "text",
|
|
3345
|
+
defaultValue: "cover",
|
|
3346
|
+
enum: ["contain", "cover", "fill", "auto"]
|
|
2694
3347
|
}, {
|
|
2695
3348
|
name: "preload",
|
|
2696
3349
|
type: "text",
|
|
@@ -2730,7 +3383,7 @@ var componentInfo12 = {
|
|
|
2730
3383
|
};
|
|
2731
3384
|
|
|
2732
3385
|
// src/blocks/video/video.tsx
|
|
2733
|
-
import { Show as
|
|
3386
|
+
import { Show as Show9 } from "solid-js";
|
|
2734
3387
|
function Video(props) {
|
|
2735
3388
|
function videoProps() {
|
|
2736
3389
|
return {
|
|
@@ -2781,8 +3434,8 @@ function Video(props) {
|
|
|
2781
3434
|
}}
|
|
2782
3435
|
src={props.video || "no-src"}
|
|
2783
3436
|
poster={props.posterImage}
|
|
2784
|
-
><
|
|
2785
|
-
<
|
|
3437
|
+
><Show9 when={!props.lazyLoad}><source type="video/mp4" src={props.video} /></Show9></video>
|
|
3438
|
+
<Show9
|
|
2786
3439
|
when={props.aspectRatio && !(props.fitContent && props.builderBlock?.children?.length)}
|
|
2787
3440
|
><div
|
|
2788
3441
|
style={{
|
|
@@ -2791,15 +3444,15 @@ function Video(props) {
|
|
|
2791
3444
|
"pointer-events": "none",
|
|
2792
3445
|
"font-size": "0px"
|
|
2793
3446
|
}}
|
|
2794
|
-
/></
|
|
2795
|
-
<
|
|
3447
|
+
/></Show9>
|
|
3448
|
+
<Show9 when={props.builderBlock?.children?.length && props.fitContent}><div
|
|
2796
3449
|
style={{
|
|
2797
3450
|
display: "flex",
|
|
2798
3451
|
"flex-direction": "column",
|
|
2799
3452
|
"align-items": "stretch"
|
|
2800
3453
|
}}
|
|
2801
|
-
>{props.children}</div></
|
|
2802
|
-
<
|
|
3454
|
+
>{props.children}</div></Show9>
|
|
3455
|
+
<Show9 when={props.builderBlock?.children?.length && !props.fitContent}><div
|
|
2803
3456
|
style={{
|
|
2804
3457
|
"pointer-events": "none",
|
|
2805
3458
|
display: "flex",
|
|
@@ -2811,11 +3464,38 @@ function Video(props) {
|
|
|
2811
3464
|
width: "100%",
|
|
2812
3465
|
height: "100%"
|
|
2813
3466
|
}}
|
|
2814
|
-
>{props.children}</div></
|
|
3467
|
+
>{props.children}</div></Show9>
|
|
2815
3468
|
</div>;
|
|
2816
3469
|
}
|
|
2817
3470
|
var video_default = Video;
|
|
2818
3471
|
|
|
3472
|
+
// src/constants/extra-components.ts
|
|
3473
|
+
var getExtraComponents = () => [{
|
|
3474
|
+
component: custom_code_default,
|
|
3475
|
+
...componentInfo9
|
|
3476
|
+
}, {
|
|
3477
|
+
component: embed_default,
|
|
3478
|
+
...componentInfo10
|
|
3479
|
+
}, ...TARGET === "rsc" ? [] : [{
|
|
3480
|
+
component: form_default,
|
|
3481
|
+
...componentInfo11
|
|
3482
|
+
}, {
|
|
3483
|
+
component: input_default,
|
|
3484
|
+
...componentInfo12
|
|
3485
|
+
}, {
|
|
3486
|
+
component: submit_button_default,
|
|
3487
|
+
...componentInfo14
|
|
3488
|
+
}, {
|
|
3489
|
+
component: select_default,
|
|
3490
|
+
...componentInfo13
|
|
3491
|
+
}], {
|
|
3492
|
+
component: img_default,
|
|
3493
|
+
...componentInfo15
|
|
3494
|
+
}, {
|
|
3495
|
+
component: video_default,
|
|
3496
|
+
...componentInfo16
|
|
3497
|
+
}];
|
|
3498
|
+
|
|
2819
3499
|
// src/constants/builder-registered-components.ts
|
|
2820
3500
|
var getDefaultRegisteredComponents = () => [{
|
|
2821
3501
|
component: button_default,
|
|
@@ -2824,36 +3504,24 @@ var getDefaultRegisteredComponents = () => [{
|
|
|
2824
3504
|
component: columns_default,
|
|
2825
3505
|
...componentInfo2
|
|
2826
3506
|
}, {
|
|
2827
|
-
component:
|
|
3507
|
+
component: fragment_default,
|
|
2828
3508
|
...componentInfo3
|
|
2829
3509
|
}, {
|
|
2830
|
-
component:
|
|
3510
|
+
component: image_default,
|
|
2831
3511
|
...componentInfo4
|
|
2832
3512
|
}, {
|
|
2833
|
-
component:
|
|
3513
|
+
component: section_default,
|
|
2834
3514
|
...componentInfo5
|
|
2835
3515
|
}, {
|
|
2836
|
-
component:
|
|
3516
|
+
component: slot_default,
|
|
2837
3517
|
...componentInfo6
|
|
2838
|
-
}, {
|
|
2839
|
-
component: img_default,
|
|
2840
|
-
...componentInfo7
|
|
2841
|
-
}, {
|
|
2842
|
-
component: section_default,
|
|
2843
|
-
...componentInfo8
|
|
2844
3518
|
}, {
|
|
2845
3519
|
component: symbol_default,
|
|
2846
|
-
...
|
|
3520
|
+
...componentInfo7
|
|
2847
3521
|
}, {
|
|
2848
3522
|
component: text_default,
|
|
2849
|
-
...
|
|
2850
|
-
},
|
|
2851
|
-
component: video_default,
|
|
2852
|
-
...componentInfo12
|
|
2853
|
-
}, {
|
|
2854
|
-
component: slot_default,
|
|
2855
|
-
...componentInfo9
|
|
2856
|
-
}];
|
|
3523
|
+
...componentInfo8
|
|
3524
|
+
}, ...getExtraComponents()];
|
|
2857
3525
|
|
|
2858
3526
|
// src/functions/register-component.ts
|
|
2859
3527
|
var components = [];
|
|
@@ -2931,7 +3599,7 @@ function InlinedScript(props) {
|
|
|
2931
3599
|
var Inlined_script_default = InlinedScript;
|
|
2932
3600
|
|
|
2933
3601
|
// src/components/content/components/enable-editor.tsx
|
|
2934
|
-
import { Show as
|
|
3602
|
+
import { Show as Show10, onMount as onMount3, on as on2, createEffect as createEffect2, createSignal as createSignal11 } from "solid-js";
|
|
2935
3603
|
import { Dynamic as Dynamic5 } from "solid-js/web";
|
|
2936
3604
|
|
|
2937
3605
|
// src/helpers/preview-lru-cache/get.ts
|
|
@@ -3426,7 +4094,7 @@ function isFromTrustedHost(trustedHosts, e) {
|
|
|
3426
4094
|
}
|
|
3427
4095
|
|
|
3428
4096
|
// src/constants/sdk-version.ts
|
|
3429
|
-
var SDK_VERSION = "0.13.
|
|
4097
|
+
var SDK_VERSION = "0.13.2";
|
|
3430
4098
|
|
|
3431
4099
|
// src/functions/register.ts
|
|
3432
4100
|
var registry = {};
|
|
@@ -3625,15 +4293,15 @@ var subscribeToEditor = (model, callback, options) => {
|
|
|
3625
4293
|
|
|
3626
4294
|
// src/components/content/components/enable-editor.tsx
|
|
3627
4295
|
function EnableEditor(props) {
|
|
3628
|
-
const [forceReRenderCount, setForceReRenderCount] =
|
|
3629
|
-
const [firstRender, setFirstRender] =
|
|
3630
|
-
const [lastUpdated, setLastUpdated] =
|
|
3631
|
-
const [shouldSendResetCookie, setShouldSendResetCookie] =
|
|
3632
|
-
const [ContentWrapper, setContentWrapper] =
|
|
4296
|
+
const [forceReRenderCount, setForceReRenderCount] = createSignal11(0);
|
|
4297
|
+
const [firstRender, setFirstRender] = createSignal11(true);
|
|
4298
|
+
const [lastUpdated, setLastUpdated] = createSignal11(0);
|
|
4299
|
+
const [shouldSendResetCookie, setShouldSendResetCookie] = createSignal11(false);
|
|
4300
|
+
const [ContentWrapper, setContentWrapper] = createSignal11(
|
|
3633
4301
|
props.contentWrapper || "div"
|
|
3634
4302
|
);
|
|
3635
|
-
const [httpReqsData, setHttpReqsData] =
|
|
3636
|
-
const [clicked, setClicked] =
|
|
4303
|
+
const [httpReqsData, setHttpReqsData] = createSignal11({});
|
|
4304
|
+
const [clicked, setClicked] = createSignal11(false);
|
|
3637
4305
|
function mergeNewRootState(newData) {
|
|
3638
4306
|
const combinedState = {
|
|
3639
4307
|
...props.builderContextSignal.rootState,
|
|
@@ -3897,7 +4565,7 @@ function EnableEditor(props) {
|
|
|
3897
4565
|
}
|
|
3898
4566
|
}
|
|
3899
4567
|
createEffect2(on2(() => [props.locale], onUpdateFn_6));
|
|
3900
|
-
return <builder_context_default.Provider value={props.builderContextSignal}><
|
|
4568
|
+
return <builder_context_default.Provider value={props.builderContextSignal}><Show10 when={props.builderContextSignal.content}><Dynamic5
|
|
3901
4569
|
class={`variant-${props.content?.testVariationId || props.content?.id}`}
|
|
3902
4570
|
{...{}}
|
|
3903
4571
|
key={forceReRenderCount()}
|
|
@@ -3912,12 +4580,12 @@ function EnableEditor(props) {
|
|
|
3912
4580
|
}}
|
|
3913
4581
|
{...props.contentWrapperProps}
|
|
3914
4582
|
component={ContentWrapper()}
|
|
3915
|
-
>{props.children}</Dynamic5></
|
|
4583
|
+
>{props.children}</Dynamic5></Show10></builder_context_default.Provider>;
|
|
3916
4584
|
}
|
|
3917
4585
|
var Enable_editor_default = EnableEditor;
|
|
3918
4586
|
|
|
3919
4587
|
// src/components/content/components/styles.tsx
|
|
3920
|
-
import { createSignal as
|
|
4588
|
+
import { createSignal as createSignal12 } from "solid-js";
|
|
3921
4589
|
|
|
3922
4590
|
// src/components/content/components/styles.helpers.ts
|
|
3923
4591
|
var getCssFromFont = (font) => {
|
|
@@ -3976,7 +4644,7 @@ var getCss = ({
|
|
|
3976
4644
|
|
|
3977
4645
|
// src/components/content/components/styles.tsx
|
|
3978
4646
|
function ContentStyles(props) {
|
|
3979
|
-
const [injectedStyles, setInjectedStyles] =
|
|
4647
|
+
const [injectedStyles, setInjectedStyles] = createSignal12(
|
|
3980
4648
|
`
|
|
3981
4649
|
${getCss({
|
|
3982
4650
|
cssCode: props.cssCode,
|
|
@@ -4046,7 +4714,7 @@ var getContentInitialValue = ({
|
|
|
4046
4714
|
|
|
4047
4715
|
// src/components/content/content.tsx
|
|
4048
4716
|
function ContentComponent(props) {
|
|
4049
|
-
const [scriptStr, setScriptStr] =
|
|
4717
|
+
const [scriptStr, setScriptStr] = createSignal13(
|
|
4050
4718
|
getUpdateVariantVisibilityScript({
|
|
4051
4719
|
// eslint-disable-next-line @typescript-eslint/no-non-null-assertion, @typescript-eslint/no-non-null-asserted-optional-chain
|
|
4052
4720
|
variationId: props.content?.testVariationId,
|
|
@@ -4054,7 +4722,7 @@ function ContentComponent(props) {
|
|
|
4054
4722
|
contentId: props.content?.id
|
|
4055
4723
|
})
|
|
4056
4724
|
);
|
|
4057
|
-
const [registeredComponents, setRegisteredComponents] =
|
|
4725
|
+
const [registeredComponents, setRegisteredComponents] = createSignal13(
|
|
4058
4726
|
[
|
|
4059
4727
|
...getDefaultRegisteredComponents(),
|
|
4060
4728
|
// While this `components` object is deprecated, we must maintain support for it.
|
|
@@ -4075,7 +4743,7 @@ function ContentComponent(props) {
|
|
|
4075
4743
|
{}
|
|
4076
4744
|
)
|
|
4077
4745
|
);
|
|
4078
|
-
const [builderContextSignal, setBuilderContextSignal] =
|
|
4746
|
+
const [builderContextSignal, setBuilderContextSignal] = createSignal13({
|
|
4079
4747
|
content: getContentInitialValue({
|
|
4080
4748
|
content: props.content,
|
|
4081
4749
|
data: props.data
|
|
@@ -4140,12 +4808,12 @@ function ContentComponent(props) {
|
|
|
4140
4808
|
setBuilderContextSignal
|
|
4141
4809
|
}}
|
|
4142
4810
|
>
|
|
4143
|
-
<
|
|
4144
|
-
<
|
|
4811
|
+
<Show11 when={props.isSsrAbTest}><Inlined_script_default scriptStr={scriptStr()} /></Show11>
|
|
4812
|
+
<Show11 when={TARGET !== "reactNative"}><Styles_default
|
|
4145
4813
|
contentId={builderContextSignal().content?.id}
|
|
4146
4814
|
cssCode={builderContextSignal().content?.data?.cssCode}
|
|
4147
4815
|
customFonts={builderContextSignal().content?.data?.customFonts}
|
|
4148
|
-
/></
|
|
4816
|
+
/></Show11>
|
|
4149
4817
|
<Blocks_default
|
|
4150
4818
|
blocks={builderContextSignal().content?.data?.blocks}
|
|
4151
4819
|
context={builderContextSignal()}
|
|
@@ -4158,7 +4826,7 @@ var Content_default = ContentComponent;
|
|
|
4158
4826
|
|
|
4159
4827
|
// src/components/content-variants/content-variants.tsx
|
|
4160
4828
|
function ContentVariants(props) {
|
|
4161
|
-
const [shouldRenderVariants, setShouldRenderVariants] =
|
|
4829
|
+
const [shouldRenderVariants, setShouldRenderVariants] = createSignal14(
|
|
4162
4830
|
checkShouldRenderVariants({
|
|
4163
4831
|
canTrack: getDefaultCanTrack(props.canTrack),
|
|
4164
4832
|
content: props.content
|
|
@@ -4189,8 +4857,8 @@ function ContentVariants(props) {
|
|
|
4189
4857
|
setShouldRenderVariants(false);
|
|
4190
4858
|
});
|
|
4191
4859
|
return <>
|
|
4192
|
-
<
|
|
4193
|
-
<
|
|
4860
|
+
<Show12 when={!props.__isNestedRender && TARGET !== "reactNative"}><Inlined_script_default scriptStr={getScriptString()} /></Show12>
|
|
4861
|
+
<Show12 when={shouldRenderVariants()}>
|
|
4194
4862
|
<Inlined_styles_default
|
|
4195
4863
|
id={`variants-styles-${props.content?.id}`}
|
|
4196
4864
|
styles={hideVariantsStyleString()}
|
|
@@ -4198,7 +4866,7 @@ function ContentVariants(props) {
|
|
|
4198
4866
|
<Inlined_script_default
|
|
4199
4867
|
scriptStr={updateCookieAndStylesScriptStr()}
|
|
4200
4868
|
/>
|
|
4201
|
-
<
|
|
4869
|
+
<For7 each={getVariants(props.content)}>{(variant, _index) => {
|
|
4202
4870
|
const index = _index();
|
|
4203
4871
|
return <Content_default
|
|
4204
4872
|
key={variant.testVariationId}
|
|
@@ -4222,8 +4890,8 @@ function ContentVariants(props) {
|
|
|
4222
4890
|
contentWrapperProps={props.contentWrapperProps}
|
|
4223
4891
|
trustedHosts={props.trustedHosts}
|
|
4224
4892
|
/>;
|
|
4225
|
-
}}</
|
|
4226
|
-
</
|
|
4893
|
+
}}</For7>
|
|
4894
|
+
</Show12>
|
|
4227
4895
|
<Content_default
|
|
4228
4896
|
{...{}}
|
|
4229
4897
|
content={defaultContent()}
|
|
@@ -4276,7 +4944,7 @@ var fetchSymbolContent = async ({
|
|
|
4276
4944
|
|
|
4277
4945
|
// src/blocks/symbol/symbol.tsx
|
|
4278
4946
|
function Symbol(props) {
|
|
4279
|
-
const [contentToUse, setContentToUse] =
|
|
4947
|
+
const [contentToUse, setContentToUse] = createSignal15(props.symbol?.content);
|
|
4280
4948
|
function className() {
|
|
4281
4949
|
return [
|
|
4282
4950
|
...[props.attributes[getClassPropName()]],
|