@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/index.js CHANGED
@@ -5275,8 +5275,320 @@ var handleABTesting = async ({
5275
5275
  // src/helpers/canTrack.ts
5276
5276
  var getDefaultCanTrack = (canTrack) => checkIsDefined(canTrack) ? canTrack : true;
5277
5277
 
5278
+ // src/blocks/accordion/component-info.ts
5279
+ var defaultTitle = {
5280
+ "@type": "@builder.io/sdk:Element",
5281
+ layerName: "Accordion item title",
5282
+ responsiveStyles: {
5283
+ large: {
5284
+ marginTop: "10px",
5285
+ position: "relative",
5286
+ display: "flex",
5287
+ alignItems: "stretch",
5288
+ flexDirection: "column",
5289
+ paddingBottom: "10px"
5290
+ }
5291
+ },
5292
+ children: [{
5293
+ "@type": "@builder.io/sdk:Element",
5294
+ responsiveStyles: {
5295
+ large: {
5296
+ textAlign: "left",
5297
+ display: "flex",
5298
+ flexDirection: "column"
5299
+ }
5300
+ },
5301
+ component: {
5302
+ name: "Text",
5303
+ options: {
5304
+ text: "I am an accordion title. Click me!"
5305
+ }
5306
+ }
5307
+ }]
5308
+ };
5309
+ var defaultDetail = {
5310
+ "@type": "@builder.io/sdk:Element",
5311
+ layerName: "Accordion item detail",
5312
+ responsiveStyles: {
5313
+ large: {
5314
+ position: "relative",
5315
+ display: "flex",
5316
+ alignItems: "stretch",
5317
+ flexDirection: "column",
5318
+ marginTop: "10px",
5319
+ paddingBottom: "10px"
5320
+ }
5321
+ },
5322
+ children: [{
5323
+ "@type": "@builder.io/sdk:Element",
5324
+ responsiveStyles: {
5325
+ large: {
5326
+ paddingTop: "50px",
5327
+ textAlign: "left",
5328
+ display: "flex",
5329
+ flexDirection: "column",
5330
+ paddingBottom: "50px"
5331
+ }
5332
+ },
5333
+ component: {
5334
+ name: "Text",
5335
+ options: {
5336
+ text: "I am an accordion detail, hello!"
5337
+ }
5338
+ }
5339
+ }]
5340
+ };
5341
+ var componentInfo = {
5342
+ name: "Builder:Accordion",
5343
+ canHaveChildren: true,
5344
+ image: "https://cdn.builder.io/api/v1/image/assets%2FagZ9n5CUKRfbL9t6CaJOyVSK4Es2%2Ffab6c1fd3fe542408cbdec078bca7f35",
5345
+ defaultStyles: {
5346
+ display: "flex",
5347
+ flexDirection: "column",
5348
+ alignItems: "stretch"
5349
+ },
5350
+ inputs: [{
5351
+ name: "items",
5352
+ type: "list",
5353
+ broadcast: true,
5354
+ subFields: [{
5355
+ name: "title",
5356
+ type: "uiBlocks",
5357
+ hideFromUI: true,
5358
+ defaultValue: [defaultTitle]
5359
+ }, {
5360
+ name: "detail",
5361
+ type: "uiBlocks",
5362
+ hideFromUI: true,
5363
+ defaultValue: [defaultDetail]
5364
+ }],
5365
+ defaultValue: [{
5366
+ title: [defaultTitle],
5367
+ detail: [defaultDetail]
5368
+ }, {
5369
+ title: [defaultTitle],
5370
+ detail: [defaultDetail]
5371
+ }],
5372
+ showIf: (options) => !options.get("useChildrenForItems")
5373
+ }, {
5374
+ name: "oneAtATime",
5375
+ helperText: "Only allow opening one at a time (collapse all others when new item openned)",
5376
+ type: "boolean",
5377
+ defaultValue: false
5378
+ }, {
5379
+ name: "grid",
5380
+ helperText: "Display as a grid",
5381
+ type: "boolean",
5382
+ defaultValue: false
5383
+ }, {
5384
+ name: "gridRowWidth",
5385
+ helperText: "Display as a grid",
5386
+ type: "string",
5387
+ showIf: (options) => options.get("grid"),
5388
+ defaultValue: "25%"
5389
+ }, {
5390
+ name: "useChildrenForItems",
5391
+ type: "boolean",
5392
+ helperText: "Use child elements for each slide, instead of the array. Useful for dynamically repeating items",
5393
+ advanced: true,
5394
+ defaultValue: false,
5395
+ onChange: (options) => {
5396
+ if (options.get("useChildrenForItems") === true) {
5397
+ options.set("items", []);
5398
+ }
5399
+ }
5400
+ }]
5401
+ };
5402
+
5403
+ // src/blocks/accordion/helpers.ts
5404
+ var convertOrderNumberToString = (order) => {
5405
+ return order.toString();
5406
+ };
5407
+
5408
+ // src/blocks/accordion/accordion.tsx
5409
+ var _tmpl$6 = /* @__PURE__ */ template(`<div class=builder-accordion>`);
5410
+ var _tmpl$23 = /* @__PURE__ */ template(`<div>`);
5411
+ function Accordion(props) {
5412
+ const [open, setOpen] = createSignal([]);
5413
+ const onlyOneAtATime = createMemo(() => {
5414
+ return Boolean(props.grid || props.oneAtATime);
5415
+ });
5416
+ const accordionStyles = createMemo(() => {
5417
+ const styles = {
5418
+ display: "flex",
5419
+ alignItems: "stretch",
5420
+ flexDirection: "column",
5421
+ ...props.grid && {
5422
+ flexDirection: "row",
5423
+ alignItems: "flex-start",
5424
+ flexWrap: "wrap"
5425
+ }
5426
+ };
5427
+ return Object.fromEntries(Object.entries(styles).map(([key, value]) => [camelToKebabCase(key), value]));
5428
+ });
5429
+ const accordionTitleStyles = createMemo(() => {
5430
+ const shared = {
5431
+ display: "flex",
5432
+ flexDirection: "column"
5433
+ };
5434
+ const styles = Object.fromEntries(Object.entries({
5435
+ ...shared,
5436
+ alignItems: "stretch",
5437
+ cursor: "pointer"
5438
+ }).map(([key, value]) => [camelToKebabCase(key), value]));
5439
+ return Object.fromEntries(Object.entries(styles).filter(([_, value]) => value !== void 0));
5440
+ });
5441
+ function getAccordionTitleClassName(index) {
5442
+ return `builder-accordion-title builder-accordion-title-${open().includes(index) ? "open" : "closed"}`;
5443
+ }
5444
+ function getAccordionDetailClassName(index) {
5445
+ return `builder-accordion-detail builder-accordion-detail-${open().includes(index) ? "open" : "closed"}`;
5446
+ }
5447
+ const openGridItemOrder = createMemo(() => {
5448
+ let itemOrder = null;
5449
+ const getOpenGridItemPosition = props.grid && open().length;
5450
+ if (getOpenGridItemPosition && document) {
5451
+ const openItemIndex = open()[0];
5452
+ const openItem = document.querySelector(`.builder-accordion-title[data-index="${openItemIndex}"]`);
5453
+ let subjectItem = openItem;
5454
+ itemOrder = openItemIndex;
5455
+ if (subjectItem) {
5456
+ let prevItemRect = subjectItem.getBoundingClientRect();
5457
+ while (subjectItem = subjectItem && subjectItem.nextElementSibling) {
5458
+ if (subjectItem) {
5459
+ if (subjectItem.classList.contains("builder-accordion-detail")) {
5460
+ continue;
5461
+ }
5462
+ const subjectItemRect = subjectItem.getBoundingClientRect();
5463
+ if (subjectItemRect.left > prevItemRect.left) {
5464
+ const index = parseInt(subjectItem.getAttribute("data-index") || "", 10);
5465
+ if (!isNaN(index)) {
5466
+ prevItemRect = subjectItemRect;
5467
+ itemOrder = index;
5468
+ }
5469
+ } else {
5470
+ break;
5471
+ }
5472
+ }
5473
+ }
5474
+ }
5475
+ }
5476
+ if (typeof itemOrder === "number") {
5477
+ itemOrder = itemOrder + 1;
5478
+ }
5479
+ return itemOrder;
5480
+ });
5481
+ const accordionDetailStyles = createMemo(() => {
5482
+ const styles = {
5483
+ ...{
5484
+ order: typeof openGridItemOrder() === "number" ? openGridItemOrder() : void 0
5485
+ },
5486
+ ...props.grid && {
5487
+ width: "100%"
5488
+ }
5489
+ };
5490
+ return Object.fromEntries(Object.entries(styles).filter(([_, value]) => value !== void 0));
5491
+ });
5492
+ function onClick(index) {
5493
+ if (open().includes(index)) {
5494
+ setOpen(onlyOneAtATime() ? [] : open().filter((item) => item !== index));
5495
+ } else {
5496
+ setOpen(onlyOneAtATime() ? [index] : open().concat(index));
5497
+ }
5498
+ }
5499
+ return (() => {
5500
+ const _el$ = _tmpl$6();
5501
+ insert(_el$, createComponent(For, {
5502
+ get each() {
5503
+ return props.items;
5504
+ },
5505
+ children: (item, _index) => {
5506
+ const index = _index();
5507
+ return [(() => {
5508
+ const _el$2 = _tmpl$23();
5509
+ _el$2.$$click = (event) => onClick(index);
5510
+ setAttribute(_el$2, "data-index", index);
5511
+ insert(_el$2, createComponent(blocks_default, {
5512
+ get blocks() {
5513
+ return item.title;
5514
+ },
5515
+ path: `items.${index}.title`,
5516
+ get parent() {
5517
+ return props.builderBlock.id;
5518
+ },
5519
+ get context() {
5520
+ return props.builderContext;
5521
+ },
5522
+ get registeredComponents() {
5523
+ return props.builderComponents;
5524
+ },
5525
+ get linkComponent() {
5526
+ return props.builderLinkComponent;
5527
+ }
5528
+ }));
5529
+ effect((_p$) => {
5530
+ const _v$ = getAccordionTitleClassName(index), _v$2 = {
5531
+ ...accordionTitleStyles(),
5532
+ width: props.grid ? props.gridRowWidth : void 0,
5533
+ ...{
5534
+ order: openGridItemOrder() !== null ? convertOrderNumberToString(index) : convertOrderNumberToString(index + 1)
5535
+ }
5536
+ };
5537
+ _v$ !== _p$._v$ && className(_el$2, _p$._v$ = _v$);
5538
+ _p$._v$2 = style(_el$2, _v$2, _p$._v$2);
5539
+ return _p$;
5540
+ }, {
5541
+ _v$: void 0,
5542
+ _v$2: void 0
5543
+ });
5544
+ return _el$2;
5545
+ })(), createComponent(Show, {
5546
+ get when() {
5547
+ return open().includes(index);
5548
+ },
5549
+ get children() {
5550
+ const _el$3 = _tmpl$23();
5551
+ insert(_el$3, createComponent(blocks_default, {
5552
+ get blocks() {
5553
+ return item.detail;
5554
+ },
5555
+ path: `items.${index}.detail`,
5556
+ get parent() {
5557
+ return props.builderBlock.id;
5558
+ },
5559
+ get context() {
5560
+ return props.builderContext;
5561
+ },
5562
+ get registeredComponents() {
5563
+ return props.builderComponents;
5564
+ },
5565
+ get linkComponent() {
5566
+ return props.builderLinkComponent;
5567
+ }
5568
+ }));
5569
+ effect((_p$) => {
5570
+ const _v$3 = getAccordionDetailClassName(index), _v$4 = accordionDetailStyles();
5571
+ _v$3 !== _p$._v$3 && className(_el$3, _p$._v$3 = _v$3);
5572
+ _p$._v$4 = style(_el$3, _v$4, _p$._v$4);
5573
+ return _p$;
5574
+ }, {
5575
+ _v$3: void 0,
5576
+ _v$4: void 0
5577
+ });
5578
+ return _el$3;
5579
+ }
5580
+ })];
5581
+ }
5582
+ }));
5583
+ effect((_$p) => style(_el$, accordionStyles(), _$p));
5584
+ return _el$;
5585
+ })();
5586
+ }
5587
+ var accordion_default = Accordion;
5588
+ delegateEvents(["click"]);
5589
+
5278
5590
  // src/blocks/button/component-info.ts
5279
- var componentInfo = {
5591
+ var componentInfo2 = {
5280
5592
  name: "Core:Button",
5281
5593
  image: "https://cdn.builder.io/api/v1/image/assets%2FIsxPKMo2gPRRKeakUztj1D6uqed2%2F81a15681c3e74df09677dfc57a615b13",
5282
5594
  defaultStyles: {
@@ -5312,7 +5624,7 @@ var componentInfo = {
5312
5624
  };
5313
5625
 
5314
5626
  // src/blocks/columns/component-info.ts
5315
- var componentInfo2 = {
5627
+ var componentInfo3 = {
5316
5628
  // TODO: ways to statically preprocess JSON for references, functions, etc
5317
5629
  name: "Columns",
5318
5630
  isRSC: true,
@@ -5532,7 +5844,7 @@ var componentInfo2 = {
5532
5844
  };
5533
5845
 
5534
5846
  // src/blocks/fragment/component-info.ts
5535
- var componentInfo3 = {
5847
+ var componentInfo4 = {
5536
5848
  name: "Fragment",
5537
5849
  static: true,
5538
5850
  hidden: true,
@@ -5541,7 +5853,7 @@ var componentInfo3 = {
5541
5853
  };
5542
5854
 
5543
5855
  // src/blocks/image/component-info.ts
5544
- var componentInfo4 = {
5856
+ var componentInfo5 = {
5545
5857
  name: "Image",
5546
5858
  static: true,
5547
5859
  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",
@@ -5663,7 +5975,7 @@ var componentInfo4 = {
5663
5975
  };
5664
5976
 
5665
5977
  // src/blocks/section/component-info.ts
5666
- var componentInfo5 = {
5978
+ var componentInfo6 = {
5667
5979
  name: "Core:Section",
5668
5980
  static: true,
5669
5981
  image: "https://cdn.builder.io/api/v1/image/assets%2FIsxPKMo2gPRRKeakUztj1D6uqed2%2F682efef23ace49afac61748dd305c70a",
@@ -5705,7 +6017,7 @@ var componentInfo5 = {
5705
6017
  };
5706
6018
 
5707
6019
  // src/blocks/slot/component-info.ts
5708
- var componentInfo6 = {
6020
+ var componentInfo7 = {
5709
6021
  name: "Slot",
5710
6022
  isRSC: true,
5711
6023
  description: "Allow child blocks to be inserted into this content when used as a Symbol",
@@ -5719,10 +6031,10 @@ var componentInfo6 = {
5719
6031
  defaultValue: "children"
5720
6032
  }]
5721
6033
  };
5722
- var _tmpl$6 = /* @__PURE__ */ template(`<div>`);
6034
+ var _tmpl$7 = /* @__PURE__ */ template(`<div>`);
5723
6035
  function Slot(props) {
5724
6036
  return (() => {
5725
- const _el$ = _tmpl$6();
6037
+ const _el$ = _tmpl$7();
5726
6038
  _el$.style.setProperty("pointer-events", "auto");
5727
6039
  spread(_el$, mergeProps(() => !props.builderContext.context?.symbolId && {
5728
6040
  "builder-slot": props.name
@@ -5747,7 +6059,7 @@ function Slot(props) {
5747
6059
  var slot_default = Slot;
5748
6060
 
5749
6061
  // src/blocks/symbol/component-info.ts
5750
- var componentInfo7 = {
6062
+ var componentInfo8 = {
5751
6063
  name: "Symbol",
5752
6064
  noWrap: true,
5753
6065
  static: true,
@@ -5823,7 +6135,7 @@ var defaultElement = {
5823
6135
  }
5824
6136
  }
5825
6137
  };
5826
- var componentInfo8 = {
6138
+ var componentInfo9 = {
5827
6139
  name: "Builder: Tabs",
5828
6140
  inputs: [{
5829
6141
  name: "tabs",
@@ -5921,8 +6233,8 @@ var componentInfo8 = {
5921
6233
  }]
5922
6234
  }]
5923
6235
  };
5924
- var _tmpl$7 = /* @__PURE__ */ template(`<div>`);
5925
- var _tmpl$23 = /* @__PURE__ */ template(`<div><div class=builder-tabs-wrap>`);
6236
+ var _tmpl$8 = /* @__PURE__ */ template(`<div>`);
6237
+ var _tmpl$24 = /* @__PURE__ */ template(`<div><div class=builder-tabs-wrap>`);
5926
6238
  var _tmpl$33 = /* @__PURE__ */ template(`<span>`);
5927
6239
  function Tabs(props) {
5928
6240
  const [activeTab, setActiveTab] = createSignal(props.defaultActiveTab ? props.defaultActiveTab - 1 : 0);
@@ -5937,7 +6249,7 @@ function Tabs(props) {
5937
6249
  }
5938
6250
  }
5939
6251
  return (() => {
5940
- const _el$ = _tmpl$23(), _el$2 = _el$.firstChild;
6252
+ const _el$ = _tmpl$24(), _el$2 = _el$.firstChild;
5941
6253
  _el$2.style.setProperty("display", "flex");
5942
6254
  _el$2.style.setProperty("flex-direction", "row");
5943
6255
  _el$2.style.setProperty("overflow", "auto");
@@ -5947,226 +6259,18 @@ function Tabs(props) {
5947
6259
  },
5948
6260
  children: (tab, _index) => {
5949
6261
  const index = _index();
5950
- return (() => {
5951
- const _el$4 = _tmpl$33();
5952
- _el$4.$$click = (event) => onClick(index);
5953
- setAttribute(_el$4, "key", index);
5954
- insert(_el$4, createComponent(blocks_default, {
5955
- get parent() {
5956
- return props.builderBlock.id;
5957
- },
5958
- path: `component.options.tabs.${index}.label`,
5959
- get blocks() {
5960
- return tab.label;
5961
- },
5962
- get context() {
5963
- return props.builderContext;
5964
- },
5965
- get registeredComponents() {
5966
- return props.builderComponents;
5967
- },
5968
- get linkComponent() {
5969
- return props.builderLinkComponent;
5970
- }
5971
- }));
5972
- effect((_p$) => {
5973
- const _v$ = `builder-tab-wrap ${activeTab() === index ? "builder-tab-active" : ""}`, _v$2 = {
5974
- ...activeTab() === index ? props.activeTabStyle : {}
5975
- };
5976
- _v$ !== _p$._v$ && className(_el$4, _p$._v$ = _v$);
5977
- _p$._v$2 = style(_el$4, _v$2, _p$._v$2);
5978
- return _p$;
5979
- }, {
5980
- _v$: void 0,
5981
- _v$2: void 0
5982
- });
5983
- return _el$4;
5984
- })();
5985
- }
5986
- }));
5987
- insert(_el$, createComponent(Show, {
5988
- get when() {
5989
- return activeTabContent(activeTab());
5990
- },
5991
- get children() {
5992
- const _el$3 = _tmpl$7();
5993
- insert(_el$3, createComponent(blocks_default, {
5994
- get parent() {
5995
- return props.builderBlock.id;
5996
- },
5997
- get path() {
5998
- return `component.options.tabs.${activeTab()}.content`;
5999
- },
6000
- get blocks() {
6001
- return activeTabContent(activeTab());
6002
- },
6003
- get context() {
6004
- return props.builderContext;
6005
- },
6006
- get registeredComponents() {
6007
- return props.builderComponents;
6008
- },
6009
- get linkComponent() {
6010
- return props.builderLinkComponent;
6011
- }
6012
- }));
6013
- return _el$3;
6014
- }
6015
- }), null);
6016
- effect(() => (props.tabHeaderLayout || "flex-start") != null ? _el$2.style.setProperty("justify-content", props.tabHeaderLayout || "flex-start") : _el$2.style.removeProperty("justify-content"));
6017
- return _el$;
6018
- })();
6019
- }
6020
- var tabs_default = Tabs;
6021
- delegateEvents(["click"]);
6022
-
6023
- // src/blocks/text/component-info.ts
6024
- var componentInfo9 = {
6025
- name: "Text",
6026
- static: true,
6027
- isRSC: true,
6028
- 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",
6029
- inputs: [{
6030
- name: "text",
6031
- type: "html",
6032
- required: true,
6033
- autoFocus: true,
6034
- bubble: true,
6035
- defaultValue: "Enter some text..."
6036
- }],
6037
- defaultStyles: {
6038
- lineHeight: "normal",
6039
- height: "auto",
6040
- textAlign: "center"
6041
- }
6042
- };
6043
- var _tmpl$8 = /* @__PURE__ */ template(`<div class=builder-text>`);
6044
- function Text(props) {
6045
- return (() => {
6046
- const _el$ = _tmpl$8();
6047
- _el$.style.setProperty("outline", "none");
6048
- effect(() => _el$.innerHTML = props.text?.toString() || "");
6049
- return _el$;
6050
- })();
6051
- }
6052
- var text_default = Text;
6053
-
6054
- // src/blocks/accordion/helpers.ts
6055
- var convertOrderNumberToString = (order) => {
6056
- return order.toString();
6057
- };
6058
-
6059
- // src/blocks/accordion/accordion.tsx
6060
- var _tmpl$9 = /* @__PURE__ */ template(`<div class=builder-accordion>`);
6061
- var _tmpl$24 = /* @__PURE__ */ template(`<div>`);
6062
- function Accordion(props) {
6063
- const [open, setOpen] = createSignal([]);
6064
- const onlyOneAtATime = createMemo(() => {
6065
- return Boolean(props.grid || props.oneAtATime);
6066
- });
6067
- const accordionStyles = createMemo(() => {
6068
- const styles = {
6069
- display: "flex",
6070
- alignItems: "stretch",
6071
- flexDirection: "column",
6072
- ...props.grid && {
6073
- flexDirection: "row",
6074
- alignItems: "flex-start",
6075
- flexWrap: "wrap"
6076
- }
6077
- };
6078
- return Object.fromEntries(Object.entries(styles).map(([key, value]) => [camelToKebabCase(key), value]));
6079
- });
6080
- const accordionTitleStyles = createMemo(() => {
6081
- const shared = {
6082
- display: "flex",
6083
- flexDirection: "column"
6084
- };
6085
- const styles = Object.fromEntries(Object.entries({
6086
- ...shared,
6087
- alignItems: "stretch",
6088
- cursor: "pointer"
6089
- }).map(([key, value]) => [camelToKebabCase(key), value]));
6090
- return Object.fromEntries(Object.entries(styles).filter(([_, value]) => value !== void 0));
6091
- });
6092
- function getAccordionTitleClassName(index) {
6093
- return `builder-accordion-title builder-accordion-title-${open().includes(index) ? "open" : "closed"}`;
6094
- }
6095
- function getAccordionDetailClassName(index) {
6096
- return `builder-accordion-detail builder-accordion-detail-${open().includes(index) ? "open" : "closed"}`;
6097
- }
6098
- const openGridItemOrder = createMemo(() => {
6099
- let itemOrder = null;
6100
- const getOpenGridItemPosition = props.grid && open().length;
6101
- if (getOpenGridItemPosition && document) {
6102
- const openItemIndex = open()[0];
6103
- const openItem = document.querySelector(`.builder-accordion-title[data-index="${openItemIndex}"]`);
6104
- let subjectItem = openItem;
6105
- itemOrder = openItemIndex;
6106
- if (subjectItem) {
6107
- let prevItemRect = subjectItem.getBoundingClientRect();
6108
- while (subjectItem = subjectItem && subjectItem.nextElementSibling) {
6109
- if (subjectItem) {
6110
- if (subjectItem.classList.contains("builder-accordion-detail")) {
6111
- continue;
6112
- }
6113
- const subjectItemRect = subjectItem.getBoundingClientRect();
6114
- if (subjectItemRect.left > prevItemRect.left) {
6115
- const index = parseInt(subjectItem.getAttribute("data-index") || "", 10);
6116
- if (!isNaN(index)) {
6117
- prevItemRect = subjectItemRect;
6118
- itemOrder = index;
6119
- }
6120
- } else {
6121
- break;
6122
- }
6123
- }
6124
- }
6125
- }
6126
- }
6127
- if (typeof itemOrder === "number") {
6128
- itemOrder = itemOrder + 1;
6129
- }
6130
- return itemOrder;
6131
- });
6132
- const accordionDetailStyles = createMemo(() => {
6133
- const styles = {
6134
- ...{
6135
- order: typeof openGridItemOrder() === "number" ? openGridItemOrder() : void 0
6136
- },
6137
- ...props.grid && {
6138
- width: "100%"
6139
- }
6140
- };
6141
- return Object.fromEntries(Object.entries(styles).filter(([_, value]) => value !== void 0));
6142
- });
6143
- function onClick(index) {
6144
- if (open().includes(index)) {
6145
- setOpen(onlyOneAtATime() ? [] : open().filter((item) => item !== index));
6146
- } else {
6147
- setOpen(onlyOneAtATime() ? [index] : open().concat(index));
6148
- }
6149
- }
6150
- return (() => {
6151
- const _el$ = _tmpl$9();
6152
- insert(_el$, createComponent(For, {
6153
- get each() {
6154
- return props.items;
6155
- },
6156
- children: (item, _index) => {
6157
- const index = _index();
6158
- return [(() => {
6159
- const _el$2 = _tmpl$24();
6160
- _el$2.$$click = (event) => onClick(index);
6161
- setAttribute(_el$2, "data-index", index);
6162
- insert(_el$2, createComponent(blocks_default, {
6163
- get blocks() {
6164
- return item.title;
6165
- },
6166
- path: `items.${index}.title`,
6262
+ return (() => {
6263
+ const _el$4 = _tmpl$33();
6264
+ _el$4.$$click = (event) => onClick(index);
6265
+ setAttribute(_el$4, "key", index);
6266
+ insert(_el$4, createComponent(blocks_default, {
6167
6267
  get parent() {
6168
6268
  return props.builderBlock.id;
6169
6269
  },
6270
+ path: `component.options.tabs.${index}.label`,
6271
+ get blocks() {
6272
+ return tab.label;
6273
+ },
6170
6274
  get context() {
6171
6275
  return props.builderContext;
6172
6276
  },
@@ -6178,190 +6282,86 @@ function Accordion(props) {
6178
6282
  }
6179
6283
  }));
6180
6284
  effect((_p$) => {
6181
- const _v$ = getAccordionTitleClassName(index), _v$2 = {
6182
- ...accordionTitleStyles(),
6183
- width: props.grid ? props.gridRowWidth : void 0,
6184
- ...{
6185
- order: openGridItemOrder() !== null ? convertOrderNumberToString(index) : convertOrderNumberToString(index + 1)
6186
- }
6285
+ const _v$ = `builder-tab-wrap ${activeTab() === index ? "builder-tab-active" : ""}`, _v$2 = {
6286
+ ...activeTab() === index ? props.activeTabStyle : {}
6187
6287
  };
6188
- _v$ !== _p$._v$ && className(_el$2, _p$._v$ = _v$);
6189
- _p$._v$2 = style(_el$2, _v$2, _p$._v$2);
6288
+ _v$ !== _p$._v$ && className(_el$4, _p$._v$ = _v$);
6289
+ _p$._v$2 = style(_el$4, _v$2, _p$._v$2);
6190
6290
  return _p$;
6191
6291
  }, {
6192
6292
  _v$: void 0,
6193
6293
  _v$2: void 0
6194
6294
  });
6195
- return _el$2;
6196
- })(), createComponent(Show, {
6197
- get when() {
6198
- return open().includes(index);
6295
+ return _el$4;
6296
+ })();
6297
+ }
6298
+ }));
6299
+ insert(_el$, createComponent(Show, {
6300
+ get when() {
6301
+ return activeTabContent(activeTab());
6302
+ },
6303
+ get children() {
6304
+ const _el$3 = _tmpl$8();
6305
+ insert(_el$3, createComponent(blocks_default, {
6306
+ get parent() {
6307
+ return props.builderBlock.id;
6199
6308
  },
6200
- get children() {
6201
- const _el$3 = _tmpl$24();
6202
- insert(_el$3, createComponent(blocks_default, {
6203
- get blocks() {
6204
- return item.detail;
6205
- },
6206
- path: `items.${index}.detail`,
6207
- get parent() {
6208
- return props.builderBlock.id;
6209
- },
6210
- get context() {
6211
- return props.builderContext;
6212
- },
6213
- get registeredComponents() {
6214
- return props.builderComponents;
6215
- },
6216
- get linkComponent() {
6217
- return props.builderLinkComponent;
6218
- }
6219
- }));
6220
- effect((_p$) => {
6221
- const _v$3 = getAccordionDetailClassName(index), _v$4 = accordionDetailStyles();
6222
- _v$3 !== _p$._v$3 && className(_el$3, _p$._v$3 = _v$3);
6223
- _p$._v$4 = style(_el$3, _v$4, _p$._v$4);
6224
- return _p$;
6225
- }, {
6226
- _v$3: void 0,
6227
- _v$4: void 0
6228
- });
6229
- return _el$3;
6309
+ get path() {
6310
+ return `component.options.tabs.${activeTab()}.content`;
6311
+ },
6312
+ get blocks() {
6313
+ return activeTabContent(activeTab());
6314
+ },
6315
+ get context() {
6316
+ return props.builderContext;
6317
+ },
6318
+ get registeredComponents() {
6319
+ return props.builderComponents;
6320
+ },
6321
+ get linkComponent() {
6322
+ return props.builderLinkComponent;
6230
6323
  }
6231
- })];
6324
+ }));
6325
+ return _el$3;
6232
6326
  }
6233
- }));
6234
- effect((_$p) => style(_el$, accordionStyles(), _$p));
6327
+ }), null);
6328
+ effect(() => (props.tabHeaderLayout || "flex-start") != null ? _el$2.style.setProperty("justify-content", props.tabHeaderLayout || "flex-start") : _el$2.style.removeProperty("justify-content"));
6235
6329
  return _el$;
6236
6330
  })();
6237
6331
  }
6238
- var accordion_default = Accordion;
6332
+ var tabs_default = Tabs;
6239
6333
  delegateEvents(["click"]);
6240
6334
 
6241
- // src/blocks/accordion/component-info.ts
6242
- var defaultTitle = {
6243
- "@type": "@builder.io/sdk:Element",
6244
- layerName: "Accordion item title",
6245
- responsiveStyles: {
6246
- large: {
6247
- marginTop: "10px",
6248
- position: "relative",
6249
- display: "flex",
6250
- alignItems: "stretch",
6251
- flexDirection: "column",
6252
- paddingBottom: "10px"
6253
- }
6254
- },
6255
- children: [{
6256
- "@type": "@builder.io/sdk:Element",
6257
- responsiveStyles: {
6258
- large: {
6259
- textAlign: "left",
6260
- display: "flex",
6261
- flexDirection: "column"
6262
- }
6263
- },
6264
- component: {
6265
- name: "Text",
6266
- options: {
6267
- text: "I am an accordion title. Click me!"
6268
- }
6269
- }
6270
- }]
6271
- };
6272
- var defaultDetail = {
6273
- "@type": "@builder.io/sdk:Element",
6274
- layerName: "Accordion item detail",
6275
- responsiveStyles: {
6276
- large: {
6277
- position: "relative",
6278
- display: "flex",
6279
- alignItems: "stretch",
6280
- flexDirection: "column",
6281
- marginTop: "10px",
6282
- paddingBottom: "10px"
6283
- }
6284
- },
6285
- children: [{
6286
- "@type": "@builder.io/sdk:Element",
6287
- responsiveStyles: {
6288
- large: {
6289
- paddingTop: "50px",
6290
- textAlign: "left",
6291
- display: "flex",
6292
- flexDirection: "column",
6293
- paddingBottom: "50px"
6294
- }
6295
- },
6296
- component: {
6297
- name: "Text",
6298
- options: {
6299
- text: "I am an accordion detail, hello!"
6300
- }
6301
- }
6302
- }]
6303
- };
6335
+ // src/blocks/text/component-info.ts
6304
6336
  var componentInfo10 = {
6305
- name: "Builder:Accordion",
6306
- canHaveChildren: true,
6307
- image: "https://cdn.builder.io/api/v1/image/assets%2FagZ9n5CUKRfbL9t6CaJOyVSK4Es2%2Ffab6c1fd3fe542408cbdec078bca7f35",
6308
- defaultStyles: {
6309
- display: "flex",
6310
- flexDirection: "column",
6311
- alignItems: "stretch"
6312
- },
6337
+ name: "Text",
6338
+ static: true,
6339
+ isRSC: true,
6340
+ 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",
6313
6341
  inputs: [{
6314
- name: "items",
6315
- type: "list",
6316
- broadcast: true,
6317
- subFields: [{
6318
- name: "title",
6319
- type: "uiBlocks",
6320
- hideFromUI: true,
6321
- defaultValue: [defaultTitle]
6322
- }, {
6323
- name: "detail",
6324
- type: "uiBlocks",
6325
- hideFromUI: true,
6326
- defaultValue: [defaultDetail]
6327
- }],
6328
- defaultValue: [{
6329
- title: [defaultTitle],
6330
- detail: [defaultDetail]
6331
- }, {
6332
- title: [defaultTitle],
6333
- detail: [defaultDetail]
6334
- }],
6335
- showIf: (options) => !options.get("useChildrenForItems")
6336
- }, {
6337
- name: "oneAtATime",
6338
- helperText: "Only allow opening one at a time (collapse all others when new item openned)",
6339
- type: "boolean",
6340
- defaultValue: false
6341
- }, {
6342
- name: "grid",
6343
- helperText: "Display as a grid",
6344
- type: "boolean",
6345
- defaultValue: false
6346
- }, {
6347
- name: "gridRowWidth",
6348
- helperText: "Display as a grid",
6349
- type: "string",
6350
- showIf: (options) => options.get("grid"),
6351
- defaultValue: "25%"
6352
- }, {
6353
- name: "useChildrenForItems",
6354
- type: "boolean",
6355
- helperText: "Use child elements for each slide, instead of the array. Useful for dynamically repeating items",
6356
- advanced: true,
6357
- defaultValue: false,
6358
- onChange: (options) => {
6359
- if (options.get("useChildrenForItems") === true) {
6360
- options.set("items", []);
6361
- }
6362
- }
6363
- }]
6342
+ name: "text",
6343
+ type: "html",
6344
+ required: true,
6345
+ autoFocus: true,
6346
+ bubble: true,
6347
+ defaultValue: "Enter some text..."
6348
+ }],
6349
+ defaultStyles: {
6350
+ lineHeight: "normal",
6351
+ height: "auto",
6352
+ textAlign: "center"
6353
+ }
6364
6354
  };
6355
+ var _tmpl$9 = /* @__PURE__ */ template(`<div class=builder-text>`);
6356
+ function Text(props) {
6357
+ return (() => {
6358
+ const _el$ = _tmpl$9();
6359
+ _el$.style.setProperty("outline", "none");
6360
+ effect(() => _el$.innerHTML = props.text?.toString() || "");
6361
+ return _el$;
6362
+ })();
6363
+ }
6364
+ var text_default = Text;
6365
6365
 
6366
6366
  // src/blocks/custom-code/component-info.ts
6367
6367
  var componentInfo11 = {
@@ -6805,11 +6805,11 @@ function FormComponent(props) {
6805
6805
  return;
6806
6806
  }
6807
6807
  event.preventDefault();
6808
- const el = event.currentTarget;
6808
+ const el = event.currentTarget || event.target;
6809
6809
  const headers = props.customHeaders || {};
6810
6810
  let body;
6811
6811
  const formData = new FormData(el);
6812
- const formPairs = Array.from(event.currentTarget.querySelectorAll("input,select,textarea")).filter((el2) => !!el2.name).map((el2) => {
6812
+ const formPairs = Array.from(el.querySelectorAll("input,select,textarea")).filter((el2) => !!el2.name).map((el2) => {
6813
6813
  let value;
6814
6814
  const key = el2.name;
6815
6815
  if (el2 instanceof HTMLInputElement) {
@@ -6979,7 +6979,7 @@ function FormComponent(props) {
6979
6979
  get name() {
6980
6980
  return props.name;
6981
6981
  }
6982
- }, {}, () => props.attributes), false, true);
6982
+ }, {}, {}, () => props.attributes), false, true);
6983
6983
  insert(_el$, createComponent(Show, {
6984
6984
  get when() {
6985
6985
  return props.builderBlock && props.builderBlock.children;
@@ -7555,34 +7555,34 @@ var getExtraComponents = () => [{
7555
7555
  // src/constants/builder-registered-components.ts
7556
7556
  var getDefaultRegisteredComponents = () => [{
7557
7557
  component: button_default,
7558
- ...componentInfo
7558
+ ...componentInfo2
7559
7559
  }, {
7560
7560
  component: columns_default,
7561
- ...componentInfo2
7561
+ ...componentInfo3
7562
7562
  }, {
7563
7563
  component: fragment_default,
7564
- ...componentInfo3
7564
+ ...componentInfo4
7565
7565
  }, {
7566
7566
  component: image_default,
7567
- ...componentInfo4
7567
+ ...componentInfo5
7568
7568
  }, {
7569
7569
  component: section_default,
7570
- ...componentInfo5
7570
+ ...componentInfo6
7571
7571
  }, {
7572
7572
  component: slot_default,
7573
- ...componentInfo6
7573
+ ...componentInfo7
7574
7574
  }, {
7575
7575
  component: symbol_default,
7576
- ...componentInfo7
7576
+ ...componentInfo8
7577
7577
  }, {
7578
7578
  component: text_default,
7579
- ...componentInfo9
7579
+ ...componentInfo10
7580
7580
  }, ...TARGET === "rsc" ? [] : [{
7581
7581
  component: tabs_default,
7582
- ...componentInfo8
7582
+ ...componentInfo9
7583
7583
  }, {
7584
7584
  component: accordion_default,
7585
- ...componentInfo10
7585
+ ...componentInfo
7586
7586
  }], ...getExtraComponents()];
7587
7587
 
7588
7588
  // src/functions/register-component.ts
@@ -8161,7 +8161,7 @@ function isFromTrustedHost(trustedHosts, e) {
8161
8161
  }
8162
8162
 
8163
8163
  // src/constants/sdk-version.ts
8164
- var SDK_VERSION = "1.0.28";
8164
+ var SDK_VERSION = "1.0.30";
8165
8165
 
8166
8166
  // src/functions/register.ts
8167
8167
  var registry = {};
@@ -8625,7 +8625,7 @@ function EnableEditor(props) {
8625
8625
  if (isPreviewing() && !isEditing()) {
8626
8626
  const searchParams = new URL(location.href).searchParams;
8627
8627
  const searchParamPreviewModel = searchParams.get("builder.preview");
8628
- const searchParamPreviewId = searchParams.get(`builder.preview.${searchParamPreviewModel}`);
8628
+ const searchParamPreviewId = searchParams.get(`builder.overrides.${searchParamPreviewModel}`);
8629
8629
  const previewApiKey = searchParams.get("apiKey") || searchParams.get("builder.space");
8630
8630
  if (searchParamPreviewModel === props.model && previewApiKey === props.apiKey && (!props.content || searchParamPreviewId === props.content.id)) {
8631
8631
  fetchOneEntry({