@trycourier/courier-ui-inbox/dist/index.js

Inbox components for the Courier web UI

!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("@trycourier/courier-js"),require("@trycourier/courier-ui-core")):"function"==typeof define&&define.amd?define(["exports","@trycourier/courier-js","@trycourier/courier-ui-core"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).CourierUIInbox={},e.CourierJS,e.CourierUICore)}(this,(function(e,t,i){"use strict";var n=Object.defineProperty,o=(e,t,i)=>((e,t,i)=>t in e?n(e,t,{enumerable:!0,configurable:!0,writable:!0,value:i}):e[t]=i)(e,"symbol"!=typeof t?t+"":t,i);function s(e){const t={...e};return e.actions&&(t.actions=e.actions.map((e=>function(e){const t={...e};e.data&&(t.data=JSON.parse(JSON.stringify(e.data)));return t}(e)))),e.data&&(t.data=JSON.parse(JSON.stringify(e.data))),e.tags&&(t.tags=[...e.tags]),e.trackingIds&&(t.trackingIds={...e.trackingIds}),t}function l(e){if(e)return{...e,messages:e.messages.map((e=>s(e)))}}function r(e){const t={"&":"&amp;","<":"&lt;",">":"&gt;",'"':"&quot;","'":"&#039;"};return String(e).replace(/[&<>"']/g,(e=>t[e]??e))}function a(e){return r(e).replace(/\n/g," ")}function d(e){return!(!e||"string"!=typeof e)&&/<[a-z][\s\S]*>/i.test(e)}const u=' class="courier-inbox-subtitle-link" style="cursor: pointer;"';function h(e){if("string"!=typeof e||!e)return"";const t=/\[([^\]]*)\]\((https?:\/\/[^\s)]+)\)|(https?:\/\/[^\s<>"']+)/gi,i=[];let n,o=0;for(t.lastIndex=0;null!==(n=t.exec(e));){i.push(r(e.slice(o,n.index)));const t=n[1],s=n[2],l=n[3];if(void 0!==s){const e=a(s),n=r(t??s);i.push(`<a href="${e}" target="_blank" rel="noopener noreferrer"${u}>${n}</a>`)}else if(void 0!==l){const e=a(l);i.push(`<a href="${e}" target="_blank" rel="noopener noreferrer"${u}>${r(l)}</a>`)}o=n.index+n[0].length}return i.push(r(e.slice(o))),i.join("")}function c(e){if("string"!=typeof e)return"";if(!e.trim())return"";const t=function(e){let t=e;return t=t.replace(/href\s*=\s*["']?\[[^\]]*\]\s*\(\s*(https?:\/\/[^\s)]+)\s*\)/gi,((e,t)=>`href="${t}"`)),t=t.replace(/target\s*=\s*["']?\+?blank["']?/gi,'target="_blank"'),t=t.replace(/rel\s*=\s*["']?noopener\s+no\s*referrer["']?/gi,'rel="noopener noreferrer"'),t=t.replace(/rel\s*=\s*["']?noopener\s*noreferrer["']?/gi,'rel="noopener noreferrer"'),t=t.replace(/rel\s*=\s*["']?noopener["']?/gi,'rel="noopener noreferrer"'),t}(e);try{let i=function(e){if(e.nodeType===Node.TEXT_NODE)return r(e.textContent??"");if(e.nodeType!==Node.ELEMENT_NODE)return"";const t=e;if("A"===t.tagName.toUpperCase()){const e=t.getAttribute("href")??"";if(/^https?:\/\//i.test(e)){return`<a href="${a(e)}" target="_blank" rel="noopener noreferrer" class="courier-inbox-subtitle-link" style="cursor: pointer;">${Array.from(t.childNodes).map(i).join("")}</a>`}}return Array.from(t.childNodes).map(i).join("")};const n="undefined"!=typeof DOMParser?new DOMParser:null;if(!n)return r(e);const o=n.parseFromString(t,"text/html");return Array.from(o.body.childNodes).map(i).join("")}catch{return r(t)}}class v extends i.CourierBaseElement{constructor(e){super(),o(this,"_theme"),o(this,"_options",[]),this._theme=e}static get id(){return"courier-inbox-list-item-menu"}onComponentMounted(){const e=document.createElement("ul");e.className="menu",this.appendChild(e)}static getStyles(e){var t,i,n;const o=null==(n=null==(i=null==(t=e.inbox)?void 0:t.list)?void 0:i.item)?void 0:n.menu,s=null==o?void 0:o.animation,l=(null==s?void 0:s.initialTransform)??"translate3d(0, 0, 0)",r=(null==s?void 0:s.visibleTransform)??"translate3d(0, 0, 0)";return`\n      ${v.id} {\n        display: none;\n        position: absolute;\n        background: ${(null==o?void 0:o.backgroundColor)??"red"};\n        border: ${(null==o?void 0:o.border)??"1px solid red"};\n        border-radius: ${(null==o?void 0:o.borderRadius)??"0px"};\n        box-shadow: ${(null==o?void 0:o.shadow)??"0 2px 8px red"};\n        user-select: none;\n        opacity: 0;\n        pointer-events: none;\n        transition: ${(null==s?void 0:s.transition)??"all 0.2s ease"};\n        overflow: hidden;\n        transform: ${l};\n        will-change: transform, opacity;\n      }\n\n      ${v.id}.visible {\n        opacity: 1;\n        pointer-events: auto;\n        transform: ${r};\n      }\n\n      ${v.id} ul.menu {\n        list-style: none;\n        margin: 0;\n        padding: 0;\n        display: flex;\n        flex-direction: row;\n      }\n\n      ${v.id} li.menu-item {\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        cursor: pointer;\n        border-bottom: none;\n        background: transparent;\n        touch-action: none;\n      }\n    `}setOptions(e){this._options=e,this.renderMenu()}renderMenu(){var e,t,n;const o=this.querySelector("ul.menu");if(!o)return;o.innerHTML="";const s=null==(n=null==(t=null==(e=this._theme.inbox)?void 0:e.list)?void 0:t.item)?void 0:n.menu,l=e=>{e.stopPropagation(),"touchstart"!==e.type&&"mousedown"!==e.type||e.preventDefault()};this._options.forEach((e=>{var t,n,r;const a=new i.CourierIconButton(e.icon.svg,e.icon.color,null==s?void 0:s.backgroundColor,null==(t=null==s?void 0:s.item)?void 0:t.hoverBackgroundColor,null==(n=null==s?void 0:s.item)?void 0:n.activeBackgroundColor,null==(r=null==s?void 0:s.item)?void 0:r.borderRadius),d=t=>{t.stopPropagation(),e.onClick()};a.addEventListener("click",d),a.addEventListener("touchstart",l,{passive:!1}),a.addEventListener("touchend",d,{passive:!0}),a.addEventListener("touchmove",(e=>{e.stopPropagation()}),{passive:!0}),a.addEventListener("mousedown",l),a.addEventListener("mouseup",l),o.appendChild(a)}))}show(){this.style.display="block",this.classList.remove("visible"),requestAnimationFrame((()=>{requestAnimationFrame((()=>{this.classList.add("visible")}))}))}hide(){this.classList.remove("visible");const e=t=>{t.target===this&&(this.classList.contains("visible")||(this.style.display="none",this.removeEventListener("transitionend",e)))};this.addEventListener("transitionend",e)}}i.registerElement(v);class g{constructor(e,t){o(this,"_id"),o(this,"_messages",[]),o(this,"_firstFetchComplete",!1),o(this,"_hasNextPage",!1),o(this,"_lastPaginationCursor"),o(this,"_filter"),o(this,"_datastoreListeners",[]),o(this,"_totalUnreadCount",0),this._id=e,this._filter={tags:t.tags?[...t.tags]:void 0,archived:t.archived||!1,status:t.status}}get totalUnreadCount(){return this._totalUnreadCount}set totalUnreadCount(e){this._totalUnreadCount=e>0?e:0}setUnreadCount(e){this.totalUnreadCount=e,this._datastoreListeners.forEach((t=>{var i,n,o,s;null==(n=(i=t.events).onUnreadCountChange)||n.call(i,e,this._id),null==(s=(o=t.events).onTotalUnreadCountChange)||s.call(o,m.shared.totalUnreadCount)}))}getFilter(){return{tags:this._filter.tags,archived:this._filter.archived,status:this._filter.status}}addMessage(e,t=0){const i=s(e);return!!this.messageQualifiesForDataset(i)&&(this._messages.splice(t,0,i),i.read||(this.totalUnreadCount+=1),this._datastoreListeners.forEach((e=>{var n,o,s,l,r,a;null==(o=(n=e.events).onMessageAdd)||o.call(n,i,t,this._id),null==(l=(s=e.events).onUnreadCountChange)||l.call(s,this.totalUnreadCount,this._id),null==(a=(r=e.events).onTotalUnreadCountChange)||a.call(r,m.shared.totalUnreadCount)})),!0)}updateWithMessageChange(e,t){const i=this.indexOfMessage(t),n=this._messages[i],o=s(t);if(n&&(r=o,(l=n).archived===r.archived&&l.read===r.read&&l.opened===r.opened))return!0;var l,r;if(n){if(this.messageQualifiesForDataset(o)){const e=this.calculateUnreadChange(n,o);return this._messages.splice(i,1,o),this.totalUnreadCount+=e,this._datastoreListeners.forEach((e=>{var t,n,s,l,r,a;null==(n=(t=e.events).onMessageUpdate)||n.call(t,o,i,this._id),null==(l=(s=e.events).onUnreadCountChange)||l.call(s,this.totalUnreadCount,this._id),null==(a=(r=e.events).onTotalUnreadCountChange)||a.call(r,m.shared.totalUnreadCount)})),!0}return this.removeMessage(n),!1}if(this.messageQualifiesForDataset(t)){const i=this.findInsertIndex(t);this._messages.splice(i,0,s(t));const n=this.messageQualifiesForDataset(e)?this.calculateUnreadChange(e,t):t.read?0:1;return this.totalUnreadCount+=n,this._datastoreListeners.forEach((e=>{var n,o,s,l,r,a;null==(o=(n=e.events).onMessageAdd)||o.call(n,t,i,this._id),null==(l=(s=e.events).onUnreadCountChange)||l.call(s,this.totalUnreadCount,this._id),null==(a=(r=e.events).onTotalUnreadCountChange)||a.call(r,m.shared.totalUnreadCount)})),!0}return this.messageQualifiesForDataset(e)&&(e.read||(this.totalUnreadCount-=1),this._datastoreListeners.forEach((e=>{var t,i,n,o;null==(i=(t=e.events).onUnreadCountChange)||i.call(t,this.totalUnreadCount,this._id),null==(o=(n=e.events).onTotalUnreadCountChange)||o.call(n,m.shared.totalUnreadCount)}))),!1}calculateUnreadChange(e,t){return e.read&&!t.read?1:!e.read&&t.read?-1:0}removeMessage(e){const t=this.indexOfMessage(e);return t>-1&&(this._messages.splice(t,1),e.read||(this.totalUnreadCount-=1),this._datastoreListeners.forEach((i=>{var n,o,s,l,r,a;null==(o=(n=i.events).onMessageRemove)||o.call(n,e,t,this._id),null==(l=(s=i.events).onUnreadCountChange)||l.call(s,this.totalUnreadCount,this._id),null==(a=(r=i.events).onTotalUnreadCountChange)||a.call(r,m.shared.totalUnreadCount)})),!0)}getMessage(e){return this._messages.find((t=>t.messageId===e))}async loadDataset(e){if(e&&this._firstFetchComplete)return void this._datastoreListeners.forEach((e=>{var t,i,n,o,s,l;null==(i=(t=e.events).onDataSetChange)||i.call(t,this.toInboxDataset()),null==(o=(n=e.events).onUnreadCountChange)||o.call(n,this.totalUnreadCount,this._id),null==(l=(s=e.events).onTotalUnreadCountChange)||l.call(s,m.shared.totalUnreadCount)}));const t=await this.fetchMessages();this._messages=[...t.messages],this.totalUnreadCount=t.unreadCount,this._hasNextPage=t.canPaginate,this._lastPaginationCursor=t.paginationCursor??void 0,this._firstFetchComplete=!0,this._datastoreListeners.forEach((e=>{var t,i,n,o,s,l;null==(i=(t=e.events).onDataSetChange)||i.call(t,this.toInboxDataset()),null==(o=(n=e.events).onUnreadCountChange)||o.call(n,this.totalUnreadCount,this._id),null==(l=(s=e.events).onTotalUnreadCountChange)||l.call(s,m.shared.totalUnreadCount)}))}async fetchNextPageOfMessages(){if(!this._hasNextPage)return null;const e=await this.fetchMessages(this._lastPaginationCursor);return this._messages=[...this._messages,...e.messages],this._hasNextPage=e.canPaginate,this._lastPaginationCursor=e.paginationCursor??void 0,this._firstFetchComplete=!0,this._datastoreListeners.forEach((t=>{var i,n,o,s,l,r,a,d;null==(n=(i=t.events).onDataSetChange)||n.call(i,this.toInboxDataset()),null==(s=(o=t.events).onUnreadCountChange)||s.call(o,this.totalUnreadCount,this._id),null==(r=(l=t.events).onPageAdded)||r.call(l,e),null==(d=(a=t.events).onTotalUnreadCountChange)||d.call(a,m.shared.totalUnreadCount)})),e}addDatastoreListener(e){this._datastoreListeners.push(e)}removeDatastoreListener(e){const t=this._datastoreListeners.indexOf(e);t>-1&&this._datastoreListeners.splice(t,1)}toInboxDataset(){return{id:this._id,messages:[...this._messages],unreadCount:this.totalUnreadCount,canPaginate:this._hasNextPage,paginationCursor:this._lastPaginationCursor??null}}async fetchMessages(e){var i,n,o,s,l,r,a,d,u;const h=t.Courier.shared.client;if(!(null==h?void 0:h.options.userId))throw new Error("User is not signed in");const c=await h.inbox.getMessages({paginationLimit:t.Courier.shared.paginationLimit,startCursor:e,filter:this.getFilter()});return{id:this._id,messages:[...(null==(n=null==(i=c.data)?void 0:i.messages)?void 0:n.nodes)??[]],unreadCount:(null==(o=c.data)?void 0:o.unreadCount)??0,canPaginate:(null==(r=null==(l=null==(s=c.data)?void 0:s.messages)?void 0:l.pageInfo)?void 0:r.hasNextPage)??!1,paginationCursor:(null==(u=null==(d=null==(a=c.data)?void 0:a.messages)?void 0:d.pageInfo)?void 0:u.startCursor)??null}}indexOfMessage(e){return this._messages.findIndex((t=>t.messageId===e.messageId))}findInsertIndex(e){const t=this._messages;for(let i=0;i<t.length;i++){const n=t[i];if(n.created&&e.created&&n.created<e.created)return i}return t.length}messageQualifiesForDataset(e){if(e.archived&&!this._filter.archived||!e.archived&&this._filter.archived)return!1;if(e.read&&"unread"===this._filter.status||!e.read&&"read"===this._filter.status)return!1;if(this._filter.tags&&!e.tags)return!1;if(this._filter.tags&&e.tags){for(const t of this._filter.tags)if(e.tags.includes(t))return!0;return!1}return!0}restoreFromSnapshot(e){this._messages=e.messages.map((e=>s(e))),this.totalUnreadCount=e.unreadCount,this._hasNextPage=e.canPaginate,this._lastPaginationCursor=e.paginationCursor??void 0,this._datastoreListeners.forEach((t=>{var i,n,o,s,l,r;null==(n=(i=t.events).onDataSetChange)||n.call(i,e),null==(s=(o=t.events).onUnreadCountChange)||s.call(o,this.totalUnreadCount,this._id),null==(r=(l=t.events).onTotalUnreadCountChange)||r.call(l,m.shared.totalUnreadCount)}))}}const p=class e{constructor(){o(this,"_datasets",new Map),o(this,"_listeners",[]),o(this,"_removeMessageEventListener"),o(this,"_pendingOpenMessageIds",new Set),o(this,"_openBatchTimer",null),o(this,"_globalMessages",new Map)}registerFeeds(e){const t=new Map(e.flatMap((e=>e.tabs)).map((e=>[e.datasetId,e.filter])));this.createDatasetsFromFilters(t)}createDatasetsFromFilters(e){this.clearDatasets();for(let[t,i]of e){const e=new g(t,i);for(let t of this._listeners)e.addDatastoreListener(t);this._datasets.set(t,e)}}addMessage(e){this._globalMessages.set(e.messageId,e);for(let t of this._datasets.values())t.addMessage(e)}updateDatasetsWithMessageChange(e,t){for(let i of this._datasets.values())i.updateWithMessageChange(e,t)}async listenForUpdates(){var e,i,n,o,s,l,r,a,d,u,h;const c=null==(e=t.Courier.shared.client)?void 0:e.inbox.socket;if(c)try{if(this._removeMessageEventListener&&this._removeMessageEventListener(),this._removeMessageEventListener=c.addMessageEventListener((e=>this.handleMessageEvent(e))),c.isConnecting||c.isOpen)return void(null==(l=null==(o=t.Courier.shared.client)?void 0:o.options.logger)||l.info(`Inbox socket already connecting or open for client ID: [${null==(s=t.Courier.shared.client)?void 0:s.options.connectionId}]`));await c.connect(),null==(d=null==(r=t.Courier.shared.client)?void 0:r.options.logger)||d.info(`Inbox socket connected for client ID: [${null==(a=t.Courier.shared.client)?void 0:a.options.connectionId}]`)}catch(v){null==(h=null==(u=t.Courier.shared.client)?void 0:u.options.logger)||h.error("Failed to connect socket:",v)}else null==(n=null==(i=t.Courier.shared.client)?void 0:i.options.logger)||n.info("CourierInbox socket not available")}async loadUnreadCountsForTabs(e){const i=t.Courier.shared.client;if(!i)return;const n={};for(const t of e){const e=this._datasets.get(t);e&&(n[t]=e.getFilter())}if(0===Object.keys(n).length)return;const o=await i.inbox.getUnreadCounts(n);for(const[t,s]of Object.entries(o)){const e=this._datasets.get(t);e&&e.setUnreadCount(s)}}addDataStoreListener(e){this._listeners.push(e);for(let t of this._datasets.values())t.addDatastoreListener(e)}removeDataStoreListener(e){this._listeners=this._listeners.filter((t=>t!==e));for(let t of this._datasets.values())t.removeDatastoreListener(e)}async readMessage({message:i}){if(i.read)return;const n=this._globalMessages.get(i.messageId);n&&await this.executeWithRollback((async()=>{var o;const l=s(n);l.read=e.getISONow(),this._globalMessages.set(i.messageId,l),this.updateDatasetsWithMessageChange(n,l),await(null==(o=t.Courier.shared.client)?void 0:o.inbox.read({messageId:i.messageId}))}))}async unreadMessage({message:e}){if(!e.read)return;const i=this._globalMessages.get(e.messageId);i&&await this.executeWithRollback((async()=>{var n;const o=s(i);o.read=void 0,this._globalMessages.set(e.messageId,o),this.updateDatasetsWithMessageChange(i,o),await(null==(n=t.Courier.shared.client)?void 0:n.inbox.unread({messageId:e.messageId}))}))}openMessage({message:t}){if(t.opened)return;const i=this._globalMessages.get(t.messageId);if(!i||i.opened)return;const n=s(i);n.opened=e.getISONow(),this._globalMessages.set(t.messageId,n),this.updateDatasetsWithMessageChange(i,n),this._pendingOpenMessageIds.add(t.messageId),this.scheduleBatchOpen()}scheduleBatchOpen(){null!==this._openBatchTimer&&clearTimeout(this._openBatchTimer),this._openBatchTimer=setTimeout((()=>{this.flushBatchOpen()}),e.OPEN_BATCH_DELAY_MS)}async flushBatchOpen(){var i,n;this._openBatchTimer=null;const o=Array.from(this._pendingOpenMessageIds);if(this._pendingOpenMessageIds.clear(),0===o.length)return;const s=e.OPEN_BATCH_MAX_SIZE,l=[];for(let e=0;e<o.length;e+=s)l.push(o.slice(e,e+s));try{await Promise.all(l.map((e=>{var i;return null==(i=t.Courier.shared.client)?void 0:i.inbox.batchOpen(e)})))}catch(r){null==(n=null==(i=t.Courier.shared.client)?void 0:i.options.logger)||n.error(`[${e.TAG}] Error batch opening messages:`,r),this._listeners.forEach((e=>{var t,i;null==(i=(t=e.events).onError)||i.call(t,r)}))}}async unarchiveMessage({message:e}){if(!e.archived)return;const i=this._globalMessages.get(e.messageId);i&&await this.executeWithRollback((async()=>{var n;const o=s(i);o.archived=void 0,this._globalMessages.set(e.messageId,o),this.updateDatasetsWithMessageChange(i,o),await(null==(n=t.Courier.shared.client)?void 0:n.inbox.unarchive({messageId:e.messageId}))}))}async archiveMessage({message:i}){if(i.archived)return;const n=this._globalMessages.get(i.messageId);n&&await this.executeWithRollback((async()=>{var o;const l=s(n);l.archived=e.getISONow(),this._globalMessages.set(i.messageId,l),this.updateDatasetsWithMessageChange(n,l),await(null==(o=t.Courier.shared.client)?void 0:o.inbox.archive({messageId:i.messageId}))}))}async clickMessage({message:i}){var n,o,s,l;if(null==(n=i.trackingIds)?void 0:n.clickTrackingId)try{await(null==(o=t.Courier.shared.client)?void 0:o.inbox.click({messageId:i.messageId,trackingId:i.trackingIds.clickTrackingId}))}catch(r){null==(l=null==(s=t.Courier.shared.client)?void 0:s.options.logger)||l.error(`[${e.TAG}] Error clicking message:`,r),this._listeners.forEach((e=>{var t,i;null==(i=(t=e.events).onError)||i.call(t,r)}))}}async archiveAllMessages(){await this.executeWithRollback((async()=>{var i;const n=e.getISONow();for(const[e,t]of this._globalMessages.entries())if(!t.archived){const i=s(t);i.archived=n,this._globalMessages.set(e,i),this.updateDatasetsWithMessageChange(t,i)}for(const e of this._datasets.values())e.getFilter().archived||e.setUnreadCount(0);await(null==(i=t.Courier.shared.client)?void 0:i.inbox.archiveAll())}))}async readAllMessages(){await this.executeWithRollback((async()=>{var i;const n=e.getISONow();for(const[e,t]of this._globalMessages.entries())if(!t.read){const i=s(t);i.read=n,this._globalMessages.set(e,i),this.updateDatasetsWithMessageChange(t,i)}for(const e of this._datasets.values())e.setUnreadCount(0);await(null==(i=t.Courier.shared.client)?void 0:i.inbox.readAll())}))}async archiveReadMessages(){await this.executeWithRollback((async()=>{var i;const n=e.getISONow();for(const[e,t]of this._globalMessages.entries())if(t.read&&!t.archived){const i=s(t);i.archived=n,this._globalMessages.set(e,i),this.updateDatasetsWithMessageChange(t,i)}await(null==(i=t.Courier.shared.client)?void 0:i.inbox.archiveRead())}))}async load(e){const i=t.Courier.shared.client;if(!(null==i?void 0:i.options.userId))throw new Error("[Datastore] User is not signed in");const n=(null==e?void 0:e.canUseCache)??!0;if(null==e?void 0:e.datasetIds){const t=e.datasetIds.flatMap((e=>{const t=this._datasets.get(e);return t?[t]:[]}));return await this.loadDatasets({canUseCache:n,datasets:t})}return await this.loadDatasets({canUseCache:n,datasets:Array.from(this._datasets.values())})}async loadDatasets(e){await Promise.all(e.datasets.map((async t=>{await t.loadDataset(e.canUseCache),this.syncDatasetMessagesToGlobalStore(t)})))}syncDatasetMessagesToGlobalStore(e){const t=e.toInboxDataset();for(const i of t.messages)this._globalMessages.has(i.messageId)||this._globalMessages.set(i.messageId,i)}async fetchNextPageOfMessages(i){var n;const o=t.Courier.shared.client;if(!(null==o?void 0:o.options.userId))throw new Error("User is not signed in");let s;if(i.feedType&&!i.datasetId)null==(n=t.Courier.shared.client)||n.options.logger.warn(`[${e.TAG}] feedType is deprecated andwill be removed in the next major version. Please update callers to use datasetIds.`),s=i.feedType;else{if(!i.datasetId)throw new Error(`[${e.TAG}] Exactly one of feedType or datasetId is required to call fetchNextPageOfMessages.`);s=i.datasetId}const l=this._datasets.get(s);if(!l)throw new Error(`[${e.TAG}] Attempted to fetch next page of messages for dataset ${s}, but the dataset does not exist.`);return this.fetchNextPageForDataset({dataset:l})}getDatasetById(e){var t;return null==(t=this._datasets.get(e))?void 0:t.toInboxDataset()}getDatasets(){const e={};for(const[t,i]of this._datasets.entries())e[t]=i.toInboxDataset();return e}get totalUnreadCount(){let e=0;for(let t of this._datasets.values())e+=t.totalUnreadCount;return e}async fetchNextPageForDataset(e){const t=await e.dataset.fetchNextPageOfMessages();return t&&this.syncDatasetMessagesToGlobalStore(e.dataset),t}handleMessageEvent(i){var n,o;const s=i.event;if(s===t.InboxMessageEvent.NewMessage){const e=i.data;this._globalMessages.set(e.messageId,e);for(let t of this._datasets.values())t.addMessage(e);return}if(s===t.InboxMessageEvent.ArchiveAll||s===t.InboxMessageEvent.ArchiveRead||s===t.InboxMessageEvent.MarkAllRead)return void this.updateAllMessages(s);const l=i.messageId;l?this.updateMessage(l,s):null==(o=null==(n=t.Courier.shared.client)?void 0:n.options.logger)||o.warn(`[${e.TAG}] Received unexpected event: ${s}`)}updateAllMessages(i){const n=e.getISONow();for(const[e,o]of this._globalMessages.entries()){let l=null;switch(i){case t.InboxMessageEvent.MarkAllRead:o.read||(l=s(o),l.read=n);break;case t.InboxMessageEvent.ArchiveAll:o.archived||(l=s(o),l.archived=n);break;case t.InboxMessageEvent.ArchiveRead:o.read&&!o.archived&&(l=s(o),l.archived=n)}l&&(this._globalMessages.set(e,l),this.updateDatasetsWithMessageChange(o,l))}if(i===t.InboxMessageEvent.MarkAllRead)for(const e of this._datasets.values())e.setUnreadCount(0);else if(i===t.InboxMessageEvent.ArchiveAll)for(const e of this._datasets.values())e.getFilter().archived||e.setUnreadCount(0)}updateMessage(i,n){const o=this._globalMessages.get(i);if(!o)return;let l;switch(n){case t.InboxMessageEvent.Archive:l=s(o),l.archived=e.getISONow();break;case t.InboxMessageEvent.Opened:l=s(o),l.opened=e.getISONow();break;case t.InboxMessageEvent.Read:l=s(o),l.read=e.getISONow();break;case t.InboxMessageEvent.Unarchive:l=s(o),l.archived=void 0;break;case t.InboxMessageEvent.Unread:l=s(o),l.read=void 0;break;case t.InboxMessageEvent.Clicked:case t.InboxMessageEvent.Unopened:default:return}this._globalMessages.set(i,l),this.updateDatasetsWithMessageChange(o,l)}clearDatasets(){this._datasets.clear(),this._globalMessages.clear()}static getISONow(){return(new Date).toISOString()}createDatastoreSnapshot(){const e=[];for(const[i,n]of this._datasets.entries()){const t=n.toInboxDataset();if(t){const n=l(t);n&&e.push({id:i,dataset:n})}}const t=new Map;for(const[i,n]of this._globalMessages.entries())t.set(i,s(n));return{datasets:e,globalMessages:t}}restoreDatastoreSnapshot(e){this._globalMessages.clear();for(const[t,i]of e.globalMessages.entries())this._globalMessages.set(t,s(i));for(const t of e.datasets){const e=this._datasets.get(t.id);e&&e.restoreFromSnapshot(t.dataset)}}async executeWithRollback(i){var n,o;const s=this.createDatastoreSnapshot();try{return await i()}catch(l){null==(o=null==(n=t.Courier.shared.client)?void 0:n.options.logger)||o.error(`[${e.TAG}] Error during operation:`,l),this.restoreDatastoreSnapshot(s),this._listeners.forEach((e=>{var t,i;null==(i=(t=e.events).onError)||i.call(t,l)}))}}static get shared(){return e.instance||(e.instance=new e),e.instance}};o(p,"TAG","CourierInboxDatastore"),o(p,"OPEN_BATCH_DELAY_MS",100),o(p,"OPEN_BATCH_MAX_SIZE",50),o(p,"instance");let m=p;class b extends i.CourierBaseElement{constructor(e,t,i,n){super(),o(this,"_themeManager"),o(this,"_theme"),o(this,"_message",null),o(this,"_isMobile",!1),o(this,"_canClick",!1),o(this,"_listItemActions",O.defaultListItemActions()),o(this,"_titleElement"),o(this,"_subtitleElement"),o(this,"_timeElement"),o(this,"_menu"),o(this,"_unreadIndicator"),o(this,"_actionsContainer"),o(this,"_longPressTimeout",null),o(this,"_isLongPress",!1),o(this,"_observer"),o(this,"onItemClick",null),o(this,"onItemLongPress",null),o(this,"onItemActionClick",null),o(this,"onItemVisible",null),this._canClick=t,this._themeManager=e,this._theme=e.getTheme(),this._isMobile="ontouchstart"in window,n&&(this._listItemActions=n),this.render(),this._setupIntersectionObserver()}static get id(){return"courier-inbox-list-item"}render(){const e=document.createElement("div");e.className="content-container",this._titleElement=document.createElement("p"),this._titleElement.className="title",this._subtitleElement=document.createElement("p"),this._subtitleElement.className="subtitle",this._actionsContainer=document.createElement("div"),this._actionsContainer.className="actions-container",e.appendChild(this._titleElement),e.appendChild(this._subtitleElement),e.appendChild(this._actionsContainer),this._timeElement=document.createElement("p"),this._timeElement.className="time",this._unreadIndicator=document.createElement("div"),this._unreadIndicator.className="unread-indicator",this._menu=new v(this._theme),this._menu.setOptions(this._getMenuOptions()),this.append(this._unreadIndicator,e,this._timeElement,this._menu);const t=e=>{e.stopPropagation(),e.preventDefault()};this._menu.addEventListener("mousedown",t),this._menu.addEventListener("pointerdown",t),this._menu.addEventListener("click",t),this.addEventListener("click",(e=>{this._canClick&&(this._menu&&(this._menu.contains(e.target)||e.composedPath().includes(this._menu))||e.target instanceof HTMLAnchorElement||!this._message||!this.onItemClick||e.target instanceof i.CourierIcon||this._isLongPress||this.onItemClick(this._message))})),this._setupHoverBehavior(),this._setupLongPressBehavior(),this._canClick&&this.classList.add("clickable")}_setupIntersectionObserver(){"undefined"!=typeof window&&"undefined"!=typeof IntersectionObserver&&(this._observer&&this._observer.disconnect(),this._observer=new IntersectionObserver((e=>{e.forEach((e=>{1===e.intersectionRatio&&this.onItemVisible&&this._message&&this.onItemVisible(this._message)}))}),{threshold:1}),this._observer.observe(this))}onComponentUnmounted(){var e;null==(e=this._observer)||e.disconnect()}static getStyles(e){var t,i,n,o,s,l,r,a,d,u,h,c,v,g,p,m,_,C,f,x,y,I,k,w,M,S,E,T,L,$,R,A,F,B,P,U,O,D,N,z,G,H,V;const j=null==(t=e.inbox)?void 0:t.list;return`\n      ${b.id} {\n        display: flex;\n        flex-direction: row;\n        align-items: flex-start;\n        justify-content: space-between;\n        border-bottom: ${(null==(i=null==j?void 0:j.item)?void 0:i.divider)??"1px solid red"};\n        font-family: inherit;\n        cursor: default;\n        transition: ${(null==(n=null==j?void 0:j.item)?void 0:n.transition)??"all 0.2s ease"};\n        margin: 0;\n        width: 100%;\n        box-sizing: border-box;\n        padding: 12px 20px;\n        position: relative;\n        background-color: ${(null==(o=null==j?void 0:j.item)?void 0:o.backgroundColor)??"transparent"};\n        user-select: none;\n        -webkit-user-select: none;\n        -moz-user-select: none;\n        -ms-user-select: none;\n        touch-action: manipulation;\n      }\n\n      /* Only apply hover/active background if clickable */\n      @media (hover: hover) {\n        ${b.id}.clickable:hover {\n          cursor: pointer;\n          background-color: ${(null==(s=null==j?void 0:j.item)?void 0:s.hoverBackgroundColor)??"red"};\n        }\n      }\n\n      ${b.id}.clickable:active {\n        cursor: pointer;\n        background-color: ${(null==(l=null==j?void 0:j.item)?void 0:l.activeBackgroundColor)??"red"};\n      }\n\n      /* Menu hover / active */\n      @media (hover: hover) {\n        ${b.id}.clickable:hover:has(courier-inbox-list-item-menu:hover, courier-inbox-list-item-menu *:hover, courier-button:hover, courier-button *:hover) {\n          background-color: ${(null==(r=null==j?void 0:j.item)?void 0:r.backgroundColor)??"transparent"};\n        }\n      }\n\n      ${b.id}.clickable:active:has(courier-inbox-list-item-menu:active, courier-inbox-list-item-menu *:active, courier-button:active, courier-button *:active) {\n        background-color: ${(null==(a=null==j?void 0:j.item)?void 0:a.backgroundColor)??"transparent"};\n      }\n\n      ${b.id}:last-child {\n        border-bottom: none;\n      }\n\n      ${b.id} .unread-indicator {\n        position: absolute;\n        top: 28px;\n        left: 6px;\n        width: 8px;\n        height: 8px;\n        border-radius: 50%;\n        background-color: ${(null==(d=null==j?void 0:j.item)?void 0:d.unreadIndicatorColor)??"red"};\n        display: none;\n      }\n\n      ${b.id}.unread .unread-indicator {\n        display: block;\n      }\n\n      ${b.id} .content-container {\n        flex: 1;\n        display: flex;\n        flex-direction: column;\n        margin-right: 12px;\n      }\n\n      ${b.id} p {\n        margin: 0;\n        overflow-wrap: break-word;\n        word-break: break-word;\n        hyphens: auto;\n        line-height: 1.4;\n        user-select: none;\n        -webkit-user-select: none;\n        -moz-user-select: none;\n        -ms-user-select: none;\n        text-align: left;\n      }\n\n      ${b.id} .title {\n        font-family: ${(null==(h=null==(u=null==j?void 0:j.item)?void 0:u.title)?void 0:h.family)??"inherit"};\n        font-size: ${(null==(v=null==(c=null==j?void 0:j.item)?void 0:c.title)?void 0:v.size)??"14px"};\n        color: ${(null==(p=null==(g=null==j?void 0:j.item)?void 0:g.title)?void 0:p.color)??"red"};\n        margin-bottom: 4px;\n      }\n      ${b.id} .title a,\n      ${b.id} .title .courier-inbox-subtitle-link {\n        --courier-inbox-subtitle-link-color: ${(null==(_=null==(m=null==j?void 0:j.item)?void 0:m.subtitleLink)?void 0:_.color)??"#2563EB"};\n        --courier-inbox-subtitle-link-decoration: ${(null==(f=null==(C=null==j?void 0:j.item)?void 0:C.subtitleLink)?void 0:f.textDecoration)??"underline"};\n        color: var(--courier-inbox-subtitle-link-color);\n        text-decoration: var(--courier-inbox-subtitle-link-decoration);\n        cursor: pointer;\n      }\n      ${b.id} .title a:hover,\n      ${b.id} .title .courier-inbox-subtitle-link:hover {\n        color: ${(null==(y=null==(x=null==j?void 0:j.item)?void 0:x.subtitleLink)?void 0:y.hoverColor)??(null==(k=null==(I=null==j?void 0:j.item)?void 0:I.subtitleLink)?void 0:k.color)??"#2563EB"};\n      }\n\n      ${b.id} .subtitle {\n        font-family: ${(null==(M=null==(w=null==j?void 0:j.item)?void 0:w.subtitle)?void 0:M.family)??"inherit"};\n        font-size: ${(null==(E=null==(S=null==j?void 0:j.item)?void 0:S.subtitle)?void 0:E.size)??"14px"};\n        color: ${(null==(L=null==(T=null==j?void 0:j.item)?void 0:T.subtitle)?void 0:L.color)??"red"};\n      }\n\n      ${b.id} .subtitle a,\n      ${b.id} .subtitle .courier-inbox-subtitle-link {\n        --courier-inbox-subtitle-link-color: ${(null==(R=null==($=null==j?void 0:j.item)?void 0:$.subtitleLink)?void 0:R.color)??"#2563EB"};\n        --courier-inbox-subtitle-link-decoration: ${(null==(F=null==(A=null==j?void 0:j.item)?void 0:A.subtitleLink)?void 0:F.textDecoration)??"underline"};\n        color: var(--courier-inbox-subtitle-link-color);\n        text-decoration: var(--courier-inbox-subtitle-link-decoration);\n        cursor: pointer;\n      }\n\n      ${b.id} .subtitle a:hover,\n      ${b.id} .subtitle .courier-inbox-subtitle-link:hover {\n        color: ${(null==(P=null==(B=null==j?void 0:j.item)?void 0:B.subtitleLink)?void 0:P.hoverColor)??(null==(O=null==(U=null==j?void 0:j.item)?void 0:U.subtitleLink)?void 0:O.color)??"#2563EB"};\n      }\n\n      ${b.id} .time {\n        font-family: ${(null==(N=null==(D=null==j?void 0:j.item)?void 0:D.time)?void 0:N.family)??"inherit"};\n        font-size: ${(null==(G=null==(z=null==j?void 0:j.item)?void 0:z.time)?void 0:G.size)??"14px"};\n        color: ${(null==(V=null==(H=null==j?void 0:j.item)?void 0:H.time)?void 0:V.color)??"red"};\n        text-align: right;\n        white-space: nowrap;\n      }\n\n      ${b.id} courier-inbox-list-item-menu {\n        z-index: 1;\n        position: absolute;\n        top: 8px;\n        right: 8px;\n        display: none;\n        opacity: 0;\n        transition: opacity 0.2s ease;\n      }\n\n      ${b.id} courier-inbox-list-item-menu.visible {\n        opacity: 1;\n      }\n\n      /* Show menu on hover for non-mobile devices - CSS handles this reliably */\n      @media (hover: hover) {\n        ${b.id}.clickable:hover courier-inbox-list-item-menu {\n          display: block;\n        }\n        ${b.id}.clickable:hover courier-inbox-list-item-menu.visible {\n          display: block;\n        }\n        ${b.id}.clickable:hover .time {\n          opacity: 0;\n          transition: opacity 0.2s ease;\n        }\n      }\n\n      ${b.id} .actions-container {\n        display: flex;\n        margin-top: 10px;\n        flex-wrap: wrap;\n        flex-direction: row;\n        align-items: center;\n        gap: 8px;\n        display: none;\n      }\n    `}_setupHoverBehavior(){this._isMobile||(this.addEventListener("mouseenter",(()=>{this._isLongPress=!1;const e=this._getMenuOptions();e.length>0&&this._menu&&(this._menu.setOptions(e),this._menu.show(),this._timeElement&&(this._timeElement.style.opacity="0"))})),this.addEventListener("mouseleave",(()=>{this._menu&&this._menu.hide(),this._timeElement&&(this._timeElement.style.opacity="1")})))}_setupLongPressBehavior(){var e,t,i;const n=null==(i=null==(t=null==(e=this._theme.inbox)?void 0:e.list)?void 0:t.item)?void 0:i.menu;if(!(null==n?void 0:n.enabled))return;const o=n.longPress;this.addEventListener("touchstart",(()=>{this._longPressTimeout=window.setTimeout((()=>{this._isLongPress=!0,this._showMenu(),this._message&&this.onItemLongPress&&(this.onItemLongPress(this._message),navigator.vibrate&&navigator.vibrate((null==o?void 0:o.vibrationDuration)??50)),setTimeout((()=>{this._hideMenu(),this._isLongPress=!1}),(null==o?void 0:o.displayDuration)??2e3)}),650)}),{passive:!0}),this.addEventListener("touchend",(()=>{this._longPressTimeout&&(window.clearTimeout(this._longPressTimeout),this._longPressTimeout=null)}))}_getMenuOptions(){var e,t,n,o,s,l,r,a,d,u,h,c,v,g,p,b;const _=null==(o=null==(n=null==(t=null==(e=this._theme.inbox)?void 0:e.list)?void 0:t.item)?void 0:n.menu)?void 0:o.item;let C=[];const f=!!(null==(s=this._message)?void 0:s.archived);for(const x of this._listItemActions)switch(x.id){case"read_unread":C.push({id:(null==(l=this._message)?void 0:l.read)?"unread":"read",icon:{svg:(null==(r=this._message)?void 0:r.read)?x.unreadIconSVG??(null==(a=null==_?void 0:_.unread)?void 0:a.svg)??i.CourierIconSVGs.unread:x.readIconSVG??(null==(d=null==_?void 0:_.read)?void 0:d.svg)??i.CourierIconSVGs.read,color:(null==(u=this._message)?void 0:u.read)?null==(h=null==_?void 0:_.unread)?void 0:h.color:(null==(c=null==_?void 0:_.read)?void 0:c.color)??"red"},onClick:()=>{this._message&&(this._message.read?m.shared.unreadMessage({message:this._message}):m.shared.readMessage({message:this._message}))}});break;case"archive_unarchive":C.push({id:f?"unarchive":"archive",icon:{svg:f?x.unarchiveIconSVG??(null==(v=null==_?void 0:_.unarchive)?void 0:v.svg)??i.CourierIconSVGs.unarchive:x.archiveIconSVG??(null==(g=null==_?void 0:_.archive)?void 0:g.svg)??i.CourierIconSVGs.archive,color:f?null==(p=null==_?void 0:_.unarchive)?void 0:p.color:(null==(b=null==_?void 0:_.archive)?void 0:b.color)??"red"},onClick:()=>{this._message&&(f?m.shared.unarchiveMessage({message:this._message}):m.shared.archiveMessage({message:this._message}))}})}return C}_showMenu(){var e,t,i;const n=null==(i=null==(t=null==(e=this._theme.inbox)?void 0:e.list)?void 0:t.item)?void 0:i.menu,o=this._getMenuOptions();0!==o.length&&n&&n.enabled&&this._menu&&this._timeElement&&(this._menu.setOptions(o),this._menu.show(),this._timeElement.style.opacity="0")}_hideMenu(){var e,t,i;const n=null==(i=null==(t=null==(e=this._theme.inbox)?void 0:e.list)?void 0:t.item)?void 0:i.menu;n&&n.enabled&&this._menu&&this._timeElement&&(this._menu.hide(),this._timeElement.style.opacity="1")}setMessage(e){this._message=e,this._updateContent()}setOnItemClick(e){this.onItemClick=e}setOnItemActionClick(e){this.onItemActionClick=e}setOnItemLongPress(e){this.onItemLongPress=e}setOnItemVisible(e){this.onItemVisible=e}_updateContent(){var e,t,n;if(!this._message)return this._titleElement&&(this._titleElement.textContent=""),void(this._subtitleElement&&(this._subtitleElement.textContent=""));if(this.classList.toggle("unread",!this._message.read),this._titleElement){const e=this._message.title||"Untitled Message";d(e)?this._titleElement.innerHTML=c(e):this._titleElement.innerHTML=c(h(e))}if(this._subtitleElement){const e=this._message.body??"",t=this._message.preview??"",i=e&&d(e)?e:t||e||"";d(i)?this._subtitleElement.innerHTML=c(i):this._subtitleElement.innerHTML=c(h(i))}this._timeElement&&(this._timeElement.textContent=function(e){if(!e.created)return"Now";const t=new Date,i=new Date(e.created),n=Math.floor((t.getTime()-i.getTime())/1e3);return n<5?"Now":n<60?`${n}s`:n<3600?`${Math.floor(n/60)}m`:n<86400?`${Math.floor(n/3600)}h`:n<604800?`${Math.floor(n/86400)}d`:n<31536e3?`${Math.floor(n/604800)}w`:`${Math.floor(n/31536e3)}y`}(this._message)),this._menu&&this._menu.setOptions(this._getMenuOptions());const o=this._message.actions&&this._message.actions.length>0;this._actionsContainer&&(this._actionsContainer.style.display=o?"flex":"none");const s=null==(n=null==(t=null==(e=this._theme.inbox)?void 0:e.list)?void 0:t.item)?void 0:n.actions;this._actionsContainer&&this._message.actions&&(this._actionsContainer.innerHTML="",this._message.actions.forEach((e=>{var t,n,o,l,r;const a=new i.CourierButton({mode:this._themeManager.mode,text:e.content,variant:"secondary",backgroundColor:null==s?void 0:s.backgroundColor,hoverBackgroundColor:null==s?void 0:s.hoverBackgroundColor,activeBackgroundColor:null==s?void 0:s.activeBackgroundColor,border:null==s?void 0:s.border,borderRadius:null==s?void 0:s.borderRadius,shadow:null==s?void 0:s.shadow,fontFamily:null==(t=null==s?void 0:s.font)?void 0:t.family,fontSize:null==(n=null==s?void 0:s.font)?void 0:n.size,fontWeight:null==(o=null==s?void 0:s.font)?void 0:o.weight,textColor:null==(l=null==s?void 0:s.font)?void 0:l.color,onClick:()=>{this._message&&this.onItemActionClick&&this.onItemActionClick(this._message,e)}});null==(r=this._actionsContainer)||r.appendChild(a)})))}}i.registerElement(b);class _ extends i.CourierBaseElement{constructor(e){super(),o(this,"_theme"),o(this,"_style"),this._theme=e}static get id(){return"courier-inbox-skeleton-list-item"}onComponentMounted(){this._style=i.injectGlobalStyle(_.id,_.getStyles(this._theme)),this.render()}onComponentUnmounted(){var e;null==(e=this._style)||e.remove()}render(){const e=new C(this._theme),t=new C(this._theme),i=new C(this._theme);this.appendChild(e),this.appendChild(t),this.appendChild(i)}static getStyles(e){return`\n      ${_.id} {\n        display: flex;\n        flex-direction: column;\n        gap: 12px;\n        padding: 16px 20px 16px 20px;\n        width: 100%;\n        box-sizing: border-box;\n      }\n\n      ${_.id} > *:first-child {\n        width: 35%;\n      }\n\n      ${_.id} > *:nth-child(2) {\n        width: 100%;\n      }\n\n      ${_.id} > *:nth-child(3) {\n        width: 82%;\n      }\n    `}}i.registerElement(_);class C extends i.CourierBaseElement{constructor(e){super(),o(this,"_theme"),o(this,"_style"),this._theme=e}static get id(){return"courier-skeleton-animated-row"}onComponentMounted(){this._style=i.injectGlobalStyle(C.id,C.getStyles(this._theme)),this.render()}onComponentUnmounted(){var e;null==(e=this._style)||e.remove()}render(){const e=document.createElement("div");e.className="skeleton-item",this.appendChild(e)}static getStyles(e){var t,i,n,o,s,l,r,a,d,u,h,c;const v=(null==(n=null==(i=null==(t=e.inbox)?void 0:t.loading)?void 0:i.animation)?void 0:n.barColor)??"#000",g=4===v.length?`#${v[1]}${v[1]}${v[2]}${v[2]}${v[3]}${v[3]}`:v,p=parseInt(g.slice(1,3),16),m=parseInt(g.slice(3,5),16),b=parseInt(g.slice(5,7),16),_=`rgba(${p}, ${m}, ${b}, 0.8)`,f=`rgba(${p}, ${m}, ${b}, 0.4)`;return`\n      ${C.id} {\n        display: flex;\n        height: 100%;\n        width: 100%;\n        align-items: flex-start;\n        justify-content: flex-start;\n      }\n\n      ${C.id} .skeleton-item {\n        height: ${(null==(l=null==(s=null==(o=e.inbox)?void 0:o.loading)?void 0:s.animation)?void 0:l.barHeight)??"14px"};\n        width: 100%;\n        background: linear-gradient(\n          90deg,\n          ${_} 25%,\n          ${f} 50%,\n          ${_} 75%\n        );\n        background-size: 200% 100%;\n        animation: ${C.id}-shimmer ${(null==(d=null==(a=null==(r=e.inbox)?void 0:r.loading)?void 0:a.animation)?void 0:d.duration)??"2s"} ease-in-out infinite;\n        border-radius: ${(null==(c=null==(h=null==(u=e.inbox)?void 0:u.loading)?void 0:h.animation)?void 0:c.barBorderRadius)??"14px"};\n      }\n\n      @keyframes ${C.id}-shimmer {\n        0% {\n          background-position: 200% 0;\n        }\n        100% {\n          background-position: -200% 0;\n        }\n      }\n    `}}i.registerElement(C);class f extends i.CourierFactoryElement{constructor(e){super(),o(this,"_theme"),o(this,"_style"),this._theme=e}static get id(){return"courier-inbox-skeleton-list"}onComponentMounted(){this._style=i.injectGlobalStyle(f.id,f.getStyles(this._theme))}onComponentUnmounted(){var e;null==(e=this._style)||e.remove()}defaultElement(){const e=document.createElement("div");e.className="list";for(let t=0;t<3;t++){const t=new _(this._theme);e.appendChild(t)}return this.appendChild(e),e}static getStyles(e){var t,i,n,o;return`\n      ${f.id} {\n        display: flex;\n        height: 100%;\n        width: 100%;\n        align-items: flex-start;\n        justify-content: flex-start;\n        overflow: hidden;\n      }\n\n      ${f.id} .list {\n        display: flex;\n        flex-direction: column;\n        width: 100%;\n        overflow: hidden;\n      }\n\n      ${f.id} .list > * {\n        border-bottom: ${(null==(i=null==(t=e.inbox)?void 0:t.loading)?void 0:i.divider)??"1px solid red"};\n        opacity: 100%;\n      }\n\n      ${f.id} .list > *:nth-child(2) {\n        border-bottom: ${(null==(o=null==(n=e.inbox)?void 0:n.loading)?void 0:o.divider)??"1px solid red"};\n        opacity: 88%;\n      }\n\n      ${f.id} .list > *:nth-child(3) {\n        border-bottom: none;\n        opacity: 50%;\n      }\n    `}}i.registerElement(f);class x extends i.CourierBaseElement{constructor(e){super(),o(this,"_theme"),o(this,"_style"),o(this,"_skeletonLoadingList"),o(this,"_observer"),o(this,"_customItem"),o(this,"_onPaginationTrigger"),this._theme=e.theme,this._customItem=e.customItem,this._onPaginationTrigger=e.onPaginationTrigger}static get id(){return"courier-inbox-pagination-list-item"}onComponentMounted(){if(this._style=i.injectGlobalStyle(x.id,x.getStyles(this._theme)),this._customItem)this.appendChild(this._customItem);else{const e=document.createElement("div");e.className="skeleton-container",this._skeletonLoadingList=new f(this._theme),this._skeletonLoadingList.build(void 0),e.appendChild(this._skeletonLoadingList),this.appendChild(e)}this._observer=new IntersectionObserver((e=>{e.forEach((e=>{e.isIntersecting&&this._onPaginationTrigger()}))})),this._observer.observe(this)}onComponentUnmounted(){var e,t;null==(e=this._observer)||e.disconnect(),null==(t=this._style)||t.remove()}static getStyles(e){return`\n      ${x.id} {\n        padding: 0;\n        margin: 0;\n        box-sizing: border-box;\n      }\n\n      ${x.id} .skeleton-container {\n        height: 150%;\n      }\n    `}}function y(e){m.shared.openMessage({message:e})}function I(){return[{feedId:"inbox_feed",title:"Inbox",iconSVG:i.CourierIconSVGs.inbox,tabs:[{datasetId:"all_messages",title:"All Messages",filter:{}}]},{feedId:"archive_feed",title:"Archive",iconSVG:i.CourierIconSVGs.archive,tabs:[{datasetId:"archived_messages",title:"Archived Messages",filter:{archived:!0}}]}]}function k(){return[{id:"readAll"},{id:"archiveRead"},{id:"archiveAll"}]}function w(){return[{id:"read_unread"},{id:"archive_unarchive"}]}i.registerElement(x);class M extends i.CourierBaseElement{constructor(e){super(),o(this,"_themeSubscription"),o(this,"_messages",[]),o(this,"_datasetId",I()[0].tabs[0].datasetId),o(this,"_isLoading",!0),o(this,"_error",null),o(this,"_canPaginate",!1),o(this,"_canClickListItems",!1),o(this,"_canLongPressListItems",!1),o(this,"_listItemActions",O.defaultListItemActions()),o(this,"_onMessageClick",null),o(this,"_onMessageActionClick",null),o(this,"_onMessageLongPress",null),o(this,"_onRefresh"),o(this,"_onPaginationTrigger"),o(this,"_listItemFactory"),o(this,"_paginationItemFactory"),o(this,"_loadingStateFactory"),o(this,"_emptyStateFactory"),o(this,"_errorStateFactory"),o(this,"_listStyles"),o(this,"_listItemStyles"),o(this,"_listItemMenuStyles"),o(this,"_errorContainer"),o(this,"_emptyContainer"),this._onRefresh=e.onRefresh,this._onPaginationTrigger=e.onPaginationTrigger,this._onMessageClick=e.onMessageClick,this._onMessageActionClick=e.onMessageActionClick,this._onMessageLongPress=e.onMessageLongPress,e.listItemActions&&(this._listItemActions=e.listItemActions),this._themeSubscription=e.themeManager.subscribe((e=>{this.refreshTheme()}))}static get id(){return"courier-inbox-list"}get messages(){return this._messages}get theme(){return this._themeSubscription.manager.getTheme()}onComponentMounted(){this._listStyles=i.injectGlobalStyle(M.id,M.getStyles(this.theme)),this._listItemStyles=i.injectGlobalStyle(b.id,b.getStyles(this.theme)),this._listItemMenuStyles=i.injectGlobalStyle(v.id,v.getStyles(this.theme)),this.render()}onComponentUnmounted(){var e,t,i;this._themeSubscription.unsubscribe(),null==(e=this._listStyles)||e.remove(),null==(t=this._listItemStyles)||t.remove(),null==(i=this._listItemMenuStyles)||i.remove()}setCanClickListItems(e){this._canClickListItems=e}setCanLongPressListItems(e){this._canLongPressListItems=e}setListItemActions(e){this._listItemActions=e,this.render()}static getStyles(e){var t;const i=null==(t=e.inbox)?void 0:t.list,n=null==i?void 0:i.scrollbar;return`\n      ${M.id} {\n        flex: 1;\n        width: 100%;\n        background-color: ${(null==i?void 0:i.backgroundColor)??"red"};\n        scrollbar-width: ${(null==n?void 0:n.width)??"thin"};\n        scrollbar-color: ${(null==n?void 0:n.thumbColor)??"rgba(0, 0, 0, 0.2)"} ${(null==n?void 0:n.trackBackgroundColor)??"transparent"};\n      }\n\n      ${M.id} ul {\n        list-style: none;\n        padding: 0;\n        margin: 0;\n        height: 100%;\n      }\n\n      /* Webkit scrollbar styling - show thumb, hide track background, overlay above content */\n      ${M.id}::-webkit-scrollbar {\n        width: ${(null==n?void 0:n.width)??"8px"};\n        height: ${(null==n?void 0:n.height)??"8px"};\n      }\n\n      ${M.id}::-webkit-scrollbar-track {\n        background: ${(null==n?void 0:n.trackBackgroundColor)??"transparent"};\n      }\n\n      ${M.id}::-webkit-scrollbar-thumb {\n        background: ${(null==n?void 0:n.thumbColor)??"rgba(0, 0, 0, 0.2)"};\n        border-radius: ${(null==n?void 0:n.borderRadius)??"4px"};\n      }\n\n      ${M.id}::-webkit-scrollbar-thumb:hover {\n        background: ${(null==n?void 0:n.thumbHoverColor)??(null==n?void 0:n.thumbColor)??"rgba(0, 0, 0, 0.3)"};\n      }\n    `}setDataSet(e){this._messages=[...e.messages],this._canPaginate=Boolean(e.canPaginate),this._error=null,this._isLoading=!1,this.render()}addPage(e){this._messages=[...this._messages,...e.messages],this._canPaginate=Boolean(e.canPaginate),this._error=null,this._isLoading=!1,this.render()}addMessage(e,t=0){this._messages.splice(t,0,e),this.render()}removeMessage(e=0){this._messages.splice(e,1),this.render()}updateMessage(e,t=0){this._messages[t]=e,this.render()}selectDataset(e){this._datasetId=e,this._error=null,this._isLoading=!0,this.render()}setLoading(e){this._error=null,this._isLoading=e,this.render()}setError(e){this._error=e,this._isLoading=!1,this._messages=[],this.render()}setErrorNoClient(){this.setError(new Error("No user signed in"))}handleRetry(){this._onRefresh()}handleRefresh(){this._onRefresh()}refreshTheme(){this._listStyles&&(this._listStyles.textContent=M.getStyles(this.theme)),this._listItemStyles&&(this._listItemStyles.textContent=b.getStyles(this.theme)),this._listItemMenuStyles&&(this._listItemMenuStyles.textContent=v.getStyles(this.theme)),this.refreshInfoStateThemes()}refreshInfoStateThemes(){var e,t;null==(e=this._emptyContainer)||e.updateStyles(this.errorProps),null==(t=this._emptyContainer)||t.updateStyles(this.emptyProps)}get errorProps(){var e,t,i,n,o,s,l,r,a,d,u,h,c,v,g,p,m,b,_,C,f,x,y,I,k,w;const M=null==(e=this.theme.inbox)?void 0:e.error,S=this._themeSubscription.manager.mode;return{title:{text:(null==(t=null==M?void 0:M.title)?void 0:t.text)??(null==(i=this._error)?void 0:i.message),textColor:null==(o=null==(n=null==M?void 0:M.title)?void 0:n.font)?void 0:o.color,fontFamily:null==(l=null==(s=null==M?void 0:M.title)?void 0:s.font)?void 0:l.family,fontSize:null==(a=null==(r=null==M?void 0:M.title)?void 0:r.font)?void 0:a.size,fontWeight:null==(u=null==(d=null==M?void 0:M.title)?void 0:d.font)?void 0:u.weight},button:{mode:S,text:null==(h=null==M?void 0:M.button)?void 0:h.text,backgroundColor:null==(c=null==M?void 0:M.button)?void 0:c.backgroundColor,hoverBackgroundColor:null==(v=null==M?void 0:M.button)?void 0:v.hoverBackgroundColor,activeBackgroundColor:null==(g=null==M?void 0:M.button)?void 0:g.activeBackgroundColor,te