@builder.io/sdk-qwik 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.
@@ -1,4 +1,4 @@
1
- import { componentQrl, inlinedQrl, _jsxBranch, _jsxC, Slot as Slot$1, _fnSignal, _IMMUTABLE, createContextId, _jsxQ, useComputedQrl, useLexicalScope, useStore, useContextProvider, useVisibleTaskQrl, _wrapProp, useStylesScopedQrl, useContext, Fragment as Fragment$1, _jsxS, useSignal, useOn, useTaskQrl, createElement } from "@builder.io/qwik";
1
+ import { componentQrl, inlinedQrl, _jsxBranch, _jsxC, Slot as Slot$1, _fnSignal, _IMMUTABLE, createContextId, _jsxQ, useComputedQrl, useLexicalScope, useStore, useContextProvider, useVisibleTaskQrl, _wrapProp, useStylesScopedQrl, useContext, Fragment as Fragment$1, _jsxS, useSignal, useOn, useTaskQrl, createElement, _wrapSignal } from "@builder.io/qwik";
2
2
  import { Fragment } from "@builder.io/qwik/jsx-runtime";
3
3
  import { isBrowser as isBrowser$1 } from "@builder.io/qwik/build";
4
4
  const EMPTY_HTML_ELEMENTS = /* @__PURE__ */ new Set([
@@ -1024,7 +1024,7 @@ const Block = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((props) =>
1024
1024
  repeatItem
1025
1025
  ]));
