@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
81 lines • 4.19 kB
JavaScript
;
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.LeftAnimationStyled = exports.BottomAnimationStyled = exports.RightAnimationStyled = exports.TopAnimationStyled = exports.AnimationContainerStyled = exports.ErrorWrapperStyled = exports.HiddenInputFile = exports.ContainerBoxActionDescriptionTextWrapper = exports.ActionIconAndActionTextContainerStyled = exports.ContainerBoxTextWrapper = exports.ContainerBoxStyled = exports.BorderContainerStyled = exports.SubtitleTooltipIconWrapperStyled = exports.HeaderDescriptionWrapperStyled = exports.HeaderSubtitleTooltipWrapperStyled = exports.HeaderTitleSubtitleWrapperStyled = exports.HeaderContainerBoxWrapperStyled = exports.WrapperStyled = void 0;
const styled_components_1 = __importDefault(require("styled-components"));
// mixins
const srOnly_mixin_1 = require("../../styles/mixins/srOnly.mixin");
const getStyles_1 = require("../../utils/getStyles/getStyles");
exports.WrapperStyled = styled_components_1.default.div `
width: 100%;
display: flex;
flex-direction: column;
`;
exports.HeaderContainerBoxWrapperStyled = styled_components_1.default.div `
${({ styles }) => (0, getStyles_1.getStyles)(styles.header)}
`;
exports.HeaderTitleSubtitleWrapperStyled = styled_components_1.default.div `
${({ styles }) => (0, getStyles_1.getStyles)(styles.titleSubtitleContainer)}
`;
exports.HeaderSubtitleTooltipWrapperStyled = styled_components_1.default.div `
> *:nth-child(1) {
display: inline;
}
> *:nth-child(2) {
vertical-align: middle;
}
`;
exports.HeaderDescriptionWrapperStyled = styled_components_1.default.div `
${({ styles }) => (0, getStyles_1.getStyles)(styles.descriptionContainer)}
`;
exports.SubtitleTooltipIconWrapperStyled = styled_components_1.default.div `
${({ styles }) => (0, getStyles_1.getStyles)(styles.tooltipIconContainer)}
`;
exports.BorderContainerStyled = styled_components_1.default.div `
${({ styles, state }) => (0, getStyles_1.getStyles)(styles?.states?.[state]?.borderAnimationContainer)}
`;
exports.ContainerBoxStyled = styled_components_1.default.label `
${({ styles, state }) => (0, getStyles_1.getStyles)(styles?.states?.[state]?.containerBoxContainer)}
&[data-focus='true'] {
${({ theme }) => theme.FOCUS_STYLES};
}
`;
exports.ContainerBoxTextWrapper = styled_components_1.default.span `
word-break: break-word;
${({ styles, state }) => (0, getStyles_1.getStyles)(styles?.states?.[state]?.containerBoxTextsContainer)}
`;
exports.ActionIconAndActionTextContainerStyled = styled_components_1.default.span `
${({ styles, state }) => (0, getStyles_1.getStyles)(styles?.states?.[state]?.actionIconAndActionTextContainer)}
`;
exports.ContainerBoxActionDescriptionTextWrapper = styled_components_1.default.span `
display: flex;
flex-direction: column;
`;
exports.HiddenInputFile = styled_components_1.default.input `
${srOnly_mixin_1.srOnlyMixin}
`;
exports.ErrorWrapperStyled = styled_components_1.default.div `
${({ styles }) => (0, getStyles_1.getStyles)(styles.errorMessageContainer)}
`;
// Animations
exports.AnimationContainerStyled = styled_components_1.default.div `
${({ styles, state }) => (0, getStyles_1.getStyles)(styles?.states?.[state]?.animationContainer)}
&[data-focus='true'] {
${({ theme }) => theme.FOCUS_STYLES};
}
`;
exports.TopAnimationStyled = styled_components_1.default.div `
${({ styles, state }) => (0, getStyles_1.getStyles)(styles?.states?.[state]?.topAnimationContainer)}
`;
exports.RightAnimationStyled = styled_components_1.default.div `
${({ styles, state }) => (0, getStyles_1.getStyles)(styles?.states?.[state]?.rightAnimationContainer)}
`;
exports.BottomAnimationStyled = styled_components_1.default.div `
${({ styles, state }) => (0, getStyles_1.getStyles)(styles?.states?.[state]?.bottomAnimationContainer)}
`;
exports.LeftAnimationStyled = styled_components_1.default.div `
${({ styles, state }) => (0, getStyles_1.getStyles)(styles?.states?.[state]?.leftAnimationContainer)}
`;
//# sourceMappingURL=selectorBoxFile.styled.js.map