npm - easy-email-extensions - Versions diffs - 4.4.5 → 4.7.0 - Mend

easy-email-extensions 4.4.5 → 4.7.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (21) hide show

package/lib/index2.js CHANGED Viewed

@@ -56,7 +56,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, useImperativeHandle, PureComponent, useCallback, useReducer, createRef, Fragment, createElement, Suspense } from "react";
-import { IconFont, useEditorProps, useRefState, Stack as Stack$4, getShadowRoot, DATA_CONTENT_EDITABLE_TYPE, ContentEditableType, TextStyle, useEditorContext, useBlock, useFocusIdx, useFocusBlockLayout, MergeTagBadge, FIXED_CONTAINER_ID, getPluginElement, RICH_TEXT_BAR_ID, CONTENT_EDITABLE_CLASS_NAME, getEditorRoot, DATA_CONTENT_EDITABLE_IDX, scrollBlockEleIntoView, useHoverIdx, useDataTransfer, getBlockNodeByChildEle, getDirectionPosition, DATA_ATTRIBUTE_DROP_CONTAINER, BlockAvatarWrapper, isTextBlock, getBlockNodeByIdx, useLazyState, useActiveTab, ActiveTabKeys } from "easy-email-editor";
+import { IconFont, useEditorProps, Stack as Stack$4, useRefState, getShadowRoot, DATA_CONTENT_EDITABLE_TYPE, ContentEditableType, TextStyle, useEditorContext, useBlock, useFocusIdx, useFocusBlockLayout, MergeTagBadge, FIXED_CONTAINER_ID, getPluginElement, RICH_TEXT_BAR_ID, CONTENT_EDITABLE_CLASS_NAME, getEditorRoot, DATA_CONTENT_EDITABLE_IDX, scrollBlockEleIntoView, useHoverIdx, useDataTransfer, getBlockNodeByChildEle, getDirectionPosition, DATA_ATTRIBUTE_DROP_CONTAINER, BlockAvatarWrapper, isTextBlock, getBlockNodeByIdx, useLazyState, useActiveTab, ActiveTabKeys } from "easy-email-editor";
 import { BasicType, ImageManager, EMAIL_BLOCK_CLASS_NAME, BlockManager, createBlockDataByType, AdvancedType, Operator, OperatorSymbol, isAdvancedBlock, getParentByIdx, getParentIdx, getIndexByIdx, getSiblingIdx, getNodeIdxFromClassName, getNodeIdxClassName, getPageIdx, getChildIdx, MjmlToJson, JsonToMjml, getNodeTypeFromClassName } from "easy-email-core";
 import ReactDOM, { findDOMNode, createPortal } from "react-dom";
 import { Field, useForm as useForm$1, useField, Form as Form$3, version as version$2, useFormState } from "react-final-form";
