@stack-spot/portal-components 0.0.18 → 1.0.0-dev.1770393008395

package/dist/components/notification/NotificationList.d.ts

@@ -0,0 +1,47 @@
+import { GetTenantNotificationsResponse, InfiniteScrollConfig } from './types.js';
+export interface NotificationListProps {
+    /**
+     * Function to call when the message is marked as read (committed).
+     * @param id the id of the notification where the read status changed.
+     */
+    onCommit: (id: string) => void;
+    /**
+     * Function to call when the message is marked as unread (uncommitted).
+     * @param id the id of the notification where the read status changed.
+     */
+    onUncommit: (id: string) => void;
+    /**
+     * Optional. Function called when the button to perform the notification action is clicked. This function will be run in addition to
+     * the notification action.
+     * @param id the id of the notification where the button was clicked
+     */
+    onClickAction?: (id: string) => void;
+    /**
+      * Optional. Function called when the button read more in notification is clicked.
+      */
+    onClickViewNotification?: () => void;
+    /**
+     * If you need this notification list to be have an infinite scroll behavior, set this option.
+     */
+    infiniteScroll?: InfiniteScrollConfig;
+    /**
+     * The notifications themselves.
+     */
+    items: GetTenantNotificationsResponse[];
+    /**
+     * A compact notification list don't show date headers (as a timeline) or descriptions of notifications.
+     */
+    compact?: boolean;
+    /**
+     * Whether or not the content is loading. If this is true, the content becomes transparent and the cursor turns into the progress cursor.
+     */
+    loading?: boolean;
+    /**
+     * If true, when the list is empty, the placeholder will say "nothing found" instead of "no notifications".
+     */
+    showEmptySearch?: boolean;
+    style?: React.CSSProperties;
+    className?: string;
+}
+export declare const NotificationList: ({ items, compact, onCommit, onUncommit, onClickAction, onClickViewNotification, infiniteScroll, loading, showEmptySearch, style, className }: NotificationListProps) => false | import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=NotificationList.d.ts.map

package/dist/components/notification/NotificationList.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"NotificationList.d.ts","sourceRoot":"","sources":["../../../src/components/notification/NotificationList.tsx"],"names":[],"mappings":"AAUA,OAAO,EAAE,8BAA8B,EAAE,oBAAoB,EAAE,MAAM,SAAS,CAAA;AAC9E,MAAM,WAAW,qBAAqB;IACpC;;;OAGG;IACH,QAAQ,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IAC/B;;;OAGG;IACH,UAAU,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IACjC;;;;OAIG;IACH,aAAa,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IACtC;;QAEI;IACH,uBAAuB,CAAC,EAAE,MAAM,IAAI,CAAC;IACrC;;OAEG;IACH,cAAc,CAAC,EAAE,oBAAoB,CAAC;IACtC;;OAEG;IACH,KAAK,EAAE,8BAA8B,EAAE,CAAC;IACxC;;OAEG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;OAEG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;OAEG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC5B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AA2ED,eAAO,MAAM,gBAAgB,GAC3B,8IACgE,qBAAqB,oDA2DtF,CAAA"}

package/dist/components/notification/NotificationList.js

