npm - impact-ui - Versions diffs - 4.0.16 → 4.0.17-alpha.2 - Mend

impact-ui 4.0.16 → 4.0.17-alpha.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (1038) hide show

package/dist/components/Notification/index.d.ts CHANGED Viewed

@@ -3,7 +3,7 @@ import { NotificationProps } from './Notification.types';
 export type { NotificationProps, DrawerAnchor } from './Notification.types';
 export { NotificationHeader } from './NotificationHeader';
 export { NotificationFooter } from './NotificationFooter';
-export declare function Notification({ title, anchor, isOpen, setIsOpen, className, handleClose, secondaryButtonLabel, onSecondaryButtonClick, primaryButtonLabel, onPrimaryButtonClick, onSettingButtonClick, handleSelectAll, handleMarkReadAll, handleMoveAllPending, handleNotificationDeleteAll, badgesList, notificationTabs, notificationPanels, setNotificationPanels, handleTabChange, moveToPendingDropdownOptions, activeNotiTab, activeBadge, showBadgeLoader, showNotificationListLoader, displayFormat, onNotificationScrollToBottom, scrollThreshold, isWithSearch, onSearchChange, isHoverOnCard, isChipsExpandable, isDeleteAlwaysVisible, isEmptyState, emptyStateTitle, emptyStateDescription, customNotificationJsx, NotificationBodyComponent, }: NotificationProps): import("react/jsx-runtime").JSX.Element;
+export declare function Notification({ title, anchor, isOpen, setIsOpen, className, handleClose, secondaryButtonLabel, onSecondaryButtonClick, primaryButtonLabel, onPrimaryButtonClick, onSettingButtonClick, handleSelectAll, handleMarkReadAll, handleMoveAllPending, handleNotificationDeleteAll, badgesList, notificationTabs, notificationPanels, setNotificationPanels, handleTabChange, moveToPendingDropdownOptions, activeNotiTab, activeBadge, showBadgeLoader, showNotificationListLoader, displayFormat, onNotificationScrollToBottom, scrollThreshold, isWithSearch, onSearchChange, isHoverOnCard, isChipsExpandable, isDeleteAlwaysVisible, isEmptyState, emptyStateTitle, emptyStateDescription, customNotificationJsx, NotificationBodyComponent, }: NotificationProps): import("react").JSX.Element;
 export declare namespace Notification {
     var displayName: string;
 }

package/dist/components/Notification/index.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Notification/index.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,iBAAiB,EAAgB,MAAM,sBAAsB,CAAC;AAC5E,OAAO,4BAA4B,CAAC;AAEpC,YAAY,EAAE,iBAAiB,EAAE,YAAY,EAAE,MAAM,sBAAsB,CAAC;AAC5E,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AAC1D,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AAE1D,wBAAgB,YAAY,CAAC,EAC3B,KAAK,EACL,MAAgB,EAChB,MAAM,EACN,SAAS,EACT,SAAS,EACT,WAAW,EACX,oBAAoB,EACpB,sBAAsB,EACtB,kBAAkB,EAClB,oBAAoB,EACpB,oBAAoB,EACpB,eAAe,EACf,iBAAiB,EACjB,oBAAoB,EACpB,2BAA2B,EAC3B,UAAU,EACV,gBAAgB,EAChB,kBAAkB,EAClB,qBAAqB,EACrB,eAA0B,EAC1B,4BAA4B,EAC5B,aAAa,EACb,WAAW,EACX,eAAe,EACf,0BAA0B,EAC1B,aAAmB,EACnB,4BAA4B,EAC5B,eAAe,EACf,YAAmB,EACnB,cAAc,EACd,aAAqB,EACrB,iBAAyB,EACzB,qBAA6B,EAC7B,YAAY,EACZ,eAAe,EACf,qBAAqB,EACrB,qBAAqB,EACrB,yBAAyB,GAC1B,EAAE,iBAAiB~~,2CA8EnB~~;yBArHe,YAAY"}
1	+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Notification/index.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,iBAAiB,EAAgB,MAAM,sBAAsB,CAAC;AAC5E,OAAO,4BAA4B,CAAC;AAEpC,YAAY,EAAE,iBAAiB,EAAE,YAAY,EAAE,MAAM,sBAAsB,CAAC;AAC5E,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AAC1D,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AAE1D,wBAAgB,YAAY,CAAC,EAC3B,KAAK,EACL,MAAgB,EAChB,MAAM,EACN,SAAS,EACT,SAAS,EACT,WAAW,EACX,oBAAoB,EACpB,sBAAsB,EACtB,kBAAkB,EAClB,oBAAoB,EACpB,oBAAoB,EACpB,eAAe,EACf,iBAAiB,EACjB,oBAAoB,EACpB,2BAA2B,EAC3B,UAAU,EACV,gBAAgB,EAChB,kBAAkB,EAClB,qBAAqB,EACrB,eAA0B,EAC1B,4BAA4B,EAC5B,aAAa,EACb,WAAW,EACX,eAAe,EACf,0BAA0B,EAC1B,aAAmB,EACnB,4BAA4B,EAC5B,eAAe,EACf,YAAmB,EACnB,cAAc,EACd,aAAqB,EACrB,iBAAyB,EACzB,qBAA6B,EAC7B,YAAY,EACZ,eAAe,EACf,qBAAqB,EACrB,qBAAqB,EACrB,yBAAyB,GAC1B,EAAE,iBAAiB,+BA8EnB;yBArHe,YAAY"}

package/dist/components/Notification/index.js CHANGED Viewed

