@makeswift/runtime 0.10.2 → 0.10.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 (180) hide show
  1. package/dist/Box.cjs.js +1 -3
  2. package/dist/Box.cjs.js.map +1 -1
  3. package/dist/Box.es.js +2 -4
  4. package/dist/Box.es.js.map +1 -1
  5. package/dist/Button.cjs.js +5 -5
  6. package/dist/Button.es.js +6 -6
  7. package/dist/Carousel.cjs.js +4 -4
  8. package/dist/Carousel.es.js +5 -5
  9. package/dist/Countdown.cjs.js +3 -5
  10. package/dist/Countdown.cjs.js.map +1 -1
  11. package/dist/Countdown.es.js +4 -6
  12. package/dist/Countdown.es.js.map +1 -1
  13. package/dist/Divider.cjs.js +2 -4
  14. package/dist/Divider.cjs.js.map +1 -1
  15. package/dist/Divider.es.js +3 -5
  16. package/dist/Divider.es.js.map +1 -1
  17. package/dist/Embed.cjs.js +3 -1
  18. package/dist/Embed.cjs.js.map +1 -1
  19. package/dist/Embed.es.js +4 -2
  20. package/dist/Embed.es.js.map +1 -1
  21. package/dist/Form.cjs.js +15 -15
  22. package/dist/Form.cjs.js.map +1 -1
  23. package/dist/Form.es.js +7 -7
  24. package/dist/Image.cjs.js +13 -13
  25. package/dist/Image.cjs.js.map +1 -1
  26. package/dist/Image.es.js +13 -13
  27. package/dist/LiveProvider.cjs.js +2 -4
  28. package/dist/LiveProvider.cjs.js.map +1 -1
  29. package/dist/LiveProvider.es.js +4 -6
  30. package/dist/LiveProvider.es.js.map +1 -1
  31. package/dist/Navigation.cjs.js +13 -13
  32. package/dist/Navigation.cjs.js.map +1 -1
  33. package/dist/Navigation.es.js +13 -13
  34. package/dist/PreviewProvider.cjs.js +2 -4
  35. package/dist/PreviewProvider.cjs.js.map +1 -1
  36. package/dist/PreviewProvider.es.js +4 -6
  37. package/dist/PreviewProvider.es.js.map +1 -1
  38. package/dist/ReadOnlyText.cjs.js +8 -7
  39. package/dist/ReadOnlyText.cjs.js.map +1 -1
  40. package/dist/ReadOnlyText.es.js +5 -4
  41. package/dist/ReadOnlyText.es.js.map +1 -1
  42. package/dist/ReadOnlyTextV2.cjs.js +8 -61
  43. package/dist/ReadOnlyTextV2.cjs.js.map +1 -1
  44. package/dist/ReadOnlyTextV2.es.js +10 -63
  45. package/dist/ReadOnlyTextV2.es.js.map +1 -1
  46. package/dist/Root.cjs.js +2 -4
  47. package/dist/Root.cjs.js.map +1 -1
  48. package/dist/Root.es.js +3 -5
  49. package/dist/Root.es.js.map +1 -1
  50. package/dist/SocialLinks.cjs.js +7 -7
  51. package/dist/SocialLinks.cjs.js.map +1 -1
  52. package/dist/SocialLinks.es.js +8 -8
  53. package/dist/Video.cjs.js +3 -1
  54. package/dist/Video.cjs.js.map +1 -1
  55. package/dist/Video.es.js +4 -2
  56. package/dist/Video.es.js.map +1 -1
  57. package/dist/builder.cjs.js +3 -1
  58. package/dist/builder.cjs.js.map +1 -1
  59. package/dist/builder.es.js +3 -1
  60. package/dist/builder.es.js.map +1 -1
  61. package/dist/components.cjs.js +4 -4
  62. package/dist/components.es.js +4 -4
  63. package/dist/control-serialization.cjs.js +1 -0
  64. package/dist/control-serialization.cjs.js.map +1 -1
  65. package/dist/control-serialization.es.js +2 -1
  66. package/dist/control-serialization.es.js.map +1 -1
  67. package/dist/controls.cjs.js +5 -1
  68. package/dist/controls.cjs.js.map +1 -1
  69. package/dist/controls.es.js +4 -2
  70. package/dist/controls.es.js.map +1 -1
  71. package/dist/index.cjs.js +121 -257
  72. package/dist/index.cjs.js.map +1 -1
  73. package/dist/index.cjs2.js +1 -0
  74. package/dist/index.cjs2.js.map +1 -1
  75. package/dist/index.cjs3.js +107 -21
  76. package/dist/index.cjs3.js.map +1 -1
  77. package/dist/index.cjs4.js +57 -16
  78. package/dist/index.cjs4.js.map +1 -1
  79. package/dist/index.cjs5.js +42 -81
  80. package/dist/index.cjs5.js.map +1 -1
  81. package/dist/index.cjs6.js +82 -17
  82. package/dist/index.cjs6.js.map +1 -1
  83. package/dist/index.cjs7.js +18 -377
  84. package/dist/index.cjs7.js.map +1 -1
  85. package/dist/index.cjs8.js +258 -181
  86. package/dist/index.cjs8.js.map +1 -1
  87. package/dist/index.cjs9.js +343 -0
  88. package/dist/index.cjs9.js.map +1 -0
  89. package/dist/index.es.js +126 -261
  90. package/dist/index.es.js.map +1 -1
  91. package/dist/index.es2.js +2 -1
  92. package/dist/index.es2.js.map +1 -1
  93. package/dist/index.es3.js +103 -22
  94. package/dist/index.es3.js.map +1 -1
  95. package/dist/index.es4.js +57 -16
  96. package/dist/index.es4.js.map +1 -1
  97. package/dist/index.es5.js +42 -80
  98. package/dist/index.es5.js.map +1 -1
  99. package/dist/index.es6.js +81 -17
  100. package/dist/index.es6.js.map +1 -1
  101. package/dist/index.es7.js +18 -371
  102. package/dist/index.es7.js.map +1 -1
  103. package/dist/index.es8.js +259 -182
  104. package/dist/index.es8.js.map +1 -1
  105. package/dist/index.es9.js +336 -0
  106. package/dist/index.es9.js.map +1 -0
  107. package/dist/main.cjs.js +3 -1
  108. package/dist/main.cjs.js.map +1 -1
  109. package/dist/main.es.js +3 -1
  110. package/dist/main.es.js.map +1 -1
  111. package/dist/next.cjs.js +3 -5
  112. package/dist/next.cjs.js.map +1 -1
  113. package/dist/next.es.js +4 -6
  114. package/dist/next.es.js.map +1 -1
  115. package/dist/prop-controllers.cjs.js +3 -1
  116. package/dist/prop-controllers.cjs.js.map +1 -1
  117. package/dist/prop-controllers.es.js +3 -1
  118. package/dist/prop-controllers.es.js.map +1 -1
  119. package/dist/react-page.cjs.js +499 -314
  120. package/dist/react-page.cjs.js.map +1 -1
  121. package/dist/react-page.es.js +498 -315
  122. package/dist/react-page.es.js.map +1 -1
  123. package/dist/react.cjs.js +3 -5
  124. package/dist/react.cjs.js.map +1 -1
  125. package/dist/react.es.js +3 -5
  126. package/dist/react.es.js.map +1 -1
  127. package/dist/slate.cjs.js +11 -8
  128. package/dist/slate.cjs.js.map +1 -1
  129. package/dist/slate.es.js +11 -9
  130. package/dist/slate.es.js.map +1 -1
  131. package/dist/toText.cjs.js +67 -0
  132. package/dist/toText.cjs.js.map +1 -0
  133. package/dist/toText.es.js +66 -0
  134. package/dist/toText.es.js.map +1 -0
  135. package/dist/types/src/components/builtin/Text/register.d.ts.map +1 -1
  136. package/dist/types/src/controls/control.d.ts +1 -1
  137. package/dist/types/src/controls/control.d.ts.map +1 -1
  138. package/dist/types/src/controls/rich-text/__test__/copy.test.d.ts +2 -0
  139. package/dist/types/src/controls/rich-text/__test__/copy.test.d.ts.map +1 -0
  140. package/dist/types/src/controls/rich-text/__test__/introspection.test.d.ts.map +1 -0
  141. package/dist/types/src/controls/rich-text/__test__/translation.test.d.ts.map +1 -0
  142. package/dist/types/src/controls/rich-text/copy.d.ts +4 -0
  143. package/dist/types/src/controls/rich-text/copy.d.ts.map +1 -0
  144. package/dist/types/src/controls/rich-text/index.d.ts +1 -0
  145. package/dist/types/src/controls/rich-text/index.d.ts.map +1 -1
  146. package/dist/types/src/controls/rich-text-v2/__test__/copy.test.d.ts +2 -0
  147. package/dist/types/src/controls/rich-text-v2/__test__/copy.test.d.ts.map +1 -0
  148. package/dist/types/src/controls/rich-text-v2/__test__/introspection.test.d.ts.map +1 -0
  149. package/dist/types/src/controls/rich-text-v2/copy.d.ts +4 -0
  150. package/dist/types/src/controls/rich-text-v2/copy.d.ts.map +1 -0
  151. package/dist/types/src/controls/rich-text-v2/index.d.ts +1 -0
  152. package/dist/types/src/controls/rich-text-v2/index.d.ts.map +1 -1
  153. package/dist/types/src/controls/rich-text-v2/rich-text-v2.d.ts +2 -4
  154. package/dist/types/src/controls/rich-text-v2/rich-text-v2.d.ts.map +1 -1
  155. package/dist/types/src/controls/rich-text-v2/translation.d.ts +1 -1
  156. package/dist/types/src/controls/rich-text-v2/translation.d.ts.map +1 -1
  157. package/dist/types/src/runtimes/react/controls/rich-text-v2/EditableTextV2/editable-text-v2.d.ts.map +1 -1
  158. package/dist/types/src/runtimes/react/controls/rich-text-v2/EditableTextV2/render-element.d.ts.map +1 -1
  159. package/dist/types/src/runtimes/react/controls/rich-text-v2/EditableTextV2/usePresetValue.d.ts +10 -0
  160. package/dist/types/src/runtimes/react/controls/rich-text-v2/EditableTextV2/usePresetValue.d.ts.map +1 -0
  161. package/dist/types/src/runtimes/react/controls/rich-text-v2/ReadOnlyTextV2.d.ts.map +1 -1
  162. package/dist/types/src/slate/BuilderPlugin/index.d.ts +2 -1
  163. package/dist/types/src/slate/BuilderPlugin/index.d.ts.map +1 -1
  164. package/dist/types/src/slate/InlineModePlugin/index.d.ts.map +1 -1
  165. package/dist/types/src/slate/InlinePlugin/index.d.ts +2 -2
  166. package/dist/types/src/slate/TextAlignPlugin/index.d.ts +3 -3
  167. package/dist/types/src/slate/TypographyPlugin/index.d.ts +3 -3
  168. package/dist/types/src/slate/index.d.ts +1 -0
  169. package/dist/types/src/slate/index.d.ts.map +1 -1
  170. package/dist/types/src/slate/utils/index.d.ts +2 -0
  171. package/dist/types/src/slate/utils/index.d.ts.map +1 -0
  172. package/dist/types/src/slate/utils/toText.d.ts +4 -0
  173. package/dist/types/src/slate/utils/toText.d.ts.map +1 -0
  174. package/package.json +1 -1
  175. package/dist/types/src/controls/rich-text/introspection.test.d.ts.map +0 -1
  176. package/dist/types/src/controls/rich-text/translation.test.d.ts.map +0 -1
  177. package/dist/types/src/controls/rich-text-v2/introspection.test.d.ts.map +0 -1
  178. /package/dist/types/src/controls/rich-text/{introspection.test.d.ts → __test__/introspection.test.d.ts} +0 -0
  179. /package/dist/types/src/controls/rich-text/{translation.test.d.ts → __test__/translation.test.d.ts} +0 -0
  180. /package/dist/types/src/controls/rich-text-v2/{introspection.test.d.ts → __test__/introspection.test.d.ts} +0 -0