@@ -0,0 +1,102 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Box, Flex } from '@citric/core';
+import { listToClass } from '@stack-spot/portal-theme';
+import { useTranslate } from '@stack-spot/portal-translate';
+import { last } from 'lodash';
+import { useMemo } from 'react';
+import { styled } from 'styled-components';
+import { InfiniteScroll } from '../InfiniteScroll.js';
+import { PlaceholderCallToAction } from '../Placeholder.js';
+import { TimelineSection } from '../TimelineSection.js';
+import { NotificationItem } from './NotificationItem.js';
+const StyledBox = styled(Box) `
+  width: 100%;
+  position: relative;
+  transition: opacity 0.3s;
+
+  > div:first-child{
+    width: 100%;
+  }
+
+  &.loading {
+    opacity: 0.6;
+    .loading-mask {
+      pointer-events: auto;
+    }
+  }
+
+  .loading-mask {
+    opacity: 0;
+    position: absolute;
+    pointer-events: none;
+    top: 0;
+    right: 0;
+    left: 0;
+    bottom: 0;
+    cursor: progress;
+  }
+
+  .placeholder.compact {
+    min-height: 400px;
+    padding: 0px;
+
+    & > div {
+      gap: 16px;
+      align-content: flex-start;
+
+      & > div {
+        text-align: center;
+        h4 {
+          margin-bottom: 10px;
+        }
+        p {
+          max-width: 220px;
+        }
+      }
+    }
+  }
+`;
+// this assumes the data from the backend is ordered by date (trigger_at)
+function groupNotificationsByDate(notifications) {
+    const groups = [];
+    for (const n of notifications) {
+        let currentGroup = last(groups);
+        const date = new Date(n.trigger_at);
+        const year = date.getFullYear();
+        const month = date.getMonth();
+        const day = date.getDate();
+        if (!currentGroup || currentGroup.day !== day || currentGroup.month !== month || currentGroup.year !== year) {
+            currentGroup = { year, month, day, items: [] };
+            groups.push(currentGroup);
+        }
+        currentGroup.items.push(n);
+    }
+    return groups;
+}
+export const NotificationList = ({ items, compact = false, onCommit, onUncommit, onClickAction, onClickViewNotification, infiniteScroll, loading, showEmptySearch, style, className }) => {
+    const groups = useMemo(() => compact ? [{ day: 0, month: 0, year: 0, items }] : groupNotificationsByDate(items), [compact, items]);
+    const t = useTranslate(dictionary);
+    const renderNotifications = (notifications, key) => (_jsx(Flex, { sx: { gap: '4px' }, flexDirection: "column", children: notifications?.map((item) => (_jsx(NotificationItem, { id: key ? '' : `notification-item-${item.id}`, notification: item, isSummary: compact, onClickViewNotification: onClickViewNotification, onCommit: () => onCommit(item.id), onUncommit: () => onUncommit(item.id), onClickAction: () => onClickAction?.(item.id) }, item.id))) }, key));
+    return infiniteScroll?.scrollableTarget !== null && (_jsxs(StyledBox, { style: style, className: listToClass([className, loading && 'loading']), children: [items.length ? (_jsx(InfiniteScroll, { dataLength: items.length || 0, next: infiniteScroll?.loadMore ?? (() => { }), hasMore: infiniteScroll?.hasMore ?? false, 
+                // @ts-ignore: the library is wrongly typed and abandoned, meaning, it will never be fixed. The source code clearly accepts
+                // HTMLElements as scrollable targets:
+                // https://github.com/ankeetmaini/react-infinite-scroll-component/blob/master/src/index.tsx#L168 
+                scrollableTarget: infiniteScroll?.scrollableTarget, children: _jsx(Flex, { sx: { gap: '24px' }, flexDirection: "column", children: groups.map((group) => compact
+                        ? renderNotifications(group.items, 'compact')
+                        : (_jsx(TimelineSection, { month: group.month, day: group.day, children: renderNotifications(group.items) }, `${group.day}-${group.month}-${group.year}`))) }) })) : (_jsx(PlaceholderCallToAction, { title: showEmptySearch ? t.searchTitle : t.defaultTitle, description: showEmptySearch ? t.searchDescription : t.defaultDescription, className: listToClass(['placeholder', compact && 'compact']), titleAs: "p" })), _jsx("div", { className: "loading-mask" })] }));
+};
+const dictionary = {
+    en: {
+        defaultTitle: 'You don’t have any notifications yet.',
+        defaultDescription: 'Relevant updates will show up here as soon as they’re available.',
+        searchTitle: 'No notifications match your filters.',
+        searchDescription: 'Try changing the filters to see more results.',
+    },
+    pt: {
+        defaultTitle: 'Você ainda não tem notificações.',
+        defaultDescription: 'Quando houver alguma atualização relevante, ela será exibida aqui.',
+        searchTitle: 'Nenhuma notificação corresponde aos filtros',
+        searchDescription: 'Experimente mudar os filtros para encontrar mais notificações.',
+    },
+};
+//# sourceMappingURL=NotificationList.js.map

package/dist/components/notification/NotificationList.js.map

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

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

@@ -0,0 +1,60 @@
+export type NotificationType = 'LOW' | 'MEDIUM' | 'HIGH';
+export type NotificationContext = 'ACCOUNT' | 'STUDIO' | 'WORKSPACE' | 'AI';
+export type NotificationContentResponse = {
+    title: string;
+    description: string;
+};
+export type GetTenantNotificationsResponse = {
+    id: string;
+    content: {
+        [key: string]: NotificationContentResponse;
+    };
+    broadcast_level: 'ACCOUNT' | 'INDIVIDUAL' | 'PLATFORM' | 'RESOURCE';
+    context: 'ACCOUNT' | 'STUDIO' | 'WORKSPACE' | 'AI';
+    target?: string;
+    criticality: 'LOW' | 'MEDIUM' | 'HIGH';
+    call_to_action: string;
+    persistent: boolean;
+    committed: boolean;
+    last_until?: string;
+    trigger_at: string;
+    created_at?: string;
+    isBanner?: boolean;
+};
+export type ResponseModelGetTenantNotificationsResponse = {
+    items: GetTenantNotificationsResponse[];
+    total: number;
+};
+export type NotificationTypeFilters = NotificationType | UnreadType;
+export interface NotificationFilters {
+    filterBy?: 'criticality' | 'context';
+    filterValue?: string;
+    sort?: string;
+    direction?: string;
+    page?: any;
+    size?: string;
+}
+export interface NotificationCommitted {
+    id: string;
+    committed: boolean;
+}
+export declare enum UnreadType {
+    Unread = "unread"
+}
+export interface InfiniteScrollConfig {
+    /**
+     * Function to load more items into the list. Called when the scroll is almost reaching its end.
+     */
+    loadMore: () => void;
+    /**
+     * Set this to false to prevent the scroll from loading more items when it reaches the end.
+     */
+    hasMore: boolean;
+    /**
+     * Defines which scroll will be used as the target of the infinite scroll.
+     *
+     * If null, nothing renders, it waits until it has a value.
+     */
+    scrollableTarget?: string | HTMLElement | null;
+}
+//# sourceMappingURL=types.d.ts.map

