@carbon/react 1.16.0-rc.0 → 1.17.0-rc.0

package/es/components/Checkbox/Checkbox.Skeleton.d.ts

@@ -0,0 +1,18 @@
+/**
+ * Copyright IBM Corp. 2016, 2018
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+import PropTypes from 'prop-types';
+import { HTMLAttributes } from 'react';
+declare const CheckboxSkeleton: {
+    ({ className, ...rest }: HTMLAttributes<HTMLDivElement>): JSX.Element;
+    propTypes: {
+        /**
+         * Specify an optional className to add.
+         */
+        className: PropTypes.Requireable<string>;
+    };
+};
+export default CheckboxSkeleton;

package/es/components/Checkbox/Checkbox.Skeleton.js

@@ -33,6 +33,5 @@ CheckboxSkeleton.propTypes = {
    */
   className: PropTypes.string
 };
-var CheckboxSkeleton$1 = CheckboxSkeleton;
 
-export { CheckboxSkeleton$1 as default };
+export { CheckboxSkeleton as default };

package/es/components/Checkbox/Checkbox.d.ts

@@ -0,0 +1,47 @@
+/**
+ * Copyright IBM Corp. 2016, 2018
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+import { ReactNodeLike } from 'prop-types';
+import React from 'react';
+declare type ExcludedAttributes = 'id' | 'onChange' | 'onClick' | 'type';
+export interface CheckboxProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, ExcludedAttributes> {
+    /**
+     * Provide an `id` to uniquely identify the Checkbox input
+     */
+    id: string;
+    /**
+     * Provide a label to provide a description of the Checkbox input that you are
+     * exposing to the user
+     */
+    labelText: NonNullable<ReactNodeLike>;
+    /**
+     * Specify whether the underlying input should be checked by default
+     */
+    defaultChecked?: boolean;
+    /**
+     * Specify whether the Checkbox should be disabled
+     */
+    disabled?: boolean;
+    /**
+     * Specify whether the label should be hidden, or not
+     */
+    hideLabel?: boolean;
+    /**
+     * Specify whether the Checkbox is in an indeterminate state
+     */
+    indeterminate?: boolean;
+    /**
+     * Provide an optional handler that is called when the internal state of
+     * Checkbox changes. This handler is called with event and state info.
+     * `(event, { checked, id }) => void`
+     */
+    onChange?: (evt: React.ChangeEvent<HTMLInputElement>, data: {
+        checked: boolean;
+        id: string;
+    }) => void;
+}
+declare const Checkbox: React.ForwardRefExoticComponent<CheckboxProps & React.RefAttributes<unknown>>;
+export default Checkbox;

package/es/components/Checkbox/Checkbox.js

@@ -14,7 +14,7 @@ import { usePrefix } from '../../internal/usePrefix.js';
 import { Text } from '../Text/Text.js';
 
 var _excluded = ["className", "id", "labelText", "onChange", "indeterminate", "hideLabel", "title"];
