@economic/taco 2.47.0 → 2.48.0
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/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":";;;;;;;AAsCA,MAAMA,QAAQ,gBAAG,IAAIC,IAAI,EAAE,CAACC,WAAW,EAAE;AACzC,MAAMC,KAAK,GAAa,EAAE;AAE1B,KAAK,IAAIC,CAAC,GAAGJ,QAAQ,GAAG,EAAE,EAAEI,CAAC,IAAIJ,QAAQ,GAAG,EAAE,EAAEI,CAAC,IAAI,CAAC,EAAE;EACpDD,KAAK,CAACE,IAAI,CAACD,CAAC,CAAC;;AAGjB,MAAME,MAAM,gBAAGC,IAAU,CAAC,CAAC;EAAEC,aAAa;EAAEC,KAAK,GAAG,IAAIR,IAAI;CAA8B;EACtF,MAAM;IACFS,KAAK,EAAE;MACHC,QAAQ,EAAE;QAAEC,OAAO;QAAEC;;;GAE5B,GAAGC,eAAe,EAAE;EAErB,MAAMC,YAAY,GAAIC,KAA2C;IAC7D,MAAM;MAAEC,IAAI;MAAEC;KAAO,GAAGF,KAAK,CAACG,MAAM,CAACC,IAAuB;IAC5DZ,aAAa,CAAC,IAAIP,IAAI,CAACgB,IAAI,CAACR,KAAK,EAAES,KAAK,CAACT,KAAK,CAAC,CAAC;GACnD;EAED,MAAMY,WAAW,GAAGA;IAChBb,aAAa,CAAC,IAAIP,IAAI,CAACQ,KAAK,CAACP,WAAW,EAAE,EAAEO,KAAK,CAACa,QAAQ,EAAE,GAAG,CAAC,EAAEb,KAAK,CAACc,MAAM,EAAE,CAAC,CAAC;GACrF;EAED,MAAMC,eAAe,GAAGA;IACpBhB,aAAa,CAAC,IAAIP,IAAI,CAACQ,KAAK,CAACP,WAAW,EAAE,EAAEO,KAAK,CAACa,QAAQ,EAAE,GAAG,CAAC,EAAEb,KAAK,CAACc,MAAM,EAAE,CAAC,CAAC;GACrF;EAED,oBACIhB;IAAKkB,SAAS,EAAC;kBACXlB;IAAMkB,SAAS,EAAC;kBACZlB;IAAQkB,SAAS,EAAC,UAAU;IAACC,IAAI,EAAC,OAAO;IAACC,QAAQ,EAAEZ,YAAY;IAAEN,KAAK,EAAEA,KAAK,CAACa,QAAQ;KAClFT,MAAM,CAACe,GAAG,CAAC,CAACV,KAAK,EAAEd,CAAC,mBACjBG;IAAQsB,GAAG,EAAEX,KAAK;IAAET,KAAK,EAAEL;KACtBc,KAAK,CACD,CACZ,CAAC,CACG,eACTX;IAAQkB,SAAS,EAAC,UAAU;IAACC,IAAI,EAAC,MAAM;IAACC,QAAQ,EAAEZ,YAAY;IAAEN,KAAK,EAAEA,KAAK,CAACP,WAAW;KACpFC,KAAK,CAACyB,GAAG,CAACX,IAAI,kBACXV;IAAQsB,GAAG,EAAEZ,IAAI;IAAER,KAAK,EAAEQ;KACrBa,MAAM,CAACb,IAAI,CAAC,CACR,CACZ,CAAC,CACG,CACN,eACPV,wCACIA,cAACwB,OAAO;IAACC,KAAK,EAAEpB,OAAO,CAACqB;kBACpB1B,cAAC2B,UAAU;IACPC,UAAU,EAAC,UAAU;IACrBC,IAAI,EAAC,cAAc;kBACPxB,OAAO,CAACqB,aAAa;IACjCI,OAAO,EAAEb,eAAe;IACxBc,OAAO;IACT,CACI,eACV/B,cAACwB,OAAO;IAACC,KAAK,EAAEpB,OAAO,CAAC2B;kBACpBhC,cAAC2B,UAAU;IACPC,UAAU,EAAC,UAAU;IACrBC,IAAI,EAAC,eAAe;kBACRxB,OAAO,CAAC2B,SAAS;IAC7BF,OAAO,EAAEhB,WAAW;IACpBiB,OAAO;IACT,CACI,CACR,CACJ;AAEd,CAAC,CAAC;AAUF,MAAME,WAAW,GAAGA,CAAC;EAAEzB;CAAuD;EAC1E,MAAM;IAAEL;GAAO,GAAGI,eAAe,EAAE;EAEnC,MAAM2B,wBAAwB,GAAGA;IAC7B,MAAMC,KAAK,GAAG,IAAIzC,IAAI,EAAE;;IAGxByC,KAAK,CAACC,QAAQ,CAAC,EAAE,CAAC;IAClBD,KAAK,CAACE,UAAU,CAAC,CAAC,CAAC;IACnBF,KAAK,CAACG,UAAU,CAAC,CAAC,CAAC;IAEnB9B,YAAY,CAAC2B,KAAK,CAAC;GACtB;EACD,oBACInC,cAACuC,MAAM;IACHrB,SAAS,EAAC,qFAAqF;IAC/FY,OAAO,EAAEI;KACR/B,KAAK,CAACC,QAAQ,CAACC,OAAO,CAAC8B,KAAK,CACxB;AAEjB,CAAC;MAEYK,QAAQ,GAAIC,KAAoB;;EACzC,MAAM;IAAErB,QAAQ,EAAEZ,YAAY;IAAEN,KAAK;IAAEwC,YAAY;IAAEC,YAAY;IAAE,GAAGC;GAAY,GAAGH,KAAK;EAC1F,MAAM,CAACI,oBAAoB,EAAEC,uBAAuB,CAAC,GAAG9C,QAAc,EAAA+C,IAAA,GAACJ,YAAY,aAAZA,YAAY,cAAZA,YAAY,GAAIzC,KAAK,cAAA6C,IAAA,cAAAA,IAAA,GAAI,IAAIrD,IAAI,EAAE,CAAC;EAC3G,MAAM;IAAES;GAAO,GAAGI,eAAe,EAAE;EAEnCP,SAAe,CAAC;IACZ,IAAI2C,YAAY,IAAIA,YAAY,KAAKE,oBAAoB,EAAE;MACvDC,uBAAuB,CAACH,YAAY,CAAC;;GAE5C,EAAE,CAACA,YAAY,CAAC,CAAC;EAElB,MAAMK,cAAc,GAAyBA,CAACC,IAAI,EAAEC,SAAS,EAAEzC,KAAK;IAChE,IAAIyC,SAAS,CAACC,OAAO,IAAID,SAAS,CAACE,QAAQ,EAAE;MACzC;;IAGJ5C,YAAY,CAACyC,IAAI,EAAExC,KAAK,CAAC;GAC5B;EAED,MAAMS,SAAS,GAAGmC,EAAE,CAAC,2BAA2B,EAAET,UAAU,CAAC1B,SAAS,CAAC;EAEvE,oBACIlB;iBAAe;kBACXA,cAACsD,SAAS;IACNpC,SAAS,EAAEA,SAAS;IACpBqC,aAAa,EAAC,kBAAkB;IAChCC,YAAY,EAAE,CAAC;IACf7C,KAAK,EAAEkC,oBAAoB;IAC3BY,cAAc,EAAE,CAAC;IACjBC,UAAU,EAAE;MACRC,OAAO,EAAGlB,KAAmB,kBACzBzC,cAACD,MAAM,oBAAK0C,KAAK;QAAExC,aAAa,EAAE6C,uBAAuB;QAAE5C,KAAK,EAAE2C;SAAwB,CAC7F;MACDe,MAAM,EAAEA,oBACJ5D,0CACIA,uCACIA;QAAI6D,OAAO,EAAE,CAAC;QAAE3C,SAAS,EAAC;sBACtBlB,cAACiC,WAAW;QAACzB,YAAY,EAAEA;QAAgB,CAC1C,CACJ,CACD,CACX;MACDsD,OAAO,EAAEA,oBACL9D,0BACKG,KAAK,CAACC,QAAQ,CAAC2D,aAAa,CAAC1C,GAAG,CAAC,CAAC2C,OAAO,EAAEC,KAAK;QAC7C,MAAMC,KAAK,GAAG/D,KAAK,CAACC,QAAQ,CAAC+D,QAAQ,IAAIhE,KAAK,CAACC,QAAQ,CAAC+D,QAAQ,CAACF,KAAK,CAAC;QACvE,oBACIjE;UAAIsB,GAAG,EAAE0C,OAAO;wBAAcE,KAAK;UAAEhD,SAAS,EAAC,eAAe;UAACO,KAAK,EAAEyC;WACjEF,OAAO,CACP;OAEZ,CAAC,CACD;KAEZ;IACDI,UAAU,EAAEpB,cAAc;IAC1BqB,QAAQ,EAAEnE,KAAK;IACfkD,QAAQ,EAAEV;IACZ,CACA;AAEd;;;;"}
|
|
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,
|