@signalwire/web-components 4.0.0-beta.10 → 4.0.0-beta.12

package/dist/components/directory.js

@@ -1,503 +0,0 @@
-import { LitElement as p, html as i, css as u } from "lit";
-import { property as v, state as d, customElement as w } from "lit/decorators.js";
-var b = Object.defineProperty, m = Object.getOwnPropertyDescriptor, c = (e, s, a, r) => {
-  for (var t = r > 1 ? void 0 : r ? m(s, a) : s, n = e.length - 1, l; n >= 0; n--)
-    (l = e[n]) && (t = (r ? l(s, a, t) : l(t)) || t);
-  return r && t && b(s, a, t), t;
-};
-let o = class extends p {
-  constructor() {
-    super(...arguments), this.directory = null, this.selectedAddress = null, this.searchQuery = "", this.addresses = [], this.loading = !1, this.hasMore = !1, this.subscriptions = [], this.searchDebounceTimer = null, this.intersectionObserver = null, this.isAutoLoadingForSearch = !1;
-  }
-  connectedCallback() {
-    super.connectedCallback(), this.subscribeToDirectory();
-  }
-  disconnectedCallback() {
-    super.disconnectedCallback(), this.cleanup();
-  }
-  subscribeToDirectory() {
-    if (this.directory) {
-      if (this.directory.addresses$) {
-        const e = this.directory.addresses$.subscribe((s) => {
-          this.addresses = s;
-        });
-        this.subscriptions.push(e);
-      }
-      if (this.directory.loading$) {
-        const e = this.directory.loading$.subscribe((s) => {
-          this.loading = s;
-        });
-        this.subscriptions.push(e);
-      }
-      if (this.directory.hasMore$) {
-        const e = this.directory.hasMore$.subscribe((s) => {
-          this.hasMore = s;
-        });
-        this.subscriptions.push(e);
-      }
-      this.directory.loadMore && this.directory.loadMore();
-    }
-  }
-  cleanup() {
-    this.subscriptions.forEach((e) => e.unsubscribe()), this.subscriptions = [], this.searchDebounceTimer && clearTimeout(this.searchDebounceTimer), this.intersectionObserver && (this.intersectionObserver.disconnect(), this.intersectionObserver = null);
-  }
-  firstUpdated() {
-    this.setupInfiniteScroll();
-  }
-  setupInfiniteScroll() {
-    var s, a;
-    const e = (s = this.shadowRoot) == null ? void 0 : s.querySelector(".scroll-sentinel");
-    e && (this.intersectionObserver = new IntersectionObserver(
-      (r) => {
-        const t = r[0];
-        t != null && t.isIntersecting && this.hasMore && !this.loading && this.handleLoadMore();
-      },
-      {
-        root: (a = this.shadowRoot) == null ? void 0 : a.querySelector(".list"),
-        rootMargin: "100px",
-        threshold: 0
-      }
-    ), this.intersectionObserver.observe(e));
-  }
-  updated(e) {
-    super.updated(e), e.has("directory") && (this.cleanup(), this.subscribeToDirectory()), this.intersectionObserver || this.setupInfiniteScroll(), (e.has("addresses") || e.has("searchQuery") || e.has("loading")) && this.checkAutoLoadForSearch();
-  }
-  async checkAutoLoadForSearch() {
-    this.searchQuery.trim() && this.filteredAddresses.length === 0 && this.hasMore && !this.loading ? (this.isAutoLoadingForSearch = !0, await this.handleLoadMore()) : (this.filteredAddresses.length > 0 || !this.hasMore) && (this.isAutoLoadingForSearch = !1);
-  }
-  get filteredAddresses() {
-    if (!this.searchQuery.trim())
-      return this.addresses;
-    const e = this.searchQuery.toLowerCase();
-    return this.addresses.filter(
-      (s) => s.name.toLowerCase().includes(e) || s.displayName && s.displayName.toLowerCase().includes(e)
-    );
-  }
-  handleSearchInput(e) {
-    const s = e.target;
-    this.searchDebounceTimer && clearTimeout(this.searchDebounceTimer), this.searchDebounceTimer = window.setTimeout(() => {
-      this.searchQuery = s.value;
-    }, 200);
-  }
-  handleItemClick(e) {
-    this.selectedAddress = e, this.dispatchEvent(
-      new CustomEvent("sw-address-select", {
-        detail: { address: e },
-        bubbles: !0,
-        composed: !0
-      })
-    );
-  }
-  handleItemDoubleClick(e) {
-    this.handleDial(e);
-  }
-  handleDial(e) {
-    this.dispatchEvent(
-      new CustomEvent("sw-dial", {
-        detail: { address: e },
-        bubbles: !0,
-        composed: !0
-      })
-    );
-  }
-  async handleLoadMore() {
-    var e;
-    (e = this.directory) != null && e.loadMore && await this.directory.loadMore();
-  }
-  renderAddressIcon(e) {
-    return e.type === "room" ? i`
-        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor">
-          <path
-            d="M19 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm-7 3c1.93 0 3.5 1.57 3.5 3.5S13.93 13 12 13s-3.5-1.57-3.5-3.5S10.07 6 12 6zm7 13H5v-.23c0-.62.28-1.2.76-1.58C7.47 15.82 9.64 15 12 15s4.53.82 6.24 2.19c.48.38.76.97.76 1.58V19z"
-          />
-        </svg>
-      ` : i`
-      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor">
-        <path
-          d="M12 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm0 2c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4z"
-        />
-      </svg>
-    `;
-  }
-  renderChannelIcons(e) {
-    const s = e.channels || {};
-    return i`
-      <div class="item-channels">
-        <svg
-          xmlns="http://www.w3.org/2000/svg"
-          viewBox="0 0 24 24"
-          fill="currentColor"
-          class="${s.audio ? "active" : ""}"
-          title="Audio"
-        >
-          <path
-            d="M12 14c1.66 0 2.99-1.34 2.99-3L15 5c0-1.66-1.34-3-3-3S9 3.34 9 5v6c0 1.66 1.34 3 3 3z"
-          />
-        </svg>
-        <svg
-          xmlns="http://www.w3.org/2000/svg"
-          viewBox="0 0 24 24"
-          fill="currentColor"
-          class="${s.video ? "active" : ""}"
-          title="Video"
-        >
-          <path
-            d="M17 10.5V7c0-.55-.45-1-1-1H4c-.55 0-1 .45-1 1v10c0 .55.45 1 1 1h12c.55 0 1-.45 1-1v-3.5l4 4v-11l-4 4z"
-          />
-        </svg>
-      </div>
-    `;
-  }
-  renderLoadingIndicator() {
-    return i`
-      <div class="scroll-loading">
-        <div class="spinner"></div>
-        <span>${this.isAutoLoadingForSearch ? "Searching..." : "Loading more..."}</span>
-      </div>
-    `;
-  }
-  render() {
-    const e = this.loading && this.addresses.length === 0, s = !this.loading && this.filteredAddresses.length === 0 && !this.hasMore, a = this.isAutoLoadingForSearch && this.filteredAddresses.length === 0;
-    return i`
-      <div class="container" part="container">
-        <div class="search" part="search">
-          <input
-            type="text"
-            class="search-input"
-            placeholder="Search addresses..."
-            @input=${this.handleSearchInput}
-            aria-label="Search addresses"
-          />
-        </div>
-
-        <div class="list" part="list" role="listbox">
-          ${e ? i`<div class="loading">Loading...</div>` : a ? this.renderLoadingIndicator() : s ? i`<div class="empty">No addresses found</div>` : i`
-                    ${this.filteredAddresses.map(
-      (r) => {
-        var t, n, l;
-        return i`
-                        <div
-                          class="item ${((t = this.selectedAddress) == null ? void 0 : t.id) === r.id ? "selected" : ""}"
-                          part="item ${((n = this.selectedAddress) == null ? void 0 : n.id) === r.id ? "item-selected" : ""}"
-                          role="option"
-                          aria-selected="${((l = this.selectedAddress) == null ? void 0 : l.id) === r.id}"
-                          @click=${() => this.handleItemClick(r)}
-                          @dblclick=${() => this.handleItemDoubleClick(r)}
-                        >
-                          <div class="item-icon">${this.renderAddressIcon(r)}</div>
-                          <div class="item-content">
-                            <div class="item-name" part="item-name">
-                              ${r.displayName || r.name}
-                            </div>
-                            <div class="item-type" part="item-type">
-                              ${r.type || "address"}
-                            </div>
-                          </div>
-                          ${this.renderChannelIcons(r)}
-                          <button
-                            class="dial-button"
-                            @click=${(h) => {
-          h.stopPropagation(), this.handleDial(r);
-        }}
-                            aria-label="Call ${r.displayName || r.name}"
-                          >
-                            <svg
-                              xmlns="http://www.w3.org/2000/svg"
-                              viewBox="0 0 24 24"
-                              fill="currentColor"
-                            >
-                              <path
-                                d="M6.62 10.79c1.44 2.83 3.76 5.15 6.59 6.59l2.2-2.2c.27-.27.67-.36 1.02-.24 1.12.37 2.33.57 3.57.57.55 0 1 .45 1 1V20c0 .55-.45 1-1 1-9.39 0-17-7.61-17-17 0-.55.45-1 1-1h3.5c.55 0 1 .45 1 1 0 1.25.2 2.45.57 3.57.11.35.03.74-.25 1.02l-2.2 2.2z"
-                              />
-                            </svg>
-                          </button>
-                        </div>
-                      `;
-      }
-    )}
-                    <!-- Scroll sentinel for infinite scroll -->
-                    <div class="scroll-sentinel">
-                      ${this.loading && !this.isAutoLoadingForSearch ? this.renderLoadingIndicator() : null}
-                    </div>
-                  `}
-        </div>
-      </div>
-    `;
-  }
-};
-o.styles = u`
-    :host {
-      /* CSS Custom Properties for theming */
-      --sw-color-primary: #044cf6;
-      --sw-color-primary-hover: #0339c4;
-      --sw-color-success: #10b981;
-      --sw-color-text: #1f2937;
-      --sw-color-text-muted: #6b7280;
-      --sw-color-background: #ffffff;
-      --sw-color-background-hover: #f3f4f6;
-      --sw-color-background-active: #e5e7eb;
-      --sw-color-border: #e5e7eb;
-      --sw-font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
-      --sw-font-size-sm: 12px;
-      --sw-font-size-base: 14px;
-      --sw-font-size-lg: 16px;
-      --sw-space-1: 4px;
-      --sw-space-2: 8px;
-      --sw-space-3: 12px;
-      --sw-space-4: 16px;
-      --sw-border-radius: 8px;
-
-      display: block;
-      font-family: var(--sw-font-family);
-    }
-
-    /* Dark mode support */
-    :host([data-theme='dark']) {
-      --sw-color-text: #f9fafb;
-      --sw-color-text-muted: #9ca3af;
-      --sw-color-background: #1f2937;
-      --sw-color-background-hover: #374151;
-      --sw-color-background-active: #4b5563;
-      --sw-color-border: #374151;
-    }
-
-    @media (prefers-color-scheme: dark) {
-      :host(:not([data-theme='light'])) {
-        --sw-color-text: #f9fafb;
-        --sw-color-text-muted: #9ca3af;
-        --sw-color-background: #1f2937;
-        --sw-color-background-hover: #374151;
-        --sw-color-background-active: #4b5563;
-        --sw-color-border: #374151;
-      }
-    }
-
-    .container {
-      display: flex;
-      flex-direction: column;
-      background: var(--sw-color-background);
-      border: 1px solid var(--sw-color-border);
-      border-radius: var(--sw-border-radius);
-      overflow: hidden;
-    }
-
-    .search {
-      display: flex;
-      align-items: center;
-      gap: var(--sw-space-2);
-      padding: var(--sw-space-3);
-      border-bottom: 1px solid var(--sw-color-border);
-    }
-
-    .search-input {
-      flex: 1;
-      padding: var(--sw-space-2) var(--sw-space-3);
-      border: 1px solid var(--sw-color-border);
-      border-radius: var(--sw-border-radius);
-      background: var(--sw-color-background);
-      color: var(--sw-color-text);
-      font-family: var(--sw-font-family);
-      font-size: var(--sw-font-size-base);
-      outline: none;
-      transition: border-color 0.15s ease;
-    }
-
-    .search-input:focus {
-      border-color: var(--sw-color-primary);
-    }
-
-    .search-input::placeholder {
-      color: var(--sw-color-text-muted);
-    }
-
-    .list {
-      display: flex;
-      flex-direction: column;
-      max-height: 400px;
-      overflow-y: auto;
-    }
-
-    .item {
-      display: flex;
-      align-items: center;
-      gap: var(--sw-space-3);
-      padding: var(--sw-space-3) var(--sw-space-4);
-      border-bottom: 1px solid var(--sw-color-border);
-      cursor: pointer;
-      transition: background-color 0.15s ease;
-    }
-
-    .item:last-child {
-      border-bottom: none;
-    }
-
-    .item:hover {
-      background: var(--sw-color-background-hover);
-    }
-
-    .item:active {
-      background: var(--sw-color-background-active);
-    }
-
-    .item.selected {
-      background: var(--sw-color-primary);
-      color: white;
-    }
-
-    .item.selected .item-type,
-    .item.selected .item-channels {
-      color: rgba(255, 255, 255, 0.8);
-    }
-
-    .item-icon {
-      display: flex;
-      align-items: center;
-      justify-content: center;
-      width: 40px;
-      height: 40px;
-      border-radius: 50%;
-      background: var(--sw-color-background-hover);
-      color: var(--sw-color-text-muted);
-      flex-shrink: 0;
-    }
-
-    .item.selected .item-icon {
-      background: rgba(255, 255, 255, 0.2);
-      color: white;
-    }
-
-    .item-icon svg {
-      width: 20px;
-      height: 20px;
-    }
-
-    .item-content {
-      flex: 1;
-      min-width: 0;
-    }
-
-    .item-name {
-      font-size: var(--sw-font-size-base);
-      font-weight: 500;
-      color: inherit;
-      white-space: nowrap;
-      overflow: hidden;
-      text-overflow: ellipsis;
-    }
-
-    .item-type {
-      font-size: var(--sw-font-size-sm);
-      color: var(--sw-color-text-muted);
-      text-transform: capitalize;
-    }
-
-    .item-channels {
-      display: flex;
-      gap: var(--sw-space-1);
-      color: var(--sw-color-text-muted);
-    }
-
-    .item-channels svg {
-      width: 16px;
-      height: 16px;
-    }
-
-    .item-channels .active {
-      color: var(--sw-color-success);
-    }
-
-    .loading,
-    .empty {
-      display: flex;
-      align-items: center;
-      justify-content: center;
-      padding: var(--sw-space-4);
-      color: var(--sw-color-text-muted);
-      font-size: var(--sw-font-size-base);
-    }
-
-    .scroll-sentinel {
-      display: flex;
-      align-items: center;
-      justify-content: center;
-      padding: var(--sw-space-3);
-      min-height: 1px;
-    }
-
-    .scroll-loading {
-      display: flex;
-      align-items: center;
-      justify-content: center;
-      gap: var(--sw-space-2);
-      padding: var(--sw-space-3);
-      color: var(--sw-color-text-muted);
-      font-size: var(--sw-font-size-sm);
-    }
-
-    .spinner {
-      width: 16px;
-      height: 16px;
-      border: 2px solid var(--sw-color-border);
-      border-top-color: var(--sw-color-primary);
-      border-radius: 50%;
-      animation: spin 0.8s linear infinite;
-    }
-
-    @keyframes spin {
-      to {
-        transform: rotate(360deg);
-      }
-    }
-
-    .dial-button {
-      display: flex;
-      align-items: center;
-      justify-content: center;
-      width: 36px;
-      height: 36px;
-      background: var(--sw-color-success);
-      border: none;
-      border-radius: 50%;
-      color: white;
-      cursor: pointer;
-      flex-shrink: 0;
-      transition: background-color 0.15s ease;
-    }
-
-    .dial-button:hover {
-      background: #0ea472;
-    }
-
-    .dial-button svg {
-      width: 18px;
-      height: 18px;
-    }
-  `;
-c([
-  v({ type: Object })
-], o.prototype, "directory", 2);
-c([
-  d()
-], o.prototype, "selectedAddress", 2);
-c([
-  d()
-], o.prototype, "searchQuery", 2);
-c([
-  d()
-], o.prototype, "addresses", 2);
-c([
-  d()
-], o.prototype, "loading", 2);
-c([
-  d()
-], o.prototype, "hasMore", 2);
-c([
-  d()
-], o.prototype, "isAutoLoadingForSearch", 2);
-o = c([
-  w("sw-directory")
-], o);
-export {
-  o as DirectoryComponent
-};
-//# sourceMappingURL=directory.js.map

