@up-group-ui/react-controls
Version:
Up shared react controls
60 lines • 2.12 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
exports.getStyles = void 0;
var tslib_1 = require("tslib");
var classnames_1 = (0, tslib_1.__importDefault)(require("classnames"));
var styles_1 = require("../_Common/Styled/Input/styles");
var typestyle_1 = require("typestyle");
var csx_1 = require("csx");
var utils_1 = require("../../../Common/theming/utils");
var sizeMap = {
xsmall: '100px',
small: '150px',
medium: '350px',
large: '450px',
xlarge: '600px',
xxlarge: '700px',
fill: '100%',
};
var base = function (props) { return ({
$nest: {
'&.up-text': {
minHeight: '80px',
width: sizeMap[props.width] || '500px',
padding: (0, utils_1.toRem)(10),
border: "1px solid " + props.theme.colorMap.darkGray4,
borderRadius: props.theme.borderRadius,
},
'&.up-text::placeholder': {
color: props.theme.colorMap.grey1,
fontStyle: 'italic',
fontSize: (0, utils_1.toRem)(14),
fontWeight: 500,
},
'&.up-text-max-characters': {
color: props.theme.colorMap.grey1,
border: 'none',
display: 'flex',
justifyContent: 'flex-end',
alignItems: 'baseline',
},
'&.up-text-max-characters-msg': {
color: props.theme.colorMap.grey1,
fontWeight: 500,
paddingRight: '5px',
border: 'none',
},
'&.up-text-error': {
borderColor: props.theme.colorMap.error,
backgroundColor: (0, csx_1.color)(props.theme.colorMap.error).lighten(0.55).toHexString(),
},
},
}); };
var error = function (props) { return ({
border: "1px solid " + props.theme.colorMap.danger,
}); };
var getStyles = function (props) {
return (0, classnames_1.default)((0, typestyle_1.style)((0, styles_1.defaultStyles)(props)), (0, typestyle_1.style)(base(props)), props.hasError ? (0, typestyle_1.style)(error(props)) : null);
};
exports.getStyles = getStyles;
//# sourceMappingURL=styles.js.map