@contentful/field-editor-rating 0.12.5 → 1.0.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/CHANGELOG.md CHANGED
@@ -3,197 +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.12.5](https://github.com/contentful/field-editors/compare/@contentful/field-editor-rating@0.12.4...@contentful/field-editor-rating@0.12.5) (2021-10-06)
6
+ ## [1.0.1](https://github.com/contentful/field-editors/compare/@contentful/field-editor-rating@1.0.0...@contentful/field-editor-rating@1.0.1) (2021-11-17)
7
7
 
8
- **Note:** Version bump only for package @contentful/field-editor-rating
8
+ ### Bug Fixes
9
9
 
10
+ - **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))
10
11
 
12
+ # [1.0.0](https://github.com/contentful/field-editors/compare/@contentful/field-editor-rating@0.13.0...@contentful/field-editor-rating@1.0.0) (2021-11-04)
11
13
 
14
+ **Note:** Version bump only for package @contentful/field-editor-rating
12
15
 
16
+ # [0.13.0](https://github.com/contentful/field-editors/compare/@contentful/field-editor-rating@0.12.6...@contentful/field-editor-rating@0.13.0) (2021-11-04)
13
17
 
14
- ## [0.12.4](https://github.com/contentful/field-editors/compare/@contentful/field-editor-rating@0.12.3...@contentful/field-editor-rating@0.12.4) (2021-09-17)
18
+ ### Features
15
19
 