@@ -6669,7 +6669,7 @@ function isObject$e(obj) {
 function isString$1(obj) {
   return opt$1.call(obj) === "[object String]";
 }
-function isNumber$1(obj) {
+function isNumber$2(obj) {
   return opt$1.call(obj) === "[object Number]" && obj === obj;
 }
 function isUndefined(obj) {
@@ -7829,7 +7829,7 @@ var Notification = function(_super) {
     if (options2.prefixCls) {
       prefixCls = options2.prefixCls;
     }
-    if (isNumber$1(options2.duration)) {
+    if (isNumber$2(options2.duration)) {
       duration = options2.duration;
     }
     if (options2.getContainer && options2.getContainer() !== container$1) {
@@ -9621,7 +9621,7 @@ function autoSizeTextAreaHeight(autoSize, node) {
     if (minRows || maxRows) {
       mirrorTextArea.value = "";
       var singleRowHeight = mirrorTextArea.scrollHeight - paddingSize;
-      if (isNumber$1(minRows)) {
+      if (isNumber$2(minRows)) {
         minHeight = singleRowHeight * minRows;
         if (boxSizing === "border-box") {
           minHeight += paddingSize;
@@ -9629,7 +9629,7 @@ function autoSizeTextAreaHeight(autoSize, node) {
         }
         mirrorTextAreaHeight = Math.max(mirrorTextAreaHeight, minHeight);
       }
-      if (isNumber$1(maxRows)) {
+      if (isNumber$2(maxRows)) {
         maxHeight = singleRowHeight * maxRows;
         if (boxSizing === "border-box") {
           maxHeight += paddingSize;
@@ -13123,7 +13123,7 @@ var VirtualList = React__default.forwardRef(function(props, ref) {
   useComputeVirtualItemHeight(refItemHeightMap);
   var itemCount = data.length;
   var itemHeight = propItemHeight || refItemHeightMap.current[KEY_VIRTUAL_ITEM_HEIGHT] || DEFAULT_VIRTUAL_ITEM_HEIGHT;
-  var viewportHeight = isNumber$1(styleListMaxHeight) ? styleListMaxHeight : stateHeight;
+  var viewportHeight = isNumber$2(styleListMaxHeight) ? styleListMaxHeight : stateHeight;
   var itemCountVisible = Math.ceil(viewportHeight / itemHeight);
   var itemTotalHeight = itemHeight * itemCount;
   var isVirtual = threshold !== null && itemCount >= threshold && itemTotalHeight > viewportHeight;
@@ -13446,7 +13446,7 @@ var VirtualList = React__default.forwardRef(function(props, ref) {
     return null;
   };
   return React__default.createElement(ResizeObserver, { onResize: function() {
-    if (refList.current && !isNumber$1(styleListMaxHeight)) {
+    if (refList.current && !isNumber$2(styleListMaxHeight)) {
       var clientHeight = refList.current.clientHeight;
       setStateHeight(clientHeight);
     }
@@ -13956,7 +13956,7 @@ function flatChildren(_a, _b, _c) {
   var extendChildren = function(arr, origin) {
     if (origin && isArray$c(arr) && arr.length) {
       arr.forEach(function(option) {
-        option = isString$1(option) || isNumber$1(option) ? {
+        option = isString$1(option) || isNumber$2(option) ? {
           label: option,
           value: option
         } : option;
@@ -16636,7 +16636,7 @@ function SplitGroup(props, ref) {
   };
   function formatSize(size) {
     var totalPX = isHorizontal ? wrapperRef.current.offsetWidth : wrapperRef.current.offsetHeight;
-    if (!size || isNumber$1(size) && size < 0) {
+    if (!size || isNumber$2(size) && size < 0) {
       return 0;
     }
     var percent = isString$1(size) ? parseFloat(size) / totalPX : size;
@@ -16983,7 +16983,7 @@ function ResizeBox(baseProps, ref) {
       return __assign$X(__assign$X({}, pre), (_a2 = {}, _a2["padding" + styleDirection] = size, _a2));
     });
   }
-  var wrapperStyles = __assign$X(__assign$X(__assign$X(__assign$X({}, paddingStyles), style || {}), isNumber$1(width) ? { width } : {}), isNumber$1(height) ? { height } : {});
+  var wrapperStyles = __assign$X(__assign$X(__assign$X(__assign$X({}, paddingStyles), style || {}), isNumber$2(width) ? { width } : {}), isNumber$2(height) ? { height } : {});
   var Tag2 = component;
   return React__default.createElement(Tag2, { style: wrapperStyles, className: classNames, ref: wrapperRef }, children, directions.map(function(direction) {
     if (allDirections.indexOf(direction) !== -1) {
@@ -17144,7 +17144,7 @@ function Sider(props, ref) {
   var _g = __read$L(useMergeValue(false, {
     value: props.collapsed
   }), 2), collapsed = _g[0], setCollapsed = _g[1];
-  var propsWidth = isNumber$1(width) ? width + "px" : String(width);
+  var propsWidth = isNumber$2(width) ? width + "px" : String(width);
   var _h = __read$L(useState(propsWidth), 2), siderWidth = _h[0], setSiderWidth = _h[1];
   var refResponsiveHandlerToken = useRef(null);
   var refStateForResponsiveHandler = useRef(null);
@@ -17177,7 +17177,7 @@ function Sider(props, ref) {
     };
   }, []);
   useEffect(function() {
-    var _collapsedWidth = isNumber$1(collapsedWidth) ? collapsedWidth + "px" : String(collapsedWidth);
+    var _collapsedWidth = isNumber$2(collapsedWidth) ? collapsedWidth + "px" : String(collapsedWidth);
     setSiderWidth(collapsed ? _collapsedWidth : propsWidth);
   }, [collapsed, propsWidth, collapsedWidth]);
   var resizable = resizeDirections && isArray$c(resizeDirections) || ((_b = resizeBoxProps.directions) === null || _b === void 0 ? void 0 : _b.length);
@@ -18519,7 +18519,7 @@ function DotLoading(props) {
   var sizeNumber = props.size ? parseInt(String(props.size)) : 0;
   return React__default.createElement("div", { className: prefixCls2 + "-list", style: {
     height: props.size,
-    width: isNumber$1(sizeNumber) && sizeNumber > 0 ? sizeNumber * 7 : ""
+    width: isNumber$2(sizeNumber) && sizeNumber > 0 ? sizeNumber * 7 : ""
   } }, __spreadArray$h([], __read$G(new Array(5)), false).map(function(_, index2) {
     return React__default.createElement("div", { key: index2, className: prefixCls2, style: dotStyle });
   }));
@@ -20946,7 +20946,7 @@ function isObject(obj) {
 function isString(obj) {
   return opt.call(obj) === "[object String]";
 }
-function isNumber(obj) {
+function isNumber$1(obj) {
   return opt.call(obj) === "[object Number]" && obj === obj;
 }
 function isBoolean(obj) {
@@ -21163,7 +21163,7 @@ var StringValidator = /* @__PURE__ */ function(Base3) {
 var NumberValidator = /* @__PURE__ */ function(Base3) {
   function NumberValidator2(obj, options2) {
     Base3.call(this, obj, Object.assign(Object.assign({}, options2), { type: "number" }));
-    this.validate(options2 && options2.strict ? isNumber(this.obj) : true, this.getValidateMsg("type.number"));
+    this.validate(options2 && options2.strict ? isNumber$1(this.obj) : true, this.getValidateMsg("type.number"));
   }
   if (Base3)
     NumberValidator2.__proto__ = Base3;
@@ -22399,7 +22399,7 @@ function Col$1(baseProps, ref) {
     var screenList = { xs, sm, md, lg, xl, xxl };
     Object.keys(screenList).forEach(function(screen) {
       var screenValue = screenList[screen];
-      if (isNumber$1(screenValue)) {
+      if (isNumber$2(screenValue)) {
         if (screenValue >= 0) {
           mergeClassName2[prefixCls3 + "-" + screen + "-" + screenValue] = true;
         }
@@ -23663,7 +23663,7 @@ function InputNumber(baseProps, ref) {
   var prefixCls2 = getPrefixCls("input-number");
   var mergedSize = size || ctxSize;
   var mergedPrecision = function() {
-    if (isNumber$1(precision)) {
+    if (isNumber$2(precision)) {
       var decimal = ("" + step).split(".")[1];
       var stepPrecision = decimal && decimal.length || 0;
       return Math.max(stepPrecision, precision);
@@ -23687,7 +23687,7 @@ function InputNumber(baseProps, ref) {
   }, []);
   var setValue = function(newVal) {
     setInnerValue(newVal);
-    var newValue = isNumber$1(+newVal) ? +newVal : void 0;
+    var newValue = isNumber$2(+newVal) ? +newVal : void 0;
     if (newValue !== value) {
       onChange && onChange(newValue);
     }
@@ -23700,7 +23700,7 @@ function InputNumber(baseProps, ref) {
     var finalValue = Number(changedValue);
     if (!changedValue && changedValue !== 0) {
       finalValue = void 0;
-    } else if (!isNumber$1(finalValue)) {
+    } else if (!isNumber$2(finalValue)) {
       finalValue = changedValue === "-" ? changedValue : "";
     }
     if (finalValue < min) {
@@ -23709,7 +23709,7 @@ function InputNumber(baseProps, ref) {
     if (finalValue > max) {
       finalValue = max;
     }
-    return isNumber$1(finalValue) ? isNumber$1(mergedPrecision) ? Number(toFixed(finalValue, mergedPrecision)) : finalValue : void 0;
+    return isNumber$2(finalValue) ? isNumber$2(mergedPrecision) ? Number(toFixed(finalValue, mergedPrecision)) : finalValue : void 0;
   }, [min, max, mergedPrecision]);
   useEffect(function() {
     return function() {
@@ -23720,7 +23720,7 @@ function InputNumber(baseProps, ref) {
     refHasOperateSincePropValueChanged.current = false;
   }, [props.value]);
   useEffect(function() {
-    var _isOutOfRange = isNumber$1(min) && value < min || isNumber$1(max) && value > max;
+    var _isOutOfRange = isNumber$2(min) && value < min || isNumber$2(max) && value > max;
     if (_isOutOfRange && refHasOperateSincePropValueChanged.current) {
       setValue(getLegalValue(value));
     }
@@ -23753,7 +23753,7 @@ function InputNumber(baseProps, ref) {
     var _value;
     if (isUserInputting) {
       _value = inputValue;
-    } else if (isNumber$1(value) && isNumber$1(mergedPrecision)) {
+    } else if (isNumber$2(value) && isNumber$2(mergedPrecision)) {
       _value = toFixed(value, mergedPrecision);
     } else if (value == null) {
       _value = "";
@@ -23767,7 +23767,7 @@ function InputNumber(baseProps, ref) {
       setIsUserInputting(true);
       var targetValue = value2.trim().replace(/。/g, ".");
       targetValue = parser ? parser(targetValue) : targetValue;
-      if (isNumber$1(+targetValue) || targetValue === "-" || !targetValue || targetValue === ".") {
+      if (isNumber$2(+targetValue) || targetValue === "-" || !targetValue || targetValue === ".") {
         var formatValue2 = getLegalValue(targetValue);
         setInputValue(targetValue);
         setValue(formatValue2);
@@ -25204,7 +25204,7 @@ var SliderButton = function(props) {
     bottom: 12
   }, ref: tooltip, popup: function() {
     return renderTooltipContent(position);
-  }, popupVisible, disabled: tooltipVisible === false, getPopupContainer: getTooltipContainer, position, childrenPrefix: getPrefixCls("tooltip") }, React__default.createElement("div", { className: cs$1(prefixCls2 + "-button", (_a = {}, _a[prefixCls2 + "-button-active"] = isActive, _a)), onMouseDown: handleMouseDown, onMouseEnter: handleMouseEnter, onMouseLeave: handleMouseLeave, style, role: "slider", "aria-valuemax": props.maxValue, "aria-valuemin": props.minValue, "aria-valuenow": value, "aria-disabled": !!disabled, tabIndex: 0, "aria-valuetext": isString$1(tooltipText) || isNumber$1(tooltipText) ? String(tooltipText) : void 0 }));
+  }, popupVisible, disabled: tooltipVisible === false, getPopupContainer: getTooltipContainer, position, childrenPrefix: getPrefixCls("tooltip") }, React__default.createElement("div", { className: cs$1(prefixCls2 + "-button", (_a = {}, _a[prefixCls2 + "-button-active"] = isActive, _a)), onMouseDown: handleMouseDown, onMouseEnter: handleMouseEnter, onMouseLeave: handleMouseLeave, style, role: "slider", "aria-valuemax": props.maxValue, "aria-valuemin": props.minValue, "aria-valuenow": value, "aria-disabled": !!disabled, tabIndex: 0, "aria-valuetext": isString$1(tooltipText) || isNumber$2(tooltipText) ? String(tooltipText) : void 0 }));
 };
 var SliderButton$1 = memo(SliderButton);
 var __read$l = globalThis && globalThis.__read || function(o, n) {
@@ -25498,7 +25498,7 @@ function useLegalValue(props) {
       } else {
         console.error("value must be an array when range is true");
       }
-    } else if (isNumber$1(val)) {
+    } else if (isNumber$2(val)) {
       endVal = getLegalValue(val);
     } else {
       console.error("value must be a number when range is false");
@@ -25548,7 +25548,7 @@ function useInterval(props) {
   var _a = props.marks, marks = _a === void 0 ? {} : _a, getIntervalConfig = props.getIntervalConfig, max = props.max, min = props.min;
   var _b = useMemo(function() {
     var markKeys = Object.keys(marks).filter(function(key) {
-      return isNumber$1(+key) && +key >= min && +key <= max;
+      return isNumber$2(+key) && +key >= min && +key <= max;
     }).sort(function(a, b) {
       return +a > +b ? 1 : -1;
     });
@@ -25587,10 +25587,10 @@ function useInterval(props) {
     var customConfig = getIntervalConfig([begin, end], index2) || {};
     var step = customConfig.step;
     var width = rateToFloat(customConfig.width);
-    if (isNumber$1(step) && step) {
+    if (isNumber$2(step) && step) {
       config2.step = step;
     }
-    if (isNumber$1(width) && width) {
+    if (isNumber$2(width) && width) {
       config2.width = width;
     }
     return config2;
@@ -25936,7 +25936,7 @@ function Space(baseProps, ref) {
   var innerAlign = align || (direction === "horizontal" ? "center" : "");
   var classNames = cs$1(prefixCls2, (_a = {}, _a[prefixCls2 + "-" + direction] = direction, _a[prefixCls2 + "-align-" + innerAlign] = innerAlign, _a[prefixCls2 + "-wrap"] = wrap2, _a[prefixCls2 + "-rtl"] = rtl, _a), className);
   function getMargin(size2) {
-    if (isNumber$1(size2)) {
+    if (isNumber$2(size2)) {
       return size2;
     }
     switch (size2) {
@@ -26604,7 +26604,7 @@ var TabHeader = React__default.forwardRef(function(props, ref) {
           nextOffset_1 = bottomOffset;
         } else if (scrollAlign_1 === "center") {
           nextOffset_1 = topOffset - (diffStyle.top - diffStyle.bottom) / 2;
-        } else if (isNumber$1(scrollAlign_1)) {
+        } else if (isNumber$2(scrollAlign_1)) {
           nextOffset_1 = Math.max(topOffset - scrollAlign_1, bottomOffset);
         }
         return nextOffset_1;
@@ -26623,7 +26623,7 @@ var TabHeader = React__default.forwardRef(function(props, ref) {
           nextOffset_2 = endOffset_1;
         } else if (scrollAlign_2 === "center") {
           nextOffset_2 = startOffset_1 + (diffStyle.left - diffStyle.right) / 2;
-        } else if (isNumber$1(scrollAlign_2)) {
+        } else if (isNumber$2(scrollAlign_2)) {
           nextOffset_2 = Math.min(startOffset_1 + scrollAlign_2, endOffset_1);
         }
         return nextOffset_2;
@@ -26641,7 +26641,7 @@ var TabHeader = React__default.forwardRef(function(props, ref) {
         nextOffset = endOffset;
       } else if (scrollAlign === "center") {
         nextOffset = startOffset - (diffStyle.left - diffStyle.right) / 2;
-      } else if (isNumber$1(scrollAlign)) {
+      } else if (isNumber$2(scrollAlign)) {
         nextOffset = Math.max(startOffset - scrollAlign, endOffset);
       }
       return nextOffset;
@@ -27070,7 +27070,7 @@ var TreeAnimation = function(props) {
     return result;
   }, [childrenPropsList, props._key, expanded]);
   var realHeight = (_a = treeContext.virtualListProps) === null || _a === void 0 ? void 0 : _a.height;
-  realHeight = isNumber$1(realHeight) ? realHeight : 0;
+  realHeight = isNumber$2(realHeight) ? realHeight : 0;
   useEffect(function() {
     if (currentExpandKeys.indexOf(props._key) > -1 && filtedData.length === 0) {
       treeContext.onExpandEnd(props._key);
@@ -29513,7 +29513,7 @@ IconEdit.defaultProps = {
 IconEdit.displayName = "IconEdit";
 var IconEdit$1 = IconEdit;
 var isSingleNode = function(child) {
-  return isString$1(child) || isNumber$1(child);
+  return isString$1(child) || isNumber$2(child);
 };
 function mergedToString(children) {
   var mergedResult = [""];
@@ -29668,7 +29668,7 @@ function useEllipsis(props) {
     onEllipsis && onEllipsis(isEllipsis);
   }, [isEllipsis]);
   var isSimpleNode = function(node) {
-    return isString$1(node) || isNumber$1(node);
+    return isString$1(node) || isNumber$2(node);
   };
   var getTotalLen = function(list2) {
     var total = 0;
@@ -30803,7 +30803,7 @@ function ImageUploader(props) {
   const onChange = props.onChange;
   const onUpload = useCallback(() => {
     if (isUploading) {
-      return Message$1.warning("Uploading...");
+      return Message$1.warning(t("Uploading..."));
     }
     if (!uploadHandlerRef.current)
       return;
@@ -30842,7 +30842,7 @@ function ImageUploader(props) {
           props.onChange(picture);
           setIsUploading(false);
         } catch (error2) {
-          Message$1.error((error2 == null ? void 0 : error2.message) || error2 || "Upload failed");
+          Message$1.error((error2 == null ? void 0 : error2.message) || error2 || t("Upload failed"));
           setIsUploading(false);
         }
       }
@@ -30876,10 +30876,10 @@ function ImageUploader(props) {
     }), /* @__PURE__ */ React__default.createElement("div", {
       className: styles$8["btn-wrap"]
     }, /* @__PURE__ */ React__default.createElement("a", {
-      title: "Preview",
+      title: t("Preview"),
       onClick: () => setPreview(true)
     }, /* @__PURE__ */ React__default.createElement(IconEye$1, null)), /* @__PURE__ */ React__default.createElement("a", {
-      title: "Remove",
+      title: t("Remove"),
       onClick: () => onRemove()
     }, /* @__PURE__ */ React__default.createElement(IconDelete$1, null)))));
   }, [isUploading, onRemove, onUpload, props.value]);
@@ -30936,7 +30936,7 @@ function ImageUploader(props) {
     footer: null,
     onCancel: () => setPreview(false)
   }, /* @__PURE__ */ React__default.createElement("img", {
-    alt: "Preview",
+    alt: t("Preview"),
     style: { width: "100%" },
     src: props.value
   })));
@@ -30970,125 +30970,255 @@ function UploadField$1(props) {
     onChange: inputDisabled ? void 0 : (value) => onChange(value)
   });
 }
-const defaultImagesMap$1 = {
-  IMAGE_59: "https://easy-email-m-ryan.vercel.app/images/06ca521d-9728-4de6-a709-1b75a828bfc3-2a9b1224-3d71-43b8-b52f-e7cdcdc9107b.png",
-  AttributePanel_01: "https://easy-email-m-ryan.vercel.app/images/e22f78f2-aa76-408d-ba94-c95c7abe1908-image.png",
-  AttributePanel_02: "https://easy-email-m-ryan.vercel.app/images/3e952a6e-2506-470e-b395-3e0d995157c5.png",
-  AttributePanel_03: "https://easy-email-m-ryan.vercel.app/images/Fi_vI4vyLhTM-Tp6ivq4dR_ieGHk.png"
-};
-ImageManager.add(defaultImagesMap$1);
-function getImg$1(name2) {
-  return ImageManager.get(name2);
+function Select(props) {
+  return /* @__PURE__ */ React__default.createElement(Select$2, __spreadProps(__spreadValues({}, props), {
+    dropdownMenuClassName: "easy-email-overlay",
+    style: lodash.exports.merge({ width: "100%" }, props.style),
+    value: props.value,
+    onChange: props.onChange
+  }), props.options.map((item2, index2) => /* @__PURE__ */ React__default.createElement(Select$2.Option, {
+    key: index2,
+    value: item2.value
+  }, item2.label)));
 }
-var noop = function() {
-};
-var isBrowser = typeof window !== "undefined";
-var useLocalStorage = function(key, initialValue, options2) {
-  if (!isBrowser) {
-    return [initialValue, noop, noop];
-  }
-  if (!key) {
-    throw new Error("useLocalStorage key may not be falsy");
-  }
-  var deserializer = options2 ? options2.raw ? function(value) {
-    return value;
-  } : options2.deserializer : JSON.parse;
-  var initializer = useRef(function(key2) {
-    try {
-      var serializer = options2 ? options2.raw ? String : options2.serializer : JSON.stringify;
-      var localStorageValue = localStorage.getItem(key2);
-      if (localStorageValue !== null) {
-        return deserializer(localStorageValue);
-      } else {
-        initialValue && localStorage.setItem(key2, serializer(initialValue));
-        return initialValue;
+function RadioGroup(props) {
+  const _a = props, { type, vertical } = _a, rest = __objRest(_a, ["type", "vertical"]);
+  return /* @__PURE__ */ React__default.createElement(Radio.Group, __spreadProps(__spreadValues({}, rest), {
+    style: lodash.exports.merge({ width: "100%" }, rest.style),
+    value: rest.value,
+    onChange: rest.onChange
+  }), /* @__PURE__ */ React__default.createElement(Stack$4, {
+    vertical,
+    spacing: "extraTight"
+  }, rest.options.map((item2, index2) => /* @__PURE__ */ React__default.createElement(Radio, {
+    key: index2,
+    value: item2.value
+  }, item2.label))));
+}
+const parse = (v) => v;
+function enhancer(Component2, changeAdapter, option) {
+  return (props) => {
+    const _a = props, {
+      name: name2,
+      validate: validate3,
+      onChangeAdapter,
+      changeOnBlur,
+      inline,
+      equalSpacing,
+      formItem,
+      label,
+      required,
+      style,
+      helpText,
+      autoComplete,
+      labelHidden: labelHidden2
+    } = _a, rest = __objRest(_a, [
+      "name",
+      "validate",
+      "onChangeAdapter",
+      "changeOnBlur",
+      "inline",
+      "equalSpacing",
+      "formItem",
+      "label",
+      "required",
+      "style",
+      "helpText",
+      "autoComplete",
+      "labelHidden"
+    ]);
+    const debounceTime = props.debounceTime || (option == null ? void 0 : option.debounceTime) || 300;
+    const config2 = useMemo(() => {
+      var _a2;
+      return __spreadProps(__spreadValues({}, props.config), {
+        validate: validate3,
+        parse: ((_a2 = props.config) == null ? void 0 : _a2.parse) || parse
+      });
+    }, [props.config, validate3]);
+    const [currentValue, setCurrentValue] = useState("");
+    const currentValueRef = useRefState(currentValue);
+    const layoutStyle = useMemo(() => {
+      if (equalSpacing) {
+        return {
+          labelCol: {
+            span: 11,
+            style: {
+              textAlign: "left",
+              paddingRight: 0
+            }
+          },
+          wrapperCol: {
+            span: 11,
+            offset: 1,
+            style: {
+              textAlign: "right"
+            }
+          }
+        };
       }
-    } catch (_a2) {
-      return initialValue;
-    }
-  });
-  var _a = useState(function() {
-    return initializer.current(key);
-  }), state = _a[0], setState = _a[1];
-  useLayoutEffect(function() {
-    return setState(initializer.current(key));
-  }, [key]);
-  var set2 = useCallback(function(valOrFunc) {
-    try {
-      var newState = typeof valOrFunc === "function" ? valOrFunc(state) : valOrFunc;
-      if (typeof newState === "undefined")
-        return;
-      var value = void 0;
-      if (options2)
-        if (options2.raw)
-          if (typeof newState === "string")
-            value = newState;
-          else
-            value = JSON.stringify(newState);
-        else if (options2.serializer)
-          value = options2.serializer(newState);
-        else
-          value = JSON.stringify(newState);
-      else
-        value = JSON.stringify(newState);
-      localStorage.setItem(key, value);
-      setState(deserializer(value));
-    } catch (_a2) {
-    }
-  }, [key, setState]);
-  var remove = useCallback(function() {
-    try {
-      localStorage.removeItem(key);
-      setState(void 0);
-    } catch (_a2) {
+      if (inline) {
+        return {
+          labelCol: {
+            span: 7,
+            style: {
+              textAlign: "right",
+              paddingRight: 0
+            }
+          },
+          wrapperCol: {
+            span: 16,
+            offset: 1,
+            style: {}
+          }
+        };
+      }
+      return {
+        labelCol: {
+          span: 24,
+          style: {
+            paddingRight: 0
+          }
+        },
+        wrapperCol: {
+          span: 24
+        }
+      };
+    }, [equalSpacing, inline]);
+    return useMemo(() => {
+      return /* @__PURE__ */ React__default.createElement(Field, __spreadValues({
+        name: name2
+      }, config2), ({ input: { onBlur: onBlur3, onChange, value }, meta }) => {
+        const debounceCallbackChange = useCallback(lodash.exports.debounce((val) => {
+          onChange(val);
+          onBlur3();
+        }, debounceTime, {}), [onChange, onBlur3]);
+        const onFieldChange = useCallback((e) => {
+          const newVal = onChangeAdapter ? onChangeAdapter(changeAdapter(e)) : changeAdapter(e);
+          setCurrentValue(newVal);
+          if (!changeOnBlur) {
+            debounceCallbackChange(newVal);
+          }
+        }, [debounceCallbackChange]);
+        const onFieldBlur = useCallback(() => {
+          if (changeOnBlur) {
+            onChange(currentValueRef.current);
+            onBlur3();
+          }
+        }, [onBlur3, onChange]);
+        useEffect(() => {
+          setCurrentValue(value);
+        }, [value]);
+        return /* @__PURE__ */ React__default.createElement(Form.Item, __spreadProps(__spreadValues(__spreadValues({
+          style: __spreadProps(__spreadValues({}, style), {
+            margin: "0px"
+          }),
+          rules: required ? [{ required: true }] : void 0
+        }, layoutStyle), formItem), {
+          label: labelHidden2 ? void 0 : label || (formItem == null ? void 0 : formItem.label),
+          labelAlign: "left",
+          validateStatus: meta.touched && meta.error ? "error" : void 0,
+          help: meta.touched && meta.error ? meta.error : helpText
+        }), /* @__PURE__ */ React__default.createElement(Component2, __spreadProps(__spreadValues({
+          autoComplete
+        }, rest), {
+          name: name2,
+          checked: currentValue,
+          value: currentValue,
+          onChange: onFieldChange,
+          onBlur: onFieldBlur
+        })));
+      });
+    }, [
+      autoComplete,
+      changeOnBlur,
+      config2,
+      currentValue,
+      currentValueRef,
+      debounceTime,
+      formItem,
+      helpText,
+      label,
+      labelHidden2,
+      layoutStyle,
+      name2,
+      onChangeAdapter,
+      required,
+      rest,
+      style
+    ]);
+  };
+}
+function Input(props) {
+  const {
+    quickchange,
+    value = "",
+    onKeyDown: onPropsKeyDown,
+    onChange: propsOnChange
+  } = props;
+  const onChange = useCallback((val) => {
+    propsOnChange(val);
+  }, [propsOnChange]);
+  const onKeyDown = useCallback((ev) => {
+    if (onPropsKeyDown) {
+      onPropsKeyDown == null ? void 0 : onPropsKeyDown(ev);
     }
-  }, [key, setState]);
-  return [state, set2, remove];
-};
-var useLocalStorage$1 = useLocalStorage;
-const defaultPresetColor = [
-  "#000000",
-  "#FFFFFF",
-  "#9b9b9b",
-  "#d0021b",
-  "#4a90e2",
-  "#7ed321",
-  "#bd10e0",
-  "#f8e71c"
-];
-const CURRENT_COLORS_KEY = "CURRENT_COLORS_KEY";
-const MAX_RECORD_SIZE = 20;
-const PresetColorsContext = React__default.createContext({
-  colors: [],
-  addCurrentColor: () => {
-  }
-});
-const PresetColorsProvider = (props) => {
-  const [currentColors, setCurrentColors] = useLocalStorage$1(CURRENT_COLORS_KEY, defaultPresetColor);
-  const currentColorsRef = useRefState(currentColors);
-  const colorDivRef = useRef(document.createElement("div"));
-  const addCurrentColor = useCallback(lodash.exports.debounce((newColor) => {
-    colorDivRef.current.style.color = "";
-    colorDivRef.current.style.color = newColor;
-    if (colorDivRef.current.style.color) {
-      if (currentColorsRef.current.includes(newColor))
-        return;
-      const newColors = [...new Set([...currentColorsRef.current, newColor])].filter(Boolean).slice(-MAX_RECORD_SIZE);
-      setCurrentColors(newColors);
+    if (quickchange) {
+      let step = 0;
+      if (ev.key === "ArrowUp") {
+        step = 1;
+      }
+      if (ev.key === "ArrowDown") {
+        step = -1;
+      }
+      if (step) {
+        if (/^\d+/.test(value)) {
+          ev.preventDefault();
+          onChange(String(value).replace(/^(\d+)/, (_, match) => {
+            return (Number(match) + step).toString();
+          }));
+        }
+      }
     }
-  }, 500), [currentColorsRef, setCurrentColors]);
-  const value = useMemo(() => {
-    return {
-      colors: currentColors,
-      addCurrentColor
-    };
-  }, [addCurrentColor, currentColors]);
-  return useMemo(() => {
-    return /* @__PURE__ */ React__default.createElement(PresetColorsContext.Provider, {
-      value
-    }, props.children);
-  }, [props.children, value]);
-};
+  }, [onPropsKeyDown, quickchange, value, onChange]);
+  return /* @__PURE__ */ React__default.createElement(Input$4, __spreadProps(__spreadValues({}, __spreadProps(__spreadValues({}, props), { quickchange: void 0 })), {
+    onChange: (value2) => onChange(value2),
+    onKeyDown
+  }));
+}
+function InputWithUnit(props) {
+  const _a = props, {
+    value = "",
+    onKeyDown: onPropsKeyDown,
+    unitOptions: propsUnitOptions
+  } = _a, restProps = __objRest(_a, [
+    "value",
+    "onKeyDown",
+    "unitOptions"
+  ]);
+  return /* @__PURE__ */ React__default.createElement(Input, __spreadProps(__spreadValues({
+    value
+  }, restProps), {
+    quickchange: true
+  }));
+}
+function CheckBoxGroup(props) {
+  const _a = props, { vertical = false } = _a, rest = __objRest(_a, ["vertical"]);
+  return /* @__PURE__ */ React__default.createElement(Checkbox$1.Group, {
+    style: lodash.exports.merge({ width: "100%" }, rest.style),
+    value: rest.value,
+    onChange: rest.onChange
+  }, /* @__PURE__ */ React__default.createElement(Stack$4, {
+    vertical,
+    spacing: "extraTight"
+  }, rest.options.map((item2, index2) => /* @__PURE__ */ React__default.createElement(Checkbox$1, {
+    style: rest.checkboxStyle,
+    key: index2,
+    value: item2.value
+  }, item2.label))));
+}
+function classnames(...rest) {
+  return rest.filter((item2) => typeof item2 === "string").join(" ");
+}
 const helperText = "_helperText_1m9nq_1";
 const labelHidden = "_label-hidden_1m9nq_9";
 const editTab = "_editTab_1m9nq_20";
@@ -31104,6 +31234,145 @@ var styles$7 = {
   inputWithUnitSelectOption,
   colorPicker
 };
+const { TabPane: TabPane$1 } = Tabs$1;
+function EditTab(props) {
+  const { value, additionItem } = props;
+  const [activeTab, setActiveTab] = useState("0");
+  const onAddTab = () => {
+    setActiveTab(value.length.toString());
+    props.onChange([...value, additionItem]);
+  };
+  const onDeleteTab = (index2) => {
+    if (index2 < activeTab) {
+      setActiveTab((Number(activeTab) - 1).toString());
+    }
+    if (index2 === activeTab) {
+      setActiveTab(Number(index2) > 0 ? `${Number(index2) - 1}` : "0");
+    }
+    props.onChange(value.filter((_, vIndex) => Number(index2) !== vIndex));
+  };
+  return /* @__PURE__ */ React__default.createElement(Tabs$1, {
+    destroyOnHide: true,
+    className: classnames(styles$7.editTab),
+    style: { border: "none" },
+    type: "card",
+    activeTab,
+    tabPosition: props.tabPosition,
+    editable: true,
+    onAddTab,
+    onDeleteTab,
+    onChange: setActiveTab
+  }, (Array.isArray(value) ? value : []).map((item2, index2) => /* @__PURE__ */ React__default.createElement(TabPane$1, {
+    style: { paddingLeft: 12 },
+    title: `${props.label || t("Tab")} ${index2 + 1}`,
+    key: index2
+  }, props.renderItem(item2, index2))));
+}
+function EditGridTab(props) {
+  const { value, additionItem } = props;
+  const onAdd = (index2) => {
+    let newItem = additionItem || lodash.exports.cloneDeep(value[index2]);
+    value.splice(index2 + 1, 0, newItem);
+    props.onChange([...value]);
+  };
+  const onDelete = (index2) => {
+    props.onChange(value.filter((_, vIndex) => Number(index2) !== vIndex));
+  };
+  return /* @__PURE__ */ React__default.createElement(Card$1, {
+    bordered: false
+  }, (Array.isArray(value) ? value : []).map((item2, index2) => /* @__PURE__ */ React__default.createElement(Card$1.Grid, {
+    style: { width: "100%" },
+    key: index2
+  }, /* @__PURE__ */ React__default.createElement(Card$1, {
+    title: /* @__PURE__ */ React__default.createElement(Space$1, null, /* @__PURE__ */ React__default.createElement(Typography$1.Text, null, t("Item"), " ", index2 + 1)),
+    extra: /* @__PURE__ */ React__default.createElement(Space$1, {
+      size: "large"
+    }, /* @__PURE__ */ React__default.createElement(IconPlus$1, {
+      style: { color: "#000", cursor: "pointer" },
+      onClick: () => onAdd(index2)
+    }), /* @__PURE__ */ React__default.createElement(IconClose$1, {
+      style: { color: "#000", cursor: "pointer" },
+      onClick: () => onDelete(index2)
+    }))
+  }, props.renderItem(item2, index2)))));
+}
+function InlineText({ idx, onChange, children }) {
+  const {
+    mutators: { setFieldTouched }
+  } = useForm$1();
+  useField(idx);
+  useEffect(() => {
+    const shadowRoot = getShadowRoot();
+    const onPaste = (e) => {
+      var _a, _b;
+      if (!(e.target instanceof Element) || !e.target.getAttribute("contenteditable"))
+        return;
+      e.preventDefault();
+      const text = ((_a = e.clipboardData) == null ? void 0 : _a.getData("text/plain")) || "";
+      document.execCommand("insertHTML", false, text);
+      const contentEditableType = e.target.getAttribute(DATA_CONTENT_EDITABLE_TYPE);
+      if (contentEditableType === ContentEditableType.RichText) {
+        onChange(e.target.innerHTML || "");
+      } else if (contentEditableType === ContentEditableType.Text) {
+        onChange(((_b = e.target.textContent) == null ? void 0 : _b.trim()) || "");
+      }
+    };
+    const onInput = (e) => {
+      var _a;
+      if (e.target instanceof Element && e.target.getAttribute("contenteditable")) {
+        const contentEditableType = e.target.getAttribute(DATA_CONTENT_EDITABLE_TYPE);
+        if (contentEditableType === ContentEditableType.RichText) {
+          onChange(e.target.innerHTML || "");
+        } else if (contentEditableType === ContentEditableType.Text) {
+          onChange(((_a = e.target.textContent) == null ? void 0 : _a.trim()) || "");
+        }
+      }
+    };
+    shadowRoot.addEventListener("paste", onPaste, true);
+    shadowRoot.addEventListener("input", onInput);
+    return () => {
+      shadowRoot.removeEventListener("paste", onPaste, true);
+      shadowRoot.removeEventListener("input", onInput);
+    };
+  }, [onChange, setFieldTouched]);
+  return /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, children);
+}
+function AutoComplete(props) {
+  const options2 = useMemo(() => {
+    const selectedValue = (props.value || "").toLowerCase();
+    return props.options.filter((item2) => {
+      return lodash.exports.isString(item2.value) && item2.value.toLowerCase().startsWith(selectedValue) || lodash.exports.isString(item2.label) && item2.label.toLowerCase().startsWith(selectedValue);
+    }).map((item2) => __spreadProps(__spreadValues({}, item2), { name: item2.label }));
+  }, [props.options, props.value]);
+  return /* @__PURE__ */ React__default.createElement(ArcoAutoComplete, __spreadProps(__spreadValues({}, props), {
+    data: options2
+  }));
+}
+function isNumber(num) {
+  if (typeof num !== "string" && typeof num !== "number")
+    return false;
+  return new RegExp("^(\\-|\\+)?\\d+(\\.\\d+)?$").test(num.toString());
+}
+const pixelAdapter = {
+  format(val) {
+    if (!lodash.exports.isString(val) && !val)
+      return "";
+    val = val.toString();
+    if (/^\d+px$/.test(val.trim()))
+      return val.trim().replace("px", "");
+    return val.trim();
+  },
+  parse(val) {
+    if (!lodash.exports.isString(val) && !isNumber(val))
+      return void 0;
+    val = val.toString().trim();
+    if (!val)
+      return void 0;
+    if (/^\d+$/.test(val))
+      return val + "px";
+    return val;
+  }
+};
 var colorString$1 = { exports: {} };
 var colorName = {
   "aliceblue": [240, 248, 255],
@@ -32615,6 +32884,171 @@ function zeroArray(array, length2) {
 }
 var color = Color$1;
 var Color$2 = color;
+const colorAdapter = {
+  format(val) {
+    if (!lodash.exports.isString(val) && !val)
+      return "";
+    val = val.toString();
+    if (val.length === 7 && val.startsWith("#"))
+      return val.replace("#", "");
+    return val;
+  },
+  parse(val) {
+    if (!lodash.exports.isString(val))
+      return void 0;
+    val = val.toString().trim();
+    if (!val)
+      return void 0;
+    try {
+      if (val.length === 6 && Color$2(`#${val}`).hex())
+        return `#${val}`;
+    } catch (error2) {
+      console.log("err", val);
+    }
+    return val;
+  }
+};
+const imageHeightAdapter = {
+  format(val) {
+    if (!lodash.exports.isString(val) && !val)
+      return "";
+    val = val.toString();
+    if (val === "auto")
+      return void 0;
+    if (/^\d+px$/.test(val.trim()))
+      return val.trim().replace("px", "");
+    return val.trim();
+  },
+  parse(val) {
+    if (!lodash.exports.isString(val) && !isNumber(val))
+      return void 0;
+    val = val.toString().trim();
+    if (!val)
+      return void 0;
+    if (/^\d+$/.test(val))
+      return val + "px";
+    return val;
+  }
+};
+const defaultImagesMap$1 = {
+  IMAGE_59: "https://easy-email-m-ryan.vercel.app/images/06ca521d-9728-4de6-a709-1b75a828bfc3-2a9b1224-3d71-43b8-b52f-e7cdcdc9107b.png",
+  AttributePanel_01: "https://easy-email-m-ryan.vercel.app/images/e22f78f2-aa76-408d-ba94-c95c7abe1908-image.png",
+  AttributePanel_02: "https://easy-email-m-ryan.vercel.app/images/3e952a6e-2506-470e-b395-3e0d995157c5.png",
+  AttributePanel_03: "https://easy-email-m-ryan.vercel.app/images/Fi_vI4vyLhTM-Tp6ivq4dR_ieGHk.png"
+};
+ImageManager.add(defaultImagesMap$1);
+function getImg$1(name2) {
+  return ImageManager.get(name2);
+}
+var noop = function() {
+};
+var isBrowser = typeof window !== "undefined";
+var useLocalStorage = function(key, initialValue, options2) {
+  if (!isBrowser) {
+    return [initialValue, noop, noop];
+  }
+  if (!key) {
+    throw new Error("useLocalStorage key may not be falsy");
+  }
+  var deserializer = options2 ? options2.raw ? function(value) {
+    return value;
+  } : options2.deserializer : JSON.parse;
+  var initializer = useRef(function(key2) {
+    try {
+      var serializer = options2 ? options2.raw ? String : options2.serializer : JSON.stringify;
+      var localStorageValue = localStorage.getItem(key2);
+      if (localStorageValue !== null) {
+        return deserializer(localStorageValue);
+      } else {
+        initialValue && localStorage.setItem(key2, serializer(initialValue));
+        return initialValue;
+      }
+    } catch (_a2) {
+      return initialValue;
+    }
+  });
+  var _a = useState(function() {
+    return initializer.current(key);
+  }), state = _a[0], setState = _a[1];
+  useLayoutEffect(function() {
+    return setState(initializer.current(key));
+  }, [key]);
+  var set2 = useCallback(function(valOrFunc) {
+    try {
+      var newState = typeof valOrFunc === "function" ? valOrFunc(state) : valOrFunc;
+      if (typeof newState === "undefined")
+        return;
+      var value = void 0;
+      if (options2)
+        if (options2.raw)
+          if (typeof newState === "string")
+            value = newState;
+          else
+            value = JSON.stringify(newState);
+        else if (options2.serializer)
+          value = options2.serializer(newState);
+        else
+          value = JSON.stringify(newState);
+      else
+        value = JSON.stringify(newState);
+      localStorage.setItem(key, value);
+      setState(deserializer(value));
+    } catch (_a2) {
+    }
+  }, [key, setState]);
+  var remove = useCallback(function() {
+    try {
+      localStorage.removeItem(key);
+      setState(void 0);
+    } catch (_a2) {
+    }
+  }, [key, setState]);
+  return [state, set2, remove];
+};
+var useLocalStorage$1 = useLocalStorage;
+const defaultPresetColor = [
+  "#000000",
+  "#FFFFFF",
+  "#9b9b9b",
+  "#d0021b",
+  "#4a90e2",
+  "#7ed321",
+  "#bd10e0",
+  "#f8e71c"
+];
+const CURRENT_COLORS_KEY = "CURRENT_COLORS_KEY";
+const MAX_RECORD_SIZE = 20;
+const PresetColorsContext = React__default.createContext({
+  colors: [],
+  addCurrentColor: () => {
+  }
+});
+const PresetColorsProvider = (props) => {
+  const [currentColors, setCurrentColors] = useLocalStorage$1(CURRENT_COLORS_KEY, defaultPresetColor);
+  const currentColorsRef = useRefState(currentColors);
+  const colorDivRef = useRef(document.createElement("div"));
+  const addCurrentColor = useCallback(lodash.exports.debounce((newColor) => {
+    colorDivRef.current.style.color = "";
+    colorDivRef.current.style.color = newColor;
+    if (colorDivRef.current.style.color) {
+      if (currentColorsRef.current.includes(newColor))
+        return;
+      const newColors = [...new Set([...currentColorsRef.current, newColor])].filter(Boolean).slice(-MAX_RECORD_SIZE);
+      setCurrentColors(newColors);
+    }
+  }, 500), [currentColorsRef, setCurrentColors]);
+  const value = useMemo(() => {
+    return {
+      colors: currentColors,
+      addCurrentColor
+    };
+  }, [addCurrentColor, currentColors]);
+  return useMemo(() => {
+    return /* @__PURE__ */ React__default.createElement(PresetColorsContext.Provider, {
+      value
+    }, props.children);
+  }, [props.children, value]);
+};
 const transparentColor$1 = "rgba(0,0,0,0)";
 function ColorPickerContent(props) {
   const { colors: presetColors } = useContext(PresetColorsContext);
@@ -32667,7 +33101,7 @@ function ColorPickerContent(props) {
       paddingLeft: 10,
       position: "relative"
     }
-  }, /* @__PURE__ */ React__default.createElement("span", null, "Picker..."), /* @__PURE__ */ React__default.createElement("input", {
+  }, /* @__PURE__ */ React__default.createElement("span", null, t("Picker...")), /* @__PURE__ */ React__default.createElement("input", {
     style: {
       position: "absolute",
       width: "100%",
@@ -32706,6 +33140,21 @@ function ColorPicker(props) {
   const getPopupContainer = useCallback(() => {
     return getCollapseItemEle(refEle);
   }, [refEle]);
+  const inputColor = useMemo(() => {
+    var _a, _b, _c;
+    if (((_a = props.value) == null ? void 0 : _a.startsWith("#")) && ((_b = props.value) == null ? void 0 : _b.length) === 7)
+      return (_c = props.value) == null ? void 0 : _c.replace("#", "");
+    return props.value;
+  }, [props.value]);
+  const adapterColor = useMemo(() => {
+    try {
+      if (value.length === 6 && Color$2(`#${value}`).hex())
+        return `#${value}`;
+    } catch (error2) {
+      console.log("err", value);
+    }
+    return value;
+  }, [value]);
   return /* @__PURE__ */ React__default.createElement("div", {
     style: { flex: 1, display: "flex" }
   }, /* @__PURE__ */ React__default.createElement(Popover$1, __spreadValues({
@@ -32713,7 +33162,7 @@ function ColorPicker(props) {
     trigger: "click",
     className: "color-picker-popup",
     content: /* @__PURE__ */ React__default.createElement(ColorPickerContent, {
-      value,
+      value: adapterColor,
       onChange: onInputChange
     }),
     getPopupContainer
@@ -32741,7 +33190,7 @@ function ColorPicker(props) {
       width: "100%",
       height: "100%",
       textAlign: "center",
-      backgroundColor: value
+      backgroundColor: adapterColor
     }
   }) : /* @__PURE__ */ React__default.createElement("img", {
     style: {
@@ -32756,374 +33205,19 @@ function ColorPicker(props) {
                 }
                 `))), showInput && /* @__PURE__ */ React__default.createElement(Input$4, {
-    value: props.value,
+    value: inputColor,
     style: { outline: "none", flex: 1 },
     onChange: onInputChange
   }));
 }
-function Select(props) {
-  return /* @__PURE__ */ React__default.createElement(Select$2, __spreadProps(__spreadValues({}, props), {
-    dropdownMenuClassName: "easy-email-overlay",
-    style: lodash.exports.merge({ width: "100%" }, props.style),
-    value: props.value,
-    onChange: props.onChange
-  }), props.options.map((item2, index2) => /* @__PURE__ */ React__default.createElement(Select$2.Option, {
-    key: index2,
-    value: item2.value
-  }, item2.label)));
-}
-function RadioGroup(props) {
-  const _a = props, { type, vertical } = _a, rest = __objRest(_a, ["type", "vertical"]);
-  return /* @__PURE__ */ React__default.createElement(Radio.Group, __spreadProps(__spreadValues({}, rest), {
-    style: lodash.exports.merge({ width: "100%" }, rest.style),
-    value: rest.value,
-    onChange: rest.onChange
-  }), /* @__PURE__ */ React__default.createElement(Stack$4, {
-    vertical,
-    spacing: "extraTight"
-  }, rest.options.map((item2, index2) => /* @__PURE__ */ React__default.createElement(Radio, {
-    key: index2,
-    value: item2.value
-  }, item2.label))));
-}
-const parse = (v) => v;
-function enhancer(Component2, changeAdapter, option) {
-  return (props) => {
-    const _a = props, {
-      name: name2,
-      validate: validate3,
-      onChangeAdapter,
-      changeOnBlur,
-      inline,
-      equalSpacing,
-      formItem,
-      label,
-      required,
-      style,
-      helpText,
-      autoComplete,
-      labelHidden: labelHidden2
-    } = _a, rest = __objRest(_a, [
-      "name",
-      "validate",
-      "onChangeAdapter",
-      "changeOnBlur",
-      "inline",
-      "equalSpacing",
-      "formItem",
-      "label",
-      "required",
-      "style",
-      "helpText",
-      "autoComplete",
-      "labelHidden"
-    ]);
-    const debounceTime = props.debounceTime || (option == null ? void 0 : option.debounceTime) || 300;
-    const config2 = useMemo(() => {
-      var _a2;
-      return __spreadProps(__spreadValues({}, props.config), {
-        validate: validate3,
-        parse: ((_a2 = props.config) == null ? void 0 : _a2.parse) || parse
-      });
-    }, [props.config, validate3]);
-    const [currentValue, setCurrentValue] = useState("");
-    const currentValueRef = useRefState(currentValue);
-    const layoutStyle = useMemo(() => {
-      if (equalSpacing) {
-        return {
-          labelCol: {
-            span: 11,
-            style: {
-              textAlign: "left",
-              paddingRight: 0
-            }
-          },
-          wrapperCol: {
-            span: 11,
-            offset: 1,
-            style: {
-              textAlign: "right"
-            }
-          }
-        };
-      }
-      if (inline) {
-        return {
-          labelCol: {
-            span: 7,
-            style: {
-              textAlign: "right",
-              paddingRight: 0
-            }
-          },
-          wrapperCol: {
-            span: 16,
-            offset: 1,
-            style: {}
-          }
-        };
-      }
-      return {
-        labelCol: {
-          span: 24,
-          style: {
-            paddingRight: 0
-          }
-        },
-        wrapperCol: {
-          span: 24
-        }
-      };
-    }, [equalSpacing, inline]);
-    return useMemo(() => {
-      return /* @__PURE__ */ React__default.createElement(Field, __spreadValues({
-        name: name2
-      }, config2), ({ input: { onBlur: onBlur3, onChange, value }, meta }) => {
-        const debounceCallbackChange = useCallback(lodash.exports.debounce((val) => {
-          onChange(val);
-          onBlur3();
-        }, debounceTime, {}), [onChange, onBlur3]);
-        const onFieldChange = useCallback((e) => {
-          const newVal = onChangeAdapter ? onChangeAdapter(changeAdapter(e)) : changeAdapter(e);
-          setCurrentValue(newVal);
-          if (!changeOnBlur) {
-            debounceCallbackChange(newVal);
-          }
-        }, [debounceCallbackChange]);
-        const onFieldBlur = useCallback(() => {
-          if (changeOnBlur) {
-            onChange(currentValueRef.current);
-            onBlur3();
-          }
-        }, [onBlur3, onChange]);
-        useEffect(() => {
-          setCurrentValue(value);
-        }, [value]);
-        return /* @__PURE__ */ React__default.createElement(Form.Item, __spreadProps(__spreadValues(__spreadValues({
-          style: __spreadProps(__spreadValues({}, style), {
-            margin: "0px"
-          }),
-          rules: required ? [{ required: true }] : void 0
-        }, layoutStyle), formItem), {
-          label: labelHidden2 ? void 0 : label || (formItem == null ? void 0 : formItem.label),
-          labelAlign: "left",
-          validateStatus: meta.touched && meta.error ? "error" : void 0,
-          help: meta.touched && meta.error ? meta.error : helpText
-        }), /* @__PURE__ */ React__default.createElement(Component2, __spreadProps(__spreadValues({
-          autoComplete
-        }, rest), {
-          name: name2,
-          checked: currentValue,
-          value: currentValue,
-          onChange: onFieldChange,
-          onBlur: onFieldBlur
-        })));
-      });
-    }, [
-      autoComplete,
-      changeOnBlur,
-      config2,
-      currentValue,
-      currentValueRef,
-      debounceTime,
-      formItem,
-      helpText,
-      label,
-      labelHidden2,
-      layoutStyle,
-      name2,
-      onChangeAdapter,
-      required,
-      rest,
-      style
-    ]);
-  };
-}
-function Input(props) {
-  const {
-    quickchange,
-    value = "",
-    onKeyDown: onPropsKeyDown,
-    onChange: propsOnChange
-  } = props;
-  const onChange = useCallback((val) => {
-    propsOnChange(val);
-  }, [propsOnChange]);
-  const onKeyDown = useCallback((ev) => {
-    if (onPropsKeyDown) {
-      onPropsKeyDown == null ? void 0 : onPropsKeyDown(ev);
-    }
-    if (quickchange) {
-      let step = 0;
-      if (ev.key === "ArrowUp") {
-        step = 1;
-      }
-      if (ev.key === "ArrowDown") {
-        step = -1;
-      }
-      if (step) {
-        if (/^\d+/.test(value)) {
-          ev.preventDefault();
-          onChange(String(value).replace(/^(\d+)/, (_, match) => {
-            return (Number(match) + step).toString();
-          }));
-        }
-      }
-    }
-  }, [onPropsKeyDown, quickchange, value, onChange]);
-  return /* @__PURE__ */ React__default.createElement(Input$4, __spreadProps(__spreadValues({}, __spreadProps(__spreadValues({}, props), { quickchange: void 0 })), {
-    onChange: (value2) => onChange(value2),
-    onKeyDown
-  }));
-}
-function InputWithUnit(props) {
-  const _a = props, {
-    value = "",
-    onKeyDown: onPropsKeyDown,
-    unitOptions: propsUnitOptions
-  } = _a, restProps = __objRest(_a, [
-    "value",
-    "onKeyDown",
-    "unitOptions"
-  ]);
-  return /* @__PURE__ */ React__default.createElement(Input, __spreadProps(__spreadValues({
-    value
-  }, restProps), {
-    quickchange: true
-  }));
-}
-function CheckBoxGroup(props) {
-  const _a = props, { vertical = false } = _a, rest = __objRest(_a, ["vertical"]);
-  return /* @__PURE__ */ React__default.createElement(Checkbox$1.Group, {
-    style: lodash.exports.merge({ width: "100%" }, rest.style),
-    value: rest.value,
-    onChange: rest.onChange
-  }, /* @__PURE__ */ React__default.createElement(Stack$4, {
-    vertical,
-    spacing: "extraTight"
-  }, rest.options.map((item2, index2) => /* @__PURE__ */ React__default.createElement(Checkbox$1, {
-    style: rest.checkboxStyle,
-    key: index2,
-    value: item2.value
-  }, item2.label))));
-}
-function classnames(...rest) {
-  return rest.filter((item2) => typeof item2 === "string").join(" ");
-}
-const { TabPane: TabPane$1 } = Tabs$1;
-function EditTab(props) {
-  const { value, additionItem } = props;
-  const [activeTab, setActiveTab] = useState("0");
-  const onAddTab = () => {
-    setActiveTab(value.length.toString());
-    props.onChange([...value, additionItem]);
-  };
-  const onDeleteTab = (index2) => {
-    if (index2 < activeTab) {
-      setActiveTab((Number(activeTab) - 1).toString());
-    }
-    if (index2 === activeTab) {
-      setActiveTab(Number(index2) > 0 ? `${Number(index2) - 1}` : "0");
-    }
-    props.onChange(value.filter((_, vIndex) => Number(index2) !== vIndex));
-  };
-  return /* @__PURE__ */ React__default.createElement(Tabs$1, {
-    destroyOnHide: true,
-    className: classnames(styles$7.editTab),
-    style: { border: "none" },
-    type: "card",
-    activeTab,
-    tabPosition: props.tabPosition,
-    editable: true,
-    onAddTab,
-    onDeleteTab,
-    onChange: setActiveTab
-  }, (Array.isArray(value) ? value : []).map((item2, index2) => /* @__PURE__ */ React__default.createElement(TabPane$1, {
-    style: { paddingLeft: 12 },
-    title: `${props.label || "Tab"} ${index2 + 1}`,
-    key: index2
-  }, props.renderItem(item2, index2))));
-}
-function EditGridTab(props) {
-  const { value, additionItem } = props;
-  const onAdd = (index2) => {
-    let newItem = additionItem || lodash.exports.cloneDeep(value[index2]);
-    value.splice(index2 + 1, 0, newItem);
-    props.onChange([...value]);
-  };
-  const onDelete = (index2) => {
-    props.onChange(value.filter((_, vIndex) => Number(index2) !== vIndex));
-  };
-  return /* @__PURE__ */ React__default.createElement(Card$1, {
-    bordered: false
-  }, (Array.isArray(value) ? value : []).map((item2, index2) => /* @__PURE__ */ React__default.createElement(Card$1.Grid, {
-    style: { width: "100%" },
-    key: index2
-  }, /* @__PURE__ */ React__default.createElement(Card$1, {
-    title: /* @__PURE__ */ React__default.createElement(Space$1, null, /* @__PURE__ */ React__default.createElement(Typography$1.Text, null, "Item ", index2 + 1)),
-    extra: /* @__PURE__ */ React__default.createElement(Space$1, {
-      size: "large"
-    }, /* @__PURE__ */ React__default.createElement(IconPlus$1, {
-      style: { color: "#000", cursor: "pointer" },
-      onClick: () => onAdd(index2)
-    }), /* @__PURE__ */ React__default.createElement(IconClose$1, {
-      style: { color: "#000", cursor: "pointer" },
-      onClick: () => onDelete(index2)
-    }))
-  }, props.renderItem(item2, index2)))));
-}
-function InlineText({ idx, onChange, children }) {
-  const {
-    mutators: { setFieldTouched }
-  } = useForm$1();
-  useField(idx);
-  useEffect(() => {
-    const shadowRoot = getShadowRoot();
-    const onPaste = (e) => {
-      var _a, _b;
-      if (!(e.target instanceof Element) || !e.target.getAttribute("contenteditable"))
-        return;
-      e.preventDefault();
-      const text = ((_a = e.clipboardData) == null ? void 0 : _a.getData("text/plain")) || "";
-      document.execCommand("insertHTML", false, text);
-      const contentEditableType = e.target.getAttribute(DATA_CONTENT_EDITABLE_TYPE);
-      if (contentEditableType === ContentEditableType.RichText) {
-        onChange(e.target.innerHTML || "");
-      } else if (contentEditableType === ContentEditableType.Text) {
-        onChange(((_b = e.target.textContent) == null ? void 0 : _b.trim()) || "");
-      }
-    };
-    const onInput = (e) => {
-      var _a;
-      if (e.target instanceof Element && e.target.getAttribute("contenteditable")) {
-        const contentEditableType = e.target.getAttribute(DATA_CONTENT_EDITABLE_TYPE);
-        if (contentEditableType === ContentEditableType.RichText) {
-          onChange(e.target.innerHTML || "");
-        } else if (contentEditableType === ContentEditableType.Text) {
-          onChange(((_a = e.target.textContent) == null ? void 0 : _a.trim()) || "");
-        }
-      }
-    };
-    shadowRoot.addEventListener("paste", onPaste, true);
-    shadowRoot.addEventListener("input", onInput);
-    return () => {
-      shadowRoot.removeEventListener("paste", onPaste, true);
-      shadowRoot.removeEventListener("input", onInput);
-    };
-  }, [onChange, setFieldTouched]);
-  return /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, children);
-}
-function AutoComplete(props) {
-  const options2 = useMemo(() => {
-    const selectedValue = (props.value || "").toLowerCase();
-    return props.options.filter((item2) => {
-      return lodash.exports.isString(item2.value) && item2.value.toLowerCase().startsWith(selectedValue) || lodash.exports.isString(item2.label) && item2.label.toLowerCase().startsWith(selectedValue);
-    }).map((item2) => __spreadProps(__spreadValues({}, item2), { name: item2.label }));
-  }, [props.options, props.value]);
-  return /* @__PURE__ */ React__default.createElement(ArcoAutoComplete, __spreadProps(__spreadValues({}, props), {
-    data: options2
-  }));
-}
+const ColorPickerFieldSource = enhancer(ColorPicker, (e) => e, {
+  debounceTime: 1
+});
+const ColorPickerField = (props) => {
+  return /* @__PURE__ */ React__default.createElement(ColorPickerFieldSource, __spreadValues({
+    config: colorAdapter
+  }, props));
+};
 const ToolItem$1 = (props) => {
   if (!props.title) {
     return /* @__PURE__ */ React__default.createElement("button", {
@@ -33202,10 +33296,10 @@ function Link$1(props) {
       }, /* @__PURE__ */ React__default.createElement(SearchField, {
         size: "small",
         name: "link",
-        label: "Link",
+        label: t("Link"),
         labelHidden: true,
-        searchButton: "Apply",
-        placeholder: "https://www.example.com",
+        searchButton: t("Apply"),
+        placeholder: t("https://www.example.com"),
         onSearch: () => handleSubmit()
       })), /* @__PURE__ */ React__default.createElement(Grid.Row, null, /* @__PURE__ */ React__default.createElement(Grid.Col, {
         span: 12
@@ -33214,13 +33308,13 @@ function Link$1(props) {
         size: "mini"
       }, /* @__PURE__ */ React__default.createElement(TextStyle, {
         size: "smallest"
-      }, "Target"), /* @__PURE__ */ React__default.createElement(SwitchField, {
+      }, t("Target")), /* @__PURE__ */ React__default.createElement(SwitchField, {
         size: "small",
-        label: "Target",
+        label: t("Target"),
         labelHidden: true,
         name: "blank",
-        checkedText: "blank",
-        uncheckedText: "self",
+        checkedText: t("blank"),
+        uncheckedText: t("self"),
         inline: true
       }))), /* @__PURE__ */ React__default.createElement(Grid.Col, {
         span: 12
@@ -33229,18 +33323,18 @@ function Link$1(props) {
         size: "mini"
       }, /* @__PURE__ */ React__default.createElement(TextStyle, {
         size: "smallest"
-      }, "Underline"), /* @__PURE__ */ React__default.createElement(SwitchField, {
+      }, t("Underline")), /* @__PURE__ */ React__default.createElement(SwitchField, {
         size: "small",
-        label: "Underline",
+        label: t("Underline"),
         labelHidden: true,
         name: "underline",
-        checkedText: "off",
-        uncheckedText: "on",
+        checkedText: t("off"),
+        uncheckedText: t("on"),
         inline: true
       })))))
     }), /* @__PURE__ */ React__default.createElement(ToolItem$1, {
       isActive: Boolean(initialValues.link),
-      title: "Link",
+      title: t("Link"),
       icon: /* @__PURE__ */ React__default.createElement(IconFont, {
         iconName: "icon-link"
       })
@@ -33483,12 +33577,12 @@ function AddFont() {
           fill: true
         }, /* @__PURE__ */ React__default.createElement(TextField, {
           name: `${focusIdx2}.data.value.fonts.${index2}.name`,
-          label: "Name"
+          label: t("Name")
         })), /* @__PURE__ */ React__default.createElement(Stack$4.Item, {
           fill: true
         }, /* @__PURE__ */ React__default.createElement(TextField, {
           name: `${focusIdx2}.data.value.fonts.${index2}.href`,
-          label: "Href"
+          label: t("Href")
         })), /* @__PURE__ */ React__default.createElement(Stack$4, {
           vertical: true,
           spacing: "loose"
@@ -33572,7 +33666,7 @@ function FontFamily({ name: name2 }) {
     });
   }, [focusIdx2, fontList2, name2]);
 }
-function Page() {
+function Page({ hideSubTitle, hideSubject }) {
   const { focusIdx: focusIdx2 } = useFocusIdx();
   if (!focusIdx2)
     return null;
@@ -33587,11 +33681,11 @@ function Page() {
     header: t("Email Setting")
   }, /* @__PURE__ */ React__default.createElement(Space$1, {
     direction: "vertical"
-  }, /* @__PURE__ */ React__default.createElement(TextField, {
+  }, !hideSubject && /* @__PURE__ */ React__default.createElement(TextField, {
     label: t("Subject"),
     name: "subject",
     inline: true
-  }), /* @__PURE__ */ React__default.createElement(TextField, {
+  }), !hideSubTitle && /* @__PURE__ */ React__default.createElement(TextField, {
     label: t("SubTitle"),
     name: "subTitle",
     inline: true
@@ -33617,13 +33711,15 @@ function Page() {
   })), /* @__PURE__ */ React__default.createElement(Grid.Col, {
     offset: 1,
     span: 11
-  }, /* @__PURE__ */ React__default.createElement(InputWithUnitField, {
-    label: t("Font size"),
-    name: `${focusIdx2}.data.value.font-size`
+  }, /* @__PURE__ */ React__default.createElement(NumberField, {
+    label: "Font size (px)",
+    name: `${focusIdx2}.data.value.font-size`,
+    config: pixelAdapter,
+    autoComplete: "off"
   }))), /* @__PURE__ */ React__default.createElement(Grid.Row, null, /* @__PURE__ */ React__default.createElement(Grid.Col, {
     span: 11
   }, /* @__PURE__ */ React__default.createElement(InputWithUnitField, {
-    label: "Line height",
+    label: t("Line height"),
     unitOptions: "percent",
     name: `${focusIdx2}.data.value.line-height`
   })), /* @__PURE__ */ React__default.createElement(Grid.Col, {
@@ -33654,7 +33750,7 @@ function Page() {
   }), /* @__PURE__ */ React__default.createElement(Stack$4.Item, null), /* @__PURE__ */ React__default.createElement(Stack$4.Item, null), /* @__PURE__ */ React__default.createElement(AddFont, null), /* @__PURE__ */ React__default.createElement(Stack$4.Item, null), /* @__PURE__ */ React__default.createElement(Stack$4.Item, null))))));
 }
 function Padding(props = {}) {
-  const { title: title2 = t("Padding"), attributeName = "padding", name: name2 } = props;
+  const { title: title2 = t("Padding"), attributeName = "padding", name: name2, showResetAll } = props;
   const { focusBlock: focusBlock2, change, values: values2 } = useBlock();
   const { focusIdx: focusIdx2 } = useFocusIdx();
   const type = focusBlock2 && focusBlock2.type;
@@ -33692,6 +33788,13 @@ function Padding(props = {}) {
       change(focusIdx2 + `.attributes[${attributeName}]`, val);
     }
   }, [name2, change, focusIdx2, attributeName]);
+  const onResetPadding = useCallback(() => {
+    if (name2) {
+      change(name2, "0px 0px 0px 0px");
+    } else {
+      change(focusIdx2 + `.attributes[${attributeName}]`, "0px 0px 0px 0px");
+    }
+  }, [name2, change, focusIdx2, attributeName]);
   return /* @__PURE__ */ React__default.createElement(Form$3, {
     initialValues: paddingFormValues,
     subscription: { submitting: true, pristine: true },
@@ -33702,30 +33805,49 @@ function Padding(props = {}) {
     return /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, /* @__PURE__ */ React__default.createElement(Stack$4, {
       vertical: true,
       spacing: "extraTight"
+    }, /* @__PURE__ */ React__default.createElement(Space$1, {
+      align: "center"
     }, /* @__PURE__ */ React__default.createElement(TextStyle, {
       variation: "strong"
-    }, title2), /* @__PURE__ */ React__default.createElement(Grid.Row, null, /* @__PURE__ */ React__default.createElement(Grid.Col, {
+    }, title2), showResetAll && /* @__PURE__ */ React__default.createElement(Tooltip$1, {
+      content: "Remove all padding"
+    }, /* @__PURE__ */ React__default.createElement(Button$4, {
+      onClick: onResetPadding,
+      size: "mini",
+      icon: /* @__PURE__ */ React__default.createElement(IconFont, {
+        iconName: "icon-remove",
+        size: 12
+      })
+    }))), /* @__PURE__ */ React__default.createElement(Grid.Row, null, /* @__PURE__ */ React__default.createElement(Grid.Col, {
       span: 11
     }, /* @__PURE__ */ React__default.createElement(InputWithUnitField, {
-      label: "Top",
-      name: "top"
+      label: t("Top (px)"),
+      name: "top",
+      autoComplete: "off",
+      config: pixelAdapter
     })), /* @__PURE__ */ React__default.createElement(Grid.Col, {
       offset: 1,
       span: 11
     }, /* @__PURE__ */ React__default.createElement(InputWithUnitField, {
-      label: "Left",
-      name: "left"
+      label: t("Left (px)"),
+      name: "left",
+      autoComplete: "off",
+      config: pixelAdapter
     }))), /* @__PURE__ */ React__default.createElement(Grid.Row, null, /* @__PURE__ */ React__default.createElement(Grid.Col, {
       span: 11
     }, /* @__PURE__ */ React__default.createElement(InputWithUnitField, {
-      label: "Bottom",
-      name: "bottom"
+      label: t("Bottom (px)"),
+      name: "bottom",
+      config: pixelAdapter,
+      autoComplete: "off"
     })), /* @__PURE__ */ React__default.createElement(Grid.Col, {
       offset: 1,
       span: 11
     }, /* @__PURE__ */ React__default.createElement(InputWithUnitField, {
-      label: "Right",
-      name: "right"
+      label: t("Right (px)"),
+      name: "right",
+      autoComplete: "off",
+      config: pixelAdapter
     })))), /* @__PURE__ */ React__default.createElement(PaddingChangeWrapper, {
       onChange: onChancePadding
     }));
@@ -33741,7 +33863,7 @@ const PaddingChangeWrapper = (props) => {
   }, [top, right, bottom, left, onChange]);
   return /* @__PURE__ */ React__default.createElement(React__default.Fragment, null);
 };
-function BackgroundColor({ title: title2 = "Background color" }) {
+function BackgroundColor({ title: title2 = t("Background color") }) {
   const { focusIdx: focusIdx2 } = useFocusIdx();
   return useMemo(() => {
     return /* @__PURE__ */ React__default.createElement(ColorPickerField, {
@@ -33753,19 +33875,27 @@ function BackgroundColor({ title: title2 = "Background color" }) {
 const backgroundRepeatOptions = [
   {
     value: "no-repeat",
-    label: "No repeat"
+    get label() {
+      return t("No repeat");
+    }
   },
   {
     value: "repeat",
-    label: "Repeat"
+    get label() {
+      return t("Repeat");
+    }
   },
   {
     value: "repeat-x",
-    label: "Repeat X"
+    get label() {
+      return t("Repeat X");
+    }
   },
   {
     value: "repeat-y",
-    label: "Repeat Y"
+    get label() {
+      return t("Repeat Y");
+    }
   }
 ];
 function Background() {
@@ -33776,9 +33906,9 @@ function Background() {
       key: focusIdx2,
       direction: "vertical"
     }, /* @__PURE__ */ React__default.createElement(ImageUploaderField, {
-      label: "Background image",
+      label: t("Background image"),
       name: `${focusIdx2}.attributes.background-url`,
-      helpText: "The image suffix should be .jpg, jpeg, png, gif, etc. Otherwise, the picture may not be displayed normally.",
+      helpText: t("The image suffix should be .jpg, jpeg, png, gif, etc. Otherwise, the picture may not be displayed normally."),
       uploadHandler: onUploadImage
     }), /* @__PURE__ */ React__default.createElement(Grid.Row, null, /* @__PURE__ */ React__default.createElement(Grid.Col, {
       span: 11
@@ -33786,11 +33916,11 @@ function Background() {
       offset: 1,
       span: 11
     }, /* @__PURE__ */ React__default.createElement(SelectField, {
-      label: "Background repeat",
+      label: t("Background repeat"),
       name: `${focusIdx2}.attributes.background-repeat`,
       options: backgroundRepeatOptions
     }))), /* @__PURE__ */ React__default.createElement(TextField, {
-      label: "Background size",
+      label: t("Background size"),
       name: `${focusIdx2}.attributes.background-size`
     }));
   }, [focusIdx2, onUploadImage]);
@@ -33801,13 +33931,13 @@ function Border() {
     return /* @__PURE__ */ React__default.createElement(Grid.Row, null, /* @__PURE__ */ React__default.createElement(Grid.Col, {
       span: 11
     }, /* @__PURE__ */ React__default.createElement(TextField, {
-      label: "Border",
+      label: t("Border"),
       name: `${focusIdx2}.attributes.border`
     })), /* @__PURE__ */ React__default.createElement(Grid.Col, {
       offset: 1,
       span: 11
     }, /* @__PURE__ */ React__default.createElement(InputWithUnitField, {
-      label: "Border radius",
+      label: t("Border radius"),
       name: `${focusIdx2}.attributes.border-radius`,
       unitOptions: "percent"
     })));
@@ -33817,7 +33947,7 @@ function ClassName() {
   const { focusIdx: focusIdx2 } = useFocusIdx();
   return useMemo(() => {
     return /* @__PURE__ */ React__default.createElement(TextField, {
-      label: "Class name",
+      label: t("Class name"),
       name: `${focusIdx2}.attributes.css-class`
     });
   }, [focusIdx2]);
@@ -33849,7 +33979,7 @@ function Iteration() {
     className: "iteration",
     destroyOnHide: true,
     name: "Iteration",
-    header: "Iteration",
+    header: t("Iteration"),
     extra: /* @__PURE__ */ React__default.createElement("div", {
       style: { marginRight: 10 }
     }, /* @__PURE__ */ React__default.createElement(Switch$1, {
@@ -33861,18 +33991,18 @@ function Iteration() {
   }, /* @__PURE__ */ React__default.createElement("div", null, /* @__PURE__ */ React__default.createElement(Grid.Row, null, /* @__PURE__ */ React__default.createElement(Grid.Col, {
     span: 11
   }, /* @__PURE__ */ React__default.createElement(TextField, {
-    label: "Data source",
+    label: t("Data source"),
     name: `${focusIdx2}.data.value.iteration.dataSource`
   })), /* @__PURE__ */ React__default.createElement(Grid.Col, {
     offset: 1,
     span: 11
   }, /* @__PURE__ */ React__default.createElement(TextField, {
-    label: "Item name",
+    label: t("Item name"),
     name: `${focusIdx2}.data.value.iteration.itemName`
   }))), /* @__PURE__ */ React__default.createElement(Grid.Row, null, /* @__PURE__ */ React__default.createElement(Grid.Col, {
     span: 11
   }, /* @__PURE__ */ React__default.createElement(TextField, {
-    label: "Limit",
+    label: t("Limit"),
     name: `${focusIdx2}.data.value.iteration.limit`,
     quickchange: true,
     type: "number",
@@ -33881,7 +34011,7 @@ function Iteration() {
     offset: 1,
     span: 11
   }, /* @__PURE__ */ React__default.createElement(TextField, {
-    label: "Mock quantity",
+    label: t("Mock quantity"),
     max: iteration == null ? void 0 : iteration.limit,
     name: `${focusIdx2}.data.value.iteration.mockQuantity`,
     type: "number",
@@ -33950,7 +34080,7 @@ function Condition() {
     subGroups.splice(ggIndex, 1);
     if (subGroups.length === 0) {
       if (groups.length === 1) {
-        Message$1.warning("At least one condition");
+        Message$1.warning(t("At least one condition"));
         return;
       }
       groups.splice(gIndex, 1);
@@ -33970,7 +34100,7 @@ function Condition() {
     className: "condition",
     destroyOnHide: true,
     name: "Condition",
-    header: "Condition",
+    header: t("Condition"),
     extra: /* @__PURE__ */ React__default.createElement("div", {
       style: { marginRight: 10 }
     }, /* @__PURE__ */ React__default.createElement(Switch$1, {
@@ -33988,14 +34118,14 @@ function Condition() {
     }, condition.groups.length > 1 && /* @__PURE__ */ React__default.createElement(SelectField, {
       inline: true,
       name: `${focusIdx2}.data.value.condition.symbol`,
-      label: "Symbol",
+      label: t("Symbol"),
       options: [
         {
-          label: "And",
+          label: t("And"),
           value: OperatorSymbol.AND
         },
         {
-          label: "Or",
+          label: t("Or"),
           value: OperatorSymbol.OR
         }
       ]
@@ -34015,14 +34145,14 @@ function Condition() {
       }, group.groups.length > 1 && /* @__PURE__ */ React__default.createElement(SelectField, {
         inline: true,
         name: `${focusIdx2}.data.value.condition.symbol`,
-        label: "Symbol",
+        label: t("Symbol"),
         options: [
           {
-            label: "And",
+            label: t("And"),
             value: OperatorSymbol.AND
           },
           {
-            label: "Or",
+            label: t("Or"),
             value: OperatorSymbol.OR
           }
         ]
@@ -34050,12 +34180,12 @@ function ConditionItem({ path, onDelete, gIndex, ggIndex }) {
   }, /* @__PURE__ */ React__default.createElement(Grid.Col, {
     span: 7
   }, " ", /* @__PURE__ */ React__default.createElement(TextField, {
-    label: "Variable path",
+    label: t("Variable path"),
     name: `${name2}.left`
   })), /* @__PURE__ */ React__default.createElement(Grid.Col, {
     span: 7
   }, " ", /* @__PURE__ */ React__default.createElement(SelectField, {
-    label: "Operator",
+    label: t("Operator"),
     name: `${name2}.operator`,
     options: options$b
   })), /* @__PURE__ */ React__default.createElement(Grid.Col, {
@@ -34145,7 +34275,7 @@ function Section() {
     defaultActiveKey: ["0", "1", "2"]
   }, /* @__PURE__ */ React__default.createElement(Collapse$1.Item, {
     name: "0",
-    header: "Dimension"
+    header: t("Dimension")
   }, /* @__PURE__ */ React__default.createElement(Space$1, {
     direction: "vertical"
   }, /* @__PURE__ */ React__default.createElement(Grid.Row, null, /* @__PURE__ */ React__default.createElement(Grid.Col, {
@@ -34154,32 +34284,33 @@ function Section() {
     style: { width: "100%", display: "flex" }
   }, /* @__PURE__ */ React__default.createElement("div", {
     style: { flex: 1 }
-  }, "Group")), /* @__PURE__ */ React__default.createElement(Switch$1, {
+  }, t("Group"))), /* @__PURE__ */ React__default.createElement(Switch$1, {
     checked: noWrap,
-    checkedText: "True",
-    uncheckedText: "False",
+    checkedText: t("True"),
+    uncheckedText: t("False"),
     onChange
   })), /* @__PURE__ */ React__default.createElement(Grid.Col, {
     span: 12
   })), /* @__PURE__ */ React__default.createElement(Padding, null))), /* @__PURE__ */ React__default.createElement(Collapse$1.Item, {
     name: "1",
-    header: "Background"
+    header: t("Background")
   }, /* @__PURE__ */ React__default.createElement(Stack$4, {
     vertical: true,
     spacing: "tight"
   }, /* @__PURE__ */ React__default.createElement(Background, null))), /* @__PURE__ */ React__default.createElement(Collapse$1.Item, {
     name: "2",
-    header: "Border"
+    header: t("Border")
   }, /* @__PURE__ */ React__default.createElement(Border, null)), /* @__PURE__ */ React__default.createElement(Collapse$1.Item, {
     name: "4",
-    header: "Extra"
+    header: t("Extra")
   }, /* @__PURE__ */ React__default.createElement(Grid.Col, {
     span: 24
   }, /* @__PURE__ */ React__default.createElement(ClassName, null)))));
 }
 function Width({
   inline = false,
-  unitOptions
+  unitOptions,
+  config: config2
 }) {
   var _a;
   const { focusIdx: focusIdx2 } = useFocusIdx();
@@ -34187,30 +34318,37 @@ function Width({
   const parentType = (_a = getParentByIdx(values2, focusIdx2)) == null ? void 0 : _a.type;
   const validate3 = useCallback((val) => {
     if ((focusBlock2 == null ? void 0 : focusBlock2.type) === BasicType.COLUMN && parentType === BasicType.GROUP) {
-      return /(\d)*%/.test(val) ? void 0 : "Column inside a group must have a width in percentage, not in pixel";
+      return /(\d)*%/.test(val) ? void 0 : t("Column inside a group must have a width in percentage, not in pixel");
     }
     return void 0;
   }, [focusBlock2 == null ? void 0 : focusBlock2.type, parentType]);
   return /* @__PURE__ */ React__default.createElement(InputWithUnitField, {
     validate: validate3,
-    label: "Width",
+    label: t("Width"),
     inline,
     name: `${focusIdx2}.attributes.width`,
-    unitOptions
+    unitOptions,
+    config: config2
   });
 }
 const options$a = [
   {
     value: "top",
-    label: "top"
+    get label() {
+      return t("top");
+    }
   },
   {
     value: "middle",
-    label: "middle"
+    get label() {
+      return t("middle");
+    }
   },
   {
     value: "bottom",
-    label: "bottom"
+    get label() {
+      return t("bottom");
+    }
   }
 ];
 function VerticalAlign({
@@ -34220,7 +34358,7 @@ function VerticalAlign({
   return useMemo(() => {
     return /* @__PURE__ */ React__default.createElement(Stack$4, null, /* @__PURE__ */ React__default.createElement(SelectField, {
       style: { width: 120 },
-      label: "Vertical align",
+      label: t("Vertical align"),
       name: `${focusIdx2}.attributes.${attributeName}`,
       options: options$a
     }));
@@ -34231,7 +34369,7 @@ function Column() {
     defaultActiveKey: ["0", "1", "2"]
   }, /* @__PURE__ */ React__default.createElement(Collapse$1.Item, {
     name: "0",
-    header: "Dimension"
+    header: t("Dimension")
   }, /* @__PURE__ */ React__default.createElement(Space$1, {
     direction: "vertical"
   }, /* @__PURE__ */ React__default.createElement(Grid.Row, null, /* @__PURE__ */ React__default.createElement(Grid.Col, {
@@ -34241,13 +34379,13 @@ function Column() {
     span: 11
   }, /* @__PURE__ */ React__default.createElement(VerticalAlign, null))), /* @__PURE__ */ React__default.createElement(Padding, null))), /* @__PURE__ */ React__default.createElement(Collapse$1.Item, {
     name: "1",
-    header: "Background"
+    header: t("Background")
   }, /* @__PURE__ */ React__default.createElement(Background, null)), /* @__PURE__ */ React__default.createElement(Collapse$1.Item, {
     name: "2",
-    header: "Border"
+    header: t("Border")
   }, /* @__PURE__ */ React__default.createElement(Border, null)), /* @__PURE__ */ React__default.createElement(Collapse$1.Item, {
     name: "4",
-    header: "Extra"
+    header: t("Extra")
   }, /* @__PURE__ */ React__default.createElement(Grid.Col, {
     span: 24
   }, /* @__PURE__ */ React__default.createElement(ClassName, null)))));
@@ -34255,34 +34393,46 @@ function Column() {
 const options$9 = [
   {
     value: "",
-    label: "None"
+    get label() {
+      return t("None");
+    }
   },
   {
     value: "underline",
-    label: "Underline"
+    get label() {
+      return t("Underline");
+    }
   },
   {
     value: "overline",
-    label: "Overline"
+    get label() {
+      return t("Overline");
+    }
   },
   {
     value: "line-through",
-    label: "Line through"
+    get label() {
+      return t("Line through");
+    }
   },
   {
     value: "blink",
-    label: "Blink"
+    get label() {
+      return t("Blink");
+    }
   },
   {
     value: "inherit",
-    label: "Inherit"
+    get label() {
+      return t("Inherit");
+    }
   }
 ];
 function TextDecoration({ name: name2 }) {
   const { focusIdx: focusIdx2 } = useFocusIdx();
   return useMemo(() => {
     return /* @__PURE__ */ React__default.createElement(SelectField, {
-      label: "Text decoration",
+      label: t("Text decoration"),
       name: name2 || `${focusIdx2}.attributes.text-decoration`,
       options: options$9
     });
@@ -34291,11 +34441,15 @@ function TextDecoration({ name: name2 }) {
 const options$8 = [
   {
     value: "normal",
-    label: "Normal"
+    get label() {
+      return t("Normal");
+    }
   },
   {
     value: "bold",
-    label: "Bold"
+    get label() {
+      return t("Bold");
+    }
   },
   {
     value: "100",
@@ -34338,7 +34492,7 @@ function FontWeight({ name: name2 }) {
   const { focusIdx: focusIdx2 } = useFocusIdx();
   return useMemo(() => {
     return /* @__PURE__ */ React__default.createElement(SelectField, {
-      label: "Font weight",
+      label: t("Font weight"),
       name: name2 || `${focusIdx2}.attributes.font-weight`,
       options: options$8
     });
@@ -34347,22 +34501,29 @@ function FontWeight({ name: name2 }) {
 const options$7 = [
   {
     value: "normal",
-    label: "Normal"
+    get label() {
+      return t("Normal");
+    }
   },
   {
     value: "italic",
-    label: "Italic"
+    get label() {
+      return t("Italic");
+    }
   }
 ];
 function FontStyle({ name: name2 }) {
   const { focusIdx: focusIdx2 } = useFocusIdx();
   return /* @__PURE__ */ React__default.createElement(RadioGroupField, {
-    label: "Font style",
+    label: t("Font style"),
     name: name2 || `${focusIdx2}.attributes.font-style`,
     options: options$7
   });
 }
-function Height({ inline }) {
+function Height({
+  inline,
+  config: config2
+}) {
   const { focusIdx: focusIdx2 } = useFocusIdx();
   return useMemo(() => {
     return /* @__PURE__ */ React__default.createElement(Stack$4, {
@@ -34370,15 +34531,16 @@ function Height({ inline }) {
     }, /* @__PURE__ */ React__default.createElement(Stack$4.Item, {
       fill: true
     }, /* @__PURE__ */ React__default.createElement(TextField, {
-      label: "Height",
+      label: t("Height"),
       name: `${focusIdx2}.attributes.height`,
       quickchange: true,
-      inline
+      inline,
+      config: config2
     })));
   }, [focusIdx2, inline]);
 }
 function ContainerBackgroundColor({
-  title: title2 = "Container background color"
+  title: title2 = t("Container background color")
 }) {
   const { focusIdx: focusIdx2 } = useFocusIdx();
   return useMemo(() => {
@@ -34391,11 +34553,13 @@ function ContainerBackgroundColor({
 function FontSize$1() {
   const { focusIdx: focusIdx2 } = useFocusIdx();
   return /* @__PURE__ */ React__default.createElement(InputWithUnitField, {
-    label: "Font size",
-    name: `${focusIdx2}.attributes.font-size`
+    label: t("Font size (px)"),
+    name: `${focusIdx2}.attributes.font-size`,
+    config: pixelAdapter,
+    autoComplete: "off"
   });
 }
-function Color({ title: title2 = "Color" }) {
+function Color({ title: title2 = t("Color") }) {
   const { focusIdx: focusIdx2 } = useFocusIdx();
   return /* @__PURE__ */ React__default.createElement(ColorPickerField, {
     label: title2,
@@ -34433,7 +34597,7 @@ function Align({ inline }) {
 function LineHeight({ name: name2 }) {
   const { focusIdx: focusIdx2 } = useFocusIdx();
   return /* @__PURE__ */ React__default.createElement(InputWithUnitField, {
-    label: "Line height",
+    label: t("Line height"),
     unitOptions: "percent",
     name: name2 || `${focusIdx2}.attributes.line-height`
   });
@@ -34441,7 +34605,7 @@ function LineHeight({ name: name2 }) {
 function LetterSpacing({ name: name2 }) {
   const { focusIdx: focusIdx2 } = useFocusIdx();
   return /* @__PURE__ */ React__default.createElement(InputWithUnitField, {
-    label: "Letter spacing",
+    label: t("Letter spacing"),
     name: name2 || `${focusIdx2}.attributes.letter-spacing`
   });
 }
@@ -34501,10 +34665,10 @@ const HtmlEditor = (props) => {
     }, /* @__PURE__ */ React__default.createElement(TextStyle, {
       variation: "strong",
       size: "large"
-    }, "Html"), /* @__PURE__ */ React__default.createElement(Stack$4, null, /* @__PURE__ */ React__default.createElement(Button$4, {
+    }, t("Html")), /* @__PURE__ */ React__default.createElement(Stack$4, null, /* @__PURE__ */ React__default.createElement(Button$4, {
       type: "primary",
       onClick: onSave
-    }, "Save"))),
+    }, t("Save")))),
     closable: false,
     escToExit: false,
     width: "100vw",
@@ -34527,7 +34691,7 @@ const HtmlEditor = (props) => {
         fontSize: 24,
         color: "#fff"
       }
-    }, "Editor Loading...")
+    }, t("Editor Loading..."))
   }, /* @__PURE__ */ React__default.createElement(CodeMirrorEditor, {
     value: content,
     onChange: setContent
@@ -34548,7 +34712,7 @@ function Text() {
   const [visible, setVisible] = useState(false);
   return /* @__PURE__ */ React__default.createElement(AttributesPanelWrapper, {
     extra: /* @__PURE__ */ React__default.createElement(Tooltip$1, {
-      content: "Html mode"
+      content: t("Html mode")
     }, /* @__PURE__ */ React__default.createElement(Button$4, {
       onClick: () => setVisible(true),
       icon: /* @__PURE__ */ React__default.createElement(IconFont, {
@@ -34559,22 +34723,24 @@ function Text() {
     defaultActiveKey: ["0", "1", "2"]
   }, /* @__PURE__ */ React__default.createElement(Collapse$1.Item, {
     name: "0",
-    header: "Dimension"
+    header: t("Dimension")
   }, /* @__PURE__ */ React__default.createElement(Space$1, {
     direction: "vertical"
-  }, /* @__PURE__ */ React__default.createElement(Height, null), /* @__PURE__ */ React__default.createElement(Padding, null))), /* @__PURE__ */ React__default.createElement(Collapse$1.Item, {
+  }, /* @__PURE__ */ React__default.createElement(Height, null), /* @__PURE__ */ React__default.createElement(Padding, {
+    showResetAll: true
+  }))), /* @__PURE__ */ React__default.createElement(Collapse$1.Item, {
     name: "1",
-    header: "Color"
+    header: t("Color")
   }, /* @__PURE__ */ React__default.createElement(Grid.Row, null, /* @__PURE__ */ React__default.createElement(Grid.Col, {
     span: 11
   }, /* @__PURE__ */ React__default.createElement(Color, null)), /* @__PURE__ */ React__default.createElement(Grid.Col, {
     offset: 1,
     span: 11
   }, /* @__PURE__ */ React__default.createElement(ContainerBackgroundColor, {
-    title: "Background color"
+    title: t("Background color")
   })))), /* @__PURE__ */ React__default.createElement(Collapse$1.Item, {
     name: "2",
-    header: "Typography"
+    header: t("Typography")
   }, /* @__PURE__ */ React__default.createElement(Space$1, {
     direction: "vertical"
   }, /* @__PURE__ */ React__default.createElement(Grid.Row, null, /* @__PURE__ */ React__default.createElement(Grid.Col, {
@@ -34599,7 +34765,7 @@ function Text() {
     span: 11
   })))), /* @__PURE__ */ React__default.createElement(Collapse$1.Item, {
     name: "4",
-    header: "Extra"
+    header: t("Extra")
   }, /* @__PURE__ */ React__default.createElement(Grid.Col, {
     span: 24
   }, /* @__PURE__ */ React__default.createElement(ClassName, null)))), /* @__PURE__ */ React__default.createElement(HtmlEditor, {
@@ -34614,22 +34780,22 @@ function Link() {
       span: 11
     }, /* @__PURE__ */ React__default.createElement(TextField, {
       prefix: /* @__PURE__ */ React__default.createElement(IconLink$1, null),
-      label: /* @__PURE__ */ React__default.createElement("span", null, "Href\xA0\xA0\xA0"),
+      label: /* @__PURE__ */ React__default.createElement("span", null, t("Href"), "\xA0\xA0\xA0"),
       name: `${focusIdx2}.attributes.href`
     })), /* @__PURE__ */ React__default.createElement(Grid.Col, {
       offset: 1,
       span: 11
     }, /* @__PURE__ */ React__default.createElement(SelectField, {
-      label: "Target",
+      label: t("Target"),
       name: `${focusIdx2}.attributes.target`,
       options: [
         {
           value: "",
-          label: "_self"
+          label: t("_self")
         },
         {
           value: "_blank",
-          label: "_blank"
+          label: t("_blank")
         }
       ]
     })));
@@ -34644,59 +34810,65 @@ function Image$1() {
     defaultActiveKey: ["0", "1", "2", "3", "4"]
   }, /* @__PURE__ */ React__default.createElement(Collapse$1.Item, {
     name: "1",
-    header: "Setting"
+    header: t("Setting")
   }, /* @__PURE__ */ React__default.createElement(Stack$4, {
     vertical: true,
     spacing: "tight"
   }, /* @__PURE__ */ React__default.createElement(ImageUploaderField, {
-    label: "src",
+    label: t("src"),
     labelHidden: true,
     name: `${focusIdx2}.attributes.src`,
-    helpText: "The image suffix should be .jpg, jpeg, png, gif, etc. Otherwise, the picture may not be displayed normally.",
+    helpText: t("The image suffix should be .jpg, jpeg, png, gif, etc. Otherwise, the picture may not be displayed normally."),
     uploadHandler: onUploadImage
   }), /* @__PURE__ */ React__default.createElement(ColorPickerField, {
-    label: "Background color",
+    label: t("Background color"),
     name: `${focusIdx2}.attributes.container-background-color`,
     inline: true
   }))), /* @__PURE__ */ React__default.createElement(Collapse$1.Item, {
     name: "0",
-    header: "Dimension"
+    header: t("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, {
+  }, /* @__PURE__ */ React__default.createElement(Width, {
+    config: pixelAdapter
+  })), /* @__PURE__ */ React__default.createElement(Grid.Col, {
     offset: 1,
     span: 11
-  }, /* @__PURE__ */ React__default.createElement(Height, null))), /* @__PURE__ */ React__default.createElement(Padding, null), /* @__PURE__ */ React__default.createElement(Grid.Row, null, /* @__PURE__ */ React__default.createElement(Grid.Col, {
+  }, /* @__PURE__ */ React__default.createElement(Height, {
+    config: imageHeightAdapter
+  }))), /* @__PURE__ */ React__default.createElement(Padding, {
+    showResetAll: true
+  }), /* @__PURE__ */ React__default.createElement(Grid.Row, null, /* @__PURE__ */ React__default.createElement(Grid.Col, {
     span: 24
   }, /* @__PURE__ */ React__default.createElement(Align, null))))), /* @__PURE__ */ React__default.createElement(Collapse$1.Item, {
     name: "2",
-    header: "Link"
+    header: t("Link")
   }, /* @__PURE__ */ React__default.createElement(Stack$4, {
     vertical: true,
     spacing: "tight"
   }, /* @__PURE__ */ React__default.createElement(Link, null))), /* @__PURE__ */ React__default.createElement(Collapse$1.Item, {
     name: "3",
-    header: "Border"
+    header: t("Border")
   }, /* @__PURE__ */ React__default.createElement(Border, null)), /* @__PURE__ */ React__default.createElement(Collapse$1.Item, {
     name: "4",
-    header: "Extra"
+    header: t("Extra")
   }, /* @__PURE__ */ React__default.createElement(Grid.Row, null, /* @__PURE__ */ React__default.createElement(Grid.Col, {
     span: 11
   }, /* @__PURE__ */ React__default.createElement(TextField, {
-    label: "title",
+    label: t("title"),
     name: `${focusIdx2}.attributes.title`
   })), /* @__PURE__ */ React__default.createElement(Grid.Col, {
     offset: 1,
     span: 11
   }, /* @__PURE__ */ React__default.createElement(TextField, {
-    label: "alt",
+    label: t("alt"),
     name: `${focusIdx2}.attributes.alt`
   }))), /* @__PURE__ */ React__default.createElement(Grid.Col, {
     span: 24
   }, /* @__PURE__ */ React__default.createElement(TextField, {
-    label: "class name",
+    label: t("class name"),
     name: `${focusIdx2}.attributes.css-class`
   })))));
 }
@@ -34705,7 +34877,7 @@ function Group() {
     defaultActiveKey: ["0", "1", "2"]
   }, /* @__PURE__ */ React__default.createElement(Collapse$1.Item, {
     name: "0",
-    header: "Dimension"
+    header: t("Dimension")
   }, /* @__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, {
@@ -34713,7 +34885,7 @@ function Group() {
     span: 11
   }, /* @__PURE__ */ React__default.createElement(VerticalAlign, null)))), /* @__PURE__ */ React__default.createElement(Collapse$1.Item, {
     name: "1",
-    header: "Background"
+    header: t("Background")
   }, /* @__PURE__ */ React__default.createElement(Grid.Row, null, /* @__PURE__ */ React__default.createElement(Grid.Col, {
     span: 11
   }, /* @__PURE__ */ React__default.createElement(BackgroundColor, null)), /* @__PURE__ */ React__default.createElement(Grid.Col, {
@@ -34721,7 +34893,7 @@ function Group() {
     span: 11
   }))), /* @__PURE__ */ React__default.createElement(Collapse$1.Item, {
     name: "4",
-    header: "Extra"
+    header: t("Extra")
   }, /* @__PURE__ */ React__default.createElement(Grid.Col, {
     span: 24
   }, /* @__PURE__ */ React__default.createElement(ClassName, null)))));
@@ -34729,15 +34901,21 @@ function Group() {
 const options$5 = [
   {
     value: "left",
-    label: "Left"
+    get label() {
+      return t("Left");
+    }
   },
   {
     value: "center",
-    label: "Center"
+    get label() {
+      return t("Center");
+    }
   },
   {
     value: "right",
-    label: "Right"
+    get label() {
+      return t("Right");
+    }
   }
 ];
 function TextAlign({ name: name2 }) {
@@ -34761,15 +34939,15 @@ function Decoration() {
       variation: "strong",
       size: "large"
     }, "Decoration"), /* @__PURE__ */ React__default.createElement(TextField, {
-      label: "Border radius",
+      label: t("Border radius"),
       name: `${focusIdx2}.attributes.borderRadius`,
       inline: true
     }), /* @__PURE__ */ React__default.createElement(TextField, {
-      label: "Border",
+      label: t("Border"),
       name: `${focusIdx2}.attributes.border`,
       inline: true
     }), /* @__PURE__ */ React__default.createElement(NumberField, {
-      label: "Opacity",
+      label: t("Opacity"),
       max: 1,
       min: 0,
       step: 0.1,
@@ -34781,26 +34959,34 @@ function Decoration() {
 const options$4 = [
   {
     value: "initial",
-    label: "none"
+    get label() {
+      return t("None");
+    }
   },
   {
     value: "uppercase",
-    label: "uppercase"
+    get label() {
+      return t("uppercase");
+    }
   },
   {
     value: "lowercase",
-    label: "lowercase"
+    get label() {
+      return t("lowercase");
+    }
   },
   {
     value: "capitalize",
-    label: "capitalize"
+    get label() {
+      return t("capitalize");
+    }
   }
 ];
 function TextTransform({ name: name2 }) {
   const { focusIdx: focusIdx2 } = useFocusIdx();
   return useMemo(() => {
     return /* @__PURE__ */ React__default.createElement(SelectField, {
-      label: "Text transform",
+      label: t("Text transform"),
       name: name2 || `${focusIdx2}.attributes.text-transform`,
       options: options$4
     });
@@ -34809,18 +34995,22 @@ function TextTransform({ name: name2 }) {
 const options$3 = [
   {
     value: "ltr",
-    label: "ltr"
+    get label() {
+      return t("ltr");
+    }
   },
   {
     value: "rtl",
-    label: "rtl"
+    get label() {
+      return t("rtl");
+    }
   }
 ];
 function Direction() {
   const { focusIdx: focusIdx2 } = useFocusIdx();
   return useMemo(() => {
     return /* @__PURE__ */ React__default.createElement(Stack$4, null, /* @__PURE__ */ React__default.createElement(RadioGroupField, {
-      label: "Direction",
+      label: t("Direction"),
       name: `${focusIdx2}.attributes.direction`,
       options: options$3,
       inline: true
@@ -34835,19 +35025,19 @@ function Margin() {
       spacing: "extraTight"
     }, /* @__PURE__ */ React__default.createElement(TextStyle, {
       size: "large"
-    }, "Margin"), /* @__PURE__ */ React__default.createElement(Stack$4, {
+    }, t("Margin")), /* @__PURE__ */ React__default.createElement(Stack$4, {
       wrap: false
     }, /* @__PURE__ */ React__default.createElement(Stack$4.Item, {
       fill: true
     }, /* @__PURE__ */ React__default.createElement(TextField, {
-      label: "Top",
+      label: t("Top"),
       quickchange: true,
       name: `${focusIdx2}.attributes.marginTop`,
       inline: true
     })), /* @__PURE__ */ React__default.createElement(Stack$4.Item, {
       fill: true
     }, /* @__PURE__ */ React__default.createElement(TextField, {
-      label: "Bottom",
+      label: t("Bottom"),
       quickchange: true,
       name: `${focusIdx2}.attributes.marginBottom`,
       inline: true
@@ -34856,14 +35046,14 @@ function Margin() {
     }, /* @__PURE__ */ React__default.createElement(Stack$4.Item, {
       fill: true
     }, /* @__PURE__ */ React__default.createElement(TextField, {
-      label: "Left",
+      label: t("Left"),
       quickchange: true,
       name: `${focusIdx2}.attributes.marginLeft`,
       inline: true
     })), /* @__PURE__ */ React__default.createElement(Stack$4.Item, {
       fill: true
     }, /* @__PURE__ */ React__default.createElement(TextField, {
-      label: "Right",
+      label: t("Right"),
       quickchange: true,
       name: `${focusIdx2}.attributes.marginRight`,
       inline: true
@@ -34874,7 +35064,7 @@ function BorderColor() {
   const { focusIdx: focusIdx2 } = useFocusIdx();
   return useMemo(() => {
     return /* @__PURE__ */ React__default.createElement(ColorPickerField, {
-      label: "Color",
+      label: t("Color"),
       name: `${focusIdx2}.attributes.border-color`
     });
   }, [focusIdx2]);
@@ -34974,7 +35164,7 @@ const MergeTags$1 = React__default.memo((props) => {
     value: props.value,
     size: "small",
     dropdownMenuStyle: { maxHeight: 400, overflow: "auto" },
-    placeholder: "Please select",
+    placeholder: t("Please select"),
     treeData: treeOptions,
     onChange: (val) => onSelect(val)
   }) : /* @__PURE__ */ React__default.createElement(Tree$1, {
@@ -34992,42 +35182,58 @@ const MergeTags$1 = React__default.memo((props) => {
 const borderStyleOptions = [
   {
     value: "dashed",
-    label: "Dashed"
+    get label() {
+      return t("Dashed");
+    }
   },
   {
     value: "dotted",
-    label: "Dotted"
+    get label() {
+      return t("Dotted");
+    }
   },
   {
     value: "solid",
-    label: "Solid"
+    get label() {
+      return t("Solid");
+    }
   },
   {
     value: "double",
-    label: "double"
+    get label() {
+      return t("double");
+    }
   },
   {
     value: "ridge",
-    label: "ridge"
+    get label() {
+      return t("ridge");
+    }
   },
   {
     value: "groove",
-    label: "groove"
+    get label() {
+      return t("groove");
+    }
   },
   {
     value: "inset",
-    label: "inset"
+    get label() {
+      return t("inset");
+    }
   },
   {
     value: "outset",
-    label: "outset"
+    get label() {
+      return t("outset");
+    }
   }
 ];
 function BorderStyle() {
   const { focusIdx: focusIdx2 } = useFocusIdx();
   return useMemo(() => {
     return /* @__PURE__ */ React__default.createElement(SelectField, {
-      label: "Style",
+      label: t("Style"),
       name: `${focusIdx2}.attributes.border-style`,
       options: borderStyleOptions
     });
@@ -35047,7 +35253,7 @@ function BorderWidth() {
   const { focusIdx: focusIdx2 } = useFocusIdx();
   return useMemo(() => {
     return /* @__PURE__ */ React__default.createElement(TextField, {
-      label: "Width",
+      label: t("Width"),
       quickchange: true,
       name: `${focusIdx2}.attributes.border-width`
     });
@@ -35063,11 +35269,11 @@ function Button() {
     defaultActiveKey: ["-1", "0", "1", "2", "3"]
   }, /* @__PURE__ */ React__default.createElement(Collapse$1.Item, {
     name: "-1",
-    header: "Setting"
+    header: t("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, {
+    label: /* @__PURE__ */ React__default.createElement(Space$1, null, /* @__PURE__ */ React__default.createElement("span", null, t("Content")), mergeTags2 && /* @__PURE__ */ React__default.createElement(Popover$1, {
       trigger: "click",
       content: /* @__PURE__ */ React__default.createElement(MergeTags$1, {
         value: input.value,
@@ -35082,7 +35288,7 @@ function Button() {
     name: `${focusIdx2}.data.value.content`
   }), /* @__PURE__ */ React__default.createElement(Link, null))), /* @__PURE__ */ React__default.createElement(Collapse$1.Item, {
     name: "0",
-    header: "Dimension"
+    header: t("Dimension")
   }, /* @__PURE__ */ React__default.createElement(Space$1, {
     direction: "vertical"
   }, /* @__PURE__ */ React__default.createElement(Grid.Row, null, /* @__PURE__ */ React__default.createElement(Grid.Col, {
@@ -35091,32 +35297,33 @@ function Button() {
     offset: 1,
     span: 11
   }, /* @__PURE__ */ React__default.createElement(FontWeight, null))), /* @__PURE__ */ React__default.createElement(Padding, {
-    title: "Padding",
-    attributeName: "padding"
+    title: t("Padding"),
+    attributeName: "padding",
+    showResetAll: true
   }), /* @__PURE__ */ React__default.createElement(Padding, {
-    title: "Inner padding",
+    title: t("Inner padding"),
     attributeName: "inner-padding"
   }))), /* @__PURE__ */ React__default.createElement(Collapse$1.Item, {
     name: "1",
-    header: "Color"
+    header: t("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"
+    title: t("Text color")
   })), /* @__PURE__ */ React__default.createElement(Grid.Col, {
     offset: 1,
     span: 11
   }, /* @__PURE__ */ React__default.createElement(BackgroundColor, {
-    title: "Button color"
+    title: t("Button color")
   })), /* @__PURE__ */ React__default.createElement(Grid.Col, {
     span: 11
   }, /* @__PURE__ */ React__default.createElement(ContainerBackgroundColor, {
-    title: "Background color"
+    title: t("Background color")
   }))))), /* @__PURE__ */ React__default.createElement(Collapse$1.Item, {
     name: "2",
-    header: "Typography"
+    header: t("Typography")
   }, /* @__PURE__ */ React__default.createElement(Space$1, {
     direction: "vertical"
   }, /* @__PURE__ */ React__default.createElement(Grid.Row, null, /* @__PURE__ */ React__default.createElement(Grid.Col, {
@@ -35136,10 +35343,10 @@ function Button() {
     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"
+    header: t("Border")
   }, /* @__PURE__ */ React__default.createElement(Border, null)), /* @__PURE__ */ React__default.createElement(Collapse$1.Item, {
     name: "4",
-    header: "Extra"
+    header: t("Extra")
   }, /* @__PURE__ */ React__default.createElement(Grid.Col, {
     span: 24
   }, /* @__PURE__ */ React__default.createElement(ClassName, null)))));
@@ -35149,7 +35356,7 @@ function Divider() {
     defaultActiveKey: ["-1", "0", "1", "2", "3"]
   }, /* @__PURE__ */ React__default.createElement(Collapse$1.Item, {
     name: "1",
-    header: "Dimension"
+    header: t("Dimension")
   }, /* @__PURE__ */ React__default.createElement(Space$1, {
     direction: "vertical"
   }, /* @__PURE__ */ React__default.createElement(Grid.Row, null, /* @__PURE__ */ React__default.createElement(Grid.Col, {
@@ -35161,7 +35368,7 @@ function Divider() {
     span: 11
   })), /* @__PURE__ */ React__default.createElement(Align, null), /* @__PURE__ */ React__default.createElement(Padding, null))), /* @__PURE__ */ React__default.createElement(Collapse$1.Item, {
     name: "2",
-    header: "Border"
+    header: t("Border")
   }, /* @__PURE__ */ React__default.createElement(Stack$4, {
     wrap: false,
     spacing: "tight"
@@ -35173,17 +35380,17 @@ function Divider() {
     style: { width: 100 }
   }, /* @__PURE__ */ React__default.createElement(BorderColor, null)))), /* @__PURE__ */ React__default.createElement(Collapse$1.Item, {
     name: "3",
-    header: "Background"
+    header: t("Background")
   }, /* @__PURE__ */ React__default.createElement(Grid.Row, null, /* @__PURE__ */ React__default.createElement(Grid.Col, {
     span: 11
   }, /* @__PURE__ */ React__default.createElement(ContainerBackgroundColor, {
-    title: "Background"
+    title: t("Background")
   })), /* @__PURE__ */ React__default.createElement(Grid.Col, {
     offset: 1,
     span: 11
   }))), /* @__PURE__ */ React__default.createElement(Collapse$1.Item, {
     name: "4",
-    header: "Extra"
+    header: t("Extra")
   }, /* @__PURE__ */ React__default.createElement(Grid.Col, {
     span: 24
   }, /* @__PURE__ */ React__default.createElement(ClassName, null)))));
@@ -35196,33 +35403,33 @@ function Wrapper() {
     defaultActiveKey: ["0", "1", "2"]
   }, /* @__PURE__ */ React__default.createElement(Collapse$1.Item, {
     name: "0",
-    header: "Dimension"
+    header: t("Dimension")
   }, /* @__PURE__ */ React__default.createElement(Stack$4, {
     vertical: true,
     spacing: "tight"
   }, /* @__PURE__ */ React__default.createElement(Padding, null))), /* @__PURE__ */ React__default.createElement(Collapse$1.Item, {
     name: "1",
-    header: "Background"
+    header: t("Background")
   }, /* @__PURE__ */ React__default.createElement(Stack$4, {
     vertical: true,
     spacing: "tight"
   }, /* @__PURE__ */ React__default.createElement(Background, null))), /* @__PURE__ */ React__default.createElement(Collapse$1.Item, {
     name: "2",
-    header: "Border"
+    header: t("Border")
   }, /* @__PURE__ */ React__default.createElement(Stack$4, {
     vertical: true,
     spacing: "tight"
   }, /* @__PURE__ */ React__default.createElement(TextField, {
-    label: "Border",
+    label: t("Border"),
     name: `${focusIdx2}.attributes.border`,
     inline: true
   }), /* @__PURE__ */ React__default.createElement(TextField, {
-    label: "Background border radius",
+    label: t("Background border radius"),
     name: `${focusIdx2}.attributes.border-radius`,
     inline: true
   }))), /* @__PURE__ */ React__default.createElement(Collapse$1.Item, {
     name: "4",
-    header: "Extra"
+    header: t("Extra")
   }, /* @__PURE__ */ React__default.createElement(Grid.Col, {
     span: 24
   }, /* @__PURE__ */ React__default.createElement(ClassName, null)))));
@@ -35232,17 +35439,17 @@ function Spacer() {
     defaultActiveKey: ["-1", "0", "1", "2", "3"]
   }, /* @__PURE__ */ React__default.createElement(Collapse$1.Item, {
     name: "1",
-    header: "Dimension"
+    header: t("Dimension")
   }, /* @__PURE__ */ React__default.createElement(Space$1, {
     direction: "vertical"
   }, /* @__PURE__ */ React__default.createElement(Height, null), /* @__PURE__ */ React__default.createElement(Padding, null))), /* @__PURE__ */ React__default.createElement(Collapse$1.Item, {
     name: "2",
-    header: "Background"
+    header: t("Background")
   }, /* @__PURE__ */ React__default.createElement(ContainerBackgroundColor, {
-    title: "Background color"
+    title: t("Background color")
   })), /* @__PURE__ */ React__default.createElement(Collapse$1.Item, {
     name: "4",
-    header: "Extra"
+    header: t("Extra")
   }, /* @__PURE__ */ React__default.createElement(Grid.Col, {
     span: 24
   }, /* @__PURE__ */ React__default.createElement(ClassName, null)))));
@@ -35253,7 +35460,7 @@ function Raw() {
   return /* @__PURE__ */ React__default.createElement(AttributesPanelWrapper, {
     style: { padding: 20 },
     extra: /* @__PURE__ */ React__default.createElement(Tooltip$1, {
-      content: "Html mode"
+      content: t("Html mode")
     }, /* @__PURE__ */ React__default.createElement(Button$4, {
       onClick: () => setVisible(true),
       icon: /* @__PURE__ */ React__default.createElement(IconFont, {
@@ -35272,25 +35479,35 @@ function Raw() {
 const positionOptions = [
   {
     value: "left",
-    label: "Left"
+    get label() {
+      return t("Left");
+    }
   },
   {
     value: "right",
-    label: "Right"
+    get label() {
+      return t("Right");
+    }
   }
 ];
 const alignOptions = [
   {
     value: "top",
-    label: "top"
+    get label() {
+      return t("top");
+    }
   },
   {
     value: "middle",
-    label: "middle"
+    get label() {
+      return t("middle");
+    }
   },
   {
     value: "bottom",
-    label: "bottom"
+    get label() {
+      return t("bottom");
+    }
   }
 ];
 function Accordion() {
@@ -35300,7 +35517,7 @@ function Accordion() {
     defaultActiveKey: ["0", "1", "2"]
   }, /* @__PURE__ */ React__default.createElement(Collapse$1.Item, {
     name: "0",
-    header: "Setting"
+    header: t("Setting")
   }, /* @__PURE__ */ React__default.createElement(Space$1, {
     direction: "vertical"
   }, /* @__PURE__ */ React__default.createElement(Grid.Row, null, /* @__PURE__ */ React__default.createElement(Grid.Col, {
@@ -35311,31 +35528,31 @@ function Accordion() {
   }, /* @__PURE__ */ React__default.createElement(FontFamily, null))), /* @__PURE__ */ React__default.createElement(Padding, null), /* @__PURE__ */ React__default.createElement(Grid.Row, null, /* @__PURE__ */ React__default.createElement(Grid.Col, {
     span: 11
   }, /* @__PURE__ */ React__default.createElement(InputWithUnitField, {
-    label: "Icon width",
+    label: t("Icon width"),
     name: `${focusIdx2}.attributes.icon-width`
   })), /* @__PURE__ */ React__default.createElement(Grid.Col, {
     offset: 1,
     span: 11
   }, /* @__PURE__ */ React__default.createElement(InputWithUnitField, {
-    label: "Icon height",
+    label: t("Icon height"),
     name: `${focusIdx2}.attributes.icon-height`
   }))), /* @__PURE__ */ React__default.createElement(Grid.Row, null, /* @__PURE__ */ React__default.createElement(Grid.Col, {
     span: 11
   }, /* @__PURE__ */ React__default.createElement(ImageUploaderField, {
-    label: "Unwrapped icon",
+    label: t("Unwrapped icon"),
     name: `${focusIdx2}.attributes.icon-unwrapped-url`,
     uploadHandler: onUploadImage
   })), /* @__PURE__ */ React__default.createElement(Grid.Col, {
     offset: 1,
     span: 11
   }, /* @__PURE__ */ React__default.createElement(ImageUploaderField, {
-    label: "Wrapped icon",
+    label: t("Wrapped icon"),
     name: `${focusIdx2}.attributes.icon-wrapped-url`,
     uploadHandler: onUploadImage
   }))), /* @__PURE__ */ React__default.createElement(Grid.Row, null, /* @__PURE__ */ React__default.createElement(Grid.Col, {
     span: 11
   }, /* @__PURE__ */ React__default.createElement(RadioGroupField, {
-    label: "Icon position",
+    label: t("Icon position"),
     name: `${focusIdx2}.attributes.icon-position`,
     options: positionOptions
   })), /* @__PURE__ */ React__default.createElement(Grid.Col, {
@@ -35343,15 +35560,15 @@ function Accordion() {
     span: 11
   }, /* @__PURE__ */ React__default.createElement(SelectField, {
     style: { width: 120 },
-    label: "Icon align",
+    label: t("Icon align"),
     name: `${focusIdx2}.attributes.icon-align`,
     options: alignOptions
   }))), /* @__PURE__ */ React__default.createElement(TextField, {
-    label: "border",
+    label: t("Border"),
     name: `${focusIdx2}.attributes.border`
   }))), /* @__PURE__ */ React__default.createElement(Collapse$1.Item, {
     name: "4",
-    header: "Extra"
+    header: t("Extra")
   }, /* @__PURE__ */ React__default.createElement(Grid.Col, {
     span: 24
   }, /* @__PURE__ */ React__default.createElement(ClassName, null)))));
@@ -35362,7 +35579,7 @@ function AccordionElement() {
     defaultActiveKey: ["0", "1", "2"]
   }, /* @__PURE__ */ React__default.createElement(Collapse$1.Item, {
     name: "0",
-    header: "Setting"
+    header: t("Setting")
   }, /* @__PURE__ */ React__default.createElement(Space$1, {
     direction: "vertical"
   }, /* @__PURE__ */ React__default.createElement(Border, null), /* @__PURE__ */ React__default.createElement(BackgroundColor, null), /* @__PURE__ */ React__default.createElement(FontFamily, null)))));
@@ -35373,11 +35590,11 @@ function AccordionTitle() {
     defaultActiveKey: ["0", "1", "2"]
   }, /* @__PURE__ */ React__default.createElement(Collapse$1.Item, {
     name: "0",
-    header: "Setting"
+    header: t("Setting")
   }, /* @__PURE__ */ React__default.createElement(Space$1, {
     direction: "vertical"
   }, /* @__PURE__ */ React__default.createElement(TextAreaField, {
-    label: "Content",
+    label: t("Content"),
     name: `${focusIdx2}.data.value.content`
   }), /* @__PURE__ */ React__default.createElement(Grid.Row, null, /* @__PURE__ */ React__default.createElement(Grid.Col, {
     span: 11
@@ -35395,7 +35612,7 @@ function AccordionTitle() {
     offset: 1,
     span: 11
   })), /* @__PURE__ */ React__default.createElement(Padding, {
-    title: "Padding",
+    title: t("Padding"),
     attributeName: "padding"
   })))));
 }
@@ -35405,11 +35622,11 @@ function AccordionText() {
     defaultActiveKey: ["0", "1", "2"]
   }, /* @__PURE__ */ React__default.createElement(Collapse$1.Item, {
     name: "0",
-    header: "Setting"
+    header: t("Setting")
   }, /* @__PURE__ */ React__default.createElement(Space$1, {
     direction: "vertical"
   }, /* @__PURE__ */ React__default.createElement(TextAreaField, {
-    label: "Content",
+    label: t("Content"),
     name: `${focusIdx2}.data.value.content`,
     autoSize: { minRows: 5 }
   }), /* @__PURE__ */ React__default.createElement(Grid.Row, null, /* @__PURE__ */ React__default.createElement(Grid.Col, {
@@ -35428,18 +35645,22 @@ function AccordionText() {
     offset: 1,
     span: 11
   }, /* @__PURE__ */ React__default.createElement(BackgroundColor, null))), /* @__PURE__ */ React__default.createElement(Padding, {
-    title: "Padding",
+    title: t("Padding"),
     attributeName: "padding"
   })))));
 }
 const options$2 = [
   {
     value: "hidden",
-    label: "hidden"
+    get label() {
+      return t("hidden");
+    }
   },
   {
     value: "visible",
-    label: "visible"
+    get label() {
+      return t("visible");
+    }
   }
 ];
 function Carousel() {
@@ -35450,16 +35671,16 @@ function Carousel() {
     defaultActiveKey: ["0", "1", "2", "3", "4"]
   }, /* @__PURE__ */ React__default.createElement(Collapse$1.Item, {
     name: "0",
-    header: "Dimension"
+    header: t("Dimension")
   }, /* @__PURE__ */ React__default.createElement(Space$1, {
     direction: "vertical"
   }, /* @__PURE__ */ React__default.createElement(InputWithUnitField, {
-    label: "Thumbnail width",
+    label: t("Thumbnail width"),
     name: `${focusIdx2}.attributes.tb-width`,
     quickchange: true,
     inline: true
   }), /* @__PURE__ */ React__default.createElement(RadioGroupField, {
-    label: "Thumbnails",
+    label: t("Thumbnails"),
     name: `${focusIdx2}.attributes.thumbnails`,
     options: options$2,
     inline: true
@@ -35468,7 +35689,7 @@ function Carousel() {
   }))), /* @__PURE__ */ React__default.createElement(Collapse$1.Item, {
     name: "4",
     contentStyle: { padding: 0 },
-    header: "Images"
+    header: t("Images")
   }, /* @__PURE__ */ React__default.createElement(Stack$4, {
     vertical: true,
     spacing: "tight"
@@ -35487,54 +35708,54 @@ function Carousel() {
     }
   }))), /* @__PURE__ */ React__default.createElement(Collapse$1.Item, {
     name: "3",
-    header: "Icon"
+    header: t("Icon")
   }, /* @__PURE__ */ React__default.createElement(Grid.Row, null, /* @__PURE__ */ React__default.createElement(Grid.Col, {
     span: 11
   }, /* @__PURE__ */ React__default.createElement(TextField, {
-    label: "Left icon",
+    label: t("Left icon"),
     name: `${focusIdx2}.attributes.left-icon`
   })), /* @__PURE__ */ React__default.createElement(Grid.Col, {
     offset: 1,
     span: 11
   }, /* @__PURE__ */ React__default.createElement(TextField, {
-    label: "Right icon",
+    label: t("Right icon"),
     name: `${focusIdx2}.attributes.right-icon`
   }))), /* @__PURE__ */ React__default.createElement(Grid.Row, null, /* @__PURE__ */ React__default.createElement(Grid.Col, {
     span: 11
   }, /* @__PURE__ */ React__default.createElement(InputWithUnitField, {
-    label: "Icon width",
+    label: t("Icon width"),
     name: `${focusIdx2}.attributes.icon-width`
   })), /* @__PURE__ */ React__default.createElement(Grid.Col, {
     offset: 1,
     span: 11
   }))), /* @__PURE__ */ React__default.createElement(Collapse$1.Item, {
     name: "1",
-    header: "Border"
+    header: t("Border")
   }, /* @__PURE__ */ React__default.createElement(Grid.Row, null, /* @__PURE__ */ React__default.createElement(Grid.Col, {
     span: 11
   }, /* @__PURE__ */ React__default.createElement(ColorPickerField, {
-    label: "Hovered border",
+    label: t("Hovered border"),
     name: `${focusIdx2}.attributes.tb-hover-border-color`
   })), /* @__PURE__ */ React__default.createElement(Grid.Col, {
     offset: 1,
     span: 11
   }, /* @__PURE__ */ React__default.createElement(ColorPickerField, {
-    label: "Selected Border",
+    label: t("Selected Border"),
     name: `${focusIdx2}.attributes.tb-selected-border-color`
   }))), /* @__PURE__ */ React__default.createElement(Grid.Row, null, /* @__PURE__ */ React__default.createElement(Grid.Col, {
     span: 11
   }, /* @__PURE__ */ React__default.createElement(TextField, {
-    label: "Border of the thumbnails",
+    label: t("Border of the thumbnails"),
     name: `${focusIdx2}.attributes.tb-border`
   })), /* @__PURE__ */ React__default.createElement(Grid.Col, {
     offset: 1,
     span: 11
   }, /* @__PURE__ */ React__default.createElement(TextField, {
-    label: "Border radius of the thumbnails",
+    label: t("Border radius of the thumbnails"),
     name: `${focusIdx2}.attributes.tb-border-radius`
   })))), /* @__PURE__ */ React__default.createElement(Collapse$1.Item, {
     name: "4",
-    header: "Extra"
+    header: t("Extra")
   }, /* @__PURE__ */ React__default.createElement(Grid.Col, {
     span: 24
   }, /* @__PURE__ */ React__default.createElement(ClassName, null)))));
@@ -35548,46 +35769,50 @@ function CarouselImage({
   return /* @__PURE__ */ React__default.createElement(Space$1, {
     direction: "vertical"
   }, /* @__PURE__ */ React__default.createElement(ImageUploaderField, {
-    label: "Image",
+    label: t("Image"),
     labelHidden: true,
     name: `${focusIdx2}.data.value.images.[${index2}].src`,
-    helpText: "The image suffix should be .jpg, jpeg, png, gif, etc. Otherwise, the picture may not be displayed normally.",
+    helpText: t("The image suffix should be .jpg, jpeg, png, gif, etc. Otherwise, the picture may not be displayed normally."),
     uploadHandler: onUploadImage
   }), /* @__PURE__ */ React__default.createElement(Grid.Row, null, /* @__PURE__ */ React__default.createElement(Grid.Col, {
     span: 11
   }, /* @__PURE__ */ React__default.createElement(TextField, {
     prefix: /* @__PURE__ */ React__default.createElement(IconLink$1, null),
-    label: "Url",
+    label: t("Url"),
     name: `${focusIdx2}.data.value.images.[${index2}].href`
   })), /* @__PURE__ */ React__default.createElement(Grid.Col, {
     offset: 1,
     span: 11
   }, /* @__PURE__ */ React__default.createElement(SelectField, {
-    label: "Target",
+    label: t("Target"),
     name: `${focusIdx2}.data.value.images.[${index2}].target`,
     options: [
       {
         value: "",
-        label: "_self"
+        label: t("_self")
       },
       {
         value: "_blank",
-        label: "_blank"
+        label: t("_blank")
       }
     ]
   }))), /* @__PURE__ */ React__default.createElement(TextField, {
-    label: "Title",
+    label: t("Title"),
     name: `${focusIdx2}.data.value.image.[${index2}].title`
   }));
 }
 const options$1 = [
   {
     value: "fluid-height",
-    label: "Fluid height"
+    get label() {
+      return t("Fluid height");
+    }
   },
   {
     value: "fixed-height",
-    label: "Fixed height"
+    get label() {
+      return t("Fixed height");
+    }
   }
 ];
 function Hero() {
@@ -35597,11 +35822,11 @@ function Hero() {
     defaultActiveKey: ["0", "1", "2"]
   }, /* @__PURE__ */ React__default.createElement(Collapse$1.Item, {
     name: "0",
-    header: "Dimension"
+    header: t("Dimension")
   }, /* @__PURE__ */ React__default.createElement(Space$1, {
     direction: "vertical"
   }, /* @__PURE__ */ React__default.createElement(RadioGroupField, {
-    label: "Mode",
+    label: t("Mode"),
     name: `${focusIdx2}.attributes.mode`,
     options: options$1
   }), /* @__PURE__ */ React__default.createElement(Grid.Row, null, /* @__PURE__ */ React__default.createElement(Grid.Col, {
@@ -35611,42 +35836,42 @@ function Hero() {
     span: 11
   }, /* @__PURE__ */ React__default.createElement(Height, null))), /* @__PURE__ */ React__default.createElement(Padding, null), /* @__PURE__ */ React__default.createElement(VerticalAlign, null))), /* @__PURE__ */ React__default.createElement(Collapse$1.Item, {
     name: "1",
-    header: "Background"
+    header: t("Background")
   }, /* @__PURE__ */ React__default.createElement(Space$1, {
     direction: "vertical"
   }, /* @__PURE__ */ React__default.createElement(ImageUploaderField, {
-    label: "src",
+    label: t("src"),
     name: `${focusIdx2}.attributes.background-url`,
-    helpText: "The image suffix should be .jpg, jpeg, png, gif, etc. Otherwise, the picture may not be displayed normally.",
+    helpText: t("The image suffix should be .jpg, jpeg, png, gif, etc. Otherwise, the picture may not be displayed normally."),
     uploadHandler: onUploadImage
   }), /* @__PURE__ */ React__default.createElement(Grid.Row, null, /* @__PURE__ */ React__default.createElement(Grid.Col, {
     span: 11
   }, /* @__PURE__ */ React__default.createElement(InputWithUnitField, {
-    label: "Background width",
+    label: t("Background width"),
     name: `${focusIdx2}.attributes.background-width`
   })), /* @__PURE__ */ React__default.createElement(Grid.Col, {
     offset: 1,
     span: 11
   }, /* @__PURE__ */ React__default.createElement(InputWithUnitField, {
-    label: "Background height",
+    label: t("Background height"),
     name: `${focusIdx2}.attributes.background-height`
   }))), /* @__PURE__ */ React__default.createElement(Grid.Row, null, /* @__PURE__ */ React__default.createElement(Grid.Col, {
     span: 11
   }, /* @__PURE__ */ React__default.createElement(TextField, {
-    label: "Background position",
+    label: t("Background position"),
     name: `${focusIdx2}.attributes.background-position`
   })), /* @__PURE__ */ React__default.createElement(Grid.Col, {
     offset: 1,
     span: 11
   }, /* @__PURE__ */ React__default.createElement(InputWithUnitField, {
-    label: "Border radius",
+    label: t("Border radius"),
     name: `${focusIdx2}.attributes.border-radius`,
     unitOptions: "percent"
   })), /* @__PURE__ */ React__default.createElement(Grid.Col, {
     span: 11
   }, /* @__PURE__ */ React__default.createElement(BackgroundColor, null))))), /* @__PURE__ */ React__default.createElement(Collapse$1.Item, {
     name: "4",
-    header: "Extra"
+    header: t("Extra")
   }, /* @__PURE__ */ React__default.createElement(Grid.Col, {
     span: 24
   }, /* @__PURE__ */ React__default.createElement(ClassName, null)))));
@@ -35659,21 +35884,21 @@ function Navbar() {
     defaultActiveKey: ["0", "1", "2"]
   }, /* @__PURE__ */ React__default.createElement(Collapse$1.Item, {
     name: "0",
-    header: "Layout"
+    header: t("Layout")
   }, /* @__PURE__ */ React__default.createElement(Stack$4, {
     vertical: true,
     spacing: "tight"
   }, /* @__PURE__ */ React__default.createElement(Align, null))), /* @__PURE__ */ React__default.createElement(Collapse$1.Item, {
     contentStyle: { padding: 0 },
     name: "1",
-    header: "Navbar links"
+    header: t("Navbar links")
   }, /* @__PURE__ */ React__default.createElement(Space$1, {
     direction: "vertical",
     style: { width: "100%" }
   }, /* @__PURE__ */ React__default.createElement(EditTabField, {
     tabPosition: "top",
     name: `${focusIdx2}.data.value.links`,
-    label: "Links",
+    label: t("Links"),
     labelHidden: true,
     renderItem: (item2, index2) => /* @__PURE__ */ React__default.createElement(NavbarLink, {
       item: item2,
@@ -35688,7 +35913,7 @@ function Navbar() {
     }
   }), /* @__PURE__ */ React__default.createElement("div", null))), /* @__PURE__ */ React__default.createElement(Collapse$1.Item, {
     name: "4",
-    header: "Extra"
+    header: t("Extra")
   }, /* @__PURE__ */ React__default.createElement(Grid.Col, {
     span: 24
   }, /* @__PURE__ */ React__default.createElement(ClassName, null)))));
@@ -35706,13 +35931,13 @@ function NavbarLink({
   }, /* @__PURE__ */ React__default.createElement(Grid.Row, null, /* @__PURE__ */ React__default.createElement(Grid.Col, {
     span: 11
   }, /* @__PURE__ */ React__default.createElement(TextField, {
-    label: "Content",
+    label: t("Content"),
     name: `${focusIdx2}.data.value.links.[${index2}].content`
   })), /* @__PURE__ */ React__default.createElement(Grid.Col, {
     offset: 1,
     span: 11
   }, /* @__PURE__ */ React__default.createElement(ColorPickerField, {
-    label: "Color",
+    label: t("Color"),
     name: `${focusIdx2}.data.value.links.[${index2}].color`
   }))), /* @__PURE__ */ React__default.createElement(Grid.Row, null, /* @__PURE__ */ React__default.createElement(Grid.Col, {
     span: 11
@@ -35722,9 +35947,10 @@ function NavbarLink({
     offset: 1,
     span: 11
   }, /* @__PURE__ */ React__default.createElement(TextField, {
-    label: "Font size",
-    quickchange: true,
-    name: `${focusIdx2}.data.value.links.[${index2}].font-size`
+    label: t("Font size (px)"),
+    name: `${focusIdx2}.data.value.links.[${index2}].font-size`,
+    config: pixelAdapter,
+    autoComplete: "off"
   }))), /* @__PURE__ */ React__default.createElement(Grid.Row, null, /* @__PURE__ */ React__default.createElement(Grid.Col, {
     span: 11
   }, /* @__PURE__ */ React__default.createElement(LineHeight, {
@@ -35756,23 +35982,23 @@ function NavbarLink({
     span: 11
   }, /* @__PURE__ */ React__default.createElement(TextField, {
     prefix: /* @__PURE__ */ React__default.createElement(IconLink$1, null),
-    label: /* @__PURE__ */ React__default.createElement("span", null, "Url"),
+    label: /* @__PURE__ */ React__default.createElement("span", null, t("Url")),
     name: `${focusIdx2}.data.value.links.[${index2}].href`
   })), /* @__PURE__ */ React__default.createElement(Grid.Col, {
     offset: 1,
     span: 11
   }, /* @__PURE__ */ React__default.createElement(SelectField, {
     style: { minWidth: 65 },
-    label: "Target",
+    label: t("Target"),
     name: `${focusIdx2}.data.value.links.[${index2}].target`,
     options: [
       {
         value: "_blank",
-        label: "_blank"
+        label: t("_blank")
       },
       {
         value: "_self",
-        label: "_self"
+        label: t("_self")
       }
     ]
   }))), /* @__PURE__ */ React__default.createElement(NavbarLinkPadding, {
@@ -35783,11 +36009,15 @@ function NavbarLink({
 const options = [
   {
     value: "vertical",
-    label: "vertical"
+    get label() {
+      return t("vertical");
+    }
   },
   {
     value: "horizontal",
-    label: "horizontal"
+    get label() {
+      return t("horizontal");
+    }
   }
 ];
 function Social() {
@@ -35802,16 +36032,16 @@ function Social() {
     defaultActiveKey: ["0", "1", "2", "3"]
   }, /* @__PURE__ */ React__default.createElement(Collapse$1.Item, {
     name: "1",
-    header: "Setting"
+    header: t("Setting")
   }, /* @__PURE__ */ React__default.createElement(Space$1, {
     direction: "vertical"
   }, /* @__PURE__ */ React__default.createElement(RadioGroupField, {
-    label: "Mode",
+    label: t("Mode"),
     name: `${focusIdx2}.attributes.mode`,
     options
   }), /* @__PURE__ */ React__default.createElement(Align, null))), /* @__PURE__ */ React__default.createElement(Collapse$1.Item, {
     name: "3",
-    header: "Typography"
+    header: t("Typography")
   }, /* @__PURE__ */ React__default.createElement(Space$1, {
     direction: "vertical"
   }, /* @__PURE__ */ React__default.createElement(Grid.Row, null, /* @__PURE__ */ React__default.createElement(Grid.Col, {
@@ -35830,7 +36060,7 @@ function Social() {
     offset: 1,
     span: 11
   }, /* @__PURE__ */ React__default.createElement(ContainerBackgroundColor, {
-    title: "Background color"
+    title: t("Background color")
   }))), /* @__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, {
@@ -35838,7 +36068,7 @@ function Social() {
     span: 11
   }, /* @__PURE__ */ React__default.createElement(FontStyle, null))))), /* @__PURE__ */ React__default.createElement(Collapse$1.Item, {
     name: "2",
-    header: "Social item",
+    header: t("Social item"),
     contentStyle: { padding: 10 }
   }, /* @__PURE__ */ React__default.createElement(EditGridTabField, {
     tabPosition: "top",
@@ -35851,30 +36081,30 @@ function Social() {
     })
   })), /* @__PURE__ */ React__default.createElement(Collapse$1.Item, {
     name: "0",
-    header: "Dimension"
+    header: t("Dimension")
   }, /* @__PURE__ */ React__default.createElement(Space$1, {
     direction: "vertical",
     size: "large"
   }, /* @__PURE__ */ React__default.createElement(Grid.Row, null, /* @__PURE__ */ React__default.createElement(Grid.Col, {
     span: 11
   }, /* @__PURE__ */ React__default.createElement(InputWithUnitField, {
-    label: "Icon width",
+    label: t("Icon width"),
     name: `${focusIdx2}.attributes.icon-size`
   })), /* @__PURE__ */ React__default.createElement(Grid.Col, {
     offset: 1,
     span: 11
   }, /* @__PURE__ */ React__default.createElement(TextField, {
-    label: "Border radius",
+    label: t("Border radius"),
     name: `${focusIdx2}.attributes.border-radius`
   }))), /* @__PURE__ */ React__default.createElement(Padding, null), /* @__PURE__ */ React__default.createElement(Padding, {
     attributeName: "inner-padding",
-    title: "Icon padding"
+    title: t("Icon padding")
   }), /* @__PURE__ */ React__default.createElement(Padding, {
     attributeName: "text-padding",
-    title: "Text padding"
+    title: t("Text padding")
   }))), /* @__PURE__ */ React__default.createElement(Collapse$1.Item, {
     name: "4",
-    header: "Extra"
+    header: t("Extra")
   }, /* @__PURE__ */ React__default.createElement(Grid.Col, {
     span: 24
   }, /* @__PURE__ */ React__default.createElement(ClassName, null)))));
@@ -35897,7 +36127,7 @@ function SocialElement({
   return /* @__PURE__ */ React__default.createElement(Space$1, {
     direction: "vertical"
   }, /* @__PURE__ */ React__default.createElement(ImageUploaderField, {
-    label: "Image",
+    label: t("Image"),
     autoCompleteOptions,
     labelHidden: true,
     name: `${focusIdx2}.data.value.elements.[${index2}].src`,
@@ -35905,7 +36135,7 @@ function SocialElement({
   }), /* @__PURE__ */ React__default.createElement(Grid.Row, null, /* @__PURE__ */ React__default.createElement(Grid.Col, {
     span: 11
   }, /* @__PURE__ */ React__default.createElement(TextField, {
-    label: "Content",
+    label: t("Content"),
     name: `${focusIdx2}.data.value.elements.[${index2}].content`,
     quickchange: true
   })), /* @__PURE__ */ React__default.createElement(Grid.Col, {
@@ -35913,7 +36143,7 @@ function SocialElement({
     span: 11
   }, /* @__PURE__ */ React__default.createElement(TextField, {
     prefix: /* @__PURE__ */ React__default.createElement(IconLink$1, null),
-    label: "Link",
+    label: t("Link"),
     name: `${focusIdx2}.data.value.elements.[${index2}].href`
   }))));
 }
@@ -35921,7 +36151,7 @@ function Table() {
   const [visible, setVisible] = useState(false);
   return /* @__PURE__ */ React__default.createElement(AttributesPanelWrapper, {
     extra: /* @__PURE__ */ React__default.createElement(Tooltip$1, {
-      content: "Edit"
+      content: t("Edit")
     }, /* @__PURE__ */ React__default.createElement(Button$4, {
       onClick: () => setVisible(true),
       icon: /* @__PURE__ */ React__default.createElement(IconFont, {
@@ -35932,15 +36162,15 @@ function Table() {
     defaultActiveKey: ["-1", "0", "1", "2", "3"]
   }, /* @__PURE__ */ React__default.createElement(Collapse$1.Item, {
     name: "1",
-    header: "Dimension"
+    header: t("Dimension")
   }, /* @__PURE__ */ React__default.createElement(Stack$4, null, /* @__PURE__ */ React__default.createElement(Width, null), /* @__PURE__ */ React__default.createElement(Stack$4.Item, null)), /* @__PURE__ */ React__default.createElement(Stack$4, {
     vertical: true
   }, /* @__PURE__ */ React__default.createElement(Padding, null))), /* @__PURE__ */ React__default.createElement(Collapse$1.Item, {
     name: "2",
-    header: "Decoration"
+    header: t("Decoration")
   }, /* @__PURE__ */ React__default.createElement(Color, null), /* @__PURE__ */ React__default.createElement(ContainerBackgroundColor, null), /* @__PURE__ */ React__default.createElement(Border, null)), /* @__PURE__ */ React__default.createElement(Collapse$1.Item, {
     name: "2",
-    header: "Typography"
+    header: t("Typography")
   }, /* @__PURE__ */ React__default.createElement(Stack$4, null, /* @__PURE__ */ React__default.createElement(FontFamily, null), /* @__PURE__ */ React__default.createElement(FontSize$1, null)), /* @__PURE__ */ React__default.createElement(FontStyle, null), /* @__PURE__ */ React__default.createElement(TextAlign, null))), /* @__PURE__ */ React__default.createElement(HtmlEditor, {
     visible,
     setVisible
@@ -36083,7 +36313,7 @@ function MergeTags(props) {
     })),
     getPopupContainer: props.getPopupContainer
   }, /* @__PURE__ */ React__default.createElement(ToolItem$1, {
-    title: "Merge tag",
+    title: t("Merge tag"),
     icon: /* @__PURE__ */ React__default.createElement(IconFont, {
       iconName: "icon-merge-tags"
     })
@@ -36143,7 +36373,7 @@ function IconBgColor({ selectionRange, execCommand, getPopoverMountNode }) {
     }), /* @__PURE__ */ React__default.createElement("div", {
       style: { borderBottom: `2px solid ${color2}`, position: "absolute", width: "130%", left: "-15%", top: 16 }
     })),
-    title: "Background color"
+    title: t("Background color")
   }));
 }
 function IconFontColor({ selectionRange, execCommand, getPopoverMountNode }) {
@@ -36175,7 +36405,7 @@ function IconFontColor({ selectionRange, execCommand, getPopoverMountNode }) {
     }), /* @__PURE__ */ React__default.createElement("div", {
       style: { borderBottom: `2px solid ${color2}`, position: "absolute", width: "130%", left: "-15%", top: 16 }
     })),
-    title: "Text color"
+    title: t("Text color")
   }));
 }
 function BasicTools() {
@@ -36213,25 +36443,25 @@ function BasicTools() {
     style: { position: "relative", marginRight: 10, color: "#fff", fontFamily: "-apple-system, BlinkMacSystemFont, San Francisco, Segoe UI" }
   }, "Text"), /* @__PURE__ */ React__default.createElement(ToolItem$1, {
     onClick: handleSelectParent,
-    title: "Select parent block",
+    title: t("Select parent block"),
     icon: /* @__PURE__ */ React__default.createElement(IconFont, {
       iconName: "icon-back-parent"
     })
   }), /* @__PURE__ */ React__default.createElement(ToolItem$1, {
     onClick: handleCopy,
-    title: "Copy",
+    title: t("Copy"),
     icon: /* @__PURE__ */ React__default.createElement(IconFont, {
       iconName: "icon-copy"
     })
   }), onAddCollection && /* @__PURE__ */ React__default.createElement(ToolItem$1, {
     onClick: handleAddToCollection,
-    title: "Add to collection",
+    title: t("Add to collection"),
     icon: /* @__PURE__ */ React__default.createElement(IconFont, {
       iconName: "icon-collection"
     })
   }), /* @__PURE__ */ React__default.createElement(ToolItem$1, {
     onClick: handleDelete,
-    title: "Delete",
+    title: t("Delete"),
     icon: /* @__PURE__ */ React__default.createElement(IconFont, {
       iconName: "icon-delete"
     })
@@ -36268,9 +36498,9 @@ function Unlink(props) {
   return /* @__PURE__ */ React__default.createElement(Tooltip$1, {
     color: "#fff",
     position: "tl",
-    content: "Unlink"
+    content: t("Unlink")
   }, /* @__PURE__ */ React__default.createElement(ToolItem$1, {
-    title: "Unlink",
+    title: t("Unlink"),
     icon: /* @__PURE__ */ React__default.createElement(IconFont, {
       iconName: "icon-unlink"
     }),
@@ -36302,9 +36532,9 @@ function StrikeThrough(props) {
   return /* @__PURE__ */ React__default.createElement(Tooltip$1, {
     color: "#fff",
     position: "tl",
-    content: "Strikethrough"
+    content: t("Strikethrough")
   }, /* @__PURE__ */ React__default.createElement(ToolItem$1, {
-    title: "Strikethrough",
+    title: t("Strikethrough"),
     isActive: Boolean(node),
     icon: /* @__PURE__ */ React__default.createElement(IconFont, {
       iconName: "icon-strikethrough"
@@ -36337,9 +36567,9 @@ function Underline(props) {
   return /* @__PURE__ */ React__default.createElement(Tooltip$1, {
     color: "#fff",
     position: "tl",
-    content: "Underline"
+    content: t("Underline")
   }, /* @__PURE__ */ React__default.createElement(ToolItem$1, {
-    title: "Underline",
+    title: t("Underline"),
     isActive: Boolean(node),
     icon: /* @__PURE__ */ React__default.createElement(IconFont, {
       iconName: "icon-underline"
@@ -36372,9 +36602,9 @@ function Italic(props) {
   return /* @__PURE__ */ React__default.createElement(Tooltip$1, {
     color: "#fff",
     position: "tl",
-    content: "Italic"
+    content: t("Italic")
   }, /* @__PURE__ */ React__default.createElement(ToolItem$1, {
-    title: "Italic",
+    title: t("Italic"),
     isActive: Boolean(node),
     icon: /* @__PURE__ */ React__default.createElement(IconFont, {
       iconName: "icon-italic"
@@ -36407,9 +36637,9 @@ function Bold(props) {
   return /* @__PURE__ */ React__default.createElement(Tooltip$1, {
     color: "#fff",
     position: "tl",
-    content: "Bold"
+    content: t("Bold")
   }, /* @__PURE__ */ React__default.createElement(ToolItem$1, {
-    title: "Bold",
+    title: t("Bold"),
     isActive: Boolean(node),
     icon: /* @__PURE__ */ React__default.createElement(IconFont, {
       iconName: "icon-bold"
@@ -36494,11 +36724,11 @@ function Tools(props) {
   const execCommand = useCallback((cmd, val) => {
     var _a;
     if (!selectionRange) {
-      console.error("No selectionRange");
+      console.error(t("No selectionRange"));
       return;
     }
     if (!(focusBlockNode == null ? void 0 : focusBlockNode.contains(selectionRange == null ? void 0 : selectionRange.commonAncestorContainer))) {
-      console.error("Not commonAncestorContainer");
+      console.error(t("Not commonAncestorContainer"));
       return;
     }
     restoreRange(selectionRange);
@@ -36629,19 +36859,19 @@ function Tools(props) {
     icon: /* @__PURE__ */ React__default.createElement(IconFont, {
       iconName: "icon-align-left"
     }),
-    title: "Align left"
+    title: t("Align left")
   }), /* @__PURE__ */ React__default.createElement(ToolItem$1, {
     onClick: () => execCommand("justifyCenter"),
     icon: /* @__PURE__ */ React__default.createElement(IconFont, {
       iconName: "icon-align-center"
     }),
-    title: "Align center"
+    title: t("Align center")
   }), /* @__PURE__ */ React__default.createElement(ToolItem$1, {
     onClick: () => execCommand("justifyRight"),
     icon: /* @__PURE__ */ React__default.createElement(IconFont, {
       iconName: "icon-align-right"
     }),
-    title: "Align right"
+    title: t("Align right")
   }), /* @__PURE__ */ React__default.createElement("div", {
     className: "easy-email-extensions-divider"
   }), /* @__PURE__ */ React__default.createElement(ToolItem$1, {
@@ -36649,13 +36879,13 @@ function Tools(props) {
     icon: /* @__PURE__ */ React__default.createElement(IconFont, {
       iconName: "icon-list-ol"
     }),
-    title: "Orderlist"
+    title: t("Orderlist")
   }), /* @__PURE__ */ React__default.createElement(ToolItem$1, {
     onClick: () => execCommand("insertUnorderedList"),
     icon: /* @__PURE__ */ React__default.createElement(IconFont, {
       iconName: "icon-list-ul"
     }),
-    title: "Unorderlist"
+    title: t("Unorderlist")
   }), /* @__PURE__ */ React__default.createElement("div", {
     className: "easy-email-extensions-divider"
   }), /* @__PURE__ */ React__default.createElement(ToolItem$1, {
@@ -36663,7 +36893,7 @@ function Tools(props) {
     icon: /* @__PURE__ */ React__default.createElement(IconFont, {
       iconName: "icon-line"
     }),
-    title: "Line"
+    title: t("Line")
   }), /* @__PURE__ */ React__default.createElement("div", {
     className: "easy-email-extensions-divider"
   }), /* @__PURE__ */ React__default.createElement(ToolItem$1, {
@@ -36671,7 +36901,7 @@ function Tools(props) {
     icon: /* @__PURE__ */ React__default.createElement(IconFont, {
       iconName: "icon-close"
     }),
-    title: "Remove format"
+    title: t("Remove format")
   }), /* @__PURE__ */ React__default.createElement("div", {
     className: "easy-email-extensions-divider"
   })));
@@ -36792,7 +37022,6 @@ const SearchField = enhancer(Input$4.Search, (val) => val);
 const TextAreaField = enhancer(Input$4.TextArea, (val) => val);
 const NumberField = enhancer(InputNumber$1, (e) => e);
 const SliderField = enhancer(Slider$1, (e) => e);
-const ColorPickerField = enhancer(ColorPicker, (e) => e);
 const UploadField = enhancer(UploadField$1, (val) => val);
 const ImageUploaderField = enhancer(ImageUploader, (url) => url);
 const SelectField = enhancer(Select, (e) => e);
@@ -36827,29 +37056,29 @@ const AddToCollection = ({ visible, setVisible }) => {
     maskClosable: false,
     style: { zIndex: 2e3 },
     visible,
-    title: "Add to collection",
+    title: t("Add to collection"),
     onOk: () => handleSubmit(),
     onCancel: () => setVisible(false)
   }, /* @__PURE__ */ React__default.createElement(Stack$4, {
     vertical: true
   }, /* @__PURE__ */ React__default.createElement(Stack$4.Item, null), /* @__PURE__ */ React__default.createElement(TextField, {
-    label: "Title",
+    label: t("Title"),
     name: "label",
     validate: (val) => {
       if (!val)
-        return "Title required!";
+        return t("Title required!");
       return void 0;
     }
   }), /* @__PURE__ */ React__default.createElement(TextAreaField, {
-    label: "Description",
+    label: t("Description"),
     name: "helpText"
   }), /* @__PURE__ */ React__default.createElement(ImageUploaderField, {
-    label: "Thumbnail",
+    label: t("Thumbnail"),
     name: "thumbnail",
     uploadHandler: onUploadImage,
     validate: (val) => {
       if (!val)
-        return "Thumbnail required!";
+        return t("Thumbnail required!");
       return void 0;
     }
   }))));
@@ -36923,19 +37152,19 @@ function ContextMenu({
   }, /* @__PURE__ */ React__default.createElement(IconFont, {
     iconName: "icon-top",
     style: { marginRight: 10 }
-  }), " ", /* @__PURE__ */ React__default.createElement(TextStyle, null, "Move up")), /* @__PURE__ */ React__default.createElement("div", {
+  }), " ", /* @__PURE__ */ React__default.createElement(TextStyle, null, t("Move up"))), /* @__PURE__ */ React__default.createElement("div", {
     className: styles$9.listItem,
     onClick: handleMoveDown
   }, /* @__PURE__ */ React__default.createElement(IconFont, {
     iconName: "icon-bottom",
     style: { marginRight: 10 }
-  }), " ", /* @__PURE__ */ React__default.createElement(TextStyle, null, "Move down")), /* @__PURE__ */ React__default.createElement("div", {
+  }), " ", /* @__PURE__ */ React__default.createElement(TextStyle, null, t("Move down"))), /* @__PURE__ */ React__default.createElement("div", {
     className: styles$9.listItem,
     onClick: handleCopy
   }, /* @__PURE__ */ React__default.createElement(IconFont, {
     iconName: "icon-copy",
     style: { marginRight: 10 }
-  }), " ", /* @__PURE__ */ React__default.createElement(TextStyle, null, "Copy")), props.onAddCollection && /* @__PURE__ */ React__default.createElement("div", {
+  }), " ", /* @__PURE__ */ React__default.createElement(TextStyle, null, t("Copy"))), props.onAddCollection && /* @__PURE__ */ React__default.createElement("div", {
     className: styles$9.listItem,
     onClick: handleAddToCollection
   }, /* @__PURE__ */ React__default.createElement(IconFont, {
@@ -36947,7 +37176,7 @@ function ContextMenu({
   }, /* @__PURE__ */ React__default.createElement(IconFont, {
     iconName: "icon-delete",
     style: { marginRight: 10 }
-  }), " ", /* @__PURE__ */ React__default.createElement(TextStyle, null, "Delete"))), /* @__PURE__ */ React__default.createElement("div", {
+  }), " ", /* @__PURE__ */ React__default.createElement(TextStyle, null, t("Delete")))), /* @__PURE__ */ React__default.createElement("div", {
     className: styles$9.contextmenuMark,
     onClick: onClose,
     onContextMenu: (e) => {
@@ -39338,119 +39567,171 @@ const list = [
 ];
 const defaultCategories$1 = [
   {
-    title: "Content",
+    get title() {
+      return t("Content");
+    },
     name: "CONTENT",
     blocks: [
       {
         type: AdvancedType.TEXT,
-        title: "Text",
-        description: "This block allows you to display text in your email.",
+        get title() {
+          return t("Text");
+        },
+        get description() {
+          return t("This block allows you to display text in your email");
+        },
         component: TextBlockItem
       },
       {
         type: AdvancedType.IMAGE,
-        title: "Image",
-        description: /* @__PURE__ */ React__default.createElement(Stack$4, {
-          vertical: true,
-          spacing: "none"
-        }, /* @__PURE__ */ React__default.createElement(TextStyle, null, 'Displays a responsive image in your email. It is similar to the HTML "<img/>" tag. Note that if no width is provided, the image will use the parent column width.')),
+        get title() {
+          return t("Image");
+        },
+        get description() {
+          return /* @__PURE__ */ React__default.createElement(Stack$4, {
+            vertical: true,
+            spacing: "none"
+          }, /* @__PURE__ */ React__default.createElement(TextStyle, null, t("Displays a responsive image in your email. It is similar to the HTML '&lt;img/&gt;' tag. Note that if no width is provided, the image will use the parent column width.")));
+        },
         component: ImageBlockItem
       },
       {
         type: AdvancedType.BUTTON,
-        title: "Button",
-        description: "Displays a customizable button.",
+        get title() {
+          return t("Button");
+        },
+        get description() {
+          return t("Displays a customizable button.");
+        },
         component: ButtonBlockItem
       },
       {
         type: AdvancedType.HERO,
-        title: "Hero",
-        description: `This block displays a hero image. It behaves like an
-        'section' with a single 'column'.`,
+        get title() {
+          return t("Hero");
+        },
+        get description() {
+          return t("This block displays a hero image. It behaves like an 'section' with a single 'column'.");
+        },
         component: HeroBlockItem
       },
       {
         type: AdvancedType.NAVBAR,
-        title: "Navbar",
-        description: `Displays a menu for navigation with an optional hamburger
-        mode for mobile devices.`,
+        get title() {
+          return t("Navbar");
+        },
+        get description() {
+          return t("Displays a menu for navigation with an optional hamburger mode for mobile devices.");
+        },
         component: NavbarBlockItem
       },
       {
         type: AdvancedType.SPACER,
-        title: "Spacer",
-        description: "Displays a blank space.",
+        get title() {
+          return t("Spacer");
+        },
+        get description() {
+          return t("Displays a blank space.");
+        },
         component: SpacerBlockItem
       },
       {
         type: AdvancedType.DIVIDER,
-        title: "Divider",
-        description: `Displays a horizontal divider that can be customized like a
-        HTML border.`,
+        get title() {
+          return t("Divider");
+        },
+        get description() {
+          return t("Displays a horizontal divider that can be customized like a HTML border.");
+        },
         component: DividerBlockItem
       },
       {
         type: AdvancedType.ACCORDION,
-        title: "Accordion",
-        description: `Accordion is an interactive component to stack content in
-        tabs, so the information is collapsed and only the titles
-        are visible. Readers can interact by clicking on the tabs
-        to reveal the content, providing a great experience on
-        mobile devices where space is scarce.`,
+        get title() {
+          return t("Accordion");
+        },
+        get description() {
+          return t("Accordion is an interactive component to stack content in tabs, so the information is collapsed and only the titles are visible. Readers can interact by clicking on the tabs to reveal the content, providing a great experience on mobile devices where space is scarce.");
+        },
         component: AccordionBlockItem
       },
       {
         type: AdvancedType.CAROUSEL,
-        title: "Carousel",
-        description: `This block displays a gallery of images or "carousel".
-        Readers can interact by hovering and clicking on
-        thumbnails depending on the email client they use.`,
+        get title() {
+          return t("Carousel");
+        },
+        get description() {
+          return t("This block displays a gallery of images or 'carousel'. Readers can interact by hovering and clicking on thumbnails depending on the email client they use.");
+        },
         component: CarouselBlockItem
       },
       {
         type: AdvancedType.SOCIAL,
-        title: "Social",
-        description: `Displays calls-to-action for various social networks with
-        their associated logo.`,
+        get title() {
+          return t("Social");
+        },
+        get description() {
+          return t("Displays calls-to-action for various social networks with their associated logo.");
+        },
         component: SocialBlockItem
       }
     ]
   },
   {
-    title: "Layout",
+    get title() {
+      return t("Layout");
+    },
     name: "LAYOUT",
     blocks: [
       {
         type: AdvancedType.WRAPPER,
-        title: "Wrapper",
-        description: `Wrapper enables to wrap multiple sections together. It's especially useful to achieve nested layouts with shared border or background images across sections.
-        `,
+        get title() {
+          return t("Wrapper");
+        },
+        get description() {
+          return t('Wrapper enables to wrap multiple sections together. It"s especially useful to achieve nested layouts with shared border or background images across sections.');
+        },
         component: WrapperBlockItem
       },
       {
         type: AdvancedType.SECTION,
-        title: "Section",
-        description: /* @__PURE__ */ React__default.createElement(Stack$4, {
-          vertical: true,
-          spacing: "none"
-        }, /* @__PURE__ */ React__default.createElement(TextStyle, null, "Sections are intended to be used as rows within your email. They will be used to structure the layout."), /* @__PURE__ */ React__default.createElement(TextStyle, null, "Sections cannot nest in sections. Columns can nest in sections; all content must be in a column.")),
+        get title() {
+          return t("Section");
+        },
+        get description() {
+          return /* @__PURE__ */ React__default.createElement(Stack$4, {
+            vertical: true,
+            spacing: "none"
+          }, /* @__PURE__ */ React__default.createElement(TextStyle, null, t("Sections are intended to be used as rows within your email. They will be used to structure the layout.")), /* @__PURE__ */ React__default.createElement(TextStyle, null, t("Sections cannot nest in sections. Columns can nest in sections; all content must be in a column.")));
+        },
         component: SectionBlockItem
       },
       {
         type: AdvancedType.GROUP,
-        title: "Group",
-        description: `Group allows you to prevent columns from stacking on
-          mobile. To do so, wrap the columns inside a group
-          block, so they'll stay side by side on mobile.`,
+        get title() {
+          return t("Group");
+        },
+        get description() {
+          return t('Group allows you to prevent columns from stacking on mobile. To do so, wrap the columns inside a group block, so they"ll stay side by side on mobile.');
+        },
         component: GroupBlockItem
       },
       {
         type: AdvancedType.COLUMN,
-        title: "Column",
-        description: /* @__PURE__ */ React__default.createElement(Stack$4, {
-          vertical: true,
-          spacing: "none"
-        }, /* @__PURE__ */ React__default.createElement(TextStyle, null, 'Columns enable you to horizontally organize the content within your sections. They must be located under "Section" block in order to be considered by the engine. To be responsive, columns are expressed in terms of percentage.'), /* @__PURE__ */ React__default.createElement(TextStyle, null, "Every single column has to contain something because they are responsive containers, and will be vertically stacked on a mobile view.")),
+        get title() {
+          return t("Column");
+        },
+        get description() {
+          return /* @__PURE__ */ React__default.createElement(Stack$4, {
+            vertical: true,
+            spacing: "none"
+          }, /* @__PURE__ */ React__default.createElement(TextStyle, null, t(`Columns enable you to horizontally organize the content within
+                your sections. They must be located under "Section" block in order
+                to be considered by the engine. To be responsive, columns are
+                expressed in terms of percentage.`)), /* @__PURE__ */ React__default.createElement(TextStyle, null, t(`Every single column has to contain something because they are
+                responsive containers, and will be vertically stacked on a mobile
+                view.`)));
+        },
         component: ColumnBlockItem
       }
     ]
@@ -39672,10 +39953,10 @@ function SourceCodePanel() {
       const parseValue = JSON.parse(JSON.stringify(eval("(" + event.target.value + ")")));
       const block = BlockManager.getBlockByType(parseValue.type);
       if (!block) {
-        throw new Error("Invalid content");
+        throw new Error(t("Invalid content"));
       }
       if (!parseValue.data || !parseValue.data.value || !parseValue.attributes || !Array.isArray(parseValue.children)) {
-        throw new Error("Invalid content");
+        throw new Error(t("Invalid content"));
       }
       setValueByIdx(focusIdx, parseValue);
     } catch (error2) {
@@ -39689,14 +39970,14 @@ function SourceCodePanel() {
         const parentBlock = getParentByIdx(values, focusIdx);
         const parseBlock = BlockManager.getBlockByType(parseValue2.type);
         if (!(parseBlock == null ? void 0 : parseBlock.validParentType.includes(parentBlock == null ? void 0 : parentBlock.type))) {
-          throw new Error("Invalid content");
+          throw new Error(t("Invalid content"));
         }
       } else if (focusIdx !== getPageIdx()) {
-        throw new Error("Invalid content");
+        throw new Error(t("Invalid content"));
       }
       setValueByIdx(focusIdx, parseValue2);
     } catch (error2) {
-      Message$1.error("Invalid content");
+      Message$1.error(t("Invalid content"));
     }
   }, [focusIdx, setValueByIdx, values]);
   const onChangeMjmlText = useCallback((value) => {
@@ -39715,7 +39996,7 @@ function SourceCodePanel() {
     return null;
   return /* @__PURE__ */ React__default.createElement(Collapse$1, null, /* @__PURE__ */ React__default.createElement(Collapse$1.Item, {
     name: "json",
-    header: "Json source",
+    header: t("Json source"),
     contentStyle: { padding: "8px 13px" }
   }, /* @__PURE__ */ React__default.createElement(Input$4.TextArea, {
     key: code,
@@ -39724,7 +40005,7 @@ function SourceCodePanel() {
     onBlur: onChangeCode
   })), /* @__PURE__ */ React__default.createElement(Collapse$1.Item, {
     name: "mjml",
-    header: "MJML source",
+    header: t("MJML source"),
     contentStyle: { padding: "8px 13px" }
   }, /* @__PURE__ */ React__default.createElement(Input$4.TextArea, {
     key: code,
@@ -40006,13 +40287,13 @@ function TipNode(props) {
   const { direction, title: title2, lineWidth, type } = props;
   const dragTitle = useMemo(() => {
     if (direction === "top" || direction === "noEnoughTop") {
-      return t(`Insert before`, title2);
+      return `${t("Insert before")} ${title2}`;
     } else if (direction === "bottom") {
-      return t(`Insert after`, title2);
+      return `${t("Insert after")} ${title2}`;
     } else if (direction === "right" || direction === "left") {
       return t("Drag here");
     }
-    return `Drag to ${title2}`;
+    return `${t("Drag to")} ${title2}`;
   }, [direction, title2]);
   const color2 = useMemo(() => {
     if (type === "drag") {
@@ -40446,13 +40727,13 @@ function MergeTagBadgePrompt() {
     className: classnames("easy-email-merge-tag-popover")
   }, /* @__PURE__ */ React__default.createElement("div", {
     className: "easy-email-merge-tag-popover-container"
-  }, /* @__PURE__ */ React__default.createElement("h3", null, /* @__PURE__ */ React__default.createElement("span", null, "Default value"), /* @__PURE__ */ React__default.createElement(IconFont, {
+  }, /* @__PURE__ */ React__default.createElement("h3", null, /* @__PURE__ */ React__default.createElement("span", null, t("Default value")), /* @__PURE__ */ React__default.createElement(IconFont, {
     style: { color: "rgb(92, 95, 98)" },
     iconName: "icon-close",
     onClick: onClose
   })), /* @__PURE__ */ React__default.createElement("div", {
     className: "easy-email-merge-tag-popover-desc"
-  }, /* @__PURE__ */ React__default.createElement("p", null, "If a personalized text value isn't available, then a default value is shown."), /* @__PURE__ */ React__default.createElement("div", {
+  }, /* @__PURE__ */ React__default.createElement("p", null, t('If a personalized text value isn"t available, then a default value is shown.')), /* @__PURE__ */ React__default.createElement("div", {
     className: "easy-email-merge-tag-popover-desc-label"
   }, /* @__PURE__ */ React__default.createElement("input", {
     autoFocus: true,
@@ -40467,7 +40748,7 @@ function MergeTagBadgePrompt() {
     className: "easy-email-merge-tag-popover-desc-label-button"
   }, /* @__PURE__ */ React__default.createElement("button", {
     onClick: onSave
-  }, "Save"))))), textContainer));
+  }, t("Save")))))), textContainer));
 }
 const SimpleLayout = (props) => {
   const { height: containerHeight } = useEditorProps();
@@ -40516,7 +40797,7 @@ const SimpleLayout = (props) => {
       overflowX: "hidden"
     }
   }, /* @__PURE__ */ React__default.createElement(Card$1, {
-    title: "Layout",
+    title: t("Layout"),
     style: { border: "none" },
     headerStyle: { height: 50 }
   }, !collapsed && /* @__PURE__ */ React__default.createElement(BlockLayer, {
@@ -40546,13 +40827,13 @@ const SimpleLayout = (props) => {
   }, /* @__PURE__ */ React__default.createElement(Tabs$1.TabPane, {
     title: /* @__PURE__ */ React__default.createElement("div", {
       style: { height: 31, lineHeight: "31px" }
-    }, "Configuration")
+    }, t("Configuration"))
   }, /* @__PURE__ */ React__default.createElement(AttributePanel, null)), showSourceCode && /* @__PURE__ */ React__default.createElement(Tabs$1.TabPane, {
     destroyOnHide: true,
     key: "Source code",
     title: /* @__PURE__ */ React__default.createElement("div", {
       style: { height: 31, lineHeight: "31px" }
-    }, "Source code")
+    }, t("Source code"))
   }, /* @__PURE__ */ React__default.createElement(SourceCodePanel, null))))), /* @__PURE__ */ React__default.createElement(InteractivePrompt, null), /* @__PURE__ */ React__default.createElement(MergeTagBadgePrompt, null)));
 };
 const StandardLayout$1 = "_StandardLayout_xv0bc_1";
@@ -45737,7 +46018,9 @@ function EditPanel({ showSourceCode }) {
 }
 const defaultCategories = [
   {
-    label: "Content",
+    get label() {
+      return t("Content");
+    },
     active: true,
     blocks: [
       {
@@ -45768,12 +46051,16 @@ const defaultCategories = [
     ]
   },
   {
-    label: "Layout",
+    get label() {
+      return t("Layout");
+    },
     active: true,
     displayType: "column",
     blocks: [
       {
-        title: "2 columns",
+        get title() {
+          return t("2 columns");
+        },
         payload: [
           ["50%", "50%"],
           ["33%", "67%"],
@@ -45783,7 +46070,9 @@ const defaultCategories = [
         ]
       },
       {
-        title: "3 columns",
+        get title() {
+          return t("3 columns");
+        },
         payload: [
           ["33.33%", "33.33%", "33.33%"],
           ["25%", "25%", "50%"],
@@ -45791,7 +46080,9 @@ const defaultCategories = [
         ]
       },
       {
-        title: "4 columns",
+        get title() {
+          return t("4 columns");
+        },
         payload: [[["25%", "25%", "25%", "25%"]]]
       }
     ]
@@ -45845,5 +46136,5 @@ const StandardLayout = (props) => {
     style: { width: 0, overflow: "hidden" }
   }))), /* @__PURE__ */ React__default.createElement(InteractivePrompt, null), /* @__PURE__ */ React__default.createElement(MergeTagBadgePrompt, null)));
 };
-export { TextAreaField as $, AttributePanel as A, BlockLayer as B, Color as C, Decoration as D, BlockMaskWrapper as E, FontFamily as F, SourceCodePanel as G, Height as H, InteractivePrompt as I, SimpleLayout as J, StandardLayout as K, LetterSpacing as L, Margin as M, NavbarLinkPadding as N, MergeTagBadgePrompt as O, Padding as P, ExtensionContext as Q, ExtensionProvider as R, ShortcutToolbar as S, TextAlign as T, useExtensionProps as U, VerticalAlign as V, Width as W, RICH_TEXT_TOOL_BAR as X, TextField as Y, InputWithUnitField as Z, SearchField as _, getIconNameByBlockType as a, NumberField as a0, SliderField as a1, ColorPickerField as a2, UploadField as a3, ImageUploaderField as a4, SelectField as a5, TreeSelectField as a6, AutoCompleteField as a7, RadioGroupField as a8, SwitchField as a9, CheckboxField as aa, EditTabField as ab, EditGridTabField as ac, InlineTextField as ad, enhancer as ae, RichTextField as af, getBlockTitle as b, commonjsGlobal as c, BlockAttributeConfigurationManager as d, Align as e, AttributesPanelWrapper as f, getContextMergeTags as g, CollapseWrapper as h, ContainerBackgroundColor as i, TextDecoration as j, Background as k, LineHeight as l, TextTransform as m, BackgroundColor as n, Direction as o, Link as p, Border as q, BorderColor as r, FontSize$1 as s, MergeTags$1 as t, BorderStyle as u, FontStyle as v, BorderWidth as w, FontWeight as x, ClassName as y, BlockMarketManager as z };
+export { SearchField as $, AttributePanel as A, BlockLayer as B, Color as C, Decoration as D, BlockMarketManager as E, FontFamily as F, BlockMaskWrapper as G, Height as H, SourceCodePanel as I, InteractivePrompt as J, SimpleLayout as K, LetterSpacing as L, Margin as M, NavbarLinkPadding as N, StandardLayout as O, Page as P, MergeTagBadgePrompt as Q, ExtensionContext as R, ShortcutToolbar as S, TextAlign as T, ExtensionProvider as U, VerticalAlign as V, Width as W, useExtensionProps as X, RICH_TEXT_TOOL_BAR as Y, TextField as Z, InputWithUnitField as _, getIconNameByBlockType as a, TextAreaField as a0, NumberField as a1, SliderField as a2, UploadField as a3, ImageUploaderField as a4, SelectField as a5, TreeSelectField as a6, AutoCompleteField as a7, RadioGroupField as a8, SwitchField as a9, CheckboxField as aa, EditTabField as ab, EditGridTabField as ac, InlineTextField as ad, ColorPickerField as ae, enhancer as af, RichTextField as ag, getBlockTitle as b, commonjsGlobal as c, BlockAttributeConfigurationManager as d, Align as e, AttributesPanelWrapper as f, getContextMergeTags as g, CollapseWrapper as h, ContainerBackgroundColor as i, TextDecoration as j, Background as k, LineHeight as l, TextTransform as m, BackgroundColor as n, Direction as o, Link as p, Border as q, BorderColor as r, FontSize$1 as s, MergeTags$1 as t, BorderStyle as u, FontStyle as v, BorderWidth as w, FontWeight as x, Padding as y, ClassName as z };
 //# sourceMappingURL=index2.js.map