@mw-kit/mw-ui 1.7.19 → 1.7.21

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.
@@ -12,6 +12,7 @@ export interface CheckboxProps extends Omit<React.InputHTMLAttributes<HTMLInputE
12
12
  required?: boolean;
13
13
  invalid?: boolean;
14
14
  padding?: Padding;
15
+ bordered?: true;
15
16
  type: 'checkbox';
16
17
  }
17
18
  export interface LabelProps extends React.LabelHTMLAttributes<HTMLLabelElement> {
@@ -19,5 +20,6 @@ export interface LabelProps extends React.LabelHTMLAttributes<HTMLLabelElement>
19
20
  required?: 1 | 0;
20
21
  invalid?: 1 | 0;
21
22
  padding?: Padding;
23
+ bordered?: 1 | 0;
22
24
  }
23
25
  export {};
@@ -1,19 +1,9 @@
1
- import React from 'react';
2
- import { CommonContext, CommonOption, CommonProps } from '../interfaces';
3
- export interface Option extends CommonOption {
4
- onClick?: (index: number, data: Option, event: React.MouseEvent) => void;
5
- }
6
- interface LoaderReturn {
7
- options: Option[];
8
- lastPage: boolean;
9
- }
10
- export declare type Loader = (search: string, page: number) => Promise<LoaderReturn | Option[]>;
1
+ import { CommonContext, Option, CommonProps } from '../interfaces';
11
2
  export interface SelectProps extends CommonProps {
12
3
  type: 'select';
13
4
  name?: string;
14
- setValue: (value: string, option: CommonOption) => void;
5
+ setValue: (value: string, option: Option) => void;
15
6
  value: string;
16
- loader: Loader;
17
7
  }
18
- export declare type ContextInterface = CommonContext<SelectProps, Option>;
19
- export {};
8
+ export declare type ContextInterface = CommonContext<SelectProps>;
9
+ export * from '../interfaces';
@@ -1,19 +1,12 @@
1
1
  /// <reference types="react" />
2
- import { CommonContext, CommonOption, CommonProps } from '../interfaces';
3
- export declare type Option = CommonOption;
4
- interface LoaderReturn {
5
- options: Option[];
6
- lastPage: boolean;
7
- }
8
- export declare type Loader = (search: string, page: number) => Promise<LoaderReturn | Option[]>;
2
+ import { CommonContext, Option, CommonProps } from '../interfaces';
9
3
  export interface SelectProps extends CommonProps {
10
4
  type: 'select-multiple';
11
5
  setValue: (value: string[], options: Option[]) => void;
12
6
  value: string[] | Option[];
13
7
  selectAll?: boolean;
14
- loader: Loader;
15
8
  }
