@talxis/base-controls 1.2504.1 → 1.2504.3

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.
Files changed (64) hide show
  1. package/dist/components/DatasetControl/DatasetControl.js +6 -10
  2. package/dist/components/DatasetControl/DatasetControl.js.map +1 -1
  3. package/dist/components/DatasetControl/QuickFind/QuickFind.js +8 -2
  4. package/dist/components/DatasetControl/QuickFind/QuickFind.js.map +1 -1
  5. package/dist/components/DatasetControl/QuickFind/styles.d.ts +8 -0
  6. package/dist/components/DatasetControl/QuickFind/styles.js +15 -0
  7. package/dist/components/DatasetControl/QuickFind/styles.js.map +1 -0
  8. package/dist/components/DatasetControl/interfaces.d.ts +2 -1
  9. package/dist/components/DatasetControl/styles.d.ts +3 -0
  10. package/dist/components/DatasetControl/styles.js +3 -0
  11. package/dist/components/DatasetControl/styles.js.map +1 -1
  12. package/dist/components/Grid/Grid.js +1 -1
  13. package/dist/components/Grid/Grid.js.map +1 -1
  14. package/dist/components/Grid/core/components/AgGrid/AgGrid.d.ts +2 -1
  15. package/dist/components/Grid/core/components/AgGrid/AgGrid.js +94 -58
  16. package/dist/components/Grid/core/components/AgGrid/AgGrid.js.map +1 -1
  17. package/dist/components/Grid/core/components/AgGrid/model/AgGrid.d.ts +3 -1
  18. package/dist/components/Grid/core/components/AgGrid/model/AgGrid.js +68 -57
  19. package/dist/components/Grid/core/components/AgGrid/model/AgGrid.js.map +1 -1
  20. package/dist/components/Grid/core/components/AgGrid/styles.d.ts +3 -3
  21. package/dist/components/Grid/core/components/AgGrid/styles.js +3 -9
  22. package/dist/components/Grid/core/components/AgGrid/styles.js.map +1 -1
  23. package/dist/components/Grid/core/components/Cell/Cell.js +5 -13
  24. package/dist/components/Grid/core/components/Cell/Cell.js.map +1 -1
  25. package/dist/components/Grid/core/components/Cell/CellContent/CellContent.js +14 -2
  26. package/dist/components/Grid/core/components/Cell/CellContent/CellContent.js.map +1 -1
  27. package/dist/components/Grid/core/components/ColumnHeader/components/GlobalCheckbox/GlobalCheckbox.js +9 -9
  28. package/dist/components/Grid/core/components/ColumnHeader/components/GlobalCheckbox/GlobalCheckbox.js.map +1 -1
  29. package/dist/components/Grid/core/components/Save/components/ChangeEditor/components/ChangeGrid/ChangeGrid.js +16 -0
  30. package/dist/components/Grid/core/components/Save/components/ChangeEditor/components/ChangeGrid/ChangeGrid.js.map +1 -1
  31. package/dist/components/Grid/core/model/Grid.d.ts +8 -4
  32. package/dist/components/Grid/core/model/Grid.js +32 -25
  33. package/dist/components/Grid/core/model/Grid.js.map +1 -1
  34. package/dist/components/Grid/filtering/model/Condition.d.ts +0 -1
  35. package/dist/components/Grid/filtering/model/Condition.js +5 -4
  36. package/dist/components/Grid/filtering/model/Condition.js.map +1 -1
  37. package/dist/components/Grid/interfaces.d.ts +9 -1
  38. package/dist/components/Grid/paging/components/Paging/Paging.js +2 -2
  39. package/dist/components/Grid/paging/components/Paging/Paging.js.map +1 -1
  40. package/dist/components/Grid/sorting/Sorting.d.ts +1 -0
  41. package/dist/components/Grid/sorting/Sorting.js +5 -6
  42. package/dist/components/Grid/sorting/Sorting.js.map +1 -1
  43. package/dist/components/Grid/sorting/components/SortingContextualMenu/SortingContextualMenu.js +12 -0
  44. package/dist/components/Grid/sorting/components/SortingContextualMenu/SortingContextualMenu.js.map +1 -1
  45. package/dist/components/Grid/sorting/controllers/useColumnSortingController.d.ts +1 -0
  46. package/dist/components/Grid/sorting/controllers/useColumnSortingController.js +2 -1
  47. package/dist/components/Grid/sorting/controllers/useColumnSortingController.js.map +1 -1
  48. package/dist/components/Grid/translations.d.ts +4 -0
  49. package/dist/components/Grid/translations.js +1 -0
  50. package/dist/components/Grid/translations.js.map +1 -1
  51. package/dist/components/GridCellRenderer/GridCellRenderer.js +4 -2
  52. package/dist/components/GridCellRenderer/GridCellRenderer.js.map +1 -1
  53. package/dist/components/GridCellRenderer/OptionSet/OptionSet.js +8 -2
  54. package/dist/components/GridCellRenderer/OptionSet/OptionSet.js.map +1 -1
  55. package/dist/components/GridCellRenderer/interfaces.d.ts +1 -0
  56. package/dist/components/Lookup/Lookup.js +1 -1
  57. package/dist/components/Lookup/Lookup.js.map +1 -1
  58. package/dist/components/Lookup/hooks/useLookup.js +2 -1
  59. package/dist/components/Lookup/hooks/useLookup.js.map +1 -1
  60. package/dist/components/Lookup/interfaces.d.ts +8 -0
  61. package/dist/index.d.ts +24 -2
  62. package/package.json +4 -3
  63. package/dist/components/DatasetControl/ErrorBoundary.js +0 -33
  64. package/dist/components/DatasetControl/ErrorBoundary.js.map +0 -1
@@ -1,10 +1,9 @@
1
1
  import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
2
2
  import { useRef, useMemo } from 'react';
3
- import { ThemeProvider, MessageBar, MessageBarButton, MessageBarType } from '@fluentui/react';
3
+ import { ThemeProvider } from '@fluentui/react';
4
4
  import { datasetControlTranslations } from './translations.js';
5
5
  import { getDatasetControlStyles } from './styles.js';
6
6
  import { QuickFind } from './QuickFind/QuickFind.js';
7
- import { ErrorBoundary } from './ErrorBoundary.js';
8
7
  import { useRerender } from '@talxis/react-components';
9
8
  import { Grid } from '../Grid/Grid.js';
10
9
  import { useControl } from '../../hooks/useControl.js';
@@ -33,17 +32,14 @@ const DatasetControl = (props) => {
33
32
  className: styles.datasetControlRoot,
34
33
  },
35
34
  headerProps: {
36
- headerContainerProps: {},
35
+ headerContainerProps: {
36
+ className: styles.headerRoot
37
+ },
37
38
  onRender: (renderQuickFind) => renderQuickFind(),
38
39
  onGetQuickFindProps: (props) => props
39
40
  },
41
+ onOverrideControlProps: (props) => props
40
42
  });
41
- const renderErrorMessageBar = (onReset) => {
42
- jsx(MessageBar, { isMultiline: false, actions: jsx(MessageBarButton, { className: styles.messageBarBtn, text: labels.reload(), onClick: () => {
43
- onReset?.();
44
- dataset.refresh();
45
- } }), messageBarType: MessageBarType.error, children: dataset.errorMessage || labels.generalError() });
46
- };
47
43
  useMemo(() => {
48
44
  //@ts-ignore - private property
49
45
  injectedContextRef.current = dataset._patchContext(props.context);
@@ -54,7 +50,7 @@ const DatasetControl = (props) => {
54
50
  return (jsxs(ThemeProvider, { ...componentProps.containerProps, children: [jsx("div", { ...componentProps.headerProps.headerContainerProps, children: componentProps.headerProps.onRender(() => {
55
51
  return jsx(Fragment, { children: props.parameters.EnableQuickFind?.raw &&
56
52
  jsx(QuickFind, { dataset: dataset, labels: labels, theme: theme, onGetQuickFindComponentProps: (props) => componentProps.headerProps.onGetQuickFindProps(props) }) });
57
- }) }), jsx(ErrorBoundary, { fallback: (resetError) => { renderErrorMessageBar(() => resetError()); }, children: jsx(Grid, { ...props, onOverrideComponentProps: (props) => props, context: injectedContextRef.current }) })] }));
53
+ }) }), jsx(Grid, { ...props, onOverrideComponentProps: (props) => componentProps.onOverrideControlProps(props), context: injectedContextRef.current })] }));
58
54
  };
59
55
 
60
56
  export { DatasetControl };
