@salesforce/design-system-react/lib/components/icon/button-icon/index.js

Salesforce Lightning Design System for React

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;

var _react = _interopRequireDefault(require("react"));

var _propTypes = _interopRequireDefault(require("prop-types"));

var _classnames = _interopRequireDefault(require("classnames"));

var _checkProps = _interopRequireDefault(require("./check-props"));

var _utilityIcon = _interopRequireDefault(require("../../utilities/utility-icon"));

var _constants = require("../../../utilities/constants");

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }

function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }

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 _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }

function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }

/**
 * This is a non-interactive wrapper component for `UtilityIcon` that specifies button icon classes for an icon inside a `button` tag. Use of this component by itself is not recommended, but should be used as part of other components to obtain the correct styling for icons within buttons. This component only partially implements [Button Icons](http://www.lightningdesignsystem.com/components/button-icons). It does not return a `button` HTML tag. It only returns an icon for use within a button. Assistive text must also be rendered by the parent.
 */
var ButtonIcon = function ButtonIcon(_ref) {
  var _classNames;

  var _ref$category = _ref.category,
      category = _ref$category === void 0 ? 'utility' : _ref$category,
      _ref$size = _ref.size,
      size = _ref$size === void 0 ? 'medium' : _ref$size,
      hint = _ref.hint,
      icon = _ref.icon,
      className = _ref.className,
      inverse = _ref.inverse,
      name = _ref.name,
      path = _ref.path,
      position = _ref.position,
      rest = _objectWithoutProperties(_ref, ["category", "size", "hint", "icon", "className", "inverse", "name", "path", "position"]);

  (0, _checkProps.default)(_constants.BUTTON_ICON, _objectSpread({
    category: category,
    size: size,
    hint: hint,
    icon: icon,
    className: className,
    inverse: inverse,
    name: name,
    path: path,
    position: position
  }, rest));
  return /*#__PURE__*/_react.default.createElement(_utilityIcon.default, {
    "aria-hidden": "true",
    category: category,
    className: (0, _classnames.default)('slds-button__icon', (_classNames = {}, _defineProperty(_classNames, "slds-button__icon_".concat(size), size && size !== 'medium'), _defineProperty(_classNames, 'slds-button__icon_inverse-hint', inverse && hint), _defineProperty(_classNames, 'slds-button__icon_hint', hint && !inverse), _defineProperty(_classNames, "slds-button__icon_".concat(position), position), _classNames), className) // iconClassName has been deprecated
    ,
    icon: icon,
    name: name,
    path: path
  });
};

var propTypes = {
  /**
   * Icon category from [lightningdesignsystem.com/icons/](https://www.lightningdesignsystem.com/icons/)
   */
  category: _propTypes.default.oneOf(['action', 'custom', 'doctype', 'standard', 'utility']),

  /**
   * Associates an icon button with another element on the page by changes the color of the SVG. Please reference <a href="http://www.lightningdesignsystem.com/components/buttons/#hint">Lightning Design System Buttons > Hint</a>.
   */
  hint: _propTypes.default.bool,

  /**
   * An SVG object to use instead of name / category, look in `design-system-react/icons` for examples
   */
  icon: _propTypes.default.object,

  /**
   * Class names to be added to the SVG.
   */
  className: _propTypes.default.oneOfType([_propTypes.default.array, _propTypes.default.object, _propTypes.default.string]),

  /**
   * Setting `inverse` to true will switch the color of the icon: light to dark, dark to light.
   */
  inverse: _propTypes.default.bool,

  /**
   * Name of the icon. Visit <a href='http://www.lightningdesignsystem.com/resources/icons'>Lightning Design System Icons</a> to reference icon names.
   */
  name: _propTypes.default.string,

  /**
   * Path to the icon. This will override any global icon settings.
   */
  path: _propTypes.default.string,

  /**
   * Adds additional spacing on the opposite side specified between button icon and the button label
   */
  position: _propTypes.default.oneOf(['left', 'right']),

  /**
   * Size of the icon. Visit [lightningdesignsystem.com/components/icons/#flavor-sizes](https://www.lightningdesignsystem.com/components/icons/#flavor-sizes)
   */
  size: _propTypes.default.oneOf(['x-small', 'small', 'medium', 'large'])
};
ButtonIcon.displayName = _constants.BUTTON_ICON;
ButtonIcon.propTypes = propTypes;
var _default = ButtonIcon;
exports.default = _default;