carbon-react 96.1.0 → 99.0.0

package/lib/components/portrait/portrait.component.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 
-var _react = _interopRequireDefault(require("react"));
+var _react = _interopRequireWildcard(require("react"));
 
 var _propTypes = _interopRequireDefault(require("prop-types"));
 
@@ -25,159 +25,101 @@ var _utils = require("../../style/utils");
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-
-function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
-
-function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
-
-function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
-
-function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }
-
-function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
-
-function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
-
-function _possibleConstructorReturn(self, call) { if (call && (typeof call === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); }
+function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; }
 
-function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
+function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (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; }
 
-function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
-
-function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
-
-function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 
 const marginPropTypes = (0, _utils.filterStyledSystemMarginProps)(_propTypes2.default.space);
 
-let Portrait = /*#__PURE__*/function (_React$Component) {
-  _inherits(Portrait, _React$Component);
-
-  var _super = _createSuper(Portrait);
-
-  function Portrait(...args) {
-    var _this;
-
-    _classCallCheck(this, Portrait);
-
-    _this = _super.call(this, ...args);
-
-    _defineProperty(_assertThisInitialized(_this), "state", {
-      externalError: false
+const Portrait = ({
+  alt,
+  darkBackground,
+  gravatar,
+  iconType,
+  initials,
+  shape,
+  size,
+  src,
+  onClick,
+  tooltipMessage,
+  tooltipId,
+  tooltipIsVisible,
+  tooltipPosition,
+  tooltipType,
+  tooltipSize,
+  tooltipBgColor,
+  tooltipFontColor,
+  ...rest
+}) => {
+  const [externalError, setExternalError] = (0, _react.useState)(false);
+  (0, _react.useEffect)(() => {
+    setExternalError(false);
+  }, [gravatar, src]);
+  const tagProps = (0, _tags.default)("portrait", rest);
+
+  const renderComponent = () => {
+    let portrait = /*#__PURE__*/_react.default.createElement(_portrait.StyledIcon, {
+      type: iconType,
+      size: size,
+      shape: shape,
+      darkBackground: darkBackground
     });
 
-    return _this;
-  }
-
-  _createClass(Portrait, [{
-    key: "componentDidUpdate",
-    value: function componentDidUpdate(prevProps) {
-      const relevantPropsChanged = this.props.gravatar !== prevProps.gravatar || this.props.src !== prevProps.src;
-
-      if (relevantPropsChanged) {
-        this.setState({
-          externalError: false
-        }); // eslint-disable-line react/no-did-update-set-state
-      }
-    }
-  }, {
-    key: "getMarginProps",
-    value: function getMarginProps() {
-      return (0, _utils.filterStyledSystemMarginProps)(this.props);
-    }
-  }, {
-    key: "externalImageLoadFailed",
-    value: function externalImageLoadFailed() {
-      this.setState({
-        externalError: true
+    if (initials) {
+      portrait = /*#__PURE__*/_react.default.createElement(_portraitInitials.default, {
+        size: size,
+        shape: shape,
+        initials: initials,
+        darkBackground: darkBackground,
+        alt: alt
       });
     }
-  }, {
-    key: "render",
-    value: function render() {
-      const {
-        alt,
-        darkBackground,
-        gravatar,
-        iconType,
-        initials,
-        shape,
-        size,
-        src,
-        onClick,
-        tooltipMessage,
-        tooltipId,
-        tooltipIsVisible,
-        tooltipPosition,
-        tooltipType,
-        tooltipSize,
-        tooltipBgColor,
-        tooltipFontColor
-      } = this.props;
-      const tagProps = (0, _tags.default)("portrait", this.props);
-
-      let portrait = /*#__PURE__*/_react.default.createElement(_portrait.StyledIcon, {
-        type: iconType,
+
+    if (src && !externalError) {
+      portrait = /*#__PURE__*/_react.default.createElement(_portrait.StyledCustomImg, {
+        src: src,
+        alt: alt,
         size: size,
         shape: shape,
-        darkBackground: darkBackground
+        "data-element": "user-image",
+        onError: () => setExternalError(true)
       });
+    }
 
-      if (initials) {
-        portrait = /*#__PURE__*/_react.default.createElement(_portraitInitials.default, {
-          size: size,
-          shape: shape,
-          initials: initials,
-          darkBackground: darkBackground,
-          alt: alt
-        });
-      }
-
-      if (src && !this.state.externalError) {
-        portrait = /*#__PURE__*/_react.default.createElement(_portrait.StyledCustomImg, {
-          src: src,
-          alt: alt,
-          size: size,
-          shape: shape,
-          "data-element": "user-image",
-          onError: () => this.externalImageLoadFailed()
-        });
-      }
-
-      if (gravatar && !this.state.externalError) {
-        portrait = /*#__PURE__*/_react.default.createElement(_portraitGravatar.default, {
-          gravatarEmail: gravatar,
-          shape: shape,
-          size: size,
-          alt: alt,
-          errorCallback: () => this.externalImageLoadFailed()
-        });
-      }
-
-      if (tooltipMessage) {
-        return /*#__PURE__*/_react.default.createElement(_tooltip.default, {
-          message: tooltipMessage,
-          id: tooltipId,
-          position: tooltipPosition,
-          type: tooltipType,
-          size: tooltipSize,
-          isVisible: tooltipIsVisible,
-          bgColor: tooltipBgColor,
-          fontColor: tooltipFontColor
-        }, /*#__PURE__*/_react.default.createElement(_portrait.StyledPortraitContainer, _extends({}, this.getMarginProps(), {
-          onClick: onClick
-        }, tagProps), portrait));
-      }
-
-      return /*#__PURE__*/_react.default.createElement(_portrait.StyledPortraitContainer, _extends({}, this.getMarginProps(), {
+    if (gravatar && !externalError) {
+      portrait = /*#__PURE__*/_react.default.createElement(_portraitGravatar.default, {
+        gravatarEmail: gravatar,
+        shape: shape,
+        size: size,
+        alt: alt,
+        errorCallback: () => setExternalError(true)
+      });
+    }
+
+    if (tooltipMessage) {
+      return /*#__PURE__*/_react.default.createElement(_tooltip.default, {
+        message: tooltipMessage,
+        id: tooltipId,
+        position: tooltipPosition,
+        type: tooltipType,
+        size: tooltipSize,
+        isVisible: tooltipIsVisible,
+        bgColor: tooltipBgColor,
+        fontColor: tooltipFontColor
+      }, /*#__PURE__*/_react.default.createElement(_portrait.StyledPortraitContainer, _extends({}, (0, _utils.filterStyledSystemMarginProps)(rest), {
         onClick: onClick
-      }, tagProps), portrait);
+      }, tagProps), portrait));
     }
-  }]);
 
-  return Portrait;
-}(_react.default.Component);
+    return /*#__PURE__*/_react.default.createElement(_portrait.StyledPortraitContainer, _extends({}, (0, _utils.filterStyledSystemMarginProps)(rest), {
+      onClick: onClick
+    }, tagProps), portrait);
+  };
+
+  return renderComponent();
+};
 
 Portrait.propTypes = { ...marginPropTypes,
 

package/lib/components/search/search.component.js

@@ -175,6 +175,7 @@ const Search = ({
     onKeyDown: onKeyDown,
     inputRef: assignInput
   }), searchButton && /*#__PURE__*/_react.default.createElement(_search.StyledSearchButton, null, Boolean(isFocused || (!isControlled ? searchValue.length : value.length)) && /*#__PURE__*/_react.default.createElement(_button.default, _extends({
+    tabIndex: iconTabIndex,
     size: "medium",
     px: "16px"
   }, buttonProps), /*#__PURE__*/_react.default.createElement(_search.StyledButtonIcon, null, /*#__PURE__*/_react.default.createElement(_icon.default, {

package/lib/components/textarea/textarea-test.stories.js

@@ -0,0 +1,153 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.Default = exports.default = void 0;
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _specialCharacters = _interopRequireWildcard(require("../../../.storybook/utils/argTypes/specialCharacters"));
+
+var _ = _interopRequireDefault(require("."));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; }
+
+function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (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; }
+
+function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
+var _default = {
+  component: _.default,
+  title: "Textarea/Test",
+  parameters: {
+    info: {
+      disable: true
+    },
+    chromatic: {
+      disable: true
+    }
+  },
+  argTypes: {
+    labelAlign: {
+      options: ["left", "right"],
+      control: {
+        type: "select"
+      }
+    },
+    cols: {
+      control: {
+        min: 0,
+        max: 100,
+        step: 1,
+        type: "range"
+      }
+    },
+    rows: {
+      control: {
+        min: 0,
+        max: 100,
+        step: 1,
+        type: "range"
+      }
+    },
+    inputWidth: {
+      control: {
+        min: 0,
+        max: 100,
+        step: 1,
+        type: "range"
+      }
+    },
+    labelWidth: {
+      control: {
+        min: 0,
+        max: 100,
+        step: 1,
+        type: "range"
+      }
+    },
+    adaptiveLabelBreakpoint: {
+      control: {
+        type: "number"
+      }
+    },
+    placeholderSpecialCharacters: _specialCharacters.default,
+    labelSpecialCharacters: _specialCharacters.default,
+    labelHelpSpecialCharacters: _specialCharacters.default,
+    characterLimitSpecialCharacters: {
+      options: [..._specialCharacters.default.options, ..._specialCharacters.number.options],
+      mapping: { ..._specialCharacters.default.mapping,
+        ..._specialCharacters.number.mapping
+      }
+    },
+    fieldHelpSpecialCharacters: _specialCharacters.default
+  },
+  args: {
+    expandable: false,
+    cols: 0,
+    rows: 0,
+    disabled: false,
+    autoFocus: false,
+    readOnly: false,
+    placeholder: "",
+    fieldHelp: "",
+    characterLimit: "",
+    inputWidth: 100,
+    warnOverLimit: false,
+    enforceCharacterLimit: true,
+    label: "",
+    labelHelp: "",
+    labelInline: false,
+    labelWidth: 30,
+    labelAlign: undefined,
+    adaptiveLabelBreakpoint: undefined,
+    required: false,
+    placeholderSpecialCharacters: undefined,
+    labelSpecialCharacters: undefined,
+    labelHelpSpecialCharacters: undefined,
+    characterLimitSpecialCharacters: undefined,
+    fieldHelpSpecialCharacters: undefined
+  }
+};
+exports.default = _default;
+
+const Default = ({
+  placeholder,
+  placeholderSpecialCharacters,
+  label,
+  labelSpecialCharacters,
+  labelHelp,
+  labelHelpSpecialCharacters,
+  characterLimit,
+  characterLimitSpecialCharacters,
+  fieldHelp,
+  fieldHelpSpecialCharacters,
+  ...args
+}) => {
+  const [state, setState] = (0, _react.useState)("");
+
+  const handleChange = ({
+    target: {
+      value
+    }
+  }) => {
+    setState(value);
+  };
+
+  return /*#__PURE__*/_react.default.createElement(_.default, _extends({}, args, {
+    name: "textarea",
+    onChange: handleChange,
+    value: state,
+    placeholder: placeholder || placeholderSpecialCharacters,
+    label: label || labelSpecialCharacters,
+    labelHelp: labelHelp || labelHelpSpecialCharacters,
+    helpAriaLabel: labelHelp || labelHelpSpecialCharacters,
+    characterLimit: characterLimit || characterLimitSpecialCharacters,
+    fieldHelp: fieldHelp || fieldHelpSpecialCharacters
+  }));
+};
+
+exports.Default = Default;