UNPKG

@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
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