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

package/dist/components/sw-call-media.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"sw-call-media.js","sources":["../../src/components/sw-call-media.ts"],"sourcesContent":["/**\n * Call Media Component\n *\n * Renders the remote video stream with aspect-ratio-aware sizing.\n *\n * Input precedence (most specific wins): `.stream` > `.call` > context.\n *\n * @example\n * ```html\n * <!-- Inside a context provider (sw-call-widget): -->\n * <sw-call-media></sw-call-media>\n *\n * <!-- With an explicit Call: -->\n * <sw-call-media .call=${call}></sw-call-media>\n *\n * <!-- With a raw remote stream: -->\n * <sw-call-media .stream=${remoteStream}></sw-call-media>\n * ```\n *\n * @csspart container - Outer container that holds the video and overlay layers.\n * @csspart video     - The `<video>` element rendering the remote stream.\n *\n * @slot - Default slot for overlay layers (e.g. `<sw-self-media>`, `<sw-participants>`).\n */\n\nimport { LitElement, html, css } from 'lit';\nimport { customElement, property, state } from 'lit/decorators.js';\nimport { consume } from '@lit/context';\nimport { Subscription } from 'rxjs';\nimport type { Call } from '../types/index.js';\nimport { callStateContext, type CallState } from '../context/call-state-context.js';\nimport { devicesContext, type DevicesState } from '../context/devices-context.js';\nimport { debounce } from '../utils/debounce.js';\nimport { waitForVideoReady, attachMediaStream, detachMediaStream } from '../utils/video.js';\nimport { getLogger } from '@signalwire/js';\n\nconst logger = getLogger();\n\n@customElement('sw-call-media')\nexport class SwCallMedia extends LitElement {\n  static styles = css`\n    :host {\n      display: block;\n      width: 100%;\n      height: 100%;\n      overflow: hidden;\n    }\n\n    .mcu-content {\n      position: relative;\n      width: 100%;\n      height: 100%;\n      margin: 0 auto;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      background-color: var(--bg-page, #0e0e18);\n      overflow: hidden;\n    }\n\n    .padding-wrapper {\n      position: relative;\n      max-width: 100%;\n      max-height: 100%;\n      transition:\n        width 0.3s ease,\n        height 0.3s ease;\n    }\n\n    /* Outer rounding is owned by sw-ui-call-layout's :host border-radius +\n       overflow:hidden. Rounding here too carves a notch out of the right\n       edge of the video cell that exposes whatever sits behind the widget\n       (page / modal backdrop) as a black sliver in light mode. */\n    .mcu-wrapper {\n      position: absolute;\n      top: 0;\n      left: 0;\n      right: 0;\n      bottom: 0;\n      overflow: hidden;\n    }\n\n    .mcu-video {\n      width: 100%;\n      height: 100%;\n      display: block;\n      object-fit: contain;\n    }\n\n    .mcu-layers {\n      position: absolute;\n      top: 0;\n      left: 0;\n      width: 100%;\n      height: 100%;\n      pointer-events: none;\n    }\n  `;\n\n  /**\n   * Explicit Call — when set, subscribes directly to its observables instead\n   * of relying on context. Overridden by `.stream` if both are set.\n   */\n  @property({ type: Object }) call?: Call;\n\n  /**\n   * Explicit remote MediaStream — highest precedence. Bypasses both `.call`\n   * and context. Useful for raw rendering with no SDK at all.\n   */\n  @property({ attribute: false }) stream: MediaStream | null = null;\n\n  @consume({ context: callStateContext, subscribe: true })\n  @state()\n  private _callState?: CallState;\n\n  @consume({ context: devicesContext, subscribe: true })\n  @state()\n  private _devicesState?: DevicesState;\n\n  private _remoteStreamValue: MediaStream | null = null;\n  private _lastTrackSignature = '';\n  private _subscriptions: Subscription[] = [];\n  private _resizeObserver?: ResizeObserver;\n  private _videoResizeHandler?: () => void;\n  private _windowResizeHandler?: () => void;\n  private _videoElement?: HTMLVideoElement;\n  private _paddingWrapper?: HTMLDivElement;\n\n  // ── Lifecycle ──────────────────────────────────────────────────────\n\n  connectedCallback() {\n    super.connectedCallback();\n    if (!this.stream && this.call) this._setupDirectSubscriptions();\n    if (this.stream) {\n      this._remoteStreamValue = this.stream;\n      this._lastTrackSignature = this._computeTrackSignature(this.stream);\n    }\n  }\n\n  protected updated(changedProperties: Map<string, unknown>): void {\n    super.updated(changedProperties);\n\n    // Direct call prop changed — re-subscribe (only meaningful when `.stream` isn't set)\n    if (changedProperties.has('call')) {\n      this._cleanupDirectSubscriptions();\n      if (!this.stream && this.call) this._setupDirectSubscriptions();\n    }\n\n    // Explicit `.stream` prop wins — attach it and skip everything else.\n    if (changedProperties.has('stream')) {\n      this._cleanupDirectSubscriptions();\n      const stream = this.stream;\n      const signature = this._computeTrackSignature(stream);\n      if (stream !== this._remoteStreamValue || signature !== this._lastTrackSignature) {\n        this._remoteStreamValue = stream;\n        this._lastTrackSignature = signature;\n        const video = this.shadowRoot?.querySelector('video.mcu-video') as HTMLVideoElement;\n        if (video) attachMediaStream(video, stream);\n      }\n    }\n\n    // Context-driven: stream or its track set changed.\n    // WebRTC delivers tracks one at a time via ontrack, and the SDK re-emits\n    // the same MediaStream reference each time — so we must also re-attach when\n    // the track set changes, otherwise Chromium may never render a video track\n    // added after the initial srcObject assignment.\n    if (!this.stream && !this.call && changedProperties.has('_callState')) {\n      const stream = this._callState?.remoteStream ?? null;\n      const signature = this._computeTrackSignature(stream);\n      if (stream !== this._remoteStreamValue || signature !== this._lastTrackSignature) {\n        this._remoteStreamValue = stream;\n        this._lastTrackSignature = signature;\n        const video = this.shadowRoot?.querySelector('video.mcu-video') as HTMLVideoElement;\n        if (video) attachMediaStream(video, stream);\n      }\n    }\n\n    // Audio output device changed\n    if (changedProperties.has('_devicesState')) {\n      this._applySinkId(this._devicesState?.selectedAudioOutput?.deviceId ?? '');\n    }\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback();\n    this._cleanupDirectSubscriptions();\n    this._cleanupResizeObserver();\n    this._cleanupVideoElement();\n  }\n\n  protected firstUpdated(): void {\n    const video = this.shadowRoot?.querySelector('video.mcu-video') as HTMLVideoElement;\n    if (video) {\n      waitForVideoReady(video).then(() => {\n        if (this.isConnected) this._setupResizeObserver();\n      });\n    }\n  }\n\n  // ── Direct call subscriptions (legacy / standalone) ────────────────\n\n  private _setupDirectSubscriptions(): void {\n    if (!this.call) return;\n    this._subscriptions.push(\n      this.call.remoteStream$.subscribe((stream: MediaStream | null) => {\n        const signature = this._computeTrackSignature(stream);\n        if (stream === this._remoteStreamValue && signature === this._lastTrackSignature) {\n          return;\n        }\n        this._remoteStreamValue = stream;\n        this._lastTrackSignature = signature;\n        this.requestUpdate();\n        const video = this.shadowRoot?.querySelector('video.mcu-video') as HTMLVideoElement;\n        if (video) attachMediaStream(video, stream);\n      })\n    );\n  }\n\n  private _computeTrackSignature(stream: MediaStream | null): string {\n    if (!stream) return '';\n    return stream.getTracks().map((t) => `${t.kind}:${t.id}`).sort().join('|');\n  }\n\n  private _cleanupDirectSubscriptions(): void {\n    this._subscriptions.forEach((sub) => sub.unsubscribe());\n    this._subscriptions = [];\n  }\n\n  // ── Audio output ───────────────────────────────────────────────────\n\n  private _applySinkId(deviceId: string): void {\n    const video = this.shadowRoot?.querySelector('video.mcu-video') as HTMLVideoElement & {\n      setSinkId?: (sinkId: string) => Promise<void>;\n    };\n    if (!video?.setSinkId) return;\n    video.setSinkId(deviceId).catch((err) => {\n      logger.error('[SwCallMedia] Failed to set audio output device:', err);\n    });\n  }\n\n  // ── Resize / dimension management ──────────────────────────────────\n\n  private _setupResizeObserver(): void {\n    const video = this.shadowRoot?.querySelector('video.mcu-video') as HTMLVideoElement;\n    const paddingWrapper = this.shadowRoot?.querySelector('.padding-wrapper') as HTMLDivElement;\n    if (!video || !paddingWrapper) return;\n\n    this._videoElement = video;\n    this._paddingWrapper = paddingWrapper;\n\n    this._resizeObserver = new ResizeObserver(\n      debounce(() => this._recalculateDimensions(), 50)\n    );\n    this._resizeObserver.observe(this);\n\n    this._videoResizeHandler = () => this._recalculateDimensions();\n    video.addEventListener('resize', this._videoResizeHandler);\n\n    this._windowResizeHandler = () => {\n      requestAnimationFrame(() => this._recalculateDimensions());\n    };\n    window.addEventListener('resize', this._windowResizeHandler);\n\n    this._recalculateDimensions();\n  }\n\n  private _recalculateDimensions(): void {\n    const video = this._videoElement;\n    const paddingWrapper = this._paddingWrapper;\n    if (!video || !paddingWrapper) return;\n\n    if (!video.videoWidth || !video.videoHeight) {\n      paddingWrapper.style.width = '100%';\n      paddingWrapper.style.height = '100%';\n      paddingWrapper.style.paddingBottom = '0';\n      paddingWrapper.style.transform = 'none';\n      return;\n    }\n\n    const viewportWidth = window.innerWidth;\n    const viewportHeight = window.innerHeight;\n    const containerRect = this.getBoundingClientRect();\n    const containerWidth = containerRect.width;\n    const containerHeight = containerRect.height;\n    if (containerWidth <= 0 || containerHeight <= 0) return;\n\n    const scaleX = Math.min(1, (viewportWidth - containerRect.left) / containerWidth);\n    const scaleY = Math.min(1, (viewportHeight - containerRect.top) / containerHeight);\n    const scale = Math.min(scaleX, scaleY);\n\n    const maxWidth = containerWidth * scale;\n    const maxHeight = containerHeight * scale;\n    if (maxWidth <= 0 || maxHeight <= 0) return;\n\n    const videoAspectRatio = video.videoWidth / video.videoHeight;\n    const availableAspectRatio = maxWidth / maxHeight;\n\n    let finalWidth: number;\n    let finalHeight: number;\n\n    if (videoAspectRatio > availableAspectRatio) {\n      finalWidth = maxWidth;\n      finalHeight = finalWidth / videoAspectRatio;\n    } else {\n      finalHeight = maxHeight;\n      finalWidth = finalHeight * videoAspectRatio;\n    }\n\n    const visibleLeft = Math.max(0, containerRect.left);\n    const visibleTop = Math.max(0, containerRect.top);\n    const visibleRight = Math.min(viewportWidth, containerRect.right);\n    const visibleBottom = Math.min(viewportHeight, containerRect.bottom);\n\n    const visibleCenterX = (visibleLeft + visibleRight) / 2;\n    const visibleCenterY = (visibleTop + visibleBottom) / 2;\n    const containerCenterX = containerRect.left + containerWidth / 2;\n    const containerCenterY = containerRect.top + containerHeight / 2;\n\n    const offsetX = visibleCenterX - containerCenterX;\n    const offsetY = visibleCenterY - containerCenterY;\n\n    paddingWrapper.style.width = `${finalWidth}px`;\n    paddingWrapper.style.height = `${finalHeight}px`;\n    paddingWrapper.style.paddingBottom = '0';\n    paddingWrapper.style.transform = `translate(${offsetX}px, ${offsetY}px)`;\n  }\n\n  private _cleanupResizeObserver(): void {\n    if (this._resizeObserver) {\n      this._resizeObserver.disconnect();\n      this._resizeObserver = undefined;\n    }\n    const video = this.shadowRoot?.querySelector('video.mcu-video') as HTMLVideoElement;\n    if (video && this._videoResizeHandler) {\n      video.removeEventListener('resize', this._videoResizeHandler);\n      this._videoResizeHandler = undefined;\n    }\n    if (this._windowResizeHandler) {\n      window.removeEventListener('resize', this._windowResizeHandler);\n      this._windowResizeHandler = undefined;\n    }\n  }\n\n  private _cleanupVideoElement(): void {\n    const video = this.shadowRoot?.querySelector('video.mcu-video') as HTMLVideoElement;\n    if (video) detachMediaStream(video);\n  }\n\n  // ── Render ─────────────────────────────────────────────────────────\n\n  render() {\n    return html`\n      <div class=\"mcu-content\" part=\"container\">\n        <div class=\"padding-wrapper\">\n          <div class=\"mcu-wrapper\">\n            <video\n              class=\"mcu-video\"\n              part=\"video\"\n              autoplay\n              playsinline\n              .srcObject=${this._remoteStreamValue}\n            ></video>\n          </div>\n          <div class=\"mcu-layers\">\n            <slot></slot>\n          </div>\n        </div>\n      </div>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'sw-call-media': SwCallMedia;\n  }\n}\n"],"names":["logger","getLogger","SwCallMedia","LitElement","changedProperties","stream","signature","video","_a","attachMediaStream","_b","_c","_e","_d","waitForVideoReady","t","sub","deviceId","err","paddingWrapper","debounce","viewportWidth","viewportHeight","containerRect","containerWidth","containerHeight","scaleX","scaleY","scale","maxWidth","maxHeight","videoAspectRatio","availableAspectRatio","finalWidth","finalHeight","visibleLeft","visibleTop","visibleRight","visibleBottom","visibleCenterX","visibleCenterY","containerCenterX","containerCenterY","offsetX","offsetY","html","css","__decorateClass","property","consume","callStateContext","state","devicesContext","customElement"],"mappings":"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"}