package/dist/components/notification/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/notification/types.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,gBAAgB,GAAG,KAAK,GAAG,QAAQ,GAAG,MAAM,CAAA;AAExD,MAAM,MAAM,mBAAmB,GAAG,SAAS,GAAG,QAAQ,GAAG,WAAW,GAAG,IAAI,CAAA;AAI3E,MAAM,MAAM,2BAA2B,GAAG;IACxC,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,EAAE,MAAM,CAAC;CACrB,CAAC;AAEF,MAAM,MAAM,8BAA8B,GAAG;IAC3C,EAAE,EAAE,MAAM,CAAC;IACX,OAAO,EAAE;QACP,CAAC,GAAG,EAAE,MAAM,GAAG,2BAA2B,CAAC;KAC5C,CAAC;IACF,eAAe,EAAE,SAAS,GAAG,YAAY,GAAG,UAAU,GAAG,UAAU,CAAC;IACpE,OAAO,EAAE,SAAS,GAAG,QAAQ,GAAG,WAAW,GAAG,IAAI,CAAC;IACnD,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,WAAW,EAAE,KAAK,GAAG,QAAQ,GAAG,MAAM,CAAC;IACvC,cAAc,EAAE,MAAM,CAAC;IACvB,UAAU,EAAE,OAAO,CAAC;IACpB,SAAS,EAAE,OAAO,CAAC;IACnB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,UAAU,EAAE,MAAM,CAAC;IACnB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAA;AAED,MAAM,MAAM,2CAA2C,GAAG;IACxD,KAAK,EAAE,8BAA8B,EAAE,CAAC;IACxC,KAAK,EAAE,MAAM,CAAC;CACf,CAAA;AAED,MAAM,MAAM,uBAAuB,GAAG,gBAAgB,GAAG,UAAU,CAAA;AAEnE,MAAM,WAAW,mBAAmB;IAClC,QAAQ,CAAC,EAAE,aAAa,GAAG,SAAS,CAAC;IACrC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,IAAI,CAAC,EAAE,GAAG,CAAC;IACX,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,qBAAqB;IACpC,EAAE,EAAE,MAAM,CAAC;IACX,SAAS,EAAE,OAAO,CAAC;CACpB;AAID,oBAAY,UAAU;IACpB,MAAM,WAAW;CAClB;AAED,MAAM,WAAW,oBAAoB;IACnC;;OAEG;IACH,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB;;OAEG;IACH,OAAO,EAAE,OAAO,CAAC;IACjB;;;;OAIG;IACH,gBAAgB,CAAC,EAAE,MAAM,GAAG,WAAW,GAAG,IAAI,CAAC;CAChD"}

package/dist/components/notification/types.js

@@ -0,0 +1,7 @@
+// fixme: please, do not ignore lint rules. They exist for a reason. Next major: transform this enum into a disjoint string type.
+// eslint-disable-next-line no-restricted-syntax
+export var UnreadType;
+(function (UnreadType) {
+    UnreadType["Unread"] = "unread";
+})(UnreadType || (UnreadType = {}));
+//# sourceMappingURL=types.js.map

package/dist/components/notification/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../src/components/notification/types.ts"],"names":[],"mappings":"AAkDA,iIAAiI;AACjI,gDAAgD;AAChD,MAAM,CAAN,IAAY,UAEX;AAFD,WAAY,UAAU;IACpB,+BAAiB,CAAA;AACnB,CAAC,EAFW,UAAU,KAAV,UAAU,QAErB"}

package/dist/containers/NotificationsPage.d.ts

@@ -0,0 +1,2 @@
+export declare const NotificationsPage: () => import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=NotificationsPage.d.ts.map

package/dist/containers/NotificationsPage.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"NotificationsPage.d.ts","sourceRoot":"","sources":["../../src/containers/NotificationsPage.tsx"],"names":[],"mappings":"AA4BA,eAAO,MAAM,iBAAiB,+CAmD7B,CAAA"}

package/dist/containers/NotificationsPage.js

