Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Added renderDay #375

Open
wants to merge 15 commits into
base: master
Choose a base branch
from
Next Next commit
added renderDay
  • Loading branch information
andrewmcd1 committed Apr 18, 2024
commit 9be81442500fc9973af3349d4198e5904e6fdb5c
29 changes: 16 additions & 13 deletions CalendarPicker/Day.js
Original file line number Diff line number Diff line change
@@ -41,12 +41,21 @@ export default function Day(props) {
disabledDatesTextStyle,
minRangeDuration,
maxRangeDuration,
enableDateChange
enableDateChange,
renderDay
andrewmcd1 marked this conversation as resolved.
Show resolved Hide resolved
} = props;

const thisDay = new Date(year, month, day, 12);
const today = new Date();

const DayComponent = ({ style }) => {
andrewmcd1 marked this conversation as resolved.
Show resolved Hide resolved
if (renderDay) {
return renderDay({ year, month, day, date: thisDay.format('YYYY-MM-DD'), style });
andrewmcd1 marked this conversation as resolved.
Show resolved Hide resolved
}

return <Text style={style}>{day}</Text>;
};

let dateOutOfRange;
let computedSelectedDayStyle = styles.dayButton; // may be overridden depending on state
let selectedDayTextStyle = {};
@@ -193,13 +202,11 @@ export default function Day(props) {
return (
<View style={[styles.dayWrapper, custom.containerStyle]}>
<View style={[custom.style, computedSelectedDayStyle, selectedDayStyle]}>
<Text style={[styles.dayLabel, textStyle,
styles.disabledText, disabledDatesTextStyle,
styles.selectedDisabledText, selectedDisabledDatesTextStyle,
<DayComponent style={[styles.dayLabel, textStyle,
styles.disabledText, disabledDatesTextStyle,
styles.selectedDisabledText, selectedDisabledDatesTextStyle,
overrideOutOfRangeTextStyle
]}>
{day}
</Text>
]} />
</View>
</View>
);
@@ -210,9 +217,7 @@ export default function Day(props) {
disabled={!enableDateChange}
style={[custom.style, computedSelectedDayStyle, selectedDayStyle]}
onPress={() => onPressDay({ year, month, day })}>
<Text style={[styles.dayLabel, textStyle, custom.textStyle, selectedDayTextStyle]}>
{day}
</Text>
<DayComponent style={[styles.dayLabel, textStyle, custom.textStyle, selectedDayTextStyle]} />
</TouchableOpacity>
</View>
);
@@ -229,9 +234,7 @@ export default function Day(props) {
return (
<View style={[styles.dayWrapper, custom.containerStyle]}>
<View style={[styles.dayButton, custom.style]}>
<Text style={[textStyle, styles.disabledText, disabledDatesTextStyle, custom.textStyle]}>
{day}
</Text>
<DayComponent style={[textStyle, styles.disabledText, disabledDatesTextStyle, custom.textStyle]} />
</View>
</View>
);
1 change: 1 addition & 0 deletions CalendarPicker/index.js
Original file line number Diff line number Diff line change
@@ -415,6 +415,7 @@ export default class CalendarPicker extends Component {
selectedRangeEndStyle: this.props.selectedRangeEndStyle,
customDatesStyles: this.props.customDatesStyles,
fontScaling: this.props.fontScaling,
renderDay: this.props.renderDay
};
}