@truedat/dq 8.4.9 → 8.5.1

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/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@truedat/dq",
3
- "version": "8.4.9",
3
+ "version": "8.5.1",
4
4
  "description": "Truedat Web Data Quality Module",
5
5
  "sideEffects": false,
6
6
  "module": "src/index.js",
@@ -56,7 +56,7 @@
56
56
  "@testing-library/jest-dom": "^6.6.3",
57
57
  "@testing-library/react": "^16.3.0",
58
58
  "@testing-library/user-event": "^14.6.1",
59
- "@truedat/test": "8.4.9",
59
+ "@truedat/test": "8.5.1",
60
60
  "identity-obj-proxy": "^3.0.0",
61
61
  "jest": "^29.7.0",
62
62
  "redux-saga-test-plan": "^4.0.6"
@@ -89,5 +89,5 @@
89
89
  "semantic-ui-react": "^3.0.0-beta.2",
90
90
  "swr": "^2.3.3"
91
91
  },
92
- "gitHead": "9fd4bd2126a33342009194c8ae1829cd3c617a48"
92
+ "gitHead": "d29d6cba24bb1c464650348851cfaf1911bbedfd"
93
93
  }
@@ -17,15 +17,15 @@ import {
17
17
  import {
18
18
  DomainSelector,
19
19
  HistoryBackButton,
20
- RichTextEditor,
20
+ MarkdownEditor,
21
21
  } from "@truedat/core/components";
22
22
 
23
23
  const ConceptSelector = lazy(
24
- () => import("@truedat/bg/concepts/relations/components/ConceptSelector")
24
+ () => import("@truedat/bg/concepts/relations/components/ConceptSelector"),
25
25
  );
26
26
 
27
27
  const SelectableDynamicForm = lazy(
28
- () => import("@truedat/df/components/SelectableDynamicForm")
28
+ () => import("@truedat/df/components/SelectableDynamicForm"),
29
29
  );
30
30
 
31
31
  export const FieldLabelWrapping = ({
@@ -71,6 +71,7 @@ const filters = {
71
71
  current: [true],
72
72
  status: ["pending_approval", "draft", "rejected", "published"],
73
73
  };
74
+
74
75
  export const RuleForm = ({
75
76
  concept,
76
77
  editMode,
@@ -90,7 +91,7 @@ export const RuleForm = ({
90
91
  domain_id: null,
91
92
  business_concept_id: null,
92
93
  name: "",
93
- description: ruleData ? ruleData.description : {},
94
+ description: ruleData?.description || "",
94
95
  df_content: {},
95
96
  template: null,
96
97
  });
@@ -99,6 +100,7 @@ export const RuleForm = ({
99
100
  if (ruleData) {
100
101
  setRule({
101
102
  ...ruleData,
103
+ description: ruleData.description || "",
102
104
  concept: {
103
105
  name: ruleData?.current_business_concept_version?.name,
104
106
  business_concept_id: ruleData.business_concept_id,
@@ -124,9 +126,6 @@ export const RuleForm = ({
124
126
 
125
127
  const messagesInformed = (messages) => _.some(_.negate(_.isNil))(messages);
126
128
 
127
- const updateDescription = (e, { value }) =>
128
- handleChange(null, { name: "description", value });
129
-
130
129
  const handleChange = (e, { name, value }) => {
131
130
  e && e.preventDefault();
132
131
  updateRule({ [name]: value });
@@ -162,7 +161,7 @@ export const RuleForm = ({
162
161
  setRule(
163
162
  editMode
164
163
  ? { ...rule, concept: null, business_concept_id: null, domain_id }
165
- : { ...rule, domain_id }
164
+ : { ...rule, domain_id },
166
165
  );
167
166
  };
168
167
 
@@ -199,124 +198,120 @@ export const RuleForm = ({
199
198
  : filters;
200
199
 
201
200
  return (
202
- <>
203
- <Form
204
- onSubmit={handleSubmit}
205
- loading={domainsLoading}
206
- className="rule-form"
201
+ <Form
202
+ onSubmit={handleSubmit}
203
+ loading={domainsLoading}
204
+ className="rule-form"
205
+ >
206
+ <Form.Field className="rule-form__field-right">
207
+ <Radio
208
+ name="active"
209
+ label={formatMessage({ id: "rule.props.active" })}
210
+ checked={rule.active}
211
+ toggle
212
+ onChange={handleChangeCheck}
213
+ />
214
+ </Form.Field>
215
+ <FieldLabelWrapping
216
+ label={formatMessage({ id: "rule.props.name" })}
217
+ messages={_.prop("name")(messages)}
218
+ required
207
219
  >
208
- <Form.Field className="rule-form__field-right">
209
- <Radio
210
- name="active"
211
- label={formatMessage({ id: "rule.props.active" })}
212
- checked={rule.active}
213
- toggle
214
- onChange={handleChangeCheck}
215
- />
216
- </Form.Field>
217
- <FieldLabelWrapping
218
- label={formatMessage({ id: "rule.props.name" })}
219
- messages={_.prop("name")(messages)}
220
- required
221
- >
222
- <Form.Input
223
- aria-label={formatMessage({ id: "rule.props.name.placeholder" })}
224
- name="name"
225
- onChange={handleChange}
226
- value={rule.name}
227
- placeholder={formatMessage({ id: "rule.props.name.placeholder" })}
228
- autoComplete="off"
229
- />
230
- </FieldLabelWrapping>
231
- <FieldLabelWrapping
232
- label={formatMessage({ id: "rule.props.description" })}
233
- messages={_.prop("description")(messages)}
234
- >
235
- {rule.description ? (
236
- <RichTextEditor
237
- name="description"
238
- value={rule.description}
239
- onChange={updateDescription}
240
- />
241
- ) : null}
242
- </FieldLabelWrapping>
243
- <FieldLabelWrapping
244
- label={formatMessage({ id: "domain.selector.label" })}
245
- messages={_.prop("domain")(messages)}
220
+ <Form.Input
221
+ aria-label={formatMessage({ id: "rule.props.name.placeholder" })}
222
+ name="name"
223
+ onChange={handleChange}
224
+ value={rule.name}
225
+ placeholder={formatMessage({ id: "rule.props.name.placeholder" })}
226
+ autoComplete="off"
227
+ />
228
+ </FieldLabelWrapping>
229
+ <FieldLabelWrapping
230
+ label={formatMessage({ id: "rule.props.description" })}
231
+ messages={_.prop("description")(messages)}
232
+ >
233
+ <MarkdownEditor
234
+ name="description"
235
+ value={rule.description}
236
+ onChange={handleChange}
237
+ />
238
+ </FieldLabelWrapping>
239
+ <FieldLabelWrapping
240
+ label={formatMessage({ id: "domain.selector.label" })}
241
+ messages={_.prop("domain")(messages)}
242
+ required
243
+ >
244
+ <DomainSelector
245
+ action="manageQualityRule"
246
+ labels
247
+ onChange={handleDomainSelected}
248
+ onLoad={handleDomainsLoaded}
246
249
  required
247
- >
248
- <DomainSelector
249
- action="manageQualityRule"
250
- labels
251
- onChange={handleDomainSelected}
252
- onLoad={handleDomainsLoaded}
253
- required
254
- value={domain_id}
255
- />
256
- </FieldLabelWrapping>
257
- {_.isEmpty(concept) ? (
258
- <Segment disabled={_.isNil(domain_id)}>
259
- <Form.Group inline>
260
- <label className="rule-form-label">
261
- <FormattedMessage id="rule.form.concept.label" />
262
- </label>
263
- {_.path("concept.name")(rule) ? (
264
- <Label size={"medium"}>
265
- {_.flow(
266
- _.path("concept.name"),
267
- _.truncate({ length: 90 })
268
- )(rule)}
269
- <Icon
270
- name="delete"
271
- onClick={() => handleConceptSelected(null)}
272
- />
273
- </Label>
274
- ) : null}
275
- </Form.Group>
276
- <Accordion>
277
- <Accordion.Title
278
- active={activeSelection && !!domain_id}
279
- onClick={handleSelectionClick}
280
- >
281
- <Icon name="dropdown" />
282
- <FormattedMessage id="rule.form.accordion.select" />
283
- </Accordion.Title>
284
- <Accordion.Content active={activeSelection && !!domain_id}>
285
- <ConceptSelector
286
- showTitle={false}
287
- defaultFilters={defaultFilters}
288
- handleConceptSelected={handleConceptSelected}
289
- businessConceptId={rule?.concept?.business_concept_id}
250
+ value={domain_id}
251
+ />
252
+ </FieldLabelWrapping>
253
+ {_.isEmpty(concept) ? (
254
+ <Segment disabled={_.isNil(domain_id)}>
255
+ <Form.Group inline>
256
+ <label className="rule-form-label">
257
+ <FormattedMessage id="rule.form.concept.label" />
258
+ </label>
259
+ {_.path("concept.name")(rule) ? (
260
+ <Label size={"medium"}>
261
+ {_.flow(
262
+ _.path("concept.name"),
263
+ _.truncate({ length: 90 }),
264
+ )(rule)}
265
+ <Icon
266
+ name="delete"
267
+ onClick={() => handleConceptSelected(null)}
290
268
  />
291
- </Accordion.Content>
292
- </Accordion>
293
- </Segment>
294
- ) : null}
295
- <SelectableDynamicForm
296
- scope="dq"
297
- domainIds={_.isNil(domain_id) ? null : [domain_id]}
298
- required
299
- content={rule.df_content}
300
- name={templateName}
301
- isModification={editMode}
302
- onChange={handleContentChange}
303
- onNameChange={(df_name) => setTemplateName(df_name)}
269
+ </Label>
270
+ ) : null}
271
+ </Form.Group>
272
+ <Accordion>
273
+ <Accordion.Title
274
+ active={activeSelection && !!domain_id}
275
+ onClick={handleSelectionClick}
276
+ >
277
+ <Icon name="dropdown" />
278
+ <FormattedMessage id="rule.form.accordion.select" />
279
+ </Accordion.Title>
280
+ <Accordion.Content active={activeSelection && !!domain_id}>
281
+ <ConceptSelector
282
+ showTitle={false}
283
+ defaultFilters={defaultFilters}
284
+ handleConceptSelected={handleConceptSelected}
285
+ businessConceptId={rule?.concept?.business_concept_id}
286
+ />
287
+ </Accordion.Content>
288
+ </Accordion>
289
+ </Segment>
290
+ ) : null}
291
+ <SelectableDynamicForm
292
+ scope="dq"
293
+ domainIds={_.isNil(domain_id) ? null : [domain_id]}
294
+ required
295
+ content={rule.df_content}
296
+ name={templateName}
297
+ isModification={editMode}
298
+ onChange={handleContentChange}
299
+ onNameChange={(df_name) => setTemplateName(df_name)}
300
+ />
301
+ <div className="actions">
302
+ <HistoryBackButton
303
+ content={formatMessage({ id: "actions.cancel" })}
304
+ disabled={isSubmitting}
305
+ />
306
+ <Button
307
+ type="submit"
308
+ primary
309
+ loading={isSubmitting}
310
+ disabled={messagesInformed(messages) || !_.isEmpty(valid)}
311
+ content={formatMessage({ id: "actions.save" })}
304
312
  />
305
- <div className="actions">
306
- <HistoryBackButton
307
- content={formatMessage({ id: "actions.cancel" })}
308
- disabled={isSubmitting}
309
- />
310
- <Button
311
- type="submit"
312
- primary
313
- loading={isSubmitting}
314
- disabled={messagesInformed(messages) || !_.isEmpty(valid)}
315
- content={formatMessage({ id: "actions.save" })}
316
- />
317
- </div>
318
- </Form>
319
- </>
313
+ </div>
314
+ </Form>
320
315
  );
321
316
  };
322
317
 
@@ -4,7 +4,7 @@ import { FormattedMessage } from "react-intl";
4
4
  import { connect } from "react-redux";
5
5
  import { Link } from "react-router";
6
6
  import { List, Label } from "semantic-ui-react";
7
- import RichTextEditor from "@truedat/core/components/RichTextEditor";
7
+ import { MarkdownReader } from "@truedat/core/components";
8
8
  import { linkTo } from "@truedat/core/routes";
9
9
 
10
10
  const getStatusColor = (active) =>
@@ -31,7 +31,7 @@ export const RuleProperties = ({
31
31
  <List.Header as="h3">
32
32
  <FormattedMessage id="concepts.props.description" />
33
33
  </List.Header>
34
- <RichTextEditor readOnly value={description} />
34
+ <MarkdownReader content={description} />
35
35
  </List.Item>
36
36
  )}
37
37
  {!_.isNil(domain_id) && (
@@ -66,7 +66,7 @@ RuleProperties.propTypes = {
66
66
  active: PropTypes.bool,
67
67
  business_concept_id: PropTypes.string,
68
68
  current_business_concept_version: PropTypes.object,
69
- description: PropTypes.object,
69
+ description: PropTypes.string,
70
70
  domain: PropTypes.object,
71
71
  domain_id: PropTypes.number,
72
72
  };
@@ -35,27 +35,7 @@ describe("<EditRule />", () => {
35
35
  const rule = {
36
36
  id: 1,
37
37
  name: "nn",
38
- description: {
39
- document: {
40
- data: {},
41
- nodes: [
42
- {
43
- data: {},
44
- nodes: [
45
- {
46
- marks: [],
47
- object: "text",
48
- text: "rule description",
49
- },
50
- ],
51
- object: "block",
52
- type: "paragraph",
53
- },
54
- ],
55
- object: "document",
56
- },
57
- object: "value",
58
- },
38
+ description: "rule description",
59
39
  };
60
40
  const props = { rule, updateRule };
61
41
 
@@ -137,7 +137,7 @@ describe("<RuleForm />", () => {
137
137
  rule: {
138
138
  active: true,
139
139
  business_concept_id: 11960,
140
- description: {},
140
+ description: "",
141
141
  df_content: {},
142
142
  df_name: undefined,
143
143
  domain_id: 2,
@@ -6,27 +6,7 @@ const rule = {
6
6
  business_concept_id: "2D2B3",
7
7
  domain_id: 1,
8
8
  domain: { id: 1, name: "foo", external_id: "bar" },
9
- description: {
10
- document: {
11
- data: {},
12
- nodes: [
13
- {
14
- data: {},
15
- nodes: [
16
- {
17
- marks: [],
18
- object: "text",
19
- text: "desc",
20
- },
21
- ],
22
- object: "block",
23
- type: "paragraph",
24
- },
25
- ],
26
- object: "document",
27
- },
28
- object: "value",
29
- },
9
+ description: "desc",
30
10
  rule_type: { name: "type1" },
31
11
  };
32
12
 
@@ -77,112 +77,93 @@ exports[`<EditRule /> matches the latest snapshot 1`] = `
77
77
  >
78
78
  rule.props.description
79
79
  </label>
80
- <div>
80
+ <div
81
+ class="markdown-editor"
82
+ >
81
83
  <div
82
- style="border: 1px solid rgba(34, 36, 38, 0.15); border-radius: 0.28571429rem;"
84
+ class="ui small top attached markdown-editor-toolbar menu"
83
85
  >
84
86
  <div
85
- class="ui menu"
87
+ class="item"
86
88
  >
87
- <a
88
- class="icon item"
89
- >
90
- <i
91
- aria-hidden="true"
92
- class="bold icon"
93
- />
94
- </a>
95
- <a
96
- class="icon item"
97
- >
98
- <i
99
- aria-hidden="true"
100
- class="italic icon"
101
- />
102
- </a>
103
- <a
104
- class="icon item"
105
- >
106
- <i
107
- aria-hidden="true"
108
- class="underline icon"
109
- />
110
- </a>
111
- <a
112
- class="icon item"
113
- >
114
- <i
115
- aria-hidden="true"
116
- class="header icon"
117
- />
118
- </a>
119
- <a
120
- class="icon item"
121
- >
122
- <i
123
- aria-hidden="true"
124
- class="h icon"
125
- />
126
- </a>
127
- <a
128
- class="icon item"
129
- >
130
- <i
131
- aria-hidden="true"
132
- class="list ol icon"
133
- />
134
- </a>
135
- <a
136
- class="icon item"
137
- >
138
- <i
139
- aria-hidden="true"
140
- class="list ul icon"
141
- />
142
- </a>
143
- <a
144
- class="icon item"
145
- >
146
- <i
147
- aria-hidden="true"
148
- class="linkify icon"
149
- />
150
- </a>
89
+ <i
90
+ aria-hidden="true"
91
+ class="bold icon"
92
+ />
151
93
  </div>
152
94
  <div
153
- style="padding: 10px;"
95
+ class="item"
96
+ >
97
+ <i
98
+ aria-hidden="true"
99
+ class="italic icon"
100
+ />
101
+ </div>
102
+ <div
103
+ class="item"
104
+ >
105
+ <i
106
+ aria-hidden="true"
107
+ class="underline icon"
108
+ />
109
+ </div>
110
+ <div
111
+ class="item"
112
+ >
113
+ <i
114
+ aria-hidden="true"
115
+ class="heading large icon"
116
+ />
117
+ </div>
118
+ <div
119
+ class="item"
120
+ >
121
+ <i
122
+ aria-hidden="true"
123
+ class="heading small icon"
124
+ />
125
+ </div>
126
+ <div
127
+ class="item"
128
+ >
129
+ <i
130
+ aria-hidden="true"
131
+ class="list ul icon"
132
+ />
133
+ </div>
134
+ <div
135
+ class="item"
136
+ >
137
+ <i
138
+ aria-hidden="true"
139
+ class="list ol icon"
140
+ />
141
+ </div>
142
+ <div
143
+ class="disabled item"
144
+ >
145
+ <i
146
+ aria-hidden="true"
147
+ class="linkify icon"
148
+ />
149
+ </div>
150
+ </div>
151
+ <div
152
+ class="markdown-editor-content"
153
+ >
154
+ <div
155
+ placeholder=""
154
156
  >
155
157
  <div
156
- autocorrect="on"
158
+ class="tiptap ProseMirror"
157
159
  contenteditable="true"
158
- data-gramm="false"
159
- data-key="8"
160
- data-slate-editor="true"
161
160
  role="textbox"
162
- spellcheck="true"
163
- style="outline: none; white-space: pre-wrap; word-wrap: break-word;"
161
+ tabindex="0"
162
+ translate="no"
164
163
  >
165
- <div
166
- data-key="9"
167
- data-slate-object="block"
168
- style="position: relative;"
169
- >
170
- <span
171
- data-key="10"
172
- data-slate-object="text"
173
- >
174
- <span
175
- data-offset-key="10:0"
176
- data-slate-leaf="true"
177
- >
178
- <span
179
- data-slate-string="true"
180
- >
181
- rule description
182
- </span>
183
- </span>
184
- </span>
185
- </div>
164
+ <p>
165
+ rule description
166
+ </p>
186
167
  </div>
187
168
  </div>
188
169
  </div>
@@ -81,120 +81,95 @@ exports[`<NewRule /> matches the latest snapshot (with concept) 1`] = `
81
81
  >
82
82
  rule.props.description
83
83
  </label>
84
- <div>
84
+ <div
85
+ class="markdown-editor"
86
+ >
85
87
  <div
86
- style="border: 1px solid rgba(34, 36, 38, 0.15); border-radius: 0.28571429rem;"
88
+ class="ui small top attached markdown-editor-toolbar menu"
87
89
  >
88
90
  <div
89
- class="ui menu"
91
+ class="item"
90
92
  >
91
- <a
92
- class="icon item"
93
- >
94
- <i
95
- aria-hidden="true"
96
- class="bold icon"
97
- />
98
- </a>
99
- <a
100
- class="icon item"
101
- >
102
- <i
103
- aria-hidden="true"
104
- class="italic icon"
105
- />
106
- </a>
107
- <a
108
- class="icon item"
109
- >
110
- <i
111
- aria-hidden="true"
112
- class="underline icon"
113
- />
114
- </a>
115
- <a
116
- class="icon item"
117
- >
118
- <i
119
- aria-hidden="true"
120
- class="header icon"
121
- />
122
- </a>
123
- <a
124
- class="icon item"
125
- >
126
- <i
127
- aria-hidden="true"
128
- class="h icon"
129
- />
130
- </a>
131
- <a
132
- class="icon item"
133
- >
134
- <i
135
- aria-hidden="true"
136
- class="list ol icon"
137
- />
138
- </a>
139
- <a
140
- class="icon item"
141
- >
142
- <i
143
- aria-hidden="true"
144
- class="list ul icon"
145
- />
146
- </a>
147
- <a
148
- class="icon item"
149
- >
150
- <i
151
- aria-hidden="true"
152
- class="linkify icon"
153
- />
154
- </a>
93
+ <i
94
+ aria-hidden="true"
95
+ class="bold icon"
96
+ />
155
97
  </div>
156
98
  <div
157
- style="padding: 10px;"
99
+ class="item"
100
+ >
101
+ <i
102
+ aria-hidden="true"
103
+ class="italic icon"
104
+ />
105
+ </div>
106
+ <div
107
+ class="item"
108
+ >
109
+ <i
110
+ aria-hidden="true"
111
+ class="underline icon"
112
+ />
113
+ </div>
114
+ <div
115
+ class="item"
116
+ >
117
+ <i
118
+ aria-hidden="true"
119
+ class="heading large icon"
120
+ />
121
+ </div>
122
+ <div
123
+ class="item"
124
+ >
125
+ <i
126
+ aria-hidden="true"
127
+ class="heading small icon"
128
+ />
129
+ </div>
130
+ <div
131
+ class="item"
132
+ >
133
+ <i
134
+ aria-hidden="true"
135
+ class="list ul icon"
136
+ />
137
+ </div>
138
+ <div
139
+ class="item"
140
+ >
141
+ <i
142
+ aria-hidden="true"
143
+ class="list ol icon"
144
+ />
145
+ </div>
146
+ <div
147
+ class="disabled item"
148
+ >
149
+ <i
150
+ aria-hidden="true"
151
+ class="linkify icon"
152
+ />
153
+ </div>
154
+ </div>
155
+ <div
156
+ class="markdown-editor-content"
157
+ >
158
+ <div
159
+ placeholder=""
158
160
  >
159
161
  <div
160
- autocorrect="on"
162
+ class="tiptap ProseMirror"
161
163
  contenteditable="true"
162
- data-gramm="false"
163
- data-key="8"
164
- data-slate-editor="true"
165
164
  role="textbox"
166
- spellcheck="true"
167
- style="outline: none; white-space: pre-wrap; word-wrap: break-word;"
165
+ tabindex="0"
166
+ translate="no"
168
167
  >
169
- <div
170
- data-key="9"
171
- data-slate-object="block"
172
- style="position: relative;"
173
- >
174
- <span
175
- data-key="14"
176
- data-slate-object="text"
177
- >
178
- <span
179
- data-offset-key="14:0"
180
- data-slate-leaf="true"
181
- >
182
- <span>
183
- <span
184
- contenteditable="false"
185
- style="pointer-events: none; display: inline-block; width: 0px; max-width: 100%; white-space: nowrap; opacity: 0.333; vertical-align: text-top;"
186
- />
187
- <span
188
- data-slate-length="0"
189
- data-slate-zero-width="n"
190
- >
191
- 
192
- <br />
193
- </span>
194
- </span>
195
- </span>
196
- </span>
197
- </div>
168
+ <p>
169
+ <br
170
+ class="ProseMirror-trailingBreak"
171
+ />
172
+ </p>
198
173
  </div>
199
174
  </div>
200
175
  </div>
@@ -65,120 +65,95 @@ exports[`<RuleForm /> matches the latest snapshot (edit mode) 1`] = `
65
65
  >
66
66
  rule.props.description
67
67
  </label>
68
- <div>
68
+ <div
69
+ class="markdown-editor"
70
+ >
69
71
  <div
70
- style="border: 1px solid rgba(34, 36, 38, 0.15); border-radius: 0.28571429rem;"
72
+ class="ui small top attached markdown-editor-toolbar menu"
71
73
  >
72
74
  <div
73
- class="ui menu"
75
+ class="item"
74
76
  >
75
- <a
76
- class="icon item"
77
- >
78
- <i
79
- aria-hidden="true"
80
- class="bold icon"
81
- />
82
- </a>
83
- <a
84
- class="icon item"
85
- >
86
- <i
87
- aria-hidden="true"
88
- class="italic icon"
89
- />
90
- </a>
91
- <a
92
- class="icon item"
93
- >
94
- <i
95
- aria-hidden="true"
96
- class="underline icon"
97
- />
98
- </a>
99
- <a
100
- class="icon item"
101
- >
102
- <i
103
- aria-hidden="true"
104
- class="header icon"
105
- />
106
- </a>
107
- <a
108
- class="icon item"
109
- >
110
- <i
111
- aria-hidden="true"
112
- class="h icon"
113
- />
114
- </a>
115
- <a
116
- class="icon item"
117
- >
118
- <i
119
- aria-hidden="true"
120
- class="list ol icon"
121
- />
122
- </a>
123
- <a
124
- class="icon item"
125
- >
126
- <i
127
- aria-hidden="true"
128
- class="list ul icon"
129
- />
130
- </a>
131
- <a
132
- class="icon item"
133
- >
134
- <i
135
- aria-hidden="true"
136
- class="linkify icon"
137
- />
138
- </a>
77
+ <i
78
+ aria-hidden="true"
79
+ class="bold icon"
80
+ />
139
81
  </div>
140
82
  <div
141
- style="padding: 10px;"
83
+ class="item"
84
+ >
85
+ <i
86
+ aria-hidden="true"
87
+ class="italic icon"
88
+ />
89
+ </div>
90
+ <div
91
+ class="item"
92
+ >
93
+ <i
94
+ aria-hidden="true"
95
+ class="underline icon"
96
+ />
97
+ </div>
98
+ <div
99
+ class="item"
100
+ >
101
+ <i
102
+ aria-hidden="true"
103
+ class="heading large icon"
104
+ />
105
+ </div>
106
+ <div
107
+ class="item"
108
+ >
109
+ <i
110
+ aria-hidden="true"
111
+ class="heading small icon"
112
+ />
113
+ </div>
114
+ <div
115
+ class="item"
116
+ >
117
+ <i
118
+ aria-hidden="true"
119
+ class="list ul icon"
120
+ />
121
+ </div>
122
+ <div
123
+ class="item"
124
+ >
125
+ <i
126
+ aria-hidden="true"
127
+ class="list ol icon"
128
+ />
129
+ </div>
130
+ <div
131
+ class="disabled item"
132
+ >
133
+ <i
134
+ aria-hidden="true"
135
+ class="linkify icon"
136
+ />
137
+ </div>
138
+ </div>
139
+ <div
140
+ class="markdown-editor-content"
141
+ >
142
+ <div
143
+ placeholder=""
142
144
  >
143
145
  <div
144
- autocorrect="on"
146
+ class="tiptap ProseMirror"
145
147
  contenteditable="true"
146
- data-gramm="false"
147
- data-key="17"
148
- data-slate-editor="true"
149
148
  role="textbox"
150
- spellcheck="true"
151
- style="outline: none; white-space: pre-wrap; word-wrap: break-word;"
149
+ tabindex="0"
150
+ translate="no"
152
151
  >
153
- <div
154
- data-key="18"
155
- data-slate-object="block"
156
- style="position: relative;"
157
- >
158
- <span
159
- data-key="23"
160
- data-slate-object="text"
161
- >
162
- <span
163
- data-offset-key="23:0"
164
- data-slate-leaf="true"
165
- >
166
- <span>
167
- <span
168
- contenteditable="false"
169
- style="pointer-events: none; display: inline-block; width: 0px; max-width: 100%; white-space: nowrap; opacity: 0.333; vertical-align: text-top;"
170
- />
171
- <span
172
- data-slate-length="0"
173
- data-slate-zero-width="n"
174
- >
175
- 
176
- <br />
177
- </span>
178
- </span>
179
- </span>
180
- </span>
181
- </div>
152
+ <p>
153
+ <br
154
+ class="ProseMirror-trailingBreak"
155
+ />
156
+ </p>
182
157
  </div>
183
158
  </div>
184
159
  </div>
@@ -607,120 +582,95 @@ exports[`<RuleForm /> matches the latest snapshot 1`] = `
607
582
  >
608
583
  rule.props.description
609
584
  </label>
610
- <div>
585
+ <div
586
+ class="markdown-editor"
587
+ >
611
588
  <div
612
- style="border: 1px solid rgba(34, 36, 38, 0.15); border-radius: 0.28571429rem;"
589
+ class="ui small top attached markdown-editor-toolbar menu"
613
590
  >
614
591
  <div
615
- class="ui menu"
592
+ class="item"
616
593
  >
617
- <a
618
- class="icon item"
619
- >
620
- <i
621
- aria-hidden="true"
622
- class="bold icon"
623
- />
624
- </a>
625
- <a
626
- class="icon item"
627
- >
628
- <i
629
- aria-hidden="true"
630
- class="italic icon"
631
- />
632
- </a>
633
- <a
634
- class="icon item"
635
- >
636
- <i
637
- aria-hidden="true"
638
- class="underline icon"
639
- />
640
- </a>
641
- <a
642
- class="icon item"
643
- >
644
- <i
645
- aria-hidden="true"
646
- class="header icon"
647
- />
648
- </a>
649
- <a
650
- class="icon item"
651
- >
652
- <i
653
- aria-hidden="true"
654
- class="h icon"
655
- />
656
- </a>
657
- <a
658
- class="icon item"
659
- >
660
- <i
661
- aria-hidden="true"
662
- class="list ol icon"
663
- />
664
- </a>
665
- <a
666
- class="icon item"
667
- >
668
- <i
669
- aria-hidden="true"
670
- class="list ul icon"
671
- />
672
- </a>
673
- <a
674
- class="icon item"
675
- >
676
- <i
677
- aria-hidden="true"
678
- class="linkify icon"
679
- />
680
- </a>
594
+ <i
595
+ aria-hidden="true"
596
+ class="bold icon"
597
+ />
681
598
  </div>
682
599
  <div
683
- style="padding: 10px;"
600
+ class="item"
601
+ >
602
+ <i
603
+ aria-hidden="true"
604
+ class="italic icon"
605
+ />
606
+ </div>
607
+ <div
608
+ class="item"
609
+ >
610
+ <i
611
+ aria-hidden="true"
612
+ class="underline icon"
613
+ />
614
+ </div>
615
+ <div
616
+ class="item"
617
+ >
618
+ <i
619
+ aria-hidden="true"
620
+ class="heading large icon"
621
+ />
622
+ </div>
623
+ <div
624
+ class="item"
625
+ >
626
+ <i
627
+ aria-hidden="true"
628
+ class="heading small icon"
629
+ />
630
+ </div>
631
+ <div
632
+ class="item"
633
+ >
634
+ <i
635
+ aria-hidden="true"
636
+ class="list ul icon"
637
+ />
638
+ </div>
639
+ <div
640
+ class="item"
641
+ >
642
+ <i
643
+ aria-hidden="true"
644
+ class="list ol icon"
645
+ />
646
+ </div>
647
+ <div
648
+ class="disabled item"
649
+ >
650
+ <i
651
+ aria-hidden="true"
652
+ class="linkify icon"
653
+ />
654
+ </div>
655
+ </div>
656
+ <div
657
+ class="markdown-editor-content"
658
+ >
659
+ <div
660
+ placeholder=""
684
661
  >
685
662
  <div
686
- autocorrect="on"
663
+ class="tiptap ProseMirror"
687
664
  contenteditable="true"
688
- data-gramm="false"
689
- data-key="8"
690
- data-slate-editor="true"
691
665
  role="textbox"
692
- spellcheck="true"
693
- style="outline: none; white-space: pre-wrap; word-wrap: break-word;"
666
+ tabindex="0"
667
+ translate="no"
694
668
  >
695
- <div
696
- data-key="9"
697
- data-slate-object="block"
698
- style="position: relative;"
699
- >
700
- <span
701
- data-key="14"
702
- data-slate-object="text"
703
- >
704
- <span
705
- data-offset-key="14:0"
706
- data-slate-leaf="true"
707
- >
708
- <span>
709
- <span
710
- contenteditable="false"
711
- style="pointer-events: none; display: inline-block; width: 0px; max-width: 100%; white-space: nowrap; opacity: 0.333; vertical-align: text-top;"
712
- />
713
- <span
714
- data-slate-length="0"
715
- data-slate-zero-width="n"
716
- >
717
- 
718
- <br />
719
- </span>
720
- </span>
721
- </span>
722
- </span>
723
- </div>
669
+ <p>
670
+ <br
671
+ class="ProseMirror-trailingBreak"
672
+ />
673
+ </p>
724
674
  </div>
725
675
  </div>
726
676
  </div>
@@ -21,34 +21,13 @@ exports[`<RuleProperties /> matches the latest snapshot 1`] = `
21
21
  concepts.props.description
22
22
  </h3>
23
23
  <div
24
- autocorrect="on"
25
- data-gramm="false"
26
- data-key="7"
27
- data-slate-editor="true"
28
- spellcheck="true"
29
- style="outline: none; white-space: pre-wrap; word-wrap: break-word;"
24
+ class="markdown-reader"
30
25
  >
31
- <div
32
- data-key="8"
33
- data-slate-object="block"
34
- style="position: relative;"
35
- >
36
- <span
37
- data-key="9"
38
- data-slate-object="text"
39
- >
40
- <span
41
- data-offset-key="9:0"
42
- data-slate-leaf="true"
43
- >
44
- <span
45
- data-slate-string="true"
46
- >
47
- desc
48
- </span>
49
- </span>
50
- </span>
51
- </div>
26
+ <p>
27
+ desc
28
+ </p>
29
+
30
+
52
31
  </div>
53
32
  </div>
54
33
  <div