@dxos/react-ui-calendar 0.8.4-main.bc674ce → 0.8.4-main.c351d160a8

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (14) hide show
  1. package/dist/lib/browser/index.mjs +21 -34
  2. package/dist/lib/browser/index.mjs.map +3 -3
  3. package/dist/lib/browser/meta.json +1 -1
  4. package/dist/lib/node-esm/index.mjs +21 -34
  5. package/dist/lib/node-esm/index.mjs.map +3 -3
  6. package/dist/lib/node-esm/meta.json +1 -1
  7. package/dist/types/src/components/Calendar/Calendar.d.ts +3 -8
  8. package/dist/types/src/components/Calendar/Calendar.d.ts.map +1 -1
  9. package/dist/types/src/components/Calendar/Calendar.stories.d.ts +1 -5
  10. package/dist/types/src/components/Calendar/Calendar.stories.d.ts.map +1 -1
  11. package/dist/types/tsconfig.tsbuildinfo +1 -1
  12. package/package.json +15 -16
  13. package/src/components/Calendar/Calendar.stories.tsx +14 -39
  14. package/src/components/Calendar/Calendar.tsx +31 -44
package/dist/lib/browser/index.mjs CHANGED
@@ -61,16 +61,10 @@ var CalendarRoot = /* @__PURE__ */ forwardRef(({ children, weekStartsOn = 1 }, f
61
61
  setSelected
62
62
  }, children);
63
63
  });
64
- var CalendarViewport = ({ children, classNames }) => {
65
- return /* @__PURE__ */ React.createElement("div", {
66
- role: "none",
67
- className: mx("flex flex-col items-center overflow-hidden bg-inputSurface", classNames)
68
- }, children);
69
- };
70
- CalendarViewport.displayName = "CalendarContent";
71
- var CalendarToolbar = ({ classNames }) => {
64
+ var CALENDAR_TOOLBAR_NAME = "CalendarHeader";
65
+ var CalendarToolbar = ({ classNames, ...props }) => {
72
66
  const { t } = useTranslation(translationKey);
73
- const { weekStartsOn, event, index, selected } = useCalendarContext(CalendarToolbar.displayName);
67
+ const { weekStartsOn, event, index, selected } = useCalendarContext(CALENDAR_TOOLBAR_NAME);
74
68
  const top = useMemo(() => getDate(start, index ?? 0, 6, weekStartsOn), [
75
69
  index,
76
70
  weekStartsOn
@@ -87,8 +81,9 @@ var CalendarToolbar = ({ classNames }) => {
87
81
  today
88
82
  ]);
89
83
  return /* @__PURE__ */ React.createElement("div", {
84
+ ...props,
90
85
  role: "none",
91
- className: mx("shink-0 is-full grid grid-cols-3 items-center bg-barSurface", classNames),
86
+ className: mx("shrink-0 grid grid-cols-3 items-center bg-toolbar-surface", classNames),
92
87
  style: {
93
88
  width: defaultWidth
94
89
  }
@@ -108,9 +103,10 @@ var CalendarToolbar = ({ classNames }) => {
108
103
  className: "flex justify-end p-2 text-description"
109
104
  }, (selected ?? top).getFullYear()));
110
105
  };
111
- CalendarToolbar.displayName = "CalendarHeader";
112
- var CalendarGrid = ({ classNames, rows, onSelect }) => {
113
- const { weekStartsOn, event, setIndex, selected, setSelected } = useCalendarContext(CalendarGrid.displayName);
106
+ CalendarToolbar.displayName = CALENDAR_TOOLBAR_NAME;
107
+ var CALENDAR_GRID_NAME = "CalendarGrid";
108
+ var CalendarGrid = ({ classNames, rows, onSelect, ...props }) => {
109
+ const { weekStartsOn, event, setIndex, selected, setSelected } = useCalendarContext(CALENDAR_GRID_NAME);
114
110
  const { ref: containerRef, width = 0, height = 0 } = useResizeDetector();
115
111
  const maxHeight = rows ? rows * size : void 0;
116
112
  const listRef = useRef(null);
@@ -163,18 +159,16 @@ var CalendarGrid = ({ classNames, rows, onSelect }) => {
163
159
  setIndex(Math.round(info.scrollTop / size));
164
160
  }, []);
165
161
  const rowRenderer = useCallback(({ key, index, style }) => {
166
- const getBgColor = (date) => date.getMonth() % 2 === 0 && "bg-modalSurface";
162
+ const getBgColor = (date) => date.getMonth() % 2 === 0 && "bg-modal-surface";
167
163
  return /* @__PURE__ */ React.createElement("div", {
168
164
  key,
165
+ ...props,
169
166
  role: "none",
170
167
  style,
171
- className: "is-full grid grid-cols-[1fr_max-content_1fr] snap-center"
168
+ className: "grid"
172
169
  }, /* @__PURE__ */ React.createElement("div", {
173
170
  role: "none",
174
- className: mx(getBgColor(getDate(start, index, 0, weekStartsOn)))
175
- }), /* @__PURE__ */ React.createElement("div", {
176
- role: "none",
177
- className: "grid grid-cols-7",
171
+ className: "grid grid-cols-7 bg-input-surface",
178
172
  style: {
179
173
  gridTemplateColumns: `repeat(7, ${size}px)`
180
174
  }
@@ -195,15 +189,13 @@ var CalendarGrid = ({ classNames, rows, onSelect }) => {
195
189
  className: "absolute top-0 text-xs text-description"
196
190
  }, format(date, "MMM")), border && /* @__PURE__ */ React.createElement("div", {
197
191
  role: "none",
198
- className: mx("absolute top-0 left-0 is-full bs-full border-2 rounded-full", border)
192
+ className: mx("absolute top-0 left-0 w-full h-full border-2 rounded-full", border)
199
193
  }), num > 0 && /* @__PURE__ */ React.createElement(Icon, {
200
194
  classNames: "absolute bottom-0",
201
195
  icon: num > 3 ? "ph--dots-three--regular" : "ph--dot--regular",
202
196
  size: 5
203
197
  }));
204
- })), /* @__PURE__ */ React.createElement("div", {
205
- className: mx(getBgColor(getDate(start, index, 6, weekStartsOn)))
206
- }));
198
+ })));
207
199
  }, [
208
200
  handleDaySelect,
209
201
  getNumAppointments,
@@ -212,13 +204,10 @@ var CalendarGrid = ({ classNames, rows, onSelect }) => {
212
204
  ]);
213
205
  return /* @__PURE__ */ React.createElement("div", {
214
206
  role: "none",
215
- className: mx("flex flex-col bs-full is-full justify-center overflow-hidden", classNames)
216
- }, /* @__PURE__ */ React.createElement("div", {
217
- role: "none",
218
- className: "flex justify-center bg-groupSurface"
207
+ className: mx("flex flex-col h-full w-full justify-center overflow-hidden", classNames)
219
208
  }, /* @__PURE__ */ React.createElement("div", {
220
209
  role: "none",
221
- className: "flex is-full grid grid-cols-7",
210
+ className: "grid w-full grid-cols-7",
222
211
  style: {
223
212
  width: defaultWidth
224
213
  }
@@ -226,15 +215,14 @@ var CalendarGrid = ({ classNames, rows, onSelect }) => {
226
215
  key: i,
227
216
  role: "none",
228
217
  className: "flex justify-center p-2 text-sm font-thin"
229
- }, date)))), /* @__PURE__ */ React.createElement("div", {
218
+ }, date))), /* @__PURE__ */ React.createElement("div", {
230
219
  role: "none",
231
- className: "flex flex-col bs-full is-full justify-center overflow-hidden",
220
+ className: "flex flex-col h-full w-full justify-center overflow-hidden",
232
221
  ref: containerRef
233
222
  }, /* @__PURE__ */ React.createElement(List, {
234
223
  ref: listRef,
235
224
  role: "none",
236
- // TODO(burdon): Snap isn't working.
237
- className: "[&>div]:snap-y scrollbar-none outline-none",
225
+ className: "scrollbar-none outline-hidden",
238
226
  width,
239
227
  height: maxHeight ?? height,
240
228
  rowCount: maxRows,
@@ -245,10 +233,9 @@ var CalendarGrid = ({ classNames, rows, onSelect }) => {
245
233
  onRowsRendered: () => setInitialized(true)
246
234
  })));
247
235
  };
248
- CalendarGrid.displayName = "CalendarGrid";
236
+ CalendarGrid.displayName = CALENDAR_GRID_NAME;
249
237
  var Calendar = {
250
238
  Root: CalendarRoot,
251
- Viewport: CalendarViewport,
252
239
  Toolbar: CalendarToolbar,
253
240
  Grid: CalendarGrid
254
241
  };
