@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
63 lines • 2.79 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
exports.getExtraStyles = void 0;
const styled_components_1 = require("styled-components");
const positions_1 = require("../../../types/positions/positions");
// mixins
const input_mixin_1 = require("../../../styles/mixins/input.mixin");
const inputTheme_1 = require("../types/inputTheme");
const getLeftExtraStyles = (affixPosition, isOutAffixPosition) => {
if (affixPosition === positions_1.POSITIONS.LEFT && !isOutAffixPosition) {
return (0, styled_components_1.css) `
${input_mixin_1.innerLeftContentPosition}
`;
}
return undefined;
};
const getRightExtraStyles = (affixPosition, isOutAffixPosition) => {
if (affixPosition === positions_1.POSITIONS.RIGHT && !isOutAffixPosition) {
return (0, input_mixin_1.innerRightContentPosition)();
}
return undefined;
};
const getTopExtraStyles = (affixPosition, width, isOutAffixPosition, inputWidth) => {
if (affixPosition === positions_1.POSITIONS.LEFT && isOutAffixPosition) {
return (0, input_mixin_1.labelInTopStyles)(width || 0, inputWidth || 0);
}
return undefined;
};
const getBottomExtraStyles = (affixPosition, width, isOutAffixPosition, helpTextPosition) => {
if (affixPosition === positions_1.POSITIONS.LEFT &&
isOutAffixPosition &&
helpTextPosition === inputTheme_1.InputHelpMessagePosition.BOTTOM) {
return (0, input_mixin_1.contentBottomMargin)(width || 0, 0);
}
return undefined;
};
const getCenterExtraStyles = (affixPosition, width, isOutAffixPosition) => {
if (affixPosition === positions_1.POSITIONS.LEFT && !isOutAffixPosition) {
return (0, input_mixin_1.inputPadding)(width || 0, 0);
}
return undefined;
};
// Depending on the position of the affix the styles change
const getExtraStyles = (stylesPosition, affixPosition, width, isOutAffixPosition, helpTextPosition, inputWidth) => {
if (stylesPosition === positions_1.POSITIONS.LEFT) {
return getLeftExtraStyles(affixPosition, isOutAffixPosition);
}
if (stylesPosition === positions_1.POSITIONS.RIGHT) {
return getRightExtraStyles(affixPosition, isOutAffixPosition);
}
if (stylesPosition === positions_1.POSITIONS.TOP) {
return getTopExtraStyles(affixPosition, width, isOutAffixPosition, inputWidth);
}
if (stylesPosition === positions_1.POSITIONS.BOTTOM) {
return getBottomExtraStyles(affixPosition, width, isOutAffixPosition, helpTextPosition);
}
if (stylesPosition === positions_1.POSITIONS.CENTER) {
return getCenterExtraStyles(affixPosition, width, isOutAffixPosition);
}
return undefined;
};
exports.getExtraStyles = getExtraStyles;
//# sourceMappingURL=extraStyles.utils.js.map