UNPKG

@roo-ui/components

Version:

57 lines (46 loc) 11.4 kB
"use strict"; Object.defineProperty(exports, "__esModule", { value: true }); exports.default = void 0; var _styledBase = _interopRequireDefault(require("@emotion/styled-base")); var _propTypes = _interopRequireDefault(require("prop-types")); var _core = require("@emotion/core"); var _styledSystem = require("styled-system"); var _omitProps = _interopRequireDefault(require("../omitProps")); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; var ownKeys = Object.keys(source); if (typeof Object.getOwnPropertySymbols === 'function') { ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function (sym) { return Object.getOwnPropertyDescriptor(source, sym).enumerable; })); } ownKeys.forEach(function (key) { _defineProperty(target, key, source[key]); }); } return target; } function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; } function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); } var Input = ( /*#__PURE__*/ 0, _styledBase.default)('input', _extends({}, { target: "e1yd5ios0", label: "Input" }, (0, _omitProps.default)(['color', 'fontSize'])))(_styledSystem.space, " ", _styledSystem.color, " ", _styledSystem.fontSize, " ", _styledSystem.lineHeight, " ", _styledSystem.border, " ", _styledSystem.borderColor, " ", _styledSystem.textAlign, " display:block;width:100%;outline:0;transition:border-color ", (0, _styledSystem.themeGet)('transitions.default'), ";appearance:none;&:focus{border-color:", (0, _styledSystem.themeGet)('colors.brand.secondary'), ";}&:disabled{cursor:not-allowed;color:", (0, _styledSystem.themeGet)('colors.greys.steel'), ";background-color:", (0, _styledSystem.themeGet)('colors.greys.porcelain'), ";}::placeholder{color:", (0, _styledSystem.themeGet)('colors.greys.steel'), ";}::-ms-clear{display:none;}", function (props) { return props.underline && /*#__PURE__*/ (0, _core.css)("border:none;border-bottom:", (0, _styledSystem.themeGet)('borders.2')(props), ";border-color:", (0, _styledSystem.themeGet)('colors.greys.alto')(props), ";label:Input;" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9JbnB1dC9JbnB1dC5qcyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFrRE8iLCJmaWxlIjoiLi4vLi4vLi4vc3JjL0lucHV0L0lucHV0LmpzIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IFByb3BUeXBlcyBmcm9tICdwcm9wLXR5cGVzJztcbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcbmltcG9ydCB7IGNzcyB9IGZyb20gJ0BlbW90aW9uL2NvcmUnO1xuaW1wb3J0IHtcbiAgc3BhY2UsXG4gIGNvbG9yLFxuICBmb250U2l6ZSxcbiAgbGluZUhlaWdodCxcbiAgYm9yZGVyLFxuICBib3JkZXJDb2xvcixcbiAgdGV4dEFsaWduLFxuICB0aGVtZUdldCxcbn0gZnJvbSAnc3R5bGVkLXN5c3RlbSc7XG5cbmltcG9ydCBvbWl0UHJvcHMgZnJvbSAnLi4vb21pdFByb3BzJztcblxuY29uc3QgSW5wdXQgPSBzdHlsZWQoJ2lucHV0Jywgb21pdFByb3BzKFsnY29sb3InLCAnZm9udFNpemUnXSkpYFxuICAke3NwYWNlfVxuICAke2NvbG9yfVxuICAke2ZvbnRTaXplfVxuICAke2xpbmVIZWlnaHR9XG4gICR7Ym9yZGVyfVxuICAke2JvcmRlckNvbG9yfVxuICAke3RleHRBbGlnbn1cbiAgZGlzcGxheTogYmxvY2s7XG4gIHdpZHRoOiAxMDAlO1xuICBvdXRsaW5lOiAwO1xuICB0cmFuc2l0aW9uOiBib3JkZXItY29sb3IgJHt0aGVtZUdldCgndHJhbnNpdGlvbnMuZGVmYXVsdCcpfTtcbiAgYXBwZWFyYW5jZTogbm9uZTtcblxuICAmOmZvY3VzIHtcbiAgICBib3JkZXItY29sb3I6ICR7dGhlbWVHZXQoJ2NvbG9ycy5icmFuZC5zZWNvbmRhcnknKX07XG4gIH1cblxuICAmOmRpc2FibGVkIHtcbiAgICBjdXJzb3I6IG5vdC1hbGxvd2VkO1xuICAgIGNvbG9yOiAke3RoZW1lR2V0KCdjb2xvcnMuZ3JleXMuc3RlZWwnKX07XG4gICAgYmFja2dyb3VuZC1jb2xvcjogJHt0aGVtZUdldCgnY29sb3JzLmdyZXlzLnBvcmNlbGFpbicpfTtcbiAgfVxuXG4gIDo6cGxhY2Vob2xkZXIge1xuICAgIGNvbG9yOiAke3RoZW1lR2V0KCdjb2xvcnMuZ3JleXMuc3RlZWwnKX07XG4gIH1cblxuICA6Oi1tcy1jbGVhciB7XG4gICAgZGlzcGxheTogbm9uZTtcbiAgfVxuXG4gICR7cHJvcHMgPT5cbiAgICBwcm9wcy51bmRlcmxpbmUgJiZcbiAgICBjc3NgXG4gICAgICBib3JkZXI6IG5vbmU7XG4gICAgICBib3JkZXItYm90dG9tOiAke3RoZW1lR2V0KCdib3JkZXJzLjInKShwcm9wcyl9O1xuICAgICAgYm9yZGVyLWNvbG9yOiAke3RoZW1lR2V0KCdjb2xvcnMuZ3JleXMuYWx0bycpKHByb3BzKX07XG4gICAgYH1cblxuICAke3Byb3BzID0+XG4gICAgcHJvcHMuZXJyb3IgJiZcbiAgICBjc3NgXG4gICAgICBib3JkZXItY29sb3I6ICR7dGhlbWVHZXQoJ2NvbG9ycy51aS5lcnJvcicpKHByb3BzKX07XG4gICAgYH1cbmA7XG5cbklucHV0LnByb3BUeXBlcyA9IHtcbiAgLi4uc3BhY2UucHJvcFR5cGVzLFxuICAuLi5jb2xvci5wcm9wVHlwZXMsXG4gIC4uLmZvbnRTaXplLnByb3BUeXBlcyxcbiAgLi4ubGluZUhlaWdodC5wcm9wVHlwZXMsXG4gIC4uLmJvcmRlci5wcm9wVHlwZXMsXG4gIC4uLmJvcmRlckNvbG9yLnByb3BUeXBlcyxcbiAgLi4udGV4dEFsaWduLnByb3BUeXBlcyxcbiAgZXJyb3I6IFByb3BUeXBlcy5ib29sLFxuICB1bmRlcmxpbmU6IFByb3BUeXBlcy5ib29sLFxufTtcblxuSW5wdXQuZGVmYXVsdFByb3BzID0ge1xuICBtYjogMyxcbiAgcHk6IDMsXG4gIHB4OiA0LFxuICBiZzogJ3doaXRlJyxcbiAgY29sb3I6ICdncmV5cy5jaGFyY29hbCcsXG4gIGZvbnRTaXplOiAnYmFzZScsXG4gIGxpbmVIZWlnaHQ6ICdub3JtYWwnLFxuICBib3JkZXI6IDIsXG4gIGJvcmRlckNvbG9yOiAnZ3JleXMuYWx0bycsXG4gIHRleHRBbGlnbjogJ2xlZnQnLFxufTtcblxuZXhwb3J0IGRlZmF1bHQgSW5wdXQ7XG4iXX0= */")); }, " ", function (props) { return props.error && /*#__PURE__*/ (0, _core.css)("border-color:", (0, _styledSystem.themeGet)('colors.ui.error')(props), ";label:Input;" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9JbnB1dC9JbnB1dC5qcyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUEwRE8iLCJmaWxlIjoiLi4vLi4vLi4vc3JjL0lucHV0L0lucHV0LmpzIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IFByb3BUeXBlcyBmcm9tICdwcm9wLXR5cGVzJztcbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcbmltcG9ydCB7IGNzcyB9IGZyb20gJ0BlbW90aW9uL2NvcmUnO1xuaW1wb3J0IHtcbiAgc3BhY2UsXG4gIGNvbG9yLFxuICBmb250U2l6ZSxcbiAgbGluZUhlaWdodCxcbiAgYm9yZGVyLFxuICBib3JkZXJDb2xvcixcbiAgdGV4dEFsaWduLFxuICB0aGVtZUdldCxcbn0gZnJvbSAnc3R5bGVkLXN5c3RlbSc7XG5cbmltcG9ydCBvbWl0UHJvcHMgZnJvbSAnLi4vb21pdFByb3BzJztcblxuY29uc3QgSW5wdXQgPSBzdHlsZWQoJ2lucHV0Jywgb21pdFByb3BzKFsnY29sb3InLCAnZm9udFNpemUnXSkpYFxuICAke3NwYWNlfVxuICAke2NvbG9yfVxuICAke2ZvbnRTaXplfVxuICAke2xpbmVIZWlnaHR9XG4gICR7Ym9yZGVyfVxuICAke2JvcmRlckNvbG9yfVxuICAke3RleHRBbGlnbn1cbiAgZGlzcGxheTogYmxvY2s7XG4gIHdpZHRoOiAxMDAlO1xuICBvdXRsaW5lOiAwO1xuICB0cmFuc2l0aW9uOiBib3JkZXItY29sb3IgJHt0aGVtZUdldCgndHJhbnNpdGlvbnMuZGVmYXVsdCcpfTtcbiAgYXBwZWFyYW5jZTogbm9uZTtcblxuICAmOmZvY3VzIHtcbiAgICBib3JkZXItY29sb3I6ICR7dGhlbWVHZXQoJ2NvbG9ycy5icmFuZC5zZWNvbmRhcnknKX07XG4gIH1cblxuICAmOmRpc2FibGVkIHtcbiAgICBjdXJzb3I6IG5vdC1hbGxvd2VkO1xuICAgIGNvbG9yOiAke3RoZW1lR2V0KCdjb2xvcnMuZ3JleXMuc3RlZWwnKX07XG4gICAgYmFja2dyb3VuZC1jb2xvcjogJHt0aGVtZUdldCgnY29sb3JzLmdyZXlzLnBvcmNlbGFpbicpfTtcbiAgfVxuXG4gIDo6cGxhY2Vob2xkZXIge1xuICAgIGNvbG9yOiAke3RoZW1lR2V0KCdjb2xvcnMuZ3JleXMuc3RlZWwnKX07XG4gIH1cblxuICA6Oi1tcy1jbGVhciB7XG4gICAgZGlzcGxheTogbm9uZTtcbiAgfVxuXG4gICR7cHJvcHMgPT5cbiAgICBwcm9wcy51bmRlcmxpbmUgJiZcbiAgICBjc3NgXG4gICAgICBib3JkZXI6IG5vbmU7XG4gICAgICBib3JkZXItYm90dG9tOiAke3RoZW1lR2V0KCdib3JkZXJzLjInKShwcm9wcyl9O1xuICAgICAgYm9yZGVyLWNvbG9yOiAke3RoZW1lR2V0KCdjb2xvcnMuZ3JleXMuYWx0bycpKHByb3BzKX07XG4gICAgYH1cblxuICAke3Byb3BzID0+XG4gICAgcHJvcHMuZXJyb3IgJiZcbiAgICBjc3NgXG4gICAgICBib3JkZXItY29sb3I6ICR7dGhlbWVHZXQoJ2NvbG9ycy51aS5lcnJvcicpKHByb3BzKX07XG4gICAgYH1cbmA7XG5cbklucHV0LnByb3BUeXBlcyA9IHtcbiAgLi4uc3BhY2UucHJvcFR5cGVzLFxuICAuLi5jb2xvci5wcm9wVHlwZXMsXG4gIC4uLmZvbnRTaXplLnByb3BUeXBlcyxcbiAgLi4ubGluZUhlaWdodC5wcm9wVHlwZXMsXG4gIC4uLmJvcmRlci5wcm9wVHlwZXMsXG4gIC4uLmJvcmRlckNvbG9yLnByb3BUeXBlcyxcbiAgLi4udGV4dEFsaWduLnByb3BUeXBlcyxcbiAgZXJyb3I6IFByb3BUeXBlcy5ib29sLFxuICB1bmRlcmxpbmU6IFByb3BUeXBlcy5ib29sLFxufTtcblxuSW5wdXQuZGVmYXVsdFByb3BzID0ge1xuICBtYjogMyxcbiAgcHk6IDMsXG4gIHB4OiA0LFxuICBiZzogJ3doaXRlJyxcbiAgY29sb3I6ICdncmV5cy5jaGFyY29hbCcsXG4gIGZvbnRTaXplOiAnYmFzZScsXG4gIGxpbmVIZWlnaHQ6ICdub3JtYWwnLFxuICBib3JkZXI6IDIsXG4gIGJvcmRlckNvbG9yOiAnZ3JleXMuYWx0bycsXG4gIHRleHRBbGlnbjogJ2xlZnQnLFxufTtcblxuZXhwb3J0IGRlZmF1bHQgSW5wdXQ7XG4iXX0= */")); }, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9JbnB1dC9JbnB1dC5qcyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFnQitEIiwiZmlsZSI6Ii4uLy4uLy4uL3NyYy9JbnB1dC9JbnB1dC5qcyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBQcm9wVHlwZXMgZnJvbSAncHJvcC10eXBlcyc7XG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5pbXBvcnQgeyBjc3MgfSBmcm9tICdAZW1vdGlvbi9jb3JlJztcbmltcG9ydCB7XG4gIHNwYWNlLFxuICBjb2xvcixcbiAgZm9udFNpemUsXG4gIGxpbmVIZWlnaHQsXG4gIGJvcmRlcixcbiAgYm9yZGVyQ29sb3IsXG4gIHRleHRBbGlnbixcbiAgdGhlbWVHZXQsXG59IGZyb20gJ3N0eWxlZC1zeXN0ZW0nO1xuXG5pbXBvcnQgb21pdFByb3BzIGZyb20gJy4uL29taXRQcm9wcyc7XG5cbmNvbnN0IElucHV0ID0gc3R5bGVkKCdpbnB1dCcsIG9taXRQcm9wcyhbJ2NvbG9yJywgJ2ZvbnRTaXplJ10pKWBcbiAgJHtzcGFjZX1cbiAgJHtjb2xvcn1cbiAgJHtmb250U2l6ZX1cbiAgJHtsaW5lSGVpZ2h0fVxuICAke2JvcmRlcn1cbiAgJHtib3JkZXJDb2xvcn1cbiAgJHt0ZXh0QWxpZ259XG4gIGRpc3BsYXk6IGJsb2NrO1xuICB3aWR0aDogMTAwJTtcbiAgb3V0bGluZTogMDtcbiAgdHJhbnNpdGlvbjogYm9yZGVyLWNvbG9yICR7dGhlbWVHZXQoJ3RyYW5zaXRpb25zLmRlZmF1bHQnKX07XG4gIGFwcGVhcmFuY2U6IG5vbmU7XG5cbiAgJjpmb2N1cyB7XG4gICAgYm9yZGVyLWNvbG9yOiAke3RoZW1lR2V0KCdjb2xvcnMuYnJhbmQuc2Vjb25kYXJ5Jyl9O1xuICB9XG5cbiAgJjpkaXNhYmxlZCB7XG4gICAgY3Vyc29yOiBub3QtYWxsb3dlZDtcbiAgICBjb2xvcjogJHt0aGVtZUdldCgnY29sb3JzLmdyZXlzLnN0ZWVsJyl9O1xuICAgIGJhY2tncm91bmQtY29sb3I6ICR7dGhlbWVHZXQoJ2NvbG9ycy5ncmV5cy5wb3JjZWxhaW4nKX07XG4gIH1cblxuICA6OnBsYWNlaG9sZGVyIHtcbiAgICBjb2xvcjogJHt0aGVtZUdldCgnY29sb3JzLmdyZXlzLnN0ZWVsJyl9O1xuICB9XG5cbiAgOjotbXMtY2xlYXIge1xuICAgIGRpc3BsYXk6IG5vbmU7XG4gIH1cblxuICAke3Byb3BzID0+XG4gICAgcHJvcHMudW5kZXJsaW5lICYmXG4gICAgY3NzYFxuICAgICAgYm9yZGVyOiBub25lO1xuICAgICAgYm9yZGVyLWJvdHRvbTogJHt0aGVtZUdldCgnYm9yZGVycy4yJykocHJvcHMpfTtcbiAgICAgIGJvcmRlci1jb2xvcjogJHt0aGVtZUdldCgnY29sb3JzLmdyZXlzLmFsdG8nKShwcm9wcyl9O1xuICAgIGB9XG5cbiAgJHtwcm9wcyA9PlxuICAgIHByb3BzLmVycm9yICYmXG4gICAgY3NzYFxuICAgICAgYm9yZGVyLWNvbG9yOiAke3RoZW1lR2V0KCdjb2xvcnMudWkuZXJyb3InKShwcm9wcyl9O1xuICAgIGB9XG5gO1xuXG5JbnB1dC5wcm9wVHlwZXMgPSB7XG4gIC4uLnNwYWNlLnByb3BUeXBlcyxcbiAgLi4uY29sb3IucHJvcFR5cGVzLFxuICAuLi5mb250U2l6ZS5wcm9wVHlwZXMsXG4gIC4uLmxpbmVIZWlnaHQucHJvcFR5cGVzLFxuICAuLi5ib3JkZXIucHJvcFR5cGVzLFxuICAuLi5ib3JkZXJDb2xvci5wcm9wVHlwZXMsXG4gIC4uLnRleHRBbGlnbi5wcm9wVHlwZXMsXG4gIGVycm9yOiBQcm9wVHlwZXMuYm9vbCxcbiAgdW5kZXJsaW5lOiBQcm9wVHlwZXMuYm9vbCxcbn07XG5cbklucHV0LmRlZmF1bHRQcm9wcyA9IHtcbiAgbWI6IDMsXG4gIHB5OiAzLFxuICBweDogNCxcbiAgYmc6ICd3aGl0ZScsXG4gIGNvbG9yOiAnZ3JleXMuY2hhcmNvYWwnLFxuICBmb250U2l6ZTogJ2Jhc2UnLFxuICBsaW5lSGVpZ2h0OiAnbm9ybWFsJyxcbiAgYm9yZGVyOiAyLFxuICBib3JkZXJDb2xvcjogJ2dyZXlzLmFsdG8nLFxuICB0ZXh0QWxpZ246ICdsZWZ0Jyxcbn07XG5cbmV4cG9ydCBkZWZhdWx0IElucHV0O1xuIl19 */"); Input.propTypes = _objectSpread({}, _styledSystem.space.propTypes, _styledSystem.color.propTypes, _styledSystem.fontSize.propTypes, _styledSystem.lineHeight.propTypes, _styledSystem.border.propTypes, _styledSystem.borderColor.propTypes, _styledSystem.textAlign.propTypes, { error: _propTypes.default.bool, underline: _propTypes.default.bool }); Input.defaultProps = { mb: 3, py: 3, px: 4, bg: 'white', color: 'greys.charcoal', fontSize: 'base', lineHeight: 'normal', border: 2, borderColor: 'greys.alto', textAlign: 'left' }; var _default = Input; exports.default = _default;