impact-ui 3.7.34-alpha.2 → 3.7.34-alpha.3

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

@@ -0,0 +1,100 @@
+import { ReactNode } from 'react';
+
+export type DrawerAnchor = 'left' | 'right' | 'top' | 'bottom';
+export interface NotificationTabItem {
+    label: string;
+    value: string;
+}
+export interface NotificationListItemData {
+    id: string | number;
+    label: string;
+    date: Date;
+    time: number;
+    description: string;
+    selected?: boolean;
+    read?: boolean;
+    status?: 'success' | 'fail' | 'pending';
+    badge?: string;
+    bookMarked?: boolean;
+    showBookMark?: boolean;
+    showOverdueIcon?: boolean;
+    showFastApproachingIcon?: boolean;
+    showNOverdueIcon?: boolean;
+    moveToPendingText?: string;
+    checkBoxClick?: NotificationListItemHandler;
+    handleSelectChange?: NotificationListItemHandler;
+    handleMarkCompleted?: NotificationListItemHandler;
+    handleMoveToPending?: NotificationListItemHandler;
+    handleMarkAsRead?: NotificationListItemHandler;
+    handleBookMark?: NotificationListItemHandler;
+    handleDeleteNotification?: NotificationListItemHandler;
+    handleDownloadNotification?: NotificationListItemHandler;
+}
+export type NotificationListItemHandler = (type?: string, notificationPanels?: NotificationPanelItem[], setNotificationPanels?: (panels: NotificationPanelItem[]) => void, list?: NotificationListItemData) => void;
+export interface NotificationPanelItem {
+    id: number;
+    value: string;
+    notificationList?: NotificationListItemData[] | ReactNode;
+    handleSettingClick?: () => void;
+    filterChip?: unknown;
+    selectedFilterChip?: unknown;
+    handleApplyFilter?: () => void;
+    isMultiSelectFilter?: boolean;
+    [key: string]: unknown;
+}
+export interface NotificationBadgeList {
+    id: number;
+    value: string;
+    lists?: {
+        id: number;
+        label: string;
+        numberOfTypes?: number;
+        handleClick?: () => void;
+        onClick?: () => void;
+    }[];
+}
+export interface NotificationProps {
+    title?: ReactNode;
+    anchor?: DrawerAnchor;
+    isOpen: boolean;
+    setIsOpen?: (open: boolean) => void;
+    className?: string;
+    handleClose?: () => void;
+    secondaryButtonLabel?: string;
+    onSecondaryButtonClick?: () => void;
+    primaryButtonLabel?: string;
+    onPrimaryButtonClick?: () => void;
+    onSettingButtonClick?: () => void;
+    handleSelectAll?: (type?: string, notificationList?: NotificationListItemData[]) => void;
+    handleMarkReadAll?: (type?: string, notificationList?: NotificationListItemData[]) => void;
+    handleMoveAllPending?: (type?: string, selectedItems?: NotificationListItemData[], selectedOption?: unknown) => void;
+    handleNotificationDeleteAll?: (type?: string, selectedItems?: NotificationListItemData[]) => void;
+    badgesList?: NotificationBadgeList[];
+    notificationTabs?: NotificationTabItem[];
+    notificationPanels?: NotificationPanelItem[];
+    setNotificationPanels?: (panels: NotificationPanelItem[]) => void;
+    handleTabChange?: (value: string) => void;
+    moveToPendingDropdownOptions?: unknown;
+    activeNotiTab?: string;
+    activeBadge?: string;
+    showBadgeLoader?: boolean;
+    showNotificationListLoader?: boolean;
+    displayFormat?: string;
+    onNotificationScrollToBottom?: () => void;
+    scrollThreshold?: number;
+    isWithSearch?: boolean;
+    isHoverOnCard?: boolean;
+    isChipsExpandable?: boolean;
+    isDeleteAlwaysVisible?: boolean;
+    isEmptyState?: boolean;
+    emptyStateTitle?: string;
+    emptyStateDescription?: string;
+    customNotificationJsx?: ReactNode;
+    /** Optional body component (e.g. for testing); defaults to NotificationBody */
+    NotificationBodyComponent?: React.ComponentType<Record<string, unknown>>;
+}
+/** @deprecated Use NotificationListItemData */
+export type NotificationItem = NotificationListItemData;
+/** @deprecated Use NotificationPanelItem */
+export type NotificationPanel = NotificationPanelItem;
+//# sourceMappingURL=Notification.types.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Notification.types.d.ts","sourceRoot":"","sources":["../../../src/components/Notification/Notification.types.ts"],"names":[],"mappings":"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"}

package/dist/components/Notification/NotificationBody/NotificationBody.types.d.ts

@@ -0,0 +1,35 @@
+import { ReactNode } from 'react';
+import { NotificationTabItem, NotificationPanelItem, NotificationBadgeList } from '../Notification.types';
+
+export interface NotificationBodyProps {
+    expand?: boolean;
+    badgesList?: NotificationBadgeList[];
+    notificationTabs: NotificationTabItem[];
+    notificationPanels: NotificationPanelItem[];
+    setNotificationPanels?: (panels: NotificationPanelItem[]) => void;
+    onSettingButtonClick?: () => void;
+    handleSelectAll?: () => void;
+    handleMarkReadAll?: () => void;
+    handleMoveAllPending?: () => void;
+    handleNotificationDeleteAll?: () => void;
+    handleTabChange?: (value: string) => void;
+    moveToPendingDropdownOptions?: unknown;
+    activeNotiTab?: string;
+    activeBadge?: string;
+    showBadgeLoader?: boolean;
+    showNotificationListLoader?: boolean;
+    displayFormat?: string;
+    onNotificationScrollToBottom?: () => void;
+    scrollThreshold?: number;
+    isWithSearch?: boolean;
+    isHoverOnCard?: boolean;
+    isChipsExpandable?: boolean;
+    isDeleteAlwaysVisible?: boolean;
+    isEmptyState?: boolean;
+    emptyStateTitle?: string;
+    emptyStateDescription?: string;
+    customNotificationJsx?: ReactNode;
+    /** Optional custom render for each tab panel (default: placeholder) */
+    renderPanel?: (item: NotificationPanelItem, index: number) => ReactNode;
+}
+//# sourceMappingURL=NotificationBody.types.d.ts.map