16
- **Note:** Version bump only for package @contentful/field-editor-rating
20
+ - Forma v4 components adoption ([#805](https://github.com/contentful/field-editors/issues/805)) ([526bde6](https://github.com/contentful/field-editors/commit/526bde6e10e0ee3789705ec10fb31489af7ca59e))
17
21
 
22
+ ### BREAKING CHANGES
18
23
 
24
+ - adopts a new Forma v4 beta
19
25
 
26
+ ## [0.12.6](https://github.com/contentful/field-editors/compare/@contentful/field-editor-rating@0.12.5...@contentful/field-editor-rating@0.12.6) (2021-10-14)
20
27
 
28
+ **Note:** Version bump only for package @contentful/field-editor-rating
21
29
 
22
- ## [0.12.3](https://github.com/contentful/field-editors/compare/@contentful/field-editor-rating@0.12.2...@contentful/field-editor-rating@0.12.3) (2021-09-16)
30
+ ## [0.12.5](https://github.com/contentful/field-editors/compare/@contentful/field-editor-rating@0.12.4...@contentful/field-editor-rating@0.12.5) (2021-10-06)
23
31
 
24
32
  **Note:** Version bump only for package @contentful/field-editor-rating
25
33
 
34
+ ## [0.12.4](https://github.com/contentful/field-editors/compare/@contentful/field-editor-rating@0.12.3...@contentful/field-editor-rating@0.12.4) (2021-09-17)
26
35
 
36
+ **Note:** Version bump only for package @contentful/field-editor-rating
27
37
 
38
+ ## [0.12.3](https://github.com/contentful/field-editors/compare/@contentful/field-editor-rating@0.12.2...@contentful/field-editor-rating@0.12.3) (2021-09-16)
28
39
 
40
+ **Note:** Version bump only for package @contentful/field-editor-rating
29
41
 
30
42
  ## [0.12.2](https://github.com/contentful/field-editors/compare/@contentful/field-editor-rating@0.12.1...@contentful/field-editor-rating@0.12.2) (2021-08-19)
31
43
 
32
44
  **Note:** Version bump only for package @contentful/field-editor-rating
33
45
 
34
-
35
-
36
-
37
-
38
46
  ## [0.12.1](https://github.com/contentful/field-editors/compare/@contentful/field-editor-rating@0.12.0...@contentful/field-editor-rating@0.12.1) (2021-07-29)
39
47
 
40
48
  **Note:** Version bump only for package @contentful/field-editor-rating
41
49
 
42
-
43
-
44
-
45
-
46
50
  # [0.12.0](https://github.com/contentful/field-editors/compare/@contentful/field-editor-rating@0.11.6...@contentful/field-editor-rating@0.12.0) (2021-07-23)
47
51
 
48
-
49
52
  ### Features
50
53
 
51
- * 💡 new color tokens ([#778](https://github.com/contentful/field-editors/issues/778)) ([fba548d](https://github.com/contentful/field-editors/commit/fba548de32305016df7f2685634eefb14294828f))
52
-
53
-
54
-
55
-
54
+ - 💡 new color tokens ([#778](https://github.com/contentful/field-editors/issues/778)) ([fba548d](https://github.com/contentful/field-editors/commit/fba548de32305016df7f2685634eefb14294828f))
56
55
 
57
56
  ## [0.11.6](https://github.com/contentful/field-editors/compare/@contentful/field-editor-rating@0.11.3...@contentful/field-editor-rating@0.11.6) (2021-07-06)
58
57
 
59
58
  **Note:** Version bump only for package @contentful/field-editor-rating
60
59
 
61
-
62
-
63
-
64
-
65
60
  ## [0.11.5](https://github.com/contentful/field-editors/compare/@contentful/field-editor-rating@0.11.3...@contentful/field-editor-rating@0.11.5) (2021-07-06)
66
61
 
67
62
  **Note:** Version bump only for package @contentful/field-editor-rating
68
63
 
69
-
70
-
71
-
72
-
73
64
  ## [0.11.4](https://github.com/contentful/field-editors/compare/@contentful/field-editor-rating@0.11.3...@contentful/field-editor-rating@0.11.4) (2021-06-23)
74
65
 
75
66
  **Note:** Version bump only for package @contentful/field-editor-rating
76
67
 
77
-
78
-
79
-
80
-
81
68
  ## [0.11.3](https://github.com/contentful/field-editors/compare/@contentful/field-editor-rating@0.11.2...@contentful/field-editor-rating@0.11.3) (2021-06-23)
82
69
 
83
70
  **Note:** Version bump only for package @contentful/field-editor-rating
84
71
 
85
-
86
-
87
-
88
-
89
72
  ## [0.11.2](https://github.com/contentful/field-editors/compare/@contentful/field-editor-rating@0.11.1...@contentful/field-editor-rating@0.11.2) (2021-06-22)
90
73
 
91
74
  **Note:** Version bump only for package @contentful/field-editor-rating
92
75
 
93
-
94
-
95
-
96
-
97
76
  ## [0.11.1](https://github.com/contentful/field-editors/compare/@contentful/field-editor-rating@0.11.0...@contentful/field-editor-rating@0.11.1) (2021-03-05)
98
77
 
99
78
  **Note:** Version bump only for package @contentful/field-editor-rating
100
79
 
101
-
102
-
103
-
104
-
105
80
  # [0.11.0](https://github.com/contentful/field-editors/compare/@contentful/field-editor-rating@0.10.2...@contentful/field-editor-rating@0.11.0) (2021-02-19)
106
81
 
107
-
108
82
  ### Features
109
83
 
110
- * bump min version of forma-36 ([#606](https://github.com/contentful/field-editors/issues/606)) ([fd57c7a](https://github.com/contentful/field-editors/commit/fd57c7a4312766af38c01507f17706ab22992617))
111
-
112
-
113
-
114
-
84
+ - bump min version of forma-36 ([#606](https://github.com/contentful/field-editors/issues/606)) ([fd57c7a](https://github.com/contentful/field-editors/commit/fd57c7a4312766af38c01507f17706ab22992617))
115
85
 
116
86
  ## [0.10.2](https://github.com/contentful/field-editors/compare/@contentful/field-editor-rating@0.10.1...@contentful/field-editor-rating@0.10.2) (2021-02-09)
117
87
 
118
88
  **Note:** Version bump only for package @contentful/field-editor-rating
119
89
 
120
-
121
-
122
-
123
-
124
90
  ## [0.10.1](https://github.com/contentful/field-editors/compare/@contentful/field-editor-rating@0.10.0...@contentful/field-editor-rating@0.10.1) (2021-02-01)
125
91
 
126
92
  **Note:** Version bump only for package @contentful/field-editor-rating
127
93
 
128
-
129
-
130
-
131
-
132
94
  # [0.10.0](https://github.com/contentful/field-editors/compare/@contentful/field-editor-rating@0.9.1...@contentful/field-editor-rating@0.10.0) (2021-01-20)
133
95
 
134
-
135
96
  ### Features
136
97
 
137
- * 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))
138
-
139
-
140
-
141
-
98
+ - 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))
142
99
 
143
100
  ## [0.9.1](https://github.com/contentful/field-editors/compare/@contentful/field-editor-rating@0.9.0...@contentful/field-editor-rating@0.9.1) (2021-01-15)
144
101
 
145
-
146
102
  ### Bug Fixes
147
103
 
148
- * 🐛 small layout adjustments ([#555](https://github.com/contentful/field-editors/issues/555)) ([235c594](https://github.com/contentful/field-editors/commit/235c5941db152d2921a9ef134c1a71b0069a4dc2))
149
-
150
-
151
-
152
-
104
+ - 🐛 small layout adjustments ([#555](https://github.com/contentful/field-editors/issues/555)) ([235c594](https://github.com/contentful/field-editors/commit/235c5941db152d2921a9ef134c1a71b0069a4dc2))
153
105
 
154
106
  # [0.9.0](https://github.com/contentful/field-editors/compare/@contentful/field-editor-rating@0.8.5...@contentful/field-editor-rating@0.9.0) (2021-01-12)
155
107
 
156
-
157
108
  ### Features
158
109
 
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
-
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))
164
111
 
165
112
  ## [0.8.5](https://github.com/contentful/field-editors/compare/@contentful/field-editor-rating@0.8.4...@contentful/field-editor-rating@0.8.5) (2020-12-16)
166
113
 
167
114
  **Note:** Version bump only for package @contentful/field-editor-rating
168
115
 
169
-
170
-
171
-
172
-
173
116
  ## [0.8.4](https://github.com/contentful/field-editors/compare/@contentful/field-editor-rating@0.8.3...@contentful/field-editor-rating@0.8.4) (2020-11-06)
174
117
 
175
118
  **Note:** Version bump only for package @contentful/field-editor-rating
176
119
 
177
-
178
-
179
-
180
-
181
120
  ## [0.8.3](https://github.com/contentful/field-editors/compare/@contentful/field-editor-rating@0.8.2...@contentful/field-editor-rating@0.8.3) (2020-11-06)
182
121
 
183
122
  **Note:** Version bump only for package @contentful/field-editor-rating
184
123
 
185
-
186
-
187
-
188
-
189
124
  ## [0.8.2](https://github.com/contentful/field-editors/compare/@contentful/field-editor-rating@0.8.1...@contentful/field-editor-rating@0.8.2) (2020-10-28)
190
125
 
191
126
  **Note:** Version bump only for package @contentful/field-editor-rating
192
127
 
193
-
194
-
195
-
196
-
197
128
  ## [0.8.1](https://github.com/contentful/field-editors/compare/@contentful/field-editor-rating@0.8.0...@contentful/field-editor-rating@0.8.1) (2020-08-24)
198
129
 
199
130
  **Note:** Version bump only for package @contentful/field-editor-rating
package/README.md CHANGED
@@ -7,6 +7,5 @@ npm install @contentful/field-editor-rating
7
7
  This package contains a React `RatingEditor` component that is used for the `Number`and`Integer` 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 { RatingEditor } from '@contentful/field-editor-rating';
12
11
  ```
@@ -7,8 +7,9 @@ function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'defau
7
7
  var React = require('react');
8
8
  var get = _interopDefault(require('lodash/get'));
9
9
  var fieldEditorShared = require('@contentful/field-editor-shared');
10
- var forma36ReactComponents = require('@contentful/forma-36-react-components');
11
10
  var emotion = require('emotion');
11
+ var f36Components = require('@contentful/f36-components');
12
+ var f36Icons = require('@contentful/f36-icons');
12
13
 
13
14
  function _inheritsLoose(subClass, superClass) {
14
15
  subClass.prototype = Object.create(superClass.prototype);
@@ -85,19 +86,20 @@ var RatingRibbon = /*#__PURE__*/function (_React$Component) {
85
86
  }
86
87
 
87
88
  return React.createElement(React.Fragment, null, items.map(function (num) {
88
- return React.createElement(forma36ReactComponents.IconButton, {
89
- "data-selected": _this2.isSelected(num) ? 'true' : 'false',
90
- testId: "rating-editor-star",
91
- disabled: _this2.props.disabled,
92
- key: num,
93
- iconProps: {
94
- icon: 'Star',
89
+ return React.createElement(f36Components.IconButton, {
90
+ variant: "transparent",
91
+ size: "small",
92
+ icon: React.createElement(f36Icons.StarIcon, {
93
+ variant: _this2.isSelected(num) ? 'primary' : 'muted',
95
94
  className: emotion.css({
96
95
  width: '22px',
97
96
  height: '22px'
98
97
  })
99
- },
100
- buttonType: _this2.isSelected(num) ? 'primary' : 'muted',
98
+ }),
99
+ "data-selected": _this2.isSelected(num) ? 'true' : 'false',
100
+ testId: "rating-editor-star",
101
+ isDisabled: _this2.props.disabled,
102
+ key: num,
101
103
  onClick: function onClick() {
102
104
  _this2.props.onSelect(num);
103
105
  },
@@ -110,7 +112,7 @@ var RatingRibbon = /*#__PURE__*/function (_React$Component) {
110
112
  onMouseLeave: _this2.onBlur,
111
113
  onFocus: _this2.onFocus(num),
112
114
  onBlur: _this2.onBlur,
113
- label: num.toString()
115
+ "aria-label": num.toString()
114
116
  });
115
117
  }));
116
118
  };
@@ -151,7 +153,7 @@ function RatingEditor(props) {
151
153
  setValue(null);
152
154
  };
153
155
 
154
- return React.createElement(forma36ReactComponents.Flex, {
156
+ return React.createElement(f36Components.Flex, {
155
157
  testId: "rating-editor",
156
158
  flexDirection: "row",
157
159
  marginTop: "spacingS"
@@ -162,9 +164,10 @@ function RatingEditor(props) {
162
164
  onSelect: function onSelect(num) {
163
165
  setValue(num);
164
166
  }
165
- }), value !== undefined && !disabled && React.createElement(forma36ReactComponents.Flex, {
167
+ }), value !== undefined && !disabled && React.createElement(f36Components.Flex, {
166
168
  marginLeft: "spacingM"
167
- }, React.createElement(forma36ReactComponents.TextLink, {
169
+ }, React.createElement(f36Components.TextLink, {
170
+ as: "button",
168
171
  testId: "rating-editor-clear",
169
172
  onClick: clearOption
170
173
  }, "Clear")));
@@ -1 +1 @@
1
- {"version":3,"file":"field-editor-rating.cjs.development.js","sources":["../src/RatingRibbon.tsx","../src/RatingEditor.tsx"],"sourcesContent":["import * as React from 'react';\nimport { css } from 'emotion';\nimport { IconButton } from '@contentful/forma-36-react-components';\n\ntype RatingRibbonProps = {\n disabled: boolean;\n stars: number;\n value: number | null | undefined;\n onSelect: (val: number) => void;\n};\n\ntype RatingRibbonState = {\n hovered: null | number;\n};\n\nexport class RatingRibbon extends React.Component<RatingRibbonProps, RatingRibbonState> {\n state = {\n hovered: null,\n };\n\n isSelected = (num: number) => {\n const hovered = this.state.hovered;\n const value = this.props.value;\n\n if (hovered !== null) {\n return num <= hovered;\n }\n if (value) {\n return num <= value;\n }\n return false;\n };\n\n onBlur = () => {\n if (!this.props.disabled) {\n this.setState({ hovered: null });\n }\n };\n\n onFocus = (num: number) => () => {\n if (!this.props.disabled) {\n this.setState({ hovered: num });\n }\n };\n\n render() {\n const items: number[] = [];\n for (let i = 1; i <= this.props.stars; i++) {\n items.push(i);\n }\n\n return (\n <>\n {items.map((num) => (\n <IconButton\n data-selected={this.isSelected(num) ? 'true' : 'false'}\n testId=\"rating-editor-star\"\n disabled={this.props.disabled}\n key={num}\n iconProps={{ icon: 'Star', className: css({ width: '22px', height: '22px' }) }}\n buttonType={this.isSelected(num) ? 'primary' : 'muted'}\n onClick={() => {\n this.props.onSelect(num);\n }}\n onKeyDown={(e: React.KeyboardEvent) => {\n if (e.keyCode === 13) {\n this.props.onSelect(num);\n }\n }}\n onMouseOver={this.onFocus(num)}\n onMouseLeave={this.onBlur}\n onFocus={this.onFocus(num)}\n onBlur={this.onBlur}\n label={num.toString()}\n />\n ))}\n </>\n );\n }\n}\n","import * as React from 'react';\nimport get from 'lodash/get';\nimport { FieldAPI, ParametersAPI, FieldConnector } from '@contentful/field-editor-shared';\nimport { TextLink, Flex } from '@contentful/forma-36-react-components';\nimport { RatingRibbon } from './RatingRibbon';\n\nexport interface RatingEditorProps {\n /**\n * is the field disabled initially\n */\n isInitiallyDisabled: boolean;\n\n /**\n * sdk.field\n */\n field: FieldAPI;\n\n /**\n * sdk.parameters\n */\n parameters?: ParametersAPI & {\n instance: {\n stars?: number;\n };\n };\n}\n\nfunction isValidCount(count?: string | number): count is number {\n return typeof count === 'number' && !isNaN(count) && count > 0;\n}\n\nfunction getStarCount(count?: number | string): number {\n const defaultValue = 5;\n\n if (isValidCount(count)) {\n return Math.round(count);\n } else if (typeof count === 'string') {\n const parsed = parseInt(count, 10);\n return isValidCount(parsed) ? Math.round(parsed) : defaultValue;\n } else {\n return defaultValue;\n }\n}\n\nexport function RatingEditor(props: RatingEditorProps) {\n const { field } = props;\n\n const starsCount = getStarCount(get(props.parameters, ['instance', 'stars']));\n\n return (\n <FieldConnector<number>\n throttle={0}\n field={field}\n isInitiallyDisabled={props.isInitiallyDisabled}>\n {({ disabled, value, setValue }) => {\n const clearOption = () => {\n setValue(null);\n };\n\n return (\n <Flex testId=\"rating-editor\" flexDirection=\"row\" marginTop=\"spacingS\">\n <RatingRibbon\n disabled={disabled}\n value={value}\n stars={starsCount}\n onSelect={(num) => {\n setValue(num);\n }}\n />\n {value !== undefined && !disabled && (\n <Flex marginLeft=\"spacingM\">\n <TextLink testId=\"rating-editor-clear\" onClick={clearOption}>\n Clear\n </TextLink>\n </Flex>\n )}\n </Flex>\n );\n }}\n </FieldConnector>\n );\n}\n\nRatingEditor.defaultProps = {\n isInitiallyDisabled: true,\n};\n"],"names":["RatingRibbon","hovered","num","state","value","props","disabled","setState","render","items","i","stars","push","React","map","IconButton","isSelected","testId","key","iconProps","icon","className","css","width","height","buttonType","onClick","onSelect","onKeyDown","e","keyCode","onMouseOver","onFocus","onMouseLeave","onBlur","label","toString","isValidCount","count","isNaN","getStarCount","defaultValue","Math","round","parsed","parseInt","RatingEditor","field","starsCount","get","parameters","FieldConnector","throttle","isInitiallyDisabled","setValue","clearOption","Flex","flexDirection","marginTop","undefined","marginLeft","TextLink","defaultProps"],"mappings":"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"}
1
+ {"version":3,"file":"field-editor-rating.cjs.development.js","sources":["../src/RatingRibbon.tsx","../src/RatingEditor.tsx"],"sourcesContent":["import * as React from 'react';\nimport { css } from 'emotion';\n\nimport { IconButton } from '@contentful/f36-components';\n\nimport { StarIcon } from '@contentful/f36-icons';\n\ntype RatingRibbonProps = {\n disabled: boolean;\n stars: number;\n value: number | null | undefined;\n onSelect: (val: number) => void;\n};\n\ntype RatingRibbonState = {\n hovered: null | number;\n};\n\nexport class RatingRibbon extends React.Component<RatingRibbonProps, RatingRibbonState> {\n state = {\n hovered: null,\n };\n\n isSelected = (num: number) => {\n const hovered = this.state.hovered;\n const value = this.props.value;\n\n if (hovered !== null) {\n return num <= hovered;\n }\n if (value) {\n return num <= value;\n }\n return false;\n };\n\n onBlur = () => {\n if (!this.props.disabled) {\n this.setState({ hovered: null });\n }\n };\n\n onFocus = (num: number) => () => {\n if (!this.props.disabled) {\n this.setState({ hovered: num });\n }\n };\n\n render() {\n const items: number[] = [];\n for (let i = 1; i <= this.props.stars; i++) {\n items.push(i);\n }\n\n return (\n <>\n {items.map((num) => (\n <IconButton\n variant=\"transparent\"\n size=\"small\"\n icon={\n <StarIcon\n variant={this.isSelected(num) ? 'primary' : 'muted'}\n className={css({ width: '22px', height: '22px' })}\n />\n }\n data-selected={this.isSelected(num) ? 'true' : 'false'}\n testId=\"rating-editor-star\"\n isDisabled={this.props.disabled}\n key={num}\n onClick={() => {\n this.props.onSelect(num);\n }}\n onKeyDown={(e: React.KeyboardEvent) => {\n if (e.keyCode === 13) {\n this.props.onSelect(num);\n }\n }}\n onMouseOver={this.onFocus(num)}\n onMouseLeave={this.onBlur}\n onFocus={this.onFocus(num)}\n onBlur={this.onBlur}\n aria-label={num.toString()}\n />\n ))}\n </>\n );\n }\n}\n","import * as React from 'react';\nimport get from 'lodash/get';\nimport { FieldAPI, ParametersAPI, FieldConnector } from '@contentful/field-editor-shared';\nimport { RatingRibbon } from './RatingRibbon';\n\nimport { TextLink, Flex } from '@contentful/f36-components';\n\nexport interface RatingEditorProps {\n /**\n * is the field disabled initially\n */\n isInitiallyDisabled: boolean;\n\n /**\n * sdk.field\n */\n field: FieldAPI;\n\n /**\n * sdk.parameters\n */\n parameters?: ParametersAPI & {\n instance: {\n stars?: number;\n };\n };\n}\n\nfunction isValidCount(count?: string | number): count is number {\n return typeof count === 'number' && !isNaN(count) && count > 0;\n}\n\nfunction getStarCount(count?: number | string): number {\n const defaultValue = 5;\n\n if (isValidCount(count)) {\n return Math.round(count);\n } else if (typeof count === 'string') {\n const parsed = parseInt(count, 10);\n return isValidCount(parsed) ? Math.round(parsed) : defaultValue;\n } else {\n return defaultValue;\n }\n}\n\nexport function RatingEditor(props: RatingEditorProps) {\n const { field } = props;\n\n const starsCount = getStarCount(get(props.parameters, ['instance', 'stars']));\n\n return (\n <FieldConnector<number>\n throttle={0}\n field={field}\n isInitiallyDisabled={props.isInitiallyDisabled}>\n {({ disabled, value, setValue }) => {\n const clearOption = () => {\n setValue(null);\n };\n\n return (\n <Flex testId=\"rating-editor\" flexDirection=\"row\" marginTop=\"spacingS\">\n <RatingRibbon\n disabled={disabled}\n value={value}\n stars={starsCount}\n onSelect={(num) => {\n setValue(num);\n }}\n />\n {value !== undefined && !disabled && (\n <Flex marginLeft=\"spacingM\">\n <TextLink as=\"button\" testId=\"rating-editor-clear\" onClick={clearOption}>\n Clear\n </TextLink>\n </Flex>\n )}\n </Flex>\n );\n }}\n </FieldConnector>\n );\n}\n\nRatingEditor.defaultProps = {\n isInitiallyDisabled: true,\n};\n"],"names":["RatingRibbon","hovered","num","state","value","props","disabled","setState","render","items","i","stars","push","React","map","IconButton","variant","size","icon","StarIcon","isSelected","className","css","width","height","testId","isDisabled","key","onClick","onSelect","onKeyDown","e","keyCode","onMouseOver","onFocus","onMouseLeave","onBlur","toString","isValidCount","count","isNaN","getStarCount","defaultValue","Math","round","parsed","parseInt","RatingEditor","field","starsCount","get","parameters","FieldConnector","throttle","isInitiallyDisabled","setValue","clearOption","Flex","flexDirection","marginTop","undefined","marginLeft","TextLink","as","defaultProps"],"mappings":"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"}
@@ -1,2 +1,2 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e,t=require("react"),r=(e=require("lodash/get"))&&"object"==typeof e&&"default"in e?e.default:e,n=require("@contentful/field-editor-shared"),o=require("@contentful/forma-36-react-components"),i=require("emotion");function a(e,t){return(a=Object.setPrototypeOf||function(e,t){return e.__proto__=t,e})(e,t)}var s=function(e){var r,n;function s(){var t;return(t=e.apply(this,arguments)||this).state={hovered:null},t.isSelected=function(e){var r=t.state.hovered,n=t.props.value;return null!==r?e<=r:!!n&&e<=n},t.onBlur=function(){t.props.disabled||t.setState({hovered:null})},t.onFocus=function(e){return function(){t.props.disabled||t.setState({hovered:e})}},t}return n=e,(r=s).prototype=Object.create(n.prototype),r.prototype.constructor=r,a(r,n),s.prototype.render=function(){for(var e=this,r=[],n=1;n<=this.props.stars;n++)r.push(n);return t.createElement(t.Fragment,null,r.map((function(r){return t.createElement(o.IconButton,{"data-selected":e.isSelected(r)?"true":"false",testId:"rating-editor-star",disabled:e.props.disabled,key:r,iconProps:{icon:"Star",className:i.css({width:"22px",height:"22px"})},buttonType:e.isSelected(r)?"primary":"muted",onClick:function(){e.props.onSelect(r)},onKeyDown:function(t){13===t.keyCode&&e.props.onSelect(r)},onMouseOver:e.onFocus(r),onMouseLeave:e.onBlur,onFocus:e.onFocus(r),onBlur:e.onBlur,label:r.toString()})})))},s}(t.Component);function u(e){return"number"==typeof e&&!isNaN(e)&&e>0}function l(e){var i=e.field,a=function(e){if(u(e))return Math.round(e);if("string"==typeof e){var t=parseInt(e,10);return u(t)?Math.round(t):5}return 5}(r(e.parameters,["instance","stars"]));return t.createElement(n.FieldConnector,{throttle:0,field:i,isInitiallyDisabled:e.isInitiallyDisabled},(function(e){var r=e.disabled,n=e.value,i=e.setValue;return t.createElement(o.Flex,{testId:"rating-editor",flexDirection:"row",marginTop:"spacingS"},t.createElement(s,{disabled:r,value:n,stars:a,onSelect:function(e){i(e)}}),void 0!==n&&!r&&t.createElement(o.Flex,{marginLeft:"spacingM"},t.createElement(o.TextLink,{testId:"rating-editor-clear",onClick:function(){i(null)}},"Clear")))}))}l.defaultProps={isInitiallyDisabled:!0},exports.RatingEditor=l;
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e,t=require("react"),r=(e=require("lodash/get"))&&"object"==typeof e&&"default"in e?e.default:e,n=require("@contentful/field-editor-shared"),o=require("emotion"),i=require("@contentful/f36-components"),a=require("@contentful/f36-icons");function s(e,t){return(s=Object.setPrototypeOf||function(e,t){return e.__proto__=t,e})(e,t)}var l=function(e){var r,n;function l(){var t;return(t=e.apply(this,arguments)||this).state={hovered:null},t.isSelected=function(e){var r=t.state.hovered,n=t.props.value;return null!==r?e<=r:!!n&&e<=n},t.onBlur=function(){t.props.disabled||t.setState({hovered:null})},t.onFocus=function(e){return function(){t.props.disabled||t.setState({hovered:e})}},t}return n=e,(r=l).prototype=Object.create(n.prototype),r.prototype.constructor=r,s(r,n),l.prototype.render=function(){for(var e=this,r=[],n=1;n<=this.props.stars;n++)r.push(n);return t.createElement(t.Fragment,null,r.map((function(r){return t.createElement(i.IconButton,{variant:"transparent",size:"small",icon:t.createElement(a.StarIcon,{variant:e.isSelected(r)?"primary":"muted",className:o.css({width:"22px",height:"22px"})}),"data-selected":e.isSelected(r)?"true":"false",testId:"rating-editor-star",isDisabled:e.props.disabled,key:r,onClick:function(){e.props.onSelect(r)},onKeyDown:function(t){13===t.keyCode&&e.props.onSelect(r)},onMouseOver:e.onFocus(r),onMouseLeave:e.onBlur,onFocus:e.onFocus(r),onBlur:e.onBlur,"aria-label":r.toString()})})))},l}(t.Component);function u(e){return"number"==typeof e&&!isNaN(e)&&e>0}function c(e){var o=e.field,a=function(e){if(u(e))return Math.round(e);if("string"==typeof e){var t=parseInt(e,10);return u(t)?Math.round(t):5}return 5}(r(e.parameters,["instance","stars"]));return t.createElement(n.FieldConnector,{throttle:0,field:o,isInitiallyDisabled:e.isInitiallyDisabled},(function(e){var r=e.disabled,n=e.value,o=e.setValue;return t.createElement(i.Flex,{testId:"rating-editor",flexDirection:"row",marginTop:"spacingS"},t.createElement(l,{disabled:r,value:n,stars:a,onSelect:function(e){o(e)}}),void 0!==n&&!r&&t.createElement(i.Flex,{marginLeft:"spacingM"},t.createElement(i.TextLink,{as:"button",testId:"rating-editor-clear",onClick:function(){o(null)}},"Clear")))}))}c.defaultProps={isInitiallyDisabled:!0},exports.RatingEditor=c;
2
2
  //# sourceMappingURL=field-editor-rating.cjs.production.min.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"field-editor-rating.cjs.production.min.js","sources":["../src/RatingRibbon.tsx","../src/RatingEditor.tsx"],"sourcesContent":["import * as React from 'react';\nimport { css } from 'emotion';\nimport { IconButton } from '@contentful/forma-36-react-components';\n\ntype RatingRibbonProps = {\n disabled: boolean;\n stars: number;\n value: number | null | undefined;\n onSelect: (val: number) => void;\n};\n\ntype RatingRibbonState = {\n hovered: null | number;\n};\n\nexport class RatingRibbon extends React.Component<RatingRibbonProps, RatingRibbonState> {\n state = {\n hovered: null,\n };\n\n isSelected = (num: number) => {\n const hovered = this.state.hovered;\n const value = this.props.value;\n\n if (hovered !== null) {\n return num <= hovered;\n }\n if (value) {\n return num <= value;\n }\n return false;\n };\n\n onBlur = () => {\n if (!this.props.disabled) {\n this.setState({ hovered: null });\n }\n };\n\n onFocus = (num: number) => () => {\n if (!this.props.disabled) {\n this.setState({ hovered: num });\n }\n };\n\n render() {\n const items: number[] = [];\n for (let i = 1; i <= this.props.stars; i++) {\n items.push(i);\n }\n\n return (\n <>\n {items.map((num) => (\n <IconButton\n data-selected={this.isSelected(num) ? 'true' : 'false'}\n testId=\"rating-editor-star\"\n disabled={this.props.disabled}\n key={num}\n iconProps={{ icon: 'Star', className: css({ width: '22px', height: '22px' }) }}\n buttonType={this.isSelected(num) ? 'primary' : 'muted'}\n onClick={() => {\n this.props.onSelect(num);\n }}\n onKeyDown={(e: React.KeyboardEvent) => {\n if (e.keyCode === 13) {\n this.props.onSelect(num);\n }\n }}\n onMouseOver={this.onFocus(num)}\n onMouseLeave={this.onBlur}\n onFocus={this.onFocus(num)}\n onBlur={this.onBlur}\n label={num.toString()}\n />\n ))}\n </>\n );\n }\n}\n","import * as React from 'react';\nimport get from 'lodash/get';\nimport { FieldAPI, ParametersAPI, FieldConnector } from '@contentful/field-editor-shared';\nimport { TextLink, Flex } from '@contentful/forma-36-react-components';\nimport { RatingRibbon } from './RatingRibbon';\n\nexport interface RatingEditorProps {\n /**\n * is the field disabled initially\n */\n isInitiallyDisabled: boolean;\n\n /**\n * sdk.field\n */\n field: FieldAPI;\n\n /**\n * sdk.parameters\n */\n parameters?: ParametersAPI & {\n instance: {\n stars?: number;\n };\n };\n}\n\nfunction isValidCount(count?: string | number): count is number {\n return typeof count === 'number' && !isNaN(count) && count > 0;\n}\n\nfunction getStarCount(count?: number | string): number {\n const defaultValue = 5;\n\n if (isValidCount(count)) {\n return Math.round(count);\n } else if (typeof count === 'string') {\n const parsed = parseInt(count, 10);\n return isValidCount(parsed) ? Math.round(parsed) : defaultValue;\n } else {\n return defaultValue;\n }\n}\n\nexport function RatingEditor(props: RatingEditorProps) {\n const { field } = props;\n\n const starsCount = getStarCount(get(props.parameters, ['instance', 'stars']));\n\n return (\n <FieldConnector<number>\n throttle={0}\n field={field}\n isInitiallyDisabled={props.isInitiallyDisabled}>\n {({ disabled, value, setValue }) => {\n const clearOption = () => {\n setValue(null);\n };\n\n return (\n <Flex testId=\"rating-editor\" flexDirection=\"row\" marginTop=\"spacingS\">\n <RatingRibbon\n disabled={disabled}\n value={value}\n stars={starsCount}\n onSelect={(num) => {\n setValue(num);\n }}\n />\n {value !== undefined && !disabled && (\n <Flex marginLeft=\"spacingM\">\n <TextLink testId=\"rating-editor-clear\" onClick={clearOption}>\n Clear\n </TextLink>\n </Flex>\n )}\n </Flex>\n );\n }}\n </FieldConnector>\n );\n}\n\nRatingEditor.defaultProps = {\n isInitiallyDisabled: true,\n};\n"],"names":["RatingRibbon","hovered","num","_this","state","value","props","disabled","setState","render","items","i","this","stars","push","React","map","IconButton","_this2","isSelected","testId","key","iconProps","icon","className","css","width","height","buttonType","onClick","onSelect","onKeyDown","e","keyCode","onMouseOver","onFocus","onMouseLeave","onBlur","label","toString","isValidCount","count","isNaN","RatingEditor","field","starsCount","Math","round","parsed","parseInt","getStarCount","get","parameters","FieldConnector","throttle","isInitiallyDisabled","setValue","Flex","flexDirection","marginTop","undefined","marginLeft","TextLink","defaultProps"],"mappings":"6XAeaA,uFACH,CACNC,QAAS,mBAGE,SAACC,OACND,EAAUE,EAAKC,MAAMH,QACrBI,EAAQF,EAAKG,MAAMD,aAET,OAAZJ,EACKC,GAAOD,IAEZI,GACKH,GAAOG,YAKT,WACFF,EAAKG,MAAMC,YACTC,SAAS,CAAEP,QAAS,kBAInB,SAACC,UAAgB,WACpBC,EAAKG,MAAMC,YACTC,SAAS,CAAEP,QAASC,2GAI7BO,OAAA,0BACQC,EAAkB,GACfC,EAAI,EAAGA,GAAKC,KAAKN,MAAMO,MAAOF,IACrCD,EAAMI,KAAKH,UAIXI,gCACGL,EAAMM,KAAI,SAACd,UACVa,gBAACE,8BACgBC,EAAKC,WAAWjB,GAAO,OAAS,QAC/CkB,OAAO,qBACPb,SAAUW,EAAKZ,MAAMC,SACrBc,IAAKnB,EACLoB,UAAW,CAAEC,KAAM,OAAQC,UAAWC,MAAI,CAAEC,MAAO,OAAQC,OAAQ,UACnEC,WAAYV,EAAKC,WAAWjB,GAAO,UAAY,QAC/C2B,QAAS,WACPX,EAAKZ,MAAMwB,SAAS5B,IAEtB6B,UAAW,SAACC,GACQ,KAAdA,EAAEC,SACJf,EAAKZ,MAAMwB,SAAS5B,IAGxBgC,YAAahB,EAAKiB,QAAQjC,GAC1BkC,aAAclB,EAAKmB,OACnBF,QAASjB,EAAKiB,QAAQjC,GACtBmC,OAAQnB,EAAKmB,OACbC,MAAOpC,EAAIqC,qBA1DWxB,aCYlC,SAASyB,EAAaC,SACI,iBAAVA,IAAuBC,MAAMD,IAAUA,EAAQ,WAgB/CE,EAAarC,OACnBsC,EAAUtC,EAAVsC,MAEFC,EAhBR,SAAsBJ,MAGhBD,EAAaC,UACRK,KAAKC,MAAMN,GACb,GAAqB,iBAAVA,EAAoB,KAC9BO,EAASC,SAASR,EAAO,WACxBD,EAAaQ,GAAUF,KAAKC,MAAMC,GANtB,SAAA,EAeFE,CAAaC,EAAI7C,EAAM8C,WAAY,CAAC,WAAY,kBAGjErC,gBAACsC,kBACCC,SAAU,EACVV,MAAOA,EACPW,oBAAqBjD,EAAMiD,sBAC1B,gBAAGhD,IAAAA,SAAUF,IAAAA,MAAOmD,IAAAA,gBAMjBzC,gBAAC0C,QAAKrC,OAAO,gBAAgBsC,cAAc,MAAMC,UAAU,YACzD5C,gBAACf,GACCO,SAAUA,EACVF,MAAOA,EACPQ,MAAOgC,EACPf,SAAU,SAAC5B,GACTsD,EAAStD,WAGF0D,IAAVvD,IAAwBE,GACvBQ,gBAAC0C,QAAKI,WAAW,YACf9C,gBAAC+C,YAAS1C,OAAO,sBAAsBS,QAhB3B,WAClB2B,EAAS,sBA2BnBb,EAAaoB,aAAe,CAC1BR,qBAAqB"}
1
+ {"version":3,"file":"field-editor-rating.cjs.production.min.js","sources":["../src/RatingRibbon.tsx","../src/RatingEditor.tsx"],"sourcesContent":["import * as React from 'react';\nimport { css } from 'emotion';\n\nimport { IconButton } from '@contentful/f36-components';\n\nimport { StarIcon } from '@contentful/f36-icons';\n\ntype RatingRibbonProps = {\n disabled: boolean;\n stars: number;\n value: number | null | undefined;\n onSelect: (val: number) => void;\n};\n\ntype RatingRibbonState = {\n hovered: null | number;\n};\n\nexport class RatingRibbon extends React.Component<RatingRibbonProps, RatingRibbonState> {\n state = {\n hovered: null,\n };\n\n isSelected = (num: number) => {\n const hovered = this.state.hovered;\n const value = this.props.value;\n\n if (hovered !== null) {\n return num <= hovered;\n }\n if (value) {\n return num <= value;\n }\n return false;\n };\n\n onBlur = () => {\n if (!this.props.disabled) {\n this.setState({ hovered: null });\n }\n };\n\n onFocus = (num: number) => () => {\n if (!this.props.disabled) {\n this.setState({ hovered: num });\n }\n };\n\n render() {\n const items: number[] = [];\n for (let i = 1; i <= this.props.stars; i++) {\n items.push(i);\n }\n\n return (\n <>\n {items.map((num) => (\n <IconButton\n variant=\"transparent\"\n size=\"small\"\n icon={\n <StarIcon\n variant={this.isSelected(num) ? 'primary' : 'muted'}\n className={css({ width: '22px', height: '22px' })}\n />\n }\n data-selected={this.isSelected(num) ? 'true' : 'false'}\n testId=\"rating-editor-star\"\n isDisabled={this.props.disabled}\n key={num}\n onClick={() => {\n this.props.onSelect(num);\n }}\n onKeyDown={(e: React.KeyboardEvent) => {\n if (e.keyCode === 13) {\n this.props.onSelect(num);\n }\n }}\n onMouseOver={this.onFocus(num)}\n onMouseLeave={this.onBlur}\n onFocus={this.onFocus(num)}\n onBlur={this.onBlur}\n aria-label={num.toString()}\n />\n ))}\n </>\n );\n }\n}\n","import * as React from 'react';\nimport get from 'lodash/get';\nimport { FieldAPI, ParametersAPI, FieldConnector } from '@contentful/field-editor-shared';\nimport { RatingRibbon } from './RatingRibbon';\n\nimport { TextLink, Flex } from '@contentful/f36-components';\n\nexport interface RatingEditorProps {\n /**\n * is the field disabled initially\n */\n isInitiallyDisabled: boolean;\n\n /**\n * sdk.field\n */\n field: FieldAPI;\n\n /**\n * sdk.parameters\n */\n parameters?: ParametersAPI & {\n instance: {\n stars?: number;\n };\n };\n}\n\nfunction isValidCount(count?: string | number): count is number {\n return typeof count === 'number' && !isNaN(count) && count > 0;\n}\n\nfunction getStarCount(count?: number | string): number {\n const defaultValue = 5;\n\n if (isValidCount(count)) {\n return Math.round(count);\n } else if (typeof count === 'string') {\n const parsed = parseInt(count, 10);\n return isValidCount(parsed) ? Math.round(parsed) : defaultValue;\n } else {\n return defaultValue;\n }\n}\n\nexport function RatingEditor(props: RatingEditorProps) {\n const { field } = props;\n\n const starsCount = getStarCount(get(props.parameters, ['instance', 'stars']));\n\n return (\n <FieldConnector<number>\n throttle={0}\n field={field}\n isInitiallyDisabled={props.isInitiallyDisabled}>\n {({ disabled, value, setValue }) => {\n const clearOption = () => {\n setValue(null);\n };\n\n return (\n <Flex testId=\"rating-editor\" flexDirection=\"row\" marginTop=\"spacingS\">\n <RatingRibbon\n disabled={disabled}\n value={value}\n stars={starsCount}\n onSelect={(num) => {\n setValue(num);\n }}\n />\n {value !== undefined && !disabled && (\n <Flex marginLeft=\"spacingM\">\n <TextLink as=\"button\" testId=\"rating-editor-clear\" onClick={clearOption}>\n Clear\n </TextLink>\n </Flex>\n )}\n </Flex>\n );\n }}\n </FieldConnector>\n );\n}\n\nRatingEditor.defaultProps = {\n isInitiallyDisabled: true,\n};\n"],"names":["RatingRibbon","hovered","num","_this","state","value","props","disabled","setState","render","items","i","this","stars","push","React","map","IconButton","variant","size","icon","StarIcon","_this2","isSelected","className","css","width","height","testId","isDisabled","key","onClick","onSelect","onKeyDown","e","keyCode","onMouseOver","onFocus","onMouseLeave","onBlur","toString","isValidCount","count","isNaN","RatingEditor","field","starsCount","Math","round","parsed","parseInt","getStarCount","get","parameters","FieldConnector","throttle","isInitiallyDisabled","setValue","Flex","flexDirection","marginTop","undefined","marginLeft","TextLink","as","defaultProps"],"mappings":"qZAkBaA,uFACH,CACNC,QAAS,mBAGE,SAACC,OACND,EAAUE,EAAKC,MAAMH,QACrBI,EAAQF,EAAKG,MAAMD,aAET,OAAZJ,EACKC,GAAOD,IAEZI,GACKH,GAAOG,YAKT,WACFF,EAAKG,MAAMC,YACTC,SAAS,CAAEP,QAAS,kBAInB,SAACC,UAAgB,WACpBC,EAAKG,MAAMC,YACTC,SAAS,CAAEP,QAASC,2GAI7BO,OAAA,0BACQC,EAAkB,GACfC,EAAI,EAAGA,GAAKC,KAAKN,MAAMO,MAAOF,IACrCD,EAAMI,KAAKH,UAIXI,gCACGL,EAAMM,KAAI,SAACd,UACVa,gBAACE,cACCC,QAAQ,cACRC,KAAK,QACLC,KACEL,gBAACM,YACCH,QAASI,EAAKC,WAAWrB,GAAO,UAAY,QAC5CsB,UAAWC,MAAI,CAAEC,MAAO,OAAQC,OAAQ,2BAG7BL,EAAKC,WAAWrB,GAAO,OAAS,QAC/C0B,OAAO,qBACPC,WAAYP,EAAKhB,MAAMC,SACvBuB,IAAK5B,EACL6B,QAAS,WACPT,EAAKhB,MAAM0B,SAAS9B,IAEtB+B,UAAW,SAACC,GACQ,KAAdA,EAAEC,SACJb,EAAKhB,MAAM0B,SAAS9B,IAGxBkC,YAAad,EAAKe,QAAQnC,GAC1BoC,aAAchB,EAAKiB,OACnBF,QAASf,EAAKe,QAAQnC,GACtBqC,OAAQjB,EAAKiB,oBACDrC,EAAIsC,qBAhEMzB,aCUlC,SAAS0B,EAAaC,SACI,iBAAVA,IAAuBC,MAAMD,IAAUA,EAAQ,WAgB/CE,EAAatC,OACnBuC,EAAUvC,EAAVuC,MAEFC,EAhBR,SAAsBJ,MAGhBD,EAAaC,UACRK,KAAKC,MAAMN,GACb,GAAqB,iBAAVA,EAAoB,KAC9BO,EAASC,SAASR,EAAO,WACxBD,EAAaQ,GAAUF,KAAKC,MAAMC,GANtB,SAAA,EAeFE,CAAaC,EAAI9C,EAAM+C,WAAY,CAAC,WAAY,kBAGjEtC,gBAACuC,kBACCC,SAAU,EACVV,MAAOA,EACPW,oBAAqBlD,EAAMkD,sBAC1B,gBAAGjD,IAAAA,SAAUF,IAAAA,MAAOoD,IAAAA,gBAMjB1C,gBAAC2C,QAAK9B,OAAO,gBAAgB+B,cAAc,MAAMC,UAAU,YACzD7C,gBAACf,GACCO,SAAUA,EACVF,MAAOA,EACPQ,MAAOiC,EACPd,SAAU,SAAC9B,GACTuD,EAASvD,WAGF2D,IAAVxD,IAAwBE,GACvBQ,gBAAC2C,QAAKI,WAAW,YACf/C,gBAACgD,YAASC,GAAG,SAASpC,OAAO,sBAAsBG,QAhBvC,WAClB0B,EAAS,sBA2BnBb,EAAaqB,aAAe,CAC1BT,qBAAqB"}
@@ -1,8 +1,9 @@
1
1
  import { createElement, Fragment, Component } from 'react';
2
2
  import get from 'lodash-es/get';
3
3
  import { FieldConnector } from '@contentful/field-editor-shared';
4
- import { IconButton, Flex, TextLink } from '@contentful/forma-36-react-components';
5
4
  import { css } from 'emotion';
5
+ import { IconButton, Flex, TextLink } from '@contentful/f36-components';
6
+ import { StarIcon } from '@contentful/f36-icons';
6
7
 
7
8
  function _inheritsLoose(subClass, superClass) {
8
9
  subClass.prototype = Object.create(superClass.prototype);
@@ -80,18 +81,19 @@ var RatingRibbon = /*#__PURE__*/function (_React$Component) {
80
81
 
81
82
  return createElement(Fragment, null, items.map(function (num) {
82
83
  return createElement(IconButton, {
83
- "data-selected": _this2.isSelected(num) ? 'true' : 'false',
84
- testId: "rating-editor-star",
85
- disabled: _this2.props.disabled,
86
- key: num,
87
- iconProps: {
88
- icon: 'Star',
84
+ variant: "transparent",
85
+ size: "small",
86
+ icon: createElement(StarIcon, {
87
+ variant: _this2.isSelected(num) ? 'primary' : 'muted',
89
88
  className: css({
90
89
  width: '22px',
91
90
  height: '22px'
92
91
  })
93
- },
94
- buttonType: _this2.isSelected(num) ? 'primary' : 'muted',
92
+ }),
93
+ "data-selected": _this2.isSelected(num) ? 'true' : 'false',
94
+ testId: "rating-editor-star",
95
+ isDisabled: _this2.props.disabled,
96
+ key: num,
95
97
  onClick: function onClick() {
96
98
  _this2.props.onSelect(num);
97
99
  },
@@ -104,7 +106,7 @@ var RatingRibbon = /*#__PURE__*/function (_React$Component) {
104
106
  onMouseLeave: _this2.onBlur,
105
107
  onFocus: _this2.onFocus(num),
106
108
  onBlur: _this2.onBlur,
107
- label: num.toString()
109
+ "aria-label": num.toString()
108
110
  });
109
111
  }));
110
112
  };
@@ -159,6 +161,7 @@ function RatingEditor(props) {
159
161
  }), value !== undefined && !disabled && createElement(Flex, {
160
162
  marginLeft: "spacingM"
161
163
  }, createElement(TextLink, {
164
+ as: "button",
162
165
  testId: "rating-editor-clear",
163
166
  onClick: clearOption
164
167
  }, "Clear")));
@@ -1 +1 @@
1
- {"version":3,"file":"field-editor-rating.esm.js","sources":["../src/RatingRibbon.tsx","../src/RatingEditor.tsx"],"sourcesContent":["import * as React from 'react';\nimport { css } from 'emotion';\nimport { IconButton } from '@contentful/forma-36-react-components';\n\ntype RatingRibbonProps = {\n disabled: boolean;\n stars: number;\n value: number | null | undefined;\n onSelect: (val: number) => void;\n};\n\ntype RatingRibbonState = {\n hovered: null | number;\n};\n\nexport class RatingRibbon extends React.Component<RatingRibbonProps, RatingRibbonState> {\n state = {\n hovered: null,\n };\n\n isSelected = (num: number) => {\n const hovered = this.state.hovered;\n const value = this.props.value;\n\n if (hovered !== null) {\n return num <= hovered;\n }\n if (value) {\n return num <= value;\n }\n return false;\n };\n\n onBlur = () => {\n if (!this.props.disabled) {\n this.setState({ hovered: null });\n }\n };\n\n onFocus = (num: number) => () => {\n if (!this.props.disabled) {\n this.setState({ hovered: num });\n }\n };\n\n render() {\n const items: number[] = [];\n for (let i = 1; i <= this.props.stars; i++) {\n items.push(i);\n }\n\n return (\n <>\n {items.map((num) => (\n <IconButton\n data-selected={this.isSelected(num) ? 'true' : 'false'}\n testId=\"rating-editor-star\"\n disabled={this.props.disabled}\n key={num}\n iconProps={{ icon: 'Star', className: css({ width: '22px', height: '22px' }) }}\n buttonType={this.isSelected(num) ? 'primary' : 'muted'}\n onClick={() => {\n this.props.onSelect(num);\n }}\n onKeyDown={(e: React.KeyboardEvent) => {\n if (e.keyCode === 13) {\n this.props.onSelect(num);\n }\n }}\n onMouseOver={this.onFocus(num)}\n onMouseLeave={this.onBlur}\n onFocus={this.onFocus(num)}\n onBlur={this.onBlur}\n label={num.toString()}\n />\n ))}\n </>\n );\n }\n}\n","import * as React from 'react';\nimport get from 'lodash/get';\nimport { FieldAPI, ParametersAPI, FieldConnector } from '@contentful/field-editor-shared';\nimport { TextLink, Flex } from '@contentful/forma-36-react-components';\nimport { RatingRibbon } from './RatingRibbon';\n\nexport interface RatingEditorProps {\n /**\n * is the field disabled initially\n */\n isInitiallyDisabled: boolean;\n\n /**\n * sdk.field\n */\n field: FieldAPI;\n\n /**\n * sdk.parameters\n */\n parameters?: ParametersAPI & {\n instance: {\n stars?: number;\n };\n };\n}\n\nfunction isValidCount(count?: string | number): count is number {\n return typeof count === 'number' && !isNaN(count) && count > 0;\n}\n\nfunction getStarCount(count?: number | string): number {\n const defaultValue = 5;\n\n if (isValidCount(count)) {\n return Math.round(count);\n } else if (typeof count === 'string') {\n const parsed = parseInt(count, 10);\n return isValidCount(parsed) ? Math.round(parsed) : defaultValue;\n } else {\n return defaultValue;\n }\n}\n\nexport function RatingEditor(props: RatingEditorProps) {\n const { field } = props;\n\n const starsCount = getStarCount(get(props.parameters, ['instance', 'stars']));\n\n return (\n <FieldConnector<number>\n throttle={0}\n field={field}\n isInitiallyDisabled={props.isInitiallyDisabled}>\n {({ disabled, value, setValue }) => {\n const clearOption = () => {\n setValue(null);\n };\n\n return (\n <Flex testId=\"rating-editor\" flexDirection=\"row\" marginTop=\"spacingS\">\n <RatingRibbon\n disabled={disabled}\n value={value}\n stars={starsCount}\n onSelect={(num) => {\n setValue(num);\n }}\n />\n {value !== undefined && !disabled && (\n <Flex marginLeft=\"spacingM\">\n <TextLink testId=\"rating-editor-clear\" onClick={clearOption}>\n Clear\n </TextLink>\n </Flex>\n )}\n </Flex>\n );\n }}\n </FieldConnector>\n );\n}\n\nRatingEditor.defaultProps = {\n isInitiallyDisabled: true,\n};\n"],"names":["RatingRibbon","hovered","num","state","value","props","disabled","setState","render","items","i","stars","push","React","map","IconButton","isSelected","testId","key","iconProps","icon","className","css","width","height","buttonType","onClick","onSelect","onKeyDown","e","keyCode","onMouseOver","onFocus","onMouseLeave","onBlur","label","toString","isValidCount","count","isNaN","getStarCount","defaultValue","Math","round","parsed","parseInt","RatingEditor","field","starsCount","get","parameters","FieldConnector","throttle","isInitiallyDisabled","setValue","clearOption","Flex","flexDirection","marginTop","undefined","marginLeft","TextLink","defaultProps"],"mappings":"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"}
1
+ {"version":3,"file":"field-editor-rating.esm.js","sources":["../src/RatingRibbon.tsx","../src/RatingEditor.tsx"],"sourcesContent":["import * as React from 'react';\nimport { css } from 'emotion';\n\nimport { IconButton } from '@contentful/f36-components';\n\nimport { StarIcon } from '@contentful/f36-icons';\n\ntype RatingRibbonProps = {\n disabled: boolean;\n stars: number;\n value: number | null | undefined;\n onSelect: (val: number) => void;\n};\n\ntype RatingRibbonState = {\n hovered: null | number;\n};\n\nexport class RatingRibbon extends React.Component<RatingRibbonProps, RatingRibbonState> {\n state = {\n hovered: null,\n };\n\n isSelected = (num: number) => {\n const hovered = this.state.hovered;\n const value = this.props.value;\n\n if (hovered !== null) {\n return num <= hovered;\n }\n if (value) {\n return num <= value;\n }\n return false;\n };\n\n onBlur = () => {\n if (!this.props.disabled) {\n this.setState({ hovered: null });\n }\n };\n\n onFocus = (num: number) => () => {\n if (!this.props.disabled) {\n this.setState({ hovered: num });\n }\n };\n\n render() {\n const items: number[] = [];\n for (let i = 1; i <= this.props.stars; i++) {\n items.push(i);\n }\n\n return (\n <>\n {items.map((num) => (\n <IconButton\n variant=\"transparent\"\n size=\"small\"\n icon={\n <StarIcon\n variant={this.isSelected(num) ? 'primary' : 'muted'}\n className={css({ width: '22px', height: '22px' })}\n />\n }\n data-selected={this.isSelected(num) ? 'true' : 'false'}\n testId=\"rating-editor-star\"\n isDisabled={this.props.disabled}\n key={num}\n onClick={() => {\n this.props.onSelect(num);\n }}\n onKeyDown={(e: React.KeyboardEvent) => {\n if (e.keyCode === 13) {\n this.props.onSelect(num);\n }\n }}\n onMouseOver={this.onFocus(num)}\n onMouseLeave={this.onBlur}\n onFocus={this.onFocus(num)}\n onBlur={this.onBlur}\n aria-label={num.toString()}\n />\n ))}\n </>\n );\n }\n}\n","import * as React from 'react';\nimport get from 'lodash/get';\nimport { FieldAPI, ParametersAPI, FieldConnector } from '@contentful/field-editor-shared';\nimport { RatingRibbon } from './RatingRibbon';\n\nimport { TextLink, Flex } from '@contentful/f36-components';\n\nexport interface RatingEditorProps {\n /**\n * is the field disabled initially\n */\n isInitiallyDisabled: boolean;\n\n /**\n * sdk.field\n */\n field: FieldAPI;\n\n /**\n * sdk.parameters\n */\n parameters?: ParametersAPI & {\n instance: {\n stars?: number;\n };\n };\n}\n\nfunction isValidCount(count?: string | number): count is number {\n return typeof count === 'number' && !isNaN(count) && count > 0;\n}\n\nfunction getStarCount(count?: number | string): number {\n const defaultValue = 5;\n\n if (isValidCount(count)) {\n return Math.round(count);\n } else if (typeof count === 'string') {\n const parsed = parseInt(count, 10);\n return isValidCount(parsed) ? Math.round(parsed) : defaultValue;\n } else {\n return defaultValue;\n }\n}\n\nexport function RatingEditor(props: RatingEditorProps) {\n const { field } = props;\n\n const starsCount = getStarCount(get(props.parameters, ['instance', 'stars']));\n\n return (\n <FieldConnector<number>\n throttle={0}\n field={field}\n isInitiallyDisabled={props.isInitiallyDisabled}>\n {({ disabled, value, setValue }) => {\n const clearOption = () => {\n setValue(null);\n };\n\n return (\n <Flex testId=\"rating-editor\" flexDirection=\"row\" marginTop=\"spacingS\">\n <RatingRibbon\n disabled={disabled}\n value={value}\n stars={starsCount}\n onSelect={(num) => {\n setValue(num);\n }}\n />\n {value !== undefined && !disabled && (\n <Flex marginLeft=\"spacingM\">\n <TextLink as=\"button\" testId=\"rating-editor-clear\" onClick={clearOption}>\n Clear\n </TextLink>\n </Flex>\n )}\n </Flex>\n );\n }}\n </FieldConnector>\n );\n}\n\nRatingEditor.defaultProps = {\n isInitiallyDisabled: true,\n};\n"],"names":["RatingRibbon","hovered","num","state","value","props","disabled","setState","render","items","i","stars","push","React","map","IconButton","variant","size","icon","StarIcon","isSelected","className","css","width","height","testId","isDisabled","key","onClick","onSelect","onKeyDown","e","keyCode","onMouseOver","onFocus","onMouseLeave","onBlur","toString","isValidCount","count","isNaN","getStarCount","defaultValue","Math","round","parsed","parseInt","RatingEditor","field","starsCount","get","parameters","FieldConnector","throttle","isInitiallyDisabled","setValue","clearOption","Flex","flexDirection","marginTop","undefined","marginLeft","TextLink","as","defaultProps"],"mappings":"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"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@contentful/field-editor-rating",
3
- "version": "0.12.5",
3
+ "version": "1.0.1",
4
4
  "main": "dist/index.js",
5
5
  "module": "dist/field-editor-rating.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/field-editor-shared": "^0.25.0",
25
- "@contentful/forma-36-react-components": "^3.93.4",
26
- "@contentful/forma-36-tokens": "^0.11.0",
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.18.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": "917572e21ded4ddb74828b2e1b2ce7bdc1c14fc8"
47
+ "gitHead": "3dc7130a751de690903c572edfcdfdf3587b57bf"
48
48
  }