@flozy/editor 3.8.0 → 3.8.1

Sign up to get free protection for your applications and to get access to all the features.
Files changed (97) hide show
  1. package/dist/Editor/CommonEditor.js +169 -111
  2. package/dist/Editor/Editor.css +1 -12
  3. package/dist/Editor/Elements/AI/AIInput.js +16 -5
  4. package/dist/Editor/Elements/AI/PopoverAIInput.js +31 -17
  5. package/dist/Editor/Elements/AI/Styles.js +2 -1
  6. package/dist/Editor/Elements/AI/VoiceToText/AudioWave.js +73 -0
  7. package/dist/Editor/Elements/AI/VoiceToText/index.js +167 -0
  8. package/dist/Editor/Elements/AI/VoiceToText/style.js +40 -0
  9. package/dist/Editor/Elements/Accordion/Accordion.js +74 -7
  10. package/dist/Editor/Elements/Accordion/AccordionBtnPopup.js +3 -2
  11. package/dist/Editor/Elements/Accordion/AccordionSummary.js +7 -74
  12. package/dist/Editor/Elements/AppHeader/AppHeader.js +26 -4
  13. package/dist/Editor/Elements/Button/EditorButton.js +28 -16
  14. package/dist/Editor/Elements/Color Picker/ColorButtons.js +60 -17
  15. package/dist/Editor/Elements/Color Picker/ColorPicker.css +25 -1
  16. package/dist/Editor/Elements/Color Picker/ColorPicker.js +4 -4
  17. package/dist/Editor/Elements/Color Picker/Styles.js +2 -1
  18. package/dist/Editor/Elements/Embed/Image.js +28 -20
  19. package/dist/Editor/Elements/Embed/Video.js +15 -11
  20. package/dist/Editor/Elements/Form/Workflow/UserInputs.js +2 -1
  21. package/dist/Editor/Elements/Grid/Grid.js +2 -0
  22. package/dist/Editor/Elements/Grid/GridItem.js +3 -1
  23. package/dist/Editor/Elements/Link/Link.js +6 -1
  24. package/dist/Editor/Elements/Link/LinkButton.js +4 -2
  25. package/dist/Editor/Elements/Link/LinkPopup.js +11 -3
  26. package/dist/Editor/Elements/Link/LinkPopupStyles.js +28 -0
  27. package/dist/Editor/Elements/Table/Table.js +1 -1
  28. package/dist/Editor/Elements/Table/TableCell.js +1 -1
  29. package/dist/Editor/MiniEditor.js +3 -1
  30. package/dist/Editor/Toolbar/Basic/index.js +4 -2
  31. package/dist/Editor/Toolbar/FormatTools/Dropdown.js +26 -2
  32. package/dist/Editor/Toolbar/FormatTools/MarkButton.js +2 -2
  33. package/dist/Editor/Toolbar/FormatTools/TextSize.js +5 -11
  34. package/dist/Editor/Toolbar/PopupTool/MiniTextFormat/SelectFontSize.js +4 -11
  35. package/dist/Editor/Toolbar/PopupTool/MiniTextFormat/SelectTypography.js +213 -86
  36. package/dist/Editor/Toolbar/PopupTool/MiniTextFormat/index.js +2 -1
  37. package/dist/Editor/Toolbar/PopupTool/PopupToolStyle.js +20 -13
  38. package/dist/Editor/Toolbar/PopupTool/TextFormat.js +52 -7
  39. package/dist/Editor/Toolbar/PopupTool/ThemeTextFormat.js +438 -0
  40. package/dist/Editor/Toolbar/PopupTool/index.js +6 -5
  41. package/dist/Editor/Toolbar/toolbarGroups.js +48 -6
  42. package/dist/Editor/assets/svg/AIIcons.js +153 -1
  43. package/dist/Editor/assets/svg/ThemeIcons.js +291 -0
  44. package/dist/Editor/common/ColorPickerButton.js +25 -9
  45. package/dist/Editor/common/CustomColorPicker/index.js +106 -0
  46. package/dist/Editor/common/CustomColorPicker/style.js +53 -0
  47. package/dist/Editor/common/CustomDialog/index.js +94 -0
  48. package/dist/Editor/common/CustomDialog/style.js +67 -0
  49. package/dist/Editor/common/CustomSelect.js +33 -0
  50. package/dist/Editor/common/DnD/DragHandleButton.js +1 -1
  51. package/dist/Editor/common/EditorCmds.js +35 -0
  52. package/dist/Editor/common/Icon.js +30 -2
  53. package/dist/Editor/common/LinkSettings/NavComponents.js +5 -2
  54. package/dist/Editor/common/LinkSettings/index.js +2 -1
  55. package/dist/Editor/common/LinkSettings/navOptions.js +7 -2
  56. package/dist/Editor/common/MentionsPopup/Styles.js +5 -2
  57. package/dist/Editor/common/Shorthands/elements.js +54 -0
  58. package/dist/Editor/common/StyleBuilder/accordionTitleBtnStyle.js +7 -7
  59. package/dist/Editor/common/StyleBuilder/accordionTitleStyle.js +16 -16
  60. package/dist/Editor/common/StyleBuilder/buttonStyle.js +4 -2
  61. package/dist/Editor/common/StyleBuilder/fieldTypes/bannerSpacing.js +33 -29
  62. package/dist/Editor/common/StyleBuilder/fieldTypes/borderRadius.js +31 -25
  63. package/dist/Editor/common/StyleBuilder/fieldTypes/buttonLink.js +1 -1
  64. package/dist/Editor/common/StyleBuilder/fieldTypes/color.js +31 -7
  65. package/dist/Editor/common/StyleBuilder/fieldTypes/fontSize.js +13 -4
  66. package/dist/Editor/common/StyleBuilder/fieldTypes/textOptions.js +14 -4
  67. package/dist/Editor/common/StyleBuilder/index.js +1 -1
  68. package/dist/Editor/helper/theme.js +189 -4
  69. package/dist/Editor/hooks/useEditorTheme.js +139 -0
  70. package/dist/Editor/hooks/useMouseMove.js +4 -2
  71. package/dist/Editor/plugins/withEmbeds.js +1 -1
  72. package/dist/Editor/plugins/withHTML.js +47 -5
  73. package/dist/Editor/plugins/withLayout.js +15 -10
  74. package/dist/Editor/plugins/withTable.js +2 -2
  75. package/dist/Editor/theme/ThemeList.js +50 -173
  76. package/dist/Editor/theme/index.js +144 -0
  77. package/dist/Editor/themeSettings/ActiveTheme.js +72 -0
  78. package/dist/Editor/themeSettings/buttons/index.js +290 -0
  79. package/dist/Editor/themeSettings/buttons/style.js +21 -0
  80. package/dist/Editor/themeSettings/colorTheme/index.js +290 -0
  81. package/dist/Editor/themeSettings/colorTheme/style.js +77 -0
  82. package/dist/Editor/themeSettings/fonts/PreviewElement.js +123 -0
  83. package/dist/Editor/themeSettings/fonts/index.js +213 -0
  84. package/dist/Editor/themeSettings/fonts/style.js +44 -0
  85. package/dist/Editor/themeSettings/icons.js +60 -0
  86. package/dist/Editor/themeSettings/index.js +320 -0
  87. package/dist/Editor/themeSettings/style.js +152 -0
  88. package/dist/Editor/themeSettingsAI/icons.js +96 -0
  89. package/dist/Editor/themeSettingsAI/index.js +356 -0
  90. package/dist/Editor/themeSettingsAI/saveTheme.js +190 -0
  91. package/dist/Editor/themeSettingsAI/style.js +247 -0
  92. package/dist/Editor/utils/SlateUtilityFunctions.js +161 -25
  93. package/dist/Editor/utils/button.js +1 -17
  94. package/dist/Editor/utils/events.js +11 -4
  95. package/dist/Editor/utils/font.js +40 -37
  96. package/dist/Editor/utils/helper.js +73 -13
  97. package/package.json +2 -1
