@carbon/react 1.25.0 → 1.26.0

package/lib/components/TextInput/TextInput.Skeleton.d.ts

@@ -0,0 +1,33 @@
+/**
+ * Copyright IBM Corp. 2016, 2023
+ *
+ * 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 React from 'react';
+export interface TextInputSkeletonProps extends React.HTMLAttributes<HTMLDivElement> {
+    /**
+     * Specify an optional className to add to the form item wrapper.
+     */
+    className?: string;
+    /**
+     * Specify whether the label should be hidden or not.
+     */
+    hideLabel?: boolean;
+}
+declare const TextInputSkeleton: {
+    ({ hideLabel, className, ...rest }: TextInputSkeletonProps): JSX.Element;
+    propTypes: {
+        /**
+         * Specify an optional className to add to the form item wrapper.
+         */
+        className: PropTypes.Requireable<string>;
+        /**
+         * Specify whether the label should be hidden, or not
+         */
+        hideLabel: PropTypes.Requireable<boolean>;
+    };
+};
+export default TextInputSkeleton;
+export { TextInputSkeleton };

package/lib/components/TextInput/index.js

@@ -13,6 +13,7 @@ var deprecateFieldOnObject = require('../../internal/deprecateFieldOnObject.js')
 var ControlledPasswordInput = require('./ControlledPasswordInput.js');
 var PasswordInput = require('./PasswordInput.js');
 var TextInput = require('./TextInput.js');
+var TextInput_Skeleton = require('./TextInput.Skeleton.js');
 
 TextInput["default"].ControlledPasswordInput = ControlledPasswordInput["default"];
 TextInput["default"].PasswordInput = PasswordInput["default"];