@@ -0,0 +1,72 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { Text } from '@citric/core';
+import { useTranslate } from '@stack-spot/portal-translate';
+import { styled } from 'styled-components';
+import { AsyncContent } from '../components/AsyncContent.js';
+import { ErrorFeedback } from '../components/error/index.js';
+import { SearchInput } from '../components/form/SearchInput.js';
+import { Select } from '../components/form/Select/index.js';
+import { NotificationList } from '../components/notification/NotificationList.js';
+import { useNotificationList } from '../context/notification/hooks.js';
+import { useNotificationController } from '../notifications.js';
+const FilterBox = styled.div `
+  margin: 24px 0;
+  display: flex;
+  flex-direction: row;
+  gap: 8px;
+
+  > * {
+    flex: 1;
+  }
+`;
+const criticalities = ['HIGH', 'MEDIUM', 'LOW'];
+const contexts = ['ACCOUNT', 'STUDIO', 'WORKSPACE'];
+const times = [1, 7, 30, 90, 365];
+export const NotificationsPage = () => {
+    const t = useTranslate(dictionary);
+    const controller = useNotificationController();
+    const { hasMore, items, loadMore, applyFilters, filters, status, error } = useNotificationList();
+    const hasFilters = Object.entries(filters).length > 0;
+    return (_jsxs(_Fragment, { children: [_jsx("header", { children: _jsx(Text, { appearance: "h2", as: "h1", children: t.title }) }), _jsx(Text, { appearance: "body2", colorScheme: "light.700", children: t.description }), _jsxs(FilterBox, { children: [_jsx(SearchInput, { searchText: t.filter, defaultValue: filters.search, onChange: search => applyFilters({ search }) }), _jsx(Select, { value: filters.createdSince, options: times, onChange: createdSince => applyFilters({ createdSince }), emptyOption: t.anyTime, renderLabel: o => t[`time.${o}`] }), _jsx(Select, { value: filters.criticality, options: criticalities, onChange: criticality => applyFilters({ criticality }), emptyOption: t.allCriticalities, renderLabel: o => t[`criticality.${o}`] }), _jsx(Select, { value: filters.context, options: contexts, onChange: context => applyFilters({ context }), emptyOption: t.allContexts, renderLabel: o => t[`context.${o}`] })] }), _jsx(AsyncContent, { error: error, loading: status === 'startup', errorDetails: { errorComponent: () => _jsx(ErrorFeedback, { code: error.code }), reportError: () => { } }, children: _jsx(NotificationList, { items: items, loading: status === 'loading', onCommit: id => controller.markAsCommitted(id), onUncommit: id => controller.markAsUncommitted(id), infiniteScroll: { hasMore, loadMore }, onClickAction: controller.config.onClickAction, showEmptySearch: hasFilters }) })] }));
+};
+const dictionary = {
+    en: {
+        title: 'Notifications',
+        description: 'Here you can view all your received notifications.',
+        filter: 'Filter',
+        allCriticalities: 'All severities',
+        'criticality.HIGH': 'High',
+        'criticality.MEDIUM': 'Medium',
+        'criticality.LOW': 'Low',
+        allContexts: 'All contexts',
+        'context.ACCOUNT': 'Account',
+        'context.STUDIO': 'Studio',
+        'context.WORKSPACE': 'Workspace',
+        'anyTime': 'Any time',
+        'time.1': 'Last 24 hours',
+        'time.7': 'Last 7 days',
+        'time.30': 'Last 30 days',
+        'time.90': 'Last 90 days',
+        'time.365': 'Last 12 months',
+    },
+    pt: {
+        title: 'Notificações',
+        description: 'Aqui você encontra todas as notificações recebidas.',
+        filter: 'Filtrar',
+        allCriticalities: 'Todas as criticidades',
+        'criticality.HIGH': 'Alto',
+        'criticality.MEDIUM': 'Médio',
+        'criticality.LOW': 'Baixo',
+        allContexts: 'Todos os contextos',
+        'context.ACCOUNT': 'Conta',
+        'context.STUDIO': 'Estúdio',
+        'context.WORKSPACE': 'Workspace',
+        'anyTime': 'Todos os períodos',
+        'time.1': 'Últimas 24 horas',
+        'time.7': 'Últimos 7 dias',
+        'time.30': 'Últimos 30 dias',
+        'time.90': 'Últimos 90 dias',
+        'time.365': 'Últimos 12 meses',
+    },
+};
+//# sourceMappingURL=NotificationsPage.js.map

package/dist/containers/NotificationsPage.js.map

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

package/dist/context/anchor.d.ts

@@ -0,0 +1,27 @@
+export type AnchorComponent = (props: React.AnchorHTMLAttributes<HTMLAnchorElement>) => React.ReactElement;
+interface AnchorContext {
+    /**
+     * The component to render by a layout component a link is needed.
+     * @default <a>
+     */
+    anchorTag?: AnchorComponent;
+}
+/**
+ * Some components need to create HTML anchors (links) to other pages in the website. These links, sometimes, must to be managed by a
+ * navigator for React. Since we don't want to couple this library with any specific navigator, you can provide your own component for
+ * creating links, it must follow the same interface of the HTML's `a` tag.
+ *
+ * If this is not used, the tag `<a>` is used by default.
+ * @param props the anchor component (anchorTag) and the content to render (children).
+ */
+export declare const AnchorProvider: ({ children, ...props }: Required<AnchorContext> & {
+    children: React.ReactNode;
+}) => import("react/jsx-runtime").JSX.Element;
+/**
+ * A React hook for retrieving the Link (anchor) component.
+ * @returns the link component declared at {@link AnchorProvider} or a component that renders the tag <a> from HTML if no link component was
+ * provided.
+ */
+export declare function useAnchorTag(): AnchorComponent;
+export {};
+//# sourceMappingURL=anchor.d.ts.map