@@ -31,38 +31,36 @@ var __objRest = (source, exclude) => {
31
31
  return target;
32
32
  };
33
33
  Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
34
+ var css = require("@emotion/css");
35
+ var cssBoxModel = require("css-box-model");
36
+ var isHotkey = require("is-hotkey");
34
37
  var React = require("react");
35
38
  var slate = require("slate");
36
- var isHotkey = require("is-hotkey");
37
39
  var slateReact = require("slate-react");
38
- var reactPage = require("./react-page.cjs.js");
39
40
  var next = require("./index.cjs.js");
40
- var index$2 = require("./index.cjs4.js");
41
- var index = require("./index.cjs5.js");
42
- var index$1 = require("./index.cjs6.js");
43
- var useIsomorphicLayoutEffect = require("./useIsomorphicLayoutEffect.cjs.js");
41
+ var reactPage = require("./react-page.cjs.js");
42
+ require("uuid");
44
43
  var jsxRuntime = require("react/jsx-runtime");
45
- require("./actions.cjs.js");
46
- require("redux");
47
- require("redux-thunk");
44
+ var index$1 = require("./index.cjs5.js");
48
45
  require("./state/breakpoints.cjs.js");
49
- require("zod");
50
- require("@emotion/css");
51
- require("@emotion/serialize");
52
- require("@emotion/utils");
46
+ var index = require("./index.cjs3.js");
47
+ require("./actions.cjs.js");
48
+ var useIsomorphicLayoutEffect = require("./useIsomorphicLayoutEffect.cjs.js");
53
49
  require("use-sync-external-store/shim/with-selector");
54
50
  require("next/dynamic");
55
51
  require("./text-input.cjs.js");
56
52
  require("./combobox.cjs.js");
57
53
  require("use-sync-external-store/shim");
54
+ require("redux");
55
+ require("redux-thunk");
58
56
  require("./types.cjs.js");
59
57
  require("./box-models.cjs.js");
60
- require("css-box-model");
61
58
  require("color");
62
59
  require("scroll-into-view-if-needed");
63
60
  require("react-dom");
64
61
  require("html-react-parser");
65
62
  require("next/head");
63
+ require("zod");
66
64
  require("@emotion/server/create-instance");
67
65
  require("next/document");
68
66
  require("cors");
@@ -71,16 +69,190 @@ require("cookie");
71
69
  require("http-proxy");
72
70
  require("set-cookie-parser");
73
71
  require("./constants.cjs.js");
74
- require("uuid");
75
72
  require("corporate-ipsum");
73
+ require("@emotion/serialize");
74
+ require("@emotion/utils");
76
75
  require("next/link");
77
76
  function _interopDefaultLegacy(e) {
78
77
  return e && typeof e === "object" && "default" in e ? e : { "default": e };
79
78
  }
80
79
  var isHotkey__default = /* @__PURE__ */ _interopDefaultLegacy(isHotkey);
