@talxis/base-controls 0.0.1

package/dist/components/GridCellRenderer/RecordCommands/RecordCommands.js

@@ -0,0 +1,103 @@
+import { jsx } from 'react/jsx-runtime';
+import { useThemeGenerator, useRerender, useResizeObserver, CommandBar } from '@talxis/react-components';
+import { useComponentProps } from '../useComponentProps.js';
+import { Icon } from './Icon.js';
+import { ThemeProvider } from '@fluentui/react';
+import { useRef, useMemo, useEffect } from 'react';
+import { getRecordCommandsStyles } from './styles.js';
+
+const fluentIconMap = {
+    'Activate': 'ActivateOrders',
+    'DeActivate': 'DeactivateOrders',
+    'ExportToExcel': 'ExcelDocument',
+    'ConnectionToOther': 'Assign',
+    'EmailLink': 'Link',
+    'Flows': 'Dataflows',
+    'RunReport': 'CRMReport',
+    'Report': 'CRMReport',
+    'Remove': 'Delete',
+    'WordTemplates': 'WordDocument',
+    'DocumentTemplates': 'ExcelDocument',
+    'New': 'Add',
+};
+const RecordCommands = (props) => {
+    const commands = props.commands;
+    const commandBarRef = useRef(null);
+    const containerRef = useRef(null);
+    const styles = useMemo(() => getRecordCommandsStyles(props.alignment), [props.alignment]);
+    const theme = useThemeGenerator(props.theme.semanticColors.bodyText, props.theme.semanticColors.bodyBackground, props.theme.semanticColors.bodyText, props.themeOverride);
+    const contextualMenuTheme = useThemeGenerator(props.applicationTheme.semanticColors.bodyText, props.applicationTheme.semanticColors.bodyBackground, props.applicationTheme.semanticColors.bodyText, props.themeOverride);
+    const pendingActionsSet = useRef(new Set());
+    const rerender = useRerender();
+    const observe = useResizeObserver(() => {
+        commandBarRef.current?.remeasure();
+    });
+    const getCommandBarItems = (commands) => {
+        const result = [];
+        commands.map(command => {
+            //@ts-ignore - portal internal types
+            if (!command.shouldBeVisible || (command.__isInline !== undefined && command.__isInline === false)) {
+                return;
+            }
+            let iconName = command.icon;
+            if (fluentIconMap[iconName]) {
+                iconName = fluentIconMap[iconName];
+            }
+            result.push({
+                key: command.commandId,
+                text: command.label,
+                disabled: !command.canExecute || pendingActionsSet.current.has(command.commandId),
+                ["data-id"]: command?.commandButtonId,
+                ["data-command"]: command?.commandId,
+                title: command?.tooltip,
+                iconProps: {
+                    iconName: iconName
+                },
+                onClick: () => {
+                    (async () => {
+                        pendingActionsSet.current.add(command.commandId);
+                        rerender();
+                        try {
+                            await command.execute();
+                        }
+                        catch (err) {
+                            console.error(err);
+                        }
+                        finally {
+                            pendingActionsSet.current.delete(command.commandId);
+                            rerender();
+                        }
+                    })();
+                },
+                onRenderIcon: iconName?.includes('svg') ? () => jsx(Icon, { name: iconName }) : undefined,
+            });
+        });
+        return result;
+    };
+    const getComponentProps = () => {
+        return {
+            containerProps: {
+                theme: theme,
+                ref: containerRef,
+                className: styles.recordCommandsContainer
+            },
+            commandBarProps: {
+                componentRef: commandBarRef,
+                className: styles.recordCommandsRoot,
+                contextualMenuTheme: contextualMenuTheme,
+                styles: {
+                    primarySet: styles.recordCommandsPrimarySet
+                },
+                items: getCommandBarItems(commands)
+            }
+        };
+    };
+    const componentProps = useComponentProps().onGetRecordCommandsProps(getComponentProps());
+    useEffect(() => {
+        observe(containerRef.current);
+    }, []);
+    return jsx(ThemeProvider, { ...componentProps.containerProps, children: jsx(CommandBar, { ...componentProps.commandBarProps }) });
+};
+
+export { RecordCommands };
+//# sourceMappingURL=RecordCommands.js.map

