@tylertech/forge-ai 0.1.0

package/dist/ai-embedded-chat/ai-embedded-chat.mjs

@@ -0,0 +1,139 @@
+import { unsafeCSS, LitElement, html } from "lit";
+import { property, state, customElement } from "lit/decorators.js";
+import { createRef, ref } from "lit/directives/ref.js";
+import { when } from "lit/directives/when.js";
+import "../ai-modal/ai-modal.mjs";
+import "../ai-chat-interface/ai-chat-interface.mjs";
+import "../ai-gradient-container/ai-gradient-container.mjs";
+import styles from "./ai-embedded-chat.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 _modalRef, _AiEmbeddedChatComponent_instances, chatInterface_get, handleHeaderExpand_fn, handleHeaderMinimize_fn, handleModalClose_fn, handleModalFullscreenChange_fn, dispatchEvent_fn;
+const AiEmbeddedChatComponentTagName = "forge-ai-embedded-chat";
+let AiEmbeddedChatComponent = class extends LitElement {
+  constructor() {
+    super(...arguments);
+    __privateAdd(this, _AiEmbeddedChatComponent_instances);
+    this.expanded = false;
+    this.gradientVariant = "medium";
+    this._isModalFullscreen = false;
+    __privateAdd(this, _modalRef, createRef());
+  }
+  updated() {
+    if (__privateGet(this, _modalRef).value && this._isModalFullscreen !== __privateGet(this, _modalRef).value.fullscreen) {
+      this._isModalFullscreen = __privateGet(this, _modalRef).value.fullscreen ?? false;
+    }
+  }
+  render() {
+    return html`
+      ${when(
+      this.expanded,
+      () => html`
+          <forge-ai-modal
+            ${ref(__privateGet(this, _modalRef))}
+            ?open=${this.expanded}
+            @forge-ai-modal-close=${__privateMethod(this, _AiEmbeddedChatComponent_instances, handleModalClose_fn)}
+            @forge-ai-modal-fullscreen-change=${__privateMethod(this, _AiEmbeddedChatComponent_instances, handleModalFullscreenChange_fn)}>
+            ${__privateGet(this, _AiEmbeddedChatComponent_instances, chatInterface_get)}
+          </forge-ai-modal>
+        `,
+      () => html`
+          <forge-ai-gradient-container variant=${this.gradientVariant}>
+            ${__privateGet(this, _AiEmbeddedChatComponent_instances, chatInterface_get)}
+          </forge-ai-gradient-container>
+        `
+    )}
+    `;
+  }
+  /**
+   * Expands the chat to modal view.
+   */
+  expand() {
+    if (!this.expanded) {
+      this.expanded = true;
+      __privateMethod(this, _AiEmbeddedChatComponent_instances, dispatchEvent_fn).call(this, "forge-ai-embedded-chat-expand");
+    }
+  }
+  /**
+   * Collapses the chat from modal view back to embedded view.
+   */
+  collapse() {
+    if (this.expanded) {
+      this.expanded = false;
+      __privateMethod(this, _AiEmbeddedChatComponent_instances, dispatchEvent_fn).call(this, "forge-ai-embedded-chat-collapse");
+    }
+  }
+};
+_modalRef = /* @__PURE__ */ new WeakMap();
+_AiEmbeddedChatComponent_instances = /* @__PURE__ */ new WeakSet();
+chatInterface_get = function() {
+  return html`
+      <forge-ai-chat-interface
+        show-expand-button
+        ?expanded=${this.expanded}
+        @forge-ai-chat-header-expand=${__privateMethod(this, _AiEmbeddedChatComponent_instances, handleHeaderExpand_fn)}
+        @forge-ai-chat-header-minimize=${__privateMethod(this, _AiEmbeddedChatComponent_instances, handleHeaderMinimize_fn)}>
+        <slot></slot>
+        <slot name="suggestions" slot="suggestions"></slot>
+        <slot name="prompt" slot="prompt"></slot>
+      </forge-ai-chat-interface>
+    `;
+};
+handleHeaderExpand_fn = function() {
+  this.expanded = !this.expanded;
+  if (this.expanded) {
+    __privateMethod(this, _AiEmbeddedChatComponent_instances, dispatchEvent_fn).call(this, "forge-ai-embedded-chat-expand");
+  } else {
+    __privateMethod(this, _AiEmbeddedChatComponent_instances, dispatchEvent_fn).call(this, "forge-ai-embedded-chat-collapse");
+  }
+};
+handleHeaderMinimize_fn = function() {
+  this.collapse();
+};
+handleModalClose_fn = function() {
+  if (this.expanded) {
+    this.collapse();
+  }
+};
+handleModalFullscreenChange_fn = function(event) {
+  this._isModalFullscreen = event.detail.isFullscreen;
+};
+dispatchEvent_fn = function(type) {
+  const event = new CustomEvent(type, {
+    bubbles: true,
+    composed: true
+  });
+  this.dispatchEvent(event);
+};
+AiEmbeddedChatComponent.styles = unsafeCSS(styles);
+__decorateClass([
+  property({ type: Boolean })
+], AiEmbeddedChatComponent.prototype, "expanded", 2);
+__decorateClass([
+  property({ attribute: "gradient-variant" })
+], AiEmbeddedChatComponent.prototype, "gradientVariant", 2);
+__decorateClass([
+  state()
+], AiEmbeddedChatComponent.prototype, "_isModalFullscreen", 2);
+AiEmbeddedChatComponent = __decorateClass([
+  customElement(AiEmbeddedChatComponentTagName)
+], AiEmbeddedChatComponent);
+export {
+  AiEmbeddedChatComponent,
+  AiEmbeddedChatComponentTagName
+};

package/dist/ai-embedded-chat/ai-embedded-chat.scss.mjs

@@ -0,0 +1,4 @@
+const styles = "/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n:host {\n  display: block;\n}\n\n.ai-embedded-chat {\n  display: contents;\n}";
+export {
+  styles as default
+};

package/dist/ai-embedded-chat/index.d.ts

@@ -0,0 +1 @@
+export * from './ai-embedded-chat';

package/dist/ai-embedded-chat/index.mjs

@@ -0,0 +1,5 @@
+import { AiEmbeddedChatComponent, AiEmbeddedChatComponentTagName } from "./ai-embedded-chat.mjs";
+export {
+  AiEmbeddedChatComponent,
+  AiEmbeddedChatComponentTagName
+};

package/dist/ai-empty-state/ai-empty-state.d.ts

