@evergis/react 3.1.127 → 3.1.128

package/dist/components/Dashboard/elements/{ElementDialog → ElementModal}/index.d.ts

@@ -1,3 +1,3 @@
 import { FC } from 'react';
 import { ContainerProps } from '../../types';
-export declare const ElementDialog: FC<ContainerProps>;
+export declare const ElementModal: FC<ContainerProps>;

package/dist/components/Dashboard/elements/ElementModal/styled.d.ts

@@ -0,0 +1 @@
+export declare const ModalIcon: import('styled-components').StyledComponent<"span", any, import('@evergis/uilib-gl').IIconProps, never>;

package/dist/components/Dashboard/elements/registry.d.ts

@@ -15,5 +15,5 @@ export declare const elementComponents: {
     }>;
     readonly markdown: import('react').FC<import('..').ContainerProps>;
     readonly uploader: import('react').FC<import('..').ContainerProps>;
-    readonly dialog: import('react').FC<import('..').ContainerProps>;
+    readonly modal: import('react').FC<import('..').ContainerProps>;
 };

package/dist/components/Dashboard/types.d.ts

@@ -149,7 +149,7 @@ export interface ConfigOptions {
     baseMapName?: string;
     baseMapSettings?: Record<string, BaseMapSettings>;
     expandedLayers?: boolean;
-    dialogId?: string;
+    modalId?: string;
 }
 export interface ConfigDataSource {
     name: string;
@@ -226,20 +226,20 @@ export interface ConfigTask {
     updateDate?: string;
     id?: string;
 }
-export interface ConfigDialogOptions {
+export interface ConfigModalOptions {
     title?: string;
     maxWidth?: string;
     minWidth?: string;
     minHeight?: string;
 }
-export interface ConfigDialogContentRef {
+export interface ConfigModalContentRef {
     containerId: string;
 }
-export type ConfigDialogContentItem = ConfigContainerChild | ConfigDialogContentRef;
-export interface ConfigDialog {
+export type ConfigModalContentItem = ConfigContainerChild | ConfigModalContentRef;
+export interface ConfigModal {
     id: string;
-    options?: ConfigDialogOptions;
-    content: ConfigDialogContentItem[];
+    options?: ConfigModalOptions;
+    children: ConfigModalContentItem[];
 }
 export interface ConfigContainerHeader {
     id?: string;
@@ -254,7 +254,7 @@ export interface ConfigContainer {
     dataSources?: ConfigDataSource[];
     filters?: ConfigFilter[];
     tasks?: ConfigTask[];
-    dialogs?: ConfigDialog[];
+    modals?: ConfigModal[];
     options?: ConfigOptions;
     header?: ConfigContainerHeader;
 }

package/dist/index.js

@@ -6174,7 +6174,7 @@ const OneColumnContainer = React.memo(({ type, elementConfig, renderElement }) =
         const { id, value, hideEmpty, style, hasUnits, render } = getRenderContainerItem(elementConfig, attribute);
         if (!value && hideEmpty)
             return null;
-        return (jsxRuntime.jsxs(Container, { id: id, isColumn: true, style: { ...BASE_CONTAINER_STYLE, ...style }, children: [jsxRuntime.jsxs(ContainerAlias, { hasBottomMargin: true, children: [render({ id: "alias" }), render({ id: "tooltip" }), render({ id: "dialog" })] }), jsxRuntime.jsxs(ContainerValue, { children: [value, hasUnits && (jsxRuntime.jsx(ContainerUnits, { children: render({ id: "units" }) }))] })] }));
+        return (jsxRuntime.jsxs(Container, { id: id, isColumn: true, style: { ...BASE_CONTAINER_STYLE, ...style }, children: [jsxRuntime.jsxs(ContainerAlias, { hasBottomMargin: true, children: [render({ id: "alias" }), render({ id: "tooltip" }), render({ id: "modal" })] }), jsxRuntime.jsxs(ContainerValue, { children: [value, hasUnits && (jsxRuntime.jsx(ContainerUnits, { children: render({ id: "units" }) }))] })] }));
     }, [getRenderContainerItem, elementConfig]);
     return renderAttributes?.length ? (jsxRuntime.jsx(jsxRuntime.Fragment, { children: renderAttributes.map(renderContainer) })) : (renderContainer());
 });
@@ -6187,7 +6187,7 @@ const TwoColumnContainer = React.memo(({ elementConfig, type, renderElement }) =
         const { id, value, hideEmpty, style, hasIcon, hasUnits, render } = getRenderContainerItem(elementConfig, attribute);
         if (!value && hideEmpty)
             return null;
-        return (jsxRuntime.jsxs(TwoColumnContainerWrapper, { id: id, style: style, children: [jsxRuntime.jsxs(ContainerAlias, { children: [hasIcon && (jsxRuntime.jsx(ContainerAliasIcon, { children: render({ id: "icon" }) })), render({ id: "alias" }), render({ id: "tooltip" }), render({ id: "dialog" })] }), jsxRuntime.jsxs(ContainerValue, { big: true, children: [value, hasUnits && (jsxRuntime.jsx(ContainerUnits, { children: render({ id: "units" }) }))] })] }, attribute));
+        return (jsxRuntime.jsxs(TwoColumnContainerWrapper, { id: id, style: style, children: [jsxRuntime.jsxs(ContainerAlias, { children: [hasIcon && (jsxRuntime.jsx(ContainerAliasIcon, { children: render({ id: "icon" }) })), render({ id: "alias" }), render({ id: "tooltip" }), render({ id: "modal" })] }), jsxRuntime.jsxs(ContainerValue, { big: true, children: [value, hasUnits && (jsxRuntime.jsx(ContainerUnits, { children: render({ id: "units" }) }))] })] }, attribute));
     }, [getRenderContainerItem, elementConfig]);
     return renderAttributes?.length ? (jsxRuntime.jsx(jsxRuntime.Fragment, { children: renderAttributes.map(attribute => renderContainer(attribute)) })) : (renderContainer());
 });