@@ -1 +1 @@
1
- {"version":3,"file":"DatasetControl.js","sources":["../../../src/components/DatasetControl/DatasetControl.tsx"],"sourcesContent":["import { useMemo, useRef } from \"react\";\nimport { Grid } from \"../Grid\";\nimport { useControl } from \"../../hooks\";\nimport { MessageBar, MessageBarButton, MessageBarType, ThemeProvider } from \"@fluentui/react\";\nimport { datasetControlTranslations } from \"./translations\";\nimport { getDatasetControlStyles } from \"./styles\";\nimport { IDatasetControl } from \"./interfaces\";\nimport { QuickFind } from \"./QuickFind/QuickFind\";\nimport { ErrorBoundary } from \"./ErrorBoundary\";\nimport { useRerender } from \"@talxis/react-components\";\n\nexport const DatasetControl = (props: IDatasetControl) => {\n const { labels, theme } = useControl('DatasetControl', props, datasetControlTranslations);\n const rerender = useRerender();\n const dataset = props.parameters.Grid;\n const injectedContextRef = useRef(props.context);\n const styles = useMemo(() => getDatasetControlStyles(theme, props.parameters.Height?.raw), []);\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: () => {\n if (dataset.paging.pageNumber > 1) {\n dataset.paging.loadExactPage(dataset.paging.pageNumber)\n }\n else {\n dataset.refresh();\n }\n },\n containerProps: {\n theme: theme,\n className: styles.datasetControlRoot,\n },\n headerProps: {\n headerContainerProps: {},\n onRender: (renderQuickFind) => renderQuickFind(),\n onGetQuickFindProps: (props) => props\n },\n });\n\n const renderErrorMessageBar = (onReset?: () => void) => {\n <MessageBar\n isMultiline={false}\n actions={<MessageBarButton className={styles.messageBarBtn} text={labels.reload()} onClick={() => {\n onReset?.();\n dataset.refresh();\n }} />}\n messageBarType={MessageBarType.error}>\n {dataset.errorMessage || labels.generalError()}\n </MessageBar>\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\n return (\n <ThemeProvider {...componentProps.containerProps}>\n <div {...componentProps.headerProps.headerContainerProps}>\n {componentProps.headerProps.onRender(() => {\n return <>\n {props.parameters.EnableQuickFind?.raw &&\n <QuickFind \n dataset={dataset} \n labels={labels} \n theme={theme}\n onGetQuickFindComponentProps={(props) => componentProps.headerProps.onGetQuickFindProps(props)} />\n }\n </>\n })}\n </div>\n <ErrorBoundary fallback={(resetError: () => void) => { renderErrorMessageBar(() => resetError()) }}>\n <Grid\n {...props}\n onOverrideComponentProps={(props) => props}\n context={injectedContextRef.current} />\n </ErrorBoundary>\n </ThemeProvider>\n )\n}"],"names":["_jsx","_jsxs"],"mappings":"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"}
1
+ {"version":3,"file":"DatasetControl.js","sources":["../../../src/components/DatasetControl/DatasetControl.tsx"],"sourcesContent":["import { useMemo, useRef } from \"react\";\nimport { Grid } from \"../Grid\";\nimport { useControl } from \"../../hooks\";\nimport { MessageBar, MessageBarButton, MessageBarType, ThemeProvider } from \"@fluentui/react\";\nimport { datasetControlTranslations } from \"./translations\";\nimport { getDatasetControlStyles } from \"./styles\";\nimport { IDatasetControl } from \"./interfaces\";\nimport { QuickFind } from \"./QuickFind/QuickFind\";\nimport { ErrorBoundary } from \"./ErrorBoundary\";\nimport { useRerender } from \"@talxis/react-components\";\n\nexport const DatasetControl = (props: IDatasetControl) => {\n const { labels, theme } = useControl('DatasetControl', props, datasetControlTranslations);\n const rerender = useRerender();\n const dataset = props.parameters.Grid;\n const injectedContextRef = useRef(props.context);\n const styles = useMemo(() => getDatasetControlStyles(theme, props.parameters.Height?.raw), []);\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: () => {\n if (dataset.paging.pageNumber > 1) {\n dataset.paging.loadExactPage(dataset.paging.pageNumber)\n }\n else {\n dataset.refresh();\n }\n },\n containerProps: {\n theme: theme,\n className: styles.datasetControlRoot,\n },\n headerProps: {\n headerContainerProps: {\n className: styles.headerRoot\n },\n onRender: (renderQuickFind) => renderQuickFind(),\n onGetQuickFindProps: (props) => props\n },\n onOverrideControlProps: (props) => props\n });\n\n const renderErrorMessageBar = (onReset?: () => void) => {\n <MessageBar\n isMultiline={false}\n actions={<MessageBarButton className={styles.messageBarBtn} text={labels.reload()} onClick={() => {\n onReset?.();\n dataset.refresh();\n }} />}\n messageBarType={MessageBarType.error}>\n {dataset.errorMessage || labels.generalError()}\n </MessageBar>\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\n return (\n <ThemeProvider {...componentProps.containerProps}>\n <div {...componentProps.headerProps.headerContainerProps}>\n {componentProps.headerProps.onRender(() => {\n return <>\n {props.parameters.EnableQuickFind?.raw &&\n <QuickFind \n dataset={dataset} \n labels={labels} \n theme={theme}\n onGetQuickFindComponentProps={(props) => componentProps.headerProps.onGetQuickFindProps(props)} />\n }\n </>\n })}\n </div>\n <Grid\n {...props}\n onOverrideComponentProps={(props) => componentProps.onOverrideControlProps(props)}\n context={injectedContextRef.current} />\n </ThemeProvider>\n )\n}"],"names":["_jsxs","_jsx"],"mappings":";;;;;;;;;;AAWa,MAAA,cAAc,GAAG,CAAC,KAAsB,KAAI;AACvD,IAAA,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,GAAG,UAAU,CAAC,gBAAgB,EAAE,KAAK,EAAE,0BAA0B,CAAC,CAAC;AAC1F,IAAA,MAAM,QAAQ,GAAG,WAAW,EAAE,CAAC;AAC/B,IAAA,MAAM,OAAO,GAAG,KAAK,CAAC,UAAU,CAAC,IAAI,CAAC;IACtC,MAAM,kBAAkB,GAAG,MAAM,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC;IACjD,MAAM,MAAM,GAAG,OAAO,CAAC,MAAM,uBAAuB,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,CAAC,MAAM,EAAE,GAAG,CAAC,EAAE,EAAE,CAAC,CAAC;AAC/F,IAAA,MAAM,wBAAwB,GAAG,KAAK,CAAC,wBAAwB,KAAK,CAAC,KAAK,KAAK,KAAK,CAAC,CAAC;;IAEtF,OAAO,CAAC,YAAY,CAAC,MAAM,QAAQ,EAAE,CAAC,CAAC;;IAGvC,MAAM,cAAc,GAAG,wBAAwB,CAAC;QAC9C,aAAa,EAAE,MAAK;AAClB,YAAA,IAAI,OAAO,CAAC,MAAM,CAAC,UAAU,GAAG,CAAC,EAAE;gBACjC,OAAO,CAAC,MAAM,CAAC,aAAa,CAAC,OAAO,CAAC,MAAM,CAAC,UAAU,CAAC,CAAA;AACxD,aAAA;AACI,iBAAA;gBACH,OAAO,CAAC,OAAO,EAAE,CAAC;AACnB,aAAA;SACF;AACD,QAAA,cAAc,EAAE;AACd,YAAA,KAAK,EAAE,KAAK;YACZ,SAAS,EAAE,MAAM,CAAC,kBAAkB;AACrC,SAAA;AACD,QAAA,WAAW,EAAE;AACX,YAAA,oBAAoB,EAAE;gBACpB,SAAS,EAAE,MAAM,CAAC,UAAU;AAC7B,aAAA;AACD,YAAA,QAAQ,EAAE,CAAC,eAAe,KAAK,eAAe,EAAE;AAChD,YAAA,mBAAmB,EAAE,CAAC,KAAK,KAAK,KAAK;AACtC,SAAA;AACD,QAAA,sBAAsB,EAAE,CAAC,KAAK,KAAK,KAAK;AACzC,KAAA,CAAC,CAAC;IAcH,OAAO,CAAC,MAAK;;QAEX,kBAAkB,CAAC,OAAO,GAAG,OAAO,CAAC,aAAa,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC;AACpE,KAAC,EAAE,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC;IAEpB,OAAO,CAAC,MAAK;QACX,cAAc,CAAC,aAAa,EAAE,CAAC;KAChC,EAAE,EAAE,CAAC,CAAC;IAGP,QACEA,KAAC,aAAa,EAAA,EAAA,GAAK,cAAc,CAAC,cAAc,EAC9C,QAAA,EAAA,CAAAC,GAAA,CAAA,KAAA,EAAA,EAAA,GAAS,cAAc,CAAC,WAAW,CAAC,oBAAoB,YACrD,cAAc,CAAC,WAAW,CAAC,QAAQ,CAAC,MAAK;AACxC,oBAAA,OAAOA,0BACJ,KAAK,CAAC,UAAU,CAAC,eAAe,EAAE,GAAG;AACpC,4BAAAA,GAAA,CAAC,SAAS,EAAA,EACR,OAAO,EAAE,OAAO,EAChB,MAAM,EAAE,MAAM,EACd,KAAK,EAAE,KAAK,EACZ,4BAA4B,EAAE,CAAC,KAAK,KAAK,cAAc,CAAC,WAAW,CAAC,mBAAmB,CAAC,KAAK,CAAC,EAAA,CAAI,GAErG,CAAA;AACL,iBAAC,CAAC,EAAA,CACE,EACJA,GAAA,CAAC,IAAI,EAAA,EAAA,GACC,KAAK,EACT,wBAAwB,EAAE,CAAC,KAAK,KAAK,cAAc,CAAC,sBAAsB,CAAC,KAAK,CAAC,EACjF,OAAO,EAAE,kBAAkB,CAAC,OAAO,EAAI,CAAA,CAAA,EAAA,CAC7B,EACjB;AACH;;;;"}
@@ -1,17 +1,23 @@
1
1
  import { jsx } from 'react/jsx-runtime';
