@astryxdesign/lab 0.0.0-bootstrap.0 → 0.1.2-canary.04e71b2

package/dist/Schedule/shared.d.ts

@@ -0,0 +1,923 @@
+/**
+ * @file shared.tsx
+ * @input Schedule events, dates, timezone IDs, and display metadata
+ * @output Shared rendering primitives, formatters, and styles for schedule views
+ * @position Internal view utility module; consumed by Monthly, Weekly, Day, and List views
+ */
+import { type ReactNode } from 'react';
+import * as stylex from '@stylexjs/stylex';
+import { type PlainDate } from '@astryxdesign/core/utils';
+import type { CalendarEvent, CalendarInstantEvent, Instant, ScheduleCategory, ScheduleEventColor } from './types';
+export declare function ScheduleFrame({ title, titleLabel, isLoading, children, }: {
+    title: ReactNode;
+    titleLabel: string;
+    isLoading: boolean;
+    children: ReactNode;
+}): import("react").JSX.Element;
+export declare function ScheduleMonthTitle({ date, timezoneID, }: {
+    date: PlainDate;
+    timezoneID: string;
+}): import("react").JSX.Element;
+export declare function ScheduleRangeMonthTitle({ start, end, timezoneID, }: {
+    start: PlainDate;
+    end: PlainDate;
+    timezoneID: string;
+}): import("react").JSX.Element;
+export declare function EventPill({ event, day, timezoneID, isPast, }: {
+    event: CalendarEvent;
+    day?: PlainDate;
+    timezoneID?: string;
+    isPast?: boolean;
+}): import("react").JSX.Element;
+export declare function MonthEventPill({ event, timezoneID, isPast, }: {
+    event: CalendarEvent;
+    timezoneID: string;
+    isPast?: boolean;
+}): import("react").JSX.Element;
+export declare function ListEventRow({ event, timezoneID, isPast, }: {
+    event: CalendarEvent;
+    timezoneID: string;
+    isPast?: boolean;
+}): import("react").JSX.Element;
+export declare function getEventCategory(event: CalendarEvent, categories: ReadonlyArray<ScheduleCategory>): ScheduleCategory;
+export declare function eventColorStyle(color: ScheduleEventColor | undefined): Readonly<{
+    readonly color: stylex.StyleXClassNameFor<"color", "light-dark(#014975, #A1EEF9)">;
+    readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", "light-dark(#03A7D733, #03A7D733)">;
+    readonly borderColor: stylex.StyleXClassNameFor<"borderColor", "light-dark(#089DD0, #0171A4)">;
+}> | Readonly<{
+    readonly color: stylex.StyleXClassNameFor<"color", "light-dark(#0A1317, #E7EAED)">;
+    readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", "light-dark(#0A131733, #666A724C)">;
+    readonly borderColor: stylex.StyleXClassNameFor<"borderColor", "light-dark(#647685, #748695)">;
+}> | Readonly<{
+    readonly color: stylex.StyleXClassNameFor<"color", "light-dark(#09441F, #A5F690)">;
+    readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", "light-dark(#24BB5E33, #24BB5E33)">;
+    readonly borderColor: stylex.StyleXClassNameFor<"borderColor", "light-dark(#0D8626, #0B991F)">;
+}> | Readonly<{
+    readonly color: stylex.StyleXClassNameFor<"color", "light-dark(#6B2203, #FDB876)">;
+    readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", "light-dark(#F2790233, #F2790233)">;
+    readonly borderColor: stylex.StyleXClassNameFor<"borderColor", "light-dark(#EB6E00, #B34A01)">;
+}> | Readonly<{
+    readonly color: stylex.StyleXClassNameFor<"color", "light-dark(#650053, #FEADE3)">;
+    readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", "light-dark(#E638B333, #E638B333)">;
+    readonly borderColor: stylex.StyleXClassNameFor<"borderColor", "light-dark(#F351C0, #C02294)">;
+}> | Readonly<{
+    readonly color: stylex.StyleXClassNameFor<"color", "light-dark(#3E0697, #B3B0FE)">;
+    readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", "light-dark(#7952FF33, #7952FF33)">;
+    readonly borderColor: stylex.StyleXClassNameFor<"borderColor", "light-dark(#9081FF, #7340FE)">;
+}> | Readonly<{
+    readonly color: stylex.StyleXClassNameFor<"color", "light-dark(#7B0210, #FFB2B8)">;
+    readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", "light-dark(#E3193B33, #E3193B33)">;
+    readonly borderColor: stylex.StyleXClassNameFor<"borderColor", "light-dark(#E3193B, #F5394F)">;
+}> | Readonly<{
+    readonly color: stylex.StyleXClassNameFor<"color", "light-dark(#083943, #40DCCD)">;
+    readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", "light-dark(#0DB7AF33, #0DB7AF33)">;
+    readonly borderColor: stylex.StyleXClassNameFor<"borderColor", "light-dark(#08A3A3, #08767D)">;
+}> | Readonly<{
+    readonly color: stylex.StyleXClassNameFor<"color", "light-dark(#753F07, #FBCE03)">;
+    readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", "light-dark(#E2A40033, #E2A40033)">;
+    readonly borderColor: stylex.StyleXClassNameFor<"borderColor", "light-dark(#C58600, #B47700)">;
+}> | Readonly<{
+    readonly color: stylex.StyleXClassNameFor<"color", "light-dark(#042F97, #AFD7FF)">;
+    readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", "light-dark(#0171E333, #0171E333)">;
+    readonly borderColor: stylex.StyleXClassNameFor<"borderColor", "light-dark(#0064E0, #2694FE)">;
+}>;
+export declare function eventDotColorStyle(color: ScheduleEventColor | undefined): Readonly<{
+    readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", "light-dark(#089DD0, #0171A4)">;
+}> | Readonly<{
+    readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", "light-dark(#4E606F, #AAAFB5)">;
+}> | Readonly<{
+    readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", "light-dark(#0D8626, #0B991F)">;
+}> | Readonly<{
+    readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", "light-dark(#EB6E00, #B34A01)">;
+}> | Readonly<{
+    readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", "light-dark(#F351C0, #C02294)">;
+}> | Readonly<{
+    readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", "light-dark(#9081FF, #7340FE)">;
+}> | Readonly<{
+    readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", "light-dark(#E3193B, #F5394F)">;
+}> | Readonly<{
+    readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", "light-dark(#08A3A3, #08767D)">;
+}> | Readonly<{
+    readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", "light-dark(#C58600, #B47700)">;
+}> | Readonly<{
+    readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", "light-dark(#0064E0, #2694FE)">;
+}>;
+export declare function eventSurfaceColorStyle(color: ScheduleEventColor | undefined): Readonly<{
+    readonly color: stylex.StyleXClassNameFor<"color", "light-dark(#014975, #A1EEF9)">;
+    readonly borderColor: stylex.StyleXClassNameFor<"borderColor", "light-dark(#089DD0, #0171A4)">;
+    readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", `color-mix(in srgb, ${stylex.StyleXVar<"light-dark(#089DD0, #0171A4)">} 20%, ${stylex.StyleXVar<"light-dark(#FFFFFF, #1F1F22)">})`>;
+}> | Readonly<{
+    readonly color: stylex.StyleXClassNameFor<"color", "light-dark(#0A1317, #E7EAED)">;
+    readonly borderColor: stylex.StyleXClassNameFor<"borderColor", "light-dark(#647685, #748695)">;
+    readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", `color-mix(in srgb, ${stylex.StyleXVar<"light-dark(#647685, #748695)">} 20%, ${stylex.StyleXVar<"light-dark(#FFFFFF, #1F1F22)">})`>;
+}> | Readonly<{
+    readonly color: stylex.StyleXClassNameFor<"color", "light-dark(#09441F, #A5F690)">;
+    readonly borderColor: stylex.StyleXClassNameFor<"borderColor", "light-dark(#0D8626, #0B991F)">;
+    readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", `color-mix(in srgb, ${stylex.StyleXVar<"light-dark(#0D8626, #0B991F)">} 20%, ${stylex.StyleXVar<"light-dark(#FFFFFF, #1F1F22)">})`>;
+}> | Readonly<{
+    readonly color: stylex.StyleXClassNameFor<"color", "light-dark(#6B2203, #FDB876)">;
+    readonly borderColor: stylex.StyleXClassNameFor<"borderColor", "light-dark(#EB6E00, #B34A01)">;
+    readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", `color-mix(in srgb, ${stylex.StyleXVar<"light-dark(#EB6E00, #B34A01)">} 20%, ${stylex.StyleXVar<"light-dark(#FFFFFF, #1F1F22)">})`>;
+}> | Readonly<{
+    readonly color: stylex.StyleXClassNameFor<"color", "light-dark(#650053, #FEADE3)">;
+    readonly borderColor: stylex.StyleXClassNameFor<"borderColor", "light-dark(#F351C0, #C02294)">;
+    readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", `color-mix(in srgb, ${stylex.StyleXVar<"light-dark(#F351C0, #C02294)">} 20%, ${stylex.StyleXVar<"light-dark(#FFFFFF, #1F1F22)">})`>;
+}> | Readonly<{
+    readonly color: stylex.StyleXClassNameFor<"color", "light-dark(#3E0697, #B3B0FE)">;
+    readonly borderColor: stylex.StyleXClassNameFor<"borderColor", "light-dark(#9081FF, #7340FE)">;
+    readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", `color-mix(in srgb, ${stylex.StyleXVar<"light-dark(#9081FF, #7340FE)">} 20%, ${stylex.StyleXVar<"light-dark(#FFFFFF, #1F1F22)">})`>;
+}> | Readonly<{
+    readonly color: stylex.StyleXClassNameFor<"color", "light-dark(#7B0210, #FFB2B8)">;
+    readonly borderColor: stylex.StyleXClassNameFor<"borderColor", "light-dark(#E3193B, #F5394F)">;
+    readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", `color-mix(in srgb, ${stylex.StyleXVar<"light-dark(#E3193B, #F5394F)">} 20%, ${stylex.StyleXVar<"light-dark(#FFFFFF, #1F1F22)">})`>;
+}> | Readonly<{
+    readonly color: stylex.StyleXClassNameFor<"color", "light-dark(#083943, #40DCCD)">;
+    readonly borderColor: stylex.StyleXClassNameFor<"borderColor", "light-dark(#08A3A3, #08767D)">;
+    readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", `color-mix(in srgb, ${stylex.StyleXVar<"light-dark(#08A3A3, #08767D)">} 20%, ${stylex.StyleXVar<"light-dark(#FFFFFF, #1F1F22)">})`>;
+}> | Readonly<{
+    readonly color: stylex.StyleXClassNameFor<"color", "light-dark(#753F07, #FBCE03)">;
+    readonly borderColor: stylex.StyleXClassNameFor<"borderColor", "light-dark(#C58600, #B47700)">;
+    readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", `color-mix(in srgb, ${stylex.StyleXVar<"light-dark(#C58600, #B47700)">} 20%, ${stylex.StyleXVar<"light-dark(#FFFFFF, #1F1F22)">})`>;
+}> | Readonly<{
+    readonly color: stylex.StyleXClassNameFor<"color", "light-dark(#042F97, #AFD7FF)">;
+    readonly borderColor: stylex.StyleXClassNameFor<"borderColor", "light-dark(#0064E0, #2694FE)">;
+    readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", `color-mix(in srgb, ${stylex.StyleXVar<"light-dark(#0064E0, #2694FE)">} 20%, ${stylex.StyleXVar<"light-dark(#FFFFFF, #1F1F22)">})`>;
+}>;
+export declare function eventPastSurfaceColorStyle(color: ScheduleEventColor | undefined): Readonly<{
+    readonly color: stylex.StyleXClassNameFor<"color", `color-mix(in srgb, ${stylex.StyleXVar<"light-dark(#014975, #A1EEF9)">} 52%, ${stylex.StyleXVar<"light-dark(#4E606F, #AAAFB5)">})`>;
+    readonly borderColor: stylex.StyleXClassNameFor<"borderColor", `color-mix(in srgb, ${stylex.StyleXVar<"light-dark(#089DD0, #0171A4)">} 48%, ${stylex.StyleXVar<"light-dark(#05365919, #F2F4F619)">})`>;
+    readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", `color-mix(in srgb, ${stylex.StyleXVar<"light-dark(#089DD0, #0171A4)">} 10%, ${stylex.StyleXVar<"light-dark(#FFFFFF, #1F1F22)">})`>;
+}> | Readonly<{
+    readonly color: stylex.StyleXClassNameFor<"color", "light-dark(#4E606F, #AAAFB5)">;
+    readonly borderColor: stylex.StyleXClassNameFor<"borderColor", "light-dark(#05365919, #F2F4F619)">;
+    readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", `color-mix(in srgb, ${stylex.StyleXVar<"light-dark(#647685, #748695)">} 10%, ${stylex.StyleXVar<"light-dark(#FFFFFF, #1F1F22)">})`>;
+}> | Readonly<{
+    readonly color: stylex.StyleXClassNameFor<"color", `color-mix(in srgb, ${stylex.StyleXVar<"light-dark(#09441F, #A5F690)">} 52%, ${stylex.StyleXVar<"light-dark(#4E606F, #AAAFB5)">})`>;
+    readonly borderColor: stylex.StyleXClassNameFor<"borderColor", `color-mix(in srgb, ${stylex.StyleXVar<"light-dark(#0D8626, #0B991F)">} 48%, ${stylex.StyleXVar<"light-dark(#05365919, #F2F4F619)">})`>;
+    readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", `color-mix(in srgb, ${stylex.StyleXVar<"light-dark(#0D8626, #0B991F)">} 10%, ${stylex.StyleXVar<"light-dark(#FFFFFF, #1F1F22)">})`>;
+}> | Readonly<{
+    readonly color: stylex.StyleXClassNameFor<"color", `color-mix(in srgb, ${stylex.StyleXVar<"light-dark(#6B2203, #FDB876)">} 52%, ${stylex.StyleXVar<"light-dark(#4E606F, #AAAFB5)">})`>;
+    readonly borderColor: stylex.StyleXClassNameFor<"borderColor", `color-mix(in srgb, ${stylex.StyleXVar<"light-dark(#EB6E00, #B34A01)">} 48%, ${stylex.StyleXVar<"light-dark(#05365919, #F2F4F619)">})`>;
+    readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", `color-mix(in srgb, ${stylex.StyleXVar<"light-dark(#EB6E00, #B34A01)">} 10%, ${stylex.StyleXVar<"light-dark(#FFFFFF, #1F1F22)">})`>;
+}> | Readonly<{
+    readonly color: stylex.StyleXClassNameFor<"color", `color-mix(in srgb, ${stylex.StyleXVar<"light-dark(#650053, #FEADE3)">} 52%, ${stylex.StyleXVar<"light-dark(#4E606F, #AAAFB5)">})`>;
+    readonly borderColor: stylex.StyleXClassNameFor<"borderColor", `color-mix(in srgb, ${stylex.StyleXVar<"light-dark(#F351C0, #C02294)">} 48%, ${stylex.StyleXVar<"light-dark(#05365919, #F2F4F619)">})`>;
+    readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", `color-mix(in srgb, ${stylex.StyleXVar<"light-dark(#F351C0, #C02294)">} 10%, ${stylex.StyleXVar<"light-dark(#FFFFFF, #1F1F22)">})`>;
+}> | Readonly<{
+    readonly color: stylex.StyleXClassNameFor<"color", `color-mix(in srgb, ${stylex.StyleXVar<"light-dark(#3E0697, #B3B0FE)">} 52%, ${stylex.StyleXVar<"light-dark(#4E606F, #AAAFB5)">})`>;
+    readonly borderColor: stylex.StyleXClassNameFor<"borderColor", `color-mix(in srgb, ${stylex.StyleXVar<"light-dark(#9081FF, #7340FE)">} 48%, ${stylex.StyleXVar<"light-dark(#05365919, #F2F4F619)">})`>;
+    readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", `color-mix(in srgb, ${stylex.StyleXVar<"light-dark(#9081FF, #7340FE)">} 10%, ${stylex.StyleXVar<"light-dark(#FFFFFF, #1F1F22)">})`>;
+}> | Readonly<{
+    readonly color: stylex.StyleXClassNameFor<"color", `color-mix(in srgb, ${stylex.StyleXVar<"light-dark(#7B0210, #FFB2B8)">} 52%, ${stylex.StyleXVar<"light-dark(#4E606F, #AAAFB5)">})`>;
+    readonly borderColor: stylex.StyleXClassNameFor<"borderColor", `color-mix(in srgb, ${stylex.StyleXVar<"light-dark(#E3193B, #F5394F)">} 48%, ${stylex.StyleXVar<"light-dark(#05365919, #F2F4F619)">})`>;
+    readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", `color-mix(in srgb, ${stylex.StyleXVar<"light-dark(#E3193B, #F5394F)">} 10%, ${stylex.StyleXVar<"light-dark(#FFFFFF, #1F1F22)">})`>;
+}> | Readonly<{
+    readonly color: stylex.StyleXClassNameFor<"color", `color-mix(in srgb, ${stylex.StyleXVar<"light-dark(#083943, #40DCCD)">} 52%, ${stylex.StyleXVar<"light-dark(#4E606F, #AAAFB5)">})`>;
+    readonly borderColor: stylex.StyleXClassNameFor<"borderColor", `color-mix(in srgb, ${stylex.StyleXVar<"light-dark(#08A3A3, #08767D)">} 48%, ${stylex.StyleXVar<"light-dark(#05365919, #F2F4F619)">})`>;
+    readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", `color-mix(in srgb, ${stylex.StyleXVar<"light-dark(#08A3A3, #08767D)">} 10%, ${stylex.StyleXVar<"light-dark(#FFFFFF, #1F1F22)">})`>;
+}> | Readonly<{
+    readonly color: stylex.StyleXClassNameFor<"color", `color-mix(in srgb, ${stylex.StyleXVar<"light-dark(#753F07, #FBCE03)">} 52%, ${stylex.StyleXVar<"light-dark(#4E606F, #AAAFB5)">})`>;
+    readonly borderColor: stylex.StyleXClassNameFor<"borderColor", `color-mix(in srgb, ${stylex.StyleXVar<"light-dark(#C58600, #B47700)">} 48%, ${stylex.StyleXVar<"light-dark(#05365919, #F2F4F619)">})`>;
+    readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", `color-mix(in srgb, ${stylex.StyleXVar<"light-dark(#C58600, #B47700)">} 10%, ${stylex.StyleXVar<"light-dark(#FFFFFF, #1F1F22)">})`>;
+}> | Readonly<{
+    readonly color: stylex.StyleXClassNameFor<"color", `color-mix(in srgb, ${stylex.StyleXVar<"light-dark(#042F97, #AFD7FF)">} 52%, ${stylex.StyleXVar<"light-dark(#4E606F, #AAAFB5)">})`>;
+    readonly borderColor: stylex.StyleXClassNameFor<"borderColor", `color-mix(in srgb, ${stylex.StyleXVar<"light-dark(#0064E0, #2694FE)">} 48%, ${stylex.StyleXVar<"light-dark(#05365919, #F2F4F619)">})`>;
+    readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", `color-mix(in srgb, ${stylex.StyleXVar<"light-dark(#0064E0, #2694FE)">} 10%, ${stylex.StyleXVar<"light-dark(#FFFFFF, #1F1F22)">})`>;
+}>;
+export declare function formatWithPlainDate(date: PlainDate, timezoneID: string, options: Intl.DateTimeFormatOptions): string;
+export declare function formatMonthTitle(date: PlainDate, timezoneID: string): string;
+export declare function formatWeekTitle(start: PlainDate, end: PlainDate, timezoneID: string): string;
+export declare function formatRangeTitle(start: PlainDate, end: PlainDate, timezoneID: string): string;
+export declare function formatFullDate(date: PlainDate, timezoneID: string): string;
+export declare function formatShortDate(date: PlainDate, timezoneID: string): string;
+export declare function formatWeekday(date: PlainDate, timezoneID: string, weekday: 'short' | 'long'): string;
+export declare function formatDayNumber(date: PlainDate, timezoneID: string): string;
+export declare function formatHour(hour: number): string;
+export declare function formatTimezoneAbbreviation(date: PlainDate, timezoneID: string): string;
+export declare function formatEventTime(event: CalendarInstantEvent, day: PlainDate, timezoneID: string): string;
+export declare function formatEventTimeRange(event: CalendarInstantEvent, timezoneID: string): string;
+export declare function formatEventStartTime(event: CalendarInstantEvent, timezoneID: string): string;
+export declare function formatEventAccessibilityLabel(event: CalendarEvent, day: PlainDate, timezoneID: string, categories: ReadonlyArray<ScheduleCategory>): string;
+export declare function getMinutesSinceStartOfDay(instant: number, timezoneID: string): number;
+export declare function clamp(value: number, min: number, max: number): number;
+export declare function eventSpansPastDay(event: CalendarInstantEvent, day: PlainDate, timezoneID: string): boolean;
+export declare function isEventInPast(event: CalendarEvent, currentTime: Instant, timezoneID: string): boolean;
+export declare const styles: Readonly<{
+    readonly root: Readonly<{
+        readonly display: stylex.StyleXClassNameFor<"display", "flex">;
+        readonly flexDirection: stylex.StyleXClassNameFor<"flexDirection", "column">;
+        readonly minWidth: stylex.StyleXClassNameFor<"minWidth", 0>;
+        readonly minHeight: stylex.StyleXClassNameFor<"minHeight", 0>;
+    }>;
+    readonly frame: Readonly<{
+        readonly flex: stylex.StyleXClassNameFor<"flex", 1>;
+        readonly display: stylex.StyleXClassNameFor<"display", "flex">;
+        readonly flexDirection: stylex.StyleXClassNameFor<"flexDirection", "column">;
+        readonly minWidth: stylex.StyleXClassNameFor<"minWidth", 0>;
+        readonly minHeight: stylex.StyleXClassNameFor<"minHeight", 0>;
+        readonly borderWidth: stylex.StyleXClassNameFor<"borderWidth", "1px">;
+        readonly borderStyle: stylex.StyleXClassNameFor<"borderStyle", "solid">;
+        readonly borderColor: stylex.StyleXClassNameFor<"borderColor", "light-dark(#05365919, #F2F4F619)">;
+        readonly borderRadius: stylex.StyleXClassNameFor<"borderRadius", "12px">;
+        readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", "light-dark(#FFFFFF, #1F1F22)">;
+        readonly overflow: stylex.StyleXClassNameFor<"overflow", "hidden">;
+    }>;
+    readonly header: Readonly<{
+        readonly display: stylex.StyleXClassNameFor<"display", "grid">;
+        readonly gridTemplateColumns: stylex.StyleXClassNameFor<"gridTemplateColumns", "minmax(0, 1fr) auto minmax(0, 1fr)">;
+        readonly alignItems: stylex.StyleXClassNameFor<"alignItems", "center">;
+        readonly gap: stylex.StyleXClassNameFor<"gap", "12px">;
+        readonly paddingBlock: stylex.StyleXClassNameFor<"paddingBlock", "12px">;
+        readonly paddingInline: stylex.StyleXClassNameFor<"paddingInline", "16px">;
+        readonly borderBottomWidth: stylex.StyleXClassNameFor<"borderBottomWidth", "1px">;
+        readonly borderBottomStyle: stylex.StyleXClassNameFor<"borderBottomStyle", "solid">;
+        readonly borderBottomColor: stylex.StyleXClassNameFor<"borderBottomColor", "light-dark(#05365919, #F2F4F619)">;
+    }>;
+    readonly headerControls: Readonly<{
+        readonly justifySelf: stylex.StyleXClassNameFor<"justifySelf", "start">;
+    }>;
+    readonly headerTitle: Readonly<{
+        readonly justifySelf: stylex.StyleXClassNameFor<"justifySelf", "center">;
+        readonly textAlign: stylex.StyleXClassNameFor<"textAlign", "center">;
+        readonly minWidth: stylex.StyleXClassNameFor<"minWidth", 0>;
+    }>;
+    readonly headerTitleContent: Readonly<{
+        readonly display: stylex.StyleXClassNameFor<"display", "inline-flex">;
+        readonly alignItems: stylex.StyleXClassNameFor<"alignItems", "center">;
+        readonly gap: stylex.StyleXClassNameFor<"gap", "8px">;
+    }>;
+    readonly loadingSpinner: Readonly<{
+        readonly display: stylex.StyleXClassNameFor<"display", "inline-flex">;
+    }>;
+    readonly loadingSpinnerHidden: Readonly<{
+        readonly visibility: stylex.StyleXClassNameFor<"visibility", "hidden">;
+    }>;
+    readonly headerStatus: Readonly<{
+        readonly justifySelf: stylex.StyleXClassNameFor<"justifySelf", "end">;
+        readonly minWidth: stylex.StyleXClassNameFor<"minWidth", 0>;
+    }>;
+    readonly titleEmphasis: Readonly<{
+        readonly fontWeight: stylex.StyleXClassNameFor<"fontWeight", "700">;
+    }>;
+    readonly visuallyHidden: Readonly<{
+        readonly position: stylex.StyleXClassNameFor<"position", "absolute">;
+        readonly width: stylex.StyleXClassNameFor<"width", "1px">;
+        readonly height: stylex.StyleXClassNameFor<"height", "1px">;
+        readonly padding: stylex.StyleXClassNameFor<"padding", 0>;
+        readonly margin: stylex.StyleXClassNameFor<"margin", "-1px">;
+        readonly overflow: stylex.StyleXClassNameFor<"overflow", "hidden">;
+        readonly clip: stylex.StyleXClassNameFor<"clip", "rect(0 0 0 0)">;
+        readonly whiteSpace: stylex.StyleXClassNameFor<"whiteSpace", "nowrap">;
+        readonly borderWidth: stylex.StyleXClassNameFor<"borderWidth", 0>;
+    }>;
+    readonly weekHeader: Readonly<{
+        readonly display: stylex.StyleXClassNameFor<"display", "grid">;
+        readonly gridTemplateColumns: stylex.StyleXClassNameFor<"gridTemplateColumns", "repeat(7, minmax(0, 1fr))">;
+        readonly borderBottomWidth: stylex.StyleXClassNameFor<"borderBottomWidth", "1px">;
+        readonly borderBottomStyle: stylex.StyleXClassNameFor<"borderBottomStyle", "solid">;
+        readonly borderBottomColor: stylex.StyleXClassNameFor<"borderBottomColor", "light-dark(#05365919, #F2F4F619)">;
+    }>;
+    readonly weekdayLabel: Readonly<{
+        readonly paddingBlock: stylex.StyleXClassNameFor<"paddingBlock", "8px">;
+        readonly paddingInline: stylex.StyleXClassNameFor<"paddingInline", "12px">;
+        readonly textAlign: stylex.StyleXClassNameFor<"textAlign", "center">;
+    }>;
+    readonly weekdayHeading: Readonly<{
+        readonly textAlign: stylex.StyleXClassNameFor<"textAlign", "center">;
+    }>;
+    readonly monthGrid: Readonly<{
+        readonly overflowX: stylex.StyleXClassNameFor<"overflowX", "auto">;
+    }>;
+    readonly monthGridSurface: Readonly<{
+        readonly position: stylex.StyleXClassNameFor<"position", "relative">;
+        readonly width: stylex.StyleXClassNameFor<"width", "100%">;
+        readonly minWidth: stylex.StyleXClassNameFor<"minWidth", "784px">;
+    }>;
+    readonly monthCellGrid: Readonly<{
+        readonly display: stylex.StyleXClassNameFor<"display", "grid">;
+        readonly gridTemplateColumns: stylex.StyleXClassNameFor<"gridTemplateColumns", "repeat(7, minmax(0, 1fr))">;
+        readonly gridAutoRows: stylex.StyleXClassNameFor<"gridAutoRows", "128px">;
+    }>;
+    readonly monthGridRow: Readonly<{
+        readonly display: stylex.StyleXClassNameFor<"display", "contents">;
+    }>;
+    readonly monthEventOverlay: Readonly<{
+        readonly position: stylex.StyleXClassNameFor<"position", "absolute">;
+        readonly inset: stylex.StyleXClassNameFor<"inset", 0>;
+        readonly display: stylex.StyleXClassNameFor<"display", "grid">;
+        readonly gridTemplateColumns: stylex.StyleXClassNameFor<"gridTemplateColumns", "repeat(7, minmax(0, 1fr))">;
+        readonly gridAutoRows: stylex.StyleXClassNameFor<"gridAutoRows", "128px">;
+        readonly pointerEvents: stylex.StyleXClassNameFor<"pointerEvents", "none">;
+    }>;
+    readonly monthCell: Readonly<{
+        readonly display: stylex.StyleXClassNameFor<"display", "flex">;
+        readonly flexDirection: stylex.StyleXClassNameFor<"flexDirection", "column">;
+        readonly gap: stylex.StyleXClassNameFor<"gap", "4px">;
+        readonly minWidth: stylex.StyleXClassNameFor<"minWidth", 0>;
+        readonly padding: stylex.StyleXClassNameFor<"padding", 0>;
+        readonly borderInlineEndWidth: stylex.StyleXClassNameFor<"borderInlineEndWidth", "1px">;
+        readonly borderInlineEndStyle: stylex.StyleXClassNameFor<"borderInlineEndStyle", "solid">;
+        readonly borderInlineEndColor: stylex.StyleXClassNameFor<"borderInlineEndColor", "light-dark(#05365919, #F2F4F619)">;
+        readonly borderBlockEndWidth: stylex.StyleXClassNameFor<"borderBlockEndWidth", "1px">;
+        readonly borderBlockEndStyle: stylex.StyleXClassNameFor<"borderBlockEndStyle", "solid">;
+        readonly borderBlockEndColor: stylex.StyleXClassNameFor<"borderBlockEndColor", "light-dark(#05365919, #F2F4F619)">;
+        readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", "light-dark(#FFFFFF, #1F1F22)">;
+    }>;
+    readonly monthCellLastColumn: Readonly<{
+        readonly borderInlineEndWidth: stylex.StyleXClassNameFor<"borderInlineEndWidth", 0>;
+    }>;
+    readonly monthCellLastRow: Readonly<{
+        readonly borderBlockEndWidth: stylex.StyleXClassNameFor<"borderBlockEndWidth", 0>;
+    }>;
+    readonly monthCellOutside: Readonly<{
+        readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", "light-dark(#0536590C, #1111127F)">;
+    }>;
+    readonly monthDayNumber: Readonly<{
+        readonly alignSelf: stylex.StyleXClassNameFor<"alignSelf", "flex-start">;
+        readonly display: stylex.StyleXClassNameFor<"display", "inline-flex">;
+        readonly alignItems: stylex.StyleXClassNameFor<"alignItems", "center">;
+        readonly justifyContent: stylex.StyleXClassNameFor<"justifyContent", "flex-start">;
+        readonly width: stylex.StyleXClassNameFor<"width", "24px">;
+        readonly height: stylex.StyleXClassNameFor<"height", "24px">;
+        readonly margin: stylex.StyleXClassNameFor<"margin", "2px">;
+        readonly paddingInlineStart: stylex.StyleXClassNameFor<"paddingInlineStart", "4px">;
+        readonly paddingInlineEnd: stylex.StyleXClassNameFor<"paddingInlineEnd", 0>;
+        readonly borderRadius: stylex.StyleXClassNameFor<"borderRadius", "9999px">;
+        readonly color: stylex.StyleXClassNameFor<"color", "light-dark(#4E606F, #AAAFB5)">;
+    }>;
+    readonly currentDayPill: Readonly<{
+        readonly color: stylex.StyleXClassNameFor<"color", "light-dark(#FFFFFF, #FFFFFF)">;
+        readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", "light-dark(#0064E0, #2694FE)">;
+    }>;
+    readonly monthEventStack: Readonly<{
+        readonly display: stylex.StyleXClassNameFor<"display", "flex">;
+        readonly flexDirection: stylex.StyleXClassNameFor<"flexDirection", "column">;
+        readonly gap: stylex.StyleXClassNameFor<"gap", "2px">;
+        readonly minWidth: stylex.StyleXClassNameFor<"minWidth", 0>;
+    }>;
+    readonly monthEventSpan: (week: number, columnStart: number, columnEnd: number, level: number) => readonly [Readonly<{
+        gridRow: stylex.StyleXClassNameFor<"gridRow", string>;
+        gridColumn: stylex.StyleXClassNameFor<"gridColumn", string>;
+        alignSelf: stylex.StyleXClassNameFor<"alignSelf", "start">;
+        minWidth: stylex.StyleXClassNameFor<"minWidth", number>;
+        marginInlineStart: stylex.StyleXClassNameFor<"marginInlineStart", "2px">;
+        marginInlineEnd: stylex.StyleXClassNameFor<"marginInlineEnd", string>;
+        marginBlockStart: stylex.StyleXClassNameFor<"marginBlockStart", string>;
+        pointerEvents: stylex.StyleXClassNameFor<"pointerEvents", "auto">;
+        zIndex: stylex.StyleXClassNameFor<"zIndex", number>;
+    }>, stylex.InlineStyles];
+    readonly eventPill: Readonly<{
+        readonly display: stylex.StyleXClassNameFor<"display", "flex">;
+        readonly alignItems: stylex.StyleXClassNameFor<"alignItems", "center">;
+        readonly gap: stylex.StyleXClassNameFor<"gap", "4px">;
+        readonly minWidth: stylex.StyleXClassNameFor<"minWidth", 0>;
+        readonly borderWidth: stylex.StyleXClassNameFor<"borderWidth", "1px">;
+        readonly borderStyle: stylex.StyleXClassNameFor<"borderStyle", "solid">;
+        readonly borderRadius: stylex.StyleXClassNameFor<"borderRadius", "4px">;
+        readonly paddingBlock: stylex.StyleXClassNameFor<"paddingBlock", "2px">;
+        readonly paddingInline: stylex.StyleXClassNameFor<"paddingInline", "6px">;
+        readonly fontSize: stylex.StyleXClassNameFor<"fontSize", "var(--font-size-sm)">;
+        readonly lineHeight: stylex.StyleXClassNameFor<"lineHeight", "1.6667">;
+        readonly fontWeight: stylex.StyleXClassNameFor<"fontWeight", "500">;
+        readonly fontFamily: stylex.StyleXClassNameFor<"fontFamily", "-apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif">;
+        readonly color: stylex.StyleXClassNameFor<"color", "light-dark(#0A1317, #DFE2E5)">;
+    }>;
+    readonly eventTitle: Readonly<{
+        readonly overflow: stylex.StyleXClassNameFor<"overflow", "hidden">;
+        readonly textOverflow: stylex.StyleXClassNameFor<"textOverflow", "ellipsis">;
+        readonly whiteSpace: stylex.StyleXClassNameFor<"whiteSpace", "nowrap">;
+        readonly minWidth: stylex.StyleXClassNameFor<"minWidth", 0>;
+    }>;
+    readonly eventTime: Readonly<{
+        readonly overflow: stylex.StyleXClassNameFor<"overflow", "hidden">;
+        readonly textOverflow: stylex.StyleXClassNameFor<"textOverflow", "ellipsis">;
+        readonly whiteSpace: stylex.StyleXClassNameFor<"whiteSpace", "nowrap">;
+        readonly flexShrink: stylex.StyleXClassNameFor<"flexShrink", 0>;
+        readonly opacity: stylex.StyleXClassNameFor<"opacity", 0.8>;
+    }>;
+    readonly moreEvents: Readonly<{
+        readonly color: stylex.StyleXClassNameFor<"color", "light-dark(#4E606F, #AAAFB5)">;
+        readonly fontSize: stylex.StyleXClassNameFor<"fontSize", "var(--font-size-sm)">;
+        readonly lineHeight: stylex.StyleXClassNameFor<"lineHeight", "1.6667">;
+        readonly fontFamily: stylex.StyleXClassNameFor<"fontFamily", "-apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif">;
+    }>;
+    readonly timeGrid: Readonly<{
+        readonly flex: stylex.StyleXClassNameFor<"flex", 1>;
+        readonly display: stylex.StyleXClassNameFor<"display", "grid">;
+        readonly gridTemplateColumns: stylex.StyleXClassNameFor<"gridTemplateColumns", "60px minmax(0, 1fr)">;
+        readonly gridTemplateRows: stylex.StyleXClassNameFor<"gridTemplateRows", "56px auto 1fr">;
+        readonly height: stylex.StyleXClassNameFor<"height", "640px">;
+        readonly minHeight: stylex.StyleXClassNameFor<"minHeight", 0>;
+        readonly overflow: stylex.StyleXClassNameFor<"overflow", "hidden">;
+    }>;
+    readonly timeGridCorner: Readonly<{
+        readonly gridColumn: stylex.StyleXClassNameFor<"gridColumn", 1>;
+        readonly gridRow: stylex.StyleXClassNameFor<"gridRow", 1>;
+        readonly borderInlineEndWidth: stylex.StyleXClassNameFor<"borderInlineEndWidth", "1px">;
+        readonly borderInlineEndStyle: stylex.StyleXClassNameFor<"borderInlineEndStyle", "solid">;
+        readonly borderInlineEndColor: stylex.StyleXClassNameFor<"borderInlineEndColor", "light-dark(#05365919, #F2F4F619)">;
+        readonly borderBottomWidth: stylex.StyleXClassNameFor<"borderBottomWidth", "1px">;
+        readonly borderBottomStyle: stylex.StyleXClassNameFor<"borderBottomStyle", "solid">;
+        readonly borderBottomColor: stylex.StyleXClassNameFor<"borderBottomColor", "light-dark(#05365919, #F2F4F619)">;
+    }>;
+    readonly timeGridHeader: Readonly<{
+        readonly gridColumn: stylex.StyleXClassNameFor<"gridColumn", 2>;
+        readonly gridRow: stylex.StyleXClassNameFor<"gridRow", 1>;
+        readonly display: stylex.StyleXClassNameFor<"display", "grid">;
+        readonly gridAutoFlow: stylex.StyleXClassNameFor<"gridAutoFlow", "column">;
+        readonly gridAutoColumns: stylex.StyleXClassNameFor<"gridAutoColumns", "minmax(140px, 1fr)">;
+        readonly borderBottomWidth: stylex.StyleXClassNameFor<"borderBottomWidth", "1px">;
+        readonly borderBottomStyle: stylex.StyleXClassNameFor<"borderBottomStyle", "solid">;
+        readonly borderBottomColor: stylex.StyleXClassNameFor<"borderBottomColor", "light-dark(#05365919, #F2F4F619)">;
+    }>;
+    readonly timeGridHeaderCell: Readonly<{
+        readonly display: stylex.StyleXClassNameFor<"display", "flex">;
+        readonly flexDirection: stylex.StyleXClassNameFor<"flexDirection", "column">;
+        readonly alignItems: stylex.StyleXClassNameFor<"alignItems", "center">;
+        readonly justifyContent: stylex.StyleXClassNameFor<"justifyContent", "center">;
+        readonly gap: stylex.StyleXClassNameFor<"gap", "2px">;
+        readonly borderInlineEndWidth: stylex.StyleXClassNameFor<"borderInlineEndWidth", "1px">;
+        readonly borderInlineEndStyle: stylex.StyleXClassNameFor<"borderInlineEndStyle", "solid">;
+        readonly borderInlineEndColor: stylex.StyleXClassNameFor<"borderInlineEndColor", "light-dark(#05365919, #F2F4F619)">;
+    }>;
+    readonly timeGridHeaderCellLast: Readonly<{
+        readonly borderInlineEndWidth: stylex.StyleXClassNameFor<"borderInlineEndWidth", 0>;
+    }>;
+    readonly timeGridHeaderHeading: Readonly<{
+        readonly textAlign: stylex.StyleXClassNameFor<"textAlign", "center">;
+    }>;
+    readonly timeGridHeaderHeadingContent: Readonly<{
+        readonly display: stylex.StyleXClassNameFor<"display", "inline-flex">;
+        readonly alignItems: stylex.StyleXClassNameFor<"alignItems", "center">;
+        readonly justifyContent: stylex.StyleXClassNameFor<"justifyContent", "center">;
+        readonly gap: stylex.StyleXClassNameFor<"gap", "4px">;
+    }>;
+    readonly timeGridDayNumber: Readonly<{
+        readonly display: stylex.StyleXClassNameFor<"display", "inline-flex">;
+        readonly alignItems: stylex.StyleXClassNameFor<"alignItems", "center">;
+        readonly justifyContent: stylex.StyleXClassNameFor<"justifyContent", "center">;
+        readonly borderRadius: stylex.StyleXClassNameFor<"borderRadius", "9999px">;
+    }>;
+    readonly timeGridCurrentDayPill: Readonly<{
+        readonly minWidth: stylex.StyleXClassNameFor<"minWidth", "30px">;
+        readonly height: stylex.StyleXClassNameFor<"height", "30px">;
+        readonly lineHeight: stylex.StyleXClassNameFor<"lineHeight", "30px">;
+        readonly color: stylex.StyleXClassNameFor<"color", "light-dark(#FFFFFF, #FFFFFF)">;
+        readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", "light-dark(#0064E0, #2694FE)">;
+    }>;
+    readonly allDayLabel: Readonly<{
+        readonly gridColumn: stylex.StyleXClassNameFor<"gridColumn", 1>;
+        readonly gridRow: stylex.StyleXClassNameFor<"gridRow", 2>;
+        readonly paddingBlock: stylex.StyleXClassNameFor<"paddingBlock", "4px">;
+        readonly paddingInline: stylex.StyleXClassNameFor<"paddingInline", "8px">;
+        readonly display: stylex.StyleXClassNameFor<"display", "flex">;
+        readonly alignItems: stylex.StyleXClassNameFor<"alignItems", "center">;
+        readonly justifyContent: stylex.StyleXClassNameFor<"justifyContent", "flex-end">;
+        readonly borderInlineEndWidth: stylex.StyleXClassNameFor<"borderInlineEndWidth", "1px">;
+        readonly borderInlineEndStyle: stylex.StyleXClassNameFor<"borderInlineEndStyle", "solid">;
+        readonly borderInlineEndColor: stylex.StyleXClassNameFor<"borderInlineEndColor", "light-dark(#05365919, #F2F4F619)">;
+        readonly borderBottomWidth: stylex.StyleXClassNameFor<"borderBottomWidth", "1px">;
+        readonly borderBottomStyle: stylex.StyleXClassNameFor<"borderBottomStyle", "solid">;
+        readonly borderBottomColor: stylex.StyleXClassNameFor<"borderBottomColor", "light-dark(#05365919, #F2F4F619)">;
+    }>;
+    readonly allDayRow: Readonly<{
+        readonly gridColumn: stylex.StyleXClassNameFor<"gridColumn", 2>;
+        readonly gridRow: stylex.StyleXClassNameFor<"gridRow", 2>;
+        readonly overflowX: stylex.StyleXClassNameFor<"overflowX", "auto">;
+        readonly minHeight: stylex.StyleXClassNameFor<"minHeight", 0>;
+        readonly borderBottomWidth: stylex.StyleXClassNameFor<"borderBottomWidth", "1px">;
+        readonly borderBottomStyle: stylex.StyleXClassNameFor<"borderBottomStyle", "solid">;
+        readonly borderBottomColor: stylex.StyleXClassNameFor<"borderBottomColor", "light-dark(#05365919, #F2F4F619)">;
+    }>;
+    readonly allDayRowSurface: (columnCount: number, levelCount: number) => readonly [Readonly<{
+        position: stylex.StyleXClassNameFor<"position", "relative">;
+        width: stylex.StyleXClassNameFor<"width", string>;
+        minWidth: stylex.StyleXClassNameFor<"minWidth", string>;
+        minHeight: stylex.StyleXClassNameFor<"minHeight", string>;
+    }>, stylex.InlineStyles];
+    readonly allDayCellGrid: (columnCount: number) => readonly [Readonly<{
+        position: stylex.StyleXClassNameFor<"position", "absolute">;
+        inset: stylex.StyleXClassNameFor<"inset", number>;
+        display: stylex.StyleXClassNameFor<"display", "grid">;
+        gridTemplateColumns: stylex.StyleXClassNameFor<"gridTemplateColumns", string>;
+    }>, stylex.InlineStyles];
+    readonly allDayEventOverlay: (columnCount: number) => readonly [Readonly<{
+        position: stylex.StyleXClassNameFor<"position", "absolute">;
+        inset: stylex.StyleXClassNameFor<"inset", number>;
+        display: stylex.StyleXClassNameFor<"display", "grid">;
+        gridTemplateColumns: stylex.StyleXClassNameFor<"gridTemplateColumns", string>;
+        pointerEvents: stylex.StyleXClassNameFor<"pointerEvents", "none">;
+    }>, stylex.InlineStyles];
+    readonly allDayCell: Readonly<{
+        readonly minWidth: stylex.StyleXClassNameFor<"minWidth", 0>;
+        readonly borderInlineEndWidth: stylex.StyleXClassNameFor<"borderInlineEndWidth", "1px">;
+        readonly borderInlineEndStyle: stylex.StyleXClassNameFor<"borderInlineEndStyle", "solid">;
+        readonly borderInlineEndColor: stylex.StyleXClassNameFor<"borderInlineEndColor", "light-dark(#05365919, #F2F4F619)">;
+    }>;
+    readonly allDayCellLast: Readonly<{
+        readonly borderInlineEndWidth: stylex.StyleXClassNameFor<"borderInlineEndWidth", 0>;
+    }>;
+    readonly allDayEventSpan: (columnStart: number, columnEnd: number, level: number) => readonly [Readonly<{
+        gridColumn: stylex.StyleXClassNameFor<"gridColumn", string>;
+        alignSelf: stylex.StyleXClassNameFor<"alignSelf", "start">;
+        minWidth: stylex.StyleXClassNameFor<"minWidth", number>;
+        marginInlineStart: stylex.StyleXClassNameFor<"marginInlineStart", "2px">;
+        marginInlineEnd: stylex.StyleXClassNameFor<"marginInlineEnd", string>;
+        marginBlockStart: stylex.StyleXClassNameFor<"marginBlockStart", string>;
+        pointerEvents: stylex.StyleXClassNameFor<"pointerEvents", "auto">;
+    }>, stylex.InlineStyles];
+    readonly timeGridBody: Readonly<{
+        readonly gridColumn: stylex.StyleXClassNameFor<"gridColumn", "1 / -1">;
+        readonly gridRow: stylex.StyleXClassNameFor<"gridRow", 3>;
+        readonly display: stylex.StyleXClassNameFor<"display", "grid">;
+        readonly gridTemplateColumns: stylex.StyleXClassNameFor<"gridTemplateColumns", "60px minmax(0, 1fr)">;
+        readonly overflow: stylex.StyleXClassNameFor<"overflow", "auto">;
+        readonly minHeight: stylex.StyleXClassNameFor<"minHeight", 0>;
+    }>;
+    readonly timeLabels: Readonly<{
+        readonly gridColumn: stylex.StyleXClassNameFor<"gridColumn", 1>;
+        readonly position: stylex.StyleXClassNameFor<"position", "relative">;
+        readonly borderInlineEndWidth: stylex.StyleXClassNameFor<"borderInlineEndWidth", "1px">;
+        readonly borderInlineEndStyle: stylex.StyleXClassNameFor<"borderInlineEndStyle", "solid">;
+        readonly borderInlineEndColor: stylex.StyleXClassNameFor<"borderInlineEndColor", "light-dark(#05365919, #F2F4F619)">;
+    }>;
+    readonly timeLabel: Readonly<{
+        readonly position: stylex.StyleXClassNameFor<"position", "absolute">;
+        readonly insetInline: stylex.StyleXClassNameFor<"insetInline", 0>;
+        readonly transform: stylex.StyleXClassNameFor<"transform", "translateY(-50%)">;
+        readonly paddingInlineStart: stylex.StyleXClassNameFor<"paddingInlineStart", "4px">;
+        readonly paddingInlineEnd: stylex.StyleXClassNameFor<"paddingInlineEnd", "4px">;
+        readonly color: stylex.StyleXClassNameFor<"color", "light-dark(#4E606F, #AAAFB5)">;
+        readonly fontSize: stylex.StyleXClassNameFor<"fontSize", "var(--font-size-sm)">;
+        readonly lineHeight: stylex.StyleXClassNameFor<"lineHeight", "1.6667">;
+        readonly textAlign: stylex.StyleXClassNameFor<"textAlign", "end">;
+        readonly fontFamily: stylex.StyleXClassNameFor<"fontFamily", "-apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif">;
+    }>;
+    readonly timeLabelPosition: (index: number, hourHeight: number) => readonly [Readonly<{
+        top: stylex.StyleXClassNameFor<"top", string>;
+    }>, stylex.InlineStyles];
+    readonly timeColumns: Readonly<{
+        readonly gridColumn: stylex.StyleXClassNameFor<"gridColumn", 2>;
+        readonly display: stylex.StyleXClassNameFor<"display", "grid">;
+        readonly gridAutoFlow: stylex.StyleXClassNameFor<"gridAutoFlow", "column">;
+        readonly gridAutoColumns: stylex.StyleXClassNameFor<"gridAutoColumns", "minmax(140px, 1fr)">;
+        readonly minWidth: stylex.StyleXClassNameFor<"minWidth", 0>;
+    }>;
+    readonly timeColumn: Readonly<{
+        readonly position: stylex.StyleXClassNameFor<"position", "relative">;
+        readonly display: stylex.StyleXClassNameFor<"display", "grid">;
+        readonly minWidth: stylex.StyleXClassNameFor<"minWidth", 0>;
+        readonly borderInlineEndWidth: stylex.StyleXClassNameFor<"borderInlineEndWidth", "1px">;
+        readonly borderInlineEndStyle: stylex.StyleXClassNameFor<"borderInlineEndStyle", "solid">;
+        readonly borderInlineEndColor: stylex.StyleXClassNameFor<"borderInlineEndColor", "light-dark(#05365919, #F2F4F619)">;
+    }>;
+    readonly timeColumnRows: (hourHeight: number) => readonly [Readonly<{
+        gridAutoRows: stylex.StyleXClassNameFor<"gridAutoRows", string>;
+    }>, stylex.InlineStyles];
+    readonly timeColumnLast: Readonly<{
+        readonly borderInlineEndWidth: stylex.StyleXClassNameFor<"borderInlineEndWidth", 0>;
+    }>;
+    readonly hourSlot: Readonly<{
+        readonly borderBottomWidth: stylex.StyleXClassNameFor<"borderBottomWidth", "1px">;
+        readonly borderBottomStyle: stylex.StyleXClassNameFor<"borderBottomStyle", "solid">;
+        readonly borderBottomColor: stylex.StyleXClassNameFor<"borderBottomColor", "light-dark(#05365919, #F2F4F619)">;
+    }>;
+    readonly hourSlotLast: Readonly<{
+        readonly borderBottomWidth: stylex.StyleXClassNameFor<"borderBottomWidth", 0>;
+    }>;
+    readonly timedEvent: Readonly<{
+        readonly position: stylex.StyleXClassNameFor<"position", "absolute">;
+        readonly display: stylex.StyleXClassNameFor<"display", "flex">;
+        readonly flexDirection: stylex.StyleXClassNameFor<"flexDirection", "column">;
+        readonly gap: stylex.StyleXClassNameFor<"gap", 0>;
+        readonly minHeight: stylex.StyleXClassNameFor<"minHeight", "24px">;
+        readonly minWidth: stylex.StyleXClassNameFor<"minWidth", 0>;
+        readonly overflow: stylex.StyleXClassNameFor<"overflow", "hidden">;
+        readonly borderWidth: stylex.StyleXClassNameFor<"borderWidth", "1px">;
+        readonly borderStyle: stylex.StyleXClassNameFor<"borderStyle", "solid">;
+        readonly borderRadius: stylex.StyleXClassNameFor<"borderRadius", "4px">;
+        readonly paddingBlockStart: stylex.StyleXClassNameFor<"paddingBlockStart", "2px">;
+        readonly paddingBlockEnd: stylex.StyleXClassNameFor<"paddingBlockEnd", "4px">;
+        readonly paddingInline: stylex.StyleXClassNameFor<"paddingInline", "4px">;
+        readonly fontSize: stylex.StyleXClassNameFor<"fontSize", "var(--font-size-sm)">;
+        readonly lineHeight: stylex.StyleXClassNameFor<"lineHeight", "1.6667">;
+        readonly fontWeight: stylex.StyleXClassNameFor<"fontWeight", "500">;
+        readonly fontFamily: stylex.StyleXClassNameFor<"fontFamily", "-apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif">;
+        readonly color: stylex.StyleXClassNameFor<"color", "light-dark(#0A1317, #DFE2E5)">;
+    }>;
+    readonly timedEventPosition: (top: number, height: number, level: number) => readonly [Readonly<{
+        top: stylex.StyleXClassNameFor<"top", string>;
+        height: stylex.StyleXClassNameFor<"height", string>;
+        insetInlineStart: stylex.StyleXClassNameFor<"insetInlineStart", string>;
+        insetInlineEnd: stylex.StyleXClassNameFor<"insetInlineEnd", "2px">;
+        zIndex: stylex.StyleXClassNameFor<"zIndex", number>;
+    }>, stylex.InlineStyles];
+    readonly currentTimeLine: (top: number) => readonly [Readonly<{
+        position: stylex.StyleXClassNameFor<"position", "absolute">;
+        insetInline: stylex.StyleXClassNameFor<"insetInline", number>;
+        top: stylex.StyleXClassNameFor<"top", string>;
+        borderTopWidth: stylex.StyleXClassNameFor<"borderTopWidth", string>;
+        borderTopStyle: stylex.StyleXClassNameFor<"borderTopStyle", "solid">;
+        borderTopColor: stylex.StyleXClassNameFor<"borderTopColor", "light-dark(#EB6E00, #B34A01)">;
+        zIndex: stylex.StyleXClassNameFor<"zIndex", number>;
+        pointerEvents: stylex.StyleXClassNameFor<"pointerEvents", "none">;
+        '::before': stylex.StyleXClassNameFor<"::before", {
+            content: string;
+            position: "absolute";
+            insetInlineStart: string;
+            top: string;
+            width: string;
+            height: string;
+            borderRadius: stylex.StyleXVar<"9999px">;
+            backgroundColor: stylex.StyleXVar<"light-dark(#EB6E00, #B34A01)">;
+        }>;
+    }>, stylex.InlineStyles];
+    readonly list: Readonly<{
+        readonly display: stylex.StyleXClassNameFor<"display", "flex">;
+        readonly flexDirection: stylex.StyleXClassNameFor<"flexDirection", "column">;
+    }>;
+    readonly listDay: Readonly<{
+        readonly display: stylex.StyleXClassNameFor<"display", "grid">;
+        readonly gridTemplateColumns: stylex.StyleXClassNameFor<"gridTemplateColumns", "88px minmax(0, 1fr)">;
+        readonly alignItems: stylex.StyleXClassNameFor<"alignItems", "start">;
+        readonly columnGap: stylex.StyleXClassNameFor<"columnGap", "12px">;
+        readonly paddingBlock: stylex.StyleXClassNameFor<"paddingBlock", "12px">;
+        readonly paddingInline: stylex.StyleXClassNameFor<"paddingInline", "12px">;
+        readonly borderBottomWidth: stylex.StyleXClassNameFor<"borderBottomWidth", "1px">;
+        readonly borderBottomStyle: stylex.StyleXClassNameFor<"borderBottomStyle", "solid">;
+        readonly borderBottomColor: stylex.StyleXClassNameFor<"borderBottomColor", "light-dark(#05365919, #F2F4F619)">;
+    }>;
+    readonly listDayLast: Readonly<{
+        readonly borderBottomWidth: stylex.StyleXClassNameFor<"borderBottomWidth", 0>;
+    }>;
+    readonly listDayHeading: Readonly<{
+        readonly gridColumn: stylex.StyleXClassNameFor<"gridColumn", "1">;
+        readonly display: stylex.StyleXClassNameFor<"display", "inline-flex">;
+        readonly alignItems: stylex.StyleXClassNameFor<"alignItems", "center">;
+        readonly justifyContent: stylex.StyleXClassNameFor<"justifyContent", "flex-start">;
+        readonly columnGap: stylex.StyleXClassNameFor<"columnGap", "8px">;
+        readonly marginBlockStart: stylex.StyleXClassNameFor<"marginBlockStart", `calc(${stylex.StyleXVar<"4px">} * -1)`>;
+        readonly marginInlineStart: stylex.StyleXClassNameFor<"marginInlineStart", `calc(${stylex.StyleXVar<"4px">} * -1)`>;
+    }>;
+    readonly listDayNumber: Readonly<{
+        readonly display: stylex.StyleXClassNameFor<"display", "inline-flex">;
+        readonly alignItems: stylex.StyleXClassNameFor<"alignItems", "center">;
+        readonly justifyContent: stylex.StyleXClassNameFor<"justifyContent", "flex-end">;
+        readonly width: stylex.StyleXClassNameFor<"width", "30px">;
+        readonly height: stylex.StyleXClassNameFor<"height", "30px">;
+        readonly borderRadius: stylex.StyleXClassNameFor<"borderRadius", "9999px">;
+    }>;
+    readonly listDayNumberText: Readonly<{
+        readonly fontWeight: stylex.StyleXClassNameFor<"fontWeight", "700">;
+    }>;
+    readonly listDayNumberCurrent: Readonly<{
+        readonly justifyContent: stylex.StyleXClassNameFor<"justifyContent", "center">;
+        readonly color: stylex.StyleXClassNameFor<"color", "light-dark(#FFFFFF, #FFFFFF)">;
+        readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", "light-dark(#0064E0, #2694FE)">;
+    }>;
+    readonly listEvents: Readonly<{
+        readonly gridColumn: stylex.StyleXClassNameFor<"gridColumn", 2>;
+        readonly display: stylex.StyleXClassNameFor<"display", "flex">;
+        readonly flexDirection: stylex.StyleXClassNameFor<"flexDirection", "column">;
+        readonly gap: stylex.StyleXClassNameFor<"gap", "8px">;
+        readonly minWidth: stylex.StyleXClassNameFor<"minWidth", 0>;
+    }>;
+    readonly listNowRow: Readonly<{
+        readonly position: stylex.StyleXClassNameFor<"position", "relative">;
+        readonly height: stylex.StyleXClassNameFor<"height", "10px">;
+        readonly marginBlock: stylex.StyleXClassNameFor<"marginBlock", "2px">;
+        readonly '::before': stylex.StyleXClassNameFor<"::before", {
+            readonly content: "\"\"";
+            readonly position: "absolute";
+            readonly insetInline: 0;
+            readonly top: "4px";
+            readonly borderTopWidth: "2px";
+            readonly borderTopStyle: "solid";
+            readonly borderTopColor: stylex.StyleXVar<"light-dark(#EB6E00, #B34A01)">;
+        }>;
+        readonly '::after': stylex.StyleXClassNameFor<"::after", {
+            readonly content: "\"\"";
+            readonly position: "absolute";
+            readonly insetInlineStart: "-1px";
+            readonly top: 0;
+            readonly width: "10px";
+            readonly height: "10px";
+            readonly borderRadius: stylex.StyleXVar<"9999px">;
+            readonly backgroundColor: stylex.StyleXVar<"light-dark(#EB6E00, #B34A01)">;
+        }>;
+    }>;
+    readonly listEventRow: Readonly<{
+        readonly display: stylex.StyleXClassNameFor<"display", "grid">;
+        readonly gridTemplateColumns: stylex.StyleXClassNameFor<"gridTemplateColumns", "12px 144px minmax(0, 1fr)">;
+        readonly alignItems: stylex.StyleXClassNameFor<"alignItems", "center">;
+        readonly gap: stylex.StyleXClassNameFor<"gap", "8px">;
+        readonly minWidth: stylex.StyleXClassNameFor<"minWidth", 0>;
+    }>;
+    readonly listEventDot: Readonly<{
+        readonly width: stylex.StyleXClassNameFor<"width", "10px">;
+        readonly height: stylex.StyleXClassNameFor<"height", "10px">;
+        readonly borderRadius: stylex.StyleXClassNameFor<"borderRadius", "9999px">;
+    }>;
+    readonly listEventTime: Readonly<{
+        readonly color: stylex.StyleXClassNameFor<"color", "light-dark(#4E606F, #AAAFB5)">;
+        readonly fontSize: stylex.StyleXClassNameFor<"fontSize", "var(--font-size-sm)">;
+        readonly lineHeight: stylex.StyleXClassNameFor<"lineHeight", "1.6667">;
+        readonly whiteSpace: stylex.StyleXClassNameFor<"whiteSpace", "nowrap">;
+        readonly fontFamily: stylex.StyleXClassNameFor<"fontFamily", "-apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif">;
+    }>;
+    readonly listEventTitle: Readonly<{
+        readonly minWidth: stylex.StyleXClassNameFor<"minWidth", 0>;
+        readonly overflow: stylex.StyleXClassNameFor<"overflow", "hidden">;
+        readonly textOverflow: stylex.StyleXClassNameFor<"textOverflow", "ellipsis">;
+        readonly whiteSpace: stylex.StyleXClassNameFor<"whiteSpace", "nowrap">;
+        readonly fontSize: stylex.StyleXClassNameFor<"fontSize", "var(--font-size-base)">;
+        readonly lineHeight: stylex.StyleXClassNameFor<"lineHeight", "1.4286">;
+        readonly fontWeight: stylex.StyleXClassNameFor<"fontWeight", "500">;
+        readonly fontFamily: stylex.StyleXClassNameFor<"fontFamily", "-apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif">;
+        readonly color: stylex.StyleXClassNameFor<"color", "light-dark(#0A1317, #DFE2E5)">;
+    }>;
+    readonly listEventPast: Readonly<{
+        readonly opacity: stylex.StyleXClassNameFor<"opacity", 0.5>;
+    }>;
+    readonly eventBlue: Readonly<{
+        readonly color: stylex.StyleXClassNameFor<"color", "light-dark(#042F97, #AFD7FF)">;
+        readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", "light-dark(#0171E333, #0171E333)">;
+        readonly borderColor: stylex.StyleXClassNameFor<"borderColor", "light-dark(#0064E0, #2694FE)">;
+    }>;
+    readonly eventDotBlue: Readonly<{
+        readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", "light-dark(#0064E0, #2694FE)">;
+    }>;
+    readonly eventSurfaceBlue: Readonly<{
+        readonly color: stylex.StyleXClassNameFor<"color", "light-dark(#042F97, #AFD7FF)">;
+        readonly borderColor: stylex.StyleXClassNameFor<"borderColor", "light-dark(#0064E0, #2694FE)">;
+        readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", `color-mix(in srgb, ${stylex.StyleXVar<"light-dark(#0064E0, #2694FE)">} 20%, ${stylex.StyleXVar<"light-dark(#FFFFFF, #1F1F22)">})`>;
+    }>;
+    readonly eventPastSurfaceBlue: Readonly<{
+        readonly color: stylex.StyleXClassNameFor<"color", `color-mix(in srgb, ${stylex.StyleXVar<"light-dark(#042F97, #AFD7FF)">} 52%, ${stylex.StyleXVar<"light-dark(#4E606F, #AAAFB5)">})`>;
+        readonly borderColor: stylex.StyleXClassNameFor<"borderColor", `color-mix(in srgb, ${stylex.StyleXVar<"light-dark(#0064E0, #2694FE)">} 48%, ${stylex.StyleXVar<"light-dark(#05365919, #F2F4F619)">})`>;
+        readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", `color-mix(in srgb, ${stylex.StyleXVar<"light-dark(#0064E0, #2694FE)">} 10%, ${stylex.StyleXVar<"light-dark(#FFFFFF, #1F1F22)">})`>;
+    }>;
+    readonly eventCyan: Readonly<{
+        readonly color: stylex.StyleXClassNameFor<"color", "light-dark(#014975, #A1EEF9)">;
+        readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", "light-dark(#03A7D733, #03A7D733)">;
+        readonly borderColor: stylex.StyleXClassNameFor<"borderColor", "light-dark(#089DD0, #0171A4)">;
+    }>;
+    readonly eventDotCyan: Readonly<{
+        readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", "light-dark(#089DD0, #0171A4)">;
+    }>;
+    readonly eventSurfaceCyan: Readonly<{
+        readonly color: stylex.StyleXClassNameFor<"color", "light-dark(#014975, #A1EEF9)">;
+        readonly borderColor: stylex.StyleXClassNameFor<"borderColor", "light-dark(#089DD0, #0171A4)">;
+        readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", `color-mix(in srgb, ${stylex.StyleXVar<"light-dark(#089DD0, #0171A4)">} 20%, ${stylex.StyleXVar<"light-dark(#FFFFFF, #1F1F22)">})`>;
+    }>;
+    readonly eventPastSurfaceCyan: Readonly<{
+        readonly color: stylex.StyleXClassNameFor<"color", `color-mix(in srgb, ${stylex.StyleXVar<"light-dark(#014975, #A1EEF9)">} 52%, ${stylex.StyleXVar<"light-dark(#4E606F, #AAAFB5)">})`>;
+        readonly borderColor: stylex.StyleXClassNameFor<"borderColor", `color-mix(in srgb, ${stylex.StyleXVar<"light-dark(#089DD0, #0171A4)">} 48%, ${stylex.StyleXVar<"light-dark(#05365919, #F2F4F619)">})`>;
+        readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", `color-mix(in srgb, ${stylex.StyleXVar<"light-dark(#089DD0, #0171A4)">} 10%, ${stylex.StyleXVar<"light-dark(#FFFFFF, #1F1F22)">})`>;
+    }>;
+    readonly eventGray: Readonly<{
+        readonly color: stylex.StyleXClassNameFor<"color", "light-dark(#0A1317, #E7EAED)">;
+        readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", "light-dark(#0A131733, #666A724C)">;
+        readonly borderColor: stylex.StyleXClassNameFor<"borderColor", "light-dark(#647685, #748695)">;
+    }>;
+    readonly eventDotGray: Readonly<{
+        readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", "light-dark(#4E606F, #AAAFB5)">;
+    }>;
+    readonly eventSurfaceGray: Readonly<{
+        readonly color: stylex.StyleXClassNameFor<"color", "light-dark(#0A1317, #E7EAED)">;
+        readonly borderColor: stylex.StyleXClassNameFor<"borderColor", "light-dark(#647685, #748695)">;
+        readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", `color-mix(in srgb, ${stylex.StyleXVar<"light-dark(#647685, #748695)">} 20%, ${stylex.StyleXVar<"light-dark(#FFFFFF, #1F1F22)">})`>;
+    }>;
+    readonly eventPastSurfaceGray: Readonly<{
+        readonly color: stylex.StyleXClassNameFor<"color", "light-dark(#4E606F, #AAAFB5)">;
+        readonly borderColor: stylex.StyleXClassNameFor<"borderColor", "light-dark(#05365919, #F2F4F619)">;
+        readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", `color-mix(in srgb, ${stylex.StyleXVar<"light-dark(#647685, #748695)">} 10%, ${stylex.StyleXVar<"light-dark(#FFFFFF, #1F1F22)">})`>;
+    }>;
+    readonly eventGreen: Readonly<{
+        readonly color: stylex.StyleXClassNameFor<"color", "light-dark(#09441F, #A5F690)">;
+        readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", "light-dark(#24BB5E33, #24BB5E33)">;
+        readonly borderColor: stylex.StyleXClassNameFor<"borderColor", "light-dark(#0D8626, #0B991F)">;
+    }>;
+    readonly eventDotGreen: Readonly<{
+        readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", "light-dark(#0D8626, #0B991F)">;
+    }>;
+    readonly eventSurfaceGreen: Readonly<{
+        readonly color: stylex.StyleXClassNameFor<"color", "light-dark(#09441F, #A5F690)">;
+        readonly borderColor: stylex.StyleXClassNameFor<"borderColor", "light-dark(#0D8626, #0B991F)">;
+        readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", `color-mix(in srgb, ${stylex.StyleXVar<"light-dark(#0D8626, #0B991F)">} 20%, ${stylex.StyleXVar<"light-dark(#FFFFFF, #1F1F22)">})`>;
+    }>;
+    readonly eventPastSurfaceGreen: Readonly<{
+        readonly color: stylex.StyleXClassNameFor<"color", `color-mix(in srgb, ${stylex.StyleXVar<"light-dark(#09441F, #A5F690)">} 52%, ${stylex.StyleXVar<"light-dark(#4E606F, #AAAFB5)">})`>;
+        readonly borderColor: stylex.StyleXClassNameFor<"borderColor", `color-mix(in srgb, ${stylex.StyleXVar<"light-dark(#0D8626, #0B991F)">} 48%, ${stylex.StyleXVar<"light-dark(#05365919, #F2F4F619)">})`>;
+        readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", `color-mix(in srgb, ${stylex.StyleXVar<"light-dark(#0D8626, #0B991F)">} 10%, ${stylex.StyleXVar<"light-dark(#FFFFFF, #1F1F22)">})`>;
+    }>;
+    readonly eventOrange: Readonly<{
+        readonly color: stylex.StyleXClassNameFor<"color", "light-dark(#6B2203, #FDB876)">;
+        readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", "light-dark(#F2790233, #F2790233)">;
+        readonly borderColor: stylex.StyleXClassNameFor<"borderColor", "light-dark(#EB6E00, #B34A01)">;
+    }>;
+    readonly eventDotOrange: Readonly<{
+        readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", "light-dark(#EB6E00, #B34A01)">;
+    }>;
+    readonly eventSurfaceOrange: Readonly<{
+        readonly color: stylex.StyleXClassNameFor<"color", "light-dark(#6B2203, #FDB876)">;
+        readonly borderColor: stylex.StyleXClassNameFor<"borderColor", "light-dark(#EB6E00, #B34A01)">;
+        readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", `color-mix(in srgb, ${stylex.StyleXVar<"light-dark(#EB6E00, #B34A01)">} 20%, ${stylex.StyleXVar<"light-dark(#FFFFFF, #1F1F22)">})`>;
+    }>;
+    readonly eventPastSurfaceOrange: Readonly<{
+        readonly color: stylex.StyleXClassNameFor<"color", `color-mix(in srgb, ${stylex.StyleXVar<"light-dark(#6B2203, #FDB876)">} 52%, ${stylex.StyleXVar<"light-dark(#4E606F, #AAAFB5)">})`>;
+        readonly borderColor: stylex.StyleXClassNameFor<"borderColor", `color-mix(in srgb, ${stylex.StyleXVar<"light-dark(#EB6E00, #B34A01)">} 48%, ${stylex.StyleXVar<"light-dark(#05365919, #F2F4F619)">})`>;
+        readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", `color-mix(in srgb, ${stylex.StyleXVar<"light-dark(#EB6E00, #B34A01)">} 10%, ${stylex.StyleXVar<"light-dark(#FFFFFF, #1F1F22)">})`>;
+    }>;
+    readonly eventPink: Readonly<{
+        readonly color: stylex.StyleXClassNameFor<"color", "light-dark(#650053, #FEADE3)">;
+        readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", "light-dark(#E638B333, #E638B333)">;
+        readonly borderColor: stylex.StyleXClassNameFor<"borderColor", "light-dark(#F351C0, #C02294)">;
+    }>;
+    readonly eventDotPink: Readonly<{
+        readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", "light-dark(#F351C0, #C02294)">;
+    }>;
+    readonly eventSurfacePink: Readonly<{
+        readonly color: stylex.StyleXClassNameFor<"color", "light-dark(#650053, #FEADE3)">;
+        readonly borderColor: stylex.StyleXClassNameFor<"borderColor", "light-dark(#F351C0, #C02294)">;
+        readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", `color-mix(in srgb, ${stylex.StyleXVar<"light-dark(#F351C0, #C02294)">} 20%, ${stylex.StyleXVar<"light-dark(#FFFFFF, #1F1F22)">})`>;
+    }>;
+    readonly eventPastSurfacePink: Readonly<{
+        readonly color: stylex.StyleXClassNameFor<"color", `color-mix(in srgb, ${stylex.StyleXVar<"light-dark(#650053, #FEADE3)">} 52%, ${stylex.StyleXVar<"light-dark(#4E606F, #AAAFB5)">})`>;
+        readonly borderColor: stylex.StyleXClassNameFor<"borderColor", `color-mix(in srgb, ${stylex.StyleXVar<"light-dark(#F351C0, #C02294)">} 48%, ${stylex.StyleXVar<"light-dark(#05365919, #F2F4F619)">})`>;
+        readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", `color-mix(in srgb, ${stylex.StyleXVar<"light-dark(#F351C0, #C02294)">} 10%, ${stylex.StyleXVar<"light-dark(#FFFFFF, #1F1F22)">})`>;
+    }>;
+    readonly eventPurple: Readonly<{
+        readonly color: stylex.StyleXClassNameFor<"color", "light-dark(#3E0697, #B3B0FE)">;
+        readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", "light-dark(#7952FF33, #7952FF33)">;
+        readonly borderColor: stylex.StyleXClassNameFor<"borderColor", "light-dark(#9081FF, #7340FE)">;
+    }>;
+    readonly eventDotPurple: Readonly<{
+        readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", "light-dark(#9081FF, #7340FE)">;
+    }>;
+    readonly eventSurfacePurple: Readonly<{
+        readonly color: stylex.StyleXClassNameFor<"color", "light-dark(#3E0697, #B3B0FE)">;
+        readonly borderColor: stylex.StyleXClassNameFor<"borderColor", "light-dark(#9081FF, #7340FE)">;
+        readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", `color-mix(in srgb, ${stylex.StyleXVar<"light-dark(#9081FF, #7340FE)">} 20%, ${stylex.StyleXVar<"light-dark(#FFFFFF, #1F1F22)">})`>;
+    }>;
+    readonly eventPastSurfacePurple: Readonly<{
+        readonly color: stylex.StyleXClassNameFor<"color", `color-mix(in srgb, ${stylex.StyleXVar<"light-dark(#3E0697, #B3B0FE)">} 52%, ${stylex.StyleXVar<"light-dark(#4E606F, #AAAFB5)">})`>;
+        readonly borderColor: stylex.StyleXClassNameFor<"borderColor", `color-mix(in srgb, ${stylex.StyleXVar<"light-dark(#9081FF, #7340FE)">} 48%, ${stylex.StyleXVar<"light-dark(#05365919, #F2F4F619)">})`>;
+        readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", `color-mix(in srgb, ${stylex.StyleXVar<"light-dark(#9081FF, #7340FE)">} 10%, ${stylex.StyleXVar<"light-dark(#FFFFFF, #1F1F22)">})`>;
+    }>;
+    readonly eventRed: Readonly<{
+        readonly color: stylex.StyleXClassNameFor<"color", "light-dark(#7B0210, #FFB2B8)">;
+        readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", "light-dark(#E3193B33, #E3193B33)">;
+        readonly borderColor: stylex.StyleXClassNameFor<"borderColor", "light-dark(#E3193B, #F5394F)">;
+    }>;
+    readonly eventDotRed: Readonly<{
+        readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", "light-dark(#E3193B, #F5394F)">;
+    }>;
+    readonly eventSurfaceRed: Readonly<{
+        readonly color: stylex.StyleXClassNameFor<"color", "light-dark(#7B0210, #FFB2B8)">;
+        readonly borderColor: stylex.StyleXClassNameFor<"borderColor", "light-dark(#E3193B, #F5394F)">;
+        readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", `color-mix(in srgb, ${stylex.StyleXVar<"light-dark(#E3193B, #F5394F)">} 20%, ${stylex.StyleXVar<"light-dark(#FFFFFF, #1F1F22)">})`>;
+    }>;
+    readonly eventPastSurfaceRed: Readonly<{
+        readonly color: stylex.StyleXClassNameFor<"color", `color-mix(in srgb, ${stylex.StyleXVar<"light-dark(#7B0210, #FFB2B8)">} 52%, ${stylex.StyleXVar<"light-dark(#4E606F, #AAAFB5)">})`>;
+        readonly borderColor: stylex.StyleXClassNameFor<"borderColor", `color-mix(in srgb, ${stylex.StyleXVar<"light-dark(#E3193B, #F5394F)">} 48%, ${stylex.StyleXVar<"light-dark(#05365919, #F2F4F619)">})`>;
+        readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", `color-mix(in srgb, ${stylex.StyleXVar<"light-dark(#E3193B, #F5394F)">} 10%, ${stylex.StyleXVar<"light-dark(#FFFFFF, #1F1F22)">})`>;
+    }>;
+    readonly eventTeal: Readonly<{
+        readonly color: stylex.StyleXClassNameFor<"color", "light-dark(#083943, #40DCCD)">;
+        readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", "light-dark(#0DB7AF33, #0DB7AF33)">;
+        readonly borderColor: stylex.StyleXClassNameFor<"borderColor", "light-dark(#08A3A3, #08767D)">;
+    }>;
+    readonly eventDotTeal: Readonly<{
+        readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", "light-dark(#08A3A3, #08767D)">;
+    }>;
+    readonly eventSurfaceTeal: Readonly<{
+        readonly color: stylex.StyleXClassNameFor<"color", "light-dark(#083943, #40DCCD)">;
+        readonly borderColor: stylex.StyleXClassNameFor<"borderColor", "light-dark(#08A3A3, #08767D)">;
+        readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", `color-mix(in srgb, ${stylex.StyleXVar<"light-dark(#08A3A3, #08767D)">} 20%, ${stylex.StyleXVar<"light-dark(#FFFFFF, #1F1F22)">})`>;
+    }>;
+    readonly eventPastSurfaceTeal: Readonly<{
+        readonly color: stylex.StyleXClassNameFor<"color", `color-mix(in srgb, ${stylex.StyleXVar<"light-dark(#083943, #40DCCD)">} 52%, ${stylex.StyleXVar<"light-dark(#4E606F, #AAAFB5)">})`>;
+        readonly borderColor: stylex.StyleXClassNameFor<"borderColor", `color-mix(in srgb, ${stylex.StyleXVar<"light-dark(#08A3A3, #08767D)">} 48%, ${stylex.StyleXVar<"light-dark(#05365919, #F2F4F619)">})`>;
+        readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", `color-mix(in srgb, ${stylex.StyleXVar<"light-dark(#08A3A3, #08767D)">} 10%, ${stylex.StyleXVar<"light-dark(#FFFFFF, #1F1F22)">})`>;
+    }>;
+    readonly eventYellow: Readonly<{
+        readonly color: stylex.StyleXClassNameFor<"color", "light-dark(#753F07, #FBCE03)">;
+        readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", "light-dark(#E2A40033, #E2A40033)">;
+        readonly borderColor: stylex.StyleXClassNameFor<"borderColor", "light-dark(#C58600, #B47700)">;
+    }>;
+    readonly eventDotYellow: Readonly<{
+        readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", "light-dark(#C58600, #B47700)">;
+    }>;
+    readonly eventSurfaceYellow: Readonly<{
+        readonly color: stylex.StyleXClassNameFor<"color", "light-dark(#753F07, #FBCE03)">;
+        readonly borderColor: stylex.StyleXClassNameFor<"borderColor", "light-dark(#C58600, #B47700)">;
+        readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", `color-mix(in srgb, ${stylex.StyleXVar<"light-dark(#C58600, #B47700)">} 20%, ${stylex.StyleXVar<"light-dark(#FFFFFF, #1F1F22)">})`>;
+    }>;
+    readonly eventPastSurfaceYellow: Readonly<{
+        readonly color: stylex.StyleXClassNameFor<"color", `color-mix(in srgb, ${stylex.StyleXVar<"light-dark(#753F07, #FBCE03)">} 52%, ${stylex.StyleXVar<"light-dark(#4E606F, #AAAFB5)">})`>;
+        readonly borderColor: stylex.StyleXClassNameFor<"borderColor", `color-mix(in srgb, ${stylex.StyleXVar<"light-dark(#C58600, #B47700)">} 48%, ${stylex.StyleXVar<"light-dark(#05365919, #F2F4F619)">})`>;
+        readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", `color-mix(in srgb, ${stylex.StyleXVar<"light-dark(#C58600, #B47700)">} 10%, ${stylex.StyleXVar<"light-dark(#FFFFFF, #1F1F22)">})`>;
+    }>;
+}>;
+//# sourceMappingURL=shared.d.ts.map