@chayns-components/date 5.0.0-beta.1000

package/lib/esm/utils/dateInfo.js

@@ -0,0 +1,120 @@
+import { getLanguage, Language } from 'chayns-api';
+import { isCurrentYear, isToday, isTomorrow, isYesterday } from './date';
+export const getDateInfo = _ref => {
+  let {
+    date,
+    shouldShowYear,
+    shouldShowTime,
+    shouldShowDayOfWeek,
+    shouldShowRelativeDayOfWeek,
+    shouldUseShortText
+  } = _ref;
+  const {
+    active: language
+  } = getLanguage();
+  let dayPart = '';
+  if (shouldShowRelativeDayOfWeek) {
+    const rtf = new Intl.RelativeTimeFormat(language, {
+      numeric: 'auto'
+    });
+    if (isToday(date)) {
+      dayPart = capitalizeFirstLetter(rtf.format(0, 'day'));
+    }
+    if (isTomorrow(date)) {
+      dayPart = capitalizeFirstLetter(rtf.format(1, 'day'));
+    }
+    if (isYesterday(date)) {
+      dayPart = capitalizeFirstLetter(rtf.format(-1, 'day'));
+    }
+  }
+  if (!dayPart && shouldShowDayOfWeek) {
+    dayPart = date.toLocaleDateString(language, {
+      weekday: shouldUseShortText ? 'short' : 'long'
+    });
+  }
+  const dateParts = {
+    day: '2-digit',
+    month: shouldUseShortText ? 'short' : 'long'
+  };
+  if (shouldShowYear && !isCurrentYear(date)) {
+    dateParts.year = 'numeric';
+  }
+  const timeParts = {};
+  if (shouldShowTime) {
+    timeParts.hour = '2-digit';
+    timeParts.minute = '2-digit';
+  }
+  let formattedTime = '';
+  if (Object.keys(timeParts).length > 0) {
+    formattedTime = `, ${date.toLocaleTimeString(language, {
+      ...timeParts
+    })}`;
+  }
+  const hourWord = getTimeString({
+    language
+  });
+  formattedTime += shouldShowTime ? ` ${hourWord}` : '';
+  const formattedDate = `${date.toLocaleDateString(language, dateParts)}${formattedTime}`;
+  return `${dayPart}${dayPart ? ', ' : ''}${formattedDate}`;
+};
+const capitalizeFirstLetter = text => text.charAt(0).toUpperCase() + text.slice(1);
+export const getTimeTillNow = _ref2 => {
+  let {
+    date,
+    currentDate,
+    language = Language.English
+  } = _ref2;
+  const diffInSeconds = Math.floor((currentDate.getTime() - date.getTime()) / 1000);
+  const isPast = diffInSeconds > 0;
+  const units = [{
+    label: 'year',
+    seconds: 31536000
+  }, {
+    label: 'month',
+    seconds: 2592000
+  }, {
+    label: 'day',
+    seconds: 86400
+  }, {
+    label: 'hour',
+    seconds: 3600
+  }, {
+    label: 'minute',
+    seconds: 60
+  }, {
+    label: 'second',
+    seconds: 1
+  }];
+  const absDiff = Math.abs(diffInSeconds);
+  const {
+    label,
+    seconds
+  } = units.find(u => absDiff >= u.seconds) || {
+    label: 'second',
+    seconds: 1
+  };
+  const count = Math.floor(absDiff / seconds);
+  const formatter = new Intl.RelativeTimeFormat(language, {
+    numeric: 'auto'
+  });
+  return formatter.format(isPast ? -count : count, label);
+};
+export const getTimeString = _ref3 => {
+  let {
+    language
+  } = _ref3;
+  const map = {
+    nl: 'uur',
+    fr: 'heures',
+    de: 'Uhr',
+    es: 'horas',
+    it: 'ore',
+    pt: 'horas',
+    pl: 'godzina',
+    tr: 'saat',
+    uk: 'година',
+    en: ''
+  };
+  return map[language ?? ''] ?? '';
+};
+//# sourceMappingURL=dateInfo.js.map

