@aceshooting/lyra-ui 2.1.0 → 2.3.0

package/dist/components/conversation-item/conversation-item.class.js

@@ -0,0 +1,328 @@
+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, state, query } from 'lit/decorators.js';
+import { LyraElement } from '../../internal/lyra-element.js';
+import { styles } from './conversation-item.styles.js';
+// Mirrors the shared icon set's viewBox/stroke conventions
+// (internal/icons.ts's chevronIcon()/closeIcon()/etc.) without adding a
+// pencil/edit 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. Same approach lyra-checkbox's own local
+// checkmark/indeterminate glyphs and lyra-chat-message's local retryIcon()
+// take for the identical reason.
+const ICON_VIEW_BOX = '0 0 24 24';
+const ICON_STROKE_WIDTH = '1.75';
+function pencilIcon() {
+    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="M12 20h9"></path><path d="M16.5 3.5a2.121 2.121 0 0 1 3 3L7 19l-4 1 1-4Z"></path></svg>
+  `;
+}
+/** `Intl.DateTimeFormat`-based absolute formatter -- clock time ("3:45 PM")
+ *  for a timestamp that falls on the same calendar day as `now`, otherwise a
+ *  calendar date ("Jul 10", or "Jul 10, 2024" once it's not the current
+ *  year). Deliberately not a fuzzy "2 hours ago" relative string -- bucketed
+ *  relative time (grouping a whole history list into "Today"/"Yesterday"/
+ *  "Last 7 days" sections) belongs to the list level, not this single row's
+ *  job. `formatTimestamp` overrides this
+ *  entirely, mirroring `<lyra-chat-message>`'s identical override hook. */
+function defaultFormatTimestamp(date, now = new Date()) {
+    const sameDay = date.toDateString() === now.toDateString();
+    if (sameDay) {
+        return new Intl.DateTimeFormat(undefined, { hour: 'numeric', minute: '2-digit' }).format(date);
+    }
+    const sameYear = date.getFullYear() === now.getFullYear();
+    return new Intl.DateTimeFormat(undefined, sameYear ? { month: 'short', day: 'numeric' } : { month: 'short', day: 'numeric', year: 'numeric' }).format(date);
+}
+/**
+ * `<lyra-conversation-item>` — a selectable row representing one chat
+ * session in a history sidebar list. Usable standalone or as the
+ * `renderItem()` payload of a sibling virtualized-list component; this
+ * module has no dependency on that (or any) other component.
+ *
+ * Takes `title`/`excerpt`/`timestamp` as individual primitive props rather
+ * than one opaque bound object, deliberately consistent with how
+ * `<lyra-chat-message>` takes individual props instead of a single
+ * `.message` blob -- every other component in this family follows that
+ * shape, so this one does too even though a single bound `.session` object
+ * would also have been a reasonable design.
+ *
+ * Identifying *which* session a `lyra-select` click/keypress was about: this
+ * reuses the platform's own `id` attribute (every element already has one)
+ * rather than inventing a second, differently-named id-carrying prop --
+ * consumers already have the event's `target`/`currentTarget` (and thus
+ * `.id`), the same reasoning `<lyra-attachment-chip>` documents for its own
+ * identically-shaped choice. `lyra-select` therefore carries no detail
+ * payload at all.
+ *
+ * `role="button"` on `[part="option"]` so the item has valid semantics both
+ * standalone and when placed in a larger history-list layout. A conversation
+ * row activates one current session; it is not itself a listbox option and
+ * therefore does not require a particular owner role.
+ *
+ * `role="button"` forbids focusable
+ * descendants -- verified against axe-core's `nested-interactive` rule,
+ * which flags it. That's why the rename button and the `actions` slot are
+ * rendered as DOM *siblings* of `[part="option"]` (both inside
+ * `[part="base"]`) rather than nested inside it: `[part="option"]` only ever
+ * contains plain text/`<time>` content. The in-place rename `<input>` is the
+ * same problem one level deeper -- it replaces the title *inside*
+ * `[part="option"]` while renaming -- so `[part="option"]` sheds its
+ * `role`/`tabindex`/`aria-current`/`aria-label` entirely for the duration
+ * of an edit. A row mid-edit is a text field, so suspending the button
+ * semantics is also the more accurate
+ * description of what's on screen.
+ *
+ * Inline rename is a dedicated pencil/edit icon button (not a double-click
+ * on the title) -- double-click has no keyboard/screen-reader equivalent
+ * and would silently swallow the row's own single-click `lyra-select`,
+ * whereas a button is independently focusable, has its own accessible name,
+ * and composes cleanly with click-to-select.
+ *
+ * @customElement lyra-conversation-item
+ * @slot actions - Overflow/icon-button controls (for example a pin/delete
+ * button or a `lyra-menu` trigger) rendered at the trailing edge of the row.
+ * @event lyra-select - The row was activated: a click on `[part="option"]`
+ * (i.e. outside the rename button and the `actions` slot), or Enter/Space
+ * while it's focused -- in both cases only while not currently renaming. No
+ * detail payload -- see the class doc's "Identifying which session" note.
+ * @event lyra-rename - An in-place rename was committed (Enter, or blur
+ * while editing). `detail: { title }`. Does not mutate `title` itself --
+ * this is a controlled component, the same convention
+ * `<lyra-chat-message>` follows by not clearing its own state on retry; the
+ * consumer applies the new title once it's actually persisted. Not fired
+ * when the trimmed draft is empty or unchanged from the original `title`
+ * (that's treated as an implicit cancel).
+ * @csspart base - The outer row wrapper (plain, no ARIA role) laying out `[part="option"]`, the rename button, and `actions`.
+ * @csspart option - The selectable region (`role="button"`, removed while renaming -- see the class doc). Wraps `content` and `timestamp`.
+ * @csspart content - Wrapper around the title and excerpt.
+ * @csspart title - The title text, shown while not renaming.
+ * @csspart title-input - The in-place rename `<input>`, shown only while renaming.
+ * @csspart rename-button - The pencil/edit affordance that starts a rename (only rendered while `editable` and not already renaming).
+ * @csspart excerpt - The last-message preview snippet. Only rendered when `excerpt` is non-empty.
+ * @csspart timestamp - The formatted `timestamp`, rendered in a `<time>` element. Only rendered when `timestamp` is set and valid.
+ * @csspart actions - The wrapper around the `actions` slot.
+ */
+export class LyraConversationItem extends LyraElement {
+    constructor() {
+        super(...arguments);
+        /** The session's display title. */
+        this.title = '';
+        /** A short preview snippet of the last message. Omit for no excerpt line. */
+        this.excerpt = '';
+        /** Whether this is the currently-selected/open session. Drives the
+         *  brand-quiet background treatment. */
+        this.active = false;
+        /** Whether inline-rename is available at all. When `false`, the rename
+         *  button never renders and the row can never enter its editing state. If
+         *  flipped to `false` while a rename is already open, the in-progress edit
+         *  is cancelled (discarded, like Escape) rather than left committable. */
+        this.editable = true;
+        this.renaming = false;
+        this.draftTitle = '';
+        this.hasActionsSlot = false;
+        this.onOptionClick = () => {
+            // While renaming, `[part="option"]` has no role/selection semantics
+            // (see the class doc) -- a click inside it (e.g. to place the caret in
+            // the input) must not also select the row.
+            if (this.renaming)
+                return;
+            this.select();
+        };
+        this.onOptionKeyDown = (e) => {
+            if (this.renaming)
+                return;
+            if (e.key === 'Enter' || e.key === ' ' || e.key === 'Spacebar') {
+                // Space would otherwise scroll the page, same as lyra-checkbox/lyra-switch.
+                e.preventDefault();
+                this.select();
+            }
+        };
+        this.onRenameButtonClick = () => {
+            // No stopPropagation() needed here: the rename button is a DOM sibling
+            // of `[part="option"]` (see the class doc), not a descendant of it, so
+            // this click was never going to reach onOptionClick's listener anyway.
+            this.startRename();
+        };
+        this.onTitleInputChange = (e) => {
+            this.draftTitle = e.target.value;
+        };
+        this.onTitleInputKeyDown = (e) => {
+            // The input is a descendant of `[part="option"]` (unlike the rename
+            // button/actions slot, which are siblings of it) -- its keydown would
+            // otherwise bubble into onOptionKeyDown above. Stopping it here avoids a
+            // race where commitRename() (called below) has already flipped
+            // `renaming` back to `false` by the time that bubbled event reaches
+            // onOptionKeyDown's own `if (this.renaming) return;` guard, which would
+            // otherwise wrongly let the same Enter keystroke also fire lyra-select.
+            e.stopPropagation();
+            if (e.key === 'Enter') {
+                e.preventDefault();
+                this.commitRename();
+            }
+            else if (e.key === 'Escape') {
+                e.preventDefault();
+                this.cancelRename();
+            }
+        };
+        this.onTitleInputBlur = () => {
+            // If Escape already ended the edit synchronously (cancelRename() runs
+            // before this fires), `renaming` is already false by the time the
+            // now-removed input's blur event reaches here -- skip so Escape can't
+            // also commit.
+            if (!this.renaming)
+                return;
+            this.commitRename();
+        };
+        this.onActionsSlotChange = (e) => {
+            this.hasActionsSlot = e.target.assignedElements({ flatten: true }).length > 0;
+        };
+    }
+    static { this.styles = [LyraElement.styles, styles]; }
+    willUpdate(changed) {
+        if (!this.hasUpdated) {
+            this.hasActionsSlot = Array.from(this.children).some((el) => el.getAttribute('slot') === 'actions');
+        }
+        // `editable` documents that flipping it false can never leave a rename
+        // committable -- without this, toggling it mid-edit would strand the
+        // input mounted (and still submittable via Enter/blur) since nothing
+        // else observes `editable` while `renaming` is already true.
+        if (changed.has('editable') && !this.editable && this.renaming) {
+            this.cancelRename();
+        }
+    }
+    updated(changed) {
+        if (changed.has('renaming') && this.renaming) {
+            // Runs after render, so the input already exists in the DOM.
+            this.titleInput?.focus();
+            this.titleInput?.select();
+        }
+    }
+    get normalizedTimestamp() {
+        if (this.timestamp === undefined)
+            return undefined;
+        const date = this.timestamp instanceof Date ? this.timestamp : new Date(this.timestamp);
+        return Number.isNaN(date.getTime()) ? undefined : date;
+    }
+    select() {
+        this.emit('lyra-select');
+    }
+    startRename() {
+        if (!this.editable || this.renaming)
+            return;
+        this.draftTitle = this.title;
+        this.renaming = true;
+    }
+    commitRename() {
+        this.renaming = false;
+        const next = this.draftTitle.trim();
+        // An empty or unchanged draft has nothing meaningful to commit -- treat
+        // it the same as Escape rather than firing a no-op (or blanking) rename
+        // for the consumer to deal with.
+        if (!next || next === this.title)
+            return;
+        this.emit('lyra-rename', { title: next });
+    }
+    cancelRename() {
+        this.renaming = false;
+    }
+    render() {
+        const ts = this.normalizedTimestamp;
+        const formatter = this.formatTimestamp ?? defaultFormatTimestamp;
+        const displayTitle = this.title || 'Untitled conversation';
+        const showRenameButton = this.editable && !this.renaming;
+        // Shared between the rename button and the input it opens: the input is
+        // where focus actually lands, so it needs the same row-specific
+        // accessible name (not a generic one) to disambiguate which row a
+        // screen-reader user is editing.
+        const renameLabel = `Rename ${displayTitle}`;
+        return html `
+      <div part="base">
+        <div
+          part="option"
+          role=${this.renaming ? nothing : 'button'}
+          tabindex=${this.renaming ? nothing : '0'}
+          aria-current=${this.renaming || !this.active ? nothing : 'true'}
+          aria-label=${this.renaming ? nothing : this.getAttribute('aria-label') || displayTitle}
+          @click=${this.onOptionClick}
+          @keydown=${this.onOptionKeyDown}
+        >
+          <div part="content">
+            ${this.renaming
+            ? html `<input
+                  part="title-input"
+                  type="text"
+                  .value=${this.draftTitle}
+                  aria-label=${renameLabel}
+                  @input=${this.onTitleInputChange}
+                  @keydown=${this.onTitleInputKeyDown}
+                  @blur=${this.onTitleInputBlur}
+                />`
+            : html `<span part="title" title=${displayTitle}>${displayTitle}</span>`}
+            ${this.excerpt ? html `<span part="excerpt">${this.excerpt}</span>` : nothing}
+          </div>
+          ${ts ? html `<time part="timestamp" datetime=${ts.toISOString()}>${formatter(ts)}</time>` : nothing}
+        </div>
+        ${showRenameButton
+            ? html `<button
+              part="rename-button"
+              type="button"
+              aria-label=${renameLabel}
+              @click=${this.onRenameButtonClick}
+            >
+              ${pencilIcon()}
+            </button>`
+            : nothing}
+        <span part="actions" ?hidden=${!this.hasActionsSlot}>
+          <slot name="actions" @slotchange=${this.onActionsSlotChange}></slot>
+        </span>
+      </div>
+    `;
+    }
+}
+__decorate([
+    property()
+], LyraConversationItem.prototype, "title", void 0);
+__decorate([
+    property()
+], LyraConversationItem.prototype, "excerpt", void 0);
+__decorate([
+    property({ attribute: false })
+], LyraConversationItem.prototype, "timestamp", void 0);
+__decorate([
+    property({ attribute: false })
+], LyraConversationItem.prototype, "formatTimestamp", void 0);
+__decorate([
+    property({ type: Boolean, reflect: true })
+], LyraConversationItem.prototype, "active", void 0);
+__decorate([
+    property({ type: Boolean, reflect: true })
+], LyraConversationItem.prototype, "editable", void 0);
+__decorate([
+    state()
+], LyraConversationItem.prototype, "renaming", void 0);
+__decorate([
+    state()
+], LyraConversationItem.prototype, "draftTitle", void 0);
+__decorate([
+    state()
+], LyraConversationItem.prototype, "hasActionsSlot", void 0);
+__decorate([
+    query('[part="title-input"]')
+], LyraConversationItem.prototype, "titleInput", void 0);
+//# sourceMappingURL=conversation-item.class.js.map

package/dist/components/conversation-item/conversation-item.class.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"conversation-item.class.js","sourceRoot":"","sources":["../../../src/components/conversation-item/conversation-item.class.ts"],"names":[],"mappings":"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"}

package/dist/components/conversation-item/conversation-item.d.ts

@@ -1,125 +1,2 @@
-import { type TemplateResult, type PropertyValues } from 'lit';
-import { LyraElement } from '../../internal/lyra-element.js';
-export interface ConversationItemRenameDetail {
-    title: string;
-}
-/**
- * `<lyra-conversation-item>` — a selectable row representing one chat
- * session in a history sidebar list. Usable standalone or as the
- * `renderItem()` payload of a sibling virtualized-list component; this
- * module has no dependency on that (or any) other component.
- *
- * Takes `title`/`excerpt`/`timestamp` as individual primitive props rather
- * than one opaque bound object, deliberately consistent with how
- * `<lyra-chat-message>` takes individual props instead of a single
- * `.message` blob -- every other component in this family follows that
- * shape, so this one does too even though a single bound `.session` object
- * would also have been a reasonable design.
- *
- * Identifying *which* session a `lyra-select` click/keypress was about: this
- * reuses the platform's own `id` attribute (every element already has one)
- * rather than inventing a second, differently-named id-carrying prop --
- * consumers already have the event's `target`/`currentTarget` (and thus
- * `.id`), the same reasoning `<lyra-attachment-chip>` documents for its own
- * identically-shaped choice. `lyra-select` therefore carries no detail
- * payload at all.
- *
- * `role="button"` on `[part="option"]` so the item has valid semantics both
- * standalone and when placed in a larger history-list layout. A conversation
- * row activates one current session; it is not itself a listbox option and
- * therefore does not require a particular owner role.
- *
- * `role="button"` forbids focusable
- * descendants -- verified against axe-core's `nested-interactive` rule,
- * which flags it. That's why the rename button and the `actions` slot are
- * rendered as DOM *siblings* of `[part="option"]` (both inside
- * `[part="base"]`) rather than nested inside it: `[part="option"]` only ever
- * contains plain text/`<time>` content. The in-place rename `<input>` is the
- * same problem one level deeper -- it replaces the title *inside*
- * `[part="option"]` while renaming -- so `[part="option"]` sheds its
- * `role`/`tabindex`/`aria-current`/`aria-label` entirely for the duration
- * of an edit. A row mid-edit is a text field, so suspending the button
- * semantics is also the more accurate
- * description of what's on screen.
- *
- * Inline rename is a dedicated pencil/edit icon button (not a double-click
- * on the title) -- double-click has no keyboard/screen-reader equivalent
- * and would silently swallow the row's own single-click `lyra-select`,
- * whereas a button is independently focusable, has its own accessible name,
- * and composes cleanly with click-to-select.
- *
- * @customElement lyra-conversation-item
- * @slot actions - Overflow/icon-button controls (e.g. a future pin/delete
- * button) rendered at the trailing edge of the row. `lyra-menu` doesn't
- * exist yet in this phase, so this is a plain slot for whatever a consumer
- * wants to put there today.
- * @event lyra-select - The row was activated: a click on `[part="option"]`
- * (i.e. outside the rename button and the `actions` slot), or Enter/Space
- * while it's focused -- in both cases only while not currently renaming. No
- * detail payload -- see the class doc's "Identifying which session" note.
- * @event lyra-rename - An in-place rename was committed (Enter, or blur
- * while editing). `detail: { title }`. Does not mutate `title` itself --
- * this is a controlled component, the same convention
- * `<lyra-chat-message>` follows by not clearing its own state on retry; the
- * consumer applies the new title once it's actually persisted. Not fired
- * when the trimmed draft is empty or unchanged from the original `title`
- * (that's treated as an implicit cancel).
- * @csspart base - The outer row wrapper (plain, no ARIA role) laying out `[part="option"]`, the rename button, and `actions`.
- * @csspart option - The selectable region (`role="button"`, removed while renaming -- see the class doc). Wraps `content` and `timestamp`.
- * @csspart content - Wrapper around the title and excerpt.
- * @csspart title - The title text, shown while not renaming.
- * @csspart title-input - The in-place rename `<input>`, shown only while renaming.
- * @csspart rename-button - The pencil/edit affordance that starts a rename (only rendered while `editable` and not already renaming).
- * @csspart excerpt - The last-message preview snippet. Only rendered when `excerpt` is non-empty.
- * @csspart timestamp - The formatted `timestamp`, rendered in a `<time>` element. Only rendered when `timestamp` is set and valid.
- * @csspart actions - The wrapper around the `actions` slot.
- */
-export declare class LyraConversationItem extends LyraElement {
-    static styles: import("lit").CSSResultGroup[];
-    /** The session's display title. */
-    title: string;
-    /** A short preview snippet of the last message. Omit for no excerpt line. */
-    excerpt: string;
-    /** When the session was last active. Accepts a `Date` or anything
-     *  `new Date()` can parse (e.g. an ISO 8601 string); invalid input is
-     *  treated the same as unset (no timestamp rendered) -- mirrors
-     *  `<lyra-chat-message>`'s identical `timestamp` prop. */
-    timestamp?: Date | string;
-    /** Overrides the default absolute-time rendering of `timestamp` -- this
-     *  library has no i18n system of its own, so an overridable formatter is
-     *  the established way to hand locale-sensitive display back to the
-     *  consumer (mirrors `<lyra-chat-message>`'s identical `formatTimestamp`). */
-    formatTimestamp?: (date: Date) => string;
-    /** Whether this is the currently-selected/open session. Drives the
-     *  brand-quiet background treatment. */
-    active: boolean;
-    /** Whether inline-rename is available at all. When `false`, the rename
-     *  button never renders and the row can never enter its editing state. If
-     *  flipped to `false` while a rename is already open, the in-progress edit
-     *  is cancelled (discarded, like Escape) rather than left committable. */
-    editable: boolean;
-    private renaming;
-    private draftTitle;
-    private hasActionsSlot;
-    private titleInput?;
-    protected willUpdate(changed: PropertyValues): void;
-    protected updated(changed: PropertyValues): void;
-    private get normalizedTimestamp();
-    private select;
-    private startRename;
-    private commitRename;
-    private cancelRename;
-    private onOptionClick;
-    private onOptionKeyDown;
-    private onRenameButtonClick;
-    private onTitleInputChange;
-    private onTitleInputKeyDown;
-    private onTitleInputBlur;
-    private onActionsSlotChange;
-    render(): TemplateResult;
-}
-declare global {
-    interface HTMLElementTagNameMap {
-        'lyra-conversation-item': LyraConversationItem;
-    }
-}
+export * from './conversation-item.class.js';
+//# sourceMappingURL=conversation-item.d.ts.map

package/dist/components/conversation-item/conversation-item.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"conversation-item.d.ts","sourceRoot":"","sources":["../../../src/components/conversation-item/conversation-item.ts"],"names":[],"mappings":"AAAA,cAAc,8BAA8B,CAAC"}