kwant-ui 3.37.0-alpha.0 → 3.37.0

package/dist/components/Alert/AlertTypes.d.ts

@@ -1,6 +1,6 @@
 import { ReactNode } from 'react';
 export declare namespace IAlert {
-    type AlertType = 'success' | 'error' | 'warning' | 'info' | 'promise';
+    type AlertType = 'success' | 'error' | 'warning' | 'info' | 'promise' | 'alert';
     interface AlertStyled {
         type: AlertType;
         width?: string;

package/dist/components/Alert/AlertUtils.d.ts

@@ -15,6 +15,7 @@ export declare const alertIcons: {
     error: import("react/jsx-runtime").JSX.Element;
     warning: import("react/jsx-runtime").JSX.Element;
     promise: import("react/jsx-runtime").JSX.Element;
+    alert: import("react/jsx-runtime").JSX.Element;
 };
 export declare const switchStyles: (type: IAlert.AlertType, theme: any) => {
     background: any;

package/dist/components/Calendar/CalendarComponents.d.ts

@@ -1,10 +1,11 @@
-import { DateObject } from 'react-multi-date-picker';
-import { ICalendar } from './CalendarTypes';
+import { CalendarTimeBarProps, ICalendar } from './CalendarTypes';
 export type SidebarOptionProps = ICalendar.SidebarOptionProps;
 export declare const SidebarOption: ({ title, selected, onClick }: SidebarOptionProps) => import("react/jsx-runtime").JSX.Element;
-export declare const CalendarSidebar: ({ options, selectedOption, onOptionClick, }: {
+export declare const CalendarSidebar: ({ options, selectedOption, onOptionClick, order, }: {
     options?: Pick<SidebarOptionProps, 'title' | 'selected' | 'value'>[];
     selectedOption: string;
-    onOptionClick?: (value: () => DateObject[], option?: Pick<SidebarOptionProps, 'title' | 'selected' | 'value'>) => void;
+    onOptionClick?: (value: SidebarOptionProps['value'], option?: Pick<SidebarOptionProps, 'title' | 'selected' | 'value'>) => void;
+    order?: number;
 }) => import("react/jsx-runtime").JSX.Element;
+export declare const CalendarTimeBar: ({ label, timeHour, timeMinute, clockType, disabled, onClockTypeChange, onHourChange, onMinuteChange, }: CalendarTimeBarProps) => import("react/jsx-runtime").JSX.Element;
 export declare const renderDatepickerNavigationButton: (direction: ICalendar.DatpickerNavigationDirection, handleClick: (event: React.MouseEvent<HTMLButtonElement>) => void) => import("react/jsx-runtime").JSX.Element;

package/dist/components/Calendar/CalendarStyled.d.ts

@@ -1,8 +1,44 @@
+/// <reference types="react" />
 export declare const CalendarWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const CalendarSidebarStyled: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const CalendarSidebarStyled: import("styled-components").StyledComponent<"div", any, {
+    order?: number;
+}, never>;
 export declare const CalendarSidebarOptions: import("styled-components").StyledComponent<"button", any, {
     selected?: boolean;
 }, never>;
+export declare const CalendarTimebar: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const StyledInput: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("react").InputHTMLAttributes<HTMLInputElement> & {
+    onClick?: (event: import("react").MouseEvent<HTMLInputElement, MouseEvent>) => void;
+    onChange?: (event: import("react").ChangeEvent<HTMLInputElement>) => void;
+    disabled?: boolean;
+    value?: string | number;
+    name?: string;
+    type?: string;
+    required?: boolean;
+    readOnly?: boolean;
+    label?: string;
+    errorMessage?: string;
+    error?: boolean;
+    id?: string;
+    helperText?: string;
+    onBlur?: (e: import("react").FocusEvent<HTMLInputElement, Element>) => void;
+    onFocus?: (e: import("react").FocusEvent<HTMLInputElement, Element>) => void;
+    rightSection?: import("react").ReactNode;
+    leftSection?: import("react").ReactNode;
+    width?: number;
+    variant?: import("../Input/types").InputComponent.InputVariant;
+    tooltipContent?: string;
+    tooltipPosition?: import("../Tooltip/types").TooltipComponent.Position;
+    decimal?: boolean;
+} & import("react").RefAttributes<HTMLInputElement>>, any, {}, never>;
+export declare const Colon: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const InputGroup: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const SelectorStyled: import("styled-components").StyledComponent<({ content, activeKey, onClick, height, multiple, disabled, }: import("../Selector/types").SelectorComponent.Props) => import("react/jsx-runtime").JSX.Element, any, {}, never>;
+export declare const TimeBarContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const TopLabel: import("styled-components").StyledComponent<"label", any, import("../Label/types").LabelComponent.Label, never>;
+export declare const TimeBarStyled: import("styled-components").StyledComponent<"div", any, {
+    showTime?: boolean;
+}, never>;
 declare const DatepickerNavigationButton: import("styled-components").StyledComponent<"button", any, {}, never>;
 declare const IconWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
 export { DatepickerNavigationButton, IconWrapper };

package/dist/components/Calendar/CalendarTypes.d.ts

@@ -1,4 +1,5 @@
 /// <reference types="react" />
+import dayjs from 'dayjs';
 import { CalendarProps, DateObject } from 'react-multi-date-picker';
 export type RangeDomainUnit = 'd' | 'w' | 'm' | 'y';
 export type RangeDomain = `${number}${RangeDomainUnit}`;
@@ -7,13 +8,38 @@ export declare namespace ICalendar {
         range?: boolean;
         numberOfMonths?: number;
         calenderRef?: any;
+        labels?: string;
         showSidebar?: boolean;
+        showTime?: boolean;
+        disableTime?: boolean;
+        time?: {
+            from: {
+                hour: string;
+                minute: string;
+                clockType: ClockType;
+            };
+            to: {
+                hour: string;
+                minute: string;
+                clockType: ClockType;
+            };
+        };
+        onHourChange?: (key: string, value: string) => void;
+        onMinuteChange?: (key: string, value: string) => void;
+        onClockTypeChange?: (key: string, value: string) => void;
         sidebarOptions?: Omit<SidebarOptionProps, 'onClick'>[];
         projectDuration?: ProjectDuration;
         disableFutureDatesOnCustomRange?: boolean;
         selectedSidebarOption?: string;
         rangeDomain?: RangeDomain;
+        onSidebarOptionSelect?: (value: string) => void;
         onChange?: (date: DateObject | DateObject[], selectedOption?: string) => void;
+        onChangeDateTime?: (date: dayjs.Dayjs | dayjs.Dayjs[], selectedOption?: string) => void;
+    };
+    type ClockType = 'am' | 'pm';
+    type CalendarTimeBarProps = {
+        times: string[];
+        onTimeChange: (index: number, value: string) => void;
     };
     enum DatpickerNavigationDirectionEnum {
         right = "right",
@@ -28,7 +54,24 @@ export declare namespace ICalendar {
     type SidebarOptionProps = {
         title: string;
         selected?: boolean;
-        value?: () => DateObject[];
+        value?: (() => DateObject[]) | (() => dayjs.Dayjs[]) | string;
         onClick?: () => void;
     };
+    type Time = {
+        key: string;
+        label: string;
+        timeHour: string;
+        timeMinute: string;
+        clockType: string;
+    };
 }
+export type CalendarTimeBarProps = {
+    label?: string;
+    timeHour?: string;
+    timeMinute?: string;
+    clockType?: ICalendar.ClockType | string;
+    disabled?: boolean;
+    onHourChange: (key: string, value: string) => void;
+    onMinuteChange: (key: string, value: string) => void;
+    onClockTypeChange: (key: string, value: string) => void;
+};

package/dist/components/Calendar/CalendarUtils.d.ts

@@ -5,6 +5,10 @@ export declare const isRangeWithNumberOfMonths: (range: boolean, numberOfMonths:
 declare const regexInputValidate: (event: ICalendar.InputChangeEvent, onChange: (event: ICalendar.InputChangeEvent) => void) => void;
 declare const weeks: string[];
 declare const fullMonthsText: any;
+export declare const selectorContent: {
+    [key: string]: string;
+    clockType: ICalendar.ClockType;
+}[];
 export declare const getDateObjectForCalendarConstants: (date: string | Date, amount: number, unit: dayjs.ManipulateType, end: 'startOf' | 'endOf') => DateObject;
 export declare const CALENDAR_CONSTANTS: {
     TODAY: DateObject[];
@@ -18,6 +22,13 @@ export declare const CALENDAR_CONSTANTS: {
     THIS_MONTH: DateObject[];
     PAST_MONTH: DateObject[];
     CUSTOM_RANGE: DateObject[];
+    NOW: DateObject[];
+    LAST_HOUR: DateObject[];
+    LAST_HALF_AN_HOUR: DateObject[];
+    LAST_10_MINUTES: DateObject[];
+    LAST_5_MINUTES: DateObject[];
+    YESTERDAY: DateObject[];
+    CUSTOM_RANGE_LOCATION_PLAN: DateObject[];
 };
 export declare const getSidebarOptions: (projectDuration?: ICalendar.ProjectDuration) => {
     title: string;
@@ -25,4 +36,9 @@ export declare const getSidebarOptions: (projectDuration?: ICalendar.ProjectDura
 }[];
 declare const getDateOffset: (valueArr: Value, domain: RangeDomain) => DateObject[];
 declare const isNotInCurrentMonth: (date: string | DateObject) => boolean;
-export { fullMonthsText, regexInputValidate, weeks, getDateOffset, isNotInCurrentMonth };
+declare const timeSet: {
+    key: string;
+    label: string;
+}[];
+declare const addPadStart: (value: string) => string;
+export { fullMonthsText, regexInputValidate, weeks, getDateOffset, isNotInCurrentMonth, timeSet, addPadStart, };

package/dist/components/Checkbox/types.d.ts

@@ -7,7 +7,6 @@ export declare namespace Checkbox {
         onChange?: (event: React.ChangeEvent<HTMLInputElement>) => void;
         color?: string;
         disabled?: boolean;
-        defaultChecked?: boolean;
         checked?: boolean;
         variant?: CheckboxVariant;
         checkBoxColor?: string;

package/dist/components/Datepicker/DatepickerStyled.d.ts

@@ -1,3 +1,7 @@
+declare const DatepickerWrapper: import("styled-components").StyledComponent<"div", any, {
+    showTime?: boolean;
+    disableTimeRange?: boolean;
+}, never>;
 declare const DatepickerNavigationButton: import("styled-components").StyledComponent<"button", any, {}, never>;
 declare const IconWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
-export { DatepickerNavigationButton, IconWrapper };
+export { DatepickerNavigationButton, IconWrapper, DatepickerWrapper };

package/dist/components/Datepicker/types.d.ts

@@ -1,7 +1,13 @@
 /// <reference types="react" />
 import { CalendarProps, DatePickerProps } from 'react-multi-date-picker';
 import { InputComponent } from '../Input/types';
+import { SidebarOptionProps } from '../Calendar/CalendarComponents';
 export declare namespace IDatepicker {
+    type ClockType = 'am' | 'pm';
+    enum ClockTypeEnum {
+        am = "am",
+        pm = "pm"
+    }
     type Props = CalendarProps & DatePickerProps & {
         range?: boolean;
         numberOfMonths?: number;
@@ -12,6 +18,14 @@ export declare namespace IDatepicker {
         calendarRef?: any;
         inputProps?: InputComponent.Props;
         dateFormat?: string;
+        showTime?: boolean;
+        dateTimeRange?: DateRangeType;
+        onChangeDateTime?: (time: DateRangeType, option: string) => void;
+        projectDuration?: DateRangeType;
+        showSideBar?: boolean;
+        sidebarOptions?: Omit<SidebarOptionProps, 'onClick'>[];
+        selectedSidebarOption?: string;
+        timezone?: string;
     };
     enum DatpickerNavigationDirectionEnum {
         right = "right",
@@ -19,4 +33,24 @@ export declare namespace IDatepicker {
     }
     type InputChangeEvent = React.ChangeEvent<HTMLInputElement>;
     type DatpickerNavigationDirection = keyof typeof DatpickerNavigationDirectionEnum;
+    type DateRangeType = {
+        startDate: string;
+        endDate: string;
+    };
+    type TimeRangeType = {
+        from: {
+            hour: string;
+            minute: string;
+            clockType: ClockType;
+        };
+        to: {
+            hour: string;
+            minute: string;
+            clockType: ClockType;
+        };
+    };
+    type DateTimeRangeType = {
+        dateRange: DateRangeType;
+        timeRange: TimeRangeType;
+    };
 }

package/dist/components/Datepicker/utils/index.d.ts

@@ -1,7 +1,35 @@
+import { DateObject } from 'react-multi-date-picker';
 import { IDatepicker } from '../types';
 declare const renderDatepickerNavigationButton: (direction: IDatepicker.DatpickerNavigationDirection, handleClick: (event: React.MouseEvent<HTMLButtonElement>) => void) => import("react/jsx-runtime").JSX.Element;
 declare const regexInputValidate: (event: IDatepicker.InputChangeEvent, onChange: (event: IDatepicker.InputChangeEvent) => void) => void;
 declare const months: string[];
 declare const weeks: string[];
 declare const fullMonthsText: any;
-export { renderDatepickerNavigationButton, regexInputValidate, months, weeks, fullMonthsText };
+declare const createDateTimeRangeParams: (dateTimeRange?: IDatepicker.DateTimeRangeType) => {
+    startDate: string;
+    endDate: string;
+};
+declare const getDateRange: (dates: DateObject[] | DateObject | null) => string;
+declare const extractTimeFromDate: (dateTimeRange: IDatepicker.DateRangeType) => {
+    startDateOnly: string;
+    endDateOnly: string;
+    time: {
+        from: {
+            hour: string;
+            minute: string;
+            clockType: IDatepicker.ClockTypeEnum;
+        };
+        to: {
+            hour: string;
+            minute: string;
+            clockType: IDatepicker.ClockTypeEnum;
+        };
+    };
+};
+declare const formatDateTime: (date: string | Date, format: string, timeRange: {
+    hour: string;
+    minute: string;
+    clockType: string;
+}) => string;
+declare const getFormattedDateTime: (dateTimeRange?: IDatepicker.DateRangeType, dateFormat?: string) => string;
+export { renderDatepickerNavigationButton, regexInputValidate, months, weeks, fullMonthsText, createDateTimeRangeParams, getDateRange, extractTimeFromDate, formatDateTime, getFormattedDateTime, };

package/dist/components/Dropdown/DropdownStyled.d.ts

@@ -6,8 +6,12 @@ export declare const OptionsContainer: import("styled-components").StyledCompone
     separator?: boolean;
     showScrollbar?: boolean;
 }, never>;
-export declare const Option: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const CustomOption: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const Option: import("styled-components").StyledComponent<"div", any, {
+    isSelected?: boolean;
+}, never>;
+export declare const CustomOption: import("styled-components").StyledComponent<"div", any, {
+    isSelected?: boolean;
+}, never>;
 export declare const EmptyResultContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
 export declare const AddOptionContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
 export declare const CustomImageOption: import("styled-components").StyledComponent<"div", any, {

package/dist/components/DropdownSelect/DropdownSelect.styled.d.ts

@@ -1,4 +1,6 @@
-export declare const Root: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const Root: import("styled-components").StyledComponent<"div", any, {
+    disabled?: boolean;
+}, never>;
 export declare const ChildrenWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
 export declare const Container: import("styled-components").StyledComponent<"div", any, {
     expandedHeight: number | string;

package/dist/components/DropdownSelect/DropdownSelect.types.d.ts

@@ -6,5 +6,6 @@ export declare namespace IDropdownSelect {
         children: React.ReactNode;
         toggleOnTargetClick?: boolean;
         withInput?: boolean;
+        disabled?: boolean;
     };
 }

package/dist/components/HorizontalStepper/index.d.ts

@@ -6,6 +6,8 @@ type HorizontalStepperType = {
     steps?: any;
     activeStep?: any;
     setActiveStep?: any;
+    navigateOnStepClick?: boolean;
+    onStepChange?: (value: any) => void;
 };
-declare const HorizontalStepper: ({ activeStep, setActiveStep, ...props }: HorizontalStepperType) => import("react/jsx-runtime").JSX.Element;
+declare const HorizontalStepper: ({ activeStep, setActiveStep, navigateOnStepClick, onStepChange, ...props }: HorizontalStepperType) => import("react/jsx-runtime").JSX.Element;
 export { HorizontalStepper };

package/dist/components/Input/index.d.ts

@@ -22,5 +22,6 @@ declare const Input: import("react").ForwardRefExoticComponent<import("react").I
     variant?: InputComponent.InputVariant;
     tooltipContent?: string;
     tooltipPosition?: import("../Tooltip/types").TooltipComponent.Position;
+    decimal?: boolean;
 } & import("react").RefAttributes<HTMLInputElement>>;
 export { Input };

package/dist/components/Input/types.d.ts

@@ -25,6 +25,7 @@ export declare namespace InputComponent {
         variant?: InputVariant;
         tooltipContent?: string;
         tooltipPosition?: TooltipComponent.Position;
+        decimal?: boolean;
     };
     type Astrik = {
         disabled: boolean;

package/dist/components/MultiSelect/MultiSelect.d.ts

@@ -1,3 +1,3 @@
 import { MSTypes } from './types';
-declare const MultiSelect: ({ width, options, activeOptions, setActiveOptions, placeholder, label, variant, dropdownSelectProps, avatarProps, tooltipContent, tooltipPosition, }: MSTypes) => import("react/jsx-runtime").JSX.Element;
+declare const MultiSelect: ({ width, options, activeOptions, setActiveOptions, placeholder, label, variant, dropdownSelectProps, avatarProps, tooltipContent, tooltipPosition, labelTrimCount, }: MSTypes) => import("react/jsx-runtime").JSX.Element;
 export { MultiSelect };

package/dist/components/MultiSelect/types.d.ts

@@ -14,6 +14,7 @@ export type MSTypes = {
     avatarProps?: AvatarDeclarations.Props;
     tooltipContent?: string;
     tooltipPosition?: TooltipComponent.Position;
+    labelTrimCount?: number;
 };
 export type MSStyleTypes = {
     width?: any;

package/dist/components/MultiSelect/utils.d.ts

@@ -17,7 +17,7 @@ export declare const MultiSelectOption: ({ option, isSelected: isChecked, varian
     hasImage?: boolean;
     avatarProps?: MSTypes['avatarProps'];
 }) => import("react/jsx-runtime").JSX.Element;
-export declare const trimTagLabel: (label: string) => string;
+export declare const trimTagLabel: (label: string, labelTrimCount: number) => string;
 export declare const ActiveTag: ({ filterLabel, onChipClose, }: {
     filterLabel: string;
     onChipClose: () => void;

package/dist/components/Select/Select.styled.d.ts

@@ -1,6 +1,7 @@
 export declare const SelectContainer: import("styled-components").StyledComponent<"div", any, {
     width?: string;
     allowInput?: boolean;
+    disabled?: boolean;
 }, never>;
 export declare const ChevronDown: import("styled-components").StyledComponent<"div", any, {
     isOpened?: boolean;

package/dist/components/Select/Select.types.d.ts

@@ -16,6 +16,7 @@ export declare namespace ISelect {
         inputProps?: InputComponent.Props;
         onClear?: () => void;
         onSelect?: (option: ISelect.Option, index?: number) => void;
+        disabled?: boolean;
     }
     interface Option extends IDropdownSelect.Option {
     }

package/dist/components/Selector/Selector.d.ts

@@ -1,3 +1,3 @@
 import { SelectorComponent } from './types';
-declare const Selector: ({ content, activeKey, onClick, height }: SelectorComponent.Props) => import("react/jsx-runtime").JSX.Element;
+declare const Selector: ({ content, activeKey, onClick, height, multiple, disabled, }: SelectorComponent.Props) => import("react/jsx-runtime").JSX.Element;
 export default Selector;

package/dist/components/Selector/types.d.ts

@@ -1,8 +1,17 @@
 export declare namespace SelectorComponent {
     type Props = {
         content: any;
-        activeKey?: string;
+        activeKey?: string | string[];
         onClick?: any;
         height?: string;
+        multiple?: boolean;
+        disabled?: boolean;
+    };
+    type ClassOptions = {
+        isFirst?: boolean;
+        isLast?: boolean;
+        isSingle?: boolean;
+        isActive?: boolean;
+        isDisabled?: boolean;
     };
 }

package/dist/components/Tag/types.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="react" />
 export type TGTypes = {
-    type: 'primary' | 'secondary' | 'success' | 'error' | 'warning' | 'orange' | 'grey';
+    type: 'primary' | 'secondary' | 'success' | 'error' | 'warning' | 'orange' | 'grey' | 'insight';
     size?: 'small' | 'default';
     avatar?: any;
     icon?: any;

package/dist/components/Toast/Toast.types.d.ts

@@ -1,5 +1,5 @@
 import { ReactNode } from 'react';
-export type GeneralToastType = 'success' | 'error' | 'warning' | 'info';
+export type GeneralToastType = 'success' | 'error' | 'warning' | 'info' | 'alert';
 export type ToastType = GeneralToastType | 'promise';
 export type XAlign = 'left' | 'center' | 'right';
 export type YAlign = 'top' | 'bottom';
@@ -39,6 +39,7 @@ export interface IToastContext {
         warning: GeneralToastFn;
         info: GeneralToastFn;
         promise: PromiseToastFn;
+        alert: GeneralToastFn;
     };
     removeToast: (id: string) => void;
     setConfig: (config: Omit<IToastProviderConfig, 'children'>) => void;

package/dist/hooks/index.d.ts

@@ -2,3 +2,4 @@ export * from './useToast';
 export * from './useOutsideClick';
 export * from './useDebouncedValue';
 export * from './useToggle';
+export * from './useTimeBar';

package/dist/hooks/useTimeBar.d.ts

@@ -0,0 +1,29 @@
+/// <reference types="react" />
+import { IDatepicker } from '../components/Datepicker/types';
+declare const useTimeBar: () => {
+    time: {
+        from: {
+            hour: string;
+            minute: string;
+            clockType: IDatepicker.ClockType;
+        };
+        to: {
+            hour: string;
+            minute: string;
+            clockType: IDatepicker.ClockType;
+        };
+    };
+    setTime: import("react").Dispatch<import("react").SetStateAction<{
+        from: {
+            hour: string;
+            minute: string;
+            clockType: IDatepicker.ClockType;
+        };
+        to: {
+            hour: string;
+            minute: string;
+            clockType: IDatepicker.ClockType;
+        };
+    }>>;
+};
+export { useTimeBar };

package/dist/hooks/useToast.d.ts

@@ -6,5 +6,6 @@ declare const useToast: (hookConfig?: Omit<IToastProviderConfig, 'children'>) =>
     warning: import("../components/Toast/Toast.types").GeneralToastFn;
     info: import("../components/Toast/Toast.types").GeneralToastFn;
     promise: import("../components/Toast/Toast.types").PromiseToastFn;
+    alert: import("../components/Toast/Toast.types").GeneralToastFn;
 };
 export { useToast };

package/dist/index.d.ts

@@ -65,3 +65,4 @@ export { CALENDAR_CONSTANTS, getDateObjectForCalendarConstants, } from './compon
 export * from './components/TrendPercentage';
 export * from './components/Charts/WorkerTimeChart';
 export { processDataForWorkerTimeChart } from './components/Charts/WorkerTimeChart/WorkerTimeChartData';
+export { extractTimeFromDate, createDateTimeRangeParams, formatDateTime, getFormattedDateTime, } from './components/Datepicker/utils';