@@ -0,0 +1,19 @@
+import { LitElement, TemplateResult } from 'lit';
+declare global {
+    interface HTMLElementTagNameMap {
+        'forge-ai-empty-state': AiEmptyStateComponent;
+    }
+}
+export declare const AiEmptyStateComponentTagName: keyof HTMLElementTagNameMap;
+/**
+ * @tag forge-ai-empty-state
+ *
+ * @slot - The custom welcome message content.
+ * @slot actions - The actions or suggestions to display below the message.
+ */
+export declare class AiEmptyStateComponent extends LitElement {
+    #private;
+    static styles: import('lit').CSSResult;
+    private _slottedNodes;
+    render(): TemplateResult;
+}

package/dist/ai-empty-state/ai-empty-state.mjs

@@ -0,0 +1,136 @@
+import { unsafeCSS, LitElement, html } from "lit";
+import { queryAssignedNodes, customElement } from "lit/decorators.js";
+import { when } from "lit/directives/when.js";
+import styles from "./ai-empty-state.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 _messageSlot, _defaultMessage, _AiEmptyStateComponent_instances, messageContent_get, handleSlotChange_fn;
+const AiEmptyStateComponentTagName = "forge-ai-empty-state";
+let AiEmptyStateComponent = class extends LitElement {
+  constructor() {
+    super(...arguments);
+    __privateAdd(this, _AiEmptyStateComponent_instances);
+    __privateAdd(this, _messageSlot, html`<slot @slotchange=${__privateMethod(this, _AiEmptyStateComponent_instances, handleSlotChange_fn)}></slot>`);
+    __privateAdd(this, _defaultMessage, html`Welcome to AI Assistant! Start a conversation by asking a question or describing what
+  you'd like help with.`);
+  }
+  render() {
+    return html` <div class="forge-page-state">
+      <div class="welcome-container">
+        <svg xmlns="http://www.w3.org/2000/svg" id="Layer_1" data-name="Layer 1" viewBox="0 0 92 92" class="graphic">
+          <defs>
+            <style>
+              .cls-1,
+              .cls-7 {
+                fill: none;
+              }
+              .cls-2 {
+                fill: #d0dbf4;
+                fill-rule: evenodd;
+              }
+              .cls-3 {
+                fill: #fff;
+                stroke-width: 2.5px;
+              }
+              .cls-3,
+              .cls-4,
+              .cls-5 {
+                stroke: #586ab1;
+                stroke-linecap: round;
+                stroke-linejoin: round;
+              }
+              .cls-4 {
+                fill: #fcbf12;
+              }
+              .cls-4,
+              .cls-5 {
+                stroke-width: 2px;
+              }
+              .cls-5 {
+                fill: #5cc5cd;
+              }
+              .cls-6 {
+                fill: #586ab1;
+              }
+              .cls-7 {
+                stroke: #d1d1d1;
+                stroke-miterlimit: 10;
+                stroke-width: 0.75px;
+              }
+            </style>
+          </defs>
+          <title>books-spot</title>
+          <rect class="cls-1" x="0.09" y="0.05" width="92" height="92" />
+          <path class="cls-2" d="M46.1,82a36,36,0,1,0-36-36A36,36,0,0,0,46.1,82Z" />
+          <rect class="cls-3" x="13.81" y="64.02" width="64.9" height="8.3" rx="1" />
+          <rect class="cls-4" x="12.19" y="61.41" width="67.72" height="3.69" rx="1" />
+          <rect class="cls-4" x="12.19" y="71.99" width="67.72" height="3.69" rx="1" />
+          <rect
+            class="cls-5"
+            x="25.75"
+            y="8.77"
+            width="12.26"
+            height="51.94"
+            rx="1"
+            transform="translate(14.61 -9.14) rotate(21.06)" />
+          <rect
+            class="cls-6"
+            x="20.89"
+            y="47.21"
+            width="10.63"
+            height="4.51"
+            transform="translate(19.53 -6.11) rotate(21.06)" />
+          <line class="cls-7" x1="15.05" y1="67.62" x2="77.45" y2="67.69" />
+          <line class="cls-7" x1="15.05" y1="69.49" x2="77.45" y2="69.55" />
+          <rect class="cls-4" x="47.18" y="8.29" width="12.26" height="51.94" rx="1" />
+          <rect class="cls-6" x="47.99" y="47.79" width="10.63" height="4.51" />
+          <polygon class="cls-6" points="55.47 17.96 53.08 15.96 50.75 17.96 50.75 8.81 55.47 8.81 55.47 17.96" />
+          <rect class="cls-5" x="59.69" y="8.29" width="12.26" height="51.94" rx="1" />
+          <rect class="cls-6" x="60.49" y="47.79" width="10.63" height="4.51" />
+        </svg>
+        <div class="forge-page-state__message message">${__privateGet(this, _AiEmptyStateComponent_instances, messageContent_get)}</div>
+        <slot name="actions"></slot>
+      </div>
+    </div>`;
+  }
+};
+_messageSlot = /* @__PURE__ */ new WeakMap();
+_defaultMessage = /* @__PURE__ */ new WeakMap();
+_AiEmptyStateComponent_instances = /* @__PURE__ */ new WeakSet();
+messageContent_get = function() {
+  const hasCustomContent = this._slottedNodes.length > 0;
+  return when(
+    hasCustomContent,
+    () => __privateGet(this, _messageSlot),
+    () => __privateGet(this, _defaultMessage)
+  );
+};
+handleSlotChange_fn = function() {
+  this.requestUpdate();
+};
+AiEmptyStateComponent.styles = unsafeCSS(styles);
+__decorateClass([
+  queryAssignedNodes({ flatten: true })
+], AiEmptyStateComponent.prototype, "_slottedNodes", 2);
+AiEmptyStateComponent = __decorateClass([
+  customElement(AiEmptyStateComponentTagName)
+], AiEmptyStateComponent);
+export {
+  AiEmptyStateComponent,
+  AiEmptyStateComponentTagName
+};

package/dist/ai-empty-state/ai-empty-state.scss.mjs

