@flozy/editor 5.3.4 → 5.3.5

Sign up to get free protection for your applications and to get access to all the features.
@@ -499,6 +499,14 @@ blockquote {
499
499
  text-transform: none;
500
500
  }
501
501
 
502
+ .MuiButton-root.primaryBtn:disabled {
503
+ background: #eee !important;
504
+ box-shadow: none !important;
505
+ color: #ccc !important;
506
+ border: 1px solid #ccc !important;
507
+ cursor: not-allowed;
508
+ }
509
+
502
510
  .MuiButton-root.primaryBtn.disabled,
503
511
  .MuiButton-root.secondaryBtn.disabled {
504
512
  background: #eee;
@@ -1,5 +1,5 @@
1
1
  import React, { useCallback, useRef, useState, useEffect } from "react";
2
- import { createEditor } from "slate";
2
+ import { createEditor, Range } from "slate";
3
3
  import { Slate, Editable } from "slate-react";
4
4
  import { useDebounce } from "use-debounce";
5
5
  import { getBlock, getMarked } from "./utils/SlateUtilityFunctions";
@@ -115,6 +115,20 @@ const MiniEditor = props => {
115
115
  event,
116
116
  editor
117
117
  });
118
+ } else if (event.key === "Backspace") {
119
+ const {
120
+ selection
121
+ } = editor;
122
+ event.preventDefault();
123
+ if (selection) {
124
+ if (!Range.isCollapsed(selection)) {
125
+ editor.deleteFragment();
126
+ } else {
127
+ editor.deleteBackward({
128
+ unit: "character"
129
+ });
130
+ }
131
+ }
118
132
  }
119
133
  }, [chars, editor, target, mentions, setMentions, search, type, mentionsRef]);
120
134
  const renderElement = useCallback(props => {
@@ -6,7 +6,8 @@ const fieldStyle = [{
6
6
  fields: [{
7
7
  label: "Field Name",
8
8
  key: "name",
9
- type: "text"
9
+ type: "text",
10
+ required: true
10
11
  }, {
11
12
  label: "Field Type",
12
13
  key: "element",
@@ -11,13 +11,21 @@ const Text = props => {
11
11
  const {
12
12
  key,
13
13
  placeholder,
14
- width
14
+ width,
15
+ required = false
15
16
  } = data;
16
17
  const [value, setValue] = useState(pro_value);
18
+ const [error, setError] = useState(false);
17
19
  const handleChange = e => {
18
- setValue(e.target.value);
20
+ const newValue = e.target.value;
21
+ setValue(newValue);
22
+ if (required && !newValue.trim()) {
23
+ setError(true);
24
+ } else {
25
+ setError(false);
26
+ }
19
27
  onChange({
20
- [key]: e.target.value
28
+ [key]: newValue
21
29
  });
22
30
  };
23
31
  return /*#__PURE__*/_jsxs(Grid, {
@@ -39,7 +47,10 @@ const Text = props => {
39
47
  value: value,
40
48
  onChange: handleChange,
41
49
  size: "small",
42
- fullWidth: true
50
+ fullWidth: true,
51
+ required: required,
52
+ error: error,
53
+ helperText: error ? 'This field is required' : ''
43
54
  })]
44
55
  });
45
56
  };
@@ -69,6 +69,7 @@ const StyleBuilder = props => {
69
69
  const isMobile = customProps?.isMobile || false;
70
70
  const [elementProps, setElementProps] = useState(element);
71
71
  const [tab] = useState(renderTabs[0]?.value);
72
+ const [saveDisable, setSaveDisable] = useState(false);
72
73
  const tabVal = renderTabs?.find(f => f.value === tab);
73
74
  const {
74
75
  needActions = true
@@ -123,12 +124,17 @@ const StyleBuilder = props => {
123
124
  field_type: data?.element
124
125
  });
125
126
  if (data?.hasOwnProperty("name")) {
126
- setElementProps({
127
- ...elementProps,
128
- ...data,
129
- key: data?.name,
130
- label: data?.name
131
- });
127
+ if (data?.name === '') {
128
+ setSaveDisable(true);
129
+ } else {
130
+ setSaveDisable(false);
131
+ setElementProps({
132
+ ...elementProps,
133
+ ...data,
134
+ key: data?.name,
135
+ label: data?.name
136
+ });
137
+ }
132
138
  }
133
139
  };
134
140
  const handleSave = () => {
@@ -239,6 +245,7 @@ const StyleBuilder = props => {
239
245
  children: "Delete"
240
246
  }) : null, /*#__PURE__*/_jsx(Button, {
241
247
  onClick: handleSave,
248
+ disabled: saveDisable,
242
249
  className: "primaryBtn",
243
250
  children: "Save"
244
251
  })]
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@flozy/editor",
3
- "version": "5.3.4",
3
+ "version": "5.3.5",
4
4
  "description": "An Editor for flozy app brain",
5
5
  "files": [
6
6
  "dist"