@talxis/base-controls 1.2410.6 → 1.2411.1
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/dist/components/DatasetControl/DatasetControl.js +5 -3
- package/dist/components/DatasetControl/DatasetControl.js.map +1 -1
- package/dist/components/Grid/Grid.js.map +1 -1
- package/dist/components/Grid/core/components/AgGrid/AgGrid.d.ts +2 -0
- package/dist/components/Grid/core/components/AgGrid/AgGrid.js +141 -27
- package/dist/components/Grid/core/components/AgGrid/AgGrid.js.map +1 -1
- package/dist/components/Grid/core/components/AgGrid/components/LoadingOverlay/LoadingOverlay.js +3 -4
- package/dist/components/Grid/core/components/AgGrid/components/LoadingOverlay/LoadingOverlay.js.map +1 -1
- package/dist/components/Grid/core/components/AgGrid/model/AgGrid.js +19 -7
- package/dist/components/Grid/core/components/AgGrid/model/AgGrid.js.map +1 -1
- package/dist/components/Grid/core/components/Cell/EditableCell/EditableCell.d.ts +3 -3
- package/dist/components/Grid/core/components/Cell/EditableCell/EditableCell.js +32 -96
- package/dist/components/Grid/core/components/Cell/EditableCell/EditableCell.js.map +1 -1
- package/dist/components/Grid/core/components/Cell/ReadOnlyCell/Notifications/Notifications.js +23 -22
- package/dist/components/Grid/core/components/Cell/ReadOnlyCell/Notifications/Notifications.js.map +1 -1
- package/dist/components/Grid/core/components/Cell/ReadOnlyCell/ReadOnlyCell.js +41 -36
- package/dist/components/Grid/core/components/Cell/ReadOnlyCell/ReadOnlyCell.js.map +1 -1
- package/dist/components/Grid/core/components/Cell/ReadOnlyCell/styles.d.ts +5 -0
- package/dist/components/Grid/core/components/Cell/ReadOnlyCell/styles.js +21 -3
- package/dist/components/Grid/core/components/Cell/ReadOnlyCell/styles.js.map +1 -1
- package/dist/components/Grid/core/components/Component/Component.d.ts +2 -2
- package/dist/components/Grid/core/components/Component/Component.js.map +1 -1
- package/dist/components/Grid/core/components/Component/model/Component.d.ts +1 -0
- package/dist/components/Grid/core/components/Component/model/Component.js +57 -20
- package/dist/components/Grid/core/components/Component/model/Component.js.map +1 -1
- package/dist/components/Grid/core/components/Save/Save.js +33 -20
- package/dist/components/Grid/core/components/Save/Save.js.map +1 -1
- package/dist/components/Grid/core/components/Save/components/ChangeEditor/ChangeEditor.d.ts +5 -1
- package/dist/components/Grid/core/components/Save/components/ChangeEditor/ChangeEditor.js +46 -15
- package/dist/components/Grid/core/components/Save/components/ChangeEditor/ChangeEditor.js.map +1 -1
- package/dist/components/Grid/core/components/Save/components/ChangeEditor/components/ChangeGrid/ChangeGrid.d.ts +10 -0
- package/dist/components/Grid/core/components/Save/components/ChangeEditor/components/ChangeGrid/ChangeGrid.js +187 -0
- package/dist/components/Grid/core/components/Save/components/ChangeEditor/components/ChangeGrid/ChangeGrid.js.map +1 -0
- package/dist/components/Grid/core/components/Save/components/ChangeEditor/components/ChangeGrid/styles.d.ts +39 -0
- package/dist/components/Grid/core/components/Save/components/ChangeEditor/components/ChangeGrid/styles.js +45 -0
- package/dist/components/Grid/core/components/Save/components/ChangeEditor/components/ChangeGrid/styles.js.map +1 -0
- package/dist/components/Grid/core/components/Save/styles.d.ts +2 -4
- package/dist/components/Grid/core/components/Save/styles.js +2 -4
- package/dist/components/Grid/core/components/Save/styles.js.map +1 -1
- package/dist/components/Grid/core/controllers/useGridController.js +2 -2
- package/dist/components/Grid/core/controllers/useGridController.js.map +1 -1
- package/dist/components/Grid/core/model/Grid.d.ts +1 -2
- package/dist/components/Grid/core/model/Grid.js +11 -9
- package/dist/components/Grid/core/model/Grid.js.map +1 -1
- package/dist/components/Grid/core/services/KeyListener.d.ts +2 -0
- package/dist/components/Grid/core/services/KeyListener.js +6 -0
- package/dist/components/Grid/core/services/KeyListener.js.map +1 -1
- package/dist/components/Grid/filtering/components/FilterCallout/components/ConditionOperator/ConditionOperator.js +0 -2
- package/dist/components/Grid/filtering/components/FilterCallout/components/ConditionOperator/ConditionOperator.js.map +1 -1
- package/dist/components/Grid/filtering/components/FilterCallout/components/ConditionValue/ConditionValue.js +45 -1
- package/dist/components/Grid/filtering/components/FilterCallout/components/ConditionValue/ConditionValue.js.map +1 -1
- package/dist/components/Grid/filtering/components/FilterCallout/components/ConditionValue/model/ConditionComponentValue.js +4 -1
- package/dist/components/Grid/filtering/components/FilterCallout/components/ConditionValue/model/ConditionComponentValue.js.map +1 -1
- package/dist/components/Grid/filtering/model/Condition.js +19 -4
- package/dist/components/Grid/filtering/model/Condition.js.map +1 -1
- package/dist/components/Grid/interfaces.d.ts +4 -1
- package/dist/components/Grid/paging/components/Paging/Paging.js +6 -5
- package/dist/components/Grid/paging/components/Paging/Paging.js.map +1 -1
- package/dist/components/Grid/translations.d.ts +36 -0
- package/dist/components/Grid/translations.js +11 -2
- package/dist/components/Grid/translations.js.map +1 -1
- package/dist/components/TextField/TextField.js +14 -5
- package/dist/components/TextField/TextField.js.map +1 -1
- package/dist/hooks/useControl.js +2 -2
- package/dist/hooks/useControl.js.map +1 -1
- package/dist/hooks/useRerender.js.map +1 -0
- package/dist/index.d.ts +39 -0
- package/package.json +4 -4
- package/dist/components/DatasetControl/hooks/useRerender.js.map +0 -1
- package/dist/components/Grid/core/components/AgGrid/components/LoadingOverlay/styles.d.ts +0 -44
- package/dist/components/Grid/core/components/AgGrid/components/LoadingOverlay/styles.js +0 -82
- package/dist/components/Grid/core/components/AgGrid/components/LoadingOverlay/styles.js.map +0 -1
- package/dist/components/Grid/core/components/AgGrid/controllers/useAgGridController.d.ts +0 -20
- package/dist/components/Grid/core/components/AgGrid/controllers/useAgGridController.js +0 -173
- package/dist/components/Grid/core/components/AgGrid/controllers/useAgGridController.js.map +0 -1
- package/dist/components/Grid/core/components/Save/components/ChangeEditor/components/RecordGrids/RecordGrids.d.ts +0 -7
- package/dist/components/Grid/core/components/Save/components/ChangeEditor/components/RecordGrids/RecordGrids.js +0 -144
- package/dist/components/Grid/core/components/Save/components/ChangeEditor/components/RecordGrids/RecordGrids.js.map +0 -1
- package/dist/components/Grid/core/components/Save/components/ChangeEditor/components/RecordGrids/styles.d.ts +0 -48
- package/dist/components/Grid/core/components/Save/components/ChangeEditor/components/RecordGrids/styles.js +0 -54
- package/dist/components/Grid/core/components/Save/components/ChangeEditor/components/RecordGrids/styles.js.map +0 -1
- package/dist/components/Grid/core/components/Save/hooks/useSave.d.ts +0 -12
- package/dist/components/Grid/core/components/Save/hooks/useSave.js +0 -45
- package/dist/components/Grid/core/components/Save/hooks/useSave.js.map +0 -1
- package/dist/components/Grid/core/constants.d.ts +0 -1
- package/dist/components/Grid/core/constants.js +0 -4
- package/dist/components/Grid/core/constants.js.map +0 -1
- package/dist/components/Grid/core/hooks/useRerender.d.ts +0 -1
- package/dist/components/Grid/core/services/RecordUpdateService/controllers/useRecordUpdateServiceController.d.ts +0 -14
- package/dist/components/Grid/core/services/RecordUpdateService/controllers/useRecordUpdateServiceController.js +0 -25
- package/dist/components/Grid/core/services/RecordUpdateService/controllers/useRecordUpdateServiceController.js.map +0 -1
- package/dist/components/Grid/core/services/RecordUpdateService/model/RecordUpdateService.d.ts +0 -30
- package/dist/components/Grid/core/services/RecordUpdateService/model/RecordUpdateService.js +0 -186
- package/dist/components/Grid/core/services/RecordUpdateService/model/RecordUpdateService.js.map +0 -1
- package/dist/components/Grid/validation/controllers/useRecordValidationController.d.ts +0 -8
- package/dist/components/Grid/validation/controllers/useRecordValidationController.js +0 -25
- package/dist/components/Grid/validation/controllers/useRecordValidationController.js.map +0 -1
- package/dist/components/Grid/validation/model/ColumnValidation.d.ts +0 -11
- package/dist/components/Grid/validation/model/ColumnValidation.js +0 -90
- package/dist/components/Grid/validation/model/ColumnValidation.js.map +0 -1
- /package/dist/{components/DatasetControl/hooks → hooks}/useRerender.d.ts +0 -0
- /package/dist/{components/DatasetControl/hooks → hooks}/useRerender.js +0 -0
|
@@ -4,9 +4,9 @@ import { ThemeProvider } from '@fluentui/react';
|
|
|
4
4
|
import { TextField } from '@talxis/react-components';
|
|
5
5
|
import { datasetControlTranslations } from './translations.js';
|
|
6
6
|
import { getDatasetControlStyles } from './styles.js';
|
|
7
|
-
import { useRerender } from '
|
|
8
|
-
import { Grid } from '../Grid/Grid.js';
|
|
7
|
+
import { useRerender } from '../../hooks/useRerender.js';
|
|
9
8
|
import { useControl } from '../../hooks/useControl.js';
|
|
9
|
+
import { Grid } from '../Grid/Grid.js';
|
|
10
10
|
|
|
11
11
|
const DatasetControl = (props) => {
|
|
12
12
|
const { labels, theme } = useControl('DatasetControl', props, datasetControlTranslations);
|
|
@@ -16,19 +16,21 @@ const DatasetControl = (props) => {
|
|
|
16
16
|
const injectedContextRef = useRef(props.context);
|
|
17
17
|
const styles = useMemo(() => getDatasetControlStyles(), []);
|
|
18
18
|
const onOverrideComponentProps = props.onOverrideComponentProps ?? ((props) => props);
|
|
19
|
+
//@ts-ignore - private property
|
|
19
20
|
dataset._setRenderer(() => rerender());
|
|
20
21
|
//we need to have a way to customize the init behavior from above
|
|
21
22
|
const componentProps = onOverrideComponentProps({
|
|
22
23
|
onDatasetInit: () => dataset.refresh()
|
|
23
24
|
});
|
|
24
25
|
useMemo(() => {
|
|
26
|
+
//@ts-ignore - private property
|
|
25
27
|
injectedContextRef.current = dataset._patchContext(props.context);
|
|
26
28
|
}, [props.context]);
|
|
27
29
|
useMemo(() => {
|
|
28
30
|
componentProps.onDatasetInit();
|
|
29
31
|
}, []);
|
|
30
32
|
const onSearch = (query) => {
|
|
31
|
-
dataset.setSearchQuery(query ?? "");
|
|
33
|
+
dataset.setSearchQuery?.(query ?? "");
|
|
32
34
|
dataset.refresh();
|
|
33
35
|
};
|
|
34
36
|
return (jsxs(ThemeProvider, { theme: theme, applyTo: "none", className: styles.root, children: [props.parameters.EnableQuickFind?.raw &&
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DatasetControl.js","sources":["../../../src/components/DatasetControl/DatasetControl.tsx"],"sourcesContent":["import { useMemo, useRef, useState } from \"react\";\nimport { Grid } from \"../Grid\";\nimport { useControl } from \"../../hooks\";\nimport { ThemeProvider } from \"@fluentui/react\";\nimport { TextField } from \"@talxis/react-components\";\nimport { datasetControlTranslations } from \"./translations\";\nimport { getDatasetControlStyles } from \"./styles\";\nimport { IDatasetControl } from \"./interfaces\";\nimport { useRerender } from \"
|
|
1
|
+
{"version":3,"file":"DatasetControl.js","sources":["../../../src/components/DatasetControl/DatasetControl.tsx"],"sourcesContent":["import { useMemo, useRef, useState } from \"react\";\nimport { Grid } from \"../Grid\";\nimport { useControl } from \"../../hooks\";\nimport { ThemeProvider } from \"@fluentui/react\";\nimport { TextField } from \"@talxis/react-components\";\nimport { datasetControlTranslations } from \"./translations\";\nimport { getDatasetControlStyles } from \"./styles\";\nimport { IDatasetControl } from \"./interfaces\";\nimport { useRerender } from \"../../hooks/useRerender\";\n\nexport const DatasetControl = (props: IDatasetControl) => {\n const { labels, theme } = useControl('DatasetControl', props, datasetControlTranslations);\n const [query, setQuery] = useState<string | undefined>(\"\");\n const rerender = useRerender();\n const dataset = props.parameters.Grid;\n const injectedContextRef = useRef(props.context);\n const styles = useMemo(() => getDatasetControlStyles(), []);\n const onOverrideComponentProps = props.onOverrideComponentProps ?? ((props) => props);\n //@ts-ignore - private property\n dataset._setRenderer(() => rerender());\n\n //we need to have a way to customize the init behavior from above\n const componentProps = onOverrideComponentProps({\n onDatasetInit: () => dataset.refresh()\n })\n\n useMemo(() => {\n //@ts-ignore - private property\n injectedContextRef.current = dataset._patchContext(props.context);\n }, [props.context]);\n\n useMemo(() => {\n componentProps.onDatasetInit();\n }, []);\n\n const onSearch = (query?: string) => {\n dataset.setSearchQuery?.(query ?? \"\");\n dataset.refresh();\n }\n return (\n <ThemeProvider theme={theme} applyTo=\"none\" className={styles.root}>\n {props.parameters.EnableQuickFind?.raw &&\n <TextField\n className={styles.quickFind}\n value={query}\n placeholder={`${labels.search()} ${dataset.getMetadata()?.DisplayCollectionName ?? labels.records()}...`}\n deleteButtonProps={query ? {\n key: 'delete',\n iconProps: {\n iconName: 'Cancel'\n },\n onClick: () => {\n setQuery(\"\");\n onSearch(undefined);\n }\n } : undefined}\n suffixItems={[{\n key: 'search',\n iconProps: {\n iconName: 'Search'\n },\n onClick: () => onSearch(query)\n }]}\n onKeyUp={(e) => {\n if (e.key === 'Enter') {\n onSearch(query);\n }\n }}\n onChange={(e, newValue) => setQuery(newValue)} />\n }\n <Grid \n {...props} \n context={injectedContextRef.current} />\n </ThemeProvider>\n )\n}"],"names":["_jsxs","_jsx"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Grid.js","sources":["../../../src/components/Grid/Grid.tsx"],"sourcesContent":["import { useEffect, useMemo } from \"react\";\nimport { useControl, useControlTheme } from \"../../hooks\"\nimport { IGridContext } from \"./core/interfaces/IGridContext\";\nimport { Grid as GridModel } from \"./core/model/Grid\";\nimport { IGrid } from \"./interfaces\";\nimport { AgGrid } from './core/components/AgGrid/AgGrid';\nimport React from 'react';\nimport { gridTranslations } from './translations';\nimport { GridContext } from \"./GridContext\";\nimport { mergeStyleSets, ThemeProvider } from \"@fluentui/react\";\nimport { KeyHoldListener } from \"./core/services/KeyListener\";\n\nconst styles = mergeStyleSets({\n root: {\n displayName: 'talxis__gridControl',\n height: '100%'\n }\n});\n\nexport const Grid = (props: IGrid) => {\n const { labels } = useControl('Grid', props, gridTranslations);\n const keyHoldListener = useMemo(() => new KeyHoldListener(), []);\n const providerValue: IGridContext = useMemo(() => {\n return {\n gridInstance: new GridModel(props, labels, keyHoldListener)\n }\n }, [])\n providerValue.gridInstance.updateDependencies(props);\n const theme = useControlTheme(props.context.fluentDesignLanguage);\n\n useEffect(() => {\n return () => {\n keyHoldListener.destroy();\n }\n }, []);\n return (\n <GridContext.Provider value={providerValue}>\n <ThemeProvider className={`talxis__gridControl ${styles.root}`} theme={theme} applyTo='none'>\n <AgGrid />\n </ThemeProvider>\n </GridContext.Provider>\n )\n}"],"names":["GridModel","_jsx"],"mappings":";;;;;;;;;;;AAYA,MAAM,MAAM,GAAG,cAAc,CAAC;AAC1B,IAAA,IAAI,EAAE;AACF,QAAA,WAAW,EAAE,qBAAqB;AAClC,QAAA,MAAM,EAAE,MAAM;AACjB,KAAA;AACJ,CAAA,CAAC,CAAC;AAEU,MAAA,IAAI,GAAG,CAAC,KAAY,KAAI;AACjC,IAAA,MAAM,EAAE,MAAM,EAAE,GAAG,UAAU,CAAC,MAAM,EAAE,KAAK,EAAE,gBAAgB,CAAC,CAAC;AAC/D,IAAA,MAAM,eAAe,GAAG,OAAO,CAAC,MAAM,IAAI,eAAe,EAAE,EAAE,EAAE,CAAC,CAAC;AACjE,IAAA,MAAM,aAAa,GAAiB,OAAO,CAAC,MAAK;QAC7C,OAAO;YACH,YAAY,EAAE,IAAIA,MAAS,CAAC,KAAK,EAAE,MAAM,EAAE,eAAe,CAAC;SAC9D,CAAA;KACJ,EAAE,EAAE,CAAC,CAAA;
|
|
1
|
+
{"version":3,"file":"Grid.js","sources":["../../../src/components/Grid/Grid.tsx"],"sourcesContent":["import { useEffect, useMemo } from \"react\";\nimport { useControl, useControlTheme } from \"../../hooks\"\nimport { IGridContext } from \"./core/interfaces/IGridContext\";\nimport { Grid as GridModel } from \"./core/model/Grid\";\nimport { IGrid } from \"./interfaces\";\nimport { AgGrid } from './core/components/AgGrid/AgGrid';\nimport React from 'react';\nimport { gridTranslations } from './translations';\nimport { GridContext } from \"./GridContext\";\nimport { mergeStyleSets, ThemeProvider } from \"@fluentui/react\";\nimport { KeyHoldListener } from \"./core/services/KeyListener\";\n\nconst styles = mergeStyleSets({\n root: {\n displayName: 'talxis__gridControl',\n height: '100%'\n }\n});\n\nexport const Grid = (props: IGrid) => {\n const { labels } = useControl('Grid', props, gridTranslations);\n const keyHoldListener = useMemo(() => new KeyHoldListener(), []);\n const providerValue: IGridContext = useMemo(() => {\n return {\n gridInstance: new GridModel(props, labels, keyHoldListener)\n }\n }, [])\n \n providerValue.gridInstance.updateDependencies(props);\n const theme = useControlTheme(props.context.fluentDesignLanguage);\n\n useEffect(() => {\n return () => {\n keyHoldListener.destroy();\n }\n }, []);\n return (\n <GridContext.Provider value={providerValue}>\n <ThemeProvider className={`talxis__gridControl ${styles.root}`} theme={theme} applyTo='none'>\n <AgGrid />\n </ThemeProvider>\n </GridContext.Provider>\n )\n}"],"names":["GridModel","_jsx"],"mappings":";;;;;;;;;;;AAYA,MAAM,MAAM,GAAG,cAAc,CAAC;AAC1B,IAAA,IAAI,EAAE;AACF,QAAA,WAAW,EAAE,qBAAqB;AAClC,QAAA,MAAM,EAAE,MAAM;AACjB,KAAA;AACJ,CAAA,CAAC,CAAC;AAEU,MAAA,IAAI,GAAG,CAAC,KAAY,KAAI;AACjC,IAAA,MAAM,EAAE,MAAM,EAAE,GAAG,UAAU,CAAC,MAAM,EAAE,KAAK,EAAE,gBAAgB,CAAC,CAAC;AAC/D,IAAA,MAAM,eAAe,GAAG,OAAO,CAAC,MAAM,IAAI,eAAe,EAAE,EAAE,EAAE,CAAC,CAAC;AACjE,IAAA,MAAM,aAAa,GAAiB,OAAO,CAAC,MAAK;QAC7C,OAAO;YACH,YAAY,EAAE,IAAIA,MAAS,CAAC,KAAK,EAAE,MAAM,EAAE,eAAe,CAAC;SAC9D,CAAA;KACJ,EAAE,EAAE,CAAC,CAAA;AAEN,IAAA,aAAa,CAAC,YAAY,CAAC,kBAAkB,CAAC,KAAK,CAAC,CAAC;IACrD,MAAM,KAAK,GAAG,eAAe,CAAC,KAAK,CAAC,OAAO,CAAC,oBAAoB,CAAC,CAAC;IAElE,SAAS,CAAC,MAAK;AACX,QAAA,OAAO,MAAK;YACR,eAAe,CAAC,OAAO,EAAE,CAAC;AAC9B,SAAC,CAAA;KACJ,EAAE,EAAE,CAAC,CAAC;AACP,IAAA,QACIC,GAAA,CAAC,WAAW,CAAC,QAAQ,EAAC,EAAA,KAAK,EAAE,aAAa,YACtCA,GAAC,CAAA,aAAa,EAAC,EAAA,SAAS,EAAE,CAAuB,oBAAA,EAAA,MAAM,CAAC,IAAI,EAAE,EAAE,KAAK,EAAE,KAAK,EAAE,OAAO,EAAC,MAAM,EAAA,QAAA,EACxFA,IAAC,MAAM,EAAA,EAAA,CAAG,EACE,CAAA,EAAA,CACG,EAC1B;AACL;;;;"}
|
|
@@ -1,36 +1,69 @@
|
|
|
1
1
|
import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
|
|
2
2
|
import { AgGridReact } from '@ag-grid-community/react';
|
|
3
3
|
import { useTheme, MessageBar, MessageBarType } from '@fluentui/react';
|
|
4
|
-
import {
|
|
4
|
+
import { ModuleRegistry } from '@ag-grid-community/core';
|
|
5
|
+
import { useRef, useMemo, useState, useEffect, useCallback } from 'react';
|
|
5
6
|
import { useSelectionController } from '../../../selection/controllers/useSelectionController.js';
|
|
6
7
|
import { useGridInstance } from '../../hooks/useGridInstance.js';
|
|
7
8
|
import { getGridStyles } from './styles.js';
|
|
8
|
-
import { useAgGridController } from './controllers/useAgGridController.js';
|
|
9
9
|
import { Paging } from '../../../paging/components/Paging/Paging.js';
|
|
10
10
|
import { EmptyRecords } from './components/EmptyRecordsOverlay/EmptyRecords.js';
|
|
11
11
|
import { Save } from '../Save/Save.js';
|
|
12
12
|
import { LoadingOverlay } from './components/LoadingOverlay/LoadingOverlay.js';
|
|
13
|
-
import { usePagingController } from '../../../paging/controllers/usePagingController.js';
|
|
14
|
-
import { ROW_HEIGHT } from '../../constants.js';
|
|
15
13
|
import { CHECKBOX_COLUMN_KEY } from '../../../constants.js';
|
|
14
|
+
import { useDebounce, useDebouncedCallback } from 'use-debounce';
|
|
15
|
+
import { useGridController } from '../../controllers/useGridController.js';
|
|
16
|
+
import { useStateValues } from '@talxis/react-components';
|
|
17
|
+
import { AgGrid as AgGrid$1 } from './model/AgGrid.js';
|
|
18
|
+
import { ClientSideRowModelModule } from '@ag-grid-community/client-side-row-model';
|
|
19
|
+
import '@ag-grid-community/styles/ag-grid.css';
|
|
20
|
+
import '@ag-grid-community/styles/ag-theme-balham.css';
|
|
16
21
|
|
|
22
|
+
ModuleRegistry.registerModules([ClientSideRowModelModule]);
|
|
17
23
|
const AgGrid = () => {
|
|
18
24
|
const grid = useGridInstance();
|
|
19
25
|
const selection = useSelectionController();
|
|
20
26
|
const gridApiRef = useRef();
|
|
21
27
|
const containerRef = useRef(null);
|
|
22
28
|
const theme = useTheme();
|
|
23
|
-
let { agColumns, stateRef, getTotalColumnsWidth, onGridReady } = useAgGridController(gridApiRef);
|
|
24
|
-
const pagingController = usePagingController();
|
|
25
29
|
const styles = getGridStyles(theme, grid.height);
|
|
26
|
-
const
|
|
30
|
+
const agGridReadyRef = useRef(false);
|
|
31
|
+
const agGrid = useMemo(() => new AgGrid$1(grid, gridApiRef), []);
|
|
32
|
+
const { columns } = useGridController();
|
|
33
|
+
const [agColumns, setAgColumns] = useState([]);
|
|
34
|
+
const [stateValuesRef, getNewStateValues, setDefaultStateValues] = useStateValues(grid.state);
|
|
35
|
+
//this is to prevent AgGrid from throwing errors in some rerender edge cases - https://github.com/ag-grid/ag-grid/issues/6013
|
|
36
|
+
const [records] = useDebounce(grid.records, 0);
|
|
37
|
+
const debouncedRefresh = useDebouncedCallback(() => {
|
|
38
|
+
gridApiRef.current?.refreshCells({
|
|
39
|
+
rowNodes: gridApiRef.current?.getRenderedNodes(),
|
|
40
|
+
force: true
|
|
41
|
+
});
|
|
42
|
+
gridApiRef.current?.refreshHeader();
|
|
43
|
+
agGrid.selectRows();
|
|
44
|
+
}, 0);
|
|
45
|
+
debouncedRefresh();
|
|
46
|
+
useEffect(() => {
|
|
47
|
+
agGrid.selectRows();
|
|
48
|
+
}, [records]);
|
|
49
|
+
const onGridReady = () => {
|
|
50
|
+
agGridReadyRef.current = true;
|
|
51
|
+
setDefaultStateValues({
|
|
52
|
+
scroll: {
|
|
53
|
+
top: 0,
|
|
54
|
+
left: 0
|
|
55
|
+
},
|
|
56
|
+
...gridApiRef.current.getState(),
|
|
57
|
+
});
|
|
58
|
+
agGrid.selectRows();
|
|
59
|
+
};
|
|
27
60
|
const getAvailableWidth = () => {
|
|
28
61
|
const rootWrapper = containerRef.current?.querySelector('.ag-root-wrapper');
|
|
29
62
|
return rootWrapper?.clientWidth ?? 0;
|
|
30
63
|
};
|
|
31
64
|
const sizeColumnsIfSpaceAvailable = () => {
|
|
32
65
|
const availableWidth = getAvailableWidth();
|
|
33
|
-
if (availableWidth > getTotalColumnsWidth()) {
|
|
66
|
+
if (availableWidth > agGrid.getTotalColumnsWidth()) {
|
|
34
67
|
gridApiRef.current.sizeColumnsToFit();
|
|
35
68
|
}
|
|
36
69
|
};
|
|
@@ -52,29 +85,104 @@ const AgGrid = () => {
|
|
|
52
85
|
return aIndex - bIndex;
|
|
53
86
|
});
|
|
54
87
|
grid.dataset.setColumns?.(orderedColumns);
|
|
55
|
-
grid.
|
|
88
|
+
grid.pcfContext.factory.requestRender();
|
|
56
89
|
};
|
|
57
|
-
const
|
|
58
|
-
|
|
59
|
-
|
|
90
|
+
const globalClickHandler = useCallback((e) => {
|
|
91
|
+
const hasAncestorWithClass = (element, className) => {
|
|
92
|
+
let parent = element;
|
|
93
|
+
while (!parent.classList.contains('ag-theme-balham')) {
|
|
94
|
+
if (parent.classList.contains(className)) {
|
|
95
|
+
return true;
|
|
96
|
+
}
|
|
97
|
+
if (parent.tagName === 'HTML') {
|
|
98
|
+
return false;
|
|
99
|
+
}
|
|
100
|
+
parent = parent.parentElement;
|
|
101
|
+
if (!parent) {
|
|
102
|
+
return true;
|
|
103
|
+
}
|
|
104
|
+
}
|
|
105
|
+
return false;
|
|
106
|
+
};
|
|
107
|
+
try {
|
|
108
|
+
if (!hasAncestorWithClass(e.target, 'ag-cell')) {
|
|
109
|
+
gridApiRef.current?.stopEditing();
|
|
110
|
+
}
|
|
111
|
+
}
|
|
112
|
+
catch (err) {
|
|
60
113
|
}
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
114
|
+
}, []);
|
|
115
|
+
const copyCellValue = useCallback((event) => {
|
|
116
|
+
if ((event.ctrlKey || event.metaKey) && event.key.toLowerCase() === 'c') {
|
|
117
|
+
const cell = gridApiRef.current?.getFocusedCell();
|
|
118
|
+
if (!cell) {
|
|
65
119
|
return;
|
|
66
120
|
}
|
|
67
|
-
const
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
121
|
+
const row = gridApiRef.current?.getDisplayedRowAtIndex(cell.rowIndex);
|
|
122
|
+
const formattedValue = gridApiRef.current?.getCellValue({
|
|
123
|
+
rowNode: row,
|
|
124
|
+
colKey: cell.column.getColId(),
|
|
125
|
+
useFormatter: true
|
|
126
|
+
});
|
|
127
|
+
navigator.clipboard.writeText(formattedValue ?? "");
|
|
128
|
+
}
|
|
129
|
+
}, []);
|
|
130
|
+
const toggleOverlay = () => {
|
|
131
|
+
if (!gridApiRef.current) {
|
|
132
|
+
return;
|
|
133
|
+
}
|
|
134
|
+
if (grid.loading) {
|
|
135
|
+
gridApiRef.current.showLoadingOverlay();
|
|
136
|
+
return;
|
|
137
|
+
}
|
|
138
|
+
gridApiRef.current.hideOverlay();
|
|
139
|
+
setTimeout(() => {
|
|
140
|
+
if (grid.records.length === 0) {
|
|
141
|
+
gridApiRef.current?.showNoRowsOverlay();
|
|
72
142
|
}
|
|
73
|
-
|
|
74
|
-
}, 200);
|
|
143
|
+
}, 0);
|
|
75
144
|
};
|
|
145
|
+
const updateColumnVisualSizeFactor = useDebouncedCallback((e) => {
|
|
146
|
+
if (e.source !== 'uiColumnResized') {
|
|
147
|
+
return;
|
|
148
|
+
}
|
|
149
|
+
const resizedColumnKey = grid.dataset.columns.find(x => x.name === e.column?.getId())?.name;
|
|
150
|
+
if (!resizedColumnKey) {
|
|
151
|
+
return;
|
|
152
|
+
}
|
|
153
|
+
const columns = grid.dataset.columns;
|
|
154
|
+
for (let i = 0; i < columns.length; i++) {
|
|
155
|
+
if (columns[i].name === resizedColumnKey) {
|
|
156
|
+
columns[i].visualSizeFactor = e.column?.getActualWidth();
|
|
157
|
+
}
|
|
158
|
+
}
|
|
159
|
+
grid.dataset.setColumns?.(columns);
|
|
160
|
+
gridApiRef.current?.resetRowHeights();
|
|
161
|
+
grid.pcfContext.factory.requestRender();
|
|
162
|
+
}, 200);
|
|
163
|
+
//TODO: find a better way to achieve this
|
|
164
|
+
useEffect(() => {
|
|
165
|
+
document.addEventListener('click', globalClickHandler);
|
|
166
|
+
return () => {
|
|
167
|
+
document.removeEventListener('click', globalClickHandler);
|
|
168
|
+
};
|
|
169
|
+
}, []);
|
|
170
|
+
useEffect(() => {
|
|
171
|
+
setAgColumns(agGrid.columns);
|
|
172
|
+
}, [columns]);
|
|
173
|
+
useEffect(() => {
|
|
174
|
+
toggleOverlay();
|
|
175
|
+
gridApiRef.current?.ensureIndexVisible(0);
|
|
176
|
+
}, [grid.loading]);
|
|
177
|
+
useEffect(() => {
|
|
178
|
+
//this can be replaced with native functionality if we decide to use ag grid enterprise
|
|
179
|
+
grid.keyHoldListener.addOnKeyDownHandler((event) => copyCellValue(event));
|
|
180
|
+
return () => {
|
|
181
|
+
grid.pcfContext.mode.setControlState(getNewStateValues());
|
|
182
|
+
};
|
|
183
|
+
}, []);
|
|
76
184
|
return (jsx("div", { ref: containerRef, className: `${styles.root} ag-theme-balham`, children: agColumns.length > 0 &&
|
|
77
|
-
jsxs(Fragment, { children: [
|
|
185
|
+
jsxs(Fragment, { children: [grid.isEditable && grid.dataset.isDirty?.() &&
|
|
78
186
|
jsx(Save, {}), grid.error &&
|
|
79
187
|
jsx(MessageBar, { messageBarType: MessageBarType.error, children: jsx("span", { dangerouslySetInnerHTML: {
|
|
80
188
|
__html: grid.errorMessage
|
|
@@ -106,10 +214,16 @@ const AgGrid = () => {
|
|
|
106
214
|
}
|
|
107
215
|
sizeColumnsIfSpaceAvailable();
|
|
108
216
|
onGridReady();
|
|
109
|
-
}, initialState:
|
|
110
|
-
...
|
|
217
|
+
}, initialState: stateValuesRef.current, onStateUpdated: (e) => stateValuesRef.current = {
|
|
218
|
+
...stateValuesRef.current,
|
|
111
219
|
...e.state
|
|
112
|
-
},
|
|
220
|
+
}, suppressAnimationFrame: true, columnDefs: agColumns, rowData: records, getRowHeight: (params) => {
|
|
221
|
+
const columnWidths = {};
|
|
222
|
+
params.api.getAllGridColumns().map(col => {
|
|
223
|
+
columnWidths[col.getColId()] = col.getActualWidth();
|
|
224
|
+
});
|
|
225
|
+
return params?.data?.ui?.getHeight(columnWidths, grid.rowHeight);
|
|
226
|
+
} }), grid.paging.isEnabled &&
|
|
113
227
|
jsx(Paging, {})] }) }));
|
|
114
228
|
};
|
|
115
229
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AgGrid.js","sources":["../../../../../../src/components/Grid/core/components/AgGrid/AgGrid.tsx"],"sourcesContent":["import { AgGridReact } from '@ag-grid-community/react';\nimport { MessageBar, MessageBarType, useTheme } from \"@fluentui/react\";\nimport { ColumnMovedEvent, ColumnResizedEvent, GridApi } from \"@ag-grid-community/core\";\nimport { useRef } from \"react\";\nimport { useSelectionController } from \"../../../selection/controllers/useSelectionController\";\nimport { useGridInstance } from \"../../hooks/useGridInstance\";\nimport { getGridStyles } from \"./styles\";\nimport { useAgGridController } from \"./controllers/useAgGridController\";\nimport { Paging } from \"../../../paging/components/Paging/Paging\";\nimport { EmptyRecords } from \"./components/EmptyRecordsOverlay/EmptyRecords\";\nimport { Save } from \"../Save/Save\";\nimport { LoadingOverlay } from \"./components/LoadingOverlay/LoadingOverlay\";\nimport { usePagingController } from '../../../paging/controllers/usePagingController';\nimport { ROW_HEIGHT } from '../../constants';\nimport { IRecord } from '@talxis/client-libraries';\nimport { CHECKBOX_COLUMN_KEY } from '../../../constants';\n\nexport const AgGrid = () => {\n const grid = useGridInstance();\n const selection = useSelectionController();\n const gridApiRef = useRef<GridApi<ComponentFramework.PropertyHelper.DataSetApi.EntityRecord>>();\n const containerRef = useRef<HTMLDivElement>(null);\n const theme = useTheme();\n let { agColumns, stateRef, getTotalColumnsWidth, onGridReady } = useAgGridController(gridApiRef);\n const pagingController = usePagingController();\n const styles = getGridStyles(theme, grid.height);\n const resizeTimeOutRef = useRef<NodeJS.Timeout>();\n\n const getAvailableWidth = () => {\n const rootWrapper = containerRef.current?.querySelector('.ag-root-wrapper');\n return rootWrapper?.clientWidth ?? 0;\n }\n\n const sizeColumnsIfSpaceAvailable = () => {\n const availableWidth = getAvailableWidth();\n if (availableWidth > getTotalColumnsWidth()) {\n gridApiRef.current!.sizeColumnsToFit();\n }\n }\n\n const updateColumnOrder = async (e: ColumnMovedEvent<IRecord, any>) => {\n if(e.type === 'gridOptionsChanged') {\n return;\n }\n const sortedIds = e.api.getState().columnOrder?.orderedColIds;\n if (!sortedIds) {\n return;\n }\n const idIndexMap = new Map<string, number>();\n sortedIds.forEach((id, index) => {\n idIndexMap.set(id, index);\n });\n\n const orderedColumns = [...grid.dataset.columns].sort((a, b) => {\n const aIndex = idIndexMap.has(a.name) ? idIndexMap.get(a.name)! : sortedIds.length;\n const bIndex = idIndexMap.has(b.name) ? idIndexMap.get(b.name)! : sortedIds.length;\n return aIndex - bIndex;\n });\n grid.dataset.setColumns?.(orderedColumns);\n grid.dataset.paging.loadExactPage(grid.paging.pageNumber);\n }\n\n const updateColumnVisualSizeFactor = async (e: ColumnResizedEvent<IRecord, any>): Promise<void> => {\n if(e.source !== 'uiColumnResized') {\n return;\n }\n clearTimeout(resizeTimeOutRef.current)\n resizeTimeOutRef.current = setTimeout(async () => {\n const resizedColumnKey = grid.dataset.columns.find(x => x.name === e.column?.getId())?.name;\n if (!resizedColumnKey) {\n return;\n }\n const columns = grid.dataset.columns;\n for (let i = 0; i < columns.length; i++) {\n if (columns[i].name === resizedColumnKey) {\n columns[i].visualSizeFactor = e.column?.getActualWidth()!\n }\n }\n grid.dataset.setColumns?.(columns);\n }, 200);\n }\n return (\n <div\n ref={containerRef}\n className={`${styles.root} ag-theme-balham`}\n >\n {agColumns.length > 0 &&\n <>\n {((grid.isEditable && grid.parameters.ChangeEditorMode?.raw !== 'edit') || grid.parameters.ChangeEditorMode?.raw === 'read') &&\n <Save />\n }\n {grid.error &&\n <MessageBar messageBarType={MessageBarType.error}>\n <span dangerouslySetInnerHTML={{\n __html: grid.errorMessage!\n }} />\n </MessageBar>\n }\n <AgGridReact\n animateRows\n rowSelection={grid.selection.type}\n noRowsOverlayComponent={Object.keys(grid.dataset.sortedRecordIds.length === 0) && !grid.loading ? EmptyRecords : undefined}\n loadingOverlayComponent={grid.loading ? LoadingOverlay : undefined}\n suppressDragLeaveHidesColumns\n onColumnResized={(e) => updateColumnVisualSizeFactor(e)}\n onColumnMoved={(e) => {\n if (e.finished) {\n updateColumnOrder(e);\n }\n }}\n reactiveCustomComponents\n onRowSelected={(e) => {\n //prevent infinite loop since we are also setting the rows\n //when the selection comes from above\n if (e.source.includes('api') || e.source === 'gridInitializing') {\n return;\n }\n selection.toggle(e.data!, e.node.isSelected()!)\n }}\n onCellDoubleClicked={(e) => {\n if (grid.isNavigationEnabled && !grid.isEditable) {\n grid.openDatasetItem(e.data!.getNamedReference())\n }\n }}\n onCellMouseOver={(e) => {\n if (e.colDef.colId === CHECKBOX_COLUMN_KEY) {\n gridApiRef.current?.setGridOption('suppressRowClickSelection', true)\n }\n }}\n onCellMouseOut={(e) => {\n gridApiRef.current?.setGridOption('suppressRowClickSelection', false)\n }}\n getRowId={(params) => params.data.getRecordId()}\n onGridReady={(e) => {\n gridApiRef.current = e.api as any;\n if (grid.loading) {\n gridApiRef.current?.showLoadingOverlay();\n }\n sizeColumnsIfSpaceAvailable();\n onGridReady();\n }}\n initialState={stateRef.current}\n onStateUpdated={(e) => stateRef.current = {\n ...stateRef.current,\n ...e.state\n }}\n rowHeight={ROW_HEIGHT}\n columnDefs={agColumns as any}\n rowData={grid.records}\n >\n </AgGridReact>\n {pagingController.isEnabled &&\n <Paging />\n }\n </>\n }\n </div>\n );\n}"],"names":["_jsx","_jsxs","_Fragment"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"AgGrid.js","sources":["../../../../../../src/components/Grid/core/components/AgGrid/AgGrid.tsx"],"sourcesContent":["import { AgGridReact } from '@ag-grid-community/react';\nimport { MessageBar, MessageBarType, useTheme } from \"@fluentui/react\";\nimport { ColDef, ColumnMovedEvent, ColumnResizedEvent, GridApi, GridState, ModuleRegistry } from \"@ag-grid-community/core\";\nimport { useCallback, useEffect, useMemo, useRef, useState } from \"react\";\nimport { useSelectionController } from \"../../../selection/controllers/useSelectionController\";\nimport { useGridInstance } from \"../../hooks/useGridInstance\";\nimport { getGridStyles } from \"./styles\";\nimport { Paging } from \"../../../paging/components/Paging/Paging\";\nimport { EmptyRecords } from \"./components/EmptyRecordsOverlay/EmptyRecords\";\nimport { Save } from \"../Save/Save\";\nimport { LoadingOverlay } from \"./components/LoadingOverlay/LoadingOverlay\";\nimport { IRecord } from '@talxis/client-libraries';\nimport { CHECKBOX_COLUMN_KEY } from '../../../constants';\nimport { useDebounce, useDebouncedCallback } from 'use-debounce';\nimport { useGridController } from '../../controllers/useGridController';\nimport { useStateValues } from '@talxis/react-components';\nimport { AgGrid as AgGridModel } from './model/AgGrid';\nimport { ClientSideRowModelModule } from '@ag-grid-community/client-side-row-model';\nimport \"@ag-grid-community/styles/ag-grid.css\";\nimport \"@ag-grid-community/styles/ag-theme-balham.css\";\nModuleRegistry.registerModules([ClientSideRowModelModule]);\n\nexport const AgGrid = () => {\n const grid = useGridInstance();\n const selection = useSelectionController();\n const gridApiRef = useRef<GridApi<ComponentFramework.PropertyHelper.DataSetApi.EntityRecord>>();\n const containerRef = useRef<HTMLDivElement>(null);\n const theme = useTheme();\n const styles = getGridStyles(theme, grid.height);\n const agGridReadyRef = useRef<boolean>(false);\n const agGrid = useMemo(() => new AgGridModel(grid, gridApiRef), [])\n const { columns } = useGridController();\n const [agColumns, setAgColumns] = useState<ColDef[]>([]);\n const [stateValuesRef, getNewStateValues, setDefaultStateValues] = useStateValues<GridState>(grid.state as GridState);\n //this is to prevent AgGrid from throwing errors in some rerender edge cases - https://github.com/ag-grid/ag-grid/issues/6013\n const [records] = useDebounce(grid.records, 0);\n\n const debouncedRefresh = useDebouncedCallback(() => {\n gridApiRef.current?.refreshCells({\n rowNodes: gridApiRef.current?.getRenderedNodes(),\n force: true\n });\n gridApiRef.current?.refreshHeader();\n agGrid.selectRows();\n }, 0);\n\n debouncedRefresh();\n\n useEffect(() => {\n agGrid.selectRows();\n }, [records]);\n\n\n const onGridReady = () => {\n agGridReadyRef.current = true;\n setDefaultStateValues({\n scroll: {\n top: 0,\n left: 0\n },\n ...gridApiRef.current!.getState(),\n });\n agGrid.selectRows();\n }\n\n const getAvailableWidth = () => {\n const rootWrapper = containerRef.current?.querySelector('.ag-root-wrapper');\n return rootWrapper?.clientWidth ?? 0;\n }\n\n const sizeColumnsIfSpaceAvailable = () => {\n const availableWidth = getAvailableWidth();\n if (availableWidth > agGrid.getTotalColumnsWidth()) {\n gridApiRef.current!.sizeColumnsToFit();\n }\n }\n\n const updateColumnOrder = async (e: ColumnMovedEvent<IRecord, any>) => {\n if (e.type === 'gridOptionsChanged') {\n return;\n }\n const sortedIds = e.api.getState().columnOrder?.orderedColIds;\n if (!sortedIds) {\n return;\n }\n const idIndexMap = new Map<string, number>();\n sortedIds.forEach((id, index) => {\n idIndexMap.set(id, index);\n });\n\n const orderedColumns = [...grid.dataset.columns].sort((a, b) => {\n const aIndex = idIndexMap.has(a.name) ? idIndexMap.get(a.name)! : sortedIds.length;\n const bIndex = idIndexMap.has(b.name) ? idIndexMap.get(b.name)! : sortedIds.length;\n return aIndex - bIndex;\n });\n grid.dataset.setColumns?.(orderedColumns);\n grid.pcfContext.factory.requestRender()\n }\n\n const globalClickHandler = useCallback((e: MouseEvent) => {\n const hasAncestorWithClass = (element: HTMLElement, className: string): boolean => {\n let parent = element;\n while (!parent.classList.contains('ag-theme-balham')) {\n if (parent.classList.contains(className)) {\n return true;\n }\n if (parent.tagName === 'HTML') {\n return false;\n }\n parent = parent.parentElement!;\n if (!parent) {\n return true;\n }\n }\n return false;\n };\n try {\n if (!hasAncestorWithClass(e.target as HTMLElement, 'ag-cell')) {\n gridApiRef.current?.stopEditing();\n }\n }\n catch (err) {\n }\n }, []);\n\n const copyCellValue = useCallback((event: KeyboardEvent) => {\n if ((event.ctrlKey || event.metaKey) && event.key.toLowerCase() === 'c') {\n const cell = gridApiRef.current?.getFocusedCell();\n if (!cell) {\n return;\n }\n const row = gridApiRef.current?.getDisplayedRowAtIndex(cell.rowIndex);\n const formattedValue = gridApiRef.current?.getCellValue({\n rowNode: row!,\n colKey: cell.column.getColId(),\n useFormatter: true\n })\n navigator.clipboard.writeText(formattedValue ?? \"\");\n }\n }, []);\n\n const toggleOverlay = () => {\n if (!gridApiRef.current) {\n return;\n }\n if (grid.loading) {\n gridApiRef.current.showLoadingOverlay();\n return;\n }\n gridApiRef.current.hideOverlay();\n setTimeout(() => {\n if (grid.records.length === 0) {\n gridApiRef.current?.showNoRowsOverlay();\n }\n }, 0);\n }\n\n const updateColumnVisualSizeFactor = useDebouncedCallback((e: ColumnResizedEvent<IRecord, any>) => {\n if (e.source !== 'uiColumnResized') {\n return;\n }\n const resizedColumnKey = grid.dataset.columns.find(x => x.name === e.column?.getId())?.name;\n if (!resizedColumnKey) {\n return;\n }\n const columns = grid.dataset.columns;\n for (let i = 0; i < columns.length; i++) {\n if (columns[i].name === resizedColumnKey) {\n columns[i].visualSizeFactor = e.column?.getActualWidth()!\n }\n }\n grid.dataset.setColumns?.(columns);\n gridApiRef.current?.resetRowHeights();\n grid.pcfContext.factory.requestRender()\n }, 200);\n\n //TODO: find a better way to achieve this\n useEffect(() => {\n document.addEventListener('click', globalClickHandler)\n return () => {\n document.removeEventListener('click', globalClickHandler);\n }\n }, []);\n\n useEffect(() => {\n setAgColumns(agGrid.columns);\n }, [columns]);\n\n useEffect(() => {\n toggleOverlay();\n gridApiRef.current?.ensureIndexVisible(0)\n }, [grid.loading]);\n\n\n useEffect(() => {\n //this can be replaced with native functionality if we decide to use ag grid enterprise\n grid.keyHoldListener.addOnKeyDownHandler((event) => copyCellValue(event));\n return () => {\n grid.pcfContext.mode.setControlState(getNewStateValues());\n }\n }, []);\n\n\n return (\n <div\n ref={containerRef}\n className={`${styles.root} ag-theme-balham`}\n >\n {agColumns.length > 0 &&\n <>\n {grid.isEditable && grid.dataset.isDirty?.() &&\n <Save />\n }\n {grid.error &&\n <MessageBar messageBarType={MessageBarType.error}>\n <span dangerouslySetInnerHTML={{\n __html: grid.errorMessage!\n }} />\n </MessageBar>\n }\n <AgGridReact\n animateRows\n rowSelection={grid.selection.type}\n noRowsOverlayComponent={Object.keys(grid.dataset.sortedRecordIds.length === 0) && !grid.loading ? EmptyRecords : undefined}\n loadingOverlayComponent={grid.loading ? LoadingOverlay : undefined}\n suppressDragLeaveHidesColumns\n onColumnResized={(e) => updateColumnVisualSizeFactor(e)}\n onColumnMoved={(e) => {\n if (e.finished) {\n updateColumnOrder(e);\n }\n }}\n reactiveCustomComponents\n onRowSelected={(e) => {\n //prevent infinite loop since we are also setting the rows\n //when the selection comes from above\n if (e.source.includes('api') || e.source === 'gridInitializing') {\n return;\n }\n selection.toggle(e.data!, e.node.isSelected()!)\n }}\n onCellDoubleClicked={(e) => {\n if (grid.isNavigationEnabled && !grid.isEditable) {\n grid.openDatasetItem(e.data!.getNamedReference())\n }\n }}\n onCellMouseOver={(e) => {\n if (e.colDef.colId === CHECKBOX_COLUMN_KEY) {\n gridApiRef.current?.setGridOption('suppressRowClickSelection', true)\n }\n }}\n onCellMouseOut={(e) => {\n gridApiRef.current?.setGridOption('suppressRowClickSelection', false)\n }}\n getRowId={(params) => params.data.getRecordId()}\n onGridReady={(e) => {\n gridApiRef.current = e.api as any;\n if (grid.loading) {\n gridApiRef.current?.showLoadingOverlay();\n }\n sizeColumnsIfSpaceAvailable();\n onGridReady();\n }}\n initialState={stateValuesRef.current}\n onStateUpdated={(e) => stateValuesRef.current = {\n ...stateValuesRef.current,\n ...e.state\n }}\n suppressAnimationFrame\n columnDefs={agColumns as any}\n rowData={records}\n getRowHeight={(params) => {\n const columnWidths: { [name: string]: number } = {};\n params.api.getAllGridColumns().map(col => {\n columnWidths[col.getColId()] = col.getActualWidth()\n })\n return params?.data?.ui?.getHeight(columnWidths, grid.rowHeight)\n }}\n\n >\n </AgGridReact>\n {grid.paging.isEnabled &&\n <Paging />\n }\n </>\n }\n </div>\n );\n}"],"names":["AgGridModel","_jsx","_jsxs","_Fragment"],"mappings":"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"}
|
package/dist/components/Grid/core/components/AgGrid/components/LoadingOverlay/LoadingOverlay.js
CHANGED
|
@@ -1,10 +1,9 @@
|
|
|
1
1
|
import { jsx } from 'react/jsx-runtime';
|
|
2
|
-
import {
|
|
3
|
-
import {
|
|
2
|
+
import { SpinnerSize } from '@fluentui/react';
|
|
3
|
+
import { Spinner } from '@talxis/react-components';
|
|
4
4
|
|
|
5
5
|
const LoadingOverlay = () => {
|
|
6
|
-
|
|
7
|
-
return jsx("div", { className: styles.root, children: jsx("div", { className: styles.tail }) });
|
|
6
|
+
return jsx(Spinner, { size: SpinnerSize.large });
|
|
8
7
|
};
|
|
9
8
|
|
|
10
9
|
export { LoadingOverlay };
|
package/dist/components/Grid/core/components/AgGrid/components/LoadingOverlay/LoadingOverlay.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"LoadingOverlay.js","sources":["../../../../../../../../src/components/Grid/core/components/AgGrid/components/LoadingOverlay/LoadingOverlay.tsx"],"sourcesContent":["import {
|
|
1
|
+
{"version":3,"file":"LoadingOverlay.js","sources":["../../../../../../../../src/components/Grid/core/components/AgGrid/components/LoadingOverlay/LoadingOverlay.tsx"],"sourcesContent":["import { SpinnerSize } from '@fluentui/react';\nimport { Spinner } from '@talxis/react-components';\n\nexport const LoadingOverlay = () => {\n return <Spinner size={SpinnerSize.large} />\n}"],"names":["_jsx"],"mappings":";;;;AAGO,MAAM,cAAc,GAAG,MAAK;IAC/B,OAAOA,GAAA,CAAC,OAAO,EAAC,EAAA,IAAI,EAAE,WAAW,CAAC,KAAK,EAAA,CAAI,CAAA;AAC/C;;;;"}
|
|
@@ -1,6 +1,10 @@
|
|
|
1
1
|
import { GridDependency } from '../../../model/GridDependency.js';
|
|
2
2
|
import { DataType } from '../../../enums/DataType.js';
|
|
3
3
|
import { CHECKBOX_COLUMN_KEY } from '../../../../constants.js';
|
|
4
|
+
import { ReadOnlyCell } from '../../Cell/ReadOnlyCell/ReadOnlyCell.js';
|
|
5
|
+
import { EditableCell } from '../../Cell/EditableCell/EditableCell.js';
|
|
6
|
+
import { GlobalCheckBox } from '../../ColumnHeader/components/GlobalCheckbox/GlobalCheckbox.js';
|
|
7
|
+
import { ColumnHeader } from '../../ColumnHeader/ColumnHeader.js';
|
|
4
8
|
|
|
5
9
|
class AgGrid extends GridDependency {
|
|
6
10
|
constructor(grid, gridApiRef) {
|
|
@@ -19,14 +23,22 @@ class AgGrid extends GridDependency {
|
|
|
19
23
|
sortable: !column.disableSorting,
|
|
20
24
|
editable: (p) => this._isColumnEditable(column, p),
|
|
21
25
|
resizable: column.isResizable,
|
|
22
|
-
suppressMovable: this._grid.props.parameters.ChangeEditorMode ? true : undefined,
|
|
23
26
|
autoHeaderHeight: true,
|
|
24
27
|
suppressSizeToFit: column.name === CHECKBOX_COLUMN_KEY,
|
|
25
28
|
cellClass: this._getCellClassName(column),
|
|
29
|
+
cellRenderer: ReadOnlyCell,
|
|
30
|
+
cellEditor: EditableCell,
|
|
31
|
+
headerComponent: ColumnHeader,
|
|
26
32
|
valueFormatter: (p) => {
|
|
33
|
+
if (column.name === CHECKBOX_COLUMN_KEY) {
|
|
34
|
+
return null;
|
|
35
|
+
}
|
|
27
36
|
return p.data.getFormattedValue(column.name);
|
|
28
37
|
},
|
|
29
38
|
valueGetter: (p) => {
|
|
39
|
+
if (column.name === CHECKBOX_COLUMN_KEY) {
|
|
40
|
+
return null;
|
|
41
|
+
}
|
|
30
42
|
return p.data.getValue(column.name);
|
|
31
43
|
},
|
|
32
44
|
cellRendererParams: {
|
|
@@ -58,6 +70,10 @@ class AgGrid extends GridDependency {
|
|
|
58
70
|
return false;
|
|
59
71
|
},
|
|
60
72
|
};
|
|
73
|
+
if (agColumn.field === CHECKBOX_COLUMN_KEY) {
|
|
74
|
+
agColumn.lockPosition = 'left';
|
|
75
|
+
agColumn.headerComponent = GlobalCheckBox;
|
|
76
|
+
}
|
|
61
77
|
agColumns.push(agColumn);
|
|
62
78
|
}
|
|
63
79
|
return agColumns;
|
|
@@ -106,14 +122,10 @@ class AgGrid extends GridDependency {
|
|
|
106
122
|
return 'talxis-cell-align-left';
|
|
107
123
|
}
|
|
108
124
|
_isColumnEditable(column, params) {
|
|
109
|
-
if (!
|
|
125
|
+
if (!this._grid.parameters.EnableEditing?.raw || params.data?.ui.isLoading?.(column.name) === true) {
|
|
110
126
|
return false;
|
|
111
127
|
}
|
|
112
|
-
|
|
113
|
-
if (isEditable === undefined) {
|
|
114
|
-
return true;
|
|
115
|
-
}
|
|
116
|
-
return isEditable;
|
|
128
|
+
return params.data?.getColumnInfo(column.name).security.editable ?? true;
|
|
117
129
|
}
|
|
118
130
|
}
|
|
119
131
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AgGrid.js","sources":["../../../../../../../src/components/Grid/core/components/AgGrid/model/AgGrid.ts"],"sourcesContent":["import { ColDef, EditableCallbackParams, GridApi, IRowNode } from \"@ag-grid-community/core\";\nimport { Grid } from \"../../../model/Grid\";\nimport { GridDependency } from \"../../../model/GridDependency\";\nimport { DataType } from \"../../../enums/DataType\";\nimport { IGridColumn } from \"../../../interfaces/IGridColumn\";\nimport { CHECKBOX_COLUMN_KEY } from \"../../../../constants\";\nimport { IRecord } from \"@talxis/client-libraries\";\n\nexport class AgGrid extends GridDependency {\n private _gridApiRef: React.MutableRefObject<GridApi<ComponentFramework.PropertyHelper.DataSetApi.EntityRecord> | undefined>;\n\n constructor(grid: Grid, gridApiRef: React.MutableRefObject<GridApi<ComponentFramework.PropertyHelper.DataSetApi.EntityRecord> | undefined>) {\n super(grid);\n this._gridApiRef = gridApiRef;\n }\n public get columns() {\n const agColumns: ColDef[] = [];\n for (const column of this._grid.columns) {\n const agColumn: ColDef = {\n colId: column.name,\n field: column.name,\n headerName: column.displayName,\n hide: column.isHidden,\n initialWidth: column.visualSizeFactor,\n sortable: !column.disableSorting,\n editable: (p) => this._isColumnEditable(column, p), \n resizable: column.isResizable,\n
|
|
1
|
+
{"version":3,"file":"AgGrid.js","sources":["../../../../../../../src/components/Grid/core/components/AgGrid/model/AgGrid.ts"],"sourcesContent":["import { ColDef, EditableCallbackParams, GridApi, IRowNode } from \"@ag-grid-community/core\";\nimport { Grid } from \"../../../model/Grid\";\nimport { GridDependency } from \"../../../model/GridDependency\";\nimport { DataType } from \"../../../enums/DataType\";\nimport { IGridColumn } from \"../../../interfaces/IGridColumn\";\nimport { CHECKBOX_COLUMN_KEY } from \"../../../../constants\";\nimport { IRecord } from \"@talxis/client-libraries\";\nimport { ReadOnlyCell } from \"../../Cell/ReadOnlyCell/ReadOnlyCell\";\nimport { EditableCell } from \"../../Cell/EditableCell/EditableCell\";\nimport { GlobalCheckBox } from \"../../ColumnHeader/components/GlobalCheckbox/GlobalCheckbox\";\nimport { ColumnHeader } from \"../../ColumnHeader/ColumnHeader\";\n\nexport class AgGrid extends GridDependency {\n private _gridApiRef: React.MutableRefObject<GridApi<ComponentFramework.PropertyHelper.DataSetApi.EntityRecord> | undefined>;\n\n constructor(grid: Grid, gridApiRef: React.MutableRefObject<GridApi<ComponentFramework.PropertyHelper.DataSetApi.EntityRecord> | undefined>) {\n super(grid);\n this._gridApiRef = gridApiRef;\n }\n public get columns() {\n const agColumns: ColDef[] = [];\n for (const column of this._grid.columns) {\n const agColumn: ColDef = {\n colId: column.name,\n field: column.name,\n headerName: column.displayName,\n hide: column.isHidden,\n initialWidth: column.visualSizeFactor,\n sortable: !column.disableSorting,\n editable: (p) => this._isColumnEditable(column, p), \n resizable: column.isResizable,\n autoHeaderHeight: true,\n suppressSizeToFit: column.name === CHECKBOX_COLUMN_KEY,\n cellClass: this._getCellClassName(column),\n cellRenderer: ReadOnlyCell,\n cellEditor: EditableCell,\n headerComponent: ColumnHeader,\n valueFormatter: (p) => {\n if(column.name === CHECKBOX_COLUMN_KEY) {\n return null;\n }\n return p.data.getFormattedValue(column.name)\n },\n valueGetter: (p) => {\n if(column.name === CHECKBOX_COLUMN_KEY) {\n return null;\n }\n return p.data.getValue(column.name)\n },\n cellRendererParams: {\n baseColumn: column\n },\n cellEditorParams: {\n baseColumn: column,\n },\n headerComponentParams: {\n baseColumn: column\n },\n suppressKeyboardEvent: (params) => {\n if (params.event.key !== 'Enter' || params.api.getEditingCells().length === 0) {\n return false;\n }\n switch (column.dataType) {\n case DataType.DATE_AND_TIME_DATE_AND_TIME:\n case DataType.DATE_AND_TIME_DATE_ONLY:\n case DataType.LOOKUP_OWNER:\n case DataType.LOOKUP_SIMPLE:\n case DataType.LOOKUP_CUSTOMER:\n case DataType.MULTI_SELECT_OPTIONSET:\n case DataType.OPTIONSET:\n case DataType.TWO_OPTIONS:\n case DataType.WHOLE_DURATION: {\n return true;\n }\n }\n return false;\n },\n }\n if(agColumn.field === CHECKBOX_COLUMN_KEY) {\n agColumn.lockPosition = 'left';\n agColumn.headerComponent = GlobalCheckBox\n }\n agColumns.push(agColumn)\n }\n return agColumns;\n }\n public getTotalColumnsWidth() {\n if (!this._gridApi) {\n return 0;\n }\n let width = 0;\n for (const column of this._gridApi.getAllGridColumns()) {\n width = width + column.getActualWidth();\n }\n return width;\n }\n public selectRows() {\n if (!this._gridApi) {\n return;\n }\n const nodesToSelect: IRowNode[] = [];\n this._gridApi.deselectAll();\n this._gridApi.forEachNode((node: IRowNode) => {\n if (this._grid.dataset.getSelectedRecordIds().includes(node.data.getRecordId())) {\n nodesToSelect.push(node);\n }\n });\n this._gridApi.setNodesSelected({\n nodes: nodesToSelect,\n newValue: true\n });\n this._gridApi.refreshCells({\n columns: [CHECKBOX_COLUMN_KEY],\n force: true\n })\n }\n private get _gridApi() {\n return this._gridApiRef.current;\n }\n private _getCellClassName(column: IGridColumn) {\n switch (column.dataType) {\n case DataType.CURRENCY:\n case DataType.DECIMAL:\n case DataType.WHOLE_NONE: {\n return 'talxis-cell-align-right';\n }\n }\n return 'talxis-cell-align-left';\n }\n\n private _isColumnEditable(column: IGridColumn, params: EditableCallbackParams<IRecord, any>): boolean {\n if (!this._grid.parameters.EnableEditing?.raw || params.data?.ui.isLoading?.(column.name) === true) {\n return false;\n }\n return params.data?.getColumnInfo(column.name).security.editable ?? true;\n }\n}"],"names":[],"mappings":"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"}
|
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
-
/// <reference types="powerapps-component-framework" />
|
|
3
2
|
import { IGridColumn } from '../../../interfaces/IGridColumn';
|
|
4
3
|
import { ICellEditorParams } from '@ag-grid-community/core';
|
|
4
|
+
import { IRecord } from '@talxis/client-libraries';
|
|
5
5
|
interface ICell extends ICellEditorParams {
|
|
6
6
|
baseColumn: IGridColumn;
|
|
7
|
-
data:
|
|
7
|
+
data: IRecord;
|
|
8
8
|
}
|
|
9
|
-
export declare const EditableCell: (
|
|
9
|
+
export declare const EditableCell: (editableCellProps: ICell) => JSX.Element;
|
|
10
10
|
export {};
|