@luzmo/ngx-lucero 2.0.1 → 2.2.0

package/esm/components/slider-handle.js

@@ -40,9 +40,9 @@ export class LuzmoSliderHandle {
     /** Per-handle value formatter. */
     getAriaHandleText;
     /** The handle value changed during user interaction. */
-    inputEvent = output({ alias: 'input' });
+    inputEvent = output();
     /** The handle value change was committed. */
-    changeEvent = output({ alias: 'change' });
+    changeEvent = output();
     constructor() {
         this.bindEvents();
         this.destroyRef.onDestroy(() => {
@@ -103,7 +103,6 @@ export class LuzmoSliderHandle {
     }
     bindEvents() {
         this.listenerCleanup.push(this.renderer.listen(this.host, 'input', (event) => {
-            this.inputEvent.emit(event);
             if (!this.isWritingValue) {
                 const eventWithDetail = event;
                 const eventTarget = event.target;
@@ -115,13 +114,13 @@ export class LuzmoSliderHandle {
                     : (detailRecord === undefined ? detail : undefined)
                         ?? eventTarget?.['value']
                         ?? hostRecord['value']);
-                if (Object.is(this.lastCvaValue, nextValue)) {
-                    return;
+                if (!Object.is(this.lastCvaValue, nextValue)) {
+                    this.lastCvaValue = nextValue;
+                    this.setHostProperty('value', nextValue);
+                    this.onChange(nextValue);
                 }
-                this.lastCvaValue = nextValue;
-                this.setHostProperty('value', nextValue);
-                this.onChange(nextValue);
             }
+            this.inputEvent.emit(event);
         }));
         this.listenerCleanup.push(this.renderer.listen(this.host, 'change', (event) => {
             this.changeEvent.emit(event);
@@ -154,7 +153,7 @@ export class LuzmoSliderHandle {
         return this.host.focus(options);
     }
     static ɵfac = function LuzmoSliderHandle_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || LuzmoSliderHandle)(); };
-    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: LuzmoSliderHandle, selectors: [["luzmo-slider-handle"]], inputs: { name: "name", label: "label", value: "value", defaultValue: "defaultValue", min: "min", max: "max", step: "step", color: "color", formatOptions: "formatOptions", normalization: "normalization", getAriaHandleText: "getAriaHandleText" }, outputs: { inputEvent: "input", changeEvent: "change" }, exportAs: ["luzmoSliderHandle"], features: [i0.ɵɵProvidersFeature([
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: LuzmoSliderHandle, selectors: [["luzmo-slider-handle"]], inputs: { name: "name", label: "label", value: "value", defaultValue: "defaultValue", min: "min", max: "max", step: "step", color: "color", formatOptions: "formatOptions", normalization: "normalization", getAriaHandleText: "getAriaHandleText" }, outputs: { inputEvent: "inputEvent", changeEvent: "changeEvent" }, exportAs: ["luzmoSliderHandle"], features: [i0.ɵɵProvidersFeature([
                 {
                     provide: NG_VALUE_ACCESSOR,
                     useExisting: forwardRef(() => LuzmoSliderHandle),
@@ -214,5 +213,5 @@ export class LuzmoSliderHandle {
         }], getAriaHandleText: [{
             type: Input,
             args: [{ alias: 'getAriaHandleText' }]
-        }], inputEvent: [{ type: i0.Output, args: ["input"] }], changeEvent: [{ type: i0.Output, args: ["change"] }] }); })();
+        }], inputEvent: [{ type: i0.Output, args: ["inputEvent"] }], changeEvent: [{ type: i0.Output, args: ["changeEvent"] }] }); })();
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(LuzmoSliderHandle, { className: "LuzmoSliderHandle", filePath: "components/slider-handle.ts", lineNumber: 24 }); })();

package/esm/components/slider.d.ts

@@ -93,7 +93,7 @@ export declare class LuzmoSlider implements OnChanges, ControlValueAccessor {
     setDisabledState(isDisabled: boolean): void;
     focus(options?: FocusOptions): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<LuzmoSlider, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<LuzmoSlider, "luzmo-slider", ["luzmoSlider"], { "label": { "alias": "label"; "required": false; }; "labels": { "alias": "labels"; "required": false; }; "applyFocusElementLabel": { "alias": "applyFocusElementLabel"; "required": false; }; "value": { "alias": "value"; "required": false; }; "min": { "alias": "min"; "required": false; }; "max": { "alias": "max"; "required": false; }; "step": { "alias": "step"; "required": false; }; "defaultValue": { "alias": "defaultValue"; "required": false; }; "variant": { "alias": "variant"; "required": false; }; "ramp": { "alias": "ramp"; "required": false; }; "ticks": { "alias": "ticks"; "required": false; }; "labelVisibility": { "alias": "labelVisibility"; "required": false; }; "fillStart": { "alias": "fillStart"; "required": false; }; "tickStep": { "alias": "tickStep"; "required": false; }; "tickLabels": { "alias": "tickLabels"; "required": false; }; "editable": { "alias": "editable"; "required": false; }; "hideStepper": { "alias": "hideStepper"; "required": false; }; "quiet": { "alias": "quiet"; "required": false; }; "indeterminate": { "alias": "indeterminate"; "required": false; }; "invalid": { "alias": "invalid"; "required": false; }; "readonly": { "alias": "readonly"; "required": false; }; "formatOptions": { "alias": "formatOptions"; "required": false; }; "normalization": { "alias": "normalization"; "required": false; }; "getAriaHandleText": { "alias": "getAriaHandleText"; "required": false; }; "getAriaValueText": { "alias": "getAriaValueText"; "required": false; }; "helpTextManager": { "alias": "helpTextManager"; "required": false; }; "size": { "alias": "size"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "tabIndex": { "alias": "tabIndex"; "required": false; }; }, { "inputEvent": "input"; "changeEvent": "change"; "keydownEvent": "keydown"; }, never, ["*"], true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<LuzmoSlider, "luzmo-slider", ["luzmoSlider"], { "label": { "alias": "label"; "required": false; }; "labels": { "alias": "labels"; "required": false; }; "applyFocusElementLabel": { "alias": "applyFocusElementLabel"; "required": false; }; "value": { "alias": "value"; "required": false; }; "min": { "alias": "min"; "required": false; }; "max": { "alias": "max"; "required": false; }; "step": { "alias": "step"; "required": false; }; "defaultValue": { "alias": "defaultValue"; "required": false; }; "variant": { "alias": "variant"; "required": false; }; "ramp": { "alias": "ramp"; "required": false; }; "ticks": { "alias": "ticks"; "required": false; }; "labelVisibility": { "alias": "labelVisibility"; "required": false; }; "fillStart": { "alias": "fillStart"; "required": false; }; "tickStep": { "alias": "tickStep"; "required": false; }; "tickLabels": { "alias": "tickLabels"; "required": false; }; "editable": { "alias": "editable"; "required": false; }; "hideStepper": { "alias": "hideStepper"; "required": false; }; "quiet": { "alias": "quiet"; "required": false; }; "indeterminate": { "alias": "indeterminate"; "required": false; }; "invalid": { "alias": "invalid"; "required": false; }; "readonly": { "alias": "readonly"; "required": false; }; "formatOptions": { "alias": "formatOptions"; "required": false; }; "normalization": { "alias": "normalization"; "required": false; }; "getAriaHandleText": { "alias": "getAriaHandleText"; "required": false; }; "getAriaValueText": { "alias": "getAriaValueText"; "required": false; }; "helpTextManager": { "alias": "helpTextManager"; "required": false; }; "size": { "alias": "size"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "tabIndex": { "alias": "tabIndex"; "required": false; }; }, { "inputEvent": "inputEvent"; "changeEvent": "changeEvent"; "keydownEvent": "keydownEvent"; }, never, ["*"], true, never>;
 }
 /** The underlying custom element type for LuzmoSlider */
 export type LuzmoSliderElement = LuzmoSliderHostElement;

package/esm/components/slider.js

@@ -77,11 +77,11 @@ export class LuzmoSlider {
     /** The tab index to apply to this control. See general documentation about the tabindex HTML property */
     tabIndex;
     /** The value changes during user interaction. */
-    inputEvent = output({ alias: 'input' });
+    inputEvent = output();
     /** A user value change is committed. */
-    changeEvent = output({ alias: 'change' });
+    changeEvent = output();
     /** Trick :focus-visible polyfill into thinking keyboard based focus */
-    keydownEvent = output({ alias: 'keydown' });
+    keydownEvent = output();
     constructor() {
         this.bindEvents();
         this.destroyRef.onDestroy(() => {
@@ -196,7 +196,6 @@ export class LuzmoSlider {
     }
     bindEvents() {
         this.listenerCleanup.push(this.renderer.listen(this.host, 'input', (event) => {
-            this.inputEvent.emit(event);
             if (!this.isWritingValue) {
                 const eventWithDetail = event;
                 const eventTarget = event.target;
@@ -208,13 +207,13 @@ export class LuzmoSlider {
                     : (detailRecord === undefined ? detail : undefined)
                         ?? eventTarget?.['value']
                         ?? hostRecord['value']);
-                if (Object.is(this.lastCvaValue, nextValue)) {
-                    return;
+                if (!Object.is(this.lastCvaValue, nextValue)) {
+                    this.lastCvaValue = nextValue;
+                    this.setHostProperty('value', nextValue);
+                    this.onChange(nextValue);
                 }
-                this.lastCvaValue = nextValue;
-                this.setHostProperty('value', nextValue);
-                this.onChange(nextValue);
             }
+            this.inputEvent.emit(event);
         }));
         this.listenerCleanup.push(this.renderer.listen(this.host, 'change', (event) => {
             this.changeEvent.emit(event);
@@ -255,7 +254,7 @@ export class LuzmoSlider {
         return this.host.focus(options);
     }
     static ɵfac = function LuzmoSlider_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || LuzmoSlider)(); };
-    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: LuzmoSlider, selectors: [["luzmo-slider"]], inputs: { label: "label", labels: "labels", applyFocusElementLabel: "applyFocusElementLabel", value: "value", min: "min", max: "max", step: "step", defaultValue: "defaultValue", variant: "variant", ramp: "ramp", ticks: "ticks", labelVisibility: "labelVisibility", fillStart: "fillStart", tickStep: "tickStep", tickLabels: "tickLabels", editable: "editable", hideStepper: "hideStepper", quiet: "quiet", indeterminate: "indeterminate", invalid: "invalid", readonly: "readonly", formatOptions: "formatOptions", normalization: "normalization", getAriaHandleText: "getAriaHandleText", getAriaValueText: "getAriaValueText", helpTextManager: "helpTextManager", size: "size", disabled: "disabled", tabIndex: "tabIndex" }, outputs: { inputEvent: "input", changeEvent: "change", keydownEvent: "keydown" }, exportAs: ["luzmoSlider"], features: [i0.ɵɵProvidersFeature([
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: LuzmoSlider, selectors: [["luzmo-slider"]], inputs: { label: "label", labels: "labels", applyFocusElementLabel: "applyFocusElementLabel", value: "value", min: "min", max: "max", step: "step", defaultValue: "defaultValue", variant: "variant", ramp: "ramp", ticks: "ticks", labelVisibility: "labelVisibility", fillStart: "fillStart", tickStep: "tickStep", tickLabels: "tickLabels", editable: "editable", hideStepper: "hideStepper", quiet: "quiet", indeterminate: "indeterminate", invalid: "invalid", readonly: "readonly", formatOptions: "formatOptions", normalization: "normalization", getAriaHandleText: "getAriaHandleText", getAriaValueText: "getAriaValueText", helpTextManager: "helpTextManager", size: "size", disabled: "disabled", tabIndex: "tabIndex" }, outputs: { inputEvent: "inputEvent", changeEvent: "changeEvent", keydownEvent: "keydownEvent" }, exportAs: ["luzmoSlider"], features: [i0.ɵɵProvidersFeature([
                 {
                     provide: NG_VALUE_ACCESSOR,
                     useExisting: forwardRef(() => LuzmoSlider),
@@ -369,5 +368,5 @@ export class LuzmoSlider {
         }], tabIndex: [{
             type: Input,
             args: [{ alias: 'tabIndex' }]
-        }], inputEvent: [{ type: i0.Output, args: ["input"] }], changeEvent: [{ type: i0.Output, args: ["change"] }], keydownEvent: [{ type: i0.Output, args: ["keydown"] }] }); })();
+        }], inputEvent: [{ type: i0.Output, args: ["inputEvent"] }], changeEvent: [{ type: i0.Output, args: ["changeEvent"] }], keydownEvent: [{ type: i0.Output, args: ["keydownEvent"] }] }); })();
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(LuzmoSlider, { className: "LuzmoSlider", filePath: "components/slider.ts", lineNumber: 27 }); })();

package/esm/components/split-view.d.ts

@@ -0,0 +1,59 @@
+import { OnChanges, SimpleChanges } from '@angular/core';
+import '@luzmo/lucero/split-view';
+import type { LuzmoSplitView as LuzmoSplitViewHostElement } from '@luzmo/lucero/split-view';
+import * as i0 from "@angular/core";
+export declare class LuzmoSplitView 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(): LuzmoSplitViewHostElement;
+    /** Stacks panes vertically instead of side by side. */
+    vertical?: boolean;
+    /** Enables pointer and keyboard resizing. */
+    resizable?: boolean;
+    /** Allows either pane to collapse at its edge. */
+    collapsible?: boolean;
+    /** Accessible name for the separator. */
+    label?: string;
+    /** Minimum primary pane size in pixels. */
+    primaryMin?: number;
+    /** Maximum primary pane size in pixels. */
+    primaryMax?: number;
+    /** Minimum secondary pane size in pixels. */
+    secondaryMin?: number;
+    /** Maximum secondary pane size in pixels. */
+    secondaryMax?: number;
+    /** Initial primary pane size in pixels, percentage, or `auto`. */
+    primarySize?: string;
+    /** Current primary pane size in pixels. */
+    splitterPos?: number;
+    /** Disable this control. It will not receive focus or events */
+    disabled?: boolean;
+    /** The tab index to apply to this control. See general documentation about the tabindex HTML property */
+    tabIndex?: number;
+    readonly type: import("@angular/core").OutputEmitterRef<Event>;
+    /** The splitter position changes during interaction. */
+    readonly inputEvent: import("@angular/core").OutputEmitterRef<CustomEvent<unknown>>;
+    /** A splitter position change is committed. */
+    readonly changeEvent: import("@angular/core").OutputEmitterRef<CustomEvent<unknown>>;
+    /** Trick :focus-visible polyfill into thinking keyboard based focus */
+    readonly keydownEvent: import("@angular/core").OutputEmitterRef<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(options?: FocusOptions): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<LuzmoSplitView, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<LuzmoSplitView, "luzmo-split-view", ["luzmoSplitView"], { "vertical": { "alias": "vertical"; "required": false; }; "resizable": { "alias": "resizable"; "required": false; }; "collapsible": { "alias": "collapsible"; "required": false; }; "label": { "alias": "label"; "required": false; }; "primaryMin": { "alias": "primaryMin"; "required": false; }; "primaryMax": { "alias": "primaryMax"; "required": false; }; "secondaryMin": { "alias": "secondaryMin"; "required": false; }; "secondaryMax": { "alias": "secondaryMax"; "required": false; }; "primarySize": { "alias": "primarySize"; "required": false; }; "splitterPos": { "alias": "splitterPos"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "tabIndex": { "alias": "tabIndex"; "required": false; }; }, { "type": "type"; "inputEvent": "inputEvent"; "changeEvent": "changeEvent"; "keydownEvent": "keydownEvent"; }, never, ["*"], true, never>;
+}
+/** The underlying custom element type for LuzmoSplitView */
+export type LuzmoSplitViewElement = LuzmoSplitViewHostElement;

package/esm/components/split-view.js

@@ -0,0 +1,181 @@
+import { ChangeDetectionStrategy, Component, DestroyRef, ElementRef, inject, Input, output, Renderer2 } from '@angular/core';
+import '@luzmo/lucero/split-view';
+import * as i0 from "@angular/core";
+const _c0 = ["*"];
+/**
+ * Divides two panes with an optionally interactive separator.
+ *
+ * @slot (default) - The first two elements are rendered as panes.
+ */
+export class LuzmoSplitView {
+    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;
+    }
+    /** Stacks panes vertically instead of side by side. */
+    vertical;
+    /** Enables pointer and keyboard resizing. */
+    resizable;
+    /** Allows either pane to collapse at its edge. */
+    collapsible;
+    /** Accessible name for the separator. */
+    label;
+    /** Minimum primary pane size in pixels. */
+    primaryMin;
+    /** Maximum primary pane size in pixels. */
+    primaryMax;
+    /** Minimum secondary pane size in pixels. */
+    secondaryMin;
+    /** Maximum secondary pane size in pixels. */
+    secondaryMax;
+    /** Initial primary pane size in pixels, percentage, or `auto`. */
+    primarySize;
+    /** Current primary pane size in pixels. */
+    splitterPos;
+    /** Disable this control. It will not receive focus or events */
+    disabled;
+    /** The tab index to apply to this control. See general documentation about the tabindex HTML property */
+    tabIndex;
+    type = output({ alias: 'type' });
+    /** The splitter position changes during interaction. */
+    inputEvent = output();
+    /** A splitter position change is committed. */
+    changeEvent = output();
+    /** Trick :focus-visible polyfill into thinking keyboard based focus */
+    keydownEvent = output();
+    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 'vertical':
+                    this.setHostProperty('vertical', changes['vertical'].currentValue);
+                    break;
+                case 'resizable':
+                    this.setHostProperty('resizable', changes['resizable'].currentValue);
+                    break;
+                case 'collapsible':
+                    this.setHostProperty('collapsible', changes['collapsible'].currentValue);
+                    break;
+                case 'label':
+                    this.setHostProperty('label', changes['label'].currentValue);
+                    break;
+                case 'primaryMin':
+                    this.setHostProperty('primaryMin', changes['primaryMin'].currentValue);
+                    break;
+                case 'primaryMax':
+                    this.setHostProperty('primaryMax', changes['primaryMax'].currentValue);
+                    break;
+                case 'secondaryMin':
+                    this.setHostProperty('secondaryMin', changes['secondaryMin'].currentValue);
+                    break;
+                case 'secondaryMax':
+                    this.setHostProperty('secondaryMax', changes['secondaryMax'].currentValue);
+                    break;
+                case 'primarySize':
+                    this.setHostProperty('primarySize', changes['primarySize'].currentValue);
+                    break;
+                case 'splitterPos':
+                    this.setHostProperty('splitterPos', changes['splitterPos'].currentValue);
+                    break;
+                case 'disabled':
+                    this.setHostProperty('disabled', changes['disabled'].currentValue);
+                    break;
+                case 'tabIndex':
+                    this.setHostProperty('tabIndex', changes['tabIndex'].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, 'type', (event) => {
+            this.type.emit(event);
+        }));
+        this.listenerCleanup.push(this.renderer.listen(this.host, 'input', (event) => {
+            this.inputEvent.emit(event);
+        }));
+        this.listenerCleanup.push(this.renderer.listen(this.host, 'change', (event) => {
+            this.changeEvent.emit(event);
+        }));
+        this.listenerCleanup.push(this.renderer.listen(this.host, 'keydown', (event) => {
+            this.keydownEvent.emit(event);
+        }));
+    }
+    focus(options) {
+        return this.host.focus(options);
+    }
+    static ɵfac = function LuzmoSplitView_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || LuzmoSplitView)(); };
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: LuzmoSplitView, selectors: [["luzmo-split-view"]], inputs: { vertical: "vertical", resizable: "resizable", collapsible: "collapsible", label: "label", primaryMin: "primaryMin", primaryMax: "primaryMax", secondaryMin: "secondaryMin", secondaryMax: "secondaryMax", primarySize: "primarySize", splitterPos: "splitterPos", disabled: "disabled", tabIndex: "tabIndex" }, outputs: { type: "type", inputEvent: "inputEvent", changeEvent: "changeEvent", keydownEvent: "keydownEvent" }, exportAs: ["luzmoSplitView"], features: [i0.ɵɵNgOnChangesFeature], ngContentSelectors: _c0, decls: 1, vars: 0, template: function LuzmoSplitView_Template(rf, ctx) { if (rf & 1) {
+            i0.ɵɵprojectionDef();
+            i0.ɵɵprojection(0);
+        } }, encapsulation: 2 });
+}
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(LuzmoSplitView, [{
+        type: Component,
+        args: [{
+                selector: 'luzmo-split-view',
+                exportAs: 'luzmoSplitView',
+                standalone: true,
+                changeDetection: ChangeDetectionStrategy.OnPush,
+                template: '<ng-content />'
+            }]
+    }], () => [], { vertical: [{
+            type: Input,
+            args: [{ alias: 'vertical' }]
+        }], resizable: [{
+            type: Input,
+            args: [{ alias: 'resizable' }]
+        }], collapsible: [{
+            type: Input,
+            args: [{ alias: 'collapsible' }]
+        }], label: [{
+            type: Input,
+            args: [{ alias: 'label' }]
+        }], primaryMin: [{
+            type: Input,
+            args: [{ alias: 'primaryMin' }]
+        }], primaryMax: [{
+            type: Input,
+            args: [{ alias: 'primaryMax' }]
+        }], secondaryMin: [{
+            type: Input,
+            args: [{ alias: 'secondaryMin' }]
+        }], secondaryMax: [{
+            type: Input,
+            args: [{ alias: 'secondaryMax' }]
+        }], primarySize: [{
+            type: Input,
+            args: [{ alias: 'primarySize' }]
+        }], splitterPos: [{
+            type: Input,
+            args: [{ alias: 'splitterPos' }]
+        }], disabled: [{
+            type: Input,
+            args: [{ alias: 'disabled' }]
+        }], tabIndex: [{
+            type: Input,
+            args: [{ alias: 'tabIndex' }]
+        }], type: [{ type: i0.Output, args: ["type"] }], inputEvent: [{ type: i0.Output, args: ["inputEvent"] }], changeEvent: [{ type: i0.Output, args: ["changeEvent"] }], keydownEvent: [{ type: i0.Output, args: ["keydownEvent"] }] }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(LuzmoSplitView, { className: "LuzmoSplitView", filePath: "components/split-view.ts", lineNumber: 17 }); })();

