@prosperitainova/dumbo-react-native/lib/commonjs/components/DataTable/DataTableCell.js

Dumbo for React Native Library

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.DataTableCell = void 0;
var _react = _interopRequireDefault(require("react"));
var _reactNative = require("react-native");
var _colors = require("../../styles/colors");
var _helpers = require("../../helpers");
var _Text = require("../Text");
var _jsxRuntime = require("react/jsx-runtime");
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
/** Props for DataTableCell component */

/**
 * DataTableCell component for rendering a data table cell.
 * Used as a child of DataTable
 *
 * {@link https://github.com/carbon-design-system/carbon-react-native/blob/main/example/src/Views/DataTable.tsx | Example code}
 */
class DataTableCell extends _react.default.Component {
  get styles() {
    const {
      noPadding
    } = this.props;
    return _reactNative.StyleSheet.create({
      wrapper: {
        padding: noPadding ? 0 : 16,
        paddingBottom: noPadding ? 0 : 15,
        paddingTop: noPadding ? 0 : 15,
        flex: 1,
        justifyContent: 'center'
      }
    });
  }
  get content() {
    const {
      content,
      type,
      breakMode
    } = this.props;
    if (typeof content === 'string') {
      switch (type) {
        case 'header':
          return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Text.Text, {
            type: "heading-compact-01",
            text: content,
            breakMode: breakMode || 'tail'
          });
        case 'default':
        default:
          return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Text.Text, {
            type: "body-compact-01",
            text: content,
            breakMode: breakMode || 'tail'
          });
      }
    } else {
      return content;
    }
  }
  getStateStyle = state => {
    return state.pressed ? {
      backgroundColor: (0, _colors.getColor)('layerActive01')
    } : undefined;
  };
  render() {
    const {
      componentProps,
      style,
      type,
      onPress,
      onLongPress,
      cellText,
      content,
      width
    } = this.props;
    const finalStyles = (0, _helpers.styleReferenceBreaker)(this.styles.wrapper, style);
    if (type === 'header') {
      finalStyles.backgroundColor = (0, _colors.getColor)('layerAccent01');
    }
    finalStyles.maxWidth = width;
    const finalProps = {
      ...(componentProps || {}),
      onPress: onPress,
      onLongPress: onLongPress,
      accessibilityLabel: cellText || typeof content === 'string' ? String(content) : undefined
    };
    if (typeof onPress === 'function' || typeof onLongPress === 'function') {
      return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Pressable, {
        ...finalProps,
        style: state => (0, _helpers.pressableFeedbackStyle)(state, finalStyles, this.getStateStyle),
        children: this.content
      });
    } else {
      return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
        ...finalProps,
        style: finalStyles,
        children: this.content
      });
    }
  }
}
exports.DataTableCell = DataTableCell;
//# sourceMappingURL=DataTableCell.js.map