@ucam/design-system/Input/Input.js

University of Cambridge Design System

'use strict';

var React = require('react');
var InputBase = require('@material-ui/core/InputBase');
var core = require('@material-ui/core');
var styles = require('@material-ui/core/styles');
var PropTypes = require('prop-types');

function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }

var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
var InputBase__default = /*#__PURE__*/_interopDefaultLegacy(InputBase);
var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);

/* eslint-disable react/prop-types */
const InputRoot = core.experimentalStyled(InputBase__default['default'], {
    shouldForwardProp: (prop) => prop !== 'characterWidth'
})(({ theme, characterWidth }) => {
    const borderColor = '#878B8F';
    return {
        '& input': Object.assign({ lineHeight: 1.5, height: '1.5em', padding: 0 }, (characterWidth ? { width: `${characterWidth + 1}ch` } : {})),
        border: `1px solid ${borderColor}`,
        borderRadius: theme.shape.borderRadius,
        padding: '11px 7px',
        '&:hover': {
            borderColor: theme.palette.text.primary
        },
        // Reset on touch devices, it doesn't add specificity
        '@media (hover: none)': {
            '&:hover': {
                borderColor
            }
        },
        '&.Mui-focused': {
            borderColor: theme.palette.primary.main,
            boxShadow: `0 0 0 0.2rem ${styles.alpha(theme.palette.primary.main, 0.2)}`
        },
        '&.Mui-error': {
            borderColor: theme.palette.error.main,
            '&.Mui-focused': {
                boxShadow: `0 0 0 0.2rem ${styles.alpha(theme.palette.error.main, 0.2)}`
            }
        },
        '&.Mui-disabled': {
            borderColor: theme.palette.action.disabled
        }
    };
});
const Input = React__default['default'].forwardRef(function Input(props, ref) {
    return React__default['default'].createElement(InputRoot, Object.assign({}, props, { ref: ref }));
});
Input.propTypes = Object.assign(Object.assign({}, InputBase__default['default'].propTypes), { characterWidth: PropTypes__default['default'].number });

