@slotted/angular 0.0.0-stage → 0.1.0-beta.0

package/fesm2022/slotted-angular-prompt-composer.mjs

@@ -0,0 +1,596 @@
+import * as i0 from '@angular/core';
+import { InjectionToken, inject, input, booleanAttribute, numberAttribute, output, ElementRef, contentChild, signal, computed, effect, untracked, ViewEncapsulation, ChangeDetectionStrategy, Component, HostAttributeToken, forwardRef, Directive, afterNextRender } from '@angular/core';
+import { SlField } from '@slotted/angular/field';
+import { injectMessages } from '@slotted/angular/i18n';
+import { promptComposerMessages } from '@slotted/core/i18n';
+import { getLiveAnnouncer } from '@slotted/core/live-announcer';
+import { createControllable } from '@slotted/core/state';
+import { selectFiles } from '@slotted/core/upload';
+import { NG_VALUE_ACCESSOR } from '@angular/forms';
+import { SlGlyph, SlIcon } from '@slotted/angular/icon';
+
+const FALLBACK = {
+    size: 'md',
+    submitOn: 'enter',
+    variant: 'raised',
+};
+const PROMPT_COMPOSER_DEFAULTS = new InjectionToken('slotted prompt composer defaults', { providedIn: 'root', factory: () => FALLBACK });
+/**
+ * An application decides once how its composers look and which key sends. A
+ * composer that states any of them itself still wins. What the buttons say
+ * comes from the language in force (`provideSlotted`).
+ */
+function providePromptComposerDefaults(defaults) {
+    return {
+        provide: PROMPT_COMPOSER_DEFAULTS,
+        useFactory: () => ({ ...FALLBACK, ...defaults }),
+    };
+}
+function injectPromptComposerDefaults() {
+    return inject(PROMPT_COMPOSER_DEFAULTS);
+}
+/**
+ * What the composer needs of the textarea inside it. An abstract class rather
+ * than an import, so the two directives depend on each other without a cycle.
+ */
+class SlPromptComposerControl {
+}
+
+/** Whether a drag carries files, rather than a selection of text. */
+function carriesFiles(event) {
+    return Array.from(event.dataTransfer?.types ?? []).includes('Files');
+}
+/**
+ * A message being written: the consumer's own `form`, around a textarea, a
+ * band above for what the message carries and a band below for what it is
+ * sent with.
+ *
+ * The value is the textarea's, so a reactive form binds there; the status is
+ * the application's; the attachments are the application's too — the
+ * composer hands over the files after the selection rules `upload` applies,
+ * and draws nothing of them.
+ */
+class SlPromptComposer {
+    size = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
+    variant = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []));
+    /** Where the request stands. The application owns it. */
+    status = input('ready', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "status" }] : /* istanbul ignore next */ []));
+    submitOn = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "submitOn" }] : /* istanbul ignore next */ []));
+    /** Whether the send is available. Defaults to "the value has something besides white space". */
+    canSubmit = input(undefined, { ...(ngDevMode ? { debugName: "canSubmit" } : /* istanbul ignore next */ {}), transform: (value) => value === undefined ? undefined : booleanAttribute(value) });
+    /** The file types the attach button, a paste and a drop accept. */
+    accept = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "accept" }] : /* istanbul ignore next */ []));
+    multiple = input(true, { ...(ngDevMode ? { debugName: "multiple" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    maxSize = input(undefined, { ...(ngDevMode ? { debugName: "maxSize" } : /* istanbul ignore next */ {}), transform: (value) => (value == null ? undefined : numberAttribute(value)) });
+    maxFiles = input(undefined, { ...(ngDevMode ? { debugName: "maxFiles" } : /* istanbul ignore next */ {}), transform: (value) => (value == null ? undefined : numberAttribute(value)) });
+    /**
+     * Words laid over the catalog of the language in force, key by key: the
+     * names of the attach and submit buttons for each status (`send`, `sending`,
+     * `stop`, `retry`), and the `sending` and `stopped` announcements.
+     */
+    messages = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "messages" }] : /* istanbul ignore next */ []));
+    /** Before the message is sent; `cancel()` keeps the value where it is. */
+    valueSubmit = output();
+    /** The stop button, while the status is `streaming`. */
+    stop = output();
+    /** Files from the attach button, a paste or a drop, after the selection rules. */
+    attach = output();
+    defaults = injectPromptComposerDefaults();
+    /** The family's words in the language in force, with this composer's `messages` laid over them. */
+    t = injectMessages(promptComposerMessages, this.messages);
+    field = inject(SlField, { optional: true });
+    element = inject(ElementRef).nativeElement;
+    control = contentChild(SlPromptComposerControl, { ...(ngDevMode ? { debugName: "control" } : /* istanbul ignore next */ {}), descendants: true });
+    dropTarget = signal(false, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "dropTarget" }] : /* istanbul ignore next */ []));
+    resolvedSize = computed(() => this.size() ?? this.field?.resolvedSize() ?? this.defaults.size, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "resolvedSize" }] : /* istanbul ignore next */ []));
+    resolvedVariant = computed(() => this.variant() ?? this.defaults.variant, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "resolvedVariant" }] : /* istanbul ignore next */ []));
+    resolvedSubmitOn = computed(() => this.submitOn() ?? this.defaults.submitOn, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "resolvedSubmitOn" }] : /* istanbul ignore next */ []));
+    busy = computed(() => this.status() === 'submitted' || this.status() === 'streaming', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "busy" }] : /* istanbul ignore next */ []));
+    resolvedCanSubmit = computed(() => {
+        const control = this.control();
+        if (control === undefined || this.busy())
+            return false;
+        if (control.resolvedDisabled() === true || control.resolvedReadOnly() === true)
+            return false;
+        return this.canSubmit() ?? control.current().trim() !== '';
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "resolvedCanSubmit" }] : /* istanbul ignore next */ []));
+    off = computed(() => this.control()?.resolvedDisabled() === true || this.control()?.resolvedReadOnly() === true, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "off" }] : /* istanbul ignore next */ []));
+    constructor() {
+        /* The request travelling is announced once, as it starts. */
+        let previous = 'ready';
+        effect(() => {
+            const status = this.status();
+            if (status === 'submitted' && previous !== 'submitted') {
+                untracked(() => this.announce(this.t('sending')));
+            }
+            previous = status;
+        });
+    }
+    announce(message) {
+        getLiveAnnouncer(this.element.ownerDocument).announce(message);
+    }
+    /** Sends what the textarea holds, unless the send is unavailable or refused. */
+    submitWith(reason, source) {
+        const control = this.control();
+        if (control === undefined || !this.resolvedCanSubmit())
+            return;
+        let cancelled = false;
+        const state = createControllable({
+            controlled: undefined,
+            initial: '',
+            equals: () => false,
+            onRequest: (request) => {
+                this.valueSubmit.emit(request);
+                cancelled = request.cancelled;
+            },
+        });
+        state.request(control.current(), reason, source);
+        if (cancelled)
+            return;
+        control.clearAfterSubmit(source);
+        control.focus();
+    }
+    stopWith(reason, source) {
+        this.stop.emit({ reason, source });
+        this.announce(this.t('stopped'));
+        this.control()?.focus();
+    }
+    attachFiles(files, reason, source) {
+        if (files.length === 0 || this.off())
+            return;
+        const outcome = selectFiles(files, [], {
+            accept: this.accept(),
+            maxFiles: this.maxFiles(),
+            maxSize: this.maxSize(),
+            multiple: this.multiple(),
+        });
+        const accepted = outcome.files
+            .filter((entry) => entry.status !== 'rejected' && entry.file !== undefined)
+            .map((entry) => entry.file);
+        this.attach.emit({ files: accepted, reason, rejected: outcome.rejected, source });
+    }
+    onSubmit(event) {
+        event.preventDefault();
+        this.submitWith('keyboard', event);
+    }
+    /** A press on the frame's padding or a band's empty space puts the caret in the value. */
+    onMouseDown(event) {
+        const part = event.target.getAttribute('data-part');
+        if (part !== 'root' && part !== 'header' && part !== 'footer')
+            return;
+        event.preventDefault();
+        this.control()?.focus();
+    }
+    onDragOver(event) {
+        if (!carriesFiles(event) || this.off())
+            return;
+        event.preventDefault();
+        this.dropTarget.set(true);
+    }
+    onDragLeave(event) {
+        const next = event.relatedTarget;
+        if (next === null || !this.element.contains(next))
+            this.dropTarget.set(false);
+    }
+    onDrop(event) {
+        this.dropTarget.set(false);
+        if (!carriesFiles(event))
+            return;
+        event.preventDefault();
+        this.attachFiles(Array.from(event.dataTransfer?.files ?? []), 'drop', event);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlPromptComposer, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "22.1.7", type: SlPromptComposer, isStandalone: true, selector: "form[slPromptComposer]", inputs: { size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, status: { classPropertyName: "status", publicName: "status", isSignal: true, isRequired: false, transformFunction: null }, submitOn: { classPropertyName: "submitOn", publicName: "submitOn", isSignal: true, isRequired: false, transformFunction: null }, canSubmit: { classPropertyName: "canSubmit", publicName: "canSubmit", isSignal: true, isRequired: false, transformFunction: null }, accept: { classPropertyName: "accept", publicName: "accept", isSignal: true, isRequired: false, transformFunction: null }, multiple: { classPropertyName: "multiple", publicName: "multiple", isSignal: true, isRequired: false, transformFunction: null }, maxSize: { classPropertyName: "maxSize", publicName: "maxSize", isSignal: true, isRequired: false, transformFunction: null }, maxFiles: { classPropertyName: "maxFiles", publicName: "maxFiles", isSignal: true, isRequired: false, transformFunction: null }, messages: { classPropertyName: "messages", publicName: "messages", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { valueSubmit: "valueSubmit", stop: "stop", attach: "attach" }, host: { attributes: { "data-ui": "prompt-composer", "data-part": "root", "novalidate": "" }, listeners: { "submit": "onSubmit($event)", "mousedown": "onMouseDown($event)", "dragover": "onDragOver($event)", "dragleave": "onDragLeave($event)", "drop": "onDrop($event)" }, properties: { "attr.data-size": "resolvedSize()", "attr.data-variant": "resolvedVariant()", "attr.data-status": "status()", "attr.data-loading": "busy() ? '' : null", "attr.data-disabled": "control()?.resolvedDisabled() === true ? '' : null", "attr.data-readonly": "control()?.resolvedReadOnly() === true ? '' : null", "attr.data-invalid": "control()?.resolvedInvalid() === true ? '' : null", "attr.data-drop-target": "dropTarget() ? '' : null" } }, queries: [{ propertyName: "control", first: true, predicate: SlPromptComposerControl, descendants: true, isSignal: true }], exportAs: ["slPromptComposer"], ngImport: i0, template: '<ng-content />', isInline: true, styles: ["@layer slotted.components{[data-ui=prompt-composer][data-part=root]{--_font-size: var(--slotted-control-font-size-md, 13px);--_height: var(--slotted-control-height-md, 34px);--_icon-size: var(--slotted-control-icon-size-md, 16px);--_inner-size: var(--slotted-control-inner-size-md, 24px);--_rows: var(--slotted-prompt-composer-rows, 1);--_max-rows: var(--slotted-prompt-composer-max-rows, 8);--_button: var(--_inner-size);--_inset: max( 0px, calc((var(--_height) - 2 * var(--slotted-control-border-width, 1px) - var(--_inner-size)) / 2) );--_padding-inline: calc(var(--_inset) + (var(--_button) - var(--_icon-size)) / 2);--_padding-block: max(0px, calc((var(--_height) - 1lh) / 2));--_radius: var(--slotted-prompt-composer-radius, var(--slotted-radius-lg, 8px));--_action-radius: max(var(--slotted-radius-xs, 2px), calc(var(--_radius) - var(--_inset)));--_lift: var(--slotted-prompt-composer-shadow, var(--slotted-control-shadow, none));--_lift-focus: var(--slotted-control-shadow-focus-geometry, 0 1px 4px -1px) var(--slotted-focus-ring-color, Highlight);background-color:var( --slotted-prompt-composer-background, var(--slotted-control-surface, Field) );border:var(--slotted-control-border-width, 1px) solid var(--slotted-prompt-composer-border-color, var(--slotted-control-border-color, ButtonBorder));border-radius:var(--_radius);box-shadow:var(--_lift);box-sizing:border-box;color:var(--slotted-prompt-composer-color, var(--slotted-text, CanvasText));cursor:text;display:flex;flex-direction:column;font-family:var(--slotted-control-font-family, system-ui, sans-serif);font-size:var(--_font-size);inline-size:100%;line-height:var(--slotted-prompt-composer-line-height, var(--slotted-line-height-md, 1.5));margin:0;min-inline-size:0;transition:background-color var(--slotted-duration-medium) var(--slotted-easing-standard),border-color var(--slotted-duration-medium) var(--slotted-easing-standard),box-shadow var(--slotted-duration-medium) var(--slotted-easing-standard),outline-color var(--slotted-duration-medium) var(--slotted-easing-standard)}[data-ui=prompt-composer][data-part=root][data-size=sm]{--_font-size: var(--slotted-control-font-size-sm, 12px);--_height: var(--slotted-control-height-sm, 30px);--_icon-size: var(--slotted-control-icon-size-sm, 14px);--_inner-size: var(--slotted-control-inner-size-sm, 22px)}[data-ui=prompt-composer][data-part=root][data-size=lg]{--_font-size: var(--slotted-control-font-size-lg, 14px);--_height: var(--slotted-control-height-lg, 38px);--_icon-size: var(--slotted-control-icon-size-lg, 18px);--_inner-size: var(--slotted-control-inner-size-lg, 28px)}[data-ui=prompt-composer][data-part=root][data-variant=raised]{--_button: calc(var(--_inner-size) + var(--slotted-space-2, .25rem));--_inset: var(--slotted-space-4, .5rem);--_padding-block: calc(var(--_inset) + var(--slotted-space-2, .25rem));--_radius: var(--slotted-prompt-composer-radius, calc(var(--_button) / 2 + var(--_inset)));--_action-radius: var(--slotted-radius-full, 9999px);--_lift: var(--slotted-prompt-composer-raised-shadow, var(--slotted-shadow-md, none));--_lift-focus: var( --slotted-prompt-composer-raised-focus-shadow, var(--slotted-shadow-lg, none) )}[data-ui=prompt-composer][data-part=root][data-variant=subtle]{background-color:var( --slotted-prompt-composer-subtle-background, var(--slotted-surface-sunken, Canvas) );border-color:var( --slotted-prompt-composer-subtle-border-color, var(--slotted-border-subtle, ButtonBorder) )}[data-ui=prompt-composer]>[data-part=input]{appearance:none;background:transparent;border:0;box-sizing:border-box;caret-color:var(--slotted-prompt-composer-caret-color, var(--slotted-tone-accent-solid, auto));color:inherit;display:block;field-sizing:content;font:inherit;inline-size:100%;line-height:inherit;margin:0;max-block-size:calc(var(--_max-rows) * 1lh + 2 * var(--_padding-block));min-block-size:calc(var(--_rows) * 1lh + 2 * var(--_padding-block));outline:none;overflow-wrap:anywhere;overflow-y:auto;padding-block:var(--_padding-block);padding-inline:var(--_padding-inline);resize:none;scrollbar-color:var(--slotted-border-strong, GrayText) transparent;scrollbar-width:thin;unicode-bidi:plaintext}[data-ui=prompt-composer]>[data-part=input]::placeholder{color:var(--slotted-prompt-composer-placeholder-color, var(--slotted-text-muted, GrayText))}[data-ui=prompt-composer]>[data-part=input]::selection{background-color:var( --slotted-prompt-composer-selection-background, var(--slotted-tone-accent-surface, Highlight) )}[data-ui=prompt-composer]>[data-part=header]+[data-part=input]{padding-block-start:var(--_inset)}[data-ui=prompt-composer][data-variant=raised]>[data-part=input]:has(+[data-part=footer]){padding-block-end:var(--slotted-space-2, .25rem)}[data-ui=prompt-composer]>:is([data-part=header],[data-part=footer]){--slotted-icon-size: var(--_icon-size);--slotted-control-inner-size: var(--_button);align-items:center;display:flex;gap:var(--slotted-space-2, .25rem);min-inline-size:0;padding:var(--_inset)}[data-ui=prompt-composer]>[data-part=header]{flex-wrap:wrap;padding-block-end:0}[data-ui=prompt-composer]>[data-part=header]>*{max-inline-size:100%;min-inline-size:0}[data-ui=prompt-composer]>[data-part=footer]{flex-wrap:nowrap;padding-block-start:0}[data-ui=prompt-composer]>:is([data-part=header],[data-part=footer])>:is([data-part=action],[data-part=attach]){align-items:center;appearance:none;background-color:transparent;block-size:var(--_button);border:0;border-radius:var(--_action-radius);box-sizing:border-box;color:var(--slotted-prompt-composer-action-color, var(--slotted-text-muted, GrayText));cursor:pointer;display:inline-flex;flex:0 0 auto;font:inherit;gap:var(--slotted-space-2, .25rem);justify-content:center;line-height:1;min-inline-size:var(--_button);padding:0;position:relative;touch-action:manipulation;transition:background-color var(--slotted-control-transition-duration) var(--slotted-control-transition-easing);unicode-bidi:plaintext;white-space:nowrap;-webkit-tap-highlight-color:transparent}[data-ui=prompt-composer]>:is([data-part=header],[data-part=footer])>[data-part=action]:not([aria-label],[aria-labelledby]){color:var(--slotted-prompt-composer-action-label-color, var(--slotted-text, CanvasText));font-weight:var(--slotted-font-weight-medium, 500);padding-inline:var(--slotted-space-3, .375rem)}[data-ui=prompt-composer]>:is([data-part=header],[data-part=footer])>[data-part=action]:not([aria-label],[aria-labelledby]){align-content:center;align-items:baseline;display:inline-grid;grid-auto-flow:column;justify-content:center}[data-ui=prompt-composer]>:is([data-part=header],[data-part=footer])>[data-part=action]:not([aria-label],[aria-labelledby])>[data-ui=icon]{margin-block-start:calc((1cap + 1ex) / 4 - var(--_icon-size) / 2);translate:0 calc(var(--_icon-size) / 2 - (1cap + 1ex) / 4)}[data-ui=prompt-composer][data-variant=raised]>:is([data-part=header],[data-part=footer])>[data-part=action]:not([aria-label],[aria-labelledby]){padding-inline:var(--slotted-space-4, .5rem)}[data-ui=prompt-composer]>:is([data-part=header],[data-part=footer])>:is([data-part=action],[data-part=attach],[data-part=submit]):after{content:\"\";inset:min(0px,calc((100% - var(--slotted-target-min, 24px)) / 2));position:absolute}@media(pointer:coarse){[data-ui=prompt-composer]>:is([data-part=header],[data-part=footer])>:is([data-part=action],[data-part=attach],[data-part=submit]):after{inset:min(0px,calc((100% - var(--slotted-target-comfortable, 44px)) / 2))}[data-ui=prompt-composer]>:is([data-part=header],[data-part=footer])>:is([data-part=action],[data-part=attach]):has(+*):after{inset-inline-end:0}[data-ui=prompt-composer]>:is([data-part=header],[data-part=footer])>*+:is([data-part=action],[data-part=attach],[data-part=submit]):after{inset-inline-start:0}}[data-ui=prompt-composer]>:is([data-part=header],[data-part=footer])>:is([data-part=action],[data-part=attach]):hover:not(:disabled,[aria-expanded=true]){background-color:var( --slotted-prompt-composer-action-hover-background, var(--slotted-tone-secondary-subtle-hover) )}[data-ui=prompt-composer]>:is([data-part=header],[data-part=footer])>:is([data-part=action],[data-part=attach]):is(:active,[aria-expanded=true]):not(:disabled){background-color:var( --slotted-prompt-composer-action-active-background, var(--slotted-tone-secondary-subtle-active) )}[data-ui=prompt-composer]>:is([data-part=header],[data-part=footer])>:is([data-part=action],[data-part=attach]):disabled{color:var(--slotted-disabled-foreground);cursor:not-allowed}[data-ui=prompt-composer]>[data-part=footer]>[data-part=submit]{--slotted-spinner-size: var(--_icon-size);align-items:center;appearance:none;background-color:var( --slotted-prompt-composer-submit-background, var(--slotted-tone-accent-solid, Highlight) );block-size:var(--_button);border:0;border-radius:var(--slotted-radius-full, 9999px);color:var( --slotted-prompt-composer-submit-color, var(--slotted-tone-accent-on-solid, HighlightText) );cursor:pointer;display:inline-grid;flex:0 0 auto;inline-size:var(--_button);justify-items:center;margin-inline-start:auto;padding:0;position:relative;touch-action:manipulation;transition:background-color var(--slotted-control-transition-duration) var(--slotted-control-transition-easing),color var(--slotted-control-transition-duration) var(--slotted-control-transition-easing),scale var(--slotted-duration-short) var(--slotted-easing-standard);-webkit-tap-highlight-color:transparent}[data-ui=prompt-composer]>[data-part=footer]>[data-part=submit]>*{grid-area:1 / 1}[data-ui=prompt-composer]>[data-part=footer]>[data-part=submit]:not([aria-label],[aria-labelledby]){border-radius:var(--_action-radius);font:inherit;font-weight:var(--slotted-font-weight-medium, 500);inline-size:auto;line-height:1;padding-inline:var(--slotted-space-5, .75rem)}[data-ui=prompt-composer]>[data-part=footer]>[data-part=submit]:hover:not(:disabled){background-color:var( --slotted-prompt-composer-submit-hover-background, var(--slotted-tone-accent-solid-hover, Highlight) )}[data-ui=prompt-composer]>[data-part=footer]>[data-part=submit]:active:not(:disabled){background-color:var( --slotted-prompt-composer-submit-active-background, var(--slotted-tone-accent-solid-active, Highlight) )}[data-ui=prompt-composer]>[data-part=footer]>[data-part=submit]:is([aria-label],[aria-labelledby]):active:not(:disabled){scale:.9}[data-ui=prompt-composer]>[data-part=footer]>[data-part=submit]>[data-ui=icon]:has([data-glyph=arrow-up]){transition:translate var(--slotted-duration-short) var(--slotted-easing-standard)}[data-ui=prompt-composer]>[data-part=footer]>[data-part=submit]:hover:not(:disabled)>[data-ui=icon]:has([data-glyph=arrow-up]){translate:0 calc(var(--slotted-border-width-thin, 1px) * -1)}[data-ui=prompt-composer]>[data-part=footer]>[data-part=submit]:disabled{background-color:var( --slotted-prompt-composer-submit-disabled-background, var(--slotted-disabled-background) );color:var(--slotted-disabled-foreground);cursor:not-allowed}[data-ui=prompt-composer][data-status=submitted]>[data-part=footer]>[data-part=submit]{background-color:var( --slotted-prompt-composer-submit-background, var(--slotted-tone-accent-solid, Highlight) );color:var( --slotted-prompt-composer-submit-color, var(--slotted-tone-accent-on-solid, HighlightText) );cursor:progress}[data-ui=prompt-composer][data-status=streaming]>[data-part=footer]>[data-part=submit]{--slotted-spinner-size: calc(var(--_button) - 2 * var(--slotted-space-1, 2px));--slotted-icon-size: calc(var(--_icon-size) * 3 / 4)}[data-ui=prompt-composer]>[data-part=footer]>[data-part=submit]>:is([data-ui=icon],[data-ui=spinner]){transition:opacity var(--slotted-duration-short) var(--slotted-easing-enter),scale var(--slotted-duration-short) var(--slotted-easing-enter),translate var(--slotted-duration-short) var(--slotted-easing-standard)}@starting-style{[data-ui=prompt-composer]>[data-part=footer]>[data-part=submit]>:is([data-ui=icon],[data-ui=spinner]){opacity:0;scale:.8}}[data-ui=prompt-composer]>:is([data-part=header],[data-part=footer])>:is([data-part=action],[data-part=attach]):focus-visible{outline:var(--slotted-focus-ring-width, 2px) solid var(--slotted-focus-ring-color, Highlight);outline-offset:calc(var(--slotted-focus-ring-offset, 2px) * -1)}[data-ui=prompt-composer]>[data-part=footer]>[data-part=submit]:focus-visible{outline:var(--slotted-focus-ring-width, 2px) solid var(--slotted-focus-ring-color, Highlight);outline-offset:var(--slotted-focus-ring-offset, 2px)}[data-ui=prompt-composer][data-part=root]:hover:not([data-disabled]):not([data-readonly]):not([data-invalid]):not([data-drop-target]){border-color:var( --slotted-prompt-composer-hover-border-color, var(--slotted-tone-accent-border) )}[data-ui=prompt-composer][data-part=root]:has(>[data-part=input]:focus-visible){box-shadow:var(--_lift-focus);outline:var(--slotted-focus-ring-width, 2px) solid var(--slotted-focus-ring-color, Highlight);outline-offset:var(--slotted-focus-ring-offset, 2px)}[data-ui=prompt-composer][data-part=root]{position:relative}[data-ui=prompt-composer][data-part=root]:before{border:var(--slotted-border-width-medium, 1.5px) dashed var( --slotted-prompt-composer-drop-border-color, var(--slotted-tone-accent-border, transparent) );border-radius:max(var(--slotted-radius-xs, 2px),calc(var(--_radius) - var(--_inset) / 2));content:\"\";inset:calc(var(--_inset) / 2 - var(--slotted-control-border-width, 1px));opacity:0;pointer-events:none;position:absolute;transition:opacity var(--slotted-duration-short) var(--slotted-easing-exit)}[data-ui=prompt-composer][data-part=root][data-drop-target]:before{opacity:1;transition-timing-function:var(--slotted-easing-enter)}[data-ui=prompt-composer][data-part=root][data-drop-target]{background-color:var( --slotted-prompt-composer-drop-background, var(--slotted-tone-accent-surface, Canvas) );border-color:var( --slotted-prompt-composer-drop-border-color, var(--slotted-tone-accent-border, Highlight) )}[data-ui=prompt-composer][data-part=root][data-invalid]{--slotted-focus-ring-color: var( --slotted-prompt-composer-invalid-focus-ring-color, var(--slotted-focus-ring-color-invalid, Highlight) );--_invalid-edge-width: var( --slotted-prompt-composer-invalid-edge-width, var(--slotted-control-invalid-edge-width, 1px) );border-color:var( --slotted-prompt-composer-invalid-border-color, var(--slotted-tone-danger-border) )}[data-ui=prompt-composer][data-part=root][data-invalid]:after{border:var(--_invalid-edge-width) solid var(--slotted-prompt-composer-invalid-border-color, var(--slotted-tone-danger-border));border-radius:max(0px,calc(var(--_radius) - var(--slotted-control-border-width, 1px)));content:\"\";inset:0;pointer-events:none;position:absolute}[data-ui=prompt-composer][data-part=root][data-readonly]{background-color:var( --slotted-prompt-composer-readonly-background, var(--slotted-tone-secondary-subtle-hover) );cursor:default}[data-ui=prompt-composer][data-part=root][data-disabled]{background-color:var( --slotted-prompt-composer-disabled-background, var(--slotted-disabled-background) );border-color:var( --slotted-prompt-composer-disabled-border-color, var(--slotted-disabled-border) );box-shadow:none;color:var(--slotted-prompt-composer-disabled-color, var(--slotted-disabled-foreground));cursor:not-allowed}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlPromptComposer, decorators: [{
+            type: Component,
+            args: [{ selector: 'form[slPromptComposer]', standalone: true, exportAs: 'slPromptComposer', template: '<ng-content />', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
+                        'data-ui': 'prompt-composer',
+                        'data-part': 'root',
+                        novalidate: '',
+                        '[attr.data-size]': 'resolvedSize()',
+                        '[attr.data-variant]': 'resolvedVariant()',
+                        '[attr.data-status]': 'status()',
+                        '[attr.data-loading]': "busy() ? '' : null",
+                        '[attr.data-disabled]': "control()?.resolvedDisabled() === true ? '' : null",
+                        '[attr.data-readonly]': "control()?.resolvedReadOnly() === true ? '' : null",
+                        '[attr.data-invalid]': "control()?.resolvedInvalid() === true ? '' : null",
+                        '[attr.data-drop-target]': "dropTarget() ? '' : null",
+                        '(submit)': 'onSubmit($event)',
+                        '(mousedown)': 'onMouseDown($event)',
+                        '(dragover)': 'onDragOver($event)',
+                        '(dragleave)': 'onDragLeave($event)',
+                        '(drop)': 'onDrop($event)',
+                    }, styles: ["@layer slotted.components{[data-ui=prompt-composer][data-part=root]{--_font-size: var(--slotted-control-font-size-md, 13px);--_height: var(--slotted-control-height-md, 34px);--_icon-size: var(--slotted-control-icon-size-md, 16px);--_inner-size: var(--slotted-control-inner-size-md, 24px);--_rows: var(--slotted-prompt-composer-rows, 1);--_max-rows: var(--slotted-prompt-composer-max-rows, 8);--_button: var(--_inner-size);--_inset: max( 0px, calc((var(--_height) - 2 * var(--slotted-control-border-width, 1px) - var(--_inner-size)) / 2) );--_padding-inline: calc(var(--_inset) + (var(--_button) - var(--_icon-size)) / 2);--_padding-block: max(0px, calc((var(--_height) - 1lh) / 2));--_radius: var(--slotted-prompt-composer-radius, var(--slotted-radius-lg, 8px));--_action-radius: max(var(--slotted-radius-xs, 2px), calc(var(--_radius) - var(--_inset)));--_lift: var(--slotted-prompt-composer-shadow, var(--slotted-control-shadow, none));--_lift-focus: var(--slotted-control-shadow-focus-geometry, 0 1px 4px -1px) var(--slotted-focus-ring-color, Highlight);background-color:var( --slotted-prompt-composer-background, var(--slotted-control-surface, Field) );border:var(--slotted-control-border-width, 1px) solid var(--slotted-prompt-composer-border-color, var(--slotted-control-border-color, ButtonBorder));border-radius:var(--_radius);box-shadow:var(--_lift);box-sizing:border-box;color:var(--slotted-prompt-composer-color, var(--slotted-text, CanvasText));cursor:text;display:flex;flex-direction:column;font-family:var(--slotted-control-font-family, system-ui, sans-serif);font-size:var(--_font-size);inline-size:100%;line-height:var(--slotted-prompt-composer-line-height, var(--slotted-line-height-md, 1.5));margin:0;min-inline-size:0;transition:background-color var(--slotted-duration-medium) var(--slotted-easing-standard),border-color var(--slotted-duration-medium) var(--slotted-easing-standard),box-shadow var(--slotted-duration-medium) var(--slotted-easing-standard),outline-color var(--slotted-duration-medium) var(--slotted-easing-standard)}[data-ui=prompt-composer][data-part=root][data-size=sm]{--_font-size: var(--slotted-control-font-size-sm, 12px);--_height: var(--slotted-control-height-sm, 30px);--_icon-size: var(--slotted-control-icon-size-sm, 14px);--_inner-size: var(--slotted-control-inner-size-sm, 22px)}[data-ui=prompt-composer][data-part=root][data-size=lg]{--_font-size: var(--slotted-control-font-size-lg, 14px);--_height: var(--slotted-control-height-lg, 38px);--_icon-size: var(--slotted-control-icon-size-lg, 18px);--_inner-size: var(--slotted-control-inner-size-lg, 28px)}[data-ui=prompt-composer][data-part=root][data-variant=raised]{--_button: calc(var(--_inner-size) + var(--slotted-space-2, .25rem));--_inset: var(--slotted-space-4, .5rem);--_padding-block: calc(var(--_inset) + var(--slotted-space-2, .25rem));--_radius: var(--slotted-prompt-composer-radius, calc(var(--_button) / 2 + var(--_inset)));--_action-radius: var(--slotted-radius-full, 9999px);--_lift: var(--slotted-prompt-composer-raised-shadow, var(--slotted-shadow-md, none));--_lift-focus: var( --slotted-prompt-composer-raised-focus-shadow, var(--slotted-shadow-lg, none) )}[data-ui=prompt-composer][data-part=root][data-variant=subtle]{background-color:var( --slotted-prompt-composer-subtle-background, var(--slotted-surface-sunken, Canvas) );border-color:var( --slotted-prompt-composer-subtle-border-color, var(--slotted-border-subtle, ButtonBorder) )}[data-ui=prompt-composer]>[data-part=input]{appearance:none;background:transparent;border:0;box-sizing:border-box;caret-color:var(--slotted-prompt-composer-caret-color, var(--slotted-tone-accent-solid, auto));color:inherit;display:block;field-sizing:content;font:inherit;inline-size:100%;line-height:inherit;margin:0;max-block-size:calc(var(--_max-rows) * 1lh + 2 * var(--_padding-block));min-block-size:calc(var(--_rows) * 1lh + 2 * var(--_padding-block));outline:none;overflow-wrap:anywhere;overflow-y:auto;padding-block:var(--_padding-block);padding-inline:var(--_padding-inline);resize:none;scrollbar-color:var(--slotted-border-strong, GrayText) transparent;scrollbar-width:thin;unicode-bidi:plaintext}[data-ui=prompt-composer]>[data-part=input]::placeholder{color:var(--slotted-prompt-composer-placeholder-color, var(--slotted-text-muted, GrayText))}[data-ui=prompt-composer]>[data-part=input]::selection{background-color:var( --slotted-prompt-composer-selection-background, var(--slotted-tone-accent-surface, Highlight) )}[data-ui=prompt-composer]>[data-part=header]+[data-part=input]{padding-block-start:var(--_inset)}[data-ui=prompt-composer][data-variant=raised]>[data-part=input]:has(+[data-part=footer]){padding-block-end:var(--slotted-space-2, .25rem)}[data-ui=prompt-composer]>:is([data-part=header],[data-part=footer]){--slotted-icon-size: var(--_icon-size);--slotted-control-inner-size: var(--_button);align-items:center;display:flex;gap:var(--slotted-space-2, .25rem);min-inline-size:0;padding:var(--_inset)}[data-ui=prompt-composer]>[data-part=header]{flex-wrap:wrap;padding-block-end:0}[data-ui=prompt-composer]>[data-part=header]>*{max-inline-size:100%;min-inline-size:0}[data-ui=prompt-composer]>[data-part=footer]{flex-wrap:nowrap;padding-block-start:0}[data-ui=prompt-composer]>:is([data-part=header],[data-part=footer])>:is([data-part=action],[data-part=attach]){align-items:center;appearance:none;background-color:transparent;block-size:var(--_button);border:0;border-radius:var(--_action-radius);box-sizing:border-box;color:var(--slotted-prompt-composer-action-color, var(--slotted-text-muted, GrayText));cursor:pointer;display:inline-flex;flex:0 0 auto;font:inherit;gap:var(--slotted-space-2, .25rem);justify-content:center;line-height:1;min-inline-size:var(--_button);padding:0;position:relative;touch-action:manipulation;transition:background-color var(--slotted-control-transition-duration) var(--slotted-control-transition-easing);unicode-bidi:plaintext;white-space:nowrap;-webkit-tap-highlight-color:transparent}[data-ui=prompt-composer]>:is([data-part=header],[data-part=footer])>[data-part=action]:not([aria-label],[aria-labelledby]){color:var(--slotted-prompt-composer-action-label-color, var(--slotted-text, CanvasText));font-weight:var(--slotted-font-weight-medium, 500);padding-inline:var(--slotted-space-3, .375rem)}[data-ui=prompt-composer]>:is([data-part=header],[data-part=footer])>[data-part=action]:not([aria-label],[aria-labelledby]){align-content:center;align-items:baseline;display:inline-grid;grid-auto-flow:column;justify-content:center}[data-ui=prompt-composer]>:is([data-part=header],[data-part=footer])>[data-part=action]:not([aria-label],[aria-labelledby])>[data-ui=icon]{margin-block-start:calc((1cap + 1ex) / 4 - var(--_icon-size) / 2);translate:0 calc(var(--_icon-size) / 2 - (1cap + 1ex) / 4)}[data-ui=prompt-composer][data-variant=raised]>:is([data-part=header],[data-part=footer])>[data-part=action]:not([aria-label],[aria-labelledby]){padding-inline:var(--slotted-space-4, .5rem)}[data-ui=prompt-composer]>:is([data-part=header],[data-part=footer])>:is([data-part=action],[data-part=attach],[data-part=submit]):after{content:\"\";inset:min(0px,calc((100% - var(--slotted-target-min, 24px)) / 2));position:absolute}@media(pointer:coarse){[data-ui=prompt-composer]>:is([data-part=header],[data-part=footer])>:is([data-part=action],[data-part=attach],[data-part=submit]):after{inset:min(0px,calc((100% - var(--slotted-target-comfortable, 44px)) / 2))}[data-ui=prompt-composer]>:is([data-part=header],[data-part=footer])>:is([data-part=action],[data-part=attach]):has(+*):after{inset-inline-end:0}[data-ui=prompt-composer]>:is([data-part=header],[data-part=footer])>*+:is([data-part=action],[data-part=attach],[data-part=submit]):after{inset-inline-start:0}}[data-ui=prompt-composer]>:is([data-part=header],[data-part=footer])>:is([data-part=action],[data-part=attach]):hover:not(:disabled,[aria-expanded=true]){background-color:var( --slotted-prompt-composer-action-hover-background, var(--slotted-tone-secondary-subtle-hover) )}[data-ui=prompt-composer]>:is([data-part=header],[data-part=footer])>:is([data-part=action],[data-part=attach]):is(:active,[aria-expanded=true]):not(:disabled){background-color:var( --slotted-prompt-composer-action-active-background, var(--slotted-tone-secondary-subtle-active) )}[data-ui=prompt-composer]>:is([data-part=header],[data-part=footer])>:is([data-part=action],[data-part=attach]):disabled{color:var(--slotted-disabled-foreground);cursor:not-allowed}[data-ui=prompt-composer]>[data-part=footer]>[data-part=submit]{--slotted-spinner-size: var(--_icon-size);align-items:center;appearance:none;background-color:var( --slotted-prompt-composer-submit-background, var(--slotted-tone-accent-solid, Highlight) );block-size:var(--_button);border:0;border-radius:var(--slotted-radius-full, 9999px);color:var( --slotted-prompt-composer-submit-color, var(--slotted-tone-accent-on-solid, HighlightText) );cursor:pointer;display:inline-grid;flex:0 0 auto;inline-size:var(--_button);justify-items:center;margin-inline-start:auto;padding:0;position:relative;touch-action:manipulation;transition:background-color var(--slotted-control-transition-duration) var(--slotted-control-transition-easing),color var(--slotted-control-transition-duration) var(--slotted-control-transition-easing),scale var(--slotted-duration-short) var(--slotted-easing-standard);-webkit-tap-highlight-color:transparent}[data-ui=prompt-composer]>[data-part=footer]>[data-part=submit]>*{grid-area:1 / 1}[data-ui=prompt-composer]>[data-part=footer]>[data-part=submit]:not([aria-label],[aria-labelledby]){border-radius:var(--_action-radius);font:inherit;font-weight:var(--slotted-font-weight-medium, 500);inline-size:auto;line-height:1;padding-inline:var(--slotted-space-5, .75rem)}[data-ui=prompt-composer]>[data-part=footer]>[data-part=submit]:hover:not(:disabled){background-color:var( --slotted-prompt-composer-submit-hover-background, var(--slotted-tone-accent-solid-hover, Highlight) )}[data-ui=prompt-composer]>[data-part=footer]>[data-part=submit]:active:not(:disabled){background-color:var( --slotted-prompt-composer-submit-active-background, var(--slotted-tone-accent-solid-active, Highlight) )}[data-ui=prompt-composer]>[data-part=footer]>[data-part=submit]:is([aria-label],[aria-labelledby]):active:not(:disabled){scale:.9}[data-ui=prompt-composer]>[data-part=footer]>[data-part=submit]>[data-ui=icon]:has([data-glyph=arrow-up]){transition:translate var(--slotted-duration-short) var(--slotted-easing-standard)}[data-ui=prompt-composer]>[data-part=footer]>[data-part=submit]:hover:not(:disabled)>[data-ui=icon]:has([data-glyph=arrow-up]){translate:0 calc(var(--slotted-border-width-thin, 1px) * -1)}[data-ui=prompt-composer]>[data-part=footer]>[data-part=submit]:disabled{background-color:var( --slotted-prompt-composer-submit-disabled-background, var(--slotted-disabled-background) );color:var(--slotted-disabled-foreground);cursor:not-allowed}[data-ui=prompt-composer][data-status=submitted]>[data-part=footer]>[data-part=submit]{background-color:var( --slotted-prompt-composer-submit-background, var(--slotted-tone-accent-solid, Highlight) );color:var( --slotted-prompt-composer-submit-color, var(--slotted-tone-accent-on-solid, HighlightText) );cursor:progress}[data-ui=prompt-composer][data-status=streaming]>[data-part=footer]>[data-part=submit]{--slotted-spinner-size: calc(var(--_button) - 2 * var(--slotted-space-1, 2px));--slotted-icon-size: calc(var(--_icon-size) * 3 / 4)}[data-ui=prompt-composer]>[data-part=footer]>[data-part=submit]>:is([data-ui=icon],[data-ui=spinner]){transition:opacity var(--slotted-duration-short) var(--slotted-easing-enter),scale var(--slotted-duration-short) var(--slotted-easing-enter),translate var(--slotted-duration-short) var(--slotted-easing-standard)}@starting-style{[data-ui=prompt-composer]>[data-part=footer]>[data-part=submit]>:is([data-ui=icon],[data-ui=spinner]){opacity:0;scale:.8}}[data-ui=prompt-composer]>:is([data-part=header],[data-part=footer])>:is([data-part=action],[data-part=attach]):focus-visible{outline:var(--slotted-focus-ring-width, 2px) solid var(--slotted-focus-ring-color, Highlight);outline-offset:calc(var(--slotted-focus-ring-offset, 2px) * -1)}[data-ui=prompt-composer]>[data-part=footer]>[data-part=submit]:focus-visible{outline:var(--slotted-focus-ring-width, 2px) solid var(--slotted-focus-ring-color, Highlight);outline-offset:var(--slotted-focus-ring-offset, 2px)}[data-ui=prompt-composer][data-part=root]:hover:not([data-disabled]):not([data-readonly]):not([data-invalid]):not([data-drop-target]){border-color:var( --slotted-prompt-composer-hover-border-color, var(--slotted-tone-accent-border) )}[data-ui=prompt-composer][data-part=root]:has(>[data-part=input]:focus-visible){box-shadow:var(--_lift-focus);outline:var(--slotted-focus-ring-width, 2px) solid var(--slotted-focus-ring-color, Highlight);outline-offset:var(--slotted-focus-ring-offset, 2px)}[data-ui=prompt-composer][data-part=root]{position:relative}[data-ui=prompt-composer][data-part=root]:before{border:var(--slotted-border-width-medium, 1.5px) dashed var( --slotted-prompt-composer-drop-border-color, var(--slotted-tone-accent-border, transparent) );border-radius:max(var(--slotted-radius-xs, 2px),calc(var(--_radius) - var(--_inset) / 2));content:\"\";inset:calc(var(--_inset) / 2 - var(--slotted-control-border-width, 1px));opacity:0;pointer-events:none;position:absolute;transition:opacity var(--slotted-duration-short) var(--slotted-easing-exit)}[data-ui=prompt-composer][data-part=root][data-drop-target]:before{opacity:1;transition-timing-function:var(--slotted-easing-enter)}[data-ui=prompt-composer][data-part=root][data-drop-target]{background-color:var( --slotted-prompt-composer-drop-background, var(--slotted-tone-accent-surface, Canvas) );border-color:var( --slotted-prompt-composer-drop-border-color, var(--slotted-tone-accent-border, Highlight) )}[data-ui=prompt-composer][data-part=root][data-invalid]{--slotted-focus-ring-color: var( --slotted-prompt-composer-invalid-focus-ring-color, var(--slotted-focus-ring-color-invalid, Highlight) );--_invalid-edge-width: var( --slotted-prompt-composer-invalid-edge-width, var(--slotted-control-invalid-edge-width, 1px) );border-color:var( --slotted-prompt-composer-invalid-border-color, var(--slotted-tone-danger-border) )}[data-ui=prompt-composer][data-part=root][data-invalid]:after{border:var(--_invalid-edge-width) solid var(--slotted-prompt-composer-invalid-border-color, var(--slotted-tone-danger-border));border-radius:max(0px,calc(var(--_radius) - var(--slotted-control-border-width, 1px)));content:\"\";inset:0;pointer-events:none;position:absolute}[data-ui=prompt-composer][data-part=root][data-readonly]{background-color:var( --slotted-prompt-composer-readonly-background, var(--slotted-tone-secondary-subtle-hover) );cursor:default}[data-ui=prompt-composer][data-part=root][data-disabled]{background-color:var( --slotted-prompt-composer-disabled-background, var(--slotted-disabled-background) );border-color:var( --slotted-prompt-composer-disabled-border-color, var(--slotted-disabled-border) );box-shadow:none;color:var(--slotted-prompt-composer-disabled-color, var(--slotted-disabled-foreground));cursor:not-allowed}}\n"] }]
+        }], ctorParameters: () => [], propDecorators: { size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], status: [{ type: i0.Input, args: [{ isSignal: true, alias: "status", required: false }] }], submitOn: [{ type: i0.Input, args: [{ isSignal: true, alias: "submitOn", required: false }] }], canSubmit: [{ type: i0.Input, args: [{ isSignal: true, alias: "canSubmit", required: false }] }], accept: [{ type: i0.Input, args: [{ isSignal: true, alias: "accept", required: false }] }], multiple: [{ type: i0.Input, args: [{ isSignal: true, alias: "multiple", required: false }] }], maxSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxSize", required: false }] }], maxFiles: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxFiles", required: false }] }], messages: [{ type: i0.Input, args: [{ isSignal: true, alias: "messages", required: false }] }], valueSubmit: [{ type: i0.Output, args: ["valueSubmit"] }], stop: [{ type: i0.Output, args: ["stop"] }], attach: [{ type: i0.Output, args: ["attach"] }], control: [{ type: i0.ContentChild, args: [i0.forwardRef(() => SlPromptComposerControl), { ...{ descendants: true }, isSignal: true }] }] } });
+
+/**
+ * The value. Enter sends unless the composer's `submitOn` is `mod-enter`;
+ * Mod+Enter always sends; Shift+Enter is the platform's line break; nothing is
+ * sent while an input method is composing, because there Enter confirms the
+ * composition. Files pasted with or without text go to the composer's
+ * `attach`.
+ *
+ * The element owns the characters, as in `text-field`: a form's `writeValue`
+ * and a `[value]` binding write the element, and the directive keeps a mirror
+ * for the send and the count.
+ */
+class SlPromptComposerInput {
+    /** Present means the consumer owns the value. */
+    value = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
+    defaultValue = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "defaultValue" }] : /* istanbul ignore next */ []));
+    disabled = input(undefined, { ...(ngDevMode ? { debugName: "disabled" } : /* istanbul ignore next */ {}), transform: (value) => value === undefined ? undefined : booleanAttribute(value) });
+    readOnly = input(undefined, { ...(ngDevMode ? { debugName: "readOnly" } : /* istanbul ignore next */ {}), transform: (value) => value === undefined ? undefined : booleanAttribute(value) });
+    invalid = input(undefined, { ...(ngDevMode ? { debugName: "invalid" } : /* istanbul ignore next */ {}), transform: (value) => value === undefined ? undefined : booleanAttribute(value) });
+    /** The fewest lines the value shows. */
+    rows = input(1, { ...(ngDevMode ? { debugName: "rows" } : /* istanbul ignore next */ {}), transform: numberAttribute });
+    /** The most lines it grows to before it scrolls. */
+    maxRows = input(undefined, { ...(ngDevMode ? { debugName: "maxRows" } : /* istanbul ignore next */ {}), transform: (value) => (value == null ? undefined : numberAttribute(value)) });
+    /** Publishes the length of the value to the field, which draws the count. */
+    showCount = input(false, { ...(ngDevMode ? { debugName: "showCount" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    /** Before the value moves: `keyboard` for an edit, `submit` for the clearing after a send. */
+    valueChange = output();
+    element = inject(ElementRef).nativeElement;
+    composer = inject(SlPromptComposer);
+    field = inject(SlField, { optional: true });
+    writtenDir = inject(new HostAttributeToken('dir'), { optional: true });
+    writtenId = inject(new HostAttributeToken('id'), { optional: true });
+    writtenMaxLength = inject(new HostAttributeToken('maxlength'), {
+        optional: true,
+    });
+    mirror = signal('', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "mirror" }] : /* istanbul ignore next */ []));
+    formDisabled = signal(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "formDisabled" }] : /* istanbul ignore next */ []));
+    onChangeFn = () => undefined;
+    onTouchedFn = () => undefined;
+    current = this.mirror.asReadonly();
+    resolvedDisabled = computed(() => this.disabled() ?? this.formDisabled() ?? this.field?.resolvedDisabled(), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "resolvedDisabled" }] : /* istanbul ignore next */ []));
+    resolvedReadOnly = computed(() => this.readOnly() ?? this.field?.resolvedReadOnly(), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "resolvedReadOnly" }] : /* istanbul ignore next */ []));
+    resolvedInvalid = computed(() => this.invalid() ?? this.field?.invalid(), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "resolvedInvalid" }] : /* istanbul ignore next */ []));
+    controlId = computed(() => this.writtenId ?? this.field?.ids().control ?? null, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "controlId" }] : /* istanbul ignore next */ []));
+    describedBy = computed(() => this.field?.describedBy() || null, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "describedBy" }] : /* istanbul ignore next */ []));
+    constructor() {
+        effect(() => {
+            const next = this.value();
+            if (next === undefined || next === this.element.value)
+                return;
+            this.element.value = next;
+            this.mirror.set(next);
+        });
+        effect(() => {
+            if (this.field === null)
+                return;
+            if (!this.showCount()) {
+                this.field.setCount(undefined);
+                return;
+            }
+            const max = this.writtenMaxLength === null ? undefined : Number(this.writtenMaxLength);
+            this.field.setCount({ length: this.mirror().length, max });
+        });
+    }
+    ngOnInit() {
+        const initial = this.defaultValue() ?? this.element.value;
+        if (initial !== this.element.value)
+            this.element.value = initial;
+        this.mirror.set(this.element.value);
+    }
+    /** The native element, for `focus()`, `select()` and `setSelectionRange()`. */
+    get inputElement() {
+        return this.element;
+    }
+    focus() {
+        this.element.focus();
+    }
+    writeValue(value) {
+        this.element.value = value ?? '';
+        this.mirror.set(this.element.value);
+    }
+    registerOnChange(fn) {
+        this.onChangeFn = fn;
+    }
+    registerOnTouched(fn) {
+        this.onTouchedFn = fn;
+    }
+    setDisabledState(isDisabled) {
+        this.formDisabled.set(isDisabled);
+    }
+    clearAfterSubmit(source) {
+        if (!this.request('', 'submit', source))
+            return;
+        this.element.value = '';
+        this.mirror.set('');
+        this.onChangeFn('');
+    }
+    onInput(event) {
+        const next = this.element.value;
+        if (this.request(next, 'keyboard', event)) {
+            this.mirror.set(next);
+            this.onChangeFn(next);
+        }
+        else {
+            this.element.value = this.mirror();
+        }
+    }
+    onKeyDown(event) {
+        if (event.defaultPrevented || event.key !== 'Enter' || event.shiftKey)
+            return;
+        if (event.isComposing || event.keyCode === 229)
+            return;
+        const mod = event.metaKey || event.ctrlKey;
+        if (!mod && this.composer.resolvedSubmitOn() !== 'enter')
+            return;
+        event.preventDefault();
+        this.composer.submitWith('keyboard', event);
+    }
+    onPaste(event) {
+        const files = Array.from(event.clipboardData?.files ?? []);
+        if (files.length === 0)
+            return;
+        if (event.clipboardData?.getData('text/plain') === '')
+            event.preventDefault();
+        this.composer.attachFiles(files, 'paste', event);
+    }
+    request(next, reason, source) {
+        if (next === this.mirror())
+            return false;
+        let cancelled = false;
+        const state = createControllable({
+            controlled: undefined,
+            initial: this.mirror(),
+            onRequest: (request) => {
+                this.valueChange.emit(request);
+                cancelled = request.cancelled;
+            },
+        });
+        state.request(next, reason, source);
+        return !cancelled;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlPromptComposerInput, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.7", type: SlPromptComposerInput, isStandalone: true, selector: "textarea[slPromptComposerInput]", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, defaultValue: { classPropertyName: "defaultValue", publicName: "defaultValue", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, readOnly: { classPropertyName: "readOnly", publicName: "readOnly", isSignal: true, isRequired: false, transformFunction: null }, invalid: { classPropertyName: "invalid", publicName: "invalid", isSignal: true, isRequired: false, transformFunction: null }, rows: { classPropertyName: "rows", publicName: "rows", isSignal: true, isRequired: false, transformFunction: null }, maxRows: { classPropertyName: "maxRows", publicName: "maxRows", isSignal: true, isRequired: false, transformFunction: null }, showCount: { classPropertyName: "showCount", publicName: "showCount", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { valueChange: "valueChange" }, host: { attributes: { "data-part": "input" }, listeners: { "input": "onInput($event)", "keydown": "onKeyDown($event)", "paste": "onPaste($event)", "blur": "onTouchedFn()" }, properties: { "attr.id": "controlId()", "attr.dir": "writtenDir ?? 'auto'", "attr.rows": "rows()", "attr.aria-describedby": "describedBy()", "attr.aria-invalid": "resolvedInvalid() === true ? 'true' : null", "attr.aria-required": "field?.required() === true ? 'true' : null", "attr.disabled": "resolvedDisabled() === true ? '' : null", "attr.readonly": "resolvedReadOnly() === true ? '' : null", "style.--slotted-prompt-composer-rows": "rows()", "style.--slotted-prompt-composer-max-rows": "maxRows() ?? null" } }, providers: [
+            { provide: SlPromptComposerControl, useExisting: forwardRef(() => SlPromptComposerInput) },
+            {
+                provide: NG_VALUE_ACCESSOR,
+                useExisting: forwardRef(() => SlPromptComposerInput),
+                multi: true,
+            },
+        ], exportAs: ["slPromptComposerInput"], ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlPromptComposerInput, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: 'textarea[slPromptComposerInput]',
+                    standalone: true,
+                    exportAs: 'slPromptComposerInput',
+                    providers: [
+                        { provide: SlPromptComposerControl, useExisting: forwardRef(() => SlPromptComposerInput) },
+                        {
+                            provide: NG_VALUE_ACCESSOR,
+                            useExisting: forwardRef(() => SlPromptComposerInput),
+                            multi: true,
+                        },
+                    ],
+                    host: {
+                        'data-part': 'input',
+                        '[attr.id]': 'controlId()',
+                        '[attr.dir]': "writtenDir ?? 'auto'",
+                        '[attr.rows]': 'rows()',
+                        '[attr.aria-describedby]': 'describedBy()',
+                        '[attr.aria-invalid]': "resolvedInvalid() === true ? 'true' : null",
+                        '[attr.aria-required]': "field?.required() === true ? 'true' : null",
+                        '[attr.disabled]': "resolvedDisabled() === true ? '' : null",
+                        '[attr.readonly]': "resolvedReadOnly() === true ? '' : null",
+                        '[style.--slotted-prompt-composer-rows]': 'rows()',
+                        '[style.--slotted-prompt-composer-max-rows]': 'maxRows() ?? null',
+                        '(input)': 'onInput($event)',
+                        '(keydown)': 'onKeyDown($event)',
+                        '(paste)': 'onPaste($event)',
+                        '(blur)': 'onTouchedFn()',
+                    },
+                }]
+        }], ctorParameters: () => [], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], defaultValue: [{ type: i0.Input, args: [{ isSignal: true, alias: "defaultValue", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], readOnly: [{ type: i0.Input, args: [{ isSignal: true, alias: "readOnly", required: false }] }], invalid: [{ type: i0.Input, args: [{ isSignal: true, alias: "invalid", required: false }] }], rows: [{ type: i0.Input, args: [{ isSignal: true, alias: "rows", required: false }] }], maxRows: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxRows", required: false }] }], showCount: [{ type: i0.Input, args: [{ isSignal: true, alias: "showCount", required: false }] }], valueChange: [{ type: i0.Output, args: ["valueChange"] }] } });
+
+/** The band above the value: attachments, a quoted reply, a context chip. */
+class SlPromptComposerHeader {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlPromptComposerHeader, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.7", type: SlPromptComposerHeader, isStandalone: true, selector: "[slPromptComposerHeader]", host: { attributes: { "data-part": "header" } }, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlPromptComposerHeader, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[slPromptComposerHeader]',
+                    standalone: true,
+                    host: { 'data-part': 'header' },
+                }]
+        }] });
+/** The band below the value: tools on the start, the send at the end. */
+class SlPromptComposerFooter {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlPromptComposerFooter, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.7", type: SlPromptComposerFooter, isStandalone: true, selector: "[slPromptComposerFooter]", host: { attributes: { "data-part": "footer" } }, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlPromptComposerFooter, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[slPromptComposerFooter]',
+                    standalone: true,
+                    host: { 'data-part': 'footer' },
+                }]
+        }] });
+/**
+ * A button of the consumer's in a band: a model menu, a tool, Cancelar.
+ * `slMenuTriggerFor` on the same element binds `data-part` to `null`, and the
+ * binding is a constant, so the part is written back once after the first
+ * render — the rule `menu` records for its own trigger.
+ */
+class SlPromptComposerAction {
+    type = inject(new HostAttributeToken('type'), { optional: true }) ?? 'button';
+    constructor() {
+        const element = inject(ElementRef).nativeElement;
+        afterNextRender(() => element.setAttribute('data-part', 'action'));
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlPromptComposerAction, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.7", type: SlPromptComposerAction, isStandalone: true, selector: "button[slPromptComposerAction]", host: { attributes: { "data-part": "action" }, properties: { "attr.type": "type" } }, exportAs: ["slPromptComposerAction"], ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlPromptComposerAction, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: 'button[slPromptComposerAction]',
+                    standalone: true,
+                    exportAs: 'slPromptComposerAction',
+                    host: { 'data-part': 'action', '[attr.type]': 'type' },
+                }]
+        }], ctorParameters: () => [] });
+/**
+ * The paperclip. It opens a file chooser it creates and never attaches to the
+ * page, with the composer's `accept` and `multiple`; content projected into
+ * the button replaces the mark.
+ */
+class SlPromptComposerAttach {
+    composer = inject(SlPromptComposer);
+    label = inject(new HostAttributeToken('aria-label'), { optional: true });
+    open() {
+        const picker = document.createElement('input');
+        picker.type = 'file';
+        picker.multiple = this.composer.multiple();
+        const accept = this.composer.accept();
+        if (accept !== undefined)
+            picker.accept = accept;
+        picker.addEventListener('change', (event) => this.composer.attachFiles(Array.from(picker.files ?? []), 'pointer', event), { once: true });
+        picker.click();
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlPromptComposerAttach, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.1.7", type: SlPromptComposerAttach, isStandalone: true, selector: "button[slPromptComposerAttach]", host: { attributes: { "data-part": "attach", "type": "button" }, listeners: { "click": "open()" }, properties: { "attr.aria-label": "label ?? composer.t('attach')", "disabled": "composer.off()" } }, ngImport: i0, template: `<ng-content
+    ><span slIcon><svg slGlyph name="paperclip"></svg></span
+  ></ng-content>`, isInline: true, dependencies: [{ kind: "component", type: SlGlyph, selector: "svg[slGlyph]", inputs: ["name", "solid"] }, { kind: "component", type: SlIcon, selector: "[slIcon]", inputs: ["directional", "label", "size", "tone"], exportAs: ["slIcon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlPromptComposerAttach, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'button[slPromptComposerAttach]',
+                    standalone: true,
+                    imports: [SlGlyph, SlIcon],
+                    template: `<ng-content
+    ><span slIcon><svg slGlyph name="paperclip"></svg></span
+  ></ng-content>`,
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    encapsulation: ViewEncapsulation.None,
+                    host: {
+                        'data-part': 'attach',
+                        type: 'button',
+                        '[attr.aria-label]': "label ?? composer.t('attach')",
+                        '[disabled]': 'composer.off()',
+                        '(click)': 'open()',
+                    },
+                }]
+        }] });
+/**
+ * The send. Round and named by the provider's label for its status; a padded
+ * word when given text, which then names it. It turns into a busy ring while
+ * the request travels, a stop inside the ring while the answer streams, and a
+ * retry after an error.
+ */
+class SlPromptComposerSubmit {
+    composer = inject(SlPromptComposer);
+    element = inject(ElementRef).nativeElement;
+    /** Whether the consumer named the button with words of its own. */
+    named = signal(false, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "named" }] : /* istanbul ignore next */ []));
+    label = computed(() => {
+        const { t } = this.composer;
+        switch (this.composer.status()) {
+            case 'streaming':
+                return t('stop');
+            case 'submitted':
+                return t('sending');
+            case 'error':
+                return t('retry');
+            default:
+                return t('send');
+        }
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
+    constructor() {
+        afterNextRender(() => this.named.set((this.element.textContent ?? '').trim() !== ''));
+    }
+    activate(event) {
+        event.preventDefault();
+        const reason = event.detail === 0 ? 'keyboard' : 'pointer';
+        const status = this.composer.status();
+        if (status === 'streaming')
+            this.composer.stopWith(reason, event);
+        else if (status !== 'submitted')
+            this.composer.submitWith(reason, event);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlPromptComposerSubmit, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.7", type: SlPromptComposerSubmit, isStandalone: true, selector: "button[slPromptComposerSubmit]", host: { attributes: { "data-part": "submit" }, listeners: { "click": "activate($event)" }, properties: { "attr.type": "composer.busy() ? 'button' : 'submit'", "attr.aria-label": "named() ? null : label()", "attr.aria-disabled": "composer.status() === 'submitted' ? 'true' : null", "disabled": "composer.status() === 'streaming' ? false : composer.status() !== 'submitted' && !composer.resolvedCanSubmit()" } }, ngImport: i0, template: `<ng-content>
+    @switch (composer.status()) {
+      @case ('submitted') {
+        <span data-ui="spinner" aria-hidden="true"></span>
+      }
+      @case ('streaming') {
+        <span data-ui="spinner" aria-hidden="true"></span>
+        <span slIcon><svg slGlyph name="stop"></svg></span>
+      }
+      @case ('error') {
+        <span slIcon><svg slGlyph name="rotate-ccw"></svg></span>
+      }
+      @default {
+        <span slIcon><svg slGlyph name="arrow-up"></svg></span>
+      }
+    }
+  </ng-content>`, isInline: true, styles: ["@layer slotted.components{[data-ui=spinner]{--_size: var(--slotted-spinner-size, var(--slotted-control-icon-size-md, 16px));--_ring: calc(var(--_size) * 5 / 6);--_stroke: max(var(--slotted-border-width-medium, 1.5px), calc(var(--_size) / 12));--_radius: calc((var(--_ring) - var(--_stroke)) / 2);--_track: color-mix(in oklab, currentColor 20%, transparent);--_start: calc(var(--_turn) + var(--_tail));--_end: calc(var(--_turn) + var(--_head));--_cap: calc(var(--_stroke) / 2);animation:slotted-spinner-turn var(--slotted-duration-loop-slow) linear infinite,slotted-spinner-head var(--slotted-duration-loop-slow) linear infinite,slotted-spinner-tail var(--slotted-duration-loop-slow) linear infinite;background-image:radial-gradient(circle at calc(50% + var(--_radius) * sin(var(--_end))) calc(50% - var(--_radius) * cos(var(--_end))),currentColor calc(var(--_cap) - .5px),transparent calc(var(--_cap) + .5px)),radial-gradient(circle at calc(50% + var(--_radius) * sin(var(--_start))) calc(50% - var(--_radius) * cos(var(--_start))),currentColor calc(var(--_cap) - .5px),transparent calc(var(--_cap) + .5px)),conic-gradient(from var(--_start),currentColor 0deg,currentColor calc(var(--_head) - var(--_tail)),transparent calc(var(--_head) - var(--_tail))),conic-gradient(var(--_track) 0 100%);background-origin:content-box;background-clip:content-box;block-size:var(--_size);box-sizing:border-box;display:inline-block;flex:none;inline-size:var(--_size);-webkit-mask-image:radial-gradient(circle,transparent calc(var(--_ring) / 2 - var(--_stroke) - .5px),#000 calc(var(--_ring) / 2 - var(--_stroke) + .5px),#000 calc(var(--_ring) / 2 - .5px),transparent calc(var(--_ring) / 2 + .5px));mask-image:radial-gradient(circle,transparent calc(var(--_ring) / 2 - var(--_stroke) - .5px),#000 calc(var(--_ring) / 2 - var(--_stroke) + .5px),#000 calc(var(--_ring) / 2 - .5px),transparent calc(var(--_ring) / 2 + .5px));opacity:1;padding:calc((var(--_size) - var(--_ring)) / 2);scale:1;transition:opacity var(--slotted-control-transition-duration) var(--slotted-control-transition-easing),scale var(--slotted-control-transition-duration) var(--slotted-control-transition-easing);vertical-align:middle}@starting-style{[data-ui=spinner]{opacity:0;scale:.6}}@media(prefers-reduced-motion:reduce){[data-ui=spinner]{--_head: 270deg;animation:none}}@media(forced-colors:active){[data-ui=spinner]{forced-color-adjust:none}}}@property --_turn{inherits: false; initial-value: 0deg; syntax: \"<angle>\";}@property --_head{inherits: false; initial-value: 20deg; syntax: \"<angle>\";}@property --_tail{inherits: false; initial-value: 0deg; syntax: \"<angle>\";}@keyframes slotted-spinner-turn{to{--_turn: 460deg}}@keyframes slotted-spinner-head{0%{--_head: 20deg;animation-timing-function:ease-in-out}50%,to{--_head: 280deg}}@keyframes slotted-spinner-tail{0%,50%{--_tail: 0deg;animation-timing-function:ease-in-out}to{--_tail: 260deg}}\n"], dependencies: [{ kind: "component", type: SlGlyph, selector: "svg[slGlyph]", inputs: ["name", "solid"] }, { kind: "component", type: SlIcon, selector: "[slIcon]", inputs: ["directional", "label", "size", "tone"], exportAs: ["slIcon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlPromptComposerSubmit, decorators: [{
+            type: Component,
+            args: [{ selector: 'button[slPromptComposerSubmit]', standalone: true, imports: [SlGlyph, SlIcon], template: `<ng-content>
+    @switch (composer.status()) {
+      @case ('submitted') {
+        <span data-ui="spinner" aria-hidden="true"></span>
+      }
+      @case ('streaming') {
+        <span data-ui="spinner" aria-hidden="true"></span>
+        <span slIcon><svg slGlyph name="stop"></svg></span>
+      }
+      @case ('error') {
+        <span slIcon><svg slGlyph name="rotate-ccw"></svg></span>
+      }
+      @default {
+        <span slIcon><svg slGlyph name="arrow-up"></svg></span>
+      }
+    }
+  </ng-content>`, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
+                        'data-part': 'submit',
+                        '[attr.type]': "composer.busy() ? 'button' : 'submit'",
+                        '[attr.aria-label]': 'named() ? null : label()',
+                        '[attr.aria-disabled]': "composer.status() === 'submitted' ? 'true' : null",
+                        '[disabled]': "composer.status() === 'streaming' ? false : composer.status() !== 'submitted' && !composer.resolvedCanSubmit()",
+                        '(click)': 'activate($event)',
+                    }, styles: ["@layer slotted.components{[data-ui=spinner]{--_size: var(--slotted-spinner-size, var(--slotted-control-icon-size-md, 16px));--_ring: calc(var(--_size) * 5 / 6);--_stroke: max(var(--slotted-border-width-medium, 1.5px), calc(var(--_size) / 12));--_radius: calc((var(--_ring) - var(--_stroke)) / 2);--_track: color-mix(in oklab, currentColor 20%, transparent);--_start: calc(var(--_turn) + var(--_tail));--_end: calc(var(--_turn) + var(--_head));--_cap: calc(var(--_stroke) / 2);animation:slotted-spinner-turn var(--slotted-duration-loop-slow) linear infinite,slotted-spinner-head var(--slotted-duration-loop-slow) linear infinite,slotted-spinner-tail var(--slotted-duration-loop-slow) linear infinite;background-image:radial-gradient(circle at calc(50% + var(--_radius) * sin(var(--_end))) calc(50% - var(--_radius) * cos(var(--_end))),currentColor calc(var(--_cap) - .5px),transparent calc(var(--_cap) + .5px)),radial-gradient(circle at calc(50% + var(--_radius) * sin(var(--_start))) calc(50% - var(--_radius) * cos(var(--_start))),currentColor calc(var(--_cap) - .5px),transparent calc(var(--_cap) + .5px)),conic-gradient(from var(--_start),currentColor 0deg,currentColor calc(var(--_head) - var(--_tail)),transparent calc(var(--_head) - var(--_tail))),conic-gradient(var(--_track) 0 100%);background-origin:content-box;background-clip:content-box;block-size:var(--_size);box-sizing:border-box;display:inline-block;flex:none;inline-size:var(--_size);-webkit-mask-image:radial-gradient(circle,transparent calc(var(--_ring) / 2 - var(--_stroke) - .5px),#000 calc(var(--_ring) / 2 - var(--_stroke) + .5px),#000 calc(var(--_ring) / 2 - .5px),transparent calc(var(--_ring) / 2 + .5px));mask-image:radial-gradient(circle,transparent calc(var(--_ring) / 2 - var(--_stroke) - .5px),#000 calc(var(--_ring) / 2 - var(--_stroke) + .5px),#000 calc(var(--_ring) / 2 - .5px),transparent calc(var(--_ring) / 2 + .5px));opacity:1;padding:calc((var(--_size) - var(--_ring)) / 2);scale:1;transition:opacity var(--slotted-control-transition-duration) var(--slotted-control-transition-easing),scale var(--slotted-control-transition-duration) var(--slotted-control-transition-easing);vertical-align:middle}@starting-style{[data-ui=spinner]{opacity:0;scale:.6}}@media(prefers-reduced-motion:reduce){[data-ui=spinner]{--_head: 270deg;animation:none}}@media(forced-colors:active){[data-ui=spinner]{forced-color-adjust:none}}}@property --_turn{inherits: false; initial-value: 0deg; syntax: \"<angle>\";}@property --_head{inherits: false; initial-value: 20deg; syntax: \"<angle>\";}@property --_tail{inherits: false; initial-value: 0deg; syntax: \"<angle>\";}@keyframes slotted-spinner-turn{to{--_turn: 460deg}}@keyframes slotted-spinner-head{0%{--_head: 20deg;animation-timing-function:ease-in-out}50%,to{--_head: 280deg}}@keyframes slotted-spinner-tail{0%,50%{--_tail: 0deg;animation-timing-function:ease-in-out}to{--_tail: 260deg}}\n"] }]
+        }], ctorParameters: () => [] });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { PROMPT_COMPOSER_DEFAULTS, SlPromptComposer, SlPromptComposerAction, SlPromptComposerAttach, SlPromptComposerControl, SlPromptComposerFooter, SlPromptComposerHeader, SlPromptComposerInput, SlPromptComposerSubmit, injectPromptComposerDefaults, providePromptComposerDefaults };
+//# sourceMappingURL=slotted-angular-prompt-composer.mjs.map