@stack-spot/portal-components 1.3.3-rc → 1.3.3

package/CHANGELOG.md

@@ -1,5 +1,21 @@
 # Changelog
 
+## [1.3.3](https://github.com/stack-spot/portal-commons/compare/portal-components@v1.3.2...portal-components@v1.3.3) (2024-06-25)
+
+
+### Bug Fixes
+
+* notifications ([97776bd](https://github.com/stack-spot/portal-commons/commit/97776bd9799fa7492091247dd31fcae1bf900f37))
+
+## [1.3.2](https://github.com/stack-spot/portal-commons/compare/portal-components@v1.3.0...portal-components@v1.3.1) (2024-06-20)
+
+## [1.3.1](https://github.com/stack-spot/portal-commons/compare/portal-components@v1.2.0...portal-components@v1.3.1) (2024-06-19)
+
+
+### Features
+
+* add new components (notifications components, ScrollView, AsyncContent, LazyMd)  ([ee5e2d0](https://github.com/stack-spot/portal-commons/commit/ee5e2d075959abecc5b9495b0aa7eb6bf374e9aa))
+
 ## [1.2.0](https://github.com/stack-spot/portal-commons/compare/portal-components@v1.1.1...portal-components@v1.2.0) (2024-06-10)
 
 

package/dist/components/LazyMarkdown/BlockquoteMd.d.ts

@@ -1,3 +1,10 @@
+/**
+ * BlockquoteMd component that renders a styled blockquote with an icon and text based on the provided props.
+ *
+ * @param {Object} props - The props for the BlockquoteMd component.
+ * @param {any} props.props - The properties passed to the component.
+ * @returns {JSX.Element} The BlockquoteMd component.
+ */
 export declare const BlockquoteMd: ({ props }: {
     props: any;
 }) => import("react/jsx-runtime").JSX.Element;

package/dist/components/LazyMarkdown/BlockquoteMd.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"BlockquoteMd.d.ts","sourceRoot":"","sources":["../../../src/components/LazyMarkdown/BlockquoteMd.tsx"],"names":[],"mappings":"AAQA,eAAO,MAAM,YAAY,cAAe;IAAE,KAAK,EAAE,GAAG,CAAA;CAAE,4CAoCrD,CAAA"}
+{"version":3,"file":"BlockquoteMd.d.ts","sourceRoot":"","sources":["../../../src/components/LazyMarkdown/BlockquoteMd.tsx"],"names":[],"mappings":"AAQA;;;;;;GAMG;AACH,eAAO,MAAM,YAAY,cAAe;IAAE,KAAK,EAAE,GAAG,CAAA;CAAE,4CAoCrD,CAAA"}

package/dist/components/LazyMarkdown/BlockquoteMd.js

@@ -3,6 +3,13 @@ import { Blockquote, Box, Flex, IconBox, Text } from '@citric/core';
 import * as icons from '@citric/icons';
 import { useTranslate } from '@stack-spot/portal-translate';
 import { createElement } from 'react';
+/**
+ * BlockquoteMd component that renders a styled blockquote with an icon and text based on the provided props.
+ *
+ * @param {Object} props - The props for the BlockquoteMd component.
+ * @param {any} props.props - The properties passed to the component.
+ * @returns {JSX.Element} The BlockquoteMd component.
+ */
 export const BlockquoteMd = ({ props }) => {
     const t = useTranslate(dictionary);
     const arrayNode = props.node;
@@ -14,6 +21,12 @@ export const BlockquoteMd = ({ props }) => {
     }
     return (_jsx(Flex, { sx: { borderRadius: 'sm', bg: 'light.500', my: 3 }, children: _jsx(Blockquote, { children: _jsx(Text, { ...props }) }) }));
 };
+/**
+ * Get the style for the blockquote based on the block rule.
+ *
+ * @param {string} blockRule - The block rule to determine the style.
+ * @returns {{ color: OneOfColorSchemes, icon: IconName }} The style object containing color and icon.
+ */
 function blockquoteAlertStyle(blockRule) {
     const style = {
         '[!NOTE]': {
@@ -49,7 +62,7 @@ const dictionary = {
         '[!INFO]': 'Info',
         '[!IMPORTANT]': 'Important',
         '[!TIP]': 'Tip',
-        '[!WARNING]': 'Warning',
+        '[!WARNING]xw': 'Warning',
         '[!DANGER]': 'Danger',
     },
     pt: {

package/dist/components/LazyMarkdown/BlockquoteMd.js.map

@@ -1 +1 @@
-{"version":3,"file":"BlockquoteMd.js","sourceRoot":"","sources":["../../../src/components/LazyMarkdown/BlockquoteMd.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"BlockquoteMd.js","sourceRoot":"","sources":["../../../src/components/LazyMarkdown/BlockquoteMd.tsx"],"names":[],"mappings":"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"}

package/dist/components/LazyMarkdown/CodeViewer.d.ts

@@ -6,6 +6,11 @@ interface Props {
     scrollable?: boolean;
     copyButton?: boolean;
 }
+/**
+ * CodeViewer component that displays code with syntax highlighting based on application theme and optional copy and refresh buttons.
+ *
+* @param options the props for rendering the component: {@link Props}.
+ */
 export declare const CodeViewer: ({ language, data, onClickRefresh, scrollable, copyButton }: Props) => import("react/jsx-runtime").JSX.Element;
 export declare const codeViewerLocale: {
     en: {

package/dist/components/LazyMarkdown/CodeViewer.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CodeViewer.d.ts","sourceRoot":"","sources":["../../../src/components/LazyMarkdown/CodeViewer.tsx"],"names":[],"mappings":"AAyGA,UAAU,KAAK;IACb,QAAQ,EAAE,MAAM,CAAC;IACjB,IAAI,EAAE,MAAM,CAAC;IACb,cAAc,CAAC,EAAE,MAAM,IAAI,CAAC;IAC5B,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AACD,eAAO,MAAM,UAAU,+DAAuE,KAAK,4CA+BlG,CAAA;AAED,eAAO,MAAM,gBAAgB;;;;;;;CAO5B,CAAA"}
+{"version":3,"file":"CodeViewer.d.ts","sourceRoot":"","sources":["../../../src/components/LazyMarkdown/CodeViewer.tsx"],"names":[],"mappings":"AA0GA,UAAU,KAAK;IACb,QAAQ,EAAE,MAAM,CAAC;IACjB,IAAI,EAAE,MAAM,CAAC;IACb,cAAc,CAAC,EAAE,MAAM,IAAI,CAAC;IAC5B,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AAED;;;;GAIG;AACH,eAAO,MAAM,UAAU,+DAAuE,KAAK,4CA+BlG,CAAA;AAED,eAAO,MAAM,gBAAgB;;;;;;;CAO5B,CAAA"}

package/dist/components/LazyMarkdown/CodeViewer.js

@@ -3,6 +3,7 @@ import { Box, Flex, Text } from '@citric/core';
 import { getColor, getRadius } from '@citric/core/dist/utils/theme.js';
 import { Copy, Refresh } from '@citric/icons';
 import { IconButton } from '@citric/ui';
+import { theme } from '@stack-spot/portal-theme';
 import { useTranslate } from '@stack-spot/portal-translate';
 import SyntaxHighlighter from 'react-syntax-highlighter';
 import styled from 'styled-components';
@@ -26,7 +27,7 @@ const style = {
     },
 };
 const Wrapper = styled(Box) `
-  background-color: ${({ theme }) => getColor(theme, 'gray.900')};
+  background-color: ${theme.color.gray[900]};
   border-radius: ${({ theme }) => getRadius(theme, 'xs')};
   position: relative;
   padding: 8px;
@@ -41,12 +42,12 @@ const Wrapper = styled(Box) `
       height: 4px;
     }
     &::-webkit-scrollbar-track {
-      background: ${({ theme }) => getColor(theme, 'light.400')};
+      background: ${theme.color.light[400]};
       border-radius: 2px;
     }
     &::-webkit-scrollbar-thumb,
     &::-webkit-scrollbar-thumb:hover {
-      background: ${({ theme }) => getColor(theme, 'light.700')};
+      background: ${theme.color.light[700]};
       border-radius: 2px;
     }
   }
@@ -59,32 +60,32 @@ const Wrapper = styled(Box) `
     margin-top: 0;
     overflow: unset;
     text-shadow: none;
-    color: #fff;
+    color: ${theme.color.gray[50]};
   }
 
   .hljs-string {
-    color: ${({ theme }) => getColor(theme, 'teal.300')};
+    color: ${theme.color.teal[300]};
   }
   .hljs-tag {
     color: ${({ theme }) => getColor(theme, 'teal')};
   }
   .hljs-attr {
-    color: #fff;
+    color: ${theme.color.gray[50]};
   }
   .hljs-number {
-    color: #fff;
+    color: ${theme.color.gray[300]};
   }
   .hljs-property {
-    color: #fff;
+    color: ${theme.color.gray[50]};
   }
   .hljs-keyword {
-    color: #75dcff;
+    color: ${theme.color.blue[200]};
   }
   .comment {
-    color: #8e8e93;
+    color: ${theme.color.gray[400]};
   }
   .hljs-expression {
-    color: #f57f17;
+    color: ${theme.color.orange[400]};
   }
 
   .button-group {
@@ -101,6 +102,11 @@ const Wrapper = styled(Box) `
     }
   }
 `;
+/**
+ * CodeViewer component that displays code with syntax highlighting based on application theme and optional copy and refresh buttons.
+ *
+* @param options the props for rendering the component: {@link Props}.
+ */
 export const CodeViewer = ({ language, data, onClickRefresh, scrollable = true, copyButton }) => {
     const t = useTranslate(codeViewerLocale);
     return (_jsx(Wrapper, { children: data ? (_jsxs(_Fragment, { children: [_jsx(Flex, { style: scrollable ? style.scrollable : undefined, children: _jsx(SyntaxHighlighter, { language: language, showLineNumbers: true, useInlineStyles: false, children: String(data).replace(/\n$/, '') }) }), _jsxs("div", { className: "button-group", children: [onClickRefresh && (_jsx(IconButton, { onClick: onClickRefresh, children: _jsx(Refresh, {}) })), copyButton ? (_jsx(IconButton, { onClick: () => navigator.clipboard.writeText(data), children: _jsx(Copy, {}) })) : null] })] })) : (_jsx(Text, { appearance: "body2", children: t.noData })) }));

package/dist/components/LazyMarkdown/CodeViewer.js.map

@@ -1 +1 @@
-{"version":3,"file":"CodeViewer.js","sourceRoot":"","sources":["../../../src/components/LazyMarkdown/CodeViewer.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"CodeViewer.js","sourceRoot":"","sources":["../../../src/components/LazyMarkdown/CodeViewer.tsx"],"names":[],"mappings":"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"}

package/dist/components/LazyMarkdown/Markdown.d.ts

@@ -1,6 +1,14 @@
 interface MarkdownProps {
+    /**
+     * The markdown content to be rendered.
+     */
     children: string;
 }
+/**
+ * Renders a component that provides markdown content visualization using citric components.
+ *
+ * @param options the props for rendering the component: {@link MarkdownProps}.
+ */
 declare const Markdown: ({ children }: MarkdownProps) => import("react/jsx-runtime").JSX.Element;
 export default Markdown;
 //# sourceMappingURL=Markdown.d.ts.map

package/dist/components/LazyMarkdown/Markdown.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Markdown.d.ts","sourceRoot":"","sources":["../../../src/components/LazyMarkdown/Markdown.tsx"],"names":[],"mappings":"AAUA,UAAU,aAAa;IACrB,QAAQ,EAAE,MAAM,CAAC;CAClB;AAuFD,QAAA,MAAM,QAAQ,iBAAkB,aAAa,4CAI5C,CAAA;AAGD,eAAe,QAAQ,CAAA"}
+{"version":3,"file":"Markdown.d.ts","sourceRoot":"","sources":["../../../src/components/LazyMarkdown/Markdown.tsx"],"names":[],"mappings":"AAUA,UAAU,aAAa;IACrB;;OAEG;IACH,QAAQ,EAAE,MAAM,CAAC;CAClB;AAyFD;;;;GAIG;AACH,QAAA,MAAM,QAAQ,iBAAkB,aAAa,4CAI5C,CAAA;AAGD,eAAe,QAAQ,CAAA"}

package/dist/components/LazyMarkdown/Markdown.js

@@ -54,6 +54,9 @@ const styles = {
         borderRadius: 'xs',
     },
 };
+/**
+ * Custom components for rendering markdown elements.
+ */
 const component = () => ({
     p: (props) => _jsx(Text, { appearance: "body2", ...props }),
     strong: (props) => _jsx(Text, { weight: "bold", colorScheme: "light.700", as: "strong", ...props }),
@@ -81,6 +84,11 @@ const component = () => ({
     },
     code: ({ ...props }) => _jsx(Text, { as: "code", sx: styles.code, ...props, children: props.children }),
 });
+/**
+ * Renders a component that provides markdown content visualization using citric components.
+ *
+ * @param options the props for rendering the component: {@link MarkdownProps}.
+ */
 const Markdown = ({ children }) => (_jsx(ReactMarkdown, { rehypePlugins: [rehypeRaw], remarkPlugins: [remarkGfm], components: component(), children: children }));
 // eslint-disable-next-line import/no-default-export
 export default Markdown;

package/dist/components/LazyMarkdown/Markdown.js.map

@@ -1 +1 @@
-{"version":3,"file":"Markdown.js","sourceRoot":"","sources":["../../../src/components/LazyMarkdown/Markdown.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"Markdown.js","sourceRoot":"","sources":["../../../src/components/LazyMarkdown/Markdown.tsx"],"names":[],"mappings":"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"}

package/dist/components/LazyMarkdown/MarkdownButton.d.ts

@@ -1,8 +1,19 @@
 import { ReactNode } from 'react';
 interface MarkdownButtonProps {
+    /**
+     * Optional click handler for the button.
+     */
     onClick?: () => void;
+    /**
+     * The content to be displayed inside the button.
+     */
     children: ReactNode;
 }
+/**
+ * Renders a component that provides an IconButton with custom styles and content.
+ *
+ * @param options the props for rendering the component: {@link MarkdownButtonProps}.
+ */
 export declare const MarkdownButton: ({ ...props }: MarkdownButtonProps) => import("react/jsx-runtime").JSX.Element;
 export {};
 //# sourceMappingURL=MarkdownButton.d.ts.map

package/dist/components/LazyMarkdown/MarkdownButton.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"MarkdownButton.d.ts","sourceRoot":"","sources":["../../../src/components/LazyMarkdown/MarkdownButton.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAEjC,UAAU,mBAAmB;IAC3B,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED,eAAO,MAAM,cAAc,iBAAkB,mBAAmB,4CAI/D,CAAA"}
+{"version":3,"file":"MarkdownButton.d.ts","sourceRoot":"","sources":["../../../src/components/LazyMarkdown/MarkdownButton.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAEjC,UAAU,mBAAmB;IAC3B;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED;;;;GAIG;AACH,eAAO,MAAM,cAAc,iBAAkB,mBAAmB,4CAI/D,CAAA"}

package/dist/components/LazyMarkdown/MarkdownButton.js

@@ -1,4 +1,9 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { IconButton } from '@citric/ui';
+/**
+ * Renders a component that provides an IconButton with custom styles and content.
+ *
+ * @param options the props for rendering the component: {@link MarkdownButtonProps}.
+ */
 export const MarkdownButton = ({ ...props }) => (_jsx(IconButton, { sx: { position: 'absolute', top: '16px', right: '16px' }, onClick: props.onClick, children: props.children }));
 //# sourceMappingURL=MarkdownButton.js.map

package/dist/components/LazyMarkdown/MarkdownButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"MarkdownButton.js","sourceRoot":"","sources":["../../../src/components/LazyMarkdown/MarkdownButton.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,YAAY,CAAA;AAQvC,MAAM,CAAC,MAAM,cAAc,GAAG,CAAC,EAAE,GAAG,KAAK,EAAuB,EAAE,EAAE,CAAC,CACnE,KAAC,UAAU,IAAC,EAAE,EAAE,EAAE,QAAQ,EAAE,UAAU,EAAE,GAAG,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,EAAE,OAAO,EAAE,KAAK,CAAC,OAAO,YACzF,KAAK,CAAC,QAAQ,GACJ,CACd,CAAA"}
+{"version":3,"file":"MarkdownButton.js","sourceRoot":"","sources":["../../../src/components/LazyMarkdown/MarkdownButton.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,YAAY,CAAA;AAcvC;;;;GAIG;AACH,MAAM,CAAC,MAAM,cAAc,GAAG,CAAC,EAAE,GAAG,KAAK,EAAuB,EAAE,EAAE,CAAC,CACnE,KAAC,UAAU,IAAC,EAAE,EAAE,EAAE,QAAQ,EAAE,UAAU,EAAE,GAAG,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,EAAE,OAAO,EAAE,KAAK,CAAC,OAAO,YACzF,KAAK,CAAC,QAAQ,GACJ,CACd,CAAA"}

package/dist/components/LazyMarkdown/Video.d.ts

@@ -1,3 +1,10 @@
+/**
+ * Video component that renders an iframe with the given source URL.
+ *
+ * @param {Object} props - The props for the Video component.
+ * @param {string} props.children - The URL to be used as the source of the iframe.
+ * @returns {JSX.Element} The rendered iframe element.
+ */
 export declare const Video: ({ children }: {
     children: string;
 }) => import("react/jsx-runtime").JSX.Element;

package/dist/components/LazyMarkdown/Video.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Video.d.ts","sourceRoot":"","sources":["../../../src/components/LazyMarkdown/Video.tsx"],"names":[],"mappings":"AAAA,eAAO,MAAM,KAAK,iBAAkB;IAAE,QAAQ,EAAE,MAAM,CAAA;CAAE,4CAKvD,CAAA"}
+{"version":3,"file":"Video.d.ts","sourceRoot":"","sources":["../../../src/components/LazyMarkdown/Video.tsx"],"names":[],"mappings":"AAAA;;;;;;GAMG;AACH,eAAO,MAAM,KAAK,iBAAkB;IAAE,QAAQ,EAAE,MAAM,CAAA;CAAE,4CAKvD,CAAA"}

package/dist/components/LazyMarkdown/Video.js

@@ -1,3 +1,10 @@
 import { jsx as _jsx } from "react/jsx-runtime";
+/**
+ * Video component that renders an iframe with the given source URL.
+ *
+ * @param {Object} props - The props for the Video component.
+ * @param {string} props.children - The URL to be used as the source of the iframe.
+ * @returns {JSX.Element} The rendered iframe element.
+ */
 export const Video = ({ children }) => (_jsx("iframe", { src: children, allow: "accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" }));
 //# sourceMappingURL=Video.js.map

package/dist/components/LazyMarkdown/Video.js.map

@@ -1 +1 @@
-{"version":3,"file":"Video.js","sourceRoot":"","sources":["../../../src/components/LazyMarkdown/Video.tsx"],"names":[],"mappings":";AAAA,MAAM,CAAC,MAAM,KAAK,GAAG,CAAC,EAAE,QAAQ,EAAwB,EAAE,EAAE,CAAC,CAC3D,iBACE,GAAG,EAAE,QAAQ,EACb,KAAK,EAAC,qGAAqG,GAC3G,CACH,CAAA"}
+{"version":3,"file":"Video.js","sourceRoot":"","sources":["../../../src/components/LazyMarkdown/Video.tsx"],"names":[],"mappings":";AAAA;;;;;;GAMG;AACH,MAAM,CAAC,MAAM,KAAK,GAAG,CAAC,EAAE,QAAQ,EAAwB,EAAE,EAAE,CAAC,CAC3D,iBACE,GAAG,EAAE,QAAQ,EACb,KAAK,EAAC,qGAAqG,GAC3G,CACH,CAAA"}

package/dist/components/Notifications/NotificationComponent.d.ts

@@ -19,6 +19,12 @@ interface Props {
     placeholderComponent: ReactElement;
     isSummary: boolean;
 }
+/**
+ * NotificationComponent component that renders the notifications panel.
+ * It render the notification icon and when clicked the notification modal is opened.
+ *
+ * @param props the component's props {@link Props}.
+ */
 export declare const NotificationComponent: ({ hasUnreadNotification, onMarkAsReadUnread, notifications, isLoading, error, type, onUpdateType, onClickViewNotifications, onClickViewAll, errorDetails, fetchNextPage, hasNextPage, placeholderComponent, isSummary, }: Props) => import("react/jsx-runtime").JSX.Element;
 export {};
 //# sourceMappingURL=NotificationComponent.d.ts.map

package/dist/components/Notifications/NotificationComponent.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"NotificationComponent.d.ts","sourceRoot":"","sources":["../../../src/components/Notifications/NotificationComponent.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,YAAY,EAAY,MAAM,OAAO,CAAA;AAG9C,OAAO,EAAgB,UAAU,EAAE,MAAM,iBAAiB,CAAA;AAK1D,OAAO,EAAoB,uBAAuB,EAAE,qBAAqB,EAAc,MAAM,SAAS,CAAA;AAEtG,UAAU,KAAK;IACb,qBAAqB,CAAC,EAAE,OAAO,CAAC;CACjC;AAkHD,UAAU,KAAK;IACb,kBAAkB,EAAE,CAAC,cAAc,EAAE,MAAM,EAAE,IAAI,EAAE,OAAO,EAAE,IAAI,EAAE,cAAc,GAAG,MAAM,KAAK,IAAI,CAAC;IACnG,aAAa,CAAC,EAAE,qBAAqB,EAAE,CAAC;IACxC,SAAS,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,GAAG,CAAC;IACZ,wBAAwB,EAAE,MAAM,IAAI,CAAC;IACrC,cAAc,EAAE,MAAM,IAAI,CAAC;IAC3B,YAAY,EAAE,UAAU,CAAC;IACzB,aAAa,EAAE,MAAM,IAAI,CAAC;IAC1B,WAAW,EAAE,OAAO,CAAC;IACrB,IAAI,CAAC,EAAE,uBAAuB,CAAC;IAC/B,YAAY,EAAE,CAAC,WAAW,CAAC,EAAE,uBAAuB,KAAK,IAAI,CAAC;IAC9D,oBAAoB,EAAE,YAAY,CAAC;IACnC,SAAS,EAAE,OAAO,CAAC;CACpB;AAED,eAAO,MAAM,qBAAqB,6NAK/B,KAAK,4CAqFP,CAAA"}
+{"version":3,"file":"NotificationComponent.d.ts","sourceRoot":"","sources":["../../../src/components/Notifications/NotificationComponent.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,YAAY,EAAY,MAAM,OAAO,CAAA;AAG9C,OAAO,EAAgB,UAAU,EAAE,MAAM,iBAAiB,CAAA;AAK1D,OAAO,EAAoB,uBAAuB,EAAE,qBAAqB,EAAc,MAAM,SAAS,CAAA;AAEtG,UAAU,KAAK;IACb,qBAAqB,CAAC,EAAE,OAAO,CAAC;CACjC;AAkID,UAAU,KAAK;IACb,kBAAkB,EAAE,CAAC,cAAc,EAAE,MAAM,EAAE,IAAI,EAAE,OAAO,EAAE,IAAI,EAAE,cAAc,GAAG,MAAM,KAAK,IAAI,CAAC;IACnG,aAAa,CAAC,EAAE,qBAAqB,EAAE,CAAC;IACxC,SAAS,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,GAAG,CAAC;IACZ,wBAAwB,EAAE,MAAM,IAAI,CAAC;IACrC,cAAc,EAAE,MAAM,IAAI,CAAC;IAC3B,YAAY,EAAE,UAAU,CAAC;IACzB,aAAa,EAAE,MAAM,IAAI,CAAC;IAC1B,WAAW,EAAE,OAAO,CAAC;IACrB,IAAI,CAAC,EAAE,uBAAuB,CAAC;IAC/B,YAAY,EAAE,CAAC,WAAW,CAAC,EAAE,uBAAuB,KAAK,IAAI,CAAC;IAC9D,oBAAoB,EAAE,YAAY,CAAC;IACnC,SAAS,EAAE,OAAO,CAAC;CACpB;AAED;;;;;GAKG;AACH,eAAO,MAAM,qBAAqB,6NAK/B,KAAK,4CAuFP,CAAA"}

package/dist/components/Notifications/NotificationComponent.js

@@ -12,11 +12,9 @@ import { ScrollView } from '../ScrollView.js';
 import { StatusCircle } from '../StatusCircle.js';
 import { NotificationItem } from './NotificationItem.js';
 import { NotificationType, UnreadType } from './types.js';
-const ANIMATION_DURATION_MS = 300;
-const MAX_HEIGHT_TRANSITION = `max-height ease-in ${ANIMATION_DURATION_MS / 1000}s`;
 const NotificationsComponent = styled(Flex) `
   max-height: 0;
-  z-index: 1;
+  z-index: 2;
   visibility: hidden;
   position: absolute;
   top: calc(var(--header-height) + 4px);
@@ -26,7 +24,6 @@ const NotificationsComponent = styled(Flex) `
   &.visible {
     min-height: 802px;
     visibility: visible;
-    transition: ${MAX_HEIGHT_TRANSITION};
   }
 
   .content {
@@ -36,7 +33,6 @@ const NotificationsComponent = styled(Flex) `
     background-color: ${theme.color.light[300]};
     overflow-y: ${({ $scroll }) => $scroll ? 'auto' : 'hidden'};
     overflow-x: hidden;
-    transition: ${MAX_HEIGHT_TRANSITION}, visibility 0s ${ANIMATION_DURATION_MS / 1000}s;
   }
 
   &::after {
@@ -52,20 +48,46 @@ const NotificationsComponent = styled(Flex) `
     border-top-color: ${theme.color.light[400]};
   }
 `;
+const Overlay = styled.div `
+  position: fixed;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  background-color: ${theme.color.primary.contrastText};
+  opacity: 0.6;
+  z-index: 1;
+`;
 const StyledBox = styled(Box) `
   width: 100%;
   > div:first-child{
     width: 100%;
   }
 `;
+/**
+ * NotificationFilterButton component that renders a button to be used in quick filters for notifications.
+ *
+ * @param props the component's props {@link NotificationFilterButtonProps}.
+ */
 const NotificationFilterButton = (props) => {
     const { type, onChangeFilterType, ariaLabel, label, enumType } = props;
     return (_jsx(Button, { appearance: "text", role: "button", "aria-label": ariaLabel, "aria-pressed": type === enumType, onClick: () => onChangeFilterType(enumType), sx: { borderColor: type === enumType ? 'primary' : 'transparent' }, children: _jsx(Text, { colorScheme: "inverse", appearance: "microtext1", children: label }) }));
 };
+/**
+ * NotificationsFilter component that renders the filter options for notifications.
+ *
+ * @param props the component's props {@link NotificationsFilterProps}.
+ */
 const NotificationsFilter = ({ type, onChangeFilterType }) => {
     const t = useTranslate(dictionary);
     return (_jsxs(Flex, { alignItems: "center", sx: { gap: '4px' }, my: "5", children: [_jsx(Button, { "aria-pressed": !type, appearance: "text", role: "button", "aria-label": t.filterAll, onClick: () => onChangeFilterType(), sx: { borderColor: !type ? 'primary' : 'transparent' }, children: _jsx(Text, { colorScheme: "inverse", appearance: "microtext1", children: t.all }) }), _jsx(NotificationFilterButton, { type: type, onChangeFilterType: onChangeFilterType, ariaLabel: t.filterUnread, label: t.unread, enumType: UnreadType.Unread }), _jsx(NotificationFilterButton, { type: type, onChangeFilterType: onChangeFilterType, ariaLabel: t.filterHigh, label: t.high, enumType: NotificationType.High }), _jsx(NotificationFilterButton, { type: type, onChangeFilterType: onChangeFilterType, ariaLabel: t.filterMedium, label: t.medium, enumType: NotificationType.Medium }), _jsx(NotificationFilterButton, { type: type, onChangeFilterType: onChangeFilterType, ariaLabel: t.filterLow, label: t.low, enumType: NotificationType.Low })] }));
 };
+/**
+ * NotificationComponent component that renders the notifications panel.
+ * It render the notification icon and when clicked the notification modal is opened.
+ *
+ * @param props the component's props {@link Props}.
+ */
 export const NotificationComponent = ({ hasUnreadNotification, onMarkAsReadUnread, notifications, isLoading, error, type, onUpdateType, onClickViewNotifications, onClickViewAll, errorDetails, fetchNextPage, hasNextPage, placeholderComponent, isSummary = false, }) => {
     const t = useTranslate(dictionary);
     const [visible, setVisible] = useState(false);
@@ -75,7 +97,7 @@ export const NotificationComponent = ({ hasUnreadNotification, onMarkAsReadUnrea
     return (_jsxs(Flex, { sx: { position: 'relative' }, children: [_jsx(IconButton, { "aria-label": t.openNotifications, onClick: () => {
                     onClickViewNotifications();
                     setVisible(true);
-                }, sx: { border: 'none', bg: 'transparent' }, children: _jsx(IconBox, { size: "md", className: "notificationsTour", children: _jsx(Bell, {}) }) }), hasUnreadNotification && _jsx(Box, { sx: { position: 'absolute', right: '2px' }, "aria-label": t.hasUnread, children: _jsx(StatusCircle, { status: 'danger' }) }), _jsx(NotificationsComponent, { className: listToClass(['selection-list', visible ? 'visible' : undefined]), "$scroll": true, "aria-hidden": !visible, children: _jsxs(Flex, { className: "content", p: 5, flexDirection: "column", justifyContent: "space-between", children: [_jsxs(Flex, { w: "100%", children: [_jsxs(Flex, { justifyContent: "space-between", w: "100%", children: [_jsx(Text, { appearance: "h4", children: t.notifications }), _jsx(IconButton, { onClick: () => setVisible(false), "aria-label": t.close, children: _jsx(IconBox, { size: "xs", children: _jsx(TimesMini, {}) }) })] }), _jsx(NotificationsFilter, { type: type, onChangeFilterType: updateType }), _jsx(AsyncContent, { error: error, errorDetails: errorDetails, loading: isLoading, children: notifications?.length ? _jsx(StyledBox, { children: _jsx(InfiniteScroll, { dataLength: notifications?.length || 0, next: fetchNextPage, hasMore: hasNextPage, children: _jsx(ScrollView, { direction: "vertical", style: { maxHeight: '630px' }, children: _jsx(Flex, { sx: { gap: '4px' }, mr: "3", children: notifications?.map((item) => (_jsx(NotificationItem, { notification: item, isSummary: isSummary, onClickMarkReadUnread: (read, type) => onMarkAsReadUnread(item.id, read, type) }, item.id))) }) }) }) })
+                }, sx: { border: 'none', bg: 'transparent' }, children: _jsx(IconBox, { size: "md", className: "notificationsTour", children: _jsx(Bell, {}) }) }), hasUnreadNotification && _jsx(Box, { sx: { position: 'absolute', right: '2px' }, "aria-label": t.hasUnread, children: _jsx(StatusCircle, { status: 'danger' }) }), visible && _jsx(Overlay, {}), _jsx(NotificationsComponent, { className: listToClass(['selection-list', visible ? 'visible' : undefined]), "$scroll": true, "aria-hidden": !visible, children: _jsxs(Flex, { className: "content", p: 5, flexDirection: "column", justifyContent: "space-between", children: [_jsxs(Flex, { w: "100%", children: [_jsxs(Flex, { justifyContent: "space-between", w: "100%", children: [_jsx(Text, { appearance: "h4", children: t.notifications }), _jsx(IconButton, { onClick: () => setVisible(false), "aria-label": t.close, children: _jsx(IconBox, { size: "xs", children: _jsx(TimesMini, {}) }) })] }), _jsx(NotificationsFilter, { type: type, onChangeFilterType: updateType }), _jsx(AsyncContent, { error: error, errorDetails: errorDetails, loading: isLoading, children: notifications?.length ? _jsx(StyledBox, { children: _jsx(InfiniteScroll, { dataLength: notifications?.length || 0, next: fetchNextPage, hasMore: hasNextPage, children: _jsx(ScrollView, { direction: "vertical", style: { maxHeight: '630px' }, children: _jsx(Flex, { sx: { gap: '4px' }, mr: "3", flexDirection: "column", children: notifications?.map((item) => (_jsx(NotificationItem, { notification: item, isSummary: isSummary, onClickMarkReadUnread: (read, type) => onMarkAsReadUnread(item.id, read, type) }, item.id))) }) }) }) })
                                         :
                                             _jsx(_Fragment, { children: placeholderComponent }) })] }), _jsx(Flex, { w: "100%", pt: 3, children: _jsx(Button, { size: "sm", sx: { width: '100%' }, colorScheme: "inverse", appearance: "text", onClick: () => {
                                     setVisible(false);

package/dist/components/Notifications/NotificationComponent.js.map

@@ -1 +1 @@
-{"version":3,"file":"NotificationComponent.js","sourceRoot":"","sources":["../../../src/components/Notifications/NotificationComponent.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"NotificationComponent.js","sourceRoot":"","sources":["../../../src/components/Notifications/NotificationComponent.tsx"],"names":[],"mappings":"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"}

package/dist/components/Notifications/NotificationItem.d.ts

@@ -6,6 +6,11 @@ interface Props {
 interface NotificationItemProps extends Props {
     onClickMarkReadUnread: (read: boolean, type: 'callToAction' | 'icon') => void;
 }
+/**
+ * NotificationItem component that renders a notification item.
+ *
+ * @param props the component's props {@link NotificationItemProps}.
+ */
 export declare const NotificationItem: ({ notification, isSummary, onClickMarkReadUnread }: NotificationItemProps) => import("react/jsx-runtime").JSX.Element;
 export {};
 //# sourceMappingURL=NotificationItem.d.ts.map

package/dist/components/Notifications/NotificationItem.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"NotificationItem.d.ts","sourceRoot":"","sources":["../../../src/components/Notifications/NotificationItem.tsx"],"names":[],"mappings":"AAQA,OAAO,EAAE,qBAAqB,EAAE,MAAM,SAAS,CAAA;AAe/C,UAAU,KAAK;IACb,YAAY,EAAE,qBAAqB,CAAC;IACpC,SAAS,EAAE,OAAO,CAAC;CACpB;AAgGD,UAAU,qBAAsB,SAAQ,KAAK;IAC3C,qBAAqB,EAAE,CAAC,IAAI,EAAE,OAAO,EAAE,IAAI,EAAE,cAAc,GAAG,MAAM,KAAK,IAAI,CAAC;CAC/E;AAED,eAAO,MAAM,gBAAgB,uDAAwD,qBAAqB,4CAQzG,CAAA"}
+{"version":3,"file":"NotificationItem.d.ts","sourceRoot":"","sources":["../../../src/components/Notifications/NotificationItem.tsx"],"names":[],"mappings":"AAQA,OAAO,EAAE,qBAAqB,EAAE,MAAM,SAAS,CAAA;AAe/C,UAAU,KAAK;IACb,YAAY,EAAE,qBAAqB,CAAC;IACpC,SAAS,EAAE,OAAO,CAAC;CACpB;AAqGD,UAAU,qBAAsB,SAAQ,KAAK;IAC3C,qBAAqB,EAAE,CAAC,IAAI,EAAE,OAAO,EAAE,IAAI,EAAE,cAAc,GAAG,MAAM,KAAK,IAAI,CAAC;CAC/E;AAED;;;;GAIG;AACH,eAAO,MAAM,gBAAgB,uDAAwD,qBAAqB,4CA8BzG,CAAA"}

package/dist/components/Notifications/NotificationItem.js

@@ -1,5 +1,5 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { Button, Flex, IconBox, Text } from '@citric/core';
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { Box, Button, Flex, IconBox, Text } from '@citric/core';
 import { Envelope, EnvelopeOpen } from '@citric/icons';
 import { IconButton, Tooltip } from '@citric/ui';
 import { useTranslate } from '@stack-spot/portal-translate';
@@ -25,29 +25,55 @@ const style = {
         },
     },
 };
-const NotificationHeader = ({ notification, isSummary, onClickMarkReadUnread }) => {
-    const t = useTranslate(dictionary);
-    return (_jsxs(Flex, { justifyContent: "space-between", mb: 2, sx: { maxWidth: isSummary ? '330px' : '100%' }, flexWrap: "nowrap", children: [_jsx(Text, { appearance: isSummary ? 'body2' : 'body1', nowrapEllipsis: true, children: notification.title }), _jsx(Tooltip, { text: notification.committed ? t.markAsUnread : t.markAsRead, position: "left", id: `tooltip-${notification.title}`, role: "tooltip", sx: style.tooltip, children: _jsx(IconButton, { "aria-describedby": `tooltip-${notification.title}`, children: _jsx(IconBox, { size: "xs", onClick: () => {
-                            onClickMarkReadUnread(!notification.committed, 'icon');
-                        }, children: notification.committed ? _jsx(Envelope, {}) : _jsx(EnvelopeOpen, {}) }) }) })] }));
-};
+/**
+ * NotificationHeader component that renders the header of a notification.
+ *
+ * @param props the component's props {@link NotificationItemProps}.
+ */
+const NotificationHeader = ({ notification, isSummary }) => (_jsx(Flex, { justifyContent: "space-between", mb: 2, sx: { maxWidth: isSummary ? '330px' : '100%' }, flexWrap: "nowrap", children: _jsx(Text, { appearance: isSummary ? 'body2' : 'body1', nowrapEllipsis: true, children: notification.title }) }));
+/**
+ * Get the number of days ago from the given date string.
+ *
+ * @param {string} dateString - The date string to calculate the days ago.
+ * @returns {number} The number of days ago.
+ */
 const getDaysAgo = (dateString) => {
     const givenDate = parseISO(dateString);
     const today = new Date();
     return differenceInDays(today, givenDate);
 };
+/**
+ * NotificationContent component that renders the content of a notification.
+ *
+ * @param props the component's props {@link Props}.
+ */
 const NotificationContent = ({ notification, isSummary }) => {
     const { formatDate } = useDateFormatter();
     const t = useTranslate(dictionary);
     const daysAgo = getDaysAgo(notification.trigger_at);
-    return (_jsxs(_Fragment, { children: [!isSummary && _jsx(Flex, { mt: 4, mb: 3, children: _jsx(LazyMarkdown, { children: notification.description }) }), _jsxs(Flex, { children: [_jsx(Text, { appearance: "microtext1", colorScheme: "light.700", children: t[notification.context] }), _jsx(Text, { appearance: "microtext1", colorScheme: "light.700", mx: "2", children: "\u2022" }), !isSummary && _jsxs(_Fragment, { children: [_jsx(Text, { appearance: "microtext1", colorScheme: "light.700", children: formatDate(notification.created_at) }), _jsx(Text, { appearance: "microtext1", colorScheme: "light.700", mx: "2", children: "\u2022" })] }), _jsx(Text, { appearance: "microtext1", colorScheme: "light.700", children: daysAgo > 0 ? daysAgo + ' ' + t.daysAgo : t.today })] })] }));
+    return (_jsxs(_Fragment, { children: [!isSummary && _jsx(Flex, { mt: 4, mb: 3, children: _jsx(LazyMarkdown, { children: notification.description }) }), _jsxs(Flex, { children: [_jsx(Text, { appearance: "microtext1", colorScheme: "light.700", children: t[notification.context] }), _jsx(Text, { appearance: "microtext1", colorScheme: "light.700", mx: "2", children: "\u2022" }), !isSummary && _jsxs(_Fragment, { children: [_jsx(Text, { appearance: "microtext1", colorScheme: "light.700", children: formatDate(notification.trigger_at) }), _jsx(Text, { appearance: "microtext1", colorScheme: "light.700", mx: "2", children: "\u2022" })] }), _jsx(Text, { appearance: "microtext1", colorScheme: "light.700", children: daysAgo > 0 ? daysAgo + ' ' + t.daysAgo : t.today })] })] }));
 };
+/**
+ * NotificationFooter component that renders the footer of a notification.
+ *
+ * @param props the component's props {@link NotificationFooterProps}.
+ */
 const NotificationFooter = ({ call_to_action, onClickMarkReadUnread }) => {
     const t = useTranslate(dictionary);
     const Link = useAnchorTag();
     return (_jsx(Flex, { mt: "5", children: _jsx(Button, { size: "sm", colorScheme: "inverse", onClick: () => onClickMarkReadUnread('callToAction'), children: _jsx(Link, { href: call_to_action, children: _jsx(Text, { colorScheme: 'inverse.contrastText', children: t.takeMeThere }) }) }) }));
 };
-export const NotificationItem = ({ notification, isSummary, onClickMarkReadUnread }) => (_jsxs(Flex, { bg: "light.400", p: "3 3 3 5", r: "xs", flexDirection: "column", w: "100%", sx: styles.item(statusToColor[notification.criticality], notification.committed), children: [_jsx(NotificationHeader, { notification: notification, isSummary: isSummary, onClickMarkReadUnread: onClickMarkReadUnread }), _jsx(NotificationContent, { notification: notification, isSummary: isSummary }), notification.call_to_action && _jsx(NotificationFooter, { call_to_action: notification.call_to_action, onClickMarkReadUnread: (type) => onClickMarkReadUnread(!notification.committed, type) })] }));
+/**
+ * NotificationItem component that renders a notification item.
+ *
+ * @param props the component's props {@link NotificationItemProps}.
+ */
+export const NotificationItem = ({ notification, isSummary, onClickMarkReadUnread }) => {
+    const t = useTranslate(dictionary);
+    return (_jsxs(Box, { sx: { position: 'relative' }, children: [_jsxs(Flex, { bg: "light.400", p: "3 3 3 5", r: "xs", flexDirection: "column", w: "100%", sx: styles.item(statusToColor[notification.criticality], notification.committed), children: [_jsx(NotificationHeader, { notification: notification, isSummary: isSummary, onClickMarkReadUnread: onClickMarkReadUnread }), _jsx(NotificationContent, { notification: notification, isSummary: isSummary }), notification.call_to_action && _jsx(NotificationFooter, { call_to_action: notification.call_to_action, onClickMarkReadUnread: (type) => onClickMarkReadUnread(notification.committed, type) })] }), _jsx(Box, { sx: { position: 'absolute', top: '8px', right: '8px' }, children: _jsx(Tooltip, { text: notification.committed ? t.markAsUnread : t.markAsRead, position: "left", id: `tooltip-${notification.title}`, role: "tooltip", sx: style.tooltip, children: _jsx(IconButton, { "aria-describedby": `tooltip-${notification.title}`, sx: { opacity: notification.committed ? 0.5 : 1 }, children: _jsx(IconBox, { size: "xs", onClick: () => {
+                                onClickMarkReadUnread(notification.committed, 'icon');
+                            }, children: notification.committed ? _jsx(Envelope, {}) : _jsx(EnvelopeOpen, {}) }) }) }) })] }));
+};
 const dictionary = {
     en: {
         takeMeThere: 'Take me there',