@luzmo/ngx-lucero 1.0.1-alpha.78

package/esm/components/progress-circle.js

@@ -0,0 +1,94 @@
+import { ChangeDetectionStrategy, Component, DestroyRef, ElementRef, inject, Input, Renderer2 } from '@angular/core';
+import '@luzmo/lucero/progress-circle';
+import * as i0 from "@angular/core";
+const _c0 = ["*"];
+/**
+ * Angular wrapper component for <luzmo-progress-circle>
+ */
+export class LuzmoProgressCircle {
+    elementRef = inject(ElementRef);
+    renderer = inject(Renderer2);
+    destroyRef = inject(DestroyRef);
+    host = this.elementRef.nativeElement;
+    listenerCleanup = [];
+    /** The underlying custom element instance. Use to call imperative methods. */
+    get nativeElement() {
+        return this.host;
+    }
+    /** The `indeterminate` attribute is used to indicate that the progress circle is in an indeterminate state */
+    indeterminate;
+    /** The aria-label of the progress circle */
+    label;
+    /** The `static-color` attribute is used to set the color of the progress circle to black or white. This is used when the progress circle is on a colored background. */
+    staticColor;
+    /** The progress in degrees of the progress circle */
+    progress;
+    constructor() {
+        this.bindEvents();
+        this.destroyRef.onDestroy(() => {
+            for (const cleanup of this.listenerCleanup) {
+                cleanup();
+            }
+        });
+    }
+    ngOnChanges(changes) {
+        for (const key of Object.keys(changes)) {
+            switch (key) {
+                case 'indeterminate':
+                    this.setHostProperty('indeterminate', changes['indeterminate'].currentValue);
+                    break;
+                case 'label':
+                    this.setHostProperty('label', changes['label'].currentValue);
+                    break;
+                case 'staticColor':
+                    this.setHostProperty('staticColor', changes['staticColor'].currentValue);
+                    break;
+                case 'progress':
+                    this.setHostProperty('progress', changes['progress'].currentValue);
+                    break;
+                default:
+                    break;
+            }
+        }
+    }
+    /**
+     * Forward a wrapper @Input to the underlying host element via Renderer2 so
+     * the wrapper stays compatible with non-DOM Angular platforms (SSR, tests).
+     * Unlike a "skip undefined" guard, this lets consumers reset values back to
+     * undefined / null by clearing their bindings.
+     */
+    setHostProperty(key, value) {
+        this.renderer.setProperty(this.host, key, value);
+    }
+    bindEvents() {
+        // No custom events for this wrapper.
+    }
+    static ɵfac = function LuzmoProgressCircle_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || LuzmoProgressCircle)(); };
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: LuzmoProgressCircle, selectors: [["luzmo-progress-circle"]], inputs: { indeterminate: "indeterminate", label: "label", staticColor: [0, "static-color", "staticColor"], progress: "progress" }, exportAs: ["luzmoProgressCircle"], features: [i0.ɵɵNgOnChangesFeature], ngContentSelectors: _c0, decls: 1, vars: 0, template: function LuzmoProgressCircle_Template(rf, ctx) { if (rf & 1) {
+            i0.ɵɵprojectionDef();
+            i0.ɵɵprojection(0);
+        } }, encapsulation: 2, changeDetection: 0 });
+}
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(LuzmoProgressCircle, [{
+        type: Component,
+        args: [{
+                selector: 'luzmo-progress-circle',
+                exportAs: 'luzmoProgressCircle',
+                standalone: true,
+                changeDetection: ChangeDetectionStrategy.OnPush,
+                template: '<ng-content />'
+            }]
+    }], () => [], { indeterminate: [{
+            type: Input,
+            args: [{ alias: 'indeterminate' }]
+        }], label: [{
+            type: Input,
+            args: [{ alias: 'label' }]
+        }], staticColor: [{
+            type: Input,
+            args: [{ alias: 'static-color' }]
+        }], progress: [{
+            type: Input,
+            args: [{ alias: 'progress' }]
+        }] }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(LuzmoProgressCircle, { className: "LuzmoProgressCircle", filePath: "components/progress-circle.ts", lineNumber: 15 }); })();

package/esm/components/progress-steps.d.ts

