@evergis/react 3.1.75 → 3.1.77

package/dist/components/Dashboard/elements/ElementLink/LocalLink.d.ts

@@ -1,4 +1,5 @@
-import { FC } from 'react';
+import { CSSProperties, FC } from 'react';
 export declare const LocalLink: FC<{
     link: string;
+    style?: CSSProperties;
 }>;

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

@@ -1,4 +1,5 @@
 export declare const ExternalLink: import('styled-components').StyledComponent<any, any, any, any>;
+export declare const Link: import('styled-components').StyledComponent<"a", any, {}, never>;
 export declare const LocalLinkBlank: import('styled-components').StyledComponent<"div", any, import('@evergis/uilib-gl').IBlankProps, never>;
 export declare const LocalLinkButton: import('styled-components').StyledComponent<any, any, any, any>;
 export declare const LocalLinkCopy: import('styled-components').StyledComponent<"div", any, import('@evergis/uilib-gl').FlexProps, never>;

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

@@ -1,5 +1 @@
 export declare const MarkdownWrapper: import('styled-components').StyledComponent<"div", any, {}, never>;
-export declare const SocialIconsWrapper: import('styled-components').StyledComponent<"div", any, import('@evergis/uilib-gl').FlexProps, never>;
-export declare const SocialIconLabel: import('styled-components').StyledComponent<"span", any, {}, never>;
-export declare const SocialIcon: import('styled-components').StyledComponent<"div", any, {}, never>;
-export declare const ExpandButton: import('styled-components').StyledComponent<import('react').FC<import('@evergis/uilib-gl').IIconButtonProps>, any, {}, never>;

package/dist/index.js

@@ -5163,7 +5163,8 @@ const Container = styled(uilibGl.Flex) `
   
   ${({ isColumn }) => isColumn
     ? styled.css `
