diff --git a/packages/x-scheduler-headless/src/calendar-grid/current-time-indicator/CalendarGridCurrentTimeIndicator.tsx b/packages/x-scheduler-headless/src/calendar-grid/current-time-indicator/CalendarGridCurrentTimeIndicator.tsx index cc96e5f6cac64..899ba329c3009 100644 --- a/packages/x-scheduler-headless/src/calendar-grid/current-time-indicator/CalendarGridCurrentTimeIndicator.tsx +++ b/packages/x-scheduler-headless/src/calendar-grid/current-time-indicator/CalendarGridCurrentTimeIndicator.tsx @@ -55,7 +55,7 @@ export const CalendarGridCurrentTimeIndicator = React.forwardRef( [position], ); - const props = React.useMemo(() => ({ style }), [style]); + const props = { style }; const isOutOfRange = adapter.isBefore(nowForColumn, columnStart) || adapter.isAfter(nowForColumn, columnEnd); diff --git a/packages/x-scheduler-headless/src/calendar-grid/day-cell/CalendarGridDayCell.tsx b/packages/x-scheduler-headless/src/calendar-grid/day-cell/CalendarGridDayCell.tsx index ddbbf36da94e0..01a741e0a3300 100644 --- a/packages/x-scheduler-headless/src/calendar-grid/day-cell/CalendarGridDayCell.tsx +++ b/packages/x-scheduler-headless/src/calendar-grid/day-cell/CalendarGridDayCell.tsx @@ -24,7 +24,7 @@ export const CalendarGridDayCell = React.forwardRef(function CalendarGridDayCell const { ref: listItemRef, index } = useCompositeListItem(); const dropTargetRef = useDayCellDropTarget({ value, addPropertiesToDroppedEvent }); - const props = React.useMemo(() => ({ role: 'gridcell' }), []); + const props = { role: 'gridcell' }; const contextValue: CalendarGridDayCellContext = React.useMemo( () => ({ diff --git a/packages/x-scheduler-headless/src/calendar-grid/day-event-placeholder/CalendarGridDayEventPlaceholder.tsx b/packages/x-scheduler-headless/src/calendar-grid/day-event-placeholder/CalendarGridDayEventPlaceholder.tsx index db93822c432dd..36ee34c7de098 100644 --- a/packages/x-scheduler-headless/src/calendar-grid/day-event-placeholder/CalendarGridDayEventPlaceholder.tsx +++ b/packages/x-scheduler-headless/src/calendar-grid/day-event-placeholder/CalendarGridDayEventPlaceholder.tsx @@ -4,8 +4,6 @@ import { useRenderElement } from '../../base-ui-copy/utils/useRenderElement'; import { BaseUIComponentProps } from '../../base-ui-copy/utils/types'; import { useEvent } from '../../utils/useEvent'; -const EVENT_PLACEHOLDER_PROPS = { style: { pointerEvents: 'none' as const } }; - export const CalendarGridDayEventPlaceholder = React.forwardRef( function CalendarGridDayEventPlaceholder( componentProps: CalendarGridDayEventPlaceholder.Props, @@ -27,7 +25,7 @@ export const CalendarGridDayEventPlaceholder = React.forwardRef( return useRenderElement('div', componentProps, { state, ref: [forwardedRef], - props: [elementProps, EVENT_PLACEHOLDER_PROPS], + props: [elementProps, { style: { pointerEvents: 'none' as const } }], }); }, ); diff --git a/packages/x-scheduler-headless/src/calendar-grid/day-event/CalendarGridDayEvent.tsx b/packages/x-scheduler-headless/src/calendar-grid/day-event/CalendarGridDayEvent.tsx index 40c1e79a049c2..bb2b085d4ae98 100644 --- a/packages/x-scheduler-headless/src/calendar-grid/day-event/CalendarGridDayEvent.tsx +++ b/packages/x-scheduler-headless/src/calendar-grid/day-event/CalendarGridDayEvent.tsx @@ -17,8 +17,6 @@ import { useEventCalendarStoreContext } from '../../use-event-calendar-store-con import { useCalendarGridDayCellContext } from '../day-cell/CalendarGridDayCellContext'; import { useCalendarGridRootContext } from '../root/CalendarGridRootContext'; -const EVENT_STYLE_WHILE_DRAGGING = { pointerEvents: 'none' as const }; - export const CalendarGridDayEvent = React.forwardRef(function CalendarGridDayEvent( componentProps: CalendarGridDayEvent.Props, forwardedRef: React.ForwardedRef, @@ -127,14 +125,11 @@ export const CalendarGridDayEvent = React.forwardRef(function CalendarGridDayEve const columnHeaderId = getCalendarGridHeaderCellId(rootId, cellIndex); - const props = React.useMemo( - () => ({ - id, - 'aria-labelledby': `${columnHeaderId} ${id}`, - style: hasPlaceholder ? EVENT_STYLE_WHILE_DRAGGING : undefined, - }), - [hasPlaceholder, columnHeaderId, id], - ); + const props = { + id, + 'aria-labelledby': `${columnHeaderId} ${id}`, + style: hasPlaceholder ? { pointerEvents: 'none' as const } : undefined, + }; const contextValue: CalendarGridDayEventContext = React.useMemo( () => ({ ...draggableEventContextValue, getSharedDragData }), diff --git a/packages/x-scheduler-headless/src/calendar-grid/day-row/CalendarGridDayRow.tsx b/packages/x-scheduler-headless/src/calendar-grid/day-row/CalendarGridDayRow.tsx index 60124fe070397..785ae1294f60e 100644 --- a/packages/x-scheduler-headless/src/calendar-grid/day-row/CalendarGridDayRow.tsx +++ b/packages/x-scheduler-headless/src/calendar-grid/day-row/CalendarGridDayRow.tsx @@ -21,7 +21,7 @@ export const CalendarGridDayRow = React.forwardRef(function CalendarGridDayRow( ...elementProps } = componentProps; - const props = React.useMemo(() => ({ role: 'row' }), []); + const props = { role: 'row' }; const cellsRefs = React.useRef<(HTMLDivElement | null)[]>([]); const contextValue: CalendarGridDayRowContext = React.useMemo( diff --git a/packages/x-scheduler-headless/src/calendar-grid/header-cell/CalendarGridHeaderCell.tsx b/packages/x-scheduler-headless/src/calendar-grid/header-cell/CalendarGridHeaderCell.tsx index 92143454e2b74..2f9bff61f30c7 100644 --- a/packages/x-scheduler-headless/src/calendar-grid/header-cell/CalendarGridHeaderCell.tsx +++ b/packages/x-scheduler-headless/src/calendar-grid/header-cell/CalendarGridHeaderCell.tsx @@ -40,14 +40,11 @@ export const CalendarGridHeaderCell = React.forwardRef(function CalendarGridHead const { ref: listItemRef, index } = useCompositeListItem(); const id = getCalendarGridHeaderCellId(rootId, index); - const props = React.useMemo( - () => ({ - role: 'columnheader', - id, - 'aria-label': `${adapter.formatByString(date.value, ariaLabelFormat)}`, - }), - [adapter, date, id, ariaLabelFormat], - ); + const props = { + role: 'columnheader', + id, + 'aria-label': `${adapter.formatByString(date.value, ariaLabelFormat)}`, + }; const state: CalendarGridHeaderCell.State = React.useMemo( () => ({ diff --git a/packages/x-scheduler-headless/src/calendar-grid/header-row/CalendarGridHeaderRow.tsx b/packages/x-scheduler-headless/src/calendar-grid/header-row/CalendarGridHeaderRow.tsx index 09d697fd39b78..7fcb2276290e5 100644 --- a/packages/x-scheduler-headless/src/calendar-grid/header-row/CalendarGridHeaderRow.tsx +++ b/packages/x-scheduler-headless/src/calendar-grid/header-row/CalendarGridHeaderRow.tsx @@ -16,7 +16,7 @@ export const CalendarGridHeaderRow = React.forwardRef(function CalendarGridHeade ...elementProps } = componentProps; - const props = React.useMemo(() => ({ role: 'row' }), []); + const props = { role: 'row' }; const cellsRefs = React.useRef<(HTMLDivElement | null)[]>([]); const element = useRenderElement('div', componentProps, { diff --git a/packages/x-scheduler-headless/src/calendar-grid/root/CalendarGridRoot.tsx b/packages/x-scheduler-headless/src/calendar-grid/root/CalendarGridRoot.tsx index 446286cb375a3..8fb16ce614210 100644 --- a/packages/x-scheduler-headless/src/calendar-grid/root/CalendarGridRoot.tsx +++ b/packages/x-scheduler-headless/src/calendar-grid/root/CalendarGridRoot.tsx @@ -20,7 +20,7 @@ export const CalendarGridRoot = React.forwardRef(function CalendarGridRoot( const id = useId(idProp); - const props = React.useMemo(() => ({ role: 'grid', id }), [id]); + const props = { role: 'grid', id }; const contextValue: CalendarGridRootContext = React.useMemo(() => ({ id }), [id]); diff --git a/packages/x-scheduler-headless/src/calendar-grid/time-column/CalendarGridTimeColumn.tsx b/packages/x-scheduler-headless/src/calendar-grid/time-column/CalendarGridTimeColumn.tsx index 2bfcab25bc37f..1a501eb36b862 100644 --- a/packages/x-scheduler-headless/src/calendar-grid/time-column/CalendarGridTimeColumn.tsx +++ b/packages/x-scheduler-headless/src/calendar-grid/time-column/CalendarGridTimeColumn.tsx @@ -42,7 +42,7 @@ export const CalendarGridTimeColumn = React.forwardRef(function CalendarGridTime [isCurrentDay], ); - const props = React.useMemo(() => ({ role: 'gridcell' }), []); + const props = { role: 'gridcell' }; const contextValue: CalendarGridTimeColumnContext = React.useMemo( () => ({ diff --git a/packages/x-scheduler-headless/src/calendar-grid/time-event-placeholder/CalendarGridTimeEventPlaceholder.tsx b/packages/x-scheduler-headless/src/calendar-grid/time-event-placeholder/CalendarGridTimeEventPlaceholder.tsx index c73b0b76ddc51..02ade8d39748d 100644 --- a/packages/x-scheduler-headless/src/calendar-grid/time-event-placeholder/CalendarGridTimeEventPlaceholder.tsx +++ b/packages/x-scheduler-headless/src/calendar-grid/time-event-placeholder/CalendarGridTimeEventPlaceholder.tsx @@ -41,7 +41,7 @@ export const CalendarGridTimeEventPlaceholder = React.forwardRef( [position, duration], ); - const props = React.useMemo(() => ({ style }), [style]); + const props = { style }; const { state } = useEvent({ start, end }); diff --git a/packages/x-scheduler-headless/src/calendar-grid/time-event/CalendarGridTimeEvent.tsx b/packages/x-scheduler-headless/src/calendar-grid/time-event/CalendarGridTimeEvent.tsx index d71f2d3ec6811..f437ece409bde 100644 --- a/packages/x-scheduler-headless/src/calendar-grid/time-event/CalendarGridTimeEvent.tsx +++ b/packages/x-scheduler-headless/src/calendar-grid/time-event/CalendarGridTimeEvent.tsx @@ -135,10 +135,7 @@ export const CalendarGridTimeEvent = React.forwardRef(function CalendarGridTimeE const columnHeaderId = getCalendarGridHeaderCellId(rootId, columnIndex); - const props = React.useMemo( - () => ({ id, style, 'aria-labelledby': `${columnHeaderId} ${id}` }), - [style, columnHeaderId, id], - ); + const props = { id, style, 'aria-labelledby': `${columnHeaderId} ${id}` }; const contextValue: CalendarGridTimeEventContext = React.useMemo( () => ({ ...draggableEventContextValue, getSharedDragData }), diff --git a/packages/x-scheduler-headless/src/timeline/cell/TimelineCell.tsx b/packages/x-scheduler-headless/src/timeline/cell/TimelineCell.tsx index cb9116d65bb7a..3e0f1c4d0c385 100644 --- a/packages/x-scheduler-headless/src/timeline/cell/TimelineCell.tsx +++ b/packages/x-scheduler-headless/src/timeline/cell/TimelineCell.tsx @@ -16,7 +16,7 @@ export const TimelineCell = React.forwardRef(function TimelineCell( } = componentProps; // TODO: Add aria-colindex using Composite. - const props = React.useMemo(() => ({ role: 'cell' }), []); + const props = { role: 'cell' }; return useRenderElement('div', componentProps, { ref: [forwardedRef], diff --git a/packages/x-scheduler-headless/src/timeline/event-row/TimelineEventRow.tsx b/packages/x-scheduler-headless/src/timeline/event-row/TimelineEventRow.tsx index a26b0dde06963..b475dbcedeade 100644 --- a/packages/x-scheduler-headless/src/timeline/event-row/TimelineEventRow.tsx +++ b/packages/x-scheduler-headless/src/timeline/event-row/TimelineEventRow.tsx @@ -21,7 +21,7 @@ export const TimelineEventRow = React.forwardRef(function TimelineEventRow( } = componentProps; // TODO: Add aria-rowindex using Composite. - const props = React.useMemo(() => ({ role: 'row' }), []); + const props = { role: 'row' }; const contextValue: TimelineEventRowContext = React.useMemo(() => ({ start, end }), [start, end]); diff --git a/packages/x-scheduler-headless/src/timeline/event/TimelineEvent.tsx b/packages/x-scheduler-headless/src/timeline/event/TimelineEvent.tsx index f2c2ca0f82a4b..1705deed72713 100644 --- a/packages/x-scheduler-headless/src/timeline/event/TimelineEvent.tsx +++ b/packages/x-scheduler-headless/src/timeline/event/TimelineEvent.tsx @@ -51,7 +51,7 @@ export const TimelineEvent = React.forwardRef(function TimelineEvent( [position, duration], ); - const props = React.useMemo(() => ({ style }), [style]); + const props = { style }; const { state } = useEvent({ start, end }); diff --git a/packages/x-scheduler-headless/src/timeline/root/TimelineRoot.tsx b/packages/x-scheduler-headless/src/timeline/root/TimelineRoot.tsx index f744177956293..0e3383dff292a 100644 --- a/packages/x-scheduler-headless/src/timeline/root/TimelineRoot.tsx +++ b/packages/x-scheduler-headless/src/timeline/root/TimelineRoot.tsx @@ -22,7 +22,7 @@ export const TimelineRoot = React.forwardRef(function TimelineRoot( ...elementProps } = componentProps; - const props = React.useMemo(() => ({ role: 'grid' }), []); + const props = { role: 'grid' }; const store = useRefWithInit(() => new Store({ items: itemsProp })).current; diff --git a/packages/x-scheduler-headless/src/timeline/row/TimelineRow.tsx b/packages/x-scheduler-headless/src/timeline/row/TimelineRow.tsx index 9c15917260441..9cd1a38bf73cd 100644 --- a/packages/x-scheduler-headless/src/timeline/row/TimelineRow.tsx +++ b/packages/x-scheduler-headless/src/timeline/row/TimelineRow.tsx @@ -16,7 +16,7 @@ export const TimelineRow = React.forwardRef(function TimelineRow( } = componentProps; // TODO: Add aria-rowindex using Composite. - const props = React.useMemo(() => ({ role: 'row' }), []); + const props = { role: 'row' }; return useRenderElement('div', componentProps, { ref: [forwardedRef], diff --git a/packages/x-scheduler-headless/src/timeline/sub-grid/TimelineSubGrid.tsx b/packages/x-scheduler-headless/src/timeline/sub-grid/TimelineSubGrid.tsx index 9b0c64b32d0c5..35f30c0a650ab 100644 --- a/packages/x-scheduler-headless/src/timeline/sub-grid/TimelineSubGrid.tsx +++ b/packages/x-scheduler-headless/src/timeline/sub-grid/TimelineSubGrid.tsx @@ -31,7 +31,7 @@ export const TimelineSubGrid = React.forwardRef(function TimelineSubGrid ({ role: 'rowgroup', children }), [children]); + const props = { role: 'rowgroup', children }; return useRenderElement('div', componentProps, { ref: [forwardedRef],