package/dist/components/GridCellRenderer/RecordCommands/RecordCommands.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RecordCommands.js","sources":["../../../../src/components/GridCellRenderer/RecordCommands/RecordCommands.tsx"],"sourcesContent":["import { CommandBar, ICommandBarItemProps, ITheme, useRerender, useResizeObserver, useThemeGenerator, withButtonLoading } from \"@talxis/react-components\";\nimport { useComponentProps } from \"../useComponentProps\";\nimport { IRecordCommandsProps } from \"../interfaces\";\nimport { Icon } from \"./Icon\";\nimport { ICommandBar, PartialTheme, ThemeProvider } from \"@fluentui/react\";\nimport { useEffect, useMemo, useRef } from \"react\";\nimport { getRecordCommandsStyles } from \"./styles\";\nimport { IColumn, ICommand } from \"@talxis/client-libraries\";\n\ninterface IRecordCommands {\n    commands: ICommand[];\n    theme: ITheme;\n    applicationTheme: ITheme;\n    alignment: Required<IColumn['alignment']>;\n    themeOverride?: PartialTheme;\n}\n\nconst fluentIconMap: { [key: string]: string } = {\n    'Activate': 'ActivateOrders',\n    'DeActivate': 'DeactivateOrders',\n    'ExportToExcel': 'ExcelDocument',\n    'ConnectionToOther': 'Assign',\n    'EmailLink': 'Link',\n    'Flows': 'Dataflows',\n    'RunReport': 'CRMReport',\n    'Report': 'CRMReport',\n    'Remove': 'Delete',\n    'WordTemplates': 'WordDocument',\n    'DocumentTemplates': 'ExcelDocument',\n    'New': 'Add',\n}\n\nexport const RecordCommands = (props: IRecordCommands) => {\n    const commands = props.commands;\n    const commandBarRef = useRef<ICommandBar>(null);\n    const containerRef = useRef<HTMLDivElement>(null);\n    const styles = useMemo(() => getRecordCommandsStyles(props.alignment), [props.alignment])\n    const theme = useThemeGenerator(props.theme.semanticColors.bodyText, props.theme.semanticColors.bodyBackground, props.theme.semanticColors.bodyText, props.themeOverride);\n    const contextualMenuTheme = useThemeGenerator(props.applicationTheme.semanticColors.bodyText, props.applicationTheme.semanticColors.bodyBackground, props.applicationTheme.semanticColors.bodyText, props.themeOverride);\n    const pendingActionsSet = useRef<Set<string>>(new Set());\n    const rerender = useRerender();\n\n    const observe = useResizeObserver(() => {\n        commandBarRef.current?.remeasure();\n    });\n\n    const getCommandBarItems = (commands: ICommand[]): ICommandBarItemProps[] => {\n        const result: ICommandBarItemProps[] = [];\n        commands.map(command => {\n            //@ts-ignore - portal internal types\n            if (!command.shouldBeVisible || (command.__isInline !== undefined && command.__isInline === false)) {\n                return;\n            }\n            let iconName = command.icon;\n            if (fluentIconMap[iconName]) {\n                iconName = fluentIconMap[iconName];\n            }\n            result.push({\n                key: command.commandId,\n                text: command.label,\n                disabled: !command.canExecute || pendingActionsSet.current.has(command.commandId),\n                [\"data-id\"]: command?.commandButtonId,\n                [\"data-command\"]: command?.commandId,\n                title: command?.tooltip,\n                iconProps: {\n                    iconName: iconName\n                },\n                onClick: () => {\n                    (async () => {\n                        pendingActionsSet.current.add(command.commandId);\n                        rerender();\n                        try {\n                            await command.execute();\n                        }\n                        catch (err) {\n                            console.error(err);\n                        }\n                        finally {\n                            pendingActionsSet.current.delete(command.commandId);\n                            rerender();\n                        }\n                    })();\n                },\n                onRenderIcon: iconName?.includes('svg') ? () => <Icon name={iconName} /> : undefined,\n            })\n        })\n        return result;\n    }\n\n    const getComponentProps = (): IRecordCommandsProps => {\n        return {\n            containerProps: {\n                theme: theme,\n                ref: containerRef,\n                className: styles.recordCommandsContainer\n            },\n            commandBarProps: {\n                componentRef: commandBarRef,\n                className: styles.recordCommandsRoot,\n                contextualMenuTheme: contextualMenuTheme,\n                styles: {\n                    primarySet: styles.recordCommandsPrimarySet\n                },\n                items: getCommandBarItems(commands)\n            }\n        }\n    }\n\n    const componentProps = useComponentProps().onGetRecordCommandsProps(getComponentProps());\n\n    useEffect(() => {\n        observe(containerRef.current!);\n    }, []);\n\n    return <ThemeProvider {...componentProps.containerProps}><CommandBar {...componentProps.commandBarProps} /></ThemeProvider>\n}"],"names":["_jsx"],"mappings":"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"}