@@ -0,0 +1,4 @@
+const styles = '/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/* prettier-ignore */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/* prettier-ignore */\n.forge-page-state {\n  --_page-state-width: var(--forge-page-state-width, 576px);\n  --_page-state-height: var(--forge-page-state-height, auto);\n  --_page-state-spacing: var(--forge-page-state-spacing, var(--forge-spacing-xxxlarge, 56px));\n  --_page-state-mobile-width: var(--forge-page-state-mobile-width, 70%);\n  --_page-state-graphic-height: var(--forge-page-state-graphic-height, 296px);\n  --_page-state-graphic-spacing: var(--forge-page-state-graphic-spacing, var(--forge-spacing-xxxlarge, 56px));\n  --_page-state-mobile-graphic-height: var(--forge-page-state-mobile-graphic-height, auto);\n  --_page-state-title-color: var(--forge-page-state-title-color, var(--forge-theme-text-medium, rgba(0, 0, 0, 0.6)));\n  --_page-state-title-spacing: var(--forge-page-state-title-spacing, var(--forge-spacing-xxxlarge, 56px));\n  --_page-state-title-spacing-mobile: var(--forge-page-state-title-spacing-mobile, var(--forge-spacing-large, 24px));\n  --_page-state-message-color: var(--forge-page-state-message-color, var(--forge-theme-text-high, rgba(0, 0, 0, 0.87)));\n  --_page-state-message-spacing: var(--forge-page-state-message-spacing, var(--forge-spacing-xxxlarge, 56px));\n  --_page-state-message-spacing-mobile: var(--forge-page-state-message-spacing-mobile, var(--forge-spacing-large, 24px));\n  --_page-state-actions-spacing: var(--forge-page-state-actions-spacing, 16px);\n}\n\n.forge-page-state {\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  width: 100%;\n  container-type: inline-size;\n  width: var(--_page-state-width);\n  margin-block: var(--_page-state-spacing);\n  text-align: center;\n  width: auto;\n  margin-inline: auto;\n  flex-direction: column;\n}\n\n.forge-page-state__graphic {\n  height: 100%;\n  width: 100%;\n  height: var(--_page-state-graphic-height);\n  width: 100%;\n  margin-block-end: var(--_page-state-graphic-spacing);\n}\n\n.forge-page-state__title, .forge-page-state__message {\n  max-width: var(--_page-state-width);\n}\n\n.forge-page-state__title {\n  -moz-osx-font-smoothing: grayscale;\n  -webkit-font-smoothing: antialiased;\n  font-family: var(--forge-typography-heading8-font-family, var(--forge-typography-font-family, "Roboto", sans-serif));\n  font-size: var(--forge-typography-heading8-font-size, calc(var(--forge-typography-font-size, 1rem) * var(--forge-typography-heading8-font-size-scale, 2.25)));\n  font-weight: var(--forge-typography-heading8-font-weight, 500);\n  line-height: var(--forge-typography-heading8-line-height, calc(var(--forge-typography-font-size, 1rem) * var(--forge-typography-heading8-line-height-scale, 2.625)));\n  letter-spacing: var(--forge-typography-heading8-letter-spacing, -0.0027777778em);\n  text-transform: var(--forge-typography-heading8-text-transform, inherit);\n  text-decoration: var(--forge-typography-heading8-text-decoration, inherit);\n  --_page-state-title-spacing: var(--_page-state-title-spacing-mobile);\n  color: var(--_page-state-title-color);\n  margin-block: var(--_page-state-title-spacing);\n}\n\n.forge-page-state__message {\n  -moz-osx-font-smoothing: grayscale;\n  -webkit-font-smoothing: antialiased;\n  font-family: var(--forge-typography-body4-font-family, var(--forge-typography-font-family, "Roboto", sans-serif));\n  font-size: var(--forge-typography-body4-font-size, calc(var(--forge-typography-font-size, 1rem) * var(--forge-typography-body-font-size-scale, 1.25)));\n  font-weight: var(--forge-typography-body4-font-weight, 400);\n  line-height: var(--forge-typography-body4-line-height, calc(var(--forge-typography-font-size, 1rem) * var(--forge-typography-body-line-height-scale, 1.75)));\n  letter-spacing: var(--forge-typography-body4-letter-spacing, 0.005em);\n  text-transform: var(--forge-typography-body4-text-transform, inherit);\n  text-decoration: var(--forge-typography-body4-text-decoration, inherit);\n  --_page-state-message-spacing: var(--_page-state-message-spacing-mobile);\n  color: var(--_page-state-message-color);\n  margin-block-end: var(--_page-state-message-spacing);\n}\n\n.forge-page-state__actions {\n  display: grid;\n  justify-content: center;\n  grid-auto-flow: column;\n  gap: var(--_page-state-actions-spacing);\n}\n\n@container (max-width: 599px) {\n  .forge-page-state__graphic {\n    --_page-state-graphic-height: var(--_page-state-mobile-graphic-height);\n    --_page-state-graphic-spacing: var(--forge-page-state-graphic-spacing, 0);\n    width: var(--_page-state-mobile-width);\n    height: auto;\n    margin-block-end: 0;\n  }\n  .forge-page-state__title, .forge-page-state__message {\n    --_page-state-width: var(--_page-state-mobile-width);\n  }\n  .forge-page-state__title {\n    -moz-osx-font-smoothing: grayscale;\n    -webkit-font-smoothing: antialiased;\n    font-family: var(--forge-typography-heading5-font-family, var(--forge-typography-font-family, "Roboto", sans-serif));\n    font-size: var(--forge-typography-heading5-font-size, calc(var(--forge-typography-font-size, 1rem) * var(--forge-typography-heading5-font-size-scale, 1.5)));\n    font-weight: var(--forge-typography-heading5-font-weight, 500);\n    line-height: var(--forge-typography-heading5-line-height, calc(var(--forge-typography-font-size, 1rem) * var(--forge-typography-heading5-line-height-scale, 1.75)));\n    letter-spacing: var(--forge-typography-heading5-letter-spacing, 0em);\n    text-transform: var(--forge-typography-heading5-text-transform, inherit);\n    text-decoration: var(--forge-typography-heading5-text-decoration, inherit);\n  }\n  .forge-page-state__message {\n    -moz-osx-font-smoothing: grayscale;\n    -webkit-font-smoothing: antialiased;\n    font-family: var(--forge-typography-body2-font-family, var(--forge-typography-font-family, "Roboto", sans-serif));\n    font-size: var(--forge-typography-body2-font-size, calc(var(--forge-typography-font-size, 1rem) * var(--forge-typography-body-font-size-scale, 1)));\n    font-weight: var(--forge-typography-body2-font-weight, 400);\n    line-height: var(--forge-typography-body2-line-height, calc(var(--forge-typography-font-size, 1rem) * var(--forge-typography-body-line-height-scale, 1.375)));\n    letter-spacing: var(--forge-typography-body2-letter-spacing, 0.015625em);\n    text-transform: var(--forge-typography-body2-text-transform, inherit);\n    text-decoration: var(--forge-typography-body2-text-decoration, inherit);\n  }\n  .forge-page-state__actions {\n    grid-auto-flow: row;\n  }\n}\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/* prettier-ignore */\n.forge-button {\n  --_button-primary-color: var(--forge-button-primary-color, var(--forge-theme-primary, #3f51b5));\n  --_button-text-color: var(--forge-button-text-color, var(--_button-primary-color));\n  --_button-disabled-color: var(--forge-button-disabled-color, var(--forge-theme-surface-container, #e0e0e0));\n  --_button-padding: var(--forge-button-padding, var(--forge-spacing-medium, 16px));\n  --_button-display: var(--forge-button-display, inline-grid);\n  --_button-justify: var(--forge-button-justify, center);\n  --_button-shape: var(--forge-button-shape, calc(var(--forge-shape-medium, 4px) * var(--forge-shape-factor, 1)));\n  --_button-height: var(--forge-button-height, 36px);\n  --_button-min-width: var(--forge-button-min-width, 64px);\n  --_button-spacing: var(--forge-button-spacing, var(--forge-spacing-xsmall, 8px));\n  --_button-border-width: var(--forge-button-border-width, medium);\n  --_button-border-style: var(--forge-button-border-style, none);\n  --_button-border-color: var(--forge-button-border-color, currentColor);\n  --_button-shape-start-start-radius: var(--forge-button-shape-start-start-radius, var(--_button-shape));\n  --_button-shape-start-end-radius: var(--forge-button-shape-start-end-radius, var(--_button-shape));\n  --_button-shape-end-start-radius: var(--forge-button-shape-end-start-radius, var(--_button-shape));\n  --_button-shape-end-end-radius: var(--forge-button-shape-end-end-radius, var(--_button-shape));\n  --_button-padding-block: var(--forge-button-padding-block, var(--_button-0));\n  --_button-padding-inline: var(--forge-button-padding-inline, var(--_button-padding));\n  --_button-background: var(--forge-button-background, transparent);\n  --_button-hover-background: var(--forge-button-hover-background, var(--_button-background));\n  --_button-active-background: var(--forge-button-active-background, var(--_button-background));\n  --_button-color: var(--forge-button-color, var(--_button-text-color));\n  --_button-icon-size: var(--forge-button-icon-size, calc(var(--forge-typography-font-size, 1rem) * 1.125));\n  --_button-shadow: var(--forge-button-shadow, none);\n  --_button-hover-shadow: var(--forge-button-hover-shadow, none);\n  --_button-active-shadow: var(--forge-button-active-shadow, none);\n  --_button-cursor: var(--forge-button-cursor, pointer);\n  --_button-transition-duration: var(--forge-button-transition-duration, var(--forge-animation-duration-short3, 150ms));\n  --_button-transition-timing: var(--forge-button-transition-timing, var(--forge-animation-easing-standard, cubic-bezier(0.2, 0, 0, 1)));\n  --_button-text-padding-inline: var(--forge-button-text-padding-inline, var(--forge-spacing-xsmall, 8px));\n  --_button-outlined-background: var(--forge-button-outlined-background, transparent);\n  --_button-outlined-color: var(--forge-button-outlined-color, var(--_button-primary-color));\n  --_button-outlined-border-width: var(--forge-button-outlined-border-width, var(--forge-border-thin, 1px));\n  --_button-outlined-border-style: var(--forge-button-outlined-border-style, solid);\n  --_button-outlined-border-color: var(--forge-button-outlined-border-color, var(--_button-primary-color));\n  --_button-tonal-background: var(--forge-button-tonal-background, var(--forge-theme-primary-container, #d1d5ed));\n  --_button-tonal-disabled-background: var(--forge-button-tonal-disabled-background, var(--_button-disabled-color));\n  --_button-tonal-color: var(--forge-button-tonal-color, var(--forge-theme-on-primary-container, #222c62));\n  --_button-tonal-disabled-color: var(--forge-button-tonal-disabled-color, var(--_button-disabled-text-color));\n  --_button-filled-background: var(--forge-button-filled-background, var(--_button-primary-color));\n  --_button-filled-disabled-background: var(--forge-button-filled-disabled-background, var(--_button-disabled-color));\n  --_button-filled-color: var(--forge-button-filled-color, var(--forge-theme-on-primary, #ffffff));\n  --_button-filled-disabled-color: var(--forge-button-filled-disabled-color, var(--_button-disabled-text-color));\n  --_button-raised-background: var(--forge-button-raised-background, var(--_button-primary-color));\n  --_button-raised-disabled-background: var(--forge-button-raised-disabled-background, var(--_button-disabled-color));\n  --_button-raised-color: var(--forge-button-raised-color, var(--forge-theme-on-primary, #ffffff));\n  --_button-raised-disabled-color: var(--forge-button-raised-disabled-color, var(--_button-disabled-text-color));\n  --_button-raised-shadow: var(--forge-button-raised-shadow, 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12));\n  --_button-raised-hover-shadow: var(--forge-button-raised-hover-shadow, 0px 2px 4px -1px rgba(0, 0, 0, 0.2), 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0, 0, 0, 0.12));\n  --_button-raised-active-shadow: var(--forge-button-raised-active-shadow, 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12));\n  --_button-raised-disabled-shadow: var(--forge-button-raised-disabled-shadow, none);\n  --_button-link-color: var(--forge-button-link-color, var(--_button-primary-color));\n  --_button-link-text-decoration: var(--forge-button-link-text-decoration, underline);\n  --_button-link-height: var(--forge-button-link-height, auto);\n  --_button-link-padding: var(--forge-button-link-padding, 0);\n  --_button-link-line-height: var(--forge-button-link-line-height, normal);\n  --_button-link-width: var(--forge-button-link-width, auto);\n  --_button-link-hover-text-decoration: var(--forge-button-link-hover-text-decoration, none);\n  --_button-link-active-opacity: var(--forge-button-link-active-opacity, 0.65);\n  --_button-link-transition-duration: var(--forge-button-link-transition-duration, var(--forge-animation-duration-short3, 150ms));\n  --_button-link-transition-timing: var(--forge-button-link-transition-timing, var(--forge-animation-easing-standard, cubic-bezier(0.2, 0, 0, 1)));\n  --_button-disabled-cursor: var(--forge-button-disabled-cursor, not-allowed);\n  --_button-disabled-text-color: var(--forge-button-disabled-text-color, var(--forge-theme-text-low, rgba(0, 0, 0, 0.38)));\n  --_button-disabled-background: var(--forge-button-disabled-background, transparent);\n  --_button-disabled-border-color: var(--forge-button-disabled-border-color, var(--_button-disabled-color));\n  --_button-disabled-shadow: var(--forge-button-disabled-shadow, none);\n  --_button-dense-height: var(--forge-button-dense-height, 24px);\n  --_button-pill-shape: var(--forge-button-pill-shape, calc(var(--forge-shape-full, 9999px) * var(--forge-shape-factor, 1)));\n  --_button-pill-padding-inline: var(--forge-button-pill-padding-inline, var(--forge-spacing-small, 12px));\n  --_button-focus-indicator-offset: var(--forge-button-focus-indicator-offset, 4px);\n  --_button-text-focus-indicator-offset: var(--forge-button-text-focus-indicator-offset, 0px);\n  --_button-link-focus-indicator-offset: var(--forge-button-link-focus-indicator-offset, 2px);\n  --_button-popover-icon-transition-duration: var(--forge-button-popover-icon-transition-duration, var(--forge-animation-duration-short3, 150ms));\n  --_button-popover-icon-transition-timing: var(--forge-button-popover-icon-transition-timing, var(--forge-animation-easing-standard, cubic-bezier(0.2, 0, 0, 1)));\n  --_button-popover-icon-open-rotation: var(--forge-button-popover-icon-open-rotation, 180deg);\n}\n\n.forge-button {\n  display: var(--_button-display);\n  position: relative;\n  outline: none;\n  vertical-align: middle;\n  -webkit-tap-highlight-color: transparent;\n  -moz-osx-font-smoothing: grayscale;\n  -webkit-font-smoothing: antialiased;\n  font-family: var(--forge-typography-button-font-family, var(--forge-typography-font-family, "Roboto", sans-serif));\n  font-size: var(--forge-typography-button-font-size, calc(var(--forge-typography-font-size, 1rem) * var(--forge-typography-button-font-size-scale, 0.875)));\n  font-weight: var(--forge-typography-button-font-weight, 500);\n  line-height: var(--forge-typography-button-line-height, normal);\n  letter-spacing: var(--forge-typography-button-letter-spacing, 0.0714285714em);\n  text-transform: var(--forge-typography-button-text-transform, inherit);\n  text-decoration: var(--forge-typography-button-text-decoration, inherit);\n  position: relative;\n  display: var(--_button-display);\n  grid-auto-flow: column;\n  align-items: center;\n  justify-content: var(--_button-justify);\n  gap: var(--_button-spacing);\n  z-index: 0;\n  box-sizing: border-box;\n  min-inline-size: var(--_button-min-width);\n  height: var(--_button-height);\n  inline-size: 100%;\n  border-width: var(--_button-border-width);\n  border-style: var(--_button-border-style);\n  border-color: var(--_button-border-color);\n  border-start-start-radius: var(--_button-shape-start-start-radius);\n  border-start-end-radius: var(--_button-shape-start-end-radius);\n  border-end-start-radius: var(--_button-shape-end-start-radius);\n  border-end-end-radius: var(--_button-shape-end-end-radius);\n  padding-block: var(--_button-padding-block);\n  padding-inline: var(--_button-padding-inline);\n  box-shadow: var(--_button-shadow);\n  outline: none;\n  user-select: none;\n  -webkit-appearance: none;\n  vertical-align: middle;\n  text-decoration: none;\n  white-space: nowrap;\n  background: var(--_button-background);\n  color: var(--_button-color);\n  cursor: var(--_button-cursor);\n  transition-property: box-shadow, background;\n  transition-duration: var(--_button-transition-duration);\n  transition-timing-function: var(--_button-transition-timing);\n}\n\n.forge-button::-moz-focus-inner {\n  padding: 0;\n  border: 0;\n}\n\n.forge-button:hover {\n  --_button-shadow: var(--_button-hover-shadow);\n  background: var(--_button-hover-background);\n}\n\n.forge-button:active {\n  --_button-shadow: var(--_button-active-shadow);\n  background: var(--_button-active-background);\n}\n\n.forge-button {\n  position: relative;\n  inline-size: auto;\n}\n\n.forge-button:not(:disabled):not(.forge-button--link) {\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\n.forge-button:not(:disabled):not(.forge-button--link)::before {\n  opacity: 0;\n  position: absolute;\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\n.forge-button:not(:disabled):not(.forge-button--link):hover::before {\n  background-color: var(--_state-layer-hover-color);\n  opacity: var(--_state-layer-hover-opacity);\n}\n\n.forge-button:not(:disabled):not(.forge-button--link):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\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.forge-button:not(:disabled) {\n  outline: none;\n}\n\n.forge-button:not(:disabled):focus-visible::after {\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}\n\n.forge-button:not(:disabled):focus-visible::after {\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-outward-grow, forge-focus-indicator-outward-shrink;\n  border-end-end-radius: calc(var(--_focus-indicator-shape-end-end) + var(--_focus-indicator-outward-offset));\n  border-end-start-radius: calc(var(--_focus-indicator-shape-end-start) + var(--_focus-indicator-outward-offset));\n  border-start-end-radius: calc(var(--_focus-indicator-shape-start-end) + var(--_focus-indicator-outward-offset));\n  border-start-start-radius: calc(var(--_focus-indicator-shape-start-start) + var(--_focus-indicator-outward-offset));\n  inset: calc(-1 * var(--_focus-indicator-outward-offset));\n  outline: var(--_focus-indicator-width) solid currentColor;\n  content: "";\n  display: block;\n}\n\n.forge-button:not(:disabled) {\n  --forge-focus-indicator-color: var(--_button-primary-color);\n}\n\n.forge-button:disabled {\n  cursor: var(--_button-disabled-cursor);\n  --_button-background: var(--_button-disabled-background);\n  --_button-color: var(--_button-disabled-text-color);\n  --_button-shadow: var(--_button-disabled-shadow);\n  pointer-events: none;\n  pointer-events: initial;\n}\n\n.forge-button:where(:not(.forge-button--outlined, .forge-button--tonal, .forge-button--filled, .forge-button--raised, .forge-button--link)), .forge-button--text {\n  --_button-padding-inline: var(--_button-text-padding-inline);\n}\n\n.forge-button--outlined {\n  --_button-background: var(--_button-outlined-background);\n  --_button-color: var(--_button-outlined-color);\n  --_button-border-width: var(--_button-outlined-border-width);\n  --_button-border-style: var(--_button-outlined-border-style);\n  --_button-border-color: var(--_button-outlined-border-color);\n}\n\n.forge-button--outlined:disabled {\n  --_button-border-color: var(--_button-disabled-border-color);\n}\n\n.forge-button--tonal {\n  --_button-background: var(--_button-tonal-background);\n  --_button-color: var(--_button-tonal-color);\n}\n\n.forge-button--tonal:disabled {\n  --_button-background: var(--_button-tonal-disabled-background);\n  --_button-color: var(--_button-tonal-disabled-color);\n}\n\n.forge-button--filled, .forge-button--raised {\n  --_button-background: var(--_button-filled-background);\n  --_button-color: var(--_button-filled-color);\n  --forge-state-layer-color: var(--_button-filled-color);\n}\n\n.forge-button--filled:disabled, .forge-button--raised:disabled {\n  --_button-background: var(--_button-filled-disabled-background);\n  --_button-color: var(--_button-filled-disabled-color);\n}\n\n.forge-button--raised {\n  --_button-background: var(--_button-raised-background);\n  --_button-color: var(--_button-raised-color);\n  --_button-shadow: var(--_button-raised-shadow);\n}\n\n.forge-button--raised:hover {\n  --_button-shadow: var(--_button-raised-hover-shadow);\n}\n\n.forge-button--raised:active {\n  --_button-shadow: var(--_button-raised-active-shadow);\n}\n\n.forge-button--raised:disabled {\n  --_button-background: var(--_button-raised-disabled-background);\n  --_button-color: var(--_button-raised-disabled-color);\n  --_button-shadow: var(--_button-raised-disabled-shadow);\n}\n\n.forge-button--link {\n  --_button-color: var(--_button-link-color);\n  --_button-height: var(--_button-link-height);\n  --_button-padding: var(--_button-link-padding);\n  --_button-focus-indicator-offset: var(--_button-link-focus-indicator-offset);\n  text-decoration: var(--_button-link-text-decoration);\n  line-height: var(--_button-link-line-height);\n  transition: opacity var(--_button-link-transition-duration) var(--_button-link-transition-timing);\n  inline-size: var(--_button-link-width);\n}\n\n.forge-button--link:hover {\n  text-decoration: var(--_button-link-hover-text-decoration);\n}\n\n.forge-button--link:active {\n  opacity: var(--_button-link-active-opacity);\n}\n\n.forge-button--pill {\n  --_button-shape: var(--_button-pill-shape);\n  --_button-padding-inline: var(--_button-pill-padding-inline);\n  --forge-focus-indicator-shape: var(--_button-pill-shape);\n}\n\n.forge-button {\n  --forge-icon-font-size: var(--_button-icon-size);\n}\n\n.forge-button--dense {\n  --_button-height: var(--_button-dense-height);\n}\n\n:host {\n  display: block;\n}\n\n.welcome-container {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  gap: var(--forge-spacing-medium, 16px);\n  max-width: 768px;\n}\n\n.message {\n  -moz-osx-font-smoothing: grayscale;\n  -webkit-font-smoothing: antialiased;\n  font-family: var(--forge-typography-body2-font-family, var(--forge-typography-font-family, "Roboto", sans-serif));\n  font-size: var(--forge-typography-body2-font-size, calc(var(--forge-typography-font-size, 1rem) * var(--forge-typography-body-font-size-scale, 1)));\n  font-weight: var(--forge-typography-body2-font-weight, 400);\n  line-height: var(--forge-typography-body2-line-height, calc(var(--forge-typography-font-size, 1rem) * var(--forge-typography-body-line-height-scale, 1.375)));\n  letter-spacing: var(--forge-typography-body2-letter-spacing, 0.015625em);\n  text-transform: var(--forge-typography-body2-text-transform, inherit);\n  text-decoration: var(--forge-typography-body2-text-decoration, inherit);\n}\n\n.graphic {\n  height: 144px;\n  width: 144px;\n}\n\n.suggestion-container {\n  display: flex;\n  flex-direction: column;\n  gap: var(--forge-spacing-small, 12px);\n}';
+export {
+  styles as default
+};