package/esm/components/swatch-group.d.ts

@@ -32,7 +32,7 @@ export declare class LuzmoSwatchGroup implements OnChanges {
     private bindEvents;
     focus(options?: FocusOptions): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<LuzmoSwatchGroup, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<LuzmoSwatchGroup, "luzmo-swatch-group", ["luzmoSwatchGroup"], { "border": { "alias": "border"; "required": false; }; "density": { "alias": "density"; "required": false; }; "rounding": { "alias": "rounding"; "required": false; }; "selected": { "alias": "selected"; "required": false; }; "selects": { "alias": "selects"; "required": false; }; "shape": { "alias": "shape"; "required": false; }; "swatches": { "alias": "swatches"; "required": false; }; "rovingTabindexController": { "alias": "rovingTabindexController"; "required": false; }; "size": { "alias": "size"; "required": false; }; }, { "changeEvent": "change"; }, never, ["*"], true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<LuzmoSwatchGroup, "luzmo-swatch-group", ["luzmoSwatchGroup"], { "border": { "alias": "border"; "required": false; }; "density": { "alias": "density"; "required": false; }; "rounding": { "alias": "rounding"; "required": false; }; "selected": { "alias": "selected"; "required": false; }; "selects": { "alias": "selects"; "required": false; }; "shape": { "alias": "shape"; "required": false; }; "swatches": { "alias": "swatches"; "required": false; }; "rovingTabindexController": { "alias": "rovingTabindexController"; "required": false; }; "size": { "alias": "size"; "required": false; }; }, { "changeEvent": "changeEvent"; }, never, ["*"], true, never>;
 }
 /** The underlying custom element type for LuzmoSwatchGroup */
 export type LuzmoSwatchGroupElement = LuzmoSwatchGroupHostElement;

