@makeswift/runtime 0.9.10 → 0.9.12

package/dist/index.cjs9.js

@@ -34,7 +34,6 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 var React = require("react");
 var slate = require("slate");
 var isHotkey = require("is-hotkey");
-var slateHistory = require("slate-history");
 var slateReact = require("slate-react");
 var reactPage = require("./react-page.cjs.js");
 var next = require("./index.cjs.js");
@@ -44,7 +43,7 @@ var index = require("./index.cjs6.js");
 var index$1 = require("./index.cjs7.js");
 var jsxRuntime = require("react/jsx-runtime");
 require("./index.cjs3.js");
-var css = require("@emotion/css");
+require("@emotion/css");
 var useIsomorphicLayoutEffect = require("./useIsomorphicLayoutEffect.cjs.js");
 require("./actions.cjs.js");
 require("redux");
@@ -53,7 +52,7 @@ require("@emotion/serialize");
 require("@emotion/utils");
 require("use-sync-external-store/shim/with-selector");
 require("next/dynamic");
-require("./typography.cjs.js");
+require("./text-input.cjs.js");
 require("./combobox.cjs.js");
 require("use-sync-external-store/shim");
 require("./types.cjs.js");
@@ -110,24 +109,8 @@ function RichTextV2Element(_a) {
     "definition",
     "plugins"
   ]);
