npm - @talxis/base-controls - Versions diffs - 1.2410.4 → 1.2410.5 - Mend

@talxis/base-controls 1.2410.4 → 1.2410.5

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 (86) hide show

package/dist/components/Grid/core/components/Cell/ReadOnlyCell/Notifications/Notifications.d.ts ADDED Viewed

@@ -0,0 +1,11 @@
+/// <reference types="react" />
+import { IAddControlNotificationOptions } from "@talxis/client-libraries";
+interface INotifications {
+    notifications: IAddControlNotificationOptions[];
+    className?: string;
+}
+export interface INotificationsRef {
+    remeasureCommandBar: () => void;
+}
+export declare const Notifications: import("react").ForwardRefExoticComponent<INotifications & import("react").RefAttributes<INotificationsRef>>;
+export {};

package/dist/components/Grid/core/components/Cell/ReadOnlyCell/Notifications/Notifications.js ADDED Viewed

@@ -0,0 +1,93 @@
+import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
+import { useTheme, ThemeProvider, Callout, Text, Link, Icon, PrimaryButton, DefaultButton } from '@fluentui/react';
+import { getNotificationIconStyles } from './styles.js';
+import { forwardRef, useMemo, useState, useRef, useImperativeHandle } from 'react';
+import { CommandBar } from '@talxis/react-components';
+import { useThemeOverride } from '../../../../../../../hooks/useThemeOverride.js';
+const Notifications = forwardRef((props, ref) => {
+    const { notifications } = { ...props };
+    const theme = useTheme();
+    const styles = getNotificationIconStyles();
+    const iconId = useMemo(() => `icon${crypto.randomUUID()}`, []);
+    const [selectedNotification, setSelectedNotification] = useState(null);
+    const commandBarRef = useRef(null);
+    const overridenTheme = useThemeOverride(theme.palette.themePrimary, 'transparent', theme.semanticColors.bodyText);
+    useImperativeHandle(ref, () => {
+        return {
+            remeasureCommandBar: () => {
+                commandBarRef.current?.remeasure();
+            }
+        };
+    });
+    const getIconName = (notification) => {
+        if (notification.iconName) {
+            return notification.iconName;
+        }
+        return notification.notificationLevel === 'ERROR' ? 'Error' : undefined;
+    };
+    const renderActionButton = (action, buttonType) => {
+        const Button = buttonType === 'primary' ? PrimaryButton : DefaultButton;
+        return jsx(Button, { text: action.message, iconProps: action?.iconName ? {
+                iconName: action.iconName
+            } : undefined, onClick: () => action.actions.map(callback => callback()) });
+    };
+    const renderActions = (actions) => {
+        if (actions.length === 0) {
+            return jsx(Fragment, {});
+        }
+        //render actions as buttons
+        if (actions.length < 3) {
+            return jsx("div", { className: styles.buttons, children: actions.map((action, i) => renderActionButton(action, i === 0 ? 'primary' : 'default')) });
+        }
+        return jsx(CommandBar, { items: actions.map((action, i) => {
+                return {
+                    key: i.toString(),
+                    text: action.message,
+                    commandBarButtonAs: () => jsxs(Link, { onClick: () => action.actions.map(callback => callback()), className: styles.link, children: [action.iconName &&
+                                jsx(Icon, { iconName: action.iconName }), action.message] }),
+                    iconProps: {
+                        iconName: action.iconName
+                    },
+                    onClick: () => {
+                        action.actions.map(callback => callback());
+                    }
+                };
+            }) });
+    };
+    const onNotificationClick = (notification) => {
+        if (notification.actions?.length === 1) {
+            notification.actions[0].actions.map(callback => callback());
+            return;
+        }
+        setSelectedNotification(notification);
+    };
+    return jsxs("div", { className: `${styles.root}${props.className ? ` ${props.className}` : ''}`, children: [jsx(ThemeProvider, { theme: overridenTheme, applyTo: "none", children: jsx(CommandBar, { theme: overridenTheme, id: iconId, componentRef: commandBarRef, items: notifications.map(x => {
+                        const icon = getIconName(x);
+                        return {
+                            key: x.uniqueId,
+                            text: x.title,
+                            title: x.title,
+                            onClick: () => onNotificationClick(x),
+                            buttonStyles: {
+                                textContainer: {
+                                    display: x.compact ? 'none' : undefined
+                                }
+                            },
+                            iconProps: icon ? {
+                                iconName: icon,
+                                styles: {
+                                    root: {
+                                        color: x.notificationLevel === 'ERROR' ? `${theme.semanticColors.errorIcon} !important` : undefined
+                                    }
+                                }
+                            } : undefined
+                        };
+                    }) }) }), selectedNotification &&
+                jsxs(Callout, { hidden: !selectedNotification, className: styles.callout, onDismiss: () => setSelectedNotification(null), target: `#${iconId}`, children: [selectedNotification.title &&
+                            jsx(Text, { title: selectedNotification.title, className: styles.calloutTitle, variant: selectedNotification.messages.length > 0 ? 'xLarge' : undefined, children: selectedNotification.title }), jsx(Text, { children: selectedNotification.messages[0] }), selectedNotification.actions &&
+                            renderActions(selectedNotification.actions)] })] });
+});
+export { Notifications };
+//# sourceMappingURL=Notifications.js.map

package/dist/components/Grid/core/components/Cell/ReadOnlyCell/Notifications/Notifications.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"Notifications.js","sources":["../../../../../../../../src/components/Grid/core/components/Cell/ReadOnlyCell/Notifications/Notifications.tsx"],"sourcesContent":["import { Icon, useTheme, Text, Callout, PrimaryButton, DefaultButton, Link, ICommandBar, ThemeProvider } from \"@fluentui/react\"\nimport { getNotificationIconStyles } from \"./styles\";\nimport { forwardRef, useImperativeHandle, useMemo, useRef, useState } from \"react\";\nimport { IAddControlNotificationOptions, IControlNotificationAction } from \"@talxis/client-libraries\";\nimport { CommandBar } from \"@talxis/react-components\";\nimport { useThemeOverride } from \"../../../../../../../hooks/useThemeOverride\";\n\ninterface INotifications {\n notifications: IAddControlNotificationOptions[],\n className?: string;\n}\n\nexport interface INotificationsRef {\n remeasureCommandBar: () => void;\n}\n\n\nexport const Notifications = forwardRef<INotificationsRef, INotifications>((props, ref) => {\n const { notifications } = { ...props };\n const theme = useTheme();\n const styles = getNotificationIconStyles(theme);\n const iconId = useMemo(() => `icon${crypto.randomUUID()}`, []);\n const [selectedNotification, setSelectedNotification] = useState<IAddControlNotificationOptions | null>(null);\n const commandBarRef = useRef<ICommandBar>(null);\n const overridenTheme = useThemeOverride(theme.palette.themePrimary, 'transparent', theme.semanticColors.bodyText)\n\n useImperativeHandle(ref, () => {\n return {\n remeasureCommandBar: () => {\n commandBarRef.current?.remeasure();\n }\n }\n })\n\n const getIconName = (notification: IAddControlNotificationOptions): string | undefined => {\n if (notification.iconName) {\n return notification.iconName;\n }\n return notification.notificationLevel === 'ERROR' ? 'Error' : undefined;\n }\n\n const renderActionButton = (action: IControlNotificationAction, buttonType: 'primary' | 'default') => {\n const Button = buttonType === 'primary' ? PrimaryButton : DefaultButton;\n return <Button\n text={action.message}\n iconProps={action?.iconName ? {\n iconName: action.iconName\n } : undefined}\n onClick={() => action.actions.map(callback => callback())} />\n }\n\n const renderActions = (actions: IControlNotificationAction[]): JSX.Element => {\n if (actions.length === 0) {\n return <></>\n }\n //render actions as buttons\n if (actions.length < 3) {\n return <div className={styles.buttons}>\n {actions.map((action, i) => renderActionButton(action, i === 0 ? 'primary' : 'default'))}\n </div>\n }\n return <CommandBar items={actions.map((action, i) => {\n return {\n key: i.toString(),\n text: action.message,\n commandBarButtonAs: () => <Link onClick={() => action.actions.map(callback => callback())} className={styles.link}>\n {action.iconName &&\n <Icon iconName={action.iconName} />\n }\n {action.message}\n </Link>,\n iconProps: {\n iconName: action.iconName\n },\n onClick: () => {\n action.actions.map(callback => callback())\n }\n }\n })} />\n }\n\n const onNotificationClick = (notification: IAddControlNotificationOptions) => {\n if (notification.actions?.length === 1) {\n notification.actions[0].actions.map(callback => callback());\n return;\n }\n setSelectedNotification(notification);\n }\n\n return <div className={`${styles.root}${props.className ? ` ${props.className}` : ''}`}>\n <ThemeProvider theme={overridenTheme} applyTo=\"none\">\n <CommandBar theme={overridenTheme} id={iconId} componentRef={commandBarRef} items={notifications.map(x => {\n const icon = getIconName(x);\n return {\n key: x.uniqueId,\n text: x.title,\n title: x.title,\n onClick: () => onNotificationClick(x),\n buttonStyles: {\n textContainer: {\n display: x.compact ? 'none' : undefined\n }\n },\n iconProps: icon ? {\n iconName: icon,\n styles: {\n root: {\n color: x.notificationLevel === 'ERROR' ? `${theme.semanticColors.errorIcon} !important` : undefined\n }\n }\n } : undefined\n }\n })} />\n </ThemeProvider>\n {selectedNotification &&\n <Callout\n hidden={!selectedNotification}\n className={styles.callout}\n onDismiss={() => setSelectedNotification(null)}\n target={`#${iconId}`}>\n {selectedNotification.title &&\n <Text title={selectedNotification.title} className={styles.calloutTitle} variant={selectedNotification.messages.length > 0 ? 'xLarge' : undefined}>{selectedNotification.title}</Text>\n }\n <Text>{selectedNotification.messages[0]}</Text>\n {selectedNotification.actions &&\n renderActions(selectedNotification.actions)\n }\n </Callout>\n }\n </div>\n});"],"names":["_jsx","_jsxs"],"mappings":"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"}

