@ultraviolet/ui 1.19.0 → 1.20.0

package/dist/index.d.ts

@@ -1,5 +1,5 @@
 import * as react from 'react';
-import react__default, { ReactNode, ComponentProps, ButtonHTMLAttributes, AriaRole, MouseEventHandler, JSX, MouseEvent, InputHTMLAttributes, HTMLAttributeAnchorTarget, AnchorHTMLAttributes, ReactElement, Ref, RefObject, KeyboardEventHandler, HTMLAttributes, CSSProperties, ChangeEventHandler, FocusEventHandler, ForwardRefExoticComponent, ForwardedRef, ElementType, TextareaHTMLAttributes } from 'react';
+import react__default, { ReactNode, ComponentProps, ButtonHTMLAttributes, AriaRole, MouseEventHandler, JSX, MouseEvent, InputHTMLAttributes, HTMLAttributeAnchorTarget, AnchorHTMLAttributes, ReactElement, Ref, KeyboardEventHandler, RefObject, HTMLAttributes, CSSProperties, ChangeEventHandler, FocusEventHandler, ForwardRefExoticComponent, ForwardedRef, ElementType, TextareaHTMLAttributes } from 'react';
 import * as _emotion_react_jsx_runtime from '@emotion/react/jsx-runtime';
 import * as _emotion_styled from '@emotion/styled';
 import * as _emotion_react from '@emotion/react';
