|
| 1 | +import * as React from "react"; |
| 2 | + |
| 3 | +/** Provides APIs to customize Power Apps OneGrid */ |
| 4 | +export interface PAOneGridCustomizer { |
| 5 | + /** |
| 6 | + * Provides customizations for the grid. |
| 7 | + * This will include prop overrides, cell renderers and editors, |
| 8 | + * @notice If you just need to override few cell renderers or editors, |
| 9 | + * its better to use cellRendererOverrides, cellEditorOverrides props |
| 10 | + */ |
| 11 | + gridCustomizer?: GridCustomizer; |
| 12 | + /** Provides overrides for built -in cell renderers */ |
| 13 | + cellRendererOverrides?: CellRendererOverrides; |
| 14 | + /** Provides overrides for built -in cell editors */ |
| 15 | + cellEditorOverrides?: CellEditorOverrides; |
| 16 | +} |
| 17 | + |
| 18 | +export interface CellRendererOverrides { |
| 19 | + [dataType: string]: (props: CellRendererProps, rendererParams: GetRendererParams) |
| 20 | + => React.ReactElement | null | undefined; |
| 21 | +} |
| 22 | + |
| 23 | +export interface CellEditorOverrides { |
| 24 | + [dataType: string]: (defaultProps: CellEditorProps, rendererParams: GetEditorParams) |
| 25 | + => React.ReactElement | null | undefined; |
| 26 | +} |
| 27 | + |
| 28 | +export interface GridCustomizer { |
| 29 | + /** Returns react element for the column headers */ |
| 30 | + GetHeaderRenderer?(params: GetHeaderParams): React.ReactElement; |
| 31 | + /** Returns the cell renderer react element */ |
| 32 | + GetCellRenderer?(params: GetRendererParams): React.ReactElement; |
| 33 | + /** Return renderer for a row in a loading state */ |
| 34 | + GetLoadingRowRenderer?(): React.ReactElement; |
| 35 | + /** Returns the cell editor react element */ |
| 36 | + GetCellEditor?(params: GetEditorParams): React.ReactElement; |
| 37 | + /** Returns the component and properties to use for empty grid overlay */ |
| 38 | + GetNoRowsOverlayConfiguration?(): NoRowsOverlayConfig; |
| 39 | +} |
| 40 | + |
| 41 | +export interface CellRendererProps { |
| 42 | + value: unknown; |
| 43 | + isRTLMode?: boolean; |
| 44 | + onCellClicked?: (event?: React.MouseEvent<HTMLElement, MouseEvent> | MouseEvent) => void; |
| 45 | + validationError?: Error | null; |
| 46 | + isRightAligned?: boolean; |
| 47 | + startEditing?: (editorInitValue?: unknown) => void; |
| 48 | + isLastRow?: boolean; |
| 49 | + rowHeight?: number; |
| 50 | + columnDataType?: ColumnDataType; |
| 51 | + formattedValue?: string; |
| 52 | + cellContainerElement?: HTMLElement; |
| 53 | + cellErrorLabelId?: string; |
| 54 | + columnEditable?: boolean; |
| 55 | +} |
| 56 | + |
| 57 | +export interface GetRendererParams { |
| 58 | + colDefs: ColumnDefinition[]; |
| 59 | + columnIndex: number; |
| 60 | + rowData?: RowData; |
| 61 | + /** Renderer can call this function to switch the cell to edit mode */ |
| 62 | + startEditing?: (editorInitValue?: unknown) => void; |
| 63 | + isMobileLayout?: boolean; |
| 64 | + isRTLMode?: boolean; |
| 65 | + cellElement?: HTMLElement; |
| 66 | + allowTabKeyNavigation?: boolean; |
| 67 | + setExpanded?: (isExpanded: boolean) => void; |
| 68 | + getExpanded?: () => boolean; |
| 69 | +} |
| 70 | + |
| 71 | +export interface CellEditorProps { |
| 72 | + secured?: boolean; |
| 73 | + value: unknown; |
| 74 | + isRTLMode?: boolean; |
| 75 | + rowHeight?: number; |
| 76 | + isRequired?: boolean; |
| 77 | + onFormat?: (newValue: unknown) => unknown; |
| 78 | + onValidate?: (newValue: unknown) => string; |
| 79 | + charPress?: string | null; |
| 80 | + columnDataType?: ColumnDataType; |
| 81 | + onChange(newValue: unknown): void; |
| 82 | +} |
| 83 | + |
| 84 | +export interface GetEditorParams { |
| 85 | + colDefs: ColumnDefinition[]; |
| 86 | + columnIndex: number; |
| 87 | + onCellValueChanged: (newValue: unknown) => void; |
| 88 | + rowData?: RowData; |
| 89 | + isMobileLayout?: boolean; |
| 90 | + isRTLMode?: boolean; |
| 91 | + /** the character pressed when the editor was activated */ |
| 92 | + charPress?: string | null; |
| 93 | + stopEditing: (cancel?: boolean) => void; |
| 94 | +} |
| 95 | + |
| 96 | +export interface GetHeaderParams { |
| 97 | + colDefs: ColumnDefinition[]; |
| 98 | + columnIndex: number; |
| 99 | + isFirstVisualColumn?: boolean; |
| 100 | + isLastVisualColumn?: boolean; |
| 101 | + rowData?: RowData; |
| 102 | + isMobileLayout?: boolean; |
| 103 | + isRTLMode?: boolean; |
| 104 | + allowTabKeyNavigation?: boolean; |
| 105 | +} |
| 106 | + |
| 107 | +export interface NoRowsOverlayConfig { |
| 108 | + component: React.ComponentClass | undefined; |
| 109 | + props: unknown | undefined; |
| 110 | +} |
| 111 | + |
| 112 | +export const RECID = '__rec_id'; |
| 113 | +export interface RowData { |
| 114 | + /** Unique id for the row */ |
| 115 | + [RECID]: string; |
| 116 | +} |
| 117 | + |
| 118 | +export interface ColumnDefinition { |
| 119 | + /** Field name (should be unique) */ |
| 120 | + name: string; |
| 121 | + /** Column display name. Will be shown as column header.If none provided shimmer will be shown in place of header */ |
| 122 | + displayName?: string; |
| 123 | + /** The unique ID to give the column. This is optional. If missing, the ID will default to the name. |
| 124 | + * If defined, this ID will be used to identify the column in the API for sorting and filtering. */ |
| 125 | + colId?: string; |
| 126 | + /** Data type for the values in the column. */ |
| 127 | + dataType: string; |
| 128 | + /** Custom Renderer type to be used for this column when custom renderer override is provided. */ |
| 129 | + CustomRendererType?: string; |
| 130 | + /** Width of the column. Auto calculated if not set. */ |
| 131 | + width?: number; |
| 132 | + /** Min width, in pixels, of the cell */ |
| 133 | + minWidth?: number; |
| 134 | + /** Max width, in pixels, of the cell */ |
| 135 | + maxWidth?: number; |
| 136 | + /** True if column is initially hidden |
| 137 | + * @Notice To show/hide columns after the first render use PAGridAPI.setColumnVisible() |
| 138 | + */ |
| 139 | + hide?: boolean; |
| 140 | + /** Column is primary field */ |
| 141 | + isPrimary: boolean; |
| 142 | +} |
| 143 | + |
| 144 | +export type ColumnDataType = |
| 145 | + | 'Text' |
| 146 | + | 'Email' |
| 147 | + | 'Phone' |
| 148 | + | 'Ticker' |
| 149 | + | 'URL' |
| 150 | + | 'TextArea' |
| 151 | + | 'Lookup' |
| 152 | + | 'Customer' |
| 153 | + | 'Owner' |
| 154 | + | 'MultiSelectPicklist' |
| 155 | + | 'OptionSet' |
| 156 | + | 'TwoOptions' |
| 157 | + | 'Duration' |
| 158 | + | 'Language' |
| 159 | + | 'Multiple' |
| 160 | + | 'TimeZone' |
| 161 | + | 'Integer' |
| 162 | + | 'Currency' |
| 163 | + | 'Decimal' |
| 164 | + | 'FloatingPoint' |
| 165 | + | 'AutoNumber' |
| 166 | + | 'DateOnly' |
| 167 | + | 'DateAndTime' |
| 168 | + | 'Image' |
| 169 | + | 'File' |
| 170 | + | 'Persona'; |
0 commit comments