package/dist/components/directory.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"directory.js","sources":["../../src/components/directory.ts"],"sourcesContent":["/**\n * Directory Component\n *\n * A searchable list of addresses from the directory service.\n * Supports filtering, selection, and pagination.\n *\n * @example\n * ```html\n * <sw-directory .directory=${directory}></sw-directory>\n * ```\n */\n\nimport { LitElement, html, css } from 'lit';\nimport { customElement, property, state } from 'lit/decorators.js';\nimport { Subscription } from 'rxjs';\nimport type { Observable } from 'rxjs';\n\n/**\n * Address type from SDK\n */\nexport interface Address {\n  id: string;\n  name: string;\n  displayName?: string;\n  type?: 'room' | 'person';\n  channels?: {\n    audio?: boolean;\n    video?: boolean;\n    messaging?: boolean;\n  };\n}\n\n/**\n * Directory interface for component\n */\nexport interface DirectoryService {\n  addresses$: Observable<Address[]>;\n  loading$?: Observable<boolean>;\n  hasMore$?: Observable<boolean>;\n  loadMore?(): Promise<void>;\n}\n\n@customElement('sw-directory')\nexport class DirectoryComponent extends LitElement {\n  static styles = css`\n    :host {\n      /* CSS Custom Properties for theming */\n      --sw-color-primary: #044cf6;\n      --sw-color-primary-hover: #0339c4;\n      --sw-color-success: #10b981;\n      --sw-color-text: #1f2937;\n      --sw-color-text-muted: #6b7280;\n      --sw-color-background: #ffffff;\n      --sw-color-background-hover: #f3f4f6;\n      --sw-color-background-active: #e5e7eb;\n      --sw-color-border: #e5e7eb;\n      --sw-font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;\n      --sw-font-size-sm: 12px;\n      --sw-font-size-base: 14px;\n      --sw-font-size-lg: 16px;\n      --sw-space-1: 4px;\n      --sw-space-2: 8px;\n      --sw-space-3: 12px;\n      --sw-space-4: 16px;\n      --sw-border-radius: 8px;\n\n      display: block;\n      font-family: var(--sw-font-family);\n    }\n\n    /* Dark mode support */\n    :host([data-theme='dark']) {\n      --sw-color-text: #f9fafb;\n      --sw-color-text-muted: #9ca3af;\n      --sw-color-background: #1f2937;\n      --sw-color-background-hover: #374151;\n      --sw-color-background-active: #4b5563;\n      --sw-color-border: #374151;\n    }\n\n    @media (prefers-color-scheme: dark) {\n      :host(:not([data-theme='light'])) {\n        --sw-color-text: #f9fafb;\n        --sw-color-text-muted: #9ca3af;\n        --sw-color-background: #1f2937;\n        --sw-color-background-hover: #374151;\n        --sw-color-background-active: #4b5563;\n        --sw-color-border: #374151;\n      }\n    }\n\n    .container {\n      display: flex;\n      flex-direction: column;\n      background: var(--sw-color-background);\n      border: 1px solid var(--sw-color-border);\n      border-radius: var(--sw-border-radius);\n      overflow: hidden;\n    }\n\n    .search {\n      display: flex;\n      align-items: center;\n      gap: var(--sw-space-2);\n      padding: var(--sw-space-3);\n      border-bottom: 1px solid var(--sw-color-border);\n    }\n\n    .search-input {\n      flex: 1;\n      padding: var(--sw-space-2) var(--sw-space-3);\n      border: 1px solid var(--sw-color-border);\n      border-radius: var(--sw-border-radius);\n      background: var(--sw-color-background);\n      color: var(--sw-color-text);\n      font-family: var(--sw-font-family);\n      font-size: var(--sw-font-size-base);\n      outline: none;\n      transition: border-color 0.15s ease;\n    }\n\n    .search-input:focus {\n      border-color: var(--sw-color-primary);\n    }\n\n    .search-input::placeholder {\n      color: var(--sw-color-text-muted);\n    }\n\n    .list {\n      display: flex;\n      flex-direction: column;\n      max-height: 400px;\n      overflow-y: auto;\n    }\n\n    .item {\n      display: flex;\n      align-items: center;\n      gap: var(--sw-space-3);\n      padding: var(--sw-space-3) var(--sw-space-4);\n      border-bottom: 1px solid var(--sw-color-border);\n      cursor: pointer;\n      transition: background-color 0.15s ease;\n    }\n\n    .item:last-child {\n      border-bottom: none;\n    }\n\n    .item:hover {\n      background: var(--sw-color-background-hover);\n    }\n\n    .item:active {\n      background: var(--sw-color-background-active);\n    }\n\n    .item.selected {\n      background: var(--sw-color-primary);\n      color: white;\n    }\n\n    .item.selected .item-type,\n    .item.selected .item-channels {\n      color: rgba(255, 255, 255, 0.8);\n    }\n\n    .item-icon {\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      width: 40px;\n      height: 40px;\n      border-radius: 50%;\n      background: var(--sw-color-background-hover);\n      color: var(--sw-color-text-muted);\n      flex-shrink: 0;\n    }\n\n    .item.selected .item-icon {\n      background: rgba(255, 255, 255, 0.2);\n      color: white;\n    }\n\n    .item-icon svg {\n      width: 20px;\n      height: 20px;\n    }\n\n    .item-content {\n      flex: 1;\n      min-width: 0;\n    }\n\n    .item-name {\n      font-size: var(--sw-font-size-base);\n      font-weight: 500;\n      color: inherit;\n      white-space: nowrap;\n      overflow: hidden;\n      text-overflow: ellipsis;\n    }\n\n    .item-type {\n      font-size: var(--sw-font-size-sm);\n      color: var(--sw-color-text-muted);\n      text-transform: capitalize;\n    }\n\n    .item-channels {\n      display: flex;\n      gap: var(--sw-space-1);\n      color: var(--sw-color-text-muted);\n    }\n\n    .item-channels svg {\n      width: 16px;\n      height: 16px;\n    }\n\n    .item-channels .active {\n      color: var(--sw-color-success);\n    }\n\n    .loading,\n    .empty {\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      padding: var(--sw-space-4);\n      color: var(--sw-color-text-muted);\n      font-size: var(--sw-font-size-base);\n    }\n\n    .scroll-sentinel {\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      padding: var(--sw-space-3);\n      min-height: 1px;\n    }\n\n    .scroll-loading {\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      gap: var(--sw-space-2);\n      padding: var(--sw-space-3);\n      color: var(--sw-color-text-muted);\n      font-size: var(--sw-font-size-sm);\n    }\n\n    .spinner {\n      width: 16px;\n      height: 16px;\n      border: 2px solid var(--sw-color-border);\n      border-top-color: var(--sw-color-primary);\n      border-radius: 50%;\n      animation: spin 0.8s linear infinite;\n    }\n\n    @keyframes spin {\n      to {\n        transform: rotate(360deg);\n      }\n    }\n\n    .dial-button {\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      width: 36px;\n      height: 36px;\n      background: var(--sw-color-success);\n      border: none;\n      border-radius: 50%;\n      color: white;\n      cursor: pointer;\n      flex-shrink: 0;\n      transition: background-color 0.15s ease;\n    }\n\n    .dial-button:hover {\n      background: #0ea472;\n    }\n\n    .dial-button svg {\n      width: 18px;\n      height: 18px;\n    }\n  `;\n\n  /**\n   * Directory service with addresses$ observable\n   */\n  @property({ type: Object })\n  directory: DirectoryService | null = null;\n\n  /**\n   * Currently selected address\n   */\n  @state()\n  private selectedAddress: Address | null = null;\n\n  /**\n   * Search filter query\n   */\n  @state()\n  private searchQuery: string = '';\n\n  /**\n   * List of addresses from directory\n   */\n  @state()\n  private addresses: Address[] = [];\n\n  /**\n   * Loading state\n   */\n  @state()\n  private loading: boolean = false;\n\n  /**\n   * Has more addresses to load\n   */\n  @state()\n  private hasMore: boolean = false;\n\n  /**\n   * RxJS subscriptions for cleanup\n   */\n  private subscriptions: Subscription[] = [];\n\n  /**\n   * Debounce timer for search\n   */\n  private searchDebounceTimer: number | null = null;\n\n  /**\n   * IntersectionObserver for infinite scroll\n   */\n  private intersectionObserver: IntersectionObserver | null = null;\n\n  /**\n   * Flag to track if we're auto-loading for search\n   */\n  @state()\n  private isAutoLoadingForSearch: boolean = false;\n\n  connectedCallback() {\n    super.connectedCallback();\n    this.subscribeToDirectory();\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback();\n    this.cleanup();\n  }\n\n  private subscribeToDirectory() {\n    if (!this.directory) return;\n\n    // Subscribe to addresses\n    if (this.directory.addresses$) {\n      const addressesSub = this.directory.addresses$.subscribe((addresses) => {\n        this.addresses = addresses;\n      });\n      this.subscriptions.push(addressesSub);\n    }\n\n    // Subscribe to loading state\n    if (this.directory.loading$) {\n      const loadingSub = this.directory.loading$.subscribe((loading) => {\n        this.loading = loading;\n      });\n      this.subscriptions.push(loadingSub);\n    }\n\n    // Subscribe to hasMore\n    if (this.directory.hasMore$) {\n      const hasMoreSub = this.directory.hasMore$.subscribe((hasMore) => {\n        this.hasMore = hasMore;\n      });\n      this.subscriptions.push(hasMoreSub);\n    }\n\n    // Load initial data\n    if (this.directory.loadMore) {\n      this.directory.loadMore();\n    }\n  }\n\n  private cleanup() {\n    this.subscriptions.forEach((sub) => sub.unsubscribe());\n    this.subscriptions = [];\n    if (this.searchDebounceTimer) {\n      clearTimeout(this.searchDebounceTimer);\n    }\n    if (this.intersectionObserver) {\n      this.intersectionObserver.disconnect();\n      this.intersectionObserver = null;\n    }\n  }\n\n  protected firstUpdated() {\n    this.setupInfiniteScroll();\n  }\n\n  private setupInfiniteScroll() {\n    const sentinel = this.shadowRoot?.querySelector('.scroll-sentinel');\n    if (!sentinel) return;\n\n    this.intersectionObserver = new IntersectionObserver(\n      (entries) => {\n        const entry = entries[0];\n        if (entry?.isIntersecting && this.hasMore && !this.loading) {\n          this.handleLoadMore();\n        }\n      },\n      {\n        root: this.shadowRoot?.querySelector('.list'),\n        rootMargin: '100px',\n        threshold: 0\n      }\n    );\n\n    this.intersectionObserver.observe(sentinel);\n  }\n\n  protected updated(changedProperties: Map<string, unknown>) {\n    super.updated(changedProperties);\n\n    // Handle directory property changes\n    if (changedProperties.has('directory')) {\n      this.cleanup();\n      this.subscribeToDirectory();\n    }\n\n    // Re-setup infinite scroll if needed\n    if (!this.intersectionObserver) {\n      this.setupInfiniteScroll();\n    }\n\n    // Auto-load more when searching and no results found but more available\n    // Also check when loading state changes so we can trigger subsequent loads\n    if (\n      changedProperties.has('addresses') ||\n      changedProperties.has('searchQuery') ||\n      changedProperties.has('loading')\n    ) {\n      this.checkAutoLoadForSearch();\n    }\n  }\n\n  private async checkAutoLoadForSearch() {\n    // If we have a search query, no filtered results, but more to load, keep loading\n    // Note: !this.loading prevents concurrent loads, isAutoLoadingForSearch is for UI state only\n    if (\n      this.searchQuery.trim() &&\n      this.filteredAddresses.length === 0 &&\n      this.hasMore &&\n      !this.loading\n    ) {\n      this.isAutoLoadingForSearch = true;\n      await this.handleLoadMore();\n      // The updated() will be called again when addresses/loading change, continuing the loop\n    } else if (this.filteredAddresses.length > 0 || !this.hasMore) {\n      this.isAutoLoadingForSearch = false;\n    }\n  }\n\n  private get filteredAddresses(): Address[] {\n    if (!this.searchQuery.trim()) {\n      return this.addresses;\n    }\n    const query = this.searchQuery.toLowerCase();\n    return this.addresses.filter(\n      (addr) =>\n        addr.name.toLowerCase().includes(query) ||\n        (addr.displayName && addr.displayName.toLowerCase().includes(query))\n    );\n  }\n\n  private handleSearchInput(e: Event) {\n    const input = e.target as HTMLInputElement;\n\n    // Debounce search\n    if (this.searchDebounceTimer) {\n      clearTimeout(this.searchDebounceTimer);\n    }\n\n    this.searchDebounceTimer = window.setTimeout(() => {\n      this.searchQuery = input.value;\n    }, 200);\n  }\n\n  private handleItemClick(address: Address) {\n    this.selectedAddress = address;\n\n    this.dispatchEvent(\n      new CustomEvent('sw-address-select', {\n        detail: { address },\n        bubbles: true,\n        composed: true\n      })\n    );\n  }\n\n  private handleItemDoubleClick(address: Address) {\n    this.handleDial(address);\n  }\n\n  private handleDial(address: Address) {\n    this.dispatchEvent(\n      new CustomEvent('sw-dial', {\n        detail: { address },\n        bubbles: true,\n        composed: true\n      })\n    );\n  }\n\n  private async handleLoadMore() {\n    if (this.directory?.loadMore) {\n      await this.directory.loadMore();\n    }\n  }\n\n  private renderAddressIcon(address: Address) {\n    if (address.type === 'room') {\n      return html`\n        <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n          <path\n            d=\"M19 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm-7 3c1.93 0 3.5 1.57 3.5 3.5S13.93 13 12 13s-3.5-1.57-3.5-3.5S10.07 6 12 6zm7 13H5v-.23c0-.62.28-1.2.76-1.58C7.47 15.82 9.64 15 12 15s4.53.82 6.24 2.19c.48.38.76.97.76 1.58V19z\"\n          />\n        </svg>\n      `;\n    }\n    return html`\n      <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n        <path\n          d=\"M12 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm0 2c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4z\"\n        />\n      </svg>\n    `;\n  }\n\n  private renderChannelIcons(address: Address) {\n    const channels = address.channels || {};\n    return html`\n      <div class=\"item-channels\">\n        <svg\n          xmlns=\"http://www.w3.org/2000/svg\"\n          viewBox=\"0 0 24 24\"\n          fill=\"currentColor\"\n          class=\"${channels.audio ? 'active' : ''}\"\n          title=\"Audio\"\n        >\n          <path\n            d=\"M12 14c1.66 0 2.99-1.34 2.99-3L15 5c0-1.66-1.34-3-3-3S9 3.34 9 5v6c0 1.66 1.34 3 3 3z\"\n          />\n        </svg>\n        <svg\n          xmlns=\"http://www.w3.org/2000/svg\"\n          viewBox=\"0 0 24 24\"\n          fill=\"currentColor\"\n          class=\"${channels.video ? 'active' : ''}\"\n          title=\"Video\"\n        >\n          <path\n            d=\"M17 10.5V7c0-.55-.45-1-1-1H4c-.55 0-1 .45-1 1v10c0 .55.45 1 1 1h12c.55 0 1-.45 1-1v-3.5l4 4v-11l-4 4z\"\n          />\n        </svg>\n      </div>\n    `;\n  }\n\n  private renderLoadingIndicator() {\n    return html`\n      <div class=\"scroll-loading\">\n        <div class=\"spinner\"></div>\n        <span>${this.isAutoLoadingForSearch ? 'Searching...' : 'Loading more...'}</span>\n      </div>\n    `;\n  }\n\n  render() {\n    const showInitialLoading = this.loading && this.addresses.length === 0;\n    const showEmptyState = !this.loading && this.filteredAddresses.length === 0 && !this.hasMore;\n    const showSearchingState = this.isAutoLoadingForSearch && this.filteredAddresses.length === 0;\n\n    return html`\n      <div class=\"container\" part=\"container\">\n        <div class=\"search\" part=\"search\">\n          <input\n            type=\"text\"\n            class=\"search-input\"\n            placeholder=\"Search addresses...\"\n            @input=${this.handleSearchInput}\n            aria-label=\"Search addresses\"\n          />\n        </div>\n\n        <div class=\"list\" part=\"list\" role=\"listbox\">\n          ${showInitialLoading\n            ? html`<div class=\"loading\">Loading...</div>`\n            : showSearchingState\n              ? this.renderLoadingIndicator()\n              : showEmptyState\n                ? html`<div class=\"empty\">No addresses found</div>`\n                : html`\n                    ${this.filteredAddresses.map(\n                      (address) => html`\n                        <div\n                          class=\"item ${this.selectedAddress?.id === address.id ? 'selected' : ''}\"\n                          part=\"item ${this.selectedAddress?.id === address.id\n                            ? 'item-selected'\n                            : ''}\"\n                          role=\"option\"\n                          aria-selected=\"${this.selectedAddress?.id === address.id}\"\n                          @click=${() => this.handleItemClick(address)}\n                          @dblclick=${() => this.handleItemDoubleClick(address)}\n                        >\n                          <div class=\"item-icon\">${this.renderAddressIcon(address)}</div>\n                          <div class=\"item-content\">\n                            <div class=\"item-name\" part=\"item-name\">\n                              ${address.displayName || address.name}\n                            </div>\n                            <div class=\"item-type\" part=\"item-type\">\n                              ${address.type || 'address'}\n                            </div>\n                          </div>\n                          ${this.renderChannelIcons(address)}\n                          <button\n                            class=\"dial-button\"\n                            @click=${(e: Event) => {\n                              e.stopPropagation();\n                              this.handleDial(address);\n                            }}\n                            aria-label=\"Call ${address.displayName || address.name}\"\n                          >\n                            <svg\n                              xmlns=\"http://www.w3.org/2000/svg\"\n                              viewBox=\"0 0 24 24\"\n                              fill=\"currentColor\"\n                            >\n                              <path\n                                d=\"M6.62 10.79c1.44 2.83 3.76 5.15 6.59 6.59l2.2-2.2c.27-.27.67-.36 1.02-.24 1.12.37 2.33.57 3.57.57.55 0 1 .45 1 1V20c0 .55-.45 1-1 1-9.39 0-17-7.61-17-17 0-.55.45-1 1-1h3.5c.55 0 1 .45 1 1 0 1.25.2 2.45.57 3.57.11.35.03.74-.25 1.02l-2.2 2.2z\"\n                              />\n                            </svg>\n                          </button>\n                        </div>\n                      `\n                    )}\n                    <!-- Scroll sentinel for infinite scroll -->\n                    <div class=\"scroll-sentinel\">\n                      ${this.loading && !this.isAutoLoadingForSearch\n                        ? this.renderLoadingIndicator()\n                        : null}\n                    </div>\n                  `}\n        </div>\n      </div>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'sw-directory': DirectoryComponent;\n  }\n}\n"],"names":["DirectoryComponent","LitElement","addressesSub","addresses","loadingSub","loading","hasMoreSub","hasMore","sub","sentinel","_a","entries","entry","_b","changedProperties","query","addr","input","address","html","channels","showInitialLoading","showEmptyState","showSearchingState","_c","e","css","__decorateClass","property","state","customElement"],"mappings":";;;;;;;AA2CO,IAAMA,IAAN,cAAiCC,EAAW;AAAA,EAA5C,cAAA;AAAA,UAAA,GAAA,SAAA,GA8PL,KAAA,YAAqC,MAMrC,KAAQ,kBAAkC,MAM1C,KAAQ,cAAsB,IAM9B,KAAQ,YAAuB,CAAA,GAM/B,KAAQ,UAAmB,IAM3B,KAAQ,UAAmB,IAK3B,KAAQ,gBAAgC,CAAA,GAKxC,KAAQ,sBAAqC,MAK7C,KAAQ,uBAAoD,MAM5D,KAAQ,yBAAkC;AAAA,EAAA;AAAA,EAE1C,oBAAoB;AAClB,UAAM,kBAAA,GACN,KAAK,qBAAA;AAAA,EACP;AAAA,EAEA,uBAAuB;AACrB,UAAM,qBAAA,GACN,KAAK,QAAA;AAAA,EACP;AAAA,EAEQ,uBAAuB;AAC7B,QAAK,KAAK,WAGV;AAAA,UAAI,KAAK,UAAU,YAAY;AAC7B,cAAMC,IAAe,KAAK,UAAU,WAAW,UAAU,CAACC,MAAc;AACtE,eAAK,YAAYA;AAAA,QACnB,CAAC;AACD,aAAK,cAAc,KAAKD,CAAY;AAAA,MACtC;AAGA,UAAI,KAAK,UAAU,UAAU;AAC3B,cAAME,IAAa,KAAK,UAAU,SAAS,UAAU,CAACC,MAAY;AAChE,eAAK,UAAUA;AAAA,QACjB,CAAC;AACD,aAAK,cAAc,KAAKD,CAAU;AAAA,MACpC;AAGA,UAAI,KAAK,UAAU,UAAU;AAC3B,cAAME,IAAa,KAAK,UAAU,SAAS,UAAU,CAACC,MAAY;AAChE,eAAK,UAAUA;AAAA,QACjB,CAAC;AACD,aAAK,cAAc,KAAKD,CAAU;AAAA,MACpC;AAGA,MAAI,KAAK,UAAU,YACjB,KAAK,UAAU,SAAA;AAAA;AAAA,EAEnB;AAAA,EAEQ,UAAU;AAChB,SAAK,cAAc,QAAQ,CAACE,MAAQA,EAAI,aAAa,GACrD,KAAK,gBAAgB,CAAA,GACjB,KAAK,uBACP,aAAa,KAAK,mBAAmB,GAEnC,KAAK,yBACP,KAAK,qBAAqB,WAAA,GAC1B,KAAK,uBAAuB;AAAA,EAEhC;AAAA,EAEU,eAAe;AACvB,SAAK,oBAAA;AAAA,EACP;AAAA,EAEQ,sBAAsB;;AAC5B,UAAMC,KAAWC,IAAA,KAAK,eAAL,gBAAAA,EAAiB,cAAc;AAChD,IAAKD,MAEL,KAAK,uBAAuB,IAAI;AAAA,MAC9B,CAACE,MAAY;AACX,cAAMC,IAAQD,EAAQ,CAAC;AACvB,QAAIC,KAAA,QAAAA,EAAO,kBAAkB,KAAK,WAAW,CAAC,KAAK,WACjD,KAAK,eAAA;AAAA,MAET;AAAA,MACA;AAAA,QACE,OAAMC,IAAA,KAAK,eAAL,gBAAAA,EAAiB,cAAc;AAAA,QACrC,YAAY;AAAA,QACZ,WAAW;AAAA,MAAA;AAAA,IACb,GAGF,KAAK,qBAAqB,QAAQJ,CAAQ;AAAA,EAC5C;AAAA,EAEU,QAAQK,GAAyC;AACzD,UAAM,QAAQA,CAAiB,GAG3BA,EAAkB,IAAI,WAAW,MACnC,KAAK,QAAA,GACL,KAAK,qBAAA,IAIF,KAAK,wBACR,KAAK,oBAAA,IAMLA,EAAkB,IAAI,WAAW,KACjCA,EAAkB,IAAI,aAAa,KACnCA,EAAkB,IAAI,SAAS,MAE/B,KAAK,uBAAA;AAAA,EAET;AAAA,EAEA,MAAc,yBAAyB;AAGrC,IACE,KAAK,YAAY,KAAA,KACjB,KAAK,kBAAkB,WAAW,KAClC,KAAK,WACL,CAAC,KAAK,WAEN,KAAK,yBAAyB,IAC9B,MAAM,KAAK,eAAA,MAEF,KAAK,kBAAkB,SAAS,KAAK,CAAC,KAAK,aACpD,KAAK,yBAAyB;AAAA,EAElC;AAAA,EAEA,IAAY,oBAA+B;AACzC,QAAI,CAAC,KAAK,YAAY;AACpB,aAAO,KAAK;AAEd,UAAMC,IAAQ,KAAK,YAAY,YAAA;AAC/B,WAAO,KAAK,UAAU;AAAA,MACpB,CAACC,MACCA,EAAK,KAAK,YAAA,EAAc,SAASD,CAAK,KACrCC,EAAK,eAAeA,EAAK,YAAY,YAAA,EAAc,SAASD,CAAK;AAAA,IAAA;AAAA,EAExE;AAAA,EAEQ,kBAAkB,GAAU;AAClC,UAAME,IAAQ,EAAE;AAGhB,IAAI,KAAK,uBACP,aAAa,KAAK,mBAAmB,GAGvC,KAAK,sBAAsB,OAAO,WAAW,MAAM;AACjD,WAAK,cAAcA,EAAM;AAAA,IAC3B,GAAG,GAAG;AAAA,EACR;AAAA,EAEQ,gBAAgBC,GAAkB;AACxC,SAAK,kBAAkBA,GAEvB,KAAK;AAAA,MACH,IAAI,YAAY,qBAAqB;AAAA,QACnC,QAAQ,EAAE,SAAAA,EAAA;AAAA,QACV,SAAS;AAAA,QACT,UAAU;AAAA,MAAA,CACX;AAAA,IAAA;AAAA,EAEL;AAAA,EAEQ,sBAAsBA,GAAkB;AAC9C,SAAK,WAAWA,CAAO;AAAA,EACzB;AAAA,EAEQ,WAAWA,GAAkB;AACnC,SAAK;AAAA,MACH,IAAI,YAAY,WAAW;AAAA,QACzB,QAAQ,EAAE,SAAAA,EAAA;AAAA,QACV,SAAS;AAAA,QACT,UAAU;AAAA,MAAA,CACX;AAAA,IAAA;AAAA,EAEL;AAAA,EAEA,MAAc,iBAAiB;;AAC7B,KAAIR,IAAA,KAAK,cAAL,QAAAA,EAAgB,YAClB,MAAM,KAAK,UAAU,SAAA;AAAA,EAEzB;AAAA,EAEQ,kBAAkBQ,GAAkB;AAC1C,WAAIA,EAAQ,SAAS,SACZC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,UAQFA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAOT;AAAA,EAEQ,mBAAmBD,GAAkB;AAC3C,UAAME,IAAWF,EAAQ,YAAY,CAAA;AACrC,WAAOC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAMQC,EAAS,QAAQ,WAAW,EAAE;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAW9BA,EAAS,QAAQ,WAAW,EAAE;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAS/C;AAAA,EAEQ,yBAAyB;AAC/B,WAAOD;AAAA;AAAA;AAAA,gBAGK,KAAK,yBAAyB,iBAAiB,iBAAiB;AAAA;AAAA;AAAA,EAG9E;AAAA,EAEA,SAAS;AACP,UAAME,IAAqB,KAAK,WAAW,KAAK,UAAU,WAAW,GAC/DC,IAAiB,CAAC,KAAK,WAAW,KAAK,kBAAkB,WAAW,KAAK,CAAC,KAAK,SAC/EC,IAAqB,KAAK,0BAA0B,KAAK,kBAAkB,WAAW;AAE5F,WAAOJ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,qBAOU,KAAK,iBAAiB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,YAM/BE,IACEF,2CACAI,IACE,KAAK,uBAAA,IACLD,IACEH,iDACAA;AAAA,sBACI,KAAK,kBAAkB;AAAA,MACvB,CAACD,MAAA;;AAAY,eAAAC;AAAA;AAAA,0CAEKT,IAAA,KAAK,oBAAL,gBAAAA,EAAsB,QAAOQ,EAAQ,KAAK,aAAa,EAAE;AAAA,yCAC1DL,IAAA,KAAK,oBAAL,gBAAAA,EAAsB,QAAOK,EAAQ,KAC9C,kBACA,EAAE;AAAA;AAAA,6CAEWM,IAAA,KAAK,oBAAL,gBAAAA,EAAsB,QAAON,EAAQ,EAAE;AAAA,mCAC/C,MAAM,KAAK,gBAAgBA,CAAO,CAAC;AAAA,sCAChC,MAAM,KAAK,sBAAsBA,CAAO,CAAC;AAAA;AAAA,mDAE5B,KAAK,kBAAkBA,CAAO,CAAC;AAAA;AAAA;AAAA,gCAGlDA,EAAQ,eAAeA,EAAQ,IAAI;AAAA;AAAA;AAAA,gCAGnCA,EAAQ,QAAQ,SAAS;AAAA;AAAA;AAAA,4BAG7B,KAAK,mBAAmBA,CAAO,CAAC;AAAA;AAAA;AAAA,qCAGvB,CAACO,MAAa;AACrB,UAAAA,EAAE,gBAAA,GACF,KAAK,WAAWP,CAAO;AAAA,QACzB,CAAC;AAAA,+CACkBA,EAAQ,eAAeA,EAAQ,IAAI;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAAA,CAc7D;AAAA;AAAA;AAAA,wBAGG,KAAK,WAAW,CAAC,KAAK,yBACpB,KAAK,uBAAA,IACL,IAAI;AAAA;AAAA,mBAEX;AAAA;AAAA;AAAA;AAAA,EAIjB;AACF;AA/mBalB,EACJ,SAAS0B;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AA6PhBC,EAAA;AAAA,EADCC,EAAS,EAAE,MAAM,OAAA,CAAQ;AAAA,GA7Pf5B,EA8PX,WAAA,aAAA,CAAA;AAMQ2B,EAAA;AAAA,EADPE,EAAA;AAAM,GAnQI7B,EAoQH,WAAA,mBAAA,CAAA;AAMA2B,EAAA;AAAA,EADPE,EAAA;AAAM,GAzQI7B,EA0QH,WAAA,eAAA,CAAA;AAMA2B,EAAA;AAAA,EADPE,EAAA;AAAM,GA/QI7B,EAgRH,WAAA,aAAA,CAAA;AAMA2B,EAAA;AAAA,EADPE,EAAA;AAAM,GArRI7B,EAsRH,WAAA,WAAA,CAAA;AAMA2B,EAAA;AAAA,EADPE,EAAA;AAAM,GA3RI7B,EA4RH,WAAA,WAAA,CAAA;AAqBA2B,EAAA;AAAA,EADPE,EAAA;AAAM,GAhTI7B,EAiTH,WAAA,0BAAA,CAAA;AAjTGA,IAAN2B,EAAA;AAAA,EADNG,EAAc,cAAc;AAAA,GAChB9B,CAAA;"}