@@ -1181,14 +1181,14 @@ type CopyButtonProps = {
  */
 declare const CopyButton: ({ size, value, copyText, copiedText, sentiment, noBorder, className, "data-testid": dataTestId, }: CopyButtonProps) => _emotion_react_jsx_runtime.JSX.Element;
 
-type DateInputProps = Pick<ReactDatePickerProps<string>, 'autoFocus' | 'disabled' | 'locale' | 'maxDate' | 'minDate' | 'name' | 'onBlur' | 'onChange' | 'onFocus' | 'required'> & {
+type DateInputProps = Pick<ReactDatePickerProps<string, boolean>, 'autoFocus' | 'disabled' | 'locale' | 'maxDate' | 'minDate' | 'startDate' | 'endDate' | 'name' | 'onBlur' | 'onChange' | 'onFocus' | 'required' | 'excludeDates' | 'selectsRange'> & {
     error?: string;
     format?: (value?: Date | string) => string | undefined;
     /**
      * Label of the field
      */
     label?: string;
-    value?: Date | string;
+    value?: Date | string | [Date | null, Date | null];
     className?: string;
     'data-testid'?: string;
 };
@@ -1196,7 +1196,7 @@ type DateInputProps = Pick<ReactDatePickerProps<string>, 'autoFocus' | 'disabled
  * DateInput is a wrapper around react-datepicker that provides a consistent look and feel with the rest of the Ultraviolet UI.
  * See https://reactdatepicker.com/ for more information.
  */
-declare const DateInput: ({ autoFocus, disabled, error, format, label, locale, maxDate, minDate, name, onBlur, onChange, onFocus, required, value, className, "data-testid": dataTestId, }: DateInputProps) => _emotion_react_jsx_runtime.JSX.Element;
+declare const DateInput: ({ autoFocus, disabled, error, format, label, locale, maxDate, minDate, startDate, endDate, name, onBlur, onChange, onFocus, required, excludeDates, value, selectsRange, className, "data-testid": dataTestId, }: DateInputProps) => _emotion_react_jsx_runtime.JSX.Element;
 
 declare const CONTAINER_SIZES: {
     readonly small: 720;
@@ -1739,6 +1739,49 @@ declare const PieChart: ({ height, width, data, emptyLegend, content, withLegend
 
 type PopupPlacement = 'top' | 'right' | 'bottom' | 'left' | 'auto';
 
+type SentimentType = 'neutral' | 'primary';
+/**
+ * Popover component is used to display additional information or actions on top of the main content of the page.
+ * It is usually triggered by clicking on a button. It includes a title, a close button and a content area.
+ */
+declare const Popover: react.ForwardRefExoticComponent<{
+    children: ReactNode;
+    content: ReactNode;
+    title: string;
+    sentiment?: SentimentType | undefined;
+    visible?: boolean | undefined;
+    size?: "large" | "small" | "medium" | undefined;
+    onClose?: (() => void) | undefined;
+    className?: string | undefined;
+    'data-testid'?: string | undefined;
+} & Pick<{
+    id?: string | undefined;
+    children: ReactNode | ((renderProps: {
+        className?: string | undefined;
+        onBlur: () => void;
+        onFocus: () => void;
+        onPointerEnter: () => void;
+        onPointerLeave: () => void;
+        ref: react.RefObject<HTMLDivElement>;
+    }) => ReactNode);
+    maxWidth?: number | undefined;
+    placement?: PopupPlacement | undefined;
+    text?: ReactNode;
+    className?: string | undefined;
+    containerFullWidth?: boolean | undefined;
+    visible?: boolean | undefined;
+    innerRef?: Ref<HTMLDivElement | null> | undefined;
+    role?: string | undefined;
+    'data-testid'?: string | undefined;
+    hasArrow?: boolean | undefined;
+    onClose?: (() => void) | undefined;
+    tabIndex?: number | undefined;
+    onKeyDown?: KeyboardEventHandler | undefined;
+    'aria-haspopup'?: boolean | "menu" | "dialog" | "grid" | "listbox" | "tree" | "false" | "true" | undefined;
+    hideOnClickOutside?: boolean | undefined;
+    needDebounce?: boolean | undefined;
+} & react.RefAttributes<HTMLDivElement>, "placement"> & react.RefAttributes<HTMLDivElement>>;
+
 type PopupProps = {
     /**
      * Id is automatically generated if not set. It is used for associating tooltip wrapper with tooltip portal.
@@ -1786,29 +1829,6 @@ type PopupProps = {
  */
 declare const Popup: react.ForwardRefExoticComponent<PopupProps & react.RefAttributes<HTMLDivElement>>;
 
-type SentimentType = 'neutral' | 'primary';
-declare const SIZES_WIDTH: {
-    small: number;
-    medium: number;
-    large: number;
-};
-type PopoverProps = {
-    children: ReactNode;
-    content: ReactNode;
-    title: string;
-    sentiment?: SentimentType;
-    visible?: boolean;
-    size?: keyof typeof SIZES_WIDTH;
-    onClose?: () => void;
-    className?: string;
-    'data-testid'?: string;
-} & Pick<ComponentProps<typeof Popup>, 'placement'>;
-/**
- * Popover component is used to display additional information or actions on top of the main content of the page.
- * It is usually triggered by clicking on a button. It includes a title, a close button and a content area.
- */
-declare const Popover: ({ visible, children, placement, content, title, sentiment, size, onClose, className, "data-testid": dataTestId, }: PopoverProps) => _emotion_react_jsx_runtime.JSX.Element;
-
 declare const progressBarSentiments: readonly ["primary", "success", "warning", "info"];
 type ProgressBarProps = {
     sentiment?: (typeof progressBarSentiments)[number];

package/dist/react-datepicker/dist/react-datepicker.min.css.js

@@ -1,3 +1,3 @@
-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}.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";
+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";
 
 export { css_248z as default };

package/dist/src/components/Banner/index.js

@@ -132,6 +132,7 @@ const Banner = _ref8 => {
         style: {
           flex: 1
         },
+        justifyContent: "center",
         children: [jsx(Text, {
           as: "p",
           variant: size === 'medium' ? 'headingSmall' : 'bodyStronger',

package/dist/src/components/DateInput/index.js

@@ -5,13 +5,15 @@ import DatePicker, { registerLocale } from 'react-datepicker';
 import css_248z from '../../../react-datepicker/dist/react-datepicker.min.css.js';
 import { Button } from '../Button/index.js';
 import { Separator } from '../Separator/index.js';
+import { Stack } from '../Stack/index.js';
 import { Text } from '../Text/index.js';
 import { TextInput } from '../TextInput/index.js';
 import { jsxs, Fragment, jsx } from '@emotion/react/jsx-runtime';
 
+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)."; }
 const PREFIX = '.react-datepicker';
 const StyledSeparator = /*#__PURE__*/_styled(Separator, {
-  target: "e1bm75lk5"
+  target: "e1bm75lk3"
 })("margin:0 ", _ref => {
   let {
     theme
@@ -19,7 +21,7 @@ const StyledSeparator = /*#__PURE__*/_styled(Separator, {
   return theme.space['1'];
 }, ";height:100%;");
 const StyledWrapper = /*#__PURE__*/_styled("div", {
-  target: "e1bm75lk4"
+  target: "e1bm75lk2"
 })("width:100%;div", PREFIX, "-wrapper{display:block;}div", PREFIX, "__input-container{display:block;}div", PREFIX, "__triangle{display:none;}div", PREFIX, "__month-container{padding:16px;}", PREFIX, "-popper{z-index:1000;}.calendar{font-family:'Asap';border-color:", _ref2 => {
   let {
     theme
@@ -59,97 +61,158 @@ const StyledWrapper = /*#__PURE__*/_styled("div", {
   let {
     theme
   } = _ref9;
-  return theme.colors.primary.text;
+  return theme.colors.primary.textStrong;
 }, ";background-color:", _ref10 => {
   let {
     theme
   } = _ref10;
-  return theme.colors.primary.background;
-}, ";border-radius:", _ref11 => {
+  return theme.colors.primary.backgroundStrong;
+}, ";&[aria-disabled='true'],&:disabled{color:", _ref11 => {
   let {
     theme
   } = _ref11;
-  return theme.radii.circle;
-}, ";}", PREFIX, "__day--keyboard-selected{color:", _ref12 => {
+  return theme.colors.primary.textStrongDisabled;
+}, ";background-color:", _ref12 => {
   let {
     theme
   } = _ref12;
-  return theme.colors.primary.text;
-}, ";background-color:", _ref13 => {
+  return theme.colors.primary.backgroundStrongDisabled;
+}, ";}}", PREFIX, "__day--in-selecting-range{color:", _ref13 => {
   let {
     theme
   } = _ref13;
-  return theme.colors.primary.background;
-}, ";border-radius:", _ref14 => {
+  return theme.colors.primary.text;
+}, ";background-color:", _ref14 => {
   let {
     theme
   } = _ref14;
-  return theme.radii.circle;
-}, ";}", PREFIX, "__day:hover{color:", _ref15 => {
+  return theme.colors.primary.background;
+}, ";&[aria-disabled='true'],&:disabled{color:", _ref15 => {
   let {
     theme
   } = _ref15;
-  return theme.colors.primary.text;
-}, ";border-radius:", _ref16 => {
+  return theme.colors.primary.textDisabled;
+}, ";background-color:", _ref16 => {
   let {
     theme
   } = _ref16;
-  return theme.radii.circle;
-}, ";background-color:", _ref17 => {
+  return theme.colors.primary.backgroundDisabled;
+}, ";}}", PREFIX, "__day--in-range{color:", _ref17 => {
   let {
     theme
   } = _ref17;
-  return theme.colors.primary.background;
-}, ";}", PREFIX, "__day--disabled{color:", _ref18 => {
+  return theme.colors.primary.text;
+}, ";background-color:", _ref18 => {
   let {
     theme
   } = _ref18;
-  return theme.colors.primary.textStrongDisabled;
-}, ";}", PREFIX, "__day--disabled:hover{color:", _ref19 => {
+  return theme.colors.primary.background;
+}, ";&[aria-disabled='true'],&:disabled{color:", _ref19 => {
   let {
     theme
   } = _ref19;
-  return theme.colors.primary.textStrongDisabled;
-}, ";background-color:transparent;}}");
-const StyledSpan = /*#__PURE__*/_styled("span", {
-  target: "e1bm75lk3"
-})("position:absolute;right:16px;top:16px;display:flex;gap:", _ref20 => {
+  return theme.colors.primary.textDisabled;
+}, ";background-color:", _ref20 => {
   let {
     theme
   } = _ref20;
-  return theme.space['1'];
-}, ";");
-const StyledIconContainer = /*#__PURE__*/_styled("div", {
-  target: "e1bm75lk2"
-})("padding:", _ref21 => {
+  return theme.colors.primary.backgroundDisabled;
+}, ";}}", PREFIX, "__day--range-start{color:", _ref21 => {
   let {
     theme
   } = _ref21;
-  return theme.space['1'];
-}, ";position:absolute;display:flex;align-items:center;right:0;top:0;height:48px;");
-const TopHeaderDiv = /*#__PURE__*/_styled("div", {
-  target: "e1bm75lk1"
-})("margin-bottom:8px;margin-left:8px;display:inline-block;background-color:", _ref22 => {
+  return theme.colors.primary.textStrong;
+}, ";background-color:", _ref22 => {
   let {
     theme
   } = _ref22;
-  return theme.colors.neutral.backgroundWeakElevated;
-}, ";");
-const StyledText = /*#__PURE__*/_styled(Text, {
-  target: "e1bm75lk0"
-})("text-transform:capitalize;margin-right:", _ref23 => {
+  return theme.colors.primary.backgroundStrong;
+}, ";&[aria-disabled='true'],&:disabled{color:", _ref23 => {
   let {
     theme
   } = _ref23;
+  return theme.colors.primary.textStrongDisabled;
+}, ";background-color:", _ref24 => {
+  let {
+    theme
+  } = _ref24;
+  return theme.colors.primary.backgroundStrongDisabled;
+}, ";}}", PREFIX, "__day--range-end{color:", _ref25 => {
+  let {
+    theme
+  } = _ref25;
+  return theme.colors.primary.textStrong;
+}, ";background-color:", _ref26 => {
+  let {
+    theme
+  } = _ref26;
+  return theme.colors.primary.backgroundStrong;
+}, ";&[aria-disabled='true'],&:disabled{color:", _ref27 => {
+  let {
+    theme
+  } = _ref27;
+  return theme.colors.primary.textStrongDisabled;
+}, ";background-color:", _ref28 => {
+  let {
+    theme
+  } = _ref28;
+  return theme.colors.primary.backgroundStrongDisabled;
+}, ";}}", PREFIX, "__day--keyboard-selected{color:", _ref29 => {
+  let {
+    theme
+  } = _ref29;
+  return theme.colors.primary.textStrong;
+}, ";background-color:", _ref30 => {
+  let {
+    theme
+  } = _ref30;
+  return theme.colors.primary.backgroundStrong;
+}, ";}", PREFIX, "__day:hover{color:", _ref31 => {
+  let {
+    theme
+  } = _ref31;
+  return theme.colors.neutral.textHover;
+}, ";background-color:", _ref32 => {
+  let {
+    theme
+  } = _ref32;
+  return theme.colors.neutral.backgroundHover;
+}, ";}", PREFIX, "__day--disabled{color:", _ref33 => {
+  let {
+    theme
+  } = _ref33;
+  return theme.colors.neutral.textDisabled;
+}, ";}", PREFIX, "__day--disabled:hover{color:", _ref34 => {
+  let {
+    theme
+  } = _ref34;
+  return theme.colors.neutral.textDisabled;
+}, ";background-color:transparent;}}");
+const StyledIconContainer = /*#__PURE__*/_styled("div", {
+  target: "e1bm75lk1"
+})("padding:", _ref35 => {
+  let {
+    theme
+  } = _ref35;
   return theme.space['1'];
-}, ";");
+}, ";position:absolute;display:flex;align-items:center;right:0;top:0;height:48px;");
+const StyledText = /*#__PURE__*/_styled(Text, {
+  target: "e1bm75lk0"
+})(process.env.NODE_ENV === "production" ? {
+  name: "kff9ir",
+  styles: "text-transform:capitalize"
+} : {
+  name: "kff9ir",
+  styles: "text-transform:capitalize",
+  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+});
 const DEFAULT_FORMAT = value => value instanceof Date ? value.toISOString() : value;
 
 /**
  * DateInput is a wrapper around react-datepicker that provides a consistent look and feel with the rest of the Ultraviolet UI.
  * See https://reactdatepicker.com/ for more information.
  */
-const DateInput = _ref24 => {
+const DateInput = _ref36 => {
   let {
     autoFocus = false,
     disabled = false,
@@ -159,21 +222,28 @@ const DateInput = _ref24 => {
     locale,
     maxDate,
     minDate,
+    startDate,
+    endDate,
     name,
     onBlur,
     onChange,
     onFocus,
     required = false,
+    excludeDates,
     value,
+    selectsRange,
     className,
     'data-testid': dataTestId
-  } = _ref24;
+  } = _ref36;
   // Linked to: https://github.com/Hacker0x01/react-datepicker/issues/3834
   const ReactDatePicker = DatePicker.default ?? DatePicker;
   const localeCode = (typeof locale === 'string' ? locale : locale?.code) ?? 'en-GB';
   if (typeof locale === 'object') {
     registerLocale(localeCode, locale);
   }
+  const valueStart = `${startDate !== undefined && startDate !== null ? `${format(startDate)} -` : ''}`;
+  const valueEnd = `${endDate !== undefined && endDate !== null ? format(endDate) : ''}`;
+  const valueFormat = selectsRange ? `${valueStart} ${valueEnd}` : format(value);
   return jsxs(Fragment, {
     children: [jsx(Global, {
       styles: css_248z
@@ -188,13 +258,15 @@ const DateInput = _ref24 => {
         onBlur: onBlur,
         onChange: onChange,
         onFocus: onFocus,
-        selected: value ? new Date(value) : undefined,
+        selected: value && !selectsRange ? new Date(value) : undefined,
+        selectsRange: selectsRange,
+        excludeDates: excludeDates,
         customInput: jsxs("div", {
           children: [jsx(TextInput, {
             error: error ? `${error}` : undefined,
             id: `date-input${name ? `-${name}` : ''}`,
             label: label,
-            value: format(value) || '',
+            value: valueFormat || '',
             disabled: disabled
           }), jsxs(StyledIconContainer, {
             children: [required ? jsx(Icon, {
@@ -214,38 +286,42 @@ const DateInput = _ref24 => {
         calendarClassName: "calendar",
         minDate: minDate,
         maxDate: maxDate,
-        renderCustomHeader: _ref25 => {
+        startDate: startDate,
+        endDate: endDate,
+        renderCustomHeader: _ref37 => {
           let {
             date,
             decreaseMonth,
             increaseMonth,
             prevMonthButtonDisabled,
             nextMonthButtonDisabled
-          } = _ref25;
-          return jsxs(Fragment, {
-            children: [jsx(TopHeaderDiv, {
-              children: jsx(StyledText, {
-                variant: "body",
-                as: "p",
-                children: new Date(date).toLocaleString(localeCode, {
-                  month: 'long',
-                  year: 'numeric'
-                })
+          } = _ref37;
+          return jsxs(Stack, {
+            direction: "row",
+            alignItems: "center",
+            justifyContent: "space-between",
+            gap: 3,
+            children: [jsx(Button, {
+              size: "small",
+              icon: "arrow-left",
+              sentiment: "neutral",
+              variant: "ghost",
+              onClick: decreaseMonth,
+              disabled: prevMonthButtonDisabled
+            }), jsx(StyledText, {
+              variant: "bodyStrong",
+              as: "p",
+              children: new Date(date).toLocaleString(localeCode, {
+                month: 'long',
+                year: 'numeric'
               })
-            }), jsxs(StyledSpan, {
-              children: [jsx(Button, {
-                size: "small",
-                icon: "arrow-left",
-                sentiment: "neutral",
-                onClick: decreaseMonth,
-                disabled: prevMonthButtonDisabled
-              }), jsx(Button, {
-                size: "small",
-                icon: "arrow-right",
-                sentiment: "neutral",
-                onClick: increaseMonth,
-                disabled: nextMonthButtonDisabled
-              })]
+            }), jsx(Button, {
+              size: "small",
+              icon: "arrow-right",
+              sentiment: "neutral",
+              variant: "ghost",
+              onClick: increaseMonth,
+              disabled: nextMonthButtonDisabled
             })]
           });
         }

package/dist/src/components/Popover/index.js

@@ -1,5 +1,5 @@
 import _styled from '@emotion/styled/base';
-import { useRef, useState, useEffect, useCallback } from 'react';
+import { forwardRef, useRef, useState, useEffect, useCallback } from 'react';
 import { Button } from '../Button/index.js';
 import { Popup } from '../Popup/index.js';
 import { Stack } from '../Stack/index.js';
@@ -74,6 +74,7 @@ const ContentWrapper = _ref5 => {
       children: [jsx(Text, {
         variant: "bodyStrong",
         as: "h3",
+        sentiment: "neutral",
         prominence: sentiment === 'neutral' ? 'strong' : 'stronger',
         children: title
       }), jsx(Button, {
@@ -88,6 +89,7 @@ const ContentWrapper = _ref5 => {
     }), typeof children === 'string' ? jsx(Text, {
       variant: "bodySmall",
       as: "p",
+      sentiment: "neutral",
       prominence: sentiment === 'neutral' ? 'strong' : 'stronger',
       children: children
     }) : children]
@@ -97,7 +99,7 @@ const ContentWrapper = _ref5 => {
  * Popover component is used to display additional information or actions on top of the main content of the page.
  * It is usually triggered by clicking on a button. It includes a title, a close button and a content area.
  */
-const Popover = _ref6 => {
+const Popover = /*#__PURE__*/forwardRef((_ref6, ref) => {
   let {
     visible = false,
     children,
@@ -110,7 +112,6 @@ const Popover = _ref6 => {
     className,
     'data-testid': dataTestId
   } = _ref6;
-  const ref = useRef(null);
   const innerRef = useRef(null);
   const [localVisible, setLocalVisible] = useState(visible);
 
@@ -156,6 +157,6 @@ const Popover = _ref6 => {
     onKeyDown: onKeyDownSpace,
     children: children
   });
-};
+});
 
 export { Popover };

package/dist/src/components/Popup/index.js

@@ -107,7 +107,7 @@ const StyledChildrenContainer = /*#__PURE__*/_styled("div", {
 /**
  * @experimental This component is experimental and may be subject to breaking changes in the future.
  */
-const Popup = /*#__PURE__*/forwardRef((_ref13, tooltipRef) => {
+const Popup = /*#__PURE__*/forwardRef((_ref13, ref) => {
   let {
     children,
     text = '',
@@ -130,8 +130,8 @@ const Popup = /*#__PURE__*/forwardRef((_ref13, tooltipRef) => {
   } = _ref13;
   const childrenRef = useRef(null);
   useImperativeHandle(innerRef, () => childrenRef.current);
-  const tempTooltipRef = useRef(null);
-  const innerTooltipRef = tooltipRef || tempTooltipRef;
+  const innerTooltipRef = useRef(null);
+  useImperativeHandle(ref, () => innerTooltipRef.current);
   const timer = useRef();
 
   // Debounce timer will be used to prevent the tooltip from flickering when the user moves the mouse out and in the children element.
@@ -271,11 +271,11 @@ const Popup = /*#__PURE__*/forwardRef((_ref13, tooltipRef) => {
     };
     if (visibleInDom) {
       document.body.addEventListener('keyup', handleEscPress);
-      document.body.addEventListener('click', handleClickOutside);
+      document.body.addEventListener('mousedown', handleClickOutside);
     }
     return () => {
       document.body.removeEventListener('keyup', handleEscPress);
-      document.body.removeEventListener('click', handleClickOutside);
+      document.body.removeEventListener('mousedown', handleClickOutside);
     };
   }, [hideTooltip, visibleInDom, innerTooltipRef, childrenRef, hideOnClickOutside]);
 

package/dist/src/components/Text/index.js

@@ -29,10 +29,11 @@ const generateStyles = _ref => {
   } = _ref;
   // stronger is available only for neutral sentiment
   const definedProminence = sentiment !== 'neutral' && prominence === 'stronger' ? capitalize(PROMINENCES.default) : capitalize(PROMINENCES[prominence]);
-  theme.colors[sentiment];
+  sentiment ? theme.colors[sentiment] : undefined;
   const text = `text${definedProminence}${disabled ? 'Disabled' : ''}`;
+  const textColor = sentiment ? theme.colors[sentiment][text] : undefined;
   return `
-    color: ${theme.colors[sentiment][text]};
+    ${sentiment ? `color: ${textColor};` : ''}
 
     font-size: ${theme.typography[variant].fontSize};
     font-family: ${theme.typography[variant].fontFamily};
@@ -77,7 +78,7 @@ const Text = _ref2 => {
     htmlFor,
     'data-testid': dataTestId
   } = _ref2;
-  const computedSentiment = sentiment ?? color ?? 'neutral';
+  const computedSentiment = sentiment ?? color;
   const [isTruncated, setIsTruncated] = useState(false);
   const elementRef = useRef(null);
   const finalStringChildren = recursivelyGetChildrenString(children);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ultraviolet/ui",
-  "version": "1.19.0",
+  "version": "1.20.0",
   "description": "Ultraviolet UI",
   "homepage": "https://github.com/scaleway/ultraviolet#readme",
   "repository": {
@@ -39,13 +39,13 @@
     "react-dom": "18.2.0"
   },
   "devDependencies": {
-    "@babel/core": "7.23.0",
+    "@babel/core": "7.23.2",
     "@emotion/babel-plugin": "11.11.0",
     "@emotion/react": "11.11.1",
     "@emotion/styled": "11.11.0",
-    "@types/react": "18.2.25",
-    "@types/react-datepicker": "4.15.1",
-    "@types/react-dom": "18.2.10",
+    "@types/react": "18.2.28",
+    "@types/react-datepicker": "4.15.2",
+    "@types/react-dom": "18.2.13",
     "react": "18.2.0",
     "react-dom": "18.2.0"
   },
@@ -60,13 +60,13 @@
     "@scaleway/random-name": "4.0.2",
     "@scaleway/use-media": "2.0.1",
     "deepmerge": "4.3.1",
-    "react-datepicker": "4.18.0",
+    "react-datepicker": "4.20.0",
     "react-flatten-children": "1.1.2",
     "react-select": "5.7.7",
     "react-toastify": "9.1.3",
     "react-use-clipboard": "1.0.9",
     "reakit": "1.3.11",
     "@ultraviolet/themes": "1.2.1",
-    "@ultraviolet/icons": "2.4.0"
+    "@ultraviolet/icons": "2.4.1"
   }
 }