@lidofinance/lido-ui 3.7.4 → 3.8.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (42) hide show
  1. package/dist/cjs/input/Input.js +10 -9
  2. package/dist/cjs/input/Input.js.map +1 -1
  3. package/dist/cjs/input/InputGroupStyles.js +11 -19
  4. package/dist/cjs/input/InputGroupStyles.js.map +1 -1
  5. package/dist/cjs/input/InputStyles.js +71 -53
  6. package/dist/cjs/input/InputStyles.js.map +1 -1
  7. package/dist/cjs/input/LabelStyles.js +1 -1
  8. package/dist/cjs/input/LabelStyles.js.map +1 -1
  9. package/dist/cjs/input/Textarea.js +8 -7
  10. package/dist/cjs/input/Textarea.js.map +1 -1
  11. package/dist/cjs/text/Text.js +2 -1
  12. package/dist/cjs/text/Text.js.map +1 -1
  13. package/dist/cjs/text/TextStyles.js +2 -2
  14. package/dist/cjs/text/TextStyles.js.map +1 -1
  15. package/dist/cjs/text/types.js.map +1 -1
  16. package/dist/esm/input/Input.js +11 -10
  17. package/dist/esm/input/Input.js.map +1 -1
  18. package/dist/esm/input/InputGroupStyles.js +11 -19
  19. package/dist/esm/input/InputGroupStyles.js.map +1 -1
  20. package/dist/esm/input/InputStyles.js +67 -50
  21. package/dist/esm/input/InputStyles.js.map +1 -1
  22. package/dist/esm/input/LabelStyles.js +1 -1
  23. package/dist/esm/input/LabelStyles.js.map +1 -1
  24. package/dist/esm/input/Textarea.js +9 -8
  25. package/dist/esm/input/Textarea.js.map +1 -1
  26. package/dist/esm/text/Text.js +2 -1
  27. package/dist/esm/text/Text.js.map +1 -1
  28. package/dist/esm/text/TextStyles.js +2 -2
  29. package/dist/esm/text/TextStyles.js.map +1 -1
  30. package/dist/esm/text/types.js.map +1 -1
  31. package/dist/types/input/Input.d.ts.map +1 -1
  32. package/dist/types/input/InputGroupStyles.d.ts.map +1 -1
  33. package/dist/types/input/InputStyles.d.ts +7 -5
  34. package/dist/types/input/InputStyles.d.ts.map +1 -1
  35. package/dist/types/input/Textarea.d.ts.map +1 -1
  36. package/dist/types/text/Text.d.ts +2 -1
  37. package/dist/types/text/Text.d.ts.map +1 -1
  38. package/dist/types/text/TextStyles.d.ts +3 -2
  39. package/dist/types/text/TextStyles.d.ts.map +1 -1
  40. package/dist/types/text/types.d.ts +2 -0
  41. package/dist/types/text/types.d.ts.map +1 -1
  42. package/package.json +1 -1
@@ -29,17 +29,18 @@ function Input(props, ref) {
29
29
  const hasLeftDecorator = !!leftDecorator;
30
30
  const hasRightDecorator = !!rightDecorator;
31
31
  return /*#__PURE__*/ _react.default.createElement(_inputStyles.InputWrapperStyle, _extends({
32
- $error: hasError,
33
- $warning: hasWarning,
34
- $active: active,
35
32
  $disabled: disabled,
36
33
  $fullwidth: fullwidth,
37
- $color: color,
38
34
  htmlFor: id,
39
35
  ref: wrapperRef
40
- }, wrapperProps), hasLeftDecorator && /*#__PURE__*/ _react.default.createElement(_inputStyles.InputLeftDecoratorStyle, null, leftDecorator), /*#__PURE__*/ _react.default.createElement(_inputStyles.InputContentStyle, {
41
- $variant: variant
42
- }, /*#__PURE__*/ _react.default.createElement(_inputStyles.InputStyle, _extends({
36
+ }, wrapperProps), /*#__PURE__*/ _react.default.createElement(_inputStyles.InputContentStyle, {
37
+ $color: color,
38
+ $variant: variant,
39
+ $error: hasError,
40
+ $warning: hasWarning,
41
+ $active: active,
42
+ $disabled: disabled
43
+ }, hasLeftDecorator && /*#__PURE__*/ _react.default.createElement(_inputStyles.InputLeftDecoratorStyle, null, leftDecorator), /*#__PURE__*/ _react.default.createElement(_inputStyles.InputControlWrapperStyle, null, /*#__PURE__*/ _react.default.createElement(_inputStyles.InputStyle, _extends({
43
44
  $labeled: hasLabel,
44
45
  $color: color,
45
46
  placeholder: placeholder,
@@ -48,7 +49,7 @@ function Input(props, ref) {
48
49
  ref: ref
49
50
  }, rest)), hasLabel && /*#__PURE__*/ _react.default.createElement(_labelStyles.InputLabelStyle, {
50
51
  $color: color
51
- }, label)), hasErrorMessage && /*#__PURE__*/ _react.default.createElement(_inputStyles.InputMessageStyle, {
52
+ }, label)), hasRightDecorator && /*#__PURE__*/ _react.default.createElement(_inputStyles.InputRightDecoratorStyle, null, rightDecorator)), hasErrorMessage && /*#__PURE__*/ _react.default.createElement(_inputStyles.InputMessageStyle, {
52
53
  $variant: "error",
53
54
  $bordered: true
54
55
  }, error), hasWarningMessage && /*#__PURE__*/ _react.default.createElement(_inputStyles.InputMessageStyle, {
@@ -57,7 +58,7 @@ function Input(props, ref) {
57
58
  }, warning), hasSuccessMessage && /*#__PURE__*/ _react.default.createElement(_inputStyles.InputMessageStyle, {
58
59
  $variant: "success",
59
60
  $bordered: true
60
- }, success), hasRightDecorator && /*#__PURE__*/ _react.default.createElement(_inputStyles.InputRightDecoratorStyle, null, rightDecorator));
61
+ }, success));
61
62
  }