package/dist/components/GridCellRenderer/RecordCommands/styles.d.ts

@@ -0,0 +1,13 @@
+import { IColumn } from "@talxis/client-libraries";
+export declare const getRecordCommandsStyles: (alignment: Required<IColumn['alignment']>) => import("@fluentui/react").IProcessedStyleSet<{
+    recordCommandsRoot: {};
+    recordCommandsPrimarySet: {
+        justifyContent: string | undefined;
+    };
+    recordCommandsContainer: {
+        display: string;
+        flexDirection: string;
+        height: string;
+        justifyContent: string;
+    };
+}>;

package/dist/components/GridCellRenderer/RecordCommands/styles.js

@@ -0,0 +1,32 @@
+import { mergeStyleSets } from '@fluentui/react';
+
+const getRecordCommandsStyles = (alignment) => {
+    return mergeStyleSets({
+        recordCommandsRoot: {},
+        recordCommandsPrimarySet: {
+            justifyContent: getJustifyContent(alignment)
+        },
+        recordCommandsContainer: {
+            display: 'flex',
+            flexDirection: 'column',
+            height: '100%',
+            justifyContent: 'center'
+        }
+    });
+};
+const getJustifyContent = (columnAlignment) => {
+    switch (columnAlignment) {
+        case 'left': {
+            return 'flex-start';
+        }
+        case 'center': {
+            return 'center';
+        }
+        case 'right': {
+            return 'flex-end';
+        }
+    }
+};
+
+export { getRecordCommandsStyles };
+//# sourceMappingURL=styles.js.map

package/dist/components/GridCellRenderer/RecordCommands/styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"styles.js","sources":["../../../../src/components/GridCellRenderer/RecordCommands/styles.ts"],"sourcesContent":["import { mergeStyleSets } from \"@fluentui/react\"\nimport { IColumn } from \"@talxis/client-libraries\"\n\nexport const getRecordCommandsStyles = (alignment: Required<IColumn['alignment']>) => {\n    return mergeStyleSets({\n        recordCommandsRoot: {\n\n        },\n        recordCommandsPrimarySet: {\n            justifyContent: getJustifyContent(alignment)\n        },\n        recordCommandsContainer: {\n            display: 'flex',\n            flexDirection: 'column',\n            height: '100%',\n            justifyContent: 'center'\n        }   \n    })\n}\n\nconst getJustifyContent = (columnAlignment: Required<IColumn['alignment']>) => {\n    switch(columnAlignment) {\n        case 'left': {\n            return 'flex-start'\n        }\n        case 'center': {\n            return 'center'\n        }\n        case 'right': {\n            return 'flex-end'\n        }\n    }\n}"],"names":[],"mappings":";;AAGa,MAAA,uBAAuB,GAAG,CAAC,SAAyC,KAAI;AACjF,IAAA,OAAO,cAAc,CAAC;AAClB,QAAA,kBAAkB,EAAE,EAEnB;AACD,QAAA,wBAAwB,EAAE;AACtB,YAAA,cAAc,EAAE,iBAAiB,CAAC,SAAS,CAAC;AAC/C,SAAA;AACD,QAAA,uBAAuB,EAAE;AACrB,YAAA,OAAO,EAAE,MAAM;AACf,YAAA,aAAa,EAAE,QAAQ;AACvB,YAAA,MAAM,EAAE,MAAM;AACd,YAAA,cAAc,EAAE,QAAQ;AAC3B,SAAA;AACJ,KAAA,CAAC,CAAA;AACN,EAAC;AAED,MAAM,iBAAiB,GAAG,CAAC,eAA+C,KAAI;AAC1E,IAAA,QAAO,eAAe;QAClB,KAAK,MAAM,EAAE;AACT,YAAA,OAAO,YAAY,CAAA;AACtB,SAAA;QACD,KAAK,QAAQ,EAAE;AACX,YAAA,OAAO,QAAQ,CAAA;AAClB,SAAA;QACD,KAAK,OAAO,EAAE;AACV,YAAA,OAAO,UAAU,CAAA;AACpB,SAAA;AACJ,KAAA;AACL,CAAC;;;;"}

