@ishibashi0112/spreadsheet-grid 0.33.0 → 0.35.0

package/dist/view/CellContextMenuPopover.d.ts

@@ -1,13 +1,14 @@
 import type { RefObject } from 'react';
-import type { GridContextMenuItem } from '../model/gridTypes';
+import type { GridContextMenuItem, GridResolvedSlots } from '../model/gridTypes';
 import type { CellContextMenuLayout } from '../hooks/useCellContextMenuController';
 type CellContextMenuPopoverProps = {
     isOpen: boolean;
     themeClassName?: string;
+    slots?: GridResolvedSlots;
     items: GridContextMenuItem[];
     layout: CellContextMenuLayout | null;
     popoverRef: RefObject<HTMLDivElement | null>;
     onRequestClose: () => void;
 };
-export declare function CellContextMenuPopover({ isOpen, themeClassName, items, layout, popoverRef, onRequestClose, }: CellContextMenuPopoverProps): import("react").ReactPortal | null;
+export declare function CellContextMenuPopover({ isOpen, themeClassName, slots, items, layout, popoverRef, onRequestClose, }: CellContextMenuPopoverProps): import("react").ReactPortal | null;
 export default CellContextMenuPopover;

package/dist/view/ColumnFilterPopover.d.ts

@@ -6,6 +6,7 @@ import { type NumberFilterConditionDraft } from '../logic/numberFilterCondition'
 import { type TextFilterConditionDraft } from '../logic/textFilterCondition';
 import { type DateFilterConditionDraft } from '../logic/dateFilterCondition';
 import { type NormalizedDateFilterPreset } from '../logic/dateFilterPresets';