package/dist/components/sw-call-provider.d.ts

@@ -0,0 +1,41 @@
+import { LitElement } from 'lit';
+import type { Call, DeviceController } from '../types/index.js';
+/**
+ * Context provider element that bridges an external `Call` and/or
+ * `DeviceController` into Lit context so any descendant web component
+ * (sw-call-media, sw-call-controls, sw-participants, etc.) receives live
+ * state without manual property wiring.
+ *
+ * Usage:
+ *   ```html
+ *   <sw-call-provider id="provider">
+ *     <sw-call-media></sw-call-media>
+ *     <sw-call-controls></sw-call-controls>
+ *   </sw-call-provider>
+ *   ```
+ *   ```js
+ *   provider.call = activeCall;
+ *   provider.deviceController = signalWireClient;
+ *   ```
+ *
+ * @prop {Call}             call             - Active call object
+ * @prop {DeviceController} deviceController - Device controller for input/output device management
+ *
+ * @slot - Default slot. Descendants consume the provided contexts.
+ */
+export declare class SwCallProvider extends LitElement {
+    static styles: import("lit").CSSResult;
+    call: Call | undefined;
+    deviceController: DeviceController | undefined;
+    private _callState;
+    private _devices;
+    protected updated(changed: Map<string, unknown>): void;
+    disconnectedCallback(): void;
+    render(): import("lit-html").TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'sw-call-provider': SwCallProvider;
+    }
+}
+//# sourceMappingURL=sw-call-provider.d.ts.map