package/dist/components/GridCellRenderer/index.d.ts

@@ -0,0 +1,2 @@
+export * from './GridCellRenderer';
+export * from './interfaces';

package/dist/components/GridCellRenderer/index.js

@@ -0,0 +1,2 @@
+export { GridCellRenderer } from './GridCellRenderer.js';
+//# sourceMappingURL=index.js.map

package/dist/components/GridCellRenderer/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/dist/components/GridCellRenderer/interfaces.d.ts

@@ -0,0 +1,66 @@
+/// <reference types="@types/powerapps-component-framework" />
+/// <reference types="react" />
+import { AggregationFunction, IColumn, ICommand, IDataset, IRecord } from "@talxis/client-libraries";
+import { IControl, IParameters, IStringProperty, ITwoOptionsProperty } from "../../interfaces";
+import { getDefaultGridRendererTranslations } from "./translations";
+import { IIconProps, IImageProps, ILabelProps, ILinkProps, ISpinnerProps, ITextProps, ThemeProviderProps } from "@fluentui/react";
+import { ICommandBarProps } from "@talxis/react-components";
+export interface IGridCellRenderer extends IControl<IGridCellRendererParameters, {}, ReturnType<typeof getDefaultGridRendererTranslations>, IGridCellRendererComponentProps> {
+}
+export interface IGridCellRendererParameters extends IParameters {
+    value: any;
+    ColumnAlignment: Omit<ComponentFramework.PropertyTypes.EnumProperty<"left" | "center" | "right">, 'type'>;
+    CellType: Omit<ComponentFramework.PropertyTypes.EnumProperty<"renderer" | "editor">, 'type'>;
+    EnableNavigation: Omit<ITwoOptionsProperty, 'attributes'>;
+    PrefixIcon?: IStringProperty;
+    SuffixIcon?: IStringProperty;
+    AggregationFunction: Omit<ComponentFramework.PropertyTypes.EnumProperty<AggregationFunction | null>, 'type'>;
+    Column: {
+        raw: IColumn;
+    };
+    Dataset: {
+        raw: IDataset;
+    };
+    Record: {
+        raw: IRecord;
+    };
+    RecordCommands?: {
+        raw: ICommand[];
+    };
+}
+export interface IOptionSetProps {
+    containerProps: React.HTMLAttributes<HTMLDivElement>;
+    onGetOptionProps: (props: IOptionProps) => IOptionProps;
+}
+export interface IOptionProps {
+    containerProps: ThemeProviderProps;
+    option: ComponentFramework.PropertyHelper.OptionMetadata;
+    textProps: ITextProps;
+}
+export interface IRecordCommandsProps {
+    containerProps: ThemeProviderProps;
+    commandBarProps: ICommandBarProps;
+}
+export interface IGridCellRendererComponentProps {
+    onGetOptionSetProps: (props: IOptionSetProps) => IOptionSetProps;
+    onGetLinkProps: (props: ILinkProps) => ILinkProps;
+    onGetRecordCommandsProps: (props: IRecordCommandsProps) => IRecordCommandsProps;
+    onRenderContent: (defaultRenderer: () => JSX.Element) => JSX.Element;
+    onRenderAggregationLabel: (props: ILabelProps, defaultRenderer: (props: ILabelProps) => React.ReactElement) => React.ReactElement;
+    rootContainerProps: ThemeProviderProps;
+    prefixSuffixWrapperProps: React.HTMLAttributes<HTMLDivElement>;
+    contentWrapperProps: React.HTMLAttributes<HTMLDivElement>;
+    textProps: ITextProps;
+    fileProps: {
+        containerProps: React.HTMLAttributes<HTMLDivElement>;
+        iconProps: Omit<IIconProps, 'iconName'> & {
+            onGetIconName: (iconName: string) => string;
+        };
+        imageProps: Omit<IImageProps, 'src'> & {
+            onGetSrc: (src: string) => string;
+        };
+        loadingProps: {
+            spinnerProps: ISpinnerProps;
+        };
+    };
+}

