@aceshooting/lyra-ui 2.1.0 → 2.3.0

package/dist/components/attachment-chip/attachment-chip.js

@@ -1,356 +1,5 @@
-var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
-    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-    return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
-import { html, nothing, svg } from 'lit';
-import { property } from 'lit/decorators.js';
-import { LyraElement } from '../../internal/lyra-element.js';
+export * from './attachment-chip.class.js';
+import { LyraAttachmentChip } from './attachment-chip.class.js';
 import { defineElement } from '../../internal/prefix.js';
-import { nextId } from '../../internal/a11y.js';
-import { closeIcon } from '../../internal/icons.js';
-import { styles } from './attachment-chip.styles.js';
-// Mirrors the shared icon set's viewBox/stroke conventions
-// (internal/icons.ts's chevronIcon()/closeIcon()/etc.) without adding a
-// generic-file glyph to that module -- it's off limits here -- so this one-off
-// icon still reads as part of the same visual language as the rest of the
-// library's inline icons. `closeIcon()` itself already exists there and is
-// imported directly rather than duplicated (see `<lyra-toast-item>`'s /
-// `<lyra-widget>`'s identical import for the same remove/dismiss glyph).
-const ICON_VIEW_BOX = '0 0 24 24';
-const ICON_STROKE_WIDTH = '1.75';
-/** A generic "document" glyph, used as the thumbnail for any non-image file. */
-function fileGlyph() {
-    return svg `
-    <svg
-      width="1em"
-      height="1em"
-      viewBox=${ICON_VIEW_BOX}
-      fill="none"
-      stroke="currentColor"
-      stroke-width=${ICON_STROKE_WIDTH}
-      stroke-linecap="round"
-      stroke-linejoin="round"
-      aria-hidden="true"
-      focusable="false"
-    ><path d="M6 2h8l6 6v12a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2Z"></path><polyline points="14 2 14 8 20 8"></polyline></svg>
-  `;
-}
-// Same shape as `<lyra-chat-message>`'s local `retryIcon()` -- duplicated
-// rather than imported (these are two independent, separately-consumable
-// components) but kept visually identical so a retry affordance reads the
-// same wherever it shows up in the library.
-function retryIcon() {
-    return svg `
-    <svg
-      width="1em"
-      height="1em"
-      viewBox=${ICON_VIEW_BOX}
-      fill="none"
-      stroke="currentColor"
-      stroke-width=${ICON_STROKE_WIDTH}
-      stroke-linecap="round"
-      stroke-linejoin="round"
-      aria-hidden="true"
-      focusable="false"
-    ><polyline points="1 4 1 10 7 10"></polyline><path d="M3.51 15a9 9 0 1 0 2.13-9.36L1 10"></path></svg>
-  `;
-}
-const BYTE_UNITS = ['B', 'KB', 'MB', 'GB', 'TB'];
-/**
- * `512` -> `"512 B"`; `2415919` -> `"2.3 MB"`. Whole bytes never get a
- * decimal (there's no meaningful fraction of a byte); every unit past that
- * gets exactly one decimal place. Returns `""` for a negative/non-finite
- * input so a missing/unknown size renders nothing instead of `"NaN B"`.
- */
-export function formatFileSize(bytes) {
-    if (!Number.isFinite(bytes) || bytes < 0)
-        return '';
-    if (bytes < 1024)
-        return `${Math.round(bytes)} B`;
-    let value = bytes;
-    let unitIndex = 0;
-    while (value >= 1024 && unitIndex < BYTE_UNITS.length - 1) {
-        value /= 1024;
-        unitIndex++;
-    }
-    return `${value.toFixed(1)} ${BYTE_UNITS[unitIndex]}`;
-}
-/** Visible (not just color-coded) text for every non-resting status --
- *  `'pending'`/`'done'` render nothing here, they're resting states.
- *  `clampedProgress` (not the raw `progress`) is what gets displayed, so the
- *  percentage shown here can never drift from the progressbar's own
- *  `aria-valuenow`/fill-width, which reads from the same clamped value.
- *  `uploadingLabel`/`uploadFailedLabel` are the host's (possibly overridden)
- *  verb/phrase -- defaulting to `'Uploading'`/`'Upload failed'` reproduces
- *  today's exact hardcoded text byte-for-byte. */
-function statusText(status, progress, clampedProgress, uploadingLabel, uploadFailedLabel) {
-    if (status === 'error')
-        return uploadFailedLabel;
-    if (status === 'uploading') {
-        return Number.isFinite(progress) && progress > 0
-            ? `${uploadingLabel} ${Math.round(clampedProgress)}%`
-            : `${uploadingLabel}…`;
-    }
-    return '';
-}
-/**
- * `<lyra-attachment-chip>` — a compact chip representing one file queued for
- * (or already part of) a chat message: a composer's pre-send attachment
- * tray, or a sent message's `attachments` slot (see `<lyra-chat-message>`).
- *
- * Two independent ways to populate it, matching the two points in a message's
- * lifecycle this is used at:
- *  - Set `file` to a real `File` (fresh from a picker/drop) — `name`, `size`,
- *    `mime-type` and the image thumbnail are all auto-derived from it.
- *  - Set the plain `name`/`size`/`mime-type`/`thumbnail-src` props instead,
- *    for reconstructing a chip from server-persisted attachment metadata
- *    (e.g. after a page reload, when no real `File` object exists any more).
- *
- * `file` always wins when both are present — see each accessor's own doc.
- * The image thumbnail for a real `File` is a cached `URL.createObjectURL()`
- * blob URL, created in the update lifecycle immediately before the thumbnail
- * renders and revoked automatically once `file`
- * changes away from the object it was created for, and on disconnect — this
- * component never leaks a blob URL.
- *
- * Identifying *which* attachment a `lyra-remove`/`lyra-retry` event is about:
- * this deliberately reuses the platform's own `id`/`id` attribute (every
- * element already has one; there's no need to shadow it with a second,
- * differently-named Lit property, unlike e.g. `<lyra-tool-call-chip>`'s
- * `call-id` which identifies a *call*, a concept distinct from the chip
- * element itself). Set `id="..."` when you have a stable server-side
- * attachment id. When `id` is left unset and `file` is set, a stable id is
- * derived from `` `${file.name}:${file.size}:${file.lastModified}` `` — stable
- * across re-renders of the *same* `File` object without requiring the
- * consumer to invent one. When neither is available, a generated internal id
- * is used as a last resort so the event always has *some* id.
- *
- * i18n/locale: every translatable word rendered by this component is
- * override-able via a dedicated property — `removeLabel`/`retryLabel`
- * (the verb prefixed to the remove/retry buttons' `aria-label`, keeping the
- * `displayName` interpolation), and `uploadingLabel`/`uploadFailedLabel` (the
- * verb/phrase used in the visible `status-text`, keeping the live percentage
- * interpolation for `uploadingLabel`). All four default to today's exact
- * hardcoded English text (`'Remove'`, `'Retry'`, `'Uploading'`, `'Upload
- * failed'`), so leaving them unset changes nothing. These are plain
- * properties, not slots — this component still exposes no slots.
- *
- * @customElement lyra-attachment-chip
- * @event lyra-remove - The user activated the remove (×) button. `detail: { id }`. Only rendered while `removable`.
- * @event lyra-retry - The user activated the retry button. `detail: { id }`. Only rendered while `status="error"`.
- * @csspart base - The chip's root container.
- * @csspart thumbnail - The leading image thumbnail / generic file glyph.
- * @csspart meta - Wrapper around `name` and `size`.
- * @csspart name - The filename (ellipsis-truncated via CSS; the untruncated name is always available via the native `title` tooltip).
- * @csspart size - The human-readable formatted file size. Hidden when no size is known.
- * @csspart status-text - The visible text twin of the status accent color — carries the state in text, not just color. Empty/hidden for `pending`/`done`. Gets `role="alert"` for `status="error"` only, so a screen-reader user not already focused on the chip still hears an upload failure; the ticking `'uploading'` readout deliberately stays out of the accessibility tree the same way `<lyra-generation-status>`'s per-second elapsed/token readout does — a live region re-announcing every progress tick would be noise, not information, while a one-shot failure is exactly the kind of infrequent, actionable transition a live region exists for.
- * @csspart progress - The numeric upload progress bar (`role="progressbar"`), shown only while `status="uploading"` and `progress` is a meaningful (>0) number.
- * @csspart progress-fill - The filled portion of `progress`.
- * @csspart spinner - The indeterminate upload spinner, shown instead of `progress` while `status="uploading"` and `progress` is unset/0.
- * @csspart retry-button - The retry affordance, only rendered while `status="error"`.
- * @csspart remove-button - The remove (×) affordance, only rendered while `removable`.
- */
-export class LyraAttachmentChip extends LyraElement {
-    constructor() {
-        super(...arguments);
-        /** Filename, used only while `file` is unset. */
-        this.name = '';
-        /** File size in bytes, used only while `file` is unset. */
-        this.size = 0;
-        /** MIME type, used only while `file` is unset. */
-        this.mimeType = '';
-        /** Thumbnail image URL, used only while `file` is unset (a real `File`'s
-         *  thumbnail always comes from a generated object URL instead — see the
-         *  class doc). Unlike the other independent props this one has no
-         *  `file`-derived equivalent to defer to for a non-image file; it's simply
-         *  rendered whenever present. */
-        this.thumbnailSrc = '';
-        /** Lifecycle state — drives the accent tint and which of `progress`/`spinner`/`retry-button` renders. */
-        this.status = 'pending';
-        /** Upload completion, 0-100. Only meaningful while `status="uploading"`;
-         *  a value of 0 (the default) or `NaN` falls back to the indeterminate spinner. */
-        this.progress = 0;
-        /** Shows the remove (×) button. */
-        this.removable = true;
-        /** Verb used in the remove button's `aria-label`, interpolated as
-         *  `` `${removeLabel} ${displayName}` `` -- override for i18n/locale.
-         *  Defaults to `'Remove'`, reproducing today's exact `"Remove ${displayName}"`
-         *  text byte-for-byte. */
-        this.removeLabel = 'Remove';
-        /** Verb used in the retry button's `aria-label`, interpolated as
-         *  `` `${retryLabel} ${displayName}` `` -- override for i18n/locale.
-         *  Defaults to `'Retry'`, reproducing today's exact `"Retry ${displayName}"`
-         *  text byte-for-byte. */
-        this.retryLabel = 'Retry';
-        /** Verb used in the visible uploading status text -- rendered as
-         *  `` `${uploadingLabel} ${percent}%` `` once progress is a meaningful
-         *  number, else `` `${uploadingLabel}…` ``. Override for i18n/locale.
-         *  Defaults to `'Uploading'`, reproducing today's exact `"Uploading N%"`/
-         *  `"Uploading…"` text byte-for-byte. */
-        this.uploadingLabel = 'Uploading';
-        /** Visible status text shown for `status="error"`. Override for
-         *  i18n/locale. Defaults to `'Upload failed'`, reproducing today's exact
-         *  text byte-for-byte. */
-        this.uploadFailedLabel = 'Upload failed';
-        // Last-resort id, generated once per instance -- see the class doc's
-        // "Identifying which attachment..." section.
-        this.fallbackId = nextId('attachment-chip');
-        this.onRemoveClick = () => {
-            this.emit('lyra-remove', { id: this.resolvedId });
-        };
-        this.onRetryClick = () => {
-            this.emit('lyra-retry', { id: this.resolvedId });
-        };
-    }
-    static { this.styles = [LyraElement.styles, styles]; }
-    get effectiveName() {
-        return this.file ? this.file.name : this.name;
-    }
-    get effectiveSize() {
-        return this.file ? this.file.size : this.size;
-    }
-    get effectiveMimeType() {
-        return this.file ? this.file.type : this.mimeType;
-    }
-    get resolvedId() {
-        if (this.id)
-            return this.id;
-        if (this.file)
-            return `${this.file.name}:${this.file.size}:${this.file.lastModified}`;
-        return this.fallbackId;
-    }
-    get hasNumericProgress() {
-        return this.status === 'uploading' && Number.isFinite(this.progress) && this.progress > 0;
-    }
-    get clampedProgress() {
-        return Math.min(100, Math.max(0, this.progress));
-    }
-    /** Returns (creating or reusing as needed) the object URL for `file`'s
-     * image thumbnail. Called from the update lifecycle, never from `render()`,
-     * so rendering stays a pure projection of already-prepared state. */
-    ensureObjectUrl(file) {
-        if (this.objectUrlFile === file && this.objectUrl)
-            return this.objectUrl;
-        this.revokeObjectUrl();
-        this.objectUrl = URL.createObjectURL(file);
-        this.objectUrlFile = file;
-        return this.objectUrl;
-    }
-    revokeObjectUrl() {
-        if (this.objectUrl)
-            URL.revokeObjectURL(this.objectUrl);
-        this.objectUrl = undefined;
-        this.objectUrlFile = undefined;
-    }
-    willUpdate() {
-        // Prepare or revoke the non-reactive cache before render. This keeps URL
-        // allocation out of the render phase and also handles a file changing to
-        // a non-image or to undefined, where no thumbnail render would otherwise
-        // revisit the old cache entry.
-        if (this.file?.type.startsWith('image/'))
-            this.ensureObjectUrl(this.file);
-        else if (this.objectUrlFile)
-            this.revokeObjectUrl();
-    }
-    disconnectedCallback() {
-        super.disconnectedCallback();
-        this.revokeObjectUrl();
-    }
-    renderThumbnail() {
-        if (this.file) {
-            return this.effectiveMimeType.startsWith('image/')
-                ? html `<img src=${this.objectUrl ?? ''} alt="" />`
-                : html `${fileGlyph()}`;
-        }
-        // No `file`: `thumbnail-src` is used whenever present, regardless of
-        // `mime-type` -- a server-generated preview thumbnail (e.g. a rendered
-        // first page of a PDF) is itself always an image, independent of the
-        // *source* file's own MIME type.
-        return this.thumbnailSrc ? html `<img src=${this.thumbnailSrc} alt="" />` : html `${fileGlyph()}`;
-    }
-    render() {
-        const name = this.effectiveName;
-        const displayName = name || 'Untitled file';
-        // A `0`-byte size reads the same as "unknown" here (there's no prop to
-        // distinguish a genuinely empty file from a size that was simply never
-        // supplied) -- hide the part entirely rather than show a literal "0 B".
-        const sizeText = this.effectiveSize > 0 ? formatFileSize(this.effectiveSize) : '';
-        const text = statusText(this.status, this.progress, this.clampedProgress, this.uploadingLabel, this.uploadFailedLabel);
-        const uploading = this.status === 'uploading';
-        return html `
-      <div part="base">
-        <span part="thumbnail" aria-hidden="true">${this.renderThumbnail()}</span>
-        <span part="meta">
-          <span part="name" title=${name || 'Untitled file'}>${displayName}</span>
-          <span part="size" ?hidden=${!sizeText}>${sizeText || nothing}</span>
-          <span part="status-text" role=${this.status === 'error' ? 'alert' : nothing} ?hidden=${!text}>${text || nothing}</span>
-        </span>
-        ${uploading
-            ? this.hasNumericProgress
-                ? html `
-                <div
-                  part="progress"
-                  role="progressbar"
-                  aria-valuenow=${Math.round(this.clampedProgress)}
-                  aria-valuemin="0"
-                  aria-valuemax="100"
-                  aria-label=${`Uploading ${displayName}`}
-                >
-                  <div part="progress-fill" style=${`inline-size:${this.clampedProgress}%`}></div>
-                </div>
-              `
-                : html `<span part="spinner" role="status" aria-label=${`Uploading ${displayName}`}></span>`
-            : nothing}
-        ${this.status === 'error'
-            ? html `<button part="retry-button" type="button" aria-label=${`${this.retryLabel} ${displayName}`} @click=${this.onRetryClick}>
-              ${retryIcon()}
-            </button>`
-            : nothing}
-        ${this.removable
-            ? html `<button part="remove-button" type="button" aria-label=${`${this.removeLabel} ${displayName}`} @click=${this.onRemoveClick}>
-              ${closeIcon()}
-            </button>`
-            : nothing}
-      </div>
-    `;
-    }
-}
-__decorate([
-    property({ attribute: false })
-], LyraAttachmentChip.prototype, "file", void 0);
-__decorate([
-    property()
-], LyraAttachmentChip.prototype, "name", void 0);
-__decorate([
-    property({ type: Number })
-], LyraAttachmentChip.prototype, "size", void 0);
-__decorate([
-    property({ attribute: 'mime-type' })
-], LyraAttachmentChip.prototype, "mimeType", void 0);
-__decorate([
-    property({ attribute: 'thumbnail-src' })
-], LyraAttachmentChip.prototype, "thumbnailSrc", void 0);
-__decorate([
-    property({ reflect: true })
-], LyraAttachmentChip.prototype, "status", void 0);
-__decorate([
-    property({ type: Number })
-], LyraAttachmentChip.prototype, "progress", void 0);
-__decorate([
-    property({ type: Boolean, reflect: true })
-], LyraAttachmentChip.prototype, "removable", void 0);
-__decorate([
-    property({ attribute: 'remove-label' })
-], LyraAttachmentChip.prototype, "removeLabel", void 0);
-__decorate([
-    property({ attribute: 'retry-label' })
-], LyraAttachmentChip.prototype, "retryLabel", void 0);
-__decorate([
-    property({ attribute: 'uploading-label' })
-], LyraAttachmentChip.prototype, "uploadingLabel", void 0);
-__decorate([
-    property({ attribute: 'upload-failed-label' })
-], LyraAttachmentChip.prototype, "uploadFailedLabel", void 0);
 defineElement('attachment-chip', LyraAttachmentChip);