package/dist/components/Grid/core/components/Cell/ReadOnlyCell/Notifications/styles.d.ts ADDED Viewed

@@ -0,0 +1,36 @@
+import { ITheme } from "@fluentui/react";
+export declare const getNotificationIconStyles: (theme: ITheme) => import("@fluentui/react").IProcessedStyleSet<{
+    callout: {
+        width: number;
+        padding: string;
+        '.ms-Callout-main': {
+            display: string;
+            flexDirection: string;
+            gap: number;
+            '.ms-CommandBar-primaryCommand': {
+                gap: number;
+            };
+        };
+    };
+    calloutTitle: {
+        overflow: string;
+        textOverflow: string;
+    };
+    link: {
+        i: {
+            position: string;
+            top: number;
+            marginRight: number;
+        };
+    };
+    buttons: {
+        display: string;
+        justifyContent: string;
+        gap: number;
+    };
+    root: {
+        '.ms-CommandBar-primaryCommand': {
+            justifyContent: string;
+        };
+    };
+}>;

package/dist/components/Grid/core/components/Cell/ReadOnlyCell/Notifications/styles.js ADDED Viewed

@@ -0,0 +1,42 @@
+import { mergeStyleSets } from '@fluentui/react';
+const getNotificationIconStyles = (theme) => {
+    return mergeStyleSets({
+        callout: {
+            width: 320,
+            padding: '20px 24px',
+            '.ms-Callout-main': {
+                display: 'flex',
+                flexDirection: 'column',
+                gap: 20,
+                '.ms-CommandBar-primaryCommand': {
+                    gap: 10
+                }
+            }
+        },
+        calloutTitle: {
+            overflow: 'hidden',
+            textOverflow: 'ellipsis'
+        },
+        link: {
+            'i': {
+                position: 'relative',
+                top: 1,
+                marginRight: 3
+            }
+        },
+        buttons: {
+            display: 'flex',
+            justifyContent: 'flex-end',
+            gap: 8
+        },
+        root: {
+            '.ms-CommandBar-primaryCommand': {
+                justifyContent: 'flex-end'
+            }
+        }
+    });
+};
+export { getNotificationIconStyles };
+//# sourceMappingURL=styles.js.map

package/dist/components/Grid/core/components/Cell/ReadOnlyCell/Notifications/styles.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"styles.js","sources":["../../../../../../../../src/components/Grid/core/components/Cell/ReadOnlyCell/Notifications/styles.ts"],"sourcesContent":["import { ITheme, mergeStyleSets } from \"@fluentui/react\"\n\nexport const getNotificationIconStyles = (theme: ITheme) => {\n return mergeStyleSets({\n callout: {\n width: 320,\n padding: '20px 24px',\n '.ms-Callout-main': {\n display: 'flex',\n flexDirection: 'column',\n gap: 20,\n '.ms-CommandBar-primaryCommand': {\n gap: 10\n }\n }\n },\n calloutTitle: {\n overflow: 'hidden',\n textOverflow: 'ellipsis'\n },\n link: {\n 'i': {\n position: 'relative',\n top: 1,\n marginRight: 3\n }\n },\n buttons: {\n display: 'flex',\n justifyContent: 'flex-end',\n gap: 8\n },\n root: {\n '.ms-CommandBar-primaryCommand': {\n justifyContent: 'flex-end'\n }\n }\n })\n}"],"names":[],"mappings":";;AAEa,MAAA,yBAAyB,GAAG,CAAC,KAAa,KAAI;AACvD,IAAA,OAAO,cAAc,CAAC;AAClB,QAAA,OAAO,EAAE;AACL,YAAA,KAAK,EAAE,GAAG;AACV,YAAA,OAAO,EAAE,WAAW;AACpB,YAAA,kBAAkB,EAAE;AAChB,gBAAA,OAAO,EAAE,MAAM;AACf,gBAAA,aAAa,EAAE,QAAQ;AACvB,gBAAA,GAAG,EAAE,EAAE;AACP,gBAAA,+BAA+B,EAAE;AAC7B,oBAAA,GAAG,EAAE,EAAE;AACV,iBAAA;AACJ,aAAA;AACJ,SAAA;AACD,QAAA,YAAY,EAAE;AACV,YAAA,QAAQ,EAAE,QAAQ;AAClB,YAAA,YAAY,EAAE,UAAU;AAC3B,SAAA;AACD,QAAA,IAAI,EAAE;AACF,YAAA,GAAG,EAAE;AACD,gBAAA,QAAQ,EAAE,UAAU;AACpB,gBAAA,GAAG,EAAE,CAAC;AACN,gBAAA,WAAW,EAAE,CAAC;AACjB,aAAA;AACJ,SAAA;AACD,QAAA,OAAO,EAAE;AACL,YAAA,OAAO,EAAE,MAAM;AACf,YAAA,cAAc,EAAE,UAAU;AAC1B,YAAA,GAAG,EAAE,CAAC;AACT,SAAA;AACD,QAAA,IAAI,EAAE;AACF,YAAA,+BAA+B,EAAE;AAC7B,gBAAA,cAAc,EAAE,UAAU;AAC7B,aAAA;AACJ,SAAA;AACJ,KAAA,CAAC,CAAA;AACN;;;;"}

package/dist/components/Grid/core/components/Cell/ReadOnlyCell/ReadOnlyCell.d.ts CHANGED Viewed

@@ -1,10 +1,10 @@
 /// <reference types="react" />
+import { IRecord } from '@talxis/client-libraries';
 import { IGridColumn } from '../../../interfaces/IGridColumn';
-import { IEntityRecord } from '../../../../interfaces';
 import { ICellRendererParams } from '@ag-grid-community/core';
 interface ICellProps extends ICellRendererParams {
     baseColumn: IGridColumn;
-    data: IEntityRecord;
+    data: IRecord;
     [key: string]: any;
 }
 export declare const ReadOnlyCell: (props: ICellProps) => JSX.Element;

package/dist/components/Grid/core/components/Cell/ReadOnlyCell/ReadOnlyCell.js CHANGED Viewed

@@ -1,62 +1,133 @@
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import * as React from 'react';
-import { useTheme, TooltipHost, Icon, Checkbox, Image, Link, Text } from '@fluentui/react';
+import { useTheme, Shimmer, Checkbox, Image, Icon, Link, Text } from '@fluentui/react';
 import { getReadOnlyCellStyles } from './styles.js';
 import { Commands } from '../Commands/Commands.js';