package/dist/lib/browser/index.mjs.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../src/components/Calendar/Calendar.tsx", "../../../src/translations.ts", "../../../src/components/Calendar/util.ts"],
4
- "sourcesContent": ["//\n// Copyright 2025 DXOS.org\n//\n\nimport { createContext } from '@radix-ui/react-context';\nimport { type Day, addDays, differenceInWeeks, format, startOfWeek } from 'date-fns';\nimport React, {\n type Dispatch,\n type PropsWithChildren,\n type SetStateAction,\n forwardRef,\n useCallback,\n useEffect,\n useImperativeHandle,\n useMemo,\n useRef,\n useState,\n} from 'react';\nimport { useResizeDetector } from 'react-resize-detector';\nimport { List, type ListProps, type ListRowRenderer } from 'react-virtualized';\n\nimport { Event } from '@dxos/async';\nimport { Icon, IconButton, type ThemedClassName, useTranslation } from '@dxos/react-ui';\nimport { mx } from '@dxos/ui-theme';\n\nimport { translationKey } from '../../translations';\n\nimport { getDate, isSameDay } from './util';\n\nconst maxRows = 50 * 100;\nconst start = new Date('1970-01-01');\nconst size = 48;\nconst defaultWidth = 7 * size;\n\n//\n// Context\n//\n\ntype CalendarEvent = {\n type: 'scroll';\n date: Date;\n};\n\ntype CalendarContextValue = {\n weekStartsOn: Day;\n event: Event<CalendarEvent>;\n index: number | undefined;\n setIndex: Dispatch<SetStateAction<number | undefined>>;\n selected: Date | undefined;\n setSelected: Dispatch<SetStateAction<Date | undefined>>;\n};\n\nconst [CalendarContextProvider, useCalendarContext] = createContext<CalendarContextValue>('Calendar');\n\n//\n// Controller\n//\n\ntype CalendarController = {\n scrollTo: (date: Date) => void;\n};\n\n//\n// Root\n//\n\ntype CalendarRootProps = PropsWithChildren<Partial<Pick<CalendarContextValue, 'weekStartsOn'>>>;\n\nconst CalendarRoot = forwardRef<CalendarController, CalendarRootProps>(\n ({ children, weekStartsOn = 1 }, forwardedRef) => {\n const event = useMemo(() => new Event<CalendarEvent>(), []);\n const [selected, setSelected] = useState<Date | undefined>();\n const [index, setIndex] = useState<number | undefined>();\n\n useImperativeHandle(\n forwardedRef,\n () => ({\n scrollTo: (date: Date) => {\n event.emit({ type: 'scroll', date });\n },\n }),\n [event],\n );\n\n return (\n <CalendarContextProvider\n weekStartsOn={weekStartsOn}\n event={event}\n index={index}\n setIndex={setIndex}\n selected={selected}\n setSelected={setSelected}\n >\n {children}\n </CalendarContextProvider>\n );\n },\n);\n\n//\n// Viewport\n//\n\ntype CalendarViewportProps = PropsWithChildren<ThemedClassName>;\n\nconst CalendarViewport = ({ children, classNames }: CalendarViewportProps) => {\n return (\n <div role='none' className={mx('flex flex-col items-center overflow-hidden bg-inputSurface', classNames)}>\n {children}\n </div>\n );\n};\n\nCalendarViewport.displayName = 'CalendarContent';\n\n//\n// Header\n//\n\ntype CalendarToolbarProps = ThemedClassName;\n\nconst CalendarToolbar = ({ classNames }: CalendarToolbarProps) => {\n const { t } = useTranslation(translationKey);\n const { weekStartsOn, event, index, selected } = useCalendarContext(CalendarToolbar.displayName);\n const top = useMemo(() => getDate(start, index ?? 0, 6, weekStartsOn), [index, weekStartsOn]);\n const today = useMemo(() => new Date(), []);\n\n const handleToday = useCallback(() => {\n event.emit({ type: 'scroll', date: today });\n }, [event, start, today]);\n\n return (\n <div\n role='none'\n className={mx('shink-0 is-full grid grid-cols-3 items-center bg-barSurface', classNames)}\n style={{ width: defaultWidth }}\n >\n <div className='flex justify-start'>\n <IconButton\n variant='ghost'\n size={5}\n icon='ph--calendar--regular'\n iconOnly\n classNames='aspect-square'\n label={t('today button')}\n onClick={handleToday}\n />\n </div>\n <div className='flex justify-center p-2 text-description'>{format(selected ?? top, 'MMMM')}</div>\n <div className='flex justify-end p-2 text-description'>{(selected ?? top).getFullYear()}</div>\n </div>\n );\n};\n\nCalendarToolbar.displayName = 'CalendarHeader';\n\n//\n// Grid\n// TODO(burdon): Key nav.\n// TODO(burdon): Drag range.\n//\n\ntype CalendarGridProps = ThemedClassName<{\n rows?: number;\n onSelect?: (event: { date: Date }) => void;\n}>;\n\nconst CalendarGrid = ({ classNames, rows, onSelect }: CalendarGridProps) => {\n const { weekStartsOn, event, setIndex, selected, setSelected } = useCalendarContext(CalendarGrid.displayName);\n const { ref: containerRef, width = 0, height = 0 } = useResizeDetector();\n const maxHeight = rows ? rows * size : undefined;\n const listRef = useRef<List>(null);\n const today = useMemo(() => new Date(), []);\n\n const [initialized, setInitialized] = useState(false);\n useEffect(() => {\n const index = differenceInWeeks(today, start);\n listRef.current?.scrollToRow(index);\n }, [initialized, start, today]);\n\n useEffect(() => {\n return event.on((event) => {\n switch (event.type) {\n case 'scroll': {\n const index = differenceInWeeks(event.date, start);\n listRef.current?.scrollToRow(index);\n break;\n }\n }\n });\n }, [event]);\n\n const days = useMemo(() => {\n const weekStart = startOfWeek(new Date(), { weekStartsOn });\n return Array.from({ length: 7 }, (_, i) => {\n const day = addDays(weekStart, i);\n return format(day, 'EEE'); // Short day name (Mon, Tue, etc.)\n });\n }, []);\n\n // TODO(burdon): Get info by range.\n // TODO(burdon): Border marker for \"all day events?\"\n const getNumAppointments = useCallback((_date: Date) => {\n // return Math.floor(Math.random() * 10);\n return 0;\n }, []);\n\n const handleDaySelect = useCallback(\n (date: Date) => {\n setSelected((current) => (isSameDay(date, current) ? undefined : date));\n onSelect?.({ date });\n },\n [onSelect],\n );\n\n const handleScroll = useCallback<NonNullable<ListProps['onScroll']>>((info) => {\n setIndex(Math.round(info.scrollTop / size));\n }, []);\n\n const rowRenderer = useCallback<ListRowRenderer>(\n ({ key, index, style }) => {\n const getBgColor = (date: Date) => date.getMonth() % 2 === 0 && 'bg-modalSurface';\n return (\n <div key={key} role='none' style={style} className='is-full grid grid-cols-[1fr_max-content_1fr] snap-center'>\n <div role='none' className={mx(getBgColor(getDate(start, index, 0, weekStartsOn)))} />\n <div role='none' className='grid grid-cols-7' style={{ gridTemplateColumns: `repeat(7, ${size}px)` }}>\n {Array.from({ length: 7 }).map((_, i) => {\n const date = getDate(start, index, i, weekStartsOn);\n const num = getNumAppointments(date);\n const border = isSameDay(date, selected)\n ? 'border-primary-500'\n : isSameDay(date, today)\n ? 'border-amber-500'\n : undefined;\n\n return (\n <div\n key={i}\n role='none'\n className={mx('relative flex justify-center items-center cursor-pointer', getBgColor(date))}\n onClick={() => handleDaySelect(date)}\n >\n <span className='text-description'>{date.getDate()}</span>\n {!border && date.getDate() === 1 && (\n <span className='absolute top-0 text-xs text-description'>{format(date, 'MMM')}</span>\n )}\n {border && (\n <div\n role='none'\n className={mx('absolute top-0 left-0 is-full bs-full border-2 rounded-full', border)}\n />\n )}\n {num > 0 && (\n <Icon\n classNames='absolute bottom-0'\n icon={num > 3 ? 'ph--dots-three--regular' : 'ph--dot--regular'}\n size={5}\n />\n )}\n </div>\n );\n })}\n </div>\n <div className={mx(getBgColor(getDate(start, index, 6, weekStartsOn)))} />\n </div>\n );\n },\n [handleDaySelect, getNumAppointments, selected, weekStartsOn],\n );\n\n return (\n <div role='none' className={mx('flex flex-col bs-full is-full justify-center overflow-hidden', classNames)}>\n {/* Day labels */}\n <div role='none' className='flex justify-center bg-groupSurface'>\n <div role='none' className='flex is-full grid grid-cols-7' style={{ width: defaultWidth }}>\n {days.map((date, i) => (\n <div key={i} role='none' className='flex justify-center p-2 text-sm font-thin'>\n {date}\n </div>\n ))}\n </div>\n </div>\n\n {/* Grid */}\n <div role='none' className='flex flex-col bs-full is-full justify-center overflow-hidden' ref={containerRef}>\n <List\n ref={listRef}\n role='none'\n // TODO(burdon): Snap isn't working.\n className='[&>div]:snap-y scrollbar-none outline-none'\n width={width}\n height={maxHeight ?? height}\n rowCount={maxRows}\n rowHeight={size}\n rowRenderer={rowRenderer}\n scrollToAlignment='start'\n onScroll={handleScroll}\n onRowsRendered={() => setInitialized(true)}\n />\n </div>\n </div>\n );\n};\n\nCalendarGrid.displayName = 'CalendarGrid';\n\n//\n// Calendar\n//\n\nexport const Calendar = {\n Root: CalendarRoot,\n Viewport: CalendarViewport,\n Toolbar: CalendarToolbar,\n Grid: CalendarGrid,\n};\n\nexport type { CalendarController, CalendarRootProps, CalendarViewportProps, CalendarToolbarProps, CalendarGridProps };\n", "//\n// Copyright 2023 DXOS.org\n//\n\nimport { type Resource } from '@dxos/react-ui';\n\nexport const translationKey = '@dxos/react-ui-calendar';\n\nexport const translations = [\n {\n 'en-US': {\n [translationKey]: {\n 'today button': 'Today',\n },\n },\n },\n] as const satisfies Resource[];\n", "//\n// Copyright 2025 DXOS.org\n//\n\nimport { type Day } from 'date-fns';\n\nexport const getDate = (start: Date, weekNumber: number, dayOfWeek: number, weekStartsOn: Day): Date => {\n const result = new Date(start);\n const startDayOfWeek = start.getDay(); // 0 = Sunday, 1 = Monday, etc.\n const adjustedStartDay = (startDayOfWeek === 0 ? 7 : startDayOfWeek) - weekStartsOn; // Adjust for weekStartsOn.\n result.setDate(start.getDate() - adjustedStartDay + weekNumber * 7 + dayOfWeek);\n return result;\n};\n\nexport const isSameDay = (date1: Date, date2: Date | undefined): boolean => {\n return (\n !!date2 &&\n date1.getFullYear() === date2.getFullYear() &&\n date1.getMonth() === date2.getMonth() &&\n date1.getDate() === date2.getDate()\n );\n};\n"],
5
- "mappings": "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",
6
- "names": ["createContext", "addDays", "differenceInWeeks", "format", "startOfWeek", "React", "forwardRef", "useCallback", "useEffect", "useImperativeHandle", "useMemo", "useRef", "useState", "useResizeDetector", "List", "Event", "Icon", "IconButton", "useTranslation", "mx", "translationKey", "translations", "getDate", "start", "weekNumber", "dayOfWeek", "weekStartsOn", "result", "Date", "startDayOfWeek", "getDay", "adjustedStartDay", "setDate", "isSameDay", "date1", "date2", "getFullYear", "getMonth", "maxRows", "start", "Date", "size", "defaultWidth", "CalendarContextProvider", "useCalendarContext", "createContext", "CalendarRoot", "forwardRef", "children", "weekStartsOn", "forwardedRef", "event", "useMemo", "Event", "selected", "setSelected", "useState", "index", "setIndex", "useImperativeHandle", "scrollTo", "date", "emit", "type", "CalendarViewport", "classNames", "div", "role", "className", "mx", "displayName", "CalendarToolbar", "t", "useTranslation", "translationKey", "top", "getDate", "today", "handleToday", "useCallback", "style", "width", "IconButton", "variant", "icon", "iconOnly", "label", "onClick", "format", "getFullYear", "CalendarGrid", "rows", "onSelect", "ref", "containerRef", "height", "useResizeDetector", "maxHeight", "undefined", "listRef", "useRef", "initialized", "setInitialized", "useEffect", "differenceInWeeks", "current", "scrollToRow", "on", "days", "weekStart", "startOfWeek", "Array", "from", "length", "_", "i", "day", "addDays", "getNumAppointments", "_date", "handleDaySelect", "isSameDay", "handleScroll", "info", "Math", "round", "scrollTop", "rowRenderer", "key", "getBgColor", "getMonth", "gridTemplateColumns", "map", "num", "border", "span", "Icon", "List", "rowCount", "rowHeight", "scrollToAlignment", "onScroll", "onRowsRendered", "Calendar", "Root", "Viewport", "Toolbar", "Grid"]
4
+ "sourcesContent": ["//\n// Copyright 2025 DXOS.org\n//\n\nimport { createContext } from '@radix-ui/react-context';\nimport { type Day, addDays, differenceInWeeks, format, startOfWeek } from 'date-fns';\nimport React, {\n type Dispatch,\n type PropsWithChildren,\n type SetStateAction,\n forwardRef,\n useCallback,\n useEffect,\n useImperativeHandle,\n useMemo,\n useRef,\n useState,\n} from 'react';\nimport { useResizeDetector } from 'react-resize-detector';\nimport { List, type ListProps, type ListRowRenderer } from 'react-virtualized';\n\nimport { Event } from '@dxos/async';\nimport { Icon, IconButton, type ThemedClassName, useTranslation } from '@dxos/react-ui';\nimport { mx } from '@dxos/ui-theme';\n\nimport { translationKey } from '../../translations';\n\nimport { getDate, isSameDay } from './util';\n\nconst maxRows = 50 * 100;\nconst start = new Date('1970-01-01');\nconst size = 48;\nconst defaultWidth = 7 * size;\n\n//\n// Context\n//\n\ntype CalendarEvent = {\n type: 'scroll';\n date: Date;\n};\n\ntype CalendarContextValue = {\n weekStartsOn: Day;\n event: Event<CalendarEvent>;\n index: number | undefined;\n setIndex: Dispatch<SetStateAction<number | undefined>>;\n selected: Date | undefined;\n setSelected: Dispatch<SetStateAction<Date | undefined>>;\n};\n\nconst [CalendarContextProvider, useCalendarContext] = createContext<CalendarContextValue>('Calendar');\n\n//\n// Controller\n//\n\ntype CalendarController = {\n scrollTo: (date: Date) => void;\n};\n\n//\n// Root\n//\n\ntype CalendarRootProps = PropsWithChildren<Partial<Pick<CalendarContextValue, 'weekStartsOn'>>>;\n\nconst CalendarRoot = forwardRef<CalendarController, CalendarRootProps>(\n ({ children, weekStartsOn = 1 }, forwardedRef) => {\n const event = useMemo(() => new Event<CalendarEvent>(), []);\n const [selected, setSelected] = useState<Date | undefined>();\n const [index, setIndex] = useState<number | undefined>();\n\n useImperativeHandle(\n forwardedRef,\n () => ({\n scrollTo: (date: Date) => {\n event.emit({ type: 'scroll', date });\n },\n }),\n [event],\n );\n\n return (\n <CalendarContextProvider\n weekStartsOn={weekStartsOn}\n event={event}\n index={index}\n setIndex={setIndex}\n selected={selected}\n setSelected={setSelected}\n >\n {children}\n </CalendarContextProvider>\n );\n },\n);\n\n//\n// Header\n//\n\nconst CALENDAR_TOOLBAR_NAME = 'CalendarHeader';\n\ntype CalendarToolbarProps = ThemedClassName;\n\nconst CalendarToolbar = ({ classNames, ...props }: CalendarToolbarProps) => {\n const { t } = useTranslation(translationKey);\n const { weekStartsOn, event, index, selected } = useCalendarContext(CALENDAR_TOOLBAR_NAME);\n const top = useMemo(() => getDate(start, index ?? 0, 6, weekStartsOn), [index, weekStartsOn]);\n const today = useMemo(() => new Date(), []);\n\n const handleToday = useCallback(() => {\n event.emit({ type: 'scroll', date: today });\n }, [event, start, today]);\n\n return (\n <div\n {...props}\n role='none'\n className={mx('shrink-0 grid grid-cols-3 items-center bg-toolbar-surface', classNames)}\n style={{ width: defaultWidth }}\n >\n <div className='flex justify-start'>\n <IconButton\n variant='ghost'\n size={5}\n icon='ph--calendar--regular'\n iconOnly\n classNames='aspect-square'\n label={t('today button')}\n onClick={handleToday}\n />\n </div>\n <div className='flex justify-center p-2 text-description'>{format(selected ?? top, 'MMMM')}</div>\n <div className='flex justify-end p-2 text-description'>{(selected ?? top).getFullYear()}</div>\n </div>\n );\n};\n\nCalendarToolbar.displayName = CALENDAR_TOOLBAR_NAME;\n\n//\n// Grid\n// TODO(burdon): Key nav.\n// TODO(burdon): Drag range.\n//\n\nconst CALENDAR_GRID_NAME = 'CalendarGrid';\n\ntype CalendarGridProps = ThemedClassName<{\n rows?: number;\n onSelect?: (event: { date: Date }) => void;\n}>;\n\nconst CalendarGrid = ({ classNames, rows, onSelect, ...props }: CalendarGridProps) => {\n const { weekStartsOn, event, setIndex, selected, setSelected } = useCalendarContext(CALENDAR_GRID_NAME);\n const { ref: containerRef, width = 0, height = 0 } = useResizeDetector();\n const maxHeight = rows ? rows * size : undefined;\n const listRef = useRef<List>(null);\n const today = useMemo(() => new Date(), []);\n\n const [initialized, setInitialized] = useState(false);\n useEffect(() => {\n const index = differenceInWeeks(today, start);\n listRef.current?.scrollToRow(index);\n }, [initialized, start, today]);\n\n useEffect(() => {\n return event.on((event) => {\n switch (event.type) {\n case 'scroll': {\n const index = differenceInWeeks(event.date, start);\n listRef.current?.scrollToRow(index);\n break;\n }\n }\n });\n }, [event]);\n\n const days = useMemo(() => {\n const weekStart = startOfWeek(new Date(), { weekStartsOn });\n return Array.from({ length: 7 }, (_, i) => {\n const day = addDays(weekStart, i);\n return format(day, 'EEE'); // Short day name (Mon, Tue, etc.)\n });\n }, []);\n\n // TODO(burdon): Get info by range.\n // TODO(burdon): Border marker for \"all day events?\"\n const getNumAppointments = useCallback((_date: Date) => {\n // return Math.floor(Math.random() * 10);\n return 0;\n }, []);\n\n const handleDaySelect = useCallback(\n (date: Date) => {\n setSelected((current) => (isSameDay(date, current) ? undefined : date));\n onSelect?.({ date });\n },\n [onSelect],\n );\n\n const handleScroll = useCallback<NonNullable<ListProps['onScroll']>>((info) => {\n setIndex(Math.round(info.scrollTop / size));\n }, []);\n\n const rowRenderer = useCallback<ListRowRenderer>(\n ({ key, index, style }) => {\n const getBgColor = (date: Date) => date.getMonth() % 2 === 0 && 'bg-modal-surface';\n return (\n <div key={key} {...props} role='none' style={style} className='grid'>\n <div\n role='none'\n className='grid grid-cols-7 bg-input-surface'\n style={{ gridTemplateColumns: `repeat(7, ${size}px)` }}\n >\n {Array.from({ length: 7 }).map((_, i) => {\n const date = getDate(start, index, i, weekStartsOn);\n const num = getNumAppointments(date);\n const border = isSameDay(date, selected)\n ? 'border-primary-500'\n : isSameDay(date, today)\n ? 'border-amber-500'\n : undefined;\n\n return (\n <div\n key={i}\n role='none'\n className={mx('relative flex justify-center items-center cursor-pointer', getBgColor(date))}\n onClick={() => handleDaySelect(date)}\n >\n <span className='text-description'>{date.getDate()}</span>\n {!border && date.getDate() === 1 && (\n <span className='absolute top-0 text-xs text-description'>{format(date, 'MMM')}</span>\n )}\n {border && (\n <div\n role='none'\n className={mx('absolute top-0 left-0 w-full h-full border-2 rounded-full', border)}\n />\n )}\n {num > 0 && (\n <Icon\n classNames='absolute bottom-0'\n icon={num > 3 ? 'ph--dots-three--regular' : 'ph--dot--regular'}\n size={5}\n />\n )}\n </div>\n );\n })}\n </div>\n </div>\n );\n },\n [handleDaySelect, getNumAppointments, selected, weekStartsOn],\n );\n\n return (\n <div role='none' className={mx('flex flex-col h-full w-full justify-center overflow-hidden', classNames)}>\n {/* Day of week labels */}\n <div role='none' className='grid w-full grid-cols-7' style={{ width: defaultWidth }}>\n {days.map((date, i) => (\n <div key={i} role='none' className='flex justify-center p-2 text-sm font-thin'>\n {date}\n </div>\n ))}\n </div>\n\n {/* Grid */}\n <div role='none' className='flex flex-col h-full w-full justify-center overflow-hidden' ref={containerRef}>\n <List\n ref={listRef}\n role='none'\n className='scrollbar-none outline-hidden'\n width={width}\n height={maxHeight ?? height}\n rowCount={maxRows}\n rowHeight={size}\n rowRenderer={rowRenderer}\n scrollToAlignment='start'\n onScroll={handleScroll}\n onRowsRendered={() => setInitialized(true)}\n />\n </div>\n </div>\n );\n};\n\nCalendarGrid.displayName = CALENDAR_GRID_NAME;\n\n//\n// Calendar\n//\n\nexport const Calendar = {\n Root: CalendarRoot,\n Toolbar: CalendarToolbar,\n Grid: CalendarGrid,\n};\n\nexport type { CalendarController, CalendarRootProps, CalendarToolbarProps, CalendarGridProps };\n", "//\n// Copyright 2023 DXOS.org\n//\n\nimport { type Resource } from '@dxos/react-ui';\n\nexport const translationKey = '@dxos/react-ui-calendar';\n\nexport const translations = [\n {\n 'en-US': {\n [translationKey]: {\n 'today button': 'Today',\n },\n },\n },\n] as const satisfies Resource[];\n", "//\n// Copyright 2025 DXOS.org\n//\n\nimport { type Day } from 'date-fns';\n\nexport const getDate = (start: Date, weekNumber: number, dayOfWeek: number, weekStartsOn: Day): Date => {\n const result = new Date(start);\n const startDayOfWeek = start.getDay(); // 0 = Sunday, 1 = Monday, etc.\n const adjustedStartDay = (startDayOfWeek === 0 ? 7 : startDayOfWeek) - weekStartsOn; // Adjust for weekStartsOn.\n result.setDate(start.getDate() - adjustedStartDay + weekNumber * 7 + dayOfWeek);\n return result;\n};\n\nexport const isSameDay = (date1: Date, date2: Date | undefined): boolean => {\n return (\n !!date2 &&\n date1.getFullYear() === date2.getFullYear() &&\n date1.getMonth() === date2.getMonth() &&\n date1.getDate() === date2.getDate()\n );\n};\n"],
5
+ "mappings": "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",
6
+ "names": ["createContext", "addDays", "differenceInWeeks", "format", "startOfWeek", "React", "forwardRef", "useCallback", "useEffect", "useImperativeHandle", "useMemo", "useRef", "useState", "useResizeDetector", "List", "Event", "Icon", "IconButton", "useTranslation", "mx", "translationKey", "translations", "getDate", "start", "weekNumber", "dayOfWeek", "weekStartsOn", "result", "Date", "startDayOfWeek", "getDay", "adjustedStartDay", "setDate", "isSameDay", "date1", "date2", "getFullYear", "getMonth", "maxRows", "start", "Date", "size", "defaultWidth", "CalendarContextProvider", "useCalendarContext", "createContext", "CalendarRoot", "forwardRef", "children", "weekStartsOn", "forwardedRef", "event", "useMemo", "Event", "selected", "setSelected", "useState", "index", "setIndex", "useImperativeHandle", "scrollTo", "date", "emit", "type", "CALENDAR_TOOLBAR_NAME", "CalendarToolbar", "classNames", "props", "t", "useTranslation", "translationKey", "top", "getDate", "today", "handleToday", "useCallback", "div", "role", "className", "mx", "style", "width", "IconButton", "variant", "icon", "iconOnly", "label", "onClick", "format", "getFullYear", "displayName", "CALENDAR_GRID_NAME", "CalendarGrid", "rows", "onSelect", "ref", "containerRef", "height", "useResizeDetector", "maxHeight", "undefined", "listRef", "useRef", "initialized", "setInitialized", "useEffect", "differenceInWeeks", "current", "scrollToRow", "on", "days", "weekStart", "startOfWeek", "Array", "from", "length", "_", "i", "day", "addDays", "getNumAppointments", "_date", "handleDaySelect", "isSameDay", "handleScroll", "info", "Math", "round", "scrollTop", "rowRenderer", "key", "getBgColor", "getMonth", "gridTemplateColumns", "map", "num", "border", "span", "Icon", "List", "rowCount", "rowHeight", "scrollToAlignment", "onScroll", "onRowsRendered", "Calendar", "Root", "Toolbar", "Grid"]
7
7
  }
