@makeswift/runtime 0.6.1 → 0.6.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.
Files changed (105) hide show
  1. package/dist/Box.cjs.js +1 -1
  2. package/dist/Box.es.js +1 -1
  3. package/dist/Button.cjs.js +1 -1
  4. package/dist/Button.es.js +1 -1
  5. package/dist/Carousel.cjs.js +1 -1
  6. package/dist/Carousel.es.js +1 -1
  7. package/dist/Countdown.cjs.js +1 -1
  8. package/dist/Countdown.es.js +1 -1
  9. package/dist/Divider.cjs.js +1 -1
  10. package/dist/Divider.es.js +1 -1
  11. package/dist/EditableText.cjs.js +11 -2
  12. package/dist/EditableText.cjs.js.map +1 -1
  13. package/dist/EditableText.es.js +13 -4
  14. package/dist/EditableText.es.js.map +1 -1
  15. package/dist/Embed.cjs.js +1 -1
  16. package/dist/Embed.es.js +1 -1
  17. package/dist/Form.cjs.js +1 -1
  18. package/dist/Form.es.js +1 -1
  19. package/dist/Image.cjs.js +3 -6
  20. package/dist/Image.cjs.js.map +1 -1
  21. package/dist/Image.es.js +4 -7
  22. package/dist/Image.es.js.map +1 -1
  23. package/dist/LiveProvider.cjs.js +1 -1
  24. package/dist/LiveProvider.es.js +1 -1
  25. package/dist/Navigation.cjs.js +1 -1
  26. package/dist/Navigation.es.js +1 -1
  27. package/dist/PreviewProvider.cjs.js +2 -2
  28. package/dist/PreviewProvider.cjs.js.map +1 -1
  29. package/dist/PreviewProvider.es.js +2 -2
  30. package/dist/ReadOnlyText.cjs.js +6 -3
  31. package/dist/ReadOnlyText.cjs.js.map +1 -1
  32. package/dist/ReadOnlyText.es.js +6 -3
  33. package/dist/ReadOnlyText.es.js.map +1 -1
  34. package/dist/Root.cjs.js +1 -1
  35. package/dist/Root.es.js +1 -1
  36. package/dist/SocialLinks.cjs.js +1 -1
  37. package/dist/SocialLinks.es.js +1 -1
  38. package/dist/Text.cjs.js +1 -1
  39. package/dist/Text.es.js +1 -1
  40. package/dist/Video.cjs.js +1 -1
  41. package/dist/Video.es.js +1 -1
  42. package/dist/builder.cjs.js +1 -1
  43. package/dist/builder.es.js +1 -1
  44. package/dist/components.cjs.js +1 -1
  45. package/dist/components.es.js +1 -1
  46. package/dist/constants.cjs.js +20 -20
  47. package/dist/constants.cjs.js.map +1 -1
  48. package/dist/constants.es.js +2 -2
  49. package/dist/control-serialization.cjs.js +37 -37
  50. package/dist/control-serialization.cjs.js.map +1 -1
  51. package/dist/control-serialization.es.js +1 -1
  52. package/dist/control.cjs.js +22 -22
  53. package/dist/control.cjs.js.map +1 -1
  54. package/dist/control.es.js +1 -1
  55. package/dist/controls.cjs.js +21 -17
  56. package/dist/controls.cjs.js.map +1 -1
  57. package/dist/controls.es.js +1 -1
  58. package/dist/index.cjs.js +237 -208
  59. package/dist/index.cjs.js.map +1 -1
  60. package/dist/index.cjs2.js +1 -1
  61. package/dist/index.cjs5.js +36 -139
  62. package/dist/index.cjs5.js.map +1 -1
  63. package/dist/index.cjs6.js +141 -0
  64. package/dist/index.cjs6.js.map +1 -0
  65. package/dist/index.es.js +52 -26
  66. package/dist/index.es.js.map +1 -1
  67. package/dist/index.es2.js +1 -1
  68. package/dist/index.es5.js +34 -138
  69. package/dist/index.es5.js.map +1 -1
  70. package/dist/index.es6.js +139 -0
  71. package/dist/index.es6.js.map +1 -0
  72. package/dist/main.cjs.js +1 -1
  73. package/dist/main.es.js +1 -1
  74. package/dist/next.cjs.js +1 -1
  75. package/dist/next.es.js +2 -2
  76. package/dist/prop-controllers.cjs.js +4 -4
  77. package/dist/prop-controllers.es.js +1 -1
  78. package/dist/react.cjs.js +1 -1
  79. package/dist/react.es.js +1 -1
  80. package/dist/{slot.cjs.js → rich-text.cjs.js} +84 -8
  81. package/dist/rich-text.cjs.js.map +1 -0
  82. package/dist/{slot.es.js → rich-text.es.js} +80 -8
  83. package/dist/rich-text.es.js.map +1 -0
  84. package/dist/types/src/components/builtin/Box/register.d.ts.map +1 -1
  85. package/dist/types/src/components/builtin/Image/Image.d.ts.map +1 -1
  86. package/dist/types/src/components/builtin/Text/EditableText.d.ts.map +1 -1
  87. package/dist/types/src/controls/index.d.ts +1 -0
  88. package/dist/types/src/controls/index.d.ts.map +1 -1
  89. package/dist/types/src/controls/rich-text.d.ts +66 -0
  90. package/dist/types/src/controls/rich-text.d.ts.map +1 -0
  91. package/dist/types/src/controls/style.d.ts +16 -4
  92. package/dist/types/src/controls/style.d.ts.map +1 -1
  93. package/dist/types/src/prop-controllers/descriptors.d.ts +4 -2
  94. package/dist/types/src/prop-controllers/descriptors.d.ts.map +1 -1
  95. package/dist/types/src/prop-controllers/instances.d.ts +13 -3
  96. package/dist/types/src/prop-controllers/instances.d.ts.map +1 -1
  97. package/dist/types/src/runtimes/react/controls/rich-text.d.ts +8 -0
  98. package/dist/types/src/runtimes/react/controls/rich-text.d.ts.map +1 -0
  99. package/dist/types/src/runtimes/react/controls/slot.d.ts.map +1 -1
  100. package/dist/types/src/runtimes/react/controls.d.ts.map +1 -1
  101. package/dist/types/src/runtimes/react/poll-box-model.d.ts +6 -0
  102. package/dist/types/src/runtimes/react/poll-box-model.d.ts.map +1 -0
  103. package/package.json +1 -1
  104. package/dist/slot.cjs.js.map +0 -1
  105. package/dist/slot.es.js.map +0 -1
package/dist/index.cjs.js CHANGED
@@ -45,7 +45,7 @@ var css = require("@emotion/css");
45
45
  var serialize = require("@emotion/serialize");
46
46
  var utils = require("@emotion/utils");
47
47
  var jsxRuntime = require("react/jsx-runtime");
48
- var slot = require("./slot.cjs.js");
48
+ var richText = require("./rich-text.cjs.js");
49
49
  var textInput = require("./text-input.cjs.js");
50
50
  var combobox = require("./combobox.cjs.js");
51
51
  var control = require("./control.cjs.js");
@@ -180,13 +180,13 @@ async function introspect(element, client, store) {
180
180
  getResourcesFromElementDescriptors({ propName: descriptor.config.type }, { propName: item.value });
181
181
  });
182
182
  }
183
- if (descriptor.type === slot.Types.Shape) {
183
+ if (descriptor.type === richText.Types.Shape) {
184
184
  const prop = props[propName];
185
185
  if (prop == null)
186
186
  return;
187
187
  getResourcesFromElementDescriptors(descriptor.options.type, prop);
188
188
  }
189
- if (descriptor.type === slot.Types.List) {
189
+ if (descriptor.type === richText.Types.List) {
190
190
  const prop = props[propName];
191
191
  if (prop == null)
192
192
  return;
@@ -1083,7 +1083,7 @@ class Document$1 extends NextDocument__default["default"] {
1083
1083
  });
1084
1084
  }
1085
1085
  }
1086
- const version = "0.6.1";
1086
+ const version = "0.6.3";
1087
1087
  function isErrorWithMessage(error) {
1088
1088
  return typeof error === "object" && error !== null && "message" in error && typeof error.message === "string";
1089
1089
  }
