From 549d08f891b1e70a53be8a93ff82aade9b1b96f6 Mon Sep 17 00:00:00 2001 From: Wojciech Maj Date: Fri, 23 Aug 2024 09:08:56 +0200 Subject: [PATCH 1/2] Bump micromatch from 4.0.5 to 4.0.7 --- yarn.lock | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/yarn.lock b/yarn.lock index 8a4175a3..f3be0f35 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1153,7 +1153,7 @@ __metadata: languageName: node linkType: hard -"braces@npm:^3.0.2": +"braces@npm:^3.0.3": version: 3.0.3 resolution: "braces@npm:3.0.3" dependencies: @@ -2177,12 +2177,12 @@ __metadata: linkType: hard "micromatch@npm:^4.0.4, micromatch@npm:^4.0.5": - version: 4.0.5 - resolution: "micromatch@npm:4.0.5" + version: 4.0.7 + resolution: "micromatch@npm:4.0.7" dependencies: - braces: "npm:^3.0.2" + braces: "npm:^3.0.3" picomatch: "npm:^2.3.1" - checksum: 10c0/3d6505b20f9fa804af5d8c596cb1c5e475b9b0cd05f652c5b56141cf941bd72adaeb7a436fda344235cef93a7f29b7472efc779fcdb83b478eab0867b95cdeff + checksum: 10c0/58fa99bc5265edec206e9163a1d2cec5fabc46a5b473c45f4a700adce88c2520456ae35f2b301e4410fb3afb27e9521fb2813f6fc96be0a48a89430e0916a772 languageName: node linkType: hard From ae9f1c1021f87bcb0d1fbd5fa3cd543e02a80cc0 Mon Sep 17 00:00:00 2001 From: Vivek <20bcs105@iiitdwd.ac.in> Date: Sat, 24 Aug 2024 20:56:18 +0530 Subject: [PATCH 2/2] active classname and now classname added --- packages/react-calendar/src/Calendar.tsx | 8 +++++++- packages/react-calendar/src/MonthView/Days.tsx | 4 ++++ packages/react-calendar/src/Tile.tsx | 2 ++ packages/react-calendar/src/TileGroup.tsx | 9 ++++++++- packages/react-calendar/src/shared/utils.ts | 7 +++++++ 5 files changed, 28 insertions(+), 2 deletions(-) diff --git a/packages/react-calendar/src/Calendar.tsx b/packages/react-calendar/src/Calendar.tsx index a9aa6745..a9bb0da9 100644 --- a/packages/react-calendar/src/Calendar.tsx +++ b/packages/react-calendar/src/Calendar.tsx @@ -1,6 +1,6 @@ 'use client'; -import { forwardRef, useCallback, useImperativeHandle, useState } from 'react'; +import { forwardRef, useCallback, useEffect, useImperativeHandle, useState } from 'react'; import clsx from 'clsx'; import Navigation from './Calendar/Navigation.js'; @@ -392,6 +392,8 @@ export type CalendarProps = { * @example ({ activeStartDate, date, view }) => view === 'month' && date.getDay() === 3 ? 'wednesday' : null */ tileClassName?: TileClassNameFunc | ClassName; + activeTileClassName?:string + nowTileClassName?:string /** * Allows to render custom content within a given calendar item (day on month view, month on year view and so on). * @@ -653,6 +655,8 @@ const Calendar: React.ForwardRefExoticComponent ( view === 'month' && date.getDay() === 3 ? 'wednesday' : null */ tileClassName?: TileClassNameFunc | ClassName; + activeClassName?:string; + nowClassName?:string; /** * Allows to render custom content within a given calendar item (day on month view, month on year view and so on). * diff --git a/packages/react-calendar/src/TileGroup.tsx b/packages/react-calendar/src/TileGroup.tsx index d5735f99..f13abb75 100644 --- a/packages/react-calendar/src/TileGroup.tsx +++ b/packages/react-calendar/src/TileGroup.tsx @@ -3,9 +3,12 @@ import Flex from './Flex.js'; import { getTileClasses } from './shared/utils.js'; import type { RangeType, Value } from './shared/types.js'; +import { useEffect } from 'react'; type TileGroupProps = { className?: string; + activeClassName?:string + nowClassName?:string count?: number; dateTransform: (point: number) => Date; dateType: RangeType; @@ -25,6 +28,8 @@ export default function TileGroup({ dateTransform, dateType, end, + activeClassName, + nowClassName, hover, offset, renderTile, @@ -36,7 +41,7 @@ export default function TileGroup({ const tiles = []; for (let point = start; point <= end; point += step) { const date = dateTransform(point); - + console.log(nowClassName,activeClassName) tiles.push( renderTile({ classes: getTileClasses({ @@ -45,6 +50,8 @@ export default function TileGroup({ hover, value, valueType, + activeClassName, + nowClassName, }), date, }), diff --git a/packages/react-calendar/src/shared/utils.ts b/packages/react-calendar/src/shared/utils.ts index 888f0418..46844e29 100644 --- a/packages/react-calendar/src/shared/utils.ts +++ b/packages/react-calendar/src/shared/utils.ts @@ -78,6 +78,8 @@ export function getTileClasses(args: { dateType?: RangeType; hover?: Date | null; value?: Value; + activeClassName?:string; + nowClassName?:string; valueType?: RangeType; }): string[] { if (!args) { @@ -110,6 +112,7 @@ export function getTileClasses(args: { if (isValueWithinRange(now, dateRange)) { classes.push(`${className}--now`); + if(args.nowClassName) classes.push(args.nowClassName) } if (!value || !isCompleteValue(value)) { @@ -132,10 +135,14 @@ export function getTileClasses(args: { if (isRangeWithinRange(valueRange, dateRange)) { classes.push(`${className}--active`); + if(args.activeClassName) classes.push(args.activeClassName) } else if (doRangesOverlap(valueRange, dateRange)) { classes.push(`${className}--hasActive`); + if(args.activeClassName) classes.push(args.activeClassName) } + console.log(classes) + const valueRangeClassNames = getRangeClassNames(valueRange, dateRange, `${className}--range`); classes.push(...valueRangeClassNames);