@nexara/nativeflow/lib/commonjs/components/Chip/Chip.js

Beautiful, responsive, and customizable UI components for React Native – built for performance and seamless experiences.

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;
var _react = _interopRequireDefault(require("react"));
var _reactNative = require("react-native");
var _index = require("../StyledComponents/index.js");
var _ResponsiveCalculations = require("../../helpers/ResponsiveCalculations.js");
var _index2 = require("../../hooks/index.js");
var _utils = require("./utils.js");
var _jsxRuntime = require("react/jsx-runtime");
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
const Chip = ({
  label = 'Chip',
  labelColor,
  fs,
  fScale = 'sm',
  ff,
  bg,
  br = 7,
  gap = 7,
  paddingV = 6,
  paddingH = 15,
  stroke = 0.8,
  strokeColor,
  rippleColor,
  disabled = false,
  renderLeftIcon,
  renderRightIcon,
  containerStyle,
  textStyle,
  active = false,
  ...rest
}) => {
  const theme = (0, _index2.useTheme)();
  const {
    buttonTextColor,
    buttonBorderColor,
    backgroundColor
  } = (0, _utils.getChipColors)({
    theme,
    bg,
    labelColor,
    strokeColor,
    disabled,
    active
  });
  const STYLES = _reactNative.StyleSheet.create({
    CONTAINER: {
      flexDirection: 'row',
      alignItems: 'center',
      borderWidth: stroke,
      borderColor: buttonBorderColor,
      backgroundColor: backgroundColor,
      borderRadius: (0, _ResponsiveCalculations.verticalScale)(br),
      paddingVertical: (0, _ResponsiveCalculations.verticalScale)(paddingV),
      paddingLeft: (0, _ResponsiveCalculations.horizontalScale)((renderLeftIcon && paddingH / 2) ?? paddingH),
      paddingRight: (0, _ResponsiveCalculations.horizontalScale)((renderRightIcon && paddingH / 2) ?? paddingH),
      gap: (0, _ResponsiveCalculations.horizontalScale)(gap)
    },
    TEXT: {
      color: buttonTextColor
    }
  });
  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.StyledView, {
      alignSelf: "flex-start",
      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.TouchableOpacity, {
        disabled: disabled,
        ...rest,
        children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_index.StyledView, {
          style: [STYLES.CONTAINER, containerStyle],
          children: [/*#__PURE__*/_react.default.isValidElement(renderLeftIcon) && renderLeftIcon, /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.StyledText, {
            fScale: fScale,
            ff: ff,
            fs: fs,
            style: [STYLES.TEXT, textStyle],
            children: label
          }), /*#__PURE__*/_react.default.isValidElement(renderRightIcon) && renderRightIcon]
        })
      })
    })
  });
};
var _default = exports.default = Chip;
//# sourceMappingURL=Chip.js.map