@@ -9134,7 +9134,7 @@ const ElementUploader = React.memo(({ elementConfig, type }) => {
     return (jsxRuntime.jsx(UploaderContainer, { id: id, style: style, children: jsxRuntime.jsx("div", { children: jsxRuntime.jsx(uilibGl.Uploader, { currentRef: refInput, title: renderTitle, accept: fileExtensions, width: "100%", fileItems: files, isMultiple: multiSelect, onUpload: onUpload, onDelete: onDelete }) }) }));
 });
 
-const DialogIcon = styled(uilibGl.Icon) `
+const ModalIcon = styled(uilibGl.Icon) `
   &&& {
     cursor: pointer;
 
@@ -9234,15 +9234,15 @@ const getRenderElement = ({ t, config, elementConfig, attributes = [], layerInfo
     });
 };
 
-const ElementDialog = React.memo(({ type = exports.WidgetType.Dashboard, elementConfig }) => {
+const ElementModal = React.memo(({ type = exports.WidgetType.Dashboard, elementConfig }) => {
     const { config } = useWidgetConfig(type);
     const { expandedContainers, attributes, isLoading } = useWidgetContext(type);
     const [isOpen, setIsOpen] = React.useState(false);
     const { options } = elementConfig || {};
-    const { dialogId, icon } = options || {};
-    const dialogConfig = React.useMemo(() => (config?.dialogs ?? []).find(({ id }) => id === dialogId) ?? null, [config?.dialogs, dialogId]);
-    const dialogContent = React.useMemo(() => (dialogConfig?.content ?? []), [dialogConfig]);
-    const renderElementConfig = React.useMemo(() => ({ children: dialogContent }), [dialogContent]);
+    const { modalId, icon } = options || {};
+    const modalConfig = React.useMemo(() => (config?.modals ?? []).find(({ id }) => id === modalId) ?? null, [config?.modals, modalId]);
+    const modalContent = React.useMemo(() => (modalConfig?.children ?? []), [modalConfig]);
+    const renderElementConfig = React.useMemo(() => ({ children: modalContent }), [modalContent]);
     const renderElement = React.useMemo(() => getRenderElement({
         type,
         config,
@@ -9252,11 +9252,11 @@ const ElementDialog = React.memo(({ type = exports.WidgetType.Dashboard, element
     }), [type, config, renderElementConfig, attributes, expandedContainers]);
     const handleOpen = React.useCallback(() => setIsOpen(true), []);
     const handleClose = React.useCallback(() => setIsOpen(false), []);
-    if (!dialogConfig)
+    if (!modalConfig)
         return null;
-    const { options: dialogOptions } = dialogConfig;
-    const { title, maxWidth, minWidth, minHeight } = dialogOptions || {};
-    return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(DialogIcon, { kind: icon || "new_window", onClick: handleOpen }), jsxRuntime.jsxs(uilibGl.Dialog, { isOpen: isOpen, onCloseRequest: handleClose, modal: true, maxWidth: maxWidth, minWidth: minWidth, minHeight: minHeight, style: { paddingBottom: "2rem" }, children: [jsxRuntime.jsx(uilibGl.DialogTitle, { children: jsxRuntime.jsxs(uilibGl.Flex, { justifyContent: "space-between", alignItems: "center", children: [!!title && jsxRuntime.jsx("span", { children: title }), jsxRuntime.jsx(uilibGl.IconButton, { kind: "close", onClick: handleClose })] }) }), jsxRuntime.jsx(uilibGl.DialogContent, { children: isLoading ? (jsxRuntime.jsx(DashboardLoading, {})) : (jsxRuntime.jsx(Container, { isColumn: true, noBorders: true, children: jsxRuntime.jsx(ContainerChildren, { type: type, items: dialogContent, isMain: true, renderElement: renderElement }) })) })] })] }));
+    const { options: modalOptions } = modalConfig;
+    const { title, maxWidth, minWidth, minHeight } = modalOptions || {};
+    return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(ModalIcon, { kind: icon || "new_window", onClick: handleOpen }), jsxRuntime.jsxs(uilibGl.Dialog, { isOpen: isOpen, onCloseRequest: handleClose, modal: true, maxWidth: maxWidth, minWidth: minWidth, minHeight: minHeight, style: { paddingBottom: "2rem" }, children: [jsxRuntime.jsx(uilibGl.DialogTitle, { children: jsxRuntime.jsxs(uilibGl.Flex, { justifyContent: "space-between", alignItems: "center", children: [!!title && jsxRuntime.jsx("span", { children: title }), jsxRuntime.jsx(uilibGl.IconButton, { kind: "close", onClick: handleClose })] }) }), jsxRuntime.jsx(uilibGl.DialogContent, { children: isLoading ? (jsxRuntime.jsx(DashboardLoading, {})) : (jsxRuntime.jsx(Container, { isColumn: true, noBorders: true, children: jsxRuntime.jsx(ContainerChildren, { type: type, items: modalContent, isMain: true, renderElement: renderElement }) })) })] })] }));
 });
 
 const elementComponents = {
@@ -9274,7 +9274,7 @@ const elementComponents = {
     legend: ElementLegend,
     markdown: ElementMarkdown,
     uploader: ElementUploader,
-    dialog: ElementDialog,
+    modal: ElementModal,
 };
 
 const getElementValue = ({ getDefaultContainer, ...props }) => {

package/dist/react.esm.js

@@ -6172,7 +6172,7 @@ const OneColumnContainer = memo(({ type, elementConfig, renderElement }) => {
         const { id, value, hideEmpty, style, hasUnits, render } = getRenderContainerItem(elementConfig, attribute);
         if (!value && hideEmpty)
             return null;
-        return (jsxs(Container, { id: id, isColumn: true, style: { ...BASE_CONTAINER_STYLE, ...style }, children: [jsxs(ContainerAlias, { hasBottomMargin: true, children: [render({ id: "alias" }), render({ id: "tooltip" }), render({ id: "dialog" })] }), jsxs(ContainerValue, { children: [value, hasUnits && (jsx(ContainerUnits, { children: render({ id: "units" }) }))] })] }));
+        return (jsxs(Container, { id: id, isColumn: true, style: { ...BASE_CONTAINER_STYLE, ...style }, children: [jsxs(ContainerAlias, { hasBottomMargin: true, children: [render({ id: "alias" }), render({ id: "tooltip" }), render({ id: "modal" })] }), jsxs(ContainerValue, { children: [value, hasUnits && (jsx(ContainerUnits, { children: render({ id: "units" }) }))] })] }));
     }, [getRenderContainerItem, elementConfig]);
     return renderAttributes?.length ? (jsx(Fragment$1, { children: renderAttributes.map(renderContainer) })) : (renderContainer());
 });