package/dist/components/example-button.d.ts

@@ -1,20 +0,0 @@
-import { LitElement } from 'lit';
-/**
- * An example button component built with Lit
- *
- * @slot - Default slot for button content
- * @csspart button - The button element
- */
-export declare class ExampleButton extends LitElement {
-    static styles: import("lit").CSSResult;
-    disabled: boolean;
-    variant: 'primary' | 'secondary';
-    private _handleClick;
-    render(): import("lit-html").TemplateResult<1>;
-}
-declare global {
-    interface HTMLElementTagNameMap {
-        'sw-example-button': ExampleButton;
-    }
-}
-//# sourceMappingURL=example-button.d.ts.map

package/dist/components/example-button.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"example-button.d.ts","sourceRoot":"","sources":["../../src/components/example-button.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAa,MAAM,KAAK,CAAC;AAG5C;;;;;GAKG;AACH,qBACa,aAAc,SAAQ,UAAU;IAC3C,MAAM,CAAC,MAAM,0BA4BX;IAGF,QAAQ,UAAS;IAGjB,OAAO,EAAE,SAAS,GAAG,WAAW,CAAa;IAE7C,OAAO,CAAC,YAAY;IAgBpB,MAAM;CAOP;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,mBAAmB,EAAE,aAAa,CAAC;KACpC;CACF"}

