@flozy/editor 3.8.4 → 3.8.5

Sign up to get free protection for your applications and to get access to all the features.
@@ -245,6 +245,13 @@ blockquote {
245
245
  width: 17px !important;
246
246
  }
247
247
 
248
+ .react-datepicker__input-container input {
249
+ height: 40px !important;
250
+ border: 1px solid #ccc;
251
+ border-radius: 5px;
252
+ width: 100%;
253
+ }
254
+
248
255
  .close-popupbtn {
249
256
  border-radius: 4px !important;
250
257
  width: 24px;
@@ -13,7 +13,8 @@ const LinkPopup = props => {
13
13
  handleInsertLink,
14
14
  theme
15
15
  } = props;
16
- const classes = LinkPopupStyles(theme);
16
+ const themeType = localStorage.getItem("themeType");
17
+ const classes = LinkPopupStyles(themeType);
17
18
  return /*#__PURE__*/_jsxs(Dialog, {
18
19
  fullWidth: true,
19
20
  open: open,
@@ -55,8 +56,7 @@ const LinkPopup = props => {
55
56
  name: "name",
56
57
  placeholder: "Link Title",
57
58
  onChange: handleInputChange,
58
- sx: classes.addLinkField,
59
- className: classes.addLinkField
59
+ sx: classes.addLinkField
60
60
  })
61
61
  }), /*#__PURE__*/_jsx(Grid, {
62
62
  item: true,
@@ -71,8 +71,7 @@ const LinkPopup = props => {
71
71
  value: linkData?.url,
72
72
  placeholder: "https://google.com",
73
73
  onChange: handleInputChange,
74
- sx: classes.addLinkField,
75
- className: classes.addLinkField
74
+ sx: classes.addLinkField
76
75
  })
77
76
  }), /*#__PURE__*/_jsx(Grid, {
78
77
  item: true,
@@ -1,16 +1,16 @@
1
- const LinkPopupStyles = theme => ({
1
+ const LinkPopupStyles = themeType => ({
2
2
  addLinkField: {
3
3
  "& .MuiOutlinedInput-input": {
4
4
  fontSize: "12px",
5
5
  fontWeight: 500,
6
- color: `${theme?.palette?.editor?.textColor} !important`
6
+ color: themeType === "dark" ? "#FFFFFF !important" : "#000000 !important"
7
7
  },
8
8
  "& .MuiFormHelperText-root": {
9
- color: `${theme?.palette?.editor?.textColor} !important`
9
+ color: themeType === "dark" ? "#FFFFFF !important" : "#000000 !important"
10
10
  },
11
11
  "& .MuiOutlinedInput-root": {
12
12
  boxShadow: "0px 4px 10px rgba(0, 0, 0, 0.16)",
13
- color: `${theme?.palette?.editor?.textColor} !important`,
13
+ color: themeType === "dark" ? "#FFFFFF !important" : "#000000 !important",
14
14
  borderRadius: "7px",
15
15
  "& fieldset": {
16
16
  borderColor: "#D8DDE1"
@@ -263,7 +263,12 @@ const SignaturePopup = props => {
263
263
  name: "signedBy",
264
264
  placeholder: "Enter Name",
265
265
  size: "small",
266
- onChange: onChange
266
+ onChange: onChange,
267
+ sx: {
268
+ '& .MuiOutlinedInput-root .MuiOutlinedInput-notchedOutline': {
269
+ borderColor: '#ccc'
270
+ }
271
+ }
267
272
  })
268
273
  })]
269
274
  }), /*#__PURE__*/_jsxs(Grid, {
@@ -311,7 +316,8 @@ const SignaturePopup = props => {
311
316
  },
312
317
  children: [/*#__PURE__*/_jsx(Grid, {
313
318
  style: {
314
- marginRight: "8px"
319
+ marginRight: "8px",
320
+ minWidth: '44px'
315
321
  },
316
322
  children: /*#__PURE__*/_jsx("label", {
317
323
  htmlFor: "signedByEmail",
@@ -326,7 +332,12 @@ const SignaturePopup = props => {
326
332
  name: "signedByEmail",
327
333
  placeholder: "Enter Email",
328
334
  size: "small",
329
- onChange: onChange
335
+ onChange: onChange,
336
+ sx: {
337
+ '& .MuiOutlinedInput-root .MuiOutlinedInput-notchedOutline': {
338
+ borderColor: '#ccc'
339
+ }
340
+ }
330
341
  })
331
342
  })]
332
343
  })]
@@ -36,11 +36,12 @@ export default function LinkSettings(props) {
36
36
  customProps,
37
37
  navType
38
38
  } = props;
39
+ const themeType = localStorage.getItem("themeType");
39
40
  const {
40
41
  isMobile
41
42
  } = customProps;
42
43
  const navOptions = getNavOptions(customProps.hideTools);
43
- const classes = LinkSettingsStyles();
44
+ const classes = LinkSettingsStyles(themeType);
44
45
  const [nav, setNav] = useState(getNav(navType, navOptions));
45
46
  const [navValue, setNavValue] = useState(props?.navValue || "");
46
47
  const [openInNewTab, setOpenInNewTab] = useState(props.openInNewTab || false);
@@ -1,32 +1,35 @@
1
- const ButtonNavSettingsStyles = () => ({
1
+ const ButtonNavSettingsStyles = themeType => ({
2
2
  dialogContainer: {
3
- '& .MuiDialogContent-root': {
3
+ "& .MuiPaper-root": {
4
+ background: themeType === "dark" ? "#141720 !important" : "#ffffff !important"
5
+ },
6
+ "& .MuiDialogContent-root": {
4
7
  padding: "0px 20px"
5
8
  },
6
- '& .MuiDialogActions-root': {
9
+ "& .MuiDialogActions-root": {
7
10
  padding: "10px"
8
11
  },
9
- '& .MuiTypography-h6': {
12
+ "& .MuiTypography-h6": {
10
13
  fontWeight: 600,
11
14
  fontSize: "16px",
12
15
  paddingRight: "20px"
13
16
  },
14
17
  "& .MuiGrid-container": {
15
- marginTop: '0px'
18
+ marginTop: "0px"
16
19
  },
17
20
  "& .MuiGrid-item": {
18
21
  padding: "14px"
19
22
  }
20
23
  },
21
24
  saveBtn: {
22
- color: '#fff',
25
+ color: "#fff",
23
26
  background: "#2563EB",
24
27
  fontSize: "14px",
25
28
  fontWeight: 500,
26
29
  padding: "4px 24px",
27
30
  textTransform: "none",
28
31
  "&:hover": {
29
- color: '#fff',
32
+ color: "#fff",
30
33
  background: "#2563EB"
31
34
  }
32
35
  },
@@ -43,7 +46,7 @@ const ButtonNavSettingsStyles = () => ({
43
46
  }
44
47
  },
45
48
  closeIcon: {
46
- position: 'absolute',
49
+ position: "absolute",
47
50
  right: 8,
48
51
  top: 8,
49
52
  color: theme => theme.palette.grey[500]
@@ -1,4 +1,4 @@
1
- import { Editor, Transforms, Element, Node, Path } from "slate";
1
+ import { Editor, Transforms, Element, Node, Path, Range } from "slate";
2
2
  import { toggleBlock } from "./SlateUtilityFunctions";
3
3
  import insertNewLine from "./insertNewLine";
4
4
  import { insertAccordion } from "./accordion";
@@ -179,7 +179,6 @@ const checkListEnterEvent = (editor, type) => {
179
179
  export const enterEvent = (e, editor, isMobile) => {
180
180
  try {
181
181
  const ele = isListItem(editor);
182
-
183
182
  // on shift enter break line in same node
184
183
  if (e.shiftKey && !isMobile) {
185
184
  e.preventDefault();
@@ -188,6 +187,7 @@ export const enterEvent = (e, editor, isMobile) => {
188
187
  const {
189
188
  type
190
189
  } = ele[0];
190
+ const path = ele[1];
191
191
  const text = Node.string(ele[0]);
192
192
  switch (type) {
193
193
  case "list-item":
@@ -219,6 +219,58 @@ export const enterEvent = (e, editor, isMobile) => {
219
219
  insertAccordion(editor, nextPath);
220
220
  }
221
221
  break;
222
+ case "headingOne":
223
+ case "headingTwo":
224
+ case "headingThree":
225
+ const {
226
+ selection
227
+ } = editor;
228
+ if (selection && Range.isCollapsed(selection)) {
229
+ const isAtEnd = Editor.isEnd(editor, selection.anchor, path);
230
+ const isAtStart = Editor.isStart(editor, selection.anchor, path);
231
+ if (isAtEnd) {
232
+ e.preventDefault();
233
+ Transforms.insertNodes(editor, {
234
+ type: 'paragraph',
235
+ children: [{
236
+ text: ''
237
+ }]
238
+ });
239
+ const newLocation = Editor.after(editor, selection);
240
+ if (newLocation) {
241
+ Transforms.select(editor, newLocation);
242
+ }
243
+ } else if (!isAtStart) {
244
+ e.preventDefault();
245
+ Transforms.splitNodes(editor);
246
+ Transforms.setNodes(editor, {
247
+ type: 'paragraph'
248
+ }, {
249
+ at: Editor.after(editor, selection)
250
+ });
251
+ const newLocation = Editor.after(editor, selection);
252
+ if (newLocation) {
253
+ Transforms.select(editor, newLocation);
254
+ }
255
+ } else if (isAtStart) {
256
+ e.preventDefault();
257
+ Transforms.insertNodes(editor, {
258
+ type: 'paragraph',
259
+ children: [{
260
+ text: ''
261
+ }]
262
+ }, {
263
+ at: Editor.before(editor, selection)
264
+ });
265
+ Transforms.select(editor, Editor.before(editor, selection));
266
+ const newLocation = Editor.before(editor, selection);
267
+ if (newLocation) {
268
+ Transforms.select(editor, newLocation);
269
+ }
270
+ }
271
+ return;
272
+ }
273
+ break;
222
274
  default:
223
275
  }
224
276
  }
@@ -146,7 +146,7 @@ export const handleInsertLastElement = (event, editor) => {
146
146
  }
147
147
  };
148
148
  export const isListItem = editor => {
149
- const format = ["list-item", "check-list-item", "accordion-summary"];
149
+ const format = ["list-item", "check-list-item", "accordion-summary", "headingOne", "headingTwo", "headingThree"];
150
150
  const [node] = Editor.nodes(editor, {
151
151
  match: n => !Editor.isEditor(n) && Element.isElement(n) && format.indexOf(n.type) > -1
152
152
  });
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@flozy/editor",
3
- "version": "3.8.4",
3
+ "version": "3.8.5",
4
4
  "description": "An Editor for flozy app brain",
5
5
  "files": [
6
6
  "dist"