-  const blockStyles = [reactPage.useStyle({
-    margin: 0
-  })];
   function initialRenderElement(props2) {
-    switch (props2.element.type) {
-      case reactPage.BlockType.Default:
-      default:
-        if (definition.config.mode === reactPage.RichTextV2Mode.Inline) {
-          return /* @__PURE__ */ jsxRuntime.jsx("span", __spreadProps(__spreadValues({}, props2.attributes), {
-            className: css.cx(...blockStyles),
-            children: props2.children
-          }));
-        }
-        return /* @__PURE__ */ jsxRuntime.jsx("p", __spreadProps(__spreadValues({}, props2.attributes), {
-          className: css.cx(...blockStyles),
-          children: props2.children
-        }));
-    }
+    return props2.children;
   }
   const renderElement = plugins.reduce((renderFn, plugin) => (props2) => {
     const {
@@ -182,6 +165,21 @@ function RichTextV2Leaf(_c) {
   }, initialRenderLeaf);
   return renderLeaf(props);
 }
+function isChangeWithinPreviousSec(change) {
+  var _a;
+  return performance.now() - ((_a = change == null ? void 0 : change.time) != null ? _a : 0) < 1e3;
+}
+function useSyncRemoteChanges(editor, data) {
+  const isInBuilder = next.useIsInBuilder();
+  React.useEffect(() => {
+    var _a, _b, _c;
+    if (!isChangeWithinPreviousSec(editor.localChanges.get((_a = data == null ? void 0 : data.key) != null ? _a : "")) && data && isInBuilder) {
+      editor.children = reactPage.richTextV2DataToDescendents(data);
+      editor.selection = (_c = (_b = editor == null ? void 0 : editor.localChanges.get(data.key)) == null ? void 0 : _b.selection) != null ? _c : null;
+      editor.onChange();
+    }
+  }, [editor, data]);
+}
 const defaultText = [{
   type: reactPage.BlockType.Default,
   children: [{
@@ -201,10 +199,11 @@ function EditableTextV2({
   const [editor] = React.useState(() => plugins.reduceRight((editor2, plugin) => {
     var _a, _b;
     return (_b = (_a = plugin == null ? void 0 : plugin.withPlugin) == null ? void 0 : _a.call(plugin, editor2)) != null ? _b : editor2;
-  }, index$1.withBuilder(slateHistory.withHistory(slateReact.withReact(slate.createEditor())))));
+  }, index.withLocalChanges(index$1.withBuilder(slateReact.withReact(slate.createEditor())))));
   const isPreservingFocus = React.useRef(false);
   useSyncDOMSelection(editor, isPreservingFocus);
   const editMode = next.useBuilderEditMode();
+  useSyncRemoteChanges(editor, text);
   React.useEffect(() => {
     if (control == null)
       return;
@@ -245,23 +244,24 @@ function EditableTextV2({
     control == null ? void 0 : control.select();
   }, [control]);
   const handleKeyDown = React.useCallback((e) => {
-    if (isHotkey__default["default"]("mod+shift+z", e))
-      return slateHistory.HistoryEditor.redo(editor);
-    if (isHotkey__default["default"]("mod+z", e))
-      return slateHistory.HistoryEditor.undo(editor);
     if (isHotkey__default["default"]("escape")(e)) {
       isPreservingFocus.current = false;
       slateReact.ReactEditor.blur(editor);
       control == null ? void 0 : control.switchToBuildMode();
     }
+    if (editMode === reactPage.BuilderEditMode.CONTENT) {
+      e.stopPropagation();
+    }
     plugins.forEach((plugin) => {
       var _a;
       return (_a = plugin == null ? void 0 : plugin.onKeyDown) == null ? void 0 : _a.call(plugin, e, editor);
     });
-  }, [control, plugins, editor]);
+  }, [control, plugins, editor, editMode]);
   const handleKeyUp = React.useCallback((e) => {
-    if (editMode === reactPage.BuilderEditMode.CONTENT)
+    if (editMode === reactPage.BuilderEditMode.CONTENT) {
+      e.stopPropagation();
       e.preventDefault();
+    }
   }, [control, editor, editMode]);
   const handleClick = React.useCallback((e) => {
     if (editMode === reactPage.BuilderEditMode.CONTENT)
@@ -274,12 +274,8 @@ function EditableTextV2({
     if (((_a = e.relatedTarget) == null ? void 0 : _a.getAttribute("contenteditable")) === "true")
       isPreservingFocus.current = false;
   }, []);
-  const handleOnChange = React.useCallback((value) => {
-    control == null ? void 0 : control.onChange(value);
-  }, [control]);
   return /* @__PURE__ */ jsxRuntime.jsx(slateReact.Slate, {
     editor,
-    onChange: handleOnChange,
     value: initialValue,
     children: /* @__PURE__ */ jsxRuntime.jsx(slateReact.Editable, {
       renderLeaf,

package/dist/index.cjs9.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs9.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/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 { cx } from '@emotion/css'\nimport { RenderElementProps } from 'slate-react'\nimport {\n  RichTextV2ControlDefinition,\n  RichTextV2Plugin,\n  RichTextV2Mode,\n} from '../../../../../controls'\nimport { BlockType } from '../../../../../slate'\nimport { useStyle } from '../../../use-style'\nimport { ControlValue } from '../../control'\n\ntype RichTextV2ElementProps = RenderElementProps & {\n  definition: RichTextV2ControlDefinition\n  plugins: RichTextV2Plugin[]\n}\n\nexport function RichTextV2Element({ definition, plugins, ...props }: RichTextV2ElementProps) {\n  const blockStyles = [useStyle({ margin: 0 })]\n\n  function initialRenderElement(props: RenderElementProps) {\n    switch (props.element.type) {\n      case BlockType.Default:\n      default:\n        if (definition.config.mode === RichTextV2Mode.Inline) {\n          return (\n            <span {...props.attributes} className={cx(...blockStyles)}>\n              {props.children}\n            </span>\n          )\n        }\n\n        return (\n          <p {...props.attributes} className={cx(...blockStyles)}>\n            {props.children}\n          </p>\n        )\n    }\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, RichTextV2Plugin } from '../../../../../controls'\nimport { ControlValue } from '../../control'\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 {\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 { withHistory, HistoryEditor } from 'slate-history'\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 { InlineModePlugin, withBuilder } 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'\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      ...(definition?.config?.plugins ?? []),\n      ...(definition?.config?.mode === RichTextV2Mode.Inline ? [InlineModePlugin] : []),\n    ]\n    return plugins\n  }, [definition])\n\n  const [editor] = useState(() =>\n    plugins.reduceRight(\n      (editor, plugin) => plugin?.withPlugin?.(editor) ?? editor,\n      withBuilder(withHistory(withReact(createEditor()))),\n    ),\n  )\n\n  const isPreservingFocus = useRef(false)\n  useSyncDOMSelection(editor, isPreservingFocus)\n\n  const editMode = useBuilderEditMode()\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    () => (text && richTextV2DataToDescendents(text)) ?? defaultText,\n    [text],\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    control?.setEditor(editor)\n    control?.setDefaultValue(defaultText)\n  }, [control, editor, defaultText])\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 HistoryEditor.redo(editor)\n      if (isHotkey('mod+z', e)) return HistoryEditor.undo(editor)\n      if (isHotkey('escape')(e)) {\n        isPreservingFocus.current = false\n        ReactEditor.blur(editor)\n        control?.switchToBuildMode()\n      }\n\n      plugins.forEach(plugin => plugin?.onKeyDown?.(e, editor))\n    },\n    [control, plugins, editor],\n  )\n\n  const handleKeyUp = useCallback(\n    (e: KeyboardEvent) => {\n      if (editMode === BuilderEditMode.CONTENT) e.preventDefault()\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  const handleOnChange = useCallback(\n    (value: Descendant[]) => {\n      control?.onChange(value)\n    },\n    [control],\n  )\n\n  return (\n    <Slate editor={editor} onChange={handleOnChange} 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","blockStyles","useStyle","margin","element","type","BlockType","Default","config","mode","RichTextV2Mode","Inline","attributes","cx","children","renderElement","reduce","renderFn","plugin","control","getElementValue","undefined","ControlValue","value","initialRenderElement","leaf","className","renderLeaf","getLeafValue","initialRenderLeaf","defaultText","text","useMemo","InlineModePlugin","useState","reduceRight","withPlugin","withBuilder","withHistory","withReact","createEditor","isPreservingFocus","useRef","useSyncDOMSelection","editMode","useBuilderEditMode","useEffect","toDOMNode","pollBoxModel","onBoxModelChange","boxModel","changeBoxModel","useCallback","initialValue","richTextV2DataToDescendents","BuilderEditMode","CONTENT","deselect","setEditor","setDefaultValue","handleFocus","select","handleKeyDown","isHotkey","HistoryEditor","redo","undo","blur","switchToBuildMode","forEach","onKeyDown","handleKeyUp","preventDefault","handleClick","stopPropagation","handleBlur","relatedTarget","getAttribute","handleOnChange","onChange","Slate","Editable"],"mappings":"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"}
+{"version":3,"file":"index.cjs9.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, RichTextV2Plugin } from '../../../../../controls'\nimport { ControlValue } from '../../control'\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, RichTextV2Plugin } from '../../../../../controls'\nimport { ControlValue } from '../../control'\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 { useIsInBuilder } from '../../../../../react'\nimport { RichTextV2ControlData, richTextV2DataToDescendents } from '../../../../../controls'\nimport { LocalChange } from '../../../../../slate'\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 { InlineModePlugin, withBuilder, withLocalChanges } 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      ...(definition?.config?.plugins ?? []),\n      ...(definition?.config?.mode === RichTextV2Mode.Inline ? [InlineModePlugin] : []),\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    () => (text && richTextV2DataToDescendents(text)) ?? defaultText,\n    [text],\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    control?.setEditor(editor)\n    control?.setDefaultValue(defaultText)\n  }, [control, editor, defaultText])\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('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","useState","reduceRight","withPlugin","withLocalChanges","withBuilder","withReact","createEditor","isPreservingFocus","useRef","useSyncDOMSelection","editMode","useBuilderEditMode","useSyncRemoteChanges","toDOMNode","pollBoxModel","onBoxModelChange","boxModel","changeBoxModel","useCallback","initialValue","BuilderEditMode","CONTENT","deselect","setEditor","setDefaultValue","handleFocus","select","handleKeyDown","isHotkey","blur","switchToBuildMode","stopPropagation","forEach","onKeyDown","handleKeyUp","preventDefault","handleClick","handleBlur","relatedTarget","getAttribute","Slate","Editable"],"mappings":"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"}

package/dist/index.es.js

@@ -38,10 +38,10 @@ import * as React from "react";
 import { useEffect, createContext, useContext, useState, useMemo, useRef, Children, createElement, forwardRef, memo, useId, useCallback, useImperativeHandle, Component, Suspense } from "react";
 import { useSyncExternalStoreWithSelector } from "use-sync-external-store/shim/with-selector";
 import dynamic from "next/dynamic";
-import { a as createDocumentReference, g as getPropControllerDescriptors, b as isElementReference, e as getSwatchIds, f as getFileIds, h as getTypographyIds, j as getTableIds, k as getPageIds, l as getElementChildren, E as ElementID, B as Backgrounds, W as Width, m as ResponsiveIconRadioGroup, M as Margin, P as Padding, n as Border, o as BorderRadius, S as Shadows, G as GapY, p as GapX, q as ResponsiveSelect, r as ResponsiveNumber, s as Checkbox, t as Grid, u as TextInput, L as Link, v as ResponsiveColor, w as TextStyle, C as ComponentIcon, I as Images, N as Number$1, D as Date$1, F as Font, x as ResponsiveLength, y as TextArea, z as Table, A as TableFormFields, H as Image, J as ResponsiveOpacity, K as NavigationLinks, O as SocialLinks, Q as RichText, V as Video, U as useStyle, X as getBorderSwatchIds, Y as isNonNullable$1, Z as getBoxShadowsSwatchIds, _ as getResponsiveColorSwatchIds, $ as StyleControlProperty, a0 as ImageControlValueFormat, a1 as isPropControllersHandle, a2 as isRichTextV1Data, a3 as StyleControlType, a4 as RichTextV2ControlType, a5 as RichTextControlType, a6 as SlotControlType, a7 as StyleV2ControlType, a8 as ListControlType, a9 as ShapeControlType, aa as LinkControlType, ab as ImageControlType, ac as ColorControlType, ad as getComponentPropControllerDescriptors, ae as getPropControllers, af as Types, ag as BorderPropControllerFormat, ah as ShadowsPropControllerFormat, ai as BorderRadiusPropControllerFormat, aj as MarginPropControllerFormat, ak as PaddingPropControllerFormat, al as WidthPropControllerFormat, am as configureStore$1, an as copyElementTree, ao as getBreakpoints, ap as parseLocalesInput, aq as getDocument, ar as getElementId, as as getIsPreview, at as getIsInBuilder, au as getReactComponent, av as getBuilderEditMode } from "./react-page.es.js";
+import { a as createDocumentReference, g as getPropControllerDescriptors, b as isElementReference, e as getSwatchIds, f as getFileIds, h as getTypographyIds, j as getTableIds, k as getPageIds, l as getElementChildren, E as ElementID, B as Backgrounds, W as Width, m as ResponsiveIconRadioGroup, M as Margin, P as Padding, n as Border, o as BorderRadius, S as Shadows, G as GapY, p as GapX, q as ResponsiveSelect, r as ResponsiveNumber, s as Checkbox, t as Grid, u as TextInput, L as Link, v as ResponsiveColor, w as TextStyle, C as ComponentIcon, I as Images, N as Number$1, D as Date$1, F as Font, x as ResponsiveLength, y as TextArea, z as Table, A as TableFormFields, H as Image, J as ResponsiveOpacity, K as NavigationLinks, O as SocialLinks, Q as RichText, V as Video, U as useStyle, X as getBorderSwatchIds, Y as getBoxShadowsSwatchIds, Z as getResponsiveColorSwatchIds, _ as StyleControlProperty, $ as ImageControlValueFormat, a0 as isPropControllersHandle, a1 as isRichTextV1Data, a2 as isNonNullable$1, a3 as TypographyControlType, a4 as StyleControlType, a5 as RichTextV2ControlType, a6 as RichTextControlType, a7 as SlotControlType, a8 as StyleV2ControlType, a9 as ListControlType, aa as ShapeControlType, ab as LinkControlType, ac as ImageControlType, ad as ColorControlType, ae as getComponentPropControllerDescriptors, af as getPropControllers, ag as Types, ah as BorderPropControllerFormat, ai as ShadowsPropControllerFormat, aj as BorderRadiusPropControllerFormat, ak as MarginPropControllerFormat, al as PaddingPropControllerFormat, am as WidthPropControllerFormat, an as configureStore$1, ao as copyElementTree, ap as getBreakpoints, aq as parseLocalesInput, ar as getDocument, as as getElementId, at as getIsPreview, au as getIsInBuilder, av as getReactComponent, aw as getBuilderEditMode } from "./react-page.es.js";
 import { A as ActionTypes, o as apiResourceFulfilled, p as registerComponentEffect, q as registerReactComponentEffect, t as registerComponentHandleEffect, v as mountComponentEffect } from "./actions.es.js";
 import { jsx, jsxs, Fragment } from "react/jsx-runtime";
-import { T as TypographyControlType, I as IconRadioGroupControlType, S as SelectControlType, a as TextAreaControlType, b as TextInputControlType, N as NumberControlType, C as CheckboxControlType } from "./typography.es.js";
+import { I as IconRadioGroupControlType, S as SelectControlType, T as TextAreaControlType, a as TextInputControlType, N as NumberControlType, C as CheckboxControlType } from "./text-input.es.js";
 import { C as ComboboxControlType } from "./combobox.es.js";
 import "slate";
 import { useSyncExternalStore } from "use-sync-external-store/shim";
@@ -916,7 +916,8 @@ Received "${apiKey}" instead.`);
     return response;
   }
   async getPages() {
-    const response = await this.fetch(`/v2/pages`, {
+    const isUsingVersioning = this.siteVersion != null;
+    const response = await this.fetch(`/${isUsingVersioning ? "v3" : "v2"}/pages`, {
       headers: {
         "Makeswift-Site-Version": MakeswiftSiteVersion.Live
       }
@@ -934,7 +935,8 @@ Received "${apiKey}" instead.`);
   }
   async getSwatches(ids, preview) {
     var _a;
-    const url = new URL(`v1/swatches/bulk`, this.apiOrigin);
+    const isUsingVersioning = this.siteVersion != null;
+    const url = new URL(`${isUsingVersioning ? "v2" : "v1"}/swatches/bulk`, this.apiOrigin);
     ids.forEach((id) => {
       url.searchParams.append("ids", id);
     });
@@ -1086,11 +1088,12 @@ Received "${apiKey}" instead.`);
     unstable_locale
   } = {}) {
     var _a;
+    const isUsingVersioning = this.siteVersion != null;
     const siteVersion = (_a = this.siteVersion) != null ? _a : previewOverride ? MakeswiftSiteVersion.Working : MakeswiftSiteVersion.Live;
     const searchParams = new URLSearchParams();
     if (unstable_locale)
       searchParams.set("locale", unstable_locale);
-    const response = await this.fetch(`/v2/pages/${encodeURIComponent(pathname)}/document?${searchParams.toString()}`, {
+    const response = await this.fetch(`/${isUsingVersioning ? "v3" : "v2"}/pages/${encodeURIComponent(pathname)}/document?${searchParams.toString()}`, {
       headers: { "Makeswift-Site-Version": siteVersion }
     });
     if (!response.ok) {
@@ -1113,7 +1116,8 @@ Received "${apiKey}" instead.`);
     };
   }
   async getSwatch(swatchId) {
-    const response = await this.fetch(`v1/swatches/${swatchId}`);
+    const isUsingVersioning = this.siteVersion != null;
+    const response = await this.fetch(`${isUsingVersioning ? "v2" : "v1"}/swatches/${swatchId}`);
     if (!response.ok) {
       if (response.status !== 404)
         console.error("Failed to get swatch", await response.json());
@@ -1202,7 +1206,7 @@ async function fonts(_req, res, { getFonts } = {}) {
   const fonts2 = (_a = await (getFonts == null ? void 0 : getFonts())) != null ? _a : [];
   return res.json(fonts2);
 }
-const version = "0.9.10";
+const version = "0.9.12";
 async function handler(req, res, { apiKey, unstable_siteVersions }) {
   if (req.query.secret !== apiKey) {
     return res.status(401).json({ message: "Unauthorized" });
@@ -2533,6 +2537,9 @@ const FallbackComponent = forwardRef(function FallbackComponent2({
     })]
   });
 });
+function isNonNullable(value) {
+  return value != null;
+}
 function useSwatch(swatchId) {
   const client = useMakeswiftClient();
   const readSwatch = () => swatchId == null ? null : client.readSwatch(swatchId);
@@ -2641,7 +2648,7 @@ function mapSideColor(swatches, _e) {
   return __spreadProps(__spreadValues({}, restOfSide), {
     color: color && {
       alpha: color.alpha,
-      swatch: swatches.filter(isNonNullable$1).find((s) => s && s.id === color.swatchId)
+      swatch: swatches.filter(isNonNullable).find((s) => s && s.id === color.swatchId)
     }
   });
 }
@@ -2687,7 +2694,7 @@ function useBoxShadow(value) {
         return __spreadProps(__spreadValues({}, restOfShadow), {
           payload: {
             color: color != null ? {
-              swatch: swatches.filter(isNonNullable$1).find((s) => s && s.id === color.swatchId),
+              swatch: swatches.filter(isNonNullable).find((s) => s && s.id === color.swatchId),
               alpha: color.alpha
             } : null,
             inset: inset != null ? inset : ShadowDefaultValue.inset,
@@ -2711,7 +2718,7 @@ function useResponsiveColor(color) {
     const { swatchId, alpha } = v;
     const swatch = swatches.find((s) => s && s.id === swatchId);
     return swatch == null ? null : __spreadProps(__spreadValues({}, rest), { value: { swatch, alpha } });
-  }).filter(isNonNullable$1);
+  }).filter(isNonNullable);
 }
 const getIndexes = (spans, index) => {
   const flattened = spans.reduce((a, s) => a.concat(s), []);
@@ -3199,7 +3206,7 @@ function useRichTextV2(data, definition, control) {
     control
   }) : /* @__PURE__ */ jsx(ReadOnlyText, {
     text: data,
-    control
+    definition
   });
 }
 function useSelectControlValue(data, definition) {
@@ -3425,9 +3432,6 @@ function useTextAreaValue(data, definition) {
 function useTextInputValue(data, definition) {
   return data != null ? data : definition.config.defaultValue;
 }
-function isNonNullable(value) {
-  return value != null;
-}
 function typographyFragementToTypographyControlData(typography) {
   if (typography == null)
     return void 0;
@@ -3459,7 +3463,7 @@ function getTypographyStyleSwatchIds(style) {
   return (_a = style == null ? void 0 : style.map((override) => override.value).flatMap((typographyStyle) => {
     var _a2;
     return (_a2 = typographyStyle.color) == null ? void 0 : _a2.swatchId;
-  }).filter(isNonNullable)) != null ? _a : [];
+  }).filter(isNonNullable$1)) != null ? _a : [];
 }
 const withColor = (swatches) => (deviceRawTypographyValue) => {
   var _b, _c;
@@ -3495,7 +3499,7 @@ function useEnhancedTypography(value) {
     ...getTypographyStyleSwatchIds(value == null ? void 0 : value.style),
     ...getTypographyStyleSwatchIds(typography == null ? void 0 : typography.style)
   ];
-  const swatches = useSwatches(swatchIds).filter(isNonNullable);
+  const swatches = useSwatches(swatchIds).filter(isNonNullable$1);
   const enhancedSource = source.map(withColor(swatches));
   const enhancedOverride = override.map(withColor(swatches));
   const devices = [
@@ -3522,7 +3526,7 @@ function useEnhancedTypography(value) {
       };
     }
     return null;
-  }).filter(isNonNullable);
+  }).filter(isNonNullable$1);
 }
 function useTypographyClassName(value) {
   return useStyle(useResponsiveStyle([value], ([value2]) => {
@@ -4223,5 +4227,5 @@ const DocumentReference = memo(forwardRef(function DocumentReference2({
     document: document2
   });
 }));
-export { Makeswift as $, Alignments as A, forwardNextDynamicRef as B, Contrasts as C, DocumentReference as D, Element$1 as E, useIsPreview as F, useFiles as G, useSwatches as H, usePagePathnameSlice as I, useElementId as J, shallowEqual as K, deepEqual as L, ElementImperativeHandle as M, StoreContext as N, MakeswiftProvider as O, PageProvider as P, ControlValue as Q, RuntimeProvider as R, Shapes as S, useBuilderEditMode as T, pollBoxModel as U, useEnhancedTypography as V, useTypographyClassName as W, getStaticPaths as X, getStaticProps as Y, getServerSideProps as Z, Page as _, ReactRuntime as a, PreviewModeScript as a0, Document$1 as a1, MakeswiftApiHandler as a2, usePageId as b, DEFAULT_BOX_ANIMATE_TYPE as c, DEFAULT_BOX_ANIMATE_DELAY as d, DEFAULT_BOX_ANIMATE_DURATION as e, DEFAULT_ITEM_ANIMATE_TYPE as f, DEFAULT_ITEM_ANIMATE_DELAY as g, DEFAULT_ITEM_ANIMATE_DURATION as h, DEFAULT_ITEM_STAGGER_DURATION as i, useBorder as j, useBoxShadow as k, useResponsiveColor as l, Page$1 as m, useResponsiveStyle as n, useResponsiveWidth as o, useResponsiveTextStyle as p, colorToString as q, useBreakpoints as r, Sizes as s, useFormContext as t, useIsInBuilder as u, useResponsiveGridItem as v, useTable as w, useMakeswiftClient as x, Provider as y, useFile as z };
+export { Page as $, Alignments as A, forwardNextDynamicRef as B, Contrasts as C, DocumentReference as D, Element$1 as E, useIsPreview as F, isNonNullable as G, useFiles as H, useSwatches as I, usePagePathnameSlice as J, useElementId as K, shallowEqual as L, deepEqual as M, ElementImperativeHandle as N, StoreContext as O, PageProvider as P, MakeswiftProvider as Q, RuntimeProvider as R, Shapes as S, ControlValue as T, useBuilderEditMode as U, pollBoxModel as V, useEnhancedTypography as W, useTypographyClassName as X, getStaticPaths as Y, getStaticProps as Z, getServerSideProps as _, ReactRuntime as a, Makeswift as a0, PreviewModeScript as a1, Document$1 as a2, MakeswiftApiHandler as a3, usePageId as b, DEFAULT_BOX_ANIMATE_TYPE as c, DEFAULT_BOX_ANIMATE_DELAY as d, DEFAULT_BOX_ANIMATE_DURATION as e, DEFAULT_ITEM_ANIMATE_TYPE as f, DEFAULT_ITEM_ANIMATE_DELAY as g, DEFAULT_ITEM_ANIMATE_DURATION as h, DEFAULT_ITEM_STAGGER_DURATION as i, useBorder as j, useBoxShadow as k, useResponsiveColor as l, Page$1 as m, useResponsiveStyle as n, useResponsiveWidth as o, useResponsiveTextStyle as p, colorToString as q, useBreakpoints as r, Sizes as s, useFormContext as t, useIsInBuilder as u, useResponsiveGridItem as v, useTable as w, useMakeswiftClient as x, Provider as y, useFile as z };
 //# sourceMappingURL=index.es.js.map