package/dist/context/anchor.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"anchor.d.ts","sourceRoot":"","sources":["../../src/context/anchor.tsx"],"names":[],"mappings":"AAEA,MAAM,MAAM,eAAe,GAAG,CAAC,KAAK,EAAE,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,KAAK,KAAK,CAAC,YAAY,CAAA;AAE1G,UAAU,aAAa;IACrB;;;OAGG;IACH,SAAS,CAAC,EAAE,eAAe,CAAC;CAC7B;AAMD;;;;;;;GAOG;AACH,eAAO,MAAM,cAAc,GAAI,wBAAwB,QAAQ,CAAC,aAAa,CAAC,GAAG;IAAE,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;CAAE,4CAE7G,CAAA;AAED;;;;GAIG;AACH,wBAAgB,YAAY,IAAI,eAAe,CAG9C"}

package/dist/context/anchor.js

@@ -0,0 +1,23 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { createContext, useContext } from 'react';
+const context = createContext({});
+const Anchor = props => _jsx("a", { ...props });
+/**
+ * Some components need to create HTML anchors (links) to other pages in the website. These links, sometimes, must to be managed by a
+ * navigator for React. Since we don't want to couple this library with any specific navigator, you can provide your own component for
+ * creating links, it must follow the same interface of the HTML's `a` tag.
+ *
+ * If this is not used, the tag `<a>` is used by default.
+ * @param props the anchor component (anchorTag) and the content to render (children).
+ */
+export const AnchorProvider = ({ children, ...props }) => (_jsx(context.Provider, { value: props, children: children }));
+/**
+ * A React hook for retrieving the Link (anchor) component.
+ * @returns the link component declared at {@link AnchorProvider} or a component that renders the tag <a> from HTML if no link component was
+ * provided.
+ */
+export function useAnchorTag() {
+    const { anchorTag } = useContext(context);
+    return anchorTag ?? Anchor;
+}
+//# sourceMappingURL=anchor.js.map

package/dist/context/anchor.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"anchor.js","sourceRoot":"","sources":["../../src/context/anchor.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,aAAa,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AAYjD,MAAM,OAAO,GAAG,aAAa,CAAgB,EAAE,CAAC,CAAA;AAEhD,MAAM,MAAM,GAAoB,KAAK,CAAC,EAAE,CAAC,eAAO,KAAK,GAAI,CAAA;AAEzD;;;;;;;GAOG;AACH,MAAM,CAAC,MAAM,cAAc,GAAG,CAAC,EAAE,QAAQ,EAAE,GAAG,KAAK,EAA2D,EAAE,EAAE,CAAC,CACjH,KAAC,OAAO,CAAC,QAAQ,IAAC,KAAK,EAAE,KAAK,YAAG,QAAQ,GAAoB,CAC9D,CAAA;AAED;;;;GAIG;AACH,MAAM,UAAU,YAAY;IAC1B,MAAM,EAAE,SAAS,EAAE,GAAG,UAAU,CAAC,OAAO,CAAC,CAAA;IACzC,OAAO,SAAS,IAAI,MAAM,CAAA;AAC5B,CAAC"}

package/dist/context/loading.d.ts

@@ -0,0 +1,27 @@
+import { ReactElement } from 'react';
+interface LoadingContext {
+    /**
+     * The component to render by a layout component.
+     * @default <LoadingCircular>
+     */
+    loading?: ReactElement;
+}
+/**
+ * Some portals use a different loading style than what we have in citric.
+ * You can provide your own loading component to use wherever you want within the application.
+ *
+ * @param position The position parameter is mandatory to be passed as absolute in the loading component that is being passed.
+ *
+ * If this is not used, the component `LoadingCircular` from citric is used by default.
+ * @param props the loading component (useLoadingComponent) and the content to render (children).
+ */
+export declare const LoadingProvider: ({ children, ...props }: Required<LoadingContext> & {
+    children: React.ReactNode;
+}) => import("react/jsx-runtime").JSX.Element;
+/**
+ * A React hook for retrieving the Loading component.
+ * @returns the loading component declared at `LoadingProvider`.
+ */
+export declare function useLoadingComponent(): ReactElement;
+export {};
+//# sourceMappingURL=loading.d.ts.map

package/dist/context/loading.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"loading.d.ts","sourceRoot":"","sources":["../../src/context/loading.tsx"],"names":[],"mappings":"AACA,OAAO,EAAiB,YAAY,EAAc,MAAM,OAAO,CAAA;AAE/D,UAAU,cAAc;IACtB;;;OAGG;IACH,OAAO,CAAC,EAAE,YAAY,CAAC;CACxB;AAMD;;;;;;;;GAQG;AACH,eAAO,MAAM,eAAe,GAAI,wBAAwB,QAAQ,CAAC,cAAc,CAAC,GAAG;IAAE,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;CAAE,4CAE/G,CAAA;AAED;;;GAGG;AACH,wBAAgB,mBAAmB,IAAI,YAAY,CAGlD"}

package/dist/context/loading.js

