var _excluded = ["align", "children", "className", "component", "headers", "id", "scope", "stackedTitle", "stackedClassName", "_isTableHeadChild"];
function _extends() { _extends = Object.assign ? Object.assign.bind() : 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 _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; }
import React from 'react';
import { useContext } from 'react';
import TableContext from './TableContext';
import classNames from 'classnames';
/**
 * `TableCell` dynamically renders a `<th>` or `<td>` element based on the
 * parent component or user specified `component` prop. By default `TableCell`
 * will automatically render a `<th>` element if the parent component is
 * `TableHead`, otherwise it will render a `<td>` element.
 */
export var TableCell = function TableCell(_ref) {
  var align = _ref.align,
    children = _ref.children,
    className = _ref.className,
    component = _ref.component,
    headers = _ref.headers,
    id = _ref.id,
    scope = _ref.scope,
    stackedTitle = _ref.stackedTitle,
    stackedClassName = _ref.stackedClassName,
    _isTableHeadChild = _ref._isTableHeadChild,
    tableCellProps = _objectWithoutProperties(_ref, _excluded);
  var _useContext = useContext(TableContext),
    stackable = _useContext.stackable,
    warningDisabled = _useContext.warningDisabled;
  var Component;
  if (component) {
    Component = component;
  } else {
    Component = _isTableHeadChild ? 'th' : 'td';
  }
  if (process.env.NODE_ENV !== 'production' && stackable && !warningDisabled) {
    // Provide warning message for `id` prop for cells with parent component of `TableHead`
    if (_isTableHeadChild) {
      if (!id && children) {
        console.warn('The id prop in `TableCell` is required for stackable tables. This prop is needed to assign an id to a heading in the responsive stacked view.');
      }
    } else if (Component === 'td') {
      // Provide warning message for stacktable `headers` and `stackedTitle` props
      if (!headers) {
        console.warn('The headers prop in `TableCell` is required for stackable tables. This prop is needed to associate the headings with data cells in the responsive stacked view.');
      }
      if (!stackedTitle) {
        console.warn('The stackedTitle prop in `TableCell` is required for stackable tables. This prop is displayed for the data cell in the responsive stacked view.');
      }
    }
  }
  var role = 'cell';
  if (_isTableHeadChild) {
    role = 'columnheader';
  } else if (component === 'th') {
    role = 'rowheader';
  }
  var defaultScope = scope;
  if (!defaultScope && _isTableHeadChild) {
    defaultScope = 'col';
  }
  var alignClassName = align ? "ds-u-text-align--".concat(align) : null;
  var classes = classNames(alignClassName, className);

  // The data attributes `data-title` is access by CSS to generates row header content for stacked table
  return /*#__PURE__*/React.createElement(Component, _extends({
    className: classes,
    role: role,
    scope: defaultScope,
    headers: headers,
    id: id,
    "data-title": stackedTitle
  }, tableCellProps), children);
};
TableCell.defaultProps = {
  align: 'left'
};
export default TableCell;