@carbon/react 1.17.0 → 1.18.0

package/lib/internal/OptimizedResize.js

@@ -68,6 +68,4 @@ var OptimizedResize = function optimizedResize() {
   };
 }();
 
-var OptimizedResize$1 = OptimizedResize;
-
-exports["default"] = OptimizedResize$1;
+exports["default"] = OptimizedResize;

package/lib/internal/useAnnouncer.js

@@ -0,0 +1,20 @@
+/**
+ * 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.
+ */
+
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+function useAnnouncer(textCount, maxCount) {
+  var lastTen = maxCount - 10;
+
+  if (textCount >= lastTen) {
+    return "".concat(maxCount - textCount, " characters left.");
+  }
+}
+
+exports.useAnnouncer = useAnnouncer;

package/lib/internal/useId.js

@@ -13,6 +13,7 @@ var _rollupPluginBabelHelpers = require('../_virtual/_rollupPluginBabelHelpers.j
 var React = require('react');
 var setupGetInstanceId = require('../tools/setupGetInstanceId.js');
 var environment = require('./environment.js');
+var useIdPrefix = require('./useIdPrefix.js');
 
 var getId = setupGetInstanceId["default"]();
 var useIsomorphicLayoutEffect = environment.canUseDOM ? React.useLayoutEffect : React.useEffect;
@@ -26,9 +27,11 @@ var serverHandoffCompleted = false;
 function useId() {
   var prefix = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'id';
 
+  var _prefix = useIdPrefix.useIdPrefix();
+
   var _useState = React.useState(function () {
     if (serverHandoffCompleted) {
-      return "".concat(prefix, "-").concat(getId());
+      return "".concat(_prefix ? "".concat(_prefix, "-") : "").concat(prefix, "-").concat(getId());
     }
 
     return null;
@@ -39,7 +42,7 @@ function useId() {
 
   useIsomorphicLayoutEffect(function () {
     if (id === null) {
-      setId("".concat(prefix, "-").concat(getId()));
+      setId("".concat(_prefix ? "".concat(_prefix, "-") : "").concat(prefix, "-").concat(getId()));
     }
   }, [getId]);
   React.useEffect(function () {

package/lib/internal/useIdPrefix.js

@@ -0,0 +1,24 @@
+/**
+ * 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.
+ */
+
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var React = require('react');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+
+var IdPrefixContext = /*#__PURE__*/React__default["default"].createContext(null);
+function useIdPrefix() {
+  return React__default["default"].useContext(IdPrefixContext);
+}
+
+exports.IdPrefixContext = IdPrefixContext;
+exports.useIdPrefix = useIdPrefix;

package/lib/internal/useIsomorphicEffect.js

@@ -12,6 +12,5 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var React = require('react');
 
 var useIsomorphicEffect = typeof window !== 'undefined' ? React.useLayoutEffect : React.useEffect;
-var useIsomorphicEffect$1 = useIsomorphicEffect;
 
-exports["default"] = useIsomorphicEffect$1;
+exports["default"] = useIsomorphicEffect;

package/lib/tools/mergeRefs.js

@@ -30,6 +30,4 @@ var mergeRefs = function mergeRefs() {
   };
 };
 
-var mergeRefs$1 = mergeRefs;
-
-exports["default"] = mergeRefs$1;
+exports["default"] = mergeRefs;

package/lib/tools/wrapComponent.js

@@ -49,6 +49,4 @@ var wrapComponent = function wrapComponent(_ref) {
   return Component;
 };
 
-var wrapComponent$1 = wrapComponent;
-
-exports["default"] = wrapComponent$1;
+exports["default"] = wrapComponent;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@carbon/react",
   "description": "React components for the Carbon Design System",
-  "version": "1.17.0",
+  "version": "1.18.0",
   "license": "Apache-2.0",
   "main": "lib/index.js",
   "module": "es/index.js",
@@ -43,10 +43,10 @@
   },
   "dependencies": {
     "@babel/runtime": "^7.18.3",
-    "@carbon/feature-flags": "^0.9.0",
-    "@carbon/icons-react": "^11.11.0",
-    "@carbon/layout": "^11.7.0",
-    "@carbon/styles": "^1.17.0",
+    "@carbon/feature-flags": "^0.10.0",
+    "@carbon/icons-react": "^11.12.0",
+    "@carbon/layout": "^11.8.0",
+    "@carbon/styles": "^1.18.0",
     "@carbon/telemetry": "0.1.0",
     "classnames": "2.3.2",
     "copy-to-clipboard": "^3.3.1",
@@ -73,11 +73,11 @@
     "@babel/preset-env": "^7.18.2",
     "@babel/preset-react": "^7.17.12",
     "@carbon/test-utils": "^10.26.0",
-    "@carbon/themes": "^11.12.0",
+    "@carbon/themes": "^11.13.0",
     "@rollup/plugin-babel": "^5.3.0",
     "@rollup/plugin-commonjs": "^21.0.0",
-    "@rollup/plugin-node-resolve": "^13.0.0",
-    "@rollup/plugin-typescript": "^8.5.0",
+    "@rollup/plugin-node-resolve": "^15.0.0",
+    "@rollup/plugin-typescript": "^9.0.0",
     "@storybook/addon-a11y": "^6.5.6",
     "@storybook/addon-actions": "^6.5.6",
     "@storybook/addon-docs": "^6.5.6",
@@ -112,7 +112,7 @@
     "react-dom": "^17.0.2",
     "requestanimationframe": "^0.0.23",
     "rimraf": "^3.0.2",
-    "rollup": "^2.46.0",
+    "rollup": "^2.79.1",
     "rollup-plugin-strip-banner": "^2.0.0",
     "rtlcss": "^4.0.0",
     "sass": "^1.51.0",
@@ -135,5 +135,5 @@
     "**/*.scss",
     "**/*.css"
   ],
-  "gitHead": "06fdbdbc9cade1f6c352024175d348f9bd107b14"
+  "gitHead": "00fdab625998b2ae048814059ae8447435d6c7cd"
 }

package/scss/components/fluid-time-picker/_fluid-time-picker.scss

@@ -0,0 +1,9 @@
+// Code generated by @carbon/react. DO NOT EDIT.
+//
+// Copyright IBM Corp. 2018, 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.
+//
+
+@forward '@carbon/styles/scss/components/fluid-time-picker/fluid-time-picker';

package/scss/components/fluid-time-picker/_index.scss

@@ -0,0 +1,9 @@
+// Code generated by @carbon/react. DO NOT EDIT.
+//
+// Copyright IBM Corp. 2018, 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.
+//
+
+@forward '@carbon/styles/scss/components/fluid-time-picker';

package/es/components/TimePicker/index.js

@@ -1,15 +0,0 @@
-/**
- * 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.
- */
-
-import * as FeatureFlags from '@carbon/feature-flags';
-import TimePickerNext from './next/TimePicker.js';
-import TimePicker$2 from './TimePicker.js';
-
-var TimePicker = FeatureFlags.enabled('enable-v11-release') ? TimePickerNext : TimePicker$2;
-var TimePicker$1 = TimePicker;
-
-export { TimePicker$1 as default };

package/es/components/TimePicker/next/TimePicker.js

@@ -1,218 +0,0 @@
-/**
- * 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.
- */
-
-import { objectWithoutProperties as _objectWithoutProperties, slicedToArray as _slicedToArray, defineProperty as _defineProperty, extends as _extends } 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 deprecate from '../../../prop-types/deprecate.js';
-
-var _excluded = ["children", "className", "disabled", "hideLabel", "id", "invalidText", "invalid", "labelText", "light", "maxLength", "onChange", "onClick", "onBlur", "pattern", "placeholder", "size", "type", "value"];
-var TimePicker = /*#__PURE__*/React__default.forwardRef(function TimePicker(_ref, ref) {
-  var _cx2, _cx3;
-
-  var children = _ref.children,
-      className = _ref.className,
-      _ref$disabled = _ref.disabled,
-      disabled = _ref$disabled === void 0 ? false : _ref$disabled,
-      hideLabel = _ref.hideLabel,
-      id = _ref.id,
-      _ref$invalidText = _ref.invalidText,
-      invalidText = _ref$invalidText === void 0 ? 'Invalid time format.' : _ref$invalidText,
-      _ref$invalid = _ref.invalid,
-      invalid = _ref$invalid === void 0 ? false : _ref$invalid,
-      labelText = _ref.labelText,
-      _ref$light = _ref.light,
-      light = _ref$light === void 0 ? false : _ref$light,
-      _ref$maxLength = _ref.maxLength,
-      maxLength = _ref$maxLength === void 0 ? 5 : _ref$maxLength,
-      _ref$onChange = _ref.onChange,
-      onChange = _ref$onChange === void 0 ? function () {} : _ref$onChange,
-      _ref$onClick = _ref.onClick,
-      onClick = _ref$onClick === void 0 ? function () {} : _ref$onClick,
-      _ref$onBlur = _ref.onBlur,
-      onBlur = _ref$onBlur === void 0 ? function () {} : _ref$onBlur,
-      _ref$pattern = _ref.pattern,
-      pattern = _ref$pattern === void 0 ? '(1[012]|[1-9]):[0-5][0-9](\\s)?' : _ref$pattern,
-      _ref$placeholder = _ref.placeholder,
-      placeholder = _ref$placeholder === void 0 ? 'hh:mm' : _ref$placeholder,
-      _ref$size = _ref.size,
-      size = _ref$size === void 0 ? 'md' : _ref$size,
-      _ref$type = _ref.type,
-      type = _ref$type === void 0 ? 'text' : _ref$type,
-      value = _ref.value,
-      rest = _objectWithoutProperties(_ref, _excluded);
-
-  var prefix = usePrefix();
-
-  var _React$useState = React__default.useState(value),
-      _React$useState2 = _slicedToArray(_React$useState, 2),
-      isValue = _React$useState2[0],
-      setValue = _React$useState2[1];
-
-  var _React$useState3 = React__default.useState(value),
-      _React$useState4 = _slicedToArray(_React$useState3, 2),
-      prevValue = _React$useState4[0],
-      setPrevValue = _React$useState4[1];
-
-  if (value !== prevValue) {
-    setValue(value);
-    setPrevValue(value);
-  }
-
-  function handleOnClick(evt) {
-    if (!disabled) {
-      setValue(isValue);
-      onClick(evt);
-    }
-  }
-
-  function handleOnChange(evt) {
-    if (!disabled) {
-      setValue(isValue);
-      onChange(evt);
-    }
-  }
-
-  function handleOnBlur(evt) {
-    if (!disabled) {
-      setValue(isValue);
-      onBlur(evt);
-    }
-  }
-
-  var timePickerInputClasses = cx("".concat(prefix, "--time-picker__input-field"), "".concat(prefix, "--text-input"), [className], _defineProperty({}, "".concat(prefix, "--text-input--light"), light));
-  var timePickerClasses = cx((_cx2 = {}, _defineProperty(_cx2, "".concat(prefix, "--time-picker"), true), _defineProperty(_cx2, "".concat(prefix, "--time-picker--light"), light), _defineProperty(_cx2, "".concat(prefix, "--time-picker--invalid"), invalid), _defineProperty(_cx2, "".concat(prefix, "--time-picker--").concat(size), size), _defineProperty(_cx2, className, className), _cx2));
-  var labelClasses = cx("".concat(prefix, "--label"), (_cx3 = {}, _defineProperty(_cx3, "".concat(prefix, "--visually-hidden"), hideLabel), _defineProperty(_cx3, "".concat(prefix, "--label--disabled"), disabled), _cx3));
-  var label = labelText ? /*#__PURE__*/React__default.createElement("label", {
-    htmlFor: id,
-    className: labelClasses
-  }, labelText) : null;
-  var error = invalid ? /*#__PURE__*/React__default.createElement("div", {
-    className: "".concat(prefix, "--form-requirement")
-  }, invalidText) : null;
-  return /*#__PURE__*/React__default.createElement("div", {
-    className: cx("".concat(prefix, "--form-item"), className)
-  }, label, /*#__PURE__*/React__default.createElement("div", {
-    className: timePickerClasses
-  }, /*#__PURE__*/React__default.createElement("div", {
-    className: "".concat(prefix, "--time-picker__input")
-  }, /*#__PURE__*/React__default.createElement("input", _extends({
-    className: timePickerInputClasses,
-    "data-invalid": invalid ? invalid : undefined,
-    disabled: disabled,
-    id: id,
-    maxLength: maxLength,
-    onClick: handleOnClick,
-    onChange: handleOnChange,
-    onBlur: handleOnBlur,
-    placeholder: placeholder,
-    pattern: pattern,
-    ref: ref,
-    type: type,
-    value: value
-  }, rest))), children), error);
-});
-TimePicker.propTypes = {
-  /**
-   * Pass in the children that will be rendered next to the form control
-   */
-  children: PropTypes.node,
-
-  /**
-   * Specify an optional className to be applied to the container node
-   */
-  className: PropTypes.string,
-
-  /**
-   * Specify whether the `<input>` should be disabled
-   */
-  disabled: PropTypes.bool,
-
-  /**
-   * Specify whether you want the underlying label to be visually hidden
-   */
-  hideLabel: PropTypes.bool,
-
-  /**
-   * Specify a custom `id` for the `<input>`
-   */
-  id: PropTypes.string.isRequired,
-
-  /**
-   * Specify whether the control is currently invalid
-   */
-  invalid: PropTypes.bool,
-
-  /**
-   * Provide the text that is displayed when the control is in an invalid state
-   */
-  invalidText: PropTypes.node,
-
-  /**
-   * Provide the text that will be read by a screen reader when visiting this
-   * control
-   */
-  labelText: PropTypes.node,
-
-  /**
-   * The `light` prop for `TimePicker` has been deprecated. It will be removed in v12. Use the `Layer` component instead.
-   */
-  light: deprecate(PropTypes.bool, 'The `light` prop for `TimePicker` is no longer needed and has been deprecated. It will be removed in the next major release. Use the `Layer` component instead.'),
-
-  /**
-   * Specify the maximum length of the time string in `<input>`
-   */
-  maxLength: PropTypes.number,
-
-  /**
-   * Optionally provide an `onBlur` handler that is called whenever the
-   * `<input>` loses focus
-   */
-  onBlur: PropTypes.func,
-
-  /**
-   * Optionally provide an `onChange` handler that is called whenever `<input>`
-   * is updated
-   */
-  onChange: PropTypes.func,
-
-  /**
-   * Optionally provide an `onClick` handler that is called whenever the
-   * `<input>` is clicked
-   */
-  onClick: PropTypes.func,
-
-  /**
-   * Specify the regular expression working as the pattern of the time string in `<input>`
-   */
-  pattern: PropTypes.string,
-
-  /**
-   * Specify the placeholder attribute for the `<input>`
-   */
-  placeholder: PropTypes.string,
-
-  /**
-   * Specify the size of the Time Picker.
-   */
-  size: PropTypes.oneOf(['sm', 'md', 'lg']),
-
-  /**
-   * Specify the type of the `<input>`
-   */
-  type: PropTypes.string,
-
-  /**
-   * Specify the value of the `<input>`
-   */
-  value: PropTypes.string
-};
-var TimePickerNext = TimePicker;
-
-export { TimePickerNext as default };

package/lib/components/TimePicker/index.js

@@ -1,39 +0,0 @@
-/**
- * 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.
- */
-
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var FeatureFlags = require('@carbon/feature-flags');
-var TimePicker$2 = require('./next/TimePicker.js');
-var TimePicker$3 = require('./TimePicker.js');
-
-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 FeatureFlags__namespace = /*#__PURE__*/_interopNamespace(FeatureFlags);
-
-var TimePicker = FeatureFlags__namespace.enabled('enable-v11-release') ? TimePicker$2["default"] : TimePicker$3["default"];
-var TimePicker$1 = TimePicker;
-
-exports["default"] = TimePicker$1;