@makeswift/runtime 0.28.10-canary.8 → 0.29.0-canary.19

package/dist/cjs/runtimes/react/controls/rich-text-v2/EditableTextV2/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../../../src/runtimes/react/controls/rich-text-v2/EditableTextV2/index.tsx"],"sourcesContent":["export * from './editable-text-v2'\nimport EditableTextV2 from './editable-text-v2'\nexport default EditableTextV2\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mCAAc,+BAAd;AACA,8BAA2B;AAC3B,IAAO,yBAAQ,wBAAAA;","names":["EditableTextV2"]}
+{"version":3,"sources":["../../../../../../../src/runtimes/react/controls/rich-text-v2/EditableTextV2/index.tsx"],"sourcesContent":["import { EditableTextV2Value } from './editable-text-v2'\nexport default EditableTextV2Value\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,8BAAoC;AACpC,IAAO,yBAAQ;","names":[]}

package/dist/cjs/runtimes/react/controls/rich-text-v2/EditableTextV2/render-element.js

@@ -22,19 +22,52 @@ __export(render_element_exports, {
 });
 module.exports = __toCommonJS(render_element_exports);
 var import_jsx_runtime = require("react/jsx-runtime");
+var import_slate_react = require("slate-react");
 var import_control = require("../../control");
-function RichTextV2Element({ definition, plugins, ...props }) {
+function RichTextV2Element({
+  plugins,
+  pathComponents,
+  parentStylesheetKey,
+  ...props
+}) {
+  const slateEditor = (0, import_slate_react.useSlateStatic)();
   function initialRenderElement(props2) {
     return props2.children;
   }
+  const slatePath = () => {
+    try {
+      return import_slate_react.ReactEditor.findPath(slateEditor, props.element);
+    } catch (error) {
+      return [];
+    }
+  };
+  const slatePathString = `slate-editor-path-[${slatePath().join(",")}]`;
   const renderElement = plugins.reduce(
-    (renderFn, plugin) => (props2) => {
+    (renderFn, plugin, index) => function RenderElementPlugin(props2) {
       const { control, renderElement: renderElement2 } = plugin;
       if (renderElement2 == null)
         return renderFn(props2);
       if (control == null || control.getElementValue == null)
         return renderElement2(renderFn, void 0)(props2);
-      return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_control.ControlValue, { definition: control.definition, data: control.getElementValue(props2.element), children: (value) => renderElement2(renderFn, value)(props2) });
+      const pseudoElementKey = parentStylesheetKey;
+      const elementPathComponents = [
+        ...pathComponents,
+        `editable`,
+        `plugins`,
+        `${index}`,
+        `element`,
+        slatePathString
+      ];
+      return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        import_control.ControlValue,
+        {
+          definition: control.definition,
+          data: control.getElementValue(props2.element),
+          elementKey: pseudoElementKey,
+          propPathComponents: elementPathComponents,
+          children: (value) => renderElement2(renderFn, value)(props2)
+        }
+      );
     },
     initialRenderElement
   );

package/dist/cjs/runtimes/react/controls/rich-text-v2/EditableTextV2/render-element.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../../../src/runtimes/react/controls/rich-text-v2/EditableTextV2/render-element.tsx"],"sourcesContent":["import { RenderElementProps } from 'slate-react'\n\nimport { RichTextV2Definition } from '../../../../../controls/rich-text-v2'\nimport { RichTextV2Plugin } from '../../../../../controls/rich-text-v2/plugin'\n\nimport { ControlValue } from '../../control'\n\ntype RichTextV2ElementProps = RenderElementProps & {\n  definition: RichTextV2Definition\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 (renderElement == null) return renderFn(props)\n\n      if (control == null || control.getElementValue == null)\n        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"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AA2BQ;AAtBR,qBAA6B;AAOtB,SAAS,kBAAkB,EAAE,YAAY,SAAS,GAAG,MAAM,GAA2B;AAC3F,WAAS,qBAAqBA,QAA2B;AACvD,WAAOA,OAAM;AAAA,EACf;AAEA,QAAM,gBAAgB,QAAQ;AAAA,IAC5B,CAAC,UAAU,WAAW,CAACA,WAA8B;AACnD,YAAM,EAAE,SAAS,eAAAC,eAAc,IAAI;AAEnC,UAAIA,kBAAiB;AAAM,eAAO,SAASD,MAAK;AAEhD,UAAI,WAAW,QAAQ,QAAQ,mBAAmB;AAChD,eAAOC,eAAc,UAAU,MAAS,EAAED,MAAK;AAEjD,aACE,4CAAC,+BAAa,YAAY,QAAQ,YAAY,MAAM,QAAQ,gBAAgBA,OAAM,OAAO,GACtF,qBAASC,eAAc,UAAU,KAAK,EAAED,MAAK,GAChD;AAAA,IAEJ;AAAA,IACA;AAAA,EACF;AAEA,SAAO,cAAc,KAAK;AAC5B;","names":["props","renderElement"]}
+{"version":3,"sources":["../../../../../../../src/runtimes/react/controls/rich-text-v2/EditableTextV2/render-element.tsx"],"sourcesContent":["import { ReactEditor, RenderElementProps, useSlateStatic } from 'slate-react'\n\nimport { RichTextV2Plugin } from '../../../../../controls/rich-text-v2/plugin'\n\nimport { ControlValue } from '../../control'\n\ntype RichTextV2ElementProps = RenderElementProps & {\n  plugins: RichTextV2Plugin[]\n  pathComponents: string[]\n  parentStylesheetKey: string\n}\n\nexport function RichTextV2Element({\n  plugins,\n  pathComponents,\n  parentStylesheetKey,\n  ...props\n}: RichTextV2ElementProps) {\n  const slateEditor = useSlateStatic()\n  function initialRenderElement(props: RenderElementProps) {\n    return props.children\n  }\n\n  const slatePath = () => {\n    try {\n      return ReactEditor.findPath(slateEditor, props.element)\n    } catch (error) {\n      return []\n    }\n  }\n  const slatePathString = `slate-editor-path-[${slatePath().join(',')}]`\n\n  const renderElement = plugins.reduce(\n    (renderFn, plugin, index) =>\n      function RenderElementPlugin(props: RenderElementProps) {\n        const { control, renderElement } = plugin\n\n        if (renderElement == null) return renderFn(props)\n\n        if (control == null || control.getElementValue == null)\n          return renderElement(renderFn, undefined)(props)\n\n        const pseudoElementKey = parentStylesheetKey\n        const elementPathComponents = [\n          ...pathComponents,\n          `editable`,\n          `plugins`,\n          `${index}`,\n          `element`,\n          slatePathString,\n        ]\n\n        return (\n          <ControlValue\n            definition={control.definition}\n            data={control.getElementValue(props.element)}\n            elementKey={pseudoElementKey}\n            propPathComponents={elementPathComponents}\n          >\n            {value => renderElement(renderFn, value)(props)}\n          </ControlValue>\n        )\n      },\n    initialRenderElement,\n  )\n\n  return renderElement(props)\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAqDU;AArDV,yBAAgE;AAIhE,qBAA6B;AAQtB,SAAS,kBAAkB;AAAA,EAChC;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAA2B;AACzB,QAAM,kBAAc,mCAAe;AACnC,WAAS,qBAAqBA,QAA2B;AACvD,WAAOA,OAAM;AAAA,EACf;AAEA,QAAM,YAAY,MAAM;AACtB,QAAI;AACF,aAAO,+BAAY,SAAS,aAAa,MAAM,OAAO;AAAA,IACxD,SAAS,OAAO;AACd,aAAO,CAAC;AAAA,IACV;AAAA,EACF;AACA,QAAM,kBAAkB,sBAAsB,UAAU,EAAE,KAAK,GAAG,CAAC;AAEnE,QAAM,gBAAgB,QAAQ;AAAA,IAC5B,CAAC,UAAU,QAAQ,UACjB,SAAS,oBAAoBA,QAA2B;AACtD,YAAM,EAAE,SAAS,eAAAC,eAAc,IAAI;AAEnC,UAAIA,kBAAiB;AAAM,eAAO,SAASD,MAAK;AAEhD,UAAI,WAAW,QAAQ,QAAQ,mBAAmB;AAChD,eAAOC,eAAc,UAAU,MAAS,EAAED,MAAK;AAEjD,YAAM,mBAAmB;AACzB,YAAM,wBAAwB;AAAA,QAC5B,GAAG;AAAA,QACH;AAAA,QACA;AAAA,QACA,GAAG,KAAK;AAAA,QACR;AAAA,QACA;AAAA,MACF;AAEA,aACE;AAAA,QAAC;AAAA;AAAA,UACC,YAAY,QAAQ;AAAA,UACpB,MAAM,QAAQ,gBAAgBA,OAAM,OAAO;AAAA,UAC3C,YAAY;AAAA,UACZ,oBAAoB;AAAA,UAEnB,qBAASC,eAAc,UAAU,KAAK,EAAED,MAAK;AAAA;AAAA,MAChD;AAAA,IAEJ;AAAA,IACF;AAAA,EACF;AAEA,SAAO,cAAc,KAAK;AAC5B;","names":["props","renderElement"]}

package/dist/cjs/runtimes/react/controls/rich-text-v2/EditableTextV2/render-leaf.js

@@ -23,18 +23,42 @@ __export(render_leaf_exports, {
 module.exports = __toCommonJS(render_leaf_exports);
 var import_jsx_runtime = require("react/jsx-runtime");
 var import_control = require("../../control");
-function RichTextV2Leaf({ definition, plugins, ...props }) {
+function RichTextV2Leaf({
+  plugins,
+  pathComponents,
+  parentStylesheetKey,
+  ...props
+}) {
   function initialRenderLeaf({ attributes, children, leaf }) {
     return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: leaf.className, ...attributes, children });
   }
   const renderLeaf = plugins.reduce(
-    (renderFn, plugin) => (props2) => {
+    (renderFn, plugin, index) => function RenderLeafPlugin(props2) {
       const { control, renderLeaf: renderLeaf2 } = plugin;
       if (control?.definition == null || renderLeaf2 == null)
         return renderFn(props2);
       if (control.getLeafValue == null)
         return renderLeaf2(renderFn, void 0)(props2);
-      return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_control.ControlValue, { definition: control.definition, data: control.getLeafValue(props2.leaf), children: (value) => renderLeaf2(renderFn, value)(props2) });
+      const slatePath = props2.leaf._makeswiftLeafPath ?? "";
+      const pseudoElementKey = parentStylesheetKey;
+      const leafPathComponents = [
+        ...pathComponents,
+        `editable`,
+        `plugins`,
+        `${index}`,
+        `leaf`,
+        slatePath
+      ];
+      return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        import_control.ControlValue,
+        {
+          definition: control.definition,
+          data: control.getLeafValue(props2.leaf),
+          elementKey: pseudoElementKey,
+          propPathComponents: leafPathComponents,
+          children: (value) => renderLeaf2(renderFn, value)(props2)
+        }
+      );
     },
     initialRenderLeaf
   );

package/dist/cjs/runtimes/react/controls/rich-text-v2/EditableTextV2/render-leaf.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../../../src/runtimes/react/controls/rich-text-v2/EditableTextV2/render-leaf.tsx"],"sourcesContent":["import { ReactNode } from 'react'\nimport { RenderLeafProps } from 'slate-react'\nimport { RichTextV2Definition } from '../../../../../controls/rich-text-v2'\nimport { RichTextV2Plugin } from '../../../../../controls/rich-text-v2/plugin'\nimport { ControlValue } from '../../control'\n\ntype RichTextV2LeafProps = RenderLeafProps & {\n  definition: RichTextV2Definition\n  plugins: RichTextV2Plugin[]\n}\n\nexport function RichTextV2Leaf({ definition, plugins, ...props }: RichTextV2LeafProps) {\n  function initialRenderLeaf({ attributes, children, leaf }: RenderLeafProps): ReactNode {\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"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAcM;AAVN,qBAA6B;AAOtB,SAAS,eAAe,EAAE,YAAY,SAAS,GAAG,MAAM,GAAwB;AACrF,WAAS,kBAAkB,EAAE,YAAY,UAAU,KAAK,GAA+B;AACrF,WACE,4CAAC,UAAK,WAAW,KAAK,WAAY,GAAG,YAClC,UACH;AAAA,EAEJ;AAEA,QAAM,aAAa,QAAQ;AAAA,IACzB,CAAC,UAAU,WAAW,CAACA,WAA2B;AAChD,YAAM,EAAE,SAAS,YAAAC,YAAW,IAAI;AAEhC,UAAI,SAAS,cAAc,QAAQA,eAAc;AAAM,eAAO,SAASD,MAAK;AAE5E,UAAI,QAAQ,gBAAgB;AAAM,eAAOC,YAAW,UAAU,MAAS,EAAED,MAAK;AAE9E,aACE,4CAAC,+BAAa,YAAY,QAAQ,YAAY,MAAM,QAAQ,aAAaA,OAAM,IAAI,GAChF,qBAASC,YAAW,UAAU,KAAK,EAAED,MAAK,GAC7C;AAAA,IAEJ;AAAA,IACA;AAAA,EACF;AAEA,SAAO,WAAW,KAAK;AACzB;","names":["props","renderLeaf"]}
+{"version":3,"sources":["../../../../../../../src/runtimes/react/controls/rich-text-v2/EditableTextV2/render-leaf.tsx"],"sourcesContent":["import { ReactNode } from 'react'\nimport { RenderLeafProps } from 'slate-react'\nimport { RichTextV2Plugin } from '../../../../../controls/rich-text-v2/plugin'\nimport { ControlValue } from '../../control'\n\ntype RichTextV2LeafProps = RenderLeafProps & {\n  plugins: RichTextV2Plugin[]\n  pathComponents: string[]\n  parentStylesheetKey: string\n}\n\nexport function RichTextV2Leaf({\n  plugins,\n  pathComponents,\n  parentStylesheetKey,\n  ...props\n}: RichTextV2LeafProps) {\n  function initialRenderLeaf({ attributes, children, leaf }: RenderLeafProps): ReactNode {\n    return (\n      <span className={leaf.className} {...attributes}>\n        {children}\n      </span>\n    )\n  }\n\n  const renderLeaf = plugins.reduce(\n    (renderFn, plugin, index) =>\n      function RenderLeafPlugin(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        // @ts-expect-error - this is a property that is added by a custom Slate decorator and is used by the css runtime\n        const slatePath = props.leaf._makeswiftLeafPath ?? ''\n        const pseudoElementKey = parentStylesheetKey\n        const leafPathComponents = [\n          ...pathComponents,\n          `editable`,\n          `plugins`,\n          `${index}`,\n          `leaf`,\n          slatePath,\n        ]\n\n        return (\n          <ControlValue\n            definition={control.definition}\n            data={control.getLeafValue(props.leaf)}\n            elementKey={pseudoElementKey}\n            propPathComponents={leafPathComponents}\n          >\n            {value => renderLeaf(renderFn, value)(props)}\n          </ControlValue>\n        )\n      },\n    initialRenderLeaf,\n  )\n\n  return renderLeaf(props)\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAmBM;AAhBN,qBAA6B;AAQtB,SAAS,eAAe;AAAA,EAC7B;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAAwB;AACtB,WAAS,kBAAkB,EAAE,YAAY,UAAU,KAAK,GAA+B;AACrF,WACE,4CAAC,UAAK,WAAW,KAAK,WAAY,GAAG,YAClC,UACH;AAAA,EAEJ;AAEA,QAAM,aAAa,QAAQ;AAAA,IACzB,CAAC,UAAU,QAAQ,UACjB,SAAS,iBAAiBA,QAAwB;AAChD,YAAM,EAAE,SAAS,YAAAC,YAAW,IAAI;AAEhC,UAAI,SAAS,cAAc,QAAQA,eAAc;AAAM,eAAO,SAASD,MAAK;AAE5E,UAAI,QAAQ,gBAAgB;AAAM,eAAOC,YAAW,UAAU,MAAS,EAAED,MAAK;AAE9E,YAAM,YAAYA,OAAM,KAAK,sBAAsB;AACnD,YAAM,mBAAmB;AACzB,YAAM,qBAAqB;AAAA,QACzB,GAAG;AAAA,QACH;AAAA,QACA;AAAA,QACA,GAAG,KAAK;AAAA,QACR;AAAA,QACA;AAAA,MACF;AAEA,aACE;AAAA,QAAC;AAAA;AAAA,UACC,YAAY,QAAQ;AAAA,UACpB,MAAM,QAAQ,aAAaA,OAAM,IAAI;AAAA,UACrC,YAAY;AAAA,UACZ,oBAAoB;AAAA,UAEnB,qBAASC,YAAW,UAAU,KAAK,EAAED,MAAK;AAAA;AAAA,MAC7C;AAAA,IAEJ;AAAA,IACF;AAAA,EACF;AAEA,SAAO,WAAW,KAAK;AACzB;","names":["props","renderLeaf"]}

package/dist/cjs/runtimes/react/controls/rich-text-v2/EditableTextV2/usePresetValue.js

@@ -27,7 +27,7 @@ var import_controls = require("@makeswift/controls");
 var import_breakpoints = require("../../../../../state/modules/breakpoints");
 var import_use_breakpoints = require("../../../hooks/use-breakpoints");
 var import_controls2 = require("../../../../../controls");
-function usePresetValue(definition) {
+function usePresetValue(config) {
   const breakpoints = (0, import_use_breakpoints.useBreakpoints)();
   return (0, import_react.useMemo)(
     () => [
@@ -35,8 +35,8 @@ function usePresetValue(definition) {
         type: import_controls.Slate.BlockType.Default,
         children: [
           {
-            text: definition.config.defaultValue ?? "",
-            ...definition.config.mode === import_controls2.RichText.Mode.Inline ? {} : {
+            text: config.defaultValue ?? "",
+            ...config.mode === import_controls2.RichText.Mode.Inline ? {} : {
               typography: {
                 style: [
                   {
@@ -60,7 +60,7 @@ function usePresetValue(definition) {
         ]
       }
     ],
-    [definition.config.mode, definition.config.defaultValue, breakpoints]
+    [config.mode, config.defaultValue, breakpoints]
   );
 }
 const defaultValue = [

package/dist/cjs/runtimes/react/controls/rich-text-v2/EditableTextV2/usePresetValue.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../../../src/runtimes/react/controls/rich-text-v2/EditableTextV2/usePresetValue.tsx"],"sourcesContent":["import { useMemo } from 'react'\nimport { Descendant } from 'slate'\nimport { Slate, getBaseBreakpoint } from '@makeswift/controls'\n\nimport { DefaultBreakpointID } from '../../../../../state/modules/breakpoints'\nimport { useBreakpoints } from '../../../hooks/use-breakpoints'\nimport { RichTextV2Definition, RichText } from '../../../../../controls'\n\nexport function usePresetValue(definition: RichTextV2Definition): Descendant[] {\n  const breakpoints = useBreakpoints()\n  return useMemo(\n    () => [\n      {\n        type: Slate.BlockType.Default,\n        children: [\n          {\n            text: definition.config.defaultValue ?? '',\n            ...(definition.config.mode === RichText.Mode.Inline\n              ? {}\n              : {\n                  typography: {\n                    style: [\n                      {\n                        deviceId: getBaseBreakpoint(breakpoints).id,\n                        value: {\n                          fontWeight: 400,\n                          fontSize: { value: 18, unit: 'px' },\n                          lineHeight: 1.5,\n                        },\n                      },\n                      ...(breakpoints.some(({ id }) => id === DefaultBreakpointID.Mobile)\n                        ? [\n                            {\n                              deviceId: DefaultBreakpointID.Mobile,\n                              value: { fontSize: { value: 16, unit: 'px' } },\n                            },\n                          ]\n                        : []),\n                    ],\n                  },\n                }),\n          },\n        ],\n      },\n    ],\n    [definition.config.mode, definition.config.defaultValue, breakpoints],\n  )\n}\n\nexport const defaultValue = [\n  {\n    type: Slate.BlockType.Default,\n    children: [\n      {\n        text: '',\n      },\n    ],\n  },\n]\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAAwB;AAExB,sBAAyC;AAEzC,yBAAoC;AACpC,6BAA+B;AAC/B,IAAAA,mBAA+C;AAExC,SAAS,eAAe,YAAgD;AAC7E,QAAM,kBAAc,uCAAe;AACnC,aAAO;AAAA,IACL,MAAM;AAAA,MACJ;AAAA,QACE,MAAM,sBAAM,UAAU;AAAA,QACtB,UAAU;AAAA,UACR;AAAA,YACE,MAAM,WAAW,OAAO,gBAAgB;AAAA,YACxC,GAAI,WAAW,OAAO,SAAS,0BAAS,KAAK,SACzC,CAAC,IACD;AAAA,cACE,YAAY;AAAA,gBACV,OAAO;AAAA,kBACL;AAAA,oBACE,cAAU,mCAAkB,WAAW,EAAE;AAAA,oBACzC,OAAO;AAAA,sBACL,YAAY;AAAA,sBACZ,UAAU,EAAE,OAAO,IAAI,MAAM,KAAK;AAAA,sBAClC,YAAY;AAAA,oBACd;AAAA,kBACF;AAAA,kBACA,GAAI,YAAY,KAAK,CAAC,EAAE,GAAG,MAAM,OAAO,uCAAoB,MAAM,IAC9D;AAAA,oBACE;AAAA,sBACE,UAAU,uCAAoB;AAAA,sBAC9B,OAAO,EAAE,UAAU,EAAE,OAAO,IAAI,MAAM,KAAK,EAAE;AAAA,oBAC/C;AAAA,kBACF,IACA,CAAC;AAAA,gBACP;AAAA,cACF;AAAA,YACF;AAAA,UACN;AAAA,QACF;AAAA,MACF;AAAA,IACF;AAAA,IACA,CAAC,WAAW,OAAO,MAAM,WAAW,OAAO,cAAc,WAAW;AAAA,EACtE;AACF;AAEO,MAAM,eAAe;AAAA,EAC1B;AAAA,IACE,MAAM,sBAAM,UAAU;AAAA,IACtB,UAAU;AAAA,MACR;AAAA,QACE,MAAM;AAAA,MACR;AAAA,IACF;AAAA,EACF;AACF;","names":["import_controls"]}
+{"version":3,"sources":["../../../../../../../src/runtimes/react/controls/rich-text-v2/EditableTextV2/usePresetValue.tsx"],"sourcesContent":["import { useMemo } from 'react'\nimport { Descendant } from 'slate'\n\nimport { type ConfigType, Slate, getBaseBreakpoint } from '@makeswift/controls'\n\nimport { DefaultBreakpointID } from '../../../../../state/modules/breakpoints'\nimport { useBreakpoints } from '../../../hooks/use-breakpoints'\nimport { RichTextV2Definition, RichText } from '../../../../../controls'\n\nexport function usePresetValue(config: ConfigType<RichTextV2Definition>): Descendant[] {\n  const breakpoints = useBreakpoints()\n  return useMemo(\n    () => [\n      {\n        type: Slate.BlockType.Default,\n        children: [\n          {\n            text: config.defaultValue ?? '',\n            ...(config.mode === RichText.Mode.Inline\n              ? {}\n              : {\n                  typography: {\n                    style: [\n                      {\n                        deviceId: getBaseBreakpoint(breakpoints).id,\n                        value: {\n                          fontWeight: 400,\n                          fontSize: { value: 18, unit: 'px' },\n                          lineHeight: 1.5,\n                        },\n                      },\n                      ...(breakpoints.some(({ id }) => id === DefaultBreakpointID.Mobile)\n                        ? [\n                            {\n                              deviceId: DefaultBreakpointID.Mobile,\n                              value: { fontSize: { value: 16, unit: 'px' } },\n                            },\n                          ]\n                        : []),\n                    ],\n                  },\n                }),\n          },\n        ],\n      },\n    ],\n    [config.mode, config.defaultValue, breakpoints],\n  )\n}\n\nexport const defaultValue = [\n  {\n    type: Slate.BlockType.Default,\n    children: [\n      {\n        text: '',\n      },\n    ],\n  },\n]\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAAwB;AAGxB,sBAA0D;AAE1D,yBAAoC;AACpC,6BAA+B;AAC/B,IAAAA,mBAA+C;AAExC,SAAS,eAAe,QAAwD;AACrF,QAAM,kBAAc,uCAAe;AACnC,aAAO;AAAA,IACL,MAAM;AAAA,MACJ;AAAA,QACE,MAAM,sBAAM,UAAU;AAAA,QACtB,UAAU;AAAA,UACR;AAAA,YACE,MAAM,OAAO,gBAAgB;AAAA,YAC7B,GAAI,OAAO,SAAS,0BAAS,KAAK,SAC9B,CAAC,IACD;AAAA,cACE,YAAY;AAAA,gBACV,OAAO;AAAA,kBACL;AAAA,oBACE,cAAU,mCAAkB,WAAW,EAAE;AAAA,oBACzC,OAAO;AAAA,sBACL,YAAY;AAAA,sBACZ,UAAU,EAAE,OAAO,IAAI,MAAM,KAAK;AAAA,sBAClC,YAAY;AAAA,oBACd;AAAA,kBACF;AAAA,kBACA,GAAI,YAAY,KAAK,CAAC,EAAE,GAAG,MAAM,OAAO,uCAAoB,MAAM,IAC9D;AAAA,oBACE;AAAA,sBACE,UAAU,uCAAoB;AAAA,sBAC9B,OAAO,EAAE,UAAU,EAAE,OAAO,IAAI,MAAM,KAAK,EAAE;AAAA,oBAC/C;AAAA,kBACF,IACA,CAAC;AAAA,gBACP;AAAA,cACF;AAAA,YACF;AAAA,UACN;AAAA,QACF;AAAA,MACF;AAAA,IACF;AAAA,IACA,CAAC,OAAO,MAAM,OAAO,cAAc,WAAW;AAAA,EAChD;AACF;AAEO,MAAM,eAAe;AAAA,EAC1B;AAAA,IACE,MAAM,sBAAM,UAAU;AAAA,IACtB,UAAU;AAAA,MACR;AAAA,QACE,MAAM;AAAA,MACR;AAAA,IACF;AAAA,EACF;AACF;","names":["import_controls"]}

package/dist/cjs/runtimes/react/controls/rich-text-v2/ReadOnlyTextV2.js

@@ -25,14 +25,13 @@ module.exports = __toCommonJS(ReadOnlyTextV2_exports);
 var import_jsx_runtime = require("react/jsx-runtime");
 var import_react = require("react");
 var import_rich_text_v2 = require("../../../../controls/rich-text-v2");
-var import_use_style = require("../../use-style");
 var import_utils = require("../../../../slate/utils");
 var import_control = require("../control");
-const ReadOnlyTextV2 = (0, import_react.forwardRef)(function ReadOnlyText({ text, definition }, ref) {
-  const descendantsAsString = (0, import_utils.toText)(
-    text?.descendants ?? [],
-    definition?.config.mode ?? import_rich_text_v2.RichText.Mode.Block
-  );
+var import_use_style = require("../../css-runtime/hooks/use-style");
+const ReadOnlyTextV2 = (0, import_react.forwardRef)(function ReadOnlyText({ text, config, parentStylesheetKey }, ref) {
+  const descendants = (0, import_react.useMemo)(() => text?.descendants ?? [], [text?.descendants]);
+  const plugins = (0, import_react.useMemo)(() => config ? new import_rich_text_v2.RichTextV2Definition(config).plugins : [], [config]);
+  const descendantsAsString = (0, import_utils.toText)(descendants, config?.mode ?? import_rich_text_v2.RichText.Mode.Block);
   return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
     "div",
     {
@@ -50,8 +49,10 @@ const ReadOnlyTextV2 = (0, import_react.forwardRef)(function ReadOnlyText({ text
       children: descendantsAsString === "" ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Placeholder, {}) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
         Descendants,
         {
-          plugins: definition?.config.plugins ?? [],
-          descendants: text?.descendants ?? []
+          pathComponents: [],
+          parentStylesheetKey,
+          plugins,
+          descendants
         }
       )
     }
@@ -59,50 +60,88 @@ const ReadOnlyTextV2 = (0, import_react.forwardRef)(function ReadOnlyText({ text
 });
 var ReadOnlyTextV2_default = ReadOnlyTextV2;
 function Placeholder({ text = "Write some text..." }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-    "span",
-    {
-      className: (0, import_use_style.useStyle)({
-        display: "inline-block",
-        width: 0,
-        maxWidth: "100%",
-        whiteSpace: "nowrap",
-        opacity: 0.333,
-        verticalAlign: "text-top"
-      }),
-      children: text
-    }
-  );
+  const { className, styleElement } = (0, import_use_style.useStyle)({
+    display: "inline-block",
+    width: 0,
+    maxWidth: "100%",
+    whiteSpace: "nowrap",
+    opacity: 0.333,
+    verticalAlign: "text-top"
+  });
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
+    styleElement,
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className, children: text })
+  ] });
 }
-function LeafComponent({ plugins, ...props }) {
+function LeafComponent({
+  plugins,
+  pathComponents,
+  parentStylesheetKey,
+  ...props
+}) {
   function initialRenderLeaf({ leaf }) {
     return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: leaf.className, children: leaf.text === "" ? "\uFEFF" : leaf.text });
   }
   const renderLeaf = plugins.reduce(
-    (renderFn, plugin) => (props2) => {
+    (renderFn, plugin, index) => function RenderLeafPlugin(props2) {
       const { control, renderLeaf: renderLeaf2 } = plugin;
       if (control?.definition == null || renderLeaf2 == null)
         return renderFn(props2);
       if (control.getLeafValue == null)
         return renderLeaf2(renderFn, void 0)(props2);
-      return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_control.ControlValue, { definition: control.definition, data: control.getLeafValue(props2.leaf), children: (value) => renderLeaf2(renderFn, value)(props2) });
+      const pseudoElementKey = parentStylesheetKey;
+      const leafPathComponents = [...pathComponents, `plugins`, `${index}`, `leaf`];
+      return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        import_control.ControlValue,
+        {
+          definition: control.definition,
+          data: control.getLeafValue(props2.leaf),
+          elementKey: pseudoElementKey,
+          propPathComponents: leafPathComponents,
+          children: (value) => renderLeaf2(renderFn, value)(props2)
+        }
+      );
     },
     initialRenderLeaf
   );
   return renderLeaf({ attributes: {}, leaf: props.leaf, children: null, text: props.leaf });
 }
-function ElementComponent({ plugins, ...props }) {
+function ElementComponent({
+  plugins,
+  pathComponents,
+  parentStylesheetKey,
+  ...props
+}) {
   function initialRenderElement(props2) {
-    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Descendants, { descendants: props2.element.children, plugins });
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+      Descendants,
+      {
+        descendants: props2.element.children,
+        plugins,
+        pathComponents,
+        parentStylesheetKey
+      }
+    );
   }
   const renderElement = plugins.reduce(
-    (renderFn, plugin) => (props2) => {
+    (renderFn, plugin, index) => function RenderElementPlugin(props2) {
       const { control, renderElement: renderElement2 } = plugin;
       if (control?.definition == null || renderElement2 == null)
         return renderFn(props2);
       if (control.getElementValue == null)
         return renderElement2(renderFn, void 0)(props2);
-      return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_control.ControlValue, { definition: control.definition, data: control.getElementValue(props2.element), children: (value) => renderElement2(renderFn, value)(props2) });
+      const pseudoElementKey = parentStylesheetKey;
+      const elementPathComponents = [...pathComponents, `plugins`, `${index}`, `element`];
+      return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        import_control.ControlValue,
+        {
+          definition: control.definition,
+          data: control.getElementValue(props2.element),
+          elementKey: pseudoElementKey,
+          propPathComponents: elementPathComponents,
+          children: (value) => renderElement2(renderFn, value)(props2)
+        }
+      );
     },
     initialRenderElement
   );
@@ -114,14 +153,35 @@ function isText(node) {
   return false;
 }
 function Descendants({
+  pathComponents,
+  parentStylesheetKey,
   descendants,
   plugins
 }) {
   return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, { children: descendants.map((descendant, index) => {
+    const descendantPathComponents = [...pathComponents, `descendants`, `${index}`];
     if (isText(descendant)) {
-      return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(LeafComponent, { plugins, leaf: descendant }, index);
+      return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        LeafComponent,
+        {
+          plugins,
+          leaf: descendant,
+          parentStylesheetKey,
+          pathComponents: descendantPathComponents
+        },
+        index
+      );
     }
-    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ElementComponent, { descendant, plugins }, index);
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+      ElementComponent,
+      {
+        descendant,
+        plugins,
+        pathComponents: descendantPathComponents,
+        parentStylesheetKey
+      },
+      index
+    );
   }) });
 }
 // Annotate the CommonJS export names for ESM import in node:

package/dist/cjs/runtimes/react/controls/rich-text-v2/ReadOnlyTextV2.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../../src/runtimes/react/controls/rich-text-v2/ReadOnlyTextV2.tsx"],"sourcesContent":["import { ForwardedRef, forwardRef, ReactNode } from 'react'\nimport { Descendant, Element, Text } from 'slate'\nimport { RenderElementProps, RenderLeafProps } from 'slate-react'\n\nimport { RichTextV2Definition, RichText } from '../../../../controls/rich-text-v2'\nimport { useStyle } from '../../use-style'\nimport { toText } from '../../../../slate/utils'\nimport { RichTextV2Plugin } from '../../../../controls/rich-text-v2/plugin'\nimport { RichTextDataV2 } from '../../../../controls/rich-text-v2'\n\nimport { ControlValue } from '../control'\n\ntype Props = {\n  text: RichTextDataV2 | undefined\n  definition: RichTextV2Definition | undefined\n}\n\nconst ReadOnlyTextV2 = forwardRef(function ReadOnlyText(\n  { text, definition }: Props,\n  ref: ForwardedRef<HTMLDivElement>,\n) {\n  const descendantsAsString = toText(\n    text?.descendants ?? [],\n    definition?.config.mode ?? RichText.Mode.Block,\n  )\n\n  return (\n    <div\n      ref={ref}\n      style={{\n        /**\n         * These are the default styles that Slate uses for its editable div.\n         * https://github.com/ianstormtaylor/slate/blob/4bd15ed3950e3a0871f5d0ecb391bb637c05e59d/packages/slate-react/src/components/editable.tsx\n         * Search for `disableDefaultStyles`\n         */\n        position: 'relative',\n        whiteSpace: 'pre-wrap',\n        wordWrap: 'break-word',\n      }}\n    >\n      {descendantsAsString === '' ? (\n        <Placeholder />\n      ) : (\n        <Descendants\n          plugins={definition?.config.plugins ?? []}\n          descendants={text?.descendants ?? []}\n        />\n      )}\n    </div>\n  )\n})\n\nexport default ReadOnlyTextV2\n\nfunction Placeholder({ text = 'Write some text...' }: { text?: string }) {\n  return (\n    <span\n      className={useStyle({\n        display: 'inline-block',\n        width: 0,\n        maxWidth: '100%',\n        whiteSpace: 'nowrap',\n        opacity: 0.333,\n        verticalAlign: 'text-top',\n      })}\n    >\n      {text}\n    </span>\n  )\n}\n\ntype LeafProps = {\n  leaf: Text\n  plugins: RichTextV2Plugin[]\n}\n\nexport function LeafComponent({ plugins, ...props }: LeafProps) {\n  function initialRenderLeaf({ leaf }: RenderLeafProps): ReactNode {\n    return <span className={leaf.className}>{leaf.text === '' ? '\\uFEFF' : leaf.text}</span>\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({ attributes: {} as any, leaf: props.leaf, children: null, text: props.leaf })\n}\n\ntype ElementProps = {\n  descendant: Element\n  plugins: RichTextV2Plugin[]\n}\n\nfunction ElementComponent({ plugins, ...props }: ElementProps) {\n  function initialRenderElement(props: RenderElementProps): ReactNode {\n    return <Descendants descendants={props.element.children} plugins={plugins} />\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({ attributes: {} as any, children: null, element: props.descendant })\n}\n\n// reimplemented from slate source for code splitting\nfunction isText(node: Descendant): node is Text {\n  if (typeof node === 'object' && 'text' in node) return true\n\n  return false\n}\n\nfunction Descendants({\n  descendants,\n  plugins,\n}: {\n  plugins: RichTextV2Plugin[]\n  descendants: Descendant[]\n}) {\n  return (\n    <>\n      {descendants.map((descendant, index) => {\n        if (isText(descendant)) {\n          return <LeafComponent key={index} plugins={plugins} leaf={descendant} />\n        }\n\n        return <ElementComponent key={index} descendant={descendant} plugins={plugins} />\n      })}\n    </>\n  )\n}\n"],"mappings":"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","names":["props","renderLeaf","renderElement"]}
+{"version":3,"sources":["../../../../../../src/runtimes/react/controls/rich-text-v2/ReadOnlyTextV2.tsx"],"sourcesContent":["import { type ReactNode, type ForwardedRef, forwardRef, useMemo } from 'react'\nimport { type Descendant, type Element, type Text } from 'slate'\nimport { type RenderElementProps, type RenderLeafProps } from 'slate-react'\n\nimport { type ConfigType } from '@makeswift/controls'\n\nimport {\n  type RichTextDataV2,\n  RichTextV2Definition,\n  RichText,\n} from '../../../../controls/rich-text-v2'\nimport { toText } from '../../../../slate/utils'\nimport { RichTextV2Plugin } from '../../../../controls/rich-text-v2/plugin'\n\nimport { ControlValue } from '../control'\nimport { useStyle } from '../../css-runtime/hooks/use-style'\n\ntype Props = {\n  text: RichTextDataV2 | undefined\n  config: ConfigType<RichTextV2Definition> | undefined\n  parentStylesheetKey: string\n}\n\nconst ReadOnlyTextV2 = forwardRef(function ReadOnlyText(\n  { text, config, parentStylesheetKey }: Props,\n  ref: ForwardedRef<HTMLDivElement>,\n) {\n  const descendants = useMemo(() => text?.descendants ?? [], [text?.descendants])\n  const plugins = useMemo(() => (config ? new RichTextV2Definition(config).plugins : []), [config])\n  const descendantsAsString = toText(descendants, config?.mode ?? RichText.Mode.Block)\n\n  return (\n    <div\n      ref={ref}\n      style={{\n        /**\n         * These are the default styles that Slate uses for its editable div.\n         * https://github.com/ianstormtaylor/slate/blob/4bd15ed3950e3a0871f5d0ecb391bb637c05e59d/packages/slate-react/src/components/editable.tsx\n         * Search for `disableDefaultStyles`\n         */\n        position: 'relative',\n        whiteSpace: 'pre-wrap',\n        wordWrap: 'break-word',\n      }}\n    >\n      {descendantsAsString === '' ? (\n        <Placeholder />\n      ) : (\n        <Descendants\n          pathComponents={[]}\n          parentStylesheetKey={parentStylesheetKey}\n          plugins={plugins}\n          descendants={descendants}\n        />\n      )}\n    </div>\n  )\n})\n\nexport default ReadOnlyTextV2\n\nfunction Placeholder({ text = 'Write some text...' }: { text?: string }) {\n  const { className, styleElement } = useStyle({\n    display: 'inline-block',\n    width: 0,\n    maxWidth: '100%',\n    whiteSpace: 'nowrap',\n    opacity: 0.333,\n    verticalAlign: 'text-top',\n  })\n  return (\n    <>\n      {styleElement}\n      <span className={className}>{text}</span>\n    </>\n  )\n}\n\ntype LeafProps = {\n  pathComponents: string[]\n  parentStylesheetKey: string\n  leaf: Text\n  plugins: RichTextV2Plugin[]\n}\n\nexport function LeafComponent({\n  plugins,\n  pathComponents,\n  parentStylesheetKey,\n  ...props\n}: LeafProps) {\n  function initialRenderLeaf({ leaf }: RenderLeafProps): ReactNode {\n    return <span className={leaf.className}>{leaf.text === '' ? '\\uFEFF' : leaf.text}</span>\n  }\n\n  const renderLeaf = plugins.reduce(\n    (renderFn, plugin, index) =>\n      function RenderLeafPlugin(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        const pseudoElementKey = parentStylesheetKey\n        const leafPathComponents = [...pathComponents, `plugins`, `${index}`, `leaf`]\n\n        return (\n          <ControlValue\n            definition={control.definition}\n            data={control.getLeafValue(props.leaf)}\n            elementKey={pseudoElementKey}\n            propPathComponents={leafPathComponents}\n          >\n            {value => renderLeaf(renderFn, value)(props)}\n          </ControlValue>\n        )\n      },\n    initialRenderLeaf,\n  )\n\n  return renderLeaf({ attributes: {} as any, leaf: props.leaf, children: null, text: props.leaf })\n}\n\ntype ElementProps = {\n  pathComponents: string[]\n  parentStylesheetKey: string\n  descendant: Element\n  plugins: RichTextV2Plugin[]\n}\n\nfunction ElementComponent({\n  plugins,\n  pathComponents,\n  parentStylesheetKey,\n  ...props\n}: ElementProps) {\n  function initialRenderElement(props: RenderElementProps): ReactNode {\n    return (\n      <Descendants\n        descendants={props.element.children}\n        plugins={plugins}\n        pathComponents={pathComponents}\n        parentStylesheetKey={parentStylesheetKey}\n      />\n    )\n  }\n\n  const renderElement = plugins.reduce(\n    (renderFn, plugin, index) =>\n      function RenderElementPlugin(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        const pseudoElementKey = parentStylesheetKey\n        const elementPathComponents = [...pathComponents, `plugins`, `${index}`, `element`]\n\n        return (\n          <ControlValue\n            definition={control.definition}\n            data={control.getElementValue(props.element)}\n            elementKey={pseudoElementKey}\n            propPathComponents={elementPathComponents}\n          >\n            {value => renderElement(renderFn, value)(props)}\n          </ControlValue>\n        )\n      },\n    initialRenderElement,\n  )\n\n  return renderElement({ attributes: {} as any, children: null, element: props.descendant })\n}\n\n// reimplemented from slate source for code splitting\nfunction isText(node: Descendant): node is Text {\n  if (typeof node === 'object' && 'text' in node) return true\n\n  return false\n}\n\nfunction Descendants({\n  pathComponents,\n  parentStylesheetKey,\n  descendants,\n  plugins,\n}: {\n  pathComponents: string[]\n  parentStylesheetKey: string\n  plugins: RichTextV2Plugin[]\n  descendants: Descendant[]\n}) {\n  return (\n    <>\n      {descendants.map((descendant, index) => {\n        const descendantPathComponents = [...pathComponents, `descendants`, `${index}`]\n        if (isText(descendant)) {\n          return (\n            <LeafComponent\n              key={index}\n              plugins={plugins}\n              leaf={descendant}\n              parentStylesheetKey={parentStylesheetKey}\n              pathComponents={descendantPathComponents}\n            />\n          )\n        }\n\n        return (\n          <ElementComponent\n            key={index}\n            descendant={descendant}\n            plugins={plugins}\n            pathComponents={descendantPathComponents}\n            parentStylesheetKey={parentStylesheetKey}\n          />\n        )\n      })}\n    </>\n  )\n}\n"],"mappings":"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","names":["props","renderLeaf","renderElement"]}

package/dist/cjs/runtimes/react/controls/rich-text-v2/index.js

@@ -3,6 +3,10 @@ var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __getOwnPropNames = Object.getOwnPropertyNames;
 var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
 var __copyProps = (to, from, except, desc) => {
   if (from && typeof from === "object" || typeof from === "function") {
     for (let key of __getOwnPropNames(from))
@@ -11,13 +15,15 @@ var __copyProps = (to, from, except, desc) => {
   }
   return to;
 };
-var __reExport = (target, mod, secondTarget) => (__copyProps(target, mod, "default"), secondTarget && __copyProps(secondTarget, mod, "default"));
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 var rich_text_v2_exports = {};
+__export(rich_text_v2_exports, {
+  renderRichTextV2: () => import_render_rich_text_v2.renderRichTextV2
+});
 module.exports = __toCommonJS(rich_text_v2_exports);
-__reExport(rich_text_v2_exports, require("./rich-text-v2"), module.exports);
+var import_render_rich_text_v2 = require("./render-rich-text-v2");
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
-  ...require("./rich-text-v2")
+  renderRichTextV2
 });
 //# sourceMappingURL=index.js.map

package/dist/cjs/runtimes/react/controls/rich-text-v2/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../../src/runtimes/react/controls/rich-text-v2/index.ts"],"sourcesContent":["export * from './rich-text-v2'\n"],"mappings":";;;;;;;;;;;;;;;AAAA;AAAA;AAAA,iCAAc,2BAAd;","names":[]}
+{"version":3,"sources":["../../../../../../src/runtimes/react/controls/rich-text-v2/index.ts"],"sourcesContent":["import { type ReactNode } from 'react'\n\nimport { RichTextV2Definition } from '../../../../controls/rich-text-v2'\n\nexport type RichTextV2ControlValue = ReactNode\nexport type Descriptors = { text?: RichTextV2Definition }\n\nexport { renderRichTextV2 } from './render-rich-text-v2'\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAOA,iCAAiC;","names":[]}

package/dist/cjs/runtimes/react/controls/rich-text-v2/render-rich-text-v2.js

@@ -0,0 +1,59 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var render_rich_text_v2_exports = {};
+__export(render_rich_text_v2_exports, {
+  renderRichTextV2: () => renderRichTextV2
+});
+module.exports = __toCommonJS(render_rich_text_v2_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_react = require("react");
+var import_rich_text_v2 = require("../../../../controls/rich-text-v2");
+var import_rich_text_v2_value = require("./rich-text-v2-value");
+const ReadOnlyTextV1 = (0, import_react.lazy)(() => Promise.resolve().then(() => __toESM(require("../rich-text/ReadOnlyText"))));
+function renderRichTextV2({
+  data,
+  config,
+  control,
+  stylesheet
+}) {
+  return import_rich_text_v2.RichTextV2Definition.isV1Data(data) ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ReadOnlyTextV1, { text: data }) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    import_rich_text_v2_value.RichTextV2Value,
+    {
+      data,
+      config,
+      instanceKey: control?.instanceKey,
+      parentStylesheetKey: stylesheet.key()
+    }
+  );
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  renderRichTextV2
+});
+//# sourceMappingURL=render-rich-text-v2.js.map

package/dist/cjs/runtimes/react/controls/rich-text-v2/render-rich-text-v2.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../../src/runtimes/react/controls/rich-text-v2/render-rich-text-v2.tsx"],"sourcesContent":["import { type ReactNode, lazy } from 'react'\n\nimport { type DataType, type ConfigType, Stylesheet } from '@makeswift/controls'\n\nimport { RichTextV2Control, RichTextV2Definition } from '../../../../controls/rich-text-v2'\n\nimport { RichTextV2Value } from './rich-text-v2-value'\n\nconst ReadOnlyTextV1 = lazy(() => import('../rich-text/ReadOnlyText'))\n\nexport function renderRichTextV2({\n  data,\n  config,\n  control,\n  stylesheet,\n}: {\n  data: DataType<RichTextV2Definition> | undefined\n  config: ConfigType<RichTextV2Definition>\n  control: RichTextV2Control | null\n  stylesheet: Stylesheet\n}): ReactNode {\n  // See `renderSlot` comments\n  return RichTextV2Definition.isV1Data(data) ? (\n    <ReadOnlyTextV1 text={data} />\n  ) : (\n    <RichTextV2Value\n      data={data}\n      config={config}\n      instanceKey={control?.instanceKey}\n      parentStylesheetKey={stylesheet.key()}\n    />\n  )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAuBI;AAvBJ,mBAAqC;AAIrC,0BAAwD;AAExD,gCAAgC;AAEhC,MAAM,qBAAiB,mBAAK,MAAM,6CAAO,2BAA2B,GAAC;AAE9D,SAAS,iBAAiB;AAAA,EAC/B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAKc;AAEZ,SAAO,yCAAqB,SAAS,IAAI,IACvC,4CAAC,kBAAe,MAAM,MAAM,IAE5B;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA;AAAA,MACA,aAAa,SAAS;AAAA,MACtB,qBAAqB,WAAW,IAAI;AAAA;AAAA,EACtC;AAEJ;","names":[]}

package/dist/cjs/runtimes/react/controls/rich-text-v2/{rich-text-v2.js → rich-text-v2-value.js}

@@ -1,4 +1,5 @@
 "use strict";
+"use client";
 var __create = Object.create;
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
@@ -26,30 +27,34 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
   mod
 ));
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-var rich_text_v2_exports = {};
-__export(rich_text_v2_exports, {
-  renderRichTextV2: () => renderRichTextV2
+var rich_text_v2_value_exports = {};
+__export(rich_text_v2_value_exports, {
+  RichTextV2Value: () => RichTextV2Value
 });
-module.exports = __toCommonJS(rich_text_v2_exports);
+module.exports = __toCommonJS(rich_text_v2_value_exports);
 var import_jsx_runtime = require("react/jsx-runtime");
 var import_react = require("react");
-var import_rich_text_v2 = require("../../../../controls/rich-text-v2");
 var import_use_is_read_only = require("../../hooks/use-is-read-only");
 const EditableText = (0, import_react.lazy)(() => Promise.resolve().then(() => __toESM(require("./EditableTextV2"))));
 const ReadOnlyText = (0, import_react.lazy)(() => Promise.resolve().then(() => __toESM(require("./ReadOnlyTextV2"))));
-const ReadOnlyTextV1 = (0, import_react.lazy)(() => Promise.resolve().then(() => __toESM(require("../rich-text/ReadOnlyText"))));
-function renderRichTextV2(data, definition, control) {
-  return import_rich_text_v2.RichTextV2Definition.isV1Data(data) ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ReadOnlyTextV1, { text: data }) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(RichTextV2, { data, definition, control });
-}
-function RichTextV2({
+function RichTextV2Value({
   data,
-  definition,
-  control
+  config,
+  instanceKey,
+  parentStylesheetKey
 }) {
-  return (0, import_use_is_read_only.useIsReadOnly)() ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ReadOnlyText, { text: data, definition }) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(EditableText, { text: data, definition, control });
+  return (0, import_use_is_read_only.useIsReadOnly)() ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ReadOnlyText, { text: data, config, parentStylesheetKey }) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    EditableText,
+    {
+      text: data,
+      config,
+      instanceKey,
+      parentStylesheetKey
+    }
+  );
 }
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
-  renderRichTextV2
+  RichTextV2Value
 });
-//# sourceMappingURL=rich-text-v2.js.map
+//# sourceMappingURL=rich-text-v2-value.js.map

package/dist/cjs/runtimes/react/controls/rich-text-v2/rich-text-v2-value.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../../src/runtimes/react/controls/rich-text-v2/rich-text-v2-value.tsx"],"sourcesContent":["'use client'\n\nimport { lazy } from 'react'\n\nimport { type ControlInstanceKey, type ConfigType } from '@makeswift/controls'\n\nimport { type RichTextDataV2, RichTextV2Definition } from '../../../../controls/rich-text-v2'\n\nimport { useIsReadOnly } from '../../hooks/use-is-read-only'\n\nconst EditableText = lazy(() => import('./EditableTextV2'))\nconst ReadOnlyText = lazy(() => import('./ReadOnlyTextV2'))\n\nexport function RichTextV2Value({\n  data,\n  config,\n  instanceKey,\n  parentStylesheetKey,\n}: {\n  data: RichTextDataV2 | undefined\n  config: ConfigType<RichTextV2Definition>\n  instanceKey: ControlInstanceKey | undefined\n  parentStylesheetKey: string\n}) {\n  return useIsReadOnly() ? (\n    <ReadOnlyText text={data} config={config} parentStylesheetKey={parentStylesheetKey} />\n  ) : (\n    <EditableText\n      text={data}\n      config={config}\n      instanceKey={instanceKey}\n      parentStylesheetKey={parentStylesheetKey}\n    />\n  )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAyBI;AAvBJ,mBAAqB;AAMrB,8BAA8B;AAE9B,MAAM,mBAAe,mBAAK,MAAM,6CAAO,kBAAkB,GAAC;AAC1D,MAAM,mBAAe,mBAAK,MAAM,6CAAO,kBAAkB,GAAC;AAEnD,SAAS,gBAAgB;AAAA,EAC9B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAKG;AACD,aAAO,uCAAc,IACnB,4CAAC,gBAAa,MAAM,MAAM,QAAgB,qBAA0C,IAEpF;AAAA,IAAC;AAAA;AAAA,MACC,MAAM;AAAA,MACN;AAAA,MACA;AAAA,MACA;AAAA;AAAA,EACF;AAEJ;","names":[]}