@@ -1414,10 +1414,13 @@ function registerComponent$c(runtime) {
1414
1414
  type: constants.MakeswiftComponentType.Box,
1415
1415
  label: "Box",
1416
1416
  props: {
1417
- id: slot.ElementID(),
1418
- backgrounds: slot.Backgrounds(),
1419
- width: slot.Width({ format: slot.Width.Format.ClassName }),
1420
- height: slot.ResponsiveIconRadioGroup({
1417
+ id: richText.ElementID(),
1418
+ backgrounds: richText.Backgrounds(),
1419
+ width: richText.Width({
1420
+ format: richText.Width.Format.ClassName,
1421
+ defaultValue: { value: 100, unit: "%" }
1422
+ }),
1423
+ height: richText.ResponsiveIconRadioGroup({
1421
1424
  label: "Height",
1422
1425
  options: [
1423
1426
  { value: "auto", label: "Auto", icon: "HeightAuto16" },
@@ -1425,7 +1428,7 @@ function registerComponent$c(runtime) {
1425
1428
  ],
1426
1429
  defaultValue: "auto"
1427
1430
  }),
1428
- verticalAlign: slot.ResponsiveIconRadioGroup({
1431
+ verticalAlign: richText.ResponsiveIconRadioGroup({
1429
1432
  label: "Align items",
1430
1433
  options: [
1431
1434
  { value: "flex-start", label: "Top", icon: "VerticalAlignStart16" },
@@ -1439,9 +1442,9 @@ function registerComponent$c(runtime) {
1439
1442
  ],
1440
1443
  defaultValue: "flex-start"
1441
1444
  }),
1442
- margin: slot.Margin({ format: slot.Margin.Format.ClassName }),
1443
- padding: slot.Padding({
1444
- format: slot.Padding.Format.ClassName,
1445
+ margin: richText.Margin({ format: richText.Margin.Format.ClassName }),
1446
+ padding: richText.Padding({
1447
+ format: richText.Padding.Format.ClassName,
1445
1448
  preset: [
1446
1449
  {
1447
1450
  deviceId: "desktop",
@@ -1454,16 +1457,16 @@ function registerComponent$c(runtime) {
1454
1457
  }
1455
1458
  ]
1456
1459
  }),
1457
- border: slot.Border({ format: slot.Border.Format.ClassName }),
1458
- borderRadius: slot.BorderRadius({ format: slot.BorderRadius.Format.ClassName }),
1459
- boxShadow: slot.Shadows({ format: slot.Shadows.Format.ClassName }),
1460
- rowGap: slot.GapY((props) => ({
1460
+ border: richText.Border({ format: richText.Border.Format.ClassName }),
1461
+ borderRadius: richText.BorderRadius({ format: richText.BorderRadius.Format.ClassName }),
1462
+ boxShadow: richText.Shadows({ format: richText.Shadows.Format.ClassName }),
1463
+ rowGap: richText.GapY((props) => ({
1461
1464
  hidden: props.children == null
1462
1465
  })),
1463
- columnGap: slot.GapX((props) => ({
1466
+ columnGap: richText.GapX((props) => ({
1464
1467
  hidden: props.children == null
1465
1468
  })),
1466
- boxAnimateType: slot.ResponsiveSelect({
1469
+ boxAnimateType: richText.ResponsiveSelect({
1467
1470
  label: "Animate box in",
1468
1471
  labelOrientation: "vertical",
1469
1472
  options: [
@@ -1479,7 +1482,7 @@ function registerComponent$c(runtime) {
1479
1482
  ],
1480
1483
  defaultValue: "none"
1481
1484
  }),
1482
- boxAnimateDuration: slot.ResponsiveNumber((props, device) => ({
1485
+ boxAnimateDuration: richText.ResponsiveNumber((props, device) => ({
1483
1486
  label: "Box duration",
1484
1487
  defaultValue: DEFAULT_BOX_ANIMATE_DURATION,
1485
1488
  min: 0.1,
@@ -1487,7 +1490,7 @@ function registerComponent$c(runtime) {
1487
1490
  suffix: "s",
1488
1491
  hidden: isHiddenBasedOnBoxAnimation(props, device)
1489
1492
  })),
1490
- boxAnimateDelay: slot.ResponsiveNumber((props, device) => ({
1493
+ boxAnimateDelay: richText.ResponsiveNumber((props, device) => ({
1491
1494
  label: "Box delay",
1492
1495
  defaultValue: DEFAULT_BOX_ANIMATE_DELAY,
1493
1496
  min: 0,
@@ -1495,7 +1498,7 @@ function registerComponent$c(runtime) {
1495
1498
  suffix: "s",
1496
1499
  hidden: isHiddenBasedOnBoxAnimation(props, device)
1497
1500
  })),
1498
- itemAnimateType: slot.ResponsiveSelect({
1501
+ itemAnimateType: richText.ResponsiveSelect({
1499
1502
  label: "Animate items in",
1500
1503
  labelOrientation: "vertical",
1501
1504
  options: [
@@ -1511,7 +1514,7 @@ function registerComponent$c(runtime) {
1511
1514
  ],
1512
1515
  defaultValue: "none"
1513
1516
  }),
1514
- itemAnimateDuration: slot.ResponsiveNumber((props, device) => ({
1517
+ itemAnimateDuration: richText.ResponsiveNumber((props, device) => ({
1515
1518
  label: "Items duration",
1516
1519
  defaultValue: DEFAULT_BOX_ANIMATE_DURATION,
1517
1520
  min: 0.1,
@@ -1519,7 +1522,7 @@ function registerComponent$c(runtime) {
1519
1522
  suffix: "s",
1520
1523
  hidden: isHiddenBasedOnItemAnimation(props, device)
1521
1524
  })),
1522
- itemAnimateDelay: slot.ResponsiveNumber((props, device) => ({
1525
+ itemAnimateDelay: richText.ResponsiveNumber((props, device) => ({
1523
1526
  label: "Items delay",
1524
1527
  defaultValue: DEFAULT_ITEM_ANIMATE_DELAY,
1525
1528
  min: 0,
@@ -1527,7 +1530,7 @@ function registerComponent$c(runtime) {
1527
1530
  suffix: "s",
1528
1531
  hidden: isHiddenBasedOnItemAnimation(props, device)
1529
1532
  })),
1530
- itemStaggerDuration: slot.ResponsiveNumber((props, device) => ({
1533
+ itemStaggerDuration: richText.ResponsiveNumber((props, device) => ({
1531
1534
  label: "Stagger",
1532
1535
  min: 0,
1533
1536
  step: 0.05,
@@ -1535,11 +1538,11 @@ function registerComponent$c(runtime) {
1535
1538
  defaultValue: DEFAULT_ITEM_STAGGER_DURATION,
1536
1539
  hidden: isHiddenBasedOnItemAnimation(props, device)
1537
1540
  })),
1538
- hidePlaceholder: slot.Checkbox((props) => ({
1541
+ hidePlaceholder: richText.Checkbox((props) => ({
1539
1542
  label: "Hide placeholder",
1540
1543
  hidden: props.children != null
1541
1544
  })),
1542
- children: slot.Grid()
1545
+ children: richText.Grid()
1543
1546
  }
1544
1547
  });
1545
1548
  }
@@ -1550,9 +1553,9 @@ function registerComponent$b(runtime) {
1550
1553
  type: constants.MakeswiftComponentType.Button,
1551
1554
  label: "Button",
1552
1555
  props: {
1553
- id: slot.ElementID(),
1554
- children: slot.TextInput({ placeholder: "Button text" }),
1555
- link: slot.Link({
1556
+ id: richText.ElementID(),
1557
+ children: richText.TextInput({ placeholder: "Button text" }),
1558
+ link: richText.Link({
1556
1559
  defaultValue: {
1557
1560
  type: "OPEN_PAGE",
1558
1561
  payload: {
@@ -1561,7 +1564,7 @@ function registerComponent$b(runtime) {
1561
1564
  }
1562
1565
  }
1563
1566
  }),
1564
- variant: slot.ResponsiveSelect({
1567
+ variant: richText.ResponsiveSelect({
1565
1568
  label: "Style",
1566
1569
  labelOrientation: "horizontal",
1567
1570
  options: [
@@ -1575,7 +1578,7 @@ function registerComponent$b(runtime) {
1575
1578
  ],
1576
1579
  defaultValue: "flat"
1577
1580
  }),
1578
- shape: slot.ResponsiveIconRadioGroup({
1581
+ shape: richText.ResponsiveIconRadioGroup({
1579
1582
  label: "Shape",
1580
1583
  options: [
1581
1584
  { label: "Pill", value: "pill", icon: "ButtonPill16" },
@@ -1584,7 +1587,7 @@ function registerComponent$b(runtime) {
1584
1587
  ],
1585
1588
  defaultValue: "rounded"
1586
1589
  }),
1587
- size: slot.ResponsiveIconRadioGroup({
1590
+ size: richText.ResponsiveIconRadioGroup({
1588
1591
  label: "Size",
1589
1592
  options: [
1590
1593
  { label: "Small", value: "small", icon: "SizeSmall16" },
@@ -1593,19 +1596,19 @@ function registerComponent$b(runtime) {
1593
1596
  ],
1594
1597
  defaultValue: "medium"
1595
1598
  }),
1596
- color: slot.ResponsiveColor((props, device) => {
1599
+ color: richText.ResponsiveColor((props, device) => {
1597
1600
  var _a;
1598
1601
  const variant = props.variant;
1599
1602
  const hidden = ((_a = findDeviceOverride(variant, device)) == null ? void 0 : _a.value) === "clear";
1600
1603
  return { placeholder: "black", hidden };
1601
1604
  }),
1602
- textColor: slot.ResponsiveColor({
1605
+ textColor: richText.ResponsiveColor({
1603
1606
  label: "Text color",
1604
1607
  placeholder: "white"
1605
1608
  }),
1606
- textStyle: slot.TextStyle(),
1607
- width: slot.Width(),
1608
- margin: slot.Margin({ format: slot.Margin.Format.ClassName })
1609
+ textStyle: richText.TextStyle(),
1610
+ width: richText.Width(),
1611
+ margin: richText.Margin({ format: richText.Margin.Format.ClassName })
1609
1612
  }
1610
1613
  });
1611
1614
  }
@@ -1617,20 +1620,20 @@ function registerComponent$a(runtime) {
1617
1620
  label: "Carousel",
1618
1621
  icon: "Carousel40",
1619
1622
  props: {
1620
- id: slot.ElementID(),
1621
- images: slot.Images({
1623
+ id: richText.ElementID(),
1624
+ images: richText.Images({
1622
1625
  preset: [
1623
1626
  { key: uuid__default["default"](), props: {} },
1624
1627
  { key: uuid__default["default"](), props: {} },
1625
1628
  { key: uuid__default["default"](), props: {} }
1626
1629
  ]
1627
1630
  }),
1628
- width: slot.Width({
1629
- format: slot.Width.Format.ClassName,
1631
+ width: richText.Width({
1632
+ format: richText.Width.Format.ClassName,
1630
1633
  defaultValue: { value: 400, unit: "px" }
1631
1634
  }),
1632
- margin: slot.Margin({ format: slot.Margin.Format.ClassName }),
1633
- pageSize: slot.ResponsiveNumber((props) => {
1635
+ margin: richText.Margin({ format: richText.Margin.Format.ClassName }),
1636
+ pageSize: richText.ResponsiveNumber((props) => {
1634
1637
  var _a;
1635
1638
  const images = props.images;
1636
1639
  const imagesLength = (_a = images == null ? void 0 : images.length) != null ? _a : 0;
@@ -1642,7 +1645,7 @@ function registerComponent$a(runtime) {
1642
1645
  step: 1
1643
1646
  };
1644
1647
  }),
1645
- step: slot.ResponsiveNumber((props, device) => {
1648
+ step: richText.ResponsiveNumber((props, device) => {
1646
1649
  var _a, _b;
1647
1650
  const pageSize = props.pageSize;
1648
1651
  const pageSizeValue = (_b = (_a = findDeviceOverride(pageSize, device)) == null ? void 0 : _a.value) != null ? _b : 1;
@@ -1654,7 +1657,7 @@ function registerComponent$a(runtime) {
1654
1657
  step: 1
1655
1658
  };
1656
1659
  }),
1657
- slideAlignment: slot.ResponsiveIconRadioGroup({
1660
+ slideAlignment: richText.ResponsiveIconRadioGroup({
1658
1661
  label: "Alignment",
1659
1662
  options: [
1660
1663
  { label: "Top", value: "flex-start", icon: "VerticalAlignStart16" },
@@ -1663,13 +1666,13 @@ function registerComponent$a(runtime) {
1663
1666
  ],
1664
1667
  defaultValue: "center"
1665
1668
  }),
1666
- gap: slot.GapX({
1669
+ gap: richText.GapX({
1667
1670
  label: "Gap",
1668
1671
  step: 5,
1669
1672
  defaultValue: { value: 0, unit: "px" }
1670
1673
  }),
1671
- autoplay: slot.Checkbox({ label: "Autoplay" }),
1672
- delay: slot.Number((props) => ({
1674
+ autoplay: richText.Checkbox({ label: "Autoplay" }),
1675
+ delay: richText.Number((props) => ({
1673
1676
  label: "Delay",
1674
1677
  preset: 5,
1675
1678
  min: 1,
@@ -1677,8 +1680,8 @@ function registerComponent$a(runtime) {
1677
1680
  suffix: "seconds",
1678
1681
  hidden: !props.autoplay
1679
1682
  })),
1680
- showArrows: slot.Checkbox({ preset: true, label: "Show arrows" }),
1681
- arrowPosition: slot.ResponsiveIconRadioGroup((props) => ({
1683
+ showArrows: richText.Checkbox({ preset: true, label: "Show arrows" }),
1684
+ arrowPosition: richText.ResponsiveIconRadioGroup((props) => ({
1682
1685
  label: "Arrow position",
1683
1686
  options: [
1684
1687
  { label: "Inside", value: "inside", icon: "ArrowInside16" },
@@ -1688,24 +1691,24 @@ function registerComponent$a(runtime) {
1688
1691
  defaultValue: "inside",
1689
1692
  hidden: props.showArrows === false
1690
1693
  })),
1691
- arrowColor: slot.ResponsiveColor((props) => ({
1694
+ arrowColor: richText.ResponsiveColor((props) => ({
1692
1695
  label: "Arrow color",
1693
1696
  placeholder: "black",
1694
1697
  hidden: props.showArrows === false
1695
1698
  })),
1696
- arrowBackground: slot.ResponsiveColor((props) => ({
1699
+ arrowBackground: richText.ResponsiveColor((props) => ({
1697
1700
  label: "Arrow background",
1698
1701
  placeholder: "white",
1699
1702
  hidden: props.showArrows === false
1700
1703
  })),
1701
- showDots: slot.Checkbox({ preset: true, label: "Show dots" }),
1702
- dotColor: slot.ResponsiveColor((props) => ({
1704
+ showDots: richText.Checkbox({ preset: true, label: "Show dots" }),
1705
+ dotColor: richText.ResponsiveColor((props) => ({
1703
1706
  label: "Dot color",
1704
1707
  placeholder: "black",
1705
1708
  hidden: props.showDots === false
1706
1709
  })),
1707
- slideBorder: slot.Border({ format: slot.Border.Format.ClassName }),
1708
- slideBorderRadius: slot.BorderRadius({ format: slot.BorderRadius.Format.ClassName })
1710
+ slideBorder: richText.Border({ format: richText.Border.Format.ClassName }),
1711
+ slideBorderRadius: richText.BorderRadius({ format: richText.BorderRadius.Format.ClassName })
1709
1712
  }
1710
1713
  });
1711
1714
  }
@@ -1717,11 +1720,11 @@ function registerComponent$9(runtime) {
1717
1720
  label: "Countdown",
1718
1721
  icon: "Countdown40",
1719
1722
  props: {
1720
- id: slot.ElementID(),
1721
- date: slot.Date(() => ({
1723
+ id: richText.ElementID(),
1724
+ date: richText.Date(() => ({
1722
1725
  preset: new Date(Date.now() + 1e3 * 60 * 60 * 24 * 2).toISOString()
1723
1726
  })),
1724
- variant: slot.ResponsiveIconRadioGroup({
1727
+ variant: richText.ResponsiveIconRadioGroup({
1725
1728
  label: "Style",
1726
1729
  options: [
1727
1730
  { label: "Filled", value: "filled", icon: "CountdownSolid16" },
@@ -1740,7 +1743,7 @@ function registerComponent$9(runtime) {
1740
1743
  ],
1741
1744
  defaultValue: "filled"
1742
1745
  }),
1743
- shape: slot.ResponsiveIconRadioGroup({
1746
+ shape: richText.ResponsiveIconRadioGroup({
1744
1747
  label: "Shape",
1745
1748
  options: [
1746
1749
  { label: "Pill", value: "pill", icon: "ButtonPill16" },
@@ -1749,7 +1752,7 @@ function registerComponent$9(runtime) {
1749
1752
  ],
1750
1753
  defaultValue: "rounded"
1751
1754
  }),
1752
- size: slot.ResponsiveIconRadioGroup({
1755
+ size: richText.ResponsiveIconRadioGroup({
1753
1756
  label: "Size",
1754
1757
  options: [
1755
1758
  { label: "Small", value: "small", icon: "SizeSmall16" },
@@ -1758,7 +1761,7 @@ function registerComponent$9(runtime) {
1758
1761
  ],
1759
1762
  defaultValue: "medium"
1760
1763
  }),
1761
- gap: slot.GapX({
1764
+ gap: richText.GapX({
1762
1765
  preset: [{ deviceId: "desktop", value: { value: 10, unit: "px" } }],
1763
1766
  label: "Gap",
1764
1767
  step: 1,
@@ -1766,32 +1769,32 @@ function registerComponent$9(runtime) {
1766
1769
  max: 100,
1767
1770
  defaultValue: { value: 0, unit: "px" }
1768
1771
  }),
1769
- numberFont: slot.Font({ label: "Number font" }),
1770
- numberColor: slot.ResponsiveColor({
1772
+ numberFont: richText.Font({ label: "Number font" }),
1773
+ numberColor: richText.ResponsiveColor({
1771
1774
  label: "Number color",
1772
1775
  placeholder: "white"
1773
1776
  }),
1774
- blockColor: slot.ResponsiveColor({
1777
+ blockColor: richText.ResponsiveColor({
1775
1778
  label: "Block color",
1776
1779
  placeholder: "black"
1777
1780
  }),
1778
- labelFont: slot.Font({ label: "Label font" }),
1779
- labelColor: slot.ResponsiveColor({
1781
+ labelFont: richText.Font({ label: "Label font" }),
1782
+ labelColor: richText.ResponsiveColor({
1780
1783
  label: "Label color",
1781
1784
  placeholder: "black"
1782
1785
  }),
1783
- width: slot.Width({
1784
- format: slot.Width.Format.ClassName,
1786
+ width: richText.Width({
1787
+ format: richText.Width.Format.ClassName,
1785
1788
  defaultValue: { value: 560, unit: "px" }
1786
1789
  }),
1787
- margin: slot.Margin({ format: slot.Margin.Format.ClassName }),
1788
- daysLabel: slot.TextInput({ label: "Days label", placeholder: "Days" }),
1789
- hoursLabel: slot.TextInput({ label: "Hours label", placeholder: "Hours" }),
1790
- minutesLabel: slot.TextInput({
1790
+ margin: richText.Margin({ format: richText.Margin.Format.ClassName }),
1791
+ daysLabel: richText.TextInput({ label: "Days label", placeholder: "Days" }),
1792
+ hoursLabel: richText.TextInput({ label: "Hours label", placeholder: "Hours" }),
1793
+ minutesLabel: richText.TextInput({
1791
1794
  label: "Minutes label",
1792
1795
  placeholder: "Minutes"
1793
1796
  }),
1794
- secondsLabel: slot.TextInput({
1797
+ secondsLabel: richText.TextInput({
1795
1798
  label: "Seconds label",
1796
1799
  placeholder: "Seconds"
1797
1800
  })
@@ -1806,8 +1809,8 @@ function registerComponent$8(runtime) {
1806
1809
  label: "Divider",
1807
1810
  icon: "Divider40",
1808
1811
  props: {
1809
- id: slot.ElementID(),
1810
- variant: slot.ResponsiveSelect({
1812
+ id: richText.ElementID(),
1813
+ variant: richText.ResponsiveSelect({
1811
1814
  label: "Style",
1812
1815
  labelOrientation: "horizontal",
1813
1816
  options: [
@@ -1818,17 +1821,17 @@ function registerComponent$8(runtime) {
1818
1821
  ],
1819
1822
  defaultValue: "solid"
1820
1823
  }),
1821
- thickness: slot.ResponsiveLength({
1824
+ thickness: richText.ResponsiveLength({
1822
1825
  label: "Height",
1823
1826
  defaultValue: { value: 1, unit: "px" },
1824
1827
  options: [{ value: "px", label: "Pixels", icon: "Px16" }]
1825
1828
  }),
1826
- color: slot.ResponsiveColor({ placeholder: "black" }),
1827
- width: slot.Width({
1828
- format: slot.Width.Format.ClassName,
1829
+ color: richText.ResponsiveColor({ placeholder: "black" }),
1830
+ width: richText.Width({
1831
+ format: richText.Width.Format.ClassName,
1829
1832
  defaultValue: { value: 100, unit: "%" }
1830
1833
  }),
1831
- margin: slot.Margin({ format: slot.Margin.Format.ClassName })
1834
+ margin: richText.Margin({ format: richText.Margin.Format.ClassName })
1832
1835
  }
1833
1836
  });
1834
1837
  }
@@ -1840,10 +1843,10 @@ function registerComponent$7(runtime) {
1840
1843
  label: "Embed",
1841
1844
  icon: "Code40",
1842
1845
  props: {
1843
- id: slot.ElementID(),
1844
- html: slot.TextArea({ label: "Code", rows: 20 }),
1845
- width: slot.Width({ format: slot.Width.Format.ClassName }),
1846
- margin: slot.Margin({ format: slot.Margin.Format.ClassName })
1846
+ id: richText.ElementID(),
1847
+ html: richText.TextArea({ label: "Code", rows: 20 }),
1848
+ width: richText.Width({ format: richText.Width.Format.ClassName }),
1849
+ margin: richText.Margin({ format: richText.Margin.Format.ClassName })
1847
1850
  }
1848
1851
  });
1849
1852
  }
@@ -1879,10 +1882,10 @@ function registerComponent$6(runtime) {
1879
1882
  label: "Form",
1880
1883
  icon: "Form40",
1881
1884
  props: {
1882
- id: slot.ElementID(),
1883
- tableId: slot.Table(),
1884
- fields: slot.TableFormFields(),
1885
- submitLink: slot.Link((props) => ({
1885
+ id: richText.ElementID(),
1886
+ tableId: richText.Table(),
1887
+ fields: richText.TableFormFields(),
1888
+ submitLink: richText.Link((props) => ({
1886
1889
  label: "Redirect to",
1887
1890
  options: [
1888
1891
  { value: "OPEN_PAGE", label: "Open page" },
@@ -1890,13 +1893,13 @@ function registerComponent$6(runtime) {
1890
1893
  ],
1891
1894
  hidden: props.tableId == null
1892
1895
  })),
1893
- gap: slot.GapY((props) => ({
1896
+ gap: richText.GapY((props) => ({
1894
1897
  preset: [{ deviceId: "desktop", value: { value: 10, unit: "px" } }],
1895
1898
  label: "Gap",
1896
1899
  defaultValue: { value: 0, unit: "px" },
1897
1900
  hidden: props.tableId == null
1898
1901
  })),
1899
- shape: slot.ResponsiveIconRadioGroup((props) => ({
1902
+ shape: richText.ResponsiveIconRadioGroup((props) => ({
1900
1903
  label: "Shape",
1901
1904
  options: [
1902
1905
  { label: "Pill", value: Shapes.PILL, icon: "ButtonPill16" },
@@ -1906,7 +1909,7 @@ function registerComponent$6(runtime) {
1906
1909
  defaultValue: Shapes.ROUNDED,
1907
1910
  hidden: props.tableId == null
1908
1911
  })),
1909
- size: slot.ResponsiveIconRadioGroup((props) => ({
1912
+ size: richText.ResponsiveIconRadioGroup((props) => ({
1910
1913
  label: "Size",
1911
1914
  options: [
1912
1915
  { label: "Small", value: Sizes.SMALL, icon: "SizeSmall16" },
@@ -1916,7 +1919,7 @@ function registerComponent$6(runtime) {
1916
1919
  defaultValue: Sizes.MEDIUM,
1917
1920
  hidden: (props == null ? void 0 : props.tableId) == null
1918
1921
  })),
1919
- contrast: slot.ResponsiveIconRadioGroup((props) => ({
1922
+ contrast: richText.ResponsiveIconRadioGroup((props) => ({
1920
1923
  label: "Color",
1921
1924
  options: [
1922
1925
  { label: "Light mode", value: Contrasts.LIGHT, icon: "Sun16" },
@@ -1925,8 +1928,8 @@ function registerComponent$6(runtime) {
1925
1928
  defaultValue: Contrasts.LIGHT,
1926
1929
  hidden: props.tableId == null
1927
1930
  })),
1928
- labelTextStyle: slot.TextStyle({ label: "Label text style" }),
1929
- labelTextColor: slot.ResponsiveColor((props, device) => {
1931
+ labelTextStyle: richText.TextStyle({ label: "Label text style" }),
1932
+ labelTextColor: richText.ResponsiveColor((props, device) => {
1930
1933
  const hidden = props.tableId == null;
1931
1934
  const responsiveContrast = props.contrast;
1932
1935
  const contrast = findDeviceOverride(responsiveContrast, device);
@@ -1936,23 +1939,23 @@ function registerComponent$6(runtime) {
1936
1939
  placeholder: (contrast == null ? void 0 : contrast.value) === Contrasts.DARK ? "rgba(255,255,255,0.95)" : "rgba(0,0,0,0.8)"
1937
1940
  };
1938
1941
  }),
1939
- submitTextStyle: slot.TextStyle({ label: "Button text style" }),
1940
- brandColor: slot.ResponsiveColor((props) => ({
1942
+ submitTextStyle: richText.TextStyle({ label: "Button text style" }),
1943
+ brandColor: richText.ResponsiveColor((props) => ({
1941
1944
  label: "Button color",
1942
1945
  placeholder: "black",
1943
1946
  hidden: props.tableId == null
1944
1947
  })),
1945
- submitTextColor: slot.ResponsiveColor((props) => ({
1948
+ submitTextColor: richText.ResponsiveColor((props) => ({
1946
1949
  label: "Button text color",
1947
1950
  placeholder: "white",
1948
1951
  hidden: props.tableId == null
1949
1952
  })),
1950
- submitLabel: slot.TextInput((props) => ({
1953
+ submitLabel: richText.TextInput((props) => ({
1951
1954
  label: "Button label",
1952
1955
  placeholder: "Submit",
1953
1956
  hidden: props.tableId == null
1954
1957
  })),
1955
- submitVariant: slot.ResponsiveSelect((props) => ({
1958
+ submitVariant: richText.ResponsiveSelect((props) => ({
1956
1959
  label: "Button style",
1957
1960
  options: [
1958
1961
  { value: "flat", label: "Flat" },
@@ -1966,11 +1969,11 @@ function registerComponent$6(runtime) {
1966
1969
  defaultValue: "flat",
1967
1970
  hidden: props.tableId == null
1968
1971
  })),
1969
- submitWidth: slot.ResponsiveLength((props) => ({
1972
+ submitWidth: richText.ResponsiveLength((props) => ({
1970
1973
  label: "Button width",
1971
1974
  hidden: props.tableId == null
1972
1975
  })),
1973
- submitAlignment: slot.ResponsiveIconRadioGroup((props) => ({
1976
+ submitAlignment: richText.ResponsiveIconRadioGroup((props) => ({
1974
1977
  label: "Button alignment",
1975
1978
  options: [
1976
1979
  { label: "Left", value: Alignments.LEFT, icon: "AlignLeft16" },
@@ -1980,12 +1983,12 @@ function registerComponent$6(runtime) {
1980
1983
  defaultValue: Alignments.CENTER,
1981
1984
  hidden: props.tableId == null
1982
1985
  })),
1983
- width: slot.Width({
1986
+ width: richText.Width({
1984
1987
  preset: [{ deviceId: "desktop", value: { value: 550, unit: "px" } }],
1985
1988
  defaultValue: { value: 100, unit: "%" },
1986
- format: slot.Width.Format.ClassName
1989
+ format: richText.Width.Format.ClassName
1987
1990
  }),
1988
- margin: slot.Margin({ format: slot.Margin.Format.ClassName })
1991
+ margin: richText.Margin({ format: richText.Margin.Format.ClassName })
1989
1992
  }
1990
1993
  });
1991
1994
  }
@@ -1996,17 +1999,17 @@ function registerComponent$5(runtime) {
1996
1999
  type: constants.MakeswiftComponentType.Image,
1997
2000
  label: "Image",
1998
2001
  props: {
1999
- id: slot.ElementID(),
2000
- file: slot.Image(),
2001
- altText: slot.TextInput({ label: "Alt text" }),
2002
- link: slot.Link({ label: "On click" }),
2003
- width: slot.Width(),
2004
- margin: slot.Margin({ format: slot.Margin.Format.ClassName }),
2005
- padding: slot.Padding({ format: slot.Padding.Format.ClassName }),
2006
- border: slot.Border({ format: slot.Border.Format.ClassName }),
2007
- borderRadius: slot.BorderRadius({ format: slot.BorderRadius.Format.ClassName }),
2008
- boxShadow: slot.Shadows({ format: slot.Shadows.Format.ClassName }),
2009
- opacity: slot.ResponsiveOpacity()
2002
+ id: richText.ElementID(),
2003
+ file: richText.Image(),
2004
+ altText: richText.TextInput({ label: "Alt text" }),
2005
+ link: richText.Link({ label: "On click" }),
2006
+ width: richText.Width(),
2007
+ margin: richText.Margin({ format: richText.Margin.Format.ClassName }),
2008
+ padding: richText.Padding({ format: richText.Padding.Format.ClassName }),
2009
+ border: richText.Border({ format: richText.Border.Format.ClassName }),
2010
+ borderRadius: richText.BorderRadius({ format: richText.BorderRadius.Format.ClassName }),
2011
+ boxShadow: richText.Shadows({ format: richText.Shadows.Format.ClassName }),
2012
+ opacity: richText.ResponsiveOpacity()
2010
2013
  }
2011
2014
  });
2012
2015
  }
@@ -2018,21 +2021,21 @@ function registerComponent$4(runtime) {
2018
2021
  label: "Navigation",
2019
2022
  icon: "Navigation40",
2020
2023
  props: {
2021
- id: slot.ElementID(),
2022
- links: slot.NavigationLinks(),
2023
- linkTextStyle: slot.TextStyle((props) => {
2024
+ id: richText.ElementID(),
2025
+ links: richText.NavigationLinks(),
2026
+ linkTextStyle: richText.TextStyle((props) => {
2024
2027
  const links = props.links;
2025
2028
  return {
2026
2029
  label: "Link text style",
2027
2030
  hidden: links == null || links.length === 0
2028
2031
  };
2029
2032
  }),
2030
- showLogo: slot.Checkbox({ preset: true, label: "Show logo" }),
2031
- logoFile: slot.Image((props) => ({
2033
+ showLogo: richText.Checkbox({ preset: true, label: "Show logo" }),
2034
+ logoFile: richText.Image((props) => ({
2032
2035
  label: "Logo",
2033
2036
  hidden: props.showLogo === false
2034
2037
  })),
2035
- logoWidth: slot.ResponsiveLength((props) => ({
2038
+ logoWidth: richText.ResponsiveLength((props) => ({
2036
2039
  preset: [{ deviceId: "desktop", value: { value: 100, unit: "px" } }],
2037
2040
  label: "Logo width",
2038
2041
  min: 0,
@@ -2040,15 +2043,15 @@ function registerComponent$4(runtime) {
2040
2043
  options: [{ value: "px", label: "Pixels", icon: "Px16" }],
2041
2044
  hidden: props.showLogo === false
2042
2045
  })),
2043
- logoAltText: slot.TextInput((props) => ({
2046
+ logoAltText: richText.TextInput((props) => ({
2044
2047
  label: "Logo alt text",
2045
2048
  hidden: props.showLogo === false
2046
2049
  })),
2047
- logoLink: slot.Link((props) => ({
2050
+ logoLink: richText.Link((props) => ({
2048
2051
  label: "Logo on click",
2049
2052
  hidden: props.showLogo === false
2050
2053
  })),
2051
- alignment: slot.ResponsiveIconRadioGroup({
2054
+ alignment: richText.ResponsiveIconRadioGroup({
2052
2055
  label: "Alignment",
2053
2056
  options: [
2054
2057
  { label: "Left", value: "flex-start", icon: "AlignLeft16" },
@@ -2057,7 +2060,7 @@ function registerComponent$4(runtime) {
2057
2060
  ],
2058
2061
  defaultValue: "flex-end"
2059
2062
  }),
2060
- gutter: slot.GapX({
2063
+ gutter: richText.GapX({
2061
2064
  preset: [{ deviceId: "desktop", value: { value: 10, unit: "px" } }],
2062
2065
  label: "Link gap",
2063
2066
  min: 0,
@@ -2065,14 +2068,14 @@ function registerComponent$4(runtime) {
2065
2068
  step: 1,
2066
2069
  defaultValue: { value: 0, unit: "px" }
2067
2070
  }),
2068
- mobileMenuAnimation: slot.ResponsiveSelect({
2071
+ mobileMenuAnimation: richText.ResponsiveSelect({
2069
2072
  label: "Mobile menu",
2070
2073
  options: [
2071
2074
  { value: "coverRight", label: "Cover from right" },
2072
2075
  { value: "coverLeft", label: "Cover from left" }
2073
2076
  ]
2074
2077
  }),
2075
- mobileMenuOpenIconColor: slot.ResponsiveColor((props, device) => {
2078
+ mobileMenuOpenIconColor: richText.ResponsiveColor((props, device) => {
2076
2079
  const mobileMenuAnimation = props.mobileMenuAnimation;
2077
2080
  const hidden = !findDeviceOverride(mobileMenuAnimation, device);
2078
2081
  return {
@@ -2081,7 +2084,7 @@ function registerComponent$4(runtime) {
2081
2084
  hidden
2082
2085
  };
2083
2086
  }),
2084
- mobileMenuCloseIconColor: slot.ResponsiveColor((props, device) => {
2087
+ mobileMenuCloseIconColor: richText.ResponsiveColor((props, device) => {
2085
2088
  const mobileMenuAnimation = props.mobileMenuAnimation;
2086
2089
  const hidden = !findDeviceOverride(mobileMenuAnimation, device);
2087
2090
  return {
@@ -2090,7 +2093,7 @@ function registerComponent$4(runtime) {
2090
2093
  hidden
2091
2094
  };
2092
2095
  }),
2093
- mobileMenuBackgroundColor: slot.ResponsiveColor((props, device) => {
2096
+ mobileMenuBackgroundColor: richText.ResponsiveColor((props, device) => {
2094
2097
  const mobileMenuAnimation = props.mobileMenuAnimation;
2095
2098
  const hidden = !findDeviceOverride(mobileMenuAnimation, device);
2096
2099
  return {
@@ -2099,11 +2102,11 @@ function registerComponent$4(runtime) {
2099
2102
  hidden
2100
2103
  };
2101
2104
  }),
2102
- width: slot.Width({
2103
- format: slot.Width.Format.ClassName,
2105
+ width: richText.Width({
2106
+ format: richText.Width.Format.ClassName,
2104
2107
  defaultValue: { value: 100, unit: "%" }
2105
2108
  }),
2106
- margin: slot.Margin({ format: slot.Margin.Format.ClassName })
2109
+ margin: richText.Margin({ format: richText.Margin.Format.ClassName })
2107
2110
  }
2108
2111
  });
2109
2112
  }
@@ -2115,10 +2118,10 @@ function registerComponent$3(runtime) {
2115
2118
  label: "Page",
2116
2119
  hidden: true,
2117
2120
  props: {
2118
- children: slot.Grid(),
2119
- backgrounds: slot.Backgrounds(),
2120
- rowGap: slot.GapY(),
2121
- columnGap: slot.GapX()
2121
+ children: richText.Grid(),
2122
+ backgrounds: richText.Backgrounds(),
2123
+ rowGap: richText.GapY(),
2124
+ columnGap: richText.GapX()
2122
2125
  }
2123
2126
  });
2124
2127
  }
@@ -2130,8 +2133,8 @@ function registerComponent$2(runtime) {
2130
2133
  label: "Social Links",
2131
2134
  icon: "SocialLinks40",
2132
2135
  props: {
2133
- id: slot.ElementID(),
2134
- links: slot.SocialLinks({
2136
+ id: richText.ElementID(),
2137
+ links: richText.SocialLinks({
2135
2138
  preset: {
2136
2139
  links: [
2137
2140
  {
@@ -2150,7 +2153,7 @@ function registerComponent$2(runtime) {
2150
2153
  openInNewTab: false
2151
2154
  }
2152
2155
  }),
2153
- shape: slot.ResponsiveIconRadioGroup((props) => {
2156
+ shape: richText.ResponsiveIconRadioGroup((props) => {
2154
2157
  const links = props.links;
2155
2158
  return {
2156
2159
  label: "Shape",
@@ -2164,7 +2167,7 @@ function registerComponent$2(runtime) {
2164
2167
  hidden: links == null || links.links.length === 0
2165
2168
  };
2166
2169
  }),
2167
- size: slot.ResponsiveIconRadioGroup((props) => {
2170
+ size: richText.ResponsiveIconRadioGroup((props) => {
2168
2171
  const links = props.links;
2169
2172
  return {
2170
2173
  label: "Size",
@@ -2177,7 +2180,7 @@ function registerComponent$2(runtime) {
2177
2180
  hidden: links == null || links.links.length === 0
2178
2181
  };
2179
2182
  }),
2180
- hoverStyle: slot.ResponsiveSelect((props) => {
2183
+ hoverStyle: richText.ResponsiveSelect((props) => {
2181
2184
  const links = props.links;
2182
2185
  const hidden = links == null || links.links.length === 0;
2183
2186
  return {
@@ -2193,7 +2196,7 @@ function registerComponent$2(runtime) {
2193
2196
  hidden
2194
2197
  };
2195
2198
  }),
2196
- fill: slot.ResponsiveColor((props) => {
2199
+ fill: richText.ResponsiveColor((props) => {
2197
2200
  const links = props.links;
2198
2201
  const hidden = links == null || links.links.length === 0;
2199
2202
  return {
@@ -2201,7 +2204,7 @@ function registerComponent$2(runtime) {
2201
2204
  hidden
2202
2205
  };
2203
2206
  }),
2204
- backgroundColor: slot.ResponsiveColor((props) => {
2207
+ backgroundColor: richText.ResponsiveColor((props) => {
2205
2208
  const links = props.links;
2206
2209
  const hidden = links == null || links.links.length === 0;
2207
2210
  return {
@@ -2209,7 +2212,7 @@ function registerComponent$2(runtime) {
2209
2212
  hidden
2210
2213
  };
2211
2214
  }),
2212
- alignment: slot.ResponsiveIconRadioGroup({
2215
+ alignment: richText.ResponsiveIconRadioGroup({
2213
2216
  label: "Alignment",
2214
2217
  options: [
2215
2218
  { label: "flex-start", value: "flex-start", icon: "AlignLeft16" },
@@ -2218,7 +2221,7 @@ function registerComponent$2(runtime) {
2218
2221
  ],
2219
2222
  defaultValue: "center"
2220
2223
  }),
2221
- gutter: slot.GapX({
2224
+ gutter: richText.GapX({
2222
2225
  preset: [{ deviceId: "desktop", value: { value: 10, unit: "px" } }],
2223
2226
  label: "Link gap",
2224
2227
  min: 0,
@@ -2226,12 +2229,12 @@ function registerComponent$2(runtime) {
2226
2229
  step: 1,
2227
2230
  defaultValue: { value: 0, unit: "px" }
2228
2231
  }),
2229
- width: slot.Width({
2230
- format: slot.Width.Format.ClassName,
2232
+ width: richText.Width({
2233
+ format: richText.Width.Format.ClassName,
2231
2234
  defaultValue: { value: 100, unit: "%" }
2232
2235
  }),
2233
- margin: slot.Margin({
2234
- format: slot.Margin.Format.ClassName,
2236
+ margin: richText.Margin({
2237
+ format: richText.Margin.Format.ClassName,
2235
2238
  preset: [
2236
2239
  {
2237
2240
  deviceId: "desktop",
@@ -2254,8 +2257,8 @@ function registerComponent$1(runtime) {
2254
2257
  type: constants.MakeswiftComponentType.Text,
2255
2258
  label: "Text",
2256
2259
  props: {
2257
- id: slot.ElementID(),
2258
- text: slot.RichText(() => ({
2260
+ id: richText.ElementID(),
2261
+ text: richText.RichText(() => ({
2259
2262
  preset: {
2260
2263
  document: {
2261
2264
  nodes: [
@@ -2298,13 +2301,13 @@ function registerComponent$1(runtime) {
2298
2301
  }
2299
2302
  }
2300
2303
  })),
2301
- width: slot.Width({
2302
- format: slot.Width.Format.ClassName,
2304
+ width: richText.Width({
2305
+ format: richText.Width.Format.ClassName,
2303
2306
  preset: [{ deviceId: "desktop", value: { value: 700, unit: "px" } }],
2304
2307
  defaultValue: { value: 100, unit: "%" }
2305
2308
  }),
2306
- margin: slot.Margin({
2307
- format: slot.Margin.Format.ClassName,
2309
+ margin: richText.Margin({
2310
+ format: richText.Margin.Format.ClassName,
2308
2311
  preset: [
2309
2312
  {
2310
2313
  deviceId: "desktop",
@@ -2328,14 +2331,14 @@ function registerComponent(runtime) {
2328
2331
  label: "Video",
2329
2332
  icon: "Video40",
2330
2333
  props: {
2331
- id: slot.ElementID(),
2332
- video: slot.Video({ preset: { controls: true } }),
2333
- width: slot.Width({
2334
- format: slot.Width.Format.ClassName,
2334
+ id: richText.ElementID(),
2335
+ video: richText.Video({ preset: { controls: true } }),
2336
+ width: richText.Width({
2337
+ format: richText.Width.Format.ClassName,
2335
2338
  defaultValue: { value: 560, unit: "px" }
2336
2339
  }),
2337
- margin: slot.Margin({ format: slot.Margin.Format.ClassName }),
2338
- borderRadius: slot.BorderRadius({ format: slot.BorderRadius.Format.ClassName })
2340
+ margin: richText.Margin({ format: richText.Margin.Format.ClassName }),
2341
+ borderRadius: richText.BorderRadius({ format: richText.BorderRadius.Format.ClassName })
2339
2342
  }
2340
2343
  });
2341
2344
  }
@@ -2851,7 +2854,7 @@ const defaultPadding = {
2851
2854
  };
2852
2855
  function useStyleControlCssObject(style, controlDefinition) {
2853
2856
  const { properties } = controlDefinition.config;
2854
- return __spreadValues(__spreadValues({}, properties.includes(slot.StyleControlProperty.Width) && {
2857
+ return __spreadValues(__spreadValues({}, properties.includes(richText.StyleControlProperty.Width) && {
2855
2858
  maxWidth: "100%"
2856
2859
  }), responsiveStyle([
2857
2860
  style == null ? void 0 : style.width,
@@ -2862,19 +2865,19 @@ function useStyleControlCssObject(style, controlDefinition) {
2862
2865
  style == null ? void 0 : style.textStyle
2863
2866
  ], ([width, margin, padding, border, borderRadius, textStyle]) => {
2864
2867
  var _a, _b, _c2, _d, _e, _f, _g, _h, _i, _j, _k;
2865
- return __spreadValues(__spreadValues(__spreadValues(__spreadValues(__spreadValues(__spreadValues({}, properties.includes(slot.StyleControlProperty.Width) && {
2868
+ return __spreadValues(__spreadValues(__spreadValues(__spreadValues(__spreadValues(__spreadValues({}, properties.includes(richText.StyleControlProperty.Width) && {
2866
2869
  width: (_a = widthToString(width)) != null ? _a : "100%"
2867
- }), properties.includes(slot.StyleControlProperty.Margin) && marginPropertyDataToStyle(margin != null ? margin : defaultMargin, defaultMargin)), properties.includes(slot.StyleControlProperty.Padding) && paddingPropertyDataToStyle(padding != null ? padding : defaultPadding, defaultPadding)), properties.includes(slot.StyleControlProperty.Border) && {
2870
+ }), properties.includes(richText.StyleControlProperty.Margin) && marginPropertyDataToStyle(margin != null ? margin : defaultMargin, defaultMargin)), properties.includes(richText.StyleControlProperty.Padding) && paddingPropertyDataToStyle(padding != null ? padding : defaultPadding, defaultPadding)), properties.includes(richText.StyleControlProperty.Border) && {
2868
2871
  borderTop: (_b = borderSideToString2(border == null ? void 0 : border.borderTop)) != null ? _b : "0 solid black",
2869
2872
  borderRight: (_c2 = borderSideToString2(border == null ? void 0 : border.borderRight)) != null ? _c2 : "0 solid black",
2870
2873
  borderBottom: (_d = borderSideToString2(border == null ? void 0 : border.borderBottom)) != null ? _d : "0 solid black",
2871
2874
  borderLeft: (_e = borderSideToString2(border == null ? void 0 : border.borderLeft)) != null ? _e : "0 solid black"
2872
- }), properties.includes(slot.StyleControlProperty.BorderRadius) && {
2875
+ }), properties.includes(richText.StyleControlProperty.BorderRadius) && {
2873
2876
  borderTopLeftRadius: (_f = borderRadiusToString(borderRadius == null ? void 0 : borderRadius.borderTopLeftRadius)) != null ? _f : 0,
2874
2877
  borderTopRightRadius: (_g = borderRadiusToString(borderRadius == null ? void 0 : borderRadius.borderTopRightRadius)) != null ? _g : 0,
2875
2878
  borderBottomRightRadius: (_h = borderRadiusToString(borderRadius == null ? void 0 : borderRadius.borderBottomRightRadius)) != null ? _h : 0,
2876
2879
  borderBottomLeftRadius: (_i = borderRadiusToString(borderRadius == null ? void 0 : borderRadius.borderBottomLeftRadius)) != null ? _i : 0
2877
- }), properties.includes(slot.StyleControlProperty.TextStyle) && __spreadProps(__spreadValues(__spreadValues(__spreadValues(__spreadValues({}, (textStyle == null ? void 0 : textStyle.fontFamily) && { fontFamily: textStyle.fontFamily }), (textStyle == null ? void 0 : textStyle.letterSpacing) && { letterSpacing: textStyle.letterSpacing }), (textStyle == null ? void 0 : textStyle.fontSize) && { fontSize: fontSizeToString(textStyle.fontSize) }), (textStyle == null ? void 0 : textStyle.fontWeight) && { fontWeight: textStyle.fontWeight }), {
2880
+ }), properties.includes(richText.StyleControlProperty.TextStyle) && __spreadProps(__spreadValues(__spreadValues(__spreadValues(__spreadValues({}, (textStyle == null ? void 0 : textStyle.fontFamily) && { fontFamily: textStyle.fontFamily }), (textStyle == null ? void 0 : textStyle.letterSpacing) && { letterSpacing: textStyle.letterSpacing }), (textStyle == null ? void 0 : textStyle.fontSize) && { fontSize: fontSizeToString(textStyle.fontSize) }), (textStyle == null ? void 0 : textStyle.fontWeight) && { fontWeight: textStyle.fontWeight }), {
2878
2881
  textTransform: (_j = textStyle == null ? void 0 : textStyle.textTransform) != null ? _j : [],
2879
2882
  fontStyle: (_k = textStyle == null ? void 0 : textStyle.fontStyle) != null ? _k : []
2880
2883
  }));
@@ -2937,10 +2940,10 @@ function useComboboxControlValue(data) {
2937
2940
  }
2938
2941
  function useImageControlValue(data, definition) {
2939
2942
  var _a;
2940
- const format = (_a = definition.config.format) != null ? _a : slot.ImageControlValueFormat.URL;
2943
+ const format = (_a = definition.config.format) != null ? _a : richText.ImageControlValueFormat.URL;
2941
2944
  const fileId = data != null ? data : null;
2942
2945
  const file = useFile(fileId);
2943
- if (format === slot.ImageControlValueFormat.URL) {
2946
+ if (format === richText.ImageControlValueFormat.URL) {
2944
2947
  return file == null ? void 0 : file.publicUrl;
2945
2948
  }
2946
2949
  if (file == null || file.dimensions == null)
@@ -3088,13 +3091,13 @@ function ControlValue({
3088
3091
  parameters: [data, definition],
3089
3092
  children: (value) => children(value)
3090
3093
  }, definition.type);
3091
- case slot.ColorControlType:
3094
+ case richText.ColorControlType:
3092
3095
  return /* @__PURE__ */ jsxRuntime.jsx(RenderHook, {
3093
3096
  hook: useColorValue,
3094
3097
  parameters: [data, definition],
3095
3098
  children: (value) => children(value)
3096
3099
  }, definition.type);
3097
- case slot.ImageControlType:
3100
+ case richText.ImageControlType:
3098
3101
  return /* @__PURE__ */ jsxRuntime.jsx(RenderHook, {
3099
3102
  hook: useImageControlValue,
3100
3103
  parameters: [data, definition],
@@ -3128,6 +3131,25 @@ function ControlValue({
3128
3131
  return children(data);
3129
3132
  }
3130
3133
  }
3134
+ function pollBoxModel({
3135
+ element,
3136
+ onBoxModelChange
3137
+ }) {
3138
+ let currentBoxModel = null;
3139
+ const handleAnimationFrameRequest = () => {
3140
+ const measuredBoxModel = boxModels.getBox(element);
3141
+ if (!deepEqual(currentBoxModel, measuredBoxModel)) {
3142
+ currentBoxModel = measuredBoxModel;
3143
+ onBoxModelChange(currentBoxModel);
3144
+ }
3145
+ animationFrameHandle = requestAnimationFrame(handleAnimationFrameRequest);
3146
+ };
3147
+ let animationFrameHandle = requestAnimationFrame(handleAnimationFrameRequest);
3148
+ return () => {
3149
+ cancelAnimationFrame(animationFrameHandle);
3150
+ onBoxModelChange(null);
3151
+ };
3152
+ }
3131
3153
  function useSlot(data, control2) {
3132
3154
  if (data == null || data.elements.length === 0) {
3133
3155
  return /* @__PURE__ */ jsxRuntime.jsx(Slot.Placeholder, {
@@ -3271,24 +3293,21 @@ function SlotPlaceholder({
3271
3293
  })
3272
3294
  });
3273
3295
  }
3274
- function pollBoxModel({
3275
- element,
3276
- onBoxModelChange
3277
- }) {
3278
- let currentBoxModel = null;
3279
- const handleAnimationFrameRequest = () => {
3280
- const measuredBoxModel = boxModels.getBox(element);
3281
- if (!deepEqual(currentBoxModel, measuredBoxModel)) {
3282
- currentBoxModel = measuredBoxModel;
3283
- onBoxModelChange(currentBoxModel);
3284
- }
3285
- animationFrameHandle = requestAnimationFrame(handleAnimationFrameRequest);
3286
- };
3287
- let animationFrameHandle = requestAnimationFrame(handleAnimationFrameRequest);
3288
- return () => {
3289
- cancelAnimationFrame(animationFrameHandle);
3290
- onBoxModelChange(null);
3291
- };
3296
+ const Text = forwardNextDynamicRef((patch) => dynamic__default["default"](() => patch(Promise.resolve().then(function() {
3297
+ return require("./index.cjs5.js");
3298
+ }))));
3299
+ function useRichText(data, control2) {
3300
+ const textCallbackRef = React.useCallback((handle) => {
3301
+ var _a;
3302
+ if (constants.isPropControllersHandle(handle))
3303
+ (_a = handle == null ? void 0 : handle.setPropControllers) == null ? void 0 : _a.call(handle, control2 == null ? null : {
3304
+ text: control2
3305
+ });
3306
+ }, [control2]);
3307
+ return /* @__PURE__ */ jsxRuntime.jsx(Text, {
3308
+ text: data,
3309
+ ref: textCallbackRef
3310
+ });
3292
3311
  }
3293
3312
  function useWidthStyle(value, descriptor) {
3294
3313
  return useStyle(responsiveWidth(value, descriptor.options.defaultValue));
@@ -3325,15 +3344,15 @@ function PropsValue({
3325
3344
  return constants.getPropControllers(state, documentKey, element.key);
3326
3345
  });
3327
3346
  return Object.entries(propControllerDescriptorsRef.current).reduceRight((renderFn, [propName, descriptor]) => (propsValue) => {
3328
- var _a2;
3347
+ var _a2, _b;
3329
3348
  switch (descriptor.type) {
3330
3349
  case textInput.CheckboxControlType:
3331
3350
  case textInput.NumberControlType:
3332
3351
  case textInput.TextInputControlType:
3333
3352
  case textInput.TextAreaControlType:
3334
3353
  case textInput.SelectControlType:
3335
- case slot.ColorControlType:
3336
- case slot.ImageControlType:
3354
+ case richText.ColorControlType:
3355
+ case richText.ImageControlType:
3337
3356
  case combobox.ComboboxControlType:
3338
3357
  case control.ShapeControlType:
3339
3358
  case control.ListControlType:
@@ -3345,7 +3364,7 @@ function PropsValue({
3345
3364
  [propName]: value
3346
3365
  }))
3347
3366
  });
3348
- case slot.StyleControlType:
3367
+ case richText.StyleControlType:
3349
3368
  return /* @__PURE__ */ jsxRuntime.jsx(RenderHook, {
3350
3369
  hook: useFormattedStyle,
3351
3370
  parameters: [props[propName], descriptor],
@@ -3353,8 +3372,17 @@ function PropsValue({
3353
3372
  [propName]: value
3354
3373
  }))
3355
3374
  }, descriptor.type);
3356
- case slot.SlotControlType: {
3357
- const control2 = (_a2 = propControllers == null ? void 0 : propControllers[propName]) != null ? _a2 : null;
3375
+ case richText.RichTextControlType:
3376
+ const control$1 = (_a2 = propControllers == null ? void 0 : propControllers[propName]) != null ? _a2 : null;
3377
+ return /* @__PURE__ */ jsxRuntime.jsx(RenderHook, {
3378
+ hook: useRichText,
3379
+ parameters: [props[propName], control$1],
3380
+ children: (value) => renderFn(__spreadProps(__spreadValues({}, propsValue), {
3381
+ [propName]: value
3382
+ }))
3383
+ }, descriptor.type);
3384
+ case richText.SlotControlType: {
3385
+ const control2 = (_b = propControllers == null ? void 0 : propControllers[propName]) != null ? _b : null;
3358
3386
  return /* @__PURE__ */ jsxRuntime.jsx(RenderHook, {
3359
3387
  hook: useSlot,
3360
3388
  parameters: [props[propName], control2],
@@ -3363,9 +3391,9 @@ function PropsValue({
3363
3391
  }))
3364
3392
  }, descriptor.type);
3365
3393
  }
3366
- case slot.Types.Width:
3394
+ case richText.Types.Width:
3367
3395
  switch (descriptor.options.format) {
3368
- case slot.WidthPropControllerFormat.ClassName:
3396
+ case richText.WidthPropControllerFormat.ClassName:
3369
3397
  return /* @__PURE__ */ jsxRuntime.jsx(RenderHook, {
3370
3398
  hook: useWidthStyle,
3371
3399
  parameters: [props[propName], descriptor],
@@ -3378,9 +3406,9 @@ function PropsValue({
3378
3406
  [propName]: props[propName]
3379
3407
  }));
3380
3408
  }
3381
- case slot.Types.Padding:
3409
+ case richText.Types.Padding:
3382
3410
  switch (descriptor.options.format) {
3383
- case slot.PaddingPropControllerFormat.ClassName:
3411
+ case richText.PaddingPropControllerFormat.ClassName:
3384
3412
  return /* @__PURE__ */ jsxRuntime.jsx(RenderHook, {
3385
3413
  hook: usePaddingStyle,
3386
3414
  parameters: [props[propName]],
@@ -3393,9 +3421,9 @@ function PropsValue({
3393
3421
  [propName]: props[propName]
3394
3422
  }));
3395
3423
  }
3396
- case slot.Types.Margin:
3424
+ case richText.Types.Margin:
3397
3425
  switch (descriptor.options.format) {
3398
- case slot.MarginPropControllerFormat.ClassName:
3426
+ case richText.MarginPropControllerFormat.ClassName:
3399
3427
  return /* @__PURE__ */ jsxRuntime.jsx(RenderHook, {
3400
3428
  hook: useMarginStyle,
3401
3429
  parameters: [props[propName]],
@@ -3408,9 +3436,9 @@ function PropsValue({
3408
3436
  [propName]: props[propName]
3409
3437
  }));
3410
3438
  }
3411
- case slot.Types.BorderRadius:
3439
+ case richText.Types.BorderRadius:
3412
3440
  switch (descriptor.options.format) {
3413
- case slot.BorderRadiusPropControllerFormat.ClassName:
3441
+ case richText.BorderRadiusPropControllerFormat.ClassName:
3414
3442
  return /* @__PURE__ */ jsxRuntime.jsx(RenderHook, {
3415
3443
  hook: useBorderRadiusStyle,
3416
3444
  parameters: [props[propName]],
@@ -3423,9 +3451,9 @@ function PropsValue({
3423
3451
  [propName]: props[propName]
3424
3452
  }));
3425
3453
  }
3426
- case slot.Types.Shadows:
3454
+ case richText.Types.Shadows:
3427
3455
  switch (descriptor.options.format) {
3428
- case slot.ShadowsPropControllerFormat.ClassName:
3456
+ case richText.ShadowsPropControllerFormat.ClassName:
3429
3457
  return /* @__PURE__ */ jsxRuntime.jsx(RenderHook, {
3430
3458
  hook: useShadowsStyle,
3431
3459
  parameters: [props[propName]],
@@ -3438,9 +3466,9 @@ function PropsValue({
3438
3466
  [propName]: props[propName]
3439
3467
  }));
3440
3468
  }
3441
- case slot.Types.Border:
3469
+ case richText.Types.Border:
3442
3470
  switch (descriptor.options.format) {
3443
- case slot.BorderPropControllerFormat.ClassName:
3471
+ case richText.BorderPropControllerFormat.ClassName:
3444
3472
  return /* @__PURE__ */ jsxRuntime.jsx(RenderHook, {
3445
3473
  hook: useBorderStyle,
3446
3474
  parameters: [props[propName]],
@@ -3453,7 +3481,7 @@ function PropsValue({
3453
3481
  [propName]: props[propName]
3454
3482
  }));
3455
3483
  }
3456
- case slot.Types.ResponsiveColor:
3484
+ case richText.Types.ResponsiveColor:
3457
3485
  return /* @__PURE__ */ jsxRuntime.jsx(RenderHook, {
3458
3486
  hook: useResponsiveColor,
3459
3487
  parameters: [props[propName]],
@@ -3778,6 +3806,7 @@ exports.forwardNextDynamicRef = forwardNextDynamicRef;
3778
3806
  exports.getServerSideProps = getServerSideProps;
3779
3807
  exports.getStaticPaths = getStaticPaths;
3780
3808
  exports.getStaticProps = getStaticProps;
3809
+ exports.pollBoxModel = pollBoxModel;
3781
3810
  exports.responsiveGridItem = responsiveGridItem;
3782
3811
  exports.responsiveStyle = responsiveStyle;
3783
3812
  exports.responsiveTextStyle = responsiveTextStyle;