2
2
  import { TextField } from '@talxis/react-components';
3
- import { useState, useEffect } from 'react';
3
+ import { useState, useMemo, useEffect } from 'react';
4
4
  import { ThemeProvider } from '@fluentui/react';
5
+ import { getQuickFindStyles } from './styles.js';
5
6
 
6
7
  const QuickFind = (props) => {
7
8
  const { dataset, labels, theme } = { ...props };
8
9
  const [query, setQuery] = useState('');
10
+ const styles = useMemo(() => getQuickFindStyles(), []);
9
11
  const quickFindProps = props.onGetQuickFindComponentProps({
10
12
  container: {
11
- theme: theme
13
+ theme: theme,
14
+ className: styles.quickFindRoot
12
15
  },
13
16
  textFieldProps: {
14
17
  value: query,
18
+ styles: {
19
+ fieldGroup: styles.fieldGroup
20
+ },
15
21
  placeholder: `${labels.search()} ${dataset.getMetadata()?.DisplayCollectionName ?? labels.records()}...`,
16
22
  onChange: (e, newValue) => setQuery(newValue ?? ''),
17
23
  onKeyUp: (e) => {
@@ -1 +1 @@
1
- {"version":3,"file":"QuickFind.js","sources":["../../../../src/components/DatasetControl/QuickFind/QuickFind.tsx"],"sourcesContent":["import { IDataset } from \"@talxis/client-libraries\";\nimport { ITextFieldProps, ITheme, TextField } from \"@talxis/react-components\";\nimport { datasetControlTranslations } from \"../translations\";\nimport { ITranslation } from \"../../../hooks\";\nimport { useEffect, useState } from \"react\";\nimport { ThemeProvider } from \"@fluentui/react\";\nimport { IQuickFindProps } from \"../interfaces\";\n\nexport interface IQuickFindComponentProps {\n labels: ITranslation<typeof datasetControlTranslations>\n dataset: IDataset;\n theme: ITheme;\n onGetQuickFindComponentProps: (props: IQuickFindProps) => IQuickFindProps;\n}\n\nexport const QuickFind = (props: IQuickFindComponentProps) => {\n const { dataset, labels, theme } = { ...props };\n const [query, setQuery] = useState<string>('');\n\n const quickFindProps = props.onGetQuickFindComponentProps({\n container: {\n theme: theme\n },\n textFieldProps: {\n value: query,\n placeholder: `${labels.search()} ${dataset.getMetadata()?.DisplayCollectionName ?? labels.records()}...`,\n onChange: (e, newValue) => setQuery(newValue ?? ''),\n onKeyUp: (e) => {\n if (e.key === 'Enter') {\n onSearch(query);\n }\n },\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 }\n })\n const onSearch = (query?: string) => {\n dataset.setSearchQuery?.(query ?? \"\");\n dataset.refresh();\n }\n\n useEffect(() => {\n setQuery(dataset.getSearchQuery?.() ?? '');\n }, [dataset.getSearchQuery?.()])\n //needs to be wrapped within ThemeProvider because the theme context can be lost if we are overriding the header render\n return <ThemeProvider {...quickFindProps.container}><TextField {...quickFindProps.textFieldProps} /></ThemeProvider>\n}"],"names":["_jsx"],"mappings":";;;;;AAea,MAAA,SAAS,GAAG,CAAC,KAA+B,KAAI;AACzD,IAAA,MAAM,EAAE,OAAO,EAAE,MAAM,EAAE,KAAK,EAAE,GAAG,EAAE,GAAG,KAAK,EAAE,CAAC;IAChD,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAAS,EAAE,CAAC,CAAC;AAE/C,IAAA,MAAM,cAAc,GAAG,KAAK,CAAC,4BAA4B,CAAC;AACtD,QAAA,SAAS,EAAE;AACP,YAAA,KAAK,EAAE,KAAK;AACf,SAAA;AACD,QAAA,cAAc,EAAE;AACZ,YAAA,KAAK,EAAE,KAAK;AACZ,YAAA,WAAW,EAAE,CAAG,EAAA,MAAM,CAAC,MAAM,EAAE,IAAI,OAAO,CAAC,WAAW,EAAE,EAAE,qBAAqB,IAAI,MAAM,CAAC,OAAO,EAAE,CAAK,GAAA,CAAA;AACxG,YAAA,QAAQ,EAAE,CAAC,CAAC,EAAE,QAAQ,KAAK,QAAQ,CAAC,QAAQ,IAAI,EAAE,CAAC;AACnD,YAAA,OAAO,EAAE,CAAC,CAAC,KAAI;AACX,gBAAA,IAAI,CAAC,CAAC,GAAG,KAAK,OAAO,EAAE;oBACnB,QAAQ,CAAC,KAAK,CAAC,CAAC;AACnB,iBAAA;aACJ;AACD,YAAA,iBAAiB,EAAE,KAAK,GAAG;AACvB,gBAAA,GAAG,EAAE,QAAQ;AACb,gBAAA,SAAS,EAAE;AACP,oBAAA,QAAQ,EAAE,QAAQ;AACrB,iBAAA;gBACD,OAAO,EAAE,MAAK;oBACV,QAAQ,CAAC,EAAE,CAAC,CAAC;oBACb,QAAQ,CAAC,SAAS,CAAC,CAAC;iBACvB;aACJ,GAAG,SAAS;AACb,YAAA,WAAW,EAAE,CAAC;AACV,oBAAA,GAAG,EAAE,QAAQ;AACb,oBAAA,SAAS,EAAE;AACP,wBAAA,QAAQ,EAAE,QAAQ;AACrB,qBAAA;AACD,oBAAA,OAAO,EAAE,MAAM,QAAQ,CAAC,KAAK,CAAC;iBACjC,CAAC;AACL,SAAA;AACJ,KAAA,CAAC,CAAA;AACF,IAAA,MAAM,QAAQ,GAAG,CAAC,KAAc,KAAI;QAChC,OAAO,CAAC,cAAc,GAAG,KAAK,IAAI,EAAE,CAAC,CAAC;QACtC,OAAO,CAAC,OAAO,EAAE,CAAC;AACtB,KAAC,CAAA;IAED,SAAS,CAAC,MAAK;QACX,QAAQ,CAAC,OAAO,CAAC,cAAc,IAAI,IAAI,EAAE,CAAC,CAAC;KAC9C,EAAE,CAAC,OAAO,CAAC,cAAc,IAAI,CAAC,CAAC,CAAA;;AAEhC,IAAA,OAAOA,GAAC,CAAA,aAAa,EAAK,EAAA,GAAA,cAAc,CAAC,SAAS,EAAA,QAAA,EAAEA,GAAC,CAAA,SAAS,OAAK,cAAc,CAAC,cAAc,EAAA,CAAI,GAAgB,CAAA;AACxH;;;;"}
1
+ {"version":3,"file":"QuickFind.js","sources":["../../../../src/components/DatasetControl/QuickFind/QuickFind.tsx"],"sourcesContent":["import { IDataset } from \"@talxis/client-libraries\";\nimport { ITextFieldProps, ITheme, TextField } from \"@talxis/react-components\";\nimport { datasetControlTranslations } from \"../translations\";\nimport { ITranslation } from \"../../../hooks\";\nimport { useEffect, useMemo, useState } from \"react\";\nimport { ThemeProvider } from \"@fluentui/react\";\nimport { IQuickFindProps } from \"../interfaces\";\nimport { getQuickFindStyles } from \"./styles\";\n\nexport interface IQuickFindComponentProps {\n labels: ITranslation<typeof datasetControlTranslations>\n dataset: IDataset;\n theme: ITheme;\n onGetQuickFindComponentProps: (props: IQuickFindProps) => IQuickFindProps;\n}\n\nexport const QuickFind = (props: IQuickFindComponentProps) => {\n const { dataset, labels, theme } = { ...props };\n const [query, setQuery] = useState<string>('');\n const styles = useMemo(() => getQuickFindStyles(), [])\n\n const quickFindProps = props.onGetQuickFindComponentProps({\n container: {\n theme: theme,\n className: styles.quickFindRoot\n },\n textFieldProps: {\n value: query,\n styles: {\n fieldGroup: styles.fieldGroup\n },\n placeholder: `${labels.search()} ${dataset.getMetadata()?.DisplayCollectionName ?? labels.records()}...`,\n onChange: (e, newValue) => setQuery(newValue ?? ''),\n onKeyUp: (e) => {\n if (e.key === 'Enter') {\n onSearch(query);\n }\n },\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 }\n })\n const onSearch = (query?: string) => {\n dataset.setSearchQuery?.(query ?? \"\");\n dataset.refresh();\n }\n\n useEffect(() => {\n setQuery(dataset.getSearchQuery?.() ?? '');\n }, [dataset.getSearchQuery?.()])\n //needs to be wrapped within ThemeProvider because the theme context can be lost if we are overriding the header render\n return <ThemeProvider {...quickFindProps.container}><TextField {...quickFindProps.textFieldProps} /></ThemeProvider>\n}"],"names":["_jsx"],"mappings":";;;;;;AAgBa,MAAA,SAAS,GAAG,CAAC,KAA+B,KAAI;AACzD,IAAA,MAAM,EAAE,OAAO,EAAE,MAAM,EAAE,KAAK,EAAE,GAAG,EAAE,GAAG,KAAK,EAAE,CAAC;IAChD,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAAS,EAAE,CAAC,CAAC;AAC/C,IAAA,MAAM,MAAM,GAAG,OAAO,CAAC,MAAM,kBAAkB,EAAE,EAAE,EAAE,CAAC,CAAA;AAEtD,IAAA,MAAM,cAAc,GAAG,KAAK,CAAC,4BAA4B,CAAC;AACtD,QAAA,SAAS,EAAE;AACP,YAAA,KAAK,EAAE,KAAK;YACZ,SAAS,EAAE,MAAM,CAAC,aAAa;AAClC,SAAA;AACD,QAAA,cAAc,EAAE;AACZ,YAAA,KAAK,EAAE,KAAK;AACZ,YAAA,MAAM,EAAE;gBACJ,UAAU,EAAE,MAAM,CAAC,UAAU;AAChC,aAAA;AACD,YAAA,WAAW,EAAE,CAAG,EAAA,MAAM,CAAC,MAAM,EAAE,IAAI,OAAO,CAAC,WAAW,EAAE,EAAE,qBAAqB,IAAI,MAAM,CAAC,OAAO,EAAE,CAAK,GAAA,CAAA;AACxG,YAAA,QAAQ,EAAE,CAAC,CAAC,EAAE,QAAQ,KAAK,QAAQ,CAAC,QAAQ,IAAI,EAAE,CAAC;AACnD,YAAA,OAAO,EAAE,CAAC,CAAC,KAAI;AACX,gBAAA,IAAI,CAAC,CAAC,GAAG,KAAK,OAAO,EAAE;oBACnB,QAAQ,CAAC,KAAK,CAAC,CAAC;AACnB,iBAAA;aACJ;AACD,YAAA,iBAAiB,EAAE,KAAK,GAAG;AACvB,gBAAA,GAAG,EAAE,QAAQ;AACb,gBAAA,SAAS,EAAE;AACP,oBAAA,QAAQ,EAAE,QAAQ;AACrB,iBAAA;gBACD,OAAO,EAAE,MAAK;oBACV,QAAQ,CAAC,EAAE,CAAC,CAAC;oBACb,QAAQ,CAAC,SAAS,CAAC,CAAC;iBACvB;aACJ,GAAG,SAAS;AACb,YAAA,WAAW,EAAE,CAAC;AACV,oBAAA,GAAG,EAAE,QAAQ;AACb,oBAAA,SAAS,EAAE;AACP,wBAAA,QAAQ,EAAE,QAAQ;AACrB,qBAAA;AACD,oBAAA,OAAO,EAAE,MAAM,QAAQ,CAAC,KAAK,CAAC;iBACjC,CAAC;AACL,SAAA;AACJ,KAAA,CAAC,CAAA;AACF,IAAA,MAAM,QAAQ,GAAG,CAAC,KAAc,KAAI;QAChC,OAAO,CAAC,cAAc,GAAG,KAAK,IAAI,EAAE,CAAC,CAAC;QACtC,OAAO,CAAC,OAAO,EAAE,CAAC;AACtB,KAAC,CAAA;IAED,SAAS,CAAC,MAAK;QACX,QAAQ,CAAC,OAAO,CAAC,cAAc,IAAI,IAAI,EAAE,CAAC,CAAC;KAC9C,EAAE,CAAC,OAAO,CAAC,cAAc,IAAI,CAAC,CAAC,CAAA;;AAEhC,IAAA,OAAOA,GAAC,CAAA,aAAa,EAAK,EAAA,GAAA,cAAc,CAAC,SAAS,EAAA,QAAA,EAAEA,GAAC,CAAA,SAAS,OAAK,cAAc,CAAC,cAAc,EAAA,CAAI,GAAgB,CAAA;AACxH;;;;"}
@@ -0,0 +1,8 @@
1
+ export declare const getQuickFindStyles: () => import("@fluentui/react").IProcessedStyleSet<{
2
+ quickFindRoot: {
3
+ marginLeft: string;
4
+ };
5
+ fieldGroup: {
6
+ width: number;
7
+ };
8
+ }>;
@@ -0,0 +1,15 @@
1
+ import { mergeStyleSets } from '@fluentui/react';
2
+
3
+ const getQuickFindStyles = () => {
4
+ return mergeStyleSets({
5
+ quickFindRoot: {
6
+ marginLeft: 'auto'
7
+ },
8
+ fieldGroup: {
9
+ width: 230
10
+ }
11
+ });
12
+ };
13
+
14
+ export { getQuickFindStyles };
15
+ //# sourceMappingURL=styles.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"styles.js","sources":["../../../../src/components/DatasetControl/QuickFind/styles.ts"],"sourcesContent":["import { mergeStyleSets } from \"@fluentui/react\"\n\nexport const getQuickFindStyles = () => {\n return mergeStyleSets({\n quickFindRoot: {\n marginLeft: 'auto'\n },\n fieldGroup: {\n width: 230\n }\n })\n}"],"names":[],"mappings":";;AAEO,MAAM,kBAAkB,GAAG,MAAK;AACnC,IAAA,OAAO,cAAc,CAAC;AAClB,QAAA,aAAa,EAAE;AACX,YAAA,UAAU,EAAE,MAAM;AACrB,SAAA;AACD,QAAA,UAAU,EAAE;AACR,YAAA,KAAK,EAAE,GAAG;AACb,SAAA;AACJ,KAAA,CAAC,CAAA;AACN;;;;"}
@@ -2,7 +2,7 @@
2
2
  import { ThemeProviderProps } from "@fluentui/react";
3
3
  import { ITranslation } from "../../hooks";
4
4
  import { IControl, ITwoOptionsProperty } from "../../interfaces";
5
- import { IGridOutputs, IGridParameters } from "../Grid";
5
+ import { IGridComponentProps, IGridOutputs, IGridParameters } from "../Grid";
6
6
  import { gridTranslations } from "../Grid/translations";
7
7
  import { datasetControlTranslations } from "./translations";
8
8
  import { ITextFieldProps } from "@talxis/react-components";
@@ -18,6 +18,7 @@ export interface IDatasetControlComponentProps {
18
18
  onRender: (renderQuickFind: () => React.ReactElement) => React.ReactElement;
19
19
  onGetQuickFindProps: (props: IQuickFindProps) => IQuickFindProps;
20
20
  };
21
+ onOverrideControlProps: (props: IGridComponentProps) => IGridComponentProps;
21
22
  }
22
23
  export interface IDatasetControl extends IControl<IGridParameters, IGridOutputs, Partial<ITranslation<typeof datasetControlTranslations & typeof gridTranslations>>, IDatasetControlComponentProps> {
23
24
  EnableQuickFind?: Omit<ITwoOptionsProperty, 'attributes'>;
@@ -9,6 +9,9 @@ export declare const getDatasetControlStyles: (theme: ITheme, height?: string |
9
9
  flexDirection: string;
10
10
  gap: number;
11
11
  };
12
+ headerRoot: {
13
+ display: string;
14
+ };
12
15
  messageBarBtn: {
13
16
  minHeight: string;
14
17
  };
@@ -10,6 +10,9 @@ const getDatasetControlStyles = (theme, height) => {
10
10
  gap: 15,
11
11
  ...(height === '100%' ? getFullHeightStyles(theme) : {})
12
12
  },
13
+ headerRoot: {
14
+ display: 'flex'
15
+ },
13
16
  messageBarBtn: {
14
17
  minHeight: 'inherit'
15
18
  }
@@ -1 +1 @@
1
- {"version":3,"file":"styles.js","sources":["../../../src/components/DatasetControl/styles.ts"],"sourcesContent":["import { mergeStyleSets } from \"@fluentui/react\"\nimport { Client } from \"@talxis/client-libraries\";\nimport { ITheme } from \"@talxis/react-components\";\n\nconst client = new Client();\n\nexport const getDatasetControlStyles = (theme: ITheme, height?: string | null) => {\n return mergeStyleSets({\n datasetControlRoot: {\n display: 'flex',\n flexDirection: 'column',\n gap: 15,\n ...(height === '100%' ? getFullHeightStyles(theme) : {})\n\n },\n messageBarBtn: {\n minHeight: 'inherit'\n }\n });\n}\n\nconst getFullHeightStyles = (theme: ITheme) => {\n const styles = {\n flexGrow: 1,\n paddingLeft: 15,\n paddingRight: 15,\n paddingTop: 15\n }\n if (!client.isTalxisPortal()) {\n return {\n ...styles,\n boxShadow: theme.effects.elevation8,\n borderRadius: theme.effects.roundedCorner4,\n margin: 16,\n marginRight: 20\n }\n }\n else {\n return styles;\n }\n}"],"names":[],"mappings":";;;AAIA,MAAM,MAAM,GAAG,IAAI,MAAM,EAAE,CAAC;MAEf,uBAAuB,GAAG,CAAC,KAAa,EAAE,MAAsB,KAAI;AAC7E,IAAA,OAAO,cAAc,CAAC;AAClB,QAAA,kBAAkB,EAAE;AAChB,YAAA,OAAO,EAAE,MAAM;AACf,YAAA,aAAa,EAAE,QAAQ;AACvB,YAAA,GAAG,EAAE,EAAE;AACP,YAAA,IAAI,MAAM,KAAK,MAAM,GAAG,mBAAmB,CAAC,KAAK,CAAC,GAAG,EAAE,CAAC;AAE3D,SAAA;AACD,QAAA,aAAa,EAAE;AACX,YAAA,SAAS,EAAE,SAAS;AACvB,SAAA;AACJ,KAAA,CAAC,CAAC;AACP,EAAC;AAED,MAAM,mBAAmB,GAAG,CAAC,KAAa,KAAI;AAC1C,IAAA,MAAM,MAAM,GAAG;AACX,QAAA,QAAQ,EAAE,CAAC;AACX,QAAA,WAAW,EAAE,EAAE;AACf,QAAA,YAAY,EAAE,EAAE;AAChB,QAAA,UAAU,EAAE,EAAE;KACjB,CAAA;AACD,IAAA,IAAI,CAAC,MAAM,CAAC,cAAc,EAAE,EAAE;QAC1B,OAAO;AACH,YAAA,GAAG,MAAM;AACT,YAAA,SAAS,EAAE,KAAK,CAAC,OAAO,CAAC,UAAU;AACnC,YAAA,YAAY,EAAE,KAAK,CAAC,OAAO,CAAC,cAAc;AAC1C,YAAA,MAAM,EAAE,EAAE;AACV,YAAA,WAAW,EAAE,EAAE;SAClB,CAAA;AACJ,KAAA;AACI,SAAA;AACD,QAAA,OAAO,MAAM,CAAC;AACjB,KAAA;AACL,CAAC;;;;"}
1
+ {"version":3,"file":"styles.js","sources":["../../../src/components/DatasetControl/styles.ts"],"sourcesContent":["import { mergeStyleSets } from \"@fluentui/react\"\nimport { Client } from \"@talxis/client-libraries\";\nimport { ITheme } from \"@talxis/react-components\";\n\nconst client = new Client();\n\nexport const getDatasetControlStyles = (theme: ITheme, height?: string | null) => {\n return mergeStyleSets({\n datasetControlRoot: {\n display: 'flex',\n flexDirection: 'column',\n gap: 15,\n ...(height === '100%' ? getFullHeightStyles(theme) : {})\n\n },\n headerRoot: {\n display: 'flex'\n },\n messageBarBtn: {\n minHeight: 'inherit'\n }\n });\n}\n\nconst getFullHeightStyles = (theme: ITheme) => {\n const styles = {\n flexGrow: 1,\n paddingLeft: 15,\n paddingRight: 15,\n paddingTop: 15\n }\n if (!client.isTalxisPortal()) {\n return {\n ...styles,\n boxShadow: theme.effects.elevation8,\n borderRadius: theme.effects.roundedCorner4,\n margin: 16,\n marginRight: 20\n }\n }\n else {\n return styles;\n }\n}"],"names":[],"mappings":";;;AAIA,MAAM,MAAM,GAAG,IAAI,MAAM,EAAE,CAAC;MAEf,uBAAuB,GAAG,CAAC,KAAa,EAAE,MAAsB,KAAI;AAC7E,IAAA,OAAO,cAAc,CAAC;AAClB,QAAA,kBAAkB,EAAE;AAChB,YAAA,OAAO,EAAE,MAAM;AACf,YAAA,aAAa,EAAE,QAAQ;AACvB,YAAA,GAAG,EAAE,EAAE;AACP,YAAA,IAAI,MAAM,KAAK,MAAM,GAAG,mBAAmB,CAAC,KAAK,CAAC,GAAG,EAAE,CAAC;AAE3D,SAAA;AACD,QAAA,UAAU,EAAE;AACR,YAAA,OAAO,EAAE,MAAM;AAClB,SAAA;AACD,QAAA,aAAa,EAAE;AACX,YAAA,SAAS,EAAE,SAAS;AACvB,SAAA;AACJ,KAAA,CAAC,CAAC;AACP,EAAC;AAED,MAAM,mBAAmB,GAAG,CAAC,KAAa,KAAI;AAC1C,IAAA,MAAM,MAAM,GAAG;AACX,QAAA,QAAQ,EAAE,CAAC;AACX,QAAA,WAAW,EAAE,EAAE;AACf,QAAA,YAAY,EAAE,EAAE;AAChB,QAAA,UAAU,EAAE,EAAE;KACjB,CAAA;AACD,IAAA,IAAI,CAAC,MAAM,CAAC,cAAc,EAAE,EAAE;QAC1B,OAAO;AACH,YAAA,GAAG,MAAM;AACT,YAAA,SAAS,EAAE,KAAK,CAAC,OAAO,CAAC,UAAU;AACnC,YAAA,YAAY,EAAE,KAAK,CAAC,OAAO,CAAC,cAAc;AAC1C,YAAA,MAAM,EAAE,EAAE;AACV,YAAA,WAAW,EAAE,EAAE;SAClB,CAAA;AACJ,KAAA;AACI,SAAA;AACD,QAAA,OAAO,MAAM,CAAC;AACjB,KAAA;AACL,CAAC;;;;"}
@@ -30,7 +30,7 @@ const Grid = (props) => {
30
30
  providerValue.gridInstance.destroy();
31
31
  };
32
32
  }, []);
33
- return (jsx(GridContext.Provider, { value: providerValue, children: jsx(ThemeProvider, { className: `talxis__gridControl ${styles.root}`, theme: theme, applyTo: 'none', children: jsx(AgGrid, {}) }) }));
33
+ return (jsx(GridContext.Provider, { value: providerValue, children: jsx(ThemeProvider, { className: `talxis__gridControl ${styles.root}`, theme: theme, applyTo: 'none', children: jsx(AgGrid, { ...props }) }) }));
34
34
  };
35
35
 
36
36
  export { Grid };
@@ -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 { 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\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 providerValue.gridInstance.destroy();\n }\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 )\n}"],"names":["GridModel","_jsx"],"mappings":";;;;;;;;;;;AAWA,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;AAGU,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;AACR,YAAA,aAAa,CAAC,YAAY,CAAC,OAAO,EAAE,CAAC;AACzC,SAAC,CAAA;KACJ,EAAE,EAAE,CAAC,CAAC;AAEP,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,EAE1B;AACL;;;;"}
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 { 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\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 providerValue.gridInstance.destroy();\n }\n }, []);\n\n return (\n <GridContext.Provider value={providerValue}>\n <ThemeProvider className={`talxis__gridControl ${styles.root}`} theme={theme} applyTo='none'>\n <AgGrid {...props} />\n </ThemeProvider>\n </GridContext.Provider>\n\n )\n}"],"names":["GridModel","_jsx"],"mappings":";;;;;;;;;;;AAWA,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;AAGU,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;AACR,YAAA,aAAa,CAAC,YAAY,CAAC,OAAO,EAAE,CAAC;AACzC,SAAC,CAAA;KACJ,EAAE,EAAE,CAAC,CAAC;AAEP,IAAA,QACIC,GAAC,CAAA,WAAW,CAAC,QAAQ,IAAC,KAAK,EAAE,aAAa,EAAA,QAAA,EACtCA,IAAC,aAAa,EAAA,EAAC,SAAS,EAAE,uBAAuB,MAAM,CAAC,IAAI,CAAA,CAAE,EAAE,KAAK,EAAE,KAAK,EAAE,OAAO,EAAC,MAAM,EACxF,QAAA,EAAAA,GAAA,CAAC,MAAM,EAAK,EAAA,GAAA,KAAK,GAAI,EACT,CAAA,EAAA,CACG,EAE1B;AACL;;;;"}
@@ -1,4 +1,5 @@
1
1
  /// <reference types="react" />