package/dist/lib/browser/meta.json CHANGED
@@ -1 +1 @@
1
- {"inputs":{"src/translations.ts":{"bytes":1196,"imports":[],"format":"esm"},"src/components/Calendar/util.ts":{"bytes":2802,"imports":[],"format":"esm"},"src/components/Calendar/Calendar.tsx":{"bytes":30821,"imports":[{"path":"@radix-ui/react-context","kind":"import-statement","external":true},{"path":"date-fns","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"react-resize-detector","kind":"import-statement","external":true},{"path":"react-virtualized","kind":"import-statement","external":true},{"path":"@dxos/async","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/ui-theme","kind":"import-statement","external":true},{"path":"src/translations.ts","kind":"import-statement","original":"../../translations"},{"path":"src/components/Calendar/util.ts","kind":"import-statement","original":"./util"}],"format":"esm"},"src/components/Calendar/index.ts":{"bytes":476,"imports":[{"path":"src/components/Calendar/Calendar.tsx","kind":"import-statement","original":"./Calendar"}],"format":"esm"},"src/components/index.ts":{"bytes":467,"imports":[{"path":"src/components/Calendar/index.ts","kind":"import-statement","original":"./Calendar"}],"format":"esm"},"src/index.ts":{"bytes":462,"imports":[{"path":"src/components/index.ts","kind":"import-statement","original":"./components"}],"format":"esm"}},"outputs":{"dist/lib/browser/index.mjs.map":{"imports":[],"exports":[],"inputs":{},"bytes":18558},"dist/lib/browser/index.mjs":{"imports":[{"path":"@radix-ui/react-context","kind":"import-statement","external":true},{"path":"date-fns","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"react-resize-detector","kind":"import-statement","external":true},{"path":"react-virtualized","kind":"import-statement","external":true},{"path":"@dxos/async","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/ui-theme","kind":"import-statement","external":true}],"exports":["Calendar"],"entryPoint":"src/index.ts","inputs":{"src/components/Calendar/Calendar.tsx":{"bytesInOutput":7905},"src/translations.ts":{"bytesInOutput":167},"src/components/Calendar/util.ts":{"bytesInOutput":517},"src/components/Calendar/index.ts":{"bytesInOutput":0},"src/components/index.ts":{"bytesInOutput":0},"src/index.ts":{"bytesInOutput":0}},"bytes":8788}}}
1
+ {"inputs":{"src/translations.ts":{"bytes":1196,"imports":[],"format":"esm"},"src/components/Calendar/util.ts":{"bytes":2802,"imports":[],"format":"esm"},"src/components/Calendar/Calendar.tsx":{"bytes":29120,"imports":[{"path":"@radix-ui/react-context","kind":"import-statement","external":true},{"path":"date-fns","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"react-resize-detector","kind":"import-statement","external":true},{"path":"react-virtualized","kind":"import-statement","external":true},{"path":"@dxos/async","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/ui-theme","kind":"import-statement","external":true},{"path":"src/translations.ts","kind":"import-statement","original":"../../translations"},{"path":"src/components/Calendar/util.ts","kind":"import-statement","original":"./util"}],"format":"esm"},"src/components/Calendar/index.ts":{"bytes":476,"imports":[{"path":"src/components/Calendar/Calendar.tsx","kind":"import-statement","original":"./Calendar"}],"format":"esm"},"src/components/index.ts":{"bytes":467,"imports":[{"path":"src/components/Calendar/index.ts","kind":"import-statement","original":"./Calendar"}],"format":"esm"},"src/index.ts":{"bytes":462,"imports":[{"path":"src/components/index.ts","kind":"import-statement","original":"./components"}],"format":"esm"}},"outputs":{"dist/lib/browser/index.mjs.map":{"imports":[],"exports":[],"inputs":{},"bytes":17602},"dist/lib/browser/index.mjs":{"imports":[{"path":"@radix-ui/react-context","kind":"import-statement","external":true},{"path":"date-fns","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"react-resize-detector","kind":"import-statement","external":true},{"path":"react-virtualized","kind":"import-statement","external":true},{"path":"@dxos/async","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/ui-theme","kind":"import-statement","external":true}],"exports":["Calendar"],"entryPoint":"src/index.ts","inputs":{"src/components/Calendar/Calendar.tsx":{"bytesInOutput":7227},"src/translations.ts":{"bytesInOutput":167},"src/components/Calendar/util.ts":{"bytesInOutput":517},"src/components/Calendar/index.ts":{"bytesInOutput":0},"src/components/index.ts":{"bytesInOutput":0},"src/index.ts":{"bytesInOutput":0}},"bytes":8110}}}
package/dist/lib/node-esm/index.mjs CHANGED
@@ -63,16 +63,10 @@ var CalendarRoot = /* @__PURE__ */ forwardRef(({ children, weekStartsOn = 1 }, f
63
63
  setSelected
64
64
  }, children);
