@carbon/react 0.17.0 → 1.0.0-rc.0

package/lib/components/NumberInput/NumberInput.Skeleton.js

@@ -0,0 +1,54 @@
+/**
+ * Copyright IBM Corp. 2016, 2021
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var _rollupPluginBabelHelpers = require('../../_virtual/_rollupPluginBabelHelpers.js');
+var PropTypes = require('prop-types');
+var React = require('react');
+var cx = require('classnames');
+var usePrefix = require('../../internal/usePrefix.js');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
+
+var _excluded = ["hideLabel", "className"];
+
+var NumberInputSkeleton = function NumberInputSkeleton(_ref) {
+  var hideLabel = _ref.hideLabel,
+      className = _ref.className,
+      rest = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
+
+  var prefix = usePrefix.usePrefix();
+  return /*#__PURE__*/React__default["default"].createElement("div", _rollupPluginBabelHelpers["extends"]({
+    className: cx__default["default"]("".concat(prefix, "--form-item"), className)
+  }, rest), !hideLabel && /*#__PURE__*/React__default["default"].createElement("span", {
+    className: "".concat(prefix, "--label ").concat(prefix, "--skeleton")
+  }), /*#__PURE__*/React__default["default"].createElement("div", {
+    className: "".concat(prefix, "--number ").concat(prefix, "--skeleton")
+  }));
+};
+
+NumberInputSkeleton.propTypes = {
+  /**
+   * Specify an optional className to add to the form item wrapper.
+   */
+  className: PropTypes__default["default"].string,
+
+  /**
+   * Specify whether the label should be hidden, or not
+   */
+  hideLabel: PropTypes__default["default"].bool
+};
+var NumberInputSkeleton$1 = NumberInputSkeleton;
+
+exports["default"] = NumberInputSkeleton$1;

package/lib/components/NumberInput/NumberInput.js