2
2
  import "@ag-grid-community/styles/ag-grid.css";
3
3
  import "@ag-grid-community/styles/ag-theme-balham.css";
4
- export declare const AgGrid: () => JSX.Element;
4
+ import { IGrid } from '../../../interfaces';
5
+ export declare const AgGrid: (props: IGrid) => JSX.Element;
@@ -1,6 +1,6 @@
1
1
  import { jsx, jsxs } from 'react/jsx-runtime';
2
2
  import { AgGridReact } from '@ag-grid-community/react';
3
- import { useTheme, MessageBar, MessageBarType } from '@fluentui/react';
3
+ import { useTheme, mergeStyles, MessageBar, MessageBarType } from '@fluentui/react';
4
4
  import { ModuleRegistry } from '@ag-grid-community/core';
5
5
  import { useRef, useMemo, useState, useEffect } from 'react';
6
6
  import { useGridInstance } from '../../hooks/useGridInstance.js';
@@ -17,34 +17,28 @@ import { ClientSideRowModelModule } from '@ag-grid-community/client-side-row-mod
17
17
  import '@ag-grid-community/styles/ag-grid.css';
18
18
  import '@ag-grid-community/styles/ag-theme-balham.css';
19
19
  import { AgGridContext } from './context.js';
20
- import { CHECKBOX_COLUMN_KEY } from '../../../constants.js';
20
+ import { RowGroupingModule } from '@ag-grid-enterprise/row-grouping';
21
21
 
