@trycourier/courier-ui-inbox 1.0.1-beta → 1.0.3-beta

package/dist/index.es.js

@@ -1,8 +1,910 @@
-var Lo = Object.defineProperty;
-var To = (g, i, e) => i in g ? Lo(g, i, { enumerable: !0, configurable: !0, writable: !0, value: e }) : g[i] = e;
-var a = (g, i, e) => To(g, typeof i != "symbol" ? i + "" : i, e);
-import { Courier as C } from "@trycourier/courier-js";
-var Bo = Object.defineProperty, Ao = (g, i, e) => i in g ? Bo(g, i, { enumerable: !0, configurable: !0, writable: !0, value: e }) : g[i] = e, L = (g, i, e) => Ao(g, typeof i != "symbol" ? i + "" : i, e);
+var qo = Object.defineProperty;
+var Vo = (h, t, e) => t in h ? qo(h, t, { enumerable: !0, configurable: !0, writable: !0, value: e }) : h[t] = e;
+var a = (h, t, e) => Vo(h, typeof t != "symbol" ? t + "" : t, e);
+var jo = Object.defineProperty, Zo = (h, t, e) => t in h ? jo(h, t, { enumerable: !0, configurable: !0, writable: !0, value: e }) : h[t] = e, T = (h, t, e) => Zo(h, typeof t != "symbol" ? t + "" : t, e);
+const ko = class wo {
+  constructor(t, e) {
+    T(this, "webSocket", null), T(this, "pingInterval", null), T(this, "onOpen"), T(this, "onMessageReceived"), T(this, "onClose"), T(this, "onError"), T(this, "url"), T(this, "options"), this.url = t, this.options = e;
+  }
+  /**
+   * Dynamically checks if the WebSocket is connected
+   */
+  get isConnected() {
+    return this.webSocket !== null;
+  }
+  async connect() {
+    return this.disconnect(), new Promise((t, e) => {
+      try {
+        this.webSocket = new WebSocket(this.url), this.webSocket.onopen = () => {
+          var i;
+          (i = this.onOpen) == null || i.call(this), t();
+        }, this.webSocket.onmessage = (i) => {
+          var s;
+          (s = this.onMessageReceived) == null || s.call(this, i.data);
+        }, this.webSocket.onclose = (i) => {
+          var s;
+          this.webSocket = null, (s = this.onClose) == null || s.call(this, i.code, i.reason);
+        }, this.webSocket.onerror = (i) => {
+          var s;
+          this.webSocket = null;
+          const o = new Error("Courier Socket connection failed");
+          o.originalEvent = i, (s = this.onError) == null || s.call(this, o), e(o);
+        };
+      } catch (i) {
+        this.webSocket = null, e(i);
+      }
+    });
+  }
+  disconnect() {
+    this.stopPing(), this.webSocket && (this.webSocket.close(wo.NORMAL_CLOSURE_STATUS), this.webSocket = null);
+  }
+  async send(t) {
+    if (!this.webSocket)
+      return !1;
+    const e = JSON.stringify(t);
+    return this.webSocket.send(e) !== void 0;
+  }
+  keepAlive(t) {
+    this.stopPing(), this.pingInterval = setInterval(async () => {
+      var e;
+      try {
+        await this.send({ action: "keepAlive" });
+      } catch (i) {
+        (e = this.options.logger) == null || e.error("Error occurred on Keep Alive:", i);
+      }
+    }, (t == null ? void 0 : t.intervalInMillis) ?? 3e5);
+  }
+  stopPing() {
+    this.pingInterval && (clearInterval(this.pingInterval), this.pingInterval = null);
+  }
+};
+T(ko, "NORMAL_CLOSURE_STATUS", 1e3);
+let Jo = ko;
+const yo = (h) => ({
+  courier: {
+    rest: (h == null ? void 0 : h.courier.rest) || "https://api.courier.com",
+    graphql: (h == null ? void 0 : h.courier.graphql) || "https://api.courier.com/client/q"
+  },
+  inbox: {
+    graphql: (h == null ? void 0 : h.inbox.graphql) || "https://inbox.courier.com/q",
+    webSocket: (h == null ? void 0 : h.inbox.webSocket) || "wss://realtime.courier.com"
+  }
+});
+class Go {
+  constructor(t) {
+    T(this, "PREFIX", "[COURIER]"), this.showLogs = t;
+  }
+  warn(t, ...e) {
+    this.showLogs && console.warn(`${this.PREFIX} ${t}`, ...e);
+  }
+  log(t, ...e) {
+    this.showLogs && console.log(`${this.PREFIX} ${t}`, ...e);
+  }
+  error(t, ...e) {
+    this.showLogs && console.error(`${this.PREFIX} ${t}`, ...e);
+  }
+  debug(t, ...e) {
+    this.showLogs && console.debug(`${this.PREFIX} ${t}`, ...e);
+  }
+  info(t, ...e) {
+    this.showLogs && console.info(`${this.PREFIX} ${t}`, ...e);
+  }
+}
+class Ae {
+  static generate(t) {
+    const e = Math.random().toString(36).substring(2, 15) + Math.random().toString(36).substring(2, 15);
+    return t ? t + e : e;
+  }
+}
+class Pe extends Error {
+  constructor(t, e, i) {
+    super(e), this.code = t, this.type = i, this.name = "CourierRequestError";
+  }
+}
+function So(h, t, e, i) {
+  h.log(`
+📡 New Courier ${e} Request: ${t}
+URL: ${i.url}
+${i.method ? `Method: ${i.method}` : ""}
+${i.query ? `Query: ${i.query}` : ""}
+${i.variables ? `Variables: ${JSON.stringify(i.variables, null, 2)}` : ""}
+Headers: ${JSON.stringify(i.headers, null, 2)}
+Body: ${i.body ? JSON.stringify(i.body, null, 2) : "Empty"}
+  `);
+}
+function Io(h, t, e, i) {
+  h.log(`
+📡 New Courier ${e} Response: ${t}
+Status Code: ${i.status}
+Response JSON: ${JSON.stringify(i.response, null, 2)}
+  `);
+}
+async function K(h) {
+  const t = h.validCodes ?? [200], e = h.options.showLogs ? Ae.generate() : void 0, i = new Request(h.url, {
+    method: h.method,
+    headers: {
+      "Content-Type": "application/json",
+      ...h.headers
+    },
+    body: h.body ? JSON.stringify(h.body) : void 0
+  });
+  e && So(h.options.logger, e, "HTTP", {
+    url: i.url,
+    method: i.method,
+    headers: Object.fromEntries(i.headers.entries()),
+    body: h.body
+  });
+  const s = await fetch(i);
+  if (s.status === 204)
+    return;
+  let o;
+  try {
+    o = await s.json();
+  } catch {
+    if (s.status === 200)
+      return;
+    throw new Pe(
+      s.status,
+      "Failed to parse response as JSON",
+      "PARSE_ERROR"
+    );
+  }
+  if (e && Io(h.options.logger, e, "HTTP", {
+    status: s.status,
+    response: o
+  }), !t.includes(s.status))
+    throw new Pe(
+      s.status,
+      (o == null ? void 0 : o.message) || "Unknown Error",
+      o == null ? void 0 : o.type
+    );
+  return o;
+}
+async function Z(h) {
+  const t = h.options.showLogs ? Ae.generate() : void 0;
+  t && So(h.options.logger, t, "GraphQL", {
+    url: h.url,
+    headers: h.headers,
+    query: h.query,
+    variables: h.variables
+  });
+  const e = await fetch(h.url, {
+    method: "POST",
+    headers: {
+      "Content-Type": "application/json",
+      ...h.headers
+    },
+    body: JSON.stringify({
+      query: h.query,
+      variables: h.variables
+    })
+  });
+  let i;
+  try {
+    i = await e.json();
+  } catch {
+    throw new Pe(
+      e.status,
+      "Failed to parse response as JSON",
+      "PARSE_ERROR"
+    );
+  }
+  if (t && Io(h.options.logger, t, "GraphQL", {
+    status: e.status,
+    response: i
+  }), !e.ok)
+    throw new Pe(
+      e.status,
+      (i == null ? void 0 : i.message) || "Unknown Error",
+      i == null ? void 0 : i.type
+    );
+  return i;
+}
+class re {
+  constructor(t) {
+    this.options = t;
+  }
+}
+class Wo extends re {
+  /**
+   * Get a brand by ID using GraphQL
+   * @param brandId - The ID of the brand to retrieve
+   * @returns Promise resolving to the requested brand
+   */
+  async getBrand(t) {
+    const e = `
+      query GetBrand {
+        brand(brandId: "${t.brandId}") {
+          settings {
+            colors {
+              primary
+              secondary
+              tertiary
+            }
+            inapp {
+              borderRadius
+              disableCourierFooter
+            }
+          }
+        }
+      }
+    `;
+    return (await Z({
+      options: this.options,
+      url: this.options.apiUrls.courier.graphql,
+      headers: {
+        "x-courier-user-id": this.options.userId,
+        "x-courier-client-key": "empty",
+        // Empty for now. Will be removed in future.
+        Authorization: `Bearer ${this.options.accessToken}`
+      },
+      query: e,
+      variables: { brandId: t.brandId }
+    })).data.brand;
+  }
+}
+class ze extends Jo {
+  constructor(t) {
+    const e = ze.buildUrl(t);
+    super(e, t), T(this, "receivedMessage"), T(this, "receivedMessageEvent"), this.onMessageReceived = (i) => this.convertToType(i);
+  }
+  convertToType(t) {
+    var e, i, s, o;
+    try {
+      switch (JSON.parse(t).type) {
+        case "event":
+          const c = JSON.parse(t);
+          (e = this.receivedMessageEvent) == null || e.call(this, c);
+          break;
+        case "message":
+          const d = JSON.parse(t);
+          (i = this.receivedMessage) == null || i.call(this, d);
+          break;
+      }
+    } catch (n) {
+      (s = this.options.logger) == null || s.error("Error parsing socket message", n), n instanceof Error && ((o = this.onError) == null || o.call(this, n));
+    }
+  }
+  async sendSubscribe(t) {
+    var e;
+    const i = {
+      action: "subscribe",
+      data: {
+        userAgent: "courier-js",
+        // TODO: Equivalent to Courier.agent.value()
+        channel: this.options.userId,
+        event: "*",
+        version: (t == null ? void 0 : t.version) ?? 5
+      }
+    };
+    this.options.connectionId && (i.data.clientSourceId = this.options.connectionId), this.options.tenantId && (i.data.accountId = this.options.tenantId), (e = this.options.logger) == null || e.debug("Sending subscribe request", i), await this.send(i);
+  }
+  static buildUrl(t) {
+    var e;
+    let i = ((e = t.apiUrls) == null ? void 0 : e.inbox.webSocket) ?? "";
+    return t.accessToken && (i += `/?auth=${t.accessToken}`), i;
+  }
+}
+class Ko extends re {
+  constructor(t) {
+    super(t), T(this, "socket"), this.socket = new ze(t);
+  }
+  /**
+   * Get paginated messages
+   * @param paginationLimit - Number of messages to return per page (default: 24)
+   * @param startCursor - Cursor for pagination
+   * @returns Promise resolving to paginated messages response
+   */
+  async getMessages(t) {
+    const e = `
+      query GetInboxMessages(
+        $params: FilterParamsInput = { ${this.options.tenantId ? `accountId: "${this.options.tenantId}"` : ""} }
+        $limit: Int = ${(t == null ? void 0 : t.paginationLimit) ?? 24}
+        $after: String ${t != null && t.startCursor ? `= "${t.startCursor}"` : ""}
+      ) {
+        count(params: $params)
+        messages(params: $params, limit: $limit, after: $after) {
+          totalCount
+          pageInfo {
+            startCursor
+            hasNextPage
+          }
+          nodes {
+            messageId
+            read
+            archived
+            created
+            opened
+            title
+            preview
+            data
+            tags
+            trackingIds {
+              clickTrackingId
+            }
+            actions {
+              content
+              data
+              href
+            }
+          }
+        }
+      }
+    `;
+    return await Z({
+      options: this.options,
+      query: e,
+      headers: {
+        "x-courier-user-id": this.options.userId,
+        Authorization: `Bearer ${this.options.accessToken}`
+      },
+      url: this.options.apiUrls.inbox.graphql
+    });
+  }
+  /**
+   * Get paginated archived messages
+   * @param paginationLimit - Number of messages to return per page (default: 24)
+   * @param startCursor - Cursor for pagination
+   * @returns Promise resolving to paginated archived messages response
+   */
+  async getArchivedMessages(t) {
+    const e = `
+      query GetInboxMessages(
+        $params: FilterParamsInput = { ${this.options.tenantId ? `accountId: "${this.options.tenantId}"` : ""}, archived: true }
+        $limit: Int = ${(t == null ? void 0 : t.paginationLimit) ?? 24}
+        $after: String ${t != null && t.startCursor ? `= "${t.startCursor}"` : ""}
+      ) {
+        count(params: $params)
+        messages(params: $params, limit: $limit, after: $after) {
+          totalCount
+          pageInfo {
+            startCursor
+            hasNextPage
+          }
+          nodes {
+            messageId
+            read
+            archived
+            created
+            opened
+            title
+            preview
+            data
+            tags
+            trackingIds {
+              clickTrackingId
+            }
+            actions {
+              content
+              data
+              href
+            }
+          }
+        }
+      }
+    `;
+    return Z({
+      options: this.options,
+      query: e,
+      headers: {
+        "x-courier-user-id": this.options.userId,
+        Authorization: `Bearer ${this.options.accessToken}`
+      },
+      url: this.options.apiUrls.inbox.graphql
+    });
+  }
+  /**
+   * Get unread message count
+   * @returns Promise resolving to number of unread messages
+   */
+  async getUnreadMessageCount() {
+    var t;
+    const e = `
+      query GetMessages {
+        count(params: { status: "unread" ${this.options.tenantId ? `, accountId: "${this.options.tenantId}"` : ""} })
+      }
+    `;
+    return ((t = (await Z({
+      options: this.options,
+      query: e,
+      headers: {
+        "x-courier-user-id": this.options.userId,
+        Authorization: `Bearer ${this.options.accessToken}`
+      },
+      url: this.options.apiUrls.inbox.graphql
+    })).data) == null ? void 0 : t.count) ?? 0;
+  }
+  /**
+   * Track a click event
+   * @param messageId - ID of the message
+   * @param trackingId - ID for tracking the click
+   * @returns Promise resolving when click is tracked
+   */
+  async click(t) {
+    const e = `
+      mutation TrackEvent {
+        clicked(messageId: "${t.messageId}", trackingId: "${t.trackingId}")
+      }
+    `, i = {
+      "x-courier-user-id": this.options.userId,
+      Authorization: `Bearer ${this.options.accessToken}`
+    };
+    this.options.connectionId && (i["x-courier-client-source-id"] = this.options.connectionId), await Z({
+      options: this.options,
+      query: e,
+      headers: i,
+      url: this.options.apiUrls.inbox.graphql
+    });
+  }
+  /**
+   * Mark a message as read
+   * @param messageId - ID of the message to mark as read
+   * @returns Promise resolving when message is marked as read
+   */
+  async read(t) {
+    const e = `
+      mutation TrackEvent {
+        read(messageId: "${t.messageId}")
+      }
+    `, i = {
+      "x-courier-user-id": this.options.userId,
+      Authorization: `Bearer ${this.options.accessToken}`
+    };
+    this.options.connectionId && (i["x-courier-client-source-id"] = this.options.connectionId), await Z({
+      options: this.options,
+      query: e,
+      headers: i,
+      url: this.options.apiUrls.inbox.graphql
+    });
+  }
+  /**
+   * Mark a message as unread
+   * @param messageId - ID of the message to mark as unread
+   * @returns Promise resolving when message is marked as unread
+   */
+  async unread(t) {
+    const e = `
+      mutation TrackEvent {
+        unread(messageId: "${t.messageId}")
+      }
+    `, i = {
+      "x-courier-user-id": this.options.userId,
+      Authorization: `Bearer ${this.options.accessToken}`
+    };
+    this.options.connectionId && (i["x-courier-client-source-id"] = this.options.connectionId), await Z({
+      options: this.options,
+      query: e,
+      headers: i,
+      url: this.options.apiUrls.inbox.graphql
+    });
+  }
+  /**
+   * Mark all messages as read
+   * @returns Promise resolving when all messages are marked as read
+   */
+  async readAll() {
+    const t = `
+      mutation TrackEvent {
+        markAllRead
+      }
+    `, e = {
+      "x-courier-user-id": this.options.userId,
+      Authorization: `Bearer ${this.options.accessToken}`
+    };
+    this.options.connectionId && (e["x-courier-client-source-id"] = this.options.connectionId), await Z({
+      options: this.options,
+      query: t,
+      headers: e,
+      url: this.options.apiUrls.inbox.graphql
+    });
+  }
+  /**
+   * Mark a message as opened
+   * @param messageId - ID of the message to mark as opened
+   * @returns Promise resolving when message is marked as opened
+   */
+  async open(t) {
+    const e = `
+      mutation TrackEvent {
+        opened(messageId: "${t.messageId}")
+      }
+    `, i = {
+      "x-courier-user-id": this.options.userId,
+      Authorization: `Bearer ${this.options.accessToken}`
+    };
+    this.options.connectionId && (i["x-courier-client-source-id"] = this.options.connectionId), await Z({
+      options: this.options,
+      query: e,
+      headers: i,
+      url: this.options.apiUrls.inbox.graphql
+    });
+  }
+  /**
+   * Archive a message
+   * @param messageId - ID of the message to archive
+   * @returns Promise resolving when message is archived
+   */
+  async archive(t) {
+    const e = `
+      mutation TrackEvent {
+        archive(messageId: "${t.messageId}")
+      }
+    `, i = {
+      "x-courier-user-id": this.options.userId,
+      Authorization: `Bearer ${this.options.accessToken}`
+    };
+    this.options.connectionId && (i["x-courier-client-source-id"] = this.options.connectionId), await Z({
+      options: this.options,
+      query: e,
+      headers: i,
+      url: this.options.apiUrls.inbox.graphql
+    });
+  }
+  /**
+   * Archive all read messages.
+   */
+  async archiveRead() {
+    const t = `
+      mutation TrackEvent {
+        archiveRead
+      }
+    `, e = {
+      "x-courier-user-id": this.options.userId,
+      Authorization: `Bearer ${this.options.accessToken}`
+    };
+    this.options.connectionId && (e["x-courier-client-source-id"] = this.options.connectionId), await Z({
+      options: this.options,
+      query: t,
+      headers: e,
+      url: this.options.apiUrls.inbox.graphql
+    });
+  }
+}
+class Xo {
+  /**
+   * Transforms a single API response item to the CourierUserPreferencesTopic type
+   * @param item - The API response item
+   * @returns A CourierUserPreferencesTopic object
+   */
+  transformItem(t) {
+    return {
+      topicId: t.topic_id,
+      topicName: t.topic_name,
+      sectionId: t.section_id,
+      sectionName: t.section_name,
+      status: t.status,
+      defaultStatus: t.default_status,
+      hasCustomRouting: t.has_custom_routing,
+      customRouting: t.custom_routing || []
+    };
+  }
+  /**
+   * Transforms an array of API response items to CourierUserPreferencesTopic objects
+   * @param items - The API response items
+   * @returns A generator of CourierUserPreferencesTopic objects
+   */
+  *transform(t) {
+    for (const e of t)
+      yield this.transformItem(e);
+  }
+}
+function Qo(h) {
+  const t = atob(h), e = new Uint8Array(t.length);
+  for (let i = 0; i < t.length; i++)
+    e[i] = t.charCodeAt(i);
+  return String.fromCharCode(...e);
+}
+function Yo(h) {
+  const t = new Uint8Array(h.length);
+  for (let e = 0; e < h.length; e++)
+    t[e] = h.charCodeAt(e);
+  return btoa(String.fromCharCode(...t));
+}
+class en extends re {
+  constructor() {
+    super(...arguments), T(this, "transformer", new Xo());
+  }
+  /**
+   * Get all preferences for a user
+   * @param paginationCursor - Optional cursor for pagination
+   * @returns Promise resolving to user preferences
+   * @see https://www.courier.com/docs/reference/user-preferences/list-all-user-preferences
+   */
+  async getUserPreferences(t) {
+    let e = `${this.options.apiUrls.courier.rest}/users/${this.options.userId}/preferences`;
+    t != null && t.paginationCursor && (e += `?cursor=${t.paginationCursor}`);
+    const s = await K({
+      options: this.options,
+      url: e,
+      method: "GET",
+      headers: {
+        Authorization: `Bearer ${this.options.accessToken}`
+      }
+    });
+    return {
+      items: [...this.transformer.transform(s.items)],
+      paging: s.paging
+    };
+  }
+  /**
+   * Get preferences for a specific topic
+   * @param topicId - The ID of the topic to get preferences for
+   * @returns Promise resolving to topic preferences
+   * @see https://www.courier.com/docs/reference/user-preferences/get-subscription-topic-preferences
+   */
+  async getUserPreferenceTopic(t) {
+    const i = await K({
+      options: this.options,
+      url: `${this.options.apiUrls.courier.rest}/users/${this.options.userId}/preferences/${t.topicId}`,
+      method: "GET",
+      headers: {
+        Authorization: `Bearer ${this.options.accessToken}`
+      }
+    });
+    return this.transformer.transformItem(i.topic);
+  }
+  /**
+   * Update preferences for a specific topic
+   * @param topicId - The ID of the topic to update preferences for
+   * @param status - The new status for the topic
+   * @param hasCustomRouting - Whether the topic has custom routing
+   * @param customRouting - The custom routing channels for the topic
+   * @returns Promise resolving when update is complete
+   * @see https://www.courier.com/docs/reference/user-preferences/update-subscription-topic-preferences
+   */
+  async putUserPreferenceTopic(t) {
+    const e = {
+      topic: {
+        status: t.status,
+        has_custom_routing: t.hasCustomRouting,
+        custom_routing: t.customRouting
+      }
+    };
+    await K({
+      options: this.options,
+      url: `${this.options.apiUrls.courier.rest}/users/${this.options.userId}/preferences/${t.topicId}`,
+      method: "PUT",
+      headers: {
+        Authorization: `Bearer ${this.options.accessToken}`
+      },
+      body: e
+    });
+  }
+  /**
+   * Get the notification center URL
+   * @param clientKey - The client key to use for the URL
+   * @returns The notification center URL
+   */
+  getNotificationCenterUrl(t) {
+    const e = Qo(t.clientKey);
+    return `https://view.notificationcenter.app/p/${Yo(`${e}#${this.options.userId}${this.options.tenantId ? `#${this.options.tenantId}` : ""}#false`)}`;
+  }
+}
+class tn extends re {
+  /**
+   * Store a push notification token for a user
+   * @param token - The push notification token
+   * @param provider - The provider of the token
+   * @param device - The device information
+   * @see https://www.courier.com/docs/reference/token-management/put-token
+   */
+  async putUserToken(t) {
+    const e = {
+      provider_key: t.provider,
+      ...t.device && {
+        device: {
+          app_id: t.device.appId,
+          ad_id: t.device.adId,
+          device_id: t.device.deviceId,
+          platform: t.device.platform,
+          manufacturer: t.device.manufacturer,
+          model: t.device.model
+        }
+      }
+    };
+    await K({
+      options: this.options,
+      url: `${this.options.apiUrls.courier.rest}/users/${this.options.userId}/tokens/${t.token}`,
+      method: "PUT",
+      headers: {
+        Authorization: `Bearer ${this.options.accessToken}`
+      },
+      body: e,
+      validCodes: [200, 204]
+    });
+  }
+  /**
+   * Delete a push notification token for a user
+   * @param token - The push notification token
+   * @returns Promise resolving when token is deleted
+   */
+  async deleteUserToken(t) {
+    await K({
+      options: this.options,
+      url: `${this.options.apiUrls.courier.rest}/users/${this.options.userId}/tokens/${t.token}`,
+      method: "DELETE",
+      headers: {
+        Authorization: `Bearer ${this.options.accessToken}`
+      },
+      validCodes: [200, 204]
+    });
+  }
+}
+class sn extends re {
+  /**
+   * Subscribe a user to a list
+   * @param listId - The ID of the list to subscribe to
+   * @returns Promise resolving when subscription is complete
+   * @see https://www.courier.com/docs/reference/lists/recipient-subscribe
+   */
+  async putSubscription(t) {
+    return await K({
+      url: `${this.options.apiUrls.courier.rest}/lists/${t.listId}/subscriptions/${this.options.userId}`,
+      options: this.options,
+      method: "PUT",
+      headers: {
+        Authorization: `Bearer ${this.options.accessToken}`
+      }
+    });
+  }
+  /**
+   * Unsubscribe a user from a list
+   * @param listId - The ID of the list to unsubscribe from
+   * @returns Promise resolving when unsubscription is complete
+   * @see https://www.courier.com/docs/reference/lists/delete-subscription
+   */
+  async deleteSubscription(t) {
+    return await K({
+      url: `${this.options.apiUrls.courier.rest}/lists/${t.listId}/subscriptions/${this.options.userId}`,
+      options: this.options,
+      method: "DELETE",
+      headers: {
+        Authorization: `Bearer ${this.options.accessToken}`
+      }
+    });
+  }
+}
+class on extends re {
+  /**
+   * Post an inbound courier event
+   * @param event - The event type: Example: "New Order Placed"
+   * @param messageId - The message ID
+   * @param type - The type of event: Available options: "track"
+   * @param properties - The properties of the event
+   * @returns Promise resolving to the message ID
+   * @see https://www.courier.com/docs/reference/inbound/courier-track-event
+   */
+  async postInboundCourier(t) {
+    return await K({
+      url: `${this.options.apiUrls.courier.rest}/inbound/courier`,
+      options: this.options,
+      method: "POST",
+      headers: {
+        Authorization: `Bearer ${this.options.accessToken}`
+      },
+      body: {
+        ...t,
+        userId: this.options.userId
+      },
+      validCodes: [200, 202]
+    });
+  }
+  /**
+   * Post a tracking URL event
+   * These urls are found in messages sent from Courier
+   * @param url - The URL to post the event to
+   * @param event - The event type: Available options: "click", "open", "unsubscribe"
+   * @returns Promise resolving when the event is posted
+   */
+  async postTrackingUrl(t) {
+    return await K({
+      url: t.url,
+      options: this.options,
+      method: "POST",
+      body: {
+        event: t.event
+      }
+    });
+  }
+}
+class nn extends re {
+  constructor(t) {
+    var e, i;
+    const s = t.showLogs !== void 0 ? t.showLogs : process.env.NODE_ENV === "development", o = {
+      ...t,
+      showLogs: s,
+      apiUrls: t.apiUrls || yo(),
+      accessToken: t.jwt ?? t.publicApiKey
+    };
+    super({
+      ...o,
+      logger: new Go(o.showLogs),
+      apiUrls: yo(o.apiUrls)
+    }), T(this, "tokens"), T(this, "brands"), T(this, "preferences"), T(this, "inbox"), T(this, "lists"), T(this, "tracking"), this.tokens = new tn(this.options), this.brands = new Wo(this.options), this.preferences = new en(this.options), this.inbox = new Ko(this.options), this.lists = new sn(this.options), this.tracking = new on(this.options), !this.options.jwt && !this.options.publicApiKey && this.options.logger.warn("Courier Client initialized with no authentication method. Please provide a JWT or public API key."), this.options.publicApiKey && ((e = this.options.logger) == null || e.warn(
+      `Courier Warning: Public API Keys are for testing only. Please use JWTs for production.
+You can generate a JWT with this endpoint: https://www.courier.com/docs/reference/auth/issue-token
+This endpoint should be called from your backend server, not the SDK.`
+    )), this.options.jwt && this.options.publicApiKey && ((i = this.options.logger) == null || i.warn(
+      "Courier Warning: Both a JWT and a Public API Key were provided. The Public API Key will be ignored."
+    ));
+  }
+}
+class rn {
+  constructor(t) {
+    T(this, "callback"), this.callback = t;
+  }
+  remove() {
+    v.shared.removeAuthenticationListener(this);
+  }
+}
+const Eo = class Me {
+  constructor() {
+    T(this, "id", Ae.generate()), T(this, "instanceClient"), T(this, "_paginationLimit", 24), T(this, "authenticationListeners", []);
+  }
+  get paginationLimit() {
+    return this._paginationLimit;
+  }
+  set paginationLimit(t) {
+    this._paginationLimit = Math.min(Math.max(t, 1), 100);
+  }
+  /**
+   * Get the Courier client instance
+   * @returns The Courier client instance or undefined if not signed in
+   */
+  get client() {
+    return this.instanceClient;
+  }
+  /**
+   * Get the shared Courier instance
+   * @returns The shared Courier instance
+   */
+  static get shared() {
+    return Me.instance || (Me.instance = new Me()), Me.instance;
+  }
+  /**
+   * Sign in to Courier
+   * @param options - The options for the Courier client
+   */
+  signIn(t) {
+    const e = t.connectionId ?? Ae.generate();
+    this.instanceClient = new nn({ ...t, connectionId: e }), this.notifyAuthenticationListeners({ userId: t.userId });
+  }
+  /**
+   * Sign out of Courier
+   */
+  signOut() {
+    this.instanceClient = void 0, this.notifyAuthenticationListeners({ userId: void 0 });
+  }
+  /**
+   * Register a callback to be notified of authentication state changes
+   * @param callback - Function to be called when authentication state changes
+   * @returns AuthenticationListener instance that can be used to remove the listener
+   */
+  addAuthenticationListener(t) {
+    var e;
+    (e = this.instanceClient) == null || e.options.logger.info("Adding authentication listener");
+    const i = new rn(t);
+    return this.authenticationListeners.push(i), i;
+  }
+  /**
+   * Unregister an authentication state change listener
+   * @param listener - The AuthenticationListener instance to remove
+   */
+  removeAuthenticationListener(t) {
+    var e;
+    (e = this.instanceClient) == null || e.options.logger.info("Removing authentication listener"), this.authenticationListeners = this.authenticationListeners.filter((i) => i !== t);
+  }
+  /**
+   * Notify all authentication listeners
+   * @param props - The props to notify the listeners with
+   */
+  notifyAuthenticationListeners(t) {
+    this.authenticationListeners.forEach((e) => e.callback(t));
+  }
+};
+T(Eo, "instance");
+let v = Eo;
+var an = Object.defineProperty, hn = (h, t, e) => t in h ? an(h, t, { enumerable: !0, configurable: !0, writable: !0, value: e }) : h[t] = e, $ = (h, t, e) => hn(h, typeof t != "symbol" ? t + "" : t, e);
 const r = {
   black: {
     500: "#171717",
@@ -24,7 +926,7 @@ const r = {
     400: "#60A5FA",
     500: "#2563EB"
   }
-}, G = {
+}, W = {
   light: {
     colors: {
       primary: r.black[500],
@@ -49,21 +951,21 @@ const r = {
       cornerRadius: "4px"
     }
   }
-}, go = () => typeof window > "u" ? "light" : window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light", mo = (g) => {
+}, Mo = () => typeof window > "u" ? "light" : window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light", To = (h) => {
   if (typeof window > "u")
     return () => {
     };
-  const i = window.matchMedia("(prefers-color-scheme: dark)"), e = (t) => {
-    g(t.matches ? "dark" : "light");
+  const t = window.matchMedia("(prefers-color-scheme: dark)"), e = (i) => {
+    h(i.matches ? "dark" : "light");
   };
-  return i.addEventListener("change", e), () => {
-    i.removeEventListener("change", e);
+  return t.addEventListener("change", e), () => {
+    t.removeEventListener("change", e);
   };
 };
-class bo extends HTMLElement {
+class $o extends HTMLElement {
   constructor() {
-    super(), L(this, "_currentSystemTheme"), L(this, "_systemThemeCleanup"), this._currentSystemTheme = go(), this._systemThemeCleanup = mo((i) => {
-      this._currentSystemTheme = i, this.onSystemThemeChange(i);
+    super(), $(this, "_currentSystemTheme"), $(this, "_systemThemeCleanup"), this._currentSystemTheme = Mo(), this._systemThemeCleanup = To((t) => {
+      this._currentSystemTheme = t, this.onSystemThemeChange(t);
     });
   }
   get currentSystemTheme() {
@@ -72,47 +974,47 @@ class bo extends HTMLElement {
   disconnectedCallback() {
     this._systemThemeCleanup && this._systemThemeCleanup();
   }
-  onSystemThemeChange(i) {
+  onSystemThemeChange(t) {
   }
 }
-const Te = {
+const Fe = {
   borderRadius: "4px",
   fontSize: "14px"
-}, ee = {
-  primary: (g) => ({
-    ...Te,
-    backgroundColor: G[g].colors.primary,
-    textColor: G[g].colors.secondary,
+}, se = {
+  primary: (h) => ({
+    ...Fe,
+    backgroundColor: W[h].colors.primary,
+    textColor: W[h].colors.secondary,
     fontWeight: "500",
     shadow: "none"
   }),
-  secondary: (g) => ({
-    ...Te,
-    backgroundColor: G[g].colors.secondary,
-    textColor: G[g].colors.primary,
+  secondary: (h) => ({
+    ...Fe,
+    backgroundColor: W[h].colors.secondary,
+    textColor: W[h].colors.primary,
     fontWeight: "500",
-    border: `1px solid ${G[g].colors.border}`,
-    shadow: g === "light" ? "0px 1px 2px 0px rgba(0, 0, 0, 0.06)" : "0px 1px 2px 0px rgba(255, 255, 255, 0.1)"
+    border: `1px solid ${W[h].colors.border}`,
+    shadow: h === "light" ? "0px 1px 2px 0px rgba(0, 0, 0, 0.06)" : "0px 1px 2px 0px rgba(255, 255, 255, 0.1)"
   }),
-  tertiary: (g) => ({
-    ...Te,
-    backgroundColor: G[g].colors.border,
-    textColor: G[g].colors.primary,
+  tertiary: (h) => ({
+    ...Fe,
+    backgroundColor: W[h].colors.border,
+    textColor: W[h].colors.primary,
     fontWeight: "500",
     border: "none",
     shadow: "none"
   })
 };
-class Ie extends bo {
-  constructor(i) {
-    super(), L(this, "_button"), L(this, "_style");
+class Re extends $o {
+  constructor(t) {
+    super(), $(this, "_button"), $(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();
+    this._button = document.createElement("button"), this._button.setAttribute("part", "button"), this._style = document.createElement("style"), this._style.textContent = this.getStyles(t), e.appendChild(this._style), e.appendChild(this._button), this.updateButton(t), this._button.addEventListener("click", (i) => {
+      i.preventDefault(), i.stopPropagation(), t.onClick && t.onClick();
     });
   }
-  getStyles(i) {
-    const e = () => ee.secondary(this.currentSystemTheme).textColor, t = () => ee.secondary(this.currentSystemTheme).backgroundColor, s = () => ee.secondary(this.currentSystemTheme).border, o = () => ee.secondary(this.currentSystemTheme).shadow, n = () => ee.secondary(this.currentSystemTheme).borderRadius, h = () => ee.secondary(this.currentSystemTheme).fontSize, d = () => ee.secondary(this.currentSystemTheme).fontWeight;
+  getStyles(t) {
+    const e = () => se.secondary(this.currentSystemTheme).textColor, i = () => se.secondary(this.currentSystemTheme).backgroundColor, s = () => se.secondary(this.currentSystemTheme).border, o = () => se.secondary(this.currentSystemTheme).shadow, n = () => se.secondary(this.currentSystemTheme).borderRadius, c = () => se.secondary(this.currentSystemTheme).fontSize, d = () => se.secondary(this.currentSystemTheme).fontWeight;
     return `
       :host {
         display: inline-block;
@@ -120,27 +1022,27 @@ class Ie extends bo {
 
       button {
         border: none;
-        border-radius: ${i.borderRadius ?? n()};
-        font-weight: ${i.fontWeight ?? d()};
-        font-family: ${i.fontFamily ?? "inherit"};
-        font-size: ${i.fontSize ?? h()};
+        border-radius: ${t.borderRadius ?? n()};
+        font-weight: ${t.fontWeight ?? d()};
+        font-family: ${t.fontFamily ?? "inherit"};
+        font-size: ${t.fontSize ?? c()};
         padding: 6px 10px;
         cursor: pointer;
         width: 100%;
         height: 100%;
-        background-color: ${i.backgroundColor ?? t()};
-        color: ${i.textColor ?? e()};
-        border: ${i.border ?? s()};
-        box-shadow: ${i.shadow ?? o()};
+        background-color: ${t.backgroundColor ?? i()};
+        color: ${t.textColor ?? e()};
+        border: ${t.border ?? s()};
+        box-shadow: ${t.shadow ?? o()};
         touch-action: manipulation;
       }
 
       button:hover {
-        ${i.hoverBackgroundColor ? `background-color: ${i.hoverBackgroundColor};` : "filter: brightness(0.9);"}
+        ${t.hoverBackgroundColor ? `background-color: ${t.hoverBackgroundColor};` : "filter: brightness(0.9);"}
       }
 
       button:active {
-        ${i.activeBackgroundColor ? `background-color: ${i.activeBackgroundColor};` : "filter: brightness(0.8);"}
+        ${t.activeBackgroundColor ? `background-color: ${t.activeBackgroundColor};` : "filter: brightness(0.8);"}
       }
 
       button:disabled {
@@ -149,12 +1051,12 @@ class Ie extends bo {
       }
     `;
   }
-  updateButton(i) {
-    i.text && (this._button.textContent = i.text), this._style.textContent = this.getStyles(i);
+  updateButton(t) {
+    t.text && (this._button.textContent = t.text), this._style.textContent = this.getStyles(t);
   }
 }
-customElements.get("courier-button") || customElements.define("courier-button", Ie);
-const f = {
+customElements.get("courier-button") || customElements.define("courier-button", Re);
+const x = {
   inbox: `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
 <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"/>
 </svg>`,
@@ -183,13 +1085,13 @@ const f = {
 <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"/>
 </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();
+class ne extends HTMLElement {
+  constructor(t, e) {
+    super(), $(this, "_color"), $(this, "_svg"), $(this, "_iconContainer"), $(this, "_style"), this._color = t ?? r.black[500], this._svg = e;
+    const i = this.attachShadow({ mode: "open" });
+    this._iconContainer = document.createElement("div"), i.appendChild(this._iconContainer), this._style = document.createElement("style"), this._style.textContent = this.getStyles(this._color), i.appendChild(this._style), this.refresh();
   }
-  getStyles(i) {
+  getStyles(t) {
     return `
       :host {
         display: inline-block;
@@ -202,25 +1104,25 @@ class ie extends HTMLElement {
       svg {
         width: 24px;
         height: 24px;
-        color: ${i};
+        color: ${t};
       }
     `;
   }
   refresh() {
     this._svg && (this._iconContainer.innerHTML = this._svg), this._color && (this._style.textContent = this.getStyles(this._color));
   }
-  updateColor(i) {
-    this._color = i, this.refresh();
+  updateColor(t) {
+    this._color = t, this.refresh();
   }
-  updateSVG(i) {
-    this._svg = i, this.refresh();
+  updateSVG(t) {
+    this._svg = t, this.refresh();
   }
 }
-customElements.get("courier-icon") || customElements.define("courier-icon", ie);
-class Pe extends HTMLElement {
+customElements.get("courier-icon") || customElements.define("courier-icon", ne);
+class Ue extends HTMLElement {
   constructor() {
-    super(), L(this, "link");
-    const i = this.attachShadow({ mode: "open" });
+    super(), $(this, "link");
+    const t = this.attachShadow({ mode: "open" });
     this.link = document.createElement("a"), this.link.setAttribute("part", "link");
     const e = document.createElement("style");
     e.textContent = `
@@ -240,7 +1142,7 @@ class Pe extends HTMLElement {
 
       /* Variants */
       a[data-variant="primary"][data-mode="light"] {
-        color: var(--courier-link-color, ${G.light.colors.link});
+        color: var(--courier-link-color, ${W.light.colors.link});
       }
 
       a[data-variant="primary"][data-mode="light"]:hover {
@@ -252,7 +1154,7 @@ class Pe extends HTMLElement {
       }
 
       a[data-variant="primary"][data-mode="dark"] {
-        color: var(--courier-link-color, ${G.dark.colors.link});
+        color: var(--courier-link-color, ${W.dark.colors.link});
       }
 
       a[data-variant="primary"][data-mode="dark"]:hover {
@@ -272,15 +1174,15 @@ class Pe extends HTMLElement {
         cursor: not-allowed;
         pointer-events: none;
       }
-    `, i.appendChild(e), i.appendChild(this.link), this.updateVariant(), this.updateUnderline(), this.updateMode();
+    `, t.appendChild(e), t.appendChild(this.link), this.updateVariant(), this.updateUnderline(), this.updateMode();
   }
   connectedCallback() {
-    const i = document.createElement("slot");
-    this.link.appendChild(i), this.updateHref();
+    const t = document.createElement("slot");
+    this.link.appendChild(t), this.updateHref();
   }
-  attributeChangedCallback(i, e, t) {
-    if (e !== t)
-      switch (i) {
+  attributeChangedCallback(t, e, i) {
+    if (e !== i)
+      switch (t) {
         case "href":
           this.updateHref();
           break;
@@ -309,39 +1211,39 @@ class Pe extends HTMLElement {
       }
   }
   updateHref() {
-    const i = this.getAttribute("href");
-    i && (this.link.href = i);
+    const t = this.getAttribute("href");
+    t && (this.link.href = t);
   }
   updateVariant() {
-    const i = this.getAttribute("variant") || "primary", e = this.getAttribute("mode") || "light";
-    this.link.setAttribute("data-variant", i), this.link.setAttribute("data-mode", e);
+    const t = this.getAttribute("variant") || "primary", e = this.getAttribute("mode") || "light";
+    this.link.setAttribute("data-variant", t), 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");
+    const t = this.getAttribute("color");
+    t ? this.link.style.setProperty("--courier-link-color", t) : this.link.style.removeProperty("--courier-link-color");
   }
   updateUnderline() {
-    const i = this.getAttribute("underline") === "true";
-    this.link.setAttribute("data-underline", i.toString());
+    const t = this.getAttribute("underline") === "true";
+    this.link.setAttribute("data-underline", t.toString());
   }
   updateMode() {
-    const i = this.getAttribute("mode") || "light";
-    this.link.setAttribute("data-mode", i);
+    const t = this.getAttribute("mode") || "light";
+    this.link.setAttribute("data-mode", t);
   }
   updateTarget() {
-    const i = this.getAttribute("target");
-    i && (this.link.target = i);
+    const t = this.getAttribute("target");
+    t && (this.link.target = t);
   }
   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");
+    const t = this.getAttribute("font-family");
+    t ? this.link.style.setProperty("--courier-link-font-family", t) : 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");
+    const t = this.getAttribute("font-size");
+    t ? this.link.style.setProperty("--courier-link-font-size", t) : this.link.style.removeProperty("--courier-link-font-size");
   }
 }
-L(Pe, "observedAttributes", [
+$(Ue, "observedAttributes", [
   "href",
   "variant",
   "disabled",
@@ -352,46 +1254,46 @@ L(Pe, "observedAttributes", [
   "font-family",
   "font-size"
 ]);
-customElements.get("courier-link") || customElements.define("courier-link", Pe);
-class Le extends bo {
+customElements.get("courier-link") || customElements.define("courier-link", Ue);
+class De extends $o {
   constructor() {
-    super(), L(this, "shadow"), this.shadow = this.attachShadow({ mode: "open" });
+    super(), $(this, "shadow"), this.shadow = this.attachShadow({ mode: "open" });
   }
   // Build the element with a factory function
-  build(i) {
-    if (i === null) {
+  build(t) {
+    if (t === null) {
       this.shadow.replaceChildren();
       return;
     }
-    const e = i ?? this.defaultElement();
+    const e = t ?? this.defaultElement();
     this.shadow.replaceChildren(e);
   }
   // Default element to be used if no factory is provided
   defaultElement() {
-    const i = document.createElement("div");
-    return i.textContent = "Default Element Factory", i.style.cssText = `
+    const t = document.createElement("div");
+    return t.textContent = "Default Element Factory", t.style.cssText = `
       background-color: red;
       text-align: center;
       padding: 12px;
-    `, i;
+    `, t;
   }
 }
-class Me extends Le {
-  constructor(i) {
-    super(), L(this, "_props"), L(this, "_title"), L(this, "_button"), L(this, "_style"), L(this, "_buttonClickCallback", null), this._props = i;
+class Be extends De {
+  constructor(t) {
+    super(), $(this, "_props"), $(this, "_title"), $(this, "_button"), $(this, "_style"), $(this, "_buttonClickCallback", null), this._props = t;
   }
   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 ?? ee.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", () => {
+    var t, e;
+    const i = document.createElement("div");
+    return this._title = document.createElement("h2"), (t = this._props.title) != null && t.text && (this._title.textContent = this._props.title.text), this._button = new Re(this._props.button ?? se.secondary(this.currentSystemTheme)), this._style = document.createElement("style"), this._style.textContent = this.getStyles(this._props), i.className = "container", i.appendChild(this._style), i.appendChild(this._title), i.appendChild(this._button), this.shadow.appendChild(i), (e = this._button) == null || e.addEventListener("click", () => {
       this._buttonClickCallback && this._buttonClickCallback();
-    }), t;
+    }), i;
   }
-  onSystemThemeChange(i) {
+  onSystemThemeChange(t) {
     this.updateStyles(this._props);
   }
-  getStyles(i) {
-    var e, t, s, o;
+  getStyles(t) {
+    var e, i, s, o;
     return `
       :host {
         display: flex;
@@ -413,26 +1315,26 @@ class Me extends Le {
 
       .container h2 {
         margin: 0;
-        color: ${((e = i.title) == null ? void 0 : e.textColor) ?? "red"};
-        font-size: ${((t = i.title) == null ? void 0 : t.fontSize) ?? "16px"};
-        font-weight: ${((s = i.title) == null ? void 0 : s.fontWeight) ?? "500"};
-        font-family: ${((o = i.title) == null ? void 0 : o.fontFamily) ?? "inherit"};
+        color: ${((e = t.title) == null ? void 0 : e.textColor) ?? "red"};
+        font-size: ${((i = t.title) == null ? void 0 : i.fontSize) ?? "16px"};
+        font-weight: ${((s = t.title) == null ? void 0 : s.fontWeight) ?? "500"};
+        font-family: ${((o = t.title) == null ? void 0 : o.fontFamily) ?? "inherit"};
       }
     `;
   }
-  updateStyles(i) {
-    this._props = i, this._style && (this._style.textContent = this.getStyles(i)), this._button && this._button.updateButton(i.button);
+  updateStyles(t) {
+    this._props = t, this._style && (this._style.textContent = this.getStyles(t)), this._button && this._button.updateButton(t.button);
   }
-  setButtonClickCallback(i) {
-    this._buttonClickCallback = i;
+  setButtonClickCallback(t) {
+    this._buttonClickCallback = t;
   }
 }
-customElements.get("courier-info-state") || customElements.define("courier-info-state", Me);
-class Se 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);
+customElements.get("courier-info-state") || customElements.define("courier-info-state", Be);
+class $e extends HTMLElement {
+  constructor(t, e, i, s, o, n, c, d) {
+    super(), $(this, "_backgroundColor"), $(this, "_hoverBackgroundColor"), $(this, "_activeBackgroundColor"), $(this, "_borderRadius"), $(this, "_height"), $(this, "_width"), $(this, "_style"), $(this, "_button"), $(this, "_icon"), this._borderRadius = n, this._backgroundColor = i, this._hoverBackgroundColor = s, this._activeBackgroundColor = o, this._height = c, this._width = d;
+    const l = this.attachShadow({ mode: "open" });
+    this._button = document.createElement("button"), this._button.setAttribute("part", "button"), this._icon = new ne(e, t), this._style = document.createElement("style"), this.refresh(), l.appendChild(this._style), this._button.appendChild(this._icon), l.appendChild(this._button);
   }
   refresh() {
     this._style.textContent = this.getStyles();
@@ -480,34 +1382,34 @@ class Se extends HTMLElement {
       }
     `;
   }
-  updateIconColor(i) {
-    this._icon.updateColor(i);
+  updateIconColor(t) {
+    this._icon.updateColor(t);
   }
-  updateIconSVG(i) {
-    this._icon.updateSVG(i);
+  updateIconSVG(t) {
+    this._icon.updateSVG(t);
   }
-  updateBackgroundColor(i) {
-    this._backgroundColor = i, this.refresh();
+  updateBackgroundColor(t) {
+    this._backgroundColor = t, this.refresh();
   }
-  updateHoverBackgroundColor(i) {
-    this._hoverBackgroundColor = i, this.refresh();
+  updateHoverBackgroundColor(t) {
+    this._hoverBackgroundColor = t, this.refresh();
   }
-  updateActiveBackgroundColor(i) {
-    this._activeBackgroundColor = i, this.refresh();
+  updateActiveBackgroundColor(t) {
+    this._activeBackgroundColor = t, this.refresh();
   }
 }
-customElements.get("courier-icon-button") || customElements.define("courier-icon-button", Se);
-const Po = [
-  { name: "courier-button", class: Ie },
-  { name: "courier-icon", class: ie },
-  { name: "courier-link", class: Pe },
-  { name: "courier-info-state", class: Me },
-  { name: "courier-icon-button", class: Se }
+customElements.get("courier-icon-button") || customElements.define("courier-icon-button", $e);
+const cn = [
+  { name: "courier-button", class: Re },
+  { name: "courier-icon", class: ne },
+  { name: "courier-link", class: Ue },
+  { name: "courier-info-state", class: Be },
+  { name: "courier-icon-button", class: $e }
 ];
-Po.forEach(({ name: g, class: i }) => {
-  customElements.get(g) || customElements.define(g, i);
+cn.forEach(({ name: h, class: t }) => {
+  customElements.get(h) || customElements.define(h, t);
 });
-const te = class te {
+const oe = class oe {
   constructor() {
     a(this, "_inboxDataSet");
     a(this, "_archiveDataSet");
@@ -517,7 +1419,7 @@ const te = class te {
     a(this, "isPaginatingArchive", !1);
   }
   static get shared() {
-    return te.instance || (te.instance = new te()), te.instance;
+    return oe.instance || (oe.instance = new oe()), oe.instance;
   }
   get unreadCount() {
     return this._unreadCount ?? 0;
@@ -528,16 +1430,16 @@ const te = class te {
   get archiveDataSet() {
     return this._archiveDataSet ?? { messages: [], canPaginate: !1, paginationCursor: null };
   }
-  addDataStoreListener(i) {
-    this._dataStoreListeners.push(i);
+  addDataStoreListener(t) {
+    this._dataStoreListeners.push(t);
   }
-  removeDataStoreListener(i) {
-    this._dataStoreListeners = this._dataStoreListeners.filter((e) => e !== i);
+  removeDataStoreListener(t) {
+    this._dataStoreListeners = this._dataStoreListeners.filter((e) => e !== t);
   }
-  async fetchDataSet(i) {
-    var t, s, o, n, h, d, c, u, m, p;
-    if (i.canUseCache)
-      switch (i.feedType) {
+  async fetchDataSet(t) {
+    var i, s, o, n, c, d, l, p, m, g;
+    if (t.canUseCache)
+      switch (t.feedType) {
         case "inbox":
           if (this._inboxDataSet)
             return this._inboxDataSet;
@@ -547,23 +1449,23 @@ const te = class te {
             return this._archiveDataSet;
           break;
       }
-    const e = i.feedType === "inbox" ? await ((t = C.shared.client) == null ? void 0 : t.inbox.getMessages()) : await ((s = C.shared.client) == null ? void 0 : s.inbox.getArchivedMessages());
+    const e = t.feedType === "inbox" ? await ((i = v.shared.client) == null ? void 0 : i.inbox.getMessages()) : await ((s = v.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 = (m = (u = e == null ? void 0 : e.data) == null ? void 0 : u.messages) == null ? void 0 : m.pageInfo) == null ? void 0 : p.startCursor) ?? null
+      canPaginate: ((l = (d = (c = e == null ? void 0 : e.data) == null ? void 0 : c.messages) == null ? void 0 : d.pageInfo) == null ? void 0 : l.hasNextPage) ?? !1,
+      paginationCursor: ((g = (m = (p = e == null ? void 0 : e.data) == null ? void 0 : p.messages) == null ? void 0 : m.pageInfo) == null ? void 0 : g.startCursor) ?? null
     };
   }
-  async fetchUnreadCount(i) {
-    var t;
-    return i.canUseCache && this._unreadCount !== void 0 ? this._unreadCount : await ((t = C.shared.client) == null ? void 0 : t.inbox.getUnreadMessageCount()) ?? 0;
+  async fetchUnreadCount(t) {
+    var i;
+    return t.canUseCache && this._unreadCount !== void 0 ? this._unreadCount : await ((i = v.shared.client) == null ? void 0 : i.inbox.getUnreadMessageCount()) ?? 0;
   }
-  async load(i) {
-    var e, t, s;
+  async load(t) {
+    var e, i, s;
     try {
-      if (!((e = C.shared.client) != null && e.options.userId))
+      if (!((e = v.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([
+      const o = t ?? { feedType: "inbox", canUseCache: !0 }, [n, c] = await Promise.all([
         this.fetchDataSet(o),
         this.fetchUnreadCount(o)
       ]);
@@ -575,85 +1477,88 @@ const te = class te {
           this._archiveDataSet = n;
           break;
       }
-      this._unreadCount = h, this._dataStoreListeners.forEach((d) => {
-        var c, u, m, p;
-        (u = (c = d.events).onDataSetChange) == null || u.call(c, n, o.feedType), (p = (m = d.events).onUnreadCountChange) == null || p.call(m, this._unreadCount ?? 0);
+      this._unreadCount = c, this._dataStoreListeners.forEach((d) => {
+        var l, p, m, g;
+        (p = (l = d.events).onDataSetChange) == null || p.call(l, n, o.feedType), (g = (m = d.events).onUnreadCountChange) == null || g.call(m, this._unreadCount ?? 0);
       }), await this.connectSocket();
     } catch (o) {
-      (s = (t = C.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);
+      (s = (i = v.shared.client) == null ? void 0 : i.options.logger) == null || s.error("Error loading inbox:", o), this._dataStoreListeners.forEach((n) => {
+        var c, d;
+        (d = (c = n.events).onError) == null || d.call(c, o);
       });
     }
   }
   async connectSocket() {
-    var e, t, s, o, n, h, d, c, u, m, p, x;
-    const i = (e = C.shared.client) == null ? void 0 : e.inbox.socket;
+    var e, i, s, o, n, c, d, l, p, m, g, f;
+    const t = (e = v.shared.client) == null ? void 0 : e.inbox.socket;
     try {
-      if (!i) {
-        (s = (t = C.shared.client) == null ? void 0 : t.options.logger) == null || s.info("CourierInbox socket not available");
+      if (!t) {
+        (s = (i = v.shared.client) == null ? void 0 : i.options.logger) == null || s.info("CourierInbox socket not available");
         return;
       }
-      if ((h = (o = C.shared.client) == null ? void 0 : o.options.logger) == null || h.info("CourierInbox socket connectionId:", (n = C.shared.client) == null ? void 0 : n.options.connectionId), i.isConnected) {
-        (c = (d = C.shared.client) == null ? void 0 : d.options.logger) == null || c.info("CourierInbox socket already connected. Socket will not attempt reconnection.");
+      if ((c = (o = v.shared.client) == null ? void 0 : o.options.logger) == null || c.info("CourierInbox socket connectionId:", (n = v.shared.client) == null ? void 0 : n.options.connectionId), t.isConnected) {
+        (l = (d = v.shared.client) == null ? void 0 : d.options.logger) == null || l.info("CourierInbox socket already connected. Socket will not attempt reconnection.");
         return;
       }
-      i.receivedMessage = (_) => {
+      t.receivedMessage = (_) => {
         this.addMessage(_, 0, "inbox");
-      }, i.receivedMessageEvent = (_) => {
+      }, t.receivedMessageEvent = (_) => {
         let b;
         switch (_.messageId && (b = this.getMessage({ messageId: _.messageId })), _.event) {
           case "mark-all-read":
-            this.readAllMessages();
+            this.readAllMessages({ canCallApi: !1 });
             break;
           case "read":
-            b && this.readMessage(b, !1);
+            b && this.readMessage({ message: b, canCallApi: !1 });
             break;
           case "unread":
-            b && this.unreadMessage(b, !1);
+            b && this.unreadMessage({ message: b, canCallApi: !1 });
             break;
           case "opened":
-            b && this.openMessage(b, !1);
+            b && this.openMessage({ message: b, canCallApi: !1 });
             break;
           case "archive":
-            b && this.archiveMessage(b, !1);
+            b && this.archiveMessage({ message: b, canCallApi: !1 });
+            break;
+          case "archive-read":
+            this.archiveReadMessages({ canCallApi: !1 });
             break;
           case "click":
-            b && this.clickMessage(b, !1);
+            b && this.clickMessage({ message: b, canCallApi: !1 });
             break;
           case "unopened":
           case "unarchive":
             break;
         }
-      }, await i.connect(), await i.sendSubscribe(), i.keepAlive(), (m = (u = C.shared.client) == null ? void 0 : u.options.logger) == null || m.info("CourierInbox socket connected");
+      }, await t.connect(), await t.sendSubscribe(), t.keepAlive(), (m = (p = v.shared.client) == null ? void 0 : p.options.logger) == null || m.info("CourierInbox socket connected");
     } catch (_) {
-      (x = (p = C.shared.client) == null ? void 0 : p.options.logger) == null || x.error("Failed to connect socket:", _);
+      (f = (g = v.shared.client) == null ? void 0 : g.options.logger) == null || f.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));
+  getMessage(t) {
+    var e, i;
+    return ((e = this._inboxDataSet) == null ? void 0 : e.messages.find((s) => s.messageId === t.messageId)) ?? ((i = this._archiveDataSet) == null ? void 0 : i.messages.find((s) => s.messageId === t.messageId));
   }
-  async fetchNextPageOfMessages(i) {
-    var e, t, s, o, n, h, d, c, u, m, p, x, _, b, v, k, w, S, E, M, I, T, $, D;
-    switch (i.feedType) {
+  async fetchNextPageOfMessages(t) {
+    var e, i, s, o, n, c, d, l, p, m, g, f, _, b, C, k, w, S, I, E, M, L, R, D;
+    switch (t.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 = C.shared.client) == null ? void 0 : t.inbox.getMessages({
-              paginationLimit: C.shared.paginationLimit,
+            const y = await ((i = v.shared.client) == null ? void 0 : i.inbox.getMessages({
+              paginationLimit: v.shared.paginationLimit,
               startCursor: this._inboxDataSet.paginationCursor
-            })), B = {
+            })), A = {
               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: ((m = (u = (c = y == null ? void 0 : y.data) == null ? void 0 : c.messages) == null ? void 0 : u.pageInfo) == null ? void 0 : m.startCursor) ?? null
+              canPaginate: ((d = (c = (n = y == null ? void 0 : y.data) == null ? void 0 : n.messages) == null ? void 0 : c.pageInfo) == null ? void 0 : d.hasNextPage) ?? !1,
+              paginationCursor: ((m = (p = (l = y == null ? void 0 : y.data) == null ? void 0 : l.messages) == null ? void 0 : p.pageInfo) == null ? void 0 : m.startCursor) ?? null
             };
-            return this.addPage(B, "inbox"), B;
+            return this.addPage(A, "inbox"), A;
           } catch (y) {
-            return (x = (p = C.shared.client) == null ? void 0 : p.options.logger) == null || x.error("Error fetching next page of inbox messages:", y), null;
+            return (f = (g = v.shared.client) == null ? void 0 : g.options.logger) == null || f.error("Error fetching next page of inbox messages:", y), null;
           } finally {
             this.isPaginatingInbox = !1;
           }
@@ -664,17 +1569,17 @@ const te = class te {
         if ((_ = this._archiveDataSet) != null && _.canPaginate && this._archiveDataSet.paginationCursor)
           try {
             this.isPaginatingArchive = !0;
-            const y = await ((b = C.shared.client) == null ? void 0 : b.inbox.getArchivedMessages({
-              paginationLimit: C.shared.paginationLimit,
+            const y = await ((b = v.shared.client) == null ? void 0 : b.inbox.getArchivedMessages({
+              paginationLimit: v.shared.paginationLimit,
               startCursor: this._archiveDataSet.paginationCursor
-            })), B = {
-              messages: ((k = (v = y == null ? void 0 : y.data) == null ? void 0 : v.messages) == null ? void 0 : k.nodes) ?? [],
-              canPaginate: ((E = (S = (w = y == null ? void 0 : y.data) == null ? void 0 : w.messages) == null ? void 0 : S.pageInfo) == null ? void 0 : E.hasNextPage) ?? !1,
-              paginationCursor: ((T = (I = (M = y == null ? void 0 : y.data) == null ? void 0 : M.messages) == null ? void 0 : I.pageInfo) == null ? void 0 : T.startCursor) ?? null
+            })), A = {
+              messages: ((k = (C = y == null ? void 0 : y.data) == null ? void 0 : C.messages) == null ? void 0 : k.nodes) ?? [],
+              canPaginate: ((I = (S = (w = y == null ? void 0 : y.data) == null ? void 0 : w.messages) == null ? void 0 : S.pageInfo) == null ? void 0 : I.hasNextPage) ?? !1,
+              paginationCursor: ((L = (M = (E = y == null ? void 0 : y.data) == null ? void 0 : E.messages) == null ? void 0 : M.pageInfo) == null ? void 0 : L.startCursor) ?? null
             };
-            return this.addPage(B, "archive"), B;
+            return this.addPage(A, "archive"), A;
           } catch (y) {
-            return (D = ($ = C.shared.client) == null ? void 0 : $.options.logger) == null || D.error("Error fetching next page of archived messages:", y), null;
+            return (D = (R = v.shared.client) == null ? void 0 : R.options.logger) == null || D.error("Error fetching next page of archived messages:", y), null;
           } finally {
             this.isPaginatingArchive = !1;
           }
@@ -682,201 +1587,227 @@ const te = class te {
     }
     return null;
   }
-  applyLocalMessageChange(i, e) {
-    for (const [t, s] of Object.entries(e))
-      s !== void 0 && this.updateMessage(i, s, t);
+  applyLocalMessageChange(t, e) {
+    for (const [i, s] of Object.entries(e))
+      s !== void 0 && this.updateMessage(t, s, i);
   }
-  async readMessage(i, e = !0) {
-    var o, n, h, d;
-    if (!C.shared.client)
+  async readMessage({ message: t, canCallApi: e = !0 }) {
+    var o, n, c, d;
+    if (!v.shared.client)
       return;
-    const t = i;
-    if (t.read)
+    const i = t;
+    if (i.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)
+      inbox: (o = this._inboxDataSet) == null ? void 0 : o.messages.findIndex((l) => l.messageId === t.messageId),
+      archive: (n = this._archiveDataSet) == null ? void 0 : n.messages.findIndex((l) => l.messageId === t.messageId)
     };
     try {
-      i.read = (/* @__PURE__ */ new Date()).toISOString(), this.applyLocalMessageChange(i, s), e && await C.shared.client.inbox.read({ messageId: i.messageId });
-    } catch (c) {
-      this.applyLocalMessageChange(t, s), (d = (h = C.shared.client) == null ? void 0 : h.options.logger) == null || d.error("Error reading message:", c);
+      t.read = (/* @__PURE__ */ new Date()).toISOString(), this.applyLocalMessageChange(t, s), e && await v.shared.client.inbox.read({ messageId: t.messageId });
+    } catch (l) {
+      this.applyLocalMessageChange(i, s), (d = (c = v.shared.client) == null ? void 0 : c.options.logger) == null || d.error("Error reading message:", l);
     }
   }
-  async unreadMessage(i, e = !0) {
-    var o, n, h, d;
-    if (!C.shared.client)
+  async unreadMessage({ message: t, canCallApi: e = !0 }) {
+    var o, n, c, d;
+    if (!v.shared.client)
       return;
-    const t = i;
-    if (!t.read)
+    const i = t;
+    if (!i.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)
+      inbox: (o = this._inboxDataSet) == null ? void 0 : o.messages.findIndex((l) => l.messageId === t.messageId),
+      archive: (n = this._archiveDataSet) == null ? void 0 : n.messages.findIndex((l) => l.messageId === t.messageId)
     };
     try {
-      i.read = void 0, this.applyLocalMessageChange(i, s), e && await C.shared.client.inbox.unread({ messageId: i.messageId });
-    } catch (c) {
-      this.applyLocalMessageChange(t, s), (d = (h = C.shared.client) == null ? void 0 : h.options.logger) == null || d.error("Error unreading message:", c);
+      t.read = void 0, this.applyLocalMessageChange(t, s), e && await v.shared.client.inbox.unread({ messageId: t.messageId });
+    } catch (l) {
+      this.applyLocalMessageChange(i, s), (d = (c = v.shared.client) == null ? void 0 : c.options.logger) == null || d.error("Error unreading message:", l);
     }
   }
-  async openMessage(i, e = !0) {
-    var o, n, h, d;
-    if (!C.shared.client)
+  async openMessage({ message: t, canCallApi: e = !0 }) {
+    var o, n, c, d;
+    if (!v.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)
+    const i = t, s = {
+      inbox: (o = this._inboxDataSet) == null ? void 0 : o.messages.findIndex((l) => l.messageId === t.messageId),
+      archive: (n = this._archiveDataSet) == null ? void 0 : n.messages.findIndex((l) => l.messageId === t.messageId)
     };
-    if (!(!s.inbox && !s.archive) && !t.opened)
+    if (!(!s.inbox && !s.archive) && !i.opened)
       try {
-        i.opened = (/* @__PURE__ */ new Date()).toISOString(), this.applyLocalMessageChange(i, s), e && await C.shared.client.inbox.open({ messageId: i.messageId });
-      } catch (c) {
-        this.applyLocalMessageChange(t, s), (d = (h = C.shared.client) == null ? void 0 : h.options.logger) == null || d.error("Error opening message:", c);
+        t.opened = (/* @__PURE__ */ new Date()).toISOString(), this.applyLocalMessageChange(t, s), e && await v.shared.client.inbox.open({ messageId: t.messageId });
+      } catch (l) {
+        this.applyLocalMessageChange(i, s), (d = (c = v.shared.client) == null ? void 0 : c.options.logger) == null || d.error("Error opening message:", l);
       }
   }
-  async clickMessage(i, e = !0) {
-    var t, s, o, n;
-    if (C.shared.client)
+  async clickMessage({ message: t, canCallApi: e = !0 }) {
+    var i, s, o, n;
+    if (v.shared.client)
       try {
-        (t = i.trackingIds) != null && t.clickTrackingId && e && await C.shared.client.inbox.click({
-          messageId: i.messageId,
-          trackingId: (s = i.trackingIds) == null ? void 0 : s.clickTrackingId
+        (i = t.trackingIds) != null && i.clickTrackingId && e && await v.shared.client.inbox.click({
+          messageId: t.messageId,
+          trackingId: (s = t.trackingIds) == null ? void 0 : s.clickTrackingId
         });
-      } catch (h) {
-        (n = (o = C.shared.client) == null ? void 0 : o.options.logger) == null || n.error("Error clicking message:", h);
+      } catch (c) {
+        (n = (o = v.shared.client) == null ? void 0 : o.options.logger) == null || n.error("Error clicking message:", c);
       }
   }
-  async archiveMessage(i, e = !0) {
+  async archiveMessage({ message: t, canCallApi: e = !0 }) {
     var o, n;
-    if (!C.shared.client)
+    if (!v.shared.client)
       return;
-    const t = i, s = (o = this._inboxDataSet) == null ? void 0 : o.messages.findIndex((h) => h.messageId === i.messageId);
+    const i = t, s = (o = this._inboxDataSet) == null ? void 0 : o.messages.findIndex((c) => c.messageId === t.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 = (/* @__PURE__ */ new Date()).toISOString(), this.addMessage(i, h, "archive");
+        if (this.removeMessage(t, s, "inbox"), (n = this._archiveDataSet) != null && n.messages) {
+          const c = this.findInsertIndex(t, this._archiveDataSet.messages);
+          t.archived = (/* @__PURE__ */ new Date()).toISOString(), this.addMessage(t, c, "archive");
         }
-        e && await C.shared.client.inbox.archive({ messageId: i.messageId });
+        e && await v.shared.client.inbox.archive({ messageId: t.messageId });
       } catch {
-        this.addMessage(t, s, "inbox"), i.archived = void 0, this.removeMessage(i, s, "archive");
+        this.addMessage(i, s, "inbox"), t.archived = void 0, this.removeMessage(t, s, "archive");
       }
   }
-  async readAllMessages(i = !0) {
-    var o, n, h, d;
-    if (!C.shared.client)
+  async archiveReadMessages({ canCallApi: t = !0 } = {}) {
+    var s;
+    if (!v.shared.client)
+      return;
+    const e = this._inboxDataSet, i = this._archiveDataSet;
+    try {
+      (s = this._inboxDataSet) == null || s.messages.forEach((o) => {
+        var c, d;
+        if (!o.read)
+          return;
+        const n = (c = this._inboxDataSet) == null ? void 0 : c.messages.findIndex((l) => l.messageId === o.messageId);
+        if (n !== void 0 && (this.removeMessage(o, n, "inbox"), (d = this._archiveDataSet) != null && d.messages)) {
+          const l = this.findInsertIndex(o, this._archiveDataSet.messages);
+          o.archived = (/* @__PURE__ */ new Date()).toISOString(), this.addMessage(o, l, "archive");
+        }
+      }), this._dataStoreListeners.forEach((o) => {
+        var n, c, d, l;
+        this._inboxDataSet && ((c = (n = o.events).onDataSetChange) == null || c.call(n, this._inboxDataSet, "inbox")), this._archiveDataSet && ((l = (d = o.events).onDataSetChange) == null || l.call(d, this._archiveDataSet, "archive"));
+      }), t && await v.shared.client.inbox.archiveRead();
+    } catch (o) {
+      console.error("Error archiving read messages:", o), this._inboxDataSet && e && (this._inboxDataSet.messages = e.messages), this._archiveDataSet && i && (this._archiveDataSet.messages = i.messages), this._dataStoreListeners.forEach((n) => {
+        var c, d, l, p;
+        this._inboxDataSet && ((d = (c = n.events).onDataSetChange) == null || d.call(c, this._inboxDataSet, "inbox")), this._archiveDataSet && ((p = (l = n.events).onDataSetChange) == null || p.call(l, this._archiveDataSet, "archive"));
+      });
+    }
+  }
+  async readAllMessages({ canCallApi: t = !0 } = {}) {
+    var o, n, c, d;
+    if (!v.shared.client)
       return;
-    const e = this._inboxDataSet, t = this._archiveDataSet, s = this._unreadCount;
+    const e = this._inboxDataSet, i = this._archiveDataSet, s = this._unreadCount;
     try {
-      (o = this._inboxDataSet) == null || o.messages.forEach((c) => {
-        c.read || (c.read = (/* @__PURE__ */ new Date()).toISOString());
-      }), (n = this._archiveDataSet) == null || n.messages.forEach((c) => {
-        c.read || (c.read = (/* @__PURE__ */ new Date()).toISOString());
-      }), this._unreadCount = 0, this._dataStoreListeners.forEach((c) => {
-        var u, m, p, x, _, b;
-        this._inboxDataSet && ((m = (u = c.events).onDataSetChange) == null || m.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 C.shared.client.inbox.readAll();
-    } catch (c) {
-      (d = (h = C.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 m, p, x, _, b, v;
-        this._inboxDataSet && ((p = (m = u.events).onDataSetChange) == null || p.call(m, 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);
+      (o = this._inboxDataSet) == null || o.messages.forEach((l) => {
+        l.read || (l.read = (/* @__PURE__ */ new Date()).toISOString());
+      }), (n = this._archiveDataSet) == null || n.messages.forEach((l) => {
+        l.read || (l.read = (/* @__PURE__ */ new Date()).toISOString());
+      }), this._unreadCount = 0, this._dataStoreListeners.forEach((l) => {
+        var p, m, g, f, _, b;
+        this._inboxDataSet && ((m = (p = l.events).onDataSetChange) == null || m.call(p, this._inboxDataSet, "inbox")), this._archiveDataSet && ((f = (g = l.events).onDataSetChange) == null || f.call(g, this._archiveDataSet, "archive")), (b = (_ = l.events).onUnreadCountChange) == null || b.call(_, this._unreadCount);
+      }), t && await v.shared.client.inbox.readAll();
+    } catch (l) {
+      (d = (c = v.shared.client) == null ? void 0 : c.options.logger) == null || d.error("Error reading all messages:", l), this._inboxDataSet && e && (this._inboxDataSet.messages = e.messages), this._archiveDataSet && i && (this._archiveDataSet.messages = i.messages), this._unreadCount = s, this._dataStoreListeners.forEach((p) => {
+        var m, g, f, _, b, C;
+        this._inboxDataSet && ((g = (m = p.events).onDataSetChange) == null || g.call(m, this._inboxDataSet, "inbox")), this._archiveDataSet && ((_ = (f = p.events).onDataSetChange) == null || _.call(f, this._archiveDataSet, "archive")), (C = (b = p.events).onUnreadCountChange) == null || C.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;
+  findInsertIndex(t, e) {
+    const i = [...e];
+    i.push(t), i.sort((o, n) => {
+      const c = new Date(o.created ?? Date.now()).getTime();
+      return new Date(n.created ?? Date.now()).getTime() - c;
     });
-    const s = t.findIndex((o) => o.messageId === i.messageId);
+    const s = i.findIndex((o) => o.messageId === t.messageId);
     return Math.max(s - 1, 0);
   }
-  addPage(i, e) {
+  addPage(t, 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]);
+        this._inboxDataSet && (this._inboxDataSet.canPaginate = t.canPaginate, this._inboxDataSet.paginationCursor = t.paginationCursor, this._inboxDataSet.messages = [...this._inboxDataSet.messages, ...t.messages]);
         break;
       case "archive":
-        this._archiveDataSet && (this._archiveDataSet.canPaginate = i.canPaginate, this._archiveDataSet.paginationCursor = i.paginationCursor, this._archiveDataSet.messages = [...this._archiveDataSet.messages, ...i.messages]);
+        this._archiveDataSet && (this._archiveDataSet.canPaginate = t.canPaginate, this._archiveDataSet.paginationCursor = t.paginationCursor, this._archiveDataSet.messages = [...this._archiveDataSet.messages, ...t.messages]);
         break;
     }
     this._dataStoreListeners.forEach(
-      (t) => {
+      (i) => {
         var s, o;
-        return (o = (s = t.events).onPageAdded) == null ? void 0 : o.call(s, i, e);
+        return (o = (s = i.events).onPageAdded) == null ? void 0 : o.call(s, t, e);
       }
     );
   }
-  addMessage(i, e, t) {
+  addMessage(t, e, i) {
     var s, o;
-    switch (t) {
+    switch (i) {
       case "inbox":
-        !i.read && this._unreadCount !== void 0 && (this._unreadCount = this._unreadCount + 1), (s = this._inboxDataSet) == null || s.messages.splice(e, 0, i);
+        !t.read && this._unreadCount !== void 0 && (this._unreadCount = this._unreadCount + 1), (s = this._inboxDataSet) == null || s.messages.splice(e, 0, t);
         break;
       case "archive":
-        (o = this._archiveDataSet) == null || o.messages.splice(e, 0, i);
+        (o = this._archiveDataSet) == null || o.messages.splice(e, 0, t);
         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);
+      var c, d, l, p;
+      (d = (c = n.events).onMessageAdd) == null || d.call(c, t, e, i), (p = (l = n.events).onUnreadCountChange) == null || p.call(l, this._unreadCount ?? 0);
     });
   }
-  removeMessage(i, e, t) {
+  removeMessage(t, e, i) {
     var s, o;
-    switch (t) {
+    switch (i) {
       case "inbox":
-        !i.read && this._unreadCount !== void 0 && (this._unreadCount = this._unreadCount - 1), (s = this._inboxDataSet) == null || s.messages.splice(e, 1);
+        !t.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);
+      var c, d, l, p;
+      (d = (c = n.events).onMessageRemove) == null || d.call(c, t, e, i), (p = (l = n.events).onUnreadCountChange) == null || p.call(l, this._unreadCount ?? 0);
     });
   }
-  updateMessage(i, e, t) {
-    switch (t) {
+  updateMessage(t, e, i) {
+    switch (i) {
       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);
+        this._unreadCount !== void 0 && !t.archived && (t.read && (this._unreadCount = Math.max(0, this._unreadCount - 1)), t.read || (this._unreadCount = this._unreadCount + 1)), this._inboxDataSet && (this._inboxDataSet.messages[e] = t);
         break;
       case "archive":
-        this._archiveDataSet && (this._archiveDataSet.messages[e] = i);
+        this._archiveDataSet && (this._archiveDataSet.messages[e] = t);
         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);
+      var o, n, c, d;
+      (n = (o = s.events).onMessageUpdate) == null || n.call(o, t, e, i), (d = (c = s.events).onUnreadCountChange) == null || d.call(c, this._unreadCount ?? 0);
     });
   }
 };
-a(te, "instance");
-let A = te;
-function zo(g) {
-  return A.shared.readMessage(g);
+a(oe, "instance");
+let P = oe;
+function gn(h) {
+  return P.shared.readMessage({ message: h });
 }
-function Oo(g) {
-  return A.shared.unreadMessage(g);
+function mn(h) {
+  return P.shared.unreadMessage({ message: h });
 }
-function No(g) {
-  return A.shared.clickMessage(g);
+function bn(h) {
+  return P.shared.clickMessage({ message: h });
 }
-function Uo(g) {
-  return A.shared.archiveMessage(g);
+function _n(h) {
+  return P.shared.archiveMessage({ message: h });
 }
-function Vo(g) {
-  return A.shared.openMessage(g);
+function fn(h) {
+  return P.shared.openMessage({ message: h });
 }
-function $o(g) {
-  if (!g.created) return "Now";
-  const i = /* @__PURE__ */ new Date(), e = new Date(g.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`;
+function ln(h) {
+  if (!h.created) return "Now";
+  const t = /* @__PURE__ */ new Date(), e = new Date(h.created), i = Math.floor((t.getTime() - e.getTime()) / 1e3);
+  return i < 60 ? `${i}s` : i < 3600 ? `${Math.floor(i / 60)}m` : i < 86400 ? `${Math.floor(i / 3600)}h` : i < 604800 ? `${Math.floor(i / 86400)}d` : i < 31536e3 ? `${Math.floor(i / 604800)}w` : `${Math.floor(i / 31536e3)}y`;
 }
-class _o extends HTMLElement {
+class Lo extends HTMLElement {
   constructor(e) {
     super();
     // State
@@ -885,14 +1816,14 @@ class _o extends HTMLElement {
     // Components
     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 i = this.attachShadow({ mode: "open" });
+    this._style = document.createElement("style"), this._style.textContent = this.getStyles(), i.appendChild(this._style);
     const s = document.createElement("ul");
-    s.className = "menu", t.appendChild(s);
+    s.className = "menu", i.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;
+    var i, s, o;
+    const e = (o = (s = (i = this._theme.inbox) == null ? void 0 : i.list) == null ? void 0 : s.item) == null ? void 0 : o.menu;
     return `
       :host {
         display: block;
@@ -935,19 +1866,19 @@ class _o extends HTMLElement {
     this._options = e, this.renderMenu();
   }
   renderMenu() {
-    var o, n, h, d;
+    var o, n, c, 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();
+    const i = (d = (c = (n = this._theme.inbox) == null ? void 0 : n.list) == null ? void 0 : c.item) == null ? void 0 : d.menu, s = (l) => {
+      l.stopPropagation(), l.preventDefault();
     };
-    this._options.forEach((c) => {
-      var p, x, _;
-      const u = new Se(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), m = (b) => {
-        s(b), c.onClick();
+    this._options.forEach((l) => {
+      var g, f, _;
+      const p = new $e(l.icon.svg, l.icon.color, i == null ? void 0 : i.backgroundColor, (g = i == null ? void 0 : i.item) == null ? void 0 : g.hoverBackgroundColor, (f = i == null ? void 0 : i.item) == null ? void 0 : f.activeBackgroundColor, (_ = i == null ? void 0 : i.item) == null ? void 0 : _.borderRadius), m = (b) => {
+        s(b), l.onClick();
       };
-      u.addEventListener("click", m), u.addEventListener("touchstart", s), u.addEventListener("touchend", m), u.addEventListener("touchmove", s), u.addEventListener("mousedown", s), u.addEventListener("mouseup", s), e.appendChild(u);
+      p.addEventListener("click", m), p.addEventListener("touchstart", s), p.addEventListener("touchend", m), p.addEventListener("touchmove", s), p.addEventListener("mousedown", s), p.addEventListener("mouseup", s), e.appendChild(p);
     });
   }
   show() {
@@ -957,8 +1888,8 @@ class _o extends HTMLElement {
     this.classList.remove("visible");
   }
 }
-customElements.get("courier-list-item-menu") || customElements.define("courier-list-item-menu", _o);
-class xo extends HTMLElement {
+customElements.get("courier-list-item-menu") || customElements.define("courier-list-item-menu", Lo);
+class Ao extends HTMLElement {
   constructor(e) {
     super();
     // State
@@ -982,13 +1913,13 @@ class xo extends HTMLElement {
     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 _o(this._theme), this._menu.setOptions(this._getMenuOptions()), t.append(this._style, this._unreadIndicator, s, this._timeElement, this._menu);
+    const i = 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 Lo(this._theme), this._menu.setOptions(this._getMenuOptions()), i.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._menu.contains(n.target) || n.composedPath().includes(this._menu) || this._message && this.onItemClick && !(n.target instanceof ne) && !this._isLongPress && this.onItemClick(this._message);
     }), this._setupHoverBehavior(), this._setupLongPressBehavior();
   }
   _setupHoverBehavior() {
@@ -1001,14 +1932,14 @@ class xo extends HTMLElement {
     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;
+    const i = 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._isLongPress = !0, this._showMenu(), this._message && this.onItemLongPress && (this.onItemLongPress(this._message), navigator.vibrate && navigator.vibrate((i == null ? void 0 : i.vibrationDuration) ?? 50)), setTimeout(() => {
             this._hideMenu(), this._isLongPress = !1;
-          }, (t == null ? void 0 : t.displayDuration) ?? 2e3);
+          }, (i == null ? void 0 : i.displayDuration) ?? 2e3);
         }, 650);
       },
       { passive: !0 }
@@ -1021,43 +1952,43 @@ class xo extends HTMLElement {
   }
   // Helpers
   _getMenuOptions() {
-    var s, o, n, h, d, c, u, m, p, x, _, b, v, k, w, S, E, M, I;
-    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",
+    var s, o, n, c, d, l, p, m, g, f, _, b, C, k, w, S, I, E, M;
+    const e = (c = (n = (o = (s = this._theme.inbox) == null ? void 0 : s.list) == null ? void 0 : o.item) == null ? void 0 : n.menu) == null ? void 0 : c.item;
+    let i = [];
+    return (d = this._message) != null && d.archived || i.push({
+      id: (l = this._message) != null && l.read ? "unread" : "read",
       icon: {
-        svg: (u = this._message) != null && u.read ? (m = e == null ? void 0 : e.unread) == null ? void 0 : m.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"
+        svg: (p = this._message) != null && p.read ? (m = e == null ? void 0 : e.unread) == null ? void 0 : m.svg : (g = e == null ? void 0 : e.read) == null ? void 0 : g.svg,
+        color: (f = this._message) != null && f.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));
+        this._message && (this._message.read ? P.shared.unreadMessage({ message: this._message }) : P.shared.readMessage({ message: this._message }));
       }
-    }), t.push({
-      id: (v = this._message) != null && v.archived ? "unarchive" : "archive",
+    }), i.push({
+      id: (C = this._message) != null && C.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: (E = this._message) != null && E.archived ? (M = e == null ? void 0 : e.unarchive) == null ? void 0 : M.color : ((I = e == null ? void 0 : e.archive) == null ? void 0 : I.color) ?? "red"
+        color: (I = this._message) != null && I.archived ? (E = e == null ? void 0 : e.unarchive) == null ? void 0 : E.color : ((M = e == null ? void 0 : e.archive) == null ? void 0 : M.color) ?? "red"
       },
       onClick: () => {
-        this._message && (this._message.archived ? alert("unarchive") : A.shared.archiveMessage(this._message));
+        this._message && (this._message.archived ? alert("unarchive") : P.shared.archiveMessage({ message: this._message }));
       }
-    }), t;
+    }), i;
   }
   // Menu visibility helpers
   _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;
+    var i, s, o;
+    const e = (o = (s = (i = this._theme.inbox) == null ? void 0 : i.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;
+    var i, s, o;
+    const e = (o = (s = (i = this._theme.inbox) == null ? void 0 : i.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, m, p, x;
-    const e = (s = (t = this._theme.inbox) == null ? void 0 : t.list) == null ? void 0 : s.item;
+    var i, s, o, n, c, d, l, p, m, g, f;
+    const e = (s = (i = this._theme.inbox) == null ? void 0 : i.list) == null ? void 0 : s.item;
     return `
       :host {
         display: flex;
@@ -1143,20 +2074,20 @@ class xo extends HTMLElement {
       p[part='title'] {
         font-family: ${((o = e == null ? void 0 : e.title) == null ? void 0 : o.family) ?? "inherit"};
         font-size: ${((n = e == null ? void 0 : e.title) == null ? void 0 : n.size) ?? "14px"};
-        color: ${((h = e == null ? void 0 : e.title) == null ? void 0 : h.color) ?? "red"};
+        color: ${((c = e == null ? void 0 : e.title) == null ? void 0 : c.color) ?? "red"};
         margin-bottom: 4px;
       }
 
       p[part='subtitle'] {
         font-family: ${((d = e == null ? void 0 : e.subtitle) == null ? void 0 : d.family) ?? "inherit"};
-        font-size: ${((c = e == null ? void 0 : e.subtitle) == null ? void 0 : c.size) ?? "14px"};
-        color: ${((u = e == null ? void 0 : e.subtitle) == null ? void 0 : u.color) ?? "red"};
+        font-size: ${((l = e == null ? void 0 : e.subtitle) == null ? void 0 : l.size) ?? "14px"};
+        color: ${((p = e == null ? void 0 : e.subtitle) == null ? void 0 : p.color) ?? "red"};
       }
 
       p[part='time'] {
         font-family: ${((m = e == null ? void 0 : e.time) == null ? void 0 : m.family) ?? "inherit"};
-        font-size: ${((p = e == null ? void 0 : e.time) == null ? void 0 : p.size) ?? "14px"};
-        color: ${((x = e == null ? void 0 : e.time) == null ? void 0 : x.color) ?? "red"};
+        font-size: ${((g = e == null ? void 0 : e.time) == null ? void 0 : g.size) ?? "14px"};
+        color: ${((f = e == null ? void 0 : e.time) == null ? void 0 : f.color) ?? "red"};
         text-align: right;
         white-space: nowrap;
       }
@@ -1187,17 +2118,17 @@ class xo extends HTMLElement {
   // Lifecycle hooks
   connectedCallback() {
     var s, o;
-    const e = this.getAttribute("message"), t = this.getAttribute("feed-type");
-    if (t && (this._feedType = t), e)
+    const e = this.getAttribute("message"), i = this.getAttribute("feed-type");
+    if (i && (this._feedType = i), e)
       try {
         this._message = JSON.parse(e), this._updateContent();
       } catch (n) {
-        (o = (s = C.shared.client) == null ? void 0 : s.options.logger) == null || o.error("CourierListItem – failed to parse message:", n);
+        (o = (s = v.shared.client) == null ? void 0 : s.options.logger) == null || o.error("CourierListItem – failed to parse message:", n);
       }
   }
   // Public API
-  setMessage(e, t) {
-    this._message = e, this._feedType = t, this._updateContent();
+  setMessage(e, i) {
+    this._message = e, this._feedType = i, this._updateContent();
   }
   setOnItemClick(e) {
     this.onItemClick = e;
@@ -1210,49 +2141,49 @@ class xo extends HTMLElement {
   }
   // Content rendering
   _updateContent() {
-    var s, o, n, h, d, c;
+    var s, o, n, c, d, l;
     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 = $o(this._message), this._menu.setOptions(this._getMenuOptions());
+    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 = ln(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 m = new Ie({
-        text: u.content,
+    const i = (c = (n = (o = this._theme.inbox) == null ? void 0 : o.list) == null ? void 0 : n.item) == null ? void 0 : c.actions;
+    (l = (d = this._message) == null ? void 0 : d.actions) == null || l.forEach((p) => {
+      var g, f, _, b;
+      const m = new Re({
+        text: p.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,
+        backgroundColor: i == null ? void 0 : i.backgroundColor,
+        hoverBackgroundColor: i == null ? void 0 : i.hoverBackgroundColor,
+        activeBackgroundColor: i == null ? void 0 : i.activeBackgroundColor,
+        border: i == null ? void 0 : i.border,
+        borderRadius: i == null ? void 0 : i.borderRadius,
+        shadow: i == null ? void 0 : i.shadow,
+        fontFamily: (g = i == null ? void 0 : i.font) == null ? void 0 : g.family,
+        fontSize: (f = i == null ? void 0 : i.font) == null ? void 0 : f.size,
+        fontWeight: (_ = i == null ? void 0 : i.font) == null ? void 0 : _.weight,
+        textColor: (b = i == null ? void 0 : i.font) == null ? void 0 : b.color,
         onClick: () => {
-          this._message && this.onItemActionClick && this.onItemActionClick(this._message, u);
+          this._message && this.onItemActionClick && this.onItemActionClick(this._message, p);
         }
       });
       this._actionsContainer.appendChild(m);
     });
   }
 }
-customElements.get("courier-list-item") || customElements.define("courier-list-item", xo);
-class fo extends HTMLElement {
-  constructor(e, t) {
+customElements.get("courier-list-item") || customElements.define("courier-list-item", Ao);
+class Po extends HTMLElement {
+  constructor(e, i) {
     super();
     // Shadow root
     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 Ee(e, 35), n = new Ee(e, 100), h = new Ee(e, 82);
-    this._shadow.appendChild(o), this._shadow.appendChild(n), this._shadow.appendChild(h);
+    s.textContent = this.getStyles(i), this._shadow.appendChild(s);
+    const o = new Le(e, 35), n = new Le(e, 100), c = new Le(e, 82);
+    this._shadow.appendChild(o), this._shadow.appendChild(n), this._shadow.appendChild(c);
   }
   getStyles(e) {
     return `
@@ -1268,41 +2199,41 @@ class fo extends HTMLElement {
     `;
   }
 }
-customElements.get("courier-inbox-skeleton-list-item") || customElements.define("courier-inbox-skeleton-list-item", fo);
-class Ee extends HTMLElement {
-  constructor(e, t) {
+customElements.get("courier-inbox-skeleton-list-item") || customElements.define("courier-inbox-skeleton-list-item", Po);
+class Le extends HTMLElement {
+  constructor(e, i) {
     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);
+    s.textContent = this.getStyles(e, i), this._shadow.appendChild(s);
     const o = document.createElement("div");
     o.className = "skeleton-item", this._shadow.appendChild(o);
   }
-  getStyles(e, t) {
-    var m, p, x, _, b, v, k, w, S, E, M, I;
-    const s = ((x = (p = (m = e.inbox) == null ? void 0 : m.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)`;
+  getStyles(e, i) {
+    var m, g, f, _, b, C, k, w, S, I, E, M;
+    const s = ((f = (g = (m = e.inbox) == null ? void 0 : m.loading) == null ? void 0 : g.animation) == null ? void 0 : f.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), c = parseInt(o.slice(3, 5), 16), d = parseInt(o.slice(5, 7), 16), l = `rgba(${n}, ${c}, ${d}, 0.8)`, p = `rgba(${n}, ${c}, ${d}, 0.4)`;
     return `
       :host {
         display: flex;
         height: 100%;
-        width: ${t}%;
+        width: ${i}%;
         align-items: flex-start;
         justify-content: flex-start;
       }
 
       .skeleton-item {
-        height: ${((v = (b = (_ = e.inbox) == null ? void 0 : _.loading) == null ? void 0 : b.animation) == null ? void 0 : v.barHeight) ?? "14px"};
+        height: ${((C = (b = (_ = e.inbox) == null ? void 0 : _.loading) == null ? void 0 : b.animation) == null ? void 0 : C.barHeight) ?? "14px"};
         width: 100%;
         background: linear-gradient(
           90deg,
-          ${c} 25%,
-          ${u} 50%,
-          ${c} 75%
+          ${l} 25%,
+          ${p} 50%,
+          ${l} 75%
         );
         background-size: 200% 100%;
         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;
-        border-radius: ${((I = (M = (E = e.inbox) == null ? void 0 : E.loading) == null ? void 0 : M.animation) == null ? void 0 : I.barBorderRadius) ?? "14px"};
+        border-radius: ${((M = (E = (I = e.inbox) == null ? void 0 : I.loading) == null ? void 0 : E.animation) == null ? void 0 : M.barBorderRadius) ?? "14px"};
       }
 
       @keyframes shimmer {
@@ -1316,8 +2247,8 @@ class Ee extends HTMLElement {
     `;
   }
 }
-customElements.get("courier-skeleton-animated-row") || customElements.define("courier-skeleton-animated-row", Ee);
-class $e extends Le {
+customElements.get("courier-skeleton-animated-row") || customElements.define("courier-skeleton-animated-row", Le);
+class Ne extends De {
   constructor(e) {
     super();
     a(this, "_theme");
@@ -1326,16 +2257,16 @@ class $e extends Le {
   defaultElement() {
     const e = document.createElement("div");
     e.className = "list";
-    const t = document.createElement("style");
-    t.textContent = this.getStyles(), e.appendChild(t);
+    const i = document.createElement("style");
+    i.textContent = this.getStyles(), e.appendChild(i);
     for (let s = 0; s < 3; s++) {
-      const o = new fo(this._theme, 1 / (s + 1));
+      const o = new Po(this._theme, 1 / (s + 1));
       e.appendChild(o);
     }
     return this.shadow.appendChild(e), e;
   }
   getStyles() {
-    var e, t;
+    var e, i;
     return `
       :host {
         display: flex;
@@ -1355,7 +2286,7 @@ class $e extends Le {
       }
 
       .list > * {
-        border-bottom: ${((t = (e = this._theme.inbox) == null ? void 0 : e.loading) == null ? void 0 : t.divider) ?? "1px solid red"};
+        border-bottom: ${((i = (e = this._theme.inbox) == null ? void 0 : e.loading) == null ? void 0 : i.divider) ?? "1px solid red"};
       }
 
       .list > *:last-child {
@@ -1364,8 +2295,8 @@ class $e extends Le {
     `;
   }
 }
-customElements.get("courier-inbox-skeleton-list") || customElements.define("courier-inbox-skeleton-list", $e);
-class Co extends HTMLElement {
+customElements.get("courier-inbox-skeleton-list") || customElements.define("courier-inbox-skeleton-list", Ne);
+class Bo extends HTMLElement {
   constructor(e) {
     super();
     // Components
@@ -1375,12 +2306,12 @@ class Co extends HTMLElement {
     // Handlers
     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);
+    const i = this.attachShadow({ mode: "open" }), s = document.createElement("style");
+    if (s.textContent = this.getStyles(), i.appendChild(s), this.customItem)
+      i.appendChild(this.customItem);
     else {
       const o = document.createElement("div");
-      o.className = "skeleton-container", this.skeletonLoadingList = new $e(e.theme), this.skeletonLoadingList.build(void 0), o.appendChild(this.skeletonLoadingList), t.appendChild(o);
+      o.className = "skeleton-container", this.skeletonLoadingList = new Ne(e.theme), this.skeletonLoadingList.build(void 0), o.appendChild(this.skeletonLoadingList), i.appendChild(o);
     }
     this.observer = new IntersectionObserver((o) => {
       o.forEach((n) => {
@@ -1405,8 +2336,8 @@ class Co extends HTMLElement {
     this.observer.disconnect();
   }
 }
-customElements.get("courier-inbox-pagination-list-item") || customElements.define("courier-inbox-pagination-list-item", Co);
-class vo extends HTMLElement {
+customElements.get("courier-inbox-pagination-list-item") || customElements.define("courier-inbox-pagination-list-item", Bo);
+class Ro extends HTMLElement {
   constructor(e) {
     super();
     // Theme
@@ -1432,16 +2363,16 @@ class vo extends HTMLElement {
     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);
+    const i = this.attachShadow({ mode: "open" }), s = document.createElement("style");
+    s.textContent = this.getStyles(), i.appendChild(s);
   }
   // Getters
   get messages() {
     return this._messages;
   }
   getStyles() {
-    var t;
-    const e = (t = this._themeSubscription.manager.getTheme().inbox) == null ? void 0 : t.list;
+    var i;
+    const e = (i = this._themeSubscription.manager.getTheme().inbox) == null ? void 0 : i.list;
     return `
       :host {
         flex: 1;
@@ -1458,8 +2389,8 @@ class vo extends HTMLElement {
     `;
   }
   reset() {
-    var t, s;
-    for (; (t = this.shadowRoot) != null && t.firstChild; )
+    var i, s;
+    for (; (i = this.shadowRoot) != null && i.firstChild; )
       this.shadowRoot.removeChild(this.shadowRoot.firstChild);
     const e = document.createElement("style");
     e.textContent = this.getStyles(), (s = this.shadowRoot) == null || s.appendChild(e);
@@ -1470,14 +2401,14 @@ class vo extends HTMLElement {
   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();
+  addMessage(e, i = 0) {
+    this._messages.splice(i, 0, e), this.render();
   }
   removeMessage(e = 0) {
     this._messages.splice(e, 1), this.render();
   }
-  updateMessage(e, t = 0) {
-    this._messages[t] = e, this.render();
+  updateMessage(e, i = 0) {
+    this._messages[i] = e, this.render();
   }
   setFeedType(e) {
     this._feedType = e, this._error = null, this._isLoading = !0, this.render();
@@ -1498,93 +2429,93 @@ class vo extends HTMLElement {
     this._onRefresh();
   }
   render() {
-    var s, o, n, h, d, c, u, m, p, x, _, b, v, k, w, S, E, M, I, T, $, D, y, B, F, H, R, z, O, N, U, V, Z, J, q, X, Y, j, se, oe, ne, re, ae, he, ce, le, de, ue, pe, ge, me, be, _e, xe, fe, Ce, ve, ye;
+    var s, o, n, c, d, l, p, m, g, f, _, b, C, k, w, S, I, E, M, L, R, D, y, A, F, H, O, z, U, N, q, V, j, X, Q, Y, ee, G, ae, he, ce, le, de, ue, pe, ge, me, be, _e, fe, xe, ve, Ce, ye, ke, we, Se, Ie;
     this.reset();
     const e = this._themeSubscription.manager.getTheme();
     if (this._error) {
-      const l = (s = e.inbox) == null ? void 0 : s.error, P = new Me({
+      const u = (s = e.inbox) == null ? void 0 : s.error, B = new Be({
         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: (m = (u = l == null ? void 0 : l.title) == null ? void 0 : u.font) == null ? void 0 : m.size,
-          fontWeight: (x = (p = l == null ? void 0 : l.title) == null ? void 0 : p.font) == null ? void 0 : x.weight
+          text: ((o = u == null ? void 0 : u.title) == null ? void 0 : o.text) ?? this._error.message,
+          textColor: (c = (n = u == null ? void 0 : u.title) == null ? void 0 : n.font) == null ? void 0 : c.color,
+          fontFamily: (l = (d = u == null ? void 0 : u.title) == null ? void 0 : d.font) == null ? void 0 : l.family,
+          fontSize: (m = (p = u == null ? void 0 : u.title) == null ? void 0 : p.font) == null ? void 0 : m.size,
+          fontWeight: (f = (g = u == null ? void 0 : u.title) == null ? void 0 : g.font) == null ? void 0 : f.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: (M = (E = l == null ? void 0 : l.button) == null ? void 0 : E.font) == null ? void 0 : M.family,
-          fontSize: (T = (I = l == null ? void 0 : l.button) == null ? void 0 : I.font) == null ? void 0 : T.size,
-          fontWeight: (D = ($ = l == null ? void 0 : l.button) == null ? void 0 : $.font) == null ? void 0 : D.weight,
-          shadow: (y = l == null ? void 0 : l.button) == null ? void 0 : y.shadow,
-          border: (B = l == null ? void 0 : l.button) == null ? void 0 : B.border,
-          borderRadius: (F = l == null ? void 0 : l.button) == null ? void 0 : F.borderRadius
+          text: (_ = u == null ? void 0 : u.button) == null ? void 0 : _.text,
+          backgroundColor: (b = u == null ? void 0 : u.button) == null ? void 0 : b.backgroundColor,
+          hoverBackgroundColor: (C = u == null ? void 0 : u.button) == null ? void 0 : C.hoverBackgroundColor,
+          activeBackgroundColor: (k = u == null ? void 0 : u.button) == null ? void 0 : k.activeBackgroundColor,
+          textColor: (S = (w = u == null ? void 0 : u.button) == null ? void 0 : w.font) == null ? void 0 : S.color,
+          fontFamily: (E = (I = u == null ? void 0 : u.button) == null ? void 0 : I.font) == null ? void 0 : E.family,
+          fontSize: (L = (M = u == null ? void 0 : u.button) == null ? void 0 : M.font) == null ? void 0 : L.size,
+          fontWeight: (D = (R = u == null ? void 0 : u.button) == null ? void 0 : R.font) == null ? void 0 : D.weight,
+          shadow: (y = u == null ? void 0 : u.button) == null ? void 0 : y.shadow,
+          border: (A = u == null ? void 0 : u.button) == null ? void 0 : A.border,
+          borderRadius: (F = u == null ? void 0 : u.button) == null ? void 0 : F.borderRadius
         }
       });
-      P.build((H = this._errorStateFactory) == null ? void 0 : H.call(this, { feedType: this._feedType, error: this._error })), P.setButtonClickCallback(() => this.handleRetry()), (R = this.shadowRoot) == null || R.appendChild(P);
+      B.build((H = this._errorStateFactory) == null ? void 0 : H.call(this, { feedType: this._feedType, error: this._error })), B.setButtonClickCallback(() => this.handleRetry()), (O = this.shadowRoot) == null || O.appendChild(B);
       return;
     }
     if (this._isLoading) {
-      const l = new $e(e);
-      l.build((z = this._loadingStateFactory) == null ? void 0 : z.call(this, { feedType: this._feedType })), (O = this.shadowRoot) == null || O.appendChild(l);
+      const u = new Ne(e);
+      u.build((z = this._loadingStateFactory) == null ? void 0 : z.call(this, { feedType: this._feedType })), (U = this.shadowRoot) == null || U.appendChild(u);
       return;
     }
     if (this._messages.length === 0) {
-      const l = (N = e.inbox) == null ? void 0 : N.empty, P = new Me({
+      const u = (N = e.inbox) == null ? void 0 : N.empty, B = new Be({
         title: {
-          text: ((U = l == null ? void 0 : l.title) == null ? void 0 : U.text) ?? `No ${this._feedType} messages yet`,
-          textColor: (Z = (V = l == null ? void 0 : l.title) == null ? void 0 : V.font) == null ? void 0 : Z.color,
-          fontFamily: (q = (J = l == null ? void 0 : l.title) == null ? void 0 : J.font) == null ? void 0 : q.family,
-          fontSize: (Y = (X = l == null ? void 0 : l.title) == null ? void 0 : X.font) == null ? void 0 : Y.size,
-          fontWeight: (se = (j = l == null ? void 0 : l.title) == null ? void 0 : j.font) == null ? void 0 : se.weight
+          text: ((q = u == null ? void 0 : u.title) == null ? void 0 : q.text) ?? `No ${this._feedType} messages yet`,
+          textColor: (j = (V = u == null ? void 0 : u.title) == null ? void 0 : V.font) == null ? void 0 : j.color,
+          fontFamily: (Q = (X = u == null ? void 0 : u.title) == null ? void 0 : X.font) == null ? void 0 : Q.family,
+          fontSize: (ee = (Y = u == null ? void 0 : u.title) == null ? void 0 : Y.font) == null ? void 0 : ee.size,
+          fontWeight: (ae = (G = u == null ? void 0 : u.title) == null ? void 0 : G.font) == null ? void 0 : ae.weight
         },
         button: {
-          text: (oe = l == null ? void 0 : l.button) == null ? void 0 : oe.text,
-          backgroundColor: (ne = l == null ? void 0 : l.button) == null ? void 0 : ne.backgroundColor,
-          hoverBackgroundColor: (re = l == null ? void 0 : l.button) == null ? void 0 : re.hoverBackgroundColor,
-          activeBackgroundColor: (ae = l == null ? void 0 : l.button) == null ? void 0 : ae.activeBackgroundColor,
-          textColor: (ce = (he = l == null ? void 0 : l.button) == null ? void 0 : he.font) == null ? void 0 : ce.color,
-          fontFamily: (de = (le = l == null ? void 0 : l.button) == null ? void 0 : le.font) == null ? void 0 : de.family,
-          fontSize: (pe = (ue = l == null ? void 0 : l.button) == null ? void 0 : ue.font) == null ? void 0 : pe.size,
-          fontWeight: (me = (ge = l == null ? void 0 : l.button) == null ? void 0 : ge.font) == null ? void 0 : me.weight,
-          shadow: (be = l == null ? void 0 : l.button) == null ? void 0 : be.shadow,
-          border: (_e = l == null ? void 0 : l.button) == null ? void 0 : _e.border,
-          borderRadius: (xe = l == null ? void 0 : l.button) == null ? void 0 : xe.borderRadius
+          text: (he = u == null ? void 0 : u.button) == null ? void 0 : he.text,
+          backgroundColor: (ce = u == null ? void 0 : u.button) == null ? void 0 : ce.backgroundColor,
+          hoverBackgroundColor: (le = u == null ? void 0 : u.button) == null ? void 0 : le.hoverBackgroundColor,
+          activeBackgroundColor: (de = u == null ? void 0 : u.button) == null ? void 0 : de.activeBackgroundColor,
+          textColor: (pe = (ue = u == null ? void 0 : u.button) == null ? void 0 : ue.font) == null ? void 0 : pe.color,
+          fontFamily: (me = (ge = u == null ? void 0 : u.button) == null ? void 0 : ge.font) == null ? void 0 : me.family,
+          fontSize: (_e = (be = u == null ? void 0 : u.button) == null ? void 0 : be.font) == null ? void 0 : _e.size,
+          fontWeight: (xe = (fe = u == null ? void 0 : u.button) == null ? void 0 : fe.font) == null ? void 0 : xe.weight,
+          shadow: (ve = u == null ? void 0 : u.button) == null ? void 0 : ve.shadow,
+          border: (Ce = u == null ? void 0 : u.button) == null ? void 0 : Ce.border,
+          borderRadius: (ye = u == null ? void 0 : u.button) == null ? void 0 : ye.borderRadius
         }
       });
-      P.build((fe = this._emptyStateFactory) == null ? void 0 : fe.call(this, { feedType: this._feedType })), P.setButtonClickCallback(() => this.handleRefresh()), (Ce = this.shadowRoot) == null || Ce.appendChild(P);
+      B.build((ke = this._emptyStateFactory) == null ? void 0 : ke.call(this, { feedType: this._feedType })), B.setButtonClickCallback(() => this.handleRefresh()), (we = this.shadowRoot) == null || we.appendChild(B);
       return;
     }
-    const t = document.createElement("ul");
-    if ((ve = this.shadowRoot) == null || ve.appendChild(t), this._messages.forEach((l, P) => {
+    const i = document.createElement("ul");
+    if ((Se = this.shadowRoot) == null || Se.appendChild(i), this._messages.forEach((u, B) => {
       if (this._listItemFactory) {
-        t.appendChild(this._listItemFactory({ message: l, index: P }));
+        i.appendChild(this._listItemFactory({ message: u, index: B }));
         return;
       }
-      const K = new xo(e);
-      K.setMessage(l, this._feedType), K.setOnItemClick((Q) => {
-        var W;
-        return (W = this._onMessageClick) == null ? void 0 : W.call(this, Q, P);
-      }), K.setOnItemActionClick((Q, W) => {
-        var ke;
-        return (ke = this._onMessageActionClick) == null ? void 0 : ke.call(this, Q, W, P);
-      }), K.setOnItemLongPress((Q) => {
-        var W;
-        return (W = this._onMessageLongPress) == null ? void 0 : W.call(this, Q, P);
-      }), t.appendChild(K);
+      const te = new Ao(e);
+      te.setMessage(u, this._feedType), te.setOnItemClick((ie) => {
+        var J;
+        return (J = this._onMessageClick) == null ? void 0 : J.call(this, ie, B);
+      }), te.setOnItemActionClick((ie, J) => {
+        var Ee;
+        return (Ee = this._onMessageActionClick) == null ? void 0 : Ee.call(this, ie, J, B);
+      }), te.setOnItemLongPress((ie) => {
+        var J;
+        return (J = this._onMessageLongPress) == null ? void 0 : J.call(this, ie, B);
+      }), i.appendChild(te);
     }), this._canPaginate) {
-      const l = new Co({
+      const u = new Bo({
         theme: e,
-        customItem: (ye = this._paginationItemFactory) == null ? void 0 : ye.call(this, { feedType: this._feedType }),
+        customItem: (Ie = this._paginationItemFactory) == null ? void 0 : Ie.call(this, { feedType: this._feedType }),
         onPaginationTrigger: () => {
-          var P;
-          return (P = this._onPaginationTrigger) == null ? void 0 : P.call(this, this._feedType);
+          var B;
+          return (B = this._onPaginationTrigger) == null ? void 0 : B.call(this, this._feedType);
         }
       });
-      t.appendChild(l);
+      i.appendChild(u);
     }
   }
   // Factories
@@ -1611,8 +2542,8 @@ class vo extends HTMLElement {
     this._themeSubscription.unsubscribe();
   }
 }
-customElements.get("courier-inbox-list") || customElements.define("courier-inbox-list", vo);
-class yo extends HTMLElement {
+customElements.get("courier-inbox-list") || customElements.define("courier-inbox-list", Ro);
+class Do extends HTMLElement {
   constructor(e) {
     super();
     // State
@@ -1627,13 +2558,13 @@ class yo extends HTMLElement {
     // Theme
     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 ?? f.inbox), this._itemIcon.setAttribute("size", "16"), this._title = document.createElement("p"), this._title.textContent = this._option.text;
+    const i = this.attachShadow({ mode: "open" });
+    this._style = document.createElement("style"), this._content = document.createElement("div"), this._content.className = "menu-item", this._itemIcon = new ne(this._option.icon.svg ?? x.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(f.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();
+    s.className = "spacer", this._selectionIcon = new ne(x.check), this._content.appendChild(this._itemIcon), this._content.appendChild(this._title), this._content.appendChild(s), e.selectable && this._content.appendChild(this._selectionIcon), i.appendChild(this._style), i.appendChild(this._content), this._selectionIcon.style.display = this._isSelected ? "block" : "none", this.refreshTheme();
   }
   getStyles() {
-    var t, s, o, n, h, d, c, u, m, p, x, _, b, v, k, w, S, E, M, I, T, $, D, y, B, F, H, R, z, O, N, U, V, Z;
+    var i, s, o, n, c, d, l, p, m, g, f, _, b, C, k, w, S, I, E, M, L, R, D, y, A, F, H, O, z, U, N, q, V, j;
     const e = this._themeManager.getTheme();
     return `
       :host {
@@ -1644,11 +2575,11 @@ class yo extends HTMLElement {
       }
 
       :host(:hover) {
-        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"};
+        background-color: ${((c = (n = (o = (s = (i = e.inbox) == null ? void 0 : i.header) == null ? void 0 : s.menus) == null ? void 0 : o.popup) == null ? void 0 : n.list) == null ? void 0 : c.hoverBackgroundColor) ?? "red"};
       }
 
       :host(:active) {
-        background-color: ${((p = (m = (u = (c = (d = e.inbox) == null ? void 0 : d.header) == null ? void 0 : c.menus) == null ? void 0 : u.popup) == null ? void 0 : m.list) == null ? void 0 : p.activeBackgroundColor) ?? "red"};
+        background-color: ${((g = (m = (p = (l = (d = e.inbox) == null ? void 0 : d.header) == null ? void 0 : l.menus) == null ? void 0 : p.popup) == null ? void 0 : m.list) == null ? void 0 : g.activeBackgroundColor) ?? "red"};
       }
 
       .menu-item {
@@ -1664,10 +2595,10 @@ class yo extends HTMLElement {
 
       p {
         margin: 0;
-        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"};
-        font-weight: ${(($ = (T = (I = (M = (E = (S = e.inbox) == null ? void 0 : S.header) == null ? void 0 : E.menus) == null ? void 0 : M.popup) == null ? void 0 : I.list) == null ? void 0 : T.font) == null ? void 0 : $.weight) ?? "inherit"};
-        font-size: ${((R = (H = (F = (B = (y = (D = e.inbox) == null ? void 0 : D.header) == null ? void 0 : y.menus) == null ? void 0 : B.popup) == null ? void 0 : F.list) == null ? void 0 : H.font) == null ? void 0 : R.size) ?? "14px"};
-        color: ${((Z = (V = (U = (N = (O = (z = e.inbox) == null ? void 0 : z.header) == null ? void 0 : O.menus) == null ? void 0 : N.popup) == null ? void 0 : U.list) == null ? void 0 : V.font) == null ? void 0 : Z.color) ?? "red"};
+        font-family: ${((w = (k = (C = (b = (_ = (f = e.inbox) == null ? void 0 : f.header) == null ? void 0 : _.menus) == null ? void 0 : b.popup) == null ? void 0 : C.list) == null ? void 0 : k.font) == null ? void 0 : w.family) ?? "inherit"};
+        font-weight: ${((R = (L = (M = (E = (I = (S = e.inbox) == null ? void 0 : S.header) == null ? void 0 : I.menus) == null ? void 0 : E.popup) == null ? void 0 : M.list) == null ? void 0 : L.font) == null ? void 0 : R.weight) ?? "inherit"};
+        font-size: ${((O = (H = (F = (A = (y = (D = e.inbox) == null ? void 0 : D.header) == null ? void 0 : y.menus) == null ? void 0 : A.popup) == null ? void 0 : F.list) == null ? void 0 : H.font) == null ? void 0 : O.size) ?? "14px"};
+        color: ${((j = (V = (q = (N = (U = (z = e.inbox) == null ? void 0 : z.header) == null ? void 0 : U.menus) == null ? void 0 : N.popup) == null ? void 0 : q.list) == null ? void 0 : V.font) == null ? void 0 : j.color) ?? "red"};
         white-space: nowrap;
       }
 
@@ -1677,13 +2608,13 @@ class yo extends HTMLElement {
     `;
   }
   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) ?? f.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) ?? f.inbox);
+    var e, i, s, o;
+    this._style.textContent = this.getStyles(), this._selectionIcon.updateColor(((e = this._option.selectionIcon) == null ? void 0 : e.color) ?? "red"), this._selectionIcon.updateSVG(((i = this._option.selectionIcon) == null ? void 0 : i.svg) ?? x.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) ?? x.inbox);
   }
 }
-customElements.get("courier-inbox-filter-menu-item") || customElements.define("courier-inbox-filter-menu-item", yo);
-class Be extends HTMLElement {
-  constructor(e, t, s, o, n) {
+customElements.get("courier-inbox-filter-menu-item") || customElements.define("courier-inbox-filter-menu-item", Do);
+class He extends HTMLElement {
+  constructor(e, i, s, o, n) {
     super();
     // Theme
     a(this, "_themeSubscription");
@@ -1697,14 +2628,14 @@ class Be extends HTMLElement {
     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 Se(t === "filters" ? f.filter : f.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._type = i, this._selectable = s, this._options = o, this._selectedIndex = 0, this._onMenuOpen = n;
+    const c = this.attachShadow({ mode: "open" });
+    this._menuButton = new $e(i === "filters" ? x.filter : x.overflow), this._menu = document.createElement("div"), this._menu.className = `menu ${i}`, this._style = document.createElement("style"), c.appendChild(this._style), c.appendChild(this._menuButton), c.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, m, p, x, _, b, v, k, w, S, E, M, I, T;
+    var i, s, o, n, c, d, l, p, m, g, f, _, b, C, k, w, S, I, E, M, L;
     const e = this._themeSubscription.manager.getTheme();
     return `
       :host {
@@ -1717,10 +2648,10 @@ class Be extends HTMLElement {
         position: absolute;
         top: 42px;
         right: -6px;
-        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"};
-        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"};
-        background: ${((_ = (x = (p = (m = e.inbox) == null ? void 0 : m.header) == null ? void 0 : p.menus) == null ? void 0 : x.popup) == null ? void 0 : _.backgroundColor) ?? "red"};
-        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"};
+        border-radius: ${((n = (o = (s = (i = e.inbox) == null ? void 0 : i.header) == null ? void 0 : s.menus) == null ? void 0 : o.popup) == null ? void 0 : n.borderRadius) ?? "6px"};
+        border: ${((p = (l = (d = (c = e.inbox) == null ? void 0 : c.header) == null ? void 0 : d.menus) == null ? void 0 : l.popup) == null ? void 0 : p.border) ?? "1px solid red"};
+        background: ${((_ = (f = (g = (m = e.inbox) == null ? void 0 : m.header) == null ? void 0 : g.menus) == null ? void 0 : f.popup) == null ? void 0 : _.backgroundColor) ?? "red"};
+        box-shadow: ${((w = (k = (C = (b = e.inbox) == null ? void 0 : b.header) == null ? void 0 : C.menus) == null ? void 0 : k.popup) == null ? void 0 : w.shadow) ?? "0 4px 12px 0 red"};
         z-index: 1000;
         min-width: 200px;
         overflow: hidden;
@@ -1728,7 +2659,7 @@ class Be extends HTMLElement {
       }
 
       courier-inbox-filter-menu-item {
-        border-bottom: ${((T = (I = (M = (E = (S = e.inbox) == null ? void 0 : S.header) == null ? void 0 : E.menus) == null ? void 0 : M.popup) == null ? void 0 : I.list) == null ? void 0 : T.divider) ?? "none"};
+        border-bottom: ${((L = (M = (E = (I = (S = e.inbox) == null ? void 0 : S.header) == null ? void 0 : I.menus) == null ? void 0 : E.popup) == null ? void 0 : M.list) == null ? void 0 : L.divider) ?? "none"};
       }
 
       courier-inbox-filter-menu-item:last-child {
@@ -1737,31 +2668,31 @@ class Be extends HTMLElement {
     `;
   }
   refreshTheme() {
-    var h, d, c, u, m, p;
+    var c, d, l, p, m, g;
     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 ? f.filter : f.overflow;
-    this._menuButton.updateIconSVG(((m = o == null ? void 0 : o.icon) == null ? void 0 : m.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();
+    const i = (d = (c = this._themeSubscription.manager.getTheme().inbox) == null ? void 0 : c.header) == null ? void 0 : d.menus, s = this._type === "filters", o = s ? (l = i == null ? void 0 : i.filters) == null ? void 0 : l.button : (p = i == null ? void 0 : i.actions) == null ? void 0 : p.button, n = s ? x.filter : x.overflow;
+    this._menuButton.updateIconSVG(((m = o == null ? void 0 : o.icon) == null ? void 0 : m.svg) ?? n), this._menuButton.updateIconColor(((g = o == null ? void 0 : o.icon) == null ? void 0 : g.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 yo({
+    this._menu.innerHTML = "", this._options.forEach((e, i) => {
+      const s = new Do({
         option: e,
         selectable: this._selectable,
-        isSelected: this._selectedIndex === t,
+        isSelected: this._selectedIndex === i,
         themeManager: this._themeSubscription.manager
       });
       s.addEventListener("click", () => {
-        this._selectedIndex = t, e.onClick(e), this.refreshMenuItems(), this.closeMenu();
+        this._selectedIndex = i, 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();
+    const i = this._menu.style.display !== "block";
+    this._menu.style.display = i ? "block" : "none", i && this._onMenuOpen();
   }
   handleOutsideClick(e) {
     this.contains(e.target) || this.closeMenu();
@@ -1770,14 +2701,14 @@ class Be extends HTMLElement {
     this._menu.style.display = "none";
   }
   selectOption(e) {
-    this._selectedIndex = this._options.findIndex((t) => t.id === e.id), this.refreshMenuItems();
+    this._selectedIndex = this._options.findIndex((i) => i.id === e.id), this.refreshMenuItems();
   }
   disconnectedCallback() {
     this._themeSubscription.unsubscribe();
   }
 }
-customElements.get("courier-inbox-option-menu") || customElements.define("courier-inbox-option-menu", Be);
-class De extends HTMLElement {
+customElements.get("courier-inbox-option-menu") || customElements.define("courier-inbox-option-menu", He);
+class qe extends HTMLElement {
   constructor(e) {
     super();
     // Theme
@@ -1791,12 +2722,12 @@ class De extends HTMLElement {
     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);
+    const i = 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), i.appendChild(this._style), i.appendChild(this._badge);
   }
   getStyles(e) {
-    var c, u, m, 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 = (m = t.inbox) == null ? void 0 : m.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;
+    var l, p, m, g, f, _, b;
+    const i = this._themeSubscription.manager.getTheme(), s = e === "button" ? (p = (l = i.popup) == null ? void 0 : l.button) == null ? void 0 : p.unreadIndicator : (f = (g = (m = i.inbox) == null ? void 0 : m.header) == null ? void 0 : g.filters) == null ? void 0 : f.unreadIndicator, o = s == null ? void 0 : s.backgroundColor, n = s == null ? void 0 : s.borderRadius, c = (_ = s == null ? void 0 : s.font) == null ? void 0 : _.color, d = (b = s == null ? void 0 : s.font) == null ? void 0 : b.size;
     return `
       :host {
         display: inline-block;
@@ -1804,7 +2735,7 @@ class De extends HTMLElement {
 
       .unread-badge {
         background-color: ${o};
-        color: ${h};
+        color: ${c};
         border-radius: ${n};
         padding: 4px 8px;
         font-size: ${d};
@@ -1827,9 +2758,9 @@ class De extends HTMLElement {
     this._themeSubscription.unsubscribe();
   }
 }
-customElements.get("courier-unread-count-badge") || customElements.define("courier-unread-count-badge", De);
-class ko extends HTMLElement {
-  constructor(e, t) {
+customElements.get("courier-unread-count-badge") || customElements.define("courier-unread-count-badge", qe);
+class Fo extends HTMLElement {
+  constructor(e, i) {
     super();
     // Theme
     a(this, "_themeSubscription");
@@ -1842,9 +2773,9 @@ class ko extends HTMLElement {
     a(this, "_unreadBadge");
     a(this, "_container");
     a(this, "_style");
-    this._option = t;
+    this._option = i;
     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 De({
+    this._style = document.createElement("style"), this._container = document.createElement("div"), this._container.className = "title-section", this._iconElement = new ne(void 0, this._option.icon.svg), this._titleElement = document.createElement("h2"), this._unreadBadge = new qe({
       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) => {
@@ -1852,7 +2783,7 @@ class ko extends HTMLElement {
     }), this.refreshTheme(this._feedType ?? "inbox");
   }
   getStyles() {
-    var t, s, o, n, h, d, c, u, m, p, x, _, b, v, k, w;
+    var i, s, o, n, c, d, l, p, m, g, f, _, b, C, k, w;
     const e = this._themeSubscription.manager.getTheme();
     return `
       .title-section {
@@ -1869,10 +2800,10 @@ class ko extends HTMLElement {
 
       h2 {
         margin: 0;
-        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"};
-        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"};
-        font-weight: ${((_ = (x = (p = (m = e.inbox) == null ? void 0 : m.header) == null ? void 0 : p.filters) == null ? void 0 : x.font) == null ? void 0 : _.weight) ?? "500"};
-        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"};
+        font-family: ${((n = (o = (s = (i = e.inbox) == null ? void 0 : i.header) == null ? void 0 : s.filters) == null ? void 0 : o.font) == null ? void 0 : n.family) ?? "inherit"};
+        font-size: ${((p = (l = (d = (c = e.inbox) == null ? void 0 : c.header) == null ? void 0 : d.filters) == null ? void 0 : l.font) == null ? void 0 : p.size) ?? "18px"};
+        font-weight: ${((_ = (f = (g = (m = e.inbox) == null ? void 0 : m.header) == null ? void 0 : g.filters) == null ? void 0 : f.font) == null ? void 0 : _.weight) ?? "500"};
+        color: ${((w = (k = (C = (b = e.inbox) == null ? void 0 : b.header) == null ? void 0 : C.filters) == null ? void 0 : k.font) == null ? void 0 : w.color) ?? "red"};
       }
 
       courier-unread-count-badge {
@@ -1883,18 +2814,18 @@ class ko extends HTMLElement {
   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();
+  updateSelectedOption(e, i, s) {
+    this._option = e, this._feedType = i, this._unreadBadge.setCount(s), this.updateFilter();
   }
   updateFilter() {
-    var t, s, o, n, h, d, c, u, m, p, x, _, b, v, k, w, S, E, M, I, T, $, D, y, B, F, H, R;
+    var i, s, o, n, c, d, l, p, m, g, f, _, b, C, k, w, S, I, E, M, L, R, D, y, A, F, H, O;
     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(((m = (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 : m.svg) ?? f.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");
+        this._titleElement.textContent = ((n = (o = (s = (i = e.inbox) == null ? void 0 : i.header) == null ? void 0 : s.filters) == null ? void 0 : o.inbox) == null ? void 0 : n.text) ?? "Inbox", this._iconElement.updateSVG(((m = (p = (l = (d = (c = e.inbox) == null ? void 0 : c.header) == null ? void 0 : d.filters) == null ? void 0 : l.inbox) == null ? void 0 : p.icon) == null ? void 0 : m.svg) ?? x.inbox), this._iconElement.updateColor(((C = (b = (_ = (f = (g = e.inbox) == null ? void 0 : g.header) == null ? void 0 : f.filters) == null ? void 0 : _.inbox) == null ? void 0 : b.icon) == null ? void 0 : C.color) ?? "red");
         break;
       case "archive":
-        this._titleElement.textContent = ((E = (S = (w = (k = e.inbox) == null ? void 0 : k.header) == null ? void 0 : w.filters) == null ? void 0 : S.archive) == null ? void 0 : E.text) ?? "Archive", this._iconElement.updateSVG(((D = ($ = (T = (I = (M = e.inbox) == null ? void 0 : M.header) == null ? void 0 : I.filters) == null ? void 0 : T.archive) == null ? void 0 : $.icon) == null ? void 0 : D.svg) ?? f.archive), this._iconElement.updateColor(((R = (H = (F = (B = (y = e.inbox) == null ? void 0 : y.header) == null ? void 0 : B.filters) == null ? void 0 : F.archive) == null ? void 0 : H.icon) == null ? void 0 : R.color) ?? "red");
+        this._titleElement.textContent = ((I = (S = (w = (k = e.inbox) == null ? void 0 : k.header) == null ? void 0 : w.filters) == null ? void 0 : S.archive) == null ? void 0 : I.text) ?? "Archive", this._iconElement.updateSVG(((D = (R = (L = (M = (E = e.inbox) == null ? void 0 : E.header) == null ? void 0 : M.filters) == null ? void 0 : L.archive) == null ? void 0 : R.icon) == null ? void 0 : D.svg) ?? x.archive), this._iconElement.updateColor(((O = (H = (F = (A = (y = e.inbox) == null ? void 0 : y.header) == null ? void 0 : A.filters) == null ? void 0 : F.archive) == null ? void 0 : H.icon) == null ? void 0 : O.color) ?? "red");
         break;
     }
   }
@@ -1903,8 +2834,8 @@ class ko extends HTMLElement {
     this._themeSubscription.unsubscribe();
   }
 }
-customElements.get("courier-inbox-header-title") || customElements.define("courier-inbox-header-title", ko);
-class wo extends Le {
+customElements.get("courier-inbox-header-title") || customElements.define("courier-inbox-header-title", Fo);
+class Ho extends De {
   constructor(e) {
     super();
     // Theme
@@ -1919,86 +2850,86 @@ class wo extends Le {
     a(this, "_style");
     // Callbacks
     a(this, "_onFeedTypeChange");
-    this._themeSubscription = e.themeManager.subscribe((t) => {
+    this._themeSubscription = e.themeManager.subscribe((i) => {
       this.refreshTheme();
     }), this._onFeedTypeChange = e.onFeedTypeChange;
   }
   // Menu options
   getFilterOptions() {
-    var s, o, n, h, d, c, u, m, p, x, _, b, v, k, w, S, E, M, I, T, $, D, y, B, F, H, R, z, O, N, U, V, Z, J, q, X, Y;
-    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;
+    var s, o, n, c, d, l, p, m, g, f, _, b, C, k, w, S, I, E, M, L, R, D, y, A, F, H, O, z, U, N, q, V, j, X, Q, Y, ee;
+    const e = this._themeSubscription.manager.getTheme(), i = (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",
+        text: ((c = i == null ? void 0 : i.inbox) == null ? void 0 : c.text) ?? "Inbox",
         icon: {
-          color: ((c = (d = t == null ? void 0 : t.inbox) == null ? void 0 : d.icon) == null ? void 0 : c.color) ?? "red",
-          svg: ((m = (u = t == null ? void 0 : t.inbox) == null ? void 0 : u.icon) == null ? void 0 : m.svg) ?? f.inbox
+          color: ((l = (d = i == null ? void 0 : i.inbox) == null ? void 0 : d.icon) == null ? void 0 : l.color) ?? "red",
+          svg: ((m = (p = i == null ? void 0 : i.inbox) == null ? void 0 : p.icon) == null ? void 0 : m.svg) ?? x.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: ((T = (I = (M = (E = (S = (w = e.inbox) == null ? void 0 : w.header) == null ? void 0 : S.menus) == null ? void 0 : E.popup) == null ? void 0 : M.list) == null ? void 0 : I.selectionIcon) == null ? void 0 : T.svg) ?? f.check
+          color: ((k = (C = (b = (_ = (f = (g = e.inbox) == null ? void 0 : g.header) == null ? void 0 : f.menus) == null ? void 0 : _.popup) == null ? void 0 : b.list) == null ? void 0 : C.selectionIcon) == null ? void 0 : k.color) ?? "red",
+          svg: ((L = (M = (E = (I = (S = (w = e.inbox) == null ? void 0 : w.header) == null ? void 0 : S.menus) == null ? void 0 : I.popup) == null ? void 0 : E.list) == null ? void 0 : M.selectionIcon) == null ? void 0 : L.svg) ?? x.check
         },
-        onClick: (j) => {
-          this.handleOptionMenuItemClick("inbox", j);
+        onClick: (G) => {
+          this.handleOptionMenuItemClick("inbox", G);
         }
       },
       {
         id: "archive",
-        text: (($ = t == null ? void 0 : t.archive) == null ? void 0 : $.text) ?? "Archive",
+        text: ((R = i == null ? void 0 : i.archive) == null ? void 0 : R.text) ?? "Archive",
         icon: {
-          color: ((y = (D = t == null ? void 0 : t.archive) == null ? void 0 : D.icon) == null ? void 0 : y.color) ?? "red",
-          svg: ((F = (B = t == null ? void 0 : t.archive) == null ? void 0 : B.icon) == null ? void 0 : F.svg) ?? f.archive
+          color: ((y = (D = i == null ? void 0 : i.archive) == null ? void 0 : D.icon) == null ? void 0 : y.color) ?? "red",
+          svg: ((F = (A = i == null ? void 0 : i.archive) == null ? void 0 : A.icon) == null ? void 0 : F.svg) ?? x.archive
         },
         selectionIcon: {
-          color: ((U = (N = (O = (z = (R = (H = e.inbox) == null ? void 0 : H.header) == null ? void 0 : R.menus) == null ? void 0 : z.popup) == null ? void 0 : O.list) == null ? void 0 : N.selectionIcon) == null ? void 0 : U.color) ?? "red",
-          svg: ((Y = (X = (q = (J = (Z = (V = e.inbox) == null ? void 0 : V.header) == null ? void 0 : Z.menus) == null ? void 0 : J.popup) == null ? void 0 : q.list) == null ? void 0 : X.selectionIcon) == null ? void 0 : Y.svg) ?? f.check
+          color: ((q = (N = (U = (z = (O = (H = e.inbox) == null ? void 0 : H.header) == null ? void 0 : O.menus) == null ? void 0 : z.popup) == null ? void 0 : U.list) == null ? void 0 : N.selectionIcon) == null ? void 0 : q.color) ?? "red",
+          svg: ((ee = (Y = (Q = (X = (j = (V = e.inbox) == null ? void 0 : V.header) == null ? void 0 : j.menus) == null ? void 0 : X.popup) == null ? void 0 : Q.list) == null ? void 0 : Y.selectionIcon) == null ? void 0 : ee.svg) ?? x.check
         },
-        onClick: (j) => {
-          this.handleOptionMenuItemClick("archive", j);
+        onClick: (G) => {
+          this.handleOptionMenuItemClick("archive", G);
         }
       }
     ];
   }
   getActionOptions() {
-    var s, o, n, h, d, c, u, m, p, x, _, b, v, k, w, S, E, M;
-    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;
+    var s, o, n, c, d, l, p, m, g, f, _, b, C, k, w, S, I, E;
+    const i = (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",
+        text: ((c = i == null ? void 0 : i.markAllRead) == null ? void 0 : c.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: ((m = (u = t == null ? void 0 : t.markAllRead) == null ? void 0 : u.icon) == null ? void 0 : m.svg) ?? f.inbox
+          color: ((l = (d = i == null ? void 0 : i.markAllRead) == null ? void 0 : d.icon) == null ? void 0 : l.color) ?? "red",
+          svg: ((m = (p = i == null ? void 0 : i.markAllRead) == null ? void 0 : p.icon) == null ? void 0 : m.svg) ?? x.inbox
         },
         selectionIcon: null,
-        onClick: (I) => {
-          A.shared.readAllMessages();
+        onClick: (M) => {
+          P.shared.readAllMessages({ canCallApi: !0 });
         }
       },
       {
         id: "archiveAll",
-        text: ((p = t == null ? void 0 : t.archiveAll) == null ? void 0 : p.text) ?? "Archive All",
+        text: ((g = i == null ? void 0 : i.archiveAll) == null ? void 0 : g.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) ?? f.archive
+          color: ((_ = (f = i == null ? void 0 : i.archiveAll) == null ? void 0 : f.icon) == null ? void 0 : _.color) ?? "red",
+          svg: ((C = (b = i == null ? void 0 : i.archiveAll) == null ? void 0 : b.icon) == null ? void 0 : C.svg) ?? x.archive
         },
         selectionIcon: null,
-        onClick: (I) => {
-          var T;
-          alert(JSON.stringify((T = C.shared.client) == null ? void 0 : T.options));
+        onClick: (M) => {
+          var L;
+          alert(JSON.stringify((L = v.shared.client) == null ? void 0 : L.options));
         }
       },
       {
         id: "archiveRead",
-        text: ((k = t == null ? void 0 : t.archiveRead) == null ? void 0 : k.text) ?? "Archive Read",
+        text: ((k = i == null ? void 0 : i.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: ((M = (E = t == null ? void 0 : t.archiveRead) == null ? void 0 : E.icon) == null ? void 0 : M.svg) ?? f.archive
+          color: ((S = (w = i == null ? void 0 : i.archiveRead) == null ? void 0 : w.icon) == null ? void 0 : S.color) ?? "red",
+          svg: ((E = (I = i == null ? void 0 : i.archiveRead) == null ? void 0 : I.icon) == null ? void 0 : E.svg) ?? x.archive
         },
         selectionIcon: null,
-        onClick: (I) => {
-          alert("TODO: Archive read messages");
+        onClick: (M) => {
+          P.shared.archiveReadMessages({ canCallApi: !0 });
         }
       }
     ];
@@ -2007,40 +2938,40 @@ class wo extends Le {
     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());
+    var s, o, n, c, d, l, p;
+    const e = this._themeSubscription.manager.getTheme(), i = (s = this.shadow) == null ? void 0 : s.querySelector(".courier-inbox-header");
+    i && (i.style.backgroundColor = ((n = (o = e.inbox) == null ? void 0 : o.header) == null ? void 0 : n.backgroundColor) ?? r.white[500], i.style.boxShadow = ((d = (c = e.inbox) == null ? void 0 : c.header) == null ? void 0 : d.shadow) ?? `0px 1px 0px 0px ${r.gray[500]}`), (l = this._filterMenu) == null || l.setOptions(this.getFilterOptions()), (p = this._actionMenu) == null || p.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);
+  handleOptionMenuItemClick(e, i) {
+    this._feedType = e, this._titleSection && this._titleSection.updateSelectedOption(i, 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;
+    var i, 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));
+    e && ((i = this._titleSection) == null || i.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();
+    var i;
+    super.build(e), this._style = document.createElement("style"), this._style.textContent = this.getStyles(), (i = this.shadow) == null || i.appendChild(this._style), this.refreshTheme();
   }
   defaultElement() {
     const e = this.getFilterOptions();
-    this._titleSection = new ko(this._themeSubscription.manager, e[0]), this._filterMenu = new Be(this._themeSubscription.manager, "filters", !0, e, () => {
+    this._titleSection = new Fo(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 Be(this._themeSubscription.manager, "actions", !1, this.getActionOptions(), () => {
+    }), 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 i = document.createElement("div");
+    i.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;
+    return o.className = "courier-inbox-header", o.appendChild(this._titleSection), o.appendChild(i), o.appendChild(s), o;
   }
   getStyles() {
     return `
@@ -2079,22 +3010,22 @@ class wo extends Le {
     this._themeSubscription.unsubscribe();
   }
 }
-customElements.get("courier-inbox-header") || customElements.define("courier-inbox-header", wo);
-class So {
-  constructor(i) {
+customElements.get("courier-inbox-header") || customElements.define("courier-inbox-header", Ho);
+class Oo {
+  constructor(t) {
     a(this, "events");
-    this.events = i;
+    this.events = t;
   }
   remove() {
-    A.shared.removeDataStoreListener(this);
+    P.shared.removeDataStoreListener(this);
   }
 }
-const we = {
+const Te = {
   popup: {
     button: {
       icon: {
         color: r.black[500],
-        svg: f.inbox
+        svg: x.inbox
       },
       backgroundColor: "transparent",
       hoverBackgroundColor: r.black[50010],
@@ -2130,14 +3061,14 @@ const we = {
         inbox: {
           icon: {
             color: r.black[500],
-            svg: f.inbox
+            svg: x.inbox
           },
           text: "Inbox"
         },
         archive: {
           icon: {
             color: r.black[500],
-            svg: f.archive
+            svg: x.archive
           },
           text: "Archive"
         },
@@ -2168,7 +3099,7 @@ const we = {
             },
             selectionIcon: {
               color: r.black[500],
-              svg: f.check
+              svg: x.check
             }
           }
         },
@@ -2176,7 +3107,7 @@ const we = {
           button: {
             icon: {
               color: r.black[500],
-              svg: f.filter
+              svg: x.filter
             },
             backgroundColor: "transparent",
             hoverBackgroundColor: r.black[50010],
@@ -2185,14 +3116,14 @@ const we = {
           inbox: {
             icon: {
               color: r.black[500],
-              svg: f.inbox
+              svg: x.inbox
             },
             text: "Inbox"
           },
           archive: {
             icon: {
               color: r.black[500],
-              svg: f.archive
+              svg: x.archive
             },
             text: "Archive"
           }
@@ -2201,7 +3132,7 @@ const we = {
           button: {
             icon: {
               color: r.black[500],
-              svg: f.overflow
+              svg: x.overflow
             },
             backgroundColor: "transparent",
             hoverBackgroundColor: r.black[50010],
@@ -2210,21 +3141,21 @@ const we = {
           markAllRead: {
             icon: {
               color: r.black[500],
-              svg: f.read
+              svg: x.read
             },
             text: "Mark All as Read"
           },
           archiveAll: {
             icon: {
               color: r.black[500],
-              svg: f.archive
+              svg: x.archive
             },
             text: "Archive All"
           },
           archiveRead: {
             icon: {
               color: r.black[500],
-              svg: f.archiveRead
+              svg: x.archiveRead
             },
             text: "Archive Read"
           }
@@ -2283,19 +3214,19 @@ const we = {
             borderRadius: "0px",
             read: {
               color: r.black[500],
-              svg: f.read
+              svg: x.read
             },
             unread: {
               color: r.black[500],
-              svg: f.unread
+              svg: x.unread
             },
             archive: {
               color: r.black[500],
-              svg: f.archive
+              svg: x.archive
             },
             unarchive: {
               color: r.black[500],
-              svg: f.unarchive
+              svg: x.unarchive
             }
           }
         }
@@ -2335,12 +3266,12 @@ const we = {
       }
     }
   }
-}, Ae = {
+}, Oe = {
   popup: {
     button: {
       icon: {
         color: r.white[500],
-        svg: f.inbox
+        svg: x.inbox
       },
       backgroundColor: "transparent",
       hoverBackgroundColor: r.white[50010],
@@ -2376,14 +3307,14 @@ const we = {
         inbox: {
           icon: {
             color: r.white[500],
-            svg: f.inbox
+            svg: x.inbox
           },
           text: "Inbox"
         },
         archive: {
           icon: {
             color: r.white[500],
-            svg: f.archive
+            svg: x.archive
           },
           text: "Archive"
         },
@@ -2414,7 +3345,7 @@ const we = {
             },
             selectionIcon: {
               color: r.white[500],
-              svg: f.check
+              svg: x.check
             }
           }
         },
@@ -2422,7 +3353,7 @@ const we = {
           button: {
             icon: {
               color: r.white[500],
-              svg: f.filter
+              svg: x.filter
             },
             backgroundColor: "transparent",
             hoverBackgroundColor: r.white[50010],
@@ -2431,14 +3362,14 @@ const we = {
           inbox: {
             icon: {
               color: r.white[500],
-              svg: f.inbox
+              svg: x.inbox
             },
             text: "Inbox"
           },
           archive: {
             icon: {
               color: r.white[500],
-              svg: f.archive
+              svg: x.archive
             },
             text: "Archive"
           }
@@ -2447,7 +3378,7 @@ const we = {
           button: {
             icon: {
               color: r.white[500],
-              svg: f.overflow
+              svg: x.overflow
             },
             backgroundColor: "transparent",
             hoverBackgroundColor: r.white[50010],
@@ -2456,21 +3387,21 @@ const we = {
           markAllRead: {
             icon: {
               color: r.white[500],
-              svg: f.read
+              svg: x.read
             },
             text: "Mark All as Read"
           },
           archiveAll: {
             icon: {
               color: r.white[500],
-              svg: f.archive
+              svg: x.archive
             },
             text: "Archive All"
           },
           archiveRead: {
             icon: {
               color: r.white[500],
-              svg: f.archiveRead
+              svg: x.archiveRead
             },
             text: "Archive Read"
           }
@@ -2529,19 +3460,19 @@ const we = {
             borderRadius: "0px",
             read: {
               color: r.white[500],
-              svg: f.read
+              svg: x.read
             },
             unread: {
               color: r.white[500],
-              svg: f.unread
+              svg: x.unread
             },
             archive: {
               color: r.white[500],
-              svg: f.archive
+              svg: x.archive
             },
             unarchive: {
               color: r.white[500],
-              svg: f.unarchive
+              svg: x.unarchive
             }
           }
         }
@@ -2581,195 +3512,195 @@ const we = {
       }
     }
   }
-}, Do = (g, i) => {
-  var t, s, o, n, h, d, c, u, m, p, x, _, b, v, k, w, S, E, M, I, T, $, D, y, B, F, H, R, z, O, N, U, V, Z, J, q, X, Y, j, se, oe, ne, re, ae, he, ce, le, de, ue, pe, ge, me, be, _e, xe, fe, Ce, ve, ye, l, P, K, Q, W, ke, Fe, He, Re, ze, Oe, Ne, Ue, Ve, Ze, We, je, Ge, Je, qe, Xe, Ye, Ke, Qe, et, tt, it, st, ot, nt, rt, at, ht, ct, lt, dt, ut, pt, gt, mt, bt, _t, xt, ft, Ct, vt, yt, kt, wt, St, Et, Mt, It, Lt, Tt, Bt, At, Pt, $t, Dt, Ft, Ht, Rt, zt, Ot, Nt, Ut, Vt, Zt, Wt, jt, Gt, Jt, qt, Xt, Yt, Kt, Qt, ei, ti, ii, si, oi, ni, ri, ai, hi, ci, li, di, ui, pi, gi, mi, bi, _i, xi, fi, Ci, vi, yi, ki, wi, Si, Ei, Mi, Ii, Li, Ti, Bi, Ai, Pi, $i, Di, Fi, Hi, Ri, zi, Oi, Ni, Ui, Vi, Zi, Wi, ji, Gi, Ji, qi, Xi, Yi, Ki, Qi, es, ts, is, ss, os, ns, rs, as, hs, cs, ls, ds, us, ps, gs, ms, bs, _s, xs, fs, Cs, vs, ys, ks, ws, Ss, Es, Ms, Is, Ls, Ts, Bs, As, Ps, $s, Ds, Fs, Hs, Rs, zs, Os, Ns, Us, Vs, Zs, Ws, js, Gs, Js, qs, Xs, Ys, Ks, Qs, eo, to, io, so, oo, no, ro, ao, ho, co, lo, uo, po;
-  const e = g === "light" ? we : Ae;
+}, dn = (h, t) => {
+  var i, s, o, n, c, d, l, p, m, g, f, _, b, C, k, w, S, I, E, M, L, R, D, y, A, F, H, O, z, U, N, q, V, j, X, Q, Y, ee, G, ae, he, ce, le, de, ue, pe, ge, me, be, _e, fe, xe, ve, Ce, ye, ke, we, Se, Ie, u, B, te, ie, J, Ee, Ve, je, Ze, Je, Ge, We, Ke, Xe, Qe, Ye, et, tt, it, st, ot, nt, rt, at, ht, ct, lt, dt, ut, pt, gt, mt, bt, _t, ft, xt, vt, Ct, yt, kt, wt, St, It, Et, Mt, Tt, $t, Lt, At, Pt, Bt, Rt, Dt, Ft, Ht, Ot, zt, Ut, Nt, qt, Vt, jt, Zt, Jt, Gt, Wt, Kt, Xt, Qt, Yt, ei, ti, ii, si, oi, ni, ri, ai, hi, ci, li, di, ui, pi, gi, mi, bi, _i, fi, xi, vi, Ci, yi, ki, wi, Si, Ii, Ei, Mi, Ti, $i, Li, Ai, Pi, Bi, Ri, Di, Fi, Hi, Oi, zi, Ui, Ni, qi, Vi, ji, Zi, Ji, Gi, Wi, Ki, Xi, Qi, Yi, es, ts, is, ss, os, ns, rs, as, hs, cs, ls, ds, us, ps, gs, ms, bs, _s, fs, xs, vs, Cs, ys, ks, ws, Ss, Is, Es, Ms, Ts, $s, Ls, As, Ps, Bs, Rs, Ds, Fs, Hs, Os, zs, Us, Ns, qs, Vs, js, Zs, Js, Gs, Ws, Ks, Xs, Qs, Ys, eo, to, io, so, oo, no, ro, ao, ho, co, lo, uo, po, go, mo, bo, _o, fo, xo, vo, Co;
+  const e = h === "light" ? Te : Oe;
   return {
     popup: {
       button: {
-        ...(t = e.popup) == null ? void 0 : t.button,
-        ...(s = i.popup) == null ? void 0 : s.button,
+        ...(i = e.popup) == null ? void 0 : i.button,
+        ...(s = t.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
+          ...(d = (c = t.popup) == null ? void 0 : c.button) == null ? void 0 : d.icon
         },
         unreadIndicator: {
-          ...(u = (c = e.popup) == null ? void 0 : c.button) == null ? void 0 : u.unreadIndicator,
-          ...(p = (m = i.popup) == null ? void 0 : m.button) == null ? void 0 : p.unreadIndicator
+          ...(p = (l = e.popup) == null ? void 0 : l.button) == null ? void 0 : p.unreadIndicator,
+          ...(g = (m = t.popup) == null ? void 0 : m.button) == null ? void 0 : g.unreadIndicator
         }
       },
       window: {
-        ...(x = e.popup) == null ? void 0 : x.window,
-        ...(_ = i.popup) == null ? void 0 : _.window
+        ...(f = e.popup) == null ? void 0 : f.window,
+        ...(_ = t.popup) == null ? void 0 : _.window
       }
     },
     inbox: {
       header: {
         ...(b = e.inbox) == null ? void 0 : b.header,
-        ...(v = i.inbox) == null ? void 0 : v.header,
+        ...(C = t.inbox) == null ? void 0 : C.header,
         filters: {
           ...(w = (k = e.inbox) == null ? void 0 : k.header) == null ? void 0 : w.filters,
-          ...(E = (S = i.inbox) == null ? void 0 : S.header) == null ? void 0 : E.filters,
+          ...(I = (S = t.inbox) == null ? void 0 : S.header) == null ? void 0 : I.filters,
           inbox: {
-            ...(T = (I = (M = e.inbox) == null ? void 0 : M.header) == null ? void 0 : I.filters) == null ? void 0 : T.inbox,
-            ...(y = (D = ($ = i.inbox) == null ? void 0 : $.header) == null ? void 0 : D.filters) == null ? void 0 : y.inbox,
+            ...(L = (M = (E = e.inbox) == null ? void 0 : E.header) == null ? void 0 : M.filters) == null ? void 0 : L.inbox,
+            ...(y = (D = (R = t.inbox) == null ? void 0 : R.header) == null ? void 0 : D.filters) == null ? void 0 : y.inbox,
             icon: {
-              ...(R = (H = (F = (B = e.inbox) == null ? void 0 : B.header) == null ? void 0 : F.filters) == null ? void 0 : H.inbox) == null ? void 0 : R.icon,
-              ...(U = (N = (O = (z = i.inbox) == null ? void 0 : z.header) == null ? void 0 : O.filters) == null ? void 0 : N.inbox) == null ? void 0 : U.icon
+              ...(O = (H = (F = (A = e.inbox) == null ? void 0 : A.header) == null ? void 0 : F.filters) == null ? void 0 : H.inbox) == null ? void 0 : O.icon,
+              ...(q = (N = (U = (z = t.inbox) == null ? void 0 : z.header) == null ? void 0 : U.filters) == null ? void 0 : N.inbox) == null ? void 0 : q.icon
             }
           },
           archive: {
-            ...(J = (Z = (V = e.inbox) == null ? void 0 : V.header) == null ? void 0 : Z.filters) == null ? void 0 : J.archive,
-            ...(Y = (X = (q = i.inbox) == null ? void 0 : q.header) == null ? void 0 : X.filters) == null ? void 0 : Y.archive,
+            ...(X = (j = (V = e.inbox) == null ? void 0 : V.header) == null ? void 0 : j.filters) == null ? void 0 : X.archive,
+            ...(ee = (Y = (Q = t.inbox) == null ? void 0 : Q.header) == null ? void 0 : Y.filters) == null ? void 0 : ee.archive,
             icon: {
-              ...(ne = (oe = (se = (j = e.inbox) == null ? void 0 : j.header) == null ? void 0 : se.filters) == null ? void 0 : oe.archive) == null ? void 0 : ne.icon,
-              ...(ce = (he = (ae = (re = i.inbox) == null ? void 0 : re.header) == null ? void 0 : ae.filters) == null ? void 0 : he.archive) == null ? void 0 : ce.icon
+              ...(ce = (he = (ae = (G = e.inbox) == null ? void 0 : G.header) == null ? void 0 : ae.filters) == null ? void 0 : he.archive) == null ? void 0 : ce.icon,
+              ...(pe = (ue = (de = (le = t.inbox) == null ? void 0 : le.header) == null ? void 0 : de.filters) == null ? void 0 : ue.archive) == null ? void 0 : pe.icon
             }
           },
           unreadIndicator: {
-            ...(ue = (de = (le = e.inbox) == null ? void 0 : le.header) == null ? void 0 : de.filters) == null ? void 0 : ue.unreadIndicator,
-            ...(me = (ge = (pe = i.inbox) == null ? void 0 : pe.header) == null ? void 0 : ge.filters) == null ? void 0 : me.unreadIndicator
+            ...(be = (me = (ge = e.inbox) == null ? void 0 : ge.header) == null ? void 0 : me.filters) == null ? void 0 : be.unreadIndicator,
+            ...(xe = (fe = (_e = t.inbox) == null ? void 0 : _e.header) == null ? void 0 : fe.filters) == null ? void 0 : xe.unreadIndicator
           }
         },
         menus: {
-          ...(_e = (be = e.inbox) == null ? void 0 : be.header) == null ? void 0 : _e.menus,
-          ...(fe = (xe = i.inbox) == null ? void 0 : xe.header) == null ? void 0 : fe.menus,
+          ...(Ce = (ve = e.inbox) == null ? void 0 : ve.header) == null ? void 0 : Ce.menus,
+          ...(ke = (ye = t.inbox) == null ? void 0 : ye.header) == null ? void 0 : ke.menus,
           popup: {
-            ...(ye = (ve = (Ce = e.inbox) == null ? void 0 : Ce.header) == null ? void 0 : ve.menus) == null ? void 0 : ye.popup,
-            ...(K = (P = (l = i.inbox) == null ? void 0 : l.header) == null ? void 0 : P.menus) == null ? void 0 : K.popup,
+            ...(Ie = (Se = (we = e.inbox) == null ? void 0 : we.header) == null ? void 0 : Se.menus) == null ? void 0 : Ie.popup,
+            ...(te = (B = (u = t.inbox) == null ? void 0 : u.header) == null ? void 0 : B.menus) == null ? void 0 : te.popup,
             list: {
-              ...(Fe = (ke = (W = (Q = e.inbox) == null ? void 0 : Q.header) == null ? void 0 : W.menus) == null ? void 0 : ke.popup) == null ? void 0 : Fe.list,
-              ...(Oe = (ze = (Re = (He = i.inbox) == null ? void 0 : He.header) == null ? void 0 : Re.menus) == null ? void 0 : ze.popup) == null ? void 0 : Oe.list,
+              ...(Ve = (Ee = (J = (ie = e.inbox) == null ? void 0 : ie.header) == null ? void 0 : J.menus) == null ? void 0 : Ee.popup) == null ? void 0 : Ve.list,
+              ...(Ge = (Je = (Ze = (je = t.inbox) == null ? void 0 : je.header) == null ? void 0 : Ze.menus) == null ? void 0 : Je.popup) == null ? void 0 : Ge.list,
               font: {
-                ...(We = (Ze = (Ve = (Ue = (Ne = e.inbox) == null ? void 0 : Ne.header) == null ? void 0 : Ue.menus) == null ? void 0 : Ve.popup) == null ? void 0 : Ze.list) == null ? void 0 : We.font,
-                ...(Xe = (qe = (Je = (Ge = (je = i.inbox) == null ? void 0 : je.header) == null ? void 0 : Ge.menus) == null ? void 0 : Je.popup) == null ? void 0 : qe.list) == null ? void 0 : Xe.font
+                ...(Ye = (Qe = (Xe = (Ke = (We = e.inbox) == null ? void 0 : We.header) == null ? void 0 : Ke.menus) == null ? void 0 : Xe.popup) == null ? void 0 : Qe.list) == null ? void 0 : Ye.font,
+                ...(ot = (st = (it = (tt = (et = t.inbox) == null ? void 0 : et.header) == null ? void 0 : tt.menus) == null ? void 0 : it.popup) == null ? void 0 : st.list) == null ? void 0 : ot.font
               },
               selectionIcon: {
-                ...(tt = (et = (Qe = (Ke = (Ye = e.inbox) == null ? void 0 : Ye.header) == null ? void 0 : Ke.menus) == null ? void 0 : Qe.popup) == null ? void 0 : et.list) == null ? void 0 : tt.selectionIcon,
-                ...(rt = (nt = (ot = (st = (it = i.inbox) == null ? void 0 : it.header) == null ? void 0 : st.menus) == null ? void 0 : ot.popup) == null ? void 0 : nt.list) == null ? void 0 : rt.selectionIcon
+                ...(ct = (ht = (at = (rt = (nt = e.inbox) == null ? void 0 : nt.header) == null ? void 0 : rt.menus) == null ? void 0 : at.popup) == null ? void 0 : ht.list) == null ? void 0 : ct.selectionIcon,
+                ...(gt = (pt = (ut = (dt = (lt = t.inbox) == null ? void 0 : lt.header) == null ? void 0 : dt.menus) == null ? void 0 : ut.popup) == null ? void 0 : pt.list) == null ? void 0 : gt.selectionIcon
               }
             }
           },
           filters: {
-            ...(ct = (ht = (at = e.inbox) == null ? void 0 : at.header) == null ? void 0 : ht.menus) == null ? void 0 : ct.filters,
-            ...(ut = (dt = (lt = i.inbox) == null ? void 0 : lt.header) == null ? void 0 : dt.menus) == null ? void 0 : ut.filters,
+            ...(_t = (bt = (mt = e.inbox) == null ? void 0 : mt.header) == null ? void 0 : bt.menus) == null ? void 0 : _t.filters,
+            ...(vt = (xt = (ft = t.inbox) == null ? void 0 : ft.header) == null ? void 0 : xt.menus) == null ? void 0 : vt.filters,
             inbox: {
-              ...(bt = (mt = (gt = (pt = e.inbox) == null ? void 0 : pt.header) == null ? void 0 : gt.menus) == null ? void 0 : mt.filters) == null ? void 0 : bt.inbox,
-              ...(Ct = (ft = (xt = (_t = i.inbox) == null ? void 0 : _t.header) == null ? void 0 : xt.menus) == null ? void 0 : ft.filters) == null ? void 0 : Ct.inbox,
+              ...(wt = (kt = (yt = (Ct = e.inbox) == null ? void 0 : Ct.header) == null ? void 0 : yt.menus) == null ? void 0 : kt.filters) == null ? void 0 : wt.inbox,
+              ...(Mt = (Et = (It = (St = t.inbox) == null ? void 0 : St.header) == null ? void 0 : It.menus) == null ? void 0 : Et.filters) == null ? void 0 : Mt.inbox,
               icon: {
-                ...(St = (wt = (kt = (yt = (vt = e.inbox) == null ? void 0 : vt.header) == null ? void 0 : yt.menus) == null ? void 0 : kt.filters) == null ? void 0 : wt.inbox) == null ? void 0 : St.icon,
-                ...(Tt = (Lt = (It = (Mt = (Et = i.inbox) == null ? void 0 : Et.header) == null ? void 0 : Mt.menus) == null ? void 0 : It.filters) == null ? void 0 : Lt.inbox) == null ? void 0 : Tt.icon
+                ...(Pt = (At = (Lt = ($t = (Tt = e.inbox) == null ? void 0 : Tt.header) == null ? void 0 : $t.menus) == null ? void 0 : Lt.filters) == null ? void 0 : At.inbox) == null ? void 0 : Pt.icon,
+                ...(Ht = (Ft = (Dt = (Rt = (Bt = t.inbox) == null ? void 0 : Bt.header) == null ? void 0 : Rt.menus) == null ? void 0 : Dt.filters) == null ? void 0 : Ft.inbox) == null ? void 0 : Ht.icon
               }
             },
             archive: {
-              ...($t = (Pt = (At = (Bt = e.inbox) == null ? void 0 : Bt.header) == null ? void 0 : At.menus) == null ? void 0 : Pt.filters) == null ? void 0 : $t.archive,
-              ...(Rt = (Ht = (Ft = (Dt = i.inbox) == null ? void 0 : Dt.header) == null ? void 0 : Ft.menus) == null ? void 0 : Ht.filters) == null ? void 0 : Rt.archive,
+              ...(Nt = (Ut = (zt = (Ot = e.inbox) == null ? void 0 : Ot.header) == null ? void 0 : zt.menus) == null ? void 0 : Ut.filters) == null ? void 0 : Nt.archive,
+              ...(Zt = (jt = (Vt = (qt = t.inbox) == null ? void 0 : qt.header) == null ? void 0 : Vt.menus) == null ? void 0 : jt.filters) == null ? void 0 : Zt.archive,
               icon: {
-                ...(Vt = (Ut = (Nt = (Ot = (zt = e.inbox) == null ? void 0 : zt.header) == null ? void 0 : Ot.menus) == null ? void 0 : Nt.filters) == null ? void 0 : Ut.archive) == null ? void 0 : Vt.icon,
-                ...(Jt = (Gt = (jt = (Wt = (Zt = i.inbox) == null ? void 0 : Zt.header) == null ? void 0 : Wt.menus) == null ? void 0 : jt.filters) == null ? void 0 : Gt.archive) == null ? void 0 : Jt.icon
+                ...(Xt = (Kt = (Wt = (Gt = (Jt = e.inbox) == null ? void 0 : Jt.header) == null ? void 0 : Gt.menus) == null ? void 0 : Wt.filters) == null ? void 0 : Kt.archive) == null ? void 0 : Xt.icon,
+                ...(ii = (ti = (ei = (Yt = (Qt = t.inbox) == null ? void 0 : Qt.header) == null ? void 0 : Yt.menus) == null ? void 0 : ei.filters) == null ? void 0 : ti.archive) == null ? void 0 : ii.icon
               }
             }
           },
           actions: {
-            ...(Yt = (Xt = (qt = e.inbox) == null ? void 0 : qt.header) == null ? void 0 : Xt.menus) == null ? void 0 : Yt.actions,
-            ...(ei = (Qt = (Kt = i.inbox) == null ? void 0 : Kt.header) == null ? void 0 : Qt.menus) == null ? void 0 : ei.actions,
+            ...(ni = (oi = (si = e.inbox) == null ? void 0 : si.header) == null ? void 0 : oi.menus) == null ? void 0 : ni.actions,
+            ...(hi = (ai = (ri = t.inbox) == null ? void 0 : ri.header) == null ? void 0 : ai.menus) == null ? void 0 : hi.actions,
             markAllRead: {
-              ...(oi = (si = (ii = (ti = e.inbox) == null ? void 0 : ti.header) == null ? void 0 : ii.menus) == null ? void 0 : si.actions) == null ? void 0 : oi.markAllRead,
-              ...(hi = (ai = (ri = (ni = i.inbox) == null ? void 0 : ni.header) == null ? void 0 : ri.menus) == null ? void 0 : ai.actions) == null ? void 0 : hi.markAllRead,
+              ...(ui = (di = (li = (ci = e.inbox) == null ? void 0 : ci.header) == null ? void 0 : li.menus) == null ? void 0 : di.actions) == null ? void 0 : ui.markAllRead,
+              ...(bi = (mi = (gi = (pi = t.inbox) == null ? void 0 : pi.header) == null ? void 0 : gi.menus) == null ? void 0 : mi.actions) == null ? void 0 : bi.markAllRead,
               icon: {
-                ...(pi = (ui = (di = (li = (ci = e.inbox) == null ? void 0 : ci.header) == null ? void 0 : li.menus) == null ? void 0 : di.actions) == null ? void 0 : ui.markAllRead) == null ? void 0 : pi.icon,
-                ...(xi = (_i = (bi = (mi = (gi = i.inbox) == null ? void 0 : gi.header) == null ? void 0 : mi.menus) == null ? void 0 : bi.actions) == null ? void 0 : _i.markAllRead) == null ? void 0 : xi.icon
+                ...(Ci = (vi = (xi = (fi = (_i = e.inbox) == null ? void 0 : _i.header) == null ? void 0 : fi.menus) == null ? void 0 : xi.actions) == null ? void 0 : vi.markAllRead) == null ? void 0 : Ci.icon,
+                ...(Ii = (Si = (wi = (ki = (yi = t.inbox) == null ? void 0 : yi.header) == null ? void 0 : ki.menus) == null ? void 0 : wi.actions) == null ? void 0 : Si.markAllRead) == null ? void 0 : Ii.icon
               }
             },
             archiveAll: {
-              ...(yi = (vi = (Ci = (fi = e.inbox) == null ? void 0 : fi.header) == null ? void 0 : Ci.menus) == null ? void 0 : vi.actions) == null ? void 0 : yi.archiveAll,
-              ...(Ei = (Si = (wi = (ki = i.inbox) == null ? void 0 : ki.header) == null ? void 0 : wi.menus) == null ? void 0 : Si.actions) == null ? void 0 : Ei.archiveAll,
+              ...($i = (Ti = (Mi = (Ei = e.inbox) == null ? void 0 : Ei.header) == null ? void 0 : Mi.menus) == null ? void 0 : Ti.actions) == null ? void 0 : $i.archiveAll,
+              ...(Bi = (Pi = (Ai = (Li = t.inbox) == null ? void 0 : Li.header) == null ? void 0 : Ai.menus) == null ? void 0 : Pi.actions) == null ? void 0 : Bi.archiveAll,
               icon: {
-                ...(Bi = (Ti = (Li = (Ii = (Mi = e.inbox) == null ? void 0 : Mi.header) == null ? void 0 : Ii.menus) == null ? void 0 : Li.actions) == null ? void 0 : Ti.archiveAll) == null ? void 0 : Bi.icon,
-                ...(Fi = (Di = ($i = (Pi = (Ai = i.inbox) == null ? void 0 : Ai.header) == null ? void 0 : Pi.menus) == null ? void 0 : $i.actions) == null ? void 0 : Di.archiveAll) == null ? void 0 : Fi.icon
+                ...(Oi = (Hi = (Fi = (Di = (Ri = e.inbox) == null ? void 0 : Ri.header) == null ? void 0 : Di.menus) == null ? void 0 : Fi.actions) == null ? void 0 : Hi.archiveAll) == null ? void 0 : Oi.icon,
+                ...(Vi = (qi = (Ni = (Ui = (zi = t.inbox) == null ? void 0 : zi.header) == null ? void 0 : Ui.menus) == null ? void 0 : Ni.actions) == null ? void 0 : qi.archiveAll) == null ? void 0 : Vi.icon
               }
             },
             archiveRead: {
-              ...(Oi = (zi = (Ri = (Hi = e.inbox) == null ? void 0 : Hi.header) == null ? void 0 : Ri.menus) == null ? void 0 : zi.actions) == null ? void 0 : Oi.archiveRead,
-              ...(Zi = (Vi = (Ui = (Ni = i.inbox) == null ? void 0 : Ni.header) == null ? void 0 : Ui.menus) == null ? void 0 : Vi.actions) == null ? void 0 : Zi.archiveRead,
+              ...(Gi = (Ji = (Zi = (ji = e.inbox) == null ? void 0 : ji.header) == null ? void 0 : Zi.menus) == null ? void 0 : Ji.actions) == null ? void 0 : Gi.archiveRead,
+              ...(Qi = (Xi = (Ki = (Wi = t.inbox) == null ? void 0 : Wi.header) == null ? void 0 : Ki.menus) == null ? void 0 : Xi.actions) == null ? void 0 : Qi.archiveRead,
               icon: {
-                ...(qi = (Ji = (Gi = (ji = (Wi = e.inbox) == null ? void 0 : Wi.header) == null ? void 0 : ji.menus) == null ? void 0 : Gi.actions) == null ? void 0 : Ji.archiveRead) == null ? void 0 : qi.icon,
-                ...(es = (Qi = (Ki = (Yi = (Xi = i.inbox) == null ? void 0 : Xi.header) == null ? void 0 : Yi.menus) == null ? void 0 : Ki.actions) == null ? void 0 : Qi.archiveRead) == null ? void 0 : es.icon
+                ...(ss = (is = (ts = (es = (Yi = e.inbox) == null ? void 0 : Yi.header) == null ? void 0 : es.menus) == null ? void 0 : ts.actions) == null ? void 0 : is.archiveRead) == null ? void 0 : ss.icon,
+                ...(hs = (as = (rs = (ns = (os = t.inbox) == null ? void 0 : os.header) == null ? void 0 : ns.menus) == null ? void 0 : rs.actions) == null ? void 0 : as.archiveRead) == null ? void 0 : hs.icon
               }
             }
           }
         }
       },
       list: {
-        ...(ts = e.inbox) == null ? void 0 : ts.list,
-        ...(is = i.inbox) == null ? void 0 : is.list,
+        ...(cs = e.inbox) == null ? void 0 : cs.list,
+        ...(ls = t.inbox) == null ? void 0 : ls.list,
         item: {
-          ...(os = (ss = e.inbox) == null ? void 0 : ss.list) == null ? void 0 : os.item,
-          ...(rs = (ns = i.inbox) == null ? void 0 : ns.list) == null ? void 0 : rs.item,
+          ...(us = (ds = e.inbox) == null ? void 0 : ds.list) == null ? void 0 : us.item,
+          ...(gs = (ps = t.inbox) == null ? void 0 : ps.list) == null ? void 0 : gs.item,
           menu: {
-            ...(cs = (hs = (as = e.inbox) == null ? void 0 : as.list) == null ? void 0 : hs.item) == null ? void 0 : cs.menu,
-            ...(us = (ds = (ls = i.inbox) == null ? void 0 : ls.list) == null ? void 0 : ds.item) == null ? void 0 : us.menu,
+            ...(_s = (bs = (ms = e.inbox) == null ? void 0 : ms.list) == null ? void 0 : bs.item) == null ? void 0 : _s.menu,
+            ...(vs = (xs = (fs = t.inbox) == null ? void 0 : fs.list) == null ? void 0 : xs.item) == null ? void 0 : vs.menu,
             item: {
-              ...(bs = (ms = (gs = (ps = e.inbox) == null ? void 0 : ps.list) == null ? void 0 : gs.item) == null ? void 0 : ms.menu) == null ? void 0 : bs.item,
-              ...(Cs = (fs = (xs = (_s = i.inbox) == null ? void 0 : _s.list) == null ? void 0 : xs.item) == null ? void 0 : fs.menu) == null ? void 0 : Cs.item,
+              ...(ws = (ks = (ys = (Cs = e.inbox) == null ? void 0 : Cs.list) == null ? void 0 : ys.item) == null ? void 0 : ks.menu) == null ? void 0 : ws.item,
+              ...(Ms = (Es = (Is = (Ss = t.inbox) == null ? void 0 : Ss.list) == null ? void 0 : Is.item) == null ? void 0 : Es.menu) == null ? void 0 : Ms.item,
               read: {
-                ...(Ss = (ws = (ks = (ys = (vs = e.inbox) == null ? void 0 : vs.list) == null ? void 0 : ys.item) == null ? void 0 : ks.menu) == null ? void 0 : ws.item) == null ? void 0 : Ss.read,
-                ...(Ts = (Ls = (Is = (Ms = (Es = i.inbox) == null ? void 0 : Es.list) == null ? void 0 : Ms.item) == null ? void 0 : Is.menu) == null ? void 0 : Ls.item) == null ? void 0 : Ts.read
+                ...(Ps = (As = (Ls = ($s = (Ts = e.inbox) == null ? void 0 : Ts.list) == null ? void 0 : $s.item) == null ? void 0 : Ls.menu) == null ? void 0 : As.item) == null ? void 0 : Ps.read,
+                ...(Hs = (Fs = (Ds = (Rs = (Bs = t.inbox) == null ? void 0 : Bs.list) == null ? void 0 : Rs.item) == null ? void 0 : Ds.menu) == null ? void 0 : Fs.item) == null ? void 0 : Hs.read
               },
               unread: {
-                ...(Ds = ($s = (Ps = (As = (Bs = e.inbox) == null ? void 0 : Bs.list) == null ? void 0 : As.item) == null ? void 0 : Ps.menu) == null ? void 0 : $s.item) == null ? void 0 : Ds.unread,
-                ...(Os = (zs = (Rs = (Hs = (Fs = i.inbox) == null ? void 0 : Fs.list) == null ? void 0 : Hs.item) == null ? void 0 : Rs.menu) == null ? void 0 : zs.item) == null ? void 0 : Os.unread
+                ...(qs = (Ns = (Us = (zs = (Os = e.inbox) == null ? void 0 : Os.list) == null ? void 0 : zs.item) == null ? void 0 : Us.menu) == null ? void 0 : Ns.item) == null ? void 0 : qs.unread,
+                ...(Gs = (Js = (Zs = (js = (Vs = t.inbox) == null ? void 0 : Vs.list) == null ? void 0 : js.item) == null ? void 0 : Zs.menu) == null ? void 0 : Js.item) == null ? void 0 : Gs.unread
               },
               archive: {
-                ...(Ws = (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 : Ws.archive,
-                ...(Xs = (qs = (Js = (Gs = (js = i.inbox) == null ? void 0 : js.list) == null ? void 0 : Gs.item) == null ? void 0 : Js.menu) == null ? void 0 : qs.item) == null ? void 0 : Xs.archive
+                ...(Ys = (Qs = (Xs = (Ks = (Ws = e.inbox) == null ? void 0 : Ws.list) == null ? void 0 : Ks.item) == null ? void 0 : Xs.menu) == null ? void 0 : Qs.item) == null ? void 0 : Ys.archive,
+                ...(oo = (so = (io = (to = (eo = t.inbox) == null ? void 0 : eo.list) == null ? void 0 : to.item) == null ? void 0 : io.menu) == null ? void 0 : so.item) == null ? void 0 : oo.archive
               },
               unarchive: {
-                ...(to = (eo = (Qs = (Ks = (Ys = e.inbox) == null ? void 0 : Ys.list) == null ? void 0 : Ks.item) == null ? void 0 : Qs.menu) == null ? void 0 : eo.item) == null ? void 0 : to.unarchive,
-                ...(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.unarchive
+                ...(co = (ho = (ao = (ro = (no = e.inbox) == null ? void 0 : no.list) == null ? void 0 : ro.item) == null ? void 0 : ao.menu) == null ? void 0 : ho.item) == null ? void 0 : co.unarchive,
+                ...(mo = (go = (po = (uo = (lo = t.inbox) == null ? void 0 : lo.list) == null ? void 0 : uo.item) == null ? void 0 : po.menu) == null ? void 0 : go.item) == null ? void 0 : mo.unarchive
               }
             }
           }
         }
       },
       loading: {
-        ...(ao = e.inbox) == null ? void 0 : ao.loading,
-        ...(ho = i.inbox) == null ? void 0 : ho.loading
+        ...(bo = e.inbox) == null ? void 0 : bo.loading,
+        ...(_o = t.inbox) == null ? void 0 : _o.loading
       },
       empty: {
-        ...(co = e.inbox) == null ? void 0 : co.empty,
-        ...(lo = i.inbox) == null ? void 0 : lo.empty
+        ...(fo = e.inbox) == null ? void 0 : fo.empty,
+        ...(xo = t.inbox) == null ? void 0 : xo.empty
       },
       error: {
-        ...(uo = e.inbox) == null ? void 0 : uo.error,
-        ...(po = i.inbox) == null ? void 0 : po.error
+        ...(vo = e.inbox) == null ? void 0 : vo.error,
+        ...(Co = t.inbox) == null ? void 0 : Co.error
       }
     }
   };
 };
-class Eo {
-  constructor(i) {
+class zo {
+  constructor(t) {
     // Event IDs
     a(this, "THEME_CHANGE_EVENT", "courier_inbox_theme_change");
     // State
     a(this, "_theme");
-    a(this, "_lightTheme", we);
-    a(this, "_darkTheme", Ae);
+    a(this, "_lightTheme", Te);
+    a(this, "_darkTheme", Oe);
     a(this, "_target");
     a(this, "_subscriptions", []);
     // System theme
     a(this, "_userMode");
     a(this, "_systemMode");
     a(this, "_systemThemeCleanup");
-    this._theme = i, this._target = new EventTarget(), this._userMode = "system", this._systemMode = go(), this.setLightTheme(we), this.setDarkTheme(Ae), this._systemThemeCleanup = mo((e) => {
+    this._theme = t, this._target = new EventTarget(), this._userMode = "system", this._systemMode = Mo(), this.setLightTheme(Te), this.setDarkTheme(Oe), this._systemThemeCleanup = To((e) => {
       this._systemMode = e, this.updateTheme();
     });
   }
-  setLightTheme(i) {
-    this._lightTheme = i, this._systemMode === "light" && this.updateTheme();
+  setLightTheme(t) {
+    this._lightTheme = t, this._systemMode === "light" && this.updateTheme();
   }
-  setDarkTheme(i) {
-    this._darkTheme = i, this._systemMode === "dark" && this.updateTheme();
+  setDarkTheme(t) {
+    this._darkTheme = t, this._systemMode === "dark" && this.updateTheme();
   }
   /**
    * Get the current system theme
@@ -2787,53 +3718,53 @@ class Eo {
    * Update the theme
    */
   updateTheme() {
-    const i = this._userMode === "system" ? this._systemMode : this._userMode, e = i === "light" ? this._lightTheme : this._darkTheme, t = Do(i, e);
-    this.setTheme(t);
+    const t = this._userMode === "system" ? this._systemMode : this._userMode, e = t === "light" ? this._lightTheme : this._darkTheme, i = dn(t, e);
+    this.setTheme(i);
   }
   /**
    * Set the theme and notify all listeners
    */
-  setTheme(i) {
-    i !== this._theme && (this._theme = i, this._target.dispatchEvent(new CustomEvent(this.THEME_CHANGE_EVENT, {
-      detail: { theme: i }
+  setTheme(t) {
+    t !== this._theme && (this._theme = t, this._target.dispatchEvent(new CustomEvent(this.THEME_CHANGE_EVENT, {
+      detail: { theme: t }
     })));
   }
   /**
    * Set the mode and notify all listeners
    */
-  setMode(i) {
-    this._userMode = i, this.updateTheme();
+  setMode(t) {
+    this._userMode = t, this.updateTheme();
   }
   /**
    * Subscribe to theme changes
    * @param {Function} callback - Function to run when the theme changes
    * @returns {CourierInboxThemeSubscription} - Object with remove method to stop listening
    */
-  subscribe(i) {
+  subscribe(t) {
     const e = new AbortController();
     this._target.addEventListener(this.THEME_CHANGE_EVENT, (s) => {
-      i(s.detail.theme);
+      t(s.detail.theme);
     }, { signal: e.signal });
-    const t = {
+    const i = {
       manager: this,
       unsubscribe: () => {
         e.abort();
-        const s = this._subscriptions.indexOf(t);
+        const s = this._subscriptions.indexOf(i);
         s > -1 && this._subscriptions.splice(s, 1);
       }
     };
-    return this._subscriptions.push(t), t;
+    return this._subscriptions.push(i), i;
   }
   /**
    * Clean up event listeners
    */
   cleanup() {
-    this._systemThemeCleanup && this._systemThemeCleanup(), this._subscriptions.forEach((i) => i.unsubscribe()), this._subscriptions = [];
+    this._systemThemeCleanup && this._systemThemeCleanup(), this._subscriptions.forEach((t) => t.unsubscribe()), this._subscriptions = [];
   }
 }
-class Mo extends HTMLElement {
+class Uo extends HTMLElement {
   constructor(e) {
-    var t;
+    var i;
     super();
     // State
     a(this, "_currentFeed", "inbox");
@@ -2855,16 +3786,16 @@ class Mo extends HTMLElement {
     // Default props
     a(this, "_defaultProps", {
       title: "Inbox",
-      icon: f.inbox,
+      icon: x.inbox,
       feedType: this._currentFeed,
       height: "768px"
     });
-    this._shadow = this.attachShadow({ mode: "open" }), this._themeManager = e ?? new Eo(we), this._header = new wo({
+    this._shadow = this.attachShadow({ mode: "open" }), this._themeManager = e ?? new zo(Te), this._header = new Ho({
       themeManager: this._themeManager,
       onFeedTypeChange: (s) => {
         this.setFeedType(s);
       }
-    }), this._header.build(void 0), this._shadow.appendChild(this._header), this._list = new vo({
+    }), this._header.build(void 0), this._shadow.appendChild(this._header), this._list = new Ro({
       themeManager: this._themeManager,
       onRefresh: () => {
         this.refresh();
@@ -2872,28 +3803,28 @@ class Mo extends HTMLElement {
       onPaginationTrigger: async (s) => {
         var o, n;
         try {
-          await A.shared.fetchNextPageOfMessages({
+          await P.shared.fetchNextPageOfMessages({
             feedType: s
           });
-        } catch (h) {
-          (n = (o = C.shared.client) == null ? void 0 : o.options.logger) == null || n.error("Failed to fetch next page of messages:", h);
+        } catch (c) {
+          (n = (o = v.shared.client) == null ? void 0 : o.options.logger) == null || n.error("Failed to fetch next page of messages:", c);
         }
       },
       onMessageClick: (s, o) => {
         var n;
-        A.shared.clickMessage(s), this.dispatchEvent(new CustomEvent("message-click", {
+        P.shared.clickMessage({ message: 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;
+        var c;
         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 });
+        })), (c = this._onMessageActionClick) == null || c.call(this, { message: s, action: o, index: n });
       },
       onMessageLongPress: (s, o) => {
         var n;
@@ -2903,7 +3834,7 @@ class Mo extends HTMLElement {
           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 So({
+    }), this._style = document.createElement("style"), this.refreshTheme(), this._shadow.appendChild(this._style), this._shadow.appendChild(this._list), this._datastoreListener = new Oo({
       onError: (s) => {
         this._list.setError(s);
       },
@@ -2925,11 +3856,11 @@ class Mo extends HTMLElement {
       onUnreadCountChange: (s) => {
         this.updateHeader();
       }
-    }), A.shared.addDataStoreListener(this._datastoreListener), this._themeManager.subscribe((s) => {
+    }), P.shared.addDataStoreListener(this._datastoreListener), this._themeManager.subscribe((s) => {
       this.refreshTheme();
-    }), this._authListener = C.shared.addAuthenticationListener((s) => {
+    }), this._authListener = v.shared.addAuthenticationListener((s) => {
       this.refresh();
-    }), (t = C.shared.client) != null && t.options.userId && this.refresh();
+    }), (i = v.shared.client) != null && i.options.userId && this.refresh();
   }
   get theme() {
     return this._themeManager.getTheme();
@@ -3005,7 +3936,7 @@ class Mo extends HTMLElement {
   updateHeader() {
     const e = {
       feedType: this._currentFeed,
-      unreadCount: A.shared.unreadCount,
+      unreadCount: P.shared.unreadCount,
       messageCount: this._list.messages.length
     };
     switch (this._headerFactory) {
@@ -3016,13 +3947,13 @@ class Mo extends HTMLElement {
         this._header.build(null);
         break;
       default:
-        const t = this._headerFactory(e);
-        this._header.build(t);
+        const i = this._headerFactory(e);
+        this._header.build(i);
         break;
     }
   }
   async load(e) {
-    await A.shared.load(e);
+    await P.shared.load(e);
   }
   refresh() {
     this.load({
@@ -3034,12 +3965,12 @@ class Mo extends HTMLElement {
     this.refresh();
   }
   disconnectedCallback() {
-    var e, t;
-    this._themeManager.cleanup(), (e = this._datastoreListener) == null || e.remove(), (t = this._authListener) == null || t.remove();
+    var e, i;
+    this._themeManager.cleanup(), (e = this._datastoreListener) == null || e.remove(), (i = this._authListener) == null || i.remove();
   }
-  attributeChangedCallback(e, t, s) {
-    var o, n, h, d, c, u;
-    if (t !== s)
+  attributeChangedCallback(e, i, s) {
+    var o, n, c, d, l, p;
+    if (i !== s)
       switch (e) {
         case "height":
           const m = s || this._defaultProps.height;
@@ -3049,8 +3980,8 @@ class Mo extends HTMLElement {
           if (s)
             try {
               this._onMessageClick = new Function("props", s);
-            } catch (p) {
-              (n = (o = C.shared.client) == null ? void 0 : o.options.logger) == null || n.error("Failed to parse message-click handler:", p);
+            } catch (g) {
+              (n = (o = v.shared.client) == null ? void 0 : o.options.logger) == null || n.error("Failed to parse message-click handler:", g);
             }
           else
             this._onMessageClick = void 0;
@@ -3059,8 +3990,8 @@ class Mo extends HTMLElement {
           if (s)
             try {
               this._onMessageActionClick = new Function("props", s);
-            } catch (p) {
-              (d = (h = C.shared.client) == null ? void 0 : h.options.logger) == null || d.error("Failed to parse message-action-click handler:", p);
+            } catch (g) {
+              (d = (c = v.shared.client) == null ? void 0 : c.options.logger) == null || d.error("Failed to parse message-action-click handler:", g);
             }
           else
             this._onMessageActionClick = void 0;
@@ -3069,8 +4000,8 @@ class Mo extends HTMLElement {
           if (s)
             try {
               this._onMessageLongPress = new Function("props", s);
-            } catch (p) {
-              (u = (c = C.shared.client) == null ? void 0 : c.options.logger) == null || u.error("Failed to parse message-long-press handler:", p);
+            } catch (g) {
+              (p = (l = v.shared.client) == null ? void 0 : l.options.logger) == null || p.error("Failed to parse message-long-press handler:", g);
             }
           else
             this._onMessageLongPress = void 0;
@@ -3087,8 +4018,8 @@ class Mo extends HTMLElement {
       }
   }
 }
-customElements.get("courier-inbox") || customElements.define("courier-inbox", Mo);
-class Io extends Le {
+customElements.get("courier-inbox") || customElements.define("courier-inbox", Uo);
+class No extends De {
   constructor(e) {
     super();
     // Theme
@@ -3097,12 +4028,12 @@ class Io extends Le {
     a(this, "_container");
     a(this, "_triggerButton");
     a(this, "_unreadCountBadge");
-    this._themeSubscription = e.subscribe((t) => {
+    this._themeSubscription = e.subscribe((i) => {
       this.updateTheme();
     });
   }
   defaultElement() {
-    this._container = document.createElement("div"), this._container.className = "menu-button-container", this._triggerButton = new Se(f.inbox), this._unreadCountBadge = new De({
+    this._container = document.createElement("div"), this._container.className = "menu-button-container", this._triggerButton = new $e(x.inbox), this._unreadCountBadge = new qe({
       themeBus: this._themeSubscription.manager,
       location: "button"
     }), this._unreadCountBadge.id = "unread-badge";
@@ -3125,20 +4056,20 @@ class Io extends Le {
     `;
   }
   onUnreadCountChange(e) {
-    var t;
-    (t = this._unreadCountBadge) == null || t.setCount(e), this.updateTheme();
+    var i;
+    (i = this._unreadCountBadge) == null || i.setCount(e), this.updateTheme();
   }
   updateTheme() {
-    var t, s, o, n, h, d, c, u, m, p, x, _, b, v, k, w, S, E;
+    var i, s, o, n, c, d, l, p, m, g, f, _, b, C, k, w, S, I;
     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) ?? f.inbox), (x = this._triggerButton) == null || x.updateBackgroundColor(((p = (m = e == null ? void 0 : e.popup) == null ? void 0 : m.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]), (E = this._unreadCountBadge) == null || E.refreshTheme("button");
+    (n = this._triggerButton) == null || n.updateIconColor(((o = (s = (i = e == null ? void 0 : e.popup) == null ? void 0 : i.button) == null ? void 0 : s.icon) == null ? void 0 : o.color) ?? r.black[500]), (p = this._triggerButton) == null || p.updateIconSVG(((l = (d = (c = e == null ? void 0 : e.popup) == null ? void 0 : c.button) == null ? void 0 : d.icon) == null ? void 0 : l.svg) ?? x.inbox), (f = this._triggerButton) == null || f.updateBackgroundColor(((g = (m = e == null ? void 0 : e.popup) == null ? void 0 : m.button) == null ? void 0 : g.backgroundColor) ?? "transparent"), (C = this._triggerButton) == null || C.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]), (I = this._unreadCountBadge) == null || I.refreshTheme("button");
   }
   disconnectedCallback() {
     this._themeSubscription.unsubscribe();
   }
 }
-customElements.get("courier-inbox-menu-button") || customElements.define("courier-inbox-menu-button", Io);
-class Fo extends HTMLElement {
+customElements.get("courier-inbox-menu-button") || customElements.define("courier-inbox-menu-button", No);
+class un extends HTMLElement {
   constructor() {
     super();
     // State
@@ -3150,7 +4081,7 @@ class Fo extends HTMLElement {
     a(this, "_bottom", "40px");
     a(this, "_left", "0");
     // Theming
-    a(this, "_themeManager", new Eo(we));
+    a(this, "_themeManager", new zo(Te));
     // Components
     a(this, "_triggerButton");
     a(this, "_popup");
@@ -3161,7 +4092,7 @@ class Fo extends HTMLElement {
     // Factories
     a(this, "_popupMenuButtonFactory");
     const e = this.attachShadow({ mode: "open" });
-    this._triggerButton = new Io(this._themeManager), this._triggerButton.build(void 0), this._popup = document.createElement("div"), this._popup.className = "popup", this._inbox = new Mo(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 So(this), A.shared.addDataStoreListener(this._datastoreListener), this._themeManager.subscribe((t) => {
+    this._triggerButton = new No(this._themeManager), this._triggerButton.build(void 0), this._popup = document.createElement("div"), this._popup.className = "popup", this._inbox = new Uo(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 Oo(this), P.shared.addDataStoreListener(this._datastoreListener), this._themeManager.subscribe((i) => {
       this.refreshTheme();
     });
   }
@@ -3181,7 +4112,7 @@ class Fo extends HTMLElement {
     this._style.textContent = this.getStyles();
   }
   getStyles() {
-    var e, t, s, o, n, h, d, c;
+    var e, i, s, o, n, c, d, l;
     return `
       :host {
         display: inline-block;
@@ -3196,10 +4127,10 @@ class Fo extends HTMLElement {
       .popup {
         display: none;
         position: absolute;
-        background: ${((t = (e = this.theme.popup) == null ? void 0 : e.window) == null ? void 0 : t.backgroundColor) ?? "red"};
+        background: ${((i = (e = this.theme.popup) == null ? void 0 : e.window) == null ? void 0 : i.backgroundColor) ?? "red"};
         border-radius: ${((o = (s = this.theme.popup) == null ? void 0 : s.window) == null ? void 0 : o.borderRadius) ?? "8px"};
-        border: ${((h = (n = this.theme.popup) == null ? void 0 : n.window) == null ? void 0 : h.border) ?? "1px solid red"};
-        box-shadow: ${((c = (d = this.theme.popup) == null ? void 0 : d.window) == null ? void 0 : c.shadow) ?? "0px 8px 16px -4px red"};
+        border: ${((c = (n = this.theme.popup) == null ? void 0 : n.window) == null ? void 0 : c.border) ?? "1px solid red"};
+        box-shadow: ${((l = (d = this.theme.popup) == null ? void 0 : d.window) == null ? void 0 : l.shadow) ?? "0px 8px 16px -4px red"};
         z-index: 1000;
         width: ${this._width};
         height: ${this._height};
@@ -3220,7 +4151,7 @@ class Fo extends HTMLElement {
       }
     `;
   }
-  attributeChangedCallback(e, t, s) {
+  attributeChangedCallback(e, i, s) {
     switch (e) {
       case "popup-alignment":
         this.isValidPosition(s) && (this._popupAlignment = s, this.updatePopupPosition());
@@ -3319,12 +4250,12 @@ class Fo extends HTMLElement {
   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;
+  setSize(e, i) {
+    this._width = e, this._height = i, this._popup.style.width = e, this._popup.style.height = i;
   }
   setPosition(e) {
-    var t, s;
-    this.isValidPosition(e) ? (this._popupAlignment = e, this.updatePopupPosition()) : (s = (t = C.shared.client) == null ? void 0 : t.options.logger) == null || s.error(`Invalid position: ${e}`);
+    var i, s;
+    this.isValidPosition(e) ? (this._popupAlignment = e, this.updatePopupPosition()) : (s = (i = v.shared.client) == null ? void 0 : i.options.logger) == null || s.error(`Invalid position: ${e}`);
   }
   setFeedType(e) {
     this._inbox.setFeedType(e);
@@ -3355,15 +4286,15 @@ class Fo extends HTMLElement {
     this._popupMenuButtonFactory = e, this.render();
   }
   render() {
-    const e = A.shared.unreadCount;
+    const e = P.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);
+        const i = this._popupMenuButtonFactory({ unreadCount: e });
+        this._triggerButton.build(i);
         break;
     }
   }
@@ -3372,39 +4303,39 @@ class Fo extends HTMLElement {
     (e = this._datastoreListener) == null || e.remove(), this._themeManager.cleanup();
   }
 }
-customElements.get("courier-inbox-menu") || customElements.define("courier-inbox-menu", Fo);
-class Zo {
-  onDataSetChange(i, e) {
+customElements.get("courier-inbox-menu") || customElements.define("courier-inbox-menu", un);
+class xn {
+  onDataSetChange(t, e) {
   }
-  onPageAdded(i, e) {
+  onPageAdded(t, e) {
   }
-  onUnreadCountChange(i) {
+  onUnreadCountChange(t) {
   }
-  onMessageAdd(i, e, t) {
+  onMessageAdd(t, e, i) {
   }
-  onMessageRemove(i, e, t) {
+  onMessageRemove(t, e, i) {
   }
-  onMessageUpdate(i, e, t) {
+  onMessageUpdate(t, e, i) {
   }
-  onError(i) {
+  onError(t) {
   }
 }
 export {
-  Mo as CourierInbox,
-  So as CourierInboxDataStoreListener,
-  A as CourierInboxDatastore,
-  Zo as CourierInboxDatastoreEvents,
-  wo as CourierInboxHeader,
-  Fo as CourierInboxMenu,
-  Eo as CourierInboxThemeManager,
-  xo as CourierListItem,
-  Uo as archiveMessage,
-  No as clickMessage,
-  Ae as defaultDarkTheme,
-  we as defaultLightTheme,
-  $o as getMessageTime,
-  zo as markAsRead,
-  Oo as markAsUnread,
-  Do as mergeTheme,
-  Vo as openMessage
+  Uo as CourierInbox,
+  Oo as CourierInboxDataStoreListener,
+  P as CourierInboxDatastore,
+  xn as CourierInboxDatastoreEvents,
+  Ho as CourierInboxHeader,
+  un as CourierInboxMenu,
+  zo as CourierInboxThemeManager,
+  Ao as CourierListItem,
+  _n as archiveMessage,
+  bn as clickMessage,
+  Oe as defaultDarkTheme,
+  Te as defaultLightTheme,
+  ln as getMessageTime,
+  gn as markAsRead,
+  mn as markAsUnread,
+  dn as mergeTheme,
+  fn as openMessage
 };