@lidofinance/lido-ui 3.8.0 → 3.8.1

package/dist/cjs/input/Input.js

@@ -29,17 +29,18 @@ function Input(props, ref) {
     const hasLeftDecorator = !!leftDecorator;
     const hasRightDecorator = !!rightDecorator;
     return /*#__PURE__*/ _react.default.createElement(_inputStyles.InputWrapperStyle, _extends({
-        $error: hasError,
-        $warning: hasWarning,
-        $active: active,
         $disabled: disabled,
         $fullwidth: fullwidth,
-        $color: color,
         htmlFor: id,
         ref: wrapperRef
-    }, wrapperProps), hasLeftDecorator && /*#__PURE__*/ _react.default.createElement(_inputStyles.InputLeftDecoratorStyle, null, leftDecorator), /*#__PURE__*/ _react.default.createElement(_inputStyles.InputContentStyle, {
-        $variant: variant
-    }, /*#__PURE__*/ _react.default.createElement(_inputStyles.InputStyle, _extends({
+    }, wrapperProps), /*#__PURE__*/ _react.default.createElement(_inputStyles.InputContentStyle, {
+        $color: color,
+        $variant: variant,
+        $error: hasError,
+        $warning: hasWarning,
+        $active: active,
+        $disabled: disabled
+    }, hasLeftDecorator && /*#__PURE__*/ _react.default.createElement(_inputStyles.InputLeftDecoratorStyle, null, leftDecorator), /*#__PURE__*/ _react.default.createElement(_inputStyles.InputControlWrapperStyle, null, /*#__PURE__*/ _react.default.createElement(_inputStyles.InputStyle, _extends({
         $labeled: hasLabel,
         $color: color,
         placeholder: placeholder,
@@ -48,7 +49,7 @@ function Input(props, ref) {
         ref: ref
     }, rest)), hasLabel && /*#__PURE__*/ _react.default.createElement(_labelStyles.InputLabelStyle, {
         $color: color
-    }, label)), hasErrorMessage && /*#__PURE__*/ _react.default.createElement(_inputStyles.InputMessageStyle, {
+    }, label)), hasRightDecorator && /*#__PURE__*/ _react.default.createElement(_inputStyles.InputRightDecoratorStyle, null, rightDecorator)), hasErrorMessage && /*#__PURE__*/ _react.default.createElement(_inputStyles.InputMessageStyle, {
         $variant: "error",
         $bordered: true
     }, error), hasWarningMessage && /*#__PURE__*/ _react.default.createElement(_inputStyles.InputMessageStyle, {
@@ -57,7 +58,7 @@ function Input(props, ref) {
     }, warning), hasSuccessMessage && /*#__PURE__*/ _react.default.createElement(_inputStyles.InputMessageStyle, {
         $variant: "success",
         $bordered: true
-    }, success), hasRightDecorator && /*#__PURE__*/ _react.default.createElement(_inputStyles.InputRightDecoratorStyle, null, rightDecorator));
+    }, success));
 }
 const _default = /*#__PURE__*/ (0, _react.forwardRef)(Input);
 

package/dist/cjs/input/Input.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../packages/input/Input.tsx"],"sourcesContent":["import React, { ForwardedRef, forwardRef } from 'react'\nimport {\n  InputWrapperStyle,\n  InputContentStyle,\n  InputStyle,\n  InputLeftDecoratorStyle,\n  InputRightDecoratorStyle,\n  InputMessageStyle,\n} from './InputStyles'\nimport { InputLabelStyle } from './LabelStyles'\nimport { InputProps } from './types'\n\nfunction Input(props: InputProps, ref?: ForwardedRef<HTMLInputElement>) {\n  const {\n    label,\n    error,\n    warning,\n    success,\n    active = false,\n    fullwidth = false,\n    placeholder = ' ',\n    leftDecorator,\n    rightDecorator,\n    className,\n    style,\n    variant = 'default',\n    color = 'default',\n    wrapperRef,\n    children,\n    ...rest\n  } = props\n\n  const { id, disabled = false } = props\n  const wrapperProps = { className, style }\n\n  const hasLabel = !!label && variant === 'default'\n\n  const hasError = !!error\n  const hasErrorMessage = hasError && typeof error !== 'boolean'\n  const hasWarning = !hasError && !!warning // `error` overrides `warning`\n  const hasWarningMessage = hasWarning && typeof warning !== 'boolean'\n  const hasSuccess = !!success && !error\n  const hasSuccessMessage = hasSuccess && typeof success !== 'boolean'\n\n  const hasLeftDecorator = !!leftDecorator\n  const hasRightDecorator = !!rightDecorator\n\n  return (\n    <InputWrapperStyle\n      $error={hasError}\n      $warning={hasWarning}\n      $active={active}\n      $disabled={disabled}\n      $fullwidth={fullwidth}\n      $color={color}\n      htmlFor={id}\n      ref={wrapperRef}\n      {...wrapperProps}\n    >\n      {hasLeftDecorator && (\n        <InputLeftDecoratorStyle>{leftDecorator}</InputLeftDecoratorStyle>\n      )}\n\n      <InputContentStyle $variant={variant}>\n        <InputStyle\n          $labeled={hasLabel}\n          $color={color}\n          placeholder={placeholder}\n          aria-invalid={hasError}\n          type='text'\n          ref={ref}\n          {...rest}\n        />\n        {hasLabel && <InputLabelStyle $color={color}>{label}</InputLabelStyle>}\n      </InputContentStyle>\n\n      {hasErrorMessage && (\n        <InputMessageStyle $variant='error' $bordered>\n          {error}\n        </InputMessageStyle>\n      )}\n      {hasWarningMessage && (\n        <InputMessageStyle $variant='warning' $bordered>\n          {warning}\n        </InputMessageStyle>\n      )}\n      {hasSuccessMessage && (\n        <InputMessageStyle $variant='success' $bordered>\n          {success}\n        </InputMessageStyle>\n      )}\n\n      {hasRightDecorator && (\n        <InputRightDecoratorStyle>{rightDecorator}</InputRightDecoratorStyle>\n      )}\n    </InputWrapperStyle>\n  )\n}\n\nexport default forwardRef(Input)\n"],"names":["Input","props","ref","label","error","warning","success","active","fullwidth","placeholder","leftDecorator","rightDecorator","className","style","variant","color","wrapperRef","children","rest","id","disabled","wrapperProps","hasLabel","hasError","hasErrorMessage","hasWarning","hasWarningMessage","hasSuccess","hasSuccessMessage","hasLeftDecorator","hasRightDecorator","InputWrapperStyle","$error","$warning","$active","$disabled","$fullwidth","$color","htmlFor","InputLeftDecoratorStyle","InputContentStyle","$variant","InputStyle","$labeled","aria-invalid","type","InputLabelStyle","InputMessageStyle","$bordered","InputRightDecoratorStyle","forwardRef"],"mappings":"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"}
+{"version":3,"sources":["../../../packages/input/Input.tsx"],"sourcesContent":["import React, { ForwardedRef, forwardRef } from 'react'\nimport {\n  InputWrapperStyle,\n  InputContentStyle,\n  InputControlWrapperStyle,\n  InputStyle,\n  InputLeftDecoratorStyle,\n  InputRightDecoratorStyle,\n  InputMessageStyle,\n} from './InputStyles'\nimport { InputLabelStyle } from './LabelStyles'\nimport { InputProps } from './types'\n\nfunction Input(props: InputProps, ref?: ForwardedRef<HTMLInputElement>) {\n  const {\n    label,\n    error,\n    warning,\n    success,\n    active = false,\n    fullwidth = false,\n    placeholder = ' ',\n    leftDecorator,\n    rightDecorator,\n    className,\n    style,\n    variant = 'default',\n    color = 'default',\n    wrapperRef,\n    children,\n    ...rest\n  } = props\n\n  const { id, disabled = false } = props\n  const wrapperProps = { className, style }\n\n  const hasLabel = !!label && variant === 'default'\n\n  const hasError = !!error\n  const hasErrorMessage = hasError && typeof error !== 'boolean'\n  const hasWarning = !hasError && !!warning // `error` overrides `warning`\n  const hasWarningMessage = hasWarning && typeof warning !== 'boolean'\n  const hasSuccess = !!success && !error\n  const hasSuccessMessage = hasSuccess && typeof success !== 'boolean'\n\n  const hasLeftDecorator = !!leftDecorator\n  const hasRightDecorator = !!rightDecorator\n\n  return (\n    <InputWrapperStyle\n      $disabled={disabled}\n      $fullwidth={fullwidth}\n      htmlFor={id}\n      ref={wrapperRef}\n      {...wrapperProps}\n    >\n      <InputContentStyle\n        $color={color}\n        $variant={variant}\n        $error={hasError}\n        $warning={hasWarning}\n        $active={active}\n        $disabled={disabled}\n      >\n        {hasLeftDecorator && (\n          <InputLeftDecoratorStyle>{leftDecorator}</InputLeftDecoratorStyle>\n        )}\n\n        <InputControlWrapperStyle>\n          <InputStyle\n            $labeled={hasLabel}\n            $color={color}\n            placeholder={placeholder}\n            aria-invalid={hasError}\n            type='text'\n            ref={ref}\n            {...rest}\n          />\n          {hasLabel && (\n            <InputLabelStyle $color={color}>{label}</InputLabelStyle>\n          )}\n        </InputControlWrapperStyle>\n\n        {hasRightDecorator && (\n          <InputRightDecoratorStyle>{rightDecorator}</InputRightDecoratorStyle>\n        )}\n      </InputContentStyle>\n\n      {hasErrorMessage && (\n        <InputMessageStyle $variant='error' $bordered>\n          {error}\n        </InputMessageStyle>\n      )}\n      {hasWarningMessage && (\n        <InputMessageStyle $variant='warning' $bordered>\n          {warning}\n        </InputMessageStyle>\n      )}\n      {hasSuccessMessage && (\n        <InputMessageStyle $variant='success' $bordered>\n          {success}\n        </InputMessageStyle>\n      )}\n    </InputWrapperStyle>\n  )\n}\n\nexport default forwardRef(Input)\n"],"names":["Input","props","ref","label","error","warning","success","active","fullwidth","placeholder","leftDecorator","rightDecorator","className","style","variant","color","wrapperRef","children","rest","id","disabled","wrapperProps","hasLabel","hasError","hasErrorMessage","hasWarning","hasWarningMessage","hasSuccess","hasSuccessMessage","hasLeftDecorator","hasRightDecorator","InputWrapperStyle","$disabled","$fullwidth","htmlFor","InputContentStyle","$color","$variant","$error","$warning","$active","InputLeftDecoratorStyle","InputControlWrapperStyle","InputStyle","$labeled","aria-invalid","type","InputLabelStyle","InputRightDecoratorStyle","InputMessageStyle","$bordered","forwardRef"],"mappings":"AAAA;;;;+BA2GA,SAAgC;;aAAhC,QAAgC;;;;6DA3GgB,OAAO;6BAShD,eAAe;6BACU,eAAe;AAG/C,SAASA,KAAK,CAACC,KAAiB,EAAEC,GAAoC,EAAE;IACtE,MAAM,EACJC,KAAK,CAAA,EACLC,KAAK,CAAA,EACLC,OAAO,CAAA,EACPC,OAAO,CAAA,EACPC,MAAM,EAAG,KAAK,CAAA,EACdC,SAAS,EAAG,KAAK,CAAA,EACjBC,WAAW,EAAG,GAAG,CAAA,EACjBC,aAAa,CAAA,EACbC,cAAc,CAAA,EACdC,SAAS,CAAA,EACTC,KAAK,CAAA,EACLC,OAAO,EAAG,SAAS,CAAA,EACnBC,KAAK,EAAG,SAAS,CAAA,EACjBC,UAAU,CAAA,EACVC,QAAQ,CAAA,EACR,GAAGC,IAAI,EACR,GAAGjB,KAAK;IAET,MAAM,EAAEkB,EAAE,CAAA,EAAEC,QAAQ,EAAG,KAAK,CAAA,EAAE,GAAGnB,KAAK;IACtC,MAAMoB,YAAY,GAAG;QAAET,SAAS;QAAEC,KAAK;KAAE;IAEzC,MAAMS,QAAQ,GAAG,CAAC,CAACnB,KAAK,IAAIW,OAAO,KAAK,SAAS;IAEjD,MAAMS,QAAQ,GAAG,CAAC,CAACnB,KAAK;IACxB,MAAMoB,eAAe,GAAGD,QAAQ,IAAI,OAAOnB,KAAK,KAAK,SAAS;IAC9D,MAAMqB,UAAU,GAAG,CAACF,QAAQ,IAAI,CAAC,CAAClB,OAAO,CAAC,8BAA8B;IAA/B;IACzC,MAAMqB,iBAAiB,GAAGD,UAAU,IAAI,OAAOpB,OAAO,KAAK,SAAS;IACpE,MAAMsB,UAAU,GAAG,CAAC,CAACrB,OAAO,IAAI,CAACF,KAAK;IACtC,MAAMwB,iBAAiB,GAAGD,UAAU,IAAI,OAAOrB,OAAO,KAAK,SAAS;IAEpE,MAAMuB,gBAAgB,GAAG,CAAC,CAACnB,aAAa;IACxC,MAAMoB,iBAAiB,GAAG,CAAC,CAACnB,cAAc;IAE1C,qBACE,6BAACoB,YAAiB,kBAAA;QAChBC,SAAS,EAAEZ,QAAQ;QACnBa,UAAU,EAAEzB,SAAS;QACrB0B,OAAO,EAAEf,EAAE;QACXjB,GAAG,EAAEc,UAAU;OACXK,YAAY,iBAEhB,6BAACc,YAAiB,kBAAA;QAChBC,MAAM,EAAErB,KAAK;QACbsB,QAAQ,EAAEvB,OAAO;QACjBwB,MAAM,EAAEf,QAAQ;QAChBgB,QAAQ,EAAEd,UAAU;QACpBe,OAAO,EAAEjC,MAAM;QACfyB,SAAS,EAAEZ,QAAQ;OAElBS,gBAAgB,kBACf,6BAACY,YAAuB,wBAAA,QAAE/B,aAAa,CAA2B,AACnE,gBAED,6BAACgC,YAAwB,yBAAA,sBACvB,6BAACC,YAAU,WAAA;QACTC,QAAQ,EAAEtB,QAAQ;QAClBc,MAAM,EAAErB,KAAK;QACbN,WAAW,EAAEA,WAAW;QACxBoC,cAAY,EAAEtB,QAAQ;QACtBuB,IAAI,EAAC,MAAM;QACX5C,GAAG,EAAEA,GAAG;OACJgB,IAAI,EACR,EACDI,QAAQ,kBACP,6BAACyB,YAAe,gBAAA;QAACX,MAAM,EAAErB,KAAK;OAAGZ,KAAK,CAAmB,AAC1D,CACwB,EAE1B2B,iBAAiB,kBAChB,6BAACkB,YAAwB,yBAAA,QAAErC,cAAc,CAA4B,AACtE,CACiB,EAEnBa,eAAe,kBACd,6BAACyB,YAAiB,kBAAA;QAACZ,QAAQ,EAAC,OAAO;QAACa,SAAS,EAATA,IAAS;OAC1C9C,KAAK,CACY,AACrB,EACAsB,iBAAiB,kBAChB,6BAACuB,YAAiB,kBAAA;QAACZ,QAAQ,EAAC,SAAS;QAACa,SAAS,EAATA,IAAS;OAC5C7C,OAAO,CACU,AACrB,EACAuB,iBAAiB,kBAChB,6BAACqB,YAAiB,kBAAA;QAACZ,QAAQ,EAAC,SAAS;QAACa,SAAS,EAATA,IAAS;OAC5C5C,OAAO,CACU,AACrB,CACiB,CACrB;AACH,CAAC;MAED,QAAgC,iBAAjB6C,IAAAA,MAAU,WAAA,EAACnD,KAAK,CAAC"}

package/dist/cjs/input/InputGroupStyles.js

@@ -14,6 +14,7 @@ _export(exports, {
 });
 const _interopRequireDefault = require("@swc/helpers/lib/_interop_require_default.js").default;
 const _styledComponents = /*#__PURE__*/ _interopRequireDefault(require("styled-components"));
+const _inputStyles = require("./InputStyles");
 const InputGroupStyle = _styledComponents.default.span`
   display: inline-flex;
   position: relative;
@@ -26,31 +27,22 @@ const InputGroupContentStyle = _styledComponents.default.span`
   display: flex;
   width: 100%;
 
-  & > * {
-    border-radius: 0px;
+  & > ${_inputStyles.InputWrapperStyle} {
     margin: 0 -1px 0 0;
 
     &:first-child {
-      border-top-left-radius: ${(param)=>{
-    let { theme  } = param;
-    return theme.borderRadiusesMap.lg;
-}}px;
-      border-bottom-left-radius: ${(param)=>{
-    let { theme  } = param;
-    return theme.borderRadiusesMap.lg;
-}}px;
+      & ${_inputStyles.InputContentStyle} {
+        border-top-right-radius: 0;
+        border-bottom-right-radius: 0;
+      }
     }
 
     &:last-child {
-      margin-right: 0;
-      border-top-right-radius: ${(param)=>{
-    let { theme  } = param;
-    return theme.borderRadiusesMap.lg;
-}}px;
-      border-bottom-right-radius: ${(param)=>{
-    let { theme  } = param;
-    return theme.borderRadiusesMap.lg;
-}}px;
+      & ${_inputStyles.InputContentStyle} {
+        margin-right: 0;
+        border-top-left-radius: 0;
+        border-bottom-left-radius: 0;
+      }
     }
   }
 `;

package/dist/cjs/input/InputGroupStyles.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../packages/input/InputGroupStyles.ts"],"sourcesContent":["import styled from 'styled-components'\n\nexport const InputGroupStyle = styled.span<{ $fullwidth: boolean }>`\n  display: inline-flex;\n  position: relative;\n  width: ${({ $fullwidth }) => ($fullwidth ? '100%' : 'auto')};\n`\n\nexport const InputGroupContentStyle = styled.span`\n  display: flex;\n  width: 100%;\n\n  & > * {\n    border-radius: 0px;\n    margin: 0 -1px 0 0;\n\n    &:first-child {\n      border-top-left-radius: ${({ theme }) => theme.borderRadiusesMap.lg}px;\n      border-bottom-left-radius: ${({ theme }) => theme.borderRadiusesMap.lg}px;\n    }\n\n    &:last-child {\n      margin-right: 0;\n      border-top-right-radius: ${({ theme }) => theme.borderRadiusesMap.lg}px;\n      border-bottom-right-radius: ${({ theme }) =>\n        theme.borderRadiusesMap.lg}px;\n    }\n  }\n`\n"],"names":["InputGroupStyle","InputGroupContentStyle","styled","span","$fullwidth","theme","borderRadiusesMap","lg"],"mappings":"AAAA;;;;;;;;;;;IAEaA,eAAe,MAAfA,eAAe;IAMfC,sBAAsB,MAAtBA,sBAAsB;;;uEARhB,mBAAmB;AAE/B,MAAMD,eAAe,GAAGE,iBAAM,QAAA,CAACC,IAAI,AAAyB,CAAC;;;SAG3D,EAAE,SAAoB;QAAnB,EAAEC,UAAU,CAAA,EAAE;WAAMA,UAAU,GAAG,MAAM,GAAG,MAAM;AAAA,CAAC,CAAC;AAC9D,CAAC;AAEM,MAAMH,sBAAsB,GAAGC,iBAAM,QAAA,CAACC,IAAI,CAAC;;;;;;;;;8BASpB,EAAE,SAAeE;QAAd,EAAEA,KAAK,CAAA,EAAE;WAAKA,KAAK,CAACC,iBAAiB,CAACC,EAAE;AAAD,CAAC,CAAC;iCACzC,EAAE,SAAeF;QAAd,EAAEA,KAAK,CAAA,EAAE;WAAKA,KAAK,CAACC,iBAAiB,CAACC,EAAE;AAAD,CAAC,CAAC;;;;;+BAK9C,EAAE,SAAeF;QAAd,EAAEA,KAAK,CAAA,EAAE;WAAKA,KAAK,CAACC,iBAAiB,CAACC,EAAE;AAAD,CAAC,CAAC;kCACzC,EAAE,SAC5BF;QAD6B,EAAEA,KAAK,CAAA,EAAE;WACtCA,KAAK,CAACC,iBAAiB,CAACC,EAAE;AAAD,CAAC,CAAC;;;AAGnC,CAAC"}
+{"version":3,"sources":["../../../packages/input/InputGroupStyles.ts"],"sourcesContent":["import styled from 'styled-components'\nimport { InputWrapperStyle, InputContentStyle } from './InputStyles'\n\nexport const InputGroupStyle = styled.span<{ $fullwidth: boolean }>`\n  display: inline-flex;\n  position: relative;\n  width: ${({ $fullwidth }) => ($fullwidth ? '100%' : 'auto')};\n`\n\nexport const InputGroupContentStyle = styled.span`\n  display: flex;\n  width: 100%;\n\n  & > ${InputWrapperStyle} {\n    margin: 0 -1px 0 0;\n\n    &:first-child {\n      & ${InputContentStyle} {\n        border-top-right-radius: 0;\n        border-bottom-right-radius: 0;\n      }\n    }\n\n    &:last-child {\n      & ${InputContentStyle} {\n        margin-right: 0;\n        border-top-left-radius: 0;\n        border-bottom-left-radius: 0;\n      }\n    }\n  }\n`\n"],"names":["InputGroupStyle","InputGroupContentStyle","styled","span","$fullwidth","InputWrapperStyle","InputContentStyle"],"mappings":"AAAA;;;;;;;;;;;IAGaA,eAAe,MAAfA,eAAe;IAMfC,sBAAsB,MAAtBA,sBAAsB;;;uEAThB,mBAAmB;6BACe,eAAe;AAE7D,MAAMD,eAAe,GAAGE,iBAAM,QAAA,CAACC,IAAI,AAAyB,CAAC;;;SAG3D,EAAE,SAAoB;QAAnB,EAAEC,UAAU,CAAA,EAAE;WAAMA,UAAU,GAAG,MAAM,GAAG,MAAM;AAAA,CAAC,CAAC;AAC9D,CAAC;AAEM,MAAMH,sBAAsB,GAAGC,iBAAM,QAAA,CAACC,IAAI,CAAC;;;;MAI5C,EAAEE,YAAiB,kBAAA,CAAC;;;;QAIlB,EAAEC,YAAiB,kBAAA,CAAC;;;;;;;QAOpB,EAAEA,YAAiB,kBAAA,CAAC;;;;;;;AAO5B,CAAC"}

package/dist/cjs/input/InputStyles.js

@@ -9,13 +9,14 @@ function _export(target, all) {
     });
 }
 _export(exports, {
+    InputLeftDecoratorStyle: ()=>InputLeftDecoratorStyle,
+    InputRightDecoratorStyle: ()=>InputRightDecoratorStyle,
     InputWrapperStyle: ()=>InputWrapperStyle,
     InputContentStyle: ()=>InputContentStyle,
+    InputControlWrapperStyle: ()=>InputControlWrapperStyle,
     InputStyle: ()=>InputStyle,
     TextareaStyle: ()=>TextareaStyle,
-    InputMessageStyle: ()=>InputMessageStyle,
-    InputLeftDecoratorStyle: ()=>InputLeftDecoratorStyle,
-    InputRightDecoratorStyle: ()=>InputRightDecoratorStyle
+    InputMessageStyle: ()=>InputMessageStyle
 });
 const _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildcard.js").default;
 const _styledComponents = /*#__PURE__*/ _interopRequireWildcard(require("styled-components"));
@@ -98,30 +99,80 @@ const wrapperColors = {
     }};
   `
 };
+const decoratorCSS = (0, _styledComponents.css)`
+  flex-grow: 0;
+  flex-shrink: 0;
+  cursor: inherit;
+  display: flex;
+  align-items: center;
+`;
+const InputLeftDecoratorStyle = _styledComponents.default.span`
+  ${decoratorCSS}
+  padding-right: 16px;
+`;
+const InputRightDecoratorStyle = _styledComponents.default.span`
+  ${decoratorCSS}
+  padding-left: 16px;
+`;
 const InputWrapperStyle = _styledComponents.default.label`
   position: relative;
   display: inline-flex;
-  border: 1px solid;
-  border-radius: ${(param)=>{
-    let { theme  } = param;
-    return theme.borderRadiusesMap.lg;
-}}px;
   align-items: stretch;
   box-sizing: border-box;
-  padding: 0 15px;
   cursor: ${(param)=>{
     let { $disabled  } = param;
     return $disabled ? 'default' : 'text';
 }};
-  transition: border-color ${(param)=>{
-    let { theme  } = param;
-    return theme.duration.fast;
-}} ease;
   width: ${(param)=>{
     let { $fullwidth  } = param;
     return $fullwidth ? '100%' : 'auto';
 }};
+`;
+const contentVariants = {
+    default: (0, _styledComponents.css)`
+    padding-top: 17px;
+    padding-bottom: 17px;
+
+    & ${InputLeftDecoratorStyle}, & ${InputRightDecoratorStyle} {
+      margin-top: -17px;
+      margin-bottom: -17px;
+    }
+  `,
+    small: (0, _styledComponents.css)`
+    padding-top: 9px;
+    padding-bottom: 9px;
+
+    & ${InputLeftDecoratorStyle}, & ${InputRightDecoratorStyle} {
+      padding-top: -9px;
+      padding-bottom: -9px;
+    }
+  `
+};
+const InputContentStyle = _styledComponents.default.span`
+  position: relative;
+  display: flex;
+  flex-grow: 1;
+  padding-left: 15px;
+  padding-right: 15px;
+  font-weight: 400;
+  font-size: ${(param)=>{
+    let { theme  } = param;
+    return theme.fontSizesMap.xs;
+}}px;
+  border: 1px solid;
+  border-radius: ${(param)=>{
+    let { theme  } = param;
+    return theme.borderRadiusesMap.lg;
+}}px;
+  transition: border-color ${(param)=>{
+    let { theme  } = param;
+    return theme.duration.fast;
+}} ease;
 
+  ${(param)=>{
+    let { $variant  } = param;
+    return contentVariants[$variant];
+}};
   ${(param)=>{
     let { $color  } = param;
     return wrapperColors[$color];
@@ -129,43 +180,24 @@ const InputWrapperStyle = _styledComponents.default.label`
   ${(param)=>{
     let { $disabled  } = param;
     return $disabled ? '' : statesCSS;
-}}
-
+}};
   ${(param)=>{
     let { $active  } = param;
     return $active ? activeCSS : '';
-}}
+}};
   ${(param)=>{
     let { $warning  } = param;
     return $warning ? warningCSS : '';
-}}
+}};
   ${(param)=>{
     let { $error  } = param;
     return $error ? errorCSS : '';
-}}
+}};
 `;
-const contentVariants = {
-    default: (0, _styledComponents.css)`
-    padding: 17px 0;
-  `,
-    small: (0, _styledComponents.css)`
-    padding: 9px 0;
-  `
-};
-const InputContentStyle = _styledComponents.default.span`
-  font-weight: 400;
-  font-size: ${(param)=>{
-    let { theme  } = param;
-    return theme.fontSizesMap.xs;
-}}px;
+const InputControlWrapperStyle = _styledComponents.default.div`
+  position: relative;
   display: flex;
   flex-grow: 1;
-  position: relative;
-
-  ${(param)=>{
-    let { $variant  } = param;
-    return contentVariants[$variant];
-}};
 `;
 const labeledCSS = (0, _styledComponents.css)`
   &:not(:focus):placeholder-shown {
@@ -325,26 +357,12 @@ const InputMessageStyle = _styledComponents.default.span`
     let { $bordered  } = param;
     return $bordered ? 'calc(100% + 2px)' : '100%';
 }};
