@pareto-engineering/design-system 4.8.0 → 4.8.2

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.
@@ -65,6 +65,7 @@ $default-file-width: calc($width-without-gaps / $files-per-row);
65
65
  }
66
66
 
67
67
  > .name {
68
+ color: var(--on-x);
68
69
  overflow: hidden;
69
70
  text-overflow: ellipsis;
70
71
  white-space: nowrap;
@@ -39,15 +39,19 @@ const FormBuilder = _ref => {
39
39
  onBuilderValidate,
40
40
  initialBuilderValues,
41
41
  fileUploadStatus,
42
- handleFileDelete
42
+ handleFileDelete,
43
+ taskData
43
44
  // ...otherProps
44
45
  } = _ref;
46
+ const formattedJson = JSON.stringify(taskData, null, 2);
45
47
  return /*#__PURE__*/React.createElement("div", {
46
48
  id: id,
47
49
  className: [baseClassName, componentClassName, userClassName].filter(e => e).join(' '),
48
50
  style: style
49
51
  // {...otherProps}
50
- }, mode === 'build' && /*#__PURE__*/React.createElement(_common.Builder, {
52
+ }, taskData && /*#__PURE__*/React.createElement("pre", {
53
+ className: "task-data md-span-12 span-8 s-1"
54
+ }, formattedJson), mode === 'build' && /*#__PURE__*/React.createElement(_common.Builder, {
51
55
  initialValues: initialBuilderValues,
52
56
  formBuilderId: formBuilderId,
53
57
  onSave: onBuilderFormSave,
@@ -107,7 +111,12 @@ FormBuilder.propTypes = {
107
111
  /**
108
112
  * The upload status of files if any
109
113
  */
110
- fileUploadStatus: _propTypes.default.objectOf(_propTypes.default.string)
114
+ fileUploadStatus: _propTypes.default.objectOf(_propTypes.default.string),
115
+ /**
116
+ * The task preview data
117
+ */
118
+ // eslint-disable-next-line react/forbid-prop-types
119
+ taskData: _propTypes.default.objectOf(_propTypes.default.any)
111
120
  };
112
121
  FormBuilder.defaultProps = {
113
122
  mode: 'build',
@@ -1,7 +1,25 @@
1
- // /* @pareto-engineering/generator-front 1.1.1-alpha.2 */
1
+ /* @pareto-engineering/generator-front 1.1.1-alpha.2 */
2
2
 
3
- // @use "@pareto-engineering/bem";
3
+ @use "@pareto-engineering/bem";
4
4
 
5
- // .#{bem.$base}.form-builder{
5
+ $default-border: 1px solid var(--ui-lines);
6
+ $default-border-radius: .5em;
7
+ $default-max-height: 10em;
8
+ $default-padding: calc(var(--gap) / 2);
9
+ $default-margin: var(--gap);
6
10
 
7
- // }
11
+ .#{bem.$base}.form-builder {
12
+ > .task-data {
13
+ background: var(--background-inputs);
14
+ border: $default-border;
15
+ border-radius: $default-border-radius;
16
+ color: var(--on-background-far);
17
+ height: $default-max-height;
18
+ margin-bottom: $default-margin;
19
+ max-width: 100%;
20
+ overflow: auto;
21
+ padding: $default-padding;
22
+ resize: vertical;
23
+ text-wrap: wrap;
24
+ }
25
+ }
@@ -65,6 +65,7 @@ $default-file-width: calc($width-without-gaps / $files-per-row);
65
65
  }
66
66
 
67
67
  > .name {
68
+ color: var(--on-x);
68
69
  overflow: hidden;
69
70
  text-overflow: ellipsis;
70
71
  white-space: nowrap;
@@ -29,28 +29,34 @@ const FormBuilder = ({
29
29
  onBuilderValidate,
30
30
  initialBuilderValues,
31
31
  fileUploadStatus,
32
- handleFileDelete
32
+ handleFileDelete,
33
+ taskData
33
34
  // ...otherProps
34
- }) => /*#__PURE__*/React.createElement("div", {
35
- id: id,
36
- className: [baseClassName, componentClassName, userClassName].filter(e => e).join(' '),
37
- style: style
38
- // {...otherProps}
39
- }, mode === 'build' && /*#__PURE__*/React.createElement(Builder, {
40
- initialValues: initialBuilderValues,
41
- formBuilderId: formBuilderId,
42
- onSave: onBuilderFormSave,
43
- onError: onBuilderError,
44
- validate: onBuilderValidate
45
- }), mode === 'render' && /*#__PURE__*/React.createElement(Renderer, {
46
- formData: formData,
47
- onSave: onRendererFormSave,
48
- readOnly: readOnly,
49
- shouldSubmit: shouldSubmit,
50
- onError: onRendererError,
51
- fileUploadStatus: fileUploadStatus,
52
- handleFileDelete: handleFileDelete
53
- }));
35
+ }) => {
36
+ const formattedJson = JSON.stringify(taskData, null, 2);
37
+ return /*#__PURE__*/React.createElement("div", {
38
+ id: id,
39
+ className: [baseClassName, componentClassName, userClassName].filter(e => e).join(' '),
40
+ style: style
41
+ // {...otherProps}
42
+ }, taskData && /*#__PURE__*/React.createElement("pre", {
43
+ className: "task-data md-span-12 span-8 s-1"
44
+ }, formattedJson), mode === 'build' && /*#__PURE__*/React.createElement(Builder, {
45
+ initialValues: initialBuilderValues,
46
+ formBuilderId: formBuilderId,
47
+ onSave: onBuilderFormSave,
48
+ onError: onBuilderError,
49
+ validate: onBuilderValidate
50
+ }), mode === 'render' && /*#__PURE__*/React.createElement(Renderer, {
51
+ formData: formData,
52
+ onSave: onRendererFormSave,
53
+ readOnly: readOnly,
54
+ shouldSubmit: shouldSubmit,
55
+ onError: onRendererError,
56
+ fileUploadStatus: fileUploadStatus,
57
+ handleFileDelete: handleFileDelete
58
+ }));
59
+ };
54
60
  FormBuilder.propTypes = {
55
61
  /**
56
62
  * The HTML id for this element
@@ -95,7 +101,12 @@ FormBuilder.propTypes = {
95
101
  /**
96
102
  * The upload status of files if any
97
103
  */
98
- fileUploadStatus: PropTypes.objectOf(PropTypes.string)
104
+ fileUploadStatus: PropTypes.objectOf(PropTypes.string),
105
+ /**
106
+ * The task preview data
107
+ */
108
+ // eslint-disable-next-line react/forbid-prop-types
109
+ taskData: PropTypes.objectOf(PropTypes.any)
99
110
  };
100
111
  FormBuilder.defaultProps = {
101
112
  mode: 'build',
@@ -1,7 +1,25 @@
1
- // /* @pareto-engineering/generator-front 1.1.1-alpha.2 */
1
+ /* @pareto-engineering/generator-front 1.1.1-alpha.2 */
2
2
 
3
- // @use "@pareto-engineering/bem";
3
+ @use "@pareto-engineering/bem";
4
4
 
5
- // .#{bem.$base}.form-builder{
5
+ $default-border: 1px solid var(--ui-lines);
6
+ $default-border-radius: .5em;
7
+ $default-max-height: 10em;
8
+ $default-padding: calc(var(--gap) / 2);
9
+ $default-margin: var(--gap);
6
10
 
7
- // }
11
+ .#{bem.$base}.form-builder {
12
+ > .task-data {
13
+ background: var(--background-inputs);
14
+ border: $default-border;
15
+ border-radius: $default-border-radius;
16
+ color: var(--on-background-far);
17
+ height: $default-max-height;
18
+ margin-bottom: $default-margin;
19
+ max-width: 100%;
20
+ overflow: auto;
21
+ padding: $default-padding;
22
+ resize: vertical;
23
+ text-wrap: wrap;
24
+ }
25
+ }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@pareto-engineering/design-system",
3
- "version": "4.8.0",
3
+ "version": "4.8.2",
4
4
  "description": "",
5
5
  "main": "dist/cjs/index.js",
6
6
  "module": "dist/es/index.js",
@@ -60,7 +60,7 @@
60
60
  "@lexical/table": "0.12.2",
61
61
  "@lexical/utils": "0.12.2",
62
62
  "@pareto-engineering/assets": "^4.2.3",
63
- "@pareto-engineering/bem": "^4.8.0",
63
+ "@pareto-engineering/bem": "^4.8.1",
64
64
  "@pareto-engineering/styles": "^4.2.0",
65
65
  "@pareto-engineering/utils": "^4.0.0",
66
66
  "codemirror": "^6.0.1",
@@ -82,5 +82,5 @@
82
82
  "relay-test-utils": "^15.0.0"
83
83
  },
84
84
  "browserslist": "> 2%",
85
- "gitHead": "25b1817b5d00ef3e7eae53072b7914bbc9d1c1fb"
85
+ "gitHead": "1eea7b1c3085e7c568568baad8f77c76cbcba46f"
86
86
  }
@@ -65,6 +65,7 @@ $default-file-width: calc($width-without-gaps / $files-per-row);
65
65
  }