65
65
  });
66
- var CalendarViewport = ({ children, classNames }) => {
67
- return /* @__PURE__ */ React.createElement("div", {
68
- role: "none",
69
- className: mx("flex flex-col items-center overflow-hidden bg-inputSurface", classNames)
70
- }, children);
71
- };
72
- CalendarViewport.displayName = "CalendarContent";
73
- var CalendarToolbar = ({ classNames }) => {
66
+ var CALENDAR_TOOLBAR_NAME = "CalendarHeader";
67
+ var CalendarToolbar = ({ classNames, ...props }) => {
74
68
  const { t } = useTranslation(translationKey);
75
- const { weekStartsOn, event, index, selected } = useCalendarContext(CalendarToolbar.displayName);
69
+ const { weekStartsOn, event, index, selected } = useCalendarContext(CALENDAR_TOOLBAR_NAME);
76
70
  const top = useMemo(() => getDate(start, index ?? 0, 6, weekStartsOn), [
77
71
  index,
78
72
  weekStartsOn
@@ -89,8 +83,9 @@ var CalendarToolbar = ({ classNames }) => {
89
83
  today
90
84
  ]);
91
85
  return /* @__PURE__ */ React.createElement("div", {
86
+ ...props,
92
87
  role: "none",
93
- className: mx("shink-0 is-full grid grid-cols-3 items-center bg-barSurface", classNames),
88
+ className: mx("shrink-0 grid grid-cols-3 items-center bg-toolbar-surface", classNames),
94
89
  style: {
95
90
  width: defaultWidth
96
91
  }
@@ -110,9 +105,10 @@ var CalendarToolbar = ({ classNames }) => {
110
105
  className: "flex justify-end p-2 text-description"
111
106
  }, (selected ?? top).getFullYear()));
112
107
  };
113
- CalendarToolbar.displayName = "CalendarHeader";
114
- var CalendarGrid = ({ classNames, rows, onSelect }) => {
115
- const { weekStartsOn, event, setIndex, selected, setSelected } = useCalendarContext(CalendarGrid.displayName);
108
+ CalendarToolbar.displayName = CALENDAR_TOOLBAR_NAME;
109
+ var CALENDAR_GRID_NAME = "CalendarGrid";
110
+ var CalendarGrid = ({ classNames, rows, onSelect, ...props }) => {
111
+ const { weekStartsOn, event, setIndex, selected, setSelected } = useCalendarContext(CALENDAR_GRID_NAME);
116
112
  const { ref: containerRef, width = 0, height = 0 } = useResizeDetector();
117
113
  const maxHeight = rows ? rows * size : void 0;
118
114
  const listRef = useRef(null);
@@ -165,18 +161,16 @@ var CalendarGrid = ({ classNames, rows, onSelect }) => {
165
161
  setIndex(Math.round(info.scrollTop / size));
166
162
  }, []);
167
163
  const rowRenderer = useCallback(({ key, index, style }) => {
168
- const getBgColor = (date) => date.getMonth() % 2 === 0 && "bg-modalSurface";
164
+ const getBgColor = (date) => date.getMonth() % 2 === 0 && "bg-modal-surface";
169
165
  return /* @__PURE__ */ React.createElement("div", {
170
166
  key,
167
+ ...props,
171
168
  role: "none",
172
169
  style,
173
- className: "is-full grid grid-cols-[1fr_max-content_1fr] snap-center"
170
+ className: "grid"
174
171
  }, /* @__PURE__ */ React.createElement("div", {
175
172
  role: "none",
176
- className: mx(getBgColor(getDate(start, index, 0, weekStartsOn)))
177
- }), /* @__PURE__ */ React.createElement("div", {
178
- role: "none",
179
- className: "grid grid-cols-7",
173
+ className: "grid grid-cols-7 bg-input-surface",
180
174
  style: {
181
175
  gridTemplateColumns: `repeat(7, ${size}px)`
182
176
  }
@@ -197,15 +191,13 @@ var CalendarGrid = ({ classNames, rows, onSelect }) => {
197
191
  className: "absolute top-0 text-xs text-description"
198
192
  }, format(date, "MMM")), border && /* @__PURE__ */ React.createElement("div", {
199
193
  role: "none",
200
- className: mx("absolute top-0 left-0 is-full bs-full border-2 rounded-full", border)
194
+ className: mx("absolute top-0 left-0 w-full h-full border-2 rounded-full", border)
201
195
  }), num > 0 && /* @__PURE__ */ React.createElement(Icon, {
202
196
  classNames: "absolute bottom-0",
203
197
  icon: num > 3 ? "ph--dots-three--regular" : "ph--dot--regular",
204
198
  size: 5
205
199
  }));
206
- })), /* @__PURE__ */ React.createElement("div", {
207
- className: mx(getBgColor(getDate(start, index, 6, weekStartsOn)))
208
- }));
200
+ })));
209
201
  }, [
210
202
  handleDaySelect,
211
203
  getNumAppointments,
@@ -214,13 +206,10 @@ var CalendarGrid = ({ classNames, rows, onSelect }) => {
214
206
  ]);
