@ahrowe/ui 0.42.0 → 0.44.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/CHANGELOG.md +946 -0
- package/README.md +14 -12
- package/dist/cjs-types/common/accordion/accordion.types.d.ts +17 -2
- package/dist/cjs-types/common/actionButtons/actionButtons.types.d.ts +7 -1
- package/dist/cjs-types/common/actionIcon/actionIcon.d.ts +1 -1
- package/dist/cjs-types/common/actionIcon/actionIcon.types.d.ts +7 -9
- package/dist/cjs-types/common/alert/alert.types.d.ts +6 -8
- package/dist/cjs-types/common/animatedLogo/animatedLogo.types.d.ts +3 -2
- package/dist/cjs-types/common/badge/badge.types.d.ts +10 -6
- package/dist/cjs-types/common/button/button.types.d.ts +14 -4
- package/dist/cjs-types/common/calendar/calendar.types.d.ts +25 -10
- package/dist/cjs-types/common/calendar/components/agendaList/agendaList.d.ts +1 -1
- package/dist/cjs-types/common/calendar/components/agendaList/agendaList.types.d.ts +3 -0
- package/dist/cjs-types/common/calendar/components/calendarHeader/calendarHeader.d.ts +1 -1
- package/dist/cjs-types/common/calendar/components/calendarHeader/calendarHeader.types.d.ts +2 -0
- package/dist/cjs-types/common/calendar/components/compactMonth/compactMonth.d.ts +1 -1
- package/dist/cjs-types/common/calendar/components/monthView/monthView.d.ts +1 -1
- package/dist/cjs-types/common/calendar/components/monthView/monthView.types.d.ts +3 -2
- package/dist/cjs-types/common/calendar/components/timeGrid/timeGrid.d.ts +1 -1
- package/dist/cjs-types/common/calendar/components/timeGrid/timeGrid.types.d.ts +9 -1
- package/dist/cjs-types/common/calendar/dates.d.ts +21 -5
- package/dist/cjs-types/common/calendar/format.d.ts +3 -2
- package/dist/cjs-types/common/calendar/layout.d.ts +5 -0
- package/dist/cjs-types/common/calendar/useNow.d.ts +4 -0
- package/dist/cjs-types/common/calendar/view.types.d.ts +9 -2
- package/dist/cjs-types/common/card/card.types.d.ts +16 -2
- package/dist/cjs-types/common/chip/chip.types.d.ts +10 -5
- package/dist/cjs-types/common/configProvider/configProvider.types.d.ts +4 -0
- package/dist/cjs-types/common/copyButton/copyButton.types.d.ts +5 -4
- package/dist/cjs-types/common/fab/components/fabBase/fabBase.d.ts +1 -1
- package/dist/cjs-types/common/fab/components/fabBase/fabBase.types.d.ts +2 -1
- package/dist/cjs-types/common/loader/index.d.ts +2 -0
- package/dist/cjs-types/common/loader/loader.d.ts +4 -0
- package/dist/cjs-types/common/loader/loader.types.d.ts +31 -0
- package/dist/cjs-types/common/loadingOverlay/index.d.ts +2 -0
- package/dist/cjs-types/common/loadingOverlay/loadingOverlay.d.ts +4 -0
- package/dist/cjs-types/common/loadingOverlay/loadingOverlay.types.d.ts +21 -0
- package/dist/cjs-types/common/progressBar/progressBar.d.ts +0 -1
- package/dist/cjs-types/common/progressBar/progressBar.types.d.ts +3 -1
- package/dist/cjs-types/common/splitButton/splitButton.types.d.ts +4 -1
- package/dist/cjs-types/common/styles/tone.d.ts +11 -0
- package/dist/cjs-types/common/themeProvider/color.types.d.ts +20 -0
- package/dist/cjs-types/common/themeProvider/index.d.ts +2 -0
- package/dist/cjs-types/common/themeProvider/theme.types.d.ts +7 -6
- package/dist/cjs-types/common/timeline/timeline.types.d.ts +3 -10
- package/dist/cjs-types/common/toast/index.d.ts +1 -1
- package/dist/cjs-types/common/toast/toast.types.d.ts +7 -3
- package/dist/cjs-types/common/types/actions.types.d.ts +1 -1
- package/dist/cjs-types/common/utils/dismissClick.d.ts +4 -0
- package/dist/cjs-types/common/utils/isDev.d.ts +1 -0
- package/dist/cjs-types/index.d.ts +4 -1
- package/dist/esm/common/accordion/accordion.mjs +1 -1
- package/dist/esm/common/accordion/accordion.mjs.map +1 -1
- package/dist/esm/common/accordion/accordion.module.mjs +1 -1
- package/dist/esm/common/accordion/accordion.module.mjs.map +1 -1
- package/dist/esm/common/accordion/accordion.types.mjs +1 -1
- package/dist/esm/common/accordion/accordion.types.mjs.map +1 -1
- package/dist/esm/common/actionButtons/actionButtons.mjs +1 -1
- package/dist/esm/common/actionButtons/actionButtons.mjs.map +1 -1
- package/dist/esm/common/actionIcon/actionIcon.mjs +1 -1
- package/dist/esm/common/actionIcon/actionIcon.mjs.map +1 -1
- package/dist/esm/common/actionIcon/actionIcon.module.mjs +1 -1
- package/dist/esm/common/actionIcon/actionIcon.module.mjs.map +1 -1
- package/dist/esm/common/alert/alert.mjs +1 -1
- package/dist/esm/common/alert/alert.mjs.map +1 -1
- package/dist/esm/common/alert/alert.module.mjs +1 -1
- package/dist/esm/common/alert/alert.module.mjs.map +1 -1
- package/dist/esm/common/animatedLogo/animatedLogo.mjs +1 -1
- package/dist/esm/common/animatedLogo/animatedLogo.mjs.map +1 -1
- package/dist/esm/common/avatar/avatar.mjs +1 -1
- package/dist/esm/common/avatar/avatar.mjs.map +1 -1
- package/dist/esm/common/badge/badge.mjs +1 -1
- package/dist/esm/common/badge/badge.mjs.map +1 -1
- package/dist/esm/common/badge/badge.module.mjs +1 -1
- package/dist/esm/common/badge/badge.module.mjs.map +1 -1
- package/dist/esm/common/badge/badge.types.mjs +1 -1
- package/dist/esm/common/badge/badge.types.mjs.map +1 -1
- package/dist/esm/common/bodyEnd/bodyEnd.mjs +1 -1
- package/dist/esm/common/bodyEnd/bodyEnd.mjs.map +1 -1
- package/dist/esm/common/breadcrumb/breadcrumb.mjs +1 -1
- package/dist/esm/common/breadcrumb/breadcrumb.mjs.map +1 -1
- package/dist/esm/common/breadcrumb/breadcrumb.module.mjs.map +1 -1
- package/dist/esm/common/button/button.mjs +1 -1
- package/dist/esm/common/button/button.mjs.map +1 -1
- package/dist/esm/common/button/button.module.mjs +1 -1
- package/dist/esm/common/button/button.module.mjs.map +1 -1
- package/dist/esm/common/button/button.types.mjs +1 -1
- package/dist/esm/common/button/button.types.mjs.map +1 -1
- package/dist/esm/common/calendar/calendar.mjs +1 -1
- package/dist/esm/common/calendar/calendar.mjs.map +1 -1
- package/dist/esm/common/calendar/calendar.module.mjs.map +1 -1
- package/dist/esm/common/calendar/calendar.types.mjs.map +1 -1
- package/dist/esm/common/calendar/components/agendaList/agendaList.mjs +1 -1
- package/dist/esm/common/calendar/components/agendaList/agendaList.mjs.map +1 -1
- package/dist/esm/common/calendar/components/agendaList/agendaList.module.mjs.map +1 -1
- package/dist/esm/common/calendar/components/calendarHeader/calendarHeader.mjs +1 -1
- package/dist/esm/common/calendar/components/calendarHeader/calendarHeader.mjs.map +1 -1
- package/dist/esm/common/calendar/components/calendarHeader/calendarHeader.module.mjs +1 -1
- package/dist/esm/common/calendar/components/calendarHeader/calendarHeader.module.mjs.map +1 -1
- package/dist/esm/common/calendar/components/compactMonth/compactMonth.mjs +1 -1
- package/dist/esm/common/calendar/components/compactMonth/compactMonth.mjs.map +1 -1
- package/dist/esm/common/calendar/components/compactMonth/compactMonth.module.mjs +1 -1
- package/dist/esm/common/calendar/components/compactMonth/compactMonth.module.mjs.map +1 -1
- package/dist/esm/common/calendar/components/monthView/monthView.mjs +1 -1
- package/dist/esm/common/calendar/components/monthView/monthView.mjs.map +1 -1
- package/dist/esm/common/calendar/components/monthView/monthView.module.mjs +1 -1
- package/dist/esm/common/calendar/components/monthView/monthView.module.mjs.map +1 -1
- package/dist/esm/common/calendar/components/timeGrid/timeGrid.mjs +1 -1
- package/dist/esm/common/calendar/components/timeGrid/timeGrid.mjs.map +1 -1
- package/dist/esm/common/calendar/components/timeGrid/timeGrid.module.mjs +1 -1
- package/dist/esm/common/calendar/components/timeGrid/timeGrid.module.mjs.map +1 -1
- package/dist/esm/common/calendar/dates.mjs +1 -1
- package/dist/esm/common/calendar/dates.mjs.map +1 -1
- package/dist/esm/common/calendar/format.mjs +1 -1
- package/dist/esm/common/calendar/format.mjs.map +1 -1
- package/dist/esm/common/calendar/layout.mjs +1 -1
- package/dist/esm/common/calendar/layout.mjs.map +1 -1
- package/dist/esm/common/calendar/useNow.mjs +2 -0
- package/dist/esm/common/calendar/useNow.mjs.map +1 -0
- package/dist/esm/common/card/Card.mjs +1 -1
- package/dist/esm/common/card/Card.mjs.map +1 -1
- package/dist/esm/common/card/CardActions.mjs +1 -1
- package/dist/esm/common/card/CardActions.mjs.map +1 -1
- package/dist/esm/common/card/CardHeader.mjs.map +1 -1
- package/dist/esm/common/card/card.module.mjs +1 -1
- package/dist/esm/common/card/card.module.mjs.map +1 -1
- package/dist/esm/common/card/card.types.mjs +1 -1
- package/dist/esm/common/card/card.types.mjs.map +1 -1
- package/dist/esm/common/carousel/carousel.mjs +1 -1
- package/dist/esm/common/carousel/carousel.mjs.map +1 -1
- package/dist/esm/common/carousel/carousel.module.mjs.map +1 -1
- package/dist/esm/common/checkbox/checkbox.mjs +1 -1
- package/dist/esm/common/checkbox/checkbox.mjs.map +1 -1
- package/dist/esm/common/checkbox/checkbox.module.mjs +1 -1
- package/dist/esm/common/checkbox/checkbox.module.mjs.map +1 -1
- package/dist/esm/common/chip/chip.mjs +1 -1
- package/dist/esm/common/chip/chip.mjs.map +1 -1
- package/dist/esm/common/chip/chip.module.mjs +1 -1
- package/dist/esm/common/chip/chip.module.mjs.map +1 -1
- package/dist/esm/common/chip/chip.types.mjs +1 -1
- package/dist/esm/common/chip/chip.types.mjs.map +1 -1
- package/dist/esm/common/colorPicker/colorPicker.mjs +1 -1
- package/dist/esm/common/colorPicker/colorPicker.mjs.map +1 -1
- package/dist/esm/common/colorPicker/colorPicker.module.mjs.map +1 -1
- package/dist/esm/common/confirmModal/confirmModal.mjs +1 -1
- package/dist/esm/common/confirmModal/confirmModal.mjs.map +1 -1
- package/dist/esm/common/copyButton/copyButton.mjs +1 -1
- package/dist/esm/common/copyButton/copyButton.mjs.map +1 -1
- package/dist/esm/common/copyButton/copyButton.module.mjs +1 -1
- package/dist/esm/common/copyButton/copyButton.module.mjs.map +1 -1
- package/dist/esm/common/dropdown/dropdown.mjs +1 -1
- package/dist/esm/common/dropdown/dropdown.mjs.map +1 -1
- package/dist/esm/common/dropdown/dropdown.module.mjs +1 -1
- package/dist/esm/common/dropdown/dropdown.module.mjs.map +1 -1
- package/dist/esm/common/errorBoundary/errorBoundary.mjs +2 -2
- package/dist/esm/common/errorBoundary/errorBoundary.mjs.map +1 -1
- package/dist/esm/common/fab/components/fabBase/fabBase.mjs +1 -1
- package/dist/esm/common/fab/components/fabBase/fabBase.mjs.map +1 -1
- package/dist/esm/common/fab/fab.mjs +1 -1
- package/dist/esm/common/fab/fab.mjs.map +1 -1
- package/dist/esm/common/flip/flip.mjs +1 -1
- package/dist/esm/common/flip/flip.mjs.map +1 -1
- package/dist/esm/common/kanbanBoard/KanbanColumn.mjs +1 -1
- package/dist/esm/common/kanbanBoard/KanbanColumn.mjs.map +1 -1
- package/dist/esm/common/kanbanBoard/kanbanBoard.module.mjs +1 -1
- package/dist/esm/common/kanbanBoard/kanbanBoard.module.mjs.map +1 -1
- package/dist/esm/common/klipyPicker/klipyPicker.mjs +1 -1
- package/dist/esm/common/klipyPicker/klipyPicker.mjs.map +1 -1
- package/dist/esm/common/loader/loader.mjs +2 -0
- package/dist/esm/common/loader/loader.mjs.map +1 -0
- package/dist/esm/common/loader/loader.module.mjs +2 -0
- package/dist/esm/common/loader/loader.module.mjs.map +1 -0
- package/dist/esm/common/loader/loader.types.mjs +2 -0
- package/dist/esm/common/loader/loader.types.mjs.map +1 -0
- package/dist/esm/common/loadingOverlay/loadingOverlay.mjs +2 -0
- package/dist/esm/common/loadingOverlay/loadingOverlay.mjs.map +1 -0
- package/dist/esm/common/loadingOverlay/loadingOverlay.module.mjs +2 -0
- package/dist/esm/common/loadingOverlay/loadingOverlay.module.mjs.map +1 -0
- package/dist/esm/common/modal/modal.mjs +1 -1
- package/dist/esm/common/modal/modal.mjs.map +1 -1
- package/dist/esm/common/modal/modal.module.mjs.map +1 -1
- package/dist/esm/common/numberInput/numberInput.mjs +1 -1
- package/dist/esm/common/numberInput/numberInput.mjs.map +1 -1
- package/dist/esm/common/numberInput/numberInput.module.mjs.map +1 -1
- package/dist/esm/common/popover/popover.mjs +1 -1
- package/dist/esm/common/popover/popover.mjs.map +1 -1
- package/dist/esm/common/progressBar/progressBar.mjs +1 -1
- package/dist/esm/common/progressBar/progressBar.mjs.map +1 -1
- package/dist/esm/common/progressBar/progressBar.module.mjs +1 -1
- package/dist/esm/common/progressBar/progressBar.module.mjs.map +1 -1
- package/dist/esm/common/roomDrawer/roomDrawer.mjs +1 -1
- package/dist/esm/common/roomDrawer/roomDrawer.mjs.map +1 -1
- package/dist/esm/common/roomDrawer/roomDrawer.module.mjs.map +1 -1
- package/dist/esm/common/sectionHeader/sectionHeader.mjs.map +1 -1
- package/dist/esm/common/splitButton/splitButton.mjs +1 -1
- package/dist/esm/common/splitButton/splitButton.mjs.map +1 -1
- package/dist/esm/common/styles/tone.mjs +4 -0
- package/dist/esm/common/styles/tone.mjs.map +1 -0
- package/dist/esm/common/styles/tone.module.mjs +2 -0
- package/dist/esm/common/styles/tone.module.mjs.map +1 -0
- package/dist/esm/common/themeProvider/color.types.mjs +2 -0
- package/dist/esm/common/themeProvider/color.types.mjs.map +1 -0
- package/dist/esm/common/themeProvider/defaultTheme.mjs +1 -1
- package/dist/esm/common/themeProvider/defaultTheme.mjs.map +1 -1
- package/dist/esm/common/tilt/tilt.mjs +1 -1
- package/dist/esm/common/tilt/tilt.mjs.map +1 -1
- package/dist/esm/common/timeInput/timeInput.mjs +1 -1
- package/dist/esm/common/timeInput/timeInput.mjs.map +1 -1
- package/dist/esm/common/timeline/timeline.mjs +1 -1
- package/dist/esm/common/timeline/timeline.mjs.map +1 -1
- package/dist/esm/common/timeline/timeline.module.mjs +1 -1
- package/dist/esm/common/timeline/timeline.module.mjs.map +1 -1
- package/dist/esm/common/timeline/timeline.types.mjs +1 -1
- package/dist/esm/common/timeline/timeline.types.mjs.map +1 -1
- package/dist/esm/common/timer/timer.mjs +1 -1
- package/dist/esm/common/timer/timer.mjs.map +1 -1
- package/dist/esm/common/timer/timer.module.mjs +1 -1
- package/dist/esm/common/timer/timer.module.mjs.map +1 -1
- package/dist/esm/common/toast/toast.mjs +1 -1
- package/dist/esm/common/toast/toast.mjs.map +1 -1
- package/dist/esm/common/toast/toast.module.mjs +1 -1
- package/dist/esm/common/toast/toast.module.mjs.map +1 -1
- package/dist/esm/common/toast/toastHost.mjs +1 -1
- package/dist/esm/common/toast/toastHost.mjs.map +1 -1
- package/dist/esm/common/utils/dismissClick.mjs +2 -0
- package/dist/esm/common/utils/dismissClick.mjs.map +1 -0
- package/dist/esm/common/utils/isDev.mjs +2 -0
- package/dist/esm/common/utils/isDev.mjs.map +1 -0
- package/dist/esm/common/virtualList/virtualList.mjs +1 -1
- package/dist/esm/common/virtualList/virtualList.mjs.map +1 -1
- package/dist/esm/common/virtualList/virtualList.module.mjs +1 -1
- package/dist/esm/common/virtualList/virtualList.module.mjs.map +1 -1
- package/dist/esm/index.mjs +1 -1
- package/dist/esm/services/formValidation/FormValidatorGroupWithForm.mjs +1 -1
- package/dist/esm/services/formValidation/FormValidatorGroupWithForm.mjs.map +1 -1
- package/dist/index.cjs +5 -3
- package/dist/index.cjs.map +1 -1
- package/dist/style.css +1 -1
- package/dist/types/common/accordion/accordion.types.d.ts +17 -2
- package/dist/types/common/actionButtons/actionButtons.types.d.ts +7 -1
- package/dist/types/common/actionIcon/actionIcon.d.ts +1 -1
- package/dist/types/common/actionIcon/actionIcon.types.d.ts +7 -9
- package/dist/types/common/alert/alert.types.d.ts +6 -8
- package/dist/types/common/animatedLogo/animatedLogo.types.d.ts +3 -2
- package/dist/types/common/badge/badge.types.d.ts +10 -6
- package/dist/types/common/button/button.types.d.ts +14 -4
- package/dist/types/common/calendar/calendar.types.d.ts +25 -10
- package/dist/types/common/calendar/components/agendaList/agendaList.d.ts +1 -1
- package/dist/types/common/calendar/components/agendaList/agendaList.types.d.ts +3 -0
- package/dist/types/common/calendar/components/calendarHeader/calendarHeader.d.ts +1 -1
- package/dist/types/common/calendar/components/calendarHeader/calendarHeader.types.d.ts +2 -0
- package/dist/types/common/calendar/components/compactMonth/compactMonth.d.ts +1 -1
- package/dist/types/common/calendar/components/monthView/monthView.d.ts +1 -1
- package/dist/types/common/calendar/components/monthView/monthView.types.d.ts +3 -2
- package/dist/types/common/calendar/components/timeGrid/timeGrid.d.ts +1 -1
- package/dist/types/common/calendar/components/timeGrid/timeGrid.types.d.ts +9 -1
- package/dist/types/common/calendar/dates.d.ts +21 -5
- package/dist/types/common/calendar/format.d.ts +3 -2
- package/dist/types/common/calendar/layout.d.ts +5 -0
- package/dist/types/common/calendar/useNow.d.ts +4 -0
- package/dist/types/common/calendar/view.types.d.ts +9 -2
- package/dist/types/common/card/card.types.d.ts +16 -2
- package/dist/types/common/chip/chip.types.d.ts +10 -5
- package/dist/types/common/configProvider/configProvider.types.d.ts +4 -0
- package/dist/types/common/copyButton/copyButton.types.d.ts +5 -4
- package/dist/types/common/fab/components/fabBase/fabBase.d.ts +1 -1
- package/dist/types/common/fab/components/fabBase/fabBase.types.d.ts +2 -1
- package/dist/types/common/loader/index.d.ts +2 -0
- package/dist/types/common/loader/loader.d.ts +4 -0
- package/dist/types/common/loader/loader.types.d.ts +31 -0
- package/dist/types/common/loadingOverlay/index.d.ts +2 -0
- package/dist/types/common/loadingOverlay/loadingOverlay.d.ts +4 -0
- package/dist/types/common/loadingOverlay/loadingOverlay.types.d.ts +21 -0
- package/dist/types/common/progressBar/progressBar.d.ts +0 -1
- package/dist/types/common/progressBar/progressBar.types.d.ts +3 -1
- package/dist/types/common/splitButton/splitButton.types.d.ts +4 -1
- package/dist/types/common/styles/tone.d.ts +11 -0
- package/dist/types/common/themeProvider/color.types.d.ts +20 -0
- package/dist/types/common/themeProvider/index.d.ts +2 -0
- package/dist/types/common/themeProvider/theme.types.d.ts +7 -6
- package/dist/types/common/timeline/timeline.types.d.ts +3 -10
- package/dist/types/common/toast/index.d.ts +1 -1
- package/dist/types/common/toast/toast.types.d.ts +7 -3
- package/dist/types/common/types/actions.types.d.ts +1 -1
- package/dist/types/common/utils/dismissClick.d.ts +4 -0
- package/dist/types/common/utils/isDev.d.ts +1 -0
- package/dist/types/index.d.ts +4 -1
- package/docs/Accordion.md +74 -5
- package/docs/ActionButtons.md +6 -3
- package/docs/ActionIcon.md +39 -14
- package/docs/Alert.md +27 -17
- package/docs/AnimatedLogo.md +1 -1
- package/docs/Badge.md +24 -7
- package/docs/Button.md +98 -40
- package/docs/ButtonGroup.md +18 -18
- package/docs/CLAUDE.md +24 -13
- package/docs/Calendar.md +35 -17
- package/docs/Card.md +53 -14
- package/docs/Checkbox.md +1 -1
- package/docs/Chip.md +24 -9
- package/docs/ConfigProvider.md +4 -4
- package/docs/CopyButton.md +6 -5
- package/docs/Loader.md +95 -0
- package/docs/LoadingOverlay.md +85 -0
- package/docs/ProgressBar.md +7 -4
- package/docs/SectionHeader.md +1 -1
- package/docs/Skeleton.md +1 -1
- package/docs/SplitButton.md +6 -5
- package/docs/ThemeColor.md +103 -0
- package/docs/ThemeProvider.md +5 -5
- package/docs/Timeline.md +18 -9
- package/docs/Toast.md +25 -11
- package/package.json +3 -2
- package/dist/cjs-types/common/loading/index.d.ts +0 -1
- package/dist/cjs-types/common/loading/spinnerLoading/index.d.ts +0 -2
- package/dist/cjs-types/common/loading/spinnerLoading/spinnerLoading.d.ts +0 -6
- package/dist/esm/common/accordion/accordion.plain.module.mjs +0 -2
- package/dist/esm/common/accordion/accordion.plain.module.mjs.map +0 -1
- package/dist/esm/common/accordion/accordion.primary.module.mjs +0 -2
- package/dist/esm/common/accordion/accordion.primary.module.mjs.map +0 -1
- package/dist/esm/common/alert/alert.types.mjs +0 -2
- package/dist/esm/common/alert/alert.types.mjs.map +0 -1
- package/dist/esm/common/loading/spinnerLoading/index.mjs +0 -2
- package/dist/esm/common/loading/spinnerLoading/index.mjs.map +0 -1
- package/dist/esm/common/loading/spinnerLoading/spinnerLoading.mjs +0 -2
- package/dist/esm/common/loading/spinnerLoading/spinnerLoading.mjs.map +0 -1
- package/dist/esm/common/loading/spinnerLoading/spinnerLoading.module.mjs +0 -2
- package/dist/esm/common/loading/spinnerLoading/spinnerLoading.module.mjs.map +0 -1
- package/dist/types/common/loading/index.d.ts +0 -1
- package/dist/types/common/loading/spinnerLoading/index.d.ts +0 -2
- package/dist/types/common/loading/spinnerLoading/spinnerLoading.d.ts +0 -6
- package/docs/Loading.md +0 -68
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"calendar.mjs","names":[],"sources":["../../../../package/common/calendar/calendar.tsx"],"sourcesContent":["import { useEffect, useLayoutEffect, useRef, useState, type ReactElement } from 'react';\nimport cx from 'classnames';\n\nimport { useComponentDefaults, useLabels } from '../configProvider';\nimport { mergeRefs } from '../utils/mergeRefs';\nimport { asDay, dayToDate } from '../utils/day';\nimport {\n CalendarView,\n type CalendarEvent,\n type CalendarEventChange,\n type CalendarLabels,\n type CalendarProps,\n} from './calendar.types';\nimport {\n dayDiff,\n dateToDay,\n addDays,\n hiddenDaySet,\n periodRange,\n rangeWithNeighbours,\n shownDay,\n shownDays,\n startOfDay,\n stepDate,\n} from './dates';\nimport { formatPeriodTitle, localeWeekStart } from './format';\nimport AgendaList from './components/agendaList';\nimport CalendarHeader from './components/calendarHeader';\nimport CompactMonth from './components/compactMonth';\nimport MonthView from './components/monthView';\nimport TimeGrid from './components/timeGrid';\nimport type { TimeGridZoom } from './components/timeGrid/timeGrid.types';\nimport type { CalendarViewProps } from './view.types';\n\nimport styles from './calendar.module.pcss';\n\nconst ALL_VIEWS = [CalendarView.Month, CalendarView.Week, CalendarView.Day, CalendarView.Agenda];\n\n/** Below this width the month view folds into the compact month with a day list. */\nconst COMPACT_WIDTH = 600;\n\nconst DEFAULT_LABELS: Required<CalendarLabels> = {\n previous: 'Previous',\n next: 'Next',\n today: 'Today',\n viewSwitcher: 'Calendar view',\n month: 'Month',\n week: 'Week',\n day: 'Day',\n agenda: 'Agenda',\n allDay: 'All day',\n more: (count) => `+${count} more`,\n eventCount: (count) => (count === 1 ? '1 event' : `${count} events`),\n noEvents: 'No events',\n newEvent: 'New event',\n};\n\nfunction Calendar<E extends CalendarEvent = CalendarEvent>(props: CalendarProps<E>): ReactElement {\n const {\n events,\n date: controlledDate,\n defaultDate,\n onDateChange,\n view: controlledView,\n defaultView = CalendarView.Month,\n onViewChange,\n views = ALL_VIEWS,\n locale,\n weekStartsOn: weekStartsOnProp,\n slotMinutes = 15,\n hiddenDays,\n scrollToHour,\n onRangeChange,\n onEventClick,\n onEventChange,\n onSlotCreate,\n renderEvent,\n labels,\n ref,\n className,\n style,\n classNames,\n styles: slotStyles,\n ...rest\n } = useComponentDefaults('Calendar', props);\n const text = useLabels('Calendar', labels, DEFAULT_LABELS);\n const weekStartsOn = weekStartsOnProp ?? localeWeekStart(locale);\n const hidden = hiddenDaySet(hiddenDays);\n\n const rootRef = useRef<HTMLDivElement>(null);\n const zoomRef = useRef<TimeGridZoom | null>(null);\n const [width, setWidth] = useState(0);\n const [direction, setDirection] = useState<1 | -1>(1);\n\n // `date` is a day, the same wherever the calendar is opened, and read as its first local moment.\n const [internalDate, setInternalDate] = useState(() => {\n const initial = asDay(defaultDate);\n return initial ? dayToDate(initial) : startOfDay(new Date());\n });\n const controlledDay = asDay(controlledDate);\n // Only ever a day the views show. The selection itself is left alone: a hidden day in `date` is\n // the parent's, and stepping on from it lands where the parent would expect.\n const date = shownDay(controlledDay ? dayToDate(controlledDay) : internalDate, hidden);\n const [internalView, setInternalView] = useState(defaultView);\n const view = controlledView ?? internalView;\n\n // The layout switch follows the calendar's own width rather than the viewport's, so it also\n // happens in a sidebar on a wide screen. Width 0 means no layout (server, jsdom): stay wide.\n useLayoutEffect(() => {\n const root = rootRef.current;\n if (!root) return;\n // The border box, both times: an observer's `contentRect` leaves the border out, and 600px\n // wide would then read as 598.\n const measure = () => setWidth(root.getBoundingClientRect().width);\n measure();\n const observer = new ResizeObserver(measure);\n observer.observe(root);\n return () => observer.disconnect();\n }, []);\n const compact = width > 0 && width < COMPACT_WIDTH;\n\n // Reported per range, not per render: `date` is a new object on every render of a controlled\n // parent. Not `useEffectEvent` for the latest callback, which React only has from 19.2.\n // An effect, since controlled props move the range too; `reported` keeps StrictMode's re-run\n // from reporting a range twice, which a consumer fetching in the callback pays for.\n const range = rangeWithNeighbours(view, date, weekStartsOn, hidden);\n const rangeKey = `${dateToDay(range.start)}/${dateToDay(range.end)}`;\n const latest = useRef({ range, onRangeChange });\n const reported = useRef<string | null>(null);\n useLayoutEffect(() => {\n latest.current = { range, onRangeChange };\n });\n useEffect(() => {\n if (reported.current === rangeKey) return;\n reported.current = rangeKey;\n latest.current.onRangeChange?.(latest.current.range);\n }, [rangeKey]);\n\n function changeDate(next: Date) {\n const day = startOfDay(next);\n if (dateToDay(day) === dateToDay(date)) return;\n setDirection(day > date ? 1 : -1);\n if (controlledDate === undefined) setInternalDate(day);\n onDateChange?.(dateToDay(day));\n }\n\n function changeView(next: CalendarView) {\n if (next === view) return;\n if (controlledView === undefined) setInternalView(next);\n onViewChange?.(next);\n }\n\n // Moves whose promise has not settled yet, drawn where they were dropped meanwhile.\n const [pending, setPending] = useState<ReadonlyMap<string, { start: Date; end: Date }>>(() => new Map());\n function changeEvent(change: CalendarEventChange<E>) {\n const result = onEventChange?.(change);\n if (typeof (result as Promise<unknown> | undefined)?.then !== 'function') return;\n const key = String(change.event.id);\n const entry = { start: change.start, end: change.end };\n setPending((current) => new Map(current).set(key, entry));\n // A later move of the same event owns the entry by then, and keeps it.\n const settle = () =>\n setPending((current) => {\n if (current.get(key) !== entry) return current;\n const next = new Map(current);\n next.delete(key);\n return next;\n });\n (result as Promise<unknown>).then(settle, settle);\n }\n const shownEvents =\n pending.size === 0\n ? events\n : events.map((event) => {\n const moved = pending.get(String(event.id));\n return moved ? { ...event, ...moved } : event;\n });\n\n const viewProps: CalendarViewProps<E> = {\n events: shownEvents,\n date,\n view,\n locale,\n weekStartsOn,\n slotMinutes,\n hidden,\n scrollToHour,\n text,\n onDateChange: changeDate,\n onOpenDay: views.includes(CalendarView.Day)\n ? (day) => {\n changeDate(day);\n changeView(CalendarView.Day);\n }\n : undefined,\n onEventClick,\n onEventChange: onEventChange && changeEvent,\n onSlotCreate,\n renderEvent,\n classNames,\n slotStyles,\n };\n\n // The week's title names the days it shows, not the ones it hides at either end.\n const period = periodRange(view, date, weekStartsOn);\n const columns = shownDays(period.start, dayDiff(period.start, period.end), hidden);\n const titleRange = { start: columns[0], end: addDays(columns[columns.length - 1], 1) };\n\n function renderView() {\n switch (view) {\n case CalendarView.Week:\n case CalendarView.Day:\n return <TimeGrid {...viewProps} zoomRef={zoomRef} />;\n case CalendarView.Agenda: {\n return (\n <AgendaList\n events={shownEvents}\n start={period.start}\n days={dayDiff(period.start, period.end)}\n hidden={hidden}\n scrollTo={date}\n showDayHeaders\n locale={locale}\n text={text}\n onEventClick={onEventClick}\n renderEvent={renderEvent}\n classNames={classNames}\n slotStyles={slotStyles}\n />\n );\n }\n default:\n return compact ? <CompactMonth {...viewProps} /> : <MonthView {...viewProps} />;\n }\n }\n\n return (\n <div\n {...rest}\n ref={mergeRefs(rootRef, ref)}\n className={cx(styles.calendar, className, classNames?.root)}\n style={{ ...style, ...slotStyles?.root }}\n >\n <CalendarHeader\n className={classNames?.header}\n style={slotStyles?.header}\n compact={compact}\n title={formatPeriodTitle(view, date, titleRange, locale)}\n direction={direction}\n view={view}\n views={views}\n text={text}\n onStep={(step) => changeDate(stepDate(view, date, step, hidden))}\n onToday={() => changeDate(new Date())}\n onViewChange={changeView}\n />\n {renderView()}\n </div>\n );\n}\n\nexport default Calendar;\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"calendar.mjs","names":[],"sources":["../../../../package/common/calendar/calendar.tsx"],"sourcesContent":["import { useEffect, useLayoutEffect, useRef, useState, type ReactElement } from 'react';\nimport cx from 'classnames';\n\nimport { useComponentDefaults, useLabels } from '../configProvider';\nimport { mergeRefs } from '../utils/mergeRefs';\nimport { asDay, dayToDate } from '../utils/day';\nimport {\n CalendarView,\n type CalendarEvent,\n type CalendarEventChange,\n type CalendarLabels,\n type CalendarProps,\n} from './calendar.types';\nimport {\n dayDiff,\n dateToDay,\n addDays,\n hiddenDaySet,\n NARROW_WEEK,\n newEventSlot,\n periodRange,\n rangeWithNeighbours,\n shownDay,\n shownDays,\n startOfDay,\n stepDate,\n type CalendarPeriod,\n} from './dates';\nimport { formatPeriodTitle, localeWeekStart } from './format';\nimport { useToday } from './useNow';\nimport AgendaList from './components/agendaList';\nimport CalendarHeader from './components/calendarHeader';\nimport CompactMonth from './components/compactMonth';\nimport MonthView from './components/monthView';\nimport TimeGrid from './components/timeGrid';\nimport type { TimeGridZoom } from './components/timeGrid/timeGrid.types';\nimport type { CalendarViewProps } from './view.types';\n\nimport styles from './calendar.module.pcss';\nimport { useToneCheck } from '../styles/tone';\n\nconst ALL_VIEWS = [CalendarView.Month, CalendarView.Week, CalendarView.Day, CalendarView.Agenda];\n\n/** Below this width the month view folds into the compact month with a day list, and a week shows three days. */\nconst COMPACT_WIDTH = 600;\n\nconst DEFAULT_LABELS: Required<CalendarLabels> = {\n previous: 'Previous',\n next: 'Next',\n today: 'Today',\n viewSwitcher: 'Calendar view',\n month: 'Month',\n week: 'Week',\n day: 'Day',\n agenda: 'Agenda',\n allDay: 'All day',\n more: (count) => `+${count} more`,\n eventCount: (count) => (count === 1 ? '1 event' : `${count} events`),\n noEvents: 'No events',\n newEvent: 'New event',\n weekNumber: (week) => `Week ${week}`,\n};\n\nfunction Calendar<E extends CalendarEvent = CalendarEvent>(props: CalendarProps<E>): ReactElement {\n const {\n events,\n date: controlledDate,\n defaultDate,\n onDateChange,\n view: controlledView,\n defaultView,\n onViewChange,\n views = ALL_VIEWS,\n locale,\n weekStartsOn: weekStartsOnProp,\n slotMinutes = 15,\n hiddenDays,\n scrollToHour,\n workingHours,\n showWeekNumbers = false,\n onRangeChange,\n onEventClick,\n onEventChange,\n onSlotCreate,\n renderEvent,\n eventClassName,\n labels,\n ref,\n className,\n style,\n classNames,\n styles: slotStyles,\n ...rest\n } = useComponentDefaults('Calendar', props);\n const text = useLabels('Calendar', labels, DEFAULT_LABELS);\n useToneCheck(\n 'Calendar',\n events.map((event) => event.color),\n );\n const weekStartsOn = weekStartsOnProp ?? localeWeekStart(locale);\n const hidden = hiddenDaySet(hiddenDays);\n\n const rootRef = useRef<HTMLDivElement>(null);\n const zoomRef = useRef<TimeGridZoom | null>(null);\n // `null` until measured, so that the first range reported is the one the layout shows.\n const [width, setWidth] = useState<number | null>(null);\n const [direction, setDirection] = useState<1 | -1>(1);\n const today = useToday();\n\n // `date` is a day, the same wherever the calendar is opened, and read as its first local moment.\n const [internalDate, setInternalDate] = useState(() => {\n const initial = asDay(defaultDate);\n return initial ? dayToDate(initial) : startOfDay(new Date());\n });\n const controlledDay = asDay(controlledDate);\n // Only ever a day the views show. The selection itself is left alone: a hidden day in `date` is\n // the parent's, and stepping on from it lands where the parent would expect.\n const date = shownDay(controlledDay ? dayToDate(controlledDay) : internalDate, hidden);\n const [internalView, setInternalView] = useState(() => defaultView ?? views[0] ?? CalendarView.Month);\n const view = controlledView ?? internalView;\n\n // The layout switch follows the calendar's own width rather than the viewport's, so it also\n // happens in a sidebar on a wide screen. Width 0 means no layout (server, jsdom): stay wide.\n useLayoutEffect(() => {\n const root = rootRef.current;\n if (!root) return;\n // The border box, both times: an observer's `contentRect` leaves the border out, and 600px\n // wide would then read as 598.\n const measure = () => setWidth(root.getBoundingClientRect().width);\n measure();\n const observer = new ResizeObserver(measure);\n observer.observe(root);\n return () => observer.disconnect();\n }, []);\n const compact = width !== null && width > 0 && width < COMPACT_WIDTH;\n const period: CalendarPeriod = compact && view === CalendarView.Week ? NARROW_WEEK : view;\n\n // Reported per range, not per render: `date` is a new object on every render of a controlled\n // parent. Not `useEffectEvent` for the latest callback, which React only has from 19.2.\n // An effect, since controlled props move the range too; `reported` keeps StrictMode's re-run\n // from reporting a range twice, which a consumer fetching in the callback pays for.\n const range = rangeWithNeighbours(period, date, weekStartsOn, hidden);\n const rangeKey = width === null ? null : `${dateToDay(range.start)}/${dateToDay(range.end)}`;\n const latest = useRef({ range, onRangeChange });\n const reported = useRef<string | null>(null);\n useLayoutEffect(() => {\n latest.current = { range, onRangeChange };\n });\n useEffect(() => {\n if (rangeKey === null || reported.current === rangeKey) return;\n reported.current = rangeKey;\n latest.current.onRangeChange?.(latest.current.range);\n }, [rangeKey]);\n\n function changeDate(next: Date) {\n const day = startOfDay(next);\n if (dateToDay(day) === dateToDay(date)) return;\n setDirection(day > date ? 1 : -1);\n if (controlledDate === undefined) setInternalDate(day);\n onDateChange?.(dateToDay(day));\n }\n\n function changeView(next: CalendarView) {\n if (next === view) return;\n if (controlledView === undefined) setInternalView(next);\n onViewChange?.(next);\n }\n\n // Moves whose promise has not settled yet, drawn where they were dropped meanwhile.\n const [pending, setPending] = useState<ReadonlyMap<string, { start: Date; end: Date }>>(() => new Map());\n function changeEvent(change: CalendarEventChange<E>) {\n const result = onEventChange?.(change);\n if (typeof (result as Promise<unknown> | undefined)?.then !== 'function') return;\n const key = String(change.event.id);\n const entry = { start: change.start, end: change.end };\n setPending((current) => new Map(current).set(key, entry));\n // A later move of the same event owns the entry by then, and keeps it.\n const settle = () =>\n setPending((current) => {\n if (current.get(key) !== entry) return current;\n const next = new Map(current);\n next.delete(key);\n return next;\n });\n (result as Promise<unknown>).then(settle, settle);\n }\n const shownEvents =\n pending.size === 0\n ? events\n : events.map((event) => {\n const moved = pending.get(String(event.id));\n return moved ? { ...event, ...moved } : event;\n });\n\n const viewProps: CalendarViewProps<E> = {\n events: shownEvents,\n date,\n period,\n today,\n locale,\n weekStartsOn,\n slotMinutes,\n hidden,\n scrollToHour,\n workingHours,\n showWeekNumbers,\n text,\n onDateChange: changeDate,\n onOpenDay: views.includes(CalendarView.Day)\n ? (day) => {\n changeDate(day);\n changeView(CalendarView.Day);\n }\n : undefined,\n onEventClick,\n onEventChange: onEventChange && changeEvent,\n onSlotCreate,\n renderEvent,\n eventClassName,\n classNames,\n slotStyles,\n };\n\n // The week's title names the days it shows, not the ones it hides at either end.\n const shown = periodRange(period, date, weekStartsOn, hidden);\n const columns = shownDays(shown.start, dayDiff(shown.start, shown.end), hidden);\n const titleRange = { start: columns[0], end: addDays(columns[columns.length - 1], 1) };\n\n function renderView() {\n switch (view) {\n case CalendarView.Week:\n case CalendarView.Day:\n // Remounted across the narrow width: it decides where to open the hours on mount, from the\n // days it shows, and the first render, before the width is measured, is the wide one.\n return <TimeGrid key={compact ? 'narrow' : 'wide'} {...viewProps} zoomRef={zoomRef} />;\n case CalendarView.Agenda: {\n return (\n <AgendaList\n events={shownEvents}\n start={shown.start}\n days={dayDiff(shown.start, shown.end)}\n hidden={hidden}\n scrollTo={date}\n showDayHeaders\n locale={locale}\n today={today}\n text={text}\n onEventClick={onEventClick}\n renderEvent={renderEvent}\n eventClassName={eventClassName}\n classNames={classNames}\n slotStyles={slotStyles}\n />\n );\n }\n default:\n return compact ? <CompactMonth {...viewProps} /> : <MonthView {...viewProps} />;\n }\n }\n\n return (\n <div\n {...rest}\n ref={mergeRefs(rootRef, ref)}\n className={cx(styles.calendar, className, classNames?.root)}\n style={{ ...style, ...slotStyles?.root }}\n >\n <CalendarHeader\n className={classNames?.header}\n style={slotStyles?.header}\n compact={compact}\n title={formatPeriodTitle(period, date, titleRange, locale)}\n direction={direction}\n view={view}\n views={views}\n text={text}\n onStep={(step) => changeDate(stepDate(period, date, step, hidden))}\n onToday={() => changeDate(new Date())}\n onViewChange={changeView}\n onCreate={\n onSlotCreate && ((anchor) => onSlotCreate(newEventSlot(period, date, new Date(), slotMinutes), anchor))\n }\n />\n {renderView()}\n </div>\n );\n}\n\nexport default Calendar;\n"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"calendar.module.mjs","names":[],"sources":["../../../../package/common/calendar/calendar.module.pcss"],"sourcesContent":[".calendar {\n /* Theme tokens resolved once, each with a built-in fallback. Set any of the public\n `--calendar-*` variables through ThemeProvider (theme-wide) or `style` (per instance). */\n --custom-calendar-hour-height: var(--calendar-hour-height, 3em);\n --custom-calendar-today-color: var(--calendar-today-color, var(--primary-color));\n --custom-calendar-now-color: var(--calendar-now-color, var(--error-color));\n --custom-calendar-event-radius: var(--calendar-event-radius, 6px);\n\n isolation: isolate;\n box-sizing: border-box;\n display: flex;\n flex-direction: column;\n height: 40em;\n min-height: 0;\n overflow: hidden;\n border: 1px solid var(--border-color);\n border-radius: var(--default-border-radius);\n background: var(--background);\n color: var(--text-color);\n}\n"],"mappings":""}
|
|
1
|
+
{"version":3,"file":"calendar.module.mjs","names":[],"sources":["../../../../package/common/calendar/calendar.module.pcss"],"sourcesContent":[".calendar {\n /* Theme tokens resolved once, each with a built-in fallback. Set any of the public\n `--calendar-*` variables through ThemeProvider (theme-wide) or `style` (per instance). */\n --custom-calendar-hour-height: var(--calendar-hour-height, 3em);\n --custom-calendar-today-color: var(--calendar-today-color, var(--primary-color));\n --custom-calendar-now-color: var(--calendar-now-color, var(--error-color));\n --custom-calendar-event-radius: var(--calendar-event-radius, 6px);\n --custom-calendar-off-hours-color: var(--calendar-off-hours-color, var(--background-accent));\n\n isolation: isolate;\n box-sizing: border-box;\n display: flex;\n flex-direction: column;\n height: 40em;\n min-height: 0;\n overflow: hidden;\n border: 1px solid var(--border-color);\n border-radius: var(--default-border-radius);\n background: var(--background);\n color: var(--text-color);\n}\n"],"mappings":""}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"calendar.types.mjs","names":[],"sources":["../../../../package/common/calendar/calendar.types.ts"],"sourcesContent":["import type { CSSProperties, ReactNode, Ref } from 'react';\nimport type { SlotClassNames, SlotStyles, HtmlProps } from '../types/slots.types';\n\nexport enum CalendarView {\n Month = 'month',\n Week = 'week',\n Day = 'day',\n Agenda = 'agenda',\n}\n\n/** A day of the week, as `Date#getDay()` counts: 0 is Sunday, 1 is Monday. */\nexport type CalendarWeekday = 0 | 1 | 2 | 3 | 4 | 5 | 6;\n\n/** First day of the week, as `Date#getDay()` counts: 0 is Sunday, 1 is Monday. */\nexport type CalendarWeekStart = CalendarWeekday;\n\nexport interface CalendarEvent {\n id: string | number;\n title: string;\n /** Local time. */\n start: Date;\n /** Local time, exclusive. An all-day event on the 26th ends at midnight on the 27th. */\n end: Date;\n /** Shown in the all-day row instead of the time grid. Timed events of 24 hours or more are too. */\n allDay?: boolean;\n /**
|
|
1
|
+
{"version":3,"file":"calendar.types.mjs","names":[],"sources":["../../../../package/common/calendar/calendar.types.ts"],"sourcesContent":["import type { CSSProperties, ReactNode, Ref } from 'react';\nimport type { SlotClassNames, SlotStyles, HtmlProps } from '../types/slots.types';\nimport type { ColorValue } from '../themeProvider/color.types';\n\nexport enum CalendarView {\n Month = 'month',\n Week = 'week',\n Day = 'day',\n Agenda = 'agenda',\n}\n\n/** A day of the week, as `Date#getDay()` counts: 0 is Sunday, 1 is Monday. */\nexport type CalendarWeekday = 0 | 1 | 2 | 3 | 4 | 5 | 6;\n\n/** First day of the week, as `Date#getDay()` counts: 0 is Sunday, 1 is Monday. */\nexport type CalendarWeekStart = CalendarWeekday;\n\nexport interface CalendarEvent {\n /** Unique among `events`: each occurrence of a recurring series needs an id of its own. */\n id: string | number;\n title: string;\n /** Local time. */\n start: Date;\n /** Local time, exclusive. An all-day event on the 26th ends at midnight on the 27th. */\n end: Date;\n /** Shown in the all-day row instead of the time grid. Timed events of 24 hours or more are too. */\n allDay?: boolean;\n /** A `ThemeColor` or any CSS colour. Falls back to `--primary-color`. */\n color?: ColorValue;\n /** Can be clicked but not moved or resized. */\n readOnly?: boolean;\n}\n\n/** A span of local time. `end` is exclusive. */\nexport interface CalendarRange {\n start: Date;\n end: Date;\n}\n\nexport interface CalendarEventChange<E extends CalendarEvent = CalendarEvent> {\n event: E;\n start: Date;\n end: Date;\n}\n\nexport interface CalendarSlot {\n start: Date;\n end: Date;\n allDay: boolean;\n}\n\n/** Where `renderEvent` draws an event. */\nexport interface CalendarEventContext {\n /**\n * The event has one line: an event under 45 minutes in the week and day views, an all-day bar,\n * or a row of the month view. The day and agenda lists have room for more.\n */\n singleLine: boolean;\n}\n\nexport type CalendarSlots = 'root' | 'header' | 'dayHeader' | 'cell' | 'event';\n\n/** Text Calendar renders of its own, for translating it. Dates and times come from `locale`. */\nexport interface CalendarLabels {\n /** Previous period button (default `Previous`). */\n previous?: string;\n /** Next period button (default `Next`). */\n next?: string;\n /** Jump to today (default `Today`). */\n today?: string;\n /** Name of the view switcher, read out by screen readers (default `Calendar view`). */\n viewSwitcher?: string;\n month?: string;\n week?: string;\n day?: string;\n agenda?: string;\n /** All-day row and all-day events (default `All day`). */\n allDay?: string;\n /** Overflow button in a month cell (default `+3 more`). */\n more?: (count: number) => string;\n /** Appended to a day's name for screen readers (default `3 events`). */\n eventCount?: (count: number) => string;\n /** A day or period without events (default `No events`). */\n noEvents?: string;\n /** Create button in the header and in a day's event list, shown when `onSlotCreate` is set (default `New event`). */\n newEvent?: string;\n /** A week number, shown with `showWeekNumbers` (default `Week 40`). */\n weekNumber?: (week: number) => string;\n}\n\nexport interface CalendarProps<E extends CalendarEvent = CalendarEvent> extends HtmlProps<HTMLDivElement> {\n /** The events to show. Only the ones inside the range `onRangeChange` reports are needed. */\n events: E[];\n /** Controlled: the selected day, `'YYYY-MM-DD'`, whose period is shown. Omit for uncontrolled. */\n date?: string;\n /** Day shown initially when uncontrolled, `'YYYY-MM-DD'` (default today). */\n defaultDate?: string;\n /** Called with the new day, `'YYYY-MM-DD'`: the value a DatePicker holds. */\n onDateChange?: (day: string) => void;\n /** Controlled view. Omit for uncontrolled. */\n view?: CalendarView;\n /** View shown initially when uncontrolled (default the first of `views`). */\n defaultView?: CalendarView;\n onViewChange?: (view: CalendarView) => void;\n /** Views offered in the switcher, in order. The switcher is hidden when there is only one (default all four). */\n views?: CalendarView[];\n /** BCP 47 tag for dates, times and the week start (default the browser's locale). */\n locale?: string;\n /** Overrides the locale's first day of the week. */\n weekStartsOn?: CalendarWeekStart;\n /** Minutes that creating, moving and resizing snap to (default `15`). */\n slotMinutes?: number;\n /** Days of the week left out of every view: `[0, 6]` hides the weekend. */\n hiddenDays?: CalendarWeekday[];\n /**\n * Hour the week and day views open at, such as `6` for 06:00 (default an hour before now while\n * today is shown, otherwise the start of `workingHours`, or 07:00).\n */\n scrollToHour?: number;\n /**\n * Working time in the week and day views, `[8, 17]` for 08:00 to 17:00: the hours outside it are\n * shaded. `[22, 6]` runs overnight. Its start is also the hour those views open at when today is\n * not shown and `scrollToHour` is not set.\n */\n workingHours?: readonly [start: number, end: number];\n /** Shows ISO 8601 week numbers: on each row of the month view, and in the corner of the week and day views. */\n showWeekNumbers?: boolean;\n /**\n * Called on mount and whenever the shown period changes, with the period and one either side of\n * it, so the neighbours are already filled while swiping. Fetch events and expand recurring\n * series for this range.\n */\n onRangeChange?: (range: CalendarRange) => void;\n /** An event was clicked or tapped. `anchor` is its element, for positioning a popover. */\n onEventClick?: (event: E, anchor: HTMLElement) => void;\n /**\n * An event was moved or resized. Setting it is what makes events draggable. Update `events`\n * in the same render, or return a promise: the event then stays where it was dropped until the\n * promise settles, and is drawn from `events` again after that, back in place if it rejected.\n */\n onEventChange?: (change: CalendarEventChange<E>) => void | Promise<unknown>;\n /**\n * Empty time was clicked or dragged over, or the header's New event button pressed. Setting it is\n * what enables creating: a click creates an hour, or an all-day slot in the month view and the\n * all-day row. `anchor` marks the slot on screen, for a popover's `anchor`: the first day's cell\n * in the month view, the first day's header for the all-day row, an invisible box over the slot\n * in the time grid, and the button itself from the header.\n */\n onSlotCreate?: (slot: CalendarSlot, anchor: HTMLElement) => void;\n /**\n * Content of an event, in place of its title. Must not contain interactive elements. Keep to the\n * title where `context.singleLine` is set: further lines have no room there.\n */\n renderEvent?: (event: E, context: CalendarEventContext) => ReactNode;\n /** A class for one event's element, next to `classNames.event`: a tentative, cancelled or selected event. */\n eventClassName?: (event: E) => string | undefined;\n /** The root element. */\n ref?: Ref<HTMLDivElement>;\n\n className?: string;\n style?: CSSProperties;\n classNames?: SlotClassNames<CalendarSlots>;\n styles?: SlotStyles<CalendarSlots>;\n /** Overrides the text Calendar renders of its own. Merged per key. */\n labels?: CalendarLabels;\n}\n\n/** The props `ConfigProvider` can set for every Calendar. The rest depend on the event type. */\nexport type CalendarDefaults = Pick<\n CalendarProps,\n | 'labels'\n | 'locale'\n | 'weekStartsOn'\n | 'slotMinutes'\n | 'views'\n | 'hiddenDays'\n | 'scrollToHour'\n | 'workingHours'\n | 'showWeekNumbers'\n>;\n"],"mappings":"aAIA,IAAY,EAAL,SAAA,EAAA,OACL,GAAA,MAAA,QACA,EAAA,KAAA,OACA,EAAA,IAAA,MACA,EAAA,OAAA,UACF,EAAA,CAAA,CAAA"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use client";import{
|
|
1
|
+
"use client";import{cssColor as e}from"../../../styles/tone.mjs";import{dateToDay as t}from"../../../utils/day.mjs";import{addDays as n,isSameDay as r,shownDays as i}from"../../dates.mjs";import{formatDayNumber as a,formatLongDate as o,formatTime as s,formatTimeRange as c,formatWeekday as l}from"../../format.mjs";import u from"../../../emptyState/emptyState.mjs";import{eventEnd as d,eventsByDay as f,isAllDayLike as p}from"../../layout.mjs";import m from"./agendaList.module.mjs";import{useId as h,useLayoutEffect as g,useRef as _}from"react";import v from"classnames";import{Fragment as y,jsx as b,jsxs as x}from"react/jsx-runtime";function S({events:S,start:C,days:w,hidden:T,scrollTo:E,showDayHeaders:D,locale:O,today:k,text:A,onEventClick:j,renderEvent:M,eventClassName:N,className:P,classNames:F,slotStyles:I}){let L=h(),R=_(null),z=i(C,w,T),B=f(S,z),V=E?t(E):null;g(()=>{let e=R.current;if(!e||V===null)return;let t=[...e.querySelectorAll(`[data-cal-day]`)].find(e=>(e.dataset.calDay??``)>=V);e.scrollTop=t?t.offsetTop:0},[V]);let H=B.flatMap((e,t)=>e.length>0||!D?[{day:z[t],dayEvents:e}]:[]);return x(`div`,{ref:R,className:v(m.agendaList,P),children:[H.every(({dayEvents:e})=>e.length===0)&&b(u,{className:m.agendaListEmpty,children:A.noEvents}),H.map(({day:i,dayEvents:u})=>{if(u.length===0)return null;let f=`${L}-${t(i)}`,h=r(i,k),g=n(i,1);return x(`div`,{role:`group`,"aria-labelledby":D?f:void 0,className:v(m.agendaListDay,D&&m.agendaListDayWithHeader),"data-cal-day":t(i),children:[D&&x(`div`,{id:f,className:v(m.agendaListDayHeader,F?.dayHeader),style:I?.dayHeader,"aria-label":o(i,O),children:[b(`span`,{className:v(m.agendaListDayNumber,h&&m.agendaListDayNumberToday),"aria-hidden":!0,children:a(i,O)}),b(`span`,{className:m.agendaListDayName,"aria-hidden":!0,children:l(i,O,`short`)})]}),b(`ul`,{className:m.agendaListEvents,children:u.map(t=>{let n=d(t),r=t.start<i?i:t.start,a=n>g?g:n,o=p(t)||t.start<=i&&n>=g,l=o?A.allDay:c(t.start,n,O);return b(`li`,{children:x(`button`,{type:`button`,className:v(m.agendaListEvent,F?.event,N?.(t)),style:{"--event-color":t.color&&e(t.color),...I?.event},"aria-label":`${t.title}, ${l}`,"data-cal-event":String(t.id),onClick:e=>j?.(t,e.currentTarget),children:[b(`span`,{className:m.agendaListTime,"aria-hidden":!0,children:o?A.allDay:x(y,{children:[b(`span`,{children:s(r,O)}),b(`span`,{className:m.agendaListTimeEnd,children:s(a,O)})]})}),b(`span`,{className:m.agendaListAccent,"aria-hidden":!0}),b(`span`,{className:m.agendaListTitle,"aria-hidden":!0,children:M?M(t,{singleLine:!1}):t.title})]})},t.id)})})]},t(i))})]})}export{S as default};
|
|
2
2
|
//# sourceMappingURL=agendaList.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"agendaList.mjs","names":[],"sources":["../../../../../../package/common/calendar/components/agendaList/agendaList.tsx"],"sourcesContent":["import { useId, useLayoutEffect, useRef, type CSSProperties, type ReactElement } from 'react';\nimport cx from 'classnames';\n\nimport type { CalendarEvent } from '../../calendar.types';\nimport { addDays, dateToDay, isSameDay, shownDays } from '../../dates';\nimport { formatDayNumber, formatLongDate, formatTime, formatTimeRange, formatWeekday } from '../../format';\nimport { eventEnd, eventsByDay, isAllDayLike } from '../../layout';\nimport type { AgendaListProps } from './agendaList.types';\n\nimport styles from './agendaList.module.pcss';\n\nfunction AgendaList<E extends CalendarEvent>({\n events,\n start,\n days,\n hidden,\n scrollTo,\n showDayHeaders,\n locale,\n text,\n onEventClick,\n renderEvent,\n className,\n classNames,\n slotStyles,\n}: AgendaListProps<E>): ReactElement {\n const id = useId();\n const listRef = useRef<HTMLDivElement>(null);\n const dates = shownDays(start, days, hidden);\n const perDay = eventsByDay(events, dates);\n const
|
|
1
|
+
{"version":3,"file":"agendaList.mjs","names":[],"sources":["../../../../../../package/common/calendar/components/agendaList/agendaList.tsx"],"sourcesContent":["import { useId, useLayoutEffect, useRef, type CSSProperties, type ReactElement } from 'react';\nimport cx from 'classnames';\n\nimport EmptyState from 'components/common/emptyState';\n\nimport type { CalendarEvent } from '../../calendar.types';\nimport { addDays, dateToDay, isSameDay, shownDays } from '../../dates';\nimport { formatDayNumber, formatLongDate, formatTime, formatTimeRange, formatWeekday } from '../../format';\nimport { eventEnd, eventsByDay, isAllDayLike } from '../../layout';\nimport type { AgendaListProps } from './agendaList.types';\n\nimport styles from './agendaList.module.pcss';\nimport { cssColor } from '../../../styles/tone';\n\nfunction AgendaList<E extends CalendarEvent>({\n events,\n start,\n days,\n hidden,\n scrollTo,\n showDayHeaders,\n locale,\n today,\n text,\n onEventClick,\n renderEvent,\n eventClassName,\n className,\n classNames,\n slotStyles,\n}: AgendaListProps<E>): ReactElement {\n const id = useId();\n const listRef = useRef<HTMLDivElement>(null);\n const dates = shownDays(start, days, hidden);\n const perDay = eventsByDay(events, dates);\n const scrollKey = scrollTo ? dateToDay(scrollTo) : null;\n\n useLayoutEffect(() => {\n const list = listRef.current;\n if (!list || scrollKey === null) return;\n const groups = list.querySelectorAll<HTMLElement>('[data-cal-day]');\n const target = [...groups].find((group) => (group.dataset.calDay ?? '') >= scrollKey);\n list.scrollTop = target ? target.offsetTop : 0;\n }, [scrollKey]);\n\n const listed = perDay.flatMap((dayEvents, index) =>\n dayEvents.length > 0 || !showDayHeaders ? [{ day: dates[index], dayEvents }] : [],\n );\n\n return (\n <div ref={listRef} className={cx(styles.agendaList, className)}>\n {listed.every(({ dayEvents }) => dayEvents.length === 0) && (\n <EmptyState className={styles.agendaListEmpty}>{text.noEvents}</EmptyState>\n )}\n {listed.map(({ day, dayEvents }) => {\n if (dayEvents.length === 0) return null;\n const headerId = `${id}-${dateToDay(day)}`;\n const isToday = isSameDay(day, today);\n const dayEnd = addDays(day, 1);\n return (\n <div\n key={dateToDay(day)}\n role='group'\n aria-labelledby={showDayHeaders ? headerId : undefined}\n className={cx(styles.agendaListDay, showDayHeaders && styles.agendaListDayWithHeader)}\n data-cal-day={dateToDay(day)}\n >\n {showDayHeaders && (\n <div\n id={headerId}\n className={cx(styles.agendaListDayHeader, classNames?.dayHeader)}\n style={slotStyles?.dayHeader}\n aria-label={formatLongDate(day, locale)}\n >\n <span\n className={cx(styles.agendaListDayNumber, isToday && styles.agendaListDayNumberToday)}\n aria-hidden\n >\n {formatDayNumber(day, locale)}\n </span>\n <span className={styles.agendaListDayName} aria-hidden>\n {formatWeekday(day, locale, 'short')}\n </span>\n </div>\n )}\n <ul className={styles.agendaListEvents}>\n {dayEvents.map((event) => {\n const end = eventEnd(event);\n const from = event.start < day ? day : event.start;\n const to = end > dayEnd ? dayEnd : end;\n const allDay = isAllDayLike(event) || (event.start <= day && end >= dayEnd);\n const when = allDay ? text.allDay : formatTimeRange(event.start, end, locale);\n return (\n <li key={event.id}>\n <button\n type='button'\n className={cx(styles.agendaListEvent, classNames?.event, eventClassName?.(event))}\n style={\n { '--event-color': event.color && cssColor(event.color), ...slotStyles?.event } as CSSProperties\n }\n aria-label={`${event.title}, ${when}`}\n data-cal-event={String(event.id)}\n onClick={(clickEvent) => onEventClick?.(event, clickEvent.currentTarget)}\n >\n <span className={styles.agendaListTime} aria-hidden>\n {allDay ? (\n text.allDay\n ) : (\n <>\n <span>{formatTime(from, locale)}</span>\n <span className={styles.agendaListTimeEnd}>{formatTime(to, locale)}</span>\n </>\n )}\n </span>\n <span className={styles.agendaListAccent} aria-hidden />\n <span className={styles.agendaListTitle} aria-hidden>\n {renderEvent ? renderEvent(event, { singleLine: false }) : event.title}\n </span>\n </button>\n </li>\n );\n })}\n </ul>\n </div>\n );\n })}\n </div>\n );\n}\n\nexport default AgendaList;\n"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"agendaList.module.mjs","names":[],"sources":["../../../../../../package/common/calendar/components/agendaList/agendaList.module.pcss"],"sourcesContent":[".agendaList {\n position: relative;\n flex: 1;\n min-height: 0;\n overflow-y: auto;\n overscroll-behavior: contain;\n\n &-empty {\n
|
|
1
|
+
{"version":3,"file":"agendaList.module.mjs","names":[],"sources":["../../../../../../package/common/calendar/components/agendaList/agendaList.module.pcss"],"sourcesContent":[".agendaList {\n position: relative;\n flex: 1;\n min-height: 0;\n overflow-y: auto;\n overscroll-behavior: contain;\n\n &-empty {\n padding: 2em 1em;\n }\n\n &-day {\n padding: 0.25em 0.5em;\n\n & + & {\n border-top: 1px solid var(--border-color);\n }\n\n &-withHeader {\n display: grid;\n grid-template-columns: 3.5em minmax(0, 1fr);\n padding-left: 0;\n }\n\n &-header {\n position: sticky;\n top: 0;\n align-self: start;\n display: flex;\n flex-direction: column;\n align-items: center;\n gap: 0.125em;\n padding: 0.5em 0;\n }\n\n &-number {\n display: grid;\n place-items: center;\n width: 1.875em;\n height: 1.875em;\n border-radius: 50%;\n font-size: 1.125em;\n font-weight: 600;\n font-variant-numeric: tabular-nums;\n\n &-today {\n background: var(--custom-calendar-today-color);\n color: var(--text-on-primary);\n }\n }\n\n &-name {\n font-size: 0.6875em;\n font-weight: 600;\n letter-spacing: 0.04em;\n text-transform: uppercase;\n color: var(--text-dark);\n }\n }\n\n &-events {\n display: flex;\n flex-direction: column;\n gap: 0.125em;\n margin: 0;\n padding: 0.375em 0;\n list-style: none;\n }\n\n &-event {\n display: grid;\n grid-template-columns: auto 3px minmax(0, 1fr);\n align-items: center;\n gap: 0.75em;\n width: 100%;\n min-height: 2.75em;\n padding: 0.375em 0.625em;\n border: 0;\n border-radius: var(--custom-calendar-event-radius);\n background: transparent;\n color: inherit;\n font: inherit;\n text-align: left;\n cursor: pointer;\n -webkit-tap-highlight-color: transparent;\n transition: background-color 0.15s ease;\n\n &:hover {\n background: color-mix(in oklab, var(--event-color, var(--primary-color)) 12%, transparent);\n }\n\n &:focus-visible {\n outline: 2px solid var(--focus-border-color, var(--primary-color));\n outline-offset: -2px;\n }\n }\n\n &-time {\n display: flex;\n flex-direction: column;\n min-width: 4.5em;\n font-size: 0.8125em;\n font-variant-numeric: tabular-nums;\n line-height: 1.35;\n\n &-end {\n color: var(--text-light);\n }\n }\n\n &-accent {\n align-self: stretch;\n width: 3px;\n border-radius: 3px;\n background: var(--event-color, var(--primary-color));\n }\n\n &-title {\n overflow: hidden;\n font-weight: 500;\n white-space: nowrap;\n text-overflow: ellipsis;\n }\n}\n"],"mappings":""}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use client";import{ButtonSize as e}from"../../../button/button.types.mjs";import t from"../../../button/button.mjs";import n from"../../../actionIcon/actionIcon.mjs";import r from"../../../optionPicker/optionPicker.mjs";import i from"./calendarHeader.module.mjs";import a from"classnames";import{faChevronLeft as o,faChevronRight as s}from"@fortawesome/free-solid-svg-icons";import{jsx as
|
|
1
|
+
"use client";import{ButtonSize as e}from"../../../button/button.types.mjs";import t from"../../../button/button.mjs";import n from"../../../actionIcon/actionIcon.mjs";import r from"../../../optionPicker/optionPicker.mjs";import i from"./calendarHeader.module.mjs";import a from"classnames";import{faChevronLeft as o,faChevronRight as s,faPlus as c}from"@fortawesome/free-solid-svg-icons";import{jsx as l,jsxs as u}from"react/jsx-runtime";function d({title:d,compact:f,direction:p,view:m,views:h,text:g,onStep:_,onToday:v,onViewChange:y,onCreate:b,className:x,style:S}){return u(`div`,{className:a(i.calendarHeader,f&&i.calendarHeaderCompact,x),style:S,children:[l(`div`,{className:i.calendarHeaderTitle,"aria-live":`polite`,children:l(`span`,{className:i.calendarHeaderTitleText,style:{"--title-from":p},children:d},d)}),u(`div`,{className:i.calendarHeaderNav,children:[l(t,{className:i.calendarHeaderToday,size:e.Small,onClick:v,children:g.today}),l(n,{icon:o,title:g.previous,"aria-label":g.previous,onClick:()=>_(-1)}),l(n,{icon:s,title:g.next,"aria-label":g.next,onClick:()=>_(1)})]}),h.length>1&&l(r,{className:i.calendarHeaderViews,"aria-label":g.viewSwitcher,value:m,onChange:e=>y(e),options:h.map(e=>({key:e,label:g[e]}))}),b&&l(n,{icon:c,title:g.newEvent,"aria-label":g.newEvent,onClick:e=>b(e.currentTarget)})]})}export{d as default};
|
|
2
2
|
//# sourceMappingURL=calendarHeader.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"calendarHeader.mjs","names":[],"sources":["../../../../../../package/common/calendar/components/calendarHeader/calendarHeader.tsx"],"sourcesContent":["import type { CSSProperties, ReactElement } from 'react';\nimport cx from 'classnames';\nimport { faChevronLeft, faChevronRight } from '@fortawesome/free-solid-svg-icons';\n\nimport ActionIcon from 'components/common/actionIcon';\nimport Button, { ButtonSize } from 'components/common/button';\nimport OptionPicker from 'components/common/optionPicker';\nimport type { CalendarView } from '../../calendar.types';\nimport type { CalendarHeaderProps } from './calendarHeader.types';\n\nimport styles from './calendarHeader.module.pcss';\n\nfunction CalendarHeader({\n title,\n compact,\n direction,\n view,\n views,\n text,\n onStep,\n onToday,\n onViewChange,\n className,\n style,\n}: CalendarHeaderProps): ReactElement {\n return (\n <div className={cx(styles.calendarHeader, compact && styles.calendarHeaderCompact, className)} style={style}>\n {/* A live region, so paging is announced; its first content is not, as it was there on mount. */}\n <div className={styles.calendarHeaderTitle} aria-live='polite'>\n <span\n key={title}\n className={styles.calendarHeaderTitleText}\n style={{ '--title-from': direction } as CSSProperties}\n >\n {title}\n </span>\n </div>\n <div className={styles.calendarHeaderNav}>\n <Button className={styles.calendarHeaderToday} size={ButtonSize.Small} onClick={onToday}>\n {text.today}\n </Button>\n <ActionIcon
|
|
1
|
+
{"version":3,"file":"calendarHeader.mjs","names":[],"sources":["../../../../../../package/common/calendar/components/calendarHeader/calendarHeader.tsx"],"sourcesContent":["import type { CSSProperties, ReactElement } from 'react';\nimport cx from 'classnames';\nimport { faChevronLeft, faChevronRight, faPlus } from '@fortawesome/free-solid-svg-icons';\n\nimport ActionIcon from 'components/common/actionIcon';\nimport Button, { ButtonSize } from 'components/common/button';\nimport OptionPicker from 'components/common/optionPicker';\nimport type { CalendarView } from '../../calendar.types';\nimport type { CalendarHeaderProps } from './calendarHeader.types';\n\nimport styles from './calendarHeader.module.pcss';\n\nfunction CalendarHeader({\n title,\n compact,\n direction,\n view,\n views,\n text,\n onStep,\n onToday,\n onViewChange,\n onCreate,\n className,\n style,\n}: CalendarHeaderProps): ReactElement {\n return (\n <div className={cx(styles.calendarHeader, compact && styles.calendarHeaderCompact, className)} style={style}>\n {/* A live region, so paging is announced; its first content is not, as it was there on mount. */}\n <div className={styles.calendarHeaderTitle} aria-live='polite'>\n <span\n key={title}\n className={styles.calendarHeaderTitleText}\n style={{ '--title-from': direction } as CSSProperties}\n >\n {title}\n </span>\n </div>\n <div className={styles.calendarHeaderNav}>\n <Button className={styles.calendarHeaderToday} size={ButtonSize.Small} onClick={onToday}>\n {text.today}\n </Button>\n <ActionIcon icon={faChevronLeft} title={text.previous} aria-label={text.previous} onClick={() => onStep(-1)} />\n <ActionIcon icon={faChevronRight} title={text.next} aria-label={text.next} onClick={() => onStep(1)} />\n </div>\n {views.length > 1 && (\n <OptionPicker\n className={styles.calendarHeaderViews}\n aria-label={text.viewSwitcher}\n value={view}\n onChange={(key) => onViewChange(key as CalendarView)}\n options={views.map((option) => ({ key: option, label: text[option] }))}\n />\n )}\n {onCreate && (\n <ActionIcon\n icon={faPlus}\n title={text.newEvent}\n aria-label={text.newEvent}\n onClick={(clickEvent) => onCreate(clickEvent.currentTarget)}\n />\n )}\n </div>\n );\n}\n\nexport default CalendarHeader;\n"],"mappings":"sbAYA,SAAS,EAAe,CACtB,QACA,UACA,YACA,OACA,QACA,OACA,SACA,UACA,eACA,WACA,YACA,SACoC,CACpC,OACE,EAAC,MAAD,CAAK,UAAW,EAAG,EAAO,eAAgB,GAAW,EAAO,sBAAuB,CAAS,EAAU,QAAtG,SAAA,CAEE,EAAC,MAAD,CAAK,UAAW,EAAO,oBAAqB,YAAU,SACpD,SAAA,EAAC,OAAD,CAEE,UAAW,EAAO,wBAClB,MAAO,CAAE,eAAgB,CAAU,EAElC,SAAA,CACG,EALC,CAKD,CACH,CAAA,EACL,EAAC,MAAD,CAAK,UAAW,EAAO,kBAAvB,SAAA,CACE,EAAC,EAAD,CAAQ,UAAW,EAAO,oBAAqB,KAAM,EAAW,MAAO,QAAS,EAC7E,SAAA,EAAK,KACA,CAAA,EACR,EAAC,EAAD,CAAY,KAAM,EAAe,MAAO,EAAK,SAAU,aAAY,EAAK,SAAU,YAAe,EAAO,EAAE,CAAI,CAAA,EAC9G,EAAC,EAAD,CAAY,KAAM,EAAgB,MAAO,EAAK,KAAM,aAAY,EAAK,KAAM,YAAe,EAAO,CAAC,CAAI,CAAA,CACnG,IACJ,EAAM,OAAS,GACd,EAAC,EAAD,CACE,UAAW,EAAO,oBAClB,aAAY,EAAK,aACjB,MAAO,EACP,SAAW,GAAQ,EAAa,CAAmB,EACnD,QAAS,EAAM,IAAK,IAAY,CAAE,IAAK,EAAQ,MAAO,EAAK,EAAQ,EAAE,CACtE,CAAA,EAEF,GACC,EAAC,EAAD,CACE,KAAM,EACN,MAAO,EAAK,SACZ,aAAY,EAAK,SACjB,QAAU,GAAe,EAAS,EAAW,aAAa,CAC3D,CAAA,CAEA,GAET"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use client";var e=`calendarHeader_2y0rN`,t=`calendarHeader-title_oxE5q`,n=`calendarHeader-title-text_-Tc6u`,r=`calendarTitleIn_GgigY`,i=`calendarHeader-nav_vtXFu`,a=`calendarHeader-today_-IWRl`,o=`calendarHeader-
|
|
1
|
+
"use client";var e=`calendarHeader_2y0rN`,t=`calendarHeader-title_oxE5q`,n=`calendarHeader-title-text_-Tc6u`,r=`calendarTitleIn_GgigY`,i=`calendarHeader-nav_vtXFu`,a=`calendarHeader-today_-IWRl`,o=`calendarHeader-views_-ftrl`,s=`calendarHeader-compact_4jGIE`,c={calendarHeader:e,"calendarHeader-title":`calendarHeader-title_oxE5q`,calendarHeaderTitle:t,"calendarHeader-title-text":`calendarHeader-title-text_-Tc6u`,calendarHeaderTitleText:n,calendarTitleIn:r,"calendarHeader-nav":`calendarHeader-nav_vtXFu`,calendarHeaderNav:i,"calendarHeader-today":`calendarHeader-today_-IWRl`,calendarHeaderToday:a,"calendarHeader-views":`calendarHeader-views_-ftrl`,calendarHeaderViews:o,"calendarHeader-compact":`calendarHeader-compact_4jGIE`,calendarHeaderCompact:s};export{e as calendarHeader,s as calendarHeaderCompact,i as calendarHeaderNav,t as calendarHeaderTitle,n as calendarHeaderTitleText,a as calendarHeaderToday,o as calendarHeaderViews,r as calendarTitleIn,c as default};
|
|
2
2
|
//# sourceMappingURL=calendarHeader.module.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"calendarHeader.module.mjs","names":[],"sources":["../../../../../../package/common/calendar/components/calendarHeader/calendarHeader.module.pcss"],"sourcesContent":[".calendarHeader {\n display: flex;\n flex-wrap: wrap;\n align-items: center;\n gap: 0.5em 0.75em;\n padding: 0.625em 0.75em;\n border-bottom: 1px solid var(--border-color);\n\n &-title {\n flex: 1 1 6em;\n min-width: 0;\n overflow: hidden;\n font-size: 1.125em;\n font-weight: 600;\n white-space: nowrap;\n\n &-text {\n display: block;\n overflow: hidden;\n text-overflow: ellipsis;\n animation: calendarTitleIn 0.25s ease-out;\n }\n }\n\n &-nav {\n display: flex;\n align-items: center;\n gap: 0.
|
|
1
|
+
{"version":3,"file":"calendarHeader.module.mjs","names":[],"sources":["../../../../../../package/common/calendar/components/calendarHeader/calendarHeader.module.pcss"],"sourcesContent":[".calendarHeader {\n display: flex;\n flex-wrap: wrap;\n align-items: center;\n gap: 0.5em 0.75em;\n padding: 0.625em 0.75em;\n border-bottom: 1px solid var(--border-color);\n\n &-title {\n flex: 1 1 6em;\n min-width: 0;\n overflow: hidden;\n font-size: 1.125em;\n font-weight: 600;\n white-space: nowrap;\n\n &-text {\n display: block;\n overflow: hidden;\n text-overflow: ellipsis;\n animation: calendarTitleIn 0.25s ease-out;\n }\n }\n\n &-nav {\n display: flex;\n align-items: center;\n gap: 0.25em;\n }\n\n &-today {\n margin-right: 0.25em;\n }\n}\n\n/* Two classes, to outrank OptionPicker's own `width: 100%` whichever stylesheet loads first.\n OptionPicker's chip assumes equal options. As a flex row sized to its content they were equal\n at the average label's width, and Month and Agenda were cut; `1fr` columns take the widest. */\n.calendarHeader .calendarHeader-views {\n --option-picker-padding: 0.3125em 0.75em;\n\n display: grid;\n grid-auto-columns: 1fr;\n grid-auto-flow: column;\n flex: none;\n width: auto;\n font-size: 0.875em;\n}\n\n/* After the rule above, which it has to override on a narrow calendar: a row of its own, and\n less padding, so four view names still fit at phone widths. The row leaves room for the New\n event button after it: an ActionIcon under 2em wide and the 0.75em gap, both in the header's\n font, not this 0.875em, and 0.5em to spare against rounding; growing takes the spare back. */\n.calendarHeader-compact .calendarHeader-views {\n --option-picker-padding: 0.3125em 0.25em;\n\n flex: 1 1 calc(100% - 3.25em / 0.875);\n}\n\n@keyframes calendarTitleIn {\n from {\n opacity: 0;\n transform: translateX(calc(var(--title-from, 1) * 0.75em));\n }\n}\n\n@media (prefers-reduced-motion: reduce) {\n .calendarHeader-title-text {\n animation: none;\n }\n}\n"],"mappings":""}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use client";import{
|
|
1
|
+
"use client";import{cssColor as e}from"../../../styles/tone.mjs";import t from"../../../hooks/useMediaQuery.mjs";import{dateToDay as n}from"../../../utils/day.mjs";import{CalendarView as r}from"../../calendar.types.mjs";import{addDays as i,addMonths as a,dayDiff as o,gridKeyTarget as s,isSameDay as c,periodRange as l,shownDays as u,startOfMonth as d,startOfWeek as f}from"../../dates.mjs";import{formatDayNumber as p,formatLongDate as m,formatMonthTitle as ee,formatWeekday as h}from"../../format.mjs";import{eventsByDay as g}from"../../layout.mjs";import te from"../agendaList/agendaList.mjs";import{pageStep as _}from"../../gesture.mjs";import{useGestures as v}from"../../useGestures.mjs";import{usePager as ne}from"../../usePager.mjs";import y from"../../pager.module.mjs";import b from"./compactMonth.module.mjs";import{useLayoutEffect as x,useRef as S,useState as C}from"react";import w from"classnames";import{jsx as T,jsxs as E}from"react/jsx-runtime";var D=[-1,0,1],re=3,ie=150;function O({events:O,date:k,today:A,locale:j,weekStartsOn:M,hidden:N,text:P,onDateChange:F,onEventClick:I,renderEvent:L,eventClassName:R,classNames:z,slotStyles:B}){let V=S(null),H=S(null),U=S(null),W=S(null),G=S(null),K=S(0),[q,ae]=C(!1),J=t(`(prefers-reduced-motion: reduce)`),Y=d(k),X=f(k,M),Z=u(f(A,M),7,N),Q=ne(n(q?X:Y),e=>F(q?i(k,7*e):a(k,e)),()=>W.current?.querySelector(`[tabindex="0"]`)??null);x(()=>{let e=V.current;if(!e)return;let t,n=!1;function r(){return(U.current?.clientHeight??0)*5/6}function i(){let t=r(),n=t>0?Math.min(e.scrollTop/t,1):0;J&&(n=+(n>.99)),K.current=n,e.style.setProperty(`--collapse`,String(n)),ae(n>=1)}function a(){if(n)return;let t=r(),i=e.scrollTop;i<=0||i>=t||e.scrollTo({top:i<t/2?0:t,behavior:J?`auto`:`smooth`})}function o(){clearTimeout(t),t=setTimeout(a,ie)}function s(){i(),o()}function c(){n=!0}function l(){n=!1,o()}return i(),e.addEventListener(`scroll`,s,{passive:!0}),e.addEventListener(`touchstart`,c,{passive:!0}),e.addEventListener(`touchend`,l,{passive:!0}),e.addEventListener(`touchcancel`,l,{passive:!0}),()=>{clearTimeout(t),e.removeEventListener(`scroll`,s),e.removeEventListener(`touchstart`,c),e.removeEventListener(`touchend`,l),e.removeEventListener(`touchcancel`,l)}},[J]),x(()=>{let e=G.current;e!==null&&(G.current=null,W.current?.querySelector(`[data-cal-day="${e}"]`)?.focus())}),v(H,{onPress:Q.finish,canSwipe:()=>K.current<.01||K.current>.99,onSwipeMove:Q.move,onSwipeEnd:(e,t)=>Q.settle(_(e,Q.width(),t))});function oe(e,t){let r=s(e.key,t,M,N);r&&(e.preventDefault(),G.current=n(r),F(r))}function $(t,r,i,a){let o=c(t,k),s=c(t,A),l=m(t,j);return E(`div`,{role:`gridcell`,"data-cal-day":n(t),tabIndex:i&&o?0:-1,"aria-selected":o,"aria-current":s?`date`:void 0,"aria-label":a.length>0?`${l}, ${P.eventCount(a.length)}`:l,className:w(b.compactMonthCell,r&&b.compactMonthCellOutside,z?.cell),style:B?.cell,onClick:()=>F(t),onKeyDown:e=>oe(e,t),children:[T(`span`,{"aria-hidden":!0,className:w(b.compactMonthNumber,s&&b.compactMonthNumberToday,o&&b.compactMonthNumberSelected),children:p(t,j)}),T(`span`,{"aria-hidden":!0,className:b.compactMonthDots,children:a.slice(0,re).map(t=>T(`span`,{className:b.compactMonthDot,style:{"--event-color":t.color&&e(t.color)}},t.id))})]},n(t))}function se(e){let t=e===0,s=w(y.pagerPane,e===-1&&y.pagerPanePrev,e===1&&y.pagerPaneNext,b.compactMonthPane);if(q){let r=i(X,7*e),a=u(r,7,N),o=g(O,a);return T(`div`,{ref:t?W:void 0,className:s,inert:!t,"aria-hidden":!t||void 0,children:T(`div`,{role:`row`,className:b.compactMonthWeek,children:a.map((e,n)=>$(e,!1,t,o[n]))})},n(r))}let c=a(Y,e),d=l(r.Month,c,M).start,f=t?Math.floor(o(d,k)/7):0;return T(`div`,{ref:t?W:void 0,className:s,inert:!t,"aria-hidden":!t||void 0,style:{"--selected-row":f},children:T(`div`,{className:b.compactMonthRows,children:Array.from({length:6},(e,r)=>{let a=i(d,r*7),o=u(a,7,N),s=g(O,o);return T(`div`,{role:`row`,className:w(b.compactMonthWeek,r!==f&&b.compactMonthWeekFolding),children:o.map((e,n)=>$(e,e.getMonth()!==c.getMonth(),t,s[n]))},n(a))})})},n(c))}return E(`div`,{ref:V,className:b.compactMonth,style:{"--days":Z.length},children:[T(`div`,{ref:H,className:b.compactMonthSticky,children:E(`div`,{role:`grid`,"aria-label":ee(k,j),children:[T(`div`,{role:`row`,className:b.compactMonthWeekdays,children:Z.map(e=>T(`div`,{role:`columnheader`,"aria-label":h(e,j,`long`),className:w(b.compactMonthWeekday,z?.dayHeader),style:B?.dayHeader,children:h(e,j,`narrow`)},e.getDay()))}),T(`div`,{ref:U,className:w(y.pagerViewport,b.compactMonthViewport),children:T(`div`,{ref:Q.trackRef,className:y.pagerTrack,children:D.map(se)})})]})}),E(`div`,{className:b.compactMonthList,children:[T(`div`,{className:b.compactMonthListTitle,children:m(k,j)}),T(te,{className:b.compactMonthAgenda,events:O,start:k,days:1,showDayHeaders:!1,locale:j,today:A,text:P,onEventClick:I,renderEvent:L,eventClassName:R,classNames:z,slotStyles:B})]})]})}export{O as default};
|
|
2
2
|
//# sourceMappingURL=compactMonth.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"compactMonth.mjs","names":[],"sources":["../../../../../../package/common/calendar/components/compactMonth/compactMonth.tsx"],"sourcesContent":["import { useLayoutEffect, useRef, useState, type CSSProperties, type KeyboardEvent, type ReactElement } from 'react';\nimport cx from 'classnames';\n\nimport Button from 'components/common/button';\nimport { ButtonSize } from 'components/common/button/button.types';\nimport { useMediaQuery } from 'components/common/hooks/useMediaQuery';\nimport { CalendarView, type CalendarEvent } from '../../calendar.types';\nimport {\n addDays,\n addMonths,\n dayDiff,\n dateToDay,\n gridKeyTarget,\n isSameDay,\n periodRange,\n shownDays,\n startOfMonth,\n startOfWeek,\n} from '../../dates';\nimport { formatDayNumber, formatLongDate, formatMonthTitle, formatWeekday } from '../../format';\nimport { pageStep } from '../../gesture';\nimport { eventsByDay } from '../../layout';\nimport { useGestures } from '../../useGestures';\nimport { usePager } from '../../usePager';\nimport AgendaList from '../agendaList';\nimport type { CompactMonthProps } from './compactMonth.types';\n\nimport pagerStyles from '../../pager.module.pcss';\nimport styles from './compactMonth.module.pcss';\n\nconst STEPS = [-1, 0, 1] as const;\nconst MAX_DOTS = 3;\n/** Quiet time after the last scroll before a half-collapsed month settles open or shut. */\nconst SETTLE_DELAY_MS = 150;\n\n/**\n * The month view of a narrow calendar: a grid of days with event dots over the selected day's\n * events. Scrolling that list folds the month up into the selected week, iOS-style.\n */\nfunction CompactMonth<E extends CalendarEvent>({\n events,\n date,\n locale,\n weekStartsOn,\n hidden,\n text,\n onDateChange,\n onEventClick,\n onSlotCreate,\n renderEvent,\n classNames,\n slotStyles,\n}: CompactMonthProps<E>): ReactElement {\n const scrollerRef = useRef<HTMLDivElement>(null);\n const monthRef = useRef<HTMLDivElement>(null);\n const viewportRef = useRef<HTMLDivElement>(null);\n const currentRef = useRef<HTMLDivElement>(null);\n const pendingFocus = useRef<string | null>(null);\n const progress = useRef(0);\n const [collapsed, setCollapsed] = useState(false);\n const reducedMotion = useMediaQuery('(prefers-reduced-motion: reduce)');\n\n const today = new Date();\n const month = startOfMonth(date);\n const week = startOfWeek(date, weekStartsOn);\n const weekdays = shownDays(startOfWeek(today, weekStartsOn), 7, hidden);\n\n const pager = usePager(\n dateToDay(collapsed ? week : month),\n (step) => onDateChange(collapsed ? addDays(date, 7 * step) : addMonths(date, step)),\n () => currentRef.current?.querySelector<HTMLElement>('[tabindex=\"0\"]') ?? null,\n );\n\n // The fold follows the scroll position rather than animating, so it is written straight to a\n // custom property on every scroll event and never re-renders. Only reaching or leaving fully\n // folded re-renders, to swap the month panes for week strips that look identical at that point.\n useLayoutEffect(() => {\n const scroller = scrollerRef.current;\n if (!scroller) return;\n let settleTimer: ReturnType<typeof setTimeout> | undefined;\n let touching = false;\n\n function foldDistance() {\n // Five of the six rows fold away.\n return ((viewportRef.current?.clientHeight ?? 0) * 5) / 6;\n }\n\n function update() {\n const distance = foldDistance();\n let next = distance > 0 ? Math.min(scroller!.scrollTop / distance, 1) : 0;\n // Following the scroll, the rows move at a rate of their own, as parallax does. Under\n // reduced motion the month stays whole until it is scrolled all the way, then folds at once.\n if (reducedMotion) next = next > 0.99 ? 1 : 0;\n progress.current = next;\n scroller!.style.setProperty('--collapse', String(next));\n setCollapsed(next >= 1);\n }\n\n function settle() {\n if (touching) return;\n const distance = foldDistance();\n const top = scroller!.scrollTop;\n if (top <= 0 || top >= distance) return;\n scroller!.scrollTo({ top: top < distance / 2 ? 0 : distance, behavior: reducedMotion ? 'auto' : 'smooth' });\n }\n\n function scheduleSettle() {\n clearTimeout(settleTimer);\n settleTimer = setTimeout(settle, SETTLE_DELAY_MS);\n }\n\n function onScroll() {\n update();\n scheduleSettle();\n }\n function onTouchStart() {\n touching = true;\n }\n function onTouchEnd() {\n touching = false;\n scheduleSettle();\n }\n\n update();\n scroller.addEventListener('scroll', onScroll, { passive: true });\n scroller.addEventListener('touchstart', onTouchStart, { passive: true });\n scroller.addEventListener('touchend', onTouchEnd, { passive: true });\n scroller.addEventListener('touchcancel', onTouchEnd, { passive: true });\n return () => {\n clearTimeout(settleTimer);\n scroller.removeEventListener('scroll', onScroll);\n scroller.removeEventListener('touchstart', onTouchStart);\n scroller.removeEventListener('touchend', onTouchEnd);\n scroller.removeEventListener('touchcancel', onTouchEnd);\n };\n }, [reducedMotion]);\n\n useLayoutEffect(() => {\n const key = pendingFocus.current;\n if (key === null) return;\n pendingFocus.current = null;\n currentRef.current?.querySelector<HTMLElement>(`[data-cal-day=\"${key}\"]`)?.focus();\n });\n\n useGestures(monthRef, {\n onPress: pager.finish,\n // Half folded, the neighbours would not line up with the current pane.\n canSwipe: () => progress.current < 0.01 || progress.current > 0.99,\n onSwipeMove: pager.move,\n onSwipeEnd: (dx, velocity) => pager.settle(pageStep(dx, pager.width(), velocity)),\n });\n\n function handleKeyDown(keyEvent: KeyboardEvent<HTMLDivElement>, day: Date) {\n const next = gridKeyTarget(keyEvent.key, day, weekStartsOn, hidden);\n if (!next) return;\n keyEvent.preventDefault();\n pendingFocus.current = dateToDay(next);\n onDateChange(next);\n }\n\n function renderDay(day: Date, outside: boolean, isCurrent: boolean, dayEvents: readonly E[]) {\n const selected = isSameDay(day, date);\n const isToday = isSameDay(day, today);\n const name = formatLongDate(day, locale);\n return (\n <div\n key={dateToDay(day)}\n role='gridcell'\n data-cal-day={dateToDay(day)}\n tabIndex={isCurrent && selected ? 0 : -1}\n aria-selected={selected}\n aria-current={isToday ? 'date' : undefined}\n aria-label={dayEvents.length > 0 ? `${name}, ${text.eventCount(dayEvents.length)}` : name}\n className={cx(styles.compactMonthCell, outside && styles.compactMonthCellOutside, classNames?.cell)}\n style={slotStyles?.cell}\n onClick={() => onDateChange(day)}\n onKeyDown={(keyEvent) => handleKeyDown(keyEvent, day)}\n >\n <span\n aria-hidden\n className={cx(\n styles.compactMonthNumber,\n isToday && styles.compactMonthNumberToday,\n selected && styles.compactMonthNumberSelected,\n )}\n >\n {formatDayNumber(day, locale)}\n </span>\n <span aria-hidden className={styles.compactMonthDots}>\n {dayEvents.slice(0, MAX_DOTS).map((event) => (\n <span\n key={event.id}\n className={styles.compactMonthDot}\n style={{ '--event-color': event.color } as CSSProperties}\n />\n ))}\n </span>\n </div>\n );\n }\n\n function renderPane(step: (typeof STEPS)[number]) {\n const isCurrent = step === 0;\n const className = cx(\n pagerStyles.pagerPane,\n step === -1 && pagerStyles.pagerPanePrev,\n step === 1 && pagerStyles.pagerPaneNext,\n styles.compactMonthPane,\n );\n\n if (collapsed) {\n const paneWeek = addDays(week, 7 * step);\n const dates = shownDays(paneWeek, 7, hidden);\n const perDay = eventsByDay(events, dates);\n return (\n <div\n key={dateToDay(paneWeek)}\n ref={isCurrent ? currentRef : undefined}\n className={className}\n inert={!isCurrent}\n aria-hidden={!isCurrent || undefined}\n >\n <div role='row' className={styles.compactMonthWeek}>\n {dates.map((day, index) => renderDay(day, false, isCurrent, perDay[index]))}\n </div>\n </div>\n );\n }\n\n const paneMonth = addMonths(month, step);\n const gridStart = periodRange(CalendarView.Month, paneMonth, weekStartsOn).start;\n const selectedRow = isCurrent ? Math.floor(dayDiff(gridStart, date) / 7) : 0;\n return (\n <div\n key={dateToDay(paneMonth)}\n ref={isCurrent ? currentRef : undefined}\n className={className}\n inert={!isCurrent}\n aria-hidden={!isCurrent || undefined}\n style={{ '--selected-row': selectedRow } as CSSProperties}\n >\n <div className={styles.compactMonthRows}>\n {Array.from({ length: 6 }, (_, row) => {\n const weekStart = addDays(gridStart, row * 7);\n const dates = shownDays(weekStart, 7, hidden);\n const perDay = eventsByDay(events, dates);\n return (\n <div\n key={dateToDay(weekStart)}\n role='row'\n className={cx(styles.compactMonthWeek, row !== selectedRow && styles.compactMonthWeekFolding)}\n >\n {dates.map((day, column) =>\n renderDay(day, day.getMonth() !== paneMonth.getMonth(), isCurrent, perDay[column]),\n )}\n </div>\n );\n })}\n </div>\n </div>\n );\n }\n\n return (\n <div ref={scrollerRef} className={styles.compactMonth} style={{ '--days': weekdays.length } as CSSProperties}>\n <div ref={monthRef} className={styles.compactMonthSticky}>\n <div role='grid' aria-label={formatMonthTitle(date, locale)}>\n <div role='row' className={styles.compactMonthWeekdays}>\n {weekdays.map((day) => (\n <div\n key={day.getDay()}\n role='columnheader'\n aria-label={formatWeekday(day, locale, 'long')}\n className={cx(styles.compactMonthWeekday, classNames?.dayHeader)}\n style={slotStyles?.dayHeader}\n >\n {formatWeekday(day, locale, 'narrow')}\n </div>\n ))}\n </div>\n <div ref={viewportRef} className={cx(pagerStyles.pagerViewport, styles.compactMonthViewport)}>\n <div ref={pager.trackRef} className={pagerStyles.pagerTrack}>\n {STEPS.map(renderPane)}\n </div>\n </div>\n </div>\n </div>\n <div className={styles.compactMonthList}>\n <div className={styles.compactMonthListHeader}>\n <div className={styles.compactMonthListTitle}>{formatLongDate(date, locale)}</div>\n {onSlotCreate && (\n <Button\n size={ButtonSize.Small}\n onClick={(clickEvent) =>\n onSlotCreate({ start: date, end: addDays(date, 1), allDay: true }, clickEvent.currentTarget)\n }\n >\n {text.newEvent}\n </Button>\n )}\n </div>\n <AgendaList\n className={styles.compactMonthAgenda}\n events={events}\n start={date}\n days={1}\n showDayHeaders={false}\n locale={locale}\n text={text}\n onEventClick={onEventClick}\n renderEvent={renderEvent}\n classNames={classNames}\n slotStyles={slotStyles}\n />\n </div>\n </div>\n );\n}\n\nexport default CompactMonth;\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"compactMonth.mjs","names":[],"sources":["../../../../../../package/common/calendar/components/compactMonth/compactMonth.tsx"],"sourcesContent":["import { useLayoutEffect, useRef, useState, type CSSProperties, type KeyboardEvent, type ReactElement } from 'react';\nimport cx from 'classnames';\n\nimport { useMediaQuery } from 'components/common/hooks/useMediaQuery';\nimport { CalendarView, type CalendarEvent } from '../../calendar.types';\nimport {\n addDays,\n addMonths,\n dayDiff,\n dateToDay,\n gridKeyTarget,\n isSameDay,\n periodRange,\n shownDays,\n startOfMonth,\n startOfWeek,\n} from '../../dates';\nimport { formatDayNumber, formatLongDate, formatMonthTitle, formatWeekday } from '../../format';\nimport { pageStep } from '../../gesture';\nimport { eventsByDay } from '../../layout';\nimport { useGestures } from '../../useGestures';\nimport { usePager } from '../../usePager';\nimport AgendaList from '../agendaList';\nimport type { CompactMonthProps } from './compactMonth.types';\n\nimport pagerStyles from '../../pager.module.pcss';\nimport styles from './compactMonth.module.pcss';\nimport { cssColor } from '../../../styles/tone';\n\nconst STEPS = [-1, 0, 1] as const;\nconst MAX_DOTS = 3;\n/** Quiet time after the last scroll before a half-collapsed month settles open or shut. */\nconst SETTLE_DELAY_MS = 150;\n\n/**\n * The month view of a narrow calendar: a grid of days with event dots over the selected day's\n * events. Scrolling that list folds the month up into the selected week, iOS-style.\n */\nfunction CompactMonth<E extends CalendarEvent>({\n events,\n date,\n today,\n locale,\n weekStartsOn,\n hidden,\n text,\n onDateChange,\n onEventClick,\n renderEvent,\n eventClassName,\n classNames,\n slotStyles,\n}: CompactMonthProps<E>): ReactElement {\n const scrollerRef = useRef<HTMLDivElement>(null);\n const monthRef = useRef<HTMLDivElement>(null);\n const viewportRef = useRef<HTMLDivElement>(null);\n const currentRef = useRef<HTMLDivElement>(null);\n const pendingFocus = useRef<string | null>(null);\n const progress = useRef(0);\n const [collapsed, setCollapsed] = useState(false);\n const reducedMotion = useMediaQuery('(prefers-reduced-motion: reduce)');\n\n const month = startOfMonth(date);\n const week = startOfWeek(date, weekStartsOn);\n const weekdays = shownDays(startOfWeek(today, weekStartsOn), 7, hidden);\n\n const pager = usePager(\n dateToDay(collapsed ? week : month),\n (step) => onDateChange(collapsed ? addDays(date, 7 * step) : addMonths(date, step)),\n () => currentRef.current?.querySelector<HTMLElement>('[tabindex=\"0\"]') ?? null,\n );\n\n // The fold follows the scroll position rather than animating, so it is written straight to a\n // custom property on every scroll event and never re-renders. Only reaching or leaving fully\n // folded re-renders, to swap the month panes for week strips that look identical at that point.\n useLayoutEffect(() => {\n const scroller = scrollerRef.current;\n if (!scroller) return;\n let settleTimer: ReturnType<typeof setTimeout> | undefined;\n let touching = false;\n\n function foldDistance() {\n // Five of the six rows fold away.\n return ((viewportRef.current?.clientHeight ?? 0) * 5) / 6;\n }\n\n function update() {\n const distance = foldDistance();\n let next = distance > 0 ? Math.min(scroller!.scrollTop / distance, 1) : 0;\n // Following the scroll, the rows move at a rate of their own, as parallax does. Under\n // reduced motion the month stays whole until it is scrolled all the way, then folds at once.\n if (reducedMotion) next = next > 0.99 ? 1 : 0;\n progress.current = next;\n scroller!.style.setProperty('--collapse', String(next));\n setCollapsed(next >= 1);\n }\n\n function settle() {\n if (touching) return;\n const distance = foldDistance();\n const top = scroller!.scrollTop;\n if (top <= 0 || top >= distance) return;\n scroller!.scrollTo({ top: top < distance / 2 ? 0 : distance, behavior: reducedMotion ? 'auto' : 'smooth' });\n }\n\n function scheduleSettle() {\n clearTimeout(settleTimer);\n settleTimer = setTimeout(settle, SETTLE_DELAY_MS);\n }\n\n function onScroll() {\n update();\n scheduleSettle();\n }\n function onTouchStart() {\n touching = true;\n }\n function onTouchEnd() {\n touching = false;\n scheduleSettle();\n }\n\n update();\n scroller.addEventListener('scroll', onScroll, { passive: true });\n scroller.addEventListener('touchstart', onTouchStart, { passive: true });\n scroller.addEventListener('touchend', onTouchEnd, { passive: true });\n scroller.addEventListener('touchcancel', onTouchEnd, { passive: true });\n return () => {\n clearTimeout(settleTimer);\n scroller.removeEventListener('scroll', onScroll);\n scroller.removeEventListener('touchstart', onTouchStart);\n scroller.removeEventListener('touchend', onTouchEnd);\n scroller.removeEventListener('touchcancel', onTouchEnd);\n };\n }, [reducedMotion]);\n\n useLayoutEffect(() => {\n const key = pendingFocus.current;\n if (key === null) return;\n pendingFocus.current = null;\n currentRef.current?.querySelector<HTMLElement>(`[data-cal-day=\"${key}\"]`)?.focus();\n });\n\n useGestures(monthRef, {\n onPress: pager.finish,\n // Half folded, the neighbours would not line up with the current pane.\n canSwipe: () => progress.current < 0.01 || progress.current > 0.99,\n onSwipeMove: pager.move,\n onSwipeEnd: (dx, velocity) => pager.settle(pageStep(dx, pager.width(), velocity)),\n });\n\n function handleKeyDown(keyEvent: KeyboardEvent<HTMLDivElement>, day: Date) {\n const next = gridKeyTarget(keyEvent.key, day, weekStartsOn, hidden);\n if (!next) return;\n keyEvent.preventDefault();\n pendingFocus.current = dateToDay(next);\n onDateChange(next);\n }\n\n function renderDay(day: Date, outside: boolean, isCurrent: boolean, dayEvents: readonly E[]) {\n const selected = isSameDay(day, date);\n const isToday = isSameDay(day, today);\n const name = formatLongDate(day, locale);\n return (\n <div\n key={dateToDay(day)}\n role='gridcell'\n data-cal-day={dateToDay(day)}\n tabIndex={isCurrent && selected ? 0 : -1}\n aria-selected={selected}\n aria-current={isToday ? 'date' : undefined}\n aria-label={dayEvents.length > 0 ? `${name}, ${text.eventCount(dayEvents.length)}` : name}\n className={cx(styles.compactMonthCell, outside && styles.compactMonthCellOutside, classNames?.cell)}\n style={slotStyles?.cell}\n onClick={() => onDateChange(day)}\n onKeyDown={(keyEvent) => handleKeyDown(keyEvent, day)}\n >\n <span\n aria-hidden\n className={cx(\n styles.compactMonthNumber,\n isToday && styles.compactMonthNumberToday,\n selected && styles.compactMonthNumberSelected,\n )}\n >\n {formatDayNumber(day, locale)}\n </span>\n <span aria-hidden className={styles.compactMonthDots}>\n {dayEvents.slice(0, MAX_DOTS).map((event) => (\n <span\n key={event.id}\n className={styles.compactMonthDot}\n style={{ '--event-color': event.color && cssColor(event.color) } as CSSProperties}\n />\n ))}\n </span>\n </div>\n );\n }\n\n function renderPane(step: (typeof STEPS)[number]) {\n const isCurrent = step === 0;\n const className = cx(\n pagerStyles.pagerPane,\n step === -1 && pagerStyles.pagerPanePrev,\n step === 1 && pagerStyles.pagerPaneNext,\n styles.compactMonthPane,\n );\n\n if (collapsed) {\n const paneWeek = addDays(week, 7 * step);\n const dates = shownDays(paneWeek, 7, hidden);\n const perDay = eventsByDay(events, dates);\n return (\n <div\n key={dateToDay(paneWeek)}\n ref={isCurrent ? currentRef : undefined}\n className={className}\n inert={!isCurrent}\n aria-hidden={!isCurrent || undefined}\n >\n <div role='row' className={styles.compactMonthWeek}>\n {dates.map((day, index) => renderDay(day, false, isCurrent, perDay[index]))}\n </div>\n </div>\n );\n }\n\n const paneMonth = addMonths(month, step);\n const gridStart = periodRange(CalendarView.Month, paneMonth, weekStartsOn).start;\n const selectedRow = isCurrent ? Math.floor(dayDiff(gridStart, date) / 7) : 0;\n return (\n <div\n key={dateToDay(paneMonth)}\n ref={isCurrent ? currentRef : undefined}\n className={className}\n inert={!isCurrent}\n aria-hidden={!isCurrent || undefined}\n style={{ '--selected-row': selectedRow } as CSSProperties}\n >\n <div className={styles.compactMonthRows}>\n {Array.from({ length: 6 }, (_, row) => {\n const weekStart = addDays(gridStart, row * 7);\n const dates = shownDays(weekStart, 7, hidden);\n const perDay = eventsByDay(events, dates);\n return (\n <div\n key={dateToDay(weekStart)}\n role='row'\n className={cx(styles.compactMonthWeek, row !== selectedRow && styles.compactMonthWeekFolding)}\n >\n {dates.map((day, column) =>\n renderDay(day, day.getMonth() !== paneMonth.getMonth(), isCurrent, perDay[column]),\n )}\n </div>\n );\n })}\n </div>\n </div>\n );\n }\n\n return (\n <div ref={scrollerRef} className={styles.compactMonth} style={{ '--days': weekdays.length } as CSSProperties}>\n <div ref={monthRef} className={styles.compactMonthSticky}>\n <div role='grid' aria-label={formatMonthTitle(date, locale)}>\n <div role='row' className={styles.compactMonthWeekdays}>\n {weekdays.map((day) => (\n <div\n key={day.getDay()}\n role='columnheader'\n aria-label={formatWeekday(day, locale, 'long')}\n className={cx(styles.compactMonthWeekday, classNames?.dayHeader)}\n style={slotStyles?.dayHeader}\n >\n {formatWeekday(day, locale, 'narrow')}\n </div>\n ))}\n </div>\n <div ref={viewportRef} className={cx(pagerStyles.pagerViewport, styles.compactMonthViewport)}>\n <div ref={pager.trackRef} className={pagerStyles.pagerTrack}>\n {STEPS.map(renderPane)}\n </div>\n </div>\n </div>\n </div>\n <div className={styles.compactMonthList}>\n <div className={styles.compactMonthListTitle}>{formatLongDate(date, locale)}</div>\n <AgendaList\n className={styles.compactMonthAgenda}\n events={events}\n start={date}\n days={1}\n showDayHeaders={false}\n locale={locale}\n today={today}\n text={text}\n onEventClick={onEventClick}\n renderEvent={renderEvent}\n eventClassName={eventClassName}\n classNames={classNames}\n slotStyles={slotStyles}\n />\n </div>\n </div>\n );\n}\n\nexport default CompactMonth;\n"],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use client";var e=`compactMonth_FqyT2`,t=`compactMonth-sticky_jvXmc`,n=`compactMonth-weekdays_Pqo-f`,r=`compactMonth-weekday_D7FA1`,i=`compactMonth-viewport_Ala2B`,a=`compactMonth-pane_MnQpH`,o=`compactMonth-rows_s7t79`,s=`compactMonth-week_aU0xC`,c=`compactMonth-week-folding_enQnk`,l=`compactMonth-cell_cerzg`,u=`compactMonth-cell-outside_90ht-`,d=`compactMonth-number_EpPAy`,f=`compactMonth-number-today_xZAeN`,p=`compactMonth-number-selected_r3RiE`,m=`compactMonth-dots_0UvHH`,h=`compactMonth-dot_-UfnO`,g=`compactMonth-list_laIa8`,_=`compactMonth-list-
|
|
1
|
+
"use client";var e=`compactMonth_FqyT2`,t=`compactMonth-sticky_jvXmc`,n=`compactMonth-weekdays_Pqo-f`,r=`compactMonth-weekday_D7FA1`,i=`compactMonth-viewport_Ala2B`,a=`compactMonth-pane_MnQpH`,o=`compactMonth-rows_s7t79`,s=`compactMonth-week_aU0xC`,c=`compactMonth-week-folding_enQnk`,l=`compactMonth-cell_cerzg`,u=`compactMonth-cell-outside_90ht-`,d=`compactMonth-number_EpPAy`,f=`compactMonth-number-today_xZAeN`,p=`compactMonth-number-selected_r3RiE`,m=`compactMonth-dots_0UvHH`,h=`compactMonth-dot_-UfnO`,g=`compactMonth-list_laIa8`,_=`compactMonth-list-title_iT4MI`,v=`compactMonth-agenda_F0LqZ`,y={compactMonth:e,"compactMonth-sticky":`compactMonth-sticky_jvXmc`,compactMonthSticky:t,"compactMonth-weekdays":`compactMonth-weekdays_Pqo-f`,compactMonthWeekdays:n,"compactMonth-weekday":`compactMonth-weekday_D7FA1`,compactMonthWeekday:r,"compactMonth-viewport":`compactMonth-viewport_Ala2B`,compactMonthViewport:i,"compactMonth-pane":`compactMonth-pane_MnQpH`,compactMonthPane:a,"compactMonth-rows":`compactMonth-rows_s7t79`,compactMonthRows:o,"compactMonth-week":`compactMonth-week_aU0xC`,compactMonthWeek:s,"compactMonth-week-folding":`compactMonth-week-folding_enQnk`,compactMonthWeekFolding:c,"compactMonth-cell":`compactMonth-cell_cerzg`,compactMonthCell:l,"compactMonth-cell-outside":`compactMonth-cell-outside_90ht-`,compactMonthCellOutside:u,"compactMonth-number":`compactMonth-number_EpPAy`,compactMonthNumber:d,"compactMonth-number-today":`compactMonth-number-today_xZAeN`,compactMonthNumberToday:f,"compactMonth-number-selected":`compactMonth-number-selected_r3RiE`,compactMonthNumberSelected:p,"compactMonth-dots":`compactMonth-dots_0UvHH`,compactMonthDots:m,"compactMonth-dot":`compactMonth-dot_-UfnO`,compactMonthDot:h,"compactMonth-list":`compactMonth-list_laIa8`,compactMonthList:g,"compactMonth-list-title":`compactMonth-list-title_iT4MI`,compactMonthListTitle:_,"compactMonth-agenda":`compactMonth-agenda_F0LqZ`,compactMonthAgenda:v};export{e as compactMonth,v as compactMonthAgenda,l as compactMonthCell,u as compactMonthCellOutside,h as compactMonthDot,m as compactMonthDots,g as compactMonthList,_ as compactMonthListTitle,d as compactMonthNumber,p as compactMonthNumberSelected,f as compactMonthNumberToday,a as compactMonthPane,o as compactMonthRows,t as compactMonthSticky,i as compactMonthViewport,s as compactMonthWeek,c as compactMonthWeekFolding,r as compactMonthWeekday,n as compactMonthWeekdays,y as default};
|
|
2
2
|
//# sourceMappingURL=compactMonth.module.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"compactMonth.module.mjs","names":[],"sources":["../../../../../../package/common/calendar/components/compactMonth/compactMonth.module.pcss"],"sourcesContent":["/* `--collapse` runs from 0 (the whole month) to 1 (only the selected week), written by the\n component from the scroll position. Five rows fold away over five rows of scrolling, so the\n clipped edge of the month and the top of the list below it stay level the whole way. */\n.compactMonth {\n --row: 2.75em;\n --weekdays: 1.75em;\n\n position: relative;\n flex: 1;\n min-height: 0;\n overflow-y: auto;\n overscroll-behavior-y: contain;\n\n &-sticky {\n position: sticky;\n top: 0;\n z-index: 1;\n\n /* The folded rows are clipped, not removed, so this box still spans all six: it must not\n catch the taps meant for the list showing through below the fold. */\n pointer-events: none;\n user-select: none;\n -webkit-touch-callout: none;\n }\n\n &-weekdays {\n display: grid;\n grid-template-columns: repeat(var(--days), minmax(0, 1fr));\n align-items: center;\n height: var(--weekdays);\n background: var(--background);\n pointer-events: auto;\n }\n\n &-weekday {\n font-size: 0.6875em;\n font-weight: 600;\n text-align: center;\n color: var(--text-dark);\n }\n\n &-viewport {\n height: calc(6 * var(--row));\n clip-path: inset(0 0 calc(5 * var(--row) * var(--collapse, 0)) 0);\n pointer-events: auto;\n\n /* Horizontal swipes page the month or week; vertical ones fold it. */\n touch-action: pan-y;\n }\n\n &-pane {\n background: var(--background);\n }\n\n /* Keeps the selected week in view while the rows around it fold away above and below it.\n Reduced motion is handled where `--collapse` is written, which is then only 0 or 1: freezing\n this transform instead would clip the selected week out of view mid-fold. */\n &-rows {\n transform: translateY(calc(var(--selected-row, 0) * var(--row) * var(--collapse, 0) * -1));\n }\n\n &-week {\n display: grid;\n grid-template-columns: repeat(var(--days), minmax(0, 1fr));\n height: var(--row);\n\n &-folding {\n opacity: calc(1 - var(--collapse, 0));\n }\n }\n\n &-cell {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n gap: 0.1875em;\n min-width: 0;\n outline: none;\n cursor: pointer;\n -webkit-tap-highlight-color: transparent;\n\n &-outside {\n color: var(--text-light);\n }\n\n &:focus-visible .compactMonth-number {\n box-shadow: 0 0 0 2px var(--focus-border-color, var(--primary-color));\n }\n }\n\n &-number {\n display: grid;\n place-items: center;\n width: 1.875em;\n height: 1.875em;\n border-radius: 50%;\n font-size: 0.9375em;\n font-variant-numeric: tabular-nums;\n transition:\n background-color 0.15s ease,\n color 0.15s ease;\n\n &-today {\n color: var(--custom-calendar-today-color);\n font-weight: 700;\n }\n\n &-selected {\n background: var(--text-color);\n color: var(--background);\n font-weight: 600;\n }\n }\n\n &-dots {\n display: flex;\n gap: 2px;\n height: 4px;\n }\n\n &-dot {\n width: 4px;\n height: 4px;\n border-radius: 50%;\n background: var(--event-color, var(--primary-color));\n }\n\n /* Tall enough that the month can always fold all the way, however few events the day has. */\n &-list {\n min-height: calc(100% - var(--weekdays) - var(--row));\n border-top: 1px solid var(--border-color);\n\n &-
|
|
1
|
+
{"version":3,"file":"compactMonth.module.mjs","names":[],"sources":["../../../../../../package/common/calendar/components/compactMonth/compactMonth.module.pcss"],"sourcesContent":["/* `--collapse` runs from 0 (the whole month) to 1 (only the selected week), written by the\n component from the scroll position. Five rows fold away over five rows of scrolling, so the\n clipped edge of the month and the top of the list below it stay level the whole way. */\n.compactMonth {\n --row: 2.75em;\n --weekdays: 1.75em;\n\n position: relative;\n flex: 1;\n min-height: 0;\n overflow-y: auto;\n overscroll-behavior-y: contain;\n\n &-sticky {\n position: sticky;\n top: 0;\n z-index: 1;\n\n /* The folded rows are clipped, not removed, so this box still spans all six: it must not\n catch the taps meant for the list showing through below the fold. */\n pointer-events: none;\n user-select: none;\n -webkit-touch-callout: none;\n }\n\n &-weekdays {\n display: grid;\n grid-template-columns: repeat(var(--days), minmax(0, 1fr));\n align-items: center;\n height: var(--weekdays);\n background: var(--background);\n pointer-events: auto;\n }\n\n &-weekday {\n font-size: 0.6875em;\n font-weight: 600;\n text-align: center;\n color: var(--text-dark);\n }\n\n &-viewport {\n height: calc(6 * var(--row));\n clip-path: inset(0 0 calc(5 * var(--row) * var(--collapse, 0)) 0);\n pointer-events: auto;\n\n /* Horizontal swipes page the month or week; vertical ones fold it. */\n touch-action: pan-y;\n }\n\n &-pane {\n background: var(--background);\n }\n\n /* Keeps the selected week in view while the rows around it fold away above and below it.\n Reduced motion is handled where `--collapse` is written, which is then only 0 or 1: freezing\n this transform instead would clip the selected week out of view mid-fold. */\n &-rows {\n transform: translateY(calc(var(--selected-row, 0) * var(--row) * var(--collapse, 0) * -1));\n }\n\n &-week {\n display: grid;\n grid-template-columns: repeat(var(--days), minmax(0, 1fr));\n height: var(--row);\n\n &-folding {\n opacity: calc(1 - var(--collapse, 0));\n }\n }\n\n &-cell {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n gap: 0.1875em;\n min-width: 0;\n outline: none;\n cursor: pointer;\n -webkit-tap-highlight-color: transparent;\n\n &-outside {\n color: var(--text-light);\n }\n\n &:focus-visible .compactMonth-number {\n box-shadow: 0 0 0 2px var(--focus-border-color, var(--primary-color));\n }\n }\n\n &-number {\n display: grid;\n place-items: center;\n width: 1.875em;\n height: 1.875em;\n border-radius: 50%;\n font-size: 0.9375em;\n font-variant-numeric: tabular-nums;\n transition:\n background-color 0.15s ease,\n color 0.15s ease;\n\n &-today {\n color: var(--custom-calendar-today-color);\n font-weight: 700;\n }\n\n &-selected {\n background: var(--text-color);\n color: var(--background);\n font-weight: 600;\n }\n }\n\n &-dots {\n display: flex;\n gap: 2px;\n height: 4px;\n }\n\n &-dot {\n width: 4px;\n height: 4px;\n border-radius: 50%;\n background: var(--event-color, var(--primary-color));\n }\n\n /* Tall enough that the month can always fold all the way, however few events the day has. */\n &-list {\n min-height: calc(100% - var(--weekdays) - var(--row));\n border-top: 1px solid var(--border-color);\n\n &-title {\n padding: 0.9em 1.25em 0.15em;\n font-size: 0.8125em;\n font-weight: 600;\n color: var(--text-dark);\n }\n }\n}\n\n/* Today stays marked when it is also the selected day. */\n.compactMonth-number-today.compactMonth-number-selected {\n background: var(--custom-calendar-today-color);\n color: var(--text-on-primary);\n}\n\n/* Scrolls with the page it sits in, rather than on its own. Two classes, to outrank AgendaList's\n own rule whichever stylesheet loads first. */\n.compactMonth .compactMonth-agenda {\n flex: none;\n overflow: visible;\n}\n"],"mappings":""}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use client";import{isSelfActivation as e}from"../../../utils/activationKey.mjs";import t from"../../../button/button.mjs";import{PopoverAlign as
|
|
1
|
+
"use client";import{isSelfActivation as e}from"../../../utils/activationKey.mjs";import{cssColor as t}from"../../../styles/tone.mjs";import n from"../../../button/button.mjs";import{PopoverAlign as r,PopoverPlacement as i}from"../../../popover/popover.types.mjs";import{isDismissClick as a}from"../../../utils/dismissClick.mjs";import o from"../../../popover/popover.mjs";import{dateToDay as s}from"../../../utils/day.mjs";import{CalendarView as c}from"../../calendar.types.mjs";import{addDays as l,addMonths as u,allDaySlot as d,dayDiff as f,gridKeyTarget as ee,isSameDay as p,periodRange as m,shownDays as te,startOfMonth as ne,startOfWeek as re,weekNumber as ie}from"../../dates.mjs";import{formatDayNumber as ae,formatLongDate as oe,formatMonthTitle as se,formatTime as ce,formatWeekday as le}from"../../format.mjs";import{eventDays as ue,eventsByDay as de,isAllDayLike as fe,limitLanes as pe,moveByDays as me,packLanes as he}from"../../layout.mjs";import ge from"../agendaList/agendaList.mjs";import{clamp as _e,pageStep as ve}from"../../gesture.mjs";import{useGestures as ye}from"../../useGestures.mjs";import{usePager as be}from"../../usePager.mjs";import h from"../../pager.module.mjs";import g from"./monthView.module.mjs";import{useLayoutEffect as _,useRef as v,useState as y}from"react";import b from"classnames";import{jsx as x,jsxs as S}from"react/jsx-runtime";var xe=[-1,0,1];function C({events:C,date:w,today:T,locale:E,weekStartsOn:D,hidden:O,showWeekNumbers:Se,text:k,onDateChange:A,onOpenDay:j,onEventClick:M,onEventChange:N,onSlotCreate:P,renderEvent:F,eventClassName:I,classNames:L,slotStyles:R}){let z=v(null),B=v(null),V=v(null),H=v(null),U=v(null),[Ce,W]=y(1/0),[G,K]=y(null),[q,we]=y(null),J=ne(w),Y=te(re(T,D),7,O),Te=m(c.Month,J,D).start,Ee=(e,t)=>te(l(e,t*7),7,O),X=be(s(J),e=>A(u(w,e)),()=>V.current?.querySelector(`[tabindex="0"]`)??null);_(()=>{let e=B.current;if(!e)return;function t(){let t=e.querySelector(`[data-cal-bars]`);if(!t||t.clientHeight===0){W(1/0);return}let n=getComputedStyle(t),r=parseFloat(n.gridAutoRows),i=parseFloat(n.rowGap)||0,a=parseFloat(n.paddingTop)||0;W(r>0?Math.max(1,Math.floor((t.clientHeight-a+i)/(r+i))):1/0)}t();let n=new ResizeObserver(t);return n.observe(e),()=>n.disconnect()},[]),_(()=>{let e=H.current;e!==null&&(H.current=null,V.current?.querySelector(`[data-cal-day="${e}"]`)?.focus())});function Z(e){let t=V.current;if(!t)return null;let n=t.getBoundingClientRect();if(n.width===0||n.height===0)return null;let r=Y.length,i=_e(Math.floor((e.x-n.left)/n.width*r),0,r-1),a=_e(Math.floor((e.y-n.top)/n.height*6),0,5);return Ee(Te,a)[i]}function De(e){return V.current?.querySelector(`[data-cal-day="${s(e)}"]`)??null}function Q(e){U.current=e,we(e)}ye(z,{onPress:X.finish,canSwipe:()=>!0,onSwipeMove:X.move,onSwipeEnd:(e,t)=>X.settle(ve(e,X.width(),t)),dragFrom:(e,t)=>{if(!V.current?.contains(e))return null;let n=Z(t);if(n===null)return null;let r=e.closest(`[data-cal-event]`);if(r){let e=N&&C.find(e=>String(e.id)===r.dataset.calEvent);return e&&!e.readOnly?{event:e,grabbed:n,offset:0}:null}return!P||e.closest(`[data-cal-more]`)||j&&e.closest(`[data-cal-day-number]`)?null:{event:null,grabbed:n,offset:0}},onDragStart:Q,onDragMove:e=>{let t=U.current,n=Z(e);if(!t||n===null)return;let r=f(t.grabbed,n);r!==t.offset&&Q({...t,offset:r})},onDragEnd:e=>{let t=U.current;Q(null);let n=Z(e);if(!t||n===null)return;let{event:r,grabbed:i}=t;if(!r){let e=d(i,n);P?.(e,De(e.start)??z.current);return}let a=f(i,n);a!==0&&N?.({event:r,...me(r,a)})},onDragCancel:()=>Q(null)});function $(e,t){let n=De(e);n&&K({day:e,anchor:n,fromKeyboard:t})}function Oe(e,t){if(j&&e.target.closest(`[data-cal-day-number]`)){j(t);return}a(e.nativeEvent)||P?.(d(t),e.currentTarget)}function ke(t,n){let r=ee(t.key,n,D,O);if(!r){e(t)&&(t.preventDefault(),$(n,!0));return}t.preventDefault(),H.current=s(r),A(r)}function Ae(e){let{event:n}=e,r=fe(n)||e.span>1||e.continuesBefore||e.continuesAfter,i=!!M||!!N&&!n.readOnly;return S(`div`,{"data-cal-event":String(n.id),className:b(g.monthViewBar,r?g.monthViewBarFilled:g.monthViewBarTimed,e.continuesBefore&&g.monthViewBarContinuesBefore,e.continuesAfter&&g.monthViewBarContinuesAfter,i&&g.monthViewBarInteractive,q?.event===n&&g.monthViewBarDragging,L?.event,I?.(n)),style:{"--event-color":n.color&&t(n.color),gridColumn:`${e.start+1} / span ${e.span}`,gridRow:e.lane+1,...R?.event},onClick:e=>M?.(n,e.currentTarget),children:[!r&&x(`span`,{className:g.monthViewDot}),!r&&x(`span`,{className:g.monthViewTime,children:ce(n.start,E)}),x(`span`,{className:g.monthViewBarTitle,children:F?F(n,{singleLine:!0}):n.title})]},n.id)}function je(e){let t=u(J,e),n=e===0,r=m(c.Month,t,D).start,i=null;if(n&&q?.event&&q.offset!==0){let{first:e,last:t}=ue(q.event);i={from:l(e,q.offset),to:l(t,q.offset)}}else if(n&&q&&!q.event){let e=l(q.grabbed,q.offset);i=q.offset<0?{from:e,to:q.grabbed}:{from:q.grabbed,to:e}}return x(`div`,{ref:n?V:void 0,className:b(h.pagerPane,e===-1&&h.pagerPanePrev,e===1&&h.pagerPaneNext,g.monthViewPane),inert:!n,"aria-hidden":!n||void 0,children:Array.from({length:6},(e,a)=>{let o=Ee(r,a),c=de(C,o),l=pe(he(C,o),o.length,Ce),u=Se?k.weekNumber(ie(o[Math.floor(o.length/2)])):void 0;return S(`div`,{role:`row`,"aria-label":u,className:g.monthViewWeek,children:[o.map((e,r)=>{let a=c[r].length,o=p(e,T),l=oe(e,E);return S(`div`,{role:`gridcell`,"data-cal-day":s(e),tabIndex:n&&p(e,w)?0:-1,"aria-current":o?`date`:void 0,"aria-label":a>0?`${l}, ${k.eventCount(a)}`:l,className:b(g.monthViewCell,e.getMonth()!==t.getMonth()&&g.monthViewCellOutside,P&&g.monthViewCellCreatable,i&&f(i.from,e)>=0&&f(e,i.to)>=0&&g.monthViewCellTarget,L?.cell),style:R?.cell,onClick:t=>Oe(t,e),onKeyDown:t=>ke(t,e),children:[x(`span`,{"data-cal-day-number":!0,"aria-hidden":!0,className:b(g.monthViewDayNumber,o&&g.monthViewDayNumberToday,j&&g.monthViewDayNumberLink),children:ae(e,E)}),u&&r===0&&x(`span`,{"aria-hidden":!0,className:g.monthViewWeekNumber,children:u})]},s(e))}),S(`div`,{"data-cal-bars":!0,"aria-hidden":!0,className:g.monthViewBars,children:[l.visible.map(Ae),l.hidden.map((e,t)=>e>0&&x(`div`,{"data-cal-more":!0,className:g.monthViewMore,style:{gridColumn:t+1,gridRow:l.moreLane+1},onClick:()=>$(o[t],!1),children:k.more(e)},`more-${t}`))]})]},s(o[0]))})},s(t))}return S(`div`,{ref:z,className:g.monthView,style:{"--days":Y.length},children:[S(`div`,{role:`grid`,"aria-label":se(w,E),className:g.monthViewGrid,children:[x(`div`,{role:`row`,className:g.monthViewWeekdays,children:Y.map(e=>x(`div`,{role:`columnheader`,"aria-label":le(e,E,`long`),className:b(g.monthViewWeekday,L?.dayHeader),style:R?.dayHeader,children:le(e,E,`short`)},e.getDay()))}),x(`div`,{ref:B,className:b(h.pagerViewport,g.monthViewViewport),children:x(`div`,{ref:X.trackRef,className:h.pagerTrack,children:xe.map(je)})})]}),x(o,{anchor:G?.anchor??null,isOpen:G!==null,onOpenChange:e=>!e&&K(null),focusOnOpen:G?.fromKeyboard??!1,placement:i.Bottom,align:r.Start,content:G&&S(`div`,{className:g.monthViewList,children:[x(`div`,{className:g.monthViewListTitle,children:oe(G.day,E)}),x(ge,{className:g.monthViewListEvents,events:C,start:G.day,days:1,showDayHeaders:!1,locale:E,today:T,text:k,onEventClick:e=>{K(null),M?.(e,G.anchor)},renderEvent:F,eventClassName:I,classNames:L,slotStyles:R}),P&&x(n,{className:g.monthViewListCreate,onClick:()=>{K(null),P(d(G.day),G.anchor)},children:k.newEvent})]})})]})}export{C as default};
|
|
2
2
|
//# sourceMappingURL=monthView.mjs.map
|