@builder.io/sdk-solid 1.0.28 → 1.0.30

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/lib/edge/dev.js CHANGED
@@ -5282,8 +5282,320 @@ var handleABTesting = async ({
5282
5282
  // src/helpers/canTrack.ts
5283
5283
  var getDefaultCanTrack = (canTrack) => checkIsDefined(canTrack) ? canTrack : true;
5284
5284
 
5285
+ // src/blocks/accordion/component-info.ts
5286
+ var defaultTitle = {
5287
+ "@type": "@builder.io/sdk:Element",
5288
+ layerName: "Accordion item title",
5289
+ responsiveStyles: {
5290
+ large: {
5291
+ marginTop: "10px",
5292
+ position: "relative",
5293
+ display: "flex",
5294
+ alignItems: "stretch",
5295
+ flexDirection: "column",
5296
+ paddingBottom: "10px"
5297
+ }
5298
+ },
5299
+ children: [{
5300
+ "@type": "@builder.io/sdk:Element",
5301
+ responsiveStyles: {
5302
+ large: {
5303
+ textAlign: "left",
5304
+ display: "flex",
5305
+ flexDirection: "column"
5306
+ }
5307
+ },
5308
+ component: {
5309
+ name: "Text",
5310
+ options: {
5311
+ text: "I am an accordion title. Click me!"
5312
+ }
5313
+ }
5314
+ }]
5315
+ };
5316
+ var defaultDetail = {
5317
+ "@type": "@builder.io/sdk:Element",
5318
+ layerName: "Accordion item detail",
5319
+ responsiveStyles: {
5320
+ large: {
5321
+ position: "relative",
5322
+ display: "flex",
5323
+ alignItems: "stretch",
5324
+ flexDirection: "column",
5325
+ marginTop: "10px",
5326
+ paddingBottom: "10px"
5327
+ }
5328
+ },
5329
+ children: [{
5330
+ "@type": "@builder.io/sdk:Element",
5331
+ responsiveStyles: {
5332
+ large: {
5333
+ paddingTop: "50px",
5334
+ textAlign: "left",
5335
+ display: "flex",
5336
+ flexDirection: "column",
5337
+ paddingBottom: "50px"
5338
+ }
5339
+ },
5340
+ component: {
5341
+ name: "Text",
5342
+ options: {
5343
+ text: "I am an accordion detail, hello!"
5344
+ }
5345
+ }
5346
+ }]
5347
+ };
5348
+ var componentInfo = {
5349
+ name: "Builder:Accordion",
5350
+ canHaveChildren: true,
5351
+ image: "https://cdn.builder.io/api/v1/image/assets%2FagZ9n5CUKRfbL9t6CaJOyVSK4Es2%2Ffab6c1fd3fe542408cbdec078bca7f35",
5352
+ defaultStyles: {
5353
+ display: "flex",
5354
+ flexDirection: "column",
5355
+ alignItems: "stretch"
5356
+ },
5357
+ inputs: [{
5358
+ name: "items",
5359
+ type: "list",
5360
+ broadcast: true,
5361
+ subFields: [{
5362
+ name: "title",
5363
+ type: "uiBlocks",
5364
+ hideFromUI: true,
5365
+ defaultValue: [defaultTitle]
5366
+ }, {
5367
+ name: "detail",
5368
+ type: "uiBlocks",
5369
+ hideFromUI: true,
5370
+ defaultValue: [defaultDetail]
5371
+ }],
5372
+ defaultValue: [{
5373
+ title: [defaultTitle],
5374
+ detail: [defaultDetail]
5375
+ }, {
5376
+ title: [defaultTitle],
5377
+ detail: [defaultDetail]
5378
+ }],
5379
+ showIf: (options) => !options.get("useChildrenForItems")
5380
+ }, {
5381
+ name: "oneAtATime",
5382
+ helperText: "Only allow opening one at a time (collapse all others when new item openned)",
5383
+ type: "boolean",
5384
+ defaultValue: false
5385
+ }, {
5386
+ name: "grid",
5387
+ helperText: "Display as a grid",
5388
+ type: "boolean",
5389
+ defaultValue: false
5390
+ }, {
5391
+ name: "gridRowWidth",
5392
+ helperText: "Display as a grid",
5393
+ type: "string",
5394
+ showIf: (options) => options.get("grid"),
5395
+ defaultValue: "25%"
5396
+ }, {
5397
+ name: "useChildrenForItems",
5398
+ type: "boolean",
5399
+ helperText: "Use child elements for each slide, instead of the array. Useful for dynamically repeating items",
5400
+ advanced: true,
5401
+ defaultValue: false,
5402
+ onChange: (options) => {
5403
+ if (options.get("useChildrenForItems") === true) {
5404
+ options.set("items", []);
5405
+ }
5406
+ }
5407
+ }]
5408
+ };
5409
+
5410
+ // src/blocks/accordion/helpers.ts
5411
+ var convertOrderNumberToString = (order) => {
5412
+ return order.toString();
5413
+ };
5414
+
5415
+ // src/blocks/accordion/accordion.tsx
5416
+ var _tmpl$6 = /* @__PURE__ */ template(`<div class=builder-accordion>`);
5417
+ var _tmpl$23 = /* @__PURE__ */ template(`<div>`);
5418
+ function Accordion(props) {
5419
+ const [open, setOpen] = createSignal([]);
5420
+ const onlyOneAtATime = createMemo(() => {
5421
+ return Boolean(props.grid || props.oneAtATime);
5422
+ });
5423
+ const accordionStyles = createMemo(() => {
5424
+ const styles = {
5425
+ display: "flex",
5426
+ alignItems: "stretch",
5427
+ flexDirection: "column",
5428
+ ...props.grid && {
5429
+ flexDirection: "row",
5430
+ alignItems: "flex-start",
5431
+ flexWrap: "wrap"
5432
+ }
5433
+ };
5434
+ return Object.fromEntries(Object.entries(styles).map(([key, value]) => [camelToKebabCase(key), value]));
5435
+ });
5436
+ const accordionTitleStyles = createMemo(() => {
5437
+ const shared = {
5438
+ display: "flex",
5439
+ flexDirection: "column"
5440
+ };
5441
+ const styles = Object.fromEntries(Object.entries({
5442
+ ...shared,
5443
+ alignItems: "stretch",
5444
+ cursor: "pointer"
5445
+ }).map(([key, value]) => [camelToKebabCase(key), value]));
5446
+ return Object.fromEntries(Object.entries(styles).filter(([_, value]) => value !== void 0));
5447
+ });
5448
+ function getAccordionTitleClassName(index) {
5449
+ return `builder-accordion-title builder-accordion-title-${open().includes(index) ? "open" : "closed"}`;
5450
+ }
5451
+ function getAccordionDetailClassName(index) {
5452
+ return `builder-accordion-detail builder-accordion-detail-${open().includes(index) ? "open" : "closed"}`;
5453
+ }
5454
+ const openGridItemOrder = createMemo(() => {
5455
+ let itemOrder = null;
5456
+ const getOpenGridItemPosition = props.grid && open().length;
5457
+ if (getOpenGridItemPosition && document) {
5458
+ const openItemIndex = open()[0];
5459
+ const openItem = document.querySelector(`.builder-accordion-title[data-index="${openItemIndex}"]`);
5460
+ let subjectItem = openItem;
5461
+ itemOrder = openItemIndex;
5462
+ if (subjectItem) {
5463
+ let prevItemRect = subjectItem.getBoundingClientRect();
5464
+ while (subjectItem = subjectItem && subjectItem.nextElementSibling) {
5465
+ if (subjectItem) {
5466
+ if (subjectItem.classList.contains("builder-accordion-detail")) {
5467
+ continue;
5468
+ }
5469
+ const subjectItemRect = subjectItem.getBoundingClientRect();
5470
+ if (subjectItemRect.left > prevItemRect.left) {
5471
+ const index = parseInt(subjectItem.getAttribute("data-index") || "", 10);
5472
+ if (!isNaN(index)) {
5473
+ prevItemRect = subjectItemRect;
5474
+ itemOrder = index;
5475
+ }
5476
+ } else {
5477
+ break;
5478
+ }
5479
+ }
5480
+ }
5481
+ }
5482
+ }
5483
+ if (typeof itemOrder === "number") {
5484
+ itemOrder = itemOrder + 1;
5485
+ }
5486
+ return itemOrder;
5487
+ });
5488
+ const accordionDetailStyles = createMemo(() => {
5489
+ const styles = {
5490
+ ...{
5491
+ order: typeof openGridItemOrder() === "number" ? openGridItemOrder() : void 0
5492
+ },
5493
+ ...props.grid && {
5494
+ width: "100%"
5495
+ }
5496
+ };
5497
+ return Object.fromEntries(Object.entries(styles).filter(([_, value]) => value !== void 0));
5498
+ });
5499
+ function onClick(index) {
5500
+ if (open().includes(index)) {
5501
+ setOpen(onlyOneAtATime() ? [] : open().filter((item) => item !== index));
5502
+ } else {
5503
+ setOpen(onlyOneAtATime() ? [index] : open().concat(index));
5504
+ }
5505
+ }
5506
+ return (() => {
5507
+ const _el$ = _tmpl$6();
5508
+ insert(_el$, createComponent(For, {
5509
+ get each() {
5510
+ return props.items;
5511
+ },
5512
+ children: (item, _index) => {
5513
+ const index = _index();
5514
+ return [(() => {
5515
+ const _el$2 = _tmpl$23();
5516
+ _el$2.$$click = (event) => onClick(index);
5517
+ setAttribute(_el$2, "data-index", index);
5518
+ insert(_el$2, createComponent(blocks_default, {
5519
+ get blocks() {
5520
+ return item.title;
5521
+ },
5522
+ path: `items.${index}.title`,
5523
+ get parent() {
5524
+ return props.builderBlock.id;
5525
+ },
5526
+ get context() {
5527
+ return props.builderContext;
5528
+ },
5529
+ get registeredComponents() {
5530
+ return props.builderComponents;
5531
+ },
5532
+ get linkComponent() {
5533
+ return props.builderLinkComponent;
5534
+ }
5535
+ }));
5536
+ effect((_p$) => {
5537
+ const _v$ = getAccordionTitleClassName(index), _v$2 = {
5538
+ ...accordionTitleStyles(),
5539
+ width: props.grid ? props.gridRowWidth : void 0,
5540
+ ...{
5541
+ order: openGridItemOrder() !== null ? convertOrderNumberToString(index) : convertOrderNumberToString(index + 1)
5542
+ }
5543
+ };
5544
+ _v$ !== _p$._v$ && className(_el$2, _p$._v$ = _v$);
5545
+ _p$._v$2 = style(_el$2, _v$2, _p$._v$2);
5546
+ return _p$;
5547
+ }, {
5548
+ _v$: void 0,
5549
+ _v$2: void 0
5550
+ });
5551
+ return _el$2;
5552
+ })(), createComponent(Show, {
5553
+ get when() {
5554
+ return open().includes(index);
5555
+ },
5556
+ get children() {
5557
+ const _el$3 = _tmpl$23();
5558
+ insert(_el$3, createComponent(blocks_default, {
5559
+ get blocks() {
5560
+ return item.detail;
5561
+ },
5562
+ path: `items.${index}.detail`,
5563
+ get parent() {
5564
+ return props.builderBlock.id;
5565
+ },
5566
+ get context() {
5567
+ return props.builderContext;
5568
+ },
5569
+ get registeredComponents() {
5570
+ return props.builderComponents;
5571
+ },
5572
+ get linkComponent() {
5573
+ return props.builderLinkComponent;
5574
+ }
5575
+ }));
5576
+ effect((_p$) => {
5577
+ const _v$3 = getAccordionDetailClassName(index), _v$4 = accordionDetailStyles();
5578
+ _v$3 !== _p$._v$3 && className(_el$3, _p$._v$3 = _v$3);
5579
+ _p$._v$4 = style(_el$3, _v$4, _p$._v$4);
5580
+ return _p$;
5581
+ }, {
5582
+ _v$3: void 0,
5583
+ _v$4: void 0
5584
+ });
5585
+ return _el$3;
5586
+ }
5587
+ })];
5588
+ }
5589
+ }));
5590
+ effect((_$p) => style(_el$, accordionStyles(), _$p));
5591
+ return _el$;
5592
+ })();
5593
+ }
5594
+ var accordion_default = Accordion;
5595
+ delegateEvents(["click"]);
5596
+
5285
5597
  // src/blocks/button/component-info.ts
5286
- var componentInfo = {
5598
+ var componentInfo2 = {
5287
5599
  name: "Core:Button",
5288
5600
  image: "https://cdn.builder.io/api/v1/image/assets%2FIsxPKMo2gPRRKeakUztj1D6uqed2%2F81a15681c3e74df09677dfc57a615b13",
5289
5601
  defaultStyles: {
@@ -5319,7 +5631,7 @@ var componentInfo = {
5319
5631
  };
5320
5632
 
5321
5633
  // src/blocks/columns/component-info.ts
5322
- var componentInfo2 = {
5634
+ var componentInfo3 = {
5323
5635
  // TODO: ways to statically preprocess JSON for references, functions, etc
5324
5636
  name: "Columns",
5325
5637
  isRSC: true,
@@ -5539,7 +5851,7 @@ var componentInfo2 = {
5539
5851
  };
5540
5852
 
5541
5853
  // src/blocks/fragment/component-info.ts
5542
- var componentInfo3 = {
5854
+ var componentInfo4 = {
5543
5855
  name: "Fragment",
5544
5856
  static: true,
5545
5857
  hidden: true,
@@ -5548,7 +5860,7 @@ var componentInfo3 = {
5548
5860
  };
5549
5861
 
5550
5862
  // src/blocks/image/component-info.ts
5551
- var componentInfo4 = {
5863
+ var componentInfo5 = {
5552
5864
  name: "Image",
5553
5865
  static: true,
5554
5866
  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",
@@ -5671,7 +5983,7 @@ var componentInfo4 = {
5671
5983
  };
5672
5984
 
5673
5985
  // src/blocks/section/component-info.ts
5674
- var componentInfo5 = {
5986
+ var componentInfo6 = {
5675
5987
  name: "Core:Section",
5676
5988
  static: true,
5677
5989
  image: "https://cdn.builder.io/api/v1/image/assets%2FIsxPKMo2gPRRKeakUztj1D6uqed2%2F682efef23ace49afac61748dd305c70a",
@@ -5713,7 +6025,7 @@ var componentInfo5 = {
5713
6025
  };
5714
6026
 
5715
6027
  // src/blocks/slot/component-info.ts
5716
- var componentInfo6 = {
6028
+ var componentInfo7 = {
5717
6029
  name: "Slot",
5718
6030
  isRSC: true,
5719
6031
  description: "Allow child blocks to be inserted into this content when used as a Symbol",
@@ -5727,10 +6039,10 @@ var componentInfo6 = {
5727
6039
  defaultValue: "children"
5728
6040
  }]
5729
6041
  };
5730
- var _tmpl$6 = /* @__PURE__ */ template(`<div>`);
6042
+ var _tmpl$7 = /* @__PURE__ */ template(`<div>`);
5731
6043
  function Slot(props) {
5732
6044
  return (() => {
5733
- const _el$ = _tmpl$6();
6045
+ const _el$ = _tmpl$7();
5734
6046
  _el$.style.setProperty("pointer-events", "auto");
5735
6047
  spread(_el$, mergeProps(() => !props.builderContext.context?.symbolId && {
5736
6048
  "builder-slot": props.name
@@ -5755,7 +6067,7 @@ function Slot(props) {
5755
6067
  var slot_default = Slot;
5756
6068
 
5757
6069
  // src/blocks/symbol/component-info.ts
5758
- var componentInfo7 = {
6070
+ var componentInfo8 = {
5759
6071
  name: "Symbol",
5760
6072
  noWrap: true,
5761
6073
  static: true,
@@ -5831,7 +6143,7 @@ var defaultElement = {
5831
6143
  }
5832
6144
  }
5833
6145
  };
5834
- var componentInfo8 = {
6146
+ var componentInfo9 = {
5835
6147
  name: "Builder: Tabs",
5836
6148
  inputs: [{
5837
6149
  name: "tabs",
@@ -5929,8 +6241,8 @@ var componentInfo8 = {
5929
6241
  }]
5930
6242
  }]
5931
6243
  };
5932
- var _tmpl$7 = /* @__PURE__ */ template(`<div>`);
5933
- var _tmpl$23 = /* @__PURE__ */ template(`<div><div class=builder-tabs-wrap>`);
6244
+ var _tmpl$8 = /* @__PURE__ */ template(`<div>`);
6245
+ var _tmpl$24 = /* @__PURE__ */ template(`<div><div class=builder-tabs-wrap>`);
5934
6246
  var _tmpl$33 = /* @__PURE__ */ template(`<span>`);
5935
6247
  function Tabs(props) {
5936
6248
  const [activeTab, setActiveTab] = createSignal(props.defaultActiveTab ? props.defaultActiveTab - 1 : 0);
@@ -5945,7 +6257,7 @@ function Tabs(props) {
5945
6257
  }
5946
6258
  }
5947
6259
  return (() => {
5948
- const _el$ = _tmpl$23(), _el$2 = _el$.firstChild;
6260
+ const _el$ = _tmpl$24(), _el$2 = _el$.firstChild;
5949
6261
  _el$2.style.setProperty("display", "flex");
5950
6262
  _el$2.style.setProperty("flex-direction", "row");
5951
6263
  _el$2.style.setProperty("overflow", "auto");
@@ -5955,226 +6267,18 @@ function Tabs(props) {
5955
6267
  },
5956
6268
  children: (tab, _index) => {
5957
6269
  const index = _index();
5958
- return (() => {
5959
- const _el$4 = _tmpl$33();
5960
- _el$4.$$click = (event) => onClick(index);
5961
- setAttribute(_el$4, "key", index);
5962
- insert(_el$4, createComponent(blocks_default, {
5963
- get parent() {
5964
- return props.builderBlock.id;
5965
- },
5966
- path: `component.options.tabs.${index}.label`,
5967
- get blocks() {
5968
- return tab.label;
5969
- },
5970
- get context() {
5971
- return props.builderContext;
5972
- },
5973
- get registeredComponents() {
5974
- return props.builderComponents;
5975
- },
5976
- get linkComponent() {
5977
- return props.builderLinkComponent;
5978
- }
5979
- }));
5980
- effect((_p$) => {
5981
- const _v$ = `builder-tab-wrap ${activeTab() === index ? "builder-tab-active" : ""}`, _v$2 = {
5982
- ...activeTab() === index ? props.activeTabStyle : {}
5983
- };
5984
- _v$ !== _p$._v$ && className(_el$4, _p$._v$ = _v$);
5985
- _p$._v$2 = style(_el$4, _v$2, _p$._v$2);
5986
- return _p$;
5987
- }, {
5988
- _v$: void 0,
5989
- _v$2: void 0
5990
- });
5991
- return _el$4;
5992
- })();
5993
- }
5994
- }));
5995
- insert(_el$, createComponent(Show, {
5996
- get when() {
5997
- return activeTabContent(activeTab());
5998
- },
5999
- get children() {
6000
- const _el$3 = _tmpl$7();
6001
- insert(_el$3, createComponent(blocks_default, {
6002
- get parent() {
6003
- return props.builderBlock.id;
6004
- },
6005
- get path() {
6006
- return `component.options.tabs.${activeTab()}.content`;
6007
- },
6008
- get blocks() {
6009
- return activeTabContent(activeTab());
6010
- },
6011
- get context() {
6012
- return props.builderContext;
6013
- },
6014
- get registeredComponents() {
6015
- return props.builderComponents;
6016
- },
6017
- get linkComponent() {
6018
- return props.builderLinkComponent;
6019
- }
6020
- }));
6021
- return _el$3;
6022
- }
6023
- }), null);
6024
- effect(() => (props.tabHeaderLayout || "flex-start") != null ? _el$2.style.setProperty("justify-content", props.tabHeaderLayout || "flex-start") : _el$2.style.removeProperty("justify-content"));
6025
- return _el$;
6026
- })();
6027
- }
6028
- var tabs_default = Tabs;
6029
- delegateEvents(["click"]);
6030
-
6031
- // src/blocks/text/component-info.ts
6032
- var componentInfo9 = {
6033
- name: "Text",
6034
- static: true,
6035
- isRSC: true,
6036
- image: "https://firebasestorage.googleapis.com/v0/b/builder-3b0a2.appspot.com/o/images%2Fbaseline-text_fields-24px%20(1).svg?alt=media&token=12177b73-0ee3-42ca-98c6-0dd003de1929",
6037
- inputs: [{
6038
- name: "text",
6039
- type: "html",
6040
- required: true,
6041
- autoFocus: true,
6042
- bubble: true,
6043
- defaultValue: "Enter some text..."
6044
- }],
6045
- defaultStyles: {
6046
- lineHeight: "normal",
6047
- height: "auto",
6048
- textAlign: "center"
6049
- }
6050
- };
6051
- var _tmpl$8 = /* @__PURE__ */ template(`<div class=builder-text>`);
6052
- function Text(props) {
6053
- return (() => {
6054
- const _el$ = _tmpl$8();
6055
- _el$.style.setProperty("outline", "none");
6056
- effect(() => _el$.innerHTML = props.text?.toString() || "");
6057
- return _el$;
6058
- })();
6059
- }
6060
- var text_default = Text;
6061
-
6062
- // src/blocks/accordion/helpers.ts
6063
- var convertOrderNumberToString = (order) => {
6064
- return order.toString();
6065
- };
6066
-
6067
- // src/blocks/accordion/accordion.tsx
6068
- var _tmpl$9 = /* @__PURE__ */ template(`<div class=builder-accordion>`);
6069
- var _tmpl$24 = /* @__PURE__ */ template(`<div>`);
6070
- function Accordion(props) {
6071
- const [open, setOpen] = createSignal([]);
6072
- const onlyOneAtATime = createMemo(() => {
6073
- return Boolean(props.grid || props.oneAtATime);
6074
- });
6075
- const accordionStyles = createMemo(() => {
6076
- const styles = {
6077
- display: "flex",
6078
- alignItems: "stretch",
6079
- flexDirection: "column",
6080
- ...props.grid && {
6081
- flexDirection: "row",
6082
- alignItems: "flex-start",
6083
- flexWrap: "wrap"
6084
- }
6085
- };
6086
- return Object.fromEntries(Object.entries(styles).map(([key, value]) => [camelToKebabCase(key), value]));
6087
- });
6088
- const accordionTitleStyles = createMemo(() => {
6089
- const shared = {
6090
- display: "flex",
6091
- flexDirection: "column"
6092
- };
6093
- const styles = Object.fromEntries(Object.entries({
6094
- ...shared,
6095
- alignItems: "stretch",
6096
- cursor: "pointer"
6097
- }).map(([key, value]) => [camelToKebabCase(key), value]));
6098
- return Object.fromEntries(Object.entries(styles).filter(([_, value]) => value !== void 0));
6099
- });
6100
- function getAccordionTitleClassName(index) {
6101
- return `builder-accordion-title builder-accordion-title-${open().includes(index) ? "open" : "closed"}`;
6102
- }
6103
- function getAccordionDetailClassName(index) {
6104
- return `builder-accordion-detail builder-accordion-detail-${open().includes(index) ? "open" : "closed"}`;
6105
- }
6106
- const openGridItemOrder = createMemo(() => {
6107
- let itemOrder = null;
6108
- const getOpenGridItemPosition = props.grid && open().length;
6109
- if (getOpenGridItemPosition && document) {
6110
- const openItemIndex = open()[0];
6111
- const openItem = document.querySelector(`.builder-accordion-title[data-index="${openItemIndex}"]`);
6112
- let subjectItem = openItem;
6113
- itemOrder = openItemIndex;
6114
- if (subjectItem) {
6115
- let prevItemRect = subjectItem.getBoundingClientRect();
6116
- while (subjectItem = subjectItem && subjectItem.nextElementSibling) {
6117
- if (subjectItem) {
6118
- if (subjectItem.classList.contains("builder-accordion-detail")) {
6119
- continue;
6120
- }
6121
- const subjectItemRect = subjectItem.getBoundingClientRect();
6122
- if (subjectItemRect.left > prevItemRect.left) {
6123
- const index = parseInt(subjectItem.getAttribute("data-index") || "", 10);
6124
- if (!isNaN(index)) {
6125
- prevItemRect = subjectItemRect;
6126
- itemOrder = index;
6127
- }
6128
- } else {
6129
- break;
6130
- }
6131
- }
6132
- }
6133
- }
6134
- }
6135
- if (typeof itemOrder === "number") {
6136
- itemOrder = itemOrder + 1;
6137
- }
6138
- return itemOrder;
6139
- });
6140
- const accordionDetailStyles = createMemo(() => {
6141
- const styles = {
6142
- ...{
6143
- order: typeof openGridItemOrder() === "number" ? openGridItemOrder() : void 0
6144
- },
6145
- ...props.grid && {
6146
- width: "100%"
6147
- }
6148
- };
6149
- return Object.fromEntries(Object.entries(styles).filter(([_, value]) => value !== void 0));
6150
- });
6151
- function onClick(index) {
6152
- if (open().includes(index)) {
6153
- setOpen(onlyOneAtATime() ? [] : open().filter((item) => item !== index));
6154
- } else {
6155
- setOpen(onlyOneAtATime() ? [index] : open().concat(index));
6156
- }
6157
- }
6158
- return (() => {
6159
- const _el$ = _tmpl$9();
6160
- insert(_el$, createComponent(For, {
6161
- get each() {
6162
- return props.items;
6163
- },
6164
- children: (item, _index) => {
6165
- const index = _index();
6166
- return [(() => {
6167
- const _el$2 = _tmpl$24();
6168
- _el$2.$$click = (event) => onClick(index);
6169
- setAttribute(_el$2, "data-index", index);
6170
- insert(_el$2, createComponent(blocks_default, {
6171
- get blocks() {
6172
- return item.title;
6173
- },
6174
- path: `items.${index}.title`,
6270
+ return (() => {
6271
+ const _el$4 = _tmpl$33();
6272
+ _el$4.$$click = (event) => onClick(index);
6273
+ setAttribute(_el$4, "key", index);
6274
+ insert(_el$4, createComponent(blocks_default, {
6175
6275
  get parent() {
6176
6276
  return props.builderBlock.id;
6177
6277
  },
6278
+ path: `component.options.tabs.${index}.label`,
6279
+ get blocks() {
6280
+ return tab.label;
6281
+ },
6178
6282
  get context() {
6179
6283
  return props.builderContext;
6180
6284
  },
@@ -6186,190 +6290,86 @@ function Accordion(props) {
6186
6290
  }
6187
6291
  }));
6188
6292
  effect((_p$) => {
6189
- const _v$ = getAccordionTitleClassName(index), _v$2 = {
6190
- ...accordionTitleStyles(),
6191
- width: props.grid ? props.gridRowWidth : void 0,
6192
- ...{
6193
- order: openGridItemOrder() !== null ? convertOrderNumberToString(index) : convertOrderNumberToString(index + 1)
6194
- }
6293
+ const _v$ = `builder-tab-wrap ${activeTab() === index ? "builder-tab-active" : ""}`, _v$2 = {
6294
+ ...activeTab() === index ? props.activeTabStyle : {}
6195
6295
  };
6196
- _v$ !== _p$._v$ && className(_el$2, _p$._v$ = _v$);
6197
- _p$._v$2 = style(_el$2, _v$2, _p$._v$2);
6296
+ _v$ !== _p$._v$ && className(_el$4, _p$._v$ = _v$);
6297
+ _p$._v$2 = style(_el$4, _v$2, _p$._v$2);
6198
6298
  return _p$;
6199
6299
  }, {
6200
6300
  _v$: void 0,
6201
6301
  _v$2: void 0
6202
6302
  });
6203
- return _el$2;
6204
- })(), createComponent(Show, {
6205
- get when() {
6206
- return open().includes(index);
6303
+ return _el$4;
6304
+ })();
6305
+ }
6306
+ }));
6307
+ insert(_el$, createComponent(Show, {
6308
+ get when() {
6309
+ return activeTabContent(activeTab());
6310
+ },
6311
+ get children() {
6312
+ const _el$3 = _tmpl$8();
6313
+ insert(_el$3, createComponent(blocks_default, {
6314
+ get parent() {
6315
+ return props.builderBlock.id;
6207
6316
  },
6208
- get children() {
6209
- const _el$3 = _tmpl$24();
6210
- insert(_el$3, createComponent(blocks_default, {
6211
- get blocks() {
6212
- return item.detail;
6213
- },
6214
- path: `items.${index}.detail`,
6215
- get parent() {
6216
- return props.builderBlock.id;
6217
- },
6218
- get context() {
6219
- return props.builderContext;
6220
- },
6221
- get registeredComponents() {
6222
- return props.builderComponents;
6223
- },
6224
- get linkComponent() {
6225
- return props.builderLinkComponent;
6226
- }
6227
- }));
6228
- effect((_p$) => {
6229
- const _v$3 = getAccordionDetailClassName(index), _v$4 = accordionDetailStyles();
6230
- _v$3 !== _p$._v$3 && className(_el$3, _p$._v$3 = _v$3);
6231
- _p$._v$4 = style(_el$3, _v$4, _p$._v$4);
6232
- return _p$;
6233
- }, {
6234
- _v$3: void 0,
6235
- _v$4: void 0
6236
- });
6237
- return _el$3;
6317
+ get path() {
6318
+ return `component.options.tabs.${activeTab()}.content`;
6319
+ },
6320
+ get blocks() {
6321
+ return activeTabContent(activeTab());
6322
+ },
6323
+ get context() {
6324
+ return props.builderContext;
6325
+ },
6326
+ get registeredComponents() {
6327
+ return props.builderComponents;
6328
+ },
6329
+ get linkComponent() {
6330
+ return props.builderLinkComponent;
6238
6331
  }
6239
- })];
6332
+ }));
6333
+ return _el$3;
6240
6334
  }
6241
- }));
6242
- effect((_$p) => style(_el$, accordionStyles(), _$p));
6335
+ }), null);
6336
+ effect(() => (props.tabHeaderLayout || "flex-start") != null ? _el$2.style.setProperty("justify-content", props.tabHeaderLayout || "flex-start") : _el$2.style.removeProperty("justify-content"));
6243
6337
  return _el$;
6244
6338
  })();
6245
6339
  }
6246
- var accordion_default = Accordion;
6340
+ var tabs_default = Tabs;
6247
6341
  delegateEvents(["click"]);
6248
6342
 
6249
- // src/blocks/accordion/component-info.ts
6250
- var defaultTitle = {
6251
- "@type": "@builder.io/sdk:Element",
6252
- layerName: "Accordion item title",
6253
- responsiveStyles: {
6254
- large: {
6255
- marginTop: "10px",
6256
- position: "relative",
6257
- display: "flex",
6258
- alignItems: "stretch",
6259
- flexDirection: "column",
6260
- paddingBottom: "10px"
6261
- }
6262
- },
6263
- children: [{
6264
- "@type": "@builder.io/sdk:Element",
6265
- responsiveStyles: {
6266
- large: {
6267
- textAlign: "left",
6268
- display: "flex",
6269
- flexDirection: "column"
6270
- }
6271
- },
6272
- component: {
6273
- name: "Text",
6274
- options: {
6275
- text: "I am an accordion title. Click me!"
6276
- }
6277
- }
6278
- }]
6279
- };
6280
- var defaultDetail = {
6281
- "@type": "@builder.io/sdk:Element",
6282
- layerName: "Accordion item detail",
6283
- responsiveStyles: {
6284
- large: {
6285
- position: "relative",
6286
- display: "flex",
6287
- alignItems: "stretch",
6288
- flexDirection: "column",
6289
- marginTop: "10px",
6290
- paddingBottom: "10px"
6291
- }
6292
- },
6293
- children: [{
6294
- "@type": "@builder.io/sdk:Element",
6295
- responsiveStyles: {
6296
- large: {
6297
- paddingTop: "50px",
6298
- textAlign: "left",
6299
- display: "flex",
6300
- flexDirection: "column",
6301
- paddingBottom: "50px"
6302
- }
6303
- },
6304
- component: {
6305
- name: "Text",
6306
- options: {
6307
- text: "I am an accordion detail, hello!"
6308
- }
6309
- }
6310
- }]
6311
- };
6343
+ // src/blocks/text/component-info.ts
6312
6344
  var componentInfo10 = {
6313
- name: "Builder:Accordion",
6314
- canHaveChildren: true,
6315
- image: "https://cdn.builder.io/api/v1/image/assets%2FagZ9n5CUKRfbL9t6CaJOyVSK4Es2%2Ffab6c1fd3fe542408cbdec078bca7f35",
6316
- defaultStyles: {
6317
- display: "flex",
6318
- flexDirection: "column",
6319
- alignItems: "stretch"
6320
- },
6345
+ name: "Text",
6346
+ static: true,
6347
+ isRSC: true,
6348
+ image: "https://firebasestorage.googleapis.com/v0/b/builder-3b0a2.appspot.com/o/images%2Fbaseline-text_fields-24px%20(1).svg?alt=media&token=12177b73-0ee3-42ca-98c6-0dd003de1929",
6321
6349
  inputs: [{
6322
- name: "items",
6323
- type: "list",
6324
- broadcast: true,
6325
- subFields: [{
6326
- name: "title",
6327
- type: "uiBlocks",
6328
- hideFromUI: true,
6329
- defaultValue: [defaultTitle]
6330
- }, {
6331
- name: "detail",
6332
- type: "uiBlocks",
6333
- hideFromUI: true,
6334
- defaultValue: [defaultDetail]
6335
- }],
6336
- defaultValue: [{
6337
- title: [defaultTitle],
6338
- detail: [defaultDetail]
6339
- }, {
6340
- title: [defaultTitle],
6341
- detail: [defaultDetail]
6342
- }],
6343
- showIf: (options) => !options.get("useChildrenForItems")
6344
- }, {
6345
- name: "oneAtATime",
6346
- helperText: "Only allow opening one at a time (collapse all others when new item openned)",
6347
- type: "boolean",
6348
- defaultValue: false
6349
- }, {
6350
- name: "grid",
6351
- helperText: "Display as a grid",
6352
- type: "boolean",
6353
- defaultValue: false
6354
- }, {
6355
- name: "gridRowWidth",
6356
- helperText: "Display as a grid",
6357
- type: "string",
6358
- showIf: (options) => options.get("grid"),
6359
- defaultValue: "25%"
6360
- }, {
6361
- name: "useChildrenForItems",
6362
- type: "boolean",
6363
- helperText: "Use child elements for each slide, instead of the array. Useful for dynamically repeating items",
6364
- advanced: true,
6365
- defaultValue: false,
6366
- onChange: (options) => {
6367
- if (options.get("useChildrenForItems") === true) {
6368
- options.set("items", []);
6369
- }
6370
- }
6371
- }]
6350
+ name: "text",
6351
+ type: "html",
6352
+ required: true,
6353
+ autoFocus: true,
6354
+ bubble: true,
6355
+ defaultValue: "Enter some text..."
6356
+ }],
6357
+ defaultStyles: {
6358
+ lineHeight: "normal",
6359
+ height: "auto",
6360
+ textAlign: "center"
6361
+ }
6372
6362
  };
6363
+ var _tmpl$9 = /* @__PURE__ */ template(`<div class=builder-text>`);
6364
+ function Text(props) {
6365
+ return (() => {
6366
+ const _el$ = _tmpl$9();
6367
+ _el$.style.setProperty("outline", "none");
6368
+ effect(() => _el$.innerHTML = props.text?.toString() || "");
6369
+ return _el$;
6370
+ })();
6371
+ }
6372
+ var text_default = Text;
6373
6373
 
6374
6374
  // src/blocks/custom-code/component-info.ts
6375
6375
  var componentInfo11 = {
@@ -6815,11 +6815,11 @@ function FormComponent(props) {
6815
6815
  return;
6816
6816
  }
6817
6817
  event.preventDefault();
6818
- const el = event.currentTarget;
6818
+ const el = event.currentTarget || event.target;
6819
6819
  const headers = props.customHeaders || {};
6820
6820
  let body;
6821
6821
  const formData = new FormData(el);
6822
- const formPairs = Array.from(event.currentTarget.querySelectorAll("input,select,textarea")).filter((el2) => !!el2.name).map((el2) => {
6822
+ const formPairs = Array.from(el.querySelectorAll("input,select,textarea")).filter((el2) => !!el2.name).map((el2) => {
6823
6823
  let value;
6824
6824
  const key = el2.name;
6825
6825
  if (el2 instanceof HTMLInputElement) {
@@ -6989,7 +6989,7 @@ function FormComponent(props) {
6989
6989
  get name() {
6990
6990
  return props.name;
6991
6991
  }
6992
- }, {}, () => props.attributes), false, true);
6992
+ }, {}, {}, () => props.attributes), false, true);
6993
6993
  insert(_el$, createComponent(Show, {
6994
6994
  get when() {
6995
6995
  return props.builderBlock && props.builderBlock.children;
@@ -7565,34 +7565,34 @@ var getExtraComponents = () => [{
7565
7565
  // src/constants/builder-registered-components.ts
7566
7566
  var getDefaultRegisteredComponents = () => [{
7567
7567
  component: button_default,
7568
- ...componentInfo
7568
+ ...componentInfo2
7569
7569
  }, {
7570
7570
  component: columns_default,
7571
- ...componentInfo2
7571
+ ...componentInfo3
7572
7572
  }, {
7573
7573
  component: fragment_default,
7574
- ...componentInfo3
7574
+ ...componentInfo4
7575
7575
  }, {
7576
7576
  component: image_default,
7577
- ...componentInfo4
7577
+ ...componentInfo5
7578
7578
  }, {
7579
7579
  component: section_default,
7580
- ...componentInfo5
7580
+ ...componentInfo6
7581
7581
  }, {
7582
7582
  component: slot_default,
7583
- ...componentInfo6
7583
+ ...componentInfo7
7584
7584
  }, {
7585
7585
  component: symbol_default,
7586
- ...componentInfo7
7586
+ ...componentInfo8
7587
7587
  }, {
7588
7588
  component: text_default,
7589
- ...componentInfo9
7589
+ ...componentInfo10
7590
7590
  }, ...TARGET === "rsc" ? [] : [{
7591
7591
  component: tabs_default,
7592
- ...componentInfo8
7592
+ ...componentInfo9
7593
7593
  }, {
7594
7594
  component: accordion_default,
7595
- ...componentInfo10
7595
+ ...componentInfo
7596
7596
  }], ...getExtraComponents()];
7597
7597
 
7598
7598
  // src/functions/register-component.ts
@@ -8176,7 +8176,7 @@ function isFromTrustedHost(trustedHosts, e) {
8176
8176
  }
8177
8177
 
8178
8178
  // src/constants/sdk-version.ts
8179
- var SDK_VERSION = "1.0.28";
8179
+ var SDK_VERSION = "1.0.30";
8180
8180
 
8181
8181
  // src/functions/register.ts
8182
8182
  var registry = {};
@@ -8642,7 +8642,7 @@ function EnableEditor(props) {
8642
8642
  if (isPreviewing() && !isEditing()) {
8643
8643
  const searchParams = new URL(location.href).searchParams;
8644
8644
  const searchParamPreviewModel = searchParams.get("builder.preview");
8645
- const searchParamPreviewId = searchParams.get(`builder.preview.${searchParamPreviewModel}`);
8645
+ const searchParamPreviewId = searchParams.get(`builder.overrides.${searchParamPreviewModel}`);
8646
8646
  const previewApiKey = searchParams.get("apiKey") || searchParams.get("builder.space");
8647
8647
  if (searchParamPreviewModel === props.model && previewApiKey === props.apiKey && (!props.content || searchParamPreviewId === props.content.id)) {
8648
8648
  fetchOneEntry({