package/dist/components/sw-call-provider.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"sw-call-provider.d.ts","sourceRoot":"","sources":["../../src/components/sw-call-provider.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAa,MAAM,KAAK,CAAC;AAE5C,OAAO,KAAK,EAAE,IAAI,EAAE,gBAAgB,EAAE,MAAM,mBAAmB,CAAC;AAIhE;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH,qBACa,cAAe,SAAQ,UAAU;IAC5C,MAAM,CAAC,MAAM,0BAAqC;IAElB,IAAI,EAAE,IAAI,GAAG,SAAS,CAAa;IACnC,gBAAgB,EAAE,gBAAgB,GAAG,SAAS,CAAa;IAE3F,OAAO,CAAC,UAAU,CAAwC;IAC1D,OAAO,CAAC,QAAQ,CAAsC;IAEtD,SAAS,CAAC,OAAO,CAAC,OAAO,EAAE,GAAG,CAAC,MAAM,EAAE,OAAO,CAAC,GAAG,IAAI;IAkBtD,oBAAoB,IAAI,IAAI;IAM5B,MAAM;CAGP;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,kBAAkB,EAAE,cAAc,CAAC;KACpC;CACF"}

package/dist/components/sw-call-provider.js

@@ -0,0 +1,37 @@
+import { LitElement as d, html as p, css as v } from "lit";
+import { property as a, customElement as h } from "lit/decorators.js";
+import { CallStateContextController as C } from "../context/CallStateContextController.js";
+import { DevicesContextController as _ } from "../context/DevicesContextController.js";
+var f = Object.defineProperty, m = Object.getOwnPropertyDescriptor, n = (t, s, r, o) => {
+  for (var e = o > 1 ? void 0 : o ? m(s, r) : s, i = t.length - 1, c; i >= 0; i--)
+    (c = t[i]) && (e = (o ? c(s, r, e) : c(e)) || e);
+  return o && e && f(s, r, e), e;
+};
+let l = class extends d {
+  constructor() {
+    super(...arguments), this.call = void 0, this.deviceController = void 0, this._callState = new C(this), this._devices = new _(this);
+  }
+  updated(t) {
+    super.updated(t), t.has("call") && (this.call ? (this._callState.connect(this.call), this._devices.connectCall(this.call)) : (this._callState.disconnect(), this._devices.disconnectCall())), t.has("deviceController") && this.deviceController && this._devices.connectDevices(this.deviceController);
+  }
+  disconnectedCallback() {
+    super.disconnectedCallback(), this._callState.disconnect(), this._devices.disconnect();
+  }
+  render() {
+    return p`<slot></slot>`;
+  }
+};
+l.styles = v`:host { display: contents; }`;
+n([
+  a({ attribute: !1 })
+], l.prototype, "call", 2);
+n([
+  a({ attribute: !1 })
+], l.prototype, "deviceController", 2);
+l = n([
+  h("sw-call-provider")
+], l);
+export {
+  l as SwCallProvider
+};
+//# sourceMappingURL=sw-call-provider.js.map

package/dist/components/sw-call-provider.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"sw-call-provider.js","sources":["../../src/components/sw-call-provider.ts"],"sourcesContent":["import { LitElement, html, css } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport type { Call, DeviceController } from '../types/index.js';\nimport { CallStateContextController } from '../context/CallStateContextController.js';\nimport { DevicesContextController } from '../context/DevicesContextController.js';\n\n/**\n * Context provider element that bridges an external `Call` and/or\n * `DeviceController` into Lit context so any descendant web component\n * (sw-call-media, sw-call-controls, sw-participants, etc.) receives live\n * state without manual property wiring.\n *\n * Usage:\n *   ```html\n *   <sw-call-provider id=\"provider\">\n *     <sw-call-media></sw-call-media>\n *     <sw-call-controls></sw-call-controls>\n *   </sw-call-provider>\n *   ```\n *   ```js\n *   provider.call = activeCall;\n *   provider.deviceController = signalWireClient;\n *   ```\n *\n * @prop {Call}             call             - Active call object\n * @prop {DeviceController} deviceController - Device controller for input/output device management\n *\n * @slot - Default slot. Descendants consume the provided contexts.\n */\n@customElement('sw-call-provider')\nexport class SwCallProvider extends LitElement {\n  static styles = css`:host { display: contents; }`;\n\n  @property({ attribute: false }) call: Call | undefined = undefined;\n  @property({ attribute: false }) deviceController: DeviceController | undefined = undefined;\n\n  private _callState = new CallStateContextController(this);\n  private _devices = new DevicesContextController(this);\n\n  protected updated(changed: Map<string, unknown>): void {\n    super.updated(changed);\n\n    if (changed.has('call')) {\n      if (this.call) {\n        this._callState.connect(this.call);\n        this._devices.connectCall(this.call);\n      } else {\n        this._callState.disconnect();\n        this._devices.disconnectCall();\n      }\n    }\n\n    if (changed.has('deviceController') && this.deviceController) {\n      this._devices.connectDevices(this.deviceController);\n    }\n  }\n\n  disconnectedCallback(): void {\n    super.disconnectedCallback();\n    this._callState.disconnect();\n    this._devices.disconnect();\n  }\n\n  render() {\n    return html`<slot></slot>`;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'sw-call-provider': SwCallProvider;\n  }\n}\n"],"names":["SwCallProvider","LitElement","CallStateContextController","DevicesContextController","changed","html","css","__decorateClass","property","customElement"],"mappings":";;;;;;;;;AA8BO,IAAMA,IAAN,cAA6BC,EAAW;AAAA,EAAxC,cAAA;AAAA,UAAA,GAAA,SAAA,GAG2B,KAAA,OAAyB,QACzB,KAAA,mBAAiD,QAEjF,KAAQ,aAAa,IAAIC,EAA2B,IAAI,GACxD,KAAQ,WAAW,IAAIC,EAAyB,IAAI;AAAA,EAAA;AAAA,EAE1C,QAAQC,GAAqC;AACrD,UAAM,QAAQA,CAAO,GAEjBA,EAAQ,IAAI,MAAM,MAChB,KAAK,QACP,KAAK,WAAW,QAAQ,KAAK,IAAI,GACjC,KAAK,SAAS,YAAY,KAAK,IAAI,MAEnC,KAAK,WAAW,WAAA,GAChB,KAAK,SAAS,eAAA,KAIdA,EAAQ,IAAI,kBAAkB,KAAK,KAAK,oBAC1C,KAAK,SAAS,eAAe,KAAK,gBAAgB;AAAA,EAEtD;AAAA,EAEA,uBAA6B;AAC3B,UAAM,qBAAA,GACN,KAAK,WAAW,WAAA,GAChB,KAAK,SAAS,WAAA;AAAA,EAChB;AAAA,EAEA,SAAS;AACP,WAAOC;AAAA,EACT;AACF;AApCaL,EACJ,SAASM;AAEgBC,EAAA;AAAA,EAA/BC,EAAS,EAAE,WAAW,GAAA,CAAO;AAAA,GAHnBR,EAGqB,WAAA,QAAA,CAAA;AACAO,EAAA;AAAA,EAA/BC,EAAS,EAAE,WAAW,GAAA,CAAO;AAAA,GAJnBR,EAIqB,WAAA,oBAAA,CAAA;AAJrBA,IAANO,EAAA;AAAA,EADNE,EAAc,kBAAkB;AAAA,GACpBT,CAAA;"}