@@ -0,0 +1,546 @@
+/**
+ * Copyright IBM Corp. 2016, 2021
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var _rollupPluginBabelHelpers = require('../../_virtual/_rollupPluginBabelHelpers.js');
+var PropTypes = require('prop-types');
+var React = require('react');
+var cx = require('classnames');
+var iconsReact = require('@carbon/icons-react');
+var FeatureFlags$1 = require('@carbon/feature-flags');
+var mergeRefs = require('../../tools/mergeRefs.js');
+var requiredIfValueExists = require('../../prop-types/requiredIfValueExists.js');
+var useNormalizedInputProps = require('../../internal/useNormalizedInputProps.js');
+var FeatureFlags = require('../../internal/FeatureFlags.js');
+var usePrefix = require('../../internal/usePrefix.js');
+var deprecate = require('../../prop-types/deprecate.js');
+var index = require('../FeatureFlags/index.js');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+function _interopNamespace(e) {
+  if (e && e.__esModule) return e;
+  var n = Object.create(null);
+  if (e) {
+    Object.keys(e).forEach(function (k) {
+      if (k !== 'default') {
+        var d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: function () { return e[k]; }
+        });
+      }
+    });
+  }
+  n["default"] = e;
+  return Object.freeze(n);
+}
+
+var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
+var FeatureFlags__namespace = /*#__PURE__*/_interopNamespace(FeatureFlags$1);
+
+var _excluded = ["className", "disabled", "iconDescription", "id", "hideLabel", "hideSteppers", "label", "max", "min", "step", "value", "readOnly", "invalid", "invalidText", "warn", "warnText", "helperText", "ariaLabel", "light", "allowEmpty", "innerRef", "translateWithId", "isMobile", "size", "defaultValue"];
+
+var _defaultTranslations, _Subtract, _Add;
+var translationIds = {
+  'increment.number': 'increment.number',
+  'decrement.number': 'decrement.number'
+};
+var defaultTranslations = (_defaultTranslations = {}, _rollupPluginBabelHelpers.defineProperty(_defaultTranslations, translationIds['increment.number'], 'Increment number'), _rollupPluginBabelHelpers.defineProperty(_defaultTranslations, translationIds['decrement.number'], 'Decrement number'), _defaultTranslations);
+
+var capMin = function capMin(min, value) {
+  return isNaN(min) || !min && min !== 0 || isNaN(value) || !value && value !== 0 ? value : Math.max(min, value);
+};
+
+var capMax = function capMax(max, value) {
+  return isNaN(max) || !max && max !== 0 || isNaN(value) || !value && value !== 0 ? value : Math.min(max, value);
+};
+
+var NumberInput = /*#__PURE__*/function (_Component) {
+  _rollupPluginBabelHelpers.inherits(NumberInput, _Component);
+
+  var _super = _rollupPluginBabelHelpers.createSuper(NumberInput);
+
+  function NumberInput(props) {
+    var _this;
+
+    _rollupPluginBabelHelpers.classCallCheck(this, NumberInput);
+
+    _this = _super.call(this, props);
+
+    _rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.assertThisInitialized(_this), "_inputRef", null);
+
+    _rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.assertThisInitialized(_this), "handleChange", function (evt) {
+      var _this$props = _this.props,
+          disabled = _this$props.disabled,
+          onChange = _this$props.onChange;
+
+      if (!disabled) {
+        evt.persist();
+        evt.imaginaryTarget = _this._inputRef;
+        var prevValue = _this.state.value;
+        var value = evt.target.value;
+        var direction = prevValue < value ? 'up' : 'down';
+
+        _this.setState({
+          value: value
+        }, function () {
+          if (FeatureFlags.useControlledStateWithValue) {
+            onChange(evt, {
+              value: value,
+              direction: direction
+            });
+          } else if (onChange) {
+            onChange(evt, {
+              value: value,
+              direction: direction
+            });
+          }
+        });
+      }
+    });
+
+    _rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.assertThisInitialized(_this), "handleArrowClick", function (evt, direction) {
+      var value = typeof _this.state.value === 'string' ? Number(_this.state.value) : _this.state.value;
+      var _this$props2 = _this.props,
+          disabled = _this$props2.disabled,
+          min = _this$props2.min,
+          max = _this$props2.max,
+          step = _this$props2.step,
+          onChange = _this$props2.onChange,
+          onClick = _this$props2.onClick;
+      var conditional = direction === 'down' ? min !== undefined && value > min || min === undefined : max !== undefined && value < max || max === undefined;
+
+      if (!disabled && conditional) {
+        value = direction === 'down' ? value - step : value + step;
+        value = capMax(max, capMin(min, value));
+        evt.persist();
+        evt.imaginaryTarget = _this._inputRef;
+
+        _this.setState({
+          value: value
+        }, function () {
+          //TO-DO v11: update these events to return the same things --> evt, {value, direction}
+          if (FeatureFlags.useControlledStateWithValue) {
+            onClick && onClick(evt, {
+              value: value,
+              direction: direction
+            });
+            onChange && onChange(evt, {
+              value: value,
+              direction: direction
+            });
+          } else {
+            // value added as a 3rd argument rather than in same obj so it doesn't break in v10
+            onClick && onClick(evt, direction, value);
+            onChange && onChange(evt, direction, value);
+          }
+        });
+      }
+    });
+
+    _rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.assertThisInitialized(_this), "_handleInputRef", function (ref) {
+      _this._inputRef = ref;
+    });
+
+    _this.isControlled = props.value !== undefined;
+
+    if (FeatureFlags.useControlledStateWithValue && _this.isControlled) {
+      // Skips the logic of setting initial state if this component is controlled
+      _this.state = {};
+      return _rollupPluginBabelHelpers.possibleConstructorReturn(_this);
+    }
+
+    var _value = FeatureFlags.useControlledStateWithValue || typeof props.defaultValue !== 'undefined' ? props.defaultValue : props.value;
+
+    _value = _value === undefined ? 0 : _value;
+
+    if (props.min || props.min === 0) {
+      _value = Math.max(props.min, _value);
+    }
+
+    _this.state = {
+      value: _value
+    };
+    return _this;
+  }
+
+  _rollupPluginBabelHelpers.createClass(NumberInput, [{
+    key: "render",
+    value: function render() {
+      var _this2 = this;
+
+      var _this$props3 = this.props,
+          className = _this$props3.className,
+          disabled = _this$props3.disabled,
+          iconDescription = _this$props3.iconDescription,
+          id = _this$props3.id,
+          hideLabel = _this$props3.hideLabel,
+          hideSteppers = _this$props3.hideSteppers,
+          label = _this$props3.label,
+          max = _this$props3.max,
+          min = _this$props3.min,
+          step = _this$props3.step,
+          value = _this$props3.value,
+          readOnly = _this$props3.readOnly,
+          invalid = _this$props3.invalid,
+          invalidText = _this$props3.invalidText,
+          warn = _this$props3.warn,
+          warnText = _this$props3.warnText,
+          helperText = _this$props3.helperText,
+          ariaLabel = _this$props3.ariaLabel,
+          light = _this$props3.light,
+          allowEmpty = _this$props3.allowEmpty,
+          ref = _this$props3.innerRef,
+          t = _this$props3.translateWithId,
+          isMobile = _this$props3.isMobile,
+          size = _this$props3.size;
+          _this$props3.defaultValue;
+          var other = _rollupPluginBabelHelpers.objectWithoutProperties(_this$props3, _excluded);
+
+      var scope = this.context;
+      var enabled;
+
+      if (scope.enabled) {
+        enabled = scope.enabled('enable-v11-release');
+      }
+
+      return /*#__PURE__*/React__default["default"].createElement(usePrefix.PrefixContext.Consumer, null, function (prefix) {
+        var _classNames, _classNames3, _classNames5, _normalizedProps$icon;
+
+        var numberInputClasses = cx__default["default"]("".concat(prefix, "--number ").concat(prefix, "--number--helpertext"), [enabled ? null : className], (_classNames = {}, _rollupPluginBabelHelpers.defineProperty(_classNames, "".concat(prefix, "--number--readonly"), readOnly), _rollupPluginBabelHelpers.defineProperty(_classNames, "".concat(prefix, "--number--light"), light), _rollupPluginBabelHelpers.defineProperty(_classNames, "".concat(prefix, "--number--nolabel"), hideLabel), _rollupPluginBabelHelpers.defineProperty(_classNames, "".concat(prefix, "--number--nosteppers"), hideSteppers), _rollupPluginBabelHelpers.defineProperty(_classNames, "".concat(prefix, "--number--mobile"), isMobile), _rollupPluginBabelHelpers.defineProperty(_classNames, "".concat(prefix, "--number--").concat(size), size), _classNames));
+        var isInputInvalid; // If the user supplied `invalid` through props, we'll defer to the passed in value
+
+        if (invalid) {
+          isInputInvalid = true;
+        } else {
+          // Otherwise, if we don't allow an empty value then we check to see
+          // if the value is empty, or if it is out of range
+          if (!allowEmpty && _this2.state.value === '') {
+            isInputInvalid = true;
+          } else {
+            if (_this2.state.value !== '' && (_this2.state.value > max || _this2.state.value < min)) {
+              isInputInvalid = true;
+            }
+          }
+        }
+
+        var normalizedProps = useNormalizedInputProps.useNormalizedInputProps({
+          id: id,
+          readOnly: readOnly,
+          disabled: disabled,
+          invalid: isInputInvalid,
+          invalidText: invalidText,
+          warn: warn,
+          warnText: warnText
+        });
+        var props = {
+          disabled: normalizedProps.disabled,
+          id: id,
+          max: max,
+          min: min,
+          step: step,
+          onChange: _this2.handleChange,
+          value: FeatureFlags.useControlledStateWithValue && _this2.isControlled ? value : _this2.state.value,
+          readOnly: readOnly,
+          'aria-label': label ? null : ariaLabel
+        };
+        var buttonProps = {
+          disabled: disabled
+        };
+        var inputWrapperProps = {};
+
+        if (normalizedProps.invalid) {
+          inputWrapperProps['data-invalid'] = true;
+        }
+
+        var helperTextClasses = cx__default["default"]("".concat(prefix, "--form__helper-text"), _rollupPluginBabelHelpers.defineProperty({}, "".concat(prefix, "--form__helper-text--disabled"), normalizedProps.disabled));
+        var helper = helperText ? /*#__PURE__*/React__default["default"].createElement("div", {
+          className: helperTextClasses
+        }, helperText) : null;
+        var labelClasses = cx__default["default"]("".concat(prefix, "--label"), (_classNames3 = {}, _rollupPluginBabelHelpers.defineProperty(_classNames3, "".concat(prefix, "--label--disabled"), normalizedProps.disabled), _rollupPluginBabelHelpers.defineProperty(_classNames3, "".concat(prefix, "--visually-hidden"), hideLabel), _classNames3));
+        var labelText = label ? /*#__PURE__*/React__default["default"].createElement("label", {
+          htmlFor: id,
+          className: labelClasses
+        }, label) : null;
+        var _ref = [t('increment.number'), t('decrement.number')],
+            incrementNumLabel = _ref[0],
+            decrementNumLabel = _ref[1];
+        var wrapperClasses = cx__default["default"]("".concat(prefix, "--number__input-wrapper"), _rollupPluginBabelHelpers.defineProperty({}, "".concat(prefix, "--number__input-wrapper--warning"), normalizedProps.warn));
+        var iconClasses = cx__default["default"]((_classNames5 = {}, _rollupPluginBabelHelpers.defineProperty(_classNames5, "".concat(prefix, "--number__invalid"), normalizedProps.invalid || normalizedProps.warn), _rollupPluginBabelHelpers.defineProperty(_classNames5, "".concat(prefix, "--number__invalid--warning"), normalizedProps.warn), _rollupPluginBabelHelpers.defineProperty(_classNames5, "".concat(prefix, "--number__readonly-icon"), readOnly), _classNames5));
+        var ariaDescribedBy = null;
+
+        if (normalizedProps.invalid) {
+          ariaDescribedBy = normalizedProps.invalidId;
+        }
+
+        if (normalizedProps.warn) {
+          ariaDescribedBy = normalizedProps.warnId;
+        }
+
+        return /*#__PURE__*/React__default["default"].createElement("div", {
+          className: enabled ? cx__default["default"]("".concat(prefix, "--form-item"), className) : "".concat(prefix, "--form-item")
+        }, /*#__PURE__*/React__default["default"].createElement("div", _rollupPluginBabelHelpers["extends"]({
+          className: numberInputClasses
+        }, inputWrapperProps), function () {
+          return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, labelText, /*#__PURE__*/React__default["default"].createElement("div", {
+            className: wrapperClasses
+          }, /*#__PURE__*/React__default["default"].createElement("input", _rollupPluginBabelHelpers["extends"]({
+            "data-invalid": normalizedProps.invalid,
+            "aria-invalid": normalizedProps.invalid,
+            "aria-describedby": ariaDescribedBy,
+            type: "number",
+            pattern: "[0-9]*"
+          }, other, props, {
+            ref: mergeRefs["default"](ref, _this2._handleInputRef)
+          })), normalizedProps.icon && (_normalizedProps$icon || (_normalizedProps$icon = /*#__PURE__*/React__default["default"].createElement(normalizedProps.icon, {
+            className: iconClasses
+          }))), !hideSteppers && /*#__PURE__*/React__default["default"].createElement("div", {
+            className: "".concat(prefix, "--number__controls")
+          }, /*#__PURE__*/React__default["default"].createElement("button", _rollupPluginBabelHelpers["extends"]({
+            type: "button",
+            className: "".concat(prefix, "--number__control-btn down-icon")
+          }, buttonProps, {
+            onClick: function onClick(evt) {
+              return _this2.handleArrowClick(evt, 'down');
+            },
+            title: decrementNumLabel || iconDescription,
+            "aria-label": decrementNumLabel || iconDescription,
+            tabIndex: "-1"
+          }), _Subtract || (_Subtract = /*#__PURE__*/React__default["default"].createElement(iconsReact.Subtract, {
+            className: "down-icon"
+          }))), /*#__PURE__*/React__default["default"].createElement("div", {
+            className: "".concat(prefix, "--number__rule-divider")
+          }), /*#__PURE__*/React__default["default"].createElement("button", _rollupPluginBabelHelpers["extends"]({
+            type: "button",
+            className: "".concat(prefix, "--number__control-btn up-icon")
+          }, buttonProps, {
+            onClick: function onClick(evt) {
+              return _this2.handleArrowClick(evt, 'up');
+            },
+            title: incrementNumLabel || iconDescription,
+            "aria-label": incrementNumLabel || iconDescription,
+            tabIndex: "-1"
+          }), _Add || (_Add = /*#__PURE__*/React__default["default"].createElement(iconsReact.Add, {
+            className: "up-icon"
+          }))), /*#__PURE__*/React__default["default"].createElement("div", {
+            className: "".concat(prefix, "--number__rule-divider")
+          }))), normalizedProps.validation ? null : helper);
+        }(), normalizedProps.validation));
+      });
+    }
+  }], [{
+    key: "getDerivedStateFromProps",
+    value: function getDerivedStateFromProps(_ref2, state) {
+      var value = _ref2.value;
+      var prevValue = state.prevValue;
+
+      if (FeatureFlags.useControlledStateWithValue && value === '' && prevValue !== '') {
+        return {
+          value: '',
+          prevValue: ''
+        };
+      } // If `useControlledStateWithValue` feature flag is on, do nothing here.
+      // Otherwise, do prop -> state sync with "value capping".
+      //// Value capping removed in #8965
+      //// value: capMax(max, capMin(min, value)), (L223)
+
+
+      return FeatureFlags.useControlledStateWithValue || prevValue === value ? null : {
+        value: value,
+        prevValue: value
+      };
+    }
+    /**
+     * The DOM node reference to the `<input>`.
+     * @type {HTMLInputElement}
+     */
+
+  }]);
+
+  return NumberInput;
+}(React.Component);
+
+_rollupPluginBabelHelpers.defineProperty(NumberInput, "propTypes", {
+  /**
+   * `true` to allow empty string.
+   */
+  allowEmpty: PropTypes__default["default"].bool,
+
+  /**
+   * Provide a description that would be used to best describe the use case of the NumberInput component
+   */
+  ariaLabel: PropTypes__default["default"].string,
+
+  /**
+   * Specify an optional className to be applied to the wrapper node
+   */
+  className: PropTypes__default["default"].string,
+
+  /**
+   * Optional starting value for uncontrolled state
+   */
+  defaultValue: PropTypes__default["default"].oneOfType([PropTypes__default["default"].number, PropTypes__default["default"].string]),
+
+  /**
+   * Specify if the control should be disabled, or not
+   */
+  disabled: PropTypes__default["default"].bool,
+
+  /**
+   * Provide text that is used alongside the control label for additional help
+   */
+  helperText: PropTypes__default["default"].node,
+
+  /**
+   * Specify whether you want the underlying label to be visually hidden
+   */
+  hideLabel: PropTypes__default["default"].bool,
+
+  /**
+   * Specify whether you want the steppers to be hidden
+   */
+  hideSteppers: PropTypes__default["default"].bool,
+
+  /**
+   * Provide a description for up/down icons that can be read by screen readers
+   */
+  iconDescription: PropTypes__default["default"].string.isRequired,
+
+  /**
+   * Specify a custom `id` for the input
+   */
+  id: PropTypes__default["default"].string.isRequired,
+
+  /**
+   * Specify if the currently value is invalid.
+   */
+  invalid: PropTypes__default["default"].bool,
+
+  /**
+   * Message which is displayed if the value is invalid.
+   */
+  invalidText: PropTypes__default["default"].node,
+
+  /**
+   * `true` to use the mobile variant.
+   */
+  isMobile: deprecate["default"](PropTypes__default["default"].bool, "The `isMobile` prop no longer needed as the default NumberInput styles are now identical to the mobile variant styles. This prop will be removed in the next major version of `carbon-components-react`"),
+
+  /**
+   * Generic `label` that will be used as the textual representation of what
+   * this field is for
+   */
+  label: PropTypes__default["default"].node,
+
+  /**
+   * `true` to use the light version.
+   */
+  light: PropTypes__default["default"].bool,
+
+  /**
+   * The maximum value.
+   */
+  max: PropTypes__default["default"].number,
+
+  /**
+   * The minimum value.
+   */
+  min: PropTypes__default["default"].number,
+
+  /**
+   * The new value is available in 'imaginaryTarget.value'
+   * i.e. to get the value: evt.imaginaryTarget.value
+   *
+   * * _With_ `useControlledStateWithValue` feature flag, the signature of the event handler will be altered to provide additional context in the second parameter: `onChange(event, { value, direction })` where:
+   *   * `event` is the (React) raw event
+   *   * `value` is the new value
+   *   * `direction` tells you the button you hit is up button or down button
+   * * _Without_ this feature flag the event handler has `onChange(event, direction)` signature.
+   */
+  onChange: !FeatureFlags.useControlledStateWithValue ? PropTypes__default["default"].func : requiredIfValueExists["default"](PropTypes__default["default"].func),
+
+  /**
+   * Provide an optional function to be called when the up/down button is clicked
+   */
+  onClick: PropTypes__default["default"].func,
+
+  /**
+   * Specify if the component should be read-only
+   */
+  readOnly: PropTypes__default["default"].bool,
+
+  /**
+   * Specify the size of the Number Input. Currently supports either `sm`, 'md' (default) or 'lg` as an option.
+   * TODO V11: remove `xl` (replaced with lg)
+   */
+  size: PropTypes__default["default"].oneOf(['sm', 'md', 'lg', 'xl']),
+
+  /**
+   * Specify how much the values should increase/decrease upon clicking on up/down button
+   */
+  step: PropTypes__default["default"].number,
+
+  /**
+   * Provide custom text for the component for each translation id
+   */
+  translateWithId: PropTypes__default["default"].func.isRequired,
+
+  /**
+   * Specify the value of the input
+   */
+  value: PropTypes__default["default"].oneOfType([PropTypes__default["default"].number, PropTypes__default["default"].string]),
+
+  /**
+   * Specify whether the control is currently in warning state
+   */
+  warn: PropTypes__default["default"].bool,
+
+  /**
+   * Provide the text that is displayed when the control is in warning state
+   */
+  warnText: PropTypes__default["default"].node
+});
+
+_rollupPluginBabelHelpers.defineProperty(NumberInput, "defaultProps", {
+  disabled: false,
+  hideLabel: false,
+  iconDescription: FeatureFlags__namespace.enabled('enable-v11-release') ? undefined : 'choose a number',
+  step: 1,
+  invalid: false,
+  invalidText: FeatureFlags__namespace.enabled('enable-v11-release') ? undefined : 'Provide invalidText',
+  warn: false,
+  warnText: '',
+  ariaLabel: 'Numeric input field with increment and decrement buttons',
+  helperText: '',
+  light: false,
+  allowEmpty: false,
+  translateWithId: function translateWithId(id) {
+    return defaultTranslations[id];
+  }
+});
+
+_rollupPluginBabelHelpers.defineProperty(NumberInput, "contextType", index.FeatureFlagContext);
+var NumberInput$1 = (function () {
+  var forwardRef = function forwardRef(props, ref) {
+    return /*#__PURE__*/React__default["default"].createElement(NumberInput, _rollupPluginBabelHelpers["extends"]({}, props, {
+      innerRef: ref
+    }));
+  };
+
+  forwardRef.displayName = 'NumberInput';
+  return /*#__PURE__*/React__default["default"].forwardRef(forwardRef);
+})();
+
+exports.NumberInput = NumberInput;
+exports["default"] = NumberInput$1;
+exports.translationIds = translationIds;

