@builder.io/sdk-solid 0.13.1 → 0.13.3

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.
@@ -3940,7 +3940,7 @@ function BlockStyles(props) {
3940
3940
  }
3941
3941
  return true;
3942
3942
  }
3943
- function css4() {
3943
+ function css5() {
3944
3944
  const processedBlock = getProcessedBlock({
3945
3945
  block: props.block,
3946
3946
  localState: props.context.localState,
@@ -3983,7 +3983,7 @@ function BlockStyles(props) {
3983
3983
  }) : "";
3984
3984
  return [largeStylesClass, mediumStylesClass, smallStylesClass].join(" ");
3985
3985
  }
3986
- return <Show2 when={TARGET !== "reactNative" && css4() && canShowBlock()}><Inlined_styles_default styles={css4()} /></Show2>;
3986
+ return <Show2 when={TARGET !== "reactNative" && css5() && canShowBlock()}><Inlined_styles_default styles={css5()} /></Show2>;
3987
3987
  }
3988
3988
  var Block_styles_default = BlockStyles;
3989
3989
 
@@ -4272,10 +4272,10 @@ function Block(props) {
4272
4272
  componentOptions: {
4273
4273
  ...getBlockComponentOptions(processedBlock()),
4274
4274
  builderContext: props.context,
4275
- ...blockComponent()?.name === "Core:Button" || blockComponent()?.name === "Symbol" || blockComponent()?.name === "Columns" ? {
4275
+ ...blockComponent()?.name === "Core:Button" || blockComponent()?.name === "Symbol" || blockComponent()?.name === "Columns" || blockComponent()?.name === "Form:Form" ? {
4276
4276
  builderLinkComponent: props.linkComponent
4277
4277
  } : {},
4278
- ...blockComponent()?.name === "Symbol" || blockComponent()?.name === "Columns" ? {
4278
+ ...blockComponent()?.name === "Symbol" || blockComponent()?.name === "Columns" || blockComponent()?.name === "Form:Form" ? {
4279
4279
  builderComponents: props.registeredComponents
4280
4280
  } : {}
4281
4281
  },
@@ -4746,10 +4746,10 @@ function SectionComponent(props) {
4746
4746
  var section_default = SectionComponent;
4747
4747
 
4748
4748
  // src/blocks/symbol/symbol.tsx
4749
- import { onMount as onMount5, on as on3, createEffect as createEffect3, createSignal as createSignal14 } from "solid-js";
4749
+ import { onMount as onMount5, on as on3, createEffect as createEffect3, createSignal as createSignal15 } from "solid-js";
4750
4750
 
4751
4751
  // src/components/content-variants/content-variants.tsx
4752
- import { Show as Show11, For as For5, onMount as onMount4, createSignal as createSignal13 } from "solid-js";
4752
+ import { Show as Show12, For as For7, onMount as onMount4, createSignal as createSignal14 } from "solid-js";
4753
4753
 
4754
4754
  // src/helpers/url.ts
4755
4755
  var getTopLevelDomain = (host) => {
@@ -4943,7 +4943,7 @@ var handleABTesting = async ({
4943
4943
  var getDefaultCanTrack = (canTrack) => checkIsDefined(canTrack) ? canTrack : true;
4944
4944
 
4945
4945
  // src/components/content/content.tsx
4946
- import { Show as Show10, createSignal as createSignal12 } from "solid-js";
4946
+ import { Show as Show11, createSignal as createSignal13 } from "solid-js";
4947
4947
 
4948
4948
  // src/blocks/button/component-info.ts
4949
4949
  var componentInfo = {
@@ -5201,162 +5201,8 @@ var componentInfo2 = {
5201
5201
  }]
5202
5202
  };
5203
5203
 
5204
- // src/blocks/custom-code/component-info.ts
5205
- var componentInfo3 = {
5206
- name: "Custom Code",
5207
- static: true,
5208
- requiredPermissions: ["editCode"],
5209
- inputs: [{
5210
- name: "code",
5211
- type: "html",
5212
- required: true,
5213
- defaultValue: "<p>Hello there, I am custom HTML code!</p>",
5214
- code: true
5215
- }, {
5216
- name: "replaceNodes",
5217
- type: "boolean",
5218
- helperText: "Preserve server rendered dom nodes",
5219
- advanced: true
5220
- }, {
5221
- name: "scriptsClientOnly",
5222
- type: "boolean",
5223
- defaultValue: false,
5224
- helperText: "Only print and run scripts on the client. Important when scripts influence DOM that could be replaced when client loads",
5225
- advanced: true
5226
- }]
5227
- };
5228
-
5229
- // src/blocks/custom-code/custom-code.tsx
5230
- import { onMount as onMount2, createSignal as createSignal7 } from "solid-js";
5231
- function CustomCode(props) {
5232
- const [scriptsInserted, setScriptsInserted] = createSignal7([]);
5233
- const [scriptsRun, setScriptsRun] = createSignal7([]);
5234
- let elementRef;
5235
- onMount2(() => {
5236
- if (!elementRef?.getElementsByTagName || typeof window === "undefined") {
5237
- return;
5238
- }
5239
- const scripts = elementRef.getElementsByTagName("script");
5240
- for (let i = 0; i < scripts.length; i++) {
5241
- const script = scripts[i];
5242
- if (script.src) {
5243
- if (scriptsInserted().includes(script.src)) {
5244
- continue;
5245
- }
5246
- scriptsInserted().push(script.src);
5247
- const newScript = document.createElement("script");
5248
- newScript.async = true;
5249
- newScript.src = script.src;
5250
- document.head.appendChild(newScript);
5251
- } else if (!script.type || [
5252
- "text/javascript",
5253
- "application/javascript",
5254
- "application/ecmascript"
5255
- ].includes(script.type)) {
5256
- if (scriptsRun().includes(script.innerText)) {
5257
- continue;
5258
- }
5259
- try {
5260
- scriptsRun().push(script.innerText);
5261
- new Function(script.innerText)();
5262
- } catch (error) {
5263
- }
5264
- }
5265
- }
5266
- });
5267
- return <div
5268
- class={"builder-custom-code" + (props.replaceNodes ? " replace-nodes" : "")}
5269
- ref={elementRef}
5270
- innerHTML={props.code}
5271
- />;
5272
- }
5273
- var custom_code_default = CustomCode;
5274
-
5275
- // src/blocks/embed/component-info.ts
5276
- var componentInfo4 = {
5277
- name: "Embed",
5278
- static: true,
5279
- inputs: [{
5280
- name: "url",
5281
- type: "url",
5282
- required: true,
5283
- defaultValue: "",
5284
- helperText: "e.g. enter a youtube url, google map, etc",
5285
- onChange: (options) => {
5286
- const url = options.get("url");
5287
- if (url) {
5288
- options.set("content", "Loading...");
5289
- const apiKey = "ae0e60e78201a3f2b0de4b";
5290
- return fetch(`https://iframe.ly/api/iframely?url=${url}&api_key=${apiKey}`).then((res) => res.json()).then((data) => {
5291
- if (options.get("url") === url) {
5292
- if (data.html) {
5293
- options.set("content", data.html);
5294
- } else {
5295
- options.set("content", "Invalid url, please try another");
5296
- }
5297
- }
5298
- }).catch((_err) => {
5299
- options.set("content", "There was an error embedding this URL, please try again or another URL");
5300
- });
5301
- } else {
5302
- options.delete("content");
5303
- }
5304
- }
5305
- }, {
5306
- name: "content",
5307
- type: "html",
5308
- defaultValue: '<div style="padding: 20px; text-align: center">(Choose an embed URL)<div>',
5309
- hideFromUI: true
5310
- }]
5311
- };
5312
-
5313
- // src/blocks/embed/embed.tsx
5314
- import { on, createEffect, createSignal as createSignal8 } from "solid-js";
5315
-
5316
- // src/blocks/embed/helpers.ts
5317
- var SCRIPT_MIME_TYPES = ["text/javascript", "application/javascript", "application/ecmascript"];
5318
- var isJsScript = (script) => SCRIPT_MIME_TYPES.includes(script.type);
5319
-
5320
- // src/blocks/embed/embed.tsx
5321
- function Embed(props) {
5322
- const [scriptsInserted, setScriptsInserted] = createSignal8([]);
5323
- const [scriptsRun, setScriptsRun] = createSignal8([]);
5324
- const [ranInitFn, setRanInitFn] = createSignal8(false);
5325
- function findAndRunScripts() {
5326
- if (!elem || !elem.getElementsByTagName)
5327
- return;
5328
- const scripts = elem.getElementsByTagName("script");
5329
- for (let i = 0; i < scripts.length; i++) {
5330
- const script = scripts[i];
5331
- if (script.src && !scriptsInserted().includes(script.src)) {
5332
- scriptsInserted().push(script.src);
5333
- const newScript = document.createElement("script");
5334
- newScript.async = true;
5335
- newScript.src = script.src;
5336
- document.head.appendChild(newScript);
5337
- } else if (isJsScript(script) && !scriptsRun().includes(script.innerText)) {
5338
- try {
5339
- scriptsRun().push(script.innerText);
5340
- new Function(script.innerText)();
5341
- } catch (error) {
5342
- }
5343
- }
5344
- }
5345
- }
5346
- let elem;
5347
- function onUpdateFn_0() {
5348
- if (elem && !ranInitFn()) {
5349
- setRanInitFn(true);
5350
- findAndRunScripts();
5351
- }
5352
- }
5353
- createEffect(on(() => [elem, ranInitFn()], onUpdateFn_0));
5354
- return <div class="builder-embed" ref={elem} innerHTML={props.content} />;
5355
- }
5356
- var embed_default = Embed;
5357
-
5358
5204
  // src/blocks/fragment/component-info.ts
5359
- var componentInfo5 = {
5205
+ var componentInfo3 = {
5360
5206
  name: "Fragment",
5361
5207
  static: true,
5362
5208
  hidden: true,
@@ -5365,7 +5211,7 @@ var componentInfo5 = {
5365
5211
  };
5366
5212
 
5367
5213
  // src/blocks/image/component-info.ts
5368
- var componentInfo6 = {
5214
+ var componentInfo4 = {
5369
5215
  name: "Image",
5370
5216
  static: true,
5371
5217
  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",
@@ -5486,41 +5332,8 @@ var componentInfo6 = {
5486
5332
  }]
5487
5333
  };
5488
5334
 
5489
- // src/blocks/img/component-info.ts
5490
- var componentInfo7 = {
5491
- // friendlyName?
5492
- name: "Raw:Img",
5493
- hideFromInsertMenu: true,
5494
- 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",
5495
- inputs: [{
5496
- name: "image",
5497
- bubble: true,
5498
- type: "file",
5499
- allowedFileTypes: ["jpeg", "jpg", "png", "svg", "gif", "webp"],
5500
- required: true
5501
- }],
5502
- noWrap: true,
5503
- static: true
5504
- };
5505
-
5506
- // src/blocks/img/img.tsx
5507
- function ImgComponent(props) {
5508
- return <img
5509
- style={{
5510
- "object-fit": props.backgroundSize || "cover",
5511
- "object-position": props.backgroundPosition || "center"
5512
- }}
5513
- key={isEditing() && props.imgSrc || "default-key"}
5514
- alt={props.altText}
5515
- src={props.imgSrc || props.image}
5516
- {...{}}
5517
- {...props.attributes}
5518
- />;
5519
- }
5520
- var img_default = ImgComponent;
5521
-
5522
5335
  // src/blocks/section/component-info.ts
5523
- var componentInfo8 = {
5336
+ var componentInfo5 = {
5524
5337
  name: "Core:Section",
5525
5338
  static: true,
5526
5339
  image: "https://cdn.builder.io/api/v1/image/assets%2FIsxPKMo2gPRRKeakUztj1D6uqed2%2F682efef23ace49afac61748dd305c70a",
@@ -5562,7 +5375,7 @@ var componentInfo8 = {
5562
5375
  };
5563
5376
 
5564
5377
  // src/blocks/slot/component-info.ts
5565
- var componentInfo9 = {
5378
+ var componentInfo6 = {
5566
5379
  name: "Slot",
5567
5380
  isRSC: true,
5568
5381
  description: "Allow child blocks to be inserted into this content when used as a Symbol",
@@ -5596,7 +5409,7 @@ function Slot(props) {
5596
5409
  var slot_default = Slot;
5597
5410
 
5598
5411
  // src/blocks/symbol/component-info.ts
5599
- var componentInfo10 = {
5412
+ var componentInfo7 = {
5600
5413
  name: "Symbol",
5601
5414
  noWrap: true,
5602
5415
  static: true,
@@ -5632,7 +5445,7 @@ var componentInfo10 = {
5632
5445
  };
5633
5446
 
5634
5447
  // src/blocks/text/component-info.ts
5635
- var componentInfo11 = {
5448
+ var componentInfo8 = {
5636
5449
  name: "Text",
5637
5450
  static: true,
5638
5451
  isRSC: true,
@@ -5664,54 +5477,894 @@ function Text(props) {
5664
5477
  }
5665
5478
  var text_default = Text;
5666
5479
 
5667
- // src/blocks/video/component-info.ts
5668
- var componentInfo12 = {
5669
- name: "Video",
5670
- canHaveChildren: true,
5671
- defaultStyles: {
5672
- minHeight: "20px",
5673
- minWidth: "20px"
5674
- },
5675
- 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",
5480
+ // src/blocks/custom-code/component-info.ts
5481
+ var componentInfo9 = {
5482
+ name: "Custom Code",
5483
+ static: true,
5484
+ requiredPermissions: ["editCode"],
5676
5485
  inputs: [{
5677
- name: "video",
5678
- type: "file",
5679
- allowedFileTypes: ["mp4"],
5680
- bubble: true,
5681
- defaultValue: "https://firebasestorage.googleapis.com/v0/b/builder-3b0a2.appspot.com/o/assets%2FKQlEmWDxA0coC3PK6UvkrjwkIGI2%2F28cb070609f546cdbe5efa20e931aa4b?alt=media&token=912e9551-7a7c-4dfb-86b6-3da1537d1a7f",
5682
- required: true
5683
- }, {
5684
- name: "posterImage",
5685
- type: "file",
5686
- allowedFileTypes: ["jpeg", "png"],
5687
- helperText: "Image to show before the video plays"
5688
- }, {
5689
- name: "autoPlay",
5690
- type: "boolean",
5691
- defaultValue: true
5692
- }, {
5693
- name: "controls",
5694
- type: "boolean",
5695
- defaultValue: false
5696
- }, {
5697
- name: "muted",
5698
- type: "boolean",
5699
- defaultValue: true
5486
+ name: "code",
5487
+ type: "html",
5488
+ required: true,
5489
+ defaultValue: "<p>Hello there, I am custom HTML code!</p>",
5490
+ code: true
5700
5491
  }, {
5701
- name: "loop",
5492
+ name: "replaceNodes",
5702
5493
  type: "boolean",
5703
- defaultValue: true
5494
+ helperText: "Preserve server rendered dom nodes",
5495
+ advanced: true
5704
5496
  }, {
5705
- name: "playsInline",
5497
+ name: "scriptsClientOnly",
5706
5498
  type: "boolean",
5707
- defaultValue: true
5708
- }, {
5709
- name: "fit",
5710
- type: "text",
5711
- defaultValue: "cover",
5712
- enum: ["contain", "cover", "fill", "auto"]
5713
- }, {
5714
- name: "preload",
5499
+ defaultValue: false,
5500
+ helperText: "Only print and run scripts on the client. Important when scripts influence DOM that could be replaced when client loads",
5501
+ advanced: true
5502
+ }]
5503
+ };
5504
+
5505
+ // src/blocks/custom-code/custom-code.tsx
5506
+ import { onMount as onMount2, createSignal as createSignal7 } from "solid-js";
5507
+ function CustomCode(props) {
5508
+ const [scriptsInserted, setScriptsInserted] = createSignal7([]);
5509
+ const [scriptsRun, setScriptsRun] = createSignal7([]);
5510
+ let elementRef;
5511
+ onMount2(() => {
5512
+ if (!elementRef?.getElementsByTagName || typeof window === "undefined") {
5513
+ return;
5514
+ }
5515
+ const scripts = elementRef.getElementsByTagName("script");
5516
+ for (let i = 0; i < scripts.length; i++) {
5517
+ const script = scripts[i];
5518
+ if (script.src) {
5519
+ if (scriptsInserted().includes(script.src)) {
5520
+ continue;
5521
+ }
5522
+ scriptsInserted().push(script.src);
5523
+ const newScript = document.createElement("script");
5524
+ newScript.async = true;
5525
+ newScript.src = script.src;
5526
+ document.head.appendChild(newScript);
5527
+ } else if (!script.type || [
5528
+ "text/javascript",
5529
+ "application/javascript",
5530
+ "application/ecmascript"
5531
+ ].includes(script.type)) {
5532
+ if (scriptsRun().includes(script.innerText)) {
5533
+ continue;
5534
+ }
5535
+ try {
5536
+ scriptsRun().push(script.innerText);
5537
+ new Function(script.innerText)();
5538
+ } catch (error) {
5539
+ }
5540
+ }
5541
+ }
5542
+ });
5543
+ return <div
5544
+ class={"builder-custom-code" + (props.replaceNodes ? " replace-nodes" : "")}
5545
+ ref={elementRef}
5546
+ innerHTML={props.code}
5547
+ />;
5548
+ }
5549
+ var custom_code_default = CustomCode;
5550
+
5551
+ // src/blocks/embed/component-info.ts
5552
+ var componentInfo10 = {
5553
+ name: "Embed",
5554
+ static: true,
5555
+ inputs: [{
5556
+ name: "url",
5557
+ type: "url",
5558
+ required: true,
5559
+ defaultValue: "",
5560
+ helperText: "e.g. enter a youtube url, google map, etc",
5561
+ onChange: (options) => {
5562
+ const url = options.get("url");
5563
+ if (url) {
5564
+ options.set("content", "Loading...");
5565
+ const apiKey = "ae0e60e78201a3f2b0de4b";
5566
+ return fetch(`https://iframe.ly/api/iframely?url=${url}&api_key=${apiKey}`).then((res) => res.json()).then((data) => {
5567
+ if (options.get("url") === url) {
5568
+ if (data.html) {
5569
+ options.set("content", data.html);
5570
+ } else {
5571
+ options.set("content", "Invalid url, please try another");
5572
+ }
5573
+ }
5574
+ }).catch((_err) => {
5575
+ options.set("content", "There was an error embedding this URL, please try again or another URL");
5576
+ });
5577
+ } else {
5578
+ options.delete("content");
5579
+ }
5580
+ }
5581
+ }, {
5582
+ name: "content",
5583
+ type: "html",
5584
+ defaultValue: '<div style="padding: 20px; text-align: center">(Choose an embed URL)<div>',
5585
+ hideFromUI: true
5586
+ }]
5587
+ };
5588
+
5589
+ // src/blocks/embed/embed.tsx
5590
+ import { on, createEffect, createSignal as createSignal8 } from "solid-js";
5591
+
5592
+ // src/blocks/embed/helpers.ts
5593
+ var SCRIPT_MIME_TYPES = ["text/javascript", "application/javascript", "application/ecmascript"];
5594
+ var isJsScript = (script) => SCRIPT_MIME_TYPES.includes(script.type);
5595
+
5596
+ // src/blocks/embed/embed.tsx
5597
+ function Embed(props) {
5598
+ const [scriptsInserted, setScriptsInserted] = createSignal8([]);
5599
+ const [scriptsRun, setScriptsRun] = createSignal8([]);
5600
+ const [ranInitFn, setRanInitFn] = createSignal8(false);
5601
+ function findAndRunScripts() {
5602
+ if (!elem || !elem.getElementsByTagName)
5603
+ return;
5604
+ const scripts = elem.getElementsByTagName("script");
5605
+ for (let i = 0; i < scripts.length; i++) {
5606
+ const script = scripts[i];
5607
+ if (script.src && !scriptsInserted().includes(script.src)) {
5608
+ scriptsInserted().push(script.src);
5609
+ const newScript = document.createElement("script");
5610
+ newScript.async = true;
5611
+ newScript.src = script.src;
5612
+ document.head.appendChild(newScript);
5613
+ } else if (isJsScript(script) && !scriptsRun().includes(script.innerText)) {
5614
+ try {
5615
+ scriptsRun().push(script.innerText);
5616
+ new Function(script.innerText)();
5617
+ } catch (error) {
5618
+ }
5619
+ }
5620
+ }
5621
+ }
5622
+ let elem;
5623
+ function onUpdateFn_0() {
5624
+ if (elem && !ranInitFn()) {
5625
+ setRanInitFn(true);
5626
+ findAndRunScripts();
5627
+ }
5628
+ }
5629
+ createEffect(on(() => [elem, ranInitFn()], onUpdateFn_0));
5630
+ return <div class="builder-embed" ref={elem} innerHTML={props.content} />;
5631
+ }
5632
+ var embed_default = Embed;
5633
+
5634
+ // src/blocks/form/form/component-info.ts
5635
+ var componentInfo11 = {
5636
+ name: "Form:Form",
5637
+ // editableTags: ['builder-form-error']
5638
+ defaults: {
5639
+ responsiveStyles: {
5640
+ large: {
5641
+ marginTop: "15px",
5642
+ paddingBottom: "15px"
5643
+ }
5644
+ }
5645
+ },
5646
+ image: "https://cdn.builder.io/api/v1/image/assets%2FIsxPKMo2gPRRKeakUztj1D6uqed2%2Fef36d2a846134910b64b88e6d18c5ca5",
5647
+ inputs: [{
5648
+ name: "sendSubmissionsTo",
5649
+ type: "string",
5650
+ // TODO: save to builder data and user can download as csv
5651
+ // TODO: easy for mode too or computed add/remove fields form mode
5652
+ // so you can edit details and high level mode at same time...
5653
+ // Later - more integrations like mailchimp
5654
+ // /api/v1/form-submit?to=mailchimp
5655
+ enum: [{
5656
+ label: "Send to email",
5657
+ value: "email",
5658
+ helperText: "Send form submissions to the email address of your choosing"
5659
+ }, {
5660
+ label: "Custom",
5661
+ value: "custom",
5662
+ helperText: "Handle where the form requests go manually with a little code, e.g. to your own custom backend"
5663
+ }],
5664
+ defaultValue: "email"
5665
+ }, {
5666
+ name: "sendSubmissionsToEmail",
5667
+ type: "string",
5668
+ required: true,
5669
+ // TODO: required: () => options.get("sendSubmissionsTo") === "email"
5670
+ defaultValue: "your@email.com",
5671
+ showIf: 'options.get("sendSubmissionsTo") === "email"'
5672
+ }, {
5673
+ name: "sendWithJs",
5674
+ type: "boolean",
5675
+ helperText: "Set to false to use basic html form action",
5676
+ defaultValue: true,
5677
+ showIf: 'options.get("sendSubmissionsTo") === "custom"'
5678
+ }, {
5679
+ name: "name",
5680
+ type: "string",
5681
+ defaultValue: "My form"
5682
+ // advanced: true
5683
+ }, {
5684
+ name: "action",
5685
+ type: "string",
5686
+ helperText: "URL to send the form data to",
5687
+ showIf: 'options.get("sendSubmissionsTo") === "custom"'
5688
+ }, {
5689
+ name: "contentType",
5690
+ type: "string",
5691
+ defaultValue: "application/json",
5692
+ advanced: true,
5693
+ // TODO: do automatically if file input
5694
+ enum: ["application/json", "multipart/form-data", "application/x-www-form-urlencoded"],
5695
+ showIf: 'options.get("sendSubmissionsTo") === "custom" && options.get("sendWithJs") === true'
5696
+ }, {
5697
+ name: "method",
5698
+ type: "string",
5699
+ showIf: 'options.get("sendSubmissionsTo") === "custom"',
5700
+ defaultValue: "POST",
5701
+ advanced: true
5702
+ }, {
5703
+ name: "previewState",
5704
+ type: "string",
5705
+ // TODO: persist: false flag
5706
+ enum: ["unsubmitted", "sending", "success", "error"],
5707
+ defaultValue: "unsubmitted",
5708
+ helperText: 'Choose a state to edit, e.g. choose "success" to show what users see on success and edit the message',
5709
+ showIf: 'options.get("sendSubmissionsTo") !== "zapier" && options.get("sendWithJs") === true'
5710
+ }, {
5711
+ name: "successUrl",
5712
+ type: "url",
5713
+ helperText: "Optional URL to redirect the user to on form submission success",
5714
+ showIf: 'options.get("sendSubmissionsTo") !== "zapier" && options.get("sendWithJs") === true'
5715
+ }, {
5716
+ name: "resetFormOnSubmit",
5717
+ type: "boolean",
5718
+ showIf: "options.get('sendSubmissionsTo') === 'custom' && options.get('sendWithJs') === true",
5719
+ advanced: true
5720
+ }, {
5721
+ name: "successMessage",
5722
+ type: "uiBlocks",
5723
+ hideFromUI: true,
5724
+ defaultValue: [{
5725
+ "@type": "@builder.io/sdk:Element",
5726
+ responsiveStyles: {
5727
+ large: {
5728
+ marginTop: "10px"
5729
+ }
5730
+ },
5731
+ component: {
5732
+ name: "Text",
5733
+ options: {
5734
+ text: "<span>Thanks!</span>"
5735
+ }
5736
+ }
5737
+ }]
5738
+ }, {
5739
+ name: "validate",
5740
+ type: "boolean",
5741
+ defaultValue: true,
5742
+ advanced: true
5743
+ }, {
5744
+ name: "errorMessagePath",
5745
+ type: "text",
5746
+ advanced: true,
5747
+ 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" }}'
5748
+ }, {
5749
+ name: "errorMessage",
5750
+ type: "uiBlocks",
5751
+ hideFromUI: true,
5752
+ defaultValue: [{
5753
+ "@type": "@builder.io/sdk:Element",
5754
+ responsiveStyles: {
5755
+ large: {
5756
+ marginTop: "10px"
5757
+ }
5758
+ },
5759
+ bindings: {
5760
+ "component.options.text": "state.formErrorMessage || block.component.options.text"
5761
+ },
5762
+ component: {
5763
+ name: "Text",
5764
+ options: {
5765
+ text: "<span>Form submission error :( Please check your answers and try again</span>"
5766
+ }
5767
+ }
5768
+ }]
5769
+ }, {
5770
+ name: "sendingMessage",
5771
+ type: "uiBlocks",
5772
+ hideFromUI: true,
5773
+ defaultValue: [{
5774
+ "@type": "@builder.io/sdk:Element",
5775
+ responsiveStyles: {
5776
+ large: {
5777
+ marginTop: "10px"
5778
+ }
5779
+ },
5780
+ component: {
5781
+ name: "Text",
5782
+ options: {
5783
+ text: "<span>Sending...</span>"
5784
+ }
5785
+ }
5786
+ }]
5787
+ }, {
5788
+ name: "customHeaders",
5789
+ type: "map",
5790
+ valueType: {
5791
+ type: "string"
5792
+ },
5793
+ advanced: true,
5794
+ showIf: 'options.get("sendSubmissionsTo") === "custom" && options.get("sendWithJs") === true'
5795
+ }],
5796
+ noWrap: true,
5797
+ canHaveChildren: true,
5798
+ defaultChildren: [{
5799
+ "@type": "@builder.io/sdk:Element",
5800
+ responsiveStyles: {
5801
+ large: {
5802
+ marginTop: "10px"
5803
+ }
5804
+ },
5805
+ component: {
5806
+ name: "Text",
5807
+ options: {
5808
+ text: "<span>Enter your name</span>"
5809
+ }
5810
+ }
5811
+ }, {
5812
+ "@type": "@builder.io/sdk:Element",
5813
+ responsiveStyles: {
5814
+ large: {
5815
+ marginTop: "10px"
5816
+ }
5817
+ },
5818
+ component: {
5819
+ name: "Form:Input",
5820
+ options: {
5821
+ name: "name",
5822
+ placeholder: "Jane Doe"
5823
+ }
5824
+ }
5825
+ }, {
5826
+ "@type": "@builder.io/sdk:Element",
5827
+ responsiveStyles: {
5828
+ large: {
5829
+ marginTop: "10px"
5830
+ }
5831
+ },
5832
+ component: {
5833
+ name: "Text",
5834
+ options: {
5835
+ text: "<span>Enter your email</span>"
5836
+ }
5837
+ }
5838
+ }, {
5839
+ "@type": "@builder.io/sdk:Element",
5840
+ responsiveStyles: {
5841
+ large: {
5842
+ marginTop: "10px"
5843
+ }
5844
+ },
5845
+ component: {
5846
+ name: "Form:Input",
5847
+ options: {
5848
+ name: "email",
5849
+ placeholder: "jane@doe.com"
5850
+ }
5851
+ }
5852
+ }, {
5853
+ "@type": "@builder.io/sdk:Element",
5854
+ responsiveStyles: {
5855
+ large: {
5856
+ marginTop: "10px"
5857
+ }
5858
+ },
5859
+ component: {
5860
+ name: "Form:SubmitButton",
5861
+ options: {
5862
+ text: "Submit"
5863
+ }
5864
+ }
5865
+ }]
5866
+ };
5867
+
5868
+ // src/blocks/form/form/form.tsx
5869
+ import { Show as Show8, For as For5, createSignal as createSignal9 } from "solid-js";
5870
+ import { css as css4 } from "solid-styled-components";
5871
+
5872
+ // src/functions/get-env.ts
5873
+ var validEnvList = ["production", "qa", "test", "development", "dev", "cdn-qa", "cloud", "fast", "cdn2", "cdn-prod"];
5874
+ var getEnv = () => {
5875
+ const env = "production";
5876
+ return validEnvList.includes(env) ? env : "production";
5877
+ };
5878
+
5879
+ // src/functions/get.ts
5880
+ var get = (obj, path, defaultValue) => {
5881
+ const result = String.prototype.split.call(path, /[,[\].]+?/).filter(Boolean).reduce((res, key) => res !== null && res !== void 0 ? res[key] : res, obj);
5882
+ return result === void 0 || result === obj ? defaultValue : result;
5883
+ };
5884
+
5885
+ // src/blocks/form/form/form.tsx
5886
+ function FormComponent(props) {
5887
+ const [formState, setFormState] = createSignal9("unsubmitted");
5888
+ const [responseData, setResponseData] = createSignal9(null);
5889
+ const [formErrorMessage, setFormErrorMessage] = createSignal9("");
5890
+ function mergeNewRootState(newData) {
5891
+ const combinedState = {
5892
+ ...props.builderContext.rootState,
5893
+ ...newData
5894
+ };
5895
+ if (props.builderContext.rootSetState) {
5896
+ props.builderContext.rootSetState?.(combinedState);
5897
+ } else {
5898
+ props.builderContext.rootState = combinedState;
5899
+ }
5900
+ }
5901
+ function submissionState() {
5902
+ return isEditing() && props.previewState || formState();
5903
+ }
5904
+ function onSubmit(event) {
5905
+ const sendWithJsProp = props.sendWithJs || props.sendSubmissionsTo === "email";
5906
+ if (props.sendSubmissionsTo === "zapier") {
5907
+ event.preventDefault();
5908
+ } else if (sendWithJsProp) {
5909
+ if (!(props.action || props.sendSubmissionsTo === "email")) {
5910
+ event.preventDefault();
5911
+ return;
5912
+ }
5913
+ event.preventDefault();
5914
+ const el = event.currentTarget;
5915
+ const headers = props.customHeaders || {};
5916
+ let body;
5917
+ const formData = new FormData(el);
5918
+ const formPairs = Array.from(
5919
+ event.currentTarget.querySelectorAll("input,select,textarea")
5920
+ ).filter((el2) => !!el2.name).map((el2) => {
5921
+ let value;
5922
+ const key = el2.name;
5923
+ if (el2 instanceof HTMLInputElement) {
5924
+ if (el2.type === "radio") {
5925
+ if (el2.checked) {
5926
+ value = el2.name;
5927
+ return {
5928
+ key,
5929
+ value
5930
+ };
5931
+ }
5932
+ } else if (el2.type === "checkbox") {
5933
+ value = el2.checked;
5934
+ } else if (el2.type === "number" || el2.type === "range") {
5935
+ const num = el2.valueAsNumber;
5936
+ if (!isNaN(num)) {
5937
+ value = num;
5938
+ }
5939
+ } else if (el2.type === "file") {
5940
+ value = el2.files;
5941
+ } else {
5942
+ value = el2.value;
5943
+ }
5944
+ } else {
5945
+ value = el2.value;
5946
+ }
5947
+ return {
5948
+ key,
5949
+ value
5950
+ };
5951
+ });
5952
+ let formContentType = props.contentType;
5953
+ if (props.sendSubmissionsTo === "email") {
5954
+ formContentType = "multipart/form-data";
5955
+ }
5956
+ Array.from(formPairs).forEach(({ value }) => {
5957
+ if (value instanceof File || Array.isArray(value) && value[0] instanceof File || value instanceof FileList) {
5958
+ formContentType = "multipart/form-data";
5959
+ }
5960
+ });
5961
+ if (formContentType !== "application/json") {
5962
+ body = formData;
5963
+ } else {
5964
+ const json = {};
5965
+ Array.from(formPairs).forEach(({ value, key }) => {
5966
+ set(json, key, value);
5967
+ });
5968
+ body = JSON.stringify(json);
5969
+ }
5970
+ if (formContentType && formContentType !== "multipart/form-data") {
5971
+ if (
5972
+ /* Zapier doesn't allow content-type header to be sent from browsers */
5973
+ !(sendWithJsProp && props.action?.includes("zapier.com"))
5974
+ ) {
5975
+ headers["content-type"] = formContentType;
5976
+ }
5977
+ }
5978
+ const presubmitEvent = new CustomEvent("presubmit", {
5979
+ detail: {
5980
+ body
5981
+ }
5982
+ });
5983
+ if (formRef) {
5984
+ formRef.dispatchEvent(presubmitEvent);
5985
+ if (presubmitEvent.defaultPrevented) {
5986
+ return;
5987
+ }
5988
+ }
5989
+ setFormState("sending");
5990
+ const formUrl = `${getEnv() === "dev" ? "http://localhost:5000" : "https://builder.io"}/api/v1/form-submit?apiKey=${props.builderContext.apiKey}&to=${btoa(
5991
+ props.sendSubmissionsToEmail || ""
5992
+ )}&name=${encodeURIComponent(props.name || "")}`;
5993
+ fetch(
5994
+ props.sendSubmissionsTo === "email" ? formUrl : props.action,
5995
+ {
5996
+ body,
5997
+ headers,
5998
+ method: props.method || "post"
5999
+ }
6000
+ ).then(
6001
+ async (res) => {
6002
+ let body2;
6003
+ const contentType = res.headers.get("content-type");
6004
+ if (contentType && contentType.indexOf("application/json") !== -1) {
6005
+ body2 = await res.json();
6006
+ } else {
6007
+ body2 = await res.text();
6008
+ }
6009
+ if (!res.ok && props.errorMessagePath) {
6010
+ let message = get(body2, props.errorMessagePath);
6011
+ if (message) {
6012
+ if (typeof message !== "string") {
6013
+ message = JSON.stringify(message);
6014
+ }
6015
+ setFormErrorMessage(message);
6016
+ mergeNewRootState({
6017
+ formErrorMessage: message
6018
+ });
6019
+ }
6020
+ }
6021
+ setResponseData(body2);
6022
+ setFormState(res.ok ? "success" : "error");
6023
+ if (res.ok) {
6024
+ const submitSuccessEvent = new CustomEvent("submit:success", {
6025
+ detail: {
6026
+ res,
6027
+ body: body2
6028
+ }
6029
+ });
6030
+ if (formRef) {
6031
+ formRef.dispatchEvent(submitSuccessEvent);
6032
+ if (submitSuccessEvent.defaultPrevented) {
6033
+ return;
6034
+ }
6035
+ if (props.resetFormOnSubmit !== false) {
6036
+ formRef.reset();
6037
+ }
6038
+ }
6039
+ if (props.successUrl) {
6040
+ if (formRef) {
6041
+ const event2 = new CustomEvent("route", {
6042
+ detail: {
6043
+ url: props.successUrl
6044
+ }
6045
+ });
6046
+ formRef.dispatchEvent(event2);
6047
+ if (!event2.defaultPrevented) {
6048
+ location.href = props.successUrl;
6049
+ }
6050
+ } else {
6051
+ location.href = props.successUrl;
6052
+ }
6053
+ }
6054
+ }
6055
+ },
6056
+ (err) => {
6057
+ const submitErrorEvent = new CustomEvent("submit:error", {
6058
+ detail: {
6059
+ error: err
6060
+ }
6061
+ });
6062
+ if (formRef) {
6063
+ formRef.dispatchEvent(submitErrorEvent);
6064
+ if (submitErrorEvent.defaultPrevented) {
6065
+ return;
6066
+ }
6067
+ }
6068
+ setResponseData(err);
6069
+ setFormState("error");
6070
+ }
6071
+ );
6072
+ }
6073
+ }
6074
+ let formRef;
6075
+ return <form
6076
+ validate={props.validate}
6077
+ ref={formRef}
6078
+ action={!props.sendWithJs && props.action}
6079
+ method={props.method}
6080
+ name={props.name}
6081
+ onSubmit={(event) => onSubmit(event)}
6082
+ {...{}}
6083
+ {...props.attributes}
6084
+ >
6085
+ <Show8 when={props.builderBlock && props.builderBlock.children}><For5 each={props.builderBlock?.children}>{(block, _index) => {
6086
+ const idx = _index();
6087
+ return <Block_default
6088
+ key={`form-block-${idx}`}
6089
+ block={block}
6090
+ context={props.builderContext}
6091
+ registeredComponents={props.builderComponents}
6092
+ linkComponent={props.builderLinkComponent}
6093
+ />;
6094
+ }}</For5></Show8>
6095
+ <Show8 when={submissionState() === "error"}><Blocks_default
6096
+ path="errorMessage"
6097
+ blocks={props.errorMessage}
6098
+ context={props.builderContext}
6099
+ /></Show8>
6100
+ <Show8 when={submissionState() === "sending"}><Blocks_default
6101
+ path="sendingMessage"
6102
+ blocks={props.sendingMessage}
6103
+ context={props.builderContext}
6104
+ /></Show8>
6105
+ <Show8 when={submissionState() === "error" && responseData()}><pre
6106
+ class={"builder-form-error-text " + css4({
6107
+ padding: "10px",
6108
+ color: "red",
6109
+ textAlign: "center"
6110
+ })}
6111
+ >{JSON.stringify(responseData(), null, 2)}</pre></Show8>
6112
+ <Show8 when={submissionState() === "success"}><Blocks_default
6113
+ path="successMessage"
6114
+ blocks={props.successMessage}
6115
+ context={props.builderContext}
6116
+ /></Show8>
6117
+ </form>;
6118
+ }
6119
+ var form_default = FormComponent;
6120
+
6121
+ // src/blocks/form/input/component-info.ts
6122
+ var componentInfo12 = {
6123
+ name: "Form:Input",
6124
+ image: "https://cdn.builder.io/api/v1/image/assets%2FIsxPKMo2gPRRKeakUztj1D6uqed2%2Fad6f37889d9e40bbbbc72cdb5875d6ca",
6125
+ inputs: [
6126
+ {
6127
+ name: "type",
6128
+ type: "text",
6129
+ enum: ["text", "number", "email", "url", "checkbox", "radio", "range", "date", "datetime-local", "search", "tel", "time", "file", "month", "week", "password", "color", "hidden"],
6130
+ defaultValue: "text"
6131
+ },
6132
+ {
6133
+ name: "name",
6134
+ type: "string",
6135
+ required: true,
6136
+ helperText: 'Every input in a form needs a unique name describing what it takes, e.g. "email"'
6137
+ },
6138
+ {
6139
+ name: "placeholder",
6140
+ type: "string",
6141
+ defaultValue: "Hello there",
6142
+ helperText: "Text to display when there is no value"
6143
+ },
6144
+ // TODO: handle value vs default value automatically like ng-model
6145
+ {
6146
+ name: "defaultValue",
6147
+ type: "string"
6148
+ },
6149
+ {
6150
+ name: "value",
6151
+ type: "string",
6152
+ advanced: true
6153
+ },
6154
+ {
6155
+ name: "required",
6156
+ type: "boolean",
6157
+ helperText: "Is this input required to be filled out to submit a form",
6158
+ defaultValue: false
6159
+ }
6160
+ ],
6161
+ noWrap: true,
6162
+ static: true,
6163
+ defaultStyles: {
6164
+ paddingTop: "10px",
6165
+ paddingBottom: "10px",
6166
+ paddingLeft: "10px",
6167
+ paddingRight: "10px",
6168
+ borderRadius: "3px",
6169
+ borderWidth: "1px",
6170
+ borderStyle: "solid",
6171
+ borderColor: "#ccc"
6172
+ }
6173
+ };
6174
+
6175
+ // src/blocks/form/input/input.tsx
6176
+ function FormInputComponent(props) {
6177
+ return <input
6178
+ {...{}}
6179
+ {...props.attributes}
6180
+ key={isEditing() && props.defaultValue ? props.defaultValue : "default-key"}
6181
+ placeholder={props.placeholder}
6182
+ type={props.type}
6183
+ name={props.name}
6184
+ value={props.value}
6185
+ defaultValue={props.defaultValue}
6186
+ required={props.required}
6187
+ />;
6188
+ }
6189
+ var input_default = FormInputComponent;
6190
+
6191
+ // src/blocks/form/select/component-info.ts
6192
+ var componentInfo13 = {
6193
+ name: "Form:Select",
6194
+ image: "https://cdn.builder.io/api/v1/image/assets%2FIsxPKMo2gPRRKeakUztj1D6uqed2%2F83acca093fb24aaf94dee136e9a4b045",
6195
+ defaultStyles: {
6196
+ alignSelf: "flex-start"
6197
+ },
6198
+ inputs: [{
6199
+ name: "options",
6200
+ type: "list",
6201
+ required: true,
6202
+ subFields: [{
6203
+ name: "value",
6204
+ type: "text",
6205
+ required: true
6206
+ }, {
6207
+ name: "name",
6208
+ type: "text"
6209
+ }],
6210
+ defaultValue: [{
6211
+ value: "option 1"
6212
+ }, {
6213
+ value: "option 2"
6214
+ }]
6215
+ }, {
6216
+ name: "name",
6217
+ type: "string",
6218
+ required: true,
6219
+ helperText: 'Every select in a form needs a unique name describing what it gets, e.g. "email"'
6220
+ }, {
6221
+ name: "defaultValue",
6222
+ type: "string"
6223
+ }, {
6224
+ name: "value",
6225
+ type: "string",
6226
+ advanced: true
6227
+ }, {
6228
+ name: "required",
6229
+ type: "boolean",
6230
+ defaultValue: false
6231
+ }],
6232
+ static: true,
6233
+ noWrap: true
6234
+ };
6235
+
6236
+ // src/blocks/form/select/select.tsx
6237
+ import { For as For6 } from "solid-js";
6238
+ function SelectComponent(props) {
6239
+ return <select
6240
+ {...{}}
6241
+ {...props.attributes}
6242
+ value={props.value}
6243
+ key={isEditing() && props.defaultValue ? props.defaultValue : "default-key"}
6244
+ defaultValue={props.defaultValue}
6245
+ name={props.name}
6246
+ ><For6 each={props.options}>{(option, _index) => {
6247
+ const index = _index();
6248
+ return <option value={option.value}>{option.name || option.value}</option>;
6249
+ }}</For6></select>;
6250
+ }
6251
+ var select_default = SelectComponent;
6252
+
6253
+ // src/blocks/form/submit-button/component-info.ts
6254
+ var componentInfo14 = {
6255
+ name: "Form:SubmitButton",
6256
+ image: "https://cdn.builder.io/api/v1/image/assets%2FIsxPKMo2gPRRKeakUztj1D6uqed2%2Fdf2820ffed1f4349a94c40b3221f5b98",
6257
+ defaultStyles: {
6258
+ appearance: "none",
6259
+ paddingTop: "15px",
6260
+ paddingBottom: "15px",
6261
+ paddingLeft: "25px",
6262
+ paddingRight: "25px",
6263
+ backgroundColor: "#3898EC",
6264
+ color: "white",
6265
+ borderRadius: "4px",
6266
+ cursor: "pointer"
6267
+ },
6268
+ inputs: [{
6269
+ name: "text",
6270
+ type: "text",
6271
+ defaultValue: "Click me"
6272
+ }],
6273
+ static: true,
6274
+ noWrap: true
6275
+ // TODO: optional children? maybe as optional form input
6276
+ // that only shows if advanced setting is flipped
6277
+ // TODO: defaultChildren
6278
+ // canHaveChildren: true,
6279
+ };
6280
+
6281
+ // src/blocks/form/submit-button/submit-button.tsx
6282
+ function SubmitButton(props) {
6283
+ return <button type="submit" {...{}} {...props.attributes}>{props.text}</button>;
6284
+ }
6285
+ var submit_button_default = SubmitButton;
6286
+
6287
+ // src/blocks/img/component-info.ts
6288
+ var componentInfo15 = {
6289
+ // friendlyName?
6290
+ name: "Raw:Img",
6291
+ hideFromInsertMenu: true,
6292
+ 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",
6293
+ inputs: [{
6294
+ name: "image",
6295
+ bubble: true,
6296
+ type: "file",
6297
+ allowedFileTypes: ["jpeg", "jpg", "png", "svg", "gif", "webp"],
6298
+ required: true
6299
+ }],
6300
+ noWrap: true,
6301
+ static: true
6302
+ };
6303
+
6304
+ // src/blocks/img/img.tsx
6305
+ function ImgComponent(props) {
6306
+ return <img
6307
+ style={{
6308
+ "object-fit": props.backgroundSize || "cover",
6309
+ "object-position": props.backgroundPosition || "center"
6310
+ }}
6311
+ key={isEditing() && props.imgSrc || "default-key"}
6312
+ alt={props.altText}
6313
+ src={props.imgSrc || props.image}
6314
+ {...{}}
6315
+ {...props.attributes}
6316
+ />;
6317
+ }
6318
+ var img_default = ImgComponent;
6319
+
6320
+ // src/blocks/video/component-info.ts
6321
+ var componentInfo16 = {
6322
+ name: "Video",
6323
+ canHaveChildren: true,
6324
+ defaultStyles: {
6325
+ minHeight: "20px",
6326
+ minWidth: "20px"
6327
+ },
6328
+ 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",
6329
+ inputs: [{
6330
+ name: "video",
6331
+ type: "file",
6332
+ allowedFileTypes: ["mp4"],
6333
+ bubble: true,
6334
+ defaultValue: "https://firebasestorage.googleapis.com/v0/b/builder-3b0a2.appspot.com/o/assets%2FKQlEmWDxA0coC3PK6UvkrjwkIGI2%2F28cb070609f546cdbe5efa20e931aa4b?alt=media&token=912e9551-7a7c-4dfb-86b6-3da1537d1a7f",
6335
+ required: true
6336
+ }, {
6337
+ name: "posterImage",
6338
+ type: "file",
6339
+ allowedFileTypes: ["jpeg", "png"],
6340
+ helperText: "Image to show before the video plays"
6341
+ }, {
6342
+ name: "autoPlay",
6343
+ type: "boolean",
6344
+ defaultValue: true
6345
+ }, {
6346
+ name: "controls",
6347
+ type: "boolean",
6348
+ defaultValue: false
6349
+ }, {
6350
+ name: "muted",
6351
+ type: "boolean",
6352
+ defaultValue: true
6353
+ }, {
6354
+ name: "loop",
6355
+ type: "boolean",
6356
+ defaultValue: true
6357
+ }, {
6358
+ name: "playsInline",
6359
+ type: "boolean",
6360
+ defaultValue: true
6361
+ }, {
6362
+ name: "fit",
6363
+ type: "text",
6364
+ defaultValue: "cover",
6365
+ enum: ["contain", "cover", "fill", "auto"]
6366
+ }, {
6367
+ name: "preload",
5715
6368
  type: "text",
5716
6369
  defaultValue: "metadata",
5717
6370
  enum: ["auto", "metadata", "none"]
@@ -5749,7 +6402,7 @@ var componentInfo12 = {
5749
6402
  };
5750
6403
 
5751
6404
  // src/blocks/video/video.tsx
5752
- import { Show as Show8 } from "solid-js";
6405
+ import { Show as Show9 } from "solid-js";
5753
6406
  function Video(props) {
5754
6407
  function videoProps() {
5755
6408
  return {
@@ -5800,8 +6453,8 @@ function Video(props) {
5800
6453
  }}
5801
6454
  src={props.video || "no-src"}
5802
6455
  poster={props.posterImage}
5803
- ><Show8 when={!props.lazyLoad}><source type="video/mp4" src={props.video} /></Show8></video>
5804
- <Show8
6456
+ ><Show9 when={!props.lazyLoad}><source type="video/mp4" src={props.video} /></Show9></video>
6457
+ <Show9
5805
6458
  when={props.aspectRatio && !(props.fitContent && props.builderBlock?.children?.length)}
5806
6459
  ><div
5807
6460
  style={{
@@ -5810,15 +6463,15 @@ function Video(props) {
5810
6463
  "pointer-events": "none",
5811
6464
  "font-size": "0px"
5812
6465
  }}
5813
- /></Show8>
5814
- <Show8 when={props.builderBlock?.children?.length && props.fitContent}><div
6466
+ /></Show9>
6467
+ <Show9 when={props.builderBlock?.children?.length && props.fitContent}><div
5815
6468
  style={{
5816
6469
  display: "flex",
5817
6470
  "flex-direction": "column",
5818
6471
  "align-items": "stretch"
5819
6472
  }}
5820
- >{props.children}</div></Show8>
5821
- <Show8 when={props.builderBlock?.children?.length && !props.fitContent}><div
6473
+ >{props.children}</div></Show9>
6474
+ <Show9 when={props.builderBlock?.children?.length && !props.fitContent}><div
5822
6475
  style={{
5823
6476
  "pointer-events": "none",
5824
6477
  display: "flex",
@@ -5830,11 +6483,38 @@ function Video(props) {
5830
6483
  width: "100%",
5831
6484
  height: "100%"
5832
6485
  }}
5833
- >{props.children}</div></Show8>
6486
+ >{props.children}</div></Show9>
5834
6487
  </div>;
5835
6488
  }
5836
6489
  var video_default = Video;
5837
6490
 
6491
+ // src/constants/extra-components.ts
6492
+ var getExtraComponents = () => [{
6493
+ component: custom_code_default,
6494
+ ...componentInfo9
6495
+ }, {
6496
+ component: embed_default,
6497
+ ...componentInfo10
6498
+ }, ...TARGET === "rsc" ? [] : [{
6499
+ component: form_default,
6500
+ ...componentInfo11
6501
+ }, {
6502
+ component: input_default,
6503
+ ...componentInfo12
6504
+ }, {
6505
+ component: submit_button_default,
6506
+ ...componentInfo14
6507
+ }, {
6508
+ component: select_default,
6509
+ ...componentInfo13
6510
+ }], {
6511
+ component: img_default,
6512
+ ...componentInfo15
6513
+ }, {
6514
+ component: video_default,
6515
+ ...componentInfo16
6516
+ }];
6517
+
5838
6518
  // src/constants/builder-registered-components.ts
5839
6519
  var getDefaultRegisteredComponents = () => [{
5840
6520
  component: button_default,
@@ -5843,36 +6523,24 @@ var getDefaultRegisteredComponents = () => [{
5843
6523
  component: columns_default,
5844
6524
  ...componentInfo2
5845
6525
  }, {
5846
- component: custom_code_default,
6526
+ component: fragment_default,
5847
6527
  ...componentInfo3
5848
6528
  }, {
5849
- component: embed_default,
6529
+ component: image_default,
5850
6530
  ...componentInfo4
5851
6531
  }, {
5852
- component: fragment_default,
6532
+ component: section_default,
5853
6533
  ...componentInfo5
5854
6534
  }, {
5855
- component: image_default,
6535
+ component: slot_default,
5856
6536
  ...componentInfo6
5857
- }, {
5858
- component: img_default,
5859
- ...componentInfo7
5860
- }, {
5861
- component: section_default,
5862
- ...componentInfo8
5863
6537
  }, {
5864
6538
  component: symbol_default,
5865
- ...componentInfo10
6539
+ ...componentInfo7
5866
6540
  }, {
5867
6541
  component: text_default,
5868
- ...componentInfo11
5869
- }, {
5870
- component: video_default,
5871
- ...componentInfo12
5872
- }, {
5873
- component: slot_default,
5874
- ...componentInfo9
5875
- }];
6542
+ ...componentInfo8
6543
+ }, ...getExtraComponents()];
5876
6544
 
5877
6545
  // src/functions/register-component.ts
5878
6546
  var components = [];
@@ -5950,7 +6618,7 @@ function InlinedScript(props) {
5950
6618
  var Inlined_script_default = InlinedScript;
5951
6619
 
5952
6620
  // src/components/content/components/enable-editor.tsx
5953
- import { Show as Show9, onMount as onMount3, on as on2, createEffect as createEffect2, createSignal as createSignal10 } from "solid-js";
6621
+ import { Show as Show10, onMount as onMount3, on as on2, createEffect as createEffect2, createSignal as createSignal11 } from "solid-js";
5954
6622
  import { Dynamic as Dynamic5 } from "solid-js/web";
5955
6623
 
5956
6624
  // src/helpers/preview-lru-cache/get.ts
@@ -6440,7 +7108,7 @@ function isFromTrustedHost(trustedHosts, e) {
6440
7108
  }
6441
7109
 
6442
7110
  // src/constants/sdk-version.ts
6443
- var SDK_VERSION = "0.13.1";
7111
+ var SDK_VERSION = "0.13.3";
6444
7112
 
6445
7113
  // src/functions/register.ts
6446
7114
  var registry = {};
@@ -6638,15 +7306,15 @@ var subscribeToEditor = (model, callback, options) => {
6638
7306
 
6639
7307
  // src/components/content/components/enable-editor.tsx
6640
7308
  function EnableEditor(props) {
6641
- const [forceReRenderCount, setForceReRenderCount] = createSignal10(0);
6642
- const [firstRender, setFirstRender] = createSignal10(true);
6643
- const [lastUpdated, setLastUpdated] = createSignal10(0);
6644
- const [shouldSendResetCookie, setShouldSendResetCookie] = createSignal10(false);
6645
- const [ContentWrapper, setContentWrapper] = createSignal10(
7309
+ const [forceReRenderCount, setForceReRenderCount] = createSignal11(0);
7310
+ const [firstRender, setFirstRender] = createSignal11(true);
7311
+ const [lastUpdated, setLastUpdated] = createSignal11(0);
7312
+ const [shouldSendResetCookie, setShouldSendResetCookie] = createSignal11(false);
7313
+ const [ContentWrapper, setContentWrapper] = createSignal11(
6646
7314
  props.contentWrapper || "div"
6647
7315
  );
6648
- const [httpReqsData, setHttpReqsData] = createSignal10({});
6649
- const [clicked, setClicked] = createSignal10(false);
7316
+ const [httpReqsData, setHttpReqsData] = createSignal11({});
7317
+ const [clicked, setClicked] = createSignal11(false);
6650
7318
  function mergeNewRootState(newData) {
6651
7319
  const combinedState = {
6652
7320
  ...props.builderContextSignal.rootState,
@@ -6909,7 +7577,7 @@ function EnableEditor(props) {
6909
7577
  }
6910
7578
  }
6911
7579
  createEffect2(on2(() => [props.locale], onUpdateFn_6));
6912
- return <builder_context_default.Provider value={props.builderContextSignal}><Show9 when={props.builderContextSignal.content}><Dynamic5
7580
+ return <builder_context_default.Provider value={props.builderContextSignal}><Show10 when={props.builderContextSignal.content}><Dynamic5
6913
7581
  class={`variant-${props.content?.testVariationId || props.content?.id}`}
6914
7582
  {...{}}
6915
7583
  key={forceReRenderCount()}
@@ -6924,12 +7592,12 @@ function EnableEditor(props) {
6924
7592
  }}
6925
7593
  {...props.contentWrapperProps}
6926
7594
  component={ContentWrapper()}
6927
- >{props.children}</Dynamic5></Show9></builder_context_default.Provider>;
7595
+ >{props.children}</Dynamic5></Show10></builder_context_default.Provider>;
6928
7596
  }
6929
7597
  var Enable_editor_default = EnableEditor;
6930
7598
 
6931
7599
  // src/components/content/components/styles.tsx
6932
- import { createSignal as createSignal11 } from "solid-js";
7600
+ import { createSignal as createSignal12 } from "solid-js";
6933
7601
 
6934
7602
  // src/components/content/components/styles.helpers.ts
6935
7603
  var getCssFromFont = (font) => {
@@ -6988,7 +7656,7 @@ var getCss = ({
6988
7656
 
6989
7657
  // src/components/content/components/styles.tsx
6990
7658
  function ContentStyles(props) {
6991
- const [injectedStyles, setInjectedStyles] = createSignal11(
7659
+ const [injectedStyles, setInjectedStyles] = createSignal12(
6992
7660
  `
6993
7661
  ${getCss({
6994
7662
  cssCode: props.cssCode,
@@ -7058,7 +7726,7 @@ var getContentInitialValue = ({
7058
7726
 
7059
7727
  // src/components/content/content.tsx
7060
7728
  function ContentComponent(props) {
7061
- const [scriptStr, setScriptStr] = createSignal12(
7729
+ const [scriptStr, setScriptStr] = createSignal13(
7062
7730
  getUpdateVariantVisibilityScript({
7063
7731
  // eslint-disable-next-line @typescript-eslint/no-non-null-assertion, @typescript-eslint/no-non-null-asserted-optional-chain
7064
7732
  variationId: props.content?.testVariationId,
@@ -7066,7 +7734,7 @@ function ContentComponent(props) {
7066
7734
  contentId: props.content?.id
7067
7735
  })
7068
7736
  );
7069
- const [registeredComponents, setRegisteredComponents] = createSignal12(
7737
+ const [registeredComponents, setRegisteredComponents] = createSignal13(
7070
7738
  [
7071
7739
  ...getDefaultRegisteredComponents(),
7072
7740
  // While this `components` object is deprecated, we must maintain support for it.
@@ -7087,7 +7755,7 @@ function ContentComponent(props) {
7087
7755
  {}
7088
7756
  )
7089
7757
  );
7090
- const [builderContextSignal, setBuilderContextSignal] = createSignal12({
7758
+ const [builderContextSignal, setBuilderContextSignal] = createSignal13({
7091
7759
  content: getContentInitialValue({
7092
7760
  content: props.content,
7093
7761
  data: props.data
@@ -7152,12 +7820,12 @@ function ContentComponent(props) {
7152
7820
  setBuilderContextSignal
7153
7821
  }}
7154
7822
  >
7155
- <Show10 when={props.isSsrAbTest}><Inlined_script_default scriptStr={scriptStr()} /></Show10>
7156
- <Show10 when={TARGET !== "reactNative"}><Styles_default
7823
+ <Show11 when={props.isSsrAbTest}><Inlined_script_default scriptStr={scriptStr()} /></Show11>
7824
+ <Show11 when={TARGET !== "reactNative"}><Styles_default
7157
7825
  contentId={builderContextSignal().content?.id}
7158
7826
  cssCode={builderContextSignal().content?.data?.cssCode}
7159
7827
  customFonts={builderContextSignal().content?.data?.customFonts}
7160
- /></Show10>
7828
+ /></Show11>
7161
7829
  <Blocks_default
7162
7830
  blocks={builderContextSignal().content?.data?.blocks}
7163
7831
  context={builderContextSignal()}
@@ -7170,7 +7838,7 @@ var Content_default = ContentComponent;
7170
7838
 
7171
7839
  // src/components/content-variants/content-variants.tsx
7172
7840
  function ContentVariants(props) {
7173
- const [shouldRenderVariants, setShouldRenderVariants] = createSignal13(
7841
+ const [shouldRenderVariants, setShouldRenderVariants] = createSignal14(
7174
7842
  checkShouldRenderVariants({
7175
7843
  canTrack: getDefaultCanTrack(props.canTrack),
7176
7844
  content: props.content
@@ -7201,8 +7869,8 @@ function ContentVariants(props) {
7201
7869
  setShouldRenderVariants(false);
7202
7870
  });
7203
7871
  return <>
7204
- <Show11 when={!props.__isNestedRender && TARGET !== "reactNative"}><Inlined_script_default scriptStr={getScriptString()} /></Show11>
7205
- <Show11 when={shouldRenderVariants()}>
7872
+ <Show12 when={!props.__isNestedRender && TARGET !== "reactNative"}><Inlined_script_default scriptStr={getScriptString()} /></Show12>
7873
+ <Show12 when={shouldRenderVariants()}>
7206
7874
  <Inlined_styles_default
7207
7875
  id={`variants-styles-${props.content?.id}`}
7208
7876
  styles={hideVariantsStyleString()}
@@ -7210,7 +7878,7 @@ function ContentVariants(props) {
7210
7878
  <Inlined_script_default
7211
7879
  scriptStr={updateCookieAndStylesScriptStr()}
7212
7880
  />
7213
- <For5 each={getVariants(props.content)}>{(variant, _index) => {
7881
+ <For7 each={getVariants(props.content)}>{(variant, _index) => {
7214
7882
  const index = _index();
7215
7883
  return <Content_default
7216
7884
  key={variant.testVariationId}
@@ -7234,8 +7902,8 @@ function ContentVariants(props) {
7234
7902
  contentWrapperProps={props.contentWrapperProps}
7235
7903
  trustedHosts={props.trustedHosts}
7236
7904
  />;
7237
- }}</For5>
7238
- </Show11>
7905
+ }}</For7>
7906
+ </Show12>
7239
7907
  <Content_default
7240
7908
  {...{}}
7241
7909
  content={defaultContent()}
@@ -7288,7 +7956,7 @@ var fetchSymbolContent = async ({
7288
7956
 
7289
7957
  // src/blocks/symbol/symbol.tsx
7290
7958
  function Symbol2(props) {
7291
- const [contentToUse, setContentToUse] = createSignal14(props.symbol?.content);
7959
+ const [contentToUse, setContentToUse] = createSignal15(props.symbol?.content);
7292
7960
  function className() {
7293
7961
  return [
7294
7962
  ...[props.attributes[getClassPropName()]],