62
63
  const _default = /*#__PURE__*/ (0, _react.forwardRef)(Input);
63
64
 
@@ -1 +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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"}
1
+ {"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":"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"}
@@ -14,6 +14,7 @@ _export(exports, {
14
14
  });
15
15
  const _interopRequireDefault = require("@swc/helpers/lib/_interop_require_default.js").default;
16
16
  const _styledComponents = /*#__PURE__*/ _interopRequireDefault(require("styled-components"));
17
+ const _inputStyles = require("./InputStyles");
17
18
  const InputGroupStyle = _styledComponents.default.span`
18
19
  display: inline-flex;
19
20
  position: relative;
@@ -26,31 +27,22 @@ const InputGroupContentStyle = _styledComponents.default.span`
26
27
  display: flex;
27
28
  width: 100%;
28
29
 
29
- & > * {
30
- border-radius: 0px;
30
+ & > ${_inputStyles.InputWrapperStyle} {
31
31
  margin: 0 -1px 0 0;
32
32
 
33
33
  &:first-child {
34
- border-top-left-radius: ${(param)=>{
35
- let { theme } = param;
36
- return theme.borderRadiusesMap.lg;
37
- }}px;
38
- border-bottom-left-radius: ${(param)=>{
39
- let { theme } = param;
40
- return theme.borderRadiusesMap.lg;
41
- }}px;
34
+ & ${_inputStyles.InputContentStyle} {
35
+ border-top-right-radius: 0;
36
+ border-bottom-right-radius: 0;
37
+ }
42
38
  }
43
39
 
44
40
  &:last-child {
45
- margin-right: 0;
46
- border-top-right-radius: ${(param)=>{
47
- let { theme } = param;
48
- return theme.borderRadiusesMap.lg;
49
- }}px;
50
- border-bottom-right-radius: ${(param)=>{
51
- let { theme } = param;
52
- return theme.borderRadiusesMap.lg;
53
- }}px;
41
+ & ${_inputStyles.InputContentStyle} {
42
+ margin-right: 0;
43
+ border-top-left-radius: 0;
44
+ border-bottom-left-radius: 0;
45
+ }
54
46
  }
55
47
  }
56
48
  `;
@@ -1 +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"}
1
+ {"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"}
@@ -9,13 +9,14 @@ function _export(target, all) {
9
9
  });
10
10
  }
11
11
  _export(exports, {
12
+ InputLeftDecoratorStyle: ()=>InputLeftDecoratorStyle,
13
+ InputRightDecoratorStyle: ()=>InputRightDecoratorStyle,
12
14
  InputWrapperStyle: ()=>InputWrapperStyle,
13
15
  InputContentStyle: ()=>InputContentStyle,
16
+ InputControlWrapperStyle: ()=>InputControlWrapperStyle,
14
17
  InputStyle: ()=>InputStyle,
15
18
  TextareaStyle: ()=>TextareaStyle,
16
- InputMessageStyle: ()=>InputMessageStyle,
17
- InputLeftDecoratorStyle: ()=>InputLeftDecoratorStyle,
18
- InputRightDecoratorStyle: ()=>InputRightDecoratorStyle
19
+ InputMessageStyle: ()=>InputMessageStyle
19
20
  });
20
21
  const _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildcard.js").default;
21
22
  const _styledComponents = /*#__PURE__*/ _interopRequireWildcard(require("styled-components"));
@@ -98,30 +99,80 @@ const wrapperColors = {
98
99
  }};
99
100
  `
100
101
  };