66
66
 
67
67
  > .name {
68
+ color: var(--on-x);
68
69
  overflow: hidden;
69
70
  text-overflow: ellipsis;
70
71
  white-space: nowrap;
@@ -35,44 +35,54 @@ const FormBuilder = ({
35
35
  initialBuilderValues,
36
36
  fileUploadStatus,
37
37
  handleFileDelete,
38
+ taskData,
38
39
  // ...otherProps
39
- }) => (
40
- <div
41
- id={id}
42
- className={[
43
-
44
- baseClassName,
45
-
46
- componentClassName,
47
- userClassName,
48
- ]
49
- .filter((e) => e)
50
- .join(' ')}
51
- style={style}
52
- // {...otherProps}
53
- >
54
- {mode === 'build' && (
55
- <Builder
56
- initialValues={initialBuilderValues}
57
- formBuilderId={formBuilderId}
58
- onSave={onBuilderFormSave}
59
- onError={onBuilderError}
60
- validate={onBuilderValidate}
61
- />
62
- )}
63
- {mode === 'render' && (
64
- <Renderer
65
- formData={formData}
66
- onSave={onRendererFormSave}
67
- readOnly={readOnly}
68
- shouldSubmit={shouldSubmit}
69
- onError={onRendererError}
70
- fileUploadStatus={fileUploadStatus}
71
- handleFileDelete={handleFileDelete}
72
- />
73
- )}
74
- </div>
75
- )
40
+ }) => {
41
+ const formattedJson = JSON.stringify(taskData, null, 2)
42
+
43
+ return (
44
+ <div
45
+ id={id}
46
+ className={[
47
+ baseClassName,
48
+ componentClassName,
49
+ userClassName,
50
+ ]
51
+ .filter((e) => e)
52
+ .join(' ')}
53
+ style={style}
54
+ // {...otherProps}
55
+ >
56
+ {
57
+ taskData && (
58
+ <pre className="task-data md-span-12 span-8 s-1">
59
+ {formattedJson}
60
+ </pre>
61
+ )
62
+ }
63
+ {mode === 'build' && (
64
+ <Builder
65
+ initialValues={initialBuilderValues}
66
+ formBuilderId={formBuilderId}
67
+ onSave={onBuilderFormSave}
68
+ onError={onBuilderError}
69
+ validate={onBuilderValidate}
70
+ />
71
+ )}
72
+ {mode === 'render' && (
73
+ <Renderer
74
+ formData={formData}
75
+ onSave={onRendererFormSave}
76
+ readOnly={readOnly}
77
+ shouldSubmit={shouldSubmit}
78
+ onError={onRendererError}
79
+ fileUploadStatus={fileUploadStatus}
80
+ handleFileDelete={handleFileDelete}
81
+ />
82
+ )}
83
+ </div>
84
+ )
85
+ }
76
86
 