-import { FileAttribute } from '@talxis/client-libraries';
+import { Constants, FileAttribute } from '@talxis/client-libraries';
 import { ReadOnlyOptionSet } from './ReadOnlyOptionSet/ReadOnlyOptionSet.js';
 import { DataType } from '../../../enums/DataType.js';
 import { useColumnValidationController } from '../../../../validation/controllers/useRecordValidationController.js';
 import { useGridInstance } from '../../../hooks/useGridInstance.js';
 import { useSelectionController } from '../../../../selection/controllers/useSelectionController.js';
-import { RIBBON_COLUMN_KEY } from '../../../../constants.js';
+import { CHECKBOX_COLUMN_KEY } from '../../../../constants.js';
+import { Notifications } from './Notifications/Notifications.js';
+import { useDebouncedCallback } from 'use-debounce';
 const ReadOnlyCell = (props) => {
     const grid = useGridInstance();
     const column = props.baseColumn;
     const record = props.data;
     const theme = useTheme();
-    const styles = getReadOnlyCellStyles(theme);
-    const tooltipId = React.useMemo(() => Math.random().toString(), []);
+    const styles = React.useMemo(() => getReadOnlyCellStyles(theme), [theme]);
+    const selection = useSelectionController();
+    const notifications = record.ui?.getNotifications(column.name);
+    const notificationRef = React.useRef(null);
+    const MemoizedNotifications = React.useMemo(() => {
+        return React.memo(Notifications, (prevProps, nextProps) => {
+            const previousIds = prevProps.notifications.map(x => x.uniqueId).join(';');
+            const nextIds = nextProps.notifications.map(x => x.uniqueId).join(';');
+            if (previousIds !== nextIds) {
+                return false;
+            }
+            return true;
+        });
+    }, []);
+    const debounceNotificationRemeasure = useDebouncedCallback(() => {
+        if (notifications && notifications.length > 0) {
+            notificationRef.current?.remeasureCommandBar();
+        }
+    }, 10);
     const [isValid, errorMessage] = useColumnValidationController({
         column: column,
         record: record,
     });
-    return (jsx(TooltipHost, { id: tooltipId, content: !isValid && !grid.loading ? errorMessage : undefined, children: jsxs("div", { className: styles.root, "data-is-valid": isValid, children: [jsx("div", { className: styles.cellContent, children: jsx(InternalReadOnlyCell, { ...props }) }), !isValid && jsx(Icon, { styles: {
-                        root: {
-                            color: theme.semanticColors.errorIcon
-                        }
-                    }, iconName: 'Error' })] }) }));
+    debounceNotificationRemeasure();
+    const shouldShowNotEditableNotification = () => {
+        if (column.isEditable && record.ui?.isEditable(column.name) === false) {
+            return true;
+        }
+        return false;
+    };
+    const calculateNotificationsWrapperMinWidth = () => {
+        let count = 0;
+        if (notifications && notifications.length > 0) {
+            count++;
+        }
+        if (!isValid) {
+            count++;
+        }
+        if (shouldShowNotEditableNotification()) {
+            count++;
+        }
+        return count * 40;
+    };
+    const shouldRenderNotificationsWrapper = () => {
+        if (!isValid) {
+            return true;
+        }
+        if (shouldShowNotEditableNotification()) {
+            return true;
+        }
+        if (notifications && notifications.length > 0) {
+            return true;
+        }
+        return false;
+    };
+    React.useEffect(() => {
+        const resizeObserver = new ResizeObserver(() => {
+            debounceNotificationRemeasure();
+        });
+        resizeObserver.observe(props.eGridCell);
+    }, []);
+    if (record.ui?.isLoading(column.name)) {
+        return jsx(Shimmer, { className: styles.loading });
+    }
+    switch (column.name) {
+        case CHECKBOX_COLUMN_KEY: {
+            return jsx("div", { className: styles.cellContent, children: jsx(Checkbox, { checked: props.node.isSelected(), onChange: (e, checked) => {
+                        e?.stopPropagation();
+                        selection.toggle(record, checked);
+                    } }) });
+        }
+        case Constants.RIBBON_BUTTONS_COLUMN_NAME: {
+            return jsx("div", { className: styles.cellContent, children: jsx(Commands, { record: record }) });
+        }
+    }
+    return (jsxs("div", { style: {
+            '--test': `${calculateNotificationsWrapperMinWidth()}px`
+        }, className: styles.root, "data-is-valid": isValid, children: [jsx("div", { className: styles.cellContentWrapper, children: jsx("div", { className: styles.cellContent, children: jsx(InternalReadOnlyCell, { ...props }) }) }), shouldRenderNotificationsWrapper() &&
+                jsxs("div", { className: styles.notificationsWrapper, children: [notifications && notifications.length > 0 &&
+                            jsx(MemoizedNotifications, { className: styles.notifications, ref: notificationRef, notifications: notifications }), !isValid &&
+                            jsx(MemoizedNotifications, { notifications: [
+                                    {
+                                        notificationLevel: 'ERROR',
+                                        messages: [],
+                                        iconName: 'Error',
+                                        uniqueId: column.name,
+                                        title: errorMessage,
+                                        compact: true
+                                    }
+                                ] }), shouldShowNotEditableNotification() &&
+                            jsx(MemoizedNotifications, { className: styles.uneditableNotification, notifications: [{
+                                        iconName: 'Uneditable',
+                                        notificationLevel: 'RECOMMENDATION',
+                                        uniqueId: column.name,
+                                        title: grid.labels['value-not-editable'](),
+                                        compact: true,
+                                        messages: []
+                                    }] })] })] }));
 };
 const InternalReadOnlyCell = (props) => {
     const grid = useGridInstance();
     const column = props.baseColumn;
     const theme = useTheme();
     const styles = getReadOnlyCellStyles(theme);
-    const selection = useSelectionController();
     const record = (() => {
         //this is so we can load the updated record values from state
         const updatedRecord = grid.recordUpdateService.record(props.data.getRecordId()).get();
         return updatedRecord ?? props.data;
     })();
-    const formattedValue = record.getFormattedValue(column.key);
-    const originalSetValue = record.setValue;
-    React.useEffect(() => {
-        record.setValue = (columnName, value) => {
-            originalSetValue(columnName, value);
-            grid.pcfContext.factory.requestRender();
-            //so changes propagate when changing values
-            //we cannot guarantee a rerender from above because of performance optimizations
-            const node = props.api.getRowNode(record.getRecordId());
-            if (!node) {
-                return;
-            }
-            props.api.refreshCells({
-                rowNodes: [node],
-                force: true
-            });
-        };
-    }, []);
+    const formattedValue = record.getFormattedValue(column.name);
     const renderLink = (props, formattedValue) => {
         switch (column.dataType) {
             case DataType.LOOKUP_OWNER:
@@ -67,6 +138,9 @@ const InternalReadOnlyCell = (props) => {
                 }
             }
         }
+        if (!formattedValue) {
+            return jsx(Fragment, {});
+        }
         return (jsx(Link, { ...props, className: styles.link, title: formattedValue, children: formattedValue }));
     };
     const renderText = () => {
@@ -84,7 +158,7 @@ const InternalReadOnlyCell = (props) => {
             //@ts-ignore - PowerApps do not follow the typings
             entityName: namedReference.etn ?? namedReference.entityName,
             recordId: record.getRecordId(),
-            fileAttribute: column.key,
+            fileAttribute: column.name,
         }, true);
     };
     switch (column.dataType) {
@@ -96,7 +170,7 @@ const InternalReadOnlyCell = (props) => {
         }
         case DataType.SINGLE_LINE_URL: {
             return renderLink({
-                href: formattedValue,
+                href: formattedValue ?? "",
                 target: '_blank',
                 rel: 'noopener noreferrer'
             }, formattedValue);
@@ -105,7 +179,7 @@ const InternalReadOnlyCell = (props) => {
         case DataType.LOOKUP_OWNER:
         case DataType.LOOKUP_CUSTOMER: {
             return renderLink({
-                onClick: () => grid.openDatasetItem(record.getValue(column.key))
+                onClick: () => grid.openDatasetItem(record.getValue(column.name))
             }, formattedValue);
         }
         case DataType.FILE: {
@@ -133,15 +207,6 @@ const InternalReadOnlyCell = (props) => {
             return renderText();
         }
         default: {
-            if (column.key === '__checkbox') {
-                return jsx(Checkbox, { checked: props.node.isSelected(), onChange: (e, checked) => {
-                        e?.stopPropagation();
-                        selection.toggle(record, checked);
-                    } });
-            }
-            if (column.key === RIBBON_COLUMN_KEY) {
-                return jsx(Commands, { record: record });
-            }
             return renderText();
         }
     }

package/dist/components/Grid/core/components/Cell/ReadOnlyCell/ReadOnlyCell.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ReadOnlyCell.js","sources":["../../../../../../../src/components/Grid/core/components/Cell/ReadOnlyCell/ReadOnlyCell.tsx"],"sourcesContent":["import * as React from 'react';\nimport { ILinkProps } from '@fluentui/react';\nimport { Link } from '@fluentui/react';\nimport { Text } from '@fluentui/react';\nimport { getReadOnlyCellStyles } from './styles';\nimport { Commands } from '../Commands/Commands';\nimport { Checkbox, Icon, TooltipHost, useTheme, Image } from '@fluentui/react';\nimport { FileAttribute } from '@talxis/client-libraries';\nimport { ReadOnlyOptionSet } from './ReadOnlyOptionSet/ReadOnlyOptionSet';\nimport { IGridColumn } from '../../../interfaces/IGridColumn';\nimport { DataType } from '../../../enums/DataType';\nimport { useColumnValidationController } from '../../../../validation/controllers/useRecordValidationController';\nimport { useGridInstance } from '../../../hooks/useGridInstance';\nimport { useSelectionController } from '../../../../selection/controllers/useSelectionController';\nimport { IEntityRecord } from '../../../../interfaces';\nimport { ICellRendererParams } from '@ag-grid-community/core';\nimport { RIBBON_COLUMN_KEY } from '../../../../constants';\nimport { useRerender } from '../../../hooks/useRerender';\n\ninterface ICellProps extends ICellRendererParams {\n baseColumn: IGridColumn;\n data: IEntityRecord;\n [key: string]: any;\n}\n\nexport const ReadOnlyCell = (props: ICellProps) => {\n const grid = useGridInstance();\n const column = props.baseColumn;\n const record = props.data;\n const theme = useTheme();\n const styles = getReadOnlyCellStyles(theme);\n const tooltipId = React.useMemo(() => Math.random().toString(), []);\n\n const [isValid, errorMessage] = useColumnValidationController({\n column: column,\n record: record,\n })\n\n return (\n <TooltipHost\n id={tooltipId}\n content={!isValid && !grid.loading ? errorMessage : undefined}>\n <div className={styles.root} data-is-valid={isValid}>\n <div className={styles.cellContent}>\n <InternalReadOnlyCell {...props} />\n </div>\n {!isValid && <Icon styles={{\n root: {\n color: theme.semanticColors.errorIcon\n }\n }} iconName='Error' />}\n </div>\n </TooltipHost>\n )\n};\n\nconst InternalReadOnlyCell = (props: ICellProps) => {\n const grid = useGridInstance();\n const column = props.baseColumn;\n const theme = useTheme();\n const styles = getReadOnlyCellStyles(theme);\n const selection = useSelectionController();\n const record: IEntityRecord = (() => {\n //this is so we can load the updated record values from state\n const updatedRecord = grid.recordUpdateService.record(props.data.getRecordId()).get() as any;\n return updatedRecord ?? props.data;\n })();\n const formattedValue = record.getFormattedValue(column.key);\n const originalSetValue = record.setValue\n\n React.useEffect(() => {\n record.setValue = (columnName, value) => {\n originalSetValue(columnName, value);\n grid.pcfContext.factory.requestRender();\n //so changes propagate when changing values\n //we cannot guarantee a rerender from above because of performance optimizations\n const node = props.api.getRowNode(record.getRecordId());\n if (!node) {\n return;\n }\n props.api.refreshCells({\n rowNodes: [node],\n force: true\n })\n }\n }, []);\n\n const renderLink = (props: ILinkProps, formattedValue: string): JSX.Element => {\n switch (column.dataType) {\n case DataType.LOOKUP_OWNER:\n case DataType.LOOKUP_SIMPLE:\n case DataType.LOOKUP_CUSTOMER: {\n if (!grid.isNavigationEnabled) {\n return renderText();\n }\n }\n }\n return (\n <Link {...props} className={styles.link} title={formattedValue}>\n {formattedValue}\n </Link>\n );\n };\n const renderText = (): JSX.Element => {\n if (column.isPrimary && grid.isNavigationEnabled) {\n return renderLink({\n onClick: () => grid.openDatasetItem(record.getNamedReference())\n }, formattedValue);\n }\n return <Text className={`${styles.text} talxis-cell-text`} title={formattedValue}>{formattedValue}</Text>\n }\n const downloadFile = () => {\n const storage = new FileAttribute(grid.pcfContext.webAPI);\n const namedReference = record.getNamedReference();\n storage.downloadFileFromAttribute({\n //@ts-ignore - PowerApps do not follow the typings\n entityName: namedReference.etn ?? namedReference.entityName,\n recordId: record.getRecordId(),\n fileAttribute: column.key,\n }, true)\n }\n\n switch (column.dataType) {\n case DataType.SINGLE_LINE_EMAIL: {\n return renderLink({ href: `mailto:${formattedValue}` }, formattedValue);\n }\n case DataType.SINGLE_LINE_PHONE: {\n return renderLink({ href: `tel:${formattedValue}` }, formattedValue);\n }\n case DataType.SINGLE_LINE_URL: {\n return renderLink({\n href: formattedValue,\n target: '_blank',\n rel: 'noopener noreferrer'\n }, formattedValue);\n }\n case DataType.LOOKUP_SIMPLE:\n case DataType.LOOKUP_OWNER:\n case DataType.LOOKUP_CUSTOMER: {\n return renderLink({\n onClick: () => grid.openDatasetItem(record.getValue(column.key) as any)\n }, formattedValue);\n }\n case DataType.FILE: {\n if (!formattedValue) {\n return <></>\n }\n return (\n <div className={styles.fileWrapper}>\n <Icon iconName='Attach' />\n {\n renderLink({\n onClick: downloadFile\n }, grid.labels.download())\n }\n </div>\n )\n }\n case DataType.IMAGE: {\n if (!formattedValue) {\n return <></>\n }\n return (\n <div className={styles.fileWrapper}>\n <Image className={styles.image} src={`data:image/png;base64,${formattedValue}`} />\n {\n renderLink({\n onClick: downloadFile\n }, 'Download')\n }\n </div>\n )\n }\n case DataType.OPTIONSET:\n case DataType.MULTI_SELECT_OPTIONSET:\n case DataType.TWO_OPTIONS: {\n if (grid.enableOptionSetColors) {\n return <ReadOnlyOptionSet\n column={column}\n record={record}\n defaultRender={renderText} />\n }\n return renderText();\n }\n default: {\n if (column.key === '__checkbox') {\n return <Checkbox\n checked={props.node.isSelected()}\n onChange={(e, checked) => {\n e?.stopPropagation()\n selection.toggle(record, checked!)\n }} />\n }\n if (column.key === RIBBON_COLUMN_KEY) {\n return <Commands record={record} />\n }\n return renderText()\n }\n\n }\n}"],"names":["_jsx","_jsxs"],"mappings":";;;;;;;;;;;;;AAyBa,MAAA,YAAY,GAAG,CAAC,KAAiB,KAAI;AAC9C,IAAA,MAAM,IAAI,GAAG,eAAe,EAAE,CAAC;AAC/B,IAAA,MAAM,MAAM,GAAG,KAAK,CAAC,UAAU,CAAC;AAChC,IAAA,MAAM,MAAM,GAAG,KAAK,CAAC,IAAI,CAAC;AAC1B,IAAA,MAAM,KAAK,GAAG,QAAQ,EAAE,CAAC;AACzB,IAAA,MAAM,MAAM,GAAG,qBAAqB,CAAC,KAAK,CAAC,CAAC;AAC5C,IAAA,MAAM,SAAS,GAAG,KAAK,CAAC,OAAO,CAAC,MAAM,IAAI,CAAC,MAAM,EAAE,CAAC,QAAQ,EAAE,EAAE,EAAE,CAAC,CAAC;AAEpE,IAAA,MAAM,CAAC,OAAO,EAAE,YAAY,CAAC,GAAG,6BAA6B,CAAC;AAC1D,QAAA,MAAM,EAAE,MAAM;AACd,QAAA,MAAM,EAAE,MAAM;AACjB,KAAA,CAAC,CAAA;IAEF,QACIA,GAAC,CAAA,WAAW,EACR,EAAA,EAAE,EAAE,SAAS,EACb,OAAO,EAAE,CAAC,OAAO,IAAI,CAAC,IAAI,CAAC,OAAO,GAAG,YAAY,GAAG,SAAS,EAAA,QAAA,EAC7DC,IAAK,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,MAAM,CAAC,IAAI,EAAA,eAAA,EAAiB,OAAO,EAAA,QAAA,EAAA,CAC/CD,GAAK,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,MAAM,CAAC,WAAW,EAC9B,QAAA,EAAAA,GAAA,CAAC,oBAAoB,EAAK,EAAA,GAAA,KAAK,EAAI,CAAA,EAAA,CACjC,EACL,CAAC,OAAO,IAAIA,GAAC,CAAA,IAAI,EAAC,EAAA,MAAM,EAAE;AACvB,wBAAA,IAAI,EAAE;AACF,4BAAA,KAAK,EAAE,KAAK,CAAC,cAAc,CAAC,SAAS;AACxC,yBAAA;AACJ,qBAAA,EAAE,QAAQ,EAAC,OAAO,GAAG,CACpB,EAAA,CAAA,EAAA,CACI,EACjB;AACL,EAAE;AAEF,MAAM,oBAAoB,GAAG,CAAC,KAAiB,KAAI;AAC/C,IAAA,MAAM,IAAI,GAAG,eAAe,EAAE,CAAC;AAC/B,IAAA,MAAM,MAAM,GAAG,KAAK,CAAC,UAAU,CAAC;AAChC,IAAA,MAAM,KAAK,GAAG,QAAQ,EAAE,CAAC;AACzB,IAAA,MAAM,MAAM,GAAG,qBAAqB,CAAC,KAAK,CAAC,CAAC;AAC5C,IAAA,MAAM,SAAS,GAAG,sBAAsB,EAAE,CAAC;AAC3C,IAAA,MAAM,MAAM,GAAkB,CAAC,MAAK;;AAEhC,QAAA,MAAM,aAAa,GAAG,IAAI,CAAC,mBAAmB,CAAC,MAAM,CAAC,KAAK,CAAC,IAAI,CAAC,WAAW,EAAE,CAAC,CAAC,GAAG,EAAS,CAAC;AAC7F,QAAA,OAAO,aAAa,IAAI,KAAK,CAAC,IAAI,CAAC;KACtC,GAAG,CAAC;IACL,MAAM,cAAc,GAAG,MAAM,CAAC,iBAAiB,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC;AAC5D,IAAA,MAAM,gBAAgB,GAAG,MAAM,CAAC,QAAQ,CAAA;AAExC,IAAA,KAAK,CAAC,SAAS,CAAC,MAAK;QACjB,MAAM,CAAC,QAAQ,GAAG,CAAC,UAAU,EAAE,KAAK,KAAI;AACpC,YAAA,gBAAgB,CAAC,UAAU,EAAE,KAAK,CAAC,CAAC;AACpC,YAAA,IAAI,CAAC,UAAU,CAAC,OAAO,CAAC,aAAa,EAAE,CAAC;;;AAGxC,YAAA,MAAM,IAAI,GAAG,KAAK,CAAC,GAAG,CAAC,UAAU,CAAC,MAAM,CAAC,WAAW,EAAE,CAAC,CAAC;YACxD,IAAI,CAAC,IAAI,EAAE;gBACP,OAAO;AACV,aAAA;AACD,YAAA,KAAK,CAAC,GAAG,CAAC,YAAY,CAAC;gBACnB,QAAQ,EAAE,CAAC,IAAI,CAAC;AAChB,gBAAA,KAAK,EAAE,IAAI;AACd,aAAA,CAAC,CAAA;AACN,SAAC,CAAA;KACJ,EAAE,EAAE,CAAC,CAAC;AAEP,IAAA,MAAM,UAAU,GAAG,CAAC,KAAiB,EAAE,cAAsB,KAAiB;QAC1E,QAAQ,MAAM,CAAC,QAAQ;YACnB,KAAK,QAAQ,CAAC,YAAY,CAAC;YAC3B,KAAK,QAAQ,CAAC,aAAa,CAAC;AAC5B,YAAA,KAAK,QAAQ,CAAC,eAAe,EAAE;AAC3B,gBAAA,IAAI,CAAC,IAAI,CAAC,mBAAmB,EAAE;oBAC3B,OAAO,UAAU,EAAE,CAAC;AACvB,iBAAA;AACJ,aAAA;AACJ,SAAA;AACD,QAAA,QACIA,GAAC,CAAA,IAAI,OAAK,KAAK,EAAE,SAAS,EAAE,MAAM,CAAC,IAAI,EAAE,KAAK,EAAE,cAAc,YACzD,cAAc,EAAA,CACZ,EACT;AACN,KAAC,CAAC;IACF,MAAM,UAAU,GAAG,MAAkB;AACjC,QAAA,IAAI,MAAM,CAAC,SAAS,IAAI,IAAI,CAAC,mBAAmB,EAAE;AAC9C,YAAA,OAAO,UAAU,CAAC;AACd,gBAAA,OAAO,EAAE,MAAM,IAAI,CAAC,eAAe,CAAC,MAAM,CAAC,iBAAiB,EAAE,CAAC;aAClE,EAAE,cAAc,CAAC,CAAC;AACtB,SAAA;AACD,QAAA,OAAOA,IAAC,IAAI,EAAA,EAAC,SAAS,EAAE,GAAG,MAAM,CAAC,IAAI,CAAA,iBAAA,CAAmB,EAAE,KAAK,EAAE,cAAc,EAAG,QAAA,EAAA,cAAc,GAAQ,CAAA;AAC7G,KAAC,CAAA;IACD,MAAM,YAAY,GAAG,MAAK;QACtB,MAAM,OAAO,GAAG,IAAI,aAAa,CAAC,IAAI,CAAC,UAAU,CAAC,MAAM,CAAC,CAAC;AAC1D,QAAA,MAAM,cAAc,GAAG,MAAM,CAAC,iBAAiB,EAAE,CAAC;QAClD,OAAO,CAAC,yBAAyB,CAAC;;AAE9B,YAAA,UAAU,EAAE,cAAc,CAAC,GAAG,IAAI,cAAc,CAAC,UAAU;AAC3D,YAAA,QAAQ,EAAE,MAAM,CAAC,WAAW,EAAE;YAC9B,aAAa,EAAE,MAAM,CAAC,GAAG;SAC5B,EAAE,IAAI,CAAC,CAAA;AACZ,KAAC,CAAA;IAED,QAAQ,MAAM,CAAC,QAAQ;AACnB,QAAA,KAAK,QAAQ,CAAC,iBAAiB,EAAE;AAC7B,YAAA,OAAO,UAAU,CAAC,EAAE,IAAI,EAAE,CAAA,OAAA,EAAU,cAAc,CAAA,CAAE,EAAE,EAAE,cAAc,CAAC,CAAC;AAC3E,SAAA;AACD,QAAA,KAAK,QAAQ,CAAC,iBAAiB,EAAE;AAC7B,YAAA,OAAO,UAAU,CAAC,EAAE,IAAI,EAAE,CAAA,IAAA,EAAO,cAAc,CAAA,CAAE,EAAE,EAAE,cAAc,CAAC,CAAC;AACxE,SAAA;AACD,QAAA,KAAK,QAAQ,CAAC,eAAe,EAAE;AAC3B,YAAA,OAAO,UAAU,CAAC;AACd,gBAAA,IAAI,EAAE,cAAc;AACpB,gBAAA,MAAM,EAAE,QAAQ;AAChB,gBAAA,GAAG,EAAE,qBAAqB;aAC7B,EAAE,cAAc,CAAC,CAAC;AACtB,SAAA;QACD,KAAK,QAAQ,CAAC,aAAa,CAAC;QAC5B,KAAK,QAAQ,CAAC,YAAY,CAAC;AAC3B,QAAA,KAAK,QAAQ,CAAC,eAAe,EAAE;AAC3B,YAAA,OAAO,UAAU,CAAC;AACd,gBAAA,OAAO,EAAE,MAAM,IAAI,CAAC,eAAe,CAAC,MAAM,CAAC,QAAQ,CAAC,MAAM,CAAC,GAAG,CAAQ,CAAC;aAC1E,EAAE,cAAc,CAAC,CAAC;AACtB,SAAA;AACD,QAAA,KAAK,QAAQ,CAAC,IAAI,EAAE;YAChB,IAAI,CAAC,cAAc,EAAE;AACjB,gBAAA,OAAOA,iBAAK,CAAA;AACf,aAAA;AACD,YAAA,QACIC,IAAK,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,MAAM,CAAC,WAAW,EAAA,QAAA,EAAA,CAC9BD,GAAC,CAAA,IAAI,IAAC,QAAQ,EAAC,QAAQ,EAAG,CAAA,EAEtB,UAAU,CAAC;AACP,wBAAA,OAAO,EAAE,YAAY;qBACxB,EAAE,IAAI,CAAC,MAAM,CAAC,QAAQ,EAAE,CAAC,CAE5B,EAAA,CAAA,EACT;AACJ,SAAA;AACD,QAAA,KAAK,QAAQ,CAAC,KAAK,EAAE;YACjB,IAAI,CAAC,cAAc,EAAE;AACjB,gBAAA,OAAOA,iBAAK,CAAA;AACf,aAAA;YACD,QACIC,IAAK,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,MAAM,CAAC,WAAW,EAAA,QAAA,EAAA,CAC9BD,GAAC,CAAA,KAAK,EAAC,EAAA,SAAS,EAAE,MAAM,CAAC,KAAK,EAAE,GAAG,EAAE,CAAyB,sBAAA,EAAA,cAAc,CAAE,CAAA,EAAA,CAAI,EAE9E,UAAU,CAAC;AACP,wBAAA,OAAO,EAAE,YAAY;AACxB,qBAAA,EAAE,UAAU,CAAC,CAEhB,EAAA,CAAA,EACT;AACJ,SAAA;QACD,KAAK,QAAQ,CAAC,SAAS,CAAC;QACxB,KAAK,QAAQ,CAAC,sBAAsB,CAAC;AACrC,QAAA,KAAK,QAAQ,CAAC,WAAW,EAAE;YACvB,IAAI,IAAI,CAAC,qBAAqB,EAAE;AAC5B,gBAAA,OAAOA,GAAC,CAAA,iBAAiB,EACrB,EAAA,MAAM,EAAE,MAAM,EACd,MAAM,EAAE,MAAM,EACd,aAAa,EAAE,UAAU,GAAI,CAAA;AACpC,aAAA;YACD,OAAO,UAAU,EAAE,CAAC;AACvB,SAAA;AACD,QAAA,SAAS;AACL,YAAA,IAAI,MAAM,CAAC,GAAG,KAAK,YAAY,EAAE;AAC7B,gBAAA,OAAOA,IAAC,QAAQ,EAAA,EACZ,OAAO,EAAE,KAAK,CAAC,IAAI,CAAC,UAAU,EAAE,EAChC,QAAQ,EAAE,CAAC,CAAC,EAAE,OAAO,KAAI;wBACrB,CAAC,EAAE,eAAe,EAAE,CAAA;AACpB,wBAAA,SAAS,CAAC,MAAM,CAAC,MAAM,EAAE,OAAQ,CAAC,CAAA;AACtC,qBAAC,GAAI,CAAA;AACZ,aAAA;AACD,YAAA,IAAI,MAAM,CAAC,GAAG,KAAK,iBAAiB,EAAE;AAClC,gBAAA,OAAOA,IAAC,QAAQ,EAAA,EAAC,MAAM,EAAE,MAAM,GAAI,CAAA;AACtC,aAAA;YACD,OAAO,UAAU,EAAE,CAAA;AACtB,SAAA;AAEJ,KAAA;AACL,CAAC;;;;"}
1	+ {"version":3,"file":"ReadOnlyCell.js","sources":["../../../../../../../src/components/Grid/core/components/Cell/ReadOnlyCell/ReadOnlyCell.tsx"],"sourcesContent":["import * as React from 'react';\nimport { ILinkProps, Shimmer } from '@fluentui/react';\nimport { Link } from '@fluentui/react';\nimport { Text } from '@fluentui/react';\nimport { getReadOnlyCellStyles } from './styles';\nimport { Commands } from '../Commands/Commands';\nimport { Checkbox, Icon, useTheme, Image } from '@fluentui/react';\nimport { Constants, FileAttribute, IRecord } from '@talxis/client-libraries';\nimport { ReadOnlyOptionSet } from './ReadOnlyOptionSet/ReadOnlyOptionSet';\nimport { IGridColumn } from '../../../interfaces/IGridColumn';\nimport { DataType } from '../../../enums/DataType';\nimport { useColumnValidationController } from '../../../../validation/controllers/useRecordValidationController';\nimport { useGridInstance } from '../../../hooks/useGridInstance';\nimport { useSelectionController } from '../../../../selection/controllers/useSelectionController';\nimport { ICellRendererParams } from '@ag-grid-community/core';\nimport { CHECKBOX_COLUMN_KEY } from '../../../../constants';\nimport { INotificationsRef, Notifications } from './Notifications/Notifications';\nimport { useDebouncedCallback } from 'use-debounce';\n\ninterface ICellProps extends ICellRendererParams {\n baseColumn: IGridColumn;\n data: IRecord;\n [key: string]: any;\n}\n\nexport const ReadOnlyCell = (props: ICellProps) => {\n const grid = useGridInstance();\n const column = props.baseColumn;\n const record = props.data;\n const theme = useTheme();\n const styles = React.useMemo(() => getReadOnlyCellStyles(theme), [theme]);\n const selection = useSelectionController();\n const notifications = record.ui?.getNotifications(column.name);\n const notificationRef = React.useRef<INotificationsRef>(null);\n\n const MemoizedNotifications = React.useMemo(() => {\n return React.memo(Notifications, (prevProps, nextProps) => {\n const previousIds = prevProps.notifications.map(x => x.uniqueId).join(';');\n const nextIds = nextProps.notifications.map(x => x.uniqueId).join(';');\n if (previousIds !== nextIds) {\n return false;\n }\n return true;\n });\n }, []);\n\n const debounceNotificationRemeasure = useDebouncedCallback(() => {\n if (notifications && notifications.length > 0) {\n notificationRef.current?.remeasureCommandBar();\n }\n }, 10)\n\n const [isValid, errorMessage] = useColumnValidationController({\n column: column,\n record: record,\n });\n\n debounceNotificationRemeasure();\n\n const shouldShowNotEditableNotification = (): boolean => {\n if (column.isEditable && record.ui?.isEditable(column.name) === false) {\n return true;\n }\n return false;\n }\n\n const calculateNotificationsWrapperMinWidth = (): number => {\n let count = 0;\n if (notifications && notifications.length > 0) {\n count++\n }\n if (!isValid) {\n count++;\n }\n if (shouldShowNotEditableNotification()) {\n count++;\n }\n return count * 40;\n }\n\n const shouldRenderNotificationsWrapper = (): boolean => {\n if (!isValid) {\n return true;\n }\n if (shouldShowNotEditableNotification()) {\n return true;\n }\n if (notifications && notifications.length > 0) {\n return true;\n }\n return false;\n }\n\n React.useEffect(() => {\n const resizeObserver = new ResizeObserver(() => {\n debounceNotificationRemeasure();\n })\n resizeObserver.observe(props.eGridCell);\n }, []);\n\n\n if (record.ui?.isLoading(column.name)) {\n return <Shimmer className={styles.loading} />\n }\n switch (column.name) {\n case CHECKBOX_COLUMN_KEY: {\n return <div className={styles.cellContent}>\n <Checkbox\n checked={props.node.isSelected()}\n onChange={(e, checked) => {\n e?.stopPropagation()\n selection.toggle(record, checked!)\n }} />\n </div>\n }\n case Constants.RIBBON_BUTTONS_COLUMN_NAME: {\n return <div className={styles.cellContent}>\n <Commands record={record} />\n </div>\n }\n }\n\n return (\n <div style={{\n '--test': `${calculateNotificationsWrapperMinWidth()}px`\n } as React.CSSProperties} className={styles.root} data-is-valid={isValid}>\n <div className={styles.cellContentWrapper}>\n <div className={styles.cellContent}>\n <InternalReadOnlyCell {...props} />\n </div>\n </div>\n {shouldRenderNotificationsWrapper() &&\n <div className={styles.notificationsWrapper}>\n {notifications && notifications.length > 0 &&\n <MemoizedNotifications className={styles.notifications} ref={notificationRef} notifications={notifications} />\n }\n {!isValid &&\n <MemoizedNotifications notifications={[\n {\n notificationLevel: 'ERROR',\n messages: [],\n iconName: 'Error',\n uniqueId: column.name,\n title: errorMessage,\n compact: true\n }\n ]} />\n }\n {\n shouldShowNotEditableNotification() &&\n <MemoizedNotifications className={styles.uneditableNotification} notifications={[{\n iconName: 'Uneditable',\n notificationLevel: 'RECOMMENDATION',\n uniqueId: column.name,\n title: grid.labels['value-not-editable'](),\n compact: true,\n messages: []\n }]} />\n }\n </div>\n }\n </div>\n )\n};\n\nconst InternalReadOnlyCell = (props: ICellProps) => {\n const grid = useGridInstance();\n const column = props.baseColumn;\n const theme = useTheme();\n const styles = getReadOnlyCellStyles(theme);\n const record: IRecord = (() => {\n //this is so we can load the updated record values from state\n const updatedRecord = grid.recordUpdateService.record(props.data.getRecordId()).get() as any;\n return updatedRecord ?? props.data;\n })();\n const formattedValue = record.getFormattedValue(column.name);\n\n const renderLink = (props: ILinkProps, formattedValue: string \| null): JSX.Element => {\n switch (column.dataType) {\n case DataType.LOOKUP_OWNER:\n case DataType.LOOKUP_SIMPLE:\n case DataType.LOOKUP_CUSTOMER: {\n if (!grid.isNavigationEnabled) {\n return renderText();\n }\n }\n }\n if (!formattedValue) {\n return <></>\n }\n return (\n <Link {...props} className={styles.link} title={formattedValue}>\n {formattedValue}\n </Link>\n );\n };\n const renderText = (): JSX.Element => {\n if (column.isPrimary && grid.isNavigationEnabled) {\n return renderLink({\n onClick: () => grid.openDatasetItem(record.getNamedReference())\n }, formattedValue);\n }\n return <Text className={`${styles.text} talxis-cell-text`} title={formattedValue!}>{formattedValue}</Text>\n }\n const downloadFile = () => {\n const storage = new FileAttribute(grid.pcfContext.webAPI);\n const namedReference = record.getNamedReference();\n storage.downloadFileFromAttribute({\n //@ts-ignore - PowerApps do not follow the typings\n entityName: namedReference.etn ?? namedReference.entityName,\n recordId: record.getRecordId(),\n fileAttribute: column.name,\n }, true)\n }\n\n switch (column.dataType) {\n case DataType.SINGLE_LINE_EMAIL: {\n return renderLink({ href: `mailto:${formattedValue}` }, formattedValue);\n }\n case DataType.SINGLE_LINE_PHONE: {\n return renderLink({ href: `tel:${formattedValue}` }, formattedValue);\n }\n case DataType.SINGLE_LINE_URL: {\n return renderLink({\n href: formattedValue ?? \"\",\n target: '_blank',\n rel: 'noopener noreferrer'\n }, formattedValue);\n }\n case DataType.LOOKUP_SIMPLE:\n case DataType.LOOKUP_OWNER:\n case DataType.LOOKUP_CUSTOMER: {\n return renderLink({\n onClick: () => grid.openDatasetItem(record.getValue(column.name) as any)\n }, formattedValue);\n }\n case DataType.FILE: {\n if (!formattedValue) {\n return <></>\n }\n return (\n <div className={styles.fileWrapper}>\n <Icon iconName='Attach' />\n {\n renderLink({\n onClick: downloadFile\n }, grid.labels.download())\n }\n </div>\n )\n }\n case DataType.IMAGE: {\n if (!formattedValue) {\n return <></>\n }\n return (\n <div className={styles.fileWrapper}>\n <Image className={styles.image} src={`data:image/png;base64,${formattedValue}`} />\n {\n renderLink({\n onClick: downloadFile\n }, 'Download')\n }\n </div>\n )\n }\n case DataType.OPTIONSET:\n case DataType.MULTI_SELECT_OPTIONSET:\n case DataType.TWO_OPTIONS: {\n if (grid.enableOptionSetColors) {\n return <ReadOnlyOptionSet\n column={column}\n record={record}\n defaultRender={renderText} />\n }\n return renderText();\n }\n default: {\n return renderText()\n }\n\n }\n}"],"names":["_jsx","_jsxs"],"mappings":"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"}

package/dist/components/Grid/core/components/Cell/ReadOnlyCell/ReadOnlyOptionSet/ReadOnlyOptionSet.d.ts CHANGED Viewed

@@ -1,9 +1,9 @@
-/// <reference types="powerapps-component-framework" />
 import { ReactElement } from "react";
 import { IGridColumn } from "../../../../interfaces/IGridColumn";
+import { IRecord } from "@talxis/client-libraries";
 interface IReadOnlyOptionSet {
     column: IGridColumn;
-    record: ComponentFramework.PropertyHelper.DataSetApi.EntityRecord;
+    record: IRecord;
     defaultRender: () => ReactElement;
 }
 export declare const ReadOnlyOptionSet: (props: IReadOnlyOptionSet) => JSX.Element;

package/dist/components/Grid/core/components/Cell/ReadOnlyCell/ReadOnlyOptionSet/ReadOnlyOptionSet.js CHANGED Viewed

@@ -15,8 +15,8 @@ const ReadOnlyOptionSet = (props) => {
     useEffect(() => {
         (async () => {
             const getOptions = async () => {
-                const [defaultValue, options] = await grid.metadata.getOptions(column);
-                let value = record.getValue(column.key);
+                const [defaultValue, options] = await grid.metadata.getOptions(column.name);
+                let value = record.getValue(column.name);
                 if (column.dataType === DataType.OPTIONSET) {
                     value = value ? [parseInt(value)] : null;
                 }
@@ -31,7 +31,7 @@ const ReadOnlyOptionSet = (props) => {
             const results = await getOptions();
             setOptions(results);
         })();
-    }, [record.getValue(column.key)]);
+    }, [record.getValue(column.name)]);
     //options not loaded yet
     if (options === null) {
         return jsx(Fragment, {});

package/dist/components/Grid/core/components/Cell/ReadOnlyCell/ReadOnlyOptionSet/ReadOnlyOptionSet.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ReadOnlyOptionSet.js","sources":["../../../../../../../../src/components/Grid/core/components/Cell/ReadOnlyCell/ReadOnlyOptionSet/ReadOnlyOptionSet.tsx"],"sourcesContent":["import React, { ReactElement } from \"react\";\nimport { useEffect, useState } from \"react\";\nimport { Text } from '@fluentui/react';\nimport { optionSetStyles } from \"./styles\";\nimport color from 'color';\nimport { useTheme } from \"@fluentui/react\";\nimport { IGridColumn } from \"../../../../interfaces/IGridColumn\";\nimport { useGridInstance } from \"../../../../hooks/useGridInstance\";\nimport { DataType } from \"../../../../enums/DataType\";\n\ninterface IReadOnlyOptionSet {\n column: IGridColumn;\n record: ~~ComponentFramework.PropertyHelper.DataSetApi.EntityRecord;\~~n defaultRender: () => ReactElement\n}\n\nexport const ReadOnlyOptionSet = (props: IReadOnlyOptionSet) => {\n const grid = useGridInstance();\n const { record, column, defaultRender } = { ...props }\n const [options, setOptions] = useState<ComponentFramework.PropertyHelper.OptionMetadata[] \| null>(null);\n const theme = useTheme();\n const defaultColor = theme.palette.neutralLight;\n\n useEffect(() => {\n (async () => {\n const getOptions = async (): Promise<ComponentFramework.PropertyHelper.OptionMetadata[]> => {\n const [defaultValue, options] = await grid.metadata.getOptions(column);\n let value: any = record.getValue(column.~~key~~);\n if (column.dataType === DataType.OPTIONSET) {\n value = value ? [parseInt(value)] : null;\n }\n if (column.dataType === DataType.MULTI_SELECT_OPTIONSET) {\n value = value ? value.split(',').map((value: string) => parseInt(value)) : null;\n }\n if (column.dataType === DataType.TWO_OPTIONS) {\n value = [parseInt(value)];\n }\n return options.filter(option => value?.includes(option.Value)) ?? [];\n }\n const results = await getOptions();\n setOptions(results);\n })();\n }, [record.getValue(column.~~key~~)]);\n\n //options not loaded yet\n if (options === null) {\n return <></>\n }\n //options loaded but either no value selected or no colors are present\n if (options.length === 0 \|\| !options.find(x => x.Color)) {\n return defaultRender();\n }\n else {\n return (\n <div className={optionSetStyles.root}>\n {options.map(x => <div\n key={x.Value}\n title={x.Label}\n className={optionSetStyles.option}\n style={{ backgroundColor: x.Color ?? defaultColor, color: new color(x.Color ?? defaultColor).isDark() ? 'white' : 'black' }}>\n <Text>{x.Label}</Text>\n </div>)}\n </div>\n )\n }\n\n}"],"names":["_jsx","color"],"mappings":";;;;;;;;~~AAgBa~~,MAAA,iBAAiB,GAAG,CAAC,KAAyB,KAAI;AAC3D,IAAA,MAAM,IAAI,GAAG,eAAe,EAAE,CAAC;AAC/B,IAAA,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,aAAa,EAAE,GAAG,EAAE,GAAG,KAAK,EAAE,CAAA;IACtD,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,CAA4D,IAAI,CAAC,CAAC;AACxG,IAAA,MAAM,KAAK,GAAG,QAAQ,EAAE,CAAC;AACzB,IAAA,MAAM,YAAY,GAAG,KAAK,CAAC,OAAO,CAAC,YAAY,CAAC;IAEhD,SAAS,CAAC,MAAK;QACX,CAAC,YAAW;AACR,YAAA,MAAM,UAAU,GAAG,YAAwE;AACvF,gBAAA,MAAM,CAAC,YAAY,EAAE,OAAO,CAAC,GAAG,MAAM,IAAI,CAAC,QAAQ,CAAC,UAAU,CAAC,MAAM,CAAC,CAAC;~~gBACvE~~,IAAI,KAAK,GAAQ,MAAM,CAAC,QAAQ,CAAC,MAAM,CAAC,~~GAAG~~,CAAC,CAAC;~~AAC7C~~,gBAAA,IAAI,MAAM,CAAC,QAAQ,KAAK,QAAQ,CAAC,SAAS,EAAE;AACxC,oBAAA,KAAK,GAAG,KAAK,GAAG,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC,GAAG,IAAI,CAAC;AAC5C,iBAAA;AACD,gBAAA,IAAI,MAAM,CAAC,QAAQ,KAAK,QAAQ,CAAC,sBAAsB,EAAE;AACrD,oBAAA,KAAK,GAAG,KAAK,GAAG,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,GAAG,CAAC,CAAC,KAAa,KAAK,QAAQ,CAAC,KAAK,CAAC,CAAC,GAAG,IAAI,CAAC;AACnF,iBAAA;AACD,gBAAA,IAAI,MAAM,CAAC,QAAQ,KAAK,QAAQ,CAAC,WAAW,EAAE;AAC1C,oBAAA,KAAK,GAAG,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC,CAAC;AAC7B,iBAAA;AACD,gBAAA,OAAO,OAAO,CAAC,MAAM,CAAC,MAAM,IAAI,KAAK,EAAE,QAAQ,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,IAAI,EAAE,CAAC;AACzE,aAAC,CAAA;AACD,YAAA,MAAM,OAAO,GAAG,MAAM,UAAU,EAAE,CAAC;YACnC,UAAU,CAAC,OAAO,CAAC,CAAC;SACvB,GAAG,CAAC;AACT,KAAC,EAAE,CAAC,MAAM,CAAC,QAAQ,CAAC,MAAM,CAAC,~~GAAG~~,CAAC,CAAC,CAAC,CAAC;;~~IAGlC~~,IAAI,OAAO,KAAK,IAAI,EAAE;AAClB,QAAA,OAAOA,iBAAK,CAAA;AACf,KAAA;;AAED,IAAA,IAAI,OAAO,CAAC,MAAM,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,CAAC,KAAK,CAAC,EAAE;QACrD,OAAO,aAAa,EAAE,CAAC;AAC1B,KAAA;AACI,SAAA;AACD,QAAA,QACIA,GAAK,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,eAAe,CAAC,IAAI,EAAA,QAAA,EAC/B,OAAO,CAAC,GAAG,CAAC,CAAC,IAAIA,GAEd,CAAA,KAAA,EAAA,EAAA,KAAK,EAAE,CAAC,CAAC,KAAK,EACd,SAAS,EAAE,eAAe,CAAC,MAAM,EACjC,KAAK,EAAE,EAAE,eAAe,EAAE,CAAC,CAAC,KAAK,IAAI,YAAY,EAAE,KAAK,EAAE,IAAIC,KAAK,CAAC,CAAC,CAAC,KAAK,IAAI,YAAY,CAAC,CAAC,MAAM,EAAE,GAAG,OAAO,GAAG,OAAO,EAAE,EAC3H,QAAA,EAAAD,GAAA,CAAC,IAAI,EAAA,EAAA,QAAA,EAAE,CAAC,CAAC,KAAK,EAAQ,CAAA,EAAA,EAJjB,CAAC,CAAC,KAAK,CAKV,CAAC,EAAA,CACL,EACT;AACJ,KAAA;AAEL;;;;"}
1	+ {"version":3,"file":"ReadOnlyOptionSet.js","sources":["../../../../../../../../src/components/Grid/core/components/Cell/ReadOnlyCell/ReadOnlyOptionSet/ReadOnlyOptionSet.tsx"],"sourcesContent":["import React, { ReactElement } from \"react\";\nimport { useEffect, useState } from \"react\";\nimport { Text } from '@fluentui/react';\nimport { optionSetStyles } from \"./styles\";\nimport color from 'color';\nimport { useTheme } from \"@fluentui/react\";\nimport { IGridColumn } from \"../../../../interfaces/IGridColumn\";\nimport { useGridInstance } from \"../../../../hooks/useGridInstance\";\nimport { DataType } from \"../../../../enums/DataType\";\nimport { IRecord } from \"@talxis/client-libraries\";\n\ninterface IReadOnlyOptionSet {\n column: IGridColumn;\n record: IRecord\n defaultRender: () => ReactElement\n}\n\nexport const ReadOnlyOptionSet = (props: IReadOnlyOptionSet) => {\n const grid = useGridInstance();\n const { record, column, defaultRender } = { ...props }\n const [options, setOptions] = useState<ComponentFramework.PropertyHelper.OptionMetadata[] \| null>(null);\n const theme = useTheme();\n const defaultColor = theme.palette.neutralLight;\n\n useEffect(() => {\n (async () => {\n const getOptions = async (): Promise<ComponentFramework.PropertyHelper.OptionMetadata[]> => {\n const [defaultValue, options] = await grid.metadata.getOptions(column.name);\n let value: any = record.getValue(column.name);\n if (column.dataType === DataType.OPTIONSET) {\n value = value ? [parseInt(value)] : null;\n }\n if (column.dataType === DataType.MULTI_SELECT_OPTIONSET) {\n value = value ? value.split(',').map((value: string) => parseInt(value)) : null;\n }\n if (column.dataType === DataType.TWO_OPTIONS) {\n value = [parseInt(value)];\n }\n return options.filter(option => value?.includes(option.Value)) ?? [];\n }\n const results = await getOptions();\n setOptions(results);\n })();\n }, [record.getValue(column.name)]);\n\n //options not loaded yet\n if (options === null) {\n return <></>\n }\n //options loaded but either no value selected or no colors are present\n if (options.length === 0 \|\| !options.find(x => x.Color)) {\n return defaultRender();\n }\n else {\n return (\n <div className={optionSetStyles.root}>\n {options.map(x => <div\n key={x.Value}\n title={x.Label}\n className={optionSetStyles.option}\n style={{ backgroundColor: x.Color ?? defaultColor, color: new color(x.Color ?? defaultColor).isDark() ? 'white' : 'black' }}>\n <Text>{x.Label}</Text>\n </div>)}\n </div>\n )\n }\n\n}"],"names":["_jsx","color"],"mappings":"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"}