@@ -0,0 +1,123 @@
1
+ import { Grid, IconButton, Typography } from "@mui/material";
2
+ import { useEditorTheme } from "../../hooks/useEditorTheme";
3
+ import { PenIcon } from "../icons";
4
+ import useWindowResize from "../../hooks/useWindowResize";
5
+ import { jsx as _jsx } from "react/jsx-runtime";
6
+ import { jsxs as _jsxs } from "react/jsx-runtime";
7
+ const MAP_TEXT_PLACEHOLDER = {
8
+ h1: "Heading 1",
9
+ h2: "Heading 2",
10
+ h3: "Heading 3",
11
+ h4: "Heading 4",
12
+ h5: "Heading 5",
13
+ h6: "Heading 6",
14
+ para1: "Paragraph 1",
15
+ para2: "Paragraph 2",
16
+ para3: "Paragraph 3"
17
+ };
18
+ const MAP_COMP = {
19
+ para1: "p",
20
+ para2: "p",
21
+ para3: "p"
22
+ };
23
+ function getPreviewElementStyle(styleProperty, elementId) {
24
+ const element = document.getElementById(elementId);
25
+ if (element) {
26
+ const computedStyle = window.getComputedStyle(element);
27
+ return computedStyle.getPropertyValue(styleProperty) || "";
28
+ }
29
+ }
30
+ function getTextSettings(elementId, otherStyles = {}) {
31
+ return {
32
+ fontFamily: getPreviewElementStyle("font-family", elementId),
33
+ fontSize: getPreviewElementStyle("font-size", elementId),
34
+ fontWeight: getPreviewElementStyle("font-weight", elementId),
35
+ fontStyle: getPreviewElementStyle("font-style", elementId),
36
+ textDecoration: getPreviewElementStyle("text-decoration", elementId),
37
+ ...otherStyles
38
+ };
39
+ }
40
+ function getFontSize(fontSize = "", windowSize) {
41
+ let size = "";
42
+ if (typeof fontSize === "string") {
43
+ size = fontSize;
44
+ } else if (typeof fontSize === "object") {
45
+ size = fontSize[windowSize?.device];
46
+ }
47
+ return size?.includes("px") ? size : size + "px";
48
+ }
49
+ function PreviewElement(props) {
50
+ const {
51
+ field,
52
+ selectedField,
53
+ setSelectedField,
54
+ settings,
55
+ setSettings,
56
+ setAnchorEl
57
+ } = props;
58
+ const {
59
+ selectedTheme
60
+ } = useEditorTheme();
61
+ const {
62
+ elementProps = {}
63
+ } = selectedTheme || {};
64
+ const previewElementId = `theme-heading-element-preview-${field}`;
65
+ const Comp = MAP_COMP[field] || field;
66
+ const selectedSettings = selectedField === field ? settings : {};
67
+ const themeStyles = elementProps[field] || {};
68
+ const placeholder = MAP_TEXT_PLACEHOLDER[field];
69
+ const [windowSize] = useWindowResize();
70
+ const fontFamily = getPreviewElementStyle("font-family", previewElementId);
71
+ const {
72
+ fontSize = "",
73
+ color
74
+ } = themeStyles;
75
+ const size = getFontSize(fontSize, windowSize);
76
+ return /*#__PURE__*/_jsxs(Grid, {
77
+ container: true,
78
+ className: "fontTypeItem",
79
+ justifyContent: "space-between",
80
+ alignItems: "center",
81
+ wrap: "nowrap",
82
+ children: [/*#__PURE__*/_jsxs(Grid, {
83
+ item: true,
84
+ children: [/*#__PURE__*/_jsx(Typography, {
85
+ variant: "body1",
86
+ children: /*#__PURE__*/_jsx(Comp, {
87
+ id: previewElementId,
88
+ style: {
89
+ ...themeStyles,
90
+ ...selectedSettings,
91
+ fontSize: size
92
+ },
93
+ className: "preview-theme-text",
94
+ children: placeholder
95
+ })
96
+ }), /*#__PURE__*/_jsxs(Typography, {
97
+ variant: "body2",
98
+ className: "flexAlign typeValue",
99
+ children: [/*#__PURE__*/_jsx(Grid, {
100
+ component: "span",
101
+ className: "dotColor",
102
+ style: {
103
+ background: selectedSettings?.color || color
104
+ }
105
+ }), /*#__PURE__*/_jsxs(Grid, {
106
+ component: "span",
107
+ children: [fontFamily, ",", size]
108
+ })]
109
+ })]
110
+ }), /*#__PURE__*/_jsx(IconButton, {
111
+ className: "editIcon",
112
+ onClick: e => {
113
+ setSettings(getTextSettings(previewElementId, {
114
+ color
115
+ }));
116
+ setSelectedField(field);
117
+ setAnchorEl(e.currentTarget);
118
+ },
119
+ children: /*#__PURE__*/_jsx(PenIcon, {})
120
+ })]
121
+ });
122
+ }
123
+ export default PreviewElement;
@@ -0,0 +1,213 @@
1
+ import React from "react";
2
+ import { Accordion, AccordionDetails, AccordionSummary, Checkbox, Divider, Fade, FormControlLabel, Grid, Paper, Popper, Typography, styled } from "@mui/material";
3
+ import ExpandMoreIcon from "@mui/icons-material/ExpandMore";
4
+
5
+ // Style
6
+ import Style from "./style";
7
+ import ThemeTextFormat from "../../Toolbar/PopupTool/ThemeTextFormat";
8
+ import { useEditorContext } from "../../hooks/useMouseMove";
9
+ import usePopupStyle from "../../Toolbar/PopupTool/PopupToolStyle";
10
+ import useWindowResize from "../../hooks/useWindowResize";
11
+ import PopperHeader from "../../Toolbar/PopupTool/PopperHeader";
12
+ import { useEditorTheme } from "../../hooks/useEditorTheme";
13
+ import { fontOptions } from "../../utils/font";
14
+ import CustomSelect from "../../common/CustomSelect";
15
+ import { HEADING_THEME_FIELDS, PARAGRAPH_THEME_FIELDS } from "../../helper/theme";
16
+ import PreviewElement from "./PreviewElement";
17
+ import { jsx as _jsx } from "react/jsx-runtime";
18
+ import { jsxs as _jsxs } from "react/jsx-runtime";
19
+ const Fonts = props => {
20
+ const {
21
+ className
22
+ } = props;
23
+ const [anchorEl, setAnchorEl] = React.useState();
24
+ const [selectedField, setSelectedField] = React.useState("");
25
+ const [settings, setSettings] = React.useState({});
26
+ const updateSettings = update => {
27
+ setSettings(prev => {
28
+ return {
29
+ ...prev,
30
+ ...update
31
+ };
32
+ });
33
+ };
34
+ const onClose = () => {
35
+ setAnchorEl(null);
36
+ setSelectedField("");
37
+ setSettings({});
38
+ };
39
+ const {
40
+ theme
41
+ } = useEditorContext();
42
+ const classes = usePopupStyle(theme);
43
+ const [size] = useWindowResize();
44
+ const {
45
+ selectedTheme,
46
+ updateTheme
47
+ } = useEditorTheme();
48
+ const {
49
+ otherProps = {}
50
+ } = selectedTheme || {};
51
+ const {
52
+ isHeadingCustomized,
53
+ headingFontFamily,
54
+ isParagraphCustomized,
55
+ paragraphFontFamily
56
+ } = otherProps;
57
+ const onSaveTextSettings = () => {
58
+ updateTheme(settings, {
59
+ action: "ELEMENT_PROPS_CHANGE",
60
+ fieldName: selectedField
61
+ });
62
+ onClose();
63
+ };
64
+ const updateOtherThemeProps = update => {
65
+ updateTheme(update, {
66
+ action: "OTHER_PROPS_CHANGE"
67
+ });
68
+ };
69
+ const updateFont = (update, fieldType) => {
70
+ updateTheme(update, {
71
+ action: "FONT_CHANGE",
72
+ fieldType
73
+ });
74
+ };
75
+ const tabs = [{
76
+ title: "Heading Font family",
77
+ onFontFamilyChange: e => {
78
+ const fontFamily = fontOptions.find(f => f.value === e.target.value)?.text;
79
+ updateFont({
80
+ fontFamily
81
+ }, "HEADING");
82
+ updateSettings({
83
+ fontFamily
84
+ });
85
+ },
86
+ fontFamily: headingFontFamily ? fontOptions?.find(f => f.text === headingFontFamily)?.value : fontOptions[0].value,
87
+ isCustomized: isHeadingCustomized,
88
+ onCustomizeClick: event => {
89
+ updateOtherThemeProps({
90
+ isHeadingCustomized: event.target.checked
91
+ });
92
+ },
93
+ fields: HEADING_THEME_FIELDS
94
+ }, {
95
+ title: "Paragraph Font family",
96
+ onFontFamilyChange: e => {
97
+ const fontFamily = fontOptions.find(f => f.value === e.target.value)?.text;
98
+ updateFont({
99
+ fontFamily
100
+ }, "PARAGRAPH");
101
+ updateSettings({
102
+ fontFamily
103
+ });
104
+ },
105
+ fontFamily: paragraphFontFamily ? fontOptions?.find(f => f.text === paragraphFontFamily)?.value : fontOptions[0].value,
106
+ isCustomized: isParagraphCustomized,
107
+ onCustomizeClick: event => {
108
+ updateOtherThemeProps({
109
+ isParagraphCustomized: event.target.checked
110
+ });
111
+ },
112
+ fields: PARAGRAPH_THEME_FIELDS
113
+ }];
114
+ return /*#__PURE__*/_jsxs(Grid, {
115
+ className: className,
116
+ children: [/*#__PURE__*/_jsxs(Accordion, {
117
+ className: "settingAccordion",
118
+ children: [/*#__PURE__*/_jsx(AccordionSummary, {
119
+ expandIcon: /*#__PURE__*/_jsx(ExpandMoreIcon, {}),
120
+ "aria-controls": "panel1-content",
121
+ id: "panel1-header",
122
+ children: "Fonts"
123
+ }), /*#__PURE__*/_jsx(AccordionDetails, {
124
+ children: tabs?.map((tab, i) => {
125
+ const {
126
+ title,
127
+ onFontFamilyChange,
128
+ fontFamily,
129
+ isCustomized = "",
130
+ onCustomizeClick,
131
+ fields
132
+ } = tab;
133
+ return /*#__PURE__*/_jsxs(React.Fragment, {
134
+ children: [/*#__PURE__*/_jsxs(Grid, {
135
+ sx: {
136
+ pt: 2
137
+ },
138
+ children: [/*#__PURE__*/_jsx(Typography, {
139
+ variant: "body2",
140
+ sx: {
141
+ pb: 1
142
+ },
143
+ className: "fs-14 fw-500",
144
+ children: title
145
+ }), /*#__PURE__*/_jsx(CustomSelect, {
146
+ options: fontOptions,
147
+ onChange: onFontFamilyChange,
148
+ value: fontFamily
149
+ }), /*#__PURE__*/_jsx(FormControlLabel, {
150
+ control: /*#__PURE__*/_jsx(Checkbox, {
151
+ checked: isCustomized,
152
+ onChange: onCustomizeClick,
153
+ size: "small"
154
+ }),
155
+ label: /*#__PURE__*/_jsx(Typography, {
156
+ variant: "body2",
157
+ className: "fs-12",
158
+ children: "Customize Font style"
159
+ })
160
+ }), isCustomized && /*#__PURE__*/_jsx(Grid, {
161
+ ref: anchorEl,
162
+ children: fields.map((field, index) => {
163
+ return /*#__PURE__*/_jsx(PreviewElement, {
164
+ field: field,
165
+ settings: settings,
166
+ setSettings: setSettings,
167
+ setAnchorEl: setAnchorEl,
168
+ selectedField: selectedField,
169
+ setSelectedField: setSelectedField
170
+ }, index);
171
+ })
172
+ })]
173
+ }), i === 0 && /*#__PURE__*/_jsx(Divider, {
174
+ sx: {
175
+ mt: 1,
176
+ mb: 1
177
+ }
178
+ })]
179
+ }, i);
180
+ })
181
+ })]
182
+ }), /*#__PURE__*/_jsx(Popper, {
183
+ open: Boolean(anchorEl),
184
+ anchorEl: anchorEl,
185
+ transition: true,
186
+ placement: "left-start",
187
+ sx: classes.popupWrapper,
188
+ className: `tools-drawer ${size?.device} textSettings`,
189
+ children: ({
190
+ TransitionProps
191
+ }) => /*#__PURE__*/_jsx(Fade, {
192
+ ...TransitionProps,
193
+ children: /*#__PURE__*/_jsxs(Paper, {
194
+ style: {
195
+ borderRadius: "10px",
196
+ position: "relative"
197
+ },
198
+ children: [/*#__PURE__*/_jsx(PopperHeader, {
199
+ title: "Text Settings",
200
+ classes: classes,
201
+ onClose: onClose
202
+ }), /*#__PURE__*/_jsx(ThemeTextFormat, {
203
+ settings: settings,
204
+ updateSettings: updateSettings,
205
+ onSaveTextSettings: onSaveTextSettings,
206
+ onClose: onClose
207
+ })]
208
+ })
209
+ })
210
+ })]
211
+ });
212
+ };
213
+ export default styled(Fonts)(Style);
@@ -0,0 +1,44 @@
1
+ const Style = () => ({
2
+ ".settingAccordion": {
3
+ ".MuiOutlinedInput-root": {
4
+ borderRadius: "8px",
5
+ boxShadow: "0px 4px 16px 0px #0000000D"
6
+ }
7
+ },
8
+ ".fontTypeItem": {
9
+ padding: "6px 10px",
10
+ width: "calc(100% + 20px)",
11
+ margin: "0 -10px",
12
+ "&:hover": {
13
+ background: "#ECF2FF",
14
+ ".editIcon": {
15
+ opacity: "1",
16
+ visibility: "visible"
17
+ }
18
+ },
19
+ ".editIcon": {
20
+ opacity: "0",
21
+ visibility: "hidden",
22
+ width: "30px",
23
+ height: "30px"
24
+ }
25
+ },
26
+ ".typeValue": {
27
+ fontSize: "12px",
28
+ color: "#64748B",
29
+ ".dotColor": {
30
+ width: "12px",
31
+ height: "12px",
32
+ borderRadius: "12px",
33
+ background: "#0F172A",
34
+ marginRight: "3px"
35
+ }
36
+ },
37
+ ".preview-theme-text": {
38
+ width: "200px",
39
+ whiteSpace: "nowrap",
40
+ overflow: "hidden",
41
+ textOverflow: "ellipsis"
42
+ }
43
+ });
44
+ export default Style;
@@ -0,0 +1,60 @@
1
+ import { jsx as _jsx } from "react/jsx-runtime";
2
+ import { jsxs as _jsxs } from "react/jsx-runtime";
3
+ export const TickIcon = () => /*#__PURE__*/_jsxs("svg", {
4
+ className: "tickIcon",
5
+ xmlns: "http://www.w3.org/2000/svg",
6
+ width: "26",
7
+ height: "26",
8
+ viewBox: "0 0 26 26",
9
+ fill: "none",
10
+ children: [/*#__PURE__*/_jsx("rect", {
11
+ x: "0.5",
12
+ y: "0.5",
13
+ width: "25",
14
+ height: "25",
15
+ rx: "12.5",
16
+ fill: "#2563EB",
17
+ stroke: "white"
18
+ }), /*#__PURE__*/_jsx("path", {
19
+ d: "M7 13.105L11.0011 17.21L19 9",
20
+ stroke: "white",
21
+ strokeWidth: "1.5",
22
+ strokeLinecap: "round",
23
+ strokeLinejoin: "round"
24
+ })]
25
+ });
26
+ export const EditIcon = () => /*#__PURE__*/_jsxs("svg", {
27
+ className: "editIcon",
28
+ xmlns: "http://www.w3.org/2000/svg",
29
+ width: "16",
30
+ height: "16",
31
+ viewBox: "0 0 16 16",
32
+ fill: "none",
33
+ children: [/*#__PURE__*/_jsx("circle", {
34
+ cx: "8",
35
+ cy: "8",
36
+ r: "8",
37
+ fill: "#2563EB",
38
+ fillOpacity: "0.14"
39
+ }), /*#__PURE__*/_jsx("path", {
40
+ d: "M11.3066 4.69573C10.3941 3.77831 9.50211 3.75792 8.5642 4.69573L7.98821 5.26658C7.93723 5.31754 7.92194 5.3889 7.94233 5.45516C8.29914 6.70387 9.29822 7.70284 10.5471 8.05962C10.5623 8.06472 10.5878 8.06472 10.6031 8.06472C10.6541 8.06472 10.7051 8.04433 10.7408 8.00865L11.3066 7.43781C11.7704 6.974 11.9998 6.53058 11.9998 6.07697C11.9998 5.61825 11.7704 5.16464 11.3066 4.69573Z",
41
+ fill: "#2563EB"
42
+ }), /*#__PURE__*/_jsx("path", {
43
+ d: "M9.69545 8.48831C9.55783 8.42206 9.4253 8.3558 9.30296 8.27935C9.20102 8.21819 9.09907 8.15193 9.00223 8.08058C8.92067 8.02961 8.82892 7.95316 8.73717 7.87671C8.72697 7.87161 8.69639 7.84613 8.65561 7.80535C8.4976 7.67793 8.32939 7.50464 8.17137 7.31606C8.16118 7.30587 8.1306 7.27529 8.10511 7.22942C8.05414 7.17336 7.97768 7.07652 7.91141 6.96949C7.85534 6.89813 7.78908 6.7962 7.72791 6.68916C7.65145 6.56175 7.58519 6.43433 7.52402 6.30181C7.45776 6.1591 7.40679 6.02659 7.36091 5.89917L4.61859 8.64122C4.44019 8.8196 4.26688 9.15599 4.2312 9.40573L4.01202 10.9246C3.96614 11.2457 4.0528 11.5464 4.25159 11.7451C4.4198 11.9133 4.64917 12 4.90404 12C4.96011 12 5.01618 11.9949 5.07225 11.9898L6.58613 11.7757C6.83589 11.74 7.17231 11.5718 7.35072 11.3884L10.093 8.64631C9.96561 8.60554 9.83818 8.54948 9.69545 8.48831Z",
44
+ fill: "#2563EB"
45
+ })]
46
+ });
47
+ export const PenIcon = () => /*#__PURE__*/_jsxs("svg", {
48
+ xmlns: "http://www.w3.org/2000/svg",
49
+ width: "14",
50
+ height: "14",
51
+ viewBox: "0 0 14 14",
52
+ fill: "none",
53
+ children: [/*#__PURE__*/_jsx("path", {
54
+ d: "M12.7874 1.21754C11.1907 -0.387958 9.62966 -0.423636 7.98833 1.21754L6.98034 2.21652C6.89114 2.30571 6.86438 2.43058 6.90006 2.54653C7.52448 4.7318 9.27285 6.48 11.4583 7.10436C11.4851 7.11328 11.5297 7.11328 11.5564 7.11328C11.6456 7.11328 11.7349 7.07761 11.7973 7.01517L12.7874 6.01619C13.5992 5.20452 14.0006 4.42853 14.0006 3.63471C14.0006 2.83196 13.5992 2.03813 12.7874 1.21754Z",
55
+ fill: "#2563EB"
56
+ }), /*#__PURE__*/_jsx("path", {
57
+ d: "M9.96704 7.85451C9.7262 7.73856 9.49427 7.62261 9.28019 7.48882C9.10178 7.38178 8.92338 7.26583 8.75389 7.14096C8.61117 7.05177 8.45061 6.91798 8.29004 6.78419C8.2722 6.77527 8.21868 6.73067 8.14732 6.65932C7.8708 6.43633 7.57643 6.13308 7.2999 5.80306C7.28206 5.78522 7.22854 5.73171 7.18394 5.65143C7.09474 5.55332 6.96094 5.38385 6.84497 5.19655C6.74685 5.07168 6.63089 4.89329 6.52385 4.70598C6.39005 4.483 6.27408 4.26002 6.16704 4.02811C6.05108 3.77837 5.96188 3.54647 5.88159 3.32349L1.08253 8.12209C0.770327 8.43427 0.46704 9.02294 0.404599 9.45999L0.0210312 12.118C-0.0592505 12.6799 0.0923925 13.2061 0.44028 13.554C0.734646 13.8483 1.13605 13.9999 1.58206 13.9999C1.68019 13.9999 1.77831 13.991 1.87643 13.9821L4.52573 13.6075C4.96282 13.545 5.55155 13.2507 5.86375 12.9296L10.6628 8.13101C10.4398 8.05965 10.2168 7.96154 9.96704 7.85451Z",
58
+ fill: "#2563EB"
59
+ })]
60
+ });