+  z-index: 3;
 
   ${(param)=>{
     let { $variant  } = param;
     return messageVariants[$variant];
 }}
 `;
-const decoratorCSS = (0, _styledComponents.css)`
-  flex-grow: 0;
-  flex-shrink: 0;
-  cursor: inherit;
-  display: flex;
-  align-items: center;
-`;
-const InputLeftDecoratorStyle = _styledComponents.default.span`
-  ${decoratorCSS}
-  padding-right: 16px;
-`;
-const InputRightDecoratorStyle = _styledComponents.default.span`
-  ${decoratorCSS}
-  padding-left: 16px;
-`;
 
 //# sourceMappingURL=InputStyles.js.map

package/dist/cjs/input/InputStyles.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../packages/input/InputStyles.ts"],"sourcesContent":["import styled, { css } from 'styled-components'\nimport { InputMessageVariants, InputVariants, InputColors } from './types'\nimport {\n  labelEmptyValueCSS,\n  labelFocusCSS,\n  labelErrorCSS,\n  InputLabelStyle,\n  labelWarningCSS,\n} from './LabelStyles'\n\nconst statesCSS = css`\n  &:hover {\n    z-index: 1;\n  }\n\n  &:focus-within {\n    z-index: 2;\n    border-color: var(--lido-color-borderActive);\n\n    ${InputLabelStyle} {\n      ${labelFocusCSS}\n    }\n  }\n`\n\nconst activeCSS = css`\n  &,\n  &:hover,\n  &:focus-within {\n    z-index: 2;\n    border-color: var(--lido-color-borderActive);\n\n    ${InputLabelStyle} {\n      ${labelFocusCSS}\n    }\n  }\n`\n\nconst errorCSS = css`\n  &,\n  &:hover,\n  &:focus-within {\n    border-color: var(--lido-color-error);\n\n    ${InputLabelStyle} {\n      ${labelErrorCSS}\n    }\n  }\n`\n\nconst warningCSS = css`\n  &,\n  &:hover,\n  &:focus-within {\n    border-color: var(--lido-color-warning);\n\n    ${InputLabelStyle} {\n      ${labelWarningCSS}\n    }\n  }\n`\n\nconst wrapperColors = {\n  default: css<{ $disabled: boolean }>`\n    background: var(--lido-color-controlBg);\n    border-color: var(--lido-color-border);\n    color: var(--lido-color-text);\n\n    ${({ $disabled }) =>\n      $disabled\n        ? `background: var(--lido-color-background);`\n        : `\n          &:hover {\n            border-color: var(--lido-color-borderHover);\n          }\n    `};\n  `,\n  accent: css<{ $disabled: boolean }>`\n    background: var(--lido-color-accentControlBg);\n    border-color: var(--lido-color-accentBorder);\n    color: var(--lido-color-accentText);\n\n    ${({ $disabled }) =>\n      $disabled\n        ? `background: var(--lido-color-controlBg);`\n        : `\n          &:hover {\n            border-color: var(--lido-color-accentBorderHover);\n          }\n    `};\n  `,\n}\n\nexport const InputWrapperStyle = styled.label<{\n  $error: boolean\n  $warning: boolean\n  $active: boolean\n  $disabled: boolean\n  $fullwidth: boolean\n  $color: InputColors\n}>`\n  position: relative;\n  display: inline-flex;\n  border: 1px solid;\n  border-radius: ${({ theme }) => theme.borderRadiusesMap.lg}px;\n  align-items: stretch;\n  box-sizing: border-box;\n  padding: 0 15px;\n  cursor: ${({ $disabled }) => ($disabled ? 'default' : 'text')};\n  transition: border-color ${({ theme }) => theme.duration.fast} ease;\n  width: ${({ $fullwidth }) => ($fullwidth ? '100%' : 'auto')};\n\n  ${({ $color }) => wrapperColors[$color]};\n  ${({ $disabled }) => ($disabled ? '' : statesCSS)}\n\n  ${({ $active }) => ($active ? activeCSS : '')}\n  ${({ $warning }) => ($warning ? warningCSS : '')}\n  ${({ $error }) => ($error ? errorCSS : '')}\n`\n\nconst contentVariants = {\n  default: css`\n    padding: 17px 0;\n  `,\n  small: css`\n    padding: 9px 0;\n  `,\n}\n\nexport const InputContentStyle = styled.span<{ $variant: InputVariants }>`\n  font-weight: 400;\n  font-size: ${({ theme }) => theme.fontSizesMap.xs}px;\n  display: flex;\n  flex-grow: 1;\n  position: relative;\n\n  ${({ $variant }) => contentVariants[$variant]};\n`\n\nconst labeledCSS = css`\n  &:not(:focus):placeholder-shown {\n    & + ${InputLabelStyle} {\n      ${labelEmptyValueCSS}\n    }\n\n    &::placeholder {\n      opacity: 0;\n    }\n  }\n`\n\nconst inputColors = {\n  default: css`\n    color: var(--lido-color-text);\n\n    &:disabled {\n      color: var(--lido-color-textSecondary);\n    }\n\n    &::placeholder {\n      color: var(--lido-color-textSecondary);\n    }\n\n    &:-webkit-autofill {\n      box-shadow: 0 0 0 100px var(--lido-color-controlBg) inset !important;\n      color: var(--lido-color-text) !important;\n      -webkit-text-fill-color: var(--lido-color-text) !important;\n    }\n\n    &:-internal-autofill-selected {\n      color: var(--lido-color-text) !important;\n      -webkit-text-fill-color: var(--lido-color-text) !important;\n    }\n  `,\n  accent: css`\n    color: var(--lido-color-accentText);\n    opacity: 1;\n\n    &:disabled {\n      color: var(--lido-color-accentText);\n      opacity: 0.5;\n    }\n\n    &::placeholder {\n      color: var(--lido-color-accentText);\n      opacity: 0.5;\n    }\n\n    &:-webkit-autofill {\n      box-shadow: 0 0 0 100px var(--lido-color-accentControlBg) inset !important;\n      color: var(--lido-color-accentContrast) !important;\n      -webkit-text-fill-color: var(--lido-color-accentContrast) !important;\n    }\n\n    &:-internal-autofill-selected {\n      color: var(--lido-color-accentContrast) !important;\n      -webkit-text-fill-color: var(--lido-color-accentContrast) !important;\n    }\n  `,\n}\n\nexport const InputStyle = styled.input<{\n  $labeled: boolean\n  $color: InputColors\n}>`\n  width: 100%;\n  font-family: inherit;\n  font-weight: 400;\n  font-size: 1em;\n  line-height: 1.43em;\n  padding: 0;\n  border-radius: 0;\n  background: transparent;\n  box-shadow: none;\n  border: none;\n  outline: none;\n  position: relative;\n  top: ${({ $labeled }) => ($labeled ? 8 : 0)}px;\n\n  &::placeholder {\n    transition: opacity ${({ theme }) => theme.duration.fast} ease;\n  }\n\n  ${({ $color }) => inputColors[$color]}\n  ${({ $labeled }) => ($labeled ? labeledCSS : '')}\n`\n\nexport const TextareaStyle = styled(InputStyle).attrs({\n  as: 'textarea',\n})`\n  resize: none;\n`\n\nconst messageVariants = {\n  error: css`\n    background: var(--lido-color-error);\n    color: var(--lido-color-errorContrast);\n    box-shadow: ${({ theme }) => theme.boxShadows.sm}\n      var(--lido-color-shadowLight);\n  `,\n  warning: css`\n    background: var(--lido-color-warning);\n    color: var(--lido-color-warningContrast);\n    box-shadow: ${({ theme }) => theme.boxShadows.sm}\n      var(--lido-color-shadowLight);\n  `,\n  success: css`\n    background: var(--lido-color-success);\n    color: var(--lido-color-successContrast);\n    box-shadow: ${({ theme }) => theme.boxShadows.sm}\n      var(--lido-color-shadowLight);\n  `,\n}\n\nexport const InputMessageStyle = styled.span<{\n  $variant: InputMessageVariants\n  $bordered?: boolean\n}>`\n  margin-top: ${({ $bordered }) => ($bordered ? 5 : 6)}px;\n  left: ${({ $bordered }) => ($bordered ? -1 : 0)}px;\n  position: absolute;\n  top: 100%;\n  line-height: 1.6em;\n  font-weight: 400;\n  font-size: ${({ theme }) => theme.fontSizesMap.xxs}px;\n  border-radius: ${({ theme }) => theme.borderRadiusesMap.sm}px;\n  padding: 6px 10px;\n  white-space: nowrap;\n  overflow: hidden;\n  box-sizing: border-box;\n  text-overflow: ellipsis;\n  max-width: ${({ $bordered }) => ($bordered ? 'calc(100% + 2px)' : '100%')};\n\n  ${({ $variant }) => messageVariants[$variant]}\n`\n\nconst decoratorCSS = css`\n  flex-grow: 0;\n  flex-shrink: 0;\n  cursor: inherit;\n  display: flex;\n  align-items: center;\n`\n\nexport const InputLeftDecoratorStyle = styled.span`\n  ${decoratorCSS}\n  padding-right: 16px;\n`\n\nexport const InputRightDecoratorStyle = styled.span`\n  ${decoratorCSS}\n  padding-left: 16px;\n`\n"],"names":["InputWrapperStyle","InputContentStyle","InputStyle","TextareaStyle","InputMessageStyle","InputLeftDecoratorStyle","InputRightDecoratorStyle","statesCSS","css","InputLabelStyle","labelFocusCSS","activeCSS","errorCSS","labelErrorCSS","warningCSS","labelWarningCSS","wrapperColors","default","$disabled","accent","styled","label","theme","borderRadiusesMap","lg","duration","fast","$fullwidth","$color","$active","$warning","$error","contentVariants","small","span","fontSizesMap","xs","$variant","labeledCSS","labelEmptyValueCSS","inputColors","input","$labeled","attrs","as","messageVariants","error","boxShadows","sm","warning","success","$bordered","xxs","decoratorCSS"],"mappings":"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"}
+{"version":3,"sources":["../../../packages/input/InputStyles.ts"],"sourcesContent":["import styled, { css } from 'styled-components'\nimport { InputMessageVariants, InputVariants, InputColors } from './types'\nimport {\n  labelEmptyValueCSS,\n  labelFocusCSS,\n  labelErrorCSS,\n  InputLabelStyle,\n  labelWarningCSS,\n} from './LabelStyles'\n\nconst statesCSS = css`\n  &:hover {\n    z-index: 1;\n  }\n\n  &:focus-within {\n    z-index: 2;\n    border-color: var(--lido-color-borderActive);\n\n    ${InputLabelStyle} {\n      ${labelFocusCSS}\n    }\n  }\n`\n\nconst activeCSS = css`\n  &,\n  &:hover,\n  &:focus-within {\n    z-index: 2;\n    border-color: var(--lido-color-borderActive);\n\n    ${InputLabelStyle} {\n      ${labelFocusCSS}\n    }\n  }\n`\n\nconst errorCSS = css`\n  &,\n  &:hover,\n  &:focus-within {\n    border-color: var(--lido-color-error);\n\n    ${InputLabelStyle} {\n      ${labelErrorCSS}\n    }\n  }\n`\n\nconst warningCSS = css`\n  &,\n  &:hover,\n  &:focus-within {\n    border-color: var(--lido-color-warning);\n\n    ${InputLabelStyle} {\n      ${labelWarningCSS}\n    }\n  }\n`\n\nconst wrapperColors = {\n  default: css<{ $disabled: boolean }>`\n    background: var(--lido-color-controlBg);\n    border-color: var(--lido-color-border);\n    color: var(--lido-color-text);\n\n    ${({ $disabled }) =>\n      $disabled\n        ? `background: var(--lido-color-background);`\n        : `\n          &:hover {\n            border-color: var(--lido-color-borderHover);\n          }\n    `};\n  `,\n  accent: css<{ $disabled: boolean }>`\n    background: var(--lido-color-accentControlBg);\n    border-color: var(--lido-color-accentBorder);\n    color: var(--lido-color-accentText);\n\n    ${({ $disabled }) =>\n      $disabled\n        ? `background: var(--lido-color-controlBg);`\n        : `\n          &:hover {\n            border-color: var(--lido-color-accentBorderHover);\n          }\n    `};\n  `,\n}\n\nconst decoratorCSS = css`\n  flex-grow: 0;\n  flex-shrink: 0;\n  cursor: inherit;\n  display: flex;\n  align-items: center;\n`\n\nexport const InputLeftDecoratorStyle = styled.span`\n  ${decoratorCSS}\n  padding-right: 16px;\n`\n\nexport const InputRightDecoratorStyle = styled.span`\n  ${decoratorCSS}\n  padding-left: 16px;\n`\n\nexport const InputWrapperStyle = styled.label<{\n  $fullwidth: boolean\n  $disabled: boolean\n}>`\n  position: relative;\n  display: inline-flex;\n  align-items: stretch;\n  box-sizing: border-box;\n  cursor: ${({ $disabled }) => ($disabled ? 'default' : 'text')};\n  width: ${({ $fullwidth }) => ($fullwidth ? '100%' : 'auto')};\n`\n\nconst contentVariants = {\n  default: css`\n    padding-top: 17px;\n    padding-bottom: 17px;\n\n    & ${InputLeftDecoratorStyle}, & ${InputRightDecoratorStyle} {\n      margin-top: -17px;\n      margin-bottom: -17px;\n    }\n  `,\n  small: css`\n    padding-top: 9px;\n    padding-bottom: 9px;\n\n    & ${InputLeftDecoratorStyle}, & ${InputRightDecoratorStyle} {\n      padding-top: -9px;\n      padding-bottom: -9px;\n    }\n  `,\n}\n\nexport const InputContentStyle = styled.span<{\n  $error: boolean\n  $warning: boolean\n  $active: boolean\n  $disabled: boolean\n  $color: InputColors\n  $variant: InputVariants\n}>`\n  position: relative;\n  display: flex;\n  flex-grow: 1;\n  padding-left: 15px;\n  padding-right: 15px;\n  font-weight: 400;\n  font-size: ${({ theme }) => theme.fontSizesMap.xs}px;\n  border: 1px solid;\n  border-radius: ${({ theme }) => theme.borderRadiusesMap.lg}px;\n  transition: border-color ${({ theme }) => theme.duration.fast} ease;\n\n  ${({ $variant }) => contentVariants[$variant]};\n  ${({ $color }) => wrapperColors[$color]};\n  ${({ $disabled }) => ($disabled ? '' : statesCSS)};\n  ${({ $active }) => ($active ? activeCSS : '')};\n  ${({ $warning }) => ($warning ? warningCSS : '')};\n  ${({ $error }) => ($error ? errorCSS : '')};\n`\n\nexport const InputControlWrapperStyle = styled.div`\n  position: relative;\n  display: flex;\n  flex-grow: 1;\n`\n\nconst labeledCSS = css`\n  &:not(:focus):placeholder-shown {\n    & + ${InputLabelStyle} {\n      ${labelEmptyValueCSS}\n    }\n\n    &::placeholder {\n      opacity: 0;\n    }\n  }\n`\n\nconst inputColors = {\n  default: css`\n    color: var(--lido-color-text);\n\n    &:disabled {\n      color: var(--lido-color-textSecondary);\n    }\n\n    &::placeholder {\n      color: var(--lido-color-textSecondary);\n    }\n\n    &:-webkit-autofill {\n      box-shadow: 0 0 0 100px var(--lido-color-controlBg) inset !important;\n      color: var(--lido-color-text) !important;\n      -webkit-text-fill-color: var(--lido-color-text) !important;\n    }\n\n    &:-internal-autofill-selected {\n      color: var(--lido-color-text) !important;\n      -webkit-text-fill-color: var(--lido-color-text) !important;\n    }\n  `,\n  accent: css`\n    color: var(--lido-color-accentText);\n    opacity: 1;\n\n    &:disabled {\n      color: var(--lido-color-accentText);\n      opacity: 0.5;\n    }\n\n    &::placeholder {\n      color: var(--lido-color-accentText);\n      opacity: 0.5;\n    }\n\n    &:-webkit-autofill {\n      box-shadow: 0 0 0 100px var(--lido-color-accentControlBg) inset !important;\n      color: var(--lido-color-accentContrast) !important;\n      -webkit-text-fill-color: var(--lido-color-accentContrast) !important;\n    }\n\n    &:-internal-autofill-selected {\n      color: var(--lido-color-accentContrast) !important;\n      -webkit-text-fill-color: var(--lido-color-accentContrast) !important;\n    }\n  `,\n}\n\nexport const InputStyle = styled.input<{\n  $labeled: boolean\n  $color: InputColors\n}>`\n  width: 100%;\n  font-family: inherit;\n  font-weight: 400;\n  font-size: 1em;\n  line-height: 1.43em;\n  padding: 0;\n  border-radius: 0;\n  background: transparent;\n  box-shadow: none;\n  border: none;\n  outline: none;\n  position: relative;\n  top: ${({ $labeled }) => ($labeled ? 8 : 0)}px;\n\n  &::placeholder {\n    transition: opacity ${({ theme }) => theme.duration.fast} ease;\n  }\n\n  ${({ $color }) => inputColors[$color]}\n  ${({ $labeled }) => ($labeled ? labeledCSS : '')}\n`\n\nexport const TextareaStyle = styled(InputStyle).attrs({\n  as: 'textarea',\n})`\n  resize: none;\n`\n\nconst messageVariants = {\n  error: css`\n    background: var(--lido-color-error);\n    color: var(--lido-color-errorContrast);\n    box-shadow: ${({ theme }) => theme.boxShadows.sm}\n      var(--lido-color-shadowLight);\n  `,\n  warning: css`\n    background: var(--lido-color-warning);\n    color: var(--lido-color-warningContrast);\n    box-shadow: ${({ theme }) => theme.boxShadows.sm}\n      var(--lido-color-shadowLight);\n  `,\n  success: css`\n    background: var(--lido-color-success);\n    color: var(--lido-color-successContrast);\n    box-shadow: ${({ theme }) => theme.boxShadows.sm}\n      var(--lido-color-shadowLight);\n  `,\n}\n\nexport const InputMessageStyle = styled.span<{\n  $variant: InputMessageVariants\n  $bordered?: boolean\n}>`\n  margin-top: ${({ $bordered }) => ($bordered ? 5 : 6)}px;\n  left: ${({ $bordered }) => ($bordered ? -1 : 0)}px;\n  position: absolute;\n  top: 100%;\n  line-height: 1.6em;\n  font-weight: 400;\n  font-size: ${({ theme }) => theme.fontSizesMap.xxs}px;\n  border-radius: ${({ theme }) => theme.borderRadiusesMap.sm}px;\n  padding: 6px 10px;\n  white-space: nowrap;\n  overflow: hidden;\n  box-sizing: border-box;\n  text-overflow: ellipsis;\n  max-width: ${({ $bordered }) => ($bordered ? 'calc(100% + 2px)' : '100%')};\n  z-index: 3;\n\n  ${({ $variant }) => messageVariants[$variant]}\n`\n"],"names":["InputLeftDecoratorStyle","InputRightDecoratorStyle","InputWrapperStyle","InputContentStyle","InputControlWrapperStyle","InputStyle","TextareaStyle","InputMessageStyle","statesCSS","css","InputLabelStyle","labelFocusCSS","activeCSS","errorCSS","labelErrorCSS","warningCSS","labelWarningCSS","wrapperColors","default","$disabled","accent","decoratorCSS","styled","span","label","$fullwidth","contentVariants","small","theme","fontSizesMap","xs","borderRadiusesMap","lg","duration","fast","$variant","$color","$active","$warning","$error","div","labeledCSS","labelEmptyValueCSS","inputColors","input","$labeled","attrs","as","messageVariants","error","boxShadows","sm","warning","success","$bordered","xxs"],"mappings":"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"}

package/dist/cjs/input/LabelStyles.js

@@ -76,7 +76,7 @@ const InputLabelStyle = _styledComponents.default.span`
   ${labelFilledValueCSS};
 `;
 const TextareaLabelStyle = (0, _styledComponents.default)(InputLabelStyle)`