+//# sourceMappingURL=attachment-chip.js.map

package/dist/components/attachment-chip/attachment-chip.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"attachment-chip.js","sourceRoot":"","sources":["../../../src/components/attachment-chip/attachment-chip.ts"],"names":[],"mappings":"AAAA,cAAc,4BAA4B,CAAC;AAC3C,OAAO,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AAChE,OAAO,EAAE,aAAa,EAAE,MAAM,0BAA0B,CAAC;AACzD,aAAa,CAAC,iBAAiB,EAAE,kBAAkB,CAAC,CAAC"}

package/dist/components/attachment-chip/attachment-chip.styles.d.ts

@@ -1 +1,2 @@
 export declare const styles: import("lit").CSSResult;
+//# sourceMappingURL=attachment-chip.styles.d.ts.map

package/dist/components/attachment-chip/attachment-chip.styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"attachment-chip.styles.d.ts","sourceRoot":"","sources":["../../../src/components/attachment-chip/attachment-chip.styles.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,MAAM,yBA4MlB,CAAC"}

package/dist/components/attachment-chip/attachment-chip.styles.js

@@ -13,6 +13,28 @@ export const styles = css `
     --lyra-attachment-chip-accent: var(--lyra-color-text-quiet);
     --lyra-attachment-chip-bg: var(--lyra-color-surface);
     --lyra-attachment-chip-border: var(--lyra-color-border);
+    /* Compact-mode thumbnail size -- a dedicated token rather than reusing
+       --lyra-icon-button-size (the one token in this library with no --wa-*
+       fallback chain), so a consumer can retheme just the compact thumbnail
+       independent of every other icon-button-sized control. */
+    --lyra-attachment-chip-compact-thumbnail-size: var(--lyra-size-1-75rem);
+    --lyra-attachment-chip-compact-font-size: var(--lyra-font-size-xs);
+    --lyra-attachment-chip-compact-gap: var(--lyra-size-0-25rem);
+  }
+
+  :host([compact]) [part='base'] {
+    border: none;
+    border-radius: var(--lyra-radius-pill);
+    padding: var(--lyra-size-0-125rem) var(--lyra-space-xs);
+    font-size: var(--lyra-attachment-chip-compact-font-size);
+    gap: var(--lyra-attachment-chip-compact-gap);
+  }
+  :host([compact]) [part='thumbnail'] {
+    inline-size: var(--lyra-attachment-chip-compact-thumbnail-size);
+    block-size: var(--lyra-attachment-chip-compact-thumbnail-size);
+  }
+  :host([compact][thumbnail-only][mime-type^='image/']) [part='meta'] {
+    display: none;
   }
 
   :host([status='uploading']) {
@@ -40,12 +62,12 @@ export const styles = css `
     max-inline-size: 100%;
     box-sizing: border-box;
     padding: var(--lyra-space-xs) var(--lyra-space-s);