22
22
  ModuleRegistry.registerModules([ClientSideRowModelModule]);
23
- const AgGrid = () => {
23
+ const AgGrid = (props) => {
24
24
  const grid = useGridInstance();
25
25
  const gridApiRef = useRef();
26
26
  const containerWidthRef = useRef(0);
27
27
  const containerRef = useRef(null);
28
28
  const theme = useTheme();
29
- const styles = useMemo(() => getGridStyles(theme, grid.height), [theme, grid.height]);
29
+ const styles = useMemo(() => getGridStyles(theme), [theme]);
30
30
  const agGridReadyRef = useRef(false);
31
31
  const agGrid = useMemo(() => new AgGrid$1(grid, gridApiRef, theme), []);
32
32
  const agGridProviderValue = useMemo(() => agGrid, []);
33
33
  const { columns } = useGridController();
34
34
  const [agColumns, setAgColumns] = useState([]);
35
35
  const [stateValuesRef, getNewStateValues, setDefaultStateValues] = useStateValues(grid.state);
36
- //this is to prevent AgGrid from throwing errors in some rerender edge cases - https://github.com/ag-gid/ag-grid/issues/6013
37
- const [records] = useDebounce(grid.records, 0);
36
+ const records = grid.records;
37
+ const [debouncedGridHeight] = useDebounce(grid.getHeightSettings().height, 0);
38
38
  const userChangedColumnSizeRef = useRef(false);
39
39
  const rerender = useRerender();
40
40
  const innerRerenderRef = useRef(true);
41
- const debouncedRefresh = useDebouncedCallback(() => {
42
- agGrid.refresh();
43
- }, 0);
44
- const debouncedSetAgColumns = useDebouncedCallback(() => {
45
- innerRerenderRef.current = true;
46
- setAgColumns(agGrid.getColumns());
47
- }, 0);
41
+ const onOverrideComponentProps = props.onOverrideComponentProps ?? ((props) => props);
48
42
  const debounceUpdateVisualSizeFactor = useDebouncedCallback((e) => {
49
43
  if (e.source !== 'uiColumnResized') {
50
44
  return;
@@ -52,7 +46,10 @@ const AgGrid = () => {
52
46
  userChangedColumnSizeRef.current = true;
53
47
  agGrid.updateColumnVisualSizeFactor(e);
54
48
  }, 200);
55
- if (!innerRerenderRef.current) {
49
+ const debouncedRefresh = useDebouncedCallback(() => {
50
+ agGrid.refresh();
51
+ }, 0);
52
+ if (!grid.isUpdateScheduled()) {
56
53
  debouncedRefresh();
57
54
  }
58
55
  const onGridReady = () => {
@@ -77,6 +74,12 @@ const AgGrid = () => {
77
74
  const getCurrentContainerWidth = () => {
78
75
  return containerWidthRef.current ?? containerRef.current?.clientWidth;
79
76
  };
77
+ const onSelectionChanged = useDebouncedCallback((e) => {
78
+ if (e.source.includes('api')) {
79
+ return;
80
+ }
81
+ grid.dataset.setSelectedRecordIds(e.api.getSelectedNodes().map(node => node.data.getRecordId()));
82
+ }, 0);
80
83
  useEffect(() => {
81
84
  agGrid.toggleOverlay();
82
85
  }, [grid.loading]);
@@ -92,58 +95,91 @@ const AgGrid = () => {
92
95
  };
93
96
  }, []);
94
97
  useEffect(() => {
95
- debouncedSetAgColumns();
98
+ const columns = agGrid.getColumns();
99
+ if (columns.length === 0) {
100
+ return;
101
+ }
102
+ setAgColumns(columns);
96
103
  }, [columns]);
97
104
  useEffect(() => {
98
105
  sizeColumnsIfSpaceAvailable();
99
106
  }, [agColumns]);
100
107
  innerRerenderRef.current = false;
101
- return (jsx(AgGridContext.Provider, { value: agGridProviderValue, children: jsxs("div", { ref: containerRef, className: `${styles.root} ag-theme-balham`, children: [grid.isEditable && grid.dataset.isDirty?.() &&
108
+ const componentProps = onOverrideComponentProps({
109
+ container: {
110
+ ref: containerRef,
111
+ className: `${styles.root} ${mergeStyles({
112
+ height: debouncedGridHeight
113
+ })} ag-theme-balham`
114
+ },
115
+ pagingProps: {},
116
+ registerRowGroupingModule: false,
117
+ agGrid: {
118
+ animateRows: false,
119
+ domLayout: grid.getHeightSettings().isAutoHeightEnabled ? 'autoHeight' : undefined,
120
+ rowSelection: grid.selection.type,
121
+ noRowsOverlayComponent: Object.keys(grid.dataset.sortedRecordIds.length === 0) && !grid.loading ? EmptyRecords : undefined,
122
+ loadingOverlayComponent: grid.loading ? LoadingOverlay : undefined,
123
+ suppressDragLeaveHidesColumns: true,
124
+ onColumnResized: (e) => debounceUpdateVisualSizeFactor(e),
125
+ onColumnMoved: (e) => agGrid.updateColumnOrder(e),
126
+ reactiveCustomComponents: true,
127
+ //rowMultiSelectWithClick: true,
128
+ onSelectionChanged: onSelectionChanged,
129
+ gridOptions: {
130
+ getRowStyle: (params) => {
131
+ return {
132
+ backgroundColor: agGrid.getDefaultCellTheme(params.node.childIndex % 2 === 0).semanticColors.bodyBackground
133
+ };
134
+ },
135
+ },
136
+ onCellDoubleClicked: (e) => {
137
+ if (grid.isNavigationEnabled && !grid.isEditable) {
138
+ grid.dataset.openDatasetItem(e.data.getNamedReference());
139
+ }
140
+ },
141
+ getRowId: (params) => params.data.getRecordId(),
142
+ onGridReady: (e) => {
143
+ gridApiRef.current = e.api;
144
+ if (grid.loading) {
145
+ gridApiRef.current?.showLoadingOverlay();
146
+ }
147
+ onGridReady();
148
+ },
149
+ onGridSizeChanged: (e) => {
150
+ containerWidthRef.current = e.clientWidth;
151
+ sizeColumnsIfSpaceAvailable();
152
+ },
153
+ onFirstDataRendered: (e) => {
154
+ sizeColumnsIfSpaceAvailable();
155
+ agGrid.refreshRowSelection();
156
+ },
157
+ onRowDataUpdated: () => {
158
+ agGrid.rerenderGlobalCheckBox();
159
+ },
160
+ onCellEditingStopped: () => {
161
+ grid.pcfContext.factory.requestRender();
162
+ },
163
+ initialState: stateValuesRef.current,
164
+ onStateUpdated: (e) => stateValuesRef.current = {
165
+ ...stateValuesRef.current,
166
+ ...e.state
167
+ },
168
+ columnDefs: agColumns,
169
+ rowData: records,
170
+ getRowHeight: (params) => agGrid.getRowHeight(params.data)
171
+ }
172
+ });
173
+ useMemo(() => {
174
+ if (componentProps.registerRowGroupingModule) {
175
+ ModuleRegistry.register(RowGroupingModule);
176
+ }
177
+ }, []);
178
+ return (jsx(AgGridContext.Provider, { value: agGridProviderValue, children: jsxs("div", { ...componentProps.container, children: [grid.isEditable && grid.dataset.isDirty?.() &&
102
179
  jsx(Save, {}), grid.error &&
103
180
  jsx(MessageBar, { messageBarType: MessageBarType.error, children: jsx("span", { dangerouslySetInnerHTML: {
104
181
  __html: grid.errorMessage
105
- } }) }), jsx(AgGridReact, { animateRows: false, rowSelection: grid.selection.type, noRowsOverlayComponent: Object.keys(grid.dataset.sortedRecordIds.length === 0) && !grid.loading ? EmptyRecords : undefined, loadingOverlayComponent: grid.loading ? LoadingOverlay : undefined, suppressDragLeaveHidesColumns: true, onColumnResized: (e) => debounceUpdateVisualSizeFactor(e), onColumnMoved: (e) => agGrid.updateColumnOrder(e), reactiveCustomComponents: true, onSelectionChanged: (e) => {
106
- if (e.source.includes('api')) {
107
- return;
108
- }
109
- const cell = e.api.getFocusedCell();
110
- if (cell.column.getColId() === CHECKBOX_COLUMN_KEY) {
111
- const node = e.api.getSelectedNodes().find(node => node.rowIndex === cell.rowIndex);
112
- grid.selection.toggle(node.id);
113
- }
114
- else {
115
- grid.dataset.setSelectedRecordIds(e.api.getSelectedNodes().map(node => node.data.getRecordId()));
116
- }
117
- agGrid.refreshRowSelection();
118
- }, gridOptions: {
119
- getRowStyle: (params) => {
120
- const theme = params.rowIndex % 2 === 0 ? agGrid.evenRowCellTheme : agGrid.oddRowCellTheme;
121
- return {
122
- backgroundColor: theme.semanticColors.bodyBackground
123
- };
124
- },
125
- }, onCellDoubleClicked: (e) => {
126
- if (grid.isNavigationEnabled && !grid.isEditable) {
127
- grid.dataset.openDatasetItem(e.data.getNamedReference());
128
- }
129
- }, getRowId: (params) => params.data.getRecordId(), onGridReady: (e) => {
130
- gridApiRef.current = e.api;
131
- if (grid.loading) {
132
- gridApiRef.current?.showLoadingOverlay();
133
- }
134
- onGridReady();
135
- }, onGridSizeChanged: (e) => {
136
- containerWidthRef.current = e.clientWidth;
137
- sizeColumnsIfSpaceAvailable();
138
- }, onFirstDataRendered: (e) => {
139
- sizeColumnsIfSpaceAvailable();
140
- agGrid.refreshRowSelection();
141
- }, onCellEditingStopped: () => {
142
- grid.pcfContext.factory.requestRender();
143
- }, initialState: stateValuesRef.current, onStateUpdated: (e) => stateValuesRef.current = {
144
- ...stateValuesRef.current,
145
- ...e.state
146
- }, columnDefs: agColumns, rowData: records, getRowHeight: (params) => agGrid.getRowHeight(params.data) }), jsx(Paging, {})] }) }));
182
+ } }) }), jsx(AgGridReact, { ...componentProps.agGrid }), jsx(Paging, {})] }) }));
147
183
  };