215
207
  return /* @__PURE__ */ React.createElement("div", {
216
208
  role: "none",
217
- className: mx("flex flex-col bs-full is-full justify-center overflow-hidden", classNames)
218
- }, /* @__PURE__ */ React.createElement("div", {
219
- role: "none",
220
- className: "flex justify-center bg-groupSurface"
209
+ className: mx("flex flex-col h-full w-full justify-center overflow-hidden", classNames)
221
210
  }, /* @__PURE__ */ React.createElement("div", {
222
211
  role: "none",
223
- className: "flex is-full grid grid-cols-7",
212
+ className: "grid w-full grid-cols-7",
224
213
  style: {
225
214
  width: defaultWidth
226
215
  }
@@ -228,15 +217,14 @@ var CalendarGrid = ({ classNames, rows, onSelect }) => {
228
217
  key: i,
229
218
  role: "none",
230
219
  className: "flex justify-center p-2 text-sm font-thin"
231
- }, date)))), /* @__PURE__ */ React.createElement("div", {
220
+ }, date))), /* @__PURE__ */ React.createElement("div", {
232
221
  role: "none",
233
- className: "flex flex-col bs-full is-full justify-center overflow-hidden",
222
+ className: "flex flex-col h-full w-full justify-center overflow-hidden",
234
223
  ref: containerRef
235
224
  }, /* @__PURE__ */ React.createElement(List, {
236
225
  ref: listRef,
237
226
  role: "none",
238
- // TODO(burdon): Snap isn't working.
239
- className: "[&>div]:snap-y scrollbar-none outline-none",
227
+ className: "scrollbar-none outline-hidden",
240
228
  width,
241
229
  height: maxHeight ?? height,
242
230
  rowCount: maxRows,
@@ -247,10 +235,9 @@ var CalendarGrid = ({ classNames, rows, onSelect }) => {
247
235
  onRowsRendered: () => setInitialized(true)
248
236
  })));
249
237
  };
250
- CalendarGrid.displayName = "CalendarGrid";
238
+ CalendarGrid.displayName = CALENDAR_GRID_NAME;
251
239
  var Calendar = {
252
240
  Root: CalendarRoot,
253
- Viewport: CalendarViewport,
254
241
  Toolbar: CalendarToolbar,
255
242
  Grid: CalendarGrid
256
243
  };