-    border: 1px solid var(--lyra-attachment-chip-border);
+    border: var(--lyra-border-width-thin) solid var(--lyra-attachment-chip-border);
     border-radius: var(--lyra-radius);
     background: var(--lyra-attachment-chip-bg);
     color: var(--lyra-color-text);
-    font-size: 0.8125rem;
-    line-height: 1.3;
+    font-size: var(--lyra-font-size-sm);
+    line-height: var(--lyra-line-height-snug);
     transition:
       background-color var(--lyra-transition-fast),
       border-color var(--lyra-transition-fast);
@@ -80,13 +102,13 @@ export const styles = css `
     flex-direction: column;
     flex: 1 1 auto;
     min-inline-size: 0;
-    gap: 0.125rem;
+    gap: var(--lyra-size-0-125rem);
   }
   [part='name'] {
     overflow: hidden;
     text-overflow: ellipsis;
     white-space: nowrap;
-    font-weight: 600;
+    font-weight: var(--lyra-font-weight-semibold);
     color: var(--lyra-color-text);
   }
   [part='size'] {
@@ -101,14 +123,14 @@ export const styles = css `
   }
   [part='status-text'] {
     color: var(--lyra-attachment-chip-accent);
-    font-weight: 600;
+    font-weight: var(--lyra-font-weight-semibold);
   }
 
   [part='progress'] {
     flex: 0 0 auto;
-    inline-size: 3.5rem;
+    inline-size: var(--lyra-size-3-5rem);
     block-size: var(--lyra-space-xs);
-    border-radius: 999px;
+    border-radius: var(--lyra-radius-pill);
     background: var(--lyra-color-border);
     overflow: hidden;
   }