1026
1026
  const componentRefProps = useComputedQrl(/* @__PURE__ */ inlinedQrl(() => {
1027
- var _a2, _b, _c, _d, _e, _f, _g, _h;
1027
+ var _a2, _b, _c, _d, _e, _f, _g, _h, _i, _j;
1028
1028
  const [blockComponent2, processedBlock2, props2, state2] = useLexicalScope();
1029
1029
  return {
1030
1030
  blockChildren: processedBlock2.value.children ?? [],
@@ -1032,10 +1032,10 @@ const Block = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((props) =>
1032
1032
  componentOptions: {
1033
1033
  ...getBlockComponentOptions(processedBlock2.value),
1034
1034
  builderContext: props2.context,
1035
- ...((_b = blockComponent2.value) == null ? void 0 : _b.name) === "Core:Button" || ((_c = blockComponent2.value) == null ? void 0 : _c.name) === "Symbol" || ((_d = blockComponent2.value) == null ? void 0 : _d.name) === "Columns" ? {
1035
+ ...((_b = blockComponent2.value) == null ? void 0 : _b.name) === "Core:Button" || ((_c = blockComponent2.value) == null ? void 0 : _c.name) === "Symbol" || ((_d = blockComponent2.value) == null ? void 0 : _d.name) === "Columns" || ((_e = blockComponent2.value) == null ? void 0 : _e.name) === "Form:Form" ? {
1036
1036
  builderLinkComponent: props2.linkComponent
1037
1037
  } : {},
1038
- ...((_e = blockComponent2.value) == null ? void 0 : _e.name) === "Symbol" || ((_f = blockComponent2.value) == null ? void 0 : _f.name) === "Columns" ? {
1038
+ ...((_f = blockComponent2.value) == null ? void 0 : _f.name) === "Symbol" || ((_g = blockComponent2.value) == null ? void 0 : _g.name) === "Columns" || ((_h = blockComponent2.value) == null ? void 0 : _h.name) === "Form:Form" ? {
1039
1039
  builderComponents: props2.registeredComponents
1040
1040
  } : {}
1041
1041
  },
@@ -1043,8 +1043,8 @@ const Block = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((props) =>
1043
1043
  linkComponent: props2.linkComponent,
1044
1044
  registeredComponents: props2.registeredComponents,
1045
1045
  builderBlock: processedBlock2.value,
1046
- includeBlockProps: ((_g = blockComponent2.value) == null ? void 0 : _g.noWrap) === true,
1047
- isInteractive: !((_h = blockComponent2.value) == null ? void 0 : _h.isRSC)
1046
+ includeBlockProps: ((_i = blockComponent2.value) == null ? void 0 : _i.noWrap) === true,
1047
+ isInteractive: !((_j = blockComponent2.value) == null ? void 0 : _j.isRSC)
1048
1048
  };
1049
1049
  }, "Block_component_componentRefProps_useComputed_Ikbl8VO04ho", [
1050
1050
  blockComponent,
@@ -1305,7 +1305,7 @@ const onMouseEnter = function onMouseEnter2(props, state) {
1305
1305
  }, "*");
1306
1306
  };
1307
1307
  const BlocksWrapper = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((props) => {
1308
- useStylesScopedQrl(/* @__PURE__ */ inlinedQrl(STYLES$2, "BlocksWrapper_component_useStylesScoped_Kj0S9AOXQ0o"));
1308
+ useStylesScopedQrl(/* @__PURE__ */ inlinedQrl(STYLES$3, "BlocksWrapper_component_useStylesScoped_Kj0S9AOXQ0o"));
1309
1309
  const className = useComputedQrl(/* @__PURE__ */ inlinedQrl(() => {
1310
1310
  var _a;
1311
1311
  const [props2] = useLexicalScope();
@@ -1366,7 +1366,7 @@ const BlocksWrapper = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((p
1366
1366
  }
1367
1367
  }, 0, "3u_1");
1368
1368
  }, "BlocksWrapper_component_45hR0o6abzg"));
1369
- const STYLES$2 = `
1369
+ const STYLES$3 = `
1370
1370
  .props-blocks-wrapper-BlocksWrapper {
1371
1371
  display: flex;
1372
1372
  flex-direction: column;
@@ -1516,7 +1516,7 @@ const Columns = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((props)
1516
1516
  gutterSize: typeof props.space === "number" ? props.space || 0 : 20,
1517
1517
  stackAt: props.stackColumnsAt || "tablet"
1518
1518
  });
1519
- useStylesScopedQrl(/* @__PURE__ */ inlinedQrl(STYLES$1, "Columns_component_useStylesScoped_s7JLZz7MCCQ"));
1519
+ useStylesScopedQrl(/* @__PURE__ */ inlinedQrl(STYLES$2, "Columns_component_useStylesScoped_s7JLZz7MCCQ"));
1520
1520
  const columnsCssVars = useComputedQrl(/* @__PURE__ */ inlinedQrl(() => {
1521
1521
  const [props2, state2] = useLexicalScope();
1522
1522
  return {
@@ -1633,7 +1633,7 @@ const Columns = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((props)
1633
1633
  })
1634
1634
  ], 1, "c0_2");
1635
1635
  }, "Columns_component_7yLj4bxdI6c"));
1636
- const STYLES$1 = `
1636
+ const STYLES$2 = `
1637
1637
  .div-Columns {
1638
1638
  display: flex;
1639
1639
  line-height: normal;
@@ -1699,7 +1699,7 @@ function getSrcSet(url) {
1699
1699
  const Image = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((props) => {
1700
1700
  var _a, _b, _c, _d;
1701
1701
  _jsxBranch();
1702
- useStylesScopedQrl(/* @__PURE__ */ inlinedQrl(STYLES, "Image_component_useStylesScoped_fBMYiVf9fuU"));
1702
+ useStylesScopedQrl(/* @__PURE__ */ inlinedQrl(STYLES$1, "Image_component_useStylesScoped_fBMYiVf9fuU"));
1703
1703
  const srcSetToUse = useComputedQrl(/* @__PURE__ */ inlinedQrl(() => {
1704
1704
  var _a2;
1705
1705
  const [props2] = useLexicalScope();
@@ -1799,7 +1799,7 @@ const Image = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((props) =>
1799
1799
  ]
1800
1800
  }, 1, "0A_5");
1801
1801
  }, "Image_component_LRxDkFa1EfU"));
1802
- const STYLES = `
1802
+ const STYLES$1 = `
1803
1803
  .img-Image {
1804
1804
  opacity: 1;
1805
1805
  transition: opacity 0.2s ease-in-out;
@@ -2012,7 +2012,7 @@ const handleABTesting = async ({ item, canTrack }) => {
2012
2012
  };
2013
2013
  };
2014
2014
  const getDefaultCanTrack = (canTrack) => checkIsDefined(canTrack) ? canTrack : true;
2015
- const componentInfo$b = {
2015
+ const componentInfo$f = {
2016
2016
  name: "Core:Button",
2017
2017
  image: "https://cdn.builder.io/api/v1/image/assets%2FIsxPKMo2gPRRKeakUztj1D6uqed2%2F81a15681c3e74df09677dfc57a615b13",
2018
2018
  defaultStyles: {
@@ -2050,7 +2050,7 @@ const componentInfo$b = {
2050
2050
  static: true,
2051
2051
  noWrap: true
2052
2052
  };
2053
- const componentInfo$a = {
2053
+ const componentInfo$e = {
2054
2054
  // TODO: ways to statically preprocess JSON for references, functions, etc
2055
2055
  name: "Columns",
2056
2056
  isRSC: true,
@@ -2292,186 +2292,14 @@ const componentInfo$a = {
2292
2292
  }
2293
2293
  ]
2294
2294
  };
2295
- const componentInfo$9 = {
2296
- name: "Custom Code",
2297
- static: true,
2298
- requiredPermissions: [
2299
- "editCode"
2300
- ],
2301
- inputs: [
2302
- {
2303
- name: "code",
2304
- type: "html",
2305
- required: true,
2306
- defaultValue: "<p>Hello there, I am custom HTML code!</p>",
2307
- code: true
2308
- },
2309
- {
2310
- name: "replaceNodes",
2311
- type: "boolean",
2312
- helperText: "Preserve server rendered dom nodes",
2313
- advanced: true
2314
- },
2315
- {
2316
- name: "scriptsClientOnly",
2317
- type: "boolean",
2318
- defaultValue: false,
2319
- helperText: "Only print and run scripts on the client. Important when scripts influence DOM that could be replaced when client loads",
2320
- advanced: true
2321
- }
2322
- ]
2323
- };
2324
- const CustomCode = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((props) => {
2325
- const elementRef = useSignal();
2326
- const state = useStore({
2327
- scriptsInserted: [],
2328
- scriptsRun: []
2329
- });
2330
- useOn("qvisible", /* @__PURE__ */ inlinedQrl((event, element) => {
2331
- const [state2] = useLexicalScope();
2332
- if (!(element == null ? void 0 : element.getElementsByTagName) || typeof window === "undefined")
2333
- return;
2334
- const scripts = element.getElementsByTagName("script");
2335
- for (let i = 0; i < scripts.length; i++) {
2336
- const script = scripts[i];
2337
- if (script.src) {
2338
- if (state2.scriptsInserted.includes(script.src))
2339
- continue;
2340
- state2.scriptsInserted.push(script.src);
2341
- const newScript = document.createElement("script");
2342
- newScript.async = true;
2343
- newScript.src = script.src;
2344
- document.head.appendChild(newScript);
2345
- } else if (!script.type || [
2346
- "text/javascript",
2347
- "application/javascript",
2348
- "application/ecmascript"
2349
- ].includes(script.type)) {
2350
- if (state2.scriptsRun.includes(script.innerText))
2351
- continue;
2352
- try {
2353
- state2.scriptsRun.push(script.innerText);
2354
- new Function(script.innerText)();
2355
- } catch (error) {
2356
- console.warn("`CustomCode`: Error running script:", error);
2357
- }
2358
- }
2359
- }
2360
- }, "CustomCode_component_useOn_zjAgBhFOiCs", [
2361
- state
2362
- ]));
2363
- return /* @__PURE__ */ _jsxQ("div", {
2364
- ref: elementRef
2365
- }, {
2366
- class: _fnSignal((p0) => "builder-custom-code" + (p0.replaceNodes ? " replace-nodes" : ""), [
2367
- props
2368
- ], '"builder-custom-code"+(p0.replaceNodes?" replace-nodes":"")'),
2369
- dangerouslySetInnerHTML: _fnSignal((p0) => p0.code, [
2370
- props
2371
- ], "p0.code")
2372
- }, null, 3, "bY_0");
2373
- }, "CustomCode_component_uYOSy7w7Zqw"));
2374
- const componentInfo$8 = {
2375
- name: "Embed",
2376
- static: true,
2377
- inputs: [
2378
- {
2379
- name: "url",
2380
- type: "url",
2381
- required: true,
2382
- defaultValue: "",
2383
- helperText: "e.g. enter a youtube url, google map, etc",
2384
- onChange: (options) => {
2385
- const url = options.get("url");
2386
- if (url) {
2387
- options.set("content", "Loading...");
2388
- const apiKey = "ae0e60e78201a3f2b0de4b";
2389
- return fetch(`https://iframe.ly/api/iframely?url=${url}&api_key=${apiKey}`).then((res) => res.json()).then((data) => {
2390
- if (options.get("url") === url) {
2391
- if (data.html)
2392
- options.set("content", data.html);
2393
- else
2394
- options.set("content", "Invalid url, please try another");
2395
- }
2396
- }).catch((_err) => {
2397
- options.set("content", "There was an error embedding this URL, please try again or another URL");
2398
- });
2399
- } else
2400
- options.delete("content");
2401
- }
2402
- },
2403
- {
2404
- name: "content",
2405
- type: "html",
2406
- defaultValue: '<div style="padding: 20px; text-align: center">(Choose an embed URL)<div>',
2407
- hideFromUI: true
2408
- }
2409
- ]
2410
- };
2411
- const SCRIPT_MIME_TYPES = [
2412
- "text/javascript",
2413
- "application/javascript",
2414
- "application/ecmascript"
2415
- ];
2416
- const isJsScript = (script) => SCRIPT_MIME_TYPES.includes(script.type);
2417
- const findAndRunScripts = function findAndRunScripts2(props, state, elem) {
2418
- if (!elem.value || !elem.value.getElementsByTagName)
2419
- return;
2420
- const scripts = elem.value.getElementsByTagName("script");
2421
- for (let i = 0; i < scripts.length; i++) {
2422
- const script = scripts[i];
2423
- if (script.src && !state.scriptsInserted.includes(script.src)) {
2424
- state.scriptsInserted.push(script.src);
2425
- const newScript = document.createElement("script");
2426
- newScript.async = true;
2427
- newScript.src = script.src;
2428
- document.head.appendChild(newScript);
2429
- } else if (isJsScript(script) && !state.scriptsRun.includes(script.innerText))
2430
- try {
2431
- state.scriptsRun.push(script.innerText);
2432
- new Function(script.innerText)();
2433
- } catch (error) {
2434
- console.warn("`Embed`: Error running script:", error);
2435
- }
2436
- }
2437
- };
2438
- const Embed = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((props) => {
2439
- const elem = useSignal();
2440
- const state = useStore({
2441
- ranInitFn: false,
2442
- scriptsInserted: [],
2443
- scriptsRun: []
2444
- });
2445
- useTaskQrl(/* @__PURE__ */ inlinedQrl(({ track: track2 }) => {
2446
- const [elem2, props2, state2] = useLexicalScope();
2447
- track2(() => elem2.value);
2448
- track2(() => state2.ranInitFn);
2449
- if (elem2.value && !state2.ranInitFn) {
2450
- state2.ranInitFn = true;
2451
- findAndRunScripts(props2, state2, elem2);
2452
- }
2453
- }, "Embed_component_useTask_bg7ez0XUtiM", [
2454
- elem,
2455
- props,
2456
- state
2457
- ]));
2458
- return /* @__PURE__ */ _jsxQ("div", {
2459
- ref: elem
2460
- }, {
2461
- class: "builder-embed",
2462
- dangerouslySetInnerHTML: _fnSignal((p0) => p0.content, [
2463
- props
2464
- ], "p0.content")
2465
- }, null, 3, "9r_0");
2466
- }, "Embed_component_Uji08ORjXbE"));
2467
- const componentInfo$7 = {
2295
+ const componentInfo$d = {
2468
2296
  name: "Fragment",
2469
2297
  static: true,
2470
2298
  hidden: true,
2471
2299
  canHaveChildren: true,
2472
2300
  noWrap: true
2473
2301
  };
2474
- const componentInfo$6 = {
2302
+ const componentInfo$c = {
2475
2303
  name: "Image",
2476
2304
  static: true,
2477
2305
  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",
@@ -2619,49 +2447,7 @@ const componentInfo$6 = {
2619
2447
  }
2620
2448
  ]
2621
2449
  };
2622
- const componentInfo$5 = {
2623
- // friendlyName?
2624
- name: "Raw:Img",
2625
- hideFromInsertMenu: true,
2626
- 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",
2627
- inputs: [
2628
- {
2629
- name: "image",
2630
- bubble: true,
2631
- type: "file",
2632
- allowedFileTypes: [
2633
- "jpeg",
2634
- "jpg",
2635
- "png",
2636
- "svg",
2637
- "gif",
2638
- "webp"
2639
- ],
2640
- required: true
2641
- }
2642
- ],
2643
- noWrap: true,
2644
- static: true
2645
- };
2646
- const ImgComponent = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((props) => {
2647
- return /* @__PURE__ */ _jsxS("img", {
2648
- ...props.attributes
2649
- }, {
2650
- alt: _fnSignal((p0) => p0.altText, [
2651
- props
2652
- ], "p0.altText"),
2653
- src: _fnSignal((p0) => p0.imgSrc || p0.image, [
2654
- props
2655
- ], "p0.imgSrc||p0.image"),
2656
- style: _fnSignal((p0) => ({
2657
- objectFit: p0.backgroundSize || "cover",
2658
- objectPosition: p0.backgroundPosition || "center"
2659
- }), [
2660
- props
2661
- ], '{objectFit:p0.backgroundSize||"cover",objectPosition:p0.backgroundPosition||"center"}')
2662
- }, 0, isEditing() && props.imgSrc || "default-key");
2663
- }, "ImgComponent_component_FXvIDBSffO8"));
2664
- const componentInfo$4 = {
2450
+ const componentInfo$b = {
2665
2451
  name: "Core:Section",
2666
2452
  static: true,
2667
2453
  image: "https://cdn.builder.io/api/v1/image/assets%2FIsxPKMo2gPRRKeakUztj1D6uqed2%2F682efef23ace49afac61748dd305c70a",
@@ -2706,7 +2492,7 @@ const componentInfo$4 = {
2706
2492
  }
2707
2493
  ]
2708
2494
  };
2709
- const componentInfo$3 = {
2495
+ const componentInfo$a = {
2710
2496
  name: "Slot",
2711
2497
  isRSC: true,
2712
2498
  description: "Allow child blocks to be inserted into this content when used as a Symbol",
@@ -2761,7 +2547,7 @@ const Slot = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((props) =>
2761
2547
  }
2762
2548
  }, 0, "B1_1");
2763
2549
  }, "Slot_component_WWgWgfV0bb0"));
2764
- const componentInfo$2 = {
2550
+ const componentInfo$9 = {
2765
2551
  name: "Symbol",
2766
2552
  noWrap: true,
2767
2553
  static: true,
@@ -2801,7 +2587,7 @@ const componentInfo$2 = {
2801
2587
  }
2802
2588
  ]
2803
2589
  };
2804
- const componentInfo$1 = {
2590
+ const componentInfo$8 = {
2805
2591
  name: "Text",
2806
2592
  static: true,
2807
2593
  isRSC: true,
@@ -2836,27 +2622,1006 @@ const Text = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((props) =>
2836
2622
  }
2837
2623
  }, null, 3, "yO_0");
2838
2624
  }, "Text_component_15p0cKUxgIE"));
2839
- const componentInfo = {
2840
- name: "Video",
2841
- canHaveChildren: true,
2842
- defaultStyles: {
2843
- minHeight: "20px",
2844
- minWidth: "20px"
2845
- },
2846
- 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",
2625
+ const componentInfo$7 = {
2626
+ name: "Custom Code",
2627
+ static: true,
2628
+ requiredPermissions: [
2629
+ "editCode"
2630
+ ],
2847
2631
  inputs: [
2848
2632
  {
2849
- name: "video",
2850
- type: "file",
2851
- allowedFileTypes: [
2852
- "mp4"
2853
- ],
2854
- bubble: true,
2855
- defaultValue: "https://firebasestorage.googleapis.com/v0/b/builder-3b0a2.appspot.com/o/assets%2FKQlEmWDxA0coC3PK6UvkrjwkIGI2%2F28cb070609f546cdbe5efa20e931aa4b?alt=media&token=912e9551-7a7c-4dfb-86b6-3da1537d1a7f",
2856
- required: true
2857
- },
2858
- {
2859
- name: "posterImage",
2633
+ name: "code",
2634
+ type: "html",
2635
+ required: true,
2636
+ defaultValue: "<p>Hello there, I am custom HTML code!</p>",
2637
+ code: true
2638
+ },
2639
+ {
2640
+ name: "replaceNodes",
2641
+ type: "boolean",
2642
+ helperText: "Preserve server rendered dom nodes",
2643
+ advanced: true
2644
+ },
2645
+ {
2646
+ name: "scriptsClientOnly",
2647
+ type: "boolean",
2648
+ defaultValue: false,
2649
+ helperText: "Only print and run scripts on the client. Important when scripts influence DOM that could be replaced when client loads",
2650
+ advanced: true
2651
+ }
2652
+ ]
2653
+ };
2654
+ const CustomCode = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((props) => {
2655
+ const elementRef = useSignal();
2656
+ const state = useStore({
2657
+ scriptsInserted: [],
2658
+ scriptsRun: []
2659
+ });
2660
+ useOn("qvisible", /* @__PURE__ */ inlinedQrl((event, element) => {
2661
+ const [state2] = useLexicalScope();
2662
+ if (!(element == null ? void 0 : element.getElementsByTagName) || typeof window === "undefined")
2663
+ return;
2664
+ const scripts = element.getElementsByTagName("script");
2665
+ for (let i = 0; i < scripts.length; i++) {
2666
+ const script = scripts[i];
2667
+ if (script.src) {
2668
+ if (state2.scriptsInserted.includes(script.src))
2669
+ continue;
2670
+ state2.scriptsInserted.push(script.src);
2671
+ const newScript = document.createElement("script");
2672
+ newScript.async = true;
2673
+ newScript.src = script.src;
2674
+ document.head.appendChild(newScript);
2675
+ } else if (!script.type || [
2676
+ "text/javascript",
2677
+ "application/javascript",
2678
+ "application/ecmascript"
2679
+ ].includes(script.type)) {
2680
+ if (state2.scriptsRun.includes(script.innerText))
2681
+ continue;
2682
+ try {
2683
+ state2.scriptsRun.push(script.innerText);
2684
+ new Function(script.innerText)();
2685
+ } catch (error) {
2686
+ console.warn("`CustomCode`: Error running script:", error);
2687
+ }
2688
+ }
2689
+ }
2690
+ }, "CustomCode_component_useOn_zjAgBhFOiCs", [
2691
+ state
2692
+ ]));
2693
+ return /* @__PURE__ */ _jsxQ("div", {
2694
+ ref: elementRef
2695
+ }, {
2696
+ class: _fnSignal((p0) => "builder-custom-code" + (p0.replaceNodes ? " replace-nodes" : ""), [
2697
+ props
2698
+ ], '"builder-custom-code"+(p0.replaceNodes?" replace-nodes":"")'),
2699
+ dangerouslySetInnerHTML: _fnSignal((p0) => p0.code, [
2700
+ props
2701
+ ], "p0.code")
2702
+ }, null, 3, "bY_0");
2703
+ }, "CustomCode_component_uYOSy7w7Zqw"));
2704
+ const componentInfo$6 = {
2705
+ name: "Embed",
2706
+ static: true,
2707
+ inputs: [
2708
+ {
2709
+ name: "url",
2710
+ type: "url",
2711
+ required: true,
2712
+ defaultValue: "",
2713
+ helperText: "e.g. enter a youtube url, google map, etc",
2714
+ onChange: (options) => {
2715
+ const url = options.get("url");
2716
+ if (url) {
2717
+ options.set("content", "Loading...");
2718
+ const apiKey = "ae0e60e78201a3f2b0de4b";
2719
+ return fetch(`https://iframe.ly/api/iframely?url=${url}&api_key=${apiKey}`).then((res) => res.json()).then((data) => {
2720
+ if (options.get("url") === url) {
2721
+ if (data.html)
2722
+ options.set("content", data.html);
2723
+ else
2724
+ options.set("content", "Invalid url, please try another");
2725
+ }
2726
+ }).catch((_err) => {
2727
+ options.set("content", "There was an error embedding this URL, please try again or another URL");
2728
+ });
2729
+ } else
2730
+ options.delete("content");
2731
+ }
2732
+ },
2733
+ {
2734
+ name: "content",
2735
+ type: "html",
2736
+ defaultValue: '<div style="padding: 20px; text-align: center">(Choose an embed URL)<div>',
2737
+ hideFromUI: true
2738
+ }
2739
+ ]
2740
+ };
2741
+ const SCRIPT_MIME_TYPES = [
2742
+ "text/javascript",
2743
+ "application/javascript",
2744
+ "application/ecmascript"
2745
+ ];
2746
+ const isJsScript = (script) => SCRIPT_MIME_TYPES.includes(script.type);
2747
+ const findAndRunScripts = function findAndRunScripts2(props, state, elem) {
2748
+ if (!elem.value || !elem.value.getElementsByTagName)
2749
+ return;
2750
+ const scripts = elem.value.getElementsByTagName("script");
2751
+ for (let i = 0; i < scripts.length; i++) {
2752
+ const script = scripts[i];
2753
+ if (script.src && !state.scriptsInserted.includes(script.src)) {
2754
+ state.scriptsInserted.push(script.src);
2755
+ const newScript = document.createElement("script");
2756
+ newScript.async = true;
2757
+ newScript.src = script.src;
2758
+ document.head.appendChild(newScript);
2759
+ } else if (isJsScript(script) && !state.scriptsRun.includes(script.innerText))
2760
+ try {
2761
+ state.scriptsRun.push(script.innerText);
2762
+ new Function(script.innerText)();
2763
+ } catch (error) {
2764
+ console.warn("`Embed`: Error running script:", error);
2765
+ }
2766
+ }
2767
+ };
2768
+ const Embed = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((props) => {
2769
+ const elem = useSignal();
2770
+ const state = useStore({
2771
+ ranInitFn: false,
2772
+ scriptsInserted: [],
2773
+ scriptsRun: []
2774
+ });
2775
+ useTaskQrl(/* @__PURE__ */ inlinedQrl(({ track: track2 }) => {
2776
+ const [elem2, props2, state2] = useLexicalScope();
2777
+ track2(() => elem2.value);
2778
+ track2(() => state2.ranInitFn);
2779
+ if (elem2.value && !state2.ranInitFn) {
2780
+ state2.ranInitFn = true;
2781
+ findAndRunScripts(props2, state2, elem2);
2782
+ }
2783
+ }, "Embed_component_useTask_bg7ez0XUtiM", [
2784
+ elem,
2785
+ props,
2786
+ state
2787
+ ]));
2788
+ return /* @__PURE__ */ _jsxQ("div", {
2789
+ ref: elem
2790
+ }, {
2791
+ class: "builder-embed",
2792
+ dangerouslySetInnerHTML: _fnSignal((p0) => p0.content, [
2793
+ props
2794
+ ], "p0.content")
2795
+ }, null, 3, "9r_0");
2796
+ }, "Embed_component_Uji08ORjXbE"));
2797
+ const componentInfo$5 = {
2798
+ name: "Form:Form",
2799
+ // editableTags: ['builder-form-error']
2800
+ defaults: {
2801
+ responsiveStyles: {
2802
+ large: {
2803
+ marginTop: "15px",
2804
+ paddingBottom: "15px"
2805
+ }
2806
+ }
2807
+ },
2808
+ image: "https://cdn.builder.io/api/v1/image/assets%2FIsxPKMo2gPRRKeakUztj1D6uqed2%2Fef36d2a846134910b64b88e6d18c5ca5",
2809
+ inputs: [
2810
+ {
2811
+ name: "sendSubmissionsTo",
2812
+ type: "string",
2813
+ // TODO: save to builder data and user can download as csv
2814
+ // TODO: easy for mode too or computed add/remove fields form mode
2815
+ // so you can edit details and high level mode at same time...
2816
+ // Later - more integrations like mailchimp
2817
+ // /api/v1/form-submit?to=mailchimp
2818
+ enum: [
2819
+ {
2820
+ label: "Send to email",
2821
+ value: "email",
2822
+ helperText: "Send form submissions to the email address of your choosing"
2823
+ },
2824
+ {
2825
+ label: "Custom",
2826
+ value: "custom",
2827
+ helperText: "Handle where the form requests go manually with a little code, e.g. to your own custom backend"
2828
+ }
2829
+ ],
2830
+ defaultValue: "email"
2831
+ },
2832
+ {
2833
+ name: "sendSubmissionsToEmail",
2834
+ type: "string",
2835
+ required: true,
2836
+ // TODO: required: () => options.get("sendSubmissionsTo") === "email"
2837
+ defaultValue: "your@email.com",
2838
+ showIf: 'options.get("sendSubmissionsTo") === "email"'
2839
+ },
2840
+ {
2841
+ name: "sendWithJs",
2842
+ type: "boolean",
2843
+ helperText: "Set to false to use basic html form action",
2844
+ defaultValue: true,
2845
+ showIf: 'options.get("sendSubmissionsTo") === "custom"'
2846
+ },
2847
+ {
2848
+ name: "name",
2849
+ type: "string",
2850
+ defaultValue: "My form"
2851
+ },
2852
+ {
2853
+ name: "action",
2854
+ type: "string",
2855
+ helperText: "URL to send the form data to",
2856
+ showIf: 'options.get("sendSubmissionsTo") === "custom"'
2857
+ },
2858
+ {
2859
+ name: "contentType",
2860
+ type: "string",
2861
+ defaultValue: "application/json",
2862
+ advanced: true,
2863
+ // TODO: do automatically if file input
2864
+ enum: [
2865
+ "application/json",
2866
+ "multipart/form-data",
2867
+ "application/x-www-form-urlencoded"
2868
+ ],
2869
+ showIf: 'options.get("sendSubmissionsTo") === "custom" && options.get("sendWithJs") === true'
2870
+ },
2871
+ {
2872
+ name: "method",
2873
+ type: "string",
2874
+ showIf: 'options.get("sendSubmissionsTo") === "custom"',
2875
+ defaultValue: "POST",
2876
+ advanced: true
2877
+ },
2878
+ {
2879
+ name: "previewState",
2880
+ type: "string",
2881
+ // TODO: persist: false flag
2882
+ enum: [
2883
+ "unsubmitted",
2884
+ "sending",
2885
+ "success",
2886
+ "error"
2887
+ ],
2888
+ defaultValue: "unsubmitted",
2889
+ helperText: 'Choose a state to edit, e.g. choose "success" to show what users see on success and edit the message',
2890
+ showIf: 'options.get("sendSubmissionsTo") !== "zapier" && options.get("sendWithJs") === true'
2891
+ },
2892
+ {
2893
+ name: "successUrl",
2894
+ type: "url",
2895
+ helperText: "Optional URL to redirect the user to on form submission success",
2896
+ showIf: 'options.get("sendSubmissionsTo") !== "zapier" && options.get("sendWithJs") === true'
2897
+ },
2898
+ {
2899
+ name: "resetFormOnSubmit",
2900
+ type: "boolean",
2901
+ showIf: "options.get('sendSubmissionsTo') === 'custom' && options.get('sendWithJs') === true",
2902
+ advanced: true
2903
+ },
2904
+ {
2905
+ name: "successMessage",
2906
+ type: "uiBlocks",
2907
+ hideFromUI: true,
2908
+ defaultValue: [
2909
+ {
2910
+ "@type": "@builder.io/sdk:Element",
2911
+ responsiveStyles: {
2912
+ large: {
2913
+ marginTop: "10px"
2914
+ }
2915
+ },
2916
+ component: {
2917
+ name: "Text",
2918
+ options: {
2919
+ text: "<span>Thanks!</span>"
2920
+ }
2921
+ }
2922
+ }
2923
+ ]
2924
+ },
2925
+ {
2926
+ name: "validate",
2927
+ type: "boolean",
2928
+ defaultValue: true,
2929
+ advanced: true
2930
+ },
2931
+ {
2932
+ name: "errorMessagePath",
2933
+ type: "text",
2934
+ advanced: true,
2935
+ 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" }}'
2936
+ },
2937
+ {
2938
+ name: "errorMessage",
2939
+ type: "uiBlocks",
2940
+ hideFromUI: true,
2941
+ defaultValue: [
2942
+ {
2943
+ "@type": "@builder.io/sdk:Element",
2944
+ responsiveStyles: {
2945
+ large: {
2946
+ marginTop: "10px"
2947
+ }
2948
+ },
2949
+ bindings: {
2950
+ "component.options.text": "state.formErrorMessage || block.component.options.text"
2951
+ },
2952
+ component: {
2953
+ name: "Text",
2954
+ options: {
2955
+ text: "<span>Form submission error :( Please check your answers and try again</span>"
2956
+ }
2957
+ }
2958
+ }
2959
+ ]
2960
+ },
2961
+ {
2962
+ name: "sendingMessage",
2963
+ type: "uiBlocks",
2964
+ hideFromUI: true,
2965
+ defaultValue: [
2966
+ {
2967
+ "@type": "@builder.io/sdk:Element",
2968
+ responsiveStyles: {
2969
+ large: {
2970
+ marginTop: "10px"
2971
+ }
2972
+ },
2973
+ component: {
2974
+ name: "Text",
2975
+ options: {
2976
+ text: "<span>Sending...</span>"
2977
+ }
2978
+ }
2979
+ }
2980
+ ]
2981
+ },
2982
+ {
2983
+ name: "customHeaders",
2984
+ type: "map",
2985
+ valueType: {
2986
+ type: "string"
2987
+ },
2988
+ advanced: true,
2989
+ showIf: 'options.get("sendSubmissionsTo") === "custom" && options.get("sendWithJs") === true'
2990
+ }
2991
+ ],
2992
+ noWrap: true,
2993
+ canHaveChildren: true,
2994
+ defaultChildren: [
2995
+ {
2996
+ "@type": "@builder.io/sdk:Element",
2997
+ responsiveStyles: {
2998
+ large: {
2999
+ marginTop: "10px"
3000
+ }
3001
+ },
3002
+ component: {
3003
+ name: "Text",
3004
+ options: {
3005
+ text: "<span>Enter your name</span>"
3006
+ }
3007
+ }
3008
+ },
3009
+ {
3010
+ "@type": "@builder.io/sdk:Element",
3011
+ responsiveStyles: {
3012
+ large: {
3013
+ marginTop: "10px"
3014
+ }
3015
+ },
3016
+ component: {
3017
+ name: "Form:Input",
3018
+ options: {
3019
+ name: "name",
3020
+ placeholder: "Jane Doe"
3021
+ }
3022
+ }
3023
+ },
3024
+ {
3025
+ "@type": "@builder.io/sdk:Element",
3026
+ responsiveStyles: {
3027
+ large: {
3028
+ marginTop: "10px"
3029
+ }
3030
+ },
3031
+ component: {
3032
+ name: "Text",
3033
+ options: {
3034
+ text: "<span>Enter your email</span>"
3035
+ }
3036
+ }
3037
+ },
3038
+ {
3039
+ "@type": "@builder.io/sdk:Element",
3040
+ responsiveStyles: {
3041
+ large: {
3042
+ marginTop: "10px"
3043
+ }
3044
+ },
3045
+ component: {
3046
+ name: "Form:Input",
3047
+ options: {
3048
+ name: "email",
3049
+ placeholder: "jane@doe.com"
3050
+ }
3051
+ }
3052
+ },
3053
+ {
3054
+ "@type": "@builder.io/sdk:Element",
3055
+ responsiveStyles: {
3056
+ large: {
3057
+ marginTop: "10px"
3058
+ }
3059
+ },
3060
+ component: {
3061
+ name: "Form:SubmitButton",
3062
+ options: {
3063
+ text: "Submit"
3064
+ }
3065
+ }
3066
+ }
3067
+ ]
3068
+ };
3069
+ const validEnvList = [
3070
+ "production",
3071
+ "qa",
3072
+ "test",
3073
+ "development",
3074
+ "dev",
3075
+ "cdn-qa",
3076
+ "cloud",
3077
+ "fast",
3078
+ "cdn2",
3079
+ "cdn-prod"
3080
+ ];
3081
+ const getEnv = () => {
3082
+ const env = process.env.NODE_ENV || "production";
3083
+ return validEnvList.includes(env) ? env : "production";
3084
+ };
3085
+ const get = (obj, path, defaultValue) => {
3086
+ const result = String.prototype.split.call(path, /[,[\].]+?/).filter(Boolean).reduce((res, key) => res !== null && res !== void 0 ? res[key] : res, obj);
3087
+ return result === void 0 || result === obj ? defaultValue : result;
3088
+ };
3089
+ const mergeNewRootState$1 = function mergeNewRootState2(props, state, formRef, newData) {
3090
+ var _a, _b;
3091
+ const combinedState = {
3092
+ ...props.builderContext.rootState,
3093
+ ...newData
3094
+ };
3095
+ if (props.builderContext.rootSetState)
3096
+ (_b = (_a = props.builderContext).rootSetState) == null ? void 0 : _b.call(_a, combinedState);
3097
+ else
3098
+ props.builderContext.rootState = combinedState;
3099
+ };
3100
+ const submissionState = function submissionState2(props, state, formRef) {
3101
+ return isEditing() && props.previewState || state.formState;
3102
+ };
3103
+ const onSubmit = function onSubmit2(props, state, formRef, event) {
3104
+ var _a;
3105
+ const sendWithJsProp = props.sendWithJs || props.sendSubmissionsTo === "email";
3106
+ if (props.sendSubmissionsTo === "zapier")
3107
+ event.preventDefault();
3108
+ else if (sendWithJsProp) {
3109
+ if (!(props.action || props.sendSubmissionsTo === "email")) {
3110
+ event.preventDefault();
3111
+ return;
3112
+ }
3113
+ event.preventDefault();
3114
+ const el = event.currentTarget;
3115
+ const headers = props.customHeaders || {};
3116
+ let body;
3117
+ const formData = new FormData(el);
3118
+ const formPairs = Array.from(event.currentTarget.querySelectorAll("input,select,textarea")).filter((el2) => !!el2.name).map((el2) => {
3119
+ let value;
3120
+ const key = el2.name;
3121
+ if (el2 instanceof HTMLInputElement) {
3122
+ if (el2.type === "radio") {
3123
+ if (el2.checked) {
3124
+ value = el2.name;
3125
+ return {
3126
+ key,
3127
+ value
3128
+ };
3129
+ }
3130
+ } else if (el2.type === "checkbox")
3131
+ value = el2.checked;
3132
+ else if (el2.type === "number" || el2.type === "range") {
3133
+ const num = el2.valueAsNumber;
3134
+ if (!isNaN(num))
3135
+ value = num;
3136
+ } else if (el2.type === "file")
3137
+ value = el2.files;
3138
+ else
3139
+ value = el2.value;
3140
+ } else
3141
+ value = el2.value;
3142
+ return {
3143
+ key,
3144
+ value
3145
+ };
3146
+ });
3147
+ let formContentType = props.contentType;
3148
+ if (props.sendSubmissionsTo === "email")
3149
+ formContentType = "multipart/form-data";
3150
+ Array.from(formPairs).forEach(({ value }) => {
3151
+ if (value instanceof File || Array.isArray(value) && value[0] instanceof File || value instanceof FileList)
3152
+ formContentType = "multipart/form-data";
3153
+ });
3154
+ if (formContentType !== "application/json")
3155
+ body = formData;
3156
+ else {
3157
+ const json = {};
3158
+ Array.from(formPairs).forEach(({ value, key }) => {
3159
+ set(json, key, value);
3160
+ });
3161
+ body = JSON.stringify(json);
3162
+ }
3163
+ if (formContentType && formContentType !== "multipart/form-data") {
3164
+ if (
3165
+ /* Zapier doesn't allow content-type header to be sent from browsers */
3166
+ !(sendWithJsProp && ((_a = props.action) == null ? void 0 : _a.includes("zapier.com")))
3167
+ )
3168
+ headers["content-type"] = formContentType;
3169
+ }
3170
+ const presubmitEvent = new CustomEvent("presubmit", {
3171
+ detail: {
3172
+ body
3173
+ }
3174
+ });
3175
+ if (formRef.value) {
3176
+ formRef.value.dispatchEvent(presubmitEvent);
3177
+ if (presubmitEvent.defaultPrevented)
3178
+ return;
3179
+ }
3180
+ state.formState = "sending";
3181
+ const formUrl = `${getEnv() === "dev" ? "http://localhost:5000" : "https://builder.io"}/api/v1/form-submit?apiKey=${props.builderContext.apiKey}&to=${btoa(props.sendSubmissionsToEmail || "")}&name=${encodeURIComponent(props.name || "")}`;
3182
+ fetch(props.sendSubmissionsTo === "email" ? formUrl : props.action, {
3183
+ body,
3184
+ headers,
3185
+ method: props.method || "post"
3186
+ }).then(async (res) => {
3187
+ let body2;
3188
+ const contentType = res.headers.get("content-type");
3189
+ if (contentType && contentType.indexOf("application/json") !== -1)
3190
+ body2 = await res.json();
3191
+ else
3192
+ body2 = await res.text();
3193
+ if (!res.ok && props.errorMessagePath) {
3194
+ let message = get(body2, props.errorMessagePath);
3195
+ if (message) {
3196
+ if (typeof message !== "string")
3197
+ message = JSON.stringify(message);
3198
+ state.formErrorMessage = message;
3199
+ mergeNewRootState$1(props, state, formRef, {
3200
+ formErrorMessage: message
3201
+ });
3202
+ }
3203
+ }
3204
+ state.responseData = body2;
3205
+ state.formState = res.ok ? "success" : "error";
3206
+ if (res.ok) {
3207
+ const submitSuccessEvent = new CustomEvent("submit:success", {
3208
+ detail: {
3209
+ res,
3210
+ body: body2
3211
+ }
3212
+ });
3213
+ if (formRef.value) {
3214
+ formRef.value.dispatchEvent(submitSuccessEvent);
3215
+ if (submitSuccessEvent.defaultPrevented)
3216
+ return;
3217
+ if (props.resetFormOnSubmit !== false)
3218
+ formRef.value.reset();
3219
+ }
3220
+ if (props.successUrl) {
3221
+ if (formRef.value) {
3222
+ const event2 = new CustomEvent("route", {
3223
+ detail: {
3224
+ url: props.successUrl
3225
+ }
3226
+ });
3227
+ formRef.value.dispatchEvent(event2);
3228
+ if (!event2.defaultPrevented)
3229
+ location.href = props.successUrl;
3230
+ } else
3231
+ location.href = props.successUrl;
3232
+ }
3233
+ }
3234
+ }, (err) => {
3235
+ const submitErrorEvent = new CustomEvent("submit:error", {
3236
+ detail: {
3237
+ error: err
3238
+ }
3239
+ });
3240
+ if (formRef.value) {
3241
+ formRef.value.dispatchEvent(submitErrorEvent);
3242
+ if (submitErrorEvent.defaultPrevented)
3243
+ return;
3244
+ }
3245
+ state.responseData = err;
3246
+ state.formState = "error";
3247
+ });
3248
+ }
3249
+ };
3250
+ const FormComponent = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((props) => {
3251
+ var _a;
3252
+ _jsxBranch();
3253
+ useStylesScopedQrl(/* @__PURE__ */ inlinedQrl(STYLES, "FormComponent_component_useStylesScoped_SVdPvm0do3s"));
3254
+ const formRef = useSignal();
3255
+ const state = useStore({
3256
+ formErrorMessage: "",
3257
+ formState: "unsubmitted",
3258
+ responseData: null
3259
+ });
3260
+ return /* @__PURE__ */ _jsxS("form", {
3261
+ action: (() => {
3262
+ !props.sendWithJs && props.action;
3263
+ })(),
3264
+ ref: formRef,
3265
+ ...props.attributes,
3266
+ children: [
3267
+ props.builderBlock && props.builderBlock.children ? (((_a = props.builderBlock) == null ? void 0 : _a.children) || []).map((block, idx) => {
3268
+ return /* @__PURE__ */ _jsxC(Block, {
3269
+ block,
3270
+ get context() {
3271
+ return props.builderContext;
3272
+ },
3273
+ get registeredComponents() {
3274
+ return props.builderComponents;
3275
+ },
3276
+ get linkComponent() {
3277
+ return props.builderLinkComponent;
3278
+ },
3279
+ [_IMMUTABLE]: {
3280
+ context: _fnSignal((p0) => p0.builderContext, [
3281
+ props
3282
+ ], "p0.builderContext"),
3283
+ linkComponent: _fnSignal((p0) => p0.builderLinkComponent, [
3284
+ props
3285
+ ], "p0.builderLinkComponent"),
3286
+ registeredComponents: _fnSignal((p0) => p0.builderComponents, [
3287
+ props
3288
+ ], "p0.builderComponents")
3289
+ }
3290
+ }, 3, `form-block-${idx}`);
3291
+ }) : null,
3292
+ submissionState(props, state) === "error" ? /* @__PURE__ */ _jsxC(Blocks, {
3293
+ path: "errorMessage",
3294
+ get blocks() {
3295
+ return props.errorMessage;
3296
+ },
3297
+ get context() {
3298
+ return props.builderContext;
3299
+ },
3300
+ [_IMMUTABLE]: {
3301
+ blocks: _fnSignal((p0) => p0.errorMessage, [
3302
+ props
3303
+ ], "p0.errorMessage"),
3304
+ context: _fnSignal((p0) => p0.builderContext, [
3305
+ props
3306
+ ], "p0.builderContext"),
3307
+ path: _IMMUTABLE
3308
+ }
3309
+ }, 3, "0n_0") : null,
3310
+ submissionState(props, state) === "sending" ? /* @__PURE__ */ _jsxC(Blocks, {
3311
+ path: "sendingMessage",
3312
+ get blocks() {
3313
+ return props.sendingMessage;
3314
+ },
3315
+ get context() {
3316
+ return props.builderContext;
3317
+ },
3318
+ [_IMMUTABLE]: {
3319
+ blocks: _fnSignal((p0) => p0.sendingMessage, [
3320
+ props
3321
+ ], "p0.sendingMessage"),
3322
+ context: _fnSignal((p0) => p0.builderContext, [
3323
+ props
3324
+ ], "p0.builderContext"),
3325
+ path: _IMMUTABLE
3326
+ }
3327
+ }, 3, "0n_1") : null,
3328
+ submissionState(props, state) === "error" && state.responseData ? /* @__PURE__ */ _jsxQ("pre", null, {
3329
+ class: "builder-form-error-text pre-FormComponent"
3330
+ }, JSON.stringify(state.responseData, null, 2), 1, "0n_2") : null,
3331
+ submissionState(props, state) === "success" ? /* @__PURE__ */ _jsxC(Blocks, {
3332
+ path: "successMessage",
3333
+ get blocks() {
3334
+ return props.successMessage;
3335
+ },
3336
+ get context() {
3337
+ return props.builderContext;
3338
+ },
3339
+ [_IMMUTABLE]: {
3340
+ blocks: _fnSignal((p0) => p0.successMessage, [
3341
+ props
3342
+ ], "p0.successMessage"),
3343
+ context: _fnSignal((p0) => p0.builderContext, [
3344
+ props
3345
+ ], "p0.builderContext"),
3346
+ path: _IMMUTABLE
3347
+ }
3348
+ }, 3, "0n_3") : null
3349
+ ],
3350
+ onSubmit$: /* @__PURE__ */ inlinedQrl((event) => {
3351
+ const [formRef2, props2, state2] = useLexicalScope();
3352
+ return onSubmit(props2, state2, formRef2, event);
3353
+ }, "FormComponent_component_form_onSubmit_F3ZFTlkNAQk", [
3354
+ formRef,
3355
+ props,
3356
+ state
3357
+ ])
3358
+ }, {
3359
+ method: _fnSignal((p0) => p0.method, [
3360
+ props
3361
+ ], "p0.method"),
3362
+ name: _fnSignal((p0) => p0.name, [
3363
+ props
3364
+ ], "p0.name"),
3365
+ validate: _fnSignal((p0) => p0.validate, [
3366
+ props
3367
+ ], "p0.validate")
3368
+ }, 0, "0n_4");
3369
+ }, "FormComponent_component_dk5c15Rvsfg"));
3370
+ const STYLES = `
3371
+ .pre-FormComponent {
3372
+ padding: 10px;
3373
+ color: red;
3374
+ text-align: center;
3375
+ }
3376
+ `;
3377
+ const componentInfo$4 = {
3378
+ name: "Form:Input",
3379
+ image: "https://cdn.builder.io/api/v1/image/assets%2FIsxPKMo2gPRRKeakUztj1D6uqed2%2Fad6f37889d9e40bbbbc72cdb5875d6ca",
3380
+ inputs: [
3381
+ {
3382
+ name: "type",
3383
+ type: "text",
3384
+ enum: [
3385
+ "text",
3386
+ "number",
3387
+ "email",
3388
+ "url",
3389
+ "checkbox",
3390
+ "radio",
3391
+ "range",
3392
+ "date",
3393
+ "datetime-local",
3394
+ "search",
3395
+ "tel",
3396
+ "time",
3397
+ "file",
3398
+ "month",
3399
+ "week",
3400
+ "password",
3401
+ "color",
3402
+ "hidden"
3403
+ ],
3404
+ defaultValue: "text"
3405
+ },
3406
+ {
3407
+ name: "name",
3408
+ type: "string",
3409
+ required: true,
3410
+ helperText: 'Every input in a form needs a unique name describing what it takes, e.g. "email"'
3411
+ },
3412
+ {
3413
+ name: "placeholder",
3414
+ type: "string",
3415
+ defaultValue: "Hello there",
3416
+ helperText: "Text to display when there is no value"
3417
+ },
3418
+ // TODO: handle value vs default value automatically like ng-model
3419
+ {
3420
+ name: "defaultValue",
3421
+ type: "string"
3422
+ },
3423
+ {
3424
+ name: "value",
3425
+ type: "string",
3426
+ advanced: true
3427
+ },
3428
+ {
3429
+ name: "required",
3430
+ type: "boolean",
3431
+ helperText: "Is this input required to be filled out to submit a form",
3432
+ defaultValue: false
3433
+ }
3434
+ ],
3435
+ noWrap: true,
3436
+ static: true,
3437
+ defaultStyles: {
3438
+ paddingTop: "10px",
3439
+ paddingBottom: "10px",
3440
+ paddingLeft: "10px",
3441
+ paddingRight: "10px",
3442
+ borderRadius: "3px",
3443
+ borderWidth: "1px",
3444
+ borderStyle: "solid",
3445
+ borderColor: "#ccc"
3446
+ }
3447
+ };
3448
+ const FormInputComponent = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((props) => {
3449
+ return /* @__PURE__ */ createElement("input", {
3450
+ ...props.attributes,
3451
+ key: isEditing() && props.defaultValue ? props.defaultValue : "default-key",
3452
+ placeholder: props.placeholder,
3453
+ type: props.type,
3454
+ name: props.name,
3455
+ value: props.value,
3456
+ defaultValue: props.defaultValue,
3457
+ required: props.required
3458
+ });
3459
+ }, "FormInputComponent_component_AUUjdN0ueMs"));
3460
+ const componentInfo$3 = {
3461
+ name: "Form:Select",
3462
+ image: "https://cdn.builder.io/api/v1/image/assets%2FIsxPKMo2gPRRKeakUztj1D6uqed2%2F83acca093fb24aaf94dee136e9a4b045",
3463
+ defaultStyles: {
3464
+ alignSelf: "flex-start"
3465
+ },
3466
+ inputs: [
3467
+ {
3468
+ name: "options",
3469
+ type: "list",
3470
+ required: true,
3471
+ subFields: [
3472
+ {
3473
+ name: "value",
3474
+ type: "text",
3475
+ required: true
3476
+ },
3477
+ {
3478
+ name: "name",
3479
+ type: "text"
3480
+ }
3481
+ ],
3482
+ defaultValue: [
3483
+ {
3484
+ value: "option 1"
3485
+ },
3486
+ {
3487
+ value: "option 2"
3488
+ }
3489
+ ]
3490
+ },
3491
+ {
3492
+ name: "name",
3493
+ type: "string",
3494
+ required: true,
3495
+ helperText: 'Every select in a form needs a unique name describing what it gets, e.g. "email"'
3496
+ },
3497
+ {
3498
+ name: "defaultValue",
3499
+ type: "string"
3500
+ },
3501
+ {
3502
+ name: "value",
3503
+ type: "string",
3504
+ advanced: true
3505
+ },
3506
+ {
3507
+ name: "required",
3508
+ type: "boolean",
3509
+ defaultValue: false
3510
+ }
3511
+ ],
3512
+ static: true,
3513
+ noWrap: true
3514
+ };
3515
+ const SelectComponent = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((props) => {
3516
+ return /* @__PURE__ */ createElement("select", {
3517
+ ...props.attributes,
3518
+ value: props.value,
3519
+ key: isEditing() && props.defaultValue ? props.defaultValue : "default-key",
3520
+ defaultValue: props.defaultValue,
3521
+ name: props.name
3522
+ }, (props.options || []).map((option) => {
3523
+ return /* @__PURE__ */ _jsxQ("option", {
3524
+ value: _wrapSignal(option, "value")
3525
+ }, null, option.name || option.value, 1, "tc_0");
3526
+ }));
3527
+ }, "SelectComponent_component_SPKbsFLikZU"));
3528
+ const componentInfo$2 = {
3529
+ name: "Form:SubmitButton",
3530
+ image: "https://cdn.builder.io/api/v1/image/assets%2FIsxPKMo2gPRRKeakUztj1D6uqed2%2Fdf2820ffed1f4349a94c40b3221f5b98",
3531
+ defaultStyles: {
3532
+ appearance: "none",
3533
+ paddingTop: "15px",
3534
+ paddingBottom: "15px",
3535
+ paddingLeft: "25px",
3536
+ paddingRight: "25px",
3537
+ backgroundColor: "#3898EC",
3538
+ color: "white",
3539
+ borderRadius: "4px",
3540
+ cursor: "pointer"
3541
+ },
3542
+ inputs: [
3543
+ {
3544
+ name: "text",
3545
+ type: "text",
3546
+ defaultValue: "Click me"
3547
+ }
3548
+ ],
3549
+ static: true,
3550
+ noWrap: true
3551
+ };
3552
+ const SubmitButton = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((props) => {
3553
+ return /* @__PURE__ */ _jsxS("button", {
3554
+ ...props.attributes,
3555
+ children: _fnSignal((p0) => p0.text, [
3556
+ props
3557
+ ], "p0.text")
3558
+ }, {
3559
+ type: "submit"
3560
+ }, 0, "6z_0");
3561
+ }, "SubmitButton_component_NXvMBMCDhwc"));
3562
+ const componentInfo$1 = {
3563
+ // friendlyName?
3564
+ name: "Raw:Img",
3565
+ hideFromInsertMenu: true,
3566
+ 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",
3567
+ inputs: [
3568
+ {
3569
+ name: "image",
3570
+ bubble: true,
3571
+ type: "file",
3572
+ allowedFileTypes: [
3573
+ "jpeg",
3574
+ "jpg",
3575
+ "png",
3576
+ "svg",
3577
+ "gif",
3578
+ "webp"
3579
+ ],
3580
+ required: true
3581
+ }
3582
+ ],
3583
+ noWrap: true,
3584
+ static: true
3585
+ };
3586
+ const ImgComponent = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((props) => {
3587
+ return /* @__PURE__ */ _jsxS("img", {
3588
+ ...props.attributes
3589
+ }, {
3590
+ alt: _fnSignal((p0) => p0.altText, [
3591
+ props
3592
+ ], "p0.altText"),
3593
+ src: _fnSignal((p0) => p0.imgSrc || p0.image, [
3594
+ props
3595
+ ], "p0.imgSrc||p0.image"),
3596
+ style: _fnSignal((p0) => ({
3597
+ objectFit: p0.backgroundSize || "cover",
3598
+ objectPosition: p0.backgroundPosition || "center"
3599
+ }), [
3600
+ props
3601
+ ], '{objectFit:p0.backgroundSize||"cover",objectPosition:p0.backgroundPosition||"center"}')
3602
+ }, 0, isEditing() && props.imgSrc || "default-key");
3603
+ }, "ImgComponent_component_FXvIDBSffO8"));
3604
+ const componentInfo = {
3605
+ name: "Video",
3606
+ canHaveChildren: true,
3607
+ defaultStyles: {
3608
+ minHeight: "20px",
3609
+ minWidth: "20px"
3610
+ },
3611
+ 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",
3612
+ inputs: [
3613
+ {
3614
+ name: "video",
3615
+ type: "file",
3616
+ allowedFileTypes: [
3617
+ "mp4"
3618
+ ],
3619
+ bubble: true,
3620
+ defaultValue: "https://firebasestorage.googleapis.com/v0/b/builder-3b0a2.appspot.com/o/assets%2FKQlEmWDxA0coC3PK6UvkrjwkIGI2%2F28cb070609f546cdbe5efa20e931aa4b?alt=media&token=912e9551-7a7c-4dfb-86b6-3da1537d1a7f",
3621
+ required: true
3622
+ },
3623
+ {
3624
+ name: "posterImage",
2860
3625
  type: "file",
2861
3626
  allowedFileTypes: [
2862
3627
  "jpeg",
@@ -3062,55 +3827,76 @@ const Video = /* @__PURE__ */ componentQrl(/* @__PURE__ */ inlinedQrl((props) =>
3062
3827
  }, /* @__PURE__ */ _jsxC(Slot$1, null, 3, "j7_4"), 1, "j7_5") : null
3063
3828
  ], 1, "j7_6");
3064
3829
  }, "Video_component_qdcTZflYyoQ"));