@@ -1,4 +1,4 @@
-!function(){"use strict";try{if("undefined"!=typeof document){var i=document.createElement("style");i.appendChild(document.createTextNode("@keyframes impact-notification-sync-spin{0%{transform:rotate(0)}to{transform:rotate(1turn)}}.impact-notification-sync-icon--rotating{animation:impact-notification-sync-spin 1s linear infinite}.impact-notification-separator{background-color:#d9dde7;display:inline-block;height:16px;width:1.5px}.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.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.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.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 10px}.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 6px 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;box-sizing:border-box;display:flex;justify-content:space-between;min-height:55px;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 .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:hover .impact-notification-list-item-header-right{transition:width .4s ease-in-out;width:24%!important}.impact-notification-list-container .impact-notification-list-items-container .impact-notification-list-item:hover .impact-notification-list-item-header-left--btns-3{max-width:76%!important}.impact-notification-list-container .impact-notification-list-items-container .impact-notification-list-item:hover .impact-notification-list-item-header-left--btns-2{max-width:84%!important}.impact-notification-list-container .impact-notification-list-items-container .impact-notification-list-item:hover .impact-notification-list-item-header-left--btns-1{max-width:92%!important}.impact-notification-list-container .impact-notification-list-items-container .impact-notification-list-item:hover .impact-notification-list-item-header-left--btns-0{max-width:100%!important}.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 .status-success{background-color:#ebf7f1;border:1px solid #108431}.impact-notification-list-container .impact-notification-list-items-container .impact-notification-list-item .status-success .impact-notification-list-item-icon-line{background-color:#108431}.impact-notification-list-container .impact-notification-list-items-container .impact-notification-list-item .status-fail{background-color:#fceeee;border:1px solid #ec4c5c}.impact-notification-list-container .impact-notification-list-items-container .impact-notification-list-item .status-fail .impact-notification-list-item-icon-line{background-color:#ec4c5c}.impact-notification-list-container .impact-notification-list-items-container .impact-notification-list-item .status-pending{background-color:#fcf8ea;border:1px solid #ffe174}.impact-notification-list-container .impact-notification-list-items-container .impact-notification-list-item .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;min-width:0;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 .impact-notification-list-item-header-left{flex:1;max-width:100%;transition:max-width .3s ease-out}.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:12px;justify-content:flex-start}.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-item-title-icons,.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-title-icons{align-items:center;display:flex;gap:12px}.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-item-title-icons .title-icon-btn,.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-title-icons .title-icon-btn{align-items:center;cursor:pointer;display:flex}.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-item-title-icons .title-icon-btn .impact-notification-title-icon,.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-item-title-icons .title-icon-btn img,.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-title-icons .title-icon-btn .impact-notification-title-icon,.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-title-icons .title-icon-btn img{height:16px;width:16px}.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-item-title-icons .title-icon-btn:hover .impact-notification-title-icon path,.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-title-icons .title-icon-btn:hover .impact-notification-title-icon path{fill:#4259ee}.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{justify-content:flex-end}.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;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.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;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;max-width:100%;min-width:0;overflow-wrap:anywhere;word-break:break-word}.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)}}();
+!function(){"use strict";try{if("undefined"!=typeof document){var i=document.createElement("style");i.appendChild(document.createTextNode("@keyframes impact-notification-sync-spin{0%{transform:rotate(0)}to{transform:rotate(1turn)}}.impact-notification-sync-icon--rotating{animation:impact-notification-sync-spin 1s linear infinite}.impact-notification-separator{background-color:#d9dde7;display:inline-block;height:16px;width:1.5px}.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.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.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.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 10px}.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 6px 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;box-sizing:border-box;display:flex;justify-content:space-between;min-height:55px;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 .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:hover .impact-notification-list-item-header-right{transition:width .4s ease-in-out;width:24%!important}.impact-notification-list-container .impact-notification-list-items-container .impact-notification-list-item:hover .impact-notification-list-item-header-left--btns-3{max-width:76%!important}.impact-notification-list-container .impact-notification-list-items-container .impact-notification-list-item:hover .impact-notification-list-item-header-left--btns-2{max-width:84%!important}.impact-notification-list-container .impact-notification-list-items-container .impact-notification-list-item:hover .impact-notification-list-item-header-left--btns-1{max-width:92%!important}.impact-notification-list-container .impact-notification-list-items-container .impact-notification-list-item:hover .impact-notification-list-item-header-left--btns-0{max-width:100%!important}.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 .status-success{background-color:#ebf7f1;border:1px solid #108431}.impact-notification-list-container .impact-notification-list-items-container .impact-notification-list-item .status-success .impact-notification-list-item-icon-line{background-color:#108431}.impact-notification-list-container .impact-notification-list-items-container .impact-notification-list-item .status-fail{background-color:#fceeee;border:1px solid #ec4c5c}.impact-notification-list-container .impact-notification-list-items-container .impact-notification-list-item .status-fail .impact-notification-list-item-icon-line{background-color:#ec4c5c}.impact-notification-list-container .impact-notification-list-items-container .impact-notification-list-item .status-pending{background-color:#fcf8ea;border:1px solid #ffe174}.impact-notification-list-container .impact-notification-list-items-container .impact-notification-list-item .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;min-width:0;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 :is(.impact-notification-list-item-header:focus,.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 .impact-notification-list-item-header-left{flex:1;max-width:100%;transition:max-width .3s ease-out}.impact-notification-list-container .impact-notification-list-items-container .impact-notification-list-item .impact-notification-list-item-container .impact-notification-list-item-header :is(.impact-notification-list-item-header-left,.impact-notification-list-item-header-right){align-items:center;display:flex;flex-direction:row;gap:12px;justify-content:flex-start}.impact-notification-list-container .impact-notification-list-items-container .impact-notification-list-item .impact-notification-list-item-container .impact-notification-list-item-header :is(.impact-notification-list-item-header-left,.impact-notification-list-item-header-right) .impact-notification-list-item-title-icons{align-items:center;display:flex;gap:12px}.impact-notification-list-container .impact-notification-list-items-container .impact-notification-list-item .impact-notification-list-item-container .impact-notification-list-item-header :is(.impact-notification-list-item-header-left,.impact-notification-list-item-header-right) .impact-notification-list-item-title-icons .title-icon-btn{align-items:center;cursor:pointer;display:flex}.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-item-title-icons .title-icon-btn .impact-notification-title-icon,.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-item-title-icons .title-icon-btn img,.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-title-icons .title-icon-btn .impact-notification-title-icon,.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-title-icons .title-icon-btn img{height:16px;width:16px}.impact-notification-list-container .impact-notification-list-items-container .impact-notification-list-item .impact-notification-list-item-container .impact-notification-list-item-header :is(.impact-notification-list-item-header-left,.impact-notification-list-item-header-right) .impact-notification-list-item-title-icons .title-icon-btn:hover .impact-notification-title-icon path{fill:#4259ee}.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{justify-content:flex-end}.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;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.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;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;max-width:100%;min-width:0;overflow-wrap:anywhere;word-break:break-word}.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 :is(.impact-notification-list-item-header:focus,.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 { jsx, jsxs } from "react/jsx-runtime";
 import { useState, useCallback, Suspense } from "react";
 import { NotificationBody } from "./NotificationBody/index.js";

package/dist/components/OnboardingTour/index.d.ts ADDED Viewed

@@ -0,0 +1,61 @@
+import { ReactNode, RefObject } from 'react';
+import { ProductTourStep } from './productTourList';
+import { TooltipCardSlide, TooltipCardArrowPosition } from './tooltipCard';
+export type { TooltipCardSlide, TooltipCardArrowPosition } from './tooltipCard';
+export type { ProductTourStep, ProductTourListProps } from './productTourList';
+export interface OnboardingTourTooltipProps {
+    slides: TooltipCardSlide[];
+    arrowPosition?: TooltipCardArrowPosition;
+    closeLabel?: string;
+    showClose?: boolean;
+    skipLabel?: string;
+    showSkip?: boolean;
+    nextLabel?: string;
+    showNext?: boolean;
+    onClose: () => void;
+    onSkip: () => void;
+    onNext: () => void;
+    anchorRef?: RefObject<HTMLElement>;
+}
+export interface OnboardingTourProductTourProps {
+    steps: ProductTourStep[];
+    title?: string;
+    minimizedLabel?: string;
+    dismissLabel?: string;
+    remainingCount?: number;
+    onDismiss: () => void;
+    onExpand?: () => void;
+    onMinimize?: () => void;
+}
+export interface OnboardingTourProps {
+    badgeLabel?: string;
+    carouselClassName?: string;
+    carouselDurations?: number[];
+    carouselOnActiveIndexChange?: (index: number) => void;
+    carouselScreens?: ReactNode[];
+    description?: string;
+    images?: string | string[];
+    isSmallScreen?: boolean;
+    onClose: () => void;
+    playEntrance?: boolean;
+    primaryAction?: {
+        label: string;
+        onClick: () => void;
+        variant?: 'primary' | 'secondary' | 'tertiary' | 'text' | 'url';
+    };
+    secondaryAction?: {
+        label: string;
+        onClick: () => void;
+        variant?: 'primary' | 'secondary' | 'tertiary' | 'text' | 'url';
+    };
+    title?: string;
+    /** Tooltip data + required actions. When provided, Try now advances to the tooltip stage. */
+    tooltip?: OnboardingTourTooltipProps;
+    /** Product tour data + required actions. When provided, Skip on tooltip advances to the product tour stage. */
+    productTour?: OnboardingTourProductTourProps;
+    /** Ref attached to the DOM element the tooltip card should anchor to. */
+    anchorRef?: RefObject<HTMLElement>;
+}
+export declare const OnboardingTour: ({ badgeLabel, carouselDurations, carouselOnActiveIndexChange, carouselScreens, carouselClassName, images, description, isSmallScreen, onClose, playEntrance, primaryAction, secondaryAction, title, tooltip, productTour, anchorRef, }: OnboardingTourProps) => import("react").JSX.Element | null;
+//# sourceMappingURL=index.d.ts.map

package/dist/components/OnboardingTour/index.d.ts.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/OnboardingTour/index.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAiB,SAAS,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAOjE,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AACzD,OAAO,KAAK,EAAE,gBAAgB,EAAE,wBAAwB,EAAE,MAAM,eAAe,CAAC;AAChF,OAAO,8BAA8B,CAAC;AAGtC,YAAY,EAAE,gBAAgB,EAAE,wBAAwB,EAAE,MAAM,eAAe,CAAC;AAChF,YAAY,EAAE,eAAe,EAAE,oBAAoB,EAAE,MAAM,mBAAmB,CAAC;AAI/E,MAAM,WAAW,0BAA0B;IACzC,MAAM,EAAE,gBAAgB,EAAE,CAAC;IAC3B,aAAa,CAAC,EAAE,wBAAwB,CAAC;IACzC,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,MAAM,EAAE,MAAM,IAAI,CAAC;IACnB,MAAM,EAAE,MAAM,IAAI,CAAC;IACnB,SAAS,CAAC,EAAE,SAAS,CAAC,WAAW,CAAC,CAAC;CACpC;AAED,MAAM,WAAW,8BAA8B;IAC7C,KAAK,EAAE,eAAe,EAAE,CAAC;IACzB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,SAAS,EAAE,MAAM,IAAI,CAAC;IACtB,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,UAAU,CAAC,EAAE,MAAM,IAAI,CAAC;CACzB;AAED,MAAM,WAAW,mBAAmB;IAClC,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,iBAAiB,CAAC,EAAE,MAAM,EAAE,CAAC;IAC7B,2BAA2B,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACtD,eAAe,CAAC,EAAE,SAAS,EAAE,CAAC;IAC9B,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,EAAE,CAAC;IAC3B,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,aAAa,CAAC,EAAE;QACd,KAAK,EAAE,MAAM,CAAC;QACd,OAAO,EAAE,MAAM,IAAI,CAAC;QACpB,OAAO,CAAC,EAAE,SAAS,GAAG,WAAW,GAAG,UAAU,GAAG,MAAM,GAAG,KAAK,CAAC;KACjE,CAAC;IACF,eAAe,CAAC,EAAE;QAChB,KAAK,EAAE,MAAM,CAAC;QACd,OAAO,EAAE,MAAM,IAAI,CAAC;QACpB,OAAO,CAAC,EAAE,SAAS,GAAG,WAAW,GAAG,UAAU,GAAG,MAAM,GAAG,KAAK,CAAC;KACjE,CAAC;IACF,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,6FAA6F;IAC7F,OAAO,CAAC,EAAE,0BAA0B,CAAC;IACrC,+GAA+G;IAC/G,WAAW,CAAC,EAAE,8BAA8B,CAAC;IAC7C,yEAAyE;IACzE,SAAS,CAAC,EAAE,SAAS,CAAC,WAAW,CAAC,CAAC;CACpC;AAED,eAAO,MAAM,cAAc,GAAI,wOAiB5B,mBAAmB,uCA2OrB,CAAC"}

package/dist/components/OnboardingTour/index.js ADDED Viewed

@@ -0,0 +1,232 @@
+!function(){"use strict";try{if("undefined"!=typeof document){var o=document.createElement("style");o.appendChild(document.createTextNode('@import"https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900";@keyframes ia-shimmer-horizontal{0%{background-position:100% 0}to{background-position:0 0}}@keyframes ia-shimmer-vertical{0%{background-position:0 100%}to{background-position:0 0}}@property --ia-shimmer-angle{syntax:"<angle>";inherits:false;initial-value:0deg}@keyframes ia-shimmer-circular{0%{--ia-shimmer-angle:0deg}to{--ia-shimmer-angle:360deg}}.ia-shimmer{animation:ia-shimmer-horizontal 1.6s ease-in-out infinite;animation-direction:normal;background-color:#e8edf5;background-image:linear-gradient(90deg,#e8edf5,#eceef4 22%,#e8edf5 48%,#d5dbe8 62%,#e8edf5);background-repeat:no-repeat;background-size:300% 100%}@media (prefers-reduced-motion:reduce){.ia-shimmer{animation:none;background-image:linear-gradient(90deg,#e8edf5,#eceef4 40%,#d5dbe8);background-size:100% 100%}}.ia-shimmer--ltr{animation:ia-shimmer-horizontal 1.6s ease-in-out infinite;animation-direction:normal;background-color:#e8edf5;background-image:linear-gradient(90deg,#e8edf5,#eceef4 22%,#e8edf5 48%,#d5dbe8 62%,#e8edf5);background-repeat:no-repeat;background-size:300% 100%}@media (prefers-reduced-motion:reduce){.ia-shimmer--ltr{animation:none;background-image:linear-gradient(90deg,#e8edf5,#eceef4 40%,#d5dbe8);background-size:100% 100%}}.ia-shimmer--rtl{animation:ia-shimmer-horizontal 1.6s ease-in-out infinite;animation-direction:reverse;background-color:#e8edf5;background-image:linear-gradient(270deg,#e8edf5,#eceef4 22%,#e8edf5 48%,#d5dbe8 62%,#e8edf5);background-repeat:no-repeat;background-size:300% 100%}@media (prefers-reduced-motion:reduce){.ia-shimmer--rtl{animation:none;background-image:linear-gradient(270deg,#e8edf5,#eceef4 40%,#d5dbe8);background-size:100% 100%}}.ia-shimmer--btt{animation:ia-shimmer-vertical 1.6s ease-in-out infinite;animation-direction:reverse;background-color:#e8edf5;background-image:linear-gradient(0deg,#e8edf5,#eceef4 22%,#e8edf5 48%,#d5dbe8 62%,#e8edf5);background-repeat:no-repeat;background-size:100% 300%}@media (prefers-reduced-motion:reduce){.ia-shimmer--btt{animation:none;background-image:linear-gradient(0deg,#e8edf5,#eceef4 40%,#d5dbe8);background-size:100% 100%}}.ia-shimmer--ttb{animation:ia-shimmer-vertical 1.6s ease-in-out infinite;animation-direction:normal;background-color:#e8edf5;background-image:linear-gradient(0deg,#e8edf5,#eceef4 22%,#e8edf5 48%,#d5dbe8 62%,#e8edf5);background-repeat:no-repeat;background-size:100% 300%}@media (prefers-reduced-motion:reduce){.ia-shimmer--ttb{animation:none;background-image:linear-gradient(0deg,#e8edf5,#eceef4 40%,#d5dbe8);background-size:100% 100%}}.ia-shimmer--circular{background-color:#e8edf5;background-repeat:no-repeat;--ia-shimmer-angle:0deg;animation:ia-shimmer-circular 1.6s linear infinite;background-image:conic-gradient(from var(--ia-shimmer-angle),#eceef4 0deg,#e8edf5 80deg,#d5dbe8 160deg,#e8edf5 260deg,#eceef4 1turn);background-size:100% 100%}@media (prefers-reduced-motion:reduce){.ia-shimmer--circular{animation:none;background-image:conic-gradient(from 0deg,#eceef4,#e8edf5,#d5dbe8,#e8edf5 1turn)}}@keyframes onboarding-tour-section-enter{0%{opacity:0;transform:translateY(20px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}.onboarding-tour-overlay{background-color:#0d152ccc;bottom:0;left:0;position:fixed;right:0;top:0;z-index:9999;-webkit-tap-highlight-color:transparent;opacity:1;pointer-events:auto;transition:opacity .5s ease-in-out}.onboarding-tour-overlay.overlay--hidden{opacity:0;pointer-events:none}.onboarding-tour-close-button{align-items:center;background-color:#fff;border-radius:50%;box-shadow:0 0 4px #0000001f;cursor:pointer;display:flex;justify-content:center;padding:6px;position:absolute;right:12px;top:12px}.onboarding-tour-close-button:focus-visible{box-shadow:0 0 4px #0000001f,0 0 0 var(--ia-focus-ring-offset,2px) var(--ia-focus-bg,#fff),0 0 0 calc(var(--ia-focus-ring-offset, 2px) + var(--ia-focus-ring-width, 2px)) var(--ia-focus-color,#4259ee);outline:none;transition:box-shadow .15s ease-in-out}.onboarding-tour-close-button:focus:not(:focus-visible){box-shadow:0 0 4px #0000001f;outline:none}.onboarding-tour-close-button svg{height:18px;width:18px}.onboarding-tour-wrapper{background-color:#fff;background-image:radial-gradient(circle,#f7f7f799 2px,#0000 0),radial-gradient(circle,#f7f7f799 2px,#0000 0);background-size:18px 18px;border-radius:12px;box-shadow:0 0 30px 6px #0000001a;left:50%;padding:40px;position:fixed;top:50%;transform:translate(-50%,-50%);z-index:999999}.onboarding-tour-wrapper .onboarding-tour-container{align-items:center;display:flex;flex-direction:column;gap:32px;height:100%;justify-content:space-between}.onboarding-tour-wrapper .onboarding-tour-container .onboarding-tour-header{align-items:center;display:flex;flex-direction:column;gap:8px}.onboarding-tour-wrapper .onboarding-tour-container .onboarding-tour-header .onboarding-tour-header-content{align-items:center;display:flex;flex-direction:column;gap:4px}.onboarding-tour-wrapper .onboarding-tour-container .onboarding-tour-header .onboarding-tour-header-content .onboarding-tour-title{color:#0d152c;font-size:32px;font-weight:800;line-height:48px;text-transform:capitalize;white-space:nowrap}.onboarding-tour-wrapper .onboarding-tour-container .onboarding-tour-header .onboarding-tour-header-content .onboarding-tour-description{color:#7a8294;font-size:16px;font-weight:600;line-height:24px;text-align:center;width:302px}.onboarding-tour-wrapper .onboarding-tour-container .onboarding-tour-footer .onboarding-tour-actions{align-items:center;display:flex;gap:12px}.onboarding-tour-wrapper .onboarding-tour-close-button{right:12px;top:12px}.onboarding-tour-wrapper .onboarding-tour-container .onboarding-tour-header.onboarding-tour-header--entrance{animation:onboarding-tour-section-enter .4s cubic-bezier(.22,1,.36,1) 0s both;will-change:opacity,transform}.onboarding-tour-wrapper .onboarding-tour-container .onboarding-tour-footer.onboarding-tour-footer--entrance{animation:onboarding-tour-section-enter .4s cubic-bezier(.22,1,.36,1) .6s both;will-change:opacity,transform}@media (prefers-reduced-motion:reduce){.onboarding-tour-wrapper .onboarding-tour-container :is(.onboarding-tour-footer.onboarding-tour-footer--entrance,.onboarding-tour-header.onboarding-tour-header--entrance){animation:none!important;opacity:1;transform:none}}@media screen and (max-width:1512px){.onboarding-tour-wrapper{padding:30px}.onboarding-tour-wrapper .onboarding-tour-close-button svg{height:14px;width:14px}.onboarding-tour-wrapper .onboarding-tour-container{gap:24px}.onboarding-tour-wrapper .onboarding-tour-container .onboarding-tour-header{gap:4px}.onboarding-tour-wrapper .onboarding-tour-container .onboarding-tour-header .onboarding-tour-header-content{gap:2px}.onboarding-tour-wrapper .onboarding-tour-container .onboarding-tour-header .onboarding-tour-header-content .onboarding-tour-title{font-size:24px;line-height:36px}.onboarding-tour-wrapper .onboarding-tour-container .onboarding-tour-header .onboarding-tour-header-content .onboarding-tour-description{font-size:12px;line-height:18px}}@keyframes slide-in-from-right{0%{opacity:0;transform:translate(48px)}to{opacity:1;transform:translate(0)}}@keyframes slide-in-from-left{0%{opacity:0;transform:translate(-48px)}to{opacity:1;transform:translate(0)}}@keyframes dot-fill{0%{width:0}to{width:100%}}.onboarding-tour-middle-section{align-items:center;display:flex;flex-direction:column;gap:8px;overflow:hidden;width:100%}.onboarding-tour-middle-section .screen-slide{display:flex;justify-content:center;width:100%}.onboarding-tour-middle-section .screen-slide--forward{animation:slide-in-from-right .38s cubic-bezier(.22,1,.36,1) both}.onboarding-tour-middle-section .screen-slide--backward{animation:slide-in-from-left .38s cubic-bezier(.22,1,.36,1) both}.onboarding-tour-middle-section .screen-slide img{max-height:100%;max-width:100%;object-fit:contain}.onboarding-tour-image{height:295px;object-fit:contain;width:520px}.button-carousel-wrapper{align-items:center;display:flex;gap:10px;justify-content:center}.button-carousel-wrapper .button{background-color:#d9dde7;border-radius:5px;cursor:pointer;flex-shrink:0;height:10px;overflow:hidden;position:relative;transition:width .3s cubic-bezier(.22,1,.36,1),background-color .2s;width:10px}.button-carousel-wrapper .button.active{background-color:#d9dde7;width:32px}.button-carousel-wrapper .button.active:after{animation:dot-fill var(--dot-duration,2s) linear forwards;background-color:#4259ee;border-radius:5px;content:"";height:100%;inset-block:0;left:0;position:absolute}@media (prefers-reduced-motion:reduce){.onboarding-tour-middle-section .screen-slide{animation:none!important;opacity:1;transform:none}.onboarding-tour-middle-section .button.active:after{animation:none!important;width:100%}}@media screen and (max-width:1512px){.onboarding-tour-middle-section{gap:6px}.onboarding-tour-image{height:222px;width:390px}}@keyframes tooltip-slide-in-right{0%{opacity:0;transform:translate(32px)}to{opacity:1;transform:translate(0)}}@keyframes tooltip-slide-in-left{0%{opacity:0;transform:translate(-32px)}to{opacity:1;transform:translate(0)}}.tooltip-card-wrapper{background-color:#fff;border-radius:12px;box-shadow:0 0 30px 6px #0000001a;box-sizing:border-box;display:flex;flex-direction:column;gap:32px;padding:40px;position:relative;width:428px}.tooltip-card-wrapper--anchored{position:absolute;z-index:999999}.tooltip-card-arrow{background-color:#b3bdf8;position:absolute}.tooltip-card-arrow--bottom-left,.tooltip-card-arrow--bottom-right,.tooltip-card-arrow--top-left,.tooltip-card-arrow--top-right{height:12px;width:18px}.tooltip-card-arrow--left-bottom,.tooltip-card-arrow--left-top,.tooltip-card-arrow--right-bottom,.tooltip-card-arrow--right-top{height:18px;width:12px}.tooltip-card-arrow--top-left,.tooltip-card-arrow--top-right{clip-path:polygon(50% 0,0 100%,100% 100%);top:-12px}.tooltip-card-arrow--bottom-left,.tooltip-card-arrow--bottom-right{bottom:-12px;clip-path:polygon(0 0,100% 0,50% 100%)}.tooltip-card-arrow--left-bottom,.tooltip-card-arrow--left-top{clip-path:polygon(0 50%,100% 0,100% 100%);left:-12px}.tooltip-card-arrow--right-bottom,.tooltip-card-arrow--right-top{clip-path:polygon(100% 50%,0 0,0 100%);right:-12px}.tooltip-card-arrow--bottom-left,.tooltip-card-arrow--top-left{left:32px}.tooltip-card-arrow--bottom-right,.tooltip-card-arrow--top-right{right:32px}.tooltip-card-arrow--left-top,.tooltip-card-arrow--right-top{top:32px}.tooltip-card-arrow--left-bottom,.tooltip-card-arrow--right-bottom{bottom:32px}.tooltip-card-body,.tooltip-card-content{display:flex;flex-direction:column;gap:8px}.tooltip-card-content{will-change:opacity,transform}.tooltip-card-content--forward{animation:tooltip-slide-in-right .32s cubic-bezier(.22,1,.36,1) both}.tooltip-card-content--backward{animation:tooltip-slide-in-left .32s cubic-bezier(.22,1,.36,1) both}.tooltip-card-content .tooltip-card-image{margin-top:24px}.tooltip-card-header{color:#0d152c;font-size:16px;font-weight:800;line-height:24px}.tooltip-card-description{color:#7a8294;font-size:14px;font-weight:500;line-height:21px}.tooltip-card-image{border-radius:12px}.tooltip-card-footer{align-items:center;display:flex;justify-content:space-between}.tooltip-card-footer-right{align-items:center;display:flex;gap:14px}.tooltip-card-skip-btn:hover{text-decoration:none!important}@media (prefers-reduced-motion:reduce){.tooltip-card-content{animation:none!important;opacity:1;transform:none}}.product-tour-list{bottom:24px;position:fixed;right:12px;z-index:999999}.product-tour-list-minimized-chip{align-items:center;background-color:#4259ee;border:none;border-bottom:4px solid #687af1;border-radius:4px;box-shadow:0 10px 15px #00000026;cursor:pointer;display:flex;gap:10px;justify-content:center;padding:16px 32px;position:relative}.product-tour-list-minimized-chip:focus-visible{box-shadow:0 10px 15px #00000026,0 0 0 var(--ia-focus-ring-offset,2px) var(--ia-focus-bg,#fff),0 0 0 calc(var(--ia-focus-ring-offset, 2px) + var(--ia-focus-ring-width, 2px)) var(--ia-focus-color,#4259ee);outline:none;transition:box-shadow .15s ease-in-out}.product-tour-list-minimized-chip:focus:not(:focus-visible){box-shadow:0 10px 15px #00000026;outline:none}.product-tour-list-minimized-chip .product-tour-list-minimized-label{color:#fff;font-family:Manrope,sans-serif;font-size:14px;font-weight:500;line-height:20px;text-transform:capitalize;white-space:nowrap}.product-tour-list-minimized-badge{border-radius:100px;box-shadow:0 0 4px #0000001f;color:#1f2b4d;font-family:Manrope,sans-serif;font-size:16px;font-weight:600;height:30px;justify-content:center;line-height:24px;min-width:30px;padding:6px;position:absolute;right:-11px;text-transform:capitalize;top:-10px}.product-tour-list--expanded,.product-tour-list-minimized-badge{align-items:center;background-color:#fff;box-sizing:border-box;display:flex}.product-tour-list--expanded{border-radius:12px;box-shadow:0 0 15px #0000001a;flex-direction:column;gap:32px;padding:40px;width:435px}.product-tour-list-close{align-items:center;background-color:#fff;border-radius:50%;box-shadow:0 0 4px #0000001f;cursor:pointer;display:flex;justify-content:center;padding:6px;position:absolute;right:12px;top:12px}.product-tour-list-close:focus-visible{box-shadow:0 0 4px #0000001f,0 0 0 var(--ia-focus-ring-offset,2px) var(--ia-focus-bg,#fff),0 0 0 calc(var(--ia-focus-ring-offset, 2px) + var(--ia-focus-ring-width, 2px)) var(--ia-focus-color,#4259ee);outline:none;transition:box-shadow .15s ease-in-out}.product-tour-list-close:focus:not(:focus-visible){box-shadow:0 0 4px #0000001f;outline:none}.product-tour-list-close svg{height:18px;width:18px}.product-tour-list-title{color:#0d152c;font-family:Manrope,sans-serif;font-size:24px;font-weight:800;line-height:36px;padding:8px 12px;text-align:center;text-transform:capitalize;width:100%}.product-tour-list-steps{display:flex;flex-direction:column;gap:8px;width:100%}.product-tour-list-step{align-items:center;background-color:#f5f6fa;border-radius:12px;box-sizing:border-box;display:flex;gap:6px;min-width:130px;padding:12px 16px;width:100%}.product-tour-list-step .product-tour-list-step-index{color:#31416e;flex-shrink:0;font-family:Manrope,sans-serif;font-size:16px;font-weight:500;line-height:1.25;text-transform:capitalize}.product-tour-list-step .product-tour-list-step-label{color:#1f2b4d;flex:1;font-family:Manrope,sans-serif;font-size:16px;font-weight:500;line-height:1.25;min-width:0;text-transform:capitalize}.product-tour-list-step--completed .product-tour-list-step-index{color:#7a8294}.product-tour-list-step--completed .product-tour-list-step-label{color:#b4bac7}.product-tour-list-step-btn{flex-shrink:0;height:32px!important;max-height:32px;min-width:56px!important}.product-tour-list-step-btn.product-tour-list-step-btn--completed{background-color:#c3c8d4!important;border-color:#c3c8d4!important;color:#fff!important}.product-tour-list-step-btn.product-tour-list-step-btn--completed:hover{background-color:#c3c8d4!important;border-color:#c3c8d4!important}.product-tour-list-dismiss{height:32px!important;justify-content:center;width:100%}.product-tour-list-dismiss:hover{text-decoration:none!important}@media screen and (max-width:1512px){.product-tour-list--expanded{gap:24px;padding:30px;width:380px}.product-tour-list-close svg{height:14px;width:14px}.product-tour-list-title{font-size:20px;line-height:30px;padding:4px 8px}.product-tour-list-step{padding:10px 12px}.product-tour-list-step :is(.product-tour-list-step-index,.product-tour-list-step-label){font-size:14px}.product-tour-list-step-btn{height:28px!important;max-height:28px}.product-tour-list-minimized-chip{padding:12px 24px}.product-tour-list-minimized-chip .product-tour-list-minimized-label{font-size:13px;line-height:18px}.product-tour-list-minimized-badge{font-size:14px;height:26px;line-height:20px;min-width:26px}}@media screen and (max-width:1280px){.product-tour-list--expanded{gap:20px;padding:24px;width:360px}.product-tour-list-title{font-size:18px;line-height:28px}.product-tour-list-steps{gap:6px}.product-tour-list-step{padding:8px 12px}.product-tour-list-step :is(.product-tour-list-step-index,.product-tour-list-step-label){font-size:13px}.product-tour-list-dismiss{font-size:13px!important;height:auto!important;line-height:18px!important;min-height:28px;text-align:center;white-space:normal}}')),document.head.appendChild(o)}}catch(t){console.error("vite-plugin-css-injected-by-js",t)}}();
+import { jsx, jsxs, Fragment } from "react/jsx-runtime";
+import { useState, useRef, useCallback, useEffect } from "react";
+import default_1 from "../../node_modules/@mui/icons-material/CloseRounded.js";
+import { Badge } from "../Badge/index.js";
+import { Button } from "../Button/index.js";
+import { ProductTourList } from "./productTourList.js";
+import { TooltipCard } from "./tooltipCard.js";
+const OnboardingTour = ({
+  badgeLabel = "New feature",
+  carouselDurations,
+  carouselOnActiveIndexChange,
+  carouselScreens,
+  carouselClassName,
+  images,
+  description = "Explore the latest updates and improve your workflow.",
+  isSmallScreen,
+  onClose,
+  playEntrance = false,
+  primaryAction,
+  secondaryAction,
+  title = "Welcome to the new feature",
+  tooltip,
+  productTour,
+  anchorRef
+}) => {
+  const [stage, setStage] = useState("modal");
+  const [productTourExpanded, setProductTourExpanded] = useState(false);
+  const [dismissed, setDismissed] = useState(false);
+  const [activeIndex, setActiveIndex] = useState(0);
+  const [direction, setDirection] = useState("forward");
+  const [animKey, setAnimKey] = useState(0);
+  const timerRef = useRef(null);
+  const imageList = typeof images === "string" ? [images] : images;
+  const screens = carouselScreens ?? (imageList == null ? void 0 : imageList.map((src, i) => /* @__PURE__ */ jsx(
+    "img",
+    {
+      alt: `${title ?? "slide"} ${i + 1}`,
+      className: "onboarding-tour-image",
+      src
+    },
+    `onboarding-image-${i}`
+  )));
+  const totalSlides = (screens == null ? void 0 : screens.length) ?? 0;
+  const hasScreens = screens && screens.length > 0;
+  const hasCarousel = screens && screens.length > 1;
+  const goToSlide = useCallback(
+    // eslint-disable-next-line @typescript-eslint/no-inferrable-types
+    (index, dir = "forward") => {
+      setDirection(dir);
+      setActiveIndex(index);
+      setAnimKey((k) => k + 1);
+      carouselOnActiveIndexChange == null ? void 0 : carouselOnActiveIndexChange(index);
+    },
+    [carouselOnActiveIndexChange]
+  );
+  useEffect(() => {
+    if (!hasCarousel || totalSlides === 0) return;
+    if (timerRef.current) {
+      clearTimeout(timerRef.current);
+    }
+    timerRef.current = setTimeout(() => {
+      goToSlide((activeIndex + 1) % totalSlides, "forward");
+    }, (carouselDurations == null ? void 0 : carouselDurations[activeIndex]) ?? 2e3);
+    return () => {
+      if (timerRef.current) {
+        clearTimeout(timerRef.current);
+      }
+    };
+  }, [activeIndex, carouselDurations, goToSlide, hasCarousel, totalSlides]);
+  const handlePrimaryClick = () => {
+    primaryAction == null ? void 0 : primaryAction.onClick();
+    if (tooltip) {
+      setStage("tooltip");
+    }
+  };
+  const handleTooltipSkip = () => {
+    tooltip == null ? void 0 : tooltip.onSkip();
+    if (productTour) {
+      setProductTourExpanded(false);
+      setStage("productTour");
+    }
+  };
+  const handleTooltipNext = () => {
+    tooltip == null ? void 0 : tooltip.onNext();
+  };
+  const handleTooltipClose = () => {
+    tooltip == null ? void 0 : tooltip.onClose();
+  };
+  const handleProductTourDismiss = () => {
+    productTour == null ? void 0 : productTour.onDismiss();
+    setDismissed(true);
+  };
+  const handleProductTourExpand = () => {
+    var _a;
+    (_a = productTour == null ? void 0 : productTour.onExpand) == null ? void 0 : _a.call(productTour);
+    setProductTourExpanded(true);
+  };
+  const handleProductTourMinimize = () => {
+    var _a;
+    (_a = productTour == null ? void 0 : productTour.onMinimize) == null ? void 0 : _a.call(productTour);
+    setProductTourExpanded(false);
+  };
+  if (dismissed) {
+    return null;
+  }
+  if (stage === "productTour" && productTour) {
+    return /* @__PURE__ */ jsx(
+      ProductTourList,
+      {
+        dismissLabel: productTour.dismissLabel,
+        expanded: productTourExpanded,
+        minimizedLabel: productTour.minimizedLabel,
+        remainingCount: productTour.remainingCount,
+        steps: productTour.steps,
+        title: productTour.title,
+        onDismiss: handleProductTourDismiss,
+        onExpandedChange: (next) => {
+          if (next) {
+            handleProductTourExpand();
+          } else {
+            handleProductTourMinimize();
+          }
+        }
+      }
+    );
+  }
+  if (stage === "tooltip" && tooltip) {
+    return /* @__PURE__ */ jsx(
+      TooltipCard,
+      {
+        anchorRef,
+        arrowPosition: tooltip.arrowPosition,
+        footerProps: {
+          showClose: tooltip.showClose ?? true,
+          closeLabel: tooltip.closeLabel ?? "Close",
+          onClose: handleTooltipClose,
+          showSkip: tooltip.showSkip ?? true,
+          skipLabel: tooltip.skipLabel ?? "Skip",
+          onSkip: handleTooltipSkip,
+          showNext: tooltip.showNext ?? true,
+          nextLabel: tooltip.nextLabel ?? "Next",
+          onNext: handleTooltipNext
+        },
+        slides: tooltip.slides
+      }
+    );
+  }
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx("div", { "aria-hidden": "true", className: "onboarding-tour-overlay" }),
+    /* @__PURE__ */ jsxs("div", { className: "onboarding-tour-wrapper", children: [
+      /* @__PURE__ */ jsx("div", { className: "onboarding-tour-close-button", onClick: onClose, children: /* @__PURE__ */ jsx(default_1, { fontSize: "small", sx: { color: "#60697D" } }) }),
+      /* @__PURE__ */ jsxs("div", { className: "onboarding-tour-container", children: [
+        /* @__PURE__ */ jsxs(
+          "div",
+          {
+            className: `onboarding-tour-header${playEntrance ? " onboarding-tour-header--entrance" : ""}`,
+            children: [
+              badgeLabel && /* @__PURE__ */ jsx(
+                Badge,
+                {
+                  color: "info",
+                  label: badgeLabel,
+                  size: isSmallScreen ? "small" : "medium",
+                  variant: "subtle"
+                }
+              ),
+              /* @__PURE__ */ jsxs("div", { className: "onboarding-tour-header-content", children: [
+                /* @__PURE__ */ jsx("span", { className: "onboarding-tour-title", children: title }),
+                description && /* @__PURE__ */ jsx("span", { className: "onboarding-tour-description", children: description })
+              ] })
+            ]
+          }
+        ),
+        hasScreens && /* @__PURE__ */ jsxs(
+          "div",
+          {
+            className: `onboarding-tour-middle-section${carouselClassName ? ` ${carouselClassName}` : ""}`,
+            children: [
+              /* @__PURE__ */ jsx("div", { className: `screen-slide screen-slide--${direction}`, children: screens[activeIndex] }, animKey),
+              hasCarousel && /* @__PURE__ */ jsx("div", { className: "button-carousel-wrapper", children: screens.map((_, i) => {
+                const duration = carouselDurations == null ? void 0 : carouselDurations[i];
+                return /* @__PURE__ */ jsx(
+                  "div",
+                  {
+                    className: `button ${activeIndex === i ? "active" : ""}`,
+                    style: activeIndex === i && duration ? { "--dot-duration": `${duration}ms` } : {},
+                    onClick: () => {
+                      const dir = i > activeIndex ? "forward" : "backward";
+                      goToSlide(i, dir);
+                    }
+                  },
+                  i
+                );
+              }) })
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "div",
+          {
+            className: `onboarding-tour-footer${playEntrance ? " onboarding-tour-footer--entrance" : ""}`,
+            children: /* @__PURE__ */ jsxs("div", { className: "onboarding-tour-actions", children: [
+              secondaryAction && /* @__PURE__ */ jsx(
+                Button,
+                {
+                  size: isSmallScreen ? "small" : "large",
+                  variant: secondaryAction.variant ?? "tertiary",
+                  onClick: secondaryAction.onClick,
+                  children: secondaryAction.label
+                }
+              ),
+              primaryAction && /* @__PURE__ */ jsx(
+                Button,
+                {
+                  size: isSmallScreen ? "small" : "large",
+                  variant: primaryAction.variant ?? "primary",
+                  onClick: handlePrimaryClick,
+                  children: primaryAction.label
+                }
+              )
+            ] })
+          }
+        )
+      ] })
+    ] })
+  ] });
+};
+export {
+  OnboardingTour
+};

package/dist/components/OnboardingTour/productTourList.d.ts ADDED Viewed

@@ -0,0 +1,39 @@
+export interface ProductTourStep {
+    /** Step label shown in the list */
+    label: string;
+    /** Action button label (e.g. Open, Start, Retry) */
+    actionLabel: string;
+    /** Called when the step action is clicked */
+    onAction?: () => void;
+    /**
+     * When true, step uses muted completed styling (lighter text + gray action button).
+     * Defaults to false.
+     */
+    completed?: boolean;
+}
+export interface ProductTourListProps {
+    /** Title shown in the opened card. Defaults to "How it works?" */
+    title?: string;
+    /** Label shown on the minimized chip. Defaults to "Complete your learning" */
+    minimizedLabel?: string;
+    /** Steps rendered in the opened list */
+    steps: ProductTourStep[];
+    /**
+     * Badge count on the minimized chip.
+     * Defaults to the number of incomplete steps.
+     */
+    remainingCount?: number;
+    /** Footer dismiss link label */
+    dismissLabel?: string;
+    /** Called when the user dismisses the tour entirely */
+    onDismiss?: () => void;
+    /** Controlled expanded state. When omitted, component manages its own state. */
+    expanded?: boolean;
+    /** Initial expanded state when uncontrolled. Defaults to false (minimized). */
+    defaultExpanded?: boolean;
+    /** Called when expanded/minimized state changes */
+    onExpandedChange?: (expanded: boolean) => void;
+}
+export declare const ProductTourList: ({ title, minimizedLabel, steps, remainingCount, dismissLabel, onDismiss, expanded: expandedProp, defaultExpanded, onExpandedChange, }: ProductTourListProps) => import("react").JSX.Element;
+//# sourceMappingURL=productTourList.d.ts.map

package/dist/components/OnboardingTour/productTourList.d.ts.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"productTourList.d.ts","sourceRoot":"","sources":["../../../src/components/OnboardingTour/productTourList.tsx"],"names":[],"mappings":"AAMA,OAAO,8BAA8B,CAAC;AAEtC,MAAM,WAAW,eAAe;IAC9B,mCAAmC;IACnC,KAAK,EAAE,MAAM,CAAC;IACd,oDAAoD;IACpD,WAAW,EAAE,MAAM,CAAC;IACpB,6CAA6C;IAC7C,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB;;;OAGG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED,MAAM,WAAW,oBAAoB;IACnC,kEAAkE;IAClE,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,8EAA8E;IAC9E,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,wCAAwC;IACxC,KAAK,EAAE,eAAe,EAAE,CAAC;IACzB;;;OAGG;IACH,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,gCAAgC;IAChC,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,uDAAuD;IACvD,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;IACvB,gFAAgF;IAChF,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,+EAA+E;IAC/E,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,mDAAmD;IACnD,gBAAgB,CAAC,EAAE,CAAC,QAAQ,EAAE,OAAO,KAAK,IAAI,CAAC;CAChD;AAED,eAAO,MAAM,eAAe,GAAI,uIAU7B,oBAAoB,gCA8EtB,CAAC"}

package/dist/components/OnboardingTour/productTourList.js ADDED Viewed

@@ -0,0 +1,86 @@
+!function(){"use strict";try{if("undefined"!=typeof document){var o=document.createElement("style");o.appendChild(document.createTextNode('@import"https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900";@keyframes ia-shimmer-horizontal{0%{background-position:100% 0}to{background-position:0 0}}@keyframes ia-shimmer-vertical{0%{background-position:0 100%}to{background-position:0 0}}@property --ia-shimmer-angle{syntax:"<angle>";inherits:false;initial-value:0deg}@keyframes ia-shimmer-circular{0%{--ia-shimmer-angle:0deg}to{--ia-shimmer-angle:360deg}}.ia-shimmer{animation:ia-shimmer-horizontal 1.6s ease-in-out infinite;animation-direction:normal;background-color:#e8edf5;background-image:linear-gradient(90deg,#e8edf5,#eceef4 22%,#e8edf5 48%,#d5dbe8 62%,#e8edf5);background-repeat:no-repeat;background-size:300% 100%}@media (prefers-reduced-motion:reduce){.ia-shimmer{animation:none;background-image:linear-gradient(90deg,#e8edf5,#eceef4 40%,#d5dbe8);background-size:100% 100%}}.ia-shimmer--ltr{animation:ia-shimmer-horizontal 1.6s ease-in-out infinite;animation-direction:normal;background-color:#e8edf5;background-image:linear-gradient(90deg,#e8edf5,#eceef4 22%,#e8edf5 48%,#d5dbe8 62%,#e8edf5);background-repeat:no-repeat;background-size:300% 100%}@media (prefers-reduced-motion:reduce){.ia-shimmer--ltr{animation:none;background-image:linear-gradient(90deg,#e8edf5,#eceef4 40%,#d5dbe8);background-size:100% 100%}}.ia-shimmer--rtl{animation:ia-shimmer-horizontal 1.6s ease-in-out infinite;animation-direction:reverse;background-color:#e8edf5;background-image:linear-gradient(270deg,#e8edf5,#eceef4 22%,#e8edf5 48%,#d5dbe8 62%,#e8edf5);background-repeat:no-repeat;background-size:300% 100%}@media (prefers-reduced-motion:reduce){.ia-shimmer--rtl{animation:none;background-image:linear-gradient(270deg,#e8edf5,#eceef4 40%,#d5dbe8);background-size:100% 100%}}.ia-shimmer--btt{animation:ia-shimmer-vertical 1.6s ease-in-out infinite;animation-direction:reverse;background-color:#e8edf5;background-image:linear-gradient(0deg,#e8edf5,#eceef4 22%,#e8edf5 48%,#d5dbe8 62%,#e8edf5);background-repeat:no-repeat;background-size:100% 300%}@media (prefers-reduced-motion:reduce){.ia-shimmer--btt{animation:none;background-image:linear-gradient(0deg,#e8edf5,#eceef4 40%,#d5dbe8);background-size:100% 100%}}.ia-shimmer--ttb{animation:ia-shimmer-vertical 1.6s ease-in-out infinite;animation-direction:normal;background-color:#e8edf5;background-image:linear-gradient(0deg,#e8edf5,#eceef4 22%,#e8edf5 48%,#d5dbe8 62%,#e8edf5);background-repeat:no-repeat;background-size:100% 300%}@media (prefers-reduced-motion:reduce){.ia-shimmer--ttb{animation:none;background-image:linear-gradient(0deg,#e8edf5,#eceef4 40%,#d5dbe8);background-size:100% 100%}}.ia-shimmer--circular{background-color:#e8edf5;background-repeat:no-repeat;--ia-shimmer-angle:0deg;animation:ia-shimmer-circular 1.6s linear infinite;background-image:conic-gradient(from var(--ia-shimmer-angle),#eceef4 0deg,#e8edf5 80deg,#d5dbe8 160deg,#e8edf5 260deg,#eceef4 1turn);background-size:100% 100%}@media (prefers-reduced-motion:reduce){.ia-shimmer--circular{animation:none;background-image:conic-gradient(from 0deg,#eceef4,#e8edf5,#d5dbe8,#e8edf5 1turn)}}@keyframes onboarding-tour-section-enter{0%{opacity:0;transform:translateY(20px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}.onboarding-tour-overlay{background-color:#0d152ccc;bottom:0;left:0;position:fixed;right:0;top:0;z-index:9999;-webkit-tap-highlight-color:transparent;opacity:1;pointer-events:auto;transition:opacity .5s ease-in-out}.onboarding-tour-overlay.overlay--hidden{opacity:0;pointer-events:none}.onboarding-tour-close-button{align-items:center;background-color:#fff;border-radius:50%;box-shadow:0 0 4px #0000001f;cursor:pointer;display:flex;justify-content:center;padding:6px;position:absolute;right:12px;top:12px}.onboarding-tour-close-button:focus-visible{box-shadow:0 0 4px #0000001f,0 0 0 var(--ia-focus-ring-offset,2px) var(--ia-focus-bg,#fff),0 0 0 calc(var(--ia-focus-ring-offset, 2px) + var(--ia-focus-ring-width, 2px)) var(--ia-focus-color,#4259ee);outline:none;transition:box-shadow .15s ease-in-out}.onboarding-tour-close-button:focus:not(:focus-visible){box-shadow:0 0 4px #0000001f;outline:none}.onboarding-tour-close-button svg{height:18px;width:18px}.onboarding-tour-wrapper{background-color:#fff;background-image:radial-gradient(circle,#f7f7f799 2px,#0000 0),radial-gradient(circle,#f7f7f799 2px,#0000 0);background-size:18px 18px;border-radius:12px;box-shadow:0 0 30px 6px #0000001a;left:50%;padding:40px;position:fixed;top:50%;transform:translate(-50%,-50%);z-index:999999}.onboarding-tour-wrapper .onboarding-tour-container{align-items:center;display:flex;flex-direction:column;gap:32px;height:100%;justify-content:space-between}.onboarding-tour-wrapper .onboarding-tour-container .onboarding-tour-header{align-items:center;display:flex;flex-direction:column;gap:8px}.onboarding-tour-wrapper .onboarding-tour-container .onboarding-tour-header .onboarding-tour-header-content{align-items:center;display:flex;flex-direction:column;gap:4px}.onboarding-tour-wrapper .onboarding-tour-container .onboarding-tour-header .onboarding-tour-header-content .onboarding-tour-title{color:#0d152c;font-size:32px;font-weight:800;line-height:48px;text-transform:capitalize;white-space:nowrap}.onboarding-tour-wrapper .onboarding-tour-container .onboarding-tour-header .onboarding-tour-header-content .onboarding-tour-description{color:#7a8294;font-size:16px;font-weight:600;line-height:24px;text-align:center;width:302px}.onboarding-tour-wrapper .onboarding-tour-container .onboarding-tour-footer .onboarding-tour-actions{align-items:center;display:flex;gap:12px}.onboarding-tour-wrapper .onboarding-tour-close-button{right:12px;top:12px}.onboarding-tour-wrapper .onboarding-tour-container .onboarding-tour-header.onboarding-tour-header--entrance{animation:onboarding-tour-section-enter .4s cubic-bezier(.22,1,.36,1) 0s both;will-change:opacity,transform}.onboarding-tour-wrapper .onboarding-tour-container .onboarding-tour-footer.onboarding-tour-footer--entrance{animation:onboarding-tour-section-enter .4s cubic-bezier(.22,1,.36,1) .6s both;will-change:opacity,transform}@media (prefers-reduced-motion:reduce){.onboarding-tour-wrapper .onboarding-tour-container :is(.onboarding-tour-footer.onboarding-tour-footer--entrance,.onboarding-tour-header.onboarding-tour-header--entrance){animation:none!important;opacity:1;transform:none}}@media screen and (max-width:1512px){.onboarding-tour-wrapper{padding:30px}.onboarding-tour-wrapper .onboarding-tour-close-button svg{height:14px;width:14px}.onboarding-tour-wrapper .onboarding-tour-container{gap:24px}.onboarding-tour-wrapper .onboarding-tour-container .onboarding-tour-header{gap:4px}.onboarding-tour-wrapper .onboarding-tour-container .onboarding-tour-header .onboarding-tour-header-content{gap:2px}.onboarding-tour-wrapper .onboarding-tour-container .onboarding-tour-header .onboarding-tour-header-content .onboarding-tour-title{font-size:24px;line-height:36px}.onboarding-tour-wrapper .onboarding-tour-container .onboarding-tour-header .onboarding-tour-header-content .onboarding-tour-description{font-size:12px;line-height:18px}}@keyframes slide-in-from-right{0%{opacity:0;transform:translate(48px)}to{opacity:1;transform:translate(0)}}@keyframes slide-in-from-left{0%{opacity:0;transform:translate(-48px)}to{opacity:1;transform:translate(0)}}@keyframes dot-fill{0%{width:0}to{width:100%}}.onboarding-tour-middle-section{align-items:center;display:flex;flex-direction:column;gap:8px;overflow:hidden;width:100%}.onboarding-tour-middle-section .screen-slide{display:flex;justify-content:center;width:100%}.onboarding-tour-middle-section .screen-slide--forward{animation:slide-in-from-right .38s cubic-bezier(.22,1,.36,1) both}.onboarding-tour-middle-section .screen-slide--backward{animation:slide-in-from-left .38s cubic-bezier(.22,1,.36,1) both}.onboarding-tour-middle-section .screen-slide img{max-height:100%;max-width:100%;object-fit:contain}.onboarding-tour-image{height:295px;object-fit:contain;width:520px}.button-carousel-wrapper{align-items:center;display:flex;gap:10px;justify-content:center}.button-carousel-wrapper .button{background-color:#d9dde7;border-radius:5px;cursor:pointer;flex-shrink:0;height:10px;overflow:hidden;position:relative;transition:width .3s cubic-bezier(.22,1,.36,1),background-color .2s;width:10px}.button-carousel-wrapper .button.active{background-color:#d9dde7;width:32px}.button-carousel-wrapper .button.active:after{animation:dot-fill var(--dot-duration,2s) linear forwards;background-color:#4259ee;border-radius:5px;content:"";height:100%;inset-block:0;left:0;position:absolute}@media (prefers-reduced-motion:reduce){.onboarding-tour-middle-section .screen-slide{animation:none!important;opacity:1;transform:none}.onboarding-tour-middle-section .button.active:after{animation:none!important;width:100%}}@media screen and (max-width:1512px){.onboarding-tour-middle-section{gap:6px}.onboarding-tour-image{height:222px;width:390px}}@keyframes tooltip-slide-in-right{0%{opacity:0;transform:translate(32px)}to{opacity:1;transform:translate(0)}}@keyframes tooltip-slide-in-left{0%{opacity:0;transform:translate(-32px)}to{opacity:1;transform:translate(0)}}.tooltip-card-wrapper{background-color:#fff;border-radius:12px;box-shadow:0 0 30px 6px #0000001a;box-sizing:border-box;display:flex;flex-direction:column;gap:32px;padding:40px;position:relative;width:428px}.tooltip-card-wrapper--anchored{position:absolute;z-index:999999}.tooltip-card-arrow{background-color:#b3bdf8;position:absolute}.tooltip-card-arrow--bottom-left,.tooltip-card-arrow--bottom-right,.tooltip-card-arrow--top-left,.tooltip-card-arrow--top-right{height:12px;width:18px}.tooltip-card-arrow--left-bottom,.tooltip-card-arrow--left-top,.tooltip-card-arrow--right-bottom,.tooltip-card-arrow--right-top{height:18px;width:12px}.tooltip-card-arrow--top-left,.tooltip-card-arrow--top-right{clip-path:polygon(50% 0,0 100%,100% 100%);top:-12px}.tooltip-card-arrow--bottom-left,.tooltip-card-arrow--bottom-right{bottom:-12px;clip-path:polygon(0 0,100% 0,50% 100%)}.tooltip-card-arrow--left-bottom,.tooltip-card-arrow--left-top{clip-path:polygon(0 50%,100% 0,100% 100%);left:-12px}.tooltip-card-arrow--right-bottom,.tooltip-card-arrow--right-top{clip-path:polygon(100% 50%,0 0,0 100%);right:-12px}.tooltip-card-arrow--bottom-left,.tooltip-card-arrow--top-left{left:32px}.tooltip-card-arrow--bottom-right,.tooltip-card-arrow--top-right{right:32px}.tooltip-card-arrow--left-top,.tooltip-card-arrow--right-top{top:32px}.tooltip-card-arrow--left-bottom,.tooltip-card-arrow--right-bottom{bottom:32px}.tooltip-card-body,.tooltip-card-content{display:flex;flex-direction:column;gap:8px}.tooltip-card-content{will-change:opacity,transform}.tooltip-card-content--forward{animation:tooltip-slide-in-right .32s cubic-bezier(.22,1,.36,1) both}.tooltip-card-content--backward{animation:tooltip-slide-in-left .32s cubic-bezier(.22,1,.36,1) both}.tooltip-card-content .tooltip-card-image{margin-top:24px}.tooltip-card-header{color:#0d152c;font-size:16px;font-weight:800;line-height:24px}.tooltip-card-description{color:#7a8294;font-size:14px;font-weight:500;line-height:21px}.tooltip-card-image{border-radius:12px}.tooltip-card-footer{align-items:center;display:flex;justify-content:space-between}.tooltip-card-footer-right{align-items:center;display:flex;gap:14px}.tooltip-card-skip-btn:hover{text-decoration:none!important}@media (prefers-reduced-motion:reduce){.tooltip-card-content{animation:none!important;opacity:1;transform:none}}.product-tour-list{bottom:24px;position:fixed;right:12px;z-index:999999}.product-tour-list-minimized-chip{align-items:center;background-color:#4259ee;border:none;border-bottom:4px solid #687af1;border-radius:4px;box-shadow:0 10px 15px #00000026;cursor:pointer;display:flex;gap:10px;justify-content:center;padding:16px 32px;position:relative}.product-tour-list-minimized-chip:focus-visible{box-shadow:0 10px 15px #00000026,0 0 0 var(--ia-focus-ring-offset,2px) var(--ia-focus-bg,#fff),0 0 0 calc(var(--ia-focus-ring-offset, 2px) + var(--ia-focus-ring-width, 2px)) var(--ia-focus-color,#4259ee);outline:none;transition:box-shadow .15s ease-in-out}.product-tour-list-minimized-chip:focus:not(:focus-visible){box-shadow:0 10px 15px #00000026;outline:none}.product-tour-list-minimized-chip .product-tour-list-minimized-label{color:#fff;font-family:Manrope,sans-serif;font-size:14px;font-weight:500;line-height:20px;text-transform:capitalize;white-space:nowrap}.product-tour-list-minimized-badge{border-radius:100px;box-shadow:0 0 4px #0000001f;color:#1f2b4d;font-family:Manrope,sans-serif;font-size:16px;font-weight:600;height:30px;justify-content:center;line-height:24px;min-width:30px;padding:6px;position:absolute;right:-11px;text-transform:capitalize;top:-10px}.product-tour-list--expanded,.product-tour-list-minimized-badge{align-items:center;background-color:#fff;box-sizing:border-box;display:flex}.product-tour-list--expanded{border-radius:12px;box-shadow:0 0 15px #0000001a;flex-direction:column;gap:32px;padding:40px;width:435px}.product-tour-list-close{align-items:center;background-color:#fff;border-radius:50%;box-shadow:0 0 4px #0000001f;cursor:pointer;display:flex;justify-content:center;padding:6px;position:absolute;right:12px;top:12px}.product-tour-list-close:focus-visible{box-shadow:0 0 4px #0000001f,0 0 0 var(--ia-focus-ring-offset,2px) var(--ia-focus-bg,#fff),0 0 0 calc(var(--ia-focus-ring-offset, 2px) + var(--ia-focus-ring-width, 2px)) var(--ia-focus-color,#4259ee);outline:none;transition:box-shadow .15s ease-in-out}.product-tour-list-close:focus:not(:focus-visible){box-shadow:0 0 4px #0000001f;outline:none}.product-tour-list-close svg{height:18px;width:18px}.product-tour-list-title{color:#0d152c;font-family:Manrope,sans-serif;font-size:24px;font-weight:800;line-height:36px;padding:8px 12px;text-align:center;text-transform:capitalize;width:100%}.product-tour-list-steps{display:flex;flex-direction:column;gap:8px;width:100%}.product-tour-list-step{align-items:center;background-color:#f5f6fa;border-radius:12px;box-sizing:border-box;display:flex;gap:6px;min-width:130px;padding:12px 16px;width:100%}.product-tour-list-step .product-tour-list-step-index{color:#31416e;flex-shrink:0;font-family:Manrope,sans-serif;font-size:16px;font-weight:500;line-height:1.25;text-transform:capitalize}.product-tour-list-step .product-tour-list-step-label{color:#1f2b4d;flex:1;font-family:Manrope,sans-serif;font-size:16px;font-weight:500;line-height:1.25;min-width:0;text-transform:capitalize}.product-tour-list-step--completed .product-tour-list-step-index{color:#7a8294}.product-tour-list-step--completed .product-tour-list-step-label{color:#b4bac7}.product-tour-list-step-btn{flex-shrink:0;height:32px!important;max-height:32px;min-width:56px!important}.product-tour-list-step-btn.product-tour-list-step-btn--completed{background-color:#c3c8d4!important;border-color:#c3c8d4!important;color:#fff!important}.product-tour-list-step-btn.product-tour-list-step-btn--completed:hover{background-color:#c3c8d4!important;border-color:#c3c8d4!important}.product-tour-list-dismiss{height:32px!important;justify-content:center;width:100%}.product-tour-list-dismiss:hover{text-decoration:none!important}@media screen and (max-width:1512px){.product-tour-list--expanded{gap:24px;padding:30px;width:380px}.product-tour-list-close svg{height:14px;width:14px}.product-tour-list-title{font-size:20px;line-height:30px;padding:4px 8px}.product-tour-list-step{padding:10px 12px}.product-tour-list-step :is(.product-tour-list-step-index,.product-tour-list-step-label){font-size:14px}.product-tour-list-step-btn{height:28px!important;max-height:28px}.product-tour-list-minimized-chip{padding:12px 24px}.product-tour-list-minimized-chip .product-tour-list-minimized-label{font-size:13px;line-height:18px}.product-tour-list-minimized-badge{font-size:14px;height:26px;line-height:20px;min-width:26px}}@media screen and (max-width:1280px){.product-tour-list--expanded{gap:20px;padding:24px;width:360px}.product-tour-list-title{font-size:18px;line-height:28px}.product-tour-list-steps{gap:6px}.product-tour-list-step{padding:8px 12px}.product-tour-list-step :is(.product-tour-list-step-index,.product-tour-list-step-label){font-size:13px}.product-tour-list-dismiss{font-size:13px!important;height:auto!important;line-height:18px!important;min-height:28px;text-align:center;white-space:normal}}')),document.head.appendChild(o)}}catch(t){console.error("vite-plugin-css-injected-by-js",t)}}();
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useState } from "react";
+import default_1 from "../../node_modules/@mui/icons-material/CloseRounded.js";
+import { Button } from "../Button/index.js";
+const ProductTourList = ({
+  title = "How it works?",
+  minimizedLabel = "Complete your learning",
+  steps,
+  remainingCount,
+  dismissLabel = "I don't need help, don't show the tour",
+  onDismiss,
+  expanded: expandedProp,
+  defaultExpanded = false,
+  onExpandedChange
+}) => {
+  const [internalExpanded, setInternalExpanded] = useState(defaultExpanded);
+  const isControlled = expandedProp !== void 0;
+  const expanded = isControlled ? expandedProp : internalExpanded;
+  const badgeCount = remainingCount ?? steps.filter((step) => !step.completed).length;
+  const setExpanded = (next) => {
+    if (!isControlled) {
+      setInternalExpanded(next);
+    }
+    onExpandedChange == null ? void 0 : onExpandedChange(next);
+  };
+  if (!expanded) {
+    return /* @__PURE__ */ jsx("div", { className: "product-tour-list product-tour-list--minimized", children: /* @__PURE__ */ jsxs(
+      "button",
+      {
+        "aria-label": `${minimizedLabel}. ${badgeCount} remaining`,
+        className: "product-tour-list-minimized-chip",
+        type: "button",
+        onClick: () => {
+          setExpanded(true);
+        },
+        children: [
+          /* @__PURE__ */ jsx("span", { className: "product-tour-list-minimized-label", children: minimizedLabel }),
+          badgeCount > 0 && /* @__PURE__ */ jsx("span", { "aria-hidden": "true", className: "product-tour-list-minimized-badge", children: badgeCount })
+        ]
+      }
+    ) });
+  }
+  return /* @__PURE__ */ jsxs("div", { className: "product-tour-list product-tour-list--expanded", children: [
+    /* @__PURE__ */ jsx(
+      "div",
+      {
+        className: "product-tour-list-close",
+        onClick: () => {
+          setExpanded(false);
+        },
+        children: /* @__PURE__ */ jsx(default_1, { fontSize: "small", sx: { color: "#60697D" } })
+      }
+    ),
+    /* @__PURE__ */ jsx("div", { className: "product-tour-list-title", children: title }),
+    /* @__PURE__ */ jsx("div", { className: "product-tour-list-steps", children: steps.map((step, index) => /* @__PURE__ */ jsxs(
+      "div",
+      {
+        className: `product-tour-list-step${step.completed ? " product-tour-list-step--completed" : ""}`,
+        children: [
+          /* @__PURE__ */ jsxs("span", { className: "product-tour-list-step-index", children: [
+            index + 1,
+            "."
+          ] }),
+          /* @__PURE__ */ jsx("span", { className: "product-tour-list-step-label", children: step.label }),
+          /* @__PURE__ */ jsx(
+            Button,
+            {
+              className: `product-tour-list-step-btn${step.completed ? " product-tour-list-step-btn--completed" : ""}`,
+              size: "large",
+              variant: "primary",
+              onClick: step.onAction,
+              children: step.actionLabel
+            }
+          )
+        ]
+      },
+      `${step.label}-${index}`
+    )) }),
+    /* @__PURE__ */ jsx(Button, { className: "product-tour-list-dismiss", size: "large", variant: "url", onClick: onDismiss, children: dismissLabel })
+  ] });
+};
+export {
+  ProductTourList
+};