@@ -122,10 +144,10 @@ export const styles = css `
   [part='spinner'] {
     flex: 0 0 auto;
     display: inline-block;
-    inline-size: 1rem;
-    block-size: 1rem;
+    inline-size: var(--lyra-size-1rem);
+    block-size: var(--lyra-size-1rem);
     border-radius: 50%;
-    border: 2px solid var(--lyra-color-border);
+    border: var(--lyra-border-width-medium) solid var(--lyra-color-border);
     border-block-start-color: var(--lyra-attachment-chip-accent);
     animation: lyra-attachment-chip-spin 0.8s linear infinite;
   }
@@ -136,8 +158,8 @@ export const styles = css `
     display: inline-flex;
     align-items: center;
     justify-content: center;
-    min-inline-size: min(var(--lyra-icon-button-size), 1.75rem);
-    min-block-size: min(var(--lyra-icon-button-size), 1.75rem);
+    min-inline-size: min(var(--lyra-icon-button-size), var(--lyra-size-1-75rem));
+    min-block-size: min(var(--lyra-icon-button-size), var(--lyra-size-1-75rem));
     padding: 0;
     border: none;
     border-radius: calc(var(--lyra-radius) * 0.6);
@@ -182,3 +204,4 @@ export const styles = css `
     }
   }
 `;