package/dist/ai-empty-state/index.d.ts

@@ -0,0 +1 @@
+export * from './ai-empty-state';

package/dist/ai-empty-state/index.mjs

@@ -0,0 +1,5 @@
+import { AiEmptyStateComponent, AiEmptyStateComponentTagName } from "./ai-empty-state.mjs";
+export {
+  AiEmptyStateComponent,
+  AiEmptyStateComponentTagName
+};

package/dist/ai-fab/ai-fab.d.ts

@@ -0,0 +1,23 @@
+import { LitElement, TemplateResult, PropertyValues } from 'lit';
+declare global {
+    interface HTMLElementTagNameMap {
+        'forge-ai-fab': AiFabComponent;
+    }
+}
+export declare const AiFabComponentTagName: keyof HTMLElementTagNameMap;
+/**
+ * @tag forge-ai-fab
+ *
+ * @slot - Default slot for button content
+ */
+export declare class AiFabComponent extends LitElement {
+    #private;
+    static styles: import('lit').CSSResult;
+    /** Whether the button is disabled */
+    disabled: boolean;
+    /** Whether the button is extended */
+    extended: boolean;
+    constructor();
+    willUpdate(changedProperties: PropertyValues<this>): void;
+    render(): TemplateResult;
+}

package/dist/ai-fab/ai-fab.mjs