package/dist/components/Notification/NotificationBody/NotificationBody.types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"NotificationBody.types.d.ts","sourceRoot":"","sources":["../../../../src/components/Notification/NotificationBody/NotificationBody.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,KAAK,EACV,mBAAmB,EACnB,qBAAqB,EACrB,qBAAqB,EACtB,MAAM,uBAAuB,CAAC;AAE/B,MAAM,WAAW,qBAAqB;IACpC,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,UAAU,CAAC,EAAE,qBAAqB,EAAE,CAAC;IACrC,gBAAgB,EAAE,mBAAmB,EAAE,CAAC;IACxC,kBAAkB,EAAE,qBAAqB,EAAE,CAAC;IAC5C,qBAAqB,CAAC,EAAE,CAAC,MAAM,EAAE,qBAAqB,EAAE,KAAK,IAAI,CAAC;IAClE,oBAAoB,CAAC,EAAE,MAAM,IAAI,CAAC;IAClC,eAAe,CAAC,EAAE,MAAM,IAAI,CAAC;IAC7B,iBAAiB,CAAC,EAAE,MAAM,IAAI,CAAC;IAC/B,oBAAoB,CAAC,EAAE,MAAM,IAAI,CAAC;IAClC,2BAA2B,CAAC,EAAE,MAAM,IAAI,CAAC;IACzC,eAAe,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAC1C,4BAA4B,CAAC,EAAE,OAAO,CAAC;IACvC,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,0BAA0B,CAAC,EAAE,OAAO,CAAC;IACrC,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,4BAA4B,CAAC,EAAE,MAAM,IAAI,CAAC;IAC1C,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,qBAAqB,CAAC,EAAE,MAAM,CAAC;IAC/B,qBAAqB,CAAC,EAAE,SAAS,CAAC;IAClC,uEAAuE;IACvE,WAAW,CAAC,EAAE,CAAC,IAAI,EAAE,qBAAqB,EAAE,KAAK,EAAE,MAAM,KAAK,SAAS,CAAC;CACzE"}

package/dist/components/Notification/NotificationBody/NotificationList/NotificationChipsList.d.ts

@@ -0,0 +1,21 @@
+import { NotificationListItemData } from '../../Notification.types';
+
+export interface NotificationChipItem {
+    id?: number;
+    label: string;
+    numberOfTypes?: number;
+    handleClick?: () => void;
+    onClick?: () => void;
+}
+interface NotificationChipsListProps {
+    list: NotificationChipItem[];
+    currActiveListType: string;
+    setCurrActiveListType: (label: string) => void;
+    activeBadge?: string;
+    showBadgeLoader?: boolean;
+    notificationList: NotificationListItemData[];
+    expandList: boolean;
+}
+export declare function NotificationChipsList({ list, currActiveListType, setCurrActiveListType, activeBadge, showBadgeLoader, notificationList, expandList, }: NotificationChipsListProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=NotificationChipsList.d.ts.map

package/dist/components/Notification/NotificationBody/NotificationList/NotificationChipsList.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"NotificationChipsList.d.ts","sourceRoot":"","sources":["../../../../../src/components/Notification/NotificationBody/NotificationList/NotificationChipsList.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,0BAA0B,CAAC;AAEzE,MAAM,WAAW,oBAAoB;IACnC,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,KAAK,EAAE,MAAM,CAAC;IACd,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,WAAW,CAAC,EAAE,MAAM,IAAI,CAAC;IACzB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB;AAED,UAAU,0BAA0B;IAClC,IAAI,EAAE,oBAAoB,EAAE,CAAC;IAC7B,kBAAkB,EAAE,MAAM,CAAC;IAC3B,qBAAqB,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAC/C,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,gBAAgB,EAAE,wBAAwB,EAAE,CAAC;IAC7C,UAAU,EAAE,OAAO,CAAC;CACrB;AAWD,wBAAgB,qBAAqB,CAAC,EACpC,IAAI,EACJ,kBAAkB,EAClB,qBAAqB,EACrB,WAAW,EACX,eAAe,EACf,gBAAgB,EAChB,UAAU,GACX,EAAE,0BAA0B,2CA4B5B"}

package/dist/components/Notification/NotificationBody/NotificationList/NotificationChipsList.js

@@ -0,0 +1,49 @@
+import { jsx } from "react/jsx-runtime";
+import { Badge } from "../../../Badge/index.js";
+import { Loader } from "../../../Loader/index.js";
+function getBadgeLabel(item, notificationList) {
+  const baseLabel = item.label || "";
+  if (item.numberOfTypes) {
+    return `${baseLabel} (${item.numberOfTypes})`;
+  }
+  const count = notificationList.filter((listItem) => listItem.badge === item.label).length;
+  return count > 0 ? `${baseLabel} (${count})` : baseLabel;
+}
+function NotificationChipsList({
+  list,
+  currActiveListType,
+  setCurrActiveListType,
+  activeBadge,
+  showBadgeLoader,
+  notificationList,
+  expandList
+}) {
+  if (showBadgeLoader) {
+    return /* @__PURE__ */ jsx(Loader, { showSkeleton: true, size: "small" });
+  }
+  const activeLabel = activeBadge != null && activeBadge !== "" ? activeBadge : currActiveListType;
+  return /* @__PURE__ */ jsx("div", { className: "impact-notification-task-list-chips", children: /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: `impact-notification-task-list-item ${expandList ? "list-item-full-width" : ""}`,
+      children: list.map((item, index) => /* @__PURE__ */ jsx(
+        Badge,
+        {
+          color: activeLabel === item.label ? "info" : void 0,
+          label: getBadgeLabel(item, notificationList),
+          variant: "stroke",
+          onClick: () => {
+            var _a, _b;
+            (_a = item.handleClick) == null ? void 0 : _a.call(item);
+            (_b = item.onClick) == null ? void 0 : _b.call(item);
+            setCurrActiveListType(item.label);
+          }
+        },
+        item.id ?? index
+      ))
+    }
+  ) });
+}
+export {
+  NotificationChipsList
+};