package/lib/esm/utils/dateInfo.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"dateInfo.js","names":["getLanguage","Language","isCurrentYear","isToday","isTomorrow","isYesterday","getDateInfo","_ref","date","shouldShowYear","shouldShowTime","shouldShowDayOfWeek","shouldShowRelativeDayOfWeek","shouldUseShortText","active","language","dayPart","rtf","Intl","RelativeTimeFormat","numeric","capitalizeFirstLetter","format","toLocaleDateString","weekday","dateParts","day","month","year","timeParts","hour","minute","formattedTime","Object","keys","length","toLocaleTimeString","hourWord","getTimeString","formattedDate","text","charAt","toUpperCase","slice","getTimeTillNow","_ref2","currentDate","English","diffInSeconds","Math","floor","getTime","isPast","units","label","seconds","absDiff","abs","find","u","count","formatter","_ref3","map","nl","fr","de","es","it","pt","pl","tr","uk","en"],"sources":["../../../src/utils/dateInfo.ts"],"sourcesContent":["import { getLanguage, Language } from 'chayns-api';\nimport { UseDateInfoOptions } from '../types/dateinfo';\nimport { isCurrentYear, isToday, isTomorrow, isYesterday } from './date';\n\nexport const getDateInfo = ({\n    date,\n    shouldShowYear,\n    shouldShowTime,\n    shouldShowDayOfWeek,\n    shouldShowRelativeDayOfWeek,\n    shouldUseShortText,\n}: Omit<UseDateInfoOptions, 'shouldShowDateToNowDifference' & 'preText'>) => {\n    const { active: language } = getLanguage();\n\n    let dayPart = '';\n\n    if (shouldShowRelativeDayOfWeek) {\n        const rtf = new Intl.RelativeTimeFormat(language, { numeric: 'auto' });\n\n        if (isToday(date)) {\n            dayPart = capitalizeFirstLetter(rtf.format(0, 'day'));\n        }\n\n        if (isTomorrow(date)) {\n            dayPart = capitalizeFirstLetter(rtf.format(1, 'day'));\n        }\n\n        if (isYesterday(date)) {\n            dayPart = capitalizeFirstLetter(rtf.format(-1, 'day'));\n        }\n    }\n\n    if (!dayPart && shouldShowDayOfWeek) {\n        dayPart = date.toLocaleDateString(language, {\n            weekday: shouldUseShortText ? 'short' : 'long',\n        });\n    }\n\n    const dateParts: Intl.DateTimeFormatOptions = {\n        day: '2-digit',\n        month: shouldUseShortText ? 'short' : 'long',\n    };\n\n    if (shouldShowYear && !isCurrentYear(date)) {\n        dateParts.year = 'numeric';\n    }\n\n    const timeParts: Intl.DateTimeFormatOptions = {};\n\n    if (shouldShowTime) {\n        timeParts.hour = '2-digit';\n        timeParts.minute = '2-digit';\n    }\n\n    let formattedTime = '';\n    if (Object.keys(timeParts).length > 0) {\n        formattedTime = `, ${date.toLocaleTimeString(language, { ...timeParts })}`;\n    }\n\n    const hourWord = getTimeString({ language });\n\n    formattedTime += shouldShowTime ? ` ${hourWord}` : '';\n\n    const formattedDate = `${date.toLocaleDateString(language, dateParts)}${formattedTime}`;\n\n    return `${dayPart}${dayPart ? ', ' : ''}${formattedDate}`;\n};\n\nconst capitalizeFirstLetter = (text: string): string =>\n    text.charAt(0).toUpperCase() + text.slice(1);\n\ntype RelativeTimeUnit = 'year' | 'month' | 'day' | 'hour' | 'minute' | 'second';\n\ninterface GetTimeTillNow {\n    date: Date;\n    currentDate: Date;\n    language: Language;\n}\n\nexport const getTimeTillNow = ({\n    date,\n    currentDate,\n    language = Language.English,\n}: GetTimeTillNow): string => {\n    const diffInSeconds = Math.floor((currentDate.getTime() - date.getTime()) / 1000);\n    const isPast = diffInSeconds > 0;\n\n    const units: { label: RelativeTimeUnit; seconds: number }[] = [\n        { label: 'year', seconds: 31536000 },\n        { label: 'month', seconds: 2592000 },\n        { label: 'day', seconds: 86400 },\n        { label: 'hour', seconds: 3600 },\n        { label: 'minute', seconds: 60 },\n        { label: 'second', seconds: 1 },\n    ];\n\n    const absDiff = Math.abs(diffInSeconds);\n    const { label, seconds } = units.find((u) => absDiff >= u.seconds) || {\n        label: 'second',\n        seconds: 1,\n    };\n    const count = Math.floor(absDiff / seconds);\n\n    const formatter = new Intl.RelativeTimeFormat(language, { numeric: 'auto' });\n\n    return formatter.format(isPast ? -count : count, label);\n};\n\ninterface GetTimeStringProps {\n    language?: Language;\n}\n\nexport const getTimeString = ({ language }: GetTimeStringProps) => {\n    const map: { [key: string]: string } = {\n        nl: 'uur',\n        fr: 'heures',\n        de: 'Uhr',\n        es: 'horas',\n        it: 'ore',\n        pt: 'horas',\n        pl: 'godzina',\n        tr: 'saat',\n        uk: 'година',\n        en: '',\n    };\n\n    return map[language ?? ''] ?? '';\n};\n"],"mappings":"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","ignoreList":[]}