package/lib/components/OrderedList/OrderedList.js

@@ -0,0 +1,76 @@
+/**
+ * Copyright IBM Corp. 2016, 2021
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var _rollupPluginBabelHelpers = require('../../_virtual/_rollupPluginBabelHelpers.js');
+var PropTypes = require('prop-types');
+var React = require('react');
+var cx = require('classnames');
+var usePrefix = require('../../internal/usePrefix.js');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
+
+var _excluded = ["children", "className", "nested", "native", "isExpressive"];
+
+var OrderedList = function OrderedList(_ref) {
+  var _classnames;
+
+  var children = _ref.children,
+      className = _ref.className,
+      nested = _ref.nested,
+      native = _ref.native,
+      isExpressive = _ref.isExpressive,
+      other = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
+
+  var prefix = usePrefix.usePrefix();
+  var classNames = cx__default["default"]((_classnames = {}, _rollupPluginBabelHelpers.defineProperty(_classnames, "".concat(prefix, "--list--ordered"), !native), _rollupPluginBabelHelpers.defineProperty(_classnames, "".concat(prefix, "--list--ordered--native"), native), _rollupPluginBabelHelpers.defineProperty(_classnames, "".concat(prefix, "--list--nested"), nested), _rollupPluginBabelHelpers.defineProperty(_classnames, "".concat(prefix, "--list--expressive"), isExpressive), _classnames), className);
+  return /*#__PURE__*/React__default["default"].createElement("ol", _rollupPluginBabelHelpers["extends"]({
+    className: classNames
+  }, other), children);
+};
+
+OrderedList.propTypes = {
+  /**
+   * Provide list items to be rendered in the ordered list
+   */
+  children: PropTypes__default["default"].node,
+
+  /**
+   * Provide an optional className to be applied to the containing <ol> node
+   */
+  className: PropTypes__default["default"].string,
+
+  /**
+   * Specify whether this ordered list expressive or not
+   */
+  isExpressive: PropTypes__default["default"].bool,
+
+  /**
+   * Specify whether this ordered list should use native list styles instead of custom counter
+   */
+  native: PropTypes__default["default"].bool,
+
+  /**
+   * Specify whether this ordered list is nested inside of another nested list
+   */
+  nested: PropTypes__default["default"].bool
+};
+OrderedList.defaultProps = {
+  nested: false,
+  native: false,
+  isExpressive: false
+};
+var OrderedList$1 = OrderedList;
+
+exports["default"] = OrderedList$1;