@metamask/design-system-react-native/dist/components/BadgeCount/BadgeCount.cjs

Design System React Native

"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
    return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.BadgeCount = void 0;
const design_system_twrnc_preset_1 = require("@metamask/design-system-twrnc-preset");
const react_1 = __importDefault(require("react"));
const react_native_1 = require("react-native/index.js");
const types_1 = require("../../types/index.cjs");
const Text_1 = require("../Text/index.cjs");
const BadgeCount_constants_1 = require("./BadgeCount.constants.cjs");
const BadgeCount = ({ size = types_1.BadgeCountSize.Md, count, max = 99, textProps, twClassName = '', style, ...props }) => {
    const tw = (0, design_system_twrnc_preset_1.useTailwind)();
    const twContainerClassNames = `
    bg-error-default
    rounded-lg
    items-center
    justify-center
    self-start
    ${BadgeCount_constants_1.TWCLASSMAP_BADGECOUNT_SIZE_CONTAINER[size]}
    ${twClassName}`;
    return (<react_native_1.View style={[tw `${twContainerClassNames}`, style]} {...props}>
      <Text_1.Text variant={BadgeCount_constants_1.MAP_BADGECOUNT_SIZE_TEXTVARIANT[size]} color={Text_1.TextColor.ErrorInverse} fontWeight={Text_1.FontWeight.Medium} {...textProps} twClassName={`${BadgeCount_constants_1.MAP_BADGECOUNT_SIZE_LINEHEIGHT[size]} ${textProps?.twClassName || ''}`}>
        {count > max ? `${max}+` : `${count}`}
      </Text_1.Text>
    </react_native_1.View>);
};
exports.BadgeCount = BadgeCount;
//# sourceMappingURL=BadgeCount.cjs.map