easy-email-pro-theme 0.15.0 → 1.0.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.
- package/lib/index.js +10 -10
- package/package.json +1 -1
package/lib/index.js
CHANGED
|
@@ -402,7 +402,7 @@ const styleText$c = `@font-face {
|
|
|
402
402
|
}
|
|
403
403
|
|
|
404
404
|
`;
|
|
405
|
-
const RetroStyleText = '[data-slate-block="page"] {\r\n min-height: 300px;\r\n}\r\n\r\n[data-slate-hover="true"] {\r\n z-index:
|
|
405
|
+
const RetroStyleText = '[data-slate-block="page"] {\r\n min-height: 300px;\r\n}\r\n\r\n\r\n[data-slate-hover="true"] {\r\n z-index: 4;\r\n}\r\n\r\n\r\n[data-slate-focus="true"] {\r\n z-index: 3;\r\n}\r\n\r\n\r\n[data-slate-selected="true"] {\r\n z-index: 3;\r\n}\r\n\r\n\r\n[data-slate-hover="true"] .element-tools-container {\r\n z-index: 4;\r\n}\r\n\r\n\r\n.text-mergetag {\r\n outline: 1px solid rgb(78, 89, 105);\r\n outline-offset: 1px;\r\n padding: 0 2px;\r\n border-radius: 2px;\r\n cursor: pointer;\r\n transition: all 0.1s linear;\r\n border: none;\r\n font-weight: inherit;\r\n outline-color: #00a0ac;\r\n color: inherit;\r\n background-color: #ebf9fc;\r\n max-width: 10em;\r\n font-style: inherit;\r\n text-decoration-line: inherit;\r\n position: relative;\r\n}\r\n\r\n\r\nbody .element-tools-container {\n outline: 2px solid var(--hover-color);\n z-index: 1;\n}\r\n\r\n\r\nbody .element-tools-container .element-tools {\n color: #fff;\n background-color: var(--hover-color);\n}\r\n\r\n\r\nbody .element-tools-container .element-drag-button {\n background-color: var(--hover-color);\n}\r\n\r\n\r\n[data-slate-dragover=true] {\n z-index: 2;\n}\r\n\r\n\r\n[data-slate-dragover=true]::after {\n content: "";\n position: absolute;\n pointer-events: none;\n inset: 0px;\n border-radius: 3px;\n background: var(--drag-color);\n z-index: 10;\n left: 0;\n height: 4px;\n opacity: 1;\n}\r\n\r\n\r\n[data-slate-dragging=true] .element-tools-container {\n opacity: 0;\n}\r\n\r\n\r\n[data-slate-dragover-direction=top][data-slate-dragover=true]::after {\n top: 0px;\n}\r\n\r\n\r\n[data-slate-dragover-direction=bottom][data-slate-dragover=true]::after {\n top: auto;\n bottom: 0px;\n}\r\n\r\n\r\n[data-slate-dragover-direction=middle][data-slate-dragover=true] {\n outline: 2px dashed var(--drag-color);\n z-index: 2;\n}\r\n\r\n\r\n[data-slate-dragover-direction=middle][data-slate-dragover=true]::after {\n content: "";\n position: absolute;\n pointer-events: none;\n inset: 0px;\n border-radius: 3px;\n background: var(--drag-color);\n z-index: 1;\n left: 0;\n height: 100%;\n width: 100%;\n filter: opacity(10%);\n}\r\n\r\n\r\n[data-slate-dragover-direction=middle][data-slate-dragover=true] [data-slate-type=placeholder] {\n outline: none;\n}\r\n\r\n\r\n[data-slate-type=placeholder] {\n min-height: 64px;\n position: relative;\n background-color: rgba(242, 244, 245, 0.64);\n outline: rgb(43, 152, 211) dashed 1px;\n outline-offset: -1px;\n display: flex;\n align-items: center;\n justify-content: center;\n font-size: 14px;\n font-weight: 400;\n line-height: 1.3;\n color: rgb(48, 59, 67);\n margin: 0 20px;\n}\r\n\r\n\r\n[data-slate-type=placeholder] .element-delete {\n border-radius: 2px;\n padding: 0px;\n cursor: pointer;\n height: 28px;\n width: 28px;\n background-color: rgb(223, 227, 230);\n color: rgb(96, 106, 114);\n display: flex;\n align-items: center;\n justify-content: center;\n position: absolute;\n left: 10px;\n top: 10px;\n}\r\n\r\n\r\n[data-slate-type=placeholder] .element-delete:hover {\n background-color: rgb(180, 187, 195);\n}\r\n\r\n\r\n[data-slate-type=placeholder] .element-delete svg {\n width: 20px;\n height: 20px;\n}\r\n\r\n\r\n[data-slate-universal-editing=true] {\n z-index: 2;\n}\r\n\r\n\r\n.universal-element-mask {\n position: absolute;\n width: 100%;\n height: 100%;\n left: 0;\n top: 0;\n z-index: 10;\n}\r\n\r\n\r\n[data-slate-universal-editing=true] .universal-element-mask {\n display: none;\n}\r\n\r\n\r\n[data-slate-universal-editing=true] .universal-element-editing-mask {\n z-index: 0;\n position: absolute;\n width: 100%;\n height: 100%;\n inset: 0px;\n}\r\n\r\n\r\n[data-slate-universal-editing=true] .universal-element-editing-mask::before {\n content: " ";\n width: 10000px;\n height: 10000px;\n position: fixed;\n left: 0;\n top: 0;\n transform: translate(-50%, -50%);\n}\r\n\r\n\r\n[data-slate-universal-editing=true] .universal-element-editing-mask::after {\n position: absolute;\n content: " ";\n width: 100%;\n height: 100%;\n inset: 0px;\n pointer-events: none;\n outline: 9999px solid rgba(255, 255, 255, 0.6);\n}';
|
|
406
406
|
const withTheme$1 = (editor) => {
|
|
407
407
|
const { insertBreak, normalizeNode, deleteBackward } = editor;
|
|
408
408
|
editor.insertBreak = (...args) => {
|
|
@@ -1741,7 +1741,7 @@ const ElementPlaceholder$1 = ({ element, nodeElement, isSelected, isHover, path:
|
|
|
1741
1741
|
const isContentElement = NodeUtils.isContentElement(element);
|
|
1742
1742
|
const isUniversalElement = NodeUtils.isUniversalElement(element);
|
|
1743
1743
|
if (isUniversalElement) {
|
|
1744
|
-
renderContent = /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, /* @__PURE__ */ React__default.createElement(
|
|
1744
|
+
renderContent = /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, /* @__PURE__ */ React__default.createElement("div", { className: "universal-element-mask" }), /* @__PURE__ */ React__default.createElement(
|
|
1745
1745
|
"div",
|
|
1746
1746
|
{
|
|
1747
1747
|
className: "universal-element-editing-mask",
|
|
@@ -32138,14 +32138,14 @@ const BgColor = () => {
|
|
|
32138
32138
|
(item2) => item2.contains(node)
|
|
32139
32139
|
);
|
|
32140
32140
|
},
|
|
32141
|
-
content: /* @__PURE__ */ React__default.createElement("div", null, /* @__PURE__ */ React__default.createElement(
|
|
32141
|
+
content: /* @__PURE__ */ React__default.createElement("div", null, /* @__PURE__ */ React__default.createElement(ColorProvider, null, /* @__PURE__ */ React__default.createElement(
|
|
32142
32142
|
ColorPickerContent,
|
|
32143
32143
|
{
|
|
32144
32144
|
value: (textNode == null ? void 0 : textNode.color) || "",
|
|
32145
32145
|
onChange,
|
|
32146
32146
|
onClose
|
|
32147
32147
|
}
|
|
32148
|
-
))
|
|
32148
|
+
)))
|
|
32149
32149
|
},
|
|
32150
32150
|
/* @__PURE__ */ React__default.createElement(Tooltip, { content: t("Background color") }, /* @__PURE__ */ React__default.createElement("span", { ref: ref2, className: classnames$1("formatButton") }, /* @__PURE__ */ React__default.createElement(
|
|
32151
32151
|
"span",
|
|
@@ -32210,14 +32210,14 @@ const FontColor = () => {
|
|
|
32210
32210
|
(item2) => item2.contains(node)
|
|
32211
32211
|
);
|
|
32212
32212
|
},
|
|
32213
|
-
content: /* @__PURE__ */ React__default.createElement("div", null, /* @__PURE__ */ React__default.createElement(
|
|
32213
|
+
content: /* @__PURE__ */ React__default.createElement("div", null, /* @__PURE__ */ React__default.createElement(ColorProvider, null, /* @__PURE__ */ React__default.createElement(
|
|
32214
32214
|
ColorPickerContent,
|
|
32215
32215
|
{
|
|
32216
32216
|
value: color2,
|
|
32217
32217
|
onChange,
|
|
32218
32218
|
onClose
|
|
32219
32219
|
}
|
|
32220
|
-
))
|
|
32220
|
+
)))
|
|
32221
32221
|
},
|
|
32222
32222
|
/* @__PURE__ */ React__default.createElement(Tooltip, { content: t("Font color") }, /* @__PURE__ */ React__default.createElement("span", { ref: ref2, className: classnames$1("formatButton") }, /* @__PURE__ */ React__default.createElement(
|
|
32223
32223
|
"span",
|
|
@@ -32757,7 +32757,7 @@ const FontFamily = () => {
|
|
|
32757
32757
|
), /* @__PURE__ */ React__default.createElement("style", null, `.easy-email-pro-font-family .arco-select-view { border: none; }`));
|
|
32758
32758
|
};
|
|
32759
32759
|
const RichTextBar = ({ list }) => {
|
|
32760
|
-
const { MergetagPopover: MergetagPopover2 } = useEditorProps();
|
|
32760
|
+
const { MergetagPopover: MergetagPopover2, mergetags } = useEditorProps();
|
|
32761
32761
|
const editor = useSlate();
|
|
32762
32762
|
const { selection } = editor;
|
|
32763
32763
|
const nodePath = (selection == null ? void 0 : selection.anchor.path) ? selection.anchor.path : null;
|
|
@@ -32824,7 +32824,7 @@ const RichTextBar = ({ list }) => {
|
|
|
32824
32824
|
),
|
|
32825
32825
|
[TextFormat.TEXT_COLOR]: /* @__PURE__ */ React__default.createElement(FontColor, null),
|
|
32826
32826
|
[TextFormat.BACKGROUND_COLOR]: /* @__PURE__ */ React__default.createElement(BgColor, null),
|
|
32827
|
-
[TextFormat.MERGETAG]: !mergetagNode && /* @__PURE__ */ React__default.createElement(MergeTag, null),
|
|
32827
|
+
[TextFormat.MERGETAG]: mergetags && !mergetagNode && /* @__PURE__ */ React__default.createElement(MergeTag, null),
|
|
32828
32828
|
[TextFormat.ALIGN]: /* @__PURE__ */ React__default.createElement(TextAlign, null),
|
|
32829
32829
|
[TextFormat.REMOVE_FORMAT]: /* @__PURE__ */ React__default.createElement(
|
|
32830
32830
|
FormatButton,
|
|
@@ -32838,7 +32838,7 @@ const RichTextBar = ({ list }) => {
|
|
|
32838
32838
|
return list.map((key2, index2) => {
|
|
32839
32839
|
return /* @__PURE__ */ React__default.createElement(React__default.Fragment, { key: key2 + index2 }, toolsMapping[key2]);
|
|
32840
32840
|
});
|
|
32841
|
-
}, [list, mergetagNode]);
|
|
32841
|
+
}, [list, mergetagNode, mergetags]);
|
|
32842
32842
|
return /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, /* @__PURE__ */ React__default.createElement("div", { style: { display: "inline-flex", alignItems: "stretch" } }, content), /* @__PURE__ */ React__default.createElement("div", { className: "mergtag-popover" }, mergetagNode && MergetagPopover2 && /* @__PURE__ */ React__default.createElement(
|
|
32843
32843
|
MergetagPopover2,
|
|
32844
32844
|
{
|
|
@@ -44559,7 +44559,7 @@ const ElementHover = (props) => {
|
|
|
44559
44559
|
}
|
|
44560
44560
|
return /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, createPortal(renderContent, nodeElement));
|
|
44561
44561
|
};
|
|
44562
|
-
const minimaliststyleText = '[data-slate-block="page"] {\r\n min-height: 300px;\r\n}\r\n\r\n[data-slate-hover="true"] {\r\n z-index:
|
|
44562
|
+
const minimaliststyleText = '[data-slate-block="page"] {\r\n min-height: 300px;\r\n}\r\n\r\n\r\n[data-slate-hover="true"] {\r\n z-index: 4;\r\n}\r\n\r\n\r\n[data-slate-focus="true"] {\r\n z-index: 3;\r\n}\r\n\r\n\r\n[data-slate-selected="true"] {\r\n z-index: 3;\r\n}\r\n\r\n\r\n[data-slate-hover="true"] .element-tools-container {\r\n z-index: 4;\r\n}\r\n\r\n\r\n.text-mergetag {\r\n outline: 1px solid rgb(78, 89, 105);\r\n outline-offset: 1px;\r\n padding: 0 2px;\r\n border-radius: 2px;\r\n cursor: pointer;\r\n transition: all 0.1s linear;\r\n border: none;\r\n font-weight: inherit;\r\n outline-color: #00a0ac;\r\n color: inherit;\r\n background-color: #ebf9fc;\r\n max-width: 10em;\r\n font-style: inherit;\r\n text-decoration-line: inherit;\r\n position: relative;\r\n}\r\n\r\n\r\n[data-slate-dragover=true] {\n z-index: 2;\n}\r\n\r\n\r\n[data-slate-dragover=true]::after {\n content: "";\n position: absolute;\n pointer-events: none;\n inset: 0px;\n border-radius: 3px;\n background: var(--drag-color);\n z-index: 10;\n left: 0;\n height: 4px;\n opacity: 1;\n}\r\n\r\n\r\n.element-dragover-placeholder-container {\n position: absolute;\n top: 0;\n left: 0px;\n width: 100%;\n pointer-events: none;\n user-select: none;\n}\r\n\r\n\r\n.element-dragover-placeholder-container * {\n pointer-events: none !important;\n user-select: none !important;\n}\r\n\r\n\r\n.element-dragover-placeholder {\n position: fixed;\n pointer-events: none;\n}\r\n\r\n\r\n[data-slate-dragover-direction=top][data-slate-dragover=true]::after {\n top: 0px;\n}\r\n\r\n\r\n[data-slate-dragover-direction=bottom][data-slate-dragover=true]::after {\n top: auto;\n bottom: 0px;\n}\r\n\r\n\r\n.text-empty::before {\n content: attr(placeholder);\n position: absolute;\n font-size: inherit;\n white-space: nowrap;\n pointer-events: none;\n caret-color: rgb(55, 53, 47);\n color: rgb(55, 53, 47);\n -webkit-text-fill-color: rgba(55, 53, 47, 0.5);\n width: 100%;\n left: 0;\n text-align: center;\n font-style: normal;\n font-weight: normal;\n}\r\n\r\n\r\n[data-empty-src=true] td > img {\n display: none !important;\n}';
|
|
44563
44563
|
const hideCursor = (editor) => {
|
|
44564
44564
|
const root2 = ReactEditor.getWindow(editor);
|
|
44565
44565
|
root2.document.body.setAttribute("data-slate-hide-cursor", "true");
|