@contentful/field-editor-rating 1.1.11 → 1.2.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,6 +3,12 @@
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
+ # [1.2.0](https://github.com/contentful/field-editors/compare/@contentful/field-editor-rating@1.1.11...@contentful/field-editor-rating@1.2.0) (2023-04-19)
7
+
8
+ ### Features
9
+
10
+ - upgrade cypress [TOL-1036] ([#1391](https://github.com/contentful/field-editors/issues/1391)) ([9c1aec9](https://github.com/contentful/field-editors/commit/9c1aec98aabbe464cdc3f1236c3bb1cc29b8208d))
11
+
6
12
  ## [1.1.11](https://github.com/contentful/field-editors/compare/@contentful/field-editor-rating@1.1.10...@contentful/field-editor-rating@1.1.11) (2023-03-14)
7
13
 
8
14
  **Note:** Version bump only for package @contentful/field-editor-rating
@@ -5,46 +5,22 @@ Object.defineProperty(exports, '__esModule', { value: true });
5
5
  function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'default' in ex) ? ex['default'] : ex; }
6
6
 
7
7
  var React = require('react');
8
- var get = _interopDefault(require('lodash/get'));
9
- var fieldEditorShared = require('@contentful/field-editor-shared');
10
- var emotion = require('emotion');
11
8
  var f36Components = require('@contentful/f36-components');
9
+ var fieldEditorShared = require('@contentful/field-editor-shared');
10
+ var get = _interopDefault(require('lodash/get'));
12
11
  var f36Icons = require('@contentful/f36-icons');
12
+ var emotion = require('emotion');
13
13
 