-  top: 27px;
+  top: 10px;
 `;
 
 //# sourceMappingURL=LabelStyles.js.map

package/dist/cjs/input/LabelStyles.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../packages/input/LabelStyles.ts"],"sourcesContent":["import styled, { css } from 'styled-components'\nimport { InputColors } from './types'\n\nconst colors = {\n  default: css`\n    color: var(--lido-color-textSecondary);\n  `,\n  accent: css`\n    color: var(--lido-color-accentContrastSecondary);\n  `,\n}\n\nexport const labelEmptyValueCSS = css<{ $color: InputColors }>`\n  ${({ $color }) => colors[$color]}\n\n  transform: scale(1);\n  opacity: 0.5;\n`\n\nexport const labelFilledValueCSS = css<{ $color: InputColors }>`\n  ${({ $color }) => colors[$color]}\n\n  transform: translateY(-14px) scale(0.75);\n  opacity: 1;\n`\n\nexport const labelFocusCSS = css`\n  color: var(--lido-color-primary);\n  opacity: 1;\n`\n\nexport const labelErrorCSS = css`\n  color: var(--lido-color-error);\n`\n\nexport const labelWarningCSS = css`\n  color: var(--lido-color-warning);\n`\n\nexport const InputLabelStyle = styled.span`\n  position: absolute;\n  left: 0;\n  top: 50%;\n  font-size: 1em;\n  line-height: 1.25em;\n  margin: -0.625em 0 0 0;\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  max-width: 100%;\n  color: inherit;\n  transform-origin: 0% 100%;\n  transition: transform ${({ theme }) => theme.duration.fast} ease;\n  transition-property: transform, opacity, color;\n  ${labelFilledValueCSS};\n`\n\nexport const TextareaLabelStyle = styled(InputLabelStyle)`\n  top: 27px;\n`\n"],"names":["labelEmptyValueCSS","labelFilledValueCSS","labelFocusCSS","labelErrorCSS","labelWarningCSS","InputLabelStyle","TextareaLabelStyle","colors","default","css","accent","$color","styled","span","theme","duration","fast"],"mappings":"AAAA;;;;;;;;;;;IAYaA,kBAAkB,MAAlBA,kBAAkB;IAOlBC,mBAAmB,MAAnBA,mBAAmB;IAOnBC,aAAa,MAAbA,aAAa;IAKbC,aAAa,MAAbA,aAAa;IAIbC,eAAe,MAAfA,eAAe;IAIfC,eAAe,MAAfA,eAAe;IAkBfC,kBAAkB,MAAlBA,kBAAkB;;;wEAzDH,mBAAmB;AAG/C,MAAMC,MAAM,GAAG;IACbC,OAAO,EAAEC,IAAAA,iBAAG,IAAA,CAAA,CAAC;;EAEb,CAAC;IACDC,MAAM,EAAED,IAAAA,iBAAG,IAAA,CAAA,CAAC;;EAEZ,CAAC;CACF;AAEM,MAAMT,kBAAkB,GAAGS,IAAAA,iBAAG,IAAA,CAAyB,CAAC;EAC7D,EAAE,SAAgBF;QAAf,EAAEI,MAAM,CAAA,EAAE;WAAKJ,MAAM,CAACI,MAAM,CAAC;AAAD,CAAC,CAAC;;;;AAInC,CAAC;AAEM,MAAMV,mBAAmB,GAAGQ,IAAAA,iBAAG,IAAA,CAAyB,CAAC;EAC9D,EAAE,SAAgBF;QAAf,EAAEI,MAAM,CAAA,EAAE;WAAKJ,MAAM,CAACI,MAAM,CAAC;AAAD,CAAC,CAAC;;;;AAInC,CAAC;AAEM,MAAMT,aAAa,GAAGO,IAAAA,iBAAG,IAAA,CAAA,CAAC;;;AAGjC,CAAC;AAEM,MAAMN,aAAa,GAAGM,IAAAA,iBAAG,IAAA,CAAA,CAAC;;AAEjC,CAAC;AAEM,MAAML,eAAe,GAAGK,IAAAA,iBAAG,IAAA,CAAA,CAAC;;AAEnC,CAAC;AAEM,MAAMJ,eAAe,GAAGO,iBAAM,QAAA,CAACC,IAAI,CAAC;;;;;;;;;;;;;wBAanB,EAAE,SAAeC;QAAd,EAAEA,KAAK,CAAA,EAAE;WAAKA,KAAK,CAACC,QAAQ,CAACC,IAAI;AAAD,CAAC,CAAC;;EAE3D,EAAEf,mBAAmB,CAAC;AACxB,CAAC;AAEM,MAAMK,kBAAkB,GAAGM,IAAAA,iBAAM,QAAA,EAACP,eAAe,CAAC,CAAC;;AAE1D,CAAC"}
+{"version":3,"sources":["../../../packages/input/LabelStyles.ts"],"sourcesContent":["import styled, { css } from 'styled-components'\nimport { InputColors } from './types'\n\nconst colors = {\n  default: css`\n    color: var(--lido-color-textSecondary);\n  `,\n  accent: css`\n    color: var(--lido-color-accentContrastSecondary);\n  `,\n}\n\nexport const labelEmptyValueCSS = css<{ $color: InputColors }>`\n  ${({ $color }) => colors[$color]}\n\n  transform: scale(1);\n  opacity: 0.5;\n`\n\nexport const labelFilledValueCSS = css<{ $color: InputColors }>`\n  ${({ $color }) => colors[$color]}\n\n  transform: translateY(-14px) scale(0.75);\n  opacity: 1;\n`\n\nexport const labelFocusCSS = css`\n  color: var(--lido-color-primary);\n  opacity: 1;\n`\n\nexport const labelErrorCSS = css`\n  color: var(--lido-color-error);\n`\n\nexport const labelWarningCSS = css`\n  color: var(--lido-color-warning);\n`\n\nexport const InputLabelStyle = styled.span`\n  position: absolute;\n  left: 0;\n  top: 50%;\n  font-size: 1em;\n  line-height: 1.25em;\n  margin: -0.625em 0 0 0;\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  max-width: 100%;\n  color: inherit;\n  transform-origin: 0% 100%;\n  transition: transform ${({ theme }) => theme.duration.fast} ease;\n  transition-property: transform, opacity, color;\n  ${labelFilledValueCSS};\n`\n\nexport const TextareaLabelStyle = styled(InputLabelStyle)`\n  top: 10px;\n`\n"],"names":["labelEmptyValueCSS","labelFilledValueCSS","labelFocusCSS","labelErrorCSS","labelWarningCSS","InputLabelStyle","TextareaLabelStyle","colors","default","css","accent","$color","styled","span","theme","duration","fast"],"mappings":"AAAA;;;;;;;;;;;IAYaA,kBAAkB,MAAlBA,kBAAkB;IAOlBC,mBAAmB,MAAnBA,mBAAmB;IAOnBC,aAAa,MAAbA,aAAa;IAKbC,aAAa,MAAbA,aAAa;IAIbC,eAAe,MAAfA,eAAe;IAIfC,eAAe,MAAfA,eAAe;IAkBfC,kBAAkB,MAAlBA,kBAAkB;;;wEAzDH,mBAAmB;AAG/C,MAAMC,MAAM,GAAG;IACbC,OAAO,EAAEC,IAAAA,iBAAG,IAAA,CAAA,CAAC;;EAEb,CAAC;IACDC,MAAM,EAAED,IAAAA,iBAAG,IAAA,CAAA,CAAC;;EAEZ,CAAC;CACF;AAEM,MAAMT,kBAAkB,GAAGS,IAAAA,iBAAG,IAAA,CAAyB,CAAC;EAC7D,EAAE,SAAgBF;QAAf,EAAEI,MAAM,CAAA,EAAE;WAAKJ,MAAM,CAACI,MAAM,CAAC;AAAD,CAAC,CAAC;;;;AAInC,CAAC;AAEM,MAAMV,mBAAmB,GAAGQ,IAAAA,iBAAG,IAAA,CAAyB,CAAC;EAC9D,EAAE,SAAgBF;QAAf,EAAEI,MAAM,CAAA,EAAE;WAAKJ,MAAM,CAACI,MAAM,CAAC;AAAD,CAAC,CAAC;;;;AAInC,CAAC;AAEM,MAAMT,aAAa,GAAGO,IAAAA,iBAAG,IAAA,CAAA,CAAC;;;AAGjC,CAAC;AAEM,MAAMN,aAAa,GAAGM,IAAAA,iBAAG,IAAA,CAAA,CAAC;;AAEjC,CAAC;AAEM,MAAML,eAAe,GAAGK,IAAAA,iBAAG,IAAA,CAAA,CAAC;;AAEnC,CAAC;AAEM,MAAMJ,eAAe,GAAGO,iBAAM,QAAA,CAACC,IAAI,CAAC;;;;;;;;;;;;;wBAanB,EAAE,SAAeC;QAAd,EAAEA,KAAK,CAAA,EAAE;WAAKA,KAAK,CAACC,QAAQ,CAACC,IAAI;AAAD,CAAC,CAAC;;EAE3D,EAAEf,mBAAmB,CAAC;AACxB,CAAC;AAEM,MAAMK,kBAAkB,GAAGM,IAAAA,iBAAM,QAAA,EAACP,eAAe,CAAC,CAAC;;AAE1D,CAAC"}

package/dist/cjs/input/Textarea.js

@@ -27,17 +27,18 @@ function Textarea(props, ref) {
     const hasSuccess = !!success && !error;
     const hasSuccessMessage = hasSuccess && typeof success !== 'boolean';
     return /*#__PURE__*/ _react.default.createElement(_inputStyles.InputWrapperStyle, _extends({
-        $error: hasError,
-        $warning: hasWarning,
-        $active: active,
         $disabled: disabled,
         $fullwidth: fullwidth,
-        $color: color,
         htmlFor: id,
         ref: wrapperRef
     }, wrapperProps), /*#__PURE__*/ _react.default.createElement(_inputStyles.InputContentStyle, {
-        $variant: variant
-    }, /*#__PURE__*/ _react.default.createElement(_inputStyles.TextareaStyle, _extends({
+        $color: color,
+        $variant: variant,
+        $error: hasError,
+        $warning: hasWarning,
+        $active: active,
+        $disabled: disabled
+    }, /*#__PURE__*/ _react.default.createElement(_inputStyles.InputControlWrapperStyle, null, /*#__PURE__*/ _react.default.createElement(_inputStyles.TextareaStyle, _extends({
         $labeled: hasLabel,
         $color: color,
         placeholder: placeholder,
@@ -45,7 +46,7 @@ function Textarea(props, ref) {
         ref: ref
     }, rest)), hasLabel && /*#__PURE__*/ _react.default.createElement(_labelStyles.TextareaLabelStyle, {
         $color: color
-    }, label)), hasErrorMessage && /*#__PURE__*/ _react.default.createElement(_inputStyles.InputMessageStyle, {
+    }, label))), hasErrorMessage && /*#__PURE__*/ _react.default.createElement(_inputStyles.InputMessageStyle, {
         $variant: "error",
         $bordered: true
     }, error), hasWarningMessage && /*#__PURE__*/ _react.default.createElement(_inputStyles.InputMessageStyle, {

package/dist/cjs/input/Textarea.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../packages/input/Textarea.tsx"],"sourcesContent":["import React, { ForwardedRef, forwardRef } from 'react'\nimport {\n  InputWrapperStyle,\n  InputContentStyle,\n  TextareaStyle,\n  InputMessageStyle,\n} from './InputStyles'\nimport { TextareaLabelStyle } from './LabelStyles'\nimport { TextareaProps } from './types'\n\nfunction Textarea(props: TextareaProps, ref?: ForwardedRef<HTMLInputElement>) {\n  const {\n    label,\n    error,\n    warning,\n    success,\n    active = false,\n    fullwidth = false,\n    placeholder = ' ',\n    className,\n    style,\n    variant = 'default',\n    color = 'default',\n    wrapperRef,\n    children,\n    ...rest\n  } = props\n\n  const { id, disabled = false } = props\n  const wrapperProps = { className, style }\n\n  const hasLabel = !!label && variant === 'default'\n\n  const hasError = !!error\n  const hasErrorMessage = hasError && typeof error !== 'boolean'\n  const hasWarning = !hasError && !!warning // `error` overrides `warning`\n  const hasWarningMessage = hasWarning && typeof warning !== 'boolean'\n  const hasSuccess = !!success && !error\n  const hasSuccessMessage = hasSuccess && typeof success !== 'boolean'\n\n  return (\n    <InputWrapperStyle\n      $error={hasError}\n      $warning={hasWarning}\n      $active={active}\n      $disabled={disabled}\n      $fullwidth={fullwidth}\n      $color={color}\n      htmlFor={id}\n      ref={wrapperRef}\n      {...wrapperProps}\n    >\n      <InputContentStyle $variant={variant}>\n        <TextareaStyle\n          $labeled={hasLabel}\n          $color={color}\n          placeholder={placeholder}\n          aria-invalid={hasError}\n          ref={ref}\n          {...rest}\n        />\n        {hasLabel && (\n          <TextareaLabelStyle $color={color}>{label}</TextareaLabelStyle>\n        )}\n      </InputContentStyle>\n\n      {hasErrorMessage && (\n        <InputMessageStyle $variant='error' $bordered>\n          {error}\n        </InputMessageStyle>\n      )}\n      {hasWarningMessage && (\n        <InputMessageStyle $variant='warning' $bordered>\n          {warning}\n        </InputMessageStyle>\n      )}\n      {hasSuccessMessage && (\n        <InputMessageStyle $variant='success' $bordered>\n          {success}\n        </InputMessageStyle>\n      )}\n    </InputWrapperStyle>\n  )\n}\n\nexport default forwardRef(Textarea)\n"],"names":["Textarea","props","ref","label","error","warning","success","active","fullwidth","placeholder","className","style","variant","color","wrapperRef","children","rest","id","disabled","wrapperProps","hasLabel","hasError","hasErrorMessage","hasWarning","hasWarningMessage","hasSuccess","hasSuccessMessage","InputWrapperStyle","$error","$warning","$active","$disabled","$fullwidth","$color","htmlFor","InputContentStyle","$variant","TextareaStyle","$labeled","aria-invalid","TextareaLabelStyle","InputMessageStyle","$bordered","forwardRef"],"mappings":"AAAA;;;;+BAqFA,SAAmC;;aAAnC,QAAmC;;;;6DArFa,OAAO;6BAMhD,eAAe;6BACa,eAAe;AAGlD,SAASA,QAAQ,CAACC,KAAoB,EAAEC,GAAoC,EAAE;IAC5E,MAAM,EACJC,KAAK,CAAA,EACLC,KAAK,CAAA,EACLC,OAAO,CAAA,EACPC,OAAO,CAAA,EACPC,MAAM,EAAG,KAAK,CAAA,EACdC,SAAS,EAAG,KAAK,CAAA,EACjBC,WAAW,EAAG,GAAG,CAAA,EACjBC,SAAS,CAAA,EACTC,KAAK,CAAA,EACLC,OAAO,EAAG,SAAS,CAAA,EACnBC,KAAK,EAAG,SAAS,CAAA,EACjBC,UAAU,CAAA,EACVC,QAAQ,CAAA,EACR,GAAGC,IAAI,EACR,GAAGf,KAAK;IAET,MAAM,EAAEgB,EAAE,CAAA,EAAEC,QAAQ,EAAG,KAAK,CAAA,EAAE,GAAGjB,KAAK;IACtC,MAAMkB,YAAY,GAAG;QAAET,SAAS;QAAEC,KAAK;KAAE;IAEzC,MAAMS,QAAQ,GAAG,CAAC,CAACjB,KAAK,IAAIS,OAAO,KAAK,SAAS;IAEjD,MAAMS,QAAQ,GAAG,CAAC,CAACjB,KAAK;IACxB,MAAMkB,eAAe,GAAGD,QAAQ,IAAI,OAAOjB,KAAK,KAAK,SAAS;IAC9D,MAAMmB,UAAU,GAAG,CAACF,QAAQ,IAAI,CAAC,CAAChB,OAAO,CAAC,8BAA8B;IAA/B;IACzC,MAAMmB,iBAAiB,GAAGD,UAAU,IAAI,OAAOlB,OAAO,KAAK,SAAS;IACpE,MAAMoB,UAAU,GAAG,CAAC,CAACnB,OAAO,IAAI,CAACF,KAAK;IACtC,MAAMsB,iBAAiB,GAAGD,UAAU,IAAI,OAAOnB,OAAO,KAAK,SAAS;IAEpE,qBACE,6BAACqB,YAAiB,kBAAA;QAChBC,MAAM,EAAEP,QAAQ;QAChBQ,QAAQ,EAAEN,UAAU;QACpBO,OAAO,EAAEvB,MAAM;QACfwB,SAAS,EAAEb,QAAQ;QACnBc,UAAU,EAAExB,SAAS;QACrByB,MAAM,EAAEpB,KAAK;QACbqB,OAAO,EAAEjB,EAAE;QACXf,GAAG,EAAEY,UAAU;OACXK,YAAY,iBAEhB,6BAACgB,YAAiB,kBAAA;QAACC,QAAQ,EAAExB,OAAO;qBAClC,6BAACyB,YAAa,cAAA;QACZC,QAAQ,EAAElB,QAAQ;QAClBa,MAAM,EAAEpB,KAAK;QACbJ,WAAW,EAAEA,WAAW;QACxB8B,cAAY,EAAElB,QAAQ;QACtBnB,GAAG,EAAEA,GAAG;OACJc,IAAI,EACR,EACDI,QAAQ,kBACP,6BAACoB,YAAkB,mBAAA;QAACP,MAAM,EAAEpB,KAAK;OAAGV,KAAK,CAAsB,AAChE,CACiB,EAEnBmB,eAAe,kBACd,6BAACmB,YAAiB,kBAAA;QAACL,QAAQ,EAAC,OAAO;QAACM,SAAS,EAATA,IAAS;OAC1CtC,KAAK,CACY,AACrB,EACAoB,iBAAiB,kBAChB,6BAACiB,YAAiB,kBAAA;QAACL,QAAQ,EAAC,SAAS;QAACM,SAAS,EAATA,IAAS;OAC5CrC,OAAO,CACU,AACrB,EACAqB,iBAAiB,kBAChB,6BAACe,YAAiB,kBAAA;QAACL,QAAQ,EAAC,SAAS;QAACM,SAAS,EAATA,IAAS;OAC5CpC,OAAO,CACU,AACrB,CACiB,CACrB;AACH,CAAC;MAED,QAAmC,iBAApBqC,IAAAA,MAAU,WAAA,EAAC3C,QAAQ,CAAC"}
+{"version":3,"sources":["../../../packages/input/Textarea.tsx"],"sourcesContent":["import React, { ForwardedRef, forwardRef } from 'react'\nimport {\n  InputWrapperStyle,\n  InputContentStyle,\n  TextareaStyle,\n  InputMessageStyle,\n  InputControlWrapperStyle,\n} from './InputStyles'\nimport { TextareaLabelStyle } from './LabelStyles'\nimport { TextareaProps } from './types'\n\nfunction Textarea(props: TextareaProps, ref?: ForwardedRef<HTMLInputElement>) {\n  const {\n    label,\n    error,\n    warning,\n    success,\n    active = false,\n    fullwidth = false,\n    placeholder = ' ',\n    className,\n    style,\n    variant = 'default',\n    color = 'default',\n    wrapperRef,\n    children,\n    ...rest\n  } = props\n\n  const { id, disabled = false } = props\n  const wrapperProps = { className, style }\n\n  const hasLabel = !!label && variant === 'default'\n\n  const hasError = !!error\n  const hasErrorMessage = hasError && typeof error !== 'boolean'\n  const hasWarning = !hasError && !!warning // `error` overrides `warning`\n  const hasWarningMessage = hasWarning && typeof warning !== 'boolean'\n  const hasSuccess = !!success && !error\n  const hasSuccessMessage = hasSuccess && typeof success !== 'boolean'\n\n  return (\n    <InputWrapperStyle\n      $disabled={disabled}\n      $fullwidth={fullwidth}\n      htmlFor={id}\n      ref={wrapperRef}\n      {...wrapperProps}\n    >\n      <InputContentStyle\n        $color={color}\n        $variant={variant}\n        $error={hasError}\n        $warning={hasWarning}\n        $active={active}\n        $disabled={disabled}\n      >\n        <InputControlWrapperStyle>\n          <TextareaStyle\n            $labeled={hasLabel}\n            $color={color}\n            placeholder={placeholder}\n            aria-invalid={hasError}\n            ref={ref}\n            {...rest}\n          />\n          {hasLabel && (\n            <TextareaLabelStyle $color={color}>{label}</TextareaLabelStyle>\n          )}\n        </InputControlWrapperStyle>\n      </InputContentStyle>\n\n      {hasErrorMessage && (\n        <InputMessageStyle $variant='error' $bordered>\n          {error}\n        </InputMessageStyle>\n      )}\n      {hasWarningMessage && (\n        <InputMessageStyle $variant='warning' $bordered>\n          {warning}\n        </InputMessageStyle>\n      )}\n      {hasSuccessMessage && (\n        <InputMessageStyle $variant='success' $bordered>\n          {success}\n        </InputMessageStyle>\n      )}\n    </InputWrapperStyle>\n  )\n}\n\nexport default forwardRef(Textarea)\n"],"names":["Textarea","props","ref","label","error","warning","success","active","fullwidth","placeholder","className","style","variant","color","wrapperRef","children","rest","id","disabled","wrapperProps","hasLabel","hasError","hasErrorMessage","hasWarning","hasWarningMessage","hasSuccess","hasSuccessMessage","InputWrapperStyle","$disabled","$fullwidth","htmlFor","InputContentStyle","$color","$variant","$error","$warning","$active","InputControlWrapperStyle","TextareaStyle","$labeled","aria-invalid","TextareaLabelStyle","InputMessageStyle","$bordered","forwardRef"],"mappings":"AAAA;;;;+BA2FA,SAAmC;;aAAnC,QAAmC;;;;6DA3Fa,OAAO;6BAOhD,eAAe;6BACa,eAAe;AAGlD,SAASA,QAAQ,CAACC,KAAoB,EAAEC,GAAoC,EAAE;IAC5E,MAAM,EACJC,KAAK,CAAA,EACLC,KAAK,CAAA,EACLC,OAAO,CAAA,EACPC,OAAO,CAAA,EACPC,MAAM,EAAG,KAAK,CAAA,EACdC,SAAS,EAAG,KAAK,CAAA,EACjBC,WAAW,EAAG,GAAG,CAAA,EACjBC,SAAS,CAAA,EACTC,KAAK,CAAA,EACLC,OAAO,EAAG,SAAS,CAAA,EACnBC,KAAK,EAAG,SAAS,CAAA,EACjBC,UAAU,CAAA,EACVC,QAAQ,CAAA,EACR,GAAGC,IAAI,EACR,GAAGf,KAAK;IAET,MAAM,EAAEgB,EAAE,CAAA,EAAEC,QAAQ,EAAG,KAAK,CAAA,EAAE,GAAGjB,KAAK;IACtC,MAAMkB,YAAY,GAAG;QAAET,SAAS;QAAEC,KAAK;KAAE;IAEzC,MAAMS,QAAQ,GAAG,CAAC,CAACjB,KAAK,IAAIS,OAAO,KAAK,SAAS;IAEjD,MAAMS,QAAQ,GAAG,CAAC,CAACjB,KAAK;IACxB,MAAMkB,eAAe,GAAGD,QAAQ,IAAI,OAAOjB,KAAK,KAAK,SAAS;IAC9D,MAAMmB,UAAU,GAAG,CAACF,QAAQ,IAAI,CAAC,CAAChB,OAAO,CAAC,8BAA8B;IAA/B;IACzC,MAAMmB,iBAAiB,GAAGD,UAAU,IAAI,OAAOlB,OAAO,KAAK,SAAS;IACpE,MAAMoB,UAAU,GAAG,CAAC,CAACnB,OAAO,IAAI,CAACF,KAAK;IACtC,MAAMsB,iBAAiB,GAAGD,UAAU,IAAI,OAAOnB,OAAO,KAAK,SAAS;IAEpE,qBACE,6BAACqB,YAAiB,kBAAA;QAChBC,SAAS,EAAEV,QAAQ;QACnBW,UAAU,EAAErB,SAAS;QACrBsB,OAAO,EAAEb,EAAE;QACXf,GAAG,EAAEY,UAAU;OACXK,YAAY,iBAEhB,6BAACY,YAAiB,kBAAA;QAChBC,MAAM,EAAEnB,KAAK;QACboB,QAAQ,EAAErB,OAAO;QACjBsB,MAAM,EAAEb,QAAQ;QAChBc,QAAQ,EAAEZ,UAAU;QACpBa,OAAO,EAAE7B,MAAM;QACfqB,SAAS,EAAEV,QAAQ;qBAEnB,6BAACmB,YAAwB,yBAAA,sBACvB,6BAACC,YAAa,cAAA;QACZC,QAAQ,EAAEnB,QAAQ;QAClBY,MAAM,EAAEnB,KAAK;QACbJ,WAAW,EAAEA,WAAW;QACxB+B,cAAY,EAAEnB,QAAQ;QACtBnB,GAAG,EAAEA,GAAG;OACJc,IAAI,EACR,EACDI,QAAQ,kBACP,6BAACqB,YAAkB,mBAAA;QAACT,MAAM,EAAEnB,KAAK;OAAGV,KAAK,CAAsB,AAChE,CACwB,CACT,EAEnBmB,eAAe,kBACd,6BAACoB,YAAiB,kBAAA;QAACT,QAAQ,EAAC,OAAO;QAACU,SAAS,EAATA,IAAS;OAC1CvC,KAAK,CACY,AACrB,EACAoB,iBAAiB,kBAChB,6BAACkB,YAAiB,kBAAA;QAACT,QAAQ,EAAC,SAAS;QAACU,SAAS,EAATA,IAAS;OAC5CtC,OAAO,CACU,AACrB,EACAqB,iBAAiB,kBAChB,6BAACgB,YAAiB,kBAAA;QAACT,QAAQ,EAAC,SAAS;QAACU,SAAS,EAATA,IAAS;OAC5CrC,OAAO,CACU,AACrB,CACiB,CACrB;AACH,CAAC;MAED,QAAmC,iBAApBsC,IAAAA,MAAU,WAAA,EAAC5C,QAAQ,CAAC"}

package/dist/esm/input/Input.js

@@ -1,6 +1,6 @@
 import _extends from "@swc/helpers/src/_extends.mjs";
 import React, { forwardRef } from "react";
-import { InputWrapperStyle, InputContentStyle, InputStyle, InputLeftDecoratorStyle, InputRightDecoratorStyle, InputMessageStyle } from "./InputStyles";
+import { InputWrapperStyle, InputContentStyle, InputControlWrapperStyle, InputStyle, InputLeftDecoratorStyle, InputRightDecoratorStyle, InputMessageStyle } from "./InputStyles";
 import { InputLabelStyle } from "./LabelStyles";
 function Input(props, ref) {
     const { label , error , warning , success , active =false , fullwidth =false , placeholder =' ' , leftDecorator , rightDecorator , className , style , variant ='default' , color ='default' , wrapperRef , children , ...rest } = props;
@@ -20,17 +20,18 @@ function Input(props, ref) {
     const hasLeftDecorator = !!leftDecorator;
     const hasRightDecorator = !!rightDecorator;
     return /*#__PURE__*/ React.createElement(InputWrapperStyle, _extends({
-        $error: hasError,
-        $warning: hasWarning,
-        $active: active,
         $disabled: disabled,
         $fullwidth: fullwidth,
-        $color: color,
         htmlFor: id,
         ref: wrapperRef
-    }, wrapperProps), hasLeftDecorator && /*#__PURE__*/ React.createElement(InputLeftDecoratorStyle, null, leftDecorator), /*#__PURE__*/ React.createElement(InputContentStyle, {
-        $variant: variant
-    }, /*#__PURE__*/ React.createElement(InputStyle, _extends({
+    }, wrapperProps), /*#__PURE__*/ React.createElement(InputContentStyle, {
+        $color: color,
+        $variant: variant,
+        $error: hasError,
+        $warning: hasWarning,
+        $active: active,
+        $disabled: disabled
+    }, hasLeftDecorator && /*#__PURE__*/ React.createElement(InputLeftDecoratorStyle, null, leftDecorator), /*#__PURE__*/ React.createElement(InputControlWrapperStyle, null, /*#__PURE__*/ React.createElement(InputStyle, _extends({
         $labeled: hasLabel,
         $color: color,
         placeholder: placeholder,
@@ -39,7 +40,7 @@ function Input(props, ref) {
         ref: ref
     }, rest)), hasLabel && /*#__PURE__*/ React.createElement(InputLabelStyle, {
         $color: color
-    }, label)), hasErrorMessage && /*#__PURE__*/ React.createElement(InputMessageStyle, {
+    }, label)), hasRightDecorator && /*#__PURE__*/ React.createElement(InputRightDecoratorStyle, null, rightDecorator)), hasErrorMessage && /*#__PURE__*/ React.createElement(InputMessageStyle, {
         $variant: "error",
         $bordered: true
     }, error), hasWarningMessage && /*#__PURE__*/ React.createElement(InputMessageStyle, {
@@ -48,7 +49,7 @@ function Input(props, ref) {
     }, warning), hasSuccessMessage && /*#__PURE__*/ React.createElement(InputMessageStyle, {
         $variant: "success",
         $bordered: true
-    }, success), hasRightDecorator && /*#__PURE__*/ React.createElement(InputRightDecoratorStyle, null, rightDecorator));
+    }, success));
 }
 export default /*#__PURE__*/ forwardRef(Input);
 

package/dist/esm/input/Input.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../packages/input/Input.tsx"],"sourcesContent":["import React, { ForwardedRef, forwardRef } from 'react'\nimport {\n  InputWrapperStyle,\n  InputContentStyle,\n  InputStyle,\n  InputLeftDecoratorStyle,\n  InputRightDecoratorStyle,\n  InputMessageStyle,\n} from './InputStyles'\nimport { InputLabelStyle } from './LabelStyles'\nimport { InputProps } from './types'\n\nfunction Input(props: InputProps, ref?: ForwardedRef<HTMLInputElement>) {\n  const {\n    label,\n    error,\n    warning,\n    success,\n    active = false,\n    fullwidth = false,\n    placeholder = ' ',\n    leftDecorator,\n    rightDecorator,\n    className,\n    style,\n    variant = 'default',\n    color = 'default',\n    wrapperRef,\n    children,\n    ...rest\n  } = props\n\n  const { id, disabled = false } = props\n  const wrapperProps = { className, style }\n\n  const hasLabel = !!label && variant === 'default'\n\n  const hasError = !!error\n  const hasErrorMessage = hasError && typeof error !== 'boolean'\n  const hasWarning = !hasError && !!warning // `error` overrides `warning`\n  const hasWarningMessage = hasWarning && typeof warning !== 'boolean'\n  const hasSuccess = !!success && !error\n  const hasSuccessMessage = hasSuccess && typeof success !== 'boolean'\n\n  const hasLeftDecorator = !!leftDecorator\n  const hasRightDecorator = !!rightDecorator\n\n  return (\n    <InputWrapperStyle\n      $error={hasError}\n      $warning={hasWarning}\n      $active={active}\n      $disabled={disabled}\n      $fullwidth={fullwidth}\n      $color={color}\n      htmlFor={id}\n      ref={wrapperRef}\n      {...wrapperProps}\n    >\n      {hasLeftDecorator && (\n        <InputLeftDecoratorStyle>{leftDecorator}</InputLeftDecoratorStyle>\n      )}\n\n      <InputContentStyle $variant={variant}>\n        <InputStyle\n          $labeled={hasLabel}\n          $color={color}\n          placeholder={placeholder}\n          aria-invalid={hasError}\n          type='text'\n          ref={ref}\n          {...rest}\n        />\n        {hasLabel && <InputLabelStyle $color={color}>{label}</InputLabelStyle>}\n      </InputContentStyle>\n\n      {hasErrorMessage && (\n        <InputMessageStyle $variant='error' $bordered>\n          {error}\n        </InputMessageStyle>\n      )}\n      {hasWarningMessage && (\n        <InputMessageStyle $variant='warning' $bordered>\n          {warning}\n        </InputMessageStyle>\n      )}\n      {hasSuccessMessage && (\n        <InputMessageStyle $variant='success' $bordered>\n          {success}\n        </InputMessageStyle>\n      )}\n\n      {hasRightDecorator && (\n        <InputRightDecoratorStyle>{rightDecorator}</InputRightDecoratorStyle>\n      )}\n    </InputWrapperStyle>\n  )\n}\n\nexport default forwardRef(Input)\n"],"names":["React","forwardRef","InputWrapperStyle","InputContentStyle","InputStyle","InputLeftDecoratorStyle","InputRightDecoratorStyle","InputMessageStyle","InputLabelStyle","Input","props","ref","label","error","warning","success","active","fullwidth","placeholder","leftDecorator","rightDecorator","className","style","variant","color","wrapperRef","children","rest","id","disabled","wrapperProps","hasLabel","hasError","hasErrorMessage","hasWarning","hasWarningMessage","hasSuccess","hasSuccessMessage","hasLeftDecorator","hasRightDecorator","$error","$warning","$active","$disabled","$fullwidth","$color","htmlFor","$variant","$labeled","aria-invalid","type","$bordered"],"mappings":"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"}
+{"version":3,"sources":["../../../packages/input/Input.tsx"],"sourcesContent":["import React, { ForwardedRef, forwardRef } from 'react'\nimport {\n  InputWrapperStyle,\n  InputContentStyle,\n  InputControlWrapperStyle,\n  InputStyle,\n  InputLeftDecoratorStyle,\n  InputRightDecoratorStyle,\n  InputMessageStyle,\n} from './InputStyles'\nimport { InputLabelStyle } from './LabelStyles'\nimport { InputProps } from './types'\n\nfunction Input(props: InputProps, ref?: ForwardedRef<HTMLInputElement>) {\n  const {\n    label,\n    error,\n    warning,\n    success,\n    active = false,\n    fullwidth = false,\n    placeholder = ' ',\n    leftDecorator,\n    rightDecorator,\n    className,\n    style,\n    variant = 'default',\n    color = 'default',\n    wrapperRef,\n    children,\n    ...rest\n  } = props\n\n  const { id, disabled = false } = props\n  const wrapperProps = { className, style }\n\n  const hasLabel = !!label && variant === 'default'\n\n  const hasError = !!error\n  const hasErrorMessage = hasError && typeof error !== 'boolean'\n  const hasWarning = !hasError && !!warning // `error` overrides `warning`\n  const hasWarningMessage = hasWarning && typeof warning !== 'boolean'\n  const hasSuccess = !!success && !error\n  const hasSuccessMessage = hasSuccess && typeof success !== 'boolean'\n\n  const hasLeftDecorator = !!leftDecorator\n  const hasRightDecorator = !!rightDecorator\n\n  return (\n    <InputWrapperStyle\n      $disabled={disabled}\n      $fullwidth={fullwidth}\n      htmlFor={id}\n      ref={wrapperRef}\n      {...wrapperProps}\n    >\n      <InputContentStyle\n        $color={color}\n        $variant={variant}\n        $error={hasError}\n        $warning={hasWarning}\n        $active={active}\n        $disabled={disabled}\n      >\n        {hasLeftDecorator && (\n          <InputLeftDecoratorStyle>{leftDecorator}</InputLeftDecoratorStyle>\n        )}\n\n        <InputControlWrapperStyle>\n          <InputStyle\n            $labeled={hasLabel}\n            $color={color}\n            placeholder={placeholder}\n            aria-invalid={hasError}\n            type='text'\n            ref={ref}\n            {...rest}\n          />\n          {hasLabel && (\n            <InputLabelStyle $color={color}>{label}</InputLabelStyle>\n          )}\n        </InputControlWrapperStyle>\n\n        {hasRightDecorator && (\n          <InputRightDecoratorStyle>{rightDecorator}</InputRightDecoratorStyle>\n        )}\n      </InputContentStyle>\n\n      {hasErrorMessage && (\n        <InputMessageStyle $variant='error' $bordered>\n          {error}\n        </InputMessageStyle>\n      )}\n      {hasWarningMessage && (\n        <InputMessageStyle $variant='warning' $bordered>\n          {warning}\n        </InputMessageStyle>\n      )}\n      {hasSuccessMessage && (\n        <InputMessageStyle $variant='success' $bordered>\n          {success}\n        </InputMessageStyle>\n      )}\n    </InputWrapperStyle>\n  )\n}\n\nexport default forwardRef(Input)\n"],"names":["React","forwardRef","InputWrapperStyle","InputContentStyle","InputControlWrapperStyle","InputStyle","InputLeftDecoratorStyle","InputRightDecoratorStyle","InputMessageStyle","InputLabelStyle","Input","props","ref","label","error","warning","success","active","fullwidth","placeholder","leftDecorator","rightDecorator","className","style","variant","color","wrapperRef","children","rest","id","disabled","wrapperProps","hasLabel","hasError","hasErrorMessage","hasWarning","hasWarningMessage","hasSuccess","hasSuccessMessage","hasLeftDecorator","hasRightDecorator","$disabled","$fullwidth","htmlFor","$color","$variant","$error","$warning","$active","$labeled","aria-invalid","type","$bordered"],"mappings":"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"}

package/dist/esm/input/InputGroupStyles.js

@@ -1,4 +1,5 @@
 import styled from "styled-components";
+import { InputWrapperStyle, InputContentStyle } from "./InputStyles";
 export const InputGroupStyle = styled.span`
   display: inline-flex;
   position: relative;