package/dist/components/sw-call-status.d.ts

@@ -0,0 +1,50 @@
+/**
+ * Call Status Component
+ *
+ * Displays current call state with status text and duration timer.
+ *
+ * Input precedence (most specific wins): `.call` > context.
+ *
+ * @example
+ * ```html
+ * <!-- Inside a context provider: -->
+ * <sw-call-status></sw-call-status>
+ *
+ * <!-- Standalone with an explicit Call: -->
+ * <sw-call-status .call=${call}></sw-call-status>
+ * ```
+ *
+ * @csspart container   - Outer status container.
+ * @csspart status-text - Text label of the current status.
+ * @csspart duration    - Elapsed-time label (only rendered when connected).
+ */
+import { LitElement } from 'lit';
+import type { Call } from '../types/index.js';
+export declare class SwCallStatus extends LitElement {
+    static styles: import("lit").CSSResult;
+    /** Explicit Call — when set, subscribes directly to its observables and bypasses context. */
+    call?: Call;
+    private _callState?;
+    /** Status from a directly-subscribed `.call` — `null` when context is the source. */
+    private _directStatus;
+    private _callStartTime;
+    private _duration;
+    private _durationInterval;
+    private _prevStatus;
+    private _directSubscriptions;
+    private get _effectiveStatus();
+    protected updated(changed: Map<string, unknown>): void;
+    disconnectedCallback(): void;
+    private _setupDirect;
+    private _teardownDirect;
+    private _startDurationTimer;
+    private _stopDurationTimer;
+    private getStatusText;
+    render(): import("lit-html").TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'sw-call-status': SwCallStatus;
+    }
+}
+//# sourceMappingURL=sw-call-status.d.ts.map

package/dist/components/sw-call-status.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"sw-call-status.d.ts","sourceRoot":"","sources":["../../src/components/sw-call-status.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,OAAO,EAAE,UAAU,EAAa,MAAM,KAAK,CAAC;AAK5C,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,mBAAmB,CAAC;AAG9C,qBACa,YAAa,SAAQ,UAAU;IAC1C,MAAM,CAAC,MAAM,0BA4FT;IAEJ,6FAA6F;IACjE,IAAI,CAAC,EAAE,IAAI,CAAC;IAIxC,OAAO,CAAC,UAAU,CAAC,CAAY;IAE/B,qFAAqF;IAC5E,OAAO,CAAC,aAAa,CAA2B;IAEhD,OAAO,CAAC,cAAc,CAAuB;IAC7C,OAAO,CAAC,SAAS,CAAU;IAEpC,OAAO,CAAC,iBAAiB,CAAuB;IAChD,OAAO,CAAC,WAAW,CAAqB;IACxC,OAAO,CAAC,oBAAoB,CAAsB;IAElD,OAAO,KAAK,gBAAgB,GAE3B;IAED,SAAS,CAAC,OAAO,CAAC,OAAO,EAAE,GAAG,CAAC,MAAM,EAAE,OAAO,CAAC,GAAG,IAAI;IAqBtD,oBAAoB;IAMpB,OAAO,CAAC,YAAY;IAQpB,OAAO,CAAC,eAAe;IAMvB,OAAO,CAAC,mBAAmB;IAiB3B,OAAO,CAAC,kBAAkB;IAS1B,OAAO,CAAC,aAAa;IA8BrB,MAAM;CAgBP;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,gBAAgB,EAAE,YAAY,CAAC;KAChC;CACF"}

package/dist/components/sw-call-status.js

@@ -0,0 +1,203 @@
+import { LitElement as d, html as l, css as p } from "lit";
+import { property as h, state as c, customElement as v } from "lit/decorators.js";
+import { consume as _ } from "@lit/context";
+import { callStateContext as f } from "../context/call-state-context.js";
+var g = Object.defineProperty, m = Object.getOwnPropertyDescriptor, n = (t, e, r, i) => {
+  for (var a = i > 1 ? void 0 : i ? m(e, r) : e, o = t.length - 1, u; o >= 0; o--)
+    (u = t[o]) && (a = (i ? u(e, r, a) : u(a)) || a);
+  return i && a && g(e, r, a), a;
+};
+let s = class extends d {
+  constructor() {
+    super(...arguments), this._directStatus = null, this._callStartTime = null, this._duration = "0:00", this._durationInterval = null, this._prevStatus = "new", this._directSubscriptions = [];
+  }
+  get _effectiveStatus() {
+    var t;
+    return this.call ? this._directStatus ?? "new" : ((t = this._callState) == null ? void 0 : t.status) ?? "new";
+  }
+  updated(t) {
+    if (super.updated(t), t.has("call") && (this._teardownDirect(), this.call && this._setupDirect(this.call)), t.has("call") || t.has("_callState") || t.has("_directStatus")) {
+      const e = this._effectiveStatus;
+      e !== this._prevStatus && (e === "connected" && this._prevStatus !== "connected" ? this._startDurationTimer() : e !== "connected" && this._stopDurationTimer(), this._prevStatus = e);
+    }
+  }
+  disconnectedCallback() {
+    super.disconnectedCallback(), this._stopDurationTimer(), this._teardownDirect();
+  }
+  _setupDirect(t) {
+    this._directSubscriptions.push(
+      t.status$.subscribe((e) => {
+        this._directStatus = e;
+      })
+    );
+  }
+  _teardownDirect() {
+    this._directSubscriptions.forEach((t) => t.unsubscribe()), this._directSubscriptions = [], this._directStatus = null;
+  }
+  _startDurationTimer() {
+    this._callStartTime = Date.now(), this._duration = "0:00", this._durationInterval = window.setInterval(() => {
+      if (this._callStartTime) {
+        const t = Math.floor((Date.now() - this._callStartTime) / 1e3), e = Math.floor(t / 3600), r = Math.floor(t % 3600 / 60), i = t % 60;
+        this._duration = e > 0 ? `${e}:${r.toString().padStart(2, "0")}:${i.toString().padStart(2, "0")}` : `${r}:${i.toString().padStart(2, "0")}`;
+      }
+    }, 1e3);
+  }
+  _stopDurationTimer() {
+    this._durationInterval && (clearInterval(this._durationInterval), this._durationInterval = null), this._callStartTime = null, this._duration = "0:00";
+  }
+  getStatusText() {
+    const t = this._effectiveStatus;
+    switch (t) {
+      case "new":
+        return "Ready";
+      case "trying":
+        return "Trying...";
+      case "connecting":
+        return "Connecting...";
+      case "ringing":
+        return "Ringing...";
+      case "connected":
+        return "Connected";
+      case "recovering":
+        return "Reconnecting...";
+      case "disconnecting":
+        return "Disconnecting...";
+      case "disconnected":
+        return "Disconnected";
+      case "failed":
+        return "Failed";
+      case "destroyed":
+        return "Ended";
+      default:
+        return String(t);
+    }
+  }
+  render() {
+    const t = this._effectiveStatus, e = this.getStatusText();
+    return l`
+      <div class="container" part="container">
+        <span class="status-indicator ${t}" aria-hidden="true"></span>
+        <span class="status-text ${t}" part="status-text" role="status" aria-live="polite">
+          ${e}
+        </span>
+        ${t === "connected" ? l`<span class="duration" part="duration">${this._duration}</span>` : null}
+      </div>
+    `;
+  }
+};
+s.styles = p`
+      :host {
+        display: inline-flex;
+        align-items: center;
+        gap: 8px;
+        font-family: var(--type-family-body);
+        font-size: var(--type-size-small);
+      }
+
+      .container {
+        display: inline-flex;
+        align-items: center;
+        gap: 8px;
+        padding: 8px 12px;
+        border-radius: var(--radius-md);
+        color: var(--fg-default);
+      }
+
+      .status-indicator {
+        width: 10px;
+        height: 10px;
+        border-radius: 50%;
+        flex-shrink: 0;
+      }
+
+      .status-indicator.new {
+        background-color: var(--bg-surface-raised);
+      }
+      .status-indicator.connecting,
+      .status-indicator.ringing,
+      .status-indicator.trying,
+      .status-indicator.recovering {
+        background-color: var(--interactive-status-warning);
+        animation: pulse 1.5s ease-in-out infinite;
+      }
+      .status-indicator.connected {
+        background-color: var(--interactive-status-success);
+      }
+      .status-indicator.disconnecting {
+        background-color: var(--interactive-button-destructive-bg);
+        animation: pulse 1s ease-in-out infinite;
+      }
+      .status-indicator.disconnected,
+      .status-indicator.failed {
+        background-color: var(--interactive-button-destructive-bg);
+      }
+      .status-indicator.destroyed {
+        background-color: var(--bg-surface-raised);
+      }
+
+      @keyframes pulse {
+        0%,
+        100% {
+          opacity: 1;
+          transform: scale(1);
+        }
+        50% {
+          opacity: 0.5;
+          transform: scale(1.1);
+        }
+      }
+
+      .status-text {
+        font-weight: 500;
+        white-space: nowrap;
+      }
+      .status-text.trying,
+      .status-text.connecting,
+      .status-text.ringing,
+      .status-text.recovering {
+        color: var(--interactive-status-warning);
+      }
+      .status-text.disconnecting {
+        color: var(--interactive-button-destructive-bg);
+      }
+      .status-text.connected {
+        color: var(--interactive-status-success);
+      }
+      .status-text.disconnected,
+      .status-text.failed {
+        color: var(--interactive-button-destructive-bg);
+      }
+      .status-text.new,
+      .status-text.destroyed {
+        color: var(--bg-surface-raised);
+      }
+
+      .duration {
+        font-variant-numeric: tabular-nums;
+        opacity: 0.6;
+        font-size: 0.85em;
+      }
+    `;
+n([
+  h({ type: Object })
+], s.prototype, "call", 2);
+n([
+  _({ context: f, subscribe: !0 }),
+  c()
+], s.prototype, "_callState", 2);
+n([
+  c()
+], s.prototype, "_directStatus", 2);
+n([
+  c()
+], s.prototype, "_callStartTime", 2);
+n([
+  c()
+], s.prototype, "_duration", 2);
+s = n([
+  v("sw-call-status")
+], s);
+export {
+  s as SwCallStatus
+};
+//# sourceMappingURL=sw-call-status.js.map

