@homecode/ui 4.18.16 → 4.18.18

package/dist/esm/src/components/Input/Input.js

@@ -1,2 +1,345 @@
-import{jsx,jsxs,Fragment}from"react/jsx-runtime";import{Component,createRef,createElement}from"react";import cn from"classnames";import{createStore}from"justorm/react";import omit from"lodash.omit";import{Label}from"../Label/Label.js";import{RequiredStar}from"../RequiredStar/RequiredStar.js";import{AssistiveText}from"../AssistiveText/AssistiveText.js";import{Button}from"../Button/Button.js";import{Icon}from"../Icon/Icon.js";import{Scroll}from"../Scroll/Scroll.js";import{capitalize}from"../../tools/string.js";import{generateUID}from"../../tools/uid.js";import S from"./Input.styl.js";import"../ButtonGroup/ButtonGroup.styl.js";import"../Calendar/Calendar.styl.js";import"compareq";import"lodash.pick";import"timen";import"../Portal/Portal.js";import"../Paranja/Paranja.styl.js";import"../../tools/dom.js";import debounce from"../../tools/debounce.js";import"../Popup/Popup.styl.js";import"../../tools/queryParams.js";import"../Select/Select.styl.js";import"../Checkbox/Checkbox.styl.js";import"../Container/Container.styl.js";import"../DatePicker/DatePicker.styl.js";import"moment";import"../DatePickerInput/DatePickerInput.styl.js";import"../Draggable/Draggable.styl.js";import"../Expand/Expand.styl.js";import"../Form/Form.styl.js";import"../Form/Validator.js";import"../Form/SubmitButtons/SubmitButtons.styl.js";import"../Spinner/Spinner.styl.js";import"../Gallery/Gallery.styl.js";import"../Heading/Heading.js";import"../InputFile/InputFile.styl.js";import"../InputFile/Item/Item.styl.js";import"../LightBox/LightBox.styl.js";import"../Notifications/Notifications.js";import"../PopupMenu/PopupMenu.styl.js";import"../Router/Router.js";import"../Table/Table.styl.js";import"../Tabs/Tabs.styl.js";import"../Text/Text.js";import"../Virtualized/Virtualized.styl.js";import"../Virtualized/List/List.styl.js";import"../Virtualized/List/ListScroll.styl.js";import"../../services/i18n.js";const TEXTAREA_SCROLL_TOP_OFFSET={s:30,m:40,l:50};class Input extends Component{inputRef=createRef();isClearPressed=!1;cursorPos=0;prevLabelText="";store;uid=generateUID();static defaultProps={type:"text",size:"m",variant:"default"};constructor(e){super(e);var e=e.value??e.defaultValue??"",t=this.hasValue(e);this.store=createStore(this,{isFocused:!1,isLabelOnTop:this.isLabelOnTop(t),inputValue:e,hasValue:t,labelClipPath:"",autoComplete:null})}componentDidMount(){document.addEventListener("keyup",this.onDocKeyUp,!0),this.isTextArea()&&(this.inputRef.current.innerText=this.store.inputValue,document.addEventListener("paste",this.onTextareaPaste,!0))}componentDidUpdate(e){var t=this.props["value"];this.updateSelection(),this.updateAutoComplete(),t!==e.value&&t!==this.store.inputValue&&(this.store.inputValue=t,this.isTextArea()&&(this.inputRef.current.innerText=t),this.updateHasValue(),this.updateLabelPosition())}updateAutoComplete(){var e=(this.inputRef.current?.closest("form"))?.getAttribute("autocomplete");this.store.autoComplete!==e&&(this.store.autoComplete=e)}updateSelection(){var e=this.props["type"],t=this.store["isFocused"],s=this.inputRef.current;t&&s&&"text"===e&&(s.selectionStart=this.cursorPos,s.selectionEnd=this.cursorPos)}updateLabelPosition(){this.store.isLabelOnTop=this.isLabelOnTop()}updateHasValue(){this.store.hasValue=this.hasValue()}hasValue(e=this.store.inputValue){var{type:t,defaultValue:s}=this.props;return"number"===t||Boolean(e||s)}isTextArea=()=>"textarea"===this.props.type;isNumber=()=>"number"===this.props.type;isLabelOnTop(e=this.store?.hasValue){var{forceLabelOnTop:t,addonLeft:s}=this.props;return t||Boolean(s)||e||this.store?.isFocused}getValue(e=this.store.inputValue){var t=this.props["type"];return"number"===t?e?parseFloat(e):0:this.isTextArea()?this.inputRef.current.innerText.replace("/n",""):e}onTextareaPaste=e=>{this.store.isFocused&&(e.preventDefault(),e.stopPropagation(),this.pasteToTextarea(e.clipboardData.getData("text/plain")))};pasteToTextarea=debounce(e=>{console.log("onTextareaPaste");var t=window.getSelection(),s=this.inputRef.current,r=s.innerText,i=t.extentOffset,r=r.substring(0,i)+e+r.substring(i);s.innerText=r,t.setPosition(s.firstChild,i+e.length)},100);onClearPress=e=>{var{onChange:t,onClear:s}=this.props;this.isTextArea(),e.preventDefault(),e.stopPropagation(),s?.(),this.isTextArea()&&(this.inputRef.current.innerText=""),t?this.onChange(""):this.isTextArea||(this.inputRef.current.value=""),this.inputRef.current?.focus()};onDocKeyUp=e=>{var t=this.props["changeOnEnd"],s=this.store["isFocused"];t&&"Enter"===e.key&&(e.preventDefault(),e.stopPropagation(),this.onTypingEnd()),s&&"Escape"===e.key&&(e.preventDefault(),e.stopPropagation(),this.inputRef.current?.blur())};handleChange=e=>{e=this.getValue(e.target.value);this.onChange(e)};onChange=(e,t)=>{var{onChange:s,changeOnEnd:r,type:i}=this.props;"number"!==i&&(this.cursorPos=this.inputRef.current.selectionStart),r?(this.store.inputValue=e,this.updateHasValue()):s?s(t,e):this.store.inputValue=e};onNumberWheel=e=>{var{onChange:t,step:s=1}=this.props,s=this.getValue()+s*e;this.onChange(s),t?.(null,s)};onTextAreaInput=e=>{var t=this.props["onInput"];this.store.inputValue=e.target.innerText,this.updateHasValue(),this.handleChange(e),t?.(e)};onLabelClipPathChange=e=>this.store.labelClipPath=e;onTypingEnd=()=>{var e=this.props["onChange"];e?.(null,this.getValue())};onFocus=e=>{var t=this.props["onFocus"];this.store.isFocused=!0,this.updateLabelPosition(),t?.(e)};onBlur=e=>{var t,s,r,i,o;this.props.changeOnEnd&&this.onTypingEnd(),this.isClearPressed?e.preventDefault():(t=this.getValue(e?.target?.value),{onBlur:s,onChange:r,value:i,checkAutofill:o}=this.props,this.store.isFocused=!1,this.updateLabelPosition(),o&&r&&!i&&t&&r(null,t),s&&s(e))};getControlProps(){const{value:e,label:t,controlProps:s,placeholder:r,...i}=this.props;var{autoComplete:o,isLabelOnTop:a,inputValue:n}=this.store,n={...omit(i,["className","clear","onClear","hasClear","size","error","checkAutofill","addonLeft","addonRight","forceLabelOnTop","changeOnEnd","scrollProps"]),value:n,...s,onChange:this.handleChange,onFocus:this.onFocus,onBlur:this.onBlur};return this.isTextArea()&&(n.contentEditable=!0,n.onInput=this.onTextAreaInput),!r||e||t&&!a||(n.placeholder=r),o||(n.suppressHydrationWarning=!0,n.autoComplete=this.uid,delete n.name),void 0===n.value&&(n.value=" "),n}wrapControll(e){var t,s,r;return this.isTextArea()?({size:t,scrollProps:s}=this.props,r=this.store["labelClipPath"],createElement(Scroll,{y:!0,size:t,fadeSize:"s",className:cn(S.scroller,S.controlWrapper),...s,innerProps:{suppressHydrationWarning:!0,style:{clipPath:r}},offset:{y:{before:TEXTAREA_SCROLL_TOP_OFFSET[t],after:20}},key:"scroller"},e)):jsx("div",{className:S.controlWrapper,children:e})}renderAddon(e){var t,s,e="addon"+capitalize(e),r=this.props[e];return r?(e={className:cn(S[e],this.props[e+"ClassName"]),key:e},s=(t="string"==typeof r)?jsx("span",{children:r}):r,t&&(e.title=r),jsx("div",{...e,children:s})):null}render(){var{className:e,size:t,label:s,value:r,variant:i,error:o,hasClear:a,required:n,hideRequiredStar:l,disabled:p,addonRight:u}=this.props,{isFocused:h,hasValue:c,labelClipPath:d,isLabelOnTop:m}=this.store,x=this.isNumber(),g=this.isTextArea(),j=g?"span":"input",b=this.getControlProps(),i=cn(S.root,g&&S.isTextArea,S["size-"+t],S["variant-"+i],h&&S.isFocused,o&&S.hasError,a&&S.hasClear,p&&S.isDisabled,e);return jsxs("div",{className:i,title:r,children:[jsxs("label",{className:S.main,children:[jsx("div",{className:S.border,suppressHydrationWarning:!0,style:{clipPath:d}},"border"),this.renderAddon("left"),this.wrapControll(jsxs(Fragment,{children:[createElement(j,{...b,className:cn(S.control,b?.className),ref:this.inputRef,key:"control"}),g&&b.placeholder&&jsx("span",{className:S.placeholder,spellCheck:!1,children:b.placeholder})]})),x&&jsxs("div",{className:S.numberArrows,children:[jsx(Button,{variant:"clear",onClick:()=>this.onNumberWheel(1),tabIndex:-1,children:jsx(Icon,{type:"chevronUp",size:t})}),jsx(Button,{variant:"clear",onClick:()=>this.onNumberWheel(-1),tabIndex:-1,children:jsx(Icon,{type:"chevronDown",size:t})})]}),jsx(Label,{className:cn(S.label,u&&S.hasAddonRight),size:t,isOnTop:m,isError:Boolean(o),onClipPathChange:this.onLabelClipPathChange,children:s},"label"),this.renderAddon("right"),n&&!l&&jsx(RequiredStar,{size:t},"required-star")]},"main"),a&&!p&&c&&jsx(Button,{className:S.clearButton,variant:"clear",size:t,square:!0,onClick:this.onClearPress,title:"",children:jsx(Icon,{className:S.clearIcon,size:t,type:"close"})},"clear"),!p&&"string"==typeof o&&jsx(AssistiveText,{variant:"danger",size:t,children:o},"assistive-text")]})}}export{Input};
-//# sourceMappingURL=Input.js.map
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+import { Component, createRef, createElement } from 'react';
+import cn from 'classnames';
+import { createStore } from 'justorm/react';
+import omit from 'lodash.omit';
+import { Label } from '../Label/Label.js';
+import { RequiredStar } from '../RequiredStar/RequiredStar.js';
+import { AssistiveText } from '../AssistiveText/AssistiveText.js';
+import { Button } from '../Button/Button.js';
+import { Icon } from '../Icon/Icon.js';
+import { Scroll } from '../Scroll/Scroll.js';
+import { capitalize } from '../../tools/string.js';
+import { generateUID } from '../../tools/uid.js';
+import S from './Input.styl.js';
+import '../ButtonGroup/ButtonGroup.styl.js';
+import '../Calendar/Calendar.styl.js';
+import 'compareq';
+import 'lodash.pick';
+import 'timen';
+import '../Portal/Portal.js';
+import '../Paranja/Paranja.styl.js';
+import '../../tools/dom.js';
+import debounce from '../../tools/debounce.js';
+import '../Popup/Popup.styl.js';
+import '../../tools/queryParams.js';
+import '../Select/Select.styl.js';
+import '../Checkbox/Checkbox.styl.js';
+import '../Container/Container.styl.js';
+import '../DatePicker/DatePicker.styl.js';
+import 'moment';
+import '../DatePickerInput/DatePickerInput.styl.js';
+import '../Draggable/Draggable.styl.js';
+import '../Expand/Expand.styl.js';
+import '../Form/Form.styl.js';
+import '../Form/Validator.js';
+import '../Form/SubmitButtons/SubmitButtons.styl.js';
+import '../Spinner/Spinner.styl.js';
+import '../Gallery/Gallery.styl.js';
+import '../Heading/Heading.js';
+import '../InputFile/InputFile.styl.js';
+import '../InputFile/Item/Item.styl.js';
+import '../LightBox/LightBox.styl.js';
+import '../Notifications/Notifications.js';
+import '../PopupMenu/PopupMenu.styl.js';
+import '../Router/Router.js';
+import '../Table/Table.styl.js';
+import '../Tabs/Tabs.styl.js';
+import '../Text/Text.js';
+import '../Virtualized/Virtualized.styl.js';
+import '../Virtualized/List/List.styl.js';
+import '../Virtualized/List/ListScroll.styl.js';
+import '../../services/i18n.js';
+
+const TEXTAREA_SCROLL_TOP_OFFSET = {
+    s: 30,
+    m: 40,
+    l: 50,
+};
+class Input extends Component {
+    inputRef = createRef();
+    isClearPressed = false;
+    cursorPos = 0;
+    prevLabelText = '';
+    store;
+    uid = generateUID();
+    static defaultProps = {
+        type: 'text',
+        size: 'm',
+        variant: 'default',
+    };
+    constructor(props) {
+        super(props);
+        const inputValue = props.value ?? props.defaultValue ?? '';
+        const hasValue = this.hasValue(inputValue);
+        this.store = createStore(this, {
+            isFocused: false,
+            isLabelOnTop: this.isLabelOnTop(hasValue),
+            inputValue,
+            hasValue,
+            labelClipPath: '',
+            autoComplete: null,
+        });
+    }
+    componentDidMount() {
+        document.addEventListener('keyup', this.onDocKeyUp, true);
+        if (this.isTextArea()) {
+            this.inputRef.current.innerText = this.store.inputValue;
+            document.addEventListener('paste', this.onTextareaPaste, true);
+        }
+    }
+    componentDidUpdate(prevProps) {
+        const { value } = this.props;
+        this.updateSelection();
+        this.updateAutoComplete();
+        if (value !== prevProps.value && value !== this.store.inputValue) {
+            this.store.inputValue = value;
+            // @ts-ignore
+            if (this.isTextArea())
+                this.inputRef.current.innerText = value;
+            this.updateHasValue();
+            this.updateLabelPosition();
+        }
+    }
+    updateAutoComplete() {
+        const form = this.inputRef.current?.closest('form');
+        const val = form?.getAttribute('autocomplete');
+        if (this.store.autoComplete !== val)
+            this.store.autoComplete = val;
+    }
+    updateSelection() {
+        const { type } = this.props;
+        const { isFocused } = this.store;
+        const elem = this.inputRef.current;
+        if (!isFocused || !elem || type !== 'text')
+            return;
+        elem.selectionStart = this.cursorPos;
+        elem.selectionEnd = this.cursorPos;
+    }
+    updateLabelPosition() {
+        this.store.isLabelOnTop = this.isLabelOnTop();
+    }
+    updateHasValue() {
+        this.store.hasValue = this.hasValue();
+    }
+    hasValue(value = this.store.inputValue) {
+        const { type, defaultValue } = this.props;
+        return type === 'number' || Boolean(value || defaultValue);
+    }
+    isTextArea = () => this.props.type === 'textarea';
+    isNumber = () => this.props.type === 'number';
+    isLabelOnTop(hasValue = this.store?.hasValue) {
+        const { forceLabelOnTop, addonLeft } = this.props;
+        return (forceLabelOnTop || Boolean(addonLeft) || hasValue || this.store?.isFocused);
+    }
+    getValue(val = this.store.inputValue) {
+        const { type } = this.props;
+        if (type === 'number') {
+            if (val)
+                return parseFloat(val);
+            return 0;
+        }
+        if (this.isTextArea())
+            return this.inputRef.current.innerText.replace('/n', '');
+        return val;
+    }
+    onTextareaPaste = e => {
+        if (!this.store.isFocused)
+            return;
+        e.preventDefault();
+        e.stopPropagation();
+        this.pasteToTextarea(e.clipboardData.getData('text/plain'));
+    };
+    pasteToTextarea = debounce((text) => {
+        console.log('onTextareaPaste');
+        const sel = window.getSelection();
+        const textarea = this.inputRef.current;
+        const prevText = textarea.innerText;
+        // @ts-ignore
+        const startPos = sel.extentOffset;
+        const nextText = prevText.substring(0, startPos) + text + prevText.substring(startPos);
+        textarea.innerText = nextText;
+        sel.setPosition(textarea.firstChild, startPos + text.length);
+    }, 100);
+    onClearPress = e => {
+        const { onChange, onClear } = this.props;
+        this.isTextArea();
+        e.preventDefault();
+        e.stopPropagation();
+        onClear?.();
+        if (this.isTextArea()) {
+            this.inputRef.current.innerText = '';
+        }
+        if (onChange) {
+            this.onChange('');
+        }
+        else {
+            if (!this.isTextArea) {
+                this.inputRef.current.value = '';
+            }
+        }
+        this.inputRef.current?.focus();
+    };
+    onDocKeyUp = (e) => {
+        const { changeOnEnd } = this.props;
+        const { isFocused } = this.store;
+        if (changeOnEnd && e.key === 'Enter') {
+            e.preventDefault();
+            e.stopPropagation();
+            this.onTypingEnd();
+        }
+        if (isFocused && e.key === 'Escape') {
+            e.preventDefault();
+            e.stopPropagation();
+            this.inputRef.current?.blur();
+        }
+    };
+    handleChange = (e) => {
+        const value = this.getValue(e.target.value);
+        this.onChange(value);
+    };
+    onChange = (value, e) => {
+        const { onChange, changeOnEnd, type } = this.props;
+        const isNumber = type === 'number';
+        if (!isNumber)
+            this.cursorPos = this.inputRef.current.selectionStart;
+        if (changeOnEnd) {
+            this.store.inputValue = value;
+            this.updateHasValue();
+        }
+        else if (onChange) {
+            onChange(e, value);
+        }
+        else {
+            this.store.inputValue = value;
+        }
+    };
+    onNumberWheel = delta => {
+        const { onChange, step = 1 } = this.props;
+        const value = this.getValue() + step * delta;
+        this.onChange(value);
+        onChange?.(null, value);
+    };
+    onTextAreaInput = e => {
+        const { onInput } = this.props;
+        this.store.inputValue = e.target.innerText;
+        this.updateHasValue();
+        this.handleChange(e);
+        onInput?.(e);
+    };
+    onLabelClipPathChange = (clipPath) => (this.store.labelClipPath = clipPath);
+    onTypingEnd = () => {
+        const { onChange } = this.props;
+        onChange?.(null, this.getValue());
+    };
+    onFocus = e => {
+        const { onFocus } = this.props;
+        this.store.isFocused = true;
+        this.updateLabelPosition();
+        onFocus?.(e);
+    };
+    onBlur = e => {
+        if (this.props.changeOnEnd)
+            this.onTypingEnd();
+        if (this.isClearPressed) {
+            e.preventDefault();
+            return;
+        }
+        // @ts-ignore
+        const val = this.getValue(e?.target?.value);
+        const { onBlur, onChange, value, checkAutofill } = this.props;
+        this.store.isFocused = false;
+        this.updateLabelPosition();
+        // some browsers not fire `onchange` after autofill
+        if (checkAutofill && onChange && !value && val)
+            onChange(null, val);
+        if (onBlur)
+            onBlur(e);
+    };
+    getControlProps() {
+        const { value, label, controlProps, placeholder, ...rest } = this.props;
+        const { autoComplete, isLabelOnTop, inputValue } = this.store;
+        const props = {
+            ...omit(rest, [
+                'className',
+                'clear',
+                'onClear',
+                'hasClear',
+                // 'required',
+                'hideRequiredStar',
+                'size',
+                'error',
+                'checkAutofill',
+                'addonLeft',
+                'addonRight',
+                'forceLabelOnTop',
+                'changeOnEnd',
+                'scrollProps',
+            ]),
+            value: inputValue,
+            ...controlProps,
+            onChange: this.handleChange,
+            onFocus: this.onFocus,
+            onBlur: this.onBlur,
+        };
+        if (this.isTextArea()) {
+            props.contentEditable = true;
+            props.onInput = this.onTextAreaInput;
+        }
+        if (placeholder && !value && (!label || isLabelOnTop)) {
+            props.placeholder = placeholder;
+        }
+        if (!autoComplete) {
+            props.suppressHydrationWarning = true;
+            props.autoComplete = this.uid;
+            delete props.name;
+        }
+        if (props.value === undefined)
+            props.value = ' ';
+        return props;
+    }
+    wrapControll(control) {
+        if (this.isTextArea()) {
+            const { size, scrollProps } = this.props;
+            const { labelClipPath } = this.store;
+            return (createElement(Scroll, { y: true, size: size, fadeSize: "s", className: cn(S.scroller, S.controlWrapper), ...scrollProps, innerProps: {
+                    suppressHydrationWarning: true,
+                    style: { clipPath: labelClipPath },
+                }, offset: {
+                    y: { before: TEXTAREA_SCROLL_TOP_OFFSET[size], after: 20 },
+                }, key: "scroller" }, control));
+        }
+        return jsx("div", { className: S.controlWrapper, children: control });
+    }
+    renderAddon(type) {
+        const name = `addon${capitalize(type)}`;
+        const content = this.props[name];
+        if (!content)
+            return null;
+        const props = {
+            // @ts-ignore
+            className: cn(S[name], this.props[`${name}ClassName`]),
+            key: name,
+        };
+        const isString = typeof content === 'string';
+        const elem = isString ? jsx("span", { children: content }) : content;
+        // @ts-ignore
+        if (isString)
+            props.title = content;
+        return jsx("div", { ...props, children: elem });
+    }
+    render() {
+        const { className, size, label, value, variant, error, hasClear, required, hideRequiredStar, disabled, addonRight, } = this.props;
+        const { isFocused, hasValue, labelClipPath, isLabelOnTop } = this.store;
+        const isNumber = this.isNumber();
+        const isTextArea = this.isTextArea();
+        const Control = isTextArea ? 'span' : 'input';
+        const controlProps = this.getControlProps();
+        const classes = cn(S.root, isTextArea && S.isTextArea, S[`size-${size}`], S[`variant-${variant}`], isFocused && S.isFocused, error && S.hasError, hasClear && S.hasClear, disabled && S.isDisabled, className);
+        return (
+        // @ts-ignore
+        jsxs("div", { className: classes, title: value, children: [jsxs("label", { className: S.main, children: [jsx("div", { className: S.border, suppressHydrationWarning: true, style: { clipPath: labelClipPath } }, "border"), this.renderAddon('left'), this.wrapControll(jsxs(Fragment, { children: [createElement(Control, { ...controlProps, className: cn(S.control, controlProps?.className), ref: this.inputRef, key: "control" }), isTextArea && controlProps.placeholder && (jsx("span", { className: S.placeholder, spellCheck: false, children: controlProps.placeholder }))] })), isNumber && (jsxs("div", { className: S.numberArrows, children: [jsx(Button, { variant: "clear", onClick: () => this.onNumberWheel(1), tabIndex: -1, children: jsx(Icon, { type: "chevronUp", size: size }) }), jsx(Button, { variant: "clear", onClick: () => this.onNumberWheel(-1), tabIndex: -1, children: jsx(Icon, { type: "chevronDown", size: size }) })] })), jsx(Label, { className: cn(S.label, addonRight && S.hasAddonRight), size: size, isOnTop: isLabelOnTop, isError: Boolean(error), onClipPathChange: this.onLabelClipPathChange, children: label }, "label"), this.renderAddon('right'), required && !hideRequiredStar && (jsx(RequiredStar, { size: size }, "required-star"))] }, "main"), hasClear && !disabled && hasValue && (jsx(Button, { className: S.clearButton, variant: "clear", size: size, square: true, onClick: this.onClearPress, title: "", children: jsx(Icon, { className: S.clearIcon, size: size, type: "close" }) }, "clear")), !disabled && typeof error === 'string' && (jsx(AssistiveText, { variant: "danger", size: size, children: error }, "assistive-text"))] }));
+    }
+}
+
+export { Input };

