@fvc/input 1.1.1 → 1.1.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/lib/index.js +2 -2
- package/package.json +1 -1
package/dist/lib/index.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import{Input as
|
|
1
|
+
import{Input as n}from"antd";import{MaskedInput as i}from"antd-mask-input";import r,{forwardRef as t,useState as o,useCallback as e}from"react";import{Icon as d}from"@fvc/icons";import{transformText as u}from"@fvc/utils";function a(n){return n&&n.__esModule&&Object.prototype.hasOwnProperty.call(n,"default")?n.default:n}"function"==typeof SuppressedError&&SuppressedError;var p,c={exports:{}};
|
|
2
2
|
/*!
|
|
3
3
|
Copyright (c) 2018 Jed Watson.
|
|
4
4
|
Licensed under the MIT License (MIT), see
|
|
5
5
|
http://jedwatson.github.io/classnames
|
|
6
|
-
*/var p,u=i((c||(c=1,p=f,function(){var e={}.hasOwnProperty;function r(){for(var e="",r=0;r<arguments.length;r++){var n=arguments[r];n&&(e=a(e,t(n)))}return e}function t(t){if("string"==typeof t||"number"==typeof t)return t;if("object"!=typeof t)return"";if(Array.isArray(t))return r.apply(null,t);if(t.toString!==Object.prototype.toString&&!t.toString.toString().includes("[native code]"))return t.toString();var n="";for(var o in t)e.call(t,o)&&t[o]&&(n=a(n,o));return n}function a(e,r){return r?e?e+" "+r:e+r:e}p.exports?(r.default=r,p.exports=r):window.classNames=r}()),f.exports));const m=({error:e})=>t.createElement("div",{className:"fvc-input-error-text","aria-label":"error message container"},t.createElement(s.Info,{width:16,height:16,color:"var(--red-800)","aria-label":"error icon"}),e),d="fvc-input-label",v=({label:e,name:r,withAsterisk:a})=>t.createElement("label",{className:d,htmlFor:r},e,a&&t.createElement("span",{className:`${d}-asterisk`},"*")),x="fvc-input-suffix-sticky",y=({prefix:e,suffix:r,isSticky:a,inputValue:n})=>a?t.createElement("div",{className:`${x}-wrapper`,"aria-label":"sticky suffix wrapper"},t.createElement("div",{className:`${x}-content`},e&&t.createElement("span",null,e),(n||"").toString().replace(/ /g," ")),t.createElement("div",{className:`${x}-suffix`},r)):r,g="fvc-input",b=`${g}-root`,h=`${g}-suffix-sticky`,w={clearIcon:t.createElement(s.Clear,{width:16,height:16,color:"var(--blue-gray-600)","aria-label":"input-clear-icon"})};function O(e,r){const s=a((a,s)=>{var{allowClear:i,className:c,controls:f=!0,defaultValue:p,error:d,label:x,name:O,onChange:E,placeholder:N,prefix:$,suffix:k,suffixType:C="fixed",testId:S,textTransform:j,value:P,variant:A="outlined",withAsterisk:I=!1}=a,T=function(e,r){var t={};for(var a in e)Object.prototype.hasOwnProperty.call(e,a)&&r.indexOf(a)<0&&(t[a]=e[a]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var n=0;for(a=Object.getOwnPropertySymbols(e);n<a.length;n++)r.indexOf(a[n])<0&&Object.prototype.propertyIsEnumerable.call(e,a[n])&&(t[a[n]]=e[a[n]])}return t}(a,["allowClear","className","controls","defaultValue","error","label","name","onChange","placeholder","prefix","suffix","suffixType","testId","textTransform","value","variant","withAsterisk"]);const[V,M]=n(p),_=void 0!==P,q=_?P:V,F=o(e=>{const{value:r}=e.target,t=j?l(r,j):r;_||M(t),null==E||E(Object.assign(Object.assign({},e),{target:Object.assign(Object.assign({},e.target),{value:t})}))},[_,E,j]),z="sticky"===C&&!!k,B=u(c,`${g}-${A}`,{[`${g}-error`]:!!d,[`${g}-empty`]:!q,[`${g}-with-prefix`]:!!$,[`${g}-no-controls`]:!f,[`${h}`]:z}),D=i?w:void 0;return t.createElement("div",{className:b},x&&t.createElement(v,{label:x,name:O,withAsterisk:I}),t.createElement(e,Object.assign({},T,r,{variant:A,prefixCls:g,className:B,required:!0,name:O,value:q,onChange:F,prefix:$,suffix:k?t.createElement(y,{suffix:k,prefix:$,inputValue:q,isSticky:z}):void 0,allowClear:D,placeholder:z?void 0:N,"data-testid":S,"data-valid":!!q,ref:s})),"string"==typeof d&&t.createElement(m,{error:d}))});return s.displayName=e.displayName,s}const E=O(e);E.Textarea=O(e.TextArea,{rootClassName:`${g}-textarea`}),E.Search=O(e.Search,{inputPrefixCls:g,rootClassName:`${g}-search`}),E.Password=O(e.Password,{inputPrefixCls:g,rootClassName:`${g}-password`}),E.Masked=O(r,{rootClassName:`${g}-masked`});export{E as Input};
|
|
6
|
+
*/var f,v=a((p||(p=1,f=c,function(){var n={}.hasOwnProperty;function i(){for(var n="",i=0;i<arguments.length;i++){var o=arguments[i];o&&(n=t(n,r(o)))}return n}function r(r){if("string"==typeof r||"number"==typeof r)return r;if("object"!=typeof r)return"";if(Array.isArray(r))return i.apply(null,r);if(r.toString!==Object.prototype.toString&&!r.toString.toString().includes("[native code]"))return r.toString();var o="";for(var e in r)n.call(r,e)&&r[e]&&(o=t(o,e));return o}function t(n,i){return i?n?n+" "+i:n+i:n}f.exports?(i.default=i,f.exports=i):window.classNames=i}()),c.exports));const l=({error:n})=>r.createElement("div",{className:"fvc-input-error-text","aria-label":"error message container"},r.createElement(d.Info,{width:16,height:16,color:"var(--red-800)","aria-label":"error icon"}),n),s="fvc-input-label",h=({label:n,name:i,withAsterisk:t})=>r.createElement("label",{className:s,htmlFor:i},n,t&&r.createElement("span",{className:`${s}-asterisk`},"*")),g="fvc-input-suffix-sticky",b=({prefix:n,suffix:i,isSticky:t,inputValue:o})=>t?r.createElement("div",{className:`${g}-wrapper`,"aria-label":"sticky suffix wrapper"},r.createElement("div",{className:`${g}-content`},n&&r.createElement("span",null,n),(o||"").toString().replace(/ /g," ")),r.createElement("div",{className:`${g}-suffix`},i)):i;!function(n,i){void 0===i&&(i={});var r=i.insertAt;if("undefined"!=typeof document){var t=document.head||document.getElementsByTagName("head")[0],o=document.createElement("style");o.type="text/css","top"===r&&t.firstChild?t.insertBefore(o,t.firstChild):t.appendChild(o),o.styleSheet?o.styleSheet.cssText=n:o.appendChild(document.createTextNode(n))}}(":root {\n /* Input Default Variables */\n --input-font-family: 'Roboto', sans-serif;\n --input-addon-text-color: var(--blue-gray-600);\n --input-addon-min-width: 56px;\n --input-description-spacing: 4px;\n --input-description-error-color: var(--red-800);\n --input-asterisk-color: var(--red-800);\n --input-border-width: 1px;\n /* Input Size Variables */\n --input-md-size-height: 32px;\n --input-md-size-border-radius: 4px;\n --input-md-size-spacing: 7px 12px;\n --input-md-size-fz: 14px;\n --input-md-size-fw: 400;\n --input-md-size-lh: 16px;\n --input-md-size-addon-lh: 15px;\n --input-md-size-addon-spacing: 12px;\n --input-md-size-affix-spacing: 10px;\n --input-md-size-affix-height: 16px;\n --input-md-size-label-fw: 700;\n --input-md-size-label-spacing: 6px;\n /* Input Outlined Variant */\n --input-outlined-text-color: var(--black-1000);\n --input-outlined-placeholder-color: var(--blue-300);\n --input-outlined-bg-color: var(--neutral-0);\n --input-outlined-border-color: var(--gray-400);\n --input-outlined-hover-bg-color: var(--neutral-0);\n --input-outlined-hover-border-color: var(--gray-600);\n --input-outlined-focus-border-color: var(--blue-400);\n --input-outlined-valid-bg-color: var(--neutral-0);\n --input-outlined-valid-border-color: var(--gray-400);\n --input-outlined-disabled-bg-color: var(--gray-50);\n --input-outlined-disabled-border-color: var(--gray-400);\n --input-outlined-disabled-text-color: var(--blue-gray-600);\n --input-outlined-label-color: var(--black-1000);\n --input-outlined-addon-bg-color: var(--blue-20);\n /* Input Error Variant */\n --input-error-text-color: var(--black-1000);\n --input-error-placeholder-color: var(--blue-300);\n --input-error-bg-color: var(--red-100);\n --input-error-border-color: var(--red-800);\n --input-error-hover-bg-color: var(--red-100);\n --input-error-hover-border-color: var(--red-600);\n --input-error-focus-border-color: var(--red-800);\n --input-error-valid-bg-color: var(--red-100);\n --input-error-valid-border-color: var(--red-800);\n --input-error-disabled-bg-color: var(--red-100);\n --input-error-disabled-border-color: var(--red-800);\n --input-error-disabled-text-color: var(--blue-gray-600);\n --input-error-label-color: var(--black-1000);\n --input-error-addon-bg-color: #f9cbd166;\n}\n\n.fvc-input {\n font-family: var(--input-font-family);\n font-weight: var(--input-md-size-fw);\n font-size: var(--input-md-size-fz);\n line-height: var(--input-md-size-lh);\n letter-spacing: 0;\n color: var(--input-outlined-text-color);\n}\n\n.fvc-input::placeholder, .fvc-input::-webkit-input-placeholder, .fvc-input:-moz-placeholder, .fvc-input:-ms-input-placeholder {\n font-family: var(--input-font-family);\n font-weight: var(--input-md-size-fw);\n font-size: var(--input-md-size-fz);\n line-height: var(--input-md-size-lh);\n letter-spacing: 0;\n color: var(--input-outlined-placeholder-color);\n}\n\n.fvc-input {\n height: var(--input-md-size-height);\n border-radius: var(--input-md-size-border-radius);\n padding: var(--input-md-size-spacing);\n /* OUTLINED VARIANT */\n}\n\n.fvc-input-outlined, .fvc-input-outlined.fvc-input-search {\n border-width: var(--input-border-width);\n border-style: solid;\n font-family: var(--input-font-family);\n font-weight: var(--input-md-size-fw);\n font-size: var(--input-md-size-fz);\n line-height: var(--input-md-size-lh);\n letter-spacing: 0;\n color: var(--input-outlined-text-color);\n}\n\n.fvc-input-outlined::placeholder, .fvc-input-outlined::-webkit-input-placeholder, .fvc-input-outlined:-moz-placeholder, .fvc-input-outlined:-ms-input-placeholder, .fvc-input-outlined.fvc-input-search::placeholder, .fvc-input-outlined.fvc-input-search::-webkit-input-placeholder, .fvc-input-outlined.fvc-input-search:-moz-placeholder, .fvc-input-outlined.fvc-input-search:-ms-input-placeholder {\n font-family: var(--input-font-family);\n font-weight: var(--input-md-size-fw);\n font-size: var(--input-md-size-fz);\n line-height: var(--input-md-size-lh);\n letter-spacing: 0;\n color: var(--input-outlined-placeholder-color);\n}\n\n.fvc-input-outlined, .fvc-input-outlined.fvc-input-search {\n background-color: var(--input-outlined-bg-color);\n border-color: var(--input-outlined-border-color);\n}\n\n.fvc-input-outlined .fvc-input-group-addon, .fvc-input-outlined.fvc-input-search .fvc-input-group-addon {\n font-family: var(--input-font-family);\n font-weight: var(--input-md-size-fw);\n font-size: var(--input-md-size-fz);\n line-height: var(--input-md-size-lh);\n letter-spacing: 0;\n color: var(--input-addon-text-color);\n display: flex;\n align-items: center;\n justify-content: center;\n min-width: var(--input-addon-min-width);\n width: auto;\n height: 100%;\n border: none;\n border-radius: 0;\n background-color: var(--input-outlined-addon-bg-color);\n line-height: var(--input-md-size-addon-lh);\n padding-left: var(--input-md-size-addon-spacing);\n padding-right: var(--input-md-size-addon-spacing);\n}\n\n.fvc-input-outlined .fvc-input-group-addon:first-child, .fvc-input-outlined.fvc-input-search .fvc-input-group-addon:first-child {\n border-right: var(--input-border-width) solid var(--input-outlined-border-color);\n background-color: var(--input-outlined-addon-bg-color);\n}\n\n.fvc-input-outlined .fvc-input-group-addon:last-child, .fvc-input-outlined.fvc-input-search .fvc-input-group-addon:last-child {\n border-left: var(--input-border-width) solid var(--input-outlined-border-color);\n background-color: var(--input-outlined-addon-bg-color);\n}\n\n.fvc-input-outlined:hover, .fvc-input-outlined.fvc-input-search:hover {\n background-color: var(--input-outlined-hover-bg-color);\n border-color: var(--input-outlined-hover-border-color);\n}\n\n.fvc-input-outlined:hover .fvc-input-group-addon, .fvc-input-outlined.fvc-input-search:hover .fvc-input-group-addon {\n font-family: var(--input-font-family);\n font-weight: var(--input-md-size-fw);\n font-size: var(--input-md-size-fz);\n line-height: var(--input-md-size-lh);\n letter-spacing: 0;\n color: var(--input-addon-text-color);\n display: flex;\n align-items: center;\n justify-content: center;\n min-width: var(--input-addon-min-width);\n width: auto;\n height: 100%;\n border: none;\n border-radius: 0;\n background-color: var(--input-outlined-addon-bg-color);\n line-height: var(--input-md-size-addon-lh);\n padding-left: var(--input-md-size-addon-spacing);\n padding-right: var(--input-md-size-addon-spacing);\n}\n\n.fvc-input-outlined:hover .fvc-input-group-addon:first-child, .fvc-input-outlined.fvc-input-search:hover .fvc-input-group-addon:first-child {\n border-right: var(--input-border-width) solid var(--input-outlined-hover-border-color);\n background-color: var(--input-outlined-addon-bg-color);\n}\n\n.fvc-input-outlined:hover .fvc-input-group-addon:last-child, .fvc-input-outlined.fvc-input-search:hover .fvc-input-group-addon:last-child {\n border-left: var(--input-border-width) solid var(--input-outlined-hover-border-color);\n background-color: var(--input-outlined-addon-bg-color);\n}\n\n.fvc-input-outlined:focus, .fvc-input-outlined:focus-visible, .fvc-input-outlined:focus-within, .fvc-input-outlined.fvc-input-search:focus, .fvc-input-outlined.fvc-input-search:focus-visible, .fvc-input-outlined.fvc-input-search:focus-within {\n background-color: var(--input-outlined-bg-color);\n border-color: var(--input-outlined-focus-border-color);\n outline: none;\n box-shadow: none;\n}\n\n.fvc-input-outlined:focus .fvc-input-group-addon, .fvc-input-outlined:focus-visible .fvc-input-group-addon, .fvc-input-outlined:focus-within .fvc-input-group-addon, .fvc-input-outlined.fvc-input-search:focus .fvc-input-group-addon, .fvc-input-outlined.fvc-input-search:focus-visible .fvc-input-group-addon, .fvc-input-outlined.fvc-input-search:focus-within .fvc-input-group-addon {\n font-family: var(--input-font-family);\n font-weight: var(--input-md-size-fw);\n font-size: var(--input-md-size-fz);\n line-height: var(--input-md-size-lh);\n letter-spacing: 0;\n color: var(--input-addon-text-color);\n display: flex;\n align-items: center;\n justify-content: center;\n min-width: var(--input-addon-min-width);\n width: auto;\n height: 100%;\n border: none;\n border-radius: 0;\n background-color: var(--input-outlined-addon-bg-color);\n line-height: var(--input-md-size-addon-lh);\n padding-left: var(--input-md-size-addon-spacing);\n padding-right: var(--input-md-size-addon-spacing);\n}\n\n.fvc-input-outlined:focus .fvc-input-group-addon:first-child, .fvc-input-outlined:focus-visible .fvc-input-group-addon:first-child, .fvc-input-outlined:focus-within .fvc-input-group-addon:first-child, .fvc-input-outlined.fvc-input-search:focus .fvc-input-group-addon:first-child, .fvc-input-outlined.fvc-input-search:focus-visible .fvc-input-group-addon:first-child, .fvc-input-outlined.fvc-input-search:focus-within .fvc-input-group-addon:first-child {\n border-right: var(--input-border-width) solid var(--input-outlined-focus-border-color);\n background-color: var(--input-outlined-addon-bg-color);\n}\n\n.fvc-input-outlined:focus .fvc-input-group-addon:last-child, .fvc-input-outlined:focus-visible .fvc-input-group-addon:last-child, .fvc-input-outlined:focus-within .fvc-input-group-addon:last-child, .fvc-input-outlined.fvc-input-search:focus .fvc-input-group-addon:last-child, .fvc-input-outlined.fvc-input-search:focus-visible .fvc-input-group-addon:last-child, .fvc-input-outlined.fvc-input-search:focus-within .fvc-input-group-addon:last-child {\n border-left: var(--input-border-width) solid var(--input-outlined-focus-border-color);\n background-color: var(--input-outlined-addon-bg-color);\n}\n\n.fvc-input-outlined[data-valid=true], .fvc-input-outlined:has(input[data-valid=true]), .fvc-input-outlined.fvc-input-search[data-valid=true], .fvc-input-outlined.fvc-input-search:has(input[data-valid=true]) {\n background-color: var(--input-outlined-valid-bg-color);\n border-color: var(--input-outlined-valid-border-color);\n}\n\n.fvc-input-outlined[data-valid=true] .fvc-input-group-addon, .fvc-input-outlined:has(input[data-valid=true]) .fvc-input-group-addon, .fvc-input-outlined.fvc-input-search[data-valid=true] .fvc-input-group-addon, .fvc-input-outlined.fvc-input-search:has(input[data-valid=true]) .fvc-input-group-addon {\n font-family: var(--input-font-family);\n font-weight: var(--input-md-size-fw);\n font-size: var(--input-md-size-fz);\n line-height: var(--input-md-size-lh);\n letter-spacing: 0;\n color: var(--input-addon-text-color);\n display: flex;\n align-items: center;\n justify-content: center;\n min-width: var(--input-addon-min-width);\n width: auto;\n height: 100%;\n border: none;\n border-radius: 0;\n background-color: var(--input-outlined-addon-bg-color);\n line-height: var(--input-md-size-addon-lh);\n padding-left: var(--input-md-size-addon-spacing);\n padding-right: var(--input-md-size-addon-spacing);\n}\n\n.fvc-input-outlined[data-valid=true] .fvc-input-group-addon:first-child, .fvc-input-outlined:has(input[data-valid=true]) .fvc-input-group-addon:first-child, .fvc-input-outlined.fvc-input-search[data-valid=true] .fvc-input-group-addon:first-child, .fvc-input-outlined.fvc-input-search:has(input[data-valid=true]) .fvc-input-group-addon:first-child {\n border-right: var(--input-border-width) solid var(--input-outlined-valid-border-color);\n background-color: var(--input-outlined-addon-bg-color);\n}\n\n.fvc-input-outlined[data-valid=true] .fvc-input-group-addon:last-child, .fvc-input-outlined:has(input[data-valid=true]) .fvc-input-group-addon:last-child, .fvc-input-outlined.fvc-input-search[data-valid=true] .fvc-input-group-addon:last-child, .fvc-input-outlined.fvc-input-search:has(input[data-valid=true]) .fvc-input-group-addon:last-child {\n border-left: var(--input-border-width) solid var(--input-outlined-valid-border-color);\n background-color: var(--input-outlined-addon-bg-color);\n}\n\n.fvc-input-outlined.fvc-input-disabled, .fvc-input-outlined.fvc-input-disabled:hover:not([disabled]), .fvc-input-outlined.fvc-input-disabled[disabled]:hover:not([disabled]), .fvc-input-outlined:has(.fvc-input-disabled[disabled]), .fvc-input-outlined.fvc-input-search.fvc-input-disabled, .fvc-input-outlined.fvc-input-search.fvc-input-disabled:hover:not([disabled]), .fvc-input-outlined.fvc-input-search.fvc-input-disabled[disabled]:hover:not([disabled]), .fvc-input-outlined.fvc-input-search:has(.fvc-input-disabled[disabled]) {\n background-color: var(--input-outlined-disabled-bg-color);\n border-color: var(--input-outlined-disabled-border-color);\n color: var(--input-outlined-disabled-text-color);\n}\n\n.fvc-input-outlined.fvc-input-disabled .fvc-input-group-addon, .fvc-input-outlined.fvc-input-disabled:hover:not([disabled]) .fvc-input-group-addon, .fvc-input-outlined.fvc-input-disabled[disabled]:hover:not([disabled]) .fvc-input-group-addon, .fvc-input-outlined:has(.fvc-input-disabled[disabled]) .fvc-input-group-addon, .fvc-input-outlined.fvc-input-search.fvc-input-disabled .fvc-input-group-addon, .fvc-input-outlined.fvc-input-search.fvc-input-disabled:hover:not([disabled]) .fvc-input-group-addon, .fvc-input-outlined.fvc-input-search.fvc-input-disabled[disabled]:hover:not([disabled]) .fvc-input-group-addon, .fvc-input-outlined.fvc-input-search:has(.fvc-input-disabled[disabled]) .fvc-input-group-addon {\n font-family: var(--input-font-family);\n font-weight: var(--input-md-size-fw);\n font-size: var(--input-md-size-fz);\n line-height: var(--input-md-size-lh);\n letter-spacing: 0;\n color: var(--input-addon-text-color);\n display: flex;\n align-items: center;\n justify-content: center;\n min-width: var(--input-addon-min-width);\n width: auto;\n height: 100%;\n border: none;\n border-radius: 0;\n background-color: var(--input-outlined-addon-bg-color);\n line-height: var(--input-md-size-addon-lh);\n padding-left: var(--input-md-size-addon-spacing);\n padding-right: var(--input-md-size-addon-spacing);\n}\n\n.fvc-input-outlined.fvc-input-disabled .fvc-input-group-addon:first-child, .fvc-input-outlined.fvc-input-disabled:hover:not([disabled]) .fvc-input-group-addon:first-child, .fvc-input-outlined.fvc-input-disabled[disabled]:hover:not([disabled]) .fvc-input-group-addon:first-child, .fvc-input-outlined:has(.fvc-input-disabled[disabled]) .fvc-input-group-addon:first-child, .fvc-input-outlined.fvc-input-search.fvc-input-disabled .fvc-input-group-addon:first-child, .fvc-input-outlined.fvc-input-search.fvc-input-disabled:hover:not([disabled]) .fvc-input-group-addon:first-child, .fvc-input-outlined.fvc-input-search.fvc-input-disabled[disabled]:hover:not([disabled]) .fvc-input-group-addon:first-child, .fvc-input-outlined.fvc-input-search:has(.fvc-input-disabled[disabled]) .fvc-input-group-addon:first-child {\n border-right: var(--input-border-width) solid var(--input-outlined-disabled-border-color);\n background-color: var(--input-outlined-addon-bg-color);\n}\n\n.fvc-input-outlined.fvc-input-disabled .fvc-input-group-addon:last-child, .fvc-input-outlined.fvc-input-disabled:hover:not([disabled]) .fvc-input-group-addon:last-child, .fvc-input-outlined.fvc-input-disabled[disabled]:hover:not([disabled]) .fvc-input-group-addon:last-child, .fvc-input-outlined:has(.fvc-input-disabled[disabled]) .fvc-input-group-addon:last-child, .fvc-input-outlined.fvc-input-search.fvc-input-disabled .fvc-input-group-addon:last-child, .fvc-input-outlined.fvc-input-search.fvc-input-disabled:hover:not([disabled]) .fvc-input-group-addon:last-child, .fvc-input-outlined.fvc-input-search.fvc-input-disabled[disabled]:hover:not([disabled]) .fvc-input-group-addon:last-child, .fvc-input-outlined.fvc-input-search:has(.fvc-input-disabled[disabled]) .fvc-input-group-addon:last-child {\n border-left: var(--input-border-width) solid var(--input-outlined-disabled-border-color);\n background-color: var(--input-outlined-addon-bg-color);\n}\n\n.fvc-input-outlined.fvc-input-textarea, .fvc-input-outlined > textarea.fvc-input, .fvc-input-outlined.fvc-input-search.fvc-input-textarea, .fvc-input-outlined.fvc-input-search > textarea.fvc-input {\n font-family: var(--input-font-family);\n font-weight: var(--input-md-size-fw);\n font-size: var(--input-md-size-fz);\n line-height: var(--input-md-size-lh);\n letter-spacing: 0;\n color: var(--input-outlined-text-color);\n}\n\n.fvc-input-outlined.fvc-input-textarea::placeholder, .fvc-input-outlined.fvc-input-textarea::-webkit-input-placeholder, .fvc-input-outlined.fvc-input-textarea:-moz-placeholder, .fvc-input-outlined.fvc-input-textarea:-ms-input-placeholder, .fvc-input-outlined > textarea.fvc-input::placeholder, .fvc-input-outlined > textarea.fvc-input::-webkit-input-placeholder, .fvc-input-outlined > textarea.fvc-input:-moz-placeholder, .fvc-input-outlined > textarea.fvc-input:-ms-input-placeholder, .fvc-input-outlined.fvc-input-search.fvc-input-textarea::placeholder, .fvc-input-outlined.fvc-input-search.fvc-input-textarea::-webkit-input-placeholder, .fvc-input-outlined.fvc-input-search.fvc-input-textarea:-moz-placeholder, .fvc-input-outlined.fvc-input-search.fvc-input-textarea:-ms-input-placeholder, .fvc-input-outlined.fvc-input-search > textarea.fvc-input::placeholder, .fvc-input-outlined.fvc-input-search > textarea.fvc-input::-webkit-input-placeholder, .fvc-input-outlined.fvc-input-search > textarea.fvc-input:-moz-placeholder, .fvc-input-outlined.fvc-input-search > textarea.fvc-input:-ms-input-placeholder {\n font-family: var(--input-font-family);\n font-weight: var(--input-md-size-fw);\n font-size: var(--input-md-size-fz);\n line-height: var(--input-md-size-lh);\n letter-spacing: 0;\n color: var(--input-outlined-placeholder-color);\n}\n\n.fvc-input {\n /* ERROR */\n}\n\n.fvc-input-error, .fvc-input-error .fvc-input, .fvc-input-error.fvc-input-search, .fvc-input-error .fvc-input-affix-wrapper {\n font-family: var(--input-font-family);\n font-weight: var(--input-md-size-fw);\n font-size: var(--input-md-size-fz);\n line-height: var(--input-md-size-lh);\n letter-spacing: 0;\n color: var(--input-error-text-color);\n}\n\n.fvc-input-error::placeholder, .fvc-input-error::-webkit-input-placeholder, .fvc-input-error:-moz-placeholder, .fvc-input-error:-ms-input-placeholder, .fvc-input-error .fvc-input::placeholder, .fvc-input-error .fvc-input::-webkit-input-placeholder, .fvc-input-error .fvc-input:-moz-placeholder, .fvc-input-error .fvc-input:-ms-input-placeholder, .fvc-input-error.fvc-input-search::placeholder, .fvc-input-error.fvc-input-search::-webkit-input-placeholder, .fvc-input-error.fvc-input-search:-moz-placeholder, .fvc-input-error.fvc-input-search:-ms-input-placeholder, .fvc-input-error .fvc-input-affix-wrapper::placeholder, .fvc-input-error .fvc-input-affix-wrapper::-webkit-input-placeholder, .fvc-input-error .fvc-input-affix-wrapper:-moz-placeholder, .fvc-input-error .fvc-input-affix-wrapper:-ms-input-placeholder {\n font-family: var(--input-font-family);\n font-weight: var(--input-md-size-fw);\n font-size: var(--input-md-size-fz);\n line-height: var(--input-md-size-lh);\n letter-spacing: 0;\n color: var(--input-error-placeholder-color);\n}\n\n.fvc-input-error, .fvc-input-error .fvc-input, .fvc-input-error.fvc-input-search, .fvc-input-error .fvc-input-affix-wrapper {\n background-color: var(--input-error-bg-color);\n border-color: var(--input-error-border-color);\n}\n\n.fvc-input-error .fvc-input-group-addon, .fvc-input-error .fvc-input .fvc-input-group-addon, .fvc-input-error.fvc-input-search .fvc-input-group-addon, .fvc-input-error .fvc-input-affix-wrapper .fvc-input-group-addon {\n font-family: var(--input-font-family);\n font-weight: var(--input-md-size-fw);\n font-size: var(--input-md-size-fz);\n line-height: var(--input-md-size-lh);\n letter-spacing: 0;\n color: var(--input-addon-text-color);\n display: flex;\n align-items: center;\n justify-content: center;\n min-width: var(--input-addon-min-width);\n width: auto;\n height: 100%;\n border: none;\n border-radius: 0;\n background-color: var(--input-error-addon-bg-color);\n line-height: var(--input-md-size-addon-lh);\n padding-left: var(--input-md-size-addon-spacing);\n padding-right: var(--input-md-size-addon-spacing);\n}\n\n.fvc-input-error .fvc-input-group-addon:first-child, .fvc-input-error .fvc-input .fvc-input-group-addon:first-child, .fvc-input-error.fvc-input-search .fvc-input-group-addon:first-child, .fvc-input-error .fvc-input-affix-wrapper .fvc-input-group-addon:first-child {\n border-right: var(--input-border-width) solid var(--input-error-border-color);\n background-color: var(--input-error-addon-bg-color);\n}\n\n.fvc-input-error .fvc-input-group-addon:last-child, .fvc-input-error .fvc-input .fvc-input-group-addon:last-child, .fvc-input-error.fvc-input-search .fvc-input-group-addon:last-child, .fvc-input-error .fvc-input-affix-wrapper .fvc-input-group-addon:last-child {\n border-left: var(--input-border-width) solid var(--input-error-border-color);\n background-color: var(--input-error-addon-bg-color);\n}\n\n.fvc-input-error:hover, .fvc-input-error .fvc-input:hover, .fvc-input-error.fvc-input-search:hover, .fvc-input-error .fvc-input-affix-wrapper:hover {\n background-color: var(--input-error-hover-bg-color);\n border-color: var(--input-error-hover-border-color);\n}\n\n.fvc-input-error:hover .fvc-input-group-addon, .fvc-input-error .fvc-input:hover .fvc-input-group-addon, .fvc-input-error.fvc-input-search:hover .fvc-input-group-addon, .fvc-input-error .fvc-input-affix-wrapper:hover .fvc-input-group-addon {\n font-family: var(--input-font-family);\n font-weight: var(--input-md-size-fw);\n font-size: var(--input-md-size-fz);\n line-height: var(--input-md-size-lh);\n letter-spacing: 0;\n color: var(--input-addon-text-color);\n display: flex;\n align-items: center;\n justify-content: center;\n min-width: var(--input-addon-min-width);\n width: auto;\n height: 100%;\n border: none;\n border-radius: 0;\n background-color: var(--input-error-addon-bg-color);\n line-height: var(--input-md-size-addon-lh);\n padding-left: var(--input-md-size-addon-spacing);\n padding-right: var(--input-md-size-addon-spacing);\n}\n\n.fvc-input-error:hover .fvc-input-group-addon:first-child, .fvc-input-error .fvc-input:hover .fvc-input-group-addon:first-child, .fvc-input-error.fvc-input-search:hover .fvc-input-group-addon:first-child, .fvc-input-error .fvc-input-affix-wrapper:hover .fvc-input-group-addon:first-child {\n border-right: var(--input-border-width) solid var(--input-error-hover-border-color);\n background-color: var(--input-error-addon-bg-color);\n}\n\n.fvc-input-error:hover .fvc-input-group-addon:last-child, .fvc-input-error .fvc-input:hover .fvc-input-group-addon:last-child, .fvc-input-error.fvc-input-search:hover .fvc-input-group-addon:last-child, .fvc-input-error .fvc-input-affix-wrapper:hover .fvc-input-group-addon:last-child {\n border-left: var(--input-border-width) solid var(--input-error-hover-border-color);\n background-color: var(--input-error-addon-bg-color);\n}\n\n.fvc-input-error:focus, .fvc-input-error:focus-visible, .fvc-input-error:focus-within, .fvc-input-error .fvc-input:focus, .fvc-input-error .fvc-input:focus-visible, .fvc-input-error .fvc-input:focus-within, .fvc-input-error.fvc-input-search:focus, .fvc-input-error.fvc-input-search:focus-visible, .fvc-input-error.fvc-input-search:focus-within, .fvc-input-error .fvc-input-affix-wrapper:focus, .fvc-input-error .fvc-input-affix-wrapper:focus-visible, .fvc-input-error .fvc-input-affix-wrapper:focus-within {\n background-color: var(--input-error-bg-color);\n border-color: var(--input-error-focus-border-color);\n outline: none;\n box-shadow: none;\n}\n\n.fvc-input-error:focus .fvc-input-group-addon, .fvc-input-error:focus-visible .fvc-input-group-addon, .fvc-input-error:focus-within .fvc-input-group-addon, .fvc-input-error .fvc-input:focus .fvc-input-group-addon, .fvc-input-error .fvc-input:focus-visible .fvc-input-group-addon, .fvc-input-error .fvc-input:focus-within .fvc-input-group-addon, .fvc-input-error.fvc-input-search:focus .fvc-input-group-addon, .fvc-input-error.fvc-input-search:focus-visible .fvc-input-group-addon, .fvc-input-error.fvc-input-search:focus-within .fvc-input-group-addon, .fvc-input-error .fvc-input-affix-wrapper:focus .fvc-input-group-addon, .fvc-input-error .fvc-input-affix-wrapper:focus-visible .fvc-input-group-addon, .fvc-input-error .fvc-input-affix-wrapper:focus-within .fvc-input-group-addon {\n font-family: var(--input-font-family);\n font-weight: var(--input-md-size-fw);\n font-size: var(--input-md-size-fz);\n line-height: var(--input-md-size-lh);\n letter-spacing: 0;\n color: var(--input-addon-text-color);\n display: flex;\n align-items: center;\n justify-content: center;\n min-width: var(--input-addon-min-width);\n width: auto;\n height: 100%;\n border: none;\n border-radius: 0;\n background-color: var(--input-error-addon-bg-color);\n line-height: var(--input-md-size-addon-lh);\n padding-left: var(--input-md-size-addon-spacing);\n padding-right: var(--input-md-size-addon-spacing);\n}\n\n.fvc-input-error:focus .fvc-input-group-addon:first-child, .fvc-input-error:focus-visible .fvc-input-group-addon:first-child, .fvc-input-error:focus-within .fvc-input-group-addon:first-child, .fvc-input-error .fvc-input:focus .fvc-input-group-addon:first-child, .fvc-input-error .fvc-input:focus-visible .fvc-input-group-addon:first-child, .fvc-input-error .fvc-input:focus-within .fvc-input-group-addon:first-child, .fvc-input-error.fvc-input-search:focus .fvc-input-group-addon:first-child, .fvc-input-error.fvc-input-search:focus-visible .fvc-input-group-addon:first-child, .fvc-input-error.fvc-input-search:focus-within .fvc-input-group-addon:first-child, .fvc-input-error .fvc-input-affix-wrapper:focus .fvc-input-group-addon:first-child, .fvc-input-error .fvc-input-affix-wrapper:focus-visible .fvc-input-group-addon:first-child, .fvc-input-error .fvc-input-affix-wrapper:focus-within .fvc-input-group-addon:first-child {\n border-right: var(--input-border-width) solid var(--input-error-focus-border-color);\n background-color: var(--input-error-addon-bg-color);\n}\n\n.fvc-input-error:focus .fvc-input-group-addon:last-child, .fvc-input-error:focus-visible .fvc-input-group-addon:last-child, .fvc-input-error:focus-within .fvc-input-group-addon:last-child, .fvc-input-error .fvc-input:focus .fvc-input-group-addon:last-child, .fvc-input-error .fvc-input:focus-visible .fvc-input-group-addon:last-child, .fvc-input-error .fvc-input:focus-within .fvc-input-group-addon:last-child, .fvc-input-error.fvc-input-search:focus .fvc-input-group-addon:last-child, .fvc-input-error.fvc-input-search:focus-visible .fvc-input-group-addon:last-child, .fvc-input-error.fvc-input-search:focus-within .fvc-input-group-addon:last-child, .fvc-input-error .fvc-input-affix-wrapper:focus .fvc-input-group-addon:last-child, .fvc-input-error .fvc-input-affix-wrapper:focus-visible .fvc-input-group-addon:last-child, .fvc-input-error .fvc-input-affix-wrapper:focus-within .fvc-input-group-addon:last-child {\n border-left: var(--input-border-width) solid var(--input-error-focus-border-color);\n background-color: var(--input-error-addon-bg-color);\n}\n\n.fvc-input-error[data-valid=true], .fvc-input-error:has(input[data-valid=true]), .fvc-input-error .fvc-input[data-valid=true], .fvc-input-error .fvc-input:has(input[data-valid=true]), .fvc-input-error.fvc-input-search[data-valid=true], .fvc-input-error.fvc-input-search:has(input[data-valid=true]), .fvc-input-error .fvc-input-affix-wrapper[data-valid=true], .fvc-input-error .fvc-input-affix-wrapper:has(input[data-valid=true]) {\n background-color: var(--input-error-valid-bg-color);\n border-color: var(--input-error-valid-border-color);\n}\n\n.fvc-input-error[data-valid=true] .fvc-input-group-addon, .fvc-input-error:has(input[data-valid=true]) .fvc-input-group-addon, .fvc-input-error .fvc-input[data-valid=true] .fvc-input-group-addon, .fvc-input-error .fvc-input:has(input[data-valid=true]) .fvc-input-group-addon, .fvc-input-error.fvc-input-search[data-valid=true] .fvc-input-group-addon, .fvc-input-error.fvc-input-search:has(input[data-valid=true]) .fvc-input-group-addon, .fvc-input-error .fvc-input-affix-wrapper[data-valid=true] .fvc-input-group-addon, .fvc-input-error .fvc-input-affix-wrapper:has(input[data-valid=true]) .fvc-input-group-addon {\n font-family: var(--input-font-family);\n font-weight: var(--input-md-size-fw);\n font-size: var(--input-md-size-fz);\n line-height: var(--input-md-size-lh);\n letter-spacing: 0;\n color: var(--input-addon-text-color);\n display: flex;\n align-items: center;\n justify-content: center;\n min-width: var(--input-addon-min-width);\n width: auto;\n height: 100%;\n border: none;\n border-radius: 0;\n background-color: var(--input-error-addon-bg-color);\n line-height: var(--input-md-size-addon-lh);\n padding-left: var(--input-md-size-addon-spacing);\n padding-right: var(--input-md-size-addon-spacing);\n}\n\n.fvc-input-error[data-valid=true] .fvc-input-group-addon:first-child, .fvc-input-error:has(input[data-valid=true]) .fvc-input-group-addon:first-child, .fvc-input-error .fvc-input[data-valid=true] .fvc-input-group-addon:first-child, .fvc-input-error .fvc-input:has(input[data-valid=true]) .fvc-input-group-addon:first-child, .fvc-input-error.fvc-input-search[data-valid=true] .fvc-input-group-addon:first-child, .fvc-input-error.fvc-input-search:has(input[data-valid=true]) .fvc-input-group-addon:first-child, .fvc-input-error .fvc-input-affix-wrapper[data-valid=true] .fvc-input-group-addon:first-child, .fvc-input-error .fvc-input-affix-wrapper:has(input[data-valid=true]) .fvc-input-group-addon:first-child {\n border-right: var(--input-border-width) solid var(--input-error-valid-border-color);\n background-color: var(--input-error-addon-bg-color);\n}\n\n.fvc-input-error[data-valid=true] .fvc-input-group-addon:last-child, .fvc-input-error:has(input[data-valid=true]) .fvc-input-group-addon:last-child, .fvc-input-error .fvc-input[data-valid=true] .fvc-input-group-addon:last-child, .fvc-input-error .fvc-input:has(input[data-valid=true]) .fvc-input-group-addon:last-child, .fvc-input-error.fvc-input-search[data-valid=true] .fvc-input-group-addon:last-child, .fvc-input-error.fvc-input-search:has(input[data-valid=true]) .fvc-input-group-addon:last-child, .fvc-input-error .fvc-input-affix-wrapper[data-valid=true] .fvc-input-group-addon:last-child, .fvc-input-error .fvc-input-affix-wrapper:has(input[data-valid=true]) .fvc-input-group-addon:last-child {\n border-left: var(--input-border-width) solid var(--input-error-valid-border-color);\n background-color: var(--input-error-addon-bg-color);\n}\n\n.fvc-input-error.fvc-input-disabled, .fvc-input-error.fvc-input-disabled:hover:not([disabled]), .fvc-input-error.fvc-input-disabled[disabled]:hover:not([disabled]), .fvc-input-error:has(.fvc-input-disabled[disabled]), .fvc-input-error .fvc-input.fvc-input-disabled, .fvc-input-error .fvc-input.fvc-input-disabled:hover:not([disabled]), .fvc-input-error .fvc-input.fvc-input-disabled[disabled]:hover:not([disabled]), .fvc-input-error .fvc-input:has(.fvc-input-disabled[disabled]), .fvc-input-error.fvc-input-search.fvc-input-disabled, .fvc-input-error.fvc-input-search.fvc-input-disabled:hover:not([disabled]), .fvc-input-error.fvc-input-search.fvc-input-disabled[disabled]:hover:not([disabled]), .fvc-input-error.fvc-input-search:has(.fvc-input-disabled[disabled]), .fvc-input-error .fvc-input-affix-wrapper.fvc-input-disabled, .fvc-input-error .fvc-input-affix-wrapper.fvc-input-disabled:hover:not([disabled]), .fvc-input-error .fvc-input-affix-wrapper.fvc-input-disabled[disabled]:hover:not([disabled]), .fvc-input-error .fvc-input-affix-wrapper:has(.fvc-input-disabled[disabled]) {\n background-color: var(--input-error-disabled-bg-color);\n border-color: var(--input-error-disabled-border-color);\n color: var(--input-error-disabled-text-color);\n}\n\n.fvc-input-error.fvc-input-disabled .fvc-input-group-addon, .fvc-input-error.fvc-input-disabled:hover:not([disabled]) .fvc-input-group-addon, .fvc-input-error.fvc-input-disabled[disabled]:hover:not([disabled]) .fvc-input-group-addon, .fvc-input-error:has(.fvc-input-disabled[disabled]) .fvc-input-group-addon, .fvc-input-error .fvc-input.fvc-input-disabled .fvc-input-group-addon, .fvc-input-error .fvc-input.fvc-input-disabled:hover:not([disabled]) .fvc-input-group-addon, .fvc-input-error .fvc-input.fvc-input-disabled[disabled]:hover:not([disabled]) .fvc-input-group-addon, .fvc-input-error .fvc-input:has(.fvc-input-disabled[disabled]) .fvc-input-group-addon, .fvc-input-error.fvc-input-search.fvc-input-disabled .fvc-input-group-addon, .fvc-input-error.fvc-input-search.fvc-input-disabled:hover:not([disabled]) .fvc-input-group-addon, .fvc-input-error.fvc-input-search.fvc-input-disabled[disabled]:hover:not([disabled]) .fvc-input-group-addon, .fvc-input-error.fvc-input-search:has(.fvc-input-disabled[disabled]) .fvc-input-group-addon, .fvc-input-error .fvc-input-affix-wrapper.fvc-input-disabled .fvc-input-group-addon, .fvc-input-error .fvc-input-affix-wrapper.fvc-input-disabled:hover:not([disabled]) .fvc-input-group-addon, .fvc-input-error .fvc-input-affix-wrapper.fvc-input-disabled[disabled]:hover:not([disabled]) .fvc-input-group-addon, .fvc-input-error .fvc-input-affix-wrapper:has(.fvc-input-disabled[disabled]) .fvc-input-group-addon {\n font-family: var(--input-font-family);\n font-weight: var(--input-md-size-fw);\n font-size: var(--input-md-size-fz);\n line-height: var(--input-md-size-lh);\n letter-spacing: 0;\n color: var(--input-addon-text-color);\n display: flex;\n align-items: center;\n justify-content: center;\n min-width: var(--input-addon-min-width);\n width: auto;\n height: 100%;\n border: none;\n border-radius: 0;\n background-color: var(--input-error-addon-bg-color);\n line-height: var(--input-md-size-addon-lh);\n padding-left: var(--input-md-size-addon-spacing);\n padding-right: var(--input-md-size-addon-spacing);\n}\n\n.fvc-input-error.fvc-input-disabled .fvc-input-group-addon:first-child, .fvc-input-error.fvc-input-disabled:hover:not([disabled]) .fvc-input-group-addon:first-child, .fvc-input-error.fvc-input-disabled[disabled]:hover:not([disabled]) .fvc-input-group-addon:first-child, .fvc-input-error:has(.fvc-input-disabled[disabled]) .fvc-input-group-addon:first-child, .fvc-input-error .fvc-input.fvc-input-disabled .fvc-input-group-addon:first-child, .fvc-input-error .fvc-input.fvc-input-disabled:hover:not([disabled]) .fvc-input-group-addon:first-child, .fvc-input-error .fvc-input.fvc-input-disabled[disabled]:hover:not([disabled]) .fvc-input-group-addon:first-child, .fvc-input-error .fvc-input:has(.fvc-input-disabled[disabled]) .fvc-input-group-addon:first-child, .fvc-input-error.fvc-input-search.fvc-input-disabled .fvc-input-group-addon:first-child, .fvc-input-error.fvc-input-search.fvc-input-disabled:hover:not([disabled]) .fvc-input-group-addon:first-child, .fvc-input-error.fvc-input-search.fvc-input-disabled[disabled]:hover:not([disabled]) .fvc-input-group-addon:first-child, .fvc-input-error.fvc-input-search:has(.fvc-input-disabled[disabled]) .fvc-input-group-addon:first-child, .fvc-input-error .fvc-input-affix-wrapper.fvc-input-disabled .fvc-input-group-addon:first-child, .fvc-input-error .fvc-input-affix-wrapper.fvc-input-disabled:hover:not([disabled]) .fvc-input-group-addon:first-child, .fvc-input-error .fvc-input-affix-wrapper.fvc-input-disabled[disabled]:hover:not([disabled]) .fvc-input-group-addon:first-child, .fvc-input-error .fvc-input-affix-wrapper:has(.fvc-input-disabled[disabled]) .fvc-input-group-addon:first-child {\n border-right: var(--input-border-width) solid var(--input-error-disabled-border-color);\n background-color: var(--input-error-addon-bg-color);\n}\n\n.fvc-input-error.fvc-input-disabled .fvc-input-group-addon:last-child, .fvc-input-error.fvc-input-disabled:hover:not([disabled]) .fvc-input-group-addon:last-child, .fvc-input-error.fvc-input-disabled[disabled]:hover:not([disabled]) .fvc-input-group-addon:last-child, .fvc-input-error:has(.fvc-input-disabled[disabled]) .fvc-input-group-addon:last-child, .fvc-input-error .fvc-input.fvc-input-disabled .fvc-input-group-addon:last-child, .fvc-input-error .fvc-input.fvc-input-disabled:hover:not([disabled]) .fvc-input-group-addon:last-child, .fvc-input-error .fvc-input.fvc-input-disabled[disabled]:hover:not([disabled]) .fvc-input-group-addon:last-child, .fvc-input-error .fvc-input:has(.fvc-input-disabled[disabled]) .fvc-input-group-addon:last-child, .fvc-input-error.fvc-input-search.fvc-input-disabled .fvc-input-group-addon:last-child, .fvc-input-error.fvc-input-search.fvc-input-disabled:hover:not([disabled]) .fvc-input-group-addon:last-child, .fvc-input-error.fvc-input-search.fvc-input-disabled[disabled]:hover:not([disabled]) .fvc-input-group-addon:last-child, .fvc-input-error.fvc-input-search:has(.fvc-input-disabled[disabled]) .fvc-input-group-addon:last-child, .fvc-input-error .fvc-input-affix-wrapper.fvc-input-disabled .fvc-input-group-addon:last-child, .fvc-input-error .fvc-input-affix-wrapper.fvc-input-disabled:hover:not([disabled]) .fvc-input-group-addon:last-child, .fvc-input-error .fvc-input-affix-wrapper.fvc-input-disabled[disabled]:hover:not([disabled]) .fvc-input-group-addon:last-child, .fvc-input-error .fvc-input-affix-wrapper:has(.fvc-input-disabled[disabled]) .fvc-input-group-addon:last-child {\n border-left: var(--input-border-width) solid var(--input-error-disabled-border-color);\n background-color: var(--input-error-addon-bg-color);\n}\n\n.fvc-input-error-text, .fvc-input-error .fvc-input-text, .fvc-input-error.fvc-input-search-text, .fvc-input-error .fvc-input-affix-wrapper-text {\n display: flex;\n align-items: center;\n width: 100%;\n margin-top: var(--input-description-spacing);\n gap: var(--input-description-spacing);\n font-family: var(--input-font-family);\n font-weight: var(--input-md-size-fw);\n font-size: var(--input-md-size-fz);\n line-height: var(--input-md-size-lh);\n letter-spacing: 0;\n color: var(--input-description-error-color);\n}\n\n.fvc-input {\n /* EMPTY */\n}\n\n.fvc-input-empty .fvc-input-clear-icon {\n display: none;\n}\n\n.fvc-input {\n /* CONTROLS */\n}\n\n.fvc-input-no-controls .fvc-input::-webkit-outer-spin-button, .fvc-input-no-controls .fvc-input::-webkit-inner-spin-button {\n -webkit-appearance: none;\n margin: 0;\n}\n\n.fvc-input-no-controls .fvc-input {\n -moz-appearance: textfield;\n}\n\n.fvc-input {\n /* LABEL */\n}\n\n.fvc-input-label {\n font-family: var(--input-font-family);\n font-weight: var(--input-md-size-fw);\n font-size: var(--input-md-size-fz);\n line-height: var(--input-md-size-lh);\n letter-spacing: 0;\n color: var(--input-outlined-label-color);\n font-weight: var(--input-md-size-label-fw);\n margin-bottom: var(--input-md-size-label-spacing);\n display: flex;\n width: 100%;\n gap: 2px;\n}\n\n.fvc-input-root:has(.fvc-input-outlined) .fvc-input-label {\n color: var(--input-outlined-label-color);\n}\n\n.fvc-input-root:has(.fvc-input-error) .fvc-input-label {\n color: var(--input-error-label-color);\n}\n\n.fvc-input-label-asterisk {\n color: var(--input-asterisk-color);\n}\n\n.fvc-input {\n /* AFFIX WRAPPER */\n}\n\n.fvc-input-affix-wrapper {\n height: var(--input-md-size-height);\n border-radius: var(--input-md-size-border-radius);\n padding: var(--input-md-size-spacing);\n display: flex;\n align-items: center;\n}\n\n.fvc-input-affix-wrapper .fvc-input {\n height: var(--input-md-size-affix-height);\n /* PREFIX AND SUFFIX */\n}\n\n.fvc-input-affix-wrapper .fvc-input-prefix, .fvc-input-affix-wrapper .fvc-input-suffix {\n font-family: var(--input-font-family);\n font-weight: var(--input-md-size-fw);\n font-size: var(--input-md-size-fz);\n line-height: var(--input-md-size-lh);\n letter-spacing: 0;\n color: var(--input-addon-text-color);\n}\n\n.fvc-input-affix-wrapper .fvc-input-prefix {\n height: 100%;\n line-height: var(--input-md-size-affix-height);\n margin-inline-end: var(--input-md-size-affix-spacing);\n}\n\n.fvc-input-affix-wrapper .fvc-input-suffix {\n margin-inline-start: var(--input-md-size-affix-spacing);\n}\n\n.fvc-input-affix-wrapper.fvc-input-textarea-affix-wrapper {\n height: auto;\n}\n\n.fvc-input-affix-wrapper.fvc-input-textarea-affix-wrapper .fvc-input {\n height: auto;\n}\n\n.fvc-input {\n /* STICKY SUFFIX */\n}\n\n.fvc-input-suffix-sticky {\n display: flex;\n align-items: center;\n overflow: hidden;\n}\n\n.fvc-input-suffix-sticky .fvc-input-affix-wrapper {\n position: relative;\n}\n\n.fvc-input-suffix-sticky:not(.fvc-input-with-prefix).fvc-input-empty > .fvc-input-suffix {\n margin-inline-start: 0;\n}\n\n.fvc-input-suffix-sticky-suffix {\n display: flex;\n align-items: center;\n}\n\n.fvc-input-suffix-sticky-wrapper {\n display: flex;\n align-items: center;\n}\n\n.fvc-input-suffix-sticky-content {\n visibility: hidden;\n display: flex;\n align-items: center;\n gap: 4px;\n}\n\n.fvc-input-suffix-sticky .fvc-input-suffix {\n position: absolute;\n display: flex;\n align-items: center;\n height: 100%;\n top: 50%;\n transform: translateY(-50%);\n z-index: 999;\n}\n\n.fvc-input {\n /* GROUP */\n}\n\n.fvc-input-group {\n display: flex;\n align-items: center;\n height: 100%;\n /* GROUP WRAPPER */\n}\n\n.fvc-input-group-wrapper {\n height: var(--input-md-size-height);\n border-radius: var(--input-md-size-border-radius);\n padding: var(--input-md-size-spacing);\n padding: 0;\n overflow: hidden;\n}\n\n.fvc-input-group-wrapper .fvc-input {\n height: var(--input-md-size-height);\n border-radius: var(--input-md-size-border-radius);\n padding: var(--input-md-size-spacing);\n border: none;\n}\n\n.fvc-input-group-wrapper {\n /* AFFIX WRAPPER */\n}\n\n.fvc-input-group-wrapper .fvc-input-affix-wrapper {\n border: none;\n}\n\n.fvc-input-group-wrapper .fvc-input-affix-wrapper:has(+ .fvc-input-group-addon) {\n padding-right: var(--input-md-size-affix-spacing);\n}\n\n.fvc-input {\n /* SEARCH */\n}\n\n.fvc-input-search > .fvc-input-group > .fvc-input-group-addon:last-child {\n inset-inline-start: 0;\n padding-left: var(--input-md-size-addon-spacing);\n padding-right: var(--input-md-size-addon-spacing);\n}\n\n.fvc-input-search > .fvc-input-group > .fvc-input-group-addon:last-child .fvc-input-button {\n border: none;\n outline: none;\n background-color: transparent;\n box-shadow: none;\n}\n\n.fvc-input-search > .fvc-input-group > .fvc-input-group-addon:last-child .fvc-input-button > div {\n display: none;\n}\n\n.fvc-input {\n /* ROOT */\n}\n\n.fvc-input-root {\n width: 100%;\n display: flex;\n flex-direction: column;\n}");const m="fvc-input",w=`${m}-root`,x=`${m}-suffix-sticky`,z={clearIcon:r.createElement(d.Clear,{width:16,height:16,color:"var(--blue-gray-600)","aria-label":"input-clear-icon"})};function y(n,i){const d=t((t,d)=>{var{allowClear:a,className:p,controls:c=!0,defaultValue:f,error:s,label:g,name:y,onChange:k,placeholder:E,prefix:O,suffix:N,suffixType:j="fixed",testId:S,textTransform:C,value:P,variant:A="outlined",withAsterisk:I=!1}=t,R=function(n,i){var r={};for(var t in n)Object.prototype.hasOwnProperty.call(n,t)&&i.indexOf(t)<0&&(r[t]=n[t]);if(null!=n&&"function"==typeof Object.getOwnPropertySymbols){var o=0;for(t=Object.getOwnPropertySymbols(n);o<t.length;o++)i.indexOf(t[o])<0&&Object.prototype.propertyIsEnumerable.call(n,t[o])&&(r[t[o]]=n[t[o]])}return r}(t,["allowClear","className","controls","defaultValue","error","label","name","onChange","placeholder","prefix","suffix","suffixType","testId","textTransform","value","variant","withAsterisk"]);const[$,T]=o(f),F=void 0!==P,V=F?P:$,U=e(n=>{const{value:i}=n.target,r=C?u(i,C):i;F||T(r),null==k||k(Object.assign(Object.assign({},n),{target:Object.assign(Object.assign({},n.target),{value:r})}))},[F,k,C]),X="sticky"===j&&!!N,L=v(p,`${m}-${A}`,{[`${m}-error`]:!!s,[`${m}-empty`]:!V,[`${m}-with-prefix`]:!!O,[`${m}-no-controls`]:!c,[`${x}`]:X}),B=a?z:void 0;return r.createElement("div",{className:w},g&&r.createElement(h,{label:g,name:y,withAsterisk:I}),r.createElement(n,Object.assign({},R,i,{variant:A,prefixCls:m,className:L,required:!0,name:y,value:V,onChange:U,prefix:O,suffix:N?r.createElement(b,{suffix:N,prefix:O,inputValue:V,isSticky:X}):void 0,allowClear:B,placeholder:X?void 0:E,"data-testid":S,"data-valid":!!V,ref:d})),"string"==typeof s&&r.createElement(l,{error:s}))});return d.displayName=n.displayName,d}const k=y(n);k.Textarea=y(n.TextArea,{rootClassName:`${m}-textarea`}),k.Search=y(n.Search,{inputPrefixCls:m,rootClassName:`${m}-search`}),k.Password=y(n.Password,{inputPrefixCls:m,rootClassName:`${m}-password`}),k.Masked=y(i,{rootClassName:`${m}-masked`});export{k as Input};
|