148
184
 
149
185
  export { AgGrid };
@@ -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 { Checkbox, MessageBar, MessageBarType, useTheme } from \"@fluentui/react\";\nimport { ColDef, ColumnResizedEvent, GridApi, GridState, ModuleRegistry } from \"@ag-grid-community/core\";\nimport { useEffect, useMemo, useRef, useState } from \"react\";\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 { useDebounce, useDebouncedCallback } from 'use-debounce';\nimport { useGridController } from '../../controllers/useGridController';\nimport { useRerender, 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\";\nimport { AgGridContext } from './context';\nimport { CHECKBOX_COLUMN_KEY } from '../../../constants';\nModuleRegistry.registerModules([ClientSideRowModelModule]);\n\nexport const AgGrid = () => {\n const grid = useGridInstance();\n const gridApiRef = useRef<GridApi<ComponentFramework.PropertyHelper.DataSetApi.EntityRecord>>();\n const containerWidthRef = useRef(0);\n const containerRef = useRef<HTMLDivElement>(null);\n const theme = useTheme();\n const styles = useMemo(() => getGridStyles(theme, grid.height), [theme, grid.height]);\n const agGridReadyRef = useRef<boolean>(false);\n const agGrid = useMemo(() => new AgGridModel(grid, gridApiRef, theme), []);\n const agGridProviderValue = useMemo(() => agGrid, []);\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-gid/ag-grid/issues/6013\n const [records] = useDebounce(grid.records, 0);\n const userChangedColumnSizeRef = useRef(false);\n const rerender = useRerender();\n const innerRerenderRef = useRef(true);\n\n const debouncedRefresh = useDebouncedCallback(() => {\n agGrid.refresh();\n }, 0);\n\n const debouncedSetAgColumns = useDebouncedCallback(() => {\n innerRerenderRef.current = true;\n setAgColumns(agGrid.getColumns());\n }, 0);\n\n const debounceUpdateVisualSizeFactor = useDebouncedCallback((e: ColumnResizedEvent<IRecord, any>) => {\n if (e.source !== 'uiColumnResized') {\n return;\n }\n userChangedColumnSizeRef.current = true;\n agGrid.updateColumnVisualSizeFactor(e);\n }, 200);\n\n if (!innerRerenderRef.current) {\n debouncedRefresh();\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 }\n\n const sizeColumnsIfSpaceAvailable = () => {\n //do not autosize if user manually adjusted the column width\n if (!gridApiRef.current || userChangedColumnSizeRef.current) {\n return;\n }\n if (getCurrentContainerWidth() > grid.getTotalVisibleColumnsWidth()) {\n gridApiRef.current!.sizeColumnsToFit();\n }\n }\n\n const getCurrentContainerWidth = (): number => {\n return containerWidthRef.current ?? containerRef.current?.clientWidth\n }\n\n useEffect(() => {\n agGrid.toggleOverlay();\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) => agGrid.copyCellValue(event));\n agGrid.setRerenderCallback(() => {\n innerRerenderRef.current = true;\n rerender();\n });\n return () => {\n grid.pcfContext.mode.setControlState(getNewStateValues());\n }\n }, []);\n\n useEffect(() => {\n debouncedSetAgColumns();\n }, [columns]);\n\n useEffect(() => {\n sizeColumnsIfSpaceAvailable()\n }, [agColumns]);\n\n innerRerenderRef.current = false;\n\n return (\n <AgGridContext.Provider value={agGridProviderValue}>\n <div\n ref={containerRef}\n className={`${styles.root} ag-theme-balham`}\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={false}\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) => debounceUpdateVisualSizeFactor(e)}\n onColumnMoved={(e) => agGrid.updateColumnOrder(e)}\n reactiveCustomComponents\n onSelectionChanged={(e) => {\n if (e.source.includes('api')) {\n return;\n }\n const cell = e.api.getFocusedCell()!;\n if (cell.column.getColId() === CHECKBOX_COLUMN_KEY) {\n const node = e.api.getSelectedNodes().find(node => node.rowIndex === cell.rowIndex);\n grid.selection.toggle(node!.id!);\n }\n else {\n grid.dataset.setSelectedRecordIds(e.api.getSelectedNodes().map(node => node.data!.getRecordId()));\n }\n agGrid.refreshRowSelection();\n }}\n gridOptions={{\n getRowStyle: (params) => {\n const theme = params.rowIndex % 2 === 0 ? agGrid.evenRowCellTheme : agGrid.oddRowCellTheme;\n return {\n backgroundColor: theme.semanticColors.bodyBackground\n }\n },\n }}\n onCellDoubleClicked={(e) => {\n if (grid.isNavigationEnabled && !grid.isEditable) {\n grid.dataset.openDatasetItem(e.data!.getNamedReference())\n }\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 onGridReady();\n }}\n onGridSizeChanged={(e) => {\n containerWidthRef.current = e.clientWidth;\n sizeColumnsIfSpaceAvailable();\n }}\n onFirstDataRendered={(e) => {\n sizeColumnsIfSpaceAvailable();\n agGrid.refreshRowSelection();\n }}\n onCellEditingStopped={() => {\n grid.pcfContext.factory.requestRender();\n }}\n initialState={stateValuesRef.current}\n onStateUpdated={(e) => stateValuesRef.current = {\n ...stateValuesRef.current,\n ...e.state\n }}\n columnDefs={agColumns as any}\n rowData={records}\n getRowHeight={(params) => agGrid.getRowHeight(params.data!)}\n >\n </AgGridReact>\n <Paging />\n </div>\n </AgGridContext.Provider>\n );\n}\n"],"names":["AgGridModel","_jsx","_jsxs"],"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 { mergeStyles, MessageBar, MessageBarType, useTheme } from \"@fluentui/react\";\nimport { ColDef, ColumnResizedEvent, DomLayoutType, GridApi, GridState, ModuleRegistry, SelectionChangedEvent } from \"@ag-grid-community/core\";\nimport { useEffect, useMemo, useRef, useState } from \"react\";\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 { useDebounce, useDebouncedCallback } from 'use-debounce';\nimport { useGridController } from '../../controllers/useGridController';\nimport { useRerender, 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\";\nimport { AgGridContext } from './context';\nimport { IGrid } from '../../../interfaces';\nimport { RowGroupingModule } from '@ag-grid-enterprise/row-grouping';\nModuleRegistry.registerModules([ClientSideRowModelModule]);\n\n\nexport const AgGrid = (props: IGrid) => {\n const grid = useGridInstance();\n const gridApiRef = useRef<GridApi<ComponentFramework.PropertyHelper.DataSetApi.EntityRecord>>();\n const containerWidthRef = useRef(0);\n const containerRef = useRef<HTMLDivElement>(null);\n const theme = useTheme();\n const styles = useMemo(() => getGridStyles(theme), [theme]);\n const agGridReadyRef = useRef<boolean>(false);\n const agGrid = useMemo(() => new AgGridModel(grid, gridApiRef, theme), []);\n const agGridProviderValue = useMemo(() => agGrid, []);\n const { columns } = useGridController();\n const [agColumns, setAgColumns] = useState<ColDef[]>([]);\n const [stateValuesRef, getNewStateValues, setDefaultStateValues] = useStateValues<GridState>(grid.state as GridState);\n const records = grid.records;\n const [debouncedGridHeight] = useDebounce(grid.getHeightSettings().height, 0);\n const userChangedColumnSizeRef = useRef(false);\n const rerender = useRerender();\n const innerRerenderRef = useRef(true);\n const onOverrideComponentProps = props.onOverrideComponentProps ?? ((props) => props);\n\n\n const debounceUpdateVisualSizeFactor = useDebouncedCallback((e: ColumnResizedEvent<IRecord, any>) => {\n if (e.source !== 'uiColumnResized') {\n return;\n }\n userChangedColumnSizeRef.current = true;\n agGrid.updateColumnVisualSizeFactor(e);\n }, 200);\n\n const debouncedRefresh = useDebouncedCallback(() => {\n agGrid.refresh();\n }, 0);\n\n if (!grid.isUpdateScheduled()) {\n debouncedRefresh();\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 }\n\n const sizeColumnsIfSpaceAvailable = () => {\n //do not autosize if user manually adjusted the column width\n if (!gridApiRef.current || userChangedColumnSizeRef.current) {\n return;\n }\n if (getCurrentContainerWidth() > grid.getTotalVisibleColumnsWidth()) {\n gridApiRef.current!.sizeColumnsToFit();\n }\n }\n\n const getCurrentContainerWidth = (): number => {\n return containerWidthRef.current ?? containerRef.current?.clientWidth\n }\n\n const onSelectionChanged = useDebouncedCallback((e: SelectionChangedEvent<any, any>) => {\n if (e.source.includes('api')) {\n return;\n }\n grid.dataset.setSelectedRecordIds(e.api.getSelectedNodes().map(node => node.data!.getRecordId()));\n }, 0);\n \n useEffect(() => {\n agGrid.toggleOverlay();\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) => agGrid.copyCellValue(event));\n\n agGrid.setRerenderCallback(() => {\n innerRerenderRef.current = true;\n rerender();\n });\n return () => {\n grid.pcfContext.mode.setControlState(getNewStateValues());\n }\n }, []);\n\n useEffect(() => {\n const columns = agGrid.getColumns();\n if(columns.length === 0) {\n return;\n }\n setAgColumns(columns)\n }, [columns]);\n\n useEffect(() => {\n sizeColumnsIfSpaceAvailable()\n }, [agColumns]);\n\n innerRerenderRef.current = false;\n\n const componentProps = onOverrideComponentProps({\n container: {\n ref: containerRef,\n className: `${styles.root} ${mergeStyles({\n height: debouncedGridHeight\n })} ag-theme-balham`\n },\n pagingProps: {},\n registerRowGroupingModule: false,\n agGrid: {\n animateRows: false,\n domLayout: grid.getHeightSettings().isAutoHeightEnabled ? 'autoHeight' : undefined,\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: true,\n onColumnResized: (e) => debounceUpdateVisualSizeFactor(e),\n onColumnMoved: (e) => agGrid.updateColumnOrder(e),\n reactiveCustomComponents: true,\n //rowMultiSelectWithClick: true,\n onSelectionChanged: onSelectionChanged,\n gridOptions: {\n getRowStyle: (params) => {\n return {\n backgroundColor: agGrid.getDefaultCellTheme(params.node.childIndex % 2 === 0).semanticColors.bodyBackground\n }\n },\n },\n onCellDoubleClicked: (e) => {\n if (grid.isNavigationEnabled && !grid.isEditable) {\n grid.dataset.openDatasetItem(e.data!.getNamedReference())\n }\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 onGridReady();\n },\n onGridSizeChanged: (e) => {\n containerWidthRef.current = e.clientWidth;\n sizeColumnsIfSpaceAvailable();\n },\n onFirstDataRendered: (e) => {\n sizeColumnsIfSpaceAvailable();\n agGrid.refreshRowSelection();\n },\n onRowDataUpdated: () => {\n agGrid.rerenderGlobalCheckBox();\n },\n onCellEditingStopped: () => {\n grid.pcfContext.factory.requestRender();\n },\n initialState: stateValuesRef.current,\n onStateUpdated: (e) => stateValuesRef.current = {\n ...stateValuesRef.current,\n ...e.state\n },\n columnDefs: agColumns as any,\n rowData: records,\n getRowHeight: (params) => agGrid.getRowHeight(params.data!)\n }\n });\n\n useMemo(() => {\n if(componentProps.registerRowGroupingModule) {\n ModuleRegistry.register(RowGroupingModule);\n }\n }, []);\n\n return (\n <AgGridContext.Provider value={agGridProviderValue}>\n <div {...componentProps.container}>\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 {...componentProps.agGrid}>\n </AgGridReact>\n <Paging />\n </div>\n </AgGridContext.Provider>\n );\n}\n"],"names":["AgGridModel","_jsx","_jsxs"],"mappings":"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"}
@@ -33,14 +33,16 @@ export declare class AgGrid extends GridDependency {
33
33
  getColumns(): ColDef<any, any>[];
34
34
  refresh(): void;
35
35
  setGlobalCheckBoxRenderer(renderer: () => void): void;
36
+ rerenderGlobalCheckBox(): void;
36
37
  updateColumnOrder(e: ColumnMovedEvent<IRecord, any>): void;
37
38
  updateColumnVisualSizeFactor(e: ColumnResizedEvent<IRecord, any>): void;
38
39
  toggleOverlay(): void;
39
40
  copyCellValue(event: KeyboardEvent): void;
40
- getRowHeight(record: IRecord): number;
41
+ getRowHeight(record?: IRecord): number;
41
42
  getTotalColumnsWidth(): number;
42
43
  refreshRowSelection(): void;
43
44
  getCellFormatting(params: CellClassParams<IRecord, any>): Required<ICustomColumnFormatting>;
45
+ getDefaultCellTheme(isEven: boolean): ITheme;
44
46
  setRerenderCallback(callback: () => void): void;
45
47
  rerender(): void;
46
48
  private get _gridApi();