@kubit-ui-web/react-components/dist/esm/components/link/link.js

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

import { jsx as _jsx } from "react/jsx-runtime";
import React from 'react';
import { STYLES_NAME } from '../../constants/stylesName/stylesName';
import { useManageState } from '../../hooks/useManageState/useManageState';
import { useStyles } from '../../hooks/useStyles/useStyles';
import { useStylesV2 } from '../../hooks/useStyles/useStylesV2';
import { useGenericComponents } from '../../provider/genericComponents/genericComponentsProvider';
import { ErrorBoundary } from '../../provider/errorBoundary/errorBoundary';
import { FallbackComponent } from '../../provider/errorBoundary/fallbackComponent';
import { TextDecorationType } from '../text/types/decoration';
import { disabledLink } from './helpers/disabled';
import { LinkStandAlone } from './linkStandAlone';
import { LinkActionType } from './types/action';
import { LinkStateType } from './types/state';
const LinkComponent = React.forwardRef(({ action = LinkActionType.NAVIGATION, decoration = TextDecorationType.AUTO, alignCenter = false, disabled = false, color: colorLinkProp, textVariant, role: roleProp, variant, ctv, ...props }, ref) => {
    const { LINK: genericLinkComponent } = useGenericComponents();
    const { role } = disabledLink(disabled, roleProp);
    const ariaDisabled = disabled || undefined;
    const actionStyles = useStyles(STYLES_NAME.LINK, action, ctv?.[action]);
    const textStyles = useStylesV2({
        styleName: STYLES_NAME.TEXT,
        variantName: textVariant,
        isOptional: true,
    });
    const styles = (variant && actionStyles?.[variant]) || {};
    const isInline = action === LinkActionType.INLINE;
    const textDecoration = isInline ? TextDecorationType.UNDERLINE : decoration;
    const weight = props.weight || styles.container?.font_weight;
    const color = colorLinkProp || styles.font_color || styles.container?.color;
    const { state, setRef } = useManageState({
        states: Object.values(LinkStateType),
        ref,
        disabled,
    });
    return (_jsx(LinkStandAlone, { ...props, ref: setRef, action: action, alignCenter: alignCenter, "aria-disabled": ariaDisabled, color: color, component: genericLinkComponent, decoration: textDecoration, role: role, state: state, styles: styles, textStyles: textStyles, weight: weight }));
});
LinkComponent.displayName = 'LinkComponent';
const LinkBoundary = (props, ref) => (_jsx(ErrorBoundary, { fallBackComponent: _jsx(FallbackComponent, { children: _jsx(LinkStandAlone, { ...props, ref: ref }) }), children: _jsx(LinkComponent, { ...props, ref: ref }) }));
export const Link = React.forwardRef(LinkBoundary);
//# sourceMappingURL=link.js.map