@trycourier/courier-ui-inbox 1.0.0-beta
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.
- package/dist/components/courier-inbox-header-title.d.ts +19 -0
- package/dist/components/courier-inbox-header.d.ts +30 -0
- package/dist/components/courier-inbox-list-item-menu.d.ts +17 -0
- package/dist/components/courier-inbox-list-item.d.ts +36 -0
- package/dist/components/courier-inbox-list.d.ts +53 -0
- package/dist/components/courier-inbox-menu-button.d.ts +14 -0
- package/dist/components/courier-inbox-menu.d.ts +51 -0
- package/dist/components/courier-inbox-option-menu-item.d.ts +20 -0
- package/dist/components/courier-inbox-option-menu.d.ts +32 -0
- package/dist/components/courier-inbox-pagination-list-item.d.ts +14 -0
- package/dist/components/courier-inbox-skeleton-list-item.d.ts +6 -0
- package/dist/components/courier-inbox-skeleton-list.d.ts +8 -0
- package/dist/components/courier-inbox.d.ts +43 -0
- package/dist/components/courier-unread-count-badge.d.ts +18 -0
- package/dist/datastore/datastore-listener.d.ts +6 -0
- package/dist/datastore/datastore.d.ts +42 -0
- package/dist/datastore/datatore-events.d.ts +12 -0
- package/dist/index.d.ts +13 -0
- package/dist/index.es.js +3410 -0
- package/dist/index.umd.js +632 -0
- package/dist/types/courier-inbox-theme-manager.d.ts +50 -0
- package/dist/types/courier-inbox-theme.d.ts +161 -0
- package/dist/types/factories.d.ts +32 -0
- package/dist/types/feed-type.d.ts +1 -0
- package/dist/types/inbox-data-set.d.ts +6 -0
- package/dist/utils/extensions.d.ts +7 -0
- package/dist/utils/utils.d.ts +1 -0
- package/package.json +35 -0
|
@@ -0,0 +1,632 @@
|
|
|
1
|
+
(function(E,f){typeof exports=="object"&&typeof module<"u"?f(exports,require("@trycourier/courier-js")):typeof define=="function"&&define.amd?define(["exports","@trycourier/courier-js"],f):(E=typeof globalThis<"u"?globalThis:E||self,f(E.CourierUIInbox={},E.CourierJS))})(this,function(E,f){"use strict";var No=Object.defineProperty;var Uo=(E,f,oe)=>f in E?No(E,f,{enumerable:!0,configurable:!0,writable:!0,value:oe}):E[f]=oe;var a=(E,f,oe)=>Uo(E,typeof f!="symbol"?f+"":f,oe);var oe=Object.defineProperty,$o=(m,i,e)=>i in m?oe(m,i,{enumerable:!0,configurable:!0,writable:!0,value:e}):m[i]=e,L=(m,i,e)=>$o(m,typeof i!="symbol"?i+"":i,e);const r={black:{500:"#171717",50010:"#1717171A",50020:"#17171733"},gray:{200:"#F5F5F5",400:"#3A3A3A",500:"#E5E5E5",600:"#737373"},white:{500:"#FFFFFF",50010:"#FFFFFF1A",50020:"#FFFFFF33"},blue:{400:"#60A5FA",500:"#2563EB"}},G={light:{colors:{primary:r.black[500],secondary:r.white[500],border:r.gray[500],link:r.blue[500],icon:r.black[500]},button:{cornerRadius:"4px"}},dark:{colors:{primary:r.white[500],secondary:r.black[500],border:r.gray[400],link:r.blue[400],icon:r.white[500]},button:{cornerRadius:"4px"}}},Ve=()=>typeof window>"u"?"light":window.matchMedia("(prefers-color-scheme: dark)").matches?"dark":"light",Ze=m=>{if(typeof window>"u")return()=>{};const i=window.matchMedia("(prefers-color-scheme: dark)"),e=t=>{m(t.matches?"dark":"light")};return i.addEventListener("change",e),()=>{i.removeEventListener("change",e)}};class je extends HTMLElement{constructor(){super(),L(this,"_currentSystemTheme"),L(this,"_systemThemeCleanup"),this._currentSystemTheme=Ve(),this._systemThemeCleanup=Ze(i=>{this._currentSystemTheme=i,this.onSystemThemeChange(i)})}get currentSystemTheme(){return this._currentSystemTheme}disconnectedCallback(){this._systemThemeCleanup&&this._systemThemeCleanup()}onSystemThemeChange(i){}}const Pe={borderRadius:"4px",fontSize:"14px"},X={primary:m=>({...Pe,backgroundColor:G[m].colors.primary,textColor:G[m].colors.secondary,fontWeight:"500",shadow:"none"}),secondary:m=>({...Pe,backgroundColor:G[m].colors.secondary,textColor:G[m].colors.primary,fontWeight:"500",border:`1px solid ${G[m].colors.border}`,shadow:m==="light"?"0px 1px 2px 0px rgba(0, 0, 0, 0.06)":"0px 1px 2px 0px rgba(255, 255, 255, 0.1)"}),tertiary:m=>({...Pe,backgroundColor:G[m].colors.border,textColor:G[m].colors.primary,fontWeight:"500",border:"none",shadow:"none"})};class Ie extends je{constructor(i){super(),L(this,"_button"),L(this,"_style");const e=this.attachShadow({mode:"open"});this._button=document.createElement("button"),this._button.setAttribute("part","button"),this._style=document.createElement("style"),this._style.textContent=this.getStyles(i),e.appendChild(this._style),e.appendChild(this._button),this.updateButton(i),this._button.addEventListener("click",t=>{t.preventDefault(),t.stopPropagation(),i.onClick&&i.onClick()})}getStyles(i){const e=()=>X.secondary(this.currentSystemTheme).textColor,t=()=>X.secondary(this.currentSystemTheme).backgroundColor,s=()=>X.secondary(this.currentSystemTheme).border,o=()=>X.secondary(this.currentSystemTheme).shadow,n=()=>X.secondary(this.currentSystemTheme).borderRadius,h=()=>X.secondary(this.currentSystemTheme).fontSize,d=()=>X.secondary(this.currentSystemTheme).fontWeight;return`
|
|
2
|
+
:host {
|
|
3
|
+
display: inline-block;
|
|
4
|
+
}
|
|
5
|
+
|
|
6
|
+
button {
|
|
7
|
+
border: none;
|
|
8
|
+
border-radius: ${i.borderRadius??n()};
|
|
9
|
+
font-weight: ${i.fontWeight??d()};
|
|
10
|
+
font-family: ${i.fontFamily??"inherit"};
|
|
11
|
+
font-size: ${i.fontSize??h()};
|
|
12
|
+
padding: 6px 10px;
|
|
13
|
+
cursor: pointer;
|
|
14
|
+
width: 100%;
|
|
15
|
+
height: 100%;
|
|
16
|
+
background-color: ${i.backgroundColor??t()};
|
|
17
|
+
color: ${i.textColor??e()};
|
|
18
|
+
border: ${i.border??s()};
|
|
19
|
+
box-shadow: ${i.shadow??o()};
|
|
20
|
+
touch-action: manipulation;
|
|
21
|
+
}
|
|
22
|
+
|
|
23
|
+
button:hover {
|
|
24
|
+
${i.hoverBackgroundColor?`background-color: ${i.hoverBackgroundColor};`:"filter: brightness(0.9);"}
|
|
25
|
+
}
|
|
26
|
+
|
|
27
|
+
button:active {
|
|
28
|
+
${i.activeBackgroundColor?`background-color: ${i.activeBackgroundColor};`:"filter: brightness(0.8);"}
|
|
29
|
+
}
|
|
30
|
+
|
|
31
|
+
button:disabled {
|
|
32
|
+
opacity: 0.5;
|
|
33
|
+
cursor: not-allowed;
|
|
34
|
+
}
|
|
35
|
+
`}updateButton(i){i.text&&(this._button.textContent=i.text),this._style.textContent=this.getStyles(i)}}customElements.get("courier-button")||customElements.define("courier-button",Ie);const C={inbox:`<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
36
|
+
<path d="M5.5 14.5V17C5.5 17.2812 5.71875 17.5 6 17.5H18C18.25 17.5 18.5 17.2812 18.5 17V14.5H15.9375L15.2812 15.8125C15.0938 16.25 14.6562 16.5 14.1875 16.5H9.78125C9.3125 16.5 8.875 16.25 8.6875 15.8125L8.03125 14.5H5.5ZM18.1875 13L16.6562 6.90625C16.5938 6.65625 16.4062 6.5 16.1875 6.5H7.8125C7.5625 6.5 7.375 6.65625 7.3125 6.90625L5.78125 13H8.1875C8.65625 13 9.09375 13.2812 9.3125 13.7188L9.9375 15H14.0312L14.6875 13.7188C14.875 13.2812 15.3125 13 15.7812 13H18.1875ZM4 14.25C4 14.0938 4 13.9375 4.03125 13.7812L5.84375 6.53125C6.09375 5.625 6.875 5 7.8125 5H16.1875C17.0938 5 17.9062 5.625 18.125 6.53125L19.9375 13.7812C19.9688 13.9375 20 14.0938 20 14.25V17C20 18.125 19.0938 19 18 19H6C4.875 19 4 18.125 4 17V14.25Z" fill="currentColor"/>
|
|
37
|
+
</svg>`,archive:`<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
38
|
+
<path d="M5.5 6.5V8H18.5V6.5H5.5ZM5 5H19C19.5312 5 20 5.46875 20 6V8.5C20 9.0625 19.5312 9.5 19 9.5H5C4.4375 9.5 4 9.0625 4 8.5V6C4 5.46875 4.4375 5 5 5ZM9 11.75C9 11.3438 9.3125 11 9.75 11H14.25C14.6562 11 15 11.3438 15 11.75C15 12.1875 14.6562 12.5 14.25 12.5H9.75C9.3125 12.5 9 12.1875 9 11.75ZM5 17V10.5H6.5V17C6.5 17.2812 6.71875 17.5 7 17.5H17C17.25 17.5 17.5 17.2812 17.5 17V10.5H19V17C19 18.125 18.0938 19 17 19H7C5.875 19 5 18.125 5 17Z" fill="currentColor"/>
|
|
39
|
+
</svg>`,check:`<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
40
|
+
<path d="M18.793 7.33203C19.0742 7.64453 19.0742 8.11328 18.793 8.39453L10.543 16.6445C10.2305 16.957 9.76172 16.957 9.48047 16.6445L5.23047 12.3945C4.91797 12.1133 4.91797 11.6445 5.23047 11.3633C5.51172 11.0508 5.98047 11.0508 6.26172 11.3633L9.98047 15.082L17.7305 7.33203C18.0117 7.05078 18.4805 7.05078 18.7617 7.33203H18.793Z" fill="currentColor"/>
|
|
41
|
+
</svg>`,filter:`<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
42
|
+
<path d="M5 7C5 6.59375 5.3125 6.25 5.75 6.25H18.25C18.6562 6.25 19 6.59375 19 7C19 7.4375 18.6562 7.75 18.25 7.75H5.75C5.3125 7.75 5 7.4375 5 7ZM7 12C7 11.5938 7.3125 11.25 7.75 11.25H16.25C16.6562 11.25 17 11.5938 17 12C17 12.4375 16.6562 12.75 16.25 12.75H7.75C7.3125 12.75 7 12.4375 7 12ZM14 17C14 17.4375 13.6562 17.75 13.25 17.75H10.75C10.3125 17.75 10 17.4375 10 17C10 16.5938 10.3125 16.25 10.75 16.25H13.25C13.6562 16.25 14 16.5938 14 17Z" fill="currentColor"/>
|
|
43
|
+
</svg>`,overflow:`<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
44
|
+
<path d="M18.5117 11.9883C18.5117 12.5508 18.1992 13.0195 17.7617 13.3008C17.293 13.582 16.6992 13.582 16.2617 13.3008C15.793 13.0195 15.5117 12.5508 15.5117 11.9883C15.5117 11.457 15.793 10.9883 16.2617 10.707C16.6992 10.4258 17.293 10.4258 17.7617 10.707C18.1992 10.9883 18.5117 11.457 18.5117 11.9883ZM13.5117 11.9883C13.5117 12.5508 13.1992 13.0195 12.7617 13.3008C12.293 13.582 11.6992 13.582 11.2617 13.3008C10.793 13.0195 10.5117 12.5508 10.5117 11.9883C10.5117 11.457 10.793 10.9883 11.2617 10.707C11.6992 10.4258 12.293 10.4258 12.7617 10.707C13.1992 10.9883 13.5117 11.457 13.5117 11.9883ZM7.01172 13.4883C6.44922 13.4883 5.98047 13.207 5.69922 12.7383C5.41797 12.3008 5.41797 11.707 5.69922 11.2383C5.98047 10.8008 6.44922 10.4883 7.01172 10.4883C7.54297 10.4883 8.01172 10.8008 8.29297 11.2383C8.57422 11.707 8.57422 12.3008 8.29297 12.7383C8.01172 13.207 7.54297 13.4883 7.01172 13.4883Z" fill="currentColor"/>
|
|
45
|
+
</svg>`,read:`<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
46
|
+
<path d="M7 6.5C6.71875 6.5 6.5 6.75 6.5 7V17C6.5 17.2812 6.71875 17.5 7 17.5H17C17.25 17.5 17.5 17.2812 17.5 17V7C17.5 6.75 17.25 6.5 17 6.5H7ZM5 7C5 5.90625 5.875 5 7 5H17C18.0938 5 19 5.90625 19 7V17C19 18.125 18.0938 19 17 19H7C5.875 19 5 18.125 5 17V7ZM15.5312 10.5312L11.5312 14.5312C11.2188 14.8438 10.75 14.8438 10.4688 14.5312L8.46875 12.5312C8.15625 12.25 8.15625 11.7812 8.46875 11.5C8.75 11.1875 9.21875 11.1875 9.53125 11.5L11 12.9688L14.4688 9.46875C14.75 9.1875 15.2188 9.1875 15.5 9.46875C15.8125 9.78125 15.8125 10.25 15.5 10.5312H15.5312Z" fill="currentColor"/>
|
|
47
|
+
</svg>`,archiveRead:`<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
48
|
+
<path d="M7.5 6.5V15.25H16.5V6.5H7.5ZM6 15.25V6.5C6 5.6875 6.65625 5 7.5 5H16.5C17.3125 5 18 5.6875 18 6.5V15.25C18.4062 15.25 18.75 15.5938 18.75 16C18.75 16.4375 18.4062 16.75 18 16.75H6C5.5625 16.75 5.25 16.4375 5.25 16C5.25 15.5938 5.5625 15.25 6 15.25ZM5 13V14.5H4.5V17.5H19.5V14.5H19V13H19.5C20.3125 13 21 13.6875 21 14.5V17.5C21 18.3438 20.3125 19 19.5 19H4.5C3.65625 19 3 18.3438 3 17.5V14.5C3 13.6875 3.65625 13 4.5 13H5ZM15.0312 9.625L11.6875 12.9688C11.5312 13.0938 11.3438 13.1875 11.1562 13.1875C10.9375 13.1875 10.75 13.0938 10.625 12.9688L8.96875 11.2812C8.65625 11 8.65625 10.5312 8.96875 10.25C9.25 9.9375 9.71875 9.9375 10 10.25L11.1562 11.375L13.9688 8.5625C14.25 8.28125 14.7188 8.28125 15 8.5625C15.3125 8.875 15.3125 9.34375 15 9.625H15.0312Z" fill="currentColor"/>
|
|
49
|
+
</svg>`,unread:`<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
50
|
+
<path d="M17 6.5H7C6.71875 6.5 6.5 6.75 6.5 7V17C6.5 17.2812 6.71875 17.5 7 17.5H17C17.25 17.5 17.5 17.2812 17.5 17V7C17.5 6.75 17.25 6.5 17 6.5ZM7 5H17C18.0938 5 19 5.90625 19 7V17C19 18.125 18.0938 19 17 19H7C5.875 19 5 18.125 5 17V7C5 5.90625 5.875 5 7 5Z" fill="currentColor"/>
|
|
51
|
+
</svg>`,unarchive:`<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
52
|
+
<path d="M5.5 11C5.0625 11 4.75 10.6875 4.75 10.25V5.75C4.75 5.34375 5.0625 5 5.5 5C5.90625 5 6.25 5.34375 6.25 5.75V8.28125L6.875 7.53125C8.15625 6 10.0625 5 12.25 5C16.0938 5 19.25 8.15625 19.25 12C19.25 15.875 16.0938 19 12.25 19C10.6562 19 9.21875 18.5 8.03125 17.625C7.71875 17.375 7.625 16.9062 7.875 16.5625C8.125 16.2188 8.59375 16.1562 8.9375 16.4062C9.84375 17.0938 11 17.5 12.25 17.5C15.2812 17.5 17.75 15.0625 17.75 12C17.75 8.96875 15.2812 6.5 12.25 6.5C10.5312 6.5 9.03125 7.28125 8 8.5L7.15625 9.5H10C10.4062 9.5 10.75 9.84375 10.75 10.25C10.75 10.6875 10.4062 11 10 11H5.5Z" fill="currentColor"/>
|
|
53
|
+
</svg>`};class ie extends HTMLElement{constructor(i,e){super(),L(this,"_color"),L(this,"_svg"),L(this,"_iconContainer"),L(this,"_style"),this._color=i??r.black[500],this._svg=e;const t=this.attachShadow({mode:"open"});this._iconContainer=document.createElement("div"),t.appendChild(this._iconContainer),this._style=document.createElement("style"),this._style.textContent=this.getStyles(this._color),t.appendChild(this._style),this.refresh()}getStyles(i){return`
|
|
54
|
+
:host {
|
|
55
|
+
display: inline-block;
|
|
56
|
+
line-height: 0;
|
|
57
|
+
display: flex;
|
|
58
|
+
align-items: center;
|
|
59
|
+
justify-content: center;
|
|
60
|
+
}
|
|
61
|
+
|
|
62
|
+
svg {
|
|
63
|
+
width: 24px;
|
|
64
|
+
height: 24px;
|
|
65
|
+
color: ${i};
|
|
66
|
+
}
|
|
67
|
+
`}refresh(){this._svg&&(this._iconContainer.innerHTML=this._svg),this._color&&(this._style.textContent=this.getStyles(this._color))}updateColor(i){this._color=i,this.refresh()}updateSVG(i){this._svg=i,this.refresh()}}customElements.get("courier-icon")||customElements.define("courier-icon",ie);class $e extends HTMLElement{constructor(){super(),L(this,"link");const i=this.attachShadow({mode:"open"});this.link=document.createElement("a"),this.link.setAttribute("part","link");const e=document.createElement("style");e.textContent=`
|
|
68
|
+
:host {
|
|
69
|
+
display: inline-block;
|
|
70
|
+
}
|
|
71
|
+
|
|
72
|
+
a {
|
|
73
|
+
text-decoration: none;
|
|
74
|
+
border-radius: 4px;
|
|
75
|
+
cursor: pointer;
|
|
76
|
+
font-weight: 500;
|
|
77
|
+
transition: all 0.2s ease;
|
|
78
|
+
font-family: var(--courier-link-font-family, inherit);
|
|
79
|
+
font-size: var(--courier-link-font-size, inherit);
|
|
80
|
+
}
|
|
81
|
+
|
|
82
|
+
/* Variants */
|
|
83
|
+
a[data-variant="primary"][data-mode="light"] {
|
|
84
|
+
color: var(--courier-link-color, ${G.light.colors.link});
|
|
85
|
+
}
|
|
86
|
+
|
|
87
|
+
a[data-variant="primary"][data-mode="light"]:hover {
|
|
88
|
+
opacity: 0.8;
|
|
89
|
+
}
|
|
90
|
+
|
|
91
|
+
a[data-variant="primary"][data-mode="light"]:active {
|
|
92
|
+
opacity: 0.6;
|
|
93
|
+
}
|
|
94
|
+
|
|
95
|
+
a[data-variant="primary"][data-mode="dark"] {
|
|
96
|
+
color: var(--courier-link-color, ${G.dark.colors.link});
|
|
97
|
+
}
|
|
98
|
+
|
|
99
|
+
a[data-variant="primary"][data-mode="dark"]:hover {
|
|
100
|
+
opacity: 0.8;
|
|
101
|
+
}
|
|
102
|
+
|
|
103
|
+
a[data-variant="primary"][data-mode="dark"]:active {
|
|
104
|
+
opacity: 0.6;
|
|
105
|
+
}
|
|
106
|
+
|
|
107
|
+
a[data-underline="true"] {
|
|
108
|
+
text-decoration: underline;
|
|
109
|
+
}
|
|
110
|
+
|
|
111
|
+
a:disabled {
|
|
112
|
+
opacity: 0.6;
|
|
113
|
+
cursor: not-allowed;
|
|
114
|
+
pointer-events: none;
|
|
115
|
+
}
|
|
116
|
+
`,i.appendChild(e),i.appendChild(this.link),this.updateVariant(),this.updateUnderline(),this.updateMode()}connectedCallback(){const i=document.createElement("slot");this.link.appendChild(i),this.updateHref()}attributeChangedCallback(i,e,t){if(e!==t)switch(i){case"href":this.updateHref();break;case"variant":case"mode":this.updateVariant();break;case"disabled":this.link.style.pointerEvents=this.hasAttribute("disabled")?"none":"auto",this.link.style.opacity=this.hasAttribute("disabled")?"0.6":"1";break;case"color":this.updateColor();break;case"underline":this.updateUnderline();break;case"target":this.updateTarget();break;case"font-family":this.updateFontFamily();break;case"font-size":this.updateFontSize();break}}updateHref(){const i=this.getAttribute("href");i&&(this.link.href=i)}updateVariant(){const i=this.getAttribute("variant")||"primary",e=this.getAttribute("mode")||"light";this.link.setAttribute("data-variant",i),this.link.setAttribute("data-mode",e)}updateColor(){const i=this.getAttribute("color");i?this.link.style.setProperty("--courier-link-color",i):this.link.style.removeProperty("--courier-link-color")}updateUnderline(){const i=this.getAttribute("underline")==="true";this.link.setAttribute("data-underline",i.toString())}updateMode(){const i=this.getAttribute("mode")||"light";this.link.setAttribute("data-mode",i)}updateTarget(){const i=this.getAttribute("target");i&&(this.link.target=i)}updateFontFamily(){const i=this.getAttribute("font-family");i?this.link.style.setProperty("--courier-link-font-family",i):this.link.style.removeProperty("--courier-link-font-family")}updateFontSize(){const i=this.getAttribute("font-size");i?this.link.style.setProperty("--courier-link-font-size",i):this.link.style.removeProperty("--courier-link-font-size")}}L($e,"observedAttributes",["href","variant","disabled","color","underline","mode","target","font-family","font-size"]),customElements.get("courier-link")||customElements.define("courier-link",$e);class Te extends je{constructor(){super(),L(this,"shadow"),this.shadow=this.attachShadow({mode:"open"})}build(i){if(i===null){this.shadow.replaceChildren();return}const e=i??this.defaultElement();this.shadow.replaceChildren(e)}defaultElement(){const i=document.createElement("div");return i.textContent="Default Element Factory",i.style.cssText=`
|
|
117
|
+
background-color: red;
|
|
118
|
+
text-align: center;
|
|
119
|
+
padding: 12px;
|
|
120
|
+
`,i}}class Le extends Te{constructor(i){super(),L(this,"_props"),L(this,"_title"),L(this,"_button"),L(this,"_style"),L(this,"_buttonClickCallback",null),this._props=i}defaultElement(){var i,e;const t=document.createElement("div");return this._title=document.createElement("h2"),(i=this._props.title)!=null&&i.text&&(this._title.textContent=this._props.title.text),this._button=new Ie(this._props.button??X.secondary(this.currentSystemTheme)),this._style=document.createElement("style"),this._style.textContent=this.getStyles(this._props),t.className="container",t.appendChild(this._style),t.appendChild(this._title),t.appendChild(this._button),this.shadow.appendChild(t),(e=this._button)==null||e.addEventListener("click",()=>{this._buttonClickCallback&&this._buttonClickCallback()}),t}onSystemThemeChange(i){this.updateStyles(this._props)}getStyles(i){var e,t,s,o;return`
|
|
121
|
+
:host {
|
|
122
|
+
display: flex;
|
|
123
|
+
align-items: center;
|
|
124
|
+
justify-content: center;
|
|
125
|
+
height: 100%;
|
|
126
|
+
width: 100%;
|
|
127
|
+
}
|
|
128
|
+
|
|
129
|
+
.container {
|
|
130
|
+
display: flex;
|
|
131
|
+
flex-direction: column;
|
|
132
|
+
align-items: center;
|
|
133
|
+
justify-content: center;
|
|
134
|
+
gap: 16px;
|
|
135
|
+
text-align: center;
|
|
136
|
+
padding: 24px;
|
|
137
|
+
}
|
|
138
|
+
|
|
139
|
+
.container h2 {
|
|
140
|
+
margin: 0;
|
|
141
|
+
color: ${((e=i.title)==null?void 0:e.textColor)??"red"};
|
|
142
|
+
font-size: ${((t=i.title)==null?void 0:t.fontSize)??"16px"};
|
|
143
|
+
font-weight: ${((s=i.title)==null?void 0:s.fontWeight)??"500"};
|
|
144
|
+
font-family: ${((o=i.title)==null?void 0:o.fontFamily)??"inherit"};
|
|
145
|
+
}
|
|
146
|
+
`}updateStyles(i){this._props=i,this._style&&(this._style.textContent=this.getStyles(i)),this._button&&this._button.updateButton(i.button)}setButtonClickCallback(i){this._buttonClickCallback=i}}customElements.get("courier-info-state")||customElements.define("courier-info-state",Le);class re extends HTMLElement{constructor(i,e,t,s,o,n,h,d){super(),L(this,"_backgroundColor"),L(this,"_hoverBackgroundColor"),L(this,"_activeBackgroundColor"),L(this,"_borderRadius"),L(this,"_height"),L(this,"_width"),L(this,"_style"),L(this,"_button"),L(this,"_icon"),this._borderRadius=n,this._backgroundColor=t,this._hoverBackgroundColor=s,this._activeBackgroundColor=o,this._height=h,this._width=d;const c=this.attachShadow({mode:"open"});this._button=document.createElement("button"),this._button.setAttribute("part","button"),this._icon=new ie(e,i),this._style=document.createElement("style"),this.refresh(),c.appendChild(this._style),this._button.appendChild(this._icon),c.appendChild(this._button)}refresh(){this._style.textContent=this.getStyles()}getStyles(){return`
|
|
147
|
+
:host {
|
|
148
|
+
display: inline-block;
|
|
149
|
+
border-radius: ${this._borderRadius??"50%"};
|
|
150
|
+
}
|
|
151
|
+
|
|
152
|
+
button {
|
|
153
|
+
border: none;
|
|
154
|
+
border-radius: ${this._borderRadius??"50%"};
|
|
155
|
+
cursor: pointer;
|
|
156
|
+
width: ${this._width??"36px"};
|
|
157
|
+
height: ${this._height??"36px"};
|
|
158
|
+
display: flex;
|
|
159
|
+
align-items: center;
|
|
160
|
+
justify-content: center;
|
|
161
|
+
background: ${this._backgroundColor??"transparent"};
|
|
162
|
+
transition: background-color 0.2s ease;
|
|
163
|
+
touch-action: manipulation;
|
|
164
|
+
}
|
|
165
|
+
|
|
166
|
+
button:hover {
|
|
167
|
+
background-color: ${this._hoverBackgroundColor??"red"};
|
|
168
|
+
}
|
|
169
|
+
|
|
170
|
+
button:active {
|
|
171
|
+
background-color: ${this._activeBackgroundColor??"red"};
|
|
172
|
+
}
|
|
173
|
+
|
|
174
|
+
button:disabled {
|
|
175
|
+
opacity: 0.6;
|
|
176
|
+
cursor: not-allowed;
|
|
177
|
+
}
|
|
178
|
+
|
|
179
|
+
[part="icon"] {
|
|
180
|
+
display: flex;
|
|
181
|
+
align-items: center;
|
|
182
|
+
justify-content: center;
|
|
183
|
+
width: 24px;
|
|
184
|
+
height: 24px;
|
|
185
|
+
}
|
|
186
|
+
`}updateIconColor(i){this._icon.updateColor(i)}updateIconSVG(i){this._icon.updateSVG(i)}updateBackgroundColor(i){this._backgroundColor=i,this.refresh()}updateHoverBackgroundColor(i){this._hoverBackgroundColor=i,this.refresh()}updateActiveBackgroundColor(i){this._activeBackgroundColor=i,this.refresh()}}customElements.get("courier-icon-button")||customElements.define("courier-icon-button",re),[{name:"courier-button",class:Ie},{name:"courier-icon",class:ie},{name:"courier-link",class:$e},{name:"courier-info-state",class:Le},{name:"courier-icon-button",class:re}].forEach(({name:m,class:i})=>{customElements.get(m)||customElements.define(m,i)});const se=class se{constructor(){a(this,"_inboxDataSet");a(this,"_archiveDataSet");a(this,"_dataStoreListeners",[]);a(this,"_unreadCount");a(this,"isPaginatingInbox",!1);a(this,"isPaginatingArchive",!1)}static get shared(){return se.instance||(se.instance=new se),se.instance}get unreadCount(){return this._unreadCount??0}get inboxDataSet(){return this._inboxDataSet??{messages:[],canPaginate:!1,paginationCursor:null}}get archiveDataSet(){return this._archiveDataSet??{messages:[],canPaginate:!1,paginationCursor:null}}addDataStoreListener(i){this._dataStoreListeners.push(i)}removeDataStoreListener(i){this._dataStoreListeners=this._dataStoreListeners.filter(e=>e!==i)}async fetchDataSet(i){var t,s,o,n,h,d,c,u,g,p;if(i.canUseCache)switch(i.feedType){case"inbox":if(this._inboxDataSet)return this._inboxDataSet;break;case"archive":if(this._archiveDataSet)return this._archiveDataSet;break}const e=i.feedType==="inbox"?await((t=f.Courier.shared.client)==null?void 0:t.inbox.getMessages()):await((s=f.Courier.shared.client)==null?void 0:s.inbox.getArchivedMessages());return{messages:((n=(o=e==null?void 0:e.data)==null?void 0:o.messages)==null?void 0:n.nodes)??[],canPaginate:((c=(d=(h=e==null?void 0:e.data)==null?void 0:h.messages)==null?void 0:d.pageInfo)==null?void 0:c.hasNextPage)??!1,paginationCursor:((p=(g=(u=e==null?void 0:e.data)==null?void 0:u.messages)==null?void 0:g.pageInfo)==null?void 0:p.startCursor)??null}}async fetchUnreadCount(i){var t;return i.canUseCache&&this._unreadCount!==void 0?this._unreadCount:await((t=f.Courier.shared.client)==null?void 0:t.inbox.getUnreadMessageCount())??0}async load(i){var e,t,s;try{if(!((e=f.Courier.shared.client)!=null&&e.options.userId))throw new Error("User is not signed in");const o=i??{feedType:"inbox",canUseCache:!0},[n,h]=await Promise.all([this.fetchDataSet(o),this.fetchUnreadCount(o)]);switch(o.feedType){case"inbox":this._inboxDataSet=n;break;case"archive":this._archiveDataSet=n;break}this._unreadCount=h,this._dataStoreListeners.forEach(d=>{var c,u,g,p;(u=(c=d.events).onDataSetChange)==null||u.call(c,n,o.feedType),(p=(g=d.events).onUnreadCountChange)==null||p.call(g,this._unreadCount??0)}),await this.connectSocket()}catch(o){(s=(t=f.Courier.shared.client)==null?void 0:t.options.logger)==null||s.error("Error loading inbox:",o),this._dataStoreListeners.forEach(n=>{var h,d;(d=(h=n.events).onError)==null||d.call(h,o)})}}async connectSocket(){var e,t,s,o,n,h,d,c,u,g,p,x;const i=(e=f.Courier.shared.client)==null?void 0:e.inbox.socket;try{if(!i){(s=(t=f.Courier.shared.client)==null?void 0:t.options.logger)==null||s.info("CourierInbox socket not available");return}if((h=(o=f.Courier.shared.client)==null?void 0:o.options.logger)==null||h.info("CourierInbox socket connectionId:",(n=f.Courier.shared.client)==null?void 0:n.options.connectionId),i.isConnected){(c=(d=f.Courier.shared.client)==null?void 0:d.options.logger)==null||c.info("CourierInbox socket already connected. Socket will not attempt reconnection.");return}i.receivedMessage=_=>{this.addMessage(_,0,"inbox")},i.receivedMessageEvent=_=>{let b;switch(_.messageId&&(b=this.getMessage({messageId:_.messageId})),_.event){case"mark-all-read":this.readAllMessages();break;case"read":b&&this.readMessage(b,!1);break;case"unread":b&&this.unreadMessage(b,!1);break;case"opened":b&&this.openMessage(b,!1);break;case"archive":b&&this.archiveMessage(b,!1);break;case"click":b&&this.clickMessage(b,!1);break;case"unopened":case"unarchive":break}},await i.connect(),await i.sendSubscribe(),i.keepAlive(),(g=(u=f.Courier.shared.client)==null?void 0:u.options.logger)==null||g.info("CourierInbox socket connected")}catch(_){(x=(p=f.Courier.shared.client)==null?void 0:p.options.logger)==null||x.error("Failed to connect socket:",_)}}getMessage(i){var e,t;return((e=this._inboxDataSet)==null?void 0:e.messages.find(s=>s.messageId===i.messageId))??((t=this._archiveDataSet)==null?void 0:t.messages.find(s=>s.messageId===i.messageId))}async fetchNextPageOfMessages(i){var e,t,s,o,n,h,d,c,u,g,p,x,_,b,v,k,w,S,M,I,T,B,D,F;switch(i.feedType){case"inbox":if(this.isPaginatingInbox)return null;if((e=this._inboxDataSet)!=null&&e.canPaginate&&this._inboxDataSet.paginationCursor)try{this.isPaginatingInbox=!0;const y=await((t=f.Courier.shared.client)==null?void 0:t.inbox.getMessages({paginationLimit:f.Courier.shared.paginationLimit,startCursor:this._inboxDataSet.paginationCursor})),P={messages:((o=(s=y==null?void 0:y.data)==null?void 0:s.messages)==null?void 0:o.nodes)??[],canPaginate:((d=(h=(n=y==null?void 0:y.data)==null?void 0:n.messages)==null?void 0:h.pageInfo)==null?void 0:d.hasNextPage)??!1,paginationCursor:((g=(u=(c=y==null?void 0:y.data)==null?void 0:c.messages)==null?void 0:u.pageInfo)==null?void 0:g.startCursor)??null};return this.addPage(P,"inbox"),P}catch(y){return(x=(p=f.Courier.shared.client)==null?void 0:p.options.logger)==null||x.error("Error fetching next page of inbox messages:",y),null}finally{this.isPaginatingInbox=!1}break;case"archive":if(this.isPaginatingArchive)return null;if((_=this._archiveDataSet)!=null&&_.canPaginate&&this._archiveDataSet.paginationCursor)try{this.isPaginatingArchive=!0;const y=await((b=f.Courier.shared.client)==null?void 0:b.inbox.getArchivedMessages({paginationLimit:f.Courier.shared.paginationLimit,startCursor:this._archiveDataSet.paginationCursor})),P={messages:((k=(v=y==null?void 0:y.data)==null?void 0:v.messages)==null?void 0:k.nodes)??[],canPaginate:((M=(S=(w=y==null?void 0:y.data)==null?void 0:w.messages)==null?void 0:S.pageInfo)==null?void 0:M.hasNextPage)??!1,paginationCursor:((B=(T=(I=y==null?void 0:y.data)==null?void 0:I.messages)==null?void 0:T.pageInfo)==null?void 0:B.startCursor)??null};return this.addPage(P,"archive"),P}catch(y){return(F=(D=f.Courier.shared.client)==null?void 0:D.options.logger)==null||F.error("Error fetching next page of archived messages:",y),null}finally{this.isPaginatingArchive=!1}break}return null}applyLocalMessageChange(i,e){for(const[t,s]of Object.entries(e))s!==void 0&&this.updateMessage(i,s,t)}async readMessage(i,e=!0){var o,n,h,d;if(!f.Courier.shared.client)return;const t=i;if(t.read)return;const s={inbox:(o=this._inboxDataSet)==null?void 0:o.messages.findIndex(c=>c.messageId===i.messageId),archive:(n=this._archiveDataSet)==null?void 0:n.messages.findIndex(c=>c.messageId===i.messageId)};try{i.read=new Date().toISOString(),this.applyLocalMessageChange(i,s),e&&await f.Courier.shared.client.inbox.read({messageId:i.messageId})}catch(c){this.applyLocalMessageChange(t,s),(d=(h=f.Courier.shared.client)==null?void 0:h.options.logger)==null||d.error("Error reading message:",c)}}async unreadMessage(i,e=!0){var o,n,h,d;if(!f.Courier.shared.client)return;const t=i;if(!t.read)return;const s={inbox:(o=this._inboxDataSet)==null?void 0:o.messages.findIndex(c=>c.messageId===i.messageId),archive:(n=this._archiveDataSet)==null?void 0:n.messages.findIndex(c=>c.messageId===i.messageId)};try{i.read=void 0,this.applyLocalMessageChange(i,s),e&&await f.Courier.shared.client.inbox.unread({messageId:i.messageId})}catch(c){this.applyLocalMessageChange(t,s),(d=(h=f.Courier.shared.client)==null?void 0:h.options.logger)==null||d.error("Error unreading message:",c)}}async openMessage(i,e=!0){var o,n,h,d;if(!f.Courier.shared.client)return;const t=i,s={inbox:(o=this._inboxDataSet)==null?void 0:o.messages.findIndex(c=>c.messageId===i.messageId),archive:(n=this._archiveDataSet)==null?void 0:n.messages.findIndex(c=>c.messageId===i.messageId)};if(!(!s.inbox&&!s.archive)&&!t.opened)try{i.opened=new Date().toISOString(),this.applyLocalMessageChange(i,s),e&&await f.Courier.shared.client.inbox.open({messageId:i.messageId})}catch(c){this.applyLocalMessageChange(t,s),(d=(h=f.Courier.shared.client)==null?void 0:h.options.logger)==null||d.error("Error opening message:",c)}}async clickMessage(i,e=!0){var t,s,o,n;if(f.Courier.shared.client)try{(t=i.trackingIds)!=null&&t.clickTrackingId&&e&&await f.Courier.shared.client.inbox.click({messageId:i.messageId,trackingId:(s=i.trackingIds)==null?void 0:s.clickTrackingId})}catch(h){(n=(o=f.Courier.shared.client)==null?void 0:o.options.logger)==null||n.error("Error clicking message:",h)}}async archiveMessage(i,e=!0){var o,n;if(!f.Courier.shared.client)return;const t=i,s=(o=this._inboxDataSet)==null?void 0:o.messages.findIndex(h=>h.messageId===i.messageId);if(s!==void 0)try{if(this.removeMessage(i,s,"inbox"),(n=this._archiveDataSet)!=null&&n.messages){const h=this.findInsertIndex(i,this._archiveDataSet.messages);i.archived=new Date().toISOString(),this.addMessage(i,h,"archive")}e&&await f.Courier.shared.client.inbox.archive({messageId:i.messageId})}catch{this.addMessage(t,s,"inbox"),i.archived=void 0,this.removeMessage(i,s,"archive")}}async readAllMessages(i=!0){var o,n,h,d;if(!f.Courier.shared.client)return;const e=this._inboxDataSet,t=this._archiveDataSet,s=this._unreadCount;try{(o=this._inboxDataSet)==null||o.messages.forEach(c=>{c.read||(c.read=new Date().toISOString())}),(n=this._archiveDataSet)==null||n.messages.forEach(c=>{c.read||(c.read=new Date().toISOString())}),this._unreadCount=0,this._dataStoreListeners.forEach(c=>{var u,g,p,x,_,b;this._inboxDataSet&&((g=(u=c.events).onDataSetChange)==null||g.call(u,this._inboxDataSet,"inbox")),this._archiveDataSet&&((x=(p=c.events).onDataSetChange)==null||x.call(p,this._archiveDataSet,"archive")),(b=(_=c.events).onUnreadCountChange)==null||b.call(_,this._unreadCount)}),i&&await f.Courier.shared.client.inbox.readAll()}catch(c){(d=(h=f.Courier.shared.client)==null?void 0:h.options.logger)==null||d.error("Error reading all messages:",c),this._inboxDataSet&&e&&(this._inboxDataSet.messages=e.messages),this._archiveDataSet&&t&&(this._archiveDataSet.messages=t.messages),this._unreadCount=s,this._dataStoreListeners.forEach(u=>{var g,p,x,_,b,v;this._inboxDataSet&&((p=(g=u.events).onDataSetChange)==null||p.call(g,this._inboxDataSet,"inbox")),this._archiveDataSet&&((_=(x=u.events).onDataSetChange)==null||_.call(x,this._archiveDataSet,"archive")),(v=(b=u.events).onUnreadCountChange)==null||v.call(b,this._unreadCount)})}}findInsertIndex(i,e){const t=[...e];t.push(i),t.sort((o,n)=>{const h=new Date(o.created??Date.now()).getTime();return new Date(n.created??Date.now()).getTime()-h});const s=t.findIndex(o=>o.messageId===i.messageId);return Math.max(s-1,0)}addPage(i,e){switch(e){case"inbox":this._inboxDataSet&&(this._inboxDataSet.canPaginate=i.canPaginate,this._inboxDataSet.paginationCursor=i.paginationCursor,this._inboxDataSet.messages=[...this._inboxDataSet.messages,...i.messages]);break;case"archive":this._archiveDataSet&&(this._archiveDataSet.canPaginate=i.canPaginate,this._archiveDataSet.paginationCursor=i.paginationCursor,this._archiveDataSet.messages=[...this._archiveDataSet.messages,...i.messages]);break}this._dataStoreListeners.forEach(t=>{var s,o;return(o=(s=t.events).onPageAdded)==null?void 0:o.call(s,i,e)})}addMessage(i,e,t){var s,o;switch(t){case"inbox":!i.read&&this._unreadCount!==void 0&&(this._unreadCount=this._unreadCount+1),(s=this._inboxDataSet)==null||s.messages.splice(e,0,i);break;case"archive":(o=this._archiveDataSet)==null||o.messages.splice(e,0,i);break}this._dataStoreListeners.forEach(n=>{var h,d,c,u;(d=(h=n.events).onMessageAdd)==null||d.call(h,i,e,t),(u=(c=n.events).onUnreadCountChange)==null||u.call(c,this._unreadCount??0)})}removeMessage(i,e,t){var s,o;switch(t){case"inbox":!i.read&&this._unreadCount!==void 0&&(this._unreadCount=this._unreadCount-1),(s=this._inboxDataSet)==null||s.messages.splice(e,1);break;case"archive":(o=this._archiveDataSet)==null||o.messages.splice(e,1);break}this._dataStoreListeners.forEach(n=>{var h,d,c,u;(d=(h=n.events).onMessageRemove)==null||d.call(h,i,e,t),(u=(c=n.events).onUnreadCountChange)==null||u.call(c,this._unreadCount??0)})}updateMessage(i,e,t){switch(t){case"inbox":this._unreadCount!==void 0&&!i.archived&&(i.read&&(this._unreadCount=Math.max(0,this._unreadCount-1)),i.read||(this._unreadCount=this._unreadCount+1)),this._inboxDataSet&&(this._inboxDataSet.messages[e]=i);break;case"archive":this._archiveDataSet&&(this._archiveDataSet.messages[e]=i);break}this._dataStoreListeners.forEach(s=>{var o,n,h,d;(n=(o=s.events).onMessageUpdate)==null||n.call(o,i,e,t),(d=(h=s.events).onUnreadCountChange)==null||d.call(h,this._unreadCount??0)})}};a(se,"instance");let A=se;function Do(m){return A.shared.readMessage(m)}function Fo(m){return A.shared.unreadMessage(m)}function Ho(m){return A.shared.clickMessage(m)}function Ro(m){return A.shared.archiveMessage(m)}function zo(m){return A.shared.openMessage(m)}function We(m){if(!m.created)return"Now";const i=new Date,e=new Date(m.created),t=Math.floor((i.getTime()-e.getTime())/1e3);return t<60?`${t}s`:t<3600?`${Math.floor(t/60)}m`:t<86400?`${Math.floor(t/3600)}h`:t<604800?`${Math.floor(t/86400)}d`:t<31536e3?`${Math.floor(t/604800)}w`:`${Math.floor(t/31536e3)}y`}class Ge extends HTMLElement{constructor(e){super();a(this,"_theme");a(this,"_options",[]);a(this,"_style");this._theme=e;const t=this.attachShadow({mode:"open"});this._style=document.createElement("style"),this._style.textContent=this.getStyles(),t.appendChild(this._style);const s=document.createElement("ul");s.className="menu",t.appendChild(s)}getStyles(){var t,s,o;const e=(o=(s=(t=this._theme.inbox)==null?void 0:t.list)==null?void 0:s.item)==null?void 0:o.menu;return`
|
|
187
|
+
:host {
|
|
188
|
+
display: block;
|
|
189
|
+
position: absolute;
|
|
190
|
+
background: ${(e==null?void 0:e.backgroundColor)??"red"};
|
|
191
|
+
border: ${(e==null?void 0:e.border)??"1px solid red"};
|
|
192
|
+
border-radius: ${(e==null?void 0:e.borderRadius)??"0px"};
|
|
193
|
+
box-shadow: ${(e==null?void 0:e.shadow)??"0 2px 8px red"};
|
|
194
|
+
user-select: none;
|
|
195
|
+
opacity: 0;
|
|
196
|
+
pointer-events: none;
|
|
197
|
+
transition: opacity 0.15s;
|
|
198
|
+
overflow: hidden;
|
|
199
|
+
}
|
|
200
|
+
|
|
201
|
+
:host(.visible) {
|
|
202
|
+
opacity: 1;
|
|
203
|
+
pointer-events: auto;
|
|
204
|
+
}
|
|
205
|
+
|
|
206
|
+
ul.menu {
|
|
207
|
+
list-style: none;
|
|
208
|
+
margin: 0;
|
|
209
|
+
padding: 0;
|
|
210
|
+
display: flex;
|
|
211
|
+
flex-direction: row;
|
|
212
|
+
}
|
|
213
|
+
|
|
214
|
+
li.menu-item {
|
|
215
|
+
display: flex;
|
|
216
|
+
align-items: center;
|
|
217
|
+
justify-content: center;
|
|
218
|
+
cursor: pointer;
|
|
219
|
+
border-bottom: none;
|
|
220
|
+
background: transparent;
|
|
221
|
+
}
|
|
222
|
+
`}setOptions(e){this._options=e,this.renderMenu()}renderMenu(){var o,n,h,d;const e=(o=this.shadowRoot)==null?void 0:o.querySelector("ul.menu");if(!e)return;e.innerHTML="";const t=(d=(h=(n=this._theme.inbox)==null?void 0:n.list)==null?void 0:h.item)==null?void 0:d.menu,s=c=>{c.stopPropagation(),c.preventDefault()};this._options.forEach(c=>{var p,x,_;const u=new re(c.icon.svg,c.icon.color,t==null?void 0:t.backgroundColor,(p=t==null?void 0:t.item)==null?void 0:p.hoverBackgroundColor,(x=t==null?void 0:t.item)==null?void 0:x.activeBackgroundColor,(_=t==null?void 0:t.item)==null?void 0:_.borderRadius),g=b=>{s(b),c.onClick()};u.addEventListener("click",g),u.addEventListener("touchstart",s),u.addEventListener("touchend",g),u.addEventListener("touchmove",s),u.addEventListener("mousedown",s),u.addEventListener("mouseup",s),e.appendChild(u)})}show(){this.classList.add("visible")}hide(){this.classList.remove("visible")}}customElements.get("courier-list-item-menu")||customElements.define("courier-list-item-menu",Ge);class De extends HTMLElement{constructor(e){super();a(this,"_theme");a(this,"_message",null);a(this,"_feedType","inbox");a(this,"_isMobile",!1);a(this,"_titleElement");a(this,"_subtitleElement");a(this,"_timeElement");a(this,"_style");a(this,"_menu");a(this,"_unreadIndicator");a(this,"_actionsContainer");a(this,"_longPressTimeout",null);a(this,"_isLongPress",!1);a(this,"onItemClick",null);a(this,"onItemLongPress",null);a(this,"onItemActionClick",null);this._theme=e,this._isMobile="ontouchstart"in window;const t=this.attachShadow({mode:"open"}),s=document.createElement("div");s.className="content-container",this._titleElement=document.createElement("p"),this._titleElement.setAttribute("part","title"),this._subtitleElement=document.createElement("p"),this._subtitleElement.setAttribute("part","subtitle"),this._actionsContainer=document.createElement("div"),this._actionsContainer.className="actions-container",s.appendChild(this._titleElement),s.appendChild(this._subtitleElement),s.appendChild(this._actionsContainer),this._timeElement=document.createElement("p"),this._timeElement.setAttribute("part","time"),this._unreadIndicator=document.createElement("div"),this._unreadIndicator.className="unread-indicator",this._style=document.createElement("style"),this._refreshStyles(),this._menu=new Ge(this._theme),this._menu.setOptions(this._getMenuOptions()),t.append(this._style,this._unreadIndicator,s,this._timeElement,this._menu);const o=n=>{n.stopPropagation(),n.preventDefault()};this._menu.addEventListener("mousedown",o),this._menu.addEventListener("pointerdown",o),this._menu.addEventListener("click",o),this.addEventListener("click",n=>{this._menu.contains(n.target)||n.composedPath().includes(this._menu)||this._message&&this.onItemClick&&!(n.target instanceof ie)&&!this._isLongPress&&this.onItemClick(this._message)}),this._setupHoverBehavior(),this._setupLongPressBehavior()}_setupHoverBehavior(){this._isMobile||(this.addEventListener("mouseenter",()=>{this._isLongPress=!1,this._showMenu()}),this.addEventListener("mouseleave",()=>this._hideMenu()))}_setupLongPressBehavior(){var s,o,n;const e=(n=(o=(s=this._theme.inbox)==null?void 0:s.list)==null?void 0:o.item)==null?void 0:n.menu;if(!(e!=null&&e.enabled))return;const t=e.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((t==null?void 0:t.vibrationDuration)??50)),setTimeout(()=>{this._hideMenu(),this._isLongPress=!1},(t==null?void 0:t.displayDuration)??2e3)},650)},{passive:!0}),this.addEventListener("touchend",()=>{this._longPressTimeout&&(window.clearTimeout(this._longPressTimeout),this._longPressTimeout=null)})}setOnLongPress(e){this.onItemLongPress=e}_getMenuOptions(){var s,o,n,h,d,c,u,g,p,x,_,b,v,k,w,S,M,I,T;const e=(h=(n=(o=(s=this._theme.inbox)==null?void 0:s.list)==null?void 0:o.item)==null?void 0:n.menu)==null?void 0:h.item;let t=[];return(d=this._message)!=null&&d.archived||t.push({id:(c=this._message)!=null&&c.read?"unread":"read",icon:{svg:(u=this._message)!=null&&u.read?(g=e==null?void 0:e.unread)==null?void 0:g.svg:(p=e==null?void 0:e.read)==null?void 0:p.svg,color:(x=this._message)!=null&&x.read?(_=e==null?void 0:e.unread)==null?void 0:_.color:((b=e==null?void 0:e.read)==null?void 0:b.color)??"red"},onClick:()=>{this._message&&(this._message.read?A.shared.unreadMessage(this._message):A.shared.readMessage(this._message))}}),t.push({id:(v=this._message)!=null&&v.archived?"unarchive":"archive",icon:{svg:(k=this._message)!=null&&k.archived?(w=e==null?void 0:e.unarchive)==null?void 0:w.svg:(S=e==null?void 0:e.archive)==null?void 0:S.svg,color:(M=this._message)!=null&&M.archived?(I=e==null?void 0:e.unarchive)==null?void 0:I.color:((T=e==null?void 0:e.archive)==null?void 0:T.color)??"red"},onClick:()=>{this._message&&(this._message.archived?alert("unarchive"):A.shared.archiveMessage(this._message))}}),t}_showMenu(){var t,s,o;const e=(o=(s=(t=this._theme.inbox)==null?void 0:t.list)==null?void 0:s.item)==null?void 0:o.menu;e&&e.enabled&&(this._menu.setOptions(this._getMenuOptions()),this._menu.style.display="block",this._menu.show(),this._timeElement.style.opacity="0")}_hideMenu(){var t,s,o;const e=(o=(s=(t=this._theme.inbox)==null?void 0:t.list)==null?void 0:s.item)==null?void 0:o.menu;e&&e.enabled&&(this._menu.hide(),this._menu.style.display="none",this._timeElement.style.opacity="1")}_getStyles(){var t,s,o,n,h,d,c,u,g,p,x;const e=(s=(t=this._theme.inbox)==null?void 0:t.list)==null?void 0:s.item;return`
|
|
223
|
+
:host {
|
|
224
|
+
display: flex;
|
|
225
|
+
flex-direction: row;
|
|
226
|
+
align-items: flex-start;
|
|
227
|
+
justify-content: space-between;
|
|
228
|
+
border-bottom: ${(e==null?void 0:e.divider)??"1px solid red"};
|
|
229
|
+
font-family: inherit;
|
|
230
|
+
cursor: pointer;
|
|
231
|
+
transition: background-color 0.2s ease;
|
|
232
|
+
margin: 0;
|
|
233
|
+
width: 100%;
|
|
234
|
+
box-sizing: border-box;
|
|
235
|
+
padding: 12px 20px;
|
|
236
|
+
position: relative;
|
|
237
|
+
background-color: ${(e==null?void 0:e.backgroundColor)??"transparent"};
|
|
238
|
+
user-select: none;
|
|
239
|
+
-webkit-user-select: none;
|
|
240
|
+
-moz-user-select: none;
|
|
241
|
+
-ms-user-select: none;
|
|
242
|
+
touch-action: manipulation;
|
|
243
|
+
}
|
|
244
|
+
|
|
245
|
+
/* ───────────────────────── Base hover / active ────────────────── */
|
|
246
|
+
@media (hover: hover) {
|
|
247
|
+
:host(:hover) {
|
|
248
|
+
background-color: ${(e==null?void 0:e.hoverBackgroundColor)??"red"};
|
|
249
|
+
}
|
|
250
|
+
}
|
|
251
|
+
:host(:active) {
|
|
252
|
+
background-color: ${(e==null?void 0:e.activeBackgroundColor)??"red"};
|
|
253
|
+
}
|
|
254
|
+
|
|
255
|
+
/* ───────────────────────── Menu hover / active ────────────────── */
|
|
256
|
+
@media (hover: hover) {
|
|
257
|
+
:host(:hover):has(courier-list-item-menu:hover, courier-list-item-menu *:hover, courier-button:hover, courier-button *:hover) {
|
|
258
|
+
background-color: ${(e==null?void 0:e.backgroundColor)??"transparent"};
|
|
259
|
+
}
|
|
260
|
+
}
|
|
261
|
+
:host(:active):has(courier-list-item-menu:active, courier-list-item-menu *:active, courier-button:active, courier-button *:active) {
|
|
262
|
+
background-color: ${(e==null?void 0:e.backgroundColor)??"transparent"};
|
|
263
|
+
}
|
|
264
|
+
|
|
265
|
+
:host(:last-child) {
|
|
266
|
+
border-bottom: none;
|
|
267
|
+
}
|
|
268
|
+
|
|
269
|
+
.unread-indicator {
|
|
270
|
+
position: absolute;
|
|
271
|
+
top: 28px;
|
|
272
|
+
left: 6px;
|
|
273
|
+
width: 8px;
|
|
274
|
+
height: 8px;
|
|
275
|
+
border-radius: 50%;
|
|
276
|
+
background-color: ${(e==null?void 0:e.unreadIndicatorColor)??"red"};
|
|
277
|
+
display: none;
|
|
278
|
+
}
|
|
279
|
+
|
|
280
|
+
:host(.unread) .unread-indicator {
|
|
281
|
+
display: block;
|
|
282
|
+
}
|
|
283
|
+
|
|
284
|
+
.content-container {
|
|
285
|
+
flex: 1;
|
|
286
|
+
display: flex;
|
|
287
|
+
flex-direction: column;
|
|
288
|
+
margin-right: 12px;
|
|
289
|
+
}
|
|
290
|
+
|
|
291
|
+
p {
|
|
292
|
+
margin: 0;
|
|
293
|
+
overflow-wrap: break-word;
|
|
294
|
+
word-break: break-word;
|
|
295
|
+
hyphens: auto;
|
|
296
|
+
line-height: 1.4;
|
|
297
|
+
user-select: none;
|
|
298
|
+
-webkit-user-select: none;
|
|
299
|
+
-moz-user-select: none;
|
|
300
|
+
-ms-user-select: none;
|
|
301
|
+
text-align: left;
|
|
302
|
+
}
|
|
303
|
+
|
|
304
|
+
p[part='title'] {
|
|
305
|
+
font-family: ${((o=e==null?void 0:e.title)==null?void 0:o.family)??"inherit"};
|
|
306
|
+
font-size: ${((n=e==null?void 0:e.title)==null?void 0:n.size)??"14px"};
|
|
307
|
+
color: ${((h=e==null?void 0:e.title)==null?void 0:h.color)??"red"};
|
|
308
|
+
margin-bottom: 4px;
|
|
309
|
+
}
|
|
310
|
+
|
|
311
|
+
p[part='subtitle'] {
|
|
312
|
+
font-family: ${((d=e==null?void 0:e.subtitle)==null?void 0:d.family)??"inherit"};
|
|
313
|
+
font-size: ${((c=e==null?void 0:e.subtitle)==null?void 0:c.size)??"14px"};
|
|
314
|
+
color: ${((u=e==null?void 0:e.subtitle)==null?void 0:u.color)??"red"};
|
|
315
|
+
}
|
|
316
|
+
|
|
317
|
+
p[part='time'] {
|
|
318
|
+
font-family: ${((g=e==null?void 0:e.time)==null?void 0:g.family)??"inherit"};
|
|
319
|
+
font-size: ${((p=e==null?void 0:e.time)==null?void 0:p.size)??"14px"};
|
|
320
|
+
color: ${((x=e==null?void 0:e.time)==null?void 0:x.color)??"red"};
|
|
321
|
+
text-align: right;
|
|
322
|
+
white-space: nowrap;
|
|
323
|
+
}
|
|
324
|
+
|
|
325
|
+
courier-list-item-menu {
|
|
326
|
+
z-index: 1;
|
|
327
|
+
position: absolute;
|
|
328
|
+
top: 8px;
|
|
329
|
+
right: 8px;
|
|
330
|
+
display: none; /* becomes block while visible */
|
|
331
|
+
}
|
|
332
|
+
|
|
333
|
+
.actions-container {
|
|
334
|
+
display: flex;
|
|
335
|
+
margin-top: 10px;
|
|
336
|
+
flex-wrap: wrap;
|
|
337
|
+
flex-direction: row;
|
|
338
|
+
align-items: center;
|
|
339
|
+
gap: 8px;
|
|
340
|
+
display: none;
|
|
341
|
+
}
|
|
342
|
+
|
|
343
|
+
`}_refreshStyles(){this._style.textContent=this._getStyles()}connectedCallback(){var s,o;const e=this.getAttribute("message"),t=this.getAttribute("feed-type");if(t&&(this._feedType=t),e)try{this._message=JSON.parse(e),this._updateContent()}catch(n){(o=(s=f.Courier.shared.client)==null?void 0:s.options.logger)==null||o.error("CourierListItem – failed to parse message:",n)}}setMessage(e,t){this._message=e,this._feedType=t,this._updateContent()}setOnItemClick(e){this.onItemClick=e}setOnItemActionClick(e){this.onItemActionClick=e}setOnItemLongPress(e){this.onItemLongPress=e}_updateContent(){var s,o,n,h,d,c;if(!this._message){this._titleElement.textContent="",this._subtitleElement.textContent="";return}this.classList.toggle("unread",!this._message.read&&this._feedType!=="archive"),this._titleElement.textContent=this._message.title||"Untitled Message",this._subtitleElement.textContent=this._message.preview||this._message.body||"",this._timeElement.textContent=We(this._message),this._menu.setOptions(this._getMenuOptions());const e=((s=this._message)==null?void 0:s.actions)&&this._message.actions.length>0;this._actionsContainer.style.display=e?"flex":"none";const t=(h=(n=(o=this._theme.inbox)==null?void 0:o.list)==null?void 0:n.item)==null?void 0:h.actions;(c=(d=this._message)==null?void 0:d.actions)==null||c.forEach(u=>{var p,x,_,b;const g=new Ie({text:u.content,variant:"secondary",backgroundColor:t==null?void 0:t.backgroundColor,hoverBackgroundColor:t==null?void 0:t.hoverBackgroundColor,activeBackgroundColor:t==null?void 0:t.activeBackgroundColor,border:t==null?void 0:t.border,borderRadius:t==null?void 0:t.borderRadius,shadow:t==null?void 0:t.shadow,fontFamily:(p=t==null?void 0:t.font)==null?void 0:p.family,fontSize:(x=t==null?void 0:t.font)==null?void 0:x.size,fontWeight:(_=t==null?void 0:t.font)==null?void 0:_.weight,textColor:(b=t==null?void 0:t.font)==null?void 0:b.color,onClick:()=>{this._message&&this.onItemActionClick&&this.onItemActionClick(this._message,u)}});this._actionsContainer.appendChild(g)})}}customElements.get("courier-list-item")||customElements.define("courier-list-item",De);class qe extends HTMLElement{constructor(e,t){super();a(this,"_shadow");this._shadow=this.attachShadow({mode:"open"});const s=document.createElement("style");s.textContent=this.getStyles(t),this._shadow.appendChild(s);const o=new Be(e,35),n=new Be(e,100),h=new Be(e,82);this._shadow.appendChild(o),this._shadow.appendChild(n),this._shadow.appendChild(h)}getStyles(e){return`
|
|
344
|
+
:host {
|
|
345
|
+
display: flex;
|
|
346
|
+
flex-direction: column;
|
|
347
|
+
gap: 12px;
|
|
348
|
+
padding: 12px;
|
|
349
|
+
width: 100%;
|
|
350
|
+
box-sizing: border-box;
|
|
351
|
+
opacity: ${e};
|
|
352
|
+
}
|
|
353
|
+
`}}customElements.get("courier-inbox-skeleton-list-item")||customElements.define("courier-inbox-skeleton-list-item",qe);class Be extends HTMLElement{constructor(e,t){super();a(this,"_shadow");this._shadow=this.attachShadow({mode:"open"});const s=document.createElement("style");s.textContent=this.getStyles(e,t),this._shadow.appendChild(s);const o=document.createElement("div");o.className="skeleton-item",this._shadow.appendChild(o)}getStyles(e,t){var g,p,x,_,b,v,k,w,S,M,I,T;const s=((x=(p=(g=e.inbox)==null?void 0:g.loading)==null?void 0:p.animation)==null?void 0:x.barColor)??"#000",o=s.length===4?`#${s[1]}${s[1]}${s[2]}${s[2]}${s[3]}${s[3]}`:s,n=parseInt(o.slice(1,3),16),h=parseInt(o.slice(3,5),16),d=parseInt(o.slice(5,7),16),c=`rgba(${n}, ${h}, ${d}, 0.8)`,u=`rgba(${n}, ${h}, ${d}, 0.4)`;return`
|
|
354
|
+
:host {
|
|
355
|
+
display: flex;
|
|
356
|
+
height: 100%;
|
|
357
|
+
width: ${t}%;
|
|
358
|
+
align-items: flex-start;
|
|
359
|
+
justify-content: flex-start;
|
|
360
|
+
}
|
|
361
|
+
|
|
362
|
+
.skeleton-item {
|
|
363
|
+
height: ${((v=(b=(_=e.inbox)==null?void 0:_.loading)==null?void 0:b.animation)==null?void 0:v.barHeight)??"14px"};
|
|
364
|
+
width: 100%;
|
|
365
|
+
background: linear-gradient(
|
|
366
|
+
90deg,
|
|
367
|
+
${c} 25%,
|
|
368
|
+
${u} 50%,
|
|
369
|
+
${c} 75%
|
|
370
|
+
);
|
|
371
|
+
background-size: 200% 100%;
|
|
372
|
+
animation: shimmer ${((S=(w=(k=e.inbox)==null?void 0:k.loading)==null?void 0:w.animation)==null?void 0:S.duration)??"2s"} ease-in-out infinite;
|
|
373
|
+
border-radius: ${((T=(I=(M=e.inbox)==null?void 0:M.loading)==null?void 0:I.animation)==null?void 0:T.barBorderRadius)??"14px"};
|
|
374
|
+
}
|
|
375
|
+
|
|
376
|
+
@keyframes shimmer {
|
|
377
|
+
0% {
|
|
378
|
+
background-position: 200% 0;
|
|
379
|
+
}
|
|
380
|
+
100% {
|
|
381
|
+
background-position: -200% 0;
|
|
382
|
+
}
|
|
383
|
+
}
|
|
384
|
+
`}}customElements.get("courier-skeleton-animated-row")||customElements.define("courier-skeleton-animated-row",Be);class Fe extends Te{constructor(e){super();a(this,"_theme");this._theme=e}defaultElement(){const e=document.createElement("div");e.className="list";const t=document.createElement("style");t.textContent=this.getStyles(),e.appendChild(t);for(let s=0;s<3;s++){const o=new qe(this._theme,1/(s+1));e.appendChild(o)}return this.shadow.appendChild(e),e}getStyles(){var e,t;return`
|
|
385
|
+
:host {
|
|
386
|
+
display: flex;
|
|
387
|
+
height: 100%;
|
|
388
|
+
width: 100%;
|
|
389
|
+
align-items: flex-start;
|
|
390
|
+
justify-content: flex-start;
|
|
391
|
+
overflow: hidden;
|
|
392
|
+
}
|
|
393
|
+
|
|
394
|
+
.list {
|
|
395
|
+
display: flex;
|
|
396
|
+
flex-direction: column;
|
|
397
|
+
gap: 8px;
|
|
398
|
+
width: 100%;
|
|
399
|
+
overflow: hidden;
|
|
400
|
+
}
|
|
401
|
+
|
|
402
|
+
.list > * {
|
|
403
|
+
border-bottom: ${((t=(e=this._theme.inbox)==null?void 0:e.loading)==null?void 0:t.divider)??"1px solid red"};
|
|
404
|
+
}
|
|
405
|
+
|
|
406
|
+
.list > *:last-child {
|
|
407
|
+
border-bottom: none;
|
|
408
|
+
}
|
|
409
|
+
`}}customElements.get("courier-inbox-skeleton-list")||customElements.define("courier-inbox-skeleton-list",Fe);class Xe extends HTMLElement{constructor(e){super();a(this,"skeletonLoadingList");a(this,"observer");a(this,"customItem");a(this,"onPaginationTrigger");this.onPaginationTrigger=e.onPaginationTrigger,this.customItem=e.customItem;const t=this.attachShadow({mode:"open"}),s=document.createElement("style");if(s.textContent=this.getStyles(),t.appendChild(s),this.customItem)t.appendChild(this.customItem);else{const o=document.createElement("div");o.className="skeleton-container",this.skeletonLoadingList=new Fe(e.theme),this.skeletonLoadingList.build(void 0),o.appendChild(this.skeletonLoadingList),t.appendChild(o)}this.observer=new IntersectionObserver(o=>{o.forEach(n=>{n.isIntersecting&&this.onPaginationTrigger()})}),this.observer.observe(this)}getStyles(){return`
|
|
410
|
+
:host {
|
|
411
|
+
padding: 0;
|
|
412
|
+
margin: 0;
|
|
413
|
+
box-sizing: border-box;
|
|
414
|
+
}
|
|
415
|
+
|
|
416
|
+
.skeleton-container {
|
|
417
|
+
height: 150%;
|
|
418
|
+
}
|
|
419
|
+
`}disconnectedCallback(){this.observer.disconnect()}}customElements.get("courier-inbox-pagination-list-item")||customElements.define("courier-inbox-pagination-list-item",Xe);class Ye extends HTMLElement{constructor(e){super();a(this,"_themeSubscription");a(this,"_messages",[]);a(this,"_feedType","inbox");a(this,"_isLoading",!0);a(this,"_error",null);a(this,"_canPaginate",!1);a(this,"_onMessageClick",null);a(this,"_onMessageActionClick",null);a(this,"_onMessageLongPress",null);a(this,"_onRefresh");a(this,"_onPaginationTrigger");a(this,"_listItemFactory");a(this,"_paginationItemFactory");a(this,"_loadingStateFactory");a(this,"_emptyStateFactory");a(this,"_errorStateFactory");this._themeSubscription=e.themeManager.subscribe(o=>{this.refreshTheme()}),this._onRefresh=e.onRefresh,this._onPaginationTrigger=e.onPaginationTrigger,this._onMessageClick=e.onMessageClick,this._onMessageActionClick=e.onMessageActionClick,this._onMessageLongPress=e.onMessageLongPress;const t=this.attachShadow({mode:"open"}),s=document.createElement("style");s.textContent=this.getStyles(),t.appendChild(s)}get messages(){return this._messages}getStyles(){var t;const e=(t=this._themeSubscription.manager.getTheme().inbox)==null?void 0:t.list;return`
|
|
420
|
+
:host {
|
|
421
|
+
flex: 1;
|
|
422
|
+
width: 100%;
|
|
423
|
+
background-color: ${(e==null?void 0:e.backgroundColor)??r.white[500]};
|
|
424
|
+
}
|
|
425
|
+
|
|
426
|
+
ul {
|
|
427
|
+
list-style: none;
|
|
428
|
+
padding: 0;
|
|
429
|
+
margin: 0;
|
|
430
|
+
height: 100%;
|
|
431
|
+
}
|
|
432
|
+
`}reset(){var t,s;for(;(t=this.shadowRoot)!=null&&t.firstChild;)this.shadowRoot.removeChild(this.shadowRoot.firstChild);const e=document.createElement("style");e.textContent=this.getStyles(),(s=this.shadowRoot)==null||s.appendChild(e)}setDataSet(e){this._messages=[...e.messages],this._canPaginate=!!e.canPaginate,this._error=null,this._isLoading=!1,this.render()}addPage(e){this._messages=[...this._messages,...e.messages],this._canPaginate=!!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()}setFeedType(e){this._feedType=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()}render(){var s,o,n,h,d,c,u,g,p,x,_,b,v,k,w,S,M,I,T,B,D,F,y,P,H,R,z,O,N,U,V,Z,j,Y,K,Q,J,q,ae,he,ce,le,de,ue,pe,ge,me,be,_e,fe,xe,Ce,ve,ye,ke,we,Se,Me;this.reset();const e=this._themeSubscription.manager.getTheme();if(this._error){const l=(s=e.inbox)==null?void 0:s.error,$=new Le({title:{text:((o=l==null?void 0:l.title)==null?void 0:o.text)??this._error.message,textColor:(h=(n=l==null?void 0:l.title)==null?void 0:n.font)==null?void 0:h.color,fontFamily:(c=(d=l==null?void 0:l.title)==null?void 0:d.font)==null?void 0:c.family,fontSize:(g=(u=l==null?void 0:l.title)==null?void 0:u.font)==null?void 0:g.size,fontWeight:(x=(p=l==null?void 0:l.title)==null?void 0:p.font)==null?void 0:x.weight},button:{text:(_=l==null?void 0:l.button)==null?void 0:_.text,backgroundColor:(b=l==null?void 0:l.button)==null?void 0:b.backgroundColor,hoverBackgroundColor:(v=l==null?void 0:l.button)==null?void 0:v.hoverBackgroundColor,activeBackgroundColor:(k=l==null?void 0:l.button)==null?void 0:k.activeBackgroundColor,textColor:(S=(w=l==null?void 0:l.button)==null?void 0:w.font)==null?void 0:S.color,fontFamily:(I=(M=l==null?void 0:l.button)==null?void 0:M.font)==null?void 0:I.family,fontSize:(B=(T=l==null?void 0:l.button)==null?void 0:T.font)==null?void 0:B.size,fontWeight:(F=(D=l==null?void 0:l.button)==null?void 0:D.font)==null?void 0:F.weight,shadow:(y=l==null?void 0:l.button)==null?void 0:y.shadow,border:(P=l==null?void 0:l.button)==null?void 0:P.border,borderRadius:(H=l==null?void 0:l.button)==null?void 0:H.borderRadius}});$.build((R=this._errorStateFactory)==null?void 0:R.call(this,{feedType:this._feedType,error:this._error})),$.setButtonClickCallback(()=>this.handleRetry()),(z=this.shadowRoot)==null||z.appendChild($);return}if(this._isLoading){const l=new Fe(e);l.build((O=this._loadingStateFactory)==null?void 0:O.call(this,{feedType:this._feedType})),(N=this.shadowRoot)==null||N.appendChild(l);return}if(this._messages.length===0){const l=(U=e.inbox)==null?void 0:U.empty,$=new Le({title:{text:((V=l==null?void 0:l.title)==null?void 0:V.text)??`No ${this._feedType} messages yet`,textColor:(j=(Z=l==null?void 0:l.title)==null?void 0:Z.font)==null?void 0:j.color,fontFamily:(K=(Y=l==null?void 0:l.title)==null?void 0:Y.font)==null?void 0:K.family,fontSize:(J=(Q=l==null?void 0:l.title)==null?void 0:Q.font)==null?void 0:J.size,fontWeight:(ae=(q=l==null?void 0:l.title)==null?void 0:q.font)==null?void 0:ae.weight},button:{text:(he=l==null?void 0:l.button)==null?void 0:he.text,backgroundColor:(ce=l==null?void 0:l.button)==null?void 0:ce.backgroundColor,hoverBackgroundColor:(le=l==null?void 0:l.button)==null?void 0:le.hoverBackgroundColor,activeBackgroundColor:(de=l==null?void 0:l.button)==null?void 0:de.activeBackgroundColor,textColor:(pe=(ue=l==null?void 0:l.button)==null?void 0:ue.font)==null?void 0:pe.color,fontFamily:(me=(ge=l==null?void 0:l.button)==null?void 0:ge.font)==null?void 0:me.family,fontSize:(_e=(be=l==null?void 0:l.button)==null?void 0:be.font)==null?void 0:_e.size,fontWeight:(xe=(fe=l==null?void 0:l.button)==null?void 0:fe.font)==null?void 0:xe.weight,shadow:(Ce=l==null?void 0:l.button)==null?void 0:Ce.shadow,border:(ve=l==null?void 0:l.button)==null?void 0:ve.border,borderRadius:(ye=l==null?void 0:l.button)==null?void 0:ye.borderRadius}});$.build((ke=this._emptyStateFactory)==null?void 0:ke.call(this,{feedType:this._feedType})),$.setButtonClickCallback(()=>this.handleRefresh()),(we=this.shadowRoot)==null||we.appendChild($);return}const t=document.createElement("ul");if((Se=this.shadowRoot)==null||Se.appendChild(t),this._messages.forEach((l,$)=>{if(this._listItemFactory){t.appendChild(this._listItemFactory({message:l,index:$}));return}const ee=new De(e);ee.setMessage(l,this._feedType),ee.setOnItemClick(te=>{var W;return(W=this._onMessageClick)==null?void 0:W.call(this,te,$)}),ee.setOnItemActionClick((te,W)=>{var Ee;return(Ee=this._onMessageActionClick)==null?void 0:Ee.call(this,te,W,$)}),ee.setOnItemLongPress(te=>{var W;return(W=this._onMessageLongPress)==null?void 0:W.call(this,te,$)}),t.appendChild(ee)}),this._canPaginate){const l=new Xe({theme:e,customItem:(Me=this._paginationItemFactory)==null?void 0:Me.call(this,{feedType:this._feedType}),onPaginationTrigger:()=>{var $;return($=this._onPaginationTrigger)==null?void 0:$.call(this,this._feedType)}});t.appendChild(l)}}setLoadingStateFactory(e){this._loadingStateFactory=e,this.render()}setEmptyStateFactory(e){this._emptyStateFactory=e,this.render()}setErrorStateFactory(e){this._errorStateFactory=e,this.render()}setListItemFactory(e){this._listItemFactory=e,this.render()}setPaginationItemFactory(e){this._paginationItemFactory=e,this.render()}refreshTheme(){this.render()}disconnectedCallback(){this._themeSubscription.unsubscribe()}}customElements.get("courier-inbox-list")||customElements.define("courier-inbox-list",Ye);class Ke extends HTMLElement{constructor(e){super();a(this,"_option");a(this,"_isSelected");a(this,"_content");a(this,"_itemIcon");a(this,"_title");a(this,"_selectionIcon");a(this,"_style");a(this,"_themeManager");this._option=e.option,this._isSelected=e.isSelected,this._themeManager=e.themeManager;const t=this.attachShadow({mode:"open"});this._style=document.createElement("style"),this._content=document.createElement("div"),this._content.className="menu-item",this._itemIcon=new ie(this._option.icon.svg??C.inbox),this._itemIcon.setAttribute("size","16"),this._title=document.createElement("p"),this._title.textContent=this._option.text;const s=document.createElement("div");s.className="spacer",this._selectionIcon=new ie(C.check),this._content.appendChild(this._itemIcon),this._content.appendChild(this._title),this._content.appendChild(s),e.selectable&&this._content.appendChild(this._selectionIcon),t.appendChild(this._style),t.appendChild(this._content),this._selectionIcon.style.display=this._isSelected?"block":"none",this.refreshTheme()}getStyles(){var t,s,o,n,h,d,c,u,g,p,x,_,b,v,k,w,S,M,I,T,B,D,F,y,P,H,R,z,O,N,U,V,Z,j;const e=this._themeManager.getTheme();return`
|
|
433
|
+
:host {
|
|
434
|
+
display: flex;
|
|
435
|
+
flex-direction: row;
|
|
436
|
+
padding: 6px 12px;
|
|
437
|
+
cursor: pointer;
|
|
438
|
+
}
|
|
439
|
+
|
|
440
|
+
:host(:hover) {
|
|
441
|
+
background-color: ${((h=(n=(o=(s=(t=e.inbox)==null?void 0:t.header)==null?void 0:s.menus)==null?void 0:o.popup)==null?void 0:n.list)==null?void 0:h.hoverBackgroundColor)??"red"};
|
|
442
|
+
}
|
|
443
|
+
|
|
444
|
+
:host(:active) {
|
|
445
|
+
background-color: ${((p=(g=(u=(c=(d=e.inbox)==null?void 0:d.header)==null?void 0:c.menus)==null?void 0:u.popup)==null?void 0:g.list)==null?void 0:p.activeBackgroundColor)??"red"};
|
|
446
|
+
}
|
|
447
|
+
|
|
448
|
+
.menu-item {
|
|
449
|
+
display: flex;
|
|
450
|
+
align-items: center;
|
|
451
|
+
width: 100%;
|
|
452
|
+
gap: 12px;
|
|
453
|
+
}
|
|
454
|
+
|
|
455
|
+
.spacer {
|
|
456
|
+
flex: 1;
|
|
457
|
+
}
|
|
458
|
+
|
|
459
|
+
p {
|
|
460
|
+
margin: 0;
|
|
461
|
+
font-family: ${((w=(k=(v=(b=(_=(x=e.inbox)==null?void 0:x.header)==null?void 0:_.menus)==null?void 0:b.popup)==null?void 0:v.list)==null?void 0:k.font)==null?void 0:w.family)??"inherit"};
|
|
462
|
+
font-weight: ${((D=(B=(T=(I=(M=(S=e.inbox)==null?void 0:S.header)==null?void 0:M.menus)==null?void 0:I.popup)==null?void 0:T.list)==null?void 0:B.font)==null?void 0:D.weight)??"inherit"};
|
|
463
|
+
font-size: ${((z=(R=(H=(P=(y=(F=e.inbox)==null?void 0:F.header)==null?void 0:y.menus)==null?void 0:P.popup)==null?void 0:H.list)==null?void 0:R.font)==null?void 0:z.size)??"14px"};
|
|
464
|
+
color: ${((j=(Z=(V=(U=(N=(O=e.inbox)==null?void 0:O.header)==null?void 0:N.menus)==null?void 0:U.popup)==null?void 0:V.list)==null?void 0:Z.font)==null?void 0:j.color)??"red"};
|
|
465
|
+
white-space: nowrap;
|
|
466
|
+
}
|
|
467
|
+
|
|
468
|
+
.check-icon {
|
|
469
|
+
display: none;
|
|
470
|
+
}
|
|
471
|
+
`}refreshTheme(){var e,t,s,o;this._style.textContent=this.getStyles(),this._selectionIcon.updateColor(((e=this._option.selectionIcon)==null?void 0:e.color)??"red"),this._selectionIcon.updateSVG(((t=this._option.selectionIcon)==null?void 0:t.svg)??C.check),this._title.textContent=this._option.text??"Missing Text",this._itemIcon.updateColor(((s=this._option.icon)==null?void 0:s.color)??"red"),this._itemIcon.updateSVG(((o=this._option.icon)==null?void 0:o.svg)??C.inbox)}}customElements.get("courier-inbox-filter-menu-item")||customElements.define("courier-inbox-filter-menu-item",Ke);class He extends HTMLElement{constructor(e,t,s,o,n){super();a(this,"_themeSubscription");a(this,"_type");a(this,"_selectedIndex",0);a(this,"_options");a(this,"_selectable");a(this,"_onMenuOpen");a(this,"_menuButton");a(this,"_menu");a(this,"_style");this._type=t,this._selectable=s,this._options=o,this._selectedIndex=0,this._onMenuOpen=n;const h=this.attachShadow({mode:"open"});this._menuButton=new re(t==="filters"?C.filter:C.overflow),this._menu=document.createElement("div"),this._menu.className=`menu ${t}`,this._style=document.createElement("style"),h.appendChild(this._style),h.appendChild(this._menuButton),h.appendChild(this._menu),this._menuButton.addEventListener("click",this.toggleMenu.bind(this)),document.addEventListener("click",this.handleOutsideClick.bind(this)),this._themeSubscription=e.subscribe(d=>{this.refreshTheme()}),this.refreshTheme()}getStyles(){var t,s,o,n,h,d,c,u,g,p,x,_,b,v,k,w,S,M,I,T,B;const e=this._themeSubscription.manager.getTheme();return`
|
|
472
|
+
:host {
|
|
473
|
+
position: relative;
|
|
474
|
+
display: inline-block;
|
|
475
|
+
}
|
|
476
|
+
|
|
477
|
+
.menu {
|
|
478
|
+
display: none;
|
|
479
|
+
position: absolute;
|
|
480
|
+
top: 42px;
|
|
481
|
+
right: -6px;
|
|
482
|
+
border-radius: ${((n=(o=(s=(t=e.inbox)==null?void 0:t.header)==null?void 0:s.menus)==null?void 0:o.popup)==null?void 0:n.borderRadius)??"6px"};
|
|
483
|
+
border: ${((u=(c=(d=(h=e.inbox)==null?void 0:h.header)==null?void 0:d.menus)==null?void 0:c.popup)==null?void 0:u.border)??"1px solid red"};
|
|
484
|
+
background: ${((_=(x=(p=(g=e.inbox)==null?void 0:g.header)==null?void 0:p.menus)==null?void 0:x.popup)==null?void 0:_.backgroundColor)??"red"};
|
|
485
|
+
box-shadow: ${((w=(k=(v=(b=e.inbox)==null?void 0:b.header)==null?void 0:v.menus)==null?void 0:k.popup)==null?void 0:w.shadow)??"0 4px 12px 0 red"};
|
|
486
|
+
z-index: 1000;
|
|
487
|
+
min-width: 200px;
|
|
488
|
+
overflow: hidden;
|
|
489
|
+
padding: 4px 0;
|
|
490
|
+
}
|
|
491
|
+
|
|
492
|
+
courier-inbox-filter-menu-item {
|
|
493
|
+
border-bottom: ${((B=(T=(I=(M=(S=e.inbox)==null?void 0:S.header)==null?void 0:M.menus)==null?void 0:I.popup)==null?void 0:T.list)==null?void 0:B.divider)??"none"};
|
|
494
|
+
}
|
|
495
|
+
|
|
496
|
+
courier-inbox-filter-menu-item:last-child {
|
|
497
|
+
border-bottom: none;
|
|
498
|
+
}
|
|
499
|
+
`}refreshTheme(){var h,d,c,u,g,p;this._style.textContent=this.getStyles();const t=(d=(h=this._themeSubscription.manager.getTheme().inbox)==null?void 0:h.header)==null?void 0:d.menus,s=this._type==="filters",o=s?(c=t==null?void 0:t.filters)==null?void 0:c.button:(u=t==null?void 0:t.actions)==null?void 0:u.button,n=s?C.filter:C.overflow;this._menuButton.updateIconSVG(((g=o==null?void 0:o.icon)==null?void 0:g.svg)??n),this._menuButton.updateIconColor(((p=o==null?void 0:o.icon)==null?void 0:p.color)??"red"),this._menuButton.updateBackgroundColor((o==null?void 0:o.backgroundColor)??"transparent"),this._menuButton.updateHoverBackgroundColor((o==null?void 0:o.hoverBackgroundColor)??"red"),this._menuButton.updateActiveBackgroundColor((o==null?void 0:o.activeBackgroundColor)??"red"),this.refreshMenuItems()}setOptions(e){this._options=e,this.refreshMenuItems()}refreshMenuItems(){this._menu.innerHTML="",this._options.forEach((e,t)=>{const s=new Ke({option:e,selectable:this._selectable,isSelected:this._selectedIndex===t,themeManager:this._themeSubscription.manager});s.addEventListener("click",()=>{this._selectedIndex=t,e.onClick(e),this.refreshMenuItems(),this.closeMenu()}),this._menu.appendChild(s)})}toggleMenu(e){e.stopPropagation();const t=this._menu.style.display!=="block";this._menu.style.display=t?"block":"none",t&&this._onMenuOpen()}handleOutsideClick(e){this.contains(e.target)||this.closeMenu()}closeMenu(){this._menu.style.display="none"}selectOption(e){this._selectedIndex=this._options.findIndex(t=>t.id===e.id),this.refreshMenuItems()}disconnectedCallback(){this._themeSubscription.unsubscribe()}}customElements.get("courier-inbox-option-menu")||customElements.define("courier-inbox-option-menu",He);class Re extends HTMLElement{constructor(e){super();a(this,"_themeSubscription");a(this,"_location");a(this,"_count",0);a(this,"_badge");a(this,"_style");this._location=e.location,this._themeSubscription=e.themeBus.subscribe(s=>{this.refreshTheme(this._location)});const t=this.attachShadow({mode:"open"});this._badge=document.createElement("span"),this._badge.className="unread-badge",this._style=document.createElement("style"),this._style.textContent=this.getStyles(this._location),t.appendChild(this._style),t.appendChild(this._badge)}getStyles(e){var c,u,g,p,x,_,b;const t=this._themeSubscription.manager.getTheme(),s=e==="button"?(u=(c=t.popup)==null?void 0:c.button)==null?void 0:u.unreadIndicator:(x=(p=(g=t.inbox)==null?void 0:g.header)==null?void 0:p.filters)==null?void 0:x.unreadIndicator,o=s==null?void 0:s.backgroundColor,n=s==null?void 0:s.borderRadius,h=(_=s==null?void 0:s.font)==null?void 0:_.color,d=(b=s==null?void 0:s.font)==null?void 0:b.size;return`
|
|
500
|
+
:host {
|
|
501
|
+
display: inline-block;
|
|
502
|
+
}
|
|
503
|
+
|
|
504
|
+
.unread-badge {
|
|
505
|
+
background-color: ${o};
|
|
506
|
+
color: ${h};
|
|
507
|
+
border-radius: ${n};
|
|
508
|
+
padding: 4px 8px;
|
|
509
|
+
font-size: ${d};
|
|
510
|
+
text-align: center;
|
|
511
|
+
display: none;
|
|
512
|
+
pointer-events: none;
|
|
513
|
+
}
|
|
514
|
+
`}setCount(e){this._count=e,this.updateBadge()}refreshTheme(e){this._location=e,this.updateBadge()}updateBadge(){this._style.textContent=this.getStyles(this._location),this._count>0?(this._badge.textContent=this._count.toString(),this._badge.style.display="block"):this._badge.style.display="none"}disconnectedCallback(){this._themeSubscription.unsubscribe()}}customElements.get("courier-unread-count-badge")||customElements.define("courier-unread-count-badge",Re);class Qe extends HTMLElement{constructor(e,t){super();a(this,"_themeSubscription");a(this,"_option");a(this,"_feedType");a(this,"_titleElement");a(this,"_iconElement");a(this,"_unreadBadge");a(this,"_container");a(this,"_style");this._option=t;const s=this.attachShadow({mode:"open"});this._style=document.createElement("style"),this._container=document.createElement("div"),this._container.className="title-section",this._iconElement=new ie(void 0,this._option.icon.svg),this._titleElement=document.createElement("h2"),this._unreadBadge=new Re({themeBus:e,location:"header"}),this._container.appendChild(this._iconElement),this._container.appendChild(this._titleElement),this._container.appendChild(this._unreadBadge),s.appendChild(this._style),s.appendChild(this._container),this._themeSubscription=e.subscribe(o=>{this.refreshTheme(this._feedType??"inbox")}),this.refreshTheme(this._feedType??"inbox")}getStyles(){var t,s,o,n,h,d,c,u,g,p,x,_,b,v,k,w;const e=this._themeSubscription.manager.getTheme();return`
|
|
515
|
+
.title-section {
|
|
516
|
+
display: flex;
|
|
517
|
+
align-items: center;
|
|
518
|
+
gap: 8px;
|
|
519
|
+
position: relative;
|
|
520
|
+
}
|
|
521
|
+
|
|
522
|
+
courier-icon {
|
|
523
|
+
display: flex;
|
|
524
|
+
align-items: center;
|
|
525
|
+
}
|
|
526
|
+
|
|
527
|
+
h2 {
|
|
528
|
+
margin: 0;
|
|
529
|
+
font-family: ${((n=(o=(s=(t=e.inbox)==null?void 0:t.header)==null?void 0:s.filters)==null?void 0:o.font)==null?void 0:n.family)??"inherit"};
|
|
530
|
+
font-size: ${((u=(c=(d=(h=e.inbox)==null?void 0:h.header)==null?void 0:d.filters)==null?void 0:c.font)==null?void 0:u.size)??"18px"};
|
|
531
|
+
font-weight: ${((_=(x=(p=(g=e.inbox)==null?void 0:g.header)==null?void 0:p.filters)==null?void 0:x.font)==null?void 0:_.weight)??"500"};
|
|
532
|
+
color: ${((w=(k=(v=(b=e.inbox)==null?void 0:b.header)==null?void 0:v.filters)==null?void 0:k.font)==null?void 0:w.color)??"red"};
|
|
533
|
+
}
|
|
534
|
+
|
|
535
|
+
courier-unread-count-badge {
|
|
536
|
+
margin-left: 4px;
|
|
537
|
+
}
|
|
538
|
+
`}refreshTheme(e){this._feedType=e,this._style.textContent=this.getStyles(),this._unreadBadge.refreshTheme("header"),this.updateFilter()}updateSelectedOption(e,t,s){this._option=e,this._feedType=t,this._unreadBadge.setCount(s),this.updateFilter()}updateFilter(){var t,s,o,n,h,d,c,u,g,p,x,_,b,v,k,w,S,M,I,T,B,D,F,y,P,H,R,z;const e=this._themeSubscription.manager.getTheme();switch(this._feedType){case"inbox":this._titleElement.textContent=((n=(o=(s=(t=e.inbox)==null?void 0:t.header)==null?void 0:s.filters)==null?void 0:o.inbox)==null?void 0:n.text)??"Inbox",this._iconElement.updateSVG(((g=(u=(c=(d=(h=e.inbox)==null?void 0:h.header)==null?void 0:d.filters)==null?void 0:c.inbox)==null?void 0:u.icon)==null?void 0:g.svg)??C.inbox),this._iconElement.updateColor(((v=(b=(_=(x=(p=e.inbox)==null?void 0:p.header)==null?void 0:x.filters)==null?void 0:_.inbox)==null?void 0:b.icon)==null?void 0:v.color)??"red");break;case"archive":this._titleElement.textContent=((M=(S=(w=(k=e.inbox)==null?void 0:k.header)==null?void 0:w.filters)==null?void 0:S.archive)==null?void 0:M.text)??"Archive",this._iconElement.updateSVG(((F=(D=(B=(T=(I=e.inbox)==null?void 0:I.header)==null?void 0:T.filters)==null?void 0:B.archive)==null?void 0:D.icon)==null?void 0:F.svg)??C.archive),this._iconElement.updateColor(((z=(R=(H=(P=(y=e.inbox)==null?void 0:y.header)==null?void 0:P.filters)==null?void 0:H.archive)==null?void 0:R.icon)==null?void 0:z.color)??"red");break}}disconnectedCallback(){this._themeSubscription.unsubscribe()}}customElements.get("courier-inbox-header-title")||customElements.define("courier-inbox-header-title",Qe);class ze extends Te{constructor(e){super();a(this,"_themeSubscription");a(this,"_feedType","inbox");a(this,"_unreadCount",0);a(this,"_titleSection");a(this,"_filterMenu");a(this,"_actionMenu");a(this,"_style");a(this,"_onFeedTypeChange");this._themeSubscription=e.themeManager.subscribe(t=>{this.refreshTheme()}),this._onFeedTypeChange=e.onFeedTypeChange}getFilterOptions(){var s,o,n,h,d,c,u,g,p,x,_,b,v,k,w,S,M,I,T,B,D,F,y,P,H,R,z,O,N,U,V,Z,j,Y,K,Q,J;const e=this._themeSubscription.manager.getTheme(),t=(n=(o=(s=e.inbox)==null?void 0:s.header)==null?void 0:o.menus)==null?void 0:n.filters;return[{id:"inbox",text:((h=t==null?void 0:t.inbox)==null?void 0:h.text)??"Inbox",icon:{color:((c=(d=t==null?void 0:t.inbox)==null?void 0:d.icon)==null?void 0:c.color)??"red",svg:((g=(u=t==null?void 0:t.inbox)==null?void 0:u.icon)==null?void 0:g.svg)??C.inbox},selectionIcon:{color:((k=(v=(b=(_=(x=(p=e.inbox)==null?void 0:p.header)==null?void 0:x.menus)==null?void 0:_.popup)==null?void 0:b.list)==null?void 0:v.selectionIcon)==null?void 0:k.color)??"red",svg:((B=(T=(I=(M=(S=(w=e.inbox)==null?void 0:w.header)==null?void 0:S.menus)==null?void 0:M.popup)==null?void 0:I.list)==null?void 0:T.selectionIcon)==null?void 0:B.svg)??C.check},onClick:q=>{this.handleOptionMenuItemClick("inbox",q)}},{id:"archive",text:((D=t==null?void 0:t.archive)==null?void 0:D.text)??"Archive",icon:{color:((y=(F=t==null?void 0:t.archive)==null?void 0:F.icon)==null?void 0:y.color)??"red",svg:((H=(P=t==null?void 0:t.archive)==null?void 0:P.icon)==null?void 0:H.svg)??C.archive},selectionIcon:{color:((V=(U=(N=(O=(z=(R=e.inbox)==null?void 0:R.header)==null?void 0:z.menus)==null?void 0:O.popup)==null?void 0:N.list)==null?void 0:U.selectionIcon)==null?void 0:V.color)??"red",svg:((J=(Q=(K=(Y=(j=(Z=e.inbox)==null?void 0:Z.header)==null?void 0:j.menus)==null?void 0:Y.popup)==null?void 0:K.list)==null?void 0:Q.selectionIcon)==null?void 0:J.svg)??C.check},onClick:q=>{this.handleOptionMenuItemClick("archive",q)}}]}getActionOptions(){var s,o,n,h,d,c,u,g,p,x,_,b,v,k,w,S,M,I;const t=(n=(o=(s=this._themeSubscription.manager.getTheme().inbox)==null?void 0:s.header)==null?void 0:o.menus)==null?void 0:n.actions;return[{id:"markAllRead",text:((h=t==null?void 0:t.markAllRead)==null?void 0:h.text)??"Mark All as Read",icon:{color:((c=(d=t==null?void 0:t.markAllRead)==null?void 0:d.icon)==null?void 0:c.color)??"red",svg:((g=(u=t==null?void 0:t.markAllRead)==null?void 0:u.icon)==null?void 0:g.svg)??C.inbox},selectionIcon:null,onClick:T=>{A.shared.readAllMessages()}},{id:"archiveAll",text:((p=t==null?void 0:t.archiveAll)==null?void 0:p.text)??"Archive All",icon:{color:((_=(x=t==null?void 0:t.archiveAll)==null?void 0:x.icon)==null?void 0:_.color)??"red",svg:((v=(b=t==null?void 0:t.archiveAll)==null?void 0:b.icon)==null?void 0:v.svg)??C.archive},selectionIcon:null,onClick:T=>{var B;alert(JSON.stringify((B=f.Courier.shared.client)==null?void 0:B.options))}},{id:"archiveRead",text:((k=t==null?void 0:t.archiveRead)==null?void 0:k.text)??"Archive Read",icon:{color:((S=(w=t==null?void 0:t.archiveRead)==null?void 0:w.icon)==null?void 0:S.color)??"red",svg:((I=(M=t==null?void 0:t.archiveRead)==null?void 0:M.icon)==null?void 0:I.svg)??C.archive},selectionIcon:null,onClick:T=>{alert("TODO: Archive read messages")}}]}static get observedAttributes(){return["icon","title","feed-type"]}refreshTheme(){var s,o,n,h,d,c,u;const e=this._themeSubscription.manager.getTheme(),t=(s=this.shadow)==null?void 0:s.querySelector(".courier-inbox-header");t&&(t.style.backgroundColor=((n=(o=e.inbox)==null?void 0:o.header)==null?void 0:n.backgroundColor)??r.white[500],t.style.boxShadow=((d=(h=e.inbox)==null?void 0:h.header)==null?void 0:d.shadow)??`0px 1px 0px 0px ${r.gray[500]}`),(c=this._filterMenu)==null||c.setOptions(this.getFilterOptions()),(u=this._actionMenu)==null||u.setOptions(this.getActionOptions())}handleOptionMenuItemClick(e,t){this._feedType=e,this._titleSection&&this._titleSection.updateSelectedOption(t,this._feedType,this._feedType==="inbox"?this._unreadCount:0),this._onFeedTypeChange(e)}render(e){this._feedType=e.feedType,this._unreadCount=e.unreadCount,this.refreshTitleSection()}refreshTitleSection(){var t,s;const e=this.getFilterOptions().find(o=>["inbox","archive"].includes(o.id)&&o.id===this._feedType);e&&((t=this._titleSection)==null||t.updateSelectedOption(e,this._feedType,this._feedType==="inbox"?this._unreadCount:0),(s=this._filterMenu)==null||s.selectOption(e))}build(e){var t;super.build(e),this._style=document.createElement("style"),this._style.textContent=this.getStyles(),(t=this.shadow)==null||t.appendChild(this._style),this.refreshTheme()}defaultElement(){const e=this.getFilterOptions();this._titleSection=new Qe(this._themeSubscription.manager,e[0]),this._filterMenu=new He(this._themeSubscription.manager,"filters",!0,e,()=>{var n;(n=this._actionMenu)==null||n.closeMenu()}),this._actionMenu=new He(this._themeSubscription.manager,"actions",!1,this.getActionOptions(),()=>{var n;(n=this._filterMenu)==null||n.closeMenu()}),this._filterMenu.selectOption(e[0]);const t=document.createElement("div");t.className="spacer";const s=document.createElement("div");s.className="actions",s.appendChild(this._filterMenu),s.appendChild(this._actionMenu);const o=document.createElement("div");return o.className="courier-inbox-header",o.appendChild(this._titleSection),o.appendChild(t),o.appendChild(s),o}getStyles(){return`
|
|
539
|
+
:host {
|
|
540
|
+
z-index: 100;
|
|
541
|
+
}
|
|
542
|
+
|
|
543
|
+
.courier-inbox-header {
|
|
544
|
+
display: flex;
|
|
545
|
+
align-items: center;
|
|
546
|
+
justify-content: space-between;
|
|
547
|
+
padding: 10px 10px 10px 16px;
|
|
548
|
+
background-color: ${r.white[500]};
|
|
549
|
+
box-shadow: 0px 1px 0px 0px ${r.gray[500]};
|
|
550
|
+
}
|
|
551
|
+
|
|
552
|
+
.header-content {
|
|
553
|
+
display: flex;
|
|
554
|
+
align-items: center;
|
|
555
|
+
flex: 1;
|
|
556
|
+
}
|
|
557
|
+
|
|
558
|
+
.spacer {
|
|
559
|
+
flex: 1;
|
|
560
|
+
}
|
|
561
|
+
|
|
562
|
+
.actions {
|
|
563
|
+
display: flex;
|
|
564
|
+
align-items: center;
|
|
565
|
+
gap: 4px;
|
|
566
|
+
}
|
|
567
|
+
`}disconnectedCallback(){this._themeSubscription.unsubscribe()}}customElements.get("courier-inbox-header")||customElements.define("courier-inbox-header",ze);class Oe{constructor(i){a(this,"events");this.events=i}remove(){A.shared.removeDataStoreListener(this)}}const ne={popup:{button:{icon:{color:r.black[500],svg:C.inbox},backgroundColor:"transparent",hoverBackgroundColor:r.black[50010],activeBackgroundColor:r.black[50020],unreadIndicator:{font:{color:r.white[500],size:"14px",family:void 0,weight:void 0},backgroundColor:r.blue[500],borderRadius:"12px"}},window:{backgroundColor:r.white[500],borderRadius:"8px",border:`1px solid ${r.gray[500]}`,shadow:`0px 8px 16px -4px ${r.gray[500]}`}},inbox:{header:{backgroundColor:r.white[500],shadow:`0px 1px 0px 0px ${r.gray[500]}`,filters:{font:{color:r.black[500],family:void 0,size:"18px"},inbox:{icon:{color:r.black[500],svg:C.inbox},text:"Inbox"},archive:{icon:{color:r.black[500],svg:C.archive},text:"Archive"},unreadIndicator:{font:{color:r.white[500],family:void 0,size:"14px"},backgroundColor:r.blue[500],borderRadius:"12px"}},menus:{popup:{backgroundColor:r.white[500],border:`1px solid ${r.gray[500]}`,borderRadius:"4px",shadow:`0px 4px 8px -2px ${r.gray[500]}`,list:{hoverBackgroundColor:r.gray[200],activeBackgroundColor:r.gray[500],divider:"none",font:{color:r.black[500],family:void 0,size:"14px"},selectionIcon:{color:r.black[500],svg:C.check}}},filters:{button:{icon:{color:r.black[500],svg:C.filter},backgroundColor:"transparent",hoverBackgroundColor:r.black[50010],activeBackgroundColor:r.black[50020]},inbox:{icon:{color:r.black[500],svg:C.inbox},text:"Inbox"},archive:{icon:{color:r.black[500],svg:C.archive},text:"Archive"}},actions:{button:{icon:{color:r.black[500],svg:C.overflow},backgroundColor:"transparent",hoverBackgroundColor:r.black[50010],activeBackgroundColor:r.black[50020]},markAllRead:{icon:{color:r.black[500],svg:C.read},text:"Mark All as Read"},archiveAll:{icon:{color:r.black[500],svg:C.archive},text:"Archive All"},archiveRead:{icon:{color:r.black[500],svg:C.archiveRead},text:"Archive Read"}}}},list:{backgroundColor:r.white[500],item:{backgroundColor:"transparent",unreadIndicatorColor:r.blue[500],hoverBackgroundColor:r.gray[200],activeBackgroundColor:r.gray[500],actions:{backgroundColor:"transparent",hoverBackgroundColor:r.gray[200],activeBackgroundColor:r.gray[500],border:`1px solid ${r.gray[500]}`,borderRadius:"4px",shadow:"0px 1px 2px 0px rgba(0, 0, 0, 0.06)",font:{color:r.black[500],family:void 0,size:"14px"}},title:{color:r.black[500],family:void 0,size:"14px"},subtitle:{color:r.gray[600],family:void 0,size:"14px"},time:{color:r.gray[600],family:void 0,size:"14px"},divider:`1px solid ${r.gray[200]}`,menu:{enabled:!0,backgroundColor:r.white[500],border:`1px solid ${r.gray[500]}`,borderRadius:"4px",shadow:`0px 2px 4px -2px ${r.gray[500]}`,longPress:{displayDuration:4e3,vibrationDuration:50},item:{hoverBackgroundColor:r.gray[200],activeBackgroundColor:r.gray[500],borderRadius:"0px",read:{color:r.black[500],svg:C.read},unread:{color:r.black[500],svg:C.unread},archive:{color:r.black[500],svg:C.archive},unarchive:{color:r.black[500],svg:C.unarchive}}}}},loading:{animation:{barColor:r.gray[500],barHeight:"14px",barBorderRadius:"14px",duration:"2s"},divider:`1px solid ${r.gray[200]}`},empty:{title:{font:{size:"16px",weight:"500",color:r.black[500]}},button:{text:"Refresh"}},error:{title:{font:{size:"16px",weight:"500",color:r.black[500]}},button:{text:"Retry"}}}},Ae={popup:{button:{icon:{color:r.white[500],svg:C.inbox},backgroundColor:"transparent",hoverBackgroundColor:r.white[50010],activeBackgroundColor:r.white[50020],unreadIndicator:{font:{color:r.white[500],size:"14px",family:void 0,weight:void 0},backgroundColor:r.blue[500],borderRadius:"12px"}},window:{backgroundColor:r.black[500],borderRadius:"8px",border:`1px solid ${r.gray[400]}`,shadow:`0px 4px 8px -2px ${r.white[50020]}`}},inbox:{header:{backgroundColor:r.black[500],shadow:`0px 1px 0px 0px ${r.gray[400]}`,filters:{font:{color:r.white[500],family:void 0,size:"18px"},inbox:{icon:{color:r.white[500],svg:C.inbox},text:"Inbox"},archive:{icon:{color:r.white[500],svg:C.archive},text:"Archive"},unreadIndicator:{font:{color:r.white[500],family:void 0,size:"14px"},backgroundColor:r.blue[500],borderRadius:"12px"}},menus:{popup:{backgroundColor:r.black[500],border:`1px solid ${r.gray[400]}`,borderRadius:"4px",shadow:`0px 4px 8px -2px ${r.white[50020]}`,list:{hoverBackgroundColor:r.white[50010],activeBackgroundColor:r.white[50020],divider:"none",font:{color:r.white[500],family:void 0,size:"14px"},selectionIcon:{color:r.white[500],svg:C.check}}},filters:{button:{icon:{color:r.white[500],svg:C.filter},backgroundColor:"transparent",hoverBackgroundColor:r.white[50010],activeBackgroundColor:r.white[50020]},inbox:{icon:{color:r.white[500],svg:C.inbox},text:"Inbox"},archive:{icon:{color:r.white[500],svg:C.archive},text:"Archive"}},actions:{button:{icon:{color:r.white[500],svg:C.overflow},backgroundColor:"transparent",hoverBackgroundColor:r.white[50010],activeBackgroundColor:r.white[50020]},markAllRead:{icon:{color:r.white[500],svg:C.read},text:"Mark All as Read"},archiveAll:{icon:{color:r.white[500],svg:C.archive},text:"Archive All"},archiveRead:{icon:{color:r.white[500],svg:C.archiveRead},text:"Archive Read"}}}},list:{backgroundColor:r.black[500],item:{backgroundColor:"transparent",unreadIndicatorColor:r.blue[500],hoverBackgroundColor:r.white[50010],activeBackgroundColor:r.white[50020],actions:{backgroundColor:"transparent",hoverBackgroundColor:r.white[50010],activeBackgroundColor:r.white[50020],border:`1px solid ${r.gray[400]}`,borderRadius:"4px",shadow:`0px 1px 2px 0px ${r.white[50010]}`,font:{color:r.white[500],family:void 0,size:"14px"}},title:{color:r.white[500],family:void 0,size:"14px"},subtitle:{color:r.gray[500],family:void 0,size:"14px"},time:{color:r.gray[500],family:void 0,size:"12px"},divider:`1px solid ${r.gray[400]}`,menu:{enabled:!0,backgroundColor:r.black[500],border:`1px solid ${r.gray[400]}`,borderRadius:"4px",shadow:`0px 2px 4px -2px ${r.white[50020]}`,longPress:{displayDuration:4e3,vibrationDuration:50},item:{hoverBackgroundColor:r.white[50010],activeBackgroundColor:r.white[50020],borderRadius:"0px",read:{color:r.white[500],svg:C.read},unread:{color:r.white[500],svg:C.unread},archive:{color:r.white[500],svg:C.archive},unarchive:{color:r.white[500],svg:C.unarchive}}}}},loading:{animation:{barColor:r.white[500],barHeight:"14px",barBorderRadius:"14px",duration:"2s"},divider:`1px solid ${r.gray[400]}`},empty:{title:{font:{size:"16px",weight:"500",color:r.white[500]}},button:{text:"Refresh"}},error:{title:{font:{size:"16px",weight:"500",color:r.white[500]}},button:{text:"Retry"}}}},Je=(m,i)=>{var t,s,o,n,h,d,c,u,g,p,x,_,b,v,k,w,S,M,I,T,B,D,F,y,P,H,R,z,O,N,U,V,Z,j,Y,K,Q,J,q,ae,he,ce,le,de,ue,pe,ge,me,be,_e,fe,xe,Ce,ve,ye,ke,we,Se,Me,l,$,ee,te,W,Ee,it,st,ot,nt,rt,at,ht,ct,lt,dt,ut,pt,gt,mt,bt,_t,ft,xt,Ct,vt,yt,kt,wt,St,Mt,Et,It,Tt,Lt,Bt,At,Pt,$t,Dt,Ft,Ht,Rt,zt,Ot,Nt,Ut,Vt,Zt,jt,Wt,Gt,qt,Xt,Yt,Kt,Qt,Jt,ei,ti,ii,si,oi,ni,ri,ai,hi,ci,li,di,ui,pi,gi,mi,bi,_i,fi,xi,Ci,vi,yi,ki,wi,Si,Mi,Ei,Ii,Ti,Li,Bi,Ai,Pi,$i,Di,Fi,Hi,Ri,zi,Oi,Ni,Ui,Vi,Zi,ji,Wi,Gi,qi,Xi,Yi,Ki,Qi,Ji,es,ts,is,ss,os,ns,rs,as,hs,cs,ls,ds,us,ps,gs,ms,bs,_s,fs,xs,Cs,vs,ys,ks,ws,Ss,Ms,Es,Is,Ts,Ls,Bs,As,Ps,$s,Ds,Fs,Hs,Rs,zs,Os,Ns,Us,Vs,Zs,js,Ws,Gs,qs,Xs,Ys,Ks,Qs,Js,eo,to,io,so,oo,no,ro,ao,ho,co,lo,uo,po,go,mo,bo,_o,fo,xo,Co,vo,yo,ko,wo,So,Mo,Eo,Io,To,Lo,Bo,Ao,Po;const e=m==="light"?ne:Ae;return{popup:{button:{...(t=e.popup)==null?void 0:t.button,...(s=i.popup)==null?void 0:s.button,icon:{...(n=(o=e.popup)==null?void 0:o.button)==null?void 0:n.icon,...(d=(h=i.popup)==null?void 0:h.button)==null?void 0:d.icon},unreadIndicator:{...(u=(c=e.popup)==null?void 0:c.button)==null?void 0:u.unreadIndicator,...(p=(g=i.popup)==null?void 0:g.button)==null?void 0:p.unreadIndicator}},window:{...(x=e.popup)==null?void 0:x.window,...(_=i.popup)==null?void 0:_.window}},inbox:{header:{...(b=e.inbox)==null?void 0:b.header,...(v=i.inbox)==null?void 0:v.header,filters:{...(w=(k=e.inbox)==null?void 0:k.header)==null?void 0:w.filters,...(M=(S=i.inbox)==null?void 0:S.header)==null?void 0:M.filters,inbox:{...(B=(T=(I=e.inbox)==null?void 0:I.header)==null?void 0:T.filters)==null?void 0:B.inbox,...(y=(F=(D=i.inbox)==null?void 0:D.header)==null?void 0:F.filters)==null?void 0:y.inbox,icon:{...(z=(R=(H=(P=e.inbox)==null?void 0:P.header)==null?void 0:H.filters)==null?void 0:R.inbox)==null?void 0:z.icon,...(V=(U=(N=(O=i.inbox)==null?void 0:O.header)==null?void 0:N.filters)==null?void 0:U.inbox)==null?void 0:V.icon}},archive:{...(Y=(j=(Z=e.inbox)==null?void 0:Z.header)==null?void 0:j.filters)==null?void 0:Y.archive,...(J=(Q=(K=i.inbox)==null?void 0:K.header)==null?void 0:Q.filters)==null?void 0:J.archive,icon:{...(ce=(he=(ae=(q=e.inbox)==null?void 0:q.header)==null?void 0:ae.filters)==null?void 0:he.archive)==null?void 0:ce.icon,...(pe=(ue=(de=(le=i.inbox)==null?void 0:le.header)==null?void 0:de.filters)==null?void 0:ue.archive)==null?void 0:pe.icon}},unreadIndicator:{...(be=(me=(ge=e.inbox)==null?void 0:ge.header)==null?void 0:me.filters)==null?void 0:be.unreadIndicator,...(xe=(fe=(_e=i.inbox)==null?void 0:_e.header)==null?void 0:fe.filters)==null?void 0:xe.unreadIndicator}},menus:{...(ve=(Ce=e.inbox)==null?void 0:Ce.header)==null?void 0:ve.menus,...(ke=(ye=i.inbox)==null?void 0:ye.header)==null?void 0:ke.menus,popup:{...(Me=(Se=(we=e.inbox)==null?void 0:we.header)==null?void 0:Se.menus)==null?void 0:Me.popup,...(ee=($=(l=i.inbox)==null?void 0:l.header)==null?void 0:$.menus)==null?void 0:ee.popup,list:{...(it=(Ee=(W=(te=e.inbox)==null?void 0:te.header)==null?void 0:W.menus)==null?void 0:Ee.popup)==null?void 0:it.list,...(rt=(nt=(ot=(st=i.inbox)==null?void 0:st.header)==null?void 0:ot.menus)==null?void 0:nt.popup)==null?void 0:rt.list,font:{...(dt=(lt=(ct=(ht=(at=e.inbox)==null?void 0:at.header)==null?void 0:ht.menus)==null?void 0:ct.popup)==null?void 0:lt.list)==null?void 0:dt.font,...(bt=(mt=(gt=(pt=(ut=i.inbox)==null?void 0:ut.header)==null?void 0:pt.menus)==null?void 0:gt.popup)==null?void 0:mt.list)==null?void 0:bt.font},selectionIcon:{...(vt=(Ct=(xt=(ft=(_t=e.inbox)==null?void 0:_t.header)==null?void 0:ft.menus)==null?void 0:xt.popup)==null?void 0:Ct.list)==null?void 0:vt.selectionIcon,...(Mt=(St=(wt=(kt=(yt=i.inbox)==null?void 0:yt.header)==null?void 0:kt.menus)==null?void 0:wt.popup)==null?void 0:St.list)==null?void 0:Mt.selectionIcon}}},filters:{...(Tt=(It=(Et=e.inbox)==null?void 0:Et.header)==null?void 0:It.menus)==null?void 0:Tt.filters,...(At=(Bt=(Lt=i.inbox)==null?void 0:Lt.header)==null?void 0:Bt.menus)==null?void 0:At.filters,inbox:{...(Ft=(Dt=($t=(Pt=e.inbox)==null?void 0:Pt.header)==null?void 0:$t.menus)==null?void 0:Dt.filters)==null?void 0:Ft.inbox,...(Ot=(zt=(Rt=(Ht=i.inbox)==null?void 0:Ht.header)==null?void 0:Rt.menus)==null?void 0:zt.filters)==null?void 0:Ot.inbox,icon:{...(jt=(Zt=(Vt=(Ut=(Nt=e.inbox)==null?void 0:Nt.header)==null?void 0:Ut.menus)==null?void 0:Vt.filters)==null?void 0:Zt.inbox)==null?void 0:jt.icon,...(Yt=(Xt=(qt=(Gt=(Wt=i.inbox)==null?void 0:Wt.header)==null?void 0:Gt.menus)==null?void 0:qt.filters)==null?void 0:Xt.inbox)==null?void 0:Yt.icon}},archive:{...(ei=(Jt=(Qt=(Kt=e.inbox)==null?void 0:Kt.header)==null?void 0:Qt.menus)==null?void 0:Jt.filters)==null?void 0:ei.archive,...(oi=(si=(ii=(ti=i.inbox)==null?void 0:ti.header)==null?void 0:ii.menus)==null?void 0:si.filters)==null?void 0:oi.archive,icon:{...(ci=(hi=(ai=(ri=(ni=e.inbox)==null?void 0:ni.header)==null?void 0:ri.menus)==null?void 0:ai.filters)==null?void 0:hi.archive)==null?void 0:ci.icon,...(gi=(pi=(ui=(di=(li=i.inbox)==null?void 0:li.header)==null?void 0:di.menus)==null?void 0:ui.filters)==null?void 0:pi.archive)==null?void 0:gi.icon}}},actions:{...(_i=(bi=(mi=e.inbox)==null?void 0:mi.header)==null?void 0:bi.menus)==null?void 0:_i.actions,...(Ci=(xi=(fi=i.inbox)==null?void 0:fi.header)==null?void 0:xi.menus)==null?void 0:Ci.actions,markAllRead:{...(wi=(ki=(yi=(vi=e.inbox)==null?void 0:vi.header)==null?void 0:yi.menus)==null?void 0:ki.actions)==null?void 0:wi.markAllRead,...(Ii=(Ei=(Mi=(Si=i.inbox)==null?void 0:Si.header)==null?void 0:Mi.menus)==null?void 0:Ei.actions)==null?void 0:Ii.markAllRead,icon:{...(Pi=(Ai=(Bi=(Li=(Ti=e.inbox)==null?void 0:Ti.header)==null?void 0:Li.menus)==null?void 0:Bi.actions)==null?void 0:Ai.markAllRead)==null?void 0:Pi.icon,...(Ri=(Hi=(Fi=(Di=($i=i.inbox)==null?void 0:$i.header)==null?void 0:Di.menus)==null?void 0:Fi.actions)==null?void 0:Hi.markAllRead)==null?void 0:Ri.icon}},archiveAll:{...(Ui=(Ni=(Oi=(zi=e.inbox)==null?void 0:zi.header)==null?void 0:Oi.menus)==null?void 0:Ni.actions)==null?void 0:Ui.archiveAll,...(Wi=(ji=(Zi=(Vi=i.inbox)==null?void 0:Vi.header)==null?void 0:Zi.menus)==null?void 0:ji.actions)==null?void 0:Wi.archiveAll,icon:{...(Ki=(Yi=(Xi=(qi=(Gi=e.inbox)==null?void 0:Gi.header)==null?void 0:qi.menus)==null?void 0:Xi.actions)==null?void 0:Yi.archiveAll)==null?void 0:Ki.icon,...(is=(ts=(es=(Ji=(Qi=i.inbox)==null?void 0:Qi.header)==null?void 0:Ji.menus)==null?void 0:es.actions)==null?void 0:ts.archiveAll)==null?void 0:is.icon}},archiveRead:{...(rs=(ns=(os=(ss=e.inbox)==null?void 0:ss.header)==null?void 0:os.menus)==null?void 0:ns.actions)==null?void 0:rs.archiveRead,...(ls=(cs=(hs=(as=i.inbox)==null?void 0:as.header)==null?void 0:hs.menus)==null?void 0:cs.actions)==null?void 0:ls.archiveRead,icon:{...(ms=(gs=(ps=(us=(ds=e.inbox)==null?void 0:ds.header)==null?void 0:us.menus)==null?void 0:ps.actions)==null?void 0:gs.archiveRead)==null?void 0:ms.icon,...(Cs=(xs=(fs=(_s=(bs=i.inbox)==null?void 0:bs.header)==null?void 0:_s.menus)==null?void 0:fs.actions)==null?void 0:xs.archiveRead)==null?void 0:Cs.icon}}}}},list:{...(vs=e.inbox)==null?void 0:vs.list,...(ys=i.inbox)==null?void 0:ys.list,item:{...(ws=(ks=e.inbox)==null?void 0:ks.list)==null?void 0:ws.item,...(Ms=(Ss=i.inbox)==null?void 0:Ss.list)==null?void 0:Ms.item,menu:{...(Ts=(Is=(Es=e.inbox)==null?void 0:Es.list)==null?void 0:Is.item)==null?void 0:Ts.menu,...(As=(Bs=(Ls=i.inbox)==null?void 0:Ls.list)==null?void 0:Bs.item)==null?void 0:As.menu,item:{...(Fs=(Ds=($s=(Ps=e.inbox)==null?void 0:Ps.list)==null?void 0:$s.item)==null?void 0:Ds.menu)==null?void 0:Fs.item,...(Os=(zs=(Rs=(Hs=i.inbox)==null?void 0:Hs.list)==null?void 0:Rs.item)==null?void 0:zs.menu)==null?void 0:Os.item,read:{...(js=(Zs=(Vs=(Us=(Ns=e.inbox)==null?void 0:Ns.list)==null?void 0:Us.item)==null?void 0:Vs.menu)==null?void 0:Zs.item)==null?void 0:js.read,...(Ys=(Xs=(qs=(Gs=(Ws=i.inbox)==null?void 0:Ws.list)==null?void 0:Gs.item)==null?void 0:qs.menu)==null?void 0:Xs.item)==null?void 0:Ys.read},unread:{...(to=(eo=(Js=(Qs=(Ks=e.inbox)==null?void 0:Ks.list)==null?void 0:Qs.item)==null?void 0:Js.menu)==null?void 0:eo.item)==null?void 0:to.unread,...(ro=(no=(oo=(so=(io=i.inbox)==null?void 0:io.list)==null?void 0:so.item)==null?void 0:oo.menu)==null?void 0:no.item)==null?void 0:ro.unread},archive:{...(uo=(lo=(co=(ho=(ao=e.inbox)==null?void 0:ao.list)==null?void 0:ho.item)==null?void 0:co.menu)==null?void 0:lo.item)==null?void 0:uo.archive,...(_o=(bo=(mo=(go=(po=i.inbox)==null?void 0:po.list)==null?void 0:go.item)==null?void 0:mo.menu)==null?void 0:bo.item)==null?void 0:_o.archive},unarchive:{...(yo=(vo=(Co=(xo=(fo=e.inbox)==null?void 0:fo.list)==null?void 0:xo.item)==null?void 0:Co.menu)==null?void 0:vo.item)==null?void 0:yo.unarchive,...(Eo=(Mo=(So=(wo=(ko=i.inbox)==null?void 0:ko.list)==null?void 0:wo.item)==null?void 0:So.menu)==null?void 0:Mo.item)==null?void 0:Eo.unarchive}}}}},loading:{...(Io=e.inbox)==null?void 0:Io.loading,...(To=i.inbox)==null?void 0:To.loading},empty:{...(Lo=e.inbox)==null?void 0:Lo.empty,...(Bo=i.inbox)==null?void 0:Bo.empty},error:{...(Ao=e.inbox)==null?void 0:Ao.error,...(Po=i.inbox)==null?void 0:Po.error}}}};class Ne{constructor(i){a(this,"THEME_CHANGE_EVENT","courier_inbox_theme_change");a(this,"_theme");a(this,"_lightTheme",ne);a(this,"_darkTheme",Ae);a(this,"_target");a(this,"_subscriptions",[]);a(this,"_userMode");a(this,"_systemMode");a(this,"_systemThemeCleanup");this._theme=i,this._target=new EventTarget,this._userMode="system",this._systemMode=Ve(),this.setLightTheme(ne),this.setDarkTheme(Ae),this._systemThemeCleanup=Ze(e=>{this._systemMode=e,this.updateTheme()})}setLightTheme(i){this._lightTheme=i,this._systemMode==="light"&&this.updateTheme()}setDarkTheme(i){this._darkTheme=i,this._systemMode==="dark"&&this.updateTheme()}get currentSystemTheme(){return this._systemMode}getTheme(){return this._theme}updateTheme(){const i=this._userMode==="system"?this._systemMode:this._userMode,e=i==="light"?this._lightTheme:this._darkTheme,t=Je(i,e);this.setTheme(t)}setTheme(i){i!==this._theme&&(this._theme=i,this._target.dispatchEvent(new CustomEvent(this.THEME_CHANGE_EVENT,{detail:{theme:i}})))}setMode(i){this._userMode=i,this.updateTheme()}subscribe(i){const e=new AbortController;this._target.addEventListener(this.THEME_CHANGE_EVENT,s=>{i(s.detail.theme)},{signal:e.signal});const t={manager:this,unsubscribe:()=>{e.abort();const s=this._subscriptions.indexOf(t);s>-1&&this._subscriptions.splice(s,1)}};return this._subscriptions.push(t),t}cleanup(){this._systemThemeCleanup&&this._systemThemeCleanup(),this._subscriptions.forEach(i=>i.unsubscribe()),this._subscriptions=[]}}class Ue extends HTMLElement{constructor(e){var t;super();a(this,"_currentFeed","inbox");a(this,"_themeManager");a(this,"_shadow");a(this,"_list");a(this,"_datastoreListener");a(this,"_authListener");a(this,"_style");a(this,"_header");a(this,"_headerFactory");a(this,"_onMessageClick");a(this,"_onMessageActionClick");a(this,"_onMessageLongPress");a(this,"_defaultProps",{title:"Inbox",icon:C.inbox,feedType:this._currentFeed,height:"768px"});this._shadow=this.attachShadow({mode:"open"}),this._themeManager=e??new Ne(ne),this._header=new ze({themeManager:this._themeManager,onFeedTypeChange:s=>{this.setFeedType(s)}}),this._header.build(void 0),this._shadow.appendChild(this._header),this._list=new Ye({themeManager:this._themeManager,onRefresh:()=>{this.refresh()},onPaginationTrigger:async s=>{var o,n;try{await A.shared.fetchNextPageOfMessages({feedType:s})}catch(h){(n=(o=f.Courier.shared.client)==null?void 0:o.options.logger)==null||n.error("Failed to fetch next page of messages:",h)}},onMessageClick:(s,o)=>{var n;A.shared.clickMessage(s),this.dispatchEvent(new CustomEvent("message-click",{detail:{message:s,index:o},bubbles:!0,composed:!0})),(n=this._onMessageClick)==null||n.call(this,{message:s,index:o})},onMessageActionClick:(s,o,n)=>{var h;this.dispatchEvent(new CustomEvent("message-action-click",{detail:{message:s,action:o,index:n},bubbles:!0,composed:!0})),(h=this._onMessageActionClick)==null||h.call(this,{message:s,action:o,index:n})},onMessageLongPress:(s,o)=>{var n;this.dispatchEvent(new CustomEvent("message-long-press",{detail:{message:s,index:o},bubbles:!0,composed:!0})),(n=this._onMessageLongPress)==null||n.call(this,{message:s,index:o})}}),this._style=document.createElement("style"),this.refreshTheme(),this._shadow.appendChild(this._style),this._shadow.appendChild(this._list),this._datastoreListener=new Oe({onError:s=>{this._list.setError(s)},onDataSetChange:(s,o)=>{this._currentFeed===o&&(this._list.setDataSet(s),this.updateHeader())},onPageAdded:(s,o)=>{this._currentFeed===o&&(this._list.addPage(s),this.updateHeader())},onMessageAdd:(s,o,n)=>{this._currentFeed===n&&(this._list.addMessage(s,o),this.updateHeader())},onMessageRemove:(s,o,n)=>{this._currentFeed===n&&(this._list.removeMessage(o),this.updateHeader())},onMessageUpdate:(s,o,n)=>{this._currentFeed===n&&(this._list.updateMessage(s,o),this.updateHeader())},onUnreadCountChange:s=>{this.updateHeader()}}),A.shared.addDataStoreListener(this._datastoreListener),this._themeManager.subscribe(s=>{this.refreshTheme()}),this._authListener=f.Courier.shared.addAuthenticationListener(s=>{this.refresh()}),(t=f.Courier.shared.client)!=null&&t.options.userId&&this.refresh()}get theme(){return this._themeManager.getTheme()}setLightTheme(e){this._themeManager.setLightTheme(e)}setDarkTheme(e){this._themeManager.setDarkTheme(e)}static get observedAttributes(){return["height","light-theme","dark-theme","mode","message-click","message-action-click","message-long-press"]}refreshTheme(){this._style.textContent=this.getStyles()}getStyles(){return`
|
|
568
|
+
:host {
|
|
569
|
+
display: flex;
|
|
570
|
+
flex-direction: column;
|
|
571
|
+
width: 100%;
|
|
572
|
+
height: ${this._defaultProps.height};
|
|
573
|
+
}
|
|
574
|
+
|
|
575
|
+
courier-inbox-header {
|
|
576
|
+
flex-shrink: 0;
|
|
577
|
+
}
|
|
578
|
+
|
|
579
|
+
courier-inbox-list {
|
|
580
|
+
flex: 1;
|
|
581
|
+
overflow-y: auto;
|
|
582
|
+
overflow-x: hidden;
|
|
583
|
+
}
|
|
584
|
+
`}setHeader(e){this._headerFactory=e,this.updateHeader()}removeHeader(){this._headerFactory=null,this.updateHeader()}setLoadingState(e){this._list.setLoadingStateFactory(e)}setEmptyState(e){this._list.setEmptyStateFactory(e)}setErrorState(e){this._list.setErrorStateFactory(e)}setListItem(e){this._list.setListItemFactory(e)}setPaginationItem(e){this._list.setPaginationItemFactory(e)}onMessageClick(e){this._onMessageClick=e}onMessageActionClick(e){this._onMessageActionClick=e}onMessageLongPress(e){this._onMessageLongPress=e}setFeedType(e){this._currentFeed=e,this._list.setFeedType(e),this.updateHeader(),this.load({feedType:this._currentFeed,canUseCache:!0})}updateHeader(){const e={feedType:this._currentFeed,unreadCount:A.shared.unreadCount,messageCount:this._list.messages.length};switch(this._headerFactory){case void 0:this._header.render(e);break;case null:this._header.build(null);break;default:const t=this._headerFactory(e);this._header.build(t);break}}async load(e){await A.shared.load(e)}refresh(){this.load({feedType:this._currentFeed,canUseCache:!1})}connectedCallback(){this.refresh()}disconnectedCallback(){var e,t;this._themeManager.cleanup(),(e=this._datastoreListener)==null||e.remove(),(t=this._authListener)==null||t.remove()}attributeChangedCallback(e,t,s){var o,n,h,d,c,u;if(t!==s)switch(e){case"height":const g=s||this._defaultProps.height;this.style.height=g;break;case"message-click":if(s)try{this._onMessageClick=new Function("props",s)}catch(p){(n=(o=f.Courier.shared.client)==null?void 0:o.options.logger)==null||n.error("Failed to parse message-click handler:",p)}else this._onMessageClick=void 0;break;case"message-action-click":if(s)try{this._onMessageActionClick=new Function("props",s)}catch(p){(d=(h=f.Courier.shared.client)==null?void 0:h.options.logger)==null||d.error("Failed to parse message-action-click handler:",p)}else this._onMessageActionClick=void 0;break;case"message-long-press":if(s)try{this._onMessageLongPress=new Function("props",s)}catch(p){(u=(c=f.Courier.shared.client)==null?void 0:c.options.logger)==null||u.error("Failed to parse message-long-press handler:",p)}else this._onMessageLongPress=void 0;break;case"light-theme":s&&this.setLightTheme(JSON.parse(s));break;case"dark-theme":s&&this.setDarkTheme(JSON.parse(s));break;case"mode":this._themeManager.setMode(s);break}}}customElements.get("courier-inbox")||customElements.define("courier-inbox",Ue);class et extends Te{constructor(e){super();a(this,"_themeSubscription");a(this,"_container");a(this,"_triggerButton");a(this,"_unreadCountBadge");this._themeSubscription=e.subscribe(t=>{this.updateTheme()})}defaultElement(){this._container=document.createElement("div"),this._container.className="menu-button-container",this._triggerButton=new re(C.inbox),this._unreadCountBadge=new Re({themeBus:this._themeSubscription.manager,location:"button"}),this._unreadCountBadge.id="unread-badge";const e=document.createElement("style");return e.textContent=this.getStyles(),this._container.appendChild(e),this._container.appendChild(this._triggerButton),this._container.appendChild(this._unreadCountBadge),this.shadow.appendChild(this._container),this.updateTheme(),this._container}getStyles(){return`
|
|
585
|
+
.menu-button-container {
|
|
586
|
+
position: relative;
|
|
587
|
+
display: inline-block;
|
|
588
|
+
}
|
|
589
|
+
|
|
590
|
+
#unread-badge {
|
|
591
|
+
position: absolute;
|
|
592
|
+
top: -8px;
|
|
593
|
+
left: 50%;
|
|
594
|
+
pointer-events: none;
|
|
595
|
+
}
|
|
596
|
+
`}onUnreadCountChange(e){var t;(t=this._unreadCountBadge)==null||t.setCount(e),this.updateTheme()}updateTheme(){var t,s,o,n,h,d,c,u,g,p,x,_,b,v,k,w,S,M;const e=this._themeSubscription.manager.getTheme();(n=this._triggerButton)==null||n.updateIconColor(((o=(s=(t=e==null?void 0:e.popup)==null?void 0:t.button)==null?void 0:s.icon)==null?void 0:o.color)??r.black[500]),(u=this._triggerButton)==null||u.updateIconSVG(((c=(d=(h=e==null?void 0:e.popup)==null?void 0:h.button)==null?void 0:d.icon)==null?void 0:c.svg)??C.inbox),(x=this._triggerButton)==null||x.updateBackgroundColor(((p=(g=e==null?void 0:e.popup)==null?void 0:g.button)==null?void 0:p.backgroundColor)??"transparent"),(v=this._triggerButton)==null||v.updateHoverBackgroundColor(((b=(_=e==null?void 0:e.popup)==null?void 0:_.button)==null?void 0:b.hoverBackgroundColor)??r.black[50010]),(S=this._triggerButton)==null||S.updateActiveBackgroundColor(((w=(k=e==null?void 0:e.popup)==null?void 0:k.button)==null?void 0:w.activeBackgroundColor)??r.black[50020]),(M=this._unreadCountBadge)==null||M.refreshTheme("button")}disconnectedCallback(){this._themeSubscription.unsubscribe()}}customElements.get("courier-inbox-menu-button")||customElements.define("courier-inbox-menu-button",et);class tt extends HTMLElement{constructor(){super();a(this,"_width","440px");a(this,"_height","440px");a(this,"_popupAlignment","top-right");a(this,"_top","40px");a(this,"_right","0");a(this,"_bottom","40px");a(this,"_left","0");a(this,"_themeManager",new Ne(ne));a(this,"_triggerButton");a(this,"_popup");a(this,"_inbox");a(this,"_style");a(this,"_datastoreListener");a(this,"_popupMenuButtonFactory");const e=this.attachShadow({mode:"open"});this._triggerButton=new et(this._themeManager),this._triggerButton.build(void 0),this._popup=document.createElement("div"),this._popup.className="popup",this._inbox=new Ue(this._themeManager),this._inbox.setAttribute("height","100%"),this._style=document.createElement("style"),this.refreshTheme(),e.appendChild(this._style),e.appendChild(this._triggerButton),e.appendChild(this._popup),this._popup.appendChild(this._inbox),this._triggerButton.addEventListener("click",this.togglePopup.bind(this)),document.addEventListener("click",this.handleOutsideClick.bind(this)),this.updatePopupPosition(),this._datastoreListener=new Oe(this),A.shared.addDataStoreListener(this._datastoreListener),this._themeManager.subscribe(t=>{this.refreshTheme()})}get theme(){return this._themeManager.getTheme()}setLightTheme(e){this._themeManager.setLightTheme(e)}setDarkTheme(e){this._themeManager.setDarkTheme(e)}static get observedAttributes(){return["popup-alignment","message-click","message-action-click","message-long-press","popup-width","popup-height","top","right","bottom","left","light-theme","dark-theme","mode"]}refreshTheme(){this._style.textContent=this.getStyles()}getStyles(){var e,t,s,o,n,h,d,c;return`
|
|
597
|
+
:host {
|
|
598
|
+
display: inline-block;
|
|
599
|
+
position: relative;
|
|
600
|
+
}
|
|
601
|
+
|
|
602
|
+
.menu-button-container {
|
|
603
|
+
position: relative;
|
|
604
|
+
display: inline-block;
|
|
605
|
+
}
|
|
606
|
+
|
|
607
|
+
.popup {
|
|
608
|
+
display: none;
|
|
609
|
+
position: absolute;
|
|
610
|
+
background: ${((t=(e=this.theme.popup)==null?void 0:e.window)==null?void 0:t.backgroundColor)??"red"};
|
|
611
|
+
border-radius: ${((o=(s=this.theme.popup)==null?void 0:s.window)==null?void 0:o.borderRadius)??"8px"};
|
|
612
|
+
border: ${((h=(n=this.theme.popup)==null?void 0:n.window)==null?void 0:h.border)??"1px solid red"};
|
|
613
|
+
box-shadow: ${((c=(d=this.theme.popup)==null?void 0:d.window)==null?void 0:c.shadow)??"0px 8px 16px -4px red"};
|
|
614
|
+
z-index: 1000;
|
|
615
|
+
width: ${this._width};
|
|
616
|
+
height: ${this._height};
|
|
617
|
+
overflow: hidden;
|
|
618
|
+
transform: translateZ(0);
|
|
619
|
+
will-change: transform;
|
|
620
|
+
}
|
|
621
|
+
|
|
622
|
+
#unread-badge {
|
|
623
|
+
position: absolute;
|
|
624
|
+
top: -8px;
|
|
625
|
+
left: 50%;
|
|
626
|
+
pointer-events: none;
|
|
627
|
+
}
|
|
628
|
+
|
|
629
|
+
courier-inbox {
|
|
630
|
+
height: 100%;
|
|
631
|
+
}
|
|
632
|
+
`}attributeChangedCallback(e,t,s){switch(e){case"popup-alignment":this.isValidPosition(s)&&(this._popupAlignment=s,this.updatePopupPosition());break;case"popup-width":this._width=s,this.setSize(s,this._height);break;case"popup-height":this._height=s,this.setSize(this._width,s);break;case"top":this._top=s,this.updatePopupPosition();break;case"right":this._right=s,this.updatePopupPosition();break;case"bottom":this._bottom=s,this.updatePopupPosition();break;case"left":this._left=s,this.updatePopupPosition();break;case"light-theme":s&&this.setLightTheme(JSON.parse(s));break;case"dark-theme":s&&this.setDarkTheme(JSON.parse(s));break;case"mode":this._themeManager.setMode(s);break}}onUnreadCountChange(e){this.render()}onMessageClick(e){this._inbox.onMessageClick(e)}onMessageActionClick(e){this._inbox.onMessageActionClick(e)}onMessageLongPress(e){this._inbox.onMessageLongPress(e)}isValidPosition(e){return["top-right","top-left","top-center","bottom-right","bottom-left","bottom-center","center-right","center-left","center-center"].includes(e)}updatePopupPosition(){switch(this._popup.style.top="",this._popup.style.bottom="",this._popup.style.left="",this._popup.style.right="",this._popup.style.margin="",this._popup.style.transform="",this._popupAlignment){case"top-right":this._popup.style.top=this._top,this._popup.style.right=this._right;break;case"top-left":this._popup.style.top=this._top,this._popup.style.left=this._left;break;case"top-center":this._popup.style.top=this._top,this._popup.style.left="50%",this._popup.style.transform="translateX(-50%)";break;case"bottom-right":this._popup.style.bottom=this._bottom,this._popup.style.right=this._right;break;case"bottom-left":this._popup.style.bottom=this._bottom,this._popup.style.left=this._left;break;case"bottom-center":this._popup.style.bottom=this._bottom,this._popup.style.left="50%",this._popup.style.transform="translateX(-50%)";break;case"center-right":this._popup.style.top="50%",this._popup.style.right=this._right,this._popup.style.transform="translateY(-50%)";break;case"center-left":this._popup.style.top="50%",this._popup.style.left=this._left,this._popup.style.transform="translateY(-50%)";break;case"center-center":this._popup.style.top="50%",this._popup.style.left="50%",this._popup.style.transform="translate(-50%, -50%)";break}}togglePopup(e){e.stopPropagation(),this._popup.style.display==="block"?this._popup.style.display="none":this._popup.style.display="block"}handleOutsideClick(e){this.contains(e.target)||(this._popup.style.display="none")}setContent(e){this._inbox.innerHTML="",this._inbox.appendChild(e)}setSize(e,t){this._width=e,this._height=t,this._popup.style.width=e,this._popup.style.height=t}setPosition(e){var t,s;this.isValidPosition(e)?(this._popupAlignment=e,this.updatePopupPosition()):(s=(t=f.Courier.shared.client)==null?void 0:t.options.logger)==null||s.error(`Invalid position: ${e}`)}setFeedType(e){this._inbox.setFeedType(e)}setPopupHeader(e){this._inbox.setHeader(e)}removePopupHeader(){this._inbox.removeHeader()}setPopupLoadingState(e){this._inbox.setLoadingState(e)}setPopupEmptyState(e){this._inbox.setEmptyState(e)}setPopupErrorState(e){this._inbox.setErrorState(e)}setPopupListItem(e){this._inbox.setListItem(e)}setPopupPaginationItem(e){this._inbox.setPaginationItem(e)}setPopupMenuButton(e){this._popupMenuButtonFactory=e,this.render()}render(){const e=A.shared.unreadCount;switch(this._popupMenuButtonFactory){case void 0:case null:this._triggerButton.build(void 0),this._triggerButton.onUnreadCountChange(e);break;default:const t=this._popupMenuButtonFactory({unreadCount:e});this._triggerButton.build(t);break}}disconnectedCallback(){var e;(e=this._datastoreListener)==null||e.remove(),this._themeManager.cleanup()}}customElements.get("courier-inbox-menu")||customElements.define("courier-inbox-menu",tt);class Oo{onDataSetChange(i,e){}onPageAdded(i,e){}onUnreadCountChange(i){}onMessageAdd(i,e,t){}onMessageRemove(i,e,t){}onMessageUpdate(i,e,t){}onError(i){}}E.CourierInbox=Ue,E.CourierInboxDataStoreListener=Oe,E.CourierInboxDatastore=A,E.CourierInboxDatastoreEvents=Oo,E.CourierInboxHeader=ze,E.CourierInboxMenu=tt,E.CourierInboxThemeManager=Ne,E.CourierListItem=De,E.archiveMessage=Ro,E.clickMessage=Ho,E.defaultDarkTheme=Ae,E.defaultLightTheme=ne,E.getMessageTime=We,E.markAsRead=Do,E.markAsUnread=Fo,E.mergeTheme=Je,E.openMessage=zo,Object.defineProperty(E,Symbol.toStringTag,{value:"Module"})});
|