@makeswift/runtime 0.9.0 → 0.9.2

package/dist/react-page.es.js

@@ -22,13 +22,16 @@ var __publicField = (obj, key, value) => {
   return value;
 };
 const import_meta = {};
+var _a;
 import { combineReducers, createStore, applyMiddleware } from "redux";
 import thunk from "redux-thunk";
 import { A as ActionTypes } from "./actions.es.js";
-import { findBreakpointOverride, reducer as reducer$a, getInitialState as getInitialState$9 } from "./state/breakpoints.es.js";
-import { Element, Range, Editor, Text, Path, Transforms, Node, Point } from "slate";
-import isHotkey from "is-hotkey";
-import "slate-react";
+import { reducer as reducer$a, getInitialState as getInitialState$9 } from "./state/breakpoints.es.js";
+import * as React from "react";
+import { cache } from "@emotion/css";
+import { serializeStyles } from "@emotion/serialize";
+import { registerStyles, insertStyles } from "@emotion/utils";
+import { Element, Text } from "slate";
 const ComponentIcon = {
   Billing: "billing",
   Bolt: "bolt",
@@ -96,8 +99,8 @@ function getDocuments(state) {
   return state;
 }
 function getDocument$1(state, documentKey) {
-  var _a;
-  return (_a = getDocuments(state).get(documentKey)) != null ? _a : null;
+  var _a2;
+  return (_a2 = getDocuments(state).get(documentKey)) != null ? _a2 : null;
 }
 function reducer$8(state = getInitialState$7(), action) {
   switch (action.type) {
@@ -121,8 +124,8 @@ function getReactComponents(state) {
   return state;
 }
 function getReactComponent$1(state, type) {
-  var _a;
-  return (_a = getReactComponents(state).get(type)) != null ? _a : null;
+  var _a2;
+  return (_a2 = getReactComponents(state).get(type)) != null ? _a2 : null;
 }
 function reducer$7(state = getInitialState$6(), action) {
   switch (action.type) {
@@ -146,8 +149,8 @@ function getPropControllerDescriptors$1(state) {
   return state;
 }
 function getComponentPropControllerDescriptors$1(state, componentType) {
-  var _a;
-  return (_a = getPropControllerDescriptors$1(state).get(componentType)) != null ? _a : null;
+  var _a2;
+  return (_a2 = getPropControllerDescriptors$1(state).get(componentType)) != null ? _a2 : null;
 }
 function reducer$6(state = getInitialState$5(), action) {
   switch (action.type) {
@@ -172,24 +175,24 @@ function getInitialState$4() {
   return { handles: /* @__PURE__ */ new Map(), instances: /* @__PURE__ */ new Map() };
 }
 function getPropControllersHandle(state, documentKey, elementKey) {
-  var _a, _b;
-  return (_b = (_a = state.handles.get(documentKey)) == null ? void 0 : _a.get(elementKey)) != null ? _b : null;
+  var _a2, _b;
+  return (_b = (_a2 = state.handles.get(documentKey)) == null ? void 0 : _a2.get(elementKey)) != null ? _b : null;
 }
 function getPropControllers$1(state, documentKey, elementKey) {
-  var _a, _b;
-  return (_b = (_a = state.instances.get(documentKey)) == null ? void 0 : _a.get(elementKey)) != null ? _b : null;
+  var _a2, _b;
+  return (_b = (_a2 = state.instances.get(documentKey)) == null ? void 0 : _a2.get(elementKey)) != null ? _b : null;
 }
 function getPropController(state, documentKey, elementKey, propName) {
-  var _a, _b;
-  return (_b = (_a = getPropControllers$1(state, documentKey, elementKey)) == null ? void 0 : _a[propName]) != null ? _b : null;
+  var _a2, _b;
+  return (_b = (_a2 = getPropControllers$1(state, documentKey, elementKey)) == null ? void 0 : _a2[propName]) != null ? _b : null;
 }
 function reducer$5(state = getInitialState$4(), action) {
-  var _a, _b, _c, _d;
+  var _a2, _b, _c, _d;
   switch (action.type) {
     case ActionTypes.REGISTER_PROP_CONTROLLERS_HANDLE: {
       const { documentKey, elementKey, handle } = action.payload;
       return __spreadProps(__spreadValues({}, state), {
-        handles: new Map(state.handles).set(documentKey, new Map((_a = state.handles.get(documentKey)) != null ? _a : []).set(elementKey, handle))
+        handles: new Map(state.handles).set(documentKey, new Map((_a2 = state.handles.get(documentKey)) != null ? _a2 : []).set(elementKey, handle))
       });
     }
     case ActionTypes.UNREGISTER_PROP_CONTROLLERS_HANDLE: {
@@ -254,9 +257,9 @@ function reducer$2(state = getInitialState$1(), action) {
   }
 }
 function getInitialState(initialState) {
-  var _a, _b, _c;
+  var _a2, _b, _c;
   return {
-    locales: (_a = initialState == null ? void 0 : initialState.locales) != null ? _a : [],
+    locales: (_a2 = initialState == null ? void 0 : initialState.locales) != null ? _a2 : [],
     locale: (_b = initialState == null ? void 0 : initialState.locale) != null ? _b : null,
     defaultLocale: (_c = initialState == null ? void 0 : initialState.defaultLocale) != null ? _c : null
   };
@@ -286,27 +289,450 @@ function Color(config = {}) {
   return { type: ColorControlType, config };
 }
 function copyColorData(value, context) {
-  var _a;
+  var _a2;
   if (value == null)
     return value;
   return __spreadProps(__spreadValues({}, value), {
-    swatchId: (_a = context.replacementContext.swatchIds.get(value.swatchId)) != null ? _a : value.swatchId
+    swatchId: (_a2 = context.replacementContext.swatchIds.get(value.swatchId)) != null ? _a2 : value.swatchId
   });
 }
+class PropController {
+  constructor(send) {
+    __publicField(this, "send");
+    this.send = send;
+  }
+}
+const StyleControlType = "makeswift::controls::style";
+const StyleControlProperty = {
+  Width: "makeswift::controls::style::property::width",
+  Margin: "makeswift::controls::style::property::margin",
+  Padding: "makeswift::controls::style::property::padding",
+  Border: "makeswift::controls::style::property::border",
+  BorderRadius: "makeswift::controls::style::property::border-radius",
+  TextStyle: "makeswift::controls::style::property::text-style"
+};
+const StyleControlDefaultProperties = [
+  StyleControlProperty.Width,
+  StyleControlProperty.Margin
+];
+const AllStyleControlProperties = [
+  StyleControlProperty.Width,
+  StyleControlProperty.Margin,
+  StyleControlProperty.Padding,
+  StyleControlProperty.Border,
+  StyleControlProperty.BorderRadius,
+  StyleControlProperty.TextStyle
+];
+function Style(params) {
+  var _a2;
+  return {
+    type: StyleControlType,
+    config: { properties: (_a2 = params == null ? void 0 : params.properties) != null ? _a2 : StyleControlDefaultProperties }
+  };
+}
+Style.Default = StyleControlDefaultProperties;
+Style.All = AllStyleControlProperties;
+Style.Width = StyleControlProperty.Width;
+Style.Margin = StyleControlProperty.Margin;
+Style.Padding = StyleControlProperty.Padding;
+Style.Border = StyleControlProperty.Border;
+Style.BorderRadius = StyleControlProperty.BorderRadius;
+Style.TextStyle = StyleControlProperty.TextStyle;
+const StyleControlMessageType = {
+  CHANGE_BOX_MODEL: "makeswift::controls::style::message::change-box-model"
+};
+class StyleControl extends PropController {
+  constructor(send) {
+    super(send);
+  }
+  changeBoxModel(boxModel) {
+    this.send({ type: StyleControlMessageType.CHANGE_BOX_MODEL, payload: { boxModel } });
+  }
+  recv() {
+  }
+}
+function copyStyleData(value, context) {
+  if (value == null)
+    return value;
+  function copyResponsiveBorder(responsiveBorder) {
+    if (responsiveBorder == null)
+      return void 0;
+    return responsiveBorder.map((deviceBorder) => __spreadProps(__spreadValues({}, deviceBorder), {
+      value: copyBorder(deviceBorder.value)
+    }));
+  }
+  function copyBorder(border) {
+    function copyBorderSide(side) {
+      if (side == null)
+        return null;
+      if (side.color == null)
+        return side;
+      return __spreadProps(__spreadValues({}, side), {
+        color: copyColorData(side.color, context)
+      });
+    }
+    return {
+      borderTop: copyBorderSide(border.borderTop),
+      borderBottom: copyBorderSide(border.borderBottom),
+      borderRight: copyBorderSide(border.borderRight),
+      borderLeft: copyBorderSide(border.borderLeft)
+    };
+  }
+  return __spreadProps(__spreadValues({}, value), { border: copyResponsiveBorder(value.border) });
+}
+if (import_meta.vitest) {
+  const { describe, test, expect } = import_meta.vitest;
+  describe.concurrent("style copy", () => {
+    test("colors are replaced", () => {
+      const value = {
+        width: [
+          {
+            value: {
+              unit: "px",
+              value: 100
+            },
+            deviceId: "desktop"
+          }
+        ],
+        border: [
+          {
+            value: {
+              borderTop: {
+                color: {
+                  alpha: 1,
+                  swatchId: "U3dhdGNoOmJjMDkwZWJjLTZkZDUtNDY1NS1hMDY0LTg3ZDAxM2U4YTFhNA=="
+                },
+                style: "solid",
+                width: 9
+              },
+              borderLeft: {
+                color: {
+                  alpha: 1,
+                  swatchId: "U3dhdGNoOmJjMDkwZWJjLTZkZDUtNDY1NS1hMDY0LTg3ZDAxM2U4YTFhNA=="
+                },
+                style: "solid",
+                width: 9
+              },
+              borderRight: {
+                color: {
+                  alpha: 1,
+                  swatchId: "U3dhdGNoOmJjMDkwZWJjLTZkZDUtNDY1NS1hMDY0LTg3ZDAxM2U4YTFhNA=="
+                },
+                style: "solid",
+                width: 9
+              },
+              borderBottom: {
+                color: {
+                  alpha: 1,
+                  swatchId: "U3dhdGNoOmJjMDkwZWJjLTZkZDUtNDY1NS1hMDY0LTg3ZDAxM2U4YTFhNA=="
+                },
+                style: "solid",
+                width: 9
+              }
+            },
+            deviceId: "desktop"
+          }
+        ],
+        textStyle: [
+          {
+            value: {
+              fontSize: {
+                unit: "px",
+                value: 46
+              },
+              fontStyle: [],
+              fontFamily: "Oswald",
+              fontWeight: 400,
+              letterSpacing: 5.2,
+              textTransform: []
+            },
+            deviceId: "desktop"
+          }
+        ],
+        borderRadius: [
+          {
+            value: {
+              borderTopLeftRadius: {
+                unit: "px",
+                value: 4
+              },
+              borderTopRightRadius: {
+                unit: "px",
+                value: 4
+              },
+              borderBottomLeftRadius: {
+                unit: "px",
+                value: 4
+              },
+              borderBottomRightRadius: {
+                unit: "px",
+                value: 4
+              }
+            },
+            deviceId: "desktop"
+          }
+        ]
+      };
+      const expected = JSON.parse(JSON.stringify(value).replaceAll("U3dhdGNoOmJjMDkwZWJjLTZkZDUtNDY1NS1hMDY0LTg3ZDAxM2U4YTFhNA==", "testing"));
+      const replacementContext = {
+        elementHtmlIds: /* @__PURE__ */ new Set(),
+        elementKeys: /* @__PURE__ */ new Map(),
+        swatchIds: /* @__PURE__ */ new Map([
+          ["U3dhdGNoOmJjMDkwZWJjLTZkZDUtNDY1NS1hMDY0LTg3ZDAxM2U4YTFhNA==", "testing"]
+        ]),
+        fileIds: /* @__PURE__ */ new Map(),
+        typographyIds: /* @__PURE__ */ new Map(),
+        tableIds: /* @__PURE__ */ new Map(),
+        tableColumnIds: /* @__PURE__ */ new Map(),
+        pageIds: /* @__PURE__ */ new Map(),
+        globalElementIds: /* @__PURE__ */ new Map(),
+        globalElementData: /* @__PURE__ */ new Map()
+      };
+      const result = copyStyleData(value, {
+        replacementContext,
+        copyElement: (node) => node
+      });
+      expect(result).toMatchObject(expected);
+    });
+  });
+}
+const Types = {
+  Backgrounds: "Backgrounds",
+  Border: "Border",
+  BorderRadius: "BorderRadius",
+  Checkbox: "Checkbox",
+  Date: "Date",
+  ElementID: "ElementID",
+  Font: "Font",
+  GapX: "GapX",
+  GapY: "GapY",
+  Grid: "Grid",
+  Image: "Image",
+  Images: "Images",
+  Link: "Link",
+  List: "List",
+  Margin: "Margin",
+  NavigationLinks: "NavigationLinks",
+  Number: "Number",
+  Padding: "Padding",
+  ResponsiveColor: "ResponsiveColor",
+  ResponsiveIconRadioGroup: "ResponsiveIconRadioGroup",
+  ResponsiveLength: "ResponsiveLength",
+  ResponsiveNumber: "ResponsiveNumber",
+  ResponsiveOpacity: "ResponsiveOpacity",
+  ResponsiveSelect: "ResponsiveSelect",
+  RichText: "RichText",
+  Shadows: "Shadows",
+  Shape: "Shape",
+  SocialLinks: "SocialLinks",
+  Table: "Table",
+  TableFormFields: "TableFormFields",
+  Typeahead: "Typeahead",
+  TextArea: "TextArea",
+  TextInput: "TextInput",
+  TextStyle: "TextStyle",
+  Video: "Video",
+  Width: "Width",
+  Style: StyleControlType
+};
+function Backgrounds(options = {}) {
+  return { type: Types.Backgrounds, options };
+}
+const BorderPropControllerFormat = {
+  ClassName: "makeswift::prop-controllers::border::format::class-name",
+  ResponsiveValue: "makeswift::prop-controllers:border::format::responsive-value"
+};
+function Border(options = {}) {
+  return { type: Types.Border, options };
+}
+Border.Format = BorderPropControllerFormat;
+const BorderRadiusPropControllerFormat = {
+  ClassName: "makeswift::prop-controllers::border-radius::format::class-name",
+  ResponsiveValue: "makeswift::prop-controllers::border-radius::format::responsive-value"
+};
+function BorderRadius(options = {}) {
+  return { type: Types.BorderRadius, options };
+}
+BorderRadius.Format = BorderRadiusPropControllerFormat;
+function Checkbox(options) {
+  return { type: Types.Checkbox, options };
+}
+function Date(options = {}) {
+  return { type: Types.Date, options };
+}
+function ElementID(options = {}) {
+  return { type: Types.ElementID, options };
+}
+function Font(options = {}) {
+  return { type: Types.Font, options };
+}
+function GapX(options = {}) {
+  return { type: Types.GapX, options };
+}
+function GapY(options = {}) {
+  return { type: Types.GapY, options };
+}
+function Grid(options = {}) {
+  return { type: Types.Grid, options };
+}
+function Image$1(options = {}) {
+  return { type: Types.Image, options };
+}
+function Images(options = {}) {
+  return { type: Types.Images, options };
+}
+function Link$1(options = {}) {
+  return { type: Types.Link, options };
+}
+function List$1(options) {
+  return { type: Types.List, options };
+}
+const MarginPropControllerFormat = {
+  ClassName: "makeswift::prop-controllers::margin::format::class-name",
+  ResponsiveValue: "makeswift::prop-controllers::margin::format::responsive-value"
+};
+function Margin(options = {}) {
+  return { type: Types.Margin, options };
+}
+Margin.Format = MarginPropControllerFormat;
+function NavigationLinks(options = {}) {
+  return { type: Types.NavigationLinks, options };
+}
+function Number(options = {}) {
+  return { type: Types.Number, options };
+}
+const PaddingPropControllerFormat = {
+  ClassName: "makeswift::prop-controllers::padding::format::class-name",
+  ResponsiveValue: "makeswift::prop-controllers::padding::format::responsive-value"
+};
+function Padding(options = {}) {
+  return { type: Types.Padding, options };
+}
+Padding.Format = PaddingPropControllerFormat;
+function ResponsiveColor(options = {}) {
+  return { type: Types.ResponsiveColor, options };
+}
+function ResponsiveIconRadioGroup(options) {
+  return { type: Types.ResponsiveIconRadioGroup, options };
+}
+function ResponsiveLength(options = {}) {
+  return { type: Types.ResponsiveLength, options };
+}
+function ResponsiveNumber(options = {}) {
+  return { type: Types.ResponsiveNumber, options };
+}
+function ResponsiveOpacity(options = {}) {
+  return { type: Types.ResponsiveOpacity, options };
+}
+function ResponsiveSelect(options) {
+  return { type: Types.ResponsiveSelect, options };
+}
+function RichText$1(options = {}) {
+  return { type: Types.RichText, options };
+}
+const ShadowsPropControllerFormat = {
+  ClassName: "makeswift::prop-controllers::shadows::format::class-name",
+  ResponsiveValue: "makeswift::prop-controllers::shadows::format::responsive-value"
+};
+function Shadows(options = {}) {
+  return { type: Types.Shadows, options };
+}
+Shadows.Format = ShadowsPropControllerFormat;
+function Shape$1(options) {
+  return { type: Types.Shape, options };
+}
+function SocialLinks(options = {}) {
+  return { type: Types.SocialLinks, options };
+}
+function Table(options = {}) {
+  return { type: Types.Table, options };
+}
+function TableFormFields(options = {}) {
+  return { type: Types.TableFormFields, options };
+}
+function Typeahead(options) {
+  return { type: Types.Typeahead, options };
+}
+function TextArea(options = {}) {
+  return { type: Types.TextArea, options };
+}
+function TextInput(options = {}) {
+  return { type: Types.TextInput, options };
+}
+function TextStyle(options = {}) {
+  return { type: Types.TextStyle, options };
+}
+function Video(options = {}) {
+  return { type: Types.Video, options };
+}
+const WidthPropControllerFormat = {
+  ClassName: "makeswift::prop-controllers::width::format::class-name",
+  ResponsiveValue: "makeswift::prop-controllers::width::format::responsive-value"
+};
+function Width(options = {}) {
+  return { type: Types.Width, options };
+}
+Width.Format = WidthPropControllerFormat;
+var descriptors = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+  __proto__: null,
+  Types,
+  Backgrounds,
+  BorderPropControllerFormat,
+  Border,
+  BorderRadiusPropControllerFormat,
+  BorderRadius,
+  Checkbox,
+  Date,
+  ElementID,
+  Font,
+  GapX,
+  GapY,
+  Grid,
+  Image: Image$1,
+  Images,
+  Link: Link$1,
+  List: List$1,
+  MarginPropControllerFormat,
+  Margin,
+  NavigationLinks,
+  Number,
+  PaddingPropControllerFormat,
+  Padding,
+  ResponsiveColor,
+  ResponsiveIconRadioGroup,
+  ResponsiveLength,
+  ResponsiveNumber,
+  ResponsiveOpacity,
+  ResponsiveSelect,
+  RichText: RichText$1,
+  ShadowsPropControllerFormat,
+  Shadows,
+  Shape: Shape$1,
+  SocialLinks,
+  Table,
+  TableFormFields,
+  Typeahead,
+  TextArea,
+  TextInput,
+  TextStyle,
+  Video,
+  WidthPropControllerFormat,
+  Width
+}, Symbol.toStringTag, { value: "Module" }));
 const ImageControlType = "makeswift::controls::image";
 const ImageControlValueFormat = {
   URL: "makeswift::controls::image::format::url",
   WithDimensions: "makeswift::controls::image::format::with-dimensions"
 };
-function Image$1(config = {}) {
+function Image(config = {}) {
   return { type: ImageControlType, config };
 }
-Image$1.Format = ImageControlValueFormat;
+Image.Format = ImageControlValueFormat;
 function copyImageData(value, context) {
-  var _a;
+  var _a2;
   if (value == null)
     return value;
-  return (_a = context.replacementContext.fileIds.get(value)) != null ? _a : value;
+  return (_a2 = context.replacementContext.fileIds.get(value)) != null ? _a2 : value;
 }
 if (import_meta.vitest) {
   const { describe, test, expect } = import_meta.vitest;
@@ -335,11 +761,11 @@ if (import_meta.vitest) {
   });
 }
 const LinkControlType = "makeswift::controls::link";
-function Link$1(config = {}) {
+function Link(config = {}) {
   return { type: LinkControlType, config };
 }
 function copyLinkData(value, context) {
-  var _a;
+  var _a2;
   if (value == null)
     return value;
   if (value.type === "OPEN_PAGE") {
@@ -347,7 +773,7 @@ function copyLinkData(value, context) {
     if (pageId != null) {
       return __spreadProps(__spreadValues({}, value), {
         payload: __spreadProps(__spreadValues({}, value.payload), {
-          pageId: (_a = context.replacementContext.pageIds.get(pageId)) != null ? _a : pageId
+          pageId: (_a2 = context.replacementContext.pageIds.get(pageId)) != null ? _a2 : pageId
         })
       });
     }
@@ -386,12 +812,6 @@ if (import_meta.vitest) {
     });
   });
 }
-class PropController {
-  constructor(send) {
-    __publicField(this, "send");
-    this.send = send;
-  }
-}
 const RichTextPropControllerMessageType = {
   CHANGE_BUILDER_EDIT_MODE: "CHANGE_BUILDER_EDIT_MODE",
   INITIALIZE_EDITOR: "INITIALIZE_EDITOR",
@@ -500,12 +920,14 @@ function createPropController(descriptor, send) {
       return new ShapeControl(send, descriptor);
     case StyleControlType:
       return new StyleControl(send);
+    case StyleV2ControlType:
+      return new StyleV2Control(send, descriptor);
     default:
       return new DefaultPropController(send);
   }
 }
 const ListControlType = "makeswift::controls::list";
-function List$1(config) {
+function List(config) {
   return { type: ListControlType, config };
 }
 const ListControlMessageType = {
@@ -556,15 +978,15 @@ class ListControl extends PropController {
     this.controls = /* @__PURE__ */ new Map();
   }
 }
-function copyListData(definition2, value, context) {
+function copyListData(definition, value, context) {
   if (value == null)
     return value;
   return value && value.map((item) => __spreadProps(__spreadValues({}, item), {
-    value: copy(definition2.config.type, item.value, context)
+    value: copy(definition.config.type, item.value, context)
   }));
 }
 const ShapeControlType = "makeswift::controls::shape";
-function Shape$1(config) {
+function Shape(config) {
   return { type: ShapeControlType, config };
 }
 const ShapeControlMessageType = {
@@ -606,210 +1028,16 @@ class ShapeControl extends PropController {
     this.setControls();
   }
 }
-function copyShapeData(definition2, value, context) {
+function copyShapeData(definition, value, context) {
   if (value == null)
     return value;
   const newValue = {};
-  for (const [key, itemDefinition] of Object.entries(definition2.config.type)) {
+  for (const [key, itemDefinition] of Object.entries(definition.config.type)) {
     const prop = value[key];
     newValue[key] = copy(itemDefinition, prop, context);
   }
   return newValue;
 }
-const StyleControlType = "makeswift::controls::style";
-const StyleControlProperty = {
-  Width: "makeswift::controls::style::property::width",
-  Margin: "makeswift::controls::style::property::margin",
-  Padding: "makeswift::controls::style::property::padding",
-  Border: "makeswift::controls::style::property::border",
-  BorderRadius: "makeswift::controls::style::property::border-radius",
-  TextStyle: "makeswift::controls::style::property::text-style"
-};
-const StyleControlDefaultProperties = [
-  StyleControlProperty.Width,
-  StyleControlProperty.Margin
-];
-const AllStyleControlProperties = [
-  StyleControlProperty.Width,
-  StyleControlProperty.Margin,
-  StyleControlProperty.Padding,
-  StyleControlProperty.Border,
-  StyleControlProperty.BorderRadius,
-  StyleControlProperty.TextStyle
-];
-function Style(params) {
-  var _a;
-  return {
-    type: StyleControlType,
-    config: { properties: (_a = params == null ? void 0 : params.properties) != null ? _a : StyleControlDefaultProperties }
-  };
-}
-Style.Default = StyleControlDefaultProperties;
-Style.All = AllStyleControlProperties;
-Style.Width = StyleControlProperty.Width;
-Style.Margin = StyleControlProperty.Margin;
-Style.Padding = StyleControlProperty.Padding;
-Style.Border = StyleControlProperty.Border;
-Style.BorderRadius = StyleControlProperty.BorderRadius;
-Style.TextStyle = StyleControlProperty.TextStyle;
-const StyleControlMessageType = {
-  CHANGE_BOX_MODEL: "makeswift::controls::style::message::change-box-model"
-};
-class StyleControl extends PropController {
-  constructor(send) {
-    super(send);
-  }
-  changeBoxModel(boxModel) {
-    this.send({ type: StyleControlMessageType.CHANGE_BOX_MODEL, payload: { boxModel } });
-  }
-  recv() {
-  }
-}
-function copyStyleData(value, context) {
-  if (value == null)
-    return value;
-  function copyResponsiveBorder(responsiveBorder) {
-    if (responsiveBorder == null)
-      return void 0;
-    return responsiveBorder.map((deviceBorder) => __spreadProps(__spreadValues({}, deviceBorder), {
-      value: copyBorder(deviceBorder.value)
-    }));
-  }
-  function copyBorder(border) {
-    function copyBorderSide(side) {
-      if (side == null)
-        return null;
-      if (side.color == null)
-        return side;
-      return __spreadProps(__spreadValues({}, side), {
-        color: copyColorData(side.color, context)
-      });
-    }
-    return {
-      borderTop: copyBorderSide(border.borderTop),
-      borderBottom: copyBorderSide(border.borderBottom),
-      borderRight: copyBorderSide(border.borderRight),
-      borderLeft: copyBorderSide(border.borderLeft)
-    };
-  }
-  return __spreadProps(__spreadValues({}, value), { border: copyResponsiveBorder(value.border) });
-}
-if (import_meta.vitest) {
-  const { describe, test, expect } = import_meta.vitest;
-  describe.concurrent("style copy", () => {
-    test("colors are replaced", () => {
-      const value = {
-        width: [
-          {
-            value: {
-              unit: "px",
-              value: 100
-            },
-            deviceId: "desktop"
-          }
-        ],
-        border: [
-          {
-            value: {
-              borderTop: {
-                color: {
-                  alpha: 1,
-                  swatchId: "U3dhdGNoOmJjMDkwZWJjLTZkZDUtNDY1NS1hMDY0LTg3ZDAxM2U4YTFhNA=="
-                },
-                style: "solid",
-                width: 9
-              },
-              borderLeft: {
-                color: {
-                  alpha: 1,
-                  swatchId: "U3dhdGNoOmJjMDkwZWJjLTZkZDUtNDY1NS1hMDY0LTg3ZDAxM2U4YTFhNA=="
-                },
-                style: "solid",
-                width: 9
-              },
-              borderRight: {
-                color: {
-                  alpha: 1,
-                  swatchId: "U3dhdGNoOmJjMDkwZWJjLTZkZDUtNDY1NS1hMDY0LTg3ZDAxM2U4YTFhNA=="
-                },
-                style: "solid",
-                width: 9
-              },
-              borderBottom: {
-                color: {
-                  alpha: 1,
-                  swatchId: "U3dhdGNoOmJjMDkwZWJjLTZkZDUtNDY1NS1hMDY0LTg3ZDAxM2U4YTFhNA=="
-                },
-                style: "solid",
-                width: 9
-              }
-            },
-            deviceId: "desktop"
-          }
-        ],
-        textStyle: [
-          {
-            value: {
-              fontSize: {
-                unit: "px",
-                value: 46
-              },
-              fontStyle: [],
-              fontFamily: "Oswald",
-              fontWeight: 400,
-              letterSpacing: 5.2,
-              textTransform: []
-            },
-            deviceId: "desktop"
-          }
-        ],
-        borderRadius: [
-          {
-            value: {
-              borderTopLeftRadius: {
-                unit: "px",
-                value: 4
-              },
-              borderTopRightRadius: {
-                unit: "px",
-                value: 4
-              },
-              borderBottomLeftRadius: {
-                unit: "px",
-                value: 4
-              },
-              borderBottomRightRadius: {
-                unit: "px",
-                value: 4
-              }
-            },
-            deviceId: "desktop"
-          }
-        ]
-      };
-      const expected = JSON.parse(JSON.stringify(value).replaceAll("U3dhdGNoOmJjMDkwZWJjLTZkZDUtNDY1NS1hMDY0LTg3ZDAxM2U4YTFhNA==", "testing"));
-      const replacementContext = {
-        elementHtmlIds: /* @__PURE__ */ new Set(),
-        elementKeys: /* @__PURE__ */ new Map(),
-        swatchIds: /* @__PURE__ */ new Map([
-          ["U3dhdGNoOmJjMDkwZWJjLTZkZDUtNDY1NS1hMDY0LTg3ZDAxM2U4YTFhNA==", "testing"]
-        ]),
-        fileIds: /* @__PURE__ */ new Map(),
-        typographyIds: /* @__PURE__ */ new Map(),
-        tableIds: /* @__PURE__ */ new Map(),
-        tableColumnIds: /* @__PURE__ */ new Map(),
-        pageIds: /* @__PURE__ */ new Map(),
-        globalElementIds: /* @__PURE__ */ new Map(),
-        globalElementData: /* @__PURE__ */ new Map()
-      };
-      const result = copyStyleData(value, {
-        replacementContext,
-        copyElement: (node) => node
-      });
-      expect(result).toMatchObject(expected);
-    });
-  });
-}
 const SlotControlType = "makeswift::controls::slot";
 function Slot() {
   return { type: SlotControlType };
@@ -859,22 +1087,22 @@ function copy$e(value, context) {
     return value;
   return value.map((override) => __spreadProps(__spreadValues({}, override), {
     value: override.value.map((backgroundItem) => {
-      var _a, _b;
+      var _a2, _b;
       switch (backgroundItem.type) {
         case "color":
           return __spreadProps(__spreadValues({}, backgroundItem), {
             payload: backgroundItem.payload === null ? null : __spreadProps(__spreadValues({}, backgroundItem.payload), {
-              swatchId: (_a = context.replacementContext.swatchIds.get(backgroundItem.payload.swatchId)) != null ? _a : backgroundItem.payload.swatchId
+              swatchId: (_a2 = context.replacementContext.swatchIds.get(backgroundItem.payload.swatchId)) != null ? _a2 : backgroundItem.payload.swatchId
             })
           });
         case "gradient":
           return __spreadProps(__spreadValues({}, backgroundItem), {
             payload: __spreadProps(__spreadValues({}, backgroundItem.payload), {
               stops: backgroundItem.payload.stops.map((stop) => {
-                var _a2;
+                var _a3;
                 return __spreadProps(__spreadValues({}, stop), {
                   color: stop.color == null ? null : __spreadProps(__spreadValues({}, stop.color), {
-                    swatchId: (_a2 = context.replacementContext.swatchIds.get(stop.color.swatchId)) != null ? _a2 : stop.color.swatchId
+                    swatchId: (_a3 = context.replacementContext.swatchIds.get(stop.color.swatchId)) != null ? _a3 : stop.color.swatchId
                   })
                 });
               })
@@ -900,7 +1128,7 @@ function copy$d(value, context) {
   });
 }
 function copy$c(value, context) {
-  var _a, _b;
+  var _a2, _b;
   if (value == null)
     return value;
   switch (value.type) {
@@ -910,7 +1138,7 @@ function copy$c(value, context) {
         return value;
       return __spreadProps(__spreadValues({}, value), {
         payload: __spreadProps(__spreadValues({}, value.payload), {
-          pageId: (_a = context.replacementContext.pageIds.get(pageId)) != null ? _a : pageId
+          pageId: (_a2 = context.replacementContext.pageIds.get(pageId)) != null ? _a2 : pageId
         })
       });
     }
@@ -943,10 +1171,10 @@ function copy$b(value, context) {
           payload: __spreadProps(__spreadValues({}, item.payload), {
             link: link != null ? copy$c(link, context) : void 0,
             color: color != null ? color.map((override) => {
-              var _a;
+              var _a2;
               return __spreadProps(__spreadValues({}, override), {
                 value: __spreadProps(__spreadValues({}, override.value), {
-                  swatchId: (_a = context.replacementContext.swatchIds.get(override.value.swatchId)) != null ? _a : override.value.swatchId
+                  swatchId: (_a2 = context.replacementContext.swatchIds.get(override.value.swatchId)) != null ? _a2 : override.value.swatchId
                 })
               });
             }) : void 0
@@ -1004,14 +1232,14 @@ function copy$a(value, context) {
     return value;
   return value.map((override) => __spreadProps(__spreadValues({}, override), { value: override.value.map(copyShadowItem) }));
   function copyShadowItem(item) {
-    var _a;
+    var _a2;
     const { color } = item.payload;
     if (color == null)
       return item;
     return __spreadProps(__spreadValues({}, item), {
       payload: __spreadProps(__spreadValues({}, item.payload), {
         color: __spreadProps(__spreadValues({}, color), {
-          swatchId: (_a = context.replacementContext.swatchIds.get(color.swatchId)) != null ? _a : color.swatchId
+          swatchId: (_a2 = context.replacementContext.swatchIds.get(color.swatchId)) != null ? _a2 : color.swatchId
         })
       })
     });
@@ -1065,10 +1293,10 @@ if (import_meta.vitest) {
   });
 }
 function copy$9(value, context) {
-  var _a;
+  var _a2;
   if (value == null)
     return value;
-  return (_a = context.replacementContext.fileIds.get(value)) != null ? _a : value;
+  return (_a2 = context.replacementContext.fileIds.get(value)) != null ? _a2 : value;
 }
 if (import_meta.vitest) {
   const { describe, test, expect } = import_meta.vitest;
@@ -1101,13 +1329,13 @@ function copy$8(value, context) {
     return value;
   return value.map(copyImagesPanelItem);
   function copyImagesPanelItem(imagesPanelItem) {
-    var _a;
+    var _a2;
     const { file } = imagesPanelItem.props;
     if (file == null)
       return imagesPanelItem;
     return __spreadProps(__spreadValues({}, imagesPanelItem), {
       props: __spreadProps(__spreadValues({}, imagesPanelItem.props), {
-        file: (_a = context.replacementContext.fileIds.get(file)) != null ? _a : file
+        file: (_a2 = context.replacementContext.fileIds.get(file)) != null ? _a2 : file
       })
     });
   }
@@ -1156,9 +1384,9 @@ function copy$7(value, context) {
     return value;
   return value.map((override) => __spreadProps(__spreadValues({}, override), { value: copyColorValue(override.value) }));
   function copyColorValue(colorValue) {
-    var _a;
+    var _a2;
     return __spreadProps(__spreadValues({}, colorValue), {
-      swatchId: (_a = context.replacementContext.swatchIds.get(colorValue.swatchId)) != null ? _a : colorValue.swatchId
+      swatchId: (_a2 = context.replacementContext.swatchIds.get(colorValue.swatchId)) != null ? _a2 : colorValue.swatchId
     });
   }
 }
@@ -1167,9 +1395,9 @@ function copy$6(value, context) {
     return value;
   return __spreadProps(__spreadValues({}, value), { fields: value.fields.map(copyFormFieldsPanelItem) });
   function copyFormFieldsPanelItem(item) {
-    var _a;
+    var _a2;
     return __spreadProps(__spreadValues({}, item), {
-      tableColumnId: (_a = context.replacementContext.tableColumnIds.get(item.tableColumnId)) != null ? _a : item.tableColumnId
+      tableColumnId: (_a2 = context.replacementContext.tableColumnIds.get(item.tableColumnId)) != null ? _a2 : item.tableColumnId
     });
   }
 }
@@ -1223,10 +1451,10 @@ if (import_meta.vitest) {
   });
 }
 function copy$5(value, context) {
-  var _a;
+  var _a2;
   if (value == null)
     return value;
-  return (_a = context.replacementContext.tableIds.get(value)) != null ? _a : value;
+  return (_a2 = context.replacementContext.tableIds.get(value)) != null ? _a2 : value;
 }
 if (import_meta.vitest) {
   const { describe, test, expect } = import_meta.vitest;
@@ -1268,13 +1496,13 @@ function copy$4(value, context) {
     };
   }
   function copyBorderSide(borderSide) {
-    var _a;
+    var _a2;
     const { color } = borderSide;
     if (color == null)
       return borderSide;
     return __spreadProps(__spreadValues({}, borderSide), {
       color: __spreadProps(__spreadValues({}, color), {
-        swatchId: (_a = context.replacementContext.swatchIds.get(color.swatchId)) != null ? _a : color.swatchId
+        swatchId: (_a2 = context.replacementContext.swatchIds.get(color.swatchId)) != null ? _a2 : color.swatchId
       })
     });
   }
@@ -1388,24 +1616,24 @@ function copy$3(value, context) {
     return value;
   return __spreadProps(__spreadValues({}, value), { document: value.document ? copyNode(value.document) : value.document });
   function copyNode(node) {
-    var _a;
+    var _a2;
     switch (node.object) {
       case "document":
       case "block":
       case "inline":
         return copyInline(node);
       case "text":
-        return __spreadProps(__spreadValues({}, node), { marks: (_a = node.marks) == null ? void 0 : _a.map(copyMark) });
+        return __spreadProps(__spreadValues({}, node), { marks: (_a2 = node.marks) == null ? void 0 : _a2.map(copyMark) });
       default:
         return node;
     }
   }
   function copyInline(inline) {
-    var _a, _b;
+    var _a2, _b;
     switch (inline.type) {
       case "link":
         return __spreadProps(__spreadValues({}, inline), {
-          nodes: (_a = inline.nodes) == null ? void 0 : _a.map(copyNode),
+          nodes: (_a2 = inline.nodes) == null ? void 0 : _a2.map(copyNode),
           data: inline.data ? copyLinkData2(inline.data) : inline.data
         });
       default:
@@ -1413,7 +1641,7 @@ function copy$3(value, context) {
     }
   }
   function copyLinkData2(data) {
-    var _a, _b;
+    var _a2, _b;
     switch (data.type) {
       case "OPEN_PAGE": {
         const pageId = data.payload.pageId;
@@ -1421,7 +1649,7 @@ function copy$3(value, context) {
           return data;
         return __spreadProps(__spreadValues({}, data), {
           payload: __spreadProps(__spreadValues({}, data.payload), {
-            pageId: (_a = context.replacementContext.pageIds.get(pageId)) != null ? _a : data.payload.pageId
+            pageId: (_a2 = context.replacementContext.pageIds.get(pageId)) != null ? _a2 : data.payload.pageId
           })
         });
       }
@@ -1442,20 +1670,20 @@ function copy$3(value, context) {
     }
   }
   function copyMark(mark) {
-    var _a, _b, _c, _d;
+    var _a2, _b, _c, _d;
     switch (mark.type) {
       case "typography": {
-        const typographyId = (_a = mark.data) == null ? void 0 : _a.value.id;
+        const typographyId = (_a2 = mark.data) == null ? void 0 : _a2.value.id;
         return __spreadProps(__spreadValues({}, mark), {
           data: __spreadProps(__spreadValues({}, mark.data), {
             value: __spreadProps(__spreadValues({}, (_b = mark.data) == null ? void 0 : _b.value), {
               id: (_c = context.replacementContext.typographyIds.get(typographyId)) != null ? _c : typographyId,
               style: (_d = mark.data) == null ? void 0 : _d.value.style.map((override) => {
-                var _a2, _b2, _c2;
+                var _a3, _b2, _c2;
                 return __spreadProps(__spreadValues({}, override), {
                   value: __spreadProps(__spreadValues({}, override.value), {
                     color: override.value.color == null ? override.value.color : __spreadProps(__spreadValues({}, override.value.color), {
-                      swatchId: (_c2 = context.replacementContext.swatchIds.get((_a2 = override.value.color) == null ? void 0 : _a2.swatchId)) != null ? _c2 : (_b2 = override.value.color) == null ? void 0 : _b2.swatchId
+                      swatchId: (_c2 = context.replacementContext.swatchIds.get((_a3 = override.value.color) == null ? void 0 : _a3.swatchId)) != null ? _c2 : (_b2 = override.value.color) == null ? void 0 : _b2.swatchId
                     })
                   })
                 });
@@ -1606,8 +1834,8 @@ function copy$1(descriptor, value, context) {
 function copyElementReference(value, context) {
   return context.replacementContext.globalElementIds.get(value) || value;
 }
-function copy(definition2, value, context) {
-  switch (definition2.type) {
+function copy(definition, value, context) {
+  switch (definition.type) {
     case Types.Backgrounds:
     case Types.Grid:
     case Types.NavigationLinks:
@@ -1621,7 +1849,7 @@ function copy(definition2, value, context) {
     case Types.Border:
     case Types.RichText:
     case Types.ElementID:
-      return copy$1(definition2, value, context);
+      return copy$1(definition, value, context);
     case ColorControlType:
       return copyColorData(value, context);
     case ImageControlType:
@@ -1629,9 +1857,9 @@ function copy(definition2, value, context) {
     case LinkControlType:
       return copyLinkData(value, context);
     case ShapeControlType:
-      return copyShapeData(definition2, value, context);
+      return copyShapeData(definition, value, context);
     case ListControlType:
-      return copyListData(definition2, value, context);
+      return copyListData(definition, value, context);
     case StyleControlType:
       return copyStyleData(value, context);
     case SlotControlType:
@@ -1640,17 +1868,62 @@ function copy(definition2, value, context) {
       return value;
   }
 }
-function merge(definition2, a, b = a, context) {
-  switch (definition2.type) {
+function merge(definition, a, b = a, context) {
+  switch (definition.type) {
     case SlotControlType:
       return mergeSlotData(a, b, context);
     default:
       return b;
   }
 }
-const SelectControlType = "makeswift::controls::select";
-function Select(config) {
-  return { type: SelectControlType, config };
+const isServer = typeof window === "undefined";
+const useInsertionEffectSpecifier = "useInsertionEffect";
+const useInsertionEffect = (_a = React[useInsertionEffectSpecifier]) != null ? _a : React.useLayoutEffect;
+function useStyle(style) {
+  const serialized = serializeStyles([style], cache.registered);
+  registerStyles(cache, serialized, false);
+  useInsertionEffect(() => {
+    insertStyles(cache, serialized, false);
+  });
+  if (isServer)
+    insertStyles(cache, serialized, false);
+  return `${cache.key}-${serialized.name}`;
+}
+const StyleV2ControlType = "makeswift::controls::style-v2";
+const unstable_useStyleV2ClassName = useStyle;
+function unstable_StyleV2(config) {
+  return { type: StyleV2ControlType, config };
+}
+const StyleV2ControlMessageType = {
+  CHANGE_BOX_MODEL: "makeswift::controls::style::message::change-box-model",
+  STYLE_V2_CONTROL_CHILD_CONTROL_MESSAGE: "makeswift::controls::style-v2::message::child-control-message"
+};
+class StyleV2Control extends PropController {
+  constructor(send, descriptor) {
+    super(send);
+    __publicField(this, "control");
+    this.control = createPropController(descriptor.config.type, (message) => {
+      console.log("message you are supposed to be sending in styleV2 control", { message });
+      this.send({
+        type: StyleV2ControlMessageType.STYLE_V2_CONTROL_CHILD_CONTROL_MESSAGE,
+        payload: { message }
+      });
+    });
+  }
+  changeBoxModel(boxModel) {
+    this.send({ type: StyleV2ControlMessageType.CHANGE_BOX_MODEL, payload: { boxModel } });
+  }
+  recv(message) {
+    switch (message.type) {
+      case StyleV2ControlMessageType.STYLE_V2_CONTROL_CHILD_CONTROL_MESSAGE: {
+        const control = this.control;
+        if (control == null)
+          return;
+        const recv = control.recv;
+        recv(message.payload.message);
+      }
+    }
+  }
 }
 const ObjectType = {
   Value: "value",
@@ -1689,698 +1962,22 @@ const InlineType = {
   Code: "code",
   SuperScript: "superscript",
   SubScript: "subscript",
-  Link: "link"
-};
-const BlockTextAlignment = {
-  Left: "left",
-  Center: "center",
-  Right: "right",
-  Justify: "justify"
-};
-const ElementUtils = {
-  isRootBlock(node) {
-    return Element.isElement(node) && (Element.isElementType(node, BlockType.Paragraph) || Element.isElementType(node, BlockType.Heading1) || Element.isElementType(node, BlockType.Heading2) || Element.isElementType(node, BlockType.Heading3) || Element.isElementType(node, BlockType.Heading3) || Element.isElementType(node, BlockType.Heading4) || Element.isElementType(node, BlockType.Heading5) || Element.isElementType(node, BlockType.Heading6) || Element.isElementType(node, BlockType.BlockQuote) || Element.isElementType(node, BlockType.UnorderedList) || Element.isElementType(node, BlockType.OrderedList) || Element.isElementType(node, BlockType.Text) || Element.isElementType(node, BlockType.Default));
-  },
-  isBlock(node) {
-    return Element.isElement(node) && (this.isRootBlock(node) || Element.isElementType(node, BlockType.ListItem) || Element.isElementType(node, BlockType.ListItemChild));
-  },
-  isInline(node) {
-    return Element.isElementType(node, InlineType.Code) || Element.isElementType(node, InlineType.Link) || Element.isElementType(node, InlineType.SubScript) || Element.isElementType(node, InlineType.SuperScript);
-  },
-  isConvertibleToListTextNode(node) {
-    return !this.isList(node) && !this.isListItem(node) && !this.isListItemChild(node);
-  },
-  isList(node) {
-    return Element.isElementType(node, BlockType.OrderedList) || Element.isElementType(node, BlockType.UnorderedList);
-  },
-  isListItem(node) {
-    return Element.isElementType(node, BlockType.ListItem);
-  },
-  isListItemChild(node) {
-    return Element.isElementType(node, BlockType.ListItemChild);
-  },
-  createText() {
-    return { text: "" };
-  },
-  createParagraph() {
-    return {
-      children: [this.createText()],
-      type: BlockType.Paragraph
-    };
-  },
-  createList(type = BlockType.UnorderedList) {
-    return { children: [this.createText()], type };
-  },
-  createListItem() {
-    return {
-      children: [this.createListItemChild()],
-      type: BlockType.ListItem
-    };
-  },
-  createListItemChild() {
-    return {
-      children: [this.createText()],
-      type: BlockType.ListItemChild
-    };
-  }
-};
-function unhangRange(editor, range) {
-  let [start, end] = Range.edges(range);
-  if (start.offset !== 0 || end.offset !== 0 || Range.isCollapsed(range)) {
-    return range;
-  }
-  const endBlock = Editor.above(editor, {
-    at: end,
-    match: (n) => Element.isElement(n) && Editor.isBlock(editor, n)
-  });
-  const blockPath = endBlock ? endBlock[1] : [];
-  const first = Editor.start(editor, start);
-  const before = { anchor: first, focus: end };
-  let skip = true;
-  for (const [node, path] of Editor.nodes(editor, {
-    at: before,
-    match: Text.isText,
-    reverse: true
-  })) {
-    if (skip) {
-      skip = false;
-      continue;
-    }
-    if (node.text !== "" || Path.isBefore(path, blockPath)) {
-      end = { path, offset: node.text.length };
-      break;
-    }
-  }
-  return { anchor: start, focus: end };
-}
-function getSelection(editor) {
-  if (editor.selection)
-    return unhangRange(editor, editor.selection);
-  return {
-    anchor: Editor.start(editor, []),
-    focus: Editor.end(editor, [])
-  };
-}
-function getBlocksInSelection(editor) {
-  return Array.from(Editor.nodes(editor, {
-    at: getSelection(editor),
-    match: (node) => ElementUtils.isRootBlock(node)
-  })).filter((entry) => ElementUtils.isRootBlock(entry[0]));
-}
-function getActiveBlockType(editor) {
-  var _a;
-  const rootBlocks = getBlocksInSelection(editor).map(([node]) => node.type);
-  return rootBlocks.reduce((a, b) => a === b ? b : null, (_a = rootBlocks.at(0)) != null ? _a : null);
-}
-function setBlockKeyForDevice(editor, breakpoints, deviceId, key, value, options) {
-  var _a, _b;
-  const at = (_a = options == null ? void 0 : options.at) != null ? _a : editor.selection;
-  if (!at)
-    return;
-  const rootElements = getBlocksInSelection(editor);
-  for (const [node, path] of rootElements) {
-    if (ElementUtils.isBlock(node)) {
-      const deviceValues = (_b = node[key]) != null ? _b : [];
-      const currentDeviceValue = findBreakpointOverride(breakpoints, deviceValues, deviceId, (v) => v);
-      const nextDeviceValue = __spreadProps(__spreadValues({}, currentDeviceValue), {
-        deviceId,
-        value
-      });
-      Transforms.setNodes(editor, {
-        [key]: [...deviceValues.filter((v) => v.deviceId !== deviceId), nextDeviceValue]
-      }, { at: path });
-    }
-  }
-}
-function clearBlockKeyForDevice(editor, deviceId, key) {
-  var _a;
-  const rootElements = getBlocksInSelection(editor);
-  for (const [node, path] of rootElements) {
-    if (ElementUtils.isBlock(node)) {
-      const deviceOverrides = (_a = node[key]) != null ? _a : [];
-      Transforms.setNodes(editor, {
-        [key]: deviceOverrides.filter((v) => v.deviceId !== deviceId)
-      }, { at: path });
-    }
-  }
-}
-function wrapInline(editor, inline) {
-  Transforms.wrapNodes(editor, inline, {
-    at: getSelection(editor),
-    split: true
-  });
-}
-function unwrapInline(editor, type) {
-  Transforms.unwrapNodes(editor, {
-    match: (node) => ElementUtils.isInline(node) && node.type === type,
-    at: getSelection(editor)
-  });
-}
-const EditorUtils = {
-  getFirstAncestorList(editor, path) {
-    try {
-      const parentList = Editor.above(editor, {
-        at: path,
-        match: (node) => ElementUtils.isList(node)
-      });
-      return parentList != null ? parentList : null;
-    } catch (e) {
-      return null;
-    }
-  },
-  getFirstAncestorListItem(editor, path) {
-    try {
-      const parentListItem = Editor.above(editor, {
-        at: path,
-        match: (node) => ElementUtils.isListItem(node)
-      });
-      return parentListItem != null ? parentListItem : null;
-    } catch (e) {
-      return null;
-    }
-  }
-};
-const LIST_ITEM_CHILD_POSITION = 0;
-const LIST_ITEM_LIST_POSITION = 1;
-function filterForSubtreeRoots(entries) {
-  return entries.filter(([, nodePath]) => !Path.ancestors(nodePath).some((ancestor) => {
-    return entries.some(([, path]) => Path.equals(path, ancestor));
-  }));
-}
-function unwrapPath(editor, listItemPath) {
-  const parentList = EditorUtils.getFirstAncestorList(editor, listItemPath);
-  const listItemContainingParentList = EditorUtils.getFirstAncestorListItem(editor, listItemPath);
-  if (!parentList || listItemContainingParentList)
-    return;
-  Editor.withoutNormalizing(editor, () => {
-    const listItemTextPath = [...listItemPath, LIST_ITEM_CHILD_POSITION];
-    const listItemNestedListPath = [...listItemPath, LIST_ITEM_LIST_POSITION];
-    if (Node.has(editor, listItemNestedListPath)) {
-      Transforms.setNodes(editor, { type: parentList[0].type }, { at: listItemNestedListPath });
-      Transforms.liftNodes(editor, { at: listItemNestedListPath });
-      Transforms.liftNodes(editor, { at: Path.next(listItemPath) });
-    }
-    if (Node.has(editor, listItemTextPath)) {
-      Transforms.setNodes(editor, { type: BlockType.Paragraph }, {
-        at: listItemTextPath
-      });
-      Transforms.liftNodes(editor, { at: listItemTextPath });
-      Transforms.liftNodes(editor, { at: listItemPath });
-    }
-  });
-}
-function unwrapList(editor, options) {
-  var _a;
-  const at = (_a = options == null ? void 0 : options.at) != null ? _a : editor.selection;
-  if (!at)
-    return;
-  const listItems = Array.from(Editor.nodes(editor, {
-    at,
-    match: (node) => {
-      return Element.isElement(node) && ElementUtils.isListItem(node);
-    }
-  }));
-  const subRoots = filterForSubtreeRoots(listItems);
-  const refs = subRoots.map(([_, path]) => Editor.pathRef(editor, path));
-  refs.forEach((ref) => {
-    if (ref.current) {
-      unwrapPath(editor, ref.current);
-    }
-    ref.unref();
-  });
-}
-function wrapList(editor, options = { type: BlockType.UnorderedList }) {
-  var _a;
-  const at = (_a = options.at) != null ? _a : editor.selection;
-  if (!at)
-    return;
-  const nonListEntries = Array.from(Editor.nodes(editor, {
-    at,
-    match: (node) => {
-      return Element.isElement(node) && ElementUtils.isConvertibleToListTextNode(node);
-    }
-  }));
-  const refs = nonListEntries.map(([_, path]) => Editor.pathRef(editor, path));
-  refs.forEach((ref) => {
-    const path = ref.current;
-    if (path) {
-      Editor.withoutNormalizing(editor, () => {
-        Transforms.setNodes(editor, { type: BlockType.ListItemChild }, {
-          at: path
-        });
-        Transforms.wrapNodes(editor, ElementUtils.createListItem(), {
-          match: (node) => ElementUtils.isListItemChild(node),
-          at: path
-        });
-        Transforms.wrapNodes(editor, ElementUtils.createList(options.type), {
-          at: path
-        });
-      });
-    }
-    ref.unref();
-  });
-}
-const LocationUtils = {
-  getStartPath(location) {
-    if (Range.isRange(location))
-      return Range.start(location).path;
-    if (Point.isPoint(location))
-      return location.path;
-    return location;
-  }
-};
-function getSelectedListItems(editor) {
-  var _a, _b;
-  if (!editor.selection)
-    return [];
-  const start = LocationUtils.getStartPath(editor.selection);
-  const listItems = Editor.nodes(editor, {
-    at: editor.selection,
-    match: (node) => ElementUtils.isListItem(node)
-  });
-  const firstAncestorPath = (_b = (_a = EditorUtils.getFirstAncestorListItem(editor, start)) == null ? void 0 : _a[1]) != null ? _b : [];
-  return Array.from(listItems).filter((node) => Path.isDescendant(start, node[1]) ? Path.equals(node[1], firstAncestorPath) : !Path.isAfter(start, node[1]));
-}
-function indentPath(editor, path) {
-  const parent = Node.parent(editor, path);
-  if (!path || !Path.hasPrevious(path) || !ElementUtils.isList(parent))
-    return;
-  const previosPath = Path.previous(path);
-  const previousChildListPath = [...previosPath, LIST_ITEM_LIST_POSITION];
-  const previousHasChildList = Node.has(editor, previousChildListPath);
-  Editor.withoutNormalizing(editor, () => {
-    if (!previousHasChildList) {
-      Transforms.insertNodes(editor, ElementUtils.createList(parent.type), {
-        at: previousChildListPath
-      });
-    }
-    const previousChildList = Node.get(editor, previousChildListPath);
-    if (ElementUtils.isList(previousChildList)) {
-      const index = previousHasChildList ? previousChildList.children.length : 0;
-      Transforms.moveNodes(editor, {
-        at: path,
-        to: [...previousChildListPath, index]
-      });
-    }
-  });
-}
-function indent(editor) {
-  if (!editor.selection)
-    return;
-  const listItems = getSelectedListItems(editor);
-  const subRoots = filterForSubtreeRoots(listItems);
-  const refs = subRoots.map(([_, path]) => Editor.pathRef(editor, path));
-  refs.forEach((ref) => {
-    if (ref.current) {
-      indentPath(editor, ref.current);
-    }
-    ref.unref();
-  });
-}
-function dedentPath(editor, listItemPath) {
-  const parentList = EditorUtils.getFirstAncestorList(editor, listItemPath);
-  const listItemContainingParentList = EditorUtils.getFirstAncestorListItem(editor, listItemPath);
-  if (!parentList || !listItemContainingParentList)
-    return;
-  const [parentListNode, parentListPath] = parentList;
-  const [_, listItemContainingParentListPath] = listItemContainingParentList;
-  const listItemPosition = listItemPath[listItemPath.length - 1];
-  const previousSiblings = parentListNode.children.slice(0, listItemPosition);
-  const nextSiblings = parentListNode.children.slice(listItemPosition + 1);
-  Editor.withoutNormalizing(editor, () => {
-    nextSiblings.forEach(() => {
-      const nextSiblingPath = [...parentListPath, listItemPosition + 1];
-      indentPath(editor, nextSiblingPath);
-    });
-    Transforms.moveNodes(editor, {
-      at: listItemPath,
-      to: Path.next(listItemContainingParentListPath)
-    });
-    if (previousSiblings.length === 0) {
-      Transforms.removeNodes(editor, { at: parentListPath });
-    }
-  });
-}
-function dedent(editor) {
-  if (!editor.selection)
-    return;
-  const listItems = getSelectedListItems(editor);
-  const subRoots = filterForSubtreeRoots(listItems);
-  const refs = subRoots.map(([_, path]) => Editor.pathRef(editor, path));
-  refs.forEach((ref) => {
-    if (ref.current) {
-      dedentPath(editor, ref.current);
-    }
-    ref.unref();
-  });
-}
-function toggleList(editor, options = { type: BlockType.UnorderedList }) {
-  var _a;
-  const at = (_a = options.at) != null ? _a : editor.selection;
-  if (at == null)
-    return;
-  const start = LocationUtils.getStartPath(at);
-  const ancestorPath = Path.ancestors(start).at(1);
-  if (!ancestorPath || !Node.has(editor, ancestorPath))
-    return;
-  const ancestor = Node.get(editor, ancestorPath);
-  if (!ElementUtils.isList(ancestor)) {
-    return wrapList(editor, { type: options.type, at });
-  }
-  if (ancestor.type === options.type) {
-    unwrapList(editor, { at });
-  } else {
-    Transforms.setNodes(editor, { type: options.type }, { at: ancestorPath });
-  }
-}
-const BlockActions = {
-  setBlockKeyForDevice,
-  clearBlockKeyForDevice,
-  wrapInline,
-  unwrapInline
-};
-const ListActions = {
-  unwrapList,
-  wrapList,
-  indent,
-  dedent,
-  toggleList
-};
-function onKeyDown(e, editor) {
-  if (!editor.selection || Array.from(Editor.nodes(editor, { match: (node) => ElementUtils.isListItem(node) })).length === 0)
-    return;
-  if (isHotkey("shift+tab", e)) {
-    e.preventDefault();
-    ListActions.dedent(editor);
-  }
-  if (isHotkey("tab", e)) {
-    e.preventDefault();
-    ListActions.indent(editor);
-  }
-  if (isHotkey("backspace", e)) {
-    if (!editor.selection)
-      return;
-    if (Range.isExpanded(editor.selection))
-      return;
-    const listItem = EditorUtils.getFirstAncestorListItem(editor, editor.selection.anchor.path);
-    if (editor.selection.anchor.offset === 0 && listItem) {
-      e.preventDefault();
-      const parentListItem = EditorUtils.getFirstAncestorListItem(editor, listItem[1]);
-      const list = EditorUtils.getFirstAncestorList(editor, listItem[1]);
-      if (parentListItem) {
-        ListActions.dedent(editor);
-      } else if (list) {
-        ListActions.unwrapList(editor);
-      }
-      return;
-    }
-  }
-  if (isHotkey("enter", e)) {
-    e.preventDefault();
-    if (!editor.selection)
-      return;
-    if (Range.isExpanded(editor.selection)) {
-      Transforms.delete(editor);
-      return;
-    }
-    const listItem = EditorUtils.getFirstAncestorListItem(editor, editor.selection.anchor.path);
-    if (editor.selection.anchor.offset === 0 && listItem && Editor.string(editor, listItem[1]) === "") {
-      const parentListItem = EditorUtils.getFirstAncestorListItem(editor, listItem[1]);
-      if (parentListItem) {
-        ListActions.dedent(editor);
-      } else {
-        ListActions.unwrapList(editor);
-      }
-      return;
-    }
-    Transforms.splitNodes(editor, {
-      at: editor.selection,
-      always: true,
-      match: (node) => ElementUtils.isListItem(node)
-    });
-  }
-  if (isHotkey("shift+enter", e)) {
-    e.preventDefault();
-    editor.insertText("\n");
-  }
-}
-function withBlock(editor) {
-  const { normalizeNode } = editor;
-  editor.isInline = (entry) => {
-    return ElementUtils.isInline(entry);
-  };
-  editor.normalizeNode = (entry) => {
-    var _a;
-    const [normalizationNode, normalizationPath] = entry;
-    if (ElementUtils.isBlock(normalizationNode) && ((_a = normalizationNode == null ? void 0 : normalizationNode.textAlign) == null ? void 0 : _a.length) == 0) {
-      Transforms.unsetNodes(editor, "textAlign", { at: normalizationPath });
-      return;
-    }
-    if (ElementUtils.isListItem(normalizationNode)) {
-      const pathToListItemText = [...normalizationPath, LIST_ITEM_CHILD_POSITION];
-      if (Node.has(editor, pathToListItemText)) {
-        const nodeInListItemTextPosition = Node.get(editor, pathToListItemText);
-        if (ElementUtils.isRootBlock(nodeInListItemTextPosition)) {
-          Transforms.setNodes(editor, { type: BlockType.ListItemChild }, {
-            at: pathToListItemText
-          });
-          return;
-        }
-      } else {
-        Transforms.insertNodes(editor, ElementUtils.createListItem(), {
-          at: pathToListItemText
-        });
-        return;
-      }
-    }
-    if (!Text.isText(normalizationNode)) {
-      const mergeableChildren = Array.from(Node.children(editor, normalizationPath)).map((child, index, children) => {
-        const potentialNodeToBeMerged = children.at(index + 1);
-        if (!potentialNodeToBeMerged || !ElementUtils.isList(potentialNodeToBeMerged[0]) || !ElementUtils.isList(child[0]) || potentialNodeToBeMerged[0].type !== child[0].type) {
-          return null;
-        }
-        return [
-          Editor.pathRef(editor, child[1]),
-          Editor.pathRef(editor, potentialNodeToBeMerged[1])
-        ];
-      }).filter((mergeableNodes) => Boolean(mergeableNodes));
-      if (mergeableChildren.length !== 0) {
-        mergeableChildren.reverse().forEach(([nodePathRef, nodeToBeMergedPathRef]) => {
-          const nodePath = nodePathRef.current;
-          const nodeToBeMergedPath = nodeToBeMergedPathRef.current;
-          if (nodePath == null || nodeToBeMergedPath == null)
-            return;
-          const nodeChildren = Array.from(Node.children(editor, nodePath));
-          const childrenToBeMerged = Array.from(Node.children(editor, nodeToBeMergedPath));
-          Editor.withoutNormalizing(editor, () => {
-            childrenToBeMerged.reverse().forEach(([_, childPath]) => {
-              Transforms.moveNodes(editor, {
-                at: childPath,
-                to: [...nodePath, nodeChildren.length]
-              });
-            });
-            Transforms.removeNodes(editor, { at: nodeToBeMergedPath });
-          });
-          nodePathRef.unref();
-          nodeToBeMergedPathRef.unref();
-        });
-        return;
-      }
-    }
-    normalizeNode(entry);
-  };
-  return editor;
-}
-const definition = Select({
-  label: "Block",
-  labelOrientation: "horizontal",
-  options: [
-    {
-      value: BlockType.Paragraph,
-      label: "Paragraph"
-    },
-    {
-      value: BlockType.Heading1,
-      label: "Heading 1"
-    },
-    {
-      value: BlockType.Heading2,
-      label: "Heading 2"
-    },
-    {
-      value: BlockType.Heading3,
-      label: "Heading 3"
-    },
-    {
-      value: BlockType.Heading4,
-      label: "Heading 4"
-    },
-    {
-      value: BlockType.Heading5,
-      label: "Heading 5"
-    },
-    {
-      value: BlockType.Heading6,
-      label: "Heading 6"
-    },
-    {
-      value: BlockType.UnorderedList,
-      label: "Bulleted list"
-    },
-    {
-      value: BlockType.OrderedList,
-      label: "Numbered list"
-    },
-    {
-      value: BlockType.BlockQuote,
-      label: "Quote"
-    }
-  ],
-  defaultValue: BlockType.Paragraph
-});
-function BlockPlugin() {
-  return createRichTextV2Plugin({
-    withPlugin: withBlock,
-    onKeyDown,
-    control: {
-      definition,
-      onChange: (editor, value) => {
-        const activeBlockType = getActiveBlockType(editor);
-        if (value === BlockType.UnorderedList || value === BlockType.OrderedList) {
-          ListActions.toggleList(editor, {
-            type: value,
-            at: getSelection(editor)
-          });
-        } else if (activeBlockType === value) {
-          Transforms.setNodes(editor, {
-            type: BlockType.Default
-          }, { at: getSelection(editor) });
-        } else {
-          ListActions.unwrapList(editor, {
-            at: getSelection(editor)
-          });
-          Transforms.setNodes(editor, {
-            type: value != null ? value : BlockType.Default
-          }, { at: getSelection(editor) });
-        }
-      },
-      getValue: (editor) => {
-        const activeBlock = getActiveBlockType(editor);
-        if (activeBlock === RootBlockType.Text || activeBlock === RootBlockType.Default)
-          return void 0;
-        return activeBlock;
-      }
-    }
-  });
-}
-const RichTextV2ControlType = "makeswift::controls::rich-text-v2";
-const RichTextV2Mode = {
-  Inline: "makeswift::controls::rich-text-v2::mode::inline",
-  Block: "makeswift::controls::rich-text-v2::mode::block"
-};
-function createRichTextV2Plugin({
-  control,
-  withPlugin,
-  onKeyDown: onKeyDown2
-}) {
-  return { control, withPlugin, onKeyDown: onKeyDown2 };
-}
-function unstable_RichTextV2(config = {}) {
-  return { type: RichTextV2ControlType, config };
-}
-const RichTextV2ControlMessageType = {
-  RESET_VALUE: "RESET_VALUE",
-  FOCUS: "FOCUS",
-  RUN_PLUGIN_CONTROL_ACTION: "RUN_PLUGIN_CONTROL_ACTION",
-  SET_DEFAULT_VALUE: "SET_DEFAULT_VALUE",
-  SET_PLUGIN_CONTROL_VALUE: "SET_PLUGIN_CONTROL_VALUE",
-  ON_CHANGE: "ON_CHANGE",
-  SELECT: "SELECT",
-  SWITCH_TO_BUILD_MODE: "SWITCH_TO_BUILD_MODE",
-  CHANGE_BOX_MODEL: "CHANGE_BOX_MODEL"
-};
-class RichTextV2Control extends PropController {
-  constructor(send, descriptor) {
-    super(send);
-    __publicField(this, "editor", null);
-    __publicField(this, "defaultValue", null);
-    __publicField(this, "descriptor");
-    __publicField(this, "recv", (message) => {
-      var _a, _b, _c;
-      if (!this.editor)
-        return;
-      switch (message.type) {
-        case RichTextV2ControlMessageType.FOCUS: {
-          this.editor.focusAndSelectAll();
-          break;
-        }
-        case RichTextV2ControlMessageType.RESET_VALUE: {
-          if (this.defaultValue) {
-            this.editor.selection = null;
-            this.editor.children = this.defaultValue;
-            this.editor.onChange();
-          }
-          break;
-        }
-        case RichTextV2ControlMessageType.RUN_PLUGIN_CONTROL_ACTION: {
-          (_c = (_b = (_a = this.descriptor.config.plugins) == null ? void 0 : _a.at(message.pluginIndex)) == null ? void 0 : _b.control) == null ? void 0 : _c.onChange(this.editor, message.value);
-          break;
-        }
-      }
-    });
-    this.descriptor = descriptor;
-    this.send = send;
-  }
-  setEditor(editor) {
-    var _a, _b, _c;
-    this.editor = editor;
-    this.send({
-      type: RichTextV2ControlMessageType.SET_PLUGIN_CONTROL_VALUE,
-      value: (_c = (_b = (_a = this.descriptor.config) == null ? void 0 : _a.plugins) == null ? void 0 : _b.map((plugin) => {
-        var _a2;
-        return (_a2 = plugin == null ? void 0 : plugin.control) == null ? void 0 : _a2.getValue(editor);
-      })) != null ? _c : []
-    });
-  }
-  setDefaultValue(defaultValue) {
-    this.defaultValue = defaultValue;
-    this.send({ type: RichTextV2ControlMessageType.SET_DEFAULT_VALUE, value: defaultValue });
-  }
-  select() {
-    this.send({ type: RichTextV2ControlMessageType.SELECT });
-  }
-  switchToBuildMode() {
-    this.send({ type: RichTextV2ControlMessageType.SWITCH_TO_BUILD_MODE });
-  }
-  onChange(value) {
-    var _a, _b, _c;
-    const editor = this.editor;
-    if (editor == null)
-      return;
-    this.send({
-      type: RichTextV2ControlMessageType.ON_CHANGE,
-      value
-    });
-    this.send({
-      type: RichTextV2ControlMessageType.SET_PLUGIN_CONTROL_VALUE,
-      value: (_c = (_b = (_a = this.descriptor.config) == null ? void 0 : _a.plugins) == null ? void 0 : _b.map((plugin) => {
-        var _a2;
-        return (_a2 = plugin == null ? void 0 : plugin.control) == null ? void 0 : _a2.getValue(editor);
-      })) != null ? _c : []
-    });
-  }
-  changeBoxModel(boxModel) {
-    this.send({ type: RichTextV2ControlMessageType.CHANGE_BOX_MODEL, payload: { boxModel } });
-  }
-}
+  Link: "link"
+};
+const BlockTextAlignment = {
+  Left: "left",
+  Center: "center",
+  Right: "right",
+  Justify: "justify"
+};
 function isText(node) {
   if (typeof node === "object" && "text" in node)
     return true;
   return false;
 }
 function toTextDAO(node) {
-  var _a, _b, _c, _d;
-  const typographyMark = (_a = node.marks) == null ? void 0 : _a.find((mark) => mark.type === "typography");
+  var _a2, _b, _c, _d;
+  const typographyMark = (_a2 = node.marks) == null ? void 0 : _a2.find((mark) => mark.type === "typography");
   return [
     {
       text: (_b = node.text) != null ? _b : "",
@@ -2389,12 +1986,12 @@ function toTextDAO(node) {
   ];
 }
 function toInlineDAO(node) {
-  var _a, _b, _c, _d;
+  var _a2, _b, _c, _d;
   switch (node.type) {
     case InlineType.Link:
       return [
         {
-          children: (_b = (_a = node.nodes) == null ? void 0 : _a.flatMap(toInlineOrTextDAO)) != null ? _b : [],
+          children: (_b = (_a2 = node.nodes) == null ? void 0 : _a2.flatMap(toInlineOrTextDAO)) != null ? _b : [],
           [node.type]: node.data,
           type: node.type
         }
@@ -2423,7 +2020,7 @@ function toInlineOrTextDAO(node) {
   }
 }
 function toNodeDAO(node) {
-  var _a, _b;
+  var _a2, _b;
   switch (node.object) {
     case ObjectType.Inline:
     case ObjectType.Text:
@@ -2433,7 +2030,7 @@ function toNodeDAO(node) {
         {
           type: node.type,
           textAlign: (node == null ? void 0 : node.data) && "textAlign" in node.data ? node == null ? void 0 : node.data.textAlign : void 0,
-          children: (_b = (_a = node.nodes) == null ? void 0 : _a.flatMap(toNodeDAO)) != null ? _b : []
+          children: (_b = (_a2 = node.nodes) == null ? void 0 : _a2.flatMap(toNodeDAO)) != null ? _b : []
         }
       ];
     default:
@@ -2441,8 +2038,8 @@ function toNodeDAO(node) {
   }
 }
 function richTextDTOtoSelection(data) {
-  var _a, _b, _c, _d;
-  if (((_b = (_a = data.selection) == null ? void 0 : _a.anchor) == null ? void 0 : _b.offset) != null && data.selection.anchor.path != null && ((_d = (_c = data.selection) == null ? void 0 : _c.focus) == null ? void 0 : _d.offset) != null && data.selection.focus.path != null)
+  var _a2, _b, _c, _d;
+  if (((_b = (_a2 = data.selection) == null ? void 0 : _a2.anchor) == null ? void 0 : _b.offset) != null && data.selection.anchor.path != null && ((_d = (_c = data.selection) == null ? void 0 : _c.focus) == null ? void 0 : _d.offset) != null && data.selection.focus.path != null)
     return {
       anchor: {
         offset: data.selection.anchor.offset,
@@ -2456,8 +2053,8 @@ function richTextDTOtoSelection(data) {
   return null;
 }
 function richTextDTOtoDAO(data) {
-  var _a, _b, _c;
-  return (_c = (_b = (_a = data.document) == null ? void 0 : _a.nodes) == null ? void 0 : _b.flatMap(toNodeDAO)) != null ? _c : [];
+  var _a2, _b, _c;
+  return (_c = (_b = (_a2 = data.document) == null ? void 0 : _a2.nodes) == null ? void 0 : _b.flatMap(toNodeDAO)) != null ? _c : [];
 }
 function toInlineOrTextDTO(node) {
   if (isText(node)) {
@@ -2501,7 +2098,7 @@ function toInlineOrTextDTO(node) {
   }
 }
 function toNodeDTO(node) {
-  var _a, _b;
+  var _a2, _b;
   if (isText(node))
     return toInlineOrTextDTO(node);
   switch (node.type) {
@@ -2526,7 +2123,7 @@ function toNodeDTO(node) {
             textAlign: node.textAlign
           } : {},
           object: "block",
-          nodes: (_b = (_a = node.children) == null ? void 0 : _a.flatMap(toNodeDTO)) != null ? _b : []
+          nodes: (_b = (_a2 = node.children) == null ? void 0 : _a2.flatMap(toNodeDTO)) != null ? _b : []
         }
       ];
     default:
@@ -2534,330 +2131,209 @@ function toNodeDTO(node) {
   }
 }
 function toSelectionDTO(selection) {
-  if (selection == null)
-    return void 0;
-  return {
-    isFocused: false,
-    marks: void 0,
-    object: "selection",
-    anchor: {
-      offset: selection.anchor.offset,
-      path: selection.anchor.path,
-      object: "point"
-    },
-    focus: {
-      offset: selection.focus.offset,
-      path: selection.focus.path,
-      object: "point"
-    }
-  };
-}
-function richTextDAOToDTO(children, selection) {
-  return {
-    document: {
-      data: void 0,
-      nodes: children.flatMap(toNodeDTO),
-      object: "document"
-    },
-    object: "value",
-    selection: toSelectionDTO(selection),
-    annotations: void 0,
-    data: void 0
-  };
-}
-const RichTextControlType = "makeswift::controls::rich-text";
-function RichText$1() {
-  return { type: RichTextControlType };
-}
-const RichTextControlMessageType = {
-  CHANGE_BUILDER_EDIT_MODE: "CHANGE_BUILDER_EDIT_MODE",
-  INITIALIZE_EDITOR: "INITIALIZE_EDITOR",
-  CHANGE_EDITOR_VALUE: "CHANGE_EDITOR_VALUE",
-  FOCUS: "FOCUS",
-  BLUR: "BLUR",
-  UNDO: "UNDO",
-  REDO: "REDO",
-  CHANGE_BOX_MODEL: "CHANGE_BOX_MODEL"
-};
-class RichTextControl extends PropController {
-  constructor() {
-    super(...arguments);
-    __publicField(this, "editor", null);
-    __publicField(this, "recv", (message) => {
-      if (!this.editor)
-        return;
-      switch (message.type) {
-        case RichTextControlMessageType.CHANGE_BUILDER_EDIT_MODE: {
-          switch (message.editMode) {
-            case BuilderEditMode.BUILD:
-            case BuilderEditMode.INTERACT:
-              this.editor.deselectAndBlur();
-          }
-          break;
-        }
-        case RichTextControlMessageType.FOCUS: {
-          this.editor.focusAndSelectAll();
-          break;
-        }
-      }
-    });
-  }
-  setSlateEditor(editor) {
-    this.editor = editor;
-    this.send({
-      type: RichTextControlMessageType.INITIALIZE_EDITOR,
-      value: richTextDAOToDTO(editor.children, editor.selection)
-    });
-    const _onChange = editor.onChange;
-    this.editor.onChange = (options) => {
-      _onChange(options);
-      if ((options == null ? void 0 : options.operation) != null) {
-        this.send({
-          type: RichTextControlMessageType.CHANGE_EDITOR_VALUE,
-          value: richTextDAOToDTO(editor.children, editor.selection)
-        });
-      }
-    };
-  }
-  focus() {
-    this.send({ type: RichTextControlMessageType.FOCUS });
-  }
-  blur() {
-    this.send({ type: RichTextControlMessageType.BLUR });
-  }
-  undo() {
-    this.send({ type: RichTextControlMessageType.UNDO });
-  }
-  redo() {
-    this.send({ type: RichTextControlMessageType.REDO });
-  }
-  changeBoxModel(boxModel) {
-    this.send({ type: RichTextControlMessageType.CHANGE_BOX_MODEL, payload: { boxModel } });
-  }
-}
-const Types = {
-  Backgrounds: "Backgrounds",
-  Border: "Border",
-  BorderRadius: "BorderRadius",
-  Checkbox: "Checkbox",
-  Date: "Date",
-  ElementID: "ElementID",
-  Font: "Font",
-  GapX: "GapX",
-  GapY: "GapY",
-  Grid: "Grid",
-  Image: "Image",
-  Images: "Images",
-  Link: "Link",
-  List: "List",
-  Margin: "Margin",
-  NavigationLinks: "NavigationLinks",
-  Number: "Number",
-  Padding: "Padding",
-  ResponsiveColor: "ResponsiveColor",
-  ResponsiveIconRadioGroup: "ResponsiveIconRadioGroup",
-  ResponsiveLength: "ResponsiveLength",
-  ResponsiveNumber: "ResponsiveNumber",
-  ResponsiveOpacity: "ResponsiveOpacity",
-  ResponsiveSelect: "ResponsiveSelect",
-  RichText: "RichText",
-  Shadows: "Shadows",
-  Shape: "Shape",
-  SocialLinks: "SocialLinks",
-  Table: "Table",
-  TableFormFields: "TableFormFields",
-  Typeahead: "Typeahead",
-  TextArea: "TextArea",
-  TextInput: "TextInput",
-  TextStyle: "TextStyle",
-  Video: "Video",
-  Width: "Width",
-  Style: StyleControlType
-};
-function Backgrounds(options = {}) {
-  return { type: Types.Backgrounds, options };
-}
-const BorderPropControllerFormat = {
-  ClassName: "makeswift::prop-controllers::border::format::class-name",
-  ResponsiveValue: "makeswift::prop-controllers:border::format::responsive-value"
-};
-function Border(options = {}) {
-  return { type: Types.Border, options };
-}
-Border.Format = BorderPropControllerFormat;
-const BorderRadiusPropControllerFormat = {
-  ClassName: "makeswift::prop-controllers::border-radius::format::class-name",
-  ResponsiveValue: "makeswift::prop-controllers::border-radius::format::responsive-value"
-};
-function BorderRadius(options = {}) {
-  return { type: Types.BorderRadius, options };
-}
-BorderRadius.Format = BorderRadiusPropControllerFormat;
-function Checkbox(options) {
-  return { type: Types.Checkbox, options };
-}
-function Date(options = {}) {
-  return { type: Types.Date, options };
-}
-function ElementID(options = {}) {
-  return { type: Types.ElementID, options };
-}
-function Font(options = {}) {
-  return { type: Types.Font, options };
-}
-function GapX(options = {}) {
-  return { type: Types.GapX, options };
-}
-function GapY(options = {}) {
-  return { type: Types.GapY, options };
-}
-function Grid(options = {}) {
-  return { type: Types.Grid, options };
-}
-function Image(options = {}) {
-  return { type: Types.Image, options };
-}
-function Images(options = {}) {
-  return { type: Types.Images, options };
-}
-function Link(options = {}) {
-  return { type: Types.Link, options };
-}
-function List(options) {
-  return { type: Types.List, options };
-}
-const MarginPropControllerFormat = {
-  ClassName: "makeswift::prop-controllers::margin::format::class-name",
-  ResponsiveValue: "makeswift::prop-controllers::margin::format::responsive-value"
-};
-function Margin(options = {}) {
-  return { type: Types.Margin, options };
-}
-Margin.Format = MarginPropControllerFormat;
-function NavigationLinks(options = {}) {
-  return { type: Types.NavigationLinks, options };
-}
-function Number(options = {}) {
-  return { type: Types.Number, options };
-}
-const PaddingPropControllerFormat = {
-  ClassName: "makeswift::prop-controllers::padding::format::class-name",
-  ResponsiveValue: "makeswift::prop-controllers::padding::format::responsive-value"
-};
-function Padding(options = {}) {
-  return { type: Types.Padding, options };
-}
-Padding.Format = PaddingPropControllerFormat;
-function ResponsiveColor(options = {}) {
-  return { type: Types.ResponsiveColor, options };
-}
-function ResponsiveIconRadioGroup(options) {
-  return { type: Types.ResponsiveIconRadioGroup, options };
-}
-function ResponsiveLength(options = {}) {
-  return { type: Types.ResponsiveLength, options };
-}
-function ResponsiveNumber(options = {}) {
-  return { type: Types.ResponsiveNumber, options };
-}
-function ResponsiveOpacity(options = {}) {
-  return { type: Types.ResponsiveOpacity, options };
-}
-function ResponsiveSelect(options) {
-  return { type: Types.ResponsiveSelect, options };
-}
-function RichText(options = {}) {
-  return { type: Types.RichText, options };
-}
-const ShadowsPropControllerFormat = {
-  ClassName: "makeswift::prop-controllers::shadows::format::class-name",
-  ResponsiveValue: "makeswift::prop-controllers::shadows::format::responsive-value"
-};
-function Shadows(options = {}) {
-  return { type: Types.Shadows, options };
-}
-Shadows.Format = ShadowsPropControllerFormat;
-function Shape(options) {
-  return { type: Types.Shape, options };
-}
-function SocialLinks(options = {}) {
-  return { type: Types.SocialLinks, options };
-}
-function Table(options = {}) {
-  return { type: Types.Table, options };
-}
-function TableFormFields(options = {}) {
-  return { type: Types.TableFormFields, options };
+  if (selection == null)
+    return void 0;
+  return {
+    isFocused: false,
+    marks: void 0,
+    object: "selection",
+    anchor: {
+      offset: selection.anchor.offset,
+      path: selection.anchor.path,
+      object: "point"
+    },
+    focus: {
+      offset: selection.focus.offset,
+      path: selection.focus.path,
+      object: "point"
+    }
+  };
 }
-function Typeahead(options) {
-  return { type: Types.Typeahead, options };
+function richTextDAOToDTO(children, selection) {
+  return {
+    document: {
+      data: void 0,
+      nodes: children.flatMap(toNodeDTO),
+      object: "document"
+    },
+    object: "value",
+    selection: toSelectionDTO(selection),
+    annotations: void 0,
+    data: void 0
+  };
 }
-function TextArea(options = {}) {
-  return { type: Types.TextArea, options };
+const RichTextControlType = "makeswift::controls::rich-text";
+function RichText() {
+  return { type: RichTextControlType };
 }
-function TextInput(options = {}) {
-  return { type: Types.TextInput, options };
+const RichTextControlMessageType = {
+  CHANGE_BUILDER_EDIT_MODE: "CHANGE_BUILDER_EDIT_MODE",
+  INITIALIZE_EDITOR: "INITIALIZE_EDITOR",
+  CHANGE_EDITOR_VALUE: "CHANGE_EDITOR_VALUE",
+  FOCUS: "FOCUS",
+  BLUR: "BLUR",
+  UNDO: "UNDO",
+  REDO: "REDO",
+  CHANGE_BOX_MODEL: "CHANGE_BOX_MODEL"
+};
+class RichTextControl extends PropController {
+  constructor() {
+    super(...arguments);
+    __publicField(this, "editor", null);
+    __publicField(this, "recv", (message) => {
+      if (!this.editor)
+        return;
+      switch (message.type) {
+        case RichTextControlMessageType.CHANGE_BUILDER_EDIT_MODE: {
+          switch (message.editMode) {
+            case BuilderEditMode.BUILD:
+            case BuilderEditMode.INTERACT:
+              this.editor.deselectAndBlur();
+          }
+          break;
+        }
+        case RichTextControlMessageType.FOCUS: {
+          this.editor.focusAndSelectAll();
+          break;
+        }
+      }
+    });
+  }
+  setSlateEditor(editor) {
+    this.editor = editor;
+    this.send({
+      type: RichTextControlMessageType.INITIALIZE_EDITOR,
+      value: richTextDAOToDTO(editor.children, editor.selection)
+    });
+    const _onChange = editor.onChange;
+    this.editor.onChange = (options) => {
+      _onChange(options);
+      if ((options == null ? void 0 : options.operation) != null) {
+        this.send({
+          type: RichTextControlMessageType.CHANGE_EDITOR_VALUE,
+          value: richTextDAOToDTO(editor.children, editor.selection)
+        });
+      }
+    };
+  }
+  focus() {
+    this.send({ type: RichTextControlMessageType.FOCUS });
+  }
+  blur() {
+    this.send({ type: RichTextControlMessageType.BLUR });
+  }
+  undo() {
+    this.send({ type: RichTextControlMessageType.UNDO });
+  }
+  redo() {
+    this.send({ type: RichTextControlMessageType.REDO });
+  }
+  changeBoxModel(boxModel) {
+    this.send({ type: RichTextControlMessageType.CHANGE_BOX_MODEL, payload: { boxModel } });
+  }
 }
-function TextStyle(options = {}) {
-  return { type: Types.TextStyle, options };
+const RichTextV2ControlType = "makeswift::controls::rich-text-v2";
+const RichTextV2Mode = {
+  Inline: "makeswift::controls::rich-text-v2::mode::inline",
+  Block: "makeswift::controls::rich-text-v2::mode::block"
+};
+function createRichTextV2Plugin({
+  control,
+  withPlugin,
+  onKeyDown,
+  renderElement,
+  renderLeaf
+}) {
+  return { control, withPlugin, onKeyDown, renderElement, renderLeaf };
 }
-function Video(options = {}) {
-  return { type: Types.Video, options };
+function unstable_RichTextV2(config = {}) {
+  return { type: RichTextV2ControlType, config };
 }
-const WidthPropControllerFormat = {
-  ClassName: "makeswift::prop-controllers::width::format::class-name",
-  ResponsiveValue: "makeswift::prop-controllers::width::format::responsive-value"
+const RichTextV2ControlMessageType = {
+  RESET_VALUE: "RESET_VALUE",
+  FOCUS: "FOCUS",
+  RUN_PLUGIN_CONTROL_ACTION: "RUN_PLUGIN_CONTROL_ACTION",
+  SET_DEFAULT_VALUE: "SET_DEFAULT_VALUE",
+  SET_PLUGIN_CONTROL_VALUE: "SET_PLUGIN_CONTROL_VALUE",
+  ON_CHANGE: "ON_CHANGE",
+  SELECT: "SELECT",
+  SWITCH_TO_BUILD_MODE: "SWITCH_TO_BUILD_MODE",
+  CHANGE_BOX_MODEL: "CHANGE_BOX_MODEL"
 };
-function Width(options = {}) {
-  return { type: Types.Width, options };
+class RichTextV2Control extends PropController {
+  constructor(send, descriptor) {
+    super(send);
+    __publicField(this, "editor", null);
+    __publicField(this, "defaultValue", null);
+    __publicField(this, "descriptor");
+    __publicField(this, "recv", (message) => {
+      var _a2, _b, _c;
+      if (!this.editor)
+        return;
+      switch (message.type) {
+        case RichTextV2ControlMessageType.FOCUS: {
+          this.editor.focusAndSelectAll();
+          break;
+        }
+        case RichTextV2ControlMessageType.RESET_VALUE: {
+          if (this.defaultValue) {
+            this.editor.selection = null;
+            this.editor.children = this.defaultValue;
+            this.editor.onChange();
+          }
+          break;
+        }
+        case RichTextV2ControlMessageType.RUN_PLUGIN_CONTROL_ACTION: {
+          (_c = (_b = (_a2 = this.descriptor.config.plugins) == null ? void 0 : _a2.at(message.pluginIndex)) == null ? void 0 : _b.control) == null ? void 0 : _c.onChange(this.editor, message.value);
+          break;
+        }
+      }
+    });
+    this.descriptor = descriptor;
+    this.send = send;
+  }
+  setEditor(editor) {
+    var _a2, _b, _c;
+    this.editor = editor;
+    this.send({
+      type: RichTextV2ControlMessageType.SET_PLUGIN_CONTROL_VALUE,
+      value: (_c = (_b = (_a2 = this.descriptor.config) == null ? void 0 : _a2.plugins) == null ? void 0 : _b.map((plugin) => {
+        var _a3;
+        return (_a3 = plugin == null ? void 0 : plugin.control) == null ? void 0 : _a3.getValue(editor);
+      })) != null ? _c : []
+    });
+  }
+  setDefaultValue(defaultValue) {
+    this.defaultValue = defaultValue;
+    this.send({ type: RichTextV2ControlMessageType.SET_DEFAULT_VALUE, value: defaultValue });
+  }
+  select() {
+    this.send({ type: RichTextV2ControlMessageType.SELECT });
+  }
+  switchToBuildMode() {
+    this.send({ type: RichTextV2ControlMessageType.SWITCH_TO_BUILD_MODE });
+  }
+  onChange(value) {
+    var _a2, _b, _c;
+    const editor = this.editor;
+    if (editor == null)
+      return;
+    this.send({
+      type: RichTextV2ControlMessageType.ON_CHANGE,
+      value
+    });
+    this.send({
+      type: RichTextV2ControlMessageType.SET_PLUGIN_CONTROL_VALUE,
+      value: (_c = (_b = (_a2 = this.descriptor.config) == null ? void 0 : _a2.plugins) == null ? void 0 : _b.map((plugin) => {
+        var _a3;
+        return (_a3 = plugin == null ? void 0 : plugin.control) == null ? void 0 : _a3.getValue(editor);
+      })) != null ? _c : []
+    });
+  }
+  changeBoxModel(boxModel) {
+    this.send({ type: RichTextV2ControlMessageType.CHANGE_BOX_MODEL, payload: { boxModel } });
+  }
 }
-Width.Format = WidthPropControllerFormat;
-var descriptors = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
-  __proto__: null,
-  Types,
-  Backgrounds,
-  BorderPropControllerFormat,
-  Border,
-  BorderRadiusPropControllerFormat,
-  BorderRadius,
-  Checkbox,
-  Date,
-  ElementID,
-  Font,
-  GapX,
-  GapY,
-  Grid,
-  Image,
-  Images,
-  Link,
-  List,
-  MarginPropControllerFormat,
-  Margin,
-  NavigationLinks,
-  Number,
-  PaddingPropControllerFormat,
-  Padding,
-  ResponsiveColor,
-  ResponsiveIconRadioGroup,
-  ResponsiveLength,
-  ResponsiveNumber,
-  ResponsiveOpacity,
-  ResponsiveSelect,
-  RichText,
-  ShadowsPropControllerFormat,
-  Shadows,
-  Shape,
-  SocialLinks,
-  Table,
-  TableFormFields,
-  Typeahead,
-  TextArea,
-  TextInput,
-  TextStyle,
-  Video,
-  WidthPropControllerFormat,
-  Width
-}, Symbol.toStringTag, { value: "Module" }));
 function isNonNullable(value) {
   return value != null;
 }
@@ -2890,51 +2366,51 @@ function getElementId$1(descriptor, prop) {
   }
 }
 function getBackgroundsSwatchIds(value) {
-  var _a;
-  return (_a = value == null ? void 0 : value.flatMap((override) => override.value).flatMap((backgroundItem) => {
-    var _a2;
+  var _a2;
+  return (_a2 = value == null ? void 0 : value.flatMap((override) => override.value).flatMap((backgroundItem) => {
+    var _a3;
     switch (backgroundItem.type) {
       case "color":
-        return ((_a2 = backgroundItem.payload) == null ? void 0 : _a2.swatchId) == null ? [] : [backgroundItem.payload.swatchId];
+        return ((_a3 = backgroundItem.payload) == null ? void 0 : _a3.swatchId) == null ? [] : [backgroundItem.payload.swatchId];
       case "gradient":
         return backgroundItem.payload.stops.flatMap((stop) => stop.color == null ? [] : stop.color.swatchId);
       default:
         return [];
     }
-  })) != null ? _a : [];
+  })) != null ? _a2 : [];
 }
 function getBorderSwatchIds(value) {
-  var _a;
-  return (_a = value == null ? void 0 : value.flatMap((override) => override.value).flatMap((borderValue) => {
-    var _a2, _b, _c, _d, _e, _f, _g, _h;
+  var _a2;
+  return (_a2 = value == null ? void 0 : value.flatMap((override) => override.value).flatMap((borderValue) => {
+    var _a3, _b, _c, _d, _e, _f, _g, _h;
     return [
-      (_b = (_a2 = borderValue.borderTop) == null ? void 0 : _a2.color) == null ? void 0 : _b.swatchId,
+      (_b = (_a3 = borderValue.borderTop) == null ? void 0 : _a3.color) == null ? void 0 : _b.swatchId,
       (_d = (_c = borderValue.borderRight) == null ? void 0 : _c.color) == null ? void 0 : _d.swatchId,
       (_f = (_e = borderValue.borderBottom) == null ? void 0 : _e.color) == null ? void 0 : _f.swatchId,
       (_h = (_g = borderValue.borderLeft) == null ? void 0 : _g.color) == null ? void 0 : _h.swatchId
     ].filter((swatchId) => swatchId != null);
-  })) != null ? _a : [];
+  })) != null ? _a2 : [];
 }
 function getBoxShadowsSwatchIds(value) {
-  var _a;
-  return (_a = value == null ? void 0 : value.flatMap((override) => override.value).map((item) => {
-    var _a2;
-    return (_a2 = item.payload.color) == null ? void 0 : _a2.swatchId;
-  }).filter((swatchId) => swatchId != null)) != null ? _a : [];
+  var _a2;
+  return (_a2 = value == null ? void 0 : value.flatMap((override) => override.value).map((item) => {
+    var _a3;
+    return (_a3 = item.payload.color) == null ? void 0 : _a3.swatchId;
+  }).filter((swatchId) => swatchId != null)) != null ? _a2 : [];
 }
 function getResponsiveColorSwatchIds(value) {
-  var _a;
-  return (_a = value == null ? void 0 : value.map((override) => override.value).map((color) => color.swatchId)) != null ? _a : [];
+  var _a2;
+  return (_a2 = value == null ? void 0 : value.map((override) => override.value).map((color) => color.swatchId)) != null ? _a2 : [];
 }
 function getTypographyStyleSwatchIds(style) {
-  var _a;
-  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 : [];
+  var _a2;
+  return (_a2 = style == null ? void 0 : style.map((override) => override.value).flatMap((typographyStyle) => {
+    var _a3;
+    return (_a3 = typographyStyle.color) == null ? void 0 : _a3.swatchId;
+  }).filter(isNonNullable)) != null ? _a2 : [];
 }
 function getElementSwatchIds(descriptor, prop) {
-  var _a;
+  var _a2;
   if (prop == null)
     return [];
   switch (descriptor.type) {
@@ -2944,17 +2420,17 @@ function getElementSwatchIds(descriptor, prop) {
       return getBorderSwatchIds(prop);
     case Types.NavigationLinks: {
       const value = prop;
-      return (_a = value == null ? void 0 : value.flatMap((item) => {
-        var _a2, _b, _c, _d;
+      return (_a2 = value == null ? void 0 : value.flatMap((item) => {
+        var _a3, _b, _c, _d;
         switch (item.type) {
           case "button":
           case "dropdown":
             return [
-              ...(_b = (_a2 = item.payload.color) == null ? void 0 : _a2.map((override) => override.value).map((color) => color.swatchId)) != null ? _b : [],
+              ...(_b = (_a3 = item.payload.color) == null ? void 0 : _a3.map((override) => override.value).map((color) => color.swatchId)) != null ? _b : [],
               ...(_d = (_c = item.payload.textColor) == null ? void 0 : _c.map((override) => override.value).map((color) => color.swatchId)) != null ? _d : []
             ];
         }
-      })) != null ? _a : [];
+      })) != null ? _a2 : [];
     }
     case Types.ResponsiveColor:
       return getResponsiveColorSwatchIds(prop);
@@ -2962,20 +2438,20 @@ function getElementSwatchIds(descriptor, prop) {
       return getBoxShadowsSwatchIds(prop);
     case Types.RichText: {
       let getNodeSwatchIds = function(node) {
-        var _a2, _b, _c, _d;
+        var _a3, _b, _c, _d;
         switch (node.object) {
           case "document":
           case "block":
           case "inline":
-            return (_b = (_a2 = node.nodes) == null ? void 0 : _a2.flatMap(getNodeSwatchIds)) != null ? _b : [];
+            return (_b = (_a3 = node.nodes) == null ? void 0 : _a3.flatMap(getNodeSwatchIds)) != null ? _b : [];
           case "text":
             return (_d = (_c = node.marks) == null ? void 0 : _c.flatMap(getMarkSwatchIds)) != null ? _d : [];
           default:
             return [];
         }
       }, getMarkSwatchIds = function(mark) {
-        var _a2, _b;
-        return getTypographyStyleSwatchIds((_b = (_a2 = mark.data) == null ? void 0 : _a2.value) == null ? void 0 : _b.style);
+        var _a3, _b;
+        return getTypographyStyleSwatchIds((_b = (_a3 = mark.data) == null ? void 0 : _a3.value) == null ? void 0 : _b.style);
       };
       const value = prop;
       if (value == null || value.document == null)
@@ -2986,23 +2462,56 @@ function getElementSwatchIds(descriptor, prop) {
       const value = prop;
       return (value == null ? void 0 : value.swatchId) == null ? [] : [value.swatchId];
     }
+    case StyleV2ControlType: {
+      const value = prop;
+      return value.flatMap((value2) => getElementSwatchIds(descriptor.config.type, value2.value));
+    }
+    case RichTextV2ControlType: {
+      let getDescendantSwatchIds = function(descendant) {
+        if (Element.isElement(descendant)) {
+          return [
+            ...getSlateElementSwatchIds(descendant),
+            ...descendant.children.flatMap((d) => getDescendantSwatchIds(d))
+          ];
+        }
+        if (Text.isText(descendant)) {
+          return getTextSwatchIds(descendant);
+        }
+        return [];
+      }, getSlateElementSwatchIds = function(descendant) {
+        var _a3;
+        return (_a3 = plugins == null ? void 0 : plugins.flatMap((plugin) => {
+          var _a4;
+          return ((_a4 = plugin.control) == null ? void 0 : _a4.definition) && plugin.control.getElementValue ? getElementSwatchIds(plugin.control.definition, plugin.control.getElementValue(descendant)) : [];
+        })) != null ? _a3 : [];
+      }, getTextSwatchIds = function(text) {
+        var _a3;
+        return (_a3 = plugins == null ? void 0 : plugins.flatMap((plugin) => {
+          var _a4;
+          return ((_a4 = plugin.control) == null ? void 0 : _a4.definition) && plugin.control.getLeafValue ? getElementSwatchIds(plugin.control.definition, plugin.control.getLeafValue(text)) : [];
+        })) != null ? _a3 : [];
+      };
+      const descendants = prop;
+      const plugins = descriptor.config.plugins;
+      return descendants.flatMap((d) => getDescendantSwatchIds(d));
+    }
     default:
       return [];
   }
 }
 function getBackgroundsFileIds(value) {
-  var _a;
-  return (_a = value == null ? void 0 : value.flatMap((override) => override.value).flatMap((backgroundItem) => {
+  var _a2;
+  return (_a2 = value == null ? void 0 : value.flatMap((override) => override.value).flatMap((backgroundItem) => {
     switch (backgroundItem.type) {
       case "image":
         return [backgroundItem.payload.imageId];
       default:
         return [];
     }
-  })) != null ? _a : [];
+  })) != null ? _a2 : [];
 }
 function getFileIds(descriptor, prop) {
-  var _a;
+  var _a2;
   if (prop == null)
     return [];
   switch (descriptor.type) {
@@ -3014,7 +2523,7 @@ function getFileIds(descriptor, prop) {
     }
     case Types.Images: {
       const value = prop;
-      return (_a = value == null ? void 0 : value.flatMap((item) => item.props.file == null ? [] : [item.props.file])) != null ? _a : [];
+      return (_a2 = value == null ? void 0 : value.flatMap((item) => item.props.file == null ? [] : [item.props.file])) != null ? _a2 : [];
     }
     case ImageControlType: {
       const value = prop;
@@ -3030,20 +2539,20 @@ function getTypographyIds(descriptor, prop) {
   switch (descriptor.type) {
     case Types.RichText: {
       let getNodeTypographyIds = function(node) {
-        var _a, _b, _c, _d;
+        var _a2, _b, _c, _d;
         switch (node.object) {
           case "document":
           case "block":
           case "inline":
-            return (_b = (_a = node.nodes) == null ? void 0 : _a.flatMap(getNodeTypographyIds)) != null ? _b : [];
+            return (_b = (_a2 = node.nodes) == null ? void 0 : _a2.flatMap(getNodeTypographyIds)) != null ? _b : [];
           case "text":
             return (_d = (_c = node.marks) == null ? void 0 : _c.flatMap(getMarkTypographyIds)) != null ? _d : [];
           default:
             return [];
         }
       }, getMarkTypographyIds = function(mark) {
-        var _a, _b;
-        return [(_b = (_a = mark.data) == null ? void 0 : _a.value) == null ? void 0 : _b.id].filter((id) => id != null);
+        var _a2, _b;
+        return [(_b = (_a2 = mark.data) == null ? void 0 : _a2.value) == null ? void 0 : _b.id].filter((id) => id != null);
       };
       const value = prop;
       if (value == null || value.document == null)
@@ -3067,7 +2576,7 @@ function getTableIds(descriptor, prop) {
   }
 }
 function getPageIds(descriptor, prop) {
-  var _a;
+  var _a2;
   if (prop == null)
     return [];
   switch (descriptor.type) {
@@ -3086,8 +2595,8 @@ function getPageIds(descriptor, prop) {
       const value = prop;
       if (value == null)
         return [];
-      return (_a = value == null ? void 0 : value.flatMap((item) => {
-        var _a2, _b;
+      return (_a2 = value == null ? void 0 : value.flatMap((item) => {
+        var _a3, _b;
         switch (item.type) {
           case "button": {
             if (item.payload.link == null)
@@ -3100,7 +2609,7 @@ function getPageIds(descriptor, prop) {
             }
           }
           case "dropdown": {
-            return (_b = (_a2 = item.payload.links) == null ? void 0 : _a2.flatMap((link) => {
+            return (_b = (_a3 = item.payload.links) == null ? void 0 : _a3.flatMap((link) => {
               if (link.payload.link == null)
                 return [];
               switch (link.payload.link.type) {
@@ -3112,25 +2621,25 @@ function getPageIds(descriptor, prop) {
             })) != null ? _b : [];
           }
         }
-      })) != null ? _a : [];
+      })) != null ? _a2 : [];
     }
     case Types.RichText: {
       let getNodePageIds = function(node) {
-        var _a2, _b;
+        var _a3, _b;
         switch (node.object) {
           case "document":
           case "block":
-            return (_b = (_a2 = node.nodes) == null ? void 0 : _a2.flatMap(getNodePageIds)) != null ? _b : [];
+            return (_b = (_a3 = node.nodes) == null ? void 0 : _a3.flatMap(getNodePageIds)) != null ? _b : [];
           case "inline":
             return getInlinePageIds(node);
           default:
             return [];
         }
       }, getInlinePageIds = function(inline) {
-        var _a2, _b, _c, _d;
+        var _a3, _b, _c, _d;
         switch (inline.type) {
           case "link": {
-            const nodePageIds = (_b = (_a2 = inline.nodes) == null ? void 0 : _a2.flatMap(getNodePageIds)) != null ? _b : [];
+            const nodePageIds = (_b = (_a3 = inline.nodes) == null ? void 0 : _a3.flatMap(getNodePageIds)) != null ? _b : [];
             const dataPageIds = inline.data ? getLinkDataPageIds(inline.data) : [];
             return [...nodePageIds, ...dataPageIds];
           }
@@ -3245,14 +2754,14 @@ function getDocumentKeysSortedByDepth(state) {
     elements.set(key, getDocumentElements(state, key));
   });
   keys.sort((a, b) => {
-    var _a;
-    return ((_a = elements.get(a)) == null ? void 0 : _a.has(b)) ? -1 : 1;
+    var _a2;
+    return ((_a2 = elements.get(a)) == null ? void 0 : _a2.has(b)) ? -1 : 1;
   });
   return keys;
 }
 function getElement(state, documentKey, elementKey) {
-  var _a;
-  return (_a = getDocumentElements(state, documentKey).get(elementKey)) != null ? _a : null;
+  var _a2;
+  return (_a2 = getDocumentElements(state, documentKey).get(elementKey)) != null ? _a2 : null;
 }
 function getElementPropControllerDescriptors(state, documentKey, elementKey) {
   const element = getElement(state, documentKey, elementKey);
@@ -3338,5 +2847,5 @@ function configureStore({
     locales: getInitialState(locales != null ? locales : preloadedState == null ? void 0 : preloadedState.locales)
   }), applyMiddleware(thunk));
 }
-export { getBoxShadowsSwatchIds as $, ResponsiveLength as A, Backgrounds as B, ComponentIcon as C, Date as D, ElementID as E, Font as F, GapY as G, TextArea as H, Images as I, Table as J, TableFormFields as K, ListControlType as L, Margin as M, Number as N, Image as O, Padding as P, ResponsiveOpacity as Q, RichTextPropControllerMessageType as R, ShapeControlType as S, TableFormFieldsMessageType as T, NavigationLinks as U, SocialLinks as V, Width as W, RichText as X, Video as Y, getBorderSwatchIds as Z, isNonNullable as _, createDocumentReference as a, toSelectionDTO as a$, getResponsiveColorSwatchIds as a0, StyleControlProperty as a1, ImageControlValueFormat as a2, isPropControllersHandle as a3, StyleControlType as a4, RichTextV2ControlType as a5, RichTextControlType as a6, SlotControlType as a7, LinkControlType as a8, ImageControlType as a9, copyImageData as aA, Link$1 as aB, copyLinkData as aC, List$1 as aD, ListControlMessageType as aE, ListControl as aF, copyListData as aG, Select as aH, Shape$1 as aI, ShapeControlMessageType as aJ, ShapeControl as aK, copyShapeData as aL, Slot as aM, SlotControlMessageType as aN, SlotControl as aO, copySlotData as aP, mergeSlotData as aQ, Style as aR, StyleControlMessageType as aS, StyleControl as aT, copyStyleData as aU, ObjectType as aV, RichText$1 as aW, RichTextControlMessageType as aX, RichTextControl as aY, richTextDTOtoSelection as aZ, richTextDTOtoDAO as a_, ColorControlType as aa, SelectControlType as ab, getComponentPropControllerDescriptors as ac, getPropControllers as ad, BorderPropControllerFormat as ae, ShadowsPropControllerFormat as af, BorderRadiusPropControllerFormat as ag, MarginPropControllerFormat as ah, PaddingPropControllerFormat as ai, WidthPropControllerFormat as aj, configureStore as ak, copyElementTree as al, getBreakpoints as am, getDocument as an, getElementId as ao, getIsPreview as ap, getIsInBuilder as aq, getReactComponent as ar, getBuilderEditMode as as, getBackgroundsFileIds as at, getBackgroundsSwatchIds as au, Color as av, copyColorData as aw, copy as ax, merge as ay, Image$1 as az, isElementReference as b, richTextDAOToDTO as b0, RichTextV2Mode as b1, createRichTextV2Plugin as b2, unstable_RichTextV2 as b3, RichTextV2ControlMessageType as b4, RichTextV2Control as b5, BlockActions as b6, ListActions as b7, onKeyDown as b8, withBlock as b9, reducer$1 as bA, getInitialState$2 as bB, BlockPlugin as ba, RootBlockType as bb, BlockType as bc, InlineType as bd, BlockTextAlignment as be, ElementUtils as bf, getInitialState$7 as bg, reducer$8 as bh, getDocument$1 as bi, getComponentsMeta as bj, getComponentPropControllerDescriptors$1 as bk, getLocales as bl, BuilderEditMode as bm, getDocumentKeysSortedByDepth as bn, getPropController as bo, getPropControllersHandle as bp, getElement as bq, getElementPropControllerDescriptors as br, createPropController as bs, reducer$7 as bt, reducer$9 as bu, reducer$6 as bv, reducer$5 as bw, reducer$4 as bx, reducer$3 as by, reducer$2 as bz, createDocument as c, descriptors as d, getElementSwatchIds as e, getFileIds as f, getPropControllerDescriptors as g, getTypographyIds as h, introspection as i, getTableIds as j, getPageIds as k, getElementChildren as l, Types as m, ResponsiveIconRadioGroup as n, Border as o, BorderRadius as p, Shadows as q, GapX as r, ResponsiveSelect as s, ResponsiveNumber as t, Checkbox as u, Grid as v, TextInput as w, Link as x, ResponsiveColor as y, TextStyle as z };
+export { isNonNullable as $, ResponsiveLength as A, Backgrounds as B, ComponentIcon as C, Date as D, ElementID as E, Font as F, GapY as G, TextArea as H, Images as I, Table as J, TableFormFields as K, ListControlType as L, Margin as M, Number as N, Image$1 as O, Padding as P, ResponsiveOpacity as Q, RichTextPropControllerMessageType as R, ShapeControlType as S, TableFormFieldsMessageType as T, NavigationLinks as U, SocialLinks as V, Width as W, RichText$1 as X, Video as Y, useStyle as Z, getBorderSwatchIds as _, createDocumentReference as a, RichTextControlMessageType as a$, getBoxShadowsSwatchIds as a0, getResponsiveColorSwatchIds as a1, StyleControlProperty as a2, ImageControlValueFormat as a3, isPropControllersHandle as a4, StyleControlType as a5, RichTextV2ControlType as a6, RichTextControlType as a7, SlotControlType as a8, StyleV2ControlType as a9, Image as aA, copyImageData as aB, Link as aC, copyLinkData as aD, List as aE, ListControlMessageType as aF, ListControl as aG, copyListData as aH, Shape as aI, ShapeControlMessageType as aJ, ShapeControl as aK, copyShapeData as aL, Slot as aM, SlotControlMessageType as aN, SlotControl as aO, copySlotData as aP, mergeSlotData as aQ, Style as aR, StyleControlMessageType as aS, StyleControl as aT, copyStyleData as aU, unstable_useStyleV2ClassName as aV, unstable_StyleV2 as aW, StyleV2ControlMessageType as aX, StyleV2Control as aY, ObjectType as aZ, RichText as a_, LinkControlType as aa, ImageControlType as ab, ColorControlType as ac, getComponentPropControllerDescriptors as ad, getPropControllers as ae, BorderPropControllerFormat as af, ShadowsPropControllerFormat as ag, BorderRadiusPropControllerFormat as ah, MarginPropControllerFormat as ai, PaddingPropControllerFormat as aj, WidthPropControllerFormat as ak, configureStore as al, copyElementTree as am, getBreakpoints as an, getDocument as ao, getElementId as ap, getIsPreview as aq, getIsInBuilder as ar, getReactComponent as as, getBuilderEditMode as at, getBackgroundsFileIds as au, getBackgroundsSwatchIds as av, Color as aw, copyColorData as ax, copy as ay, merge as az, isElementReference as b, RichTextControl as b0, richTextDTOtoSelection as b1, richTextDTOtoDAO as b2, toSelectionDTO as b3, richTextDAOToDTO as b4, RichTextV2Mode as b5, createRichTextV2Plugin as b6, unstable_RichTextV2 as b7, RichTextV2ControlMessageType as b8, RichTextV2Control as b9, RootBlockType as ba, BlockType as bb, InlineType as bc, BlockTextAlignment as bd, getInitialState$7 as be, reducer$8 as bf, getDocument$1 as bg, getComponentsMeta as bh, getComponentPropControllerDescriptors$1 as bi, getLocales as bj, BuilderEditMode as bk, getDocumentKeysSortedByDepth as bl, getPropController as bm, getPropControllersHandle as bn, getElement as bo, getElementPropControllerDescriptors as bp, createPropController as bq, reducer$7 as br, reducer$9 as bs, reducer$6 as bt, reducer$5 as bu, reducer$4 as bv, reducer$3 as bw, reducer$2 as bx, reducer$1 as by, getInitialState$2 as bz, createDocument as c, descriptors as d, getElementSwatchIds as e, getFileIds as f, getPropControllerDescriptors as g, getTypographyIds as h, introspection as i, getTableIds as j, getPageIds as k, getElementChildren as l, Types as m, ResponsiveIconRadioGroup as n, Border as o, BorderRadius as p, Shadows as q, GapX as r, ResponsiveSelect as s, ResponsiveNumber as t, Checkbox as u, Grid as v, TextInput as w, Link$1 as x, ResponsiveColor as y, TextStyle as z };
 //# sourceMappingURL=react-page.es.js.map