package/dist/components/GridCellRenderer/styles.d.ts

@@ -0,0 +1,85 @@
+import { DataType, IColumn } from "@talxis/client-libraries";
+import { ITheme } from "@talxis/react-components";
+export declare const getGridCellLabelStyles: (columnAlignment: IColumn['alignment'], dataType: DataType, rowHeight: number, theme: ITheme) => import("@fluentui/react").IProcessedStyleSet<{
+    root: {
+        height: number;
+        paddingLeft: number;
+        paddingRight: number;
+        display: string;
+        flexDirection: string;
+    };
+    aggregationLabel: {
+        lineHeight: number;
+        textAlign: "left" | "right" | "center" | undefined;
+        color: string;
+        fontSize: number;
+        overflow: string;
+        textOverflow: string;
+    };
+    prefixSuffixContentWrapper: {
+        display: string;
+        flexGrow: number;
+        alignItems: string;
+        justifyContent: string | undefined;
+        gap: number;
+    };
+    fileWrapper: {
+        display: string;
+        gap: number;
+        overflow: string;
+        textOverflow: string;
+        alignItems: string;
+    };
+    contentWrapper: {
+        flexGrow: number;
+        textAlign: "left" | "right" | "center" | undefined;
+        overflow: string;
+        textOverflow: string;
+    };
+    fileImage: {
+        marginRight: number;
+        flexShrink: number;
+        img: {
+            width: number;
+        };
+    };
+    link: {
+        lineHeight?: string | undefined;
+        display?: string | undefined;
+        whiteSpace?: string | undefined;
+        '-webkit-box-orient'?: string | undefined;
+        wordBreak?: string | undefined;
+        '-webkit-line-clamp'?: string | undefined;
+        maxWidth: string;
+        overflow: string;
+        textOverflow: string;
+    };
+    icon: {
+        img: {
+            width: number;
+        };
+    };
+    fileIcon: {
+        fontSize: number;
+    };
+    loadingSpinnerCircle: {
+        width: number;
+        height: number;
+    };
+}>;
+export declare const getDefaultContentRendererStyles: (theme: ITheme, dataType: DataType, rowHeight: number) => import("@fluentui/react").IProcessedStyleSet<{
+    content: {
+        lineHeight?: string | undefined;
+        display?: string | undefined;
+        whiteSpace?: string | undefined;
+        '-webkit-box-orient'?: string | undefined;
+        wordBreak?: string | undefined;
+        '-webkit-line-clamp'?: string | undefined;
+        overflow: string;
+        textOverflow: string;
+        flexGrow: number;
+    };
+    placeholder: {
+        color: string;
+    };
+}>;

package/dist/components/GridCellRenderer/styles.js

