easy-email-pro-theme 1.57.11 → 1.57.13

package/lib/style.css

@@ -370,15 +370,72 @@
   border-left: 0 !important;
 }
 
-.arco-radio-group-type-button .arco-radio-button::after {
-  content: " ";
-  display: block;
-  position: absolute;
-  top: -4px;
-  left: -4px;
-  right: -4px;
-  bottom: -4px;
-  background-color: var(--color-fill-2);
+.AttributesPanelWrapper .arco-radio-group-type-button {
+  display: flex;
+  gap: 2px;
+  width: 100%;
+  padding: 3px;
+  border: 0;
+  border-radius: 8px;
+  background: var(--color-fill-3);
+  box-sizing: border-box;
+}
+.AttributesPanelWrapper .arco-radio-group-type-button .arco-radio-button {
+  flex: 1 1 0;
+  min-width: 0;
+  height: 32px;
+  margin: 0;
+  padding: 0 10px;
+  border: 0 !important;
+  border-radius: 6px;
+  background: transparent !important;
+  color: var(--color-text-2);
+  font-size: 13px;
+  font-weight: 500;
+  line-height: 32px;
+  box-shadow: none !important;
+  box-sizing: border-box;
+}
+.AttributesPanelWrapper .arco-radio-group-type-button .arco-radio-button::before,
+.AttributesPanelWrapper .arco-radio-group-type-button .arco-radio-button::after {
+  display: none !important;
+}
+.AttributesPanelWrapper .arco-radio-group-type-button .arco-radio-button-inner {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 100%;
+  height: 100%;
+  padding: 0 !important;
+  overflow: hidden;
+  line-height: 1;
+  text-align: center;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+.AttributesPanelWrapper .arco-radio-group-type-button .arco-radio-button-inner > div,
+.AttributesPanelWrapper .arco-radio-group-type-button .arco-radio-button-inner .arco-space {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  min-width: 0;
+  width: 100%;
+  height: 100%;
+  overflow: hidden;
+  text-align: center;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+.AttributesPanelWrapper .arco-radio-group-type-button .arco-radio-button:hover {
+  background: var(--color-fill-2) !important;
+  color: var(--color-text-1);
+}
+.AttributesPanelWrapper .arco-radio-group-type-button .arco-radio-checked,
+.AttributesPanelWrapper .arco-radio-group-type-button .arco-radio-button-checked {
+  background: var(--color-bg-2) !important;
+  color: rgb(var(--primary-6)) !important;
+  font-weight: 600;
+  box-shadow: 0 1px 4px rgba(29, 33, 41, 0.12) !important;
 }.easy-email-pro-editor-controller {
   font-size: 14px;
   background: #fff;

package/lib/typings/components/ConfigurationToolbar/ConfigurationToolbarAttributeField/ColorPicker.d.ts

@@ -1,7 +1,5 @@
 import React from "react";
-import { Path } from "slate";
-export declare const ColorPicker: ({ path, name, label, }: {
-    path: Path;
-    name: string;
-    label: string;
+import { ToolbarColorPickerProps } from "./NewColorPicker";
+export declare const ColorPicker: ({ useNewColorPicker, ...props }: ToolbarColorPickerProps & {
+    useNewColorPicker?: boolean | undefined;
 }) => React.JSX.Element;

package/lib/typings/components/ConfigurationToolbar/ConfigurationToolbarAttributeField/LegacyColorPicker.d.ts

@@ -0,0 +1,3 @@
+import React from "react";
+import { ToolbarColorPickerProps } from "./NewColorPicker";
+export declare const LegacyColorPicker: (props: ToolbarColorPickerProps) => React.JSX.Element;

package/lib/typings/components/ConfigurationToolbar/ConfigurationToolbarAttributeField/NewColorPicker.d.ts

@@ -0,0 +1,9 @@
+import React from "react";
+import { Path } from "slate";
+export interface ToolbarColorPickerProps {
+    path: Path;
+    name: string;
+    label: string;
+}
+export declare const NewColorPickerInner: ({ path, name, label, }: ToolbarColorPickerProps) => React.JSX.Element;
+export declare const NewColorPicker: (props: ToolbarColorPickerProps) => React.JSX.Element;

package/lib/typings/components/ConfigurationToolbar/ConfigurationToolbarAttributeField/index.d.ts

@@ -14,9 +14,7 @@ export declare const ConfigurationToolbarAttributeField: {
         path: import("slate").Path;
         name: string;
     }) => import("react").JSX.Element;
-    ColorPicker: ({ path, name, label, }: {
-        path: import("slate").Path;
-        name: string;
-        label: string;
+    ColorPicker: ({ useNewColorPicker, ...props }: import("./NewColorPicker").ToolbarColorPickerProps & {
+        useNewColorPicker?: boolean | undefined;
     }) => import("react").JSX.Element;
 };

package/lib/typings/components/Form/ColorPicker/ArcoColorPickerConfigProvider.d.ts

@@ -0,0 +1,4 @@
+import React from "react";
+export declare const ArcoColorPickerConfigProvider: ({ children, }: {
+    children: React.ReactNode;
+}) => React.JSX.Element;

package/lib/typings/components/Form/ColorPicker/LegacyColorPicker.d.ts

@@ -0,0 +1,12 @@
+import { PopoverProps } from "@arco-design/web-react";
+import React from "react";
+export interface LegacyColorPickerProps extends PopoverProps {
+    onChange?: (val: string) => void;
+    onBlur?: React.FocusEventHandler<HTMLInputElement>;
+    value?: string;
+    label?: React.ReactNode;
+    children?: React.ReactNode;
+    showInput?: boolean;
+    placeholder?: string;
+}
+export declare const LegacyColorPicker: (props: LegacyColorPickerProps) => React.JSX.Element;

package/lib/typings/components/Form/ColorPicker/NewColorPicker.d.ts

@@ -0,0 +1,13 @@
+import { ColorPickerProps as ArcoColorPickerProps } from "@arco-design/web-react";
+import React from "react";
+export interface NewColorPickerProps extends Omit<ArcoColorPickerProps, "onChange" | "value" | "defaultValue" | "triggerElement"> {
+    onChange?: (val: string) => void;
+    value?: string;
+    label?: React.ReactNode;
+    children?: React.ReactNode;
+    onBlur?: React.FocusEventHandler<HTMLInputElement>;
+    showInput?: boolean;
+    placeholder?: string;
+    getPopupContainer?: (node: HTMLElement) => HTMLElement;
+}
+export declare const NewColorPicker: (props: NewColorPickerProps) => React.JSX.Element;

package/lib/typings/components/Form/ColorPicker/index.d.ts

@@ -1,13 +1,9 @@
-import { PopoverProps } from "@arco-design/web-react";
 import React, { ComponentProps } from "react";
-export interface ColorPickerProps extends PopoverProps {
-    onChange?: (val: string) => void;
-    onBlur?: React.FocusEventHandler<HTMLInputElement>;
-    value?: string;
-    label?: React.ReactNode;
-    children?: React.ReactNode;
-    showInput?: boolean;
-    placeholder?: string;
+import { PopoverProps } from "@arco-design/web-react";
+import { LegacyColorPickerProps } from "./LegacyColorPicker";
+import { NewColorPickerProps } from "./NewColorPicker";
+export interface ColorPickerProps extends Omit<PopoverProps, "onChange" | "value" | "getPopupContainer">, NewColorPickerProps, Pick<LegacyColorPickerProps, "children" | "onBlur" | "showInput" | "placeholder"> {
+    useNewColorPicker?: boolean;
 }
 declare const ColorPicker: (props: ColorPickerProps) => React.JSX.Element;
 declare const DefaultColorPicker: (props: import("../enhancer").EnhancerProps & Omit<ColorPickerProps, "onChange" | "value">) => React.JSX.Element;

package/lib/typings/typings/custom-types.d.ts

@@ -165,6 +165,7 @@ export interface PluginsCustomEditorTypes {
         showTextDirectionMode?: boolean;
         showDragMoveIcon?: boolean;
         showInsertTips?: boolean;
+        useNewColorPicker?: boolean;
         enabledHtmlBlockNodeAlign?: boolean;
         enabledPreviewEmailSubjectEdit?: boolean;
         enabledGradientImage?: boolean;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "easy-email-pro-theme",
-  "version": "1.57.11",
+  "version": "1.57.13",
   "description": "",
   "files": [
     "lib"