@@ -6185,7 +6185,7 @@ const TwoColumnContainer = memo(({ elementConfig, type, renderElement }) => {
         const { id, value, hideEmpty, style, hasIcon, hasUnits, render } = getRenderContainerItem(elementConfig, attribute);
         if (!value && hideEmpty)
             return null;
-        return (jsxs(TwoColumnContainerWrapper, { id: id, style: style, children: [jsxs(ContainerAlias, { children: [hasIcon && (jsx(ContainerAliasIcon, { children: render({ id: "icon" }) })), render({ id: "alias" }), render({ id: "tooltip" }), render({ id: "dialog" })] }), jsxs(ContainerValue, { big: true, children: [value, hasUnits && (jsx(ContainerUnits, { children: render({ id: "units" }) }))] })] }, attribute));
+        return (jsxs(TwoColumnContainerWrapper, { id: id, style: style, children: [jsxs(ContainerAlias, { children: [hasIcon && (jsx(ContainerAliasIcon, { children: render({ id: "icon" }) })), render({ id: "alias" }), render({ id: "tooltip" }), render({ id: "modal" })] }), jsxs(ContainerValue, { big: true, children: [value, hasUnits && (jsx(ContainerUnits, { children: render({ id: "units" }) }))] })] }, attribute));
     }, [getRenderContainerItem, elementConfig]);
     return renderAttributes?.length ? (jsx(Fragment$1, { children: renderAttributes.map(attribute => renderContainer(attribute)) })) : (renderContainer());
 });