@@ -0,0 +1,24 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { LoadingCircular } from '@citric/ui';
+import { createContext, useContext } from 'react';
+const context = createContext({});
+const Loading = _jsx(LoadingCircular, { size: "sm", sx: { position: 'absolute' } });
+/**
+ * Some portals use a different loading style than what we have in citric.
+ * You can provide your own loading component to use wherever you want within the application.
+ *
+ * @param position The position parameter is mandatory to be passed as absolute in the loading component that is being passed.
+ *
+ * If this is not used, the component `LoadingCircular` from citric is used by default.
+ * @param props the loading component (useLoadingComponent) and the content to render (children).
+ */
+export const LoadingProvider = ({ children, ...props }) => (_jsx(context.Provider, { value: props, children: children }));
+/**
+ * A React hook for retrieving the Loading component.
+ * @returns the loading component declared at `LoadingProvider`.
+ */
+export function useLoadingComponent() {
+    const { loading } = useContext(context);
+    return loading ?? Loading;
+}
+//# sourceMappingURL=loading.js.map

package/dist/context/loading.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"loading.js","sourceRoot":"","sources":["../../src/context/loading.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,YAAY,CAAA;AAC5C,OAAO,EAAE,aAAa,EAAgB,UAAU,EAAE,MAAM,OAAO,CAAA;AAU/D,MAAM,OAAO,GAAG,aAAa,CAAiB,EAAE,CAAC,CAAA;AAEjD,MAAM,OAAO,GAAiB,KAAC,eAAe,IAAC,IAAI,EAAC,IAAI,EAAC,EAAE,EAAE,EAAE,QAAQ,EAAE,UAAU,EAAE,GAAI,CAAA;AAEzF;;;;;;;;GAQG;AACH,MAAM,CAAC,MAAM,eAAe,GAAG,CAAC,EAAE,QAAQ,EAAE,GAAG,KAAK,EAA4D,EAAE,EAAE,CAAC,CACnH,KAAC,OAAO,CAAC,QAAQ,IAAC,KAAK,EAAE,KAAK,YAAG,QAAQ,GAAoB,CAC9D,CAAA;AAED;;;GAGG;AACH,MAAM,UAAU,mBAAmB;IACjC,MAAM,EAAE,OAAO,EAAE,GAAG,UAAU,CAAC,OAAO,CAAC,CAAA;IACvC,OAAO,OAAO,IAAI,OAAO,CAAA;AAC3B,CAAC"}

package/dist/context/notification/LazyNotificationList.d.ts

@@ -0,0 +1,28 @@
+import { GetTenantNotificationsResponse, ResponseModelGetTenantNotificationsResponse } from '../../notifications.js';
+import { LazyNotificationListener, LoadNotificationsFilters, LoadNotificationsOptions } from './types.js';
+interface ConstructorParams {
+    id: number;
+    load: (options: LoadNotificationsOptions) => Promise<ResponseModelGetTenantNotificationsResponse>;
+    filters?: LoadNotificationsFilters;
+}
+export declare class LazyNotificationList {
+    #private;
+    readonly id: number;
+    items: GetTenantNotificationsResponse[];
+    private page;
+    private total;
+    private filters;
+    private readonly load;
+    private listeners;
+    private currentFetch;
+    constructor({ id, load, filters }: ConstructorParams);
+    private notify;
+    applyFilters(filters: LoadNotificationsFilters): Promise<void>;
+    loadMore(): Promise<void>;
+    hasMore(): boolean;
+    subscribe(listener: LazyNotificationListener): () => void;
+    update(readStatusMap: Map<string, boolean>): void;
+    mute(): void;
+}
+export {};
+//# sourceMappingURL=LazyNotificationList.d.ts.map

package/dist/context/notification/LazyNotificationList.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"LazyNotificationList.d.ts","sourceRoot":"","sources":["../../../src/context/notification/LazyNotificationList.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,8BAA8B,EAAE,2CAA2C,EAAE,MAAM,qBAAqB,CAAA;AACjH,OAAO,EAAE,wBAAwB,EAAE,wBAAwB,EAAE,wBAAwB,EAAE,MAAM,SAAS,CAAA;AAEtG,UAAU,iBAAiB;IACzB,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,CAAC,OAAO,EAAE,wBAAwB,KAAK,OAAO,CAAC,2CAA2C,CAAC,CAAC;IAClG,OAAO,CAAC,EAAE,wBAAwB,CAAC;CACpC;AAED,qBAAa,oBAAoB;;IAC/B,QAAQ,CAAC,EAAE,EAAE,MAAM,CAAA;IACnB,KAAK,EAAE,8BAA8B,EAAE,CAAK;IAC5C,OAAO,CAAC,IAAI,CAAK;IACjB,OAAO,CAAC,KAAK,CAAI;IACjB,OAAO,CAAC,OAAO,CAA0B;IACzC,OAAO,CAAC,QAAQ,CAAC,IAAI,CAA6F;IAClH,OAAO,CAAC,SAAS,CAAiC;IAClD,OAAO,CAAC,YAAY,CAA2B;gBAEnC,EAAE,EAAE,EAAE,IAAI,EAAE,OAAY,EAAE,EAAE,iBAAiB;IAMzD,OAAO,CAAC,MAAM;IAuBR,YAAY,CAAC,OAAO,EAAE,wBAAwB;IAsBpD,QAAQ;IAKR,OAAO;IAIP,SAAS,CAAC,QAAQ,EAAE,wBAAwB;IAO5C,MAAM,CAAC,aAAa,EAAE,GAAG,CAAC,MAAM,EAAE,OAAO,CAAC;IAY1C,IAAI;CAGL"}