@@ -11,31 +12,22 @@ export const InputGroupContentStyle = styled.span`
   display: flex;
   width: 100%;
 
-  & > * {
-    border-radius: 0px;
+  & > ${InputWrapperStyle} {
     margin: 0 -1px 0 0;
 
     &:first-child {
-      border-top-left-radius: ${(param)=>{
-    let { theme  } = param;
-    return theme.borderRadiusesMap.lg;
-}}px;
-      border-bottom-left-radius: ${(param)=>{
-    let { theme  } = param;
-    return theme.borderRadiusesMap.lg;
-}}px;
+      & ${InputContentStyle} {
+        border-top-right-radius: 0;
+        border-bottom-right-radius: 0;
+      }
     }
 
     &:last-child {
-      margin-right: 0;
-      border-top-right-radius: ${(param)=>{
-    let { theme  } = param;
-    return theme.borderRadiusesMap.lg;
-}}px;
-      border-bottom-right-radius: ${(param)=>{
-    let { theme  } = param;
-    return theme.borderRadiusesMap.lg;
-}}px;
+      & ${InputContentStyle} {
+        margin-right: 0;
+        border-top-left-radius: 0;
+        border-bottom-left-radius: 0;
+      }
     }
   }
 `;

package/dist/esm/input/InputGroupStyles.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../packages/input/InputGroupStyles.ts"],"sourcesContent":["import styled from 'styled-components'\n\nexport const InputGroupStyle = styled.span<{ $fullwidth: boolean }>`\n  display: inline-flex;\n  position: relative;\n  width: ${({ $fullwidth }) => ($fullwidth ? '100%' : 'auto')};\n`\n\nexport const InputGroupContentStyle = styled.span`\n  display: flex;\n  width: 100%;\n\n  & > * {\n    border-radius: 0px;\n    margin: 0 -1px 0 0;\n\n    &:first-child {\n      border-top-left-radius: ${({ theme }) => theme.borderRadiusesMap.lg}px;\n      border-bottom-left-radius: ${({ theme }) => theme.borderRadiusesMap.lg}px;\n    }\n\n    &:last-child {\n      margin-right: 0;\n      border-top-right-radius: ${({ theme }) => theme.borderRadiusesMap.lg}px;\n      border-bottom-right-radius: ${({ theme }) =>\n        theme.borderRadiusesMap.lg}px;\n    }\n  }\n`\n"],"names":["styled","InputGroupStyle","span","$fullwidth","InputGroupContentStyle","theme","borderRadiusesMap","lg"],"mappings":"AAAA,OAAOA,MAAM,MAAM,mBAAmB,CAAA;AAEtC,OAAO,MAAMC,eAAe,GAAGD,MAAM,CAACE,IAAI,AAAyB,CAAC;;;SAG3D,EAAE,SAAoB;QAAnB,EAAEC,UAAU,CAAA,EAAE;WAAMA,UAAU,GAAG,MAAM,GAAG,MAAM;AAAA,CAAC,CAAC;AAC9D,CAAC,CAAA;AAED,OAAO,MAAMC,sBAAsB,GAAGJ,MAAM,CAACE,IAAI,CAAC;;;;;;;;;8BASpB,EAAE,SAAeG;QAAd,EAAEA,KAAK,CAAA,EAAE;WAAKA,KAAK,CAACC,iBAAiB,CAACC,EAAE;AAAD,CAAC,CAAC;iCACzC,EAAE,SAAeF;QAAd,EAAEA,KAAK,CAAA,EAAE;WAAKA,KAAK,CAACC,iBAAiB,CAACC,EAAE;AAAD,CAAC,CAAC;;;;;+BAK9C,EAAE,SAAeF;QAAd,EAAEA,KAAK,CAAA,EAAE;WAAKA,KAAK,CAACC,iBAAiB,CAACC,EAAE;AAAD,CAAC,CAAC;kCACzC,EAAE,SAC5BF;QAD6B,EAAEA,KAAK,CAAA,EAAE;WACtCA,KAAK,CAACC,iBAAiB,CAACC,EAAE;AAAD,CAAC,CAAC;;;AAGnC,CAAC,CAAA"}
+{"version":3,"sources":["../../../packages/input/InputGroupStyles.ts"],"sourcesContent":["import styled from 'styled-components'\nimport { InputWrapperStyle, InputContentStyle } from './InputStyles'\n\nexport const InputGroupStyle = styled.span<{ $fullwidth: boolean }>`\n  display: inline-flex;\n  position: relative;\n  width: ${({ $fullwidth }) => ($fullwidth ? '100%' : 'auto')};\n`\n\nexport const InputGroupContentStyle = styled.span`\n  display: flex;\n  width: 100%;\n\n  & > ${InputWrapperStyle} {\n    margin: 0 -1px 0 0;\n\n    &:first-child {\n      & ${InputContentStyle} {\n        border-top-right-radius: 0;\n        border-bottom-right-radius: 0;\n      }\n    }\n\n    &:last-child {\n      & ${InputContentStyle} {\n        margin-right: 0;\n        border-top-left-radius: 0;\n        border-bottom-left-radius: 0;\n      }\n    }\n  }\n`\n"],"names":["styled","InputWrapperStyle","InputContentStyle","InputGroupStyle","span","$fullwidth","InputGroupContentStyle"],"mappings":"AAAA,OAAOA,MAAM,MAAM,mBAAmB,CAAA;AACtC,SAASC,iBAAiB,EAAEC,iBAAiB,QAAQ,eAAe,CAAA;AAEpE,OAAO,MAAMC,eAAe,GAAGH,MAAM,CAACI,IAAI,AAAyB,CAAC;;;SAG3D,EAAE,SAAoB;QAAnB,EAAEC,UAAU,CAAA,EAAE;WAAMA,UAAU,GAAG,MAAM,GAAG,MAAM;AAAA,CAAC,CAAC;AAC9D,CAAC,CAAA;AAED,OAAO,MAAMC,sBAAsB,GAAGN,MAAM,CAACI,IAAI,CAAC;;;;MAI5C,EAAEH,iBAAiB,CAAC;;;;QAIlB,EAAEC,iBAAiB,CAAC;;;;;;;QAOpB,EAAEA,iBAAiB,CAAC;;;;;;;AAO5B,CAAC,CAAA"}