module.exports = Input;
//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiSW5wdXQuanMiLCJzb3VyY2VzIjpbIi9AdWNhbS9kZXNpZ24tc3lzdGVtL3NyYy9JbnB1dC9JbnB1dC50c3giXSwic291cmNlc0NvbnRlbnQiOlsiLyogZXNsaW50LWRpc2FibGUgcmVhY3QvcHJvcC10eXBlcyAqL1xuaW1wb3J0IFJlYWN0LCB7IEZDIH0gZnJvbSAncmVhY3QnO1xuaW1wb3J0IElucHV0QmFzZSwgeyBJbnB1dEJhc2VQcm9wcyB9IGZyb20gJ0BtYXRlcmlhbC11aS9jb3JlL0lucHV0QmFzZSc7XG5pbXBvcnQgeyBleHBlcmltZW50YWxTdHlsZWQgYXMgc3R5bGVkIH0gZnJvbSAnQG1hdGVyaWFsLXVpL2NvcmUnO1xuaW1wb3J0IHsgYWxwaGEgfSBmcm9tICdAbWF0ZXJpYWwtdWkvY29yZS9zdHlsZXMnO1xuaW1wb3J0IFByb3BUeXBlcyBmcm9tICdwcm9wLXR5cGVzJztcblxuLy8gV2UgZG9uJ3QgY3VycmVudGx5IHN1cHBvcnQgYSBzZWNvbmRhcnkgY29sb3VyIHBhbGV0dGUsIHNvIHdlIHJlbW92ZSB0aGlzIG9wdGlvbiBmb3Igbm93XG5leHBvcnQgdHlwZSBJbnB1dFByb3BzID0gT21pdDxJbnB1dEJhc2VQcm9wcywgJ2NvbG9yJz47XG5cbmV4cG9ydCBpbnRlcmZhY2UgQ3VzdG9tSW5wdXRQcm9wcyBleHRlbmRzIElucHV0UHJvcHMge1xuICAvKipcbiAgICogVXNlZCB0byBzcGVjaWZ5IGEgd2lkdGggb2YgdGhlIGlucHV0IGJhc2VkIG9uIHRoZSBleHBlY3RlZCBudW1iZXIgb2YgY2hhcmFjdGVyc1xuICAgKi9cbiAgY2hhcmFjdGVyV2lkdGg/OiBudW1iZXI7XG59XG5cbmNvbnN0IElucHV0Um9vdCA9IHN0eWxlZChJbnB1dEJhc2UsIHtcbiAgc2hvdWxkRm9yd2FyZFByb3A6IChwcm9wKSA9PiBwcm9wICE9PSAnY2hhcmFjdGVyV2lkdGgnXG59KTxDdXN0b21JbnB1dFByb3BzPigoeyB0aGVtZSwgY2hhcmFjdGVyV2lkdGggfSkgPT4ge1xuICBjb25zdCBib3JkZXJDb2xvciA9ICcjODc4QjhGJztcbiAgcmV0dXJuIHtcbiAgICAnJiBpbnB1dCc6IHtcbiAgICAgIGxpbmVIZWlnaHQ6IDEuNSxcbiAgICAgIGhlaWdodDogJzEuNWVtJyxcbiAgICAgIHBhZGRpbmc6IDAsXG4gICAgICAuLi4oY2hhcmFjdGVyV2lkdGggPyB7IHdpZHRoOiBgJHtjaGFyYWN0ZXJXaWR0aCArIDF9Y2hgIH0gOiB7fSlcbiAgICB9LFxuICAgIGJvcmRlcjogYDFweCBzb2xpZCAke2JvcmRlckNvbG9yfWAsXG4gICAgYm9yZGVyUmFkaXVzOiB0aGVtZS5zaGFwZS5ib3JkZXJSYWRpdXMsXG4gICAgcGFkZGluZzogJzExcHggN3B4JyxcbiAgICAnJjpob3Zlcic6IHtcbiAgICAgIGJvcmRlckNvbG9yOiB0aGVtZS5wYWxldHRlLnRleHQucHJpbWFyeVxuICAgIH0sXG4gICAgLy8gUmVzZXQgb24gdG91Y2ggZGV2aWNlcywgaXQgZG9lc24ndCBhZGQgc3BlY2lmaWNpdHlcbiAgICAnQG1lZGlhIChob3Zlcjogbm9uZSknOiB7XG4gICAgICAnJjpob3Zlcic6IHtcbiAgICAgICAgYm9yZGVyQ29sb3JcbiAgICAgIH1cbiAgICB9LFxuICAgICcmLk11aS1mb2N1c2VkJzoge1xuICAgICAgYm9yZGVyQ29sb3I6IHRoZW1lLnBhbGV0dGUucHJpbWFyeS5tYWluLFxuICAgICAgYm94U2hhZG93OiBgMCAwIDAgMC4ycmVtICR7YWxwaGEodGhlbWUucGFsZXR0ZS5wcmltYXJ5Lm1haW4sIDAuMil9YFxuICAgIH0sXG4gICAgJyYuTXVpLWVycm9yJzoge1xuICAgICAgYm9yZGVyQ29sb3I6IHRoZW1lLnBhbGV0dGUuZXJyb3IubWFpbixcbiAgICAgICcmLk11aS1mb2N1c2VkJzoge1xuICAgICAgICBib3hTaGFkb3c6IGAwIDAgMCAwLjJyZW0gJHthbHBoYSh0aGVtZS5wYWxldHRlLmVycm9yLm1haW4sIDAuMil9YFxuICAgICAgfVxuICAgIH0sXG4gICAgJyYuTXVpLWRpc2FibGVkJzoge1xuICAgICAgYm9yZGVyQ29sb3I6IHRoZW1lLnBhbGV0dGUuYWN0aW9uLmRpc2FibGVkXG4gICAgfVxuICB9O1xufSk7XG5cbmNvbnN0IElucHV0OiBGQzxDdXN0b21JbnB1dFByb3BzPiA9IFJlYWN0LmZvcndhcmRSZWYoZnVuY3Rpb24gSW5wdXQocHJvcHMsIHJlZikge1xuICByZXR1cm4gPElucHV0Um9vdCB7Li4ucHJvcHN9IHJlZj17cmVmfSAvPjtcbn0pO1xuXG5JbnB1dC5wcm9wVHlwZXMgPSB7XG4gIC4uLihJbnB1dEJhc2UgYXMgRkM8Q3VzdG9tSW5wdXRQcm9wcz4pLnByb3BUeXBlcyxcbiAgY2hhcmFjdGVyV2lkdGg6IFByb3BUeXBlcy5udW1iZXJcbn07XG5cbmV4cG9ydCBkZWZhdWx0IElucHV0O1xuIl0sIm5hbWVzIjpbInN0eWxlZCIsIklucHV0QmFzZSIsImFscGhhIiwiUmVhY3QiLCJQcm9wVHlwZXMiXSwibWFwcGluZ3MiOiI7Ozs7Ozs7Ozs7Ozs7O0FBQUE7QUFpQkEsTUFBTSxTQUFTLEdBQUdBLHVCQUFNLENBQUNDLDZCQUFTLEVBQUU7SUFDbEMsaUJBQWlCLEVBQUUsQ0FBQyxJQUFJLEtBQUssSUFBSSxLQUFLLGdCQUFnQjtDQUN2RCxDQUFDLENBQW1CLENBQUMsRUFBRSxLQUFLLEVBQUUsY0FBYyxFQUFFO0lBQzdDLE1BQU0sV0FBVyxHQUFHLFNBQVMsQ0FBQztJQUM5QixPQUFPO1FBQ0wsU0FBUyxrQkFDUCxVQUFVLEVBQUUsR0FBRyxFQUNmLE1BQU0sRUFBRSxPQUFPLEVBQ2YsT0FBTyxFQUFFLENBQUMsS0FDTixjQUFjLEdBQUcsRUFBRSxLQUFLLEVBQUUsR0FBRyxjQUFjLEdBQUcsQ0FBQyxJQUFJLEVBQUUsR0FBRyxFQUFFLEVBQy9EO1FBQ0QsTUFBTSxFQUFFLGFBQWEsV0FBVyxFQUFFO1FBQ2xDLFlBQVksRUFBRSxLQUFLLENBQUMsS0FBSyxDQUFDLFlBQVk7UUFDdEMsT0FBTyxFQUFFLFVBQVU7UUFDbkIsU0FBUyxFQUFFO1lBQ1QsV0FBVyxFQUFFLEtBQUssQ0FBQyxPQUFPLENBQUMsSUFBSSxDQUFDLE9BQU87U0FDeEM7O1FBRUQsc0JBQXNCLEVBQUU7WUFDdEIsU0FBUyxFQUFFO2dCQUNULFdBQVc7YUFDWjtTQUNGO1FBQ0QsZUFBZSxFQUFFO1lBQ2YsV0FBVyxFQUFFLEtBQUssQ0FBQyxPQUFPLENBQUMsT0FBTyxDQUFDLElBQUk7WUFDdkMsU0FBUyxFQUFFLGdCQUFnQkMsWUFBSyxDQUFDLEtBQUssQ0FBQyxPQUFPLENBQUMsT0FBTyxDQUFDLElBQUksRUFBRSxHQUFHLENBQUMsRUFBRTtTQUNwRTtRQUNELGFBQWEsRUFBRTtZQUNiLFdBQVcsRUFBRSxLQUFLLENBQUMsT0FBTyxDQUFDLEtBQUssQ0FBQyxJQUFJO1lBQ3JDLGVBQWUsRUFBRTtnQkFDZixTQUFTLEVBQUUsZ0JBQWdCQSxZQUFLLENBQUMsS0FBSyxDQUFDLE9BQU8sQ0FBQyxLQUFLLENBQUMsSUFBSSxFQUFFLEdBQUcsQ0FBQyxFQUFFO2FBQ2xFO1NBQ0Y7UUFDRCxnQkFBZ0IsRUFBRTtZQUNoQixXQUFXLEVBQUUsS0FBSyxDQUFDLE9BQU8sQ0FBQyxNQUFNLENBQUMsUUFBUTtTQUMzQztLQUNGLENBQUM7QUFDSixDQUFDLENBQUMsQ0FBQztNQUVHLEtBQUssR0FBeUJDLHlCQUFLLENBQUMsVUFBVSxDQUFDLFNBQVMsS0FBSyxDQUFDLEtBQUssRUFBRSxHQUFHO0lBQzVFLE9BQU9BLHdDQUFDLFNBQVMsb0JBQUssS0FBSyxJQUFFLEdBQUcsRUFBRSxHQUFHLElBQUksQ0FBQztBQUM1QyxDQUFDLEVBQUU7QUFFSCxLQUFLLENBQUMsU0FBUyxtQ0FDVEYsNkJBQWtDLENBQUMsU0FBUyxLQUNoRCxjQUFjLEVBQUVHLDZCQUFTLENBQUMsTUFBTSxHQUNqQzs7OzsifQ==