@carbon/react 1.0.0-rc.0 → 1.0.2

package/es/components/ToolbarSearch/ToolbarSearch.js

@@ -1,168 +0,0 @@
-/**
- * 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.
- */
-
-import { inherits as _inherits, createSuper as _createSuper, classCallCheck as _classCallCheck, defineProperty as _defineProperty, assertThisInitialized as _assertThisInitialized, createClass as _createClass, objectWithoutProperties as _objectWithoutProperties, extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
-import React__default, { Component } from 'react';
-import PropTypes from 'prop-types';
-import cx from 'classnames';
-import { Search } from '@carbon/icons-react';
-import ClickListener from '../../internal/ClickListener.js';
-import { warning } from '../../internal/warning.js';
-import { PrefixContext } from '../../internal/usePrefix.js';
-
-var _excluded = ["className", "type", "id", "placeHolderText", "labelText", "role", "labelId"];
-var didWarnAboutDeprecation = false;
-
-var ToolbarSearch = /*#__PURE__*/function (_Component) {
-  _inherits(ToolbarSearch, _Component);
-
-  var _super = _createSuper(ToolbarSearch);
-
-  function ToolbarSearch(props) {
-    var _this;
-
-    _classCallCheck(this, ToolbarSearch);
-
-    _this = _super.call(this, props);
-
-    _defineProperty(_assertThisInitialized(_this), "state", {
-      expanded: false
-    });
-
-    _defineProperty(_assertThisInitialized(_this), "expandSearch", function () {
-      _this.setState({
-        expanded: !_this.state.expanded
-      });
-
-      _this.input.focus();
-    });
-
-    _defineProperty(_assertThisInitialized(_this), "handleClickOutside", function () {
-      _this.setState({
-        expanded: false
-      });
-    });
-
-    if (process.env.NODE_ENV !== "production") {
-      process.env.NODE_ENV !== "production" ? warning(didWarnAboutDeprecation, 'The ToolbarSearch component has been deprecated and will be removed in the next major release of `carbon-components-react`') : void 0;
-      didWarnAboutDeprecation = true;
-    }
-
-    return _this;
-  }
-
-  _createClass(ToolbarSearch, [{
-    key: "render",
-    value: function render() {
-      var _classNames,
-          _this2 = this;
-
-      var prefix = this.context;
-
-      var _this$props = this.props,
-          className = _this$props.className,
-          type = _this$props.type,
-          id = _this$props.id,
-          placeHolderText = _this$props.placeHolderText,
-          labelText = _this$props.labelText,
-          role = _this$props.role,
-          labelId = _this$props.labelId,
-          other = _objectWithoutProperties(_this$props, _excluded);
-
-      var searchClasses = cx((_classNames = {}, _defineProperty(_classNames, "".concat(prefix, "--search ").concat(prefix, "--search--sm ").concat(prefix, "--toolbar-search"), true), _defineProperty(_classNames, "".concat(prefix, "--toolbar-search--active"), this.state.expanded), _defineProperty(_classNames, className, className), _classNames));
-      return /*#__PURE__*/React__default.createElement(ClickListener, {
-        onClickOutside: this.handleClickOutside
-      }, /*#__PURE__*/React__default.createElement("div", {
-        className: searchClasses,
-        role: role
-      }, /*#__PURE__*/React__default.createElement("label", {
-        htmlFor: id,
-        className: "".concat(prefix, "--label"),
-        id: labelId
-      }, labelText), /*#__PURE__*/React__default.createElement("input", _extends({}, other, {
-        type: type,
-        className: "".concat(prefix, "--search-input"),
-        id: id,
-        "aria-labelledby": labelId,
-        placeholder: placeHolderText,
-        ref: function ref(input) {
-          _this2.input = input;
-        }
-      })), /*#__PURE__*/React__default.createElement("button", {
-        type: "button",
-        className: "".concat(prefix, "--toolbar-search__btn"),
-        title: labelText,
-        onClick: this.expandSearch
-      }, /*#__PURE__*/React__default.createElement(Search, {
-        className: "".concat(prefix, "--search-magnifier"),
-        "aria-label": labelText
-      }))));
-    }
-  }]);
-
-  return ToolbarSearch;
-}(Component);
-
-_defineProperty(ToolbarSearch, "contextType", PrefixContext);
-
-_defineProperty(ToolbarSearch, "propTypes", {
-  /**
-   * The child nodes.
-   */
-  children: PropTypes.node,
-
-  /**
-   * The CSS class names.
-   */
-  className: PropTypes.string,
-
-  /**
-   * The ID of the `<input>`.
-   */
-  id: PropTypes.string,
-
-  /**
-   * The ID of the `<label>`.
-   */
-  labelId: PropTypes.string,
-
-  /**
-   * The text in the `<label>`.
-   */
-  labelText: PropTypes.node,
-
-  /**
-   * The placeholder text of the `<input>`.
-   */
-  placeHolderText: PropTypes.string,
-
-  /**
-   * Optional prop to specify the role of the ToolbarSearch
-   */
-  role: PropTypes.string,
-
-  /**
-   * `true` to use the small version of the UI.
-   */
-  small: PropTypes.bool,
-
-  /**
-   * The `type` of the `<input>`.
-   */
-  type: PropTypes.string
-});
-
-_defineProperty(ToolbarSearch, "defaultProps", {
-  type: 'search',
-  id: 'search__input',
-  labelText: '',
-  placeHolderText: '',
-  role: 'search',
-  labelId: 'search__label'
-});
-
-export { ToolbarSearch as default };

package/es/components/TooltipDefinition/TooltipDefinition.js

@@ -1,167 +0,0 @@
-/**
- * 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.
- */
-
-import { objectWithoutProperties as _objectWithoutProperties, slicedToArray as _slicedToArray, defineProperty as _defineProperty, extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
-import cx from 'classnames';
-import React__default, { useState, useEffect } from 'react';
-import PropTypes from 'prop-types';
-import debounce from 'lodash.debounce';
-import setupGetInstanceId from '../../tools/setupGetInstanceId.js';
-import { composeEventHandlers } from '../../tools/events.js';
-import { usePrefix } from '../../internal/usePrefix.js';
-import { matches } from '../../internal/keyboard/match.js';
-import { Escape } from '../../internal/keyboard/keys.js';
-
-var _excluded = ["id", "className", "triggerClassName", "children", "direction", "align", "onBlur", "onFocus", "onMouseEnter", "onMouseLeave", "tooltipText"];
-var getInstanceId = setupGetInstanceId();
-
-var TooltipDefinition = function TooltipDefinition(_ref) {
-  var _cx;
-
-  var id = _ref.id,
-      className = _ref.className,
-      triggerClassName = _ref.triggerClassName,
-      children = _ref.children,
-      direction = _ref.direction,
-      align = _ref.align,
-      onBlur = _ref.onBlur,
-      onFocus = _ref.onFocus,
-      onMouseEnter = _ref.onMouseEnter,
-      onMouseLeave = _ref.onMouseLeave,
-      tooltipText = _ref.tooltipText,
-      rest = _objectWithoutProperties(_ref, _excluded);
-
-  var prefix = usePrefix();
-
-  var _useState = useState(true),
-      _useState2 = _slicedToArray(_useState, 2),
-      allowTooltipVisibility = _useState2[0],
-      setAllowTooltipVisibility = _useState2[1];
-
-  var _useState3 = useState(false),
-      _useState4 = _slicedToArray(_useState3, 2),
-      tooltipVisible = _useState4[0],
-      setTooltipVisible = _useState4[1];
-
-  var tooltipId = id || "definition-tooltip-".concat(getInstanceId());
-  var tooltipClassName = cx("".concat(prefix, "--tooltip--definition"), "".concat(prefix, "--tooltip--a11y"), className);
-  var tooltipTriggerClasses = cx("".concat(prefix, "--tooltip__trigger"), "".concat(prefix, "--tooltip--a11y"), "".concat(prefix, "--tooltip__trigger--definition"), triggerClassName, (_cx = {}, _defineProperty(_cx, "".concat(prefix, "--tooltip--").concat(direction), direction), _defineProperty(_cx, "".concat(prefix, "--tooltip--align-").concat(align), align), _defineProperty(_cx, "".concat(prefix, "--tooltip--hidden"), !allowTooltipVisibility), _defineProperty(_cx, "".concat(prefix, "--tooltip--visible"), tooltipVisible), _cx));
-  var debounceTooltipVisible = debounce(function () {
-    return setTooltipVisible(false);
-  }, 100);
-
-  var handleFocus = function handleFocus() {
-    debounceTooltipVisible.cancel();
-    setAllowTooltipVisibility(true);
-    setTooltipVisible(true);
-  };
-
-  var handleBlur = debounceTooltipVisible;
-
-  var handleMouseEnter = function handleMouseEnter() {
-    debounceTooltipVisible.cancel();
-    setAllowTooltipVisibility(true);
-    setTooltipVisible(true);
-  };
-
-  var handleMouseLeave = debounceTooltipVisible;
-  useEffect(function () {
-    var handleEscKeyDown = function handleEscKeyDown(event) {
-      if (matches(event, [Escape])) {
-        setAllowTooltipVisibility(false);
-      }
-    };
-
-    document.addEventListener('keydown', handleEscKeyDown);
-    return function () {
-      return document.removeEventListener('keydown', handleEscKeyDown);
-    };
-  }, []);
-  return /*#__PURE__*/React__default.createElement("span", _extends({}, rest, {
-    className: tooltipClassName,
-    onMouseEnter: composeEventHandlers([onMouseEnter, handleMouseEnter]),
-    onMouseLeave: composeEventHandlers([onMouseLeave, handleMouseLeave])
-  }), /*#__PURE__*/React__default.createElement("button", {
-    type: "button",
-    className: tooltipTriggerClasses,
-    "aria-describedby": tooltipId,
-    onFocus: composeEventHandlers([onFocus, handleFocus]),
-    onBlur: composeEventHandlers([onBlur, handleBlur])
-  }, children), /*#__PURE__*/React__default.createElement("span", {
-    className: "".concat(prefix, "--assistive-text"),
-    id: tooltipId,
-    role: "tooltip"
-  }, tooltipText));
-};
-
-TooltipDefinition.propTypes = {
-  /**
-   * Specify the alignment (to the trigger button) of the tooltip.
-   * Can be one of: start, center, or end.
-   */
-  align: PropTypes.oneOf(['start', 'center', 'end']),
-
-  /**
-   * Specify the tooltip trigger text that is rendered to the UI for the user to
-   * interact with in order to display the tooltip.
-   */
-  children: PropTypes.node.isRequired,
-
-  /**
-   * Specify an optional className to be applied to the container node
-   */
-  className: PropTypes.string,
-
-  /**
-   * Specify the direction of the tooltip. Can be either top or bottom.
-   */
-  direction: PropTypes.oneOf(['top', 'bottom']),
-
-  /**
-   * Optionally specify a custom id for the tooltip. If one is not provided, we
-   * generate a unique id for you.
-   */
-  id: PropTypes.string,
-
-  /**
-   * The event handler for the `blur` event.
-   */
-  onBlur: PropTypes.func,
-
-  /**
-   * The event handler for the `focus` event.
-   */
-  onFocus: PropTypes.func,
-
-  /**
-   * The event handler for the `mouseenter` event.
-   */
-  onMouseEnter: PropTypes.func,
-
-  /**
-   * The event handler for the `mouseleave` event.
-   */
-  onMouseLeave: PropTypes.func,
-
-  /**
-   * Provide the text that will be displayed in the tooltip when it is rendered.
-   * TODO: rename this prop (will be a breaking change)
-   */
-  tooltipText: PropTypes.node.isRequired,
-
-  /**
-   * The CSS class name of the trigger element
-   */
-  triggerClassName: PropTypes.string
-};
-TooltipDefinition.defaultProps = {
-  direction: 'bottom',
-  align: 'start'
-};
-var TooltipDefinition$1 = TooltipDefinition;
-
-export { TooltipDefinition$1 as default };

package/es/components/TooltipIcon/TooltipIcon.js

@@ -1,235 +0,0 @@
-/**
- * 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.
- */
-
-import { objectWithoutProperties as _objectWithoutProperties, slicedToArray as _slicedToArray, defineProperty as _defineProperty, extends as _extends, toConsumableArray as _toConsumableArray } from '../../_virtual/_rollupPluginBabelHelpers.js';
-import cx from 'classnames';
-import React__default, { useState, useRef, useEffect } from 'react';
-import PropTypes from 'prop-types';
-import setupGetInstanceId from '../../tools/setupGetInstanceId.js';
-import { composeEventHandlers } from '../../tools/events.js';
-import toggleClass from '../../tools/toggleClass.js';
-import { usePrefix } from '../../internal/usePrefix.js';
-import { matches } from '../../internal/keyboard/match.js';
-import { Escape } from '../../internal/keyboard/keys.js';
-
-var _excluded = ["id", "className", "children", "direction", "disabled", "align", "onClick", "onBlur", "onFocus", "onMouseEnter", "onMouseLeave", "renderIcon", "tooltipText"];
-var getInstanceId = setupGetInstanceId();
-
-var TooltipIcon = function TooltipIcon(_ref) {
-  var _cx;
-
-  var id = _ref.id,
-      className = _ref.className,
-      children = _ref.children,
-      direction = _ref.direction,
-      disabled = _ref.disabled,
-      align = _ref.align,
-      onClick = _ref.onClick,
-      onBlur = _ref.onBlur,
-      onFocus = _ref.onFocus,
-      onMouseEnter = _ref.onMouseEnter,
-      onMouseLeave = _ref.onMouseLeave,
-      IconElement = _ref.renderIcon,
-      tooltipText = _ref.tooltipText,
-      rest = _objectWithoutProperties(_ref, _excluded);
-
-  var prefix = usePrefix();
-
-  var _useState = useState(true),
-      _useState2 = _slicedToArray(_useState, 2),
-      allowTooltipVisibility = _useState2[0],
-      setAllowTooltipVisibility = _useState2[1];
-
-  var _useState3 = useState(false),
-      _useState4 = _slicedToArray(_useState3, 2),
-      isHovered = _useState4[0],
-      setIsHovered = _useState4[1];
-
-  var _useState5 = useState(false),
-      _useState6 = _slicedToArray(_useState5, 2),
-      isFocused = _useState6[0],
-      setIsFocused = _useState6[1];
-
-  var tooltipRef = useRef(null);
-  var tooltipTimeout = useRef(null);
-  var tooltipId = id || "icon-tooltip-".concat(getInstanceId());
-  var tooltipTriggerClasses = cx("".concat(prefix, "--tooltip__trigger"), "".concat(prefix, "--tooltip--a11y"), className, (_cx = {}, _defineProperty(_cx, "".concat(prefix, "--tooltip--").concat(direction), direction), _defineProperty(_cx, "".concat(prefix, "--tooltip--align-").concat(align), align), _defineProperty(_cx, "".concat(prefix, "--tooltip--hidden"), !allowTooltipVisibility || disabled), _defineProperty(_cx, "".concat(prefix, "--tooltip--visible"), isHovered), _cx));
-
-  var closeTooltips = function closeTooltips(evt) {
-    var _document;
-
-    var tooltipNode = (_document = document) === null || _document === void 0 ? void 0 : _document.querySelectorAll(".".concat(prefix, "--tooltip--a11y"));
-
-    _toConsumableArray(tooltipNode).map(function (node) {
-      toggleClass(node, "".concat(prefix, "--tooltip--hidden"), node !== evt.currentTarget);
-    });
-  };
-
-  var handleFocus = function handleFocus(evt) {
-    closeTooltips(evt);
-    setIsFocused(true);
-    setAllowTooltipVisibility(true);
-  };
-
-  var handleBlur = function handleBlur() {
-    setIsHovered(false);
-    setIsFocused(false);
-    setAllowTooltipVisibility(false);
-  };
-
-  var handleMouseEnter = function handleMouseEnter(evt) {
-    if (!disabled) {
-      tooltipTimeout.current && clearTimeout(tooltipTimeout.current);
-
-      if (evt.target === tooltipRef.current) {
-        setAllowTooltipVisibility(true);
-        return;
-      }
-
-      closeTooltips(evt);
-      setAllowTooltipVisibility(true);
-    }
-  };
-
-  var handleMouseLeave = function handleMouseLeave() {
-    if (!isFocused) {
-      tooltipTimeout.current = setTimeout(function () {
-        setAllowTooltipVisibility(false);
-        setIsHovered(false);
-      }, 100);
-    }
-  };
-
-  var handleClick = function handleClick(evt) {
-    setAllowTooltipVisibility(false); // Prevent clicks on the tooltip from triggering the button click event
-
-    if (evt.target === tooltipRef.current) {
-      evt.preventDefault();
-      return;
-    }
-  };
-
-  useEffect(function () {
-    var handleEscKeyDown = function handleEscKeyDown(event) {
-      if (matches(event, [Escape])) {
-        setAllowTooltipVisibility(false);
-        setIsHovered(false);
-      }
-    };
-
-    document.addEventListener('keydown', handleEscKeyDown);
-    return function () {
-      return document.removeEventListener('keydown', handleEscKeyDown);
-    };
-  }, []);
-  var cursorStyle;
-
-  if (disabled) {
-    cursorStyle = 'not-allowed';
-  } else {
-    cursorStyle = onClick ? 'pointer' : 'default';
-  }
-
-  return /*#__PURE__*/React__default.createElement("button", _extends({
-    disabled: disabled,
-    style: {
-      cursor: cursorStyle
-    }
-  }, rest, {
-    type: "button",
-    className: tooltipTriggerClasses,
-    "aria-describedby": tooltipId,
-    onMouseEnter: composeEventHandlers([onMouseEnter, handleMouseEnter]),
-    onMouseLeave: composeEventHandlers([onMouseLeave, handleMouseLeave]),
-    onFocus: composeEventHandlers([onFocus, handleFocus]),
-    onBlur: composeEventHandlers([onBlur, handleBlur]),
-    onClick: composeEventHandlers([handleClick, onClick])
-  }), /*#__PURE__*/React__default.createElement("span", {
-    ref: tooltipRef,
-    onMouseEnter: handleMouseEnter,
-    className: "".concat(prefix, "--assistive-text"),
-    id: tooltipId
-  }, tooltipText), IconElement && /*#__PURE__*/React__default.createElement(IconElement, null), !IconElement && children);
-};
-
-TooltipIcon.propTypes = {
-  /**
-   * Specify the alignment (to the trigger button) of the tooltip.
-   * Can be one of: start, center, or end.
-   */
-  align: PropTypes.oneOf(['start', 'center', 'end']),
-
-  /**
-   * Specify an icon as children that will be used as the tooltip trigger. This
-   * can be an icon from our Icon component, or a custom SVG element.
-   */
-  children: PropTypes.node,
-
-  /**
-   * Specify an optional className to be applied to the trigger node
-   */
-  className: PropTypes.string,
-
-  /**
-   * Specify the direction of the tooltip. Can be either top or bottom.
-   */
-  direction: PropTypes.oneOf(['top', 'right', 'left', 'bottom']),
-
-  /**
-   * Specify whether the `<TooltipIcon>` should be disabled
-   */
-  disabled: PropTypes.bool,
-
-  /**
-   * Optionally specify a custom id for the tooltip. If one is not provided, we
-   * generate a unique id for you.
-   */
-  id: PropTypes.string,
-
-  /**
-   * The event handler for the `blur` event.
-   */
-  onBlur: PropTypes.func,
-
-  /**
-   * The event handler for the `click` event.
-   */
-  onClick: PropTypes.func,
-
-  /**
-   * The event handler for the `focus` event.
-   */
-  onFocus: PropTypes.func,
-
-  /**
-   * The event handler for the `mouseenter` event.
-   */
-  onMouseEnter: PropTypes.func,
-
-  /**
-   * The event handler for the `mouseleave` event.
-   */
-  onMouseLeave: PropTypes.func,
-
-  /**
-   * Function called to override icon rendering.
-   */
-  renderIcon: PropTypes.oneOfType([PropTypes.func, PropTypes.object]),
-
-  /**
-   * Provide the ARIA label for the tooltip.
-   * TODO: rename this prop (will be a breaking change)
-   */
-  tooltipText: PropTypes.node.isRequired
-};
-TooltipIcon.defaultProps = {
-  direction: 'bottom',
-  align: 'center'
-};
-var TooltipIcon$1 = TooltipIcon;
-
-export { TooltipIcon$1 as default };

package/es/tools/createPropAdapter.js

@@ -1,63 +0,0 @@
-/**
- * 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.
- */
-
-import { slicedToArray as _slicedToArray } from '../_virtual/_rollupPluginBabelHelpers.js';
-
-/**
- * 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.
- */
-
-/**
- * Create an adapter that converts an object of props with potentially deprecated
- * prop names to the replacement prop names in a newer version. Useful for guarding
- * against breaking changes when a prop has been renamed
- *
- * @param {Array} spec - an array of options which specify a text or regex
- * matcher alongside a replacement if there is a match
- * @returns {Function}
- */
-function createPropAdapter(spec) {
-  // if props aren't passed in we should default the prop to empty object
-  return function () {
-    var input = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
-    var output = {};
-    Object.keys(input).forEach(function (key) {
-      var match = spec.find(function (_ref) {
-        var _ref2 = _slicedToArray(_ref, 1),
-            regex = _ref2[0];
-
-        return key.match(regex);
-      });
-
-      if (match) {
-        var _match = _slicedToArray(match, 2),
-            regex = _match[0],
-            replacer = _match[1];
-
-        output[key.replace(regex, replacer)] = input[key];
-        return;
-      }
-
-      output[key] = input[key];
-    });
-    return output;
-  };
-}
-/**
- * TODO: REMOVE IN v11
- * props staring with "default..." were changed to "initial..." in Downshift v3
- *
- * @see https://github.com/downshift-js/downshift/releases/tag/v3.0.0
- */
-
-
-var mapDownshiftProps = createPropAdapter([[/^default/g, 'initial']]);
-
-export { mapDownshiftProps };