80
+ function BlockElement({
81
+ element,
82
+ attributes,
83
+ children
84
+ }) {
85
+ const blockStyles = [reactPage.useStyle({
86
+ margin: 0
87
+ }), reactPage.useStyle(next.useResponsiveStyle([element.textAlign], ([textAlign = "left"]) => ({
88
+ textAlign
89
+ })))];
90
+ const quoteStyles = reactPage.useStyle({
91
+ padding: "0.5em 10px",
92
+ fontSize: "1.25em",
93
+ fontWeight: "300",
94
+ borderLeft: "5px solid rgba(0, 0, 0, 0.1)"
95
+ });
96
+ switch (element.type) {
97
+ case reactPage.BlockType.Default:
98
+ case reactPage.BlockType.Paragraph:
99
+ return /* @__PURE__ */ jsxRuntime.jsx("p", __spreadProps(__spreadValues({}, attributes), {
100
+ className: css.cx(...blockStyles),
101
+ children
102
+ }));
103
+ case reactPage.BlockType.Heading1:
104
+ return /* @__PURE__ */ jsxRuntime.jsx("h1", __spreadProps(__spreadValues({}, attributes), {
105
+ className: css.cx(...blockStyles),
106
+ children
107
+ }));
108
+ case reactPage.BlockType.Heading2:
109
+ return /* @__PURE__ */ jsxRuntime.jsx("h2", __spreadProps(__spreadValues({}, attributes), {
110
+ className: css.cx(...blockStyles),
111
+ children
112
+ }));
113
+ case reactPage.BlockType.Heading3:
114
+ return /* @__PURE__ */ jsxRuntime.jsx("h3", __spreadProps(__spreadValues({}, attributes), {
115
+ className: css.cx(...blockStyles),
116
+ children
117
+ }));
118
+ case reactPage.BlockType.Heading4:
119
+ return /* @__PURE__ */ jsxRuntime.jsx("h4", __spreadProps(__spreadValues({}, attributes), {
120
+ className: css.cx(...blockStyles),
121
+ children
122
+ }));
123
+ case reactPage.BlockType.Heading5:
124
+ return /* @__PURE__ */ jsxRuntime.jsx("h5", __spreadProps(__spreadValues({}, attributes), {
125
+ className: css.cx(...blockStyles),
126
+ children
127
+ }));
128
+ case reactPage.BlockType.Heading6:
129
+ return /* @__PURE__ */ jsxRuntime.jsx("h6", __spreadProps(__spreadValues({}, attributes), {
130
+ className: css.cx(...blockStyles),
131
+ children
132
+ }));
133
+ case reactPage.BlockType.BlockQuote:
134
+ return /* @__PURE__ */ jsxRuntime.jsx("blockquote", __spreadProps(__spreadValues({}, attributes), {
135
+ className: css.cx(...blockStyles, quoteStyles),
136
+ children
137
+ }));
138
+ case reactPage.BlockType.OrderedList:
139
+ return /* @__PURE__ */ jsxRuntime.jsx("ol", __spreadProps(__spreadValues({}, attributes), {
140
+ className: css.cx(...blockStyles),
141
+ style: {
142
+ listStylePosition: "inside"
143
+ },
144
+ children
145
+ }));
146
+ case reactPage.BlockType.UnorderedList:
147
+ return /* @__PURE__ */ jsxRuntime.jsx("ul", __spreadProps(__spreadValues({}, attributes), {
148
+ className: css.cx(...blockStyles),
149
+ style: {
150
+ listStylePosition: "inside"
151
+ },
152
+ children
153
+ }));
154
+ case reactPage.BlockType.ListItem:
155
+ return /* @__PURE__ */ jsxRuntime.jsx("li", __spreadProps(__spreadValues({}, attributes), {
156
+ className: css.cx(...blockStyles),
157
+ children
158
+ }));
159
+ case reactPage.BlockType.ListItemChild:
160
+ return /* @__PURE__ */ jsxRuntime.jsx("span", __spreadProps(__spreadValues({}, attributes), {
161
+ className: css.cx(...blockStyles),
162
+ children
163
+ }));
164
+ }
165
+ }
166
+ function StyledLink(_a) {
167
+ var _b = _a, {
168
+ className
169
+ } = _b, restOfProps = __objRest(_b, [
170
+ "className"
171
+ ]);
172
+ return /* @__PURE__ */ jsxRuntime.jsx(index.Link, __spreadProps(__spreadValues({}, restOfProps), {
173
+ className: css.cx(reactPage.useStyle({
174
+ textDecoration: "none"
175
+ }), className)
176
+ }));
177
+ }
178
+ function InlineElement({
179
+ element,
180
+ attributes,
181
+ children
182
+ }) {
183
+ var _a;
184
+ switch (element.type) {
185
+ case reactPage.InlineType.Code:
186
+ return /* @__PURE__ */ jsxRuntime.jsx("code", __spreadProps(__spreadValues({}, attributes), {
187
+ children
188
+ }));
189
+ case reactPage.InlineType.SuperScript:
190
+ return /* @__PURE__ */ jsxRuntime.jsx("sup", __spreadProps(__spreadValues({}, attributes), {
191
+ children
192
+ }));
193
+ case reactPage.InlineType.SubScript:
194
+ return /* @__PURE__ */ jsxRuntime.jsx("sub", __spreadProps(__spreadValues({}, attributes), {
195
+ children
196
+ }));
197
+ case reactPage.InlineType.Link:
198
+ return /* @__PURE__ */ jsxRuntime.jsx(StyledLink, __spreadProps(__spreadValues({}, attributes), {
199
+ link: (_a = element.link) != null ? _a : void 0,
200
+ children
201
+ }));
202
+ }
203
+ }
204
+ function Element(_c) {
205
+ var _d = _c, {
206
+ element
207
+ } = _d, props = __objRest(_d, [
208
+ "element"
209
+ ]);
210
+ switch (element.type) {
211
+ case reactPage.InlineType.Code:
212
+ case reactPage.InlineType.SuperScript:
213
+ case reactPage.InlineType.SubScript:
214
+ case reactPage.InlineType.Link:
215
+ return /* @__PURE__ */ jsxRuntime.jsx(InlineElement, __spreadValues({
216
+ element
217
+ }, props));
218
+ case reactPage.BlockType.Default:
219
+ case reactPage.BlockType.Paragraph:
220
+ case reactPage.BlockType.Heading1:
221
+ case reactPage.BlockType.Heading2:
222
+ case reactPage.BlockType.Heading3:
223
+ case reactPage.BlockType.Heading4:
224
+ case reactPage.BlockType.Heading5:
225
+ case reactPage.BlockType.Heading6:
226
+ case reactPage.BlockType.BlockQuote:
227
+ case reactPage.BlockType.OrderedList:
228
+ case reactPage.BlockType.UnorderedList:
229
+ case reactPage.BlockType.ListItem:
230
+ case reactPage.BlockType.ListItemChild:
231
+ return /* @__PURE__ */ jsxRuntime.jsx(BlockElement, __spreadValues({
232
+ element
233
+ }, props));
234
+ default:
235
+ return /* @__PURE__ */ jsxRuntime.jsx("span", __spreadProps(__spreadValues({}, props.attributes), {
236
+ children: props.children
237
+ }));
238
+ }
239
+ }
240
+ function Leaf(_e) {
241
+ var _f = _e, {
242
+ leaf
243
+ } = _f, props = __objRest(_f, [
244
+ "leaf"
245
+ ]);
246
+ const enhancedTypography = next.useEnhancedTypography(leaf.typography);
247
+ const typographyClassName = next.useTypographyClassName(enhancedTypography);
248
+ return /* @__PURE__ */ jsxRuntime.jsx("span", __spreadProps(__spreadValues({}, props.attributes), {
249
+ className: typographyClassName,
250
+ children: props.children
251
+ }));
252
+ }
81
253
  function useSyncDOMSelection(editor, isEnabled) {
82
254
  useIsomorphicLayoutEffect.useIsomorphicLayoutEffect(() => {
83
- if (!isEnabled.current || editor.selection == null || slateReact.ReactEditor.isFocused(editor))
255
+ if (!isEnabled || editor.selection == null || slateReact.ReactEditor.isFocused(editor))
84
256
  return;
85
257
  try {
86
258
  const root = slateReact.ReactEditor.findDocumentOrShadowRoot(editor);
@@ -100,206 +272,111 @@ function useSyncDOMSelection(editor, isEnabled) {
100
272
  }
101
273
  });
102
274
  }
103
- function RichTextV2Element(_a) {
104
- var _b = _a, {
105
- definition,
106
- plugins
107
- } = _b, props = __objRest(_b, [
108
- "definition",
109
- "plugins"
110
- ]);
111
- function initialRenderElement(props2) {
112
- return props2.children;
113
- }
114
- const renderElement = plugins.reduce((renderFn, plugin) => (props2) => {
115
- const {
116
- control,
117
- renderElement: renderElement2
118
- } = plugin;
119
- if ((control == null ? void 0 : control.definition) == null || renderElement2 == null)
120
- return renderFn(props2);
121
- if (control.getElementValue == null)
122
- return renderElement2(renderFn, void 0)(props2);
123
- return /* @__PURE__ */ jsxRuntime.jsx(next.ControlValue, {
124
- definition: control.definition,
125
- data: control.getElementValue(props2.element),
126
- children: (value) => renderElement2(renderFn, value)(props2)
127
- });
128
- }, initialRenderElement);
129
- return renderElement(props);
130
- }
131
- function RichTextV2Leaf(_c) {
132
- var _d = _c, {
133
- definition,
134
- plugins
135
- } = _d, props = __objRest(_d, [
136
- "definition",
137
- "plugins"
138
- ]);
139
- function initialRenderLeaf({
140
- attributes,
141
- children,
142
- leaf
143
- }) {
144
- return /* @__PURE__ */ jsxRuntime.jsx("span", __spreadProps(__spreadValues({
145
- className: leaf.className
146
- }, attributes), {
147
- children
148
- }));
149
- }
150
- const renderLeaf = plugins.reduce((renderFn, plugin) => (props2) => {
151
- const {
152
- control,
153
- renderLeaf: renderLeaf2
154
- } = plugin;
155
- if ((control == null ? void 0 : control.definition) == null || renderLeaf2 == null)
156
- return renderFn(props2);
157
- if (control.getLeafValue == null)
158
- return renderLeaf2(renderFn, void 0)(props2);
159
- return /* @__PURE__ */ jsxRuntime.jsx(next.ControlValue, {
160
- definition: control.definition,
161
- data: control.getLeafValue(props2.leaf),
162
- children: (value) => renderLeaf2(renderFn, value)(props2)
163
- });
164
- }, initialRenderLeaf);
165
- return renderLeaf(props);
166
- }
167
- function isChangeWithinPreviousSec(change) {
168
- var _a;
169
- return performance.now() - ((_a = change == null ? void 0 : change.time) != null ? _a : 0) < 1e3;
170
- }
171
- function useSyncRemoteChanges(editor, data) {
275
+ const COMMIT_DEBOUNCE_DELAY = 500;
276
+ function useSyncWithBuilder(editor, text) {
277
+ const [shouldCommit, setShouldCommit] = React.useState(true);
172
278
  const isInBuilder = next.useIsInBuilder();
173
279
  React.useEffect(() => {
174
- var _a, _b, _c;
175
- if (!isChangeWithinPreviousSec(editor.localChanges.get((_a = data == null ? void 0 : data.key) != null ? _a : "")) && data && isInBuilder) {
176
- editor.children = reactPage.richTextV2DataToDescendents(data);
177
- editor.selection = (_c = (_b = editor == null ? void 0 : editor.localChanges.get(data.key)) == null ? void 0 : _b.selection) != null ? _c : null;
178
- editor.onChange();
280
+ if (shouldCommit && text && isInBuilder) {
281
+ const nextValue = reactPage.richTextDTOtoDAO(text);
282
+ const nextSelection = reactPage.richTextDTOtoSelection(text);
283
+ if (!reactPage.deepEqual(editor.children, nextValue) || !reactPage.deepEqual(editor.selection, nextSelection)) {
284
+ editor.children = nextValue;
285
+ editor.selection = nextSelection;
286
+ editor.onChange();
287
+ }
179
288
  }
180
- }, [editor, data]);
289
+ }, [editor, shouldCommit, text]);
290
+ React.useEffect(() => {
291
+ if (shouldCommit)
292
+ return;
293
+ const timeoutId = window.setTimeout(() => {
294
+ setShouldCommit(true);
295
+ }, COMMIT_DEBOUNCE_DELAY);
296
+ return () => {
297
+ window.clearTimeout(timeoutId);
298
+ };
299
+ }, [shouldCommit]);
300
+ return React.useCallback(() => setShouldCommit(false), []);
181
301
  }
182
302
  const defaultText = [{
183
- type: reactPage.BlockType.Default,
303
+ type: reactPage.BlockType.Paragraph,
184
304
  children: [{
185
305
  text: ""
186
306
  }]
187
307
  }];
188
- function EditableTextV2({
308
+ const EditableText = React.forwardRef(function EditableText2({
309
+ id,
189
310
  text,
190
- definition,
191
- control
192
- }) {
193
- const plugins = React.useMemo(() => {
194
- var _a;
195
- const plugins2 = [
196
- ...((_a = definition == null ? void 0 : definition.config) == null ? void 0 : _a.mode) === reactPage.RichTextV2Mode.Inline ? [reactPage.InlineModePlugin()] : [reactPage.BlockPlugin(), reactPage.TypographyPlugin(), reactPage.TextAlignPlugin(), reactPage.InlinePlugin(), index.LinkPlugin()]
197
- ];
198
- return plugins2;
199
- }, [definition]);
200
- const [editor] = React.useState(() => plugins.reduceRight((editor2, plugin) => {
201
- var _a, _b;
202
- return (_b = (_a = plugin == null ? void 0 : plugin.withPlugin) == null ? void 0 : _a.call(plugin, editor2)) != null ? _b : editor2;
203
- }, index$1.withLocalChanges(index$2.withBuilder(slateReact.withReact(slate.createEditor())))));
204
- const isPreservingFocus = React.useRef(false);
205
- useSyncDOMSelection(editor, isPreservingFocus);
311
+ width,
312
+ margin
313
+ }, ref) {
314
+ const [editor] = React.useState(() => reactPage.withBlock(reactPage.withTypography(index$1.withBuilder(slateReact.withReact(slate.createEditor())))));
315
+ const [isPreservingDOMSElection, setIsPreservingDOMSelection] = React.useState(false);
316
+ useSyncDOMSelection(editor, isPreservingDOMSElection);
317
+ const delaySync = useSyncWithBuilder(editor, text);
206
318
  const editMode = next.useBuilderEditMode();
207
- useSyncRemoteChanges(editor, text);
319
+ const [propControllers, setPropControllers] = React.useState(null);
320
+ const controller = propControllers == null ? void 0 : propControllers.text;
208
321
  React.useEffect(() => {
209
- if (control == null)
322
+ if (controller == null)
210
323
  return;
211
324
  const element = slateReact.ReactEditor.toDOMNode(editor, editor);
212
325
  return next.pollBoxModel({
213
326
  element,
214
- onBoxModelChange: (boxModel) => control.changeBoxModel(boxModel)
327
+ onBoxModelChange: (boxModel) => controller.changeBoxModel(boxModel)
215
328
  });
216
- }, [editor, control]);
217
- const renderElement = React.useCallback((props) => {
218
- return /* @__PURE__ */ jsxRuntime.jsx(RichTextV2Element, __spreadProps(__spreadValues({}, props), {
219
- definition,
220
- plugins
221
- }));
222
- }, [plugins, definition]);
223
- const renderLeaf = React.useCallback((props) => {
224
- return /* @__PURE__ */ jsxRuntime.jsx(RichTextV2Leaf, __spreadProps(__spreadValues({}, props), {
225
- definition,
226
- plugins
227
- }));
228
- }, [plugins, definition]);
229
- const initialValue = React.useMemo(() => {
230
- var _a, _b;
231
- return (_b = (_a = text && reactPage.richTextV2DataToDescendents(text)) != null ? _a : definition.config.defaultValue) != null ? _b : defaultText;
232
- }, [text, definition]);
329
+ }, [editor, controller]);
330
+ React.useImperativeHandle(ref, () => ({
331
+ getDomNode() {
332
+ return slateReact.ReactEditor.toDOMNode(editor, editor);
333
+ },
334
+ getBoxModel() {
335
+ return cssBoxModel.getBox(slateReact.ReactEditor.toDOMNode(editor, editor));
336
+ },
337
+ setPropControllers
338
+ }), [editor, setPropControllers]);
339
+ const initialValue = React.useMemo(() => text ? reactPage.richTextDTOtoDAO(text) : defaultText, [text]);
233
340
  React.useEffect(() => {
234
- if (editMode !== reactPage.BuilderEditMode.CONTENT) {
235
- isPreservingFocus.current = false;
236
- slateReact.ReactEditor.deselect(editor);
237
- }
238
- }, [editMode]);
239
- React.useEffect(() => {
240
- var _a;
241
- const defaultValue = (_a = definition.config.defaultValue) != null ? _a : defaultText;
242
- control == null ? void 0 : control.setEditor(editor);
243
- control == null ? void 0 : control.setDefaultValue(defaultValue);
244
- if (initialValue === defaultValue) {
245
- control == null ? void 0 : control.onLocalUserChange();
246
- }
247
- }, [control, definition, editor]);
341
+ controller == null ? void 0 : controller.setSlateEditor(editor);
342
+ }, [controller, editor]);
248
343
  const handleFocus = React.useCallback(() => {
249
- isPreservingFocus.current = true;
250
- control == null ? void 0 : control.select();
251
- }, [control]);
344
+ controller == null ? void 0 : controller.focus();
345
+ setIsPreservingDOMSelection(true);
346
+ }, [controller]);
252
347
  const handleKeyDown = React.useCallback((e) => {
253
348
  if (isHotkey__default["default"]("mod+shift+z", e))
254
- return control == null ? void 0 : control.redo();
349
+ return controller == null ? void 0 : controller.redo();
255
350
  if (isHotkey__default["default"]("mod+z", e))
256
- return control == null ? void 0 : control.undo();
257
- if (isHotkey__default["default"]("escape")(e)) {
258
- isPreservingFocus.current = false;
259
- slateReact.ReactEditor.blur(editor);
260
- control == null ? void 0 : control.switchToBuildMode();
261
- }
262
- if (editMode === reactPage.BuilderEditMode.CONTENT) {
263
- e.stopPropagation();
264
- }
265
- plugins.forEach((plugin) => {
266
- var _a;
267
- return (_a = plugin == null ? void 0 : plugin.onKeyDown) == null ? void 0 : _a.call(plugin, e, editor);
268
- });
269
- }, [control, plugins, editor, editMode]);
270
- const handleKeyUp = React.useCallback((e) => {
271
- if (editMode === reactPage.BuilderEditMode.CONTENT) {
272
- e.stopPropagation();
273
- e.preventDefault();
274
- }
275
- }, [control, editor, editMode]);
276
- const handleClick = React.useCallback((e) => {
277
- if (editMode === reactPage.BuilderEditMode.CONTENT)
278
- e.stopPropagation();
279
- }, [editMode]);
351
+ return controller == null ? void 0 : controller.undo();
352
+ if (isHotkey__default["default"]("escape")(e))
353
+ return controller == null ? void 0 : controller.blur();
354
+ reactPage.onKeyDown(e, editor);
355
+ }, [controller, editor]);
280
356
  const handleBlur = React.useCallback((e) => {
281
- var _a;
282
357
  if (e.relatedTarget == null)
283
358
  return;
284
- if (((_a = e.relatedTarget) == null ? void 0 : _a.getAttribute("contenteditable")) === "true")
285
- isPreservingFocus.current = false;
359
+ setIsPreservingDOMSelection(false);
360
+ slateReact.ReactEditor.deselect(editor);
286
361
  }, []);