package/dist/components/sw-call-status.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"sw-call-status.js","sources":["../../src/components/sw-call-status.ts"],"sourcesContent":["/**\n * Call Status Component\n *\n * Displays current call state with status text and duration timer.\n *\n * Input precedence (most specific wins): `.call` > context.\n *\n * @example\n * ```html\n * <!-- Inside a context provider: -->\n * <sw-call-status></sw-call-status>\n *\n * <!-- Standalone with an explicit Call: -->\n * <sw-call-status .call=${call}></sw-call-status>\n * ```\n *\n * @csspart container   - Outer status container.\n * @csspart status-text - Text label of the current status.\n * @csspart duration    - Elapsed-time label (only rendered when connected).\n */\n\nimport { LitElement, html, css } from 'lit';\nimport { customElement, property, state } from 'lit/decorators.js';\nimport { consume } from '@lit/context';\nimport { Subscription } from 'rxjs';\nimport type { CallStatus } from '@signalwire/js';\nimport type { Call } from '../types/index.js';\nimport { callStateContext, type CallState } from '../context/call-state-context.js';\n\n@customElement('sw-call-status')\nexport class SwCallStatus extends LitElement {\n  static styles = css`\n      :host {\n        display: inline-flex;\n        align-items: center;\n        gap: 8px;\n        font-family: var(--type-family-body);\n        font-size: var(--type-size-small);\n      }\n\n      .container {\n        display: inline-flex;\n        align-items: center;\n        gap: 8px;\n        padding: 8px 12px;\n        border-radius: var(--radius-md);\n        color: var(--fg-default);\n      }\n\n      .status-indicator {\n        width: 10px;\n        height: 10px;\n        border-radius: 50%;\n        flex-shrink: 0;\n      }\n\n      .status-indicator.new {\n        background-color: var(--bg-surface-raised);\n      }\n      .status-indicator.connecting,\n      .status-indicator.ringing,\n      .status-indicator.trying,\n      .status-indicator.recovering {\n        background-color: var(--interactive-status-warning);\n        animation: pulse 1.5s ease-in-out infinite;\n      }\n      .status-indicator.connected {\n        background-color: var(--interactive-status-success);\n      }\n      .status-indicator.disconnecting {\n        background-color: var(--interactive-button-destructive-bg);\n        animation: pulse 1s ease-in-out infinite;\n      }\n      .status-indicator.disconnected,\n      .status-indicator.failed {\n        background-color: var(--interactive-button-destructive-bg);\n      }\n      .status-indicator.destroyed {\n        background-color: var(--bg-surface-raised);\n      }\n\n      @keyframes pulse {\n        0%,\n        100% {\n          opacity: 1;\n          transform: scale(1);\n        }\n        50% {\n          opacity: 0.5;\n          transform: scale(1.1);\n        }\n      }\n\n      .status-text {\n        font-weight: 500;\n        white-space: nowrap;\n      }\n      .status-text.trying,\n      .status-text.connecting,\n      .status-text.ringing,\n      .status-text.recovering {\n        color: var(--interactive-status-warning);\n      }\n      .status-text.disconnecting {\n        color: var(--interactive-button-destructive-bg);\n      }\n      .status-text.connected {\n        color: var(--interactive-status-success);\n      }\n      .status-text.disconnected,\n      .status-text.failed {\n        color: var(--interactive-button-destructive-bg);\n      }\n      .status-text.new,\n      .status-text.destroyed {\n        color: var(--bg-surface-raised);\n      }\n\n      .duration {\n        font-variant-numeric: tabular-nums;\n        opacity: 0.6;\n        font-size: 0.85em;\n      }\n    `;\n\n  /** Explicit Call — when set, subscribes directly to its observables and bypasses context. */\n  @property({ type: Object }) call?: Call;\n\n  @consume({ context: callStateContext, subscribe: true })\n  @state()\n  private _callState?: CallState;\n\n  /** Status from a directly-subscribed `.call` — `null` when context is the source. */\n  @state() private _directStatus: CallStatus | null = null;\n\n  @state() private _callStartTime: number | null = null;\n  @state() private _duration = '0:00';\n\n  private _durationInterval: number | null = null;\n  private _prevStatus: CallStatus = 'new';\n  private _directSubscriptions: Subscription[] = [];\n\n  private get _effectiveStatus(): CallStatus {\n    return this.call ? this._directStatus ?? 'new' : this._callState?.status ?? 'new';\n  }\n\n  protected updated(changed: Map<string, unknown>): void {\n    super.updated(changed);\n\n    if (changed.has('call')) {\n      this._teardownDirect();\n      if (this.call) this._setupDirect(this.call);\n    }\n\n    if (changed.has('call') || changed.has('_callState') || changed.has('_directStatus')) {\n      const status = this._effectiveStatus;\n      if (status !== this._prevStatus) {\n        if (status === 'connected' && this._prevStatus !== 'connected') {\n          this._startDurationTimer();\n        } else if (status !== 'connected') {\n          this._stopDurationTimer();\n        }\n        this._prevStatus = status;\n      }\n    }\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback();\n    this._stopDurationTimer();\n    this._teardownDirect();\n  }\n\n  private _setupDirect(call: Call): void {\n    this._directSubscriptions.push(\n      call.status$.subscribe((s) => {\n        this._directStatus = s;\n      })\n    );\n  }\n\n  private _teardownDirect(): void {\n    this._directSubscriptions.forEach((s) => s.unsubscribe());\n    this._directSubscriptions = [];\n    this._directStatus = null;\n  }\n\n  private _startDurationTimer(): void {\n    this._callStartTime = Date.now();\n    this._duration = '0:00';\n    this._durationInterval = window.setInterval(() => {\n      if (this._callStartTime) {\n        const elapsed = Math.floor((Date.now() - this._callStartTime) / 1000);\n        const hours = Math.floor(elapsed / 3600);\n        const minutes = Math.floor((elapsed % 3600) / 60);\n        const secs = elapsed % 60;\n        this._duration =\n          hours > 0\n            ? `${hours}:${minutes.toString().padStart(2, '0')}:${secs.toString().padStart(2, '0')}`\n            : `${minutes}:${secs.toString().padStart(2, '0')}`;\n      }\n    }, 1000);\n  }\n\n  private _stopDurationTimer(): void {\n    if (this._durationInterval) {\n      clearInterval(this._durationInterval);\n      this._durationInterval = null;\n    }\n    this._callStartTime = null;\n    this._duration = '0:00';\n  }\n\n  private getStatusText(): string {\n    const status = this._effectiveStatus;\n    switch (status) {\n      case 'new':\n        return 'Ready';\n      case 'trying':\n        return 'Trying...';\n      case 'connecting':\n        return 'Connecting...';\n      case 'ringing':\n        return 'Ringing...';\n      case 'connected':\n        return 'Connected';\n      case 'recovering':\n        return 'Reconnecting...';\n      case 'disconnecting':\n        return 'Disconnecting...';\n      case 'disconnected':\n        return 'Disconnected';\n      case 'failed':\n        return 'Failed';\n      case 'destroyed':\n        return 'Ended';\n      default: {\n        const _exhaustive: never = status;\n        return String(_exhaustive);\n      }\n    }\n  }\n\n  render() {\n    const status = this._effectiveStatus;\n    const statusText = this.getStatusText();\n\n    return html`\n      <div class=\"container\" part=\"container\">\n        <span class=\"status-indicator ${status}\" aria-hidden=\"true\"></span>\n        <span class=\"status-text ${status}\" part=\"status-text\" role=\"status\" aria-live=\"polite\">\n          ${statusText}\n        </span>\n        ${status === 'connected'\n          ? html`<span class=\"duration\" part=\"duration\">${this._duration}</span>`\n          : null}\n      </div>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'sw-call-status': SwCallStatus;\n  }\n}\n"],"names":["SwCallStatus","LitElement","_a","changed","status","call","s","elapsed","hours","minutes","secs","statusText","html","css","__decorateClass","property","consume","callStateContext","state","customElement"],"mappings":";;;;;;;;;AA8BO,IAAMA,IAAN,cAA2BC,EAAW;AAAA,EAAtC,cAAA;AAAA,UAAA,GAAA,SAAA,GAuGI,KAAQ,gBAAmC,MAE3C,KAAQ,iBAAgC,MACxC,KAAQ,YAAY,QAE7B,KAAQ,oBAAmC,MAC3C,KAAQ,cAA0B,OAClC,KAAQ,uBAAuC,CAAA;AAAA,EAAC;AAAA,EAEhD,IAAY,mBAA+B;;AACzC,WAAO,KAAK,OAAO,KAAK,iBAAiB,UAAQC,IAAA,KAAK,eAAL,gBAAAA,EAAiB,WAAU;AAAA,EAC9E;AAAA,EAEU,QAAQC,GAAqC;AAQrD,QAPA,MAAM,QAAQA,CAAO,GAEjBA,EAAQ,IAAI,MAAM,MACpB,KAAK,gBAAA,GACD,KAAK,QAAM,KAAK,aAAa,KAAK,IAAI,IAGxCA,EAAQ,IAAI,MAAM,KAAKA,EAAQ,IAAI,YAAY,KAAKA,EAAQ,IAAI,eAAe,GAAG;AACpF,YAAMC,IAAS,KAAK;AACpB,MAAIA,MAAW,KAAK,gBACdA,MAAW,eAAe,KAAK,gBAAgB,cACjD,KAAK,oBAAA,IACIA,MAAW,eACpB,KAAK,mBAAA,GAEP,KAAK,cAAcA;AAAA,IAEvB;AAAA,EACF;AAAA,EAEA,uBAAuB;AACrB,UAAM,qBAAA,GACN,KAAK,mBAAA,GACL,KAAK,gBAAA;AAAA,EACP;AAAA,EAEQ,aAAaC,GAAkB;AACrC,SAAK,qBAAqB;AAAA,MACxBA,EAAK,QAAQ,UAAU,CAACC,MAAM;AAC5B,aAAK,gBAAgBA;AAAA,MACvB,CAAC;AAAA,IAAA;AAAA,EAEL;AAAA,EAEQ,kBAAwB;AAC9B,SAAK,qBAAqB,QAAQ,CAACA,MAAMA,EAAE,aAAa,GACxD,KAAK,uBAAuB,CAAA,GAC5B,KAAK,gBAAgB;AAAA,EACvB;AAAA,EAEQ,sBAA4B;AAClC,SAAK,iBAAiB,KAAK,IAAA,GAC3B,KAAK,YAAY,QACjB,KAAK,oBAAoB,OAAO,YAAY,MAAM;AAChD,UAAI,KAAK,gBAAgB;AACvB,cAAMC,IAAU,KAAK,OAAO,KAAK,QAAQ,KAAK,kBAAkB,GAAI,GAC9DC,IAAQ,KAAK,MAAMD,IAAU,IAAI,GACjCE,IAAU,KAAK,MAAOF,IAAU,OAAQ,EAAE,GAC1CG,IAAOH,IAAU;AACvB,aAAK,YACHC,IAAQ,IACJ,GAAGA,CAAK,IAAIC,EAAQ,SAAA,EAAW,SAAS,GAAG,GAAG,CAAC,IAAIC,EAAK,SAAA,EAAW,SAAS,GAAG,GAAG,CAAC,KACnF,GAAGD,CAAO,IAAIC,EAAK,SAAA,EAAW,SAAS,GAAG,GAAG,CAAC;AAAA,MACtD;AAAA,IACF,GAAG,GAAI;AAAA,EACT;AAAA,EAEQ,qBAA2B;AACjC,IAAI,KAAK,sBACP,cAAc,KAAK,iBAAiB,GACpC,KAAK,oBAAoB,OAE3B,KAAK,iBAAiB,MACtB,KAAK,YAAY;AAAA,EACnB;AAAA,EAEQ,gBAAwB;AAC9B,UAAMN,IAAS,KAAK;AACpB,YAAQA,GAAA;AAAA,MACN,KAAK;AACH,eAAO;AAAA,MACT,KAAK;AACH,eAAO;AAAA,MACT,KAAK;AACH,eAAO;AAAA,MACT,KAAK;AACH,eAAO;AAAA,MACT,KAAK;AACH,eAAO;AAAA,MACT,KAAK;AACH,eAAO;AAAA,MACT,KAAK;AACH,eAAO;AAAA,MACT,KAAK;AACH,eAAO;AAAA,MACT,KAAK;AACH,eAAO;AAAA,MACT,KAAK;AACH,eAAO;AAAA,MACT;AAEE,eAAO,OADoBA,CACF;AAAA,IAC3B;AAAA,EAEJ;AAAA,EAEA,SAAS;AACP,UAAMA,IAAS,KAAK,kBACdO,IAAa,KAAK,cAAA;AAExB,WAAOC;AAAA;AAAA,wCAE6BR,CAAM;AAAA,mCACXA,CAAM;AAAA,YAC7BO,CAAU;AAAA;AAAA,UAEZP,MAAW,cACTQ,2CAA8C,KAAK,SAAS,YAC5D,IAAI;AAAA;AAAA;AAAA,EAGd;AACF;AArOaZ,EACJ,SAASa;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;AA+FYC,EAAA;AAAA,EAA3BC,EAAS,EAAE,MAAM,OAAA,CAAQ;AAAA,GAhGff,EAgGiB,WAAA,QAAA,CAAA;AAIpBc,EAAA;AAAA,EAFPE,EAAQ,EAAE,SAASC,GAAkB,WAAW,IAAM;AAAA,EACtDC,EAAA;AAAM,GAnGIlB,EAoGH,WAAA,cAAA,CAAA;AAGSc,EAAA;AAAA,EAAhBI,EAAA;AAAM,GAvGIlB,EAuGM,WAAA,iBAAA,CAAA;AAEAc,EAAA;AAAA,EAAhBI,EAAA;AAAM,GAzGIlB,EAyGM,WAAA,kBAAA,CAAA;AACAc,EAAA;AAAA,EAAhBI,EAAA;AAAM,GA1GIlB,EA0GM,WAAA,aAAA,CAAA;AA1GNA,IAANc,EAAA;AAAA,EADNK,EAAc,gBAAgB;AAAA,GAClBnB,CAAA;"}