-var Checkbox = /*#__PURE__*/React__default.forwardRef(function Checkbox(_ref, _ref2) {
+var Checkbox = /*#__PURE__*/React__default.forwardRef(function (_ref, _ref2) {
   var className = _ref.className,
       id = _ref.id,
       labelText = _ref.labelText,
@@ -33,7 +33,7 @@ var Checkbox = /*#__PURE__*/React__default.forwardRef(function Checkbox(_ref, _r
   }, /*#__PURE__*/React__default.createElement("input", _extends({}, other, {
     type: "checkbox",
     onChange: function onChange(evt) {
-      _onChange(evt, {
+      _onChange && _onChange(evt, {
         checked: evt.target.checked,
         id: id
       });
@@ -41,20 +41,20 @@ var Checkbox = /*#__PURE__*/React__default.forwardRef(function Checkbox(_ref, _r
     className: "".concat(prefix, "--checkbox"),
     id: id,
     ref: function ref(el) {
-      if (el) {
+      if (el && indeterminate) {
         el.indeterminate = indeterminate;
       }
 
       if (typeof _ref2 === 'function') {
         _ref2(el);
-      } else if (Object(_ref2) === _ref2) {
+      } else if (_ref2 && Object(_ref2) === _ref2) {
         _ref2.current = el;
       }
     }
   })), /*#__PURE__*/React__default.createElement("label", {
     htmlFor: id,
     className: "".concat(prefix, "--checkbox-label"),
-    title: title || null
+    title: title
   }, /*#__PURE__*/React__default.createElement(Text, {
     className: innerLabelClasses
   }, labelText)));
@@ -118,6 +118,5 @@ Checkbox.defaultProps = {
   indeterminate: false
 };
 Checkbox.displayName = 'Checkbox';
-var Checkbox$1 = Checkbox;
 
-export { Checkbox$1 as default };
+export { Checkbox as default };

package/es/components/Checkbox/index.d.ts

@@ -0,0 +1,10 @@
+/**
+ * Copyright IBM Corp. 2016, 2018
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+export { default as CheckboxSkeleton } from './Checkbox.Skeleton';
+import Checkbox, { CheckboxProps } from './Checkbox';
+export type { CheckboxProps };
+export default Checkbox;

package/es/components/Checkbox/index.js

@@ -0,0 +1,10 @@
+/**
+ * Copyright IBM Corp. 2016, 2022
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+export { default as CheckboxSkeleton } from './Checkbox.Skeleton.js';
+import Checkbox from './Checkbox.js';
+export { default } from './Checkbox.js';

package/es/components/CodeSnippet/CodeSnippet.js

@@ -245,7 +245,6 @@ function CodeSnippet(_ref) {
   }, /*#__PURE__*/React__default.createElement("span", {
     className: "".concat(prefix, "--snippet-btn--text")
   }, expandCodeBtnText), /*#__PURE__*/React__default.createElement(ChevronDown, {
-    "aria-label": expandCodeBtnText,
     className: "".concat(prefix, "--icon-chevron--down ").concat(prefix, "--snippet__icon"),
     name: "chevron--down",
     role: "img"

package/es/components/DataTable/TableToolbarSearch.js

@@ -9,7 +9,7 @@ import { objectWithoutProperties as _objectWithoutProperties, slicedToArray as _
 import cx from 'classnames';
 import PropTypes from 'prop-types';
 import React__default, { useRef, useState, useMemo, useEffect } from 'react';
-import Search from '../Search/index.js';
+import Search from '../Search/Search.js';
 import setupGetInstanceId from './tools/instanceId.js';
 import { usePrefix } from '../../internal/usePrefix.js';
 

package/es/components/ExpandableSearch/ExpandableSearch.js

@@ -8,7 +8,7 @@
 import { objectWithoutProperties as _objectWithoutProperties, slicedToArray as _slicedToArray, defineProperty as _defineProperty, extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
 import React__default, { useState, useRef } from 'react';
 import cx from 'classnames';
-import Search from '../Search/index.js';
+import Search from '../Search/Search.js';
 import { usePrefix } from '../../internal/usePrefix.js';
 import { composeEventHandlers } from '../../tools/events.js';
 

package/es/components/Grid/Grid.js

@@ -37,11 +37,6 @@ Grid.propTypes = {
    */
   className: PropTypes.string,
 
-  /**
-   * Specify how many columns wide the Grid should span
-   */
-  columns: PropTypes.number,
-
   /**
    * Collapse the gutter to 1px. Useful for fluid layouts.
    * Rows have 1px of margin between them to match gutter.

package/es/components/NumberInput/NumberInput.js

@@ -16,7 +16,7 @@ import { useNormalizedInputProps } from '../../internal/useNormalizedInputProps.
 import { usePrefix } from '../../internal/usePrefix.js';
 import deprecate from '../../prop-types/deprecate.js';
 
-var _excluded = ["allowEmpty", "className", "disabled", "defaultValue", "helperText", "hideLabel", "hideSteppers", "iconDescription", "id", "label", "invalid", "invalidText", "light", "max", "min", "onChange", "onClick", "onKeyUp", "readOnly", "size", "step", "translateWithId", "warn", "warnText", "value"];
+var _excluded = ["allowEmpty", "className", "disabled", "disableWheel", "defaultValue", "helperText", "hideLabel", "hideSteppers", "iconDescription", "id", "label", "invalid", "invalidText", "light", "max", "min", "onChange", "onClick", "onKeyUp", "readOnly", "size", "step", "translateWithId", "warn", "warnText", "value"];
 
 var _defaultTranslations, _Subtract, _Add;
 var translationIds = {
@@ -34,6 +34,8 @@ var NumberInput = /*#__PURE__*/React__default.forwardRef(function NumberInput(pr
       customClassName = props.className,
       _props$disabled = props.disabled,
       disabled = _props$disabled === void 0 ? false : _props$disabled,
+      _props$disableWheel = props.disableWheel,
+      disableWheelProp = _props$disableWheel === void 0 ? false : _props$disableWheel,
       defaultValue = props.defaultValue,
       _props$helperText = props.helperText,
       helperText = _props$helperText === void 0 ? '' : _props$helperText,
@@ -172,6 +174,24 @@ var NumberInput = /*#__PURE__*/React__default.forwardRef(function NumberInput(pr
     onClick: _onClick,
     onChange: handleOnChange,
     onKeyUp: onKeyUp,
+    onFocus: function onFocus(e) {
+      if (disableWheelProp) {
+        e.target.addEventListener('wheel', disableWheel);
+      }
+
+      if (rest.onFocus) {
+        rest.onFocus(e);
+      }
+    },
+    onBlur: function onBlur(e) {
+      if (disableWheelProp) {
+        e.target.removeEventListener('wheel', disableWheel);
+      }
+
+      if (rest.onBlur) {
+        rest.onBlur(e);
+      }
+    },
     pattern: "[0-9]*",
     readOnly: readOnly,
     step: step,
@@ -254,6 +274,11 @@ NumberInput.propTypes = {
    */
   defaultValue: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
 
+  /**
+   * Specify if the wheel functionality for the input should be disabled, or not
+   */
+  disableWheel: PropTypes.bool,
+
   /**
    * Specify if the control should be disabled, or not
    */
@@ -449,6 +474,25 @@ function getInputValidity(_ref4) {
 
   return true;
 }
+/**
+ * It prevents any wheel event from emitting.
+ *
+ * We want to prevent this input field from changing by the user accidentally
+ * when the user scrolling up or down in a long form. So we prevent the default
+ * behavior of wheel events when it is focused.
+ *
+ * Because React uses passive event handler by default, we can't just call
+ * `preventDefault` in the `onWheel` event handler. So we have to get the input
+ * ref and add our event handler manually.
+ *
+ * @see https://github.com/facebook/react/pull/19654
+ * @param {WheelEvent} e A wheel event.
+ */
+
+
+function disableWheel(e) {
+  e.preventDefault();
+}
 /**
  * Clamp the given value between the upper bound `max` and the lower bound `min`
  * @param {number} max

package/es/components/ProgressIndicator/ProgressIndicator.Skeleton.js

@@ -5,14 +5,14 @@
  * LICENSE file in the root directory of this source tree.
  */
 
-import { objectWithoutProperties as _objectWithoutProperties, extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
+import { objectWithoutProperties as _objectWithoutProperties, extends as _extends, defineProperty as _defineProperty } from '../../_virtual/_rollupPluginBabelHelpers.js';
 import PropTypes from 'prop-types';
 import React__default from 'react';
 import cx from 'classnames';
 import { usePrefix } from '../../internal/usePrefix.js';
 import { CircleDash } from '@carbon/icons-react';
 
-var _excluded = ["className"];
+var _excluded = ["className", "vertical"];
 
 var _CircleDash, _Step, _Step2, _Step3, _Step4;
 
@@ -31,11 +31,12 @@ function Step() {
 
 function ProgressIndicatorSkeleton(_ref) {
   var className = _ref.className,
+      vertical = _ref.vertical,
       rest = _objectWithoutProperties(_ref, _excluded);
 
   var prefix = usePrefix();
   return /*#__PURE__*/React__default.createElement("ul", _extends({
-    className: cx("".concat(prefix, "--progress"), "".concat(prefix, "--skeleton"), className)
+    className: cx("".concat(prefix, "--progress"), "".concat(prefix, "--skeleton"), _defineProperty({}, "".concat(prefix, "--progress--vertical"), vertical), className)
   }, rest), _Step || (_Step = /*#__PURE__*/React__default.createElement(Step, null)), _Step2 || (_Step2 = /*#__PURE__*/React__default.createElement(Step, null)), _Step3 || (_Step3 = /*#__PURE__*/React__default.createElement(Step, null)), _Step4 || (_Step4 = /*#__PURE__*/React__default.createElement(Step, null)));
 }
 
@@ -43,7 +44,12 @@ ProgressIndicatorSkeleton.propTypes = {
   /**
    * Specify an optional className to add.
    */
-  className: PropTypes.string
+  className: PropTypes.string,
+
+  /**
+   * Determines whether or not the ProgressIndicator should be rendered vertically.
+   */
+  vertical: PropTypes.bool
 };
 
 export { ProgressIndicatorSkeleton as default };