@fluentui/react-table 9.18.4 → 9.18.6
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.
- package/CHANGELOG.md +41 -2
- package/dist/index.d.ts +18 -21
- package/lib/components/DataGridBody/renderDataGridBody.js.map +1 -1
- package/lib/components/DataGridCell/renderDataGridCell.js.map +1 -1
- package/lib/components/DataGridHeader/renderDataGridHeader.js.map +1 -1
- package/lib/components/DataGridHeaderCell/renderDataGridHeaderCell.js.map +1 -1
- package/lib/components/DataGridRow/renderDataGridRow.js.map +1 -1
- package/lib/components/DataGridRow/useDataGridRow.js +1 -6
- package/lib/components/DataGridRow/useDataGridRow.js.map +1 -1
- package/lib/components/DataGridRow/useDataGridRowStyles.styles.js +3 -10
- package/lib/components/DataGridRow/useDataGridRowStyles.styles.js.map +1 -1
- package/lib/components/DataGridRow/useDataGridRowStyles.styles.raw.js +1 -18
- package/lib/components/DataGridRow/useDataGridRowStyles.styles.raw.js.map +1 -1
- package/lib/components/DataGridSelectionCell/renderDataGridSelectionCell.js.map +1 -1
- package/lib/components/DataGridSelectionCell/useDataGridSelectionCell.js +1 -0
- package/lib/components/DataGridSelectionCell/useDataGridSelectionCell.js.map +1 -1
- package/lib/components/Table/renderTable.js.map +1 -1
- package/lib/components/TableBody/renderTableBody.js.map +1 -1
- package/lib/components/TableCell/renderTableCell.js.map +1 -1
- package/lib/components/TableCellActions/renderTableCellActions.js.map +1 -1
- package/lib/components/TableCellLayout/renderTableCellLayout.js.map +1 -1
- package/lib/components/TableHeader/renderTableHeader.js.map +1 -1
- package/lib/components/TableHeaderCell/renderTableHeaderCell.js.map +1 -1
- package/lib/components/TableResizeHandle/renderTableResizeHandle.js.map +1 -1
- package/lib/components/TableRow/renderTableRow.js.map +1 -1
- package/lib/components/TableSelectionCell/renderTableSelectionCell.js.map +1 -1
- package/lib/contexts/columnIdContext.js.map +1 -1
- package/lib/contexts/dataGridContext.js.map +1 -1
- package/lib/contexts/rowIdContext.js.map +1 -1
- package/lib/contexts/tableContext.js.map +1 -1
- package/lib/contexts/tableHeaderContext.js.map +1 -1
- package/lib/hooks/createColumn.js +1 -0
- package/lib/hooks/createColumn.js.map +1 -1
- package/lib/hooks/useKeyboardResizing.js +1 -1
- package/lib/hooks/useKeyboardResizing.js.map +1 -1
- package/lib/hooks/useMeasureElement.js.map +1 -1
- package/lib/hooks/useTableColumnResizeMouseHandler.js.map +1 -1
- package/lib/hooks/useTableColumnSizing.js.map +1 -1
- package/lib/hooks/useTableCompositeNavigation.js +8 -2
- package/lib/hooks/useTableCompositeNavigation.js.map +1 -1
- package/lib/hooks/useTableSelection.js.map +1 -1
- package/lib/hooks/useTableSort.js.map +1 -1
- package/lib/utils/columnResizeUtils.js +10 -1
- package/lib/utils/columnResizeUtils.js.map +1 -1
- package/lib/utils/isColumnSortable.js.map +1 -1
- package/lib-commonjs/components/DataGridBody/renderDataGridBody.js.map +1 -1
- package/lib-commonjs/components/DataGridCell/renderDataGridCell.js.map +1 -1
- package/lib-commonjs/components/DataGridHeader/renderDataGridHeader.js.map +1 -1
- package/lib-commonjs/components/DataGridHeaderCell/renderDataGridHeaderCell.js.map +1 -1
- package/lib-commonjs/components/DataGridRow/renderDataGridRow.js.map +1 -1
- package/lib-commonjs/components/DataGridRow/useDataGridRow.js +1 -6
- package/lib-commonjs/components/DataGridRow/useDataGridRow.js.map +1 -1
- package/lib-commonjs/components/DataGridRow/useDataGridRowStyles.styles.js +1 -10
- package/lib-commonjs/components/DataGridRow/useDataGridRowStyles.styles.js.map +1 -1
- package/lib-commonjs/components/DataGridRow/useDataGridRowStyles.styles.raw.js +1 -18
- package/lib-commonjs/components/DataGridRow/useDataGridRowStyles.styles.raw.js.map +1 -1
- package/lib-commonjs/components/DataGridSelectionCell/renderDataGridSelectionCell.js.map +1 -1
- package/lib-commonjs/components/DataGridSelectionCell/useDataGridSelectionCell.js +1 -0
- package/lib-commonjs/components/DataGridSelectionCell/useDataGridSelectionCell.js.map +1 -1
- package/lib-commonjs/components/Table/renderTable.js.map +1 -1
- package/lib-commonjs/components/TableBody/renderTableBody.js.map +1 -1
- package/lib-commonjs/components/TableCell/renderTableCell.js.map +1 -1
- package/lib-commonjs/components/TableCellActions/renderTableCellActions.js.map +1 -1
- package/lib-commonjs/components/TableCellLayout/renderTableCellLayout.js.map +1 -1
- package/lib-commonjs/components/TableHeader/renderTableHeader.js.map +1 -1
- package/lib-commonjs/components/TableHeaderCell/renderTableHeaderCell.js.map +1 -1
- package/lib-commonjs/components/TableResizeHandle/renderTableResizeHandle.js.map +1 -1
- package/lib-commonjs/components/TableRow/renderTableRow.js.map +1 -1
- package/lib-commonjs/components/TableSelectionCell/renderTableSelectionCell.js.map +1 -1
- package/lib-commonjs/contexts/columnIdContext.js.map +1 -1
- package/lib-commonjs/contexts/dataGridContext.js.map +1 -1
- package/lib-commonjs/contexts/rowIdContext.js.map +1 -1
- package/lib-commonjs/contexts/tableContext.js.map +1 -1
- package/lib-commonjs/contexts/tableHeaderContext.js.map +1 -1
- package/lib-commonjs/hooks/createColumn.js +2 -0
- package/lib-commonjs/hooks/createColumn.js.map +1 -1
- package/lib-commonjs/hooks/useKeyboardResizing.js +1 -1
- package/lib-commonjs/hooks/useKeyboardResizing.js.map +1 -1
- package/lib-commonjs/hooks/useMeasureElement.js.map +1 -1
- package/lib-commonjs/hooks/useTableColumnResizeMouseHandler.js.map +1 -1
- package/lib-commonjs/hooks/useTableColumnSizing.js.map +1 -1
- package/lib-commonjs/hooks/useTableCompositeNavigation.js +7 -1
- package/lib-commonjs/hooks/useTableCompositeNavigation.js.map +1 -1
- package/lib-commonjs/hooks/useTableSelection.js.map +1 -1
- package/lib-commonjs/hooks/useTableSort.js.map +1 -1
- package/lib-commonjs/utils/columnResizeUtils.js +10 -1
- package/lib-commonjs/utils/columnResizeUtils.js.map +1 -1
- package/lib-commonjs/utils/isColumnSortable.js.map +1 -1
- package/package.json +14 -14
|
@@ -133,13 +133,18 @@ function adjustColumnWidthsToFitContainer(state, containerWidth) {
|
|
|
133
133
|
// We start at the beginning and assign the columns their ideal width
|
|
134
134
|
while(i < newState.length && difference > 0){
|
|
135
135
|
const currentCol = getColumnByIndex(newState, i);
|
|
136
|
+
if (!currentCol) {
|
|
137
|
+
break;
|
|
138
|
+
}
|
|
136
139
|
const colAdjustment = Math.min(currentCol.idealWidth - currentCol.width, difference);
|
|
137
140
|
newState = setColumnProperty(newState, currentCol.columnId, 'width', currentCol.width + colAdjustment);
|
|
138
141
|
difference -= colAdjustment;
|
|
139
142
|
// if there is still empty space, after all columns are their ideal sizes, assign it to the last column
|
|
140
143
|
if (i === newState.length - 1 && difference !== 0) {
|
|
141
144
|
const lastCol = getColumnByIndex(newState, i);
|
|
142
|
-
|
|
145
|
+
if (lastCol) {
|
|
146
|
+
newState = setColumnProperty(newState, lastCol.columnId, 'width', lastCol.width + difference);
|
|
147
|
+
}
|
|
143
148
|
}
|
|
144
149
|
i++;
|
|
145
150
|
}
|
|
@@ -149,6 +154,10 @@ function adjustColumnWidthsToFitContainer(state, containerWidth) {
|
|
|
149
154
|
let j = newState.length - 1;
|
|
150
155
|
while(j >= 0 && difference > 0){
|
|
151
156
|
const currentCol = getColumnByIndex(newState, j);
|
|
157
|
+
if (!currentCol) {
|
|
158
|
+
j--;
|
|
159
|
+
continue;
|
|
160
|
+
}
|
|
152
161
|
if (currentCol.width > currentCol.minWidth) {
|
|
153
162
|
const colAdjustment = Math.min(currentCol.width - currentCol.minWidth, difference);
|
|
154
163
|
difference -= colAdjustment;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/utils/columnResizeUtils.ts"],"sourcesContent":["import { TableColumnDefinition, ColumnWidthState, TableColumnId, TableColumnSizingOptions } from '../hooks';\n\nconst DEFAULT_WIDTH = 150;\nconst DEFAULT_MIN_WIDTH = 100;\n\n/**\n * This function takes the column definitions and the curent ColumnWidthState and returns new state.\n * - It uses existing state for existing columns.\n * - It removes any state for columns no longer present.\n * - It checks if any column has been replaced and returns updated state if so\n * - It returns old state if no changes in the state have been made (so that react doesn't call effects)\n * @param columns\n * @param state\n * @returns\n */\n\nexport function columnDefinitionsToState<T>(\n columns: TableColumnDefinition<T>[],\n state: ColumnWidthState[] = [],\n columnSizingOptions: TableColumnSizingOptions = {},\n): ColumnWidthState[] {\n let updated = false;\n const stateMap = new Map(state.map(s => [s.columnId, s]));\n\n const updatedState = columns.map(column => {\n const existingColumnState = stateMap.get(column.columnId);\n\n if (existingColumnState) {\n const {\n idealWidth = existingColumnState.idealWidth,\n minWidth = existingColumnState.minWidth,\n padding = existingColumnState.padding,\n } = columnSizingOptions[column.columnId] ?? {};\n\n if (\n idealWidth !== existingColumnState.idealWidth ||\n minWidth !== existingColumnState.minWidth ||\n padding !== existingColumnState.padding\n ) {\n updated = true;\n return {\n ...existingColumnState,\n idealWidth,\n width: idealWidth,\n minWidth,\n padding,\n };\n }\n return existingColumnState;\n }\n\n const {\n defaultWidth,\n idealWidth = DEFAULT_WIDTH,\n minWidth = DEFAULT_MIN_WIDTH,\n padding,\n } = columnSizingOptions[column.columnId] ?? {};\n\n updated = true;\n return {\n columnId: column.columnId,\n width: Math.max(defaultWidth ?? idealWidth, minWidth),\n minWidth,\n idealWidth: Math.max(defaultWidth ?? idealWidth, minWidth),\n padding: padding ?? 16,\n };\n });\n\n // If the length of the new state changed (column was added or removed) or any of\n // the individual states has a new reference (column was replaced),\n // we have to reset the column widths to their ideal width (because the column which was last may not be last now).\n // Then the adjustColumnWidthsToFitContainer can do its job and properly stretch the last column.\n if (updatedState.length !== state.length || updated) {\n const column = updatedState.find(col => col.width > col.idealWidth);\n if (column) {\n column.width = column.idealWidth;\n }\n\n updated = true;\n }\n\n return updated ? updatedState : state;\n}\n\nexport function getColumnById(state: ColumnWidthState[], columnId: TableColumnId) {\n return state.find(c => c.columnId === columnId);\n}\n\nexport function getColumnByIndex(state: ColumnWidthState[], index: number) {\n return state[index];\n}\n\nexport function getTotalWidth(state: ColumnWidthState[]): number {\n return state.reduce((sum, column) => sum + column.width + column.padding, 0);\n}\n\nexport function getLength(state: ColumnWidthState[]) {\n return state.length;\n}\n\nexport function getColumnWidth(state: ColumnWidthState[], columnId: TableColumnId): number {\n const column = getColumnById(state, columnId);\n return column?.width ?? 0;\n}\n\n/**\n * This function takes the current state and returns an updated state, so that it can be set.\n * The reason for this is that we can update the state multiple times before commiting to render.\n * This is an optimization and also prevents flickering.\n * It also returns new copy of the state only if the value is different than the one currently in\n * the state, further preventing unnecessary updates.\n * @param localState\n * @param columnId\n * @param property\n * @param value\n * @returns\n */\nexport function setColumnProperty(\n localState: ColumnWidthState[],\n columnId: TableColumnId,\n property: keyof ColumnWidthState,\n value: number,\n) {\n const currentColumn = getColumnById(localState, columnId);\n\n if (!currentColumn || currentColumn?.[property] === value) {\n return localState;\n }\n\n const updatedColumn = { ...currentColumn, [property]: value };\n\n const newState = localState.reduce((acc, current) => {\n if (current.columnId === updatedColumn.columnId) {\n return [...acc, updatedColumn];\n }\n return [...acc, current];\n }, [] as ColumnWidthState[]);\n\n return newState;\n}\n\n/**\n * This function takes the state and container width and makes sure the each column in the state\n * is its optimal width, and that the columns\n * a) fit to the container\n * b) always fill the whole container\n * @param state\n * @param containerWidth\n * @returns\n */\nexport function adjustColumnWidthsToFitContainer(state: ColumnWidthState[], containerWidth: number) {\n let newState = state;\n const totalWidth = getTotalWidth(newState);\n\n // The total width is smaller, we are expanding columns\n if (totalWidth < containerWidth) {\n let difference = containerWidth - totalWidth;\n let i = 0;\n // We start at the beginning and assign the columns their ideal width\n while (i < newState.length && difference > 0) {\n const currentCol = getColumnByIndex(newState, i);\n const colAdjustment = Math.min(currentCol.idealWidth - currentCol.width, difference);\n newState = setColumnProperty(newState, currentCol.columnId, 'width', currentCol.width + colAdjustment);\n difference -= colAdjustment;\n\n // if there is still empty space, after all columns are their ideal sizes, assign it to the last column\n if (i === newState.length - 1 && difference !== 0) {\n const lastCol = getColumnByIndex(newState, i);\n newState = setColumnProperty(newState, lastCol.columnId, 'width', lastCol.width + difference);\n }\n\n i++;\n }\n }\n\n // The total width is larger than container, we need to squash the columns\n else if (totalWidth >= containerWidth) {\n let difference = totalWidth - containerWidth;\n // We start with the last column\n let j = newState.length - 1;\n while (j >= 0 && difference > 0) {\n const currentCol = getColumnByIndex(newState, j);\n if (currentCol.width > currentCol.minWidth) {\n const colAdjustment = Math.min(currentCol.width - currentCol.minWidth, difference);\n difference -= colAdjustment;\n newState = setColumnProperty(newState, currentCol.columnId, 'width', currentCol.width - colAdjustment);\n }\n j--;\n }\n }\n\n return newState;\n}\n"],"names":["DEFAULT_WIDTH","DEFAULT_MIN_WIDTH","columnDefinitionsToState","columns","state","columnSizingOptions","updated","stateMap","Map","map","s","columnId","updatedState","column","existingColumnState","get","idealWidth","minWidth","padding","width","defaultWidth","Math","max","length","find","col","getColumnById","c","getColumnByIndex","index","getTotalWidth","reduce","sum","getLength","getColumnWidth","setColumnProperty","localState","property","value","currentColumn","updatedColumn","newState","acc","current","adjustColumnWidthsToFitContainer","containerWidth","totalWidth","difference","i","currentCol","colAdjustment","min","lastCol","j"],"mappings":"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"}
|
|
1
|
+
{"version":3,"sources":["../src/utils/columnResizeUtils.ts"],"sourcesContent":["import { TableColumnDefinition, ColumnWidthState, TableColumnId, TableColumnSizingOptions } from '../hooks';\n\nconst DEFAULT_WIDTH = 150;\nconst DEFAULT_MIN_WIDTH = 100;\n\n/**\n * This function takes the column definitions and the curent ColumnWidthState and returns new state.\n * - It uses existing state for existing columns.\n * - It removes any state for columns no longer present.\n * - It checks if any column has been replaced and returns updated state if so\n * - It returns old state if no changes in the state have been made (so that react doesn't call effects)\n * @param columns\n * @param state\n * @returns\n */\n\nexport function columnDefinitionsToState<T>(\n columns: TableColumnDefinition<T>[],\n state: ColumnWidthState[] = [],\n columnSizingOptions: TableColumnSizingOptions = {},\n): ColumnWidthState[] {\n let updated = false;\n const stateMap = new Map(state.map(s => [s.columnId, s]));\n\n const updatedState = columns.map(column => {\n const existingColumnState = stateMap.get(column.columnId);\n\n if (existingColumnState) {\n const {\n idealWidth = existingColumnState.idealWidth,\n minWidth = existingColumnState.minWidth,\n padding = existingColumnState.padding,\n } = columnSizingOptions[column.columnId] ?? {};\n\n if (\n idealWidth !== existingColumnState.idealWidth ||\n minWidth !== existingColumnState.minWidth ||\n padding !== existingColumnState.padding\n ) {\n updated = true;\n return {\n ...existingColumnState,\n idealWidth,\n width: idealWidth,\n minWidth,\n padding,\n };\n }\n return existingColumnState;\n }\n\n const {\n defaultWidth,\n idealWidth = DEFAULT_WIDTH,\n minWidth = DEFAULT_MIN_WIDTH,\n padding,\n } = columnSizingOptions[column.columnId] ?? {};\n\n updated = true;\n return {\n columnId: column.columnId,\n width: Math.max(defaultWidth ?? idealWidth, minWidth),\n minWidth,\n idealWidth: Math.max(defaultWidth ?? idealWidth, minWidth),\n padding: padding ?? 16,\n };\n });\n\n // If the length of the new state changed (column was added or removed) or any of\n // the individual states has a new reference (column was replaced),\n // we have to reset the column widths to their ideal width (because the column which was last may not be last now).\n // Then the adjustColumnWidthsToFitContainer can do its job and properly stretch the last column.\n if (updatedState.length !== state.length || updated) {\n const column = updatedState.find(col => col.width > col.idealWidth);\n if (column) {\n column.width = column.idealWidth;\n }\n\n updated = true;\n }\n\n return updated ? updatedState : state;\n}\n\nexport function getColumnById(state: ColumnWidthState[], columnId: TableColumnId): ColumnWidthState | undefined {\n return state.find(c => c.columnId === columnId);\n}\n\nexport function getColumnByIndex(state: ColumnWidthState[], index: number): ColumnWidthState | undefined {\n return state[index];\n}\n\nexport function getTotalWidth(state: ColumnWidthState[]): number {\n return state.reduce((sum, column) => sum + column.width + column.padding, 0);\n}\n\nexport function getLength(state: ColumnWidthState[]): number {\n return state.length;\n}\n\nexport function getColumnWidth(state: ColumnWidthState[], columnId: TableColumnId): number {\n const column = getColumnById(state, columnId);\n return column?.width ?? 0;\n}\n\n/**\n * This function takes the current state and returns an updated state, so that it can be set.\n * The reason for this is that we can update the state multiple times before commiting to render.\n * This is an optimization and also prevents flickering.\n * It also returns new copy of the state only if the value is different than the one currently in\n * the state, further preventing unnecessary updates.\n * @param localState\n * @param columnId\n * @param property\n * @param value\n * @returns\n */\nexport function setColumnProperty(\n localState: ColumnWidthState[],\n columnId: TableColumnId,\n property: keyof ColumnWidthState,\n value: number,\n): ColumnWidthState[] {\n const currentColumn = getColumnById(localState, columnId);\n\n if (!currentColumn || currentColumn?.[property] === value) {\n return localState;\n }\n\n const updatedColumn = { ...currentColumn, [property]: value };\n\n const newState = localState.reduce((acc, current) => {\n if (current.columnId === updatedColumn.columnId) {\n return [...acc, updatedColumn];\n }\n return [...acc, current];\n }, [] as ColumnWidthState[]);\n\n return newState;\n}\n\n/**\n * This function takes the state and container width and makes sure the each column in the state\n * is its optimal width, and that the columns\n * a) fit to the container\n * b) always fill the whole container\n * @param state\n * @param containerWidth\n * @returns\n */\nexport function adjustColumnWidthsToFitContainer(\n state: ColumnWidthState[],\n containerWidth: number,\n): ColumnWidthState[] {\n let newState = state;\n const totalWidth = getTotalWidth(newState);\n\n // The total width is smaller, we are expanding columns\n if (totalWidth < containerWidth) {\n let difference = containerWidth - totalWidth;\n let i = 0;\n // We start at the beginning and assign the columns their ideal width\n while (i < newState.length && difference > 0) {\n const currentCol = getColumnByIndex(newState, i);\n if (!currentCol) {\n break;\n }\n const colAdjustment = Math.min(currentCol.idealWidth - currentCol.width, difference);\n newState = setColumnProperty(newState, currentCol.columnId, 'width', currentCol.width + colAdjustment);\n difference -= colAdjustment;\n\n // if there is still empty space, after all columns are their ideal sizes, assign it to the last column\n if (i === newState.length - 1 && difference !== 0) {\n const lastCol = getColumnByIndex(newState, i);\n if (lastCol) {\n newState = setColumnProperty(newState, lastCol.columnId, 'width', lastCol.width + difference);\n }\n }\n\n i++;\n }\n }\n\n // The total width is larger than container, we need to squash the columns\n else if (totalWidth >= containerWidth) {\n let difference = totalWidth - containerWidth;\n // We start with the last column\n let j = newState.length - 1;\n while (j >= 0 && difference > 0) {\n const currentCol = getColumnByIndex(newState, j);\n if (!currentCol) {\n j--;\n continue;\n }\n if (currentCol.width > currentCol.minWidth) {\n const colAdjustment = Math.min(currentCol.width - currentCol.minWidth, difference);\n difference -= colAdjustment;\n newState = setColumnProperty(newState, currentCol.columnId, 'width', currentCol.width - colAdjustment);\n }\n j--;\n }\n }\n\n return newState;\n}\n"],"names":["DEFAULT_WIDTH","DEFAULT_MIN_WIDTH","columnDefinitionsToState","columns","state","columnSizingOptions","updated","stateMap","Map","map","s","columnId","updatedState","column","existingColumnState","get","idealWidth","minWidth","padding","width","defaultWidth","Math","max","length","find","col","getColumnById","c","getColumnByIndex","index","getTotalWidth","reduce","sum","getLength","getColumnWidth","setColumnProperty","localState","property","value","currentColumn","updatedColumn","newState","acc","current","adjustColumnWidthsToFitContainer","containerWidth","totalWidth","difference","i","currentCol","colAdjustment","min","lastCol","j"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/utils/isColumnSortable.ts"],"sourcesContent":["import { TableColumnDefinition } from '../hooks/types';\n\nexport function isColumnSortable(column: TableColumnDefinition<unknown>) {\n return column.compare.length > 0;\n}\n"],"names":["isColumnSortable","column","compare","length"],"mappings":";;;;;;;;;;AAEO,SAASA,iBAAiBC,MAAsC;IACrE,OAAOA,OAAOC,OAAO,CAACC,MAAM,GAAG;AACjC"}
|
|
1
|
+
{"version":3,"sources":["../src/utils/isColumnSortable.ts"],"sourcesContent":["import { TableColumnDefinition } from '../hooks/types';\n\nexport function isColumnSortable(column: TableColumnDefinition<unknown>): boolean {\n return column.compare.length > 0;\n}\n"],"names":["isColumnSortable","column","compare","length"],"mappings":";;;;;;;;;;AAEO,SAASA,iBAAiBC,MAAsC;IACrE,OAAOA,OAAOC,OAAO,CAACC,MAAM,GAAG;AACjC"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@fluentui/react-table",
|
|
3
|
-
"version": "9.18.
|
|
3
|
+
"version": "9.18.6",
|
|
4
4
|
"description": "React components for building web experiences",
|
|
5
5
|
"main": "lib-commonjs/index.js",
|
|
6
6
|
"module": "lib/index.js",
|
|
@@ -21,25 +21,25 @@
|
|
|
21
21
|
},
|
|
22
22
|
"dependencies": {
|
|
23
23
|
"@fluentui/keyboard-keys": "^9.0.8",
|
|
24
|
-
"@fluentui/react-aria": "^9.
|
|
25
|
-
"@fluentui/react-avatar": "^9.9.
|
|
26
|
-
"@fluentui/react-checkbox": "^9.5.
|
|
27
|
-
"@fluentui/react-context-selector": "^9.2.
|
|
24
|
+
"@fluentui/react-aria": "^9.17.0",
|
|
25
|
+
"@fluentui/react-avatar": "^9.9.6",
|
|
26
|
+
"@fluentui/react-checkbox": "^9.5.5",
|
|
27
|
+
"@fluentui/react-context-selector": "^9.2.7",
|
|
28
28
|
"@fluentui/react-icons": "^2.0.245",
|
|
29
|
-
"@fluentui/react-radio": "^9.5.
|
|
30
|
-
"@fluentui/react-shared-contexts": "^9.
|
|
31
|
-
"@fluentui/react-tabster": "^9.26.
|
|
29
|
+
"@fluentui/react-radio": "^9.5.5",
|
|
30
|
+
"@fluentui/react-shared-contexts": "^9.25.1",
|
|
31
|
+
"@fluentui/react-tabster": "^9.26.5",
|
|
32
32
|
"@fluentui/react-theme": "^9.2.0",
|
|
33
|
-
"@fluentui/react-utilities": "^9.
|
|
34
|
-
"@fluentui/react-jsx-runtime": "^9.
|
|
33
|
+
"@fluentui/react-utilities": "^9.24.1",
|
|
34
|
+
"@fluentui/react-jsx-runtime": "^9.2.0",
|
|
35
35
|
"@griffel/react": "^1.5.22",
|
|
36
36
|
"@swc/helpers": "^0.5.1"
|
|
37
37
|
},
|
|
38
38
|
"peerDependencies": {
|
|
39
|
-
"@types/react": ">=16.14.0 <
|
|
40
|
-
"@types/react-dom": ">=16.9.0 <
|
|
41
|
-
"react": ">=16.14.0 <
|
|
42
|
-
"react-dom": ">=16.14.0 <
|
|
39
|
+
"@types/react": ">=16.14.0 <20.0.0",
|
|
40
|
+
"@types/react-dom": ">=16.9.0 <20.0.0",
|
|
41
|
+
"react": ">=16.14.0 <20.0.0",
|
|
42
|
+
"react-dom": ">=16.14.0 <20.0.0"
|
|
43
43
|
},
|
|
44
44
|
"beachball": {
|
|
45
45
|
"disallowedChangeTypes": [
|