@smart-react-components/ui
Version:
SRC UI includes React and Styled components.
65 lines (64 loc) • 3.72 kB
JavaScript
"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
const element_props_1 = __importDefault(require("@smart-react-components/core/element-props"));
const click_events_1 = __importDefault(require("@smart-react-components/core/element-props/click-events"));
const intrinsic_styled_core_props_1 = __importDefault(require("@smart-react-components/core/element-props/intrinsic-styled-core-props"));
const intrinsic_styled_position_props_1 = __importDefault(require("@smart-react-components/core/element-props/intrinsic-styled-position-props"));
const useChangeEffect_1 = __importDefault(require("@smart-react-components/core/hooks/useChangeEffect"));
const react_1 = __importDefault(require("react"));
const types_1 = require("../types");
const BadgeContent_1 = __importDefault(require("../components/Badge/BadgeContent"));
const BadgeElement_1 = __importDefault(require("../components/Badge/BadgeElement"));
const props_1 = require("../util/props");
const Badge = props => {
const getContent = () => {
var _a, _b;
const children = !Array.isArray(props.children) ? [props.children] : props.children;
const content = [];
let iconLeft = null;
let iconRight = null;
for (let i = 0; i < children.length; i++) {
const item = children[i];
if (((_a = item.type) === null || _a === void 0 ? void 0 : _a.displayName) === 'SRCBadgeIcon') {
const iconEl = react_1.default.cloneElement(item, {
isOutline: props.isOutline,
isSoft: props.isSoft,
palette: props.palette,
position: i === 0 ? types_1.OrderPosition.LEFT : types_1.OrderPosition.RIGHT,
shape: props.shape,
});
if (i === 0) {
iconLeft = iconEl;
}
else if (i === children.length - 1) {
iconRight = iconEl;
}
continue;
}
content.push(typeof children[i] === 'string' ? children[i] : react_1.default.cloneElement(item, { key: (_b = item.key) !== null && _b !== void 0 ? _b : i }));
}
return {
children: (react_1.default.createElement(react_1.default.Fragment, null,
iconLeft && iconLeft,
react_1.default.createElement(BadgeContent_1.default, null, content),
iconRight && iconRight)),
hasIconLeft: !!iconLeft,
hasIconRight: !!iconRight,
};
};
const [{ children, hasIconLeft, hasIconRight }, setContent] = react_1.default.useState(() => getContent());
(0, useChangeEffect_1.default)(() => {
setContent(getContent());
}, [props.children]);
return (react_1.default.createElement(BadgeElement_1.default, Object.assign({ badgeSize: props.size, badgeSizeSm: props.sizeSm, badgeSizeMd: props.sizeMd, badgeSizeLg: props.sizeLg, badgeSizeXl: props.sizeXl, hasIconLeft: hasIconLeft, hasIconRight: hasIconRight, hasSpace: props.hasSpace, isClickable: (0, props_1.isItemClickable)(props), isFixedSize: props.isFixedSize, isOutline: props.isOutline, isSoft: props.isSoft, palette: props.palette, shape: props.shape }, (0, element_props_1.default)(props, [click_events_1.default, intrinsic_styled_core_props_1.default, intrinsic_styled_position_props_1.default]), props.elementProps), children));
};
Badge.defaultProps = {
elementProps: {},
palette: 'primary',
shape: 'rectangle',
size: 'medium',
};
exports.default = Badge;