@@ -24,3 +25,4 @@ if (process.env.NODE_ENV !== "production") {
 
 exports.TextInput = TextInput["default"];
 exports["default"] = TextInput["default"];
+exports.TextInputSkeleton = TextInput_Skeleton["default"];

package/lib/components/Tile/Tile.js

@@ -32,7 +32,7 @@ var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
 var _CheckboxCheckedFille, _Checkbox, _ChevronDown, _ChevronDown2;
 
 var _excluded = ["children", "className", "light"],
-    _excluded2 = ["children", "className", "clicked", "href", "light", "onClick", "onKeyDown"],
+    _excluded2 = ["children", "className", "clicked", "disabled", "href", "light", "onClick", "onKeyDown"],
     _excluded3 = ["children", "className", "disabled", "id", "light", "name", "onClick", "onChange", "onKeyDown", "selected", "tabIndex", "title", "value"],
     _excluded4 = ["tabIndex", "className", "children", "expanded", "tileMaxHeight", "tilePadding", "onClick", "onKeyUp", "tileCollapsedIconText", "tileExpandedIconText", "tileCollapsedLabel", "tileExpandedLabel", "light"];
 var Tile = /*#__PURE__*/React__default["default"].forwardRef(function Tile(_ref, ref) {
@@ -74,6 +74,7 @@ var ClickableTile = /*#__PURE__*/React__default["default"].forwardRef(function C
       className = _ref2.className,
       _ref2$clicked = _ref2.clicked,
       clicked = _ref2$clicked === void 0 ? false : _ref2$clicked,
+      disabled = _ref2.disabled,
       href = _ref2.href,
       light = _ref2.light,
       _ref2$onClick = _ref2.onClick,
@@ -111,9 +112,10 @@ var ClickableTile = /*#__PURE__*/React__default["default"].forwardRef(function C
   return /*#__PURE__*/React__default["default"].createElement(Link["default"], _rollupPluginBabelHelpers["extends"]({
     className: classes,
     href: href,
-    onClick: handleOnClick,
+    onClick: !disabled ? handleOnClick : null,
     onKeyDown: handleOnKeyDown,
-    ref: ref
+    ref: ref,
+    disabled: disabled
   }, rest), children);
 });
 ClickableTile.displayName = 'ClickableTile';
@@ -133,6 +135,11 @@ ClickableTile.propTypes = {
    */
   clicked: PropTypes__default["default"].bool,
 
+  /**
+   * Specify whether the ClickableTile should be disabled
+   */
+  disabled: PropTypes__default["default"].bool,
+
   /**
    * The href for the link.
    */
@@ -369,7 +376,7 @@ function ExpandableTile(_ref4) {
       isExpanded = _useState18[0],
       setIsExpanded = _useState18[1];
 
-  var _useState19 = React.useState(false),
+  var _useState19 = React.useState(true),
       _useState20 = _rollupPluginBabelHelpers.slicedToArray(_useState19, 2),
       interactive = _useState20[0],
       setInteractive = _useState20[1];
@@ -439,11 +446,11 @@ function ExpandableTile(_ref4) {
     setIsTilePadding(paddingTop + paddingBottom);
   }, [isTileMaxHeight]);
   useIsomorphicEffect["default"](function () {
-    if (useNoInteractiveChildren.getInteractiveContent(belowTheFold.current)) {
-      setInteractive(true);
+    if (!useNoInteractiveChildren.getInteractiveContent(belowTheFold.current)) {
+      setInteractive(false);
       return;
-    } else if (useNoInteractiveChildren.getInteractiveContent(aboveTheFold.current)) {
-      setInteractive(true);
+    } else if (!useNoInteractiveChildren.getInteractiveContent(aboveTheFold.current)) {
+      setInteractive(false);
     }
   }, []);
   useIsomorphicEffect["default"](function () {

package/lib/components/UIShell/HeaderMenu.js

@@ -16,6 +16,7 @@ var React = require('react');
 var PropTypes = require('prop-types');
 var AriaPropTypes = require('../../prop-types/AriaPropTypes.js');
 var usePrefix = require('../../internal/usePrefix.js');
+var deprecate = require('../../prop-types/deprecate.js');
 var match = require('../../internal/keyboard/match.js');
 var keys = require('../../internal/keyboard/keys.js');
 
@@ -25,7 +26,7 @@ var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
 
-var _excluded = ["isCurrentPage", "aria-label", "aria-labelledby", "className", "children", "renderMenuContent", "menuLinkName", "focusRef"];
+var _excluded = ["isActive", "isCurrentPage", "aria-label", "aria-labelledby", "className", "children", "renderMenuContent", "menuLinkName", "focusRef"];
 /**
  * `HeaderMenu` is used to render submenu's in the `Header`. Most often children
  * will be a `HeaderMenuItem`. It handles certain keyboard events to help
@@ -159,6 +160,7 @@ var HeaderMenu = /*#__PURE__*/function (_React$Component) {
       var prefix = this.context;
 
       var _this$props = this.props,
+          isActive = _this$props.isActive,
           isCurrentPage = _this$props.isCurrentPage,
           ariaLabel = _this$props['aria-label'],
           ariaLabelledBy = _this$props['aria-labelledby'],
@@ -174,7 +176,8 @@ var HeaderMenu = /*#__PURE__*/function (_React$Component) {
         'aria-labelledby': ariaLabelledBy
       };
       var itemClassName = cx__default["default"]((_cx = {}, _rollupPluginBabelHelpers.defineProperty(_cx, "".concat(prefix, "--header__submenu"), true), _rollupPluginBabelHelpers.defineProperty(_cx, customClassName, !!customClassName), _cx));
-      var linkClassName = cx__default["default"]((_cx2 = {}, _rollupPluginBabelHelpers.defineProperty(_cx2, "".concat(prefix, "--header__menu-item"), true), _rollupPluginBabelHelpers.defineProperty(_cx2, "".concat(prefix, "--header__menu-title"), true), _rollupPluginBabelHelpers.defineProperty(_cx2, "".concat(prefix, "--header__menu-item--current"), isCurrentPage), _cx2)); // Notes on eslint comments and based on the examples in:
+      var isActivePage = isActive ? isActive : isCurrentPage;
+      var linkClassName = cx__default["default"]((_cx2 = {}, _rollupPluginBabelHelpers.defineProperty(_cx2, "".concat(prefix, "--header__menu-item"), true), _rollupPluginBabelHelpers.defineProperty(_cx2, "".concat(prefix, "--header__menu-title"), true), _rollupPluginBabelHelpers.defineProperty(_cx2, "".concat(prefix, "--header__menu-item--current"), isActivePage), _cx2)); // Notes on eslint comments and based on the examples in:
       // https://www.w3.org/TR/wai-aria-practices/examples/menubar/menubar-1/menubar-1.html#
       // - The focus is handled by the <a> menuitem, onMouseOver is for mouse
       // users
@@ -228,9 +231,15 @@ _rollupPluginBabelHelpers.defineProperty(HeaderMenu, "propTypes", _rollupPluginB
   focusRef: PropTypes__default["default"].func,
 
   /**
-   * Applies selected styles to the item if a user sets this to true and aria-current !== 'page'.
+   * Applies selected styles to the item if a user sets this to true and `aria-current !== 'page'`.
    */
-  isCurrentPage: PropTypes__default["default"].bool,
+  isActive: PropTypes__default["default"].bool,
+
+  /**
+   * Applies selected styles to the item if a user sets this to true and `aria-current !== 'page'`.
+   * @deprecated Please use `isActive` instead. This will be removed in the next major release.
+   */
+  isCurrentPage: deprecate["default"](PropTypes__default["default"].bool, 'The `isCurrentPage` prop for `HeaderMenu` has ' + 'been deprecated. Please use `isActive` instead. This will be removed in the next major release.'),
 
   /**
    * Provide a label for the link text

package/lib/components/UIShell/HeaderMenuItem.js

@@ -15,6 +15,7 @@ var React = require('react');
 var cx = require('classnames');
 var Link = require('./Link.js');
 var usePrefix = require('../../internal/usePrefix.js');
+var deprecate = require('../../prop-types/deprecate.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -22,11 +23,12 @@ var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
 
-var _excluded = ["className", "isCurrentPage", "aria-current", "children", "role", "tabIndex"];
+var _excluded = ["className", "isActive", "isCurrentPage", "aria-current", "children", "role", "tabIndex"];
 var HeaderMenuItem = /*#__PURE__*/React__default["default"].forwardRef(function HeaderMenuItem(_ref, ref) {
   var _cx;
 
   var className = _ref.className,
+      isActive = _ref.isActive,
       isCurrentPage = _ref.isCurrentPage,
       ariaCurrent = _ref['aria-current'],
       children = _ref.children,
@@ -36,7 +38,12 @@ var HeaderMenuItem = /*#__PURE__*/React__default["default"].forwardRef(function
       rest = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
 
   var prefix = usePrefix.usePrefix();
-  var linkClassName = cx__default["default"]((_cx = {}, _rollupPluginBabelHelpers.defineProperty(_cx, "".concat(prefix, "--header__menu-item"), true), _rollupPluginBabelHelpers.defineProperty(_cx, "".concat(prefix, "--header__menu-item--current"), isCurrentPage && ariaCurrent !== 'page'), _cx));
+
+  if (isCurrentPage) {
+    isActive = isCurrentPage;
+  }
+
+  var linkClassName = cx__default["default"]((_cx = {}, _rollupPluginBabelHelpers.defineProperty(_cx, "".concat(prefix, "--header__menu-item"), true), _rollupPluginBabelHelpers.defineProperty(_cx, "".concat(prefix, "--header__menu-item--current"), isActive && ariaCurrent !== 'page'), _cx));
   return /*#__PURE__*/React__default["default"].createElement("li", {
     className: className,
     role: role
@@ -63,9 +70,15 @@ HeaderMenuItem.propTypes = _rollupPluginBabelHelpers.objectSpread2(_rollupPlugin
   className: PropTypes__default["default"].string,
 
   /**
-   * Applies selected styles to the item if a user sets this to true and aria-current !== 'page'.
+   * Applies selected styles to the item if a user sets this to true and `aria-current !== 'page'`.
+   */
+  isActive: PropTypes__default["default"].bool,
+
+  /**
+   * Applies selected styles to the item if a user sets this to true and `aria-current !== 'page'`.
+   * @deprecated Please use `isActive` instead. This will be removed in the next major release.
    */
-  isCurrentPage: PropTypes__default["default"].bool,
+  isCurrentPage: deprecate["default"](PropTypes__default["default"].bool, 'The `isCurrentPage` prop for `HeaderMenuItem` has ' + 'been deprecated. Please use `isActive` instead. This will be removed in the next major release.'),
 
   /**
    * Optionally supply a role for the underlying `<li>` node. Useful for resetting

package/lib/tools/wrapComponent.js

@@ -22,12 +22,21 @@ var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
 var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
 
 var _excluded = ["className"];
+/**
+ * @param {{ name: string, type: string, className?: string | (prefix: string) => string }} props
+ * @returns
+ */
 
 var wrapComponent = function wrapComponent(_ref) {
   var name = _ref.name,
       getClassName = _ref.className,
       type = _ref.type;
 
+  /**
+   *
+   * @param {{ className?: string, [x: string]: any}} param0
+   * @returns
+   */
   function Component(_ref2) {
     var baseClassName = _ref2.className,
         other = _rollupPluginBabelHelpers.objectWithoutProperties(_ref2, _excluded);

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@carbon/react",
   "description": "React components for the Carbon Design System",
-  "version": "1.25.0",
+  "version": "1.26.0",
   "license": "Apache-2.0",
   "main": "lib/index.js",
   "module": "es/index.js",
@@ -46,7 +46,7 @@
     "@carbon/feature-flags": "^0.13.0",
     "@carbon/icons-react": "^11.17.0",
     "@carbon/layout": "^11.12.0",
-    "@carbon/styles": "^1.25.0",
+    "@carbon/styles": "^1.26.0",
     "@carbon/telemetry": "0.1.0",
     "classnames": "2.3.2",
     "copy-to-clipboard": "^3.3.1",
@@ -133,5 +133,5 @@
     "**/*.scss",
     "**/*.css"
   ],
-  "gitHead": "47966b102beb1310c23bb0fc914a22f639dc08d6"
+  "gitHead": "a95ac1dfed8959765c963e5dbec340694cb60b57"
 }