@kontakto/email-template-editor 2.6.0 → 2.8.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/README.md +52 -0
- package/dist/index.cjs +842 -815
- package/dist/index.cjs.map +1 -1
- package/dist/index.js +637 -610
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import DOMPurify from 'dompurify';
|
|
2
2
|
import { marked, Renderer } from 'marked';
|
|
3
|
-
import
|
|
3
|
+
import React62, { createContext, forwardRef, useRef, useEffect, useImperativeHandle, useMemo, useContext, useState, useCallback, useLayoutEffect, Fragment } from 'react';
|
|
4
4
|
import { z } from 'zod';
|
|
5
5
|
import { renderToStaticMarkup as renderToStaticMarkup$1 } from 'react-dom/server';
|
|
6
6
|
import Handlebars from 'handlebars';
|
|
@@ -10,7 +10,7 @@ import { MenuItem, Stack, ThemeProvider, CssBaseline, useTheme, Drawer, Box, Tab
|
|
|
10
10
|
import { i18n } from '@lingui/core';
|
|
11
11
|
import { create, useStore } from 'zustand';
|
|
12
12
|
import { temporal } from 'zundo';
|
|
13
|
-
import { AddOutlined, SearchOutlined, MonitorOutlined, PhoneIphoneOutlined, MoreVertOutlined, DriveFileRenameOutlineOutlined, ContentCopyOutlined, LibraryAddOutlined, FileUploadOutlined, FileDownloadOutlined, DeleteOutlined, InsertDriveFileOutlined, DescriptionOutlined, EditOutlined, PreviewOutlined, CodeOutlined, SubjectOutlined, DataObjectOutlined, UndoOutlined, RedoOutlined, LastPageOutlined, AppRegistrationOutlined, CloudUploadOutlined, SaveOutlined, SaveAsOutlined, ViewColumnSharp, ExpandMore, ChevronRight, KeyboardArrowUp, KeyboardArrowDown, FirstPageOutlined, MenuOutlined,
|
|
13
|
+
import { AddOutlined, SearchOutlined, MonitorOutlined, PhoneIphoneOutlined, MoreVertOutlined, DriveFileRenameOutlineOutlined, ContentCopyOutlined, LibraryAddOutlined, FileUploadOutlined, FileDownloadOutlined, DeleteOutlined, InsertDriveFileOutlined, DescriptionOutlined, EditOutlined, PreviewOutlined, CodeOutlined, SubjectOutlined, DataObjectOutlined, UndoOutlined, RedoOutlined, LastPageOutlined, AppRegistrationOutlined, CloudUploadOutlined, SaveOutlined, SaveAsOutlined, GridOnOutlined, SquareOutlined, ViewColumnSharp, ExpandMore, ChevronRight, KeyboardArrowUp, KeyboardArrowDown, FirstPageOutlined, MenuOutlined, CheckOutlined, InputOutlined, DeleteOutline, RoundedCornerOutlined, AspectRatioOutlined, HeightOutlined, CollectionsOutlined, ErrorOutlineOutlined, VerticalAlignTopOutlined, VerticalAlignCenterOutlined, VerticalAlignBottomOutlined, SpaceBarOutlined, BusinessOutlined, ViewColumnOutlined, HtmlOutlined, Crop32Outlined, HorizontalRuleOutlined, ContactMailOutlined, AccountCircleOutlined, ImageOutlined, SmartButtonOutlined, NotesOutlined, HMobiledataOutlined, DashboardOutlined, CloseOutlined, AlignVerticalTopOutlined, AlignVerticalBottomOutlined, AlignHorizontalLeftOutlined, AlignHorizontalRightOutlined, FormatAlignLeftOutlined, FormatAlignCenterOutlined, FormatAlignRightOutlined, FormatLineSpacingOutlined, TextFieldsOutlined, FormatBoldOutlined, FormatItalicOutlined, LinkOutlined, ArrowUpwardOutlined, ArrowDownwardOutlined } from '@mui/icons-material';
|
|
14
14
|
import { HexColorPicker, HexColorInput } from 'react-colorful';
|
|
15
15
|
import hljs from 'highlight.js';
|
|
16
16
|
import jsonHighlighter from 'highlight.js/lib/languages/json';
|
|
@@ -184,7 +184,7 @@ function renderInlineMarkdownString(str) {
|
|
|
184
184
|
function EmailMarkdown(_a) {
|
|
185
185
|
var _b = _a, { markdown } = _b, props = __objRest(_b, ["markdown"]);
|
|
186
186
|
const data = useMemo(() => renderMarkdownString(markdown), [markdown]);
|
|
187
|
-
return /* @__PURE__ */
|
|
187
|
+
return /* @__PURE__ */ React62.createElement("div", __spreadProps(__spreadValues({}, props), { dangerouslySetInnerHTML: { __html: data } }));
|
|
188
188
|
}
|
|
189
189
|
var FONT_FAMILY_SCHEMA = z.enum([
|
|
190
190
|
"MODERN_SANS",
|
|
@@ -264,9 +264,9 @@ function Text({ style, props }) {
|
|
|
264
264
|
};
|
|
265
265
|
const text = (_g = props == null ? void 0 : props.text) != null ? _g : TextPropsDefaults.text;
|
|
266
266
|
if (props == null ? void 0 : props.markdown) {
|
|
267
|
-
return /* @__PURE__ */
|
|
267
|
+
return /* @__PURE__ */ React62.createElement(EmailMarkdown, { style: wStyle, markdown: text });
|
|
268
268
|
}
|
|
269
|
-
return /* @__PURE__ */
|
|
269
|
+
return /* @__PURE__ */ React62.createElement("div", { style: wStyle }, text);
|
|
270
270
|
}
|
|
271
271
|
var PADDING_SCHEMA2 = z.object({
|
|
272
272
|
top: z.number(),
|
|
@@ -315,7 +315,7 @@ function Avatar({ style, props }) {
|
|
|
315
315
|
textAlign: (_e = style == null ? void 0 : style.textAlign) != null ? _e : void 0,
|
|
316
316
|
padding: getPadding2(style == null ? void 0 : style.padding)
|
|
317
317
|
};
|
|
318
|
-
return /* @__PURE__ */
|
|
318
|
+
return /* @__PURE__ */ React62.createElement("div", { style: sectionStyle }, /* @__PURE__ */ React62.createElement(
|
|
319
319
|
"img",
|
|
320
320
|
{
|
|
321
321
|
alt,
|
|
@@ -467,14 +467,14 @@ function Button({ style, props }) {
|
|
|
467
467
|
padding: `${padding[0]}px ${padding[1]}px`,
|
|
468
468
|
textDecoration: "none"
|
|
469
469
|
};
|
|
470
|
-
return /* @__PURE__ */
|
|
470
|
+
return /* @__PURE__ */ React62.createElement("div", { style: wrapperStyle }, /* @__PURE__ */ React62.createElement("a", { href: url, style: linkStyle, target: "_blank" }, /* @__PURE__ */ React62.createElement(
|
|
471
471
|
"span",
|
|
472
472
|
{
|
|
473
473
|
dangerouslySetInnerHTML: {
|
|
474
474
|
__html: `<!--[if mso]><i style="letter-spacing: ${padding[1]}px;mso-font-width:-100%;mso-text-raise:${textRaise}" hidden> </i><![endif]-->`
|
|
475
475
|
}
|
|
476
476
|
}
|
|
477
|
-
), /* @__PURE__ */
|
|
477
|
+
), /* @__PURE__ */ React62.createElement("span", null, text), /* @__PURE__ */ React62.createElement(
|
|
478
478
|
"span",
|
|
479
479
|
{
|
|
480
480
|
dangerouslySetInnerHTML: {
|
|
@@ -523,7 +523,7 @@ function ColumnsContainer({ style, columns, props }) {
|
|
|
523
523
|
contentAlignment: (_d = props == null ? void 0 : props.contentAlignment) != null ? _d : ColumnsContainerPropsDefaults.contentAlignment,
|
|
524
524
|
fixedWidths: props == null ? void 0 : props.fixedWidths
|
|
525
525
|
};
|
|
526
|
-
return /* @__PURE__ */
|
|
526
|
+
return /* @__PURE__ */ React62.createElement("div", { style: wStyle }, /* @__PURE__ */ React62.createElement(
|
|
527
527
|
"table",
|
|
528
528
|
{
|
|
529
529
|
align: "center",
|
|
@@ -532,7 +532,7 @@ function ColumnsContainer({ style, columns, props }) {
|
|
|
532
532
|
border: 0,
|
|
533
533
|
style: { tableLayout: "fixed", borderCollapse: "collapse" }
|
|
534
534
|
},
|
|
535
|
-
/* @__PURE__ */
|
|
535
|
+
/* @__PURE__ */ React62.createElement("tbody", { style: { width: "100%" } }, /* @__PURE__ */ React62.createElement("tr", { style: { width: "100%" } }, /* @__PURE__ */ React62.createElement(TableCell, { index: 0, props: blockProps, columns }), /* @__PURE__ */ React62.createElement(TableCell, { index: 1, props: blockProps, columns }), /* @__PURE__ */ React62.createElement(TableCell, { index: 2, props: blockProps, columns })))
|
|
536
536
|
));
|
|
537
537
|
}
|
|
538
538
|
function TableCell({ index, props, columns }) {
|
|
@@ -550,7 +550,7 @@ function TableCell({ index, props, columns }) {
|
|
|
550
550
|
width: (_d = (_c = props.fixedWidths) == null ? void 0 : _c[index]) != null ? _d : void 0
|
|
551
551
|
};
|
|
552
552
|
const children = (_e = columns && columns[index]) != null ? _e : null;
|
|
553
|
-
return /* @__PURE__ */
|
|
553
|
+
return /* @__PURE__ */ React62.createElement("td", { style }, children);
|
|
554
554
|
}
|
|
555
555
|
function getPaddingBefore(index, { columnsGap, columnsCount }) {
|
|
556
556
|
if (index === 0) {
|
|
@@ -612,9 +612,9 @@ function Container({ style, children }) {
|
|
|
612
612
|
padding: getPadding5(style == null ? void 0 : style.padding)
|
|
613
613
|
};
|
|
614
614
|
if (!children) {
|
|
615
|
-
return /* @__PURE__ */
|
|
615
|
+
return /* @__PURE__ */ React62.createElement("div", { style: wStyle });
|
|
616
616
|
}
|
|
617
|
-
return /* @__PURE__ */
|
|
617
|
+
return /* @__PURE__ */ React62.createElement("div", { style: wStyle }, children);
|
|
618
618
|
}
|
|
619
619
|
var container_default = Container;
|
|
620
620
|
var COLOR_SCHEMA5 = z.string().regex(/^#[0-9a-fA-F]{6}$/).nullable().optional();
|
|
@@ -648,7 +648,7 @@ function Divider({ style, props }) {
|
|
|
648
648
|
};
|
|
649
649
|
const borderTopWidth = (_b = props == null ? void 0 : props.lineHeight) != null ? _b : DividerPropsDefaults.lineHeight;
|
|
650
650
|
const borderTopColor = (_c = props == null ? void 0 : props.lineColor) != null ? _c : DividerPropsDefaults.lineColor;
|
|
651
|
-
return /* @__PURE__ */
|
|
651
|
+
return /* @__PURE__ */ React62.createElement("div", { style: st }, /* @__PURE__ */ React62.createElement(
|
|
652
652
|
"hr",
|
|
653
653
|
{
|
|
654
654
|
style: {
|
|
@@ -746,11 +746,11 @@ function Heading({ props, style }) {
|
|
|
746
746
|
const renderProps = isMarkdown ? { style: hStyle, dangerouslySetInnerHTML: { __html: html2 != null ? html2 : "" } } : { style: hStyle, children: text };
|
|
747
747
|
switch (level) {
|
|
748
748
|
case "h1":
|
|
749
|
-
return /* @__PURE__ */
|
|
749
|
+
return /* @__PURE__ */ React62.createElement("h1", __spreadValues({}, renderProps));
|
|
750
750
|
case "h2":
|
|
751
|
-
return /* @__PURE__ */
|
|
751
|
+
return /* @__PURE__ */ React62.createElement("h2", __spreadValues({}, renderProps));
|
|
752
752
|
case "h3":
|
|
753
|
-
return /* @__PURE__ */
|
|
753
|
+
return /* @__PURE__ */ React62.createElement("h3", __spreadValues({}, renderProps));
|
|
754
754
|
}
|
|
755
755
|
}
|
|
756
756
|
function getFontSize(level) {
|
|
@@ -832,9 +832,9 @@ function Html({ style, props }) {
|
|
|
832
832
|
padding: getPadding8(style == null ? void 0 : style.padding)
|
|
833
833
|
};
|
|
834
834
|
if (!children) {
|
|
835
|
-
return /* @__PURE__ */
|
|
835
|
+
return /* @__PURE__ */ React62.createElement("div", { style: cssStyle });
|
|
836
836
|
}
|
|
837
|
-
return /* @__PURE__ */
|
|
837
|
+
return /* @__PURE__ */ React62.createElement("div", { style: cssStyle, dangerouslySetInnerHTML: { __html: children } });
|
|
838
838
|
}
|
|
839
839
|
var html_default = Html;
|
|
840
840
|
var PADDING_SCHEMA9 = z.object({
|
|
@@ -870,7 +870,7 @@ function Image({ style, props }) {
|
|
|
870
870
|
const linkHref = (_c = props == null ? void 0 : props.linkHref) != null ? _c : null;
|
|
871
871
|
const width = (_d = props == null ? void 0 : props.width) != null ? _d : void 0;
|
|
872
872
|
const height = (_e = props == null ? void 0 : props.height) != null ? _e : void 0;
|
|
873
|
-
const imageElement = /* @__PURE__ */
|
|
873
|
+
const imageElement = /* @__PURE__ */ React62.createElement(
|
|
874
874
|
"img",
|
|
875
875
|
{
|
|
876
876
|
alt: (_f = props == null ? void 0 : props.alt) != null ? _f : "",
|
|
@@ -890,9 +890,9 @@ function Image({ style, props }) {
|
|
|
890
890
|
}
|
|
891
891
|
);
|
|
892
892
|
if (!linkHref) {
|
|
893
|
-
return /* @__PURE__ */
|
|
893
|
+
return /* @__PURE__ */ React62.createElement("div", { style: sectionStyle }, imageElement);
|
|
894
894
|
}
|
|
895
|
-
return /* @__PURE__ */
|
|
895
|
+
return /* @__PURE__ */ React62.createElement("div", { style: sectionStyle }, /* @__PURE__ */ React62.createElement("a", { href: linkHref, style: { textDecoration: "none" }, target: "_blank" }, imageElement));
|
|
896
896
|
}
|
|
897
897
|
var image_default = Image;
|
|
898
898
|
var FONT_FAMILY_SCHEMA5 = z.enum([
|
|
@@ -1038,7 +1038,7 @@ function Signature({ style, props }) {
|
|
|
1038
1038
|
color: linkColor,
|
|
1039
1039
|
textDecoration: "none"
|
|
1040
1040
|
};
|
|
1041
|
-
const imageElement = imageUrl ? /* @__PURE__ */
|
|
1041
|
+
const imageElement = imageUrl ? /* @__PURE__ */ React62.createElement(
|
|
1042
1042
|
"img",
|
|
1043
1043
|
{
|
|
1044
1044
|
src: imageUrl,
|
|
@@ -1057,18 +1057,18 @@ function Signature({ style, props }) {
|
|
|
1057
1057
|
}
|
|
1058
1058
|
) : null;
|
|
1059
1059
|
const contactParts = [];
|
|
1060
|
-
if (email) contactParts.push(/* @__PURE__ */
|
|
1061
|
-
if (phone) contactParts.push(/* @__PURE__ */
|
|
1060
|
+
if (email) contactParts.push(/* @__PURE__ */ React62.createElement("a", { key: "email", href: `mailto:${email}`, style: linkStyle }, email));
|
|
1061
|
+
if (phone) contactParts.push(/* @__PURE__ */ React62.createElement("a", { key: "phone", href: `tel:${phone}`, style: linkStyle }, phone));
|
|
1062
1062
|
if (website) {
|
|
1063
1063
|
const href = website.startsWith("http") ? website : `https://${website}`;
|
|
1064
|
-
contactParts.push(/* @__PURE__ */
|
|
1064
|
+
contactParts.push(/* @__PURE__ */ React62.createElement("a", { key: "website", href, style: linkStyle, target: "_blank" }, website));
|
|
1065
1065
|
}
|
|
1066
|
-
const textContent = /* @__PURE__ */
|
|
1067
|
-
const greetingElement = greeting ? /* @__PURE__ */
|
|
1066
|
+
const textContent = /* @__PURE__ */ React62.createElement("div", null, name && /* @__PURE__ */ React62.createElement("p", { style: nameStyle }, name), title && /* @__PURE__ */ React62.createElement("p", { style: detailStyle }, title), company && /* @__PURE__ */ React62.createElement("p", { style: detailStyle }, company), address && /* @__PURE__ */ React62.createElement("p", { style: detailStyle }, address), contactParts.length > 0 && /* @__PURE__ */ React62.createElement("p", { style: __spreadProps(__spreadValues({}, detailStyle), { marginTop: 4 }) }, contactParts.map((part, i) => /* @__PURE__ */ React62.createElement(React62.Fragment, { key: i }, i > 0 && /* @__PURE__ */ React62.createElement("span", { style: detailStyle }, " \xB7 "), part))));
|
|
1067
|
+
const greetingElement = greeting ? /* @__PURE__ */ React62.createElement("p", { style: greetingStyle }, greeting) : null;
|
|
1068
1068
|
if (layout === "vertical") {
|
|
1069
|
-
return /* @__PURE__ */
|
|
1069
|
+
return /* @__PURE__ */ React62.createElement("div", { style: wrapperStyle }, greetingElement, imageElement && /* @__PURE__ */ React62.createElement("div", { style: { marginBottom: 12 } }, imageElement), textContent);
|
|
1070
1070
|
}
|
|
1071
|
-
return /* @__PURE__ */
|
|
1071
|
+
return /* @__PURE__ */ React62.createElement("div", { style: wrapperStyle }, greetingElement, /* @__PURE__ */ React62.createElement("table", { cellPadding: "0", cellSpacing: "0", border: 0, role: "presentation" }, /* @__PURE__ */ React62.createElement("tbody", null, /* @__PURE__ */ React62.createElement("tr", null, imageElement && /* @__PURE__ */ React62.createElement("td", { style: { verticalAlign: "middle", paddingRight: 16 } }, imageElement), /* @__PURE__ */ React62.createElement("td", { style: { verticalAlign: "middle" } }, textContent)))));
|
|
1072
1072
|
}
|
|
1073
1073
|
var signature_default = Signature;
|
|
1074
1074
|
var SpacerPropsSchema = z.object({
|
|
@@ -1085,13 +1085,13 @@ function Spacer({ props }) {
|
|
|
1085
1085
|
const style = {
|
|
1086
1086
|
height: (_a = props == null ? void 0 : props.height) != null ? _a : SpacerPropsDefaults.height
|
|
1087
1087
|
};
|
|
1088
|
-
return /* @__PURE__ */
|
|
1088
|
+
return /* @__PURE__ */ React62.createElement("div", { style });
|
|
1089
1089
|
}
|
|
1090
1090
|
var spacer_default = Spacer;
|
|
1091
1091
|
function buildBlockComponent(blocks) {
|
|
1092
1092
|
return function BlockComponent({ type, data }) {
|
|
1093
1093
|
const Component = blocks[type].Component;
|
|
1094
|
-
return /* @__PURE__ */
|
|
1094
|
+
return /* @__PURE__ */ React62.createElement(Component, __spreadValues({}, data));
|
|
1095
1095
|
};
|
|
1096
1096
|
}
|
|
1097
1097
|
function buildBlockConfigurationSchema(blocks) {
|
|
@@ -1160,9 +1160,9 @@ function ColumnsContainerReader({ style, props }) {
|
|
|
1160
1160
|
const _a = props != null ? props : {}, { columns } = _a, restProps = __objRest(_a, ["columns"]);
|
|
1161
1161
|
let cols = void 0;
|
|
1162
1162
|
if (columns) {
|
|
1163
|
-
cols = columns.map((col) => col.childrenIds.map((childId) => /* @__PURE__ */
|
|
1163
|
+
cols = columns.map((col) => col.childrenIds.map((childId) => /* @__PURE__ */ React62.createElement(ReaderBlock, { key: childId, id: childId })));
|
|
1164
1164
|
}
|
|
1165
|
-
return /* @__PURE__ */
|
|
1165
|
+
return /* @__PURE__ */ React62.createElement(columns_container_default, { props: restProps, columns: cols, style });
|
|
1166
1166
|
}
|
|
1167
1167
|
var ContainerPropsSchema2 = z.object({
|
|
1168
1168
|
style: ContainerPropsSchema.shape.style,
|
|
@@ -1173,7 +1173,7 @@ var ContainerPropsSchema2 = z.object({
|
|
|
1173
1173
|
function ContainerReader({ style, props }) {
|
|
1174
1174
|
var _a;
|
|
1175
1175
|
const childrenIds = (_a = props == null ? void 0 : props.childrenIds) != null ? _a : [];
|
|
1176
|
-
return /* @__PURE__ */
|
|
1176
|
+
return /* @__PURE__ */ React62.createElement(container_default, { style }, childrenIds.map((childId) => /* @__PURE__ */ React62.createElement(ReaderBlock, { key: childId, id: childId })));
|
|
1177
1177
|
}
|
|
1178
1178
|
var COLOR_SCHEMA9 = z.string().regex(/^#[0-9a-fA-F]{6}$/).nullable().optional();
|
|
1179
1179
|
var FONT_FAMILY_SCHEMA6 = z.enum([
|
|
@@ -1246,9 +1246,9 @@ function EmailLayoutReader(props) {
|
|
|
1246
1246
|
margin: "0"
|
|
1247
1247
|
};
|
|
1248
1248
|
if (props.backdropDisabled) {
|
|
1249
|
-
return /* @__PURE__ */
|
|
1249
|
+
return /* @__PURE__ */ React62.createElement("div", { style: baseStyle }, childrenIds.map((childId) => /* @__PURE__ */ React62.createElement(ReaderBlock, { key: childId, id: childId })));
|
|
1250
1250
|
}
|
|
1251
|
-
return /* @__PURE__ */
|
|
1251
|
+
return /* @__PURE__ */ React62.createElement(
|
|
1252
1252
|
"div",
|
|
1253
1253
|
{
|
|
1254
1254
|
style: __spreadProps(__spreadValues({}, baseStyle), {
|
|
@@ -1258,7 +1258,7 @@ function EmailLayoutReader(props) {
|
|
|
1258
1258
|
width: "100%"
|
|
1259
1259
|
})
|
|
1260
1260
|
},
|
|
1261
|
-
/* @__PURE__ */
|
|
1261
|
+
/* @__PURE__ */ React62.createElement(
|
|
1262
1262
|
"table",
|
|
1263
1263
|
{
|
|
1264
1264
|
align: "center",
|
|
@@ -1276,7 +1276,7 @@ function EmailLayoutReader(props) {
|
|
|
1276
1276
|
cellPadding: "0",
|
|
1277
1277
|
border: 0
|
|
1278
1278
|
},
|
|
1279
|
-
/* @__PURE__ */
|
|
1279
|
+
/* @__PURE__ */ React62.createElement("tbody", null, /* @__PURE__ */ React62.createElement("tr", { style: { width: "100%" } }, /* @__PURE__ */ React62.createElement("td", null, childrenIds.map((childId) => /* @__PURE__ */ React62.createElement(ReaderBlock, { key: childId, id: childId })))))
|
|
1280
1280
|
)
|
|
1281
1281
|
);
|
|
1282
1282
|
}
|
|
@@ -1288,7 +1288,7 @@ function useReaderDocument() {
|
|
|
1288
1288
|
}
|
|
1289
1289
|
function ReaderBlock({ id }) {
|
|
1290
1290
|
const document2 = useReaderDocument();
|
|
1291
|
-
return document2[id] ? /* @__PURE__ */
|
|
1291
|
+
return document2[id] ? /* @__PURE__ */ React62.createElement(BaseReaderBlock, __spreadValues({}, document2[id])) : null;
|
|
1292
1292
|
}
|
|
1293
1293
|
var READER_DICTIONARY = buildBlockConfigurationDictionary({
|
|
1294
1294
|
ColumnsContainer: {
|
|
@@ -1345,13 +1345,13 @@ var ReaderBlockSchema = buildBlockConfigurationSchema(READER_DICTIONARY);
|
|
|
1345
1345
|
var ReaderDocumentSchema = z.record(z.string(), ReaderBlockSchema);
|
|
1346
1346
|
var BaseReaderBlock = buildBlockComponent(READER_DICTIONARY);
|
|
1347
1347
|
function Reader({ document: document2, rootBlockId }) {
|
|
1348
|
-
return /* @__PURE__ */
|
|
1348
|
+
return /* @__PURE__ */ React62.createElement(ReaderContext.Provider, { value: document2 }, /* @__PURE__ */ React62.createElement(ReaderBlock, { id: rootBlockId }));
|
|
1349
1349
|
}
|
|
1350
1350
|
|
|
1351
1351
|
// src/email-builder/renderers/render-to-static-markup.tsx
|
|
1352
1352
|
function renderToStaticMarkup(document2, { rootBlockId, variables }) {
|
|
1353
1353
|
const html2 = "<!DOCTYPE html>" + renderToStaticMarkup$1(
|
|
1354
|
-
/* @__PURE__ */
|
|
1354
|
+
/* @__PURE__ */ React62.createElement("html", null, /* @__PURE__ */ React62.createElement("body", null, /* @__PURE__ */ React62.createElement(Reader, { document: document2, rootBlockId })))
|
|
1355
1355
|
);
|
|
1356
1356
|
if (!variables) return html2;
|
|
1357
1357
|
return evaluateHandlebars(html2, variables);
|
|
@@ -2005,13 +2005,13 @@ var THEME = createTheme(BASE_THEME, {
|
|
|
2005
2005
|
var theme_default = THEME;
|
|
2006
2006
|
|
|
2007
2007
|
// src/locales/en/messages.ts
|
|
2008
|
-
var messages = JSON.parse('{"drawer.library":["Library"],"drawer.new-sample":["New sample"],"drawer.new-template":["New template"],"drawer.no-samples":["No samples available"],"drawer.no-samples-match":["No samples match your filters"],"drawer.no-templates":["No saved templates yet"],"drawer.no-templates-match":["No templates match your filters"],"drawer.search-samples":["Search samples"],"drawer.search-templates":["Search templates"],"drawer.sort-by":["Sort by"],"drawer.tab.outline":["Outline"],"drawer.tab.samples":["Samples"],"drawer.tab.templates":["Templates"],"drawer.tag.all":["All"],"panel.avatar-block":["Avatar block"],"panel.button-block":["Button block"],"panel.columns-block":["Columns block"],"panel.container-block":["Container block"],"panel.divider-block":["Divider block"],"panel.editor-appearance":["Editor appearance"],"panel.export":["Export"],"panel.global":["Global"],"panel.heading-block":["Heading block"],"panel.html-block":["HTML block"],"panel.image-block":["Image block"],"panel.signature-block":["Signature block"],"panel.spacer-block":["Spacer block"],"panel.template":["Template"],"panel.text-block":["Text block"],"savebar.error-saving":["Error saving"],"savebar.new":["New"],"savebar.new-template-created":["New template created"],"savebar.sample-prefix":["Sample"],"savebar.sample-saved":["Sample saved"],"savebar.save":["Save"],"savebar.save-as":["Save as\u2026"],"savebar.save-as-new":["Save as new\u2026"],"savebar.save-as-new-template":["Save as a new template"],"savebar.save-changes":["Save changes"],"savebar.save-changes-to-sample":["Save changes to this sample"],"savebar.start-fresh":["Start a fresh template"],"savebar.template-saved":["Template saved"],"sort.last-updated":["Last updated"],"sort.name":["Name (A\u2013Z)"],"sort.recently-created":["Recently created"],"style.alignment":["Alignment"],"style.background-color":["Background color"],"style.border-color":["Border color"],"style.border-radius":["Border radius"],"style.font-family":["Font family"],"style.font-size":["Font size"],"style.font-weight":["Font weight"],"style.letter-spacing":["Letter spacing"],"style.line-height":["Line height"],"style.padding":["Padding"],"style.text-color":["Text color"],"toolbar.bold":["Bold"],"toolbar.bold-shortcut":["Bold (Cmd+B)"],"toolbar.italic":["Italic"],"toolbar.italic-shortcut":["Italic (Cmd+I)"],"toolbar.link":["Link"],"toolbar.link-shortcut":["Link (Cmd+K)"],"tune.copy":["Copy block"],"tune.delete":["Delete"],"tune.move-down":["Move down"],"tune.move-up":["Move up"]}');
|
|
2008
|
+
var messages = JSON.parse('{"avatar.shape":["Shape"],"block-add.avatar":["Avatar"],"block-add.button":["Button"],"block-add.columns":["Columns"],"block-add.company-signature":["Company Signature"],"block-add.container":["Container"],"block-add.divider":["Divider"],"block-add.heading":["Heading"],"block-add.html":["Html"],"block-add.image":["Image"],"block-add.personal-signature":["Personal Signature"],"block-add.spacer":["Spacer"],"block-add.text":["Text"],"button.color":["Button color"],"button.style.pill":["Pill"],"button.style.rectangle":["Rectangle"],"button.style.rounded":["Rounded"],"button.width.auto":["Auto"],"button.width.full":["Full"],"canvas.desktop-view":["Desktop view"],"canvas.mobile-view":["Mobile view"],"columns.count":["Number of columns"],"columns.gap":["Columns gap"],"common.add":["Add"],"common.cancel":["Cancel"],"common.save":["Save"],"common.saving":["Saving\u2026"],"divider.color":["Color"],"drawer.library":["Library"],"drawer.new-sample":["New sample"],"drawer.new-template":["New template"],"drawer.no-samples":["No samples available"],"drawer.no-samples-match":["No samples match your filters"],"drawer.no-templates":["No saved templates yet"],"drawer.no-templates-match":["No templates match your filters"],"drawer.search-samples":["Search samples"],"drawer.search-templates":["Search templates"],"drawer.sort-by":["Sort by"],"drawer.tab.outline":["Outline"],"drawer.tab.samples":["Samples"],"drawer.tab.templates":["Templates"],"drawer.tag.all":["All"],"empty.description":["A blank email template to start from scratch"],"empty.slug":["Empty email"],"field.content":["Content"],"field.height":["Height"],"field.level":["Level"],"field.markdown":["Markdown"],"field.size":["Size"],"field.style":["Style"],"field.text":["Text"],"field.url":["Url"],"field.width":["Width"],"global.backdrop-color":["Backdrop color"],"global.canvas-border-color":["Canvas border color"],"global.canvas-border-radius":["Canvas border radius"],"global.canvas-color":["Canvas color"],"global.disable-backdrop":["Disable backdrop"],"image.alt-text":["Alt text"],"image.http-warning":["Non-HTTPS URL: Gmail and other clients strip mixed content. Use https:// for reliable delivery."],"image.library":["Library"],"image.link-href":["Click through URL"],"image.source-url":["Source URL"],"image.upload":["Upload"],"image.uploading":["Uploading\u2026"],"inspect.hint":["Click on a block to inspect."],"inspect.not-found":["Block not found. Click on a block to reset."],"inspector.tab.inspect":["Inspect"],"inspector.tab.settings":["Settings"],"inspector.tab.styles":["Styles"],"inspector.tab.variables":["Variables"],"outline.canvas":["Canvas"],"outline.hint":["Click a row to select. Drag a row to reorder or move it into a container."],"outline.title":["Outline"],"panel.avatar-block":["Avatar block"],"panel.button-block":["Button block"],"panel.columns-block":["Columns block"],"panel.container-block":["Container block"],"panel.details":["Details"],"panel.divider-block":["Divider block"],"panel.editor-appearance":["Editor appearance"],"panel.export":["Export"],"panel.global":["Global"],"panel.heading-block":["Heading block"],"panel.html-block":["HTML block"],"panel.image-block":["Image block"],"panel.signature-block":["Signature block"],"panel.spacer-block":["Spacer block"],"panel.template":["Template"],"panel.text-block":["Text block"],"picker.blank-desc":["Start from an empty email"],"picker.blank-title":["Blank"],"picker.create-sample":["Create sample"],"picker.create-template":["Create template"],"picker.creating":["Creating\u2026"],"picker.error-name-required":["Name is required"],"picker.error-sample-taken":["A sample with this name already exists"],"picker.error-template-taken":["A template with this name already exists"],"picker.start-from":["Start from"],"picker.title-sample":["New sample"],"picker.title-template":["New template"],"redo.label":["Redo"],"redo.tooltip":["Redo"],"rename.add-tag":["Add a tag"],"rename.error-empty":["Please enter a name"],"rename.error-generic":["Failed to update template details"],"rename.error-taken":["A template with this name already exists"],"rename.name-label":["Name"],"rename.no-tags":["No tags yet."],"rename.tag-placeholder":["Add a tag and press Enter"],"rename.tags":["Tags"],"rename.title":["Edit details"],"row.actions":["Row actions"],"row.demote":["Demote to template"],"row.duplicate":["Duplicate"],"row.duplicate-as-template":["Duplicate as template"],"row.edit-details":["Edit name & tags\u2026"],"row.more":["More"],"row.promote":["Promote to sample"],"save-dialog.create":["Create"],"save-dialog.error-empty-name":["Please enter a template name"],"save-dialog.name-label":["Template Name"],"save-dialog.save":["Save"],"save-dialog.saving":["Saving..."],"save-dialog.title":["Save as a new template"],"save-dialog.title-new":["Create a new template"],"savebar.error-saving":["Error saving"],"savebar.new":["New"],"savebar.new-template-created":["New template created"],"savebar.sample-prefix":["Sample"],"savebar.sample-saved":["Sample saved"],"savebar.save":["Save"],"savebar.save-as":["Save as\u2026"],"savebar.save-as-new":["Save as new\u2026"],"savebar.save-as-new-template":["Save as a new template"],"savebar.save-changes":["Save changes"],"savebar.save-changes-to-sample":["Save changes to this sample"],"savebar.start-fresh":["Start a fresh template"],"savebar.template-saved":["Template saved"],"settings.checkerboard":["Checkerboard"],"settings.copied":["Template copied successfully!"],"settings.delete":["Delete Template"],"settings.delete-confirm":["Are you sure you want to delete this template?"],"settings.editor-only-hint":["Editor-only \u2014 never reaches the rendered email."],"settings.no-rename-cb":["Wire a renameTemplate callback to enable editing from here"],"settings.no-template":["No template selected"],"settings.save-as-sample":["Save as Sample Template"],"settings.save-details":["Save details"],"settings.save-disabled":["Save functionality is disabled. To enable saving, provide the necessary callback functions."],"settings.saved":["Saved"],"settings.solid":["Solid"],"settings.workspace-background":["Workspace background"],"signature.address":["Address"],"signature.company":["Company"],"signature.email":["Email"],"signature.greeting":["Greeting"],"signature.image-shape":["Image shape"],"signature.image-size":["Image size"],"signature.image-url":["Image URL"],"signature.layout":["Layout"],"signature.layout.horizontal":["Horizontal"],"signature.layout.vertical":["Vertical"],"signature.link-color":["Link color"],"signature.name":["Name"],"signature.name-color":["Name color"],"signature.phone":["Phone"],"signature.shape.circle":["Circle"],"signature.shape.rounded":["Rounded"],"signature.shape.square":["Square"],"signature.title":["Title"],"signature.website":["Website"],"size.lg":["Lg"],"size.md":["Md"],"size.sm":["Sm"],"size.xs":["Xs"],"sort.last-updated":["Last updated"],"sort.name":["Name (A\u2013Z)"],"sort.recently-created":["Recently created"],"style.alignment":["Alignment"],"style.background-color":["Background color"],"style.border-color":["Border color"],"style.border-radius":["Border radius"],"style.font-family":["Font family"],"style.font-size":["Font size"],"style.font-weight":["Font weight"],"style.letter-spacing":["Letter spacing"],"style.line-height":["Line height"],"style.padding":["Padding"],"style.text-color":["Text color"],"tab.edit":["Edit"],"tab.html-output":["HTML output"],"tab.json-output":["JSON output"],"tab.preview":["Preview"],"tab.text-output":["Plain text output"],"tag.marketing":["marketing"],"tag.transactional":["transactional"],"time.days-short":["d ago"],"time.hours-short":["h ago"],"time.just-now":["just now"],"time.minutes-short":["m ago"],"time.months-short":["mo ago"],"time.years-short":["y ago"],"toolbar.bold":["Bold"],"toolbar.bold-shortcut":["Bold (Cmd+B)"],"toolbar.italic":["Italic"],"toolbar.italic-shortcut":["Italic (Cmd+I)"],"toolbar.link":["Link"],"toolbar.link-shortcut":["Link (Cmd+K)"],"tune.copy":["Copy block"],"tune.delete":["Delete"],"tune.move-down":["Move down"],"tune.move-up":["Move up"],"undo.label":["Undo"],"undo.tooltip":["Undo"]}');
|
|
2009
2009
|
|
|
2010
2010
|
// src/locales/fi/messages.ts
|
|
2011
|
-
var messages2 = JSON.parse('{"drawer.library":["Kirjasto"],"drawer.new-sample":["Uusi malli"],"drawer.new-template":["Uusi pohja"],"drawer.no-samples":["Ei malleja saatavilla"],"drawer.no-samples-match":["Mik\xE4\xE4n malli ei vastaa hakua"],"drawer.no-templates":["Ei tallennettuja pohjia"],"drawer.no-templates-match":["Mik\xE4\xE4n pohja ei vastaa hakua"],"drawer.search-samples":["Etsi malleja"],"drawer.search-templates":["Etsi pohjia"],"drawer.sort-by":["J\xE4rjestys"],"drawer.tab.outline":["Rakenne"],"drawer.tab.samples":["Mallit"],"drawer.tab.templates":["Pohjat"],"drawer.tag.all":["Kaikki"],"panel.avatar-block":["Avatarlohko"],"panel.button-block":["Painikelohko"],"panel.columns-block":["Sarakkeet"],"panel.container-block":["S\xE4ili\xF6lohko"],"panel.divider-block":["Erotin"],"panel.editor-appearance":["Editorin ulkoasu"],"panel.export":["Vienti"],"panel.global":["Yleiset"],"panel.heading-block":["Otsikkolohko"],"panel.html-block":["HTML-lohko"],"panel.image-block":["Kuvalohko"],"panel.signature-block":["Allekirjoituslohko"],"panel.spacer-block":["V\xE4lilohko"],"panel.template":["Pohja"],"panel.text-block":["Tekstilohko"],"savebar.error-saving":["Tallennus ep\xE4onnistui"],"savebar.new":["Uusi"],"savebar.new-template-created":["Uusi pohja luotu"],"savebar.sample-prefix":["Malli"],"savebar.sample-saved":["Malli tallennettu"],"savebar.save":["Tallenna"],"savebar.save-as":["Tallenna nimell\xE4\u2026"],"savebar.save-as-new":["Tallenna uutena\u2026"],"savebar.save-as-new-template":["Tallenna uutena pohjana"],"savebar.save-changes":["Tallenna muutokset"],"savebar.save-changes-to-sample":["Tallenna muutokset t\xE4h\xE4n malliin"],"savebar.start-fresh":["Aloita tyhj\xE4st\xE4 pohjasta"],"savebar.template-saved":["Pohja tallennettu"],"sort.last-updated":["Viimeksi p\xE4ivitetty"],"sort.name":["Nimi (A\u2013\xD6)"],"sort.recently-created":["\xC4skett\xE4in luotu"],"style.alignment":["Tasaus"],"style.background-color":["Taustav\xE4ri"],"style.border-color":["Reunan v\xE4ri"],"style.border-radius":["Reunan py\xF6ristys"],"style.font-family":["Fontti"],"style.font-size":["Fonttikoko"],"style.font-weight":["Fontin paksuus"],"style.letter-spacing":["Kirjainv\xE4li"],"style.line-height":["Rivikorkeus"],"style.padding":["T\xE4yte"],"style.text-color":["Tekstin v\xE4ri"],"toolbar.bold":["Lihavointi"],"toolbar.bold-shortcut":["Lihavointi (Cmd+B)"],"toolbar.italic":["Kursivointi"],"toolbar.italic-shortcut":["Kursivointi (Cmd+I)"],"toolbar.link":["Linkki"],"toolbar.link-shortcut":["Linkki (Cmd+K)"],"tune.copy":["Kopioi lohko"],"tune.delete":["Poista"],"tune.move-down":["Siirr\xE4 alas"],"tune.move-up":["Siirr\xE4 yl\xF6s"]}');
|
|
2011
|
+
var messages2 = JSON.parse('{"avatar.shape":["Muoto"],"block-add.avatar":["Avatar"],"block-add.button":["Painike"],"block-add.columns":["Sarakkeet"],"block-add.company-signature":["Yritysallekirjoitus"],"block-add.container":["S\xE4ili\xF6"],"block-add.divider":["Erotin"],"block-add.heading":["Otsikko"],"block-add.html":["HTML"],"block-add.image":["Kuva"],"block-add.personal-signature":["Henkil\xF6kohtainen allekirjoitus"],"block-add.spacer":["V\xE4li"],"block-add.text":["Teksti"],"button.color":["Painikkeen v\xE4ri"],"button.style.pill":["Pilleri"],"button.style.rectangle":["Suorakaide"],"button.style.rounded":["Py\xF6ristetty"],"button.width.auto":["Automaattinen"],"button.width.full":["T\xE4ysi"],"canvas.desktop-view":["Ty\xF6p\xF6yt\xE4n\xE4kym\xE4"],"canvas.mobile-view":["Mobiilin\xE4kym\xE4"],"columns.count":["Sarakkeiden m\xE4\xE4r\xE4"],"columns.gap":["Sarakev\xE4li"],"common.add":["Lis\xE4\xE4"],"common.cancel":["Peruuta"],"common.save":["Tallenna"],"common.saving":["Tallennetaan\u2026"],"divider.color":["V\xE4ri"],"drawer.library":["Kirjasto"],"drawer.new-sample":["Uusi malli"],"drawer.new-template":["Uusi pohja"],"drawer.no-samples":["Ei malleja saatavilla"],"drawer.no-samples-match":["Mik\xE4\xE4n malli ei vastaa hakua"],"drawer.no-templates":["Ei tallennettuja pohjia"],"drawer.no-templates-match":["Mik\xE4\xE4n pohja ei vastaa hakua"],"drawer.search-samples":["Etsi malleja"],"drawer.search-templates":["Etsi pohjia"],"drawer.sort-by":["J\xE4rjestys"],"drawer.tab.outline":["Rakenne"],"drawer.tab.samples":["Mallit"],"drawer.tab.templates":["Pohjat"],"drawer.tag.all":["Kaikki"],"empty.description":["Tyhj\xE4 s\xE4hk\xF6postipohja, aloita tyhj\xE4lt\xE4 p\xF6yd\xE4lt\xE4"],"empty.slug":["Tyhj\xE4 s\xE4hk\xF6posti"],"field.content":["Sis\xE4lt\xF6"],"field.height":["Korkeus"],"field.level":["Taso"],"field.markdown":["Markdown"],"field.size":["Koko"],"field.style":["Tyyli"],"field.text":["Teksti"],"field.url":["Osoite"],"field.width":["Leveys"],"global.backdrop-color":["Taustav\xE4ri"],"global.canvas-border-color":["Kankaan reunan v\xE4ri"],"global.canvas-border-radius":["Kankaan reunan py\xF6ristys"],"global.canvas-color":["Kankaan v\xE4ri"],"global.disable-backdrop":["Piilota taustav\xE4ri"],"image.alt-text":["Vaihtoehtoinen teksti"],"image.http-warning":["Ei-HTTPS-osoite: Gmail ja muut asiakasohjelmat poistavat sekoitetun sis\xE4ll\xF6n. K\xE4yt\xE4 https:// varmaa toimitusta varten."],"image.library":["Kirjasto"],"image.link-href":["Linkin osoite"],"image.source-url":["L\xE4hdeosoite"],"image.upload":["Lataa"],"image.uploading":["Ladataan\u2026"],"inspect.hint":["Valitse lohko napsauttamalla."],"inspect.not-found":["Lohkoa ei l\xF6ytynyt. Palaa napsauttamalla toista lohkoa."],"inspector.tab.inspect":["Tarkastele"],"inspector.tab.settings":["Asetukset"],"inspector.tab.styles":["Tyylit"],"inspector.tab.variables":["Muuttujat"],"outline.canvas":["Kangas"],"outline.hint":["Valitse rivi napsauttamalla. Raahaa rivi\xE4 j\xE4rjestyksen muuttamiseksi tai siirr\xE4 se s\xE4ili\xF6\xF6n."],"outline.title":["Rakenne"],"panel.avatar-block":["Avatarlohko"],"panel.button-block":["Painikelohko"],"panel.columns-block":["Sarakkeet"],"panel.container-block":["S\xE4ili\xF6lohko"],"panel.details":["Tiedot"],"panel.divider-block":["Erotin"],"panel.editor-appearance":["Editorin ulkoasu"],"panel.export":["Vienti"],"panel.global":["Yleiset"],"panel.heading-block":["Otsikkolohko"],"panel.html-block":["HTML-lohko"],"panel.image-block":["Kuvalohko"],"panel.signature-block":["Allekirjoituslohko"],"panel.spacer-block":["V\xE4lilohko"],"panel.template":["Pohja"],"panel.text-block":["Tekstilohko"],"picker.blank-desc":["Aloita tyhj\xE4st\xE4 s\xE4hk\xF6postista"],"picker.blank-title":["Tyhj\xE4"],"picker.create-sample":["Luo malli"],"picker.create-template":["Luo pohja"],"picker.creating":["Luodaan\u2026"],"picker.error-name-required":["Nimi vaaditaan"],"picker.error-sample-taken":["Samanniminen malli on jo olemassa"],"picker.error-template-taken":["Samanniminen pohja on jo olemassa"],"picker.start-from":["Aloitetaan pohjasta"],"picker.title-sample":["Uusi malli"],"picker.title-template":["Uusi pohja"],"redo.label":["Tee uudelleen"],"redo.tooltip":["Tee uudelleen"],"rename.add-tag":["Lis\xE4\xE4 tunniste"],"rename.error-empty":["Anna nimi"],"rename.error-generic":["Tietojen p\xE4ivitys ep\xE4onnistui"],"rename.error-taken":["Samanniminen pohja on jo olemassa"],"rename.name-label":["Nimi"],"rename.no-tags":["Ei tunnisteita."],"rename.tag-placeholder":["Lis\xE4\xE4 tunniste ja paina Enter"],"rename.tags":["Tunnisteet"],"rename.title":["Muokkaa tietoja"],"row.actions":["Rivin toiminnot"],"row.demote":["Alenna pohjaksi"],"row.duplicate":["Monista"],"row.duplicate-as-template":["Monista pohjaksi"],"row.edit-details":["Muokkaa nime\xE4 ja tunnisteita\u2026"],"row.more":["Lis\xE4\xE4"],"row.promote":["Ylenn\xE4 malliksi"],"save-dialog.create":["Luo"],"save-dialog.error-empty-name":["Anna pohjalle nimi"],"save-dialog.name-label":["Pohjan nimi"],"save-dialog.save":["Tallenna"],"save-dialog.saving":["Tallennetaan..."],"save-dialog.title":["Tallenna uutena pohjana"],"save-dialog.title-new":["Luo uusi pohja"],"savebar.error-saving":["Tallennus ep\xE4onnistui"],"savebar.new":["Uusi"],"savebar.new-template-created":["Uusi pohja luotu"],"savebar.sample-prefix":["Malli"],"savebar.sample-saved":["Malli tallennettu"],"savebar.save":["Tallenna"],"savebar.save-as":["Tallenna nimell\xE4\u2026"],"savebar.save-as-new":["Tallenna uutena\u2026"],"savebar.save-as-new-template":["Tallenna uutena pohjana"],"savebar.save-changes":["Tallenna muutokset"],"savebar.save-changes-to-sample":["Tallenna muutokset t\xE4h\xE4n malliin"],"savebar.start-fresh":["Aloita tyhj\xE4st\xE4 pohjasta"],"savebar.template-saved":["Pohja tallennettu"],"settings.checkerboard":["Shakkikuvio"],"settings.copied":["Pohja kopioitu!"],"settings.delete":["Poista pohja"],"settings.delete-confirm":["Haluatko varmasti poistaa t\xE4m\xE4n pohjan?"],"settings.editor-only-hint":["N\xE4kyy vain editorissa \u2014 ei p\xE4\xE4dy l\xE4hetett\xE4v\xE4\xE4n viestiin."],"settings.no-rename-cb":["Anna renameTemplate-callback k\xE4ytt\xF6\xF6n, niin voit muokata t\xE4st\xE4"],"settings.no-template":["Pohjaa ei ole valittu"],"settings.save-as-sample":["Tallenna mallipohjaksi"],"settings.save-details":["Tallenna tiedot"],"settings.save-disabled":["Tallennus on poistettu k\xE4yt\xF6st\xE4. Ota k\xE4ytt\xF6\xF6n antamalla tarvittavat callback-funktiot."],"settings.saved":["Tallennettu"],"settings.solid":["Yksiv\xE4rinen"],"settings.workspace-background":["Ty\xF6tilan tausta"],"signature.address":["Osoite"],"signature.company":["Yritys"],"signature.email":["S\xE4hk\xF6posti"],"signature.greeting":["Tervehdys"],"signature.image-shape":["Kuvan muoto"],"signature.image-size":["Kuvan koko"],"signature.image-url":["Kuvan osoite"],"signature.layout":["Asettelu"],"signature.layout.horizontal":["Vaakasuora"],"signature.layout.vertical":["Pystysuora"],"signature.link-color":["Linkin v\xE4ri"],"signature.name":["Nimi"],"signature.name-color":["Nimen v\xE4ri"],"signature.phone":["Puhelin"],"signature.shape.circle":["Ympyr\xE4"],"signature.shape.rounded":["Py\xF6ristetty"],"signature.shape.square":["Neli\xF6"],"signature.title":["Titteli"],"signature.website":["Verkkosivusto"],"size.lg":["Lg"],"size.md":["Md"],"size.sm":["Sm"],"size.xs":["Xs"],"sort.last-updated":["Viimeksi p\xE4ivitetty"],"sort.name":["Nimi (A\u2013\xD6)"],"sort.recently-created":["\xC4skett\xE4in luotu"],"style.alignment":["Tasaus"],"style.background-color":["Taustav\xE4ri"],"style.border-color":["Reunan v\xE4ri"],"style.border-radius":["Reunan py\xF6ristys"],"style.font-family":["Fontti"],"style.font-size":["Fonttikoko"],"style.font-weight":["Fontin paksuus"],"style.letter-spacing":["Kirjainv\xE4li"],"style.line-height":["Rivikorkeus"],"style.padding":["T\xE4yte"],"style.text-color":["Tekstin v\xE4ri"],"tab.edit":["Muokkaa"],"tab.html-output":["HTML-tuloste"],"tab.json-output":["JSON-tuloste"],"tab.preview":["Esikatselu"],"tab.text-output":["Tekstituloste"],"tag.marketing":["markkinointi"],"tag.transactional":["tapahtumaviestit"],"time.days-short":[" pv sitten"],"time.hours-short":[" h sitten"],"time.just-now":["juuri nyt"],"time.minutes-short":[" min sitten"],"time.months-short":[" kk sitten"],"time.years-short":[" v sitten"],"toolbar.bold":["Lihavointi"],"toolbar.bold-shortcut":["Lihavointi (Cmd+B)"],"toolbar.italic":["Kursivointi"],"toolbar.italic-shortcut":["Kursivointi (Cmd+I)"],"toolbar.link":["Linkki"],"toolbar.link-shortcut":["Linkki (Cmd+K)"],"tune.copy":["Kopioi lohko"],"tune.delete":["Poista"],"tune.move-down":["Siirr\xE4 alas"],"tune.move-up":["Siirr\xE4 yl\xF6s"],"undo.label":["Kumoa"],"undo.tooltip":["Kumoa"]}');
|
|
2012
2012
|
|
|
2013
2013
|
// src/locales/sv/messages.ts
|
|
2014
|
-
var messages3 = JSON.parse('{"drawer.library":["Bibliotek"],"drawer.new-sample":["Ny mall"],"drawer.new-template":["Ny e-postmall"],"drawer.no-samples":["Inga exempel tillg\xE4ngliga"],"drawer.no-samples-match":["Inga exempel matchar dina filter"],"drawer.no-templates":["Inga sparade mallar \xE4nnu"],"drawer.no-templates-match":["Inga mallar matchar dina filter"],"drawer.search-samples":["S\xF6k exempel"],"drawer.search-templates":["S\xF6k mallar"],"drawer.sort-by":["Sortera efter"],"drawer.tab.outline":["Struktur"],"drawer.tab.samples":["Exempel"],"drawer.tab.templates":["Mallar"],"drawer.tag.all":["Alla"],"panel.avatar-block":["Avatarblock"],"panel.button-block":["Knappblock"],"panel.columns-block":["Kolumner"],"panel.container-block":["Beh\xE5llarblock"],"panel.divider-block":["Avgr\xE4nsare"],"panel.editor-appearance":["Editorns utseende"],"panel.export":["Exportera"],"panel.global":["Allm\xE4nt"],"panel.heading-block":["Rubrikblock"],"panel.html-block":["HTML-block"],"panel.image-block":["Bildblock"],"panel.signature-block":["Signaturblock"],"panel.spacer-block":["Mellanrumsblock"],"panel.template":["Mall"],"panel.text-block":["Textblock"],"savebar.error-saving":["Fel vid sparande"],"savebar.new":["Ny"],"savebar.new-template-created":["Ny mall skapad"],"savebar.sample-prefix":["Exempel"],"savebar.sample-saved":["Exempel sparat"],"savebar.save":["Spara"],"savebar.save-as":["Spara som\u2026"],"savebar.save-as-new":["Spara som ny\u2026"],"savebar.save-as-new-template":["Spara som en ny mall"],"savebar.save-changes":["Spara \xE4ndringar"],"savebar.save-changes-to-sample":["Spara \xE4ndringar till detta exempel"],"savebar.start-fresh":["Starta en ny mall"],"savebar.template-saved":["Mall sparad"],"sort.last-updated":["Senast uppdaterad"],"sort.name":["Namn (A\u2013\xD6)"],"sort.recently-created":["Nyligen skapad"],"style.alignment":["Justering"],"style.background-color":["Bakgrundsf\xE4rg"],"style.border-color":["Kantf\xE4rg"],"style.border-radius":["Kantradie"],"style.font-family":["Typsnitt"],"style.font-size":["Typsnittsstorlek"],"style.font-weight":["Typsnittsvikt"],"style.letter-spacing":["Teckenavst\xE5nd"],"style.line-height":["Radh\xF6jd"],"style.padding":["Utrymme"],"style.text-color":["Textf\xE4rg"],"toolbar.bold":["Fet"],"toolbar.bold-shortcut":["Fet (Cmd+B)"],"toolbar.italic":["Kursiv"],"toolbar.italic-shortcut":["Kursiv (Cmd+I)"],"toolbar.link":["L\xE4nk"],"toolbar.link-shortcut":["L\xE4nk (Cmd+K)"],"tune.copy":["Kopiera block"],"tune.delete":["Ta bort"],"tune.move-down":["Flytta ner"],"tune.move-up":["Flytta upp"]}');
|
|
2014
|
+
var messages3 = JSON.parse('{"avatar.shape":["Form"],"block-add.avatar":["Avatar"],"block-add.button":["Knapp"],"block-add.columns":["Kolumner"],"block-add.company-signature":["F\xF6retagssignatur"],"block-add.container":["Beh\xE5llare"],"block-add.divider":["Avgr\xE4nsare"],"block-add.heading":["Rubrik"],"block-add.html":["HTML"],"block-add.image":["Bild"],"block-add.personal-signature":["Personlig signatur"],"block-add.spacer":["Mellanrum"],"block-add.text":["Text"],"button.color":["Knappf\xE4rg"],"button.style.pill":["Piller"],"button.style.rectangle":["Rektangel"],"button.style.rounded":["Rundad"],"button.width.auto":["Auto"],"button.width.full":["Full"],"canvas.desktop-view":["Skrivbordsvy"],"canvas.mobile-view":["Mobilvy"],"columns.count":["Antal kolumner"],"columns.gap":["Kolumnmellanrum"],"common.add":["L\xE4gg till"],"common.cancel":["Avbryt"],"common.save":["Spara"],"common.saving":["Sparar\u2026"],"divider.color":["F\xE4rg"],"drawer.library":["Bibliotek"],"drawer.new-sample":["Ny mall"],"drawer.new-template":["Ny e-postmall"],"drawer.no-samples":["Inga exempel tillg\xE4ngliga"],"drawer.no-samples-match":["Inga exempel matchar dina filter"],"drawer.no-templates":["Inga sparade mallar \xE4nnu"],"drawer.no-templates-match":["Inga mallar matchar dina filter"],"drawer.search-samples":["S\xF6k exempel"],"drawer.search-templates":["S\xF6k mallar"],"drawer.sort-by":["Sortera efter"],"drawer.tab.outline":["Struktur"],"drawer.tab.samples":["Exempel"],"drawer.tab.templates":["Mallar"],"drawer.tag.all":["Alla"],"empty.description":["En tom e-postmall att utg\xE5 fr\xE5n"],"empty.slug":["Tomt e-postmeddelande"],"field.content":["Inneh\xE5ll"],"field.height":["H\xF6jd"],"field.level":["Niv\xE5"],"field.markdown":["Markdown"],"field.size":["Storlek"],"field.style":["Stil"],"field.text":["Text"],"field.url":["Adress"],"field.width":["Bredd"],"global.backdrop-color":["Bakgrundsf\xE4rg"],"global.canvas-border-color":["Canvaskantf\xE4rg"],"global.canvas-border-radius":["Canvaskantradie"],"global.canvas-color":["Canvasf\xE4rg"],"global.disable-backdrop":["D\xF6lj bakgrund"],"image.alt-text":["Alternativ text"],"image.http-warning":["Icke-HTTPS-URL: Gmail och andra klienter tar bort blandat inneh\xE5ll. Anv\xE4nd https:// f\xF6r p\xE5litlig leverans."],"image.library":["Bibliotek"],"image.link-href":["Klickl\xE4nk"],"image.source-url":["K\xE4lladress"],"image.upload":["Ladda upp"],"image.uploading":["Laddar upp\u2026"],"inspect.hint":["Klicka p\xE5 ett block f\xF6r att inspektera."],"inspect.not-found":["Blocket hittades inte. Klicka p\xE5 ett block f\xF6r att \xE5terst\xE4lla."],"inspector.tab.inspect":["Inspektera"],"inspector.tab.settings":["Inst\xE4llningar"],"inspector.tab.styles":["Stilar"],"inspector.tab.variables":["Variabler"],"outline.canvas":["Canvas"],"outline.hint":["Klicka p\xE5 en rad f\xF6r att v\xE4lja. Dra en rad f\xF6r att \xE4ndra ordning eller flytta till en beh\xE5llare."],"outline.title":["Struktur"],"panel.avatar-block":["Avatarblock"],"panel.button-block":["Knappblock"],"panel.columns-block":["Kolumner"],"panel.container-block":["Beh\xE5llarblock"],"panel.details":["Detaljer"],"panel.divider-block":["Avgr\xE4nsare"],"panel.editor-appearance":["Editorns utseende"],"panel.export":["Exportera"],"panel.global":["Allm\xE4nt"],"panel.heading-block":["Rubrikblock"],"panel.html-block":["HTML-block"],"panel.image-block":["Bildblock"],"panel.signature-block":["Signaturblock"],"panel.spacer-block":["Mellanrumsblock"],"panel.template":["Mall"],"panel.text-block":["Textblock"],"picker.blank-desc":["Starta fr\xE5n ett tomt e-postmeddelande"],"picker.blank-title":["Tomt"],"picker.create-sample":["Skapa exempel"],"picker.create-template":["Skapa mall"],"picker.creating":["Skapar\u2026"],"picker.error-name-required":["Namn kr\xE4vs"],"picker.error-sample-taken":["Ett exempel med detta namn finns redan"],"picker.error-template-taken":["En mall med detta namn finns redan"],"picker.start-from":["Utg\xE5 fr\xE5n"],"picker.title-sample":["Nytt exempel"],"picker.title-template":["Ny mall"],"redo.label":["G\xF6r om"],"redo.tooltip":["G\xF6r om"],"rename.add-tag":["L\xE4gg till en etikett"],"rename.error-empty":["Ange ett namn"],"rename.error-generic":["Kunde inte uppdatera malldetaljer"],"rename.error-taken":["En mall med detta namn finns redan"],"rename.name-label":["Namn"],"rename.no-tags":["Inga etiketter \xE4nnu."],"rename.tag-placeholder":["L\xE4gg till en etikett och tryck Enter"],"rename.tags":["Etiketter"],"rename.title":["Redigera detaljer"],"row.actions":["Rad\xE5tg\xE4rder"],"row.demote":["Degradera till mall"],"row.duplicate":["Duplicera"],"row.duplicate-as-template":["Duplicera som mall"],"row.edit-details":["Redigera namn och etiketter\u2026"],"row.more":["Mer"],"row.promote":["Befordra till exempel"],"save-dialog.create":["Skapa"],"save-dialog.error-empty-name":["Ange ett mallnamn"],"save-dialog.name-label":["Mallnamn"],"save-dialog.save":["Spara"],"save-dialog.saving":["Sparar..."],"save-dialog.title":["Spara som en ny mall"],"save-dialog.title-new":["Skapa en ny mall"],"savebar.error-saving":["Fel vid sparande"],"savebar.new":["Ny"],"savebar.new-template-created":["Ny mall skapad"],"savebar.sample-prefix":["Exempel"],"savebar.sample-saved":["Exempel sparat"],"savebar.save":["Spara"],"savebar.save-as":["Spara som\u2026"],"savebar.save-as-new":["Spara som ny\u2026"],"savebar.save-as-new-template":["Spara som en ny mall"],"savebar.save-changes":["Spara \xE4ndringar"],"savebar.save-changes-to-sample":["Spara \xE4ndringar till detta exempel"],"savebar.start-fresh":["Starta en ny mall"],"savebar.template-saved":["Mall sparad"],"settings.checkerboard":["Rutm\xF6nster"],"settings.copied":["Mall kopierad!"],"settings.delete":["Ta bort mall"],"settings.delete-confirm":["\xC4r du s\xE4ker p\xE5 att du vill ta bort denna mall?"],"settings.editor-only-hint":["Syns bara i editorn \u2014 n\xE5r aldrig det renderade mejlet."],"settings.no-rename-cb":["Koppla renameTemplate-callback f\xF6r att kunna redigera h\xE4rifr\xE5n"],"settings.no-template":["Ingen mall vald"],"settings.save-as-sample":["Spara som exempelmall"],"settings.save-details":["Spara detaljer"],"settings.save-disabled":["Sparfunktionen \xE4r inaktiverad. Aktivera genom att ange n\xF6dv\xE4ndiga callback-funktioner."],"settings.saved":["Sparad"],"settings.solid":["Enf\xE4rgad"],"settings.workspace-background":["Arbetsytans bakgrund"],"signature.address":["Adress"],"signature.company":["F\xF6retag"],"signature.email":["E-post"],"signature.greeting":["H\xE4lsning"],"signature.image-shape":["Bildform"],"signature.image-size":["Bildstorlek"],"signature.image-url":["Bildadress"],"signature.layout":["Layout"],"signature.layout.horizontal":["Horisontell"],"signature.layout.vertical":["Vertikal"],"signature.link-color":["L\xE4nkf\xE4rg"],"signature.name":["Namn"],"signature.name-color":["Namnf\xE4rg"],"signature.phone":["Telefon"],"signature.shape.circle":["Cirkel"],"signature.shape.rounded":["Rundad"],"signature.shape.square":["Kvadrat"],"signature.title":["Titel"],"signature.website":["Webbplats"],"size.lg":["Lg"],"size.md":["Md"],"size.sm":["Sm"],"size.xs":["Xs"],"sort.last-updated":["Senast uppdaterad"],"sort.name":["Namn (A\u2013\xD6)"],"sort.recently-created":["Nyligen skapad"],"style.alignment":["Justering"],"style.background-color":["Bakgrundsf\xE4rg"],"style.border-color":["Kantf\xE4rg"],"style.border-radius":["Kantradie"],"style.font-family":["Typsnitt"],"style.font-size":["Typsnittsstorlek"],"style.font-weight":["Typsnittsvikt"],"style.letter-spacing":["Teckenavst\xE5nd"],"style.line-height":["Radh\xF6jd"],"style.padding":["Utrymme"],"style.text-color":["Textf\xE4rg"],"tab.edit":["Redigera"],"tab.html-output":["HTML-utdata"],"tab.json-output":["JSON-utdata"],"tab.preview":["F\xF6rhandsgranska"],"tab.text-output":["Textutdata"],"tag.marketing":["marknadsf\xF6ring"],"tag.transactional":["transaktionella"],"time.days-short":[" d sedan"],"time.hours-short":[" tim sedan"],"time.just-now":["just nu"],"time.minutes-short":[" min sedan"],"time.months-short":[" m\xE5n sedan"],"time.years-short":[" \xE5r sedan"],"toolbar.bold":["Fet"],"toolbar.bold-shortcut":["Fet (Cmd+B)"],"toolbar.italic":["Kursiv"],"toolbar.italic-shortcut":["Kursiv (Cmd+I)"],"toolbar.link":["L\xE4nk"],"toolbar.link-shortcut":["L\xE4nk (Cmd+K)"],"tune.copy":["Kopiera block"],"tune.delete":["Ta bort"],"tune.move-down":["Flytta ner"],"tune.move-up":["Flytta upp"],"undo.label":["\xC5ngra"],"undo.tooltip":["\xC5ngra"]}');
|
|
2015
2015
|
var SUPPORTED_LOCALES = ["en", "sv", "fi"];
|
|
2016
2016
|
var CATALOGS = {
|
|
2017
2017
|
en: messages,
|
|
@@ -2298,7 +2298,7 @@ var EmailEditorProvider = ({
|
|
|
2298
2298
|
setCurrentTemplateTags
|
|
2299
2299
|
]
|
|
2300
2300
|
);
|
|
2301
|
-
return /* @__PURE__ */
|
|
2301
|
+
return /* @__PURE__ */ React62.createElement(EmailEditorContext.Provider, { value }, children);
|
|
2302
2302
|
};
|
|
2303
2303
|
var useEmailEditor = () => {
|
|
2304
2304
|
const context = useContext(EmailEditorContext);
|
|
@@ -2312,7 +2312,7 @@ function ImageCallbacksProvider({
|
|
|
2312
2312
|
callbacks,
|
|
2313
2313
|
children
|
|
2314
2314
|
}) {
|
|
2315
|
-
return /* @__PURE__ */
|
|
2315
|
+
return /* @__PURE__ */ React62.createElement(ImageCallbacksContext.Provider, { value: callbacks }, children);
|
|
2316
2316
|
}
|
|
2317
2317
|
function useImageCallbacks() {
|
|
2318
2318
|
return useContext(ImageCallbacksContext);
|
|
@@ -2332,19 +2332,20 @@ var TITLE_KEYS = {
|
|
|
2332
2332
|
"Divider block": "panel.divider-block",
|
|
2333
2333
|
"Columns block": "panel.columns-block",
|
|
2334
2334
|
"Container block": "panel.container-block",
|
|
2335
|
-
"Html block": "panel.html-block"
|
|
2335
|
+
"Html block": "panel.html-block",
|
|
2336
|
+
Details: "panel.details"
|
|
2336
2337
|
};
|
|
2337
2338
|
function BaseSidebarPanel({ title, children }) {
|
|
2338
2339
|
const key = TITLE_KEYS[title];
|
|
2339
2340
|
const displayTitle = key ? t(key, title) : title;
|
|
2340
|
-
return /* @__PURE__ */
|
|
2341
|
+
return /* @__PURE__ */ React62.createElement(Box, { p: 2 }, /* @__PURE__ */ React62.createElement(Typography, { variant: "overline", color: "text.secondary", sx: { display: "block", mb: 2 } }, displayTitle), /* @__PURE__ */ React62.createElement(Stack, { spacing: 5, mb: 3 }, children));
|
|
2341
2342
|
}
|
|
2342
2343
|
function RadioGroupInput({ label, children, defaultValue, onChange }) {
|
|
2343
2344
|
const [value, setValue] = useState(defaultValue);
|
|
2344
2345
|
useEffect(() => {
|
|
2345
2346
|
setValue(defaultValue);
|
|
2346
2347
|
}, [defaultValue]);
|
|
2347
|
-
return /* @__PURE__ */
|
|
2348
|
+
return /* @__PURE__ */ React62.createElement(Stack, { alignItems: "flex-start" }, /* @__PURE__ */ React62.createElement(InputLabel, { shrink: true }, label), /* @__PURE__ */ React62.createElement(
|
|
2348
2349
|
ToggleButtonGroup,
|
|
2349
2350
|
{
|
|
2350
2351
|
exclusive: true,
|
|
@@ -2364,7 +2365,7 @@ function RadioGroupInput({ label, children, defaultValue, onChange }) {
|
|
|
2364
2365
|
}
|
|
2365
2366
|
function RawSliderInput(_a) {
|
|
2366
2367
|
var _b = _a, { iconLabel, value, setValue, units } = _b, props = __objRest(_b, ["iconLabel", "value", "setValue", "units"]);
|
|
2367
|
-
return /* @__PURE__ */
|
|
2368
|
+
return /* @__PURE__ */ React62.createElement(Stack, { direction: "row", alignItems: "center", spacing: 2, justifyContent: "space-between", width: "100%" }, /* @__PURE__ */ React62.createElement(Box, { sx: { minWidth: 24, lineHeight: 1, flexShrink: 0 } }, iconLabel), /* @__PURE__ */ React62.createElement(
|
|
2368
2369
|
Slider,
|
|
2369
2370
|
__spreadProps(__spreadValues({}, props), {
|
|
2370
2371
|
value,
|
|
@@ -2375,14 +2376,14 @@ function RawSliderInput(_a) {
|
|
|
2375
2376
|
setValue(value2);
|
|
2376
2377
|
}
|
|
2377
2378
|
})
|
|
2378
|
-
), /* @__PURE__ */
|
|
2379
|
+
), /* @__PURE__ */ React62.createElement(Box, { sx: { minWidth: 32, textAlign: "right", flexShrink: 0 } }, /* @__PURE__ */ React62.createElement(Typography, { variant: "body2", color: "text.secondary", sx: { lineHeight: 1 } }, value, units)));
|
|
2379
2380
|
}
|
|
2380
2381
|
|
|
2381
2382
|
// src/app/inspector-drawer/configuration-panel/input-panels/helpers/inputs/slider-input.tsx
|
|
2382
2383
|
function SliderInput(_a) {
|
|
2383
2384
|
var _b = _a, { label, defaultValue, onChange } = _b, props = __objRest(_b, ["label", "defaultValue", "onChange"]);
|
|
2384
2385
|
const [value, setValue] = useState(defaultValue);
|
|
2385
|
-
return /* @__PURE__ */
|
|
2386
|
+
return /* @__PURE__ */ React62.createElement(Stack, { spacing: 1, alignItems: "flex-start" }, /* @__PURE__ */ React62.createElement(InputLabel, { shrink: true }, label), /* @__PURE__ */ React62.createElement(
|
|
2386
2387
|
RawSliderInput,
|
|
2387
2388
|
__spreadValues({
|
|
2388
2389
|
value,
|
|
@@ -2399,7 +2400,7 @@ function TextInput({ helperText, label, placeholder, rows, InputProps: InputProp
|
|
|
2399
2400
|
useEffect(() => {
|
|
2400
2401
|
setValue(defaultValue);
|
|
2401
2402
|
}, [defaultValue]);
|
|
2402
|
-
return /* @__PURE__ */
|
|
2403
|
+
return /* @__PURE__ */ React62.createElement(
|
|
2403
2404
|
TextField,
|
|
2404
2405
|
{
|
|
2405
2406
|
fullWidth: true,
|
|
@@ -2425,7 +2426,7 @@ var TILE_BUTTON = {
|
|
|
2425
2426
|
};
|
|
2426
2427
|
function Swatch({ paletteColors, value, onChange }) {
|
|
2427
2428
|
const renderButton2 = (colorValue) => {
|
|
2428
|
-
return /* @__PURE__ */
|
|
2429
|
+
return /* @__PURE__ */ React62.createElement(
|
|
2429
2430
|
Button$1,
|
|
2430
2431
|
{
|
|
2431
2432
|
key: colorValue,
|
|
@@ -2444,7 +2445,7 @@ function Swatch({ paletteColors, value, onChange }) {
|
|
|
2444
2445
|
}
|
|
2445
2446
|
);
|
|
2446
2447
|
};
|
|
2447
|
-
return /* @__PURE__ */
|
|
2448
|
+
return /* @__PURE__ */ React62.createElement(Box, { width: "100%", sx: { display: "grid", gap: 1, gridTemplateColumns: "1fr 1fr 1fr 1fr 1fr 1fr" } }, paletteColors.map((c) => renderButton2(c)));
|
|
2448
2449
|
}
|
|
2449
2450
|
|
|
2450
2451
|
// src/app/inspector-drawer/configuration-panel/input-panels/helpers/inputs/color-input/picker.tsx
|
|
@@ -2511,7 +2512,7 @@ var SX = {
|
|
|
2511
2512
|
}
|
|
2512
2513
|
};
|
|
2513
2514
|
function Picker({ value, onChange }) {
|
|
2514
|
-
return /* @__PURE__ */
|
|
2515
|
+
return /* @__PURE__ */ React62.createElement(Stack, { spacing: 1, sx: SX }, /* @__PURE__ */ React62.createElement(HexColorPicker, { color: value, onChange }), /* @__PURE__ */ React62.createElement(Swatch, { paletteColors: DEFAULT_PRESET_COLORS, value, onChange }), /* @__PURE__ */ React62.createElement(Box, { pt: 1 }, /* @__PURE__ */ React62.createElement(HexColorInput, { prefixed: true, color: value, onChange })));
|
|
2515
2516
|
}
|
|
2516
2517
|
|
|
2517
2518
|
// src/app/inspector-drawer/configuration-panel/input-panels/helpers/inputs/color-input/base-color-input.tsx
|
|
@@ -2536,7 +2537,7 @@ function ColorInput({ label, defaultValue, onChange, nullable }) {
|
|
|
2536
2537
|
if (typeof value !== "string" || value.trim().length === 0) {
|
|
2537
2538
|
return null;
|
|
2538
2539
|
}
|
|
2539
|
-
return /* @__PURE__ */
|
|
2540
|
+
return /* @__PURE__ */ React62.createElement(
|
|
2540
2541
|
ButtonBase,
|
|
2541
2542
|
{
|
|
2542
2543
|
onClick: () => {
|
|
@@ -2544,16 +2545,16 @@ function ColorInput({ label, defaultValue, onChange, nullable }) {
|
|
|
2544
2545
|
onChange(null);
|
|
2545
2546
|
}
|
|
2546
2547
|
},
|
|
2547
|
-
/* @__PURE__ */
|
|
2548
|
+
/* @__PURE__ */ React62.createElement(CloseOutlined, { fontSize: "small", sx: { color: "grey.600" } })
|
|
2548
2549
|
);
|
|
2549
2550
|
};
|
|
2550
2551
|
const renderOpenButton = () => {
|
|
2551
2552
|
if (value) {
|
|
2552
|
-
return /* @__PURE__ */
|
|
2553
|
+
return /* @__PURE__ */ React62.createElement(ButtonBase, { onClick: handleClickOpen, sx: __spreadProps(__spreadValues({}, BUTTON_SX), { bgcolor: value }) });
|
|
2553
2554
|
}
|
|
2554
|
-
return /* @__PURE__ */
|
|
2555
|
+
return /* @__PURE__ */ React62.createElement(ButtonBase, { onClick: handleClickOpen, sx: __spreadValues({}, BUTTON_SX) }, /* @__PURE__ */ React62.createElement(AddOutlined, { fontSize: "small" }));
|
|
2555
2556
|
};
|
|
2556
|
-
return /* @__PURE__ */
|
|
2557
|
+
return /* @__PURE__ */ React62.createElement(Stack, { alignItems: "flex-start" }, /* @__PURE__ */ React62.createElement(InputLabel, { sx: { mb: 0.5 } }, label), /* @__PURE__ */ React62.createElement(Stack, { direction: "row", spacing: 1 }, renderOpenButton(), renderResetButton()), /* @__PURE__ */ React62.createElement(
|
|
2557
2558
|
Menu,
|
|
2558
2559
|
{
|
|
2559
2560
|
anchorEl,
|
|
@@ -2563,7 +2564,7 @@ function ColorInput({ label, defaultValue, onChange, nullable }) {
|
|
|
2563
2564
|
sx: { height: "auto", padding: 0 }
|
|
2564
2565
|
}
|
|
2565
2566
|
},
|
|
2566
|
-
/* @__PURE__ */
|
|
2567
|
+
/* @__PURE__ */ React62.createElement(
|
|
2567
2568
|
Picker,
|
|
2568
2569
|
{
|
|
2569
2570
|
value: value || "",
|
|
@@ -2578,10 +2579,10 @@ function ColorInput({ label, defaultValue, onChange, nullable }) {
|
|
|
2578
2579
|
|
|
2579
2580
|
// src/app/inspector-drawer/configuration-panel/input-panels/helpers/inputs/color-input/index.tsx
|
|
2580
2581
|
function ColorInput2(props) {
|
|
2581
|
-
return /* @__PURE__ */
|
|
2582
|
+
return /* @__PURE__ */ React62.createElement(ColorInput, __spreadProps(__spreadValues({}, props), { nullable: false }));
|
|
2582
2583
|
}
|
|
2583
2584
|
function NullableColorInput(props) {
|
|
2584
|
-
return /* @__PURE__ */
|
|
2585
|
+
return /* @__PURE__ */ React62.createElement(ColorInput, __spreadProps(__spreadValues({}, props), { nullable: true }));
|
|
2585
2586
|
}
|
|
2586
2587
|
|
|
2587
2588
|
// src/editor/blocks/helpers/font-family.ts
|
|
@@ -2634,13 +2635,13 @@ var FONT_FAMILIES = [
|
|
|
2634
2635
|
];
|
|
2635
2636
|
|
|
2636
2637
|
// src/app/inspector-drawer/configuration-panel/input-panels/helpers/inputs/font-family.tsx
|
|
2637
|
-
var OPTIONS = FONT_FAMILIES.map((option) => /* @__PURE__ */
|
|
2638
|
+
var OPTIONS = FONT_FAMILIES.map((option) => /* @__PURE__ */ React62.createElement(MenuItem, { key: option.key, value: option.key, sx: { fontFamily: option.value } }, option.label));
|
|
2638
2639
|
function NullableFontFamily({ label, onChange, defaultValue }) {
|
|
2639
2640
|
const [value, setValue] = useState(defaultValue != null ? defaultValue : "inherit");
|
|
2640
2641
|
useEffect(() => {
|
|
2641
2642
|
setValue(defaultValue != null ? defaultValue : "inherit");
|
|
2642
2643
|
}, [defaultValue]);
|
|
2643
|
-
return /* @__PURE__ */
|
|
2644
|
+
return /* @__PURE__ */ React62.createElement(
|
|
2644
2645
|
TextField,
|
|
2645
2646
|
{
|
|
2646
2647
|
select: true,
|
|
@@ -2653,7 +2654,7 @@ function NullableFontFamily({ label, onChange, defaultValue }) {
|
|
|
2653
2654
|
onChange(v === null ? null : v);
|
|
2654
2655
|
}
|
|
2655
2656
|
},
|
|
2656
|
-
/* @__PURE__ */
|
|
2657
|
+
/* @__PURE__ */ React62.createElement(MenuItem, { value: "inherit" }, "Match email settings"),
|
|
2657
2658
|
OPTIONS
|
|
2658
2659
|
);
|
|
2659
2660
|
}
|
|
@@ -2666,10 +2667,10 @@ function FontSizeInput({ label, defaultValue, onChange }) {
|
|
|
2666
2667
|
setValue(value2);
|
|
2667
2668
|
onChange(value2);
|
|
2668
2669
|
};
|
|
2669
|
-
return /* @__PURE__ */
|
|
2670
|
+
return /* @__PURE__ */ React62.createElement(Stack, { spacing: 1, alignItems: "flex-start" }, /* @__PURE__ */ React62.createElement(InputLabel, { shrink: true }, label), /* @__PURE__ */ React62.createElement(
|
|
2670
2671
|
RawSliderInput,
|
|
2671
2672
|
{
|
|
2672
|
-
iconLabel: /* @__PURE__ */
|
|
2673
|
+
iconLabel: /* @__PURE__ */ React62.createElement(TextFieldsOutlined, { sx: { fontSize: 16 } }),
|
|
2673
2674
|
value,
|
|
2674
2675
|
setValue: handleChange,
|
|
2675
2676
|
units: "px",
|
|
@@ -2684,7 +2685,7 @@ function FontWeightInput({ label, defaultValue, onChange }) {
|
|
|
2684
2685
|
useEffect(() => {
|
|
2685
2686
|
setValue(defaultValue);
|
|
2686
2687
|
}, [defaultValue]);
|
|
2687
|
-
return /* @__PURE__ */
|
|
2688
|
+
return /* @__PURE__ */ React62.createElement(
|
|
2688
2689
|
RadioGroupInput,
|
|
2689
2690
|
{
|
|
2690
2691
|
label,
|
|
@@ -2694,8 +2695,8 @@ function FontWeightInput({ label, defaultValue, onChange }) {
|
|
|
2694
2695
|
onChange(fontWeight);
|
|
2695
2696
|
}
|
|
2696
2697
|
},
|
|
2697
|
-
/* @__PURE__ */
|
|
2698
|
-
/* @__PURE__ */
|
|
2698
|
+
/* @__PURE__ */ React62.createElement(ToggleButton, { value: "normal" }, "Regular"),
|
|
2699
|
+
/* @__PURE__ */ React62.createElement(ToggleButton, { value: "bold" }, "Bold")
|
|
2699
2700
|
);
|
|
2700
2701
|
}
|
|
2701
2702
|
function LetterSpacingInput({ label, defaultValue, onChange }) {
|
|
@@ -2707,10 +2708,10 @@ function LetterSpacingInput({ label, defaultValue, onChange }) {
|
|
|
2707
2708
|
setValue(v);
|
|
2708
2709
|
onChange(v === 0 ? null : v);
|
|
2709
2710
|
};
|
|
2710
|
-
return /* @__PURE__ */
|
|
2711
|
+
return /* @__PURE__ */ React62.createElement(Stack, { spacing: 1, alignItems: "flex-start" }, /* @__PURE__ */ React62.createElement(InputLabel, { shrink: true }, label), /* @__PURE__ */ React62.createElement(
|
|
2711
2712
|
RawSliderInput,
|
|
2712
2713
|
{
|
|
2713
|
-
iconLabel: /* @__PURE__ */
|
|
2714
|
+
iconLabel: /* @__PURE__ */ React62.createElement(SpaceBarOutlined, { sx: { fontSize: 16 } }),
|
|
2714
2715
|
value,
|
|
2715
2716
|
setValue: handleChange,
|
|
2716
2717
|
units: "px",
|
|
@@ -2729,10 +2730,10 @@ function LineHeightInput({ label, defaultValue, onChange }) {
|
|
|
2729
2730
|
setValue(v);
|
|
2730
2731
|
onChange(v === 0 ? null : v);
|
|
2731
2732
|
};
|
|
2732
|
-
return /* @__PURE__ */
|
|
2733
|
+
return /* @__PURE__ */ React62.createElement(Stack, { spacing: 1, alignItems: "flex-start" }, /* @__PURE__ */ React62.createElement(InputLabel, { shrink: true }, label), /* @__PURE__ */ React62.createElement(
|
|
2733
2734
|
RawSliderInput,
|
|
2734
2735
|
{
|
|
2735
|
-
iconLabel: /* @__PURE__ */
|
|
2736
|
+
iconLabel: /* @__PURE__ */ React62.createElement(FormatLineSpacingOutlined, { sx: { fontSize: 16 } }),
|
|
2736
2737
|
value,
|
|
2737
2738
|
setValue: handleChange,
|
|
2738
2739
|
units: "",
|
|
@@ -2761,10 +2762,10 @@ function PaddingInput({ label, defaultValue, onChange }) {
|
|
|
2761
2762
|
setValue(v);
|
|
2762
2763
|
onChange(v);
|
|
2763
2764
|
}
|
|
2764
|
-
return /* @__PURE__ */
|
|
2765
|
+
return /* @__PURE__ */ React62.createElement(Stack, { spacing: 2, alignItems: "flex-start", pb: 1 }, /* @__PURE__ */ React62.createElement(InputLabel, { shrink: true }, label), /* @__PURE__ */ React62.createElement(
|
|
2765
2766
|
RawSliderInput,
|
|
2766
2767
|
{
|
|
2767
|
-
iconLabel: /* @__PURE__ */
|
|
2768
|
+
iconLabel: /* @__PURE__ */ React62.createElement(AlignVerticalTopOutlined, { sx: { fontSize: 16 } }),
|
|
2768
2769
|
value: value.top,
|
|
2769
2770
|
setValue: (num) => handleChange("top", num),
|
|
2770
2771
|
units: "px",
|
|
@@ -2773,10 +2774,10 @@ function PaddingInput({ label, defaultValue, onChange }) {
|
|
|
2773
2774
|
max: 80,
|
|
2774
2775
|
marks: true
|
|
2775
2776
|
}
|
|
2776
|
-
), /* @__PURE__ */
|
|
2777
|
+
), /* @__PURE__ */ React62.createElement(
|
|
2777
2778
|
RawSliderInput,
|
|
2778
2779
|
{
|
|
2779
|
-
iconLabel: /* @__PURE__ */
|
|
2780
|
+
iconLabel: /* @__PURE__ */ React62.createElement(AlignVerticalBottomOutlined, { sx: { fontSize: 16 } }),
|
|
2780
2781
|
value: value.bottom,
|
|
2781
2782
|
setValue: (num) => handleChange("bottom", num),
|
|
2782
2783
|
units: "px",
|
|
@@ -2785,10 +2786,10 @@ function PaddingInput({ label, defaultValue, onChange }) {
|
|
|
2785
2786
|
max: 80,
|
|
2786
2787
|
marks: true
|
|
2787
2788
|
}
|
|
2788
|
-
), /* @__PURE__ */
|
|
2789
|
+
), /* @__PURE__ */ React62.createElement(
|
|
2789
2790
|
RawSliderInput,
|
|
2790
2791
|
{
|
|
2791
|
-
iconLabel: /* @__PURE__ */
|
|
2792
|
+
iconLabel: /* @__PURE__ */ React62.createElement(AlignHorizontalLeftOutlined, { sx: { fontSize: 16 } }),
|
|
2792
2793
|
value: value.left,
|
|
2793
2794
|
setValue: (num) => handleChange("left", num),
|
|
2794
2795
|
units: "px",
|
|
@@ -2797,10 +2798,10 @@ function PaddingInput({ label, defaultValue, onChange }) {
|
|
|
2797
2798
|
max: 80,
|
|
2798
2799
|
marks: true
|
|
2799
2800
|
}
|
|
2800
|
-
), /* @__PURE__ */
|
|
2801
|
+
), /* @__PURE__ */ React62.createElement(
|
|
2801
2802
|
RawSliderInput,
|
|
2802
2803
|
{
|
|
2803
|
-
iconLabel: /* @__PURE__ */
|
|
2804
|
+
iconLabel: /* @__PURE__ */ React62.createElement(AlignHorizontalRightOutlined, { sx: { fontSize: 16 } }),
|
|
2804
2805
|
value: value.right,
|
|
2805
2806
|
setValue: (num) => handleChange("right", num),
|
|
2806
2807
|
units: "px",
|
|
@@ -2816,7 +2817,7 @@ function TextAlignInput({ label, defaultValue, onChange }) {
|
|
|
2816
2817
|
useEffect(() => {
|
|
2817
2818
|
setValue(defaultValue != null ? defaultValue : "left");
|
|
2818
2819
|
}, [defaultValue]);
|
|
2819
|
-
return /* @__PURE__ */
|
|
2820
|
+
return /* @__PURE__ */ React62.createElement(
|
|
2820
2821
|
RadioGroupInput,
|
|
2821
2822
|
{
|
|
2822
2823
|
label,
|
|
@@ -2826,9 +2827,9 @@ function TextAlignInput({ label, defaultValue, onChange }) {
|
|
|
2826
2827
|
onChange(value2);
|
|
2827
2828
|
}
|
|
2828
2829
|
},
|
|
2829
|
-
/* @__PURE__ */
|
|
2830
|
-
/* @__PURE__ */
|
|
2831
|
-
/* @__PURE__ */
|
|
2830
|
+
/* @__PURE__ */ React62.createElement(ToggleButton, { value: "left" }, /* @__PURE__ */ React62.createElement(FormatAlignLeftOutlined, { fontSize: "small" })),
|
|
2831
|
+
/* @__PURE__ */ React62.createElement(ToggleButton, { value: "center" }, /* @__PURE__ */ React62.createElement(FormatAlignCenterOutlined, { fontSize: "small" })),
|
|
2832
|
+
/* @__PURE__ */ React62.createElement(ToggleButton, { value: "right" }, /* @__PURE__ */ React62.createElement(FormatAlignRightOutlined, { fontSize: "small" }))
|
|
2832
2833
|
);
|
|
2833
2834
|
}
|
|
2834
2835
|
|
|
@@ -2841,14 +2842,14 @@ function SingleStylePropertyPanel({ name, value, onChange }) {
|
|
|
2841
2842
|
};
|
|
2842
2843
|
switch (name) {
|
|
2843
2844
|
case "backgroundColor":
|
|
2844
|
-
return /* @__PURE__ */
|
|
2845
|
+
return /* @__PURE__ */ React62.createElement(NullableColorInput, { label: t("style.background-color", "Background color"), defaultValue, onChange: handleChange });
|
|
2845
2846
|
case "borderColor":
|
|
2846
|
-
return /* @__PURE__ */
|
|
2847
|
+
return /* @__PURE__ */ React62.createElement(NullableColorInput, { label: t("style.border-color", "Border color"), defaultValue, onChange: handleChange });
|
|
2847
2848
|
case "borderRadius":
|
|
2848
|
-
return /* @__PURE__ */
|
|
2849
|
+
return /* @__PURE__ */ React62.createElement(
|
|
2849
2850
|
SliderInput,
|
|
2850
2851
|
{
|
|
2851
|
-
iconLabel: /* @__PURE__ */
|
|
2852
|
+
iconLabel: /* @__PURE__ */ React62.createElement(RoundedCornerOutlined, null),
|
|
2852
2853
|
units: "px",
|
|
2853
2854
|
step: 4,
|
|
2854
2855
|
marks: true,
|
|
@@ -2860,27 +2861,27 @@ function SingleStylePropertyPanel({ name, value, onChange }) {
|
|
|
2860
2861
|
}
|
|
2861
2862
|
);
|
|
2862
2863
|
case "color":
|
|
2863
|
-
return /* @__PURE__ */
|
|
2864
|
+
return /* @__PURE__ */ React62.createElement(NullableColorInput, { label: t("style.text-color", "Text color"), defaultValue, onChange: handleChange });
|
|
2864
2865
|
case "fontFamily":
|
|
2865
|
-
return /* @__PURE__ */
|
|
2866
|
+
return /* @__PURE__ */ React62.createElement(NullableFontFamily, { label: t("style.font-family", "Font family"), defaultValue, onChange: handleChange });
|
|
2866
2867
|
case "fontSize":
|
|
2867
|
-
return /* @__PURE__ */
|
|
2868
|
+
return /* @__PURE__ */ React62.createElement(FontSizeInput, { label: t("style.font-size", "Font size"), defaultValue, onChange: handleChange });
|
|
2868
2869
|
case "fontWeight":
|
|
2869
|
-
return /* @__PURE__ */
|
|
2870
|
+
return /* @__PURE__ */ React62.createElement(FontWeightInput, { label: t("style.font-weight", "Font weight"), defaultValue, onChange: handleChange });
|
|
2870
2871
|
case "lineHeight":
|
|
2871
|
-
return /* @__PURE__ */
|
|
2872
|
+
return /* @__PURE__ */ React62.createElement(LineHeightInput, { label: t("style.line-height", "Line height"), defaultValue, onChange: handleChange });
|
|
2872
2873
|
case "letterSpacing":
|
|
2873
|
-
return /* @__PURE__ */
|
|
2874
|
+
return /* @__PURE__ */ React62.createElement(LetterSpacingInput, { label: t("style.letter-spacing", "Letter spacing"), defaultValue, onChange: handleChange });
|
|
2874
2875
|
case "textAlign":
|
|
2875
|
-
return /* @__PURE__ */
|
|
2876
|
+
return /* @__PURE__ */ React62.createElement(TextAlignInput, { label: t("style.alignment", "Alignment"), defaultValue, onChange: handleChange });
|
|
2876
2877
|
case "padding":
|
|
2877
|
-
return /* @__PURE__ */
|
|
2878
|
+
return /* @__PURE__ */ React62.createElement(PaddingInput, { label: t("style.padding", "Padding"), defaultValue, onChange: handleChange });
|
|
2878
2879
|
}
|
|
2879
2880
|
}
|
|
2880
2881
|
|
|
2881
2882
|
// src/app/inspector-drawer/configuration-panel/input-panels/helpers/style-inputs/multi-style-property-panel.tsx
|
|
2882
2883
|
function MultiStylePropertyPanel({ names, value, onChange }) {
|
|
2883
|
-
return /* @__PURE__ */
|
|
2884
|
+
return /* @__PURE__ */ React62.createElement(React62.Fragment, null, names.map((name) => /* @__PURE__ */ React62.createElement(SingleStylePropertyPanel, { key: name, name, value: value || {}, onChange })));
|
|
2884
2885
|
}
|
|
2885
2886
|
|
|
2886
2887
|
// src/app/inspector-drawer/configuration-panel/input-panels/avatar-sidebar-panel.tsx
|
|
@@ -2900,11 +2901,11 @@ function AvatarSidebarPanel({ data, setData }) {
|
|
|
2900
2901
|
const imageUrl = (_d = (_c = data.props) == null ? void 0 : _c.imageUrl) != null ? _d : AvatarPropsDefaults.imageUrl;
|
|
2901
2902
|
const alt = (_f = (_e = data.props) == null ? void 0 : _e.alt) != null ? _f : AvatarPropsDefaults.alt;
|
|
2902
2903
|
const shape = (_h = (_g = data.props) == null ? void 0 : _g.shape) != null ? _h : AvatarPropsDefaults.shape;
|
|
2903
|
-
return /* @__PURE__ */
|
|
2904
|
+
return /* @__PURE__ */ React62.createElement(BaseSidebarPanel, { title: "Avatar block" }, /* @__PURE__ */ React62.createElement(
|
|
2904
2905
|
SliderInput,
|
|
2905
2906
|
{
|
|
2906
|
-
label: "Size",
|
|
2907
|
-
iconLabel: /* @__PURE__ */
|
|
2907
|
+
label: t("field.size", "Size"),
|
|
2908
|
+
iconLabel: /* @__PURE__ */ React62.createElement(AspectRatioOutlined, { sx: { color: "text.secondary" } }),
|
|
2908
2909
|
units: "px",
|
|
2909
2910
|
step: 3,
|
|
2910
2911
|
min: 32,
|
|
@@ -2914,37 +2915,37 @@ function AvatarSidebarPanel({ data, setData }) {
|
|
|
2914
2915
|
updateData(__spreadProps(__spreadValues({}, data), { props: __spreadProps(__spreadValues({}, data.props), { size: size2 }) }));
|
|
2915
2916
|
}
|
|
2916
2917
|
}
|
|
2917
|
-
), /* @__PURE__ */
|
|
2918
|
+
), /* @__PURE__ */ React62.createElement(
|
|
2918
2919
|
RadioGroupInput,
|
|
2919
2920
|
{
|
|
2920
|
-
label: "Shape",
|
|
2921
|
+
label: t("avatar.shape", "Shape"),
|
|
2921
2922
|
defaultValue: shape,
|
|
2922
2923
|
onChange: (shape2) => {
|
|
2923
2924
|
updateData(__spreadProps(__spreadValues({}, data), { props: __spreadProps(__spreadValues({}, data.props), { shape: shape2 }) }));
|
|
2924
2925
|
}
|
|
2925
2926
|
},
|
|
2926
|
-
/* @__PURE__ */
|
|
2927
|
-
/* @__PURE__ */
|
|
2928
|
-
/* @__PURE__ */
|
|
2929
|
-
), /* @__PURE__ */
|
|
2927
|
+
/* @__PURE__ */ React62.createElement(ToggleButton, { value: "circle" }, t("signature.shape.circle", "Circle")),
|
|
2928
|
+
/* @__PURE__ */ React62.createElement(ToggleButton, { value: "square" }, t("signature.shape.square", "Square")),
|
|
2929
|
+
/* @__PURE__ */ React62.createElement(ToggleButton, { value: "rounded" }, t("signature.shape.rounded", "Rounded"))
|
|
2930
|
+
), /* @__PURE__ */ React62.createElement(
|
|
2930
2931
|
TextInput,
|
|
2931
2932
|
{
|
|
2932
|
-
label: "Image URL",
|
|
2933
|
+
label: t("signature.image-url", "Image URL"),
|
|
2933
2934
|
defaultValue: imageUrl,
|
|
2934
2935
|
onChange: (imageUrl2) => {
|
|
2935
2936
|
updateData(__spreadProps(__spreadValues({}, data), { props: __spreadProps(__spreadValues({}, data.props), { imageUrl: imageUrl2 }) }));
|
|
2936
2937
|
}
|
|
2937
2938
|
}
|
|
2938
|
-
), /* @__PURE__ */
|
|
2939
|
+
), /* @__PURE__ */ React62.createElement(
|
|
2939
2940
|
TextInput,
|
|
2940
2941
|
{
|
|
2941
|
-
label: "Alt text",
|
|
2942
|
+
label: t("image.alt-text", "Alt text"),
|
|
2942
2943
|
defaultValue: alt,
|
|
2943
2944
|
onChange: (alt2) => {
|
|
2944
2945
|
updateData(__spreadProps(__spreadValues({}, data), { props: __spreadProps(__spreadValues({}, data.props), { alt: alt2 }) }));
|
|
2945
2946
|
}
|
|
2946
2947
|
}
|
|
2947
|
-
), /* @__PURE__ */
|
|
2948
|
+
), /* @__PURE__ */ React62.createElement(
|
|
2948
2949
|
MultiStylePropertyPanel,
|
|
2949
2950
|
{
|
|
2950
2951
|
names: ["textAlign", "padding"],
|
|
@@ -2972,65 +2973,65 @@ function ButtonSidebarPanel({ data, setData }) {
|
|
|
2972
2973
|
const buttonStyle = (_j = (_i = data.props) == null ? void 0 : _i.buttonStyle) != null ? _j : ButtonPropsDefaults.buttonStyle;
|
|
2973
2974
|
const buttonTextColor = (_l = (_k = data.props) == null ? void 0 : _k.buttonTextColor) != null ? _l : ButtonPropsDefaults.buttonTextColor;
|
|
2974
2975
|
const buttonBackgroundColor = (_n = (_m = data.props) == null ? void 0 : _m.buttonBackgroundColor) != null ? _n : ButtonPropsDefaults.buttonBackgroundColor;
|
|
2975
|
-
return /* @__PURE__ */
|
|
2976
|
+
return /* @__PURE__ */ React62.createElement(BaseSidebarPanel, { title: "Button block" }, /* @__PURE__ */ React62.createElement(
|
|
2976
2977
|
TextInput,
|
|
2977
2978
|
{
|
|
2978
|
-
label: "Text",
|
|
2979
|
+
label: t("field.text", "Text"),
|
|
2979
2980
|
defaultValue: text,
|
|
2980
2981
|
onChange: (text2) => updateData(__spreadProps(__spreadValues({}, data), { props: __spreadProps(__spreadValues({}, data.props), { text: text2 }) }))
|
|
2981
2982
|
}
|
|
2982
|
-
), /* @__PURE__ */
|
|
2983
|
+
), /* @__PURE__ */ React62.createElement(
|
|
2983
2984
|
TextInput,
|
|
2984
2985
|
{
|
|
2985
|
-
label: "Url",
|
|
2986
|
+
label: t("field.url", "Url"),
|
|
2986
2987
|
defaultValue: url,
|
|
2987
2988
|
onChange: (url2) => updateData(__spreadProps(__spreadValues({}, data), { props: __spreadProps(__spreadValues({}, data.props), { url: url2 }) }))
|
|
2988
2989
|
}
|
|
2989
|
-
), /* @__PURE__ */
|
|
2990
|
+
), /* @__PURE__ */ React62.createElement(
|
|
2990
2991
|
RadioGroupInput,
|
|
2991
2992
|
{
|
|
2992
|
-
label: "Width",
|
|
2993
|
+
label: t("field.width", "Width"),
|
|
2993
2994
|
defaultValue: fullWidth ? "FULL_WIDTH" : "AUTO",
|
|
2994
2995
|
onChange: (v) => updateData(__spreadProps(__spreadValues({}, data), { props: __spreadProps(__spreadValues({}, data.props), { fullWidth: v === "FULL_WIDTH" }) }))
|
|
2995
2996
|
},
|
|
2996
|
-
/* @__PURE__ */
|
|
2997
|
-
/* @__PURE__ */
|
|
2998
|
-
), /* @__PURE__ */
|
|
2997
|
+
/* @__PURE__ */ React62.createElement(ToggleButton, { value: "FULL_WIDTH" }, t("button.width.full", "Full")),
|
|
2998
|
+
/* @__PURE__ */ React62.createElement(ToggleButton, { value: "AUTO" }, t("button.width.auto", "Auto"))
|
|
2999
|
+
), /* @__PURE__ */ React62.createElement(
|
|
2999
3000
|
RadioGroupInput,
|
|
3000
3001
|
{
|
|
3001
|
-
label: "Size",
|
|
3002
|
+
label: t("field.size", "Size"),
|
|
3002
3003
|
defaultValue: size,
|
|
3003
3004
|
onChange: (size2) => updateData(__spreadProps(__spreadValues({}, data), { props: __spreadProps(__spreadValues({}, data.props), { size: size2 }) }))
|
|
3004
3005
|
},
|
|
3005
|
-
/* @__PURE__ */
|
|
3006
|
-
/* @__PURE__ */
|
|
3007
|
-
/* @__PURE__ */
|
|
3008
|
-
/* @__PURE__ */
|
|
3009
|
-
), /* @__PURE__ */
|
|
3006
|
+
/* @__PURE__ */ React62.createElement(ToggleButton, { value: "x-small" }, t("size.xs", "Xs")),
|
|
3007
|
+
/* @__PURE__ */ React62.createElement(ToggleButton, { value: "small" }, t("size.sm", "Sm")),
|
|
3008
|
+
/* @__PURE__ */ React62.createElement(ToggleButton, { value: "medium" }, t("size.md", "Md")),
|
|
3009
|
+
/* @__PURE__ */ React62.createElement(ToggleButton, { value: "large" }, t("size.lg", "Lg"))
|
|
3010
|
+
), /* @__PURE__ */ React62.createElement(
|
|
3010
3011
|
RadioGroupInput,
|
|
3011
3012
|
{
|
|
3012
|
-
label: "Style",
|
|
3013
|
+
label: t("field.style", "Style"),
|
|
3013
3014
|
defaultValue: buttonStyle,
|
|
3014
3015
|
onChange: (buttonStyle2) => updateData(__spreadProps(__spreadValues({}, data), { props: __spreadProps(__spreadValues({}, data.props), { buttonStyle: buttonStyle2 }) }))
|
|
3015
3016
|
},
|
|
3016
|
-
/* @__PURE__ */
|
|
3017
|
-
/* @__PURE__ */
|
|
3018
|
-
/* @__PURE__ */
|
|
3019
|
-
), /* @__PURE__ */
|
|
3017
|
+
/* @__PURE__ */ React62.createElement(ToggleButton, { value: "rectangle" }, t("button.style.rectangle", "Rectangle")),
|
|
3018
|
+
/* @__PURE__ */ React62.createElement(ToggleButton, { value: "rounded" }, t("button.style.rounded", "Rounded")),
|
|
3019
|
+
/* @__PURE__ */ React62.createElement(ToggleButton, { value: "pill" }, t("button.style.pill", "Pill"))
|
|
3020
|
+
), /* @__PURE__ */ React62.createElement(
|
|
3020
3021
|
ColorInput2,
|
|
3021
3022
|
{
|
|
3022
|
-
label: "Text color",
|
|
3023
|
+
label: t("style.text-color", "Text color"),
|
|
3023
3024
|
defaultValue: buttonTextColor,
|
|
3024
3025
|
onChange: (buttonTextColor2) => updateData(__spreadProps(__spreadValues({}, data), { props: __spreadProps(__spreadValues({}, data.props), { buttonTextColor: buttonTextColor2 }) }))
|
|
3025
3026
|
}
|
|
3026
|
-
), /* @__PURE__ */
|
|
3027
|
+
), /* @__PURE__ */ React62.createElement(
|
|
3027
3028
|
ColorInput2,
|
|
3028
3029
|
{
|
|
3029
|
-
label: "Button color",
|
|
3030
|
+
label: t("button.color", "Button color"),
|
|
3030
3031
|
defaultValue: buttonBackgroundColor,
|
|
3031
3032
|
onChange: (buttonBackgroundColor2) => updateData(__spreadProps(__spreadValues({}, data), { props: __spreadProps(__spreadValues({}, data.props), { buttonBackgroundColor: buttonBackgroundColor2 }) }))
|
|
3032
3033
|
}
|
|
3033
|
-
), /* @__PURE__ */
|
|
3034
|
+
), /* @__PURE__ */ React62.createElement(
|
|
3034
3035
|
MultiStylePropertyPanel,
|
|
3035
3036
|
{
|
|
3036
3037
|
names: [
|
|
@@ -3065,7 +3066,7 @@ function TextDimensionInput({ label, defaultValue, onChange }) {
|
|
|
3065
3066
|
const value = parseInt(ev.target.value);
|
|
3066
3067
|
onChange(isNaN(value) ? null : value);
|
|
3067
3068
|
};
|
|
3068
|
-
return /* @__PURE__ */
|
|
3069
|
+
return /* @__PURE__ */ React62.createElement(
|
|
3069
3070
|
TextField,
|
|
3070
3071
|
{
|
|
3071
3072
|
fullWidth: true,
|
|
@@ -3076,7 +3077,7 @@ function TextDimensionInput({ label, defaultValue, onChange }) {
|
|
|
3076
3077
|
placeholder: "auto",
|
|
3077
3078
|
size: "small",
|
|
3078
3079
|
InputProps: {
|
|
3079
|
-
endAdornment: /* @__PURE__ */
|
|
3080
|
+
endAdornment: /* @__PURE__ */ React62.createElement(Typography, { variant: "body2", color: "text.secondary" }, "px")
|
|
3080
3081
|
}
|
|
3081
3082
|
}
|
|
3082
3083
|
);
|
|
@@ -3098,7 +3099,7 @@ function ColumnWidthsInput({ defaultValue, onChange }) {
|
|
|
3098
3099
|
};
|
|
3099
3100
|
let column3 = null;
|
|
3100
3101
|
{
|
|
3101
|
-
column3 = /* @__PURE__ */
|
|
3102
|
+
column3 = /* @__PURE__ */ React62.createElement(
|
|
3102
3103
|
TextDimensionInput,
|
|
3103
3104
|
{
|
|
3104
3105
|
label: "Column 3",
|
|
@@ -3109,7 +3110,7 @@ function ColumnWidthsInput({ defaultValue, onChange }) {
|
|
|
3109
3110
|
}
|
|
3110
3111
|
);
|
|
3111
3112
|
}
|
|
3112
|
-
return /* @__PURE__ */
|
|
3113
|
+
return /* @__PURE__ */ React62.createElement(Stack, { direction: "row", spacing: 1 }, /* @__PURE__ */ React62.createElement(
|
|
3113
3114
|
TextDimensionInput,
|
|
3114
3115
|
{
|
|
3115
3116
|
label: "Column 1",
|
|
@@ -3118,7 +3119,7 @@ function ColumnWidthsInput({ defaultValue, onChange }) {
|
|
|
3118
3119
|
setIndexValue(0, v);
|
|
3119
3120
|
}
|
|
3120
3121
|
}
|
|
3121
|
-
), /* @__PURE__ */
|
|
3122
|
+
), /* @__PURE__ */ React62.createElement(
|
|
3122
3123
|
TextDimensionInput,
|
|
3123
3124
|
{
|
|
3124
3125
|
label: "Column 2",
|
|
@@ -3143,18 +3144,18 @@ function ColumnsContainerPanel({ data, setData }) {
|
|
|
3143
3144
|
setErrors(res.error);
|
|
3144
3145
|
}
|
|
3145
3146
|
};
|
|
3146
|
-
return /* @__PURE__ */
|
|
3147
|
+
return /* @__PURE__ */ React62.createElement(BaseSidebarPanel, { title: "Columns block" }, /* @__PURE__ */ React62.createElement(
|
|
3147
3148
|
RadioGroupInput,
|
|
3148
3149
|
{
|
|
3149
|
-
label: "Number of columns",
|
|
3150
|
+
label: t("columns.count", "Number of columns"),
|
|
3150
3151
|
defaultValue: ((_a = data.props) == null ? void 0 : _a.columnsCount) === 2 ? "2" : "3",
|
|
3151
3152
|
onChange: (v) => {
|
|
3152
3153
|
updateData(__spreadProps(__spreadValues({}, data), { props: __spreadProps(__spreadValues({}, data.props), { columnsCount: v === "2" ? 2 : 3 }) }));
|
|
3153
3154
|
}
|
|
3154
3155
|
},
|
|
3155
|
-
/* @__PURE__ */
|
|
3156
|
-
/* @__PURE__ */
|
|
3157
|
-
), /* @__PURE__ */
|
|
3156
|
+
/* @__PURE__ */ React62.createElement(ToggleButton, { value: "2" }, "2"),
|
|
3157
|
+
/* @__PURE__ */ React62.createElement(ToggleButton, { value: "3" }, "3")
|
|
3158
|
+
), /* @__PURE__ */ React62.createElement(
|
|
3158
3159
|
ColumnWidthsInput,
|
|
3159
3160
|
{
|
|
3160
3161
|
defaultValue: (_b = data.props) == null ? void 0 : _b.fixedWidths,
|
|
@@ -3162,11 +3163,11 @@ function ColumnsContainerPanel({ data, setData }) {
|
|
|
3162
3163
|
updateData(__spreadProps(__spreadValues({}, data), { props: __spreadProps(__spreadValues({}, data.props), { fixedWidths }) }));
|
|
3163
3164
|
}
|
|
3164
3165
|
}
|
|
3165
|
-
), /* @__PURE__ */
|
|
3166
|
+
), /* @__PURE__ */ React62.createElement(
|
|
3166
3167
|
SliderInput,
|
|
3167
3168
|
{
|
|
3168
|
-
label: "Columns gap",
|
|
3169
|
-
iconLabel: /* @__PURE__ */
|
|
3169
|
+
label: t("columns.gap", "Columns gap"),
|
|
3170
|
+
iconLabel: /* @__PURE__ */ React62.createElement(SpaceBarOutlined, { sx: { color: "text.secondary" } }),
|
|
3170
3171
|
units: "px",
|
|
3171
3172
|
step: 4,
|
|
3172
3173
|
marks: true,
|
|
@@ -3175,19 +3176,19 @@ function ColumnsContainerPanel({ data, setData }) {
|
|
|
3175
3176
|
defaultValue: (_d = (_c = data.props) == null ? void 0 : _c.columnsGap) != null ? _d : 0,
|
|
3176
3177
|
onChange: (columnsGap) => updateData(__spreadProps(__spreadValues({}, data), { props: __spreadProps(__spreadValues({}, data.props), { columnsGap }) }))
|
|
3177
3178
|
}
|
|
3178
|
-
), /* @__PURE__ */
|
|
3179
|
+
), /* @__PURE__ */ React62.createElement(
|
|
3179
3180
|
RadioGroupInput,
|
|
3180
3181
|
{
|
|
3181
|
-
label: "Alignment",
|
|
3182
|
+
label: t("style.alignment", "Alignment"),
|
|
3182
3183
|
defaultValue: (_f = (_e = data.props) == null ? void 0 : _e.contentAlignment) != null ? _f : "middle",
|
|
3183
3184
|
onChange: (contentAlignment) => {
|
|
3184
3185
|
updateData(__spreadProps(__spreadValues({}, data), { props: __spreadProps(__spreadValues({}, data.props), { contentAlignment }) }));
|
|
3185
3186
|
}
|
|
3186
3187
|
},
|
|
3187
|
-
/* @__PURE__ */
|
|
3188
|
-
/* @__PURE__ */
|
|
3189
|
-
/* @__PURE__ */
|
|
3190
|
-
), /* @__PURE__ */
|
|
3188
|
+
/* @__PURE__ */ React62.createElement(ToggleButton, { value: "top" }, /* @__PURE__ */ React62.createElement(VerticalAlignTopOutlined, { fontSize: "small" })),
|
|
3189
|
+
/* @__PURE__ */ React62.createElement(ToggleButton, { value: "middle" }, /* @__PURE__ */ React62.createElement(VerticalAlignCenterOutlined, { fontSize: "small" })),
|
|
3190
|
+
/* @__PURE__ */ React62.createElement(ToggleButton, { value: "bottom" }, /* @__PURE__ */ React62.createElement(VerticalAlignBottomOutlined, { fontSize: "small" }))
|
|
3191
|
+
), /* @__PURE__ */ React62.createElement(
|
|
3191
3192
|
MultiStylePropertyPanel,
|
|
3192
3193
|
{
|
|
3193
3194
|
names: ["backgroundColor", "padding"],
|
|
@@ -3216,7 +3217,7 @@ function ContainerSidebarPanel({ data, setData }) {
|
|
|
3216
3217
|
setErrors(res.error);
|
|
3217
3218
|
}
|
|
3218
3219
|
};
|
|
3219
|
-
return /* @__PURE__ */
|
|
3220
|
+
return /* @__PURE__ */ React62.createElement(BaseSidebarPanel, { title: "Container block" }, /* @__PURE__ */ React62.createElement(
|
|
3220
3221
|
MultiStylePropertyPanel,
|
|
3221
3222
|
{
|
|
3222
3223
|
names: ["backgroundColor", "borderColor", "borderRadius", "padding"],
|
|
@@ -3239,18 +3240,18 @@ function DividerSidebarPanel({ data, setData }) {
|
|
|
3239
3240
|
};
|
|
3240
3241
|
const lineColor = (_b = (_a = data.props) == null ? void 0 : _a.lineColor) != null ? _b : DividerPropsDefaults.lineColor;
|
|
3241
3242
|
const lineHeight = (_d = (_c = data.props) == null ? void 0 : _c.lineHeight) != null ? _d : DividerPropsDefaults.lineHeight;
|
|
3242
|
-
return /* @__PURE__ */
|
|
3243
|
+
return /* @__PURE__ */ React62.createElement(BaseSidebarPanel, { title: "Divider block" }, /* @__PURE__ */ React62.createElement(
|
|
3243
3244
|
ColorInput2,
|
|
3244
3245
|
{
|
|
3245
|
-
label: "Color",
|
|
3246
|
+
label: t("divider.color", "Color"),
|
|
3246
3247
|
defaultValue: lineColor,
|
|
3247
3248
|
onChange: (lineColor2) => updateData(__spreadProps(__spreadValues({}, data), { props: __spreadProps(__spreadValues({}, data.props), { lineColor: lineColor2 }) }))
|
|
3248
3249
|
}
|
|
3249
|
-
), /* @__PURE__ */
|
|
3250
|
+
), /* @__PURE__ */ React62.createElement(
|
|
3250
3251
|
SliderInput,
|
|
3251
3252
|
{
|
|
3252
|
-
label: "Height",
|
|
3253
|
-
iconLabel: /* @__PURE__ */
|
|
3253
|
+
label: t("field.height", "Height"),
|
|
3254
|
+
iconLabel: /* @__PURE__ */ React62.createElement(HeightOutlined, { sx: { color: "text.secondary" } }),
|
|
3254
3255
|
units: "px",
|
|
3255
3256
|
step: 1,
|
|
3256
3257
|
min: 1,
|
|
@@ -3258,7 +3259,7 @@ function DividerSidebarPanel({ data, setData }) {
|
|
|
3258
3259
|
defaultValue: lineHeight,
|
|
3259
3260
|
onChange: (lineHeight2) => updateData(__spreadProps(__spreadValues({}, data), { props: __spreadProps(__spreadValues({}, data.props), { lineHeight: lineHeight2 }) }))
|
|
3260
3261
|
}
|
|
3261
|
-
), /* @__PURE__ */
|
|
3262
|
+
), /* @__PURE__ */ React62.createElement(
|
|
3262
3263
|
MultiStylePropertyPanel,
|
|
3263
3264
|
{
|
|
3264
3265
|
names: ["backgroundColor", "padding"],
|
|
@@ -3302,11 +3303,11 @@ function BooleanInput({ label, defaultValue, onChange }) {
|
|
|
3302
3303
|
useEffect(() => {
|
|
3303
3304
|
setValue(defaultValue);
|
|
3304
3305
|
}, [defaultValue]);
|
|
3305
|
-
return /* @__PURE__ */
|
|
3306
|
+
return /* @__PURE__ */ React62.createElement(
|
|
3306
3307
|
FormControlLabel,
|
|
3307
3308
|
{
|
|
3308
3309
|
label,
|
|
3309
|
-
control: /* @__PURE__ */
|
|
3310
|
+
control: /* @__PURE__ */ React62.createElement(
|
|
3310
3311
|
Switch,
|
|
3311
3312
|
{
|
|
3312
3313
|
checked: value,
|
|
@@ -3334,58 +3335,58 @@ function EmailLayoutSidebarFields({ data, setData }) {
|
|
|
3334
3335
|
}
|
|
3335
3336
|
};
|
|
3336
3337
|
const backdropDisabled = (_a = data.backdropDisabled) != null ? _a : false;
|
|
3337
|
-
return /* @__PURE__ */
|
|
3338
|
+
return /* @__PURE__ */ React62.createElement(BaseSidebarPanel, { title: "Global" }, /* @__PURE__ */ React62.createElement(
|
|
3338
3339
|
BooleanInput,
|
|
3339
3340
|
{
|
|
3340
|
-
label: "Disable backdrop",
|
|
3341
|
+
label: t("global.disable-backdrop", "Disable backdrop"),
|
|
3341
3342
|
defaultValue: backdropDisabled,
|
|
3342
3343
|
onChange: (backdropDisabled2) => updateData(__spreadProps(__spreadValues({}, data), { backdropDisabled: backdropDisabled2 }))
|
|
3343
3344
|
}
|
|
3344
|
-
), !backdropDisabled && /* @__PURE__ */
|
|
3345
|
+
), !backdropDisabled && /* @__PURE__ */ React62.createElement(React62.Fragment, null, /* @__PURE__ */ React62.createElement(
|
|
3345
3346
|
ColorInput2,
|
|
3346
3347
|
{
|
|
3347
|
-
label: "Backdrop color",
|
|
3348
|
+
label: t("global.backdrop-color", "Backdrop color"),
|
|
3348
3349
|
defaultValue: (_b = data.backdropColor) != null ? _b : "#F5F5F5",
|
|
3349
3350
|
onChange: (backdropColor) => updateData(__spreadProps(__spreadValues({}, data), { backdropColor }))
|
|
3350
3351
|
}
|
|
3351
|
-
), /* @__PURE__ */
|
|
3352
|
+
), /* @__PURE__ */ React62.createElement(
|
|
3352
3353
|
ColorInput2,
|
|
3353
3354
|
{
|
|
3354
|
-
label: "Canvas color",
|
|
3355
|
+
label: t("global.canvas-color", "Canvas color"),
|
|
3355
3356
|
defaultValue: (_c = data.canvasColor) != null ? _c : "#FFFFFF",
|
|
3356
3357
|
onChange: (canvasColor) => updateData(__spreadProps(__spreadValues({}, data), { canvasColor }))
|
|
3357
3358
|
}
|
|
3358
|
-
), /* @__PURE__ */
|
|
3359
|
+
), /* @__PURE__ */ React62.createElement(
|
|
3359
3360
|
NullableColorInput,
|
|
3360
3361
|
{
|
|
3361
|
-
label: "Canvas border color",
|
|
3362
|
+
label: t("global.canvas-border-color", "Canvas border color"),
|
|
3362
3363
|
defaultValue: (_d = data.borderColor) != null ? _d : null,
|
|
3363
3364
|
onChange: (borderColor) => updateData(__spreadProps(__spreadValues({}, data), { borderColor }))
|
|
3364
3365
|
}
|
|
3365
|
-
), /* @__PURE__ */
|
|
3366
|
+
), /* @__PURE__ */ React62.createElement(
|
|
3366
3367
|
SliderInput,
|
|
3367
3368
|
{
|
|
3368
|
-
iconLabel: /* @__PURE__ */
|
|
3369
|
+
iconLabel: /* @__PURE__ */ React62.createElement(RoundedCornerOutlined, null),
|
|
3369
3370
|
units: "px",
|
|
3370
3371
|
step: 4,
|
|
3371
3372
|
marks: true,
|
|
3372
3373
|
min: 0,
|
|
3373
3374
|
max: 48,
|
|
3374
|
-
label: "Canvas border radius",
|
|
3375
|
+
label: t("global.canvas-border-radius", "Canvas border radius"),
|
|
3375
3376
|
defaultValue: (_e = data.borderRadius) != null ? _e : 0,
|
|
3376
3377
|
onChange: (borderRadius) => updateData(__spreadProps(__spreadValues({}, data), { borderRadius }))
|
|
3377
3378
|
}
|
|
3378
|
-
)), /* @__PURE__ */
|
|
3379
|
+
)), /* @__PURE__ */ React62.createElement(
|
|
3379
3380
|
NullableFontFamily,
|
|
3380
3381
|
{
|
|
3381
|
-
label: "Font family",
|
|
3382
|
+
label: t("style.font-family", "Font family"),
|
|
3382
3383
|
defaultValue: "MODERN_SANS",
|
|
3383
3384
|
onChange: (fontFamily) => updateData(__spreadProps(__spreadValues({}, data), { fontFamily }))
|
|
3384
3385
|
}
|
|
3385
|
-
), /* @__PURE__ */
|
|
3386
|
+
), /* @__PURE__ */ React62.createElement(
|
|
3386
3387
|
ColorInput2,
|
|
3387
3388
|
{
|
|
3388
|
-
label: "Text color",
|
|
3389
|
+
label: t("style.text-color", "Text color"),
|
|
3389
3390
|
defaultValue: (_f = data.textColor) != null ? _f : "#262626",
|
|
3390
3391
|
onChange: (textColor) => updateData(__spreadProps(__spreadValues({}, data), { textColor }))
|
|
3391
3392
|
}
|
|
@@ -3403,29 +3404,29 @@ function HeadingSidebarPanel({ data, setData }) {
|
|
|
3403
3404
|
setErrors(res.error);
|
|
3404
3405
|
}
|
|
3405
3406
|
};
|
|
3406
|
-
return /* @__PURE__ */
|
|
3407
|
+
return /* @__PURE__ */ React62.createElement(BaseSidebarPanel, { title: "Heading block" }, /* @__PURE__ */ React62.createElement(
|
|
3407
3408
|
TextInput,
|
|
3408
3409
|
{
|
|
3409
|
-
label: "Content",
|
|
3410
|
+
label: t("field.content", "Content"),
|
|
3410
3411
|
rows: 3,
|
|
3411
3412
|
defaultValue: (_b = (_a = data.props) == null ? void 0 : _a.text) != null ? _b : HeadingPropsDefaults.text,
|
|
3412
3413
|
onChange: (text) => {
|
|
3413
3414
|
updateData(__spreadProps(__spreadValues({}, data), { props: __spreadProps(__spreadValues({}, data.props), { text }) }));
|
|
3414
3415
|
}
|
|
3415
3416
|
}
|
|
3416
|
-
), /* @__PURE__ */
|
|
3417
|
+
), /* @__PURE__ */ React62.createElement(
|
|
3417
3418
|
RadioGroupInput,
|
|
3418
3419
|
{
|
|
3419
|
-
label: "Level",
|
|
3420
|
+
label: t("field.level", "Level"),
|
|
3420
3421
|
defaultValue: (_d = (_c = data.props) == null ? void 0 : _c.level) != null ? _d : HeadingPropsDefaults.level,
|
|
3421
3422
|
onChange: (level) => {
|
|
3422
3423
|
updateData(__spreadProps(__spreadValues({}, data), { props: __spreadProps(__spreadValues({}, data.props), { level }) }));
|
|
3423
3424
|
}
|
|
3424
3425
|
},
|
|
3425
|
-
/* @__PURE__ */
|
|
3426
|
-
/* @__PURE__ */
|
|
3427
|
-
/* @__PURE__ */
|
|
3428
|
-
), /* @__PURE__ */
|
|
3426
|
+
/* @__PURE__ */ React62.createElement(ToggleButton, { value: "h1" }, "H1"),
|
|
3427
|
+
/* @__PURE__ */ React62.createElement(ToggleButton, { value: "h2" }, "H2"),
|
|
3428
|
+
/* @__PURE__ */ React62.createElement(ToggleButton, { value: "h3" }, "H3")
|
|
3429
|
+
), /* @__PURE__ */ React62.createElement(
|
|
3429
3430
|
MultiStylePropertyPanel,
|
|
3430
3431
|
{
|
|
3431
3432
|
names: [
|
|
@@ -3455,15 +3456,15 @@ function HtmlSidebarPanel({ data, setData }) {
|
|
|
3455
3456
|
setErrors(res.error);
|
|
3456
3457
|
}
|
|
3457
3458
|
};
|
|
3458
|
-
return /* @__PURE__ */
|
|
3459
|
+
return /* @__PURE__ */ React62.createElement(BaseSidebarPanel, { title: "Html block" }, /* @__PURE__ */ React62.createElement(
|
|
3459
3460
|
TextInput,
|
|
3460
3461
|
{
|
|
3461
|
-
label: "Content",
|
|
3462
|
+
label: t("field.content", "Content"),
|
|
3462
3463
|
rows: 5,
|
|
3463
3464
|
defaultValue: (_b = (_a = data.props) == null ? void 0 : _a.contents) != null ? _b : "",
|
|
3464
3465
|
onChange: (contents) => updateData(__spreadProps(__spreadValues({}, data), { props: __spreadProps(__spreadValues({}, data.props), { contents }) }))
|
|
3465
3466
|
}
|
|
3466
|
-
), /* @__PURE__ */
|
|
3467
|
+
), /* @__PURE__ */ React62.createElement(
|
|
3467
3468
|
MultiStylePropertyPanel,
|
|
3468
3469
|
{
|
|
3469
3470
|
names: ["color", "backgroundColor", "fontFamily", "fontSize", "textAlign", "padding"],
|
|
@@ -3520,7 +3521,7 @@ function ImageLibraryDialog({ open, onClose, onPick }) {
|
|
|
3520
3521
|
setBusy(false);
|
|
3521
3522
|
}
|
|
3522
3523
|
});
|
|
3523
|
-
return /* @__PURE__ */
|
|
3524
|
+
return /* @__PURE__ */ React62.createElement(Dialog, { open, onClose, maxWidth: "md", fullWidth: true }, /* @__PURE__ */ React62.createElement(DialogTitle, null, "Image library"), /* @__PURE__ */ React62.createElement(DialogContent, { dividers: true }, /* @__PURE__ */ React62.createElement(
|
|
3524
3525
|
TextField,
|
|
3525
3526
|
{
|
|
3526
3527
|
fullWidth: true,
|
|
@@ -3530,11 +3531,11 @@ function ImageLibraryDialog({ open, onClose, onPick }) {
|
|
|
3530
3531
|
onChange: (e) => setQuery(e.target.value),
|
|
3531
3532
|
autoFocus: true,
|
|
3532
3533
|
InputProps: {
|
|
3533
|
-
startAdornment: /* @__PURE__ */
|
|
3534
|
+
startAdornment: /* @__PURE__ */ React62.createElement(InputAdornment, { position: "start" }, /* @__PURE__ */ React62.createElement(SearchOutlined, { fontSize: "small" }))
|
|
3534
3535
|
},
|
|
3535
3536
|
sx: { mb: 2 }
|
|
3536
3537
|
}
|
|
3537
|
-
), error && /* @__PURE__ */
|
|
3538
|
+
), error && /* @__PURE__ */ React62.createElement(Alert, { severity: "error", sx: { mb: 2 } }, error), busy && !images && /* @__PURE__ */ React62.createElement(Stack, { alignItems: "center", sx: { py: 4 } }, /* @__PURE__ */ React62.createElement(CircularProgress, { size: 28 })), filtered && filtered.length === 0 && /* @__PURE__ */ React62.createElement(Typography, { variant: "body2", sx: { color: "text.secondary", textAlign: "center", py: 4 } }, query ? "No images match your search." : "No images in the library yet."), filtered && filtered.length > 0 && /* @__PURE__ */ React62.createElement(
|
|
3538
3539
|
Box,
|
|
3539
3540
|
{
|
|
3540
3541
|
sx: {
|
|
@@ -3543,7 +3544,7 @@ function ImageLibraryDialog({ open, onClose, onPick }) {
|
|
|
3543
3544
|
gap: 1.5
|
|
3544
3545
|
}
|
|
3545
3546
|
},
|
|
3546
|
-
filtered.map((img) => /* @__PURE__ */
|
|
3547
|
+
filtered.map((img) => /* @__PURE__ */ React62.createElement(
|
|
3547
3548
|
ImageTile,
|
|
3548
3549
|
{
|
|
3549
3550
|
key: img.url,
|
|
@@ -3552,7 +3553,7 @@ function ImageLibraryDialog({ open, onClose, onPick }) {
|
|
|
3552
3553
|
onDelete: deleteImage ? () => handleDelete(img.url) : void 0
|
|
3553
3554
|
}
|
|
3554
3555
|
))
|
|
3555
|
-
)), /* @__PURE__ */
|
|
3556
|
+
)), /* @__PURE__ */ React62.createElement(DialogActions, null, /* @__PURE__ */ React62.createElement(Button$1, { onClick: onClose }, "Close")));
|
|
3556
3557
|
}
|
|
3557
3558
|
function ImageTile({
|
|
3558
3559
|
image,
|
|
@@ -3562,7 +3563,7 @@ function ImageTile({
|
|
|
3562
3563
|
var _a, _b;
|
|
3563
3564
|
const src = (_a = image.thumbnailUrl) != null ? _a : image.url;
|
|
3564
3565
|
const label = image.alt || image.url.split("/").pop() || "image";
|
|
3565
|
-
return /* @__PURE__ */
|
|
3566
|
+
return /* @__PURE__ */ React62.createElement(
|
|
3566
3567
|
Box,
|
|
3567
3568
|
{
|
|
3568
3569
|
sx: {
|
|
@@ -3578,7 +3579,7 @@ function ImageTile({
|
|
|
3578
3579
|
},
|
|
3579
3580
|
onClick: onPick
|
|
3580
3581
|
},
|
|
3581
|
-
/* @__PURE__ */
|
|
3582
|
+
/* @__PURE__ */ React62.createElement(
|
|
3582
3583
|
Box,
|
|
3583
3584
|
{
|
|
3584
3585
|
component: "img",
|
|
@@ -3587,8 +3588,8 @@ function ImageTile({
|
|
|
3587
3588
|
sx: { display: "block", width: "100%", aspectRatio: "1 / 1", objectFit: "cover", backgroundColor: "#f5f5f5" }
|
|
3588
3589
|
}
|
|
3589
3590
|
),
|
|
3590
|
-
/* @__PURE__ */
|
|
3591
|
-
onDelete && /* @__PURE__ */
|
|
3591
|
+
/* @__PURE__ */ React62.createElement(Box, { sx: { p: 0.75, fontSize: 11, color: "text.secondary", overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" } }, label),
|
|
3592
|
+
onDelete && /* @__PURE__ */ React62.createElement(Tooltip, { title: "Delete from library" }, /* @__PURE__ */ React62.createElement(
|
|
3592
3593
|
IconButton,
|
|
3593
3594
|
{
|
|
3594
3595
|
size: "small",
|
|
@@ -3608,7 +3609,7 @@ function ImageTile({
|
|
|
3608
3609
|
},
|
|
3609
3610
|
"aria-label": "Delete image"
|
|
3610
3611
|
},
|
|
3611
|
-
/* @__PURE__ */
|
|
3612
|
+
/* @__PURE__ */ React62.createElement(DeleteOutline, { fontSize: "small" })
|
|
3612
3613
|
))
|
|
3613
3614
|
);
|
|
3614
3615
|
}
|
|
@@ -3661,21 +3662,21 @@ function ImageSidebarPanel({ data, setData }) {
|
|
|
3661
3662
|
});
|
|
3662
3663
|
const url = (_b = (_a = data.props) == null ? void 0 : _a.url) != null ? _b : "";
|
|
3663
3664
|
const showHttpWarning = isHttpUrl(url);
|
|
3664
|
-
return /* @__PURE__ */
|
|
3665
|
+
return /* @__PURE__ */ React62.createElement(BaseSidebarPanel, { title: "Image block" }, (uploadImage || loadImages) && /* @__PURE__ */ React62.createElement(Stack, { direction: "row", spacing: 1 }, uploadImage && /* @__PURE__ */ React62.createElement(React62.Fragment, null, /* @__PURE__ */ React62.createElement(
|
|
3665
3666
|
Button$1,
|
|
3666
3667
|
{
|
|
3667
3668
|
fullWidth: true,
|
|
3668
3669
|
variant: "outlined",
|
|
3669
3670
|
size: "small",
|
|
3670
|
-
startIcon: uploading ? /* @__PURE__ */
|
|
3671
|
+
startIcon: uploading ? /* @__PURE__ */ React62.createElement(CircularProgress, { size: 14 }) : /* @__PURE__ */ React62.createElement(CloudUploadOutlined, { fontSize: "small" }),
|
|
3671
3672
|
disabled: uploading,
|
|
3672
3673
|
onClick: () => {
|
|
3673
3674
|
var _a2;
|
|
3674
3675
|
return (_a2 = fileInputRef.current) == null ? void 0 : _a2.click();
|
|
3675
3676
|
}
|
|
3676
3677
|
},
|
|
3677
|
-
uploading ? "Uploading\u2026" : "Upload"
|
|
3678
|
-
), /* @__PURE__ */
|
|
3678
|
+
uploading ? t("image.uploading", "Uploading\u2026") : t("image.upload", "Upload")
|
|
3679
|
+
), /* @__PURE__ */ React62.createElement(
|
|
3679
3680
|
"input",
|
|
3680
3681
|
{
|
|
3681
3682
|
ref: fileInputRef,
|
|
@@ -3689,75 +3690,75 @@ function ImageSidebarPanel({ data, setData }) {
|
|
|
3689
3690
|
if (file) yield handleFile(file);
|
|
3690
3691
|
})
|
|
3691
3692
|
}
|
|
3692
|
-
)), loadImages && /* @__PURE__ */
|
|
3693
|
+
)), loadImages && /* @__PURE__ */ React62.createElement(
|
|
3693
3694
|
Button$1,
|
|
3694
3695
|
{
|
|
3695
3696
|
fullWidth: true,
|
|
3696
3697
|
variant: "outlined",
|
|
3697
3698
|
size: "small",
|
|
3698
|
-
startIcon: /* @__PURE__ */
|
|
3699
|
+
startIcon: /* @__PURE__ */ React62.createElement(CollectionsOutlined, { fontSize: "small" }),
|
|
3699
3700
|
onClick: () => setLibraryOpen(true)
|
|
3700
3701
|
},
|
|
3701
|
-
"Library"
|
|
3702
|
-
)), uploadError && /* @__PURE__ */
|
|
3702
|
+
t("image.library", "Library")
|
|
3703
|
+
)), uploadError && /* @__PURE__ */ React62.createElement(Alert, { severity: "error", onClose: () => setUploadError(null), sx: { mt: 1 } }, uploadError), /* @__PURE__ */ React62.createElement(
|
|
3703
3704
|
TextInput,
|
|
3704
3705
|
{
|
|
3705
|
-
label: "Source URL",
|
|
3706
|
+
label: t("image.source-url", "Source URL"),
|
|
3706
3707
|
defaultValue: url,
|
|
3707
3708
|
onChange: (v) => {
|
|
3708
3709
|
const next = v.trim().length === 0 ? null : v.trim();
|
|
3709
3710
|
updateData(__spreadProps(__spreadValues({}, data), { props: __spreadProps(__spreadValues({}, data.props), { url: next }) }));
|
|
3710
3711
|
}
|
|
3711
3712
|
}
|
|
3712
|
-
), showHttpWarning && /* @__PURE__ */
|
|
3713
|
+
), showHttpWarning && /* @__PURE__ */ React62.createElement(Box, { sx: { mt: -1, mb: 1, display: "flex", alignItems: "flex-start", gap: 0.75 } }, /* @__PURE__ */ React62.createElement(ErrorOutlineOutlined, { fontSize: "small", sx: { color: "warning.main", mt: "2px" } }), /* @__PURE__ */ React62.createElement(Box, { sx: { fontSize: 12, color: "warning.dark" } }, t("image.http-warning", "Non-HTTPS URL: Gmail and other clients strip mixed content. Use https:// for reliable delivery."))), /* @__PURE__ */ React62.createElement(
|
|
3713
3714
|
TextInput,
|
|
3714
3715
|
{
|
|
3715
|
-
label: "Alt text",
|
|
3716
|
+
label: t("image.alt-text", "Alt text"),
|
|
3716
3717
|
defaultValue: (_d = (_c = data.props) == null ? void 0 : _c.alt) != null ? _d : "",
|
|
3717
3718
|
onChange: (alt) => updateData(__spreadProps(__spreadValues({}, data), { props: __spreadProps(__spreadValues({}, data.props), { alt }) }))
|
|
3718
3719
|
}
|
|
3719
|
-
), /* @__PURE__ */
|
|
3720
|
+
), /* @__PURE__ */ React62.createElement(
|
|
3720
3721
|
TextInput,
|
|
3721
3722
|
{
|
|
3722
|
-
label: "Click through URL",
|
|
3723
|
+
label: t("image.link-href", "Click through URL"),
|
|
3723
3724
|
defaultValue: (_f = (_e = data.props) == null ? void 0 : _e.linkHref) != null ? _f : "",
|
|
3724
3725
|
onChange: (v) => {
|
|
3725
3726
|
const linkHref = v.trim().length === 0 ? null : v.trim();
|
|
3726
3727
|
updateData(__spreadProps(__spreadValues({}, data), { props: __spreadProps(__spreadValues({}, data.props), { linkHref }) }));
|
|
3727
3728
|
}
|
|
3728
3729
|
}
|
|
3729
|
-
), /* @__PURE__ */
|
|
3730
|
+
), /* @__PURE__ */ React62.createElement(Stack, { direction: "row", spacing: 2 }, /* @__PURE__ */ React62.createElement(
|
|
3730
3731
|
TextDimensionInput,
|
|
3731
3732
|
{
|
|
3732
|
-
label: "Width",
|
|
3733
|
+
label: t("field.width", "Width"),
|
|
3733
3734
|
defaultValue: (_g = data.props) == null ? void 0 : _g.width,
|
|
3734
3735
|
onChange: (width) => updateData(__spreadProps(__spreadValues({}, data), { props: __spreadProps(__spreadValues({}, data.props), { width }) }))
|
|
3735
3736
|
}
|
|
3736
|
-
), /* @__PURE__ */
|
|
3737
|
+
), /* @__PURE__ */ React62.createElement(
|
|
3737
3738
|
TextDimensionInput,
|
|
3738
3739
|
{
|
|
3739
|
-
label: "Height",
|
|
3740
|
+
label: t("field.height", "Height"),
|
|
3740
3741
|
defaultValue: (_h = data.props) == null ? void 0 : _h.height,
|
|
3741
3742
|
onChange: (height) => updateData(__spreadProps(__spreadValues({}, data), { props: __spreadProps(__spreadValues({}, data.props), { height }) }))
|
|
3742
3743
|
}
|
|
3743
|
-
)), /* @__PURE__ */
|
|
3744
|
+
)), /* @__PURE__ */ React62.createElement(
|
|
3744
3745
|
RadioGroupInput,
|
|
3745
3746
|
{
|
|
3746
|
-
label: "Alignment",
|
|
3747
|
+
label: t("style.alignment", "Alignment"),
|
|
3747
3748
|
defaultValue: (_j = (_i = data.props) == null ? void 0 : _i.contentAlignment) != null ? _j : "middle",
|
|
3748
3749
|
onChange: (contentAlignment) => updateData(__spreadProps(__spreadValues({}, data), { props: __spreadProps(__spreadValues({}, data.props), { contentAlignment }) }))
|
|
3749
3750
|
},
|
|
3750
|
-
/* @__PURE__ */
|
|
3751
|
-
/* @__PURE__ */
|
|
3752
|
-
/* @__PURE__ */
|
|
3753
|
-
), /* @__PURE__ */
|
|
3751
|
+
/* @__PURE__ */ React62.createElement(ToggleButton, { value: "top" }, /* @__PURE__ */ React62.createElement(VerticalAlignTopOutlined, { fontSize: "small" })),
|
|
3752
|
+
/* @__PURE__ */ React62.createElement(ToggleButton, { value: "middle" }, /* @__PURE__ */ React62.createElement(VerticalAlignCenterOutlined, { fontSize: "small" })),
|
|
3753
|
+
/* @__PURE__ */ React62.createElement(ToggleButton, { value: "bottom" }, /* @__PURE__ */ React62.createElement(VerticalAlignBottomOutlined, { fontSize: "small" }))
|
|
3754
|
+
), /* @__PURE__ */ React62.createElement(
|
|
3754
3755
|
MultiStylePropertyPanel,
|
|
3755
3756
|
{
|
|
3756
3757
|
names: ["backgroundColor", "textAlign", "padding"],
|
|
3757
3758
|
value: data.style,
|
|
3758
3759
|
onChange: (style) => updateData(__spreadProps(__spreadValues({}, data), { style }))
|
|
3759
3760
|
}
|
|
3760
|
-
), loadImages && /* @__PURE__ */
|
|
3761
|
+
), loadImages && /* @__PURE__ */ React62.createElement(
|
|
3761
3762
|
ImageLibraryDialog,
|
|
3762
3763
|
{
|
|
3763
3764
|
open: libraryOpen,
|
|
@@ -3796,74 +3797,74 @@ function SignatureSidebarPanel({ data, setData }) {
|
|
|
3796
3797
|
const nameColor = (_z = (_y = data.props) == null ? void 0 : _y.nameColor) != null ? _z : SignaturePropsDefaults.nameColor;
|
|
3797
3798
|
const textColor = (_B = (_A = data.props) == null ? void 0 : _A.textColor) != null ? _B : SignaturePropsDefaults.textColor;
|
|
3798
3799
|
const linkColor = (_D = (_C = data.props) == null ? void 0 : _C.linkColor) != null ? _D : SignaturePropsDefaults.linkColor;
|
|
3799
|
-
return /* @__PURE__ */
|
|
3800
|
+
return /* @__PURE__ */ React62.createElement(BaseSidebarPanel, { title: "Signature block" }, /* @__PURE__ */ React62.createElement(
|
|
3800
3801
|
TextInput,
|
|
3801
3802
|
{
|
|
3802
|
-
label: "Greeting",
|
|
3803
|
+
label: t("signature.greeting", "Greeting"),
|
|
3803
3804
|
defaultValue: greeting,
|
|
3804
3805
|
onChange: (greeting2) => updateData(__spreadProps(__spreadValues({}, data), { props: __spreadProps(__spreadValues({}, data.props), { greeting: greeting2 }) }))
|
|
3805
3806
|
}
|
|
3806
|
-
), /* @__PURE__ */
|
|
3807
|
+
), /* @__PURE__ */ React62.createElement(
|
|
3807
3808
|
TextInput,
|
|
3808
3809
|
{
|
|
3809
|
-
label: "Name",
|
|
3810
|
+
label: t("signature.name", "Name"),
|
|
3810
3811
|
defaultValue: name,
|
|
3811
3812
|
onChange: (name2) => updateData(__spreadProps(__spreadValues({}, data), { props: __spreadProps(__spreadValues({}, data.props), { name: name2 }) }))
|
|
3812
3813
|
}
|
|
3813
|
-
), /* @__PURE__ */
|
|
3814
|
+
), /* @__PURE__ */ React62.createElement(
|
|
3814
3815
|
TextInput,
|
|
3815
3816
|
{
|
|
3816
|
-
label: "Title",
|
|
3817
|
+
label: t("signature.title", "Title"),
|
|
3817
3818
|
defaultValue: title,
|
|
3818
3819
|
onChange: (title2) => updateData(__spreadProps(__spreadValues({}, data), { props: __spreadProps(__spreadValues({}, data.props), { title: title2 }) }))
|
|
3819
3820
|
}
|
|
3820
|
-
), /* @__PURE__ */
|
|
3821
|
+
), /* @__PURE__ */ React62.createElement(
|
|
3821
3822
|
TextInput,
|
|
3822
3823
|
{
|
|
3823
|
-
label: "Company",
|
|
3824
|
+
label: t("signature.company", "Company"),
|
|
3824
3825
|
defaultValue: company,
|
|
3825
3826
|
onChange: (company2) => updateData(__spreadProps(__spreadValues({}, data), { props: __spreadProps(__spreadValues({}, data.props), { company: company2 }) }))
|
|
3826
3827
|
}
|
|
3827
|
-
), /* @__PURE__ */
|
|
3828
|
+
), /* @__PURE__ */ React62.createElement(
|
|
3828
3829
|
TextInput,
|
|
3829
3830
|
{
|
|
3830
|
-
label: "Address",
|
|
3831
|
+
label: t("signature.address", "Address"),
|
|
3831
3832
|
defaultValue: address,
|
|
3832
3833
|
onChange: (address2) => updateData(__spreadProps(__spreadValues({}, data), { props: __spreadProps(__spreadValues({}, data.props), { address: address2 }) }))
|
|
3833
3834
|
}
|
|
3834
|
-
), /* @__PURE__ */
|
|
3835
|
+
), /* @__PURE__ */ React62.createElement(
|
|
3835
3836
|
TextInput,
|
|
3836
3837
|
{
|
|
3837
|
-
label: "Email",
|
|
3838
|
+
label: t("signature.email", "Email"),
|
|
3838
3839
|
defaultValue: email,
|
|
3839
3840
|
onChange: (email2) => updateData(__spreadProps(__spreadValues({}, data), { props: __spreadProps(__spreadValues({}, data.props), { email: email2 }) }))
|
|
3840
3841
|
}
|
|
3841
|
-
), /* @__PURE__ */
|
|
3842
|
+
), /* @__PURE__ */ React62.createElement(
|
|
3842
3843
|
TextInput,
|
|
3843
3844
|
{
|
|
3844
|
-
label: "Phone",
|
|
3845
|
+
label: t("signature.phone", "Phone"),
|
|
3845
3846
|
defaultValue: phone,
|
|
3846
3847
|
onChange: (phone2) => updateData(__spreadProps(__spreadValues({}, data), { props: __spreadProps(__spreadValues({}, data.props), { phone: phone2 }) }))
|
|
3847
3848
|
}
|
|
3848
|
-
), /* @__PURE__ */
|
|
3849
|
+
), /* @__PURE__ */ React62.createElement(
|
|
3849
3850
|
TextInput,
|
|
3850
3851
|
{
|
|
3851
|
-
label: "Website",
|
|
3852
|
+
label: t("signature.website", "Website"),
|
|
3852
3853
|
defaultValue: website,
|
|
3853
3854
|
onChange: (website2) => updateData(__spreadProps(__spreadValues({}, data), { props: __spreadProps(__spreadValues({}, data.props), { website: website2 }) }))
|
|
3854
3855
|
}
|
|
3855
|
-
), /* @__PURE__ */
|
|
3856
|
+
), /* @__PURE__ */ React62.createElement(
|
|
3856
3857
|
TextInput,
|
|
3857
3858
|
{
|
|
3858
|
-
label: "Image URL",
|
|
3859
|
+
label: t("signature.image-url", "Image URL"),
|
|
3859
3860
|
defaultValue: imageUrl,
|
|
3860
3861
|
onChange: (imageUrl2) => updateData(__spreadProps(__spreadValues({}, data), { props: __spreadProps(__spreadValues({}, data.props), { imageUrl: imageUrl2 }) }))
|
|
3861
3862
|
}
|
|
3862
|
-
), /* @__PURE__ */
|
|
3863
|
+
), /* @__PURE__ */ React62.createElement(
|
|
3863
3864
|
SliderInput,
|
|
3864
3865
|
{
|
|
3865
|
-
label: "Image size",
|
|
3866
|
-
iconLabel: /* @__PURE__ */
|
|
3866
|
+
label: t("signature.image-size", "Image size"),
|
|
3867
|
+
iconLabel: /* @__PURE__ */ React62.createElement(AspectRatioOutlined, { sx: { color: "text.secondary" } }),
|
|
3867
3868
|
units: "px",
|
|
3868
3869
|
step: 4,
|
|
3869
3870
|
min: 32,
|
|
@@ -3871,47 +3872,47 @@ function SignatureSidebarPanel({ data, setData }) {
|
|
|
3871
3872
|
defaultValue: imageSize,
|
|
3872
3873
|
onChange: (imageSize2) => updateData(__spreadProps(__spreadValues({}, data), { props: __spreadProps(__spreadValues({}, data.props), { imageSize: imageSize2 }) }))
|
|
3873
3874
|
}
|
|
3874
|
-
), /* @__PURE__ */
|
|
3875
|
+
), /* @__PURE__ */ React62.createElement(
|
|
3875
3876
|
RadioGroupInput,
|
|
3876
3877
|
{
|
|
3877
|
-
label: "Image shape",
|
|
3878
|
+
label: t("signature.image-shape", "Image shape"),
|
|
3878
3879
|
defaultValue: imageShape,
|
|
3879
3880
|
onChange: (imageShape2) => updateData(__spreadProps(__spreadValues({}, data), { props: __spreadProps(__spreadValues({}, data.props), { imageShape: imageShape2 }) }))
|
|
3880
3881
|
},
|
|
3881
|
-
/* @__PURE__ */
|
|
3882
|
-
/* @__PURE__ */
|
|
3883
|
-
/* @__PURE__ */
|
|
3884
|
-
), /* @__PURE__ */
|
|
3882
|
+
/* @__PURE__ */ React62.createElement(ToggleButton, { value: "circle" }, t("signature.shape.circle", "Circle")),
|
|
3883
|
+
/* @__PURE__ */ React62.createElement(ToggleButton, { value: "square" }, t("signature.shape.square", "Square")),
|
|
3884
|
+
/* @__PURE__ */ React62.createElement(ToggleButton, { value: "rounded" }, t("signature.shape.rounded", "Rounded"))
|
|
3885
|
+
), /* @__PURE__ */ React62.createElement(
|
|
3885
3886
|
RadioGroupInput,
|
|
3886
3887
|
{
|
|
3887
|
-
label: "Layout",
|
|
3888
|
+
label: t("signature.layout", "Layout"),
|
|
3888
3889
|
defaultValue: layout,
|
|
3889
3890
|
onChange: (layout2) => updateData(__spreadProps(__spreadValues({}, data), { props: __spreadProps(__spreadValues({}, data.props), { layout: layout2 }) }))
|
|
3890
3891
|
},
|
|
3891
|
-
/* @__PURE__ */
|
|
3892
|
-
/* @__PURE__ */
|
|
3893
|
-
), /* @__PURE__ */
|
|
3892
|
+
/* @__PURE__ */ React62.createElement(ToggleButton, { value: "horizontal" }, t("signature.layout.horizontal", "Horizontal")),
|
|
3893
|
+
/* @__PURE__ */ React62.createElement(ToggleButton, { value: "vertical" }, t("signature.layout.vertical", "Vertical"))
|
|
3894
|
+
), /* @__PURE__ */ React62.createElement(
|
|
3894
3895
|
ColorInput2,
|
|
3895
3896
|
{
|
|
3896
|
-
label: "Name color",
|
|
3897
|
+
label: t("signature.name-color", "Name color"),
|
|
3897
3898
|
defaultValue: nameColor,
|
|
3898
3899
|
onChange: (nameColor2) => updateData(__spreadProps(__spreadValues({}, data), { props: __spreadProps(__spreadValues({}, data.props), { nameColor: nameColor2 }) }))
|
|
3899
3900
|
}
|
|
3900
|
-
), /* @__PURE__ */
|
|
3901
|
+
), /* @__PURE__ */ React62.createElement(
|
|
3901
3902
|
ColorInput2,
|
|
3902
3903
|
{
|
|
3903
|
-
label: "Text color",
|
|
3904
|
+
label: t("style.text-color", "Text color"),
|
|
3904
3905
|
defaultValue: textColor,
|
|
3905
3906
|
onChange: (textColor2) => updateData(__spreadProps(__spreadValues({}, data), { props: __spreadProps(__spreadValues({}, data.props), { textColor: textColor2 }) }))
|
|
3906
3907
|
}
|
|
3907
|
-
), /* @__PURE__ */
|
|
3908
|
+
), /* @__PURE__ */ React62.createElement(
|
|
3908
3909
|
ColorInput2,
|
|
3909
3910
|
{
|
|
3910
|
-
label: "Link color",
|
|
3911
|
+
label: t("signature.link-color", "Link color"),
|
|
3911
3912
|
defaultValue: linkColor,
|
|
3912
3913
|
onChange: (linkColor2) => updateData(__spreadProps(__spreadValues({}, data), { props: __spreadProps(__spreadValues({}, data.props), { linkColor: linkColor2 }) }))
|
|
3913
3914
|
}
|
|
3914
|
-
), /* @__PURE__ */
|
|
3915
|
+
), /* @__PURE__ */ React62.createElement(
|
|
3915
3916
|
MultiStylePropertyPanel,
|
|
3916
3917
|
{
|
|
3917
3918
|
names: ["backgroundColor", "fontFamily", "padding"],
|
|
@@ -3932,11 +3933,11 @@ function SpacerSidebarPanel({ data, setData }) {
|
|
|
3932
3933
|
setErrors(res.error);
|
|
3933
3934
|
}
|
|
3934
3935
|
};
|
|
3935
|
-
return /* @__PURE__ */
|
|
3936
|
+
return /* @__PURE__ */ React62.createElement(BaseSidebarPanel, { title: "Spacer block" }, /* @__PURE__ */ React62.createElement(
|
|
3936
3937
|
SliderInput,
|
|
3937
3938
|
{
|
|
3938
|
-
label: "Height",
|
|
3939
|
-
iconLabel: /* @__PURE__ */
|
|
3939
|
+
label: t("field.height", "Height"),
|
|
3940
|
+
iconLabel: /* @__PURE__ */ React62.createElement(HeightOutlined, { sx: { color: "text.secondary" } }),
|
|
3940
3941
|
units: "px",
|
|
3941
3942
|
step: 4,
|
|
3942
3943
|
min: 4,
|
|
@@ -3958,22 +3959,22 @@ function TextSidebarPanel({ data, setData }) {
|
|
|
3958
3959
|
setErrors(res.error);
|
|
3959
3960
|
}
|
|
3960
3961
|
};
|
|
3961
|
-
return /* @__PURE__ */
|
|
3962
|
+
return /* @__PURE__ */ React62.createElement(BaseSidebarPanel, { title: "Text block" }, /* @__PURE__ */ React62.createElement(
|
|
3962
3963
|
TextInput,
|
|
3963
3964
|
{
|
|
3964
|
-
label: "Content",
|
|
3965
|
+
label: t("field.content", "Content"),
|
|
3965
3966
|
rows: 5,
|
|
3966
3967
|
defaultValue: (_b = (_a = data.props) == null ? void 0 : _a.text) != null ? _b : "",
|
|
3967
3968
|
onChange: (text) => updateData(__spreadProps(__spreadValues({}, data), { props: __spreadProps(__spreadValues({}, data.props), { text }) }))
|
|
3968
3969
|
}
|
|
3969
|
-
), /* @__PURE__ */
|
|
3970
|
+
), /* @__PURE__ */ React62.createElement(
|
|
3970
3971
|
BooleanInput,
|
|
3971
3972
|
{
|
|
3972
|
-
label: "Markdown",
|
|
3973
|
+
label: t("field.markdown", "Markdown"),
|
|
3973
3974
|
defaultValue: (_d = (_c = data.props) == null ? void 0 : _c.markdown) != null ? _d : false,
|
|
3974
3975
|
onChange: (markdown) => updateData(__spreadProps(__spreadValues({}, data), { props: __spreadProps(__spreadValues({}, data.props), { markdown }) }))
|
|
3975
3976
|
}
|
|
3976
|
-
), /* @__PURE__ */
|
|
3977
|
+
), /* @__PURE__ */ React62.createElement(
|
|
3977
3978
|
MultiStylePropertyPanel,
|
|
3978
3979
|
{
|
|
3979
3980
|
names: [
|
|
@@ -3995,71 +3996,71 @@ function TextSidebarPanel({ data, setData }) {
|
|
|
3995
3996
|
|
|
3996
3997
|
// src/app/inspector-drawer/configuration-panel/index.tsx
|
|
3997
3998
|
function renderMessage(val) {
|
|
3998
|
-
return /* @__PURE__ */
|
|
3999
|
+
return /* @__PURE__ */ React62.createElement(Box, { sx: { m: 3, p: 1, border: "1px dashed", borderColor: "divider" } }, /* @__PURE__ */ React62.createElement(Typography, { color: "text.secondary" }, val));
|
|
3999
4000
|
}
|
|
4000
4001
|
function ConfigurationPanel() {
|
|
4001
4002
|
const document2 = useDocument();
|
|
4002
4003
|
const selectedBlockId = useSelectedBlockId();
|
|
4003
4004
|
if (!selectedBlockId) {
|
|
4004
|
-
return renderMessage("Click on a block to inspect.");
|
|
4005
|
+
return renderMessage(t("inspect.hint", "Click on a block to inspect."));
|
|
4005
4006
|
}
|
|
4006
4007
|
const block = document2[selectedBlockId];
|
|
4007
4008
|
if (!block) {
|
|
4008
|
-
return renderMessage(
|
|
4009
|
+
return renderMessage(t("inspect.not-found", "Block not found. Click on a block to reset."));
|
|
4009
4010
|
}
|
|
4010
4011
|
const setBlock = (conf) => setDocument({ [selectedBlockId]: conf });
|
|
4011
4012
|
const { data, type } = block;
|
|
4012
4013
|
switch (type) {
|
|
4013
4014
|
case "Avatar":
|
|
4014
|
-
return /* @__PURE__ */
|
|
4015
|
+
return /* @__PURE__ */ React62.createElement(AvatarSidebarPanel, { key: selectedBlockId, data, setData: (data2) => setBlock({ type, data: data2 }) });
|
|
4015
4016
|
case "Button":
|
|
4016
|
-
return /* @__PURE__ */
|
|
4017
|
+
return /* @__PURE__ */ React62.createElement(ButtonSidebarPanel, { key: selectedBlockId, data, setData: (data2) => setBlock({ type, data: data2 }) });
|
|
4017
4018
|
case "ColumnsContainer":
|
|
4018
|
-
return /* @__PURE__ */
|
|
4019
|
+
return /* @__PURE__ */ React62.createElement(ColumnsContainerPanel, { key: selectedBlockId, data, setData: (data2) => setBlock({ type, data: data2 }) });
|
|
4019
4020
|
case "Container":
|
|
4020
|
-
return /* @__PURE__ */
|
|
4021
|
+
return /* @__PURE__ */ React62.createElement(ContainerSidebarPanel, { key: selectedBlockId, data, setData: (data2) => setBlock({ type, data: data2 }) });
|
|
4021
4022
|
case "Divider":
|
|
4022
|
-
return /* @__PURE__ */
|
|
4023
|
+
return /* @__PURE__ */ React62.createElement(DividerSidebarPanel, { key: selectedBlockId, data, setData: (data2) => setBlock({ type, data: data2 }) });
|
|
4023
4024
|
case "Heading":
|
|
4024
|
-
return /* @__PURE__ */
|
|
4025
|
+
return /* @__PURE__ */ React62.createElement(HeadingSidebarPanel, { key: selectedBlockId, data, setData: (data2) => setBlock({ type, data: data2 }) });
|
|
4025
4026
|
case "Html":
|
|
4026
|
-
return /* @__PURE__ */
|
|
4027
|
+
return /* @__PURE__ */ React62.createElement(HtmlSidebarPanel, { key: selectedBlockId, data, setData: (data2) => setBlock({ type, data: data2 }) });
|
|
4027
4028
|
case "Image":
|
|
4028
|
-
return /* @__PURE__ */
|
|
4029
|
+
return /* @__PURE__ */ React62.createElement(ImageSidebarPanel, { key: selectedBlockId, data, setData: (data2) => setBlock({ type, data: data2 }) });
|
|
4029
4030
|
case "EmailLayout":
|
|
4030
|
-
return /* @__PURE__ */
|
|
4031
|
+
return /* @__PURE__ */ React62.createElement(EmailLayoutSidebarFields, { key: selectedBlockId, data, setData: (data2) => setBlock({ type, data: data2 }) });
|
|
4031
4032
|
case "Spacer":
|
|
4032
|
-
return /* @__PURE__ */
|
|
4033
|
+
return /* @__PURE__ */ React62.createElement(SpacerSidebarPanel, { key: selectedBlockId, data, setData: (data2) => setBlock({ type, data: data2 }) });
|
|
4033
4034
|
case "Signature":
|
|
4034
|
-
return /* @__PURE__ */
|
|
4035
|
+
return /* @__PURE__ */ React62.createElement(SignatureSidebarPanel, { key: selectedBlockId, data, setData: (data2) => setBlock({ type, data: data2 }) });
|
|
4035
4036
|
case "Text":
|
|
4036
|
-
return /* @__PURE__ */
|
|
4037
|
+
return /* @__PURE__ */ React62.createElement(TextSidebarPanel, { key: selectedBlockId, data, setData: (data2) => setBlock({ type, data: data2 }) });
|
|
4037
4038
|
default:
|
|
4038
|
-
return /* @__PURE__ */
|
|
4039
|
+
return /* @__PURE__ */ React62.createElement("pre", null, JSON.stringify(block, null, " "));
|
|
4039
4040
|
}
|
|
4040
4041
|
}
|
|
4041
4042
|
function StylesPanel() {
|
|
4042
4043
|
const block = useDocument().root;
|
|
4043
4044
|
if (!block) {
|
|
4044
|
-
return /* @__PURE__ */
|
|
4045
|
+
return /* @__PURE__ */ React62.createElement("p", null, "Block not found");
|
|
4045
4046
|
}
|
|
4046
4047
|
const { data, type } = block;
|
|
4047
4048
|
if (type !== "EmailLayout") {
|
|
4048
4049
|
throw new Error('Expected "root" element to be of type EmailLayout');
|
|
4049
4050
|
}
|
|
4050
|
-
return /* @__PURE__ */
|
|
4051
|
+
return /* @__PURE__ */ React62.createElement(EmailLayoutSidebarFields, { key: "root", data, setData: (data2) => setDocument({ root: { type, data: data2 } }) });
|
|
4051
4052
|
}
|
|
4052
4053
|
function TemplateDownloadButton() {
|
|
4053
4054
|
const doc = useDocument();
|
|
4054
4055
|
const href = useMemo(() => {
|
|
4055
4056
|
return `data:text/plain,${encodeURIComponent(JSON.stringify(doc, null, " "))}`;
|
|
4056
4057
|
}, [doc]);
|
|
4057
|
-
return /* @__PURE__ */
|
|
4058
|
+
return /* @__PURE__ */ React62.createElement(
|
|
4058
4059
|
Button$1,
|
|
4059
4060
|
{
|
|
4060
4061
|
variant: "outlined",
|
|
4061
4062
|
color: "primary",
|
|
4062
|
-
startIcon: /* @__PURE__ */
|
|
4063
|
+
startIcon: /* @__PURE__ */ React62.createElement(FileDownloadOutlined, null),
|
|
4063
4064
|
href,
|
|
4064
4065
|
download: "emailTemplate.json",
|
|
4065
4066
|
fullWidth: true
|
|
@@ -4085,7 +4086,7 @@ function TemplatePanel({
|
|
|
4085
4086
|
const persistenceEnabled = usePersistenceEnabled();
|
|
4086
4087
|
const workspaceBackground = useWorkspaceBackground();
|
|
4087
4088
|
const handleDelete = () => {
|
|
4088
|
-
if (!currentTemplateId || !window.confirm("Are you sure you want to delete this template?")) {
|
|
4089
|
+
if (!currentTemplateId || !window.confirm(t("settings.delete-confirm", "Are you sure you want to delete this template?"))) {
|
|
4089
4090
|
return;
|
|
4090
4091
|
}
|
|
4091
4092
|
if (deleteTemplate) {
|
|
@@ -4098,10 +4099,10 @@ function TemplatePanel({
|
|
|
4098
4099
|
if (!currentTemplateName || !document2) return;
|
|
4099
4100
|
if (copyTemplate) {
|
|
4100
4101
|
copyTemplate(`${currentTemplateName} (Copy)`, document2);
|
|
4101
|
-
window.alert("Template copied successfully!");
|
|
4102
|
+
window.alert(t("settings.copied", "Template copied successfully!"));
|
|
4102
4103
|
}
|
|
4103
4104
|
};
|
|
4104
|
-
const workspaceToggle = /* @__PURE__ */
|
|
4105
|
+
const workspaceToggle = /* @__PURE__ */ React62.createElement(BaseSidebarPanel, { title: "Editor appearance" }, /* @__PURE__ */ React62.createElement(Stack, { spacing: 1 }, /* @__PURE__ */ React62.createElement(Typography, { variant: "caption", sx: { color: "text.secondary" } }, t("settings.workspace-background", "Workspace background")), /* @__PURE__ */ React62.createElement(
|
|
4105
4106
|
ToggleButtonGroup,
|
|
4106
4107
|
{
|
|
4107
4108
|
value: workspaceBackground,
|
|
@@ -4109,13 +4110,13 @@ function TemplatePanel({
|
|
|
4109
4110
|
size: "small",
|
|
4110
4111
|
onChange: (_, v) => v && setWorkspaceBackground(v)
|
|
4111
4112
|
},
|
|
4112
|
-
/* @__PURE__ */
|
|
4113
|
-
/* @__PURE__ */
|
|
4114
|
-
), /* @__PURE__ */
|
|
4113
|
+
/* @__PURE__ */ React62.createElement(ToggleButton, { value: "checkerboard", sx: { textTransform: "none", gap: 0.75 } }, /* @__PURE__ */ React62.createElement(GridOnOutlined, { fontSize: "small" }), t("settings.checkerboard", "Checkerboard")),
|
|
4114
|
+
/* @__PURE__ */ React62.createElement(ToggleButton, { value: "solid", sx: { textTransform: "none", gap: 0.75 } }, /* @__PURE__ */ React62.createElement(SquareOutlined, { fontSize: "small" }), t("settings.solid", "Solid"))
|
|
4115
|
+
), /* @__PURE__ */ React62.createElement(Typography, { variant: "caption", sx: { color: "text.disabled" } }, t("settings.editor-only-hint", "Editor-only \u2014 never reaches the rendered email."))));
|
|
4115
4116
|
if (!currentTemplateId) {
|
|
4116
|
-
return /* @__PURE__ */
|
|
4117
|
+
return /* @__PURE__ */ React62.createElement(React62.Fragment, null, /* @__PURE__ */ React62.createElement(BaseSidebarPanel, { title: "Template" }, t("settings.no-template", "No template selected")), workspaceToggle);
|
|
4117
4118
|
}
|
|
4118
|
-
return /* @__PURE__ */
|
|
4119
|
+
return /* @__PURE__ */ React62.createElement(React62.Fragment, null, /* @__PURE__ */ React62.createElement(BaseSidebarPanel, { title: "Details" }, /* @__PURE__ */ React62.createElement(
|
|
4119
4120
|
DetailsEditor,
|
|
4120
4121
|
{
|
|
4121
4122
|
templateId: currentTemplateId,
|
|
@@ -4129,7 +4130,7 @@ function TemplatePanel({
|
|
|
4129
4130
|
setCurrentTemplateTags(tags);
|
|
4130
4131
|
})
|
|
4131
4132
|
}
|
|
4132
|
-
)), /* @__PURE__ */
|
|
4133
|
+
)), /* @__PURE__ */ React62.createElement(BaseSidebarPanel, { title: "Template" }, /* @__PURE__ */ React62.createElement(Stack, { spacing: 2 }, !persistenceEnabled && /* @__PURE__ */ React62.createElement(
|
|
4133
4134
|
Typography,
|
|
4134
4135
|
{
|
|
4135
4136
|
variant: "body2",
|
|
@@ -4141,30 +4142,30 @@ function TemplatePanel({
|
|
|
4141
4142
|
fontSize: "0.8rem"
|
|
4142
4143
|
}
|
|
4143
4144
|
},
|
|
4144
|
-
"Save functionality is disabled. To enable saving, provide the necessary callback functions."
|
|
4145
|
-
), persistenceEnabled && /* @__PURE__ */
|
|
4145
|
+
t("settings.save-disabled", "Save functionality is disabled. To enable saving, provide the necessary callback functions.")
|
|
4146
|
+
), persistenceEnabled && /* @__PURE__ */ React62.createElement(React62.Fragment, null, /* @__PURE__ */ React62.createElement(
|
|
4146
4147
|
Button$1,
|
|
4147
4148
|
{
|
|
4148
4149
|
variant: "outlined",
|
|
4149
4150
|
color: "primary",
|
|
4150
|
-
startIcon: /* @__PURE__ */
|
|
4151
|
+
startIcon: /* @__PURE__ */ React62.createElement(ContentCopyOutlined, null),
|
|
4151
4152
|
onClick: handleCopyToSamples,
|
|
4152
4153
|
fullWidth: true,
|
|
4153
4154
|
disabled: !copyTemplate
|
|
4154
4155
|
},
|
|
4155
|
-
"Save as Sample Template"
|
|
4156
|
-
), /* @__PURE__ */
|
|
4156
|
+
t("settings.save-as-sample", "Save as Sample Template")
|
|
4157
|
+
), /* @__PURE__ */ React62.createElement(
|
|
4157
4158
|
Button$1,
|
|
4158
4159
|
{
|
|
4159
4160
|
variant: "outlined",
|
|
4160
4161
|
color: "error",
|
|
4161
|
-
startIcon: /* @__PURE__ */
|
|
4162
|
+
startIcon: /* @__PURE__ */ React62.createElement(DeleteOutlined, null),
|
|
4162
4163
|
onClick: handleDelete,
|
|
4163
4164
|
fullWidth: true,
|
|
4164
4165
|
disabled: !deleteTemplate
|
|
4165
4166
|
},
|
|
4166
|
-
"Delete Template"
|
|
4167
|
-
)))), persistenceEnabled && /* @__PURE__ */
|
|
4167
|
+
t("settings.delete", "Delete Template")
|
|
4168
|
+
)))), persistenceEnabled && /* @__PURE__ */ React62.createElement(BaseSidebarPanel, { title: "Export" }, /* @__PURE__ */ React62.createElement(Stack, { spacing: 2 }, /* @__PURE__ */ React62.createElement(TemplateDownloadButton, null))), workspaceToggle);
|
|
4168
4169
|
}
|
|
4169
4170
|
function DetailsEditor({ templateId, currentName, currentTags, canEdit, onSave }) {
|
|
4170
4171
|
const [name, setName] = useState(currentName);
|
|
@@ -4201,17 +4202,17 @@ function DetailsEditor({ templateId, currentName, currentTags, canEdit, onSave }
|
|
|
4201
4202
|
setSaving(false);
|
|
4202
4203
|
}
|
|
4203
4204
|
});
|
|
4204
|
-
return /* @__PURE__ */
|
|
4205
|
+
return /* @__PURE__ */ React62.createElement(Stack, { spacing: 1.5 }, /* @__PURE__ */ React62.createElement(
|
|
4205
4206
|
TextField,
|
|
4206
4207
|
{
|
|
4207
4208
|
size: "small",
|
|
4208
|
-
label: "Name",
|
|
4209
|
+
label: t("rename.name-label", "Name"),
|
|
4209
4210
|
value: name,
|
|
4210
4211
|
onChange: (e) => setName(e.target.value),
|
|
4211
4212
|
disabled: !canEdit || saving,
|
|
4212
4213
|
fullWidth: true
|
|
4213
4214
|
}
|
|
4214
|
-
), /* @__PURE__ */
|
|
4215
|
+
), /* @__PURE__ */ React62.createElement(Box, null, /* @__PURE__ */ React62.createElement(Typography, { variant: "caption", sx: { color: "text.secondary", display: "block", mb: 0.5 } }, t("rename.tags", "Tags")), tags.length > 0 ? /* @__PURE__ */ React62.createElement(Stack, { direction: "row", spacing: 0.5, sx: { flexWrap: "wrap", gap: 0.5, mb: 1 } }, tags.map((tag) => /* @__PURE__ */ React62.createElement(
|
|
4215
4216
|
Chip,
|
|
4216
4217
|
{
|
|
4217
4218
|
key: tag,
|
|
@@ -4219,12 +4220,12 @@ function DetailsEditor({ templateId, currentName, currentTags, canEdit, onSave }
|
|
|
4219
4220
|
size: "small",
|
|
4220
4221
|
onDelete: canEdit && !saving ? () => removeTag(tag) : void 0
|
|
4221
4222
|
}
|
|
4222
|
-
))) : /* @__PURE__ */
|
|
4223
|
+
))) : /* @__PURE__ */ React62.createElement(Typography, { variant: "caption", sx: { color: "text.disabled", display: "block", mb: 1 } }, t("rename.no-tags", "No tags yet.")), /* @__PURE__ */ React62.createElement(
|
|
4223
4224
|
TextField,
|
|
4224
4225
|
{
|
|
4225
4226
|
size: "small",
|
|
4226
4227
|
fullWidth: true,
|
|
4227
|
-
placeholder: "Add a tag",
|
|
4228
|
+
placeholder: t("rename.add-tag", "Add a tag"),
|
|
4228
4229
|
value: tagInput,
|
|
4229
4230
|
onChange: (e) => setTagInput(e.target.value),
|
|
4230
4231
|
disabled: !canEdit || saving,
|
|
@@ -4238,20 +4239,20 @@ function DetailsEditor({ templateId, currentName, currentTags, canEdit, onSave }
|
|
|
4238
4239
|
}
|
|
4239
4240
|
},
|
|
4240
4241
|
InputProps: {
|
|
4241
|
-
endAdornment: /* @__PURE__ */
|
|
4242
|
+
endAdornment: /* @__PURE__ */ React62.createElement(InputAdornment, { position: "end" }, /* @__PURE__ */ React62.createElement(
|
|
4242
4243
|
Button$1,
|
|
4243
4244
|
{
|
|
4244
4245
|
size: "small",
|
|
4245
4246
|
onClick: addTag,
|
|
4246
4247
|
disabled: !canEdit || saving || !tagInput.trim(),
|
|
4247
|
-
startIcon: /* @__PURE__ */
|
|
4248
|
+
startIcon: /* @__PURE__ */ React62.createElement(AddOutlined, { fontSize: "small" }),
|
|
4248
4249
|
sx: { textTransform: "none" }
|
|
4249
4250
|
},
|
|
4250
|
-
"Add"
|
|
4251
|
+
t("common.add", "Add")
|
|
4251
4252
|
))
|
|
4252
4253
|
}
|
|
4253
4254
|
}
|
|
4254
|
-
)), /* @__PURE__ */
|
|
4255
|
+
)), /* @__PURE__ */ React62.createElement(Tooltip, { title: canEdit ? "" : t("settings.no-rename-cb", "Wire a renameTemplate callback to enable editing from here"), placement: "top" }, /* @__PURE__ */ React62.createElement("span", null, /* @__PURE__ */ React62.createElement(
|
|
4255
4256
|
Button$1,
|
|
4256
4257
|
{
|
|
4257
4258
|
variant: "contained",
|
|
@@ -4259,9 +4260,9 @@ function DetailsEditor({ templateId, currentName, currentTags, canEdit, onSave }
|
|
|
4259
4260
|
fullWidth: true,
|
|
4260
4261
|
onClick: handleSave,
|
|
4261
4262
|
disabled: !canEdit || saving || !dirty || !name.trim(),
|
|
4262
|
-
startIcon: justSaved ? /* @__PURE__ */
|
|
4263
|
+
startIcon: justSaved ? /* @__PURE__ */ React62.createElement(CheckOutlined, { fontSize: "small" }) : null
|
|
4263
4264
|
},
|
|
4264
|
-
saving ? "Saving\u2026" : justSaved ? "Saved" : "Save details"
|
|
4265
|
+
saving ? t("common.saving", "Saving\u2026") : justSaved ? t("settings.saved", "Saved") : t("settings.save-details", "Save details")
|
|
4265
4266
|
))));
|
|
4266
4267
|
}
|
|
4267
4268
|
|
|
@@ -4436,7 +4437,7 @@ function VariablesPanel() {
|
|
|
4436
4437
|
const lastFocused = useLastFocusedEditable();
|
|
4437
4438
|
const root = document2.root;
|
|
4438
4439
|
if (!root || root.type !== "EmailLayout") {
|
|
4439
|
-
return /* @__PURE__ */
|
|
4440
|
+
return /* @__PURE__ */ React62.createElement(Box, { p: 2 }, /* @__PURE__ */ React62.createElement(Alert, { severity: "info" }, "Open a template to manage variables."));
|
|
4440
4441
|
}
|
|
4441
4442
|
const data = root.data;
|
|
4442
4443
|
const variables = ((_a = data.variables) != null ? _a : []).map((v) => {
|
|
@@ -4531,7 +4532,7 @@ function VariablesPanel() {
|
|
|
4531
4532
|
} catch (e) {
|
|
4532
4533
|
}
|
|
4533
4534
|
});
|
|
4534
|
-
return /* @__PURE__ */
|
|
4535
|
+
return /* @__PURE__ */ React62.createElement(Box, { p: 2 }, /* @__PURE__ */ React62.createElement(Stack, { direction: "row", alignItems: "center", justifyContent: "space-between", sx: { mb: 1 } }, /* @__PURE__ */ React62.createElement(Typography, { variant: "subtitle1", sx: { fontWeight: 600 } }, "Variables"), /* @__PURE__ */ React62.createElement(Tooltip, { title: "Add variable" }, /* @__PURE__ */ React62.createElement(IconButton, { size: "small", onClick: add, "aria-label": "Add variable" }, /* @__PURE__ */ React62.createElement(AddOutlined, { fontSize: "small" })))), /* @__PURE__ */ React62.createElement(Typography, { variant: "caption", sx: { color: "text.secondary", display: "block", mb: 2 } }, "Declared variables travel with the template. Reference them in subject and body as", " ", /* @__PURE__ */ React62.createElement(Box, { component: "code", sx: { fontFamily: "monospace" } }, "{{name}}"), ". In Preview mode, tokens render with the sample values below."), undeclared.length > 0 && /* @__PURE__ */ React62.createElement(Alert, { severity: "warning", sx: { mb: 2 } }, /* @__PURE__ */ React62.createElement(AlertTitle, { sx: { fontSize: 13 } }, "Undeclared in body"), /* @__PURE__ */ React62.createElement(Stack, { direction: "row", spacing: 0.5, useFlexGap: true, flexWrap: "wrap" }, undeclared.map((name) => /* @__PURE__ */ React62.createElement(
|
|
4535
4536
|
Chip,
|
|
4536
4537
|
{
|
|
4537
4538
|
key: name,
|
|
@@ -4539,12 +4540,12 @@ function VariablesPanel() {
|
|
|
4539
4540
|
label: name,
|
|
4540
4541
|
onClick: () => addFromToken(name),
|
|
4541
4542
|
onDelete: () => addFromToken(name),
|
|
4542
|
-
deleteIcon: /* @__PURE__ */
|
|
4543
|
+
deleteIcon: /* @__PURE__ */ React62.createElement(AddOutlined, null),
|
|
4543
4544
|
sx: { fontFamily: "monospace" }
|
|
4544
4545
|
}
|
|
4545
|
-
))), /* @__PURE__ */
|
|
4546
|
+
))), /* @__PURE__ */ React62.createElement(Typography, { variant: "caption", sx: { color: "text.secondary", display: "block", mt: 0.5 } }, "Click a token to declare it.")), variables.length === 0 ? /* @__PURE__ */ React62.createElement(Typography, { variant: "body2", sx: { color: "text.secondary" } }, "No variables declared. Click + to add one.") : /* @__PURE__ */ React62.createElement(Stack, { spacing: 2 }, variables.map((v, i) => {
|
|
4546
4547
|
var _a2;
|
|
4547
|
-
return /* @__PURE__ */
|
|
4548
|
+
return /* @__PURE__ */ React62.createElement(
|
|
4548
4549
|
VariableRow,
|
|
4549
4550
|
{
|
|
4550
4551
|
key: i,
|
|
@@ -4595,7 +4596,7 @@ function VariableRow({
|
|
|
4595
4596
|
onCommitRename(draftName.trim());
|
|
4596
4597
|
}
|
|
4597
4598
|
};
|
|
4598
|
-
return /* @__PURE__ */
|
|
4599
|
+
return /* @__PURE__ */ React62.createElement(Stack, { spacing: 0.75, sx: { pb: 1, borderBottom: 1, borderColor: "divider" } }, /* @__PURE__ */ React62.createElement(Stack, { direction: "row", spacing: 1, alignItems: "flex-start" }, /* @__PURE__ */ React62.createElement(
|
|
4599
4600
|
TextField,
|
|
4600
4601
|
{
|
|
4601
4602
|
label: "Name",
|
|
@@ -4620,7 +4621,7 @@ function VariableRow({
|
|
|
4620
4621
|
error: Boolean(nameError),
|
|
4621
4622
|
helperText: nameError != null ? nameError : " "
|
|
4622
4623
|
}
|
|
4623
|
-
), /* @__PURE__ */
|
|
4624
|
+
), /* @__PURE__ */ React62.createElement(Stack, { direction: "row", spacing: 0.25, sx: { mt: 0.5 } }, /* @__PURE__ */ React62.createElement(Tooltip, { title: "Copy {{name}}" }, /* @__PURE__ */ React62.createElement("span", null, /* @__PURE__ */ React62.createElement(
|
|
4624
4625
|
IconButton,
|
|
4625
4626
|
{
|
|
4626
4627
|
size: "small",
|
|
@@ -4628,8 +4629,8 @@ function VariableRow({
|
|
|
4628
4629
|
disabled: !hasName,
|
|
4629
4630
|
"aria-label": `Copy ${variable.name || "variable"} token`
|
|
4630
4631
|
},
|
|
4631
|
-
/* @__PURE__ */
|
|
4632
|
-
))), /* @__PURE__ */
|
|
4632
|
+
/* @__PURE__ */ React62.createElement(ContentCopyOutlined, { fontSize: "small" })
|
|
4633
|
+
))), /* @__PURE__ */ React62.createElement(Tooltip, { title: canInsert ? "Insert at cursor" : "Focus a text field first" }, /* @__PURE__ */ React62.createElement("span", null, /* @__PURE__ */ React62.createElement(
|
|
4633
4634
|
IconButton,
|
|
4634
4635
|
{
|
|
4635
4636
|
size: "small",
|
|
@@ -4637,16 +4638,16 @@ function VariableRow({
|
|
|
4637
4638
|
disabled: !hasName || !canInsert,
|
|
4638
4639
|
"aria-label": `Insert ${variable.name || "variable"} at cursor`
|
|
4639
4640
|
},
|
|
4640
|
-
/* @__PURE__ */
|
|
4641
|
-
))), /* @__PURE__ */
|
|
4641
|
+
/* @__PURE__ */ React62.createElement(InputOutlined, { fontSize: "small" })
|
|
4642
|
+
))), /* @__PURE__ */ React62.createElement(Tooltip, { title: "Remove" }, /* @__PURE__ */ React62.createElement(
|
|
4642
4643
|
IconButton,
|
|
4643
4644
|
{
|
|
4644
4645
|
size: "small",
|
|
4645
4646
|
onClick: onRemove,
|
|
4646
4647
|
"aria-label": `Remove ${variable.name || "variable"}`
|
|
4647
4648
|
},
|
|
4648
|
-
/* @__PURE__ */
|
|
4649
|
-
)))), /* @__PURE__ */
|
|
4649
|
+
/* @__PURE__ */ React62.createElement(DeleteOutline, { fontSize: "small" })
|
|
4650
|
+
)))), /* @__PURE__ */ React62.createElement(
|
|
4650
4651
|
TextField,
|
|
4651
4652
|
{
|
|
4652
4653
|
label: "Description",
|
|
@@ -4656,7 +4657,7 @@ function VariableRow({
|
|
|
4656
4657
|
onChange: (e) => onChangeDescription(e.target.value),
|
|
4657
4658
|
placeholder: "Optional"
|
|
4658
4659
|
}
|
|
4659
|
-
), /* @__PURE__ */
|
|
4660
|
+
), /* @__PURE__ */ React62.createElement(
|
|
4660
4661
|
TextField,
|
|
4661
4662
|
{
|
|
4662
4663
|
label: "Sample value",
|
|
@@ -4666,7 +4667,7 @@ function VariableRow({
|
|
|
4666
4667
|
onChange: (e) => onChangeSampleValue(e.target.value),
|
|
4667
4668
|
placeholder: "Shown in Preview mode",
|
|
4668
4669
|
InputProps: {
|
|
4669
|
-
startAdornment: /* @__PURE__ */
|
|
4670
|
+
startAdornment: /* @__PURE__ */ React62.createElement(
|
|
4670
4671
|
DataObjectOutlined,
|
|
4671
4672
|
{
|
|
4672
4673
|
fontSize: "small",
|
|
@@ -4675,7 +4676,7 @@ function VariableRow({
|
|
|
4675
4676
|
)
|
|
4676
4677
|
}
|
|
4677
4678
|
}
|
|
4678
|
-
), /* @__PURE__ */
|
|
4679
|
+
), /* @__PURE__ */ React62.createElement(Stack, { direction: "row", spacing: 0.5, sx: { pt: 0.25 } }, hasName && (unused ? /* @__PURE__ */ React62.createElement(Chip, { size: "small", color: "warning", variant: "outlined", label: "Unused in body" }) : /* @__PURE__ */ React62.createElement(
|
|
4679
4680
|
Chip,
|
|
4680
4681
|
{
|
|
4681
4682
|
size: "small",
|
|
@@ -4700,13 +4701,13 @@ function InspectorDrawer({
|
|
|
4700
4701
|
const renderCurrentSidebarPanel = () => {
|
|
4701
4702
|
switch (selectedSidebarTab) {
|
|
4702
4703
|
case "block-configuration":
|
|
4703
|
-
return /* @__PURE__ */
|
|
4704
|
+
return /* @__PURE__ */ React62.createElement(ConfigurationPanel, null);
|
|
4704
4705
|
case "styles":
|
|
4705
|
-
return /* @__PURE__ */
|
|
4706
|
+
return /* @__PURE__ */ React62.createElement(StylesPanel, null);
|
|
4706
4707
|
case "variables":
|
|
4707
|
-
return /* @__PURE__ */
|
|
4708
|
+
return /* @__PURE__ */ React62.createElement(VariablesPanel, null);
|
|
4708
4709
|
case "template-settings":
|
|
4709
|
-
return /* @__PURE__ */
|
|
4710
|
+
return /* @__PURE__ */ React62.createElement(
|
|
4710
4711
|
TemplatePanel,
|
|
4711
4712
|
{
|
|
4712
4713
|
deleteTemplate,
|
|
@@ -4716,7 +4717,7 @@ function InspectorDrawer({
|
|
|
4716
4717
|
);
|
|
4717
4718
|
}
|
|
4718
4719
|
};
|
|
4719
|
-
return /* @__PURE__ */
|
|
4720
|
+
return /* @__PURE__ */ React62.createElement(
|
|
4720
4721
|
Drawer,
|
|
4721
4722
|
{
|
|
4722
4723
|
variant: "persistent",
|
|
@@ -4738,7 +4739,7 @@ function InspectorDrawer({
|
|
|
4738
4739
|
width: inspectorDrawerOpen ? INSPECTOR_DRAWER_WIDTH : 0
|
|
4739
4740
|
}
|
|
4740
4741
|
},
|
|
4741
|
-
/* @__PURE__ */
|
|
4742
|
+
/* @__PURE__ */ React62.createElement(Box, { sx: { width: INSPECTOR_DRAWER_WIDTH, height: 49, borderBottom: 1, borderColor: "divider" } }, /* @__PURE__ */ React62.createElement(Box, { px: 1 }, /* @__PURE__ */ React62.createElement(
|
|
4742
4743
|
Tabs,
|
|
4743
4744
|
{
|
|
4744
4745
|
value: selectedSidebarTab,
|
|
@@ -4746,12 +4747,12 @@ function InspectorDrawer({
|
|
|
4746
4747
|
variant: "fullWidth",
|
|
4747
4748
|
sx: { "& .MuiTab-root": { minWidth: 0, px: 1, fontSize: 13 } }
|
|
4748
4749
|
},
|
|
4749
|
-
/* @__PURE__ */
|
|
4750
|
-
/* @__PURE__ */
|
|
4751
|
-
/* @__PURE__ */
|
|
4752
|
-
/* @__PURE__ */
|
|
4750
|
+
/* @__PURE__ */ React62.createElement(Tab, { value: "styles", label: t("inspector.tab.styles", "Styles") }),
|
|
4751
|
+
/* @__PURE__ */ React62.createElement(Tab, { value: "block-configuration", label: t("inspector.tab.inspect", "Inspect") }),
|
|
4752
|
+
/* @__PURE__ */ React62.createElement(Tab, { value: "variables", label: t("inspector.tab.variables", "Variables") }),
|
|
4753
|
+
/* @__PURE__ */ React62.createElement(Tab, { value: "template-settings", label: t("inspector.tab.settings", "Settings") })
|
|
4753
4754
|
))),
|
|
4754
|
-
/* @__PURE__ */
|
|
4755
|
+
/* @__PURE__ */ React62.createElement(Box, { sx: { width: INSPECTOR_DRAWER_WIDTH, height: "calc(100% - 49px)", overflow: "auto" } }, renderCurrentSidebarPanel())
|
|
4755
4756
|
);
|
|
4756
4757
|
}
|
|
4757
4758
|
var SnackbarContext = createContext(null);
|
|
@@ -4772,7 +4773,7 @@ function SnackbarProvider({ children }) {
|
|
|
4772
4773
|
const handleClose = () => {
|
|
4773
4774
|
setMessage(null);
|
|
4774
4775
|
};
|
|
4775
|
-
return /* @__PURE__ */
|
|
4776
|
+
return /* @__PURE__ */ React62.createElement(SnackbarContext.Provider, { value: { showMessage } }, children, /* @__PURE__ */ React62.createElement(
|
|
4776
4777
|
Snackbar,
|
|
4777
4778
|
{
|
|
4778
4779
|
anchorOrigin: { vertical: "top", horizontal: "center" },
|
|
@@ -4795,17 +4796,17 @@ function relativeTime(iso) {
|
|
|
4795
4796
|
if (Number.isNaN(date)) return null;
|
|
4796
4797
|
const diffMs = Date.now() - date;
|
|
4797
4798
|
const diffSec = Math.round(diffMs / 1e3);
|
|
4798
|
-
if (diffSec < 60) return "just now";
|
|
4799
|
+
if (diffSec < 60) return t("time.just-now", "just now");
|
|
4799
4800
|
const diffMin = Math.round(diffSec / 60);
|
|
4800
|
-
if (diffMin < 60) return `${diffMin}m ago`;
|
|
4801
|
+
if (diffMin < 60) return `${diffMin}${t("time.minutes-short", "m ago")}`;
|
|
4801
4802
|
const diffHr = Math.round(diffMin / 60);
|
|
4802
|
-
if (diffHr < 24) return `${diffHr}h ago`;
|
|
4803
|
+
if (diffHr < 24) return `${diffHr}${t("time.hours-short", "h ago")}`;
|
|
4803
4804
|
const diffDay = Math.round(diffHr / 24);
|
|
4804
|
-
if (diffDay < 30) return `${diffDay}d ago`;
|
|
4805
|
+
if (diffDay < 30) return `${diffDay}${t("time.days-short", "d ago")}`;
|
|
4805
4806
|
const diffMo = Math.round(diffDay / 30);
|
|
4806
|
-
if (diffMo < 12) return `${diffMo}mo ago`;
|
|
4807
|
+
if (diffMo < 12) return `${diffMo}${t("time.months-short", "mo ago")}`;
|
|
4807
4808
|
const diffYr = Math.round(diffMo / 12);
|
|
4808
|
-
return `${diffYr}y ago`;
|
|
4809
|
+
return `${diffYr}${t("time.years-short", "y ago")}`;
|
|
4809
4810
|
}
|
|
4810
4811
|
function TemplateRow({
|
|
4811
4812
|
template,
|
|
@@ -4849,7 +4850,7 @@ function TemplateRow({
|
|
|
4849
4850
|
const hasActions = Boolean(
|
|
4850
4851
|
onDuplicate || onRename || onDelete || onPromote || onDemote || onDuplicateAsTemplate
|
|
4851
4852
|
);
|
|
4852
|
-
return /* @__PURE__ */
|
|
4853
|
+
return /* @__PURE__ */ React62.createElement(
|
|
4853
4854
|
Box,
|
|
4854
4855
|
{
|
|
4855
4856
|
role: "button",
|
|
@@ -4875,7 +4876,7 @@ function TemplateRow({
|
|
|
4875
4876
|
"&:focus-visible": { outline: "2px solid", outlineColor: "primary.main" }
|
|
4876
4877
|
}
|
|
4877
4878
|
},
|
|
4878
|
-
/* @__PURE__ */
|
|
4879
|
+
/* @__PURE__ */ React62.createElement(Stack, { direction: "row", alignItems: "flex-start", spacing: 1 }, /* @__PURE__ */ React62.createElement(Box, { sx: { flexGrow: 1, minWidth: 0, pr: hasActions ? 3 : 0 } }, /* @__PURE__ */ React62.createElement(Stack, { direction: "row", alignItems: "baseline", spacing: 1, sx: { minWidth: 0 } }, /* @__PURE__ */ React62.createElement(
|
|
4879
4880
|
Typography,
|
|
4880
4881
|
{
|
|
4881
4882
|
variant: "body2",
|
|
@@ -4889,14 +4890,14 @@ function TemplateRow({
|
|
|
4889
4890
|
title: template.slug
|
|
4890
4891
|
},
|
|
4891
4892
|
template.slug
|
|
4892
|
-
), updated && !hasActions && /* @__PURE__ */
|
|
4893
|
+
), updated && !hasActions && /* @__PURE__ */ React62.createElement(
|
|
4893
4894
|
Typography,
|
|
4894
4895
|
{
|
|
4895
4896
|
variant: "caption",
|
|
4896
4897
|
sx: { color: "text.secondary", flexShrink: 0, fontSize: "0.7rem" }
|
|
4897
4898
|
},
|
|
4898
4899
|
updated
|
|
4899
|
-
)), template.description && /* @__PURE__ */
|
|
4900
|
+
)), template.description && /* @__PURE__ */ React62.createElement(
|
|
4900
4901
|
Typography,
|
|
4901
4902
|
{
|
|
4902
4903
|
variant: "caption",
|
|
@@ -4910,7 +4911,7 @@ function TemplateRow({
|
|
|
4910
4911
|
}
|
|
4911
4912
|
},
|
|
4912
4913
|
template.description
|
|
4913
|
-
), template.tags && template.tags.length > 0 && /* @__PURE__ */
|
|
4914
|
+
), template.tags && template.tags.length > 0 && /* @__PURE__ */ React62.createElement(Stack, { direction: "row", spacing: 0.5, sx: { mt: 0.5, flexWrap: "wrap", gap: 0.5 } }, template.tags.map((tag) => /* @__PURE__ */ React62.createElement(
|
|
4914
4915
|
Chip,
|
|
4915
4916
|
{
|
|
4916
4917
|
key: tag,
|
|
@@ -4919,12 +4920,12 @@ function TemplateRow({
|
|
|
4919
4920
|
sx: { height: 18, fontSize: "0.65rem", "& .MuiChip-label": { px: 0.75 } }
|
|
4920
4921
|
}
|
|
4921
4922
|
))))),
|
|
4922
|
-
hasActions && /* @__PURE__ */
|
|
4923
|
+
hasActions && /* @__PURE__ */ React62.createElement(React62.Fragment, null, /* @__PURE__ */ React62.createElement(Tooltip, { title: t("row.more", "More") }, /* @__PURE__ */ React62.createElement(
|
|
4923
4924
|
IconButton,
|
|
4924
4925
|
{
|
|
4925
4926
|
size: "small",
|
|
4926
4927
|
onClick: openMenu,
|
|
4927
|
-
"aria-label": "Row actions",
|
|
4928
|
+
"aria-label": t("row.actions", "Row actions"),
|
|
4928
4929
|
"aria-haspopup": "menu",
|
|
4929
4930
|
"aria-expanded": Boolean(menuAnchor) || void 0,
|
|
4930
4931
|
sx: {
|
|
@@ -4935,8 +4936,8 @@ function TemplateRow({
|
|
|
4935
4936
|
transition: "opacity 120ms"
|
|
4936
4937
|
}
|
|
4937
4938
|
},
|
|
4938
|
-
/* @__PURE__ */
|
|
4939
|
-
)), /* @__PURE__ */
|
|
4939
|
+
/* @__PURE__ */ React62.createElement(MoreVertOutlined, { fontSize: "small" })
|
|
4940
|
+
)), /* @__PURE__ */ React62.createElement(
|
|
4940
4941
|
Menu,
|
|
4941
4942
|
{
|
|
4942
4943
|
anchorEl: menuAnchor,
|
|
@@ -4947,14 +4948,14 @@ function TemplateRow({
|
|
|
4947
4948
|
transformOrigin: { vertical: "top", horizontal: "right" },
|
|
4948
4949
|
slotProps: { paper: { sx: { minWidth: 200 } } }
|
|
4949
4950
|
},
|
|
4950
|
-
onRename && /* @__PURE__ */
|
|
4951
|
-
onDuplicate && /* @__PURE__ */
|
|
4952
|
-
onDuplicateAsTemplate && /* @__PURE__ */
|
|
4953
|
-
onPromote && /* @__PURE__ */
|
|
4954
|
-
onDemote && /* @__PURE__ */
|
|
4951
|
+
onRename && /* @__PURE__ */ React62.createElement(MenuItem, { onClick: runAction(onRename) }, /* @__PURE__ */ React62.createElement(ListItemIcon, null, /* @__PURE__ */ React62.createElement(DriveFileRenameOutlineOutlined, { fontSize: "small" })), /* @__PURE__ */ React62.createElement(ListItemText, null, t("row.edit-details", "Edit name & tags\u2026"))),
|
|
4952
|
+
onDuplicate && /* @__PURE__ */ React62.createElement(MenuItem, { onClick: runAction(onDuplicate) }, /* @__PURE__ */ React62.createElement(ListItemIcon, null, /* @__PURE__ */ React62.createElement(ContentCopyOutlined, { fontSize: "small" })), /* @__PURE__ */ React62.createElement(ListItemText, null, t("row.duplicate", "Duplicate"))),
|
|
4953
|
+
onDuplicateAsTemplate && /* @__PURE__ */ React62.createElement(MenuItem, { onClick: runAction(onDuplicateAsTemplate) }, /* @__PURE__ */ React62.createElement(ListItemIcon, null, /* @__PURE__ */ React62.createElement(LibraryAddOutlined, { fontSize: "small" })), /* @__PURE__ */ React62.createElement(ListItemText, null, t("row.duplicate-as-template", "Duplicate as template"))),
|
|
4954
|
+
onPromote && /* @__PURE__ */ React62.createElement(MenuItem, { onClick: runAction(onPromote) }, /* @__PURE__ */ React62.createElement(ListItemIcon, null, /* @__PURE__ */ React62.createElement(FileUploadOutlined, { fontSize: "small" })), /* @__PURE__ */ React62.createElement(ListItemText, null, t("row.promote", "Promote to sample"))),
|
|
4955
|
+
onDemote && /* @__PURE__ */ React62.createElement(MenuItem, { onClick: runAction(onDemote) }, /* @__PURE__ */ React62.createElement(ListItemIcon, null, /* @__PURE__ */ React62.createElement(FileDownloadOutlined, { fontSize: "small" })), /* @__PURE__ */ React62.createElement(ListItemText, null, t("row.demote", "Demote to template"))),
|
|
4955
4956
|
onDelete && [
|
|
4956
|
-
/* @__PURE__ */
|
|
4957
|
-
/* @__PURE__ */
|
|
4957
|
+
/* @__PURE__ */ React62.createElement(Divider$1, { key: "divider" }),
|
|
4958
|
+
/* @__PURE__ */ React62.createElement(MenuItem, { key: "delete", onClick: runAction(onDelete), sx: { color: "error.main" } }, /* @__PURE__ */ React62.createElement(ListItemIcon, { sx: { color: "error.main" } }, /* @__PURE__ */ React62.createElement(DeleteOutlined, { fontSize: "small" })), /* @__PURE__ */ React62.createElement(ListItemText, null, t("tune.delete", "Delete")))
|
|
4958
4959
|
]
|
|
4959
4960
|
))
|
|
4960
4961
|
);
|
|
@@ -5069,31 +5070,31 @@ var PREVIEW_MAX = 36;
|
|
|
5069
5070
|
function iconForType(type) {
|
|
5070
5071
|
switch (type) {
|
|
5071
5072
|
case "EmailLayout":
|
|
5072
|
-
return /* @__PURE__ */
|
|
5073
|
+
return /* @__PURE__ */ React62.createElement(DashboardOutlined, { fontSize: "small" });
|
|
5073
5074
|
case "Heading":
|
|
5074
|
-
return /* @__PURE__ */
|
|
5075
|
+
return /* @__PURE__ */ React62.createElement(HMobiledataOutlined, { fontSize: "small" });
|
|
5075
5076
|
case "Text":
|
|
5076
|
-
return /* @__PURE__ */
|
|
5077
|
+
return /* @__PURE__ */ React62.createElement(NotesOutlined, { fontSize: "small" });
|
|
5077
5078
|
case "Button":
|
|
5078
|
-
return /* @__PURE__ */
|
|
5079
|
+
return /* @__PURE__ */ React62.createElement(SmartButtonOutlined, { fontSize: "small" });
|
|
5079
5080
|
case "Image":
|
|
5080
|
-
return /* @__PURE__ */
|
|
5081
|
+
return /* @__PURE__ */ React62.createElement(ImageOutlined, { fontSize: "small" });
|
|
5081
5082
|
case "Avatar":
|
|
5082
|
-
return /* @__PURE__ */
|
|
5083
|
+
return /* @__PURE__ */ React62.createElement(AccountCircleOutlined, { fontSize: "small" });
|
|
5083
5084
|
case "Signature":
|
|
5084
|
-
return /* @__PURE__ */
|
|
5085
|
+
return /* @__PURE__ */ React62.createElement(ContactMailOutlined, { fontSize: "small" });
|
|
5085
5086
|
case "Divider":
|
|
5086
|
-
return /* @__PURE__ */
|
|
5087
|
+
return /* @__PURE__ */ React62.createElement(HorizontalRuleOutlined, { fontSize: "small" });
|
|
5087
5088
|
case "Spacer":
|
|
5088
|
-
return /* @__PURE__ */
|
|
5089
|
+
return /* @__PURE__ */ React62.createElement(Crop32Outlined, { fontSize: "small" });
|
|
5089
5090
|
case "Html":
|
|
5090
|
-
return /* @__PURE__ */
|
|
5091
|
+
return /* @__PURE__ */ React62.createElement(HtmlOutlined, { fontSize: "small" });
|
|
5091
5092
|
case "Container":
|
|
5092
|
-
return /* @__PURE__ */
|
|
5093
|
+
return /* @__PURE__ */ React62.createElement(LibraryAddOutlined, { fontSize: "small" });
|
|
5093
5094
|
case "ColumnsContainer":
|
|
5094
|
-
return /* @__PURE__ */
|
|
5095
|
+
return /* @__PURE__ */ React62.createElement(ViewColumnOutlined, { fontSize: "small" });
|
|
5095
5096
|
default:
|
|
5096
|
-
return /* @__PURE__ */
|
|
5097
|
+
return /* @__PURE__ */ React62.createElement(BusinessOutlined, { fontSize: "small" });
|
|
5097
5098
|
}
|
|
5098
5099
|
}
|
|
5099
5100
|
function previewText(text) {
|
|
@@ -5123,7 +5124,7 @@ function buildNode(id, doc, ctx) {
|
|
|
5123
5124
|
).filter((n) => n !== null);
|
|
5124
5125
|
return {
|
|
5125
5126
|
id,
|
|
5126
|
-
label: "Canvas",
|
|
5127
|
+
label: t("outline.canvas", "Canvas"),
|
|
5127
5128
|
icon: iconForType("EmailLayout"),
|
|
5128
5129
|
children,
|
|
5129
5130
|
containerChildrenRef: parentForChildren
|
|
@@ -5171,7 +5172,7 @@ function buildNode(id, doc, ctx) {
|
|
|
5171
5172
|
id: `${id}::col${colIdx}`,
|
|
5172
5173
|
label: `Column ${colIdx + 1}`,
|
|
5173
5174
|
preview: colChildren.length === 1 ? "1 child" : `${colChildren.length} children`,
|
|
5174
|
-
icon: /* @__PURE__ */
|
|
5175
|
+
icon: /* @__PURE__ */ React62.createElement(ViewColumnSharp, { fontSize: "small", sx: { opacity: 0.6 } }),
|
|
5175
5176
|
children: colChildren,
|
|
5176
5177
|
containerChildrenRef: parentForCol
|
|
5177
5178
|
});
|
|
@@ -5233,7 +5234,7 @@ function OutlinePanel() {
|
|
|
5233
5234
|
setSelectedBlockId(payload.sourceId);
|
|
5234
5235
|
}
|
|
5235
5236
|
};
|
|
5236
|
-
return /* @__PURE__ */
|
|
5237
|
+
return /* @__PURE__ */ React62.createElement(Box, null, /* @__PURE__ */ React62.createElement(Typography, { variant: "subtitle2", component: "h2", sx: { fontWeight: "bold", mb: 0.5, px: 0.5 } }, t("outline.title", "Outline")), /* @__PURE__ */ React62.createElement(Typography, { variant: "caption", sx: { display: "block", color: "text.secondary", px: 0.5, mb: 1 } }, t("outline.hint", "Click a row to select. Drag a row to reorder or move it into a container.")), tree ? /* @__PURE__ */ React62.createElement(
|
|
5237
5238
|
OutlineRow,
|
|
5238
5239
|
{
|
|
5239
5240
|
node: tree,
|
|
@@ -5244,7 +5245,7 @@ function OutlinePanel() {
|
|
|
5244
5245
|
setDragging,
|
|
5245
5246
|
performMove
|
|
5246
5247
|
}
|
|
5247
|
-
) : /* @__PURE__ */
|
|
5248
|
+
) : /* @__PURE__ */ React62.createElement(Typography, { variant: "body2", sx: { color: "text.secondary", px: 0.5 } }, "Nothing to outline."));
|
|
5248
5249
|
}
|
|
5249
5250
|
function OutlineRow({
|
|
5250
5251
|
node,
|
|
@@ -5330,7 +5331,7 @@ function OutlineRow({
|
|
|
5330
5331
|
const patch = buildMovePatch(document2, node.id, node.parent, node.parent, nextIndex + (delta > 0 ? 1 : 0));
|
|
5331
5332
|
if (patch) setDocument(patch);
|
|
5332
5333
|
};
|
|
5333
|
-
return /* @__PURE__ */
|
|
5334
|
+
return /* @__PURE__ */ React62.createElement(React62.Fragment, null, /* @__PURE__ */ React62.createElement(Box, { sx: { position: "relative" } }, dropPos === "before" && /* @__PURE__ */ React62.createElement(DropLine, { depth }), /* @__PURE__ */ React62.createElement(
|
|
5334
5335
|
Stack,
|
|
5335
5336
|
{
|
|
5336
5337
|
direction: "row",
|
|
@@ -5363,7 +5364,7 @@ function OutlineRow({
|
|
|
5363
5364
|
userSelect: "none"
|
|
5364
5365
|
}
|
|
5365
5366
|
},
|
|
5366
|
-
hasChildren ? /* @__PURE__ */
|
|
5367
|
+
hasChildren ? /* @__PURE__ */ React62.createElement(
|
|
5367
5368
|
Box,
|
|
5368
5369
|
{
|
|
5369
5370
|
role: "button",
|
|
@@ -5374,9 +5375,9 @@ function OutlineRow({
|
|
|
5374
5375
|
},
|
|
5375
5376
|
sx: { display: "flex", alignItems: "center", cursor: "pointer" }
|
|
5376
5377
|
},
|
|
5377
|
-
expanded ? /* @__PURE__ */
|
|
5378
|
-
) : /* @__PURE__ */
|
|
5379
|
-
/* @__PURE__ */
|
|
5378
|
+
expanded ? /* @__PURE__ */ React62.createElement(ExpandMore, { fontSize: "small" }) : /* @__PURE__ */ React62.createElement(ChevronRight, { fontSize: "small" })
|
|
5379
|
+
) : /* @__PURE__ */ React62.createElement(Box, { sx: { width: 20 } }),
|
|
5380
|
+
/* @__PURE__ */ React62.createElement(
|
|
5380
5381
|
Box,
|
|
5381
5382
|
{
|
|
5382
5383
|
sx: {
|
|
@@ -5388,7 +5389,7 @@ function OutlineRow({
|
|
|
5388
5389
|
},
|
|
5389
5390
|
node.icon
|
|
5390
5391
|
),
|
|
5391
|
-
/* @__PURE__ */
|
|
5392
|
+
/* @__PURE__ */ React62.createElement(
|
|
5392
5393
|
Typography,
|
|
5393
5394
|
{
|
|
5394
5395
|
variant: "body2",
|
|
@@ -5400,7 +5401,7 @@ function OutlineRow({
|
|
|
5400
5401
|
},
|
|
5401
5402
|
node.label
|
|
5402
5403
|
),
|
|
5403
|
-
node.preview && /* @__PURE__ */
|
|
5404
|
+
node.preview && /* @__PURE__ */ React62.createElement(
|
|
5404
5405
|
Typography,
|
|
5405
5406
|
{
|
|
5406
5407
|
variant: "body2",
|
|
@@ -5416,7 +5417,7 @@ function OutlineRow({
|
|
|
5416
5417
|
"\u2014 ",
|
|
5417
5418
|
node.preview
|
|
5418
5419
|
),
|
|
5419
|
-
canMove && /* @__PURE__ */
|
|
5420
|
+
canMove && /* @__PURE__ */ React62.createElement(
|
|
5420
5421
|
Box,
|
|
5421
5422
|
{
|
|
5422
5423
|
className: "outline-move-btns",
|
|
@@ -5427,7 +5428,7 @@ function OutlineRow({
|
|
|
5427
5428
|
transition: "opacity 120ms"
|
|
5428
5429
|
}
|
|
5429
5430
|
},
|
|
5430
|
-
/* @__PURE__ */
|
|
5431
|
+
/* @__PURE__ */ React62.createElement(Tooltip, { title: "Move up" }, /* @__PURE__ */ React62.createElement("span", null, /* @__PURE__ */ React62.createElement(
|
|
5431
5432
|
IconButton,
|
|
5432
5433
|
{
|
|
5433
5434
|
size: "small",
|
|
@@ -5439,9 +5440,9 @@ function OutlineRow({
|
|
|
5439
5440
|
"aria-label": `Move ${node.label} up`,
|
|
5440
5441
|
sx: { p: 0.25 }
|
|
5441
5442
|
},
|
|
5442
|
-
/* @__PURE__ */
|
|
5443
|
+
/* @__PURE__ */ React62.createElement(KeyboardArrowUp, { fontSize: "small" })
|
|
5443
5444
|
))),
|
|
5444
|
-
/* @__PURE__ */
|
|
5445
|
+
/* @__PURE__ */ React62.createElement(Tooltip, { title: "Move down" }, /* @__PURE__ */ React62.createElement("span", null, /* @__PURE__ */ React62.createElement(
|
|
5445
5446
|
IconButton,
|
|
5446
5447
|
{
|
|
5447
5448
|
size: "small",
|
|
@@ -5453,10 +5454,10 @@ function OutlineRow({
|
|
|
5453
5454
|
"aria-label": `Move ${node.label} down`,
|
|
5454
5455
|
sx: { p: 0.25 }
|
|
5455
5456
|
},
|
|
5456
|
-
/* @__PURE__ */
|
|
5457
|
+
/* @__PURE__ */ React62.createElement(KeyboardArrowDown, { fontSize: "small" })
|
|
5457
5458
|
)))
|
|
5458
5459
|
)
|
|
5459
|
-
), dropPos === "after" && /* @__PURE__ */
|
|
5460
|
+
), dropPos === "after" && /* @__PURE__ */ React62.createElement(DropLine, { depth })), hasChildren && expanded && /* @__PURE__ */ React62.createElement(Box, null, node.children.map((child) => /* @__PURE__ */ React62.createElement(
|
|
5460
5461
|
OutlineRow,
|
|
5461
5462
|
{
|
|
5462
5463
|
key: child.id,
|
|
@@ -5471,7 +5472,7 @@ function OutlineRow({
|
|
|
5471
5472
|
))));
|
|
5472
5473
|
}
|
|
5473
5474
|
function DropLine({ depth }) {
|
|
5474
|
-
return /* @__PURE__ */
|
|
5475
|
+
return /* @__PURE__ */ React62.createElement(
|
|
5475
5476
|
Box,
|
|
5476
5477
|
{
|
|
5477
5478
|
sx: {
|
|
@@ -5479,7 +5480,7 @@ function DropLine({ depth }) {
|
|
|
5479
5480
|
height: 0
|
|
5480
5481
|
}
|
|
5481
5482
|
},
|
|
5482
|
-
/* @__PURE__ */
|
|
5483
|
+
/* @__PURE__ */ React62.createElement(
|
|
5483
5484
|
Box,
|
|
5484
5485
|
{
|
|
5485
5486
|
sx: {
|
|
@@ -5511,7 +5512,7 @@ function NewTemplatePickerDialog({
|
|
|
5511
5512
|
const [busy, setBusy] = useState(false);
|
|
5512
5513
|
useEffect(() => {
|
|
5513
5514
|
if (open) {
|
|
5514
|
-
setName(defaultName != null ? defaultName : kind === "sample" ? "New sample" : "New template");
|
|
5515
|
+
setName(defaultName != null ? defaultName : t(kind === "sample" ? "drawer.new-sample" : "drawer.new-template", kind === "sample" ? "New sample" : "New template"));
|
|
5515
5516
|
setSelectedStarter(null);
|
|
5516
5517
|
setError(null);
|
|
5517
5518
|
setBusy(false);
|
|
@@ -5519,9 +5520,9 @@ function NewTemplatePickerDialog({
|
|
|
5519
5520
|
}, [open, defaultName, kind]);
|
|
5520
5521
|
const validate = () => {
|
|
5521
5522
|
const trimmed = name.trim();
|
|
5522
|
-
if (!trimmed) return "Name is required";
|
|
5523
|
+
if (!trimmed) return t("picker.error-name-required", "Name is required");
|
|
5523
5524
|
if (existingSlugs.some((s) => s.toLowerCase() === trimmed.toLowerCase())) {
|
|
5524
|
-
return kind === "sample" ? "A sample with this name already exists" : "A template with this name already exists";
|
|
5525
|
+
return kind === "sample" ? t("picker.error-sample-taken", "A sample with this name already exists") : t("picker.error-template-taken", "A template with this name already exists");
|
|
5525
5526
|
}
|
|
5526
5527
|
return null;
|
|
5527
5528
|
};
|
|
@@ -5540,7 +5541,7 @@ function NewTemplatePickerDialog({
|
|
|
5540
5541
|
}
|
|
5541
5542
|
});
|
|
5542
5543
|
const pickable = samples.filter((s) => s.id !== "empty-email");
|
|
5543
|
-
return /* @__PURE__ */
|
|
5544
|
+
return /* @__PURE__ */ React62.createElement(Dialog, { open, onClose: busy ? void 0 : onClose, maxWidth: "sm", fullWidth: true }, /* @__PURE__ */ React62.createElement(DialogTitle, null, kind === "sample" ? t("picker.title-sample", "New sample") : t("picker.title-template", "New template")), /* @__PURE__ */ React62.createElement(DialogContent, { dividers: true }, /* @__PURE__ */ React62.createElement(Typography, { variant: "subtitle2", sx: { mb: 1 } }, t("picker.start-from", "Start from")), /* @__PURE__ */ React62.createElement(
|
|
5544
5545
|
List,
|
|
5545
5546
|
{
|
|
5546
5547
|
dense: true,
|
|
@@ -5554,31 +5555,32 @@ function NewTemplatePickerDialog({
|
|
|
5554
5555
|
overflowY: "auto"
|
|
5555
5556
|
}
|
|
5556
5557
|
},
|
|
5557
|
-
/* @__PURE__ */
|
|
5558
|
+
/* @__PURE__ */ React62.createElement(
|
|
5558
5559
|
ListItemButton,
|
|
5559
5560
|
{
|
|
5560
5561
|
selected: selectedStarter === null,
|
|
5561
5562
|
onClick: () => setSelectedStarter(null)
|
|
5562
5563
|
},
|
|
5563
|
-
/* @__PURE__ */
|
|
5564
|
+
/* @__PURE__ */ React62.createElement(Box, { sx: { display: "flex", alignItems: "center", gap: 1.5, flex: 1 } }, /* @__PURE__ */ React62.createElement(InsertDriveFileOutlined, { fontSize: "small", sx: { color: "text.secondary" } }), /* @__PURE__ */ React62.createElement(ListItemText, { primary: t("picker.blank-title", "Blank"), secondary: t("picker.blank-desc", "Start from an empty email") }))
|
|
5564
5565
|
),
|
|
5565
|
-
pickable.map((s) => /* @__PURE__ */
|
|
5566
|
+
pickable.map((s) => /* @__PURE__ */ React62.createElement(
|
|
5566
5567
|
ListItemButton,
|
|
5567
5568
|
{
|
|
5568
5569
|
key: s.id,
|
|
5569
5570
|
selected: selectedStarter === s.id,
|
|
5570
5571
|
onClick: () => setSelectedStarter(s.id)
|
|
5571
5572
|
},
|
|
5572
|
-
/* @__PURE__ */
|
|
5573
|
+
/* @__PURE__ */ React62.createElement(Box, { sx: { display: "flex", alignItems: "center", gap: 1.5, flex: 1 } }, /* @__PURE__ */ React62.createElement(DescriptionOutlined, { fontSize: "small", sx: { color: "text.secondary" } }), /* @__PURE__ */ React62.createElement(ListItemText, { primary: s.slug, secondary: s.description }))
|
|
5573
5574
|
))
|
|
5574
|
-
), /* @__PURE__ */
|
|
5575
|
+
), /* @__PURE__ */ React62.createElement(
|
|
5575
5576
|
TextField,
|
|
5576
5577
|
{
|
|
5577
5578
|
autoFocus: true,
|
|
5578
5579
|
fullWidth: true,
|
|
5579
5580
|
size: "small",
|
|
5580
|
-
label: "Name",
|
|
5581
|
+
label: t("rename.name-label", "Name"),
|
|
5581
5582
|
value: name,
|
|
5583
|
+
onFocus: (e) => e.currentTarget.select(),
|
|
5582
5584
|
onChange: (e) => {
|
|
5583
5585
|
setName(e.target.value);
|
|
5584
5586
|
if (error) setError(null);
|
|
@@ -5590,7 +5592,7 @@ function NewTemplatePickerDialog({
|
|
|
5590
5592
|
helperText: error != null ? error : " ",
|
|
5591
5593
|
disabled: busy
|
|
5592
5594
|
}
|
|
5593
|
-
)), /* @__PURE__ */
|
|
5595
|
+
)), /* @__PURE__ */ React62.createElement(DialogActions, null, /* @__PURE__ */ React62.createElement(Button$1, { onClick: onClose, disabled: busy }, t("common.cancel", "Cancel")), /* @__PURE__ */ React62.createElement(Button$1, { variant: "contained", onClick: handleCreate, disabled: busy }, busy ? t("picker.creating", "Creating\u2026") : kind === "sample" ? t("picker.create-sample", "Create sample") : t("picker.create-template", "Create template"))));
|
|
5594
5596
|
}
|
|
5595
5597
|
function RenameDialog({
|
|
5596
5598
|
open,
|
|
@@ -5629,12 +5631,12 @@ function RenameDialog({
|
|
|
5629
5631
|
const handleSubmit = () => __async(null, null, function* () {
|
|
5630
5632
|
const trimmedSlug = slug.trim();
|
|
5631
5633
|
if (!trimmedSlug) {
|
|
5632
|
-
setError("Please enter a name");
|
|
5634
|
+
setError(t("rename.error-empty", "Please enter a name"));
|
|
5633
5635
|
return;
|
|
5634
5636
|
}
|
|
5635
5637
|
const slugChanged = trimmedSlug !== currentSlug;
|
|
5636
5638
|
if (slugChanged && existingSlugs.some((s) => s.toLowerCase() === trimmedSlug.toLowerCase())) {
|
|
5637
|
-
setError("A template with this name already exists");
|
|
5639
|
+
setError(t("rename.error-taken", "A template with this name already exists"));
|
|
5638
5640
|
return;
|
|
5639
5641
|
}
|
|
5640
5642
|
if (!slugChanged && tagsUnchanged) {
|
|
@@ -5647,17 +5649,17 @@ function RenameDialog({
|
|
|
5647
5649
|
onClose();
|
|
5648
5650
|
} catch (e) {
|
|
5649
5651
|
console.error("Error updating template details:", e);
|
|
5650
|
-
setError("Failed to update template details");
|
|
5652
|
+
setError(t("rename.error-generic", "Failed to update template details"));
|
|
5651
5653
|
} finally {
|
|
5652
5654
|
setSubmitting(false);
|
|
5653
5655
|
}
|
|
5654
5656
|
});
|
|
5655
|
-
return /* @__PURE__ */
|
|
5657
|
+
return /* @__PURE__ */ React62.createElement(Dialog, { open, onClose: submitting ? void 0 : onClose, maxWidth: "sm", fullWidth: true }, /* @__PURE__ */ React62.createElement(DialogTitle, null, t("rename.title", "Edit details")), /* @__PURE__ */ React62.createElement(DialogContent, null, /* @__PURE__ */ React62.createElement(
|
|
5656
5658
|
TextField,
|
|
5657
5659
|
{
|
|
5658
5660
|
autoFocus: true,
|
|
5659
5661
|
margin: "dense",
|
|
5660
|
-
label: "Name",
|
|
5662
|
+
label: t("rename.name-label", "Name"),
|
|
5661
5663
|
fullWidth: true,
|
|
5662
5664
|
variant: "outlined",
|
|
5663
5665
|
value: slug,
|
|
@@ -5672,7 +5674,7 @@ function RenameDialog({
|
|
|
5672
5674
|
if (e.key === "Enter" && !submitting) handleSubmit();
|
|
5673
5675
|
}
|
|
5674
5676
|
}
|
|
5675
|
-
), /* @__PURE__ */
|
|
5677
|
+
), /* @__PURE__ */ React62.createElement(Typography, { variant: "caption", sx: { color: "text.secondary", display: "block", mt: 1, mb: 0.5 } }, t("rename.tags", "Tags")), tags.length > 0 ? /* @__PURE__ */ React62.createElement(Stack, { direction: "row", spacing: 0.5, sx: { flexWrap: "wrap", gap: 0.5, mb: 1 } }, tags.map((tag) => /* @__PURE__ */ React62.createElement(
|
|
5676
5678
|
Chip,
|
|
5677
5679
|
{
|
|
5678
5680
|
key: tag,
|
|
@@ -5680,12 +5682,12 @@ function RenameDialog({
|
|
|
5680
5682
|
size: "small",
|
|
5681
5683
|
onDelete: submitting ? void 0 : () => removeTag(tag)
|
|
5682
5684
|
}
|
|
5683
|
-
))) : /* @__PURE__ */
|
|
5685
|
+
))) : /* @__PURE__ */ React62.createElement(Typography, { variant: "caption", sx: { color: "text.disabled", display: "block", mb: 1 } }, t("rename.no-tags", "No tags yet.")), /* @__PURE__ */ React62.createElement(
|
|
5684
5686
|
TextField,
|
|
5685
5687
|
{
|
|
5686
5688
|
size: "small",
|
|
5687
5689
|
fullWidth: true,
|
|
5688
|
-
placeholder: "Add a tag and press Enter",
|
|
5690
|
+
placeholder: t("rename.tag-placeholder", "Add a tag and press Enter"),
|
|
5689
5691
|
value: tagInput,
|
|
5690
5692
|
onChange: (e) => setTagInput(e.target.value),
|
|
5691
5693
|
disabled: submitting,
|
|
@@ -5699,27 +5701,27 @@ function RenameDialog({
|
|
|
5699
5701
|
}
|
|
5700
5702
|
},
|
|
5701
5703
|
InputProps: {
|
|
5702
|
-
endAdornment: /* @__PURE__ */
|
|
5704
|
+
endAdornment: /* @__PURE__ */ React62.createElement(InputAdornment, { position: "end" }, /* @__PURE__ */ React62.createElement(
|
|
5703
5705
|
Button$1,
|
|
5704
5706
|
{
|
|
5705
5707
|
size: "small",
|
|
5706
5708
|
onClick: addTag,
|
|
5707
5709
|
disabled: !tagInput.trim() || submitting,
|
|
5708
|
-
startIcon: /* @__PURE__ */
|
|
5710
|
+
startIcon: /* @__PURE__ */ React62.createElement(AddOutlined, { fontSize: "small" }),
|
|
5709
5711
|
sx: { textTransform: "none" }
|
|
5710
5712
|
},
|
|
5711
|
-
"Add"
|
|
5713
|
+
t("common.add", "Add")
|
|
5712
5714
|
))
|
|
5713
5715
|
}
|
|
5714
5716
|
}
|
|
5715
|
-
), /* @__PURE__ */
|
|
5717
|
+
), /* @__PURE__ */ React62.createElement(Box, { sx: { minHeight: 8 } })), /* @__PURE__ */ React62.createElement(DialogActions, null, /* @__PURE__ */ React62.createElement(Button$1, { onClick: onClose, disabled: submitting }, t("common.cancel", "Cancel")), /* @__PURE__ */ React62.createElement(
|
|
5716
5718
|
Button$1,
|
|
5717
5719
|
{
|
|
5718
5720
|
onClick: handleSubmit,
|
|
5719
5721
|
variant: "contained",
|
|
5720
5722
|
disabled: !slug.trim() || submitting
|
|
5721
5723
|
},
|
|
5722
|
-
submitting ? "Saving\u2026" : "Save"
|
|
5724
|
+
submitting ? t("common.saving", "Saving\u2026") : t("common.save", "Save")
|
|
5723
5725
|
)));
|
|
5724
5726
|
}
|
|
5725
5727
|
function SaveTemplateDialog({
|
|
@@ -5728,7 +5730,8 @@ function SaveTemplateDialog({
|
|
|
5728
5730
|
onSave,
|
|
5729
5731
|
onNameChange,
|
|
5730
5732
|
defaultName = "",
|
|
5731
|
-
error: externalError = null
|
|
5733
|
+
error: externalError = null,
|
|
5734
|
+
mode = "save-as"
|
|
5732
5735
|
}) {
|
|
5733
5736
|
const [templateName, setTemplateName] = useState(defaultName);
|
|
5734
5737
|
const [internalError, setInternalError] = useState("");
|
|
@@ -5752,7 +5755,7 @@ function SaveTemplateDialog({
|
|
|
5752
5755
|
};
|
|
5753
5756
|
const handleSave = () => __async(null, null, function* () {
|
|
5754
5757
|
if (!templateName.trim()) {
|
|
5755
|
-
setInternalError("Please enter a template name");
|
|
5758
|
+
setInternalError(t("save-dialog.error-empty-name", "Please enter a template name"));
|
|
5756
5759
|
return;
|
|
5757
5760
|
}
|
|
5758
5761
|
setIsSubmitting(true);
|
|
@@ -5781,7 +5784,7 @@ function SaveTemplateDialog({
|
|
|
5781
5784
|
setInternalError("");
|
|
5782
5785
|
onClose();
|
|
5783
5786
|
};
|
|
5784
|
-
return /* @__PURE__ */
|
|
5787
|
+
return /* @__PURE__ */ React62.createElement(
|
|
5785
5788
|
Dialog,
|
|
5786
5789
|
{
|
|
5787
5790
|
open,
|
|
@@ -5789,19 +5792,20 @@ function SaveTemplateDialog({
|
|
|
5789
5792
|
maxWidth: "sm",
|
|
5790
5793
|
fullWidth: true
|
|
5791
5794
|
},
|
|
5792
|
-
/* @__PURE__ */
|
|
5793
|
-
/* @__PURE__ */
|
|
5795
|
+
/* @__PURE__ */ React62.createElement(DialogTitle, null, mode === "new" ? t("save-dialog.title-new", "Create a new template") : t("save-dialog.title", "Save as a new template")),
|
|
5796
|
+
/* @__PURE__ */ React62.createElement(DialogContent, null, /* @__PURE__ */ React62.createElement(Box, { sx: { pt: 1 } }, /* @__PURE__ */ React62.createElement(
|
|
5794
5797
|
TextField,
|
|
5795
5798
|
{
|
|
5796
5799
|
autoFocus: true,
|
|
5797
5800
|
margin: "dense",
|
|
5798
5801
|
id: "template-name",
|
|
5799
|
-
label: "Template Name",
|
|
5802
|
+
label: t("save-dialog.name-label", "Template Name"),
|
|
5800
5803
|
type: "text",
|
|
5801
5804
|
fullWidth: true,
|
|
5802
5805
|
variant: "outlined",
|
|
5803
5806
|
value: templateName,
|
|
5804
5807
|
onChange: handleNameChange,
|
|
5808
|
+
onFocus: (e) => e.currentTarget.select(),
|
|
5805
5809
|
error: !!displayError,
|
|
5806
5810
|
helperText: displayError,
|
|
5807
5811
|
onKeyPress: (e) => {
|
|
@@ -5812,7 +5816,7 @@ function SaveTemplateDialog({
|
|
|
5812
5816
|
disabled: isSubmitting
|
|
5813
5817
|
}
|
|
5814
5818
|
))),
|
|
5815
|
-
/* @__PURE__ */
|
|
5819
|
+
/* @__PURE__ */ React62.createElement(DialogActions, null, /* @__PURE__ */ React62.createElement(Button$1, { onClick: handleCancel, disabled: isSubmitting }, t("common.cancel", "Cancel")), /* @__PURE__ */ React62.createElement(
|
|
5816
5820
|
Button$1,
|
|
5817
5821
|
{
|
|
5818
5822
|
onClick: handleSave,
|
|
@@ -5820,7 +5824,7 @@ function SaveTemplateDialog({
|
|
|
5820
5824
|
color: "primary",
|
|
5821
5825
|
disabled: !templateName.trim() || !!displayError || isSubmitting
|
|
5822
5826
|
},
|
|
5823
|
-
isSubmitting ? "Saving..." : "
|
|
5827
|
+
isSubmitting ? t("save-dialog.saving", "Saving...") : mode === "new" ? t("save-dialog.create", "Create") : t("save-dialog.save", "Save")
|
|
5824
5828
|
))
|
|
5825
5829
|
);
|
|
5826
5830
|
}
|
|
@@ -5842,12 +5846,12 @@ var empty_email_message_default = EMPTY_EMAIL_MESSAGE;
|
|
|
5842
5846
|
|
|
5843
5847
|
// src/app/templates-drawer/index.tsx
|
|
5844
5848
|
var SAMPLES_DRAWER_WIDTH = 320;
|
|
5845
|
-
var
|
|
5849
|
+
var buildEmptyTemplate = () => ({
|
|
5846
5850
|
id: "empty-email",
|
|
5847
|
-
slug: "Empty email",
|
|
5851
|
+
slug: t("empty.slug", "Empty email"),
|
|
5848
5852
|
kind: "sample",
|
|
5849
|
-
description: "A blank email template to start from scratch"
|
|
5850
|
-
};
|
|
5853
|
+
description: t("empty.description", "A blank email template to start from scratch")
|
|
5854
|
+
});
|
|
5851
5855
|
var SORT_OPTIONS = [
|
|
5852
5856
|
{ value: "updatedAt", labelKey: "sort.last-updated", fallback: "Last updated" },
|
|
5853
5857
|
{ value: "createdAt", labelKey: "sort.recently-created", fallback: "Recently created" },
|
|
@@ -5882,7 +5886,7 @@ function SamplesDrawer({
|
|
|
5882
5886
|
const samplesDrawerOpen = useSamplesDrawerOpen();
|
|
5883
5887
|
const { setCurrentTemplate, loadTemplate: ctxLoadTemplate } = useEmailEditor();
|
|
5884
5888
|
const { showMessage } = useSnackbar();
|
|
5885
|
-
const [samples, setSamples] = useState([
|
|
5889
|
+
const [samples, setSamples] = useState([buildEmptyTemplate()]);
|
|
5886
5890
|
const [templates, setTemplates] = useState([]);
|
|
5887
5891
|
const [loadingSamples, setLoadingSamples] = useState(false);
|
|
5888
5892
|
const [loadingTemplates, setLoadingTemplates] = useState(false);
|
|
@@ -5911,10 +5915,10 @@ function SamplesDrawer({
|
|
|
5911
5915
|
loadSamples().then((results) => {
|
|
5912
5916
|
const normalized = withKind(results, "sample");
|
|
5913
5917
|
const existingEmpty = normalized.find((s) => s.id === "empty-email");
|
|
5914
|
-
setSamples(existingEmpty ? normalized : [
|
|
5918
|
+
setSamples(existingEmpty ? normalized : [buildEmptyTemplate(), ...normalized]);
|
|
5915
5919
|
}).catch((error) => {
|
|
5916
5920
|
console.error("Failed to load samples:", error);
|
|
5917
|
-
setSamples([
|
|
5921
|
+
setSamples([buildEmptyTemplate()]);
|
|
5918
5922
|
}).finally(() => setLoadingSamples(false));
|
|
5919
5923
|
}, [enabled, samplesDrawerOpen, loadSamples]);
|
|
5920
5924
|
const refreshTemplates = () => __async(null, null, function* () {
|
|
@@ -6133,7 +6137,7 @@ function SamplesDrawer({
|
|
|
6133
6137
|
return null;
|
|
6134
6138
|
}
|
|
6135
6139
|
const existingSlugs = templates.map((t2) => t2.slug);
|
|
6136
|
-
return /* @__PURE__ */
|
|
6140
|
+
return /* @__PURE__ */ React62.createElement(React62.Fragment, null, /* @__PURE__ */ React62.createElement(
|
|
6137
6141
|
Drawer,
|
|
6138
6142
|
{
|
|
6139
6143
|
variant: "persistent",
|
|
@@ -6148,7 +6152,7 @@ function SamplesDrawer({
|
|
|
6148
6152
|
transitionDuration: { enter: enterDuration, exit: exitDuration },
|
|
6149
6153
|
sx: { width: samplesDrawerOpen ? SAMPLES_DRAWER_WIDTH : 0 }
|
|
6150
6154
|
},
|
|
6151
|
-
/* @__PURE__ */
|
|
6155
|
+
/* @__PURE__ */ React62.createElement(
|
|
6152
6156
|
Stack,
|
|
6153
6157
|
{
|
|
6154
6158
|
py: 1,
|
|
@@ -6158,16 +6162,16 @@ function SamplesDrawer({
|
|
|
6158
6162
|
spacing: 1.5,
|
|
6159
6163
|
sx: { overflowY: "auto" }
|
|
6160
6164
|
},
|
|
6161
|
-
/* @__PURE__ */
|
|
6165
|
+
/* @__PURE__ */ React62.createElement(Stack, { direction: "row", alignItems: "center", justifyContent: "space-between", sx: { pt: 1 } }, /* @__PURE__ */ React62.createElement(Typography, { variant: "h6", component: "h1" }, /* @__PURE__ */ React62.createElement(Trans, { id: "drawer.library" }, "Library")), saveAs && (activeLeftTab === "templates" || activeLeftTab === "samples") && /* @__PURE__ */ React62.createElement(Tooltip, { title: activeLeftTab === "samples" ? t("drawer.new-sample", "New sample") : t("drawer.new-template", "New template") }, /* @__PURE__ */ React62.createElement(
|
|
6162
6166
|
IconButton,
|
|
6163
6167
|
{
|
|
6164
6168
|
size: "small",
|
|
6165
6169
|
onClick: () => openNewPicker(activeLeftTab === "samples" ? "sample" : "template"),
|
|
6166
6170
|
"aria-label": activeLeftTab === "samples" ? t("drawer.new-sample", "New sample") : t("drawer.new-template", "New template")
|
|
6167
6171
|
},
|
|
6168
|
-
/* @__PURE__ */
|
|
6172
|
+
/* @__PURE__ */ React62.createElement(AddOutlined, { fontSize: "small" })
|
|
6169
6173
|
))),
|
|
6170
|
-
/* @__PURE__ */
|
|
6174
|
+
/* @__PURE__ */ React62.createElement(
|
|
6171
6175
|
Tabs,
|
|
6172
6176
|
{
|
|
6173
6177
|
value: activeLeftTab,
|
|
@@ -6175,11 +6179,11 @@ function SamplesDrawer({
|
|
|
6175
6179
|
variant: "fullWidth",
|
|
6176
6180
|
sx: { minHeight: 36, "& .MuiTab-root": { minHeight: 36, minWidth: 0, px: 1, fontSize: 13 } }
|
|
6177
6181
|
},
|
|
6178
|
-
/* @__PURE__ */
|
|
6179
|
-
/* @__PURE__ */
|
|
6180
|
-
/* @__PURE__ */
|
|
6182
|
+
/* @__PURE__ */ React62.createElement(Tab, { value: "templates", label: t("drawer.tab.templates", "Templates"), disabled: !loadTemplates }),
|
|
6183
|
+
/* @__PURE__ */ React62.createElement(Tab, { value: "samples", label: t("drawer.tab.samples", "Samples") }),
|
|
6184
|
+
/* @__PURE__ */ React62.createElement(Tab, { value: "outline", label: t("drawer.tab.outline", "Outline") })
|
|
6181
6185
|
),
|
|
6182
|
-
activeLeftTab === "outline" ? /* @__PURE__ */
|
|
6186
|
+
activeLeftTab === "outline" ? /* @__PURE__ */ React62.createElement(OutlinePanel, null) : /* @__PURE__ */ React62.createElement(React62.Fragment, null, /* @__PURE__ */ React62.createElement(
|
|
6183
6187
|
TextField,
|
|
6184
6188
|
{
|
|
6185
6189
|
size: "small",
|
|
@@ -6187,10 +6191,10 @@ function SamplesDrawer({
|
|
|
6187
6191
|
value: search,
|
|
6188
6192
|
onChange: (e) => setSearch(e.target.value),
|
|
6189
6193
|
InputProps: {
|
|
6190
|
-
startAdornment: /* @__PURE__ */
|
|
6194
|
+
startAdornment: /* @__PURE__ */ React62.createElement(InputAdornment, { position: "start" }, /* @__PURE__ */ React62.createElement(SearchOutlined, { fontSize: "small" }))
|
|
6191
6195
|
}
|
|
6192
6196
|
}
|
|
6193
|
-
), /* @__PURE__ */
|
|
6197
|
+
), /* @__PURE__ */ React62.createElement(
|
|
6194
6198
|
TextField,
|
|
6195
6199
|
{
|
|
6196
6200
|
select: true,
|
|
@@ -6199,8 +6203,8 @@ function SamplesDrawer({
|
|
|
6199
6203
|
value: sortKey,
|
|
6200
6204
|
onChange: (e) => setSortKey(e.target.value)
|
|
6201
6205
|
},
|
|
6202
|
-
SORT_OPTIONS.map((opt) => /* @__PURE__ */
|
|
6203
|
-
), allTags.length > 0 && /* @__PURE__ */
|
|
6206
|
+
SORT_OPTIONS.map((opt) => /* @__PURE__ */ React62.createElement(MenuItem, { key: opt.value, value: opt.value }, t(opt.labelKey, opt.fallback)))
|
|
6207
|
+
), allTags.length > 0 && /* @__PURE__ */ React62.createElement(Stack, { direction: "row", sx: { flexWrap: "wrap", gap: 0.5 } }, /* @__PURE__ */ React62.createElement(
|
|
6204
6208
|
Chip,
|
|
6205
6209
|
{
|
|
6206
6210
|
label: t("drawer.tag.all", "All"),
|
|
@@ -6210,18 +6214,18 @@ function SamplesDrawer({
|
|
|
6210
6214
|
variant: activeTags.length === 0 ? "filled" : "outlined",
|
|
6211
6215
|
onClick: () => setActiveTags([])
|
|
6212
6216
|
}
|
|
6213
|
-
), allTags.map((tag) => /* @__PURE__ */
|
|
6217
|
+
), allTags.map((tag) => /* @__PURE__ */ React62.createElement(
|
|
6214
6218
|
Chip,
|
|
6215
6219
|
{
|
|
6216
6220
|
key: tag,
|
|
6217
|
-
label: tag,
|
|
6221
|
+
label: t(`tag.${tag}`, tag),
|
|
6218
6222
|
size: "small",
|
|
6219
6223
|
clickable: true,
|
|
6220
6224
|
color: activeTags.includes(tag) ? "primary" : "default",
|
|
6221
6225
|
variant: activeTags.includes(tag) ? "filled" : "outlined",
|
|
6222
6226
|
onClick: () => toggleTag(tag)
|
|
6223
6227
|
}
|
|
6224
|
-
))), activeLeftTab === "templates" ? /* @__PURE__ */
|
|
6228
|
+
))), activeLeftTab === "templates" ? /* @__PURE__ */ React62.createElement(Box, null, loadingTemplates ? /* @__PURE__ */ React62.createElement(Stack, { alignItems: "center", width: "100%", py: 2 }, /* @__PURE__ */ React62.createElement(CircularProgress, { size: 24 })) : templatesError ? /* @__PURE__ */ React62.createElement(Alert, { severity: "error", sx: { my: 1 } }, templatesError) : filteredTemplates.length > 0 ? /* @__PURE__ */ React62.createElement(Stack, { spacing: 0.25, sx: { width: "100%" } }, filteredTemplates.map((template) => /* @__PURE__ */ React62.createElement(
|
|
6225
6229
|
TemplateRow,
|
|
6226
6230
|
{
|
|
6227
6231
|
key: template.id,
|
|
@@ -6233,7 +6237,7 @@ function SamplesDrawer({
|
|
|
6233
6237
|
onDelete: deleteTemplate ? () => handleDelete(template) : void 0,
|
|
6234
6238
|
onPromote: setTemplateKind ? () => handleSetKind(template, "sample") : void 0
|
|
6235
6239
|
}
|
|
6236
|
-
))) : /* @__PURE__ */
|
|
6240
|
+
))) : /* @__PURE__ */ React62.createElement(Typography, { variant: "body2", sx: { color: "text.secondary", py: 1 } }, templateRows.length === 0 ? t("drawer.no-templates", "No saved templates yet") : t("drawer.no-templates-match", "No templates match your filters"))) : /* @__PURE__ */ React62.createElement(Box, null, loadingSamples ? /* @__PURE__ */ React62.createElement(Stack, { alignItems: "center", width: "100%", py: 2 }, /* @__PURE__ */ React62.createElement(CircularProgress, { size: 24 })) : filteredSamples.length > 0 ? /* @__PURE__ */ React62.createElement(Stack, { spacing: 0.25, sx: { width: "100%" } }, filteredSamples.map((sample) => /* @__PURE__ */ React62.createElement(
|
|
6237
6241
|
TemplateRow,
|
|
6238
6242
|
{
|
|
6239
6243
|
key: sample.id,
|
|
@@ -6245,9 +6249,9 @@ function SamplesDrawer({
|
|
|
6245
6249
|
onDelete: deleteTemplate ? () => handleDelete(sample) : void 0,
|
|
6246
6250
|
onDemote: setTemplateKind ? () => handleSetKind(sample, "template") : void 0
|
|
6247
6251
|
}
|
|
6248
|
-
))) : /* @__PURE__ */
|
|
6252
|
+
))) : /* @__PURE__ */ React62.createElement(Typography, { variant: "body2", sx: { color: "text.secondary", py: 1 } }, sampleRows.length === 0 ? t("drawer.no-samples", "No samples available") : t("drawer.no-samples-match", "No samples match your filters"))))
|
|
6249
6253
|
)
|
|
6250
|
-
), renameTarget && /* @__PURE__ */
|
|
6254
|
+
), renameTarget && /* @__PURE__ */ React62.createElement(
|
|
6251
6255
|
RenameDialog,
|
|
6252
6256
|
{
|
|
6253
6257
|
open: !!renameTarget,
|
|
@@ -6257,7 +6261,7 @@ function SamplesDrawer({
|
|
|
6257
6261
|
onClose: () => setRenameTarget(null),
|
|
6258
6262
|
onSubmit: handleRenameSubmit
|
|
6259
6263
|
}
|
|
6260
|
-
), /* @__PURE__ */
|
|
6264
|
+
), /* @__PURE__ */ React62.createElement(
|
|
6261
6265
|
SaveTemplateDialog,
|
|
6262
6266
|
{
|
|
6263
6267
|
open: !!pendingSaveAs,
|
|
@@ -6270,7 +6274,7 @@ function SamplesDrawer({
|
|
|
6270
6274
|
defaultName: (_b = pendingSaveAs == null ? void 0 : pendingSaveAs.defaultName) != null ? _b : "New Template",
|
|
6271
6275
|
error: newError
|
|
6272
6276
|
}
|
|
6273
|
-
), /* @__PURE__ */
|
|
6277
|
+
), /* @__PURE__ */ React62.createElement(
|
|
6274
6278
|
NewTemplatePickerDialog,
|
|
6275
6279
|
{
|
|
6276
6280
|
open: pickerKind !== null,
|
|
@@ -6294,7 +6298,7 @@ var ICON_SX = {
|
|
|
6294
6298
|
borderColor: "cadet.300"
|
|
6295
6299
|
};
|
|
6296
6300
|
function BlockTypeButton({ label, icon, onClick }) {
|
|
6297
|
-
return /* @__PURE__ */
|
|
6301
|
+
return /* @__PURE__ */ React62.createElement(
|
|
6298
6302
|
Button$1,
|
|
6299
6303
|
{
|
|
6300
6304
|
sx: BUTTON_SX2,
|
|
@@ -6303,14 +6307,14 @@ function BlockTypeButton({ label, icon, onClick }) {
|
|
|
6303
6307
|
onClick();
|
|
6304
6308
|
}
|
|
6305
6309
|
},
|
|
6306
|
-
/* @__PURE__ */
|
|
6307
|
-
/* @__PURE__ */
|
|
6310
|
+
/* @__PURE__ */ React62.createElement(Box, { sx: ICON_SX }, icon),
|
|
6311
|
+
/* @__PURE__ */ React62.createElement(Typography, { variant: "body2" }, label)
|
|
6308
6312
|
);
|
|
6309
6313
|
}
|
|
6310
6314
|
var BUTTONS = [
|
|
6311
6315
|
{
|
|
6312
6316
|
label: "Heading",
|
|
6313
|
-
icon: /* @__PURE__ */
|
|
6317
|
+
icon: /* @__PURE__ */ React62.createElement(HMobiledataOutlined, null),
|
|
6314
6318
|
block: () => ({
|
|
6315
6319
|
type: "Heading",
|
|
6316
6320
|
data: {
|
|
@@ -6323,7 +6327,7 @@ var BUTTONS = [
|
|
|
6323
6327
|
},
|
|
6324
6328
|
{
|
|
6325
6329
|
label: "Text",
|
|
6326
|
-
icon: /* @__PURE__ */
|
|
6330
|
+
icon: /* @__PURE__ */ React62.createElement(NotesOutlined, null),
|
|
6327
6331
|
block: () => ({
|
|
6328
6332
|
type: "Text",
|
|
6329
6333
|
data: {
|
|
@@ -6337,7 +6341,7 @@ var BUTTONS = [
|
|
|
6337
6341
|
},
|
|
6338
6342
|
{
|
|
6339
6343
|
label: "Button",
|
|
6340
|
-
icon: /* @__PURE__ */
|
|
6344
|
+
icon: /* @__PURE__ */ React62.createElement(SmartButtonOutlined, null),
|
|
6341
6345
|
block: () => ({
|
|
6342
6346
|
type: "Button",
|
|
6343
6347
|
data: {
|
|
@@ -6351,7 +6355,7 @@ var BUTTONS = [
|
|
|
6351
6355
|
},
|
|
6352
6356
|
{
|
|
6353
6357
|
label: "Image",
|
|
6354
|
-
icon: /* @__PURE__ */
|
|
6358
|
+
icon: /* @__PURE__ */ React62.createElement(ImageOutlined, null),
|
|
6355
6359
|
block: () => ({
|
|
6356
6360
|
type: "Image",
|
|
6357
6361
|
data: {
|
|
@@ -6367,7 +6371,7 @@ var BUTTONS = [
|
|
|
6367
6371
|
},
|
|
6368
6372
|
{
|
|
6369
6373
|
label: "Avatar",
|
|
6370
|
-
icon: /* @__PURE__ */
|
|
6374
|
+
icon: /* @__PURE__ */ React62.createElement(AccountCircleOutlined, null),
|
|
6371
6375
|
block: () => ({
|
|
6372
6376
|
type: "Avatar",
|
|
6373
6377
|
data: {
|
|
@@ -6381,7 +6385,7 @@ var BUTTONS = [
|
|
|
6381
6385
|
},
|
|
6382
6386
|
{
|
|
6383
6387
|
label: "Personal Signature",
|
|
6384
|
-
icon: /* @__PURE__ */
|
|
6388
|
+
icon: /* @__PURE__ */ React62.createElement(ContactMailOutlined, null),
|
|
6385
6389
|
block: () => ({
|
|
6386
6390
|
type: "Signature",
|
|
6387
6391
|
data: {
|
|
@@ -6403,7 +6407,7 @@ var BUTTONS = [
|
|
|
6403
6407
|
},
|
|
6404
6408
|
{
|
|
6405
6409
|
label: "Company Signature",
|
|
6406
|
-
icon: /* @__PURE__ */
|
|
6410
|
+
icon: /* @__PURE__ */ React62.createElement(BusinessOutlined, null),
|
|
6407
6411
|
block: () => ({
|
|
6408
6412
|
type: "Signature",
|
|
6409
6413
|
data: {
|
|
@@ -6423,7 +6427,7 @@ var BUTTONS = [
|
|
|
6423
6427
|
},
|
|
6424
6428
|
{
|
|
6425
6429
|
label: "Divider",
|
|
6426
|
-
icon: /* @__PURE__ */
|
|
6430
|
+
icon: /* @__PURE__ */ React62.createElement(HorizontalRuleOutlined, null),
|
|
6427
6431
|
block: () => ({
|
|
6428
6432
|
type: "Divider",
|
|
6429
6433
|
data: {
|
|
@@ -6436,7 +6440,7 @@ var BUTTONS = [
|
|
|
6436
6440
|
},
|
|
6437
6441
|
{
|
|
6438
6442
|
label: "Spacer",
|
|
6439
|
-
icon: /* @__PURE__ */
|
|
6443
|
+
icon: /* @__PURE__ */ React62.createElement(Crop32Outlined, null),
|
|
6440
6444
|
block: () => ({
|
|
6441
6445
|
type: "Spacer",
|
|
6442
6446
|
data: {}
|
|
@@ -6444,7 +6448,7 @@ var BUTTONS = [
|
|
|
6444
6448
|
},
|
|
6445
6449
|
{
|
|
6446
6450
|
label: "Html",
|
|
6447
|
-
icon: /* @__PURE__ */
|
|
6451
|
+
icon: /* @__PURE__ */ React62.createElement(HtmlOutlined, null),
|
|
6448
6452
|
block: () => ({
|
|
6449
6453
|
type: "Html",
|
|
6450
6454
|
data: {
|
|
@@ -6459,7 +6463,7 @@ var BUTTONS = [
|
|
|
6459
6463
|
},
|
|
6460
6464
|
{
|
|
6461
6465
|
label: "Columns",
|
|
6462
|
-
icon: /* @__PURE__ */
|
|
6466
|
+
icon: /* @__PURE__ */ React62.createElement(ViewColumnOutlined, null),
|
|
6463
6467
|
block: () => ({
|
|
6464
6468
|
type: "ColumnsContainer",
|
|
6465
6469
|
data: {
|
|
@@ -6474,7 +6478,7 @@ var BUTTONS = [
|
|
|
6474
6478
|
},
|
|
6475
6479
|
{
|
|
6476
6480
|
label: "Container",
|
|
6477
|
-
icon: /* @__PURE__ */
|
|
6481
|
+
icon: /* @__PURE__ */ React62.createElement(LibraryAddOutlined, null),
|
|
6478
6482
|
block: () => ({
|
|
6479
6483
|
type: "Container",
|
|
6480
6484
|
data: {
|
|
@@ -6487,6 +6491,20 @@ var BUTTONS = [
|
|
|
6487
6491
|
];
|
|
6488
6492
|
|
|
6489
6493
|
// src/editor/blocks/helpers/editor-children-ids/add-block-menu/blocks-menu.tsx
|
|
6494
|
+
var LABEL_KEYS = {
|
|
6495
|
+
Heading: "block-add.heading",
|
|
6496
|
+
Text: "block-add.text",
|
|
6497
|
+
Button: "block-add.button",
|
|
6498
|
+
Image: "block-add.image",
|
|
6499
|
+
Avatar: "block-add.avatar",
|
|
6500
|
+
"Personal Signature": "block-add.personal-signature",
|
|
6501
|
+
"Company Signature": "block-add.company-signature",
|
|
6502
|
+
Divider: "block-add.divider",
|
|
6503
|
+
Spacer: "block-add.spacer",
|
|
6504
|
+
Html: "block-add.html",
|
|
6505
|
+
Columns: "block-add.columns",
|
|
6506
|
+
Container: "block-add.container"
|
|
6507
|
+
};
|
|
6490
6508
|
function BlocksMenu({ anchorEl, setAnchorEl, onSelect }) {
|
|
6491
6509
|
const onClose = () => {
|
|
6492
6510
|
setAnchorEl(null);
|
|
@@ -6498,7 +6516,7 @@ function BlocksMenu({ anchorEl, setAnchorEl, onSelect }) {
|
|
|
6498
6516
|
if (anchorEl === null) {
|
|
6499
6517
|
return null;
|
|
6500
6518
|
}
|
|
6501
|
-
return /* @__PURE__ */
|
|
6519
|
+
return /* @__PURE__ */ React62.createElement(
|
|
6502
6520
|
Menu,
|
|
6503
6521
|
{
|
|
6504
6522
|
open: true,
|
|
@@ -6507,7 +6525,15 @@ function BlocksMenu({ anchorEl, setAnchorEl, onSelect }) {
|
|
|
6507
6525
|
anchorOrigin: { vertical: "bottom", horizontal: "center" },
|
|
6508
6526
|
transformOrigin: { vertical: "top", horizontal: "center" }
|
|
6509
6527
|
},
|
|
6510
|
-
/* @__PURE__ */
|
|
6528
|
+
/* @__PURE__ */ React62.createElement(Box, { sx: { p: 1, display: "grid", gridTemplateColumns: "1fr 1fr 1fr 1fr" } }, BUTTONS.map((k, i) => /* @__PURE__ */ React62.createElement(
|
|
6529
|
+
BlockTypeButton,
|
|
6530
|
+
{
|
|
6531
|
+
key: i,
|
|
6532
|
+
label: LABEL_KEYS[k.label] ? t(LABEL_KEYS[k.label], k.label) : k.label,
|
|
6533
|
+
icon: k.icon,
|
|
6534
|
+
onClick: () => onClick(k.block())
|
|
6535
|
+
}
|
|
6536
|
+
)))
|
|
6511
6537
|
);
|
|
6512
6538
|
}
|
|
6513
6539
|
function DividerButton({ buttonElement, onClick }) {
|
|
@@ -6534,7 +6560,7 @@ function DividerButton({ buttonElement, onClick }) {
|
|
|
6534
6560
|
window.removeEventListener("mousemove", listener);
|
|
6535
6561
|
};
|
|
6536
6562
|
}, [buttonElement, setVisible]);
|
|
6537
|
-
return /* @__PURE__ */
|
|
6563
|
+
return /* @__PURE__ */ React62.createElement(Fade, { in: visible }, /* @__PURE__ */ React62.createElement(
|
|
6538
6564
|
IconButton,
|
|
6539
6565
|
{
|
|
6540
6566
|
size: "small",
|
|
@@ -6557,11 +6583,11 @@ function DividerButton({ buttonElement, onClick }) {
|
|
|
6557
6583
|
onClick();
|
|
6558
6584
|
}
|
|
6559
6585
|
},
|
|
6560
|
-
/* @__PURE__ */
|
|
6586
|
+
/* @__PURE__ */ React62.createElement(AddOutlined, { fontSize: "small" })
|
|
6561
6587
|
));
|
|
6562
6588
|
}
|
|
6563
6589
|
function PlaceholderButton({ onClick }) {
|
|
6564
|
-
return /* @__PURE__ */
|
|
6590
|
+
return /* @__PURE__ */ React62.createElement(
|
|
6565
6591
|
ButtonBase,
|
|
6566
6592
|
{
|
|
6567
6593
|
onClick: (ev) => {
|
|
@@ -6577,7 +6603,7 @@ function PlaceholderButton({ onClick }) {
|
|
|
6577
6603
|
bgcolor: "rgba(0,0,0, 0.05)"
|
|
6578
6604
|
}
|
|
6579
6605
|
},
|
|
6580
|
-
/* @__PURE__ */
|
|
6606
|
+
/* @__PURE__ */ React62.createElement(
|
|
6581
6607
|
AddOutlined,
|
|
6582
6608
|
{
|
|
6583
6609
|
sx: {
|
|
@@ -6601,19 +6627,19 @@ function AddBlockButton({ onSelect, placeholder }) {
|
|
|
6601
6627
|
};
|
|
6602
6628
|
const renderButton2 = () => {
|
|
6603
6629
|
if (placeholder) {
|
|
6604
|
-
return /* @__PURE__ */
|
|
6630
|
+
return /* @__PURE__ */ React62.createElement(PlaceholderButton, { onClick: handleButtonClick });
|
|
6605
6631
|
} else {
|
|
6606
|
-
return /* @__PURE__ */
|
|
6632
|
+
return /* @__PURE__ */ React62.createElement(DividerButton, { buttonElement, onClick: handleButtonClick });
|
|
6607
6633
|
}
|
|
6608
6634
|
};
|
|
6609
|
-
return /* @__PURE__ */
|
|
6635
|
+
return /* @__PURE__ */ React62.createElement(React62.Fragment, null, /* @__PURE__ */ React62.createElement("div", { ref: setButtonElement, style: { position: "relative" } }, renderButton2()), /* @__PURE__ */ React62.createElement(BlocksMenu, { anchorEl: menuAnchorEl, setAnchorEl: setMenuAnchorEl, onSelect }));
|
|
6610
6636
|
}
|
|
6611
6637
|
var BlockParentContext = createContext(null);
|
|
6612
6638
|
function BlockParentProvider({
|
|
6613
6639
|
info,
|
|
6614
6640
|
children
|
|
6615
6641
|
}) {
|
|
6616
|
-
return /* @__PURE__ */
|
|
6642
|
+
return /* @__PURE__ */ React62.createElement(BlockParentContext.Provider, { value: info }, children);
|
|
6617
6643
|
}
|
|
6618
6644
|
function useBlockParent() {
|
|
6619
6645
|
return useContext(BlockParentContext);
|
|
@@ -6643,9 +6669,9 @@ function EditorChildrenIds({ childrenIds, onChange, parentRef }) {
|
|
|
6643
6669
|
});
|
|
6644
6670
|
};
|
|
6645
6671
|
if (!childrenIds || childrenIds.length === 0) {
|
|
6646
|
-
return /* @__PURE__ */
|
|
6672
|
+
return /* @__PURE__ */ React62.createElement(React62.Fragment, null, /* @__PURE__ */ React62.createElement(AddBlockButton, { placeholder: true, onSelect: appendBlock }), parentRef && /* @__PURE__ */ React62.createElement(CanvasDropZone, { parentRef, targetIndex: 0, placeholder: true }));
|
|
6647
6673
|
}
|
|
6648
|
-
return /* @__PURE__ */
|
|
6674
|
+
return /* @__PURE__ */ React62.createElement(React62.Fragment, null, childrenIds.map((childId, i) => /* @__PURE__ */ React62.createElement(Fragment, { key: childId }, /* @__PURE__ */ React62.createElement(AddBlockButton, { onSelect: (block) => insertBlock(block, i) }), parentRef && /* @__PURE__ */ React62.createElement(CanvasDropZone, { parentRef, targetIndex: i }), parentRef ? /* @__PURE__ */ React62.createElement(BlockParentProvider, { info: { parent: parentRef, indexInParent: i } }, /* @__PURE__ */ React62.createElement(EditorBlock, { id: childId })) : /* @__PURE__ */ React62.createElement(EditorBlock, { id: childId }))), /* @__PURE__ */ React62.createElement(AddBlockButton, { onSelect: appendBlock }), parentRef && /* @__PURE__ */ React62.createElement(CanvasDropZone, { parentRef, targetIndex: childrenIds.length }));
|
|
6649
6675
|
}
|
|
6650
6676
|
function CanvasDropZone({
|
|
6651
6677
|
parentRef,
|
|
@@ -6682,7 +6708,7 @@ function CanvasDropZone({
|
|
|
6682
6708
|
}
|
|
6683
6709
|
setDraggingBlock(null);
|
|
6684
6710
|
};
|
|
6685
|
-
return /* @__PURE__ */
|
|
6711
|
+
return /* @__PURE__ */ React62.createElement(
|
|
6686
6712
|
Box,
|
|
6687
6713
|
{
|
|
6688
6714
|
onDragOver: handleDragOver,
|
|
@@ -6725,13 +6751,13 @@ function ColumnsContainerEditor({ style, props }) {
|
|
|
6725
6751
|
});
|
|
6726
6752
|
setSelectedBlockId(blockId);
|
|
6727
6753
|
};
|
|
6728
|
-
return /* @__PURE__ */
|
|
6754
|
+
return /* @__PURE__ */ React62.createElement(
|
|
6729
6755
|
columns_container_default,
|
|
6730
6756
|
{
|
|
6731
6757
|
props: restProps,
|
|
6732
6758
|
style,
|
|
6733
6759
|
columns: [
|
|
6734
|
-
/* @__PURE__ */
|
|
6760
|
+
/* @__PURE__ */ React62.createElement(
|
|
6735
6761
|
EditorChildrenIds,
|
|
6736
6762
|
{
|
|
6737
6763
|
childrenIds: (_b = columns == null ? void 0 : columns[0]) == null ? void 0 : _b.childrenIds,
|
|
@@ -6739,7 +6765,7 @@ function ColumnsContainerEditor({ style, props }) {
|
|
|
6739
6765
|
onChange: (change) => updateColumn(0, change)
|
|
6740
6766
|
}
|
|
6741
6767
|
),
|
|
6742
|
-
/* @__PURE__ */
|
|
6768
|
+
/* @__PURE__ */ React62.createElement(
|
|
6743
6769
|
EditorChildrenIds,
|
|
6744
6770
|
{
|
|
6745
6771
|
childrenIds: (_c = columns == null ? void 0 : columns[1]) == null ? void 0 : _c.childrenIds,
|
|
@@ -6747,7 +6773,7 @@ function ColumnsContainerEditor({ style, props }) {
|
|
|
6747
6773
|
onChange: (change) => updateColumn(1, change)
|
|
6748
6774
|
}
|
|
6749
6775
|
),
|
|
6750
|
-
/* @__PURE__ */
|
|
6776
|
+
/* @__PURE__ */ React62.createElement(
|
|
6751
6777
|
EditorChildrenIds,
|
|
6752
6778
|
{
|
|
6753
6779
|
childrenIds: (_d = columns == null ? void 0 : columns[2]) == null ? void 0 : _d.childrenIds,
|
|
@@ -6764,7 +6790,7 @@ function ContainerEditor({ style, props }) {
|
|
|
6764
6790
|
const childrenIds = (_a = props == null ? void 0 : props.childrenIds) != null ? _a : [];
|
|
6765
6791
|
const document2 = useDocument();
|
|
6766
6792
|
const currentBlockId = useCurrentBlockId();
|
|
6767
|
-
return /* @__PURE__ */
|
|
6793
|
+
return /* @__PURE__ */ React62.createElement(container_default, { style }, /* @__PURE__ */ React62.createElement(
|
|
6768
6794
|
EditorChildrenIds,
|
|
6769
6795
|
{
|
|
6770
6796
|
childrenIds,
|
|
@@ -6965,7 +6991,7 @@ function EmailLayoutEditor(props) {
|
|
|
6965
6991
|
lineHeight: "1.5",
|
|
6966
6992
|
margin: "0"
|
|
6967
6993
|
};
|
|
6968
|
-
const editorChildren = /* @__PURE__ */
|
|
6994
|
+
const editorChildren = /* @__PURE__ */ React62.createElement(
|
|
6969
6995
|
EditorChildrenIds,
|
|
6970
6996
|
{
|
|
6971
6997
|
childrenIds,
|
|
@@ -6992,7 +7018,7 @@ function EmailLayoutEditor(props) {
|
|
|
6992
7018
|
boxShadow: "0 1px 2px rgba(33, 36, 67, 0.05), 0 8px 24px rgba(33, 36, 67, 0.08)"
|
|
6993
7019
|
};
|
|
6994
7020
|
if (props.backdropDisabled) {
|
|
6995
|
-
return /* @__PURE__ */
|
|
7021
|
+
return /* @__PURE__ */ React62.createElement(
|
|
6996
7022
|
"div",
|
|
6997
7023
|
{
|
|
6998
7024
|
onClick: () => {
|
|
@@ -7004,7 +7030,7 @@ function EmailLayoutEditor(props) {
|
|
|
7004
7030
|
minHeight: "100%"
|
|
7005
7031
|
})
|
|
7006
7032
|
},
|
|
7007
|
-
/* @__PURE__ */
|
|
7033
|
+
/* @__PURE__ */ React62.createElement(
|
|
7008
7034
|
"div",
|
|
7009
7035
|
{
|
|
7010
7036
|
style: __spreadProps(__spreadValues({}, cardStyle), {
|
|
@@ -7012,11 +7038,11 @@ function EmailLayoutEditor(props) {
|
|
|
7012
7038
|
padding: "32px"
|
|
7013
7039
|
})
|
|
7014
7040
|
},
|
|
7015
|
-
/* @__PURE__ */
|
|
7041
|
+
/* @__PURE__ */ React62.createElement("div", { style: { maxWidth: "600px", margin: "0 auto" } }, editorChildren)
|
|
7016
7042
|
)
|
|
7017
7043
|
);
|
|
7018
7044
|
}
|
|
7019
|
-
return /* @__PURE__ */
|
|
7045
|
+
return /* @__PURE__ */ React62.createElement(
|
|
7020
7046
|
"div",
|
|
7021
7047
|
{
|
|
7022
7048
|
onClick: () => {
|
|
@@ -7028,7 +7054,7 @@ function EmailLayoutEditor(props) {
|
|
|
7028
7054
|
minHeight: "100%"
|
|
7029
7055
|
})
|
|
7030
7056
|
},
|
|
7031
|
-
/* @__PURE__ */
|
|
7057
|
+
/* @__PURE__ */ React62.createElement(
|
|
7032
7058
|
"div",
|
|
7033
7059
|
{
|
|
7034
7060
|
style: __spreadProps(__spreadValues({}, cardStyle), {
|
|
@@ -7036,7 +7062,7 @@ function EmailLayoutEditor(props) {
|
|
|
7036
7062
|
padding: "32px 0"
|
|
7037
7063
|
})
|
|
7038
7064
|
},
|
|
7039
|
-
/* @__PURE__ */
|
|
7065
|
+
/* @__PURE__ */ React62.createElement(
|
|
7040
7066
|
"table",
|
|
7041
7067
|
{
|
|
7042
7068
|
align: "center",
|
|
@@ -7060,7 +7086,7 @@ function EmailLayoutEditor(props) {
|
|
|
7060
7086
|
cellPadding: "0",
|
|
7061
7087
|
border: 0
|
|
7062
7088
|
},
|
|
7063
|
-
/* @__PURE__ */
|
|
7089
|
+
/* @__PURE__ */ React62.createElement("tbody", null, /* @__PURE__ */ React62.createElement("tr", { style: { width: "100%" } }, /* @__PURE__ */ React62.createElement("td", null, editorChildren)))
|
|
7064
7090
|
)
|
|
7065
7091
|
)
|
|
7066
7092
|
);
|
|
@@ -7220,7 +7246,7 @@ function TuneMenu({ blockId }) {
|
|
|
7220
7246
|
resetDocument(nDocument);
|
|
7221
7247
|
setSelectedBlockId(blockId);
|
|
7222
7248
|
};
|
|
7223
|
-
return /* @__PURE__ */
|
|
7249
|
+
return /* @__PURE__ */ React62.createElement(Paper, { sx, onClick: (ev) => ev.stopPropagation() }, /* @__PURE__ */ React62.createElement(Stack, null, /* @__PURE__ */ React62.createElement(Tooltip, { title: t("tune.move-up", "Move up"), placement: "left-start" }, /* @__PURE__ */ React62.createElement(IconButton, { "aria-label": t("tune.move-up", "Move up"), onClick: () => handleMoveClick("up"), sx: { color: "text.primary" } }, /* @__PURE__ */ React62.createElement(ArrowUpwardOutlined, { fontSize: "small" }))), /* @__PURE__ */ React62.createElement(Tooltip, { title: t("tune.move-down", "Move down"), placement: "left-start" }, /* @__PURE__ */ React62.createElement(IconButton, { "aria-label": t("tune.move-down", "Move down"), onClick: () => handleMoveClick("down"), sx: { color: "text.primary" } }, /* @__PURE__ */ React62.createElement(ArrowDownwardOutlined, { fontSize: "small" }))), /* @__PURE__ */ React62.createElement(Tooltip, { title: t("tune.copy", "Copy block"), placement: "left-start" }, /* @__PURE__ */ React62.createElement(IconButton, { "aria-label": t("tune.copy", "Copy block"), onClick: handleCopyClick, sx: { color: "text.primary" } }, /* @__PURE__ */ React62.createElement(ContentCopyOutlined, { fontSize: "small" }))), /* @__PURE__ */ React62.createElement(Tooltip, { title: t("tune.delete", "Delete"), placement: "left-start" }, /* @__PURE__ */ React62.createElement(IconButton, { "aria-label": t("tune.delete", "Delete"), onClick: handleDeleteClick, sx: { color: "text.primary" } }, /* @__PURE__ */ React62.createElement(DeleteOutlined, { fontSize: "small" })))));
|
|
7224
7250
|
}
|
|
7225
7251
|
|
|
7226
7252
|
// src/editor/blocks/helpers/block-wrappers/editor-block-wrapper.tsx
|
|
@@ -7242,7 +7268,7 @@ function EditorBlockWrapper({ children }) {
|
|
|
7242
7268
|
if (selectedBlockId !== blockId) {
|
|
7243
7269
|
return null;
|
|
7244
7270
|
}
|
|
7245
|
-
return /* @__PURE__ */
|
|
7271
|
+
return /* @__PURE__ */ React62.createElement(TuneMenu, { blockId });
|
|
7246
7272
|
};
|
|
7247
7273
|
const draggable = Boolean(blockParent) && selectedBlockId !== blockId;
|
|
7248
7274
|
const handleDragStart = (e) => {
|
|
@@ -7255,7 +7281,7 @@ function EditorBlockWrapper({ children }) {
|
|
|
7255
7281
|
const handleDragEnd = () => {
|
|
7256
7282
|
setDraggingBlock(null);
|
|
7257
7283
|
};
|
|
7258
|
-
return /* @__PURE__ */
|
|
7284
|
+
return /* @__PURE__ */ React62.createElement(
|
|
7259
7285
|
Box,
|
|
7260
7286
|
{
|
|
7261
7287
|
draggable,
|
|
@@ -7400,7 +7426,7 @@ function ButtonEditor({ style, props }) {
|
|
|
7400
7426
|
selectionEnd: (_b2 = el.selectionEnd) != null ? _b2 : el.value.length
|
|
7401
7427
|
});
|
|
7402
7428
|
};
|
|
7403
|
-
return /* @__PURE__ */
|
|
7429
|
+
return /* @__PURE__ */ React62.createElement("div", { style: wrapperStyle }, /* @__PURE__ */ React62.createElement(
|
|
7404
7430
|
"input",
|
|
7405
7431
|
{
|
|
7406
7432
|
type: "text",
|
|
@@ -7417,7 +7443,7 @@ function ButtonEditor({ style, props }) {
|
|
|
7417
7443
|
}
|
|
7418
7444
|
));
|
|
7419
7445
|
}
|
|
7420
|
-
return /* @__PURE__ */
|
|
7446
|
+
return /* @__PURE__ */ React62.createElement("div", { style: wrapperStyle }, /* @__PURE__ */ React62.createElement("span", { style: linkStyle }, /* @__PURE__ */ React62.createElement("span", null, text)));
|
|
7421
7447
|
}
|
|
7422
7448
|
function useMarkdownToolbar({ text, isSelected, commitText, trackSelection }) {
|
|
7423
7449
|
const textareaRef = useRef(null);
|
|
@@ -7561,7 +7587,7 @@ function InlineFormattingToolbar({
|
|
|
7561
7587
|
}
|
|
7562
7588
|
}, [linkPrompt]);
|
|
7563
7589
|
const preventBlur = (e) => e.preventDefault();
|
|
7564
|
-
return /* @__PURE__ */
|
|
7590
|
+
return /* @__PURE__ */ React62.createElement(Popper, { open: visible, anchorEl, placement: "top-start", style: { zIndex: 1300 } }, /* @__PURE__ */ React62.createElement(Paper, { elevation: 4, sx: { px: 0.5, py: 0.25, mb: 0.5 }, onMouseDown: preventBlur }, linkPrompt ? /* @__PURE__ */ React62.createElement(Stack, { direction: "row", alignItems: "center", spacing: 0.5, sx: { px: 0.5 } }, /* @__PURE__ */ React62.createElement(
|
|
7565
7591
|
TextField,
|
|
7566
7592
|
{
|
|
7567
7593
|
inputRef,
|
|
@@ -7583,7 +7609,7 @@ function InlineFormattingToolbar({
|
|
|
7583
7609
|
},
|
|
7584
7610
|
sx: { width: 220 }
|
|
7585
7611
|
}
|
|
7586
|
-
)) : /* @__PURE__ */
|
|
7612
|
+
)) : /* @__PURE__ */ React62.createElement(Stack, { direction: "row", spacing: 0.25 }, /* @__PURE__ */ React62.createElement(IconButton, { size: "small", onClick: onBold, title: t("toolbar.bold-shortcut", "Bold (Cmd+B)"), "aria-label": t("toolbar.bold", "Bold") }, /* @__PURE__ */ React62.createElement(FormatBoldOutlined, { fontSize: "small" })), /* @__PURE__ */ React62.createElement(IconButton, { size: "small", onClick: onItalic, title: t("toolbar.italic-shortcut", "Italic (Cmd+I)"), "aria-label": t("toolbar.italic", "Italic") }, /* @__PURE__ */ React62.createElement(FormatItalicOutlined, { fontSize: "small" })), /* @__PURE__ */ React62.createElement(IconButton, { size: "small", onClick: onLinkRequest, title: t("toolbar.link-shortcut", "Link (Cmd+K)"), "aria-label": t("toolbar.link", "Link") }, /* @__PURE__ */ React62.createElement(LinkOutlined, { fontSize: "small" })))));
|
|
7587
7613
|
}
|
|
7588
7614
|
|
|
7589
7615
|
// src/editor/blocks/heading/heading-editor.tsx
|
|
@@ -7738,7 +7764,7 @@ function HeadingEditor({ style, props }) {
|
|
|
7738
7764
|
if (textareaRef.current) adjustTextareaHeight(textareaRef.current);
|
|
7739
7765
|
}, [localText, isSelected]);
|
|
7740
7766
|
if (isSelected) {
|
|
7741
|
-
return /* @__PURE__ */
|
|
7767
|
+
return /* @__PURE__ */ React62.createElement(React62.Fragment, null, /* @__PURE__ */ React62.createElement(
|
|
7742
7768
|
"textarea",
|
|
7743
7769
|
{
|
|
7744
7770
|
ref: textareaRef,
|
|
@@ -7756,7 +7782,7 @@ function HeadingEditor({ style, props }) {
|
|
|
7756
7782
|
rows: 1,
|
|
7757
7783
|
onInput: (e) => adjustTextareaHeight(e.target)
|
|
7758
7784
|
}
|
|
7759
|
-
), /* @__PURE__ */
|
|
7785
|
+
), /* @__PURE__ */ React62.createElement(InlineFormattingToolbar, __spreadValues({ anchorEl: textareaRef.current }, toolbarProps)));
|
|
7760
7786
|
}
|
|
7761
7787
|
const headingProps = isMarkdown ? {
|
|
7762
7788
|
ref: displayRef,
|
|
@@ -7765,11 +7791,11 @@ function HeadingEditor({ style, props }) {
|
|
|
7765
7791
|
} : { ref: displayRef, style: hStyle, children: textContent };
|
|
7766
7792
|
switch (level) {
|
|
7767
7793
|
case "h1":
|
|
7768
|
-
return /* @__PURE__ */
|
|
7794
|
+
return /* @__PURE__ */ React62.createElement("h1", __spreadValues({}, headingProps));
|
|
7769
7795
|
case "h2":
|
|
7770
|
-
return /* @__PURE__ */
|
|
7796
|
+
return /* @__PURE__ */ React62.createElement("h2", __spreadValues({}, headingProps));
|
|
7771
7797
|
case "h3":
|
|
7772
|
-
return /* @__PURE__ */
|
|
7798
|
+
return /* @__PURE__ */ React62.createElement("h3", __spreadValues({}, headingProps));
|
|
7773
7799
|
}
|
|
7774
7800
|
}
|
|
7775
7801
|
function HtmlEditor({ style, props }) {
|
|
@@ -7834,7 +7860,7 @@ function HtmlEditor({ style, props }) {
|
|
|
7834
7860
|
selectionEnd: (_b2 = el.selectionEnd) != null ? _b2 : el.value.length
|
|
7835
7861
|
});
|
|
7836
7862
|
};
|
|
7837
|
-
return /* @__PURE__ */
|
|
7863
|
+
return /* @__PURE__ */ React62.createElement("div", { style: cssStyle }, /* @__PURE__ */ React62.createElement(
|
|
7838
7864
|
"textarea",
|
|
7839
7865
|
{
|
|
7840
7866
|
value: localContents,
|
|
@@ -7854,9 +7880,9 @@ function HtmlEditor({ style, props }) {
|
|
|
7854
7880
|
));
|
|
7855
7881
|
}
|
|
7856
7882
|
if (!contents) {
|
|
7857
|
-
return /* @__PURE__ */
|
|
7883
|
+
return /* @__PURE__ */ React62.createElement("div", { style: cssStyle });
|
|
7858
7884
|
}
|
|
7859
|
-
return /* @__PURE__ */
|
|
7885
|
+
return /* @__PURE__ */ React62.createElement("div", { style: cssStyle, dangerouslySetInnerHTML: { __html: contents } });
|
|
7860
7886
|
}
|
|
7861
7887
|
function getImageBorderRadius2(shape, size) {
|
|
7862
7888
|
switch (shape) {
|
|
@@ -7971,7 +7997,7 @@ function SignatureEditor({ style, props }) {
|
|
|
7971
7997
|
backgroundColor: (_p = style == null ? void 0 : style.backgroundColor) != null ? _p : void 0,
|
|
7972
7998
|
padding: (style == null ? void 0 : style.padding) ? `${style.padding.top}px ${style.padding.right}px ${style.padding.bottom}px ${style.padding.left}px` : void 0
|
|
7973
7999
|
};
|
|
7974
|
-
const imageElement = imageUrl ? /* @__PURE__ */
|
|
8000
|
+
const imageElement = imageUrl ? /* @__PURE__ */ React62.createElement(
|
|
7975
8001
|
"img",
|
|
7976
8002
|
{
|
|
7977
8003
|
src: imageUrl,
|
|
@@ -7989,7 +8015,7 @@ function SignatureEditor({ style, props }) {
|
|
|
7989
8015
|
}
|
|
7990
8016
|
}
|
|
7991
8017
|
) : null;
|
|
7992
|
-
const greetingElement = isSelected ? /* @__PURE__ */
|
|
8018
|
+
const greetingElement = isSelected ? /* @__PURE__ */ React62.createElement("div", { onClick: (e) => e.stopPropagation() }, /* @__PURE__ */ React62.createElement(
|
|
7993
8019
|
"input",
|
|
7994
8020
|
{
|
|
7995
8021
|
value: localGreeting,
|
|
@@ -8000,8 +8026,8 @@ function SignatureEditor({ style, props }) {
|
|
|
8000
8026
|
placeholder: "Greeting (e.g. Best regards,)",
|
|
8001
8027
|
style: __spreadValues(__spreadValues({}, inputBase), greetingStyle)
|
|
8002
8028
|
}
|
|
8003
|
-
)) : greeting ? /* @__PURE__ */
|
|
8004
|
-
const textContent = isSelected ? /* @__PURE__ */
|
|
8029
|
+
)) : greeting ? /* @__PURE__ */ React62.createElement("p", { style: greetingStyle }, greeting) : null;
|
|
8030
|
+
const textContent = isSelected ? /* @__PURE__ */ React62.createElement("div", { onClick: (e) => e.stopPropagation() }, /* @__PURE__ */ React62.createElement(
|
|
8005
8031
|
"input",
|
|
8006
8032
|
{
|
|
8007
8033
|
value: localName,
|
|
@@ -8012,7 +8038,7 @@ function SignatureEditor({ style, props }) {
|
|
|
8012
8038
|
placeholder: "Name",
|
|
8013
8039
|
style: __spreadValues(__spreadValues({}, inputBase), nameStyle)
|
|
8014
8040
|
}
|
|
8015
|
-
), /* @__PURE__ */
|
|
8041
|
+
), /* @__PURE__ */ React62.createElement(
|
|
8016
8042
|
"input",
|
|
8017
8043
|
{
|
|
8018
8044
|
value: localTitle,
|
|
@@ -8023,7 +8049,7 @@ function SignatureEditor({ style, props }) {
|
|
|
8023
8049
|
placeholder: "Title",
|
|
8024
8050
|
style: __spreadValues(__spreadValues({}, inputBase), detailStyle)
|
|
8025
8051
|
}
|
|
8026
|
-
), /* @__PURE__ */
|
|
8052
|
+
), /* @__PURE__ */ React62.createElement(
|
|
8027
8053
|
"input",
|
|
8028
8054
|
{
|
|
8029
8055
|
value: localCompany,
|
|
@@ -8034,7 +8060,7 @@ function SignatureEditor({ style, props }) {
|
|
|
8034
8060
|
placeholder: "Company",
|
|
8035
8061
|
style: __spreadValues(__spreadValues({}, inputBase), detailStyle)
|
|
8036
8062
|
}
|
|
8037
|
-
), /* @__PURE__ */
|
|
8063
|
+
), /* @__PURE__ */ React62.createElement(
|
|
8038
8064
|
"input",
|
|
8039
8065
|
{
|
|
8040
8066
|
value: localAddress,
|
|
@@ -8045,7 +8071,7 @@ function SignatureEditor({ style, props }) {
|
|
|
8045
8071
|
placeholder: "Address",
|
|
8046
8072
|
style: __spreadValues(__spreadValues({}, inputBase), detailStyle)
|
|
8047
8073
|
}
|
|
8048
|
-
), /* @__PURE__ */
|
|
8074
|
+
), /* @__PURE__ */ React62.createElement(
|
|
8049
8075
|
"input",
|
|
8050
8076
|
{
|
|
8051
8077
|
value: localEmail,
|
|
@@ -8056,7 +8082,7 @@ function SignatureEditor({ style, props }) {
|
|
|
8056
8082
|
placeholder: "Email",
|
|
8057
8083
|
style: __spreadProps(__spreadValues(__spreadValues({}, inputBase), linkStyle), { marginTop: 4, display: "block" })
|
|
8058
8084
|
}
|
|
8059
|
-
), /* @__PURE__ */
|
|
8085
|
+
), /* @__PURE__ */ React62.createElement(
|
|
8060
8086
|
"input",
|
|
8061
8087
|
{
|
|
8062
8088
|
value: localPhone,
|
|
@@ -8067,7 +8093,7 @@ function SignatureEditor({ style, props }) {
|
|
|
8067
8093
|
placeholder: "Phone",
|
|
8068
8094
|
style: __spreadProps(__spreadValues(__spreadValues({}, inputBase), linkStyle), { display: "block" })
|
|
8069
8095
|
}
|
|
8070
|
-
), /* @__PURE__ */
|
|
8096
|
+
), /* @__PURE__ */ React62.createElement(
|
|
8071
8097
|
"input",
|
|
8072
8098
|
{
|
|
8073
8099
|
value: localWebsite,
|
|
@@ -8078,11 +8104,11 @@ function SignatureEditor({ style, props }) {
|
|
|
8078
8104
|
placeholder: "Website",
|
|
8079
8105
|
style: __spreadProps(__spreadValues(__spreadValues({}, inputBase), linkStyle), { display: "block" })
|
|
8080
8106
|
}
|
|
8081
|
-
)) : /* @__PURE__ */
|
|
8107
|
+
)) : /* @__PURE__ */ React62.createElement("div", null, name && /* @__PURE__ */ React62.createElement("p", { style: nameStyle }, name), title && /* @__PURE__ */ React62.createElement("p", { style: detailStyle }, title), company && /* @__PURE__ */ React62.createElement("p", { style: detailStyle }, company), address && /* @__PURE__ */ React62.createElement("p", { style: detailStyle }, address), (email || phone || website) && /* @__PURE__ */ React62.createElement("p", { style: __spreadProps(__spreadValues({}, detailStyle), { marginTop: 4 }) }, email && /* @__PURE__ */ React62.createElement("span", { style: linkStyle }, email), email && (phone || website) && /* @__PURE__ */ React62.createElement("span", { style: detailStyle }, " \xB7 "), phone && /* @__PURE__ */ React62.createElement("span", { style: linkStyle }, phone), phone && website && /* @__PURE__ */ React62.createElement("span", { style: detailStyle }, " \xB7 "), website && /* @__PURE__ */ React62.createElement("span", { style: linkStyle }, website)), !name && !title && !company && !email && !phone && !website && /* @__PURE__ */ React62.createElement("p", { style: detailStyle }, "Click to edit signature"));
|
|
8082
8108
|
if (layout === "vertical") {
|
|
8083
|
-
return /* @__PURE__ */
|
|
8109
|
+
return /* @__PURE__ */ React62.createElement("div", { style: wrapperStyle }, greetingElement, imageElement && /* @__PURE__ */ React62.createElement("div", { style: { marginBottom: 12 } }, imageElement), textContent);
|
|
8084
8110
|
}
|
|
8085
|
-
return /* @__PURE__ */
|
|
8111
|
+
return /* @__PURE__ */ React62.createElement("div", { style: wrapperStyle }, greetingElement, /* @__PURE__ */ React62.createElement("table", { cellPadding: "0", cellSpacing: "0", border: 0, role: "presentation" }, /* @__PURE__ */ React62.createElement("tbody", null, /* @__PURE__ */ React62.createElement("tr", null, imageElement && /* @__PURE__ */ React62.createElement("td", { style: { verticalAlign: "middle", paddingRight: 16 } }, imageElement), /* @__PURE__ */ React62.createElement("td", { style: { verticalAlign: "middle" } }, textContent)))));
|
|
8086
8112
|
}
|
|
8087
8113
|
function getFontFamily10(fontFamily) {
|
|
8088
8114
|
switch (fontFamily) {
|
|
@@ -8226,7 +8252,7 @@ function TextEditor({ style, props }) {
|
|
|
8226
8252
|
if (textareaRef.current) adjustTextareaHeight(textareaRef.current);
|
|
8227
8253
|
}, [localText, isSelected]);
|
|
8228
8254
|
if (isSelected) {
|
|
8229
|
-
return /* @__PURE__ */
|
|
8255
|
+
return /* @__PURE__ */ React62.createElement(React62.Fragment, null, /* @__PURE__ */ React62.createElement(
|
|
8230
8256
|
"textarea",
|
|
8231
8257
|
{
|
|
8232
8258
|
ref: textareaRef,
|
|
@@ -8244,10 +8270,10 @@ function TextEditor({ style, props }) {
|
|
|
8244
8270
|
rows: 1,
|
|
8245
8271
|
onInput: (e) => adjustTextareaHeight(e.target)
|
|
8246
8272
|
}
|
|
8247
|
-
), /* @__PURE__ */
|
|
8273
|
+
), /* @__PURE__ */ React62.createElement(InlineFormattingToolbar, __spreadValues({ anchorEl: textareaRef.current }, toolbarProps)));
|
|
8248
8274
|
}
|
|
8249
8275
|
if (isMarkdown) {
|
|
8250
|
-
return /* @__PURE__ */
|
|
8276
|
+
return /* @__PURE__ */ React62.createElement(
|
|
8251
8277
|
"div",
|
|
8252
8278
|
{
|
|
8253
8279
|
ref: displayRef,
|
|
@@ -8256,34 +8282,34 @@ function TextEditor({ style, props }) {
|
|
|
8256
8282
|
}
|
|
8257
8283
|
);
|
|
8258
8284
|
}
|
|
8259
|
-
return /* @__PURE__ */
|
|
8285
|
+
return /* @__PURE__ */ React62.createElement("div", { ref: displayRef, style: wStyle }, textContent);
|
|
8260
8286
|
}
|
|
8261
8287
|
|
|
8262
8288
|
// src/editor/core.tsx
|
|
8263
8289
|
var EDITOR_DICTIONARY = buildBlockConfigurationDictionary({
|
|
8264
8290
|
Avatar: {
|
|
8265
8291
|
schema: AvatarPropsSchema,
|
|
8266
|
-
Component: (props) => /* @__PURE__ */
|
|
8292
|
+
Component: (props) => /* @__PURE__ */ React62.createElement(EditorBlockWrapper, null, /* @__PURE__ */ React62.createElement(avatar_default, __spreadValues({}, props)))
|
|
8267
8293
|
},
|
|
8268
8294
|
Button: {
|
|
8269
8295
|
schema: ButtonPropsSchema,
|
|
8270
|
-
Component: (props) => /* @__PURE__ */
|
|
8296
|
+
Component: (props) => /* @__PURE__ */ React62.createElement(EditorBlockWrapper, null, /* @__PURE__ */ React62.createElement(ButtonEditor, __spreadValues({}, props)))
|
|
8271
8297
|
},
|
|
8272
8298
|
Container: {
|
|
8273
8299
|
schema: container_props_schema_default,
|
|
8274
|
-
Component: (props) => /* @__PURE__ */
|
|
8300
|
+
Component: (props) => /* @__PURE__ */ React62.createElement(EditorBlockWrapper, null, /* @__PURE__ */ React62.createElement(ContainerEditor, __spreadValues({}, props)))
|
|
8275
8301
|
},
|
|
8276
8302
|
ColumnsContainer: {
|
|
8277
8303
|
schema: columns_container_props_schema_default2,
|
|
8278
|
-
Component: (props) => /* @__PURE__ */
|
|
8304
|
+
Component: (props) => /* @__PURE__ */ React62.createElement(EditorBlockWrapper, null, /* @__PURE__ */ React62.createElement(ColumnsContainerEditor, __spreadValues({}, props)))
|
|
8279
8305
|
},
|
|
8280
8306
|
Heading: {
|
|
8281
8307
|
schema: HeadingPropsSchema,
|
|
8282
|
-
Component: (props) => /* @__PURE__ */
|
|
8308
|
+
Component: (props) => /* @__PURE__ */ React62.createElement(EditorBlockWrapper, null, /* @__PURE__ */ React62.createElement(HeadingEditor, __spreadValues({}, props)))
|
|
8283
8309
|
},
|
|
8284
8310
|
Html: {
|
|
8285
8311
|
schema: HtmlPropsSchema,
|
|
8286
|
-
Component: (props) => /* @__PURE__ */
|
|
8312
|
+
Component: (props) => /* @__PURE__ */ React62.createElement(EditorBlockWrapper, null, /* @__PURE__ */ React62.createElement(HtmlEditor, __spreadValues({}, props)))
|
|
8287
8313
|
},
|
|
8288
8314
|
Image: {
|
|
8289
8315
|
schema: ImagePropsSchema,
|
|
@@ -8295,28 +8321,28 @@ var EDITOR_DICTIONARY = buildBlockConfigurationDictionary({
|
|
|
8295
8321
|
linkHref: null
|
|
8296
8322
|
})
|
|
8297
8323
|
});
|
|
8298
|
-
return /* @__PURE__ */
|
|
8324
|
+
return /* @__PURE__ */ React62.createElement(EditorBlockWrapper, null, /* @__PURE__ */ React62.createElement(image_default, __spreadValues({}, props)));
|
|
8299
8325
|
}
|
|
8300
8326
|
},
|
|
8301
8327
|
Text: {
|
|
8302
8328
|
schema: TextPropsSchema,
|
|
8303
|
-
Component: (props) => /* @__PURE__ */
|
|
8329
|
+
Component: (props) => /* @__PURE__ */ React62.createElement(EditorBlockWrapper, null, /* @__PURE__ */ React62.createElement(TextEditor, __spreadValues({}, props)))
|
|
8304
8330
|
},
|
|
8305
8331
|
EmailLayout: {
|
|
8306
8332
|
schema: email_layout_props_schema_default,
|
|
8307
|
-
Component: (p) => /* @__PURE__ */
|
|
8333
|
+
Component: (p) => /* @__PURE__ */ React62.createElement(EmailLayoutEditor, __spreadValues({}, p))
|
|
8308
8334
|
},
|
|
8309
8335
|
Spacer: {
|
|
8310
8336
|
schema: SpacerPropsSchema,
|
|
8311
|
-
Component: (props) => /* @__PURE__ */
|
|
8337
|
+
Component: (props) => /* @__PURE__ */ React62.createElement(EditorBlockWrapper, null, /* @__PURE__ */ React62.createElement(spacer_default, __spreadValues({}, props)))
|
|
8312
8338
|
},
|
|
8313
8339
|
Divider: {
|
|
8314
8340
|
schema: DividerPropsSchema,
|
|
8315
|
-
Component: (props) => /* @__PURE__ */
|
|
8341
|
+
Component: (props) => /* @__PURE__ */ React62.createElement(EditorBlockWrapper, null, /* @__PURE__ */ React62.createElement(divider_default, __spreadValues({}, props)))
|
|
8316
8342
|
},
|
|
8317
8343
|
Signature: {
|
|
8318
8344
|
schema: SignaturePropsSchema,
|
|
8319
|
-
Component: (props) => /* @__PURE__ */
|
|
8345
|
+
Component: (props) => /* @__PURE__ */ React62.createElement(EditorBlockWrapper, null, /* @__PURE__ */ React62.createElement(SignatureEditor, __spreadValues({}, props)))
|
|
8320
8346
|
}
|
|
8321
8347
|
});
|
|
8322
8348
|
var EditorBlock2 = buildBlockComponent(EDITOR_DICTIONARY);
|
|
@@ -8332,7 +8358,7 @@ function EditorBlock({ id }) {
|
|
|
8332
8358
|
if (!block) {
|
|
8333
8359
|
throw new Error("Could not find block");
|
|
8334
8360
|
}
|
|
8335
|
-
return /* @__PURE__ */
|
|
8361
|
+
return /* @__PURE__ */ React62.createElement(EditorBlockContext.Provider, { value: id }, /* @__PURE__ */ React62.createElement(EditorBlock2, __spreadValues({}, block)));
|
|
8336
8362
|
}
|
|
8337
8363
|
function ToggleInspectorPanelButton() {
|
|
8338
8364
|
const inspectorDrawerOpen = useInspectorDrawerOpen();
|
|
@@ -8340,20 +8366,20 @@ function ToggleInspectorPanelButton() {
|
|
|
8340
8366
|
toggleInspectorDrawerOpen();
|
|
8341
8367
|
};
|
|
8342
8368
|
if (inspectorDrawerOpen) {
|
|
8343
|
-
return /* @__PURE__ */
|
|
8369
|
+
return /* @__PURE__ */ React62.createElement(IconButton, { onClick: handleClick }, /* @__PURE__ */ React62.createElement(LastPageOutlined, { fontSize: "small" }));
|
|
8344
8370
|
}
|
|
8345
|
-
return /* @__PURE__ */
|
|
8371
|
+
return /* @__PURE__ */ React62.createElement(IconButton, { onClick: handleClick }, /* @__PURE__ */ React62.createElement(AppRegistrationOutlined, { fontSize: "small" }));
|
|
8346
8372
|
}
|
|
8347
8373
|
function useIcon() {
|
|
8348
8374
|
const samplesDrawerOpen = useSamplesDrawerOpen();
|
|
8349
8375
|
if (samplesDrawerOpen) {
|
|
8350
|
-
return /* @__PURE__ */
|
|
8376
|
+
return /* @__PURE__ */ React62.createElement(FirstPageOutlined, { fontSize: "small" });
|
|
8351
8377
|
}
|
|
8352
|
-
return /* @__PURE__ */
|
|
8378
|
+
return /* @__PURE__ */ React62.createElement(MenuOutlined, { fontSize: "small" });
|
|
8353
8379
|
}
|
|
8354
8380
|
function ToggleSamplesPanelButton() {
|
|
8355
8381
|
const icon = useIcon();
|
|
8356
|
-
return /* @__PURE__ */
|
|
8382
|
+
return /* @__PURE__ */ React62.createElement(IconButton, { onClick: toggleSamplesDrawerOpen }, icon);
|
|
8357
8383
|
}
|
|
8358
8384
|
function formatHtml(html2, spaces = 2) {
|
|
8359
8385
|
try {
|
|
@@ -8415,7 +8441,7 @@ function HighlightedCodePanel({ type, value }) {
|
|
|
8415
8441
|
if (code === null) {
|
|
8416
8442
|
return null;
|
|
8417
8443
|
}
|
|
8418
|
-
return /* @__PURE__ */
|
|
8444
|
+
return /* @__PURE__ */ React62.createElement(
|
|
8419
8445
|
"pre",
|
|
8420
8446
|
{
|
|
8421
8447
|
style: {
|
|
@@ -8441,17 +8467,17 @@ function HighlightedCodePanel({ type, value }) {
|
|
|
8441
8467
|
function HtmlPanel() {
|
|
8442
8468
|
const document2 = useDocument();
|
|
8443
8469
|
const code = useMemo(() => renderToStaticMarkup(document2, { rootBlockId: "root" }), [document2]);
|
|
8444
|
-
return /* @__PURE__ */
|
|
8470
|
+
return /* @__PURE__ */ React62.createElement(HighlightedCodePanel, { type: "html", value: code });
|
|
8445
8471
|
}
|
|
8446
8472
|
function JsonPanel() {
|
|
8447
8473
|
const document2 = useDocument();
|
|
8448
8474
|
const code = useMemo(() => JSON.stringify(document2, null, " "), [document2]);
|
|
8449
|
-
return /* @__PURE__ */
|
|
8475
|
+
return /* @__PURE__ */ React62.createElement(HighlightedCodePanel, { type: "json", value: code });
|
|
8450
8476
|
}
|
|
8451
8477
|
function TextPanel() {
|
|
8452
8478
|
const document2 = useDocument();
|
|
8453
8479
|
const text = useMemo(() => renderToText(document2, { rootBlockId: "root" }), [document2]);
|
|
8454
|
-
return /* @__PURE__ */
|
|
8480
|
+
return /* @__PURE__ */ React62.createElement(
|
|
8455
8481
|
"pre",
|
|
8456
8482
|
{
|
|
8457
8483
|
style: {
|
|
@@ -8487,35 +8513,35 @@ function MainTabsGroup() {
|
|
|
8487
8513
|
setSelectedMainTab("editor");
|
|
8488
8514
|
}
|
|
8489
8515
|
};
|
|
8490
|
-
return /* @__PURE__ */
|
|
8516
|
+
return /* @__PURE__ */ React62.createElement(Tabs, { value: selectedMainTab, onChange: handleChange }, /* @__PURE__ */ React62.createElement(
|
|
8491
8517
|
Tab,
|
|
8492
8518
|
{
|
|
8493
8519
|
value: "editor",
|
|
8494
|
-
label: /* @__PURE__ */
|
|
8520
|
+
label: /* @__PURE__ */ React62.createElement(Tooltip, { title: t("tab.edit", "Edit") }, /* @__PURE__ */ React62.createElement(EditOutlined, { fontSize: "small" }))
|
|
8495
8521
|
}
|
|
8496
|
-
), /* @__PURE__ */
|
|
8522
|
+
), /* @__PURE__ */ React62.createElement(
|
|
8497
8523
|
Tab,
|
|
8498
8524
|
{
|
|
8499
8525
|
value: "preview",
|
|
8500
|
-
label: /* @__PURE__ */
|
|
8526
|
+
label: /* @__PURE__ */ React62.createElement(Tooltip, { title: t("tab.preview", "Preview") }, /* @__PURE__ */ React62.createElement(PreviewOutlined, { fontSize: "small" }))
|
|
8501
8527
|
}
|
|
8502
|
-
), /* @__PURE__ */
|
|
8528
|
+
), /* @__PURE__ */ React62.createElement(
|
|
8503
8529
|
Tab,
|
|
8504
8530
|
{
|
|
8505
8531
|
value: "html",
|
|
8506
|
-
label: /* @__PURE__ */
|
|
8532
|
+
label: /* @__PURE__ */ React62.createElement(Tooltip, { title: t("tab.html-output", "HTML output") }, /* @__PURE__ */ React62.createElement(CodeOutlined, { fontSize: "small" }))
|
|
8507
8533
|
}
|
|
8508
|
-
), /* @__PURE__ */
|
|
8534
|
+
), /* @__PURE__ */ React62.createElement(
|
|
8509
8535
|
Tab,
|
|
8510
8536
|
{
|
|
8511
8537
|
value: "text",
|
|
8512
|
-
label: /* @__PURE__ */
|
|
8538
|
+
label: /* @__PURE__ */ React62.createElement(Tooltip, { title: t("tab.text-output", "Plain text output") }, /* @__PURE__ */ React62.createElement(SubjectOutlined, { fontSize: "small" }))
|
|
8513
8539
|
}
|
|
8514
|
-
), /* @__PURE__ */
|
|
8540
|
+
), /* @__PURE__ */ React62.createElement(
|
|
8515
8541
|
Tab,
|
|
8516
8542
|
{
|
|
8517
8543
|
value: "json",
|
|
8518
|
-
label: /* @__PURE__ */
|
|
8544
|
+
label: /* @__PURE__ */ React62.createElement(Tooltip, { title: t("tab.json-output", "JSON output") }, /* @__PURE__ */ React62.createElement(DataObjectOutlined, { fontSize: "small" }))
|
|
8519
8545
|
}
|
|
8520
8546
|
));
|
|
8521
8547
|
}
|
|
@@ -8570,7 +8596,7 @@ function SaveBar({ loadTemplates, saveAs }) {
|
|
|
8570
8596
|
return false;
|
|
8571
8597
|
}
|
|
8572
8598
|
});
|
|
8573
|
-
return /* @__PURE__ */
|
|
8599
|
+
return /* @__PURE__ */ React62.createElement(React62.Fragment, null, /* @__PURE__ */ React62.createElement(
|
|
8574
8600
|
Box,
|
|
8575
8601
|
{
|
|
8576
8602
|
sx: {
|
|
@@ -8583,7 +8609,7 @@ function SaveBar({ loadTemplates, saveAs }) {
|
|
|
8583
8609
|
pb: 3
|
|
8584
8610
|
}
|
|
8585
8611
|
},
|
|
8586
|
-
/* @__PURE__ */
|
|
8612
|
+
/* @__PURE__ */ React62.createElement(
|
|
8587
8613
|
Box,
|
|
8588
8614
|
{
|
|
8589
8615
|
sx: {
|
|
@@ -8598,7 +8624,7 @@ function SaveBar({ loadTemplates, saveAs }) {
|
|
|
8598
8624
|
boxShadow: "0 2px 6px rgba(33, 36, 67, 0.06), 0 16px 40px rgba(33, 36, 67, 0.14)"
|
|
8599
8625
|
}
|
|
8600
8626
|
},
|
|
8601
|
-
hasOpenRow && currentTemplateName && /* @__PURE__ */
|
|
8627
|
+
hasOpenRow && currentTemplateName && /* @__PURE__ */ React62.createElement(
|
|
8602
8628
|
Box,
|
|
8603
8629
|
{
|
|
8604
8630
|
sx: {
|
|
@@ -8614,25 +8640,25 @@ function SaveBar({ loadTemplates, saveAs }) {
|
|
|
8614
8640
|
title: currentTemplateName
|
|
8615
8641
|
},
|
|
8616
8642
|
isSample ? `${t("savebar.sample-prefix", "Sample")} \xB7 ` : "",
|
|
8617
|
-
/* @__PURE__ */
|
|
8643
|
+
/* @__PURE__ */ React62.createElement(Box, { component: "span", sx: { color: "text.primary", fontWeight: 600 } }, currentTemplateName)
|
|
8618
8644
|
),
|
|
8619
|
-
/* @__PURE__ */
|
|
8645
|
+
/* @__PURE__ */ React62.createElement(Tooltip, { title: hasOpenRow ? isSample ? t("savebar.save-changes-to-sample", "Save changes to this sample") : t("savebar.save-changes", "Save changes") : t("savebar.save-as-new-template", "Save as a new template") }, /* @__PURE__ */ React62.createElement(
|
|
8620
8646
|
Button$1,
|
|
8621
8647
|
{
|
|
8622
8648
|
variant: "contained",
|
|
8623
8649
|
size: "large",
|
|
8624
|
-
startIcon: /* @__PURE__ */
|
|
8650
|
+
startIcon: /* @__PURE__ */ React62.createElement(SaveOutlined, null),
|
|
8625
8651
|
onClick: handlePrimary,
|
|
8626
8652
|
sx: { borderRadius: 999, textTransform: "none", px: 2.5, fontSize: 15, fontWeight: 600 }
|
|
8627
8653
|
},
|
|
8628
8654
|
primaryLabel
|
|
8629
8655
|
)),
|
|
8630
|
-
hasOpenRow && saveAs && /* @__PURE__ */
|
|
8656
|
+
hasOpenRow && saveAs && /* @__PURE__ */ React62.createElement(Tooltip, { title: t("savebar.save-as-new-template", "Save as a new template") }, /* @__PURE__ */ React62.createElement(
|
|
8631
8657
|
Button$1,
|
|
8632
8658
|
{
|
|
8633
8659
|
variant: "outlined",
|
|
8634
8660
|
size: "large",
|
|
8635
|
-
startIcon: /* @__PURE__ */
|
|
8661
|
+
startIcon: /* @__PURE__ */ React62.createElement(SaveAsOutlined, null),
|
|
8636
8662
|
onClick: () => {
|
|
8637
8663
|
setNameError(null);
|
|
8638
8664
|
setDialogMode("save-as");
|
|
@@ -8641,12 +8667,12 @@ function SaveBar({ loadTemplates, saveAs }) {
|
|
|
8641
8667
|
},
|
|
8642
8668
|
t("savebar.save-as", "Save as\u2026")
|
|
8643
8669
|
)),
|
|
8644
|
-
saveAs && /* @__PURE__ */
|
|
8670
|
+
saveAs && /* @__PURE__ */ React62.createElement(Tooltip, { title: t("savebar.start-fresh", "Start a fresh template") }, /* @__PURE__ */ React62.createElement(
|
|
8645
8671
|
Button$1,
|
|
8646
8672
|
{
|
|
8647
8673
|
variant: "text",
|
|
8648
8674
|
size: "large",
|
|
8649
|
-
startIcon: /* @__PURE__ */
|
|
8675
|
+
startIcon: /* @__PURE__ */ React62.createElement(AddOutlined, null),
|
|
8650
8676
|
onClick: () => {
|
|
8651
8677
|
setNameError(null);
|
|
8652
8678
|
setDialogMode("new-blank");
|
|
@@ -8656,10 +8682,11 @@ function SaveBar({ loadTemplates, saveAs }) {
|
|
|
8656
8682
|
t("savebar.new", "New")
|
|
8657
8683
|
))
|
|
8658
8684
|
)
|
|
8659
|
-
), /* @__PURE__ */
|
|
8685
|
+
), /* @__PURE__ */ React62.createElement(
|
|
8660
8686
|
SaveTemplateDialog,
|
|
8661
8687
|
{
|
|
8662
8688
|
open: dialogMode !== null,
|
|
8689
|
+
mode: dialogMode === "new-blank" ? "new" : "save-as",
|
|
8663
8690
|
onClose: () => {
|
|
8664
8691
|
setDialogMode(null);
|
|
8665
8692
|
setNameError(null);
|
|
@@ -8709,7 +8736,7 @@ function UndoRedoButtons() {
|
|
|
8709
8736
|
window.addEventListener("keydown", onKeyDown);
|
|
8710
8737
|
return () => window.removeEventListener("keydown", onKeyDown);
|
|
8711
8738
|
}, [mac]);
|
|
8712
|
-
return /* @__PURE__ */
|
|
8739
|
+
return /* @__PURE__ */ React62.createElement(Stack, { direction: "row", spacing: 0.5, alignItems: "center" }, /* @__PURE__ */ React62.createElement(Tooltip, { title: `${t("undo.tooltip", "Undo")} (${undoHint})` }, /* @__PURE__ */ React62.createElement("span", null, /* @__PURE__ */ React62.createElement(
|
|
8713
8740
|
IconButton,
|
|
8714
8741
|
{
|
|
8715
8742
|
size: "small",
|
|
@@ -8717,8 +8744,8 @@ function UndoRedoButtons() {
|
|
|
8717
8744
|
disabled: !canUndo,
|
|
8718
8745
|
"aria-label": t("undo.label", "Undo")
|
|
8719
8746
|
},
|
|
8720
|
-
/* @__PURE__ */
|
|
8721
|
-
))), /* @__PURE__ */
|
|
8747
|
+
/* @__PURE__ */ React62.createElement(UndoOutlined, { fontSize: "small" })
|
|
8748
|
+
))), /* @__PURE__ */ React62.createElement(Tooltip, { title: `${t("redo.tooltip", "Redo")} (${redoHint})` }, /* @__PURE__ */ React62.createElement("span", null, /* @__PURE__ */ React62.createElement(
|
|
8722
8749
|
IconButton,
|
|
8723
8750
|
{
|
|
8724
8751
|
size: "small",
|
|
@@ -8726,7 +8753,7 @@ function UndoRedoButtons() {
|
|
|
8726
8753
|
disabled: !canRedo,
|
|
8727
8754
|
"aria-label": t("redo.label", "Redo")
|
|
8728
8755
|
},
|
|
8729
|
-
/* @__PURE__ */
|
|
8756
|
+
/* @__PURE__ */ React62.createElement(RedoOutlined, { fontSize: "small" })
|
|
8730
8757
|
))));
|
|
8731
8758
|
}
|
|
8732
8759
|
function SubjectInput() {
|
|
@@ -8752,7 +8779,7 @@ function SubjectInput() {
|
|
|
8752
8779
|
selectionEnd: (_b = target.selectionEnd) != null ? _b : target.value.length
|
|
8753
8780
|
});
|
|
8754
8781
|
};
|
|
8755
|
-
return /* @__PURE__ */
|
|
8782
|
+
return /* @__PURE__ */ React62.createElement(
|
|
8756
8783
|
Box,
|
|
8757
8784
|
{
|
|
8758
8785
|
sx: {
|
|
@@ -8769,8 +8796,8 @@ function SubjectInput() {
|
|
|
8769
8796
|
gap: 1.5
|
|
8770
8797
|
}
|
|
8771
8798
|
},
|
|
8772
|
-
/* @__PURE__ */
|
|
8773
|
-
/* @__PURE__ */
|
|
8799
|
+
/* @__PURE__ */ React62.createElement(Box, { sx: { color: "text.secondary", fontSize: 13, fontWeight: 600, minWidth: 56 } }, "Subject"),
|
|
8800
|
+
/* @__PURE__ */ React62.createElement(
|
|
8774
8801
|
InputBase,
|
|
8775
8802
|
{
|
|
8776
8803
|
fullWidth: true,
|
|
@@ -8796,7 +8823,7 @@ function SubjectPreview() {
|
|
|
8796
8823
|
if (!subject) return null;
|
|
8797
8824
|
const samples = buildSampleValueMap((_b = data.variables) != null ? _b : []);
|
|
8798
8825
|
const rendered = substituteSampleValues(subject, samples);
|
|
8799
|
-
return /* @__PURE__ */
|
|
8826
|
+
return /* @__PURE__ */ React62.createElement(
|
|
8800
8827
|
Box,
|
|
8801
8828
|
{
|
|
8802
8829
|
sx: {
|
|
@@ -8813,8 +8840,8 @@ function SubjectPreview() {
|
|
|
8813
8840
|
gap: 1.5
|
|
8814
8841
|
}
|
|
8815
8842
|
},
|
|
8816
|
-
/* @__PURE__ */
|
|
8817
|
-
/* @__PURE__ */
|
|
8843
|
+
/* @__PURE__ */ React62.createElement(Box, { sx: { color: "text.secondary", fontSize: 13, fontWeight: 600, minWidth: 56 } }, "Subject"),
|
|
8844
|
+
/* @__PURE__ */ React62.createElement(Box, { sx: { fontSize: 14 } }, rendered)
|
|
8818
8845
|
);
|
|
8819
8846
|
}
|
|
8820
8847
|
function generateId3() {
|
|
@@ -8887,7 +8914,7 @@ function ImageDropPasteHandler({ enabled, children }) {
|
|
|
8887
8914
|
window.addEventListener("paste", handlePaste);
|
|
8888
8915
|
return () => window.removeEventListener("paste", handlePaste);
|
|
8889
8916
|
}, [active, uploadImage]);
|
|
8890
|
-
if (!active) return /* @__PURE__ */
|
|
8917
|
+
if (!active) return /* @__PURE__ */ React62.createElement(React62.Fragment, null, children);
|
|
8891
8918
|
const onDragEnter = (e) => {
|
|
8892
8919
|
var _a, _b;
|
|
8893
8920
|
if (!Array.from((_b = (_a = e.dataTransfer) == null ? void 0 : _a.items) != null ? _b : []).some((i) => i.kind === "file")) return;
|
|
@@ -8920,7 +8947,7 @@ function ImageDropPasteHandler({ enabled, children }) {
|
|
|
8920
8947
|
setUploading(false);
|
|
8921
8948
|
}
|
|
8922
8949
|
});
|
|
8923
|
-
return /* @__PURE__ */
|
|
8950
|
+
return /* @__PURE__ */ React62.createElement(
|
|
8924
8951
|
Box,
|
|
8925
8952
|
{
|
|
8926
8953
|
ref: wrapperRef,
|
|
@@ -8931,7 +8958,7 @@ function ImageDropPasteHandler({ enabled, children }) {
|
|
|
8931
8958
|
sx: { position: "relative" }
|
|
8932
8959
|
},
|
|
8933
8960
|
children,
|
|
8934
|
-
(dragging || uploading) && /* @__PURE__ */
|
|
8961
|
+
(dragging || uploading) && /* @__PURE__ */ React62.createElement(
|
|
8935
8962
|
Box,
|
|
8936
8963
|
{
|
|
8937
8964
|
sx: {
|
|
@@ -8950,7 +8977,7 @@ function ImageDropPasteHandler({ enabled, children }) {
|
|
|
8950
8977
|
zIndex: 10
|
|
8951
8978
|
}
|
|
8952
8979
|
},
|
|
8953
|
-
/* @__PURE__ */
|
|
8980
|
+
/* @__PURE__ */ React62.createElement(Box, { sx: { display: "flex", alignItems: "center", gap: 1, fontWeight: 600, fontSize: 14 } }, /* @__PURE__ */ React62.createElement(CloudUploadOutlined, null), uploading ? "Uploading\u2026" : "Drop image to insert")
|
|
8954
8981
|
)
|
|
8955
8982
|
);
|
|
8956
8983
|
}
|
|
@@ -8990,7 +9017,7 @@ function TemplatePanel2({ loadTemplates, saveAs, samplesDrawerEnabled = true })
|
|
|
8990
9017
|
var _a;
|
|
8991
9018
|
switch (selectedMainTab) {
|
|
8992
9019
|
case "editor":
|
|
8993
|
-
return /* @__PURE__ */
|
|
9020
|
+
return /* @__PURE__ */ React62.createElement(Box, { sx: mainBoxSx }, /* @__PURE__ */ React62.createElement(EditorBlock, { id: "root" }));
|
|
8994
9021
|
case "preview": {
|
|
8995
9022
|
const rootBlock = document2.root;
|
|
8996
9023
|
const layoutData = rootBlock && rootBlock.type === "EmailLayout" ? rootBlock.data : void 0;
|
|
@@ -8998,18 +9025,18 @@ function TemplatePanel2({ loadTemplates, saveAs, samplesDrawerEnabled = true })
|
|
|
8998
9025
|
(_a = layoutData == null ? void 0 : layoutData.variables) != null ? _a : []
|
|
8999
9026
|
);
|
|
9000
9027
|
const previewDoc = applySampleValuesToDocument(document2, samples);
|
|
9001
|
-
return /* @__PURE__ */
|
|
9028
|
+
return /* @__PURE__ */ React62.createElement(Box, { sx: mainBoxSx }, /* @__PURE__ */ React62.createElement(Reader, { document: previewDoc, rootBlockId: "root" }));
|
|
9002
9029
|
}
|
|
9003
9030
|
case "html":
|
|
9004
|
-
return /* @__PURE__ */
|
|
9031
|
+
return /* @__PURE__ */ React62.createElement(HtmlPanel, null);
|
|
9005
9032
|
case "text":
|
|
9006
|
-
return /* @__PURE__ */
|
|
9033
|
+
return /* @__PURE__ */ React62.createElement(TextPanel, null);
|
|
9007
9034
|
case "json":
|
|
9008
|
-
return /* @__PURE__ */
|
|
9035
|
+
return /* @__PURE__ */ React62.createElement(JsonPanel, null);
|
|
9009
9036
|
}
|
|
9010
9037
|
};
|
|
9011
9038
|
const showSaveButtons = persistenceEnabled;
|
|
9012
|
-
return /* @__PURE__ */
|
|
9039
|
+
return /* @__PURE__ */ React62.createElement(React62.Fragment, null, /* @__PURE__ */ React62.createElement(
|
|
9013
9040
|
Stack,
|
|
9014
9041
|
{
|
|
9015
9042
|
sx: {
|
|
@@ -9026,10 +9053,10 @@ function TemplatePanel2({ loadTemplates, saveAs, samplesDrawerEnabled = true })
|
|
|
9026
9053
|
justifyContent: "space-between",
|
|
9027
9054
|
alignItems: "center"
|
|
9028
9055
|
},
|
|
9029
|
-
samplesDrawerEnabled && /* @__PURE__ */
|
|
9030
|
-
/* @__PURE__ */
|
|
9031
|
-
/* @__PURE__ */
|
|
9032
|
-
), selectedMainTab === "editor" && /* @__PURE__ */
|
|
9056
|
+
samplesDrawerEnabled && /* @__PURE__ */ React62.createElement(ToggleSamplesPanelButton, null),
|
|
9057
|
+
/* @__PURE__ */ React62.createElement(Stack, { px: 2, direction: "row", gap: 2, width: "100%", justifyContent: "space-between", alignItems: "center" }, /* @__PURE__ */ React62.createElement(Stack, { direction: "row", spacing: 2 }, /* @__PURE__ */ React62.createElement(MainTabsGroup, null)), /* @__PURE__ */ React62.createElement(Stack, { direction: "row", spacing: 2, alignItems: "center" }, selectedMainTab === "editor" && /* @__PURE__ */ React62.createElement(UndoRedoButtons, null), /* @__PURE__ */ React62.createElement(ToggleButtonGroup, { value: selectedScreenSize, exclusive: true, size: "small", onChange: handleScreenSizeChange }, /* @__PURE__ */ React62.createElement(ToggleButton, { value: "desktop" }, /* @__PURE__ */ React62.createElement(Tooltip, { title: t("canvas.desktop-view", "Desktop view") }, /* @__PURE__ */ React62.createElement(MonitorOutlined, { fontSize: "small" }))), /* @__PURE__ */ React62.createElement(ToggleButton, { value: "mobile" }, /* @__PURE__ */ React62.createElement(Tooltip, { title: t("canvas.mobile-view", "Mobile view") }, /* @__PURE__ */ React62.createElement(PhoneIphoneOutlined, { fontSize: "small" })))))),
|
|
9058
|
+
/* @__PURE__ */ React62.createElement(ToggleInspectorPanelButton, null)
|
|
9059
|
+
), selectedMainTab === "editor" && /* @__PURE__ */ React62.createElement(SubjectInput, null), selectedMainTab === "preview" && /* @__PURE__ */ React62.createElement(SubjectPreview, null), /* @__PURE__ */ React62.createElement(ImageDropPasteHandler, { enabled: selectedMainTab === "editor" }, /* @__PURE__ */ React62.createElement(
|
|
9033
9060
|
Box,
|
|
9034
9061
|
{
|
|
9035
9062
|
sx: {
|
|
@@ -9045,8 +9072,8 @@ function TemplatePanel2({ loadTemplates, saveAs, samplesDrawerEnabled = true })
|
|
|
9045
9072
|
background: selectedMainTab === "editor" ? workspaceBackground === "checkerboard" ? WORKSPACE_CHECKERBOARD : WORKSPACE_SOLID : void 0
|
|
9046
9073
|
}
|
|
9047
9074
|
},
|
|
9048
|
-
/* @__PURE__ */
|
|
9049
|
-
showSaveButtons && selectedMainTab === "editor" && /* @__PURE__ */
|
|
9075
|
+
/* @__PURE__ */ React62.createElement(Box, { sx: { flexGrow: 1 } }, renderMainPanel()),
|
|
9076
|
+
showSaveButtons && selectedMainTab === "editor" && /* @__PURE__ */ React62.createElement(SaveBar, { loadTemplates, saveAs })
|
|
9050
9077
|
)));
|
|
9051
9078
|
}
|
|
9052
9079
|
|
|
@@ -9128,7 +9155,7 @@ var EmailEditorInternal = forwardRef((props, ref) => {
|
|
|
9128
9155
|
return getDocument();
|
|
9129
9156
|
}
|
|
9130
9157
|
}));
|
|
9131
|
-
return /* @__PURE__ */
|
|
9158
|
+
return /* @__PURE__ */ React62.createElement(Stack, { position: "relative", id: "drawer-container", sx: { minHeight } }, /* @__PURE__ */ React62.createElement(
|
|
9132
9159
|
InspectorDrawer,
|
|
9133
9160
|
{
|
|
9134
9161
|
enterDuration: drawerEnterDuration,
|
|
@@ -9137,7 +9164,7 @@ var EmailEditorInternal = forwardRef((props, ref) => {
|
|
|
9137
9164
|
copyTemplate,
|
|
9138
9165
|
renameTemplate
|
|
9139
9166
|
}
|
|
9140
|
-
), /* @__PURE__ */
|
|
9167
|
+
), /* @__PURE__ */ React62.createElement(
|
|
9141
9168
|
SamplesDrawer,
|
|
9142
9169
|
{
|
|
9143
9170
|
enterDuration: drawerEnterDuration,
|
|
@@ -9153,7 +9180,7 @@ var EmailEditorInternal = forwardRef((props, ref) => {
|
|
|
9153
9180
|
setTemplateKind,
|
|
9154
9181
|
saveAs
|
|
9155
9182
|
}
|
|
9156
|
-
), /* @__PURE__ */
|
|
9183
|
+
), /* @__PURE__ */ React62.createElement(
|
|
9157
9184
|
Stack,
|
|
9158
9185
|
{
|
|
9159
9186
|
sx: {
|
|
@@ -9162,7 +9189,7 @@ var EmailEditorInternal = forwardRef((props, ref) => {
|
|
|
9162
9189
|
transition: [marginLeftTransition, marginRightTransition].join(", ")
|
|
9163
9190
|
}
|
|
9164
9191
|
},
|
|
9165
|
-
/* @__PURE__ */
|
|
9192
|
+
/* @__PURE__ */ React62.createElement(TemplatePanel2, { loadTemplates, saveAs, samplesDrawerEnabled })
|
|
9166
9193
|
));
|
|
9167
9194
|
});
|
|
9168
9195
|
var EmailEditor = forwardRef((props, ref) => {
|
|
@@ -9208,7 +9235,7 @@ var EmailEditor = forwardRef((props, ref) => {
|
|
|
9208
9235
|
() => ({ uploadImage, loadImages, deleteImage }),
|
|
9209
9236
|
[uploadImage, loadImages, deleteImage]
|
|
9210
9237
|
);
|
|
9211
|
-
return /* @__PURE__ */
|
|
9238
|
+
return /* @__PURE__ */ React62.createElement(I18nProvider, { i18n }, /* @__PURE__ */ React62.createElement(ThemeProvider, { theme: theme || theme_default }, /* @__PURE__ */ React62.createElement(CssBaseline, null), /* @__PURE__ */ React62.createElement("div", { style: { height: "100%", overflow: "auto" } }, /* @__PURE__ */ React62.createElement(SnackbarProvider, null, /* @__PURE__ */ React62.createElement(ImageCallbacksProvider, { callbacks: imageCallbacks }, /* @__PURE__ */ React62.createElement(
|
|
9212
9239
|
EmailEditorProvider,
|
|
9213
9240
|
{
|
|
9214
9241
|
initialTemplate: resolvedTemplate,
|
|
@@ -9217,7 +9244,7 @@ var EmailEditor = forwardRef((props, ref) => {
|
|
|
9217
9244
|
onSave,
|
|
9218
9245
|
onChange
|
|
9219
9246
|
},
|
|
9220
|
-
/* @__PURE__ */
|
|
9247
|
+
/* @__PURE__ */ React62.createElement(
|
|
9221
9248
|
EmailEditorInternal,
|
|
9222
9249
|
{
|
|
9223
9250
|
ref,
|