287
362
  return /* @__PURE__ */ jsxRuntime.jsx(slateReact.Slate, {
288
363
  editor,
289
364
  value: initialValue,
365
+ onChange: delaySync,
290
366
  children: /* @__PURE__ */ jsxRuntime.jsx(slateReact.Editable, {
291
- renderLeaf,
292
- renderElement,
367
+ id,
368
+ renderLeaf: Leaf,
369
+ renderElement: Element,
293
370
  onFocus: handleFocus,
294
371
  onKeyDown: handleKeyDown,
295
- onKeyUp: handleKeyUp,
296
- onClick: handleClick,
297
372
  onBlur: handleBlur,
373
+ className: css.cx(width, margin),
298
374
  readOnly: editMode !== reactPage.BuilderEditMode.CONTENT,
299
375
  placeholder: "Write some text..."
300
376
  })
301
377
  });
302
- }
303
- exports.EditableTextV2 = EditableTextV2;
304
- exports["default"] = EditableTextV2;
378
+ });
379
+ var EditableText$1 = EditableText;
380
+ exports.EditableText = EditableText;
381
+ exports["default"] = EditableText$1;
305
382
  //# sourceMappingURL=index.cjs8.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.cjs8.js","sources":["../src/runtimes/react/controls/rich-text-v2/EditableTextV2/useSyncDOMSelection.tsx","../src/runtimes/react/controls/rich-text-v2/EditableTextV2/render-element.tsx","../src/runtimes/react/controls/rich-text-v2/EditableTextV2/render-leaf.tsx","../src/runtimes/react/controls/rich-text-v2/EditableTextV2/useRemoteChanges.tsx","../src/runtimes/react/controls/rich-text-v2/EditableTextV2/editable-text-v2.tsx"],"sourcesContent":["import { Editor, Range as SlateRange } from 'slate'\nimport { useIsomorphicLayoutEffect } from '../../../../../components/hooks/useIsomorphicLayoutEffect'\nimport { MutableRefObject } from 'react'\nimport { ReactEditor } from 'slate-react'\n\n/**\n * Clicking outside of the host blurs our `<Editable />`.\n * `<Editable />` only updates the DOM's selection to match slate when it is focused.\n * In the case of a panel being clicked this hook updates the DOM selection to match slate.\n */\nexport function useSyncDOMSelection(editor: Editor, isEnabled: MutableRefObject<boolean>) {\n useIsomorphicLayoutEffect(() => {\n if (!isEnabled.current || editor.selection == null || ReactEditor.isFocused(editor)) return\n try {\n const root = ReactEditor.findDocumentOrShadowRoot(editor) as Document\n const domSelection = root.getSelection()\n const newDomRange: Range | null = ReactEditor.toDOMRange(editor, editor.selection)\n\n if (newDomRange) {\n if (SlateRange.isBackward(editor.selection!)) {\n domSelection?.setBaseAndExtent(\n newDomRange.endContainer,\n newDomRange.endOffset,\n newDomRange.startContainer,\n newDomRange.startOffset,\n )\n } else {\n domSelection?.setBaseAndExtent(\n newDomRange.startContainer,\n newDomRange.startOffset,\n newDomRange.endContainer,\n newDomRange.endOffset,\n )\n }\n } else {\n domSelection?.removeAllRanges()\n }\n } catch (e) {\n console.error(e)\n }\n })\n}\n","import { RenderElementProps } from 'slate-react'\nimport { RichTextV2ControlDefinition } from '../../../../../controls'\nimport { ControlValue } from '../../control'\nimport { RichTextV2Plugin } from '../../../../../controls/rich-text-v2/plugin'\n\ntype RichTextV2ElementProps = RenderElementProps & {\n definition: RichTextV2ControlDefinition\n plugins: RichTextV2Plugin[]\n}\n\nexport function RichTextV2Element({ definition, plugins, ...props }: RichTextV2ElementProps) {\n function initialRenderElement(props: RenderElementProps) {\n return props.children\n }\n\n const renderElement = plugins.reduce(\n (renderFn, plugin) => (props: RenderElementProps) => {\n const { control, renderElement } = plugin\n\n if (control?.definition == null || renderElement == null) return renderFn(props)\n\n if (control.getElementValue == null) return renderElement(renderFn, undefined)(props)\n\n return (\n <ControlValue definition={control.definition} data={control.getElementValue(props.element)}>\n {value => renderElement(renderFn, value)(props)}\n </ControlValue>\n )\n },\n initialRenderElement,\n )\n\n return renderElement(props)\n}\n","import { RenderLeafProps } from 'slate-react'\nimport { RichTextV2ControlDefinition } from '../../../../../controls'\nimport { ControlValue } from '../../control'\nimport { RichTextV2Plugin } from '../../../../../controls/rich-text-v2/plugin'\n\ntype RichTextV2LeafProps = RenderLeafProps & {\n definition: RichTextV2ControlDefinition\n plugins: RichTextV2Plugin[]\n}\n\nexport function RichTextV2Leaf({ definition, plugins, ...props }: RichTextV2LeafProps) {\n function initialRenderLeaf({ attributes, children, leaf }: RenderLeafProps) {\n return (\n <span className={leaf.className} {...attributes}>\n {children}\n </span>\n )\n }\n\n const renderLeaf = plugins.reduce(\n (renderFn, plugin) => (props: RenderLeafProps) => {\n const { control, renderLeaf } = plugin\n\n if (control?.definition == null || renderLeaf == null) return renderFn(props)\n\n if (control.getLeafValue == null) return renderLeaf(renderFn, undefined)(props)\n\n return (\n <ControlValue definition={control.definition} data={control.getLeafValue(props.leaf)}>\n {value => renderLeaf(renderFn, value)(props)}\n </ControlValue>\n )\n },\n initialRenderLeaf,\n )\n\n return renderLeaf(props)\n}\n","import { useEffect } from 'react'\nimport { Editor } from 'slate'\nimport { RichTextV2ControlData, richTextV2DataToDescendents } from '../../../../../controls'\nimport { LocalChange } from '../../../../../slate'\nimport { useIsInBuilder } from '../../..'\n\n// From the component point of view we can't know if the change came from an action or a undo/redo\n// So we diff the time and force updates on actions that occured over a second ago.\nfunction isChangeWithinPreviousSec(change?: LocalChange) {\n return performance.now() - (change?.time ?? 0) < 1000\n}\n\nexport function useSyncRemoteChanges(editor: Editor, data?: RichTextV2ControlData) {\n const isInBuilder = useIsInBuilder()\n\n useEffect(() => {\n if (\n !isChangeWithinPreviousSec(editor.localChanges.get(data?.key ?? '')) &&\n data &&\n isInBuilder\n ) {\n editor.children = richTextV2DataToDescendents(data)\n editor.selection = editor?.localChanges.get(data.key)?.selection ?? null\n editor.onChange()\n }\n }, [editor, data])\n}\n","import {\n FocusEvent,\n KeyboardEvent,\n MouseEvent,\n ReactNode,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState,\n} from 'react'\nimport { Descendant, createEditor } from 'slate'\nimport isHotkey from 'is-hotkey'\nimport {\n withReact,\n ReactEditor,\n RenderElementProps,\n RenderLeafProps,\n Slate,\n Editable,\n} from 'slate-react'\n\nimport {\n RichTextV2Control,\n RichTextV2ControlData,\n RichTextV2ControlDefinition,\n RichTextV2Mode,\n} from '../../../../../controls'\nimport { useBuilderEditMode } from '../../..'\nimport { BuilderEditMode } from '../../../../../state/modules/builder-edit-mode'\nimport { pollBoxModel } from '../../../poll-box-model'\nimport {\n BlockPlugin,\n InlineModePlugin,\n InlinePlugin,\n LinkPlugin,\n TextAlignPlugin,\n TypographyPlugin,\n withBuilder,\n withLocalChanges,\n} from '../../../../../slate'\nimport { useSyncDOMSelection } from './useSyncDOMSelection'\nimport { BlockType } from '../../../../../slate'\nimport { RichTextV2Element } from './render-element'\nimport { RichTextV2Leaf } from './render-leaf'\nimport { richTextV2DataToDescendents } from '../../../../../controls/rich-text-v2/translation'\nimport { useSyncRemoteChanges } from './useRemoteChanges'\n\nexport type RichTextV2ControlValue = ReactNode\n\nexport type Descriptors = { text?: RichTextV2ControlDefinition }\n\nconst defaultText: Descendant[] = [{ type: BlockType.Default, children: [{ text: '' }] }]\n\ntype Props = {\n text?: RichTextV2ControlData\n definition: RichTextV2ControlDefinition\n control: RichTextV2Control | null\n}\n\nexport function EditableTextV2({ text, definition, control }: Props) {\n const plugins = useMemo(() => {\n const plugins = [\n /**\n * TODO: we are manually referencing our default plugins for each mode here because\n * Referencing the real LinkPlugin causes a circular dependency.\n * When circular dependencies calm down we should update the plugin definition to use real plugins,\n * and just use the plugins that are defined by our config.\n */\n // ...(definition?.config?.plugins ?? []),\n ...(definition?.config?.mode === RichTextV2Mode.Inline\n ? [InlineModePlugin()]\n : [BlockPlugin(), TypographyPlugin(), TextAlignPlugin(), InlinePlugin(), LinkPlugin()]),\n ]\n return plugins\n }, [definition])\n\n const [editor] = useState(() =>\n plugins.reduceRight(\n (editor, plugin) => plugin?.withPlugin?.(editor) ?? editor,\n withLocalChanges(withBuilder(withReact(createEditor()))),\n ),\n )\n\n const isPreservingFocus = useRef(false)\n useSyncDOMSelection(editor, isPreservingFocus)\n\n const editMode = useBuilderEditMode()\n\n useSyncRemoteChanges(editor, text)\n\n useEffect(() => {\n if (control == null) return\n\n const element = ReactEditor.toDOMNode(editor, editor)\n return pollBoxModel({\n element,\n onBoxModelChange: boxModel => control.changeBoxModel(boxModel),\n })\n }, [editor, control])\n\n const renderElement = useCallback(\n (props: RenderElementProps) => {\n return <RichTextV2Element {...props} definition={definition} plugins={plugins} />\n },\n [plugins, definition],\n )\n\n const renderLeaf = useCallback(\n (props: RenderLeafProps) => {\n return <RichTextV2Leaf {...props} definition={definition} plugins={plugins} />\n },\n [plugins, definition],\n )\n\n const initialValue = useMemo(\n () =>\n (text && richTextV2DataToDescendents(text)) ?? definition.config.defaultValue ?? defaultText,\n [text, definition],\n )\n\n useEffect(() => {\n /**\n * This is required because clicking on the overlay has `relatedTarget` null just like the sidebar, but\n * - in the case of the overlay we switch to BUILD mode\n * - in the case of the sidebar we preserve the selection\n */\n if (editMode !== BuilderEditMode.CONTENT) {\n isPreservingFocus.current = false\n ReactEditor.deselect(editor)\n }\n }, [editMode])\n\n useEffect(() => {\n const defaultValue = definition.config.defaultValue ?? defaultText\n\n control?.setEditor(editor)\n control?.setDefaultValue(defaultValue)\n\n /**\n * When initialValue is set to the default value we need to trigger an local change so that the sidebar updates and so the data is saved\n */\n if (initialValue === defaultValue) {\n control?.onLocalUserChange()\n }\n }, [control, definition, editor])\n\n const handleFocus = useCallback(() => {\n isPreservingFocus.current = true\n control?.select()\n }, [control])\n\n const handleKeyDown = useCallback(\n (e: KeyboardEvent) => {\n if (isHotkey('mod+shift+z', e)) return control?.redo()\n if (isHotkey('mod+z', e)) return control?.undo()\n if (isHotkey('escape')(e)) {\n isPreservingFocus.current = false\n ReactEditor.blur(editor)\n control?.switchToBuildMode()\n }\n\n if (editMode === BuilderEditMode.CONTENT) {\n e.stopPropagation()\n }\n\n plugins.forEach(plugin => plugin?.onKeyDown?.(e, editor))\n },\n [control, plugins, editor, editMode],\n )\n\n const handleKeyUp = useCallback(\n (e: KeyboardEvent) => {\n if (editMode === BuilderEditMode.CONTENT) {\n e.stopPropagation()\n e.preventDefault()\n }\n },\n [control, editor, editMode],\n )\n\n const handleClick = useCallback(\n (e: MouseEvent) => {\n if (editMode === BuilderEditMode.CONTENT) e.stopPropagation()\n },\n [editMode],\n )\n\n const handleBlur = useCallback((e: FocusEvent) => {\n // outside of iframe (overlay, sidebar, etc)\n if (e.relatedTarget == null) return\n // another text\n if (e.relatedTarget?.getAttribute('contenteditable') === 'true')\n isPreservingFocus.current = false\n }, [])\n\n return (\n <Slate editor={editor} value={initialValue}>\n <Editable\n renderLeaf={renderLeaf}\n renderElement={renderElement}\n onFocus={handleFocus}\n onKeyDown={handleKeyDown}\n onKeyUp={handleKeyUp}\n onClick={handleClick}\n onBlur={handleBlur}\n readOnly={editMode !== BuilderEditMode.CONTENT}\n placeholder=\"Write some text...\"\n />\n </Slate>\n )\n}\n\nexport default EditableTextV2\n"],"names":["editor","isEnabled","useIsomorphicLayoutEffect","current","selection","ReactEditor","isFocused","root","findDocumentOrShadowRoot","domSelection","getSelection","newDomRange","toDOMRange","SlateRange","isBackward","setBaseAndExtent","endContainer","endOffset","startContainer","startOffset","removeAllRanges","e","console","error","definition","plugins","props","children","renderElement","reduce","renderFn","plugin","control","getElementValue","undefined","ControlValue","element","value","initialRenderElement","attributes","leaf","className","renderLeaf","getLeafValue","initialRenderLeaf","change","performance","now","time","data","isInBuilder","useIsInBuilder","useEffect","isChangeWithinPreviousSec","localChanges","get","key","richTextV2DataToDescendents","onChange","defaultText","type","BlockType","Default","text","useMemo","config","mode","RichTextV2Mode","Inline","InlineModePlugin","BlockPlugin","TypographyPlugin","TextAlignPlugin","InlinePlugin","LinkPlugin","useState","reduceRight","withPlugin","withLocalChanges","withBuilder","withReact","createEditor","isPreservingFocus","useRef","useSyncDOMSelection","editMode","useBuilderEditMode","useSyncRemoteChanges","toDOMNode","pollBoxModel","onBoxModelChange","boxModel","changeBoxModel","useCallback","initialValue","defaultValue","BuilderEditMode","CONTENT","deselect","setEditor","setDefaultValue","onLocalUserChange","handleFocus","select","handleKeyDown","isHotkey","redo","undo","blur","switchToBuildMode","stopPropagation","forEach","onKeyDown","handleKeyUp","preventDefault","handleClick","handleBlur","relatedTarget","getAttribute","Slate","Editable"],"mappings":"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"}
