@economic/taco 2.47.0 → 2.48.0
Sign up to get free protection for your applications and to get access to all the features.
- package/dist/components/Calendar/Calendar.d.ts +0 -1
- package/dist/esm/packages/taco/src/components/Calendar/Calendar.js +10 -11
- package/dist/esm/packages/taco/src/components/Calendar/Calendar.js.map +1 -1
- package/dist/esm/packages/taco/src/components/Datepicker/useDatepicker.js +6 -13
- package/dist/esm/packages/taco/src/components/Datepicker/useDatepicker.js.map +1 -1
- package/dist/esm/packages/taco/src/components/Icon/components/Experiment.js +3 -2
- package/dist/esm/packages/taco/src/components/Icon/components/Experiment.js.map +1 -1
- package/dist/taco.cjs.development.js +19 -26
- package/dist/taco.cjs.development.js.map +1 -1
- package/dist/taco.cjs.production.min.js +1 -1
- package/dist/taco.cjs.production.min.js.map +1 -1
- package/package.json +2 -2
@@ -28,6 +28,5 @@ export declare type CalendarProps = Omit<React.HTMLAttributes<HTMLDivElement>, '
|
|
28
28
|
onChange: (date: Date, event?: React.MouseEvent<Element>) => void;
|
29
29
|
value?: Date;
|
30
30
|
disabledDays?: Matcher[];
|
31
|
-
visibleMonth?: Date;
|
32
31
|
};
|
33
32
|
export declare const Calendar: (props: CalendarProps) => JSX.Element;
|
@@ -93,23 +93,22 @@ const TodayButton = ({
|
|
93
93
|
}, texts.calendar.actions.today);
|
94
94
|
};
|
95
95
|
const Calendar = props => {
|
96
|
-
var _ref;
|
97
96
|
const {
|
98
97
|
onChange: handleChange,
|
99
98
|
value,
|
100
99
|
disabledDays,
|
101
|
-
visibleMonth,
|
102
100
|
...otherProps
|
103
101
|
} = props;
|
104
|
-
const [
|
102
|
+
const [visibleMonth, setVisibleMonth] = useState(value !== null && value !== void 0 ? value : new Date());
|
105
103
|
const {
|
106
104
|
texts
|
107
105
|
} = useLocalization();
|
108
106
|
useEffect(() => {
|
109
|
-
if (visibleMonth
|
110
|
-
|
107
|
+
if (visibleMonth !== value) {
|
108
|
+
setVisibleMonth(value !== null && value !== void 0 ? value : new Date());
|
111
109
|
}
|
112
|
-
|
110
|
+
// visibleMonth in deps array breaking month switching logic. It should not be in deps array.
|
111
|
+
}, [value]);
|
113
112
|
const handleDayClick = (date, modifiers, event) => {
|
114
113
|
if (modifiers.outside || modifiers.disabled) {
|
115
114
|
return;
|
@@ -123,13 +122,13 @@ const Calendar = props => {
|
|
123
122
|
className: className,
|
124
123
|
captionLayout: "dropdown-buttons",
|
125
124
|
weekStartsOn: 1,
|
126
|
-
month:
|
125
|
+
month: visibleMonth,
|
127
126
|
numberOfMonths: 1,
|
128
127
|
components: {
|
129
|
-
Caption: props =>
|
130
|
-
onMonthChange:
|
131
|
-
value:
|
132
|
-
}))
|
128
|
+
Caption: props => /*#__PURE__*/createElement(Navbar, Object.assign({}, props, {
|
129
|
+
onMonthChange: setVisibleMonth,
|
130
|
+
value: visibleMonth
|
131
|
+
})),
|
133
132
|
Footer: () => (/*#__PURE__*/createElement("tfoot", null, /*#__PURE__*/createElement("tr", null, /*#__PURE__*/createElement("td", {
|
134
133
|
colSpan: 7,
|
135
134
|
className: "text-center"
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"Calendar.js","sources":["../../../../../../../src/components/Calendar/Calendar.tsx"],"sourcesContent":["import * as React from 'react';\nimport cn from 'clsx';\nimport { Button, CaptionProps, DayClickEventHandler, DayPicker, Matcher } from 'react-day-picker';\nimport { useLocalization } from '../Provider/Localization';\nimport { IconButton } from '../IconButton/IconButton';\nimport { Tooltip } from '../Tooltip/Tooltip';\nimport './Calendar.css';\n\nexport type CalendarTextsActions = {\n /** Aria-label for previous month action button */\n previousMonth: string;\n /** Aria-label for next month action button */\n nextMonth: string;\n /** Aria-label for previous year action button */\n previousYear: string;\n /** Aria-label for next year action button */\n nextYear: string;\n /** Text displayed within today action button */\n today: string;\n};\n\nexport type CalendarTexts = {\n /** Text and aria-label for action buttons in Calendar */\n actions: CalendarTextsActions;\n /** Text abbreviation for months in Calendar's header, starting with January */\n months: string[];\n /** Text abbreviation for days in Calendar's header, starting with Sunday */\n weekdaysShort: string[];\n /** Text for days in Calendar's header, starting with Sunday */\n weekdays: string[];\n};\n\n/** @internal */\ntype CustomNavbarElementProps = {\n onMonthChange: (month: Date) => void;\n value?: Date;\n};\n\nconst thisYear = new Date().getFullYear();\nconst years: number[] = [];\n\nfor (let i = thisYear - 50; i <= thisYear + 10; i += 1) {\n years.push(i);\n}\n\nconst Navbar = React.memo(({ onMonthChange, value = new Date() }: CustomNavbarElementProps): JSX.Element => {\n const {\n texts: {\n calendar: { actions, months },\n },\n } = useLocalization();\n\n const handleChange = (event: React.ChangeEvent<HTMLSelectElement>) => {\n const { year, month } = event.target.form as HTMLFormElement;\n onMonthChange(new Date(year.value, month.value));\n };\n\n const onNextClick = () => {\n onMonthChange(new Date(value.getFullYear(), value.getMonth() + 1, value.getDay()));\n };\n\n const onPreviousClick = () => {\n onMonthChange(new Date(value.getFullYear(), value.getMonth() - 1, value.getDay()));\n };\n\n return (\n <div className=\"mb-3 flex items-center justify-between\">\n <form className=\"inline-flex space-x-1\">\n <select className=\"h-8 px-2\" name=\"month\" onChange={handleChange} value={value.getMonth()}>\n {months.map((month, i) => (\n <option key={month} value={i}>\n {month}\n </option>\n ))}\n </select>\n <select className=\"h-8 px-2\" name=\"year\" onChange={handleChange} value={value.getFullYear()}>\n {years.map(year => (\n <option key={year} value={year}>\n {String(year)}\n </option>\n ))}\n </select>\n </form>\n <div>\n <Tooltip title={actions.previousMonth}>\n <IconButton\n appearance=\"discrete\"\n icon=\"chevron-left\"\n aria-label={actions.previousMonth}\n onClick={onPreviousClick}\n rounded\n />\n </Tooltip>\n <Tooltip title={actions.nextMonth}>\n <IconButton\n appearance=\"discrete\"\n icon=\"chevron-right\"\n aria-label={actions.nextMonth}\n onClick={onNextClick}\n rounded\n />\n </Tooltip>\n </div>\n </div>\n );\n});\n\nexport type CalendarProps = Omit<React.HTMLAttributes<HTMLDivElement>, 'onChange' | 'value'> & {\n /** Handler called when a day is clicked in calendar */\n onChange: (date: Date, event?: React.MouseEvent<Element>) => void;\n value?: Date;\n disabledDays?: Matcher[];\n visibleMonth?: Date;\n};\n\nconst TodayButton = ({ handleChange }: { handleChange: (month: Date) => void }) => {\n const { texts } = useLocalization();\n\n const handleCalendarClickToday = (): void => {\n const today = new Date();\n\n // set to midday to avoid UTC offset causing dates to be mismatched server side\n today.setHours(12);\n today.setMinutes(0);\n today.setSeconds(0);\n\n handleChange(today);\n };\n return (\n <Button\n className=\"cursor-pointer border-none bg-transparent text-xs text-blue-500 hover:text-blue-300\"\n onClick={handleCalendarClickToday}>\n {texts.calendar.actions.today}\n </Button>\n );\n};\n\nexport const Calendar = (props: CalendarProps) => {\n const { onChange: handleChange, value, disabledDays, visibleMonth, ...otherProps } = props;\n const [internalVisibleMonth, setInternalVisibleMonth] = React.useState(visibleMonth ?? value ?? new Date());\n const { texts } = useLocalization();\n\n React.useEffect(() => {\n if (visibleMonth && visibleMonth !== internalVisibleMonth) {\n setInternalVisibleMonth(visibleMonth);\n }\n }, [visibleMonth]);\n\n const handleDayClick: DayClickEventHandler = (date, modifiers, event) => {\n if (modifiers.outside || modifiers.disabled) {\n return;\n }\n\n handleChange(date, event);\n };\n\n const className = cn('flex bg-white text-xs p-2', otherProps.className);\n\n return (\n <div data-taco=\"calendar\">\n <DayPicker\n className={className}\n captionLayout=\"dropdown-buttons\"\n weekStartsOn={1}\n month={internalVisibleMonth}\n numberOfMonths={1}\n components={{\n Caption: (props: CaptionProps) => (\n <Navbar {...props} onMonthChange={setInternalVisibleMonth} value={internalVisibleMonth} />\n ),\n Footer: () => (\n <tfoot>\n <tr>\n <td colSpan={7} className=\"text-center\">\n <TodayButton handleChange={handleChange} />\n </td>\n </tr>\n </tfoot>\n ),\n HeadRow: () => (\n <tr>\n {texts.calendar.weekdaysShort.map((weekday, index) => {\n const label = texts.calendar.weekdays && texts.calendar.weekdays[index];\n return (\n <th key={weekday} aria-label={label} className=\"rdp-head_cell\" title={label}>\n {weekday}\n </th>\n );\n })}\n </tr>\n ),\n }}\n onDayClick={handleDayClick}\n selected={value}\n disabled={disabledDays}\n />\n </div>\n );\n};\n"],"names":["thisYear","Date","getFullYear","years","i","push","Navbar","React","onMonthChange","value","texts","calendar","actions","months","useLocalization","handleChange","event","year","month","target","form","onNextClick","getMonth","getDay","onPreviousClick","className","name","onChange","map","key","String","Tooltip","title","previousMonth","IconButton","appearance","icon","onClick","rounded","nextMonth","TodayButton","handleCalendarClickToday","today","setHours","setMinutes","setSeconds","Button","Calendar","props","disabledDays","visibleMonth","otherProps","internalVisibleMonth","setInternalVisibleMonth","_ref","handleDayClick","date","modifiers","outside","disabled","cn","DayPicker","captionLayout","weekStartsOn","numberOfMonths","components","Caption","Footer","colSpan","HeadRow","weekdaysShort","weekday","index","label","weekdays","onDayClick","selected"],"mappings":"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"}
|
1
|
+
{"version":3,"file":"Calendar.js","sources":["../../../../../../../src/components/Calendar/Calendar.tsx"],"sourcesContent":["import * as React from 'react';\nimport cn from 'clsx';\nimport { Button, CaptionProps, DayClickEventHandler, DayPicker, Matcher } from 'react-day-picker';\nimport { useLocalization } from '../Provider/Localization';\nimport { IconButton } from '../IconButton/IconButton';\nimport { Tooltip } from '../Tooltip/Tooltip';\nimport './Calendar.css';\n\nexport type CalendarTextsActions = {\n /** Aria-label for previous month action button */\n previousMonth: string;\n /** Aria-label for next month action button */\n nextMonth: string;\n /** Aria-label for previous year action button */\n previousYear: string;\n /** Aria-label for next year action button */\n nextYear: string;\n /** Text displayed within today action button */\n today: string;\n};\n\nexport type CalendarTexts = {\n /** Text and aria-label for action buttons in Calendar */\n actions: CalendarTextsActions;\n /** Text abbreviation for months in Calendar's header, starting with January */\n months: string[];\n /** Text abbreviation for days in Calendar's header, starting with Sunday */\n weekdaysShort: string[];\n /** Text for days in Calendar's header, starting with Sunday */\n weekdays: string[];\n};\n\n/** @internal */\ntype CustomNavbarElementProps = {\n onMonthChange: (month: Date) => void;\n value?: Date;\n};\n\nconst thisYear = new Date().getFullYear();\nconst years: number[] = [];\n\nfor (let i = thisYear - 50; i <= thisYear + 10; i += 1) {\n years.push(i);\n}\n\nconst Navbar = React.memo(({ onMonthChange, value = new Date() }: CustomNavbarElementProps): JSX.Element => {\n const {\n texts: {\n calendar: { actions, months },\n },\n } = useLocalization();\n\n const handleChange = (event: React.ChangeEvent<HTMLSelectElement>) => {\n const { year, month } = event.target.form as HTMLFormElement;\n onMonthChange(new Date(year.value, month.value));\n };\n\n const onNextClick = () => {\n onMonthChange(new Date(value.getFullYear(), value.getMonth() + 1, value.getDay()));\n };\n\n const onPreviousClick = () => {\n onMonthChange(new Date(value.getFullYear(), value.getMonth() - 1, value.getDay()));\n };\n\n return (\n <div className=\"mb-3 flex items-center justify-between\">\n <form className=\"inline-flex space-x-1\">\n <select className=\"h-8 px-2\" name=\"month\" onChange={handleChange} value={value.getMonth()}>\n {months.map((month, i) => (\n <option key={month} value={i}>\n {month}\n </option>\n ))}\n </select>\n <select className=\"h-8 px-2\" name=\"year\" onChange={handleChange} value={value.getFullYear()}>\n {years.map(year => (\n <option key={year} value={year}>\n {String(year)}\n </option>\n ))}\n </select>\n </form>\n <div>\n <Tooltip title={actions.previousMonth}>\n <IconButton\n appearance=\"discrete\"\n icon=\"chevron-left\"\n aria-label={actions.previousMonth}\n onClick={onPreviousClick}\n rounded\n />\n </Tooltip>\n <Tooltip title={actions.nextMonth}>\n <IconButton\n appearance=\"discrete\"\n icon=\"chevron-right\"\n aria-label={actions.nextMonth}\n onClick={onNextClick}\n rounded\n />\n </Tooltip>\n </div>\n </div>\n );\n});\n\nexport type CalendarProps = Omit<React.HTMLAttributes<HTMLDivElement>, 'onChange' | 'value'> & {\n /** Handler called when a day is clicked in calendar */\n onChange: (date: Date, event?: React.MouseEvent<Element>) => void;\n value?: Date;\n disabledDays?: Matcher[];\n};\n\nconst TodayButton = ({ handleChange }: { handleChange: (month: Date) => void }) => {\n const { texts } = useLocalization();\n\n const handleCalendarClickToday = (): void => {\n const today = new Date();\n\n // set to midday to avoid UTC offset causing dates to be mismatched server side\n today.setHours(12);\n today.setMinutes(0);\n today.setSeconds(0);\n\n handleChange(today);\n };\n return (\n <Button\n className=\"cursor-pointer border-none bg-transparent text-xs text-blue-500 hover:text-blue-300\"\n onClick={handleCalendarClickToday}>\n {texts.calendar.actions.today}\n </Button>\n );\n};\n\nexport const Calendar = (props: CalendarProps) => {\n const { onChange: handleChange, value, disabledDays, ...otherProps } = props;\n const [visibleMonth, setVisibleMonth] = React.useState(value ?? new Date());\n const { texts } = useLocalization();\n\n React.useEffect(() => {\n if (visibleMonth !== value) {\n setVisibleMonth(value ?? new Date());\n }\n // visibleMonth in deps array breaking month switching logic. It should not be in deps array.\n }, [value]);\n\n const handleDayClick: DayClickEventHandler = (date, modifiers, event) => {\n if (modifiers.outside || modifiers.disabled) {\n return;\n }\n\n handleChange(date, event);\n };\n\n const className = cn('flex bg-white text-xs p-2', otherProps.className);\n\n return (\n <div data-taco=\"calendar\">\n <DayPicker\n className={className}\n captionLayout=\"dropdown-buttons\"\n weekStartsOn={1}\n month={visibleMonth}\n numberOfMonths={1}\n components={{\n Caption: (props: CaptionProps) => <Navbar {...props} onMonthChange={setVisibleMonth} value={visibleMonth} />,\n Footer: () => (\n <tfoot>\n <tr>\n <td colSpan={7} className=\"text-center\">\n <TodayButton handleChange={handleChange} />\n </td>\n </tr>\n </tfoot>\n ),\n HeadRow: () => (\n <tr>\n {texts.calendar.weekdaysShort.map((weekday, index) => {\n const label = texts.calendar.weekdays && texts.calendar.weekdays[index];\n return (\n <th key={weekday} aria-label={label} className=\"rdp-head_cell\" title={label}>\n {weekday}\n </th>\n );\n })}\n </tr>\n ),\n }}\n onDayClick={handleDayClick}\n selected={value}\n disabled={disabledDays}\n />\n </div>\n );\n};\n"],"names":["thisYear","Date","getFullYear","years","i","push","Navbar","React","onMonthChange","value","texts","calendar","actions","months","useLocalization","handleChange","event","year","month","target","form","onNextClick","getMonth","getDay","onPreviousClick","className","name","onChange","map","key","String","Tooltip","title","previousMonth","IconButton","appearance","icon","onClick","rounded","nextMonth","TodayButton","handleCalendarClickToday","today","setHours","setMinutes","setSeconds","Button","Calendar","props","disabledDays","otherProps","visibleMonth","setVisibleMonth","handleDayClick","date","modifiers","outside","disabled","cn","DayPicker","captionLayout","weekStartsOn","numberOfMonths","components","Caption","Footer","colSpan","HeadRow","weekdaysShort","weekday","index","label","weekdays","onDayClick","selected"],"mappings":"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"}
|
@@ -19,18 +19,14 @@ const useDatepicker = ({
|
|
19
19
|
} = useLocalization();
|
20
20
|
const [internalValue, setInternalValue] = useState((_format = format(value, formatting.date)) !== null && _format !== void 0 ? _format : '');
|
21
21
|
const originalValueAsDate = parse(value);
|
22
|
-
//
|
23
|
-
const [calendarViewDate, setCalendarViewDate] = useState(originalValueAsDate || new Date());
|
22
|
+
// update internal value if it changed 'externally'
|
24
23
|
useEffect(() => {
|
25
|
-
|
26
|
-
|
27
|
-
|
28
|
-
const formattedValue = format(value, formatting.date);
|
29
|
-
if (formattedValue !== internalValue) {
|
30
|
-
setInternalValue(formattedValue !== null && formattedValue !== void 0 ? formattedValue : '');
|
31
|
-
}
|
24
|
+
const formattedValue = format(value, formatting.date);
|
25
|
+
if (formattedValue !== internalValue) {
|
26
|
+
setInternalValue(formattedValue !== null && formattedValue !== void 0 ? formattedValue : '');
|
32
27
|
}
|
33
28
|
}, [value]);
|
29
|
+
// event handlers
|
34
30
|
const handleInputBlur = event => {
|
35
31
|
event.persist();
|
36
32
|
const valueAsDate = parseFromCustomString(event.target.value, 'dd.mm.yy', originalValueAsDate === null || originalValueAsDate === void 0 ? void 0 : originalValueAsDate.getMonth(), originalValueAsDate === null || originalValueAsDate === void 0 ? void 0 : originalValueAsDate.getFullYear());
|
@@ -51,8 +47,6 @@ const useDatepicker = ({
|
|
51
47
|
setInternalValue(event.target.value);
|
52
48
|
};
|
53
49
|
const handleChange = date => {
|
54
|
-
// Update both the input value and calendar view date when selecting a date
|
55
|
-
setCalendarViewDate(date);
|
56
50
|
setInputValueByRef(inputRef.current, format(date, formatting.date), 'focusout');
|
57
51
|
};
|
58
52
|
const handleKeyDown = event => {
|
@@ -78,8 +72,7 @@ const useDatepicker = ({
|
|
78
72
|
const calendarProps = {
|
79
73
|
...calendar,
|
80
74
|
onChange: handleChange,
|
81
|
-
value: originalValueAsDate
|
82
|
-
visibleMonth: calendarViewDate
|
75
|
+
value: originalValueAsDate
|
83
76
|
};
|
84
77
|
return {
|
85
78
|
input: inputProps,
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"useDatepicker.js","sources":["../../../../../../../src/components/Datepicker/useDatepicker.tsx"],"sourcesContent":["import * as React from 'react';\nimport { parseFromCustomString, format, parse } from '../../utils/date';\nimport { useLocalization } from '../Provider/Localization';\nimport { setInputValueByRef } from '../../utils/input';\nimport { useMergedRef } from '../../hooks/useMergedRef';\nimport { DatepickerProps } from './Datepicker';\nimport { CalendarProps } from '../Calendar/Calendar';\nimport { InputProps as BaseInputProps } from '../Input/Input';\n\ntype InputProps = BaseInputProps & { ref: React.RefObject<HTMLInputElement> };\ntype useDatepicker = React.HTMLAttributes<HTMLDivElement> & {\n calendar: CalendarProps;\n input: InputProps;\n};\n\nexport const useDatepicker = (\n { defaultValue: _, calendar, onBlur, onChange, value, ...props }: DatepickerProps,\n ref: React.Ref<HTMLInputElement>\n): useDatepicker => {\n const inputRef = useMergedRef<HTMLInputElement>(ref);\n const { formatting } = useLocalization();\n const [internalValue, setInternalValue] = React.useState(format(value, formatting.date) ?? '');\n const originalValueAsDate = parse(value);\n\n //
|
1
|
+
{"version":3,"file":"useDatepicker.js","sources":["../../../../../../../src/components/Datepicker/useDatepicker.tsx"],"sourcesContent":["import * as React from 'react';\nimport { parseFromCustomString, format, parse } from '../../utils/date';\nimport { useLocalization } from '../Provider/Localization';\nimport { setInputValueByRef } from '../../utils/input';\nimport { useMergedRef } from '../../hooks/useMergedRef';\nimport { DatepickerProps } from './Datepicker';\nimport { CalendarProps } from '../Calendar/Calendar';\nimport { InputProps as BaseInputProps } from '../Input/Input';\n\ntype InputProps = BaseInputProps & { ref: React.RefObject<HTMLInputElement> };\ntype useDatepicker = React.HTMLAttributes<HTMLDivElement> & {\n calendar: CalendarProps;\n input: InputProps;\n};\n\nexport const useDatepicker = (\n { defaultValue: _, calendar, onBlur, onChange, value, ...props }: DatepickerProps,\n ref: React.Ref<HTMLInputElement>\n): useDatepicker => {\n const inputRef = useMergedRef<HTMLInputElement>(ref);\n const { formatting } = useLocalization();\n const [internalValue, setInternalValue] = React.useState(format(value, formatting.date) ?? '');\n const originalValueAsDate = parse(value);\n\n // update internal value if it changed 'externally'\n React.useEffect(() => {\n const formattedValue = format(value, formatting.date);\n\n if (formattedValue !== internalValue) {\n setInternalValue(formattedValue ?? '');\n }\n }, [value]);\n\n // event handlers\n const handleInputBlur = (event: React.FocusEvent<HTMLInputElement>): void => {\n event.persist();\n\n const valueAsDate = parseFromCustomString(\n event.target.value,\n 'dd.mm.yy',\n originalValueAsDate?.getMonth(),\n originalValueAsDate?.getFullYear()\n );\n const formattedValue = valueAsDate ? format(valueAsDate) || '' : '';\n\n event.target.value = formattedValue;\n\n if (onChange) {\n (event as any).detail = valueAsDate;\n onChange(event);\n } else {\n // update the internal value to use the formatted date\n setInternalValue(formattedValue);\n }\n\n if (onBlur) {\n onBlur(event);\n }\n };\n\n const handleInputChange = (event: React.ChangeEvent<HTMLInputElement>): void => {\n setInternalValue(event.target.value);\n };\n\n const handleChange = date => {\n setInputValueByRef(inputRef.current, format(date, formatting.date), 'focusout');\n };\n\n const handleKeyDown = (event: React.KeyboardEvent<HTMLInputElement>) => {\n if (props.onKeyDown) {\n props.onKeyDown(event);\n }\n\n if (event.key === 'Enter') {\n event.target.dispatchEvent(new Event('focusout', { bubbles: true }));\n }\n };\n\n const inputProps: InputProps = {\n ...props,\n autoComplete: 'off',\n onBlur: handleInputBlur,\n onChange: handleInputChange,\n onKeyDown: handleKeyDown,\n ref: inputRef,\n type: 'text',\n value: internalValue,\n };\n\n const calendarProps: CalendarProps = {\n ...calendar,\n onChange: handleChange,\n value: originalValueAsDate,\n };\n\n return {\n input: inputProps,\n calendar: calendarProps,\n };\n};\n"],"names":["useDatepicker","defaultValue","_","calendar","onBlur","onChange","value","props","ref","inputRef","useMergedRef","formatting","useLocalization","internalValue","setInternalValue","React","_format","format","date","originalValueAsDate","parse","formattedValue","handleInputBlur","event","persist","valueAsDate","parseFromCustomString","target","getMonth","getFullYear","detail","handleInputChange","handleChange","setInputValueByRef","current","handleKeyDown","onKeyDown","key","dispatchEvent","Event","bubbles","inputProps","autoComplete","type","calendarProps","input"],"mappings":"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"}
|
@@ -9,8 +9,9 @@ function IconExperiment(props, svgRef) {
|
|
9
9
|
}, props), /*#__PURE__*/createElement("path", {
|
10
10
|
fillRule: "evenodd",
|
11
11
|
clipRule: "evenodd",
|
12
|
-
d: "
|
13
|
-
fill: "currentColor"
|
12
|
+
d: "M8.962 9.26V5.313h2.843V9.28c0 .376.796 1.24 1.049 1.511L14.5 12.5c-.507.218-3.166-1.19-4.341-.211C7.159 14.789 6 13 6.5 12c.316-.632 2.462-1.803 2.462-2.74zm.24-4.469a.762.762 0 00-.752.772v3.696a.61.61 0 01-.177.43l-2.592 2.6c-.911.913-.281 2.502.992 2.502h7.154c1.25 0 1.89-1.538 1.027-2.466l-2.446-2.63a.61.61 0 01-.162-.415V5.563a.762.762 0 00-.752-.772H9.202z",
|
13
|
+
fill: "currentColor",
|
14
|
+
stroke: "currentColor"
|
14
15
|
}));
|
15
16
|
}
|
16
17
|
var Experiment = /*#__PURE__*/forwardRef(IconExperiment);
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"Experiment.js","sources":["../../../../../../../../src/components/Icon/components/Experiment.tsx"],"sourcesContent":["import * as React from 'react';\nfunction IconExperiment(props: React.SVGProps<SVGSVGElement>, svgRef?: React.Ref<SVGSVGElement>): JSX.Element {\n return (\n <svg fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\" ref={svgRef} {...props}>\n <path\n fillRule=\"evenodd\"\n clipRule=\"evenodd\"\n d=\"
|
1
|
+
{"version":3,"file":"Experiment.js","sources":["../../../../../../../../src/components/Icon/components/Experiment.tsx"],"sourcesContent":["import * as React from 'react';\nfunction IconExperiment(props: React.SVGProps<SVGSVGElement>, svgRef?: React.Ref<SVGSVGElement>): JSX.Element {\n return (\n <svg fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\" ref={svgRef} {...props}>\n <path\n fillRule=\"evenodd\"\n clipRule=\"evenodd\"\n d=\"M8.962 9.26V5.313h2.843V9.28c0 .376.796 1.24 1.049 1.511L14.5 12.5c-.507.218-3.166-1.19-4.341-.211C7.159 14.789 6 13 6.5 12c.316-.632 2.462-1.803 2.462-2.74zm.24-4.469a.762.762 0 00-.752.772v3.696a.61.61 0 01-.177.43l-2.592 2.6c-.911.913-.281 2.502.992 2.502h7.154c1.25 0 1.89-1.538 1.027-2.466l-2.446-2.63a.61.61 0 01-.162-.415V5.563a.762.762 0 00-.752-.772H9.202z\"\n fill=\"currentColor\"\n stroke=\"currentColor\"\n />\n </svg>\n );\n}\nexport default React.forwardRef(IconExperiment);\n"],"names":["IconExperiment","props","svgRef","React","fill","xmlns","viewBox","ref","fillRule","clipRule","d","stroke"],"mappings":";;AACA,SAASA,cAAcA,CAACC,KAAoC,EAAEC,MAAiC;EAC3F,oBACIC;IAAKC,IAAI,EAAC,MAAM;IAACC,KAAK,EAAC,4BAA4B;IAACC,OAAO,EAAC,WAAW;IAACC,GAAG,EAAEL;KAAYD,KAAK,gBAC1FE;IACIK,QAAQ,EAAC,SAAS;IAClBC,QAAQ,EAAC,SAAS;IAClBC,CAAC,EAAC,+WAA+W;IACjXN,IAAI,EAAC,cAAc;IACnBO,MAAM,EAAC;IACT,CACA;AAEd;AACA,8BAAeR,UAAgB,CAACH,cAAc,CAAC;;;;"}
|
@@ -1626,8 +1626,9 @@ function IconExperiment(props, svgRef) {
|
|
1626
1626
|
}, props), /*#__PURE__*/React.createElement("path", {
|
1627
1627
|
fillRule: "evenodd",
|
1628
1628
|
clipRule: "evenodd",
|
1629
|
-
d: "
|
1630
|
-
fill: "currentColor"
|
1629
|
+
d: "M8.962 9.26V5.313h2.843V9.28c0 .376.796 1.24 1.049 1.511L14.5 12.5c-.507.218-3.166-1.19-4.341-.211C7.159 14.789 6 13 6.5 12c.316-.632 2.462-1.803 2.462-2.74zm.24-4.469a.762.762 0 00-.752.772v3.696a.61.61 0 01-.177.43l-2.592 2.6c-.911.913-.281 2.502.992 2.502h7.154c1.25 0 1.89-1.538 1.027-2.466l-2.446-2.63a.61.61 0 01-.162-.415V5.563a.762.762 0 00-.752-.772H9.202z",
|
1630
|
+
fill: "currentColor",
|
1631
|
+
stroke: "currentColor"
|
1631
1632
|
}));
|
1632
1633
|
}
|
1633
1634
|
var Experiment = /*#__PURE__*/React.forwardRef(IconExperiment);
|
@@ -5099,23 +5100,22 @@ const TodayButton = ({
|
|
5099
5100
|
}, texts.calendar.actions.today);
|
5100
5101
|
};
|
5101
5102
|
const Calendar$1 = props => {
|
5102
|
-
var _ref;
|
5103
5103
|
const {
|
5104
5104
|
onChange: handleChange,
|
5105
5105
|
value,
|
5106
5106
|
disabledDays,
|
5107
|
-
visibleMonth,
|
5108
5107
|
...otherProps
|
5109
5108
|
} = props;
|
5110
|
-
const [
|
5109
|
+
const [visibleMonth, setVisibleMonth] = React.useState(value !== null && value !== void 0 ? value : new Date());
|
5111
5110
|
const {
|
5112
5111
|
texts
|
5113
5112
|
} = useLocalization();
|
5114
5113
|
React.useEffect(() => {
|
5115
|
-
if (visibleMonth
|
5116
|
-
|
5114
|
+
if (visibleMonth !== value) {
|
5115
|
+
setVisibleMonth(value !== null && value !== void 0 ? value : new Date());
|
5117
5116
|
}
|
5118
|
-
|
5117
|
+
// visibleMonth in deps array breaking month switching logic. It should not be in deps array.
|
5118
|
+
}, [value]);
|
5119
5119
|
const handleDayClick = (date, modifiers, event) => {
|
5120
5120
|
if (modifiers.outside || modifiers.disabled) {
|
5121
5121
|
return;
|
@@ -5129,13 +5129,13 @@ const Calendar$1 = props => {
|
|
5129
5129
|
className: className,
|
5130
5130
|
captionLayout: "dropdown-buttons",
|
5131
5131
|
weekStartsOn: 1,
|
5132
|
-
month:
|
5132
|
+
month: visibleMonth,
|
5133
5133
|
numberOfMonths: 1,
|
5134
5134
|
components: {
|
5135
|
-
Caption: props =>
|
5136
|
-
onMonthChange:
|
5137
|
-
value:
|
5138
|
-
}))
|
5135
|
+
Caption: props => /*#__PURE__*/React.createElement(Navbar, Object.assign({}, props, {
|
5136
|
+
onMonthChange: setVisibleMonth,
|
5137
|
+
value: visibleMonth
|
5138
|
+
})),
|
5139
5139
|
Footer: () => (/*#__PURE__*/React.createElement("tfoot", null, /*#__PURE__*/React.createElement("tr", null, /*#__PURE__*/React.createElement("td", {
|
5140
5140
|
colSpan: 7,
|
5141
5141
|
className: "text-center"
|
@@ -6390,18 +6390,14 @@ const useDatepicker = ({
|
|
6390
6390
|
} = useLocalization();
|
6391
6391
|
const [internalValue, setInternalValue] = React.useState((_format = format(value, formatting.date)) !== null && _format !== void 0 ? _format : '');
|
6392
6392
|
const originalValueAsDate = parse(value);
|
6393
|
-
//
|
6394
|
-
const [calendarViewDate, setCalendarViewDate] = React.useState(originalValueAsDate || new Date());
|
6393
|
+
// update internal value if it changed 'externally'
|
6395
6394
|
React.useEffect(() => {
|
6396
|
-
|
6397
|
-
|
6398
|
-
|
6399
|
-
const formattedValue = format(value, formatting.date);
|
6400
|
-
if (formattedValue !== internalValue) {
|
6401
|
-
setInternalValue(formattedValue !== null && formattedValue !== void 0 ? formattedValue : '');
|
6402
|
-
}
|
6395
|
+
const formattedValue = format(value, formatting.date);
|
6396
|
+
if (formattedValue !== internalValue) {
|
6397
|
+
setInternalValue(formattedValue !== null && formattedValue !== void 0 ? formattedValue : '');
|
6403
6398
|
}
|
6404
6399
|
}, [value]);
|
6400
|
+
// event handlers
|
6405
6401
|
const handleInputBlur = event => {
|
6406
6402
|
event.persist();
|
6407
6403
|
const valueAsDate = parseFromCustomString(event.target.value, 'dd.mm.yy', originalValueAsDate === null || originalValueAsDate === void 0 ? void 0 : originalValueAsDate.getMonth(), originalValueAsDate === null || originalValueAsDate === void 0 ? void 0 : originalValueAsDate.getFullYear());
|
@@ -6422,8 +6418,6 @@ const useDatepicker = ({
|
|
6422
6418
|
setInternalValue(event.target.value);
|
6423
6419
|
};
|
6424
6420
|
const handleChange = date => {
|
6425
|
-
// Update both the input value and calendar view date when selecting a date
|
6426
|
-
setCalendarViewDate(date);
|
6427
6421
|
setInputValueByRef(inputRef.current, format(date, formatting.date), 'focusout');
|
6428
6422
|
};
|
6429
6423
|
const handleKeyDown = event => {
|
@@ -6449,8 +6443,7 @@ const useDatepicker = ({
|
|
6449
6443
|
const calendarProps = {
|
6450
6444
|
...calendar,
|
6451
6445
|
onChange: handleChange,
|
6452
|
-
value: originalValueAsDate
|
6453
|
-
visibleMonth: calendarViewDate
|
6446
|
+
value: originalValueAsDate
|
6454
6447
|
};
|
6455
6448
|
return {
|
6456
6449
|
input: inputProps,
|