@wireservers-ui/react-natives 2.0.1 → 2.0.2
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 +94 -71
- package/LICENSE +21 -21
- package/README.md +653 -613
- package/bin/cli.js +83 -5
- package/bin/init.js +470 -324
- package/package.json +1 -1
- package/src/accordion/accordion-content.tsx +30 -30
- package/src/accordion/accordion-icon.tsx +54 -54
- package/src/accordion/accordion-item.tsx +37 -37
- package/src/accordion/accordion-title-text.tsx +24 -24
- package/src/accordion/accordion-trigger.tsx +38 -38
- package/src/accordion/accordion.tsx +91 -91
- package/src/accordion/index.ts +24 -24
- package/src/accordion/styles.ts +74 -74
- package/src/accordion/types.ts +56 -56
- package/src/actionsheet/actionsheet-backdrop.tsx +23 -23
- package/src/actionsheet/actionsheet-content.tsx +19 -19
- package/src/actionsheet/actionsheet-drag-indicator-wrapper.tsx +19 -19
- package/src/actionsheet/actionsheet-drag-indicator.tsx +19 -19
- package/src/actionsheet/actionsheet-item-text.tsx +19 -19
- package/src/actionsheet/actionsheet-item.tsx +20 -20
- package/src/actionsheet/actionsheet-scroll-view.tsx +12 -12
- package/src/actionsheet/actionsheet.tsx +45 -45
- package/src/actionsheet/index.ts +20 -20
- package/src/actionsheet/styles.ts +25 -25
- package/src/actionsheet/types.ts +49 -49
- package/src/alert/alert-body.tsx +19 -19
- package/src/alert/alert-close-button.tsx +23 -23
- package/src/alert/alert-icon.tsx +40 -40
- package/src/alert/alert-text.tsx +22 -22
- package/src/alert/alert.tsx +33 -33
- package/src/alert/index.ts +15 -15
- package/src/alert/styles.ts +112 -112
- package/src/alert/types.ts +36 -36
- package/src/alert-dialog/alert-dialog.tsx +54 -54
- package/src/alert-dialog/index.ts +2 -2
- package/src/alert-dialog/styles.ts +40 -40
- package/src/alert-dialog/types.ts +40 -40
- package/src/aspect-ratio/aspect-ratio.tsx +20 -20
- package/src/aspect-ratio/index.ts +2 -2
- package/src/aspect-ratio/styles.ts +6 -6
- package/src/aspect-ratio/types.ts +7 -7
- package/src/avatar/avatar-badge.tsx +22 -22
- package/src/avatar/avatar-fallback-text.tsx +33 -33
- package/src/avatar/avatar-group.tsx +53 -53
- package/src/avatar/avatar-image.tsx +21 -21
- package/src/avatar/avatar.tsx +27 -27
- package/src/avatar/index.ts +14 -14
- package/src/avatar/styles.ts +94 -94
- package/src/avatar/types.ts +35 -35
- package/src/badge/badge-icon.tsx +20 -20
- package/src/badge/badge-text.tsx +24 -24
- package/src/badge/badge.tsx +39 -39
- package/src/badge/index.ts +11 -11
- package/src/badge/styles.ts +175 -175
- package/src/badge/types.ts +37 -37
- package/src/blockquote/blockquote.tsx +21 -21
- package/src/blockquote/index.ts +2 -2
- package/src/blockquote/styles.ts +11 -11
- package/src/blockquote/types.ts +6 -6
- package/src/box/box.tsx +19 -19
- package/src/box/index.ts +2 -2
- package/src/box/styles.ts +6 -6
- package/src/box/types.ts +6 -6
- package/src/breadcrumb/breadcrumb-item.tsx +20 -20
- package/src/breadcrumb/breadcrumb-link.tsx +20 -20
- package/src/breadcrumb/breadcrumb-text.tsx +19 -19
- package/src/breadcrumb/breadcrumb.tsx +43 -43
- package/src/breadcrumb/index.ts +12 -12
- package/src/breadcrumb/styles.ts +36 -36
- package/src/breadcrumb/types.ts +33 -33
- package/src/button/button-group.tsx +35 -35
- package/src/button/button-icon.tsx +37 -37
- package/src/button/button-spinner.tsx +12 -12
- package/src/button/button-text.tsx +27 -27
- package/src/button/button.tsx +42 -42
- package/src/button/index.ts +19 -19
- package/src/button/styles.ts +250 -250
- package/src/button/types.ts +67 -67
- package/src/calendar/calendar-day-cell.tsx +67 -67
- package/src/calendar/calendar-day-view.tsx +66 -66
- package/src/calendar/calendar-event.tsx +59 -59
- package/src/calendar/calendar-header.tsx +60 -60
- package/src/calendar/calendar-horizontal-view.tsx +372 -372
- package/src/calendar/calendar-legend.tsx +41 -41
- package/src/calendar/calendar-month-view.tsx +47 -47
- package/src/calendar/calendar-vertical-view.tsx +395 -395
- package/src/calendar/calendar-view-switcher.tsx +65 -65
- package/src/calendar/calendar-week-view.tsx +52 -52
- package/src/calendar/calendar.tsx +74 -74
- package/src/calendar/index.ts +27 -27
- package/src/calendar/styles.ts +367 -367
- package/src/calendar/types.ts +101 -101
- package/src/calendar/use-calendar.ts +170 -170
- package/src/calendar/utils.ts +278 -278
- package/src/card/card-body.tsx +22 -22
- package/src/card/card-footer.tsx +19 -19
- package/src/card/card-header.tsx +22 -22
- package/src/card/card.tsx +27 -27
- package/src/card/index.ts +13 -13
- package/src/card/styles.ts +54 -54
- package/src/card/types.ts +31 -31
- package/src/carousel/carousel.tsx +436 -436
- package/src/carousel/index.ts +2 -2
- package/src/carousel/styles.ts +21 -21
- package/src/carousel/types.ts +41 -41
- package/src/center/center.tsx +19 -19
- package/src/center/index.ts +2 -2
- package/src/center/styles.ts +6 -6
- package/src/center/types.ts +6 -6
- package/src/checkbox/checkbox-group.tsx +63 -63
- package/src/checkbox/checkbox-icon.tsx +35 -35
- package/src/checkbox/checkbox-indicator.tsx +30 -30
- package/src/checkbox/checkbox-label.tsx +24 -24
- package/src/checkbox/checkbox.tsx +86 -86
- package/src/checkbox/index.ts +14 -14
- package/src/checkbox/styles.ts +69 -69
- package/src/checkbox/types.ts +55 -55
- package/src/circular-progress/circular-progress.tsx +82 -82
- package/src/circular-progress/index.ts +2 -2
- package/src/circular-progress/styles.ts +31 -31
- package/src/circular-progress/types.ts +18 -18
- package/src/code/code.tsx +36 -36
- package/src/code/index.ts +2 -2
- package/src/code/styles.ts +25 -25
- package/src/code/types.ts +13 -13
- package/src/collapsible/collapsible.tsx +58 -58
- package/src/collapsible/index.ts +2 -2
- package/src/collapsible/styles.ts +5 -5
- package/src/collapsible/types.ts +21 -21
- package/src/color-picker/color-picker-box.tsx +115 -115
- package/src/color-picker/color-picker-slider.tsx +98 -98
- package/src/color-picker/color-picker.tsx +162 -162
- package/src/color-picker/color-utils.ts +215 -215
- package/src/color-picker/index.ts +34 -34
- package/src/color-picker/styles.ts +32 -32
- package/src/color-picker/types.ts +49 -49
- package/src/color-picker/use-pointer-drag.ts +80 -80
- package/src/container/container.tsx +19 -19
- package/src/container/index.ts +2 -2
- package/src/container/styles.ts +21 -21
- package/src/container/types.ts +10 -10
- package/src/date-picker/date-picker.tsx +136 -136
- package/src/date-picker/index.ts +15 -15
- package/src/date-picker/styles.ts +18 -18
- package/src/date-picker/types.ts +33 -33
- package/src/divider/divider.tsx +21 -21
- package/src/divider/index.ts +2 -2
- package/src/divider/styles.ts +14 -14
- package/src/divider/types.ts +7 -7
- package/src/drawer/drawer-backdrop.tsx +23 -23
- package/src/drawer/drawer-body.tsx +19 -19
- package/src/drawer/drawer-close-button.tsx +29 -29
- package/src/drawer/drawer-content.tsx +142 -142
- package/src/drawer/drawer-footer.tsx +19 -19
- package/src/drawer/drawer-header.tsx +19 -19
- package/src/drawer/drawer.tsx +54 -54
- package/src/drawer/index.ts +22 -22
- package/src/drawer/styles.ts +36 -36
- package/src/drawer/types.ts +62 -62
- package/src/empty/empty.tsx +53 -53
- package/src/empty/index.ts +2 -2
- package/src/empty/styles.ts +26 -26
- package/src/empty/types.ts +22 -22
- package/src/fab/fab-icon.tsx +20 -20
- package/src/fab/fab-label.tsx +22 -22
- package/src/fab/fab.tsx +45 -45
- package/src/fab/index.ts +11 -11
- package/src/fab/styles.ts +57 -57
- package/src/fab/types.ts +33 -33
- package/src/form-control/form-control-error-icon.tsx +25 -25
- package/src/form-control/form-control-error-message.tsx +40 -40
- package/src/form-control/form-control-helper-text.tsx +25 -25
- package/src/form-control/form-control-label-text.tsx +25 -25
- package/src/form-control/form-control-label.tsx +36 -36
- package/src/form-control/form-control.tsx +46 -46
- package/src/form-control/index.ts +20 -20
- package/src/form-control/styles.ts +105 -105
- package/src/form-control/types.ts +45 -45
- package/src/heading/heading.tsx +21 -21
- package/src/heading/index.ts +2 -2
- package/src/heading/styles.ts +24 -24
- package/src/heading/types.ts +19 -19
- package/src/icon/icon.tsx +21 -21
- package/src/icon/index.ts +2 -2
- package/src/icon/styles.ts +18 -18
- package/src/icon/types.ts +8 -8
- package/src/icon-button/icon-button.tsx +23 -23
- package/src/icon-button/index.ts +2 -2
- package/src/icon-button/styles.ts +78 -78
- package/src/icon-button/types.ts +15 -15
- package/src/image/image.tsx +20 -20
- package/src/image/index.ts +2 -2
- package/src/image/styles.ts +28 -28
- package/src/image/types.ts +11 -11
- package/src/index.ts +1039 -1039
- package/src/input/index.ts +13 -13
- package/src/input/input-field.tsx +35 -35
- package/src/input/input-icon.tsx +25 -25
- package/src/input/input-slot.tsx +24 -24
- package/src/input/input.tsx +73 -73
- package/src/input/styles.ts +90 -90
- package/src/input/types.ts +39 -39
- package/src/kbd/index.ts +2 -2
- package/src/kbd/kbd.tsx +21 -21
- package/src/kbd/styles.ts +11 -11
- package/src/kbd/types.ts +7 -7
- package/src/link/index.ts +4 -4
- package/src/link/link-text.tsx +19 -19
- package/src/link/link.tsx +31 -31
- package/src/link/styles.ts +19 -19
- package/src/link/types.ts +13 -13
- package/src/list/index.ts +2 -2
- package/src/list/list.tsx +55 -55
- package/src/list/styles.ts +8 -8
- package/src/list/types.ts +17 -17
- package/src/menu/index.ts +2 -2
- package/src/menu/menu.tsx +99 -99
- package/src/menu/styles.ts +14 -14
- package/src/menu/types.ts +30 -30
- package/src/modal/index.ts +18 -18
- package/src/modal/modal-backdrop.tsx +23 -23
- package/src/modal/modal-body.tsx +19 -19
- package/src/modal/modal-close-button.tsx +29 -29
- package/src/modal/modal-content.tsx +22 -22
- package/src/modal/modal-footer.tsx +19 -19
- package/src/modal/modal-header.tsx +19 -19
- package/src/modal/modal.tsx +50 -50
- package/src/modal/styles.ts +37 -37
- package/src/modal/types.ts +49 -49
- package/src/nativewind-env.d.ts +1 -1
- package/src/number-input/index.ts +18 -18
- package/src/number-input/number-input.tsx +161 -161
- package/src/number-input/styles.ts +35 -35
- package/src/number-input/types.ts +44 -44
- package/src/overlay/index.ts +2 -2
- package/src/overlay/overlay.tsx +21 -21
- package/src/overlay/styles.ts +6 -6
- package/src/overlay/types.ts +7 -7
- package/src/pagination/index.ts +2 -2
- package/src/pagination/pagination.tsx +58 -58
- package/src/pagination/styles.ts +27 -27
- package/src/pagination/types.ts +19 -19
- package/src/password-input/index.ts +14 -14
- package/src/password-input/password-input.tsx +79 -79
- package/src/password-input/styles.ts +25 -25
- package/src/password-input/types.ts +24 -24
- package/src/pin-input/index.ts +12 -12
- package/src/pin-input/pin-input.tsx +96 -96
- package/src/pin-input/styles.ts +16 -16
- package/src/pin-input/types.ts +26 -26
- package/src/popover/index.ts +2 -2
- package/src/popover/popover.tsx +98 -98
- package/src/popover/styles.ts +31 -31
- package/src/popover/types.ts +46 -46
- package/src/portal/index.ts +2 -2
- package/src/portal/portal.tsx +8 -8
- package/src/portal/styles.ts +2 -2
- package/src/portal/types.ts +3 -3
- package/src/pressable/index.ts +2 -2
- package/src/pressable/pressable.tsx +20 -20
- package/src/pressable/styles.ts +10 -10
- package/src/pressable/types.ts +6 -6
- package/src/progress/index.ts +9 -9
- package/src/progress/progress-filled-track.tsx +26 -26
- package/src/progress/progress.tsx +52 -52
- package/src/progress/styles.ts +34 -34
- package/src/progress/types.ts +28 -28
- package/src/radio/index.ts +14 -14
- package/src/radio/radio-group.tsx +61 -61
- package/src/radio/radio-icon.tsx +24 -24
- package/src/radio/radio-indicator.tsx +30 -30
- package/src/radio/radio-label.tsx +24 -24
- package/src/radio/radio.tsx +68 -68
- package/src/radio/styles.ts +69 -69
- package/src/radio/types.ts +51 -51
- package/src/rating/index.ts +7 -7
- package/src/rating/rating.tsx +93 -93
- package/src/rating/styles.ts +13 -13
- package/src/rating/types.ts +29 -29
- package/src/search-input/index.ts +16 -16
- package/src/search-input/search-input.tsx +119 -119
- package/src/search-input/styles.ts +28 -28
- package/src/search-input/types.ts +31 -31
- package/src/segmented-control/index.ts +2 -2
- package/src/segmented-control/segmented-control.tsx +34 -34
- package/src/segmented-control/styles.ts +22 -22
- package/src/segmented-control/types.ts +22 -22
- package/src/select/index.ts +28 -28
- package/src/select/select-backdrop.tsx +25 -25
- package/src/select/select-content.tsx +49 -49
- package/src/select/select-drag-indicator.tsx +19 -19
- package/src/select/select-icon.tsx +25 -25
- package/src/select/select-input.tsx +32 -32
- package/src/select/select-item-text.tsx +30 -30
- package/src/select/select-item.tsx +72 -72
- package/src/select/select-portal.tsx +22 -22
- package/src/select/select-scroll-view.tsx +22 -22
- package/src/select/select-trigger.tsx +64 -64
- package/src/select/select.tsx +101 -101
- package/src/select/styles.ts +114 -114
- package/src/select/types.ts +92 -92
- package/src/skeleton/index.ts +2 -2
- package/src/skeleton/skeleton.tsx +29 -29
- package/src/skeleton/styles.ts +14 -14
- package/src/skeleton/types.ts +12 -12
- package/src/slider/index.ts +12 -12
- package/src/slider/slider-filled-track.tsx +31 -31
- package/src/slider/slider-thumb.tsx +52 -52
- package/src/slider/slider-track.tsx +154 -154
- package/src/slider/slider.tsx +193 -193
- package/src/slider/styles.ts +71 -71
- package/src/slider/types.ts +47 -47
- package/src/snackbar/index.ts +2 -2
- package/src/snackbar/snackbar.tsx +39 -39
- package/src/snackbar/styles.ts +29 -29
- package/src/snackbar/types.ts +21 -21
- package/src/spinner/index.ts +2 -2
- package/src/spinner/spinner.tsx +29 -29
- package/src/spinner/styles.ts +15 -15
- package/src/spinner/types.ts +10 -10
- package/src/stack/index.ts +2 -2
- package/src/stack/stack.tsx +49 -49
- package/src/stack/styles.ts +25 -25
- package/src/stack/types.ts +15 -15
- package/src/stat/index.ts +2 -2
- package/src/stat/stat.tsx +48 -48
- package/src/stat/styles.ts +34 -34
- package/src/stat/types.ts +24 -24
- package/src/stepper/index.ts +2 -2
- package/src/stepper/stepper.tsx +95 -95
- package/src/stepper/styles.ts +49 -49
- package/src/stepper/types.ts +20 -20
- package/src/switch/index.ts +2 -2
- package/src/switch/styles.ts +24 -24
- package/src/switch/switch.tsx +67 -67
- package/src/switch/types.ts +23 -23
- package/src/table/index.ts +2 -2
- package/src/table/styles.ts +12 -12
- package/src/table/table.tsx +52 -52
- package/src/table/types.ts +10 -10
- package/src/tabs/index.ts +18 -18
- package/src/tabs/styles.ts +113 -113
- package/src/tabs/tab-list.tsx +29 -29
- package/src/tabs/tab-panel.tsx +29 -29
- package/src/tabs/tab-panels.tsx +21 -21
- package/src/tabs/tab-text.tsx +26 -26
- package/src/tabs/tab.tsx +56 -56
- package/src/tabs/tabs.tsx +71 -71
- package/src/tabs/types.ts +53 -53
- package/src/tag/index.ts +14 -14
- package/src/tag/styles.ts +115 -115
- package/src/tag/tag-close-button.tsx +26 -26
- package/src/tag/tag-icon.tsx +20 -20
- package/src/tag/tag-text.tsx +22 -22
- package/src/tag/tag.tsx +40 -40
- package/src/tag/types.ts +33 -33
- package/src/tags-input/index.ts +18 -18
- package/src/tags-input/styles.ts +29 -29
- package/src/tags-input/tags-input.tsx +149 -149
- package/src/tags-input/types.ts +37 -37
- package/src/text/index.ts +2 -2
- package/src/text/styles.ts +54 -54
- package/src/text/text.tsx +51 -51
- package/src/text/types.ts +36 -36
- package/src/textarea/index.ts +2 -2
- package/src/textarea/styles.ts +37 -37
- package/src/textarea/textarea.tsx +68 -68
- package/src/textarea/types.ts +14 -14
- package/src/timeline/index.ts +2 -2
- package/src/timeline/styles.ts +57 -57
- package/src/timeline/timeline.tsx +52 -52
- package/src/timeline/types.ts +30 -30
- package/src/toast/index.ts +17 -17
- package/src/toast/styles.ts +118 -118
- package/src/toast/toast-description.tsx +22 -22
- package/src/toast/toast-provider.tsx +136 -136
- package/src/toast/toast-title.tsx +22 -22
- package/src/toast/toast.tsx +43 -43
- package/src/toast/types.ts +50 -50
- package/src/toast/use-toast.ts +7 -7
- package/src/toggle/index.ts +2 -2
- package/src/toggle/styles.ts +30 -30
- package/src/toggle/toggle.tsx +25 -25
- package/src/toggle/types.ts +15 -15
- package/src/toggle-group/index.ts +2 -2
- package/src/toggle-group/styles.ts +35 -35
- package/src/toggle-group/toggle-group.tsx +60 -60
- package/src/toggle-group/types.ts +29 -29
- package/src/tooltip/index.ts +11 -11
- package/src/tooltip/styles.ts +9 -9
- package/src/tooltip/tooltip-content.tsx +19 -19
- package/src/tooltip/tooltip-text.tsx +19 -19
- package/src/tooltip/tooltip.tsx +116 -116
- package/src/tooltip/types.ts +35 -35
- package/src/utils/brand.ts +5 -5
- package/src/utils/create-context.ts +17 -17
- package/src/utils/index.ts +8 -8
- package/src/utils/types.ts +20 -20
- package/src/visually-hidden/index.ts +2 -2
- package/src/visually-hidden/styles.ts +6 -6
- package/src/visually-hidden/types.ts +6 -6
- package/src/visually-hidden/visually-hidden.tsx +22 -22
- package/tailwind-preset.js +212 -203
package/src/calendar/utils.ts
CHANGED
|
@@ -1,278 +1,278 @@
|
|
|
1
|
-
import type {
|
|
2
|
-
CalendarDay,
|
|
3
|
-
CalendarEvent,
|
|
4
|
-
CalendarWeek,
|
|
5
|
-
CalendarHorizontalConfig,
|
|
6
|
-
} from './types';
|
|
7
|
-
|
|
8
|
-
export function getDaysInMonth(year: number, month: number): number {
|
|
9
|
-
return new Date(year, month + 1, 0).getDate();
|
|
10
|
-
}
|
|
11
|
-
|
|
12
|
-
export function getFirstDayOfWeek(year: number, month: number): number {
|
|
13
|
-
return new Date(year, month, 1).getDay();
|
|
14
|
-
}
|
|
15
|
-
|
|
16
|
-
export function isSameDay(a: Date, b: Date): boolean {
|
|
17
|
-
return (
|
|
18
|
-
a.getFullYear() === b.getFullYear() &&
|
|
19
|
-
a.getMonth() === b.getMonth() &&
|
|
20
|
-
a.getDate() === b.getDate()
|
|
21
|
-
);
|
|
22
|
-
}
|
|
23
|
-
|
|
24
|
-
export function isToday(date: Date): boolean {
|
|
25
|
-
return isSameDay(date, new Date());
|
|
26
|
-
}
|
|
27
|
-
|
|
28
|
-
export function addMonths(date: Date, count: number): Date {
|
|
29
|
-
const result = new Date(date);
|
|
30
|
-
result.setMonth(result.getMonth() + count);
|
|
31
|
-
return result;
|
|
32
|
-
}
|
|
33
|
-
|
|
34
|
-
export function addDays(date: Date, count: number): Date {
|
|
35
|
-
const result = new Date(date);
|
|
36
|
-
result.setDate(result.getDate() + count);
|
|
37
|
-
return result;
|
|
38
|
-
}
|
|
39
|
-
|
|
40
|
-
export function getWeekDays(): string[] {
|
|
41
|
-
return ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'];
|
|
42
|
-
}
|
|
43
|
-
|
|
44
|
-
export function getMonthName(month: number): string {
|
|
45
|
-
const names = [
|
|
46
|
-
'January',
|
|
47
|
-
'February',
|
|
48
|
-
'March',
|
|
49
|
-
'April',
|
|
50
|
-
'May',
|
|
51
|
-
'June',
|
|
52
|
-
'July',
|
|
53
|
-
'August',
|
|
54
|
-
'September',
|
|
55
|
-
'October',
|
|
56
|
-
'November',
|
|
57
|
-
'December',
|
|
58
|
-
];
|
|
59
|
-
return names[month];
|
|
60
|
-
}
|
|
61
|
-
|
|
62
|
-
export function getEventsForDate(
|
|
63
|
-
events: CalendarEvent[],
|
|
64
|
-
date: Date,
|
|
65
|
-
): CalendarEvent[] {
|
|
66
|
-
return events.filter((e) => isSameDay(e.start, date));
|
|
67
|
-
}
|
|
68
|
-
|
|
69
|
-
export function formatTime(date: Date): string {
|
|
70
|
-
const h = date.getHours();
|
|
71
|
-
const m = date.getMinutes();
|
|
72
|
-
const ampm = h >= 12 ? 'PM' : 'AM';
|
|
73
|
-
const hour = h % 12 || 12;
|
|
74
|
-
return `${hour}${m > 0 ? ':' + m.toString().padStart(2, '0') : ''}${ampm}`;
|
|
75
|
-
}
|
|
76
|
-
|
|
77
|
-
export function formatHour(hour: number): string {
|
|
78
|
-
if (hour === 0) return '12 AM';
|
|
79
|
-
if (hour < 12) return `${hour} AM`;
|
|
80
|
-
if (hour === 12) return '12 PM';
|
|
81
|
-
return `${hour - 12} PM`;
|
|
82
|
-
}
|
|
83
|
-
|
|
84
|
-
export function buildMonthGrid(
|
|
85
|
-
year: number,
|
|
86
|
-
month: number,
|
|
87
|
-
events: CalendarEvent[],
|
|
88
|
-
): CalendarWeek[] {
|
|
89
|
-
const daysInMonth = getDaysInMonth(year, month);
|
|
90
|
-
const firstDay = getFirstDayOfWeek(year, month);
|
|
91
|
-
const weeks: CalendarWeek[] = [];
|
|
92
|
-
let currentWeek: CalendarDay[] = [];
|
|
93
|
-
|
|
94
|
-
// Fill leading days from previous month
|
|
95
|
-
const prevMonth = month === 0 ? 11 : month - 1;
|
|
96
|
-
const prevYear = month === 0 ? year - 1 : year;
|
|
97
|
-
const daysInPrevMonth = getDaysInMonth(prevYear, prevMonth);
|
|
98
|
-
for (let i = firstDay - 1; i >= 0; i--) {
|
|
99
|
-
const date = new Date(prevYear, prevMonth, daysInPrevMonth - i);
|
|
100
|
-
currentWeek.push({
|
|
101
|
-
date,
|
|
102
|
-
isCurrentMonth: false,
|
|
103
|
-
isToday: isToday(date),
|
|
104
|
-
events: getEventsForDate(events, date),
|
|
105
|
-
});
|
|
106
|
-
}
|
|
107
|
-
|
|
108
|
-
// Fill current month days
|
|
109
|
-
for (let day = 1; day <= daysInMonth; day++) {
|
|
110
|
-
const date = new Date(year, month, day);
|
|
111
|
-
currentWeek.push({
|
|
112
|
-
date,
|
|
113
|
-
isCurrentMonth: true,
|
|
114
|
-
isToday: isToday(date),
|
|
115
|
-
events: getEventsForDate(events, date),
|
|
116
|
-
});
|
|
117
|
-
if (currentWeek.length === 7) {
|
|
118
|
-
weeks.push({ days: currentWeek });
|
|
119
|
-
currentWeek = [];
|
|
120
|
-
}
|
|
121
|
-
}
|
|
122
|
-
|
|
123
|
-
// Fill trailing days from next month
|
|
124
|
-
if (currentWeek.length > 0) {
|
|
125
|
-
const nextMonth = month === 11 ? 0 : month + 1;
|
|
126
|
-
const nextYear = month === 11 ? year + 1 : year;
|
|
127
|
-
let nextDay = 1;
|
|
128
|
-
while (currentWeek.length < 7) {
|
|
129
|
-
const date = new Date(nextYear, nextMonth, nextDay++);
|
|
130
|
-
currentWeek.push({
|
|
131
|
-
date,
|
|
132
|
-
isCurrentMonth: false,
|
|
133
|
-
isToday: isToday(date),
|
|
134
|
-
events: getEventsForDate(events, date),
|
|
135
|
-
});
|
|
136
|
-
}
|
|
137
|
-
weeks.push({ days: currentWeek });
|
|
138
|
-
}
|
|
139
|
-
|
|
140
|
-
return weeks;
|
|
141
|
-
}
|
|
142
|
-
|
|
143
|
-
// --- Week/month date helpers ---
|
|
144
|
-
|
|
145
|
-
const SHORT_DAYS = ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'];
|
|
146
|
-
const SHORT_MONTHS = [
|
|
147
|
-
'Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun',
|
|
148
|
-
'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec',
|
|
149
|
-
];
|
|
150
|
-
|
|
151
|
-
export function getWeekDates(displayDate: Date): Date[] {
|
|
152
|
-
const day = displayDate.getDay();
|
|
153
|
-
const sunday = addDays(displayDate, -day);
|
|
154
|
-
const dates: Date[] = [];
|
|
155
|
-
for (let i = 0; i < 7; i++) {
|
|
156
|
-
dates.push(addDays(sunday, i));
|
|
157
|
-
}
|
|
158
|
-
return dates;
|
|
159
|
-
}
|
|
160
|
-
|
|
161
|
-
export function getMonthDates(displayDate: Date): Date[] {
|
|
162
|
-
const year = displayDate.getFullYear();
|
|
163
|
-
const month = displayDate.getMonth();
|
|
164
|
-
const count = getDaysInMonth(year, month);
|
|
165
|
-
const dates: Date[] = [];
|
|
166
|
-
for (let d = 1; d <= count; d++) {
|
|
167
|
-
dates.push(new Date(year, month, d));
|
|
168
|
-
}
|
|
169
|
-
return dates;
|
|
170
|
-
}
|
|
171
|
-
|
|
172
|
-
export function formatWeekDayShort(date: Date): string {
|
|
173
|
-
return `${SHORT_DAYS[date.getDay()]} ${date.getDate()}`;
|
|
174
|
-
}
|
|
175
|
-
|
|
176
|
-
export function formatMonthDay(date: Date): string {
|
|
177
|
-
return `${date.getDate()}`;
|
|
178
|
-
}
|
|
179
|
-
|
|
180
|
-
export function getWeekRangeTitle(displayDate: Date): string {
|
|
181
|
-
const dates = getWeekDates(displayDate);
|
|
182
|
-
const start = dates[0];
|
|
183
|
-
const end = dates[6];
|
|
184
|
-
if (start.getMonth() === end.getMonth()) {
|
|
185
|
-
return `${SHORT_MONTHS[start.getMonth()]} ${start.getDate()} – ${end.getDate()}, ${start.getFullYear()}`;
|
|
186
|
-
}
|
|
187
|
-
if (start.getFullYear() === end.getFullYear()) {
|
|
188
|
-
return `${SHORT_MONTHS[start.getMonth()]} ${start.getDate()} – ${SHORT_MONTHS[end.getMonth()]} ${end.getDate()}, ${start.getFullYear()}`;
|
|
189
|
-
}
|
|
190
|
-
return `${SHORT_MONTHS[start.getMonth()]} ${start.getDate()}, ${start.getFullYear()} – ${SHORT_MONTHS[end.getMonth()]} ${end.getDate()}, ${end.getFullYear()}`;
|
|
191
|
-
}
|
|
192
|
-
|
|
193
|
-
// --- Horizontal view utilities ---
|
|
194
|
-
|
|
195
|
-
export const DEFAULT_HORIZONTAL_CONFIG: Required<CalendarHorizontalConfig> = {
|
|
196
|
-
startHour: 8,
|
|
197
|
-
endHour: 17,
|
|
198
|
-
slotMinutes: 30,
|
|
199
|
-
slotWidth: 80,
|
|
200
|
-
memberColumnWidth: 180,
|
|
201
|
-
slotHeight: 60,
|
|
202
|
-
timeColumnWidth: 60,
|
|
203
|
-
};
|
|
204
|
-
|
|
205
|
-
export function resolveHorizontalConfig(
|
|
206
|
-
config?: CalendarHorizontalConfig,
|
|
207
|
-
): Required<CalendarHorizontalConfig> {
|
|
208
|
-
return { ...DEFAULT_HORIZONTAL_CONFIG, ...config };
|
|
209
|
-
}
|
|
210
|
-
|
|
211
|
-
export function getTimeSlots(
|
|
212
|
-
startHour: number,
|
|
213
|
-
endHour: number,
|
|
214
|
-
slotMinutes: number,
|
|
215
|
-
): string[] {
|
|
216
|
-
const slots: string[] = [];
|
|
217
|
-
for (let hour = startHour; hour <= endHour; hour++) {
|
|
218
|
-
for (let min = 0; min < 60; min += slotMinutes) {
|
|
219
|
-
if (hour === endHour && min > 0) break;
|
|
220
|
-
slots.push(
|
|
221
|
-
`${hour.toString().padStart(2, '0')}:${min.toString().padStart(2, '0')}`,
|
|
222
|
-
);
|
|
223
|
-
}
|
|
224
|
-
}
|
|
225
|
-
return slots;
|
|
226
|
-
}
|
|
227
|
-
|
|
228
|
-
export function formatTimeRange(start: Date, end: Date): string {
|
|
229
|
-
const fmt = (d: Date) =>
|
|
230
|
-
`${d.getHours().toString().padStart(2, '0')}:${d.getMinutes().toString().padStart(2, '0')}`;
|
|
231
|
-
return `${fmt(start)} - ${fmt(end)}`;
|
|
232
|
-
}
|
|
233
|
-
|
|
234
|
-
export function getEventLeftOffset(
|
|
235
|
-
eventStart: Date,
|
|
236
|
-
startHour: number,
|
|
237
|
-
slotMinutes: number,
|
|
238
|
-
slotWidth: number,
|
|
239
|
-
): number {
|
|
240
|
-
const eventMinutes = eventStart.getHours() * 60 + eventStart.getMinutes();
|
|
241
|
-
const timelineStartMinutes = startHour * 60;
|
|
242
|
-
const minutesFromStart = eventMinutes - timelineStartMinutes;
|
|
243
|
-
return (minutesFromStart / slotMinutes) * slotWidth;
|
|
244
|
-
}
|
|
245
|
-
|
|
246
|
-
export function getEventWidth(
|
|
247
|
-
eventStart: Date,
|
|
248
|
-
eventEnd: Date,
|
|
249
|
-
slotMinutes: number,
|
|
250
|
-
slotWidth: number,
|
|
251
|
-
): number {
|
|
252
|
-
const durationMs = eventEnd.getTime() - eventStart.getTime();
|
|
253
|
-
const durationMinutes = durationMs / (1000 * 60);
|
|
254
|
-
return (durationMinutes / slotMinutes) * slotWidth;
|
|
255
|
-
}
|
|
256
|
-
|
|
257
|
-
export function getEventTopOffset(
|
|
258
|
-
eventStart: Date,
|
|
259
|
-
startHour: number,
|
|
260
|
-
slotMinutes: number,
|
|
261
|
-
slotHeight: number,
|
|
262
|
-
): number {
|
|
263
|
-
const eventMinutes = eventStart.getHours() * 60 + eventStart.getMinutes();
|
|
264
|
-
const timelineStartMinutes = startHour * 60;
|
|
265
|
-
const minutesFromStart = eventMinutes - timelineStartMinutes;
|
|
266
|
-
return (minutesFromStart / slotMinutes) * slotHeight;
|
|
267
|
-
}
|
|
268
|
-
|
|
269
|
-
export function getEventHeight(
|
|
270
|
-
eventStart: Date,
|
|
271
|
-
eventEnd: Date,
|
|
272
|
-
slotMinutes: number,
|
|
273
|
-
slotHeight: number,
|
|
274
|
-
): number {
|
|
275
|
-
const durationMs = eventEnd.getTime() - eventStart.getTime();
|
|
276
|
-
const durationMinutes = durationMs / (1000 * 60);
|
|
277
|
-
return (durationMinutes / slotMinutes) * slotHeight;
|
|
278
|
-
}
|
|
1
|
+
import type {
|
|
2
|
+
CalendarDay,
|
|
3
|
+
CalendarEvent,
|
|
4
|
+
CalendarWeek,
|
|
5
|
+
CalendarHorizontalConfig,
|
|
6
|
+
} from './types';
|
|
7
|
+
|
|
8
|
+
export function getDaysInMonth(year: number, month: number): number {
|
|
9
|
+
return new Date(year, month + 1, 0).getDate();
|
|
10
|
+
}
|
|
11
|
+
|
|
12
|
+
export function getFirstDayOfWeek(year: number, month: number): number {
|
|
13
|
+
return new Date(year, month, 1).getDay();
|
|
14
|
+
}
|
|
15
|
+
|
|
16
|
+
export function isSameDay(a: Date, b: Date): boolean {
|
|
17
|
+
return (
|
|
18
|
+
a.getFullYear() === b.getFullYear() &&
|
|
19
|
+
a.getMonth() === b.getMonth() &&
|
|
20
|
+
a.getDate() === b.getDate()
|
|
21
|
+
);
|
|
22
|
+
}
|
|
23
|
+
|
|
24
|
+
export function isToday(date: Date): boolean {
|
|
25
|
+
return isSameDay(date, new Date());
|
|
26
|
+
}
|
|
27
|
+
|
|
28
|
+
export function addMonths(date: Date, count: number): Date {
|
|
29
|
+
const result = new Date(date);
|
|
30
|
+
result.setMonth(result.getMonth() + count);
|
|
31
|
+
return result;
|
|
32
|
+
}
|
|
33
|
+
|
|
34
|
+
export function addDays(date: Date, count: number): Date {
|
|
35
|
+
const result = new Date(date);
|
|
36
|
+
result.setDate(result.getDate() + count);
|
|
37
|
+
return result;
|
|
38
|
+
}
|
|
39
|
+
|
|
40
|
+
export function getWeekDays(): string[] {
|
|
41
|
+
return ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'];
|
|
42
|
+
}
|
|
43
|
+
|
|
44
|
+
export function getMonthName(month: number): string {
|
|
45
|
+
const names = [
|
|
46
|
+
'January',
|
|
47
|
+
'February',
|
|
48
|
+
'March',
|
|
49
|
+
'April',
|
|
50
|
+
'May',
|
|
51
|
+
'June',
|
|
52
|
+
'July',
|
|
53
|
+
'August',
|
|
54
|
+
'September',
|
|
55
|
+
'October',
|
|
56
|
+
'November',
|
|
57
|
+
'December',
|
|
58
|
+
];
|
|
59
|
+
return names[month];
|
|
60
|
+
}
|
|
61
|
+
|
|
62
|
+
export function getEventsForDate(
|
|
63
|
+
events: CalendarEvent[],
|
|
64
|
+
date: Date,
|
|
65
|
+
): CalendarEvent[] {
|
|
66
|
+
return events.filter((e) => isSameDay(e.start, date));
|
|
67
|
+
}
|
|
68
|
+
|
|
69
|
+
export function formatTime(date: Date): string {
|
|
70
|
+
const h = date.getHours();
|
|
71
|
+
const m = date.getMinutes();
|
|
72
|
+
const ampm = h >= 12 ? 'PM' : 'AM';
|
|
73
|
+
const hour = h % 12 || 12;
|
|
74
|
+
return `${hour}${m > 0 ? ':' + m.toString().padStart(2, '0') : ''}${ampm}`;
|
|
75
|
+
}
|
|
76
|
+
|
|
77
|
+
export function formatHour(hour: number): string {
|
|
78
|
+
if (hour === 0) return '12 AM';
|
|
79
|
+
if (hour < 12) return `${hour} AM`;
|
|
80
|
+
if (hour === 12) return '12 PM';
|
|
81
|
+
return `${hour - 12} PM`;
|
|
82
|
+
}
|
|
83
|
+
|
|
84
|
+
export function buildMonthGrid(
|
|
85
|
+
year: number,
|
|
86
|
+
month: number,
|
|
87
|
+
events: CalendarEvent[],
|
|
88
|
+
): CalendarWeek[] {
|
|
89
|
+
const daysInMonth = getDaysInMonth(year, month);
|
|
90
|
+
const firstDay = getFirstDayOfWeek(year, month);
|
|
91
|
+
const weeks: CalendarWeek[] = [];
|
|
92
|
+
let currentWeek: CalendarDay[] = [];
|
|
93
|
+
|
|
94
|
+
// Fill leading days from previous month
|
|
95
|
+
const prevMonth = month === 0 ? 11 : month - 1;
|
|
96
|
+
const prevYear = month === 0 ? year - 1 : year;
|
|
97
|
+
const daysInPrevMonth = getDaysInMonth(prevYear, prevMonth);
|
|
98
|
+
for (let i = firstDay - 1; i >= 0; i--) {
|
|
99
|
+
const date = new Date(prevYear, prevMonth, daysInPrevMonth - i);
|
|
100
|
+
currentWeek.push({
|
|
101
|
+
date,
|
|
102
|
+
isCurrentMonth: false,
|
|
103
|
+
isToday: isToday(date),
|
|
104
|
+
events: getEventsForDate(events, date),
|
|
105
|
+
});
|
|
106
|
+
}
|
|
107
|
+
|
|
108
|
+
// Fill current month days
|
|
109
|
+
for (let day = 1; day <= daysInMonth; day++) {
|
|
110
|
+
const date = new Date(year, month, day);
|
|
111
|
+
currentWeek.push({
|
|
112
|
+
date,
|
|
113
|
+
isCurrentMonth: true,
|
|
114
|
+
isToday: isToday(date),
|
|
115
|
+
events: getEventsForDate(events, date),
|
|
116
|
+
});
|
|
117
|
+
if (currentWeek.length === 7) {
|
|
118
|
+
weeks.push({ days: currentWeek });
|
|
119
|
+
currentWeek = [];
|
|
120
|
+
}
|
|
121
|
+
}
|
|
122
|
+
|
|
123
|
+
// Fill trailing days from next month
|
|
124
|
+
if (currentWeek.length > 0) {
|
|
125
|
+
const nextMonth = month === 11 ? 0 : month + 1;
|
|
126
|
+
const nextYear = month === 11 ? year + 1 : year;
|
|
127
|
+
let nextDay = 1;
|
|
128
|
+
while (currentWeek.length < 7) {
|
|
129
|
+
const date = new Date(nextYear, nextMonth, nextDay++);
|
|
130
|
+
currentWeek.push({
|
|
131
|
+
date,
|
|
132
|
+
isCurrentMonth: false,
|
|
133
|
+
isToday: isToday(date),
|
|
134
|
+
events: getEventsForDate(events, date),
|
|
135
|
+
});
|
|
136
|
+
}
|
|
137
|
+
weeks.push({ days: currentWeek });
|
|
138
|
+
}
|
|
139
|
+
|
|
140
|
+
return weeks;
|
|
141
|
+
}
|
|
142
|
+
|
|
143
|
+
// --- Week/month date helpers ---
|
|
144
|
+
|
|
145
|
+
const SHORT_DAYS = ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'];
|
|
146
|
+
const SHORT_MONTHS = [
|
|
147
|
+
'Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun',
|
|
148
|
+
'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec',
|
|
149
|
+
];
|
|
150
|
+
|
|
151
|
+
export function getWeekDates(displayDate: Date): Date[] {
|
|
152
|
+
const day = displayDate.getDay();
|
|
153
|
+
const sunday = addDays(displayDate, -day);
|
|
154
|
+
const dates: Date[] = [];
|
|
155
|
+
for (let i = 0; i < 7; i++) {
|
|
156
|
+
dates.push(addDays(sunday, i));
|
|
157
|
+
}
|
|
158
|
+
return dates;
|
|
159
|
+
}
|
|
160
|
+
|
|
161
|
+
export function getMonthDates(displayDate: Date): Date[] {
|
|
162
|
+
const year = displayDate.getFullYear();
|
|
163
|
+
const month = displayDate.getMonth();
|
|
164
|
+
const count = getDaysInMonth(year, month);
|
|
165
|
+
const dates: Date[] = [];
|
|
166
|
+
for (let d = 1; d <= count; d++) {
|
|
167
|
+
dates.push(new Date(year, month, d));
|
|
168
|
+
}
|
|
169
|
+
return dates;
|
|
170
|
+
}
|
|
171
|
+
|
|
172
|
+
export function formatWeekDayShort(date: Date): string {
|
|
173
|
+
return `${SHORT_DAYS[date.getDay()]} ${date.getDate()}`;
|
|
174
|
+
}
|
|
175
|
+
|
|
176
|
+
export function formatMonthDay(date: Date): string {
|
|
177
|
+
return `${date.getDate()}`;
|
|
178
|
+
}
|
|
179
|
+
|
|
180
|
+
export function getWeekRangeTitle(displayDate: Date): string {
|
|
181
|
+
const dates = getWeekDates(displayDate);
|
|
182
|
+
const start = dates[0];
|
|
183
|
+
const end = dates[6];
|
|
184
|
+
if (start.getMonth() === end.getMonth()) {
|
|
185
|
+
return `${SHORT_MONTHS[start.getMonth()]} ${start.getDate()} – ${end.getDate()}, ${start.getFullYear()}`;
|
|
186
|
+
}
|
|
187
|
+
if (start.getFullYear() === end.getFullYear()) {
|
|
188
|
+
return `${SHORT_MONTHS[start.getMonth()]} ${start.getDate()} – ${SHORT_MONTHS[end.getMonth()]} ${end.getDate()}, ${start.getFullYear()}`;
|
|
189
|
+
}
|
|
190
|
+
return `${SHORT_MONTHS[start.getMonth()]} ${start.getDate()}, ${start.getFullYear()} – ${SHORT_MONTHS[end.getMonth()]} ${end.getDate()}, ${end.getFullYear()}`;
|
|
191
|
+
}
|
|
192
|
+
|
|
193
|
+
// --- Horizontal view utilities ---
|
|
194
|
+
|
|
195
|
+
export const DEFAULT_HORIZONTAL_CONFIG: Required<CalendarHorizontalConfig> = {
|
|
196
|
+
startHour: 8,
|
|
197
|
+
endHour: 17,
|
|
198
|
+
slotMinutes: 30,
|
|
199
|
+
slotWidth: 80,
|
|
200
|
+
memberColumnWidth: 180,
|
|
201
|
+
slotHeight: 60,
|
|
202
|
+
timeColumnWidth: 60,
|
|
203
|
+
};
|
|
204
|
+
|
|
205
|
+
export function resolveHorizontalConfig(
|
|
206
|
+
config?: CalendarHorizontalConfig,
|
|
207
|
+
): Required<CalendarHorizontalConfig> {
|
|
208
|
+
return { ...DEFAULT_HORIZONTAL_CONFIG, ...config };
|
|
209
|
+
}
|
|
210
|
+
|
|
211
|
+
export function getTimeSlots(
|
|
212
|
+
startHour: number,
|
|
213
|
+
endHour: number,
|
|
214
|
+
slotMinutes: number,
|
|
215
|
+
): string[] {
|
|
216
|
+
const slots: string[] = [];
|
|
217
|
+
for (let hour = startHour; hour <= endHour; hour++) {
|
|
218
|
+
for (let min = 0; min < 60; min += slotMinutes) {
|
|
219
|
+
if (hour === endHour && min > 0) break;
|
|
220
|
+
slots.push(
|
|
221
|
+
`${hour.toString().padStart(2, '0')}:${min.toString().padStart(2, '0')}`,
|
|
222
|
+
);
|
|
223
|
+
}
|
|
224
|
+
}
|
|
225
|
+
return slots;
|
|
226
|
+
}
|
|
227
|
+
|
|
228
|
+
export function formatTimeRange(start: Date, end: Date): string {
|
|
229
|
+
const fmt = (d: Date) =>
|
|
230
|
+
`${d.getHours().toString().padStart(2, '0')}:${d.getMinutes().toString().padStart(2, '0')}`;
|
|
231
|
+
return `${fmt(start)} - ${fmt(end)}`;
|
|
232
|
+
}
|
|
233
|
+
|
|
234
|
+
export function getEventLeftOffset(
|
|
235
|
+
eventStart: Date,
|
|
236
|
+
startHour: number,
|
|
237
|
+
slotMinutes: number,
|
|
238
|
+
slotWidth: number,
|
|
239
|
+
): number {
|
|
240
|
+
const eventMinutes = eventStart.getHours() * 60 + eventStart.getMinutes();
|
|
241
|
+
const timelineStartMinutes = startHour * 60;
|
|
242
|
+
const minutesFromStart = eventMinutes - timelineStartMinutes;
|
|
243
|
+
return (minutesFromStart / slotMinutes) * slotWidth;
|
|
244
|
+
}
|
|
245
|
+
|
|
246
|
+
export function getEventWidth(
|
|
247
|
+
eventStart: Date,
|
|
248
|
+
eventEnd: Date,
|
|
249
|
+
slotMinutes: number,
|
|
250
|
+
slotWidth: number,
|
|
251
|
+
): number {
|
|
252
|
+
const durationMs = eventEnd.getTime() - eventStart.getTime();
|
|
253
|
+
const durationMinutes = durationMs / (1000 * 60);
|
|
254
|
+
return (durationMinutes / slotMinutes) * slotWidth;
|
|
255
|
+
}
|
|
256
|
+
|
|
257
|
+
export function getEventTopOffset(
|
|
258
|
+
eventStart: Date,
|
|
259
|
+
startHour: number,
|
|
260
|
+
slotMinutes: number,
|
|
261
|
+
slotHeight: number,
|
|
262
|
+
): number {
|
|
263
|
+
const eventMinutes = eventStart.getHours() * 60 + eventStart.getMinutes();
|
|
264
|
+
const timelineStartMinutes = startHour * 60;
|
|
265
|
+
const minutesFromStart = eventMinutes - timelineStartMinutes;
|
|
266
|
+
return (minutesFromStart / slotMinutes) * slotHeight;
|
|
267
|
+
}
|
|
268
|
+
|
|
269
|
+
export function getEventHeight(
|
|
270
|
+
eventStart: Date,
|
|
271
|
+
eventEnd: Date,
|
|
272
|
+
slotMinutes: number,
|
|
273
|
+
slotHeight: number,
|
|
274
|
+
): number {
|
|
275
|
+
const durationMs = eventEnd.getTime() - eventStart.getTime();
|
|
276
|
+
const durationMinutes = durationMs / (1000 * 60);
|
|
277
|
+
return (durationMinutes / slotMinutes) * slotHeight;
|
|
278
|
+
}
|
package/src/card/card-body.tsx
CHANGED
|
@@ -1,22 +1,22 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import { View } from 'react-native';
|
|
3
|
-
import { useCardContext } from './card';
|
|
4
|
-
import type { CardBodyProps } from './types';
|
|
5
|
-
import { cardBodyStyle } from './styles';
|
|
6
|
-
|
|
7
|
-
export const CardBody = React.forwardRef<
|
|
8
|
-
React.ElementRef<typeof View>,
|
|
9
|
-
CardBodyProps
|
|
10
|
-
>(({ className, ...props }, ref) => {
|
|
11
|
-
const { size } = useCardContext();
|
|
12
|
-
|
|
13
|
-
return (
|
|
14
|
-
<View
|
|
15
|
-
ref={ref}
|
|
16
|
-
className={cardBodyStyle({ size, class: className })}
|
|
17
|
-
{...props}
|
|
18
|
-
/>
|
|
19
|
-
);
|
|
20
|
-
});
|
|
21
|
-
|
|
22
|
-
CardBody.displayName = 'CardBody';
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { View } from 'react-native';
|
|
3
|
+
import { useCardContext } from './card';
|
|
4
|
+
import type { CardBodyProps } from './types';
|
|
5
|
+
import { cardBodyStyle } from './styles';
|
|
6
|
+
|
|
7
|
+
export const CardBody = React.forwardRef<
|
|
8
|
+
React.ElementRef<typeof View>,
|
|
9
|
+
CardBodyProps
|
|
10
|
+
>(({ className, ...props }, ref) => {
|
|
11
|
+
const { size } = useCardContext();
|
|
12
|
+
|
|
13
|
+
return (
|
|
14
|
+
<View
|
|
15
|
+
ref={ref}
|
|
16
|
+
className={cardBodyStyle({ size, class: className })}
|
|
17
|
+
{...props}
|
|
18
|
+
/>
|
|
19
|
+
);
|
|
20
|
+
});
|
|
21
|
+
|
|
22
|
+
CardBody.displayName = 'CardBody';
|
package/src/card/card-footer.tsx
CHANGED
|
@@ -1,19 +1,19 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import { View } from 'react-native';
|
|
3
|
-
import type { CardFooterProps } from './types';
|
|
4
|
-
import { cardFooterStyle } from './styles';
|
|
5
|
-
|
|
6
|
-
export const CardFooter = React.forwardRef<
|
|
7
|
-
React.ElementRef<typeof View>,
|
|
8
|
-
CardFooterProps
|
|
9
|
-
>(({ className, ...props }, ref) => {
|
|
10
|
-
return (
|
|
11
|
-
<View
|
|
12
|
-
ref={ref}
|
|
13
|
-
className={cardFooterStyle({ class: className })}
|
|
14
|
-
{...props}
|
|
15
|
-
/>
|
|
16
|
-
);
|
|
17
|
-
});
|
|
18
|
-
|
|
19
|
-
CardFooter.displayName = 'CardFooter';
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { View } from 'react-native';
|
|
3
|
+
import type { CardFooterProps } from './types';
|
|
4
|
+
import { cardFooterStyle } from './styles';
|
|
5
|
+
|
|
6
|
+
export const CardFooter = React.forwardRef<
|
|
7
|
+
React.ElementRef<typeof View>,
|
|
8
|
+
CardFooterProps
|
|
9
|
+
>(({ className, ...props }, ref) => {
|
|
10
|
+
return (
|
|
11
|
+
<View
|
|
12
|
+
ref={ref}
|
|
13
|
+
className={cardFooterStyle({ class: className })}
|
|
14
|
+
{...props}
|
|
15
|
+
/>
|
|
16
|
+
);
|
|
17
|
+
});
|
|
18
|
+
|
|
19
|
+
CardFooter.displayName = 'CardFooter';
|