@@ -9132,7 +9132,7 @@ const ElementUploader = memo(({ elementConfig, type }) => {
     return (jsx(UploaderContainer, { id: id, style: style, children: jsx("div", { children: jsx(Uploader, { currentRef: refInput, title: renderTitle, accept: fileExtensions, width: "100%", fileItems: files, isMultiple: multiSelect, onUpload: onUpload, onDelete: onDelete }) }) }));
 });
 
-const DialogIcon = styled(Icon) `
+const ModalIcon = styled(Icon) `
   &&& {
     cursor: pointer;
 
@@ -9232,15 +9232,15 @@ const getRenderElement = ({ t, config, elementConfig, attributes = [], layerInfo
     });
 };
 
-const ElementDialog = memo(({ type = WidgetType.Dashboard, elementConfig }) => {
+const ElementModal = memo(({ type = WidgetType.Dashboard, elementConfig }) => {
     const { config } = useWidgetConfig(type);
     const { expandedContainers, attributes, isLoading } = useWidgetContext(type);
     const [isOpen, setIsOpen] = useState(false);
     const { options } = elementConfig || {};
-    const { dialogId, icon } = options || {};
-    const dialogConfig = useMemo(() => (config?.dialogs ?? []).find(({ id }) => id === dialogId) ?? null, [config?.dialogs, dialogId]);
-    const dialogContent = useMemo(() => (dialogConfig?.content ?? []), [dialogConfig]);
-    const renderElementConfig = useMemo(() => ({ children: dialogContent }), [dialogContent]);
+    const { modalId, icon } = options || {};
+    const modalConfig = useMemo(() => (config?.modals ?? []).find(({ id }) => id === modalId) ?? null, [config?.modals, modalId]);
+    const modalContent = useMemo(() => (modalConfig?.children ?? []), [modalConfig]);
+    const renderElementConfig = useMemo(() => ({ children: modalContent }), [modalContent]);
     const renderElement = useMemo(() => getRenderElement({
         type,
         config,
@@ -9250,11 +9250,11 @@ const ElementDialog = memo(({ type = WidgetType.Dashboard, elementConfig }) => {
     }), [type, config, renderElementConfig, attributes, expandedContainers]);
     const handleOpen = useCallback(() => setIsOpen(true), []);
     const handleClose = useCallback(() => setIsOpen(false), []);
-    if (!dialogConfig)
+    if (!modalConfig)
         return null;
-    const { options: dialogOptions } = dialogConfig;
-    const { title, maxWidth, minWidth, minHeight } = dialogOptions || {};
-    return (jsxs(Fragment$1, { children: [jsx(DialogIcon, { kind: icon || "new_window", onClick: handleOpen }), jsxs(Dialog, { isOpen: isOpen, onCloseRequest: handleClose, modal: true, maxWidth: maxWidth, minWidth: minWidth, minHeight: minHeight, style: { paddingBottom: "2rem" }, children: [jsx(DialogTitle, { children: jsxs(Flex, { justifyContent: "space-between", alignItems: "center", children: [!!title && jsx("span", { children: title }), jsx(IconButton, { kind: "close", onClick: handleClose })] }) }), jsx(DialogContent, { children: isLoading ? (jsx(DashboardLoading, {})) : (jsx(Container, { isColumn: true, noBorders: true, children: jsx(ContainerChildren, { type: type, items: dialogContent, isMain: true, renderElement: renderElement }) })) })] })] }));
+    const { options: modalOptions } = modalConfig;
+    const { title, maxWidth, minWidth, minHeight } = modalOptions || {};
+    return (jsxs(Fragment$1, { children: [jsx(ModalIcon, { kind: icon || "new_window", onClick: handleOpen }), jsxs(Dialog, { isOpen: isOpen, onCloseRequest: handleClose, modal: true, maxWidth: maxWidth, minWidth: minWidth, minHeight: minHeight, style: { paddingBottom: "2rem" }, children: [jsx(DialogTitle, { children: jsxs(Flex, { justifyContent: "space-between", alignItems: "center", children: [!!title && jsx("span", { children: title }), jsx(IconButton, { kind: "close", onClick: handleClose })] }) }), jsx(DialogContent, { children: isLoading ? (jsx(DashboardLoading, {})) : (jsx(Container, { isColumn: true, noBorders: true, children: jsx(ContainerChildren, { type: type, items: modalContent, isMain: true, renderElement: renderElement }) })) })] })] }));
 });
 
 const elementComponents = {
@@ -9272,7 +9272,7 @@ const elementComponents = {
     legend: ElementLegend,
     markdown: ElementMarkdown,
     uploader: ElementUploader,
-    dialog: ElementDialog,
+    modal: ElementModal,
 };
 
 const getElementValue = ({ getDefaultContainer, ...props }) => {

package/package.json

@@ -1,5 +1,5 @@
 {
-  "version": "3.1.127",
+  "version": "3.1.128",
   "name": "@evergis/react",
   "author": "Everpoint",
   "license": "MIT",
@@ -87,5 +87,5 @@
     "uuid": "^13.0.0",
     "wkt": "^0.1.1"
   },
-  "gitHead": "286461673f908c31e8db90696fe26c8bfde7a658"
+  "gitHead": "5e9de94447a1de89751bdb7974b63332c7022766"
 }

package/dist/components/Dashboard/elements/ElementDialog/styled.d.ts

@@ -1 +0,0 @@
-export declare const DialogIcon: import('styled-components').StyledComponent<"span", any, import('@evergis/uilib-gl').IIconProps, never>;