@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
24 lines • 1.75 kB
JavaScript
import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import React from 'react';
import { useMediaDevice } from '../../hooks/useMediaDevice/useMediaDevice';
import { pickAriaProps } from '../../utils/aria/aria';
import { ButtonType } from '../button/types/type';
import { ScreenReaderOnly } from '../screenReaderOnly/screenReaderOnly';
import { IconButtonStyled } from './icon.styled';
import { IconStandAlone } from './iconStandAlone';
const IconBasicComponent = ({ dataTestId = 'icon', ...props }, ref) => {
const device = useMediaDevice();
const ariaProps = pickAriaProps(props);
const { disabled, altText, onClick, screenReaderText, ...iconProps } = props;
const isLinearIcon = !!props.color || !!props.customIconStyles?.color || !!props.customIconStyles?.[device]?.color;
if (!props.icon) {
return _jsx(_Fragment, {});
}
if (props.onClick) {
return (_jsxs(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: ButtonType.BUTTON, onClick: onClick, children: [_jsx(ScreenReaderOnly, { children: screenReaderText }), _jsx(IconStandAlone, { ...iconProps, ref: ref, dataTestId: undefined, id: undefined, linearIcon: isLinearIcon })] }));
}
return (_jsx(IconStandAlone, { ...iconProps, ref: ref, altText: altText, dataTestId: dataTestId, linearIcon: isLinearIcon }));
};
export const IconBasic = React.forwardRef(IconBasicComponent);
export { IconBasic as Icon };
//# sourceMappingURL=icon.js.map