14
- function _inheritsLoose(subClass, superClass) {
15
- subClass.prototype = Object.create(superClass.prototype);
16
- subClass.prototype.constructor = subClass;
17
-
18
- _setPrototypeOf(subClass, superClass);
19
- }
20
-
21
- function _setPrototypeOf(o, p) {
22
- _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) {
23
- o.__proto__ = p;
24
- return o;
25
- };
26
-
27
- return _setPrototypeOf(o, p);
28
- }
29
-
30
- var RatingRibbon = /*#__PURE__*/function (_React$Component) {
31
- _inheritsLoose(RatingRibbon, _React$Component);
32
-
33
- function RatingRibbon() {
34
- var _this;
35
-
36
- for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
37
- args[_key] = arguments[_key];
38
- }
39
-
40
- _this = _React$Component.call.apply(_React$Component, [this].concat(args)) || this;
41
- _this.state = {
14
+ class RatingRibbon extends React.Component {
15
+ constructor(...args) {
16
+ super(...args);
17
+ this.state = {
42
18
  hovered: null
43
19
  };
44
20
 
45
- _this.isSelected = function (num) {
46
- var hovered = _this.state.hovered;
47
- var value = _this.props.value;
21
+ this.isSelected = num => {
22
+ const hovered = this.state.hovered;
23
+ const value = this.props.value;
48
24
 
49
25
  if (hovered !== null) {
50
26
  return num <= hovered;
@@ -57,84 +33,73 @@ var RatingRibbon = /*#__PURE__*/function (_React$Component) {
57
33
  return false;
58
34
  };
59
35
 
60
- _this.onBlur = function () {
61
- if (!_this.props.disabled) {
62
- _this.setState({
36
+ this.onBlur = () => {
37
+ if (!this.props.disabled) {
38
+ this.setState({
63
39
  hovered: null
64
40
  });
65
41
  }
66
42
  };
67
43
 
68
- _this.onFocus = function (num) {
69
- return function () {
70
- if (!_this.props.disabled) {
71
- _this.setState({
72
- hovered: num
73
- });
74
- }
75
- };
44
+ this.onFocus = num => () => {
45
+ if (!this.props.disabled) {
46
+ this.setState({
47
+ hovered: num
48
+ });
49
+ }
76
50
  };
77
-
78
- return _this;
79
51
  }
80
52
 
81
- var _proto = RatingRibbon.prototype;
82
-
83
- _proto.render = function render() {
84
- var _this2 = this;
53
+ render() {
54
+ const items = [];
85
55
 
86
- var items = [];
87
-
88
- for (var i = 1; i <= this.props.stars; i++) {
56
+ for (let i = 1; i <= this.props.stars; i++) {
89
57
  items.push(i);
90
58
  }
91
59
 
92
- return React.createElement(React.Fragment, null, items.map(function (num) {
93
- return React.createElement(f36Components.IconButton, {
94
- variant: "transparent",
95
- size: "small",
96
- icon: React.createElement(f36Icons.StarIcon, {
97
- variant: _this2.isSelected(num) ? 'primary' : 'muted',
98
- className: emotion.css({
99
- width: '22px',
100
- height: '22px'
101
- })
102
- }),
103
- "data-selected": _this2.isSelected(num) ? 'true' : 'false',
104
- testId: "rating-editor-star",
105
- isDisabled: _this2.props.disabled,
106
- key: num,
107
- onClick: function onClick() {
108
- _this2.props.onSelect(num);
109
- },
110
- onKeyDown: function onKeyDown(e) {
111
- if (e.keyCode === 13) {
112
- _this2.props.onSelect(num);
113
- }
114
- },
115
- onMouseOver: _this2.onFocus(num),
116
- onMouseLeave: _this2.onBlur,
117
- onFocus: _this2.onFocus(num),
118
- onBlur: _this2.onBlur,
119
- "aria-label": num.toString()
120
- });
121
- }));
122
- };
123
-
124
- return RatingRibbon;
125
- }(React.Component);
60
+ return React.createElement(React.Fragment, null, items.map(num => React.createElement(f36Components.IconButton, {
61
+ variant: "transparent",
62
+ size: "small",
63
+ icon: React.createElement(f36Icons.StarIcon, {
64
+ variant: this.isSelected(num) ? 'primary' : 'muted',
65
+ className: emotion.css({
66
+ width: '22px',
67
+ height: '22px'
68
+ })
69
+ }),
70
+ "data-selected": this.isSelected(num) ? 'true' : 'false',
71
+ testId: "rating-editor-star",
72
+ isDisabled: this.props.disabled,
73
+ key: num,
74
+ onClick: () => {
75
+ this.props.onSelect(num);
76
+ },
77
+ onKeyDown: e => {
78
+ if (e.keyCode === 13) {
79
+ this.props.onSelect(num);
80
+ }
81
+ },
82
+ onMouseOver: this.onFocus(num),
83
+ onMouseLeave: this.onBlur,
84
+ onFocus: this.onFocus(num),
85
+ onBlur: this.onBlur,
86
+ "aria-label": num.toString()
87
+ })));
88
+ }
89
+
90
+ }
126
91
 
127
92
  function isValidCount(count) {
128
93
  return typeof count === 'number' && !isNaN(count) && count > 0;
129
94
  }
130
95
 
131
96
  function getStarCount(count) {
132
- var defaultValue = 5;
97
+ const defaultValue = 5;
133
98
 
134
99
  if (isValidCount(count)) {
135
100
  return Math.round(count);
136
101
  } else if (typeof count === 'string') {
137
- var parsed = parseInt(count, 10);
102
+ const parsed = parseInt(count, 10);
138
103
  return isValidCount(parsed) ? Math.round(parsed) : defaultValue;
139
104
  } else {
140
105
  return defaultValue;
@@ -142,18 +107,20 @@ function getStarCount(count) {
142
107
  }
143
108
 
144
109
  function RatingEditor(props) {
145
- var field = props.field;
146
- var starsCount = getStarCount(get(props.parameters, ['instance', 'stars']));
110
+ const {
111
+ field
112
+ } = props;
113
+ const starsCount = getStarCount(get(props.parameters, ['instance', 'stars']));
147
114
  return React.createElement(fieldEditorShared.FieldConnector, {
148
115
  throttle: 0,
149
116
  field: field,
150
117
  isInitiallyDisabled: props.isInitiallyDisabled
151
- }, function (_ref) {
152
- var disabled = _ref.disabled,
153
- value = _ref.value,
154
- setValue = _ref.setValue;
155
-
156
- var clearOption = function clearOption() {
118
+ }, ({
119
+ disabled,
120
+ value,
121
+ setValue
122
+ }) => {
123
+ const clearOption = () => {
157
124
  setValue(null);
158
125
  };
159
126
 
@@ -165,7 +132,7 @@ function RatingEditor(props) {
165
132
  disabled: disabled,
166
133
  value: value,
167
134
  stars: starsCount,
168
- onSelect: function onSelect(num) {
135
+ onSelect: num => {
169
136
  setValue(num);
170
137
  }
171
138
  }), value !== undefined && !disabled && React.createElement(f36Components.Flex, {
@@ -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';\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","state","hovered","isSelected","num","value","props","onBlur","disabled","setState","onFocus","render","items","i","stars","push","React","map","IconButton","variant","size","icon","StarIcon","className","css","width","height","testId","isDisabled","key","onClick","onSelect","onKeyDown","e","keyCode","onMouseOver","onMouseLeave","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":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAkBaA,YAAb;AAAA;;AAAA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA,UACEC,KADF,GACU;AACNC,MAAAA,OAAO,EAAE;AADH,KADV;;AAAA,UAKEC,UALF,GAKe,UAACC,GAAD;AACX,UAAMF,OAAO,GAAG,MAAKD,KAAL,CAAWC,OAA3B;AACA,UAAMG,KAAK,GAAG,MAAKC,KAAL,CAAWD,KAAzB;;AAEA,UAAIH,OAAO,KAAK,IAAhB,EAAsB;AACpB,eAAOE,GAAG,IAAIF,OAAd;AACD;;AACD,UAAIG,KAAJ,EAAW;AACT,eAAOD,GAAG,IAAIC,KAAd;AACD;;AACD,aAAO,KAAP;AACD,KAhBH;;AAAA,UAkBEE,MAlBF,GAkBW;AACP,UAAI,CAAC,MAAKD,KAAL,CAAWE,QAAhB,EAA0B;AACxB,cAAKC,QAAL,CAAc;AAAEP,UAAAA,OAAO,EAAE;AAAX,SAAd;AACD;AACF,KAtBH;;AAAA,UAwBEQ,OAxBF,GAwBY,UAACN,GAAD;AAAA,aAAiB;AACzB,YAAI,CAAC,MAAKE,KAAL,CAAWE,QAAhB,EAA0B;AACxB,gBAAKC,QAAL,CAAc;AAAEP,YAAAA,OAAO,EAAEE;AAAX,WAAd;AACD;AACF,OAJS;AAAA,KAxBZ;;AAAA;AAAA;;AAAA;;AAAA,SA8BEO,MA9BF,GA8BE;;;AACE,QAAMC,KAAK,GAAa,EAAxB;;AACA,SAAK,IAAIC,CAAC,GAAG,CAAb,EAAgBA,CAAC,IAAI,KAAKP,KAAL,CAAWQ,KAAhC,EAAuCD,CAAC,EAAxC,EAA4C;AAC1CD,MAAAA,KAAK,CAACG,IAAN,CAAWF,CAAX;AACD;;AAED,WACEG,mBAAA,eAAA,MAAA,EACGJ,KAAK,CAACK,GAAN,CAAU,UAACb,GAAD;AAAA,aACTY,mBAAA,CAACE,wBAAD;AACEC,QAAAA,OAAO,EAAC;AACRC,QAAAA,IAAI,EAAC;AACLC,QAAAA,IAAI,EACFL,mBAAA,CAACM,iBAAD;AACEH,UAAAA,OAAO,EAAE,MAAI,CAAChB,UAAL,CAAgBC,GAAhB,IAAuB,SAAvB,GAAmC;AAC5CmB,UAAAA,SAAS,EAAEC,WAAG,CAAC;AAAEC,YAAAA,KAAK,EAAE,MAAT;AAAiBC,YAAAA,MAAM,EAAE;AAAzB,WAAD;SAFhB;yBAKa,MAAI,CAACvB,UAAL,CAAgBC,GAAhB,IAAuB,MAAvB,GAAgC;AAC/CuB,QAAAA,MAAM,EAAC;AACPC,QAAAA,UAAU,EAAE,MAAI,CAACtB,KAAL,CAAWE;AACvBqB,QAAAA,GAAG,EAAEzB;AACL0B,QAAAA,OAAO,EAAE;AACP,UAAA,MAAI,CAACxB,KAAL,CAAWyB,QAAX,CAAoB3B,GAApB;AACD;AACD4B,QAAAA,SAAS,EAAE,mBAACC,CAAD;AACT,cAAIA,CAAC,CAACC,OAAF,KAAc,EAAlB,EAAsB;AACpB,YAAA,MAAI,CAAC5B,KAAL,CAAWyB,QAAX,CAAoB3B,GAApB;AACD;AACF;AACD+B,QAAAA,WAAW,EAAE,MAAI,CAACzB,OAAL,CAAaN,GAAb;AACbgC,QAAAA,YAAY,EAAE,MAAI,CAAC7B;AACnBG,QAAAA,OAAO,EAAE,MAAI,CAACA,OAAL,CAAaN,GAAb;AACTG,QAAAA,MAAM,EAAE,MAAI,CAACA;sBACDH,GAAG,CAACiC,QAAJ;OAzBd,CADS;AAAA,KAAV,CADH,CADF;AAiCD,GArEH;;AAAA;AAAA,EAAkCrB,eAAlC;;ACUA,SAASsB,YAAT,CAAsBC,KAAtB;AACE,SAAO,OAAOA,KAAP,KAAiB,QAAjB,IAA6B,CAACC,KAAK,CAACD,KAAD,CAAnC,IAA8CA,KAAK,GAAG,CAA7D;AACD;;AAED,SAASE,YAAT,CAAsBF,KAAtB;AACE,MAAMG,YAAY,GAAG,CAArB;;AAEA,MAAIJ,YAAY,CAACC,KAAD,CAAhB,EAAyB;AACvB,WAAOI,IAAI,CAACC,KAAL,CAAWL,KAAX,CAAP;AACD,GAFD,MAEO,IAAI,OAAOA,KAAP,KAAiB,QAArB,EAA+B;AACpC,QAAMM,MAAM,GAAGC,QAAQ,CAACP,KAAD,EAAQ,EAAR,CAAvB;AACA,WAAOD,YAAY,CAACO,MAAD,CAAZ,GAAuBF,IAAI,CAACC,KAAL,CAAWC,MAAX,CAAvB,GAA4CH,YAAnD;AACD,GAHM,MAGA;AACL,WAAOA,YAAP;AACD;AACF;;AAED,SAAgBK,aAAazC;AAC3B,MAAQ0C,KAAR,GAAkB1C,KAAlB,CAAQ0C,KAAR;AAEA,MAAMC,UAAU,GAAGR,YAAY,CAACS,GAAG,CAAC5C,KAAK,CAAC6C,UAAP,EAAmB,CAAC,UAAD,EAAa,OAAb,CAAnB,CAAJ,CAA/B;AAEA,SACEnC,mBAAA,CAACoC,gCAAD;AACEC,IAAAA,QAAQ,EAAE;AACVL,IAAAA,KAAK,EAAEA;AACPM,IAAAA,mBAAmB,EAAEhD,KAAK,CAACgD;GAH7B,EAIG;QAAG9C,gBAAAA;QAAUH,aAAAA;QAAOkD,gBAAAA;;AACnB,QAAMC,WAAW,GAAG,SAAdA,WAAc;AAClBD,MAAAA,QAAQ,CAAC,IAAD,CAAR;AACD,KAFD;;AAIA,WACEvC,mBAAA,CAACyC,kBAAD;AAAM9B,MAAAA,MAAM,EAAC;AAAgB+B,MAAAA,aAAa,EAAC;AAAMC,MAAAA,SAAS,EAAC;KAA3D,EACE3C,mBAAA,CAAChB,YAAD;AACEQ,MAAAA,QAAQ,EAAEA;AACVH,MAAAA,KAAK,EAAEA;AACPS,MAAAA,KAAK,EAAEmC;AACPlB,MAAAA,QAAQ,EAAE,kBAAC3B,GAAD;AACRmD,QAAAA,QAAQ,CAACnD,GAAD,CAAR;AACD;KANH,CADF,EASGC,KAAK,KAAKuD,SAAV,IAAuB,CAACpD,QAAxB,IACCQ,mBAAA,CAACyC,kBAAD;AAAMI,MAAAA,UAAU,EAAC;KAAjB,EACE7C,mBAAA,CAAC8C,sBAAD;AAAUC,MAAAA,EAAE,EAAC;AAASpC,MAAAA,MAAM,EAAC;AAAsBG,MAAAA,OAAO,EAAE0B;KAA5D,SAAA,CADF,CAVJ,CADF;AAmBD,GA5BH,CADF;AAgCD;AAEDT,YAAY,CAACiB,YAAb,GAA4B;AAC1BV,EAAAA,mBAAmB,EAAE;AADK,CAA5B;;;;"}
1
+ {"version":3,"file":"field-editor-rating.cjs.development.js","sources":["../src/RatingRibbon.tsx","../src/RatingEditor.tsx"],"sourcesContent":["import * as React from 'react';\n\n\nimport { IconButton } from '@contentful/f36-components';\nimport { StarIcon } from '@contentful/f36-icons';\nimport { css } from 'emotion';\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';\n\nimport { TextLink, Flex } from '@contentful/f36-components';\nimport { FieldAPI, ParametersAPI, FieldConnector } from '@contentful/field-editor-shared';\nimport get from 'lodash/get';\n\nimport { RatingRibbon } from './RatingRibbon';\n\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","React","state","hovered","isSelected","num","value","props","onBlur","disabled","setState","onFocus","render","items","i","stars","push","map","IconButton","variant","size","icon","StarIcon","className","css","width","height","testId","isDisabled","key","onClick","onSelect","onKeyDown","e","keyCode","onMouseOver","onMouseLeave","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("emotion"),i=require("@contentful/f36-components"),a=require("@contentful/f36-icons");function l(e,t){return(l=Object.setPrototypeOf||function(e,t){return e.__proto__=t,e})(e,t)}var s=function(e){var r,n;function s(){for(var t,r=arguments.length,n=new Array(r),o=0;o<r;o++)n[o]=arguments[o];return(t=e.call.apply(e,[this].concat(n))||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,l(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(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()})})))},s}(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(s,{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;
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e,t=require("react"),r=require("@contentful/f36-components"),s=require("@contentful/field-editor-shared"),n=(e=require("lodash/get"))&&"object"==typeof e&&"default"in e?e.default:e,i=require("@contentful/f36-icons"),o=require("emotion");class a extends t.Component{constructor(...e){super(...e),this.state={hovered:null},this.isSelected=e=>{const t=this.state.hovered,r=this.props.value;return null!==t?e<=t:!!r&&e<=r},this.onBlur=()=>{this.props.disabled||this.setState({hovered:null})},this.onFocus=e=>()=>{this.props.disabled||this.setState({hovered:e})}}render(){const e=[];for(let t=1;t<=this.props.stars;t++)e.push(t);return t.createElement(t.Fragment,null,e.map(e=>t.createElement(r.IconButton,{variant:"transparent",size:"small",icon:t.createElement(i.StarIcon,{variant:this.isSelected(e)?"primary":"muted",className:o.css({width:"22px",height:"22px"})}),"data-selected":this.isSelected(e)?"true":"false",testId:"rating-editor-star",isDisabled:this.props.disabled,key:e,onClick:()=>{this.props.onSelect(e)},onKeyDown:t=>{13===t.keyCode&&this.props.onSelect(e)},onMouseOver:this.onFocus(e),onMouseLeave:this.onBlur,onFocus:this.onFocus(e),onBlur:this.onBlur,"aria-label":e.toString()})))}}function l(e){return"number"==typeof e&&!isNaN(e)&&e>0}function u(e){const{field:i}=e,o=function(e){if(l(e))return Math.round(e);if("string"==typeof e){const t=parseInt(e,10);return l(t)?Math.round(t):5}return 5}(n(e.parameters,["instance","stars"]));return t.createElement(s.FieldConnector,{throttle:0,field:i,isInitiallyDisabled:e.isInitiallyDisabled},({disabled:e,value:s,setValue:n})=>t.createElement(r.Flex,{testId:"rating-editor",flexDirection:"row",marginTop:"spacingS"},t.createElement(a,{disabled:e,value:s,stars:o,onSelect:e=>{n(e)}}),void 0!==s&&!e&&t.createElement(r.Flex,{marginLeft:"spacingM"},t.createElement(r.TextLink,{as:"button",testId:"rating-editor-clear",onClick:()=>{n(null)}},"Clear"))))}u.defaultProps={isInitiallyDisabled:!0},exports.RatingEditor=u;
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';\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","state","hovered","isSelected","num","_this","value","props","onBlur","disabled","setState","onFocus","render","items","i","this","stars","push","React","map","IconButton","variant","size","icon","StarIcon","_this2","className","css","width","height","testId","isDisabled","key","onClick","onSelect","onKeyDown","e","keyCode","onMouseOver","onMouseLeave","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,8JACXC,MAAQ,CACNC,QAAS,QAGXC,WAAa,SAACC,OACNF,EAAUG,EAAKJ,MAAMC,QACrBI,EAAQD,EAAKE,MAAMD,aAET,OAAZJ,EACKE,GAAOF,IAEZI,GACKF,GAAOE,KAKlBE,OAAS,WACFH,EAAKE,MAAME,YACTC,SAAS,CAAER,QAAS,UAI7BS,QAAU,SAACP,UAAgB,WACpBC,EAAKE,MAAME,YACTC,SAAS,CAAER,QAASE,2GAI7BQ,OAAA,0BACQC,EAAkB,GACfC,EAAI,EAAGA,GAAKC,KAAKR,MAAMS,MAAOF,IACrCD,EAAMI,KAAKH,UAIXI,gCACGL,EAAMM,KAAI,SAACf,UACVc,gBAACE,cACCC,QAAQ,cACRC,KAAK,QACLC,KACEL,gBAACM,YACCH,QAASI,EAAKtB,WAAWC,GAAO,UAAY,QAC5CsB,UAAWC,MAAI,CAAEC,MAAO,OAAQC,OAAQ,2BAG7BJ,EAAKtB,WAAWC,GAAO,OAAS,QAC/C0B,OAAO,qBACPC,WAAYN,EAAKlB,MAAME,SACvBuB,IAAK5B,EACL6B,QAAS,WACPR,EAAKlB,MAAM2B,SAAS9B,IAEtB+B,UAAW,SAACC,GACQ,KAAdA,EAAEC,SACJZ,EAAKlB,MAAM2B,SAAS9B,IAGxBkC,YAAab,EAAKd,QAAQP,GAC1BmC,aAAcd,EAAKjB,OACnBG,QAASc,EAAKd,QAAQP,GACtBI,OAAQiB,EAAKjB,oBACDJ,EAAIoC,qBAhEMtB,aCUlC,SAASuB,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,kBAGjEnC,gBAACoC,kBACCC,SAAU,EACVV,MAAOA,EACPW,oBAAqBjD,EAAMiD,sBAC1B,gBAAG/C,IAAAA,SAAUH,IAAAA,MAAOmD,IAAAA,gBAMjBvC,gBAACwC,QAAK5B,OAAO,gBAAgB6B,cAAc,MAAMC,UAAU,YACzD1C,gBAAClB,GACCS,SAAUA,EACVH,MAAOA,EACPU,MAAO8B,EACPZ,SAAU,SAAC9B,GACTqD,EAASrD,WAGFyD,IAAVvD,IAAwBG,GACvBS,gBAACwC,QAAKI,WAAW,YACf5C,gBAAC6C,YAASC,GAAG,SAASlC,OAAO,sBAAsBG,QAhBvC,WAClBwB,EAAS,sBA2BnBb,EAAaqB,aAAe,CAC1BT,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';\n\n\nimport { IconButton } from '@contentful/f36-components';\nimport { StarIcon } from '@contentful/f36-icons';\nimport { css } from 'emotion';\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';\n\nimport { TextLink, Flex } from '@contentful/f36-components';\nimport { FieldAPI, ParametersAPI, FieldConnector } from '@contentful/field-editor-shared';\nimport get from 'lodash/get';\n\nimport { RatingRibbon } from './RatingRibbon';\n\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","React","state","hovered","isSelected","num","this","value","props","onBlur","disabled","setState","onFocus","render","items","i","stars","push","map","IconButton","variant","size","icon","StarIcon","className","css","width","height","testId","isDisabled","key","onClick","onSelect","onKeyDown","e","keyCode","onMouseOver","onMouseLeave","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":"2TAkBaA,UAAqBC,+CAChCC,MAAQ,CACNC,QAAS,WAGXC,WAAcC,UACNF,EAAUG,KAAKJ,MAAMC,QACrBI,EAAQD,KAAKE,MAAMD,aAET,OAAZJ,EACKE,GAAOF,IAEZI,GACKF,GAAOE,QAKlBE,OAAS,KACFH,KAAKE,MAAME,eACTC,SAAS,CAAER,QAAS,aAI7BS,QAAWP,GAAgB,KACpBC,KAAKE,MAAME,eACTC,SAAS,CAAER,QAASE,KAI7BQ,eACQC,EAAkB,OACnB,IAAIC,EAAI,EAAGA,GAAKT,KAAKE,MAAMQ,MAAOD,IACrCD,EAAMG,KAAKF,UAIXd,gCACGa,EAAMI,IAAKb,GACVJ,gBAACkB,cACCC,QAAQ,cACRC,KAAK,QACLC,KACErB,gBAACsB,YACCH,QAASd,KAAKF,WAAWC,GAAO,UAAY,QAC5CmB,UAAWC,MAAI,CAAEC,MAAO,OAAQC,OAAQ,2BAG7BrB,KAAKF,WAAWC,GAAO,OAAS,QAC/CuB,OAAO,qBACPC,WAAYvB,KAAKE,MAAME,SACvBoB,IAAKzB,EACL0B,QAAS,UACFvB,MAAMwB,SAAS3B,IAEtB4B,UAAYC,IACQ,KAAdA,EAAEC,cACC3B,MAAMwB,SAAS3B,IAGxB+B,YAAa9B,KAAKM,QAAQP,GAC1BgC,aAAc/B,KAAKG,OACnBG,QAASN,KAAKM,QAAQP,GACtBI,OAAQH,KAAKG,oBACDJ,EAAIiC,gBCpD5B,SAASC,EAAaC,SACI,iBAAVA,IAAuBC,MAAMD,IAAUA,EAAQ,WAgB/CE,EAAalC,SACrBmC,MAAEA,GAAUnC,EAEZoC,EAhBR,SAAsBJ,MAGhBD,EAAaC,UACRK,KAAKC,MAAMN,GACb,GAAqB,iBAAVA,EAAoB,OAC9BO,EAASC,SAASR,EAAO,WACxBD,EAAaQ,GAAUF,KAAKC,MAAMC,GANtB,SAAA,EAeFE,CAAaC,EAAI1C,EAAM2C,WAAY,CAAC,WAAY,kBAGjElD,gBAACmD,kBACCC,SAAU,EACVV,MAAOA,EACPW,oBAAqB9C,EAAM8C,qBAC1B,EAAG5C,SAAAA,EAAUH,MAAAA,EAAOgD,SAAAA,KAMjBtD,gBAACuD,QAAK5B,OAAO,gBAAgB6B,cAAc,MAAMC,UAAU,YACzDzD,gBAACD,GACCU,SAAUA,EACVH,MAAOA,EACPS,MAAO4B,EACPZ,SAAW3B,IACTkD,EAASlD,WAGFsD,IAAVpD,IAAwBG,GACvBT,gBAACuD,QAAKI,WAAW,YACf3D,gBAAC4D,YAASC,GAAG,SAASlC,OAAO,sBAAsBG,QAhBvC,KAClBwB,EAAS,oBA2BnBb,EAAaqB,aAAe,CAC1BT,qBAAqB"}
@@ -1,44 +1,20 @@
1
- import { createElement, Fragment, Component } from 'react';
2
- import get from 'lodash-es/get';
3
- import { FieldConnector } from '@contentful/field-editor-shared';
4
- import { css } from 'emotion';
1
+ import { Component, createElement, Fragment } from 'react';
5
2
  import { IconButton, Flex, TextLink } from '@contentful/f36-components';
3
+ import { FieldConnector } from '@contentful/field-editor-shared';
4
+ import get from 'lodash-es/get';
6
5
  import { StarIcon } from '@contentful/f36-icons';
6
+ import { css } from 'emotion';
7
7
 
8
- function _inheritsLoose(subClass, superClass) {
9
- subClass.prototype = Object.create(superClass.prototype);
10
- subClass.prototype.constructor = subClass;
11
-
12
- _setPrototypeOf(subClass, superClass);
13
- }
14
-
15
- function _setPrototypeOf(o, p) {
16
- _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) {
17
- o.__proto__ = p;
18
- return o;
19
- };
20
-
21
- return _setPrototypeOf(o, p);
22
- }
23
-
24
- var RatingRibbon = /*#__PURE__*/function (_React$Component) {
25
- _inheritsLoose(RatingRibbon, _React$Component);
26
-
27
- function RatingRibbon() {
28
- var _this;
29
-
30
- for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
31
- args[_key] = arguments[_key];
32
- }
33
-
34
- _this = _React$Component.call.apply(_React$Component, [this].concat(args)) || this;
35
- _this.state = {
8
+ class RatingRibbon extends Component {
9
+ constructor(...args) {
10
+ super(...args);
11
+ this.state = {
36
12
  hovered: null
37
13
  };
38
14
 
39
- _this.isSelected = function (num) {
40
- var hovered = _this.state.hovered;
41
- var value = _this.props.value;
15
+ this.isSelected = num => {
16
+ const hovered = this.state.hovered;
17
+ const value = this.props.value;
42
18
 
43
19
  if (hovered !== null) {
44
20
  return num <= hovered;
@@ -51,84 +27,73 @@ var RatingRibbon = /*#__PURE__*/function (_React$Component) {
51
27
  return false;
52
28
  };
53
29
 
54
- _this.onBlur = function () {
55
- if (!_this.props.disabled) {
56
- _this.setState({
30
+ this.onBlur = () => {
31
+ if (!this.props.disabled) {
32
+ this.setState({
57
33
  hovered: null
58
34
  });
59
35
  }
60
36
  };
61
37
 
62
- _this.onFocus = function (num) {
63
- return function () {
64
- if (!_this.props.disabled) {
65
- _this.setState({
66
- hovered: num
67
- });
68
- }
69
- };
38
+ this.onFocus = num => () => {
39
+ if (!this.props.disabled) {
40
+ this.setState({
41
+ hovered: num
42
+ });
43
+ }
70
44
  };
71
-
72
- return _this;
73
45
  }
74
46
 
75
- var _proto = RatingRibbon.prototype;
76
-
77
- _proto.render = function render() {
78
- var _this2 = this;
47
+ render() {
48
+ const items = [];
79
49
 
80
- var items = [];
81
-
82
- for (var i = 1; i <= this.props.stars; i++) {
50
+ for (let i = 1; i <= this.props.stars; i++) {
83
51
  items.push(i);
84
52
  }
85
53
 
86
- return createElement(Fragment, null, items.map(function (num) {
87
- return createElement(IconButton, {
88
- variant: "transparent",
89
- size: "small",
90
- icon: createElement(StarIcon, {
91
- variant: _this2.isSelected(num) ? 'primary' : 'muted',
92
- className: css({
93
- width: '22px',
94
- height: '22px'
95
- })
96
- }),
97
- "data-selected": _this2.isSelected(num) ? 'true' : 'false',
98
- testId: "rating-editor-star",
99
- isDisabled: _this2.props.disabled,
100
- key: num,
101
- onClick: function onClick() {
102
- _this2.props.onSelect(num);
103
- },
104
- onKeyDown: function onKeyDown(e) {
105
- if (e.keyCode === 13) {
106
- _this2.props.onSelect(num);
107
- }
108
- },
109
- onMouseOver: _this2.onFocus(num),
110
- onMouseLeave: _this2.onBlur,
111
- onFocus: _this2.onFocus(num),
112
- onBlur: _this2.onBlur,
113
- "aria-label": num.toString()
114
- });
115
- }));
116
- };
117
-
118
- return RatingRibbon;
119
- }(Component);
54
+ return createElement(Fragment, null, items.map(num => createElement(IconButton, {
55
+ variant: "transparent",
56
+ size: "small",
57
+ icon: createElement(StarIcon, {
58
+ variant: this.isSelected(num) ? 'primary' : 'muted',
59
+ className: css({
60
+ width: '22px',
61
+ height: '22px'
62
+ })
63
+ }),
64
+ "data-selected": this.isSelected(num) ? 'true' : 'false',
65
+ testId: "rating-editor-star",
66
+ isDisabled: this.props.disabled,
67
+ key: num,
68
+ onClick: () => {
69
+ this.props.onSelect(num);
70
+ },
71
+ onKeyDown: e => {
72
+ if (e.keyCode === 13) {
73
+ this.props.onSelect(num);
74
+ }
75
+ },
76
+ onMouseOver: this.onFocus(num),
77
+ onMouseLeave: this.onBlur,
78
+ onFocus: this.onFocus(num),
79
+ onBlur: this.onBlur,
80
+ "aria-label": num.toString()
81
+ })));
82
+ }
83
+
84
+ }
120
85
 
121
86
  function isValidCount(count) {
122
87
  return typeof count === 'number' && !isNaN(count) && count > 0;
123
88
  }
124
89
 
125
90
  function getStarCount(count) {
126
- var defaultValue = 5;
91
+ const defaultValue = 5;
127
92
 
128
93
  if (isValidCount(count)) {
129
94
  return Math.round(count);
130
95
  } else if (typeof count === 'string') {
131
- var parsed = parseInt(count, 10);
96
+ const parsed = parseInt(count, 10);
132
97
  return isValidCount(parsed) ? Math.round(parsed) : defaultValue;
133
98
  } else {
134
99
  return defaultValue;
@@ -136,18 +101,20 @@ function getStarCount(count) {
136
101
  }
137
102
 
138
103
  function RatingEditor(props) {
139
- var field = props.field;
140
- var starsCount = getStarCount(get(props.parameters, ['instance', 'stars']));
104
+ const {
105
+ field
106
+ } = props;
107
+ const starsCount = getStarCount(get(props.parameters, ['instance', 'stars']));
141
108
  return createElement(FieldConnector, {
142
109
  throttle: 0,
143
110
  field: field,
144
111
  isInitiallyDisabled: props.isInitiallyDisabled
145
- }, function (_ref) {
146
- var disabled = _ref.disabled,
147
- value = _ref.value,
148
- setValue = _ref.setValue;
149
-
150
- var clearOption = function clearOption() {
112
+ }, ({
113
+ disabled,
114
+ value,
115
+ setValue
116
+ }) => {
117
+ const clearOption = () => {
151
118
  setValue(null);
152
119
  };
153
120
 
@@ -159,7 +126,7 @@ function RatingEditor(props) {
159
126
  disabled: disabled,
160
127
  value: value,
161
128
  stars: starsCount,
162
- onSelect: function onSelect(num) {
129
+ onSelect: num => {
163
130
  setValue(num);
164
131
  }
165
132
  }), value !== undefined && !disabled && createElement(Flex, {
@@ -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';\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","state","hovered","isSelected","num","value","props","onBlur","disabled","setState","onFocus","render","items","i","stars","push","React","map","IconButton","variant","size","icon","StarIcon","className","css","width","height","testId","isDisabled","key","onClick","onSelect","onKeyDown","e","keyCode","onMouseOver","onMouseLeave","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
+ {"version":3,"file":"field-editor-rating.esm.js","sources":["../src/RatingRibbon.tsx","../src/RatingEditor.tsx"],"sourcesContent":["import * as React from 'react';\n\n\nimport { IconButton } from '@contentful/f36-components';\nimport { StarIcon } from '@contentful/f36-icons';\nimport { css } from 'emotion';\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';\n\nimport { TextLink, Flex } from '@contentful/f36-components';\nimport { FieldAPI, ParametersAPI, FieldConnector } from '@contentful/field-editor-shared';\nimport get from 'lodash/get';\n\nimport { RatingRibbon } from './RatingRibbon';\n\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","React","state","hovered","isSelected","num","value","props","onBlur","disabled","setState","onFocus","render","items","i","stars","push","map","IconButton","variant","size","icon","StarIcon","className","css","width","height","testId","isDisabled","key","onClick","onSelect","onKeyDown","e","keyCode","onMouseOver","onMouseLeave","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":";;;;;;;MAkBaA,qBAAqBC;;;SAChCC,QAAQ;AACNC,MAAAA,OAAO,EAAE;AADH;;SAIRC,aAAcC,GAAD;AACX,YAAMF,OAAO,GAAG,KAAKD,KAAL,CAAWC,OAA3B;AACA,YAAMG,KAAK,GAAG,KAAKC,KAAL,CAAWD,KAAzB;;AAEA,UAAIH,OAAO,KAAK,IAAhB,EAAsB;AACpB,eAAOE,GAAG,IAAIF,OAAd;AACD;;AACD,UAAIG,KAAJ,EAAW;AACT,eAAOD,GAAG,IAAIC,KAAd;AACD;;AACD,aAAO,KAAP;AACD;;SAEDE,SAAS;AACP,UAAI,CAAC,KAAKD,KAAL,CAAWE,QAAhB,EAA0B;AACxB,aAAKC,QAAL,CAAc;AAAEP,UAAAA,OAAO,EAAE;AAAX,SAAd;AACD;AACF;;SAEDQ,UAAWN,GAAD,IAAiB;AACzB,UAAI,CAAC,KAAKE,KAAL,CAAWE,QAAhB,EAA0B;AACxB,aAAKC,QAAL,CAAc;AAAEP,UAAAA,OAAO,EAAEE;AAAX,SAAd;AACD;AACF;;;AAEDO,EAAAA,MAAM;AACJ,UAAMC,KAAK,GAAa,EAAxB;;AACA,SAAK,IAAIC,CAAC,GAAG,CAAb,EAAgBA,CAAC,IAAI,KAAKP,KAAL,CAAWQ,KAAhC,EAAuCD,CAAC,EAAxC,EAA4C;AAC1CD,MAAAA,KAAK,CAACG,IAAN,CAAWF,CAAX;AACD;;AAED,WACEb,aAAA,SAAA,MAAA,EACGY,KAAK,CAACI,GAAN,CAAWZ,GAAD,IACTJ,aAAA,CAACiB,UAAD;AACEC,MAAAA,OAAO,EAAC;AACRC,MAAAA,IAAI,EAAC;AACLC,MAAAA,IAAI,EACFpB,aAAA,CAACqB,QAAD;AACEH,QAAAA,OAAO,EAAE,KAAKf,UAAL,CAAgBC,GAAhB,IAAuB,SAAvB,GAAmC;AAC5CkB,QAAAA,SAAS,EAAEC,GAAG,CAAC;AAAEC,UAAAA,KAAK,EAAE,MAAT;AAAiBC,UAAAA,MAAM,EAAE;AAAzB,SAAD;OAFhB;uBAKa,KAAKtB,UAAL,CAAgBC,GAAhB,IAAuB,MAAvB,GAAgC;AAC/CsB,MAAAA,MAAM,EAAC;AACPC,MAAAA,UAAU,EAAE,KAAKrB,KAAL,CAAWE;AACvBoB,MAAAA,GAAG,EAAExB;AACLyB,MAAAA,OAAO,EAAE;AACP,aAAKvB,KAAL,CAAWwB,QAAX,CAAoB1B,GAApB;AACD;AACD2B,MAAAA,SAAS,EAAGC,CAAD;AACT,YAAIA,CAAC,CAACC,OAAF,KAAc,EAAlB,EAAsB;AACpB,eAAK3B,KAAL,CAAWwB,QAAX,CAAoB1B,GAApB;AACD;AACF;AACD8B,MAAAA,WAAW,EAAE,KAAKxB,OAAL,CAAaN,GAAb;AACb+B,MAAAA,YAAY,EAAE,KAAK5B;AACnBG,MAAAA,OAAO,EAAE,KAAKA,OAAL,CAAaN,GAAb;AACTG,MAAAA,MAAM,EAAE,KAAKA;oBACDH,GAAG,CAACgC,QAAJ;KAzBd,CADD,CADH,CADF;AAiCD;;;;ACzDH,SAASC,YAAT,CAAsBC,KAAtB;AACE,SAAO,OAAOA,KAAP,KAAiB,QAAjB,IAA6B,CAACC,KAAK,CAACD,KAAD,CAAnC,IAA8CA,KAAK,GAAG,CAA7D;AACD;;AAED,SAASE,YAAT,CAAsBF,KAAtB;AACE,QAAMG,YAAY,GAAG,CAArB;;AAEA,MAAIJ,YAAY,CAACC,KAAD,CAAhB,EAAyB;AACvB,WAAOI,IAAI,CAACC,KAAL,CAAWL,KAAX,CAAP;AACD,GAFD,MAEO,IAAI,OAAOA,KAAP,KAAiB,QAArB,EAA+B;AACpC,UAAMM,MAAM,GAAGC,QAAQ,CAACP,KAAD,EAAQ,EAAR,CAAvB;AACA,WAAOD,YAAY,CAACO,MAAD,CAAZ,GAAuBF,IAAI,CAACC,KAAL,CAAWC,MAAX,CAAvB,GAA4CH,YAAnD;AACD,GAHM,MAGA;AACL,WAAOA,YAAP;AACD;AACF;;AAED,SAAgBK,aAAaxC;AAC3B,QAAM;AAAEyC,IAAAA;AAAF,MAAYzC,KAAlB;AAEA,QAAM0C,UAAU,GAAGR,YAAY,CAACS,GAAG,CAAC3C,KAAK,CAAC4C,UAAP,EAAmB,CAAC,UAAD,EAAa,OAAb,CAAnB,CAAJ,CAA/B;AAEA,SACElD,aAAA,CAACmD,cAAD;AACEC,IAAAA,QAAQ,EAAE;AACVL,IAAAA,KAAK,EAAEA;AACPM,IAAAA,mBAAmB,EAAE/C,KAAK,CAAC+C;GAH7B,EAIG,CAAC;AAAE7C,IAAAA,QAAF;AAAYH,IAAAA,KAAZ;AAAmBiD,IAAAA;AAAnB,GAAD;AACC,UAAMC,WAAW,GAAG;AAClBD,MAAAA,QAAQ,CAAC,IAAD,CAAR;AACD,KAFD;;AAIA,WACEtD,aAAA,CAACwD,IAAD;AAAM9B,MAAAA,MAAM,EAAC;AAAgB+B,MAAAA,aAAa,EAAC;AAAMC,MAAAA,SAAS,EAAC;KAA3D,EACE1D,aAAA,CAACD,YAAD;AACES,MAAAA,QAAQ,EAAEA;AACVH,MAAAA,KAAK,EAAEA;AACPS,MAAAA,KAAK,EAAEkC;AACPlB,MAAAA,QAAQ,EAAG1B,GAAD;AACRkD,QAAAA,QAAQ,CAAClD,GAAD,CAAR;AACD;KANH,CADF,EASGC,KAAK,KAAKsD,SAAV,IAAuB,CAACnD,QAAxB,IACCR,aAAA,CAACwD,IAAD;AAAMI,MAAAA,UAAU,EAAC;KAAjB,EACE5D,aAAA,CAAC6D,QAAD;AAAUC,MAAAA,EAAE,EAAC;AAASpC,MAAAA,MAAM,EAAC;AAAsBG,MAAAA,OAAO,EAAE0B;KAA5D,SAAA,CADF,CAVJ,CADF;AAmBD,GA5BH,CADF;AAgCD;AAEDT,YAAY,CAACiB,YAAb,GAA4B;AAC1BV,EAAAA,mBAAmB,EAAE;AADK,CAA5B;;;;"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@contentful/field-editor-rating",
3
- "version": "1.1.11",
3
+ "version": "1.2.0",
4
4
  "main": "dist/index.js",
5
5
  "module": "dist/field-editor-rating.esm.js",
6
6
  "typings": "dist/index.d.ts",
@@ -23,16 +23,16 @@
23
23
  "dependencies": {
24
24
  "@contentful/f36-components": "^4.0.27",
25
25
  "@contentful/f36-tokens": "^4.0.0",
26
- "@contentful/field-editor-shared": "^1.1.8",
26
+ "@contentful/field-editor-shared": "^1.2.0",
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": "^1.2.7"
32
+ "@contentful/field-editor-test-utils": "^1.3.0"
33
33
  },
34
34
  "peerDependencies": {
35
35
  "react": ">=16.8.0"
36
36
  },
37
- "gitHead": "4fff7b9534374dcc44cb477240d369fc34f46415"
37
+ "gitHead": "de7e74e3485dd69c240cfe9c545e6e50e41fb295"
38
38
  }