UNPKG

8.31 kBSource Map (JSON)View Raw
1{"version":3,"file":"TextInput.js","sources":["../src/components/Input/TextInput.js"],"sourcesContent":["import React, { useCallback } from 'react'\nimport PropTypes from 'prop-types'\nimport { useTheme } from '../../theme'\nimport { warnOnce } from '../../utils'\nimport { textStyle, GU, RADIUS } from '../../style'\n\n// Simple text input\nconst TextInput = React.forwardRef(\n ({ autofocus, multiline, type, ...props }, ref) => {\n const theme = useTheme()\n\n const handleRef = useCallback(\n element => {\n if (ref) {\n ref.current = element\n }\n if (autofocus && element) {\n element.focus()\n }\n },\n [autofocus, ref]\n )\n\n return (\n <input\n ref={handleRef}\n as={multiline ? 'textarea' : 'input'}\n type={multiline ? undefined : type}\n {...props}\n css={`\n width: ${({ wide }) => (wide ? '100%' : 'auto')};\n height: ${5 * GU}px;\n padding: 0 ${1.5 * GU}px;\n background: ${theme.surface};\n border: 1px solid ${theme.border};\n color: ${theme.surfaceContent};\n border-radius: ${RADIUS}px;\n appearance: none;\n ${textStyle('body3')};\n\n ${multiline\n ? `\n height: auto;\n padding: ${1 * GU}px ${1.5 * GU}px;\n resize: vertical;\n `\n : ''}\n\n &:focus {\n outline: none;\n border-color: ${theme.selected};\n }\n\n &:read-only {\n color: ${theme.hint};\n border-color: ${theme.border};\n }\n\n &::placeholder {\n color: ${theme.hint};\n opacity: 1;\n }\n\n &:invalid {\n box-shadow: none;\n }\n `}\n />\n )\n }\n)\n\nTextInput.propTypes = {\n autofocus: PropTypes.bool,\n multiline: PropTypes.bool,\n required: PropTypes.bool,\n type: PropTypes.string,\n}\n\nTextInput.defaultProps = {\n autofocus: false,\n multiline: false,\n required: false,\n type: 'text',\n}\n\n// Text input wrapped to allow adornments\nconst WrapperTextInput = React.forwardRef(\n (\n {\n adornment,\n adornmentPosition,\n adornmentSettings: {\n width: adornmentWidth = 36,\n padding: adornmentPadding = 4,\n },\n ...props\n },\n ref\n ) => {\n const theme = useTheme()\n if (!adornment) {\n return <TextInput ref={ref} {...props} />\n }\n return (\n <div\n css={`\n display: inline-flex;\n position: relative;\n width: ${props.wide ? '100%' : 'max-content'};\n `}\n >\n <TextInput\n ref={ref}\n css={`\n ${adornmentPosition === 'end'\n ? 'padding-right'\n : 'padding-left'}: ${adornmentWidth - adornmentPadding * 2}px;\n `}\n {...props}\n />\n <div\n css={`\n position: absolute;\n top: 0;\n bottom: 0;\n height: 100%;\n ${adornmentPosition === 'end'\n ? 'right'\n : 'left'}: ${adornmentPadding}px;\n display: flex;\n align-items: center;\n justify-content: center;\n color: ${theme.surfaceContentSecondary};\n `}\n >\n {adornment}\n </div>\n </div>\n )\n }\n)\n\nWrapperTextInput.propTypes = {\n ...TextInput.propTypes,\n adornment: PropTypes.node,\n adornmentPosition: PropTypes.oneOf(['start', 'end']),\n adornmentSettings: PropTypes.shape({\n width: PropTypes.number,\n padding: PropTypes.number,\n }),\n}\n\nWrapperTextInput.defaultProps = {\n ...TextInput.defaultProps,\n adornment: null,\n adornmentPosition: 'start',\n adornmentSettings: {},\n}\n\n// <input type=number> (only for compat)\nfunction TextInputNumber(props) {\n warnOnce(\n 'TextInputNumber',\n 'TextInputNumber is deprecated. Please use TextInput instead.'\n )\n return <TextInput type=\"number\" {...props} />\n}\n\n// Multiline input (textarea element)\nfunction TextInputMultiline(props) {\n return <TextInput multiline {...props} />\n}\n\nTextInputMultiline.propTypes = {\n required: PropTypes.bool,\n}\nTextInputMultiline.defaultProps = {\n required: false,\n}\n\nWrapperTextInput.Number = TextInputNumber\nWrapperTextInput.Multiline = TextInputMultiline\n\nexport default WrapperTextInput\n"],"names":["wide","RADIUS","TextInput","React","forwardRef","ref","autofocus","multiline","type","props","theme","useTheme","handleRef","useCallback","element","current","focus","undefined","GU","surface","border","surfaceContent","textStyle","selected","hint","propTypes","PropTypes","bool","required","string","defaultProps","WrapperTextInput","adornment","adornmentPosition","adornmentSettings","width","adornmentWidth","padding","adornmentPadding","surfaceContentSecondary","node","oneOf","shape","number","TextInputNumber","warnOnce","TextInputMultiline","Number","Multiline"],"mappings":"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"}
\No newline at end of file