@makeswift/runtime 0.6.2 → 0.6.4

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 (135) 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 +22 -4
  12. package/dist/EditableText.cjs.js.map +1 -1
  13. package/dist/EditableText.es.js +24 -6
  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 +55 -18
  28. package/dist/PreviewProvider.cjs.js.map +1 -1
  29. package/dist/PreviewProvider.es.js +55 -19
  30. package/dist/PreviewProvider.es.js.map +1 -1
  31. package/dist/ReadOnlyText.cjs.js +7 -4
  32. package/dist/ReadOnlyText.cjs.js.map +1 -1
  33. package/dist/ReadOnlyText.es.js +7 -4
  34. package/dist/ReadOnlyText.es.js.map +1 -1
  35. package/dist/Root.cjs.js +1 -1
  36. package/dist/Root.es.js +1 -1
  37. package/dist/SocialLinks.cjs.js +1 -1
  38. package/dist/SocialLinks.es.js +1 -1
  39. package/dist/Text.cjs.js +1 -1
  40. package/dist/Text.es.js +1 -1
  41. package/dist/Video.cjs.js +1 -1
  42. package/dist/Video.es.js +1 -1
  43. package/dist/actions.cjs.js +11 -1
  44. package/dist/actions.cjs.js.map +1 -1
  45. package/dist/actions.es.js +11 -2
  46. package/dist/actions.es.js.map +1 -1
  47. package/dist/builder.cjs.js +2 -1
  48. package/dist/builder.cjs.js.map +1 -1
  49. package/dist/builder.es.js +2 -1
  50. package/dist/builder.es.js.map +1 -1
  51. package/dist/components.cjs.js +1 -1
  52. package/dist/components.es.js +1 -1
  53. package/dist/constants.cjs.js +26 -21
  54. package/dist/constants.cjs.js.map +1 -1
  55. package/dist/constants.es.js +7 -3
  56. package/dist/constants.es.js.map +1 -1
  57. package/dist/control-serialization.cjs.js +37 -37
  58. package/dist/control-serialization.cjs.js.map +1 -1
  59. package/dist/control-serialization.es.js +1 -1
  60. package/dist/control.cjs.js +22 -22
  61. package/dist/control.cjs.js.map +1 -1
  62. package/dist/control.es.js +1 -1
  63. package/dist/controls.cjs.js +22 -17
  64. package/dist/controls.cjs.js.map +1 -1
  65. package/dist/controls.es.js +2 -1
  66. package/dist/controls.es.js.map +1 -1
  67. package/dist/index.cjs.js +279 -216
  68. package/dist/index.cjs.js.map +1 -1
  69. package/dist/index.cjs2.js +1 -1
  70. package/dist/index.cjs5.js +36 -139
  71. package/dist/index.cjs5.js.map +1 -1
  72. package/dist/index.cjs6.js +141 -0
  73. package/dist/index.cjs6.js.map +1 -0
  74. package/dist/index.es.js +92 -33
  75. package/dist/index.es.js.map +1 -1
  76. package/dist/index.es2.js +2 -2
  77. package/dist/index.es5.js +34 -138
  78. package/dist/index.es5.js.map +1 -1
  79. package/dist/index.es6.js +139 -0
  80. package/dist/index.es6.js.map +1 -0
  81. package/dist/main.cjs.js +2 -1
  82. package/dist/main.cjs.js.map +1 -1
  83. package/dist/main.es.js +2 -2
  84. package/dist/next.cjs.js +1 -1
  85. package/dist/next.es.js +2 -2
  86. package/dist/prop-controllers.cjs.js +5 -4
  87. package/dist/prop-controllers.cjs.js.map +1 -1
  88. package/dist/prop-controllers.es.js +2 -1
  89. package/dist/prop-controllers.es.js.map +1 -1
  90. package/dist/react.cjs.js +1 -1
  91. package/dist/react.es.js +1 -1
  92. package/dist/{slot.cjs.js → rich-text.cjs.js} +104 -12
  93. package/dist/rich-text.cjs.js.map +1 -0
  94. package/dist/{slot.es.js → rich-text.es.js} +98 -12
  95. package/dist/rich-text.es.js.map +1 -0
  96. package/dist/types/src/components/builtin/Image/Image.d.ts.map +1 -1
  97. package/dist/types/src/components/builtin/Text/EditableText.d.ts.map +1 -1
  98. package/dist/types/src/components/builtin/Text/ReadOnlyText.d.ts.map +1 -1
  99. package/dist/types/src/components/builtin/Text/register.d.ts.map +1 -1
  100. package/dist/types/src/controls/index.d.ts +1 -0
  101. package/dist/types/src/controls/index.d.ts.map +1 -1
  102. package/dist/types/src/controls/rich-text.d.ts +66 -0
  103. package/dist/types/src/controls/rich-text.d.ts.map +1 -0
  104. package/dist/types/src/controls/style.d.ts +16 -4
  105. package/dist/types/src/controls/style.d.ts.map +1 -1
  106. package/dist/types/src/index.d.ts +1 -1
  107. package/dist/types/src/index.d.ts.map +1 -1
  108. package/dist/types/src/next/api-handler.d.ts +1 -0
  109. package/dist/types/src/next/api-handler.d.ts.map +1 -1
  110. package/dist/types/src/next/preview-mode.d.ts.map +1 -1
  111. package/dist/types/src/prop-controllers/descriptors.d.ts +4 -2
  112. package/dist/types/src/prop-controllers/descriptors.d.ts.map +1 -1
  113. package/dist/types/src/prop-controllers/instances.d.ts +14 -4
  114. package/dist/types/src/prop-controllers/instances.d.ts.map +1 -1
  115. package/dist/types/src/runtimes/react/controls/rich-text.d.ts +8 -0
  116. package/dist/types/src/runtimes/react/controls/rich-text.d.ts.map +1 -0
  117. package/dist/types/src/runtimes/react/controls/slot.d.ts.map +1 -1
  118. package/dist/types/src/runtimes/react/controls.d.ts.map +1 -1
  119. package/dist/types/src/runtimes/react/index.d.ts +2 -0
  120. package/dist/types/src/runtimes/react/index.d.ts.map +1 -1
  121. package/dist/types/src/runtimes/react/poll-box-model.d.ts +6 -0
  122. package/dist/types/src/runtimes/react/poll-box-model.d.ts.map +1 -0
  123. package/dist/types/src/state/actions.d.ts +12 -1
  124. package/dist/types/src/state/actions.d.ts.map +1 -1
  125. package/dist/types/src/state/modules/builder-edit-mode.d.ts +11 -0
  126. package/dist/types/src/state/modules/builder-edit-mode.d.ts.map +1 -0
  127. package/dist/types/src/state/react-builder-preview.d.ts +2 -0
  128. package/dist/types/src/state/react-builder-preview.d.ts.map +1 -1
  129. package/dist/types/src/state/react-page.d.ts +3 -0
  130. package/dist/types/src/state/react-page.d.ts.map +1 -1
  131. package/package.json +1 -1
  132. package/dist/slot.cjs.js.map +0 -1
  133. package/dist/slot.es.js.map +0 -1
  134. package/dist/types/src/utils/constants.d.ts +0 -6
  135. package/dist/types/src/utils/constants.d.ts.map +0 -1
@@ -22,6 +22,23 @@ var __publicField = (obj, key, value) => {
22
22
  __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
23
23
  return value;
24
24
  };
25
+ var actions = require("./actions.cjs.js");
26
+ const BuilderEditMode = {
27
+ BUILD: "build",
28
+ CONTENT: "content",
29
+ INTERACT: "interact"
30
+ };
31
+ function getInitialState() {
32
+ return null;
33
+ }
34
+ function reducer(state = getInitialState(), action) {
35
+ switch (action.type) {
36
+ case actions.ActionTypes.SET_BUILDER_EDIT_MODE:
37
+ return action.payload.editMode;
38
+ default:
39
+ return state;
40
+ }
41
+ }
25
42
  const ColorControlType = "makeswift::controls::color";
