easy-email-extensions 3.1.9 → 3.1.16

package/lib/index2.js

@@ -55,7 +55,7 @@ var __async = (__this, __arguments, generator) => {
 };
 import * as React from "react";
 import React__default, { Children, isValidElement, cloneElement, createContext, useContext, Component, useMemo, memo, forwardRef, useEffect, useRef, useLayoutEffect, useState, createRef, useImperativeHandle, PureComponent, useCallback, useReducer, Fragment, createElement, Suspense } from "react";
-import { IconFont, Stack as Stack$6, TextStyle, getBlockNodeByIdx, useBlock, getEditNode, getEditContent, useEditorProps, useFocusIdx, useEditorContext, getShadowRoot, FIXED_CONTAINER_ID, scrollBlockEleIntoView, useHoverIdx, useDataTransfer, getBlockNodeByChildEle, getDirectionPosition, DATA_ATTRIBUTE_DROP_CONTAINER, BlockAvatarWrapper, getEditorRoot, useActiveTab, ActiveTabKeys } from "easy-email-editor";
+import { IconFont, useEditorProps, Stack as Stack$6, getBlockNodeByIdx, useBlock, getEditNode, getEditContent, useFocusIdx, TextStyle, useEditorContext, getShadowRoot, FIXED_CONTAINER_ID, scrollBlockEleIntoView, useHoverIdx, useDataTransfer, getBlockNodeByChildEle, getDirectionPosition, DATA_ATTRIBUTE_DROP_CONTAINER, BlockAvatarWrapper, getEditorRoot, useActiveTab, ActiveTabKeys } from "easy-email-editor";
 import { BasicType, ImageManager, BlockManager, getParentIdx, createBlockDataByType, getParentByIdx, getValueByIdx, getIndexByIdx, getSiblingIdx, getNodeIdxFromClassName, getNodeIdxClassName, getPageIdx, getChildIdx, MjmlToJson, JsonToMjml, getNodeTypeFromClassName } from "easy-email-core";
 import ReactDOM, { findDOMNode, createPortal } from "react-dom";
 import { useField, Field, useForm as useForm$1, Form as Form$3, version as version$2, useFormState } from "react-final-form";
@@ -5497,8 +5497,8 @@ function EyeIcon$1({
     iconName: "icon-eye"
   });
 }