102
+ const decoratorCSS = (0, _styledComponents.css)`
103
+ flex-grow: 0;
104
+ flex-shrink: 0;
105
+ cursor: inherit;
106
+ display: flex;
107
+ align-items: center;
108
+ `;
109
+ const InputLeftDecoratorStyle = _styledComponents.default.span`
110
+ ${decoratorCSS}
111
+ padding-right: 16px;
112
+ `;
113
+ const InputRightDecoratorStyle = _styledComponents.default.span`
114
+ ${decoratorCSS}
115
+ padding-left: 16px;
116
+ `;
101
117
  const InputWrapperStyle = _styledComponents.default.label`
102
118
  position: relative;
103
119
  display: inline-flex;
104
- border: 1px solid;
105
- border-radius: ${(param)=>{
106
- let { theme } = param;
107
- return theme.borderRadiusesMap.lg;
108
- }}px;
109
120
  align-items: stretch;
110
121
  box-sizing: border-box;
111
- padding: 0 15px;
112
122
  cursor: ${(param)=>{
113
123
  let { $disabled } = param;
114
124
  return $disabled ? 'default' : 'text';
115
125
  }};
116
- transition: border-color ${(param)=>{
117
- let { theme } = param;
118
- return theme.duration.fast;
119
- }} ease;
120
126
  width: ${(param)=>{
121
127
  let { $fullwidth } = param;
122
128
  return $fullwidth ? '100%' : 'auto';
123
129
  }};
130
+ `;
131
+ const contentVariants = {
132
+ default: (0, _styledComponents.css)`
133
+ padding-top: 17px;
134
+ padding-bottom: 17px;
135
+
136
+ & ${InputLeftDecoratorStyle}, & ${InputRightDecoratorStyle} {
137
+ margin-top: -17px;
138
+ margin-bottom: -17px;
139
+ }
140
+ `,
141
+ small: (0, _styledComponents.css)`
142
+ padding-top: 9px;
143
+ padding-bottom: 9px;
144
+
145
+ & ${InputLeftDecoratorStyle}, & ${InputRightDecoratorStyle} {
146
+ padding-top: -9px;
147
+ padding-bottom: -9px;
148
+ }
149
+ `
150
+ };
151
+ const InputContentStyle = _styledComponents.default.span`
152
+ position: relative;
153
+ display: flex;
154
+ flex-grow: 1;
155
+ padding-left: 15px;
156
+ padding-right: 15px;
157
+ font-weight: 400;
158
+ font-size: ${(param)=>{
159
+ let { theme } = param;
160
+ return theme.fontSizesMap.xs;
161
+ }}px;
162
+ border: 1px solid;
163
+ border-radius: ${(param)=>{
164
+ let { theme } = param;
165
+ return theme.borderRadiusesMap.lg;
166
+ }}px;
167
+ transition: border-color ${(param)=>{
168
+ let { theme } = param;
169
+ return theme.duration.fast;
170
+ }} ease;
124
171
 
172
+ ${(param)=>{
173
+ let { $variant } = param;
174
+ return contentVariants[$variant];
175
+ }};
125
176
  ${(param)=>{
126
177
  let { $color } = param;
127
178
  return wrapperColors[$color];
@@ -129,43 +180,24 @@ const InputWrapperStyle = _styledComponents.default.label`
129
180
  ${(param)=>{
130
181
  let { $disabled } = param;
131
182
  return $disabled ? '' : statesCSS;
132
- }}
133
-
183
+ }};
134
184
  ${(param)=>{
135
185
  let { $active } = param;
136
186
  return $active ? activeCSS : '';
137
- }}
187
+ }};
138
188
  ${(param)=>{
139
189
  let { $warning } = param;
140
190
  return $warning ? warningCSS : '';
141
- }}
191
+ }};
142
192
  ${(param)=>{
143
193
  let { $error } = param;
144
194
  return $error ? errorCSS : '';
145
- }}
195
+ }};
146
196
  `;
147
- const contentVariants = {
148
- default: (0, _styledComponents.css)`
149
- padding: 17px 0;
150
- `,
151
- small: (0, _styledComponents.css)`
152
- padding: 9px 0;
153
- `
154
- };
155
- const InputContentStyle = _styledComponents.default.span`
156
- font-weight: 400;
157
- font-size: ${(param)=>{
158
- let { theme } = param;
159
- return theme.fontSizesMap.xs;
160
- }}px;
197
+ const InputControlWrapperStyle = _styledComponents.default.div`
198
+ position: relative;
161
199
  display: flex;
162
200
  flex-grow: 1;
163
- position: relative;
164
-
165
- ${(param)=>{
166
- let { $variant } = param;
167
- return contentVariants[$variant];
168
- }};
169
201
  `;
170
202
  const labeledCSS = (0, _styledComponents.css)`
171
203
  &:not(:focus):placeholder-shown {
@@ -325,26 +357,12 @@ const InputMessageStyle = _styledComponents.default.span`
325
357
  let { $bordered } = param;
326
358
  return $bordered ? 'calc(100% + 2px)' : '100%';
327
359
  }};
360
+ z-index: 3;
328
361
 
329
362
  ${(param)=>{
330
363
  let { $variant } = param;
331
364
  return messageVariants[$variant];
332
365
  }}
333
366
  `;
334
- const decoratorCSS = (0, _styledComponents.css)`
335
- flex-grow: 0;
336
- flex-shrink: 0;
337
- cursor: inherit;
338
- display: flex;
339
- align-items: center;
340
- `;
341
- const InputLeftDecoratorStyle = _styledComponents.default.span`
342
- ${decoratorCSS}
343
- padding-right: 16px;
344
- `;
345
- const InputRightDecoratorStyle = _styledComponents.default.span`
346
- ${decoratorCSS}
347
- padding-left: 16px;
348
- `;
349
367
 
350
368
  //# sourceMappingURL=InputStyles.js.map
@@ -1 +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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"}
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\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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"}
@@ -76,7 +76,7 @@ const InputLabelStyle = _styledComponents.default.span`
76
76
  ${labelFilledValueCSS};
77
77
  `;
78
78
  const TextareaLabelStyle = (0, _styledComponents.default)(InputLabelStyle)`
