react-cm-ui/core/dataDisplay/table/tableCell.js

React UI for Healthy Church

"use strict";

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

var _lodash = require("lodash");

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

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

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

var _utils = _interopRequireDefault(require("../../utils/utils"));

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

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

var columnNumberEnums = ['auto', 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12];
var propTypes = {
  active: _propTypes["default"].bool,
  children: _propTypes["default"].node,
  className: _propTypes["default"].string,
  collapsing: _propTypes["default"].bool,
  desktop: _propTypes["default"].oneOfType([_propTypes["default"].bool, _propTypes["default"].oneOf(columnNumberEnums)]),
  desktopLarge: _propTypes["default"].oneOfType([_propTypes["default"].bool, _propTypes["default"].oneOf(columnNumberEnums)]),

  /**
   * Deprecated prop. Please use `disabled` instead.
   */
  disable: _propTypes["default"].bool,

  /**
   * A TableCell can be disabled.
   */
  disabled: _propTypes["default"].bool,
  fontSize: _propTypes["default"].oneOf(['large', 'medium', 'small', 'xsmall']),
  id: _propTypes["default"].string,
  laptop: _propTypes["default"].oneOfType([_propTypes["default"].bool, _propTypes["default"].oneOf(columnNumberEnums)]),
  mobile: _propTypes["default"].oneOfType([_propTypes["default"].bool, _propTypes["default"].oneOf(columnNumberEnums)]),
  mobileLarge: _propTypes["default"].oneOfType([_propTypes["default"].bool, _propTypes["default"].oneOf(columnNumberEnums)]),
  mobileMedium: _propTypes["default"].oneOfType([_propTypes["default"].bool, _propTypes["default"].oneOf(columnNumberEnums)]),
  selectable: _propTypes["default"].bool,
  singleLine: _propTypes["default"].bool,
  sticky: _propTypes["default"].bool,
  style: _propTypes["default"].shape({}),
  tablet: _propTypes["default"].oneOfType([_propTypes["default"].bool, _propTypes["default"].oneOf(columnNumberEnums)]),
  textAlign: _propTypes["default"].oneOf(['center', 'left', 'right']),
  verticalAlign: _propTypes["default"].oneOf(['bottom', 'middle', 'top']),
  width: _propTypes["default"].oneOfType([_propTypes["default"].bool, _propTypes["default"].oneOf(columnNumberEnums)])
};
var defaultProps = {
  active: false,
  children: null,
  className: null,
  collapsing: false,
  desktop: null,
  desktopLarge: null,
  disable: false,
  disabled: false,
  fontSize: null,
  id: null,
  laptop: null,
  mobile: null,
  mobileLarge: null,
  mobileMedium: null,
  selectable: false,
  singleLine: false,
  sticky: false,
  style: null,
  tablet: null,
  textAlign: null,
  verticalAlign: null,
  width: null
};