-function _extends$g() {
-  _extends$g = Object.assign || function(target2) {
+function _extends$f() {
+  _extends$f = Object.assign || function(target2) {
     for (var i2 = 1; i2 < arguments.length; i2++) {
       var source = arguments[i2];
       for (var key in source) {
@@ -5509,7 +5509,7 @@ function _extends$g() {
     }
     return target2;
   };
-  return _extends$g.apply(this, arguments);
+  return _extends$f.apply(this, arguments);
 }
 function _objectWithoutPropertiesLoose(source, excluded) {
   if (source == null)
@@ -5987,7 +5987,7 @@ var CSSTransition = /* @__PURE__ */ function(_React$Component) {
     var _this$props = this.props;
     _this$props.classNames;
     var props = _objectWithoutPropertiesLoose(_this$props, ["classNames"]);
-    return /* @__PURE__ */ React__default.createElement(Transition$1, _extends$g({}, props, {
+    return /* @__PURE__ */ React__default.createElement(Transition$1, _extends$f({}, props, {
       onEnter: this.onEnter,
       onEntered: this.onEntered,
       onEntering: this.onEntering,
@@ -6157,7 +6157,7 @@ var TransitionGroup = /* @__PURE__ */ function(_React$Component) {
     }
     if (this.mounted) {
       this.setState(function(state) {
-        var children = _extends$g({}, state.children);
+        var children = _extends$f({}, state.children);
         delete children[child.key];
         return {
           children
@@ -6328,21 +6328,7 @@ SwitchTransition.defaultProps = {
   mode: modes.out
 };
 var SwitchTransition$1 = SwitchTransition;
-function _extends$f() {
-  _extends$f = Object.assign || function(target2) {
-    for (var i2 = 1; i2 < arguments.length; i2++) {
-      var source = arguments[i2];
-      for (var key in source) {
-        if (Object.prototype.hasOwnProperty.call(source, key)) {
-          target2[key] = source[key];
-        }
-      }
-    }
-    return target2;
-  };
-  return _extends$f.apply(this, arguments);
-}
-function _defineProperty$3(obj, key, value) {
+function _defineProperty$2(obj, key, value) {
   if (key in obj) {
     Object.defineProperty(obj, key, {
       value,
@@ -6376,7 +6362,7 @@ function _objectSpread$x(target2) {
     var source = arguments[i2] != null ? arguments[i2] : {};
     if (i2 % 2) {
       ownKeys$x(Object(source), true).forEach(function(key) {
-        _defineProperty$3(target2, key, source[key]);
+        _defineProperty$2(target2, key, source[key]);
       });
     } else if (Object.getOwnPropertyDescriptors) {
       Object.defineProperties(target2, Object.getOwnPropertyDescriptors(source));
@@ -6440,7 +6426,7 @@ function _objectSpread$w(target2) {
     var source = arguments[i2] != null ? arguments[i2] : {};
     if (i2 % 2) {
       ownKeys$w(Object(source), true).forEach(function(key) {
-        _defineProperty$3(target2, key, source[key]);
+        _defineProperty$2(target2, key, source[key]);
       });
     } else if (Object.getOwnPropertyDescriptors) {
       Object.defineProperties(target2, Object.getOwnPropertyDescriptors(source));
@@ -6504,7 +6490,7 @@ function _objectSpread$v(target2) {
     var source = arguments[i2] != null ? arguments[i2] : {};
     if (i2 % 2) {
       ownKeys$v(Object(source), true).forEach(function(key) {
-        _defineProperty$3(target2, key, source[key]);
+        _defineProperty$2(target2, key, source[key]);
       });
     } else if (Object.getOwnPropertyDescriptors) {
       Object.defineProperties(target2, Object.getOwnPropertyDescriptors(source));
@@ -6568,7 +6554,7 @@ function _objectSpread$u(target2) {
     var source = arguments[i2] != null ? arguments[i2] : {};
     if (i2 % 2) {
       ownKeys$u(Object(source), true).forEach(function(key) {
-        _defineProperty$3(target2, key, source[key]);
+        _defineProperty$2(target2, key, source[key]);
       });
     } else if (Object.getOwnPropertyDescriptors) {
       Object.defineProperties(target2, Object.getOwnPropertyDescriptors(source));
@@ -6632,7 +6618,7 @@ function _objectSpread$t(target2) {
     var source = arguments[i2] != null ? arguments[i2] : {};
     if (i2 % 2) {
       ownKeys$t(Object(source), true).forEach(function(key) {
-        _defineProperty$3(target2, key, source[key]);
+        _defineProperty$2(target2, key, source[key]);
       });
     } else if (Object.getOwnPropertyDescriptors) {
       Object.defineProperties(target2, Object.getOwnPropertyDescriptors(source));
@@ -7144,7 +7130,7 @@ function _objectSpread$s(target2) {
     var source = arguments[i2] != null ? arguments[i2] : {};
     if (i2 % 2) {
       ownKeys$s(Object(source), true).forEach(function(key) {
-        _defineProperty$3(target2, key, source[key]);
+        _defineProperty$2(target2, key, source[key]);
       });
     } else if (Object.getOwnPropertyDescriptors) {
       Object.defineProperties(target2, Object.getOwnPropertyDescriptors(source));
@@ -7635,7 +7621,7 @@ function _objectSpread$r(target2) {
     var source = arguments[i2] != null ? arguments[i2] : {};
     if (i2 % 2) {
       ownKeys$r(Object(source), true).forEach(function(key) {
-        _defineProperty$3(target2, key, source[key]);
+        _defineProperty$2(target2, key, source[key]);
       });
     } else if (Object.getOwnPropertyDescriptors) {
       Object.defineProperties(target2, Object.getOwnPropertyDescriptors(source));
@@ -9263,7 +9249,7 @@ function _objectSpread$q(target2) {
     var source = arguments[i2] != null ? arguments[i2] : {};
     if (i2 % 2) {
       ownKeys$q(Object(source), true).forEach(function(key) {
-        _defineProperty$3(target2, key, source[key]);
+        _defineProperty$2(target2, key, source[key]);
       });
     } else if (Object.getOwnPropertyDescriptors) {
       Object.defineProperties(target2, Object.getOwnPropertyDescriptors(source));
@@ -9706,7 +9692,7 @@ function _objectSpread$p(target2) {
     var source = arguments[i2] != null ? arguments[i2] : {};
     if (i2 % 2) {
       ownKeys$p(Object(source), true).forEach(function(key) {
-        _defineProperty$3(target2, key, source[key]);
+        _defineProperty$2(target2, key, source[key]);
       });
     } else if (Object.getOwnPropertyDescriptors) {
       Object.defineProperties(target2, Object.getOwnPropertyDescriptors(source));
@@ -9769,7 +9755,7 @@ function _objectSpread$o(target2) {
     var source = arguments[i2] != null ? arguments[i2] : {};
     if (i2 % 2) {
       ownKeys$o(Object(source), true).forEach(function(key) {
-        _defineProperty$3(target2, key, source[key]);
+        _defineProperty$2(target2, key, source[key]);
       });
     } else if (Object.getOwnPropertyDescriptors) {
       Object.defineProperties(target2, Object.getOwnPropertyDescriptors(source));
@@ -11655,7 +11641,7 @@ function _objectSpread$n(target2) {
     var source = arguments[i2] != null ? arguments[i2] : {};
     if (i2 % 2) {
       ownKeys$n(Object(source), true).forEach(function(key) {
-        _defineProperty$3(target2, key, source[key]);
+        _defineProperty$2(target2, key, source[key]);
       });
     } else if (Object.getOwnPropertyDescriptors) {
       Object.defineProperties(target2, Object.getOwnPropertyDescriptors(source));
@@ -11715,7 +11701,7 @@ function _objectSpread$m(target2) {
     var source = arguments[i2] != null ? arguments[i2] : {};
     if (i2 % 2) {
       ownKeys$m(Object(source), true).forEach(function(key) {
-        _defineProperty$3(target2, key, source[key]);
+        _defineProperty$2(target2, key, source[key]);
       });
     } else if (Object.getOwnPropertyDescriptors) {
       Object.defineProperties(target2, Object.getOwnPropertyDescriptors(source));
@@ -14436,7 +14422,7 @@ function _objectSpread$l(target2) {
     var source = arguments[i2] != null ? arguments[i2] : {};
     if (i2 % 2) {
       ownKeys$l(Object(source), true).forEach(function(key) {
-        _defineProperty$3(target2, key, source[key]);
+        _defineProperty$2(target2, key, source[key]);
       });
     } else if (Object.getOwnPropertyDescriptors) {
       Object.defineProperties(target2, Object.getOwnPropertyDescriptors(source));
@@ -15161,7 +15147,7 @@ function _objectSpread$k(target2) {
     var source = arguments[i2] != null ? arguments[i2] : {};
     if (i2 % 2) {
       ownKeys$k(Object(source), true).forEach(function(key) {
-        _defineProperty$3(target2, key, source[key]);
+        _defineProperty$2(target2, key, source[key]);
       });
     } else if (Object.getOwnPropertyDescriptors) {
       Object.defineProperties(target2, Object.getOwnPropertyDescriptors(source));
@@ -15475,7 +15461,7 @@ function _objectSpread$j(target2) {
     var source = arguments[i2] != null ? arguments[i2] : {};
     if (i2 % 2) {
       ownKeys$j(Object(source), true).forEach(function(key) {
-        _defineProperty$3(target2, key, source[key]);
+        _defineProperty$2(target2, key, source[key]);
       });
     } else if (Object.getOwnPropertyDescriptors) {
       Object.defineProperties(target2, Object.getOwnPropertyDescriptors(source));
@@ -15535,7 +15521,7 @@ function _objectSpread$i(target2) {
     var source = arguments[i2] != null ? arguments[i2] : {};
     if (i2 % 2) {
       ownKeys$i(Object(source), true).forEach(function(key) {
-        _defineProperty$3(target2, key, source[key]);
+        _defineProperty$2(target2, key, source[key]);
       });
     } else if (Object.getOwnPropertyDescriptors) {
       Object.defineProperties(target2, Object.getOwnPropertyDescriptors(source));
@@ -15599,7 +15585,7 @@ function _objectSpread$h(target2) {
     var source = arguments[i2] != null ? arguments[i2] : {};
     if (i2 % 2) {
       ownKeys$h(Object(source), true).forEach(function(key) {
-        _defineProperty$3(target2, key, source[key]);
+        _defineProperty$2(target2, key, source[key]);
       });
     } else if (Object.getOwnPropertyDescriptors) {
       Object.defineProperties(target2, Object.getOwnPropertyDescriptors(source));
@@ -16362,7 +16348,7 @@ function _objectSpread$g(target2) {
     var source = arguments[i2] != null ? arguments[i2] : {};
     if (i2 % 2) {
       ownKeys$g(Object(source), true).forEach(function(key) {
-        _defineProperty$3(target2, key, source[key]);
+        _defineProperty$2(target2, key, source[key]);
       });
     } else if (Object.getOwnPropertyDescriptors) {
       Object.defineProperties(target2, Object.getOwnPropertyDescriptors(source));
@@ -16422,7 +16408,7 @@ function _objectSpread$f(target2) {
     var source = arguments[i2] != null ? arguments[i2] : {};
     if (i2 % 2) {
       ownKeys$f(Object(source), true).forEach(function(key) {
-        _defineProperty$3(target2, key, source[key]);
+        _defineProperty$2(target2, key, source[key]);
       });
     } else if (Object.getOwnPropertyDescriptors) {
       Object.defineProperties(target2, Object.getOwnPropertyDescriptors(source));
@@ -16710,8 +16696,8 @@ var defineProperty$4 = function() {
   } catch (e) {
   }
 }();
-var _defineProperty$2 = defineProperty$4;
-var defineProperty$3 = _defineProperty$2;
+var _defineProperty$1 = defineProperty$4;
+var defineProperty$3 = _defineProperty$1;
 function baseAssignValue$4(object, key, value) {
   if (key == "__proto__" && defineProperty$3) {
     defineProperty$3(object, key, {
@@ -17144,7 +17130,7 @@ function constant$2(value) {
   };
 }
 var constant_1 = constant$2;
-var constant$1 = constant_1, defineProperty$2 = _defineProperty$2, identity$4 = identity_1;
+var constant$1 = constant_1, defineProperty$2 = _defineProperty$1, identity$4 = identity_1;
 var baseSetToString$3 = !defineProperty$2 ? identity$4 : function(func, string) {
   return defineProperty$2(func, "toString", {
     "configurable": true,
@@ -18070,7 +18056,7 @@ function _objectSpread$e(target2) {
     var source = arguments[i2] != null ? arguments[i2] : {};
     if (i2 % 2) {
       ownKeys$e(Object(source), true).forEach(function(key) {
-        _defineProperty$3(target2, key, source[key]);
+        _defineProperty$2(target2, key, source[key]);
       });
     } else if (Object.getOwnPropertyDescriptors) {
       Object.defineProperties(target2, Object.getOwnPropertyDescriptors(source));
@@ -18130,7 +18116,7 @@ function _objectSpread$d(target2) {
     var source = arguments[i2] != null ? arguments[i2] : {};
     if (i2 % 2) {
       ownKeys$d(Object(source), true).forEach(function(key) {
-        _defineProperty$3(target2, key, source[key]);
+        _defineProperty$2(target2, key, source[key]);
       });
     } else if (Object.getOwnPropertyDescriptors) {
       Object.defineProperties(target2, Object.getOwnPropertyDescriptors(source));
@@ -18387,7 +18373,7 @@ function _objectSpread$c(target2) {
     var source = arguments[i2] != null ? arguments[i2] : {};
     if (i2 % 2) {
       ownKeys$c(Object(source), true).forEach(function(key) {
-        _defineProperty$3(target2, key, source[key]);
+        _defineProperty$2(target2, key, source[key]);
       });
     } else if (Object.getOwnPropertyDescriptors) {
       Object.defineProperties(target2, Object.getOwnPropertyDescriptors(source));
@@ -18912,7 +18898,7 @@ function _objectSpread$b(target2) {
     var source = arguments[i2] != null ? arguments[i2] : {};
     if (i2 % 2) {
       ownKeys$b(Object(source), true).forEach(function(key) {
-        _defineProperty$3(target2, key, source[key]);
+        _defineProperty$2(target2, key, source[key]);
       });
     } else if (Object.getOwnPropertyDescriptors) {
       Object.defineProperties(target2, Object.getOwnPropertyDescriptors(source));
@@ -18974,7 +18960,7 @@ function _objectSpread$a(target2) {
     var source = arguments[i2] != null ? arguments[i2] : {};
     if (i2 % 2) {
       ownKeys$a(Object(source), true).forEach(function(key) {
-        _defineProperty$3(target2, key, source[key]);
+        _defineProperty$2(target2, key, source[key]);
       });
     } else if (Object.getOwnPropertyDescriptors) {
       Object.defineProperties(target2, Object.getOwnPropertyDescriptors(source));
@@ -19208,7 +19194,7 @@ function _objectSpread$9(target2) {
     var source = arguments[i2] != null ? arguments[i2] : {};
     if (i2 % 2) {
       ownKeys$9(Object(source), true).forEach(function(key) {
-        _defineProperty$3(target2, key, source[key]);
+        _defineProperty$2(target2, key, source[key]);
       });
     } else if (Object.getOwnPropertyDescriptors) {
       Object.defineProperties(target2, Object.getOwnPropertyDescriptors(source));
@@ -19268,7 +19254,7 @@ function _objectSpread$8(target2) {
     var source = arguments[i2] != null ? arguments[i2] : {};
     if (i2 % 2) {
       ownKeys$8(Object(source), true).forEach(function(key) {
-        _defineProperty$3(target2, key, source[key]);
+        _defineProperty$2(target2, key, source[key]);
       });
     } else if (Object.getOwnPropertyDescriptors) {
       Object.defineProperties(target2, Object.getOwnPropertyDescriptors(source));
@@ -19359,7 +19345,7 @@ function _objectSpread$7(target2) {
     var source = arguments[i2] != null ? arguments[i2] : {};
     if (i2 % 2) {
       ownKeys$7(Object(source), true).forEach(function(key) {
-        _defineProperty$3(target2, key, source[key]);
+        _defineProperty$2(target2, key, source[key]);
       });
     } else if (Object.getOwnPropertyDescriptors) {
       Object.defineProperties(target2, Object.getOwnPropertyDescriptors(source));
@@ -21698,7 +21684,7 @@ var FocusLock$1 = /* @__PURE__ */ React.forwardRef(function FocusLockUI2(props,
       setObserved(newObserved);
     }
   }, []);
-  var lockProps = _extends$g((_extends2 = {}, _extends2[FOCUS_DISABLED] = disabled && "disabled", _extends2[FOCUS_GROUP] = group, _extends2), containerProps);
+  var lockProps = _extends$f((_extends2 = {}, _extends2[FOCUS_DISABLED] = disabled && "disabled", _extends2[FOCUS_GROUP] = group, _extends2), containerProps);
   var hasLeadingGuards = noFocusGuards !== true;
   var hasTailingGuards = hasLeadingGuards && noFocusGuards !== "tail";
   var mergedRef = useMergeRefs([parentRef, setObserveNode]);
@@ -21728,7 +21714,7 @@ var FocusLock$1 = /* @__PURE__ */ React.forwardRef(function FocusLockUI2(props,
     onActivation,
     onDeactivation,
     returnFocus
-  }), /* @__PURE__ */ React.createElement(Container, _extends$g({
+  }), /* @__PURE__ */ React.createElement(Container, _extends$f({
     ref: mergedRef
   }, lockProps, {
     className,
@@ -21760,19 +21746,6 @@ FocusLock$1.defaultProps = {
   onDeactivation: void 0
 };
 var FocusLockUI = FocusLock$1;
-function _defineProperty$1(obj, key, value) {
-  if (key in obj) {
-    Object.defineProperty(obj, key, {
-      value,
-      enumerable: true,
-      configurable: true,
-      writable: true
-    });
-  } else {
-    obj[key] = value;
-  }
-  return obj;
-}
 function withSideEffect(reducePropsToState2, handleStateChangeOnClient2) {
   function getDisplayName(WrappedComponent) {
     return WrappedComponent.displayName || WrappedComponent.name || "Component";
@@ -21812,7 +21785,7 @@ function withSideEffect(reducePropsToState2, handleStateChangeOnClient2) {
       };
       return SideEffect2;
     }(PureComponent);
-    _defineProperty$1(SideEffect, "displayName", "SideEffect(" + getDisplayName(WrappedComponent) + ")");
+    _defineProperty$2(SideEffect, "displayName", "SideEffect(" + getDisplayName(WrappedComponent) + ")");
     return SideEffect;
   };
 }
@@ -22412,7 +22385,7 @@ mediumEffect.assignMedium(function(cb) {
 });
 var FocusTrap = withSideEffect(reducePropsToState, handleStateChangeOnClient)(FocusWatcher);
 var FocusLockCombination = /* @__PURE__ */ React.forwardRef(function FocusLockUICombination(props, ref) {
-  return /* @__PURE__ */ React.createElement(FocusLockUI, _extends$g({
+  return /* @__PURE__ */ React.createElement(FocusLockUI, _extends$f({
     sideCar: FocusTrap,
     ref
   }, props));
@@ -25919,7 +25892,7 @@ function _objectSpread$6(target2) {
     var source = arguments[i2] != null ? arguments[i2] : {};
     if (i2 % 2) {
       ownKeys$6(Object(source), true).forEach(function(key) {
-        _defineProperty$3(target2, key, source[key]);
+        _defineProperty$2(target2, key, source[key]);
       });
     } else if (Object.getOwnPropertyDescriptors) {
       Object.defineProperties(target2, Object.getOwnPropertyDescriptors(source));
@@ -25979,7 +25952,7 @@ function _objectSpread$5(target2) {
     var source = arguments[i2] != null ? arguments[i2] : {};
     if (i2 % 2) {
       ownKeys$5(Object(source), true).forEach(function(key) {
-        _defineProperty$3(target2, key, source[key]);
+        _defineProperty$2(target2, key, source[key]);
       });
     } else if (Object.getOwnPropertyDescriptors) {
       Object.defineProperties(target2, Object.getOwnPropertyDescriptors(source));
@@ -27634,7 +27607,7 @@ function _objectSpread$4(target2) {
     var source = arguments[i2] != null ? arguments[i2] : {};
     if (i2 % 2) {
       ownKeys$4(Object(source), true).forEach(function(key) {
-        _defineProperty$3(target2, key, source[key]);
+        _defineProperty$2(target2, key, source[key]);
       });
     } else if (Object.getOwnPropertyDescriptors) {
       Object.defineProperties(target2, Object.getOwnPropertyDescriptors(source));
@@ -28438,7 +28411,7 @@ function _objectSpread$3(target2) {
     var source = arguments[i2] != null ? arguments[i2] : {};
     if (i2 % 2) {
       ownKeys$3(Object(source), true).forEach(function(key) {
-        _defineProperty$3(target2, key, source[key]);
+        _defineProperty$2(target2, key, source[key]);
       });
     } else if (Object.getOwnPropertyDescriptors) {
       Object.defineProperties(target2, Object.getOwnPropertyDescriptors(source));
@@ -28498,7 +28471,7 @@ function _objectSpread$2(target2) {
     var source = arguments[i2] != null ? arguments[i2] : {};
     if (i2 % 2) {
       ownKeys$2(Object(source), true).forEach(function(key) {
-        _defineProperty$3(target2, key, source[key]);
+        _defineProperty$2(target2, key, source[key]);
       });
     } else if (Object.getOwnPropertyDescriptors) {
       Object.defineProperties(target2, Object.getOwnPropertyDescriptors(source));
@@ -30709,7 +30682,7 @@ function _objectSpread$1(target2) {
     var source = arguments[i2] != null ? arguments[i2] : {};
     if (i2 % 2) {
       ownKeys$1(Object(source), true).forEach(function(key) {
-        _defineProperty$3(target2, key, source[key]);
+        _defineProperty$2(target2, key, source[key]);
       });
     } else if (Object.getOwnPropertyDescriptors) {
       Object.defineProperties(target2, Object.getOwnPropertyDescriptors(source));
@@ -31072,7 +31045,7 @@ function _objectSpread(target2) {
     var source = arguments[i2] != null ? arguments[i2] : {};
     if (i2 % 2) {
       ownKeys(Object(source), true).forEach(function(key) {
-        _defineProperty$3(target2, key, source[key]);
+        _defineProperty$2(target2, key, source[key]);
       });
     } else if (Object.getOwnPropertyDescriptors) {
       Object.defineProperties(target2, Object.getOwnPropertyDescriptors(source));
@@ -31309,6 +31282,7 @@ function getImg$1(name) {
   return ImageManager.get(name);
 }
 function ImageUploader(props) {
+  const { mergeTags: mergeTags2 } = useEditorProps();
   const [isUploading, setIsUploading] = useState(false);
   const [preview, setPreview] = useState(false);
   const uploadHandlerRef = useRef(props.uploadHandler);
@@ -31408,12 +31382,25 @@ function ImageUploader(props) {
     className: styles$4.wrap
   }, /* @__PURE__ */ React__default.createElement("div", {
     className: styles$4["container"]
-  }, content, /* @__PURE__ */ React__default.createElement(Input$5, {
+  }, content, /* @__PURE__ */ React__default.createElement(Grid.Row, {
+    style: { width: "100%" }
+  }, mergeTags2 && /* @__PURE__ */ React__default.createElement(Popover$1, {
+    trigger: "click",
+    content: /* @__PURE__ */ React__default.createElement(MergeTags, {
+      value: props.value,
+      onChange
+    })
+  }, /* @__PURE__ */ React__default.createElement(Button$4, {
+    icon: /* @__PURE__ */ React__default.createElement(IconFont, {
+      iconName: "icon-merge-tags"
+    })
+  })), /* @__PURE__ */ React__default.createElement(Input$5, {
+    style: { flex: 1 },
     onPaste,
     value: props.value,
     onChange,
     disabled: isUploading
-  })), /* @__PURE__ */ React__default.createElement(Modal$1, {
+  }))), /* @__PURE__ */ React__default.createElement(Modal$1, {
     visible: preview,
     footer: null,
     onCancel: () => setPreview(false)
@@ -38428,6 +38415,7 @@ var styles$3 = {
   inputWithUnitSelectOption
 };
 let primaryId = 0;
+const parse = (v) => v;
 function enhancer(Component2, changeAdapter) {
   return (props) => {
     const _a = props, {
@@ -38464,7 +38452,8 @@ function enhancer(Component2, changeAdapter) {
     const {
       input: { value, onChange }
     } = useField(name, {
-      validate: validate3
+      validate: validate3,
+      parse: (v) => v
     });
     const [currentValue, setCurrentValue] = useState(value);
     const debounceCallbackChange = useCallback(lodash.exports.debounce((val) => {
@@ -38480,7 +38469,8 @@ function enhancer(Component2, changeAdapter) {
     }, []);
     return /* @__PURE__ */ React__default.createElement(Field, {
       name,
-      validate: validate3
+      validate: validate3,
+      parse
     }, ({ input: { onBlur: onBlur3 }, meta: { touched, error: error2 } }) => {
       const onFieldChange = useCallback((e) => {
         const newVal = onChangeAdapter ? onChangeAdapter(changeAdapter(e)) : changeAdapter(e);
@@ -38532,12 +38522,13 @@ function enhancer(Component2, changeAdapter) {
         style: { textAlign: wrapperStyle.textAlign }
       }, /* @__PURE__ */ React__default.createElement("label", {
         className: labelHidden2 ? styles$3["label-hidden"] : void 0,
+        style: { width: "100%", display: "flex" },
         htmlFor: id
-      }, /* @__PURE__ */ React__default.createElement(Space$1, null, required && /* @__PURE__ */ React__default.createElement("span", {
+      }, required && /* @__PURE__ */ React__default.createElement("span", {
         style: { color: "#ff4d4f", marginRight: 4 }
-      }, "*", " "), /* @__PURE__ */ React__default.createElement(TextStyle, {
-        size: size === "small" ? "smallest" : "small"
-      }, label)))), /* @__PURE__ */ React__default.createElement(Grid.Col, {
+      }, "*", " "), /* @__PURE__ */ React__default.createElement("div", {
+        style: { flex: 1 }
+      }, " ", label))), /* @__PURE__ */ React__default.createElement(Grid.Col, {
         style: {
           textAlign: "left"
         },
@@ -38980,13 +38971,13 @@ var version$1 = "4.20.4";
 function renderComponent(props, name) {
   var render3 = props.render, children = props.children, component = props.component, rest = _objectWithoutPropertiesLoose(props, ["render", "children", "component"]);
   if (component) {
-    return /* @__PURE__ */ createElement(component, _extends$g({}, rest, {
+    return /* @__PURE__ */ createElement(component, _extends$f({}, rest, {
       children,
       render: render3
     }));
   }
   if (render3) {
-    return render3(children === void 0 ? rest : _extends$g({}, rest, {
+    return render3(children === void 0 ? rest : _extends$f({}, rest, {
       children
     }));
   }
@@ -39045,7 +39036,7 @@ var useFieldArray = function useFieldArray2(name, _temp) {
     };
   });
   var _useField = useField(name, {
-    subscription: _extends$g({}, subscription, {
+    subscription: _extends$f({}, subscription, {
       length: true
     }),
     defaultValue,
@@ -39071,7 +39062,7 @@ var useFieldArray = function useFieldArray2(name, _temp) {
     return results;
   };
   return {
-    fields: _extends$g({
+    fields: _extends$f({
       name,
       forEach: forEach2,
       length: length || 0,
@@ -39097,9 +39088,9 @@ var FieldArray = function FieldArray2(_ref2) {
     isEqual: isEqual2,
     validate: validate3
   }), fields = _useFieldArray.fields, meta = _useFieldArray.meta;
-  return renderComponent(_extends$g({
+  return renderComponent(_extends$f({
     fields,
-    meta: _extends$g({}, meta, {
+    meta: _extends$f({}, meta, {
       __versions: versions
     })
   }, rest), "FieldArray(" + name + ")");
@@ -39233,11 +39224,11 @@ const MergeTags = React__default.memo((props) => {
   const onSelect = useCallback((value) => {
     return props.onChange(value);
   }, [props]);
-  const mergeTagContent = useMemo(() => renderMergeTagContent({
+  const mergeTagContent = useMemo(() => renderMergeTagContent ? renderMergeTagContent({
     onChange: props.onChange,
     isSelect: props.isSelect,
     value: props.value
-  }), [renderMergeTagContent, props.onChange, props.isSelect, props.value]);
+  }) : /* @__PURE__ */ React__default.createElement(React__default.Fragment, null), [renderMergeTagContent, props.onChange, props.isSelect, props.value]);
   if (renderMergeTagContent) {
     return mergeTagContent;
   }
@@ -40155,84 +40146,158 @@ function Group() {
     span: 11
   })))));
 }
-function Button() {
+const options$5 = [
+  {
+    value: "left",
+    label: "Left"
+  },
+  {
+    value: "center",
+    label: "Center"
+  },
+  {
+    value: "right",
+    label: "Right"
+  }
+];
+function TextAlign() {
   const { focusIdx: focusIdx2 } = useFocusIdx();
-  return /* @__PURE__ */ React__default.createElement(AttributesPanelWrapper, null, /* @__PURE__ */ React__default.createElement(Collapse$1, {
-    defaultActiveKey: ["-1", "0", "1", "2", "3"]
-  }, /* @__PURE__ */ React__default.createElement(Collapse$1.Item, {
-    name: "-1",
-    header: "Setting"
-  }, /* @__PURE__ */ React__default.createElement(Space$1, {
-    direction: "vertical"
-  }, /* @__PURE__ */ React__default.createElement(TextField, {
-    label: "Content",
-    name: `${focusIdx2}.data.value.content`
-  }), /* @__PURE__ */ React__default.createElement(Link, null))), /* @__PURE__ */ React__default.createElement(Collapse$1.Item, {
-    name: "0",
-    header: "Dimension"
-  }, /* @__PURE__ */ React__default.createElement(Space$1, {
-    direction: "vertical"
-  }, /* @__PURE__ */ React__default.createElement(Grid.Row, null, /* @__PURE__ */ React__default.createElement(Grid.Col, {
-    span: 11
-  }, /* @__PURE__ */ React__default.createElement(Width, null)), /* @__PURE__ */ React__default.createElement(Grid.Col, {
-    offset: 1,
-    span: 11
-  }, /* @__PURE__ */ React__default.createElement(FontWeight, null))), /* @__PURE__ */ React__default.createElement(Padding, {
-    title: "Padding",
-    attributeName: "padding"
-  }), /* @__PURE__ */ React__default.createElement(Padding, {
-    title: "Inner padding",
-    attributeName: "inner-padding"
-  }))), /* @__PURE__ */ React__default.createElement(Collapse$1.Item, {
-    name: "1",
-    header: "Color"
-  }, /* @__PURE__ */ React__default.createElement(Space$1, {
-    direction: "vertical"
-  }, /* @__PURE__ */ React__default.createElement(Grid.Row, null, /* @__PURE__ */ React__default.createElement(Grid.Col, {
-    span: 11
-  }, /* @__PURE__ */ React__default.createElement(Color, {
-    title: "Text color"
-  })), /* @__PURE__ */ React__default.createElement(Grid.Col, {
-    offset: 1,
-    span: 11
-  }, /* @__PURE__ */ React__default.createElement(BackgroundColor, {
-    title: "Button color"
-  })), /* @__PURE__ */ React__default.createElement(Grid.Col, {
-    span: 11
-  }, /* @__PURE__ */ React__default.createElement(ContainerBackgroundColor, {
-    title: "Background color"
-  }))))), /* @__PURE__ */ React__default.createElement(Collapse$1.Item, {
-    name: "2",
-    header: "Typography"
-  }, /* @__PURE__ */ React__default.createElement(Space$1, {
-    direction: "vertical"
-  }, /* @__PURE__ */ React__default.createElement(Grid.Row, null, /* @__PURE__ */ React__default.createElement(Grid.Col, {
-    span: 11
-  }, /* @__PURE__ */ React__default.createElement(FontFamily, null)), /* @__PURE__ */ React__default.createElement(Grid.Col, {
-    offset: 1,
-    span: 11
-  }, /* @__PURE__ */ React__default.createElement(FontSize, null))), /* @__PURE__ */ React__default.createElement(Grid.Row, null, /* @__PURE__ */ React__default.createElement(Grid.Col, {
-    span: 11
-  }, /* @__PURE__ */ React__default.createElement(FontWeight, null)), /* @__PURE__ */ React__default.createElement(Grid.Col, {
-    offset: 1,
-    span: 11
-  }, /* @__PURE__ */ React__default.createElement(LineHeight, null))), /* @__PURE__ */ React__default.createElement(Grid.Row, null, /* @__PURE__ */ React__default.createElement(Grid.Col, {
-    span: 11
-  }, /* @__PURE__ */ React__default.createElement(TextDecoration, null)), /* @__PURE__ */ React__default.createElement(Grid.Col, {
-    offset: 1,
-    span: 11
-  }, /* @__PURE__ */ React__default.createElement(LetterSpacing, null))), /* @__PURE__ */ React__default.createElement(Align, null), /* @__PURE__ */ React__default.createElement(FontStyle, null))), /* @__PURE__ */ React__default.createElement(Collapse$1.Item, {
-    name: "3",
-    header: "Border"
-  }, /* @__PURE__ */ React__default.createElement(Border, null))));
+  return useMemo(() => {
+    return /* @__PURE__ */ React__default.createElement(Stack$6, null, /* @__PURE__ */ React__default.createElement(RadioGroupField, {
+      label: "Text align",
+      name: `${focusIdx2}.attributes.text-align`,
+      options: options$5
+    }));
+  }, [focusIdx2]);
 }
-function BorderWidth() {
+function Decoration() {
   const { focusIdx: focusIdx2 } = useFocusIdx();
   return useMemo(() => {
-    return /* @__PURE__ */ React__default.createElement(TextField, {
-      label: "Width",
+    return /* @__PURE__ */ React__default.createElement(Stack$6, {
+      key: focusIdx2,
+      vertical: true,
+      spacing: "extraTight"
+    }, /* @__PURE__ */ React__default.createElement(TextStyle, {
+      variation: "strong",
+      size: "large"
+    }, "Decoration"), /* @__PURE__ */ React__default.createElement(TextField, {
+      label: "Border radius",
+      name: `${focusIdx2}.attributes.borderRadius`,
+      inline: true
+    }), /* @__PURE__ */ React__default.createElement(TextField, {
+      label: "Border",
+      name: `${focusIdx2}.attributes.border`,
+      inline: true,
+      alignment: "center"
+    }), /* @__PURE__ */ React__default.createElement(NumberField, {
+      label: "Opacity",
+      max: 1,
+      min: 0,
+      step: 0.1,
+      name: `${focusIdx2}.attributes.opacity`,
+      inline: true,
+      alignment: "center"
+    }));
+  }, [focusIdx2]);
+}
+const options$4 = [
+  {
+    value: "",
+    label: "none"
+  },
+  {
+    value: "uppercase",
+    label: "uppercase"
+  },
+  {
+    value: "lowercase",
+    label: "lowercase"
+  },
+  {
+    value: "capitalize",
+    label: "capitalize"
+  }
+];
+function TextTransform() {
+  const { focusIdx: focusIdx2 } = useFocusIdx();
+  return useMemo(() => {
+    return /* @__PURE__ */ React__default.createElement(SelectField, {
+      label: "Text transform",
+      name: `${focusIdx2}.attributes.text-transform`,
+      options: options$4
+    });
+  }, [focusIdx2]);
+}
+const options$3 = [
+  {
+    value: "ltr",
+    label: "ltr"
+  },
+  {
+    value: "rtl",
+    label: "rtl"
+  }
+];
+function Direction() {
+  const { focusIdx: focusIdx2 } = useFocusIdx();
+  return useMemo(() => {
+    return /* @__PURE__ */ React__default.createElement(Stack$6, null, /* @__PURE__ */ React__default.createElement(RadioGroupField, {
+      label: "Direction",
+      name: `${focusIdx2}.attributes.direction`,
+      options: options$3,
+      inline: true
+    }));
+  }, [focusIdx2]);
+}
+function Margin() {
+  const { focusIdx: focusIdx2 } = useFocusIdx();
+  return useMemo(() => {
+    return /* @__PURE__ */ React__default.createElement(Stack$6, {
+      vertical: true,
+      spacing: "extraTight"
+    }, /* @__PURE__ */ React__default.createElement(TextStyle, {
+      size: "large"
+    }, "Margin"), /* @__PURE__ */ React__default.createElement(Stack$6, {
+      wrap: false
+    }, /* @__PURE__ */ React__default.createElement(Stack$6.Item, {
+      fill: true
+    }, /* @__PURE__ */ React__default.createElement(TextField, {
+      label: "Top",
       quickchange: true,
-      name: `${focusIdx2}.attributes.border-width`
+      name: `${focusIdx2}.attributes.marginTop`,
+      inline: true
+    })), /* @__PURE__ */ React__default.createElement(Stack$6.Item, {
+      fill: true
+    }, /* @__PURE__ */ React__default.createElement(TextField, {
+      label: "Bottom",
+      quickchange: true,
+      name: `${focusIdx2}.attributes.marginBottom`,
+      inline: true
+    }))), /* @__PURE__ */ React__default.createElement(Stack$6, {
+      wrap: false
+    }, /* @__PURE__ */ React__default.createElement(Stack$6.Item, {
+      fill: true
+    }, /* @__PURE__ */ React__default.createElement(TextField, {
+      label: "Left",
+      quickchange: true,
+      name: `${focusIdx2}.attributes.marginLeft`,
+      inline: true
+    })), /* @__PURE__ */ React__default.createElement(Stack$6.Item, {
+      fill: true
+    }, /* @__PURE__ */ React__default.createElement(TextField, {
+      label: "Right",
+      quickchange: true,
+      name: `${focusIdx2}.attributes.marginRight`,
+      inline: true
+    }))));
+  }, [focusIdx2]);
+}
+function BorderColor() {
+  const { focusIdx: focusIdx2 } = useFocusIdx();
+  return useMemo(() => {
+    return /* @__PURE__ */ React__default.createElement(ColorPickerField, {
+      label: "Color",
+      name: `${focusIdx2}.attributes.border-color`
     });
   }, [focusIdx2]);
 }
@@ -40280,15 +40345,170 @@ function BorderStyle() {
     });
   }, [focusIdx2]);
 }
-function BorderColor() {
+function NavbarLinkPadding({ name }) {
+  const { values: values2 } = useBlock();
+  const getVal = useCallback((index2) => {
+    return () => {
+      var _a;
+      return ((_a = lodash.exports.get(values2, name)) == null ? void 0 : _a.split(" ")[index2]) || "";
+    };
+  }, [name, values2]);
+  const setVal = useCallback((index2) => {
+    return (newVal) => {
+      if (newVal === "") {
+        newVal = "0px";
+      }
+      const vals = [
+        getVal(0)(),
+        getVal(1)(),
+        getVal(2)(),
+        getVal(3)()
+      ];
+      vals[index2] = newVal;
+      return vals.join(" ");
+    };
+  }, [getVal]);
+  return useMemo(() => {
+    return /* @__PURE__ */ React__default.createElement(Stack$6, {
+      vertical: true,
+      spacing: "extraTight"
+    }, /* @__PURE__ */ React__default.createElement(TextStyle, {
+      variation: "strong"
+    }, "Padding"), /* @__PURE__ */ React__default.createElement(Stack$6, {
+      wrap: false
+    }, /* @__PURE__ */ React__default.createElement(Stack$6.Item, {
+      fill: true
+    }, /* @__PURE__ */ React__default.createElement(TextField, {
+      label: /* @__PURE__ */ React__default.createElement("span", null, "Top"),
+      quickchange: true,
+      name,
+      valueAdapter: getVal(0),
+      onChangeAdapter: setVal(0)
+    })), /* @__PURE__ */ React__default.createElement(Stack$6.Item, {
+      fill: true
+    }, /* @__PURE__ */ React__default.createElement(TextField, {
+      label: "Bottom",
+      quickchange: true,
+      name,
+      valueAdapter: getVal(2),
+      onChangeAdapter: setVal(2)
+    }))), /* @__PURE__ */ React__default.createElement(Stack$6, {
+      wrap: false
+    }, /* @__PURE__ */ React__default.createElement(Stack$6.Item, {
+      fill: true
+    }, /* @__PURE__ */ React__default.createElement(TextField, {
+      label: /* @__PURE__ */ React__default.createElement("span", null, "Left"),
+      quickchange: true,
+      name,
+      valueAdapter: getVal(3),
+      onChangeAdapter: setVal(3)
+    })), /* @__PURE__ */ React__default.createElement(Stack$6.Item, {
+      fill: true
+    }, /* @__PURE__ */ React__default.createElement(TextField, {
+      label: /* @__PURE__ */ React__default.createElement("span", null, "Right\xA0"),
+      quickchange: true,
+      name,
+      valueAdapter: getVal(1),
+      onChangeAdapter: setVal(1)
+    }))));
+  }, [getVal, name, setVal]);
+}
+function BorderWidth() {
   const { focusIdx: focusIdx2 } = useFocusIdx();
   return useMemo(() => {
-    return /* @__PURE__ */ React__default.createElement(ColorPickerField, {
-      label: "Color",
-      name: `${focusIdx2}.attributes.border-color`
+    return /* @__PURE__ */ React__default.createElement(TextField, {
+      label: "Width",
+      quickchange: true,
+      name: `${focusIdx2}.attributes.border-width`
     });
   }, [focusIdx2]);
 }
+function Button() {
+  const { focusIdx: focusIdx2 } = useFocusIdx();
+  const { input } = useField(`${focusIdx2}.data.value.content`, {
+    parse: (v) => v
+  });
+  const { mergeTags: mergeTags2 } = useEditorProps();
+  return /* @__PURE__ */ React__default.createElement(AttributesPanelWrapper, null, /* @__PURE__ */ React__default.createElement(Collapse$1, {
+    defaultActiveKey: ["-1", "0", "1", "2", "3"]
+  }, /* @__PURE__ */ React__default.createElement(Collapse$1.Item, {
+    name: "-1",
+    header: "Setting"
+  }, /* @__PURE__ */ React__default.createElement(Space$1, {
+    direction: "vertical"
+  }, /* @__PURE__ */ React__default.createElement(TextField, {
+    label: /* @__PURE__ */ React__default.createElement(Space$1, null, /* @__PURE__ */ React__default.createElement("span", null, "Content"), mergeTags2 && /* @__PURE__ */ React__default.createElement(Popover$1, {
+      trigger: "click",
+      content: /* @__PURE__ */ React__default.createElement(MergeTags, {
+        value: input.value,
+        onChange: input.onChange
+      })
+    }, /* @__PURE__ */ React__default.createElement(Button$4, {
+      type: "text",
+      icon: /* @__PURE__ */ React__default.createElement(IconFont, {
+        iconName: "icon-merge-tags"
+      })
+    }))),
+    name: `${focusIdx2}.data.value.content`
+  }), /* @__PURE__ */ React__default.createElement(Link, null))), /* @__PURE__ */ React__default.createElement(Collapse$1.Item, {
+    name: "0",
+    header: "Dimension"
+  }, /* @__PURE__ */ React__default.createElement(Space$1, {
+    direction: "vertical"
+  }, /* @__PURE__ */ React__default.createElement(Grid.Row, null, /* @__PURE__ */ React__default.createElement(Grid.Col, {
+    span: 11
+  }, /* @__PURE__ */ React__default.createElement(Width, null)), /* @__PURE__ */ React__default.createElement(Grid.Col, {
+    offset: 1,
+    span: 11
+  }, /* @__PURE__ */ React__default.createElement(FontWeight, null))), /* @__PURE__ */ React__default.createElement(Padding, {
+    title: "Padding",
+    attributeName: "padding"
+  }), /* @__PURE__ */ React__default.createElement(Padding, {
+    title: "Inner padding",
+    attributeName: "inner-padding"
+  }))), /* @__PURE__ */ React__default.createElement(Collapse$1.Item, {
+    name: "1",
+    header: "Color"
+  }, /* @__PURE__ */ React__default.createElement(Space$1, {
+    direction: "vertical"
+  }, /* @__PURE__ */ React__default.createElement(Grid.Row, null, /* @__PURE__ */ React__default.createElement(Grid.Col, {
+    span: 11
+  }, /* @__PURE__ */ React__default.createElement(Color, {
+    title: "Text color"
+  })), /* @__PURE__ */ React__default.createElement(Grid.Col, {
+    offset: 1,
+    span: 11
+  }, /* @__PURE__ */ React__default.createElement(BackgroundColor, {
+    title: "Button color"
+  })), /* @__PURE__ */ React__default.createElement(Grid.Col, {
+    span: 11
+  }, /* @__PURE__ */ React__default.createElement(ContainerBackgroundColor, {
+    title: "Background color"
+  }))))), /* @__PURE__ */ React__default.createElement(Collapse$1.Item, {
+    name: "2",
+    header: "Typography"
+  }, /* @__PURE__ */ React__default.createElement(Space$1, {
+    direction: "vertical"
+  }, /* @__PURE__ */ React__default.createElement(Grid.Row, null, /* @__PURE__ */ React__default.createElement(Grid.Col, {
+    span: 11
+  }, /* @__PURE__ */ React__default.createElement(FontFamily, null)), /* @__PURE__ */ React__default.createElement(Grid.Col, {
+    offset: 1,
+    span: 11
+  }, /* @__PURE__ */ React__default.createElement(FontSize, null))), /* @__PURE__ */ React__default.createElement(Grid.Row, null, /* @__PURE__ */ React__default.createElement(Grid.Col, {
+    span: 11
+  }, /* @__PURE__ */ React__default.createElement(FontWeight, null)), /* @__PURE__ */ React__default.createElement(Grid.Col, {
+    offset: 1,
+    span: 11
+  }, /* @__PURE__ */ React__default.createElement(LineHeight, null))), /* @__PURE__ */ React__default.createElement(Grid.Row, null, /* @__PURE__ */ React__default.createElement(Grid.Col, {
+    span: 11
+  }, /* @__PURE__ */ React__default.createElement(TextDecoration, null)), /* @__PURE__ */ React__default.createElement(Grid.Col, {
+    offset: 1,
+    span: 11
+  }, /* @__PURE__ */ React__default.createElement(LetterSpacing, null))), /* @__PURE__ */ React__default.createElement(Align, null), /* @__PURE__ */ React__default.createElement(FontStyle, null))), /* @__PURE__ */ React__default.createElement(Collapse$1.Item, {
+    name: "3",
+    header: "Border"
+  }, /* @__PURE__ */ React__default.createElement(Border, null))));
+}
 function Divider() {
   return /* @__PURE__ */ React__default.createElement(AttributesPanelWrapper, null, /* @__PURE__ */ React__default.createElement(Collapse$1, {
     defaultActiveKey: ["-1", "0", "1", "2", "3"]
@@ -40467,58 +40687,6 @@ function Accordion() {
     name: `${focusIdx2}.attributes.border`
   })))));
 }
-const options$5 = [
-  {
-    value: "left",
-    label: "Left"
-  },
-  {
-    value: "center",
-    label: "Center"
-  },
-  {
-    value: "right",
-    label: "Right"
-  }
-];
-function TextAlign() {
-  const { focusIdx: focusIdx2 } = useFocusIdx();
-  return useMemo(() => {
-    return /* @__PURE__ */ React__default.createElement(Stack$6, null, /* @__PURE__ */ React__default.createElement(RadioGroupField, {
-      label: "Text align",
-      name: `${focusIdx2}.attributes.text-align`,
-      options: options$5
-    }));
-  }, [focusIdx2]);
-}
-const options$4 = [
-  {
-    value: "",
-    label: "none"
-  },
-  {
-    value: "uppercase",
-    label: "uppercase"
-  },
-  {
-    value: "lowercase",
-    label: "lowercase"
-  },
-  {
-    value: "capitalize",
-    label: "capitalize"
-  }
-];
-function TextTransform() {
-  const { focusIdx: focusIdx2 } = useFocusIdx();
-  return useMemo(() => {
-    return /* @__PURE__ */ React__default.createElement(SelectField, {
-      label: "Text transform",
-      name: `${focusIdx2}.attributes.text-transform`,
-      options: options$4
-    });
-  }, [focusIdx2]);
-}
 function AccordionElement() {
   const { focusIdx: focusIdx2 } = useFocusIdx();
   return /* @__PURE__ */ React__default.createElement(AttributesPanelWrapper, null, /* @__PURE__ */ React__default.createElement(Collapse$1, {
@@ -40638,7 +40806,7 @@ function AccordionText() {
     attributeName: "padding"
   })))));
 }
-const options$3 = [
+const options$2 = [
   {
     value: "hidden",
     label: "hidden"
@@ -40667,7 +40835,7 @@ function Carousel() {
   }), /* @__PURE__ */ React__default.createElement(RadioGroupField, {
     label: "Thumbnails",
     name: `${focusIdx2}.attributes.thumbnails`,
-    options: options$3,
+    options: options$2,
     inline: true
   }), /* @__PURE__ */ React__default.createElement(Align, {
     inline: true
@@ -40783,7 +40951,7 @@ function CarouselImage({
     name: `${focusIdx2}.data.value.image.[${index2}].title`
   }));
 }
-const options$2 = [
+const options$1 = [
   {
     value: "fluid-height",
     label: "Fluid height"
@@ -40806,7 +40974,7 @@ function Hero() {
   }, /* @__PURE__ */ React__default.createElement(RadioGroupField, {
     label: "Mode",
     name: `${focusIdx2}.attributes.mode`,
-    options: options$2
+    options: options$1
   }), /* @__PURE__ */ React__default.createElement(Grid.Row, null, /* @__PURE__ */ React__default.createElement(Grid.Col, {
     span: 11
   }, /* @__PURE__ */ React__default.createElement(Width, null)), /* @__PURE__ */ React__default.createElement(Grid.Col, {
@@ -40849,74 +41017,6 @@ function Hero() {
     span: 11
   }, /* @__PURE__ */ React__default.createElement(BackgroundColor, null)))))));
 }
-function NavbarLinkPadding({ name }) {
-  const { values: values2 } = useBlock();
-  const getVal = useCallback((index2) => {
-    return () => {
-      var _a;
-      return ((_a = lodash.exports.get(values2, name)) == null ? void 0 : _a.split(" ")[index2]) || "";
-    };
-  }, [name, values2]);
-  const setVal = useCallback((index2) => {
-    return (newVal) => {
-      if (newVal === "") {
-        newVal = "0px";
-      }
-      const vals = [
-        getVal(0)(),
-        getVal(1)(),
-        getVal(2)(),
-        getVal(3)()
-      ];
-      vals[index2] = newVal;
-      return vals.join(" ");
-    };
-  }, [getVal]);
-  return useMemo(() => {
-    return /* @__PURE__ */ React__default.createElement(Stack$6, {
-      vertical: true,
-      spacing: "extraTight"
-    }, /* @__PURE__ */ React__default.createElement(TextStyle, {
-      variation: "strong"
-    }, "Padding"), /* @__PURE__ */ React__default.createElement(Stack$6, {
-      wrap: false
-    }, /* @__PURE__ */ React__default.createElement(Stack$6.Item, {
-      fill: true
-    }, /* @__PURE__ */ React__default.createElement(TextField, {
-      label: /* @__PURE__ */ React__default.createElement("span", null, "Top"),
-      quickchange: true,
-      name,
-      valueAdapter: getVal(0),
-      onChangeAdapter: setVal(0)
-    })), /* @__PURE__ */ React__default.createElement(Stack$6.Item, {
-      fill: true
-    }, /* @__PURE__ */ React__default.createElement(TextField, {
-      label: "Bottom",
-      quickchange: true,
-      name,
-      valueAdapter: getVal(2),
-      onChangeAdapter: setVal(2)
-    }))), /* @__PURE__ */ React__default.createElement(Stack$6, {
-      wrap: false
-    }, /* @__PURE__ */ React__default.createElement(Stack$6.Item, {
-      fill: true
-    }, /* @__PURE__ */ React__default.createElement(TextField, {
-      label: /* @__PURE__ */ React__default.createElement("span", null, "Left"),
-      quickchange: true,
-      name,
-      valueAdapter: getVal(3),
-      onChangeAdapter: setVal(3)
-    })), /* @__PURE__ */ React__default.createElement(Stack$6.Item, {
-      fill: true
-    }, /* @__PURE__ */ React__default.createElement(TextField, {
-      label: /* @__PURE__ */ React__default.createElement("span", null, "Right\xA0"),
-      quickchange: true,
-      name,
-      valueAdapter: getVal(1),
-      onChangeAdapter: setVal(1)
-    }))));
-  }, [getVal, name, setVal]);
-}
 function Navbar() {
   const { focusIdx: focusIdx2 } = useFocusIdx();
   return /* @__PURE__ */ React__default.createElement(AttributesPanelWrapper, {
@@ -41001,7 +41101,7 @@ function NavbarLink({
     name: `${focusIdx2}.data.value.links.[${index2}].padding`
   }));
 }
-const options$1 = [
+const options = [
   {
     value: "vertical",
     label: "vertical"
@@ -41027,7 +41127,7 @@ function Social() {
   }, /* @__PURE__ */ React__default.createElement(RadioGroupField, {
     label: "Mode",
     name: `${focusIdx2}.attributes.mode`,
-    options: options$1
+    options
   })), /* @__PURE__ */ React__default.createElement(Grid.Col, {
     offset: 1,
     span: 11
@@ -41236,100 +41336,6 @@ function AttributePanel() {
               }
               `), shadowRoot));
 }
-function Decoration() {
-  const { focusIdx: focusIdx2 } = useFocusIdx();
-  return useMemo(() => {
-    return /* @__PURE__ */ React__default.createElement(Stack$6, {
-      key: focusIdx2,
-      vertical: true,
-      spacing: "extraTight"
-    }, /* @__PURE__ */ React__default.createElement(TextStyle, {
-      variation: "strong",
-      size: "large"
-    }, "Decoration"), /* @__PURE__ */ React__default.createElement(TextField, {
-      label: "Border radius",
-      name: `${focusIdx2}.attributes.borderRadius`,
-      inline: true
-    }), /* @__PURE__ */ React__default.createElement(TextField, {
-      label: "Border",
-      name: `${focusIdx2}.attributes.border`,
-      inline: true,
-      alignment: "center"
-    }), /* @__PURE__ */ React__default.createElement(NumberField, {
-      label: "Opacity",
-      max: 1,
-      min: 0,
-      step: 0.1,
-      name: `${focusIdx2}.attributes.opacity`,
-      inline: true,
-      alignment: "center"
-    }));
-  }, [focusIdx2]);
-}
-const options = [
-  {
-    value: "ltr",
-    label: "ltr"
-  },
-  {
-    value: "rtl",
-    label: "rtl"
-  }
-];
-function Direction() {
-  const { focusIdx: focusIdx2 } = useFocusIdx();
-  return useMemo(() => {
-    return /* @__PURE__ */ React__default.createElement(Stack$6, null, /* @__PURE__ */ React__default.createElement(RadioGroupField, {
-      label: "Direction",
-      name: `${focusIdx2}.attributes.direction`,
-      options,
-      inline: true
-    }));
-  }, [focusIdx2]);
-}
-function Margin() {
-  const { focusIdx: focusIdx2 } = useFocusIdx();
-  return useMemo(() => {
-    return /* @__PURE__ */ React__default.createElement(Stack$6, {
-      vertical: true,
-      spacing: "extraTight"
-    }, /* @__PURE__ */ React__default.createElement(TextStyle, {
-      size: "large"
-    }, "Margin"), /* @__PURE__ */ React__default.createElement(Stack$6, {
-      wrap: false
-    }, /* @__PURE__ */ React__default.createElement(Stack$6.Item, {
-      fill: true
-    }, /* @__PURE__ */ React__default.createElement(TextField, {
-      label: "Top",
-      quickchange: true,
-      name: `${focusIdx2}.attributes.marginTop`,
-      inline: true
-    })), /* @__PURE__ */ React__default.createElement(Stack$6.Item, {
-      fill: true
-    }, /* @__PURE__ */ React__default.createElement(TextField, {
-      label: "Bottom",
-      quickchange: true,
-      name: `${focusIdx2}.attributes.marginBottom`,
-      inline: true
-    }))), /* @__PURE__ */ React__default.createElement(Stack$6, {
-      wrap: false
-    }, /* @__PURE__ */ React__default.createElement(Stack$6.Item, {
-      fill: true
-    }, /* @__PURE__ */ React__default.createElement(TextField, {
-      label: "Left",
-      quickchange: true,
-      name: `${focusIdx2}.attributes.marginLeft`,
-      inline: true
-    })), /* @__PURE__ */ React__default.createElement(Stack$6.Item, {
-      fill: true
-    }, /* @__PURE__ */ React__default.createElement(TextField, {
-      label: "Right",
-      quickchange: true,
-      name: `${focusIdx2}.attributes.marginRight`,
-      inline: true
-    }))));
-  }, [focusIdx2]);
-}
 function Tools(props) {
   const { container: container2 } = props;
   const { mergeTags: mergeTags2 } = useEditorProps();
@@ -44432,6 +44438,32 @@ function ShortcutToolbar() {
       color: "#59BEF8"
     }
   })), /* @__PURE__ */ React__default.createElement(BlockAvatarWrapper, {
+    payload: {
+      children: [
+        {
+          type: "column",
+          data: {
+            value: {}
+          },
+          attributes: {
+            padding: "0px 0px 0px 0px",
+            border: "none",
+            "vertical-align": "top"
+          }
+        },
+        {
+          type: "column",
+          data: {
+            value: {}
+          },
+          attributes: {
+            padding: "0px 0px 0px 0px",
+            border: "none",
+            "vertical-align": "top"
+          }
+        }
+      ]
+    },
     type: BasicType.SECTION
   }, /* @__PURE__ */ React__default.createElement(IconFont, {
     title: "Section",