@@ -0,0 +1,75 @@
+import { toggleState } from "../utils.mjs";
+import { unsafeCSS, LitElement, html } from "lit";
+import { property, customElement } from "lit/decorators.js";
+import "../ai-icon/ai-icon.mjs";
+import "../ai-gradient-container/ai-gradient-container.mjs";
+import styles from "./ai-fab.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 __privateSet = (obj, member, value, setter) => (__accessCheck(obj, member, "write to private field"), member.set(obj, value), value);
+var __privateMethod = (obj, member, method) => (__accessCheck(obj, member, "access private method"), method);
+var _internals, _AiFabComponent_instances, setCssState_fn;
+const AiFabComponentTagName = "forge-ai-fab";
+let AiFabComponent = class extends LitElement {
+  constructor() {
+    super();
+    __privateAdd(this, _AiFabComponent_instances);
+    this.disabled = false;
+    this.extended = false;
+    __privateAdd(this, _internals);
+    __privateSet(this, _internals, this.attachInternals());
+    __privateMethod(this, _AiFabComponent_instances, setCssState_fn).call(this);
+  }
+  willUpdate(changedProperties) {
+    if (changedProperties.has("disabled") || changedProperties.has("extended")) {
+      __privateMethod(this, _AiFabComponent_instances, setCssState_fn).call(this);
+    }
+  }
+  render() {
+    return html`
+      <forge-ai-gradient-container variant=${this.disabled ? "disabled" : "high"}>
+        <button
+          aria-label="Floating Action Button Demo"
+          class="forge-fab ai-fab ${this.extended ? "forge-fab--extended" : ""}"
+          .disabled=${this.disabled}>
+          <forge-ai-icon></forge-ai-icon>
+          ${this.extended ? html`<slot></slot>` : ""}
+        </button>
+      </forge-ai-gradient-container>
+    `;
+  }
+};
+_internals = /* @__PURE__ */ new WeakMap();
+_AiFabComponent_instances = /* @__PURE__ */ new WeakSet();
+setCssState_fn = function() {
+  toggleState(__privateGet(this, _internals), "disabled", this.disabled);
+  toggleState(__privateGet(this, _internals), "extended", this.extended);
+};
+AiFabComponent.styles = unsafeCSS(styles);
+__decorateClass([
+  property({ type: Boolean, reflect: true })
+], AiFabComponent.prototype, "disabled", 2);
+__decorateClass([
+  property({ type: Boolean, reflect: true })
+], AiFabComponent.prototype, "extended", 2);
+AiFabComponent = __decorateClass([
+  customElement(AiFabComponentTagName)
+], AiFabComponent);
+export {
+  AiFabComponent,
+  AiFabComponentTagName
+};

