@pingux/astro 2.14.1-alpha.2 → 2.14.1-alpha.3

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.
@@ -15,7 +15,6 @@ _Object$defineProperty(exports, "__esModule", {
15
15
  value: true
16
16
  });
17
17
  exports["default"] = void 0;
18
- var _trim = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/trim"));
19
18
  var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/extends"));
20
19
  var _defineProperty2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/defineProperty"));
21
20
  var _react = _interopRequireWildcard(require("react"));
@@ -29,7 +28,6 @@ var _propTypes = _interopRequireDefault(require("prop-types"));
29
28
  var _uuid = require("uuid");
30
29
  var _ = require("../..");
31
30
  var _hooks = require("../../hooks");
32
- var _useHiddenNumberFieldValue = _interopRequireDefault(require("../../hooks/useHiddenNumberFieldValue"));
33
31
  var _ariaAttributes = require("../../utils/docUtils/ariaAttributes");
34
32
  var _fieldAttributes = require("../../utils/docUtils/fieldAttributes");
35
33
  var _statusProp = require("../../utils/docUtils/statusProp");
@@ -37,11 +35,10 @@ var _react2 = require("@emotion/react");
37
35
  function _getRequireWildcardCache(nodeInterop) { if (typeof _WeakMap !== "function") return null; var cacheBabelInterop = new _WeakMap(); var cacheNodeInterop = new _WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
38
36
  function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = _Object$defineProperty && _Object$getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? _Object$getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { _Object$defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
39
37
  function ownKeys(object, enumerableOnly) { var keys = _Object$keys(object); if (_Object$getOwnPropertySymbols) { var symbols = _Object$getOwnPropertySymbols(object); enumerableOnly && (symbols = _filterInstanceProperty(symbols).call(symbols, function (sym) { return _Object$getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
40
- function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var _context2, _context3; var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? _forEachInstanceProperty(_context2 = ownKeys(Object(source), !0)).call(_context2, function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(target, _Object$getOwnPropertyDescriptors(source)) : _forEachInstanceProperty(_context3 = ownKeys(Object(source))).call(_context3, function (key) { _Object$defineProperty(target, key, _Object$getOwnPropertyDescriptor(source, key)); }); } return target; }
38
+ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var _context, _context2; var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? _forEachInstanceProperty(_context = ownKeys(Object(source), !0)).call(_context, function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(target, _Object$getOwnPropertyDescriptors(source)) : _forEachInstanceProperty(_context2 = ownKeys(Object(source))).call(_context2, function (key) { _Object$defineProperty(target, key, _Object$getOwnPropertyDescriptor(source, key)); }); } return target; }
41
39
  var NumberField = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
42
40
  var helperText = props.helperText,
43
- status = props.status,
44
- formatOptions = props.formatOptions;
41
+ status = props.status;
45
42
  var _useLocale = (0, _i18n.useLocale)(),
46
43
  locale = _useLocale.locale;
47
44
  var state = (0, _reactStately.useNumberFieldState)(_objectSpread(_objectSpread({}, props), {}, {
@@ -92,66 +89,40 @@ var NumberField = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
92
89
 
93
90
  // this needed to remove console warning in React 16
94
91
  // I believe once we update to 17 - we can remove this
95
- var onInputFocus = (0, _react.useCallback)(function (e) {
92
+ var onInputFocus = function onInputFocus(e) {
96
93
  e.persist();
97
94
  fieldControlInputProps.onFocus(e);
98
95
  inputProps.onFocus(e);
99
- }, [fieldControlInputProps, inputProps]);
100
- var onInputBlur = (0, _react.useCallback)(function (e) {
96
+ };
97
+ var onInputBlur = function onInputBlur(e) {
101
98
  e.persist();
102
99
  fieldControlInputProps.onBlur(e);
103
100
  inputProps.onBlur(e);
104
- }, [fieldControlInputProps, inputProps]);
105
- var updatedFieldControlInputProps = (0, _react.useMemo)(function () {
106
- return _objectSpread(_objectSpread({}, fieldControlInputProps), {}, {
107
- onFocus: onInputFocus,
108
- onBlur: onInputBlur
109
- });
110
- }, [fieldControlInputProps, onInputBlur, onInputFocus]);
111
- var onInputChange = function onInputChange(e) {
112
- var _context;
113
- var minValue = props.minValue;
114
- var trimmedInputValue = (0, _trim["default"])(_context = e.target.value).call(_context);
115
- var trimmedValueEvent = _objectSpread(_objectSpread({}, e), {}, {
116
- target: _objectSpread(_objectSpread({}, e.target), {}, {
117
- value: trimmedInputValue
118
- })
119
- });
120
- if (!trimmedInputValue && typeof minValue !== 'undefined') {
121
- var minValueEvent = _objectSpread(_objectSpread({}, e), {}, {
122
- target: _objectSpread(_objectSpread({}, e.target), {}, {
123
- value: minValue.toString()
124
- })
125
- });
126
- inputProps.onChange(minValueEvent);
127
- } else {
128
- inputProps.onChange(trimmedValueEvent);
129
- }
130
101
  };
131
- var hiddenInputValue = (0, _useHiddenNumberFieldValue["default"])({
132
- numberValue: state.numberValue,
133
- isCurrency: formatOptions === null || formatOptions === void 0 ? void 0 : formatOptions.currency
102
+ var updatedFieldControlInputProps = _objectSpread(_objectSpread({}, fieldControlInputProps), {}, {
103
+ onFocus: onInputFocus,
104
+ onBlur: onInputBlur
134
105
  });
135
- inputProps['aria-roledescription'] = null;
136
- var helperTextId = (0, _react.useMemo)(function () {
137
- return (0, _uuid.v4)();
138
- }, []);
139
- return (0, _react2.jsx)(_.Box, fieldContainerProps, (0, _react2.jsx)(_.Label, (0, _reactAria.mergeProps)(fieldLabelProps, labelProps)), (0, _react2.jsx)(_.Box, (0, _extends2["default"])({
106
+ var helperTextId = (0, _uuid.v4)();
107
+ var updatedLabelProps = _objectSpread({}, (0, _reactAria.mergeProps)(fieldLabelProps, labelProps));
108
+ var inputPropsValue = inputProps.value || 0;
109
+ return (0, _react2.jsx)(_.Box, fieldContainerProps, (0, _react2.jsx)(_.Label, updatedLabelProps), (0, _react2.jsx)(_.Box, (0, _extends2["default"])({
140
110
  variant: "forms.numberField.noDefaultArrows"
141
111
  }, groupProps), (0, _react2.jsx)(_.Box, (0, _extends2["default"])({
142
112
  variant: "forms.numberField.arrowsWrapper"
143
- }, fieldControlWrapperProps), (0, _react2.jsx)(_.Input, (0, _extends2["default"])({
113
+ }, fieldControlWrapperProps, {
114
+ role: "spinbutton",
115
+ "aria-valuetext": inputPropsValue,
116
+ "aria-valuenow": inputPropsValue,
117
+ "aria-labelledby": updatedLabelProps.id
118
+ }), (0, _react2.jsx)(_.Input, (0, _extends2["default"])({
144
119
  variant: "forms.input.numberField",
145
120
  ref: inputRef
146
121
  // we don't want to merge this props, we want to
147
122
  // overwrite them like defaultValue, value, ect.
148
- }, updatedFieldControlInputProps, (0, _omit["default"])(inputProps, ['name', 'onFocus', 'onBlur']), {
149
- onChange: onInputChange,
150
- "aria-describedby": helperText && helperTextId,
151
- role: "textbox"
152
- })), ControlArrows), (0, _react2.jsx)(_reactAria.VisuallyHidden, {
153
- "aria-live": "assertive"
154
- }, hiddenInputValue), helperText && (0, _react2.jsx)(_.FieldHelperText, {
123
+ }, updatedFieldControlInputProps, (0, _omit["default"])(inputProps, ['name', 'onFocus', 'onBlur', 'aria-roledescription']), {
124
+ "aria-describedby": helperText && helperTextId
125
+ })), ControlArrows), helperText && (0, _react2.jsx)(_.FieldHelperText, {
155
126
  status: status,
156
127
  id: helperTextId
157
128
  }, helperText)));
@@ -41,7 +41,7 @@ var getComponent = function getComponent() {
41
41
  });
42
42
  test('renders NumberField component', function () {
43
43
  getComponent();
44
- expect(_testWrapper.screen.getByLabelText(testLabel)).toBeInTheDocument();
44
+ expect(_testWrapper.screen.queryAllByLabelText(testLabel)[0]).toBeInTheDocument();
45
45
  });
46
46
  test('arrow up is adding step to the number value', function () {
47
47
  var mockOnChange = jest.fn();
@@ -68,7 +68,7 @@ test('value can be set from outside (controlled state)', function () {
68
68
  getComponent({
69
69
  value: controlledValue
70
70
  });
71
- expect(_testWrapper.screen.getByLabelText(testLabel)).toHaveValue('11');
71
+ expect(_testWrapper.screen.queryAllByLabelText(testLabel)[1]).toHaveValue('11');
72
72
  });
73
73
  test('calling onChange with integer when input value changed (controlled state)', function () {
74
74
  var mockOnChange = jest.fn();
@@ -76,7 +76,7 @@ test('calling onChange with integer when input value changed (controlled state)'
76
76
  getComponent({
77
77
  onChange: mockOnChange
78
78
  });
79
- var numberInput = _testWrapper.screen.getByLabelText(testLabel);
79
+ var numberInput = _testWrapper.screen.queryAllByLabelText(testLabel)[1];
80
80
  _userEvent["default"].clear(numberInput);
81
81
  _userEvent["default"].type(numberInput, newTestValue.toString());
82
82
  numberInput.blur();
@@ -101,12 +101,12 @@ test('should show helper text if appropriate prop passed', function () {
101
101
  test('should be able to be focused via keyboard', function () {
102
102
  getComponent();
103
103
  _userEvent["default"].tab();
104
- expect(_testWrapper.screen.getByLabelText(testLabel)).toHaveFocus();
104
+ expect(_testWrapper.screen.queryAllByLabelText(testLabel)[1]).toHaveFocus();
105
105
  });
106
106
  test('should be able to interact with the keyboard', function () {
107
107
  getComponent();
108
108
  _userEvent["default"].tab();
109
- var numberInput = _testWrapper.screen.getByLabelText(testLabel);
109
+ var numberInput = _testWrapper.screen.queryAllByLabelText(testLabel)[1];
110
110
  _userEvent["default"].type(numberInput, '{arrowup}');
111
111
  expect(numberInput).toHaveValue((testValue + 1).toString());
112
112
  _userEvent["default"].type(numberInput, '{arrowdown}{arrowdown}');
@@ -125,7 +125,7 @@ test('should show hintText text if prop is passed', function () {
125
125
  test('increment and decrement buttons should be able to be focused via keyboard', function () {
126
126
  getComponent();
127
127
  _userEvent["default"].tab();
128
- expect(_testWrapper.screen.getByLabelText(testLabel)).toHaveFocus();
128
+ expect(_testWrapper.screen.queryAllByLabelText(testLabel)[1]).toHaveFocus();
129
129
  _userEvent["default"].tab();
130
130
  expect(_testWrapper.screen.getByLabelText('arrow-up')).toHaveFocus();
131
131
  _userEvent["default"].tab();
@@ -136,12 +136,12 @@ test('number field input receiving name attribute', function () {
136
136
  getComponent({
137
137
  name: testName
138
138
  });
139
- expect(_testWrapper.screen.getByLabelText(testLabel)).toHaveAttribute('name', testName);
139
+ expect(_testWrapper.screen.queryAllByLabelText(testLabel)[1]).toHaveAttribute('name', testName);
140
140
  });
141
141
  test('number field can be focused', function () {
142
142
  getComponent();
143
143
  _userEvent["default"].tab();
144
- expect(_testWrapper.screen.getByLabelText(testLabel)).toHaveClass('is-focused');
144
+ expect(_testWrapper.screen.queryAllByLabelText(testLabel)[1]).toHaveClass('is-focused');
145
145
  });
146
146
  test('passing helper text should display it and correct aria attributes on input', function () {
147
147
  var testHelperText = 'testHelperText';
@@ -8,11 +8,10 @@ import _Object$defineProperties from "@babel/runtime-corejs3/core-js-stable/obje
8
8
  import _Object$defineProperty from "@babel/runtime-corejs3/core-js-stable/object/define-property";
9
9
  import _extends from "@babel/runtime-corejs3/helpers/esm/extends";
10
10
  import _defineProperty from "@babel/runtime-corejs3/helpers/esm/defineProperty";
11
- import _trimInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/trim";
12
11
  function ownKeys(object, enumerableOnly) { var keys = _Object$keys(object); if (_Object$getOwnPropertySymbols) { var symbols = _Object$getOwnPropertySymbols(object); enumerableOnly && (symbols = _filterInstanceProperty(symbols).call(symbols, function (sym) { return _Object$getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
13
- function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var _context2, _context3; var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? _forEachInstanceProperty(_context2 = ownKeys(Object(source), !0)).call(_context2, function (key) { _defineProperty(target, key, source[key]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(target, _Object$getOwnPropertyDescriptors(source)) : _forEachInstanceProperty(_context3 = ownKeys(Object(source))).call(_context3, function (key) { _Object$defineProperty(target, key, _Object$getOwnPropertyDescriptor(source, key)); }); } return target; }
14
- import React, { forwardRef, useCallback, useImperativeHandle, useMemo } from 'react';
15
- import { mergeProps, useNumberField, VisuallyHidden } from 'react-aria';
12
+ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var _context, _context2; var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? _forEachInstanceProperty(_context = ownKeys(Object(source), !0)).call(_context, function (key) { _defineProperty(target, key, source[key]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(target, _Object$getOwnPropertyDescriptors(source)) : _forEachInstanceProperty(_context2 = ownKeys(Object(source))).call(_context2, function (key) { _Object$defineProperty(target, key, _Object$getOwnPropertyDescriptor(source, key)); }); } return target; }
13
+ import React, { forwardRef, useImperativeHandle } from 'react';
14
+ import { mergeProps, useNumberField } from 'react-aria';
16
15
  import { useNumberFieldState } from 'react-stately';
17
16
  import MenuDown from '@pingux/mdi-react/MenuDownIcon';
18
17
  import MenuUp from '@pingux/mdi-react/MenuUpIcon';
@@ -22,15 +21,13 @@ import PropTypes from 'prop-types';
22
21
  import { v4 as uuid } from 'uuid';
23
22
  import { Box, FieldHelperText, Icon, IconButton, Input, Label } from '../..';
24
23
  import { useField, usePropWarning } from '../../hooks';
25
- import useHiddenNumberFieldValue from '../../hooks/useHiddenNumberFieldValue';
26
24
  import { ariaAttributesBasePropTypes } from '../../utils/docUtils/ariaAttributes';
27
25
  import { inputFieldAttributesBasePropTypes } from '../../utils/docUtils/fieldAttributes';
28
26
  import { statusPropTypes } from '../../utils/docUtils/statusProp';
29
27
  import { jsx as ___EmotionJSX } from "@emotion/react";
30
28
  var NumberField = /*#__PURE__*/forwardRef(function (props, ref) {
31
29
  var helperText = props.helperText,
32
- status = props.status,
33
- formatOptions = props.formatOptions;
30
+ status = props.status;
34
31
  var _useLocale = useLocale(),
35
32
  locale = _useLocale.locale;
36
33
  var state = useNumberFieldState(_objectSpread(_objectSpread({}, props), {}, {
@@ -81,66 +78,40 @@ var NumberField = /*#__PURE__*/forwardRef(function (props, ref) {
81
78
 
82
79
  // this needed to remove console warning in React 16
83
80
  // I believe once we update to 17 - we can remove this
84
- var onInputFocus = useCallback(function (e) {
81
+ var onInputFocus = function onInputFocus(e) {
85
82
  e.persist();
86
83
  fieldControlInputProps.onFocus(e);
87
84
  inputProps.onFocus(e);
88
- }, [fieldControlInputProps, inputProps]);
89
- var onInputBlur = useCallback(function (e) {
85
+ };
86
+ var onInputBlur = function onInputBlur(e) {
90
87
  e.persist();
91
88
  fieldControlInputProps.onBlur(e);
92
89
  inputProps.onBlur(e);
93
- }, [fieldControlInputProps, inputProps]);
94
- var updatedFieldControlInputProps = useMemo(function () {
95
- return _objectSpread(_objectSpread({}, fieldControlInputProps), {}, {
96
- onFocus: onInputFocus,
97
- onBlur: onInputBlur
98
- });
99
- }, [fieldControlInputProps, onInputBlur, onInputFocus]);
100
- var onInputChange = function onInputChange(e) {
101
- var _context;
102
- var minValue = props.minValue;
103
- var trimmedInputValue = _trimInstanceProperty(_context = e.target.value).call(_context);
104
- var trimmedValueEvent = _objectSpread(_objectSpread({}, e), {}, {
105
- target: _objectSpread(_objectSpread({}, e.target), {}, {
106
- value: trimmedInputValue
107
- })
108
- });
109
- if (!trimmedInputValue && typeof minValue !== 'undefined') {
110
- var minValueEvent = _objectSpread(_objectSpread({}, e), {}, {
111
- target: _objectSpread(_objectSpread({}, e.target), {}, {
112
- value: minValue.toString()
113
- })
114
- });
115
- inputProps.onChange(minValueEvent);
116
- } else {
117
- inputProps.onChange(trimmedValueEvent);
118
- }
119
90
  };
120
- var hiddenInputValue = useHiddenNumberFieldValue({
121
- numberValue: state.numberValue,
122
- isCurrency: formatOptions === null || formatOptions === void 0 ? void 0 : formatOptions.currency
91
+ var updatedFieldControlInputProps = _objectSpread(_objectSpread({}, fieldControlInputProps), {}, {
92
+ onFocus: onInputFocus,
93
+ onBlur: onInputBlur
123
94
  });
124
- inputProps['aria-roledescription'] = null;
125
- var helperTextId = useMemo(function () {
126
- return uuid();
127
- }, []);
128
- return ___EmotionJSX(Box, fieldContainerProps, ___EmotionJSX(Label, mergeProps(fieldLabelProps, labelProps)), ___EmotionJSX(Box, _extends({
95
+ var helperTextId = uuid();
96
+ var updatedLabelProps = _objectSpread({}, mergeProps(fieldLabelProps, labelProps));
97
+ var inputPropsValue = inputProps.value || 0;
98
+ return ___EmotionJSX(Box, fieldContainerProps, ___EmotionJSX(Label, updatedLabelProps), ___EmotionJSX(Box, _extends({
129
99
  variant: "forms.numberField.noDefaultArrows"
130
100
  }, groupProps), ___EmotionJSX(Box, _extends({
131
101
  variant: "forms.numberField.arrowsWrapper"
132
- }, fieldControlWrapperProps), ___EmotionJSX(Input, _extends({
102
+ }, fieldControlWrapperProps, {
103
+ role: "spinbutton",
104
+ "aria-valuetext": inputPropsValue,
105
+ "aria-valuenow": inputPropsValue,
106
+ "aria-labelledby": updatedLabelProps.id
107
+ }), ___EmotionJSX(Input, _extends({
133
108
  variant: "forms.input.numberField",
134
109
  ref: inputRef
135
110
  // we don't want to merge this props, we want to
136
111
  // overwrite them like defaultValue, value, ect.
137
- }, updatedFieldControlInputProps, omit(inputProps, ['name', 'onFocus', 'onBlur']), {
138
- onChange: onInputChange,
139
- "aria-describedby": helperText && helperTextId,
140
- role: "textbox"
141
- })), ControlArrows), ___EmotionJSX(VisuallyHidden, {
142
- "aria-live": "assertive"
143
- }, hiddenInputValue), helperText && ___EmotionJSX(FieldHelperText, {
112
+ }, updatedFieldControlInputProps, omit(inputProps, ['name', 'onFocus', 'onBlur', 'aria-roledescription']), {
113
+ "aria-describedby": helperText && helperTextId
114
+ })), ControlArrows), helperText && ___EmotionJSX(FieldHelperText, {
144
115
  status: status,
145
116
  id: helperTextId
146
117
  }, helperText)));
@@ -38,7 +38,7 @@ axeTest(getComponent, {
38
38
  });
39
39
  test('renders NumberField component', function () {
40
40
  getComponent();
41
- expect(screen.getByLabelText(testLabel)).toBeInTheDocument();
41
+ expect(screen.queryAllByLabelText(testLabel)[0]).toBeInTheDocument();
42
42
  });
43
43
  test('arrow up is adding step to the number value', function () {
44
44
  var mockOnChange = jest.fn();
@@ -65,7 +65,7 @@ test('value can be set from outside (controlled state)', function () {
65
65
  getComponent({
66
66
  value: controlledValue
67
67
  });
68
- expect(screen.getByLabelText(testLabel)).toHaveValue('11');
68
+ expect(screen.queryAllByLabelText(testLabel)[1]).toHaveValue('11');
69
69
  });
70
70
  test('calling onChange with integer when input value changed (controlled state)', function () {
71
71
  var mockOnChange = jest.fn();
@@ -73,7 +73,7 @@ test('calling onChange with integer when input value changed (controlled state)'
73
73
  getComponent({
74
74
  onChange: mockOnChange
75
75
  });
76
- var numberInput = screen.getByLabelText(testLabel);
76
+ var numberInput = screen.queryAllByLabelText(testLabel)[1];
77
77
  userEvent.clear(numberInput);
78
78
  userEvent.type(numberInput, newTestValue.toString());
79
79
  numberInput.blur();
@@ -98,12 +98,12 @@ test('should show helper text if appropriate prop passed', function () {
98
98
  test('should be able to be focused via keyboard', function () {
99
99
  getComponent();
100
100
  userEvent.tab();
101
- expect(screen.getByLabelText(testLabel)).toHaveFocus();
101
+ expect(screen.queryAllByLabelText(testLabel)[1]).toHaveFocus();
102
102
  });
103
103
  test('should be able to interact with the keyboard', function () {
104
104
  getComponent();
105
105
  userEvent.tab();
106
- var numberInput = screen.getByLabelText(testLabel);
106
+ var numberInput = screen.queryAllByLabelText(testLabel)[1];
107
107
  userEvent.type(numberInput, '{arrowup}');
108
108
  expect(numberInput).toHaveValue((testValue + 1).toString());
109
109
  userEvent.type(numberInput, '{arrowdown}{arrowdown}');
@@ -122,7 +122,7 @@ test('should show hintText text if prop is passed', function () {
122
122
  test('increment and decrement buttons should be able to be focused via keyboard', function () {
123
123
  getComponent();
124
124
  userEvent.tab();
125
- expect(screen.getByLabelText(testLabel)).toHaveFocus();
125
+ expect(screen.queryAllByLabelText(testLabel)[1]).toHaveFocus();
126
126
  userEvent.tab();
127
127
  expect(screen.getByLabelText('arrow-up')).toHaveFocus();
128
128
  userEvent.tab();
@@ -133,12 +133,12 @@ test('number field input receiving name attribute', function () {
133
133
  getComponent({
134
134
  name: testName
135
135
  });
136
- expect(screen.getByLabelText(testLabel)).toHaveAttribute('name', testName);
136
+ expect(screen.queryAllByLabelText(testLabel)[1]).toHaveAttribute('name', testName);
137
137
  });
138
138
  test('number field can be focused', function () {
139
139
  getComponent();
140
140
  userEvent.tab();
141
- expect(screen.getByLabelText(testLabel)).toHaveClass('is-focused');
141
+ expect(screen.queryAllByLabelText(testLabel)[1]).toHaveClass('is-focused');
142
142
  });
143
143
  test('passing helper text should display it and correct aria attributes on input', function () {
144
144
  var testHelperText = 'testHelperText';
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@pingux/astro",
3
- "version": "2.14.1-alpha.2",
3
+ "version": "2.14.1-alpha.3",
4
4
  "description": "React component library for Ping Identity's design system",
5
5
  "repository": {
6
6
  "type": "git",
@@ -1,14 +0,0 @@
1
- "use strict";
2
-
3
- var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
4
- var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
5
- _Object$defineProperty(exports, "__esModule", {
6
- value: true
7
- });
8
- _Object$defineProperty(exports, "default", {
9
- enumerable: true,
10
- get: function get() {
11
- return _useHiddenNumberFieldValue["default"];
12
- }
13
- });
14
- var _useHiddenNumberFieldValue = _interopRequireDefault(require("./useHiddenNumberFieldValue"));
@@ -1,23 +0,0 @@
1
- "use strict";
2
-
3
- var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
4
- _Object$defineProperty(exports, "__esModule", {
5
- value: true
6
- });
7
- exports["default"] = void 0;
8
- var _react = require("react");
9
- /**
10
- * Returns integer or absolute value for screen reader announcement.
11
- */
12
-
13
- var useHiddenNumberFieldValue = function useHiddenNumberFieldValue(_ref) {
14
- var numberValue = _ref.numberValue,
15
- isCurrency = _ref.isCurrency;
16
- return (0, _react.useMemo)(function () {
17
- if (!numberValue) return '';
18
- if (!isCurrency) return numberValue;
19
- return Math.abs(numberValue);
20
- }, [numberValue, isCurrency]);
21
- };
22
- var _default = useHiddenNumberFieldValue;
23
- exports["default"] = _default;
@@ -1,35 +0,0 @@
1
- "use strict";
2
-
3
- var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
4
- var _reactHooks = require("@testing-library/react-hooks");
5
- var _useHiddenNumberFieldValue = _interopRequireDefault(require("./useHiddenNumberFieldValue"));
6
- test('When number is not currency, negative values return negative values', function () {
7
- var _renderHook = (0, _reactHooks.renderHook)(function () {
8
- return (0, _useHiddenNumberFieldValue["default"])({
9
- isCurrency: false,
10
- numberValue: -1
11
- });
12
- }),
13
- result = _renderHook.result;
14
- expect(result.current).toBe(-1);
15
- });
16
- test('When number is currency, it always returns the absolute value', function () {
17
- var _renderHook2 = (0, _reactHooks.renderHook)(function () {
18
- return (0, _useHiddenNumberFieldValue["default"])({
19
- isCurrency: true,
20
- numberValue: -1
21
- });
22
- }),
23
- result = _renderHook2.result;
24
- expect(result.current).toBe(1);
25
- });
26
- test('When number is not currency, positive values return positive numbers', function () {
27
- var _renderHook3 = (0, _reactHooks.renderHook)(function () {
28
- return (0, _useHiddenNumberFieldValue["default"])({
29
- isCurrency: false,
30
- numberValue: 2
31
- });
32
- }),
33
- result = _renderHook3.result;
34
- expect(result.current).toBe(2);
35
- });
@@ -1 +0,0 @@
1
- export { default } from './useHiddenNumberFieldValue';
@@ -1,16 +0,0 @@
1
- import { useMemo } from 'react';
2
-
3
- /**
4
- * Returns integer or absolute value for screen reader announcement.
5
- */
6
-
7
- var useHiddenNumberFieldValue = function useHiddenNumberFieldValue(_ref) {
8
- var numberValue = _ref.numberValue,
9
- isCurrency = _ref.isCurrency;
10
- return useMemo(function () {
11
- if (!numberValue) return '';
12
- if (!isCurrency) return numberValue;
13
- return Math.abs(numberValue);
14
- }, [numberValue, isCurrency]);
15
- };
16
- export default useHiddenNumberFieldValue;
@@ -1,32 +0,0 @@
1
- import { renderHook } from '@testing-library/react-hooks';
2
- import useHiddenNumberFieldValue from './useHiddenNumberFieldValue';
3
- test('When number is not currency, negative values return negative values', function () {
4
- var _renderHook = renderHook(function () {
5
- return useHiddenNumberFieldValue({
6
- isCurrency: false,
7
- numberValue: -1
8
- });
9
- }),
10
- result = _renderHook.result;
11
- expect(result.current).toBe(-1);
12
- });
13
- test('When number is currency, it always returns the absolute value', function () {
14
- var _renderHook2 = renderHook(function () {
15
- return useHiddenNumberFieldValue({
16
- isCurrency: true,
17
- numberValue: -1
18
- });
19
- }),
20
- result = _renderHook2.result;
21
- expect(result.current).toBe(1);
22
- });
23
- test('When number is not currency, positive values return positive numbers', function () {
24
- var _renderHook3 = renderHook(function () {
25
- return useHiddenNumberFieldValue({
26
- isCurrency: false,
27
- numberValue: 2
28
- });
29
- }),
30
- result = _renderHook3.result;
31
- expect(result.current).toBe(2);
32
- });