@prosperitainova/dumbo-react-native/lib/module/components/Tile/index.js

Dumbo for React Native Library

"use strict";

import React from 'react';
import { StyleSheet, ScrollView, View, Pressable } from 'react-native';
import { getColor } from '../../styles/colors';
import { pressableFeedbackStyle, styleReferenceBreaker } from '../../helpers';
import { defaultText } from '../../constants/defaultText';

/** Props for Tile component */
import { jsx as _jsx } from "react/jsx-runtime";
/**
 * Tile component for rendering a carbon tile
 *
 * {@link https://github.com/carbon-design-system/carbon-react-native/blob/main/example/src/Views/Tile.tsx | Example code}
 */
export class Tile extends React.Component {
  get styles() {
    return StyleSheet.create({
      wrapper: {
        minHeight: 64,
        minWidth: 128,
        backgroundColor: getColor('layer01'),
        padding: 16
      },
      scrollContent: {
        padding: 16
      }
    });
  }
  getStateStyle = state => {
    return state.pressed ? {
      backgroundColor: getColor('layerActive01')
    } : undefined;
  };
  render() {
    const {
      children,
      componentProps,
      style,
      type,
      onPress,
      onLongPress,
      tileText
    } = this.props;
    const finalStyles = styleReferenceBreaker(this.styles.wrapper, style);
    switch (type) {
      case 'scroll':
        finalStyles.padding = undefined;
        return /*#__PURE__*/_jsx(ScrollView, {
          bounces: false,
          style: finalStyles,
          contentContainerStyle: this.styles.scrollContent,
          ...(componentProps || {}),
          children: children
        });
      case 'clickable':
        return /*#__PURE__*/_jsx(Pressable, {
          onPress: onPress,
          onLongPress: onLongPress,
          accessibilityRole: "button",
          accessibilityLabel: tileText || defaultText.tile,
          style: state => pressableFeedbackStyle(state, finalStyles, this.getStateStyle),
          ...(componentProps || {}),
          children: children
        });
      case 'default':
      default:
        return /*#__PURE__*/_jsx(View, {
          style: finalStyles,
          ...(componentProps || {}),
          children: children
        });
    }
  }
}
//# sourceMappingURL=index.js.map