package/dist/components/sw-call-widget/client-factory.d.ts

@@ -0,0 +1,6 @@
+import { StaticCredentialProvider, EmbedTokenCredentialProvider } from '@signalwire/js';
+export declare const DEFAULT_EMBED_HOST = "embeds.signalwire.com";
+export declare function normalizeHost(h: string): string;
+export declare function isEmbedToken(t: string): boolean;
+export declare function buildCredentialProvider(token: string, host: string): EmbedTokenCredentialProvider | StaticCredentialProvider;
+//# sourceMappingURL=client-factory.d.ts.map

package/dist/components/sw-call-widget/client-factory.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"client-factory.d.ts","sourceRoot":"","sources":["../../../src/components/sw-call-widget/client-factory.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,wBAAwB,EACxB,4BAA4B,EAC7B,MAAM,gBAAgB,CAAC;AAGxB,eAAO,MAAM,kBAAkB,0BAA0B,CAAC;AAE1D,wBAAgB,aAAa,CAAC,CAAC,EAAE,MAAM,GAAG,MAAM,CAO/C;AAED,wBAAgB,YAAY,CAAC,CAAC,EAAE,MAAM,GAAG,OAAO,CAE/C;AAED,wBAAgB,uBAAuB,CAAC,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,2DAQlE"}

