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.
@@ -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;
@@ -1,6 +1,7 @@
1
1
  import React from 'react';
2
2
  interface TextAreaProps {
3
3
  title?: string;
4
+ titleWeight?: string;
4
5
  placeholder?: string;
5
6
  disabled?: boolean;
6
7
  inputValue: string;
@@ -5,6 +5,7 @@ declare type InputType = 'text' | 'password' | 'email' | 'number' | 'tel' | 'url
5
5
  interface InputProps {
6
6
  type?: InputType;
7
7
  title?: string;
8
+ titleWeight?: string;
8
9
  placeholder?: string;
9
10
  disabled?: boolean;
10
11
  inputValue: string;
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 $borderBottom = _ref37.$borderBottom;
3084
- return $borderBottom;
3083
+ var $borderTop = _ref37.$borderTop;
3084
+ return $borderTop;
3085
3085
  }, function (_ref38) {
3086
- var $borderLeft = _ref38.$borderLeft;
3087
- return $borderLeft;
3086
+ var $borderBottom = _ref38.$borderBottom;
3087
+ return $borderBottom;
3088
3088
  }, function (_ref39) {
3089
- var $hoverBackground = _ref39.$hoverBackground;
3090
- return $hoverBackground;
3089
+ var $borderLeft = _ref39.$borderLeft;
3090
+ return $borderLeft;
3091
3091
  }, function (_ref40) {
3092
- var $hoverColor = _ref40.$hoverColor;
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 (_ref41) {
3096
- var $fontFamily = _ref41.$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 (_ref42) {
3099
- var $fontWeight = _ref42.$fontWeight;
3104
+ }, function (_ref44) {
3105
+ var $fontWeight = _ref44.$fontWeight;
3100
3106
  return $fontWeight ? $fontWeight : '500';
3101
- }, function (_ref43) {
3102
- var $fontSize = _ref43.$fontSize;
3107
+ }, function (_ref45) {
3108
+ var $fontSize = _ref45.$fontSize;
3103
3109
  return $fontSize ? $fontSize : '16px';
3104
- }, function (_ref44) {
3105
- var $color = _ref44.$color;
3110
+ }, function (_ref46) {
3111
+ var $color = _ref46.$color;
3106
3112
  return $color ? $color : colorVariables.text.medium;
3107
- }, function (_ref45) {
3108
- var $lineHeight = _ref45.$lineHeight;
3113
+ }, function (_ref47) {
3114
+ var $lineHeight = _ref47.$lineHeight;
3109
3115
  return $lineHeight ? $lineHeight : '100%';
3110
- }, function (_ref46) {
3111
- var $textAlign = _ref46.$textAlign;
3116
+ }, function (_ref48) {
3117
+ var $textAlign = _ref48.$textAlign;
3112
3118
  return $textAlign ? $textAlign : 'center';
3113
- }, function (_ref47) {
3114
- var $minWidth = _ref47.$minWidth;
3119
+ }, function (_ref49) {
3120
+ var $minWidth = _ref49.$minWidth;
3115
3121
  return $minWidth;
3116
- }, function (_ref48) {
3117
- var $width = _ref48.$width;
3122
+ }, function (_ref50) {
3123
+ var $width = _ref50.$width;
3118
3124
  return $width;
3119
- }, function (_ref49) {
3120
- var $overflowWrap = _ref49.$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: 500;\n position: relative;\n width: max-content;\n\n ", "\n\n color: ", ";\n"])), function (_ref) {
5129
- var $size = _ref.$size;
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 (_ref2) {
5141
- var $titlecolor = _ref2.$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 (_ref3) {
5164
- var $disabled = _ref3.$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 $color = _ref5.$color;
5172
- return $color;
5176
+ var $disabled = _ref5.$disabled,
5177
+ $background = _ref5.$background;
5178
+ return $disabled ? colorVariables.disabled.secondary : $background;
5173
5179
  }, function (_ref6) {
5174
- var $disabled = _ref6.$disabled;
5175
- return $disabled ? 'none' : 'auto';
5180
+ var $color = _ref6.$color;
5181
+ return $color;
5176
5182
  }, function (_ref7) {
5177
- var $size = _ref7.$size,
5178
- $type = _ref7.$type;
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 (_ref8) {
5190
- var $color = _ref8.$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 (_ref9) {
5214
- var $disabled = _ref9.$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(_ref10) {
5219
- var _ref10$type = _ref10.type,
5220
- type = _ref10$type === void 0 ? 'text' : _ref10$type,
5221
- title = _ref10.title,
5222
- placeholder = _ref10.placeholder,
5223
- _ref10$disabled = _ref10.disabled,
5224
- disabled = _ref10$disabled === void 0 ? false : _ref10$disabled,
5225
- inputValue = _ref10.inputValue,
5226
- onChange = _ref10.onChange,
5227
- _ref10$size = _ref10.size,
5228
- size = _ref10$size === void 0 ? 'medium' : _ref10$size,
5229
- _ref10$color = _ref10.color,
5230
- color = _ref10$color === void 0 ? colorVariables.text.dark : _ref10$color,
5231
- _ref10$padding = _ref10.padding,
5232
- padding = _ref10$padding === void 0 ? '0px' : _ref10$padding,
5233
- _ref10$titlecolor = _ref10.titlecolor,
5234
- titlecolor = _ref10$titlecolor === void 0 ? colorVariables.text.dark : _ref10$titlecolor,
5235
- icon = _ref10.icon,
5236
- _ref10$iconsize = _ref10.iconsize,
5237
- iconsize = _ref10$iconsize === void 0 ? 18 : _ref10$iconsize,
5238
- iconweight = _ref10.iconweight,
5239
- iconcolor = _ref10.iconcolor,
5240
- _ref10$required = _ref10.required,
5241
- required = _ref10$required === void 0 ? false : _ref10$required,
5242
- _ref10$background = _ref10.background,
5243
- background = _ref10$background === void 0 ? colorVariables["default"].tertiary : _ref10$background,
5244
- onEnter = _ref10.onEnter,
5245
- titleRightNode = _ref10.titleRightNode;
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: 500;\n position: relative;\n width: max-content;\n\n ", "\n\n color: ", ";\n"])), function (_ref2) {
5320
- var $size = _ref2.$size;
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 (_ref3) {
5332
- var $titlecolor = _ref3.$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 (_ref4) {
5336
- var $disabled = _ref4.$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 $color = _ref6.$color;
5344
- return $color;
5353
+ var $disabled = _ref6.$disabled,
5354
+ $background = _ref6.$background;
5355
+ return $disabled ? colorVariables.disabled.secondary : $background;
5345
5356
  }, function (_ref7) {
5346
- var $size = _ref7.$size;
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 (_ref8) {
5358
- var $color = _ref8.$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(_ref9) {
5362
- var title = _ref9.title,
5363
- placeholder = _ref9.placeholder,
5364
- _ref9$disabled = _ref9.disabled,
5365
- disabled = _ref9$disabled === void 0 ? false : _ref9$disabled,
5366
- inputValue = _ref9.inputValue,
5367
- onChange = _ref9.onChange,
5368
- _ref9$size = _ref9.size,
5369
- size = _ref9$size === void 0 ? 'medium' : _ref9$size,
5370
- _ref9$color = _ref9.color,
5371
- color = _ref9$color === void 0 ? colorVariables.text.dark : _ref9$color,
5372
- _ref9$padding = _ref9.padding,
5373
- padding = _ref9$padding === void 0 ? '0px' : _ref9$padding,
5374
- _ref9$titlecolor = _ref9.titlecolor,
5375
- titlecolor = _ref9$titlecolor === void 0 ? colorVariables.text.dark : _ref9$titlecolor,
5376
- _ref9$required = _ref9.required,
5377
- required = _ref9$required === void 0 ? false : _ref9$required,
5378
- _ref9$background = _ref9.background,
5379
- background = _ref9$background === void 0 ? colorVariables["default"].tertiary : _ref9$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, {