package/esm/components/swatch-group.js

@@ -26,7 +26,7 @@ export class LuzmoSwatchGroup {
     swatches;
     rovingTabindexController;
     size;
-    changeEvent = output({ alias: 'change' });
+    changeEvent = output();
     constructor() {
         this.bindEvents();
         this.destroyRef.onDestroy(() => {
@@ -88,7 +88,7 @@ export class LuzmoSwatchGroup {
         return this.host.focus(options);
     }
     static ɵfac = function LuzmoSwatchGroup_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || LuzmoSwatchGroup)(); };
-    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: LuzmoSwatchGroup, selectors: [["luzmo-swatch-group"]], inputs: { border: "border", density: "density", rounding: "rounding", selected: "selected", selects: "selects", shape: "shape", swatches: "swatches", rovingTabindexController: "rovingTabindexController", size: "size" }, outputs: { changeEvent: "change" }, exportAs: ["luzmoSwatchGroup"], features: [i0.ɵɵNgOnChangesFeature], ngContentSelectors: _c0, decls: 1, vars: 0, template: function LuzmoSwatchGroup_Template(rf, ctx) { if (rf & 1) {
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: LuzmoSwatchGroup, selectors: [["luzmo-swatch-group"]], inputs: { border: "border", density: "density", rounding: "rounding", selected: "selected", selects: "selects", shape: "shape", swatches: "swatches", rovingTabindexController: "rovingTabindexController", size: "size" }, outputs: { changeEvent: "changeEvent" }, exportAs: ["luzmoSwatchGroup"], features: [i0.ɵɵNgOnChangesFeature], ngContentSelectors: _c0, decls: 1, vars: 0, template: function LuzmoSwatchGroup_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵprojectionDef();
             i0.ɵɵprojection(0);
         } }, encapsulation: 2 });