package/dist/esm/input/InputStyles.js

@@ -78,30 +78,80 @@ const wrapperColors = {
     }};
   `
 };
+const decoratorCSS = css`
+  flex-grow: 0;
+  flex-shrink: 0;
+  cursor: inherit;
+  display: flex;
+  align-items: center;
+`;
+export const InputLeftDecoratorStyle = styled.span`
+  ${decoratorCSS}
+  padding-right: 16px;
+`;
+export const InputRightDecoratorStyle = styled.span`
+  ${decoratorCSS}
+  padding-left: 16px;
+`;
 export const InputWrapperStyle = styled.label`
   position: relative;
   display: inline-flex;
-  border: 1px solid;
-  border-radius: ${(param)=>{
-    let { theme  } = param;
-    return theme.borderRadiusesMap.lg;
-}}px;
   align-items: stretch;
   box-sizing: border-box;
-  padding: 0 15px;
   cursor: ${(param)=>{
     let { $disabled  } = param;
     return $disabled ? 'default' : 'text';
 }};
-  transition: border-color ${(param)=>{
-    let { theme  } = param;
-    return theme.duration.fast;
-}} ease;
   width: ${(param)=>{
     let { $fullwidth  } = param;
     return $fullwidth ? '100%' : 'auto';
 }};