+//# sourceMappingURL=attachment-chip.styles.js.map

package/dist/components/attachment-chip/attachment-chip.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"attachment-chip.styles.js","sourceRoot":"","sources":["../../../src/components/attachment-chip/attachment-chip.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA4MxB,CAAC"}

package/dist/components/attachment-trigger/attachment-trigger.class.d.ts

@@ -0,0 +1,109 @@
+import { type TemplateResult } from 'lit';
+import { LyraElement } from '../../internal/lyra-element.js';
+import '../menu/menu.class.js';
+import '../menu/menu-item.class.js';
+export type AttachmentCapability = 'files' | 'image' | 'camera';
+/** The two capabilities that resolve to a real file selection (as opposed
+ *  to `camera`, which never touches a file input -- see the class doc). */
+export type FileBackedCapability = Exclude<AttachmentCapability, 'camera'>;
+export interface AttachmentPickDetail {
+    capability: FileBackedCapability;
+    files: FileList;
+}
+export interface LyraAttachmentTriggerEventMap {
+    'lyra-camera-request': CustomEvent<undefined>;
+}
+/**
+ * `<lyra-attachment-trigger>` — a compact attach affordance designed for a
+ * chat composer's leading slot (see `<lyra-chat-composer>`'s own `leading`
+ * slot, which this drops straight into, though this component has no code
+ * dependency on it). Its shape adapts to how many attachment `capabilities`
+ * are configured:
+ *  - Exactly one capability: a single plain icon button ([part='trigger']).
+ *    Activating it performs that capability's action directly.
+ *  - More than one: a small anchored menu ([part='menu'], composed from
+ *    `<lyra-menu>`/`<lyra-menu-item>`) listing each capability as a row.
+ *
+ * Two of the three capabilities (`files`, `image`) are file-picker-backed:
+ * activating them opens a hidden native `<input type="file">` via a
+ * synthetic `.click()`, and the resulting selection is re-emitted as
+ * `lyra-pick`. `accept` is shared across both — `image` defaults it to
+ * `'image/*'` unless the `accept` prop overrides it, `files` always uses
+ * `accept` as-is (empty means "any file type", matching a bare native
+ * `<input type="file">` with no `accept` attribute).
+ *
+ * **`camera` is scope-limited by design.** This component does not
+ * implement any camera capture UI itself — no `getUserMedia`, no
+ * `<input capture>` — because that's entirely a host/browser concern with
+ * no single right answer (a desktop web app, a mobile PWA, and a native
+ * wrapper all want different things here). Activating the `camera`
+ * capability only fires `lyra-camera-request`; the host owns everything
+ * from that point on (opening its own capture UI, then presumably handing
+ * the resulting `File` back to something like `<lyra-attachment-chip>`).
+ *
+ * @customElement lyra-attachment-trigger
+ * @event lyra-pick - A file-backed capability's hidden file input produced a
+ * real selection. `detail: { capability: 'files' | 'image', files }` — a
+ * real `FileList` (not a plain array), matching the native input's own
+ * `.files` shape, but an independent snapshot rather than that same live
+ * object — see `onInputChange`'s own doc for why a live reference would be
+ * unsafe to hand out here.
+ * @event lyra-camera-request - The `camera` capability was activated. No
+ * detail payload — see the class doc's scope note; the host implements the
+ * actual capture flow.
+ * @csspart trigger - The single-capability icon button. Only rendered when `capabilities.length === 1`.
+ * @csspart menu - The `<lyra-menu>` wrapper. Only rendered when `capabilities.length > 1`.
+ * @csspart menu-trigger - The multi-capability button slotted into `<lyra-menu>`'s own `trigger` slot. Only rendered when `capabilities.length > 1`.
+ * @csspart expand-icon - The disclosure chevron inside the multi-capability trigger button. Only rendered when `capabilities.length > 1`.
+ * @csspart hidden-input - The internal native `<input type="file">` that actually opens the OS file
+ *   picker. Hidden (`display: none`) by default; exposed as a part only so a consumer can override
+ *   that with `::part(hidden-input)` in the unlikely case their integration needs to.
+ *
+ * `triggerLabel` lets a host override the single-capability trigger button's
+ * `aria-label` (i18n) — see that property's own doc for exactly what it
+ * does and doesn't affect.
+ */
+export declare class LyraAttachmentTrigger extends LyraElement<LyraAttachmentTriggerEventMap> {
+    static styles: import("lit").CSSResultGroup[];
+    /** Which attachment capabilities to offer, in display order. A single
+     *  entry renders a plain button; more than one renders a menu. */
+    capabilities: AttachmentCapability[];
+    /** Native-file-input-style accept string (e.g. `'image/*'` or
+     *  `'.pdf,.docx'`), forwarded to the hidden file input for the
+     *  `files`/`image` capabilities — see the class doc for how each uses it. */
+    accept: string;
+    /** Overrides the single-capability trigger button's `aria-label`, which
+     *  otherwise comes from `CAPABILITY_META[capability].triggerLabel` (e.g.
+     *  `'Attach files'`). Set this to localize the accessible name; leave it
+     *  unset to keep the built-in English default. Only affects the
+     *  single-capability button ([part='trigger']) — the multi-capability
+     *  menu's own trigger keeps its fixed `'Add attachment'` label regardless. */
+    triggerLabel?: string;
+    /** Forwards to the internal trigger button(s)' native `title` attribute — a sighted mouse
+     *  user's hover tooltip, distinct from `triggerLabel`'s accessible-name (`aria-label`) role.
+     *  Applies to both the single-capability `[part=trigger]` button and the multi-capability
+     *  `[part=menu-trigger]` button. Unset (the default): no `title` attribute, unchanged from
+     *  before this property existed. */
+    triggerTitle?: string;
+    /** Forwarded to the hidden file input's own `multiple` attribute. */
+    multiple: boolean;
+    disabled: boolean;
+    private inputEl?;
+    private pendingCapability;
+    private get hasFileCapability();
+    private effectiveAccept;
+    private activateCapability;
+    private onTriggerClick;
+    private onMenuSelect;
+    private onInputChange;
+    private renderHiddenInput;
+    private renderSingleTrigger;
+    private renderMenu;
+    render(): TemplateResult;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'lyra-attachment-trigger': LyraAttachmentTrigger;
+    }
+}
+//# sourceMappingURL=attachment-trigger.class.d.ts.map

