import { ObjectForExtending } from '../types/utils.type'; import { CtxsType } from '../types/ctxs.type'; import { HeaderAlignment } from '../types/columns-grouping.type'; import { TableContentStateOverlay } from '../feature-content-state/types'; import { FillMeta, RowsChangeType } from '../feature-cell-transfer/types'; import { ReactNode } from 'react'; import { CanvasContent, CanvasEl, CanvasEvent, CanvasNodeTooltipConfig, CellActiveState, CellContent, CellHoverState, CellInfo, CellsSelectionMode, CellThemeOverrideResult, DataEditorRef, HeaderCellInfo as HeaderCellInfoGlide, HighlightActiveType, HoverEffectsConfig, Justify, SpanCellAlign, SummaryCellInfo, TableGlideCustomProps, TableGlideProps, Theme } from '../../TableGlide'; import { DropdownProps } from '../../Dropdown'; import { CellActivatedEventArgs } from '@glideappsfinal/glide-data-grid'; export type { TextCellEntry as TextCellEntryType } from '@glideappsfinal/glide-data-grid'; export type { ActiveTheme, CanvasBadgeProps, CanvasButtonProps, CanvasContainerProps, CanvasEmbedIconButtonProps, CanvasIconButtonProps, CanvasIconProps, CanvasTextProps, ProvideEditorCallback, ProvideEditorCallbackResult, ProvideEditorComponent, SIZE as SIZE_GLIDE_INSTANCE, TableGlideSizeConfig, } from '../../TableGlide'; export type { CanvasContent, CanvasEl, CanvasEvent, CellActiveState, CellContent, CellHoverState, CellsSelectionMode, CellThemeOverrideResult, DataEditorRef, HighlightActiveType, HoverEffectsConfig, Justify, TableGlideCustomProps, }; export interface RowsChangeDataGlideInstance { indexes: number[]; column: ColumnGlideInstance; type: RowsChangeType; fillMeta?: FillMeta; fillResult?: string[][]; } export type HeaderCellInfoGlideInstance = Omit, 'column' | 'ctxs'> & { column: ColumnGlideInstance; ctxs: CtxsType; }; export type CellInfoGlideInstance = Omit, 'column' | 'ctxs'> & { column: ColumnGlideInstance; ctxs: CtxsType; }; export type EditingCellInfoGlideInstance = Omit, 'hovered' | 'active'> & { onRowChange: (newV: R, closeEditor?: boolean) => void; initialValue: string | undefined; portalElementRef: React.RefObject | undefined; activation: CellActivatedEventArgs | undefined; cellWidth: number; cellHeight: number; readOnly: boolean | undefined; }; export type PreviewCellInfoGlideInstance = Omit, 'onRowChange'>; export type SummaryCellInfoGlideInstance = Omit, 'column' | 'ctxs'> & { column: ColumnGlideInstance; ctxs: CtxsType; }; export type ColumnGlideInstance = { key: string; name: string | CanvasEl; nameAsString?: string; readonly width?: number; isServiceColumn?: boolean; isErrorCell?: (row: R) => boolean; frozen?: boolean; minWidth?: number; maxWidth?: number; maxAutoWidth?: number; renderHeaderCell?: (cellInfo: HeaderCellInfoGlideInstance) => CanvasContent; renderCell?: (cellInfo: CellInfoGlideInstance) => CellContent; contentAlign?: 'left' | 'right' | 'center'; copyData?: string | ((row: R) => string); editable?: boolean | ((row: R) => boolean); renderEditCell?: (cellInfo: EditingCellInfoGlideInstance) => ReactNode; renderCellPreview?: 'none' | 'cellEditorAsPreview' | ((cellInfo: PreviewCellInfoGlideInstance) => ReactNode); renderSummaryCell?: (cellInfo: SummaryCellInfoGlideInstance) => CellContent; colSpan?: number | ((cellInfo: CellInfoGlideInstance) => number); rowSpan?: (cellInfo: CellInfoGlideInstance) => readonly [number, number] | null; spanAlign?: SpanCellAlign | ((cellInfo: CellInfoGlideInstance) => SpanCellAlign | undefined); squashedHeaderAlign?: HeaderAlignment; cellTooltip?: CanvasNodeTooltipConfig | ((context: { row: R; column: ColumnGlideInstance; ctxs: CtxsType; refTable?: React.Ref; colInd?: number; rowInd?: number; theme?: Theme; }) => CanvasNodeTooltipConfig | null); headerCellTooltip?: CanvasNodeTooltipConfig | ((context: { column: ColumnGlideInstance; ctxs: CtxsType; refTable?: React.Ref; colInd?: number; theme?: Theme; }) => CanvasNodeTooltipConfig | null); columnThemeOverride?: (cellInfo: CellInfoGlideInstance) => CellThemeOverrideResult | undefined; }; export type ColumnOrColumnGroupGlideInstance = ColumnGlideInstance | ColumnGroupGlideInstance; export type ColumnGroupGlideInstance = { readonly key: string; readonly name: CanvasEl; readonly children: readonly ColumnOrColumnGroupGlideInstance[]; }; export type TableInfoBase = { column: ColumnOrColumnGroupGlideInstance; ctxs: CustomCtxs; refTable?: React.Ref; }; export type TableInfoWithRow = TableInfoBase & { row: R; }; export type TableGlideInstanceContextMenu = { onHeaderContextMenu?: (...args: [ ...Parameters['onHeaderContextMenu']>>, TableInfoBase ]) => void; onCellContextMenu?: (...args: [ ...Parameters['onCellContextMenu']>>, TableInfoWithRow ]) => void; }; export type CellReadOnlyEditorGlideInstanceStaticProps = { formatOptions: ContentFormat | undefined; disableLeftOffset: boolean | undefined; contentAlign: 'right' | 'left' | 'center'; }; export type CellReadOnlyEditorGlideInstanceProps = EditingCellInfoGlideInstance & CellReadOnlyEditorGlideInstanceStaticProps; export type TableGlideInstanceProps = Omit, 'columns' | 'onHeaderContextMenu' | 'onCellContextMenu'> & { columns: readonly ColumnGlideInstance[]; onHeaderContextMenuDropdown?: HeaderContextMenuDropdownProps; onCellContextMenuDropdown?: CellContextMenuDropdownProps; containerProps?: { className?: string; style?: React.CSSProperties; ref?: React.Ref; }; contentStateOverlay?: TableContentStateOverlay; renderOverlayFeatures?: (ctx: { containerElement: HTMLDivElement; renderInContainer: (children: React.ReactNode) => React.ReactPortal | null; }) => React.ReactNode; CellReadOnlyEditor: (props: CellReadOnlyEditorGlideInstanceProps) => ReactNode; onRowsChange?: (rows: R[], data: RowsChangeDataGlideInstance) => void; onCellClicked?: (cell: readonly [number, number], info: TableInfoWithRow) => void; } & TableGlideInstanceContextMenu; export type CommonFormat = { alignContent?: 'right' | 'left' | 'center'; }; export type CustomFormat = CommonFormat & { customFormat: (value: string) => React.ReactNode; }; export type NumberFormatOptions = CommonFormat & { type: 'number'; decimalSeparator?: string; thousandSeparator?: string; minimumFractionDigits?: number; maximumFractionDigits?: number; useGrouping?: boolean; locales?: string | string[]; alignContent?: 'right' | 'left' | 'center'; }; export type ContentFormat = 'number' | CustomFormat | NumberFormatOptions; export type ContextMenuDropdownItem = NonNullable[number]; export type ContextMenuDropdownProps = Omit; export type DropdownContextMenu = { type: 'Dropdown'; getDropdownItems: (params: { columnLabel: string; }) => DropdownProps['items']; } & ContextMenuDropdownProps; export type CellContextMenuDropdownProps = ContextMenuDropdownProps & { type: 'dropdown'; getDropdownItems: (params: TableInfoWithRow) => DropdownProps['items']; onOpen?: (params: TableInfoWithRow) => void; onItemSelect?: (item: ContextMenuDropdownItem, context: TableInfoWithRow, event?: React.SyntheticEvent) => void; }; export type HeaderContextMenuDropdownProps = ContextMenuDropdownProps & { type: 'dropdown'; getDropdownItems: (params: TableInfoBase) => DropdownProps['items']; onOpen?: (params: TableInfoBase) => void; onItemSelect?: (item: ContextMenuDropdownItem, context: TableInfoBase, event?: React.SyntheticEvent) => void; };