@talxis/base-controls 1.2503.8 → 1.2503.10

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.
@@ -30,8 +30,13 @@ const DatasetControl = (props) => {
30
30
  },
31
31
  containerProps: {
32
32
  theme: theme,
33
- className: styles.root
34
- }
33
+ className: styles.root,
34
+ },
35
+ headerProps: {
36
+ className: styles.header,
37
+ onRender: (renderQuickFind) => renderQuickFind(),
38
+ onGetQuickFindProps: (props) => props
39
+ },
35
40
  });
36
41
  const renderErrorMessageBar = (onReset) => {
37
42
  jsx(MessageBar, { isMultiline: false, actions: jsx(MessageBarButton, { className: styles.messageBarBtn, text: labels.reload(), onClick: () => {
@@ -46,8 +51,9 @@ const DatasetControl = (props) => {
46
51
  useMemo(() => {
47
52
  componentProps.onDatasetInit();
48
53
  }, []);
49
- return (jsxs(ThemeProvider, { ...componentProps.containerProps, children: [props.parameters.EnableQuickFind?.raw &&
50
- jsx(QuickFind, { dataset: dataset, labels: labels }), jsx(ErrorBoundary, { fallback: (resetError) => { renderErrorMessageBar(() => resetError()); }, children: jsx(Grid, { ...props, context: injectedContextRef.current }) })] }));
54
+ return (jsxs(ThemeProvider, { ...componentProps.containerProps, children: [jsx("div", { ...componentProps.headerProps, children: componentProps.headerProps.onRender(() => {
55
+ return jsx(QuickFind, { dataset: dataset, labels: labels, onGetQuickFindComponentProps: (props) => componentProps.headerProps.onGetQuickFindProps(props) });
56
+ }) }), jsx(ErrorBoundary, { fallback: (resetError) => { renderErrorMessageBar(() => resetError()); }, children: jsx(Grid, { ...props, onOverrideComponentProps: (props) => props, context: injectedContextRef.current }) })] }));
51
57
  };
52
58
 
53
59
  export { DatasetControl };
@@ -1 +1 @@
1
- {"version":3,"file":"DatasetControl.js","sources":["../../../src/components/DatasetControl/DatasetControl.tsx"],"sourcesContent":["import { useEffect, useMemo, useRef, useState } 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.root\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 {props.parameters.EnableQuickFind?.raw &&\n <QuickFind dataset={dataset} labels={labels} />\n }\n {/* {dataset.error && renderErrorMessageBar()} */}\n <ErrorBoundary fallback={(resetError: () => void) => { renderErrorMessageBar(() => resetError()) }}>\n <Grid\n {...props}\n context={injectedContextRef.current} />\n </ErrorBoundary>\n </ThemeProvider>\n )\n}"],"names":["_jsx","_jsxs"],"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,IAAI;AACvB,SAAA;AACF,KAAA,CAAC,CAAC;AAEH,IAAA,MAAM,qBAAqB,GAAG,CAAC,OAAoB,KAAI;QACrDA,GAAC,CAAA,UAAU,EACT,EAAA,WAAW,EAAE,KAAK,EAClB,OAAO,EAAEA,GAAA,CAAC,gBAAgB,EAAA,EAAC,SAAS,EAAE,MAAM,CAAC,aAAa,EAAE,IAAI,EAAE,MAAM,CAAC,MAAM,EAAE,EAAE,OAAO,EAAE,MAAK;oBAC/F,OAAO,IAAI,CAAC;oBACZ,OAAO,CAAC,OAAO,EAAE,CAAC;AACpB,iBAAC,GAAI,EACL,cAAc,EAAE,cAAc,CAAC,KAAK,EAAA,QAAA,EACnC,OAAO,CAAC,YAAY,IAAI,MAAM,CAAC,YAAY,EAAE,GACnC,CAAA;AACf,KAAC,CAAA;IAED,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;AAGP,IAAA,QACEC,IAAA,CAAC,aAAa,EAAA,EAAA,GAAK,cAAc,CAAC,cAAc,EAC7C,QAAA,EAAA,CAAA,KAAK,CAAC,UAAU,CAAC,eAAe,EAAE,GAAG;gBACpCD,GAAC,CAAA,SAAS,IAAC,OAAO,EAAE,OAAO,EAAE,MAAM,EAAE,MAAM,EAAA,CAAI,EAGjDA,GAAC,CAAA,aAAa,IAAC,QAAQ,EAAE,CAAC,UAAsB,KAAI,EAAG,qBAAqB,CAAC,MAAM,UAAU,EAAE,CAAC,CAAA,EAAE,EAChG,QAAA,EAAAA,GAAA,CAAC,IAAI,EAAA,EAAA,GACC,KAAK,EACT,OAAO,EAAE,kBAAkB,CAAC,OAAO,EAAI,CAAA,EAAA,CAC3B,CACF,EAAA,CAAA,EACjB;AACH;;;;"}
1
+ {"version":3,"file":"DatasetControl.js","sources":["../../../src/components/DatasetControl/DatasetControl.tsx"],"sourcesContent":["import { useEffect, useMemo, useRef, useState } 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 { IQuickFindProps, 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.root,\n },\n headerProps: {\n className: styles.header,\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}>\n {componentProps.headerProps.onRender(() => {\n return <QuickFind dataset={dataset} labels={labels} onGetQuickFindComponentProps={(props) => componentProps.headerProps.onGetQuickFindProps(props)} />\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,10 +1,11 @@
1
1
  /// <reference types="react" />
2
2
  import { IDataset } from "@talxis/client-libraries";
3
+ import { ITextFieldProps } from "@talxis/react-components";
3
4
  import { datasetControlTranslations } from "../translations";
4
5
  import { ITranslation } from "../../../hooks";
5
- interface IQuickFindProps {
6
+ export interface IQuickFindProps {
6
7
  labels: ITranslation<typeof datasetControlTranslations>;
7
8
  dataset: IDataset;
9
+ onGetQuickFindComponentProps: (props: ITextFieldProps) => ITextFieldProps;
8
10
  }
9
11
  export declare const QuickFind: (props: IQuickFindProps) => JSX.Element;
10
- export {};
@@ -5,14 +5,16 @@ import { useState, useEffect } from 'react';
5
5
  const QuickFind = (props) => {
6
6
  const { dataset, labels } = { ...props };
7
7
  const [query, setQuery] = useState('');
8
- const onSearch = (query) => {
9
- dataset.setSearchQuery?.(query ?? "");
10
- dataset.refresh();
11
- };
12
- useEffect(() => {
13
- setQuery(dataset.getSearchQuery?.() ?? '');
14
- }, [dataset.getSearchQuery?.()]);
15
- return jsx(TextField, { value: query, placeholder: `${labels.search()} ${dataset.getMetadata()?.DisplayCollectionName ?? labels.records()}...`, deleteButtonProps: query ? {
8
+ const componentProps = props.onGetQuickFindComponentProps({
9
+ value: query,
10
+ placeholder: `${labels.search()} ${dataset.getMetadata()?.DisplayCollectionName ?? labels.records()}...`,
11
+ onChange: (e, newValue) => setQuery(newValue ?? ''),
12
+ onKeyUp: (e) => {
13
+ if (e.key === 'Enter') {
14
+ onSearch(query);
15
+ }
16
+ },
17
+ deleteButtonProps: query ? {
16
18
  key: 'delete',
17
19
  iconProps: {
18
20
  iconName: 'Cancel'
@@ -21,17 +23,23 @@ const QuickFind = (props) => {
21
23
  setQuery("");
22
24
  onSearch(undefined);
23
25
  }
24
- } : undefined, suffixItems: [{
26
+ } : undefined,
27
+ suffixItems: [{
25
28
  key: 'search',
26
29
  iconProps: {
27
30
  iconName: 'Search'
28
31
  },
29
32
  onClick: () => onSearch(query)
30
- }], onKeyUp: (e) => {
31
- if (e.key === 'Enter') {
32
- onSearch(query);
33
- }
34
- }, onChange: (e, newValue) => setQuery(newValue ?? '') });
33
+ }]
34
+ });
35
+ const onSearch = (query) => {
36
+ dataset.setSearchQuery?.(query ?? "");
37
+ dataset.refresh();
38
+ };
39
+ useEffect(() => {
40
+ setQuery(dataset.getSearchQuery?.() ?? '');
41
+ }, [dataset.getSearchQuery?.()]);
42
+ return jsx(TextField, { ...componentProps });
35
43
  };
36
44
 
37
45
  export { QuickFind };
@@ -1 +1 @@
1
- {"version":3,"file":"QuickFind.js","sources":["../../../../src/components/DatasetControl/QuickFind/QuickFind.tsx"],"sourcesContent":["import { IDataset } from \"@talxis/client-libraries\";\nimport { TextField } from \"@talxis/react-components\";\nimport { datasetControlTranslations } from \"../translations\";\nimport { ITranslation } from \"../../../hooks\";\nimport { useEffect, useState } from \"react\";\n\ninterface IQuickFindProps {\n labels: ITranslation<typeof datasetControlTranslations>\n dataset: IDataset;\n}\n\nexport const QuickFind = (props: IQuickFindProps) => {\n const {dataset, labels} = {...props};\n const [query, setQuery] = useState<string>('');\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\n return <TextField\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}"],"names":["_jsx"],"mappings":";;;;AAWa,MAAA,SAAS,GAAG,CAAC,KAAsB,KAAI;IAChD,MAAM,EAAC,OAAO,EAAE,MAAM,EAAC,GAAG,EAAC,GAAG,KAAK,EAAC,CAAC;IACrC,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAAS,EAAE,CAAC,CAAC;AAE/C,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,SAAS,EACjB,EAAA,KAAK,EAAE,KAAK,EACZ,WAAW,EAAE,CAAG,EAAA,MAAM,CAAC,MAAM,EAAE,CAAI,CAAA,EAAA,OAAO,CAAC,WAAW,EAAE,EAAE,qBAAqB,IAAI,MAAM,CAAC,OAAO,EAAE,CAAA,GAAA,CAAK,EACxG,iBAAiB,EAAE,KAAK,GAAG;AACvB,YAAA,GAAG,EAAE,QAAQ;AACb,YAAA,SAAS,EAAE;AACP,gBAAA,QAAQ,EAAE,QAAQ;AACrB,aAAA;YACD,OAAO,EAAE,MAAK;gBACV,QAAQ,CAAC,EAAE,CAAC,CAAC;gBACb,QAAQ,CAAC,SAAS,CAAC,CAAC;aACvB;AACJ,SAAA,GAAG,SAAS,EACb,WAAW,EAAE,CAAC;AACV,gBAAA,GAAG,EAAE,QAAQ;AACb,gBAAA,SAAS,EAAE;AACP,oBAAA,QAAQ,EAAE,QAAQ;AACrB,iBAAA;AACD,gBAAA,OAAO,EAAE,MAAM,QAAQ,CAAC,KAAK,CAAC;AACjC,aAAA,CAAC,EACF,OAAO,EAAE,CAAC,CAAC,KAAI;AACX,YAAA,IAAI,CAAC,CAAC,GAAG,KAAK,OAAO,EAAE;gBACnB,QAAQ,CAAC,KAAK,CAAC,CAAC;AACnB,aAAA;AACL,SAAC,EACD,QAAQ,EAAE,CAAC,CAAC,EAAE,QAAQ,KAAK,QAAQ,CAAC,QAAQ,IAAI,EAAE,CAAC,GAAI,CAAA;AAC3D;;;;"}
1
+ {"version":3,"file":"QuickFind.js","sources":["../../../../src/components/DatasetControl/QuickFind/QuickFind.tsx"],"sourcesContent":["import { IDataset } from \"@talxis/client-libraries\";\nimport { ITextFieldProps, TextField } from \"@talxis/react-components\";\nimport { datasetControlTranslations } from \"../translations\";\nimport { ITranslation } from \"../../../hooks\";\nimport { useEffect, useState } from \"react\";\n\nexport interface IQuickFindProps {\n labels: ITranslation<typeof datasetControlTranslations>\n dataset: IDataset;\n onGetQuickFindComponentProps: (props: ITextFieldProps) => ITextFieldProps\n}\n\nexport const QuickFind = (props: IQuickFindProps) => {\n const {dataset, labels} = {...props};\n const [query, setQuery] = useState<string>('');\n\n const componentProps = props.onGetQuickFindComponentProps({\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\n return <TextField {...componentProps} />\n}"],"names":["_jsx"],"mappings":";;;;AAYa,MAAA,SAAS,GAAG,CAAC,KAAsB,KAAI;IAChD,MAAM,EAAC,OAAO,EAAE,MAAM,EAAC,GAAG,EAAC,GAAG,KAAK,EAAC,CAAC;IACrC,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAAS,EAAE,CAAC,CAAC;AAE/C,IAAA,MAAM,cAAc,GAAG,KAAK,CAAC,4BAA4B,CAAC;AACtD,QAAA,KAAK,EAAE,KAAK;AACZ,QAAA,WAAW,EAAE,CAAG,EAAA,MAAM,CAAC,MAAM,EAAE,IAAI,OAAO,CAAC,WAAW,EAAE,EAAE,qBAAqB,IAAI,MAAM,CAAC,OAAO,EAAE,CAAK,GAAA,CAAA;AACxG,QAAA,QAAQ,EAAE,CAAC,CAAC,EAAE,QAAQ,KAAK,QAAQ,CAAC,QAAQ,IAAI,EAAE,CAAC;AACnD,QAAA,OAAO,EAAE,CAAC,CAAC,KAAI;AACX,YAAA,IAAI,CAAC,CAAC,GAAG,KAAK,OAAO,EAAE;gBACnB,QAAQ,CAAC,KAAK,CAAC,CAAC;AACnB,aAAA;SACJ;AACD,QAAA,iBAAiB,EAAE,KAAK,GAAG;AACvB,YAAA,GAAG,EAAE,QAAQ;AACb,YAAA,SAAS,EAAE;AACP,gBAAA,QAAQ,EAAE,QAAQ;AACrB,aAAA;YACD,OAAO,EAAE,MAAK;gBACV,QAAQ,CAAC,EAAE,CAAC,CAAC;gBACb,QAAQ,CAAC,SAAS,CAAC,CAAC;aACvB;SACJ,GAAG,SAAS;AACb,QAAA,WAAW,EAAE,CAAC;AACV,gBAAA,GAAG,EAAE,QAAQ;AACb,gBAAA,SAAS,EAAE;AACP,oBAAA,QAAQ,EAAE,QAAQ;AACrB,iBAAA;AACD,gBAAA,OAAO,EAAE,MAAM,QAAQ,CAAC,KAAK,CAAC;aACjC,CAAC;AACL,KAAA,CAAC,CAAC;AAEH,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,SAAS,EAAK,EAAA,GAAA,cAAc,GAAI,CAAA;AAC5C;;;;"}
@@ -1,12 +1,19 @@
1
+ /// <reference types="react" />
1
2
  import { ThemeProviderProps } from "@fluentui/react";
2
3
  import { ITranslation } from "../../hooks";
3
4
  import { IControl, ITwoOptionsProperty } from "../../interfaces";
4
5
  import { IGridOutputs, IGridParameters } from "../Grid";
5
6
  import { gridTranslations } from "../Grid/translations";
6
7
  import { datasetControlTranslations } from "./translations";
7
- export interface IDatasetControl extends IControl<IGridParameters, IGridOutputs, Partial<ITranslation<typeof datasetControlTranslations & typeof gridTranslations>>, any & {
8
+ import { ITextFieldProps } from "@talxis/react-components";
9
+ export interface IDatasetControlComponentProps {
8
10
  onDatasetInit: () => void;
9
11
  containerProps: ThemeProviderProps;
10
- }> {
12
+ headerProps: React.HTMLAttributes<HTMLDivElement> & {
13
+ onRender: (renderQuickFind: () => React.ReactElement) => React.ReactElement;
14
+ onGetQuickFindProps: (props: ITextFieldProps) => ITextFieldProps;
15
+ };
16
+ }
17
+ export interface IDatasetControl extends IControl<IGridParameters, IGridOutputs, Partial<ITranslation<typeof datasetControlTranslations & typeof gridTranslations>>, IDatasetControlComponentProps> {
11
18
  EnableQuickFind?: Omit<ITwoOptionsProperty, 'attributes'>;
12
19
  }
@@ -10,6 +10,7 @@ import dayjs from 'dayjs';
10
10
 
11
11
  const DateTime = (componentProps) => {
12
12
  const ref = useRef(null);
13
+ const onOverrideComponentProps = componentProps.onOverrideComponentProps ?? ((props) => props);
13
14
  const datePickerRef = useRef(null);
14
15
  const context = componentProps.context;
15
16
  const parameters = componentProps.parameters;
@@ -39,88 +40,102 @@ const DateTime = (componentProps) => {
39
40
  element.children[0].disabled = true;
40
41
  }
41
42
  };
42
- return (jsx(ThemeProvider, { theme: theme, applyTo: "none", ref: ref, children: jsx(DatePicker, { className: styles.datePicker, componentRef: datePickerRef, hideErrorMessage: !parameters.ShowErrorMessage?.raw, keepCalendarOpenAfterDaySelect: isDateTime, readOnly: context.mode.isControlDisabled,
43
- //@ts-ignore - this is a hack to close the calendar when dates get selected on date only fields
44
- onSelectDate: isDateTime ? undefined : (newDate) => date.set(newDate),
45
- //disable so the user cannot input restricted Dates
46
- allowTextInput: !parameters.RestrictedDates?.raw && !parameters.RestrictedDaysOfWeek?.raw,
47
- // Lowest date supported by CDS: https://learn.microsoft.com/en-us/previous-versions/dynamicscrm-2016/developers-guide/dn996866(v=crm.8)?redirectedfrom=MSDN
48
- minDate: new Date('1753-01-01T00:00:00.000Z'), firstDayOfWeek: componentProps.context.userSettings.dateFormattingInfo.firstDayOfWeek, deleteButtonProps: parameters.EnableDeleteButton?.raw === true ? {
49
- key: 'Delete',
50
- showOnlyOnHover: true,
51
- iconProps: {
52
- iconName: 'Cancel'
43
+ const datePickerProps = onOverrideComponentProps({
44
+ className: styles.datePicker,
45
+ componentRef: datePickerRef,
46
+ hideErrorMessage: !parameters.ShowErrorMessage?.raw,
47
+ keepCalendarOpenAfterDaySelect: isDateTime,
48
+ readOnly: context.mode.isControlDisabled,
49
+ //@ts-ignore - this is a hack to close the calendar when dates get selected on date only fields
50
+ onSelectDate: isDateTime ? undefined : (newDate) => date.set(newDate),
51
+ //disable so the user cannot input restricted Dates
52
+ allowTextInput: !parameters.RestrictedDates?.raw && !parameters.RestrictedDaysOfWeek?.raw,
53
+ // Lowest date supported by CDS: https://learn.microsoft.com/en-us/previous-versions/dynamicscrm-2016/developers-guide/dn996866(v=crm.8)?redirectedfrom=MSDN
54
+ minDate: new Date('1753-01-01T00:00:00.000Z'),
55
+ firstDayOfWeek: componentProps.context.userSettings.dateFormattingInfo.firstDayOfWeek,
56
+ deleteButtonProps: parameters.EnableDeleteButton?.raw === true ? {
57
+ key: 'Delete',
58
+ showOnlyOnHover: true,
59
+ iconProps: {
60
+ iconName: 'Cancel'
61
+ },
62
+ onClick: () => date.clear()
63
+ } : undefined,
64
+ clickToCopyProps: parameters.EnableCopyButton?.raw === true ? {
65
+ key: 'copy',
66
+ showOnlyOnHover: true,
67
+ iconProps: {
68
+ iconName: 'Copy'
69
+ }
70
+ } : undefined,
71
+ calendarAs: (props) => {
72
+ const calendarProps = {
73
+ ...props,
74
+ isMonthPickerVisible: parameters.EnableMonthPicker?.raw !== false,
75
+ isDayPickerVisible: parameters.EnableDayPicker?.raw !== false,
76
+ calendarDayProps: {
77
+ restrictedDates: getRestrictedDates(),
78
+ customDayCellRef: onOverrideDayCellProps
53
79
  },
54
- onClick: () => date.clear()
55
- } : undefined, clickToCopyProps: parameters.EnableCopyButton?.raw === true ? {
56
- key: 'copy',
57
- showOnlyOnHover: true,
58
- iconProps: {
59
- iconName: 'Copy'
60
- }
61
- } : undefined, calendarAs: (props) => {
62
- const calendarProps = {
63
- ...props,
64
- isMonthPickerVisible: parameters.EnableMonthPicker?.raw !== false,
65
- isDayPickerVisible: parameters.EnableDayPicker?.raw !== false,
66
- calendarDayProps: {
67
- restrictedDates: getRestrictedDates(),
68
- customDayCellRef: onOverrideDayCellProps
80
+ value: date.get(),
81
+ strings: {
82
+ goToToday: labels.goToToday(),
83
+ days: JSON.parse(labels.days()),
84
+ months: JSON.parse(labels.months()),
85
+ shortDays: JSON.parse(labels.shortDays()),
86
+ shortMonths: JSON.parse(labels.shortMonths())
87
+ },
88
+ timePickerProps: {
89
+ dateTimeFormat: patterns.fullDateTimePattern,
90
+ autoComplete: "off",
91
+ autoCapitalize: "off",
92
+ timeFormat: patterns.shortTimePattern,
93
+ label: labels.time(),
94
+ visible: isDateTime,
95
+ errorMessage: labels.invalidTimeInput(),
96
+ lastInputedTimeString: lastInputedTimeString.current,
97
+ useHour12: patterns.shortTimePattern.endsWith('A'),
98
+ onChange: (time) => {
99
+ date.set(undefined, time);
100
+ lastInputedTimeString.current = time;
69
101
  },
70
102
  value: date.get(),
103
+ formattedDateTime: date.getFormatted() ?? "",
71
104
  strings: {
72
- goToToday: labels.goToToday(),
73
- days: JSON.parse(labels.days()),
74
- months: JSON.parse(labels.months()),
75
- shortDays: JSON.parse(labels.shortDays()),
76
- shortMonths: JSON.parse(labels.shortMonths())
77
- },
78
- timePickerProps: {
79
- dateTimeFormat: patterns.fullDateTimePattern,
80
- autoComplete: "off",
81
- autoCapitalize: "off",
82
- timeFormat: patterns.shortTimePattern,
83
- label: labels.time(),
84
- visible: isDateTime,
85
- errorMessage: labels.invalidTimeInput(),
86
- lastInputedTimeString: lastInputedTimeString.current,
87
- useHour12: patterns.shortTimePattern.endsWith('A'),
88
- onChange: (time) => {
89
- date.set(undefined, time);
90
- lastInputedTimeString.current = time;
91
- },
92
- value: date.get(),
93
- formattedDateTime: date.getFormatted() ?? "",
94
- strings: {
95
- invalidInputErrorMessage: labels.invalidTimeInput()
96
- }
97
- },
98
- theme: componentProps.context.fluentDesignLanguage?.applicationTheme ?? theme
99
- };
100
- if (isDateTime) {
101
- calendarProps.onSelectDate = (newDate) => date.set(newDate);
102
- }
103
- return jsx(Calendar, { ...calendarProps });
104
- }, errorMessage: parameters.value.errorMessage, textField: {
105
- value: date.getFormatted() ?? "",
106
- onChange: (e, value) => {
107
- if (isDateTime) {
108
- const datePart = dayjs(value, patterns.shortDatePattern).format(patterns.shortDatePattern);
109
- const time = value?.split(datePart).pop()?.substring(1);
110
- lastInputedTimeString.current = time;
105
+ invalidInputErrorMessage: labels.invalidTimeInput()
111
106
  }
112
- date.setDateString(value);
113
107
  },
114
- placeholder: '---',
115
- onNotifyValidationResult: () => null,
116
- noValidate: true,
117
- styles: {
118
- fieldGroup: {
119
- height: height,
120
- width: width
121
- }
108
+ theme: componentProps.context.fluentDesignLanguage?.applicationTheme ?? theme
109
+ };
110
+ if (isDateTime) {
111
+ calendarProps.onSelectDate = (newDate) => date.set(newDate);
112
+ }
113
+ return jsx(Calendar, { ...calendarProps });
114
+ },
115
+ errorMessage: parameters.value.errorMessage,
116
+ textField: {
117
+ value: date.getFormatted() ?? "",
118
+ onChange: (e, value) => {
119
+ if (isDateTime) {
120
+ const datePart = dayjs(value, patterns.shortDatePattern).format(patterns.shortDatePattern);
121
+ const time = value?.split(datePart).pop()?.substring(1);
122
+ lastInputedTimeString.current = time;
123
+ }
124
+ date.setDateString(value);
125
+ },
126
+ placeholder: '---',
127
+ onNotifyValidationResult: () => null,
128
+ noValidate: true,
129
+ styles: {
130
+ fieldGroup: {
131
+ height: height,
132
+ width: width
122
133
  }
123
- }, value: date.get() ?? undefined }) }));
134
+ }
135
+ },
136
+ value: date.get() ?? undefined
137
+ });
138
+ return (jsx(ThemeProvider, { theme: theme, applyTo: "none", ref: ref, children: jsx(DatePicker, { ...datePickerProps }) }));
124
139
  };
125
140
 
126
141
  export { DateTime };
@@ -1 +1 @@
1
- {"version":3,"file":"DateTime.js","sources":["../../../src/components/DateTime/DateTime.tsx"],"sourcesContent":["\nimport { IDateTime } from \"./interfaces\";\nimport { ICalendarDayGridStyles, IDatePicker, IProcessedStyleSet, ThemeProvider } from \"@fluentui/react\";\nimport { useEffect, useRef } from \"react\";\nimport { getDateTimeStyles } from \"./styles\";\nimport { useDateTime } from \"./hooks/useDateTime\";\nimport { Calendar, IInternalCalendarProps } from \"./components/Calendar\";\nimport { DatePicker } from \"@talxis/react-components\";\nimport { useControlSizing } from \"../../hooks/useControlSizing\";\nimport dayjs from \"dayjs\";\n\nexport const DateTime = (componentProps: IDateTime) => {\n const ref = useRef<HTMLDivElement>(null);\n const datePickerRef = useRef<IDatePicker>(null);\n const context = componentProps.context;\n const parameters = componentProps.parameters;\n const [isDateTime, theme, labels, date, patterns] = useDateTime(componentProps, ref);\n const styles = getDateTimeStyles(theme);\n const { height, width } = useControlSizing(componentProps.context.mode);\n const lastInputedTimeString = useRef<string>();\n\n useEffect(() => {\n if (componentProps.parameters.AutoFocus?.raw === true) {\n datePickerRef.current?.showDatePickerPopup();\n }\n }, []);\n\n const getRestrictedDates = (): Date[] | undefined => {\n if(!parameters.RestrictedDates?.raw) {\n return undefined;\n }\n return JSON.parse(parameters.RestrictedDates?.raw).map((x: string) => new Date(x))\n }\n const onOverrideDayCellProps = (element: HTMLElement, date: Date, classNames: IProcessedStyleSet<ICalendarDayGridStyles>) => {\n if(!element || !parameters.RestrictedDaysOfWeek?.raw) {\n return;\n }\n const weekDaysToExclude: number[] = JSON.parse(parameters.RestrictedDaysOfWeek.raw);\n if(weekDaysToExclude.includes(date.getDay())) {\n element.setAttribute('data-is-focusable', 'false');\n element.classList?.add(classNames.dayOutsideBounds!);\n (element.children[0] as HTMLButtonElement).disabled = true;\n }\n }\n\n return (\n <ThemeProvider theme={theme} applyTo=\"none\" ref={ref}>\n <DatePicker\n className={styles.datePicker}\n componentRef={datePickerRef}\n hideErrorMessage={!parameters.ShowErrorMessage?.raw}\n keepCalendarOpenAfterDaySelect={isDateTime}\n readOnly={context.mode.isControlDisabled}\n //@ts-ignore - this is a hack to close the calendar when dates get selected on date only fields\n onSelectDate={isDateTime ? undefined : (newDate) => date.set(newDate!)}\n //disable so the user cannot input restricted Dates\n allowTextInput={!parameters.RestrictedDates?.raw && !parameters.RestrictedDaysOfWeek?.raw}\n // Lowest date supported by CDS: https://learn.microsoft.com/en-us/previous-versions/dynamicscrm-2016/developers-guide/dn996866(v=crm.8)?redirectedfrom=MSDN\n minDate={new Date('1753-01-01T00:00:00.000Z')}\n firstDayOfWeek={componentProps.context.userSettings.dateFormattingInfo.firstDayOfWeek}\n deleteButtonProps={parameters.EnableDeleteButton?.raw === true ? {\n key: 'Delete',\n showOnlyOnHover: true,\n iconProps: {\n iconName: 'Cancel'\n },\n onClick: () => date.clear()\n } : undefined}\n clickToCopyProps={ parameters.EnableCopyButton?.raw === true ? {\n key: 'copy',\n showOnlyOnHover: true,\n iconProps: {\n iconName: 'Copy'\n }\n } : undefined}\n calendarAs={(props) =>\n {\n const calendarProps: IInternalCalendarProps = {\n ...props,\n isMonthPickerVisible: parameters.EnableMonthPicker?.raw !== false,\n isDayPickerVisible: parameters.EnableDayPicker?.raw !== false,\n calendarDayProps: {\n restrictedDates: getRestrictedDates(),\n customDayCellRef: onOverrideDayCellProps\n },\n value: date.get(),\n strings: {\n goToToday: labels.goToToday(),\n days: JSON.parse(labels.days()),\n months: JSON.parse(labels.months()),\n shortDays: JSON.parse(labels.shortDays()),\n shortMonths: JSON.parse(labels.shortMonths())\n },\n timePickerProps: {\n dateTimeFormat: patterns.fullDateTimePattern,\n autoComplete: \"off\",\n autoCapitalize: \"off\",\n timeFormat: patterns.shortTimePattern,\n label: labels.time(),\n visible: isDateTime,\n errorMessage: labels.invalidTimeInput(),\n lastInputedTimeString: lastInputedTimeString.current,\n useHour12: patterns.shortTimePattern.endsWith('A'),\n onChange: (time?: string) => {\n date.set(undefined, time);\n lastInputedTimeString.current = time;\n },\n value: date.get(),\n formattedDateTime: date.getFormatted() ?? \"\",\n strings: {\n invalidInputErrorMessage: labels.invalidTimeInput()\n }\n },\n theme: componentProps.context.fluentDesignLanguage?.applicationTheme ?? theme\n };\n if(isDateTime) {\n calendarProps.onSelectDate = (newDate) => date.set(newDate)\n }\n return <Calendar {...calendarProps} />\n }\n }\n errorMessage={parameters.value.errorMessage}\n textField={{\n value: date.getFormatted() ?? \"\",\n onChange: (e, value) => {\n if(isDateTime) {\n const datePart = dayjs(value, patterns.shortDatePattern).format(patterns.shortDatePattern);\n const time = value?.split(datePart).pop()?.substring(1);\n lastInputedTimeString.current = time;\n }\n date.setDateString(value)\n },\n placeholder: '---',\n onNotifyValidationResult: () => null,\n noValidate: true,\n styles: {\n fieldGroup: {\n height: height,\n width: width\n }\n }\n }\n }\n value={date.get() ?? undefined}\n />\n </ThemeProvider>\n );\n};\n\n"],"names":["_jsx"],"mappings":"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"}
1
+ {"version":3,"file":"DateTime.js","sources":["../../../src/components/DateTime/DateTime.tsx"],"sourcesContent":["import { IDateTime } from \"./interfaces\";\nimport { ICalendarDayGridStyles, IDatePicker, IProcessedStyleSet, ThemeProvider } from \"@fluentui/react\";\nimport { useEffect, useRef } from \"react\";\nimport { getDateTimeStyles } from \"./styles\";\nimport { useDateTime } from \"./hooks/useDateTime\";\nimport { Calendar, IInternalCalendarProps } from \"./components/Calendar\";\nimport { DatePicker } from \"@talxis/react-components\";\nimport { useControlSizing } from \"../../hooks/useControlSizing\";\nimport dayjs from \"dayjs\";\n\nexport const DateTime = (componentProps: IDateTime) => {\n const ref = useRef<HTMLDivElement>(null);\n const onOverrideComponentProps = componentProps.onOverrideComponentProps ?? ((props) => props);\n const datePickerRef = useRef<IDatePicker>(null);\n const context = componentProps.context;\n const parameters = componentProps.parameters;\n const [isDateTime, theme, labels, date, patterns] = useDateTime(componentProps, ref);\n const styles = getDateTimeStyles(theme);\n const { height, width } = useControlSizing(componentProps.context.mode);\n const lastInputedTimeString = useRef<string>();\n\n useEffect(() => {\n if (componentProps.parameters.AutoFocus?.raw === true) {\n datePickerRef.current?.showDatePickerPopup();\n }\n }, []);\n\n const getRestrictedDates = (): Date[] | undefined => {\n if(!parameters.RestrictedDates?.raw) {\n return undefined;\n }\n return JSON.parse(parameters.RestrictedDates?.raw).map((x: string) => new Date(x))\n }\n \n const onOverrideDayCellProps = (element: HTMLElement, date: Date, classNames: IProcessedStyleSet<ICalendarDayGridStyles>) => {\n if(!element || !parameters.RestrictedDaysOfWeek?.raw) {\n return;\n }\n const weekDaysToExclude: number[] = JSON.parse(parameters.RestrictedDaysOfWeek.raw);\n if(weekDaysToExclude.includes(date.getDay())) {\n element.setAttribute('data-is-focusable', 'false');\n element.classList?.add(classNames.dayOutsideBounds!);\n (element.children[0] as HTMLButtonElement).disabled = true;\n }\n }\n\n const datePickerProps = onOverrideComponentProps({\n className: styles.datePicker,\n componentRef: datePickerRef,\n hideErrorMessage: !parameters.ShowErrorMessage?.raw,\n keepCalendarOpenAfterDaySelect: isDateTime,\n readOnly: context.mode.isControlDisabled,\n //@ts-ignore - this is a hack to close the calendar when dates get selected on date only fields\n onSelectDate: isDateTime ? undefined : (newDate) => date.set(newDate!),\n //disable so the user cannot input restricted Dates\n allowTextInput: !parameters.RestrictedDates?.raw && !parameters.RestrictedDaysOfWeek?.raw,\n // Lowest date supported by CDS: https://learn.microsoft.com/en-us/previous-versions/dynamicscrm-2016/developers-guide/dn996866(v=crm.8)?redirectedfrom=MSDN\n minDate: new Date('1753-01-01T00:00:00.000Z'),\n firstDayOfWeek: componentProps.context.userSettings.dateFormattingInfo.firstDayOfWeek,\n deleteButtonProps: parameters.EnableDeleteButton?.raw === true ? {\n key: 'Delete',\n showOnlyOnHover: true,\n iconProps: {\n iconName: 'Cancel'\n },\n onClick: () => date.clear()\n } : undefined,\n clickToCopyProps: parameters.EnableCopyButton?.raw === true ? {\n key: 'copy',\n showOnlyOnHover: true,\n iconProps: {\n iconName: 'Copy'\n }\n } : undefined,\n calendarAs: (props) => {\n const calendarProps: IInternalCalendarProps = {\n ...props,\n isMonthPickerVisible: parameters.EnableMonthPicker?.raw !== false,\n isDayPickerVisible: parameters.EnableDayPicker?.raw !== false,\n calendarDayProps: {\n restrictedDates: getRestrictedDates(),\n customDayCellRef: onOverrideDayCellProps\n },\n value: date.get(),\n strings: {\n goToToday: labels.goToToday(),\n days: JSON.parse(labels.days()),\n months: JSON.parse(labels.months()),\n shortDays: JSON.parse(labels.shortDays()),\n shortMonths: JSON.parse(labels.shortMonths())\n },\n timePickerProps: {\n dateTimeFormat: patterns.fullDateTimePattern,\n autoComplete: \"off\",\n autoCapitalize: \"off\",\n timeFormat: patterns.shortTimePattern,\n label: labels.time(),\n visible: isDateTime,\n errorMessage: labels.invalidTimeInput(),\n lastInputedTimeString: lastInputedTimeString.current,\n useHour12: patterns.shortTimePattern.endsWith('A'),\n onChange: (time?: string) => {\n date.set(undefined, time);\n lastInputedTimeString.current = time;\n },\n value: date.get(),\n formattedDateTime: date.getFormatted() ?? \"\",\n strings: {\n invalidInputErrorMessage: labels.invalidTimeInput()\n }\n },\n theme: componentProps.context.fluentDesignLanguage?.applicationTheme ?? theme\n };\n if(isDateTime) {\n calendarProps.onSelectDate = (newDate) => date.set(newDate)\n }\n return <Calendar {...calendarProps} />\n },\n errorMessage: parameters.value.errorMessage,\n textField: {\n value: date.getFormatted() ?? \"\",\n onChange: (e, value) => {\n if(isDateTime) {\n const datePart = dayjs(value, patterns.shortDatePattern).format(patterns.shortDatePattern);\n const time = value?.split(datePart).pop()?.substring(1);\n lastInputedTimeString.current = time;\n }\n date.setDateString(value)\n },\n placeholder: '---',\n onNotifyValidationResult: () => null,\n noValidate: true,\n styles: {\n fieldGroup: {\n height: height,\n width: width\n }\n }\n },\n value: date.get() ?? undefined\n });\n\n return (\n <ThemeProvider theme={theme} applyTo=\"none\" ref={ref}>\n <DatePicker {...datePickerProps} />\n </ThemeProvider>\n );\n};"],"names":["_jsx"],"mappings":"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"}
package/dist/index.d.ts CHANGED
@@ -1,6 +1,6 @@
1
1
  /// <reference types="@types/powerapps-component-framework" />
2
2
  /// <reference types="react" />
3
- import { ITheme, IDatePickerProps, ITextFieldProps, ITagPickerProps, IComboBoxProps } from '@talxis/react-components';
3
+ import { ITheme, ITextFieldProps, IDatePickerProps, ITagPickerProps, IComboBoxProps } from '@talxis/react-components';
4
4
  import { DeepPartial, DataType, IDataset, IColumn, IRecord } from '@talxis/client-libraries';
5
5
  import { ITheme as ITheme$1, ThemeProviderProps, ILinkProps, ITextProps, IIconProps, IImageProps, ISpinnerProps, IShimmerProps, IMessageBar, IButtonProps, IToggleProps } from '@fluentui/react';
6
6
  import React$1 from 'react';
@@ -647,10 +647,15 @@ declare const datasetControlTranslations: {
647
647
  };
648
648
  };
649
649
 
650
- interface IDatasetControl extends IControl<IGridParameters, IGridOutputs, Partial<ITranslation<typeof datasetControlTranslations & typeof gridTranslations>>, any & {
650
+ interface IDatasetControlComponentProps {
651
651
  onDatasetInit: () => void;
652
652
  containerProps: ThemeProviderProps;
653
- }> {
653
+ headerProps: React.HTMLAttributes<HTMLDivElement> & {
654
+ onRender: (renderQuickFind: () => React.ReactElement) => React.ReactElement;
655
+ onGetQuickFindProps: (props: ITextFieldProps) => ITextFieldProps;
656
+ };
657
+ }
658
+ interface IDatasetControl extends IControl<IGridParameters, IGridOutputs, Partial<ITranslation<typeof datasetControlTranslations & typeof gridTranslations>>, IDatasetControlComponentProps> {
654
659
  EnableQuickFind?: Omit<ITwoOptionsProperty, 'attributes'>;
655
660
  }
656
661
 
@@ -1230,4 +1235,4 @@ interface IDurationOutputs extends IOutputs$1 {
1230
1235
 
1231
1236
  declare const Duration: (props: IDuration) => JSX.Element;
1232
1237
 
1233
- export { BaseControl, BaseControls, ControlTheme, DatasetControl, DateTime, Decimal, Duration, Grid, GridCellRenderer, IContext, IControl, IControlController, IDatasetControl, IDateTime, IDateTimeOutputs, IDateTimeParameters, IDateTimeProperty, IDecimal, IDecimalNumberProperty, IDecimalOutputs, IDecimalParameters, IDefaultTranslations, IDuration, IDurationOutputs, IDurationParameters, IEntity, IFileProperty, IFluentDesignState, IGrid, IGridOutputs, IGridParameters, ILayout, ILookup, ILookupOutputs, ILookupParameters, ILookupProperty, IMetadata, IMultiSelectOptionSet, IMultiSelectOptionSetOutputs, IMultiSelectOptionSetParameters, IMultiSelectOptionSetProperty, IOptionSet, IOptionSetOutputs, IOptionSetParameters, IOptionSetProperty, IOutputs, IParameters$1 as IParameters, IProperty, IStringProperty, ITextField, ITextFieldOutputs, ITextFieldParameters, ITranslation, ITranslations, ITwoOptions, ITwoOptionsOutputs, ITwoOptionsParameters, ITwoOptionsProperty, IWholeNumberProperty, Lookup, MultiSelectOptionSet, NestedControlRenderer, OptionSet, TextField, ThemeWrapper, TwoOptions, useControl, useControlLabels, useControlSizing, useControlTheme, useControlThemeGenerator, useDateTime, useFocusIn, useInputBasedControl, useLookup, useMouseOver };
1238
+ export { BaseControl, BaseControls, ControlTheme, DatasetControl, DateTime, Decimal, Duration, Grid, GridCellRenderer, IContext, IControl, IControlController, IDatasetControl, IDatasetControlComponentProps, IDateTime, IDateTimeOutputs, IDateTimeParameters, IDateTimeProperty, IDecimal, IDecimalNumberProperty, IDecimalOutputs, IDecimalParameters, IDefaultTranslations, IDuration, IDurationOutputs, IDurationParameters, IEntity, IFileProperty, IFluentDesignState, IGrid, IGridOutputs, IGridParameters, ILayout, ILookup, ILookupOutputs, ILookupParameters, ILookupProperty, IMetadata, IMultiSelectOptionSet, IMultiSelectOptionSetOutputs, IMultiSelectOptionSetParameters, IMultiSelectOptionSetProperty, IOptionSet, IOptionSetOutputs, IOptionSetParameters, IOptionSetProperty, IOutputs, IParameters$1 as IParameters, IProperty, IStringProperty, ITextField, ITextFieldOutputs, ITextFieldParameters, ITranslation, ITranslations, ITwoOptions, ITwoOptionsOutputs, ITwoOptionsParameters, ITwoOptionsProperty, IWholeNumberProperty, Lookup, MultiSelectOptionSet, NestedControlRenderer, OptionSet, TextField, ThemeWrapper, TwoOptions, useControl, useControlLabels, useControlSizing, useControlTheme, useControlThemeGenerator, useDateTime, useFocusIn, useInputBasedControl, useLookup, useMouseOver };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@talxis/base-controls",
3
- "version": "1.2503.8",
3
+ "version": "1.2503.10",
4
4
  "description": "Set of React components that natively work with Power Apps Component Framework API's",
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/index.js",
@@ -86,7 +86,7 @@
86
86
  "react": "^16.8.6 || ^17.0.2",
87
87
  "react-dom": "^16.8.6 || ^17.0.2",
88
88
  "@talxis/react-components": "^1.2503.1",
89
- "@talxis/client-libraries": "^1.2503.7",
89
+ "@talxis/client-libraries": "^1.2503.8",
90
90
  "@fluentui/react": "<=8.121.5"
91
91
  }
92
92
  }