-        > * {
+        &&& > * {
+          justify-content: flex-start;
           width: 100%;
 
           :not(:last-child) {
@@ -5681,7 +5682,7 @@ const OneColumnContainer = React.memo(({ elementConfig, renderElement }) => {
     const hasUnits = elementConfig?.children?.some(({ id }) => id === "units");
     if (!value && hideEmpty)
         return null;
-    return (jsxRuntime.jsxs(Container, { id: id, style: innerTemplateStyle || style, children: [jsxRuntime.jsxs(ContainerAlias, { hasBottomMargin: true, children: [renderElement({ id: "alias" }), renderElement({ id: "tooltip" })] }), jsxRuntime.jsxs(ContainerValue, { children: [value, hasUnits && jsxRuntime.jsx(ContainerUnits, { children: renderElement({ id: "units" }) })] })] }));
+    return (jsxRuntime.jsxs(Container, { id: id, isColumn: true, style: innerTemplateStyle || style, children: [jsxRuntime.jsxs(ContainerAlias, { hasBottomMargin: true, children: [renderElement({ id: "alias" }), renderElement({ id: "tooltip" })] }), jsxRuntime.jsxs(ContainerValue, { children: [value, hasUnits && jsxRuntime.jsx(ContainerUnits, { children: renderElement({ id: "units" }) })] })] }));
 });
 
 const TwoColumnContainer = React.memo(({ config, elementConfig, type, renderElement }) => {
@@ -7846,15 +7847,14 @@ const ExternalLink = styled(uilibGl.IconButton).attrs(() => ({
     color: ${({ theme: { palette } }) => palette.primaryDeep};
   }
 `;
-const LocalLinkBlank = styled(uilibGl.Blank) `
-  min-width: 13.5rem;
-  padding: 0.5rem 0.75rem 0;
-
-  a {
+const Link = styled.a `
     text-decoration: none;
     font-size: 0.75rem;
     color: ${({ theme: { palette } }) => palette.primary};
-  }
+`;
+const LocalLinkBlank = styled(uilibGl.Blank) `
+  min-width: 13.5rem;
+  padding: 0.5rem 0.75rem 0;
 
   ${uilibGl.IconButtonButton} {
     font-size: 0.75rem;
@@ -7889,23 +7889,30 @@ const LocalLinkCopy = styled(uilibGl.Flex) `
   justify-content: center;
 `;
 
-const LocalLink = React.memo(({ link }) => {
+const LocalLink = React.memo(({ link, style }) => {
     const { t } = useGlobalContext();
     const [isOpen, toggleOpen] = useToggle();
     const onCopy = React.useCallback(() => {
         navigator.clipboard.writeText(link);
         toggleOpen();
     }, [link, toggleOpen]);
-    return (jsxRuntime.jsx(uilibGl.Popover, { open: isOpen, zIndex: 10, onRequestClose: toggleOpen, anchorOrigin: "bottom-right", targetOrigin: "top-right", anchor: jsxRuntime.jsx(LocalLinkButton, { onClick: toggleOpen }), children: jsxRuntime.jsxs(LocalLinkBlank, { children: [jsxRuntime.jsx("a", { href: link, target: "_blank", rel: "noreferrer", children: link }), jsxRuntime.jsx(LocalLinkCopy, { children: jsxRuntime.jsx(uilibGl.IconButton, { kind: "copy", onClick: onCopy, children: t("copy", { ns: "dashboard", defaultValue: "Копировать" }) }) })] }) }));
+    return (jsxRuntime.jsx(uilibGl.Popover, { open: isOpen, zIndex: 10, onRequestClose: toggleOpen, anchorOrigin: "bottom-right", targetOrigin: "top-right", anchor: jsxRuntime.jsx(LocalLinkButton, { onClick: toggleOpen }), children: jsxRuntime.jsxs(LocalLinkBlank, { children: [jsxRuntime.jsx(Link, { href: link, target: "_blank", rel: "noreferrer", style: style, children: link }), jsxRuntime.jsx(LocalLinkCopy, { children: jsxRuntime.jsx(uilibGl.IconButton, { kind: "copy", onClick: onCopy, children: t("copy", { ns: "dashboard", defaultValue: "Копировать" }) }) })] }) }));
 });
 
 const ElementLink = React.memo(({ type, elementConfig }) => {
     const { attributes } = useWidgetContext(type);
-    const attribute = getAttributeByName(elementConfig?.attributeName, attributes);
-    const link = getResourceUrl(attribute?.value?.toString());
+    const { options, style } = elementConfig || {};
+    const { simple, title } = options || {};
+    const attribute = React.useMemo(() => getAttributeByName(elementConfig?.attributeName, attributes), [attributes, elementConfig?.attributeName]);
+    const link = React.useMemo(() => getResourceUrl(attribute?.value?.toString()), [attribute?.value]);
     if (!link)
         return null;
-    return link.startsWith("http") ? jsxRuntime.jsx(ExternalLink, { onClick: () => window.open(link) }) : jsxRuntime.jsx(LocalLink, { link: link });
+    if (simple) {
+        return (jsxRuntime.jsx(Link, { href: link, target: "_blank", rel: "noreferrer", style: style, children: title ?? link }));
+    }
+    return link.startsWith("http")
+        ? jsxRuntime.jsx(ExternalLink, { style: style, onClick: () => window.open(link) })
+        : jsxRuntime.jsx(LocalLink, { style: style, link: link });
 });
 
 const MarkdownWrapper = styled.div `
@@ -8007,37 +8014,6 @@ const MarkdownWrapper = styled.div `
     display: none;
   }
 `;
-styled(uilibGl.Flex) `
-  align-items: center;
-  gap: 1rem;
-  margin-top: 1rem;
-`;
-styled.span `
-  display: block;
-  font-size: 0.75rem;
-  line-height: 0.875rem;
-  opacity: 0.36;
-  margin: 0 0 0.5rem 0;
-`;
-styled.div `
-  width: 1.25rem;
-  height: 1.25rem;
-  cursor: pointer;
-  transition: opacity 0.2s;
-
-  &:hover {
-    opacity: 0.7;
-  }
-
-  img, svg {
-    width: 100%;
-    height: 100%;
-    display: block;
-  }
-`;
-const ExpandButton = styled(uilibGl.IconButton) `
-  margin-bottom: 1rem;
-`;
 
 const ElementMarkdown = React.memo(({ elementConfig, type }) => {
     const { attributes } = useWidgetContext(type);
@@ -8061,14 +8037,14 @@ const ElementMarkdown = React.memo(({ elementConfig, type }) => {
     if (!shouldShowExpand) {
         return (jsxRuntime.jsx(MarkdownWrapper, { children: jsxRuntime.jsx(ReactMarkdown, { remarkPlugins: [remarkGfm], children: markdownString }) }));
     }
-    // Truncated content for collapsed state
-    const truncatedContent = markdownString.substring(0, expandLength);
     // Collapsed state
     if (!expanded) {
-        return (jsxRuntime.jsxs(MarkdownWrapper, { children: [jsxRuntime.jsx(ExpandButton, { primary: true, icon: jsxRuntime.jsx(uilibGl.Expander, { isSelected: false }), onClick: () => setExpanded(true), children: t("more", { ns: "dashboard", defaultValue: "Подробнее" }) }), jsxRuntime.jsx(ReactMarkdown, { remarkPlugins: [remarkGfm], children: truncatedContent })] }));
+        // Truncated content for collapsed state
+        const truncatedContent = markdownString.substring(0, expandLength);
+        return (jsxRuntime.jsxs(MarkdownWrapper, { children: [jsxRuntime.jsx(ReactMarkdown, { remarkPlugins: [remarkGfm], children: truncatedContent }), jsxRuntime.jsx(uilibGl.LegendToggler, { onClick: () => setExpanded(true), children: t("more", { ns: "dashboard", defaultValue: "Подробнее" }) })] }));
     }
     // Expanded state
-    return (jsxRuntime.jsxs(MarkdownWrapper, { children: [jsxRuntime.jsx(ExpandButton, { primary: true, icon: jsxRuntime.jsx(uilibGl.Expander, { isSelected: true }), onClick: () => setExpanded(false), children: t("hide", { ns: "dashboard", defaultValue: "Свернуть" }) }), jsxRuntime.jsx(ReactMarkdown, { remarkPlugins: [remarkGfm], children: markdownString })] }));
+    return (jsxRuntime.jsxs(MarkdownWrapper, { children: [jsxRuntime.jsx(ReactMarkdown, { remarkPlugins: [remarkGfm], children: markdownString }), jsxRuntime.jsx(uilibGl.LegendToggler, { toggled: true, onClick: () => setExpanded(false), children: t("hide", { ns: "dashboard", defaultValue: "Свернуть" }) })] }));
 });
 
 const SmallPreviewContainer = styled.div `