package/dist/components/Notification/NotificationBody/NotificationList/NotificationList.d.ts

@@ -0,0 +1,30 @@
+import { SelectOption } from '../../../Select/Select.types';
+import { NotificationListItemData, NotificationPanelItem } from '../../Notification.types';
+
+export interface NotificationListProps {
+    expand?: boolean;
+    type: string;
+    title?: string;
+    notificationList: NotificationListItemData[];
+    notificationPanels: NotificationPanelItem[];
+    setNotificationPanels?: (panels: NotificationPanelItem[]) => void;
+    handleSelectAll?: (type?: string, notificationList?: NotificationListItemData[]) => void;
+    handleMarkReadAll?: (type?: string, notificationList?: NotificationListItemData[]) => void;
+    handleMoveAllPending?: (type?: string, selectedItems?: NotificationListItemData[], selectedOption?: unknown) => void;
+    moveToPendingDropdownOptions?: SelectOption[];
+    handleNotificationDeleteAll?: (type?: string, selectedItems?: NotificationListItemData[]) => void;
+    showNotificationListLoader?: boolean;
+    showBadgeLoader?: boolean;
+    displayFormat?: string;
+    onNotificationScrollToBottom?: () => void | Promise<void>;
+    scrollThreshold?: number;
+    isHoverOnCard?: boolean;
+    isDeleteAlwaysVisible?: boolean;
+    isEmptyState?: boolean;
+    emptyStateTitle?: string;
+    emptyStateDescription?: string;
+    customNotificationJsx?: React.ReactNode;
+}
+export declare function getPanelNotificationList(panel: NotificationPanelItem): NotificationListItemData[];
+export declare function NotificationList({ expand, type, title, notificationList, notificationPanels, setNotificationPanels, handleSelectAll, handleMarkReadAll, handleMoveAllPending, moveToPendingDropdownOptions, handleNotificationDeleteAll, showNotificationListLoader, showBadgeLoader, displayFormat, onNotificationScrollToBottom, scrollThreshold, isHoverOnCard, isDeleteAlwaysVisible, isEmptyState, emptyStateTitle, emptyStateDescription, customNotificationJsx, }: NotificationListProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=NotificationList.d.ts.map

package/dist/components/Notification/NotificationBody/NotificationList/NotificationList.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"NotificationList.d.ts","sourceRoot":"","sources":["../../../../../src/components/Notification/NotificationBody/NotificationList/NotificationList.tsx"],"names":[],"mappings":"AAOA,OAAO,gCAAgC,CAAC;AACxC,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,8BAA8B,CAAC;AACjE,OAAO,KAAK,EAAE,wBAAwB,EAAE,qBAAqB,EAAE,MAAM,0BAA0B,CAAC;AAIhG,MAAM,WAAW,qBAAqB;IACpC,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,gBAAgB,EAAE,wBAAwB,EAAE,CAAC;IAC7C,kBAAkB,EAAE,qBAAqB,EAAE,CAAC;IAC5C,qBAAqB,CAAC,EAAE,CAAC,MAAM,EAAE,qBAAqB,EAAE,KAAK,IAAI,CAAC;IAClE,eAAe,CAAC,EAAE,CAAC,IAAI,CAAC,EAAE,MAAM,EAAE,gBAAgB,CAAC,EAAE,wBAAwB,EAAE,KAAK,IAAI,CAAC;IACzF,iBAAiB,CAAC,EAAE,CAAC,IAAI,CAAC,EAAE,MAAM,EAAE,gBAAgB,CAAC,EAAE,wBAAwB,EAAE,KAAK,IAAI,CAAC;IAC3F,oBAAoB,CAAC,EAAE,CACrB,IAAI,CAAC,EAAE,MAAM,EACb,aAAa,CAAC,EAAE,wBAAwB,EAAE,EAC1C,cAAc,CAAC,EAAE,OAAO,KACrB,IAAI,CAAC;IACV,4BAA4B,CAAC,EAAE,YAAY,EAAE,CAAC;IAC9C,2BAA2B,CAAC,EAAE,CAAC,IAAI,CAAC,EAAE,MAAM,EAAE,aAAa,CAAC,EAAE,wBAAwB,EAAE,KAAK,IAAI,CAAC;IAClG,0BAA0B,CAAC,EAAE,OAAO,CAAC;IACrC,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,4BAA4B,CAAC,EAAE,MAAM,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;IAC1D,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,qBAAqB,CAAC,EAAE,MAAM,CAAC;IAC/B,qBAAqB,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CACzC;AAQD,wBAAgB,wBAAwB,CAAC,KAAK,EAAE,qBAAqB,GAAG,wBAAwB,EAAE,CAMjG;AAED,wBAAgB,gBAAgB,CAAC,EAC/B,MAAc,EACd,IAAI,EACJ,KAAU,EACV,gBAAgB,EAChB,kBAAkB,EAClB,qBAAqB,EACrB,eAAe,EACf,iBAAiB,EACjB,oBAAoB,EACpB,4BAA4B,EAC5B,2BAA2B,EAC3B,0BAAkC,EAClC,eAAuB,EACvB,aAA4B,EAC5B,4BAA4B,EAC5B,eAAoB,EACpB,aAAqB,EACrB,qBAA6B,EAC7B,YAAoB,EACpB,eAAkD,EAClD,qBAAsE,EACtE,qBAAqB,GACtB,EAAE,qBAAqB,2CAiMvB"}