function TableCell(props) {
  var _ClassNames;

  var active = props.active,
      children = props.children,
      className = props.className,
      collapsing = props.collapsing,
      desktop = props.desktop,
      desktopLarge = props.desktopLarge,
      disable = props.disable,
      disabled = props.disabled,
      fontSize = props.fontSize,
      id = props.id,
      mobile = props.mobile,
      mobileMedium = props.mobileMedium,
      mobileLarge = props.mobileLarge,
      laptop = props.laptop,
      selectable = props.selectable,
      singleLine = props.singleLine,
      sticky = props.sticky,
      style = props.style,
      tablet = props.tablet,
      textAlign = props.textAlign,
      verticalAlign = props.verticalAlign,
      width = props.width;
  var cellPrefix = 'table-cell';
  var containerClasses = (0, _classnames["default"])('table-cell', (_ClassNames = {
    'table-cell-active': active,
    'table-cell-collapsing': collapsing,
    'table-cell-disabled': disable || disabled,
    'table-cell-font-size-large': fontSize === 'large',
    'table-cell-font-size-medium': fontSize === 'medium',
    'table-cell-font-size-small': fontSize === 'small',
    'table-cell-font-size-xsmall': fontSize === 'xsmall',
    'table-cell-selectable': selectable,
    'table-cell-single-line': singleLine,
    'table-cell-text-align-center': textAlign === 'center',
    'table-cell-text-align-left': textAlign === 'left',
    'table-cell-text-align-right': textAlign === 'right',
    'table-cell-vertical-align-bottom': verticalAlign === 'bottom',
    'table-cell-vertical-align-middle': verticalAlign === 'middle',
    'table-cell-vertical-align-top': verticalAlign === 'top',
    'table-cell-sticky': sticky
  }, _defineProperty(_ClassNames, "".concat(cellPrefix, "-").concat(_utils["default"].numberToWord(width)), (0, _lodash.isNumber)(width)), _defineProperty(_ClassNames, "".concat(cellPrefix, "-show"), width === true || width === 'auto'), _defineProperty(_ClassNames, "".concat(cellPrefix, "-hide"), width === false), _defineProperty(_ClassNames, "".concat(cellPrefix, "-mobile-").concat(_utils["default"].numberToWord(mobile)), (0, _lodash.isNumber)(mobile)), _defineProperty(_ClassNames, "".concat(cellPrefix, "-mobile-show"), mobile === true || mobile === 'auto'), _defineProperty(_ClassNames, "".concat(cellPrefix, "-mobile-hide"), mobile === false), _defineProperty(_ClassNames, "".concat(cellPrefix, "-mobile-medium-").concat(_utils["default"].numberToWord(mobileMedium)), (0, _lodash.isNumber)(mobileMedium)), _defineProperty(_ClassNames, "".concat(cellPrefix, "-mobile-medium-show"), mobileMedium === true || mobileMedium === 'auto'), _defineProperty(_ClassNames, "".concat(cellPrefix, "-mobile-medium-hide"), mobileMedium === false), _defineProperty(_ClassNames, "".concat(cellPrefix, "-mobile-large-").concat(_utils["default"].numberToWord(mobileLarge)), (0, _lodash.isNumber)(mobileLarge)), _defineProperty(_ClassNames, "".concat(cellPrefix, "-mobile-large-show"), mobileLarge === true || mobileLarge === 'auto'), _defineProperty(_ClassNames, "".concat(cellPrefix, "-mobile-large-hide"), mobileLarge === false), _defineProperty(_ClassNames, "".concat(cellPrefix, "-tablet-").concat(_utils["default"].numberToWord(tablet)), (0, _lodash.isNumber)(tablet)), _defineProperty(_ClassNames, "".concat(cellPrefix, "-tablet-show"), tablet === true || tablet === 'auto'), _defineProperty(_ClassNames, "".concat(cellPrefix, "-tablet-hide"), tablet === false), _defineProperty(_ClassNames, "".concat(cellPrefix, "-laptop-").concat(_utils["default"].numberToWord(laptop)), (0, _lodash.isNumber)(laptop)), _defineProperty(_ClassNames, "".concat(cellPrefix, "-laptop-show"), laptop === true || laptop === 'auto'), _defineProperty(_ClassNames, "".concat(cellPrefix, "-laptop-hide"), laptop === false), _defineProperty(_ClassNames, "".concat(cellPrefix, "-desktop-").concat(_utils["default"].numberToWord(desktop)), (0, _lodash.isNumber)(desktop)), _defineProperty(_ClassNames, "".concat(cellPrefix, "-desktop-show"), desktop === true || desktop === 'auto'), _defineProperty(_ClassNames, "".concat(cellPrefix, "-desktop-hide"), desktop === false), _defineProperty(_ClassNames, "".concat(cellPrefix, "-desktop-").concat(_utils["default"].numberToWord(desktopLarge)), (0, _lodash.isNumber)(desktopLarge)), _defineProperty(_ClassNames, "".concat(cellPrefix, "-desktop-show"), desktopLarge === true || desktopLarge === 'auto'), _defineProperty(_ClassNames, "".concat(cellPrefix, "-desktop-hide"), desktopLarge === false), _ClassNames), className);
  return /*#__PURE__*/_react["default"].createElement("td", {
    className: containerClasses,
    id: id,
    style: style
  }, children);
}

TableCell.propTypes = propTypes;
TableCell.defaultProps = defaultProps;
var _default = TableCell;
exports["default"] = _default;