react-native-ll-calendar 0.2.0 → 0.3.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/README.md +33 -1
- package/lib/module/calendar/month-calendar/MonthCalendar.js +20 -2
- package/lib/module/calendar/month-calendar/MonthCalendar.js.map +1 -1
- package/lib/module/calendar/month-calendar/view/MonthCalendarViewItem.js +47 -5
- package/lib/module/calendar/month-calendar/view/MonthCalendarViewItem.js.map +1 -1
- package/lib/module/calendar/month-calendar/view/MonthCalendarWeekRow.js +21 -9
- package/lib/module/calendar/month-calendar/view/MonthCalendarWeekRow.js.map +1 -1
- package/lib/typescript/src/calendar/month-calendar/MonthCalendar.d.ts +12 -3
- package/lib/typescript/src/calendar/month-calendar/MonthCalendar.d.ts.map +1 -1
- package/lib/typescript/src/calendar/month-calendar/view/MonthCalendarViewItem.d.ts +12 -3
- package/lib/typescript/src/calendar/month-calendar/view/MonthCalendarViewItem.d.ts.map +1 -1
- package/lib/typescript/src/calendar/month-calendar/view/MonthCalendarWeekRow.d.ts +11 -2
- package/lib/typescript/src/calendar/month-calendar/view/MonthCalendarWeekRow.d.ts.map +1 -1
- package/lib/typescript/src/types/month-calendar.d.ts +1 -0
- package/lib/typescript/src/types/month-calendar.d.ts.map +1 -1
- package/package.json +1 -1
- package/src/calendar/month-calendar/MonthCalendar.tsx +41 -5
- package/src/calendar/month-calendar/view/MonthCalendarViewItem.tsx +69 -9
- package/src/calendar/month-calendar/view/MonthCalendarWeekRow.tsx +69 -25
- package/src/types/month-calendar.ts +2 -0
package/README.md
CHANGED
|
@@ -44,6 +44,13 @@ const events: CalendarEvent[] = [
|
|
|
44
44
|
|
|
45
45
|
function App() {
|
|
46
46
|
const [date, setDate] = useState(new Date());
|
|
47
|
+
const [refreshing, setRefreshing] = useState(false);
|
|
48
|
+
|
|
49
|
+
const handleRefresh = () => {
|
|
50
|
+
setRefreshing(true);
|
|
51
|
+
// Fetch new events or data
|
|
52
|
+
setTimeout(() => setRefreshing(false), 1000);
|
|
53
|
+
};
|
|
47
54
|
|
|
48
55
|
return (
|
|
49
56
|
<MonthCalendar
|
|
@@ -53,6 +60,14 @@ function App() {
|
|
|
53
60
|
events={events}
|
|
54
61
|
onPressEvent={(event) => console.log('Event pressed:', event.title)}
|
|
55
62
|
onPressCell={(date) => console.log('Cell pressed:', date)}
|
|
63
|
+
onLongPressCell={(date) => console.log('Cell long pressed:', date)}
|
|
64
|
+
delayLongPress={500}
|
|
65
|
+
onRefresh={handleRefresh}
|
|
66
|
+
refreshing={refreshing}
|
|
67
|
+
todayCellTextStyle={{ fontWeight: 'bold', color: '#007AFF' }}
|
|
68
|
+
dayCellTextStyle={(date) => ({
|
|
69
|
+
color: date.getDay() === 0 ? '#FF3B30' : '#000000',
|
|
70
|
+
})}
|
|
56
71
|
/>
|
|
57
72
|
);
|
|
58
73
|
}
|
|
@@ -70,6 +85,18 @@ function App() {
|
|
|
70
85
|
| `events` | `CalendarEvent[]` | Yes | - | Array of calendar events |
|
|
71
86
|
| `onPressEvent` | `(event: CalendarEvent) => void` | No | - | Callback when event is pressed |
|
|
72
87
|
| `onPressCell` | `(date: Date) => void` | No | - | Callback when date cell is pressed |
|
|
88
|
+
| `onLongPressCell` | `(date: Date) => void` | No | - | Callback when date cell is long pressed |
|
|
89
|
+
| `delayLongPress` | `number` | No | - | Delay in ms before long press is triggered |
|
|
90
|
+
| `onRefresh` | `() => void` | No | - | Callback for pull-to-refresh |
|
|
91
|
+
| `refreshing` | `boolean` | No | - | Whether the calendar is refreshing |
|
|
92
|
+
| `dayCellContainerStyle` | `(date: Date) => ViewStyle` | No | - | Style function for day cell container |
|
|
93
|
+
| `dayCellTextStyle` | `(date: Date) => TextStyle` | No | - | Style function for day cell text |
|
|
94
|
+
| `todayCellTextStyle` | `TextStyle` | No | - | Style for today's cell text |
|
|
95
|
+
| `locale` | `ILocale` | No | - | Locale configuration for date formatting |
|
|
96
|
+
| `weekdayCellContainerStyle` | `(weekDayNum: WeekdayNum) => ViewStyle` | No | - | Style function for weekday cell container |
|
|
97
|
+
| `weekdayCellTextStyle` | `(weekDayNum: WeekdayNum) => TextStyle` | No | - | Style function for weekday cell text |
|
|
98
|
+
| `hiddenMonth` | `boolean` | No | `false` | Hide month header display |
|
|
99
|
+
| `monthFormat` | `string` | No | - | Custom format string for month display |
|
|
73
100
|
|
|
74
101
|
### CalendarEvent
|
|
75
102
|
|
|
@@ -88,8 +115,13 @@ function App() {
|
|
|
88
115
|
- Horizontally scrollable month view
|
|
89
116
|
- Multi-day event support
|
|
90
117
|
- Customizable event colors
|
|
91
|
-
- Event and date cell press handlers
|
|
118
|
+
- Event and date cell press handlers (tap and long press)
|
|
92
119
|
- Configurable week start day (Sunday or Monday)
|
|
120
|
+
- Customizable styling for day cells, weekday cells, and today's cell
|
|
121
|
+
- Pull-to-refresh support
|
|
122
|
+
- Locale support for internationalization
|
|
123
|
+
- Optional month header visibility control
|
|
124
|
+
- Custom month format display
|
|
93
125
|
- Spans 10 years before and after the default date
|
|
94
126
|
|
|
95
127
|
## License
|
|
@@ -15,9 +15,18 @@ export const MonthCalendar = props => {
|
|
|
15
15
|
events,
|
|
16
16
|
onPressEvent,
|
|
17
17
|
onPressCell,
|
|
18
|
+
onLongPressCell,
|
|
19
|
+
delayLongPress,
|
|
18
20
|
onRefresh,
|
|
19
21
|
refreshing,
|
|
20
|
-
|
|
22
|
+
dayCellContainerStyle,
|
|
23
|
+
dayCellTextStyle,
|
|
24
|
+
locale,
|
|
25
|
+
weekdayCellContainerStyle,
|
|
26
|
+
weekdayCellTextStyle,
|
|
27
|
+
todayCellTextStyle,
|
|
28
|
+
hiddenMonth,
|
|
29
|
+
monthFormat
|
|
21
30
|
} = props;
|
|
22
31
|
const [dateState] = useState(defaultDate);
|
|
23
32
|
const [_activeIndex, setActiveIndex] = useState(HALF_PANEL_LENGTH);
|
|
@@ -70,10 +79,19 @@ export const MonthCalendar = props => {
|
|
|
70
79
|
events: events,
|
|
71
80
|
onPressEvent: onPressEvent,
|
|
72
81
|
onPressCell: onPressCell,
|
|
82
|
+
onLongPressCell: onLongPressCell,
|
|
83
|
+
delayLongPress: delayLongPress,
|
|
73
84
|
flatListIndex: index,
|
|
74
85
|
onRefresh: onRefresh,
|
|
75
86
|
refreshing: refreshing,
|
|
76
|
-
|
|
87
|
+
dayCellContainerStyle: dayCellContainerStyle,
|
|
88
|
+
dayCellTextStyle: dayCellTextStyle,
|
|
89
|
+
locale: locale,
|
|
90
|
+
weekdayCellContainerStyle: weekdayCellContainerStyle,
|
|
91
|
+
weekdayCellTextStyle: weekdayCellTextStyle,
|
|
92
|
+
todayCellTextStyle: todayCellTextStyle,
|
|
93
|
+
hiddenMonth: hiddenMonth,
|
|
94
|
+
monthFormat: monthFormat
|
|
77
95
|
});
|
|
78
96
|
},
|
|
79
97
|
showsHorizontalScrollIndicator: false,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["useWindowDimensions","FlatList","dayjs","useState","MonthCalendarViewItem","jsx","_jsx","HALF_PANEL_LENGTH","MonthCalendar","props","defaultDate","weekStartsOn","onChangeDate","events","onPressEvent","onPressCell","onRefresh","refreshing","
|
|
1
|
+
{"version":3,"names":["useWindowDimensions","FlatList","dayjs","useState","MonthCalendarViewItem","jsx","_jsx","HALF_PANEL_LENGTH","MonthCalendar","props","defaultDate","weekStartsOn","onChangeDate","events","onPressEvent","onPressCell","onLongPressCell","delayLongPress","onRefresh","refreshing","dayCellContainerStyle","dayCellTextStyle","locale","weekdayCellContainerStyle","weekdayCellTextStyle","todayCellTextStyle","hiddenMonth","monthFormat","dateState","_activeIndex","setActiveIndex","defaultDateDjs","startOfDefaultDateDjs","startOf","prevPanels","Array","from","length","_","i","subtract","format","nextPanels","add","panels","width","horizontal","pagingEnabled","getItemLayout","_data","index","offset","onMomentumScrollEnd","e","scrollX","nativeEvent","contentOffset","x","newIndex","Math","round","month","newDate","Date","initialScrollIndex","decelerationRate","data","renderItem","item","flatListIndex","showsHorizontalScrollIndicator","scrollEnabled","windowSize","initialNumToRender","maxToRenderPerBatch","removeClippedSubviews"],"sourceRoot":"../../../../src","sources":["calendar/month-calendar/MonthCalendar.tsx"],"mappings":"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","ignoreList":[]}
|
|
@@ -8,6 +8,7 @@ import { monthlyEndDate, monthlyStartDate } from "../../../utils/functions.js";
|
|
|
8
8
|
import { useEvents } from "../logic/useEvents.js";
|
|
9
9
|
import { CELL_BORDER_WIDTH } from "../../../constants/size.js";
|
|
10
10
|
import { RefreshControl } from 'react-native';
|
|
11
|
+
import { useCallback, useMemo, useState } from 'react';
|
|
11
12
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
12
13
|
export const MonthCalendarViewItem = props => {
|
|
13
14
|
const {
|
|
@@ -16,10 +17,19 @@ export const MonthCalendarViewItem = props => {
|
|
|
16
17
|
events,
|
|
17
18
|
onPressEvent,
|
|
18
19
|
onPressCell,
|
|
20
|
+
onLongPressCell,
|
|
21
|
+
delayLongPress,
|
|
19
22
|
flatListIndex,
|
|
20
23
|
onRefresh,
|
|
21
24
|
refreshing,
|
|
22
|
-
|
|
25
|
+
dayCellContainerStyle,
|
|
26
|
+
dayCellTextStyle,
|
|
27
|
+
locale,
|
|
28
|
+
weekdayCellContainerStyle,
|
|
29
|
+
weekdayCellTextStyle,
|
|
30
|
+
todayCellTextStyle,
|
|
31
|
+
hiddenMonth,
|
|
32
|
+
monthFormat = 'YYYY/MM'
|
|
23
33
|
} = props;
|
|
24
34
|
const {
|
|
25
35
|
width
|
|
@@ -53,6 +63,21 @@ export const MonthCalendarViewItem = props => {
|
|
|
53
63
|
events,
|
|
54
64
|
weekStartsOn
|
|
55
65
|
});
|
|
66
|
+
const [bodyHeight, setBodyHeight] = useState(0);
|
|
67
|
+
const onLayoutBody = useCallback(e => {
|
|
68
|
+
setBodyHeight(e.nativeEvent.layout.height);
|
|
69
|
+
}, []);
|
|
70
|
+
const [monthRowHeight, setMonthRowHeight] = useState(0);
|
|
71
|
+
const onLayoutMonthRow = useCallback(e => {
|
|
72
|
+
setMonthRowHeight(e.nativeEvent.layout.height);
|
|
73
|
+
}, []);
|
|
74
|
+
const [weekdayRowHeight, setWeekdayRowHeight] = useState(0);
|
|
75
|
+
const onLayoutWeekdayRow = useCallback(e => {
|
|
76
|
+
setWeekdayRowHeight(e.nativeEvent.layout.height);
|
|
77
|
+
}, []);
|
|
78
|
+
const weekRowMinHeight = useMemo(() => {
|
|
79
|
+
return (bodyHeight - monthRowHeight - weekdayRowHeight) / weeks.length;
|
|
80
|
+
}, [bodyHeight, monthRowHeight, weekdayRowHeight, weeks.length]);
|
|
56
81
|
return /*#__PURE__*/_jsxs(ScrollView, {
|
|
57
82
|
style: [styles.container, {
|
|
58
83
|
width,
|
|
@@ -62,16 +87,24 @@ export const MonthCalendarViewItem = props => {
|
|
|
62
87
|
refreshing: !!refreshing,
|
|
63
88
|
onRefresh: onRefresh
|
|
64
89
|
}),
|
|
65
|
-
|
|
90
|
+
onLayout: onLayoutBody,
|
|
91
|
+
children: [hiddenMonth ? /*#__PURE__*/_jsx(View, {
|
|
92
|
+
style: styles.blankMonthContainer
|
|
93
|
+
}) : /*#__PURE__*/_jsx(View, {
|
|
66
94
|
style: styles.monthContainer,
|
|
95
|
+
onLayout: onLayoutMonthRow,
|
|
67
96
|
children: /*#__PURE__*/_jsx(Text, {
|
|
68
97
|
style: styles.monthText,
|
|
69
|
-
children: dateDjs.format(
|
|
98
|
+
children: dateDjs.format(monthFormat)
|
|
70
99
|
})
|
|
71
100
|
}), /*#__PURE__*/_jsx(View, {
|
|
101
|
+
onLayout: onLayoutWeekdayRow,
|
|
72
102
|
children: /*#__PURE__*/_jsx(MonthCalendarWeekRow, {
|
|
73
103
|
dates: weeks[0] ?? [],
|
|
74
|
-
isWeekdayHeader: true
|
|
104
|
+
isWeekdayHeader: true,
|
|
105
|
+
locale: locale,
|
|
106
|
+
weekdayCellContainerStyle: weekdayCellContainerStyle,
|
|
107
|
+
weekdayCellTextStyle: weekdayCellTextStyle
|
|
75
108
|
})
|
|
76
109
|
}), /*#__PURE__*/_jsx(View, {
|
|
77
110
|
children: weeks.map((week, index) => {
|
|
@@ -87,7 +120,12 @@ export const MonthCalendarViewItem = props => {
|
|
|
87
120
|
eventPosition: eventPosition,
|
|
88
121
|
onPressEvent: onPressEvent,
|
|
89
122
|
onPressCell: onPressCell,
|
|
90
|
-
|
|
123
|
+
onLongPressCell: onLongPressCell,
|
|
124
|
+
delayLongPress: delayLongPress,
|
|
125
|
+
dayCellContainerStyle: dayCellContainerStyle,
|
|
126
|
+
dayCellTextStyle: dayCellTextStyle,
|
|
127
|
+
weekRowMinHeight: weekRowMinHeight,
|
|
128
|
+
todayCellTextStyle: todayCellTextStyle
|
|
91
129
|
}, `row-${index}`);
|
|
92
130
|
})
|
|
93
131
|
})]
|
|
@@ -99,6 +137,10 @@ const styles = StyleSheet.create({
|
|
|
99
137
|
borderColor: 'lightslategrey',
|
|
100
138
|
alignSelf: 'flex-start'
|
|
101
139
|
},
|
|
140
|
+
blankMonthContainer: {
|
|
141
|
+
borderWidth: CELL_BORDER_WIDTH,
|
|
142
|
+
borderColor: 'lightslategrey'
|
|
143
|
+
},
|
|
102
144
|
monthContainer: {
|
|
103
145
|
padding: 2,
|
|
104
146
|
borderWidth: CELL_BORDER_WIDTH,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["dayjs","ScrollView","StyleSheet","Text","View","useWindowDimensions","MonthCalendarWeekRow","MonthCalendarEventPosition","monthlyEndDate","monthlyStartDate","useEvents","CELL_BORDER_WIDTH","RefreshControl","jsx","_jsx","jsxs","_jsxs","MonthCalendarViewItem","props","month","weekStartsOn","events","onPressEvent","onPressCell","flatListIndex","onRefresh","refreshing","
|
|
1
|
+
{"version":3,"names":["dayjs","ScrollView","StyleSheet","Text","View","useWindowDimensions","MonthCalendarWeekRow","MonthCalendarEventPosition","monthlyEndDate","monthlyStartDate","useEvents","CELL_BORDER_WIDTH","RefreshControl","useCallback","useMemo","useState","jsx","_jsx","jsxs","_jsxs","MonthCalendarViewItem","props","month","weekStartsOn","events","onPressEvent","onPressCell","onLongPressCell","delayLongPress","flatListIndex","onRefresh","refreshing","dayCellContainerStyle","dayCellTextStyle","locale","weekdayCellContainerStyle","weekdayCellTextStyle","todayCellTextStyle","hiddenMonth","monthFormat","width","eventPosition","date","Date","dateDjs","startDate","endDate","endDjs","weeks","currentDate","isBefore","week","Array","from","length","_","i","add","push","eventsGroupByWeekId","bodyHeight","setBodyHeight","onLayoutBody","e","nativeEvent","layout","height","monthRowHeight","setMonthRowHeight","onLayoutMonthRow","weekdayRowHeight","setWeekdayRowHeight","onLayoutWeekdayRow","weekRowMinHeight","style","styles","container","zIndex","refreshControl","onLayout","children","blankMonthContainer","monthContainer","monthText","format","dates","isWeekdayHeader","map","index","firstDayOfWeek","undefined","weekId","weekEvents","create","borderColor","alignSelf","borderWidth","padding","backgroundColor","textAlign"],"sourceRoot":"../../../../../src","sources":["calendar/month-calendar/view/MonthCalendarViewItem.tsx"],"mappings":"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","ignoreList":[]}
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
import dayjs from 'dayjs';
|
|
4
|
+
import en from 'dayjs/locale/en';
|
|
4
5
|
import { StyleSheet, useWindowDimensions } from 'react-native';
|
|
5
6
|
import { Text, TouchableOpacity, View } from 'react-native';
|
|
6
7
|
import { CELL_BORDER_WIDTH, EVENT_GAP } from "../../../constants/size.js";
|
|
@@ -13,7 +14,15 @@ export const MonthCalendarWeekRow = props => {
|
|
|
13
14
|
eventPosition,
|
|
14
15
|
onPressEvent,
|
|
15
16
|
onPressCell,
|
|
16
|
-
|
|
17
|
+
onLongPressCell,
|
|
18
|
+
delayLongPress = 500,
|
|
19
|
+
dayCellContainerStyle,
|
|
20
|
+
dayCellTextStyle,
|
|
21
|
+
locale = en,
|
|
22
|
+
weekdayCellContainerStyle,
|
|
23
|
+
weekdayCellTextStyle,
|
|
24
|
+
weekRowMinHeight,
|
|
25
|
+
todayCellTextStyle
|
|
17
26
|
} = props;
|
|
18
27
|
const eventHeight = 26;
|
|
19
28
|
const {
|
|
@@ -27,8 +36,8 @@ export const MonthCalendarWeekRow = props => {
|
|
|
27
36
|
return /*#__PURE__*/_jsx(View, {
|
|
28
37
|
style: styles.container,
|
|
29
38
|
children: dates.map((djs, dateIndex) => {
|
|
30
|
-
const text = isWeekdayHeader ? djs.format('ddd') : djs.format('D');
|
|
31
|
-
const filteredEvents = events.filter(event => {
|
|
39
|
+
const text = isWeekdayHeader ? djs.locale(locale).format('ddd') : djs.format('D');
|
|
40
|
+
const filteredEvents = isWeekdayHeader ? [] : events.filter(event => {
|
|
32
41
|
const startDjs = dayjs(event.start);
|
|
33
42
|
return startDjs.format('YYYY-MM-DD') === djs.format('YYYY-MM-DD') || dateIndex === 0 && startDjs.isBefore(djs);
|
|
34
43
|
}).sort((a, b) => {
|
|
@@ -61,20 +70,24 @@ export const MonthCalendarWeekRow = props => {
|
|
|
61
70
|
}
|
|
62
71
|
}
|
|
63
72
|
return /*#__PURE__*/_jsxs(TouchableOpacity, {
|
|
64
|
-
style: [styles.dayCellCountainer,
|
|
65
|
-
minHeight: undefined
|
|
66
|
-
}
|
|
73
|
+
style: [styles.dayCellCountainer, {
|
|
74
|
+
minHeight: isWeekdayHeader ? undefined : weekRowMinHeight
|
|
75
|
+
}, {
|
|
67
76
|
zIndex: 7 - dateIndex
|
|
68
77
|
}],
|
|
69
78
|
onPress: () => {
|
|
70
79
|
onPressCell?.(djs.toDate());
|
|
71
80
|
},
|
|
81
|
+
onLongPress: () => {
|
|
82
|
+
onLongPressCell?.(djs.toDate());
|
|
83
|
+
},
|
|
84
|
+
delayLongPress: delayLongPress,
|
|
72
85
|
children: [/*#__PURE__*/_jsx(View, {
|
|
73
|
-
style: [styles.dayCellInner,
|
|
86
|
+
style: [styles.dayCellInner, isWeekdayHeader ? weekdayCellContainerStyle?.(djs.day()) : dayCellContainerStyle?.(djs.toDate())]
|
|
74
87
|
}), /*#__PURE__*/_jsx(View, {
|
|
75
88
|
style: styles.dayCellLabel,
|
|
76
89
|
children: /*#__PURE__*/_jsx(Text, {
|
|
77
|
-
style: styles.dayCellText,
|
|
90
|
+
style: [styles.dayCellText, isWeekdayHeader ? weekdayCellTextStyle?.(djs.day()) : dayCellTextStyle?.(djs.toDate()), !isWeekdayHeader && dayjs(djs).isSame(dayjs(), 'day') ? todayCellTextStyle : {}],
|
|
78
91
|
children: text
|
|
79
92
|
})
|
|
80
93
|
}), rows.map((eventRow, rowIndex) => {
|
|
@@ -137,7 +150,6 @@ const styles = StyleSheet.create({
|
|
|
137
150
|
backgroundColor: 'white'
|
|
138
151
|
},
|
|
139
152
|
dayCellCountainer: {
|
|
140
|
-
minHeight: 80,
|
|
141
153
|
flex: 1,
|
|
142
154
|
borderRightWidth: CELL_BORDER_WIDTH,
|
|
143
155
|
borderBottomWidth: CELL_BORDER_WIDTH,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["dayjs","StyleSheet","useWindowDimensions","Text","TouchableOpacity","View","CELL_BORDER_WIDTH","EVENT_GAP","jsx","_jsx","jsxs","_jsxs","MonthCalendarWeekRow","props","dates","isWeekdayHeader","events","eventPosition","onPressEvent","onPressCell","
|
|
1
|
+
{"version":3,"names":["dayjs","en","StyleSheet","useWindowDimensions","Text","TouchableOpacity","View","CELL_BORDER_WIDTH","EVENT_GAP","jsx","_jsx","jsxs","_jsxs","MonthCalendarWeekRow","props","dates","isWeekdayHeader","events","eventPosition","onPressEvent","onPressCell","onLongPressCell","delayLongPress","dayCellContainerStyle","dayCellTextStyle","locale","weekdayCellContainerStyle","weekdayCellTextStyle","weekRowMinHeight","todayCellTextStyle","eventHeight","width","screenWidth","dateColumnWidth","weekId","format","resetResource","style","styles","container","children","map","djs","dateIndex","text","filteredEvents","filter","event","startDjs","start","isBefore","sort","a","b","aStartDjs","bStartDjs","aEndDjs","end","bEndDjs","aDiffDays","diff","bDiffDays","rows","rowNums","getRowNums","date","toDate","rowsLength","length","eventIndex","ii","includes","push","dayCellCountainer","minHeight","undefined","zIndex","onPress","onLongPress","dayCellInner","day","dayCellLabel","dayCellText","isSame","eventRow","rowIndex","height","marginBottom","rawStartDjs","endDjs","diffDays","startOf","isPrevDateEvent","isLastRow","startDate","days","rowNum","backgroundColor","borderColor","prevDateEvent","lastRowEvent","numberOfLines","ellipsizeMode","eventTitle","color","title","id","get","create","display","flexDirection","flex","borderRightWidth","borderBottomWidth","position","top","left","right","bottom","paddingVertical","paddingHorizontal","textAlign","fontSize","borderWidth","borderRadius","alignItems","boxShadow","marginTop","marginLeft","borderTopStartRadius","borderBottomStartRadius"],"sourceRoot":"../../../../../src","sources":["calendar/month-calendar/view/MonthCalendarWeekRow.tsx"],"mappings":"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","ignoreList":[]}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { type ViewStyle } from 'react-native';
|
|
2
|
-
import type { CalendarEvent, WeekStartsOn } from '../../types/month-calendar';
|
|
1
|
+
import { type ViewStyle, type TextStyle } from 'react-native';
|
|
2
|
+
import type { CalendarEvent, WeekdayNum, WeekStartsOn } from '../../types/month-calendar';
|
|
3
3
|
export declare const MonthCalendar: (props: {
|
|
4
4
|
defaultDate: Date;
|
|
5
5
|
weekStartsOn?: WeekStartsOn;
|
|
@@ -7,8 +7,17 @@ export declare const MonthCalendar: (props: {
|
|
|
7
7
|
events: CalendarEvent[];
|
|
8
8
|
onPressEvent?: (event: CalendarEvent) => void;
|
|
9
9
|
onPressCell?: (date: Date) => void;
|
|
10
|
+
onLongPressCell?: (date: Date) => void;
|
|
11
|
+
delayLongPress?: number;
|
|
10
12
|
onRefresh?: () => void;
|
|
11
13
|
refreshing?: boolean;
|
|
12
|
-
|
|
14
|
+
dayCellContainerStyle?: (date: Date) => ViewStyle;
|
|
15
|
+
dayCellTextStyle?: (date: Date) => TextStyle;
|
|
16
|
+
locale?: ILocale;
|
|
17
|
+
weekdayCellContainerStyle?: (weekDayNum: WeekdayNum) => ViewStyle;
|
|
18
|
+
weekdayCellTextStyle?: (weekDayNum: WeekdayNum) => TextStyle;
|
|
19
|
+
todayCellTextStyle?: TextStyle;
|
|
20
|
+
hiddenMonth?: boolean;
|
|
21
|
+
monthFormat?: string;
|
|
13
22
|
}) => import("react/jsx-runtime").JSX.Element;
|
|
14
23
|
//# sourceMappingURL=MonthCalendar.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MonthCalendar.d.ts","sourceRoot":"","sources":["../../../../../src/calendar/month-calendar/MonthCalendar.tsx"],"names":[],"mappings":"AAAA,OAAO,
|
|
1
|
+
{"version":3,"file":"MonthCalendar.d.ts","sourceRoot":"","sources":["../../../../../src/calendar/month-calendar/MonthCalendar.tsx"],"names":[],"mappings":"AAAA,OAAO,EAGL,KAAK,SAAS,EACd,KAAK,SAAS,EACf,MAAM,cAAc,CAAC;AAGtB,OAAO,KAAK,EACV,aAAa,EACb,UAAU,EACV,YAAY,EACb,MAAM,4BAA4B,CAAC;AAKpC,eAAO,MAAM,aAAa,GAAI,OAAO;IACnC,WAAW,EAAE,IAAI,CAAC;IAClB,YAAY,CAAC,EAAE,YAAY,CAAC;IAC5B,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,IAAI,CAAC;IACpC,MAAM,EAAE,aAAa,EAAE,CAAC;IACxB,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE,aAAa,KAAK,IAAI,CAAC;IAC9C,WAAW,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,IAAI,CAAC;IACnC,eAAe,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,IAAI,CAAC;IACvC,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;IACvB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,qBAAqB,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,SAAS,CAAC;IAClD,gBAAgB,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,SAAS,CAAC;IAC7C,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,yBAAyB,CAAC,EAAE,CAAC,UAAU,EAAE,UAAU,KAAK,SAAS,CAAC;IAClE,oBAAoB,CAAC,EAAE,CAAC,UAAU,EAAE,UAAU,KAAK,SAAS,CAAC;IAC7D,kBAAkB,CAAC,EAAE,SAAS,CAAC;IAC/B,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB,4CAuGA,CAAC"}
|
|
@@ -1,14 +1,23 @@
|
|
|
1
|
-
import { type ViewStyle } from 'react-native';
|
|
2
|
-
import type { CalendarEvent, WeekStartsOn } from '../../../types/month-calendar';
|
|
1
|
+
import { type TextStyle, type ViewStyle } from 'react-native';
|
|
2
|
+
import type { CalendarEvent, WeekdayNum, WeekStartsOn } from '../../../types/month-calendar';
|
|
3
3
|
export declare const MonthCalendarViewItem: (props: {
|
|
4
4
|
month: string;
|
|
5
5
|
weekStartsOn: WeekStartsOn;
|
|
6
6
|
events: CalendarEvent[];
|
|
7
7
|
onPressEvent?: (event: CalendarEvent) => void;
|
|
8
8
|
onPressCell?: (date: Date) => void;
|
|
9
|
+
onLongPressCell?: (date: Date) => void;
|
|
10
|
+
delayLongPress?: number;
|
|
9
11
|
flatListIndex: number;
|
|
10
12
|
onRefresh?: () => void;
|
|
11
13
|
refreshing?: boolean;
|
|
12
|
-
|
|
14
|
+
dayCellContainerStyle?: (date: Date) => ViewStyle;
|
|
15
|
+
dayCellTextStyle?: (date: Date) => TextStyle;
|
|
16
|
+
locale?: ILocale;
|
|
17
|
+
weekdayCellContainerStyle?: (weekDayNum: WeekdayNum) => ViewStyle;
|
|
18
|
+
weekdayCellTextStyle?: (weekDayNum: WeekdayNum) => TextStyle;
|
|
19
|
+
todayCellTextStyle?: TextStyle;
|
|
20
|
+
hiddenMonth?: boolean;
|
|
21
|
+
monthFormat?: string;
|
|
13
22
|
}) => import("react/jsx-runtime").JSX.Element;
|
|
14
23
|
//# sourceMappingURL=MonthCalendarViewItem.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MonthCalendarViewItem.d.ts","sourceRoot":"","sources":["../../../../../../src/calendar/month-calendar/view/MonthCalendarViewItem.tsx"],"names":[],"mappings":"AACA,OAAO,
|
|
1
|
+
{"version":3,"file":"MonthCalendarViewItem.d.ts","sourceRoot":"","sources":["../../../../../../src/calendar/month-calendar/view/MonthCalendarViewItem.tsx"],"names":[],"mappings":"AACA,OAAO,EAOL,KAAK,SAAS,EACd,KAAK,SAAS,EACf,MAAM,cAAc,CAAC;AAEtB,OAAO,KAAK,EACV,aAAa,EACb,UAAU,EACV,YAAY,EACb,MAAM,+BAA+B,CAAC;AAQvC,eAAO,MAAM,qBAAqB,GAAI,OAAO;IAC3C,KAAK,EAAE,MAAM,CAAC;IACd,YAAY,EAAE,YAAY,CAAC;IAC3B,MAAM,EAAE,aAAa,EAAE,CAAC;IACxB,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE,aAAa,KAAK,IAAI,CAAC;IAC9C,WAAW,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,IAAI,CAAC;IACnC,eAAe,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,IAAI,CAAC;IACvC,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,aAAa,EAAE,MAAM,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;IACvB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,qBAAqB,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,SAAS,CAAC;IAClD,gBAAgB,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,SAAS,CAAC;IAC7C,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,yBAAyB,CAAC,EAAE,CAAC,UAAU,EAAE,UAAU,KAAK,SAAS,CAAC;IAClE,oBAAoB,CAAC,EAAE,CAAC,UAAU,EAAE,UAAU,KAAK,SAAS,CAAC;IAC7D,kBAAkB,CAAC,EAAE,SAAS,CAAC;IAC/B,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB,4CA+GA,CAAC"}
|
|
@@ -1,7 +1,8 @@
|
|
|
1
1
|
import dayjs from 'dayjs';
|
|
2
2
|
import { type ViewStyle } from 'react-native';
|
|
3
|
-
import type { CalendarEvent } from '../../../types/month-calendar';
|
|
3
|
+
import type { CalendarEvent, WeekdayNum } from '../../../types/month-calendar';
|
|
4
4
|
import type MonthCalendarEventPosition from '../../../utils/month-calendar-event-position';
|
|
5
|
+
import type { TextStyle } from 'react-native';
|
|
5
6
|
export declare const MonthCalendarWeekRow: (props: {
|
|
6
7
|
dates: dayjs.Dayjs[];
|
|
7
8
|
isWeekdayHeader?: boolean;
|
|
@@ -9,6 +10,14 @@ export declare const MonthCalendarWeekRow: (props: {
|
|
|
9
10
|
eventPosition?: MonthCalendarEventPosition;
|
|
10
11
|
onPressEvent?: (event: CalendarEvent) => void;
|
|
11
12
|
onPressCell?: (date: Date) => void;
|
|
12
|
-
|
|
13
|
+
onLongPressCell?: (date: Date) => void;
|
|
14
|
+
delayLongPress?: number;
|
|
15
|
+
dayCellContainerStyle?: (date: Date) => ViewStyle;
|
|
16
|
+
dayCellTextStyle?: (date: Date) => TextStyle;
|
|
17
|
+
locale?: ILocale;
|
|
18
|
+
weekdayCellContainerStyle?: (weekDayNum: WeekdayNum) => ViewStyle;
|
|
19
|
+
weekdayCellTextStyle?: (weekDayNum: WeekdayNum) => TextStyle;
|
|
20
|
+
weekRowMinHeight?: number;
|
|
21
|
+
todayCellTextStyle?: TextStyle;
|
|
13
22
|
}) => import("react/jsx-runtime").JSX.Element;
|
|
14
23
|
//# sourceMappingURL=MonthCalendarWeekRow.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MonthCalendarWeekRow.d.ts","sourceRoot":"","sources":["../../../../../../src/calendar/month-calendar/view/MonthCalendarWeekRow.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"MonthCalendarWeekRow.d.ts","sourceRoot":"","sources":["../../../../../../src/calendar/month-calendar/view/MonthCalendarWeekRow.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,EAAgC,KAAK,SAAS,EAAE,MAAM,cAAc,CAAC;AAC5E,OAAO,KAAK,EAAE,aAAa,EAAE,UAAU,EAAE,MAAM,+BAA+B,CAAC;AAC/E,OAAO,KAAK,0BAA0B,MAAM,8CAA8C,CAAC;AAE3F,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAE9C,eAAO,MAAM,oBAAoB,GAAI,OAAO;IAC1C,KAAK,EAAE,KAAK,CAAC,KAAK,EAAE,CAAC;IACrB,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,MAAM,CAAC,EAAE,aAAa,EAAE,CAAC;IACzB,aAAa,CAAC,EAAE,0BAA0B,CAAC;IAC3C,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE,aAAa,KAAK,IAAI,CAAC;IAC9C,WAAW,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,IAAI,CAAC;IACnC,eAAe,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,IAAI,CAAC;IACvC,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,qBAAqB,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,SAAS,CAAC;IAClD,gBAAgB,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,SAAS,CAAC;IAC7C,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,yBAAyB,CAAC,EAAE,CAAC,UAAU,EAAE,UAAU,KAAK,SAAS,CAAC;IAClE,oBAAoB,CAAC,EAAE,CAAC,UAAU,EAAE,UAAU,KAAK,SAAS,CAAC;IAC7D,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,kBAAkB,CAAC,EAAE,SAAS,CAAC;CAChC,4CAuLA,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"month-calendar.d.ts","sourceRoot":"","sources":["../../../../src/types/month-calendar.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,YAAY,GAAG,CAAC,GAAG,CAAC,CAAC;AAEjC,MAAM,MAAM,aAAa,GAAG;IAC1B,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,IAAI,CAAC;IACZ,GAAG,EAAE,IAAI,CAAC;IACV,eAAe,EAAE,MAAM,CAAC;IACxB,WAAW,EAAE,MAAM,CAAC;IACpB,KAAK,EAAE,MAAM,CAAC;CACf,CAAC"}
|
|
1
|
+
{"version":3,"file":"month-calendar.d.ts","sourceRoot":"","sources":["../../../../src/types/month-calendar.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,YAAY,GAAG,CAAC,GAAG,CAAC,CAAC;AAEjC,MAAM,MAAM,aAAa,GAAG;IAC1B,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,IAAI,CAAC;IACZ,GAAG,EAAE,IAAI,CAAC;IACV,eAAe,EAAE,MAAM,CAAC;IACxB,WAAW,EAAE,MAAM,CAAC;IACpB,KAAK,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,MAAM,MAAM,UAAU,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC"}
|
package/package.json
CHANGED
|
@@ -1,7 +1,16 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import {
|
|
2
|
+
useWindowDimensions,
|
|
3
|
+
FlatList,
|
|
4
|
+
type ViewStyle,
|
|
5
|
+
type TextStyle,
|
|
6
|
+
} from 'react-native';
|
|
2
7
|
import dayjs from 'dayjs';
|
|
3
8
|
import { useState } from 'react';
|
|
4
|
-
import type {
|
|
9
|
+
import type {
|
|
10
|
+
CalendarEvent,
|
|
11
|
+
WeekdayNum,
|
|
12
|
+
WeekStartsOn,
|
|
13
|
+
} from '../../types/month-calendar';
|
|
5
14
|
import { MonthCalendarViewItem } from './view/MonthCalendarViewItem';
|
|
6
15
|
|
|
7
16
|
const HALF_PANEL_LENGTH = 120; // 10 years
|
|
@@ -13,9 +22,18 @@ export const MonthCalendar = (props: {
|
|
|
13
22
|
events: CalendarEvent[];
|
|
14
23
|
onPressEvent?: (event: CalendarEvent) => void;
|
|
15
24
|
onPressCell?: (date: Date) => void;
|
|
25
|
+
onLongPressCell?: (date: Date) => void;
|
|
26
|
+
delayLongPress?: number;
|
|
16
27
|
onRefresh?: () => void;
|
|
17
28
|
refreshing?: boolean;
|
|
18
|
-
|
|
29
|
+
dayCellContainerStyle?: (date: Date) => ViewStyle;
|
|
30
|
+
dayCellTextStyle?: (date: Date) => TextStyle;
|
|
31
|
+
locale?: ILocale;
|
|
32
|
+
weekdayCellContainerStyle?: (weekDayNum: WeekdayNum) => ViewStyle;
|
|
33
|
+
weekdayCellTextStyle?: (weekDayNum: WeekdayNum) => TextStyle;
|
|
34
|
+
todayCellTextStyle?: TextStyle;
|
|
35
|
+
hiddenMonth?: boolean;
|
|
36
|
+
monthFormat?: string;
|
|
19
37
|
}) => {
|
|
20
38
|
const {
|
|
21
39
|
defaultDate,
|
|
@@ -24,9 +42,18 @@ export const MonthCalendar = (props: {
|
|
|
24
42
|
events,
|
|
25
43
|
onPressEvent,
|
|
26
44
|
onPressCell,
|
|
45
|
+
onLongPressCell,
|
|
46
|
+
delayLongPress,
|
|
27
47
|
onRefresh,
|
|
28
48
|
refreshing,
|
|
29
|
-
|
|
49
|
+
dayCellContainerStyle,
|
|
50
|
+
dayCellTextStyle,
|
|
51
|
+
locale,
|
|
52
|
+
weekdayCellContainerStyle,
|
|
53
|
+
weekdayCellTextStyle,
|
|
54
|
+
todayCellTextStyle,
|
|
55
|
+
hiddenMonth,
|
|
56
|
+
monthFormat,
|
|
30
57
|
} = props;
|
|
31
58
|
const [dateState] = useState(defaultDate);
|
|
32
59
|
const [_activeIndex, setActiveIndex] = useState(HALF_PANEL_LENGTH);
|
|
@@ -86,10 +113,19 @@ export const MonthCalendar = (props: {
|
|
|
86
113
|
events={events}
|
|
87
114
|
onPressEvent={onPressEvent}
|
|
88
115
|
onPressCell={onPressCell}
|
|
116
|
+
onLongPressCell={onLongPressCell}
|
|
117
|
+
delayLongPress={delayLongPress}
|
|
89
118
|
flatListIndex={index}
|
|
90
119
|
onRefresh={onRefresh}
|
|
91
120
|
refreshing={refreshing}
|
|
92
|
-
|
|
121
|
+
dayCellContainerStyle={dayCellContainerStyle}
|
|
122
|
+
dayCellTextStyle={dayCellTextStyle}
|
|
123
|
+
locale={locale}
|
|
124
|
+
weekdayCellContainerStyle={weekdayCellContainerStyle}
|
|
125
|
+
weekdayCellTextStyle={weekdayCellTextStyle}
|
|
126
|
+
todayCellTextStyle={todayCellTextStyle}
|
|
127
|
+
hiddenMonth={hiddenMonth}
|
|
128
|
+
monthFormat={monthFormat}
|
|
93
129
|
/>
|
|
94
130
|
);
|
|
95
131
|
}}
|
|
@@ -5,11 +5,14 @@ import {
|
|
|
5
5
|
Text,
|
|
6
6
|
View,
|
|
7
7
|
useWindowDimensions,
|
|
8
|
+
type LayoutChangeEvent,
|
|
9
|
+
type TextStyle,
|
|
8
10
|
type ViewStyle,
|
|
9
11
|
} from 'react-native';
|
|
10
12
|
import { MonthCalendarWeekRow } from './MonthCalendarWeekRow';
|
|
11
13
|
import type {
|
|
12
14
|
CalendarEvent,
|
|
15
|
+
WeekdayNum,
|
|
13
16
|
WeekStartsOn,
|
|
14
17
|
} from '../../../types/month-calendar';
|
|
15
18
|
import MonthCalendarEventPosition from '../../../utils/month-calendar-event-position';
|
|
@@ -17,6 +20,7 @@ import { monthlyEndDate, monthlyStartDate } from '../../../utils/functions';
|
|
|
17
20
|
import { useEvents } from '../logic/useEvents';
|
|
18
21
|
import { CELL_BORDER_WIDTH } from '../../../constants/size';
|
|
19
22
|
import { RefreshControl } from 'react-native';
|
|
23
|
+
import { useCallback, useMemo, useState } from 'react';
|
|
20
24
|
|
|
21
25
|
export const MonthCalendarViewItem = (props: {
|
|
22
26
|
month: string;
|
|
@@ -24,10 +28,19 @@ export const MonthCalendarViewItem = (props: {
|
|
|
24
28
|
events: CalendarEvent[];
|
|
25
29
|
onPressEvent?: (event: CalendarEvent) => void;
|
|
26
30
|
onPressCell?: (date: Date) => void;
|
|
31
|
+
onLongPressCell?: (date: Date) => void;
|
|
32
|
+
delayLongPress?: number;
|
|
27
33
|
flatListIndex: number;
|
|
28
34
|
onRefresh?: () => void;
|
|
29
35
|
refreshing?: boolean;
|
|
30
|
-
|
|
36
|
+
dayCellContainerStyle?: (date: Date) => ViewStyle;
|
|
37
|
+
dayCellTextStyle?: (date: Date) => TextStyle;
|
|
38
|
+
locale?: ILocale;
|
|
39
|
+
weekdayCellContainerStyle?: (weekDayNum: WeekdayNum) => ViewStyle;
|
|
40
|
+
weekdayCellTextStyle?: (weekDayNum: WeekdayNum) => TextStyle;
|
|
41
|
+
todayCellTextStyle?: TextStyle;
|
|
42
|
+
hiddenMonth?: boolean;
|
|
43
|
+
monthFormat?: string;
|
|
31
44
|
}) => {
|
|
32
45
|
const {
|
|
33
46
|
month,
|
|
@@ -35,14 +48,22 @@ export const MonthCalendarViewItem = (props: {
|
|
|
35
48
|
events,
|
|
36
49
|
onPressEvent,
|
|
37
50
|
onPressCell,
|
|
51
|
+
onLongPressCell,
|
|
52
|
+
delayLongPress,
|
|
38
53
|
flatListIndex,
|
|
39
54
|
onRefresh,
|
|
40
55
|
refreshing,
|
|
41
|
-
|
|
56
|
+
dayCellContainerStyle,
|
|
57
|
+
dayCellTextStyle,
|
|
58
|
+
locale,
|
|
59
|
+
weekdayCellContainerStyle,
|
|
60
|
+
weekdayCellTextStyle,
|
|
61
|
+
todayCellTextStyle,
|
|
62
|
+
hiddenMonth,
|
|
63
|
+
monthFormat = 'YYYY/MM',
|
|
42
64
|
} = props;
|
|
43
65
|
const { width } = useWindowDimensions();
|
|
44
66
|
const eventPosition = new MonthCalendarEventPosition();
|
|
45
|
-
|
|
46
67
|
const date = new Date(month);
|
|
47
68
|
const dateDjs = dayjs(date);
|
|
48
69
|
const startDate = monthlyStartDate({ date, weekStartsOn });
|
|
@@ -60,18 +81,48 @@ export const MonthCalendarViewItem = (props: {
|
|
|
60
81
|
|
|
61
82
|
const { eventsGroupByWeekId } = useEvents({ events, weekStartsOn });
|
|
62
83
|
|
|
84
|
+
const [bodyHeight, setBodyHeight] = useState(0);
|
|
85
|
+
const onLayoutBody = useCallback((e: LayoutChangeEvent) => {
|
|
86
|
+
setBodyHeight(e.nativeEvent.layout.height);
|
|
87
|
+
}, []);
|
|
88
|
+
|
|
89
|
+
const [monthRowHeight, setMonthRowHeight] = useState(0);
|
|
90
|
+
const onLayoutMonthRow = useCallback((e: LayoutChangeEvent) => {
|
|
91
|
+
setMonthRowHeight(e.nativeEvent.layout.height);
|
|
92
|
+
}, []);
|
|
93
|
+
|
|
94
|
+
const [weekdayRowHeight, setWeekdayRowHeight] = useState(0);
|
|
95
|
+
const onLayoutWeekdayRow = useCallback((e: LayoutChangeEvent) => {
|
|
96
|
+
setWeekdayRowHeight(e.nativeEvent.layout.height);
|
|
97
|
+
}, []);
|
|
98
|
+
|
|
99
|
+
const weekRowMinHeight = useMemo(() => {
|
|
100
|
+
return (bodyHeight - monthRowHeight - weekdayRowHeight) / weeks.length;
|
|
101
|
+
}, [bodyHeight, monthRowHeight, weekdayRowHeight, weeks.length]);
|
|
102
|
+
|
|
63
103
|
return (
|
|
64
104
|
<ScrollView
|
|
65
105
|
style={[styles.container, { width, zIndex: flatListIndex }]}
|
|
66
106
|
refreshControl={
|
|
67
107
|
<RefreshControl refreshing={!!refreshing} onRefresh={onRefresh} />
|
|
68
108
|
}
|
|
109
|
+
onLayout={onLayoutBody}
|
|
69
110
|
>
|
|
70
|
-
|
|
71
|
-
<
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
111
|
+
{hiddenMonth ? (
|
|
112
|
+
<View style={styles.blankMonthContainer} />
|
|
113
|
+
) : (
|
|
114
|
+
<View style={styles.monthContainer} onLayout={onLayoutMonthRow}>
|
|
115
|
+
<Text style={styles.monthText}>{dateDjs.format(monthFormat)}</Text>
|
|
116
|
+
</View>
|
|
117
|
+
)}
|
|
118
|
+
<View onLayout={onLayoutWeekdayRow}>
|
|
119
|
+
<MonthCalendarWeekRow
|
|
120
|
+
dates={weeks[0] ?? []}
|
|
121
|
+
isWeekdayHeader={true}
|
|
122
|
+
locale={locale}
|
|
123
|
+
weekdayCellContainerStyle={weekdayCellContainerStyle}
|
|
124
|
+
weekdayCellTextStyle={weekdayCellTextStyle}
|
|
125
|
+
/>
|
|
75
126
|
</View>
|
|
76
127
|
<View>
|
|
77
128
|
{weeks.map((week, index) => {
|
|
@@ -89,7 +140,12 @@ export const MonthCalendarViewItem = (props: {
|
|
|
89
140
|
eventPosition={eventPosition}
|
|
90
141
|
onPressEvent={onPressEvent}
|
|
91
142
|
onPressCell={onPressCell}
|
|
92
|
-
|
|
143
|
+
onLongPressCell={onLongPressCell}
|
|
144
|
+
delayLongPress={delayLongPress}
|
|
145
|
+
dayCellContainerStyle={dayCellContainerStyle}
|
|
146
|
+
dayCellTextStyle={dayCellTextStyle}
|
|
147
|
+
weekRowMinHeight={weekRowMinHeight}
|
|
148
|
+
todayCellTextStyle={todayCellTextStyle}
|
|
93
149
|
/>
|
|
94
150
|
);
|
|
95
151
|
})}
|
|
@@ -104,6 +160,10 @@ const styles = StyleSheet.create({
|
|
|
104
160
|
borderColor: 'lightslategrey',
|
|
105
161
|
alignSelf: 'flex-start',
|
|
106
162
|
},
|
|
163
|
+
blankMonthContainer: {
|
|
164
|
+
borderWidth: CELL_BORDER_WIDTH,
|
|
165
|
+
borderColor: 'lightslategrey',
|
|
166
|
+
},
|
|
107
167
|
monthContainer: {
|
|
108
168
|
padding: 2,
|
|
109
169
|
borderWidth: CELL_BORDER_WIDTH,
|
|
@@ -1,9 +1,11 @@
|
|
|
1
1
|
import dayjs from 'dayjs';
|
|
2
|
+
import en from 'dayjs/locale/en';
|
|
2
3
|
import { StyleSheet, useWindowDimensions } from 'react-native';
|
|
3
4
|
import { Text, TouchableOpacity, View, type ViewStyle } from 'react-native';
|
|
4
|
-
import type { CalendarEvent } from '../../../types/month-calendar';
|
|
5
|
+
import type { CalendarEvent, WeekdayNum } from '../../../types/month-calendar';
|
|
5
6
|
import type MonthCalendarEventPosition from '../../../utils/month-calendar-event-position';
|
|
6
7
|
import { CELL_BORDER_WIDTH, EVENT_GAP } from '../../../constants/size';
|
|
8
|
+
import type { TextStyle } from 'react-native';
|
|
7
9
|
|
|
8
10
|
export const MonthCalendarWeekRow = (props: {
|
|
9
11
|
dates: dayjs.Dayjs[];
|
|
@@ -12,7 +14,15 @@ export const MonthCalendarWeekRow = (props: {
|
|
|
12
14
|
eventPosition?: MonthCalendarEventPosition;
|
|
13
15
|
onPressEvent?: (event: CalendarEvent) => void;
|
|
14
16
|
onPressCell?: (date: Date) => void;
|
|
15
|
-
|
|
17
|
+
onLongPressCell?: (date: Date) => void;
|
|
18
|
+
delayLongPress?: number;
|
|
19
|
+
dayCellContainerStyle?: (date: Date) => ViewStyle;
|
|
20
|
+
dayCellTextStyle?: (date: Date) => TextStyle;
|
|
21
|
+
locale?: ILocale;
|
|
22
|
+
weekdayCellContainerStyle?: (weekDayNum: WeekdayNum) => ViewStyle;
|
|
23
|
+
weekdayCellTextStyle?: (weekDayNum: WeekdayNum) => TextStyle;
|
|
24
|
+
weekRowMinHeight?: number;
|
|
25
|
+
todayCellTextStyle?: TextStyle;
|
|
16
26
|
}) => {
|
|
17
27
|
const {
|
|
18
28
|
dates,
|
|
@@ -21,7 +31,15 @@ export const MonthCalendarWeekRow = (props: {
|
|
|
21
31
|
eventPosition,
|
|
22
32
|
onPressEvent,
|
|
23
33
|
onPressCell,
|
|
24
|
-
|
|
34
|
+
onLongPressCell,
|
|
35
|
+
delayLongPress = 500,
|
|
36
|
+
dayCellContainerStyle,
|
|
37
|
+
dayCellTextStyle,
|
|
38
|
+
locale = en,
|
|
39
|
+
weekdayCellContainerStyle,
|
|
40
|
+
weekdayCellTextStyle,
|
|
41
|
+
weekRowMinHeight,
|
|
42
|
+
todayCellTextStyle,
|
|
25
43
|
} = props;
|
|
26
44
|
const eventHeight = 26;
|
|
27
45
|
const { width: screenWidth } = useWindowDimensions();
|
|
@@ -34,25 +52,29 @@ export const MonthCalendarWeekRow = (props: {
|
|
|
34
52
|
return (
|
|
35
53
|
<View style={styles.container}>
|
|
36
54
|
{dates.map((djs, dateIndex) => {
|
|
37
|
-
const text = isWeekdayHeader
|
|
38
|
-
|
|
39
|
-
.
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
(
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
55
|
+
const text = isWeekdayHeader
|
|
56
|
+
? djs.locale(locale).format('ddd')
|
|
57
|
+
: djs.format('D');
|
|
58
|
+
const filteredEvents = isWeekdayHeader
|
|
59
|
+
? []
|
|
60
|
+
: events
|
|
61
|
+
.filter((event) => {
|
|
62
|
+
const startDjs = dayjs(event.start);
|
|
63
|
+
return (
|
|
64
|
+
startDjs.format('YYYY-MM-DD') === djs.format('YYYY-MM-DD') ||
|
|
65
|
+
(dateIndex === 0 && startDjs.isBefore(djs))
|
|
66
|
+
);
|
|
67
|
+
})
|
|
68
|
+
.sort((a, b) => {
|
|
69
|
+
const aStartDjs = dateIndex === 0 ? djs : dayjs(a.start);
|
|
70
|
+
const bStartDjs = dateIndex === 0 ? djs : dayjs(b.start);
|
|
71
|
+
const aEndDjs = dayjs(a.end);
|
|
72
|
+
const bEndDjs = dayjs(b.end);
|
|
73
|
+
const aDiffDays = aEndDjs.diff(aStartDjs, 'day');
|
|
74
|
+
const bDiffDays = bEndDjs.diff(bStartDjs, 'day');
|
|
53
75
|
|
|
54
|
-
|
|
55
|
-
|
|
76
|
+
return bDiffDays - aDiffDays;
|
|
77
|
+
});
|
|
56
78
|
|
|
57
79
|
const rows: (CalendarEvent | number)[] = [];
|
|
58
80
|
if (weekId && eventPosition) {
|
|
@@ -79,16 +101,39 @@ export const MonthCalendarWeekRow = (props: {
|
|
|
79
101
|
key={isWeekdayHeader ? djs.get('d') : djs.get('date')}
|
|
80
102
|
style={[
|
|
81
103
|
styles.dayCellCountainer,
|
|
82
|
-
|
|
104
|
+
{ minHeight: isWeekdayHeader ? undefined : weekRowMinHeight },
|
|
83
105
|
{ zIndex: 7 - dateIndex },
|
|
84
106
|
]}
|
|
85
107
|
onPress={() => {
|
|
86
108
|
onPressCell?.(djs.toDate());
|
|
87
109
|
}}
|
|
110
|
+
onLongPress={() => {
|
|
111
|
+
onLongPressCell?.(djs.toDate());
|
|
112
|
+
}}
|
|
113
|
+
delayLongPress={delayLongPress}
|
|
88
114
|
>
|
|
89
|
-
<View
|
|
115
|
+
<View
|
|
116
|
+
style={[
|
|
117
|
+
styles.dayCellInner,
|
|
118
|
+
isWeekdayHeader
|
|
119
|
+
? weekdayCellContainerStyle?.(djs.day())
|
|
120
|
+
: dayCellContainerStyle?.(djs.toDate()),
|
|
121
|
+
]}
|
|
122
|
+
/>
|
|
90
123
|
<View style={styles.dayCellLabel}>
|
|
91
|
-
<Text
|
|
124
|
+
<Text
|
|
125
|
+
style={[
|
|
126
|
+
styles.dayCellText,
|
|
127
|
+
isWeekdayHeader
|
|
128
|
+
? weekdayCellTextStyle?.(djs.day())
|
|
129
|
+
: dayCellTextStyle?.(djs.toDate()),
|
|
130
|
+
!isWeekdayHeader && dayjs(djs).isSame(dayjs(), 'day')
|
|
131
|
+
? todayCellTextStyle
|
|
132
|
+
: {},
|
|
133
|
+
]}
|
|
134
|
+
>
|
|
135
|
+
{text}
|
|
136
|
+
</Text>
|
|
92
137
|
</View>
|
|
93
138
|
{rows.map((eventRow, rowIndex) => {
|
|
94
139
|
if (typeof eventRow === 'number') {
|
|
@@ -172,7 +217,6 @@ const styles = StyleSheet.create({
|
|
|
172
217
|
backgroundColor: 'white',
|
|
173
218
|
},
|
|
174
219
|
dayCellCountainer: {
|
|
175
|
-
minHeight: 80,
|
|
176
220
|
flex: 1,
|
|
177
221
|
borderRightWidth: CELL_BORDER_WIDTH,
|
|
178
222
|
borderBottomWidth: CELL_BORDER_WIDTH,
|