@flozy/editor 3.8.1 → 3.8.2
Sign up to get free protection for your applications and to get access to all the features.
- package/dist/Editor/ChatEditor.js +55 -45
- package/dist/Editor/CommonEditor.js +111 -169
- package/dist/Editor/Elements/AI/AIInput.js +5 -16
- package/dist/Editor/Elements/AI/PopoverAIInput.js +17 -31
- package/dist/Editor/Elements/AI/Styles.js +1 -2
- package/dist/Editor/Elements/Accordion/Accordion.js +7 -74
- package/dist/Editor/Elements/Accordion/AccordionBtnPopup.js +2 -3
- package/dist/Editor/Elements/Accordion/AccordionSummary.js +60 -4
- package/dist/Editor/Elements/AppHeader/AppHeader.js +4 -26
- package/dist/Editor/Elements/Button/EditorButton.js +16 -28
- package/dist/Editor/Elements/Color Picker/ColorButtons.js +17 -60
- package/dist/Editor/Elements/Color Picker/ColorPicker.css +1 -25
- package/dist/Editor/Elements/Color Picker/ColorPicker.js +4 -4
- package/dist/Editor/Elements/Color Picker/Styles.js +1 -2
- package/dist/Editor/Elements/Embed/Image.js +20 -28
- package/dist/Editor/Elements/Embed/Video.js +11 -15
- package/dist/Editor/Elements/Emoji/EmojiPicker.js +4 -2
- package/dist/Editor/Elements/Form/Workflow/UserInputs.js +1 -2
- package/dist/Editor/Elements/Grid/Grid.js +0 -2
- package/dist/Editor/Elements/Grid/GridItem.js +1 -3
- package/dist/Editor/Elements/Link/Link.js +1 -6
- package/dist/Editor/Elements/Link/LinkButton.js +2 -4
- package/dist/Editor/Elements/Link/LinkPopup.js +3 -11
- package/dist/Editor/Elements/Table/Table.js +1 -1
- package/dist/Editor/Elements/Table/TableCell.js +1 -1
- package/dist/Editor/MiniEditor.js +1 -3
- package/dist/Editor/Toolbar/Basic/index.js +2 -4
- package/dist/Editor/Toolbar/FormatTools/Dropdown.js +2 -26
- package/dist/Editor/Toolbar/FormatTools/MarkButton.js +2 -2
- package/dist/Editor/Toolbar/FormatTools/TextSize.js +11 -5
- package/dist/Editor/Toolbar/PopupTool/MiniTextFormat/SelectFontSize.js +11 -4
- package/dist/Editor/Toolbar/PopupTool/MiniTextFormat/SelectTypography.js +86 -213
- package/dist/Editor/Toolbar/PopupTool/MiniTextFormat/index.js +1 -2
- package/dist/Editor/Toolbar/PopupTool/PopupToolStyle.js +13 -20
- package/dist/Editor/Toolbar/PopupTool/TextFormat.js +7 -52
- package/dist/Editor/Toolbar/PopupTool/index.js +5 -6
- package/dist/Editor/Toolbar/toolbarGroups.js +6 -48
- package/dist/Editor/assets/svg/AIIcons.js +1 -153
- package/dist/Editor/common/ColorPickerButton.js +9 -25
- package/dist/Editor/common/DnD/DragHandleButton.js +1 -1
- package/dist/Editor/common/Icon.js +2 -30
- package/dist/Editor/common/LinkSettings/NavComponents.js +2 -5
- package/dist/Editor/common/LinkSettings/index.js +1 -2
- package/dist/Editor/common/LinkSettings/navOptions.js +2 -7
- package/dist/Editor/common/MentionsPopup/MentionsListCard.js +6 -1
- package/dist/Editor/common/MentionsPopup/Styles.js +2 -5
- package/dist/Editor/common/Shorthands/elements.js +0 -54
- package/dist/Editor/common/StyleBuilder/accordionTitleBtnStyle.js +7 -7
- package/dist/Editor/common/StyleBuilder/accordionTitleStyle.js +16 -16
- package/dist/Editor/common/StyleBuilder/buttonStyle.js +2 -4
- package/dist/Editor/common/StyleBuilder/fieldTypes/bannerSpacing.js +3 -13
- package/dist/Editor/common/StyleBuilder/fieldTypes/borderRadius.js +7 -15
- package/dist/Editor/common/StyleBuilder/fieldTypes/buttonLink.js +1 -1
- package/dist/Editor/common/StyleBuilder/fieldTypes/color.js +7 -31
- package/dist/Editor/common/StyleBuilder/fieldTypes/fontSize.js +4 -13
- package/dist/Editor/common/StyleBuilder/fieldTypes/textOptions.js +4 -14
- package/dist/Editor/common/StyleBuilder/index.js +1 -1
- package/dist/Editor/helper/theme.js +4 -190
- package/dist/Editor/hooks/useMouseMove.js +2 -4
- package/dist/Editor/plugins/withEmbeds.js +1 -1
- package/dist/Editor/plugins/withHTML.js +5 -47
- package/dist/Editor/plugins/withLayout.js +10 -15
- package/dist/Editor/plugins/withTable.js +2 -2
- package/dist/Editor/theme/ThemeList.js +173 -50
- package/dist/Editor/utils/SlateUtilityFunctions.js +25 -161
- package/dist/Editor/utils/button.js +17 -1
- package/dist/Editor/utils/draftToSlate.js +1 -1
- package/dist/Editor/utils/events.js +4 -11
- package/dist/Editor/utils/font.js +37 -40
- package/dist/Editor/utils/helper.js +1 -51
- package/package.json +1 -2
- package/dist/Editor/Elements/AI/VoiceToText/AudioWave.js +0 -73
- package/dist/Editor/Elements/AI/VoiceToText/index.js +0 -167
- package/dist/Editor/Elements/AI/VoiceToText/style.js +0 -40
- package/dist/Editor/Elements/Link/LinkPopupStyles.js +0 -28
- package/dist/Editor/Toolbar/PopupTool/ThemeTextFormat.js +0 -438
- package/dist/Editor/assets/svg/ThemeIcons.js +0 -291
- package/dist/Editor/common/CustomColorPicker/index.js +0 -106
- package/dist/Editor/common/CustomColorPicker/style.js +0 -53
- package/dist/Editor/common/CustomDialog/index.js +0 -94
- package/dist/Editor/common/CustomDialog/style.js +0 -67
- package/dist/Editor/common/CustomSelect.js +0 -33
- package/dist/Editor/common/EditorCmds.js +0 -35
- package/dist/Editor/hooks/useEditorTheme.js +0 -139
- package/dist/Editor/theme/index.js +0 -144
- package/dist/Editor/themeSettings/ActiveTheme.js +0 -72
- package/dist/Editor/themeSettings/buttons/index.js +0 -290
- package/dist/Editor/themeSettings/buttons/style.js +0 -21
- package/dist/Editor/themeSettings/colorTheme/index.js +0 -290
- package/dist/Editor/themeSettings/colorTheme/style.js +0 -77
- package/dist/Editor/themeSettings/fonts/PreviewElement.js +0 -123
- package/dist/Editor/themeSettings/fonts/index.js +0 -213
- package/dist/Editor/themeSettings/fonts/style.js +0 -44
- package/dist/Editor/themeSettings/icons.js +0 -60
- package/dist/Editor/themeSettings/index.js +0 -320
- package/dist/Editor/themeSettings/style.js +0 -152
- package/dist/Editor/themeSettingsAI/icons.js +0 -96
- package/dist/Editor/themeSettingsAI/index.js +0 -356
- package/dist/Editor/themeSettingsAI/saveTheme.js +0 -190
- package/dist/Editor/themeSettingsAI/style.js +0 -247
@@ -435,156 +435,4 @@ export function DeleteIcon(props) {
|
|
435
435
|
strokeLinejoin: "round"
|
436
436
|
})]
|
437
437
|
});
|
438
|
-
}
|
439
|
-
export const PauseRecordingIcon = () => /*#__PURE__*/_jsxs("svg", {
|
440
|
-
width: "30",
|
441
|
-
height: "30",
|
442
|
-
viewBox: "0 0 30 30",
|
443
|
-
fill: "none",
|
444
|
-
xmlns: "http://www.w3.org/2000/svg",
|
445
|
-
children: [/*#__PURE__*/_jsx("circle", {
|
446
|
-
cx: "15",
|
447
|
-
cy: "15",
|
448
|
-
r: "14.5",
|
449
|
-
fill: "white",
|
450
|
-
stroke: "url(#paint0_linear_29403_449555)"
|
451
|
-
}), /*#__PURE__*/_jsx("path", {
|
452
|
-
d: "M13.6916 21.125H10.8817C10.5953 21.125 10.3447 20.8744 10.3447 20.5881V9.84943C10.3447 9.54517 10.5953 9.3125 10.8817 9.3125H13.6916C13.932 9.3125 14.2285 9.54517 14.2285 9.84943V20.5881C14.2285 20.8744 13.932 21.125 13.6916 21.125Z",
|
453
|
-
fill: "url(#paint1_linear_29403_449555)"
|
454
|
-
}), /*#__PURE__*/_jsx("path", {
|
455
|
-
d: "M20.1346 21.125H17.3426C17.0383 21.125 16.8057 20.8744 16.8057 20.5881V9.84943C16.8057 9.54517 17.0383 9.3125 17.3426 9.3125H20.1525C20.4568 9.3125 20.6895 9.54517 20.6895 9.84943V20.5881C20.6716 20.8744 20.4389 21.125 20.1346 21.125Z",
|
456
|
-
fill: "url(#paint2_linear_29403_449555)"
|
457
|
-
}), /*#__PURE__*/_jsxs("defs", {
|
458
|
-
children: [/*#__PURE__*/_jsxs("linearGradient", {
|
459
|
-
id: "paint0_linear_29403_449555",
|
460
|
-
x1: "15",
|
461
|
-
y1: "0",
|
462
|
-
x2: "15",
|
463
|
-
y2: "30",
|
464
|
-
gradientUnits: "userSpaceOnUse",
|
465
|
-
children: [/*#__PURE__*/_jsx("stop", {
|
466
|
-
stopColor: "#8061FD"
|
467
|
-
}), /*#__PURE__*/_jsx("stop", {
|
468
|
-
offset: "1",
|
469
|
-
stopColor: "#2C64ED"
|
470
|
-
})]
|
471
|
-
}), /*#__PURE__*/_jsxs("linearGradient", {
|
472
|
-
id: "paint1_linear_29403_449555",
|
473
|
-
x1: "12.2866",
|
474
|
-
y1: "9.3125",
|
475
|
-
x2: "12.2866",
|
476
|
-
y2: "21.125",
|
477
|
-
gradientUnits: "userSpaceOnUse",
|
478
|
-
children: [/*#__PURE__*/_jsx("stop", {
|
479
|
-
stopColor: "#8161FD"
|
480
|
-
}), /*#__PURE__*/_jsx("stop", {
|
481
|
-
offset: "1",
|
482
|
-
stopColor: "#2A64EC"
|
483
|
-
})]
|
484
|
-
}), /*#__PURE__*/_jsxs("linearGradient", {
|
485
|
-
id: "paint2_linear_29403_449555",
|
486
|
-
x1: "18.7476",
|
487
|
-
y1: "9.3125",
|
488
|
-
x2: "18.7476",
|
489
|
-
y2: "21.125",
|
490
|
-
gradientUnits: "userSpaceOnUse",
|
491
|
-
children: [/*#__PURE__*/_jsx("stop", {
|
492
|
-
stopColor: "#8161FD"
|
493
|
-
}), /*#__PURE__*/_jsx("stop", {
|
494
|
-
offset: "1",
|
495
|
-
stopColor: "#2A64EC"
|
496
|
-
})]
|
497
|
-
})]
|
498
|
-
})]
|
499
|
-
});
|
500
|
-
export const CloseGreyCircle = () => /*#__PURE__*/_jsxs("svg", {
|
501
|
-
width: "30",
|
502
|
-
height: "30",
|
503
|
-
viewBox: "0 0 30 30",
|
504
|
-
fill: "none",
|
505
|
-
xmlns: "http://www.w3.org/2000/svg",
|
506
|
-
children: [/*#__PURE__*/_jsx("rect", {
|
507
|
-
width: "30",
|
508
|
-
height: "30",
|
509
|
-
rx: "15",
|
510
|
-
fill: "#DAE4ED"
|
511
|
-
}), /*#__PURE__*/_jsx("path", {
|
512
|
-
d: "M19.1245 10.875L10.8749 19.1246",
|
513
|
-
stroke: "#2563EB",
|
514
|
-
strokeWidth: "1.5",
|
515
|
-
strokeLinecap: "round",
|
516
|
-
strokeLinejoin: "round"
|
517
|
-
}), /*#__PURE__*/_jsx("path", {
|
518
|
-
d: "M10.875 10.875L19.1246 19.1246",
|
519
|
-
stroke: "#2563EB",
|
520
|
-
strokeWidth: "1.5",
|
521
|
-
strokeLinecap: "round",
|
522
|
-
strokeLinejoin: "round"
|
523
|
-
})]
|
524
|
-
});
|
525
|
-
export const TickBlueCircle = () => /*#__PURE__*/_jsxs("svg", {
|
526
|
-
width: "30",
|
527
|
-
height: "30",
|
528
|
-
viewBox: "0 0 30 30",
|
529
|
-
fill: "none",
|
530
|
-
xmlns: "http://www.w3.org/2000/svg",
|
531
|
-
children: [/*#__PURE__*/_jsx("rect", {
|
532
|
-
width: "30",
|
533
|
-
height: "30",
|
534
|
-
rx: "15",
|
535
|
-
fill: "url(#paint0_linear_30220_64249)"
|
536
|
-
}), /*#__PURE__*/_jsx("path", {
|
537
|
-
d: "M9 15L13.0011 19L21 11",
|
538
|
-
stroke: "white",
|
539
|
-
strokeWidth: "1.5",
|
540
|
-
strokeLinecap: "round",
|
541
|
-
strokeLinejoin: "round"
|
542
|
-
}), /*#__PURE__*/_jsx("defs", {
|
543
|
-
children: /*#__PURE__*/_jsxs("linearGradient", {
|
544
|
-
id: "paint0_linear_30220_64249",
|
545
|
-
x1: "15",
|
546
|
-
y1: "0",
|
547
|
-
x2: "15",
|
548
|
-
y2: "30",
|
549
|
-
gradientUnits: "userSpaceOnUse",
|
550
|
-
children: [/*#__PURE__*/_jsx("stop", {
|
551
|
-
stopColor: "#8360FD"
|
552
|
-
}), /*#__PURE__*/_jsx("stop", {
|
553
|
-
offset: "1",
|
554
|
-
stopColor: "#2563EB"
|
555
|
-
})]
|
556
|
-
})
|
557
|
-
})]
|
558
|
-
});
|
559
|
-
export const ChatMicIcon = props => /*#__PURE__*/_jsxs("svg", {
|
560
|
-
width: "26",
|
561
|
-
height: "26",
|
562
|
-
viewBox: "0 0 26 26",
|
563
|
-
fill: "none",
|
564
|
-
xmlns: "http://www.w3.org/2000/svg",
|
565
|
-
children: [/*#__PURE__*/_jsx("path", {
|
566
|
-
d: "M13 19.3194C15.9882 19.3194 18.4166 16.8909 18.4166 13.9028V9.38887C18.4166 6.40067 15.9882 3.9722 13 3.9722C10.0118 3.9722 7.58331 6.40067 7.58331 9.38887V13.9028C7.58331 16.8909 10.0118 19.3194 13 19.3194Z",
|
567
|
-
stroke: "#94A3B8",
|
568
|
-
strokeWidth: "1.4",
|
569
|
-
strokeLinecap: "round",
|
570
|
-
strokeLinejoin: "round"
|
571
|
-
}), /*#__PURE__*/_jsx("path", {
|
572
|
-
d: "M4.875 12.0972V13.9028C4.875 18.3896 8.51319 22.0278 13 22.0278C17.4868 22.0278 21.125 18.3896 21.125 13.9028V12.0972",
|
573
|
-
stroke: "#94A3B8",
|
574
|
-
strokeWidth: "1.4",
|
575
|
-
strokeLinecap: "round",
|
576
|
-
strokeLinejoin: "round"
|
577
|
-
}), /*#__PURE__*/_jsx("path", {
|
578
|
-
d: "M10.3913 8.91914C11.9982 8.33233 13.7496 8.33233 15.3565 8.91914",
|
579
|
-
stroke: "#94A3B8",
|
580
|
-
strokeWidth: "1.4",
|
581
|
-
strokeLinecap: "round",
|
582
|
-
strokeLinejoin: "round"
|
583
|
-
}), /*#__PURE__*/_jsx("path", {
|
584
|
-
d: "M11.2218 11.6295C12.3051 11.3316 13.4516 11.3316 14.535 11.6295",
|
585
|
-
stroke: "#94A3B8",
|
586
|
-
strokeWidth: "1.4",
|
587
|
-
strokeLinecap: "round",
|
588
|
-
strokeLinejoin: "round"
|
589
|
-
})]
|
590
|
-
});
|
438
|
+
}
|
@@ -1,7 +1,7 @@
|
|
1
1
|
import React, { useState } from "react";
|
2
2
|
import { Grid, Button, Popover } from "@mui/material";
|
3
|
+
import ColorPickerTool from "react-gcolor-picker";
|
3
4
|
import { colors } from "../Elements/Color Picker/defaultColors";
|
4
|
-
import CustomColorPicker from "./CustomColorPicker";
|
5
5
|
import { jsx as _jsx } from "react/jsx-runtime";
|
6
6
|
import { jsxs as _jsxs } from "react/jsx-runtime";
|
7
7
|
import { Fragment as _Fragment } from "react/jsx-runtime";
|
@@ -9,12 +9,9 @@ const ColorPickerButton = props => {
|
|
9
9
|
const {
|
10
10
|
value,
|
11
11
|
onSave,
|
12
|
+
defaultColors = [],
|
12
13
|
classes = {},
|
13
|
-
recentColors = []
|
14
|
-
children,
|
15
|
-
handleClose: closeDrawer,
|
16
|
-
hideThemeColors,
|
17
|
-
disableEditTheme
|
14
|
+
recentColors = []
|
18
15
|
} = props;
|
19
16
|
const [anchorEl, setAnchorEl] = useState(null);
|
20
17
|
const [color, setColor] = useState(value);
|
@@ -33,13 +30,7 @@ const ColorPickerButton = props => {
|
|
33
30
|
setColor(color);
|
34
31
|
};
|
35
32
|
return /*#__PURE__*/_jsxs(_Fragment, {
|
36
|
-
children: [
|
37
|
-
onClick: handleColorPicker,
|
38
|
-
style: {
|
39
|
-
cursor: "pointer"
|
40
|
-
},
|
41
|
-
children: children
|
42
|
-
}) : /*#__PURE__*/_jsx(Button, {
|
33
|
+
children: [/*#__PURE__*/_jsx(Button, {
|
43
34
|
style: {
|
44
35
|
background: value,
|
45
36
|
height: "22px",
|
@@ -69,24 +60,17 @@ const ColorPickerButton = props => {
|
|
69
60
|
item: true,
|
70
61
|
xs: 12,
|
71
62
|
children: [/*#__PURE__*/_jsx("div", {
|
72
|
-
children: /*#__PURE__*/_jsx(
|
63
|
+
children: /*#__PURE__*/_jsx(ColorPickerTool, {
|
73
64
|
gradient: true,
|
74
|
-
|
65
|
+
value: color,
|
75
66
|
onChange: handleColorChange,
|
76
|
-
|
77
|
-
closeDrawer: closeDrawer,
|
78
|
-
hideThemeColors: hideThemeColors,
|
79
|
-
disableEditTheme: disableEditTheme
|
67
|
+
defaultColors: [...recentColors, ...defaultColors] || []
|
80
68
|
})
|
81
69
|
}), /*#__PURE__*/_jsxs("div", {
|
82
70
|
style: {
|
83
71
|
display: "flex",
|
84
|
-
justifyContent: "
|
85
|
-
|
86
|
-
background: "white",
|
87
|
-
position: "sticky",
|
88
|
-
bottom: 0,
|
89
|
-
boxShadow: "0 -1px 5px rgba(0,0,0,0.1)"
|
72
|
+
justifyContent: "end",
|
73
|
+
margin: "8px"
|
90
74
|
},
|
91
75
|
children: [/*#__PURE__*/_jsx(Button, {
|
92
76
|
onClick: handleClose,
|
@@ -7,7 +7,7 @@ import { useEditorContext } from "../../hooks/useMouseMove";
|
|
7
7
|
import { Transforms } from "slate";
|
8
8
|
import { jsx as _jsx } from "react/jsx-runtime";
|
9
9
|
import { jsxs as _jsxs } from "react/jsx-runtime";
|
10
|
-
const DRAGGABLE_TYPES = ["paragraph", "headingOne", "headingTwo", "headingThree", "
|
10
|
+
const DRAGGABLE_TYPES = ["paragraph", "headingOne", "headingTwo", "headingThree", "grid"];
|
11
11
|
const DragHandleStyle = () => ({
|
12
12
|
dragHandle: {
|
13
13
|
opacity: 0,
|
@@ -10,20 +10,10 @@ import { IoIosImage } from "react-icons/io";
|
|
10
10
|
import { GridIcon, AccordionIcon, SignatureIcon, ButtonIcon, Carousal, FormIcon, BoldIcon, FontFamilyIcon, FontSizeIcon, ImageIcon, ItalicIcon, LinkIcon, StrikethroughIcon, TableIcon, UnderLineIcon, VideoIcon, CheckboxIcon, AppHeader, MoreHorizontal, UploadImage, DocsUpload, LeftArrow, RightArrow, CheckListButton, CheckListButtonActive, ExcelIcon, CsvIcon, DividerIcon, CloseIcon, SearchIcon, ExpandIcon, CalendarIconNew, Text, TextAreaIcon, Phone, BriefCase, Bank, CalendarTick, DollarSquare, Checkbox, Description, RadioButtonIcon, CheckedIcon, UncheckedIcon, InfinityIcon, ResetIcon } from "./iconslist";
|
11
11
|
import ArrowRightIcon from "@mui/icons-material/ArrowRight";
|
12
12
|
import ArrowDropDownIcon from "@mui/icons-material/ArrowDropDown";
|
13
|
-
import EmailRoundedIcon from
|
14
|
-
import InfoOutlinedIcon from
|
13
|
+
import EmailRoundedIcon from '@mui/icons-material/EmailRounded';
|
14
|
+
import InfoOutlinedIcon from '@mui/icons-material/InfoOutlined';
|
15
15
|
import { jsx as _jsx } from "react/jsx-runtime";
|
16
16
|
import { jsxs as _jsxs } from "react/jsx-runtime";
|
17
|
-
const HeadingIcon = ({
|
18
|
-
variant
|
19
|
-
}) => {
|
20
|
-
return /*#__PURE__*/_jsx("div", {
|
21
|
-
style: {
|
22
|
-
color: "#64748B"
|
23
|
-
},
|
24
|
-
children: variant
|
25
|
-
});
|
26
|
-
};
|
27
17
|
const iconList = {
|
28
18
|
fontFamily: /*#__PURE__*/_jsx(FontFamilyIcon, {
|
29
19
|
size: 20
|
@@ -59,24 +49,6 @@ const iconList = {
|
|
59
49
|
size: 18,
|
60
50
|
fill: "#64748B"
|
61
51
|
}),
|
62
|
-
headingFour: /*#__PURE__*/_jsx(HeadingIcon, {
|
63
|
-
variant: "H4"
|
64
|
-
}),
|
65
|
-
headingFive: /*#__PURE__*/_jsx(HeadingIcon, {
|
66
|
-
variant: "H5"
|
67
|
-
}),
|
68
|
-
headingSix: /*#__PURE__*/_jsx(HeadingIcon, {
|
69
|
-
variant: "H6"
|
70
|
-
}),
|
71
|
-
paragraphOne: /*#__PURE__*/_jsx(HeadingIcon, {
|
72
|
-
variant: "P1"
|
73
|
-
}),
|
74
|
-
paragraphTwo: /*#__PURE__*/_jsx(HeadingIcon, {
|
75
|
-
variant: "P2"
|
76
|
-
}),
|
77
|
-
paragraphThree: /*#__PURE__*/_jsx(HeadingIcon, {
|
78
|
-
variant: "P3"
|
79
|
-
}),
|
80
52
|
blockquote: /*#__PURE__*/_jsx(MdFormatQuote, {
|
81
53
|
size: 20,
|
82
54
|
fill: "#64748B"
|
@@ -134,13 +134,10 @@ export const SelectPage = props => {
|
|
134
134
|
});
|
135
135
|
};
|
136
136
|
export const Trigger = props => {
|
137
|
-
|
138
|
-
nav
|
139
|
-
} = props;
|
140
|
-
return /*#__PURE__*/_jsxs(Typography, {
|
137
|
+
return /*#__PURE__*/_jsx(Typography, {
|
141
138
|
variant: "subtitle1",
|
142
139
|
gutterBottom: true,
|
143
|
-
children:
|
140
|
+
children: "Choosing this will trigger the next step"
|
144
141
|
});
|
145
142
|
};
|
146
143
|
const scrollToOptions = [{
|
@@ -3,13 +3,8 @@ export const getNavOptions = (hideTools = []) => {
|
|
3
3
|
label: "None",
|
4
4
|
value: ""
|
5
5
|
}, {
|
6
|
-
label: "
|
7
|
-
value: "
|
8
|
-
type: "next"
|
9
|
-
}, {
|
10
|
-
label: "Previous Trigger",
|
11
|
-
value: "prevTrigger",
|
12
|
-
type: "previous"
|
6
|
+
label: "Trigger",
|
7
|
+
value: "actionTrigger"
|
13
8
|
}, {
|
14
9
|
label: "Web Address",
|
15
10
|
value: "webAddress",
|
@@ -39,7 +39,12 @@ const MentionsListCard = props => {
|
|
39
39
|
},
|
40
40
|
alt: name,
|
41
41
|
children: /*#__PURE__*/_jsx(Avatar, {
|
42
|
-
|
42
|
+
sx: {
|
43
|
+
background: 'linear-gradient(90deg, #5351FC 0%, #19A9FC 100%)'
|
44
|
+
},
|
45
|
+
alt: name,
|
46
|
+
src: avatar_filename,
|
47
|
+
children: !avatar_filename && name && name.charAt(0).toUpperCase()
|
43
48
|
})
|
44
49
|
}), /*#__PURE__*/_jsx(Box, {
|
45
50
|
sx: {
|
@@ -39,13 +39,10 @@ const usePopupStyles = theme => ({
|
|
39
39
|
color: theme?.palette?.editor?.textColor
|
40
40
|
},
|
41
41
|
"&.active": {
|
42
|
-
background:
|
43
|
-
"& .MuiTypography-root": {
|
44
|
-
color: `${theme?.palette?.editor?.activeColor} !important`
|
45
|
-
}
|
42
|
+
background: `${theme?.palette?.containers?.bg3 || "#E9F3FE"}`
|
46
43
|
},
|
47
44
|
"&:hover": {
|
48
|
-
background: theme?.palette?.
|
45
|
+
background: `${theme?.palette?.containers?.bg3 || "#E9F3FE"}`
|
49
46
|
},
|
50
47
|
"&.renderComp": {
|
51
48
|
padding: "0px",
|
@@ -40,60 +40,6 @@ const ELEMENTS_LIST = [{
|
|
40
40
|
icon: "headingThree"
|
41
41
|
}),
|
42
42
|
onInsert: editor => toggleBlock(editor, "headingThree", false)
|
43
|
-
}, {
|
44
|
-
name: "Heading 4",
|
45
|
-
desc: "",
|
46
|
-
group: "Text",
|
47
|
-
type: "headingFour",
|
48
|
-
icon: /*#__PURE__*/_jsx(Icon, {
|
49
|
-
icon: "headingFour"
|
50
|
-
}),
|
51
|
-
onInsert: editor => toggleBlock(editor, "headingFour", false)
|
52
|
-
}, {
|
53
|
-
name: "Heading 5",
|
54
|
-
desc: "",
|
55
|
-
group: "Text",
|
56
|
-
type: "headingFive",
|
57
|
-
icon: /*#__PURE__*/_jsx(Icon, {
|
58
|
-
icon: "headingFive"
|
59
|
-
}),
|
60
|
-
onInsert: editor => toggleBlock(editor, "headingFive", false)
|
61
|
-
}, {
|
62
|
-
name: "Heading 6",
|
63
|
-
desc: "",
|
64
|
-
group: "Text",
|
65
|
-
type: "headingSix",
|
66
|
-
icon: /*#__PURE__*/_jsx(Icon, {
|
67
|
-
icon: "headingSix"
|
68
|
-
}),
|
69
|
-
onInsert: editor => toggleBlock(editor, "headingSix", false)
|
70
|
-
}, {
|
71
|
-
name: "Paragraph 1",
|
72
|
-
desc: "",
|
73
|
-
group: "Text",
|
74
|
-
type: "paragraphOne",
|
75
|
-
icon: /*#__PURE__*/_jsx(Icon, {
|
76
|
-
icon: "paragraphOne"
|
77
|
-
}),
|
78
|
-
onInsert: editor => toggleBlock(editor, "paragraphOne", false)
|
79
|
-
}, {
|
80
|
-
name: "Paragraph 2",
|
81
|
-
desc: "",
|
82
|
-
group: "Text",
|
83
|
-
type: "paragraphTwo",
|
84
|
-
icon: /*#__PURE__*/_jsx(Icon, {
|
85
|
-
icon: "paragraphTwo"
|
86
|
-
}),
|
87
|
-
onInsert: editor => toggleBlock(editor, "paragraphTwo", false)
|
88
|
-
}, {
|
89
|
-
name: "Paragraph 3",
|
90
|
-
desc: "",
|
91
|
-
group: "Text",
|
92
|
-
type: "paragraphThree",
|
93
|
-
icon: /*#__PURE__*/_jsx(Icon, {
|
94
|
-
icon: "paragraphThree"
|
95
|
-
}),
|
96
|
-
onInsert: editor => toggleBlock(editor, "paragraphThree", false)
|
97
43
|
}, {
|
98
44
|
name: "Quote",
|
99
45
|
desc: "",
|
@@ -1,18 +1,18 @@
|
|
1
1
|
const accordionTitleBtnStyle = [{
|
2
2
|
tab: "Colors",
|
3
|
-
value: "
|
3
|
+
value: "colors",
|
4
4
|
fields: [{
|
5
|
-
label: "
|
6
|
-
key: "
|
5
|
+
label: "Text Color",
|
6
|
+
key: "textColor",
|
7
7
|
type: "color",
|
8
8
|
needPreview: true
|
9
9
|
}, {
|
10
|
-
label: "
|
11
|
-
key: "
|
10
|
+
label: "Background Color",
|
11
|
+
key: "bgColor",
|
12
12
|
type: "color"
|
13
13
|
}, {
|
14
|
-
label: "
|
15
|
-
key: "
|
14
|
+
label: "Border Color",
|
15
|
+
key: "borderColor",
|
16
16
|
type: "color"
|
17
17
|
}]
|
18
18
|
}];
|
@@ -1,4 +1,20 @@
|
|
1
1
|
const accordionTitleStyle = [{
|
2
|
+
tab: "Banner Spacing",
|
3
|
+
value: "bannerSpacing",
|
4
|
+
fields: [{
|
5
|
+
label: "Banner Spacing",
|
6
|
+
key: "bannerSpacing",
|
7
|
+
type: "bannerSpacing"
|
8
|
+
}]
|
9
|
+
}, {
|
10
|
+
tab: "Border Radius",
|
11
|
+
value: "borderRadius",
|
12
|
+
fields: [{
|
13
|
+
label: "Border Radius",
|
14
|
+
key: "borderRadius",
|
15
|
+
type: "borderRadius"
|
16
|
+
}]
|
17
|
+
}, {
|
2
18
|
tab: "Colors",
|
3
19
|
value: "colors",
|
4
20
|
fields: [{
|
@@ -15,21 +31,5 @@ const accordionTitleStyle = [{
|
|
15
31
|
key: "borderColor",
|
16
32
|
type: "color"
|
17
33
|
}]
|
18
|
-
}, {
|
19
|
-
tab: "Banner Spacing",
|
20
|
-
value: "bannerSpacing",
|
21
|
-
fields: [{
|
22
|
-
label: "Banner Spacing",
|
23
|
-
key: "bannerSpacing",
|
24
|
-
type: "bannerSpacing"
|
25
|
-
}]
|
26
|
-
}, {
|
27
|
-
tab: "Border Radius",
|
28
|
-
value: "borderRadius",
|
29
|
-
fields: [{
|
30
|
-
label: "Border Radius",
|
31
|
-
key: "borderRadius",
|
32
|
-
type: "borderRadius"
|
33
|
-
}]
|
34
34
|
}];
|
35
35
|
export default accordionTitleStyle;
|
@@ -20,8 +20,7 @@ const buttonStyle = [{
|
|
20
20
|
},
|
21
21
|
children: option.text
|
22
22
|
});
|
23
|
-
}
|
24
|
-
themeEnabled: true
|
23
|
+
}
|
25
24
|
}, {
|
26
25
|
label: "Font Size",
|
27
26
|
key: "textSize",
|
@@ -45,8 +44,7 @@ const buttonStyle = [{
|
|
45
44
|
}, {
|
46
45
|
label: "Button Color",
|
47
46
|
key: "bgColor",
|
48
|
-
type: "color"
|
49
|
-
themeEnabled: true
|
47
|
+
type: "color"
|
50
48
|
}, {
|
51
49
|
label: "Border Color",
|
52
50
|
key: "borderColor",
|
@@ -3,12 +3,12 @@ import { Checkbox, FormControlLabel, Grid, Slider, Typography, Box } from "@mui/
|
|
3
3
|
import { squreStyle } from "./radiusStyle";
|
4
4
|
import { getBreakPointsValue } from "../../../helper/theme";
|
5
5
|
import useWindowResize from "../../../hooks/useWindowResize";
|
6
|
-
import { useEditorTheme } from "../../../hooks/useEditorTheme";
|
7
6
|
import { jsx as _jsx } from "react/jsx-runtime";
|
8
7
|
import { jsxs as _jsxs } from "react/jsx-runtime";
|
9
8
|
const BANNER_SPACING_KEYS = ["top", "left", "right", "bottom"];
|
10
9
|
const BannerSpacing = props => {
|
11
10
|
const {
|
11
|
+
value: val,
|
12
12
|
data,
|
13
13
|
onChange,
|
14
14
|
elementProps,
|
@@ -18,21 +18,11 @@ const BannerSpacing = props => {
|
|
18
18
|
key
|
19
19
|
} = data;
|
20
20
|
const lockKeyVal = `lock${key}`;
|
21
|
-
|
22
|
-
const {
|
23
|
-
selectedTheme
|
24
|
-
} = useEditorTheme();
|
25
|
-
const {
|
26
|
-
bannerSpacing,
|
27
|
-
lockbannerSpacing
|
28
|
-
} = selectedTheme?.elementProps?.button || {};
|
29
|
-
const isUserValue = Object.keys(props?.value || {})?.length;
|
30
|
-
const isUserLockedSpacing = typeof elementProps[lockKeyVal] === "boolean";
|
31
|
-
const val = isUserValue ? props?.value : bannerSpacing;
|
32
|
-
let lockSpacing = isUserLockedSpacing ? elementProps[lockKeyVal] : lockbannerSpacing;
|
21
|
+
let lockSpacing = elementProps[lockKeyVal];
|
33
22
|
if (lockSpacing === undefined) {
|
34
23
|
lockSpacing = true;
|
35
24
|
}
|
25
|
+
const [size] = useWindowResize();
|
36
26
|
const value = getBreakPointsValue(val, size?.device);
|
37
27
|
const handleChange = e => {
|
38
28
|
let changeAll = {};
|
@@ -3,35 +3,27 @@ import { Grid, Typography, Slider, FormControlLabel, Checkbox, Box } from "@mui/
|
|
3
3
|
import { radiusStyle } from "./radiusStyle";
|
4
4
|
import useWindowResize from "../../../hooks/useWindowResize";
|
5
5
|
import { getBreakPointsValue } from "../../../helper/theme";
|
6
|
-
import { useEditorTheme } from "../../../hooks/useEditorTheme";
|
7
6
|
import { jsx as _jsx } from "react/jsx-runtime";
|
8
7
|
import { jsxs as _jsxs } from "react/jsx-runtime";
|
9
8
|
const BORDER_RADIUS_KEYS = ["topLeft", "topRight", "bottomLeft", "bottomRight"];
|
10
9
|
const BorderRadius = props => {
|
11
10
|
const {
|
11
|
+
value: val,
|
12
12
|
data,
|
13
13
|
onChange,
|
14
14
|
elementProps,
|
15
15
|
classes
|
16
16
|
} = props;
|
17
|
+
let {
|
18
|
+
lockRadius
|
19
|
+
} = elementProps;
|
20
|
+
if (lockRadius === undefined) {
|
21
|
+
lockRadius = true;
|
22
|
+
}
|
17
23
|
const {
|
18
24
|
key
|
19
25
|
} = data;
|
20
26
|
const [size] = useWindowResize();
|
21
|
-
const {
|
22
|
-
selectedTheme
|
23
|
-
} = useEditorTheme();
|
24
|
-
const {
|
25
|
-
borderRadius,
|
26
|
-
lockRadius: themeLockRadius
|
27
|
-
} = selectedTheme?.elementProps?.button || {};
|
28
|
-
const isUserValue = Object.keys(props?.value || {})?.length;
|
29
|
-
const isUserLockedRadius = typeof elementProps?.lockRadius === "boolean";
|
30
|
-
const val = isUserValue ? props?.value : borderRadius;
|
31
|
-
let lockRadius = isUserLockedRadius ? elementProps?.lockRadius : themeLockRadius;
|
32
|
-
if (lockRadius === undefined) {
|
33
|
-
lockRadius = true;
|
34
|
-
}
|
35
27
|
const value = getBreakPointsValue(val, size?.device);
|
36
28
|
const handleChange = e => {
|
37
29
|
let changeAll = {};
|
@@ -1,44 +1,22 @@
|
|
1
|
-
import React, { useEffect,
|
1
|
+
import React, { useEffect, useState } from "react";
|
2
2
|
import { Grid, TextField, InputAdornment, Typography } from "@mui/material";
|
3
3
|
import ColorPickerButton from "../../ColorPickerButton";
|
4
|
-
import { useSlateStatic } from "slate-react";
|
5
|
-
import { getElementStyle, getVariableValue } from "../../../helper/theme";
|
6
4
|
import { jsx as _jsx } from "react/jsx-runtime";
|
7
5
|
import { jsxs as _jsxs } from "react/jsx-runtime";
|
8
|
-
const MAP_STYLE_PROPS = {
|
9
|
-
bgColor: "background-color",
|
10
|
-
textColor: "color"
|
11
|
-
};
|
12
6
|
const Color = props => {
|
13
7
|
const {
|
14
|
-
value
|
8
|
+
value,
|
15
9
|
data,
|
16
10
|
onChange,
|
17
|
-
classes
|
18
|
-
elementProps,
|
19
|
-
handleClose,
|
20
|
-
customProps
|
11
|
+
classes
|
21
12
|
} = props;
|
22
13
|
const {
|
23
14
|
key,
|
24
15
|
label
|
25
16
|
} = data;
|
26
17
|
const [recentColors, setRecentColors] = useState({});
|
27
|
-
const editor = useSlateStatic();
|
28
|
-
const {
|
29
|
-
value,
|
30
|
-
inputValue
|
31
|
-
} = useMemo(() => {
|
32
|
-
const isVariable = val && val.startsWith("var");
|
33
|
-
const value = isVariable ? val : getElementStyle(editor, elementProps, MAP_STYLE_PROPS[key]);
|
34
|
-
const inputValue = isVariable ? getVariableValue(val) : getElementStyle(editor, elementProps, MAP_STYLE_PROPS[key]);
|
35
|
-
return {
|
36
|
-
value: value || val,
|
37
|
-
inputValue: inputValue || val
|
38
|
-
};
|
39
|
-
}, [editor, val]);
|
40
18
|
useEffect(() => {
|
41
|
-
const storedColors = JSON.parse(localStorage.getItem(
|
19
|
+
const storedColors = JSON.parse(localStorage.getItem('recentColors'));
|
42
20
|
if (storedColors) {
|
43
21
|
setRecentColors(storedColors);
|
44
22
|
}
|
@@ -61,7 +39,7 @@ const Color = props => {
|
|
61
39
|
[key]: updatedColors
|
62
40
|
};
|
63
41
|
setRecentColors(updatedColors);
|
64
|
-
localStorage.setItem(
|
42
|
+
localStorage.setItem('recentColors', JSON.stringify(updatedColors));
|
65
43
|
};
|
66
44
|
return /*#__PURE__*/_jsxs(Grid, {
|
67
45
|
item: true,
|
@@ -78,7 +56,7 @@ const Color = props => {
|
|
78
56
|
children: label
|
79
57
|
}), /*#__PURE__*/_jsx(TextField, {
|
80
58
|
fullWidth: true,
|
81
|
-
value:
|
59
|
+
value: value,
|
82
60
|
placeholder: `${label} color code`,
|
83
61
|
InputLabelProps: {
|
84
62
|
shrink: true
|
@@ -90,9 +68,7 @@ const Color = props => {
|
|
90
68
|
classes: classes,
|
91
69
|
value: value,
|
92
70
|
onSave: onSave,
|
93
|
-
recentColors: recentColors[key]
|
94
|
-
handleClose: handleClose,
|
95
|
-
disableEditTheme: customProps?.disableEditTheme
|
71
|
+
recentColors: recentColors[key]
|
96
72
|
})
|
97
73
|
})
|
98
74
|
}
|