package/dist/esm/src/components/Input/Input.styl.js

@@ -1,2 +1,7 @@
-import styleInject from"../../../node_modules/style-inject/dist/style-inject.es.js";var css_248z='.Input_root__kj4vQ{color:var(--accent-color);position:relative}.Input_root__kj4vQ.Input_isTextArea__1a6n1{max-height:10em}.Input_main__M6Qxb,.Input_root__kj4vQ{width:100%}.Input_controlWrapper__WgrZL,.Input_root__kj4vQ{max-width:100%}.Input_main__M6Qxb{border-radius:inherit;display:flex;max-width:100%;position:relative}.Input_isTextArea__1a6n1 .Input_main__M6Qxb{height:auto!important;max-height:inherit!important}.Input_size-s__-U0r-.Input_isTextArea__1a6n1 .Input_main__M6Qxb{padding-right:8px!important}.Input_size-m__jTEMl.Input_isTextArea__1a6n1 .Input_main__M6Qxb{padding-right:10px!important}.Input_size-l__BR-zg.Input_isTextArea__1a6n1 .Input_main__M6Qxb{padding-right:14px!important}.Input_border__01i-B{background-color:var(--accent-color-alpha-100);border-radius:inherit;bottom:0;left:0;pointer-events:none;position:absolute;right:0;top:0;transition:.15s ease-out;transition-property:box-shadow,border-color,background-color;z-index:0}.Input_root__kj4vQ:hover .Input_border__01i-B{background-color:var(--active-color-alpha-100)}.Input_variant-clean__yjtdm .Input_border__01i-B{background-color:transparent}.Input_isFocused__9jtFN.Input_variant-clean__yjtdm .Input_border__01i-B{background-color:var(--active-color-alpha-300)}.Input_variant-default__frNbg .Input_border__01i-B{background-color:var(--accent-color-alpha-100)}.Input_isFocused__9jtFN.Input_variant-default__frNbg .Input_border__01i-B{background-color:var(--active-color-alpha-300)}.Input_variant-outlined__qKjnJ .Input_border__01i-B{background-color:transparent;box-shadow:inset 0 0 0 2px var(--accent-color)}.Input_isFocused__9jtFN.Input_variant-outlined__qKjnJ .Input_border__01i-B{background-color:var(--active-color-alpha-300);box-shadow:inset 0 0 0 2px var(--active-color)}.Input_hasError__5iS2M .Input_variant-outlined__qKjnJ .Input_border__01i-B,.Input_hasError__5iS2M:hover .Input_variant-outlined__qKjnJ .Input_border__01i-B{box-shadow:inset 0 0 0 2px var(--danger-color)}.Input_isDisabled__e7J10.Input_variant-outlined__qKjnJ .Input_border__01i-B{box-shadow:none}.Input_size-s__-U0r-{font-size:16px}.Input_size-s__-U0r- .Input_main__M6Qxb{border-radius:4px;font-size:16px;min-height:30px;min-width:30px;padding:0 8px}.Input_size-m__jTEMl{font-size:20px}.Input_size-m__jTEMl .Input_main__M6Qxb{border-radius:6px;font-size:20px;min-height:40px;min-width:40px;padding:0 12px}.Input_size-l__BR-zg{font-size:24px}.Input_size-l__BR-zg .Input_main__M6Qxb{border-radius:8px;font-size:24px;min-height:50px;min-width:50px;padding:0 14px}.Input_isTextArea__1a6n1 .Input_main__M6Qxb{padding-left:0}.Input_isDisabled__e7J10{color:var(--accent-color-alpha-500);opacity:.4}.Input_addonLeft__i1c70,.Input_addonRight__A9Iht,.Input_control__wZcMD{font-size:inherit;font-weight:400}.Input_labelGap__T6fAj{opacity:0;pointer-events:none;position:absolute}.Input_label__FT90l.Input_hasAddonRight__ckzfA{padding-right:2em}.Input_isTextArea__1a6n1 .Input_label__FT90l{max-height:40px}.Input_scroller__OBm8M{max-height:100%;width:100%}.Input_controlWrapper__WgrZL{flex:1}.Input_control__wZcMD{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:none;box-shadow:none;box-shadow:inset 0 0 0 2px none;color:inherit;display:inline-flex;filter:none;flex-grow:1;height:100%;min-width:30px;position:relative;text-overflow:ellipsis;transition:border-color .15s ease-in-out 0s;width:100%}.Input_isTextArea__1a6n1 .Input_control__wZcMD{display:block;height:100%;min-height:100%;width:100%}.Input_isTextArea__1a6n1 .Input_control__wZcMD:hover{cursor:text}.Input_isTextArea__1a6n1 .Input_control__wZcMD:after{content:"";display:block}.Input_control__wZcMD[type=number]{-moz-appearance:textfield;margin-right:14px}.Input_control__wZcMD[type=number]::-webkit-inner-spin-button,.Input_control__wZcMD[type=number]::-webkit-outer-spin-button{-webkit-appearance:none}.Input_numberArrows__8jveR{display:flex;flex-direction:column;height:100%;position:absolute;right:0}.Input_numberArrows__8jveR>button{background-color:transparent!important;height:50%;max-height:none;min-height:0;min-height:auto;opacity:.5;padding-left:0;padding-right:0;transition:opacity .1s ease-out;width:50%}.Input_numberArrows__8jveR>button:hover{opacity:1}.Input_size-s__-U0r- .Input_numberArrows__8jveR>button{min-width:24px}.Input_size-m__jTEMl .Input_numberArrows__8jveR>button{min-width:32px}.Input_size-l__BR-zg .Input_numberArrows__8jveR>button{min-width:40px}.Input_numberArrows__8jveR>button>svg{transform:scale(.8)}.Input_numberArrows__8jveR>button:first-child>svg{margin-bottom:-5%}.Input_numberArrows__8jveR>button:last-child>svg{margin-top:-5%}.Input_size-s__-U0r-.Input_isTextArea__1a6n1 .Input_control__wZcMD,.Input_size-s__-U0r-.Input_isTextArea__1a6n1 .Input_placeholder__DRYLA{padding:8px 8px 0}.Input_size-s__-U0r-.Input_isTextArea__1a6n1 .Input_control__wZcMD:after,.Input_size-s__-U0r-.Input_isTextArea__1a6n1 .Input_placeholder__DRYLA:after{height:8px}.Input_size-m__jTEMl.Input_isTextArea__1a6n1 .Input_control__wZcMD,.Input_size-m__jTEMl.Input_isTextArea__1a6n1 .Input_placeholder__DRYLA{padding:10px 12px 0}.Input_size-m__jTEMl.Input_isTextArea__1a6n1 .Input_control__wZcMD:after,.Input_size-m__jTEMl.Input_isTextArea__1a6n1 .Input_placeholder__DRYLA:after{height:10px}.Input_size-l__BR-zg.Input_isTextArea__1a6n1 .Input_control__wZcMD,.Input_size-l__BR-zg.Input_isTextArea__1a6n1 .Input_placeholder__DRYLA{padding:12px 14px 0}.Input_size-l__BR-zg.Input_isTextArea__1a6n1 .Input_control__wZcMD:after,.Input_size-l__BR-zg.Input_isTextArea__1a6n1 .Input_placeholder__DRYLA:after{height:12px}.Input_control__wZcMD:-internal-autofill-selected,.Input_control__wZcMD:-webkit-autofill{animation-fill-mode:both;animation-name:Input_clearBg__jqI1h}.Input_size-s__-U0r-.Input_hasClear__5Y3nU .Input_control__wZcMD{padding-right:20px}.Input_size-m__jTEMl.Input_hasClear__5Y3nU .Input_control__wZcMD{padding-right:24px}.Input_size-l__BR-zg.Input_hasClear__5Y3nU .Input_control__wZcMD{padding-right:28px}.Input_control__wZcMD::-moz-placeholder{color:var(--accent-color-alpha-500)}.Input_control__wZcMD::placeholder{color:var(--accent-color-alpha-500)}.Input_control__wZcMD::-moz-selection{background-color:var(--active-color-alpha-300)}.Input_control__wZcMD::selection{background-color:var(--active-color-alpha-300)}.Input_placeholder__DRYLA{display:inline-block;left:0;max-width:100%;opacity:.4;overflow:hidden;padding:inherit;pointer-events:none;position:absolute;text-overflow:ellipsis;top:0;white-space:nowrap}.Input_addonLeft__i1c70,.Input_addonRight__A9Iht{align-items:center;display:inline-flex;flex-shrink:0;min-width:0;-webkit-user-select:none;-moz-user-select:none;user-select:none;z-index:1}.Input_size-s__-U0r- .Input_addonLeft__i1c70,.Input_size-s__-U0r- .Input_addonRight__A9Iht{min-width:calc(var(--indent-s)*2)}.Input_size-m__jTEMl .Input_addonLeft__i1c70,.Input_size-m__jTEMl .Input_addonRight__A9Iht{min-width:calc(var(--indent-m)*2)}.Input_size-l__BR-zg .Input_addonLeft__i1c70,.Input_size-l__BR-zg .Input_addonRight__A9Iht{min-width:calc(var(--indent-l)*2)}.Input_addonLeft__i1c70>span,.Input_addonRight__A9Iht>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.Input_size-s__-U0r- .Input_addonLeft__i1c70{margin-right:calc(var(--indent-s)/2)}.Input_size-m__jTEMl .Input_addonLeft__i1c70{margin-right:calc(var(--indent-m)/2)}.Input_size-l__BR-zg .Input_addonLeft__i1c70{margin-right:calc(var(--indent-l)/2)}.Input_size-s__-U0r- .Input_addonRight__A9Iht{margin-left:calc(var(--indent-s)/2)}.Input_size-m__jTEMl .Input_addonRight__A9Iht{margin-left:calc(var(--indent-m)/2)}.Input_size-l__BR-zg .Input_addonRight__A9Iht{margin-left:calc(var(--indent-l)/2)}.Input_requiredStar__6MeQ4{background-color:var(--warning-color);border-radius:50%;height:8px;opacity:.8;pointer-events:none;position:absolute;width:8px}.Input_isDisabled__e7J10 .Input_requiredStar__6MeQ4{display:none}.Input_size-s__-U0r- .Input_requiredStar__6MeQ4{right:4px;top:4px}.Input_size-m__jTEMl .Input_requiredStar__6MeQ4{right:6px;top:6px}.Input_size-l__BR-zg .Input_requiredStar__6MeQ4{right:8px;top:8px}.Input_isDisabled__e7J10{pointer-events:none;-webkit-user-select:none;-moz-user-select:none;user-select:none}.Input_clearButton__0E-9L{border-bottom-left-radius:0;border-top-left-radius:0;bottom:1px;height:auto;position:absolute;right:0;top:0;z-index:1}.Input_clearButton__0E-9L:hover{background-color:var(--accent-color-alpha-0)!important}.Input_clearIcon__Gi1Nc{flex-shrink:0;opacity:.3;transition:opacity .2s ease-out}.Input_clearButton__0E-9L:hover .Input_clearIcon__Gi1Nc{opacity:.8}.Input_size-s__-U0r- .Input_clearIcon__Gi1Nc{height:10px;width:10px}.Input_size-m__jTEMl .Input_clearIcon__Gi1Nc{height:12px;width:12px}.Input_size-l__BR-zg .Input_clearIcon__Gi1Nc{height:14px;width:14px}.Input_size-xl__o-R-1 .Input_clearIcon__Gi1Nc{height:16px;width:16px}',S={root:"Input_root__kj4vQ",isTextArea:"Input_isTextArea__1a6n1",main:"Input_main__M6Qxb",controlWrapper:"Input_controlWrapper__WgrZL","size-s":"Input_size-s__-U0r-","size-m":"Input_size-m__jTEMl","size-l":"Input_size-l__BR-zg",border:"Input_border__01i-B","variant-clean":"Input_variant-clean__yjtdm",isFocused:"Input_isFocused__9jtFN","variant-default":"Input_variant-default__frNbg","variant-outlined":"Input_variant-outlined__qKjnJ",hasError:"Input_hasError__5iS2M",isDisabled:"Input_isDisabled__e7J10",control:"Input_control__wZcMD",addonLeft:"Input_addonLeft__i1c70",addonRight:"Input_addonRight__A9Iht",labelGap:"Input_labelGap__T6fAj",label:"Input_label__FT90l",hasAddonRight:"Input_hasAddonRight__ckzfA",scroller:"Input_scroller__OBm8M",numberArrows:"Input_numberArrows__8jveR",placeholder:"Input_placeholder__DRYLA",clearBg:"Input_clearBg__jqI1h",hasClear:"Input_hasClear__5Y3nU",requiredStar:"Input_requiredStar__6MeQ4",clearButton:"Input_clearButton__0E-9L",clearIcon:"Input_clearIcon__Gi1Nc","size-xl":"Input_size-xl__o-R-1"};styleInject(css_248z);export{S as default};
-//# sourceMappingURL=Input.styl.js.map
+import styleInject from '../../../node_modules/style-inject/dist/style-inject.es.js';
+
+var css_248z = ".Input_root__kj4vQ{color:var(--accent-color);position:relative}.Input_root__kj4vQ.Input_isTextArea__1a6n1{max-height:10em}.Input_main__M6Qxb,.Input_root__kj4vQ{width:100%}.Input_controlWrapper__WgrZL,.Input_root__kj4vQ{max-width:100%}.Input_main__M6Qxb{border-radius:inherit;display:flex;max-width:100%;position:relative}.Input_isTextArea__1a6n1 .Input_main__M6Qxb{height:auto!important;max-height:inherit!important}.Input_size-s__-U0r-.Input_isTextArea__1a6n1 .Input_main__M6Qxb{padding-right:8px!important}.Input_size-m__jTEMl.Input_isTextArea__1a6n1 .Input_main__M6Qxb{padding-right:10px!important}.Input_size-l__BR-zg.Input_isTextArea__1a6n1 .Input_main__M6Qxb{padding-right:14px!important}.Input_border__01i-B{background-color:var(--accent-color-alpha-100);border-radius:inherit;bottom:0;left:0;pointer-events:none;position:absolute;right:0;top:0;transition:.15s ease-out;transition-property:box-shadow,border-color,background-color;z-index:0}.Input_root__kj4vQ:hover .Input_border__01i-B{background-color:var(--active-color-alpha-100)}.Input_variant-clean__yjtdm .Input_border__01i-B{background-color:transparent}.Input_isFocused__9jtFN.Input_variant-clean__yjtdm .Input_border__01i-B{background-color:var(--active-color-alpha-300)}.Input_variant-default__frNbg .Input_border__01i-B{background-color:var(--accent-color-alpha-100)}.Input_isFocused__9jtFN.Input_variant-default__frNbg .Input_border__01i-B{background-color:var(--active-color-alpha-300)}.Input_variant-outlined__qKjnJ .Input_border__01i-B{background-color:transparent;box-shadow:inset 0 0 0 2px var(--accent-color)}.Input_isFocused__9jtFN.Input_variant-outlined__qKjnJ .Input_border__01i-B{background-color:var(--active-color-alpha-300);box-shadow:inset 0 0 0 2px var(--active-color)}.Input_hasError__5iS2M .Input_variant-outlined__qKjnJ .Input_border__01i-B,.Input_hasError__5iS2M:hover .Input_variant-outlined__qKjnJ .Input_border__01i-B{box-shadow:inset 0 0 0 2px var(--danger-color)}.Input_isDisabled__e7J10.Input_variant-outlined__qKjnJ .Input_border__01i-B{box-shadow:none}.Input_size-s__-U0r-{font-size:16px}.Input_size-s__-U0r- .Input_main__M6Qxb{border-radius:4px;font-size:16px;min-height:30px;min-width:30px;padding:0 8px}.Input_size-m__jTEMl{font-size:20px}.Input_size-m__jTEMl .Input_main__M6Qxb{border-radius:6px;font-size:20px;min-height:40px;min-width:40px;padding:0 12px}.Input_size-l__BR-zg{font-size:24px}.Input_size-l__BR-zg .Input_main__M6Qxb{border-radius:8px;font-size:24px;min-height:50px;min-width:50px;padding:0 14px}.Input_isTextArea__1a6n1 .Input_main__M6Qxb{padding-left:0}.Input_isDisabled__e7J10{color:var(--accent-color-alpha-500);opacity:.4}.Input_addonLeft__i1c70,.Input_addonRight__A9Iht,.Input_control__wZcMD{font-size:inherit;font-weight:400}.Input_labelGap__T6fAj{opacity:0;pointer-events:none;position:absolute}.Input_label__FT90l.Input_hasAddonRight__ckzfA{padding-right:2em}.Input_isTextArea__1a6n1 .Input_label__FT90l{max-height:40px}.Input_scroller__OBm8M{max-height:100%;width:100%}.Input_controlWrapper__WgrZL{flex:1}.Input_control__wZcMD{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:none;box-shadow:none;box-shadow:inset 0 0 0 2px none;color:inherit;display:inline-flex;filter:none;flex-grow:1;height:100%;min-width:30px;position:relative;text-overflow:ellipsis;transition:border-color .15s ease-in-out 0s;width:100%}.Input_isTextArea__1a6n1 .Input_control__wZcMD{display:block;height:100%;min-height:100%;width:100%}.Input_isTextArea__1a6n1 .Input_control__wZcMD:hover{cursor:text}.Input_isTextArea__1a6n1 .Input_control__wZcMD:after{content:\"\";display:block}.Input_control__wZcMD[type=number]{-moz-appearance:textfield;margin-right:14px}.Input_control__wZcMD[type=number]::-webkit-inner-spin-button,.Input_control__wZcMD[type=number]::-webkit-outer-spin-button{-webkit-appearance:none}.Input_numberArrows__8jveR{display:flex;flex-direction:column;height:100%;position:absolute;right:0}.Input_numberArrows__8jveR>button{background-color:transparent!important;height:50%;max-height:none;min-height:0;min-height:auto;opacity:.5;padding-left:0;padding-right:0;transition:opacity .1s ease-out;width:50%}.Input_numberArrows__8jveR>button:hover{opacity:1}.Input_size-s__-U0r- .Input_numberArrows__8jveR>button{min-width:24px}.Input_size-m__jTEMl .Input_numberArrows__8jveR>button{min-width:32px}.Input_size-l__BR-zg .Input_numberArrows__8jveR>button{min-width:40px}.Input_numberArrows__8jveR>button>svg{transform:scale(.8)}.Input_numberArrows__8jveR>button:first-child>svg{margin-bottom:-5%}.Input_numberArrows__8jveR>button:last-child>svg{margin-top:-5%}.Input_size-s__-U0r-.Input_isTextArea__1a6n1 .Input_control__wZcMD,.Input_size-s__-U0r-.Input_isTextArea__1a6n1 .Input_placeholder__DRYLA{padding:8px 8px 0}.Input_size-s__-U0r-.Input_isTextArea__1a6n1 .Input_control__wZcMD:after,.Input_size-s__-U0r-.Input_isTextArea__1a6n1 .Input_placeholder__DRYLA:after{height:8px}.Input_size-m__jTEMl.Input_isTextArea__1a6n1 .Input_control__wZcMD,.Input_size-m__jTEMl.Input_isTextArea__1a6n1 .Input_placeholder__DRYLA{padding:10px 12px 0}.Input_size-m__jTEMl.Input_isTextArea__1a6n1 .Input_control__wZcMD:after,.Input_size-m__jTEMl.Input_isTextArea__1a6n1 .Input_placeholder__DRYLA:after{height:10px}.Input_size-l__BR-zg.Input_isTextArea__1a6n1 .Input_control__wZcMD,.Input_size-l__BR-zg.Input_isTextArea__1a6n1 .Input_placeholder__DRYLA{padding:12px 14px 0}.Input_size-l__BR-zg.Input_isTextArea__1a6n1 .Input_control__wZcMD:after,.Input_size-l__BR-zg.Input_isTextArea__1a6n1 .Input_placeholder__DRYLA:after{height:12px}.Input_control__wZcMD:-internal-autofill-selected,.Input_control__wZcMD:-webkit-autofill{animation-fill-mode:both;animation-name:Input_clearBg__jqI1h}.Input_size-s__-U0r-.Input_hasClear__5Y3nU .Input_control__wZcMD{padding-right:20px}.Input_size-m__jTEMl.Input_hasClear__5Y3nU .Input_control__wZcMD{padding-right:24px}.Input_size-l__BR-zg.Input_hasClear__5Y3nU .Input_control__wZcMD{padding-right:28px}.Input_control__wZcMD::-moz-placeholder{color:var(--accent-color-alpha-500)}.Input_control__wZcMD::placeholder{color:var(--accent-color-alpha-500)}.Input_control__wZcMD::-moz-selection{background-color:var(--active-color-alpha-300)}.Input_control__wZcMD::selection{background-color:var(--active-color-alpha-300)}.Input_placeholder__DRYLA{display:inline-block;left:0;max-width:100%;opacity:.4;overflow:hidden;padding:inherit;pointer-events:none;position:absolute;text-overflow:ellipsis;top:0;white-space:nowrap}.Input_addonLeft__i1c70,.Input_addonRight__A9Iht{align-items:center;display:inline-flex;flex-shrink:0;min-width:0;-webkit-user-select:none;-moz-user-select:none;user-select:none;z-index:1}.Input_size-s__-U0r- .Input_addonLeft__i1c70,.Input_size-s__-U0r- .Input_addonRight__A9Iht{min-width:calc(var(--indent-s)*2)}.Input_size-m__jTEMl .Input_addonLeft__i1c70,.Input_size-m__jTEMl .Input_addonRight__A9Iht{min-width:calc(var(--indent-m)*2)}.Input_size-l__BR-zg .Input_addonLeft__i1c70,.Input_size-l__BR-zg .Input_addonRight__A9Iht{min-width:calc(var(--indent-l)*2)}.Input_addonLeft__i1c70>span,.Input_addonRight__A9Iht>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.Input_size-s__-U0r- .Input_addonLeft__i1c70{margin-right:calc(var(--indent-s)/2)}.Input_size-m__jTEMl .Input_addonLeft__i1c70{margin-right:calc(var(--indent-m)/2)}.Input_size-l__BR-zg .Input_addonLeft__i1c70{margin-right:calc(var(--indent-l)/2)}.Input_size-s__-U0r- .Input_addonRight__A9Iht{margin-left:calc(var(--indent-s)/2)}.Input_size-m__jTEMl .Input_addonRight__A9Iht{margin-left:calc(var(--indent-m)/2)}.Input_size-l__BR-zg .Input_addonRight__A9Iht{margin-left:calc(var(--indent-l)/2)}.Input_requiredStar__6MeQ4{background-color:var(--warning-color);border-radius:50%;height:8px;opacity:.8;pointer-events:none;position:absolute;width:8px}.Input_isDisabled__e7J10 .Input_requiredStar__6MeQ4{display:none}.Input_size-s__-U0r- .Input_requiredStar__6MeQ4{right:4px;top:4px}.Input_size-m__jTEMl .Input_requiredStar__6MeQ4{right:6px;top:6px}.Input_size-l__BR-zg .Input_requiredStar__6MeQ4{right:8px;top:8px}.Input_isDisabled__e7J10{pointer-events:none;-webkit-user-select:none;-moz-user-select:none;user-select:none}.Input_clearButton__0E-9L{border-bottom-left-radius:0;border-top-left-radius:0;bottom:1px;height:auto;position:absolute;right:0;top:0;z-index:1}.Input_clearButton__0E-9L:hover{background-color:var(--accent-color-alpha-0)!important}.Input_clearIcon__Gi1Nc{flex-shrink:0;opacity:.3;transition:opacity .2s ease-out}.Input_clearButton__0E-9L:hover .Input_clearIcon__Gi1Nc{opacity:.8}.Input_size-s__-U0r- .Input_clearIcon__Gi1Nc{height:10px;width:10px}.Input_size-m__jTEMl .Input_clearIcon__Gi1Nc{height:12px;width:12px}.Input_size-l__BR-zg .Input_clearIcon__Gi1Nc{height:14px;width:14px}.Input_size-xl__o-R-1 .Input_clearIcon__Gi1Nc{height:16px;width:16px}";
+var S = {"root":"Input_root__kj4vQ","isTextArea":"Input_isTextArea__1a6n1","main":"Input_main__M6Qxb","controlWrapper":"Input_controlWrapper__WgrZL","size-s":"Input_size-s__-U0r-","size-m":"Input_size-m__jTEMl","size-l":"Input_size-l__BR-zg","border":"Input_border__01i-B","variant-clean":"Input_variant-clean__yjtdm","isFocused":"Input_isFocused__9jtFN","variant-default":"Input_variant-default__frNbg","variant-outlined":"Input_variant-outlined__qKjnJ","hasError":"Input_hasError__5iS2M","isDisabled":"Input_isDisabled__e7J10","control":"Input_control__wZcMD","addonLeft":"Input_addonLeft__i1c70","addonRight":"Input_addonRight__A9Iht","labelGap":"Input_labelGap__T6fAj","label":"Input_label__FT90l","hasAddonRight":"Input_hasAddonRight__ckzfA","scroller":"Input_scroller__OBm8M","numberArrows":"Input_numberArrows__8jveR","placeholder":"Input_placeholder__DRYLA","clearBg":"Input_clearBg__jqI1h","hasClear":"Input_hasClear__5Y3nU","requiredStar":"Input_requiredStar__6MeQ4","clearButton":"Input_clearButton__0E-9L","clearIcon":"Input_clearIcon__Gi1Nc","size-xl":"Input_size-xl__o-R-1"};
+styleInject(css_248z);
+
+export { S as default };