@@ -0,0 +1,46 @@
+import { OnChanges, SimpleChanges } from '@angular/core';
+import '@luzmo/lucero/progress-steps';
+import type { LuzmoProgressSteps as LuzmoProgressStepsHostElement, ProgressStepsLabels, ProgressTreeNode } from '@luzmo/lucero/progress-steps';
+import * as i0 from "@angular/core";
+export type { LocalizedString, ProgressStepsLabels, ProgressStepsStatuses, ProgressTreeNode, ProgressTreeNodeDescriptionMetadata } from '@luzmo/lucero/progress-steps';
+export declare class LuzmoProgressSteps implements OnChanges {
+    private readonly elementRef;
+    private readonly renderer;
+    private readonly destroyRef;
+    private readonly host;
+    private readonly listenerCleanup;
+    /** The underlying custom element instance. Use to call imperative methods. */
+    get nativeElement(): LuzmoProgressStepsHostElement;
+    /** The progress tree from the backend. The root node's children are rendered as main steps. */
+    progress?: ProgressTreeNode | null;
+    /** Locale for resolving localized strings in description metadata. Defaults to 'en'. */
+    locale?: string;
+    /** When true, collapses all auto-expanded steps. Manually expanded steps remain open. */
+    collapsed?: boolean;
+    /** Display mode for the progress steps. - 'detailed' (default): Shows full descriptions and substeps with expand/collapse - 'compact': Shows only step names without substeps or expand/collapse */
+    displayMode?: ('detailed' | 'compact');
+    /** When true, hides all steps behind a single "{n} steps completed" toggle line. Clicking the toggle expands/collapses the full step list. */
+    condensed?: boolean;
+    /** Labels used for visible text and screen readers. The default values are in English and can be overridden to localize the content. Use `{{count}}` in `stepCompleted` / `stepsCompleted` as a placeholder for the step count. */
+    labels?: ProgressStepsLabels;
+    /** When true, disables all entry animations (stepFadeIn, substepFadeIn). */
+    noAnimate?: boolean;
+    /** Fired when a step is collapsed */
+    readonly luzmoStepCollapsedEvent: import("@angular/core").OutputEmitterRef<CustomEvent<unknown>>;
+    /** Fired when a step is expanded */
+    readonly luzmoStepExpandedEvent: import("@angular/core").OutputEmitterRef<CustomEvent<unknown>>;
+    constructor();
+    ngOnChanges(changes: SimpleChanges): void;
+    /**
+     * Forward a wrapper @Input to the underlying host element via Renderer2 so
+     * the wrapper stays compatible with non-DOM Angular platforms (SSR, tests).
+     * Unlike a "skip undefined" guard, this lets consumers reset values back to
+     * undefined / null by clearing their bindings.
+     */
+    private setHostProperty;
+    private bindEvents;
+    static ɵfac: i0.ɵɵFactoryDeclaration<LuzmoProgressSteps, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<LuzmoProgressSteps, "luzmo-progress-steps", ["luzmoProgressSteps"], { "progress": { "alias": "progress"; "required": false; }; "locale": { "alias": "locale"; "required": false; }; "collapsed": { "alias": "collapsed"; "required": false; }; "displayMode": { "alias": "display-mode"; "required": false; }; "condensed": { "alias": "condensed"; "required": false; }; "labels": { "alias": "labels"; "required": false; }; "noAnimate": { "alias": "no-animate"; "required": false; }; }, { "luzmoStepCollapsedEvent": "luzmo-step-collapsed"; "luzmoStepExpandedEvent": "luzmo-step-expanded"; }, never, ["*"], true, never>;
+}
+/** The underlying custom element type for LuzmoProgressSteps */
+export type LuzmoProgressStepsElement = LuzmoProgressStepsHostElement;

package/esm/components/progress-steps.js