package/dist/lib/node-esm/index.mjs.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../src/components/Calendar/Calendar.tsx", "../../../src/translations.ts", "../../../src/components/Calendar/util.ts"],
4
- "sourcesContent": ["//\n// Copyright 2025 DXOS.org\n//\n\nimport { createContext } from '@radix-ui/react-context';\nimport { type Day, addDays, differenceInWeeks, format, startOfWeek } from 'date-fns';\nimport React, {\n type Dispatch,\n type PropsWithChildren,\n type SetStateAction,\n forwardRef,\n useCallback,\n useEffect,\n useImperativeHandle,\n useMemo,\n useRef,\n useState,\n} from 'react';\nimport { useResizeDetector } from 'react-resize-detector';\nimport { List, type ListProps, type ListRowRenderer } from 'react-virtualized';\n\nimport { Event } from '@dxos/async';\nimport { Icon, IconButton, type ThemedClassName, useTranslation } from '@dxos/react-ui';\nimport { mx } from '@dxos/ui-theme';\n\nimport { translationKey } from '../../translations';\n\nimport { getDate, isSameDay } from './util';\n\nconst maxRows = 50 * 100;\nconst start = new Date('1970-01-01');\nconst size = 48;\nconst defaultWidth = 7 * size;\n\n//\n// Context\n//\n\ntype CalendarEvent = {\n type: 'scroll';\n date: Date;\n};\n\ntype CalendarContextValue = {\n weekStartsOn: Day;\n event: Event<CalendarEvent>;\n index: number | undefined;\n setIndex: Dispatch<SetStateAction<number | undefined>>;\n selected: Date | undefined;\n setSelected: Dispatch<SetStateAction<Date | undefined>>;\n};\n\nconst [CalendarContextProvider, useCalendarContext] = createContext<CalendarContextValue>('Calendar');\n\n//\n// Controller\n//\n\ntype CalendarController = {\n scrollTo: (date: Date) => void;\n};\n\n//\n// Root\n//\n\ntype CalendarRootProps = PropsWithChildren<Partial<Pick<CalendarContextValue, 'weekStartsOn'>>>;\n\nconst CalendarRoot = forwardRef<CalendarController, CalendarRootProps>(\n ({ children, weekStartsOn = 1 }, forwardedRef) => {\n const event = useMemo(() => new Event<CalendarEvent>(), []);\n const [selected, setSelected] = useState<Date | undefined>();\n const [index, setIndex] = useState<number | undefined>();\n\n useImperativeHandle(\n forwardedRef,\n () => ({\n scrollTo: (date: Date) => {\n event.emit({ type: 'scroll', date });\n },\n }),\n [event],\n );\n\n return (\n <CalendarContextProvider\n weekStartsOn={weekStartsOn}\n event={event}\n index={index}\n setIndex={setIndex}\n selected={selected}\n setSelected={setSelected}\n >\n {children}\n </CalendarContextProvider>\n );\n },\n);\n\n//\n// Viewport\n//\n\ntype CalendarViewportProps = PropsWithChildren<ThemedClassName>;\n\nconst CalendarViewport = ({ children, classNames }: CalendarViewportProps) => {\n return (\n <div role='none' className={mx('flex flex-col items-center overflow-hidden bg-inputSurface', classNames)}>\n {children}\n </div>\n );\n};\n\nCalendarViewport.displayName = 'CalendarContent';\n\n//\n// Header\n//\n\ntype CalendarToolbarProps = ThemedClassName;\n\nconst CalendarToolbar = ({ classNames }: CalendarToolbarProps) => {\n const { t } = useTranslation(translationKey);\n const { weekStartsOn, event, index, selected } = useCalendarContext(CalendarToolbar.displayName);\n const top = useMemo(() => getDate(start, index ?? 0, 6, weekStartsOn), [index, weekStartsOn]);\n const today = useMemo(() => new Date(), []);\n\n const handleToday = useCallback(() => {\n event.emit({ type: 'scroll', date: today });\n }, [event, start, today]);\n\n return (\n <div\n role='none'\n className={mx('shink-0 is-full grid grid-cols-3 items-center bg-barSurface', classNames)}\n style={{ width: defaultWidth }}\n >\n <div className='flex justify-start'>\n <IconButton\n variant='ghost'\n size={5}\n icon='ph--calendar--regular'\n iconOnly\n classNames='aspect-square'\n label={t('today button')}\n onClick={handleToday}\n />\n </div>\n <div className='flex justify-center p-2 text-description'>{format(selected ?? top, 'MMMM')}</div>\n <div className='flex justify-end p-2 text-description'>{(selected ?? top).getFullYear()}</div>\n </div>\n );\n};\n\nCalendarToolbar.displayName = 'CalendarHeader';\n\n//\n// Grid\n// TODO(burdon): Key nav.\n// TODO(burdon): Drag range.\n//\n\ntype CalendarGridProps = ThemedClassName<{\n rows?: number;\n onSelect?: (event: { date: Date }) => void;\n}>;\n\nconst CalendarGrid = ({ classNames, rows, onSelect }: CalendarGridProps) => {\n const { weekStartsOn, event, setIndex, selected, setSelected } = useCalendarContext(CalendarGrid.displayName);\n const { ref: containerRef, width = 0, height = 0 } = useResizeDetector();\n const maxHeight = rows ? rows * size : undefined;\n const listRef = useRef<List>(null);\n const today = useMemo(() => new Date(), []);\n\n const [initialized, setInitialized] = useState(false);\n useEffect(() => {\n const index = differenceInWeeks(today, start);\n listRef.current?.scrollToRow(index);\n }, [initialized, start, today]);\n\n useEffect(() => {\n return event.on((event) => {\n switch (event.type) {\n case 'scroll': {\n const index = differenceInWeeks(event.date, start);\n listRef.current?.scrollToRow(index);\n break;\n }\n }\n });\n }, [event]);\n\n const days = useMemo(() => {\n const weekStart = startOfWeek(new Date(), { weekStartsOn });\n return Array.from({ length: 7 }, (_, i) => {\n const day = addDays(weekStart, i);\n return format(day, 'EEE'); // Short day name (Mon, Tue, etc.)\n });\n }, []);\n\n // TODO(burdon): Get info by range.\n // TODO(burdon): Border marker for \"all day events?\"\n const getNumAppointments = useCallback((_date: Date) => {\n // return Math.floor(Math.random() * 10);\n return 0;\n }, []);\n\n const handleDaySelect = useCallback(\n (date: Date) => {\n setSelected((current) => (isSameDay(date, current) ? undefined : date));\n onSelect?.({ date });\n },\n [onSelect],\n );\n\n const handleScroll = useCallback<NonNullable<ListProps['onScroll']>>((info) => {\n setIndex(Math.round(info.scrollTop / size));\n }, []);\n\n const rowRenderer = useCallback<ListRowRenderer>(\n ({ key, index, style }) => {\n const getBgColor = (date: Date) => date.getMonth() % 2 === 0 && 'bg-modalSurface';\n return (\n <div key={key} role='none' style={style} className='is-full grid grid-cols-[1fr_max-content_1fr] snap-center'>\n <div role='none' className={mx(getBgColor(getDate(start, index, 0, weekStartsOn)))} />\n <div role='none' className='grid grid-cols-7' style={{ gridTemplateColumns: `repeat(7, ${size}px)` }}>\n {Array.from({ length: 7 }).map((_, i) => {\n const date = getDate(start, index, i, weekStartsOn);\n const num = getNumAppointments(date);\n const border = isSameDay(date, selected)\n ? 'border-primary-500'\n : isSameDay(date, today)\n ? 'border-amber-500'\n : undefined;\n\n return (\n <div\n key={i}\n role='none'\n className={mx('relative flex justify-center items-center cursor-pointer', getBgColor(date))}\n onClick={() => handleDaySelect(date)}\n >\n <span className='text-description'>{date.getDate()}</span>\n {!border && date.getDate() === 1 && (\n <span className='absolute top-0 text-xs text-description'>{format(date, 'MMM')}</span>\n )}\n {border && (\n <div\n role='none'\n className={mx('absolute top-0 left-0 is-full bs-full border-2 rounded-full', border)}\n />\n )}\n {num > 0 && (\n <Icon\n classNames='absolute bottom-0'\n icon={num > 3 ? 'ph--dots-three--regular' : 'ph--dot--regular'}\n size={5}\n />\n )}\n </div>\n );\n })}\n </div>\n <div className={mx(getBgColor(getDate(start, index, 6, weekStartsOn)))} />\n </div>\n );\n },\n [handleDaySelect, getNumAppointments, selected, weekStartsOn],\n );\n\n return (\n <div role='none' className={mx('flex flex-col bs-full is-full justify-center overflow-hidden', classNames)}>\n {/* Day labels */}\n <div role='none' className='flex justify-center bg-groupSurface'>\n <div role='none' className='flex is-full grid grid-cols-7' style={{ width: defaultWidth }}>\n {days.map((date, i) => (\n <div key={i} role='none' className='flex justify-center p-2 text-sm font-thin'>\n {date}\n </div>\n ))}\n </div>\n </div>\n\n {/* Grid */}\n <div role='none' className='flex flex-col bs-full is-full justify-center overflow-hidden' ref={containerRef}>\n <List\n ref={listRef}\n role='none'\n // TODO(burdon): Snap isn't working.\n className='[&>div]:snap-y scrollbar-none outline-none'\n width={width}\n height={maxHeight ?? height}\n rowCount={maxRows}\n rowHeight={size}\n rowRenderer={rowRenderer}\n scrollToAlignment='start'\n onScroll={handleScroll}\n onRowsRendered={() => setInitialized(true)}\n />\n </div>\n </div>\n );\n};\n\nCalendarGrid.displayName = 'CalendarGrid';\n\n//\n// Calendar\n//\n\nexport const Calendar = {\n Root: CalendarRoot,\n Viewport: CalendarViewport,\n Toolbar: CalendarToolbar,\n Grid: CalendarGrid,\n};\n\nexport type { CalendarController, CalendarRootProps, CalendarViewportProps, CalendarToolbarProps, CalendarGridProps };\n", "//\n// Copyright 2023 DXOS.org\n//\n\nimport { type Resource } from '@dxos/react-ui';\n\nexport const translationKey = '@dxos/react-ui-calendar';\n\nexport const translations = [\n {\n 'en-US': {\n [translationKey]: {\n 'today button': 'Today',\n },\n },\n },\n] as const satisfies Resource[];\n", "//\n// Copyright 2025 DXOS.org\n//\n\nimport { type Day } from 'date-fns';\n\nexport const getDate = (start: Date, weekNumber: number, dayOfWeek: number, weekStartsOn: Day): Date => {\n const result = new Date(start);\n const startDayOfWeek = start.getDay(); // 0 = Sunday, 1 = Monday, etc.\n const adjustedStartDay = (startDayOfWeek === 0 ? 7 : startDayOfWeek) - weekStartsOn; // Adjust for weekStartsOn.\n result.setDate(start.getDate() - adjustedStartDay + weekNumber * 7 + dayOfWeek);\n return result;\n};\n\nexport const isSameDay = (date1: Date, date2: Date | undefined): boolean => {\n return (\n !!date2 &&\n date1.getFullYear() === date2.getFullYear() &&\n date1.getMonth() === date2.getMonth() &&\n date1.getDate() === date2.getDate()\n );\n};\n"],
5
- "mappings": "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",
6
- "names": ["createContext", "addDays", "differenceInWeeks", "format", "startOfWeek", "React", "forwardRef", "useCallback", "useEffect", "useImperativeHandle", "useMemo", "useRef", "useState", "useResizeDetector", "List", "Event", "Icon", "IconButton", "useTranslation", "mx", "translationKey", "translations", "getDate", "start", "weekNumber", "dayOfWeek", "weekStartsOn", "result", "Date", "startDayOfWeek", "getDay", "adjustedStartDay", "setDate", "isSameDay", "date1", "date2", "getFullYear", "getMonth", "maxRows", "start", "Date", "size", "defaultWidth", "CalendarContextProvider", "useCalendarContext", "createContext", "CalendarRoot", "forwardRef", "children", "weekStartsOn", "forwardedRef", "event", "useMemo", "Event", "selected", "setSelected", "useState", "index", "setIndex", "useImperativeHandle", "scrollTo", "date", "emit", "type", "CalendarViewport", "classNames", "div", "role", "className", "mx", "displayName", "CalendarToolbar", "t", "useTranslation", "translationKey", "top", "getDate", "today", "handleToday", "useCallback", "style", "width", "IconButton", "variant", "icon", "iconOnly", "label", "onClick", "format", "getFullYear", "CalendarGrid", "rows", "onSelect", "ref", "containerRef", "height", "useResizeDetector", "maxHeight", "undefined", "listRef", "useRef", "initialized", "setInitialized", "useEffect", "differenceInWeeks", "current", "scrollToRow", "on", "days", "weekStart", "startOfWeek", "Array", "from", "length", "_", "i", "day", "addDays", "getNumAppointments", "_date", "handleDaySelect", "isSameDay", "handleScroll", "info", "Math", "round", "scrollTop", "rowRenderer", "key", "getBgColor", "getMonth", "gridTemplateColumns", "map", "num", "border", "span", "Icon", "List", "rowCount", "rowHeight", "scrollToAlignment", "onScroll", "onRowsRendered", "Calendar", "Root", "Viewport", "Toolbar", "Grid"]
4
+ "sourcesContent": ["//\n// Copyright 2025 DXOS.org\n//\n\nimport { createContext } from '@radix-ui/react-context';\nimport { type Day, addDays, differenceInWeeks, format, startOfWeek } from 'date-fns';\nimport React, {\n type Dispatch,\n type PropsWithChildren,\n type SetStateAction,\n forwardRef,\n useCallback,\n useEffect,\n useImperativeHandle,\n useMemo,\n useRef,\n useState,\n} from 'react';\nimport { useResizeDetector } from 'react-resize-detector';\nimport { List, type ListProps, type ListRowRenderer } from 'react-virtualized';\n\nimport { Event } from '@dxos/async';\nimport { Icon, IconButton, type ThemedClassName, useTranslation } from '@dxos/react-ui';\nimport { mx } from '@dxos/ui-theme';\n\nimport { translationKey } from '../../translations';\n\nimport { getDate, isSameDay } from './util';\n\nconst maxRows = 50 * 100;\nconst start = new Date('1970-01-01');\nconst size = 48;\nconst defaultWidth = 7 * size;\n\n//\n// Context\n//\n\ntype CalendarEvent = {\n type: 'scroll';\n date: Date;\n};\n\ntype CalendarContextValue = {\n weekStartsOn: Day;\n event: Event<CalendarEvent>;\n index: number | undefined;\n setIndex: Dispatch<SetStateAction<number | undefined>>;\n selected: Date | undefined;\n setSelected: Dispatch<SetStateAction<Date | undefined>>;\n};\n\nconst [CalendarContextProvider, useCalendarContext] = createContext<CalendarContextValue>('Calendar');\n\n//\n// Controller\n//\n\ntype CalendarController = {\n scrollTo: (date: Date) => void;\n};\n\n//\n// Root\n//\n\ntype CalendarRootProps = PropsWithChildren<Partial<Pick<CalendarContextValue, 'weekStartsOn'>>>;\n\nconst CalendarRoot = forwardRef<CalendarController, CalendarRootProps>(\n ({ children, weekStartsOn = 1 }, forwardedRef) => {\n const event = useMemo(() => new Event<CalendarEvent>(), []);\n const [selected, setSelected] = useState<Date | undefined>();\n const [index, setIndex] = useState<number | undefined>();\n\n useImperativeHandle(\n forwardedRef,\n () => ({\n scrollTo: (date: Date) => {\n event.emit({ type: 'scroll', date });\n },\n }),\n [event],\n );\n\n return (\n <CalendarContextProvider\n weekStartsOn={weekStartsOn}\n event={event}\n index={index}\n setIndex={setIndex}\n selected={selected}\n setSelected={setSelected}\n >\n {children}\n </CalendarContextProvider>\n );\n },\n);\n\n//\n// Header\n//\n\nconst CALENDAR_TOOLBAR_NAME = 'CalendarHeader';\n\ntype CalendarToolbarProps = ThemedClassName;\n\nconst CalendarToolbar = ({ classNames, ...props }: CalendarToolbarProps) => {\n const { t } = useTranslation(translationKey);\n const { weekStartsOn, event, index, selected } = useCalendarContext(CALENDAR_TOOLBAR_NAME);\n const top = useMemo(() => getDate(start, index ?? 0, 6, weekStartsOn), [index, weekStartsOn]);\n const today = useMemo(() => new Date(), []);\n\n const handleToday = useCallback(() => {\n event.emit({ type: 'scroll', date: today });\n }, [event, start, today]);\n\n return (\n <div\n {...props}\n role='none'\n className={mx('shrink-0 grid grid-cols-3 items-center bg-toolbar-surface', classNames)}\n style={{ width: defaultWidth }}\n >\n <div className='flex justify-start'>\n <IconButton\n variant='ghost'\n size={5}\n icon='ph--calendar--regular'\n iconOnly\n classNames='aspect-square'\n label={t('today button')}\n onClick={handleToday}\n />\n </div>\n <div className='flex justify-center p-2 text-description'>{format(selected ?? top, 'MMMM')}</div>\n <div className='flex justify-end p-2 text-description'>{(selected ?? top).getFullYear()}</div>\n </div>\n );\n};\n\nCalendarToolbar.displayName = CALENDAR_TOOLBAR_NAME;\n\n//\n// Grid\n// TODO(burdon): Key nav.\n// TODO(burdon): Drag range.\n//\n\nconst CALENDAR_GRID_NAME = 'CalendarGrid';\n\ntype CalendarGridProps = ThemedClassName<{\n rows?: number;\n onSelect?: (event: { date: Date }) => void;\n}>;\n\nconst CalendarGrid = ({ classNames, rows, onSelect, ...props }: CalendarGridProps) => {\n const { weekStartsOn, event, setIndex, selected, setSelected } = useCalendarContext(CALENDAR_GRID_NAME);\n const { ref: containerRef, width = 0, height = 0 } = useResizeDetector();\n const maxHeight = rows ? rows * size : undefined;\n const listRef = useRef<List>(null);\n const today = useMemo(() => new Date(), []);\n\n const [initialized, setInitialized] = useState(false);\n useEffect(() => {\n const index = differenceInWeeks(today, start);\n listRef.current?.scrollToRow(index);\n }, [initialized, start, today]);\n\n useEffect(() => {\n return event.on((event) => {\n switch (event.type) {\n case 'scroll': {\n const index = differenceInWeeks(event.date, start);\n listRef.current?.scrollToRow(index);\n break;\n }\n }\n });\n }, [event]);\n\n const days = useMemo(() => {\n const weekStart = startOfWeek(new Date(), { weekStartsOn });\n return Array.from({ length: 7 }, (_, i) => {\n const day = addDays(weekStart, i);\n return format(day, 'EEE'); // Short day name (Mon, Tue, etc.)\n });\n }, []);\n\n // TODO(burdon): Get info by range.\n // TODO(burdon): Border marker for \"all day events?\"\n const getNumAppointments = useCallback((_date: Date) => {\n // return Math.floor(Math.random() * 10);\n return 0;\n }, []);\n\n const handleDaySelect = useCallback(\n (date: Date) => {\n setSelected((current) => (isSameDay(date, current) ? undefined : date));\n onSelect?.({ date });\n },\n [onSelect],\n );\n\n const handleScroll = useCallback<NonNullable<ListProps['onScroll']>>((info) => {\n setIndex(Math.round(info.scrollTop / size));\n }, []);\n\n const rowRenderer = useCallback<ListRowRenderer>(\n ({ key, index, style }) => {\n const getBgColor = (date: Date) => date.getMonth() % 2 === 0 && 'bg-modal-surface';\n return (\n <div key={key} {...props} role='none' style={style} className='grid'>\n <div\n role='none'\n className='grid grid-cols-7 bg-input-surface'\n style={{ gridTemplateColumns: `repeat(7, ${size}px)` }}\n >\n {Array.from({ length: 7 }).map((_, i) => {\n const date = getDate(start, index, i, weekStartsOn);\n const num = getNumAppointments(date);\n const border = isSameDay(date, selected)\n ? 'border-primary-500'\n : isSameDay(date, today)\n ? 'border-amber-500'\n : undefined;\n\n return (\n <div\n key={i}\n role='none'\n className={mx('relative flex justify-center items-center cursor-pointer', getBgColor(date))}\n onClick={() => handleDaySelect(date)}\n >\n <span className='text-description'>{date.getDate()}</span>\n {!border && date.getDate() === 1 && (\n <span className='absolute top-0 text-xs text-description'>{format(date, 'MMM')}</span>\n )}\n {border && (\n <div\n role='none'\n className={mx('absolute top-0 left-0 w-full h-full border-2 rounded-full', border)}\n />\n )}\n {num > 0 && (\n <Icon\n classNames='absolute bottom-0'\n icon={num > 3 ? 'ph--dots-three--regular' : 'ph--dot--regular'}\n size={5}\n />\n )}\n </div>\n );\n })}\n </div>\n </div>\n );\n },\n [handleDaySelect, getNumAppointments, selected, weekStartsOn],\n );\n\n return (\n <div role='none' className={mx('flex flex-col h-full w-full justify-center overflow-hidden', classNames)}>\n {/* Day of week labels */}\n <div role='none' className='grid w-full grid-cols-7' style={{ width: defaultWidth }}>\n {days.map((date, i) => (\n <div key={i} role='none' className='flex justify-center p-2 text-sm font-thin'>\n {date}\n </div>\n ))}\n </div>\n\n {/* Grid */}\n <div role='none' className='flex flex-col h-full w-full justify-center overflow-hidden' ref={containerRef}>\n <List\n ref={listRef}\n role='none'\n className='scrollbar-none outline-hidden'\n width={width}\n height={maxHeight ?? height}\n rowCount={maxRows}\n rowHeight={size}\n rowRenderer={rowRenderer}\n scrollToAlignment='start'\n onScroll={handleScroll}\n onRowsRendered={() => setInitialized(true)}\n />\n </div>\n </div>\n );\n};\n\nCalendarGrid.displayName = CALENDAR_GRID_NAME;\n\n//\n// Calendar\n//\n\nexport const Calendar = {\n Root: CalendarRoot,\n Toolbar: CalendarToolbar,\n Grid: CalendarGrid,\n};\n\nexport type { CalendarController, CalendarRootProps, CalendarToolbarProps, CalendarGridProps };\n", "//\n// Copyright 2023 DXOS.org\n//\n\nimport { type Resource } from '@dxos/react-ui';\n\nexport const translationKey = '@dxos/react-ui-calendar';\n\nexport const translations = [\n {\n 'en-US': {\n [translationKey]: {\n 'today button': 'Today',\n },\n },\n },\n] as const satisfies Resource[];\n", "//\n// Copyright 2025 DXOS.org\n//\n\nimport { type Day } from 'date-fns';\n\nexport const getDate = (start: Date, weekNumber: number, dayOfWeek: number, weekStartsOn: Day): Date => {\n const result = new Date(start);\n const startDayOfWeek = start.getDay(); // 0 = Sunday, 1 = Monday, etc.\n const adjustedStartDay = (startDayOfWeek === 0 ? 7 : startDayOfWeek) - weekStartsOn; // Adjust for weekStartsOn.\n result.setDate(start.getDate() - adjustedStartDay + weekNumber * 7 + dayOfWeek);\n return result;\n};\n\nexport const isSameDay = (date1: Date, date2: Date | undefined): boolean => {\n return (\n !!date2 &&\n date1.getFullYear() === date2.getFullYear() &&\n date1.getMonth() === date2.getMonth() &&\n date1.getDate() === date2.getDate()\n );\n};\n"],
5
+ "mappings": "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",
6
+ "names": ["createContext", "addDays", "differenceInWeeks", "format", "startOfWeek", "React", "forwardRef", "useCallback", "useEffect", "useImperativeHandle", "useMemo", "useRef", "useState", "useResizeDetector", "List", "Event", "Icon", "IconButton", "useTranslation", "mx", "translationKey", "translations", "getDate", "start", "weekNumber", "dayOfWeek", "weekStartsOn", "result", "Date", "startDayOfWeek", "getDay", "adjustedStartDay", "setDate", "isSameDay", "date1", "date2", "getFullYear", "getMonth", "maxRows", "start", "Date", "size", "defaultWidth", "CalendarContextProvider", "useCalendarContext", "createContext", "CalendarRoot", "forwardRef", "children", "weekStartsOn", "forwardedRef", "event", "useMemo", "Event", "selected", "setSelected", "useState", "index", "setIndex", "useImperativeHandle", "scrollTo", "date", "emit", "type", "CALENDAR_TOOLBAR_NAME", "CalendarToolbar", "classNames", "props", "t", "useTranslation", "translationKey", "top", "getDate", "today", "handleToday", "useCallback", "div", "role", "className", "mx", "style", "width", "IconButton", "variant", "icon", "iconOnly", "label", "onClick", "format", "getFullYear", "displayName", "CALENDAR_GRID_NAME", "CalendarGrid", "rows", "onSelect", "ref", "containerRef", "height", "useResizeDetector", "maxHeight", "undefined", "listRef", "useRef", "initialized", "setInitialized", "useEffect", "differenceInWeeks", "current", "scrollToRow", "on", "days", "weekStart", "startOfWeek", "Array", "from", "length", "_", "i", "day", "addDays", "getNumAppointments", "_date", "handleDaySelect", "isSameDay", "handleScroll", "info", "Math", "round", "scrollTop", "rowRenderer", "key", "getBgColor", "getMonth", "gridTemplateColumns", "map", "num", "border", "span", "Icon", "List", "rowCount", "rowHeight", "scrollToAlignment", "onScroll", "onRowsRendered", "Calendar", "Root", "Toolbar", "Grid"]
7
7
  }