26
43
  function Color(config = {}) {
27
44
  return { type: ColorControlType, config };
@@ -230,7 +247,7 @@ function ResponsiveOpacity(options = {}) {
230
247
  function ResponsiveSelect(options) {
231
248
  return { type: Types.ResponsiveSelect, options };
232
249
  }
233
- function RichText(options = {}) {
250
+ function RichText$1(options = {}) {
234
251
  return { type: Types.RichText, options };
235
252
  }
236
253
  const ShadowsPropControllerFormat = {
@@ -307,7 +324,7 @@ var descriptors = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.definePro
307
324
  ResponsiveNumber,
308
325
  ResponsiveOpacity,
309
326
  ResponsiveSelect,
310
- RichText,
327
+ RichText: RichText$1,
311
328
  ShadowsPropControllerFormat,
312
329
  Shadows,
313
330
  Shape,
@@ -337,10 +354,6 @@ function copyImageData(value, context) {
337
354
  return value;
338
355
  return (_a = context.replacementContext.fileIds.get(value)) != null ? _a : value;
339
356
  }
340
- const BuilderEditMode = {
341
- BUILD: "build",
342
- CONTENT: "content"
343
- };
344
357
  const RichTextPropControllerMessageType = {
345
358
  CHANGE_BUILDER_EDIT_MODE: "CHANGE_BUILDER_EDIT_MODE",
346
359
  INITIALIZE_EDITOR: "INITIALIZE_EDITOR",
@@ -348,7 +361,8 @@ const RichTextPropControllerMessageType = {
348
361
  FOCUS: "FOCUS",
349
362
  BLUR: "BLUR",
350
363
  UNDO: "UNDO",
351
- REDO: "REDO"
364
+ REDO: "REDO",
365
+ CHANGE_BOX_MODEL: "CHANGE_BOX_MODEL"
352
366
  };
353
367
  class PropController {
354
368
  constructor(send) {
@@ -371,14 +385,16 @@ class RichTextPropController extends PropController {
371
385
  case RichTextPropControllerMessageType.CHANGE_BUILDER_EDIT_MODE: {
372
386
  switch (message.editMode) {
373
387
  case BuilderEditMode.BUILD:
388
+ case BuilderEditMode.INTERACT:
374
389
  (_a = this.editor) == null ? void 0 : _a.deselect().blur();
375
390
  break;
376
- case BuilderEditMode.CONTENT:
377
- (_b = this.editor) == null ? void 0 : _b.focus().moveToRangeOfDocument();
378
- break;
379
391
  }
380
392
  break;
381
393
  }
394
+ case RichTextPropControllerMessageType.FOCUS: {
395
+ (_b = this.editor) == null ? void 0 : _b.focus().moveToRangeOfDocument();
396
+ break;
397
+ }
382
398
  }
383
399
  }
384
400
  setSlateEditor(editor) {
@@ -406,6 +422,9 @@ class RichTextPropController extends PropController {
406
422
  redo() {
407
423
  this.send({ type: RichTextPropControllerMessageType.REDO });
408
424
  }
425
+ changeBoxModel(boxModel) {
426
+ this.send({ type: RichTextPropControllerMessageType.CHANGE_BOX_MODEL, payload: { boxModel } });
427
+ }
409
428
  }
410
429
  const TableFormFieldsMessageType = {
411
430
  TABLE_FORM_LAYOUT_CHANGE: "TABLE_FORM_LAYOUT_CHANGE",
@@ -429,6 +448,8 @@ function createPropController(descriptor, send) {
429
448
  return new TableFormFieldsPropController(send);
430
449
  case SlotControlType:
431
450
  return new SlotControl(send);
451
+ case RichTextControlType:
452
+ return new RichTextControl(send);
432
453
  default:
433
454
  return new DefaultPropController(send);
434
455
  }
@@ -458,11 +479,77 @@ function copySlotData(value, context) {
458
479
  elements: value.elements.map((element) => context.copyElement(element))
459
480
  });
460
481
  }
482
+ const RichTextControlType = "makeswift::controls::rich-text";
483
+ function RichText() {
484
+ return { type: RichTextControlType };
485
+ }
486
+ const RichTextControlMessageType = {
487
+ CHANGE_BUILDER_EDIT_MODE: "CHANGE_BUILDER_EDIT_MODE",
488
+ INITIALIZE_EDITOR: "INITIALIZE_EDITOR",
489
+ CHANGE_EDITOR_VALUE: "CHANGE_EDITOR_VALUE",
490
+ FOCUS: "FOCUS",
491
+ BLUR: "BLUR",
492
+ UNDO: "UNDO",
493
+ REDO: "REDO",
494
+ CHANGE_BOX_MODEL: "CHANGE_BOX_MODEL"
495
+ };
496
+ class RichTextControl extends PropController {
497
+ constructor() {
498
+ super(...arguments);
499
+ __publicField(this, "editor", null);
500
+ }
501
+ recv(message) {
502
+ var _a, _b;
503
+ switch (message.type) {
504
+ case RichTextControlMessageType.CHANGE_BUILDER_EDIT_MODE: {
505
+ switch (message.editMode) {
506
+ case BuilderEditMode.BUILD:
507
+ (_a = this.editor) == null ? void 0 : _a.deselect().blur();
508
+ break;
509
+ }
510
+ break;
511
+ }
512
+ case RichTextControlMessageType.FOCUS: {
513
+ (_b = this.editor) == null ? void 0 : _b.focus().moveToRangeOfDocument();
514
+ break;
515
+ }
516
+ }
517
+ }
518
+ setSlateEditor(editor) {
519
+ this.editor = editor;
520
+ this.send({
521
+ type: RichTextControlMessageType.INITIALIZE_EDITOR,
522
+ value: editor.value.toJSON({ preserveSelection: false })
523
+ });
524
+ }
525
+ onChange(change) {
526
+ this.send({
527
+ type: RichTextControlMessageType.CHANGE_EDITOR_VALUE,
528
+ value: change.value.toJSON({ preserveSelection: true })
529
+ });
530
+ }
531
+ focus() {
532
+ this.send({ type: RichTextControlMessageType.FOCUS });
533
+ }
534
+ blur() {
535
+ this.send({ type: RichTextControlMessageType.BLUR });
536
+ }
537
+ undo() {
538
+ this.send({ type: RichTextControlMessageType.UNDO });
539
+ }
540
+ redo() {
541
+ this.send({ type: RichTextControlMessageType.REDO });
542
+ }
543
+ changeBoxModel(boxModel) {
544
+ this.send({ type: RichTextControlMessageType.CHANGE_BOX_MODEL, payload: { boxModel } });
545
+ }
546
+ }
461
547
  exports.Backgrounds = Backgrounds;
462
548
  exports.Border = Border;
463
549
  exports.BorderPropControllerFormat = BorderPropControllerFormat;
464
550
  exports.BorderRadius = BorderRadius;
465
551
  exports.BorderRadiusPropControllerFormat = BorderRadiusPropControllerFormat;
552
+ exports.BuilderEditMode = BuilderEditMode;
466
553
  exports.Checkbox = Checkbox;
467
554
  exports.Color = Color;
468
555
  exports.ColorControlType = ColorControlType;
@@ -490,7 +577,11 @@ exports.ResponsiveLength = ResponsiveLength;
490
577
  exports.ResponsiveNumber = ResponsiveNumber;
491
578
  exports.ResponsiveOpacity = ResponsiveOpacity;
492
579
  exports.ResponsiveSelect = ResponsiveSelect;
493
- exports.RichText = RichText;
580
+ exports.RichText = RichText$1;
581
+ exports.RichText$1 = RichText;
582
+ exports.RichTextControl = RichTextControl;
583
+ exports.RichTextControlMessageType = RichTextControlMessageType;
584
+ exports.RichTextControlType = RichTextControlType;
494
585
  exports.RichTextPropControllerMessageType = RichTextPropControllerMessageType;
495
586
  exports.Shadows = Shadows;
496
587
  exports.ShadowsPropControllerFormat = ShadowsPropControllerFormat;
@@ -518,4 +609,5 @@ exports.copySlotData = copySlotData;
518
609
  exports.copyStyleData = copyStyleData;
519
610
  exports.createPropController = createPropController;
520
611
  exports.descriptors = descriptors;
521
- //# sourceMappingURL=slot.cjs.js.map
612
+ exports.reducer = reducer;
613
+ //# sourceMappingURL=rich-text.cjs.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"rich-text.cjs.js","sources":["../src/state/modules/builder-edit-mode.ts","../src/controls/color.ts","../src/controls/style.ts","../src/prop-controllers/descriptors.ts","../src/controls/image.ts","../src/prop-controllers/instances.ts","../src/controls/slot.ts","../src/controls/rich-text.ts"],"sourcesContent":["import { Action, ActionTypes } from '../actions'\n\nexport const BuilderEditMode = {\n BUILD: 'build',\n CONTENT: 'content',\n INTERACT: 'interact',\n} as const\n\nexport type BuilderEditMode = typeof BuilderEditMode[keyof typeof BuilderEditMode]\n\nexport type State = BuilderEditMode | null\n\nexport function getInitialState(): State {\n return null\n}\n\nexport function reducer(state: State = getInitialState(), action: Action): State {\n switch (action.type) {\n case ActionTypes.SET_BUILDER_EDIT_MODE:\n return action.payload.editMode\n\n default:\n return state\n }\n}\n","import { CopyContext } from '../state/react-page'\nimport { ColorData } from './types'\n\nexport type ColorControlData = ColorData\n\nexport const ColorControlType = 'makeswift::controls::color'\n\ntype ColorControlConfig = {\n label?: string\n labelOrientation?: 'horizontal' | 'vertical'\n defaultValue?: string\n hideAlpha?: boolean\n}\n\nexport type ColorControlDefinition<C extends ColorControlConfig = ColorControlConfig> = {\n type: typeof ColorControlType\n config: C\n}\n\nexport function Color<C extends ColorControlConfig>(config = {} as C): ColorControlDefinition<C> {\n return { type: ColorControlType, config }\n}\n\nexport function copyColorData(\n value: ColorData | undefined,\n context: CopyContext,\n): ColorData | undefined {\n if (value == null) return value\n\n return {\n ...value,\n swatchId: context.replacementContext.swatchIds.get(value.swatchId) ?? value.swatchId,\n }\n}\n","import { BorderRadiusPropertyData } from '../css/border-radius'\nimport type { LengthPercentageData } from '../css/length-percentage'\nimport { MarginPropertyData } from '../css/margin'\nimport { PaddingPropertyData } from '../css/padding'\nimport { ColorData, ResponsiveValue } from './types'\nimport { CopyContext, ReplacementContext } from '../state/react-page'\nimport { copyColorData } from './color'\n\n/** @see https://developer.mozilla.org/en-US/docs/Web/CSS/width */\nexport type WidthPropertyData = LengthPercentageData\n\n/**\n * @see https://developer.mozilla.org/en-US/docs/Web/CSS/border-style\n */\ntype BorderStyle = 'dotted' | 'dashed' | 'solid'\n\n/**\n * @see https://developer.mozilla.org/en-US/docs/Web/CSS/border-top#constituent_properties\n *\n * @todos\n * - Change `width` to be a `Length`\n * - Remove `null` from possible values\n * - Remove `undefined` from possible values and make fields optional\n */\nexport type BorderSideShorthandPropertyData = {\n width: number | null | undefined\n style: BorderStyle\n color?: ColorData | null\n}\n\n/**\n * @see https://developer.mozilla.org/en-US/docs/Web/CSS/border\n *\n * @todos\n * - Remove `null` from possible values\n * - Remove `undefined` from possible values and make fields optional\n */\nexport type BorderPropertyData = {\n borderTop: BorderSideShorthandPropertyData | null | undefined\n borderRight: BorderSideShorthandPropertyData | null | undefined\n borderBottom: BorderSideShorthandPropertyData | null | undefined\n borderLeft: BorderSideShorthandPropertyData | null | undefined\n}\n\n/**\n * https://developer.mozilla.org/en-US/docs/Web/CSS/font-family\n *\n * @todos\n * - Remove `null` from possible values of longhand properties\n * - Remove `undefined` from possible values and make fields optional\n */\nexport type FontFamilyPropertyData = string | null | undefined\n\n/**\n * https://developer.mozilla.org/en-US/docs/Web/CSS/letter-spacing\n *\n * @todos\n * - Remove `null` from possible values of longhand properties\n * - Remove `undefined` from possible values and make fields optional\n */\nexport type LetterSpacingPropertyData = number | null | undefined\n\n/**\n * https://developer.mozilla.org/en-US/docs/Web/CSS/font-size\n *\n * @todos\n * - Remove `null` from possible values of longhand properties\n * - Remove `undefined` from possible values and make fields optional\n */\nexport type FontSizePropertyData =\n | {\n value: number\n unit: 'px'\n }\n | null\n | undefined\n\n/**\n * https://developer.mozilla.org/en-US/docs/Web/CSS/font-weight\n *\n * @todos\n * - Remove `null` from possible values of longhand properties\n * - Remove `undefined` from possible values and make fields optional\n */\nexport type FontWeightPropertyData = number | null | undefined\n\n/**\n * https://developer.mozilla.org/en-US/docs/Web/CSS/text-transform\n *\n * @todos\n * - Match the type with specification\n */\nexport type TextTransformPropertyData = 'uppercase'[]\n\n/**\n * https://developer.mozilla.org/en-US/docs/Web/CSS/font-style\n *\n * @todos\n * - Match the type with specification\n */\nexport type FontStylePropertyData = 'italic'[]\n\n/**\n * @todos\n * - Remove `null` from possible values of longhand properties\n * - Remove `undefined` from possible values and make fields optional\n */\nexport type TextStylePropertyData = {\n fontFamily?: FontFamilyPropertyData | null | undefined\n letterSpacing: LetterSpacingPropertyData | null | undefined\n fontSize: FontSizePropertyData | null | undefined\n fontWeight: FontWeightPropertyData | null | undefined\n textTransform: TextTransformPropertyData\n fontStyle: FontStylePropertyData\n}\n\n/**\n * Primitives like `string` and `number` are excluded from the style data because the relevant\n * panels from the Makeswift builder were originally implemented only to support object values, and\n * not CSS strings. For example, 100 pixels would be `{ value: 100, unit: 'px' }` but never `100` or\n * `'100px'`.\n */\nexport type StyleControlData = {\n width?: ResponsiveValue<Exclude<WidthPropertyData, string | number>>\n margin?: ResponsiveValue<{\n [K in keyof MarginPropertyData]: Exclude<MarginPropertyData[K], string | number> | 'auto'\n }>\n padding?: ResponsiveValue<{\n [K in keyof PaddingPropertyData]: Exclude<PaddingPropertyData[K], string | number>\n }>\n border?: ResponsiveValue<BorderPropertyData>\n borderRadius?: ResponsiveValue<{\n [K in keyof BorderRadiusPropertyData]: Exclude<BorderRadiusPropertyData[K], string | number>\n }>\n textStyle?: ResponsiveValue<TextStylePropertyData>\n}\n\nexport const StyleControlType = 'makeswift::controls::style'\n\nexport const StyleControlProperty = {\n Width: 'makeswift::controls::style::property::width',\n Margin: 'makeswift::controls::style::property::margin',\n Padding: 'makeswift::controls::style::property::padding',\n Border: 'makeswift::controls::style::property::border',\n BorderRadius: 'makeswift::controls::style::property::border-radius',\n TextStyle: 'makeswift::controls::style::property::text-style',\n} as const\n\nexport type StyleControlProperty = typeof StyleControlProperty[keyof typeof StyleControlProperty]\n\ntype StyleControlParams = { properties?: StyleControlProperty[] }\n\nexport type StyleControlConfig = { properties: StyleControlProperty[] }\n\nconst StyleControlDefaultProperties: StyleControlProperty[] = [\n StyleControlProperty.Width,\n StyleControlProperty.Margin,\n]\n\nconst AllStyleControlProperties: StyleControlProperty[] = [\n StyleControlProperty.Width,\n StyleControlProperty.Margin,\n StyleControlProperty.Padding,\n StyleControlProperty.Border,\n StyleControlProperty.BorderRadius,\n StyleControlProperty.TextStyle,\n]\n\nexport type StyleControlDefinition = {\n type: typeof StyleControlType\n config: StyleControlConfig\n}\n\n/**\n * @todos\n * - Add support for custom panel labels.\n * - Add support for default values. Internally, default values must be represented with the same\n * format as the underlying data so that controls can show these values.\n */\nexport function Style(params?: StyleControlParams): StyleControlDefinition {\n return {\n type: StyleControlType,\n config: { properties: params?.properties ?? StyleControlDefaultProperties },\n }\n}\n\nStyle.Default = StyleControlDefaultProperties\nStyle.All = AllStyleControlProperties\n\nStyle.Width = StyleControlProperty.Width\nStyle.Margin = StyleControlProperty.Margin\nStyle.Padding = StyleControlProperty.Padding\nStyle.Border = StyleControlProperty.Border\nStyle.BorderRadius = StyleControlProperty.BorderRadius\nStyle.TextStyle = StyleControlProperty.TextStyle\n\nexport function copyStyleData(\n value: StyleControlData | undefined,\n context: CopyContext,\n): StyleControlData | undefined {\n if (value == null) return value\n\n function copyResponsiveBorder(\n responsiveBorder: ResponsiveValue<BorderPropertyData> | undefined,\n ): ResponsiveValue<BorderPropertyData> | undefined {\n if (responsiveBorder == null) return undefined\n return responsiveBorder.map(deviceBorder => ({\n ...deviceBorder,\n value: copyBorder(deviceBorder.value),\n }))\n }\n\n function copyBorder(border: BorderPropertyData): BorderPropertyData {\n function copyBorderSide(side: BorderSideShorthandPropertyData | null | undefined) {\n if (side == null) return null\n\n if (side.color == null) return side\n\n return {\n ...side,\n color: copyColorData(side.color, context),\n }\n }\n\n return {\n borderTop: copyBorderSide(border.borderTop),\n borderBottom: copyBorderSide(border.borderBottom),\n borderRight: copyBorderSide(border.borderRight),\n borderLeft: copyBorderSide(border.borderLeft),\n }\n }\n\n return { ...value, border: copyResponsiveBorder(value.border) }\n}\n\nif (import.meta.vitest) {\n const { describe, test, expect } = import.meta.vitest\n\n describe.concurrent('style copy', () => {\n test('colors are replaced', () => {\n // Arrange\n const value: StyleControlData = {\n width: [\n {\n value: {\n unit: 'px',\n value: 100,\n },\n deviceId: 'desktop',\n },\n ],\n border: [\n {\n value: {\n borderTop: {\n color: {\n alpha: 1,\n swatchId: 'U3dhdGNoOmJjMDkwZWJjLTZkZDUtNDY1NS1hMDY0LTg3ZDAxM2U4YTFhNA==',\n },\n style: 'solid',\n width: 9,\n },\n borderLeft: {\n color: {\n alpha: 1,\n swatchId: 'U3dhdGNoOmJjMDkwZWJjLTZkZDUtNDY1NS1hMDY0LTg3ZDAxM2U4YTFhNA==',\n },\n style: 'solid',\n width: 9,\n },\n borderRight: {\n color: {\n alpha: 1,\n swatchId: 'U3dhdGNoOmJjMDkwZWJjLTZkZDUtNDY1NS1hMDY0LTg3ZDAxM2U4YTFhNA==',\n },\n style: 'solid',\n width: 9,\n },\n borderBottom: {\n color: {\n alpha: 1,\n swatchId: 'U3dhdGNoOmJjMDkwZWJjLTZkZDUtNDY1NS1hMDY0LTg3ZDAxM2U4YTFhNA==',\n },\n style: 'solid',\n width: 9,\n },\n },\n deviceId: 'desktop',\n },\n ],\n textStyle: [\n {\n value: {\n fontSize: {\n unit: 'px',\n value: 46,\n },\n fontStyle: [],\n fontFamily: 'Oswald',\n fontWeight: 400,\n letterSpacing: 5.2,\n textTransform: [],\n },\n deviceId: 'desktop',\n },\n ],\n borderRadius: [\n {\n value: {\n borderTopLeftRadius: {\n unit: 'px',\n value: 4,\n },\n borderTopRightRadius: {\n unit: 'px',\n value: 4,\n },\n borderBottomLeftRadius: {\n unit: 'px',\n value: 4,\n },\n borderBottomRightRadius: {\n unit: 'px',\n value: 4,\n },\n },\n deviceId: 'desktop',\n },\n ],\n }\n const expected = JSON.parse(\n JSON.stringify(value).replaceAll(\n 'U3dhdGNoOmJjMDkwZWJjLTZkZDUtNDY1NS1hMDY0LTg3ZDAxM2U4YTFhNA==',\n 'testing',\n ),\n )\n\n const replacementContext = {\n elementHtmlIds: new Set(),\n elementKeys: new Map(),\n swatchIds: new Map([\n ['U3dhdGNoOmJjMDkwZWJjLTZkZDUtNDY1NS1hMDY0LTg3ZDAxM2U4YTFhNA==', 'testing'],\n ]),\n fileIds: new Map(),\n typographyIds: new Map(),\n tableIds: new Map(),\n tableColumnIds: new Map(),\n pageIds: new Map(),\n globalElementIds: new Map(),\n globalElementData: new Map(),\n }\n\n // Act\n const result = copyStyleData(value, {\n replacementContext: replacementContext as ReplacementContext,\n copyElement: node => node,\n })\n\n // Assert\n expect(result).toMatchObject(expected)\n })\n })\n}\n","import type * as Slate from 'slate'\nimport { StyleControlDefinition, StyleControlType } from '../controls/style'\nimport {\n ResolveBorderControlValue,\n ResolveBorderRadiusControlValue,\n ResolveMarginControlValue,\n ResolvePaddingControlValue,\n ResolveShadowsControlValue,\n ResolveWidthControlValue,\n} from '../runtimes/react/controls'\nimport { StyleControlFormattedValue } from '../runtimes/react/controls/style'\nimport type { Element, Data } from '../state/react-page'\nimport type { ResponsiveColor } from '../runtimes/react/controls'\nimport { NumberControlDefinition } from '../controls/number'\nimport { NumberControlValue } from '../runtimes/react/controls/number'\nimport {\n CheckboxControlDefinition,\n ColorControlDefinition,\n ComboboxControlDefinition,\n ImageControlDefinition,\n LinkControlDefinition,\n ListControlDefinition,\n SelectControlDefinition,\n ShapeControlDefinition,\n SlotControlDefinition,\n TextAreaControlDefinition,\n TextInputControlDefinition,\n} from '../controls'\nimport { TextInputControlValue } from '../runtimes/react/controls/text-input'\nimport { TextAreaControlValue } from '../runtimes/react/controls/text-area'\nimport { ColorControlValue } from '../runtimes/react/controls/color'\nimport { SelectControlValue } from '../runtimes/react/controls/select'\nimport { CheckboxControlValue } from '../runtimes/react/controls/checkbox'\nimport { ResolveImageControlValue } from '../runtimes/react/controls/image'\nimport { ShapeControlValue } from '../runtimes/react/controls/shape'\nimport { ListControlValue } from '../runtimes/react/controls/list'\nimport { ComboboxControlValue } from '../runtimes/react/controls/combobox'\nimport { LinkControlValue } from '../runtimes/react/controls/link'\nimport { SlotControlValue } from '../runtimes/react/controls/slot'\nimport { RichTextControlDefinition } from '../controls/rich-text'\nimport { RichTextControlValue } from '../runtimes/react/controls/rich-text'\n\nexport type { Data }\n\n// See https://github.com/microsoft/TypeScript/issues/15300\nexport type IndexSignatureHack<T> = T extends Record<string, any>\n ? { [K in keyof T]: IndexSignatureHack<T[K]> }\n : T\n\nexport type Device = 'desktop' | 'tablet' | 'mobile'\n\nexport type DeviceOverride<T> = { deviceId: Device; value: T }\n\nexport type ResponsiveValue<T> = DeviceOverride<T>[]\n\nexport type ResponsiveValueType<T> = T extends ResponsiveValue<infer U> ? U : never\n\ntype Color = { swatchId: string; alpha: number }\n\ntype IconName =\n | 'HeightAuto16'\n | 'HeightMatch16'\n | 'VerticalAlignStart16'\n | 'VerticalAlignMiddle16'\n | 'VerticalAlignEnd16'\n | 'VerticalAlignSpaceBetween16'\n | 'ButtonPill16'\n | 'ButtonRounded16'\n | 'ButtonSquare16'\n | 'SizeSmall16'\n | 'SizeMedium16'\n | 'SizeLarge16'\n | 'ArrowInside16'\n | 'ArrowCenter16'\n | 'ArrowOutside16'\n | 'CountdownSolid16'\n | 'CountdownSolidSplit16'\n | 'CountdownOutline16'\n | 'CountdownOutlineSplit16'\n | 'CountdownNaked16'\n | 'Sun16'\n | 'Moon16'\n | 'AlignLeft16'\n | 'AlignCenter16'\n | 'AlignRight16'\n | 'Star16'\n | 'StarCircle16'\n | 'StarRoundedSquare16'\n | 'StarSquare16'\n\nexport type Gap = { value: number; unit: 'px' }\n\nexport type Length = { value: number; unit: 'px' | '%' }\n\ntype OpenPageLink = {\n type: 'OPEN_PAGE'\n payload: { pageId: string | null | undefined; openInNewTab: boolean }\n}\n\ntype OpenURLLink = { type: 'OPEN_URL'; payload: { url: string; openInNewTab: boolean } }\n\ntype SendEmailLink = {\n type: 'SEND_EMAIL'\n payload: { to: string; subject?: string; body?: string }\n}\n\ntype CallPhoneLink = { type: 'CALL_PHONE'; payload: { phoneNumber: string } }\n\ntype ScrollToElementLink = {\n type: 'SCROLL_TO_ELEMENT'\n payload: {\n elementIdConfig: { elementKey: string; propName: string } | null | undefined\n block: 'start' | 'center' | 'end'\n }\n}\n\ntype Link = OpenPageLink | OpenURLLink | SendEmailLink | CallPhoneLink | ScrollToElementLink\n\ntype TextStyle = {\n fontFamily?: string | null | undefined\n letterSpacing: number | null | undefined\n fontSize: { value: number; unit: 'px' } | null | undefined\n fontWeight: number | null | undefined\n textTransform: 'uppercase'[]\n fontStyle: 'italic'[]\n}\n\nexport const Types = {\n Backgrounds: 'Backgrounds',\n Border: 'Border',\n BorderRadius: 'BorderRadius',\n Checkbox: 'Checkbox',\n Date: 'Date',\n ElementID: 'ElementID',\n Font: 'Font',\n GapX: 'GapX',\n GapY: 'GapY',\n Grid: 'Grid',\n Image: 'Image',\n Images: 'Images',\n Link: 'Link',\n List: 'List',\n Margin: 'Margin',\n NavigationLinks: 'NavigationLinks',\n Number: 'Number',\n Padding: 'Padding',\n ResponsiveColor: 'ResponsiveColor',\n ResponsiveIconRadioGroup: 'ResponsiveIconRadioGroup',\n ResponsiveLength: 'ResponsiveLength',\n ResponsiveNumber: 'ResponsiveNumber',\n ResponsiveOpacity: 'ResponsiveOpacity',\n ResponsiveSelect: 'ResponsiveSelect',\n RichText: 'RichText',\n Shadows: 'Shadows',\n Shape: 'Shape',\n SocialLinks: 'SocialLinks',\n Table: 'Table',\n TableFormFields: 'TableFormFields',\n Typeahead: 'Typeahead',\n TextArea: 'TextArea',\n TextInput: 'TextInput',\n TextStyle: 'TextStyle',\n Video: 'Video',\n Width: 'Width',\n Style: StyleControlType,\n} as const\n\ntype Options<T> = T | ((props: Record<string, unknown>, deviceMode: Device) => T)\n\nexport type ResolveOptions<T extends Options<unknown>> = T extends Options<infer U> ? U : never\n\ntype ColorBackground = { type: 'color'; id: string; payload: Color | null }\n\ntype GradientStop = { id: string; location: number; color: Color | null }\n\ntype Gradient = { angle?: number; isRadial?: boolean; stops: GradientStop[] }\n\ntype GradientBackground = { type: 'gradient'; id: string; payload: Gradient }\n\ntype BackgroundImagePosition = { x: number; y: number }\n\ntype BackgroundImageSize = 'cover' | 'contain' | 'auto'\n\ntype BackgroundImageRepeat = 'no-repeat' | 'repeat-x' | 'repeat-y' | 'repeat'\n\ntype BackgroundImage = {\n imageId: string\n position: BackgroundImagePosition\n size?: BackgroundImageSize\n repeat?: BackgroundImageRepeat\n opacity?: number\n parallax?: number\n}\n\ntype ImageBackground = { type: 'image'; id: string; payload: BackgroundImage }\n\ntype BackgroundVideoAspectRatio = 'wide' | 'standard'\n\ntype BackgroundVideo = {\n url?: string\n maskColor?: Color | null\n opacity?: number\n zoom?: number\n aspectRatio?: BackgroundVideoAspectRatio\n parallax?: number\n}\n\ntype VideoBackground = { type: 'video'; id: string; payload: BackgroundVideo }\n\ntype Background = ColorBackground | GradientBackground | ImageBackground | VideoBackground\n\nexport type BackgroundsValue = ResponsiveValue<Background[]>\n\ntype BackgroundsOptions = Options<Record<string, never>>\n\ntype BackgroundsDescriptor<_T = BackgroundsValue> = {\n type: typeof Types.Backgrounds\n options: BackgroundsOptions\n}\n\nexport function Backgrounds(options: BackgroundsOptions = {}): BackgroundsDescriptor {\n return { type: Types.Backgrounds, options }\n}\n\ntype BorderSideStyle = 'dashed' | 'dotted' | 'solid'\n\nexport type BorderSide = {\n width: number | null | undefined\n style: BorderSideStyle\n color?: Color | null\n}\n\ntype Border = {\n [K in 'top' | 'right' | 'bottom' | 'left' as `border${Capitalize<K>}`]:\n | BorderSide\n | null\n | undefined\n}\n\nexport type BorderValue = ResponsiveValue<Border>\n\nexport const BorderPropControllerFormat = {\n ClassName: 'makeswift::prop-controllers::border::format::class-name',\n ResponsiveValue: 'makeswift::prop-controllers:border::format::responsive-value',\n} as const\n\nexport type BorderPropControllerFormat =\n typeof BorderPropControllerFormat[keyof typeof BorderPropControllerFormat]\n\ntype BorderOptions = { format?: BorderPropControllerFormat }\n\nexport type BorderDescriptor<_T = BorderValue, U extends BorderOptions = BorderOptions> = {\n type: typeof Types.Border\n options: U\n}\n\nexport function Border<T extends BorderOptions>(\n options: T & BorderOptions = {} as T,\n): BorderDescriptor<BorderValue, T> {\n return { type: Types.Border, options }\n}\n\nBorder.Format = BorderPropControllerFormat\n\ntype BorderRadius = {\n [K in 'topLeft' | 'topRight' | 'bottomLeft' | 'bottomRight' as `border${Capitalize<K>}Radius`]:\n | Length\n | null\n | undefined\n}\n\nexport type BorderRadiusValue = ResponsiveValue<BorderRadius>\n\nexport const BorderRadiusPropControllerFormat = {\n ClassName: 'makeswift::prop-controllers::border-radius::format::class-name',\n ResponsiveValue: 'makeswift::prop-controllers::border-radius::format::responsive-value',\n} as const\n\nexport type BorderRadiusPropControllerFormat =\n typeof BorderRadiusPropControllerFormat[keyof typeof BorderRadiusPropControllerFormat]\n\ntype BorderRadiusOptions = { format?: BorderRadiusPropControllerFormat }\n\nexport type BorderRadiusDescriptor<\n _T = BorderRadiusValue,\n U extends BorderRadiusOptions = BorderRadiusOptions,\n> = {\n type: typeof Types.BorderRadius\n options: U\n}\n\nexport function BorderRadius<T extends BorderRadiusOptions>(\n options: T & BorderRadiusOptions = {} as T,\n): BorderRadiusDescriptor<BorderRadiusValue, T> {\n return { type: Types.BorderRadius, options }\n}\n\nBorderRadius.Format = BorderRadiusPropControllerFormat\n\nexport type CheckboxValue = boolean\n\nexport type CheckboxOptions = Options<{\n preset?: CheckboxValue\n label: string\n hidden?: boolean\n}>\n\nexport type CheckboxDescriptor<_T = CheckboxValue> = {\n type: typeof Types.Checkbox\n options: CheckboxOptions\n}\n\nexport function Checkbox(options: CheckboxOptions): CheckboxDescriptor {\n return { type: Types.Checkbox, options }\n}\n\nexport type DateValue = string\n\nexport type DateOptions = Options<{ preset?: DateValue }>\n\nexport type DateDescriptor<_T = DateValue> = { type: typeof Types.Date; options: DateOptions }\n\nexport function Date(options: DateOptions = {}): DateDescriptor {\n return { type: Types.Date, options }\n}\n\nexport type ElementIDValue = string\n\ntype ElementIDOptions = Options<Record<string, never>>\n\ntype ElementIDDescriptor<_T = ElementIDValue> = {\n type: typeof Types.ElementID\n options: ElementIDOptions\n}\n\nexport function ElementID(options: ElementIDOptions = {}): ElementIDDescriptor {\n return { type: Types.ElementID, options }\n}\n\nexport type FontValue = ResponsiveValue<string>\n\ntype FontOptions = Options<{ preset?: FontValue; label?: string }>\n\ntype FontDescriptor<_T = FontValue> = { type: typeof Types.Font; options: FontOptions }\n\nexport function Font(options: FontOptions = {}): FontDescriptor {\n return { type: Types.Font, options }\n}\n\nexport type GapXValue = ResponsiveValue<Gap>\n\nexport type GapXOptions = Options<{\n preset?: GapXValue\n label?: string\n defaultValue?: Gap\n min?: number\n max?: number\n step?: number\n hidden?: boolean\n}>\n\nexport type GapXDescriptor<_T = GapXValue> = { type: typeof Types.GapX; options: GapXOptions }\n\nexport function GapX(options: GapXOptions = {}): GapXDescriptor {\n return { type: Types.GapX, options }\n}\n\nexport type GapYValue = ResponsiveValue<Gap>\n\nexport type GapYOptions = Options<{\n preset?: GapYValue\n label?: string\n defaultValue?: Gap\n step?: number\n min?: number\n max?: number\n hidden?: boolean\n}>\n\nexport type GapYDescriptor<_T = GapYValue> = { type: typeof Types.GapY; options: GapYOptions }\n\nexport function GapY(options: GapYOptions = {}): GapYDescriptor {\n return { type: Types.GapY, options }\n}\n\ntype GridColumn = { count: number; spans: number[][] }\n\nexport type GridValue = { elements: Element[]; columns: ResponsiveValue<GridColumn> }\n\ntype GridOptions = Options<Record<string, never>>\n\ntype GridDescriptor<_T = GridValue> = { type: typeof Types.Grid; options: GridOptions }\n\nexport function Grid(options: GridOptions = {}): GridDescriptor {\n return { type: Types.Grid, options }\n}\n\nexport type ImageValue = string\n\nexport type ImageOptions = Options<{ label?: string; hidden?: boolean }>\n\nexport type ImageDescriptor<_T = ImageValue> = { type: typeof Types.Image; options: ImageOptions }\n\nexport function Image(options: ImageOptions = {}): ImageDescriptor {\n return { type: Types.Image, options }\n}\n\nexport type ImagesValue = { key: string; props: { link?: Link; file?: string; altText?: string } }[]\n\ntype ImagesOptions = Options<{ preset?: ImagesValue }>\n\ntype ImagesDescriptor<_T = ImagesValue> = { type: typeof Types.Images; options: ImagesOptions }\n\nexport function Images(options: ImagesOptions = {}): ImagesDescriptor {\n return { type: Types.Images, options }\n}\n\nexport type LinkValue = Link\n\nexport type LinkOptions = Options<{\n preset?: LinkValue\n label?: string\n defaultValue?: Link\n options?: { value: Link['type']; label: string }[]\n hidden?: boolean\n}>\n\nexport type LinkDescriptor<_T = LinkValue> = { type: typeof Types.Link; options: LinkOptions }\n\nexport function Link(options: LinkOptions = {}): LinkDescriptor {\n return { type: Types.Link, options }\n}\n\ntype ListValueItem<T extends Data> = { id: string; value?: T }\n\nexport type ListValue<T extends Data = Data> = ListValueItem<T>[]\n\nexport type ListOptions<T extends Data> = {\n type: PanelDescriptor<T>\n label?: string\n getItemLabel?: ((value: T | undefined) => string) | ((value: T | undefined) => Promise<string>)\n preset?: ListValue<T>\n defaultValue?: ListValue<T>\n}\n\nexport type ListDescriptor<T extends ListValue = ListValue> = {\n type: typeof Types.List\n options: ListOptions<T extends ListValue<infer U> ? U : never>\n}\n\nexport function List<T extends Data>(options: ListOptions<T>): ListDescriptor<ListValue<T>> {\n return { type: Types.List, options }\n}\n\ntype MarginSide = { value: number; unit: 'px' } | 'auto'\n\ntype Margin = {\n [K in 'top' | 'right' | 'bottom' | 'left' as `margin${Capitalize<K>}`]:\n | MarginSide\n | null\n | undefined\n}\n\nexport type MarginValue = ResponsiveValue<Margin>\n\nexport const MarginPropControllerFormat = {\n ClassName: 'makeswift::prop-controllers::margin::format::class-name',\n ResponsiveValue: 'makeswift::prop-controllers::margin::format::responsive-value',\n} as const\n\nexport type MarginPropControllerFormat =\n typeof MarginPropControllerFormat[keyof typeof MarginPropControllerFormat]\n\ntype MarginOptions = { preset?: MarginValue; format?: MarginPropControllerFormat }\n\nexport type MarginDescriptor<_T = MarginValue, U extends MarginOptions = MarginOptions> = {\n type: typeof Types.Margin\n options: U\n}\n\nexport function Margin<T extends MarginOptions>(\n options: T & MarginOptions = {} as T,\n): MarginDescriptor<MarginValue, T> {\n return { type: Types.Margin, options }\n}\n\nMargin.Format = MarginPropControllerFormat\n\ntype ButtonVariant = 'flat' | 'outline' | 'shadow' | 'clear' | 'blocky' | 'bubbly' | 'skewed'\n\ntype ButtonShape = 'pill' | 'rounded' | 'square'\n\ntype ButtonSize = 'small' | 'medium' | 'large'\n\nexport type NavigationButton = {\n id: string\n type: 'button'\n payload: {\n label: string\n link?: Link\n variant?: ResponsiveValue<ButtonVariant>\n shape?: ResponsiveValue<ButtonShape>\n size?: ResponsiveValue<ButtonSize>\n textColor?: ResponsiveValue<Color>\n color?: ResponsiveValue<Color>\n textStyle?: ResponsiveValue<TextStyle>\n }\n}\n\ntype NavigationDropdownCaretType = 'caret' | 'plus' | 'arrow-down' | 'chevron-down'\n\ntype NavigationDropdownLink = {\n id: string\n payload: {\n label: string\n link?: Link\n color?: ResponsiveValue<Color>\n textStyle?: ResponsiveValue<TextStyle>\n }\n}\n\ntype NavigationDropdown = {\n id: string\n type: 'dropdown'\n payload: {\n label: string\n caret?: NavigationDropdownCaretType\n links?: NavigationDropdownLink[]\n variant?: ResponsiveValue<ButtonVariant>\n shape?: ResponsiveValue<ButtonShape>\n size?: ResponsiveValue<ButtonSize>\n textColor?: ResponsiveValue<Color>\n color?: ResponsiveValue<Color>\n textStyle?: ResponsiveValue<TextStyle>\n }\n}\n\nexport type NavigationLinksValue = (NavigationButton | NavigationDropdown)[]\n\ntype NavigationLinksOptions = Options<Record<string, never>>\n\ntype NavigationLinksDescriptor<_T = NavigationLinksValue> = {\n type: typeof Types.NavigationLinks\n options: NavigationLinksOptions\n}\n\nexport function NavigationLinks(options: NavigationLinksOptions = {}): NavigationLinksDescriptor {\n return { type: Types.NavigationLinks, options }\n}\n\nexport type NumberValue = number\n\nexport type NumberOptions = Options<{\n preset?: NumberValue\n label?: string\n defaultValue?: number\n min?: number\n max?: number\n step?: number\n suffix?: string\n hidden?: boolean\n}>\n\nexport type NumberDescriptor<_T = NumberValue> = {\n type: typeof Types.Number\n options: NumberOptions\n}\n\nexport function Number(options: NumberOptions = {}): NumberDescriptor {\n return { type: Types.Number, options }\n}\n\ntype PaddingSide = { value: number; unit: 'px' }\n\ntype Padding = {\n [K in 'top' | 'right' | 'bottom' | 'left' as `padding${Capitalize<K>}`]:\n | PaddingSide\n | null\n | undefined\n}\n\nexport type PaddingValue = ResponsiveValue<Padding>\n\nexport const PaddingPropControllerFormat = {\n ClassName: 'makeswift::prop-controllers::padding::format::class-name',\n ResponsiveValue: 'makeswift::prop-controllers::padding::format::responsive-value',\n} as const\n\nexport type PaddingPropControllerFormat =\n typeof PaddingPropControllerFormat[keyof typeof PaddingPropControllerFormat]\n\ntype PaddingOptions = { preset?: PaddingValue; format?: PaddingPropControllerFormat }\n\nexport type PaddingDescriptor<_T = PaddingValue, U extends PaddingOptions = PaddingOptions> = {\n type: typeof Types.Padding\n options: U\n}\n\nexport function Padding<T extends PaddingOptions>(\n options: T & PaddingOptions = {} as T,\n): PaddingDescriptor<PaddingValue, T> {\n return { type: Types.Padding, options }\n}\n\nPadding.Format = PaddingPropControllerFormat\n\nexport type ResponsiveColorValue = ResponsiveValue<Color>\n\ntype ResponsiveColorOptions = Options<{ label?: string; placeholder?: string; hidden?: boolean }>\n\nexport type ResponsiveColorDescriptor<_T = ResponsiveColorValue> = {\n type: typeof Types.ResponsiveColor\n options: ResponsiveColorOptions\n}\n\nexport function ResponsiveColor(options: ResponsiveColorOptions = {}): ResponsiveColorDescriptor {\n return { type: Types.ResponsiveColor, options }\n}\n\nexport type IconRadioGroupOption<T extends string> = { value: T; label: string; icon: IconName }\n\nexport type ResponsiveIconRadioGroupValue<T extends string = string> = ResponsiveValue<T>\n\nexport type ResponsiveIconRadioGroupOptions<T extends string = string, U extends T = T> = Options<{\n label?: string\n options: IconRadioGroupOption<T>[]\n defaultValue?: U\n hidden?: boolean\n}>\n\nexport type ResponsiveIconRadioGroupDescriptor<\n T extends ResponsiveIconRadioGroupValue<string> = ResponsiveIconRadioGroupValue<string>,\n> = {\n type: typeof Types.ResponsiveIconRadioGroup\n options: ResponsiveIconRadioGroupOptions<ResponsiveValueType<T>>\n}\n\n// HACK(miguel): We have to use a layer of indirection with `_T` and `T` because otherwise the\n// values provided would undergo type widening. For some reason, the extra layer of indirection\n// reuslts in TypeScript not widening types. Note, this only happens when the returned value of this\n// function is passed to another as an argument, which is common with the `registerComponent` API.\nexport function ResponsiveIconRadioGroup<_T extends string, T extends _T, U extends T>(\n options: ResponsiveIconRadioGroupOptions<T, U>,\n): ResponsiveIconRadioGroupDescriptor<ResponsiveIconRadioGroupValue<T>> {\n return { type: Types.ResponsiveIconRadioGroup, options }\n}\n\nexport type ResponsiveLengthValue = ResponsiveValue<Length>\n\nexport type LengthOption =\n | { value: 'px'; label: 'Pixels'; icon: 'Px16' }\n | { value: '%'; label: 'Percentage'; icon: 'Percent16' }\n\nexport type ResponsiveLengthOptions = Options<{\n label?: string\n options?: LengthOption[]\n defaultValue?: Length\n hidden?: boolean\n}>\n\nexport type ResponsiveLengthDescriptor<_T = ResponsiveLengthValue> = {\n type: typeof Types.ResponsiveLength\n options: ResponsiveLengthOptions\n}\n\nexport function ResponsiveLength(\n options: ResponsiveLengthOptions = {},\n): ResponsiveLengthDescriptor {\n return { type: Types.ResponsiveLength, options }\n}\n\nexport type ResponsiveNumberValue = ResponsiveValue<number>\n\nexport type ResponsiveNumberOptions = Options<{\n label?: string\n defaultValue?: number\n min?: number\n max?: number\n step?: number\n suffix?: string\n hidden?: boolean\n}>\n\nexport type ResponsiveNumberDescriptor<_T = ResponsiveNumberValue> = {\n type: typeof Types.ResponsiveNumber\n options: ResponsiveNumberOptions\n}\n\nexport function ResponsiveNumber(\n options: ResponsiveNumberOptions = {},\n): ResponsiveNumberDescriptor {\n return { type: Types.ResponsiveNumber, options }\n}\n\nexport type ResponsiveOpacityValue = ResponsiveValue<number>\n\ntype ResponsiveOpacityOptions = Options<Record<string, never>>\n\ntype ResponsiveOpacityDescriptor<_T = ResponsiveOpacityValue> = {\n type: typeof Types.ResponsiveOpacity\n options: ResponsiveOpacityOptions\n}\n\nexport function ResponsiveOpacity(\n options: ResponsiveOpacityOptions = {},\n): ResponsiveOpacityDescriptor {\n return { type: Types.ResponsiveOpacity, options }\n}\n\nexport type ResponsiveSelectValue<T extends string = string> = ResponsiveValue<T>\n\nexport type SelectLabelOrientation = 'vertical' | 'horizontal'\n\nexport type SelectOption<T extends string> = { value: T; label: string }\n\nexport type ResponsiveSelectOptions<T extends string = string, U extends T = T> = Options<{\n label?: string\n labelOrientation?: SelectLabelOrientation\n options: SelectOption<T>[]\n defaultValue?: U\n hidden?: boolean\n}>\n\nexport type ResponsiveSelectDescriptor<\n T extends ResponsiveSelectValue<string> = ResponsiveSelectValue<string>,\n> = {\n type: typeof Types.ResponsiveSelect\n options: ResponsiveSelectOptions<ResponsiveValueType<T>>\n}\n\n// HACK(miguel): We have to use a layer of indirection with `_T` and `T` because otherwise the\n// values provided would undergo type widening. For some reason, the extra layer of indirection\n// reuslts in TypeScript not widening types. Note, this only happens when the returned value of this\n// function is passed to another as an argument, which is common with the `registerComponent` API.\nexport function ResponsiveSelect<_T extends string, T extends _T, U extends T>(\n options: ResponsiveSelectOptions<T, U>,\n): ResponsiveSelectDescriptor<ResponsiveSelectValue<T>> {\n return { type: Types.ResponsiveSelect, options }\n}\n\nexport type RichTextValue = IndexSignatureHack<Slate.ValueJSON>\n\nexport type RichTextOptions = Options<{ preset?: RichTextValue }>\n\nexport type RichTextDescriptor<_T extends Data = RichTextValue> = {\n type: typeof Types.RichText\n options: RichTextOptions\n}\n\nexport function RichText(options: RichTextOptions = {}): RichTextDescriptor {\n return { type: Types.RichText, options }\n}\n\ntype Shadow = {\n color?: Color | null\n blurRadius?: number\n spreadRadius?: number\n offsetX?: number\n offsetY?: number\n inset?: boolean\n}\n\ntype Shadows = { id: string; payload: Shadow }[]\n\nexport type ShadowsValue = ResponsiveValue<Shadows>\n\nexport const ShadowsPropControllerFormat = {\n ClassName: 'makeswift::prop-controllers::shadows::format::class-name',\n ResponsiveValue: 'makeswift::prop-controllers::shadows::format::responsive-value',\n} as const\n\nexport type ShadowsPropControllerFormat =\n typeof ShadowsPropControllerFormat[keyof typeof ShadowsPropControllerFormat]\n\ntype ShadowsOptions = { format?: ShadowsPropControllerFormat }\n\nexport type ShadowsDescriptor<_T = ShadowsValue, U extends ShadowsOptions = ShadowsOptions> = {\n type: typeof Types.Shadows\n options: U\n}\n\nexport function Shadows<T extends ShadowsOptions>(\n options: T & ShadowsOptions = {} as T,\n): ShadowsDescriptor<ShadowsValue, T> {\n return { type: Types.Shadows, options }\n}\n\nShadows.Format = ShadowsPropControllerFormat\n\nexport type ShapeValue<T extends Data = Data> = Record<string, T>\n\ntype ShapeOptions<T extends Record<string, PanelDescriptor>> = {\n type: T\n preset?: { [K in keyof T]?: DescriptorValueType<T[K]> }\n}\n\nexport type ShapeDescriptor<\n _T extends Record<string, Data>,\n U extends Record<string, PanelDescriptor>,\n> = {\n type: typeof Types.Shape\n options: ShapeOptions<U>\n}\n\nexport function Shape<T extends Record<string, PanelDescriptor>>(\n options: ShapeOptions<T>,\n): ShapeDescriptor<{ [K in keyof T]?: DescriptorValueType<T[K]> }, T> {\n return { type: Types.Shape, options }\n}\n\ntype SocialLinkType =\n | 'angellist'\n | 'codepen'\n | 'dribbble'\n | 'facebook'\n | 'github'\n | 'instagram'\n | 'linkedin'\n | 'medium'\n | 'pinterest'\n | 'reddit'\n | 'rss'\n | 'snapchat'\n | 'soundcloud'\n | 'spotify'\n | 'telegram'\n | 'tumblr'\n | 'twitch'\n | 'twitter'\n | 'vimeo'\n | 'whatsapp'\n | 'yelp'\n | 'youtube'\n\ntype SocialLink = { type: SocialLinkType; url: string }\n\ntype SocialLinksLink = { id: string; payload: SocialLink }\n\nexport type SocialLinksValue = { links: SocialLinksLink[]; openInNewTab: boolean }\n\ntype SocialLinksOptions = Options<{ preset?: SocialLinksValue }>\n\ntype SocialLinksDescriptor<_T = SocialLinksValue> = {\n type: typeof Types.SocialLinks\n options: SocialLinksOptions\n}\n\nexport function SocialLinks(options: SocialLinksOptions = {}): SocialLinksDescriptor {\n return { type: Types.SocialLinks, options }\n}\n\nexport type TableValue = string\n\ntype TableOptions = Options<{ preset?: TableValue }>\n\ntype TableDescriptor<_T = TableValue> = { type: typeof Types.Table; options: TableOptions }\n\nexport function Table(options: TableOptions = {}): TableDescriptor {\n return { type: Types.Table, options }\n}\n\ntype TableFormField = {\n id: string\n tableColumnId: string\n label?: string\n placeholder?: string\n defaultValue?: string | boolean | string[]\n required?: boolean\n hidden?: boolean\n type?: 'select' | 'radio'\n hideLabel?: boolean\n autofill?: boolean\n}\n\ntype Grid = { count: number; spans: number[][] }\n\nexport type TableFormFieldsValue = { fields: TableFormField[]; grid: ResponsiveValue<Grid> }\n\ntype TableFormFieldsOptions = Options<{ preset?: TableFormFieldsValue }>\n\nexport type TableFormFieldsDescriptor<_T = TableFormFieldsValue> = {\n type: typeof Types.TableFormFields\n options: TableFormFieldsOptions\n}\n\nexport function TableFormFields(options: TableFormFieldsOptions = {}): TableFormFieldsDescriptor {\n return { type: Types.TableFormFields, options }\n}\n\nexport type TypeaheadValue<T extends Data = Data> = {\n id: string\n label: string\n value: T\n}\n\nexport type TypeaheadOptions<T extends Data> = {\n getItems: (query: string) => Promise<TypeaheadValue<T>[]>\n label?: string\n preset?: TypeaheadValue<T>\n defaultValue?: TypeaheadValue<T>\n}\n\nexport type TypeaheadDescriptor<T extends TypeaheadValue = TypeaheadValue> = {\n type: typeof Types.Typeahead\n options: TypeaheadOptions<T extends TypeaheadValue<infer U> ? U : never>\n}\n\nexport function Typeahead<T extends Data>(\n options: TypeaheadOptions<T>,\n): TypeaheadDescriptor<TypeaheadValue<T>> {\n return { type: Types.Typeahead, options }\n}\n\nexport type TextAreaValue = string\n\ntype TextAreaOptions = Options<{ preset?: TextAreaValue; label?: string; rows?: number }>\n\ntype TextAreaDescriptor<_T = TextAreaValue> = {\n type: typeof Types.TextArea\n options: TextAreaOptions\n}\n\nexport function TextArea(options: TextAreaOptions = {}): TextAreaDescriptor {\n return { type: Types.TextArea, options }\n}\n\nexport type TextInputValue = string\n\nexport type TextInputOptions = Options<{ label?: string; placeholder?: string; hidden?: boolean }>\n\nexport type TextInputDescriptor<_T = TextInputValue> = {\n type: typeof Types.TextInput\n options: TextInputOptions\n}\n\nexport function TextInput(options: TextInputOptions = {}): TextInputDescriptor {\n return { type: Types.TextInput, options }\n}\n\nexport type TextStyleValue = ResponsiveValue<TextStyle>\n\nexport type TextStyleOptions = Options<{\n preset?: TextStyleValue\n label?: string\n hidden?: boolean\n}>\n\nexport type TextStyleDescriptor<_T = TextStyleValue> = {\n type: typeof Types.TextStyle\n options: TextStyleOptions\n}\n\nexport function TextStyle(options: TextStyleOptions = {}): TextStyleDescriptor {\n return { type: Types.TextStyle, options }\n}\n\ntype Video = {\n url?: string\n muted?: boolean\n playing?: boolean\n loop?: boolean\n controls?: boolean\n}\n\nexport type VideoValue = Video\n\ntype VideoOptions = Options<{ preset?: VideoValue }>\n\ntype VideoDescriptor<_T = VideoValue> = { type: typeof Types.Video; options: VideoOptions }\n\nexport function Video(options: VideoOptions = {}): VideoDescriptor {\n return { type: Types.Video, options }\n}\n\nexport type WidthValue = ResponsiveValue<Length>\n\nexport const WidthPropControllerFormat = {\n ClassName: 'makeswift::prop-controllers::width::format::class-name',\n ResponsiveValue: 'makeswift::prop-controllers::width::format::responsive-value',\n} as const\n\ntype WidthControlValueFormat =\n typeof WidthPropControllerFormat[keyof typeof WidthPropControllerFormat]\n\ntype WidthOptions = {\n preset?: WidthValue\n defaultValue?: Length\n format?: WidthControlValueFormat\n}\n\nexport type WidthDescriptor<_T = WidthValue, U extends WidthOptions = WidthOptions> = {\n type: typeof Types.Width\n options: U\n}\n\nexport function Width<T extends WidthOptions>(\n options: T & WidthOptions = {} as T,\n): WidthDescriptor<WidthValue, T> {\n return { type: Types.Width, options }\n}\n\nWidth.Format = WidthPropControllerFormat\n\nexport type Descriptor<T extends Data = Data> =\n | BackgroundsDescriptor<T>\n | BorderDescriptor<T>\n | BorderRadiusDescriptor<T>\n | CheckboxDescriptor<T>\n | DateDescriptor<T>\n | ElementIDDescriptor<T>\n | FontDescriptor<T>\n | GapXDescriptor<T>\n | GapYDescriptor<T>\n | GridDescriptor<T>\n | ImageDescriptor<T>\n | ImagesDescriptor<T>\n | LinkDescriptor<T>\n | ListDescriptor<T extends ListValue ? T : ListValue>\n | MarginDescriptor<T>\n | NavigationLinksDescriptor<T>\n | NumberDescriptor<T>\n | PaddingDescriptor<T>\n | ResponsiveColorDescriptor<T>\n | ResponsiveIconRadioGroupDescriptor<\n T extends ResponsiveIconRadioGroupValue<string> ? T : ResponsiveIconRadioGroupValue<string>\n >\n | ResponsiveLengthDescriptor<T>\n | ResponsiveNumberDescriptor<T>\n | ResponsiveOpacityDescriptor<T>\n | ResponsiveSelectDescriptor<\n T extends ResponsiveSelectValue<string> ? T : ResponsiveSelectValue<string>\n >\n | RichTextDescriptor<T>\n | ShadowsDescriptor<T>\n | ShapeDescriptor<T extends ShapeValue ? T : ShapeValue, any>\n | SocialLinksDescriptor<T>\n | TableDescriptor<T>\n | TableFormFieldsDescriptor<T>\n | TypeaheadDescriptor<T extends TypeaheadValue ? T : TypeaheadValue>\n | TextAreaDescriptor<T>\n | TextInputDescriptor<T>\n | TextStyleDescriptor<T>\n | VideoDescriptor<T>\n | WidthDescriptor<T>\n | StyleControlDefinition\n | NumberControlDefinition\n | CheckboxControlDefinition\n | TextInputControlDefinition\n | TextAreaControlDefinition\n | SelectControlDefinition\n | ColorControlDefinition\n | ImageControlDefinition\n | ComboboxControlDefinition\n | ShapeControlDefinition\n | ListControlDefinition\n | LinkControlDefinition\n | SlotControlDefinition\n | RichTextControlDefinition\n\nexport type PanelDescriptorType =\n | typeof Types.Backgrounds\n | typeof Types.ResponsiveIconRadioGroup\n | typeof Types.Margin\n | typeof Types.Padding\n | typeof Types.Border\n | typeof Types.Shadows\n | typeof Types.GapY\n | typeof Types.GapX\n | typeof Types.BorderRadius\n | typeof Types.Checkbox\n | typeof Types.TextInput\n | typeof Types.Link\n | typeof Types.List\n | typeof Types.Shape\n | typeof Types.ResponsiveSelect\n | typeof Types.ResponsiveColor\n | typeof Types.TextStyle\n | typeof Types.Images\n | typeof Types.ResponsiveNumber\n | typeof Types.Number\n | typeof Types.Date\n | typeof Types.Font\n | typeof Types.TextArea\n | typeof Types.Table\n | typeof Types.Typeahead\n | typeof Types.RichText\n | typeof Types.Image\n | typeof Types.ResponsiveOpacity\n | typeof Types.SocialLinks\n | typeof Types.Video\n | typeof Types.NavigationLinks\n\nexport type PanelDescriptor<T extends Data = Data> = Extract<\n Descriptor<T>,\n { type: PanelDescriptorType }\n>\n\nexport type DescriptorValueType<T extends Descriptor> = T extends NumberControlDefinition\n ? NumberControlValue<T>\n : T extends CheckboxControlDefinition\n ? CheckboxControlValue<T>\n : T extends TextInputControlDefinition\n ? TextInputControlValue<T>\n : T extends TextAreaControlDefinition\n ? TextAreaControlValue<T>\n : T extends SelectControlDefinition\n ? SelectControlValue<T>\n : T extends ColorControlDefinition\n ? ColorControlValue<T>\n : T extends StyleControlDefinition\n ? StyleControlFormattedValue\n : T extends ImageControlDefinition\n ? ResolveImageControlValue<T>\n : T extends ComboboxControlDefinition\n ? ComboboxControlValue<T>\n : T extends ShapeControlDefinition\n ? ShapeControlValue<T>\n : T extends ListControlDefinition\n ? ListControlValue<T>\n : T extends LinkControlDefinition\n ? LinkControlValue<T>\n : T extends SlotControlDefinition\n ? SlotControlValue\n : T extends RichTextControlDefinition\n ? RichTextControlValue\n : T['type'] extends typeof Types.ResponsiveColor\n ? ResponsiveColor | null | undefined\n : T['type'] extends typeof Types.Width\n ? ResolveWidthControlValue<T>\n : T['type'] extends typeof Types.Padding\n ? ResolvePaddingControlValue<T>\n : T['type'] extends typeof Types.Margin\n ? ResolveMarginControlValue<T>\n : T['type'] extends typeof Types.BorderRadius\n ? ResolveBorderRadiusControlValue<T>\n : T['type'] extends typeof Types.Shadows\n ? ResolveShadowsControlValue<T>\n : T['type'] extends typeof Types.Border\n ? ResolveBorderControlValue<T>\n : T extends Descriptor<infer U>\n ? U | undefined\n : never\n\nexport type PanelDescriptorValueType<T extends PanelDescriptor> = T extends PanelDescriptor<infer U>\n ? U\n : never\n","import { CopyContext, ReplacementContext } from '../state/react-page'\n\nexport type ImageControlData = string\n\nexport const ImageControlType = 'makeswift::controls::image'\n\nexport const ImageControlValueFormat = {\n URL: 'makeswift::controls::image::format::url',\n WithDimensions: 'makeswift::controls::image::format::with-dimensions',\n} as const\n\ntype ImageControlValueFormat = typeof ImageControlValueFormat[keyof typeof ImageControlValueFormat]\n\ntype ImageControlConfig = { label?: string; format?: ImageControlValueFormat }\n\nexport type ImageControlDefinition<T extends ImageControlConfig = ImageControlConfig> = {\n type: typeof ImageControlType\n config: T\n}\n\nexport function Image<T extends ImageControlConfig>(\n config: T = {} as T,\n): ImageControlDefinition<T> {\n return { type: ImageControlType, config }\n}\n\nImage.Format = ImageControlValueFormat\n\nexport function copyImageData(\n value: ImageControlData | undefined,\n context: CopyContext,\n): ImageControlData | undefined {\n if (value == null) return value\n\n return context.replacementContext.fileIds.get(value) ?? value\n}\n\nif (import.meta.vitest) {\n const { describe, test, expect } = import.meta.vitest\n\n describe.concurrent('image copy', () => {\n test('image is replaced by a one in replacement context', () => {\n // Arrange\n const data: ImageControlData = 'file-id'\n const expected = 'testing'\n\n const replacementContext = {\n elementHtmlIds: new Set(),\n elementKeys: new Map(),\n swatchIds: new Map(),\n fileIds: new Map([['file-id', 'testing']]),\n typographyIds: new Map(),\n tableIds: new Map(),\n tableColumnIds: new Map(),\n pageIds: new Map(),\n globalElementIds: new Map(),\n globalElementData: new Map(),\n }\n\n // Act\n const result = copyImageData(data, {\n replacementContext: replacementContext as ReplacementContext,\n copyElement: node => node,\n })\n\n // Assert\n expect(result).toMatchObject(expected)\n })\n })\n}\n","import { Editor } from 'slate-react'\nimport { ValueJSON } from 'slate'\nimport { OnChangeParam } from 'slate-react'\nimport { Descriptor, RichTextDescriptor, TableFormFieldsDescriptor, Types } from './descriptors'\nimport { BuilderEditMode } from '../state/modules/builder-edit-mode'\nimport { BoxModel } from '../state/modules/box-models'\nimport {\n RichTextControl,\n RichTextControlMessage,\n RichTextControlType,\n SlotControl,\n SlotControlMessage,\n SlotControlType,\n} from '../controls'\n\nexport const RichTextPropControllerMessageType = {\n CHANGE_BUILDER_EDIT_MODE: 'CHANGE_BUILDER_EDIT_MODE',\n INITIALIZE_EDITOR: 'INITIALIZE_EDITOR',\n CHANGE_EDITOR_VALUE: 'CHANGE_EDITOR_VALUE',\n FOCUS: 'FOCUS',\n BLUR: 'BLUR',\n UNDO: 'UNDO',\n REDO: 'REDO',\n CHANGE_BOX_MODEL: 'CHANGE_BOX_MODEL',\n} as const\n\ntype ChangeBuilderEditModeRichTextPropControllerMessage = {\n type: typeof RichTextPropControllerMessageType.CHANGE_BUILDER_EDIT_MODE\n editMode: BuilderEditMode\n}\n\ntype InitializeEditorRichTextPropControllerMessage = {\n type: typeof RichTextPropControllerMessageType.INITIALIZE_EDITOR\n value: ValueJSON\n}\n\ntype ChangeEditorValueRichTextPropControllerMessage = {\n type: typeof RichTextPropControllerMessageType.CHANGE_EDITOR_VALUE\n value: ValueJSON\n}\n\ntype FocusRichTextPropControllerMessage = { type: typeof RichTextPropControllerMessageType.FOCUS }\n\ntype BlurRichTextPropControllerMessage = { type: typeof RichTextPropControllerMessageType.BLUR }\n\ntype UndoRichTextPropControllerMessage = { type: typeof RichTextPropControllerMessageType.UNDO }\n\ntype RedoRichTextPropControllerMessage = { type: typeof RichTextPropControllerMessageType.REDO }\n\ntype ChangeBoxModelRichTextPropControllerMessage = {\n type: typeof RichTextPropControllerMessageType.CHANGE_BOX_MODEL\n payload: { boxModel: BoxModel | null }\n}\n\nexport type RichTextPropControllerMessage =\n | ChangeBuilderEditModeRichTextPropControllerMessage\n | InitializeEditorRichTextPropControllerMessage\n | ChangeEditorValueRichTextPropControllerMessage\n | FocusRichTextPropControllerMessage\n | BlurRichTextPropControllerMessage\n | UndoRichTextPropControllerMessage\n | RedoRichTextPropControllerMessage\n | ChangeBoxModelRichTextPropControllerMessage\n\nexport type PropControllerMessage =\n | RichTextPropControllerMessage\n | TableFormFieldsMessage\n | SlotControlMessage\n | RichTextControlMessage\n\nexport type Send<T = PropControllerMessage> = (message: T) => void\n\nexport abstract class PropController<T = PropControllerMessage> {\n protected send: Send<T>\n\n constructor(send: Send<T>) {\n this.send = send\n }\n\n abstract recv(message: T): void\n}\n\nclass DefaultPropController extends PropController {\n recv(_message: PropControllerMessage): void {\n // Do nothing.\n }\n}\n\nclass RichTextPropController extends PropController<RichTextPropControllerMessage> {\n private editor: Editor | null = null\n\n recv(message: RichTextPropControllerMessage): void {\n switch (message.type) {\n case RichTextPropControllerMessageType.CHANGE_BUILDER_EDIT_MODE: {\n switch (message.editMode) {\n case BuilderEditMode.BUILD:\n case BuilderEditMode.INTERACT:\n this.editor?.deselect().blur()\n break\n }\n break\n }\n case RichTextPropControllerMessageType.FOCUS: {\n this.editor?.focus().moveToRangeOfDocument()\n break\n }\n }\n }\n\n setSlateEditor(editor: Editor) {\n this.editor = editor\n\n this.send({\n type: RichTextPropControllerMessageType.INITIALIZE_EDITOR,\n value: editor.value.toJSON({ preserveSelection: false }),\n })\n }\n\n onChange(change: OnChangeParam) {\n this.send({\n type: RichTextPropControllerMessageType.CHANGE_EDITOR_VALUE,\n value: change.value.toJSON({ preserveSelection: true }),\n })\n }\n\n focus() {\n this.send({ type: RichTextPropControllerMessageType.FOCUS })\n }\n\n blur() {\n this.send({ type: RichTextPropControllerMessageType.BLUR })\n }\n\n undo() {\n this.send({ type: RichTextPropControllerMessageType.UNDO })\n }\n\n redo() {\n this.send({ type: RichTextPropControllerMessageType.REDO })\n }\n\n changeBoxModel(boxModel: BoxModel | null): void {\n this.send({ type: RichTextPropControllerMessageType.CHANGE_BOX_MODEL, payload: { boxModel } })\n }\n}\n\nexport const TableFormFieldsMessageType = {\n TABLE_FORM_LAYOUT_CHANGE: 'TABLE_FORM_LAYOUT_CHANGE',\n TABLE_FORM_FIELD_LAYOUT_CHANGE: 'TABLE_FORM_FIELD_LAYOUT_CHANGE',\n} as const\n\ntype TableLayoutTableFormFieldsMessage = {\n type: typeof TableFormFieldsMessageType.TABLE_FORM_LAYOUT_CHANGE\n payload: { layout: BoxModel }\n}\n\ntype TableFieldLayoutTableFormFieldsMessage = {\n type: typeof TableFormFieldsMessageType.TABLE_FORM_FIELD_LAYOUT_CHANGE\n payload: { layout: BoxModel; index: number }\n}\n\nexport type TableFormFieldsMessage =\n | TableLayoutTableFormFieldsMessage\n | TableFieldLayoutTableFormFieldsMessage\n\nexport class TableFormFieldsPropController extends PropController<TableFormFieldsMessage> {\n recv(): void {}\n\n tableFormLayoutChange(payload: { layout: BoxModel }) {\n this.send({ type: TableFormFieldsMessageType.TABLE_FORM_LAYOUT_CHANGE, payload })\n }\n\n tableFormFieldLayoutChange(payload: { layout: BoxModel; index: number }) {\n this.send({ type: TableFormFieldsMessageType.TABLE_FORM_FIELD_LAYOUT_CHANGE, payload })\n }\n}\n\ntype DescriptorPropController<T extends Descriptor> = T extends { type: typeof Types.RichText }\n ? RichTextPropController\n : T extends { type: typeof RichTextControlType }\n ? RichTextControl\n : T extends { type: typeof Types.TableFormFields }\n ? TableFormFieldsPropController\n : DefaultPropController\n\nexport type DescriptorsPropControllers<T extends Record<string, Descriptor>> = {\n [K in keyof T]: undefined extends T[K]\n ? DescriptorPropController<Exclude<T[K], undefined>>\n : DescriptorPropController<T[K]>\n}\n\ntype AnyPropController =\n | DefaultPropController\n | RichTextPropController\n | TableFormFieldsPropController\n | SlotControl\n | RichTextControl\n\nexport function createPropController(\n descriptor: RichTextDescriptor,\n send: Send<RichTextPropControllerMessage>,\n): RichTextPropController\nexport function createPropController(\n descriptor: TableFormFieldsDescriptor,\n send: Send<TableFormFieldsMessage>,\n): TableFormFieldsPropController\nexport function createPropController(descriptor: Descriptor, send: Send): DefaultPropController\nexport function createPropController<T extends PropControllerMessage>(\n descriptor: Descriptor,\n send: Send<T>,\n): AnyPropController {\n switch (descriptor.type) {\n case Types.RichText:\n return new RichTextPropController(send as Send<RichTextPropControllerMessage>)\n\n case Types.TableFormFields:\n return new TableFormFieldsPropController(send as Send<TableFormFieldsMessage>)\n\n case SlotControlType:\n return new SlotControl(send as Send<SlotControlMessage>)\n\n case RichTextControlType:\n return new RichTextControl(send as Send<RichTextControlMessage>)\n\n default:\n return new DefaultPropController(send as Send)\n }\n}\n","import { PropController } from '../prop-controllers/instances'\nimport { BoxModel } from '../state/modules/box-models'\nimport { CopyContext, Element } from '../state/react-page'\nimport { ResponsiveValue } from './types'\n\ntype SlotControlColumnData = { count: number; spans: number[][] }\n\nexport type SlotControlData = {\n elements: Element[]\n columns: ResponsiveValue<SlotControlColumnData>\n}\n\nexport const SlotControlType = 'makeswift::controls::slot'\n\nexport type SlotControlDefinition = {\n type: typeof SlotControlType\n}\n\nexport function Slot(): SlotControlDefinition {\n return { type: SlotControlType }\n}\n\nexport const SlotControlMessageType = {\n CONTAINER_BOX_MODEL_CHANGE: 'makeswift::controls::slot::message::container-box-model-change',\n ITEM_BOX_MODEL_CHANGE: 'makeswift::controls::slot::message::item-box-model-change',\n} as const\n\ntype SlotControlContainerBoxModelChangeMessage = {\n type: typeof SlotControlMessageType.CONTAINER_BOX_MODEL_CHANGE\n payload: { boxModel: BoxModel | null }\n}\n\ntype SlotControlItemBoxModelChangeMessage = {\n type: typeof SlotControlMessageType.ITEM_BOX_MODEL_CHANGE\n payload: { index: number; boxModel: BoxModel | null }\n}\n\nexport type SlotControlMessage =\n | SlotControlContainerBoxModelChangeMessage\n | SlotControlItemBoxModelChangeMessage\n\nexport class SlotControl extends PropController<SlotControlMessage> {\n recv(): void {}\n\n changeContainerBoxModel(boxModel: BoxModel | null): void {\n this.send({ type: SlotControlMessageType.CONTAINER_BOX_MODEL_CHANGE, payload: { boxModel } })\n }\n\n changeItemBoxModel(index: number, boxModel: BoxModel | null): void {\n this.send({ type: SlotControlMessageType.ITEM_BOX_MODEL_CHANGE, payload: { index, boxModel } })\n }\n}\n\nexport function copySlotData(\n value: SlotControlData | undefined,\n context: CopyContext,\n): SlotControlData | undefined {\n if (value == null) return value\n\n return {\n ...value,\n elements: value.elements.map(element => context.copyElement(element)),\n }\n}\n","import { IndexSignatureHack } from '../prop-controllers/descriptors'\nimport type * as Slate from 'slate'\nimport { BuilderEditMode } from '../state/modules/builder-edit-mode'\nimport { PropController } from '../prop-controllers/instances'\nimport { OnChangeParam, Editor } from 'slate-react'\nimport { BoxModel } from '../box-model'\n\nexport type RichTextControlData = IndexSignatureHack<Slate.ValueJSON>\n\nexport const RichTextControlType = 'makeswift::controls::rich-text'\n\nexport type RichTextControlDefinition = {\n type: typeof RichTextControlType\n}\n\nexport function RichText(): RichTextControlDefinition {\n return { type: RichTextControlType }\n}\n\nexport const RichTextControlMessageType = {\n CHANGE_BUILDER_EDIT_MODE: 'CHANGE_BUILDER_EDIT_MODE',\n INITIALIZE_EDITOR: 'INITIALIZE_EDITOR',\n CHANGE_EDITOR_VALUE: 'CHANGE_EDITOR_VALUE',\n FOCUS: 'FOCUS',\n BLUR: 'BLUR',\n UNDO: 'UNDO',\n REDO: 'REDO',\n CHANGE_BOX_MODEL: 'CHANGE_BOX_MODEL',\n} as const\n\ntype ChangeBuilderEditModeRichTextControlMessage = {\n type: typeof RichTextControlMessageType.CHANGE_BUILDER_EDIT_MODE\n editMode: BuilderEditMode\n}\n\ntype InitializeEditorRichTextControlMessage = {\n type: typeof RichTextControlMessageType.INITIALIZE_EDITOR\n value: Slate.ValueJSON\n}\n\ntype ChangeEditorValueRichTextControlMessage = {\n type: typeof RichTextControlMessageType.CHANGE_EDITOR_VALUE\n value: Slate.ValueJSON\n}\n\ntype FocusRichTextControlMessage = { type: typeof RichTextControlMessageType.FOCUS }\n\ntype BlurRichTextControlMessage = { type: typeof RichTextControlMessageType.BLUR }\n\ntype UndoRichTextControlMessage = { type: typeof RichTextControlMessageType.UNDO }\n\ntype RedoRichTextControlMessage = { type: typeof RichTextControlMessageType.REDO }\n\ntype BoxModelChangeRichControlMessage = {\n type: typeof RichTextControlMessageType.CHANGE_BOX_MODEL\n payload: { boxModel: BoxModel | null }\n}\n\nexport type RichTextControlMessage =\n | ChangeBuilderEditModeRichTextControlMessage\n | InitializeEditorRichTextControlMessage\n | ChangeEditorValueRichTextControlMessage\n | FocusRichTextControlMessage\n | BlurRichTextControlMessage\n | UndoRichTextControlMessage\n | RedoRichTextControlMessage\n | BoxModelChangeRichControlMessage\n\nexport class RichTextControl extends PropController<RichTextControlMessage> {\n private editor: Editor | null = null\n\n recv(message: RichTextControlMessage): void {\n switch (message.type) {\n case RichTextControlMessageType.CHANGE_BUILDER_EDIT_MODE: {\n switch (message.editMode) {\n case BuilderEditMode.BUILD:\n this.editor?.deselect().blur()\n break\n }\n break\n }\n case RichTextControlMessageType.FOCUS: {\n this.editor?.focus().moveToRangeOfDocument()\n break\n }\n }\n }\n\n setSlateEditor(editor: Editor) {\n this.editor = editor\n\n this.send({\n type: RichTextControlMessageType.INITIALIZE_EDITOR,\n value: editor.value.toJSON({ preserveSelection: false }),\n })\n }\n\n onChange(change: OnChangeParam) {\n this.send({\n type: RichTextControlMessageType.CHANGE_EDITOR_VALUE,\n value: change.value.toJSON({ preserveSelection: true }),\n })\n }\n\n focus() {\n this.send({ type: RichTextControlMessageType.FOCUS })\n }\n\n blur() {\n this.send({ type: RichTextControlMessageType.BLUR })\n }\n\n undo() {\n this.send({ type: RichTextControlMessageType.UNDO })\n }\n\n redo() {\n this.send({ type: RichTextControlMessageType.REDO })\n }\n\n changeBoxModel(boxModel: BoxModel | null): void {\n this.send({ type: RichTextControlMessageType.CHANGE_BOX_MODEL, payload: { boxModel } })\n }\n}\n"],"names":["ActionTypes"],"mappings":"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"}
@@ -21,6 +21,23 @@ var __publicField = (obj, key, value) => {
21
21
  __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
22
22
  return value;
23
23
  };
24
+ import { A as ActionTypes } from "./actions.es.js";
25
+ const BuilderEditMode = {
26
+ BUILD: "build",
27
+ CONTENT: "content",
28
+ INTERACT: "interact"
29
+ };
30
+ function getInitialState() {
31
+ return null;
32
+ }
33
+ function reducer(state = getInitialState(), action) {
34
+ switch (action.type) {
35
+ case ActionTypes.SET_BUILDER_EDIT_MODE:
36
+ return action.payload.editMode;
37
+ default:
38
+ return state;
39
+ }
40
+ }
24
41
  const ColorControlType = "makeswift::controls::color";
25
42
  function Color(config = {}) {
26
43
  return { type: ColorControlType, config };
@@ -229,7 +246,7 @@ function ResponsiveOpacity(options = {}) {
229
246
  function ResponsiveSelect(options) {
230
247
  return { type: Types.ResponsiveSelect, options };
231
248
  }
232
- function RichText(options = {}) {
249
+ function RichText$1(options = {}) {
233
250
  return { type: Types.RichText, options };
234
251
  }
235
252
  const ShadowsPropControllerFormat = {
@@ -306,7 +323,7 @@ var descriptors = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.definePro
306
323
  ResponsiveNumber,
307
324
  ResponsiveOpacity,
308
325
  ResponsiveSelect,
309
- RichText,
326
+ RichText: RichText$1,
310
327
  ShadowsPropControllerFormat,
311
328
  Shadows,
312
329
  Shape,
@@ -336,10 +353,6 @@ function copyImageData(value, context) {
336
353
  return value;
337
354
  return (_a = context.replacementContext.fileIds.get(value)) != null ? _a : value;
338
355
  }
339
- const BuilderEditMode = {
340
- BUILD: "build",
341
- CONTENT: "content"
342
- };
343
356
  const RichTextPropControllerMessageType = {
344
357
  CHANGE_BUILDER_EDIT_MODE: "CHANGE_BUILDER_EDIT_MODE",
345
358
  INITIALIZE_EDITOR: "INITIALIZE_EDITOR",
@@ -347,7 +360,8 @@ const RichTextPropControllerMessageType = {
347
360
  FOCUS: "FOCUS",
348
361
  BLUR: "BLUR",
349
362
  UNDO: "UNDO",
350
- REDO: "REDO"
363
+ REDO: "REDO",
364
+ CHANGE_BOX_MODEL: "CHANGE_BOX_MODEL"
351
365
  };
352
366
  class PropController {
353
367
  constructor(send) {
@@ -370,14 +384,16 @@ class RichTextPropController extends PropController {
370
384
  case RichTextPropControllerMessageType.CHANGE_BUILDER_EDIT_MODE: {
371
385
  switch (message.editMode) {
372
386
  case BuilderEditMode.BUILD:
387
+ case BuilderEditMode.INTERACT:
373
388
  (_a = this.editor) == null ? void 0 : _a.deselect().blur();
374
389
  break;
375
- case BuilderEditMode.CONTENT:
376
- (_b = this.editor) == null ? void 0 : _b.focus().moveToRangeOfDocument();
377
- break;
378
390
  }
379
391
  break;
380
392
  }
393
+ case RichTextPropControllerMessageType.FOCUS: {
394
+ (_b = this.editor) == null ? void 0 : _b.focus().moveToRangeOfDocument();
395
+ break;
396
+ }
381
397
  }
382
398
  }
383
399
  setSlateEditor(editor) {
@@ -405,6 +421,9 @@ class RichTextPropController extends PropController {
405
421
  redo() {
406
422
  this.send({ type: RichTextPropControllerMessageType.REDO });
407
423
  }
424
+ changeBoxModel(boxModel) {
425
+ this.send({ type: RichTextPropControllerMessageType.CHANGE_BOX_MODEL, payload: { boxModel } });
426
+ }
408
427
  }
409
428
  const TableFormFieldsMessageType = {
410
429
  TABLE_FORM_LAYOUT_CHANGE: "TABLE_FORM_LAYOUT_CHANGE",
@@ -428,6 +447,8 @@ function createPropController(descriptor, send) {
428
447
  return new TableFormFieldsPropController(send);
429
448
  case SlotControlType:
430
449
  return new SlotControl(send);
450
+ case RichTextControlType:
451
+ return new RichTextControl(send);
431
452
  default:
432
453
  return new DefaultPropController(send);
433
454
  }
@@ -457,5 +478,70 @@ function copySlotData(value, context) {
457
478
  elements: value.elements.map((element) => context.copyElement(element))
458
479
  });
459
480
  }
460
- export { Color as $, NavigationLinks as A, Backgrounds as B, ColorControlType as C, Date as D, ElementID as E, Font as F, GapY as G, SocialLinks as H, ImageControlType as I, RichText as J, StyleControlProperty as K, Link as L, Margin as M, Number as N, ImageControlValueFormat as O, Padding as P, BorderPropControllerFormat as Q, RichTextPropControllerMessageType as R, SlotControlType as S, Types as T, ShadowsPropControllerFormat as U, Video as V, Width as W, BorderRadiusPropControllerFormat as X, MarginPropControllerFormat as Y, PaddingPropControllerFormat as Z, WidthPropControllerFormat as _, StyleControlType as a, Image as a0, Slot as a1, SlotControlMessageType as a2, SlotControl as a3, Style as a4, createPropController as a5, copyStyleData as b, copySlotData as c, copyImageData as d, copyColorData as e, descriptors as f, TableFormFieldsMessageType as g, ResponsiveIconRadioGroup as h, Border as i, BorderRadius as j, Shadows as k, GapX as l, ResponsiveSelect as m, ResponsiveNumber as n, Checkbox as o, Grid as p, TextInput as q, ResponsiveColor as r, TextStyle as s, Images as t, ResponsiveLength as u, TextArea as v, Table as w, TableFormFields as x, Image$1 as y, ResponsiveOpacity as z };
461
- //# sourceMappingURL=slot.es.js.map
481
+ const RichTextControlType = "makeswift::controls::rich-text";
482
+ function RichText() {
483
+ return { type: RichTextControlType };
484
+ }
485
+ const RichTextControlMessageType = {
486
+ CHANGE_BUILDER_EDIT_MODE: "CHANGE_BUILDER_EDIT_MODE",
487
+ INITIALIZE_EDITOR: "INITIALIZE_EDITOR",
488
+ CHANGE_EDITOR_VALUE: "CHANGE_EDITOR_VALUE",
489
+ FOCUS: "FOCUS",
490
+ BLUR: "BLUR",
491
+ UNDO: "UNDO",
492
+ REDO: "REDO",
493
+ CHANGE_BOX_MODEL: "CHANGE_BOX_MODEL"
494
+ };
495
+ class RichTextControl extends PropController {
496
+ constructor() {
497
+ super(...arguments);
498
+ __publicField(this, "editor", null);
499
+ }
500
+ recv(message) {
501
+ var _a, _b;
502
+ switch (message.type) {
503
+ case RichTextControlMessageType.CHANGE_BUILDER_EDIT_MODE: {
504
+ switch (message.editMode) {
505
+ case BuilderEditMode.BUILD:
506
+ (_a = this.editor) == null ? void 0 : _a.deselect().blur();
507
+ break;
508
+ }
509
+ break;
510
+ }
511
+ case RichTextControlMessageType.FOCUS: {
512
+ (_b = this.editor) == null ? void 0 : _b.focus().moveToRangeOfDocument();
513
+ break;
514
+ }
515
+ }
516
+ }
517
+ setSlateEditor(editor) {
518
+ this.editor = editor;
519
+ this.send({
520
+ type: RichTextControlMessageType.INITIALIZE_EDITOR,
521
+ value: editor.value.toJSON({ preserveSelection: false })
522
+ });
523
+ }
524
+ onChange(change) {
525
+ this.send({
526
+ type: RichTextControlMessageType.CHANGE_EDITOR_VALUE,
527
+ value: change.value.toJSON({ preserveSelection: true })
528
+ });
529
+ }
530
+ focus() {
531
+ this.send({ type: RichTextControlMessageType.FOCUS });
532
+ }
533
+ blur() {
534
+ this.send({ type: RichTextControlMessageType.BLUR });
535
+ }
536
+ undo() {
537
+ this.send({ type: RichTextControlMessageType.UNDO });
538
+ }
539
+ redo() {
540
+ this.send({ type: RichTextControlMessageType.REDO });
541
+ }
542
+ changeBoxModel(boxModel) {
543
+ this.send({ type: RichTextControlMessageType.CHANGE_BOX_MODEL, payload: { boxModel } });
544
+ }
545
+ }
546
+ export { WidthPropControllerFormat as $, ResponsiveOpacity as A, Backgrounds as B, ColorControlType as C, Date as D, ElementID as E, Font as F, GapY as G, NavigationLinks as H, ImageControlType as I, SocialLinks as J, RichText$1 as K, Link as L, Margin as M, Number as N, StyleControlProperty as O, Padding as P, ImageControlValueFormat as Q, RichTextPropControllerMessageType as R, SlotControlType as S, Types as T, BorderPropControllerFormat as U, Video as V, Width as W, ShadowsPropControllerFormat as X, BorderRadiusPropControllerFormat as Y, MarginPropControllerFormat as Z, PaddingPropControllerFormat as _, StyleControlType as a, RichTextControlType as a0, Color as a1, Image as a2, Slot as a3, SlotControlMessageType as a4, SlotControl as a5, Style as a6, RichText as a7, RichTextControlMessageType as a8, RichTextControl as a9, BuilderEditMode as aa, createPropController as ab, copyStyleData as b, copySlotData as c, copyImageData as d, copyColorData as e, descriptors as f, TableFormFieldsMessageType as g, ResponsiveIconRadioGroup as h, Border as i, BorderRadius as j, Shadows as k, GapX as l, ResponsiveSelect as m, ResponsiveNumber as n, Checkbox as o, Grid as p, TextInput as q, reducer as r, ResponsiveColor as s, TextStyle as t, Images as u, ResponsiveLength as v, TextArea as w, Table as x, TableFormFields as y, Image$1 as z };
547
+ //# sourceMappingURL=rich-text.es.js.map