3065
- const getDefaultRegisteredComponents = () => [
3830
+ const getExtraComponents = () => [
3066
3831
  {
3067
- component: Button,
3068
- ...componentInfo$b
3832
+ component: CustomCode,
3833
+ ...componentInfo$7
3069
3834
  },
3070
3835
  {
3071
- component: Columns,
3072
- ...componentInfo$a
3836
+ component: Embed,
3837
+ ...componentInfo$6
3073
3838
  },
3839
+ ...[
3840
+ {
3841
+ component: FormComponent,
3842
+ ...componentInfo$5
3843
+ },
3844
+ {
3845
+ component: FormInputComponent,
3846
+ ...componentInfo$4
3847
+ },
3848
+ {
3849
+ component: SubmitButton,
3850
+ ...componentInfo$2
3851
+ },
3852
+ {
3853
+ component: SelectComponent,
3854
+ ...componentInfo$3
3855
+ }
3856
+ ],
3074
3857
  {
3075
- component: CustomCode,
3076
- ...componentInfo$9
3858
+ component: ImgComponent,
3859
+ ...componentInfo$1
3077
3860
  },
3078
3861
  {
3079
- component: Embed,
3080
- ...componentInfo$8
3862
+ component: Video,
3863
+ ...componentInfo
3864
+ }
3865
+ ];
3866
+ const getDefaultRegisteredComponents = () => [
3867
+ {
3868
+ component: Button,
3869
+ ...componentInfo$f
3870
+ },
3871
+ {
3872
+ component: Columns,
3873
+ ...componentInfo$e
3081
3874
  },
3082
3875
  {
3083
3876
  component: FragmentComponent,
3084
- ...componentInfo$7
3877
+ ...componentInfo$d
3085
3878
  },
3086
3879
  {
3087
3880
  component: Image,
3088
- ...componentInfo$6
3881
+ ...componentInfo$c
3089
3882
  },
3090
3883
  {
3091
- component: ImgComponent,
3092
- ...componentInfo$5
3884
+ component: SectionComponent,
3885
+ ...componentInfo$b
3093
3886
  },
3094
3887
  {
3095
- component: SectionComponent,
3096
- ...componentInfo$4
3888
+ component: Slot,
3889
+ ...componentInfo$a
3097
3890
  },
3098
3891
  {
3099
3892
  component: Symbol$1,
3100
- ...componentInfo$2
3893
+ ...componentInfo$9
3101
3894
  },
3102
3895
  {
3103
3896
  component: Text,
3104
- ...componentInfo$1
3105
- },
3106
- {
3107
- component: Video,
3108
- ...componentInfo
3897
+ ...componentInfo$8
3109
3898
  },
3110
- {
3111
- component: Slot,
3112
- ...componentInfo$3
3113
- }
3899
+ ...getExtraComponents()
3114
3900
  ];
3115
3901
  const components = [];
3116
3902
  const createRegisterComponentMessage = (info) => ({
@@ -3559,7 +4345,7 @@ function isFromTrustedHost(trustedHosts, e) {
3559
4345
  const url = new URL(e.origin), hostname = url.hostname;
3560
4346
  return (trustedHosts || DEFAULT_TRUSTED_HOSTS).findIndex((trustedHost) => trustedHost.startsWith("*.") ? hostname.endsWith(trustedHost.slice(1)) : trustedHost === hostname) > -1;
3561
4347
  }
3562
- const SDK_VERSION = "0.13.0";
4348
+ const SDK_VERSION = "0.13.2";
3563
4349
  const registry = {};
3564
4350
  function register(type, info) {
3565
4351
  let typeList = registry[type];
@@ -3742,7 +4528,7 @@ const subscribeToEditor = (model, callback, options) => {
3742
4528
  window.removeEventListener("message", listener);
3743
4529
  };
3744
4530
  };
3745
- const mergeNewRootState = function mergeNewRootState2(props, state, elementRef, newData) {
4531
+ const mergeNewRootState = function mergeNewRootState22(props, state, elementRef, newData) {
3746
4532
  var _a, _b;
3747
4533
  const combinedState = {
3748
4534
  ...props.builderContextSignal.rootState,