package/lib/types/components/calendar/Calendar.d.ts

@@ -0,0 +1,97 @@
+import { Language } from 'chayns-api';
+import { FC } from 'react';
+import { CalendarType, Categories, CustomThumbColors, DateInterval, HighlightedDates } from '../../types/calendar';
+interface BaseProps {
+    /**
+     * An array to group dates into a category.
+     */
+    categories?: Categories[];
+    /**
+     * Custom colors for the thumb.
+     */
+    customThumbColors?: CustomThumbColors;
+    /**
+     * An array with dates and corresponding styles to highlight.
+     */
+    highlightedDates?: HighlightedDates[];
+    /**
+     * To disable the Calendar
+     */
+    isDisabled?: boolean;
+    /**
+     * The locale language to format the dates.
+     */
+    locale?: Language;
+    /**
+     * The maximum date that can be selected.
+     */
+    maxDate?: Date;
+    /**
+     * The minimum date that can be selected.
+     */
+    minDate?: Date;
+    /**
+     * An array of dates that should be disabled.
+     */
+    disabledDates?: Date[];
+    /**
+     * Whether the highlighted dates should be displayed for the greyed month overlay days.
+     */
+    shouldShowHighlightsInMonthOverlay?: boolean;
+    /**
+     * Shows the month and year pickers, if there are multiple months/years to select from.
+     */
+    showMonthYearPickers?: boolean;
+    /**
+     * Function to be executed when the selected date, dates or date interval change.
+     * @param date
+     */
+    onChange?: (date: Date | Date[] | DateInterval) => void;
+    /**
+     * Function to be executed when the shown dates change. Returns the start of the displayed month and the end of the last displayed month (since depending on the available widths, there are one or two months displayed).
+     @param { start: Date, end: Date }
+     */
+    onShownDatesChange?: (dates: {
+        start: Date;
+        end: Date;
+    }) => void;
+}
+interface SingleSelectionProps {
+    /**
+     * The type of the calendar selection.
+     */
+    type?: CalendarType.Single;
+    /**
+     * A date that should be preselected.
+     */
+    selectedDate?: Date;
+    selectedDates?: never;
+    selectedDateInterval?: never;
+}
+interface MultipleSelectionProps {
+    /**
+     * The type of the calendar selection.
+     */
+    type: CalendarType.Multiple;
+    /**
+     * An array of dates that should be preselected.
+     */
+    selectedDates?: Date[];
+    selectedDate?: never;
+    selectedDateInterval?: never;
+}
+interface IntervalSelectionProps {
+    /**
+     * The type of the calendar selection.
+     */
+    type: CalendarType.Interval;
+    /**
+     * An interval that should be preselected.
+     */
+    selectedDateInterval?: DateInterval;
+    selectedDates?: never;
+    selectedDate?: never;
+}
+export type CalendarProps = BaseProps & (SingleSelectionProps | MultipleSelectionProps | IntervalSelectionProps);
+declare const Calendar: FC<CalendarProps>;
+export default Calendar;

