@kubit-ui-web/react-components/dist/cjs/components/icon/icon.js

Kubit React Components is a customizable, accessible library of React web components, designed to enhance your application's user experience

"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
    return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.Icon = exports.IconBasic = void 0;
const jsx_runtime_1 = require("react/jsx-runtime");
const react_1 = __importDefault(require("react"));
const useMediaDevice_1 = require("../../hooks/useMediaDevice/useMediaDevice");
const aria_1 = require("../../utils/aria/aria");
const type_1 = require("../button/types/type");
const screenReaderOnly_1 = require("../screenReaderOnly/screenReaderOnly");
const icon_styled_1 = require("./icon.styled");
const iconStandAlone_1 = require("./iconStandAlone");
const IconBasicComponent = ({ dataTestId = 'icon', ...props }, ref) => {
    const device = (0, useMediaDevice_1.useMediaDevice)();
    const ariaProps = (0, aria_1.pickAriaProps)(props);
    const { disabled, altText, onClick, screenReaderText, ...iconProps } = props;
    const isLinearIcon = !!props.color || !!props.customIconStyles?.color || !!props.customIconStyles?.[device]?.color;
    if (!props.icon) {
        return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {});
    }
    if (props.onClick) {
        return ((0, jsx_runtime_1.jsxs)(icon_styled_1.IconButtonStyled, { ...ariaProps, "$customIconStyles": props.customIconStyles, "$height": props.height, "$width": props.width, "aria-disabled": disabled, "aria-label": props['aria-label'] || altText, "data-testid": dataTestId, disabled: disabled, id: props.id, tabIndex: props.tabIndex, title: props.title || '', type: type_1.ButtonType.BUTTON, onClick: onClick, children: [(0, jsx_runtime_1.jsx)(screenReaderOnly_1.ScreenReaderOnly, { children: screenReaderText }), (0, jsx_runtime_1.jsx)(iconStandAlone_1.IconStandAlone, { ...iconProps, ref: ref, dataTestId: undefined, id: undefined, linearIcon: isLinearIcon })] }));
    }
    return ((0, jsx_runtime_1.jsx)(iconStandAlone_1.IconStandAlone, { ...iconProps, ref: ref, altText: altText, dataTestId: dataTestId, linearIcon: isLinearIcon }));
};
exports.IconBasic = react_1.default.forwardRef(IconBasicComponent);
exports.Icon = exports.IconBasic;
//# sourceMappingURL=icon.js.map