labsense-ui-kit 1.1.18 → 1.1.20
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/Container&Span/StyledComponents.d.ts +2 -0
- package/dist/Inputs/TextArea.d.ts +1 -0
- package/dist/Inputs/TextField.d.ts +1 -0
- package/dist/index.js +124 -108
- package/dist/index.js.map +1 -1
- package/dist/index.modern.js +124 -108
- package/dist/index.modern.js.map +1 -1
- package/package.json +1 -1
|
@@ -35,11 +35,13 @@ export declare const Container: import("styled-components/dist/types").IStyledCo
|
|
|
35
35
|
$borderRadius?: string | undefined;
|
|
36
36
|
$borderTopLeftRadius?: string | undefined;
|
|
37
37
|
$borderTopRightRadius?: string | undefined;
|
|
38
|
+
$borderTop?: string | undefined;
|
|
38
39
|
$borderBottom?: string | undefined;
|
|
39
40
|
$borderLeft?: string | undefined;
|
|
40
41
|
$fontWeight?: string | undefined;
|
|
41
42
|
$hoverBackground?: string | undefined;
|
|
42
43
|
$hoverColor?: string | undefined;
|
|
44
|
+
$transition?: string | undefined;
|
|
43
45
|
}>> & string;
|
|
44
46
|
export declare const Span: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {
|
|
45
47
|
$fontFamily?: string | undefined;
|
package/dist/index.js
CHANGED
|
@@ -2971,7 +2971,7 @@ var Icon = function Icon(_ref2) {
|
|
|
2971
2971
|
};
|
|
2972
2972
|
|
|
2973
2973
|
var _templateObject$1, _templateObject2$1;
|
|
2974
|
-
var Container = styled__default.div(_templateObject$1 || (_templateObject$1 = _taggedTemplateLiteralLoose(["\n display: flex;\n flex: ", ";\n flex-wrap: ", ";\n flex-direction: ", ";\n justify-content: ", ";\n align-items: ", "; \n gap: ", ";\n font-weight: ", ";\n height: ", ";\n min-height: ", ";\n max-height: ", ";\n width: ", ";\n min-width: ", ";\n max-width: ", ";\n padding: ", ";\n background: ", ";\n object-fit:", ";\n margin: ", ";\n border-radius: ", ";\n border-top-left-radius: ", ";\n border-top-right-radius: ", ";\n cursor: ", ";\n font-size: ", ";\n opacity: ", ";\n pointer-events: ", ";\n position: ", ";\n top: ", ";\n bottom: ", ";\n left: ", ";\n right: ", ";\n text-align: ", "; \n color: ", "; \n overflow: ", ";\n overflow-y: ", ";\n z-index: ", "; \n scrollbar-width: ", ";\n border: ", "; \n border-bottom: ", ";\n border-left: ", ";\n\n &:hover {\n background: ", ";\n color: ", ";\n }\n"])), function (_ref) {
|
|
2974
|
+
var Container = styled__default.div(_templateObject$1 || (_templateObject$1 = _taggedTemplateLiteralLoose(["\n display: flex;\n flex: ", ";\n flex-wrap: ", ";\n flex-direction: ", ";\n justify-content: ", ";\n align-items: ", "; \n gap: ", ";\n font-weight: ", ";\n height: ", ";\n min-height: ", ";\n max-height: ", ";\n width: ", ";\n min-width: ", ";\n max-width: ", ";\n padding: ", ";\n background: ", ";\n object-fit:", ";\n margin: ", ";\n border-radius: ", ";\n border-top-left-radius: ", ";\n border-top-right-radius: ", ";\n cursor: ", ";\n font-size: ", ";\n opacity: ", ";\n pointer-events: ", ";\n position: ", ";\n top: ", ";\n bottom: ", ";\n left: ", ";\n right: ", ";\n text-align: ", "; \n color: ", "; \n overflow: ", ";\n overflow-y: ", ";\n z-index: ", "; \n scrollbar-width: ", ";\n border: ", "; \n border-top: ", ";\n border-bottom: ", ";\n border-left: ", ";\n transition: ", ";\n\n &:hover {\n background: ", ";\n color: ", ";\n }\n"])), function (_ref) {
|
|
2975
2975
|
var $flex = _ref.$flex;
|
|
2976
2976
|
return $flex;
|
|
2977
2977
|
}, function (_ref2) {
|
|
@@ -3080,44 +3080,50 @@ var Container = styled__default.div(_templateObject$1 || (_templateObject$1 = _t
|
|
|
3080
3080
|
var $border = _ref36.$border;
|
|
3081
3081
|
return $border;
|
|
3082
3082
|
}, function (_ref37) {
|
|
3083
|
-
var $
|
|
3084
|
-
return $
|
|
3083
|
+
var $borderTop = _ref37.$borderTop;
|
|
3084
|
+
return $borderTop;
|
|
3085
3085
|
}, function (_ref38) {
|
|
3086
|
-
var $
|
|
3087
|
-
return $
|
|
3086
|
+
var $borderBottom = _ref38.$borderBottom;
|
|
3087
|
+
return $borderBottom;
|
|
3088
3088
|
}, function (_ref39) {
|
|
3089
|
-
var $
|
|
3090
|
-
return $
|
|
3089
|
+
var $borderLeft = _ref39.$borderLeft;
|
|
3090
|
+
return $borderLeft;
|
|
3091
3091
|
}, function (_ref40) {
|
|
3092
|
-
var $
|
|
3092
|
+
var $transition = _ref40.$transition;
|
|
3093
|
+
return $transition;
|
|
3094
|
+
}, function (_ref41) {
|
|
3095
|
+
var $hoverBackground = _ref41.$hoverBackground;
|
|
3096
|
+
return $hoverBackground;
|
|
3097
|
+
}, function (_ref42) {
|
|
3098
|
+
var $hoverColor = _ref42.$hoverColor;
|
|
3093
3099
|
return $hoverColor;
|
|
3094
3100
|
});
|
|
3095
|
-
var Span = styled__default.span(_templateObject2$1 || (_templateObject2$1 = _taggedTemplateLiteralLoose(["\n font-family: ", ";\n font-weight: ", ";\n font-size: ", ";\n color: ", ";\n line-height: ", ";\n text-align: ", ";\n min-width: ", ";\n width: ", ";\n overflow-wrap: ", ";\n"])), function (
|
|
3096
|
-
var $fontFamily =
|
|
3101
|
+
var Span = styled__default.span(_templateObject2$1 || (_templateObject2$1 = _taggedTemplateLiteralLoose(["\n font-family: ", ";\n font-weight: ", ";\n font-size: ", ";\n color: ", ";\n line-height: ", ";\n text-align: ", ";\n min-width: ", ";\n width: ", ";\n overflow-wrap: ", ";\n"])), function (_ref43) {
|
|
3102
|
+
var $fontFamily = _ref43.$fontFamily;
|
|
3097
3103
|
return $fontFamily ? $fontFamily : 'NotoSans, sans-serif';
|
|
3098
|
-
}, function (
|
|
3099
|
-
var $fontWeight =
|
|
3104
|
+
}, function (_ref44) {
|
|
3105
|
+
var $fontWeight = _ref44.$fontWeight;
|
|
3100
3106
|
return $fontWeight ? $fontWeight : '500';
|
|
3101
|
-
}, function (
|
|
3102
|
-
var $fontSize =
|
|
3107
|
+
}, function (_ref45) {
|
|
3108
|
+
var $fontSize = _ref45.$fontSize;
|
|
3103
3109
|
return $fontSize ? $fontSize : '16px';
|
|
3104
|
-
}, function (
|
|
3105
|
-
var $color =
|
|
3110
|
+
}, function (_ref46) {
|
|
3111
|
+
var $color = _ref46.$color;
|
|
3106
3112
|
return $color ? $color : colorVariables.text.medium;
|
|
3107
|
-
}, function (
|
|
3108
|
-
var $lineHeight =
|
|
3113
|
+
}, function (_ref47) {
|
|
3114
|
+
var $lineHeight = _ref47.$lineHeight;
|
|
3109
3115
|
return $lineHeight ? $lineHeight : '100%';
|
|
3110
|
-
}, function (
|
|
3111
|
-
var $textAlign =
|
|
3116
|
+
}, function (_ref48) {
|
|
3117
|
+
var $textAlign = _ref48.$textAlign;
|
|
3112
3118
|
return $textAlign ? $textAlign : 'center';
|
|
3113
|
-
}, function (
|
|
3114
|
-
var $minWidth =
|
|
3119
|
+
}, function (_ref49) {
|
|
3120
|
+
var $minWidth = _ref49.$minWidth;
|
|
3115
3121
|
return $minWidth;
|
|
3116
|
-
}, function (
|
|
3117
|
-
var $width =
|
|
3122
|
+
}, function (_ref50) {
|
|
3123
|
+
var $width = _ref50.$width;
|
|
3118
3124
|
return $width;
|
|
3119
|
-
}, function (
|
|
3120
|
-
var $overflowWrap =
|
|
3125
|
+
}, function (_ref51) {
|
|
3126
|
+
var $overflowWrap = _ref51.$overflowWrap;
|
|
3121
3127
|
return $overflowWrap;
|
|
3122
3128
|
});
|
|
3123
3129
|
|
|
@@ -5125,8 +5131,11 @@ var SearchBox = function SearchBox(_ref6) {
|
|
|
5125
5131
|
};
|
|
5126
5132
|
|
|
5127
5133
|
var _templateObject$e, _templateObject2$b, _templateObject3$7, _templateObject4$5, _templateObject5$5;
|
|
5128
|
-
var Label = styled__default.label(_templateObject$e || (_templateObject$e = _taggedTemplateLiteralLoose(["\n cursor: auto;\n width: 100%;\n font-weight:
|
|
5129
|
-
var $
|
|
5134
|
+
var Label = styled__default.label(_templateObject$e || (_templateObject$e = _taggedTemplateLiteralLoose(["\n cursor: auto;\n width: 100%;\n font-weight: ", ";\n position: relative;\n width: max-content;\n\n ", "\n\n color: ", ";\n"])), function (_ref) {
|
|
5135
|
+
var $fontWeight = _ref.$fontWeight;
|
|
5136
|
+
return $fontWeight != null ? $fontWeight : '500';
|
|
5137
|
+
}, function (_ref2) {
|
|
5138
|
+
var $size = _ref2.$size;
|
|
5130
5139
|
switch ($size) {
|
|
5131
5140
|
case 'small':
|
|
5132
5141
|
return "\n font-size: 12px;\n line-height: 12px;\n ";
|
|
@@ -5137,8 +5146,8 @@ var Label = styled__default.label(_templateObject$e || (_templateObject$e = _tag
|
|
|
5137
5146
|
default:
|
|
5138
5147
|
return "\n font-size: 14px;\n line-height: 14px;\n ";
|
|
5139
5148
|
}
|
|
5140
|
-
}, function (
|
|
5141
|
-
var $titlecolor =
|
|
5149
|
+
}, function (_ref3) {
|
|
5150
|
+
var $titlecolor = _ref3.$titlecolor;
|
|
5142
5151
|
switch ($titlecolor) {
|
|
5143
5152
|
case 'dark':
|
|
5144
5153
|
return colorVariables.text.dark;
|
|
@@ -5160,22 +5169,22 @@ var Label = styled__default.label(_templateObject$e || (_templateObject$e = _tag
|
|
|
5160
5169
|
return $titlecolor;
|
|
5161
5170
|
}
|
|
5162
5171
|
});
|
|
5163
|
-
var Input = styled__default.input(_templateObject2$b || (_templateObject2$b = _taggedTemplateLiteralLoose(["\n width: 100%;\n border: 1px solid ", ";\n border-radius: 8px;\n cursor: ", ";\n background: ", ";\n transition: all 0.3s ease;\n color: ", ";\n pointer-events: ", ";\n\n ", "\n\n &:focus {\n border: 1px solid\n ", ";\n }\n\n &::placeholder {\n color: ", ";\n font-style: italic;\n font-family: NotoSans, sans-serif;\n }\n"])), colorVariables.border.light, function (
|
|
5164
|
-
var $disabled =
|
|
5172
|
+
var Input = styled__default.input(_templateObject2$b || (_templateObject2$b = _taggedTemplateLiteralLoose(["\n width: 100%;\n border: 1px solid ", ";\n border-radius: 8px;\n cursor: ", ";\n background: ", ";\n transition: all 0.3s ease;\n color: ", ";\n pointer-events: ", ";\n\n ", "\n\n &:focus {\n border: 1px solid\n ", ";\n }\n\n &::placeholder {\n color: ", ";\n font-style: italic;\n font-family: NotoSans, sans-serif;\n }\n"])), colorVariables.border.light, function (_ref4) {
|
|
5173
|
+
var $disabled = _ref4.$disabled;
|
|
5165
5174
|
return $disabled ? 'not-allowed' : 'auto';
|
|
5166
|
-
}, function (_ref4) {
|
|
5167
|
-
var $disabled = _ref4.$disabled,
|
|
5168
|
-
$background = _ref4.$background;
|
|
5169
|
-
return $disabled ? colorVariables.disabled.secondary : $background;
|
|
5170
5175
|
}, function (_ref5) {
|
|
5171
|
-
var $
|
|
5172
|
-
|
|
5176
|
+
var $disabled = _ref5.$disabled,
|
|
5177
|
+
$background = _ref5.$background;
|
|
5178
|
+
return $disabled ? colorVariables.disabled.secondary : $background;
|
|
5173
5179
|
}, function (_ref6) {
|
|
5174
|
-
var $
|
|
5175
|
-
return $
|
|
5180
|
+
var $color = _ref6.$color;
|
|
5181
|
+
return $color;
|
|
5176
5182
|
}, function (_ref7) {
|
|
5177
|
-
var $
|
|
5178
|
-
|
|
5183
|
+
var $disabled = _ref7.$disabled;
|
|
5184
|
+
return $disabled ? 'none' : 'auto';
|
|
5185
|
+
}, function (_ref8) {
|
|
5186
|
+
var $size = _ref8.$size,
|
|
5187
|
+
$type = _ref8.$type;
|
|
5179
5188
|
switch ($size) {
|
|
5180
5189
|
case 'small':
|
|
5181
5190
|
return "\n font-size: 12px;\n padding: " + ($type === 'password' ? '5px 38px 5px 10px' : '5px 10px') + ";\n ";
|
|
@@ -5186,8 +5195,8 @@ var Input = styled__default.input(_templateObject2$b || (_templateObject2$b = _t
|
|
|
5186
5195
|
default:
|
|
5187
5196
|
return "\n font-size: 14px;\n padding: " + ($type === 'password' ? '7px 38px 7px 12px' : '7px 12px') + ";\n ";
|
|
5188
5197
|
}
|
|
5189
|
-
}, function (
|
|
5190
|
-
var $color =
|
|
5198
|
+
}, function (_ref9) {
|
|
5199
|
+
var $color = _ref9.$color;
|
|
5191
5200
|
switch ($color) {
|
|
5192
5201
|
case 'dark':
|
|
5193
5202
|
return colorVariables.text.dark;
|
|
@@ -5210,39 +5219,40 @@ var Input = styled__default.input(_templateObject2$b || (_templateObject2$b = _t
|
|
|
5210
5219
|
}
|
|
5211
5220
|
}, colorVariables.text.light);
|
|
5212
5221
|
var InputWrapper$1 = styled__default.div(_templateObject3$7 || (_templateObject3$7 = _taggedTemplateLiteralLoose(["\n position: relative;\n display: flex;\n align-items: center;\n width: 100%;\n"])));
|
|
5213
|
-
var IconWrapper$1 = styled__default.div(_templateObject4$5 || (_templateObject4$5 = _taggedTemplateLiteralLoose(["\n position: absolute;\n right: 12px;\n cursor: pointer;\n\n > div {\n cursor: ", ";\n }\n"])), function (
|
|
5214
|
-
var $disabled =
|
|
5222
|
+
var IconWrapper$1 = styled__default.div(_templateObject4$5 || (_templateObject4$5 = _taggedTemplateLiteralLoose(["\n position: absolute;\n right: 12px;\n cursor: pointer;\n\n > div {\n cursor: ", ";\n }\n"])), function (_ref10) {
|
|
5223
|
+
var $disabled = _ref10.$disabled;
|
|
5215
5224
|
return $disabled ? 'not-allowed' : 'pointer';
|
|
5216
5225
|
});
|
|
5217
5226
|
var Asterisk$1 = styled__default.span(_templateObject5$5 || (_templateObject5$5 = _taggedTemplateLiteralLoose(["\n color: ", ";\n font-size: 10px;\n height: fit-content;\n position: absolute;\n top: -2px;\n right: -8px;\n"])), colorVariables["default"].error);
|
|
5218
|
-
var TextField = function TextField(
|
|
5219
|
-
var
|
|
5220
|
-
type =
|
|
5221
|
-
title =
|
|
5222
|
-
|
|
5223
|
-
|
|
5224
|
-
disabled =
|
|
5225
|
-
|
|
5226
|
-
|
|
5227
|
-
|
|
5228
|
-
size =
|
|
5229
|
-
|
|
5230
|
-
color =
|
|
5231
|
-
|
|
5232
|
-
padding =
|
|
5233
|
-
|
|
5234
|
-
titlecolor =
|
|
5235
|
-
|
|
5236
|
-
|
|
5237
|
-
iconsize =
|
|
5238
|
-
|
|
5239
|
-
|
|
5240
|
-
|
|
5241
|
-
required =
|
|
5242
|
-
|
|
5243
|
-
background =
|
|
5244
|
-
|
|
5245
|
-
|
|
5227
|
+
var TextField = function TextField(_ref11) {
|
|
5228
|
+
var _ref11$type = _ref11.type,
|
|
5229
|
+
type = _ref11$type === void 0 ? 'text' : _ref11$type,
|
|
5230
|
+
title = _ref11.title,
|
|
5231
|
+
titleWeight = _ref11.titleWeight,
|
|
5232
|
+
placeholder = _ref11.placeholder,
|
|
5233
|
+
_ref11$disabled = _ref11.disabled,
|
|
5234
|
+
disabled = _ref11$disabled === void 0 ? false : _ref11$disabled,
|
|
5235
|
+
inputValue = _ref11.inputValue,
|
|
5236
|
+
onChange = _ref11.onChange,
|
|
5237
|
+
_ref11$size = _ref11.size,
|
|
5238
|
+
size = _ref11$size === void 0 ? 'medium' : _ref11$size,
|
|
5239
|
+
_ref11$color = _ref11.color,
|
|
5240
|
+
color = _ref11$color === void 0 ? colorVariables.text.dark : _ref11$color,
|
|
5241
|
+
_ref11$padding = _ref11.padding,
|
|
5242
|
+
padding = _ref11$padding === void 0 ? '0px' : _ref11$padding,
|
|
5243
|
+
_ref11$titlecolor = _ref11.titlecolor,
|
|
5244
|
+
titlecolor = _ref11$titlecolor === void 0 ? colorVariables.text.dark : _ref11$titlecolor,
|
|
5245
|
+
icon = _ref11.icon,
|
|
5246
|
+
_ref11$iconsize = _ref11.iconsize,
|
|
5247
|
+
iconsize = _ref11$iconsize === void 0 ? 18 : _ref11$iconsize,
|
|
5248
|
+
iconweight = _ref11.iconweight,
|
|
5249
|
+
iconcolor = _ref11.iconcolor,
|
|
5250
|
+
_ref11$required = _ref11.required,
|
|
5251
|
+
required = _ref11$required === void 0 ? false : _ref11$required,
|
|
5252
|
+
_ref11$background = _ref11.background,
|
|
5253
|
+
background = _ref11$background === void 0 ? colorVariables["default"].tertiary : _ref11$background,
|
|
5254
|
+
onEnter = _ref11.onEnter,
|
|
5255
|
+
titleRightNode = _ref11.titleRightNode;
|
|
5246
5256
|
var _useState = React.useState(disabled),
|
|
5247
5257
|
isDisabled = _useState[0],
|
|
5248
5258
|
setIsDisabled = _useState[1];
|
|
@@ -5271,6 +5281,7 @@ var TextField = function TextField(_ref10) {
|
|
|
5271
5281
|
"$gap": titleRightNode === null || titleRightNode === void 0 ? void 0 : titleRightNode.gap
|
|
5272
5282
|
}, title && React__default.createElement(Label, {
|
|
5273
5283
|
"$size": size,
|
|
5284
|
+
"$fontWeight": titleWeight,
|
|
5274
5285
|
htmlFor: title,
|
|
5275
5286
|
"$titlecolor": titlecolor
|
|
5276
5287
|
}, title, required && React__default.createElement(Asterisk$1, null, "*")), titleRightNode === null || titleRightNode === void 0 ? void 0 : titleRightNode.node), React__default.createElement(InputWrapper$1, null, React__default.createElement(Input, {
|
|
@@ -5316,8 +5327,11 @@ var Container$3 = styled__default.div(_templateObject$f || (_templateObject$f =
|
|
|
5316
5327
|
var $padding = _ref.$padding;
|
|
5317
5328
|
return $padding;
|
|
5318
5329
|
});
|
|
5319
|
-
var Label$1 = styled__default.label(_templateObject2$c || (_templateObject2$c = _taggedTemplateLiteralLoose(["\n cursor: auto;\n font-weight:
|
|
5320
|
-
var $
|
|
5330
|
+
var Label$1 = styled__default.label(_templateObject2$c || (_templateObject2$c = _taggedTemplateLiteralLoose(["\n cursor: auto;\n font-weight: ", ";\n position: relative;\n width: max-content;\n\n ", "\n\n color: ", ";\n"])), function (_ref2) {
|
|
5331
|
+
var $fontWeight = _ref2.$fontWeight;
|
|
5332
|
+
return $fontWeight != null ? $fontWeight : '500';
|
|
5333
|
+
}, function (_ref3) {
|
|
5334
|
+
var $size = _ref3.$size;
|
|
5321
5335
|
switch ($size) {
|
|
5322
5336
|
case 'small':
|
|
5323
5337
|
return 'font-size: 12px; line-height: 12px;';
|
|
@@ -5328,22 +5342,22 @@ var Label$1 = styled__default.label(_templateObject2$c || (_templateObject2$c =
|
|
|
5328
5342
|
default:
|
|
5329
5343
|
return 'font-size: 14px; line-height: 14px;';
|
|
5330
5344
|
}
|
|
5331
|
-
}, function (
|
|
5332
|
-
var $titlecolor =
|
|
5345
|
+
}, function (_ref4) {
|
|
5346
|
+
var $titlecolor = _ref4.$titlecolor;
|
|
5333
5347
|
return $titlecolor || colorVariables.text.dark;
|
|
5334
5348
|
});
|
|
5335
|
-
var TextAreaComponent = styled__default.textarea(_templateObject3$8 || (_templateObject3$8 = _taggedTemplateLiteralLoose(["\n width: 100%;\n border: 1px solid ", ";\n border-radius: 8px;\n cursor: ", ";\n background: ", ";\n transition: all 0.3s ease;\n color: ", ";\n resize: none;\n height: 100%;\n \n ", "\n\n &:focus {\n border-color: ", ";\n }\n\n &::placeholder {\n color: ", ";\n font-style: italic;\n font-family: NotoSans, sans-serif;\n }\n"])), colorVariables.border.light, function (
|
|
5336
|
-
var $disabled =
|
|
5349
|
+
var TextAreaComponent = styled__default.textarea(_templateObject3$8 || (_templateObject3$8 = _taggedTemplateLiteralLoose(["\n width: 100%;\n border: 1px solid ", ";\n border-radius: 8px;\n cursor: ", ";\n background: ", ";\n transition: all 0.3s ease;\n color: ", ";\n resize: none;\n height: 100%;\n \n ", "\n\n &:focus {\n border-color: ", ";\n }\n\n &::placeholder {\n color: ", ";\n font-style: italic;\n font-family: NotoSans, sans-serif;\n }\n"])), colorVariables.border.light, function (_ref5) {
|
|
5350
|
+
var $disabled = _ref5.$disabled;
|
|
5337
5351
|
return $disabled ? 'not-allowed' : 'auto';
|
|
5338
|
-
}, function (_ref5) {
|
|
5339
|
-
var $disabled = _ref5.$disabled,
|
|
5340
|
-
$background = _ref5.$background;
|
|
5341
|
-
return $disabled ? colorVariables.disabled.secondary : $background;
|
|
5342
5352
|
}, function (_ref6) {
|
|
5343
|
-
var $
|
|
5344
|
-
|
|
5353
|
+
var $disabled = _ref6.$disabled,
|
|
5354
|
+
$background = _ref6.$background;
|
|
5355
|
+
return $disabled ? colorVariables.disabled.secondary : $background;
|
|
5345
5356
|
}, function (_ref7) {
|
|
5346
|
-
var $
|
|
5357
|
+
var $color = _ref7.$color;
|
|
5358
|
+
return $color;
|
|
5359
|
+
}, function (_ref8) {
|
|
5360
|
+
var $size = _ref8.$size;
|
|
5347
5361
|
switch ($size) {
|
|
5348
5362
|
case 'small':
|
|
5349
5363
|
return 'font-size: 12px; padding: 5px 10px;';
|
|
@@ -5354,29 +5368,30 @@ var TextAreaComponent = styled__default.textarea(_templateObject3$8 || (_templat
|
|
|
5354
5368
|
default:
|
|
5355
5369
|
return 'font-size: 14px; padding: 7px 12px;';
|
|
5356
5370
|
}
|
|
5357
|
-
}, function (
|
|
5358
|
-
var $color =
|
|
5371
|
+
}, function (_ref9) {
|
|
5372
|
+
var $color = _ref9.$color;
|
|
5359
5373
|
return $color || colorVariables.text.dark;
|
|
5360
5374
|
}, colorVariables.text.light);
|
|
5361
|
-
var TextArea = function TextArea(
|
|
5362
|
-
var title =
|
|
5363
|
-
|
|
5364
|
-
|
|
5365
|
-
disabled =
|
|
5366
|
-
|
|
5367
|
-
|
|
5368
|
-
|
|
5369
|
-
size =
|
|
5370
|
-
|
|
5371
|
-
color =
|
|
5372
|
-
|
|
5373
|
-
padding =
|
|
5374
|
-
|
|
5375
|
-
titlecolor =
|
|
5376
|
-
|
|
5377
|
-
required =
|
|
5378
|
-
|
|
5379
|
-
background =
|
|
5375
|
+
var TextArea = function TextArea(_ref10) {
|
|
5376
|
+
var title = _ref10.title,
|
|
5377
|
+
titleWeight = _ref10.titleWeight,
|
|
5378
|
+
placeholder = _ref10.placeholder,
|
|
5379
|
+
_ref10$disabled = _ref10.disabled,
|
|
5380
|
+
disabled = _ref10$disabled === void 0 ? false : _ref10$disabled,
|
|
5381
|
+
inputValue = _ref10.inputValue,
|
|
5382
|
+
onChange = _ref10.onChange,
|
|
5383
|
+
_ref10$size = _ref10.size,
|
|
5384
|
+
size = _ref10$size === void 0 ? 'medium' : _ref10$size,
|
|
5385
|
+
_ref10$color = _ref10.color,
|
|
5386
|
+
color = _ref10$color === void 0 ? colorVariables.text.dark : _ref10$color,
|
|
5387
|
+
_ref10$padding = _ref10.padding,
|
|
5388
|
+
padding = _ref10$padding === void 0 ? '0px' : _ref10$padding,
|
|
5389
|
+
_ref10$titlecolor = _ref10.titlecolor,
|
|
5390
|
+
titlecolor = _ref10$titlecolor === void 0 ? colorVariables.text.dark : _ref10$titlecolor,
|
|
5391
|
+
_ref10$required = _ref10.required,
|
|
5392
|
+
required = _ref10$required === void 0 ? false : _ref10$required,
|
|
5393
|
+
_ref10$background = _ref10.background,
|
|
5394
|
+
background = _ref10$background === void 0 ? colorVariables["default"].tertiary : _ref10$background;
|
|
5380
5395
|
var _useState = React.useState(disabled),
|
|
5381
5396
|
isDisabled = _useState[0],
|
|
5382
5397
|
setIsDisabled = _useState[1];
|
|
@@ -5387,6 +5402,7 @@ var TextArea = function TextArea(_ref9) {
|
|
|
5387
5402
|
"$padding": padding
|
|
5388
5403
|
}, title && React__default.createElement(Label$1, {
|
|
5389
5404
|
"$size": size,
|
|
5405
|
+
"$fontWeight": titleWeight,
|
|
5390
5406
|
htmlFor: title,
|
|
5391
5407
|
"$titlecolor": titlecolor
|
|
5392
5408
|
}, title, required && React__default.createElement(Asterisk$1, null, "*")), React__default.createElement(TextAreaComponent, {
|