package/dist/components/Notification/NotificationBody/NotificationList/NotificationList.js

@@ -0,0 +1,212 @@
+!function(){"use strict";try{if("undefined"!=typeof document){var i=document.createElement("style");i.appendChild(document.createTextNode(".impact-notification-container{height:100%;transition:width .2s ease-in;width:600px}.impact-notification-container .impact-notification-header{align-items:center;background-color:#fff;border-bottom:1px solid #d9dde7;display:flex;height:40px;justify-content:space-between;padding:0 16px;position:sticky;top:0;z-index:1}.impact-notification-container .impact-notification-header .impact-notification-heading{font-size:16px;font-weight:700;line-height:20px}.impact-notification-container .impact-notification-header .impact-notification-header-action-btns{align-items:center;display:flex;gap:12px}.impact-notification-container .impact-notification-header .impact-notification-header-action-btns button{background-color:#f5f6fa;border:none;border-radius:8px;cursor:pointer;height:32px;width:32px}.impact-notification-container .impact-notification-header .collapse-icon{background:url(https://impact-kit.devs.iaproducts.ai/api/v1/files/uploads/impact-ui/prod/icons/collapse-icon-2.svg) no-repeat;background-position:50%;background-size:16px;cursor:pointer;height:16px;width:16px}.impact-notification-container .impact-notification-header .expand-icon{background:url(https://impact-kit.devs.iaproducts.ai/api/v1/files/uploads/impact-ui/prod/icons/expand-icon.svg) no-repeat;background-position:50%;background-size:20px;cursor:pointer;height:16px;width:16px}.impact-notification-container .impact-notification-header .impact-notification-header-close-btn{background:url(https://impact-kit.devs.iaproducts.ai/api/v1/files/uploads/impact-ui/prod/icons/close-tags.svg) no-repeat;background-position:50%;background-size:24px;cursor:pointer;height:16px;width:16px}.impact-notification-container .impact-notification-body-container{height:calc(100% - 96px);padding:20px 16px}.impact-notification-container .notification-body-container-full{height:calc(100% - 40px)}.impact-notification-container .impact-notification-body-header-container{align-items:baseline;display:flex;flex-direction:row;gap:12px}.impact-notification-container .impact-notification-body-header-container .ia-tabContainer{height:100%;width:100%}.impact-notification-container .impact-notification-body-header-container .ia-tabContainer .impact-tab-panel{height:calc(100% - 156px);overflow:hidden;padding:20px 0 0;position:absolute;width:calc(100% - 32px)}.impact-notification-container .impact-notification-body-header-container .ia-tabContainer .impact-tab-panel .ia-tabPanel{height:100%}.impact-notification-container .impact-notification-body-header-container .ia-tabContainer .impact-tab-panel .ia-tabPanel .MuiBox-root:has(.empty-state-container){height:100%}.impact-notification-container .impact-notification-body-header-container .ia-styles.ia-btn{flex-shrink:0}.impact-notification-container .impact-notification-task-list-filter-container{background:#fff;border:1px solid #b3bdf8;border-radius:12px;min-height:128px;padding:16px;position:absolute;right:0;top:65px;width:379px;z-index:99999}.impact-notification-container .impact-notification-task-list-filter-item{align-items:center;display:flex;flex-wrap:wrap;gap:12px;margin-bottom:10px}.impact-notification-container .impact-notification-task-list-title{align-items:center;display:flex;gap:4px;margin-bottom:8px}.impact-notification-container .impact-notification-task-list-title .impact-notification-task-list-title-text{color:#1f2b4d;font-size:16px;font-weight:600;line-height:24px}.impact-notification-container .impact-notification-task-list-title .impact-notification-task-list-title-text-sub{color:#60697d;font-size:12px;font-weight:500;line-height:16px}.impact-notification-container .impact-notification-task-list-filter-item-badge .MuiChip-root.impact_badges_only_label_subtle{background-color:#f5f6fa;border:1px solid #c3c8d4;cursor:pointer}.impact-notification-container .impact-notification-task-list-filter-item-badge .MuiChip-root.impact_badges_only_label_subtle .MuiChip-label{color:#7a8294}.impact-notification-container .impact-notification-task-list-filter-item-badge.selected .MuiChip-root.impact_badges_only_label_subtle{background-color:#eceefd;border:1px solid #4259ee;cursor:pointer}.impact-notification-container .impact-notification-task-list-filter-item-badge.selected .MuiChip-root.impact_badges_only_label_subtle .MuiChip-label{color:#4259ee}.impact-notification-container .body-header-container-full .ia-tabContainer .impact-tab-panel{height:calc(100% - 100px)}.impact-notification-container .impact-notification-footer-container{align-items:center;background:#fff;border-top:1px solid #d9dde7;bottom:0;display:flex;gap:8px;height:56px;justify-content:flex-end;left:0;padding:0 16px;position:absolute;right:0;z-index:1}.impact-notification-task-list-container{height:100vh}.impact-notification-task-list-container.empty-state-container{height:100%}.impact-notification-task-list-container .impact-notification-task-list-header{align-items:center;border-bottom:1px solid #d9dde7;display:flex;justify-content:space-between;padding-bottom:20px}.impact-notification-task-list-container .impact-notification-task-list-search-container{position:relative}.impact-notification-task-list-container .impact-notification-task-list-search-container .impact-input-wrapper{height:27px;min-width:100%!important;transition:width .2s ease-in-out;width:35px}.impact-notification-task-list-container .impact-notification-task-list-search-container .right-input-icon{position:relative;right:7px;top:1px}.impact-notification-task-list-container .search-expand .impact-input-wrapper{width:240px}.impact-notification-task-list-container .search-expand .right-input-icon{left:0}.impact-notification-task-list-container .ia-styles.ia-btn.ia-btn-text:focus{outline:none}.impact-notification-task-list-container .impact-notification-task-list-chips{display:flex;flex-basis:90%;gap:4px;overflow:hidden}.impact-notification-task-list-container .impact-notification-task-list-chips .impact-notification-task-list-item{display:flex;gap:4px}.impact-notification-task-list-container .impact-notification-task-list-chips .impact-notification-task-list-item .MuiChip-label{font-size:12px!important}.impact-notification-task-list-container .impact-notification-task-list-chips .impact-notification-task-list-item-hidden{display:flex;gap:4px;overflow:hidden;transition:width .2s ease-in;width:0}.impact-notification-task-list-container .impact-notification-task-list-chips .list-item-full-width{width:100%}.impact-notification-task-list-container .impact-notification-task-list-actions{align-items:center;display:flex;gap:4px}.impact-notification-list-container{height:100%;padding-top:20px}.impact-notification-list-container .impact-notification-list-header{align-items:center;display:flex;flex-direction:row;justify-content:space-between;padding-bottom:20px}.impact-notification-list-container .impact-notification-list-title{color:#1f2b4d;font-family:Manrope,sans-serif;font-size:16px;font-weight:600;line-height:24px}.impact-notification-list-container .impact-notification-list-action-btns{align-items:center;display:flex;flex-direction:row;gap:4px}.impact-notification-list-container .impact-notification-list-items-container{display:flex;flex-direction:column;gap:8px;height:calc(100% - 280px);overflow-y:auto;padding-bottom:20px;scroll-behavior:smooth}.impact-notification-list-container .impact-notification-list-items-container .impact-notification-list-item{align-items:flex-start;background-color:#f8f9fb;border-radius:12px;display:flex;flex-direction:row;gap:8px;padding:16px 12px}.impact-notification-list-container .impact-notification-list-items-container .impact-notification-list-item .impact-notification-list-item-checkbox{padding-top:5px}.impact-notification-list-container .impact-notification-list-items-container .impact-notification-list-item .impact-notification-list-item-icon{align-items:center;border-radius:50%;display:flex;flex-shrink:0;height:30px;justify-content:center;width:30px}.impact-notification-list-container .impact-notification-list-items-container .impact-notification-list-item .impact-notification-list-item-icon .impact-notification-list-item-icon-line{height:15px;width:2px}.impact-notification-list-container .impact-notification-list-items-container .impact-notification-list-item .impact-notification-list-item-icon.status-success{background-color:#ebf7f1;border:1px solid #108431}.impact-notification-list-container .impact-notification-list-items-container .impact-notification-list-item .impact-notification-list-item-icon.status-success .impact-notification-list-item-icon-line{background-color:#108431}.impact-notification-list-container .impact-notification-list-items-container .impact-notification-list-item .impact-notification-list-item-icon.status-fail{background-color:#fceeee;border:1px solid #ec4c5c}.impact-notification-list-container .impact-notification-list-items-container .impact-notification-list-item .impact-notification-list-item-icon.status-fail .impact-notification-list-item-icon-line{background-color:#ec4c5c}.impact-notification-list-container .impact-notification-list-items-container .impact-notification-list-item .impact-notification-list-item-icon.status-pending{background-color:#fcf8ea;border:1px solid #ffe174}.impact-notification-list-container .impact-notification-list-items-container .impact-notification-list-item .impact-notification-list-item-icon.status-pending .impact-notification-list-item-icon-line{background-color:#ffe174}.impact-notification-list-container .impact-notification-list-items-container .impact-notification-list-item .impact-notification-list-item-container{align-items:flex-start;display:flex;flex-direction:column;gap:6px;justify-content:flex-start;width:100%}.impact-notification-list-container .impact-notification-list-items-container .impact-notification-list-item .impact-notification-list-item-container .impact-notification-list-item-header{align-items:center;display:flex;flex-direction:row;gap:8px;justify-content:space-between;width:100%}.impact-notification-list-container .impact-notification-list-items-container .impact-notification-list-item .impact-notification-list-item-container .impact-notification-list-item-header:focus,.impact-notification-list-container .impact-notification-list-items-container .impact-notification-list-item .impact-notification-list-item-container .impact-notification-list-item-header:hover{cursor:pointer}.impact-notification-list-container .impact-notification-list-items-container .impact-notification-list-item .impact-notification-list-item-container .impact-notification-list-item-header:focus .impact-notification-list-item-header-right,.impact-notification-list-container .impact-notification-list-items-container .impact-notification-list-item .impact-notification-list-item-container .impact-notification-list-item-header:hover .impact-notification-list-item-header-right{width:24%}.impact-notification-list-container .impact-notification-list-items-container .impact-notification-list-item .impact-notification-list-item-container .impact-notification-list-item-header .impact-notification-list-item-header-left,.impact-notification-list-container .impact-notification-list-items-container .impact-notification-list-item .impact-notification-list-item-container .impact-notification-list-item-header .impact-notification-list-item-header-right{align-items:center;display:flex;flex-direction:row;gap:8px}.impact-notification-list-container .impact-notification-list-items-container .impact-notification-list-item .impact-notification-list-item-container .impact-notification-list-item-header .impact-notification-list-item-title{color:#0d152c;font-family:Manrope,sans-serif;font-size:14px;font-weight:800;line-height:21px}.impact-notification-list-container .impact-notification-list-items-container .impact-notification-list-item .impact-notification-list-item-container .impact-notification-list-item-header .impact-notification-list-item-header-right{overflow:hidden;transition:width .4s ease-in-out;width:0}.impact-notification-list-container .impact-notification-list-items-container .impact-notification-list-item .impact-notification-list-item-container .impact-notification-list-item-header .impact-notification-list-item-header-right .impact-notification-list-item-delete-btn{display:inline-flex!important;opacity:1!important;visibility:visible!important}.impact-notification-list-container .impact-notification-list-items-container .impact-notification-list-item .impact-notification-list-item-container .impact-notification-list-item-header .impact-notification-list-item-header-right .impact-notification-list-item-delete-btn~*{display:none!important}.impact-notification-list-container .impact-notification-list-items-container .impact-notification-list-item .impact-notification-list-item-container .impact-notification-list-item-header:has(.impact-notification-list-item-delete-btn) .impact-notification-list-item-header-right{width:24%!important}.impact-notification-list-container .impact-notification-list-items-container .impact-notification-list-item .impact-notification-list-item-container .impact-notification-list-item-header:hover .impact-notification-list-item-header-right .impact-notification-list-item-delete-btn~*{display:inline-flex!important;opacity:1!important;visibility:visible!important}.impact-notification-list-container .impact-notification-list-items-container .impact-notification-list-item .impact-notification-list-item-container .impact-notification-list-item-schedule{align-items:center;color:#5f6673;display:flex;flex-direction:row;font-family:Manrope,sans-serif;font-size:12px;font-weight:500;gap:8px;justify-content:flex-start;line-height:15px}.impact-notification-list-container .impact-notification-list-items-container .impact-notification-list-item .impact-notification-list-item-container .impact-notification-list-item-description{color:#394960;font-family:Manrope,sans-serif;font-size:14px;font-weight:500;line-height:20px}.impact-notification-list-container .impact-notification-list-items-container .impact-notification-list-item .impact-notification-list-item-container .impact-notification-list-item-description span{color:#4259ee;cursor:pointer}.impact-notification-list-container .impact-notification-list-items-container .impact-notification-list-item .impact-notification-list-item-container .impact-notification-list-item-action-btns{align-items:center;display:flex;flex-direction:row;gap:8px}.impact-notification-list-container .impact-notification-list-items-container .impact-notification-list-item.impact-notification-list-item-hover-on-card .impact-notification-list-item-container .impact-notification-list-item-header:focus .impact-notification-list-item-header-right,.impact-notification-list-container .impact-notification-list-items-container .impact-notification-list-item.impact-notification-list-item-hover-on-card .impact-notification-list-item-container .impact-notification-list-item-header:hover .impact-notification-list-item-header-right{width:0!important}.impact-notification-list-container .impact-notification-list-items-container .impact-notification-list-item.impact-notification-list-item-hover-on-card:hover .impact-notification-list-item-container .impact-notification-list-item-header .impact-notification-list-item-header-right{width:24%!important}.impact-notification-list-container .impact-notification-list-items-container .list-item-selected{background-color:#eceefd}.impact-notification-list-container .impact-notification-list-items-container .list-item-read{border-left:3px solid #4259ee}.impact-notification-list-empty-state-container{align-items:center;display:flex;flex-direction:column;gap:16px;height:calc(100% - 48px);justify-content:center}.impact-notification-list-empty-state-container .impact-notification-list-empty-state-icon{height:72px;width:72px}.impact-notification-list-empty-state-container .impact-notification-list-empty-state-content{align-items:center;display:flex;flex-direction:column;gap:4px;justify-content:center}.impact-notification-list-empty-state-container .impact-notification-list-empty-state-content .impact-notification-list-empty-state-title{color:#0d152c;font-size:20px;font-weight:800;line-height:28px}.impact-notification-list-empty-state-container .impact-notification-list-empty-state-content .impact-notification-list-empty-state-description{color:#7a8294;font-size:14px;font-weight:500;line-height:21px}.impact-notification-container-expand{width:800px}.impact-notification-list-item-bookmark-btn.ia-styles.ia-btn.ia-btn-text svg path{fill:#4258ed!important}.impact-notification-list-header .impact-notification-list-title-loader .css-tqb5fd-MuiSkeleton-root{display:none}.impact-notification-list-header .impact-notification-list-title-loader .css-58ftfq-MuiSkeleton-root{width:40px!important}.impact-notification-list-loader-container .css-70qvj9{left:calc(50% - 157px);position:absolute;top:calc(50% - 15px)}.impact-notification-list-action-btns-loader .css-tqb5fd-MuiSkeleton-root{display:none}.impact-notification-list-action-btns-loader .css-1366qbr{position:absolute;right:calc(50% - 150px)}")),document.head.appendChild(i)}}catch(t){console.error("vite-plugin-css-injected-by-js",t)}}();
+import { jsxs, jsx, Fragment } from "react/jsx-runtime";
+import { useRef, useState, useEffect, useCallback } from "react";
+import default_1 from "../../../../node_modules/@mui/icons-material/DeleteOutlineOutlined.js";
+import { getAssetUrl } from "../../../../utils/assetBase.js";
+import { NotificationListItem } from "./NotificationListItem.js";
+import { Button } from "../../../Button/index.js";
+import { Loader } from "../../../Loader/index.js";
+import { Select } from "../../../Select/index.js";
+
+const NotificationEmptyStateIcon = getAssetUrl("webp/notificationEmptyStateIcon.webp");
+function isNotificationListData(value) {
+  return Array.isArray(value);
+}
+function getPanelNotificationList(panel) {
+  const { notificationList } = panel;
+  if (!isNotificationListData(notificationList)) {
+    return [];
+  }
+  return notificationList;
+}
+function NotificationList({
+  expand = false,
+  type,
+  title = "",
+  notificationList,
+  notificationPanels,
+  setNotificationPanels,
+  handleSelectAll,
+  handleMarkReadAll,
+  handleMoveAllPending,
+  moveToPendingDropdownOptions,
+  handleNotificationDeleteAll,
+  showNotificationListLoader = false,
+  showBadgeLoader = false,
+  displayFormat = "MM/DD/YYYY",
+  onNotificationScrollToBottom,
+  scrollThreshold = 50,
+  isHoverOnCard = false,
+  isDeleteAlwaysVisible = false,
+  isEmptyState = false,
+  emptyStateTitle = "Everything looks quiet for now",
+  emptyStateDescription = "We'll notify you when something new comes up",
+  customNotificationJsx
+}) {
+  const isLoading = useRef(false);
+  const [moveToPendingOpen, setMoveToPendingOpen] = useState(false);
+  const [currentOptions, setCurrentOptions] = useState(
+    moveToPendingDropdownOptions ?? []
+  );
+  const [selectedOptions, setSelectedOptions] = useState([]);
+  useEffect(() => {
+    setCurrentOptions(moveToPendingDropdownOptions ?? []);
+  }, [moveToPendingDropdownOptions]);
+  const handleNotificationScroll = useCallback(
+    async (e) => {
+      const { scrollTop, scrollHeight, clientHeight } = e.currentTarget;
+      const reachedBottom = scrollTop + clientHeight >= scrollHeight - scrollThreshold;
+      if (reachedBottom && !isLoading.current) {
+        isLoading.current = true;
+        try {
+          await (onNotificationScrollToBottom == null ? void 0 : onNotificationScrollToBottom());
+        } finally {
+          isLoading.current = false;
+        }
+      }
+    },
+    [onNotificationScrollToBottom, scrollThreshold]
+  );
+  const visibleItems = notificationList.some((item) => item.badge !== void 0) ? notificationList.filter((item) => item.badge === title) : notificationList;
+  const selectedCount = notificationList.filter((item) => item.selected).length;
+  if (isEmptyState) {
+    return /* @__PURE__ */ jsxs("div", { className: "impact-notification-list-empty-state-container", children: [
+      /* @__PURE__ */ jsx(
+        "img",
+        {
+          alt: "notification-empty-state",
+          className: "impact-notification-list-empty-state-icon",
+          src: NotificationEmptyStateIcon
+        }
+      ),
+      /* @__PURE__ */ jsxs("div", { className: "impact-notification-list-empty-state-content", children: [
+        /* @__PURE__ */ jsx("span", { className: "impact-notification-list-empty-state-title", children: emptyStateTitle }),
+        /* @__PURE__ */ jsx("span", { className: "impact-notification-list-empty-state-description", children: emptyStateDescription })
+      ] })
+    ] });
+  }
+  if (customNotificationJsx) {
+    return /* @__PURE__ */ jsx(Fragment, { children: customNotificationJsx });
+  }
+  return /* @__PURE__ */ jsxs("div", { className: "impact-notification-list-container", children: [
+    /* @__PURE__ */ jsxs("div", { className: "impact-notification-list-header", children: [
+      showBadgeLoader ? /* @__PURE__ */ jsx("div", { className: "impact-notification-list-title-loader", children: /* @__PURE__ */ jsx(Loader, { showSkeleton: true, size: "small" }) }) : /* @__PURE__ */ jsx("div", { className: "impact-notification-list-title", children: title }),
+      showNotificationListLoader ? /* @__PURE__ */ jsx("div", { className: "impact-notification-list-action-btns-loader", children: /* @__PURE__ */ jsx(Loader, { showSkeleton: true, size: "small" }) }) : /* @__PURE__ */ jsxs("div", { className: "impact-notification-list-action-btns", children: [
+        handleSelectAll && /* @__PURE__ */ jsx(
+          Button,
+          {
+            size: "small",
+            variant: "url",
+            onClick: () => {
+              handleSelectAll(type, notificationList);
+            },
+            children: "Select All"
+          }
+        ),
+        handleMarkReadAll && /* @__PURE__ */ jsxs(Fragment, { children: [
+          /* @__PURE__ */ jsx("span", { className: "impact-notification-separator" }),
+          /* @__PURE__ */ jsx(
+            Button,
+            {
+              size: "small",
+              variant: "url",
+              onClick: () => {
+                handleMarkReadAll(type, notificationList);
+              },
+              children: "Mark all as read"
+            }
+          )
+        ] }),
+        handleMoveAllPending && /* @__PURE__ */ jsxs(Fragment, { children: [
+          /* @__PURE__ */ jsx("span", { className: "impact-notification-separator" }),
+          moveToPendingDropdownOptions ? /* @__PURE__ */ jsxs(Fragment, { children: [
+            /* @__PURE__ */ jsx("p", { style: { fontSize: "12px" }, children: "Move to" }),
+            /* @__PURE__ */ jsx(
+              Select,
+              {
+                currentOptions,
+                handleChange: (selectedOption) => {
+                  handleMoveAllPending(
+                    type,
+                    notificationList.filter((item) => item.selected),
+                    selectedOption
+                  );
+                },
+                initialOptions: moveToPendingDropdownOptions,
+                isDisabled: selectedCount === 0,
+                isOpen: moveToPendingOpen,
+                minWidth: "140px",
+                name: "move-to-pending",
+                selectedOptions,
+                setCurrentOptions,
+                setIsOpen: setMoveToPendingOpen,
+                setSelectedOptions: (opts) => {
+                  setSelectedOptions(opts ?? []);
+                }
+              }
+            )
+          ] }) : /* @__PURE__ */ jsx(
+            Button,
+            {
+              disabled: selectedCount === 0,
+              size: "small",
+              variant: "url",
+              onClick: () => {
+                handleMoveAllPending(
+                  type,
+                  notificationList.filter((item) => item.selected)
+                );
+              },
+              children: "Move to pending"
+            }
+          )
+        ] }),
+        handleNotificationDeleteAll && /* @__PURE__ */ jsxs(Fragment, { children: [
+          /* @__PURE__ */ jsx("span", { className: "impact-notification-separator" }),
+          /* @__PURE__ */ jsx(
+            Button,
+            {
+              disabled: selectedCount === 0,
+              icon: /* @__PURE__ */ jsx(default_1, {}),
+              size: "medium",
+              variant: "text",
+              onClick: () => {
+                handleNotificationDeleteAll(
+                  type,
+                  notificationList.filter((item) => item.selected)
+                );
+              }
+            }
+          )
+        ] })
+      ] })
+    ] }),
+    showNotificationListLoader ? /* @__PURE__ */ jsx("div", { className: "impact-notification-list-loader-container", children: /* @__PURE__ */ jsx(Loader, { showSkeleton: true, size: "large" }) }) : /* @__PURE__ */ jsx(
+      "div",
+      {
+        className: "impact-notification-list-items-container",
+        style: {
+          height: expand ? "calc(100% - 230px)" : "calc(100% - 280px)"
+        },
+        onScroll: handleNotificationScroll,
+        children: visibleItems.map((list, index) => /* @__PURE__ */ jsx(
+          NotificationListItem,
+          {
+            displayFormat,
+            isDeleteAlwaysVisible,
+            isHoverOnCard,
+            list,
+            notificationPanels,
+            setNotificationPanels,
+            type
+          },
+          list.id ?? index
+        ))
+      }
+    )
+  ] });
+}
+export {
+  NotificationList,
+  getPanelNotificationList
+};

