From cf3335e4b84f6ba2d14b761bb33edb43c6d4e8ab Mon Sep 17 00:00:00 2001
From: Tobias Skarhed <tobias.skarhed@gmail.com>
Date: Thu, 30 May 2024 16:19:35 +0200
Subject: [PATCH 1/2] Add lists and pressed state for the button

---
 packages/react-calendar/src/Flex.tsx | 41 ++++++++++++++++++----------
 packages/react-calendar/src/Tile.tsx |  1 +
 2 files changed, 27 insertions(+), 15 deletions(-)

diff --git a/packages/react-calendar/src/Flex.tsx b/packages/react-calendar/src/Flex.tsx
index 3a2a2273..1991edc3 100644
--- a/packages/react-calendar/src/Flex.tsx
+++ b/packages/react-calendar/src/Flex.tsx
@@ -1,6 +1,6 @@
 import { Children, cloneElement } from 'react';
 
-type FlexProps = React.HTMLAttributes<HTMLDivElement> & {
+type FlexProps = React.HTMLAttributes<HTMLUListElement> & {
   // eslint-disable-next-line @typescript-eslint/no-explicit-any
   children: React.ReactElement<any>[];
   className?: string;
@@ -26,12 +26,14 @@ export default function Flex({
   ...otherProps
 }: FlexProps) {
   return (
-    <div
+    <ul
       className={className}
       style={{
         display: 'flex',
         flexDirection: direction,
         flexWrap: wrap ? 'wrap' : 'nowrap',
+        margin: 0,
+        padding: 0,
         ...style,
       }}
       {...otherProps}
@@ -39,19 +41,28 @@ export default function Flex({
       {Children.map(children, (child, index) => {
         const marginInlineStart = offset && index === 0 ? toPercent((100 * offset) / count) : null;
 
-        return cloneElement(child, {
-          ...child.props,
-          style: {
-            flexBasis: toPercent(100 / count),
-            flexShrink: 0,
-            flexGrow: 0,
-            overflow: 'hidden',
-            marginLeft: marginInlineStart,
-            marginInlineStart: marginInlineStart,
-            marginInlineEnd: 0,
-          },
-        });
+        return (
+          <li
+            style={{
+              display: 'flex',
+              flexBasis: toPercent(100 / count),
+              flexShrink: 0,
+              flexGrow: 0,
+              overflow: 'hidden',
+              marginLeft: marginInlineStart || undefined,
+              marginInlineStart: marginInlineStart || undefined,
+              marginInlineEnd: 0,
+            }}
+          >
+            {cloneElement(child, {
+              ...child.props,
+              style: {
+                flex: 1,
+              },
+            })}
+          </li>
+        );
       })}
-    </div>
+    </ul>
   );
 }
diff --git a/packages/react-calendar/src/Tile.tsx b/packages/react-calendar/src/Tile.tsx
index 8b2683ca..7828fdf1 100644
--- a/packages/react-calendar/src/Tile.tsx
+++ b/packages/react-calendar/src/Tile.tsx
@@ -120,6 +120,7 @@ export default function Tile(props: TileProps) {
       onMouseOver={onMouseOver ? () => onMouseOver(date) : undefined}
       style={style}
       type="button"
+      aria-pressed={!!classes?.find((classString) => classString.indexOf('--active') != -1)}
     >
       {formatAbbr ? <abbr aria-label={formatAbbr(locale, date)}>{children}</abbr> : children}
       {tileContent}

From e6268dfd95d30b807d715135898efd8b18c788bc Mon Sep 17 00:00:00 2001
From: Tobias Skarhed <1438972+tskarhed@users.noreply.github.com>
Date: Wed, 4 Sep 2024 16:24:27 +0200
Subject: [PATCH 2/2] Update packages/react-calendar/src/Tile.tsx

---
 packages/react-calendar/src/Tile.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/react-calendar/src/Tile.tsx b/packages/react-calendar/src/Tile.tsx
index 7828fdf1..0f2e691c 100644
--- a/packages/react-calendar/src/Tile.tsx
+++ b/packages/react-calendar/src/Tile.tsx
@@ -120,7 +120,7 @@ export default function Tile(props: TileProps) {
       onMouseOver={onMouseOver ? () => onMouseOver(date) : undefined}
       style={style}
       type="button"
-      aria-pressed={!!classes?.find((classString) => classString.indexOf('--active') != -1)}
+      aria-pressed={!!classes?.find((classString) => classString.indexOf('--active') != -1 || classString.indexOf('--hasActive') != -1)}
     >
       {formatAbbr ? <abbr aria-label={formatAbbr(locale, date)}>{children}</abbr> : children}
       {tileContent}