@contentful/field-editor-dropdown 0.15.1 → 0.16.0

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 CHANGED
@@ -3,197 +3,114 @@
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.15.1](https://github.com/contentful/field-editors/compare/@contentful/field-editor-dropdown@0.15.0...@contentful/field-editor-dropdown@0.15.1) (2021-10-14)
6
+ # [0.16.0](https://github.com/contentful/field-editors/compare/@contentful/field-editor-dropdown@0.15.1...@contentful/field-editor-dropdown@0.16.0) (2021-11-04)
7
7
 
8
- **Note:** Version bump only for package @contentful/field-editor-dropdown
8
+ ### Features
9
9
 
10
+ - Forma v4 components adoption ([#805](https://github.com/contentful/field-editors/issues/805)) ([526bde6](https://github.com/contentful/field-editors/commit/526bde6e10e0ee3789705ec10fb31489af7ca59e))
10
11
 
12
+ ### BREAKING CHANGES
11
13
 
14
+ - adopts a new Forma v4 beta
12
15
 
16
+ ## [0.15.1](https://github.com/contentful/field-editors/compare/@contentful/field-editor-dropdown@0.15.0...@contentful/field-editor-dropdown@0.15.1) (2021-10-14)
13
17
 
14
- # [0.15.0](https://github.com/contentful/field-editors/compare/@contentful/field-editor-dropdown@0.14.4...@contentful/field-editor-dropdown@0.15.0) (2021-10-06)
18
+ **Note:** Version bump only for package @contentful/field-editor-dropdown
15
19
 
20
+ # [0.15.0](https://github.com/contentful/field-editors/compare/@contentful/field-editor-dropdown@0.14.4...@contentful/field-editor-dropdown@0.15.0) (2021-10-06)
16
21
 
17
22
  ### Features
18
23
 
19
- * [EXT-3161] bump app sdk to v4 ([#881](https://github.com/contentful/field-editors/issues/881)) ([9c4a2af](https://github.com/contentful/field-editors/commit/9c4a2af07da203d59fb5f15c3a5188ecc64b1d44))
20
-
21
-
22
-
23
-
24
+ - [EXT-3161] bump app sdk to v4 ([#881](https://github.com/contentful/field-editors/issues/881)) ([9c4a2af](https://github.com/contentful/field-editors/commit/9c4a2af07da203d59fb5f15c3a5188ecc64b1d44))
24
25
 
25
26
  ## [0.14.4](https://github.com/contentful/field-editors/compare/@contentful/field-editor-dropdown@0.14.3...@contentful/field-editor-dropdown@0.14.4) (2021-09-17)
26
27
 
27
28
  **Note:** Version bump only for package @contentful/field-editor-dropdown
28
29
 
29
-
30
-
31
-
32
-
33
30
  ## [0.14.3](https://github.com/contentful/field-editors/compare/@contentful/field-editor-dropdown@0.14.2...@contentful/field-editor-dropdown@0.14.3) (2021-09-16)
34
31
 
35
32
  **Note:** Version bump only for package @contentful/field-editor-dropdown
36
33
 
37
-
38
-
39
-
40
-
41
34
  ## [0.14.2](https://github.com/contentful/field-editors/compare/@contentful/field-editor-dropdown@0.14.1...@contentful/field-editor-dropdown@0.14.2) (2021-08-19)
42
35
 
43
36
  **Note:** Version bump only for package @contentful/field-editor-dropdown
44
37
 
45
-
46
-
47
-
48
-
49
38
  ## [0.14.1](https://github.com/contentful/field-editors/compare/@contentful/field-editor-dropdown@0.14.0...@contentful/field-editor-dropdown@0.14.1) (2021-07-29)
50
39
 
51
40
  **Note:** Version bump only for package @contentful/field-editor-dropdown
52
41
 
53
-
54
-
55
-
56
-
57
42
  # [0.14.0](https://github.com/contentful/field-editors/compare/@contentful/field-editor-dropdown@0.13.6...@contentful/field-editor-dropdown@0.14.0) (2021-07-23)
58
43
 
59
-
60
44
  ### Features
61
45
 
62
- * 💡 new color tokens ([#778](https://github.com/contentful/field-editors/issues/778)) ([fba548d](https://github.com/contentful/field-editors/commit/fba548de32305016df7f2685634eefb14294828f))
63
-
64
-
65
-
66
-
46
+ - 💡 new color tokens ([#778](https://github.com/contentful/field-editors/issues/778)) ([fba548d](https://github.com/contentful/field-editors/commit/fba548de32305016df7f2685634eefb14294828f))
67
47
 
68
48
  ## [0.13.6](https://github.com/contentful/field-editors/compare/@contentful/field-editor-dropdown@0.13.3...@contentful/field-editor-dropdown@0.13.6) (2021-07-06)
69
49
 
70
50
  **Note:** Version bump only for package @contentful/field-editor-dropdown
71
51
 
72
-
73
-
74
-
75
-
76
52
  ## [0.13.5](https://github.com/contentful/field-editors/compare/@contentful/field-editor-dropdown@0.13.3...@contentful/field-editor-dropdown@0.13.5) (2021-07-06)
77
53
 
78
54
  **Note:** Version bump only for package @contentful/field-editor-dropdown
79
55
 
80
-
81
-
82
-
83
-
84
56
  ## [0.13.4](https://github.com/contentful/field-editors/compare/@contentful/field-editor-dropdown@0.13.3...@contentful/field-editor-dropdown@0.13.4) (2021-06-23)
85
57
 
86
58
  **Note:** Version bump only for package @contentful/field-editor-dropdown
87
59
 
88
-
89
-
90
-
91
-
92
60
  ## [0.13.3](https://github.com/contentful/field-editors/compare/@contentful/field-editor-dropdown@0.13.2...@contentful/field-editor-dropdown@0.13.3) (2021-06-23)
93
61
 
94
62
  **Note:** Version bump only for package @contentful/field-editor-dropdown
95
63
 
96
-
97
-
98
-
99
-
100
64
  ## [0.13.2](https://github.com/contentful/field-editors/compare/@contentful/field-editor-dropdown@0.13.1...@contentful/field-editor-dropdown@0.13.2) (2021-06-22)
101
65
 
102
66
  **Note:** Version bump only for package @contentful/field-editor-dropdown
103
67
 
104
-
105
-
106
-
107
-
108
68
  ## [0.13.1](https://github.com/contentful/field-editors/compare/@contentful/field-editor-dropdown@0.13.0...@contentful/field-editor-dropdown@0.13.1) (2021-03-05)
109
69
 
110
70
  **Note:** Version bump only for package @contentful/field-editor-dropdown
111
71
 
112
-
113
-
114
-
115
-
116
72
  # [0.13.0](https://github.com/contentful/field-editors/compare/@contentful/field-editor-dropdown@0.12.2...@contentful/field-editor-dropdown@0.13.0) (2021-02-19)
117
73
 
118
-
119
74
  ### Features
120
75
 
121
- * bump min version of forma-36 ([#606](https://github.com/contentful/field-editors/issues/606)) ([fd57c7a](https://github.com/contentful/field-editors/commit/fd57c7a4312766af38c01507f17706ab22992617))
122
-
123
-
124
-
125
-
76
+ - bump min version of forma-36 ([#606](https://github.com/contentful/field-editors/issues/606)) ([fd57c7a](https://github.com/contentful/field-editors/commit/fd57c7a4312766af38c01507f17706ab22992617))
126
77
 
127
78
  ## [0.12.2](https://github.com/contentful/field-editors/compare/@contentful/field-editor-dropdown@0.12.1...@contentful/field-editor-dropdown@0.12.2) (2021-02-09)
128
79
 
129
80
  **Note:** Version bump only for package @contentful/field-editor-dropdown
130
81
 
131
-
132
-
133
-
134
-
135
82
  ## [0.12.1](https://github.com/contentful/field-editors/compare/@contentful/field-editor-dropdown@0.12.0...@contentful/field-editor-dropdown@0.12.1) (2021-02-01)
136
83
 
137
84
  **Note:** Version bump only for package @contentful/field-editor-dropdown
138
85
 
139
-
140
-
141
-
142
-
143
86
  # [0.12.0](https://github.com/contentful/field-editors/compare/@contentful/field-editor-dropdown@0.11.0...@contentful/field-editor-dropdown@0.12.0) (2021-01-20)
144
87
 
145
-
146
88
  ### Features
147
89
 
148
- * 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))
149
-
150
-
151
-
152
-
90
+ - 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))
153
91
 
154
92
  # [0.11.0](https://github.com/contentful/field-editors/compare/@contentful/field-editor-dropdown@0.10.5...@contentful/field-editor-dropdown@0.11.0) (2021-01-12)
155
93
 
156
-
157
94
  ### Features
158
95
 
159
- * 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))
160
-
161
-
162
-
163
-
96
+ - 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))
164
97
 
165
98
  ## [0.10.5](https://github.com/contentful/field-editors/compare/@contentful/field-editor-dropdown@0.10.4...@contentful/field-editor-dropdown@0.10.5) (2020-12-16)
166
99
 
167
100
  **Note:** Version bump only for package @contentful/field-editor-dropdown
168
101
 
169
-
170
-
171
-
172
-
173
102
  ## [0.10.4](https://github.com/contentful/field-editors/compare/@contentful/field-editor-dropdown@0.10.3...@contentful/field-editor-dropdown@0.10.4) (2020-11-06)
174
103
 
175
104
  **Note:** Version bump only for package @contentful/field-editor-dropdown
176
105
 
177
-
178
-
179
-
180
-
181
106
  ## [0.10.3](https://github.com/contentful/field-editors/compare/@contentful/field-editor-dropdown@0.10.2...@contentful/field-editor-dropdown@0.10.3) (2020-11-06)
182
107
 
183
108
  **Note:** Version bump only for package @contentful/field-editor-dropdown
184
109
 
185
-
186
-
187
-
188
-
189
110
  ## [0.10.2](https://github.com/contentful/field-editors/compare/@contentful/field-editor-dropdown@0.10.1...@contentful/field-editor-dropdown@0.10.2) (2020-10-28)
190
111
 
191
112
  **Note:** Version bump only for package @contentful/field-editor-dropdown
192
113
 
193
-
194
-
195
-
196
-
197
114
  ## [0.10.1](https://github.com/contentful/field-editors/compare/@contentful/field-editor-dropdown@0.10.0...@contentful/field-editor-dropdown@0.10.1) (2020-08-24)
198
115
 
199
116
  **Note:** Version bump only for package @contentful/field-editor-dropdown
package/README.md CHANGED
@@ -7,6 +7,5 @@ npm install @contentful/field-editor-dropdown
7
7
  This package contains a React `DropdownEditor` component that is used for the `Text`,`Symbol`,`Integer` and `Number` field types in the Contentful web application.
8
8
 
9
9
  ```js
10
- import '@contentful/forma-36-react-components/dist/styles.css';
11
10
  import { DropdownEditor } from '@contentful/field-editor-dropdown';
12
11
  ```
@@ -3,10 +3,10 @@
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
5
  var React = require('react');
6
- var forma36ReactComponents = require('@contentful/forma-36-react-components');
7
6
  var fieldEditorShared = require('@contentful/field-editor-shared');
8
7
  var nanoid = require('nanoid');
9
8
  var emotion = require('emotion');
9
+ var f36Components = require('@contentful/f36-components');
10
10
 
11
11
  function parseValue(value, fieldType) {
12
12
  if (value === '') {
@@ -64,21 +64,21 @@ function DropdownEditor(props) {
64
64
  errors = _ref.errors,
65
65
  disabled = _ref.disabled,
66
66
  setValue = _ref.setValue;
67
- return React.createElement(forma36ReactComponents.Select, {
67
+ return React.createElement(f36Components.Select, {
68
68
  testId: "dropdown-editor",
69
- hasError: errors.length > 0,
69
+ isInvalid: errors.length > 0,
70
70
  isDisabled: disabled,
71
71
  className: direction === 'rtl' ? rightToLeft : '',
72
- required: field.required,
72
+ isRequired: field.required,
73
73
  value: value === undefined ? '' : String(value),
74
74
  onChange: function onChange(e) {
75
75
  var value = e.target.value;
76
76
  setValue(parseValue(value, field.type));
77
77
  }
78
- }, React.createElement(forma36ReactComponents.Option, {
78
+ }, React.createElement(f36Components.Select.Option, {
79
79
  value: ""
80
80
  }, "Choose a value"), options.map(function (option) {
81
- return React.createElement(forma36ReactComponents.Option, {
81
+ return React.createElement(f36Components.Select.Option, {
82
82
  key: option.value,
83
83
  value: String(option.value)
84
84
  }, option.label);
@@ -1 +1 @@
1
- {"version":3,"file":"field-editor-dropdown.cjs.development.js","sources":["../src/dropdownUtils.ts","../src/styles.ts","../src/DropdownEditor.tsx"],"sourcesContent":["import { nanoid } from 'nanoid';\nimport { FieldAPI } from '@contentful/field-editor-shared';\n\ntype DropdownOption = {\n id: string;\n value: string | number | undefined;\n label: string;\n};\n\nexport function parseValue(value: string, fieldType: string): string | number | undefined {\n if (value === '') {\n return undefined;\n }\n if (fieldType === 'Integer' || fieldType === 'Number') {\n const asNumber = Number(value);\n return isNaN(asNumber) ? undefined : asNumber;\n }\n return value;\n}\n\nexport function getOptions(field: FieldAPI): DropdownOption[] {\n // Get first object that has a 'in' property\n const validations = field.validations || [];\n const predefinedValues = validations\n .filter(validation => (validation as any).in)\n .map(validation => (validation as any).in);\n\n const firstPredefinedValues = predefinedValues.length > 0 ? predefinedValues[0] : [];\n\n return firstPredefinedValues\n .map((value: string) => ({\n id: nanoid(6),\n value: parseValue(value, field.type),\n label: String(value)\n }))\n .filter((item: { value: string | number | undefined; label: string }) => {\n return item.value !== undefined;\n });\n}\n","import { css } from 'emotion';\n\nexport const rightToLeft = css({\n direction: 'rtl'\n});\n","import * as React from 'react';\nimport { Select, Option } from '@contentful/forma-36-react-components';\nimport {\n FieldAPI,\n FieldConnector,\n PredefinedValuesError,\n LocalesAPI,\n} from '@contentful/field-editor-shared';\nimport { getOptions, parseValue } from './dropdownUtils';\nimport * as styles from './styles';\n\nexport interface DropdownEditorProps {\n /**\n * is the field disabled initially\n */\n isInitiallyDisabled: boolean;\n /**\n * sdk.field\n */\n field: FieldAPI;\n\n /**\n * sdk.locales\n */\n locales: LocalesAPI;\n}\n\nexport function DropdownEditor(props: DropdownEditorProps) {\n const { field, locales } = props;\n\n const options = getOptions(field);\n const misconfigured = options.length === 0;\n\n if (misconfigured) {\n return <PredefinedValuesError />;\n }\n\n const direction = locales.direction[field.locale] || 'ltr';\n\n return (\n <FieldConnector<string | number>\n throttle={0}\n field={field}\n isInitiallyDisabled={props.isInitiallyDisabled}>\n {({ value, errors, disabled, setValue }) => (\n <Select\n testId=\"dropdown-editor\"\n hasError={errors.length > 0}\n isDisabled={disabled}\n className={direction === 'rtl' ? styles.rightToLeft : ''}\n required={field.required}\n value={value === undefined ? '' : String(value)}\n onChange={(e: React.ChangeEvent<HTMLSelectElement>) => {\n const value = e.target.value;\n setValue(parseValue(value, field.type));\n }}>\n <Option value=\"\">Choose a value</Option>\n {options.map((option) => (\n <Option key={option.value} value={String(option.value)}>\n {option.label}\n </Option>\n ))}\n </Select>\n )}\n </FieldConnector>\n );\n}\n\nDropdownEditor.defaultProps = {\n isInitiallyDisabled: true,\n};\n"],"names":["parseValue","value","fieldType","undefined","asNumber","Number","isNaN","getOptions","field","validations","predefinedValues","filter","validation","map","firstPredefinedValues","length","id","nanoid","type","label","String","item","rightToLeft","css","direction","DropdownEditor","props","locales","options","misconfigured","React","PredefinedValuesError","locale","FieldConnector","throttle","isInitiallyDisabled","errors","disabled","setValue","Select","testId","hasError","isDisabled","className","styles","required","onChange","e","target","Option","option","key","defaultProps"],"mappings":"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"}
1
+ {"version":3,"file":"field-editor-dropdown.cjs.development.js","sources":["../src/dropdownUtils.ts","../src/styles.ts","../src/DropdownEditor.tsx"],"sourcesContent":["import { nanoid } from 'nanoid';\nimport { FieldAPI } from '@contentful/field-editor-shared';\n\ntype DropdownOption = {\n id: string;\n value: string | number | undefined;\n label: string;\n};\n\nexport function parseValue(value: string, fieldType: string): string | number | undefined {\n if (value === '') {\n return undefined;\n }\n if (fieldType === 'Integer' || fieldType === 'Number') {\n const asNumber = Number(value);\n return isNaN(asNumber) ? undefined : asNumber;\n }\n return value;\n}\n\nexport function getOptions(field: FieldAPI): DropdownOption[] {\n // Get first object that has a 'in' property\n const validations = field.validations || [];\n const predefinedValues = validations\n .filter((validation) => (validation as any).in)\n .map((validation) => (validation as any).in);\n\n const firstPredefinedValues = predefinedValues.length > 0 ? predefinedValues[0] : [];\n\n return firstPredefinedValues\n .map((value: string) => ({\n id: nanoid(6),\n value: parseValue(value, field.type),\n label: String(value),\n }))\n .filter((item: { value: string | number | undefined; label: string }) => {\n return item.value !== undefined;\n });\n}\n","import { css } from 'emotion';\n\nexport const rightToLeft = css({\n direction: 'rtl',\n});\n","import * as React from 'react';\nimport {\n FieldAPI,\n FieldConnector,\n PredefinedValuesError,\n LocalesAPI,\n} from '@contentful/field-editor-shared';\nimport { getOptions, parseValue } from './dropdownUtils';\nimport * as styles from './styles';\n\nimport { Select } from '@contentful/f36-components';\n\nexport interface DropdownEditorProps {\n /**\n * is the field disabled initially\n */\n isInitiallyDisabled: boolean;\n /**\n * sdk.field\n */\n field: FieldAPI;\n\n /**\n * sdk.locales\n */\n locales: LocalesAPI;\n}\n\nexport function DropdownEditor(props: DropdownEditorProps) {\n const { field, locales } = props;\n\n const options = getOptions(field);\n const misconfigured = options.length === 0;\n\n if (misconfigured) {\n return <PredefinedValuesError />;\n }\n\n const direction = locales.direction[field.locale] || 'ltr';\n\n return (\n <FieldConnector<string | number>\n throttle={0}\n field={field}\n isInitiallyDisabled={props.isInitiallyDisabled}>\n {({ value, errors, disabled, setValue }) => (\n <Select\n testId=\"dropdown-editor\"\n isInvalid={errors.length > 0}\n isDisabled={disabled}\n className={direction === 'rtl' ? styles.rightToLeft : ''}\n isRequired={field.required}\n value={value === undefined ? '' : String(value)}\n onChange={(e: React.ChangeEvent<HTMLSelectElement>) => {\n const value = e.target.value;\n setValue(parseValue(value, field.type));\n }}>\n <Select.Option value=\"\">Choose a value</Select.Option>\n {options.map((option) => (\n <Select.Option key={option.value} value={String(option.value)}>\n {option.label}\n </Select.Option>\n ))}\n </Select>\n )}\n </FieldConnector>\n );\n}\n\nDropdownEditor.defaultProps = {\n isInitiallyDisabled: true,\n};\n"],"names":["parseValue","value","fieldType","undefined","asNumber","Number","isNaN","getOptions","field","validations","predefinedValues","filter","validation","map","firstPredefinedValues","length","id","nanoid","type","label","String","item","rightToLeft","css","direction","DropdownEditor","props","locales","options","misconfigured","React","PredefinedValuesError","locale","FieldConnector","throttle","isInitiallyDisabled","errors","disabled","setValue","Select","testId","isInvalid","isDisabled","className","styles","isRequired","required","onChange","e","target","Option","option","key","defaultProps"],"mappings":"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"}
@@ -1,2 +1,2 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),r=require("@contentful/forma-36-react-components"),t=require("@contentful/field-editor-shared"),n=require("nanoid");function i(e,r){if(""!==e){if("Integer"===r||"Number"===r){var t=Number(e);return isNaN(t)?void 0:t}return e}}function l(e){var r=(e.validations||[]).filter((function(e){return e.in})).map((function(e){return e.in}));return(r.length>0?r[0]:[]).map((function(r){return{id:n.nanoid(6),value:i(r,e.type),label:String(r)}})).filter((function(e){return void 0!==e.value}))}var a=require("emotion").css({direction:"rtl"});function o(n){var o=n.field,u=n.locales,d=l(o);if(0===d.length)return e.createElement(t.PredefinedValuesError,null);var s=u.direction[o.locale]||"ltr";return e.createElement(t.FieldConnector,{throttle:0,field:o,isInitiallyDisabled:n.isInitiallyDisabled},(function(t){var n=t.value,l=t.setValue;return e.createElement(r.Select,{testId:"dropdown-editor",hasError:t.errors.length>0,isDisabled:t.disabled,className:"rtl"===s?a:"",required:o.required,value:void 0===n?"":String(n),onChange:function(e){l(i(e.target.value,o.type))}},e.createElement(r.Option,{value:""},"Choose a value"),d.map((function(t){return e.createElement(r.Option,{key:t.value,value:String(t.value)},t.label)})))}))}o.defaultProps={isInitiallyDisabled:!0},exports.DropdownEditor=o,exports.getOptions=l,exports.parseValue=i;
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),r=require("@contentful/field-editor-shared"),t=require("nanoid"),n=require("emotion"),i=require("@contentful/f36-components");function l(e,r){if(""!==e){if("Integer"===r||"Number"===r){var t=Number(e);return isNaN(t)?void 0:t}return e}}function a(e){var r=(e.validations||[]).filter((function(e){return e.in})).map((function(e){return e.in}));return(r.length>0?r[0]:[]).map((function(r){return{id:t.nanoid(6),value:l(r,e.type),label:String(r)}})).filter((function(e){return void 0!==e.value}))}var o=n.css({direction:"rtl"});function u(t){var n=t.field,u=t.locales,d=a(n);if(0===d.length)return e.createElement(r.PredefinedValuesError,null);var s=u.direction[n.locale]||"ltr";return e.createElement(r.FieldConnector,{throttle:0,field:n,isInitiallyDisabled:t.isInitiallyDisabled},(function(r){var t=r.value,a=r.setValue;return e.createElement(i.Select,{testId:"dropdown-editor",isInvalid:r.errors.length>0,isDisabled:r.disabled,className:"rtl"===s?o:"",isRequired:n.required,value:void 0===t?"":String(t),onChange:function(e){a(l(e.target.value,n.type))}},e.createElement(i.Select.Option,{value:""},"Choose a value"),d.map((function(r){return e.createElement(i.Select.Option,{key:r.value,value:String(r.value)},r.label)})))}))}u.defaultProps={isInitiallyDisabled:!0},exports.DropdownEditor=u,exports.getOptions=a,exports.parseValue=l;
2
2
  //# sourceMappingURL=field-editor-dropdown.cjs.production.min.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"field-editor-dropdown.cjs.production.min.js","sources":["../src/dropdownUtils.ts","../src/styles.ts","../src/DropdownEditor.tsx"],"sourcesContent":["import { nanoid } from 'nanoid';\nimport { FieldAPI } from '@contentful/field-editor-shared';\n\ntype DropdownOption = {\n id: string;\n value: string | number | undefined;\n label: string;\n};\n\nexport function parseValue(value: string, fieldType: string): string | number | undefined {\n if (value === '') {\n return undefined;\n }\n if (fieldType === 'Integer' || fieldType === 'Number') {\n const asNumber = Number(value);\n return isNaN(asNumber) ? undefined : asNumber;\n }\n return value;\n}\n\nexport function getOptions(field: FieldAPI): DropdownOption[] {\n // Get first object that has a 'in' property\n const validations = field.validations || [];\n const predefinedValues = validations\n .filter(validation => (validation as any).in)\n .map(validation => (validation as any).in);\n\n const firstPredefinedValues = predefinedValues.length > 0 ? predefinedValues[0] : [];\n\n return firstPredefinedValues\n .map((value: string) => ({\n id: nanoid(6),\n value: parseValue(value, field.type),\n label: String(value)\n }))\n .filter((item: { value: string | number | undefined; label: string }) => {\n return item.value !== undefined;\n });\n}\n","import { css } from 'emotion';\n\nexport const rightToLeft = css({\n direction: 'rtl'\n});\n","import * as React from 'react';\nimport { Select, Option } from '@contentful/forma-36-react-components';\nimport {\n FieldAPI,\n FieldConnector,\n PredefinedValuesError,\n LocalesAPI,\n} from '@contentful/field-editor-shared';\nimport { getOptions, parseValue } from './dropdownUtils';\nimport * as styles from './styles';\n\nexport interface DropdownEditorProps {\n /**\n * is the field disabled initially\n */\n isInitiallyDisabled: boolean;\n /**\n * sdk.field\n */\n field: FieldAPI;\n\n /**\n * sdk.locales\n */\n locales: LocalesAPI;\n}\n\nexport function DropdownEditor(props: DropdownEditorProps) {\n const { field, locales } = props;\n\n const options = getOptions(field);\n const misconfigured = options.length === 0;\n\n if (misconfigured) {\n return <PredefinedValuesError />;\n }\n\n const direction = locales.direction[field.locale] || 'ltr';\n\n return (\n <FieldConnector<string | number>\n throttle={0}\n field={field}\n isInitiallyDisabled={props.isInitiallyDisabled}>\n {({ value, errors, disabled, setValue }) => (\n <Select\n testId=\"dropdown-editor\"\n hasError={errors.length > 0}\n isDisabled={disabled}\n className={direction === 'rtl' ? styles.rightToLeft : ''}\n required={field.required}\n value={value === undefined ? '' : String(value)}\n onChange={(e: React.ChangeEvent<HTMLSelectElement>) => {\n const value = e.target.value;\n setValue(parseValue(value, field.type));\n }}>\n <Option value=\"\">Choose a value</Option>\n {options.map((option) => (\n <Option key={option.value} value={String(option.value)}>\n {option.label}\n </Option>\n ))}\n </Select>\n )}\n </FieldConnector>\n );\n}\n\nDropdownEditor.defaultProps = {\n isInitiallyDisabled: true,\n};\n"],"names":["parseValue","value","fieldType","asNumber","Number","isNaN","undefined","getOptions","field","predefinedValues","validations","filter","validation","map","length","id","nanoid","type","label","String","item","rightToLeft","direction","DropdownEditor","props","locales","options","React","PredefinedValuesError","locale","FieldConnector","throttle","isInitiallyDisabled","setValue","Select","testId","hasError","errors","isDisabled","disabled","className","styles","required","onChange","e","target","Option","option","key","defaultProps"],"mappings":"wNASgBA,EAAWC,EAAeC,MAC1B,KAAVD,MAGc,YAAdC,GAAyC,WAAdA,EAAwB,KAC/CC,EAAWC,OAAOH,UACjBI,MAAMF,QAAYG,EAAYH,SAEhCF,YAGOM,EAAWC,OAGnBC,GADcD,EAAME,aAAe,IAEtCC,QAAO,SAAAC,UAAeA,QACtBC,KAAI,SAAAD,UAAeA,eAEQH,EAAiBK,OAAS,EAAIL,EAAiB,GAAK,IAG/EI,KAAI,SAACZ,SAAmB,CACvBc,GAAIC,SAAO,GACXf,MAAOD,EAAWC,EAAOO,EAAMS,MAC/BC,MAAOC,OAAOlB,OAEfU,QAAO,SAACS,eACed,IAAfc,EAAKnB,SClCX,IAAMoB,yBAAkB,CAC7BC,UAAW,iBCwBGC,EAAeC,OACrBhB,EAAmBgB,EAAnBhB,MAAOiB,EAAYD,EAAZC,QAETC,EAAUnB,EAAWC,MACc,IAAnBkB,EAAQZ,cAGrBa,gBAACC,kCAGJN,EAAYG,EAAQH,UAAUd,EAAMqB,SAAW,aAGnDF,gBAACG,kBACCC,SAAU,EACVvB,MAAOA,EACPwB,oBAAqBR,EAAMQ,sBAC1B,gBAAG/B,IAAAA,MAAyBgC,IAAAA,gBAC3BN,gBAACO,UACCC,OAAO,kBACPC,WAHOC,OAGUvB,OAAS,EAC1BwB,aAJeC,SAKfC,UAAyB,QAAdlB,EAAsBmB,EAAqB,GACtDC,SAAUlC,EAAMkC,SAChBzC,WAAiBK,IAAVL,EAAsB,GAAKkB,OAAOlB,GACzC0C,SAAU,SAACC,GAETX,EAASjC,EADK4C,EAAEC,OAAO5C,MACIO,EAAMS,SAEnCU,gBAACmB,UAAO7C,MAAM,sBACbyB,EAAQb,KAAI,SAACkC,UACZpB,gBAACmB,UAAOE,IAAKD,EAAO9C,MAAOA,MAAOkB,OAAO4B,EAAO9C,QAC7C8C,EAAO7B,cAStBK,EAAe0B,aAAe,CAC5BjB,qBAAqB"}
1
+ {"version":3,"file":"field-editor-dropdown.cjs.production.min.js","sources":["../src/dropdownUtils.ts","../src/styles.ts","../src/DropdownEditor.tsx"],"sourcesContent":["import { nanoid } from 'nanoid';\nimport { FieldAPI } from '@contentful/field-editor-shared';\n\ntype DropdownOption = {\n id: string;\n value: string | number | undefined;\n label: string;\n};\n\nexport function parseValue(value: string, fieldType: string): string | number | undefined {\n if (value === '') {\n return undefined;\n }\n if (fieldType === 'Integer' || fieldType === 'Number') {\n const asNumber = Number(value);\n return isNaN(asNumber) ? undefined : asNumber;\n }\n return value;\n}\n\nexport function getOptions(field: FieldAPI): DropdownOption[] {\n // Get first object that has a 'in' property\n const validations = field.validations || [];\n const predefinedValues = validations\n .filter((validation) => (validation as any).in)\n .map((validation) => (validation as any).in);\n\n const firstPredefinedValues = predefinedValues.length > 0 ? predefinedValues[0] : [];\n\n return firstPredefinedValues\n .map((value: string) => ({\n id: nanoid(6),\n value: parseValue(value, field.type),\n label: String(value),\n }))\n .filter((item: { value: string | number | undefined; label: string }) => {\n return item.value !== undefined;\n });\n}\n","import { css } from 'emotion';\n\nexport const rightToLeft = css({\n direction: 'rtl',\n});\n","import * as React from 'react';\nimport {\n FieldAPI,\n FieldConnector,\n PredefinedValuesError,\n LocalesAPI,\n} from '@contentful/field-editor-shared';\nimport { getOptions, parseValue } from './dropdownUtils';\nimport * as styles from './styles';\n\nimport { Select } from '@contentful/f36-components';\n\nexport interface DropdownEditorProps {\n /**\n * is the field disabled initially\n */\n isInitiallyDisabled: boolean;\n /**\n * sdk.field\n */\n field: FieldAPI;\n\n /**\n * sdk.locales\n */\n locales: LocalesAPI;\n}\n\nexport function DropdownEditor(props: DropdownEditorProps) {\n const { field, locales } = props;\n\n const options = getOptions(field);\n const misconfigured = options.length === 0;\n\n if (misconfigured) {\n return <PredefinedValuesError />;\n }\n\n const direction = locales.direction[field.locale] || 'ltr';\n\n return (\n <FieldConnector<string | number>\n throttle={0}\n field={field}\n isInitiallyDisabled={props.isInitiallyDisabled}>\n {({ value, errors, disabled, setValue }) => (\n <Select\n testId=\"dropdown-editor\"\n isInvalid={errors.length > 0}\n isDisabled={disabled}\n className={direction === 'rtl' ? styles.rightToLeft : ''}\n isRequired={field.required}\n value={value === undefined ? '' : String(value)}\n onChange={(e: React.ChangeEvent<HTMLSelectElement>) => {\n const value = e.target.value;\n setValue(parseValue(value, field.type));\n }}>\n <Select.Option value=\"\">Choose a value</Select.Option>\n {options.map((option) => (\n <Select.Option key={option.value} value={String(option.value)}>\n {option.label}\n </Select.Option>\n ))}\n </Select>\n )}\n </FieldConnector>\n );\n}\n\nDropdownEditor.defaultProps = {\n isInitiallyDisabled: true,\n};\n"],"names":["parseValue","value","fieldType","asNumber","Number","isNaN","undefined","getOptions","field","predefinedValues","validations","filter","validation","map","length","id","nanoid","type","label","String","item","rightToLeft","css","direction","DropdownEditor","props","locales","options","React","PredefinedValuesError","locale","FieldConnector","throttle","isInitiallyDisabled","setValue","Select","testId","isInvalid","errors","isDisabled","disabled","className","styles","isRequired","required","onChange","e","target","Option","option","key","defaultProps"],"mappings":"kOASgBA,EAAWC,EAAeC,MAC1B,KAAVD,MAGc,YAAdC,GAAyC,WAAdA,EAAwB,KAC/CC,EAAWC,OAAOH,UACjBI,MAAMF,QAAYG,EAAYH,SAEhCF,YAGOM,EAAWC,OAGnBC,GADcD,EAAME,aAAe,IAEtCC,QAAO,SAACC,UAAgBA,QACxBC,KAAI,SAACD,UAAgBA,eAEMH,EAAiBK,OAAS,EAAIL,EAAiB,GAAK,IAG/EI,KAAI,SAACZ,SAAmB,CACvBc,GAAIC,SAAO,GACXf,MAAOD,EAAWC,EAAOO,EAAMS,MAC/BC,MAAOC,OAAOlB,OAEfU,QAAO,SAACS,eACed,IAAfc,EAAKnB,SClCX,IAAMoB,EAAcC,MAAI,CAC7BC,UAAW,iBCyBGC,EAAeC,OACrBjB,EAAmBiB,EAAnBjB,MAAOkB,EAAYD,EAAZC,QAETC,EAAUpB,EAAWC,MACc,IAAnBmB,EAAQb,cAGrBc,gBAACC,kCAGJN,EAAYG,EAAQH,UAAUf,EAAMsB,SAAW,aAGnDF,gBAACG,kBACCC,SAAU,EACVxB,MAAOA,EACPyB,oBAAqBR,EAAMQ,sBAC1B,gBAAGhC,IAAAA,MAAyBiC,IAAAA,gBAC3BN,gBAACO,UACCC,OAAO,kBACPC,YAHOC,OAGWxB,OAAS,EAC3ByB,aAJeC,SAKfC,UAAyB,QAAdlB,EAAsBmB,EAAqB,GACtDC,WAAYnC,EAAMoC,SAClB3C,WAAiBK,IAAVL,EAAsB,GAAKkB,OAAOlB,GACzC4C,SAAU,SAACC,GAETZ,EAASlC,EADK8C,EAAEC,OAAO9C,MACIO,EAAMS,SAEnCW,gBAACO,SAAOa,QAAO/C,MAAM,sBACpB0B,EAAQd,KAAI,SAACoC,UACZrB,gBAACO,SAAOa,QAAOE,IAAKD,EAAOhD,MAAOA,MAAOkB,OAAO8B,EAAOhD,QACpDgD,EAAO/B,cAStBM,EAAe2B,aAAe,CAC5BlB,qBAAqB"}
@@ -1,8 +1,8 @@
1
1
  import { createElement } from 'react';
2
- import { Select, Option } from '@contentful/forma-36-react-components';
3
2
  import { PredefinedValuesError, FieldConnector } from '@contentful/field-editor-shared';
4
3
  import { nanoid } from 'nanoid';
5
4
  import { css } from 'emotion';
5
+ import { Select } from '@contentful/f36-components';
6
6
 
7
7
  function parseValue(value, fieldType) {
8
8
  if (value === '') {
@@ -62,19 +62,19 @@ function DropdownEditor(props) {
62
62
  setValue = _ref.setValue;
63
63
  return createElement(Select, {
64
64
  testId: "dropdown-editor",
65
- hasError: errors.length > 0,
65
+ isInvalid: errors.length > 0,
66
66
  isDisabled: disabled,
67
67
  className: direction === 'rtl' ? rightToLeft : '',
68
- required: field.required,
68
+ isRequired: field.required,
69
69
  value: value === undefined ? '' : String(value),
70
70
  onChange: function onChange(e) {
71
71
  var value = e.target.value;
72
72
  setValue(parseValue(value, field.type));
73
73
  }
74
- }, createElement(Option, {
74
+ }, createElement(Select.Option, {
75
75
  value: ""
76
76
  }, "Choose a value"), options.map(function (option) {
77
- return createElement(Option, {
77
+ return createElement(Select.Option, {
78
78
  key: option.value,
79
79
  value: String(option.value)
80
80
  }, option.label);
@@ -1 +1 @@
1
- {"version":3,"file":"field-editor-dropdown.esm.js","sources":["../src/dropdownUtils.ts","../src/styles.ts","../src/DropdownEditor.tsx"],"sourcesContent":["import { nanoid } from 'nanoid';\nimport { FieldAPI } from '@contentful/field-editor-shared';\n\ntype DropdownOption = {\n id: string;\n value: string | number | undefined;\n label: string;\n};\n\nexport function parseValue(value: string, fieldType: string): string | number | undefined {\n if (value === '') {\n return undefined;\n }\n if (fieldType === 'Integer' || fieldType === 'Number') {\n const asNumber = Number(value);\n return isNaN(asNumber) ? undefined : asNumber;\n }\n return value;\n}\n\nexport function getOptions(field: FieldAPI): DropdownOption[] {\n // Get first object that has a 'in' property\n const validations = field.validations || [];\n const predefinedValues = validations\n .filter(validation => (validation as any).in)\n .map(validation => (validation as any).in);\n\n const firstPredefinedValues = predefinedValues.length > 0 ? predefinedValues[0] : [];\n\n return firstPredefinedValues\n .map((value: string) => ({\n id: nanoid(6),\n value: parseValue(value, field.type),\n label: String(value)\n }))\n .filter((item: { value: string | number | undefined; label: string }) => {\n return item.value !== undefined;\n });\n}\n","import { css } from 'emotion';\n\nexport const rightToLeft = css({\n direction: 'rtl'\n});\n","import * as React from 'react';\nimport { Select, Option } from '@contentful/forma-36-react-components';\nimport {\n FieldAPI,\n FieldConnector,\n PredefinedValuesError,\n LocalesAPI,\n} from '@contentful/field-editor-shared';\nimport { getOptions, parseValue } from './dropdownUtils';\nimport * as styles from './styles';\n\nexport interface DropdownEditorProps {\n /**\n * is the field disabled initially\n */\n isInitiallyDisabled: boolean;\n /**\n * sdk.field\n */\n field: FieldAPI;\n\n /**\n * sdk.locales\n */\n locales: LocalesAPI;\n}\n\nexport function DropdownEditor(props: DropdownEditorProps) {\n const { field, locales } = props;\n\n const options = getOptions(field);\n const misconfigured = options.length === 0;\n\n if (misconfigured) {\n return <PredefinedValuesError />;\n }\n\n const direction = locales.direction[field.locale] || 'ltr';\n\n return (\n <FieldConnector<string | number>\n throttle={0}\n field={field}\n isInitiallyDisabled={props.isInitiallyDisabled}>\n {({ value, errors, disabled, setValue }) => (\n <Select\n testId=\"dropdown-editor\"\n hasError={errors.length > 0}\n isDisabled={disabled}\n className={direction === 'rtl' ? styles.rightToLeft : ''}\n required={field.required}\n value={value === undefined ? '' : String(value)}\n onChange={(e: React.ChangeEvent<HTMLSelectElement>) => {\n const value = e.target.value;\n setValue(parseValue(value, field.type));\n }}>\n <Option value=\"\">Choose a value</Option>\n {options.map((option) => (\n <Option key={option.value} value={String(option.value)}>\n {option.label}\n </Option>\n ))}\n </Select>\n )}\n </FieldConnector>\n );\n}\n\nDropdownEditor.defaultProps = {\n isInitiallyDisabled: true,\n};\n"],"names":["parseValue","value","fieldType","undefined","asNumber","Number","isNaN","getOptions","field","validations","predefinedValues","filter","validation","map","firstPredefinedValues","length","id","nanoid","type","label","String","item","rightToLeft","css","direction","DropdownEditor","props","locales","options","misconfigured","React","PredefinedValuesError","locale","FieldConnector","throttle","isInitiallyDisabled","errors","disabled","setValue","Select","testId","hasError","isDisabled","className","styles","required","onChange","e","target","Option","option","key","defaultProps"],"mappings":"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"}
1
+ {"version":3,"file":"field-editor-dropdown.esm.js","sources":["../src/dropdownUtils.ts","../src/styles.ts","../src/DropdownEditor.tsx"],"sourcesContent":["import { nanoid } from 'nanoid';\nimport { FieldAPI } from '@contentful/field-editor-shared';\n\ntype DropdownOption = {\n id: string;\n value: string | number | undefined;\n label: string;\n};\n\nexport function parseValue(value: string, fieldType: string): string | number | undefined {\n if (value === '') {\n return undefined;\n }\n if (fieldType === 'Integer' || fieldType === 'Number') {\n const asNumber = Number(value);\n return isNaN(asNumber) ? undefined : asNumber;\n }\n return value;\n}\n\nexport function getOptions(field: FieldAPI): DropdownOption[] {\n // Get first object that has a 'in' property\n const validations = field.validations || [];\n const predefinedValues = validations\n .filter((validation) => (validation as any).in)\n .map((validation) => (validation as any).in);\n\n const firstPredefinedValues = predefinedValues.length > 0 ? predefinedValues[0] : [];\n\n return firstPredefinedValues\n .map((value: string) => ({\n id: nanoid(6),\n value: parseValue(value, field.type),\n label: String(value),\n }))\n .filter((item: { value: string | number | undefined; label: string }) => {\n return item.value !== undefined;\n });\n}\n","import { css } from 'emotion';\n\nexport const rightToLeft = css({\n direction: 'rtl',\n});\n","import * as React from 'react';\nimport {\n FieldAPI,\n FieldConnector,\n PredefinedValuesError,\n LocalesAPI,\n} from '@contentful/field-editor-shared';\nimport { getOptions, parseValue } from './dropdownUtils';\nimport * as styles from './styles';\n\nimport { Select } from '@contentful/f36-components';\n\nexport interface DropdownEditorProps {\n /**\n * is the field disabled initially\n */\n isInitiallyDisabled: boolean;\n /**\n * sdk.field\n */\n field: FieldAPI;\n\n /**\n * sdk.locales\n */\n locales: LocalesAPI;\n}\n\nexport function DropdownEditor(props: DropdownEditorProps) {\n const { field, locales } = props;\n\n const options = getOptions(field);\n const misconfigured = options.length === 0;\n\n if (misconfigured) {\n return <PredefinedValuesError />;\n }\n\n const direction = locales.direction[field.locale] || 'ltr';\n\n return (\n <FieldConnector<string | number>\n throttle={0}\n field={field}\n isInitiallyDisabled={props.isInitiallyDisabled}>\n {({ value, errors, disabled, setValue }) => (\n <Select\n testId=\"dropdown-editor\"\n isInvalid={errors.length > 0}\n isDisabled={disabled}\n className={direction === 'rtl' ? styles.rightToLeft : ''}\n isRequired={field.required}\n value={value === undefined ? '' : String(value)}\n onChange={(e: React.ChangeEvent<HTMLSelectElement>) => {\n const value = e.target.value;\n setValue(parseValue(value, field.type));\n }}>\n <Select.Option value=\"\">Choose a value</Select.Option>\n {options.map((option) => (\n <Select.Option key={option.value} value={String(option.value)}>\n {option.label}\n </Select.Option>\n ))}\n </Select>\n )}\n </FieldConnector>\n );\n}\n\nDropdownEditor.defaultProps = {\n isInitiallyDisabled: true,\n};\n"],"names":["parseValue","value","fieldType","undefined","asNumber","Number","isNaN","getOptions","field","validations","predefinedValues","filter","validation","map","firstPredefinedValues","length","id","nanoid","type","label","String","item","rightToLeft","css","direction","DropdownEditor","props","locales","options","misconfigured","React","PredefinedValuesError","locale","FieldConnector","throttle","isInitiallyDisabled","errors","disabled","setValue","Select","testId","isInvalid","isDisabled","className","styles","isRequired","required","onChange","e","target","Option","option","key","defaultProps"],"mappings":"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"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@contentful/field-editor-dropdown",
3
- "version": "0.15.1",
3
+ "version": "0.16.0",
4
4
  "main": "dist/index.js",
5
5
  "module": "dist/field-editor-dropdown.esm.js",
6
6
  "typings": "dist/index.d.ts",
@@ -21,16 +21,16 @@
21
21
  "tsc": "tsc -p ./ --noEmit"
22
22
  },
23
23
  "dependencies": {
24
- "@contentful/field-editor-shared": "^0.25.1",
25
- "@contentful/forma-36-react-components": "^3.93.4",
26
- "@contentful/forma-36-tokens": "^0.11.0",
24
+ "@contentful/f36-components": "beta",
25
+ "@contentful/f36-tokens": "beta",
26
+ "@contentful/field-editor-shared": "^0.26.0",
27
27
  "emotion": "^10.0.0",
28
28
  "lodash": "^4.17.15",
29
29
  "lodash-es": "^4.17.15",
30
30
  "nanoid": "^3.1.3"
31
31
  },
32
32
  "devDependencies": {
33
- "@contentful/field-editor-test-utils": "^0.18.1",
33
+ "@contentful/field-editor-test-utils": "^0.19.0",
34
34
  "contentful-management": "^7.42.1"
35
35
  },
36
36
  "peerDependencies": {
@@ -46,5 +46,5 @@
46
46
  }
47
47
  }
48
48
  },
49
- "gitHead": "422234c47b3637970eea4501d095d2914c88b855"
49
+ "gitHead": "f86ba28db3f34cffc0dc2580bf21297542f331c9"
50
50
  }