@kubit-ui-web/react-components
Version:
Kubit React Components is a customizable, accessible library of React web components, designed to enhance your application's user experience
22 lines • 1.87 kB
JavaScript
;
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.ValidationStatusStandAlone = void 0;
const jsx_runtime_1 = require("react/jsx-runtime");
const react_1 = __importDefault(require("react"));
const elementOrIcon_1 = require("../elementOrIcon/elementOrIcon");
const text_1 = require("../text/text");
const validationStatusTheme_1 = require("./types/validationStatusTheme");
const validationStatus_styled_1 = require("./validationStatus.styled");
const maxItems = 6;
const ValidationStatusStandAloneComponent = ({ maxItemsAllowed = maxItems, dataTestId = 'validation-status', ...props }, ref) => {
const itemsLimited = props.items.length > maxItemsAllowed ? props.items.slice(0, maxItemsAllowed) : props.items;
return ((0, jsx_runtime_1.jsx)(validationStatus_styled_1.ValidationStatusFrame, { ref: ref, "data-testid": dataTestId, styles: props.styles, children: itemsLimited.map((item, index) => {
const checked = item.state === validationStatusTheme_1.ValidationStatusState.SUCCESS;
return ((0, jsx_runtime_1.jsxs)(validationStatus_styled_1.ValidationStatusRow, { "data-testid": item.dataTestId, role: item.role, styles: props.styles, children: [(0, jsx_runtime_1.jsx)(elementOrIcon_1.ElementOrIcon, { "aria-checked": checked, customIconStyles: props.styles[item.state]?.icon, ...props.stateIcons[item.state] }), (0, jsx_runtime_1.jsx)(text_1.Text, { customTypography: props.styles[item.state]?.explainText, ...item.text, children: item.text.content })] }, `${item.text.content}--${index}`));
}) }));
};
exports.ValidationStatusStandAlone = react_1.default.forwardRef(ValidationStatusStandAloneComponent);
//# sourceMappingURL=validationStatusStandAlone.js.map