79
- top: 27px;
79
+ top: 10px;
80
80
  `;
81
81
 
82
82
  //# sourceMappingURL=LabelStyles.js.map
@@ -1 +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"}
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: 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"}
@@ -27,17 +27,18 @@ function Textarea(props, ref) {
27
27
  const hasSuccess = !!success && !error;
28
28
  const hasSuccessMessage = hasSuccess && typeof success !== 'boolean';
29
29
  return /*#__PURE__*/ _react.default.createElement(_inputStyles.InputWrapperStyle, _extends({
30
- $error: hasError,
31
- $warning: hasWarning,
32
- $active: active,
33
30
  $disabled: disabled,
34
31
  $fullwidth: fullwidth,
35
- $color: color,
36
32
  htmlFor: id,
37
33
  ref: wrapperRef
38
34
  }, wrapperProps), /*#__PURE__*/ _react.default.createElement(_inputStyles.InputContentStyle, {
39
- $variant: variant
40
- }, /*#__PURE__*/ _react.default.createElement(_inputStyles.TextareaStyle, _extends({
35
+ $color: color,
36
+ $variant: variant,
37
+ $error: hasError,
38
+ $warning: hasWarning,
39
+ $active: active,
40
+ $disabled: disabled
41
+ }, /*#__PURE__*/ _react.default.createElement(_inputStyles.InputControlWrapperStyle, null, /*#__PURE__*/ _react.default.createElement(_inputStyles.TextareaStyle, _extends({
41
42
  $labeled: hasLabel,
42
43
  $color: color,
43
44
  placeholder: placeholder,
@@ -45,7 +46,7 @@ function Textarea(props, ref) {
45
46
  ref: ref
46
47
  }, rest)), hasLabel && /*#__PURE__*/ _react.default.createElement(_labelStyles.TextareaLabelStyle, {
47
48
  $color: color
48
- }, label)), hasErrorMessage && /*#__PURE__*/ _react.default.createElement(_inputStyles.InputMessageStyle, {
49
+ }, label))), hasErrorMessage && /*#__PURE__*/ _react.default.createElement(_inputStyles.InputMessageStyle, {
49
50
  $variant: "error",
50
51
  $bordered: true
51
52
  }, error), hasWarningMessage && /*#__PURE__*/ _react.default.createElement(_inputStyles.InputMessageStyle, {
@@ -1 +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"}
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 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"}
@@ -11,9 +11,10 @@ const _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildc
11
11
  const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
12
12
  const _textStyles = require("./TextStyles");
13
13
  function Text(props, ref) {
14
- const { size ='md' , color ='default' , ...rest } = props;
14
+ const { size ='md' , weight =400 , color ='default' , strong , ...rest } = props;
15
15
  return /*#__PURE__*/ _react.default.createElement(_textStyles.TextStyle, _extends({
16
16
  size: size,
17
+ weight: strong ? 700 : weight,
17
18
  color: color,
18
19
  ref: ref
19
20
  }, rest));
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../packages/text/Text.tsx"],"sourcesContent":["import React, { ForwardedRef, forwardRef } from 'react'\nimport { TextStyle } from './TextStyles'\nimport { TextProps } from './types'\n\nfunction Text(props: TextProps, ref?: ForwardedRef<HTMLParagraphElement>) {\n const { size = 'md', color = 'default', ...rest } = props\n return <TextStyle size={size} color={color} ref={ref} {...rest} />\n}\n\nexport default forwardRef(Text)\n"],"names":["Text","props","ref","size","color","rest","TextStyle","forwardRef"],"mappings":"AAAA;;;;+BASA,SAA+B;;aAA/B,QAA+B;;;;6DATiB,OAAO;4BAC7B,cAAc;AAGxC,SAASA,IAAI,CAACC,KAAgB,EAAEC,GAAwC,EAAE;IACxE,MAAM,EAAEC,IAAI,EAAG,IAAI,CAAA,EAAEC,KAAK,EAAG,SAAS,CAAA,EAAE,GAAGC,IAAI,EAAE,GAAGJ,KAAK;IACzD,qBAAO,6BAACK,WAAS,UAAA;QAACH,IAAI,EAAEA,IAAI;QAAEC,KAAK,EAAEA,KAAK;QAAEF,GAAG,EAAEA,GAAG;OAAMG,IAAI,EAAI,CAAA;AACpE,CAAC;MAED,QAA+B,iBAAhBE,IAAAA,MAAU,WAAA,EAACP,IAAI,CAAC"}
1
+ {"version":3,"sources":["../../../packages/text/Text.tsx"],"sourcesContent":["import React, { ForwardedRef, forwardRef } from 'react'\nimport { TextStyle } from './TextStyles'\nimport { TextProps } from './types'\n\nfunction Text(props: TextProps, ref?: ForwardedRef<HTMLParagraphElement>) {\n const {\n size = 'md',\n weight = 400,\n color = 'default',\n strong,\n ...rest\n } = props\n return (\n <TextStyle\n size={size}\n weight={strong ? 700 : weight}\n color={color}\n ref={ref}\n {...rest}\n />\n )\n}\n\nexport default forwardRef(Text)\n"],"names":["Text","props","ref","size","weight","color","strong","rest","TextStyle","forwardRef"],"mappings":"AAAA;;;;+BAuBA,SAA+B;;aAA/B,QAA+B;;;;6DAvBiB,OAAO;4BAC7B,cAAc;AAGxC,SAASA,IAAI,CAACC,KAAgB,EAAEC,GAAwC,EAAE;IACxE,MAAM,EACJC,IAAI,EAAG,IAAI,CAAA,EACXC,MAAM,EAAG,GAAG,CAAA,EACZC,KAAK,EAAG,SAAS,CAAA,EACjBC,MAAM,CAAA,EACN,GAAGC,IAAI,EACR,GAAGN,KAAK;IACT,qBACE,6BAACO,WAAS,UAAA;QACRL,IAAI,EAAEA,IAAI;QACVC,MAAM,EAAEE,MAAM,GAAG,GAAG,GAAGF,MAAM;QAC7BC,KAAK,EAAEA,KAAK;QACZH,GAAG,EAAEA,GAAG;OACJK,IAAI,EACR,CACH;AACH,CAAC;MAED,QAA+B,iBAAhBE,IAAAA,MAAU,WAAA,EAACT,IAAI,CAAC"}
@@ -83,10 +83,10 @@ const getTextDecoration = (props)=>{
83
83
  };
84
84
  const TextStyle = _styledComponents.default.p`