@@ -0,0 +1,119 @@
+import { mergeStyleSets } from '@fluentui/react';
+
+const getGridCellLabelStyles = (columnAlignment, dataType, rowHeight, theme) => {
+    return mergeStyleSets({
+        root: {
+            height: rowHeight,
+            paddingLeft: 8,
+            paddingRight: 8,
+            display: 'flex',
+            flexDirection: 'column'
+        },
+        aggregationLabel: {
+            lineHeight: 6,
+            textAlign: columnAlignment,
+            color: theme.semanticColors.infoIcon,
+            fontSize: 12,
+            overflow: 'hidden',
+            textOverflow: 'ellipsis',
+        },
+        prefixSuffixContentWrapper: {
+            display: 'flex',
+            flexGrow: 1,
+            alignItems: 'center',
+            justifyContent: getJustifyContent(columnAlignment),
+            gap: 10,
+        },
+        fileWrapper: {
+            display: 'flex',
+            gap: 5,
+            overflow: 'hidden',
+            textOverflow: 'ellipsis',
+            alignItems: 'center'
+        },
+        contentWrapper: {
+            flexGrow: 1,
+            textAlign: columnAlignment,
+            overflow: 'hidden',
+            textOverflow: 'ellipsis'
+        },
+        fileImage: {
+            marginRight: 5,
+            flexShrink: 0,
+            'img': {
+                width: 32
+            }
+        },
+        link: {
+            maxWidth: '100%',
+            overflow: 'hidden',
+            textOverflow: 'ellipsis',
+            ...(isMultiple(dataType) ? getMultilineStyles(rowHeight, theme) : {})
+        },
+        icon: {
+            'img': {
+                width: 20
+            }
+        },
+        fileIcon: {
+            fontSize: 18
+        },
+        loadingSpinnerCircle: {
+            width: 20,
+            height: 20
+        }
+    });
+};
+const getDefaultContentRendererStyles = (theme, dataType, rowHeight) => {
+    return mergeStyleSets({
+        content: {
+            overflow: 'hidden',
+            textOverflow: 'ellipsis',
+            flexGrow: 1,
+            ...(isMultiple(dataType) ? getMultilineStyles(rowHeight, theme) : {})
+        },
+        placeholder: {
+            color: theme.semanticColors.inputPlaceholderText
+        }
+    });
+};
+const getJustifyContent = (columnAlignment) => {
+    switch (columnAlignment) {
+        case 'left': {
+            return 'flex-start';
+        }
+        case 'center': {
+            return 'center';
+        }
+        case 'right': {
+            return 'flex-end';
+        }
+    }
+};
+const getMultilineStyles = (rowHeight, theme) => {
+    rowHeight = rowHeight + 1;
+    let fontSize = 20;
+    const themeFontSize = theme.fonts.medium.fontSize;
+    theme.fonts.medium.lineHeight;
+    if (typeof themeFontSize === 'number') {
+        fontSize = themeFontSize;
+    }
+    else if (typeof themeFontSize === 'string' && themeFontSize.endsWith('px')) {
+        fontSize = parseInt(themeFontSize.replace('px', ''));
+    }
+    const clamp = Math.floor(rowHeight / fontSize) - 1;
+    return {
+        lineHeight: '1.2',
+        display: '-webkit-box',
+        whiteSpace: 'normal',
+        '-webkit-box-orient': 'vertical',
+        wordBreak: 'break-all',
+        '-webkit-line-clamp': clamp.toString(),
+    };
+};
+const isMultiple = (dataType) => {
+    return dataType === 'Multiple' || dataType === 'SingleLine.TextArea';
+};
+
+export { getDefaultContentRendererStyles, getGridCellLabelStyles };
+//# sourceMappingURL=styles.js.map