package/dist/ai-fab/ai-fab.scss.mjs

@@ -0,0 +1,4 @@
+const styles = '/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/**\n * @license\n * Copyright Tyler Technologies, Inc. \n * License: Apache-2.0\n */\n/* prettier-ignore */\n.forge-fab {\n  --_fab-display: var(--forge-fab-display, inline-flex);\n  --_fab-gap: var(--forge-fab-gap, var(--forge-spacing-xsmall, 8px));\n  --_fab-background: var(--forge-fab-background, var(--forge-theme-secondary, #ffc107));\n  --_fab-color: var(--forge-fab-color, var(--forge-theme-on-secondary, #000000));\n  --_fab-size: var(--forge-fab-size, 56px);\n  --_fab-padding: var(--forge-fab-padding, var(--forge-spacing-xsmall, 8px));\n  --_fab-shadow: var(--forge-fab-shadow, 0px 3px 3px -2px rgba(0, 0, 0, 0.2), 0px 3px 4px 0px rgba(0, 0, 0, 0.14), 0px 1px 8px 0px rgba(0, 0, 0, 0.12));\n  --_fab-hover-shadow: var(--forge-fab-hover-shadow, 0px 2px 4px -1px rgba(0, 0, 0, 0.2), 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0, 0, 0, 0.12));\n  --_fab-active-shadow: var(--forge-fab-active-shadow, 0px 3px 3px -2px rgba(0, 0, 0, 0.2), 0px 3px 4px 0px rgba(0, 0, 0, 0.14), 0px 1px 8px 0px rgba(0, 0, 0, 0.12));\n  --_fab-lowered-shadow: var(--forge-fab-lowered-shadow, 0px 2px 1px -1px rgba(0, 0, 0, 0.2), 0px 1px 1px 0px rgba(0, 0, 0, 0.14), 0px 1px 3px 0px rgba(0, 0, 0, 0.12));\n  --_fab-lowered-hover-shadow: var(--forge-fab-lowered-hover-shadow, 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12));\n  --_fab-lowered-active-shadow: var(--forge-fab-lowered-active-shadow, 0px 2px 1px -1px rgba(0, 0, 0, 0.2), 0px 1px 1px 0px rgba(0, 0, 0, 0.14), 0px 1px 3px 0px rgba(0, 0, 0, 0.12));\n  --_fab-transition-duration: var(--forge-fab-transition-duration, var(--forge-animation-duration-short3, 150ms));\n  --_fab-transition-timing: var(--forge-fab-transition-timing, var(--forge-animation-easing-standard, cubic-bezier(0.2, 0, 0, 1)));\n  --_fab-shape: var(--forge-fab-shape, calc(var(--forge-shape-full, 9999px) * var(--forge-shape-factor, 1)));\n  --_fab-shape-start-start: var(--forge-fab-shape-start-start, var(--_fab-shape));\n  --_fab-shape-start-end: var(--forge-fab-shape-start-end, var(--_fab-shape));\n  --_fab-shape-end-start: var(--forge-fab-shape-end-start, var(--_fab-shape));\n  --_fab-shape-end-end: var(--forge-fab-shape-end-end, var(--_fab-shape));\n  --_fab-extended-padding: var(--forge-fab-extended-padding, var(--forge-spacing-medium-large, 20px));\n  --_fab-extended-min-width: var(--forge-fab-extended-min-width, 96px);\n  --_fab-density-small-size: var(--forge-fab-density-small-size, 40px);\n  --_fab-density-medium-size: var(--forge-fab-density-medium-size, var(--_fab-size));\n  --_fab-density-large-size: var(--forge-fab-density-large-size, 96px);\n  --_fab-disabled-cursor: var(--forge-fab-disabled-cursor, not-allowed);\n  --_fab-disabled-background: var(--forge-fab-disabled-background, var(--forge-theme-surface-container, #e0e0e0));\n  --_fab-disabled-color: var(--forge-fab-disabled-color, var(--forge-theme-on-surface-container, #000000));\n  --_fab-disabled-opacity: var(--forge-fab-disabled-opacity, 0.38);\n}\n\n.forge-fab {\n  -moz-osx-font-smoothing: grayscale;\n  -webkit-font-smoothing: antialiased;\n  font-family: var(--forge-typography-button-font-family, var(--forge-typography-font-family, "Roboto", sans-serif));\n  font-size: var(--forge-typography-button-font-size, calc(var(--forge-typography-font-size, 1rem) * var(--forge-typography-button-font-size-scale, 0.875)));\n  font-weight: var(--forge-typography-button-font-weight, 500);\n  line-height: var(--forge-typography-button-line-height, normal);\n  letter-spacing: var(--forge-typography-button-letter-spacing, 0.0714285714em);\n  text-transform: var(--forge-typography-button-text-transform, inherit);\n  text-decoration: var(--forge-typography-button-text-decoration, inherit);\n  position: relative;\n  display: inline-flex;\n  justify-content: center;\n  align-items: center;\n  gap: var(--_fab-gap);\n  z-index: 0;\n  background: var(--_fab-background);\n  color: var(--_fab-color);\n  cursor: pointer;\n  box-shadow: var(--_fab-shadow);\n  box-sizing: border-box;\n  height: var(--_fab-density-medium-size);\n  min-width: var(--_fab-density-medium-size);\n  padding-inline: var(--_fab-padding);\n  border-width: medium;\n  border-style: none;\n  border-color: currentColor;\n  border-top-left-radius: var(--_fab-shape-start-start);\n  border-top-right-radius: var(--_fab-shape-start-end);\n  border-bottom-left-radius: var(--_fab-shape-end-start);\n  border-bottom-right-radius: var(--_fab-shape-end-end);\n  user-select: none;\n  white-space: nowrap;\n  transition-property: box-shadow, background, color;\n  transition-duration: var(--_fab-transition-duration);\n  transition-timing-function: var(--_fab-transition-timing);\n}\n\n.forge-fab:hover {\n  --_fab-shadow: var(--_fab-hover-shadow);\n}\n\n.forge-fab:active {\n  --_fab-shadow: var(--_fab-active-shadow);\n}\n\n.forge-fab:not(:disabled) {\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\n.forge-fab:not(:disabled)::before {\n  opacity: 0;\n  position: absolute;\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\n.forge-fab:not(:disabled):hover::before {\n  background-color: var(--_state-layer-hover-color);\n  opacity: var(--_state-layer-hover-opacity);\n}\n\n.forge-fab:not(:disabled):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\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.forge-fab:not(:disabled) {\n  outline: none;\n}\n\n.forge-fab:not(:disabled):focus-visible::after {\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}\n\n.forge-fab:not(:disabled):focus-visible::after {\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-outward-grow, forge-focus-indicator-outward-shrink;\n  border-end-end-radius: calc(var(--_focus-indicator-shape-end-end) + var(--_focus-indicator-outward-offset));\n  border-end-start-radius: calc(var(--_focus-indicator-shape-end-start) + var(--_focus-indicator-outward-offset));\n  border-start-end-radius: calc(var(--_focus-indicator-shape-start-end) + var(--_focus-indicator-outward-offset));\n  border-start-start-radius: calc(var(--_focus-indicator-shape-start-start) + var(--_focus-indicator-outward-offset));\n  inset: calc(-1 * var(--_focus-indicator-outward-offset));\n  outline: var(--_focus-indicator-width) solid currentColor;\n  content: "";\n  display: block;\n}\n\n.forge-fab:not(:disabled) {\n  --forge-focus-indicator-color: var(--_fab-background);\n  --forge-focus-indicator-shape-start-start: var(--_fab-shape-start-start);\n  --forge-focus-indicator-shape-start-end: var(--_fab-shape-start-end);\n  --forge-focus-indicator-shape-end-start: var(--_fab-shape-end-start);\n  --forge-focus-indicator-shape-end-end: var(--_fab-shape-end-end);\n}\n\n.forge-fab--extended {\n  --_fab-padding: var(--_fab-extended-padding);\n  min-width: var(--_fab-extended-min-width);\n}\n\n.forge-fab:disabled {\n  cursor: var(--_fab-disabled-cursor);\n  --_fab-background: var(--_fab-disabled-background);\n  --_fab-color: var(--_fab-disabled-color);\n  pointer-events: none;\n  opacity: var(--_fab-disabled-opacity);\n  pointer-events: auto;\n  cursor: not-allowed;\n}\n\n.forge-fab--dense, .forge-fab--small {\n  --_fab-size: var(--_fab-density-small-size);\n}\n\n.forge-fab--large {\n  --_fab-size: var(--_fab-density-large-size);\n  --_fab-shape: var(--forge-fab-shape, calc(var(--forge-shape-extra-large, 16px) * var(--forge-shape-factor, 1)));\n}\n\n.forge-fab--flat {\n  --_fab-shadow: var(--_fab-lowered-shadow);\n}\n\n.forge-fab--flat:hover {\n  --_fab-shadow: var(--_fab-lowered-hover-shadow);\n}\n\n.forge-fab--flat:active {\n  --_fab-shadow: var(--_fab-lowered-active-shadow);\n}\n\n@keyframes fadein {\n  from {\n    opacity: 0;\n  }\n  to {\n    opacity: 1;\n  }\n}\n:host {\n  display: inline-block;\n}\n\nforge-ai-gradient-container {\n  --forge-gradient-container-radius: 100%;\n}\n\n.ai-fab {\n  --forge-fab-border-width: 0;\n  --forge-fab-background: var(--forge-theme-primary, #3f51b5);\n  background: transparent;\n  position: relative;\n  z-index: 1;\n}\n.ai-fab forge-ai-icon {\n  color: var(--forge-theme-primary, #3f51b5);\n  font-size: 36px;\n}\n\n:host(:state(extended)) forge-ai-gradient-container {\n  --forge-gradient-container-radius: var(--forge-spacing-xxxlarge, 56px);\n}\n:host(:state(extended)) {\n  --forge-fab-shape: var(--forge-spacing-xxxlarge, 56px);\n  --forge-fab-color: var(--forge-theme-primary);\n}\n\n:host(:state(disabled)) forge-ai-icon {\n  --forge-ai-icon-fill-color: var(--forge-theme-text-low);\n}';
+export {
+  styles as default
+};

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