@@ -129,5 +129,5 @@ export class LuzmoSwatchGroup {
         }], size: [{
             type: Input,
             args: [{ alias: 'size' }]
-        }], changeEvent: [{ type: i0.Output, args: ["change"] }] }); })();
+        }], changeEvent: [{ type: i0.Output, args: ["changeEvent"] }] }); })();
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(LuzmoSwatchGroup, { className: "LuzmoSwatchGroup", filePath: "components/swatch-group.ts", lineNumber: 17 }); })();

package/esm/components/swatch.d.ts

@@ -51,7 +51,7 @@ export declare class LuzmoSwatch implements OnChanges, ControlValueAccessor {
     toggle(force?: boolean): void;
     focus(options?: FocusOptions): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<LuzmoSwatch, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<LuzmoSwatch, "luzmo-swatch", ["luzmoSwatch"], { "border": { "alias": "border"; "required": false; }; "color": { "alias": "color"; "required": false; }; "label": { "alias": "label"; "required": false; }; "mixedValue": { "alias": "mixedValue"; "required": false; }; "nothing": { "alias": "nothing"; "required": false; }; "role": { "alias": "role"; "required": false; }; "rounding": { "alias": "rounding"; "required": false; }; "selected": { "alias": "selected"; "required": false; }; "readonly": { "alias": "readonly"; "required": false; }; "shape": { "alias": "shape"; "required": false; }; "value": { "alias": "value"; "required": false; }; "size": { "alias": "size"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "tabIndex": { "alias": "tabIndex"; "required": false; }; }, { "changeEvent": "change"; "keydownEvent": "keydown"; }, never, ["*"], true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<LuzmoSwatch, "luzmo-swatch", ["luzmoSwatch"], { "border": { "alias": "border"; "required": false; }; "color": { "alias": "color"; "required": false; }; "label": { "alias": "label"; "required": false; }; "mixedValue": { "alias": "mixedValue"; "required": false; }; "nothing": { "alias": "nothing"; "required": false; }; "role": { "alias": "role"; "required": false; }; "rounding": { "alias": "rounding"; "required": false; }; "selected": { "alias": "selected"; "required": false; }; "readonly": { "alias": "readonly"; "required": false; }; "shape": { "alias": "shape"; "required": false; }; "value": { "alias": "value"; "required": false; }; "size": { "alias": "size"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "tabIndex": { "alias": "tabIndex"; "required": false; }; }, { "changeEvent": "changeEvent"; "keydownEvent": "keydownEvent"; }, never, ["*"], true, never>;
 }
 /** The underlying custom element type for LuzmoSwatch */
 export type LuzmoSwatchElement = LuzmoSwatchHostElement;

package/esm/components/swatch.js

@@ -32,9 +32,9 @@ export class LuzmoSwatch {
     disabled;
     /** The tab index to apply to this control. See general documentation about the tabindex HTML property */
     tabIndex;
-    changeEvent = output({ alias: 'change' });
+    changeEvent = output();
     /** Trick :focus-visible polyfill into thinking keyboard based focus */
-    keydownEvent = output({ alias: 'keydown' });
+    keydownEvent = output();
     constructor() {
         this.bindEvents();
         this.destroyRef.onDestroy(() => {
@@ -104,7 +104,6 @@ export class LuzmoSwatch {
     }
     bindEvents() {
         this.listenerCleanup.push(this.renderer.listen(this.host, 'change', (event) => {
-            this.changeEvent.emit(event);
             if (!this.isWritingValue) {
                 const eventWithDetail = event;
                 const eventTarget = event.target;
@@ -116,13 +115,13 @@ export class LuzmoSwatch {
                     : (detailRecord === undefined ? detail : undefined)
                         ?? eventTarget?.['value']
                         ?? hostRecord['value']);
-                if (Object.is(this.lastCvaValue, nextValue)) {
-                    return;
+                if (!Object.is(this.lastCvaValue, nextValue)) {
+                    this.lastCvaValue = nextValue;
+                    this.setHostProperty('value', nextValue);
+                    this.onChange(nextValue);
                 }
-                this.lastCvaValue = nextValue;
-                this.setHostProperty('value', nextValue);
-                this.onChange(nextValue);
             }
+            this.changeEvent.emit(event);
         }));
         this.listenerCleanup.push(this.renderer.listen(this.host, 'keydown', (event) => {
             this.keydownEvent.emit(event);
@@ -163,7 +162,7 @@ export class LuzmoSwatch {
         return this.host.focus(options);
     }
     static ɵfac = function LuzmoSwatch_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || LuzmoSwatch)(); };
-    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: LuzmoSwatch, selectors: [["luzmo-swatch"]], inputs: { border: "border", color: "color", label: "label", mixedValue: "mixedValue", nothing: "nothing", role: "role", rounding: "rounding", selected: "selected", readonly: "readonly", shape: "shape", value: "value", size: "size", disabled: "disabled", tabIndex: "tabIndex" }, outputs: { changeEvent: "change", keydownEvent: "keydown" }, exportAs: ["luzmoSwatch"], features: [i0.ɵɵProvidersFeature([
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: LuzmoSwatch, selectors: [["luzmo-swatch"]], inputs: { border: "border", color: "color", label: "label", mixedValue: "mixedValue", nothing: "nothing", role: "role", rounding: "rounding", selected: "selected", readonly: "readonly", shape: "shape", value: "value", size: "size", disabled: "disabled", tabIndex: "tabIndex" }, outputs: { changeEvent: "changeEvent", keydownEvent: "keydownEvent" }, exportAs: ["luzmoSwatch"], features: [i0.ɵɵProvidersFeature([
                 {
                     provide: NG_VALUE_ACCESSOR,
                     useExisting: forwardRef(() => LuzmoSwatch),
@@ -232,5 +231,5 @@ export class LuzmoSwatch {
         }], tabIndex: [{
             type: Input,
             args: [{ alias: 'tabIndex' }]
-        }], changeEvent: [{ type: i0.Output, args: ["change"] }], keydownEvent: [{ type: i0.Output, args: ["keydown"] }] }); })();
+        }], changeEvent: [{ type: i0.Output, args: ["changeEvent"] }], keydownEvent: [{ type: i0.Output, args: ["keydownEvent"] }] }); })();
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(LuzmoSwatch, { className: "LuzmoSwatch", filePath: "components/swatch.ts", lineNumber: 23 }); })();

package/esm/components/switch.d.ts

@@ -50,7 +50,7 @@ export declare class LuzmoSwitch implements OnChanges, ControlValueAccessor {
     setDisabledState(isDisabled: boolean): void;
     focus(options?: FocusOptions): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<LuzmoSwitch, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<LuzmoSwitch, "luzmo-switch", ["luzmoSwitch"], { "emphasized": { "alias": "emphasized"; "required": false; }; "thumb": { "alias": "thumb"; "required": false; }; "size": { "alias": "size"; "required": false; }; "checked": { "alias": "checked"; "required": false; }; "name": { "alias": "name"; "required": false; }; "readonly": { "alias": "readonly"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "tabIndex": { "alias": "tabIndex"; "required": false; }; }, { "changeEvent": "change"; "keydownEvent": "keydown"; }, never, ["*"], true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<LuzmoSwitch, "luzmo-switch", ["luzmoSwitch"], { "emphasized": { "alias": "emphasized"; "required": false; }; "thumb": { "alias": "thumb"; "required": false; }; "size": { "alias": "size"; "required": false; }; "checked": { "alias": "checked"; "required": false; }; "name": { "alias": "name"; "required": false; }; "readonly": { "alias": "readonly"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "tabIndex": { "alias": "tabIndex"; "required": false; }; }, { "changeEvent": "changeEvent"; "keydownEvent": "keydownEvent"; }, never, ["*"], true, never>;
 }
 /** The underlying custom element type for LuzmoSwitch */
 export type LuzmoSwitchElement = LuzmoSwitchHostElement;

package/esm/components/switch.js

@@ -34,9 +34,9 @@ export class LuzmoSwitch {
     /** The tab index to apply to this control. See general documentation about the tabindex HTML property */
     tabIndex;
     /** Announces a change in the `checked` property of a Switch */
-    changeEvent = output({ alias: 'change' });
+    changeEvent = output();
     /** Trick :focus-visible polyfill into thinking keyboard based focus */
-    keydownEvent = output({ alias: 'keydown' });
+    keydownEvent = output();
     constructor() {
         this.bindEvents();
         this.destroyRef.onDestroy(() => {
@@ -88,7 +88,6 @@ export class LuzmoSwitch {
     }
     bindEvents() {
         this.listenerCleanup.push(this.renderer.listen(this.host, 'change', (event) => {
-            this.changeEvent.emit(event);
             if (!this.isWritingValue) {
                 const eventWithDetail = event;
                 const eventTarget = event.target;
@@ -100,13 +99,13 @@ export class LuzmoSwitch {
                     : (detailRecord === undefined ? detail : undefined)
                         ?? eventTarget?.['checked']
                         ?? hostRecord['checked']);
-                if (Object.is(this.lastCvaValue, nextValue)) {
-                    return;
+                if (!Object.is(this.lastCvaValue, nextValue)) {
+                    this.lastCvaValue = nextValue;
+                    this.setHostProperty('checked', nextValue);
+                    this.onChange(nextValue);
                 }
-                this.lastCvaValue = nextValue;
-                this.setHostProperty('checked', nextValue);
-                this.onChange(nextValue);
             }
+            this.changeEvent.emit(event);
         }));
         this.listenerCleanup.push(this.renderer.listen(this.host, 'keydown', (event) => {
             this.keydownEvent.emit(event);
@@ -144,7 +143,7 @@ export class LuzmoSwitch {
         return this.host.focus(options);
     }
     static ɵfac = function LuzmoSwitch_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || LuzmoSwitch)(); };
-    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: LuzmoSwitch, selectors: [["luzmo-switch"]], inputs: { emphasized: "emphasized", thumb: "thumb", size: "size", checked: "checked", name: "name", readonly: "readonly", disabled: "disabled", tabIndex: "tabIndex" }, outputs: { changeEvent: "change", keydownEvent: "keydown" }, exportAs: ["luzmoSwitch"], features: [i0.ɵɵProvidersFeature([
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: LuzmoSwitch, selectors: [["luzmo-switch"]], inputs: { emphasized: "emphasized", thumb: "thumb", size: "size", checked: "checked", name: "name", readonly: "readonly", disabled: "disabled", tabIndex: "tabIndex" }, outputs: { changeEvent: "changeEvent", keydownEvent: "keydownEvent" }, exportAs: ["luzmoSwitch"], features: [i0.ɵɵProvidersFeature([
                 {
                     provide: NG_VALUE_ACCESSOR,
                     useExisting: forwardRef(() => LuzmoSwitch),
@@ -195,5 +194,5 @@ export class LuzmoSwitch {
         }], tabIndex: [{
             type: Input,
             args: [{ alias: 'tabIndex' }]
-        }], changeEvent: [{ type: i0.Output, args: ["change"] }], keydownEvent: [{ type: i0.Output, args: ["keydown"] }] }); })();
+        }], changeEvent: [{ type: i0.Output, args: ["changeEvent"] }], keydownEvent: [{ type: i0.Output, args: ["keydownEvent"] }] }); })();
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(LuzmoSwitch, { className: "LuzmoSwitch", filePath: "components/switch.ts", lineNumber: 25 }); })();

package/esm/components/tabs.d.ts

@@ -44,7 +44,7 @@ export declare class LuzmoTabs implements OnChanges {
     private bindEvents;
     focus(options?: FocusOptions): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<LuzmoTabs, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<LuzmoTabs, "luzmo-tabs", ["luzmoTabs"], { "auto": { "alias": "auto"; "required": false; }; "compact": { "alias": "compact"; "required": false; }; "direction": { "alias": "direction"; "required": false; }; "emphasized": { "alias": "emphasized"; "required": false; }; "label": { "alias": "label"; "required": false; }; "enableTabsScroll": { "alias": "enableTabsScroll"; "required": false; }; "quiet": { "alias": "quiet"; "required": false; }; "selectionIndicatorStyle": { "alias": "selectionIndicatorStyle"; "required": false; }; "shouldAnimate": { "alias": "shouldAnimate"; "required": false; }; "selected": { "alias": "selected"; "required": false; }; "size": { "alias": "size"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "tabIndex": { "alias": "tabIndex"; "required": false; }; }, { "changeEvent": "change"; "keydownEvent": "keydown"; }, never, ["*"], true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<LuzmoTabs, "luzmo-tabs", ["luzmoTabs"], { "auto": { "alias": "auto"; "required": false; }; "compact": { "alias": "compact"; "required": false; }; "direction": { "alias": "direction"; "required": false; }; "emphasized": { "alias": "emphasized"; "required": false; }; "label": { "alias": "label"; "required": false; }; "enableTabsScroll": { "alias": "enableTabsScroll"; "required": false; }; "quiet": { "alias": "quiet"; "required": false; }; "selectionIndicatorStyle": { "alias": "selectionIndicatorStyle"; "required": false; }; "shouldAnimate": { "alias": "shouldAnimate"; "required": false; }; "selected": { "alias": "selected"; "required": false; }; "size": { "alias": "size"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "tabIndex": { "alias": "tabIndex"; "required": false; }; }, { "changeEvent": "changeEvent"; "keydownEvent": "keydownEvent"; }, never, ["*"], true, never>;
 }
 /** The underlying custom element type for LuzmoTabs */
 export type LuzmoTabsElement = LuzmoTabsHostElement;

package/esm/components/tabs.js

@@ -38,9 +38,9 @@ export class LuzmoTabs {
     /** The tab index to apply to this control. See general documentation about the tabindex HTML property */
     tabIndex;
     /** The selected Tab child has changed. */
-    changeEvent = output({ alias: 'change' });
+    changeEvent = output();
     /** Trick :focus-visible polyfill into thinking keyboard based focus */
-    keydownEvent = output({ alias: 'keydown' });
+    keydownEvent = output();
     constructor() {
         this.bindEvents();
         this.destroyRef.onDestroy(() => {
@@ -117,7 +117,7 @@ export class LuzmoTabs {
         return this.host.focus(options);
     }
     static ɵfac = function LuzmoTabs_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || LuzmoTabs)(); };
-    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: LuzmoTabs, selectors: [["luzmo-tabs"]], inputs: { auto: "auto", compact: "compact", direction: "direction", emphasized: "emphasized", label: "label", enableTabsScroll: "enableTabsScroll", quiet: "quiet", selectionIndicatorStyle: "selectionIndicatorStyle", shouldAnimate: "shouldAnimate", selected: "selected", size: "size", disabled: "disabled", tabIndex: "tabIndex" }, outputs: { changeEvent: "change", keydownEvent: "keydown" }, exportAs: ["luzmoTabs"], features: [i0.ɵɵNgOnChangesFeature], ngContentSelectors: _c0, decls: 1, vars: 0, template: function LuzmoTabs_Template(rf, ctx) { if (rf & 1) {
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: LuzmoTabs, selectors: [["luzmo-tabs"]], inputs: { auto: "auto", compact: "compact", direction: "direction", emphasized: "emphasized", label: "label", enableTabsScroll: "enableTabsScroll", quiet: "quiet", selectionIndicatorStyle: "selectionIndicatorStyle", shouldAnimate: "shouldAnimate", selected: "selected", size: "size", disabled: "disabled", tabIndex: "tabIndex" }, outputs: { changeEvent: "changeEvent", keydownEvent: "keydownEvent" }, exportAs: ["luzmoTabs"], features: [i0.ɵɵNgOnChangesFeature], ngContentSelectors: _c0, decls: 1, vars: 0, template: function LuzmoTabs_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵprojectionDef();
             i0.ɵɵprojection(0);
         } }, encapsulation: 2 });
@@ -170,5 +170,5 @@ export class LuzmoTabs {
         }], tabIndex: [{
             type: Input,
             args: [{ alias: 'tabIndex' }]
-        }], changeEvent: [{ type: i0.Output, args: ["change"] }], keydownEvent: [{ type: i0.Output, args: ["keydown"] }] }); })();
+        }], changeEvent: [{ type: i0.Output, args: ["changeEvent"] }], keydownEvent: [{ type: i0.Output, args: ["keydownEvent"] }] }); })();
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(LuzmoTabs, { className: "LuzmoTabs", filePath: "components/tabs.ts", lineNumber: 19 }); })();