@@ -0,0 +1,127 @@
+import { ChangeDetectionStrategy, Component, DestroyRef, ElementRef, inject, Input, output, Renderer2 } from '@angular/core';
+import '@luzmo/lucero/progress-steps';
+import * as i0 from "@angular/core";
+const _c0 = ["*"];
+/**
+ * Angular wrapper component for <luzmo-progress-steps>
+ */
+export class LuzmoProgressSteps {
+    elementRef = inject(ElementRef);
+    renderer = inject(Renderer2);
+    destroyRef = inject(DestroyRef);
+    host = this.elementRef.nativeElement;
+    listenerCleanup = [];
+    /** The underlying custom element instance. Use to call imperative methods. */
+    get nativeElement() {
+        return this.host;
+    }
+    /** The progress tree from the backend. The root node's children are rendered as main steps. */
+    progress;
+    /** Locale for resolving localized strings in description metadata. Defaults to 'en'. */
+    locale;
+    /** When true, collapses all auto-expanded steps. Manually expanded steps remain open. */
+    collapsed;
+    /** Display mode for the progress steps. - 'detailed' (default): Shows full descriptions and substeps with expand/collapse - 'compact': Shows only step names without substeps or expand/collapse */
+    displayMode;
+    /** When true, hides all steps behind a single "{n} steps completed" toggle line. Clicking the toggle expands/collapses the full step list. */
+    condensed;
+    /** Labels used for visible text and screen readers. The default values are in English and can be overridden to localize the content. Use `{{count}}` in `stepCompleted` / `stepsCompleted` as a placeholder for the step count. */
+    labels;
+    /** When true, disables all entry animations (stepFadeIn, substepFadeIn). */
+    noAnimate;
+    /** Fired when a step is collapsed */
+    luzmoStepCollapsedEvent = output({ alias: 'luzmo-step-collapsed' });
+    /** Fired when a step is expanded */
+    luzmoStepExpandedEvent = output({ alias: 'luzmo-step-expanded' });
+    constructor() {
+        this.bindEvents();
+        this.destroyRef.onDestroy(() => {
+            for (const cleanup of this.listenerCleanup) {
+                cleanup();
+            }
+        });
+    }
+    ngOnChanges(changes) {
+        for (const key of Object.keys(changes)) {
+            switch (key) {
+                case 'progress':
+                    this.setHostProperty('progress', changes['progress'].currentValue);
+                    break;
+                case 'locale':
+                    this.setHostProperty('locale', changes['locale'].currentValue);
+                    break;
+                case 'collapsed':
+                    this.setHostProperty('collapsed', changes['collapsed'].currentValue);
+                    break;
+                case 'displayMode':
+                    this.setHostProperty('displayMode', changes['displayMode'].currentValue);
+                    break;
+                case 'condensed':
+                    this.setHostProperty('condensed', changes['condensed'].currentValue);
+                    break;
+                case 'labels':
+                    this.setHostProperty('labels', changes['labels'].currentValue);
+                    break;
+                case 'noAnimate':
+                    this.setHostProperty('noAnimate', changes['noAnimate'].currentValue);
+                    break;
+                default:
+                    break;
+            }
+        }
+    }
+    /**
+     * Forward a wrapper @Input to the underlying host element via Renderer2 so
+     * the wrapper stays compatible with non-DOM Angular platforms (SSR, tests).
+     * Unlike a "skip undefined" guard, this lets consumers reset values back to
+     * undefined / null by clearing their bindings.
+     */
+    setHostProperty(key, value) {
+        this.renderer.setProperty(this.host, key, value);
+    }
+    bindEvents() {
+        this.listenerCleanup.push(this.renderer.listen(this.host, 'luzmo-step-collapsed', (event) => {
+            this.luzmoStepCollapsedEvent.emit(event);
+        }));
+        this.listenerCleanup.push(this.renderer.listen(this.host, 'luzmo-step-expanded', (event) => {
+            this.luzmoStepExpandedEvent.emit(event);
+        }));
+    }
+    static ɵfac = function LuzmoProgressSteps_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || LuzmoProgressSteps)(); };
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: LuzmoProgressSteps, selectors: [["luzmo-progress-steps"]], inputs: { progress: "progress", locale: "locale", collapsed: "collapsed", displayMode: [0, "display-mode", "displayMode"], condensed: "condensed", labels: "labels", noAnimate: [0, "no-animate", "noAnimate"] }, outputs: { luzmoStepCollapsedEvent: "luzmo-step-collapsed", luzmoStepExpandedEvent: "luzmo-step-expanded" }, exportAs: ["luzmoProgressSteps"], features: [i0.ɵɵNgOnChangesFeature], ngContentSelectors: _c0, decls: 1, vars: 0, template: function LuzmoProgressSteps_Template(rf, ctx) { if (rf & 1) {
+            i0.ɵɵprojectionDef();
+            i0.ɵɵprojection(0);
+        } }, encapsulation: 2, changeDetection: 0 });
+}
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(LuzmoProgressSteps, [{
+        type: Component,
+        args: [{
+                selector: 'luzmo-progress-steps',
+                exportAs: 'luzmoProgressSteps',
+                standalone: true,
+                changeDetection: ChangeDetectionStrategy.OnPush,
+                template: '<ng-content />'
+            }]
+    }], () => [], { progress: [{
+            type: Input,
+            args: [{ alias: 'progress' }]
+        }], locale: [{
+            type: Input,
+            args: [{ alias: 'locale' }]
+        }], collapsed: [{
+            type: Input,
+            args: [{ alias: 'collapsed' }]
+        }], displayMode: [{
+            type: Input,
+            args: [{ alias: 'display-mode' }]
+        }], condensed: [{
+            type: Input,
+            args: [{ alias: 'condensed' }]
+        }], labels: [{
+            type: Input,
+            args: [{ alias: 'labels' }]
+        }], noAnimate: [{
+            type: Input,
+            args: [{ alias: 'no-animate' }]
+        }], luzmoStepCollapsedEvent: [{ type: i0.Output, args: ["luzmo-step-collapsed"] }], luzmoStepExpandedEvent: [{ type: i0.Output, args: ["luzmo-step-expanded"] }] }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(LuzmoProgressSteps, { className: "LuzmoProgressSteps", filePath: "components/progress-steps.ts", lineNumber: 16 }); })();