+import type { GridResolvedSlot } from '../model/gridTypes';
 export type ColumnFilterPopoverLayout = {
     top: number;
     left: number;
@@ -19,6 +20,7 @@ export type ColumnFilterPopoverOption = {
 type ColumnFilterPopoverProps = {
     isOpen: boolean;
     themeClassName?: string;
+    popoverSlot?: GridResolvedSlot;
     title: string;
     filterType: ColumnFilterUiType;
     draftValue: string;
@@ -52,5 +54,5 @@ type ColumnFilterPopoverProps = {
     onSetReplaceSelection: (values: string[]) => void;
     isServerSide?: boolean;
 };
-export declare function ColumnFilterPopover({ isOpen, themeClassName, title, filterType, draftValue, numberConditionDraft, onNumberConditionDraftChange, textConditionDraft, onTextConditionDraftChange, dateConditionDraft, onDateConditionDraftChange, datePresets, renderDateInput, onComboConditionClear, onComboSelectionClear, comboSummaryText, currentValueText, layout, selectOptions, optionsStatus, optionsProgress, setSelection, popoverRef, textInputRef, selectRef, onRequestClose, onDraftChange, onApply, onClear, onSetValueToggle, onSetSelectAllChange, onSetClear, onSetReplaceSelection, isServerSide, }: ColumnFilterPopoverProps): import("react").ReactPortal | null;
+export declare function ColumnFilterPopover({ isOpen, themeClassName, popoverSlot, title, filterType, draftValue, numberConditionDraft, onNumberConditionDraftChange, textConditionDraft, onTextConditionDraftChange, dateConditionDraft, onDateConditionDraftChange, datePresets, renderDateInput, onComboConditionClear, onComboSelectionClear, comboSummaryText, currentValueText, layout, selectOptions, optionsStatus, optionsProgress, setSelection, popoverRef, textInputRef, selectRef, onRequestClose, onDraftChange, onApply, onClear, onSetValueToggle, onSetSelectAllChange, onSetClear, onSetReplaceSelection, isServerSide, }: ColumnFilterPopoverProps): import("react").ReactPortal | null;
 export default ColumnFilterPopover;

package/dist/view/ColumnMenuPopover.d.ts

@@ -1,9 +1,11 @@
 import type { RefObject } from 'react';
 import type { GridColumnPinned, GridSortDirection } from '../model/gridTypes';
 import type { ColumnMenuLayout } from '../hooks/useColumnMenuController';
+import type { GridResolvedSlots } from '../model/gridTypes';
 type ColumnMenuPopoverProps = {
     isOpen: boolean;
     themeClassName?: string;
+    slots?: GridResolvedSlots;
     title: string;
     columnKey: string;
     canFilter: boolean;
@@ -26,5 +28,5 @@ type ColumnMenuPopoverProps = {
     onResetColumns: () => void;
     onRequestClose: () => void;
 };
-export declare function ColumnMenuPopover({ isOpen, themeClassName, title, columnKey, canFilter, onOpenFilter, canSort, sortDirection, onSortChange, onOpenSortManager, canManageFilters, onOpenFilterManager, pinned, canChangePinned, layout, popoverRef, onPinnedChange, onAutosizeColumn, onAutosizeAllColumns, onOpenColumnChooser, canResetColumns, onResetColumns, onRequestClose, }: ColumnMenuPopoverProps): import("react").ReactPortal | null;
+export declare function ColumnMenuPopover({ isOpen, themeClassName, slots, title, columnKey, canFilter, onOpenFilter, canSort, sortDirection, onSortChange, onOpenSortManager, canManageFilters, onOpenFilterManager, pinned, canChangePinned, layout, popoverRef, onPinnedChange, onAutosizeColumn, onAutosizeAllColumns, onOpenColumnChooser, canResetColumns, onResetColumns, onRequestClose, }: ColumnMenuPopoverProps): import("react").ReactPortal | null;
 export default ColumnMenuPopover;

package/dist/view/DefaultGridBottomBar.d.ts

@@ -1,7 +1,9 @@
 import type { SpreadsheetGridSlotContext } from '../model/gridTypes';
+import type { GridResolvedSlot } from '../model/gridTypes';
 type DefaultGridBottomBarProps<T> = {
     context: SpreadsheetGridSlotContext<T>;
     showCounts?: boolean;
+    slot?: GridResolvedSlot;
 };
-export declare function DefaultGridBottomBar<T>({ context, showCounts, }: DefaultGridBottomBarProps<T>): import("react").JSX.Element;
+export declare function DefaultGridBottomBar<T>({ context, showCounts, slot, }: DefaultGridBottomBarProps<T>): import("react").JSX.Element;
 export default DefaultGridBottomBar;

package/dist/view/DefaultGridTopBar.d.ts

@@ -1,5 +1,6 @@
 import type { ReactNode } from 'react';
 import type { SpreadsheetGridSlotContext } from '../model/gridTypes';
+import type { GridResolvedSlot } from '../model/gridTypes';
 type DefaultGridTopBarProps<T> = {
     context: SpreadsheetGridSlotContext<T>;
     showSummary?: boolean;
@@ -8,6 +9,7 @@ type DefaultGridTopBarProps<T> = {
     globalFilterPlaceholder?: string;
     globalFilterIcon?: ReactNode;
     onFilterSummaryClick?: () => void;
+    slot?: GridResolvedSlot;
 };
-export declare function DefaultGridTopBar<T>({ context, showSummary, showFilter, showCounts, globalFilterPlaceholder, globalFilterIcon, onFilterSummaryClick, }: DefaultGridTopBarProps<T>): import("react").JSX.Element;
+export declare function DefaultGridTopBar<T>({ context, showSummary, showFilter, showCounts, globalFilterPlaceholder, globalFilterIcon, onFilterSummaryClick, slot, }: DefaultGridTopBarProps<T>): import("react").JSX.Element;
 export default DefaultGridTopBar;

package/dist/view/GridBodyLayer.d.ts

@@ -3,6 +3,7 @@ import type { SelectionSnapshot } from '../model/gridSelectors';
 import type { CellCoord, CellRenderState, GridColumn, RowModel, RowSelectionState, RowStyleContext, SpreadsheetGridProps } from '../model/gridTypes';
 import type { PaneColumnEntry } from '../logic/geometry';
 import type { GridPaneKind } from './GridHeaderRow';
+import type { GridResolvedSlots, GridSlotProps } from '../model/gridTypes';
 type VirtualRowLike = {
     index: number;
     start: number;
@@ -40,10 +41,8 @@ type GridBodyLayerProps<T> = {
     onCellPointerEnter: (cell: CellCoord, event: PointerEvent<HTMLDivElement>) => void;
     onCellDoubleClick: (cell: CellCoord) => void;
     renderCellContent: (row: T, rowIndex: number, column: GridColumn<T>, colIndex: number, cellState: CellRenderState) => ReactNode;
-    getRowClassName?: (row: T, rowIndex: number, ctx: RowStyleContext<T>) => string | undefined;
-    bodyCellClassName?: string;
-    bodyRowClassName?: string;
-    rowHeaderCellClassName?: string;
+    getRowClassName?: (row: T, rowIndex: number, ctx: RowStyleContext<T>) => GridSlotProps | undefined;
+    slots?: GridResolvedSlots;
 };
-export declare function GridBodyLayer<T>({ pane, ownsRowHeader, leadingWidth, rowModel, virtualRows, virtualRowIndexes, renderEntries, rowHeight, autoHeight, showCellOverflowTooltip, showValidationMarks, isServerSide, collapsedGroupKeys, onGroupToggle, rowHeaderCellStyle, hoveredRowIndex, isWholeGridSelected, enableRowSelection, rowSelectionState, activeCell, editingCell, selectionSnapshot, readOnly, canEditCell, onRowHeaderPointerDown, onRowHeaderPointerEnter, onRowHeaderPointerLeave, onCellPointerDown, onCellPointerEnter, onCellDoubleClick, renderCellContent, getRowClassName, bodyCellClassName, bodyRowClassName, rowHeaderCellClassName, }: GridBodyLayerProps<T>): import("react").JSX.Element;
+export declare function GridBodyLayer<T>({ pane, ownsRowHeader, leadingWidth, rowModel, virtualRows, virtualRowIndexes, renderEntries, rowHeight, autoHeight, showCellOverflowTooltip, showValidationMarks, isServerSide, collapsedGroupKeys, onGroupToggle, rowHeaderCellStyle, hoveredRowIndex, isWholeGridSelected, enableRowSelection, rowSelectionState, activeCell, editingCell, selectionSnapshot, readOnly, canEditCell, onRowHeaderPointerDown, onRowHeaderPointerEnter, onRowHeaderPointerLeave, onCellPointerDown, onCellPointerEnter, onCellDoubleClick, renderCellContent, getRowClassName, slots, }: GridBodyLayerProps<T>): import("react").JSX.Element;
 export default GridBodyLayer;

package/dist/view/GridDetailLayer.d.ts

@@ -1,5 +1,6 @@
 import { type ReactNode } from 'react';
 import type { VerticalRow } from '../logic/verticalGeometry';
+import type { GridResolvedSlot, GridResolvedSlots } from '../model/gridTypes';
 export type GridDetailLayerEntry = {
     rowKey: string | number;
     virtualRow: VerticalRow;
@@ -11,9 +12,10 @@ type GridDetailLayerProps = {
     baseOffset: number;
     cardStickyLeft: number;
     cardWidth: number;
-    cardClassName?: string;
+    cardSlot?: GridResolvedSlot;
+    slots?: GridResolvedSlots;
     renderCard: (entry: GridDetailLayerEntry) => ReactNode;
 };
-declare function GridDetailLayerInner({ entries, mode, paneWidth, baseOffset, cardStickyLeft, cardWidth, cardClassName, renderCard, }: GridDetailLayerProps): import("react").JSX.Element | null;
+declare function GridDetailLayerInner({ entries, mode, paneWidth, baseOffset, cardStickyLeft, cardWidth, cardSlot, slots, renderCard, }: GridDetailLayerProps): import("react").JSX.Element | null;
 export declare const GridDetailLayer: import("react").MemoExoticComponent<typeof GridDetailLayerInner>;
 export default GridDetailLayer;

package/dist/view/GridFilterChipBar.d.ts

@@ -1,10 +1,12 @@
 import type { FilterManagementEntry } from './FilterManagementPanel';
+import type { GridResolvedSlot } from '../model/gridTypes';
 type GridFilterChipBarProps = {
     entries: FilterManagementEntry[];
     canFilter: boolean;
     onEditFilter: (columnKey: string) => void;
     onClearFilter: (columnKey: string) => void;
     onClearAllFilters: () => void;
+    slot?: GridResolvedSlot;
 };
-export declare function GridFilterChipBar({ entries, canFilter, onEditFilter, onClearFilter, onClearAllFilters, }: GridFilterChipBarProps): import("react").JSX.Element | null;
+export declare function GridFilterChipBar({ entries, canFilter, onEditFilter, onClearFilter, onClearAllFilters, slot, }: GridFilterChipBarProps): import("react").JSX.Element | null;
 export default GridFilterChipBar;

package/dist/view/GridHeaderRow.d.ts

@@ -2,6 +2,7 @@ import { type CSSProperties, type MouseEvent, type PointerEvent } from 'react';
 import type { SelectionSnapshot } from '../model/gridSelectors';
 import type { ColumnFilterValue, GridColumn, GridSortState, SelectAllState } from '../model/gridTypes';
 import type { PaneColumnEntry } from '../logic/geometry';
+import type { GridResolvedSlots } from '../model/gridTypes';
 export type GridPaneKind = 'left' | 'center' | 'right';
 type GridHeaderRowProps<T> = {
     pane: GridPaneKind;
@@ -9,9 +10,7 @@ type GridHeaderRowProps<T> = {
     leadingWidth: number;
     headerHeight: number;
     rowHeaderCellStyle: CSSProperties;
-    headerRowClassName?: string;
-    headerCellClassName?: string;
-    rowHeaderCellClassName?: string;
+    slots?: GridResolvedSlots;
     isCornerHovered: boolean;
     isWholeGridSelected: boolean;
     showSelectAllCheckbox: boolean;
@@ -23,7 +22,6 @@ type GridHeaderRowProps<T> = {
     selectionSnapshot: SelectionSnapshot;
     columnFilterValues: Record<string, ColumnFilterValue>;
     sortState: GridSortState;
-    iconButtonClassName?: string;
     onCornerPointerDown: (event: PointerEvent<HTMLDivElement>) => void;
     onCornerPointerEnter: () => void;
     onCornerPointerLeave: () => void;
@@ -39,6 +37,6 @@ type GridHeaderRowProps<T> = {
     onColumnHeaderContextMenu: (column: GridColumn<T>, event: MouseEvent<HTMLDivElement>) => void;
     onColumnDragHandlePointerDown?: (column: GridColumn<T>, event: PointerEvent<HTMLSpanElement>) => void;
 };
-declare function GridHeaderRowInner<T>({ pane, ownsRowHeader, leadingWidth, headerHeight, rowHeaderCellStyle, headerRowClassName, headerCellClassName, rowHeaderCellClassName, isCornerHovered, isWholeGridSelected, showSelectAllCheckbox, selectAllState, filteredRowsLength, visibleColumnsLength, renderEntries, hoveredColumnIndex, selectionSnapshot, columnFilterValues, sortState, iconButtonClassName, onCornerPointerDown, onCornerPointerEnter, onCornerPointerLeave, onColumnHeaderPointerDown, onColumnHeaderPointerEnter, onColumnHeaderPointerLeave, onColumnResizePointerDown, enableColumnResize, enableColumnMenu, openedMenuColumnKey, onColumnMenuButtonPointerDown, onColumnMenuButtonClick, onColumnHeaderContextMenu, onColumnDragHandlePointerDown, }: GridHeaderRowProps<T>): import("react").JSX.Element;
+declare function GridHeaderRowInner<T>({ pane, ownsRowHeader, leadingWidth, headerHeight, rowHeaderCellStyle, slots, isCornerHovered, isWholeGridSelected, showSelectAllCheckbox, selectAllState, filteredRowsLength, visibleColumnsLength, renderEntries, hoveredColumnIndex, selectionSnapshot, columnFilterValues, sortState, onCornerPointerDown, onCornerPointerEnter, onCornerPointerLeave, onColumnHeaderPointerDown, onColumnHeaderPointerEnter, onColumnHeaderPointerLeave, onColumnResizePointerDown, enableColumnResize, enableColumnMenu, openedMenuColumnKey, onColumnMenuButtonPointerDown, onColumnMenuButtonClick, onColumnHeaderContextMenu, onColumnDragHandlePointerDown, }: GridHeaderRowProps<T>): import("react").JSX.Element;
 export declare const GridHeaderRow: typeof GridHeaderRowInner;
 export default GridHeaderRow;

package/dist/view/GridScrollHint.d.ts

@@ -2,9 +2,11 @@ import type { RefObject } from 'react';
 import type { RowModel } from '../model/gridTypes';
 import type { RowMetrics } from '../logic/verticalGeometry';
 import type { ResolvedScrollHintOptions } from '../logic/scrollHint';
+import type { GridResolvedSlot } from '../model/gridTypes';
+import type { ReactGridTypes } from '../model/gridTypes';
 export declare const SCROLL_HINT_GUTTER_WIDTH_PX = 14;
 export type GridScrollHintProps<T> = {
-    options: ResolvedScrollHintOptions<T>;
+    options: ResolvedScrollHintOptions<T, ReactGridTypes>;
     scrollContainerRef: RefObject<HTMLDivElement | null>;
     scrollTop: number;
     viewportHeight: number;
@@ -13,5 +15,6 @@ export type GridScrollHintProps<T> = {
     verticalScaleFactor: number;
     rowMetrics: RowMetrics;
     rowModel: RowModel<T>;
+    slot?: GridResolvedSlot;
 };
-export declare function GridScrollHint<T>({ options, scrollContainerRef, scrollTop, viewportHeight, headerHeight, physicalBodyHeight, verticalScaleFactor, rowMetrics, rowModel, }: GridScrollHintProps<T>): import("react").JSX.Element | null;
+export declare function GridScrollHint<T>({ options, scrollContainerRef, scrollTop, viewportHeight, headerHeight, physicalBodyHeight, verticalScaleFactor, rowMetrics, rowModel, slot, }: GridScrollHintProps<T>): import("react").JSX.Element | null;

package/dist/view/RowSelectionCheckbox.d.ts

@@ -1,8 +1,10 @@
+import type { GridResolvedSlot } from '../model/gridTypes';
 export type RowCheckboxState = 'unchecked' | 'checked' | 'indeterminate';
 type RowSelectionCheckboxProps = {
     state: RowCheckboxState;
     disabled?: boolean;
+    slot?: GridResolvedSlot;
 };
-declare function RowSelectionCheckboxInner({ state, disabled, }: RowSelectionCheckboxProps): import("react").JSX.Element;
+declare function RowSelectionCheckboxInner({ state, disabled, slot, }: RowSelectionCheckboxProps): import("react").JSX.Element;
 export declare const RowSelectionCheckbox: import("react").MemoExoticComponent<typeof RowSelectionCheckboxInner>;
 export default RowSelectionCheckbox;

package/dist/view/ToolPanel.d.ts

@@ -1,5 +1,6 @@
 import type { ReactNode, RefObject } from 'react';
 import type { ToolPanelLayout, ToolPanelTab } from '../hooks/useToolPanelController';
+import type { GridResolvedSlot } from '../model/gridTypes';
 export type ToolPanelTabDescriptor = {
     tab: ToolPanelTab;
     label: string;
@@ -7,6 +8,7 @@ export type ToolPanelTabDescriptor = {
 };
 type ToolPanelProps = {
     themeClassName?: string;
+    popoverSlot?: GridResolvedSlot;
     activeTab: ToolPanelTab | null;
     flashTick: number;
     tabs: ToolPanelTabDescriptor[];
@@ -17,5 +19,5 @@ type ToolPanelProps = {
     onPanelMove: (top: number, left: number) => void;
     children: ReactNode;
 };
-export declare function ToolPanel({ themeClassName, activeTab, flashTick, tabs, layout, panelRef, onSelectTab, onRequestClose, onPanelMove, children, }: ToolPanelProps): import("react").ReactPortal | null;
+export declare function ToolPanel({ themeClassName, popoverSlot, activeTab, flashTick, tabs, layout, panelRef, onSelectTab, onRequestClose, onPanelMove, children, }: ToolPanelProps): import("react").ReactPortal | null;
 export default ToolPanel;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ishibashi0112/spreadsheet-grid",
-  "version": "0.33.0",
+  "version": "0.35.0",
   "description": "React 19 製のカスタム仮想化データグリッド。100 万行対応の仮想化・3 ペイン固定列・ソート/フィルター・クライアント/サーバーサイド行モデル対応。",
   "keywords": [
     "react",
@@ -59,23 +59,23 @@
     "react-dom": "^19.0.0"
   },
   "dependencies": {
-    "@tanstack/react-virtual": "^3.14.2"
+    "@tanstack/virtual-core": "^3.17.0"
   },
   "devDependencies": {
     "@eslint/js": "^10.0.1",
     "@testing-library/dom": "^10.4.1",
     "@testing-library/react": "^16.3.2",
     "@types/node": "^24.12.3",
-    "@types/react": "^19.2.14",
-    "@types/react-dom": "^19.2.3",
+    "@types/react": "^19.3.0",
+    "@types/react-dom": "^19.3.0",
     "@vitejs/plugin-react": "^6.0.1",
     "eslint": "^10.3.0",
     "eslint-plugin-react-hooks": "^7.1.1",
     "eslint-plugin-react-refresh": "^0.5.2",
     "globals": "^17.6.0",
     "jsdom": "^29.1.1",
-    "react": "^19.2.6",
-    "react-dom": "^19.2.6",
+    "react": "^19.3.0",
+    "react-dom": "^19.3.0",
     "typescript": "~6.0.2",
     "typescript-eslint": "^8.59.2",
     "vite": "^8.0.12",