package/dist/components/sw-call-widget/client-factory.js

@@ -0,0 +1,25 @@
+import { EmbedTokenCredentialProvider as t, StaticCredentialProvider as n } from "@signalwire/js";
+const i = ["c2c_", "c2t_"], o = "embeds.signalwire.com";
+function c(r) {
+  try {
+    return new URL(r.includes("://") ? r : `https://${r}`).hostname;
+  } catch {
+    return r;
+  }
+}
+function s(r) {
+  return i.some((e) => r.startsWith(e));
+}
+function d(r, e) {
+  return s(r) ? new t(
+    c(e || o),
+    r
+  ) : new n({ token: r });
+}
+export {
+  o as DEFAULT_EMBED_HOST,
+  d as buildCredentialProvider,
+  s as isEmbedToken,
+  c as normalizeHost
+};
+//# sourceMappingURL=client-factory.js.map

package/dist/components/sw-call-widget/client-factory.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"client-factory.js","sources":["../../../src/components/sw-call-widget/client-factory.ts"],"sourcesContent":["import {\n  StaticCredentialProvider,\n  EmbedTokenCredentialProvider,\n} from '@signalwire/js';\n\nconst EMBED_TOKEN_PREFIXES = ['c2c_', 'c2t_'] as const;\nexport const DEFAULT_EMBED_HOST = 'embeds.signalwire.com';\n\nexport function normalizeHost(h: string): string {\n  try {\n    const url = new URL(h.includes('://') ? h : `https://${h}`);\n    return url.hostname;\n  } catch {\n    return h;\n  }\n}\n\nexport function isEmbedToken(t: string): boolean {\n  return EMBED_TOKEN_PREFIXES.some((p) => t.startsWith(p));\n}\n\nexport function buildCredentialProvider(token: string, host: string) {\n  if (isEmbedToken(token)) {\n    return new EmbedTokenCredentialProvider(\n      normalizeHost(host || DEFAULT_EMBED_HOST),\n      token,\n    );\n  }\n  return new StaticCredentialProvider({ token });\n}\n"],"names":["EMBED_TOKEN_PREFIXES","DEFAULT_EMBED_HOST","normalizeHost","h","isEmbedToken","t","p","buildCredentialProvider","token","host","EmbedTokenCredentialProvider","StaticCredentialProvider"],"mappings":";AAKA,MAAMA,IAAuB,CAAC,QAAQ,MAAM,GAC/BC,IAAqB;AAE3B,SAASC,EAAcC,GAAmB;AAC/C,MAAI;AAEF,WADY,IAAI,IAAIA,EAAE,SAAS,KAAK,IAAIA,IAAI,WAAWA,CAAC,EAAE,EAC/C;AAAA,EACb,QAAQ;AACN,WAAOA;AAAA,EACT;AACF;AAEO,SAASC,EAAaC,GAAoB;AAC/C,SAAOL,EAAqB,KAAK,CAACM,MAAMD,EAAE,WAAWC,CAAC,CAAC;AACzD;AAEO,SAASC,EAAwBC,GAAeC,GAAc;AACnE,SAAIL,EAAaI,CAAK,IACb,IAAIE;AAAA,IACTR,EAAcO,KAAQR,CAAkB;AAAA,IACxCO;AAAA,EAAA,IAGG,IAAIG,EAAyB,EAAE,OAAAH,GAAO;AAC/C;"}

package/dist/components/sw-call-widget/sw-call-widget.d.ts

