@ultraviolet/ui 1.28.0 → 1.29.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (112) hide show
  1. package/README.md +14 -7
  2. package/dist/index.d.ts +61 -12
  3. package/dist/react-datepicker/dist/react-datepicker.min.css.js +1 -1
  4. package/dist/src/components/ActionBar/index.js +22 -37
  5. package/dist/src/components/Alert/index.js +27 -41
  6. package/dist/src/components/Avatar/index.js +48 -69
  7. package/dist/src/components/Badge/index.js +29 -49
  8. package/dist/src/components/Banner/index.js +42 -62
  9. package/dist/src/components/BarChart/Tooltip.js +35 -50
  10. package/dist/src/components/BarChart/index.js +13 -14
  11. package/dist/src/components/BarStack/index.js +100 -191
  12. package/dist/src/components/Breadcrumbs/index.js +29 -39
  13. package/dist/src/components/Bullet/index.js +42 -55
  14. package/dist/src/components/Button/index.js +73 -99
  15. package/dist/src/components/Card/index.js +39 -57
  16. package/dist/src/components/Carousel/index.js +32 -60
  17. package/dist/src/components/Checkbox/index.js +153 -341
  18. package/dist/src/components/CheckboxGroup/index.js +25 -27
  19. package/dist/src/components/CopyButton/index.js +11 -12
  20. package/dist/src/components/DateInput/index.js +141 -268
  21. package/dist/src/components/EmptyState/index.js +68 -83
  22. package/dist/src/components/Expandable/index.js +13 -20
  23. package/dist/src/components/GlobalAlert/GlobalAlertLink.js +12 -13
  24. package/dist/src/components/GlobalAlert/index.js +19 -32
  25. package/dist/src/components/LineChart/CustomLegend.js +80 -89
  26. package/dist/src/components/LineChart/Tooltip.js +32 -47
  27. package/dist/src/components/LineChart/helpers.js +15 -50
  28. package/dist/src/components/LineChart/index.js +23 -33
  29. package/dist/src/components/Link/index.js +46 -65
  30. package/dist/src/components/List/Body.js +9 -15
  31. package/dist/src/components/List/Cell.js +6 -7
  32. package/dist/src/components/List/HeaderCell.js +28 -56
  33. package/dist/src/components/List/HeaderRow.js +9 -16
  34. package/dist/src/components/List/ListContext.js +5 -6
  35. package/dist/src/components/List/Row.js +44 -90
  36. package/dist/src/components/List/SelectBar.js +9 -13
  37. package/dist/src/components/List/SkeletonRows.js +5 -6
  38. package/dist/src/components/List/index.js +15 -25
  39. package/dist/src/components/Loader/index.js +18 -25
  40. package/dist/src/components/Menu/Item.js +39 -49
  41. package/dist/src/components/Menu/index.js +31 -56
  42. package/dist/src/components/MenuV2/Item.js +39 -49
  43. package/dist/src/components/MenuV2/index.js +28 -47
  44. package/dist/src/components/Meter/index.js +25 -47
  45. package/dist/src/components/Modal/Dialog.js +33 -58
  46. package/dist/src/components/Modal/Disclosure.js +8 -9
  47. package/dist/src/components/Modal/index.js +26 -33
  48. package/dist/src/components/Notice/index.js +21 -27
  49. package/dist/src/components/NumberInput/index.js +73 -137
  50. package/dist/src/components/Pagination/getPageNumbers.js +1 -4
  51. package/dist/src/components/Pagination/index.js +17 -27
  52. package/dist/src/components/PasswordCheck/index.js +26 -32
  53. package/dist/src/components/PasswordStrengthMeter/index.js +25 -44
  54. package/dist/src/components/PieChart/Legends.js +71 -107
  55. package/dist/src/components/PieChart/Tooltip.js +33 -36
  56. package/dist/src/components/PieChart/index.js +13 -17
  57. package/dist/src/components/Popover/index.js +58 -75
  58. package/dist/src/components/Popup/helpers.js +13 -15
  59. package/dist/src/components/Popup/index.js +55 -98
  60. package/dist/src/components/ProgressBar/index.js +31 -49
  61. package/dist/src/components/Radio/index.js +58 -113
  62. package/dist/src/components/RadioGroup/index.js +26 -28
  63. package/dist/src/components/Row/index.js +25 -31
  64. package/dist/src/components/SelectInput/index.js +357 -410
  65. package/dist/src/components/SelectableCard/index.js +60 -111
  66. package/dist/src/components/Separator/index.js +52 -73
  67. package/dist/src/components/Skeleton/Block.js +23 -41
  68. package/dist/src/components/Skeleton/Blocks.js +23 -41
  69. package/dist/src/components/Skeleton/BoxWithIcon.js +21 -36
  70. package/dist/src/components/Skeleton/Donut.js +3 -6
  71. package/dist/src/components/Skeleton/IconSkeleton.js +13 -31
  72. package/dist/src/components/Skeleton/Line.js +5 -11
  73. package/dist/src/components/Skeleton/List.js +22 -31
  74. package/dist/src/components/Skeleton/Slider.js +25 -46
  75. package/dist/src/components/Skeleton/Square.js +3 -6
  76. package/dist/src/components/Skeleton/index.js +17 -33
  77. package/dist/src/components/Snippet/index.js +82 -137
  78. package/dist/src/components/Stack/index.js +11 -14
  79. package/dist/src/components/Status/index.js +48 -78
  80. package/dist/src/components/StepList/index.js +45 -63
  81. package/dist/src/components/Stepper/index.js +74 -129
  82. package/dist/src/components/SwitchButton/FocusOverlay.js +13 -23
  83. package/dist/src/components/SwitchButton/index.js +36 -62
  84. package/dist/src/components/Table/Body.js +5 -8
  85. package/dist/src/components/Table/Cell.js +14 -20
  86. package/dist/src/components/Table/Header.js +8 -14
  87. package/dist/src/components/Table/HeaderCell.js +40 -56
  88. package/dist/src/components/Table/HeaderRow.js +4 -5
  89. package/dist/src/components/Table/Row.js +10 -14
  90. package/dist/src/components/Table/SelectBar.js +9 -13
  91. package/dist/src/components/Table/SkeletonRows.js +5 -6
  92. package/dist/src/components/Table/TableContext.js +6 -7
  93. package/dist/src/components/Table/index.js +44 -50
  94. package/dist/src/components/Tabs/Tab.js +57 -118
  95. package/dist/src/components/Tabs/TabMenu.js +32 -38
  96. package/dist/src/components/Tabs/TabMenuItem.js +9 -13
  97. package/dist/src/components/Tabs/index.js +24 -43
  98. package/dist/src/components/Tag/index.js +57 -74
  99. package/dist/src/components/TagInput/index.js +63 -94
  100. package/dist/src/components/TagList/index.js +22 -35
  101. package/dist/src/components/Text/index.js +29 -31
  102. package/dist/src/components/TextArea/index.js +240 -0
  103. package/dist/src/components/TextInput/index.js +166 -260
  104. package/dist/src/components/TimeInput/index.js +10 -13
  105. package/dist/src/components/Toaster/index.js +51 -67
  106. package/dist/src/components/Toggle/index.js +62 -129
  107. package/dist/src/components/ToggleGroup/index.js +21 -23
  108. package/dist/src/components/Tooltip/index.js +28 -31
  109. package/dist/src/components/VerificationCode/index.js +55 -90
  110. package/dist/src/index.js +1 -0
  111. package/dist/src/utils/ids.js +1 -6
  112. package/package.json +6 -6
package/README.md CHANGED
@@ -13,8 +13,14 @@ $ pnpm add @ultraviolet/ui @emotion/react @emotion/styled
13
13
  You will also need to import fonts in your project by adding:
14
14
 
15
15
  ```html
16
- <link href="https://fonts.cdnfonts.com/css/inter?styles=29139,29137,29140" rel="stylesheet">
17
- <link href="https://fonts.cdnfonts.com/css/jetbrains-mono-2?styles=156604" rel="stylesheet">
16
+ <link
17
+ href="https://fonts.cdnfonts.com/css/inter?styles=29139,29137,29140"
18
+ rel="stylesheet"
19
+ />
20
+ <link
21
+ href="https://fonts.cdnfonts.com/css/jetbrains-mono-2?styles=156604"
22
+ rel="stylesheet"
23
+ />
18
24
  ```
19
25
 
20
26
  ### Usage
@@ -25,10 +31,12 @@ import { Button, normalize, theme } from '@ultraviolet/ui'
25
31
 
26
32
  const App = () => (
27
33
  <ThemeProvider theme={theme}>
28
- <Global styles={css`${normalize()}`} />
29
- <Button onClick={() => console.log('clicked')}>
30
- Click Me
31
- </Button>
34
+ <Global
35
+ styles={css`
36
+ ${normalize()}
37
+ `}
38
+ />
39
+ <Button onClick={() => console.log('clicked')}>Click Me</Button>
32
40
  </ThemeProvider>
33
41
  )
