@evergis/react 3.1.72 → 3.1.74

package/dist/react.esm.js

@@ -5685,15 +5685,16 @@ const OneColumnContainer = memo(({ elementConfig, renderElement }) => {
 const TwoColumnContainer = memo(({ config, elementConfig, type, renderElement }) => {
     const { selectedTabId, layerInfo, attributes } = useWidgetContext(type);
     const { attributes: renderAttributes } = elementConfig?.options || {};
-    const renderContainer = useCallback((element, attribute) => {
-        const { id, options, style, children } = element || {};
+    const renderContainer = useCallback((attribute) => {
+        const { id, options, style, children } = elementConfig || {};
         const { hideEmpty, innerTemplateStyle } = options || {};
         const hasUnits = children?.some(({ id }) => id === "units");
         const iconIndex = children?.findIndex(({ id }) => id === "icon");
         const icon = children?.[iconIndex];
         const hasIcon = !!icon;
-        const elementChildren = element?.children?.map(child => ({
+        const elementChildren = elementConfig?.children?.map(child => ({
             ...child,
+            type: "attributeValue",
             attributeName: attribute,
             options: { noUnits: hasUnits, ...child.options },
         }));
@@ -5712,7 +5713,7 @@ const TwoColumnContainer = memo(({ config, elementConfig, type, renderElement })
             ? getRenderElement({
                 config,
                 elementConfig: {
-                    ...element,
+                    ...elementConfig,
                     children: elementChildren,
                 },
                 selectedTabId,
@@ -5725,8 +5726,8 @@ const TwoColumnContainer = memo(({ config, elementConfig, type, renderElement })
         if (!value && hideEmpty)
             return null;
         return (jsxs(TwoColumnContainerWrapper, { id: id, style: innerTemplateStyle || style, children: [jsxs(ContainerAlias, { children: [hasIcon && jsx(ContainerAliasIcon, { children: render({ id: "icon" }) }), render({ id: "alias" }), render({ id: "tooltip" })] }), jsxs(ContainerValue, { big: true, children: [value, hasUnits && jsx(ContainerUnits, { children: render({ id: "units" }) })] })] }, attribute));
-    }, [attributes, config, getRenderElement, layerInfo, renderElement, selectedTabId, type]);
-    return renderAttributes?.length ? (jsx(Fragment$1, { children: renderAttributes.map(attribute => renderContainer(elementConfig, attribute)) })) : (renderContainer(elementConfig));
+    }, [attributes, config, getRenderElement, layerInfo, renderElement, selectedTabId, type, elementConfig]);
+    return renderAttributes?.length ? (jsx(Fragment$1, { children: renderAttributes.map(attribute => renderContainer(attribute)) })) : (renderContainer());
 });
 
 const InnerContainerWrapper = styled.div `
@@ -7203,7 +7204,7 @@ const PageTitle = styled(H2) `
 const DashboardDefaultHeader = memo(() => {
     const { components: { ProjectCatalogMenu, ProjectPanelMenu, ProjectPagesMenu }, } = useWidgetContext();
     const { pageId, image, icon, tooltip, themeName } = useDashboardHeader();
-    return (jsxs(DefaultHeaderContainer, { image: image, isDark: themeName === ThemeName.Dark, children: [!pageId && jsx(LinearProgress, {}), jsxs(Flex, { column: true, gap: "1rem", children: [jsx(FlexSpan, { children: jsxs(TopContainer, { children: [jsx(LogoContainer, { children: icon }), jsxs(TopContainerButtons, { children: [jsx(ProjectCatalogMenu, {}), jsx(ProjectPanelMenu, {})] })] }) }), jsx(FlexSpan, { children: jsx(Flex, { column: true, gap: "0.25rem", children: jsx(FlexSpan, { children: jsxs(Flex, { alignItems: "center", children: [jsx(FlexSpan, { flexGrow: 1, children: jsx(Tooltip$1, { arrow: true, content: tooltip, children: ref => (jsx(PageTitle, { ref: ref, children: jsx(ProjectPagesMenu, {}) })) }) }), jsx(FlexSpan, { children: jsx(Pagination, {}) })] }) }) }) })] })] }));
+    return (jsxs(DefaultHeaderContainer, { image: getResourceUrl(image), isDark: themeName === ThemeName.Dark, children: [!pageId && jsx(LinearProgress, {}), jsxs(Flex, { column: true, gap: "1rem", children: [jsx(FlexSpan, { children: jsxs(TopContainer, { children: [jsx(LogoContainer, { children: icon }), jsxs(TopContainerButtons, { children: [jsx(ProjectCatalogMenu, {}), jsx(ProjectPanelMenu, {})] })] }) }), jsx(FlexSpan, { children: jsx(Flex, { column: true, gap: "0.25rem", children: jsx(FlexSpan, { children: jsxs(Flex, { alignItems: "center", children: [jsx(FlexSpan, { flexGrow: 1, children: jsx(Tooltip$1, { arrow: true, content: tooltip, children: ref => (jsx(PageTitle, { ref: ref, children: jsx(ProjectPagesMenu, {}) })) }) }), jsx(FlexSpan, { children: jsx(Pagination, {}) })] }) }) }) })] })] }));
 });
 
 const HeaderFrontView = styled(Flex) `
@@ -7415,9 +7416,11 @@ const GradientHeaderWrapper = styled.div `
 const FeatureCardGradientHeader = ({ isRow }) => {
     const { layerInfo } = useWidgetContext(WidgetType.FeatureCard);
     const { config } = useWidgetConfig(WidgetType.FeatureCard);
-    const { header, options } = config || {};
+    const { header } = config || {};
+    const { options } = header || {};
+    const { fontColor, bgColor } = options || {};
     const renderElement = useHeaderRender(header);
-    return (jsx(GradientHeaderWrapper, { "$fontColor": options?.fontColor, "$bgColor": options?.bgColor, children: jsx(ThemeProvider, { theme: defaultTheme, children: jsx(Header, { "$isRow": isRow, children: jsxs(HeaderFrontView, { children: [jsxs(HeaderContainer, { children: [jsx(LayerIcon, { layerInfo: layerInfo }), jsx(FeatureCardTitle, { title: renderElement({
+    return (jsx(GradientHeaderWrapper, { "$fontColor": fontColor, "$bgColor": bgColor, children: jsx(ThemeProvider, { theme: defaultTheme, children: jsx(Header, { "$isRow": isRow, children: jsxs(HeaderFrontView, { children: [jsxs(HeaderContainer, { children: [jsx(LayerIcon, { layerInfo: layerInfo }), jsx(FeatureCardTitle, { title: renderElement({
                                         id: "title",
                                         wrap: false,
                                     }), description: renderElement({
@@ -7505,9 +7508,11 @@ const IconHeaderWrapper = styled.div `
 const FeatureCardIconHeader = ({ isRow }) => {
     const { layerInfo } = useWidgetContext(WidgetType.FeatureCard);
     const { config } = useWidgetConfig(WidgetType.FeatureCard);
-    const { header, options } = config || {};
+    const { header } = config || {};
+    const { options } = header || {};
+    const { fontColor, bgColor, bigIcon } = options || {};
     const renderElement = useHeaderRender(header);
-    return (jsx(IconHeaderWrapper, { "$fontColor": options?.fontColor, "$bgColor": options?.bgColor, "$bigIcon": options?.bigIcon, children: jsx(ThemeProvider, { theme: defaultTheme, children: jsxs(Header, { "$isRow": isRow, children: [jsxs(HeaderFrontView, { children: [jsxs(HeaderContainer, { children: [jsx(LayerIcon, { layerInfo: layerInfo }), jsx(FeatureCardTitle, { title: renderElement({
+    return (jsx(IconHeaderWrapper, { "$fontColor": fontColor, "$bgColor": bgColor, "$bigIcon": bigIcon, children: jsx(ThemeProvider, { theme: defaultTheme, children: jsxs(Header, { "$isRow": isRow, children: [jsxs(HeaderFrontView, { children: [jsxs(HeaderContainer, { children: [jsx(LayerIcon, { layerInfo: layerInfo }), jsx(FeatureCardTitle, { title: renderElement({
                                             id: "title",
                                             wrap: false,
                                         }), description: renderElement({
@@ -8310,9 +8315,11 @@ const HeaderSlideshow = styled.div `
 const FeatureCardSlideshowHeader = ({ isRow }) => {
     const { layerInfo } = useWidgetContext(WidgetType.FeatureCard);
     const { config } = useWidgetConfig(WidgetType.FeatureCard);
-    const { header, options } = config || {};
+    const { header } = config || {};
+    const { options } = header || {};
+    const { height, withPadding } = options || {};
     const renderElement = useHeaderRender(header);
-    return (jsx(SlideshowHeaderWrapper, { big: true, withPadding: options?.withPadding, children: jsx(ThemeProvider, { theme: darkTheme, children: jsxs(Header, { "$isRow": isRow, children: [jsxs(HeaderFrontView, { children: [jsxs(HeaderContainer, { children: [jsx(LayerIcon, { layerInfo: layerInfo }), jsx(FeatureCardTitle, { title: renderElement({
+    return (jsx(SlideshowHeaderWrapper, { big: true, withPadding: withPadding, children: jsx(ThemeProvider, { theme: darkTheme, children: jsxs(Header, { "$isRow": isRow, children: [jsxs(HeaderFrontView, { children: [jsxs(HeaderContainer, { children: [jsx(LayerIcon, { layerInfo: layerInfo }), jsx(FeatureCardTitle, { title: renderElement({
                                             id: "title",
                                             wrap: false,
                                         }), description: renderElement({
@@ -8321,7 +8328,7 @@ const FeatureCardSlideshowHeader = ({ isRow }) => {
                                         }) })] }), jsx(FeatureCardButtons, {})] }), jsx(ImageContainerBg, { children: renderElement({
                             id: "bgImage",
                             wrap: false,
-                        }) }), jsx(HeaderSlideshow, { height: options?.height, children: renderElement({
+                        }) }), jsx(HeaderSlideshow, { height: height, children: renderElement({
                             id: "slideshow",
                             wrap: false,
                         }) })] }) }) }));
@@ -10613,7 +10620,7 @@ const ContainerChildren = memo(({ type, items, isColumn, isMain, renderElement }
             });
             if (checkIfEmptyDataSource(item.options?.hideIfEmptyDataSource))
                 return null;
-            return isMain ? (jsx(ContainerWrapper, { "data-id": item.id, "data-templatename": item.templateName, "$noMargin": item.options?.noMargin, children: jsx(DashboardWrapper, { children: render }) }, index)) : (jsx(Fragment, { children: render }, index));
+            return isMain ? (jsx(ContainerWrapper, { "$noMargin": item.options?.noMargin, children: jsx(DashboardWrapper, { children: render }) }, index)) : (jsx(Fragment, { children: render }, index));
         }) }));
 });