package/dist/lib/node-esm/meta.json CHANGED
@@ -1 +1 @@
1
- {"inputs":{"src/translations.ts":{"bytes":1196,"imports":[],"format":"esm"},"src/components/Calendar/util.ts":{"bytes":2802,"imports":[],"format":"esm"},"src/components/Calendar/Calendar.tsx":{"bytes":30821,"imports":[{"path":"@radix-ui/react-context","kind":"import-statement","external":true},{"path":"date-fns","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"react-resize-detector","kind":"import-statement","external":true},{"path":"react-virtualized","kind":"import-statement","external":true},{"path":"@dxos/async","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/ui-theme","kind":"import-statement","external":true},{"path":"src/translations.ts","kind":"import-statement","original":"../../translations"},{"path":"src/components/Calendar/util.ts","kind":"import-statement","original":"./util"}],"format":"esm"},"src/components/Calendar/index.ts":{"bytes":476,"imports":[{"path":"src/components/Calendar/Calendar.tsx","kind":"import-statement","original":"./Calendar"}],"format":"esm"},"src/components/index.ts":{"bytes":467,"imports":[{"path":"src/components/Calendar/index.ts","kind":"import-statement","original":"./Calendar"}],"format":"esm"},"src/index.ts":{"bytes":462,"imports":[{"path":"src/components/index.ts","kind":"import-statement","original":"./components"}],"format":"esm"}},"outputs":{"dist/lib/node-esm/index.mjs.map":{"imports":[],"exports":[],"inputs":{},"bytes":18560},"dist/lib/node-esm/index.mjs":{"imports":[{"path":"@radix-ui/react-context","kind":"import-statement","external":true},{"path":"date-fns","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"react-resize-detector","kind":"import-statement","external":true},{"path":"react-virtualized","kind":"import-statement","external":true},{"path":"@dxos/async","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/ui-theme","kind":"import-statement","external":true}],"exports":["Calendar"],"entryPoint":"src/index.ts","inputs":{"src/components/Calendar/Calendar.tsx":{"bytesInOutput":7905},"src/translations.ts":{"bytesInOutput":167},"src/components/Calendar/util.ts":{"bytesInOutput":517},"src/components/Calendar/index.ts":{"bytesInOutput":0},"src/components/index.ts":{"bytesInOutput":0},"src/index.ts":{"bytesInOutput":0}},"bytes":8881}}}
1
+ {"inputs":{"src/translations.ts":{"bytes":1196,"imports":[],"format":"esm"},"src/components/Calendar/util.ts":{"bytes":2802,"imports":[],"format":"esm"},"src/components/Calendar/Calendar.tsx":{"bytes":29120,"imports":[{"path":"@radix-ui/react-context","kind":"import-statement","external":true},{"path":"date-fns","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"react-resize-detector","kind":"import-statement","external":true},{"path":"react-virtualized","kind":"import-statement","external":true},{"path":"@dxos/async","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/ui-theme","kind":"import-statement","external":true},{"path":"src/translations.ts","kind":"import-statement","original":"../../translations"},{"path":"src/components/Calendar/util.ts","kind":"import-statement","original":"./util"}],"format":"esm"},"src/components/Calendar/index.ts":{"bytes":476,"imports":[{"path":"src/components/Calendar/Calendar.tsx","kind":"import-statement","original":"./Calendar"}],"format":"esm"},"src/components/index.ts":{"bytes":467,"imports":[{"path":"src/components/Calendar/index.ts","kind":"import-statement","original":"./Calendar"}],"format":"esm"},"src/index.ts":{"bytes":462,"imports":[{"path":"src/components/index.ts","kind":"import-statement","original":"./components"}],"format":"esm"}},"outputs":{"dist/lib/node-esm/index.mjs.map":{"imports":[],"exports":[],"inputs":{},"bytes":17604},"dist/lib/node-esm/index.mjs":{"imports":[{"path":"@radix-ui/react-context","kind":"import-statement","external":true},{"path":"date-fns","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"react-resize-detector","kind":"import-statement","external":true},{"path":"react-virtualized","kind":"import-statement","external":true},{"path":"@dxos/async","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/ui-theme","kind":"import-statement","external":true}],"exports":["Calendar"],"entryPoint":"src/index.ts","inputs":{"src/components/Calendar/Calendar.tsx":{"bytesInOutput":7227},"src/translations.ts":{"bytesInOutput":167},"src/components/Calendar/util.ts":{"bytesInOutput":517},"src/components/Calendar/index.ts":{"bytesInOutput":0},"src/components/index.ts":{"bytesInOutput":0},"src/index.ts":{"bytesInOutput":0}},"bytes":8203}}}
package/dist/types/src/components/Calendar/Calendar.d.ts CHANGED
@@ -18,7 +18,6 @@ type CalendarController = {
18
18
  scrollTo: (date: Date) => void;
19
19
  };
