@drivy/cobalt 1.0.3 → 1.1.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/components/Calendar/CalendarRangePicker/CalendarRangePicker.js +2 -2
- package/components/Calendar/CalendarRangePicker/CalendarRangePicker.js.map +1 -1
- package/components/Calendar/CalendarRangePicker/CalendarRangePickerDay.js +4 -2
- package/components/Calendar/CalendarRangePicker/CalendarRangePickerDay.js.map +1 -1
- package/components/Calendar/CalendarRangePicker/CalendarRangePickerMonth.js +10 -9
- package/components/Calendar/CalendarRangePicker/CalendarRangePickerMonth.js.map +1 -1
- package/components/Calendar/CalendarRangePicker/DayTooltip.js +15 -15
- package/components/Calendar/CalendarRangePicker/DayTooltip.js.map +1 -1
- package/components/Form/Autocomplete/index.js +0 -3
- package/components/Form/Autocomplete/index.js.map +1 -1
- package/components/Form/Slider.js +1 -0
- package/components/Form/Slider.js.map +1 -1
- package/package.json +1 -1
- package/styles/components/Form/Autocomplete/index.scss +4 -0
- package/types/src/components/Calendar/CalendarRangePicker/CalendarRangePicker.d.ts +2 -1
- package/types/src/components/Calendar/CalendarRangePicker/CalendarRangePickerDay.d.ts +2 -1
- package/types/src/components/Calendar/CalendarRangePicker/CalendarRangePickerMonth.d.ts +2 -1
- package/types/src/components/Calendar/CalendarRangePicker/DayTooltip.d.ts +1 -18
- package/utils/getCobaltTailwindcssConfig.js.map +1 -1
|
@@ -5,7 +5,7 @@ import { Hint } from '../../Form/Hint.js';
|
|
|
5
5
|
import addMonths from 'date-fns/addMonths';
|
|
6
6
|
import startOfDay from 'date-fns/startOfDay';
|
|
7
7
|
|
|
8
|
-
function CalendarRangePicker({ rangeConstraints, firstMonthDate = new Date(), numberOfMonths = 1, hint, firstAvailableDate = new Date(), lastAvailableDate, isEditingStartDate, isEditingEndDate, startDate, endDate, onChangeDate, onLeaveDate, onSelectDate, isDayDisabledFn, hasDayNotificationFn, isDayInvalidForSelectionFn, isSundayFirstDayOfWeek, locale, }) {
|
|
8
|
+
function CalendarRangePicker({ rangeConstraints, firstMonthDate = new Date(), numberOfMonths = 1, hint, firstAvailableDate = new Date(), lastAvailableDate, isEditingStartDate, isEditingEndDate, startDate, endDate, onChangeDate, onLeaveDate, onSelectDate, isDayDisabledFn, hasDayNotificationFn, isDayInvalidForSelectionFn, dayHoverTooltipFn, isSundayFirstDayOfWeek, locale, }) {
|
|
9
9
|
const isFirstRender = useRef(true);
|
|
10
10
|
firstMonthDate.setHours(0, 0, 0, 0);
|
|
11
11
|
firstAvailableDate.setHours(0, 0, 0, 0);
|
|
@@ -58,7 +58,7 @@ function CalendarRangePicker({ rangeConstraints, firstMonthDate = new Date(), nu
|
|
|
58
58
|
return (React.createElement("div", { className: cx("cobalt-CalendarRangePicker", {
|
|
59
59
|
"cobalt-CalendarRangePicker--isEditing": isEditingStartDate || isEditingEndDate,
|
|
60
60
|
}) },
|
|
61
|
-
React.createElement("div", { className: "cobalt-CalendarRangePicker__months-container" }, months.map((monthDate) => (React.createElement(CalendarRangePickerMonth, { key: monthDate.getTime(), date: monthDate, startDate: rangeDates.startDate, endDate: rangeDates.endDate, onSelectDate: handleSelectDate, onChangeDate: handleChangeDate, onLeaveDate: onLeaveDate, isEditingStartDate: isEditingStartDate, isEditingEndDate: isEditingEndDate, rangeConstraints: rangeConstraints, firstAvailableDate: firstAvailableDate, lastAvailableDate: lastAvailableDate, isDayDisabledFn: isDayDisabledFn, hasDayNotificationFn: hasDayNotificationFn, isDayInvalidForSelectionFn: isDayInvalidForSelectionFn, isSundayFirstDayOfWeek: isSundayFirstDayOfWeek, locale: locale })))),
|
|
61
|
+
React.createElement("div", { className: "cobalt-CalendarRangePicker__months-container" }, months.map((monthDate) => (React.createElement(CalendarRangePickerMonth, { key: monthDate.getTime(), date: monthDate, startDate: rangeDates.startDate, endDate: rangeDates.endDate, onSelectDate: handleSelectDate, onChangeDate: handleChangeDate, onLeaveDate: onLeaveDate, isEditingStartDate: isEditingStartDate, isEditingEndDate: isEditingEndDate, rangeConstraints: rangeConstraints, firstAvailableDate: firstAvailableDate, lastAvailableDate: lastAvailableDate, isDayDisabledFn: isDayDisabledFn, hasDayNotificationFn: hasDayNotificationFn, isDayInvalidForSelectionFn: isDayInvalidForSelectionFn, isSundayFirstDayOfWeek: isSundayFirstDayOfWeek, dayHoverTooltipFn: dayHoverTooltipFn, locale: locale })))),
|
|
62
62
|
React.createElement("div", { className: cx("cobalt-CalendarRangePicker__message", {
|
|
63
63
|
"cobalt-CalendarRangePicker__message--show": !!hint,
|
|
64
64
|
}) }, hint && React.createElement(Hint, { status: hint.status }, hint.html))));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CalendarRangePicker.js","sources":["../../../../src/components/Calendar/CalendarRangePicker/CalendarRangePicker.tsx"],"sourcesContent":["import React, { useState, useEffect, useRef } from \"react\"\nimport { CalendarRangePickerMonth } from \"./CalendarRangePickerMonth\"\nimport classNames from \"classnames\"\nimport { Hint } from \"../../Form/Hint\"\nimport addMonths from \"date-fns/addMonths\"\nimport { FormElementStatus } from \"../../Form/form\"\nimport startOfDay from \"date-fns/startOfDay\"\nimport cx from \"classnames\"\n\nexport interface RangeConstraintInterface {\n value: number\n message: string\n}\n\nexport interface RangeConstraintsInterface {\n min?: RangeConstraintInterface\n max?: RangeConstraintInterface\n}\n\nexport interface DayStatusInterface {\n isRangeExceeded?: boolean\n isRangeTooShort?: boolean\n isCustomInvalid?: boolean\n isDisabled?: boolean\n}\n\nexport type CalendarRangePickerPropsType = {\n numberOfMonths?: number\n firstMonthDate?: Date\n rangeConstraints?: RangeConstraintsInterface\n firstAvailableDate?: Date\n lastAvailableDate?: Date\n isEditingStartDate: boolean\n isEditingEndDate: boolean\n startDate: Date | undefined\n endDate: Date | undefined\n isDayDisabledFn?: (day: Date) => boolean\n hasDayNotificationFn?: (day: Date) => boolean\n isDayInvalidForSelectionFn?: (day: Date) => boolean\n isSundayFirstDayOfWeek?: boolean\n hint?: {\n status?: FormElementStatus\n html: string\n }\n onChangeDate?: (date: Date, status: DayStatusInterface) => boolean\n onLeaveDate?: (date: Date) => void\n onSelectDate?: (date: Date, isOutOfRange: boolean) => void\n locale?: Record<string, unknown>\n}\n\nexport function CalendarRangePicker({\n rangeConstraints,\n firstMonthDate = new Date(),\n numberOfMonths = 1,\n hint,\n firstAvailableDate = new Date(),\n lastAvailableDate,\n isEditingStartDate,\n isEditingEndDate,\n startDate,\n endDate,\n onChangeDate,\n onLeaveDate,\n onSelectDate,\n isDayDisabledFn,\n hasDayNotificationFn,\n isDayInvalidForSelectionFn,\n isSundayFirstDayOfWeek,\n locale,\n}: CalendarRangePickerPropsType) {\n const isFirstRender = useRef(true)\n\n firstMonthDate.setHours(0, 0, 0, 0)\n firstAvailableDate.setHours(0, 0, 0, 0)\n\n const [rangeDates, setRangeDates] = useState({\n startDate: startDate ? startOfDay(startDate) : undefined,\n endDate: endDate ? startOfDay(endDate) : undefined,\n })\n\n useEffect(() => {\n if (isFirstRender.current) {\n isFirstRender.current = false\n return\n }\n setRangeDates({\n startDate: startDate ? startOfDay(startDate) : undefined,\n endDate: endDate ? startOfDay(endDate) : undefined,\n })\n }, [startDate, endDate])\n\n useEffect(() => {\n if (rangeDates.startDate && !rangeDates.endDate) {\n setRangeDates({ ...rangeDates, endDate: rangeDates.startDate })\n }\n }, [isEditingEndDate])\n\n useEffect(() => {\n if (rangeDates.endDate && !rangeDates.startDate) {\n setRangeDates({ ...rangeDates, startDate: rangeDates.endDate })\n }\n }, [isEditingStartDate])\n\n const handleSelectDate = (date: Date, isDateOutOfRange?: boolean) => {\n if (isDateOutOfRange && isEditingEndDate) return\n\n onSelectDate && onSelectDate(date, !!isDateOutOfRange)\n }\n\n const handleChangeDate = (date: Date, status: DayStatusInterface) => {\n const processChange =\n onChangeDate && (isEditingStartDate || isEditingEndDate)\n ? onChangeDate(date, status) !== false\n : true\n\n if (!processChange || status.isDisabled) return\n\n if (isEditingStartDate) {\n setRangeDates((prev) => ({ ...prev, startDate: date }))\n } else if (isEditingEndDate) {\n setRangeDates((prev) => ({ ...prev, endDate: date }))\n }\n }\n\n const months = [firstMonthDate]\n for (let i = 0; i < numberOfMonths - 1; i++) {\n months.push(addMonths(months[months.length - 1], 1))\n }\n\n return (\n <div\n className={cx(\"cobalt-CalendarRangePicker\", {\n \"cobalt-CalendarRangePicker--isEditing\":\n isEditingStartDate || isEditingEndDate,\n })}\n >\n <div className=\"cobalt-CalendarRangePicker__months-container\">\n {months.map((monthDate) => (\n <CalendarRangePickerMonth\n key={monthDate.getTime()}\n date={monthDate}\n startDate={rangeDates.startDate}\n endDate={rangeDates.endDate}\n onSelectDate={handleSelectDate}\n onChangeDate={handleChangeDate}\n onLeaveDate={onLeaveDate}\n isEditingStartDate={isEditingStartDate}\n isEditingEndDate={isEditingEndDate}\n rangeConstraints={rangeConstraints}\n firstAvailableDate={firstAvailableDate}\n lastAvailableDate={lastAvailableDate}\n isDayDisabledFn={isDayDisabledFn}\n hasDayNotificationFn={hasDayNotificationFn}\n isDayInvalidForSelectionFn={isDayInvalidForSelectionFn}\n isSundayFirstDayOfWeek={isSundayFirstDayOfWeek}\n locale={locale}\n />\n ))}\n </div>\n\n <div\n className={classNames(\"cobalt-CalendarRangePicker__message\", {\n \"cobalt-CalendarRangePicker__message--show\": !!hint,\n })}\n >\n {hint && <Hint status={hint.status}>{hint.html}</Hint>}\n </div>\n </div>\n )\n}\n"],"names":["classNames"],"mappings":";;;;;;;
|
|
1
|
+
{"version":3,"file":"CalendarRangePicker.js","sources":["../../../../src/components/Calendar/CalendarRangePicker/CalendarRangePicker.tsx"],"sourcesContent":["import React, { useState, useEffect, useRef } from \"react\"\nimport { CalendarRangePickerMonth } from \"./CalendarRangePickerMonth\"\nimport classNames from \"classnames\"\nimport { Hint } from \"../../Form/Hint\"\nimport addMonths from \"date-fns/addMonths\"\nimport { FormElementStatus } from \"../../Form/form\"\nimport startOfDay from \"date-fns/startOfDay\"\nimport cx from \"classnames\"\n\nexport interface RangeConstraintInterface {\n value: number\n message: string\n}\n\nexport interface RangeConstraintsInterface {\n min?: RangeConstraintInterface\n max?: RangeConstraintInterface\n}\n\nexport interface DayStatusInterface {\n isRangeExceeded?: boolean\n isRangeTooShort?: boolean\n isCustomInvalid?: boolean\n isDisabled?: boolean\n}\n\nexport type CalendarRangePickerPropsType = {\n numberOfMonths?: number\n firstMonthDate?: Date\n rangeConstraints?: RangeConstraintsInterface\n firstAvailableDate?: Date\n lastAvailableDate?: Date\n isEditingStartDate: boolean\n isEditingEndDate: boolean\n startDate: Date | undefined\n endDate: Date | undefined\n isDayDisabledFn?: (day: Date) => boolean\n hasDayNotificationFn?: (day: Date) => boolean\n isDayInvalidForSelectionFn?: (day: Date) => boolean\n dayHoverTooltipFn?: (day: Date) => string | undefined\n isSundayFirstDayOfWeek?: boolean\n hint?: {\n status?: FormElementStatus\n html: string\n }\n onChangeDate?: (date: Date, status: DayStatusInterface) => boolean\n onLeaveDate?: (date: Date) => void\n onSelectDate?: (date: Date, isOutOfRange: boolean) => void\n locale?: Record<string, unknown>\n}\n\nexport function CalendarRangePicker({\n rangeConstraints,\n firstMonthDate = new Date(),\n numberOfMonths = 1,\n hint,\n firstAvailableDate = new Date(),\n lastAvailableDate,\n isEditingStartDate,\n isEditingEndDate,\n startDate,\n endDate,\n onChangeDate,\n onLeaveDate,\n onSelectDate,\n isDayDisabledFn,\n hasDayNotificationFn,\n isDayInvalidForSelectionFn,\n dayHoverTooltipFn,\n isSundayFirstDayOfWeek,\n locale,\n}: CalendarRangePickerPropsType) {\n const isFirstRender = useRef(true)\n\n firstMonthDate.setHours(0, 0, 0, 0)\n firstAvailableDate.setHours(0, 0, 0, 0)\n\n const [rangeDates, setRangeDates] = useState({\n startDate: startDate ? startOfDay(startDate) : undefined,\n endDate: endDate ? startOfDay(endDate) : undefined,\n })\n\n useEffect(() => {\n if (isFirstRender.current) {\n isFirstRender.current = false\n return\n }\n setRangeDates({\n startDate: startDate ? startOfDay(startDate) : undefined,\n endDate: endDate ? startOfDay(endDate) : undefined,\n })\n }, [startDate, endDate])\n\n useEffect(() => {\n if (rangeDates.startDate && !rangeDates.endDate) {\n setRangeDates({ ...rangeDates, endDate: rangeDates.startDate })\n }\n }, [isEditingEndDate])\n\n useEffect(() => {\n if (rangeDates.endDate && !rangeDates.startDate) {\n setRangeDates({ ...rangeDates, startDate: rangeDates.endDate })\n }\n }, [isEditingStartDate])\n\n const handleSelectDate = (date: Date, isDateOutOfRange?: boolean) => {\n if (isDateOutOfRange && isEditingEndDate) return\n\n onSelectDate && onSelectDate(date, !!isDateOutOfRange)\n }\n\n const handleChangeDate = (date: Date, status: DayStatusInterface) => {\n const processChange =\n onChangeDate && (isEditingStartDate || isEditingEndDate)\n ? onChangeDate(date, status) !== false\n : true\n\n if (!processChange || status.isDisabled) return\n\n if (isEditingStartDate) {\n setRangeDates((prev) => ({ ...prev, startDate: date }))\n } else if (isEditingEndDate) {\n setRangeDates((prev) => ({ ...prev, endDate: date }))\n }\n }\n\n const months = [firstMonthDate]\n for (let i = 0; i < numberOfMonths - 1; i++) {\n months.push(addMonths(months[months.length - 1], 1))\n }\n\n return (\n <div\n className={cx(\"cobalt-CalendarRangePicker\", {\n \"cobalt-CalendarRangePicker--isEditing\":\n isEditingStartDate || isEditingEndDate,\n })}\n >\n <div className=\"cobalt-CalendarRangePicker__months-container\">\n {months.map((monthDate) => (\n <CalendarRangePickerMonth\n key={monthDate.getTime()}\n date={monthDate}\n startDate={rangeDates.startDate}\n endDate={rangeDates.endDate}\n onSelectDate={handleSelectDate}\n onChangeDate={handleChangeDate}\n onLeaveDate={onLeaveDate}\n isEditingStartDate={isEditingStartDate}\n isEditingEndDate={isEditingEndDate}\n rangeConstraints={rangeConstraints}\n firstAvailableDate={firstAvailableDate}\n lastAvailableDate={lastAvailableDate}\n isDayDisabledFn={isDayDisabledFn}\n hasDayNotificationFn={hasDayNotificationFn}\n isDayInvalidForSelectionFn={isDayInvalidForSelectionFn}\n isSundayFirstDayOfWeek={isSundayFirstDayOfWeek}\n dayHoverTooltipFn={dayHoverTooltipFn}\n locale={locale}\n />\n ))}\n </div>\n\n <div\n className={classNames(\"cobalt-CalendarRangePicker__message\", {\n \"cobalt-CalendarRangePicker__message--show\": !!hint,\n })}\n >\n {hint && <Hint status={hint.status}>{hint.html}</Hint>}\n </div>\n </div>\n )\n}\n"],"names":["classNames"],"mappings":"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"}
|
|
@@ -3,7 +3,7 @@ import cx from 'classnames';
|
|
|
3
3
|
import { format } from 'date-fns';
|
|
4
4
|
import DayTooltip from './DayTooltip.js';
|
|
5
5
|
|
|
6
|
-
function CalendarRangePickerDay({ date, isToday, isStartDay, isEndDay, isSelected, isDisabled, isInvalid, isRange, isActive, hasNotification, tooltipMessage, onSelect, onMouseEnter, onMouseLeave, }) {
|
|
6
|
+
function CalendarRangePickerDay({ date, isToday, isStartDay, isEndDay, isSelected, isDisabled, isInvalid, isRange, isActive, hasNotification, tooltipMessage, onSelect, onMouseEnter, onMouseLeave, hoverTooltipMessage, }) {
|
|
7
7
|
const handleSelectDate = () => {
|
|
8
8
|
!isDisabled && !isInvalid && onSelect(new Date(date));
|
|
9
9
|
};
|
|
@@ -24,7 +24,9 @@ function CalendarRangePickerDay({ date, isToday, isStartDay, isEndDay, isSelecte
|
|
|
24
24
|
date.getDate(),
|
|
25
25
|
hasNotification && (React.createElement("div", { className: "cobalt-CalendarRangePicker__day-notification-container" },
|
|
26
26
|
React.createElement("div", { className: "cobalt-CalendarRangePicker__day-notification" })))));
|
|
27
|
-
|
|
27
|
+
if (tooltipMessage)
|
|
28
|
+
return (React.createElement(DayTooltip, { visible: true, content: React.createElement("div", { className: "c-text-body-sm" }, tooltipMessage), placement: isStartDay ? "top" : "bottom" }, jsx));
|
|
29
|
+
return hoverTooltipMessage ? (React.createElement(DayTooltip, { trigger: "mouseenter", content: React.createElement("div", { className: "c-text-body-sm" }, hoverTooltipMessage), placement: "top", interactive: false }, jsx)) : (jsx);
|
|
28
30
|
}
|
|
29
31
|
function areEqual(prevProps, nextProps) {
|
|
30
32
|
return (prevProps.isSelected === nextProps.isSelected &&
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CalendarRangePickerDay.js","sources":["../../../../src/components/Calendar/CalendarRangePicker/CalendarRangePickerDay.tsx"],"sourcesContent":["import React from \"react\"\nimport classNames from \"classnames\"\nimport { format } from \"date-fns\"\nimport DayTooltip from \"./DayTooltip\"\n\ntype CalendarRangePickerDayPropsType = {\n date: Date\n isEditingStartDate: boolean\n isEditingEndDate: boolean\n isToday?: boolean\n isStartDay?: boolean\n isEndDay?: boolean\n isSelected?: boolean\n isInvalid?: boolean\n isDisabled?: boolean\n isRange?: boolean\n isActive?: boolean\n hasNotification?: boolean\n tooltipMessage?: string\n onSelect: (date: Date) => void\n onMouseEnter: (date: Date, disabled: boolean) => void\n onMouseLeave?: (date: Date) => void\n}\n\nfunction CalendarRangePickerDay({\n date,\n isToday,\n isStartDay,\n isEndDay,\n isSelected,\n isDisabled,\n isInvalid,\n isRange,\n isActive,\n hasNotification,\n tooltipMessage,\n onSelect,\n onMouseEnter,\n onMouseLeave,\n}: CalendarRangePickerDayPropsType) {\n const handleSelectDate = () => {\n !isDisabled && !isInvalid && onSelect(new Date(date))\n }\n\n const jsx = (\n <div\n className={classNames(\"cobalt-CalendarRangePicker__day\", {\n \"cobalt-CalendarRangePicker__day--today\": isToday,\n \"cobalt-CalendarRangePicker__day--startDay\": isStartDay,\n \"cobalt-CalendarRangePicker__day--endDay\": isEndDay,\n \"cobalt-CalendarRangePicker__day--range\": isRange,\n \"cobalt-CalendarRangePicker__day--selected\": isSelected,\n \"cobalt-CalendarRangePicker__day--active\": isActive,\n \"cobalt-CalendarRangePicker__day--invalid\": isInvalid,\n \"cobalt-CalendarRangePicker__day--disabled\": isDisabled,\n })}\n onMouseEnter={() => {\n onMouseEnter(date, !!isDisabled)\n }}\n onMouseLeave={() => {\n onMouseLeave && onMouseLeave(date)\n }}\n onClick={handleSelectDate}\n data-day={format(date, \"yyyy-MM-dd\")}\n >\n {date.getDate()}\n {hasNotification && (\n <div className=\"cobalt-CalendarRangePicker__day-notification-container\">\n <div className=\"cobalt-CalendarRangePicker__day-notification\"></div>\n </div>\n )}\n </div>\n )\n\n
|
|
1
|
+
{"version":3,"file":"CalendarRangePickerDay.js","sources":["../../../../src/components/Calendar/CalendarRangePicker/CalendarRangePickerDay.tsx"],"sourcesContent":["import React from \"react\"\nimport classNames from \"classnames\"\nimport { format } from \"date-fns\"\nimport DayTooltip from \"./DayTooltip\"\n\ntype CalendarRangePickerDayPropsType = {\n date: Date\n isEditingStartDate: boolean\n isEditingEndDate: boolean\n isToday?: boolean\n isStartDay?: boolean\n isEndDay?: boolean\n isSelected?: boolean\n isInvalid?: boolean\n isDisabled?: boolean\n isRange?: boolean\n isActive?: boolean\n hasNotification?: boolean\n tooltipMessage?: string\n hoverTooltipMessage?: string\n onSelect: (date: Date) => void\n onMouseEnter: (date: Date, disabled: boolean) => void\n onMouseLeave?: (date: Date) => void\n}\n\nfunction CalendarRangePickerDay({\n date,\n isToday,\n isStartDay,\n isEndDay,\n isSelected,\n isDisabled,\n isInvalid,\n isRange,\n isActive,\n hasNotification,\n tooltipMessage,\n onSelect,\n onMouseEnter,\n onMouseLeave,\n hoverTooltipMessage,\n}: CalendarRangePickerDayPropsType) {\n const handleSelectDate = () => {\n !isDisabled && !isInvalid && onSelect(new Date(date))\n }\n\n const jsx = (\n <div\n className={classNames(\"cobalt-CalendarRangePicker__day\", {\n \"cobalt-CalendarRangePicker__day--today\": isToday,\n \"cobalt-CalendarRangePicker__day--startDay\": isStartDay,\n \"cobalt-CalendarRangePicker__day--endDay\": isEndDay,\n \"cobalt-CalendarRangePicker__day--range\": isRange,\n \"cobalt-CalendarRangePicker__day--selected\": isSelected,\n \"cobalt-CalendarRangePicker__day--active\": isActive,\n \"cobalt-CalendarRangePicker__day--invalid\": isInvalid,\n \"cobalt-CalendarRangePicker__day--disabled\": isDisabled,\n })}\n onMouseEnter={() => {\n onMouseEnter(date, !!isDisabled)\n }}\n onMouseLeave={() => {\n onMouseLeave && onMouseLeave(date)\n }}\n onClick={handleSelectDate}\n data-day={format(date, \"yyyy-MM-dd\")}\n >\n {date.getDate()}\n {hasNotification && (\n <div className=\"cobalt-CalendarRangePicker__day-notification-container\">\n <div className=\"cobalt-CalendarRangePicker__day-notification\"></div>\n </div>\n )}\n </div>\n )\n\n if (tooltipMessage)\n return (\n <DayTooltip\n visible={true}\n content={<div className=\"c-text-body-sm\">{tooltipMessage}</div>}\n placement={isStartDay ? \"top\" : \"bottom\"}\n >\n {jsx}\n </DayTooltip>\n )\n\n return hoverTooltipMessage ? (\n <DayTooltip\n trigger=\"mouseenter\"\n content={<div className=\"c-text-body-sm\">{hoverTooltipMessage}</div>}\n placement=\"top\"\n interactive={false}\n >\n {jsx}\n </DayTooltip>\n ) : (\n jsx\n )\n}\n\nfunction areEqual(\n prevProps: CalendarRangePickerDayPropsType,\n nextProps: CalendarRangePickerDayPropsType\n) {\n return (\n prevProps.isSelected === nextProps.isSelected &&\n prevProps.isActive === nextProps.isActive &&\n prevProps.isStartDay === nextProps.isStartDay &&\n prevProps.isEndDay === nextProps.isEndDay &&\n prevProps.isInvalid === nextProps.isInvalid &&\n prevProps.isRange === nextProps.isRange &&\n prevProps.hasNotification === nextProps.hasNotification &&\n prevProps.isDisabled === nextProps.isDisabled &&\n prevProps.isEditingStartDate === nextProps.isEditingStartDate &&\n prevProps.isEditingEndDate === nextProps.isEditingEndDate\n )\n}\n\nconst MemoizedComponent = React.memo(CalendarRangePickerDay, areEqual)\nMemoizedComponent.displayName = \"CalendarRangePickerDay\"\n\nexport { MemoizedComponent as CalendarRangePickerDay }\n"],"names":["classNames"],"mappings":"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"}
|
|
@@ -92,7 +92,7 @@ function getRangeInDays(range) {
|
|
|
92
92
|
? differenceInCalendarDays(range.endDate, range.startDate) + 1
|
|
93
93
|
: 0;
|
|
94
94
|
}
|
|
95
|
-
function CalendarRangePickerMonth({ date, onSelectDate, onChangeDate, onLeaveDate, startDate, endDate, isEditingStartDate = false, isEditingEndDate = false, firstAvailableDate, lastAvailableDate, isDayDisabledFn, isDayInvalidForSelectionFn, hasDayNotificationFn, rangeConstraints, isSundayFirstDayOfWeek, locale, }) {
|
|
95
|
+
function CalendarRangePickerMonth({ date, onSelectDate, onChangeDate, onLeaveDate, startDate, endDate, isEditingStartDate = false, isEditingEndDate = false, firstAvailableDate, lastAvailableDate, isDayDisabledFn, isDayInvalidForSelectionFn, hasDayNotificationFn, dayHoverTooltipFn, rangeConstraints, isSundayFirstDayOfWeek, locale, }) {
|
|
96
96
|
var _a, _b;
|
|
97
97
|
const byWeeks = useMemo(() => getMonthDaysByWeeks(date, isSundayFirstDayOfWeek), []);
|
|
98
98
|
// we use a state for the selected Date to allow the onSelect event to be memoized then still triggering some logic with updated data thanks to the setter+useEffect dependency mechanism
|
|
@@ -175,6 +175,14 @@ function CalendarRangePickerMonth({ date, onSelectDate, onChangeDate, onLeaveDat
|
|
|
175
175
|
isEditingStartDate,
|
|
176
176
|
isEditingEndDate,
|
|
177
177
|
});
|
|
178
|
+
const tooltip = buildTooltipMessage({
|
|
179
|
+
rangeInDays,
|
|
180
|
+
isEditingStartDate: !!isEditingStartDate,
|
|
181
|
+
isEditingEndDate: !!isEditingEndDate,
|
|
182
|
+
isStartDay,
|
|
183
|
+
isEndDay,
|
|
184
|
+
rangeConstraints,
|
|
185
|
+
});
|
|
178
186
|
return (React.createElement(MemoizedComponent, { key: day.getTime(), date: day, onMouseEnter: onMouseEnter, onMouseLeave: onLeaveDate, onSelect: setSelectedDate, isToday: isSameDay(day, today), isActive: (isEditingStartDate && isStartDay) ||
|
|
179
187
|
(isEditingEndDate && isEndDay), isStartDay: isStartDay, isEndDay: isEndDay, isRange: isRange, isEditingStartDate: isEditingStartDate, isEditingEndDate: isEditingEndDate, isInvalid: isDayInvalid({
|
|
180
188
|
day,
|
|
@@ -189,14 +197,7 @@ function CalendarRangePickerMonth({ date, onSelectDate, onChangeDate, onLeaveDat
|
|
|
189
197
|
isStartDay,
|
|
190
198
|
isEndDay,
|
|
191
199
|
endDate,
|
|
192
|
-
}), hasNotification: hasNotification, isDisabled: disabled, tooltipMessage:
|
|
193
|
-
rangeInDays,
|
|
194
|
-
isEditingStartDate: !!isEditingStartDate,
|
|
195
|
-
isEditingEndDate: !!isEditingEndDate,
|
|
196
|
-
isStartDay,
|
|
197
|
-
isEndDay,
|
|
198
|
-
rangeConstraints,
|
|
199
|
-
}), isSelected: isDaySelected }));
|
|
200
|
+
}), hasNotification: hasNotification, isDisabled: disabled, tooltipMessage: tooltip, hoverTooltipMessage: dayHoverTooltipFn ? dayHoverTooltipFn(day) : undefined, isSelected: isDaySelected }));
|
|
200
201
|
})))))));
|
|
201
202
|
}
|
|
202
203
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CalendarRangePickerMonth.js","sources":["../../../../src/components/Calendar/CalendarRangePicker/CalendarRangePickerMonth.tsx"],"sourcesContent":["import React, { useEffect, useMemo, useState } from \"react\"\nimport { CalendarRangePickerDay } from \"./CalendarRangePickerDay\"\nimport classNames from \"classnames\"\nimport { format, isSameDay, differenceInCalendarDays } from \"date-fns\"\nimport { getMonthDaysByWeeks, getWeekDays } from \"../utils\"\nimport {\n CalendarRangePickerPropsType,\n DayStatusInterface,\n RangeConstraintsInterface,\n} from \"./CalendarRangePicker\"\n\ntype CalendarRangePickerMonthPropsType = {\n date: Date\n startDate?: Date\n endDate?: Date\n onSelectDate: (date: Date, isOutOfRange?: boolean) => void\n onChangeDate: (date: Date, status: DayStatusInterface) => void\n onLeaveDate?: (date: Date) => void\n isEditingStartDate?: boolean\n isEditingEndDate?: boolean\n firstAvailableDate: Date\n lastAvailableDate?: Date\n isDayDisabledFn?: CalendarRangePickerPropsType[\"isDayDisabledFn\"]\n hasDayNotificationFn?: CalendarRangePickerPropsType[\"hasDayNotificationFn\"]\n isDayInvalidForSelectionFn?: CalendarRangePickerPropsType[\"isDayInvalidForSelectionFn\"]\n rangeConstraints?: RangeConstraintsInterface\n isSundayFirstDayOfWeek?: boolean\n locale: any\n}\n\nfunction isDisabled(\n day: Date,\n firstAvailableDate: Date,\n lastAvailableDate: Date | undefined\n) {\n return (\n day.getTime() < firstAvailableDate.getTime() ||\n (lastAvailableDate != null && day.getTime() > lastAvailableDate.getTime())\n )\n}\n\nfunction isInvalidOppositeBound({\n isEditingStartDate,\n isEditingEndDate,\n isStartDay,\n isEndDay,\n startDate,\n endDate,\n}: {\n startDate: Date | undefined\n endDate: Date | undefined\n isEditingStartDate: boolean | undefined\n isEditingEndDate: boolean | undefined\n isStartDay: boolean\n isEndDay: boolean\n}) {\n return (\n startDate != null &&\n endDate != null &&\n startDate > endDate &&\n ((isEditingStartDate && isEndDay) || (isEditingEndDate && isStartDay))\n )\n}\n\nfunction isDayOutOfRange({\n day,\n rangeConstraints,\n startDate,\n}: {\n day: Date\n startDate: Date | undefined\n rangeConstraints: RangeConstraintsInterface | undefined\n}) {\n return (\n rangeConstraints != null &&\n rangeConstraints.max != null &&\n startDate != null &&\n differenceInCalendarDays(day, startDate) >= rangeConstraints.max.value\n )\n}\n\nfunction isDayInvalid({\n day,\n isDaySelected,\n rangeConstraints,\n rangeTooShort,\n rangeExceeded,\n isEditingStartDate,\n isEditingEndDate,\n isStartDay,\n isEndDay,\n isDayInvalidForSelectionFn,\n startDate,\n endDate,\n}: {\n day: Date\n isDaySelected: boolean\n startDate: Date | undefined\n endDate: Date | undefined\n rangeConstraints: RangeConstraintsInterface | undefined\n rangeTooShort: boolean\n rangeExceeded: boolean\n isEditingStartDate: boolean | undefined\n isEditingEndDate: boolean | undefined\n isStartDay: boolean\n isEndDay: boolean\n isDayInvalidForSelectionFn?: CalendarRangePickerPropsType[\"isDayInvalidForSelectionFn\"]\n}) {\n if (!isDaySelected) return false\n\n let isInvalid = false\n if (!isEditingStartDate && !isEditingEndDate) {\n isInvalid = rangeTooShort || rangeExceeded\n } else if (rangeTooShort && (!isStartDay || isEndDay)) {\n isInvalid = true\n } else if (\n isInvalidOppositeBound({\n isEditingStartDate,\n isEditingEndDate,\n isStartDay,\n isEndDay,\n startDate,\n endDate,\n })\n ) {\n isInvalid = true\n } else {\n isInvalid = isDayOutOfRange({\n day,\n rangeConstraints,\n startDate,\n })\n }\n\n if (\n !isInvalid &&\n isDayInvalidForSelectionFn &&\n ((isEditingStartDate && isStartDay) || (isEditingEndDate && isEndDay))\n ) {\n isInvalid = isDayInvalidForSelectionFn(day)\n }\n\n return isInvalid\n}\n\nfunction isSelected({\n day,\n startDate,\n endDate,\n isStartDay,\n isEndDay,\n isOutOfRangeStartDate,\n rangeTooShort,\n isEditingStartDate,\n isEditingEndDate,\n}: {\n day: Date\n startDate: Date | undefined\n endDate: Date | undefined\n isStartDay: boolean\n isEndDay: boolean\n isOutOfRangeStartDate: boolean\n rangeTooShort: boolean\n isEditingStartDate: boolean\n isEditingEndDate: boolean\n}) {\n return !!(\n isStartDay ||\n isEndDay ||\n ((!rangeTooShort || (!isEditingStartDate && !isEditingEndDate)) &&\n !isOutOfRangeStartDate &&\n endDate &&\n day.getTime() <= endDate.getTime() &&\n startDate &&\n day.getTime() > startDate.getTime())\n )\n}\n\nfunction isRangeExceeded(rangeInDays: number, rangeLimit: number | undefined) {\n return rangeLimit != null && rangeInDays > rangeLimit\n}\n\nfunction isRangeTooShort(rangeInDays: number, rangeLimit: number | undefined) {\n return rangeInDays <= 0\n ? false\n : rangeLimit != null && rangeInDays < rangeLimit\n}\n\nfunction buildTooltipMessage({\n rangeInDays,\n isEditingStartDate,\n isStartDay,\n isEditingEndDate,\n isEndDay,\n rangeConstraints,\n}: {\n rangeInDays: number\n isEditingStartDate: boolean\n isStartDay: boolean\n isEditingEndDate: boolean\n isEndDay: boolean\n rangeConstraints?: RangeConstraintsInterface\n}) {\n let tooltipMessage\n if (\n rangeConstraints &&\n rangeInDays >= 0 &&\n ((isEditingStartDate && isStartDay) || (isEditingEndDate && isEndDay))\n ) {\n if (isRangeTooShort(rangeInDays, rangeConstraints.min?.value)) {\n tooltipMessage = rangeConstraints?.min?.message\n } else if (isRangeExceeded(rangeInDays, rangeConstraints.max?.value)) {\n tooltipMessage = rangeConstraints?.max?.message\n }\n }\n\n return tooltipMessage\n}\n\nfunction getRangeInDays(range: {\n startDate: Date | undefined\n endDate: Date | undefined\n}) {\n return range.startDate && range.endDate\n ? differenceInCalendarDays(range.endDate, range.startDate) + 1\n : 0\n}\n\nexport function CalendarRangePickerMonth({\n date,\n onSelectDate,\n onChangeDate,\n onLeaveDate,\n startDate,\n endDate,\n isEditingStartDate = false,\n isEditingEndDate = false,\n firstAvailableDate,\n lastAvailableDate,\n isDayDisabledFn,\n isDayInvalidForSelectionFn,\n hasDayNotificationFn,\n rangeConstraints,\n isSundayFirstDayOfWeek,\n locale,\n}: CalendarRangePickerMonthPropsType) {\n const byWeeks = useMemo(\n () => getMonthDaysByWeeks(date, isSundayFirstDayOfWeek),\n []\n )\n\n // we use a state for the selected Date to allow the onSelect event to be memoized then still triggering some logic with updated data thanks to the setter+useEffect dependency mechanism\n const [selectedDate, setSelectedDate] = useState<Date | null>(null)\n\n const today = new Date().setHours(0, 0, 0, 0)\n\n const weekdays: Date[] = useMemo(\n () => getWeekDays(isSundayFirstDayOfWeek),\n []\n )\n\n const rangeInDays = getRangeInDays({ startDate, endDate })\n\n const rangeExceeded = isRangeExceeded(\n rangeInDays,\n rangeConstraints?.max?.value\n )\n\n const rangeTooShort = isRangeTooShort(\n rangeInDays,\n rangeConstraints?.min?.value\n )\n\n const isOutOfRangeStartDate = isEditingStartDate && rangeExceeded\n\n const onMouseEnter = (day: Date, disabled: boolean) => {\n const status: DayStatusInterface = {}\n\n if (disabled) {\n status.isDisabled = true\n }\n\n if (!disabled) {\n const currentRange = isEditingStartDate\n ? { startDate: day, endDate: endDate! }\n : { startDate: startDate!, endDate: day }\n\n const currentRangeInDays = getRangeInDays({\n startDate: currentRange.startDate,\n endDate: currentRange.endDate,\n })\n\n const currentRangeExceeded = isRangeExceeded(\n currentRangeInDays,\n rangeConstraints?.max?.value\n )\n\n if (currentRangeExceeded) {\n status.isRangeExceeded = true\n } else {\n const currentRangeTooShort = isRangeTooShort(\n currentRangeInDays,\n rangeConstraints?.min?.value\n )\n\n if (currentRangeTooShort) {\n status.isRangeTooShort = true\n } else {\n status.isCustomInvalid =\n isDayInvalidForSelectionFn != null &&\n isDayInvalidForSelectionFn(day)\n }\n }\n }\n\n onChangeDate(day, status)\n }\n\n useEffect(() => {\n // on Date selection...\n if (selectedDate) {\n if (isEditingStartDate) {\n onSelectDate(\n selectedDate,\n isRangeExceeded(\n getRangeInDays({ startDate: selectedDate, endDate }),\n rangeConstraints?.max?.value\n )\n )\n } else {\n onSelectDate(\n selectedDate,\n isRangeExceeded(\n getRangeInDays({ startDate, endDate: selectedDate }),\n rangeConstraints?.max?.value\n )\n )\n }\n }\n }, [selectedDate])\n\n return (\n <div\n className={classNames(\"cobalt-CalendarRangePicker__month\", {\n \"cobalt-CalendarRangePicker__month--invalid\":\n rangeExceeded && !isEditingStartDate,\n })}\n data-month={format(date, \"yyyy-MM\")}\n >\n <div className=\"cobalt-CalendarRangePicker__month-header\">\n {format(date, \"MMMM yyyy\", { locale })}\n </div>\n <div className=\"cobalt-CalendarRangePicker__month__weeks-container\">\n <div className=\"cobalt-CalendarRangePicker__month__week-header\">\n {weekdays.map((weekday) => (\n <div\n key={weekday.getTime()}\n className=\"cobalt-CalendarRangePicker__month__day-header\"\n >\n {format(weekday, \"iiiiii\", { locale })}\n </div>\n ))}\n </div>\n {byWeeks.map((week, index) => (\n <div key={index} className=\"cobalt-CalendarRangePicker__month__week\">\n {week.map((day) => {\n const isStartDay = startDate != null && isSameDay(day, startDate)\n const isEndDay = endDate != null && isSameDay(day, endDate)\n\n const disabled =\n isDisabled(day, firstAvailableDate, lastAvailableDate) ||\n (isDayDisabledFn && isDayDisabledFn(day))\n\n const hasNotification =\n !disabled &&\n hasDayNotificationFn != null &&\n hasDayNotificationFn(day)\n\n const isRange =\n rangeInDays !== 0 &&\n (isStartDay || isEndDay) &&\n (!rangeTooShort || (!isEditingStartDate && !isEditingEndDate))\n\n const isDaySelected = isSelected({\n day,\n startDate,\n endDate,\n isStartDay,\n isEndDay,\n isOutOfRangeStartDate,\n rangeTooShort,\n isEditingStartDate,\n isEditingEndDate,\n })\n\n return (\n <CalendarRangePickerDay\n key={day.getTime()}\n date={day}\n onMouseEnter={onMouseEnter}\n onMouseLeave={onLeaveDate}\n onSelect={setSelectedDate}\n isToday={isSameDay(day, today)}\n isActive={\n (isEditingStartDate && isStartDay) ||\n (isEditingEndDate && isEndDay)\n }\n isStartDay={isStartDay}\n isEndDay={isEndDay}\n isRange={isRange}\n isEditingStartDate={isEditingStartDate}\n isEditingEndDate={isEditingEndDate}\n isInvalid={isDayInvalid({\n day,\n isDayInvalidForSelectionFn,\n isDaySelected,\n startDate,\n rangeConstraints,\n rangeTooShort,\n rangeExceeded,\n isEditingStartDate,\n isEditingEndDate,\n isStartDay,\n isEndDay,\n endDate,\n })}\n hasNotification={hasNotification}\n isDisabled={disabled}\n tooltipMessage={buildTooltipMessage({\n rangeInDays,\n isEditingStartDate: !!isEditingStartDate,\n isEditingEndDate: !!isEditingEndDate,\n isStartDay,\n isEndDay,\n rangeConstraints,\n })}\n isSelected={isDaySelected}\n />\n )\n })}\n </div>\n ))}\n </div>\n </div>\n )\n}\n"],"names":["classNames","CalendarRangePickerDay"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"CalendarRangePickerMonth.js","sources":["../../../../src/components/Calendar/CalendarRangePicker/CalendarRangePickerMonth.tsx"],"sourcesContent":["import React, { useEffect, useMemo, useState } from \"react\"\nimport { CalendarRangePickerDay } from \"./CalendarRangePickerDay\"\nimport classNames from \"classnames\"\nimport { format, isSameDay, differenceInCalendarDays } from \"date-fns\"\nimport { getMonthDaysByWeeks, getWeekDays } from \"../utils\"\nimport {\n CalendarRangePickerPropsType,\n DayStatusInterface,\n RangeConstraintsInterface,\n} from \"./CalendarRangePicker\"\n\ntype CalendarRangePickerMonthPropsType = {\n date: Date\n startDate?: Date\n endDate?: Date\n onSelectDate: (date: Date, isOutOfRange?: boolean) => void\n onChangeDate: (date: Date, status: DayStatusInterface) => void\n onLeaveDate?: (date: Date) => void\n isEditingStartDate?: boolean\n isEditingEndDate?: boolean\n firstAvailableDate: Date\n lastAvailableDate?: Date\n isDayDisabledFn?: CalendarRangePickerPropsType[\"isDayDisabledFn\"]\n hasDayNotificationFn?: CalendarRangePickerPropsType[\"hasDayNotificationFn\"]\n isDayInvalidForSelectionFn?: CalendarRangePickerPropsType[\"isDayInvalidForSelectionFn\"]\n dayHoverTooltipFn?: CalendarRangePickerPropsType[\"dayHoverTooltipFn\"]\n rangeConstraints?: RangeConstraintsInterface\n isSundayFirstDayOfWeek?: boolean\n locale: any\n}\n\nfunction isDisabled(\n day: Date,\n firstAvailableDate: Date,\n lastAvailableDate: Date | undefined\n) {\n return (\n day.getTime() < firstAvailableDate.getTime() ||\n (lastAvailableDate != null && day.getTime() > lastAvailableDate.getTime())\n )\n}\n\nfunction isInvalidOppositeBound({\n isEditingStartDate,\n isEditingEndDate,\n isStartDay,\n isEndDay,\n startDate,\n endDate,\n}: {\n startDate: Date | undefined\n endDate: Date | undefined\n isEditingStartDate: boolean | undefined\n isEditingEndDate: boolean | undefined\n isStartDay: boolean\n isEndDay: boolean\n}) {\n return (\n startDate != null &&\n endDate != null &&\n startDate > endDate &&\n ((isEditingStartDate && isEndDay) || (isEditingEndDate && isStartDay))\n )\n}\n\nfunction isDayOutOfRange({\n day,\n rangeConstraints,\n startDate,\n}: {\n day: Date\n startDate: Date | undefined\n rangeConstraints: RangeConstraintsInterface | undefined\n}) {\n return (\n rangeConstraints != null &&\n rangeConstraints.max != null &&\n startDate != null &&\n differenceInCalendarDays(day, startDate) >= rangeConstraints.max.value\n )\n}\n\nfunction isDayInvalid({\n day,\n isDaySelected,\n rangeConstraints,\n rangeTooShort,\n rangeExceeded,\n isEditingStartDate,\n isEditingEndDate,\n isStartDay,\n isEndDay,\n isDayInvalidForSelectionFn,\n startDate,\n endDate,\n}: {\n day: Date\n isDaySelected: boolean\n startDate: Date | undefined\n endDate: Date | undefined\n rangeConstraints: RangeConstraintsInterface | undefined\n rangeTooShort: boolean\n rangeExceeded: boolean\n isEditingStartDate: boolean | undefined\n isEditingEndDate: boolean | undefined\n isStartDay: boolean\n isEndDay: boolean\n isDayInvalidForSelectionFn?: CalendarRangePickerPropsType[\"isDayInvalidForSelectionFn\"]\n}) {\n if (!isDaySelected) return false\n\n let isInvalid = false\n if (!isEditingStartDate && !isEditingEndDate) {\n isInvalid = rangeTooShort || rangeExceeded\n } else if (rangeTooShort && (!isStartDay || isEndDay)) {\n isInvalid = true\n } else if (\n isInvalidOppositeBound({\n isEditingStartDate,\n isEditingEndDate,\n isStartDay,\n isEndDay,\n startDate,\n endDate,\n })\n ) {\n isInvalid = true\n } else {\n isInvalid = isDayOutOfRange({\n day,\n rangeConstraints,\n startDate,\n })\n }\n\n if (\n !isInvalid &&\n isDayInvalidForSelectionFn &&\n ((isEditingStartDate && isStartDay) || (isEditingEndDate && isEndDay))\n ) {\n isInvalid = isDayInvalidForSelectionFn(day)\n }\n\n return isInvalid\n}\n\nfunction isSelected({\n day,\n startDate,\n endDate,\n isStartDay,\n isEndDay,\n isOutOfRangeStartDate,\n rangeTooShort,\n isEditingStartDate,\n isEditingEndDate,\n}: {\n day: Date\n startDate: Date | undefined\n endDate: Date | undefined\n isStartDay: boolean\n isEndDay: boolean\n isOutOfRangeStartDate: boolean\n rangeTooShort: boolean\n isEditingStartDate: boolean\n isEditingEndDate: boolean\n}) {\n return !!(\n isStartDay ||\n isEndDay ||\n ((!rangeTooShort || (!isEditingStartDate && !isEditingEndDate)) &&\n !isOutOfRangeStartDate &&\n endDate &&\n day.getTime() <= endDate.getTime() &&\n startDate &&\n day.getTime() > startDate.getTime())\n )\n}\n\nfunction isRangeExceeded(rangeInDays: number, rangeLimit: number | undefined) {\n return rangeLimit != null && rangeInDays > rangeLimit\n}\n\nfunction isRangeTooShort(rangeInDays: number, rangeLimit: number | undefined) {\n return rangeInDays <= 0\n ? false\n : rangeLimit != null && rangeInDays < rangeLimit\n}\n\nfunction buildTooltipMessage({\n rangeInDays,\n isEditingStartDate,\n isStartDay,\n isEditingEndDate,\n isEndDay,\n rangeConstraints,\n}: {\n rangeInDays: number\n isEditingStartDate: boolean\n isStartDay: boolean\n isEditingEndDate: boolean\n isEndDay: boolean\n rangeConstraints?: RangeConstraintsInterface\n}) {\n let tooltipMessage\n if (\n rangeConstraints &&\n rangeInDays >= 0 &&\n ((isEditingStartDate && isStartDay) || (isEditingEndDate && isEndDay))\n ) {\n if (isRangeTooShort(rangeInDays, rangeConstraints.min?.value)) {\n tooltipMessage = rangeConstraints?.min?.message\n } else if (isRangeExceeded(rangeInDays, rangeConstraints.max?.value)) {\n tooltipMessage = rangeConstraints?.max?.message\n }\n }\n\n return tooltipMessage\n}\n\nfunction getRangeInDays(range: {\n startDate: Date | undefined\n endDate: Date | undefined\n}) {\n return range.startDate && range.endDate\n ? differenceInCalendarDays(range.endDate, range.startDate) + 1\n : 0\n}\n\nexport function CalendarRangePickerMonth({\n date,\n onSelectDate,\n onChangeDate,\n onLeaveDate,\n startDate,\n endDate,\n isEditingStartDate = false,\n isEditingEndDate = false,\n firstAvailableDate,\n lastAvailableDate,\n isDayDisabledFn,\n isDayInvalidForSelectionFn,\n hasDayNotificationFn,\n dayHoverTooltipFn,\n rangeConstraints,\n isSundayFirstDayOfWeek,\n locale,\n}: CalendarRangePickerMonthPropsType) {\n const byWeeks = useMemo(\n () => getMonthDaysByWeeks(date, isSundayFirstDayOfWeek),\n []\n )\n\n // we use a state for the selected Date to allow the onSelect event to be memoized then still triggering some logic with updated data thanks to the setter+useEffect dependency mechanism\n const [selectedDate, setSelectedDate] = useState<Date | null>(null)\n\n const today = new Date().setHours(0, 0, 0, 0)\n\n const weekdays: Date[] = useMemo(\n () => getWeekDays(isSundayFirstDayOfWeek),\n []\n )\n\n const rangeInDays = getRangeInDays({ startDate, endDate })\n\n const rangeExceeded = isRangeExceeded(\n rangeInDays,\n rangeConstraints?.max?.value\n )\n\n const rangeTooShort = isRangeTooShort(\n rangeInDays,\n rangeConstraints?.min?.value\n )\n\n const isOutOfRangeStartDate = isEditingStartDate && rangeExceeded\n\n const onMouseEnter = (day: Date, disabled: boolean) => {\n const status: DayStatusInterface = {}\n\n if (disabled) {\n status.isDisabled = true\n }\n\n if (!disabled) {\n const currentRange = isEditingStartDate\n ? { startDate: day, endDate: endDate! }\n : { startDate: startDate!, endDate: day }\n\n const currentRangeInDays = getRangeInDays({\n startDate: currentRange.startDate,\n endDate: currentRange.endDate,\n })\n\n const currentRangeExceeded = isRangeExceeded(\n currentRangeInDays,\n rangeConstraints?.max?.value\n )\n\n if (currentRangeExceeded) {\n status.isRangeExceeded = true\n } else {\n const currentRangeTooShort = isRangeTooShort(\n currentRangeInDays,\n rangeConstraints?.min?.value\n )\n\n if (currentRangeTooShort) {\n status.isRangeTooShort = true\n } else {\n status.isCustomInvalid =\n isDayInvalidForSelectionFn != null &&\n isDayInvalidForSelectionFn(day)\n }\n }\n }\n\n onChangeDate(day, status)\n }\n\n useEffect(() => {\n // on Date selection...\n if (selectedDate) {\n if (isEditingStartDate) {\n onSelectDate(\n selectedDate,\n isRangeExceeded(\n getRangeInDays({ startDate: selectedDate, endDate }),\n rangeConstraints?.max?.value\n )\n )\n } else {\n onSelectDate(\n selectedDate,\n isRangeExceeded(\n getRangeInDays({ startDate, endDate: selectedDate }),\n rangeConstraints?.max?.value\n )\n )\n }\n }\n }, [selectedDate])\n\n return (\n <div\n className={classNames(\"cobalt-CalendarRangePicker__month\", {\n \"cobalt-CalendarRangePicker__month--invalid\":\n rangeExceeded && !isEditingStartDate,\n })}\n data-month={format(date, \"yyyy-MM\")}\n >\n <div className=\"cobalt-CalendarRangePicker__month-header\">\n {format(date, \"MMMM yyyy\", { locale })}\n </div>\n <div className=\"cobalt-CalendarRangePicker__month__weeks-container\">\n <div className=\"cobalt-CalendarRangePicker__month__week-header\">\n {weekdays.map((weekday) => (\n <div\n key={weekday.getTime()}\n className=\"cobalt-CalendarRangePicker__month__day-header\"\n >\n {format(weekday, \"iiiiii\", { locale })}\n </div>\n ))}\n </div>\n {byWeeks.map((week, index) => (\n <div key={index} className=\"cobalt-CalendarRangePicker__month__week\">\n {week.map((day) => {\n const isStartDay = startDate != null && isSameDay(day, startDate)\n const isEndDay = endDate != null && isSameDay(day, endDate)\n\n const disabled =\n isDisabled(day, firstAvailableDate, lastAvailableDate) ||\n (isDayDisabledFn && isDayDisabledFn(day))\n\n const hasNotification =\n !disabled &&\n hasDayNotificationFn != null &&\n hasDayNotificationFn(day)\n\n const isRange =\n rangeInDays !== 0 &&\n (isStartDay || isEndDay) &&\n (!rangeTooShort || (!isEditingStartDate && !isEditingEndDate))\n\n const isDaySelected = isSelected({\n day,\n startDate,\n endDate,\n isStartDay,\n isEndDay,\n isOutOfRangeStartDate,\n rangeTooShort,\n isEditingStartDate,\n isEditingEndDate,\n })\n\n const tooltip = buildTooltipMessage({\n rangeInDays,\n isEditingStartDate: !!isEditingStartDate,\n isEditingEndDate: !!isEditingEndDate,\n isStartDay,\n isEndDay,\n rangeConstraints,\n })\n\n return (\n <CalendarRangePickerDay\n key={day.getTime()}\n date={day}\n onMouseEnter={onMouseEnter}\n onMouseLeave={onLeaveDate}\n onSelect={setSelectedDate}\n isToday={isSameDay(day, today)}\n isActive={\n (isEditingStartDate && isStartDay) ||\n (isEditingEndDate && isEndDay)\n }\n isStartDay={isStartDay}\n isEndDay={isEndDay}\n isRange={isRange}\n isEditingStartDate={isEditingStartDate}\n isEditingEndDate={isEditingEndDate}\n isInvalid={isDayInvalid({\n day,\n isDayInvalidForSelectionFn,\n isDaySelected,\n startDate,\n rangeConstraints,\n rangeTooShort,\n rangeExceeded,\n isEditingStartDate,\n isEditingEndDate,\n isStartDay,\n isEndDay,\n endDate,\n })}\n hasNotification={hasNotification}\n isDisabled={disabled}\n tooltipMessage={tooltip}\n hoverTooltipMessage={\n dayHoverTooltipFn ? dayHoverTooltipFn(day) : undefined\n }\n isSelected={isDaySelected}\n />\n )\n })}\n </div>\n ))}\n </div>\n </div>\n )\n}\n"],"names":["classNames","CalendarRangePickerDay"],"mappings":";;;;;;AA+BA,SAAS,UAAU,CACjB,GAAS,EACT,kBAAwB,EACxB,iBAAmC,EAAA;IAEnC,QACE,GAAG,CAAC,OAAO,EAAE,GAAG,kBAAkB,CAAC,OAAO,EAAE;AAC5C,SAAC,iBAAiB,IAAI,IAAI,IAAI,GAAG,CAAC,OAAO,EAAE,GAAG,iBAAiB,CAAC,OAAO,EAAE,CAAC,EAC3E;AACH,CAAC;AAED,SAAS,sBAAsB,CAAC,EAC9B,kBAAkB,EAClB,gBAAgB,EAChB,UAAU,EACV,QAAQ,EACR,SAAS,EACT,OAAO,GAQR,EAAA;IACC,QACE,SAAS,IAAI,IAAI;AACjB,QAAA,OAAO,IAAI,IAAI;AACf,QAAA,SAAS,GAAG,OAAO;AACnB,SAAC,CAAC,kBAAkB,IAAI,QAAQ,MAAM,gBAAgB,IAAI,UAAU,CAAC,CAAC,EACvE;AACH,CAAC;AAED,SAAS,eAAe,CAAC,EACvB,GAAG,EACH,gBAAgB,EAChB,SAAS,GAKV,EAAA;IACC,QACE,gBAAgB,IAAI,IAAI;QACxB,gBAAgB,CAAC,GAAG,IAAI,IAAI;AAC5B,QAAA,SAAS,IAAI,IAAI;AACjB,QAAA,wBAAwB,CAAC,GAAG,EAAE,SAAS,CAAC,IAAI,gBAAgB,CAAC,GAAG,CAAC,KAAK,EACvE;AACH,CAAC;AAED,SAAS,YAAY,CAAC,EACpB,GAAG,EACH,aAAa,EACb,gBAAgB,EAChB,aAAa,EACb,aAAa,EACb,kBAAkB,EAClB,gBAAgB,EAChB,UAAU,EACV,QAAQ,EACR,0BAA0B,EAC1B,SAAS,EACT,OAAO,GAcR,EAAA;AACC,IAAA,IAAI,CAAC,aAAa;AAAE,QAAA,OAAO,KAAK,CAAA;IAEhC,IAAI,SAAS,GAAG,KAAK,CAAA;AACrB,IAAA,IAAI,CAAC,kBAAkB,IAAI,CAAC,gBAAgB,EAAE;AAC5C,QAAA,SAAS,GAAG,aAAa,IAAI,aAAa,CAAA;KAC3C;SAAM,IAAI,aAAa,KAAK,CAAC,UAAU,IAAI,QAAQ,CAAC,EAAE;QACrD,SAAS,GAAG,IAAI,CAAA;KACjB;AAAM,SAAA,IACL,sBAAsB,CAAC;QACrB,kBAAkB;QAClB,gBAAgB;QAChB,UAAU;QACV,QAAQ;QACR,SAAS;QACT,OAAO;AACR,KAAA,CAAC,EACF;QACA,SAAS,GAAG,IAAI,CAAA;KACjB;SAAM;QACL,SAAS,GAAG,eAAe,CAAC;YAC1B,GAAG;YACH,gBAAgB;YAChB,SAAS;AACV,SAAA,CAAC,CAAA;KACH;AAED,IAAA,IACE,CAAC,SAAS;QACV,0BAA0B;AAC1B,SAAC,CAAC,kBAAkB,IAAI,UAAU,MAAM,gBAAgB,IAAI,QAAQ,CAAC,CAAC,EACtE;AACA,QAAA,SAAS,GAAG,0BAA0B,CAAC,GAAG,CAAC,CAAA;KAC5C;AAED,IAAA,OAAO,SAAS,CAAA;AAClB,CAAC;AAED,SAAS,UAAU,CAAC,EAClB,GAAG,EACH,SAAS,EACT,OAAO,EACP,UAAU,EACV,QAAQ,EACR,qBAAqB,EACrB,aAAa,EACb,kBAAkB,EAClB,gBAAgB,GAWjB,EAAA;IACC,OAAO,CAAC,EACN,UAAU;QACV,QAAQ;SACP,CAAC,CAAC,aAAa,KAAK,CAAC,kBAAkB,IAAI,CAAC,gBAAgB,CAAC;AAC5D,YAAA,CAAC,qBAAqB;YACtB,OAAO;AACP,YAAA,GAAG,CAAC,OAAO,EAAE,IAAI,OAAO,CAAC,OAAO,EAAE;YAClC,SAAS;YACT,GAAG,CAAC,OAAO,EAAE,GAAG,SAAS,CAAC,OAAO,EAAE,CAAC,CACvC,CAAA;AACH,CAAC;AAED,SAAS,eAAe,CAAC,WAAmB,EAAE,UAA8B,EAAA;AAC1E,IAAA,OAAO,UAAU,IAAI,IAAI,IAAI,WAAW,GAAG,UAAU,CAAA;AACvD,CAAC;AAED,SAAS,eAAe,CAAC,WAAmB,EAAE,UAA8B,EAAA;IAC1E,OAAO,WAAW,IAAI,CAAC;AACrB,UAAE,KAAK;UACL,UAAU,IAAI,IAAI,IAAI,WAAW,GAAG,UAAU,CAAA;AACpD,CAAC;AAED,SAAS,mBAAmB,CAAC,EAC3B,WAAW,EACX,kBAAkB,EAClB,UAAU,EACV,gBAAgB,EAChB,QAAQ,EACR,gBAAgB,GAQjB,EAAA;;AACC,IAAA,IAAI,cAAc,CAAA;AAClB,IAAA,IACE,gBAAgB;AAChB,QAAA,WAAW,IAAI,CAAC;AAChB,SAAC,CAAC,kBAAkB,IAAI,UAAU,MAAM,gBAAgB,IAAI,QAAQ,CAAC,CAAC,EACtE;AACA,QAAA,IAAI,eAAe,CAAC,WAAW,EAAE,CAAA,EAAA,GAAA,gBAAgB,CAAC,GAAG,MAAE,IAAA,IAAA,EAAA,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,KAAK,CAAC,EAAE;YAC7D,cAAc,GAAG,CAAA,EAAA,GAAA,gBAAgB,KAAhB,IAAA,IAAA,gBAAgB,KAAhB,KAAA,CAAA,GAAA,KAAA,CAAA,GAAA,gBAAgB,CAAE,GAAG,MAAE,IAAA,IAAA,EAAA,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,OAAO,CAAA;SAChD;AAAM,aAAA,IAAI,eAAe,CAAC,WAAW,EAAE,CAAA,EAAA,GAAA,gBAAgB,CAAC,GAAG,MAAE,IAAA,IAAA,EAAA,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,KAAK,CAAC,EAAE;YACpE,cAAc,GAAG,CAAA,EAAA,GAAA,gBAAgB,KAAhB,IAAA,IAAA,gBAAgB,KAAhB,KAAA,CAAA,GAAA,KAAA,CAAA,GAAA,gBAAgB,CAAE,GAAG,MAAE,IAAA,IAAA,EAAA,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,OAAO,CAAA;SAChD;KACF;AAED,IAAA,OAAO,cAAc,CAAA;AACvB,CAAC;AAED,SAAS,cAAc,CAAC,KAGvB,EAAA;AACC,IAAA,OAAO,KAAK,CAAC,SAAS,IAAI,KAAK,CAAC,OAAO;AACrC,UAAE,wBAAwB,CAAC,KAAK,CAAC,OAAO,EAAE,KAAK,CAAC,SAAS,CAAC,GAAG,CAAC;UAC5D,CAAC,CAAA;AACP,CAAC;SAEe,wBAAwB,CAAC,EACvC,IAAI,EACJ,YAAY,EACZ,YAAY,EACZ,WAAW,EACX,SAAS,EACT,OAAO,EACP,kBAAkB,GAAG,KAAK,EAC1B,gBAAgB,GAAG,KAAK,EACxB,kBAAkB,EAClB,iBAAiB,EACjB,eAAe,EACf,0BAA0B,EAC1B,oBAAoB,EACpB,iBAAiB,EACjB,gBAAgB,EAChB,sBAAsB,EACtB,MAAM,GAC4B,EAAA;;AAClC,IAAA,MAAM,OAAO,GAAG,OAAO,CACrB,MAAM,mBAAmB,CAAC,IAAI,EAAE,sBAAsB,CAAC,EACvD,EAAE,CACH,CAAA;;IAGD,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,QAAQ,CAAc,IAAI,CAAC,CAAA;AAEnE,IAAA,MAAM,KAAK,GAAG,IAAI,IAAI,EAAE,CAAC,QAAQ,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,CAAA;AAE7C,IAAA,MAAM,QAAQ,GAAW,OAAO,CAC9B,MAAM,WAAW,CAAC,sBAAsB,CAAC,EACzC,EAAE,CACH,CAAA;IAED,MAAM,WAAW,GAAG,cAAc,CAAC,EAAE,SAAS,EAAE,OAAO,EAAE,CAAC,CAAA;AAE1D,IAAA,MAAM,aAAa,GAAG,eAAe,CACnC,WAAW,EACX,CAAA,EAAA,GAAA,gBAAgB,KAAhB,IAAA,IAAA,gBAAgB,uBAAhB,gBAAgB,CAAE,GAAG,MAAE,IAAA,IAAA,EAAA,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,KAAK,CAC7B,CAAA;AAED,IAAA,MAAM,aAAa,GAAG,eAAe,CACnC,WAAW,EACX,CAAA,EAAA,GAAA,gBAAgB,KAAhB,IAAA,IAAA,gBAAgB,uBAAhB,gBAAgB,CAAE,GAAG,MAAE,IAAA,IAAA,EAAA,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,KAAK,CAC7B,CAAA;AAED,IAAA,MAAM,qBAAqB,GAAG,kBAAkB,IAAI,aAAa,CAAA;AAEjE,IAAA,MAAM,YAAY,GAAG,CAAC,GAAS,EAAE,QAAiB,KAAI;;QACpD,MAAM,MAAM,GAAuB,EAAE,CAAA;QAErC,IAAI,QAAQ,EAAE;AACZ,YAAA,MAAM,CAAC,UAAU,GAAG,IAAI,CAAA;SACzB;QAED,IAAI,CAAC,QAAQ,EAAE;YACb,MAAM,YAAY,GAAG,kBAAkB;kBACnC,EAAE,SAAS,EAAE,GAAG,EAAE,OAAO,EAAE,OAAQ,EAAE;kBACrC,EAAE,SAAS,EAAE,SAAU,EAAE,OAAO,EAAE,GAAG,EAAE,CAAA;YAE3C,MAAM,kBAAkB,GAAG,cAAc,CAAC;gBACxC,SAAS,EAAE,YAAY,CAAC,SAAS;gBACjC,OAAO,EAAE,YAAY,CAAC,OAAO;AAC9B,aAAA,CAAC,CAAA;AAEF,YAAA,MAAM,oBAAoB,GAAG,eAAe,CAC1C,kBAAkB,EAClB,CAAA,EAAA,GAAA,gBAAgB,KAAhB,IAAA,IAAA,gBAAgB,uBAAhB,gBAAgB,CAAE,GAAG,MAAE,IAAA,IAAA,EAAA,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,KAAK,CAC7B,CAAA;YAED,IAAI,oBAAoB,EAAE;AACxB,gBAAA,MAAM,CAAC,eAAe,GAAG,IAAI,CAAA;aAC9B;iBAAM;AACL,gBAAA,MAAM,oBAAoB,GAAG,eAAe,CAC1C,kBAAkB,EAClB,CAAA,EAAA,GAAA,gBAAgB,KAAhB,IAAA,IAAA,gBAAgB,uBAAhB,gBAAgB,CAAE,GAAG,MAAE,IAAA,IAAA,EAAA,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,KAAK,CAC7B,CAAA;gBAED,IAAI,oBAAoB,EAAE;AACxB,oBAAA,MAAM,CAAC,eAAe,GAAG,IAAI,CAAA;iBAC9B;qBAAM;AACL,oBAAA,MAAM,CAAC,eAAe;AACpB,wBAAA,0BAA0B,IAAI,IAAI;4BAClC,0BAA0B,CAAC,GAAG,CAAC,CAAA;iBAClC;aACF;SACF;AAED,QAAA,YAAY,CAAC,GAAG,EAAE,MAAM,CAAC,CAAA;AAC3B,KAAC,CAAA;IAED,SAAS,CAAC,MAAK;;;QAEb,IAAI,YAAY,EAAE;YAChB,IAAI,kBAAkB,EAAE;AACtB,gBAAA,YAAY,CACV,YAAY,EACZ,eAAe,CACb,cAAc,CAAC,EAAE,SAAS,EAAE,YAAY,EAAE,OAAO,EAAE,CAAC,EACpD,CAAA,EAAA,GAAA,gBAAgB,KAAhB,IAAA,IAAA,gBAAgB,KAAhB,KAAA,CAAA,GAAA,KAAA,CAAA,GAAA,gBAAgB,CAAE,GAAG,MAAE,IAAA,IAAA,EAAA,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,KAAK,CAC7B,CACF,CAAA;aACF;iBAAM;AACL,gBAAA,YAAY,CACV,YAAY,EACZ,eAAe,CACb,cAAc,CAAC,EAAE,SAAS,EAAE,OAAO,EAAE,YAAY,EAAE,CAAC,EACpD,CAAA,EAAA,GAAA,gBAAgB,KAAhB,IAAA,IAAA,gBAAgB,KAAhB,KAAA,CAAA,GAAA,KAAA,CAAA,GAAA,gBAAgB,CAAE,GAAG,MAAE,IAAA,IAAA,EAAA,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,KAAK,CAC7B,CACF,CAAA;aACF;SACF;AACH,KAAC,EAAE,CAAC,YAAY,CAAC,CAAC,CAAA;AAElB,IAAA,QACE,KACE,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAEA,EAAU,CAAC,mCAAmC,EAAE;AACzD,YAAA,4CAA4C,EAC1C,aAAa,IAAI,CAAC,kBAAkB;AACvC,SAAA,CAAC,gBACU,MAAM,CAAC,IAAI,EAAE,SAAS,CAAC,EAAA;AAEnC,QAAA,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAC,0CAA0C,EAAA,EACtD,MAAM,CAAC,IAAI,EAAE,WAAW,EAAE,EAAE,MAAM,EAAE,CAAC,CAClC;QACN,KAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAC,oDAAoD,EAAA;AACjE,YAAA,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAC,gDAAgD,EAC5D,EAAA,QAAQ,CAAC,GAAG,CAAC,CAAC,OAAO,MACpB,KACE,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,GAAG,EAAE,OAAO,CAAC,OAAO,EAAE,EACtB,SAAS,EAAC,+CAA+C,EAExD,EAAA,MAAM,CAAC,OAAO,EAAE,QAAQ,EAAE,EAAE,MAAM,EAAE,CAAC,CAClC,CACP,CAAC,CACE;YACL,OAAO,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,KAAK,MACvB,KAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,GAAG,EAAE,KAAK,EAAE,SAAS,EAAC,yCAAyC,EACjE,EAAA,IAAI,CAAC,GAAG,CAAC,CAAC,GAAG,KAAI;AAChB,gBAAA,MAAM,UAAU,GAAG,SAAS,IAAI,IAAI,IAAI,SAAS,CAAC,GAAG,EAAE,SAAS,CAAC,CAAA;AACjE,gBAAA,MAAM,QAAQ,GAAG,OAAO,IAAI,IAAI,IAAI,SAAS,CAAC,GAAG,EAAE,OAAO,CAAC,CAAA;gBAE3D,MAAM,QAAQ,GACZ,UAAU,CAAC,GAAG,EAAE,kBAAkB,EAAE,iBAAiB,CAAC;AACtD,qBAAC,eAAe,IAAI,eAAe,CAAC,GAAG,CAAC,CAAC,CAAA;gBAE3C,MAAM,eAAe,GACnB,CAAC,QAAQ;AACT,oBAAA,oBAAoB,IAAI,IAAI;oBAC5B,oBAAoB,CAAC,GAAG,CAAC,CAAA;AAE3B,gBAAA,MAAM,OAAO,GACX,WAAW,KAAK,CAAC;qBAChB,UAAU,IAAI,QAAQ,CAAC;qBACvB,CAAC,aAAa,KAAK,CAAC,kBAAkB,IAAI,CAAC,gBAAgB,CAAC,CAAC,CAAA;gBAEhE,MAAM,aAAa,GAAG,UAAU,CAAC;oBAC/B,GAAG;oBACH,SAAS;oBACT,OAAO;oBACP,UAAU;oBACV,QAAQ;oBACR,qBAAqB;oBACrB,aAAa;oBACb,kBAAkB;oBAClB,gBAAgB;AACjB,iBAAA,CAAC,CAAA;gBAEF,MAAM,OAAO,GAAG,mBAAmB,CAAC;oBAClC,WAAW;oBACX,kBAAkB,EAAE,CAAC,CAAC,kBAAkB;oBACxC,gBAAgB,EAAE,CAAC,CAAC,gBAAgB;oBACpC,UAAU;oBACV,QAAQ;oBACR,gBAAgB;AACjB,iBAAA,CAAC,CAAA;AAEF,gBAAA,QACE,KAAC,CAAA,aAAA,CAAAC,iBAAsB,IACrB,GAAG,EAAE,GAAG,CAAC,OAAO,EAAE,EAClB,IAAI,EAAE,GAAG,EACT,YAAY,EAAE,YAAY,EAC1B,YAAY,EAAE,WAAW,EACzB,QAAQ,EAAE,eAAe,EACzB,OAAO,EAAE,SAAS,CAAC,GAAG,EAAE,KAAK,CAAC,EAC9B,QAAQ,EACN,CAAC,kBAAkB,IAAI,UAAU;AACjC,yBAAC,gBAAgB,IAAI,QAAQ,CAAC,EAEhC,UAAU,EAAE,UAAU,EACtB,QAAQ,EAAE,QAAQ,EAClB,OAAO,EAAE,OAAO,EAChB,kBAAkB,EAAE,kBAAkB,EACtC,gBAAgB,EAAE,gBAAgB,EAClC,SAAS,EAAE,YAAY,CAAC;wBACtB,GAAG;wBACH,0BAA0B;wBAC1B,aAAa;wBACb,SAAS;wBACT,gBAAgB;wBAChB,aAAa;wBACb,aAAa;wBACb,kBAAkB;wBAClB,gBAAgB;wBAChB,UAAU;wBACV,QAAQ;wBACR,OAAO;AACR,qBAAA,CAAC,EACF,eAAe,EAAE,eAAe,EAChC,UAAU,EAAE,QAAQ,EACpB,cAAc,EAAE,OAAO,EACvB,mBAAmB,EACjB,iBAAiB,GAAG,iBAAiB,CAAC,GAAG,CAAC,GAAG,SAAS,EAExD,UAAU,EAAE,aAAa,EAAA,CACzB,EACH;AACH,aAAC,CAAC,CACE,CACP,CAAC,CACE,CACF,EACP;AACH;;;;"}
|
|
@@ -2,21 +2,21 @@ import React from 'react';
|
|
|
2
2
|
import Tippy from '@tippyjs/react';
|
|
3
3
|
import { sticky } from 'tippy.js';
|
|
4
4
|
|
|
5
|
-
const DayTooltip = (props) =>
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
5
|
+
const DayTooltip = (props) => {
|
|
6
|
+
return (React.createElement(Tippy, { animation: "fade",
|
|
7
|
+
arrow: true,
|
|
8
|
+
interactive: true,
|
|
9
|
+
interactiveBorder: 10,
|
|
10
|
+
placement: "top",
|
|
11
|
+
theme: "light range-picker",
|
|
12
|
+
delay: [0, 0],
|
|
13
|
+
duration: [0, 0],
|
|
14
|
+
maxWidth: 500,
|
|
15
|
+
offset: [0, 8],
|
|
16
|
+
sticky: true,
|
|
17
|
+
plugins: [sticky],
|
|
18
|
+
appendTo: document.body,
|
|
19
|
+
...props }));
|
|
20
20
|
};
|
|
21
21
|
|
|
22
22
|
export { DayTooltip as default };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DayTooltip.js","sources":["../../../../src/components/Calendar/CalendarRangePicker/DayTooltip.tsx"],"sourcesContent":["import React from \"react\"\nimport Tippy, { TippyProps } from \"@tippyjs/react\"\nimport { sticky } from \"tippy.js\"\n\nconst DayTooltip = (props: TippyProps) => <Tippy
|
|
1
|
+
{"version":3,"file":"DayTooltip.js","sources":["../../../../src/components/Calendar/CalendarRangePicker/DayTooltip.tsx"],"sourcesContent":["import React from \"react\"\nimport Tippy, { TippyProps } from \"@tippyjs/react\"\nimport { sticky } from \"tippy.js\"\n\nconst DayTooltip = (props: TippyProps) => {\n return (\n <Tippy\n {...{\n animation: \"fade\",\n arrow: true,\n interactive: true,\n interactiveBorder: 10,\n placement: \"top\",\n theme: \"light range-picker\",\n delay: [0, 0],\n duration: [0, 0],\n maxWidth: 500,\n offset: [0, 8],\n sticky: true,\n plugins: [sticky],\n appendTo: document.body,\n ...props,\n }}\n />\n )\n}\n\nexport default DayTooltip\n"],"names":[],"mappings":";;;;AAIA,MAAM,UAAU,GAAG,CAAC,KAAiB,KAAI;AACvC,IAAA,QACE,KAAC,CAAA,aAAA,CAAA,KAAK,EAEF,EAAA,SAAS,EAAE,MAAM;AACjB,QAAA,KAAK,EAAE,IAAI;AACX,QAAA,WAAW,EAAE,IAAI;AACjB,QAAA,iBAAiB,EAAE,EAAE;AACrB,QAAA,SAAS,EAAE,KAAK;AAChB,QAAA,KAAK,EAAE,oBAAoB;AAC3B,QAAA,KAAK,EAAE,CAAC,CAAC,EAAE,CAAC,CAAC;AACb,QAAA,QAAQ,EAAE,CAAC,CAAC,EAAE,CAAC,CAAC;AAChB,QAAA,QAAQ,EAAE,GAAG;AACb,QAAA,MAAM,EAAE,CAAC,CAAC,EAAE,CAAC,CAAC;AACd,QAAA,MAAM,EAAE,IAAI;QACZ,OAAO,EAAE,CAAC,MAAM,CAAC;QACjB,QAAQ,EAAE,QAAQ,CAAC,IAAI;QACvB,GAAG,KAAK,EAEV,CAAA,EACH;AACH;;;;"}
|
|
@@ -62,9 +62,6 @@ const Autocomplete = forwardRef(({ id, className, label, hint, fullWidth, icon,
|
|
|
62
62
|
details.items[0]
|
|
63
63
|
? setValue(details.items[0].value)
|
|
64
64
|
: setValue("");
|
|
65
|
-
details.items[0] &&
|
|
66
|
-
onSelectItem &&
|
|
67
|
-
onSelectItem(details.items[0], combobox.inputValue);
|
|
68
65
|
},
|
|
69
66
|
onInteractOutside: () => {
|
|
70
67
|
setTimeout(() => { var _a; return (_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.blur(); }, 30);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../../../../src/components/Form/Autocomplete/index.tsx"],"sourcesContent":["import React, {\n useEffect,\n useRef,\n useMemo,\n useImperativeHandle,\n forwardRef,\n} from \"react\"\nimport { useState } from \"react\"\nimport cx from \"classnames\"\n\nimport { CheckIcon, Icon, IconSources } from \"../../Icon\"\n\nimport { FormElement } from \"../form\"\nimport {\n Combobox,\n createListCollection,\n Portal,\n useCombobox,\n} from \"@ark-ui/react\"\nimport { Hint } from \"../Hint\"\nimport { nanoid } from \"nanoid\"\n\nexport type AutocompleteItemInput =\n | string\n | {\n [x: string]: any\n icon?: IconSources\n label?: string\n value: string\n disabled?: boolean\n }\n\nexport type AutocompleteItem = {\n [x: string]: any\n icon?: IconSources\n label: string\n value: string\n disabled?: boolean\n}\n\nexport type AutocompleteRefType = {\n query: string\n input: HTMLInputElement\n open: () => void\n focus: () => void\n clearValue: () => void\n setSelectedItem: (item: AutocompleteItemInput) => void\n}\n\ntype Props = {\n className?: string\n label?: string\n hint?: string\n fullWidth?: boolean\n icon?: IconSources\n items: AutocompleteItemInput[]\n popoverClassName?: string\n minQueryLength?: number\n autoFilter?: boolean\n focusOnInit?: boolean\n autocomplete?: boolean\n autocompleteRef?: React.RefObject<HTMLDivElement>\n onClearValue?: () => void\n onKeyDown?: (event: React.KeyboardEvent<HTMLElement>) => void\n onQueryChange?: (term: string) => void\n onSelectItem?: (item: AutocompleteItem, term: string) => boolean\n renderItem?: (item: AutocompleteItem, term: string) => React.ReactNode\n allowCustomValue?: boolean\n} & FormElement &\n React.InputHTMLAttributes<HTMLInputElement>\n\nfunction sanitizeItem(item: AutocompleteItemInput) {\n if (typeof item === \"string\") {\n // If the item is a string, create an object with label and value being the string\n return { label: item, value: item }\n } else {\n // If the item is an object, ensure it has a label property\n const { value, label } = item\n return { ...item, label: label ?? value }\n }\n}\n\nfunction sanitizeItems(items: AutocompleteItemInput[]) {\n return items.map((item) => sanitizeItem(item))\n}\n\nconst HIGHLIGHT_CLASSNAME = \"autocomplete_matching_query\"\nconst regExpEscape = (s: string) => s.replace(/[-\\\\^$*+?.()|[\\]{}]/g, \"\\\\$&\")\n\ntype AutocompleteMatchHighlightPropsType = {\n label: string\n query: string\n matchClassName?: string\n}\n\nexport const AutocompleteMatchHighlight = ({\n label,\n query,\n matchClassName = HIGHLIGHT_CLASSNAME,\n}: AutocompleteMatchHighlightPropsType) => {\n if (query.trim().length === 0) return label\n\n const queryRX = RegExp(`(${regExpEscape(query)})`, \"gi\")\n\n return (\n <>\n {label.split(queryRX).map((part, i) =>\n part.match(queryRX) ? (\n <span className={cx(matchClassName)} key={i}>\n {part}\n </span>\n ) : (\n part\n )\n )}\n </>\n )\n}\n\nconst KEY_CODE_ENTER = 13\n\nconst ignoreItemValue = nanoid()\n\nconst Autocomplete = forwardRef(\n (\n {\n id,\n className,\n label,\n hint,\n fullWidth,\n icon,\n status,\n focusOnInit = false,\n popoverClassName,\n minQueryLength = 1,\n onQueryChange,\n onSelectItem,\n renderItem,\n items,\n onKeyDown,\n disabled,\n defaultValue,\n onClearValue,\n allowCustomValue = true,\n ...inputProps\n }: Props,\n ref\n ) => {\n const [defaultInputValue, setDefaultInputValue] = useState(defaultValue)\n const [autocompleteKey, setAutocompleteKey] = useState(true)\n\n const isInputValidChangedProgrammatically = useRef(false)\n const sanitizedInitialItems = useMemo(() => sanitizeItems(items), [items])\n\n const [value, setValue] = useState<string>((defaultValue as string) || \"\")\n const [popoverItems, setPopoverItems] = useState(sanitizedInitialItems)\n\n const collection = useMemo(\n () =>\n createListCollection({\n items: popoverItems.length\n ? popoverItems\n : sanitizeItems([{ value: ignoreItemValue }]), // having an empty collection makes the component buggy. Best practice is to always have an \"instruction\" item when empty. This dummy item will not be displayed\n }),\n [popoverItems]\n )\n\n const handleInputChange = (details: Combobox.InputValueChangeDetails) => {\n if (isInputValidChangedProgrammatically.current) {\n isInputValidChangedProgrammatically.current = false\n return\n }\n\n onQueryChange\n ? onQueryChange(details.inputValue)\n : setPopoverItems(\n sanitizedInitialItems.filter((item) =>\n item.label\n .toLowerCase()\n .includes(details.inputValue.toLowerCase())\n )\n )\n }\n\n useEffect(() => {\n setPopoverItems(sanitizeItems(items))\n }, [items])\n\n const inputRef = useRef<HTMLInputElement>(null)\n\n const combobox = useCombobox({\n ...(id ? { id } : {}),\n allowCustomValue: allowCustomValue,\n autoFocus: focusOnInit,\n value: [value],\n collection: collection,\n onInputValueChange: handleInputChange,\n openOnClick: minQueryLength === 0 && collection.items.length > 0,\n onValueChange: (details) => {\n isInputValidChangedProgrammatically.current = true\n details.items[0]\n ? setValue((details.items[0] as AutocompleteItem).value)\n : setValue(\"\")\n details.items[0] &&\n onSelectItem &&\n onSelectItem(\n details.items[0] as AutocompleteItem,\n combobox.inputValue\n )\n },\n onInteractOutside: () => {\n setTimeout(() => inputRef.current?.blur(), 30)\n },\n positioning: {\n gutter: -3,\n flip: false,\n },\n })\n\n useImperativeHandle(ref, (): AutocompleteRefType => {\n return {\n query: combobox.inputValue,\n input: inputRef.current as HTMLInputElement,\n open: () => {\n combobox.setOpen(true)\n },\n focus: () => {\n combobox.focus()\n },\n clearValue: () => {\n combobox.clearValue()\n setValue(\"\")\n setDefaultInputValue(\"\")\n onClearValue && onClearValue()\n onQueryChange && onQueryChange(\"\")\n },\n setSelectedItem: (selectedItem: AutocompleteItemInput) => {\n isInputValidChangedProgrammatically.current = true\n const sanitizedItem = sanitizeItem(selectedItem)\n const existingItem = popoverItems.find(\n (item) => item.value === sanitizedItem.value\n )\n\n if (!existingItem) {\n combobox.setOpen(false)\n setPopoverItems([])\n setDefaultInputValue(sanitizedItem.value)\n setValue(sanitizedItem.value)\n setAutocompleteKey(!autocompleteKey)\n } else {\n setValue(sanitizedItem.value)\n combobox.setOpen(false)\n }\n },\n }\n }, [combobox])\n\n useEffect(() => {\n focusOnInit && combobox.setOpen(collection.items.length > 0)\n }, [])\n\n const validItems = collection.items.filter(\n (item) => item.value !== ignoreItemValue\n )\n\n useEffect(() => {\n validItems.length === 0 && combobox.setOpen(false)\n\n combobox.focused &&\n collection.items.length > 0 &&\n !combobox.open &&\n combobox.setOpen(true)\n }, [collection.items.length])\n\n const autocomplete = (\n <Combobox.RootProvider\n value={combobox}\n className={cx(\"cobalt-Autocomplete\", className, {\n \"cobalt-Autocomplete--empty\": validItems.length === 0,\n })}\n key={\"\" + autocompleteKey}\n >\n {label && (\n <Combobox.Label className=\"cobalt-FormField__Label\">\n {label}\n </Combobox.Label>\n )}\n <Combobox.Control\n className={cx(\"cobalt-TextField\", {\n \"cobalt-TextField--error\": status === \"error\",\n \"cobalt-TextField--success\": status === \"success\",\n \"cobalt-TextField--withIcon\": icon,\n \"cobalt-TextField--withValue\":\n inputRef.current && inputRef.current.value.length > 0,\n })}\n >\n <Combobox.Input\n className=\"cobalt-TextField__Input\"\n ref={inputRef}\n disabled={disabled}\n defaultValue={defaultInputValue}\n {...inputProps}\n onKeyDown={(e) => {\n onKeyDown && onKeyDown(e)\n if (\n onSelectItem &&\n e.keyCode === KEY_CODE_ENTER &&\n combobox.highlightedItem\n ) {\n const processSelection = onSelectItem(\n combobox.highlightedItem as AutocompleteItem,\n combobox.inputValue\n )\n\n if (!processSelection) {\n e.preventDefault()\n e.stopPropagation()\n }\n }\n }}\n />\n {icon && (\n <Icon\n source={icon}\n color=\"accent\"\n className=\"cobalt-TextField__Icon\"\n />\n )}\n {value.length > 0 && !disabled && (\n <Combobox.ClearTrigger\n className=\"cobalt-Autocomplete__clear-button\"\n role=\"clear\"\n onClick={() => {\n setDefaultInputValue(\"\")\n setValue(\"\")\n setAutocompleteKey(!autocompleteKey)\n minQueryLength === 0 &&\n setTimeout(() => {\n inputRef.current?.click()\n }, 0)\n onClearValue && onClearValue()\n onQueryChange && onQueryChange(\"\")\n }}\n >\n <Icon source=\"close\" size={16} />\n </Combobox.ClearTrigger>\n )}\n </Combobox.Control>\n <Portal>\n <Combobox.Positioner className=\"cobalt-Autocomplete__positioner\">\n <Combobox.Content\n className={cx(\"cobalt-Autocomplete__content\", popoverClassName, {\n \"cobalt-Autocomplete__content--empty\": validItems.length === 0,\n })}\n >\n {validItems.map((item: AutocompleteItem, index: number) => (\n <Combobox.Item\n key={index}\n item={item}\n className=\"cobalt-Autocomplete__item\"\n >\n {renderItem ? (\n <div\n onClick={(e) => {\n if (onSelectItem) {\n const processSelection = onSelectItem(\n combobox.highlightedItem as AutocompleteItem,\n combobox.inputValue\n )\n\n if (!processSelection) {\n e.preventDefault()\n e.stopPropagation()\n }\n }\n }}\n >\n {renderItem(item, combobox.inputValue)}\n </div>\n ) : (\n <div\n className={cx(\"cobalt-Autocomplete__item-wrapper\", {\n \"cobalt-Autocomplete__item-wrapper--disabled\":\n item.disabled,\n })}\n >\n {icon && (\n <span className=\"cobalt-Autocomplete__item-icon\">\n <Icon source={icon} color=\"accent\" />\n </span>\n )}\n <Combobox.ItemText className=\"cobalt-Autocomplete__item-label\">\n {item.label}\n </Combobox.ItemText>\n <Combobox.ItemIndicator className=\"cobalt-Autocomplete_selected-item-indicator\">\n <CheckIcon size={16} />\n </Combobox.ItemIndicator>\n </div>\n )}\n </Combobox.Item>\n ))}\n </Combobox.Content>\n </Combobox.Positioner>\n </Portal>\n </Combobox.RootProvider>\n )\n\n return label || hint ? (\n <div\n className={cx(\"cobalt-FormField\", {\n \"cobalt-FormField--withHint\": hint,\n \"cobalt-FormField--fullWidth\": fullWidth,\n })}\n >\n {autocomplete}\n {hint && (\n <Hint status={status}>\n <span dangerouslySetInnerHTML={{ __html: hint }} />\n </Hint>\n )}\n </div>\n ) : (\n <>{autocomplete}</>\n )\n }\n)\n\nAutocomplete.displayName = \"Autocomplete\"\n\nexport { Autocomplete }\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../../../src/components/Form/Autocomplete/index.tsx"],"sourcesContent":["import React, {\n useEffect,\n useRef,\n useMemo,\n useImperativeHandle,\n forwardRef,\n} from \"react\"\nimport { useState } from \"react\"\nimport cx from \"classnames\"\n\nimport { CheckIcon, Icon, IconSources } from \"../../Icon\"\n\nimport { FormElement } from \"../form\"\nimport {\n Combobox,\n createListCollection,\n Portal,\n useCombobox,\n} from \"@ark-ui/react\"\nimport { Hint } from \"../Hint\"\nimport { nanoid } from \"nanoid\"\n\nexport type AutocompleteItemInput =\n | string\n | {\n [x: string]: any\n icon?: IconSources\n label?: string\n value: string\n disabled?: boolean\n }\n\nexport type AutocompleteItem = {\n [x: string]: any\n icon?: IconSources\n label: string\n value: string\n disabled?: boolean\n}\n\nexport type AutocompleteRefType = {\n query: string\n input: HTMLInputElement\n open: () => void\n focus: () => void\n clearValue: () => void\n setSelectedItem: (item: AutocompleteItemInput) => void\n}\n\ntype Props = {\n className?: string\n label?: string\n hint?: string\n fullWidth?: boolean\n icon?: IconSources\n items: AutocompleteItemInput[]\n popoverClassName?: string\n minQueryLength?: number\n autoFilter?: boolean\n focusOnInit?: boolean\n autocomplete?: boolean\n autocompleteRef?: React.RefObject<HTMLDivElement>\n onClearValue?: () => void\n onKeyDown?: (event: React.KeyboardEvent<HTMLElement>) => void\n onQueryChange?: (term: string) => void\n onSelectItem?: (item: AutocompleteItem, term: string) => boolean\n renderItem?: (item: AutocompleteItem, term: string) => React.ReactNode\n allowCustomValue?: boolean\n} & FormElement &\n React.InputHTMLAttributes<HTMLInputElement>\n\nfunction sanitizeItem(item: AutocompleteItemInput) {\n if (typeof item === \"string\") {\n // If the item is a string, create an object with label and value being the string\n return { label: item, value: item }\n } else {\n // If the item is an object, ensure it has a label property\n const { value, label } = item\n return { ...item, label: label ?? value }\n }\n}\n\nfunction sanitizeItems(items: AutocompleteItemInput[]) {\n return items.map((item) => sanitizeItem(item))\n}\n\nconst HIGHLIGHT_CLASSNAME = \"autocomplete_matching_query\"\nconst regExpEscape = (s: string) => s.replace(/[-\\\\^$*+?.()|[\\]{}]/g, \"\\\\$&\")\n\ntype AutocompleteMatchHighlightPropsType = {\n label: string\n query: string\n matchClassName?: string\n}\n\nexport const AutocompleteMatchHighlight = ({\n label,\n query,\n matchClassName = HIGHLIGHT_CLASSNAME,\n}: AutocompleteMatchHighlightPropsType) => {\n if (query.trim().length === 0) return label\n\n const queryRX = RegExp(`(${regExpEscape(query)})`, \"gi\")\n\n return (\n <>\n {label.split(queryRX).map((part, i) =>\n part.match(queryRX) ? (\n <span className={cx(matchClassName)} key={i}>\n {part}\n </span>\n ) : (\n part\n )\n )}\n </>\n )\n}\n\nconst KEY_CODE_ENTER = 13\n\nconst ignoreItemValue = nanoid()\n\nconst Autocomplete = forwardRef(\n (\n {\n id,\n className,\n label,\n hint,\n fullWidth,\n icon,\n status,\n focusOnInit = false,\n popoverClassName,\n minQueryLength = 1,\n onQueryChange,\n onSelectItem,\n renderItem,\n items,\n onKeyDown,\n disabled,\n defaultValue,\n onClearValue,\n allowCustomValue = true,\n ...inputProps\n }: Props,\n ref\n ) => {\n const [defaultInputValue, setDefaultInputValue] = useState(defaultValue)\n const [autocompleteKey, setAutocompleteKey] = useState(true)\n\n const isInputValidChangedProgrammatically = useRef(false)\n const sanitizedInitialItems = useMemo(() => sanitizeItems(items), [items])\n\n const [value, setValue] = useState<string>((defaultValue as string) || \"\")\n const [popoverItems, setPopoverItems] = useState(sanitizedInitialItems)\n\n const collection = useMemo(\n () =>\n createListCollection({\n items: popoverItems.length\n ? popoverItems\n : sanitizeItems([{ value: ignoreItemValue }]), // having an empty collection makes the component buggy. Best practice is to always have an \"instruction\" item when empty. This dummy item will not be displayed\n }),\n [popoverItems]\n )\n\n const handleInputChange = (details: Combobox.InputValueChangeDetails) => {\n if (isInputValidChangedProgrammatically.current) {\n isInputValidChangedProgrammatically.current = false\n return\n }\n\n onQueryChange\n ? onQueryChange(details.inputValue)\n : setPopoverItems(\n sanitizedInitialItems.filter((item) =>\n item.label\n .toLowerCase()\n .includes(details.inputValue.toLowerCase())\n )\n )\n }\n\n useEffect(() => {\n setPopoverItems(sanitizeItems(items))\n }, [items])\n\n const inputRef = useRef<HTMLInputElement>(null)\n\n const combobox = useCombobox({\n ...(id ? { id } : {}),\n allowCustomValue: allowCustomValue,\n autoFocus: focusOnInit,\n value: [value],\n collection: collection,\n onInputValueChange: handleInputChange,\n openOnClick: minQueryLength === 0 && collection.items.length > 0,\n onValueChange: (details) => {\n isInputValidChangedProgrammatically.current = true\n details.items[0]\n ? setValue((details.items[0] as AutocompleteItem).value)\n : setValue(\"\")\n },\n onInteractOutside: () => {\n setTimeout(() => inputRef.current?.blur(), 30)\n },\n positioning: {\n gutter: -3,\n flip: false,\n },\n })\n\n useImperativeHandle(ref, (): AutocompleteRefType => {\n return {\n query: combobox.inputValue,\n input: inputRef.current as HTMLInputElement,\n open: () => {\n combobox.setOpen(true)\n },\n focus: () => {\n combobox.focus()\n },\n clearValue: () => {\n combobox.clearValue()\n setValue(\"\")\n setDefaultInputValue(\"\")\n onClearValue && onClearValue()\n onQueryChange && onQueryChange(\"\")\n },\n setSelectedItem: (selectedItem: AutocompleteItemInput) => {\n isInputValidChangedProgrammatically.current = true\n const sanitizedItem = sanitizeItem(selectedItem)\n const existingItem = popoverItems.find(\n (item) => item.value === sanitizedItem.value\n )\n\n if (!existingItem) {\n combobox.setOpen(false)\n setPopoverItems([])\n setDefaultInputValue(sanitizedItem.value)\n setValue(sanitizedItem.value)\n setAutocompleteKey(!autocompleteKey)\n } else {\n setValue(sanitizedItem.value)\n combobox.setOpen(false)\n }\n },\n }\n }, [combobox])\n\n useEffect(() => {\n focusOnInit && combobox.setOpen(collection.items.length > 0)\n }, [])\n\n const validItems = collection.items.filter(\n (item) => item.value !== ignoreItemValue\n )\n\n useEffect(() => {\n validItems.length === 0 && combobox.setOpen(false)\n\n combobox.focused &&\n collection.items.length > 0 &&\n !combobox.open &&\n combobox.setOpen(true)\n }, [collection.items.length])\n\n const autocomplete = (\n <Combobox.RootProvider\n value={combobox}\n className={cx(\"cobalt-Autocomplete\", className, {\n \"cobalt-Autocomplete--empty\": validItems.length === 0,\n })}\n key={\"\" + autocompleteKey}\n >\n {label && (\n <Combobox.Label className=\"cobalt-FormField__Label\">\n {label}\n </Combobox.Label>\n )}\n <Combobox.Control\n className={cx(\"cobalt-TextField\", {\n \"cobalt-TextField--error\": status === \"error\",\n \"cobalt-TextField--success\": status === \"success\",\n \"cobalt-TextField--withIcon\": icon,\n \"cobalt-TextField--withValue\":\n inputRef.current && inputRef.current.value.length > 0,\n })}\n >\n <Combobox.Input\n className=\"cobalt-TextField__Input\"\n ref={inputRef}\n disabled={disabled}\n defaultValue={defaultInputValue}\n {...inputProps}\n onKeyDown={(e) => {\n onKeyDown && onKeyDown(e)\n if (\n onSelectItem &&\n e.keyCode === KEY_CODE_ENTER &&\n combobox.highlightedItem\n ) {\n const processSelection = onSelectItem(\n combobox.highlightedItem as AutocompleteItem,\n combobox.inputValue\n )\n\n if (!processSelection) {\n e.preventDefault()\n e.stopPropagation()\n }\n }\n }}\n />\n {icon && (\n <Icon\n source={icon}\n color=\"accent\"\n className=\"cobalt-TextField__Icon\"\n />\n )}\n {value.length > 0 && !disabled && (\n <Combobox.ClearTrigger\n className=\"cobalt-Autocomplete__clear-button\"\n role=\"clear\"\n onClick={() => {\n setDefaultInputValue(\"\")\n setValue(\"\")\n setAutocompleteKey(!autocompleteKey)\n minQueryLength === 0 &&\n setTimeout(() => {\n inputRef.current?.click()\n }, 0)\n onClearValue && onClearValue()\n onQueryChange && onQueryChange(\"\")\n }}\n >\n <Icon source=\"close\" size={16} />\n </Combobox.ClearTrigger>\n )}\n </Combobox.Control>\n <Portal>\n <Combobox.Positioner className=\"cobalt-Autocomplete__positioner\">\n <Combobox.Content\n className={cx(\"cobalt-Autocomplete__content\", popoverClassName, {\n \"cobalt-Autocomplete__content--empty\": validItems.length === 0,\n })}\n >\n {validItems.map((item: AutocompleteItem, index: number) => (\n <Combobox.Item\n key={index}\n item={item}\n className=\"cobalt-Autocomplete__item\"\n >\n {renderItem ? (\n <div\n onClick={(e) => {\n if (onSelectItem) {\n const processSelection = onSelectItem(\n combobox.highlightedItem as AutocompleteItem,\n combobox.inputValue\n )\n\n if (!processSelection) {\n e.preventDefault()\n e.stopPropagation()\n }\n }\n }}\n >\n {renderItem(item, combobox.inputValue)}\n </div>\n ) : (\n <div\n className={cx(\"cobalt-Autocomplete__item-wrapper\", {\n \"cobalt-Autocomplete__item-wrapper--disabled\":\n item.disabled,\n })}\n >\n {icon && (\n <span className=\"cobalt-Autocomplete__item-icon\">\n <Icon source={icon} color=\"accent\" />\n </span>\n )}\n <Combobox.ItemText className=\"cobalt-Autocomplete__item-label\">\n {item.label}\n </Combobox.ItemText>\n <Combobox.ItemIndicator className=\"cobalt-Autocomplete_selected-item-indicator\">\n <CheckIcon size={16} />\n </Combobox.ItemIndicator>\n </div>\n )}\n </Combobox.Item>\n ))}\n </Combobox.Content>\n </Combobox.Positioner>\n </Portal>\n </Combobox.RootProvider>\n )\n\n return label || hint ? (\n <div\n className={cx(\"cobalt-FormField\", {\n \"cobalt-FormField--withHint\": hint,\n \"cobalt-FormField--fullWidth\": fullWidth,\n })}\n >\n {autocomplete}\n {hint && (\n <Hint status={status}>\n <span dangerouslySetInnerHTML={{ __html: hint }} />\n </Hint>\n )}\n </div>\n ) : (\n <>{autocomplete}</>\n )\n }\n)\n\nAutocomplete.displayName = \"Autocomplete\"\n\nexport { Autocomplete }\n"],"names":[],"mappings":"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"}
|
|
@@ -24,6 +24,7 @@ const Slider = ({ defaultValue: _defaultValue, value: _value, min, max, disabled
|
|
|
24
24
|
return [0];
|
|
25
25
|
}
|
|
26
26
|
const [sliderValue, setSliderValue] = useState(() => initValue());
|
|
27
|
+
console.log("className", className);
|
|
27
28
|
return (React.createElement(FieldWrapper, { ...restProps, status: status, label: label, hint: hint },
|
|
28
29
|
React.createElement(Slider$1.Root, { ...restProps, className: cx("cobalt-slider", className, {
|
|
29
30
|
"cobalt-slider--disabled": disabled,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Slider.js","sources":["../../../src/components/Form/Slider.tsx"],"sourcesContent":["import React, { PropsWithChildren, useState } from \"react\"\nimport { Slider as ArkSlider, SliderRootProps } from \"@ark-ui/react\"\nimport cx from \"classnames\"\nimport { FieldWrapper, FieldWrapperProps } from \"./field\"\n\nexport type SliderPropsType<T extends number | number[]> = {\n /**\n * mandatory for A11y\n */\n value?: T\n defaultValue?: T\n ariaLabel: string\n /**\n * values interval\n */\n step?: number\n disabled?: boolean\n /**\n * Listener called when the value is changed\n */\n onValueChange?: (newValue: T) => void\n /**\n * Function used to visually display the slider value\n */\n renderValue?: (\n value: T,\n status: FieldWrapperProps[\"status\"]\n ) => React.ReactElement\n\n onFocus?: (event: React.FocusEvent<HTMLInputElement>) => void\n} & FieldWrapperProps &\n Omit<SliderRootProps, \"value\" | \"defaultValue\" | \"onValueChange\">\n\nconst Slider = <T extends number | number[]>({\n defaultValue: _defaultValue,\n value: _value,\n min,\n max,\n disabled,\n onValueChange,\n renderValue,\n ariaLabel,\n hint,\n label,\n status,\n className,\n ...restProps\n}: SliderPropsType<T>) => {\n const value: number[] | undefined = Array.isArray(_value)\n ? _value\n : _value !== undefined && !isNaN(_value)\n ? [_value]\n : undefined\n const defaultValue: number[] | undefined = Array.isArray(_defaultValue)\n ? _defaultValue\n : _defaultValue !== undefined && !isNaN(_defaultValue)\n ? [_defaultValue]\n : undefined\n function initValue(): number[] {\n if (value !== undefined) return value\n if (defaultValue !== undefined) return defaultValue\n if (min !== undefined) return [min]\n return [0]\n }\n\n const [sliderValue, setSliderValue] = useState(() => initValue())\n\n return (\n <FieldWrapper {...restProps} status={status} label={label} hint={hint}>\n <ArkSlider.Root\n {...restProps}\n className={cx(\"cobalt-slider\", className, {\n \"cobalt-slider--disabled\": disabled,\n \"cobalt-slider--withHint\": hint,\n })}\n thumbAlignment=\"contain\"\n disabled={disabled}\n aria-label={[ariaLabel]}\n value={sliderValue}\n min={min}\n max={max}\n // Need to force disbplaying in smaller spaces like popovers\n thumbSize={{\n width: 24,\n height: 24,\n }}\n onValueChange={({ value: newValueArr }) => {\n setSliderValue(newValueArr)\n const newValue =\n newValueArr.length === 1 ? newValueArr[0] : newValueArr\n onValueChange && onValueChange(newValue as T)\n }}\n >\n <ArkSlider.Label className={FieldWrapper.labelClassName}>\n {label}\n </ArkSlider.Label>\n {renderValue && (\n <div className=\"cobalt-slider__value-container\">\n {renderValue(\n (sliderValue.length === 1 ? sliderValue[0] : sliderValue) as T,\n status\n )}\n </div>\n )}\n <ArkSlider.Control>\n <ArkSlider.Track>\n <ArkSlider.Range />\n </ArkSlider.Track>\n {sliderValue.map((_v, i) => (\n <ArkSlider.Thumb key={i} index={i}>\n <ArkSlider.HiddenInput />\n </ArkSlider.Thumb>\n ))}\n </ArkSlider.Control>\n </ArkSlider.Root>\n </FieldWrapper>\n )\n}\n\nexport default Slider\n\nexport const SliderValueMeta = ({ children }: PropsWithChildren) => {\n return <span className=\"cobalt-slider__value-meta\">{children}</span>\n}\n"],"names":["ArkSlider"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Slider.js","sources":["../../../src/components/Form/Slider.tsx"],"sourcesContent":["import React, { PropsWithChildren, useState } from \"react\"\nimport { Slider as ArkSlider, SliderRootProps } from \"@ark-ui/react\"\nimport cx from \"classnames\"\nimport { FieldWrapper, FieldWrapperProps } from \"./field\"\n\nexport type SliderPropsType<T extends number | number[]> = {\n /**\n * mandatory for A11y\n */\n value?: T\n defaultValue?: T\n ariaLabel: string\n /**\n * values interval\n */\n step?: number\n disabled?: boolean\n /**\n * Listener called when the value is changed\n */\n onValueChange?: (newValue: T) => void\n /**\n * Function used to visually display the slider value\n */\n renderValue?: (\n value: T,\n status: FieldWrapperProps[\"status\"]\n ) => React.ReactElement\n\n onFocus?: (event: React.FocusEvent<HTMLInputElement>) => void\n} & FieldWrapperProps &\n Omit<SliderRootProps, \"value\" | \"defaultValue\" | \"onValueChange\">\n\nconst Slider = <T extends number | number[]>({\n defaultValue: _defaultValue,\n value: _value,\n min,\n max,\n disabled,\n onValueChange,\n renderValue,\n ariaLabel,\n hint,\n label,\n status,\n className,\n ...restProps\n}: SliderPropsType<T>) => {\n const value: number[] | undefined = Array.isArray(_value)\n ? _value\n : _value !== undefined && !isNaN(_value)\n ? [_value]\n : undefined\n const defaultValue: number[] | undefined = Array.isArray(_defaultValue)\n ? _defaultValue\n : _defaultValue !== undefined && !isNaN(_defaultValue)\n ? [_defaultValue]\n : undefined\n function initValue(): number[] {\n if (value !== undefined) return value\n if (defaultValue !== undefined) return defaultValue\n if (min !== undefined) return [min]\n return [0]\n }\n\n const [sliderValue, setSliderValue] = useState(() => initValue())\n\n console.log(\"className\", className)\n\n return (\n <FieldWrapper {...restProps} status={status} label={label} hint={hint}>\n <ArkSlider.Root\n {...restProps}\n className={cx(\"cobalt-slider\", className, {\n \"cobalt-slider--disabled\": disabled,\n \"cobalt-slider--withHint\": hint,\n })}\n thumbAlignment=\"contain\"\n disabled={disabled}\n aria-label={[ariaLabel]}\n value={sliderValue}\n min={min}\n max={max}\n // Need to force disbplaying in smaller spaces like popovers\n thumbSize={{\n width: 24,\n height: 24,\n }}\n onValueChange={({ value: newValueArr }) => {\n setSliderValue(newValueArr)\n const newValue =\n newValueArr.length === 1 ? newValueArr[0] : newValueArr\n onValueChange && onValueChange(newValue as T)\n }}\n >\n <ArkSlider.Label className={FieldWrapper.labelClassName}>\n {label}\n </ArkSlider.Label>\n {renderValue && (\n <div className=\"cobalt-slider__value-container\">\n {renderValue(\n (sliderValue.length === 1 ? sliderValue[0] : sliderValue) as T,\n status\n )}\n </div>\n )}\n <ArkSlider.Control>\n <ArkSlider.Track>\n <ArkSlider.Range />\n </ArkSlider.Track>\n {sliderValue.map((_v, i) => (\n <ArkSlider.Thumb key={i} index={i}>\n <ArkSlider.HiddenInput />\n </ArkSlider.Thumb>\n ))}\n </ArkSlider.Control>\n </ArkSlider.Root>\n </FieldWrapper>\n )\n}\n\nexport default Slider\n\nexport const SliderValueMeta = ({ children }: PropsWithChildren) => {\n return <span className=\"cobalt-slider__value-meta\">{children}</span>\n}\n"],"names":["ArkSlider"],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -27,6 +27,7 @@ export type CalendarRangePickerPropsType = {
|
|
|
27
27
|
isDayDisabledFn?: (day: Date) => boolean;
|
|
28
28
|
hasDayNotificationFn?: (day: Date) => boolean;
|
|
29
29
|
isDayInvalidForSelectionFn?: (day: Date) => boolean;
|
|
30
|
+
dayHoverTooltipFn?: (day: Date) => string | undefined;
|
|
30
31
|
isSundayFirstDayOfWeek?: boolean;
|
|
31
32
|
hint?: {
|
|
32
33
|
status?: FormElementStatus;
|
|
@@ -37,4 +38,4 @@ export type CalendarRangePickerPropsType = {
|
|
|
37
38
|
onSelectDate?: (date: Date, isOutOfRange: boolean) => void;
|
|
38
39
|
locale?: Record<string, unknown>;
|
|
39
40
|
};
|
|
40
|
-
export declare function CalendarRangePicker({ rangeConstraints, firstMonthDate, numberOfMonths, hint, firstAvailableDate, lastAvailableDate, isEditingStartDate, isEditingEndDate, startDate, endDate, onChangeDate, onLeaveDate, onSelectDate, isDayDisabledFn, hasDayNotificationFn, isDayInvalidForSelectionFn, isSundayFirstDayOfWeek, locale, }: CalendarRangePickerPropsType): React.JSX.Element;
|
|
41
|
+
export declare function CalendarRangePicker({ rangeConstraints, firstMonthDate, numberOfMonths, hint, firstAvailableDate, lastAvailableDate, isEditingStartDate, isEditingEndDate, startDate, endDate, onChangeDate, onLeaveDate, onSelectDate, isDayDisabledFn, hasDayNotificationFn, isDayInvalidForSelectionFn, dayHoverTooltipFn, isSundayFirstDayOfWeek, locale, }: CalendarRangePickerPropsType): React.JSX.Element;
|
|
@@ -13,10 +13,11 @@ type CalendarRangePickerDayPropsType = {
|
|
|
13
13
|
isActive?: boolean;
|
|
14
14
|
hasNotification?: boolean;
|
|
15
15
|
tooltipMessage?: string;
|
|
16
|
+
hoverTooltipMessage?: string;
|
|
16
17
|
onSelect: (date: Date) => void;
|
|
17
18
|
onMouseEnter: (date: Date, disabled: boolean) => void;
|
|
18
19
|
onMouseLeave?: (date: Date) => void;
|
|
19
20
|
};
|
|
20
|
-
declare function CalendarRangePickerDay({ date, isToday, isStartDay, isEndDay, isSelected, isDisabled, isInvalid, isRange, isActive, hasNotification, tooltipMessage, onSelect, onMouseEnter, onMouseLeave, }: CalendarRangePickerDayPropsType): React.JSX.Element;
|
|
21
|
+
declare function CalendarRangePickerDay({ date, isToday, isStartDay, isEndDay, isSelected, isDisabled, isInvalid, isRange, isActive, hasNotification, tooltipMessage, onSelect, onMouseEnter, onMouseLeave, hoverTooltipMessage, }: CalendarRangePickerDayPropsType): React.JSX.Element;
|
|
21
22
|
declare const MemoizedComponent: React.MemoExoticComponent<typeof CalendarRangePickerDay>;
|
|
22
23
|
export { MemoizedComponent as CalendarRangePickerDay };
|
|
@@ -14,9 +14,10 @@ type CalendarRangePickerMonthPropsType = {
|
|
|
14
14
|
isDayDisabledFn?: CalendarRangePickerPropsType["isDayDisabledFn"];
|
|
15
15
|
hasDayNotificationFn?: CalendarRangePickerPropsType["hasDayNotificationFn"];
|
|
16
16
|
isDayInvalidForSelectionFn?: CalendarRangePickerPropsType["isDayInvalidForSelectionFn"];
|
|
17
|
+
dayHoverTooltipFn?: CalendarRangePickerPropsType["dayHoverTooltipFn"];
|
|
17
18
|
rangeConstraints?: RangeConstraintsInterface;
|
|
18
19
|
isSundayFirstDayOfWeek?: boolean;
|
|
19
20
|
locale: any;
|
|
20
21
|
};
|
|
21
|
-
export declare function CalendarRangePickerMonth({ date, onSelectDate, onChangeDate, onLeaveDate, startDate, endDate, isEditingStartDate, isEditingEndDate, firstAvailableDate, lastAvailableDate, isDayDisabledFn, isDayInvalidForSelectionFn, hasDayNotificationFn, rangeConstraints, isSundayFirstDayOfWeek, locale, }: CalendarRangePickerMonthPropsType): React.JSX.Element;
|
|
22
|
+
export declare function CalendarRangePickerMonth({ date, onSelectDate, onChangeDate, onLeaveDate, startDate, endDate, isEditingStartDate, isEditingEndDate, firstAvailableDate, lastAvailableDate, isDayDisabledFn, isDayInvalidForSelectionFn, hasDayNotificationFn, dayHoverTooltipFn, rangeConstraints, isSundayFirstDayOfWeek, locale, }: CalendarRangePickerMonthPropsType): React.JSX.Element;
|
|
22
23
|
export {};
|
|
@@ -1,21 +1,4 @@
|
|
|
1
1
|
import React from "react";
|
|
2
2
|
import { TippyProps } from "@tippyjs/react";
|
|
3
|
-
declare const DayTooltip:
|
|
4
|
-
(props: TippyProps): React.JSX.Element;
|
|
5
|
-
defaultProps: {
|
|
6
|
-
animation: string;
|
|
7
|
-
arrow: boolean;
|
|
8
|
-
interactive: boolean;
|
|
9
|
-
interactiveBorder: number;
|
|
10
|
-
placement: string;
|
|
11
|
-
theme: string;
|
|
12
|
-
delay: number[];
|
|
13
|
-
duration: number[];
|
|
14
|
-
maxWidth: number;
|
|
15
|
-
offset: number[];
|
|
16
|
-
sticky: boolean;
|
|
17
|
-
plugins: import("tippy.js").Sticky[];
|
|
18
|
-
appendTo: HTMLElement;
|
|
19
|
-
};
|
|
20
|
-
};
|
|
3
|
+
declare const DayTooltip: (props: TippyProps) => React.JSX.Element;
|
|
21
4
|
export default DayTooltip;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"getCobaltTailwindcssConfig.js","sources":["../../utils/getCobaltTailwindcssConfig.js?commonjs-entry"],"sourcesContent":["import { getDefaultExportFromCjs } from \"\u0000commonjsHelpers.js\";\nimport { __require as requireGetCobaltTailwindcssConfig } from \"/Users/
|
|
1
|
+
{"version":3,"file":"getCobaltTailwindcssConfig.js","sources":["../../utils/getCobaltTailwindcssConfig.js?commonjs-entry"],"sourcesContent":["import { getDefaultExportFromCjs } from \"\u0000commonjsHelpers.js\";\nimport { __require as requireGetCobaltTailwindcssConfig } from \"/Users/thibaudesnouf/sources/cobalt/utils/getCobaltTailwindcssConfig.js\";\nvar getCobaltTailwindcssConfigExports = requireGetCobaltTailwindcssConfig();\nexport { getCobaltTailwindcssConfigExports as __moduleExports };\nexport default /*@__PURE__*/getDefaultExportFromCjs(getCobaltTailwindcssConfigExports);"],"names":[],"mappings":";;;AAEA,IAAI,iCAAiC,GAAG,iCAAiC,EAAE,CAAC;AAE5E,iCAAe,aAAa,uBAAuB,CAAC,iCAAiC,CAAC;;;;"}
|