34
42
  ```
@@ -64,7 +72,6 @@ declare module '@emotion/react' {
64
72
 
65
73
  Checkout our [documentation website](https://storybook.ultraviolet.scaleway.com/).
66
74
 
67
-
68
75
  ## Contributing
69
76
 
70
77
  📝 You can participate in the development and [start contributing](/CONTRIBUTING.md) to it.
package/dist/index.d.ts CHANGED
@@ -1,5 +1,5 @@
1
1
  import * as react from 'react';
2
- import react__default, { ReactNode, ComponentProps, ButtonHTMLAttributes, AriaRole, MouseEventHandler, JSX, MouseEvent, InputHTMLAttributes, FocusEvent, HTMLAttributeAnchorTarget, AnchorHTMLAttributes, ReactElement, Ref, RefObject, KeyboardEventHandler, HTMLAttributes, CSSProperties, ChangeEventHandler, FocusEventHandler, ForwardRefExoticComponent, ForwardedRef, ElementType, TextareaHTMLAttributes } from 'react';
2
+ import react__default, { ReactNode, ComponentProps, ButtonHTMLAttributes, AriaRole, MouseEventHandler, JSX, MouseEvent, InputHTMLAttributes, FocusEvent, HTMLAttributeAnchorTarget, AnchorHTMLAttributes, ReactElement, Ref, RefObject, KeyboardEventHandler, HTMLAttributes, CSSProperties, ChangeEventHandler, FocusEventHandler, ForwardRefExoticComponent, ForwardedRef, ElementType, DOMAttributes, TextareaHTMLAttributes } from 'react';
3
3
  import * as _emotion_react_jsx_runtime from '@emotion/react/jsx-runtime';
4
4
  import * as _emotion_styled from '@emotion/styled';
5
5
  import * as _emotion_react from '@emotion/react';
@@ -944,13 +944,13 @@ declare const VARIANTS_COMPONENTS: {
944
944
  filled: {
945
945
  button: _emotion_styled.StyledComponent<{
946
946
  theme?: Theme | undefined;
947
- as?: react.ElementType<any> | undefined;
947
+ as?: react.ElementType<any, keyof react.JSX.IntrinsicElements> | undefined;
948
948
  } & Required<Pick<FinalProps, "size" | "sentiment" | "disabled" | "iconPosition" | "fullWidth">> & {
949
949
  iconOnly: boolean;
950
950
  }, react.DetailedHTMLProps<ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, {}>;
951
951
  link: _emotion_styled.StyledComponent<{
952
952
  theme?: Theme | undefined;
953
- as?: react.ElementType<any> | undefined;
953
+ as?: react.ElementType<any, keyof react.JSX.IntrinsicElements> | undefined;
954
954
  } & Required<Pick<FinalProps, "size" | "sentiment" | "disabled" | "iconPosition" | "fullWidth">> & {
955
955
  iconOnly: boolean;
956
956
  }, react.DetailedHTMLProps<react.AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>, {}>;
@@ -958,13 +958,13 @@ declare const VARIANTS_COMPONENTS: {
958
958
  outlined: {
959
959
  button: _emotion_styled.StyledComponent<{
960
960
  theme?: Theme | undefined;
961
- as?: react.ElementType<any> | undefined;
961
+ as?: react.ElementType<any, keyof react.JSX.IntrinsicElements> | undefined;
962
962
  } & Required<Pick<FinalProps, "size" | "sentiment" | "disabled" | "iconPosition" | "fullWidth">> & {
963
963
  iconOnly: boolean;
964
964
  }, react.DetailedHTMLProps<ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, {}>;
965
965
  link: _emotion_styled.StyledComponent<{
966
966
  theme?: Theme | undefined;
967
- as?: react.ElementType<any> | undefined;
967
+ as?: react.ElementType<any, keyof react.JSX.IntrinsicElements> | undefined;
968
968
  } & Required<Pick<FinalProps, "size" | "sentiment" | "disabled" | "iconPosition" | "fullWidth">> & {
969
969
  iconOnly: boolean;
970
970
  }, react.DetailedHTMLProps<react.AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>, {}>;
@@ -972,13 +972,13 @@ declare const VARIANTS_COMPONENTS: {
972
972
  ghost: {
973
973
  button: _emotion_styled.StyledComponent<{
974
974
  theme?: Theme | undefined;
975
- as?: react.ElementType<any> | undefined;
975
+ as?: react.ElementType<any, keyof react.JSX.IntrinsicElements> | undefined;
976
976
  } & Required<Pick<FinalProps, "size" | "sentiment" | "disabled" | "iconPosition" | "fullWidth">> & {
977
977
  iconOnly: boolean;
978
978
  }, react.DetailedHTMLProps<ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, {}>;
979
979
  link: _emotion_styled.StyledComponent<{
980
980
  theme?: Theme | undefined;
981
- as?: react.ElementType<any> | undefined;
981
+ as?: react.ElementType<any, keyof react.JSX.IntrinsicElements> | undefined;
982
982
  } & Required<Pick<FinalProps, "size" | "sentiment" | "disabled" | "iconPosition" | "fullWidth">> & {
983
983
  iconOnly: boolean;
984
984
  }, react.DetailedHTMLProps<react.AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>, {}>;
@@ -2242,7 +2242,7 @@ declare const variants$1: {
2242
2242
  readonly donut: () => _emotion_react_jsx_runtime.JSX.Element;
2243
2243
  readonly line: _emotion_styled.StyledComponent<{
2244
2244
  theme?: _emotion_react.Theme | undefined;
2245
- as?: react.ElementType<any> | undefined;
2245
+ as?: react.ElementType<any, keyof react.JSX.IntrinsicElements> | undefined;
2246
2246
  }, react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
2247
2247
  readonly list: ({ length, col, }: {
2248
2248
  length?: number | undefined;
@@ -2253,7 +2253,7 @@ declare const variants$1: {
2253
2253
  }) => _emotion_react_jsx_runtime.JSX.Element;
2254
2254
  readonly square: _emotion_styled.StyledComponent<{
2255
2255
  theme?: _emotion_react.Theme | undefined;
2256
- as?: react.ElementType<any> | undefined;
2256
+ as?: react.ElementType<any, keyof react.JSX.IntrinsicElements> | undefined;
2257
2257
  }, react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
2258
2258
  };
2259
2259
  type SkeletonVariant = keyof typeof variants$1;
@@ -2309,7 +2309,7 @@ type StackProps = {
2309
2309
  */
2310
2310
  declare const Stack: _emotion_styled.StyledComponent<{
2311
2311
  theme?: _emotion_react.Theme | undefined;
2312
- as?: react.ElementType<any> | undefined;
2312
+ as?: react.ElementType<any, keyof react.JSX.IntrinsicElements> | undefined;
2313
2313
  } & StackProps, react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
2314
2314
 
2315
2315
  declare const sentiments: {
@@ -2662,6 +2662,55 @@ type TextProps = {
2662
2662
  */
2663
2663
  declare const Text: ({ variant, children, as, color, sentiment, oneLine, placement, prominence, className, disabled, italic, underline, id, dir, htmlFor, "data-testid": dataTestId, }: TextProps) => _emotion_react_jsx_runtime.JSX.Element;
2664
2664
 
2665
+ type TextAreaProps = {
2666
+ id?: string;
2667
+ className?: string;
2668
+ tabIndex?: number;
2669
+ autoFocus?: boolean;
2670
+ label: string;
2671
+ value?: string;
2672
+ onChange: (newValue: string) => void;
2673
+ placeholder?: string;
2674
+ /**
2675
+ * Override others properties : readyOnly, success, error.
2676
+ */
2677
+ disabled?: boolean;
2678
+ /**
2679
+ * Override others properties : success, error.
2680
+ * Ignored if following props are provided : disabled.
2681
+ */
2682
+ readOnly?: boolean;
2683
+ /**
2684
+ * Override others properties : error, helper.
2685
+ * Ignored if following props are provided : disabled, readyOnly.
2686
+ */
2687
+ success?: string;
2688
+ /**
2689
+ * Override others properties : helper.
2690
+ * Ignored if following props are provided : disabled, readyOnly, success.
2691
+ */
2692
+ error?: string;
2693
+ /**
2694
+ * Ignored if following props are provided : readyOnly, success.
2695
+ */
2696
+ helper?: ReactNode;
2697
+ rows?: number;
2698
+ minLength?: number;
2699
+ maxLength?: number;
2700
+ tooltip?: string;
2701
+ required?: boolean;
2702
+ 'data-testid'?: string;
2703
+ name?: string;
2704
+ onFocus?: DOMAttributes<HTMLTextAreaElement>['onFocus'];
2705
+ onBlur?: DOMAttributes<HTMLTextAreaElement>['onBlur'];
2706
+ clearable?: boolean;
2707
+ labelDescription?: ReactNode;
2708
+ };
2709
+ /**
2710
+ * This component offers an extended textarea HTML
2711
+ */
2712
+ declare const TextArea: react.ForwardRefExoticComponent<TextAreaProps & react.RefAttributes<HTMLTextAreaElement>>;
2713
+
2665
2714
  declare const inputSizes: {
2666
2715
  medium: {
2667
2716
  default: string;
@@ -3000,7 +3049,7 @@ declare const pulse: _emotion_react.Keyframes;
3000
3049
 
3001
3050
  declare const Breakpoint: _emotion_styled.StyledComponent<{
3002
3051
  theme?: _emotion_react.Theme | undefined;
3003
- as?: react.ElementType<any> | undefined;
3052
+ as?: react.ElementType<any, keyof react.JSX.IntrinsicElements> | undefined;
3004
3053
  } & {
3005
3054
  down?: "large" | "small" | "xlarge" | "xsmall" | "medium" | undefined;
3006
3055
  up?: "large" | "small" | "xlarge" | "xsmall" | "medium" | undefined;
@@ -3011,4 +3060,4 @@ declare const down: (size: ScreenSize, rules: string) => string;
3011
3060
 
3012
3061
  declare const normalize: () => string;
3013
3062
 
3014
- export { ActionBar, Alert, Avatar, Badge, Banner, BarChart, BarStack, Breadcrumbs, Breakpoint, Bullet, Button, Card, Carousel, Checkbox, CheckboxGroup, CheckboxGroupCheckbox, CopyButton, DateInput, EmptyState, Expandable, GlobalAlert, LineChart, Link, List, Loader, Menu, MenuV2, Meter, Modal, Notice, NumberInput, Pagination, PasswordCheck, PasswordStrengthMeter, PieChart, Popover, Popup, ProgressBar, Radio, RadioGroup, Row, type SCWUITheme, SelectInput, SelectableCard, Separator, Skeleton, Snippet, Stack, Status, StepList, Stepper, SwitchButton, Table, Tabs, Tag, TagInput, TagList, Text, TextInput, TimeInput, ToastContainer, Toggle, ToggleGroup, Tooltip, type UltravioletUITheme, VerificationCode, bounce, down, extendTheme, fadeIn, fadeOut, flash, getUUID, normalize, ping, pulse, quickScaleDown, scaleBack, scaleDown, scaleForward, scaleUp, sketchIn, sketchOut, slideDownLarge, slideFromBottom, slideFromLeft, slideFromRight, slideFromTop, slideToBottom, slideToLeft, slideToRight, slideToTop, slideUpLarge, toast, unfoldIn, unfoldOut, up, zoomIn, zoomOut };
3063
+ export { ActionBar, Alert, Avatar, Badge, Banner, BarChart, BarStack, Breadcrumbs, Breakpoint, Bullet, Button, Card, Carousel, Checkbox, CheckboxGroup, CheckboxGroupCheckbox, CopyButton, DateInput, EmptyState, Expandable, GlobalAlert, LineChart, Link, List, Loader, Menu, MenuV2, Meter, Modal, Notice, NumberInput, Pagination, PasswordCheck, PasswordStrengthMeter, PieChart, Popover, Popup, ProgressBar, Radio, RadioGroup, Row, type SCWUITheme, SelectInput, SelectableCard, Separator, Skeleton, Snippet, Stack, Status, StepList, Stepper, SwitchButton, Table, Tabs, Tag, TagInput, TagList, Text, TextArea, TextInput, TimeInput, ToastContainer, Toggle, ToggleGroup, Tooltip, type UltravioletUITheme, VerificationCode, bounce, down, extendTheme, fadeIn, fadeOut, flash, getUUID, normalize, ping, pulse, quickScaleDown, scaleBack, scaleDown, scaleForward, scaleUp, sketchIn, sketchOut, slideDownLarge, slideFromBottom, slideFromLeft, slideFromRight, slideFromTop, slideToBottom, slideToLeft, slideToRight, slideToTop, slideUpLarge, toast, unfoldIn, unfoldOut, up, zoomIn, zoomOut };
@@ -1,3 +1,3 @@
1
- var css_248z = ".react-datepicker__year-read-view--down-arrow,.react-datepicker__month-read-view--down-arrow,.react-datepicker__month-year-read-view--down-arrow,.react-datepicker__navigation-icon::before{border-color:#ccc;border-style:solid;border-width:3px 3px 0 0;content:\"\";display:block;height:9px;position:absolute;top:6px;width:9px}.react-datepicker-popper[data-placement^=top] .react-datepicker__triangle,.react-datepicker-popper[data-placement^=bottom] .react-datepicker__triangle{margin-left:-4px;position:absolute;width:0}.react-datepicker-popper[data-placement^=top] .react-datepicker__triangle::before,.react-datepicker-popper[data-placement^=bottom] .react-datepicker__triangle::before,.react-datepicker-popper[data-placement^=top] .react-datepicker__triangle::after,.react-datepicker-popper[data-placement^=bottom] .react-datepicker__triangle::after{box-sizing:content-box;position:absolute;border:8px solid rgba(0,0,0,0);height:0;width:1px;content:\"\";z-index:-1;border-width:8px;left:-8px}.react-datepicker-popper[data-placement^=top] .react-datepicker__triangle::before,.react-datepicker-popper[data-placement^=bottom] .react-datepicker__triangle::before{border-bottom-color:#aeaeae}.react-datepicker-popper[data-placement^=bottom] .react-datepicker__triangle{top:0;margin-top:-8px}.react-datepicker-popper[data-placement^=bottom] .react-datepicker__triangle::before,.react-datepicker-popper[data-placement^=bottom] .react-datepicker__triangle::after{border-top:none;border-bottom-color:#f0f0f0}.react-datepicker-popper[data-placement^=bottom] .react-datepicker__triangle::after{top:0}.react-datepicker-popper[data-placement^=bottom] .react-datepicker__triangle::before{top:-1px;border-bottom-color:#aeaeae}.react-datepicker-popper[data-placement^=top] .react-datepicker__triangle{bottom:0;margin-bottom:-8px}.react-datepicker-popper[data-placement^=top] .react-datepicker__triangle::before,.react-datepicker-popper[data-placement^=top] .react-datepicker__triangle::after{border-bottom:none;border-top-color:#fff}.react-datepicker-popper[data-placement^=top] .react-datepicker__triangle::after{bottom:0}.react-datepicker-popper[data-placement^=top] .react-datepicker__triangle::before{bottom:-1px;border-top-color:#aeaeae}.react-datepicker-wrapper{display:inline-block;padding:0;border:0}.react-datepicker{font-family:\"Helvetica Neue\",helvetica,arial,sans-serif;font-size:.8rem;background-color:#fff;color:#000;border:1px solid #aeaeae;border-radius:.3rem;display:inline-block;position:relative}.react-datepicker--time-only .react-datepicker__triangle{left:35px}.react-datepicker--time-only .react-datepicker__time-container{border-left:0}.react-datepicker--time-only .react-datepicker__time,.react-datepicker--time-only .react-datepicker__time-box{border-bottom-left-radius:.3rem;border-bottom-right-radius:.3rem}.react-datepicker__triangle{position:absolute;left:50px}.react-datepicker-popper{z-index:1}.react-datepicker-popper[data-placement^=bottom]{padding-top:10px}.react-datepicker-popper[data-placement=bottom-end] .react-datepicker__triangle,.react-datepicker-popper[data-placement=top-end] .react-datepicker__triangle{left:auto;right:50px}.react-datepicker-popper[data-placement^=top]{padding-bottom:10px}.react-datepicker-popper[data-placement^=right]{padding-left:8px}.react-datepicker-popper[data-placement^=right] .react-datepicker__triangle{left:auto;right:42px}.react-datepicker-popper[data-placement^=left]{padding-right:8px}.react-datepicker-popper[data-placement^=left] .react-datepicker__triangle{left:42px;right:auto}.react-datepicker__header{text-align:center;background-color:#f0f0f0;border-bottom:1px solid #aeaeae;border-top-left-radius:.3rem;padding:8px 0;position:relative}.react-datepicker__header--time{padding-bottom:8px;padding-left:5px;padding-right:5px}.react-datepicker__header--time:not(.react-datepicker__header--time--only){border-top-left-radius:0}.react-datepicker__header:not(.react-datepicker__header--has-time-select){border-top-right-radius:.3rem}.react-datepicker__year-dropdown-container--select,.react-datepicker__month-dropdown-container--select,.react-datepicker__month-year-dropdown-container--select,.react-datepicker__year-dropdown-container--scroll,.react-datepicker__month-dropdown-container--scroll,.react-datepicker__month-year-dropdown-container--scroll{display:inline-block;margin:0 15px}.react-datepicker__current-month,.react-datepicker-time__header,.react-datepicker-year-header{margin-top:0;color:#000;font-weight:bold;font-size:.944rem}.react-datepicker-time__header{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.react-datepicker__navigation{align-items:center;background:none;display:flex;justify-content:center;text-align:center;cursor:pointer;position:absolute;top:2px;padding:0;border:none;z-index:1;height:32px;width:32px;text-indent:-999em;overflow:hidden}.react-datepicker__navigation--previous{left:2px}.react-datepicker__navigation--next{right:2px}.react-datepicker__navigation--next--with-time:not(.react-datepicker__navigation--next--with-today-button){right:85px}.react-datepicker__navigation--years{position:relative;top:0;display:block;margin-left:auto;margin-right:auto}.react-datepicker__navigation--years-previous{top:4px}.react-datepicker__navigation--years-upcoming{top:-4px}.react-datepicker__navigation:hover *::before{border-color:#a6a6a6}.react-datepicker__navigation-icon{position:relative;top:-1px;font-size:20px;width:0}.react-datepicker__navigation-icon--next{left:-2px}.react-datepicker__navigation-icon--next::before{transform:rotate(45deg);left:-7px}.react-datepicker__navigation-icon--previous{right:-2px}.react-datepicker__navigation-icon--previous::before{transform:rotate(225deg);right:-7px}.react-datepicker__month-container{float:left}.react-datepicker__year{margin:.4rem;text-align:center}.react-datepicker__year-wrapper{display:flex;flex-wrap:wrap;max-width:180px}.react-datepicker__year .react-datepicker__year-text{display:inline-block;width:4rem;margin:2px}.react-datepicker__month{margin:.4rem;text-align:center}.react-datepicker__month .react-datepicker__month-text,.react-datepicker__month .react-datepicker__quarter-text{display:inline-block;width:4rem;margin:2px}.react-datepicker__input-time-container{clear:both;width:100%;float:left;margin:5px 0 10px 15px;text-align:left}.react-datepicker__input-time-container .react-datepicker-time__caption{display:inline-block}.react-datepicker__input-time-container .react-datepicker-time__input-container{display:inline-block}.react-datepicker__input-time-container .react-datepicker-time__input-container .react-datepicker-time__input{display:inline-block;margin-left:10px}.react-datepicker__input-time-container .react-datepicker-time__input-container .react-datepicker-time__input input{width:auto}.react-datepicker__input-time-container .react-datepicker-time__input-container .react-datepicker-time__input input[type=time]::-webkit-inner-spin-button,.react-datepicker__input-time-container .react-datepicker-time__input-container .react-datepicker-time__input input[type=time]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.react-datepicker__input-time-container .react-datepicker-time__input-container .react-datepicker-time__input input[type=time]{-moz-appearance:textfield}.react-datepicker__input-time-container .react-datepicker-time__input-container .react-datepicker-time__delimiter{margin-left:5px;display:inline-block}.react-datepicker__time-container{float:right;border-left:1px solid #aeaeae;width:85px}.react-datepicker__time-container--with-today-button{display:inline;border:1px solid #aeaeae;border-radius:.3rem;position:absolute;right:-87px;top:0}.react-datepicker__time-container .react-datepicker__time{position:relative;background:#fff;border-bottom-right-radius:.3rem}.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box{width:85px;overflow-x:hidden;margin:0 auto;text-align:center;border-bottom-right-radius:.3rem}.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list{list-style:none;margin:0;height:calc(195px + 1.7rem/2);overflow-y:scroll;padding-right:0;padding-left:0;width:100%;box-sizing:content-box}.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item{height:30px;padding:5px 10px;white-space:nowrap}.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item:hover{cursor:pointer;background-color:#f0f0f0}.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item--selected{background-color:#216ba5;color:#fff;font-weight:bold}.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item--selected:hover{background-color:#216ba5}.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item--disabled{color:#ccc}.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item--disabled:hover{cursor:default;background-color:rgba(0,0,0,0)}.react-datepicker__week-number{color:#ccc;display:inline-block;width:1.7rem;line-height:1.7rem;text-align:center;margin:.166rem}.react-datepicker__week-number.react-datepicker__week-number--clickable{cursor:pointer}.react-datepicker__week-number.react-datepicker__week-number--clickable:hover{border-radius:.3rem;background-color:#f0f0f0}.react-datepicker__day-names,.react-datepicker__week{white-space:nowrap}.react-datepicker__day-names{margin-bottom:-8px}.react-datepicker__day-name,.react-datepicker__day,.react-datepicker__time-name{color:#000;display:inline-block;width:1.7rem;line-height:1.7rem;text-align:center;margin:.166rem}.react-datepicker__day,.react-datepicker__month-text,.react-datepicker__quarter-text,.react-datepicker__year-text{cursor:pointer}.react-datepicker__day:hover,.react-datepicker__month-text:hover,.react-datepicker__quarter-text:hover,.react-datepicker__year-text:hover{border-radius:.3rem;background-color:#f0f0f0}.react-datepicker__day--today,.react-datepicker__month-text--today,.react-datepicker__quarter-text--today,.react-datepicker__year-text--today{font-weight:bold}.react-datepicker__day--highlighted,.react-datepicker__month-text--highlighted,.react-datepicker__quarter-text--highlighted,.react-datepicker__year-text--highlighted{border-radius:.3rem;background-color:#3dcc4a;color:#fff}.react-datepicker__day--highlighted:hover,.react-datepicker__month-text--highlighted:hover,.react-datepicker__quarter-text--highlighted:hover,.react-datepicker__year-text--highlighted:hover{background-color:#32be3f}.react-datepicker__day--highlighted-custom-1,.react-datepicker__month-text--highlighted-custom-1,.react-datepicker__quarter-text--highlighted-custom-1,.react-datepicker__year-text--highlighted-custom-1{color:#f0f}.react-datepicker__day--highlighted-custom-2,.react-datepicker__month-text--highlighted-custom-2,.react-datepicker__quarter-text--highlighted-custom-2,.react-datepicker__year-text--highlighted-custom-2{color:green}.react-datepicker__day--holidays,.react-datepicker__month-text--holidays,.react-datepicker__quarter-text--holidays,.react-datepicker__year-text--holidays{position:relative;border-radius:.3rem;background-color:#ff6803;color:#fff}.react-datepicker__day--holidays .holiday-overlay,.react-datepicker__month-text--holidays .holiday-overlay,.react-datepicker__quarter-text--holidays .holiday-overlay,.react-datepicker__year-text--holidays .holiday-overlay{position:absolute;bottom:100%;left:50%;transform:translateX(-50%);background-color:#333;color:#fff;padding:4px;border-radius:4px;white-space:nowrap;visibility:hidden;opacity:0;transition:visibility 0s,opacity .3s ease-in-out}.react-datepicker__day--holidays:hover,.react-datepicker__month-text--holidays:hover,.react-datepicker__quarter-text--holidays:hover,.react-datepicker__year-text--holidays:hover{background-color:#cf5300}.react-datepicker__day--holidays:hover .holiday-overlay,.react-datepicker__month-text--holidays:hover .holiday-overlay,.react-datepicker__quarter-text--holidays:hover .holiday-overlay,.react-datepicker__year-text--holidays:hover .holiday-overlay{visibility:visible;opacity:1}.react-datepicker__day--selected,.react-datepicker__day--in-selecting-range,.react-datepicker__day--in-range,.react-datepicker__month-text--selected,.react-datepicker__month-text--in-selecting-range,.react-datepicker__month-text--in-range,.react-datepicker__quarter-text--selected,.react-datepicker__quarter-text--in-selecting-range,.react-datepicker__quarter-text--in-range,.react-datepicker__year-text--selected,.react-datepicker__year-text--in-selecting-range,.react-datepicker__year-text--in-range{border-radius:.3rem;background-color:#216ba5;color:#fff}.react-datepicker__day--selected:hover,.react-datepicker__day--in-selecting-range:hover,.react-datepicker__day--in-range:hover,.react-datepicker__month-text--selected:hover,.react-datepicker__month-text--in-selecting-range:hover,.react-datepicker__month-text--in-range:hover,.react-datepicker__quarter-text--selected:hover,.react-datepicker__quarter-text--in-selecting-range:hover,.react-datepicker__quarter-text--in-range:hover,.react-datepicker__year-text--selected:hover,.react-datepicker__year-text--in-selecting-range:hover,.react-datepicker__year-text--in-range:hover{background-color:#1d5d90}.react-datepicker__day--keyboard-selected,.react-datepicker__month-text--keyboard-selected,.react-datepicker__quarter-text--keyboard-selected,.react-datepicker__year-text--keyboard-selected{border-radius:.3rem;background-color:#bad9f1;color:#000}.react-datepicker__day--keyboard-selected:hover,.react-datepicker__month-text--keyboard-selected:hover,.react-datepicker__quarter-text--keyboard-selected:hover,.react-datepicker__year-text--keyboard-selected:hover{background-color:#1d5d90}.react-datepicker__day--in-selecting-range:not(.react-datepicker__day--in-range,.react-datepicker__month-text--in-range,.react-datepicker__quarter-text--in-range,.react-datepicker__year-text--in-range),.react-datepicker__month-text--in-selecting-range:not(.react-datepicker__day--in-range,.react-datepicker__month-text--in-range,.react-datepicker__quarter-text--in-range,.react-datepicker__year-text--in-range),.react-datepicker__quarter-text--in-selecting-range:not(.react-datepicker__day--in-range,.react-datepicker__month-text--in-range,.react-datepicker__quarter-text--in-range,.react-datepicker__year-text--in-range),.react-datepicker__year-text--in-selecting-range:not(.react-datepicker__day--in-range,.react-datepicker__month-text--in-range,.react-datepicker__quarter-text--in-range,.react-datepicker__year-text--in-range){background-color:rgba(33,107,165,.5)}.react-datepicker__month--selecting-range .react-datepicker__day--in-range:not(.react-datepicker__day--in-selecting-range,.react-datepicker__month-text--in-selecting-range,.react-datepicker__quarter-text--in-selecting-range,.react-datepicker__year-text--in-selecting-range),.react-datepicker__year--selecting-range .react-datepicker__day--in-range:not(.react-datepicker__day--in-selecting-range,.react-datepicker__month-text--in-selecting-range,.react-datepicker__quarter-text--in-selecting-range,.react-datepicker__year-text--in-selecting-range),.react-datepicker__month--selecting-range .react-datepicker__month-text--in-range:not(.react-datepicker__day--in-selecting-range,.react-datepicker__month-text--in-selecting-range,.react-datepicker__quarter-text--in-selecting-range,.react-datepicker__year-text--in-selecting-range),.react-datepicker__year--selecting-range .react-datepicker__month-text--in-range:not(.react-datepicker__day--in-selecting-range,.react-datepicker__month-text--in-selecting-range,.react-datepicker__quarter-text--in-selecting-range,.react-datepicker__year-text--in-selecting-range),.react-datepicker__month--selecting-range .react-datepicker__quarter-text--in-range:not(.react-datepicker__day--in-selecting-range,.react-datepicker__month-text--in-selecting-range,.react-datepicker__quarter-text--in-selecting-range,.react-datepicker__year-text--in-selecting-range),.react-datepicker__year--selecting-range .react-datepicker__quarter-text--in-range:not(.react-datepicker__day--in-selecting-range,.react-datepicker__month-text--in-selecting-range,.react-datepicker__quarter-text--in-selecting-range,.react-datepicker__year-text--in-selecting-range),.react-datepicker__month--selecting-range .react-datepicker__year-text--in-range:not(.react-datepicker__day--in-selecting-range,.react-datepicker__month-text--in-selecting-range,.react-datepicker__quarter-text--in-selecting-range,.react-datepicker__year-text--in-selecting-range),.react-datepicker__year--selecting-range .react-datepicker__year-text--in-range:not(.react-datepicker__day--in-selecting-range,.react-datepicker__month-text--in-selecting-range,.react-datepicker__quarter-text--in-selecting-range,.react-datepicker__year-text--in-selecting-range){background-color:#f0f0f0;color:#000}.react-datepicker__day--disabled,.react-datepicker__month-text--disabled,.react-datepicker__quarter-text--disabled,.react-datepicker__year-text--disabled{cursor:default;color:#ccc}.react-datepicker__day--disabled:hover,.react-datepicker__month-text--disabled:hover,.react-datepicker__quarter-text--disabled:hover,.react-datepicker__year-text--disabled:hover{background-color:rgba(0,0,0,0)}.react-datepicker__input-container{position:relative;display:inline-block;width:100%}.react-datepicker__input-container .react-datepicker__calendar-icon{position:absolute;padding:.5rem;box-sizing:content-box}.react-datepicker__view-calendar-icon input{padding:6px 10px 5px 25px}.react-datepicker__year-read-view,.react-datepicker__month-read-view,.react-datepicker__month-year-read-view{border:1px solid rgba(0,0,0,0);border-radius:.3rem;position:relative}.react-datepicker__year-read-view:hover,.react-datepicker__month-read-view:hover,.react-datepicker__month-year-read-view:hover{cursor:pointer}.react-datepicker__year-read-view:hover .react-datepicker__year-read-view--down-arrow,.react-datepicker__year-read-view:hover .react-datepicker__month-read-view--down-arrow,.react-datepicker__month-read-view:hover .react-datepicker__year-read-view--down-arrow,.react-datepicker__month-read-view:hover .react-datepicker__month-read-view--down-arrow,.react-datepicker__month-year-read-view:hover .react-datepicker__year-read-view--down-arrow,.react-datepicker__month-year-read-view:hover .react-datepicker__month-read-view--down-arrow{border-top-color:#b3b3b3}.react-datepicker__year-read-view--down-arrow,.react-datepicker__month-read-view--down-arrow,.react-datepicker__month-year-read-view--down-arrow{transform:rotate(135deg);right:-16px;top:0}.react-datepicker__year-dropdown,.react-datepicker__month-dropdown,.react-datepicker__month-year-dropdown{background-color:#f0f0f0;position:absolute;width:50%;left:25%;top:30px;z-index:1;text-align:center;border-radius:.3rem;border:1px solid #aeaeae}.react-datepicker__year-dropdown:hover,.react-datepicker__month-dropdown:hover,.react-datepicker__month-year-dropdown:hover{cursor:pointer}.react-datepicker__year-dropdown--scrollable,.react-datepicker__month-dropdown--scrollable,.react-datepicker__month-year-dropdown--scrollable{height:150px;overflow-y:scroll}.react-datepicker__year-option,.react-datepicker__month-option,.react-datepicker__month-year-option{line-height:20px;width:100%;display:block;margin-left:auto;margin-right:auto}.react-datepicker__year-option:first-of-type,.react-datepicker__month-option:first-of-type,.react-datepicker__month-year-option:first-of-type{border-top-left-radius:.3rem;border-top-right-radius:.3rem}.react-datepicker__year-option:last-of-type,.react-datepicker__month-option:last-of-type,.react-datepicker__month-year-option:last-of-type{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;border-bottom-left-radius:.3rem;border-bottom-right-radius:.3rem}.react-datepicker__year-option:hover,.react-datepicker__month-option:hover,.react-datepicker__month-year-option:hover{background-color:#ccc}.react-datepicker__year-option:hover .react-datepicker__navigation--years-upcoming,.react-datepicker__month-option:hover .react-datepicker__navigation--years-upcoming,.react-datepicker__month-year-option:hover .react-datepicker__navigation--years-upcoming{border-bottom-color:#b3b3b3}.react-datepicker__year-option:hover .react-datepicker__navigation--years-previous,.react-datepicker__month-option:hover .react-datepicker__navigation--years-previous,.react-datepicker__month-year-option:hover .react-datepicker__navigation--years-previous{border-top-color:#b3b3b3}.react-datepicker__year-option--selected,.react-datepicker__month-option--selected,.react-datepicker__month-year-option--selected{position:absolute;left:15px}.react-datepicker__close-icon{cursor:pointer;background-color:rgba(0,0,0,0);border:0;outline:0;padding:0 6px 0 0;position:absolute;top:0;right:0;height:100%;display:table-cell;vertical-align:middle}.react-datepicker__close-icon::after{cursor:pointer;background-color:#216ba5;color:#fff;border-radius:50%;height:16px;width:16px;padding:2px;font-size:12px;line-height:1;text-align:center;display:table-cell;vertical-align:middle;content:\"×\"}.react-datepicker__today-button{background:#f0f0f0;border-top:1px solid #aeaeae;cursor:pointer;text-align:center;font-weight:bold;padding:5px 0;clear:left}.react-datepicker__portal{position:fixed;width:100vw;height:100vh;background-color:rgba(0,0,0,.8);left:0;top:0;justify-content:center;align-items:center;display:flex;z-index:2147483647}.react-datepicker__portal .react-datepicker__day-name,.react-datepicker__portal .react-datepicker__day,.react-datepicker__portal .react-datepicker__time-name{width:3rem;line-height:3rem}@media(max-width: 400px),(max-height: 550px){.react-datepicker__portal .react-datepicker__day-name,.react-datepicker__portal .react-datepicker__day,.react-datepicker__portal .react-datepicker__time-name{width:2rem;line-height:2rem}}.react-datepicker__portal .react-datepicker__current-month,.react-datepicker__portal .react-datepicker-time__header{font-size:1.44rem}.react-datepicker__children-container{width:13.8rem;margin:.4rem;padding-right:.2rem;padding-left:.2rem;height:auto}.react-datepicker__aria-live{position:absolute;clip-path:circle(0);border:0;height:1px;margin:-1px;overflow:hidden;padding:0;width:1px;white-space:nowrap}.react-datepicker__calendar-icon{width:1em;height:1em;vertical-align:-0.125em}\n";
1
+ var css_248z = ".react-datepicker__year-read-view--down-arrow,.react-datepicker__month-read-view--down-arrow,.react-datepicker__month-year-read-view--down-arrow,.react-datepicker__navigation-icon::before{border-color:#ccc;border-style:solid;border-width:3px 3px 0 0;content:\"\";display:block;height:9px;position:absolute;top:6px;width:9px}.react-datepicker-popper[data-placement^=top] .react-datepicker__triangle,.react-datepicker-popper[data-placement^=bottom] .react-datepicker__triangle{margin-left:-4px;position:absolute;width:0}.react-datepicker-popper[data-placement^=top] .react-datepicker__triangle::before,.react-datepicker-popper[data-placement^=bottom] .react-datepicker__triangle::before,.react-datepicker-popper[data-placement^=top] .react-datepicker__triangle::after,.react-datepicker-popper[data-placement^=bottom] .react-datepicker__triangle::after{box-sizing:content-box;position:absolute;border:8px solid rgba(0,0,0,0);height:0;width:1px;content:\"\";z-index:-1;border-width:8px;left:-8px}.react-datepicker-popper[data-placement^=top] .react-datepicker__triangle::before,.react-datepicker-popper[data-placement^=bottom] .react-datepicker__triangle::before{border-bottom-color:#aeaeae}.react-datepicker-popper[data-placement^=bottom] .react-datepicker__triangle{top:0;margin-top:-8px}.react-datepicker-popper[data-placement^=bottom] .react-datepicker__triangle::before,.react-datepicker-popper[data-placement^=bottom] .react-datepicker__triangle::after{border-top:none;border-bottom-color:#f0f0f0}.react-datepicker-popper[data-placement^=bottom] .react-datepicker__triangle::after{top:0}.react-datepicker-popper[data-placement^=bottom] .react-datepicker__triangle::before{top:-1px;border-bottom-color:#aeaeae}.react-datepicker-popper[data-placement^=top] .react-datepicker__triangle{bottom:0;margin-bottom:-8px}.react-datepicker-popper[data-placement^=top] .react-datepicker__triangle::before,.react-datepicker-popper[data-placement^=top] .react-datepicker__triangle::after{border-bottom:none;border-top-color:#fff}.react-datepicker-popper[data-placement^=top] .react-datepicker__triangle::after{bottom:0}.react-datepicker-popper[data-placement^=top] .react-datepicker__triangle::before{bottom:-1px;border-top-color:#aeaeae}.react-datepicker-wrapper{display:inline-block;padding:0;border:0}.react-datepicker{font-family:\"Helvetica Neue\",helvetica,arial,sans-serif;font-size:.8rem;background-color:#fff;color:#000;border:1px solid #aeaeae;border-radius:.3rem;display:inline-block;position:relative}.react-datepicker--time-only .react-datepicker__triangle{left:35px}.react-datepicker--time-only .react-datepicker__time-container{border-left:0}.react-datepicker--time-only .react-datepicker__time,.react-datepicker--time-only .react-datepicker__time-box{border-bottom-left-radius:.3rem;border-bottom-right-radius:.3rem}.react-datepicker__triangle{position:absolute;left:50px}.react-datepicker-popper{z-index:1}.react-datepicker-popper[data-placement^=bottom]{padding-top:10px}.react-datepicker-popper[data-placement=bottom-end] .react-datepicker__triangle,.react-datepicker-popper[data-placement=top-end] .react-datepicker__triangle{left:auto;right:50px}.react-datepicker-popper[data-placement^=top]{padding-bottom:10px}.react-datepicker-popper[data-placement^=right]{padding-left:8px}.react-datepicker-popper[data-placement^=right] .react-datepicker__triangle{left:auto;right:42px}.react-datepicker-popper[data-placement^=left]{padding-right:8px}.react-datepicker-popper[data-placement^=left] .react-datepicker__triangle{left:42px;right:auto}.react-datepicker__header{text-align:center;background-color:#f0f0f0;border-bottom:1px solid #aeaeae;border-top-left-radius:.3rem;padding:8px 0;position:relative}.react-datepicker__header--time{padding-bottom:8px;padding-left:5px;padding-right:5px}.react-datepicker__header--time:not(.react-datepicker__header--time--only){border-top-left-radius:0}.react-datepicker__header:not(.react-datepicker__header--has-time-select){border-top-right-radius:.3rem}.react-datepicker__year-dropdown-container--select,.react-datepicker__month-dropdown-container--select,.react-datepicker__month-year-dropdown-container--select,.react-datepicker__year-dropdown-container--scroll,.react-datepicker__month-dropdown-container--scroll,.react-datepicker__month-year-dropdown-container--scroll{display:inline-block;margin:0 15px}.react-datepicker__current-month,.react-datepicker-time__header,.react-datepicker-year-header{margin-top:0;color:#000;font-weight:bold;font-size:.944rem}.react-datepicker-time__header{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.react-datepicker__navigation{align-items:center;background:none;display:flex;justify-content:center;text-align:center;cursor:pointer;position:absolute;top:2px;padding:0;border:none;z-index:1;height:32px;width:32px;text-indent:-999em;overflow:hidden}.react-datepicker__navigation--previous{left:2px}.react-datepicker__navigation--next{right:2px}.react-datepicker__navigation--next--with-time:not(.react-datepicker__navigation--next--with-today-button){right:85px}.react-datepicker__navigation--years{position:relative;top:0;display:block;margin-left:auto;margin-right:auto}.react-datepicker__navigation--years-previous{top:4px}.react-datepicker__navigation--years-upcoming{top:-4px}.react-datepicker__navigation:hover *::before{border-color:#a6a6a6}.react-datepicker__navigation-icon{position:relative;top:-1px;font-size:20px;width:0}.react-datepicker__navigation-icon--next{left:-2px}.react-datepicker__navigation-icon--next::before{transform:rotate(45deg);left:-7px}.react-datepicker__navigation-icon--previous{right:-2px}.react-datepicker__navigation-icon--previous::before{transform:rotate(225deg);right:-7px}.react-datepicker__month-container{float:left}.react-datepicker__year{margin:.4rem;text-align:center}.react-datepicker__year-wrapper{display:flex;flex-wrap:wrap;max-width:180px}.react-datepicker__year .react-datepicker__year-text{display:inline-block;width:4rem;margin:2px}.react-datepicker__month{margin:.4rem;text-align:center}.react-datepicker__month .react-datepicker__month-text,.react-datepicker__month .react-datepicker__quarter-text{display:inline-block;width:4rem;margin:2px}.react-datepicker__input-time-container{clear:both;width:100%;float:left;margin:5px 0 10px 15px;text-align:left}.react-datepicker__input-time-container .react-datepicker-time__caption{display:inline-block}.react-datepicker__input-time-container .react-datepicker-time__input-container{display:inline-block}.react-datepicker__input-time-container .react-datepicker-time__input-container .react-datepicker-time__input{display:inline-block;margin-left:10px}.react-datepicker__input-time-container .react-datepicker-time__input-container .react-datepicker-time__input input{width:auto}.react-datepicker__input-time-container .react-datepicker-time__input-container .react-datepicker-time__input input[type=time]::-webkit-inner-spin-button,.react-datepicker__input-time-container .react-datepicker-time__input-container .react-datepicker-time__input input[type=time]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.react-datepicker__input-time-container .react-datepicker-time__input-container .react-datepicker-time__input input[type=time]{-moz-appearance:textfield}.react-datepicker__input-time-container .react-datepicker-time__input-container .react-datepicker-time__delimiter{margin-left:5px;display:inline-block}.react-datepicker__time-container{float:right;border-left:1px solid #aeaeae;width:85px}.react-datepicker__time-container--with-today-button{display:inline;border:1px solid #aeaeae;border-radius:.3rem;position:absolute;right:-87px;top:0}.react-datepicker__time-container .react-datepicker__time{position:relative;background:#fff;border-bottom-right-radius:.3rem}.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box{width:85px;overflow-x:hidden;margin:0 auto;text-align:center;border-bottom-right-radius:.3rem}.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list{list-style:none;margin:0;height:calc(195px + 1.7rem/2);overflow-y:scroll;padding-right:0;padding-left:0;width:100%;box-sizing:content-box}.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item{height:30px;padding:5px 10px;white-space:nowrap}.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item:hover{cursor:pointer;background-color:#f0f0f0}.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item--selected{background-color:#216ba5;color:#fff;font-weight:bold}.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item--selected:hover{background-color:#216ba5}.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item--disabled{color:#ccc}.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item--disabled:hover{cursor:default;background-color:rgba(0,0,0,0)}.react-datepicker__week-number{color:#ccc;display:inline-block;width:1.7rem;line-height:1.7rem;text-align:center;margin:.166rem}.react-datepicker__week-number.react-datepicker__week-number--clickable{cursor:pointer}.react-datepicker__week-number.react-datepicker__week-number--clickable:not(.react-datepicker__week-number--selected,.react-datepicker__week-number--keyboard-selected):hover{border-radius:.3rem;background-color:#f0f0f0}.react-datepicker__week-number--selected{border-radius:.3rem;background-color:#216ba5;color:#fff}.react-datepicker__week-number--selected:hover{background-color:#1d5d90}.react-datepicker__week-number--keyboard-selected{border-radius:.3rem;background-color:#2a87d0;color:#fff}.react-datepicker__week-number--keyboard-selected:hover{background-color:#1d5d90}.react-datepicker__day-names{white-space:nowrap;margin-bottom:-8px}.react-datepicker__week{white-space:nowrap}.react-datepicker__day-name,.react-datepicker__day,.react-datepicker__time-name{color:#000;display:inline-block;width:1.7rem;line-height:1.7rem;text-align:center;margin:.166rem}.react-datepicker__day,.react-datepicker__month-text,.react-datepicker__quarter-text,.react-datepicker__year-text{cursor:pointer}.react-datepicker__day:hover,.react-datepicker__month-text:hover,.react-datepicker__quarter-text:hover,.react-datepicker__year-text:hover{border-radius:.3rem;background-color:#f0f0f0}.react-datepicker__day--today,.react-datepicker__month-text--today,.react-datepicker__quarter-text--today,.react-datepicker__year-text--today{font-weight:bold}.react-datepicker__day--highlighted,.react-datepicker__month-text--highlighted,.react-datepicker__quarter-text--highlighted,.react-datepicker__year-text--highlighted{border-radius:.3rem;background-color:#3dcc4a;color:#fff}.react-datepicker__day--highlighted:hover,.react-datepicker__month-text--highlighted:hover,.react-datepicker__quarter-text--highlighted:hover,.react-datepicker__year-text--highlighted:hover{background-color:#32be3f}.react-datepicker__day--highlighted-custom-1,.react-datepicker__month-text--highlighted-custom-1,.react-datepicker__quarter-text--highlighted-custom-1,.react-datepicker__year-text--highlighted-custom-1{color:#f0f}.react-datepicker__day--highlighted-custom-2,.react-datepicker__month-text--highlighted-custom-2,.react-datepicker__quarter-text--highlighted-custom-2,.react-datepicker__year-text--highlighted-custom-2{color:green}.react-datepicker__day--holidays,.react-datepicker__month-text--holidays,.react-datepicker__quarter-text--holidays,.react-datepicker__year-text--holidays{position:relative;border-radius:.3rem;background-color:#ff6803;color:#fff}.react-datepicker__day--holidays .holiday-overlay,.react-datepicker__month-text--holidays .holiday-overlay,.react-datepicker__quarter-text--holidays .holiday-overlay,.react-datepicker__year-text--holidays .holiday-overlay{position:absolute;bottom:100%;left:50%;transform:translateX(-50%);background-color:#333;color:#fff;padding:4px;border-radius:4px;white-space:nowrap;visibility:hidden;opacity:0;transition:visibility 0s,opacity .3s ease-in-out}.react-datepicker__day--holidays:hover,.react-datepicker__month-text--holidays:hover,.react-datepicker__quarter-text--holidays:hover,.react-datepicker__year-text--holidays:hover{background-color:#cf5300}.react-datepicker__day--holidays:hover .holiday-overlay,.react-datepicker__month-text--holidays:hover .holiday-overlay,.react-datepicker__quarter-text--holidays:hover .holiday-overlay,.react-datepicker__year-text--holidays:hover .holiday-overlay{visibility:visible;opacity:1}.react-datepicker__day--selected,.react-datepicker__day--in-selecting-range,.react-datepicker__day--in-range,.react-datepicker__month-text--selected,.react-datepicker__month-text--in-selecting-range,.react-datepicker__month-text--in-range,.react-datepicker__quarter-text--selected,.react-datepicker__quarter-text--in-selecting-range,.react-datepicker__quarter-text--in-range,.react-datepicker__year-text--selected,.react-datepicker__year-text--in-selecting-range,.react-datepicker__year-text--in-range{border-radius:.3rem;background-color:#216ba5;color:#fff}.react-datepicker__day--selected:hover,.react-datepicker__day--in-selecting-range:hover,.react-datepicker__day--in-range:hover,.react-datepicker__month-text--selected:hover,.react-datepicker__month-text--in-selecting-range:hover,.react-datepicker__month-text--in-range:hover,.react-datepicker__quarter-text--selected:hover,.react-datepicker__quarter-text--in-selecting-range:hover,.react-datepicker__quarter-text--in-range:hover,.react-datepicker__year-text--selected:hover,.react-datepicker__year-text--in-selecting-range:hover,.react-datepicker__year-text--in-range:hover{background-color:#1d5d90}.react-datepicker__day--keyboard-selected,.react-datepicker__month-text--keyboard-selected,.react-datepicker__quarter-text--keyboard-selected,.react-datepicker__year-text--keyboard-selected{border-radius:.3rem;background-color:#bad9f1;color:#000}.react-datepicker__day--keyboard-selected:hover,.react-datepicker__month-text--keyboard-selected:hover,.react-datepicker__quarter-text--keyboard-selected:hover,.react-datepicker__year-text--keyboard-selected:hover{background-color:#1d5d90}.react-datepicker__day--in-selecting-range:not(.react-datepicker__day--in-range,.react-datepicker__month-text--in-range,.react-datepicker__quarter-text--in-range,.react-datepicker__year-text--in-range),.react-datepicker__month-text--in-selecting-range:not(.react-datepicker__day--in-range,.react-datepicker__month-text--in-range,.react-datepicker__quarter-text--in-range,.react-datepicker__year-text--in-range),.react-datepicker__quarter-text--in-selecting-range:not(.react-datepicker__day--in-range,.react-datepicker__month-text--in-range,.react-datepicker__quarter-text--in-range,.react-datepicker__year-text--in-range),.react-datepicker__year-text--in-selecting-range:not(.react-datepicker__day--in-range,.react-datepicker__month-text--in-range,.react-datepicker__quarter-text--in-range,.react-datepicker__year-text--in-range){background-color:rgba(33,107,165,.5)}.react-datepicker__month--selecting-range .react-datepicker__day--in-range:not(.react-datepicker__day--in-selecting-range,.react-datepicker__month-text--in-selecting-range,.react-datepicker__quarter-text--in-selecting-range,.react-datepicker__year-text--in-selecting-range),.react-datepicker__year--selecting-range .react-datepicker__day--in-range:not(.react-datepicker__day--in-selecting-range,.react-datepicker__month-text--in-selecting-range,.react-datepicker__quarter-text--in-selecting-range,.react-datepicker__year-text--in-selecting-range),.react-datepicker__month--selecting-range .react-datepicker__month-text--in-range:not(.react-datepicker__day--in-selecting-range,.react-datepicker__month-text--in-selecting-range,.react-datepicker__quarter-text--in-selecting-range,.react-datepicker__year-text--in-selecting-range),.react-datepicker__year--selecting-range .react-datepicker__month-text--in-range:not(.react-datepicker__day--in-selecting-range,.react-datepicker__month-text--in-selecting-range,.react-datepicker__quarter-text--in-selecting-range,.react-datepicker__year-text--in-selecting-range),.react-datepicker__month--selecting-range .react-datepicker__quarter-text--in-range:not(.react-datepicker__day--in-selecting-range,.react-datepicker__month-text--in-selecting-range,.react-datepicker__quarter-text--in-selecting-range,.react-datepicker__year-text--in-selecting-range),.react-datepicker__year--selecting-range .react-datepicker__quarter-text--in-range:not(.react-datepicker__day--in-selecting-range,.react-datepicker__month-text--in-selecting-range,.react-datepicker__quarter-text--in-selecting-range,.react-datepicker__year-text--in-selecting-range),.react-datepicker__month--selecting-range .react-datepicker__year-text--in-range:not(.react-datepicker__day--in-selecting-range,.react-datepicker__month-text--in-selecting-range,.react-datepicker__quarter-text--in-selecting-range,.react-datepicker__year-text--in-selecting-range),.react-datepicker__year--selecting-range .react-datepicker__year-text--in-range:not(.react-datepicker__day--in-selecting-range,.react-datepicker__month-text--in-selecting-range,.react-datepicker__quarter-text--in-selecting-range,.react-datepicker__year-text--in-selecting-range){background-color:#f0f0f0;color:#000}.react-datepicker__day--disabled,.react-datepicker__month-text--disabled,.react-datepicker__quarter-text--disabled,.react-datepicker__year-text--disabled{cursor:default;color:#ccc}.react-datepicker__day--disabled:hover,.react-datepicker__month-text--disabled:hover,.react-datepicker__quarter-text--disabled:hover,.react-datepicker__year-text--disabled:hover{background-color:rgba(0,0,0,0)}.react-datepicker__input-container{position:relative;display:inline-block;width:100%}.react-datepicker__input-container .react-datepicker__calendar-icon{position:absolute;padding:.5rem;box-sizing:content-box}.react-datepicker__view-calendar-icon input{padding:6px 10px 5px 25px}.react-datepicker__year-read-view,.react-datepicker__month-read-view,.react-datepicker__month-year-read-view{border:1px solid rgba(0,0,0,0);border-radius:.3rem;position:relative}.react-datepicker__year-read-view:hover,.react-datepicker__month-read-view:hover,.react-datepicker__month-year-read-view:hover{cursor:pointer}.react-datepicker__year-read-view:hover .react-datepicker__year-read-view--down-arrow,.react-datepicker__year-read-view:hover .react-datepicker__month-read-view--down-arrow,.react-datepicker__month-read-view:hover .react-datepicker__year-read-view--down-arrow,.react-datepicker__month-read-view:hover .react-datepicker__month-read-view--down-arrow,.react-datepicker__month-year-read-view:hover .react-datepicker__year-read-view--down-arrow,.react-datepicker__month-year-read-view:hover .react-datepicker__month-read-view--down-arrow{border-top-color:#b3b3b3}.react-datepicker__year-read-view--down-arrow,.react-datepicker__month-read-view--down-arrow,.react-datepicker__month-year-read-view--down-arrow{transform:rotate(135deg);right:-16px;top:0}.react-datepicker__year-dropdown,.react-datepicker__month-dropdown,.react-datepicker__month-year-dropdown{background-color:#f0f0f0;position:absolute;width:50%;left:25%;top:30px;z-index:1;text-align:center;border-radius:.3rem;border:1px solid #aeaeae}.react-datepicker__year-dropdown:hover,.react-datepicker__month-dropdown:hover,.react-datepicker__month-year-dropdown:hover{cursor:pointer}.react-datepicker__year-dropdown--scrollable,.react-datepicker__month-dropdown--scrollable,.react-datepicker__month-year-dropdown--scrollable{height:150px;overflow-y:scroll}.react-datepicker__year-option,.react-datepicker__month-option,.react-datepicker__month-year-option{line-height:20px;width:100%;display:block;margin-left:auto;margin-right:auto}.react-datepicker__year-option:first-of-type,.react-datepicker__month-option:first-of-type,.react-datepicker__month-year-option:first-of-type{border-top-left-radius:.3rem;border-top-right-radius:.3rem}.react-datepicker__year-option:last-of-type,.react-datepicker__month-option:last-of-type,.react-datepicker__month-year-option:last-of-type{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;border-bottom-left-radius:.3rem;border-bottom-right-radius:.3rem}.react-datepicker__year-option:hover,.react-datepicker__month-option:hover,.react-datepicker__month-year-option:hover{background-color:#ccc}.react-datepicker__year-option:hover .react-datepicker__navigation--years-upcoming,.react-datepicker__month-option:hover .react-datepicker__navigation--years-upcoming,.react-datepicker__month-year-option:hover .react-datepicker__navigation--years-upcoming{border-bottom-color:#b3b3b3}.react-datepicker__year-option:hover .react-datepicker__navigation--years-previous,.react-datepicker__month-option:hover .react-datepicker__navigation--years-previous,.react-datepicker__month-year-option:hover .react-datepicker__navigation--years-previous{border-top-color:#b3b3b3}.react-datepicker__year-option--selected,.react-datepicker__month-option--selected,.react-datepicker__month-year-option--selected{position:absolute;left:15px}.react-datepicker__close-icon{cursor:pointer;background-color:rgba(0,0,0,0);border:0;outline:0;padding:0 6px 0 0;position:absolute;top:0;right:0;height:100%;display:table-cell;vertical-align:middle}.react-datepicker__close-icon::after{cursor:pointer;background-color:#216ba5;color:#fff;border-radius:50%;height:16px;width:16px;padding:2px;font-size:12px;line-height:1;text-align:center;display:table-cell;vertical-align:middle;content:\"×\"}.react-datepicker__today-button{background:#f0f0f0;border-top:1px solid #aeaeae;cursor:pointer;text-align:center;font-weight:bold;padding:5px 0;clear:left}.react-datepicker__portal{position:fixed;width:100vw;height:100vh;background-color:rgba(0,0,0,.8);left:0;top:0;justify-content:center;align-items:center;display:flex;z-index:2147483647}.react-datepicker__portal .react-datepicker__day-name,.react-datepicker__portal .react-datepicker__day,.react-datepicker__portal .react-datepicker__time-name{width:3rem;line-height:3rem}@media(max-width: 400px),(max-height: 550px){.react-datepicker__portal .react-datepicker__day-name,.react-datepicker__portal .react-datepicker__day,.react-datepicker__portal .react-datepicker__time-name{width:2rem;line-height:2rem}}.react-datepicker__portal .react-datepicker__current-month,.react-datepicker__portal .react-datepicker-time__header{font-size:1.44rem}.react-datepicker__children-container{width:13.8rem;margin:.4rem;padding-right:.2rem;padding-left:.2rem;height:auto}.react-datepicker__aria-live{position:absolute;clip-path:circle(0);border:0;height:1px;margin:-1px;overflow:hidden;padding:0;width:1px;white-space:nowrap}.react-datepicker__calendar-icon{width:1em;height:1em;vertical-align:-0.125em}\n";
2
2
 
3
3
  export { css_248z as default };
@@ -7,27 +7,15 @@ const HEIGHT = 56;
7
7
  const SPACING = 20;
8
8
  const StyledDiv = /*#__PURE__*/_styled("div", {
9
9
  target: "enye6lh0"
10
- })("background:", _ref => {
11
- let {
12
- theme
13
- } = _ref;
14
- return theme.colors.neutral.backgroundWeakElevated;
15
- }, ";border-radius:", _ref2 => {
16
- let {
17
- theme
18
- } = _ref2;
19
- return theme.radii.default;
20
- }, ";bottom:", _ref3 => {
21
- let {
22
- rank
23
- } = _ref3;
24
- return SPACING + rank * (HEIGHT + SPACING);
25
- }, "px;box-shadow:", _ref4 => {
26
- let {
27
- theme
28
- } = _ref4;
29
- return theme.shadows.defaultShadow;
30
- }, ";height:", HEIGHT, "px;left:50%;position:fixed;transform:translate(-50%, 0);width:600px;animation:", fadeIn, " 0.2s ease-in-out;");
10
+ })("background:", ({
11
+ theme
12
+ }) => theme.colors.neutral.backgroundWeakElevated, ";border-radius:", ({
13
+ theme
14
+ }) => theme.radii.default, ";bottom:", ({
15
+ rank
16
+ }) => SPACING + rank * (HEIGHT + SPACING), "px;box-shadow:", ({
17
+ theme
18
+ }) => theme.shadows.defaultShadow, ";height:", HEIGHT, "px;left:50%;position:fixed;transform:translate(-50%, 0);width:600px;animation:", fadeIn, " 0.2s ease-in-out;");
31
19
  /**
32
20
  * The ActionBar is a floating bar that appears at the bottom of a page.
33
21
  * It can be used to display important actions or information to the user, and can be configured to display a variety of different content types.
@@ -35,21 +23,18 @@ const StyledDiv = /*#__PURE__*/_styled("div", {
35
23
  * **Note:** ActionBar is added into a portal at the end of the body element. This means that it will always be on top of other elements without `z-index`,
36
24
  * and will not be affected by the layout of the page it is on.
37
25
  */
38
- const ActionBar = _ref5 => {
39
- let {
40
- children,
41
- role = 'dialog',
42
- rank = 0,
43
- className,
44
- 'data-testid': dataTestId
45
- } = _ref5;
46
- return /*#__PURE__*/createPortal(jsx(StyledDiv, {
47
- rank: rank,
48
- role: role,
49
- className: className,
50
- "data-testid": dataTestId,
51
- children: children
52
- }), document.body);
53
- };
26
+ const ActionBar = ({
27
+ children,
28
+ role = 'dialog',
29
+ rank = 0,
30
+ className,
31
+ 'data-testid': dataTestId
32
+ }) => /*#__PURE__*/createPortal(jsx(StyledDiv, {
33
+ rank: rank,
34
+ role: role,
35
+ className: className,
36
+ "data-testid": dataTestId,
37
+ children: children
38
+ }), document.body);
54
39
 
55
40
  export { ActionBar };
@@ -8,11 +8,10 @@ import { Text } from '../Text/index.js';
8
8
  import { jsxs, jsx } from '@emotion/react/jsx-runtime';
9
9
 
10
10
  function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
11
- const alertStyles = _ref => {
12
- let {
13
- theme,
14
- sentiment
15
- } = _ref;
11
+ const alertStyles = ({
12
+ theme,
13
+ sentiment
14
+ }) => {
16
15
  const sentimentColor = theme.colors[sentiment];
17
16
  return /*#__PURE__*/css("background-color:", sentimentColor.background, ";color:", sentimentColor.text, ";border-left:4px solid ", sentimentColor.border, ";");
18
17
  };
@@ -25,25 +24,16 @@ const typesDefaultIcons = {
25
24
  const StyledStackContainer = /*#__PURE__*/_styled(Stack, {
26
25
  shouldForwardProp: prop => !['sentiment'].includes(prop),
27
26
  target: "e17p0ih04"
28
- })("border-radius:", _ref2 => {
29
- let {
30
- theme
31
- } = _ref2;
32
- return theme.radii.default;
33
- }, ";padding:", _ref3 => {
34
- let {
35
- theme
36
- } = _ref3;
37
- return theme.space['2'];
38
- }, ";", alertStyles, ";");
27
+ })("border-radius:", ({
28
+ theme
29
+ }) => theme.radii.default, ";padding:", ({
30
+ theme
31
+ }) => theme.space['2'], ";", alertStyles, ";");
39
32
  const TextStack = /*#__PURE__*/_styled(Stack, {
40
33
  target: "e17p0ih03"
41
- })("color:", _ref4 => {
42
- let {
43
- theme
44
- } = _ref4;
45
- return theme.colors.neutral.text;
46
- }, ";flex-wrap:wrap;");
34
+ })("color:", ({
35
+ theme
36
+ }) => theme.colors.neutral.text, ";flex-wrap:wrap;");
47
37
  const WrapStack = /*#__PURE__*/_styled(Stack, {
48
38
  target: "e17p0ih02"
49
39
  })(process.env.NODE_ENV === "production" ? {
@@ -56,12 +46,9 @@ const WrapStack = /*#__PURE__*/_styled(Stack, {
56
46
  });
57
47
  const StyledButton = /*#__PURE__*/_styled(Button, {
58
48
  target: "e17p0ih01"
59
- })("margin-left:", _ref5 => {
60
- let {
61
- theme
62
- } = _ref5;
63
- return theme.space['5'];
64
- }, ";");
49
+ })("margin-left:", ({
50
+ theme
51
+ }) => theme.space['5'], ";");
65
52
  const CloseButton = /*#__PURE__*/_styled(Button, {
66
53
  target: "e17p0ih00"
67
54
  })(process.env.NODE_ENV === "production" ? {
@@ -75,19 +62,18 @@ const CloseButton = /*#__PURE__*/_styled(Button, {
75
62
  /**
76
63
  * Alert component is used to display a short, important message in a way that attracts the user's attention without interrupting the user's task.
77
64
  */
78
- const Alert = _ref6 => {
79
- let {
80
- children,
81
- title,
82
- sentiment = 'danger',
83
- buttonText,
84
- onClickButton,
85
- closable,
86
- onClose,
87
- className,
88
- disabled,
89
- 'data-testid': dataTestId
90
- } = _ref6;
65
+ const Alert = ({
66
+ children,
67
+ title,
68
+ sentiment = 'danger',
69
+ buttonText,
70
+ onClickButton,
71
+ closable,
72
+ onClose,
73
+ className,
74
+ disabled,
75
+ 'data-testid': dataTestId
76
+ }) => {
91
77
  const [opened, setOpened] = useState(true);
92
78
  if (!opened) return null;
93
79
  return jsxs(StyledStackContainer, {
@@ -15,80 +15,59 @@ const formatTextToAvatar = text => {
15
15
  };
16
16
  const StyledTextAvatar = /*#__PURE__*/_styled("span", {
17
17
  target: "ec0473m1"
18
- })("align-items:center;background-color:", _ref => {
19
- let {
20
- lock,
21
- theme,
22
- textBgColor
23
- } = _ref;
24
- return lock ? theme.colors.neutral.backgroundStrong : theme.colors[textBgColor]?.backgroundStrong || textBgColor;
25
- }, ";border-radius:", _ref2 => {
26
- let {
27
- theme
28
- } = _ref2;
29
- return theme.radii.circle;
30
- }, ";color:", _ref3 => {
31
- let {
32
- theme,
33
- textColor
34
- } = _ref3;
35
- return theme.colors[textColor]?.textStronger || theme.colors[textColor]?.textStrong || textColor;
36
- }, ";font-size:", _ref4 => {
37
- let {
38
- textSize
39
- } = _ref4;
40
- return textSize;
41
- }, "px;display:flex;height:100%;justify-content:center;width:100%;");
18
+ })("align-items:center;background-color:", ({
19
+ lock,
20
+ theme,
21
+ textBgColor
22
+ }) => lock ? theme.colors.neutral.backgroundStrong : theme.colors[textBgColor]?.backgroundStrong || textBgColor, ";border-radius:", ({
23
+ theme
24
+ }) => theme.radii.circle, ";color:", ({
25
+ theme,
26
+ textColor
27
+ }) => theme.colors[textColor]?.textStronger || theme.colors[textColor]?.textStrong || textColor, ";font-size:", ({
28
+ textSize
29
+ }) => textSize, "px;display:flex;height:100%;justify-content:center;width:100%;");
42
30
  const AvatarContainer = /*#__PURE__*/_styled("div", {
43
31
  target: "ec0473m0"
44
- })("height:", _ref5 => {
45
- let {
46
- size
47
- } = _ref5;
48
- return size;
49
- }, "px;width:", _ref6 => {
50
- let {
51
- size
52
- } = _ref6;
53
- return size;
54
- }, "px;");
32
+ })("height:", ({
33
+ size
34
+ }) => size, "px;width:", ({
35
+ size
36
+ }) => size, "px;");
55
37
 
56
38
  /**
57
39
  * Avatar component is used to display a user's profile picture or initials.
58
40
  */
59
- const Avatar = _ref7 => {
60
- let {
61
- image,
62
- size = 32,
63
- text,
64
- textBgColor = 'secondary',
65
- textColor = 'neutral',
66
- textSize = 10,
67
- lock = false,
68
- className,
69
- 'data-testid': dataTestId
70
- } = _ref7;
71
- return jsx(AvatarContainer, {
72
- size: size,
73
- className: className,
74
- "data-testid": dataTestId,
75
- children: text || !text && !image ? jsx(StyledTextAvatar, {
76
- lock: lock,
77
- textBgColor: textBgColor,
78
- textColor: textColor,
79
- textSize: textSize,
80
- children: lock ? jsx(Icon, {
81
- name: "lock",
82
- color: "neutral",
83
- prominence: "weak"
84
- }) : formatTextToAvatar(text)
85
- }) : jsx("img", {
86
- width: "100%",
87
- height: "100%",
88
- src: image ?? '',
89
- alt: ""
90
- })
91
- });
92
- };
41
+ const Avatar = ({
42
+ image,
43
+ size = 32,
44
+ text,
45
+ textBgColor = 'secondary',
46
+ textColor = 'neutral',
47
+ textSize = 10,
48
+ lock = false,
49
+ className,
50
+ 'data-testid': dataTestId
51
+ }) => jsx(AvatarContainer, {
52
+ size: size,
53
+ className: className,
54
+ "data-testid": dataTestId,
55
+ children: text || !text && !image ? jsx(StyledTextAvatar, {
56
+ lock: lock,
57
+ textBgColor: textBgColor,
58
+ textColor: textColor,
59
+ textSize: textSize,
60
+ children: lock ? jsx(Icon, {
61
+ name: "lock",
62
+ color: "neutral",
63
+ prominence: "weak"
64
+ }) : formatTextToAvatar(text)
65
+ }) : jsx("img", {
66
+ width: "100%",
67
+ height: "100%",
68
+ src: image ?? '',
69
+ alt: ""
70
+ })
71
+ });
93
72
 
94
73
  export { Avatar };