package/esm/components/prompt-box.d.ts

@@ -0,0 +1,88 @@
+import { OnChanges, SimpleChanges } from '@angular/core';
+import '@luzmo/lucero/prompt-box';
+import type { LuzmoPromptBox as LuzmoPromptBoxHostElement, PromptBoxSegment, TriggerConfig } from '@luzmo/lucero/prompt-box';
+import * as i0 from "@angular/core";
+export type { ActionValue, PromptBoxAttachment, PromptBoxElement, PromptBoxElementInsertedDetail, PromptBoxElementRemovedDetail, PromptBoxRecordErrorDetail, PromptBoxRecordingCompleteDetail, PromptBoxSegment, PromptBoxSubmitDetail, TriggerConfig, TriggerMenuChangeDetail, TriggerMenuSelectDetail, TriggerOption } from '@luzmo/lucero/prompt-box';
+export declare class LuzmoPromptBox implements OnChanges {
+    private readonly elementRef;
+    private readonly renderer;
+    private readonly destroyRef;
+    private readonly host;
+    private readonly listenerCleanup;
+    /** The underlying custom element instance. Use to call imperative methods. */
+    get nativeElement(): LuzmoPromptBoxHostElement;
+    /** The number of visible text rows for the textarea. */
+    rows?: number;
+    /** Whether the textarea should grow to accommodate content. */
+    grows?: boolean;
+    /** Maximum rows the textarea can grow to (`-1` = unlimited). Values less than 1 are disregarded. */
+    maxRows?: number;
+    /** Whether to show the record/voice button. */
+    recording?: boolean;
+    /** Whether the submit button is hidden. */
+    hideSubmit?: boolean;
+    /** Whether submit behavior is disabled while keeping the input interactive. */
+    disableSubmit?: boolean;
+    /** Whether to use single-line layout with actions, input, and submit in one row. */
+    singleLine?: boolean;
+    /** Placeholder text for the input. */
+    placeholder?: string;
+    /** The current value of the input. */
+    value?: string;
+    /** Whether the prompt box is disabled. */
+    disabled?: boolean;
+    /** Whether the input is readonly. */
+    readonly?: boolean;
+    /** Maximum number of characters allowed. */
+    maxlength?: number;
+    /** Whether the prompt box is in a pending/loading state. */
+    pending?: boolean;
+    /** Whether to allow image attachments. */
+    allowImages?: boolean;
+    /** Whether to allow file attachments. */
+    allowFiles?: boolean;
+    /** Accepted file types for attachments (MIME types or extensions). */
+    acceptedFileTypes?: string[];
+    /** Whether to enable rich input mode with inline element badges. When enabled, the textarea is replaced with a contenteditable div. */
+    allowElements?: boolean;
+    /** Optional filter for accepted element types during drag-and-drop. */
+    acceptedElementTypes?: string[];
+    /** Trigger key configurations. Each entry defines a key character that opens a popover when typed at a word boundary.  ```ts promptBox.triggers = [   { key: '@', options: assetOptions, slotName: 'assets-menu' },   { key: '/', options: skillOptions, lazy: true } ];  ``` */
+    triggers?: TriggerConfig[];
+    segments?: PromptBoxSegment[];
+    /** Fired when the prompt is submitted. */
+    readonly luzmoSubmitEvent: import("@angular/core").OutputEmitterRef<CustomEvent<unknown>>;
+    /** Fired when a trigger menu opens, closes, or the search string changes. */
+    readonly luzmoTriggerChangeEvent: import("@angular/core").OutputEmitterRef<CustomEvent<unknown>>;
+    /** Fired when an inline element badge is inserted. */
+    readonly luzmoElementInsertedEvent: import("@angular/core").OutputEmitterRef<CustomEvent<unknown>>;
+    /** Fired when an inline element badge is removed. */
+    readonly luzmoElementRemovedEvent: import("@angular/core").OutputEmitterRef<CustomEvent<unknown>>;
+    /** Fired when attachments change. */
+    readonly luzmoAttachmentsChangeEvent: import("@angular/core").OutputEmitterRef<CustomEvent<unknown>>;
+    /** Fired when recording state changes. */
+    readonly luzmoRecordEvent: import("@angular/core").OutputEmitterRef<CustomEvent<unknown>>;
+    /** Fired when recording finishes. */
+    readonly luzmoRecordingCompleteEvent: import("@angular/core").OutputEmitterRef<CustomEvent<unknown>>;
+    /** Fired when recording is cancelled. */
+    readonly luzmoRecordCancelEvent: import("@angular/core").OutputEmitterRef<CustomEvent<unknown>>;
+    /** Fired when recording errors. */
+    readonly luzmoRecordErrorEvent: import("@angular/core").OutputEmitterRef<CustomEvent<unknown>>;
+    constructor();
+    ngOnChanges(changes: SimpleChanges): void;
+    /**
+     * Forward a wrapper @Input to the underlying host element via Renderer2 so
+     * the wrapper stays compatible with non-DOM Angular platforms (SSR, tests).
+     * Unlike a "skip undefined" guard, this lets consumers reset values back to
+     * undefined / null by clearing their bindings.
+     */
+    private setHostProperty;
+    private bindEvents;
+    focus(): void;
+    clear(): void;
+    submit(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<LuzmoPromptBox, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<LuzmoPromptBox, "luzmo-prompt-box", ["luzmoPromptBox"], { "rows": { "alias": "rows"; "required": false; }; "grows": { "alias": "grows"; "required": false; }; "maxRows": { "alias": "max-rows"; "required": false; }; "recording": { "alias": "recording"; "required": false; }; "hideSubmit": { "alias": "hide-submit"; "required": false; }; "disableSubmit": { "alias": "disable-submit"; "required": false; }; "singleLine": { "alias": "single-line"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "value": { "alias": "value"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "readonly": { "alias": "readonly"; "required": false; }; "maxlength": { "alias": "maxlength"; "required": false; }; "pending": { "alias": "pending"; "required": false; }; "allowImages": { "alias": "allow-images"; "required": false; }; "allowFiles": { "alias": "allow-files"; "required": false; }; "acceptedFileTypes": { "alias": "accepted-file-types"; "required": false; }; "allowElements": { "alias": "allow-elements"; "required": false; }; "acceptedElementTypes": { "alias": "accepted-element-types"; "required": false; }; "triggers": { "alias": "triggers"; "required": false; }; "segments": { "alias": "segments"; "required": false; }; }, { "luzmoSubmitEvent": "luzmo-submit"; "luzmoTriggerChangeEvent": "luzmo-trigger-change"; "luzmoElementInsertedEvent": "luzmo-element-inserted"; "luzmoElementRemovedEvent": "luzmo-element-removed"; "luzmoAttachmentsChangeEvent": "luzmo-attachments-change"; "luzmoRecordEvent": "luzmo-record"; "luzmoRecordingCompleteEvent": "luzmo-recording-complete"; "luzmoRecordCancelEvent": "luzmo-record-cancel"; "luzmoRecordErrorEvent": "luzmo-record-error"; }, never, ["*"], true, never>;
+}
+/** The underlying custom element type for LuzmoPromptBox */
+export type LuzmoPromptBoxElement = LuzmoPromptBoxHostElement;

package/esm/components/prompt-box.js

@@ -0,0 +1,280 @@
+import { ChangeDetectionStrategy, Component, DestroyRef, ElementRef, inject, Input, output, Renderer2 } from '@angular/core';
+import '@luzmo/lucero/prompt-box';
+import * as i0 from "@angular/core";
+const _c0 = ["*"];
+/**
+ * A prompt box component for chat/AI interfaces with text input and action slots.
+ *
+ * @slot (default) - Default slot for additional content
+ * @slot top-actions - Slot for action buttons displayed above the input
+ * @slot bottom-actions - Slot for action buttons displayed below the input
+ * @slot record-button - Slot for a custom record/voice button
+ * @slot submit-button - Slot for a custom submit button
+ */
+export class LuzmoPromptBox {
+    elementRef = inject(ElementRef);
+    renderer = inject(Renderer2);
+    destroyRef = inject(DestroyRef);
+    host = this.elementRef.nativeElement;
+    listenerCleanup = [];
+    /** The underlying custom element instance. Use to call imperative methods. */
+    get nativeElement() {
+        return this.host;
+    }
+    /** The number of visible text rows for the textarea. */
+    rows;
+    /** Whether the textarea should grow to accommodate content. */
+    grows;
+    /** Maximum rows the textarea can grow to (`-1` = unlimited). Values less than 1 are disregarded. */
+    maxRows;
+    /** Whether to show the record/voice button. */
+    recording;
+    /** Whether the submit button is hidden. */
+    hideSubmit;
+    /** Whether submit behavior is disabled while keeping the input interactive. */
+    disableSubmit;
+    /** Whether to use single-line layout with actions, input, and submit in one row. */
+    singleLine;
+    /** Placeholder text for the input. */
+    placeholder;
+    /** The current value of the input. */
+    value;
+    /** Whether the prompt box is disabled. */
+    disabled;
+    /** Whether the input is readonly. */
+    readonly;
+    /** Maximum number of characters allowed. */
+    maxlength;
+    /** Whether the prompt box is in a pending/loading state. */
+    pending;
+    /** Whether to allow image attachments. */
+    allowImages;
+    /** Whether to allow file attachments. */
+    allowFiles;
+    /** Accepted file types for attachments (MIME types or extensions). */
+    acceptedFileTypes;
+    /** Whether to enable rich input mode with inline element badges. When enabled, the textarea is replaced with a contenteditable div. */
+    allowElements;
+    /** Optional filter for accepted element types during drag-and-drop. */
+    acceptedElementTypes;
+    /** Trigger key configurations. Each entry defines a key character that opens a popover when typed at a word boundary.  ```ts promptBox.triggers = [   { key: '@', options: assetOptions, slotName: 'assets-menu' },   { key: '/', options: skillOptions, lazy: true } ];  ``` */
+    triggers;
+    segments;
+    /** Fired when the prompt is submitted. */
+    luzmoSubmitEvent = output({ alias: 'luzmo-submit' });
+    /** Fired when a trigger menu opens, closes, or the search string changes. */
+    luzmoTriggerChangeEvent = output({ alias: 'luzmo-trigger-change' });
+    /** Fired when an inline element badge is inserted. */
+    luzmoElementInsertedEvent = output({ alias: 'luzmo-element-inserted' });
+    /** Fired when an inline element badge is removed. */
+    luzmoElementRemovedEvent = output({ alias: 'luzmo-element-removed' });
+    /** Fired when attachments change. */
+    luzmoAttachmentsChangeEvent = output({ alias: 'luzmo-attachments-change' });
+    /** Fired when recording state changes. */
+    luzmoRecordEvent = output({ alias: 'luzmo-record' });
+    /** Fired when recording finishes. */
+    luzmoRecordingCompleteEvent = output({ alias: 'luzmo-recording-complete' });
+    /** Fired when recording is cancelled. */
+    luzmoRecordCancelEvent = output({ alias: 'luzmo-record-cancel' });
+    /** Fired when recording errors. */
+    luzmoRecordErrorEvent = output({ alias: 'luzmo-record-error' });
+    constructor() {
+        this.bindEvents();
+        this.destroyRef.onDestroy(() => {
+            for (const cleanup of this.listenerCleanup) {
+                cleanup();
+            }
+        });
+    }
+    ngOnChanges(changes) {
+        for (const key of Object.keys(changes)) {
+            switch (key) {
+                case 'rows':
+                    this.setHostProperty('rows', changes['rows'].currentValue);
+                    break;
+                case 'grows':
+                    this.setHostProperty('grows', changes['grows'].currentValue);
+                    break;
+                case 'maxRows':
+                    this.setHostProperty('maxRows', changes['maxRows'].currentValue);
+                    break;
+                case 'recording':
+                    this.setHostProperty('recording', changes['recording'].currentValue);
+                    break;
+                case 'hideSubmit':
+                    this.setHostProperty('hideSubmit', changes['hideSubmit'].currentValue);
+                    break;
+                case 'disableSubmit':
+                    this.setHostProperty('disableSubmit', changes['disableSubmit'].currentValue);
+                    break;
+                case 'singleLine':
+                    this.setHostProperty('singleLine', changes['singleLine'].currentValue);
+                    break;
+                case 'placeholder':
+                    this.setHostProperty('placeholder', changes['placeholder'].currentValue);
+                    break;
+                case 'value':
+                    this.setHostProperty('value', changes['value'].currentValue);
+                    break;
+                case 'disabled':
+                    this.setHostProperty('disabled', changes['disabled'].currentValue);
+                    break;
+                case 'readonly':
+                    this.setHostProperty('readonly', changes['readonly'].currentValue);
+                    break;
+                case 'maxlength':
+                    this.setHostProperty('maxlength', changes['maxlength'].currentValue);
+                    break;
+                case 'pending':
+                    this.setHostProperty('pending', changes['pending'].currentValue);
+                    break;
+                case 'allowImages':
+                    this.setHostProperty('allowImages', changes['allowImages'].currentValue);
+                    break;
+                case 'allowFiles':
+                    this.setHostProperty('allowFiles', changes['allowFiles'].currentValue);
+                    break;
+                case 'acceptedFileTypes':
+                    this.setHostProperty('acceptedFileTypes', changes['acceptedFileTypes'].currentValue);
+                    break;
+                case 'allowElements':
+                    this.setHostProperty('allowElements', changes['allowElements'].currentValue);
+                    break;
+                case 'acceptedElementTypes':
+                    this.setHostProperty('acceptedElementTypes', changes['acceptedElementTypes'].currentValue);
+                    break;
+                case 'triggers':
+                    this.setHostProperty('triggers', changes['triggers'].currentValue);
+                    break;
+                case 'segments':
+                    this.setHostProperty('segments', changes['segments'].currentValue);
+                    break;
+                default:
+                    break;
+            }
+        }
+    }
+    /**
+     * Forward a wrapper @Input to the underlying host element via Renderer2 so
+     * the wrapper stays compatible with non-DOM Angular platforms (SSR, tests).
+     * Unlike a "skip undefined" guard, this lets consumers reset values back to
+     * undefined / null by clearing their bindings.
+     */
+    setHostProperty(key, value) {
+        this.renderer.setProperty(this.host, key, value);
+    }
+    bindEvents() {
+        this.listenerCleanup.push(this.renderer.listen(this.host, 'luzmo-submit', (event) => {
+            this.luzmoSubmitEvent.emit(event);
+        }));
+        this.listenerCleanup.push(this.renderer.listen(this.host, 'luzmo-trigger-change', (event) => {
+            this.luzmoTriggerChangeEvent.emit(event);
+        }));
+        this.listenerCleanup.push(this.renderer.listen(this.host, 'luzmo-element-inserted', (event) => {
+            this.luzmoElementInsertedEvent.emit(event);
+        }));
+        this.listenerCleanup.push(this.renderer.listen(this.host, 'luzmo-element-removed', (event) => {
+            this.luzmoElementRemovedEvent.emit(event);
+        }));
+        this.listenerCleanup.push(this.renderer.listen(this.host, 'luzmo-attachments-change', (event) => {
+            this.luzmoAttachmentsChangeEvent.emit(event);
+        }));
+        this.listenerCleanup.push(this.renderer.listen(this.host, 'luzmo-record', (event) => {
+            this.luzmoRecordEvent.emit(event);
+        }));
+        this.listenerCleanup.push(this.renderer.listen(this.host, 'luzmo-recording-complete', (event) => {
+            this.luzmoRecordingCompleteEvent.emit(event);
+        }));
+        this.listenerCleanup.push(this.renderer.listen(this.host, 'luzmo-record-cancel', (event) => {
+            this.luzmoRecordCancelEvent.emit(event);
+        }));
+        this.listenerCleanup.push(this.renderer.listen(this.host, 'luzmo-record-error', (event) => {
+            this.luzmoRecordErrorEvent.emit(event);
+        }));
+    }
+    focus() {
+        return this.host.focus();
+    }
+    clear() {
+        return this.host.clear();
+    }
+    submit() {
+        return this.host.submit();
+    }
+    static ɵfac = function LuzmoPromptBox_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || LuzmoPromptBox)(); };
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: LuzmoPromptBox, selectors: [["luzmo-prompt-box"]], inputs: { rows: "rows", grows: "grows", maxRows: [0, "max-rows", "maxRows"], recording: "recording", hideSubmit: [0, "hide-submit", "hideSubmit"], disableSubmit: [0, "disable-submit", "disableSubmit"], singleLine: [0, "single-line", "singleLine"], placeholder: "placeholder", value: "value", disabled: "disabled", readonly: "readonly", maxlength: "maxlength", pending: "pending", allowImages: [0, "allow-images", "allowImages"], allowFiles: [0, "allow-files", "allowFiles"], acceptedFileTypes: [0, "accepted-file-types", "acceptedFileTypes"], allowElements: [0, "allow-elements", "allowElements"], acceptedElementTypes: [0, "accepted-element-types", "acceptedElementTypes"], triggers: "triggers", segments: "segments" }, outputs: { luzmoSubmitEvent: "luzmo-submit", luzmoTriggerChangeEvent: "luzmo-trigger-change", luzmoElementInsertedEvent: "luzmo-element-inserted", luzmoElementRemovedEvent: "luzmo-element-removed", luzmoAttachmentsChangeEvent: "luzmo-attachments-change", luzmoRecordEvent: "luzmo-record", luzmoRecordingCompleteEvent: "luzmo-recording-complete", luzmoRecordCancelEvent: "luzmo-record-cancel", luzmoRecordErrorEvent: "luzmo-record-error" }, exportAs: ["luzmoPromptBox"], features: [i0.ɵɵNgOnChangesFeature], ngContentSelectors: _c0, decls: 1, vars: 0, template: function LuzmoPromptBox_Template(rf, ctx) { if (rf & 1) {
+            i0.ɵɵprojectionDef();
+            i0.ɵɵprojection(0);
+        } }, encapsulation: 2, changeDetection: 0 });
+}
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(LuzmoPromptBox, [{
+        type: Component,
+        args: [{
+                selector: 'luzmo-prompt-box',
+                exportAs: 'luzmoPromptBox',
+                standalone: true,
+                changeDetection: ChangeDetectionStrategy.OnPush,
+                template: '<ng-content />'
+            }]
+    }], () => [], { rows: [{
+            type: Input,
+            args: [{ alias: 'rows' }]
+        }], grows: [{
+            type: Input,
+            args: [{ alias: 'grows' }]
+        }], maxRows: [{
+            type: Input,
+            args: [{ alias: 'max-rows' }]
+        }], recording: [{
+            type: Input,
+            args: [{ alias: 'recording' }]
+        }], hideSubmit: [{
+            type: Input,
+            args: [{ alias: 'hide-submit' }]
+        }], disableSubmit: [{
+            type: Input,
+            args: [{ alias: 'disable-submit' }]
+        }], singleLine: [{
+            type: Input,
+            args: [{ alias: 'single-line' }]
+        }], placeholder: [{
+            type: Input,
+            args: [{ alias: 'placeholder' }]
+        }], value: [{
+            type: Input,
+            args: [{ alias: 'value' }]
+        }], disabled: [{
+            type: Input,
+            args: [{ alias: 'disabled' }]
+        }], readonly: [{
+            type: Input,
+            args: [{ alias: 'readonly' }]
+        }], maxlength: [{
+            type: Input,
+            args: [{ alias: 'maxlength' }]
+        }], pending: [{
+            type: Input,
+            args: [{ alias: 'pending' }]
+        }], allowImages: [{
+            type: Input,
+            args: [{ alias: 'allow-images' }]
+        }], allowFiles: [{
+            type: Input,
+            args: [{ alias: 'allow-files' }]
+        }], acceptedFileTypes: [{
+            type: Input,
+            args: [{ alias: 'accepted-file-types' }]
+        }], allowElements: [{
+            type: Input,
+            args: [{ alias: 'allow-elements' }]
+        }], acceptedElementTypes: [{
+            type: Input,
+            args: [{ alias: 'accepted-element-types' }]
+        }], triggers: [{
+            type: Input,
+            args: [{ alias: 'triggers' }]
+        }], segments: [{
+            type: Input,
+            args: [{ alias: 'segments' }]
+        }], luzmoSubmitEvent: [{ type: i0.Output, args: ["luzmo-submit"] }], luzmoTriggerChangeEvent: [{ type: i0.Output, args: ["luzmo-trigger-change"] }], luzmoElementInsertedEvent: [{ type: i0.Output, args: ["luzmo-element-inserted"] }], luzmoElementRemovedEvent: [{ type: i0.Output, args: ["luzmo-element-removed"] }], luzmoAttachmentsChangeEvent: [{ type: i0.Output, args: ["luzmo-attachments-change"] }], luzmoRecordEvent: [{ type: i0.Output, args: ["luzmo-record"] }], luzmoRecordingCompleteEvent: [{ type: i0.Output, args: ["luzmo-recording-complete"] }], luzmoRecordCancelEvent: [{ type: i0.Output, args: ["luzmo-record-cancel"] }], luzmoRecordErrorEvent: [{ type: i0.Output, args: ["luzmo-record-error"] }] }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(LuzmoPromptBox, { className: "LuzmoPromptBox", filePath: "components/prompt-box.ts", lineNumber: 22 }); })();