77
87
  FormBuilder.propTypes = {
78
88
  /**
@@ -128,6 +138,12 @@ FormBuilder.propTypes = {
128
138
  * The upload status of files if any
129
139
  */
130
140
  fileUploadStatus:PropTypes.objectOf(PropTypes.string),
141
+
142
+ /**
143
+ * The task preview data
144
+ */
145
+ // eslint-disable-next-line react/forbid-prop-types
146
+ taskData:PropTypes.objectOf(PropTypes.any),
131
147
  }
132
148
 
133
149
  FormBuilder.defaultProps = {
@@ -1,7 +1,25 @@
1
- // /* @pareto-engineering/generator-front 1.1.1-alpha.2 */
1
+ /* @pareto-engineering/generator-front 1.1.1-alpha.2 */
2
2
 
3
- // @use "@pareto-engineering/bem";
3
+ @use "@pareto-engineering/bem";
4
4
 
5
- // .#{bem.$base}.form-builder{
5
+ $default-border: 1px solid var(--ui-lines);
6
+ $default-border-radius: .5em;
7
+ $default-max-height: 10em;
8
+ $default-padding: calc(var(--gap) / 2);
9
+ $default-margin: var(--gap);
6
10
 
7
- // }
11
+ .#{bem.$base}.form-builder {
12
+ > .task-data {
13
+ background: var(--background-inputs);
14
+ border: $default-border;
15
+ border-radius: $default-border-radius;
16
+ color: var(--on-background-far);
17
+ height: $default-max-height;
18
+ margin-bottom: $default-margin;
19
+ max-width: 100%;
20
+ overflow: auto;
21
+ padding: $default-padding;
22
+ resize: vertical;
23
+ text-wrap: wrap;
24
+ }
25
+ }