@contentful/field-editor-list 0.15.6 → 1.0.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.
- package/CHANGELOG.md +22 -88
- package/README.md +0 -1
- package/dist/field-editor-list.cjs.development.js +46 -25
- package/dist/field-editor-list.cjs.development.js.map +1 -1
- package/dist/field-editor-list.cjs.production.min.js +1 -1
- package/dist/field-editor-list.cjs.production.min.js.map +1 -1
- package/dist/field-editor-list.esm.js +45 -26
- package/dist/field-editor-list.esm.js.map +1 -1
- package/package.json +6 -6
package/CHANGELOG.md
CHANGED
|
@@ -3,194 +3,128 @@
|
|
|
3
3
|
All notable changes to this project will be documented in this file.
|
|
4
4
|
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
|
5
5
|
|
|
6
|
-
## [0.
|
|
6
|
+
## [1.0.2](https://github.com/contentful/field-editors/compare/@contentful/field-editor-list@1.0.1...@contentful/field-editor-list@1.0.2) (2021-11-18)
|
|
7
7
|
|
|
8
|
-
|
|
8
|
+
### Bug Fixes
|
|
9
9
|
|
|
10
|
+
- fix list field preventing commas after forma36 v4 ([#930](https://github.com/contentful/field-editors/issues/930)) ([01bc621](https://github.com/contentful/field-editors/commit/01bc6217d0e43ed28f8b5c013475697c159dcd73))
|
|
10
11
|
|
|
12
|
+
## [1.0.1](https://github.com/contentful/field-editors/compare/@contentful/field-editor-list@1.0.0...@contentful/field-editor-list@1.0.1) (2021-11-17)
|
|
11
13
|
|
|
14
|
+
### Bug Fixes
|
|
12
15
|
|
|
16
|
+
- **card-actions:** update forma 36 to fix card actions click issue ([#927](https://github.com/contentful/field-editors/issues/927)) ([3dfdef2](https://github.com/contentful/field-editors/commit/3dfdef2c2b0045f12ea94ddafca89a8e9f25e7d0))
|
|
13
17
|
|
|
14
|
-
|
|
18
|
+
# [1.0.0](https://github.com/contentful/field-editors/compare/@contentful/field-editor-list@0.16.0...@contentful/field-editor-list@1.0.0) (2021-11-04)
|
|
15
19
|
|
|
16
20
|
**Note:** Version bump only for package @contentful/field-editor-list
|
|
17
21
|
|
|
22
|
+
# [0.16.0](https://github.com/contentful/field-editors/compare/@contentful/field-editor-list@0.15.6...@contentful/field-editor-list@0.16.0) (2021-11-04)
|
|
18
23
|
|
|
24
|
+
### Features
|
|
19
25
|
|
|
26
|
+
- Forma v4 components adoption ([#805](https://github.com/contentful/field-editors/issues/805)) ([526bde6](https://github.com/contentful/field-editors/commit/526bde6e10e0ee3789705ec10fb31489af7ca59e))
|
|
20
27
|
|
|
28
|
+
### BREAKING CHANGES
|
|
21
29
|
|
|
22
|
-
|
|
30
|
+
- adopts a new Forma v4 beta
|
|
31
|
+
|
|
32
|
+
## [0.15.6](https://github.com/contentful/field-editors/compare/@contentful/field-editor-list@0.15.5...@contentful/field-editor-list@0.15.6) (2021-10-14)
|
|
23
33
|
|
|
24
34
|
**Note:** Version bump only for package @contentful/field-editor-list
|
|
25
35
|
|
|
36
|
+
## [0.15.5](https://github.com/contentful/field-editors/compare/@contentful/field-editor-list@0.15.4...@contentful/field-editor-list@0.15.5) (2021-10-06)
|
|
26
37
|
|
|
38
|
+
**Note:** Version bump only for package @contentful/field-editor-list
|
|
27
39
|
|
|
40
|
+
## [0.15.4](https://github.com/contentful/field-editors/compare/@contentful/field-editor-list@0.15.3...@contentful/field-editor-list@0.15.4) (2021-09-17)
|
|
28
41
|
|
|
42
|
+
**Note:** Version bump only for package @contentful/field-editor-list
|
|
29
43
|
|
|
30
44
|
## [0.15.3](https://github.com/contentful/field-editors/compare/@contentful/field-editor-list@0.15.2...@contentful/field-editor-list@0.15.3) (2021-09-16)
|
|
31
45
|
|
|
32
46
|
**Note:** Version bump only for package @contentful/field-editor-list
|
|
33
47
|
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
48
|
## [0.15.2](https://github.com/contentful/field-editors/compare/@contentful/field-editor-list@0.15.1...@contentful/field-editor-list@0.15.2) (2021-08-19)
|
|
39
49
|
|
|
40
50
|
**Note:** Version bump only for package @contentful/field-editor-list
|
|
41
51
|
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
52
|
## [0.15.1](https://github.com/contentful/field-editors/compare/@contentful/field-editor-list@0.15.0...@contentful/field-editor-list@0.15.1) (2021-07-29)
|
|
47
53
|
|
|
48
54
|
**Note:** Version bump only for package @contentful/field-editor-list
|
|
49
55
|
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
56
|
# [0.15.0](https://github.com/contentful/field-editors/compare/@contentful/field-editor-list@0.14.6...@contentful/field-editor-list@0.15.0) (2021-07-23)
|
|
55
57
|
|
|
56
|
-
|
|
57
58
|
### Features
|
|
58
59
|
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
60
|
+
- 💡 new color tokens ([#778](https://github.com/contentful/field-editors/issues/778)) ([fba548d](https://github.com/contentful/field-editors/commit/fba548de32305016df7f2685634eefb14294828f))
|
|
64
61
|
|
|
65
62
|
## [0.14.6](https://github.com/contentful/field-editors/compare/@contentful/field-editor-list@0.14.3...@contentful/field-editor-list@0.14.6) (2021-07-06)
|
|
66
63
|
|
|
67
64
|
**Note:** Version bump only for package @contentful/field-editor-list
|
|
68
65
|
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
66
|
## [0.14.5](https://github.com/contentful/field-editors/compare/@contentful/field-editor-list@0.14.3...@contentful/field-editor-list@0.14.5) (2021-07-06)
|
|
74
67
|
|
|
75
68
|
**Note:** Version bump only for package @contentful/field-editor-list
|
|
76
69
|
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
70
|
## [0.14.4](https://github.com/contentful/field-editors/compare/@contentful/field-editor-list@0.14.3...@contentful/field-editor-list@0.14.4) (2021-06-23)
|
|
82
71
|
|
|
83
72
|
**Note:** Version bump only for package @contentful/field-editor-list
|
|
84
73
|
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
74
|
## [0.14.3](https://github.com/contentful/field-editors/compare/@contentful/field-editor-list@0.14.2...@contentful/field-editor-list@0.14.3) (2021-06-23)
|
|
90
75
|
|
|
91
76
|
**Note:** Version bump only for package @contentful/field-editor-list
|
|
92
77
|
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
78
|
## [0.14.2](https://github.com/contentful/field-editors/compare/@contentful/field-editor-list@0.14.1...@contentful/field-editor-list@0.14.2) (2021-06-22)
|
|
98
79
|
|
|
99
80
|
**Note:** Version bump only for package @contentful/field-editor-list
|
|
100
81
|
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
82
|
## [0.14.1](https://github.com/contentful/field-editors/compare/@contentful/field-editor-list@0.14.0...@contentful/field-editor-list@0.14.1) (2021-03-05)
|
|
106
83
|
|
|
107
84
|
**Note:** Version bump only for package @contentful/field-editor-list
|
|
108
85
|
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
86
|
# [0.14.0](https://github.com/contentful/field-editors/compare/@contentful/field-editor-list@0.13.2...@contentful/field-editor-list@0.14.0) (2021-02-19)
|
|
114
87
|
|
|
115
|
-
|
|
116
88
|
### Features
|
|
117
89
|
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
90
|
+
- bump min version of forma-36 ([#606](https://github.com/contentful/field-editors/issues/606)) ([fd57c7a](https://github.com/contentful/field-editors/commit/fd57c7a4312766af38c01507f17706ab22992617))
|
|
123
91
|
|
|
124
92
|
## [0.13.2](https://github.com/contentful/field-editors/compare/@contentful/field-editor-list@0.13.1...@contentful/field-editor-list@0.13.2) (2021-02-09)
|
|
125
93
|
|
|
126
94
|
**Note:** Version bump only for package @contentful/field-editor-list
|
|
127
95
|
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
96
|
## [0.13.1](https://github.com/contentful/field-editors/compare/@contentful/field-editor-list@0.13.0...@contentful/field-editor-list@0.13.1) (2021-02-01)
|
|
133
97
|
|
|
134
98
|
**Note:** Version bump only for package @contentful/field-editor-list
|
|
135
99
|
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
100
|
# [0.13.0](https://github.com/contentful/field-editors/compare/@contentful/field-editor-list@0.12.0...@contentful/field-editor-list@0.13.0) (2021-01-20)
|
|
141
101
|
|
|
142
|
-
|
|
143
102
|
### Features
|
|
144
103
|
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
104
|
+
- update minimal forma-36 versions to use updated design ([#565](https://github.com/contentful/field-editors/issues/565)) ([332c734](https://github.com/contentful/field-editors/commit/332c734bfaf54f0e9773fcbb460d743b1f5459ec))
|
|
150
105
|
|
|
151
106
|
# [0.12.0](https://github.com/contentful/field-editors/compare/@contentful/field-editor-list@0.11.5...@contentful/field-editor-list@0.12.0) (2021-01-12)
|
|
152
107
|
|
|
153
|
-
|
|
154
108
|
### Features
|
|
155
109
|
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
110
|
+
- update minimal required Forma version to the 3.73.12 ([#552](https://github.com/contentful/field-editors/issues/552)) ([2816fd9](https://github.com/contentful/field-editors/commit/2816fd960c28815faebf49a9ef8f4c4c0d91fc36))
|
|
161
111
|
|
|
162
112
|
## [0.11.5](https://github.com/contentful/field-editors/compare/@contentful/field-editor-list@0.11.4...@contentful/field-editor-list@0.11.5) (2020-12-16)
|
|
163
113
|
|
|
164
114
|
**Note:** Version bump only for package @contentful/field-editor-list
|
|
165
115
|
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
170
116
|
## [0.11.4](https://github.com/contentful/field-editors/compare/@contentful/field-editor-list@0.11.3...@contentful/field-editor-list@0.11.4) (2020-11-06)
|
|
171
117
|
|
|
172
118
|
**Note:** Version bump only for package @contentful/field-editor-list
|
|
173
119
|
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
178
120
|
## [0.11.3](https://github.com/contentful/field-editors/compare/@contentful/field-editor-list@0.11.2...@contentful/field-editor-list@0.11.3) (2020-11-06)
|
|
179
121
|
|
|
180
122
|
**Note:** Version bump only for package @contentful/field-editor-list
|
|
181
123
|
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
|
|
186
124
|
## [0.11.2](https://github.com/contentful/field-editors/compare/@contentful/field-editor-list@0.11.1...@contentful/field-editor-list@0.11.2) (2020-10-28)
|
|
187
125
|
|
|
188
126
|
**Note:** Version bump only for package @contentful/field-editor-list
|
|
189
127
|
|
|
190
|
-
|
|
191
|
-
|
|
192
|
-
|
|
193
|
-
|
|
194
128
|
## [0.11.1](https://github.com/contentful/field-editors/compare/@contentful/field-editor-list@0.11.0...@contentful/field-editor-list@0.11.1) (2020-08-24)
|
|
195
129
|
|
|
196
130
|
**Note:** Version bump only for package @contentful/field-editor-list
|
package/README.md
CHANGED
|
@@ -7,6 +7,5 @@ npm install @contentful/field-editor-list
|
|
|
7
7
|
This package contains a React `ListEditor` component that is used as a default for the `Symbol / List` field type in the Contentful web application.
|
|
8
8
|
|
|
9
9
|
```js
|
|
10
|
-
import '@contentful/forma-36-react-components/dist/styles.css';
|
|
11
10
|
import { ListEditor } from '@contentful/field-editor-list';
|
|
12
11
|
```
|
|
@@ -2,10 +2,13 @@
|
|
|
2
2
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
|
+
function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'default' in ex) ? ex['default'] : ex; }
|
|
6
|
+
|
|
5
7
|
var React = require('react');
|
|
6
8
|
var fieldEditorShared = require('@contentful/field-editor-shared');
|
|
7
|
-
var forma36ReactComponents = require('@contentful/forma-36-react-components');
|
|
8
9
|
var emotion = require('emotion');
|
|
10
|
+
var isEqual = _interopDefault(require('lodash/isEqual'));
|
|
11
|
+
var f36Components = require('@contentful/f36-components');
|
|
9
12
|
|
|
10
13
|
var rightToLeft = /*#__PURE__*/emotion.css({
|
|
11
14
|
direction: 'rtl'
|
|
@@ -24,33 +27,51 @@ function ListEditor(props) {
|
|
|
24
27
|
isEmptyValue: isEmptyListValue,
|
|
25
28
|
field: field,
|
|
26
29
|
isInitiallyDisabled: props.isInitiallyDisabled
|
|
27
|
-
}, function (
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
30
|
+
}, function (childProps) {
|
|
31
|
+
return React.createElement(ListEditorInternal, Object.assign({}, childProps, {
|
|
32
|
+
direction: direction,
|
|
33
|
+
isRequired: field.required
|
|
34
|
+
}));
|
|
35
|
+
});
|
|
36
|
+
}
|
|
37
|
+
|
|
38
|
+
function ListEditorInternal(_ref) {
|
|
39
|
+
var setValue = _ref.setValue,
|
|
40
|
+
value = _ref.value,
|
|
41
|
+
errors = _ref.errors,
|
|
42
|
+
disabled = _ref.disabled,
|
|
43
|
+
direction = _ref.direction,
|
|
44
|
+
isRequired = _ref.isRequired;
|
|
45
|
+
|
|
46
|
+
var _React$useState = React.useState(function () {
|
|
47
|
+
return (value || []).join(', ');
|
|
48
|
+
}),
|
|
49
|
+
valueState = _React$useState[0],
|
|
50
|
+
setValueState = _React$useState[1];
|
|
51
|
+
|
|
52
|
+
var onChange = function onChange(e) {
|
|
53
|
+
var valueAsArray = e.target.value.split(',').map(function (item) {
|
|
54
|
+
return item.trim();
|
|
55
|
+
}).filter(function (item) {
|
|
56
|
+
return item;
|
|
51
57
|
});
|
|
58
|
+
var changed = !isEqual(valueAsArray, value);
|
|
59
|
+
setValue(valueAsArray);
|
|
60
|
+
var valueAsString = valueAsArray.join(', ');
|
|
61
|
+
setValueState(changed ? valueAsString : e.target.value);
|
|
62
|
+
};
|
|
63
|
+
|
|
64
|
+
return React.createElement(f36Components.TextInput, {
|
|
65
|
+
testId: "list-editor-input",
|
|
66
|
+
className: direction === 'rtl' ? rightToLeft : '',
|
|
67
|
+
isRequired: isRequired,
|
|
68
|
+
isInvalid: errors.length > 0,
|
|
69
|
+
isDisabled: disabled,
|
|
70
|
+
value: valueState,
|
|
71
|
+
onChange: onChange
|
|
52
72
|
});
|
|
53
73
|
}
|
|
74
|
+
|
|
54
75
|
ListEditor.defaultProps = {
|
|
55
76
|
isInitiallyDisabled: true
|
|
56
77
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"field-editor-list.cjs.development.js","sources":["../src/styles.ts","../src/ListEditor.tsx"],"sourcesContent":["import { css } from 'emotion';\n\nexport const rightToLeft = css({\n direction: 'rtl'
|
|
1
|
+
{"version":3,"file":"field-editor-list.cjs.development.js","sources":["../src/styles.ts","../src/ListEditor.tsx"],"sourcesContent":["import { css } from 'emotion';\n\nexport const rightToLeft = css({\n direction: 'rtl',\n});\n","import * as React from 'react';\nimport { FieldAPI, FieldConnector, LocalesAPI } from '@contentful/field-editor-shared';\nimport * as styles from './styles';\nimport isEqual from 'lodash/isEqual';\n\nimport { TextInput } from '@contentful/f36-components';\nimport { FieldConnectorChildProps } from '@contentful/field-editor-shared/dist/FieldConnector';\n\nexport interface ListEditorProps {\n /**\n * is the field disabled initially\n */\n isInitiallyDisabled: boolean;\n\n /**\n * sdk.field\n */\n field: FieldAPI;\n\n /**\n * sdk.locales\n */\n locales: LocalesAPI;\n}\n\ntype ListValue = string[];\n\nfunction isEmptyListValue(value: ListValue | null) {\n return value === null || value.length === 0;\n}\n\nexport function ListEditor(props: ListEditorProps) {\n const { field, locales } = props;\n\n const direction = locales.direction[field.locale] || 'ltr';\n\n return (\n <FieldConnector<ListValue>\n throttle={0}\n isEmptyValue={isEmptyListValue}\n field={field}\n isInitiallyDisabled={props.isInitiallyDisabled}>\n {(childProps) => (\n <ListEditorInternal {...childProps} direction={direction} isRequired={field.required} />\n )}\n </FieldConnector>\n );\n}\n\nfunction ListEditorInternal({\n setValue,\n value,\n errors,\n disabled,\n direction,\n isRequired,\n}: FieldConnectorChildProps<ListValue> & { direction: 'rtl' | 'ltr'; isRequired: boolean }) {\n const [valueState, setValueState] = React.useState(() => (value || []).join(', '));\n\n const onChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n const valueAsArray = e.target.value\n .split(',')\n .map((item) => item.trim())\n .filter((item) => item);\n const changed = !isEqual(valueAsArray, value);\n setValue(valueAsArray);\n\n const valueAsString = valueAsArray.join(', ');\n setValueState(changed ? valueAsString : e.target.value);\n };\n\n return (\n <TextInput\n testId=\"list-editor-input\"\n className={direction === 'rtl' ? styles.rightToLeft : ''}\n isRequired={isRequired}\n isInvalid={errors.length > 0}\n isDisabled={disabled}\n value={valueState}\n onChange={onChange}\n />\n );\n}\n\nListEditor.defaultProps = {\n isInitiallyDisabled: true,\n};\n"],"names":["rightToLeft","css","direction","isEmptyListValue","value","length","ListEditor","props","field","locales","locale","React","FieldConnector","throttle","isEmptyValue","isInitiallyDisabled","childProps","ListEditorInternal","isRequired","required","setValue","errors","disabled","join","valueState","setValueState","onChange","e","valueAsArray","target","split","map","item","trim","filter","changed","isEqual","valueAsString","TextInput","testId","className","styles","isInvalid","isDisabled","defaultProps"],"mappings":";;;;;;;;;;;;AAEO,IAAMA,WAAW,gBAAGC,WAAG,CAAC;AAC7BC,EAAAA,SAAS,EAAE;AADkB,CAAD,CAAvB;;ACyBP,SAASC,gBAAT,CAA0BC,KAA1B;AACE,SAAOA,KAAK,KAAK,IAAV,IAAkBA,KAAK,CAACC,MAAN,KAAiB,CAA1C;AACD;;AAED,SAAgBC,WAAWC;AACzB,MAAQC,KAAR,GAA2BD,KAA3B,CAAQC,KAAR;AAAA,MAAeC,OAAf,GAA2BF,KAA3B,CAAeE,OAAf;AAEA,MAAMP,SAAS,GAAGO,OAAO,CAACP,SAAR,CAAkBM,KAAK,CAACE,MAAxB,KAAmC,KAArD;AAEA,SACEC,mBAAA,CAACC,gCAAD;AACEC,IAAAA,QAAQ,EAAE;AACVC,IAAAA,YAAY,EAAEX;AACdK,IAAAA,KAAK,EAAEA;AACPO,IAAAA,mBAAmB,EAAER,KAAK,CAACQ;GAJ7B,EAKG,UAACC,UAAD;AAAA,WACCL,mBAAA,CAACM,kBAAD,oBAAwBD;AAAYd,MAAAA,SAAS,EAAEA;AAAWgB,MAAAA,UAAU,EAAEV,KAAK,CAACW;MAA5E,CADD;AAAA,GALH,CADF;AAWD;;AAED,SAASF,kBAAT;MACEG,gBAAAA;MACAhB,aAAAA;MACAiB,cAAAA;MACAC,gBAAAA;MACApB,iBAAAA;MACAgB,kBAAAA;;AAEA,wBAAoCP,cAAA,CAAe;AAAA,WAAM,CAACP,KAAK,IAAI,EAAV,EAAcmB,IAAd,CAAmB,IAAnB,CAAN;AAAA,GAAf,CAApC;AAAA,MAAOC,UAAP;AAAA,MAAmBC,aAAnB;;AAEA,MAAMC,QAAQ,GAAG,SAAXA,QAAW,CAACC,CAAD;AACf,QAAMC,YAAY,GAAGD,CAAC,CAACE,MAAF,CAASzB,KAAT,CAClB0B,KADkB,CACZ,GADY,EAElBC,GAFkB,CAEd,UAACC,IAAD;AAAA,aAAUA,IAAI,CAACC,IAAL,EAAV;AAAA,KAFc,EAGlBC,MAHkB,CAGX,UAACF,IAAD;AAAA,aAAUA,IAAV;AAAA,KAHW,CAArB;AAIA,QAAMG,OAAO,GAAG,CAACC,OAAO,CAACR,YAAD,EAAexB,KAAf,CAAxB;AACAgB,IAAAA,QAAQ,CAACQ,YAAD,CAAR;AAEA,QAAMS,aAAa,GAAGT,YAAY,CAACL,IAAb,CAAkB,IAAlB,CAAtB;AACAE,IAAAA,aAAa,CAACU,OAAO,GAAGE,aAAH,GAAmBV,CAAC,CAACE,MAAF,CAASzB,KAApC,CAAb;AACD,GAVD;;AAYA,SACEO,mBAAA,CAAC2B,uBAAD;AACEC,IAAAA,MAAM,EAAC;AACPC,IAAAA,SAAS,EAAEtC,SAAS,KAAK,KAAd,GAAsBuC,WAAtB,GAA2C;AACtDvB,IAAAA,UAAU,EAAEA;AACZwB,IAAAA,SAAS,EAAErB,MAAM,CAAChB,MAAP,GAAgB;AAC3BsC,IAAAA,UAAU,EAAErB;AACZlB,IAAAA,KAAK,EAAEoB;AACPE,IAAAA,QAAQ,EAAEA;GAPZ,CADF;AAWD;;AAEDpB,UAAU,CAACsC,YAAX,GAA0B;AACxB7B,EAAAA,mBAAmB,EAAE;AADG,CAA1B;;;;"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e,t=require("react"),i=require("@contentful/field-editor-shared"),r=require("emotion"),n=(e=require("lodash/isEqual"))&&"object"==typeof e&&"default"in e?e.default:e,l=require("@contentful/f36-components"),u=r.css({direction:"rtl"});function a(e){return null===e||0===e.length}function o(e){var r=e.field,n=e.locales.direction[r.locale]||"ltr";return t.createElement(i.FieldConnector,{throttle:0,isEmptyValue:a,field:r,isInitiallyDisabled:e.isInitiallyDisabled},(function(e){return t.createElement(s,Object.assign({},e,{direction:n,isRequired:r.required}))}))}function s(e){var i=e.setValue,r=e.value,a=e.errors,o=e.disabled,s=e.direction,d=e.isRequired,c=t.useState((function(){return(r||[]).join(", ")})),f=c[1];return t.createElement(l.TextInput,{testId:"list-editor-input",className:"rtl"===s?u:"",isRequired:d,isInvalid:a.length>0,isDisabled:o,value:c[0],onChange:function(e){var t=e.target.value.split(",").map((function(e){return e.trim()})).filter((function(e){return e})),l=!n(t,r);i(t);var u=t.join(", ");f(l?u:e.target.value)}})}o.defaultProps={isInitiallyDisabled:!0},exports.ListEditor=o;
|
|
2
2
|
//# sourceMappingURL=field-editor-list.cjs.production.min.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"field-editor-list.cjs.production.min.js","sources":["../src/styles.ts","../src/ListEditor.tsx"],"sourcesContent":["import { css } from 'emotion';\n\nexport const rightToLeft = css({\n direction: 'rtl'
|
|
1
|
+
{"version":3,"file":"field-editor-list.cjs.production.min.js","sources":["../src/styles.ts","../src/ListEditor.tsx"],"sourcesContent":["import { css } from 'emotion';\n\nexport const rightToLeft = css({\n direction: 'rtl',\n});\n","import * as React from 'react';\nimport { FieldAPI, FieldConnector, LocalesAPI } from '@contentful/field-editor-shared';\nimport * as styles from './styles';\nimport isEqual from 'lodash/isEqual';\n\nimport { TextInput } from '@contentful/f36-components';\nimport { FieldConnectorChildProps } from '@contentful/field-editor-shared/dist/FieldConnector';\n\nexport interface ListEditorProps {\n /**\n * is the field disabled initially\n */\n isInitiallyDisabled: boolean;\n\n /**\n * sdk.field\n */\n field: FieldAPI;\n\n /**\n * sdk.locales\n */\n locales: LocalesAPI;\n}\n\ntype ListValue = string[];\n\nfunction isEmptyListValue(value: ListValue | null) {\n return value === null || value.length === 0;\n}\n\nexport function ListEditor(props: ListEditorProps) {\n const { field, locales } = props;\n\n const direction = locales.direction[field.locale] || 'ltr';\n\n return (\n <FieldConnector<ListValue>\n throttle={0}\n isEmptyValue={isEmptyListValue}\n field={field}\n isInitiallyDisabled={props.isInitiallyDisabled}>\n {(childProps) => (\n <ListEditorInternal {...childProps} direction={direction} isRequired={field.required} />\n )}\n </FieldConnector>\n );\n}\n\nfunction ListEditorInternal({\n setValue,\n value,\n errors,\n disabled,\n direction,\n isRequired,\n}: FieldConnectorChildProps<ListValue> & { direction: 'rtl' | 'ltr'; isRequired: boolean }) {\n const [valueState, setValueState] = React.useState(() => (value || []).join(', '));\n\n const onChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n const valueAsArray = e.target.value\n .split(',')\n .map((item) => item.trim())\n .filter((item) => item);\n const changed = !isEqual(valueAsArray, value);\n setValue(valueAsArray);\n\n const valueAsString = valueAsArray.join(', ');\n setValueState(changed ? valueAsString : e.target.value);\n };\n\n return (\n <TextInput\n testId=\"list-editor-input\"\n className={direction === 'rtl' ? styles.rightToLeft : ''}\n isRequired={isRequired}\n isInvalid={errors.length > 0}\n isDisabled={disabled}\n value={valueState}\n onChange={onChange}\n />\n );\n}\n\nListEditor.defaultProps = {\n isInitiallyDisabled: true,\n};\n"],"names":["rightToLeft","css","direction","isEmptyListValue","value","length","ListEditor","props","field","locales","locale","React","FieldConnector","throttle","isEmptyValue","isInitiallyDisabled","childProps","ListEditorInternal","isRequired","required","setValue","errors","disabled","join","setValueState","TextInput","testId","className","styles","isInvalid","isDisabled","onChange","e","valueAsArray","target","split","map","item","trim","filter","changed","isEqual","valueAsString","defaultProps"],"mappings":"sRAEaA,EAAcC,MAAI,CAC7BC,UAAW,QCwBb,SAASC,EAAiBC,UACP,OAAVA,GAAmC,IAAjBA,EAAMC,gBAGjBC,EAAWC,OACjBC,EAAmBD,EAAnBC,MAEFN,EAFqBK,EAAZE,QAEWP,UAAUM,EAAME,SAAW,aAGnDC,gBAACC,kBACCC,SAAU,EACVC,aAAcX,EACdK,MAAOA,EACPO,oBAAqBR,EAAMQ,sBAC1B,SAACC,UACAL,gBAACM,mBAAuBD,GAAYd,UAAWA,EAAWgB,WAAYV,EAAMW,eAMpF,SAASF,SACPG,IAAAA,SACAhB,IAAAA,MACAiB,IAAAA,OACAC,IAAAA,SACApB,IAAAA,UACAgB,IAAAA,aAEoCP,YAAe,kBAAOP,GAAS,IAAImB,KAAK,SAAzDC,cAejBb,gBAACc,aACCC,OAAO,oBACPC,UAAyB,QAAdzB,EAAsB0B,EAAqB,GACtDV,WAAYA,EACZW,UAAWR,EAAOhB,OAAS,EAC3ByB,WAAYR,EACZlB,WACA2B,SApBa,SAACC,OACVC,EAAeD,EAAEE,OAAO9B,MAC3B+B,MAAM,KACNC,KAAI,SAACC,UAASA,EAAKC,UACnBC,QAAO,SAACF,UAASA,KACdG,GAAWC,EAAQR,EAAc7B,GACvCgB,EAASa,OAEHS,EAAgBT,EAAaV,KAAK,MACxCC,EAAcgB,EAAUE,EAAgBV,EAAEE,OAAO9B,UAgBrDE,EAAWqC,aAAe,CACxB5B,qBAAqB"}
|
|
@@ -1,7 +1,8 @@
|
|
|
1
|
-
import { createElement } from 'react';
|
|
1
|
+
import { createElement, useState } from 'react';
|
|
2
2
|
import { FieldConnector } from '@contentful/field-editor-shared';
|
|
3
|
-
import { TextInput } from '@contentful/forma-36-react-components';
|
|
4
3
|
import { css } from 'emotion';
|
|
4
|
+
import isEqual from 'lodash-es/isEqual';
|
|
5
|
+
import { TextInput } from '@contentful/f36-components';
|
|
5
6
|
|
|
6
7
|
var rightToLeft = /*#__PURE__*/css({
|
|
7
8
|
direction: 'rtl'
|
|
@@ -20,33 +21,51 @@ function ListEditor(props) {
|
|
|
20
21
|
isEmptyValue: isEmptyListValue,
|
|
21
22
|
field: field,
|
|
22
23
|
isInitiallyDisabled: props.isInitiallyDisabled
|
|
23
|
-
}, function (
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
24
|
+
}, function (childProps) {
|
|
25
|
+
return createElement(ListEditorInternal, Object.assign({}, childProps, {
|
|
26
|
+
direction: direction,
|
|
27
|
+
isRequired: field.required
|
|
28
|
+
}));
|
|
29
|
+
});
|
|
30
|
+
}
|
|
31
|
+
|
|
32
|
+
function ListEditorInternal(_ref) {
|
|
33
|
+
var setValue = _ref.setValue,
|
|
34
|
+
value = _ref.value,
|
|
35
|
+
errors = _ref.errors,
|
|
36
|
+
disabled = _ref.disabled,
|
|
37
|
+
direction = _ref.direction,
|
|
38
|
+
isRequired = _ref.isRequired;
|
|
39
|
+
|
|
40
|
+
var _React$useState = useState(function () {
|
|
41
|
+
return (value || []).join(', ');
|
|
42
|
+
}),
|
|
43
|
+
valueState = _React$useState[0],
|
|
44
|
+
setValueState = _React$useState[1];
|
|
45
|
+
|
|
46
|
+
var onChange = function onChange(e) {
|
|
47
|
+
var valueAsArray = e.target.value.split(',').map(function (item) {
|
|
48
|
+
return item.trim();
|
|
49
|
+
}).filter(function (item) {
|
|
50
|
+
return item;
|
|
47
51
|
});
|
|
52
|
+
var changed = !isEqual(valueAsArray, value);
|
|
53
|
+
setValue(valueAsArray);
|
|
54
|
+
var valueAsString = valueAsArray.join(', ');
|
|
55
|
+
setValueState(changed ? valueAsString : e.target.value);
|
|
56
|
+
};
|
|
57
|
+
|
|
58
|
+
return createElement(TextInput, {
|
|
59
|
+
testId: "list-editor-input",
|
|
60
|
+
className: direction === 'rtl' ? rightToLeft : '',
|
|
61
|
+
isRequired: isRequired,
|
|
62
|
+
isInvalid: errors.length > 0,
|
|
63
|
+
isDisabled: disabled,
|
|
64
|
+
value: valueState,
|
|
65
|
+
onChange: onChange
|
|
48
66
|
});
|
|
49
67
|
}
|
|
68
|
+
|
|
50
69
|
ListEditor.defaultProps = {
|
|
51
70
|
isInitiallyDisabled: true
|
|
52
71
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"field-editor-list.esm.js","sources":["../src/styles.ts","../src/ListEditor.tsx"],"sourcesContent":["import { css } from 'emotion';\n\nexport const rightToLeft = css({\n direction: 'rtl'
|
|
1
|
+
{"version":3,"file":"field-editor-list.esm.js","sources":["../src/styles.ts","../src/ListEditor.tsx"],"sourcesContent":["import { css } from 'emotion';\n\nexport const rightToLeft = css({\n direction: 'rtl',\n});\n","import * as React from 'react';\nimport { FieldAPI, FieldConnector, LocalesAPI } from '@contentful/field-editor-shared';\nimport * as styles from './styles';\nimport isEqual from 'lodash/isEqual';\n\nimport { TextInput } from '@contentful/f36-components';\nimport { FieldConnectorChildProps } from '@contentful/field-editor-shared/dist/FieldConnector';\n\nexport interface ListEditorProps {\n /**\n * is the field disabled initially\n */\n isInitiallyDisabled: boolean;\n\n /**\n * sdk.field\n */\n field: FieldAPI;\n\n /**\n * sdk.locales\n */\n locales: LocalesAPI;\n}\n\ntype ListValue = string[];\n\nfunction isEmptyListValue(value: ListValue | null) {\n return value === null || value.length === 0;\n}\n\nexport function ListEditor(props: ListEditorProps) {\n const { field, locales } = props;\n\n const direction = locales.direction[field.locale] || 'ltr';\n\n return (\n <FieldConnector<ListValue>\n throttle={0}\n isEmptyValue={isEmptyListValue}\n field={field}\n isInitiallyDisabled={props.isInitiallyDisabled}>\n {(childProps) => (\n <ListEditorInternal {...childProps} direction={direction} isRequired={field.required} />\n )}\n </FieldConnector>\n );\n}\n\nfunction ListEditorInternal({\n setValue,\n value,\n errors,\n disabled,\n direction,\n isRequired,\n}: FieldConnectorChildProps<ListValue> & { direction: 'rtl' | 'ltr'; isRequired: boolean }) {\n const [valueState, setValueState] = React.useState(() => (value || []).join(', '));\n\n const onChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n const valueAsArray = e.target.value\n .split(',')\n .map((item) => item.trim())\n .filter((item) => item);\n const changed = !isEqual(valueAsArray, value);\n setValue(valueAsArray);\n\n const valueAsString = valueAsArray.join(', ');\n setValueState(changed ? valueAsString : e.target.value);\n };\n\n return (\n <TextInput\n testId=\"list-editor-input\"\n className={direction === 'rtl' ? styles.rightToLeft : ''}\n isRequired={isRequired}\n isInvalid={errors.length > 0}\n isDisabled={disabled}\n value={valueState}\n onChange={onChange}\n />\n );\n}\n\nListEditor.defaultProps = {\n isInitiallyDisabled: true,\n};\n"],"names":["rightToLeft","css","direction","isEmptyListValue","value","length","ListEditor","props","field","locales","locale","React","FieldConnector","throttle","isEmptyValue","isInitiallyDisabled","childProps","ListEditorInternal","isRequired","required","setValue","errors","disabled","join","valueState","setValueState","onChange","e","valueAsArray","target","split","map","item","trim","filter","changed","isEqual","valueAsString","TextInput","testId","className","styles","isInvalid","isDisabled","defaultProps"],"mappings":";;;;;;AAEO,IAAMA,WAAW,gBAAGC,GAAG,CAAC;AAC7BC,EAAAA,SAAS,EAAE;AADkB,CAAD,CAAvB;;ACyBP,SAASC,gBAAT,CAA0BC,KAA1B;AACE,SAAOA,KAAK,KAAK,IAAV,IAAkBA,KAAK,CAACC,MAAN,KAAiB,CAA1C;AACD;;AAED,SAAgBC,WAAWC;AACzB,MAAQC,KAAR,GAA2BD,KAA3B,CAAQC,KAAR;AAAA,MAAeC,OAAf,GAA2BF,KAA3B,CAAeE,OAAf;AAEA,MAAMP,SAAS,GAAGO,OAAO,CAACP,SAAR,CAAkBM,KAAK,CAACE,MAAxB,KAAmC,KAArD;AAEA,SACEC,aAAA,CAACC,cAAD;AACEC,IAAAA,QAAQ,EAAE;AACVC,IAAAA,YAAY,EAAEX;AACdK,IAAAA,KAAK,EAAEA;AACPO,IAAAA,mBAAmB,EAAER,KAAK,CAACQ;GAJ7B,EAKG,UAACC,UAAD;AAAA,WACCL,aAAA,CAACM,kBAAD,oBAAwBD;AAAYd,MAAAA,SAAS,EAAEA;AAAWgB,MAAAA,UAAU,EAAEV,KAAK,CAACW;MAA5E,CADD;AAAA,GALH,CADF;AAWD;;AAED,SAASF,kBAAT;MACEG,gBAAAA;MACAhB,aAAAA;MACAiB,cAAAA;MACAC,gBAAAA;MACApB,iBAAAA;MACAgB,kBAAAA;;AAEA,wBAAoCP,QAAA,CAAe;AAAA,WAAM,CAACP,KAAK,IAAI,EAAV,EAAcmB,IAAd,CAAmB,IAAnB,CAAN;AAAA,GAAf,CAApC;AAAA,MAAOC,UAAP;AAAA,MAAmBC,aAAnB;;AAEA,MAAMC,QAAQ,GAAG,SAAXA,QAAW,CAACC,CAAD;AACf,QAAMC,YAAY,GAAGD,CAAC,CAACE,MAAF,CAASzB,KAAT,CAClB0B,KADkB,CACZ,GADY,EAElBC,GAFkB,CAEd,UAACC,IAAD;AAAA,aAAUA,IAAI,CAACC,IAAL,EAAV;AAAA,KAFc,EAGlBC,MAHkB,CAGX,UAACF,IAAD;AAAA,aAAUA,IAAV;AAAA,KAHW,CAArB;AAIA,QAAMG,OAAO,GAAG,CAACC,OAAO,CAACR,YAAD,EAAexB,KAAf,CAAxB;AACAgB,IAAAA,QAAQ,CAACQ,YAAD,CAAR;AAEA,QAAMS,aAAa,GAAGT,YAAY,CAACL,IAAb,CAAkB,IAAlB,CAAtB;AACAE,IAAAA,aAAa,CAACU,OAAO,GAAGE,aAAH,GAAmBV,CAAC,CAACE,MAAF,CAASzB,KAApC,CAAb;AACD,GAVD;;AAYA,SACEO,aAAA,CAAC2B,SAAD;AACEC,IAAAA,MAAM,EAAC;AACPC,IAAAA,SAAS,EAAEtC,SAAS,KAAK,KAAd,GAAsBuC,WAAtB,GAA2C;AACtDvB,IAAAA,UAAU,EAAEA;AACZwB,IAAAA,SAAS,EAAErB,MAAM,CAAChB,MAAP,GAAgB;AAC3BsC,IAAAA,UAAU,EAAErB;AACZlB,IAAAA,KAAK,EAAEoB;AACPE,IAAAA,QAAQ,EAAEA;GAPZ,CADF;AAWD;;AAEDpB,UAAU,CAACsC,YAAX,GAA0B;AACxB7B,EAAAA,mBAAmB,EAAE;AADG,CAA1B;;;;"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@contentful/field-editor-list",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "1.0.2",
|
|
4
4
|
"main": "dist/index.js",
|
|
5
5
|
"module": "dist/field-editor-list.esm.js",
|
|
6
6
|
"typings": "dist/index.d.ts",
|
|
@@ -21,15 +21,15 @@
|
|
|
21
21
|
"tsc": "tsc -p ./ --noEmit"
|
|
22
22
|
},
|
|
23
23
|
"dependencies": {
|
|
24
|
-
"@contentful/
|
|
25
|
-
"@contentful/
|
|
26
|
-
"@contentful/
|
|
24
|
+
"@contentful/f36-components": "^4.0.1-beta.2527",
|
|
25
|
+
"@contentful/f36-tokens": "^4.0.1-beta.2527",
|
|
26
|
+
"@contentful/field-editor-shared": "^1.0.1",
|
|
27
27
|
"emotion": "^10.0.17",
|
|
28
28
|
"lodash": "^4.17.15",
|
|
29
29
|
"lodash-es": "^4.17.15"
|
|
30
30
|
},
|
|
31
31
|
"devDependencies": {
|
|
32
|
-
"@contentful/field-editor-test-utils": "^0.
|
|
32
|
+
"@contentful/field-editor-test-utils": "^1.0.1"
|
|
33
33
|
},
|
|
34
34
|
"peerDependencies": {
|
|
35
35
|
"react": ">=16.8.0"
|
|
@@ -44,5 +44,5 @@
|
|
|
44
44
|
}
|
|
45
45
|
}
|
|
46
46
|
},
|
|
47
|
-
"gitHead": "
|
|
47
|
+
"gitHead": "0919bd0a8c5a7e351f1247798aaf0271473807fe"
|
|
48
48
|
}
|