package/dist/context/notification/LazyNotificationList.js

@@ -0,0 +1,136 @@
+var __classPrivateFieldGet = (this && this.__classPrivateFieldGet) || function (receiver, state, kind, f) {
+    if (kind === "a" && !f) throw new TypeError("Private accessor was defined without a getter");
+    if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError("Cannot read private member from an object whose class did not declare it");
+    return kind === "m" ? f : kind === "a" ? f.call(receiver) : f ? f.value : state.get(receiver);
+};
+var _LazyNotificationList_instances, _LazyNotificationList_loadMore;
+import { pull, uniqBy } from 'lodash';
+export class LazyNotificationList {
+    constructor({ id, load, filters = {} }) {
+        _LazyNotificationList_instances.add(this);
+        Object.defineProperty(this, "id", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: void 0
+        });
+        Object.defineProperty(this, "items", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: []
+        });
+        Object.defineProperty(this, "page", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: -1
+        });
+        Object.defineProperty(this, "total", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: 0
+        });
+        Object.defineProperty(this, "filters", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: void 0
+        });
+        Object.defineProperty(this, "load", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: void 0
+        });
+        Object.defineProperty(this, "listeners", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: []
+        });
+        Object.defineProperty(this, "currentFetch", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: void 0
+        });
+        this.id = id;
+        this.load = load;
+        this.filters = filters;
+    }
+    notify() {
+        const hasMore = this.hasMore();
+        this.listeners.forEach(l => l(this.items, hasMore));
+    }
+    async applyFilters(filters) {
+        try {
+            await this.currentFetch;
+        }
+        catch {
+            /* empty: this error will be treated by the function who actually triggered `currentFetch`. We just need to make sure we wait until
+            it ends before making new requests. */
+        }
+        const prevPage = this.page;
+        const prevFilters = this.filters;
+        this.filters = filters;
+        this.page = -1;
+        try {
+            this.currentFetch = __classPrivateFieldGet(this, _LazyNotificationList_instances, "m", _LazyNotificationList_loadMore).call(this, true);
+            await this.currentFetch;
+        }
+        catch (error) {
+            this.filters = prevFilters;
+            this.page = prevPage;
+            throw error;
+        }
+    }
+    loadMore() {
+        this.currentFetch ??= __classPrivateFieldGet(this, _LazyNotificationList_instances, "m", _LazyNotificationList_loadMore).call(this);
+        return this.currentFetch;
+    }
+    hasMore() {
+        return this.items.length < this.total;
+    }
+    subscribe(listener) {
+        this.listeners.push(listener);
+        return () => {
+            pull(this.listeners, listener);
+        };
+    }
+    update(readStatusMap) {
+        this.items.forEach(i => i.committed = readStatusMap.get(i.id) ?? i.committed);
+        if (this.filters.committed !== undefined) {
+            this.items = this.items.filter(i => i.committed === this.filters.committed);
+            // if the filtered list has one item or less, we update the list with the backend so it can show more items.
+            // we can't use loadMore in this case because the page 2 would now skip some items. We'd need the backend to implement a cursor
+            // interface.
+            if (this.items.length <= 1)
+                this.applyFilters(this.filters);
+        }
+        this.notify();
+    }
+    mute() {
+        this.listeners = [];
+    }
+}
+_LazyNotificationList_instances = new WeakSet(), _LazyNotificationList_loadMore = async function _LazyNotificationList_loadMore(reset = false) {
+    try {
+        const result = await this.load({ ...this.filters, page: this.page + 1 });
+        if (reset) {
+            this.items = [];
+            this.total = 0;
+        }
+        // we can't have items with the same id: this can happen if new notifications have been created after the first page was loaded.
+        this.items = uniqBy([...this.items, ...result.items], 'id');
+        // we can't keep loading more if we already loaded every item or if the API returned an empty list.
+        this.total = result.items.length ? (this.total || result.total) : this.items.length;
+        this.page++;
+        this.notify();
+    }
+    finally {
+        this.currentFetch = undefined;
+    }
+};
+//# sourceMappingURL=LazyNotificationList.js.map