package/dist/components/Notification/NotificationBody/NotificationList/NotificationListItem.d.ts

@@ -0,0 +1,14 @@
+import { NotificationListItemData, NotificationPanelItem } from '../../Notification.types';
+
+interface NotificationListItemProps {
+    list: NotificationListItemData;
+    type: string;
+    notificationPanels: NotificationPanelItem[];
+    setNotificationPanels?: (panels: NotificationPanelItem[]) => void;
+    displayFormat: string;
+    isHoverOnCard?: boolean;
+    isDeleteAlwaysVisible?: boolean;
+}
+export declare function NotificationListItem({ list, type, notificationPanels, setNotificationPanels, displayFormat, isHoverOnCard, isDeleteAlwaysVisible, }: NotificationListItemProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=NotificationListItem.d.ts.map

package/dist/components/Notification/NotificationBody/NotificationList/NotificationListItem.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"NotificationListItem.d.ts","sourceRoot":"","sources":["../../../../../src/components/Notification/NotificationBody/NotificationList/NotificationListItem.tsx"],"names":[],"mappings":"AAUA,OAAO,KAAK,EACV,wBAAwB,EAExB,qBAAqB,EACtB,MAAM,0BAA0B,CAAC;AAMlC,UAAU,yBAAyB;IACjC,IAAI,EAAE,wBAAwB,CAAC;IAC/B,IAAI,EAAE,MAAM,CAAC;IACb,kBAAkB,EAAE,qBAAqB,EAAE,CAAC;IAC5C,qBAAqB,CAAC,EAAE,CAAC,MAAM,EAAE,qBAAqB,EAAE,KAAK,IAAI,CAAC;IAClE,aAAa,EAAE,MAAM,CAAC;IACtB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,qBAAqB,CAAC,EAAE,OAAO,CAAC;CACjC;AA6CD,wBAAgB,oBAAoB,CAAC,EACnC,IAAI,EACJ,IAAI,EACJ,kBAAkB,EAClB,qBAAqB,EACrB,aAAa,EACb,aAAqB,EACrB,qBAA6B,GAC9B,EAAE,yBAAyB,2CAsQ3B"}