package/dist/components/GridCellRenderer/styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"styles.js","sources":["../../../src/components/GridCellRenderer/styles.ts"],"sourcesContent":["import { mergeStyleSets } from \"@fluentui/react\"\nimport { DataType, IColumn } from \"@talxis/client-libraries\";\nimport { ITheme } from \"@talxis/react-components\";\n\nexport const getGridCellLabelStyles = (columnAlignment: IColumn['alignment'], dataType: DataType, rowHeight: number, theme: ITheme) => {\n    return mergeStyleSets({\n        root: {\n            height: rowHeight,\n            paddingLeft: 8,\n            paddingRight: 8,\n            display: 'flex',\n            flexDirection: 'column'\n        },\n        aggregationLabel: {\n            lineHeight: 6,\n            textAlign: columnAlignment,\n            color: theme.semanticColors.infoIcon,\n            fontSize: 12,\n            overflow: 'hidden',\n            textOverflow: 'ellipsis',\n        },\n        prefixSuffixContentWrapper: {\n            display: 'flex',\n            flexGrow: 1,\n            alignItems: 'center',\n            justifyContent: getJustifyContent(columnAlignment),\n            gap: 10,\n\n        },\n        fileWrapper: {\n            display: 'flex',\n            gap: 5,\n            overflow: 'hidden',\n            textOverflow: 'ellipsis',\n            alignItems: 'center'\n        },\n        contentWrapper: {\n            flexGrow: 1,\n            textAlign: columnAlignment,\n            overflow: 'hidden',\n            textOverflow: 'ellipsis'\n        },\n        fileImage: {\n            marginRight: 5,\n            flexShrink: 0,\n            'img': {\n                width: 32\n            }\n        },\n        link: {\n            maxWidth: '100%',\n            overflow: 'hidden',\n            textOverflow: 'ellipsis',\n            ...(isMultiple(dataType) ? getMultilineStyles(rowHeight, theme) : {})\n        },\n        icon: {\n            'img': {\n                width: 20\n            }\n        },\n        fileIcon: {\n            fontSize: 18\n        },\n        loadingSpinnerCircle: {\n            width: 20,\n            height: 20\n        }\n    })\n}\nexport const getDefaultContentRendererStyles = (theme: ITheme, dataType: DataType, rowHeight: number) => {\n    return mergeStyleSets({\n        content: {\n            overflow: 'hidden',\n            textOverflow: 'ellipsis',\n            flexGrow: 1,\n            ...(isMultiple(dataType) ? getMultilineStyles(rowHeight, theme) : {})\n        },\n        placeholder: {\n            color: theme.semanticColors.inputPlaceholderText\n        }\n    });\n}\n\nconst getJustifyContent = (columnAlignment: IColumn['alignment']) => {\n    switch (columnAlignment) {\n        case 'left': {\n            return 'flex-start';\n        }\n        case 'center': {\n            return 'center';\n        }\n        case 'right': {\n            return 'flex-end';\n        }\n    }\n}\n\nconst getMultilineStyles = (rowHeight: number, theme: ITheme) => {\n    rowHeight = rowHeight + 1;\n    let fontSize = 20;\n    const themeFontSize = theme.fonts.medium.fontSize;\n    theme.fonts.medium.lineHeight\n    if (typeof themeFontSize === 'number') {\n        fontSize = themeFontSize;\n    }\n    else if (typeof themeFontSize === 'string' && themeFontSize.endsWith('px')) {\n        fontSize = parseInt(themeFontSize.replace('px', ''));\n    }\n    const clamp = Math.floor(rowHeight / fontSize) - 1;\n    return {\n        lineHeight: '1.2',\n        display: '-webkit-box',\n        whiteSpace: 'normal',\n        '-webkit-box-orient': 'vertical',\n        wordBreak: 'break-all',\n        '-webkit-line-clamp': clamp.toString(),\n    };\n}\n\nconst isMultiple = (dataType: DataType) => {\n    return dataType === 'Multiple' || dataType === 'SingleLine.TextArea';\n}\n"],"names":[],"mappings":"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"}

package/dist/components/GridCellRenderer/translations.d.ts

@@ -0,0 +1,30 @@
+export declare const getDefaultGridRendererTranslations: () => {
+    download: {
+        1029: string;
+        1033: string;
+    };
+    max: {
+        1029: string;
+        1033: string;
+    };
+    min: {
+        1029: string;
+        1033: string;
+    };
+    avg: {
+        1029: string;
+        1033: string;
+    };
+    sum: {
+        1029: string;
+        1033: string;
+    };
+    count: {
+        1029: string;
+        1033: string;
+    };
+    countcolumn: {
+        1029: string;
+        1033: string;
+    };
+};

package/dist/components/GridCellRenderer/translations.js

@@ -0,0 +1,35 @@
+const getDefaultGridRendererTranslations = () => {
+    return {
+        download: {
+            1029: 'Stáhnout',
+            1033: 'Download'
+        },
+        max: {
+            1029: 'Maximum',
+            1033: 'Maximum'
+        },
+        min: {
+            1029: 'Minimum',
+            1033: 'Minimum'
+        },
+        avg: {
+            1029: 'Průměr',
+            1033: 'Average'
+        },
+        sum: {
+            1029: 'Součet',
+            1033: 'Sum'
+        },
+        count: {
+            1029: 'Počet (včetně prázdných hodnot)',
+            1033: 'Count (including empty values)'
+        },
+        countcolumn: {
+            1029: 'Počet',
+            1033: 'Count'
+        }
+    };
+};
+
+export { getDefaultGridRendererTranslations };
+//# sourceMappingURL=translations.js.map