package/dist/context/notification/LazyNotificationList.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"LazyNotificationList.js","sourceRoot":"","sources":["../../../src/context/notification/LazyNotificationList.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,EAAE,MAAM,QAAQ,CAAA;AAUrC,MAAM,OAAO,oBAAoB;IAU/B,YAAY,EAAE,EAAE,EAAE,IAAI,EAAE,OAAO,GAAG,EAAE,EAAqB;;QAThD;;;;;WAAU;QACnB;;;;mBAA0C,EAAE;WAAA;QACpC;;;;mBAAO,CAAC,CAAC;WAAA;QACT;;;;mBAAQ,CAAC;WAAA;QACT;;;;;WAAiC;QACxB;;;;;WAAiG;QAC1G;;;;mBAAwC,EAAE;WAAA;QAC1C;;;;;WAAuC;QAG7C,IAAI,CAAC,EAAE,GAAG,EAAE,CAAA;QACZ,IAAI,CAAC,IAAI,GAAG,IAAI,CAAA;QAChB,IAAI,CAAC,OAAO,GAAG,OAAO,CAAA;IACxB,CAAC;IAEO,MAAM;QACZ,MAAM,OAAO,GAAG,IAAI,CAAC,OAAO,EAAE,CAAA;QAC9B,IAAI,CAAC,SAAS,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,EAAE,OAAO,CAAC,CAAC,CAAA;IACrD,CAAC;IAoBD,KAAK,CAAC,YAAY,CAAC,OAAiC;QAClD,IAAI,CAAC;YACH,MAAM,IAAI,CAAC,YAAY,CAAA;QACzB,CAAC;QAAC,MAAM,CAAC;YACP;kDACsC;QACxC,CAAC;QACD,MAAM,QAAQ,GAAG,IAAI,CAAC,IAAI,CAAA;QAC1B,MAAM,WAAW,GAAG,IAAI,CAAC,OAAO,CAAA;QAChC,IAAI,CAAC,OAAO,GAAG,OAAO,CAAA;QACtB,IAAI,CAAC,IAAI,GAAG,CAAC,CAAC,CAAA;QACd,IAAI,CAAC;YAEH,IAAI,CAAC,YAAY,GAAG,uBAAA,IAAI,uEAAU,MAAd,IAAI,EAAW,IAAI,CAAC,CAAA;YACxC,MAAM,IAAI,CAAC,YAAY,CAAA;QACzB,CAAC;QAAC,OAAO,KAAK,EAAE,CAAC;YACf,IAAI,CAAC,OAAO,GAAG,WAAW,CAAA;YAC1B,IAAI,CAAC,IAAI,GAAG,QAAQ,CAAA;YACpB,MAAM,KAAK,CAAA;QACb,CAAC;IACH,CAAC;IAED,QAAQ;QACN,IAAI,CAAC,YAAY,KAAK,uBAAA,IAAI,uEAAU,MAAd,IAAI,CAAY,CAAA;QACtC,OAAO,IAAI,CAAC,YAAY,CAAA;IAC1B,CAAC;IAED,OAAO;QACL,OAAO,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,IAAI,CAAC,KAAK,CAAA;IACvC,CAAC;IAED,SAAS,CAAC,QAAkC;QAC1C,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAA;QAC7B,OAAO,GAAG,EAAE;YACV,IAAI,CAAC,IAAI,CAAC,SAAS,EAAE,QAAQ,CAAC,CAAA;QAChC,CAAC,CAAA;IACH,CAAC;IAED,MAAM,CAAC,aAAmC;QACxC,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,SAAS,GAAG,aAAa,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,CAAC,SAAS,CAAC,CAAA;QAC7E,IAAI,IAAI,CAAC,OAAO,CAAC,SAAS,KAAK,SAAS,EAAE,CAAC;YACzC,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,SAAS,KAAK,IAAI,CAAC,OAAO,CAAC,SAAS,CAAC,CAAA;YAC3E,4GAA4G;YAC5G,+HAA+H;YAC/H,aAAa;YACb,IAAI,IAAI,CAAC,KAAK,CAAC,MAAM,IAAI,CAAC;gBAAE,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,OAAO,CAAC,CAAA;QAC7D,CAAC;QACD,IAAI,CAAC,MAAM,EAAE,CAAA;IACf,CAAC;IAED,IAAI;QACF,IAAI,CAAC,SAAS,GAAG,EAAE,CAAA;IACrB,CAAC;CACF;kFAvEC,KAAK,yCAAW,KAAK,GAAG,KAAK;IAC3B,IAAI,CAAC;QACH,MAAM,MAAM,GAAG,MAAM,IAAI,CAAC,IAAI,CAAC,EAAE,GAAG,IAAI,CAAC,OAAO,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,GAAG,CAAC,EAAE,CAAC,CAAA;QACxE,IAAI,KAAK,EAAE,CAAC;YACV,IAAI,CAAC,KAAK,GAAG,EAAE,CAAA;YACf,IAAI,CAAC,KAAK,GAAG,CAAC,CAAA;QAChB,CAAC;QACD,gIAAgI;QAChI,IAAI,CAAC,KAAK,GAAG,MAAM,CAAC,CAAC,GAAG,IAAI,CAAC,KAAK,EAAE,GAAG,MAAM,CAAC,KAAK,CAAC,EAAE,IAAI,CAAC,CAAA;QAC3D,mGAAmG;QACnG,IAAI,CAAC,KAAK,GAAG,MAAM,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,IAAI,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,MAAM,CAAA;QACnF,IAAI,CAAC,IAAI,EAAE,CAAA;QACX,IAAI,CAAC,MAAM,EAAE,CAAA;IACf,CAAC;YAAS,CAAC;QACT,IAAI,CAAC,YAAY,GAAG,SAAS,CAAA;IAC/B,CAAC;AACH,CAAC"}