package/lib/types/components/calendar/Calendar.styles.d.ts

@@ -0,0 +1,8 @@
+type StyledCalendarProps = {
+    $isDisabled?: boolean;
+};
+export declare const StyledCalendar: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, StyledCalendarProps>> & string;
+export declare const StyledCalendarIconWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const StyledCalendarIconWrapperPseudo: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const StyledPseudoMonthYearPicker: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export {};

package/lib/types/components/calendar/month-wrapper/MonthWrapper.d.ts

@@ -0,0 +1,26 @@
+import { FC } from 'react';
+import { CalendarType, Categories, CustomThumbColors, DateInterval, HighlightedDates } from '../../../types/calendar';
+import { Language } from "chayns-api";
+export type MonthWrapperProps = {
+    locale: Language;
+    highlightedDates?: HighlightedDates[];
+    onSelect: (date: Date) => void;
+    selectedDate?: Date | Date[] | DateInterval;
+    categories?: Categories[];
+    currentDate: Date;
+    direction?: 'left' | 'right';
+    onAnimationFinished: () => void;
+    shouldRenderTwo: boolean;
+    width: number;
+    isDisabled?: boolean;
+    maxDate: Date;
+    minDate: Date;
+    type: CalendarType;
+    disabledDates: Date[];
+    setCurrentDate: (date: Date) => void;
+    shouldShowHighlightsInMonthOverlay: boolean;
+    showMonthYearPickers: boolean;
+    customThumbColors?: CustomThumbColors;
+};
+declare const MonthWrapper: FC<MonthWrapperProps>;
+export default MonthWrapper;

package/lib/types/components/calendar/month-wrapper/MonthWrapper.styles.d.ts