85
85
  ${(param)=>{
86
- let { strong , italic , size } = param;
86
+ let { weight , italic , size } = param;
87
87
  return (0, _styledComponents.css)`
88
88
  font-style: ${italic ? 'italic' : 'normal'};
89
- font-weight: ${strong ? 700 : 400};
89
+ font-weight: ${weight};
90
90
  margin: 0;
91
91
  padding: 0;
92
92
  color: ${getTextColor};
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../packages/text/TextStyles.tsx"],"sourcesContent":["import styled, { css } from 'styled-components'\nimport { Theme } from '@lidofinance/theme'\nimport { TextColors, TextProps, TextSizes } from './types'\n\nexport const sizes = {\n xxs: css`\n font-size: ${({ theme }) => theme.fontSizesMap.xxs}px;\n line-height: 1.5em;\n `,\n xs: css`\n font-size: ${({ theme }) => theme.fontSizesMap.xs}px;\n line-height: 1.5em;\n `,\n sm: css`\n font-size: ${({ theme }) => theme.fontSizesMap.sm}px;\n line-height: 1.5em;\n `,\n md: css`\n font-size: ${({ theme }) => theme.fontSizesMap.md}px;\n line-height: 1.5em;\n `,\n lg: css`\n font-size: ${({ theme }) => theme.fontSizesMap.lg}px;\n line-height: 1.4em;\n `,\n xl: css`\n font-size: ${({ theme }) => theme.fontSizesMap.xl}px;\n line-height: 1.4em;\n `,\n}\n\ntype InjectedProps = {\n color: TextColors\n size: TextSizes\n theme: Theme\n} & Omit<TextProps, 'color' | 'size'>\n\nconst getTextColor = (props: InjectedProps) => {\n const {\n theme: { colors },\n color,\n } = props\n\n const colorsMap = {\n default: colors.text,\n secondary: colors.textSecondary,\n primary: colors.primary,\n warning: colors.warning,\n error: colors.error,\n success: colors.success,\n }\n\n return colorsMap[color]\n}\n\nconst getTextDecoration = (props: InjectedProps) => {\n const { underline, strikeThrough } = props\n\n switch (true) {\n case underline:\n return 'underline'\n\n case strikeThrough:\n return 'line-through'\n\n default:\n return 'none'\n }\n}\n\nexport const TextStyle = styled.p<InjectedProps>`\n ${({ strong, italic, size }) => css`\n font-style: ${italic ? 'italic' : 'normal'};\n font-weight: ${strong ? 700 : 400};\n margin: 0;\n padding: 0;\n color: ${getTextColor};\n text-decoration: ${getTextDecoration};\n ${sizes[size]}\n `}\n`\n"],"names":["sizes","TextStyle","xxs","css","theme","fontSizesMap","xs","sm","md","lg","xl","getTextColor","props","colors","color","colorsMap","default","text","secondary","textSecondary","primary","warning","error","success","getTextDecoration","underline","strikeThrough","styled","p","strong","italic","size"],"mappings":"AAAA;;;;;;;;;;;IAIaA,KAAK,MAALA,KAAK;IAkELC,SAAS,MAATA,SAAS;;;wEAtEM,mBAAmB;AAIxC,MAAMD,KAAK,GAAG;IACnBE,GAAG,EAAEC,IAAAA,iBAAG,IAAA,CAAA,CAAC;eACI,EAAE,SAAeC;YAAd,EAAEA,KAAK,CAAA,EAAE;eAAKA,KAAK,CAACC,YAAY,CAACH,GAAG;IAAD,CAAC,CAAC;;EAErD,CAAC;IACDI,EAAE,EAAEH,IAAAA,iBAAG,IAAA,CAAA,CAAC;eACK,EAAE,SAAeC;YAAd,EAAEA,KAAK,CAAA,EAAE;eAAKA,KAAK,CAACC,YAAY,CAACC,EAAE;IAAD,CAAC,CAAC;;EAEpD,CAAC;IACDC,EAAE,EAAEJ,IAAAA,iBAAG,IAAA,CAAA,CAAC;eACK,EAAE,SAAeC;YAAd,EAAEA,KAAK,CAAA,EAAE;eAAKA,KAAK,CAACC,YAAY,CAACE,EAAE;IAAD,CAAC,CAAC;;EAEpD,CAAC;IACDC,EAAE,EAAEL,IAAAA,iBAAG,IAAA,CAAA,CAAC;eACK,EAAE,SAAeC;YAAd,EAAEA,KAAK,CAAA,EAAE;eAAKA,KAAK,CAACC,YAAY,CAACG,EAAE;IAAD,CAAC,CAAC;;EAEpD,CAAC;IACDC,EAAE,EAAEN,IAAAA,iBAAG,IAAA,CAAA,CAAC;eACK,EAAE,SAAeC;YAAd,EAAEA,KAAK,CAAA,EAAE;eAAKA,KAAK,CAACC,YAAY,CAACI,EAAE;IAAD,CAAC,CAAC;;EAEpD,CAAC;IACDC,EAAE,EAAEP,IAAAA,iBAAG,IAAA,CAAA,CAAC;eACK,EAAE,SAAeC;YAAd,EAAEA,KAAK,CAAA,EAAE;eAAKA,KAAK,CAACC,YAAY,CAACK,EAAE;IAAD,CAAC,CAAC;;EAEpD,CAAC;CACF;AAQD,MAAMC,YAAY,GAAG,CAACC,KAAoB,GAAK;IAC7C,MAAM,EACJR,KAAK,EAAE,EAAES,MAAM,CAAA,EAAE,CAAA,EACjBC,KAAK,CAAA,IACN,GAAGF,KAAK;IAET,MAAMG,SAAS,GAAG;QAChBC,OAAO,EAAEH,MAAM,CAACI,IAAI;QACpBC,SAAS,EAAEL,MAAM,CAACM,aAAa;QAC/BC,OAAO,EAAEP,MAAM,CAACO,OAAO;QACvBC,OAAO,EAAER,MAAM,CAACQ,OAAO;QACvBC,KAAK,EAAET,MAAM,CAACS,KAAK;QACnBC,OAAO,EAAEV,MAAM,CAACU,OAAO;KACxB;IAED,OAAOR,SAAS,CAACD,KAAK,CAAC,CAAA;AACzB,CAAC;AAED,MAAMU,iBAAiB,GAAG,CAACZ,KAAoB,GAAK;IAClD,MAAM,EAAEa,SAAS,CAAA,EAAEC,aAAa,CAAA,EAAE,GAAGd,KAAK;IAE1C,OAAQ,IAAI;QACV,KAAKa,SAAS;YACZ,OAAO,WAAW,CAAA;QAEpB,KAAKC,aAAa;YAChB,OAAO,cAAc,CAAA;QAEvB;YACE,OAAO,MAAM,CAAA;KAChB;AACH,CAAC;AAEM,MAAMzB,SAAS,GAAG0B,iBAAM,QAAA,CAACC,CAAC,AAAe,CAAC;EAC/C,EAAE,SAA8BzB;QAA7B,EAAE0B,MAAM,CAAA,EAAEC,MAAM,CAAA,EAAEC,IAAI,CAAA,EAAE;WAAK5B,IAAAA,iBAAG,IAAA,CAAA,CAAC;gBACtB,EAAE2B,MAAM,GAAG,QAAQ,GAAG,QAAQ,CAAC;iBAC9B,EAAED,MAAM,GAAG,GAAG,GAAG,GAAG,CAAC;;;WAG3B,EAAElB,YAAY,CAAC;qBACL,EAAEa,iBAAiB,CAAC;IACrC,EAAExB,KAAK,CAAC+B,IAAI,CAAC,CAAC;EAChB,CAAC;AAAD,CAAC,CAAC;AACJ,CAAC"}
1
+ {"version":3,"sources":["../../../packages/text/TextStyles.tsx"],"sourcesContent":["import styled, { css } from 'styled-components'\nimport { Theme } from '@lidofinance/theme'\nimport { TextColors, TextProps, TextSizes, TextWeight } from './types'\n\nexport const sizes = {\n xxs: css`\n font-size: ${({ theme }) => theme.fontSizesMap.xxs}px;\n line-height: 1.5em;\n `,\n xs: css`\n font-size: ${({ theme }) => theme.fontSizesMap.xs}px;\n line-height: 1.5em;\n `,\n sm: css`\n font-size: ${({ theme }) => theme.fontSizesMap.sm}px;\n line-height: 1.5em;\n `,\n md: css`\n font-size: ${({ theme }) => theme.fontSizesMap.md}px;\n line-height: 1.5em;\n `,\n lg: css`\n font-size: ${({ theme }) => theme.fontSizesMap.lg}px;\n line-height: 1.4em;\n `,\n xl: css`\n font-size: ${({ theme }) => theme.fontSizesMap.xl}px;\n line-height: 1.4em;\n `,\n}\n\ntype InjectedProps = {\n color: TextColors\n size: TextSizes\n weight: TextWeight\n theme: Theme\n} & Omit<TextProps, 'color' | 'size' | 'strong' | 'weight'>\n\nconst getTextColor = (props: InjectedProps) => {\n const {\n theme: { colors },\n color,\n } = props\n\n const colorsMap = {\n default: colors.text,\n secondary: colors.textSecondary,\n primary: colors.primary,\n warning: colors.warning,\n error: colors.error,\n success: colors.success,\n }\n\n return colorsMap[color]\n}\n\nconst getTextDecoration = (props: InjectedProps) => {\n const { underline, strikeThrough } = props\n\n switch (true) {\n case underline:\n return 'underline'\n\n case strikeThrough:\n return 'line-through'\n\n default:\n return 'none'\n }\n}\n\nexport const TextStyle = styled.p<InjectedProps>`\n ${({ weight, italic, size }) => css`\n font-style: ${italic ? 'italic' : 'normal'};\n font-weight: ${weight};\n margin: 0;\n padding: 0;\n color: ${getTextColor};\n text-decoration: ${getTextDecoration};\n ${sizes[size]}\n `}\n`\n"],"names":["sizes","TextStyle","xxs","css","theme","fontSizesMap","xs","sm","md","lg","xl","getTextColor","props","colors","color","colorsMap","default","text","secondary","textSecondary","primary","warning","error","success","getTextDecoration","underline","strikeThrough","styled","p","weight","italic","size"],"mappings":"AAAA;;;;;;;;;;;IAIaA,KAAK,MAALA,KAAK;IAmELC,SAAS,MAATA,SAAS;;;wEAvEM,mBAAmB;AAIxC,MAAMD,KAAK,GAAG;IACnBE,GAAG,EAAEC,IAAAA,iBAAG,IAAA,CAAA,CAAC;eACI,EAAE,SAAeC;YAAd,EAAEA,KAAK,CAAA,EAAE;eAAKA,KAAK,CAACC,YAAY,CAACH,GAAG;IAAD,CAAC,CAAC;;EAErD,CAAC;IACDI,EAAE,EAAEH,IAAAA,iBAAG,IAAA,CAAA,CAAC;eACK,EAAE,SAAeC;YAAd,EAAEA,KAAK,CAAA,EAAE;eAAKA,KAAK,CAACC,YAAY,CAACC,EAAE;IAAD,CAAC,CAAC;;EAEpD,CAAC;IACDC,EAAE,EAAEJ,IAAAA,iBAAG,IAAA,CAAA,CAAC;eACK,EAAE,SAAeC;YAAd,EAAEA,KAAK,CAAA,EAAE;eAAKA,KAAK,CAACC,YAAY,CAACE,EAAE;IAAD,CAAC,CAAC;;EAEpD,CAAC;IACDC,EAAE,EAAEL,IAAAA,iBAAG,IAAA,CAAA,CAAC;eACK,EAAE,SAAeC;YAAd,EAAEA,KAAK,CAAA,EAAE;eAAKA,KAAK,CAACC,YAAY,CAACG,EAAE;IAAD,CAAC,CAAC;;EAEpD,CAAC;IACDC,EAAE,EAAEN,IAAAA,iBAAG,IAAA,CAAA,CAAC;eACK,EAAE,SAAeC;YAAd,EAAEA,KAAK,CAAA,EAAE;eAAKA,KAAK,CAACC,YAAY,CAACI,EAAE;IAAD,CAAC,CAAC;;EAEpD,CAAC;IACDC,EAAE,EAAEP,IAAAA,iBAAG,IAAA,CAAA,CAAC;eACK,EAAE,SAAeC;YAAd,EAAEA,KAAK,CAAA,EAAE;eAAKA,KAAK,CAACC,YAAY,CAACK,EAAE;IAAD,CAAC,CAAC;;EAEpD,CAAC;CACF;AASD,MAAMC,YAAY,GAAG,CAACC,KAAoB,GAAK;IAC7C,MAAM,EACJR,KAAK,EAAE,EAAES,MAAM,CAAA,EAAE,CAAA,EACjBC,KAAK,CAAA,IACN,GAAGF,KAAK;IAET,MAAMG,SAAS,GAAG;QAChBC,OAAO,EAAEH,MAAM,CAACI,IAAI;QACpBC,SAAS,EAAEL,MAAM,CAACM,aAAa;QAC/BC,OAAO,EAAEP,MAAM,CAACO,OAAO;QACvBC,OAAO,EAAER,MAAM,CAACQ,OAAO;QACvBC,KAAK,EAAET,MAAM,CAACS,KAAK;QACnBC,OAAO,EAAEV,MAAM,CAACU,OAAO;KACxB;IAED,OAAOR,SAAS,CAACD,KAAK,CAAC,CAAA;AACzB,CAAC;AAED,MAAMU,iBAAiB,GAAG,CAACZ,KAAoB,GAAK;IAClD,MAAM,EAAEa,SAAS,CAAA,EAAEC,aAAa,CAAA,EAAE,GAAGd,KAAK;IAE1C,OAAQ,IAAI;QACV,KAAKa,SAAS;YACZ,OAAO,WAAW,CAAA;QAEpB,KAAKC,aAAa;YAChB,OAAO,cAAc,CAAA;QAEvB;YACE,OAAO,MAAM,CAAA;KAChB;AACH,CAAC;AAEM,MAAMzB,SAAS,GAAG0B,iBAAM,QAAA,CAACC,CAAC,AAAe,CAAC;EAC/C,EAAE,SAA8BzB;QAA7B,EAAE0B,MAAM,CAAA,EAAEC,MAAM,CAAA,EAAEC,IAAI,CAAA,EAAE;WAAK5B,IAAAA,iBAAG,IAAA,CAAA,CAAC;gBACtB,EAAE2B,MAAM,GAAG,QAAQ,GAAG,QAAQ,CAAC;iBAC9B,EAAED,MAAM,CAAC;;;WAGf,EAAElB,YAAY,CAAC;qBACL,EAAEa,iBAAiB,CAAC;IACrC,EAAExB,KAAK,CAAC+B,IAAI,CAAC,CAAC;EAChB,CAAC;AAAD,CAAC,CAAC;AACJ,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../packages/text/types.ts"],"sourcesContent":["import { LidoComponentProps } from '@lidofinance/utils'\n\nexport enum TextColor {\n default,\n secondary,\n primary,\n warning,\n error,\n success,\n}\nexport type TextColors = keyof typeof TextColor\n\nexport enum TextSize {\n xxs,\n xs,\n sm,\n md,\n lg,\n xl,\n}\nexport type TextSizes = keyof typeof TextSize\n\nexport type TextProps = LidoComponentProps<\n 'p',\n {\n color?: TextColors\n size?: TextSizes\n underline?: boolean\n strikeThrough?: boolean\n strong?: boolean\n italic?: boolean\n }\n>\n"],"names":["TextColor","default","secondary","primary","warning","error","success","TextSize","xxs","xs","sm","md","lg","xl"],"mappings":"AAAA;;;;;;;;;;;;;;IAEO,SAON;UAPWA,SAAS;IAATA,SAAS,CAATA,SAAS,CACnBC,SAAO,IAAPA,CAAO,IAAPA,SAAO;IADGD,SAAS,CAATA,SAAS,CAEnBE,WAAS,IAATA,CAAS,IAATA,WAAS;IAFCF,SAAS,CAATA,SAAS,CAGnBG,SAAO,IAAPA,CAAO,IAAPA,SAAO;IAHGH,SAAS,CAATA,SAAS,CAInBI,SAAO,IAAPA,CAAO,IAAPA,SAAO;IAJGJ,SAAS,CAATA,SAAS,CAKnBK,OAAK,IAALA,CAAK,IAALA,OAAK;IALKL,SAAS,CAATA,SAAS,CAMnBM,SAAO,IAAPA,CAAO,IAAPA,SAAO;GANGN,SAAS,KAATA,SAAS;IAUd,QAON;UAPWO,QAAQ;IAARA,QAAQ,CAARA,QAAQ,CAClBC,KAAG,IAAHA,CAAG,IAAHA,KAAG;IADOD,QAAQ,CAARA,QAAQ,CAElBE,IAAE,IAAFA,CAAE,IAAFA,IAAE;IAFQF,QAAQ,CAARA,QAAQ,CAGlBG,IAAE,IAAFA,CAAE,IAAFA,IAAE;IAHQH,QAAQ,CAARA,QAAQ,CAIlBI,IAAE,IAAFA,CAAE,IAAFA,IAAE;IAJQJ,QAAQ,CAARA,QAAQ,CAKlBK,IAAE,IAAFA,CAAE,IAAFA,IAAE;IALQL,QAAQ,CAARA,QAAQ,CAMlBM,IAAE,IAAFA,CAAE,IAAFA,IAAE;GANQN,QAAQ,KAARA,QAAQ"}
1
+ {"version":3,"sources":["../../../packages/text/types.ts"],"sourcesContent":["import { LidoComponentProps } from '@lidofinance/utils'\n\nexport enum TextColor {\n default,\n secondary,\n primary,\n warning,\n error,\n success,\n}\nexport type TextColors = keyof typeof TextColor\n\nexport enum TextSize {\n xxs,\n xs,\n sm,\n md,\n lg,\n xl,\n}\nexport type TextSizes = keyof typeof TextSize\n\nexport type TextWeight = 400 | 500 | 700 | 800 | string | number\n\nexport type TextProps = LidoComponentProps<\n 'p',\n {\n color?: TextColors\n size?: TextSizes\n weight?: TextWeight\n underline?: boolean\n strikeThrough?: boolean\n strong?: boolean\n italic?: boolean\n }\n>\n"],"names":["TextColor","default","secondary","primary","warning","error","success","TextSize","xxs","xs","sm","md","lg","xl"],"mappings":"AAAA;;;;;;;;;;;;;;IAEO,SAON;UAPWA,SAAS;IAATA,SAAS,CAATA,SAAS,CACnBC,SAAO,IAAPA,CAAO,IAAPA,SAAO;IADGD,SAAS,CAATA,SAAS,CAEnBE,WAAS,IAATA,CAAS,IAATA,WAAS;IAFCF,SAAS,CAATA,SAAS,CAGnBG,SAAO,IAAPA,CAAO,IAAPA,SAAO;IAHGH,SAAS,CAATA,SAAS,CAInBI,SAAO,IAAPA,CAAO,IAAPA,SAAO;IAJGJ,SAAS,CAATA,SAAS,CAKnBK,OAAK,IAALA,CAAK,IAALA,OAAK;IALKL,SAAS,CAATA,SAAS,CAMnBM,SAAO,IAAPA,CAAO,IAAPA,SAAO;GANGN,SAAS,KAATA,SAAS;IAUd,QAON;UAPWO,QAAQ;IAARA,QAAQ,CAARA,QAAQ,CAClBC,KAAG,IAAHA,CAAG,IAAHA,KAAG;IADOD,QAAQ,CAARA,QAAQ,CAElBE,IAAE,IAAFA,CAAE,IAAFA,IAAE;IAFQF,QAAQ,CAARA,QAAQ,CAGlBG,IAAE,IAAFA,CAAE,IAAFA,IAAE;IAHQH,QAAQ,CAARA,QAAQ,CAIlBI,IAAE,IAAFA,CAAE,IAAFA,IAAE;IAJQJ,QAAQ,CAARA,QAAQ,CAKlBK,IAAE,IAAFA,CAAE,IAAFA,IAAE;IALQL,QAAQ,CAARA,QAAQ,CAMlBM,IAAE,IAAFA,CAAE,IAAFA,IAAE;GANQN,QAAQ,KAARA,QAAQ"}
@@ -1,6 +1,6 @@
1
1
  import _extends from "@swc/helpers/src/_extends.mjs";
2
2
  import React, { forwardRef } from "react";
3
- import { InputWrapperStyle, InputContentStyle, InputStyle, InputLeftDecoratorStyle, InputRightDecoratorStyle, InputMessageStyle } from "./InputStyles";
3
+ import { InputWrapperStyle, InputContentStyle, InputControlWrapperStyle, InputStyle, InputLeftDecoratorStyle, InputRightDecoratorStyle, InputMessageStyle } from "./InputStyles";
4
4
  import { InputLabelStyle } from "./LabelStyles";
5
5
  function Input(props, ref) {
6
6
  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) {
20
20
  const hasLeftDecorator = !!leftDecorator;
21
21
  const hasRightDecorator = !!rightDecorator;
22
22
  return /*#__PURE__*/ React.createElement(InputWrapperStyle, _extends({
23
- $error: hasError,
24
- $warning: hasWarning,
25
- $active: active,
26
23
  $disabled: disabled,
27
24
  $fullwidth: fullwidth,
28
- $color: color,
29
25
  htmlFor: id,
30
26
  ref: wrapperRef
31
- }, wrapperProps), hasLeftDecorator && /*#__PURE__*/ React.createElement(InputLeftDecoratorStyle, null, leftDecorator), /*#__PURE__*/ React.createElement(InputContentStyle, {
32
- $variant: variant
33
- }, /*#__PURE__*/ React.createElement(InputStyle, _extends({
27
+ }, wrapperProps), /*#__PURE__*/ React.createElement(InputContentStyle, {
28
+ $color: color,
29
+ $variant: variant,
30
+ $error: hasError,
31
+ $warning: hasWarning,
32
+ $active: active,
33
+ $disabled: disabled
34
+ }, hasLeftDecorator && /*#__PURE__*/ React.createElement(InputLeftDecoratorStyle, null, leftDecorator), /*#__PURE__*/ React.createElement(InputControlWrapperStyle, null, /*#__PURE__*/ React.createElement(InputStyle, _extends({
34
35
  $labeled: hasLabel,
35
36
  $color: color,
36
37
  placeholder: placeholder,
@@ -39,7 +40,7 @@ function Input(props, ref) {
39
40
  ref: ref
40
41
  }, rest)), hasLabel && /*#__PURE__*/ React.createElement(InputLabelStyle, {
41
42
  $color: color
42
- }, label)), hasErrorMessage && /*#__PURE__*/ React.createElement(InputMessageStyle, {
43
+ }, label)), hasRightDecorator && /*#__PURE__*/ React.createElement(InputRightDecoratorStyle, null, rightDecorator)), hasErrorMessage && /*#__PURE__*/ React.createElement(InputMessageStyle, {
43
44
  $variant: "error",
44
45
  $bordered: true
45
46
  }, error), hasWarningMessage && /*#__PURE__*/ React.createElement(InputMessageStyle, {
@@ -48,7 +49,7 @@ function Input(props, ref) {
48
49
  }, warning), hasSuccessMessage && /*#__PURE__*/ React.createElement(InputMessageStyle, {
49
50
  $variant: "success",
50
51
  $bordered: true
51
- }, success), hasRightDecorator && /*#__PURE__*/ React.createElement(InputRightDecoratorStyle, null, rightDecorator));
52
+ }, success));
52
53
  }
53
54
  export default /*#__PURE__*/ forwardRef(Input);
54
55