package/dist/components/example-button.js

@@ -1,74 +0,0 @@
-import { LitElement as d, html as p, css as u } from "lit";
-import { property as c, customElement as b } from "lit/decorators.js";
-var m = Object.defineProperty, h = Object.getOwnPropertyDescriptor, i = (o, e, s, n) => {
-  for (var t = n > 1 ? void 0 : n ? h(e, s) : e, l = o.length - 1, a; l >= 0; l--)
-    (a = o[l]) && (t = (n ? a(e, s, t) : a(t)) || t);
-  return n && t && m(e, s, t), t;
-};
-let r = class extends d {
-  constructor() {
-    super(...arguments), this.disabled = !1, this.variant = "primary";
-  }
-  _handleClick(o) {
-    if (this.disabled) {
-      o.preventDefault(), o.stopPropagation();
-      return;
-    }
-    this.dispatchEvent(
-      new CustomEvent("sw-click", {
-        detail: { originalEvent: o },
-        bubbles: !0,
-        composed: !0
-      })
-    );
-  }
-  render() {
-    return p`
-      <button part="button" ?disabled=${this.disabled} @click=${this._handleClick}>
-        <slot></slot>
-      </button>
-    `;
-  }
-};
-r.styles = u`
-    :host {
-      display: inline-block;
-    }
-
-    button {
-      padding: 0.5rem 1rem;
-      font-size: 1rem;
-      border: none;
-      border-radius: 4px;
-      background-color: #0066cc;
-      color: white;
-      cursor: pointer;
-      transition: background-color 0.2s;
-    }
-
-    button:hover {
-      background-color: #0052a3;
-    }
-
-    button:active {
-      background-color: #003d7a;
-    }
-
-    button:disabled {
-      background-color: #cccccc;
-      cursor: not-allowed;
-    }
-  `;
-i([
-  c({ type: Boolean })
-], r.prototype, "disabled", 2);
-i([
-  c({ type: String })
-], r.prototype, "variant", 2);
-r = i([
-  b("sw-example-button")
-], r);
-export {
-  r as ExampleButton
-};
-//# sourceMappingURL=example-button.js.map

