@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
64 lines • 2.31 kB
JavaScript
import styled, { css } from 'styled-components';
import { getStyles, getTypographyStyles } from '../../utils/getStyles/getStyles';
import { LineSeparatorPositionType, } from '../lineSeparator/types/lineSeparatorTheme';
export const AccordionContainerStyled = styled.div `
${props => getStyles(props.styles)}
`;
export const AccordionDecorativeBackgroundStyled = styled.div `
${props => getStyles(props.styles)}
`;
export const AccordionHeaderExternalContainerStyled = styled.div `
${props => getStyles(props.styles)}
`;
export const AccordionHeaderInternalContainerStyled = styled.div `
${props => getStyles(props.styles)}
`;
export const AccordionHeaderMainContainerStyled = styled.div `
${props => getStyles(props.styles)}
`;
export const AccordionHeaderTitleHeadlineStyled = styled.span `
display: flex;
width: 100%;
${props => getStyles(props.styles)}
`;
export const AccordionTitleStyled = styled.span `
${props => getStyles(props.styles)}
`;
export const AccordionHeaderRightContentStyled = styled.div `
${props => getStyles(props.styles)}
${props => getTypographyStyles(props.styles)}
`;
export const AccordionSubHeaderContainerStyled = styled.div `
${props => getStyles(props.styles)}
`;
export const AccordionTriggerStyled = styled.button `
${props => getStyles(props.styles)}
`;
export const AccordionTriggerIconContainerStyled = styled.span `
${({ $rotate }) => $rotate &&
css `
svg {
transform: rotate(180deg);
}
`};
${props => getStyles(props.styles)}
`;
export const AccordionContentStyled = styled.section `
display: ${({ displayOption }) => displayOption};
${props => getStyles(props.styles)}
`;
export const LineSeparatorContainerStyled = styled.div `
${({ lineSeparatorLineStyles }) => lineSeparatorLineStyles?.buildLineStyles?.(LineSeparatorPositionType.TOP)}
${props => getStyles(props.styles)}
`;
export const AccordionPanelStyled = styled.div `
${props => getStyles(props.styles)}
`;
export const AccordionFooterStyled = styled.div `
border-top: ${({ styles }) => `solid ${styles?.border_top_width || 0} ${styles?.border_top_color}`};
${props => getStyles(props.styles)}
`;
export const AccordionTitleIconWrapper = styled.span `
${props => getStyles(props.styles)}
`;
//# sourceMappingURL=accordion.styled.js.map