"use strict";

exports.__esModule = true;
exports.default = void 0;

require("core-js/modules/es6.object.assign");

require("core-js/modules/web.dom.iterable");

require("core-js/modules/es6.array.iterator");

require("core-js/modules/es6.object.keys");

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

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

var _lodash = require("lodash");

var _ = require("./..");

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 _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; }

/**
 * @category controls
 * @component activity-button
 * @variations collab-ui-react
 */
var ActivityButton = function ActivityButton(props) {
  var ariaLabel = props.ariaLabel,
      className = props.className,
      disabled = props.disabled,
      large = props.large,
      onClick = props.onClick,
      type = props.type,
      otherHTMLProps = _objectWithoutPropertiesLoose(props, ["ariaLabel", "className", "disabled", "large", "onClick", "type"]);

  return _react.default.createElement(_.Button, _extends({
    ariaLabel: ariaLabel || !type.icon && type || '',
    circle: true,
    className: 'cui-activity' + ("" + (!type.icon && " cui-activity__" + type || '')) + ("" + (className && " " + className || '')),
    color: (0, _lodash.get)(type, 'color'),
    disabled: disabled,
    onClick: onClick
  }, large ? {
    size: 84,
    containerLarge: true
  } : {
    size: 68
  }, otherHTMLProps), type.icon ? type.icon : _react.default.createElement(_.Icon, {
    name: "" + type + (large ? '_36' : '_28')
  }));
};

ActivityButton.displayName = 'ActivityButton';
ActivityButton.propTypes = {
  /**
   * Text to display for blindness accessibility features
   */
  ariaLabel: _propTypes.default.string,

  /**
   * optional css class string
   */
  className: _propTypes.default.string,

  /**
   * Sets the attribute disabled to the button
   */
  disabled: _propTypes.default.bool,

  /**
   * Sets the large attribute to the button
   */
  large: _propTypes.default.bool,

  /**
   * Handler to be called when the user taps the button
   */
  onClick: _propTypes.default.func,

  /**
   *  activity prop type
   */
  type: _propTypes.default.oneOfType([_propTypes.default.oneOf(['chat', 'camera', 'meetings', 'whiteboard', 'files', 'share-screen', 'tasks']), _propTypes.default.shape({
    color: _propTypes.default.string,
    icon: _propTypes.default.element.isRequired
  })]).isRequired
};
ActivityButton.defaultProps = {
  ariaLabel: '',
  className: '',
  disabled: false,
  large: false,
  onClick: null,
  type: ''
};
var _default = ActivityButton;
/**
* @name Default Activity Button
* @description Default Activity Button.
*
* @category controls
* @component activity-button
* @section default
*
* @js

export default function ActivityButtonDefault() {
  return(
    <div className='row' style={{marginBottom: '1rem'}}>
      <div>Default</div>
      <div style={{margin: `16px`}}>
        <ActivityButton
          type='chat'
          ariaLabel='jlshjksfghjl'
          onClick={()=>{}}
          label='Chat'
        />
        <ActivityButton
          type='camera'
          onClick={()=>{}}
          label='Camera'
        />
        <ActivityButton
          type='meetings'
          onClick={()=>{}}
          label='Meetings'
        />
        <ActivityButton
          type='whiteboard'
          onClick={()=>{}}
          label='Whiteboard'
        />
        <ActivityButton
          type='files'
          onClick={()=>{}}
          label='Files'
        />
        <ActivityButton
          type='share-screen'
          onClick={()=>{}}
          label='Share'
        />
        <ActivityButton
          type='tasks'
          onClick={()=>{}}
          label='Tasks'
        />
      </div>
    </div>
  );
}

**/

/**
* @name ActivityButton with large
* @description ActivityButton with large class.
*
* @category controls
* @component activity-button
* @section large
*
* @js

export default function ActivityButtonLarge() {
  return(
    <div className='row' style={{marginBottom: '1rem'}}>
      <div>Default</div>
      <div style={{margin: `16px`}}>
        <ActivityButton
          type='chat'
          large
          onClick={()=>{}}
          label='Chat'
          ariaLabel='Chat'
        />
        <ActivityButton
          type='camera'
          large
          onClick={()=>{}}
          label='Camera'
          ariaLabel='Camera'
        />
        <ActivityButton
          type='meetings'
          large
          onClick={()=>{}}
          label='Meetings'
          ariaLabel='Meetings'
        />
        <ActivityButton
          type='whiteboard'
          large
          onClick={()=>{}}
          label='Whiteboard'
          ariaLabel='Whiteboard'
        />
        <ActivityButton
          type='files'
          large
          onClick={()=>{}}
          label='Files'
          ariaLabel='Files'
        />
        <ActivityButton
          type='share-screen'
          large
          onClick={()=>{}}
          label='Share'
          ariaLabel='Share'
        />
        <ActivityButton
          type='tasks'
          large
          onClick={()=>{}}
          label='Tasks'
          ariaLabel='Tasks'
          title='tasks'
        />
      </div>
    </div>
  );
}

**/

/**
* @name ActivityButton with custom
* @description ActivityButton with custom prop.
*
* @category controls
* @component activityButton
* @section custom
*
* @js

export default function ActivityButtonCustom() {
  return(
    <div className='row' style={{marginBottom: '1rem'}}>
      <div>Default</div>
      <div style={{margin: `16px`}}>
        <ActivityButton
          type={{
            color: 'mint',
            icon: <span className='icon icon-arrow-left_32'/>
          }}
          large
          onClick={()=>{}}
          ariaLabel='Left Arrow'
        />
        <ActivityButton
          type={{
            color: 'red',
            icon: <span className='icon icon-keyboard_16'/>
          }}
          onClick={()=>{}}
          ariaLabel='Keyboard'
        />
      </div>
    </div>
  );
}

**/

exports.default = _default;