@ozen-ui/kit

Version:
React component library
49 lines (48 loc) • 3.02 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.SectionMessage = exports.cnSectionMessage = void 0;
var tslib_1 = require("tslib");
require("./modules/SectionMessageButton/SectionMessageButton.css");
require("./SectionMessage.css");
var react_1 = tslib_1.__importStar(require("react"));
var useThemeProps_1 = require("../../hooks/useThemeProps");
var utils_1 = require("../../utils");
var config_1 = require("./config");
var constants_1 = require("./constants");
var SectionMessageContext_1 = require("./SectionMessageContext");
exports.cnSectionMessage = (0, utils_1.cn)('SectionMessage');
exports.SectionMessage = (0, react_1.forwardRef)(function (inProps, ref) {
    var props = (0, useThemeProps_1.useThemeProps)({
        props: inProps,
        name: 'SectionMessage',
    });
    var _a = props.status, status = _a === void 0 ? constants_1.SECTION_MESSAGE_DEFAULT_STATUS : _a, _b = props.size, size = _b === void 0 ? constants_1.SECTION_MESSAGE_DEFAULT_SIZE : _b, _c = props.showIcon, showIcon = _c === void 0 ? true : _c, iconProp = props.icon, children = props.children, action = props.action, title = props.title, className = props.className, otherProps = tslib_1.__rest(props, ["status", "size", "showIcon", "icon", "children", "action", "title", "className"]);
    var icon = (0, utils_1.renderContent)({
        content: iconProp !== null && iconProp !== void 0 ? iconProp : config_1.SECTION_MESSAGE_ICON_BY_STATUS[status],
        props: { size: constants_1.SECTION_MESSAGE_SIZE_TO_ICON_SIZE[size] },
    });
    var resolveAction = function (action) {
        var actionProps = {
            variant: 'function',
            size: size,
            className: (0, exports.cnSectionMessage)('Button'),
        };
        if (!action) {
            return null;
        }
        if (typeof action === 'function') {
            return action(actionProps);
        }
        return react_1.default.cloneElement(action, actionProps);
    };
    return (react_1.default.createElement(SectionMessageContext_1.SectionMessageContext.Provider, { value: {
            size: size,
        } },
        react_1.default.createElement("div", tslib_1.__assign({ className: (0, exports.cnSectionMessage)({ status: status, size: size }, [className]), role: "alert" }, otherProps, { ref: ref }),
            showIcon && react_1.default.createElement("div", { className: (0, exports.cnSectionMessage)('Icon') }, icon),
            react_1.default.createElement("div", { className: (0, exports.cnSectionMessage)('Content') },
                title && react_1.default.createElement("div", { className: (0, exports.cnSectionMessage)('Title') }, title),
                children && (react_1.default.createElement("div", { className: (0, exports.cnSectionMessage)('Body') }, children)),
                action && (react_1.default.createElement("div", { className: (0, exports.cnSectionMessage)('Action') }, resolveAction(action)))))));
});
exports.SectionMessage.displayName = 'SectionMessage';