package/dist/components/attachment-trigger/attachment-trigger.class.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"attachment-trigger.class.d.ts","sourceRoot":"","sources":["../../../src/components/attachment-trigger/attachment-trigger.class.ts"],"names":[],"mappings":"AAAA,OAAO,EAAsB,KAAK,cAAc,EAA0B,MAAM,KAAK,CAAC;AAEtF,OAAO,EAAE,WAAW,EAAE,MAAM,gCAAgC,CAAC;AAI7D,OAAO,uBAAuB,CAAC;AAC/B,OAAO,4BAA4B,CAAC;AAEpC,MAAM,MAAM,oBAAoB,GAAG,OAAO,GAAG,OAAO,GAAG,QAAQ,CAAC;AAEhE;2EAC2E;AAC3E,MAAM,MAAM,oBAAoB,GAAG,OAAO,CAAC,oBAAoB,EAAE,QAAQ,CAAC,CAAC;AAE3E,MAAM,WAAW,oBAAoB;IACnC,UAAU,EAAE,oBAAoB,CAAC;IACjC,KAAK,EAAE,QAAQ,CAAC;CACjB;AAsED,MAAM,WAAW,6BAA6B;IAC5C,qBAAqB,EAAE,WAAW,CAAC,SAAS,CAAC,CAAC;CAC/C;AACD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAiDG;AACH,qBAAa,qBAAsB,SAAQ,WAAW,CAAC,6BAA6B,CAAC;IACnF,MAAM,CAAC,MAAM,iCAAgC;IAE7C;sEACkE;IAClC,YAAY,EAAE,oBAAoB,EAAE,CAAa;IAEjF;;iFAE6E;IACjE,MAAM,SAAM;IAExB;;;;;kFAK8E;IACpC,YAAY,CAAC,EAAE,MAAM,CAAC;IAEhE;;;;wCAIoC;IACM,YAAY,CAAC,EAAE,MAAM,CAAC;IAEhE,qEAAqE;IACzB,QAAQ,UAAQ;IAEhB,QAAQ,UAAS;IAEhC,OAAO,CAAC,OAAO,CAAC,CAAmB;IAMhE,OAAO,CAAC,iBAAiB,CAAiC;IAE1D,OAAO,KAAK,iBAAiB,GAE5B;IAED,OAAO,CAAC,eAAe;IAIvB,OAAO,CAAC,kBAAkB;IAa1B,OAAO,CAAC,cAAc,CAEpB;IAEF,OAAO,CAAC,YAAY,CAElB;IAEF,OAAO,CAAC,aAAa,CA0BnB;IAEF,OAAO,CAAC,iBAAiB;IAczB,OAAO,CAAC,mBAAmB;IAiB3B,OAAO,CAAC,UAAU;IA4BlB,MAAM,IAAI,cAAc,CAQvB;CACF;AAGD,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,yBAAyB,EAAE,qBAAqB,CAAC;KAClD;CACF"}