@@ -0,0 +1,274 @@
+import type { WithTheme } from '@chayns-components/core';
+type StyledMonthWrapperProps = WithTheme<{
+    $height: number;
+    $width: number;
+}>;
+export declare const StyledMonthWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, StyledMonthWrapperProps>> & string;
+type StyledMotionWrapperProps = {
+    $isDisabled?: boolean;
+};
+export declare const StyledMotionWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<Omit<{
+    color?: string | undefined;
+    defaultChecked?: boolean | undefined;
+    defaultValue?: string | number | readonly string[] | undefined;
+    suppressContentEditableWarning?: boolean | undefined;
+    suppressHydrationWarning?: boolean | undefined;
+    accessKey?: string | undefined;
+    autoCapitalize?: (string & {}) | "none" | "off" | "on" | "sentences" | "words" | "characters" | undefined;
+    autoFocus?: boolean | undefined;
+    className?: string | undefined;
+    contentEditable?: "inherit" | (boolean | "false" | "true") | "plaintext-only" | undefined;
+    contextMenu?: string | undefined;
+    dir?: string | undefined;
+    draggable?: (boolean | "false" | "true") | undefined;
+    enterKeyHint?: "search" | "next" | "enter" | "done" | "go" | "previous" | "send" | undefined;
+    hidden?: boolean | undefined;
+    id?: string | undefined;
+    lang?: string | undefined;
+    nonce?: string | undefined;
+    slot?: string | undefined;
+    spellCheck?: (boolean | "false" | "true") | undefined;
+    tabIndex?: number | undefined;
+    title?: string | undefined;
+    translate?: "yes" | "no" | undefined;
+    radioGroup?: string | undefined;
+    role?: import("react").AriaRole | undefined;
+    about?: string | undefined;
+    content?: string | undefined;
+    datatype?: string | undefined;
+    inlist?: any;
+    prefix?: string | undefined;
+    property?: string | undefined;
+    rel?: string | undefined;
+    resource?: string | undefined;
+    rev?: string | undefined;
+    typeof?: string | undefined;
+    vocab?: string | undefined;
+    autoCorrect?: string | undefined;
+    autoSave?: string | undefined;
+    itemProp?: string | undefined;
+    itemScope?: boolean | undefined;
+    itemType?: string | undefined;
+    itemID?: string | undefined;
+    itemRef?: string | undefined;
+    results?: number | undefined;
+    security?: string | undefined;
+    unselectable?: "off" | "on" | undefined;
+    inputMode?: "numeric" | "none" | "search" | "text" | "tel" | "url" | "email" | "decimal" | undefined;
+    is?: string | undefined;
+    "aria-activedescendant"?: string | undefined;
+    "aria-atomic"?: (boolean | "false" | "true") | undefined;
+    "aria-autocomplete"?: "none" | "list" | "both" | "inline" | undefined;
+    "aria-braillelabel"?: string | undefined;
+    "aria-brailleroledescription"?: string | undefined;
+    "aria-busy"?: (boolean | "false" | "true") | undefined;
+    "aria-checked"?: boolean | "mixed" | "false" | "true" | undefined;
+    "aria-colcount"?: number | undefined;
+    "aria-colindex"?: number | undefined;
+    "aria-colindextext"?: string | undefined;
+    "aria-colspan"?: number | undefined;
+    "aria-controls"?: string | undefined;
+    "aria-current"?: boolean | "time" | "step" | "page" | "false" | "true" | "date" | "location" | undefined;
+    "aria-describedby"?: string | undefined;
+    "aria-description"?: string | undefined;
+    "aria-details"?: string | undefined;
+    "aria-disabled"?: (boolean | "false" | "true") | undefined;
+    "aria-dropeffect"?: "none" | "link" | "copy" | "move" | "execute" | "popup" | undefined;
+    "aria-errormessage"?: string | undefined;
+    "aria-expanded"?: (boolean | "false" | "true") | undefined;
+    "aria-flowto"?: string | undefined;
+    "aria-grabbed"?: (boolean | "false" | "true") | undefined;
+    "aria-haspopup"?: boolean | "dialog" | "menu" | "listbox" | "grid" | "false" | "true" | "tree" | undefined;
+    "aria-hidden"?: (boolean | "false" | "true") | undefined;
+    "aria-invalid"?: boolean | "false" | "true" | "grammar" | "spelling" | undefined;
+    "aria-keyshortcuts"?: string | undefined;
+    "aria-label"?: string | undefined;
+    "aria-labelledby"?: string | undefined;
+    "aria-level"?: number | undefined;
+    "aria-live"?: "off" | "assertive" | "polite" | undefined;
+    "aria-modal"?: (boolean | "false" | "true") | undefined;
+    "aria-multiline"?: (boolean | "false" | "true") | undefined;
+    "aria-multiselectable"?: (boolean | "false" | "true") | undefined;
+    "aria-orientation"?: "horizontal" | "vertical" | undefined;
+    "aria-owns"?: string | undefined;
+    "aria-placeholder"?: string | undefined;
+    "aria-posinset"?: number | undefined;
+    "aria-pressed"?: boolean | "mixed" | "false" | "true" | undefined;
+    "aria-readonly"?: (boolean | "false" | "true") | undefined;
+    "aria-relevant"?: "text" | "all" | "additions" | "additions removals" | "additions text" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals" | undefined;
+    "aria-required"?: (boolean | "false" | "true") | undefined;
+    "aria-roledescription"?: string | undefined;
+    "aria-rowcount"?: number | undefined;
+    "aria-rowindex"?: number | undefined;
+    "aria-rowindextext"?: string | undefined;
+    "aria-rowspan"?: number | undefined;
+    "aria-selected"?: (boolean | "false" | "true") | undefined;
+    "aria-setsize"?: number | undefined;
+    "aria-sort"?: "none" | "ascending" | "descending" | "other" | undefined;
+    "aria-valuemax"?: number | undefined;
+    "aria-valuemin"?: number | undefined;
+    "aria-valuenow"?: number | undefined;
+    "aria-valuetext"?: string | undefined;
+    dangerouslySetInnerHTML?: {
+        __html: string | TrustedHTML;
+    } | undefined;
+    onCopy?: import("react").ClipboardEventHandler<HTMLDivElement> | undefined;
+    onCopyCapture?: import("react").ClipboardEventHandler<HTMLDivElement> | undefined;
+    onCut?: import("react").ClipboardEventHandler<HTMLDivElement> | undefined;
+    onCutCapture?: import("react").ClipboardEventHandler<HTMLDivElement> | undefined;
+    onPaste?: import("react").ClipboardEventHandler<HTMLDivElement> | undefined;
+    onPasteCapture?: import("react").ClipboardEventHandler<HTMLDivElement> | undefined;
+    onCompositionEnd?: import("react").CompositionEventHandler<HTMLDivElement> | undefined;
+    onCompositionEndCapture?: import("react").CompositionEventHandler<HTMLDivElement> | undefined;
+    onCompositionStart?: import("react").CompositionEventHandler<HTMLDivElement> | undefined;
+    onCompositionStartCapture?: import("react").CompositionEventHandler<HTMLDivElement> | undefined;
+    onCompositionUpdate?: import("react").CompositionEventHandler<HTMLDivElement> | undefined;
+    onCompositionUpdateCapture?: import("react").CompositionEventHandler<HTMLDivElement> | undefined;
+    onFocus?: import("react").FocusEventHandler<HTMLDivElement> | undefined;
+    onFocusCapture?: import("react").FocusEventHandler<HTMLDivElement> | undefined;
+    onBlur?: import("react").FocusEventHandler<HTMLDivElement> | undefined;
+    onBlurCapture?: import("react").FocusEventHandler<HTMLDivElement> | undefined;
+    onChange?: import("react").FormEventHandler<HTMLDivElement> | undefined;
+    onChangeCapture?: import("react").FormEventHandler<HTMLDivElement> | undefined;
+    onBeforeInput?: import("react").FormEventHandler<HTMLDivElement> | undefined;
+    onBeforeInputCapture?: import("react").FormEventHandler<HTMLDivElement> | undefined;
+    onInput?: import("react").FormEventHandler<HTMLDivElement> | undefined;
+    onInputCapture?: import("react").FormEventHandler<HTMLDivElement> | undefined;
+    onReset?: import("react").FormEventHandler<HTMLDivElement> | undefined;
+    onResetCapture?: import("react").FormEventHandler<HTMLDivElement> | undefined;
+    onSubmit?: import("react").FormEventHandler<HTMLDivElement> | undefined;
+    onSubmitCapture?: import("react").FormEventHandler<HTMLDivElement> | undefined;
+    onInvalid?: import("react").FormEventHandler<HTMLDivElement> | undefined;
+    onInvalidCapture?: import("react").FormEventHandler<HTMLDivElement> | undefined;
+    onLoad?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onLoadCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onError?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onErrorCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onKeyDown?: import("react").KeyboardEventHandler<HTMLDivElement> | undefined;
+    onKeyDownCapture?: import("react").KeyboardEventHandler<HTMLDivElement> | undefined;
+    onKeyPress?: import("react").KeyboardEventHandler<HTMLDivElement> | undefined;
+    onKeyPressCapture?: import("react").KeyboardEventHandler<HTMLDivElement> | undefined;
+    onKeyUp?: import("react").KeyboardEventHandler<HTMLDivElement> | undefined;
+    onKeyUpCapture?: import("react").KeyboardEventHandler<HTMLDivElement> | undefined;
+    onAbort?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onAbortCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onCanPlay?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onCanPlayCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onCanPlayThrough?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onCanPlayThroughCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onDurationChange?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onDurationChangeCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onEmptied?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onEmptiedCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onEncrypted?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onEncryptedCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onEnded?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onEndedCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onLoadedData?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onLoadedDataCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onLoadedMetadata?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onLoadedMetadataCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onLoadStart?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onLoadStartCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onPause?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onPauseCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onPlay?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onPlayCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onPlaying?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onPlayingCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onProgress?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onProgressCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onRateChange?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onRateChangeCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onResize?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onResizeCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onSeeked?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onSeekedCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onSeeking?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onSeekingCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onStalled?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onStalledCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onSuspend?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onSuspendCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onTimeUpdate?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onTimeUpdateCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onVolumeChange?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onVolumeChangeCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onWaiting?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onWaitingCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onAuxClick?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
+    onAuxClickCapture?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
+    onClick?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
+    onClickCapture?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
+    onContextMenu?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
+    onContextMenuCapture?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
+    onDoubleClick?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
+    onDoubleClickCapture?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
+    onDragCapture?: import("react").DragEventHandler<HTMLDivElement> | undefined;
+    onDragEndCapture?: import("react").DragEventHandler<HTMLDivElement> | undefined;
+    onDragEnter?: import("react").DragEventHandler<HTMLDivElement> | undefined;
+    onDragEnterCapture?: import("react").DragEventHandler<HTMLDivElement> | undefined;
+    onDragExit?: import("react").DragEventHandler<HTMLDivElement> | undefined;
+    onDragExitCapture?: import("react").DragEventHandler<HTMLDivElement> | undefined;
+    onDragLeave?: import("react").DragEventHandler<HTMLDivElement> | undefined;
+    onDragLeaveCapture?: import("react").DragEventHandler<HTMLDivElement> | undefined;
+    onDragOver?: import("react").DragEventHandler<HTMLDivElement> | undefined;
+    onDragOverCapture?: import("react").DragEventHandler<HTMLDivElement> | undefined;
+    onDragStartCapture?: import("react").DragEventHandler<HTMLDivElement> | undefined;
+    onDrop?: import("react").DragEventHandler<HTMLDivElement> | undefined;
+    onDropCapture?: import("react").DragEventHandler<HTMLDivElement> | undefined;
+    onMouseDown?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
+    onMouseDownCapture?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
+    onMouseEnter?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
+    onMouseLeave?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
+    onMouseMove?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
+    onMouseMoveCapture?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
+    onMouseOut?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
+    onMouseOutCapture?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
+    onMouseOver?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
+    onMouseOverCapture?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
+    onMouseUp?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
+    onMouseUpCapture?: import("react").MouseEventHandler<HTMLDivElement> | undefined;
+    onSelect?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onSelectCapture?: import("react").ReactEventHandler<HTMLDivElement> | undefined;
+    onTouchCancel?: import("react").TouchEventHandler<HTMLDivElement> | undefined;
+    onTouchCancelCapture?: import("react").TouchEventHandler<HTMLDivElement> | undefined;
+    onTouchEnd?: import("react").TouchEventHandler<HTMLDivElement> | undefined;
+    onTouchEndCapture?: import("react").TouchEventHandler<HTMLDivElement> | undefined;
+    onTouchMove?: import("react").TouchEventHandler<HTMLDivElement> | undefined;
+    onTouchMoveCapture?: import("react").TouchEventHandler<HTMLDivElement> | undefined;
+    onTouchStart?: import("react").TouchEventHandler<HTMLDivElement> | undefined;
+    onTouchStartCapture?: import("react").TouchEventHandler<HTMLDivElement> | undefined;
+    onPointerDown?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
+    onPointerDownCapture?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
+    onPointerMove?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
+    onPointerMoveCapture?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
+    onPointerUp?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
+    onPointerUpCapture?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
+    onPointerCancel?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
+    onPointerCancelCapture?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
+    onPointerEnter?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
+    onPointerLeave?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
+    onPointerOver?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
+    onPointerOverCapture?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
+    onPointerOut?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
+    onPointerOutCapture?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
+    onGotPointerCapture?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
+    onGotPointerCaptureCapture?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
+    onLostPointerCapture?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
+    onLostPointerCaptureCapture?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
+    onScroll?: import("react").UIEventHandler<HTMLDivElement> | undefined;
+    onScrollCapture?: import("react").UIEventHandler<HTMLDivElement> | undefined;
+    onWheel?: import("react").WheelEventHandler<HTMLDivElement> | undefined;
+    onWheelCapture?: import("react").WheelEventHandler<HTMLDivElement> | undefined;
+    onAnimationStartCapture?: import("react").AnimationEventHandler<HTMLDivElement> | undefined;
+    onAnimationEnd?: import("react").AnimationEventHandler<HTMLDivElement> | undefined;
+    onAnimationEndCapture?: import("react").AnimationEventHandler<HTMLDivElement> | undefined;
+    onAnimationIteration?: import("react").AnimationEventHandler<HTMLDivElement> | undefined;
+    onAnimationIterationCapture?: import("react").AnimationEventHandler<HTMLDivElement> | undefined;
+    onTransitionEnd?: import("react").TransitionEventHandler<HTMLDivElement> | undefined;
+    onTransitionEndCapture?: import("react").TransitionEventHandler<HTMLDivElement> | undefined;
+} & import("framer-motion").MotionProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & {
+    ref?: ((instance: HTMLDivElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLDivElement> | null | undefined;
+}, StyledMotionWrapperProps>> & string & Omit<import("framer-motion").ForwardRefComponent<HTMLDivElement, import("framer-motion").HTMLMotionProps<"div">>, keyof import("react").Component<any, {}, any>>;
+export {};

package/lib/types/components/calendar/month-wrapper/month/Month.d.ts

@@ -0,0 +1,26 @@
+import { FC } from 'react';
+import { CalendarType, Categories, CustomThumbColors, DateInterval, EMonth, HighlightedDates } from '../../../../types/calendar';
+import { Language } from "chayns-api";
+export type MonthProps = {
+    month: EMonth;
+    year: number;
+    locale: Language;
+    highlightedDates?: HighlightedDates[];
+    onSelect: (date: Date) => void;
+    selectedDate?: Date | Date[] | DateInterval;
+    categories?: Categories[];
+    height: number;
+    minDate: Date;
+    maxDate: Date;
+    type: CalendarType;
+    hoveringDay: Date | null;
+    setHoveringDay: (date: Date | null) => void;
+    disabledDates: Date[];
+    setCurrentDate: (date: Date) => void;
+    displayIndex?: number;
+    shouldShowHighlightsInMonthOverlay: boolean;
+    customThumbColors?: CustomThumbColors;
+    showMonthYearPickers: boolean;
+};
+declare const Month: FC<MonthProps>;
+export default Month;

package/lib/types/components/calendar/month-wrapper/month/Month.styles.d.ts

@@ -0,0 +1,8 @@
+import type { WithTheme } from '@chayns-components/core';
+type StyledMonthProps = WithTheme<{
+    $height: number;
+}>;
+export declare const StyledMonth: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, StyledMonthProps>> & string;
+export declare const StyledMonthHead: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const StyledMonthName: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export {};

package/lib/types/components/calendar/month-wrapper/month/day-wrapper/DayWrapper.d.ts

@@ -0,0 +1,20 @@
+import { FC } from 'react';
+import { CalendarType, type Categories, CustomThumbColors, type DateInterval, type EMonth, type HighlightedDates } from '../../../../../types/calendar';
+export type DayWrapperProps = {
+    month: EMonth;
+    year: number;
+    highlightedDates?: HighlightedDates[];
+    onSelect: (date: Date) => void;
+    selectedDate?: Date | Date[] | DateInterval;
+    categories?: Categories[];
+    minDate: Date;
+    maxDate: Date;
+    type: CalendarType;
+    hoveringDay: Date | null;
+    setHoveringDay: (date: Date | null) => void;
+    disabledDates: Date[];
+    customThumbColors?: CustomThumbColors;
+    shouldShowHighlightsInMonthOverlay: boolean;
+};
+declare const DayWrapper: FC<DayWrapperProps>;
+export default DayWrapper;

package/lib/types/components/calendar/month-wrapper/month/day-wrapper/DayWrapper.styles.d.ts

@@ -0,0 +1 @@
+export declare const StyledDayWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;

package/lib/types/components/calendar/month-wrapper/month/day-wrapper/day/Day.d.ts

@@ -0,0 +1,19 @@
+import { FC } from 'react';
+import { Categories, CustomThumbColors, HighlightedDates } from '../../../../../../types/calendar';
+export type DayProps = {
+    date: Date;
+    isSameMonth: boolean;
+    isSelected: boolean;
+    onClick: (date: Date, shouldFireEvent: boolean) => void;
+    highlightedDates?: HighlightedDates[];
+    categories?: Categories[];
+    isDisabled: boolean;
+    isIntervalStart: boolean;
+    isIntervalEnd: boolean;
+    isWithinIntervalSelection: boolean;
+    setHoveringDay: (date: Date | null) => void;
+    shouldShowHighlightsInMonthOverlay: boolean;
+    customThumbColors?: CustomThumbColors;
+};
+declare const Day: FC<DayProps>;
+export default Day;