package/dist/components/GridCellRenderer/translations.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"translations.js","sources":["../../../src/components/GridCellRenderer/translations.ts"],"sourcesContent":["export const getDefaultGridRendererTranslations = () => {\n    return {\n        download: {\n            1029: 'Stáhnout',\n            1033: 'Download'\n        },\n        max: {\n            1029: 'Maximum',\n            1033: 'Maximum'\n        },\n        min: {\n            1029: 'Minimum',\n            1033: 'Minimum'\n        },\n        avg: {\n            1029: 'Průměr',\n            1033: 'Average'\n        },\n        sum: {\n            1029: 'Součet',\n            1033: 'Sum'\n        },\n        count: {\n            1029: 'Počet (včetně prázdných hodnot)',\n            1033: 'Count (including empty values)'\n        },\n        countcolumn: {\n            1029: 'Počet',\n            1033: 'Count'\n        }\n    }\n};"],"names":[],"mappings":"AAAO,MAAM,kCAAkC,GAAG,MAAK;IACnD,OAAO;AACH,QAAA,QAAQ,EAAE;AACN,YAAA,IAAI,EAAE,UAAU;AAChB,YAAA,IAAI,EAAE,UAAU;AACnB,SAAA;AACD,QAAA,GAAG,EAAE;AACD,YAAA,IAAI,EAAE,SAAS;AACf,YAAA,IAAI,EAAE,SAAS;AAClB,SAAA;AACD,QAAA,GAAG,EAAE;AACD,YAAA,IAAI,EAAE,SAAS;AACf,YAAA,IAAI,EAAE,SAAS;AAClB,SAAA;AACD,QAAA,GAAG,EAAE;AACD,YAAA,IAAI,EAAE,QAAQ;AACd,YAAA,IAAI,EAAE,SAAS;AAClB,SAAA;AACD,QAAA,GAAG,EAAE;AACD,YAAA,IAAI,EAAE,QAAQ;AACd,YAAA,IAAI,EAAE,KAAK;AACd,SAAA;AACD,QAAA,KAAK,EAAE;AACH,YAAA,IAAI,EAAE,iCAAiC;AACvC,YAAA,IAAI,EAAE,gCAAgC;AACzC,SAAA;AACD,QAAA,WAAW,EAAE;AACT,YAAA,IAAI,EAAE,OAAO;AACb,YAAA,IAAI,EAAE,OAAO;AAChB,SAAA;KACJ,CAAA;AACL;;;;"}

package/dist/components/GridCellRenderer/useComponentProps.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+import { IGridCellRendererComponentProps } from "./interfaces";
+export declare const ComponentPropsContext: import("react").Context<{
+    current: IGridCellRendererComponentProps;
+}>;
+export declare const useComponentProps: () => IGridCellRendererComponentProps;

package/dist/components/GridCellRenderer/useComponentProps.js

@@ -0,0 +1,10 @@
+import { createContext, useContext } from 'react';
+
+const ComponentPropsContext = createContext({});
+const useComponentProps = () => {
+    const context = useContext(ComponentPropsContext);
+    return context.current;
+};
+
+export { ComponentPropsContext, useComponentProps };
+//# sourceMappingURL=useComponentProps.js.map

package/dist/components/GridCellRenderer/useComponentProps.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useComponentProps.js","sources":["../../../src/components/GridCellRenderer/useComponentProps.ts"],"sourcesContent":["import { createContext, useContext } from \"react\";\nimport { IGridCellRendererComponentProps } from \"./interfaces\";\n\n\nexport const ComponentPropsContext = createContext<{\n    current: IGridCellRendererComponentProps\n}>({} as any);\n\nexport const useComponentProps = () => {\n    const context = useContext(ComponentPropsContext);\n    return context.current;\n}"],"names":[],"mappings":";;MAIa,qBAAqB,GAAG,aAAa,CAE/C,EAAS,EAAE;AAEP,MAAM,iBAAiB,GAAG,MAAK;AAClC,IAAA,MAAM,OAAO,GAAG,UAAU,CAAC,qBAAqB,CAAC,CAAC;IAClD,OAAO,OAAO,CAAC,OAAO,CAAC;AAC3B;;;;"}

package/dist/components/Lookup/Lookup.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+import { ILookup } from "./interfaces";
+export declare const Lookup: (props: ILookup) => JSX.Element;