+`;
+const contentVariants = {
+    default: css`
+    padding-top: 17px;
+    padding-bottom: 17px;
+
+    & ${InputLeftDecoratorStyle}, & ${InputRightDecoratorStyle} {
+      margin-top: -17px;
+      margin-bottom: -17px;
+    }
+  `,
+    small: css`
+    padding-top: 9px;
+    padding-bottom: 9px;
+
+    & ${InputLeftDecoratorStyle}, & ${InputRightDecoratorStyle} {
+      padding-top: -9px;
+      padding-bottom: -9px;
+    }
+  `
+};
+export const InputContentStyle = styled.span`
+  position: relative;
+  display: flex;
+  flex-grow: 1;
+  padding-left: 15px;
+  padding-right: 15px;
+  font-weight: 400;
+  font-size: ${(param)=>{
+    let { theme  } = param;
+    return theme.fontSizesMap.xs;
+}}px;
+  border: 1px solid;
+  border-radius: ${(param)=>{
+    let { theme  } = param;
+    return theme.borderRadiusesMap.lg;
+}}px;
+  transition: border-color ${(param)=>{
+    let { theme  } = param;
+    return theme.duration.fast;
+}} ease;
 
+  ${(param)=>{
+    let { $variant  } = param;
+    return contentVariants[$variant];
+}};
   ${(param)=>{
     let { $color  } = param;
     return wrapperColors[$color];
@@ -109,43 +159,24 @@ export const InputWrapperStyle = styled.label`
   ${(param)=>{
     let { $disabled  } = param;
     return $disabled ? '' : statesCSS;
-}}
-
+}};
   ${(param)=>{
     let { $active  } = param;
     return $active ? activeCSS : '';
-}}
+}};
   ${(param)=>{
     let { $warning  } = param;
     return $warning ? warningCSS : '';
-}}
+}};
   ${(param)=>{
     let { $error  } = param;
     return $error ? errorCSS : '';
-}}
+}};
 `;
-const contentVariants = {
-    default: css`
-    padding: 17px 0;
-  `,
-    small: css`
-    padding: 9px 0;
-  `
-};
-export const InputContentStyle = styled.span`
-  font-weight: 400;
-  font-size: ${(param)=>{
-    let { theme  } = param;
-    return theme.fontSizesMap.xs;
-}}px;
+export const InputControlWrapperStyle = styled.div`
+  position: relative;
   display: flex;
   flex-grow: 1;
-  position: relative;
-
-  ${(param)=>{
-    let { $variant  } = param;
-    return contentVariants[$variant];
-}};
 `;
 const labeledCSS = css`
   &:not(:focus):placeholder-shown {
@@ -305,26 +336,12 @@ export const InputMessageStyle = styled.span`
     let { $bordered  } = param;
     return $bordered ? 'calc(100% + 2px)' : '100%';
 }};
+  z-index: 3;
 
   ${(param)=>{
     let { $variant  } = param;
     return messageVariants[$variant];
 }}
 `;
-const decoratorCSS = css`
-  flex-grow: 0;
-  flex-shrink: 0;
-  cursor: inherit;
-  display: flex;
-  align-items: center;
-`;
-export const InputLeftDecoratorStyle = styled.span`
-  ${decoratorCSS}
-  padding-right: 16px;
-`;
-export const InputRightDecoratorStyle = styled.span`
-  ${decoratorCSS}
-  padding-left: 16px;
-`;
 
 //# sourceMappingURL=InputStyles.js.map

package/dist/esm/input/InputStyles.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../packages/input/InputStyles.ts"],"sourcesContent":["import styled, { css } from 'styled-components'\nimport { InputMessageVariants, InputVariants, InputColors } from './types'\nimport {\n  labelEmptyValueCSS,\n  labelFocusCSS,\n  labelErrorCSS,\n  InputLabelStyle,\n  labelWarningCSS,\n} from './LabelStyles'\n\nconst statesCSS = css`\n  &:hover {\n    z-index: 1;\n  }\n\n  &:focus-within {\n    z-index: 2;\n    border-color: var(--lido-color-borderActive);\n\n    ${InputLabelStyle} {\n      ${labelFocusCSS}\n    }\n  }\n`\n\nconst activeCSS = css`\n  &,\n  &:hover,\n  &:focus-within {\n    z-index: 2;\n    border-color: var(--lido-color-borderActive);\n\n    ${InputLabelStyle} {\n      ${labelFocusCSS}\n    }\n  }\n`\n\nconst errorCSS = css`\n  &,\n  &:hover,\n  &:focus-within {\n    border-color: var(--lido-color-error);\n\n    ${InputLabelStyle} {\n      ${labelErrorCSS}\n    }\n  }\n`\n\nconst warningCSS = css`\n  &,\n  &:hover,\n  &:focus-within {\n    border-color: var(--lido-color-warning);\n\n    ${InputLabelStyle} {\n      ${labelWarningCSS}\n    }\n  }\n`\n\nconst wrapperColors = {\n  default: css<{ $disabled: boolean }>`\n    background: var(--lido-color-controlBg);\n    border-color: var(--lido-color-border);\n    color: var(--lido-color-text);\n\n    ${({ $disabled }) =>\n      $disabled\n        ? `background: var(--lido-color-background);`\n        : `\n          &:hover {\n            border-color: var(--lido-color-borderHover);\n          }\n    `};\n  `,\n  accent: css<{ $disabled: boolean }>`\n    background: var(--lido-color-accentControlBg);\n    border-color: var(--lido-color-accentBorder);\n    color: var(--lido-color-accentText);\n\n    ${({ $disabled }) =>\n      $disabled\n        ? `background: var(--lido-color-controlBg);`\n        : `\n          &:hover {\n            border-color: var(--lido-color-accentBorderHover);\n          }\n    `};\n  `,\n}\n\nexport const InputWrapperStyle = styled.label<{\n  $error: boolean\n  $warning: boolean\n  $active: boolean\n  $disabled: boolean\n  $fullwidth: boolean\n  $color: InputColors\n}>`\n  position: relative;\n  display: inline-flex;\n  border: 1px solid;\n  border-radius: ${({ theme }) => theme.borderRadiusesMap.lg}px;\n  align-items: stretch;\n  box-sizing: border-box;\n  padding: 0 15px;\n  cursor: ${({ $disabled }) => ($disabled ? 'default' : 'text')};\n  transition: border-color ${({ theme }) => theme.duration.fast} ease;\n  width: ${({ $fullwidth }) => ($fullwidth ? '100%' : 'auto')};\n\n  ${({ $color }) => wrapperColors[$color]};\n  ${({ $disabled }) => ($disabled ? '' : statesCSS)}\n\n  ${({ $active }) => ($active ? activeCSS : '')}\n  ${({ $warning }) => ($warning ? warningCSS : '')}\n  ${({ $error }) => ($error ? errorCSS : '')}\n`\n\nconst contentVariants = {\n  default: css`\n    padding: 17px 0;\n  `,\n  small: css`\n    padding: 9px 0;\n  `,\n}\n\nexport const InputContentStyle = styled.span<{ $variant: InputVariants }>`\n  font-weight: 400;\n  font-size: ${({ theme }) => theme.fontSizesMap.xs}px;\n  display: flex;\n  flex-grow: 1;\n  position: relative;\n\n  ${({ $variant }) => contentVariants[$variant]};\n`\n\nconst labeledCSS = css`\n  &:not(:focus):placeholder-shown {\n    & + ${InputLabelStyle} {\n      ${labelEmptyValueCSS}\n    }\n\n    &::placeholder {\n      opacity: 0;\n    }\n  }\n`\n\nconst inputColors = {\n  default: css`\n    color: var(--lido-color-text);\n\n    &:disabled {\n      color: var(--lido-color-textSecondary);\n    }\n\n    &::placeholder {\n      color: var(--lido-color-textSecondary);\n    }\n\n    &:-webkit-autofill {\n      box-shadow: 0 0 0 100px var(--lido-color-controlBg) inset !important;\n      color: var(--lido-color-text) !important;\n      -webkit-text-fill-color: var(--lido-color-text) !important;\n    }\n\n    &:-internal-autofill-selected {\n      color: var(--lido-color-text) !important;\n      -webkit-text-fill-color: var(--lido-color-text) !important;\n    }\n  `,\n  accent: css`\n    color: var(--lido-color-accentText);\n    opacity: 1;\n\n    &:disabled {\n      color: var(--lido-color-accentText);\n      opacity: 0.5;\n    }\n\n    &::placeholder {\n      color: var(--lido-color-accentText);\n      opacity: 0.5;\n    }\n\n    &:-webkit-autofill {\n      box-shadow: 0 0 0 100px var(--lido-color-accentControlBg) inset !important;\n      color: var(--lido-color-accentContrast) !important;\n      -webkit-text-fill-color: var(--lido-color-accentContrast) !important;\n    }\n\n    &:-internal-autofill-selected {\n      color: var(--lido-color-accentContrast) !important;\n      -webkit-text-fill-color: var(--lido-color-accentContrast) !important;\n    }\n  `,\n}\n\nexport const InputStyle = styled.input<{\n  $labeled: boolean\n  $color: InputColors\n}>`\n  width: 100%;\n  font-family: inherit;\n  font-weight: 400;\n  font-size: 1em;\n  line-height: 1.43em;\n  padding: 0;\n  border-radius: 0;\n  background: transparent;\n  box-shadow: none;\n  border: none;\n  outline: none;\n  position: relative;\n  top: ${({ $labeled }) => ($labeled ? 8 : 0)}px;\n\n  &::placeholder {\n    transition: opacity ${({ theme }) => theme.duration.fast} ease;\n  }\n\n  ${({ $color }) => inputColors[$color]}\n  ${({ $labeled }) => ($labeled ? labeledCSS : '')}\n`\n\nexport const TextareaStyle = styled(InputStyle).attrs({\n  as: 'textarea',\n})`\n  resize: none;\n`\n\nconst messageVariants = {\n  error: css`\n    background: var(--lido-color-error);\n    color: var(--lido-color-errorContrast);\n    box-shadow: ${({ theme }) => theme.boxShadows.sm}\n      var(--lido-color-shadowLight);\n  `,\n  warning: css`\n    background: var(--lido-color-warning);\n    color: var(--lido-color-warningContrast);\n    box-shadow: ${({ theme }) => theme.boxShadows.sm}\n      var(--lido-color-shadowLight);\n  `,\n  success: css`\n    background: var(--lido-color-success);\n    color: var(--lido-color-successContrast);\n    box-shadow: ${({ theme }) => theme.boxShadows.sm}\n      var(--lido-color-shadowLight);\n  `,\n}\n\nexport const InputMessageStyle = styled.span<{\n  $variant: InputMessageVariants\n  $bordered?: boolean\n}>`\n  margin-top: ${({ $bordered }) => ($bordered ? 5 : 6)}px;\n  left: ${({ $bordered }) => ($bordered ? -1 : 0)}px;\n  position: absolute;\n  top: 100%;\n  line-height: 1.6em;\n  font-weight: 400;\n  font-size: ${({ theme }) => theme.fontSizesMap.xxs}px;\n  border-radius: ${({ theme }) => theme.borderRadiusesMap.sm}px;\n  padding: 6px 10px;\n  white-space: nowrap;\n  overflow: hidden;\n  box-sizing: border-box;\n  text-overflow: ellipsis;\n  max-width: ${({ $bordered }) => ($bordered ? 'calc(100% + 2px)' : '100%')};\n\n  ${({ $variant }) => messageVariants[$variant]}\n`\n\nconst decoratorCSS = css`\n  flex-grow: 0;\n  flex-shrink: 0;\n  cursor: inherit;\n  display: flex;\n  align-items: center;\n`\n\nexport const InputLeftDecoratorStyle = styled.span`\n  ${decoratorCSS}\n  padding-right: 16px;\n`\n\nexport const InputRightDecoratorStyle = styled.span`\n  ${decoratorCSS}\n  padding-left: 16px;\n`\n"],"names":["styled","css","labelEmptyValueCSS","labelFocusCSS","labelErrorCSS","InputLabelStyle","labelWarningCSS","statesCSS","activeCSS","errorCSS","warningCSS","wrapperColors","default","$disabled","accent","InputWrapperStyle","label","theme","borderRadiusesMap","lg","duration","fast","$fullwidth","$color","$active","$warning","$error","contentVariants","small","InputContentStyle","span","fontSizesMap","xs","$variant","labeledCSS","inputColors","InputStyle","input","$labeled","TextareaStyle","attrs","as","messageVariants","error","boxShadows","sm","warning","success","InputMessageStyle","$bordered","xxs","decoratorCSS","InputLeftDecoratorStyle","InputRightDecoratorStyle"],"mappings":"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"}
+{"version":3,"sources":["../../../packages/input/InputStyles.ts"],"sourcesContent":["import styled, { css } from 'styled-components'\nimport { InputMessageVariants, InputVariants, InputColors } from './types'\nimport {\n  labelEmptyValueCSS,\n  labelFocusCSS,\n  labelErrorCSS,\n  InputLabelStyle,\n  labelWarningCSS,\n} from './LabelStyles'\n\nconst statesCSS = css`\n  &:hover {\n    z-index: 1;\n  }\n\n  &:focus-within {\n    z-index: 2;\n    border-color: var(--lido-color-borderActive);\n\n    ${InputLabelStyle} {\n      ${labelFocusCSS}\n    }\n  }\n`\n\nconst activeCSS = css`\n  &,\n  &:hover,\n  &:focus-within {\n    z-index: 2;\n    border-color: var(--lido-color-borderActive);\n\n    ${InputLabelStyle} {\n      ${labelFocusCSS}\n    }\n  }\n`\n\nconst errorCSS = css`\n  &,\n  &:hover,\n  &:focus-within {\n    border-color: var(--lido-color-error);\n\n    ${InputLabelStyle} {\n      ${labelErrorCSS}\n    }\n  }\n`\n\nconst warningCSS = css`\n  &,\n  &:hover,\n  &:focus-within {\n    border-color: var(--lido-color-warning);\n\n    ${InputLabelStyle} {\n      ${labelWarningCSS}\n    }\n  }\n`\n\nconst wrapperColors = {\n  default: css<{ $disabled: boolean }>`\n    background: var(--lido-color-controlBg);\n    border-color: var(--lido-color-border);\n    color: var(--lido-color-text);\n\n    ${({ $disabled }) =>\n      $disabled\n        ? `background: var(--lido-color-background);`\n        : `\n          &:hover {\n            border-color: var(--lido-color-borderHover);\n          }\n    `};\n  `,\n  accent: css<{ $disabled: boolean }>`\n    background: var(--lido-color-accentControlBg);\n    border-color: var(--lido-color-accentBorder);\n    color: var(--lido-color-accentText);\n\n    ${({ $disabled }) =>\n      $disabled\n        ? `background: var(--lido-color-controlBg);`\n        : `\n          &:hover {\n            border-color: var(--lido-color-accentBorderHover);\n          }\n    `};\n  `,\n}\n\nconst decoratorCSS = css`\n  flex-grow: 0;\n  flex-shrink: 0;\n  cursor: inherit;\n  display: flex;\n  align-items: center;\n`\n\nexport const InputLeftDecoratorStyle = styled.span`\n  ${decoratorCSS}\n  padding-right: 16px;\n`\n\nexport const InputRightDecoratorStyle = styled.span`\n  ${decoratorCSS}\n  padding-left: 16px;\n`\n\nexport const InputWrapperStyle = styled.label<{\n  $fullwidth: boolean\n  $disabled: boolean\n}>`\n  position: relative;\n  display: inline-flex;\n  align-items: stretch;\n  box-sizing: border-box;\n  cursor: ${({ $disabled }) => ($disabled ? 'default' : 'text')};\n  width: ${({ $fullwidth }) => ($fullwidth ? '100%' : 'auto')};\n`\n\nconst contentVariants = {\n  default: css`\n    padding-top: 17px;\n    padding-bottom: 17px;\n\n    & ${InputLeftDecoratorStyle}, & ${InputRightDecoratorStyle} {\n      margin-top: -17px;\n      margin-bottom: -17px;\n    }\n  `,\n  small: css`\n    padding-top: 9px;\n    padding-bottom: 9px;\n\n    & ${InputLeftDecoratorStyle}, & ${InputRightDecoratorStyle} {\n      padding-top: -9px;\n      padding-bottom: -9px;\n    }\n  `,\n}\n\nexport const InputContentStyle = styled.span<{\n  $error: boolean\n  $warning: boolean\n  $active: boolean\n  $disabled: boolean\n  $color: InputColors\n  $variant: InputVariants\n}>`\n  position: relative;\n  display: flex;\n  flex-grow: 1;\n  padding-left: 15px;\n  padding-right: 15px;\n  font-weight: 400;\n  font-size: ${({ theme }) => theme.fontSizesMap.xs}px;\n  border: 1px solid;\n  border-radius: ${({ theme }) => theme.borderRadiusesMap.lg}px;\n  transition: border-color ${({ theme }) => theme.duration.fast} ease;\n\n  ${({ $variant }) => contentVariants[$variant]};\n  ${({ $color }) => wrapperColors[$color]};\n  ${({ $disabled }) => ($disabled ? '' : statesCSS)};\n  ${({ $active }) => ($active ? activeCSS : '')};\n  ${({ $warning }) => ($warning ? warningCSS : '')};\n  ${({ $error }) => ($error ? errorCSS : '')};\n`\n\nexport const InputControlWrapperStyle = styled.div`\n  position: relative;\n  display: flex;\n  flex-grow: 1;\n`\n\nconst labeledCSS = css`\n  &:not(:focus):placeholder-shown {\n    & + ${InputLabelStyle} {\n      ${labelEmptyValueCSS}\n    }\n\n    &::placeholder {\n      opacity: 0;\n    }\n  }\n`\n\nconst inputColors = {\n  default: css`\n    color: var(--lido-color-text);\n\n    &:disabled {\n      color: var(--lido-color-textSecondary);\n    }\n\n    &::placeholder {\n      color: var(--lido-color-textSecondary);\n    }\n\n    &:-webkit-autofill {\n      box-shadow: 0 0 0 100px var(--lido-color-controlBg) inset !important;\n      color: var(--lido-color-text) !important;\n      -webkit-text-fill-color: var(--lido-color-text) !important;\n    }\n\n    &:-internal-autofill-selected {\n      color: var(--lido-color-text) !important;\n      -webkit-text-fill-color: var(--lido-color-text) !important;\n    }\n  `,\n  accent: css`\n    color: var(--lido-color-accentText);\n    opacity: 1;\n\n    &:disabled {\n      color: var(--lido-color-accentText);\n      opacity: 0.5;\n    }\n\n    &::placeholder {\n      color: var(--lido-color-accentText);\n      opacity: 0.5;\n    }\n\n    &:-webkit-autofill {\n      box-shadow: 0 0 0 100px var(--lido-color-accentControlBg) inset !important;\n      color: var(--lido-color-accentContrast) !important;\n      -webkit-text-fill-color: var(--lido-color-accentContrast) !important;\n    }\n\n    &:-internal-autofill-selected {\n      color: var(--lido-color-accentContrast) !important;\n      -webkit-text-fill-color: var(--lido-color-accentContrast) !important;\n    }\n  `,\n}\n\nexport const InputStyle = styled.input<{\n  $labeled: boolean\n  $color: InputColors\n}>`\n  width: 100%;\n  font-family: inherit;\n  font-weight: 400;\n  font-size: 1em;\n  line-height: 1.43em;\n  padding: 0;\n  border-radius: 0;\n  background: transparent;\n  box-shadow: none;\n  border: none;\n  outline: none;\n  position: relative;\n  top: ${({ $labeled }) => ($labeled ? 8 : 0)}px;\n\n  &::placeholder {\n    transition: opacity ${({ theme }) => theme.duration.fast} ease;\n  }\n\n  ${({ $color }) => inputColors[$color]}\n  ${({ $labeled }) => ($labeled ? labeledCSS : '')}\n`\n\nexport const TextareaStyle = styled(InputStyle).attrs({\n  as: 'textarea',\n})`\n  resize: none;\n`\n\nconst messageVariants = {\n  error: css`\n    background: var(--lido-color-error);\n    color: var(--lido-color-errorContrast);\n    box-shadow: ${({ theme }) => theme.boxShadows.sm}\n      var(--lido-color-shadowLight);\n  `,\n  warning: css`\n    background: var(--lido-color-warning);\n    color: var(--lido-color-warningContrast);\n    box-shadow: ${({ theme }) => theme.boxShadows.sm}\n      var(--lido-color-shadowLight);\n  `,\n  success: css`\n    background: var(--lido-color-success);\n    color: var(--lido-color-successContrast);\n    box-shadow: ${({ theme }) => theme.boxShadows.sm}\n      var(--lido-color-shadowLight);\n  `,\n}\n\nexport const InputMessageStyle = styled.span<{\n  $variant: InputMessageVariants\n  $bordered?: boolean\n}>`\n  margin-top: ${({ $bordered }) => ($bordered ? 5 : 6)}px;\n  left: ${({ $bordered }) => ($bordered ? -1 : 0)}px;\n  position: absolute;\n  top: 100%;\n  line-height: 1.6em;\n  font-weight: 400;\n  font-size: ${({ theme }) => theme.fontSizesMap.xxs}px;\n  border-radius: ${({ theme }) => theme.borderRadiusesMap.sm}px;\n  padding: 6px 10px;\n  white-space: nowrap;\n  overflow: hidden;\n  box-sizing: border-box;\n  text-overflow: ellipsis;\n  max-width: ${({ $bordered }) => ($bordered ? 'calc(100% + 2px)' : '100%')};\n  z-index: 3;\n\n  ${({ $variant }) => messageVariants[$variant]}\n`\n"],"names":["styled","css","labelEmptyValueCSS","labelFocusCSS","labelErrorCSS","InputLabelStyle","labelWarningCSS","statesCSS","activeCSS","errorCSS","warningCSS","wrapperColors","default","$disabled","accent","decoratorCSS","InputLeftDecoratorStyle","span","InputRightDecoratorStyle","InputWrapperStyle","label","$fullwidth","contentVariants","small","InputContentStyle","theme","fontSizesMap","xs","borderRadiusesMap","lg","duration","fast","$variant","$color","$active","$warning","$error","InputControlWrapperStyle","div","labeledCSS","inputColors","InputStyle","input","$labeled","TextareaStyle","attrs","as","messageVariants","error","boxShadows","sm","warning","success","InputMessageStyle","$bordered","xxs"],"mappings":"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"}

package/dist/esm/input/LabelStyles.js

@@ -56,7 +56,7 @@ export const InputLabelStyle = styled.span`
   ${labelFilledValueCSS};
 `;
 export const TextareaLabelStyle = styled(InputLabelStyle)`
-  top: 27px;
+  top: 10px;
 `;
 
 //# sourceMappingURL=LabelStyles.js.map

package/dist/esm/input/LabelStyles.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../packages/input/LabelStyles.ts"],"sourcesContent":["import styled, { css } from 'styled-components'\nimport { InputColors } from './types'\n\nconst colors = {\n  default: css`\n    color: var(--lido-color-textSecondary);\n  `,\n  accent: css`\n    color: var(--lido-color-accentContrastSecondary);\n  `,\n}\n\nexport const labelEmptyValueCSS = css<{ $color: InputColors }>`\n  ${({ $color }) => colors[$color]}\n\n  transform: scale(1);\n  opacity: 0.5;\n`\n\nexport const labelFilledValueCSS = css<{ $color: InputColors }>`\n  ${({ $color }) => colors[$color]}\n\n  transform: translateY(-14px) scale(0.75);\n  opacity: 1;\n`\n\nexport const labelFocusCSS = css`\n  color: var(--lido-color-primary);\n  opacity: 1;\n`\n\nexport const labelErrorCSS = css`\n  color: var(--lido-color-error);\n`\n\nexport const labelWarningCSS = css`\n  color: var(--lido-color-warning);\n`\n\nexport const InputLabelStyle = styled.span`\n  position: absolute;\n  left: 0;\n  top: 50%;\n  font-size: 1em;\n  line-height: 1.25em;\n  margin: -0.625em 0 0 0;\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  max-width: 100%;\n  color: inherit;\n  transform-origin: 0% 100%;\n  transition: transform ${({ theme }) => theme.duration.fast} ease;\n  transition-property: transform, opacity, color;\n  ${labelFilledValueCSS};\n`\n\nexport const TextareaLabelStyle = styled(InputLabelStyle)`\n  top: 27px;\n`\n"],"names":["styled","css","colors","default","accent","labelEmptyValueCSS","$color","labelFilledValueCSS","labelFocusCSS","labelErrorCSS","labelWarningCSS","InputLabelStyle","span","theme","duration","fast","TextareaLabelStyle"],"mappings":"AAAA,OAAOA,MAAM,IAAIC,GAAG,QAAQ,mBAAmB,CAAA;AAG/C,MAAMC,MAAM,GAAG;IACbC,OAAO,EAAEF,GAAG,CAAC;;EAEb,CAAC;IACDG,MAAM,EAAEH,GAAG,CAAC;;EAEZ,CAAC;CACF;AAED,OAAO,MAAMI,kBAAkB,GAAGJ,GAAG,AAAyB,CAAC;EAC7D,EAAE,SAAgBC;QAAf,EAAEI,MAAM,CAAA,EAAE;WAAKJ,MAAM,CAACI,MAAM,CAAC;AAAD,CAAC,CAAC;;;;AAInC,CAAC,CAAA;AAED,OAAO,MAAMC,mBAAmB,GAAGN,GAAG,AAAyB,CAAC;EAC9D,EAAE,SAAgBC;QAAf,EAAEI,MAAM,CAAA,EAAE;WAAKJ,MAAM,CAACI,MAAM,CAAC;AAAD,CAAC,CAAC;;;;AAInC,CAAC,CAAA;AAED,OAAO,MAAME,aAAa,GAAGP,GAAG,CAAC;;;AAGjC,CAAC,CAAA;AAED,OAAO,MAAMQ,aAAa,GAAGR,GAAG,CAAC;;AAEjC,CAAC,CAAA;AAED,OAAO,MAAMS,eAAe,GAAGT,GAAG,CAAC;;AAEnC,CAAC,CAAA;AAED,OAAO,MAAMU,eAAe,GAAGX,MAAM,CAACY,IAAI,CAAC;;;;;;;;;;;;;wBAanB,EAAE,SAAeC;QAAd,EAAEA,KAAK,CAAA,EAAE;WAAKA,KAAK,CAACC,QAAQ,CAACC,IAAI;AAAD,CAAC,CAAC;;EAE3D,EAAER,mBAAmB,CAAC;AACxB,CAAC,CAAA;AAED,OAAO,MAAMS,kBAAkB,GAAGhB,MAAM,CAACW,eAAe,CAAC,CAAC;;AAE1D,CAAC,CAAA"}
+{"version":3,"sources":["../../../packages/input/LabelStyles.ts"],"sourcesContent":["import styled, { css } from 'styled-components'\nimport { InputColors } from './types'\n\nconst colors = {\n  default: css`\n    color: var(--lido-color-textSecondary);\n  `,\n  accent: css`\n    color: var(--lido-color-accentContrastSecondary);\n  `,\n}\n\nexport const labelEmptyValueCSS = css<{ $color: InputColors }>`\n  ${({ $color }) => colors[$color]}\n\n  transform: scale(1);\n  opacity: 0.5;\n`\n\nexport const labelFilledValueCSS = css<{ $color: InputColors }>`\n  ${({ $color }) => colors[$color]}\n\n  transform: translateY(-14px) scale(0.75);\n  opacity: 1;\n`\n\nexport const labelFocusCSS = css`\n  color: var(--lido-color-primary);\n  opacity: 1;\n`\n\nexport const labelErrorCSS = css`\n  color: var(--lido-color-error);\n`\n\nexport const labelWarningCSS = css`\n  color: var(--lido-color-warning);\n`\n\nexport const InputLabelStyle = styled.span`\n  position: absolute;\n  left: 0;\n  top: 50%;\n  font-size: 1em;\n  line-height: 1.25em;\n  margin: -0.625em 0 0 0;\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  max-width: 100%;\n  color: inherit;\n  transform-origin: 0% 100%;\n  transition: transform ${({ theme }) => theme.duration.fast} ease;\n  transition-property: transform, opacity, color;\n  ${labelFilledValueCSS};\n`\n\nexport const TextareaLabelStyle = styled(InputLabelStyle)`\n  top: 10px;\n`\n"],"names":["styled","css","colors","default","accent","labelEmptyValueCSS","$color","labelFilledValueCSS","labelFocusCSS","labelErrorCSS","labelWarningCSS","InputLabelStyle","span","theme","duration","fast","TextareaLabelStyle"],"mappings":"AAAA,OAAOA,MAAM,IAAIC,GAAG,QAAQ,mBAAmB,CAAA;AAG/C,MAAMC,MAAM,GAAG;IACbC,OAAO,EAAEF,GAAG,CAAC;;EAEb,CAAC;IACDG,MAAM,EAAEH,GAAG,CAAC;;EAEZ,CAAC;CACF;AAED,OAAO,MAAMI,kBAAkB,GAAGJ,GAAG,AAAyB,CAAC;EAC7D,EAAE,SAAgBC;QAAf,EAAEI,MAAM,CAAA,EAAE;WAAKJ,MAAM,CAACI,MAAM,CAAC;AAAD,CAAC,CAAC;;;;AAInC,CAAC,CAAA;AAED,OAAO,MAAMC,mBAAmB,GAAGN,GAAG,AAAyB,CAAC;EAC9D,EAAE,SAAgBC;QAAf,EAAEI,MAAM,CAAA,EAAE;WAAKJ,MAAM,CAACI,MAAM,CAAC;AAAD,CAAC,CAAC;;;;AAInC,CAAC,CAAA;AAED,OAAO,MAAME,aAAa,GAAGP,GAAG,CAAC;;;AAGjC,CAAC,CAAA;AAED,OAAO,MAAMQ,aAAa,GAAGR,GAAG,CAAC;;AAEjC,CAAC,CAAA;AAED,OAAO,MAAMS,eAAe,GAAGT,GAAG,CAAC;;AAEnC,CAAC,CAAA;AAED,OAAO,MAAMU,eAAe,GAAGX,MAAM,CAACY,IAAI,CAAC;;;;;;;;;;;;;wBAanB,EAAE,SAAeC;QAAd,EAAEA,KAAK,CAAA,EAAE;WAAKA,KAAK,CAACC,QAAQ,CAACC,IAAI;AAAD,CAAC,CAAC;;EAE3D,EAAER,mBAAmB,CAAC;AACxB,CAAC,CAAA;AAED,OAAO,MAAMS,kBAAkB,GAAGhB,MAAM,CAACW,eAAe,CAAC,CAAC;;AAE1D,CAAC,CAAA"}

package/dist/esm/input/Textarea.js

@@ -1,6 +1,6 @@
 import _extends from "@swc/helpers/src/_extends.mjs";
 import React, { forwardRef } from "react";
-import { InputWrapperStyle, InputContentStyle, TextareaStyle, InputMessageStyle } from "./InputStyles";
+import { InputWrapperStyle, InputContentStyle, TextareaStyle, InputMessageStyle, InputControlWrapperStyle } from "./InputStyles";
 import { TextareaLabelStyle } from "./LabelStyles";
 function Textarea(props, ref) {
     const { label , error , warning , success , active =false , fullwidth =false , placeholder =' ' , className , style , variant ='default' , color ='default' , wrapperRef , children , ...rest } = props;
@@ -18,17 +18,18 @@ function Textarea(props, ref) {
     const hasSuccess = !!success && !error;
     const hasSuccessMessage = hasSuccess && typeof success !== 'boolean';
     return /*#__PURE__*/ React.createElement(InputWrapperStyle, _extends({
-        $error: hasError,
-        $warning: hasWarning,
-        $active: active,
         $disabled: disabled,
         $fullwidth: fullwidth,
-        $color: color,
         htmlFor: id,
         ref: wrapperRef
     }, wrapperProps), /*#__PURE__*/ React.createElement(InputContentStyle, {
-        $variant: variant
-    }, /*#__PURE__*/ React.createElement(TextareaStyle, _extends({
+        $color: color,
+        $variant: variant,
+        $error: hasError,
+        $warning: hasWarning,
+        $active: active,
+        $disabled: disabled
+    }, /*#__PURE__*/ React.createElement(InputControlWrapperStyle, null, /*#__PURE__*/ React.createElement(TextareaStyle, _extends({
         $labeled: hasLabel,
         $color: color,
         placeholder: placeholder,
@@ -36,7 +37,7 @@ function Textarea(props, ref) {
         ref: ref
     }, rest)), hasLabel && /*#__PURE__*/ React.createElement(TextareaLabelStyle, {
         $color: color
-    }, label)), hasErrorMessage && /*#__PURE__*/ React.createElement(InputMessageStyle, {
+    }, label))), hasErrorMessage && /*#__PURE__*/ React.createElement(InputMessageStyle, {
         $variant: "error",
         $bordered: true
     }, error), hasWarningMessage && /*#__PURE__*/ React.createElement(InputMessageStyle, {

package/dist/esm/input/Textarea.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../packages/input/Textarea.tsx"],"sourcesContent":["import React, { ForwardedRef, forwardRef } from 'react'\nimport {\n  InputWrapperStyle,\n  InputContentStyle,\n  TextareaStyle,\n  InputMessageStyle,\n} from './InputStyles'\nimport { TextareaLabelStyle } from './LabelStyles'\nimport { TextareaProps } from './types'\n\nfunction Textarea(props: TextareaProps, ref?: ForwardedRef<HTMLInputElement>) {\n  const {\n    label,\n    error,\n    warning,\n    success,\n    active = false,\n    fullwidth = false,\n    placeholder = ' ',\n    className,\n    style,\n    variant = 'default',\n    color = 'default',\n    wrapperRef,\n    children,\n    ...rest\n  } = props\n\n  const { id, disabled = false } = props\n  const wrapperProps = { className, style }\n\n  const hasLabel = !!label && variant === 'default'\n\n  const hasError = !!error\n  const hasErrorMessage = hasError && typeof error !== 'boolean'\n  const hasWarning = !hasError && !!warning // `error` overrides `warning`\n  const hasWarningMessage = hasWarning && typeof warning !== 'boolean'\n  const hasSuccess = !!success && !error\n  const hasSuccessMessage = hasSuccess && typeof success !== 'boolean'\n\n  return (\n    <InputWrapperStyle\n      $error={hasError}\n      $warning={hasWarning}\n      $active={active}\n      $disabled={disabled}\n      $fullwidth={fullwidth}\n      $color={color}\n      htmlFor={id}\n      ref={wrapperRef}\n      {...wrapperProps}\n    >\n      <InputContentStyle $variant={variant}>\n        <TextareaStyle\n          $labeled={hasLabel}\n          $color={color}\n          placeholder={placeholder}\n          aria-invalid={hasError}\n          ref={ref}\n          {...rest}\n        />\n        {hasLabel && (\n          <TextareaLabelStyle $color={color}>{label}</TextareaLabelStyle>\n        )}\n      </InputContentStyle>\n\n      {hasErrorMessage && (\n        <InputMessageStyle $variant='error' $bordered>\n          {error}\n        </InputMessageStyle>\n      )}\n      {hasWarningMessage && (\n        <InputMessageStyle $variant='warning' $bordered>\n          {warning}\n        </InputMessageStyle>\n      )}\n      {hasSuccessMessage && (\n        <InputMessageStyle $variant='success' $bordered>\n          {success}\n        </InputMessageStyle>\n      )}\n    </InputWrapperStyle>\n  )\n}\n\nexport default forwardRef(Textarea)\n"],"names":["React","forwardRef","InputWrapperStyle","InputContentStyle","TextareaStyle","InputMessageStyle","TextareaLabelStyle","Textarea","props","ref","label","error","warning","success","active","fullwidth","placeholder","className","style","variant","color","wrapperRef","children","rest","id","disabled","wrapperProps","hasLabel","hasError","hasErrorMessage","hasWarning","hasWarningMessage","hasSuccess","hasSuccessMessage","$error","$warning","$active","$disabled","$fullwidth","$color","htmlFor","$variant","$labeled","aria-invalid","$bordered"],"mappings":"AAAA;AAAA,OAAOA,KAAK,IAAkBC,UAAU,QAAQ,OAAO,CAAA;AACvD,SACEC,iBAAiB,EACjBC,iBAAiB,EACjBC,aAAa,EACbC,iBAAiB,QACZ,eAAe,CAAA;AACtB,SAASC,kBAAkB,QAAQ,eAAe,CAAA;AAGlD,SAASC,QAAQ,CAACC,KAAoB,EAAEC,GAAoC,EAAE;IAC5E,MAAM,EACJC,KAAK,CAAA,EACLC,KAAK,CAAA,EACLC,OAAO,CAAA,EACPC,OAAO,CAAA,EACPC,MAAM,EAAG,KAAK,CAAA,EACdC,SAAS,EAAG,KAAK,CAAA,EACjBC,WAAW,EAAG,GAAG,CAAA,EACjBC,SAAS,CAAA,EACTC,KAAK,CAAA,EACLC,OAAO,EAAG,SAAS,CAAA,EACnBC,KAAK,EAAG,SAAS,CAAA,EACjBC,UAAU,CAAA,EACVC,QAAQ,CAAA,EACR,GAAGC,IAAI,EACR,GAAGf,KAAK;IAET,MAAM,EAAEgB,EAAE,CAAA,EAAEC,QAAQ,EAAG,KAAK,CAAA,EAAE,GAAGjB,KAAK;IACtC,MAAMkB,YAAY,GAAG;QAAET,SAAS;QAAEC,KAAK;KAAE;IAEzC,MAAMS,QAAQ,GAAG,CAAC,CAACjB,KAAK,IAAIS,OAAO,KAAK,SAAS;IAEjD,MAAMS,QAAQ,GAAG,CAAC,CAACjB,KAAK;IACxB,MAAMkB,eAAe,GAAGD,QAAQ,IAAI,OAAOjB,KAAK,KAAK,SAAS;IAC9D,MAAMmB,UAAU,GAAG,CAACF,QAAQ,IAAI,CAAC,CAAChB,OAAO,CAAC,8BAA8B;IAA/B;IACzC,MAAMmB,iBAAiB,GAAGD,UAAU,IAAI,OAAOlB,OAAO,KAAK,SAAS;IACpE,MAAMoB,UAAU,GAAG,CAAC,CAACnB,OAAO,IAAI,CAACF,KAAK;IACtC,MAAMsB,iBAAiB,GAAGD,UAAU,IAAI,OAAOnB,OAAO,KAAK,SAAS;IAEpE,qBACE,oBAACX,iBAAiB;QAChBgC,MAAM,EAAEN,QAAQ;QAChBO,QAAQ,EAAEL,UAAU;QACpBM,OAAO,EAAEtB,MAAM;QACfuB,SAAS,EAAEZ,QAAQ;QACnBa,UAAU,EAAEvB,SAAS;QACrBwB,MAAM,EAAEnB,KAAK;QACboB,OAAO,EAAEhB,EAAE;QACXf,GAAG,EAAEY,UAAU;OACXK,YAAY,iBAEhB,oBAACvB,iBAAiB;QAACsC,QAAQ,EAAEtB,OAAO;qBAClC,oBAACf,aAAa;QACZsC,QAAQ,EAAEf,QAAQ;QAClBY,MAAM,EAAEnB,KAAK;QACbJ,WAAW,EAAEA,WAAW;QACxB2B,cAAY,EAAEf,QAAQ;QACtBnB,GAAG,EAAEA,GAAG;OACJc,IAAI,EACR,EACDI,QAAQ,kBACP,oBAACrB,kBAAkB;QAACiC,MAAM,EAAEnB,KAAK;OAAGV,KAAK,CAAsB,AAChE,CACiB,EAEnBmB,eAAe,kBACd,oBAACxB,iBAAiB;QAACoC,QAAQ,EAAC,OAAO;QAACG,SAAS,EAATA,IAAS;OAC1CjC,KAAK,CACY,AACrB,EACAoB,iBAAiB,kBAChB,oBAAC1B,iBAAiB;QAACoC,QAAQ,EAAC,SAAS;QAACG,SAAS,EAATA,IAAS;OAC5ChC,OAAO,CACU,AACrB,EACAqB,iBAAiB,kBAChB,oBAAC5B,iBAAiB;QAACoC,QAAQ,EAAC,SAAS;QAACG,SAAS,EAATA,IAAS;OAC5C/B,OAAO,CACU,AACrB,CACiB,CACrB;AACH,CAAC;AAED,6BAAeZ,UAAU,CAACM,QAAQ,CAAC,CAAA"}
+{"version":3,"sources":["../../../packages/input/Textarea.tsx"],"sourcesContent":["import React, { ForwardedRef, forwardRef } from 'react'\nimport {\n  InputWrapperStyle,\n  InputContentStyle,\n  TextareaStyle,\n  InputMessageStyle,\n  InputControlWrapperStyle,\n} from './InputStyles'\nimport { TextareaLabelStyle } from './LabelStyles'\nimport { TextareaProps } from './types'\n\nfunction Textarea(props: TextareaProps, ref?: ForwardedRef<HTMLInputElement>) {\n  const {\n    label,\n    error,\n    warning,\n    success,\n    active = false,\n    fullwidth = false,\n    placeholder = ' ',\n    className,\n    style,\n    variant = 'default',\n    color = 'default',\n    wrapperRef,\n    children,\n    ...rest\n  } = props\n\n  const { id, disabled = false } = props\n  const wrapperProps = { className, style }\n\n  const hasLabel = !!label && variant === 'default'\n\n  const hasError = !!error\n  const hasErrorMessage = hasError && typeof error !== 'boolean'\n  const hasWarning = !hasError && !!warning // `error` overrides `warning`\n  const hasWarningMessage = hasWarning && typeof warning !== 'boolean'\n  const hasSuccess = !!success && !error\n  const hasSuccessMessage = hasSuccess && typeof success !== 'boolean'\n\n  return (\n    <InputWrapperStyle\n      $disabled={disabled}\n      $fullwidth={fullwidth}\n      htmlFor={id}\n      ref={wrapperRef}\n      {...wrapperProps}\n    >\n      <InputContentStyle\n        $color={color}\n        $variant={variant}\n        $error={hasError}\n        $warning={hasWarning}\n        $active={active}\n        $disabled={disabled}\n      >\n        <InputControlWrapperStyle>\n          <TextareaStyle\n            $labeled={hasLabel}\n            $color={color}\n            placeholder={placeholder}\n            aria-invalid={hasError}\n            ref={ref}\n            {...rest}\n          />\n          {hasLabel && (\n            <TextareaLabelStyle $color={color}>{label}</TextareaLabelStyle>\n          )}\n        </InputControlWrapperStyle>\n      </InputContentStyle>\n\n      {hasErrorMessage && (\n        <InputMessageStyle $variant='error' $bordered>\n          {error}\n        </InputMessageStyle>\n      )}\n      {hasWarningMessage && (\n        <InputMessageStyle $variant='warning' $bordered>\n          {warning}\n        </InputMessageStyle>\n      )}\n      {hasSuccessMessage && (\n        <InputMessageStyle $variant='success' $bordered>\n          {success}\n        </InputMessageStyle>\n      )}\n    </InputWrapperStyle>\n  )\n}\n\nexport default forwardRef(Textarea)\n"],"names":["React","forwardRef","InputWrapperStyle","InputContentStyle","TextareaStyle","InputMessageStyle","InputControlWrapperStyle","TextareaLabelStyle","Textarea","props","ref","label","error","warning","success","active","fullwidth","placeholder","className","style","variant","color","wrapperRef","children","rest","id","disabled","wrapperProps","hasLabel","hasError","hasErrorMessage","hasWarning","hasWarningMessage","hasSuccess","hasSuccessMessage","$disabled","$fullwidth","htmlFor","$color","$variant","$error","$warning","$active","$labeled","aria-invalid","$bordered"],"mappings":"AAAA;AAAA,OAAOA,KAAK,IAAkBC,UAAU,QAAQ,OAAO,CAAA;AACvD,SACEC,iBAAiB,EACjBC,iBAAiB,EACjBC,aAAa,EACbC,iBAAiB,EACjBC,wBAAwB,QACnB,eAAe,CAAA;AACtB,SAASC,kBAAkB,QAAQ,eAAe,CAAA;AAGlD,SAASC,QAAQ,CAACC,KAAoB,EAAEC,GAAoC,EAAE;IAC5E,MAAM,EACJC,KAAK,CAAA,EACLC,KAAK,CAAA,EACLC,OAAO,CAAA,EACPC,OAAO,CAAA,EACPC,MAAM,EAAG,KAAK,CAAA,EACdC,SAAS,EAAG,KAAK,CAAA,EACjBC,WAAW,EAAG,GAAG,CAAA,EACjBC,SAAS,CAAA,EACTC,KAAK,CAAA,EACLC,OAAO,EAAG,SAAS,CAAA,EACnBC,KAAK,EAAG,SAAS,CAAA,EACjBC,UAAU,CAAA,EACVC,QAAQ,CAAA,EACR,GAAGC,IAAI,EACR,GAAGf,KAAK;IAET,MAAM,EAAEgB,EAAE,CAAA,EAAEC,QAAQ,EAAG,KAAK,CAAA,EAAE,GAAGjB,KAAK;IACtC,MAAMkB,YAAY,GAAG;QAAET,SAAS;QAAEC,KAAK;KAAE;IAEzC,MAAMS,QAAQ,GAAG,CAAC,CAACjB,KAAK,IAAIS,OAAO,KAAK,SAAS;IAEjD,MAAMS,QAAQ,GAAG,CAAC,CAACjB,KAAK;IACxB,MAAMkB,eAAe,GAAGD,QAAQ,IAAI,OAAOjB,KAAK,KAAK,SAAS;IAC9D,MAAMmB,UAAU,GAAG,CAACF,QAAQ,IAAI,CAAC,CAAChB,OAAO,CAAC,8BAA8B;IAA/B;IACzC,MAAMmB,iBAAiB,GAAGD,UAAU,IAAI,OAAOlB,OAAO,KAAK,SAAS;IACpE,MAAMoB,UAAU,GAAG,CAAC,CAACnB,OAAO,IAAI,CAACF,KAAK;IACtC,MAAMsB,iBAAiB,GAAGD,UAAU,IAAI,OAAOnB,OAAO,KAAK,SAAS;IAEpE,qBACE,oBAACZ,iBAAiB;QAChBiC,SAAS,EAAET,QAAQ;QACnBU,UAAU,EAAEpB,SAAS;QACrBqB,OAAO,EAAEZ,EAAE;QACXf,GAAG,EAAEY,UAAU;OACXK,YAAY,iBAEhB,oBAACxB,iBAAiB;QAChBmC,MAAM,EAAEjB,KAAK;QACbkB,QAAQ,EAAEnB,OAAO;QACjBoB,MAAM,EAAEX,QAAQ;QAChBY,QAAQ,EAAEV,UAAU;QACpBW,OAAO,EAAE3B,MAAM;QACfoB,SAAS,EAAET,QAAQ;qBAEnB,oBAACpB,wBAAwB,sBACvB,oBAACF,aAAa;QACZuC,QAAQ,EAAEf,QAAQ;QAClBU,MAAM,EAAEjB,KAAK;QACbJ,WAAW,EAAEA,WAAW;QACxB2B,cAAY,EAAEf,QAAQ;QACtBnB,GAAG,EAAEA,GAAG;OACJc,IAAI,EACR,EACDI,QAAQ,kBACP,oBAACrB,kBAAkB;QAAC+B,MAAM,EAAEjB,KAAK;OAAGV,KAAK,CAAsB,AAChE,CACwB,CACT,EAEnBmB,eAAe,kBACd,oBAACzB,iBAAiB;QAACkC,QAAQ,EAAC,OAAO;QAACM,SAAS,EAATA,IAAS;OAC1CjC,KAAK,CACY,AACrB,EACAoB,iBAAiB,kBAChB,oBAAC3B,iBAAiB;QAACkC,QAAQ,EAAC,SAAS;QAACM,SAAS,EAATA,IAAS;OAC5ChC,OAAO,CACU,AACrB,EACAqB,iBAAiB,kBAChB,oBAAC7B,iBAAiB;QAACkC,QAAQ,EAAC,SAAS;QAACM,SAAS,EAATA,IAAS;OAC5C/B,OAAO,CACU,AACrB,CACiB,CACrB;AACH,CAAC;AAED,6BAAeb,UAAU,CAACO,QAAQ,CAAC,CAAA"}

package/dist/types/input/Input.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Input.d.ts","sourceRoot":"","sources":["../../../packages/input/Input.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAmC,MAAM,OAAO,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAmGvD,wBAAgC"}
+{"version":3,"file":"Input.d.ts","sourceRoot":"","sources":["../../../packages/input/Input.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAmC,MAAM,OAAO,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA2GvD,wBAAgC"}

package/dist/types/input/InputGroupStyles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"InputGroupStyles.d.ts","sourceRoot":"","sources":["../../../packages/input/InputGroupStyles.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,eAAe;gBAA6B,OAAO;SAI/D,CAAA;AAED,eAAO,MAAM,sBAAsB,0GAoBlC,CAAA"}
+{"version":3,"file":"InputGroupStyles.d.ts","sourceRoot":"","sources":["../../../packages/input/InputGroupStyles.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,eAAe;gBAA6B,OAAO;SAI/D,CAAA;AAED,eAAO,MAAM,sBAAsB,0GAsBlC,CAAA"}

package/dist/types/input/InputStyles.d.ts

@@ -1,15 +1,19 @@
 import { InputMessageVariants, InputVariants, InputColors } from './types';
+export declare const InputLeftDecoratorStyle: import("styled-components").StyledComponent<"span", import("styled-components").DefaultTheme, {}, never>;
+export declare const InputRightDecoratorStyle: import("styled-components").StyledComponent<"span", import("styled-components").DefaultTheme, {}, never>;
 export declare const InputWrapperStyle: import("styled-components").StyledComponent<"label", import("styled-components").DefaultTheme, {
+    $fullwidth: boolean;
+    $disabled: boolean;
+}, never>;
+export declare const InputContentStyle: import("styled-components").StyledComponent<"span", import("styled-components").DefaultTheme, {
     $error: boolean;
     $warning: boolean;
     $active: boolean;
     $disabled: boolean;
-    $fullwidth: boolean;
     $color: InputColors;
-}, never>;
-export declare const InputContentStyle: import("styled-components").StyledComponent<"span", import("styled-components").DefaultTheme, {
     $variant: InputVariants;
 }, never>;
+export declare const InputControlWrapperStyle: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
 export declare const InputStyle: import("styled-components").StyledComponent<"input", import("styled-components").DefaultTheme, {
     $labeled: boolean;
     $color: InputColors;
@@ -24,6 +28,4 @@ export declare const InputMessageStyle: import("styled-components").StyledCompon
     $variant: InputMessageVariants;
     $bordered?: boolean | undefined;
 }, never>;
-export declare const InputLeftDecoratorStyle: import("styled-components").StyledComponent<"span", import("styled-components").DefaultTheme, {}, never>;
-export declare const InputRightDecoratorStyle: import("styled-components").StyledComponent<"span", import("styled-components").DefaultTheme, {}, never>;
 //# sourceMappingURL=InputStyles.d.ts.map

package/dist/types/input/InputStyles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"InputStyles.d.ts","sourceRoot":"","sources":["../../../packages/input/InputStyles.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,oBAAoB,EAAE,aAAa,EAAE,WAAW,EAAE,MAAM,SAAS,CAAA;AA4F1E,eAAO,MAAM,iBAAiB;YACpB,OAAO;cACL,OAAO;aACR,OAAO;eACL,OAAO;gBACN,OAAO;YACX,WAAW;SAmBpB,CAAA;AAWD,eAAO,MAAM,iBAAiB;cAA2B,aAAa;SAQrE,CAAA;AAgED,eAAO,MAAM,UAAU;cACX,OAAO;YACT,WAAW;SAsBpB,CAAA;AAED,eAAO,MAAM,aAAa;cAzBd,OAAO;YACT,WAAW;;;QA4BpB,CAAA;AAuBD,eAAO,MAAM,iBAAiB;cAClB,oBAAoB;;SAmB/B,CAAA;AAUD,eAAO,MAAM,uBAAuB,0GAGnC,CAAA;AAED,eAAO,MAAM,wBAAwB,0GAGpC,CAAA"}
+{"version":3,"file":"InputStyles.d.ts","sourceRoot":"","sources":["../../../packages/input/InputStyles.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,oBAAoB,EAAE,aAAa,EAAE,WAAW,EAAE,MAAM,SAAS,CAAA;AAoG1E,eAAO,MAAM,uBAAuB,0GAGnC,CAAA;AAED,eAAO,MAAM,wBAAwB,0GAGpC,CAAA;AAED,eAAO,MAAM,iBAAiB;gBAChB,OAAO;eACR,OAAO;SAQnB,CAAA;AAuBD,eAAO,MAAM,iBAAiB;YACpB,OAAO;cACL,OAAO;aACR,OAAO;eACL,OAAO;YACV,WAAW;cACT,aAAa;SAmBxB,CAAA;AAED,eAAO,MAAM,wBAAwB,yGAIpC,CAAA;AAgED,eAAO,MAAM,UAAU;cACX,OAAO;YACT,WAAW;SAsBpB,CAAA;AAED,eAAO,MAAM,aAAa;cAzBd,OAAO;YACT,WAAW;;;QA4BpB,CAAA;AAuBD,eAAO,MAAM,iBAAiB;cAClB,oBAAoB;;SAoB/B,CAAA"}

package/dist/types/input/Textarea.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Textarea.d.ts","sourceRoot":"","sources":["../../../packages/input/Textarea.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAmC,MAAM,OAAO,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;AAqFvD,wBAAmC"}
+{"version":3,"file":"Textarea.d.ts","sourceRoot":"","sources":["../../../packages/input/Textarea.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAmC,MAAM,OAAO,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;AA2FvD,wBAAmC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lidofinance/lido-ui",
-  "version": "3.8.0",
+  "version": "3.8.1",
   "homepage": "https://github.com/lidofinance/ui",
   "repository": {
     "type": "git",