package/esm/components/tag.d.ts

@@ -19,7 +19,7 @@ export declare class LuzmoTag implements OnChanges {
     disabled?: boolean;
     readonly?: boolean;
     size?: ('xxs' | 'xs' | 's' | 'm' | 'l' | 'xl' | 'xxl');
-    readonly deleteEvent: import("@angular/core").OutputEmitterRef<Event>;
+    readonly delete: import("@angular/core").OutputEmitterRef<Event>;
     constructor();
     ngOnChanges(changes: SimpleChanges): void;
     /**
@@ -31,7 +31,7 @@ export declare class LuzmoTag implements OnChanges {
     private setHostProperty;
     private bindEvents;
     static ɵfac: i0.ɵɵFactoryDeclaration<LuzmoTag, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<LuzmoTag, "luzmo-tag", ["luzmoTag"], { "variant": { "alias": "variant"; "required": false; }; "treatment": { "alias": "treatment"; "required": false; }; "deletable": { "alias": "deletable"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "readonly": { "alias": "readonly"; "required": false; }; "size": { "alias": "size"; "required": false; }; }, { "deleteEvent": "delete"; }, never, ["*"], true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<LuzmoTag, "luzmo-tag", ["luzmoTag"], { "variant": { "alias": "variant"; "required": false; }; "treatment": { "alias": "treatment"; "required": false; }; "deletable": { "alias": "deletable"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "readonly": { "alias": "readonly"; "required": false; }; "size": { "alias": "size"; "required": false; }; }, { "delete": "delete"; }, never, ["*"], true, never>;
 }
 /** The underlying custom element type for LuzmoTag */
 export type LuzmoTagElement = LuzmoTagHostElement;