16
- export interface ContextInterface extends CommonContext<SelectProps, Option> {
9
+ export interface ContextInterface extends CommonContext<SelectProps> {
17
10
  checked: [Option[], React.Dispatch<React.SetStateAction<Option[]>>];
18
11
  }
19
- export {};
12
+ export * from '../interfaces';
@@ -3,7 +3,7 @@ import { ElementOrString, SpacingOrZero, Spacings } from '../../../../../interfa
3
3
  import { Position } from '../../../../AbsoluteContainer/interfaces';
4
4
  import { Option as MenuOption } from '../../../../Menu/interfaces';
5
5
  import { InputProps } from '../../Input/interfaces';
6
- export interface CommonOption {
6
+ export interface Option {
7
7
  label: string | {
8
8
  text: string;
9
9
  element: ElementOrString;
@@ -12,7 +12,15 @@ export interface CommonOption {
12
12
  data?: any;
13
13
  disabled?: boolean;
14
14
  rules?: MenuOption['rules'];
15
+ onClick?: (index: number, option: Pick<Option, 'value' | 'data'> & {
16
+ label: Exclude<Option['label'], string>;
17
+ }, event: React.MouseEvent) => void;
15
18
  }
19
+ interface LoaderReturn {
20
+ options: Option[];
21
+ lastPage: boolean;
22
+ }
23
+ export declare type Loader = (search: string, page: number) => Promise<LoaderReturn | Option[]>;
16
24
  export interface CommonProps extends Omit<InputProps, 'type' | 'mask' | 'icon' | 'setValue' | 'name' | 'value' | 'onChange'> {
17
25
  onScrollEnd?: () => Promise<void>;
18
26
  position?: Position;
@@ -21,6 +29,7 @@ export interface CommonProps extends Omit<InputProps, 'type' | 'mask' | 'icon' |
21
29
  x: number;
22
30
  y: number;
23
31
  };
32
+ loader: Loader;
24
33
  }
25
34
  interface BaseContext {
26
35
  setOpen: React.Dispatch<React.SetStateAction<boolean>>;
@@ -30,7 +39,7 @@ interface BaseContext {
30
39
  onSearch: () => void;
31
40
  onClearSearch: () => void;
32
41
  }
33
- export interface CommonContext<SelectProps extends CommonProps, Option extends CommonOption> extends BaseContext {
42
+ export interface CommonContext<SelectProps extends CommonProps> extends BaseContext {
34
43
  props: SelectProps;
35
44
  options: Option[];
36
45
  }
@@ -42,7 +51,7 @@ export interface ParsedOption extends MenuOption {
42
51
  }
43
52
  export interface useSelectReturn {
44
53
  parsedOptions: ParsedOption[];
45
- options: [CommonOption[], React.Dispatch<React.SetStateAction<CommonOption[]>>];
54
+ options: [Option[], React.Dispatch<React.SetStateAction<Option[]>>];
46
55
  input: {
47
56
  value: string;
48
57
  };
@@ -1,2 +1 @@
1
- export type { Option as SelectOption, Loader as SelectLoader, } from './hooks/Select/interfaces';
2
- export type { Option as SelectMultipleOption, Loader as SelectMultipleLoader, } from './hooks/SelectMultiple/interfaces';
1
+ export type { Option as SelectOption, Loader as SelectLoader, } from './hooks/interfaces';
package/dist/index.js CHANGED
@@ -12941,7 +12941,7 @@ var Input$1 = React__default.forwardRef(function (props, ref) {
12941
12941
  });
12942
12942
  Input$1.displayName = 'Input';
12943
12943
 
12944
- var _templateObject$d, _templateObject2$b, _templateObject3$a, _templateObject4$9, _templateObject5$8, _templateObject6$6, _templateObject7$5;
12944
+ var _templateObject$d, _templateObject2$b, _templateObject3$a, _templateObject4$9, _templateObject5$8, _templateObject6$6, _templateObject7$5, _templateObject8$4;
12945
12945
  var width = '17px';
12946
12946
  var Checkmark = styled__default.span(_templateObject$d || (_templateObject$d = _taggedTemplateLiteralLoose(["\n position: absolute;\n top: 0px;\n left: 0;\n height: ", ";\n width: ", ";\n background-color: ", ";\n\n border-style: solid;\n border-color: ", ";\n border-width: 1px;\n border-radius: 4px;\n\n transition-property: border-color;\n transition-duration: 0.25s;\n transition-timing-function: cubic-bezier(0.68, -0.55, 0.27, 1.55);\n\n :after {\n content: '';\n position: absolute;\n\n left: 50%;\n top: 50%;\n height: 0;\n width: 0;\n\n border-style: solid;\n border-color: ", ";\n border-width: 0;\n transform: rotate(45deg);\n\n transition-property: width height border-width top left;\n transition-duration: 0.25s;\n transition-timing-function: cubic-bezier(0.68, -0.55, 0.27, 1.55);\n }\n"])), width, width, function (_ref) {
12947
12947
  var theme = _ref.theme;
@@ -12953,7 +12953,7 @@ var Checkmark = styled__default.span(_templateObject$d || (_templateObject$d = _
12953
12953
  var theme = _ref3.theme;
12954
12954
  return theme.colors.blue;
12955
12955
  });
12956
- var Label$1 = styled__default.label(_templateObject2$b || (_templateObject2$b = _taggedTemplateLiteralLoose(["\n ", "\n line-height: 14px;\n\n display: block;\n\n ", "\n\n ", "\n\n > div {\n display: flex;\n align-items: center;\n position: relative;\n\n padding-left: calc(", " + ", ");\n user-select: none;\n min-height: 17px;\n\n > div:first-child {\n display: inline-block;\n ", "\n line-height: 14px;\n\n ", "\n }\n\n > input {\n position: absolute;\n opacity: 0;\n height: 0;\n width: 0;\n }\n\n :hover ", " {\n background-color: ", ";\n }\n\n > input:checked ~ ", " {\n border-color: ", ";\n\n :after {\n width: 5px;\n height: 9.5px;\n border-width: 0 2px 2px 0;\n left: 5px;\n top: 1px;\n }\n }\n\n ", ";\n }\n"])), function (_ref4) {
12956
+ var Label$1 = styled__default.label(_templateObject2$b || (_templateObject2$b = _taggedTemplateLiteralLoose(["\n ", "\n line-height: 14px;\n\n display: block;\n\n ", "\n\n ", "\n\n ", "\n\n > div {\n display: flex;\n align-items: center;\n position: relative;\n\n padding-left: calc(", " + ", ");\n user-select: none;\n min-height: 17px;\n\n > div:first-child {\n display: inline-block;\n ", "\n line-height: 14px;\n\n ", "\n }\n\n > input {\n position: absolute;\n opacity: 0;\n height: 0;\n width: 0;\n }\n\n :hover ", " {\n background-color: ", ";\n }\n\n > input:checked ~ ", " {\n border-color: ", ";\n\n :after {\n width: 5px;\n height: 9.5px;\n border-width: 0 2px 2px 0;\n left: 5px;\n top: 1px;\n }\n }\n\n ", ";\n }\n"])), function (_ref4) {
12957
12957
  var theme = _ref4.theme;
12958
12958
  return theme.useTypography('p');
12959
12959
  }, function (_ref5) {
@@ -13008,27 +13008,33 @@ var Label$1 = styled__default.label(_templateObject2$b || (_templateObject2$b =
13008
13008
  }
13009
13009
 
13010
13010
  return styled.css(_templateObject5$8 || (_templateObject5$8 = _taggedTemplateLiteralLoose(["\n opacity: 0.5;\n "])));
13011
- }, width, function (_ref7) {
13012
- var theme = _ref7.theme;
13013
- return theme.spacings.s1;
13014
- }, function (_ref8) {
13011
+ }, function (_ref7) {
13012
+ var theme = _ref7.theme,
13013
+ bordered = _ref7.bordered,
13014
+ invalid = _ref7.invalid;
13015
+ if (!bordered) return;
13016
+ return styled.css(_templateObject6$6 || (_templateObject6$6 = _taggedTemplateLiteralLoose(["\n padding: ", " ", ";\n\n border-width: 1px;\n border-style: solid;\n border-color: ", ";\n border-radius: 4px;\n "])), theme.spacings.s2, theme.spacings.s3, theme.colors[invalid ? 'warningRed' : 'lightGrey']);
13017
+ }, width, function (_ref8) {
13015
13018
  var theme = _ref8.theme;
13016
- return theme.useTypography('p');
13019
+ return theme.spacings.s1;
13017
13020
  }, function (_ref9) {
13018
- var required = _ref9.required;
13021
+ var theme = _ref9.theme;
13022
+ return theme.useTypography('p');
13023
+ }, function (_ref10) {
13024
+ var required = _ref10.required;
13019
13025
  if (!required) return;
13020
- return styled.css(_templateObject6$6 || (_templateObject6$6 = _taggedTemplateLiteralLoose(["\n :after {\n content: ' *';\n }\n "])));
13021
- }, Checkmark, function (_ref10) {
13022
- var theme = _ref10.theme;
13023
- return theme.colors.iceWhite;
13026
+ return styled.css(_templateObject7$5 || (_templateObject7$5 = _taggedTemplateLiteralLoose(["\n :after {\n content: ' *';\n }\n "])));
13024
13027
  }, Checkmark, function (_ref11) {
13025
13028
  var theme = _ref11.theme;
13029
+ return theme.colors.iceWhite;
13030
+ }, Checkmark, function (_ref12) {
13031
+ var theme = _ref12.theme;
13026
13032
  return theme.colors.blue;
13027
- }, function (_ref12) {
13028
- var theme = _ref12.theme,
13029
- invalid = _ref12.invalid;
13033
+ }, function (_ref13) {
13034
+ var theme = _ref13.theme,
13035
+ invalid = _ref13.invalid;
13030
13036
  if (!invalid) return;
13031
- return styled.css(_templateObject7$5 || (_templateObject7$5 = _taggedTemplateLiteralLoose(["\n ", ",\n > input:checked ~ ", ", \n > input:checked ~ ", ":after {\n border-color: ", ";\n }\n "])), Checkmark, Checkmark, Checkmark, theme.colors.warningRed);
13037
+ return styled.css(_templateObject8$4 || (_templateObject8$4 = _taggedTemplateLiteralLoose(["\n ", ",\n > input:checked ~ ", ", \n > input:checked ~ ", ":after {\n border-color: ", ";\n }\n "])), Checkmark, Checkmark, Checkmark, theme.colors.warningRed);
13032
13038
  });
13033
13039
 
13034
13040
  var Checkbox = React__default.forwardRef(function (props, ref) {
@@ -13036,12 +13042,14 @@ var Checkbox = React__default.forwardRef(function (props, ref) {
13036
13042
  disabled = props.disabled,
13037
13043
  required = props.required,
13038
13044
  invalid = props.invalid,
13039
- padding = props.padding;
13040
- var htmlProps = filterObject(props, ['label', 'invalid', 'required', 'padding']);
13045
+ padding = props.padding,
13046
+ bordered = props.bordered;
13047
+ var htmlProps = filterObject(props, ['label', 'invalid', 'required', 'padding', 'bordered']);
13041
13048
  return React__default.createElement(Label$1, {
13042
13049
  disabled: disabled ? 1 : 0,
13043
13050
  required: required ? 1 : 0,
13044
13051
  invalid: invalid ? 1 : 0,
13052
+ bordered: bordered ? 1 : 0,
13045
13053
  padding: padding
13046
13054
  }, React__default.createElement("div", null, React__default.createElement("div", null, label), React__default.createElement("input", Object.assign({}, htmlProps, {
13047
13055
  type: 'checkbox',
@@ -13081,7 +13089,7 @@ var inputTimeWidth = {
13081
13089
  withoutSeconds: '66px'
13082
13090
  };
13083
13091
 
13084
- var _templateObject$e, _templateObject2$c, _templateObject3$b, _templateObject4$a, _templateObject5$9, _templateObject6$7, _templateObject7$6, _templateObject8$4, _templateObject9$4;
13092
+ var _templateObject$e, _templateObject2$c, _templateObject3$b, _templateObject4$a, _templateObject5$9, _templateObject6$7, _templateObject7$6, _templateObject8$5, _templateObject9$4;
13085
13093
  var Container$7 = styled__default.div(_templateObject$e || (_templateObject$e = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n gap: ", ";\n background-color: ", ";\n position: relative;\n\n ", ";\n"])), function (_ref) {
13086
13094
  var theme = _ref.theme;
13087
13095
  return theme.spacings.s3;
@@ -13130,7 +13138,7 @@ var MonthBtn = styled__default.div(_templateObject7$6 || (_templateObject7$6 = _
13130
13138
  }, function (_ref14) {
13131
13139
  var onClick = _ref14.onClick;
13132
13140
  if (!onClick) return;
13133
- return styled.css(_templateObject8$4 || (_templateObject8$4 = _taggedTemplateLiteralLoose(["\n cursor: pointer;\n "])));
13141
+ return styled.css(_templateObject8$5 || (_templateObject8$5 = _taggedTemplateLiteralLoose(["\n cursor: pointer;\n "])));
13134
13142
  });
13135
13143
  var NavBtn = styled__default.button(_templateObject9$4 || (_templateObject9$4 = _taggedTemplateLiteralLoose(["\n ", "\n line-height: 14px;\n width: 32px;\n height: 32px;\n box-shadow: none;\n border: none;\n background-color: transparent;\n\n padding: 0;\n display: flex;\n align-items: center;\n justify-content: center;\n\n :disabled {\n visibility: hidden;\n }\n :not(:disabled) {\n cursor: pointer;\n :hover {\n background-color: ", ";\n }\n }\n\n transition-property: background-color;\n transition-timing-function: ease-in-out;\n transition-duration: 0.25s;\n"])), function (_ref15) {
13136
13144
  var theme = _ref15.theme;
@@ -13197,7 +13205,7 @@ var MonthPicker = function MonthPicker(props) {
13197
13205
  }));
13198
13206
  };
13199
13207
 
13200
- var _templateObject$f, _templateObject2$d, _templateObject3$c, _templateObject4$b, _templateObject5$a, _templateObject6$8, _templateObject7$7, _templateObject8$5, _templateObject9$5, _templateObject10$3, _templateObject11$3;
13208
+ var _templateObject$f, _templateObject2$d, _templateObject3$c, _templateObject4$b, _templateObject5$a, _templateObject6$8, _templateObject7$7, _templateObject8$6, _templateObject9$5, _templateObject10$3, _templateObject11$3;
13201
13209
  var Footer = styled__default.div(_templateObject$f || (_templateObject$f = _taggedTemplateLiteralLoose(["\n display: flex;\n justify-content: space-between;\n align-items: center;\n\n > button:last-child {\n margin-left: auto;\n }\n"])));
13202
13210
  var WeekContainer = styled__default.div(_templateObject2$d || (_templateObject2$d = _taggedTemplateLiteralLoose(["\n width: 100%;\n display: flex;\n\n :not(:first-child) {\n border-top: 1px solid ", ";\n }\n\n > * {\n font-family: ", ";\n font-size: ", ";\n line-height: ", ";\n width: 32px;\n height: 32px;\n\n color: ", ";\n box-shadow: none;\n\n display: flex;\n align-items: center;\n justify-content: center;\n text-align: center;\n\n border: 1px solid transparent;\n :not(:last-child) {\n border-right-color: ", ";\n }\n }\n"])), function (_ref) {
13203
13211
  var theme = _ref.theme;
@@ -13235,7 +13243,7 @@ var DayContainer = styled__default.button(_templateObject4$b || (_templateObject
13235
13243
  } else if (appearance === 'highlight') {
13236
13244
  return styled.css(_templateObject7$7 || (_templateObject7$7 = _taggedTemplateLiteralLoose(["\n background-color: ", ";\n ", "\n "])), theme.getColor('blue', 30), hover('blue'));
13237
13245
  } else if (appearance === 'active') {
13238
- return styled.css(_templateObject8$5 || (_templateObject8$5 = _taggedTemplateLiteralLoose(["\n background-color: ", ";\n color: ", ";\n :not(:last-child) {\n border-right-color: ", ";\n }\n ", "\n "])), theme.colors.blue, theme.colors.white, function (_ref9) {
13246
+ return styled.css(_templateObject8$6 || (_templateObject8$6 = _taggedTemplateLiteralLoose(["\n background-color: ", ";\n color: ", ";\n :not(:last-child) {\n border-right-color: ", ";\n }\n ", "\n "])), theme.colors.blue, theme.colors.white, function (_ref9) {
13239
13247
  var theme = _ref9.theme;
13240
13248
  return theme.colors.blue;
13241
13249
  }, hover('white'));
@@ -14411,15 +14419,20 @@ var getOptions = function getOptions(props, options) {
14411
14419
  element: option.label
14412
14420
  } : option.label;
14413
14421
  var value = option.value,
14414
- onClick = option.onClick;
14422
+ onClick = option.onClick,
14423
+ data = option.data;
14415
14424
  return {
14416
14425
  label: label,
14417
14426
  onClick: onClick ? function (index, _option, event) {
14418
- onClick(index, option, event);
14427
+ onClick(index, {
14428
+ label: label,
14429
+ value: value,
14430
+ data: data
14431
+ }, event);
14419
14432
  } : function () {
14420
14433
  props.setValue(value, option);
14421
14434
  },
14422
- data: option.data,
14435
+ data: data,
14423
14436
  disabled: option.disabled,
14424
14437
  rules: option.rules
14425
14438
  };
@@ -14562,6 +14575,9 @@ var getOptions$1 = function getOptions(options, checked, setChecked) {
14562
14575
  text: option.label,
14563
14576
  element: option.label
14564
14577
  } : option.label;
14578
+ var value = option.value,
14579
+ onClick = option.onClick,
14580
+ data = option.data;
14565
14581
  return {
14566
14582
  label: {
14567
14583
  text: label.text,
@@ -14590,7 +14606,14 @@ var getOptions$1 = function getOptions(options, checked, setChecked) {
14590
14606
  }
14591
14607
  })
14592
14608
  },
14593
- data: option.data,
14609
+ onClick: onClick ? function (index, _option, event) {
14610
+ onClick(index, {
14611
+ label: label,
14612
+ value: value,
14613
+ data: data
14614
+ }, event);
14615
+ } : undefined,
14616
+ data: data,
14594
14617
  disabled: option.disabled,
14595
14618
  rules: option.rules,
14596
14619
  keepOpen: true
@@ -14605,7 +14628,8 @@ var getInputValue$1 = function getInputValue(value) {
14605
14628
 
14606
14629
  var useSelectMultiple = function useSelectMultiple(props) {
14607
14630
  var init = function init() {
14608
- return props.value.length === 0 ? [] : typeof props.value[0] === 'string' ? [].concat(props.value).map(function (value) {
14631
+ if (props.value.length) return [];
14632
+ return typeof props.value[0] === 'string' ? [].concat(props.value).map(function (value) {
14609
14633
  return {
14610
14634
  value: value,
14611
14635
  label: value
@@ -15283,7 +15307,7 @@ var Phone = Object.assign(Component, {
15283
15307
  getPhoneDetails: getPhoneDetails
15284
15308
  });
15285
15309
 
15286
- var _templateObject$q, _templateObject2$k, _templateObject3$f, _templateObject4$c, _templateObject5$b, _templateObject6$9, _templateObject7$8, _templateObject8$6, _templateObject9$6;
15310
+ var _templateObject$q, _templateObject2$k, _templateObject3$f, _templateObject4$c, _templateObject5$b, _templateObject6$9, _templateObject7$8, _templateObject8$7, _templateObject9$6;
15287
15311
  var RelativeContainer$4 = styled__default.div(_templateObject$q || (_templateObject$q = _taggedTemplateLiteralLoose(["\n position: relative;\n\n input {\n color: transparent;\n }\n"])));
15288
15312
  var LabelContainer$2 = styled__default.div(_templateObject2$k || (_templateObject2$k = _taggedTemplateLiteralLoose(["\n ", "\n line-height: ", ";\n"])), function (_ref) {
15289
15313
  var theme = _ref.theme;
@@ -15312,7 +15336,7 @@ var Container$8 = styled__default.div(_templateObject3$f || (_templateObject3$f
15312
15336
  if (!disabled) return;
15313
15337
  return styled.css(_templateObject7$8 || (_templateObject7$8 = _taggedTemplateLiteralLoose(["\n opacity: 0.5;\n "])));
15314
15338
  });
15315
- var Button$3 = styled__default.button(_templateObject8$6 || (_templateObject8$6 = _taggedTemplateLiteralLoose(["\n display: flex;\n background-color: transparent;\n border: none;\n padding: 0;\n box-shadow: none;\n\n ", ";\n"])), function (_ref6) {
15339
+ var Button$3 = styled__default.button(_templateObject8$7 || (_templateObject8$7 = _taggedTemplateLiteralLoose(["\n display: flex;\n background-color: transparent;\n border: none;\n padding: 0;\n box-shadow: none;\n\n ", ";\n"])), function (_ref6) {
15316
15340
  var onClick = _ref6.onClick;
15317
15341
  if (!onClick) return;
15318
15342
  return styled.css(_templateObject9$6 || (_templateObject9$6 = _taggedTemplateLiteralLoose(["\n :not(:disabled) {\n cursor: pointer;\n }\n "])));
@@ -15512,7 +15536,7 @@ var Switch = function Switch(props) {
15512
15536
  })), React__default.createElement("span", null), label.after && React__default.createElement(LabelContainer$3, null, label.after));
15513
15537
  };
15514
15538
 
15515
- var _templateObject$s, _templateObject2$m, _templateObject3$h, _templateObject4$e, _templateObject5$d, _templateObject6$b, _templateObject7$a, _templateObject8$7, _templateObject9$7, _templateObject10$4, _templateObject11$4, _templateObject12$3, _templateObject13$2, _templateObject14$2, _templateObject15$1, _templateObject16;
15539
+ var _templateObject$s, _templateObject2$m, _templateObject3$h, _templateObject4$e, _templateObject5$d, _templateObject6$b, _templateObject7$a, _templateObject8$8, _templateObject9$7, _templateObject10$4, _templateObject11$4, _templateObject12$3, _templateObject13$2, _templateObject14$2, _templateObject15$1, _templateObject16;
15516
15540
  var bullet = styled.css(_templateObject$s || (_templateObject$s = _taggedTemplateLiteralLoose(["\n appearance: none;\n width: ", ";\n height: ", ";\n border-radius: 100%;\n border-width: 1px;\n border-style: solid;\n background-color: ", ";\n box-shadow: 0px 1px 3px ", ";\n"])), function (_ref) {
15517
15541
  var theme = _ref.theme;
15518
15542
  return theme.spacings.s4;
@@ -15553,7 +15577,7 @@ var InputContainer = styled__default.div(_templateObject6$b || (_templateObject6
15553
15577
  return styled.css(_templateObject7$a || (_templateObject7$a = _taggedTemplateLiteralLoose(["\n ", " > span {\n background-color: ", ";\n }\n\n ", " {\n /** firefox */\n ::-moz-range-thumb {\n border-color: ", ";\n }\n /** ie */\n ::-ms-thumb {\n border-color: ", ";\n }\n /** chrome */\n ::-webkit-slider-thumb {\n border-color: ", ";\n }\n }\n "])), SelectedArea, theme.colors.blue, Input$2, theme.colors.lightestGrey, theme.colors.lightestGrey, theme.colors.lightestGrey);
15554
15578
  }
15555
15579
 
15556
- return styled.css(_templateObject8$7 || (_templateObject8$7 = _taggedTemplateLiteralLoose(["\n ", " > span {\n background-color: ", ";\n }\n\n ", " {\n /** firefox */\n ::-moz-range-thumb {\n border-color: ", ";\n }\n /** ie */\n ::-ms-thumb {\n border-color: ", ";\n }\n /** chrome */\n ::-webkit-slider-thumb {\n border-color: ", ";\n }\n }\n "])), SelectedArea, theme.colors.warningRed, Input$2, theme.colors.warningRed, theme.colors.warningRed, theme.colors.warningRed);
15580
+ return styled.css(_templateObject8$8 || (_templateObject8$8 = _taggedTemplateLiteralLoose(["\n ", " > span {\n background-color: ", ";\n }\n\n ", " {\n /** firefox */\n ::-moz-range-thumb {\n border-color: ", ";\n }\n /** ie */\n ::-ms-thumb {\n border-color: ", ";\n }\n /** chrome */\n ::-webkit-slider-thumb {\n border-color: ", ";\n }\n }\n "])), SelectedArea, theme.colors.warningRed, Input$2, theme.colors.warningRed, theme.colors.warningRed, theme.colors.warningRed);
15557
15581
  });
15558
15582
  var MinMaxLabelContainer = styled__default.div(_templateObject9$7 || (_templateObject9$7 = _taggedTemplateLiteralLoose(["\n display: flex;\n padding-bottom: 2px;\n"])));
15559
15583
  var LabelsContainer = styled__default.div(_templateObject10$4 || (_templateObject10$4 = _taggedTemplateLiteralLoose(["\n display: flex;\n gap: 7px;\n\n ", "\n"])), function (_ref11) {
@@ -15974,7 +15998,7 @@ var parse = function parse(value) {
15974
15998
  });
15975
15999
  };
15976
16000
 
15977
- var _templateObject$u, _templateObject2$o, _templateObject3$j, _templateObject4$g, _templateObject5$f, _templateObject6$d, _templateObject7$c, _templateObject8$8, _templateObject9$8, _templateObject10$5, _templateObject11$5;
16001
+ var _templateObject$u, _templateObject2$o, _templateObject3$j, _templateObject4$g, _templateObject5$f, _templateObject6$d, _templateObject7$c, _templateObject8$9, _templateObject9$8, _templateObject10$5, _templateObject11$5;
15978
16002
  var RelativeContainer$5 = styled__default.div(_templateObject$u || (_templateObject$u = _taggedTemplateLiteralLoose(["\n position: relative;\n user-select: none;\n min-width: 220px;\n\n > input,\n > label > input {\n color: transparent;\n background-color: transparent;\n width: 1px;\n height: 1px;\n position: absolute;\n left: 0;\n bottom: 0;\n border: 0;\n padding: 0;\n overflow: hidden;\n outline: none;\n box-shadow: none;\n }\n"])));
15979
16003
  var LabelContainer$5 = styled__default.div(_templateObject2$o || (_templateObject2$o = _taggedTemplateLiteralLoose(["\n ", "\n line-height: 17px;\n flex: 1;\n text-align: center;\n\n ", ";\n"])), function (_ref) {
15980
16004
  var theme = _ref.theme;
@@ -16012,7 +16036,7 @@ var Container$9 = styled__default.div(_templateObject4$g || (_templateObject4$g
16012
16036
  if (!disabled) return;
16013
16037
  return styled.css(_templateObject7$c || (_templateObject7$c = _taggedTemplateLiteralLoose(["\n opacity: 0.5;\n "])));
16014
16038
  });
16015
- var Button$4 = styled__default.button(_templateObject8$8 || (_templateObject8$8 = _taggedTemplateLiteralLoose(["\n display: flex;\n background-color: transparent;\n border: none;\n padding: 0;\n box-shadow: none;\n\n ", ";\n"])), function (_ref9) {
16039
+ var Button$4 = styled__default.button(_templateObject8$9 || (_templateObject8$9 = _taggedTemplateLiteralLoose(["\n display: flex;\n background-color: transparent;\n border: none;\n padding: 0;\n box-shadow: none;\n\n ", ";\n"])), function (_ref9) {
16016
16040
  var onClick = _ref9.onClick;
16017
16041
  if (!onClick) return;
16018
16042
  return styled.css(_templateObject9$8 || (_templateObject9$8 = _taggedTemplateLiteralLoose(["\n :not(:disabled) {\n cursor: pointer;\n }\n "])));
@@ -16879,7 +16903,7 @@ var widths = {
16879
16903
  default: '642.5px'
16880
16904
  };
16881
16905
 
16882
- var _templateObject$A, _templateObject2$r, _templateObject3$l, _templateObject4$h, _templateObject5$g, _templateObject6$e, _templateObject7$d, _templateObject8$9, _templateObject9$9, _templateObject10$6;
16906
+ var _templateObject$A, _templateObject2$r, _templateObject3$l, _templateObject4$h, _templateObject5$g, _templateObject6$e, _templateObject7$d, _templateObject8$a, _templateObject9$9, _templateObject10$6;
16883
16907
  var Background = styled__default.div(_templateObject$A || (_templateObject$A = _taggedTemplateLiteralLoose(["\n display: flex;\n justify-content: center;\n align-items: center;\n position: fixed;\n top: 0;\n left: 0;\n width: 100vw;\n height: 100vh;\n backdrop-filter: blur(3px);\n background-color: ", ";\n"])), function (_ref) {
16884
16908
  var theme = _ref.theme;
16885
16909
  return theme.getColor('black', 25);
@@ -16902,7 +16926,7 @@ var FooterMessage = styled__default.div(_templateObject7$d || (_templateObject7$
16902
16926
  var theme = _ref4.theme;
16903
16927
  return theme.getColor('darkBlue', 75);
16904
16928
  });
16905
- var FooterButtons = styled__default.div(_templateObject8$9 || (_templateObject8$9 = _taggedTemplateLiteralLoose(["\n flex: 1;\n display: flex;\n align-items: center;\n justify-content: flex-end;\n gap: ", ";\n"])), function (_ref5) {
16929
+ var FooterButtons = styled__default.div(_templateObject8$a || (_templateObject8$a = _taggedTemplateLiteralLoose(["\n flex: 1;\n display: flex;\n align-items: center;\n justify-content: flex-end;\n gap: ", ";\n"])), function (_ref5) {
16906
16930
  var theme = _ref5.theme;
16907
16931
  return theme.spacings.s3;
16908
16932
  });
@@ -17109,7 +17133,7 @@ var Modal$1 = Object.assign(Modal, {
17109
17133
  Audit: Audit
17110
17134
  });
17111
17135
 
17112
- var _templateObject$E, _templateObject2$s, _templateObject3$m, _templateObject4$i, _templateObject5$h, _templateObject6$f, _templateObject7$e, _templateObject8$a, _templateObject9$a, _templateObject10$7;
17136
+ var _templateObject$E, _templateObject2$s, _templateObject3$m, _templateObject4$i, _templateObject5$h, _templateObject6$f, _templateObject7$e, _templateObject8$b, _templateObject9$a, _templateObject10$7;
17113
17137
  var Container$b = styled__default.div(_templateObject$E || (_templateObject$E = _taggedTemplateLiteralLoose(["\n width: 100%;\n background: #fff;\n border: 1px solid #d4d4d5;\n border-radius: 4px;\n border-left-width: 5px;\n padding: 14px;\n ", "\n ", "\n ", "\n ", "\n\n ", "\n ", "\n ", "\n\n ", "\n ", "\n"])), function (props) {
17114
17138
  return props.size === 'mini' && styled.css(_templateObject2$s || (_templateObject2$s = _taggedTemplateLiteralLoose(["\n width: 394px;\n height: 99px;\n "])));
17115
17139
  }, function (props) {
@@ -17123,7 +17147,7 @@ var Container$b = styled__default.div(_templateObject$E || (_templateObject$E =
17123
17147
  }, function (props) {
17124
17148
  return props.borderType === 'success' && styled.css(_templateObject7$e || (_templateObject7$e = _taggedTemplateLiteralLoose(["\n border-left-color: #66bb6a;\n "])));
17125
17149
  }, function (props) {
17126
- return props.borderType === 'warning' && styled.css(_templateObject8$a || (_templateObject8$a = _taggedTemplateLiteralLoose(["\n border-left-color: #fbcb01;\n "])));
17150
+ return props.borderType === 'warning' && styled.css(_templateObject8$b || (_templateObject8$b = _taggedTemplateLiteralLoose(["\n border-left-color: #fbcb01;\n "])));
17127
17151
  }, function (props) {
17128
17152
  return props.borderType === 'danger' && styled.css(_templateObject9$a || (_templateObject9$a = _taggedTemplateLiteralLoose(["\n border-left-color: #e23851;\n "])));
17129
17153
  }, function (props) {
@@ -17162,7 +17186,7 @@ var Toast = function Toast(props) {
17162
17186
  })), React__default.createElement(IconContent, null, React__default.createElement("h4", null, props.title), React__default.createElement("p", null, " ", props.description)));
17163
17187
  };
17164
17188
 
17165
- var _templateObject$G, _templateObject2$u, _templateObject3$o, _templateObject4$k, _templateObject5$j, _templateObject6$h, _templateObject7$f, _templateObject8$b, _templateObject9$b, _templateObject10$8, _templateObject11$6;
17189
+ var _templateObject$G, _templateObject2$u, _templateObject3$o, _templateObject4$k, _templateObject5$j, _templateObject6$h, _templateObject7$f, _templateObject8$c, _templateObject9$b, _templateObject10$8, _templateObject11$6;
17166
17190
  var Container$d = styled__default.div(_templateObject$G || (_templateObject$G = _taggedTemplateLiteralLoose(["\n width: 100%;\n height: 300px;\n position: absolute;\n padding: 14px;\n"])));
17167
17191
  var Header$4 = styled__default.div(_templateObject2$u || (_templateObject2$u = _taggedTemplateLiteralLoose(["\n display: flex;\n"])));
17168
17192
  var HeaderImage = styled__default.div(_templateObject3$o || (_templateObject3$o = _taggedTemplateLiteralLoose(["\n width: 43px;\n height: 44px;\n background-color: #ebebeb;\n"])));
@@ -17173,7 +17197,7 @@ var HeaderLine = styled__default.div(_templateObject6$h || (_templateObject6$h =
17173
17197
  }, function (props) {
17174
17198
  return props.size === 'mini' && styled.css(_templateObject7$f || (_templateObject7$f = _taggedTemplateLiteralLoose(["\n width: 15%;\n "])));
17175
17199
  }, function (props) {
17176
- return props.size === 'small' && styled.css(_templateObject8$b || (_templateObject8$b = _taggedTemplateLiteralLoose(["\n width: 25%;\n "])));
17200
+ return props.size === 'small' && styled.css(_templateObject8$c || (_templateObject8$c = _taggedTemplateLiteralLoose(["\n width: 25%;\n "])));
17177
17201
  }, function (props) {
17178
17202
  return props.size === 'medium' && styled.css(_templateObject9$b || (_templateObject9$b = _taggedTemplateLiteralLoose(["\n width: 45%;\n "])));
17179
17203
  }, function (props) {
@@ -17227,7 +17251,7 @@ var HeaderLine$1 = styled__default.div(_templateObject$H || (_templateObject$H =
17227
17251
  return props.size === 'large' && styled.css(_templateObject5$k || (_templateObject5$k = _taggedTemplateLiteralLoose(["\n width: 75%;\n "])));
17228
17252
  });
17229
17253
 
17230
- var _templateObject$I, _templateObject2$w, _templateObject3$q, _templateObject4$m, _templateObject5$l, _templateObject6$i, _templateObject7$g, _templateObject8$c;
17254
+ var _templateObject$I, _templateObject2$w, _templateObject3$q, _templateObject4$m, _templateObject5$l, _templateObject6$i, _templateObject7$g, _templateObject8$d;
17231
17255
  var Container$e = styled__default.div(_templateObject$I || (_templateObject$I = _taggedTemplateLiteralLoose(["\n width: 100%;\n max-height: 100%;\n position: absolute;\n padding: 14px;\n"])));
17232
17256
  var Template2Container = styled__default(Container$e)(_templateObject2$w || (_templateObject2$w = _taggedTemplateLiteralLoose(["\n background: #fff;\n border: 2px solid #ebebeb;\n"])));
17233
17257
  var Header$5 = styled__default.div(_templateObject3$q || (_templateObject3$q = _taggedTemplateLiteralLoose(["\n display: flex;\n"])));
@@ -17235,7 +17259,7 @@ var HeaderImage$1 = styled__default.div(_templateObject4$m || (_templateObject4$
17235
17259
  var HeaderContent$1 = styled__default.div(_templateObject5$l || (_templateObject5$l = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n flex: 1;\n"])));
17236
17260
  var MainContent$1 = styled__default.div(_templateObject6$i || (_templateObject6$i = _taggedTemplateLiteralLoose(["\n margin-top: 8px;\n"])));
17237
17261
  var MainLine$1 = styled__default(HeaderLine$1)(_templateObject7$g || (_templateObject7$g = _taggedTemplateLiteralLoose(["\n margin-bottom: 14px;\n margin-left: 0;\n"])));
17238
- var HeaderLine$2 = styled__default(HeaderLine$1)(_templateObject8$c || (_templateObject8$c = _taggedTemplateLiteralLoose([""])));
17262
+ var HeaderLine$2 = styled__default(HeaderLine$1)(_templateObject8$d || (_templateObject8$d = _taggedTemplateLiteralLoose([""])));
17239
17263
 
17240
17264
  var Template2 = function Template2(props) {
17241
17265
  if (!props.loading) return React__default.createElement(React__default.Fragment, null);
@@ -17290,7 +17314,7 @@ var Template3 = function Template3(props) {
17290
17314
  }));
17291
17315
  };
17292
17316
 
17293
- var _templateObject$K, _templateObject2$y, _templateObject3$s, _templateObject4$n, _templateObject5$m, _templateObject6$j, _templateObject7$h, _templateObject8$d;
17317
+ var _templateObject$K, _templateObject2$y, _templateObject3$s, _templateObject4$n, _templateObject5$m, _templateObject6$j, _templateObject7$h, _templateObject8$e;
17294
17318
  var Container$g = styled__default.div(_templateObject$K || (_templateObject$K = _taggedTemplateLiteralLoose(["\n width: 100%;\n max-height: 100%;\n position: absolute;\n padding: 14px;\n"])));
17295
17319
  var HeaderLine$3 = styled__default.div(_templateObject2$y || (_templateObject2$y = _taggedTemplateLiteralLoose(["\n height: ", ";\n background-color: #ebebeb;\n margin-left: 7px;\n\n & + div {\n margin-top: 14px;\n }\n\n ", "\n ", "\n\n ", "\n\n ", "\n"])), function (props) {
17296
17320
  return props.height;
@@ -17304,7 +17328,7 @@ var HeaderLine$3 = styled__default.div(_templateObject2$y || (_templateObject2$y
17304
17328
  return props.size === 'large' && styled.css(_templateObject6$j || (_templateObject6$j = _taggedTemplateLiteralLoose(["\n width: 75%;\n "])));
17305
17329
  });
17306
17330
  var Template4Container = styled__default(Container$g)(_templateObject7$h || (_templateObject7$h = _taggedTemplateLiteralLoose(["\n border: 1px solid #e6e6e7;\n border-radius: 4px;\n"])));
17307
- var CustomLine = styled__default(HeaderLine$3)(_templateObject8$d || (_templateObject8$d = _taggedTemplateLiteralLoose(["\n width: ", ";\n height: ", ";\n background-color: ", ";\n"])), function (props) {
17331
+ var CustomLine = styled__default(HeaderLine$3)(_templateObject8$e || (_templateObject8$e = _taggedTemplateLiteralLoose(["\n width: ", ";\n height: ", ";\n background-color: ", ";\n"])), function (props) {
17308
17332
  return props.width;
17309
17333
  }, function (props) {
17310
17334
  return props.height;
@@ -17357,7 +17381,7 @@ var Template4 = function Template4(props) {
17357
17381
  }));
17358
17382
  };
17359
17383
 
17360
- var _templateObject$L, _templateObject2$z, _templateObject3$t, _templateObject4$o, _templateObject5$n, _templateObject6$k, _templateObject7$i, _templateObject8$e, _templateObject9$c;
17384
+ var _templateObject$L, _templateObject2$z, _templateObject3$t, _templateObject4$o, _templateObject5$n, _templateObject6$k, _templateObject7$i, _templateObject8$f, _templateObject9$c;
17361
17385
  var Container$h = styled__default.div(_templateObject$L || (_templateObject$L = _taggedTemplateLiteralLoose(["\n position: absolute;\n width: 746px;\n height: 169px;\n border: 1px solid #e6e6e7;\n border-radius: 4px;\n padding: 14px;\n display: flex;\n align-items: center;\n justify-content: space-between;\n"])));
17362
17386
  var Circle = styled__default.div(_templateObject2$z || (_templateObject2$z = _taggedTemplateLiteralLoose(["\n width: 141px;\n height: 141px;\n background-color: #dddedf;\n border-radius: 50%;\n"])));
17363
17387
  var HeaderLine$4 = styled__default.div(_templateObject3$t || (_templateObject3$t = _taggedTemplateLiteralLoose(["\n height: ", ";\n background-color: #ebebeb;\n margin-left: 7px;\n\n & + div {\n margin-top: 14px;\n }\n\n ", "\n ", "\n\n ", "\n\n ", "\n"])), function (props) {
@@ -17371,7 +17395,7 @@ var HeaderLine$4 = styled__default.div(_templateObject3$t || (_templateObject3$t
17371
17395
  }, function (props) {
17372
17396
  return props.size === 'large' && styled.css(_templateObject7$i || (_templateObject7$i = _taggedTemplateLiteralLoose(["\n width: 75%;\n "])));
17373
17397
  });
17374
- var CustomLine$1 = styled__default(HeaderLine$4)(_templateObject8$e || (_templateObject8$e = _taggedTemplateLiteralLoose(["\n width: ", ";\n height: ", ";\n background-color: ", ";\n"])), function (props) {
17398
+ var CustomLine$1 = styled__default(HeaderLine$4)(_templateObject8$f || (_templateObject8$f = _taggedTemplateLiteralLoose(["\n width: ", ";\n height: ", ";\n background-color: ", ";\n"])), function (props) {
17375
17399
  return props.width;
17376
17400
  }, function (props) {
17377
17401
  return props.height;
@@ -17405,7 +17429,7 @@ var Template5 = function Template5(props) {
17405
17429
  })));
17406
17430
  };
17407
17431
 
17408
- var _templateObject$M, _templateObject2$A, _templateObject3$u, _templateObject4$p, _templateObject5$o, _templateObject6$l, _templateObject7$j, _templateObject8$f, _templateObject9$d;
17432
+ var _templateObject$M, _templateObject2$A, _templateObject3$u, _templateObject4$p, _templateObject5$o, _templateObject6$l, _templateObject7$j, _templateObject8$g, _templateObject9$d;
17409
17433
  var Container$i = styled__default.div(_templateObject$M || (_templateObject$M = _taggedTemplateLiteralLoose(["\n width: 395px;\n\n display: flex;\n align-items: center;\n justify-content: space-between;\n background-color: #f5f5f5;\n"])));
17410
17434
  var Header$6 = styled__default.div(_templateObject2$A || (_templateObject2$A = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n padding: 14px;\n"])));
17411
17435
  var Footer$3 = styled__default.div(_templateObject3$u || (_templateObject3$u = _taggedTemplateLiteralLoose(["\n width: 100%;\n border-top: 1px solid #b1b1b3;\n height: 50px;\n"])));
@@ -17418,7 +17442,7 @@ var HeaderLine$5 = styled__default.div(_templateObject4$p || (_templateObject4$p
17418
17442
  }, function (props) {
17419
17443
  return props.size === 'medium' && styled.css(_templateObject7$j || (_templateObject7$j = _taggedTemplateLiteralLoose(["\n width: 45%;\n "])));
17420
17444
  }, function (props) {
17421
- return props.size === 'large' && styled.css(_templateObject8$f || (_templateObject8$f = _taggedTemplateLiteralLoose(["\n width: 75%;\n "])));
17445
+ return props.size === 'large' && styled.css(_templateObject8$g || (_templateObject8$g = _taggedTemplateLiteralLoose(["\n width: 75%;\n "])));
17422
17446
  });
17423
17447
  var CustomLine$2 = styled__default(HeaderLine$5)(_templateObject9$d || (_templateObject9$d = _taggedTemplateLiteralLoose(["\n width: ", ";\n height: ", ";\n background-color: ", ";\n border: 1px solid #dedede5e;\n"])), function (props) {
17424
17448
  return props.width;
@@ -17448,7 +17472,7 @@ var Template6 = function Template6(props) {
17448
17472
  })));
17449
17473
  };
17450
17474
 
17451
- var _templateObject$N, _templateObject2$B, _templateObject3$v, _templateObject4$q, _templateObject5$p, _templateObject6$m, _templateObject7$k, _templateObject8$g, _templateObject9$e, _templateObject10$9;
17475
+ var _templateObject$N, _templateObject2$B, _templateObject3$v, _templateObject4$q, _templateObject5$p, _templateObject6$m, _templateObject7$k, _templateObject8$h, _templateObject9$e, _templateObject10$9;
17452
17476
  var Container$j = styled__default.div(_templateObject$N || (_templateObject$N = _taggedTemplateLiteralLoose(["\n width: 395px;\n height: 110px;\n display: flex;\n flex-direction: column;\n align-items: center;\n background: #f5f5f5 0% 0% no-repeat padding-box;\n"])));
17453
17477
  var Header$7 = styled__default.div(_templateObject2$B || (_templateObject2$B = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n padding: 14px;\n width: 100%;\n"])));
17454
17478
  var HeaderLine$6 = styled__default.div(_templateObject3$v || (_templateObject3$v = _taggedTemplateLiteralLoose(["\n height: ", ";\n background-color: #ebebeb;\n margin-left: 7px;\n\n & + div {\n margin-top: 14px;\n }\n\n ", "\n ", "\n\n ", "\n\n ", "\n"])), function (props) {
@@ -17462,7 +17486,7 @@ var HeaderLine$6 = styled__default.div(_templateObject3$v || (_templateObject3$v
17462
17486
  }, function (props) {
17463
17487
  return props.size === 'large' && styled.css(_templateObject7$k || (_templateObject7$k = _taggedTemplateLiteralLoose(["\n width: 75%;\n "])));
17464
17488
  });
17465
- var CustomLine$3 = styled__default(HeaderLine$6)(_templateObject8$g || (_templateObject8$g = _taggedTemplateLiteralLoose(["\n width: ", ";\n height: ", ";\n background-color: ", ";\n border: 1px solid #dedede5e;\n"])), function (props) {
17489
+ var CustomLine$3 = styled__default(HeaderLine$6)(_templateObject8$h || (_templateObject8$h = _taggedTemplateLiteralLoose(["\n width: ", ";\n height: ", ";\n background-color: ", ";\n border: 1px solid #dedede5e;\n"])), function (props) {
17466
17490
  return props.width;
17467
17491
  }, function (props) {
17468
17492
  return props.height;
@@ -17482,7 +17506,7 @@ var Template7 = function Template7(props) {
17482
17506
  })), React__default.createElement(Main$2, null, React__default.createElement(Circle$1, null), React__default.createElement(Circle$1, null), React__default.createElement(Circle$1, null), React__default.createElement(Circle$1, null), React__default.createElement(Circle$1, null)));
17483
17507
  };
17484
17508
 
17485
- var _templateObject$O, _templateObject2$C, _templateObject3$w, _templateObject4$r, _templateObject5$q, _templateObject6$n, _templateObject7$l, _templateObject8$h, _templateObject9$f;
17509
+ var _templateObject$O, _templateObject2$C, _templateObject3$w, _templateObject4$r, _templateObject5$q, _templateObject6$n, _templateObject7$l, _templateObject8$i, _templateObject9$f;
17486
17510
  var Container$k = styled__default.div(_templateObject$O || (_templateObject$O = _taggedTemplateLiteralLoose(["\n width: 395px;\n height: 110px;\n display: flex;\n flex-direction: column;\n align-items: center;\n background: #f5f5f5 0% 0% no-repeat padding-box;\n"])));
17487
17511
  var Header$8 = styled__default.div(_templateObject2$C || (_templateObject2$C = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n padding: 14px;\n width: 100%;\n"])));
17488
17512
  var HeaderLine$7 = styled__default.div(_templateObject3$w || (_templateObject3$w = _taggedTemplateLiteralLoose(["\n height: ", ";\n background-color: #ebebeb;\n margin-left: 7px;\n\n & + div {\n margin-top: 14px;\n }\n\n ", "\n ", "\n\n ", "\n\n ", "\n"])), function (props) {
@@ -17496,7 +17520,7 @@ var HeaderLine$7 = styled__default.div(_templateObject3$w || (_templateObject3$w
17496
17520
  }, function (props) {
17497
17521
  return props.size === 'large' && styled.css(_templateObject7$l || (_templateObject7$l = _taggedTemplateLiteralLoose(["\n width: 75%;\n "])));
17498
17522
  });
17499
- var CustomLine$4 = styled__default(HeaderLine$7)(_templateObject8$h || (_templateObject8$h = _taggedTemplateLiteralLoose(["\n width: ", ";\n height: ", ";\n background-color: ", ";\n border: 1px solid #dedede5e;\n"])), function (props) {
17523
+ var CustomLine$4 = styled__default(HeaderLine$7)(_templateObject8$i || (_templateObject8$i = _taggedTemplateLiteralLoose(["\n width: ", ";\n height: ", ";\n background-color: ", ";\n border: 1px solid #dedede5e;\n"])), function (props) {
17500
17524
  return props.width;
17501
17525
  }, function (props) {
17502
17526
  return props.height;
@@ -17525,7 +17549,7 @@ var Template8 = function Template8(props) {
17525
17549
  })));
17526
17550
  };
17527
17551
 
17528
- var _templateObject$P, _templateObject2$D, _templateObject3$x, _templateObject4$s, _templateObject5$r, _templateObject6$o, _templateObject7$m, _templateObject8$i, _templateObject9$g, _templateObject10$a;
17552
+ var _templateObject$P, _templateObject2$D, _templateObject3$x, _templateObject4$s, _templateObject5$r, _templateObject6$o, _templateObject7$m, _templateObject8$j, _templateObject9$g, _templateObject10$a;
17529
17553
  var Container$l = styled__default.div(_templateObject$P || (_templateObject$P = _taggedTemplateLiteralLoose(["\n width: 395px;\n height: 245px;\n display: flex;\n flex-direction: column;\n align-items: center;\n background: #f5f5f5 0% 0% no-repeat padding-box;\n"])));
17530
17554
  var Header$9 = styled__default.div(_templateObject2$D || (_templateObject2$D = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n padding: 14px;\n width: 100%;\n"])));
17531
17555
  var HeaderLine$8 = styled__default.div(_templateObject3$x || (_templateObject3$x = _taggedTemplateLiteralLoose(["\n height: ", ";\n background-color: #ebebeb;\n margin-left: 7px;\n\n & + div {\n margin-top: 7px;\n }\n\n ", "\n ", "\n\n ", "\n\n ", "\n"])), function (props) {
@@ -17539,7 +17563,7 @@ var HeaderLine$8 = styled__default.div(_templateObject3$x || (_templateObject3$x
17539
17563
  }, function (props) {
17540
17564
  return props.size === 'large' && styled.css(_templateObject7$m || (_templateObject7$m = _taggedTemplateLiteralLoose(["\n width: 75%;\n "])));
17541
17565
  });
17542
- var CustomLine$5 = styled__default(HeaderLine$8)(_templateObject8$i || (_templateObject8$i = _taggedTemplateLiteralLoose(["\n width: ", ";\n height: ", ";\n background-color: ", ";\n border: 1px solid #dedede5e;\n"])), function (props) {
17566
+ var CustomLine$5 = styled__default(HeaderLine$8)(_templateObject8$j || (_templateObject8$j = _taggedTemplateLiteralLoose(["\n width: ", ";\n height: ", ";\n background-color: ", ";\n border: 1px solid #dedede5e;\n"])), function (props) {
17543
17567
  return props.width;
17544
17568
  }, function (props) {
17545
17569
  return props.height;
@@ -17564,7 +17588,7 @@ var Template8$1 = function Template8(props) {
17564
17588
  })), React__default.createElement(Main$4, null, React__default.createElement(Circle$2, null)));
17565
17589
  };
17566
17590
 
17567
- var _templateObject$Q, _templateObject2$E, _templateObject3$y, _templateObject4$t, _templateObject5$s, _templateObject6$p, _templateObject7$n, _templateObject8$j, _templateObject9$h, _templateObject10$b, _templateObject11$7;
17591
+ var _templateObject$Q, _templateObject2$E, _templateObject3$y, _templateObject4$t, _templateObject5$s, _templateObject6$p, _templateObject7$n, _templateObject8$k, _templateObject9$h, _templateObject10$b, _templateObject11$7;
17568
17592
  var Container$m = styled__default.div(_templateObject$Q || (_templateObject$Q = _taggedTemplateLiteralLoose(["\n width: 395px;\n height: 245px;\n display: flex;\n flex-direction: column;\n align-items: center;\n background: #f5f5f5 0% 0% no-repeat padding-box;\n"])));
17569
17593
  var Header$a = styled__default.div(_templateObject2$E || (_templateObject2$E = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n padding: 14px;\n width: 100%;\n"])));
17570
17594
  var HeaderLine$9 = styled__default.div(_templateObject3$y || (_templateObject3$y = _taggedTemplateLiteralLoose(["\n height: ", ";\n background-color: #ebebeb;\n margin-left: 7px;\n\n & + div {\n margin-top: 7px;\n }\n\n ", "\n ", "\n\n ", "\n\n ", "\n"])), function (props) {
@@ -17578,7 +17602,7 @@ var HeaderLine$9 = styled__default.div(_templateObject3$y || (_templateObject3$y
17578
17602
  }, function (props) {
17579
17603
  return props.size === 'large' && styled.css(_templateObject7$n || (_templateObject7$n = _taggedTemplateLiteralLoose(["\n width: 75%;\n "])));
17580
17604
  });
17581
- var CustomLine$6 = styled__default(HeaderLine$9)(_templateObject8$j || (_templateObject8$j = _taggedTemplateLiteralLoose(["\n width: ", ";\n height: ", ";\n background-color: ", ";\n border: 1px solid #dedede5e;\n"])), function (props) {
17605
+ var CustomLine$6 = styled__default(HeaderLine$9)(_templateObject8$k || (_templateObject8$k = _taggedTemplateLiteralLoose(["\n width: ", ";\n height: ", ";\n background-color: ", ";\n border: 1px solid #dedede5e;\n"])), function (props) {
17582
17606
  return props.width;
17583
17607
  }, function (props) {
17584
17608
  return props.height;
@@ -18382,7 +18406,7 @@ var useContext$2 = function useContext() {
18382
18406
  return React__default.useContext(Provider$2);
18383
18407
  };
18384
18408
 
18385
- var _templateObject$W, _templateObject2$I, _templateObject3$C, _templateObject4$w, _templateObject5$u, _templateObject6$q, _templateObject7$o, _templateObject8$k, _templateObject9$i, _templateObject10$c, _templateObject11$8, _templateObject12$4, _templateObject13$3, _templateObject14$3, _templateObject15$2;
18409
+ var _templateObject$W, _templateObject2$I, _templateObject3$C, _templateObject4$w, _templateObject5$u, _templateObject6$q, _templateObject7$o, _templateObject8$l, _templateObject9$i, _templateObject10$c, _templateObject11$8, _templateObject12$4, _templateObject13$3, _templateObject14$3, _templateObject15$2;
18386
18410
  var aligns = {
18387
18411
  self: {
18388
18412
  horizontal: {
@@ -18453,7 +18477,7 @@ var Col = styled__default.div(_templateObject$W || (_templateObject$W = _taggedT
18453
18477
  if (align.content.horizontal !== undefined) {
18454
18478
  var _v2 = align.content.horizontal;
18455
18479
  var _a2 = aligns.content.horizontal;
18456
- styles.push(styled.css(_templateObject8$k || (_templateObject8$k = _taggedTemplateLiteralLoose(["\n justify-content: ", ";\n "])), _a2[_v2]));
18480
+ styles.push(styled.css(_templateObject8$l || (_templateObject8$l = _taggedTemplateLiteralLoose(["\n justify-content: ", ";\n "])), _a2[_v2]));
18457
18481
  }
18458
18482
 
18459
18483
  if (align.content.vertical !== undefined) {
@@ -18541,7 +18565,7 @@ var Grid$1 = function Grid$1(props) {
18541
18565
  }, React__default.createElement(Grid, Object.assign({}, gridProps)));
18542
18566
  };
18543
18567
 
18544
- var _templateObject$Y, _templateObject2$K, _templateObject3$E, _templateObject4$x, _templateObject5$v, _templateObject6$r, _templateObject7$p, _templateObject8$l, _templateObject9$j, _templateObject10$d;
18568
+ var _templateObject$Y, _templateObject2$K, _templateObject3$E, _templateObject4$x, _templateObject5$v, _templateObject6$r, _templateObject7$p, _templateObject8$m, _templateObject9$j, _templateObject10$d;
18545
18569
  var horizontalAligns = {
18546
18570
  around: 'space-around',
18547
18571
  between: 'space-between',
@@ -18598,7 +18622,7 @@ var Row = styled__default.div(_templateObject$Y || (_templateObject$Y = _taggedT
18598
18622
  even: theme.colors.white,
18599
18623
  odd: theme.colors.white
18600
18624
  });
18601
- return styled.css(_templateObject8$l || (_templateObject8$l = _taggedTemplateLiteralLoose(["\n :nth-child(even) {\n background-color: ", ";\n }\n :nth-child(odd) {\n background-color: ", ";\n }\n "])), colors.even, colors.odd);
18625
+ return styled.css(_templateObject8$m || (_templateObject8$m = _taggedTemplateLiteralLoose(["\n :nth-child(even) {\n background-color: ", ";\n }\n :nth-child(odd) {\n background-color: ", ";\n }\n "])), colors.even, colors.odd);
18602
18626
  }, function (_ref6) {
18603
18627
  var fontColor = _ref6.fontColor,
18604
18628
  theme = _ref6.theme;