@@ -0,0 +1 @@
+export * from './ai-fab';

package/dist/ai-fab/index.mjs

@@ -0,0 +1,5 @@
+import { AiFabComponent, AiFabComponentTagName } from "./ai-fab.mjs";
+export {
+  AiFabComponent,
+  AiFabComponentTagName
+};

package/dist/ai-file-picker/ai-file-picker.d.ts

@@ -0,0 +1,77 @@
+import { LitElement, TemplateResult } from 'lit';
+declare global {
+    interface HTMLElementTagNameMap {
+        'forge-ai-file-picker': ForgeAiFilePickerComponent;
+    }
+    interface HTMLElementEventMap {
+        'forge-ai-file-picker-change': CustomEvent<AiFilePickerChangeEventData>;
+    }
+}
+/**
+ * Event data interface for the file picker change event.
+ */
+export interface AiFilePickerChangeEventData {
+    /** The selected file */
+    file: File;
+    /** Timestamp when the file was selected */
+    timestamp: number;
+}
+export type AiFilePickerVariant = 'button' | 'icon-button';
+/**
+ * @summary An AI file picker component with button and icon-button variants.
+ *
+ * @description
+ * A simple file picker component that allows users to select and upload files.
+ * Provides both button and icon-button variants for different UI contexts.
+ *
+ * ## Features
+ * - **Multiple Variants**: 'button' and 'icon-button' for different use cases
+ * - **File Selection**: Click to open file dialog or drag & drop support
+ * - **Event Emission**: Emits events when files are selected
+ * - **Accessibility**: Full ARIA implementation with keyboard support
+ * - **Customizable**: Accepts custom file types and styling
+ *
+ * ## Events
+ * - **forge-ai-file-picker-change**: Fired when a file is selected with file details
+ *
+ * @cssprop --ai-file-picker-width - The width of the file picker button.
+ * @cssprop --ai-file-picker-height - The height of the file picker button.
+ *
+ * @slot - The default slot for button content when no file is selected.
+ * @slot icon - The icon slot for icon-button variant.
+ *
+ * @event {CustomEvent<AiFilePickerChangeEventData>} forge-ai-file-picker-change - Fired when a file is selected via click or drag & drop.
+ * The event detail contains the selected file and timestamp.
+ */
+export declare class ForgeAiFilePickerComponent extends LitElement {
+    #private;
+    static styles: import('lit').CSSResult;
+    /**
+     * The variant of the file picker button.
+     */
+    variant: AiFilePickerVariant;
+    /**
+     * Whether the file picker is disabled.
+     */
+    disabled: boolean;
+    /**
+     * Accepted file types (comma-separated MIME types or extensions).
+     */
+    accept: string;
+    /**
+     * Whether to allow multiple file selection.
+     */
+    multiple: boolean;
+    private _isDragOver;
+    private _fileInput;
+    private _button;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    private _handleButtonClick;
+    private _handleFileChange;
+    private _onDragOver;
+    private _onDragLeave;
+    private _onDrop;
+    private _emitFileChangeEvent;
+    render(): TemplateResult;
+}