@tylertech/forge-ai 0.15.3-dev.1 → 0.16.0-dev.0

package/dist/ai-agent-selector/ai-agent-selector2.mjs

@@ -0,0 +1,344 @@
+import __decorate from "../_virtual/_@oxc-project_runtime@0.154.0/helpers/esm/decorate.mjs";
+import "../core/tooltip/tooltip2.mjs";
+import "../core/popover/popover2.mjs";
+import { toggleState } from "../utils/dom.mjs";
+import ai_agent_selector_default from "./ai-agent-selector.mjs";
+import { LitElement, html, nothing, unsafeCSS } from "lit";
+import { customElement, property, query, state } from "lit/decorators.js";
+import { when } from "lit/directives/when.js";
+import { classMap } from "lit/directives/class-map.js";
+//#region src/lib/ai-agent-selector/ai-agent-selector.ts
+var AiAgentSelectorComponentTagName = "forge-ai-agent-selector";
+var MIN_AGENTS_FOR_FILTER = 5;
+var AiAgentSelectorComponent = class AiAgentSelectorComponent extends LitElement {
+	static {
+		this.styles = unsafeCSS(ai_agent_selector_default);
+	}
+	#internals;
+	constructor() {
+		super();
+		this.agents = [];
+		this.titleText = "AI Assistant";
+		this.disabled = false;
+		this._open = false;
+		this._focusedIndex = -1;
+		this._isTextOverflowing = false;
+		this._filterValue = "";
+		this.#internals = this.attachInternals();
+	}
+	get #selectedAgent() {
+		return this.agents.find((a) => a.id === this.selectedAgentId);
+	}
+	get #effectiveTitleText() {
+		return this.titleText || "AI Assistant";
+	}
+	get #displayText() {
+		return this.#selectedAgent?.name ?? this.#effectiveTitleText;
+	}
+	get #hasAgents() {
+		return this.agents.length > 0;
+	}
+	get #shouldShowFilter() {
+		return this.agents.length > MIN_AGENTS_FOR_FILTER;
+	}
+	get #filteredAgents() {
+		if (!this._filterValue.trim()) return this.agents;
+		const searchQuery = this._filterValue.toLowerCase();
+		return this.agents.filter((agent) => agent.name.toLowerCase().includes(searchQuery));
+	}
+	get #tooltipContent() {
+		const agent = this.#selectedAgent;
+		if (!agent) return this.#effectiveTitleText;
+		return agent.description ? `${agent.name}\n${agent.description}` : agent.name;
+	}
+	willUpdate(changedProperties) {
+		if (changedProperties.has("_open")) toggleState(this.#internals, "open", this._open);
+	}
+	updated(changedProperties) {
+		if (changedProperties.has("selectedAgentId") || changedProperties.has("titleText") || changedProperties.has("agents")) this.#checkTextOverflow();
+	}
+	#checkTextOverflow() {
+		requestAnimationFrame(() => {
+			const textElement = this.shadowRoot?.querySelector(".trigger-text, .title-text");
+			if (textElement) {
+				const isOverflowing = textElement.scrollWidth > textElement.offsetWidth;
+				if (this._isTextOverflowing !== isOverflowing) this._isTextOverflowing = isOverflowing;
+			}
+		});
+	}
+	#handleTriggerClick() {
+		if (this.disabled) return;
+		this._open = !this._open;
+		if (this._open) this._focusedIndex = -1;
+	}
+	#handlePopoverToggle(event) {
+		this._open = event.detail.open;
+		if (!this._open) {
+			this._focusedIndex = -1;
+			this._filterValue = "";
+			this._triggerButton?.focus();
+		} else {
+			this.#scrollToSelectedOrTop();
+			this.#focusFilterOrFirstItem();
+		}
+	}
+	#handleFilterInput(event) {
+		this._filterValue = event.target.value;
+		this._focusedIndex = -1;
+	}
+	#handleKeyDown(event) {
+		if (this.disabled) return;
+		switch (event.key) {
+			case "Enter":
+			case " ":
+				if (event.target === this._triggerButton) {
+					event.preventDefault();
+					this._open = true;
+				} else if (event.key === "Enter" && this._open) {
+					event.preventDefault();
+					if (this._focusedIndex === -1) this.#handleDefaultClick();
+					else if (this._focusedIndex >= 0) this.#selectAgent(this.#filteredAgents[this._focusedIndex]);
+				}
+				break;
+			case "Escape":
+				if (this._open) {
+					event.preventDefault();
+					event.stopPropagation();
+					this._open = false;
+					this._triggerButton?.focus();
+				}
+				break;
+			case "ArrowDown":
+				event.preventDefault();
+				if (this._open) this.#moveSelection(1);
+				else if (event.target === this._triggerButton) this._open = true;
+				break;
+			case "ArrowUp":
+				event.preventDefault();
+				if (this._open) this.#moveSelection(-1);
+				break;
+			case "Home":
+				if (this._open) {
+					event.preventDefault();
+					this._focusedIndex = -1;
+					this.#updateItemFocus();
+				}
+				break;
+			case "End": if (this._open) {
+				event.preventDefault();
+				this._focusedIndex = this.#filteredAgents.length - 1;
+				this.#updateItemFocus();
+			}
+		}
+	}
+	#moveSelection(direction) {
+		const agents = this.#filteredAgents;
+		let newIndex = this._focusedIndex + direction;
+		if (newIndex < -1) newIndex = agents.length - 1;
+		else if (newIndex >= agents.length) newIndex = -1;
+		this._focusedIndex = newIndex;
+		this.#updateItemFocus();
+	}
+	#updateItemFocus() {
+		const items = this._agentList?.querySelectorAll(".agent-item");
+		const filterHasFocus = this.shadowRoot?.activeElement === this._filterInput;
+		const domIndex = this._focusedIndex + 1;
+		items?.forEach((item, index) => {
+			item.setAttribute("tabindex", index === domIndex ? "0" : "-1");
+			if (index === domIndex) {
+				item.scrollIntoView({ block: "nearest" });
+				if (!filterHasFocus) item.focus();
+			}
+		});
+	}
+	#focusFilterOrFirstItem() {
+		requestAnimationFrame(() => {
+			if (this.#shouldShowFilter && this._filterInput) this._filterInput.focus();
+			else {
+				this._focusedIndex = -1;
+				this.#updateItemFocus();
+			}
+		});
+	}
+	async #scrollToSelectedOrTop() {
+		await this.updateComplete;
+		if (!this._agentList) return;
+		const selectedItem = this._agentList.querySelector(".agent-item--selected");
+		if (selectedItem) selectedItem.scrollIntoView({ block: "nearest" });
+		else this._agentList.scrollTop = 0;
+	}
+	#selectAgent(agent) {
+		const previousAgentId = this.selectedAgentId;
+		if (agent.id === previousAgentId) {
+			this._open = false;
+			return;
+		}
+		this.dispatchEvent(new CustomEvent("forge-ai-agent-selector-change", {
+			detail: {
+				agent,
+				previousAgentId
+			},
+			bubbles: true,
+			composed: true
+		}));
+		this._open = false;
+	}
+	#handleAgentClick(agent) {
+		this.#selectAgent(agent);
+	}
+	#handleDefaultClick() {
+		if (this.#isDefaultSelected) {
+			this._open = false;
+			return;
+		}
+		this.dispatchEvent(new CustomEvent("forge-ai-agent-selector-change", {
+			detail: {
+				agent: void 0,
+				previousAgentId: this.selectedAgentId
+			},
+			bubbles: true,
+			composed: true
+		}));
+		this._open = false;
+	}
+	get #triggerTemplate() {
+		return html`
+      <button
+        class="forge-button trigger-button"
+        id="agent-selector-trigger"
+        ?disabled=${this.disabled}
+        aria-haspopup="listbox"
+        aria-expanded=${this._open}
+        @click=${this.#handleTriggerClick}
+        @keydown=${this.#handleKeyDown}>
+        <slot name="icon"></slot>
+        <span class="trigger-text">${this.#displayText}</span>
+        <svg class="dropdown-icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" aria-hidden="true">
+          <path d="M7 10l5 5 5-5z" />
+        </svg>
+      </button>
+    `;
+	}
+	get #tooltipTemplate() {
+		if (!this._isTextOverflowing) return nothing;
+		return html` <forge-ai-tooltip for="agent-selector-trigger" placement="bottom"> ${this.#tooltipContent} </forge-ai-tooltip> `;
+	}
+	get #filterFieldTemplate() {
+		return html`
+      <div class="filter-field">
+        <div class="forge-field forge-field--small">
+          <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" class="search-icon" aria-hidden="true">
+            <path
+              d="M15.5 14h-.79l-.28-.27A6.47 6.47 0 0 0 16 9.5 6.5 6.5 0 1 0 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14" />
+          </svg>
+          <input
+            type="text"
+            class="filter-input"
+            placeholder="Search agents..."
+            .value=${this._filterValue}
+            @input=${this.#handleFilterInput}
+            @keydown=${this.#handleKeyDown} />
+        </div>
+      </div>
+    `;
+	}
+	get #isDefaultSelected() {
+		return this.selectedAgentId === void 0;
+	}
+	get #defaultOptionTemplate() {
+		const isDefaultFocused = this._focusedIndex === -1 && this._open;
+		return html`
+      <div
+        class=${classMap({
+			"agent-item": true,
+			"agent-item--default": true,
+			"agent-item--focused": isDefaultFocused,
+			"agent-item--selected": this.#isDefaultSelected
+		})}
+        role="option"
+        tabindex=${isDefaultFocused ? "0" : "-1"}
+        aria-selected=${this.#isDefaultSelected}
+        @click=${this.#handleDefaultClick}>
+        <span class="agent-item__selection-icon">
+          ${when(this.#isDefaultSelected, () => html`
+              <svg class="selection-icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" aria-hidden="true">
+                <path d="M21 7 9 19l-5.5-5.5 1.41-1.41L9 16.17 19.59 5.59z" />
+              </svg>
+            `)}
+        </span>
+        <span class="agent-name">${this.#effectiveTitleText} (default)</span>
+      </div>
+      <div class="agent-list-separator" aria-hidden="true"></div>
+    `;
+	}
+	get #agentListTemplate() {
+		const agents = this.#filteredAgents;
+		if (agents.length === 0) return html`<div class="no-results">No agents found</div>`;
+		return html`
+      ${agents.map((agent, index) => html`
+          <div
+            class=${classMap({
+			"agent-item": true,
+			"agent-item--focused": index === this._focusedIndex,
+			"agent-item--selected": agent.id === this.selectedAgentId
+		})}
+            role="option"
+            tabindex=${index === this._focusedIndex ? "0" : "-1"}
+            aria-selected=${agent.id === this.selectedAgentId}
+            @click=${() => this.#handleAgentClick(agent)}>
+            <span class="agent-item__selection-icon">
+              ${when(agent.id === this.selectedAgentId, () => html`
+                  <svg class="selection-icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" aria-hidden="true">
+                    <path d="M21 7 9 19l-5.5-5.5 1.41-1.41L9 16.17 19.59 5.59z" />
+                  </svg>
+                `)}
+            </span>
+            <span class="agent-name">${agent.name}</span>
+          </div>
+        `)}
+    `;
+	}
+	get #dropdownTemplate() {
+		return html`
+      <forge-ai-popover
+        .anchor=${this._triggerButton ?? null}
+        placement="bottom-start"
+        ?open=${this._open}
+        .offset=${{ mainAxis: 4 }}
+        flip
+        shift
+        @forge-ai-popover-toggle=${this.#handlePopoverToggle}>
+        <div class="dropdown-header">Switch to another agent</div>
+        ${when(this.#shouldShowFilter, () => this.#filterFieldTemplate)}
+        <div class="agent-list" role="listbox" aria-label="Select an agent" @keydown=${this.#handleKeyDown}>
+          ${this.#defaultOptionTemplate} ${this.#agentListTemplate}
+        </div>
+      </forge-ai-popover>
+    `;
+	}
+	get #staticTitleTemplate() {
+		return html`<span class="title-text" id="agent-selector-trigger">${this.titleText}</span>`;
+	}
+	render() {
+		return html`
+      ${when(this.#hasAgents, () => html` ${this.#triggerTemplate} ${this.#tooltipTemplate} ${this.#dropdownTemplate} `, () => this.#staticTitleTemplate)}
+    `;
+	}
+};
+__decorate([property({ attribute: false })], AiAgentSelectorComponent.prototype, "agents", void 0);
+__decorate([property({ attribute: "selected-agent-id" })], AiAgentSelectorComponent.prototype, "selectedAgentId", void 0);
+__decorate([property({ attribute: "title-text" })], AiAgentSelectorComponent.prototype, "titleText", void 0);
+__decorate([property({
+	type: Boolean,
+	reflect: true
+})], AiAgentSelectorComponent.prototype, "disabled", void 0);
+__decorate([state()], AiAgentSelectorComponent.prototype, "_open", void 0);
+__decorate([state()], AiAgentSelectorComponent.prototype, "_focusedIndex", void 0);
+__decorate([state()], AiAgentSelectorComponent.prototype, "_isTextOverflowing", void 0);
+__decorate([state()], AiAgentSelectorComponent.prototype, "_filterValue", void 0);
+__decorate([query("#agent-selector-trigger")], AiAgentSelectorComponent.prototype, "_triggerButton", void 0);
+__decorate([query(".agent-list")], AiAgentSelectorComponent.prototype, "_agentList", void 0);
+__decorate([query(".filter-input")], AiAgentSelectorComponent.prototype, "_filterInput", void 0);
+AiAgentSelectorComponent = __decorate([customElement(AiAgentSelectorComponentTagName)], AiAgentSelectorComponent);
+//#endregion
+export { AiAgentSelectorComponent, AiAgentSelectorComponentTagName };

package/dist/ai-agent-selector/index.mjs

@@ -1,5 +1 @@
-import { AiAgentSelectorComponent, AiAgentSelectorComponentTagName } from "./ai-agent-selector.mjs";
-export {
-  AiAgentSelectorComponent,
-  AiAgentSelectorComponentTagName
-};
+export { AiAgentSelectorComponent, AiAgentSelectorComponentTagName } from "./ai-agent-selector2.mjs";

package/dist/ai-artifact/ai-artifact.mjs

@@ -1,39 +1,4 @@
-import { unsafeCSS, LitElement, html } from "lit";
-import { customElement } from "lit/decorators.js";
-import styles from "./ai-artifact.scss.mjs";
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __decorateClass = (decorators, target, key, kind) => {
-  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc(target, key) : target;
-  for (var i = decorators.length - 1, decorator; i >= 0; i--)
-    if (decorator = decorators[i])
-      result = decorator(result) || result;
-  return result;
-};
-const AiArtifactComponentTagName = "forge-ai-artifact";
-let AiArtifactComponent = class extends LitElement {
-  render() {
-    return html`
-      <div class="artifact">
-        <div class="forge-toolbar">
-          <div class="forge-toolbar__start">
-            <slot name="start"></slot>
-          </div>
-          <div class="forge-toolbar__end">
-            <slot name="actions"></slot>
-          </div>
-        </div>
-        <div class="content">
-          <slot></slot>
-        </div>
-      </div>
-    `;
-  }
-};
-AiArtifactComponent.styles = unsafeCSS(styles);
-AiArtifactComponent = __decorateClass([
-  customElement(AiArtifactComponentTagName)
-], AiArtifactComponent);
-export {
-  AiArtifactComponent,
-  AiArtifactComponentTagName
-};
+//#region src/lib/ai-artifact/ai-artifact.scss?inline
+var ai_artifact_default = "/**\n * @license\n * Copyright Tyler Technologies, Inc.\n * License: Apache-2.0\n */\n.forge-toolbar {\n  --_toolbar-background:var(--forge-toolbar-background, var(--forge-theme-surface, #ffffff));\n  --_toolbar-height:var(--forge-toolbar-height, 56px);\n  --_toolbar-min-height:var(--forge-toolbar-min-height, var(--_toolbar-height));\n  --_toolbar-divider-width:var(--forge-toolbar-divider-width, var(--forge-border-thin, 1px));\n  --_toolbar-divider-style:var(--forge-toolbar-divider-style, solid);\n  --_toolbar-divider-color:var(--forge-toolbar-divider-color, var(--forge-theme-outline, #e0e0e0));\n  --_toolbar-shape:var(--forge-toolbar-shape, calc(var(--forge-shape-medium, 4px) * var(--forge-shape-factor, 1)));\n  --_toolbar-start-start-shape:var(--forge-toolbar-start-start-shape, var(--_toolbar-shape));\n  --_toolbar-start-end-shape:var(--forge-toolbar-start-end-shape, var(--_toolbar-shape));\n  --_toolbar-end-start-shape:var(--forge-toolbar-end-start-shape, 0);\n  --_toolbar-end-end-shape:var(--forge-toolbar-end-end-shape, 0);\n  --_toolbar-padding:var(--forge-toolbar-padding, var(--forge-spacing-medium, 16px));\n  --_toolbar-padding-block:var(--forge-toolbar-padding-block, 0);\n  --_toolbar-padding-inline:var(--forge-toolbar-padding-inline, var(--_toolbar-padding));\n  --_toolbar-columns:var(--forge-toolbar-columns, auto 1fr auto);\n}\n\n.forge-toolbar {\n  display: grid;\n  grid-template-columns: var(--_toolbar-columns);\n  height: var(--_toolbar-height);\n  min-height: var(--_toolbar-min-height);\n  box-sizing: border-box;\n  padding-inline: 0;\n  border-block-end-width: var(--_toolbar-divider-width);\n  border-block-end-style: var(--_toolbar-divider-style);\n  border-block-end-color: var(--_toolbar-divider-color);\n  border-start-start-radius: var(--_toolbar-start-start-shape);\n  border-start-end-radius: var(--_toolbar-start-end-shape);\n  border-end-start-radius: var(--_toolbar-end-start-shape);\n  border-end-end-radius: var(--_toolbar-end-end-shape);\n  background: var(--_toolbar-background);\n  grid-template-columns: 1fr;\n  grid-template-areas: \"start\";\n}\n\n.forge-toolbar:has(.forge-toolbar__center), .forge-toolbar:has(.forge-toolbar__end) {\n  grid-template-columns: auto 1fr auto;\n  grid-template-areas: \"start center end\";\n}\n\n.forge-toolbar:has(.forge-toolbar__end):not(:has(.forge-toolbar__center)) {\n  grid-template-columns: 1fr auto;\n  grid-template-areas: \"start end\";\n}\n\n.forge-toolbar--inverted {\n  --_toolbar-start-start-shape:var(--forge-toolbar-start-start-shape, 0);\n  --_toolbar-start-end-shape:var(--forge-toolbar-start-end-shape, 0);\n  --_toolbar-end-start-shape:var(--_toolbar-shape);\n  --_toolbar-end-end-shape:var(--_toolbar-shape);\n  border-block-end: none;\n  border-block-start-width: var(--_toolbar-divider-width);\n  border-block-start-style: var(--_toolbar-divider-style);\n  border-block-start-color: var(--_toolbar-divider-color);\n}\n\n.forge-toolbar--no-divider {\n  border: none;\n}\n\n.forge-toolbar--auto-height {\n  --_toolbar-height:var(--forge-toolbar-height, auto);\n}\n\n.forge-toolbar :where(h1, h2, h3, h4, h5, h6) {\n  margin: 0;\n}\n\n.forge-toolbar__start, .forge-toolbar__center, .forge-toolbar__end {\n  display: flex;\n  align-items: center;\n  width: 100%;\n  box-sizing: border-box;\n}\n\n.forge-toolbar__start {\n  grid-area: start;\n}\n\n.forge-toolbar__center {\n  justify-content: center;\n  min-width: 0;\n  grid-area: center;\n}\n\n.forge-toolbar__end {\n  justify-content: end;\n  grid-area: end;\n}\n\n:host {\n  display: block;\n  border: 1px solid var(--forge-theme-outline, #e0e0e0);\n  border-radius: calc(var(--forge-shape-large, 8px) * var(--forge-shape-factor, 1));\n}\n\n.forge-toolbar {\n  height: auto;\n  min-height: 56px;\n  display: flex;\n  gap: 0;\n  flex-wrap: wrap;\n  padding-inline: var(--forge-spacing-medium, 16px);\n  border-start-start-radius: calc(var(--forge-shape-large, 8px) * var(--forge-shape-factor, 1));\n  border-start-end-radius: calc(var(--forge-shape-large, 8px) * var(--forge-shape-factor, 1));\n  align-items: center;\n  overflow: hidden;\n}\n\n.forge-toolbar__start {\n  -moz-osx-font-smoothing: grayscale;\n  -webkit-font-smoothing: antialiased;\n  font-family: var(--forge-typography-heading1-font-family, var(--forge-typography-font-family, \"Roboto\", sans-serif));\n  font-size: var(--forge-typography-heading1-font-size, calc(var(--forge-typography-font-size, 1rem) * var(--forge-typography-heading1-font-size-scale, 0.875)));\n  font-weight: var(--forge-typography-heading1-font-weight, 500);\n  line-height: var(--forge-typography-heading1-line-height, calc(var(--forge-typography-font-size, 1rem) * var(--forge-typography-heading1-line-height-scale, 1.125)));\n  letter-spacing: var(--forge-typography-heading1-letter-spacing, 0.0178571429em);\n  text-transform: var(--forge-typography-heading1-text-transform, inherit);\n  text-decoration: var(--forge-typography-heading1-text-decoration, inherit);\n  width: fit-content;\n  overflow: hidden;\n}\n\n.forge-toolbar__end {\n  width: auto;\n  margin-left: auto;\n  padding-block: 8px;\n  color: var(--forge-theme-text-medium, rgba(0, 0, 0, 0.6));\n}\n\n.content {\n  padding: var(--forge-ai-artifact-content-padding, var(--forge-spacing-medium, 16px));\n}";
+//#endregion
+export { ai_artifact_default as default };

package/dist/ai-artifact/ai-artifact2.mjs

@@ -0,0 +1,31 @@
+import __decorate from "../_virtual/_@oxc-project_runtime@0.154.0/helpers/esm/decorate.mjs";
+import ai_artifact_default from "./ai-artifact.mjs";
+import { LitElement, html, unsafeCSS } from "lit";
+import { customElement } from "lit/decorators.js";
+//#region src/lib/ai-artifact/ai-artifact.ts
+var AiArtifactComponentTagName = "forge-ai-artifact";
+var AiArtifactComponent = class AiArtifactComponent extends LitElement {
+	static {
+		this.styles = unsafeCSS(ai_artifact_default);
+	}
+	render() {
+		return html`
+      <div class="artifact">
+        <div class="forge-toolbar">
+          <div class="forge-toolbar__start">
+            <slot name="start"></slot>
+          </div>
+          <div class="forge-toolbar__end">
+            <slot name="actions"></slot>
+          </div>
+        </div>
+        <div class="content">
+          <slot></slot>
+        </div>
+      </div>
+    `;
+	}
+};
+AiArtifactComponent = __decorate([customElement(AiArtifactComponentTagName)], AiArtifactComponent);
+//#endregion
+export { AiArtifactComponent, AiArtifactComponentTagName };

package/dist/ai-artifact/index.d.ts

@@ -1 +1 @@
-export { AiArtifactComponent, AiArtifactComponentTagName } from './ai-artifact';
+export { AiArtifactComponent, AiArtifactComponentTagName } from './ai-artifact.js';

package/dist/ai-artifact/index.mjs

@@ -1,5 +1 @@
-import { AiArtifactComponent, AiArtifactComponentTagName } from "./ai-artifact.mjs";
-export {
-  AiArtifactComponent,
-  AiArtifactComponentTagName
-};
+export { AiArtifactComponent, AiArtifactComponentTagName } from "./ai-artifact2.mjs";

package/dist/ai-artifact-card/ai-artifact-card.mjs

@@ -1,142 +1,4 @@
-import { unsafeCSS, LitElement, html, nothing } from "lit";
-import { property, state, customElement } from "lit/decorators.js";
-import { classMap } from "lit/directives/class-map.js";
-import styles from "./ai-artifact-card.scss.mjs";
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __typeError = (msg) => {
-  throw TypeError(msg);
-};
-var __decorateClass = (decorators, target, key, kind) => {
-  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc(target, key) : target;
-  for (var i = decorators.length - 1, decorator; i >= 0; i--)
-    if (decorator = decorators[i])
-      result = (kind ? decorator(target, key, result) : decorator(result)) || result;
-  if (kind && result) __defProp(target, key, result);
-  return result;
-};
-var __accessCheck = (obj, member, msg) => member.has(obj) || __typeError("Cannot " + msg);
-var __privateGet = (obj, member, getter) => (__accessCheck(obj, member, "read from private field"), getter ? getter.call(obj) : member.get(obj));
-var __privateAdd = (obj, member, value) => member.has(obj) ? __typeError("Cannot add the same private member more than once") : member instanceof WeakSet ? member.add(obj) : member.set(obj, value);
-var __privateMethod = (obj, member, method) => (__accessCheck(obj, member, "access private method"), method);
-var _defaultIcon, _arrowIcon, _AiArtifactCardComponent_instances, detectGroup_fn, handleClick_fn, actionLabel_get;
-const AiArtifactCardComponentTagName = "forge-ai-artifact-card";
-const AI_ARTIFACT_CARD_COLLAPSED_ATTRIBUTE = "data-collapsed";
-const GROUP_TAG_NAME = "forge-ai-artifact-card-group";
-let AiArtifactCardComponent = class extends LitElement {
-  constructor() {
-    super(...arguments);
-    __privateAdd(this, _AiArtifactCardComponent_instances);
-    this.titleText = "";
-    this.subtitleText = "";
-    this.assetId = "";
-    this.active = false;
-    this.disabled = false;
-    this._grouped = false;
-    __privateAdd(this, _defaultIcon, html`
-    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" aria-hidden="true">
-      <path
-        d="M19 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2m0 16H5V5h14zM7 10h2v7H7zm4-3h2v10h-2zm4 6h2v4h-2z" />
-    </svg>
-  `);
-    __privateAdd(this, _arrowIcon, html`
-    <svg class="arrow" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 18 18" fill="none" aria-hidden="true">
-      <path
-        d="M5.25 5.25H12.75V12.75M5.25 12.75L12.75 5.25"
-        stroke="currentColor"
-        stroke-width="1.5"
-        stroke-linecap="round"
-        stroke-linejoin="round" />
-    </svg>
-  `);
-  }
-  connectedCallback() {
-    super.connectedCallback();
-    __privateMethod(this, _AiArtifactCardComponent_instances, detectGroup_fn).call(this);
-  }
-  render() {
-    return html`
-      <button
-        class=${classMap({ "artifact-card": true, "artifact-card--grouped": this._grouped })}
-        type="button"
-        aria-current=${this.active ? "true" : nothing}
-        ?disabled=${this.disabled}
-        @click=${__privateMethod(this, _AiArtifactCardComponent_instances, handleClick_fn)}>
-        <span class="icon" aria-hidden="true">
-          <slot name="icon">${__privateGet(this, _defaultIcon)}</slot>
-        </span>
-        <span class="text">
-          <span class="title">${this.titleText}</span>
-          <span class="subtitle">${this.subtitleText}</span>
-        </span>
-        <span class="action" aria-hidden="true">
-          <slot name="action-icon">${__privateGet(this, _arrowIcon)}</slot>
-        </span>
-        ${__privateGet(this, _AiArtifactCardComponent_instances, actionLabel_get)}
-        <span class="focus-indicator"></span>
-      </button>
-    `;
-  }
-};
-_defaultIcon = /* @__PURE__ */ new WeakMap();
-_arrowIcon = /* @__PURE__ */ new WeakMap();
-_AiArtifactCardComponent_instances = /* @__PURE__ */ new WeakSet();
-detectGroup_fn = function() {
-  this._grouped = this.parentElement?.tagName.toLowerCase() === GROUP_TAG_NAME;
-  if (this._grouped) {
-    this.setAttribute("role", "listitem");
-    return;
-  }
-  if (this.getAttribute("role") === "listitem") {
-    this.removeAttribute("role");
-  }
-  this.removeAttribute(AI_ARTIFACT_CARD_COLLAPSED_ATTRIBUTE);
-};
-handleClick_fn = function() {
-  if (this.disabled) {
-    return;
-  }
-  this.dispatchEvent(
-    new CustomEvent("forge-ai-artifact-card-open", {
-      detail: { assetId: this.assetId },
-      bubbles: true,
-      composed: true
-    })
-  );
-};
-actionLabel_get = function() {
-  if (!this.actionLabel) {
-    return nothing;
-  }
-  return html`<span class="sr-only">${this.actionLabel}</span>`;
-};
-AiArtifactCardComponent.styles = unsafeCSS(styles);
-__decorateClass([
-  property({ attribute: "title-text" })
-], AiArtifactCardComponent.prototype, "titleText", 2);
-__decorateClass([
-  property({ attribute: "subtitle-text" })
-], AiArtifactCardComponent.prototype, "subtitleText", 2);
-__decorateClass([
-  property({ attribute: "action-label" })
-], AiArtifactCardComponent.prototype, "actionLabel", 2);
-__decorateClass([
-  property({ attribute: "asset-id" })
-], AiArtifactCardComponent.prototype, "assetId", 2);
-__decorateClass([
-  property({ type: Boolean, reflect: true })
-], AiArtifactCardComponent.prototype, "active", 2);
-__decorateClass([
-  property({ type: Boolean, reflect: true })
-], AiArtifactCardComponent.prototype, "disabled", 2);
-__decorateClass([
-  state()
-], AiArtifactCardComponent.prototype, "_grouped", 2);
-AiArtifactCardComponent = __decorateClass([
-  customElement(AiArtifactCardComponentTagName)
-], AiArtifactCardComponent);
-export {
-  AI_ARTIFACT_CARD_COLLAPSED_ATTRIBUTE,
-  AiArtifactCardComponent,
-  AiArtifactCardComponentTagName
-};
+//#region src/lib/ai-artifact-card/ai-artifact-card.scss?inline
+var ai_artifact_card_default = "@keyframes fadein {\n  from {\n    opacity: 0;\n  }\n  to {\n    opacity: 1;\n  }\n}\n@keyframes forge-focus-indicator-outward-grow {\n  from {\n    outline-width: 0;\n  }\n  to {\n    outline-width: var(--_focus-indicator-active-width);\n  }\n}\n@keyframes forge-focus-indicator-outward-shrink {\n  from {\n    outline-width: var(--_focus-indicator-active-width);\n  }\n}\n@keyframes forge-focus-indicator-inward-grow {\n  from {\n    border-width: 0;\n  }\n  to {\n    border-width: var(--_focus-indicator-active-width);\n  }\n}\n@keyframes forge-focus-indicator-inward-shrink {\n  from {\n    border-width: var(--_focus-indicator-active-width);\n  }\n}\n:host {\n  --_accent-color: var(--forge-ai-artifact-card-accent-color, var(--forge-theme-primary, #3f51b5));\n  --_border-radius: var(--forge-ai-artifact-card-border-radius, 12px);\n  display: block;\n}\n\n:host([hidden]),\n:host([data-collapsed]) {\n  display: none;\n}\n\n/*\n * Hover and press feedback come from the Forge state layer. The active ring is drawn outside the border\n * with a spread shadow rather than a thicker border, so the card's layout never shifts between states.\n */\n.artifact-card {\n  position: relative;\n  display: flex;\n  align-items: center;\n  width: 100%;\n  min-height: 64px;\n  gap: var(--forge-ai-artifact-card-gap, var(--forge-spacing-small, 12px));\n  padding: var(--forge-ai-artifact-card-padding, var(--forge-spacing-xsmall, 8px) var(--forge-spacing-small, 12px));\n  border: 1px solid var(--forge-theme-outline, #e0e0e0);\n  border-radius: var(--_border-radius);\n  background: var(--forge-ai-artifact-card-background, var(--forge-theme-surface, #ffffff));\n  color: inherit;\n  font: inherit;\n  text-align: start;\n  cursor: pointer;\n  outline: none;\n  transition: box-shadow 150ms ease, border-color 150ms ease;\n  --_state-layer-display: var(--forge-state-layer-display, flex);\n  --_state-layer-color: var(--forge-state-layer-color, var(--forge-theme-on-surface, #000000));\n  --_state-layer-hover-color: var(--forge-state-layer-hover-color, var(--_state-layer-color));\n  --_state-layer-hover-opacity: var(--forge-state-layer-hover-opacity, 0.08);\n  --_state-layer-pressed-color: var(--forge-state-layer-pressed-color, var(--_state-layer-color));\n  --_state-layer-pressed-opacity: var(--forge-state-layer-pressed-opacity, 0.12);\n  --_state-layer-hover-duration: var(--forge-state-layer-hover-duration, 15ms);\n  --_state-layer-pressed-duration: var(--forge-state-layer-pressed-duration, 105ms);\n  --_state-layer-animation-duration: var(--forge-state-layer-animation-duration, 375ms);\n}\n.artifact-card::before {\n  opacity: 0;\n  position: absolute;\n  backface-visibility: hidden;\n  transform: translateZ(0);\n  background-color: var(--_state-layer-hover-color);\n  inset: 0;\n  transition: opacity var(--_state-layer-hover-duration) linear, background-color var(--_state-layer-hover-duration) linear;\n  --_state-layer-hover-duration: var(--forge-state-layer-hover-duration, 100ms);\n  content: \"\";\n  opacity: 0;\n  border-radius: inherit;\n}\n.artifact-card:hover::before {\n  background-color: var(--_state-layer-hover-color);\n  opacity: var(--_state-layer-hover-opacity);\n}\n.artifact-card:active::before {\n  opacity: var(--_state-layer-pressed-opacity);\n  transition-duration: var(--_state-layer-pressed-duration);\n  --_state-layer-pressed-opacity: var(--forge-state-layer-pressed-opacity, 0.18);\n}\n.artifact-card:disabled {\n  opacity: 0.5;\n  cursor: default;\n}\n.artifact-card:disabled::before {\n  display: none;\n}\n\n:host([active]) .artifact-card {\n  border-color: color-mix(in srgb, var(--_accent-color) 40%, transparent);\n  background: var(--forge-theme-surface-container-minimum, #f5f5f5);\n  box-shadow: 0 0 0 2px color-mix(in srgb, var(--_accent-color) 8%, transparent);\n}\n\n.focus-indicator {\n  position: absolute;\n  display: none;\n}\n\n.artifact-card:focus-visible .focus-indicator {\n  --_focus-indicator-display: var(--forge-focus-indicator-display, flex);\n  --_focus-indicator-width: var(--forge-focus-indicator-width, var(--forge-border-medium, 2px));\n  --_focus-indicator-active-width: var(--forge-focus-indicator-active-width, 6px);\n  --_focus-indicator-color: var(--forge-focus-indicator-color, var(--forge-theme-primary, #3f51b5));\n  --_focus-indicator-shape: var(--forge-focus-indicator-shape, calc(var(--forge-shape-extra-small, 1px) * var(--forge-shape-factor, 1)));\n  --_focus-indicator-duration: var(--forge-focus-indicator-duration, var(--forge-animation-duration-long4, 600ms));\n  --_focus-indicator-easing: var(--forge-focus-indicator-easing, var(--forge-animation-easing-emphasized, cubic-bezier(0.2, 0, 0, 1)));\n  --_focus-indicator-shape-start-start: var(--forge-focus-indicator-shape-start-start, var(--_focus-indicator-shape));\n  --_focus-indicator-shape-start-end: var(--forge-focus-indicator-shape-start-end, var(--_focus-indicator-shape));\n  --_focus-indicator-shape-end-end: var(--forge-focus-indicator-shape-end-end, var(--_focus-indicator-shape));\n  --_focus-indicator-shape-end-start: var(--forge-focus-indicator-shape-end-start, var(--_focus-indicator-shape));\n  --_focus-indicator-outward-offset: var(--forge-focus-indicator-outward-offset, var(--forge-spacing-xxsmall, 4px));\n  --_focus-indicator-inward-offset: var(--forge-focus-indicator-inward-offset, 0px);\n  --_focus-indicator-offset-block: var(--forge-focus-indicator-offset-block, 0);\n  --_focus-indicator-offset-inline: var(--forge-focus-indicator-offset-inline, 0);\n  animation-delay: 0s, calc(var(--_focus-indicator-duration) * 0.25);\n  animation-duration: calc(var(--_focus-indicator-duration) * 0.25), calc(var(--_focus-indicator-duration) * 0.75);\n  animation-timing-function: var(--_focus-indicator-easing);\n  box-sizing: border-box;\n  color: var(--_focus-indicator-color);\n  display: none;\n  pointer-events: none;\n  position: absolute;\n  margin-block: var(--_focus-indicator-offset-block);\n  margin-inline: var(--_focus-indicator-offset-inline);\n  animation-name: forge-focus-indicator-inward-grow, forge-focus-indicator-inward-shrink;\n  border-end-end-radius: calc(var(--_focus-indicator-shape-end-end) - var(--_focus-indicator-inward-offset));\n  border-end-start-radius: calc(var(--_focus-indicator-shape-end-start) - var(--_focus-indicator-inward-offset));\n  border-start-end-radius: calc(var(--_focus-indicator-shape-start-end) - var(--_focus-indicator-inward-offset));\n  border-start-start-radius: calc(var(--_focus-indicator-shape-start-start) - var(--_focus-indicator-inward-offset));\n  border: var(--_focus-indicator-width) solid currentColor;\n  inset: var(--_focus-indicator-inward-offset);\n  display: block;\n  --forge-focus-indicator-shape: var(--_border-radius);\n}\n\n.icon {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  flex-shrink: 0;\n  box-sizing: border-box;\n  width: var(--forge-spacing-xlarge, 32px);\n  height: var(--forge-spacing-xlarge, 32px);\n  border: 1px solid var(--forge-theme-outline, #e0e0e0);\n  border-radius: 6px;\n  background: var(--forge-theme-surface-container-minimum, #f5f5f5);\n  color: var(--forge-theme-text-high, rgba(0, 0, 0, 0.87));\n}\n\n.icon svg,\n.icon ::slotted(*) {\n  display: block;\n  width: 16px;\n  height: 16px;\n  fill: currentColor;\n}\n\n.text {\n  display: flex;\n  flex-direction: column;\n  flex: 1;\n  min-width: 0;\n}\n\n.title {\n  -moz-osx-font-smoothing: grayscale;\n  -webkit-font-smoothing: antialiased;\n  font-family: var(--forge-typography-body1-font-family, var(--forge-typography-font-family, \"Roboto\", sans-serif));\n  font-size: var(--forge-typography-body1-font-size, calc(var(--forge-typography-font-size, 1rem) * var(--forge-typography-body-font-size-scale, 0.875)));\n  font-weight: var(--forge-typography-body1-font-weight, 400);\n  line-height: var(--forge-typography-body1-line-height, calc(var(--forge-typography-font-size, 1rem) * var(--forge-typography-body-line-height-scale, 1.125)));\n  letter-spacing: var(--forge-typography-body1-letter-spacing, 0.0357142857em);\n  text-transform: var(--forge-typography-body1-text-transform, inherit);\n  text-decoration: var(--forge-typography-body1-text-decoration, inherit);\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  font-weight: 500;\n  color: var(--forge-theme-text-high, rgba(0, 0, 0, 0.87));\n}\n\n.subtitle {\n  -moz-osx-font-smoothing: grayscale;\n  -webkit-font-smoothing: antialiased;\n  font-family: var(--forge-typography-label1-font-family, var(--forge-typography-font-family, \"Roboto\", sans-serif));\n  font-size: var(--forge-typography-label1-font-size, calc(var(--forge-typography-font-size, 1rem) * var(--forge-typography-label-font-size-scale, 0.75)));\n  font-weight: var(--forge-typography-label1-font-weight, 400);\n  line-height: var(--forge-typography-label1-line-height, calc(var(--forge-typography-font-size, 1rem) * var(--forge-typography-label-line-height-scale, 1.25)));\n  letter-spacing: var(--forge-typography-label1-letter-spacing, 0.0357142857em);\n  text-transform: var(--forge-typography-label1-text-transform, inherit);\n  text-decoration: var(--forge-typography-label1-text-decoration, inherit);\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  color: var(--forge-theme-text-medium, rgba(0, 0, 0, 0.6));\n}\n\n.action {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  flex-shrink: 0;\n  width: var(--forge-spacing-xlarge, 32px);\n  height: var(--forge-spacing-xlarge, 32px);\n  color: var(--forge-theme-text-medium, rgba(0, 0, 0, 0.6));\n}\n\n.action svg,\n.action ::slotted(*) {\n  display: block;\n  width: 18px;\n  height: 18px;\n  fill: currentColor;\n}\n\n/*\n * The default arrow promises the card opens something, which the active card already is. Its space is\n * kept so the text doesn't reflow when a card becomes active. Slotted action icons stay visible.\n */\n:host([active]) .arrow {\n  visibility: hidden;\n}\n\n.sr-only {\n  position: absolute;\n  width: 1px;\n  height: 1px;\n  padding: 0;\n  margin: -1px;\n  overflow: hidden;\n  clip: rect(0, 0, 0, 0);\n  white-space: nowrap;\n  border: 0;\n}\n\n/*\n * Inside a group the card becomes a list row: the group draws the border, corners, and dividers,\n * so the row gives those up and shows active as a fill rather than a ring.\n */\n.artifact-card--grouped {\n  min-height: var(--forge-spacing-xxxlarge, 56px);\n  border: none;\n  border-radius: 0;\n}\n\n/*\n * Square, because the group clips its rows to its own rounded corners. The group hands the top and bottom\n * rows its inner radius so their rings follow the curve instead of being cut off.\n */\n.artifact-card--grouped:focus-visible .focus-indicator {\n  --forge-focus-indicator-shape-start-start: var(--_forge-ai-artifact-card-group-start-radius, 0px);\n  --forge-focus-indicator-shape-start-end: var(--_forge-ai-artifact-card-group-start-radius, 0px);\n  --forge-focus-indicator-shape-end-start: var(--_forge-ai-artifact-card-group-end-radius, 0px);\n  --forge-focus-indicator-shape-end-end: var(--_forge-ai-artifact-card-group-end-radius, 0px);\n}\n\n:host([active]) .artifact-card--grouped {\n  background: color-mix(in srgb, var(--_accent-color) 8%, transparent);\n  box-shadow: none;\n}";
+//#endregion
+export { ai_artifact_card_default as default };