@citygross/components 0.13.1 → 0.13.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,3 +1,3 @@
1
1
  /// <reference types="react" />
2
2
  import { TQuantitySelector } from './QuantitySelector.types';
3
- export declare const QuantitySelector: ({ maxQuantity, onAdd, onBlur, onChange, onSubtract, productId, productName, quantity, size }: TQuantitySelector) => JSX.Element;
3
+ export declare const QuantitySelector: ({ id, maxQuantity, onAdd, onBlur, onChange, onSubtract, productName, quantity, size }: TQuantitySelector) => JSX.Element;
@@ -5,12 +5,12 @@ export declare enum EQuantitySelectorSize {
5
5
  large = "large"
6
6
  }
7
7
  export declare type TQuantitySelector = {
8
+ id: string;
8
9
  maxQuantity: number;
9
10
  onAdd: () => void;
10
11
  onBlur: () => void;
11
12
  onChange: (e: React.ChangeEvent<HTMLInputElement>) => void;
12
13
  onSubtract: () => void;
13
- productId: string;
14
14
  productName?: string;
15
15
  quantity: number;
16
16
  size?: EQuantitySelectorSize;
@@ -15,7 +15,7 @@ var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
15
15
 
16
16
  var QuantitySelector = function (_a) {
17
17
  var _b, _c, _d, _e;
18
- var maxQuantity = _a.maxQuantity, onAdd = _a.onAdd, onBlur = _a.onBlur, onChange = _a.onChange, onSubtract = _a.onSubtract, productId = _a.productId, productName = _a.productName, quantity = _a.quantity, _f = _a.size, size = _f === void 0 ? QuantitySelector_types.EQuantitySelectorSize.large : _f;
18
+ var id = _a.id, maxQuantity = _a.maxQuantity, onAdd = _a.onAdd, onBlur = _a.onBlur, onChange = _a.onChange, onSubtract = _a.onSubtract, productName = _a.productName, quantity = _a.quantity, _f = _a.size, size = _f === void 0 ? QuantitySelector_types.EQuantitySelectorSize.large : _f;
19
19
  var _g = React.useState(false), isFocused = _g[0], setIsFocused = _g[1];
20
20
  var disabledAdd = quantity >= maxQuantity;
21
21
  var disabledSubtract = quantity <= 0;
@@ -37,7 +37,7 @@ var QuantitySelector = function (_a) {
37
37
  React__default["default"].createElement(QuantitySelector_styles.Label, null,
38
38
  React__default["default"].createElement(ScreenReader.ScreenReader, { string: "Ange antal" }),
39
39
  quantity === maxQuantity && !isFocused && (React__default["default"].createElement("span", { "aria-label": "Max antal ".concat(maxQuantity), "aria-live": "polite", role: "status" }, "Max")),
40
- React__default["default"].createElement(QuantitySelector_styles.Input, { id: "quantity-input-".concat(productId), inputMode: "numeric", isMaxQuantity: quantity === maxQuantity && !isFocused, max: maxQuantity, min: 0, onBlur: handleBlur, onChange: function (e) { return onChange(e); }, onFocus: function () { return setIsFocused(true); }, onKeyDown: handleKeyDown, pattern: "[0-9]*", type: "number", value: quantity })),
40
+ React__default["default"].createElement(QuantitySelector_styles.Input, { id: id, inputMode: "numeric", isMaxQuantity: quantity === maxQuantity && !isFocused, max: maxQuantity, min: 0, onBlur: handleBlur, onChange: function (e) { return onChange(e); }, onFocus: function () { return setIsFocused(true); }, onKeyDown: handleKeyDown, pattern: "[0-9]*", type: "number", value: quantity })),
41
41
  React__default["default"].createElement(QuantitySelector_styles.StepButton, { "aria-label": "\u00D6ka antal ".concat(productName || ''), direction: "add", disabled: disabledAdd, onClick: onAdd },
42
42
  React__default["default"].createElement(icons.Icons.Plus, { color: disabledAdd ? (_d = designTokens.theme.palette) === null || _d === void 0 ? void 0 : _d.placeholder : (_e = designTokens.theme.palette) === null || _e === void 0 ? void 0 : _e.darkest, height: 16, width: 16 }))));
43
43
  };
@@ -7,7 +7,7 @@ import { ScreenReader } from '../ScreenReader/ScreenReader.js';
7
7
 
8
8
  var QuantitySelector = function (_a) {
9
9
  var _b, _c, _d, _e;
10
- var maxQuantity = _a.maxQuantity, onAdd = _a.onAdd, onBlur = _a.onBlur, onChange = _a.onChange, onSubtract = _a.onSubtract, productId = _a.productId, productName = _a.productName, quantity = _a.quantity, _f = _a.size, size = _f === void 0 ? EQuantitySelectorSize.large : _f;
10
+ var id = _a.id, maxQuantity = _a.maxQuantity, onAdd = _a.onAdd, onBlur = _a.onBlur, onChange = _a.onChange, onSubtract = _a.onSubtract, productName = _a.productName, quantity = _a.quantity, _f = _a.size, size = _f === void 0 ? EQuantitySelectorSize.large : _f;
11
11
  var _g = useState(false), isFocused = _g[0], setIsFocused = _g[1];
12
12
  var disabledAdd = quantity >= maxQuantity;
13
13
  var disabledSubtract = quantity <= 0;
@@ -29,7 +29,7 @@ var QuantitySelector = function (_a) {
29
29
  React.createElement(Label, null,
30
30
  React.createElement(ScreenReader, { string: "Ange antal" }),
31
31
  quantity === maxQuantity && !isFocused && (React.createElement("span", { "aria-label": "Max antal ".concat(maxQuantity), "aria-live": "polite", role: "status" }, "Max")),
32
- React.createElement(Input, { id: "quantity-input-".concat(productId), inputMode: "numeric", isMaxQuantity: quantity === maxQuantity && !isFocused, max: maxQuantity, min: 0, onBlur: handleBlur, onChange: function (e) { return onChange(e); }, onFocus: function () { return setIsFocused(true); }, onKeyDown: handleKeyDown, pattern: "[0-9]*", type: "number", value: quantity })),
32
+ React.createElement(Input, { id: id, inputMode: "numeric", isMaxQuantity: quantity === maxQuantity && !isFocused, max: maxQuantity, min: 0, onBlur: handleBlur, onChange: function (e) { return onChange(e); }, onFocus: function () { return setIsFocused(true); }, onKeyDown: handleKeyDown, pattern: "[0-9]*", type: "number", value: quantity })),
33
33
  React.createElement(StepButton, { "aria-label": "\u00D6ka antal ".concat(productName || ''), direction: "add", disabled: disabledAdd, onClick: onAdd },
34
34
  React.createElement(Icons.Plus, { color: disabledAdd ? (_d = theme.palette) === null || _d === void 0 ? void 0 : _d.placeholder : (_e = theme.palette) === null || _e === void 0 ? void 0 : _e.darkest, height: 16, width: 16 }))));
35
35
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@citygross/components",
3
- "version": "0.13.1",
3
+ "version": "0.13.2",
4
4
  "license": "ISC",
5
5
  "sideEffects": false,
6
6
  "main": "./build/cjs/components/src/index.js",
@@ -75,5 +75,5 @@
75
75
  "react-slick": "^0.30.1",
76
76
  "slick-carousel": "^1.8.1"
77
77
  },
78
- "gitHead": "81e9038ba3f6c7f485f556dd2db33a4dce1361d6"
78
+ "gitHead": "12b1de146c65f7cb6c8fd1db47e283494d15b1ef"
79
79
  }