package/dist/components/example-button.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"example-button.js","sources":["../../src/components/example-button.ts"],"sourcesContent":["import { LitElement, html, css } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\n\n/**\n * An example button component built with Lit\n *\n * @slot - Default slot for button content\n * @csspart button - The button element\n */\n@customElement('sw-example-button')\nexport class ExampleButton extends LitElement {\n  static styles = css`\n    :host {\n      display: inline-block;\n    }\n\n    button {\n      padding: 0.5rem 1rem;\n      font-size: 1rem;\n      border: none;\n      border-radius: 4px;\n      background-color: #0066cc;\n      color: white;\n      cursor: pointer;\n      transition: background-color 0.2s;\n    }\n\n    button:hover {\n      background-color: #0052a3;\n    }\n\n    button:active {\n      background-color: #003d7a;\n    }\n\n    button:disabled {\n      background-color: #cccccc;\n      cursor: not-allowed;\n    }\n  `;\n\n  @property({ type: Boolean })\n  disabled = false;\n\n  @property({ type: String })\n  variant: 'primary' | 'secondary' = 'primary';\n\n  private _handleClick(e: MouseEvent) {\n    if (this.disabled) {\n      e.preventDefault();\n      e.stopPropagation();\n      return;\n    }\n\n    this.dispatchEvent(\n      new CustomEvent('sw-click', {\n        detail: { originalEvent: e },\n        bubbles: true,\n        composed: true\n      })\n    );\n  }\n\n  render() {\n    return html`\n      <button part=\"button\" ?disabled=${this.disabled} @click=${this._handleClick}>\n        <slot></slot>\n      </button>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'sw-example-button': ExampleButton;\n  }\n}\n"],"names":["ExampleButton","LitElement","e","html","css","__decorateClass","property","customElement"],"mappings":";;;;;;;AAUO,IAAMA,IAAN,cAA4BC,EAAW;AAAA,EAAvC,cAAA;AAAA,UAAA,GAAA,SAAA,GAgCL,KAAA,WAAW,IAGX,KAAA,UAAmC;AAAA,EAAA;AAAA,EAE3B,aAAaC,GAAe;AAClC,QAAI,KAAK,UAAU;AACjB,MAAAA,EAAE,eAAA,GACFA,EAAE,gBAAA;AACF;AAAA,IACF;AAEA,SAAK;AAAA,MACH,IAAI,YAAY,YAAY;AAAA,QAC1B,QAAQ,EAAE,eAAeA,EAAA;AAAA,QACzB,SAAS;AAAA,QACT,UAAU;AAAA,MAAA,CACX;AAAA,IAAA;AAAA,EAEL;AAAA,EAEA,SAAS;AACP,WAAOC;AAAA,wCAC6B,KAAK,QAAQ,WAAW,KAAK,YAAY;AAAA;AAAA;AAAA;AAAA,EAI/E;AACF;AA5DaH,EACJ,SAASI;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AA+BhBC,EAAA;AAAA,EADCC,EAAS,EAAE,MAAM,QAAA,CAAS;AAAA,GA/BhBN,EAgCX,WAAA,YAAA,CAAA;AAGAK,EAAA;AAAA,EADCC,EAAS,EAAE,MAAM,OAAA,CAAQ;AAAA,GAlCfN,EAmCX,WAAA,WAAA,CAAA;AAnCWA,IAANK,EAAA;AAAA,EADNE,EAAc,mBAAmB;AAAA,GACrBP,CAAA;"}