@kubit-ui-web/react-components/dist/esm/components/loadingState/loadingStateStandAlone.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, jsxs as _jsxs } from "react/jsx-runtime";
import React from 'react';
import { Text } from '../../components/text/text';
import { TextComponentType } from '../../components/text/types/component';
import { ScreenReaderOnly } from '../screenReaderOnly/screenReaderOnly';
import { ThirdPartyAnimation } from '../thirdPartyAnimation/thirdPartyAnimation';
import { DescriptionWrapperStyled, LoadingStateStyled, TitleWrapperStyled, } from './loadingState.styled';
const LoadingStateStandAloneComponent = ({ description, hideText = false, styles, title, screenReaderText, state, dataTestId = 'loading-state', ...props }, ref) => {
    const stateStyles = styles.states?.[state];
    const hasTitle = title && !hideText;
    return (_jsxs(LoadingStateStyled, { ref: ref, "data-testid": dataTestId, children: [stateStyles?.thirdPartyAnimation?.height &&
                stateStyles?.thirdPartyAnimation?.variant &&
                stateStyles?.thirdPartyAnimation?.width && (_jsx(ThirdPartyAnimation, { "aria-label": props['aria-label'], height: stateStyles.thirdPartyAnimation.height, variant: stateStyles.thirdPartyAnimation.variant, width: stateStyles.thirdPartyAnimation.width })), hasTitle && (_jsx(TitleWrapperStyled, { styles: styles, children: _jsx(Text, { customTypography: styles.title, ...title, children: title.content }) })), description && !hideText && (_jsx(DescriptionWrapperStyled, { styles: styles, children: _jsx(Text, { component: TextComponentType.PARAGRAPH, customTypography: styles.description, ...description, children: description.content }) })), _jsx(ScreenReaderOnly, { show: !hasTitle, children: screenReaderText })] }));
};
export const LoadingStateStandAlone = React.forwardRef(LoadingStateStandAloneComponent);
//# sourceMappingURL=loadingStateStandAlone.js.map