@@ -0,0 +1,110 @@
+import { LitElement } from 'lit';
+import '../sw-call-media.js';
+import '../sw-local-camera.js';
+import '../sw-call-controls.js';
+import '../UI/layout/sw-ui-call-layout.js';
+import '../UI/layout/sw-ui-responsive-container.js';
+import '../UI/layout/sw-ui-modal.js';
+import '../UI/layout/sw-ui-background.js';
+import '../UI/layout/sw-ui-content-drawer.js';
+import '../UI/sw-ui-transcript-view.js';
+/**
+ * All-in-one call widget. Handles client initialisation, dialling, media,
+ * controls and optional AI transcript — in either inline or modal modes.
+ *
+ * Composes `sw-ui-call-layout`, `sw-call-media`, `sw-local-camera`,
+ * `sw-call-controls`, and `sw-ui-transcript-view` under the hood.
+ * All child components are wired via Lit context — no manual plumbing needed.
+ *
+ * @prop {string}  token         - SignalWire SAT or embed token
+ * @prop {string}  host          - Optional server host
+ * @prop {string}  destination   - Call destination (address or resource)
+ * @prop {boolean} modal         - Render in a `<sw-ui-modal>` overlay
+ * @prop {boolean} transcription - Show AI transcript panel
+ *
+ * @slot background - Background element (e.g. `<sw-ui-background default>`)
+ * @slot (default)  - Trigger element (click to dial, shown when idle)
+ *
+ * @fires sw-dial                  - When `dial()` is invoked. Detail: `{ destination }`.
+ * @fires sw-call-ended            - When the call reaches a terminal state (user hangup, remote disconnect, or failure). Detail: `{ status }`.
+ * @fires sw-display-content       - From `display_content` user event. Detail: `DisplayContentPayload`.
+ * @fires signalwire-address:event - Forwarded SignalWire custom user events.
+ *
+ * All inner events bubble.
+ *
+ * @method dial()   - Initiate call
+ * @method hangup() - End active call
+ */
+export declare class SwCallWidget extends LitElement {
+    static styles: import("lit").CSSResult;
+    token: string;
+    host: string;
+    destination: string;
+    modal: boolean;
+    transcription: boolean;
+    allowIncomingCalls: boolean;
+    audioOnly: boolean;
+    /**
+     * Custom variables sent with the Verto invite as a JSON object.
+     *
+     * The widget always advertises `capabilities.display_content` and
+     * `metadata.widget.opened_at` so the agent can detect that the caller
+     * supports the content drawer; user-supplied keys are merged in and win
+     * on shallow conflict.
+     *
+     * Invalid JSON is logged and ignored — the call still dials.
+     *
+     * @example
+     *   <sw-call-widget user-variables='{"customer_id": "abc-123"}'></sw-call-widget>
+     */
+    userVariables: string;
+    /**
+     * Skip auto-injecting the SignalWire `theme.css` design-token stylesheet.
+     * Set this when the host page already loads `@signalwire/web-components/theme.css`
+     * or a custom theme written against the same DTCG token names.
+     */
+    disableAutoTheme: boolean;
+    /**
+     * Skip auto-loading the SignalWire brand fonts (Lexend, Instrument Sans,
+     * JetBrains Mono) from Google Fonts. Set this when fonts are self-hosted
+     * or loaded elsewhere.
+     */
+    disableAutoFonts: boolean;
+    private _call;
+    private _connecting;
+    private _hasLayoutLayers;
+    private _drawer;
+    private _callState;
+    private _devices;
+    private _transcript;
+    private _userEventCtrl;
+    private _incomingCalls;
+    private _client;
+    private _subs;
+    private _pendingIncoming;
+    connectedCallback(): void;
+    protected updated(changed: Map<string, unknown>): void;
+    disconnectedCallback(): void;
+    private _destroyClient;
+    private _refreshClient;
+    dial(): Promise<void>;
+    hangup(): Promise<void>;
+    private _connectIncomingCalls;
+    private _handleIncomingCall;
+    private _wireCall;
+    private _onDisplayContent;
+    private _onDrawerClose;
+    private _unwireCall;
+    private _onSlotChange;
+    private _onHangUp;
+    private _onModalClose;
+    private _onFullscreenToggle;
+    private _onTranscriptToggle;
+    render(): import("lit-html").TemplateResult;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'sw-call-widget': SwCallWidget;
+    }
+}
+//# sourceMappingURL=sw-call-widget.d.ts.map

package/dist/components/sw-call-widget/sw-call-widget.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"sw-call-widget.d.ts","sourceRoot":"","sources":["../../../src/components/sw-call-widget/sw-call-widget.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAiB,MAAM,KAAK,CAAC;AAchD,OAAO,qBAAqB,CAAC;AAC7B,OAAO,uBAAuB,CAAC;AAC/B,OAAO,wBAAwB,CAAC;AAChC,OAAO,mCAAmC,CAAC;AAC3C,OAAO,4CAA4C,CAAC;AACpD,OAAO,6BAA6B,CAAC;AACrC,OAAO,kCAAkC,CAAC;AAC1C,OAAO,sCAAsC,CAAC;AAC9C,OAAO,gCAAgC,CAAC;AAiBxC;;;;;;;;;;;;;;;;;;;;;;;;;;GA0BG;AACH,qBACa,YAAa,SAAQ,UAAU;IAC1C,MAAM,CAAC,MAAM,0BAAgB;IAID,KAAK,SAAM;IACX,IAAI,SAAM;IACV,WAAW,SAAM;IACD,KAAK,UAAS;IACd,aAAa,UAAS;IACa,kBAAkB,UAAS;IACrC,SAAS,UAAS;IAEvF;;;;;;;;;;;;OAYG;IACsD,aAAa,SAAM;IAE5E;;;;OAIG;IAC0E,gBAAgB,UAAS;IAEtG;;;;OAIG;IAC0E,gBAAgB,UAAS;IAI7F,OAAO,CAAC,KAAK,CAAqB;IAClC,OAAO,CAAC,WAAW,CAAS;IAC5B,OAAO,CAAC,gBAAgB,CAAS;IACjC,OAAO,CAAC,OAAO,CAAsC;IAI9D,OAAO,CAAC,UAAU,CAAwC;IAC1D,OAAO,CAAC,QAAQ,CAAsC;IACtD,OAAO,CAAC,WAAW,CAAwD;IAC3E,OAAO,CAAC,cAAc,CAAiC;IACvD,OAAO,CAAC,cAAc,CAAoC;IAI1D,OAAO,CAAC,OAAO,CAA2B;IAC1C,OAAO,CAAC,KAAK,CAAsB;IACnC,OAAO,CAAC,gBAAgB,CAAS;IAIjC,iBAAiB,IAAI,IAAI;IAMzB,SAAS,CAAC,OAAO,CAAC,OAAO,EAAE,GAAG,CAAC,MAAM,EAAE,OAAO,CAAC,GAAG,IAAI;IAsBtD,oBAAoB,IAAI,IAAI;IAO5B,OAAO,CAAC,cAAc;IAwBtB,OAAO,CAAC,cAAc;IAoBhB,IAAI,IAAI,OAAO,CAAC,IAAI,CAAC;IAoDrB,MAAM,IAAI,OAAO,CAAC,IAAI,CAAC;IAQ7B,OAAO,CAAC,qBAAqB;IAc7B,OAAO,CAAC,mBAAmB,CAyBzB;IAIF,OAAO,CAAC,SAAS;IAoCjB,OAAO,CAAC,iBAAiB,CASvB;IAEF,OAAO,CAAC,cAAc,CAEpB;IAEF,OAAO,CAAC,WAAW;IA6BnB,OAAO,CAAC,aAAa;IAWrB,OAAO,CAAC,SAAS;IAIjB,OAAO,CAAC,aAAa,CAYnB;IAEF,OAAO,CAAC,mBAAmB;IAO3B,OAAO,CAAC,mBAAmB;IAM3B,MAAM;CAgCP;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,gBAAgB,EAAE,YAAY,CAAC;KAChC;CACF"}