diff --git a/node_modules/react-native-calendars/src/calendar/day/period/index.js b/node_modules/react-native-calendars/src/calendar/day/period/index.js index f27db0e..434f414 100644 --- a/node_modules/react-native-calendars/src/calendar/day/period/index.js +++ b/node_modules/react-native-calendars/src/calendar/day/period/index.js @@ -87,21 +87,19 @@ const PeriodDay = (props) => { return textStyle; }, [marking, state]); const fillerStyles = useMemo(() => { - const leftFillerStyle = { backgroundColor: undefined }; - const rightFillerStyle = { backgroundColor: undefined }; + const leftFillerStyle = { backgroundColor: marking?.disabled ? 'transparent' : 'rgb(250, 223, 194)' }; + const rightFillerStyle = { backgroundColor: marking?.disabled ? 'transparent' : 'rgb(250, 223, 194)' }; let fillerStyle = {}; const start = markingStyle.startingDay; const end = markingStyle.endingDay; - if (start && !end) { - rightFillerStyle.backgroundColor = markingStyle.startingDay?.backgroundColor; + if (start) { + leftFillerStyle.backgroundColor = markingStyle.day?.backgroundColor; } - else if (end && !start) { - leftFillerStyle.backgroundColor = markingStyle.endingDay?.backgroundColor; + if (end) { + rightFillerStyle.backgroundColor = markingStyle.day?.backgroundColor; } - else if (markingStyle.day) { - leftFillerStyle.backgroundColor = markingStyle.day?.backgroundColor; - rightFillerStyle.backgroundColor = markingStyle.day?.backgroundColor; - fillerStyle = { backgroundColor: markingStyle.day?.backgroundColor }; + if (!start && !end && markingStyle.day) { + fillerStyle = { backgroundColor: markingStyle.day?.backgroundColor }; } return { leftFillerStyle, rightFillerStyle, fillerStyle }; }, [marking]); diff --git a/node_modules/react-native-calendars/src/calendar/day/period/style.js b/node_modules/react-native-calendars/src/calendar/day/period/style.js index 51e2082..d82f5eb 100644 --- a/node_modules/react-native-calendars/src/calendar/day/period/style.js +++ b/node_modules/react-native-calendars/src/calendar/day/period/style.js @@ -10,7 +10,7 @@ export default function styleConstructor(theme = {}) { marginLeft: -1 }, base: { - width: 38, + width: FILLER_HEIGHT, height: FILLER_HEIGHT, alignItems: 'center', justifyContent: 'center' @@ -44,7 +44,10 @@ export default function styleConstructor(theme = {}) { bottom: 3 }, today: { - backgroundColor: appStyle.todayBackgroundColor + backgroundColor: appStyle.todayBackgroundColor, + borderColor: '#ED9334', + borderWidth: 1, + borderRadius: 17 }, todayText: { fontWeight: '500', diff --git a/node_modules/react-native-calendars/src/calendar/index.js b/node_modules/react-native-calendars/src/calendar/index.js index 6f46e8a..de8ce86 100644 --- a/node_modules/react-native-calendars/src/calendar/index.js +++ b/node_modules/react-native-calendars/src/calendar/index.js @@ -2,7 +2,7 @@ import PropTypes from 'prop-types'; import XDate from 'xdate'; import isEmpty from 'lodash/isEmpty'; import React, { useRef, useState, useEffect, useCallback, useMemo } from 'react'; -import { View } from 'react-native'; +import { View, PanResponder } from 'react-native'; // @ts-expect-error import GestureRecognizer, { swipeDirections } from 'react-native-swipe-gestures'; import constants from '../commons/constants'; @@ -137,6 +137,11 @@ const Calendar = (props) => { } return false; }, [currentMonth, displayLoadingIndicator, markedDates]); + const panResponder = useRef( + PanResponder.create({ + onStartShouldSetPanResponder: () => true, + }) + ).current; const renderHeader = () => { const headerProps = extractHeaderProps(props); const ref = customHeader ? undefined : header; @@ -150,7 +155,7 @@ const Calendar = (props) => { }; const gestureProps = enableSwipeMonths ? swipeProps : undefined; return ( - {renderHeader()}