20
20
  type CalendarRootProps = PropsWithChildren<Partial<Pick<CalendarContextValue, 'weekStartsOn'>>>;
21
- type CalendarViewportProps = PropsWithChildren<ThemedClassName>;
22
21
  type CalendarToolbarProps = ThemedClassName;
23
22
  type CalendarGridProps = ThemedClassName<{
24
23
  rows?: number;
@@ -30,18 +29,14 @@ export declare const Calendar: {
30
29
  Root: React.ForwardRefExoticComponent<Partial<Pick<CalendarContextValue, "weekStartsOn">> & {
31
30
  children?: React.ReactNode | undefined;
32
31
  } & React.RefAttributes<CalendarController>>;
33
- Viewport: {
34
- ({ children, classNames }: CalendarViewportProps): React.JSX.Element;
35
- displayName: string;
36
- };
37
32
  Toolbar: {
38
- ({ classNames }: CalendarToolbarProps): React.JSX.Element;
33
+ ({ classNames, ...props }: CalendarToolbarProps): React.JSX.Element;
39
34
  displayName: string;
40
35
  };
41
36
  Grid: {
42
- ({ classNames, rows, onSelect }: CalendarGridProps): React.JSX.Element;
37
+ ({ classNames, rows, onSelect, ...props }: CalendarGridProps): React.JSX.Element;
43
38
  displayName: string;
44
39
  };
45
40
  };
46
- export type { CalendarController, CalendarRootProps, CalendarViewportProps, CalendarToolbarProps, CalendarGridProps };
41
+ export type { CalendarController, CalendarRootProps, CalendarToolbarProps, CalendarGridProps };
47
42
  //# sourceMappingURL=Calendar.d.ts.map
package/dist/types/src/components/Calendar/Calendar.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Calendar.d.ts","sourceRoot":"","sources":["../../../../../src/components/Calendar/Calendar.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,KAAK,GAAG,EAAmD,MAAM,UAAU,CAAC;AACrF,OAAO,KAAK,EAAE,EACZ,KAAK,QAAQ,EACb,KAAK,iBAAiB,EACtB,KAAK,cAAc,EAQpB,MAAM,OAAO,CAAC;AAIf,OAAO,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AACpC,OAAO,EAAoB,KAAK,eAAe,EAAkB,MAAM,gBAAgB,CAAC;AAgBxF,KAAK,aAAa,GAAG;IACnB,IAAI,EAAE,QAAQ,CAAC;IACf,IAAI,EAAE,IAAI,CAAC;CACZ,CAAC;AAEF,KAAK,oBAAoB,GAAG;IAC1B,YAAY,EAAE,GAAG,CAAC;IAClB,KAAK,EAAE,KAAK,CAAC,aAAa,CAAC,CAAC;IAC5B,KAAK,EAAE,MAAM,GAAG,SAAS,CAAC;IAC1B,QAAQ,EAAE,QAAQ,CAAC,cAAc,CAAC,MAAM,GAAG,SAAS,CAAC,CAAC,CAAC;IACvD,QAAQ,EAAE,IAAI,GAAG,SAAS,CAAC;IAC3B,WAAW,EAAE,QAAQ,CAAC,cAAc,CAAC,IAAI,GAAG,SAAS,CAAC,CAAC,CAAC;CACzD,CAAC;AAQF,KAAK,kBAAkB,GAAG;IACxB,QAAQ,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,IAAI,CAAC;CAChC,CAAC;AAMF,KAAK,iBAAiB,GAAG,iBAAiB,CAAC,OAAO,CAAC,IAAI,CAAC,oBAAoB,EAAE,cAAc,CAAC,CAAC,CAAC,CAAC;AAqChG,KAAK,qBAAqB,GAAG,iBAAiB,CAAC,eAAe,CAAC,CAAC;AAgBhE,KAAK,oBAAoB,GAAG,eAAe,CAAC;AA2C5C,KAAK,iBAAiB,GAAG,eAAe,CAAC;IACvC,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE;QAAE,IAAI,EAAE,IAAI,CAAA;KAAE,KAAK,IAAI,CAAC;CAC5C,CAAC,CAAC;AAiJH,eAAO,MAAM,QAAQ;;;;;mCA7M+B,qBAAqB;;;;yBAgBhC,oBAAoB;;;;yCA8CP,iBAAiB;;;CAoJtE,CAAC;AAEF,YAAY,EAAE,kBAAkB,EAAE,iBAAiB,EAAE,qBAAqB,EAAE,oBAAoB,EAAE,iBAAiB,EAAE,CAAC"}
1
+ {"version":3,"file":"Calendar.d.ts","sourceRoot":"","sources":["../../../../../src/components/Calendar/Calendar.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,KAAK,GAAG,EAAmD,MAAM,UAAU,CAAC;AACrF,OAAO,KAAK,EAAE,EACZ,KAAK,QAAQ,EACb,KAAK,iBAAiB,EACtB,KAAK,cAAc,EAQpB,MAAM,OAAO,CAAC;AAIf,OAAO,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AACpC,OAAO,EAAoB,KAAK,eAAe,EAAkB,MAAM,gBAAgB,CAAC;AAgBxF,KAAK,aAAa,GAAG;IACnB,IAAI,EAAE,QAAQ,CAAC;IACf,IAAI,EAAE,IAAI,CAAC;CACZ,CAAC;AAEF,KAAK,oBAAoB,GAAG;IAC1B,YAAY,EAAE,GAAG,CAAC;IAClB,KAAK,EAAE,KAAK,CAAC,aAAa,CAAC,CAAC;IAC5B,KAAK,EAAE,MAAM,GAAG,SAAS,CAAC;IAC1B,QAAQ,EAAE,QAAQ,CAAC,cAAc,CAAC,MAAM,GAAG,SAAS,CAAC,CAAC,CAAC;IACvD,QAAQ,EAAE,IAAI,GAAG,SAAS,CAAC;IAC3B,WAAW,EAAE,QAAQ,CAAC,cAAc,CAAC,IAAI,GAAG,SAAS,CAAC,CAAC,CAAC;CACzD,CAAC;AAQF,KAAK,kBAAkB,GAAG;IACxB,QAAQ,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,IAAI,CAAC;CAChC,CAAC;AAMF,KAAK,iBAAiB,GAAG,iBAAiB,CAAC,OAAO,CAAC,IAAI,CAAC,oBAAoB,EAAE,cAAc,CAAC,CAAC,CAAC,CAAC;AAuChG,KAAK,oBAAoB,GAAG,eAAe,CAAC;AA8C5C,KAAK,iBAAiB,GAAG,eAAe,CAAC;IACvC,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE;QAAE,IAAI,EAAE,IAAI,CAAA;KAAE,KAAK,IAAI,CAAC;CAC5C,CAAC,CAAC;AAgJH,eAAO,MAAM,QAAQ;;;;;mCA/L8B,oBAAoB;;;;mDAiDP,iBAAiB;;;CAkJhF,CAAC;AAEF,YAAY,EAAE,kBAAkB,EAAE,iBAAiB,EAAE,oBAAoB,EAAE,iBAAiB,EAAE,CAAC"}
package/dist/types/src/components/Calendar/Calendar.stories.d.ts CHANGED
@@ -3,12 +3,10 @@ import React from 'react';
3
3
  declare const meta: {
4
4
  title: string;
5
5
  component: {
6
- ({ classNames, rows, onSelect }: import("./Calendar").CalendarGridProps): React.JSX.Element;
6
+ ({ classNames, rows, onSelect, ...props }: import("./Calendar").CalendarGridProps): React.JSX.Element;
7
7
  displayName: string;
8
8
  };
9
- decorators: import("@storybook/react").Decorator[];
10
9
  parameters: {
11
- layout: string;
12
10
  translations: [{
13
11
  readonly 'en-US': {
14
12
  readonly "@dxos/react-ui-calendar": {
@@ -21,7 +19,5 @@ declare const meta: {
21
19
  export default meta;
22
20
  type Story = StoryObj<typeof meta>;
23
21
  export declare const Default: Story;
24
- export declare const Border: Story;
25
22
  export declare const Column: Story;
26
- export declare const Mobile: Story;
27
23
  //# sourceMappingURL=Calendar.stories.d.ts.map
package/dist/types/src/components/Calendar/Calendar.stories.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Calendar.stories.d.ts","sourceRoot":"","sources":["../../../../../src/components/Calendar/Calendar.stories.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAa,KAAK,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AACjE,OAAO,KAAK,MAAM,OAAO,CAAC;AAQ1B,QAAA,MAAM,IAAI;;;;;;;;;;;;;;;;;CAQ4B,CAAC;AAEvC,eAAe,IAAI,CAAC;AAEpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AAEnC,eAAO,MAAM,OAAO,EAAE,KASrB,CAAC;AAEF,eAAO,MAAM,MAAM,EAAE,KASpB,CAAC;AAEF,eAAO,MAAM,MAAM,EAAE,KAWpB,CAAC;AAEF,eAAO,MAAM,MAAM,EAAE,KAapB,CAAC"}
1
+ {"version":3,"file":"Calendar.stories.d.ts","sourceRoot":"","sources":["../../../../../src/components/Calendar/Calendar.stories.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAa,KAAK,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AACjE,OAAO,KAAK,MAAM,OAAO,CAAC;AAS1B,QAAA,MAAM,IAAI;;;;;;;;;;;;;;;CAM4B,CAAC;AAEvC,eAAe,IAAI,CAAC;AAEpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AAEnC,eAAO,MAAM,OAAO,EAAE,KAQrB,CAAC;AAEF,eAAO,MAAM,MAAM,EAAE,KAcpB,CAAC"}