@transferwise/components 46.155.1 → 46.157.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/build/Calendar/Calendar.constants.js +10 -0
- package/build/Calendar/Calendar.constants.js.map +1 -0
- package/build/Calendar/Calendar.constants.mjs +8 -0
- package/build/Calendar/Calendar.constants.mjs.map +1 -0
- package/build/Calendar/Calendar.js +121 -17
- package/build/Calendar/Calendar.js.map +1 -1
- package/build/Calendar/Calendar.messages.js +12 -0
- package/build/Calendar/Calendar.messages.js.map +1 -1
- package/build/Calendar/Calendar.messages.mjs +12 -0
- package/build/Calendar/Calendar.messages.mjs.map +1 -1
- package/build/Calendar/Calendar.mjs +122 -18
- package/build/Calendar/Calendar.mjs.map +1 -1
- package/build/Calendar/DateHeader/DateHeader.js +5 -1
- package/build/Calendar/DateHeader/DateHeader.js.map +1 -1
- package/build/Calendar/DateHeader/DateHeader.mjs +5 -1
- package/build/Calendar/DateHeader/DateHeader.mjs.map +1 -1
- package/build/Calendar/DayCalendar/DayCalendar.js +20 -2
- package/build/Calendar/DayCalendar/DayCalendar.js.map +1 -1
- package/build/Calendar/DayCalendar/DayCalendar.mjs +20 -2
- package/build/Calendar/DayCalendar/DayCalendar.mjs.map +1 -1
- package/build/Calendar/DayCalendar/Table/DayCalendarTable.js +60 -19
- package/build/Calendar/DayCalendar/Table/DayCalendarTable.js.map +1 -1
- package/build/Calendar/DayCalendar/Table/DayCalendarTable.mjs +60 -19
- package/build/Calendar/DayCalendar/Table/DayCalendarTable.mjs.map +1 -1
- package/build/Calendar/MonthCalendar/MonthCalendar.js +6 -0
- package/build/Calendar/MonthCalendar/MonthCalendar.js.map +1 -1
- package/build/Calendar/MonthCalendar/MonthCalendar.mjs +6 -0
- package/build/Calendar/MonthCalendar/MonthCalendar.mjs.map +1 -1
- package/build/Calendar/MonthCalendar/Table/MonthCalendarTable.js +8 -3
- package/build/Calendar/MonthCalendar/Table/MonthCalendarTable.js.map +1 -1
- package/build/Calendar/MonthCalendar/Table/MonthCalendarTable.mjs +8 -3
- package/build/Calendar/MonthCalendar/Table/MonthCalendarTable.mjs.map +1 -1
- package/build/Calendar/TableLink/TableLink.js +95 -0
- package/build/Calendar/TableLink/TableLink.js.map +1 -0
- package/build/Calendar/TableLink/TableLink.mjs +91 -0
- package/build/Calendar/TableLink/TableLink.mjs.map +1 -0
- package/build/Calendar/YearCalendar/Table/YearCalendarTable.js +8 -3
- package/build/Calendar/YearCalendar/Table/YearCalendarTable.js.map +1 -1
- package/build/Calendar/YearCalendar/Table/YearCalendarTable.mjs +8 -3
- package/build/Calendar/YearCalendar/Table/YearCalendarTable.mjs.map +1 -1
- package/build/Calendar/YearCalendar/YearCalendar.js +7 -0
- package/build/Calendar/YearCalendar/YearCalendar.js.map +1 -1
- package/build/Calendar/YearCalendar/YearCalendar.mjs +7 -0
- package/build/Calendar/YearCalendar/YearCalendar.mjs.map +1 -1
- package/build/Calendar/_helpers/clampToDayViewBoundary/clampToDayViewBoundary.js +24 -0
- package/build/Calendar/_helpers/clampToDayViewBoundary/clampToDayViewBoundary.js.map +1 -0
- package/build/Calendar/_helpers/clampToDayViewBoundary/clampToDayViewBoundary.mjs +22 -0
- package/build/Calendar/_helpers/clampToDayViewBoundary/clampToDayViewBoundary.mjs.map +1 -0
- package/build/Calendar/_helpers/hasDisabledDatesInMonth/hasDisabledDatesInMonth.js +33 -0
- package/build/Calendar/_helpers/hasDisabledDatesInMonth/hasDisabledDatesInMonth.js.map +1 -0
- package/build/Calendar/_helpers/hasDisabledDatesInMonth/hasDisabledDatesInMonth.mjs +31 -0
- package/build/Calendar/_helpers/hasDisabledDatesInMonth/hasDisabledDatesInMonth.mjs.map +1 -0
- package/build/Calendar/_helpers/isDateDisabled/isDateDisabled.js +40 -0
- package/build/Calendar/_helpers/isDateDisabled/isDateDisabled.js.map +1 -0
- package/build/Calendar/_helpers/isDateDisabled/isDateDisabled.mjs +38 -0
- package/build/Calendar/_helpers/isDateDisabled/isDateDisabled.mjs.map +1 -0
- package/build/DateLookup/DateLookup.js +20 -9
- package/build/DateLookup/DateLookup.js.map +1 -1
- package/build/DateLookup/DateLookup.mjs +20 -9
- package/build/DateLookup/DateLookup.mjs.map +1 -1
- package/build/ExpressiveMoneyInput/CurrencySelector/CurrencySelector.js +3 -5
- package/build/ExpressiveMoneyInput/CurrencySelector/CurrencySelector.js.map +1 -1
- package/build/ExpressiveMoneyInput/CurrencySelector/CurrencySelector.mjs +3 -5
- package/build/ExpressiveMoneyInput/CurrencySelector/CurrencySelector.mjs.map +1 -1
- package/build/Inputs/SelectInput/TriggerButton/SelectInputTriggerButton.js.map +1 -1
- package/build/Inputs/SelectInput/TriggerButton/SelectInputTriggerButton.mjs.map +1 -1
- package/build/Markup/Markup.js +138 -0
- package/build/Markup/Markup.js.map +1 -0
- package/build/Markup/Markup.mjs +133 -0
- package/build/Markup/Markup.mjs.map +1 -0
- package/build/Markup/constants.js +21 -0
- package/build/Markup/constants.js.map +1 -0
- package/build/Markup/constants.mjs +15 -0
- package/build/Markup/constants.mjs.map +1 -0
- package/build/Markup/utils/parseMarkup.js +263 -0
- package/build/Markup/utils/parseMarkup.js.map +1 -0
- package/build/Markup/utils/parseMarkup.mjs +258 -0
- package/build/Markup/utils/parseMarkup.mjs.map +1 -0
- package/build/Markup/utils/sanitise.js +111 -0
- package/build/Markup/utils/sanitise.js.map +1 -0
- package/build/Markup/utils/sanitise.mjs +108 -0
- package/build/Markup/utils/sanitise.mjs.map +1 -0
- package/build/Typeahead/Typeahead.js +53 -27
- package/build/Typeahead/Typeahead.js.map +1 -1
- package/build/Typeahead/Typeahead.messages.js +3 -0
- package/build/Typeahead/Typeahead.messages.js.map +1 -1
- package/build/Typeahead/Typeahead.messages.mjs +3 -0
- package/build/Typeahead/Typeahead.messages.mjs.map +1 -1
- package/build/Typeahead/Typeahead.mjs +53 -27
- package/build/Typeahead/Typeahead.mjs.map +1 -1
- package/build/Typeahead/TypeaheadInput/TypeaheadInput.js +2 -2
- package/build/Typeahead/TypeaheadInput/TypeaheadInput.js.map +1 -1
- package/build/Typeahead/TypeaheadInput/TypeaheadInput.mjs +2 -2
- package/build/Typeahead/TypeaheadInput/TypeaheadInput.mjs.map +1 -1
- package/build/Typeahead/TypeaheadOption/TypeaheadOption.js +3 -1
- package/build/Typeahead/TypeaheadOption/TypeaheadOption.js.map +1 -1
- package/build/Typeahead/TypeaheadOption/TypeaheadOption.mjs +3 -1
- package/build/Typeahead/TypeaheadOption/TypeaheadOption.mjs.map +1 -1
- package/build/i18n/en.json +5 -0
- package/build/i18n/en.json.js +5 -0
- package/build/i18n/en.json.js.map +1 -1
- package/build/i18n/en.json.mjs +5 -0
- package/build/i18n/en.json.mjs.map +1 -1
- package/build/i18n/hu.json +1 -1
- package/build/i18n/hu.json.js +1 -1
- package/build/i18n/hu.json.mjs +1 -1
- package/build/index.js +4 -2
- package/build/index.js.map +1 -1
- package/build/index.mjs +2 -1
- package/build/index.mjs.map +1 -1
- package/build/main.css +168 -43
- package/build/styles/Calendar/Calendar.css +112 -37
- package/build/styles/Calendar/TableLink/TableLink.css +115 -0
- package/build/styles/Markup/Markup.css +28 -0
- package/build/styles/Markup/_stories/Vulnerability/Vulnerability.css +69 -0
- package/build/styles/Typeahead/Typeahead.css +4 -0
- package/build/styles/Typeahead/TypeaheadOption/TypeaheadOption.css +5 -0
- package/build/styles/main.css +168 -43
- package/build/types/Calendar/Calendar.constants.d.ts +2 -0
- package/build/types/Calendar/Calendar.constants.d.ts.map +1 -0
- package/build/types/Calendar/Calendar.d.ts +16 -3
- package/build/types/Calendar/Calendar.d.ts.map +1 -1
- package/build/types/Calendar/Calendar.messages.d.ts +20 -0
- package/build/types/Calendar/Calendar.messages.d.ts.map +1 -1
- package/build/types/Calendar/Calendar.types.d.ts +32 -0
- package/build/types/Calendar/Calendar.types.d.ts.map +1 -0
- package/build/types/Calendar/DateHeader/DateHeader.d.ts +2 -0
- package/build/types/Calendar/DateHeader/DateHeader.d.ts.map +1 -1
- package/build/types/Calendar/DayCalendar/DayCalendar.d.ts +7 -1
- package/build/types/Calendar/DayCalendar/DayCalendar.d.ts.map +1 -1
- package/build/types/Calendar/DayCalendar/Table/DayCalendarTable.d.ts +6 -0
- package/build/types/Calendar/DayCalendar/Table/DayCalendarTable.d.ts.map +1 -1
- package/build/types/Calendar/MonthCalendar/MonthCalendar.d.ts +1 -0
- package/build/types/Calendar/MonthCalendar/MonthCalendar.d.ts.map +1 -1
- package/build/types/Calendar/MonthCalendar/Table/MonthCalendarTable.d.ts +2 -1
- package/build/types/Calendar/MonthCalendar/Table/MonthCalendarTable.d.ts.map +1 -1
- package/build/types/Calendar/{tableLink → TableLink}/TableLink.d.ts +5 -1
- package/build/types/Calendar/TableLink/TableLink.d.ts.map +1 -0
- package/build/types/Calendar/TableLink/index.d.ts.map +1 -0
- package/build/types/Calendar/YearCalendar/Table/YearCalendarTable.d.ts +2 -1
- package/build/types/Calendar/YearCalendar/Table/YearCalendarTable.d.ts.map +1 -1
- package/build/types/Calendar/YearCalendar/YearCalendar.d.ts +1 -0
- package/build/types/Calendar/YearCalendar/YearCalendar.d.ts.map +1 -1
- package/build/types/Calendar/_helpers/clampToDayViewBoundary/clampToDayViewBoundary.d.ts +8 -0
- package/build/types/Calendar/_helpers/clampToDayViewBoundary/clampToDayViewBoundary.d.ts.map +1 -0
- package/build/types/Calendar/_helpers/hasDisabledDatesInMonth/hasDisabledDatesInMonth.d.ts +3 -0
- package/build/types/Calendar/_helpers/hasDisabledDatesInMonth/hasDisabledDatesInMonth.d.ts.map +1 -0
- package/build/types/Calendar/_helpers/index.d.ts +4 -0
- package/build/types/Calendar/_helpers/index.d.ts.map +1 -0
- package/build/types/Calendar/_helpers/isDateDisabled/isDateDisabled.d.ts +3 -0
- package/build/types/Calendar/_helpers/isDateDisabled/isDateDisabled.d.ts.map +1 -0
- package/build/types/Calendar/index.d.ts +1 -0
- package/build/types/Calendar/index.d.ts.map +1 -1
- package/build/types/DateLookup/DateLookup.d.ts +24 -5
- package/build/types/DateLookup/DateLookup.d.ts.map +1 -1
- package/build/types/DateLookup/index.d.ts +1 -0
- package/build/types/DateLookup/index.d.ts.map +1 -1
- package/build/types/ExpressiveMoneyInput/CurrencySelector/CurrencySelector.d.ts +6 -4
- package/build/types/ExpressiveMoneyInput/CurrencySelector/CurrencySelector.d.ts.map +1 -1
- package/build/types/Inputs/SelectInput/TriggerButton/SelectInputTriggerButton.d.ts +1 -1
- package/build/types/Inputs/SelectInput/TriggerButton/SelectInputTriggerButton.d.ts.map +1 -1
- package/build/types/Markup/Markup.d.ts +18 -0
- package/build/types/Markup/Markup.d.ts.map +1 -0
- package/build/types/Markup/Markup.types.d.ts +77 -0
- package/build/types/Markup/Markup.types.d.ts.map +1 -0
- package/build/types/Markup/_stories/Vulnerability/Vulnerability.d.ts +12 -0
- package/build/types/Markup/_stories/Vulnerability/Vulnerability.d.ts.map +1 -0
- package/build/types/Markup/constants.d.ts +6 -0
- package/build/types/Markup/constants.d.ts.map +1 -0
- package/build/types/Markup/index.d.ts +3 -0
- package/build/types/Markup/index.d.ts.map +1 -0
- package/build/types/Markup/utils/parseMarkup.d.ts +8 -0
- package/build/types/Markup/utils/parseMarkup.d.ts.map +1 -0
- package/build/types/Markup/utils/sanitise.d.ts +4 -0
- package/build/types/Markup/utils/sanitise.d.ts.map +1 -0
- package/build/types/Typeahead/Typeahead.d.ts.map +1 -1
- package/build/types/Typeahead/Typeahead.messages.d.ts +5 -0
- package/build/types/Typeahead/Typeahead.messages.d.ts.map +1 -1
- package/build/types/Typeahead/TypeaheadInput/TypeaheadInput.d.ts.map +1 -1
- package/build/types/Typeahead/TypeaheadOption/TypeaheadOption.d.ts +1 -0
- package/build/types/Typeahead/TypeaheadOption/TypeaheadOption.d.ts.map +1 -1
- package/build/types/index.d.ts +5 -2
- package/build/types/index.d.ts.map +1 -1
- package/build/types/test-utils/index.d.ts +10 -0
- package/build/types/test-utils/index.d.ts.map +1 -1
- package/package.json +1 -1
- package/src/Calendar/Calendar.constants.ts +5 -0
- package/src/Calendar/Calendar.css +112 -37
- package/src/Calendar/Calendar.disabledDates.test.tsx +610 -0
- package/src/Calendar/Calendar.less +5 -35
- package/src/Calendar/Calendar.messages.ts +21 -0
- package/src/Calendar/Calendar.test.tsx +342 -32
- package/src/Calendar/Calendar.tsx +169 -19
- package/src/Calendar/Calendar.types.ts +35 -0
- package/src/Calendar/DateHeader/DateHeader.tsx +6 -0
- package/src/Calendar/DayCalendar/DayCalendar.tsx +39 -1
- package/src/Calendar/DayCalendar/Table/DayCalendarTable.tsx +67 -27
- package/src/Calendar/MonthCalendar/MonthCalendar.tsx +8 -0
- package/src/Calendar/MonthCalendar/Table/MonthCalendarTable.tsx +15 -3
- package/src/Calendar/TableLink/TableLink.css +115 -0
- package/src/Calendar/TableLink/TableLink.less +68 -0
- package/src/Calendar/TableLink/TableLink.tsx +117 -0
- package/src/Calendar/YearCalendar/Table/YearCalendarTable.tsx +15 -3
- package/src/Calendar/YearCalendar/YearCalendar.tsx +9 -0
- package/src/Calendar/_helpers/clampToDayViewBoundary/clampToDayViewBoundary.test.ts +90 -0
- package/src/Calendar/_helpers/clampToDayViewBoundary/clampToDayViewBoundary.ts +25 -0
- package/src/Calendar/_helpers/hasDisabledDatesInMonth/hasDisabledDatesInMonth.test.ts +98 -0
- package/src/Calendar/_helpers/hasDisabledDatesInMonth/hasDisabledDatesInMonth.ts +45 -0
- package/src/Calendar/_helpers/index.ts +3 -0
- package/src/Calendar/_helpers/isDateDisabled/isDateDisabled.test.ts +169 -0
- package/src/Calendar/_helpers/isDateDisabled/isDateDisabled.ts +59 -0
- package/src/Calendar/_stories/Calendar.accessibility.docs.mdx +118 -0
- package/src/Calendar/_stories/Calendar.story.tsx +144 -4
- package/src/Calendar/_stories/Calendar.test.story.tsx +114 -0
- package/src/Calendar/index.ts +7 -0
- package/src/DateLookup/DateLookup.disabledDates.test.tsx +312 -0
- package/src/DateLookup/DateLookup.test.tsx +34 -37
- package/src/DateLookup/DateLookup.tsx +37 -13
- package/src/DateLookup/_stories/DateLookup.accessibility.docs.mdx +108 -0
- package/src/DateLookup/_stories/DateLookup.story.tsx +126 -2
- package/src/DateLookup/index.ts +6 -0
- package/src/ExpressiveMoneyInput/CurrencySelector/CurrencySelector.tsx +12 -13
- package/src/Inputs/SelectInput/SelectInput.test.tsx +37 -0
- package/src/Inputs/SelectInput/TriggerButton/SelectInputTriggerButton.tsx +1 -1
- package/src/Markup/Markup.css +28 -0
- package/src/Markup/Markup.injection.test.tsx +163 -0
- package/src/Markup/Markup.less +29 -0
- package/src/Markup/Markup.test.tsx +502 -0
- package/src/Markup/Markup.tsx +175 -0
- package/src/Markup/Markup.types.ts +62 -0
- package/src/Markup/_stories/Markup.docs.mdx +75 -0
- package/src/Markup/_stories/Markup.security.docs.mdx +343 -0
- package/src/Markup/_stories/Markup.story.tsx +266 -0
- package/src/Markup/_stories/Vulnerability/Vulnerability.css +69 -0
- package/src/Markup/_stories/Vulnerability/Vulnerability.tsx +30 -0
- package/src/Markup/constants.ts +23 -0
- package/src/Markup/index.ts +2 -0
- package/src/Markup/utils/parseMarkup.test.ts +706 -0
- package/src/Markup/utils/parseMarkup.ts +265 -0
- package/src/Markup/utils/sanitise.test.ts +499 -0
- package/src/Markup/utils/sanitise.ts +129 -0
- package/src/Typeahead/Typeahead.css +4 -0
- package/src/Typeahead/Typeahead.less +2 -0
- package/src/Typeahead/Typeahead.messages.ts +5 -0
- package/src/Typeahead/Typeahead.test.tsx +80 -3
- package/src/Typeahead/Typeahead.tsx +50 -27
- package/src/Typeahead/TypeaheadInput/TypeaheadInput.tsx +2 -6
- package/src/Typeahead/TypeaheadOption/TypeaheadOption.css +5 -0
- package/src/Typeahead/TypeaheadOption/TypeaheadOption.less +9 -0
- package/src/Typeahead/TypeaheadOption/TypeaheadOption.tsx +4 -2
- package/src/i18n/en.json +4 -0
- package/src/i18n/hu.json +1 -1
- package/src/index.ts +5 -2
- package/src/main.css +168 -43
- package/src/main.less +1 -0
- package/build/Calendar/tableLink/TableLink.js +0 -61
- package/build/Calendar/tableLink/TableLink.js.map +0 -1
- package/build/Calendar/tableLink/TableLink.mjs +0 -57
- package/build/Calendar/tableLink/TableLink.mjs.map +0 -1
- package/build/types/Calendar/tableLink/TableLink.d.ts.map +0 -1
- package/build/types/Calendar/tableLink/index.d.ts.map +0 -1
- package/src/Calendar/tableLink/TableLink.tsx +0 -77
- /package/build/types/Calendar/{tableLink → TableLink}/index.d.ts +0 -0
- /package/src/Calendar/{tableLink → TableLink}/index.ts +0 -0
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MonthCalendarTable.mjs","sources":["../../../../src/Calendar/MonthCalendar/Table/MonthCalendarTable.tsx"],"sourcesContent":["import { formatDate } from '@transferwise/formatting';\nimport { useIntl } from 'react-intl';\n\nimport { getFocusableTime } from '../../GetFocusableTime/GetFocusableTime';\nimport TableLink from '../../
|
|
1
|
+
{"version":3,"file":"MonthCalendarTable.mjs","sources":["../../../../src/Calendar/MonthCalendar/Table/MonthCalendarTable.tsx"],"sourcesContent":["import { formatDate } from '@transferwise/formatting';\nimport { useIntl } from 'react-intl';\n\nimport { getFocusableTime } from '../../GetFocusableTime/GetFocusableTime';\nimport TableLink from '../../TableLink';\n\ninterface MonthCalendarTableProps {\n selectedDate: Date | null;\n focusedDate?: Date | null;\n min: Date | null;\n max: Date | null;\n viewYear: number;\n placeholder?: string;\n onSelect: (date: number) => void;\n}\n\nconst ROWS = 3;\nconst COLS = 4;\nconst MONTH_ONLY_FORMAT: Intl.DateTimeFormatOptions = { month: 'short' };\n\nconst MonthCalendarTable = ({\n selectedDate,\n focusedDate,\n min,\n max,\n viewYear,\n placeholder,\n onSelect,\n}: MonthCalendarTableProps) => {\n const { locale } = useIntl();\n\n const getLink = (month: number) => {\n return (\n <TableLink\n item={month}\n type=\"month\"\n title={formatDate(new Date(viewYear, month), locale, MONTH_ONLY_FORMAT)}\n active={isActive(month)}\n outOfRange={isDisabled(month)}\n disabled={false}\n today={viewYear === new Date().getFullYear() && month === new Date().getMonth()}\n autofocus={autofocusMonth === month}\n onClick={onSelect}\n />\n );\n };\n\n const isActive = (month: number) => {\n return !!(month === selectedDate?.getMonth() && viewYear === selectedDate?.getFullYear());\n };\n\n const isFocused = (month: number) => {\n return !!(month === focusedDate?.getMonth() && viewYear === focusedDate?.getFullYear());\n };\n\n const isThisMonth = (month: number) => {\n return viewYear === new Date().getFullYear() && month === new Date().getMonth();\n };\n\n const isDisabled = (month: number) => {\n const date = new Date(viewYear, month);\n return !!(\n (min && date < new Date(min.getFullYear(), min.getMonth())) ||\n (max && date > new Date(max.getFullYear(), max.getMonth()))\n );\n };\n\n const autofocusMonth = (() => {\n const months = Array.from({ length: ROWS * COLS }, (_, index) => index);\n return getFocusableTime({\n isActive: isFocused,\n isNow: isThisMonth,\n isDisabled,\n timeSpan: months,\n });\n })();\n\n return (\n <table className=\"table table-condensed table-bordered tw-date-lookup-calendar np-text-body-default-bold m-b-0\">\n <thead className=\"sr-only\">\n <tr>\n <th colSpan={COLS}>{placeholder}</th>\n </tr>\n </thead>\n <tbody>\n {Array.from({ length: ROWS }, (_, rowIndex) => (\n <tr key={rowIndex}>\n {Array.from({ length: COLS }, (_, colIndex) => (\n <td key={colIndex}>{getLink(rowIndex * COLS + colIndex)}</td>\n ))}\n </tr>\n ))}\n </tbody>\n </table>\n );\n};\n\nexport default MonthCalendarTable;\n"],"names":["ROWS","COLS","MONTH_ONLY_FORMAT","month","MonthCalendarTable","selectedDate","focusedDate","min","max","viewYear","placeholder","onSelect","locale","useIntl","getLink","_jsx","TableLink","item","type","title","formatDate","Date","active","isActive","outOfRange","isDisabled","disabled","today","getFullYear","getMonth","autofocus","autofocusMonth","onClick","isFocused","isThisMonth","date","months","Array","from","length","_","index","getFocusableTime","isNow","timeSpan","_jsxs","className","children","colSpan","rowIndex","colIndex"],"mappings":"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"}
|
|
@@ -0,0 +1,95 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
|
+
|
|
5
|
+
var clsx = require('clsx');
|
|
6
|
+
var React = require('react');
|
|
7
|
+
var reactIntl = require('react-intl');
|
|
8
|
+
var Calendar_messages = require('../Calendar.messages.js');
|
|
9
|
+
var SentimentSurface = require('../../SentimentSurface/SentimentSurface.js');
|
|
10
|
+
var jsxRuntime = require('react/jsx-runtime');
|
|
11
|
+
|
|
12
|
+
const TableLink = ({
|
|
13
|
+
item,
|
|
14
|
+
type,
|
|
15
|
+
title,
|
|
16
|
+
longTitle,
|
|
17
|
+
active,
|
|
18
|
+
outOfRange,
|
|
19
|
+
disabled,
|
|
20
|
+
today,
|
|
21
|
+
autofocus,
|
|
22
|
+
disabledReasonId,
|
|
23
|
+
announceReasonOnFocus,
|
|
24
|
+
onClick,
|
|
25
|
+
onFocus
|
|
26
|
+
}) => {
|
|
27
|
+
const buttonRef = React.useRef(null);
|
|
28
|
+
// Distinguishes keyboard-driven .focus() (arrow keys) from screen-reader-initiated focus (VoiceOver cursor).
|
|
29
|
+
// Without this, the onFocus callback would re-trigger state updates that conflict with the already-committed focusedDate.
|
|
30
|
+
const isProgrammaticFocus = React.useRef(false);
|
|
31
|
+
const isMouseDown = React.useRef(false);
|
|
32
|
+
const intl = reactIntl.useIntl();
|
|
33
|
+
React.useEffect(() => {
|
|
34
|
+
if (autofocus) {
|
|
35
|
+
setTimeout(() => {
|
|
36
|
+
isProgrammaticFocus.current = true;
|
|
37
|
+
buttonRef.current?.focus();
|
|
38
|
+
isProgrammaticFocus.current = false;
|
|
39
|
+
}, 0);
|
|
40
|
+
}
|
|
41
|
+
}, [autofocus]);
|
|
42
|
+
const isUnavailable = outOfRange || disabled;
|
|
43
|
+
const onCalendarClick = event => {
|
|
44
|
+
event.preventDefault();
|
|
45
|
+
onClick(item);
|
|
46
|
+
};
|
|
47
|
+
const onCalendarMouseDown = () => {
|
|
48
|
+
isMouseDown.current = true;
|
|
49
|
+
};
|
|
50
|
+
const onCalendarFocus = () => {
|
|
51
|
+
if (!isProgrammaticFocus.current && !isMouseDown.current) {
|
|
52
|
+
onFocus?.(item);
|
|
53
|
+
}
|
|
54
|
+
isMouseDown.current = false;
|
|
55
|
+
};
|
|
56
|
+
const calculateAriaLabel = () => {
|
|
57
|
+
let label = longTitle || title || '';
|
|
58
|
+
if (active) {
|
|
59
|
+
label += `, ${intl.formatMessage(Calendar_messages.default.selected)} ${intl.formatMessage(Calendar_messages.default[type])}`;
|
|
60
|
+
}
|
|
61
|
+
if (isUnavailable) {
|
|
62
|
+
label += `, ${intl.formatMessage(Calendar_messages.default.notAvailable)}`;
|
|
63
|
+
}
|
|
64
|
+
return label;
|
|
65
|
+
};
|
|
66
|
+
return /*#__PURE__*/jsxRuntime.jsx(SentimentSurface.default
|
|
67
|
+
// @ts-expect-error - Generic forwardRef limitation in SentimentSurface
|
|
68
|
+
, {
|
|
69
|
+
ref: buttonRef,
|
|
70
|
+
as: "button",
|
|
71
|
+
"data-calendar-cell": true,
|
|
72
|
+
"aria-describedby": isUnavailable || autofocus && announceReasonOnFocus ? disabledReasonId : undefined,
|
|
73
|
+
"aria-disabled": isUnavailable || undefined,
|
|
74
|
+
"aria-label": calculateAriaLabel(),
|
|
75
|
+
"aria-pressed": active,
|
|
76
|
+
className: clsx.clsx(`wds-Calendar__option--${type}`, `tw-date-lookup-${type}-option np-text-body-default-bold`, {
|
|
77
|
+
active: !!active
|
|
78
|
+
}, {
|
|
79
|
+
today: !!today
|
|
80
|
+
}, {
|
|
81
|
+
disabled: !!isUnavailable
|
|
82
|
+
}),
|
|
83
|
+
hasBaseStyles: false,
|
|
84
|
+
sentiment: isUnavailable ? 'negative' : 'neutral',
|
|
85
|
+
tabIndex: autofocus ? 0 : -1,
|
|
86
|
+
type: "button",
|
|
87
|
+
onClick: onCalendarClick,
|
|
88
|
+
onFocus: onCalendarFocus,
|
|
89
|
+
onMouseDown: onCalendarMouseDown,
|
|
90
|
+
children: title || item
|
|
91
|
+
});
|
|
92
|
+
};
|
|
93
|
+
|
|
94
|
+
exports.default = TableLink;
|
|
95
|
+
//# sourceMappingURL=TableLink.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"TableLink.js","sources":["../../../src/Calendar/TableLink/TableLink.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport { useEffect, useRef } from 'react';\nimport { useIntl } from 'react-intl';\n\nimport messages from '../Calendar.messages';\nimport SentimentSurface from '../../SentimentSurface';\n\ninterface TableLinkProps {\n item: number;\n type: 'day' | 'month' | 'year';\n title?: string;\n longTitle?: string;\n active: boolean;\n outOfRange: boolean;\n disabled: boolean;\n today: boolean;\n autofocus?: boolean;\n disabledReasonId?: string;\n announceReasonOnFocus?: boolean;\n onClick: (item: number) => void;\n onFocus?: (item: number) => void;\n}\n\nconst TableLink = ({\n item,\n type,\n title,\n longTitle,\n active,\n outOfRange,\n disabled,\n today,\n autofocus,\n disabledReasonId,\n announceReasonOnFocus,\n onClick,\n onFocus,\n}: TableLinkProps) => {\n const buttonRef = useRef<HTMLButtonElement>(null);\n // Distinguishes keyboard-driven .focus() (arrow keys) from screen-reader-initiated focus (VoiceOver cursor).\n // Without this, the onFocus callback would re-trigger state updates that conflict with the already-committed focusedDate.\n const isProgrammaticFocus = useRef(false);\n const isMouseDown = useRef(false);\n const intl = useIntl();\n\n useEffect(() => {\n if (autofocus) {\n setTimeout(() => {\n isProgrammaticFocus.current = true;\n buttonRef.current?.focus();\n isProgrammaticFocus.current = false;\n }, 0);\n }\n }, [autofocus]);\n\n const isUnavailable = outOfRange || disabled;\n\n const onCalendarClick = (event: React.MouseEvent) => {\n event.preventDefault();\n onClick(item);\n };\n\n const onCalendarMouseDown = () => {\n isMouseDown.current = true;\n };\n\n const onCalendarFocus = () => {\n if (!isProgrammaticFocus.current && !isMouseDown.current) {\n onFocus?.(item);\n }\n isMouseDown.current = false;\n };\n\n const calculateAriaLabel = () => {\n let label = longTitle || title || '';\n if (active) {\n label += `, ${intl.formatMessage(messages.selected)} ${intl.formatMessage(messages[type])}`;\n }\n if (isUnavailable) {\n label += `, ${intl.formatMessage(messages.notAvailable)}`;\n }\n return label;\n };\n\n return (\n <SentimentSurface\n // @ts-expect-error - Generic forwardRef limitation in SentimentSurface\n ref={buttonRef}\n as=\"button\"\n data-calendar-cell\n aria-describedby={\n isUnavailable || (autofocus && announceReasonOnFocus) ? disabledReasonId : undefined\n }\n aria-disabled={isUnavailable || undefined}\n aria-label={calculateAriaLabel()}\n aria-pressed={active}\n className={clsx(\n `wds-Calendar__option--${type}`,\n `tw-date-lookup-${type}-option np-text-body-default-bold`,\n { active: !!active },\n { today: !!today },\n { disabled: !!isUnavailable },\n )}\n hasBaseStyles={false}\n sentiment={isUnavailable ? 'negative' : 'neutral'}\n tabIndex={autofocus ? 0 : -1}\n type=\"button\"\n onClick={onCalendarClick}\n onFocus={onCalendarFocus}\n onMouseDown={onCalendarMouseDown}\n >\n {title || item}\n </SentimentSurface>\n );\n};\n\nexport default TableLink;\n"],"names":["TableLink","item","type","title","longTitle","active","outOfRange","disabled","today","autofocus","disabledReasonId","announceReasonOnFocus","onClick","onFocus","buttonRef","useRef","isProgrammaticFocus","isMouseDown","intl","useIntl","useEffect","setTimeout","current","focus","isUnavailable","onCalendarClick","event","preventDefault","onCalendarMouseDown","onCalendarFocus","calculateAriaLabel","label","formatMessage","messages","selected","notAvailable","_jsx","SentimentSurface","ref","as","undefined","className","clsx","hasBaseStyles","sentiment","tabIndex","onMouseDown","children"],"mappings":"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"}
|
|
@@ -0,0 +1,91 @@
|
|
|
1
|
+
import { clsx } from 'clsx';
|
|
2
|
+
import { useRef, useEffect } from 'react';
|
|
3
|
+
import { useIntl } from 'react-intl';
|
|
4
|
+
import messages from '../Calendar.messages.mjs';
|
|
5
|
+
import SentimentSurface from '../../SentimentSurface/SentimentSurface.mjs';
|
|
6
|
+
import { jsx } from 'react/jsx-runtime';
|
|
7
|
+
|
|
8
|
+
const TableLink = ({
|
|
9
|
+
item,
|
|
10
|
+
type,
|
|
11
|
+
title,
|
|
12
|
+
longTitle,
|
|
13
|
+
active,
|
|
14
|
+
outOfRange,
|
|
15
|
+
disabled,
|
|
16
|
+
today,
|
|
17
|
+
autofocus,
|
|
18
|
+
disabledReasonId,
|
|
19
|
+
announceReasonOnFocus,
|
|
20
|
+
onClick,
|
|
21
|
+
onFocus
|
|
22
|
+
}) => {
|
|
23
|
+
const buttonRef = useRef(null);
|
|
24
|
+
// Distinguishes keyboard-driven .focus() (arrow keys) from screen-reader-initiated focus (VoiceOver cursor).
|
|
25
|
+
// Without this, the onFocus callback would re-trigger state updates that conflict with the already-committed focusedDate.
|
|
26
|
+
const isProgrammaticFocus = useRef(false);
|
|
27
|
+
const isMouseDown = useRef(false);
|
|
28
|
+
const intl = useIntl();
|
|
29
|
+
useEffect(() => {
|
|
30
|
+
if (autofocus) {
|
|
31
|
+
setTimeout(() => {
|
|
32
|
+
isProgrammaticFocus.current = true;
|
|
33
|
+
buttonRef.current?.focus();
|
|
34
|
+
isProgrammaticFocus.current = false;
|
|
35
|
+
}, 0);
|
|
36
|
+
}
|
|
37
|
+
}, [autofocus]);
|
|
38
|
+
const isUnavailable = outOfRange || disabled;
|
|
39
|
+
const onCalendarClick = event => {
|
|
40
|
+
event.preventDefault();
|
|
41
|
+
onClick(item);
|
|
42
|
+
};
|
|
43
|
+
const onCalendarMouseDown = () => {
|
|
44
|
+
isMouseDown.current = true;
|
|
45
|
+
};
|
|
46
|
+
const onCalendarFocus = () => {
|
|
47
|
+
if (!isProgrammaticFocus.current && !isMouseDown.current) {
|
|
48
|
+
onFocus?.(item);
|
|
49
|
+
}
|
|
50
|
+
isMouseDown.current = false;
|
|
51
|
+
};
|
|
52
|
+
const calculateAriaLabel = () => {
|
|
53
|
+
let label = longTitle || title || '';
|
|
54
|
+
if (active) {
|
|
55
|
+
label += `, ${intl.formatMessage(messages.selected)} ${intl.formatMessage(messages[type])}`;
|
|
56
|
+
}
|
|
57
|
+
if (isUnavailable) {
|
|
58
|
+
label += `, ${intl.formatMessage(messages.notAvailable)}`;
|
|
59
|
+
}
|
|
60
|
+
return label;
|
|
61
|
+
};
|
|
62
|
+
return /*#__PURE__*/jsx(SentimentSurface
|
|
63
|
+
// @ts-expect-error - Generic forwardRef limitation in SentimentSurface
|
|
64
|
+
, {
|
|
65
|
+
ref: buttonRef,
|
|
66
|
+
as: "button",
|
|
67
|
+
"data-calendar-cell": true,
|
|
68
|
+
"aria-describedby": isUnavailable || autofocus && announceReasonOnFocus ? disabledReasonId : undefined,
|
|
69
|
+
"aria-disabled": isUnavailable || undefined,
|
|
70
|
+
"aria-label": calculateAriaLabel(),
|
|
71
|
+
"aria-pressed": active,
|
|
72
|
+
className: clsx(`wds-Calendar__option--${type}`, `tw-date-lookup-${type}-option np-text-body-default-bold`, {
|
|
73
|
+
active: !!active
|
|
74
|
+
}, {
|
|
75
|
+
today: !!today
|
|
76
|
+
}, {
|
|
77
|
+
disabled: !!isUnavailable
|
|
78
|
+
}),
|
|
79
|
+
hasBaseStyles: false,
|
|
80
|
+
sentiment: isUnavailable ? 'negative' : 'neutral',
|
|
81
|
+
tabIndex: autofocus ? 0 : -1,
|
|
82
|
+
type: "button",
|
|
83
|
+
onClick: onCalendarClick,
|
|
84
|
+
onFocus: onCalendarFocus,
|
|
85
|
+
onMouseDown: onCalendarMouseDown,
|
|
86
|
+
children: title || item
|
|
87
|
+
});
|
|
88
|
+
};
|
|
89
|
+
|
|
90
|
+
export { TableLink as default };
|
|
91
|
+
//# sourceMappingURL=TableLink.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"TableLink.mjs","sources":["../../../src/Calendar/TableLink/TableLink.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport { useEffect, useRef } from 'react';\nimport { useIntl } from 'react-intl';\n\nimport messages from '../Calendar.messages';\nimport SentimentSurface from '../../SentimentSurface';\n\ninterface TableLinkProps {\n item: number;\n type: 'day' | 'month' | 'year';\n title?: string;\n longTitle?: string;\n active: boolean;\n outOfRange: boolean;\n disabled: boolean;\n today: boolean;\n autofocus?: boolean;\n disabledReasonId?: string;\n announceReasonOnFocus?: boolean;\n onClick: (item: number) => void;\n onFocus?: (item: number) => void;\n}\n\nconst TableLink = ({\n item,\n type,\n title,\n longTitle,\n active,\n outOfRange,\n disabled,\n today,\n autofocus,\n disabledReasonId,\n announceReasonOnFocus,\n onClick,\n onFocus,\n}: TableLinkProps) => {\n const buttonRef = useRef<HTMLButtonElement>(null);\n // Distinguishes keyboard-driven .focus() (arrow keys) from screen-reader-initiated focus (VoiceOver cursor).\n // Without this, the onFocus callback would re-trigger state updates that conflict with the already-committed focusedDate.\n const isProgrammaticFocus = useRef(false);\n const isMouseDown = useRef(false);\n const intl = useIntl();\n\n useEffect(() => {\n if (autofocus) {\n setTimeout(() => {\n isProgrammaticFocus.current = true;\n buttonRef.current?.focus();\n isProgrammaticFocus.current = false;\n }, 0);\n }\n }, [autofocus]);\n\n const isUnavailable = outOfRange || disabled;\n\n const onCalendarClick = (event: React.MouseEvent) => {\n event.preventDefault();\n onClick(item);\n };\n\n const onCalendarMouseDown = () => {\n isMouseDown.current = true;\n };\n\n const onCalendarFocus = () => {\n if (!isProgrammaticFocus.current && !isMouseDown.current) {\n onFocus?.(item);\n }\n isMouseDown.current = false;\n };\n\n const calculateAriaLabel = () => {\n let label = longTitle || title || '';\n if (active) {\n label += `, ${intl.formatMessage(messages.selected)} ${intl.formatMessage(messages[type])}`;\n }\n if (isUnavailable) {\n label += `, ${intl.formatMessage(messages.notAvailable)}`;\n }\n return label;\n };\n\n return (\n <SentimentSurface\n // @ts-expect-error - Generic forwardRef limitation in SentimentSurface\n ref={buttonRef}\n as=\"button\"\n data-calendar-cell\n aria-describedby={\n isUnavailable || (autofocus && announceReasonOnFocus) ? disabledReasonId : undefined\n }\n aria-disabled={isUnavailable || undefined}\n aria-label={calculateAriaLabel()}\n aria-pressed={active}\n className={clsx(\n `wds-Calendar__option--${type}`,\n `tw-date-lookup-${type}-option np-text-body-default-bold`,\n { active: !!active },\n { today: !!today },\n { disabled: !!isUnavailable },\n )}\n hasBaseStyles={false}\n sentiment={isUnavailable ? 'negative' : 'neutral'}\n tabIndex={autofocus ? 0 : -1}\n type=\"button\"\n onClick={onCalendarClick}\n onFocus={onCalendarFocus}\n onMouseDown={onCalendarMouseDown}\n >\n {title || item}\n </SentimentSurface>\n );\n};\n\nexport default TableLink;\n"],"names":["TableLink","item","type","title","longTitle","active","outOfRange","disabled","today","autofocus","disabledReasonId","announceReasonOnFocus","onClick","onFocus","buttonRef","useRef","isProgrammaticFocus","isMouseDown","intl","useIntl","useEffect","setTimeout","current","focus","isUnavailable","onCalendarClick","event","preventDefault","onCalendarMouseDown","onCalendarFocus","calculateAriaLabel","label","formatMessage","messages","selected","notAvailable","_jsx","SentimentSurface","ref","as","undefined","className","clsx","hasBaseStyles","sentiment","tabIndex","onMouseDown","children"],"mappings":"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"}
|
|
@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
|
|
|
5
5
|
var formatting = require('@transferwise/formatting');
|
|
6
6
|
var reactIntl = require('react-intl');
|
|
7
7
|
var GetFocusableTime = require('../../GetFocusableTime/GetFocusableTime.js');
|
|
8
|
-
var TableLink = require('../../
|
|
8
|
+
var TableLink = require('../../TableLink/TableLink.js');
|
|
9
9
|
var jsxRuntime = require('react/jsx-runtime');
|
|
10
10
|
|
|
11
11
|
const ROWS = 5;
|
|
@@ -15,6 +15,7 @@ const YEAR_ONLY_FORMAT = {
|
|
|
15
15
|
};
|
|
16
16
|
const YearCalendarTable = ({
|
|
17
17
|
selectedDate,
|
|
18
|
+
focusedDate,
|
|
18
19
|
min,
|
|
19
20
|
max,
|
|
20
21
|
viewYear,
|
|
@@ -31,7 +32,8 @@ const YearCalendarTable = ({
|
|
|
31
32
|
type: "year",
|
|
32
33
|
title: formatting.formatDate(new Date(year, 0), locale, YEAR_ONLY_FORMAT),
|
|
33
34
|
active: isActive(year),
|
|
34
|
-
|
|
35
|
+
outOfRange: isDisabled(year),
|
|
36
|
+
disabled: false,
|
|
35
37
|
today: isThisYear(year),
|
|
36
38
|
autofocus: autofocusYear === year,
|
|
37
39
|
onClick: onSelect
|
|
@@ -40,6 +42,9 @@ const YearCalendarTable = ({
|
|
|
40
42
|
const isActive = year => {
|
|
41
43
|
return !!(year === selectedDate?.getFullYear());
|
|
42
44
|
};
|
|
45
|
+
const isFocused = year => {
|
|
46
|
+
return !!(year === focusedDate?.getFullYear());
|
|
47
|
+
};
|
|
43
48
|
const isThisYear = year => {
|
|
44
49
|
return year === new Date().getFullYear();
|
|
45
50
|
};
|
|
@@ -51,7 +56,7 @@ const YearCalendarTable = ({
|
|
|
51
56
|
length: ROWS * COLS
|
|
52
57
|
}, (_, index) => startYear + index);
|
|
53
58
|
return GetFocusableTime.getFocusableTime({
|
|
54
|
-
isActive,
|
|
59
|
+
isActive: isFocused,
|
|
55
60
|
isNow: isThisYear,
|
|
56
61
|
isDisabled,
|
|
57
62
|
timeSpan: years
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"YearCalendarTable.js","sources":["../../../../src/Calendar/YearCalendar/Table/YearCalendarTable.tsx"],"sourcesContent":["import { formatDate } from '@transferwise/formatting';\nimport { useIntl } from 'react-intl';\n\nimport { getFocusableTime } from '../../GetFocusableTime/GetFocusableTime';\nimport TableLink from '../../
|
|
1
|
+
{"version":3,"file":"YearCalendarTable.js","sources":["../../../../src/Calendar/YearCalendar/Table/YearCalendarTable.tsx"],"sourcesContent":["import { formatDate } from '@transferwise/formatting';\nimport { useIntl } from 'react-intl';\n\nimport { getFocusableTime } from '../../GetFocusableTime/GetFocusableTime';\nimport TableLink from '../../TableLink';\n\ninterface YearCalendarTableProps {\n selectedDate: Date | null;\n focusedDate?: Date | null;\n min: Date | null;\n max: Date | null;\n viewYear: number;\n placeholder?: string;\n onSelect: (year: number) => void;\n}\n\nconst ROWS = 5;\nconst COLS = 4;\nconst YEAR_ONLY_FORMAT: Intl.DateTimeFormatOptions = { year: 'numeric' };\n\nconst YearCalendarTable = ({\n selectedDate,\n focusedDate,\n min,\n max,\n viewYear,\n placeholder,\n onSelect,\n}: YearCalendarTableProps) => {\n const { locale } = useIntl();\n const startYear = viewYear - (viewYear % 20);\n const getLink = (year: number) => {\n return (\n <TableLink\n item={year}\n type=\"year\"\n title={formatDate(new Date(year, 0), locale, YEAR_ONLY_FORMAT)}\n active={isActive(year)}\n outOfRange={isDisabled(year)}\n disabled={false}\n today={isThisYear(year)}\n autofocus={autofocusYear === year}\n onClick={onSelect}\n />\n );\n };\n\n const isActive = (year: number) => {\n return !!(year === selectedDate?.getFullYear());\n };\n\n const isFocused = (year: number) => {\n return !!(year === focusedDate?.getFullYear());\n };\n\n const isThisYear = (year: number) => {\n return year === new Date().getFullYear();\n };\n\n const isDisabled = (year: number) => {\n return !!((min && year < min.getFullYear()) || (max && year > max.getFullYear()));\n };\n\n const autofocusYear = (() => {\n const years = Array.from({ length: ROWS * COLS }, (_, index) => startYear + index);\n return getFocusableTime({\n isActive: isFocused,\n isNow: isThisYear,\n isDisabled,\n timeSpan: years,\n });\n })();\n\n return (\n <table className=\"table table-condensed table-bordered tw-date-lookup-calendar m-b-0\">\n <thead className=\"sr-only\">\n <tr>\n <th colSpan={COLS}>{placeholder}</th>\n </tr>\n </thead>\n <tbody>\n {Array.from({ length: ROWS }, (_, rowIndex) => (\n <tr key={rowIndex}>\n {Array.from({ length: COLS }, (_, colIndex) => (\n <td key={colIndex}>{getLink(startYear + rowIndex * COLS + colIndex)}</td>\n ))}\n </tr>\n ))}\n </tbody>\n </table>\n );\n};\n\nexport default YearCalendarTable;\n"],"names":["ROWS","COLS","YEAR_ONLY_FORMAT","year","YearCalendarTable","selectedDate","focusedDate","min","max","viewYear","placeholder","onSelect","locale","useIntl","startYear","getLink","_jsx","TableLink","item","type","title","formatDate","Date","active","isActive","outOfRange","isDisabled","disabled","today","isThisYear","autofocus","autofocusYear","onClick","getFullYear","isFocused","years","Array","from","length","_","index","getFocusableTime","isNow","timeSpan","_jsxs","className","children","colSpan","rowIndex","colIndex"],"mappings":"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"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { formatDate } from '@transferwise/formatting';
|
|
2
2
|
import { useIntl } from 'react-intl';
|
|
3
3
|
import { getFocusableTime } from '../../GetFocusableTime/GetFocusableTime.mjs';
|
|
4
|
-
import TableLink from '../../
|
|
4
|
+
import TableLink from '../../TableLink/TableLink.mjs';
|
|
5
5
|
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
6
6
|
|
|
7
7
|
const ROWS = 5;
|
|
@@ -11,6 +11,7 @@ const YEAR_ONLY_FORMAT = {
|
|
|
11
11
|
};
|
|
12
12
|
const YearCalendarTable = ({
|
|
13
13
|
selectedDate,
|
|
14
|
+
focusedDate,
|
|
14
15
|
min,
|
|
15
16
|
max,
|
|
16
17
|
viewYear,
|
|
@@ -27,7 +28,8 @@ const YearCalendarTable = ({
|
|
|
27
28
|
type: "year",
|
|
28
29
|
title: formatDate(new Date(year, 0), locale, YEAR_ONLY_FORMAT),
|
|
29
30
|
active: isActive(year),
|
|
30
|
-
|
|
31
|
+
outOfRange: isDisabled(year),
|
|
32
|
+
disabled: false,
|
|
31
33
|
today: isThisYear(year),
|
|
32
34
|
autofocus: autofocusYear === year,
|
|
33
35
|
onClick: onSelect
|
|
@@ -36,6 +38,9 @@ const YearCalendarTable = ({
|
|
|
36
38
|
const isActive = year => {
|
|
37
39
|
return !!(year === selectedDate?.getFullYear());
|
|
38
40
|
};
|
|
41
|
+
const isFocused = year => {
|
|
42
|
+
return !!(year === focusedDate?.getFullYear());
|
|
43
|
+
};
|
|
39
44
|
const isThisYear = year => {
|
|
40
45
|
return year === new Date().getFullYear();
|
|
41
46
|
};
|
|
@@ -47,7 +52,7 @@ const YearCalendarTable = ({
|
|
|
47
52
|
length: ROWS * COLS
|
|
48
53
|
}, (_, index) => startYear + index);
|
|
49
54
|
return getFocusableTime({
|
|
50
|
-
isActive,
|
|
55
|
+
isActive: isFocused,
|
|
51
56
|
isNow: isThisYear,
|
|
52
57
|
isDisabled,
|
|
53
58
|
timeSpan: years
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"YearCalendarTable.mjs","sources":["../../../../src/Calendar/YearCalendar/Table/YearCalendarTable.tsx"],"sourcesContent":["import { formatDate } from '@transferwise/formatting';\nimport { useIntl } from 'react-intl';\n\nimport { getFocusableTime } from '../../GetFocusableTime/GetFocusableTime';\nimport TableLink from '../../
|
|
1
|
+
{"version":3,"file":"YearCalendarTable.mjs","sources":["../../../../src/Calendar/YearCalendar/Table/YearCalendarTable.tsx"],"sourcesContent":["import { formatDate } from '@transferwise/formatting';\nimport { useIntl } from 'react-intl';\n\nimport { getFocusableTime } from '../../GetFocusableTime/GetFocusableTime';\nimport TableLink from '../../TableLink';\n\ninterface YearCalendarTableProps {\n selectedDate: Date | null;\n focusedDate?: Date | null;\n min: Date | null;\n max: Date | null;\n viewYear: number;\n placeholder?: string;\n onSelect: (year: number) => void;\n}\n\nconst ROWS = 5;\nconst COLS = 4;\nconst YEAR_ONLY_FORMAT: Intl.DateTimeFormatOptions = { year: 'numeric' };\n\nconst YearCalendarTable = ({\n selectedDate,\n focusedDate,\n min,\n max,\n viewYear,\n placeholder,\n onSelect,\n}: YearCalendarTableProps) => {\n const { locale } = useIntl();\n const startYear = viewYear - (viewYear % 20);\n const getLink = (year: number) => {\n return (\n <TableLink\n item={year}\n type=\"year\"\n title={formatDate(new Date(year, 0), locale, YEAR_ONLY_FORMAT)}\n active={isActive(year)}\n outOfRange={isDisabled(year)}\n disabled={false}\n today={isThisYear(year)}\n autofocus={autofocusYear === year}\n onClick={onSelect}\n />\n );\n };\n\n const isActive = (year: number) => {\n return !!(year === selectedDate?.getFullYear());\n };\n\n const isFocused = (year: number) => {\n return !!(year === focusedDate?.getFullYear());\n };\n\n const isThisYear = (year: number) => {\n return year === new Date().getFullYear();\n };\n\n const isDisabled = (year: number) => {\n return !!((min && year < min.getFullYear()) || (max && year > max.getFullYear()));\n };\n\n const autofocusYear = (() => {\n const years = Array.from({ length: ROWS * COLS }, (_, index) => startYear + index);\n return getFocusableTime({\n isActive: isFocused,\n isNow: isThisYear,\n isDisabled,\n timeSpan: years,\n });\n })();\n\n return (\n <table className=\"table table-condensed table-bordered tw-date-lookup-calendar m-b-0\">\n <thead className=\"sr-only\">\n <tr>\n <th colSpan={COLS}>{placeholder}</th>\n </tr>\n </thead>\n <tbody>\n {Array.from({ length: ROWS }, (_, rowIndex) => (\n <tr key={rowIndex}>\n {Array.from({ length: COLS }, (_, colIndex) => (\n <td key={colIndex}>{getLink(startYear + rowIndex * COLS + colIndex)}</td>\n ))}\n </tr>\n ))}\n </tbody>\n </table>\n );\n};\n\nexport default YearCalendarTable;\n"],"names":["ROWS","COLS","YEAR_ONLY_FORMAT","year","YearCalendarTable","selectedDate","focusedDate","min","max","viewYear","placeholder","onSelect","locale","useIntl","startYear","getLink","_jsx","TableLink","item","type","title","formatDate","Date","active","isActive","outOfRange","isDisabled","disabled","today","isThisYear","autofocus","autofocusYear","onClick","getFullYear","isFocused","years","Array","from","length","_","index","getFocusableTime","isNow","timeSpan","_jsxs","className","children","colSpan","rowIndex","colIndex"],"mappings":"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"}
|
|
@@ -29,6 +29,7 @@ let YearCalendar$1 = class YearCalendar extends React.PureComponent {
|
|
|
29
29
|
render() {
|
|
30
30
|
const {
|
|
31
31
|
selectedDate,
|
|
32
|
+
focusedDate,
|
|
32
33
|
min,
|
|
33
34
|
max,
|
|
34
35
|
viewYear,
|
|
@@ -37,13 +38,19 @@ let YearCalendar$1 = class YearCalendar extends React.PureComponent {
|
|
|
37
38
|
formatMessage
|
|
38
39
|
}
|
|
39
40
|
} = this.props;
|
|
41
|
+
const startYear = viewYear - viewYear % 20;
|
|
42
|
+
const isPreviousDisabled = !!(min && startYear - 1 < min.getFullYear());
|
|
43
|
+
const isNextDisabled = !!(max && startYear + 20 > max.getFullYear());
|
|
40
44
|
return /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
|
|
41
45
|
children: [/*#__PURE__*/jsxRuntime.jsx(DateHeader.default, {
|
|
42
46
|
dateMode: formatMessage(Calendar_messages.default.twentyYears),
|
|
47
|
+
isPreviousDisabled: isPreviousDisabled,
|
|
48
|
+
isNextDisabled: isNextDisabled,
|
|
43
49
|
onPreviousClick: this.selectPreviousYears,
|
|
44
50
|
onNextClick: this.selectNextYears
|
|
45
51
|
}), /*#__PURE__*/jsxRuntime.jsx(YearCalendarTable.default, {
|
|
46
52
|
selectedDate: selectedDate,
|
|
53
|
+
focusedDate: focusedDate,
|
|
47
54
|
min: min,
|
|
48
55
|
max: max,
|
|
49
56
|
viewYear: viewYear,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"YearCalendar.js","sources":["../../../src/Calendar/YearCalendar/YearCalendar.tsx"],"sourcesContent":["import { PureComponent } from 'react';\nimport { injectIntl, type WrappedComponentProps } from '../../common/injectIntl';\n\nimport messages from '../Calendar.messages';\nimport DateHeader from '../DateHeader';\n\nimport YearCalendarTable from './Table';\n\ninterface YearCalendarProps extends WrappedComponentProps {\n selectedDate: Date | null;\n min: Date | null;\n max: Date | null;\n viewYear: number;\n placeholder?: string;\n onSelect: () => void;\n onViewDateUpdate: (date: { year: number }) => void;\n}\n\nclass YearCalendar extends PureComponent<YearCalendarProps> {\n onYearSelect = (year: number) => {\n this.props.onViewDateUpdate({ year });\n this.props.onSelect();\n };\n\n selectPreviousYears = () => {\n this.props.onViewDateUpdate({ year: this.props.viewYear - 20 });\n };\n\n selectNextYears = () => {\n this.props.onViewDateUpdate({ year: this.props.viewYear + 20 });\n };\n\n render() {\n const {\n selectedDate,\n min,\n max,\n viewYear,\n placeholder,\n intl: { formatMessage },\n } = this.props;\n return (\n <>\n <DateHeader\n dateMode={formatMessage(messages.twentyYears)}\n onPreviousClick={this.selectPreviousYears}\n onNextClick={this.selectNextYears}\n />\n <YearCalendarTable\n selectedDate={selectedDate}\n min={min}\n max={max}\n viewYear={viewYear}\n placeholder={placeholder}\n onSelect={this.onYearSelect}\n />\n </>\n );\n }\n}\n\nexport default injectIntl(YearCalendar);\n"],"names":["YearCalendar","PureComponent","onYearSelect","year","props","onViewDateUpdate","onSelect","selectPreviousYears","viewYear","selectNextYears","render","selectedDate","min","max","placeholder","intl","formatMessage","_jsxs","_Fragment","children","_jsx","DateHeader","dateMode","messages","twentyYears","onPreviousClick","onNextClick","YearCalendarTable","injectIntl"],"mappings":";;;;;;;;;;;
|
|
1
|
+
{"version":3,"file":"YearCalendar.js","sources":["../../../src/Calendar/YearCalendar/YearCalendar.tsx"],"sourcesContent":["import { PureComponent } from 'react';\nimport { injectIntl, type WrappedComponentProps } from '../../common/injectIntl';\n\nimport messages from '../Calendar.messages';\nimport DateHeader from '../DateHeader';\n\nimport YearCalendarTable from './Table';\n\ninterface YearCalendarProps extends WrappedComponentProps {\n selectedDate: Date | null;\n focusedDate?: Date | null;\n min: Date | null;\n max: Date | null;\n viewYear: number;\n placeholder?: string;\n onSelect: () => void;\n onViewDateUpdate: (date: { year: number }) => void;\n}\n\nclass YearCalendar extends PureComponent<YearCalendarProps> {\n onYearSelect = (year: number) => {\n this.props.onViewDateUpdate({ year });\n this.props.onSelect();\n };\n\n selectPreviousYears = () => {\n this.props.onViewDateUpdate({ year: this.props.viewYear - 20 });\n };\n\n selectNextYears = () => {\n this.props.onViewDateUpdate({ year: this.props.viewYear + 20 });\n };\n\n render() {\n const {\n selectedDate,\n focusedDate,\n min,\n max,\n viewYear,\n placeholder,\n intl: { formatMessage },\n } = this.props;\n const startYear = viewYear - (viewYear % 20);\n const isPreviousDisabled = !!(min && startYear - 1 < min.getFullYear());\n const isNextDisabled = !!(max && startYear + 20 > max.getFullYear());\n\n return (\n <>\n <DateHeader\n dateMode={formatMessage(messages.twentyYears)}\n isPreviousDisabled={isPreviousDisabled}\n isNextDisabled={isNextDisabled}\n onPreviousClick={this.selectPreviousYears}\n onNextClick={this.selectNextYears}\n />\n <YearCalendarTable\n selectedDate={selectedDate}\n focusedDate={focusedDate}\n min={min}\n max={max}\n viewYear={viewYear}\n placeholder={placeholder}\n onSelect={this.onYearSelect}\n />\n </>\n );\n }\n}\n\nexport default injectIntl(YearCalendar);\n"],"names":["YearCalendar","PureComponent","onYearSelect","year","props","onViewDateUpdate","onSelect","selectPreviousYears","viewYear","selectNextYears","render","selectedDate","focusedDate","min","max","placeholder","intl","formatMessage","startYear","isPreviousDisabled","getFullYear","isNextDisabled","_jsxs","_Fragment","children","_jsx","DateHeader","dateMode","messages","twentyYears","onPreviousClick","onNextClick","YearCalendarTable","injectIntl"],"mappings":";;;;;;;;;;;qBAmBA,MAAMA,YAAa,SAAQC,mBAAgC,CAAA;EACzDC,YAAY,GAAIC,IAAY,IAAI;AAC9B,IAAA,IAAI,CAACC,KAAK,CAACC,gBAAgB,CAAC;AAAEF,MAAAA;AAAI,KAAE,CAAC;AACrC,IAAA,IAAI,CAACC,KAAK,CAACE,QAAQ,EAAE;EACvB,CAAC;EAEDC,mBAAmB,GAAGA,MAAK;AACzB,IAAA,IAAI,CAACH,KAAK,CAACC,gBAAgB,CAAC;AAAEF,MAAAA,IAAI,EAAE,IAAI,CAACC,KAAK,CAACI,QAAQ,GAAG;AAAE,KAAE,CAAC;EACjE,CAAC;EAEDC,eAAe,GAAGA,MAAK;AACrB,IAAA,IAAI,CAACL,KAAK,CAACC,gBAAgB,CAAC;AAAEF,MAAAA,IAAI,EAAE,IAAI,CAACC,KAAK,CAACI,QAAQ,GAAG;AAAE,KAAE,CAAC;EACjE,CAAC;AAEDE,EAAAA,MAAMA,GAAA;IACJ,MAAM;MACJC,YAAY;MACZC,WAAW;MACXC,GAAG;MACHC,GAAG;MACHN,QAAQ;MACRO,WAAW;AACXC,MAAAA,IAAI,EAAE;AAAEC,QAAAA;AAAa;KACtB,GAAG,IAAI,CAACb,KAAK;AACd,IAAA,MAAMc,SAAS,GAAGV,QAAQ,GAAIA,QAAQ,GAAG,EAAG;AAC5C,IAAA,MAAMW,kBAAkB,GAAG,CAAC,EAAEN,GAAG,IAAIK,SAAS,GAAG,CAAC,GAAGL,GAAG,CAACO,WAAW,EAAE,CAAC;AACvE,IAAA,MAAMC,cAAc,GAAG,CAAC,EAAEP,GAAG,IAAII,SAAS,GAAG,EAAE,GAAGJ,GAAG,CAACM,WAAW,EAAE,CAAC;IAEpE,oBACEE,eAAA,CAAAC,mBAAA,EAAA;MAAAC,QAAA,EAAA,cACEC,cAAA,CAACC,kBAAU,EAAA;AACTC,QAAAA,QAAQ,EAAEV,aAAa,CAACW,yBAAQ,CAACC,WAAW,CAAE;AAC9CV,QAAAA,kBAAkB,EAAEA,kBAAmB;AACvCE,QAAAA,cAAc,EAAEA,cAAe;QAC/BS,eAAe,EAAE,IAAI,CAACvB,mBAAoB;QAC1CwB,WAAW,EAAE,IAAI,CAACtB;AAAgB,OAAA,CAEpC,eAAAgB,cAAA,CAACO,yBAAiB,EAAA;AAChBrB,QAAAA,YAAY,EAAEA,YAAa;AAC3BC,QAAAA,WAAW,EAAEA,WAAY;AACzBC,QAAAA,GAAG,EAAEA,GAAI;AACTC,QAAAA,GAAG,EAAEA,GAAI;AACTN,QAAAA,QAAQ,EAAEA,QAAS;AACnBO,QAAAA,WAAW,EAAEA,WAAY;QACzBT,QAAQ,EAAE,IAAI,CAACJ;AAAa,OAAA,CAEhC;AAAA,KAAA,CAAG;AAEP,EAAA;AACD;AAED,mBAAe+B,qBAAU,CAACjC,cAAY,CAAC;;;;"}
|
|
@@ -25,6 +25,7 @@ class YearCalendar extends PureComponent {
|
|
|
25
25
|
render() {
|
|
26
26
|
const {
|
|
27
27
|
selectedDate,
|
|
28
|
+
focusedDate,
|
|
28
29
|
min,
|
|
29
30
|
max,
|
|
30
31
|
viewYear,
|
|
@@ -33,13 +34,19 @@ class YearCalendar extends PureComponent {
|
|
|
33
34
|
formatMessage
|
|
34
35
|
}
|
|
35
36
|
} = this.props;
|
|
37
|
+
const startYear = viewYear - viewYear % 20;
|
|
38
|
+
const isPreviousDisabled = !!(min && startYear - 1 < min.getFullYear());
|
|
39
|
+
const isNextDisabled = !!(max && startYear + 20 > max.getFullYear());
|
|
36
40
|
return /*#__PURE__*/jsxs(Fragment, {
|
|
37
41
|
children: [/*#__PURE__*/jsx(DateHeader, {
|
|
38
42
|
dateMode: formatMessage(messages.twentyYears),
|
|
43
|
+
isPreviousDisabled: isPreviousDisabled,
|
|
44
|
+
isNextDisabled: isNextDisabled,
|
|
39
45
|
onPreviousClick: this.selectPreviousYears,
|
|
40
46
|
onNextClick: this.selectNextYears
|
|
41
47
|
}), /*#__PURE__*/jsx(YearCalendarTable, {
|
|
42
48
|
selectedDate: selectedDate,
|
|
49
|
+
focusedDate: focusedDate,
|
|
43
50
|
min: min,
|
|
44
51
|
max: max,
|
|
45
52
|
viewYear: viewYear,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"YearCalendar.mjs","sources":["../../../src/Calendar/YearCalendar/YearCalendar.tsx"],"sourcesContent":["import { PureComponent } from 'react';\nimport { injectIntl, type WrappedComponentProps } from '../../common/injectIntl';\n\nimport messages from '../Calendar.messages';\nimport DateHeader from '../DateHeader';\n\nimport YearCalendarTable from './Table';\n\ninterface YearCalendarProps extends WrappedComponentProps {\n selectedDate: Date | null;\n min: Date | null;\n max: Date | null;\n viewYear: number;\n placeholder?: string;\n onSelect: () => void;\n onViewDateUpdate: (date: { year: number }) => void;\n}\n\nclass YearCalendar extends PureComponent<YearCalendarProps> {\n onYearSelect = (year: number) => {\n this.props.onViewDateUpdate({ year });\n this.props.onSelect();\n };\n\n selectPreviousYears = () => {\n this.props.onViewDateUpdate({ year: this.props.viewYear - 20 });\n };\n\n selectNextYears = () => {\n this.props.onViewDateUpdate({ year: this.props.viewYear + 20 });\n };\n\n render() {\n const {\n selectedDate,\n min,\n max,\n viewYear,\n placeholder,\n intl: { formatMessage },\n } = this.props;\n return (\n <>\n <DateHeader\n dateMode={formatMessage(messages.twentyYears)}\n onPreviousClick={this.selectPreviousYears}\n onNextClick={this.selectNextYears}\n />\n <YearCalendarTable\n selectedDate={selectedDate}\n min={min}\n max={max}\n viewYear={viewYear}\n placeholder={placeholder}\n onSelect={this.onYearSelect}\n />\n </>\n );\n }\n}\n\nexport default injectIntl(YearCalendar);\n"],"names":["YearCalendar","PureComponent","onYearSelect","year","props","onViewDateUpdate","onSelect","selectPreviousYears","viewYear","selectNextYears","render","selectedDate","min","max","placeholder","intl","formatMessage","_jsxs","_Fragment","children","_jsx","DateHeader","dateMode","messages","twentyYears","onPreviousClick","onNextClick","YearCalendarTable","injectIntl"],"mappings":";;;;;;;
|
|
1
|
+
{"version":3,"file":"YearCalendar.mjs","sources":["../../../src/Calendar/YearCalendar/YearCalendar.tsx"],"sourcesContent":["import { PureComponent } from 'react';\nimport { injectIntl, type WrappedComponentProps } from '../../common/injectIntl';\n\nimport messages from '../Calendar.messages';\nimport DateHeader from '../DateHeader';\n\nimport YearCalendarTable from './Table';\n\ninterface YearCalendarProps extends WrappedComponentProps {\n selectedDate: Date | null;\n focusedDate?: Date | null;\n min: Date | null;\n max: Date | null;\n viewYear: number;\n placeholder?: string;\n onSelect: () => void;\n onViewDateUpdate: (date: { year: number }) => void;\n}\n\nclass YearCalendar extends PureComponent<YearCalendarProps> {\n onYearSelect = (year: number) => {\n this.props.onViewDateUpdate({ year });\n this.props.onSelect();\n };\n\n selectPreviousYears = () => {\n this.props.onViewDateUpdate({ year: this.props.viewYear - 20 });\n };\n\n selectNextYears = () => {\n this.props.onViewDateUpdate({ year: this.props.viewYear + 20 });\n };\n\n render() {\n const {\n selectedDate,\n focusedDate,\n min,\n max,\n viewYear,\n placeholder,\n intl: { formatMessage },\n } = this.props;\n const startYear = viewYear - (viewYear % 20);\n const isPreviousDisabled = !!(min && startYear - 1 < min.getFullYear());\n const isNextDisabled = !!(max && startYear + 20 > max.getFullYear());\n\n return (\n <>\n <DateHeader\n dateMode={formatMessage(messages.twentyYears)}\n isPreviousDisabled={isPreviousDisabled}\n isNextDisabled={isNextDisabled}\n onPreviousClick={this.selectPreviousYears}\n onNextClick={this.selectNextYears}\n />\n <YearCalendarTable\n selectedDate={selectedDate}\n focusedDate={focusedDate}\n min={min}\n max={max}\n viewYear={viewYear}\n placeholder={placeholder}\n onSelect={this.onYearSelect}\n />\n </>\n );\n }\n}\n\nexport default injectIntl(YearCalendar);\n"],"names":["YearCalendar","PureComponent","onYearSelect","year","props","onViewDateUpdate","onSelect","selectPreviousYears","viewYear","selectNextYears","render","selectedDate","focusedDate","min","max","placeholder","intl","formatMessage","startYear","isPreviousDisabled","getFullYear","isNextDisabled","_jsxs","_Fragment","children","_jsx","DateHeader","dateMode","messages","twentyYears","onPreviousClick","onNextClick","YearCalendarTable","injectIntl"],"mappings":";;;;;;;AAmBA,MAAMA,YAAa,SAAQC,aAAgC,CAAA;EACzDC,YAAY,GAAIC,IAAY,IAAI;AAC9B,IAAA,IAAI,CAACC,KAAK,CAACC,gBAAgB,CAAC;AAAEF,MAAAA;AAAI,KAAE,CAAC;AACrC,IAAA,IAAI,CAACC,KAAK,CAACE,QAAQ,EAAE;EACvB,CAAC;EAEDC,mBAAmB,GAAGA,MAAK;AACzB,IAAA,IAAI,CAACH,KAAK,CAACC,gBAAgB,CAAC;AAAEF,MAAAA,IAAI,EAAE,IAAI,CAACC,KAAK,CAACI,QAAQ,GAAG;AAAE,KAAE,CAAC;EACjE,CAAC;EAEDC,eAAe,GAAGA,MAAK;AACrB,IAAA,IAAI,CAACL,KAAK,CAACC,gBAAgB,CAAC;AAAEF,MAAAA,IAAI,EAAE,IAAI,CAACC,KAAK,CAACI,QAAQ,GAAG;AAAE,KAAE,CAAC;EACjE,CAAC;AAEDE,EAAAA,MAAMA,GAAA;IACJ,MAAM;MACJC,YAAY;MACZC,WAAW;MACXC,GAAG;MACHC,GAAG;MACHN,QAAQ;MACRO,WAAW;AACXC,MAAAA,IAAI,EAAE;AAAEC,QAAAA;AAAa;KACtB,GAAG,IAAI,CAACb,KAAK;AACd,IAAA,MAAMc,SAAS,GAAGV,QAAQ,GAAIA,QAAQ,GAAG,EAAG;AAC5C,IAAA,MAAMW,kBAAkB,GAAG,CAAC,EAAEN,GAAG,IAAIK,SAAS,GAAG,CAAC,GAAGL,GAAG,CAACO,WAAW,EAAE,CAAC;AACvE,IAAA,MAAMC,cAAc,GAAG,CAAC,EAAEP,GAAG,IAAII,SAAS,GAAG,EAAE,GAAGJ,GAAG,CAACM,WAAW,EAAE,CAAC;IAEpE,oBACEE,IAAA,CAAAC,QAAA,EAAA;MAAAC,QAAA,EAAA,cACEC,GAAA,CAACC,UAAU,EAAA;AACTC,QAAAA,QAAQ,EAAEV,aAAa,CAACW,QAAQ,CAACC,WAAW,CAAE;AAC9CV,QAAAA,kBAAkB,EAAEA,kBAAmB;AACvCE,QAAAA,cAAc,EAAEA,cAAe;QAC/BS,eAAe,EAAE,IAAI,CAACvB,mBAAoB;QAC1CwB,WAAW,EAAE,IAAI,CAACtB;AAAgB,OAAA,CAEpC,eAAAgB,GAAA,CAACO,iBAAiB,EAAA;AAChBrB,QAAAA,YAAY,EAAEA,YAAa;AAC3BC,QAAAA,WAAW,EAAEA,WAAY;AACzBC,QAAAA,GAAG,EAAEA,GAAI;AACTC,QAAAA,GAAG,EAAEA,GAAI;AACTN,QAAAA,QAAQ,EAAEA,QAAS;AACnBO,QAAAA,WAAW,EAAEA,WAAY;QACzBT,QAAQ,EAAE,IAAI,CAACJ;AAAa,OAAA,CAEhC;AAAA,KAAA,CAAG;AAEP,EAAA;AACD;AAED,qBAAe+B,UAAU,CAACjC,YAAY,CAAC;;;;"}
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
/**
|
|
4
|
+
* Relaxed day-view keyboard clamping — allows navigation past min/max within the
|
|
5
|
+
* same calendar month, but blocks escape to a fully-outside month.
|
|
6
|
+
* Temporary measure; strict clamping may be restored.
|
|
7
|
+
* @see https://transferwise.atlassian.net/browse/DS-8518
|
|
8
|
+
*/
|
|
9
|
+
function clampToDayViewBoundary(date, min, max) {
|
|
10
|
+
if (min && date < min) {
|
|
11
|
+
const sameMonth = date.getMonth() === min.getMonth() && date.getFullYear() === min.getFullYear();
|
|
12
|
+
if (sameMonth) return date;
|
|
13
|
+
return new Date(min.getFullYear(), min.getMonth(), 1);
|
|
14
|
+
}
|
|
15
|
+
if (max && date > max) {
|
|
16
|
+
const sameMonth = date.getMonth() === max.getMonth() && date.getFullYear() === max.getFullYear();
|
|
17
|
+
if (sameMonth) return date;
|
|
18
|
+
return new Date(max.getFullYear(), max.getMonth() + 1, 0);
|
|
19
|
+
}
|
|
20
|
+
return date;
|
|
21
|
+
}
|
|
22
|
+
|
|
23
|
+
exports.clampToDayViewBoundary = clampToDayViewBoundary;
|
|
24
|
+
//# sourceMappingURL=clampToDayViewBoundary.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"clampToDayViewBoundary.js","sources":["../../../../src/Calendar/_helpers/clampToDayViewBoundary/clampToDayViewBoundary.ts"],"sourcesContent":["/**\n * Relaxed day-view keyboard clamping — allows navigation past min/max within the\n * same calendar month, but blocks escape to a fully-outside month.\n * Temporary measure; strict clamping may be restored.\n * @see https://transferwise.atlassian.net/browse/DS-8518\n */\nexport function clampToDayViewBoundary(\n date: Date,\n min: Date | null,\n max: Date | null,\n): Date {\n if (min && date < min) {\n const sameMonth =\n date.getMonth() === min.getMonth() && date.getFullYear() === min.getFullYear();\n if (sameMonth) return date;\n return new Date(min.getFullYear(), min.getMonth(), 1);\n }\n if (max && date > max) {\n const sameMonth =\n date.getMonth() === max.getMonth() && date.getFullYear() === max.getFullYear();\n if (sameMonth) return date;\n return new Date(max.getFullYear(), max.getMonth() + 1, 0);\n }\n return date;\n}\n"],"names":["clampToDayViewBoundary","date","min","max","sameMonth","getMonth","getFullYear","Date"],"mappings":";;AAAA;;;;;AAKG;SACaA,sBAAsBA,CACpCC,IAAU,EACVC,GAAgB,EAChBC,GAAgB,EAAA;AAEhB,EAAA,IAAID,GAAG,IAAID,IAAI,GAAGC,GAAG,EAAE;IACrB,MAAME,SAAS,GACbH,IAAI,CAACI,QAAQ,EAAE,KAAKH,GAAG,CAACG,QAAQ,EAAE,IAAIJ,IAAI,CAACK,WAAW,EAAE,KAAKJ,GAAG,CAACI,WAAW,EAAE;IAChF,IAAIF,SAAS,EAAE,OAAOH,IAAI;AAC1B,IAAA,OAAO,IAAIM,IAAI,CAACL,GAAG,CAACI,WAAW,EAAE,EAAEJ,GAAG,CAACG,QAAQ,EAAE,EAAE,CAAC,CAAC;AACvD,EAAA;AACA,EAAA,IAAIF,GAAG,IAAIF,IAAI,GAAGE,GAAG,EAAE;IACrB,MAAMC,SAAS,GACbH,IAAI,CAACI,QAAQ,EAAE,KAAKF,GAAG,CAACE,QAAQ,EAAE,IAAIJ,IAAI,CAACK,WAAW,EAAE,KAAKH,GAAG,CAACG,WAAW,EAAE;IAChF,IAAIF,SAAS,EAAE,OAAOH,IAAI;AAC1B,IAAA,OAAO,IAAIM,IAAI,CAACJ,GAAG,CAACG,WAAW,EAAE,EAAEH,GAAG,CAACE,QAAQ,EAAE,GAAG,CAAC,EAAE,CAAC,CAAC;AAC3D,EAAA;AACA,EAAA,OAAOJ,IAAI;AACb;;;;"}
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Relaxed day-view keyboard clamping — allows navigation past min/max within the
|
|
3
|
+
* same calendar month, but blocks escape to a fully-outside month.
|
|
4
|
+
* Temporary measure; strict clamping may be restored.
|
|
5
|
+
* @see https://transferwise.atlassian.net/browse/DS-8518
|
|
6
|
+
*/
|
|
7
|
+
function clampToDayViewBoundary(date, min, max) {
|
|
8
|
+
if (min && date < min) {
|
|
9
|
+
const sameMonth = date.getMonth() === min.getMonth() && date.getFullYear() === min.getFullYear();
|
|
10
|
+
if (sameMonth) return date;
|
|
11
|
+
return new Date(min.getFullYear(), min.getMonth(), 1);
|
|
12
|
+
}
|
|
13
|
+
if (max && date > max) {
|
|
14
|
+
const sameMonth = date.getMonth() === max.getMonth() && date.getFullYear() === max.getFullYear();
|
|
15
|
+
if (sameMonth) return date;
|
|
16
|
+
return new Date(max.getFullYear(), max.getMonth() + 1, 0);
|
|
17
|
+
}
|
|
18
|
+
return date;
|
|
19
|
+
}
|
|
20
|
+
|
|
21
|
+
export { clampToDayViewBoundary };
|
|
22
|
+
//# sourceMappingURL=clampToDayViewBoundary.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"clampToDayViewBoundary.mjs","sources":["../../../../src/Calendar/_helpers/clampToDayViewBoundary/clampToDayViewBoundary.ts"],"sourcesContent":["/**\n * Relaxed day-view keyboard clamping — allows navigation past min/max within the\n * same calendar month, but blocks escape to a fully-outside month.\n * Temporary measure; strict clamping may be restored.\n * @see https://transferwise.atlassian.net/browse/DS-8518\n */\nexport function clampToDayViewBoundary(\n date: Date,\n min: Date | null,\n max: Date | null,\n): Date {\n if (min && date < min) {\n const sameMonth =\n date.getMonth() === min.getMonth() && date.getFullYear() === min.getFullYear();\n if (sameMonth) return date;\n return new Date(min.getFullYear(), min.getMonth(), 1);\n }\n if (max && date > max) {\n const sameMonth =\n date.getMonth() === max.getMonth() && date.getFullYear() === max.getFullYear();\n if (sameMonth) return date;\n return new Date(max.getFullYear(), max.getMonth() + 1, 0);\n }\n return date;\n}\n"],"names":["clampToDayViewBoundary","date","min","max","sameMonth","getMonth","getFullYear","Date"],"mappings":"AAAA;;;;;AAKG;SACaA,sBAAsBA,CACpCC,IAAU,EACVC,GAAgB,EAChBC,GAAgB,EAAA;AAEhB,EAAA,IAAID,GAAG,IAAID,IAAI,GAAGC,GAAG,EAAE;IACrB,MAAME,SAAS,GACbH,IAAI,CAACI,QAAQ,EAAE,KAAKH,GAAG,CAACG,QAAQ,EAAE,IAAIJ,IAAI,CAACK,WAAW,EAAE,KAAKJ,GAAG,CAACI,WAAW,EAAE;IAChF,IAAIF,SAAS,EAAE,OAAOH,IAAI;AAC1B,IAAA,OAAO,IAAIM,IAAI,CAACL,GAAG,CAACI,WAAW,EAAE,EAAEJ,GAAG,CAACG,QAAQ,EAAE,EAAE,CAAC,CAAC;AACvD,EAAA;AACA,EAAA,IAAIF,GAAG,IAAIF,IAAI,GAAGE,GAAG,EAAE;IACrB,MAAMC,SAAS,GACbH,IAAI,CAACI,QAAQ,EAAE,KAAKF,GAAG,CAACE,QAAQ,EAAE,IAAIJ,IAAI,CAACK,WAAW,EAAE,KAAKH,GAAG,CAACG,WAAW,EAAE;IAChF,IAAIF,SAAS,EAAE,OAAOH,IAAI;AAC1B,IAAA,OAAO,IAAIM,IAAI,CAACJ,GAAG,CAACG,WAAW,EAAE,EAAEH,GAAG,CAACE,QAAQ,EAAE,GAAG,CAAC,EAAE,CAAC,CAAC;AAC3D,EAAA;AACA,EAAA,OAAOJ,IAAI;AACb;;;;"}
|
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
function hasDisabledDatesInMonth(month, year, disabledRules, min, max) {
|
|
4
|
+
if (!disabledRules) return false;
|
|
5
|
+
if (disabledRules.weekdays?.length) {
|
|
6
|
+
return true;
|
|
7
|
+
}
|
|
8
|
+
const monthStart = new Date(year, month, 1);
|
|
9
|
+
const monthEnd = new Date(year, month + 1, 0);
|
|
10
|
+
if (disabledRules.dates?.length) {
|
|
11
|
+
const hasDateInMonth = disabledRules.dates.some(date => {
|
|
12
|
+
if (date.getFullYear() !== year || date.getMonth() !== month) return false;
|
|
13
|
+
if (min && date < min) return false;
|
|
14
|
+
if (max && date > max) return false;
|
|
15
|
+
return true;
|
|
16
|
+
});
|
|
17
|
+
if (hasDateInMonth) return true;
|
|
18
|
+
}
|
|
19
|
+
if (disabledRules.ranges?.length) {
|
|
20
|
+
const hasOverlap = disabledRules.ranges.some(range => {
|
|
21
|
+
const rangeStart = new Date(range.start.getFullYear(), range.start.getMonth(), range.start.getDate());
|
|
22
|
+
const rangeEnd = new Date(range.end.getFullYear(), range.end.getMonth(), range.end.getDate());
|
|
23
|
+
if (max && rangeStart > max) return false;
|
|
24
|
+
if (min && rangeEnd < min) return false;
|
|
25
|
+
return rangeStart <= monthEnd && rangeEnd >= monthStart;
|
|
26
|
+
});
|
|
27
|
+
if (hasOverlap) return true;
|
|
28
|
+
}
|
|
29
|
+
return false;
|
|
30
|
+
}
|
|
31
|
+
|
|
32
|
+
exports.hasDisabledDatesInMonth = hasDisabledDatesInMonth;
|
|
33
|
+
//# sourceMappingURL=hasDisabledDatesInMonth.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"hasDisabledDatesInMonth.js","sources":["../../../../src/Calendar/_helpers/hasDisabledDatesInMonth/hasDisabledDatesInMonth.ts"],"sourcesContent":["import type { DisabledRules } from '../../Calendar.types';\n\nexport function hasDisabledDatesInMonth(\n month: number,\n year: number,\n disabledRules?: DisabledRules,\n min?: Date | null,\n max?: Date | null,\n): boolean {\n if (!disabledRules) return false;\n\n if (disabledRules.weekdays?.length) {\n return true;\n }\n\n const monthStart = new Date(year, month, 1);\n const monthEnd = new Date(year, month + 1, 0);\n\n if (disabledRules.dates?.length) {\n const hasDateInMonth = disabledRules.dates.some((date) => {\n if (date.getFullYear() !== year || date.getMonth() !== month) return false;\n if (min && date < min) return false;\n if (max && date > max) return false;\n return true;\n });\n if (hasDateInMonth) return true;\n }\n\n if (disabledRules.ranges?.length) {\n const hasOverlap = disabledRules.ranges.some((range) => {\n const rangeStart = new Date(\n range.start.getFullYear(),\n range.start.getMonth(),\n range.start.getDate(),\n );\n const rangeEnd = new Date(range.end.getFullYear(), range.end.getMonth(), range.end.getDate());\n if (max && rangeStart > max) return false;\n if (min && rangeEnd < min) return false;\n return rangeStart <= monthEnd && rangeEnd >= monthStart;\n });\n if (hasOverlap) return true;\n }\n\n return false;\n}\n"],"names":["hasDisabledDatesInMonth","month","year","disabledRules","min","max","weekdays","length","monthStart","Date","monthEnd","dates","hasDateInMonth","some","date","getFullYear","getMonth","ranges","hasOverlap","range","rangeStart","start","getDate","rangeEnd","end"],"mappings":";;AAEM,SAAUA,uBAAuBA,CACrCC,KAAa,EACbC,IAAY,EACZC,aAA6B,EAC7BC,GAAiB,EACjBC,GAAiB,EAAA;AAEjB,EAAA,IAAI,CAACF,aAAa,EAAE,OAAO,KAAK;AAEhC,EAAA,IAAIA,aAAa,CAACG,QAAQ,EAAEC,MAAM,EAAE;AAClC,IAAA,OAAO,IAAI;AACb,EAAA;EAEA,MAAMC,UAAU,GAAG,IAAIC,IAAI,CAACP,IAAI,EAAED,KAAK,EAAE,CAAC,CAAC;AAC3C,EAAA,MAAMS,QAAQ,GAAG,IAAID,IAAI,CAACP,IAAI,EAAED,KAAK,GAAG,CAAC,EAAE,CAAC,CAAC;AAE7C,EAAA,IAAIE,aAAa,CAACQ,KAAK,EAAEJ,MAAM,EAAE;IAC/B,MAAMK,cAAc,GAAGT,aAAa,CAACQ,KAAK,CAACE,IAAI,CAAEC,IAAI,IAAI;AACvD,MAAA,IAAIA,IAAI,CAACC,WAAW,EAAE,KAAKb,IAAI,IAAIY,IAAI,CAACE,QAAQ,EAAE,KAAKf,KAAK,EAAE,OAAO,KAAK;AAC1E,MAAA,IAAIG,GAAG,IAAIU,IAAI,GAAGV,GAAG,EAAE,OAAO,KAAK;AACnC,MAAA,IAAIC,GAAG,IAAIS,IAAI,GAAGT,GAAG,EAAE,OAAO,KAAK;AACnC,MAAA,OAAO,IAAI;AACb,IAAA,CAAC,CAAC;IACF,IAAIO,cAAc,EAAE,OAAO,IAAI;AACjC,EAAA;AAEA,EAAA,IAAIT,aAAa,CAACc,MAAM,EAAEV,MAAM,EAAE;IAChC,MAAMW,UAAU,GAAGf,aAAa,CAACc,MAAM,CAACJ,IAAI,CAAEM,KAAK,IAAI;AACrD,MAAA,MAAMC,UAAU,GAAG,IAAIX,IAAI,CACzBU,KAAK,CAACE,KAAK,CAACN,WAAW,EAAE,EACzBI,KAAK,CAACE,KAAK,CAACL,QAAQ,EAAE,EACtBG,KAAK,CAACE,KAAK,CAACC,OAAO,EAAE,CACtB;AACD,MAAA,MAAMC,QAAQ,GAAG,IAAId,IAAI,CAACU,KAAK,CAACK,GAAG,CAACT,WAAW,EAAE,EAAEI,KAAK,CAACK,GAAG,CAACR,QAAQ,EAAE,EAAEG,KAAK,CAACK,GAAG,CAACF,OAAO,EAAE,CAAC;AAC7F,MAAA,IAAIjB,GAAG,IAAIe,UAAU,GAAGf,GAAG,EAAE,OAAO,KAAK;AACzC,MAAA,IAAID,GAAG,IAAImB,QAAQ,GAAGnB,GAAG,EAAE,OAAO,KAAK;AACvC,MAAA,OAAOgB,UAAU,IAAIV,QAAQ,IAAIa,QAAQ,IAAIf,UAAU;AACzD,IAAA,CAAC,CAAC;IACF,IAAIU,UAAU,EAAE,OAAO,IAAI;AAC7B,EAAA;AAEA,EAAA,OAAO,KAAK;AACd;;;;"}
|