UNPKG

@up-group-ui/react-controls

Version:
71 lines 2.53 kB
"use strict"; Object.defineProperty(exports, "__esModule", { value: true }); exports.getRuleStatus = exports.getRulesStyle = exports.getStyles = exports.onSide = void 0; var typestyle_1 = require("typestyle"); var utils_1 = require("../../../Common/utils"); var utils_2 = require("../../../Common/theming/utils"); var fillColor = function (props) { var color; if (!props.touched) color = props.theme.colorMap.default; if (props.value) color = props.theme.colorMap.success; if (props.showError && props.hasError) color = props.theme.colorMap.error; return color; }; exports.onSide = (0, typestyle_1.style)({ display: 'flex', }); var getStyles = function (props) { return (0, typestyle_1.style)({ $nest: { '&.up-password': { position: 'relative', }, '&.up-password .up-icon-wrapper': { position: 'absolute', top: props.floatingLabel ? 18 : 4, right: 0, cursor: 'pointer', zIndex: 10, }, '&.up-password .up-icon-wrapper svg, &.up-password .up-icon-wrapper svg polygon, &.up-password .up-icon-wrapper svg path, &.up-password .up-icon-wrapper svg polyline': { fill: fillColor(props) + " !important", }, '&.up-password .up-wrapper-error-tooltip': { display: 'none', background: 'transparent', }, }, }); }; exports.getStyles = getStyles; var getRulesStyle = function (props) { return (0, typestyle_1.style)({ display: 'block', zIndex: 1000, width: '100%', border: "0 1px 1px solid " + props.theme.colorMap.lightGrey1, borderTop: 'unset', boxShadow: '0 0 5px 0 rgba(0,0,0,0.11)', fontSize: (0, utils_2.toRem)(12), color: '#4E5B59', lineHeight: 1.5, fontWeight: 400, marginTop: (0, utils_2.toRem)(0.5), }); }; exports.getRulesStyle = getRulesStyle; var getRuleStatus = function (props, regex) { return (0, typestyle_1.style)({ height: '8px', width: '8px', backgroundColor: "" + ((0, utils_1.ruleIsValid)(props.value, regex) ? props.theme.colorMap.success : props.theme.colorMap.lightGrey1), borderRadius: '50%', display: 'inline-block', margin: (0, utils_2.toRem)(0) + " " + (0, utils_2.toRem)(10), }); }; exports.getRuleStatus = getRuleStatus; //# sourceMappingURL=styles.js.map