1
+ {"version":3,"file":"index.cjs8.js","sources":["../src/runtimes/react/controls/rich-text/components/Element/block.tsx","../src/runtimes/react/controls/rich-text/components/Element/inline.tsx","../src/runtimes/react/controls/rich-text/components/Element/element.tsx","../src/runtimes/react/controls/rich-text/components/Leaf/leaf.tsx","../src/runtimes/react/controls/rich-text/EditableText/useSyncDOMSelection.tsx","../src/runtimes/react/controls/rich-text/EditableText/useSyncWithBuilder.tsx","../src/runtimes/react/controls/rich-text/EditableText/editable-text.tsx"],"sourcesContent":["import { cx } from '@emotion/css'\nimport { RenderElementProps } from 'slate-react'\nimport { useResponsiveStyle } from '../../../../../../components/utils/responsive-style'\nimport { Block, BlockType } from '../../../../../../slate'\nimport { useStyle } from '../../../../use-style'\n\nexport interface InlineRenderElementProps extends RenderElementProps {\n element: Block\n}\n\nexport function BlockElement({ element, attributes, children }: InlineRenderElementProps) {\n const blockStyles = [\n useStyle({ margin: 0 }),\n useStyle(useResponsiveStyle([element.textAlign], ([textAlign = 'left']) => ({ textAlign }))),\n ]\n\n const quoteStyles = useStyle({\n padding: '0.5em 10px',\n fontSize: '1.25em',\n fontWeight: '300',\n borderLeft: '5px solid rgba(0, 0, 0, 0.1)',\n })\n\n switch (element.type) {\n case BlockType.Default:\n case BlockType.Paragraph:\n return (\n <p {...attributes} className={cx(...blockStyles)}>\n {children}\n </p>\n )\n case BlockType.Heading1:\n return (\n <h1 {...attributes} className={cx(...blockStyles)}>\n {children}\n </h1>\n )\n case BlockType.Heading2:\n return (\n <h2 {...attributes} className={cx(...blockStyles)}>\n {children}\n </h2>\n )\n case BlockType.Heading3:\n return (\n <h3 {...attributes} className={cx(...blockStyles)}>\n {children}\n </h3>\n )\n case BlockType.Heading4:\n return (\n <h4 {...attributes} className={cx(...blockStyles)}>\n {children}\n </h4>\n )\n case BlockType.Heading5:\n return (\n <h5 {...attributes} className={cx(...blockStyles)}>\n {children}\n </h5>\n )\n case BlockType.Heading6:\n return (\n <h6 {...attributes} className={cx(...blockStyles)}>\n {children}\n </h6>\n )\n case BlockType.BlockQuote:\n return (\n <blockquote {...attributes} className={cx(...blockStyles, quoteStyles)}>\n {children}\n </blockquote>\n )\n case BlockType.OrderedList:\n return (\n <ol {...attributes} className={cx(...blockStyles)} style={{ listStylePosition: 'inside' }}>\n {children}\n </ol>\n )\n case BlockType.UnorderedList:\n return (\n <ul {...attributes} className={cx(...blockStyles)} style={{ listStylePosition: 'inside' }}>\n {children}\n </ul>\n )\n case BlockType.ListItem:\n return (\n <li {...attributes} className={cx(...blockStyles)}>\n {children}\n </li>\n )\n case BlockType.ListItemChild:\n return (\n <span {...attributes} className={cx(...blockStyles)}>\n {children}\n </span>\n )\n }\n}\n","import { cx } from '@emotion/css'\nimport { ComponentPropsWithoutRef } from 'react'\nimport { RenderElementProps } from 'slate-react'\nimport { Inline, InlineType } from '../../../../../../slate/types'\nimport { useStyle } from '../../../../use-style'\nimport { Link } from '../../../../../../components/shared/Link'\n\nfunction StyledLink({ className, ...restOfProps }: ComponentPropsWithoutRef<typeof Link>) {\n return <Link {...restOfProps} className={cx(useStyle({ textDecoration: 'none' }), className)} />\n}\n\nexport interface InlineRenderElementProps extends RenderElementProps {\n element: Inline\n}\n\nexport function InlineElement({ element, attributes, children }: InlineRenderElementProps) {\n switch (element.type) {\n case InlineType.Code:\n return <code {...attributes}>{children}</code>\n case InlineType.SuperScript:\n return <sup {...attributes}>{children}</sup>\n case InlineType.SubScript:\n return <sub {...attributes}>{children}</sub>\n case InlineType.Link:\n return (\n <StyledLink {...attributes} link={element.link ?? undefined}>\n {children}\n </StyledLink>\n )\n }\n}\n","import { RenderElementProps } from 'slate-react'\nimport { BlockElement } from './block'\nimport { InlineElement } from './inline'\nimport { BlockType, InlineType } from '../../../../../../slate/types'\n\nexport function Element({ element, ...props }: RenderElementProps) {\n switch (element.type) {\n case InlineType.Code:\n case InlineType.SuperScript:\n case InlineType.SubScript:\n case InlineType.Link:\n return <InlineElement element={element} {...props} />\n case BlockType.Default:\n case BlockType.Paragraph:\n case BlockType.Heading1:\n case BlockType.Heading2:\n case BlockType.Heading3:\n case BlockType.Heading4:\n case BlockType.Heading5:\n case BlockType.Heading6:\n case BlockType.BlockQuote:\n case BlockType.OrderedList:\n case BlockType.UnorderedList:\n case BlockType.ListItem:\n case BlockType.ListItemChild:\n return <BlockElement element={element} {...props} />\n default:\n return <span {...props.attributes}>{props.children}</span>\n }\n}\n","import { RenderLeafProps } from 'slate-react'\nimport useEnhancedTypography, { useTypographyClassName } from '../../../typography'\n\nexport function Leaf({ leaf, ...props }: RenderLeafProps) {\n // for each breakpoint fetch related resources and merge its value with its override\n const enhancedTypography = useEnhancedTypography(leaf.typography)\n\n // for each breakpoint shallow merge back up through the breakpoints and create a className\n const typographyClassName = useTypographyClassName(enhancedTypography)\n\n return (\n <span {...props.attributes} className={typographyClassName}>\n {props.children}\n </span>\n )\n}\n","import { ReactEditor } from 'slate-react'\nimport { Editor, Range as SlateRange } from 'slate'\nimport { useIsomorphicLayoutEffect } from '../../../../../components/hooks/useIsomorphicLayoutEffect'\n\n/**\n * Clicking outside of the host blurs our `<Editable />`.\n * `<Editable />` only updates the DOM's selection to match slate when it is focused.\n * In the case of a panel being clicked this hook updates the DOM selection to match slate.\n */\nexport function useSyncDOMSelection(editor: Editor, isEnabled: boolean) {\n useIsomorphicLayoutEffect(() => {\n if (!isEnabled || editor.selection == null || ReactEditor.isFocused(editor)) return\n try {\n const root = ReactEditor.findDocumentOrShadowRoot(editor) as Document\n const domSelection = root.getSelection()\n const newDomRange: Range | null = ReactEditor.toDOMRange(editor, editor.selection)\n\n if (newDomRange) {\n if (SlateRange.isBackward(editor.selection!)) {\n domSelection?.setBaseAndExtent(\n newDomRange.endContainer,\n newDomRange.endOffset,\n newDomRange.startContainer,\n newDomRange.startOffset,\n )\n } else {\n domSelection?.setBaseAndExtent(\n newDomRange.startContainer,\n newDomRange.startOffset,\n newDomRange.endContainer,\n newDomRange.endOffset,\n )\n }\n } else {\n domSelection?.removeAllRanges()\n }\n } catch (e) {\n console.error(e)\n }\n })\n}\n","import { useState, useEffect, useCallback } from 'react'\nimport { Editor } from 'slate'\nimport { useIsInBuilder } from '../../../../../react'\nimport { richTextDTOtoDAO, richTextDTOtoSelection } from '../../../../../controls'\nimport { RichTextValue } from '../../../../../prop-controllers'\nimport deepEqual from '../../../../../utils/deepEqual'\n\nconst COMMIT_DEBOUNCE_DELAY = 500\n\n/**\n * Compare new prop value with current editor and update editor\n * if the values are not equal.\n */\nexport function useSyncWithBuilder(editor: Editor, text?: RichTextValue) {\n const [shouldCommit, setShouldCommit] = useState(true)\n const isInBuilder = useIsInBuilder()\n\n useEffect(() => {\n if (shouldCommit && text && isInBuilder) {\n const nextValue = richTextDTOtoDAO(text)\n const nextSelection = richTextDTOtoSelection(text)\n if (!deepEqual(editor.children, nextValue) || !deepEqual(editor.selection, nextSelection)) {\n editor.children = nextValue\n editor.selection = nextSelection\n editor.onChange()\n }\n }\n }, [editor, shouldCommit, text])\n\n useEffect(() => {\n if (shouldCommit) return\n\n const timeoutId = window.setTimeout(() => {\n setShouldCommit(true)\n }, COMMIT_DEBOUNCE_DELAY)\n\n return () => {\n window.clearTimeout(timeoutId)\n }\n }, [shouldCommit])\n\n return useCallback(() => setShouldCommit(false), [])\n}\n","import { cx } from '@emotion/css'\nimport { getBox } from 'css-box-model'\nimport isHotkey from 'is-hotkey'\nimport {\n FocusEvent,\n forwardRef,\n KeyboardEvent,\n Ref,\n useCallback,\n useEffect,\n useImperativeHandle,\n useMemo,\n useState,\n} from 'react'\n\nimport { createEditor } from 'slate'\nimport { Slate, Editable, withReact, ReactEditor } from 'slate-react'\nimport { useBuilderEditMode } from '../../..'\nimport { richTextDTOtoDAO } from '../../../../../controls'\nimport { RichTextValue } from '../../../../../prop-controllers'\nimport { ElementIDValue } from '../../../../../prop-controllers/descriptors'\nimport { DescriptorsPropControllers } from '../../../../../prop-controllers/instances'\nimport {\n RichTextDAO,\n BlockType,\n withBlock,\n withTypography,\n withBuilder,\n onKeyDown,\n} from '../../../../../slate'\nimport { BuilderEditMode } from '../../../../../state/modules/builder-edit-mode'\nimport { PropControllersHandle } from '../../../../../state/modules/prop-controller-handles'\nimport { pollBoxModel } from '../../../poll-box-model'\nimport { Element, Leaf } from '../components'\nimport { Descriptors } from '../rich-text'\nimport { useSyncDOMSelection } from './useSyncDOMSelection'\nimport { useSyncWithBuilder } from './useSyncWithBuilder'\n\ntype Props = {\n id?: ElementIDValue\n text?: RichTextValue\n width?: string\n margin?: string\n}\n\nconst defaultText: RichTextDAO = [{ type: BlockType.Paragraph, children: [{ text: '' }] }]\n\nexport const EditableText = forwardRef(function EditableText(\n { id, text, width, margin }: Props,\n ref: Ref<PropControllersHandle<Descriptors>>,\n) {\n const [editor] = useState(() => withBlock(withTypography(withBuilder(withReact(createEditor())))))\n const [isPreservingDOMSElection, setIsPreservingDOMSelection] = useState(false)\n useSyncDOMSelection(editor, isPreservingDOMSElection)\n const delaySync = useSyncWithBuilder(editor, text)\n const editMode = useBuilderEditMode()\n\n const [propControllers, setPropControllers] =\n useState<DescriptorsPropControllers<Descriptors> | null>(null)\n const controller = propControllers?.text\n\n useEffect(() => {\n if (controller == null) return\n\n const element = ReactEditor.toDOMNode(editor, editor)\n\n return pollBoxModel({\n element,\n onBoxModelChange: boxModel => controller.changeBoxModel(boxModel),\n })\n }, [editor, controller])\n\n useImperativeHandle(\n ref,\n () => ({\n getDomNode() {\n return ReactEditor.toDOMNode(editor, editor)\n },\n getBoxModel() {\n return getBox(ReactEditor.toDOMNode(editor, editor))\n },\n setPropControllers,\n }),\n [editor, setPropControllers],\n )\n\n const initialValue = useMemo(() => (text ? richTextDTOtoDAO(text) : defaultText), [text])\n\n useEffect(() => {\n controller?.setSlateEditor(editor)\n }, [controller, editor])\n\n const handleFocus = useCallback(() => {\n controller?.focus()\n setIsPreservingDOMSelection(true)\n }, [controller])\n\n const handleKeyDown = useCallback(\n (e: KeyboardEvent) => {\n if (isHotkey('mod+shift+z', e)) return controller?.redo()\n if (isHotkey('mod+z', e)) return controller?.undo()\n if (isHotkey('escape')(e)) return controller?.blur()\n onKeyDown(e, editor)\n },\n [controller, editor],\n )\n\n const handleBlur = useCallback((e: FocusEvent) => {\n // When clicking outside of the iframe (`relatedTarget` is null) we want to preserve the DOM selection.\n if (e.relatedTarget == null) return\n // Otherwise we want to deselect on blur and stop preserving selection.\n setIsPreservingDOMSelection(false)\n ReactEditor.deselect(editor)\n }, [])\n\n return (\n <Slate editor={editor} value={initialValue} onChange={delaySync}>\n <Editable\n id={id}\n renderLeaf={Leaf}\n renderElement={Element}\n onFocus={handleFocus}\n onKeyDown={handleKeyDown}\n onBlur={handleBlur}\n className={cx(width, margin)}\n readOnly={editMode !== BuilderEditMode.CONTENT}\n placeholder=\"Write some text...\"\n />\n </Slate>\n )\n})\n\nexport default EditableText\n"],"names":["element","attributes","children","blockStyles","useStyle","margin","useResponsiveStyle","textAlign","quoteStyles","padding","fontSize","fontWeight","borderLeft","type","BlockType","Default","Paragraph","cx","Heading1","Heading2","Heading3","Heading4","Heading5","Heading6","BlockQuote","OrderedList","listStylePosition","UnorderedList","ListItem","ListItemChild","className","restOfProps","Link","textDecoration","InlineType","Code","SuperScript","SubScript","link","undefined","props","leaf","enhancedTypography","useEnhancedTypography","typography","typographyClassName","useTypographyClassName","editor","isEnabled","useIsomorphicLayoutEffect","selection","ReactEditor","isFocused","root","findDocumentOrShadowRoot","domSelection","getSelection","newDomRange","toDOMRange","SlateRange","isBackward","setBaseAndExtent","endContainer","endOffset","startContainer","startOffset","removeAllRanges","e","console","error","COMMIT_DEBOUNCE_DELAY","text","shouldCommit","setShouldCommit","useState","isInBuilder","useIsInBuilder","useEffect","nextValue","richTextDTOtoDAO","nextSelection","richTextDTOtoSelection","deepEqual","onChange","timeoutId","window","setTimeout","clearTimeout","useCallback","defaultText","EditableText","forwardRef","id","width","ref","withBlock","withTypography","withBuilder","withReact","createEditor","isPreservingDOMSElection","setIsPreservingDOMSelection","useSyncDOMSelection","delaySync","useSyncWithBuilder","editMode","useBuilderEditMode","propControllers","setPropControllers","controller","toDOMNode","pollBoxModel","onBoxModelChange","boxModel","changeBoxModel","useImperativeHandle","getDomNode","getBoxModel","getBox","initialValue","useMemo","setSlateEditor","handleFocus","focus","handleKeyDown","isHotkey","redo","undo","blur","onKeyDown","handleBlur","relatedTarget","deselect","Slate","Editable","Leaf","Element","BuilderEditMode","CONTENT"],"mappings":"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"}