@kraft.stitch/angular 0.0.2 → 0.0.4-beta.1

package/fesm2022/kraft.stitch-angular.mjs

@@ -1,2873 +0,0 @@
-import '@kraft.stitch/core/dist/components/ks-button.js';
-import * as i0 from '@angular/core';
-import { input, output, effect, inject, DestroyRef, ChangeDetectionStrategy, Component, model } from '@angular/core';
-import '@kraft.stitch/core/dist/components/ks-button-group.js';
-import '@kraft.stitch/core/dist/components/ks-chips.js';
-import { NG_VALUE_ACCESSOR } from '@angular/forms';
-import '@kraft.stitch/core/dist/components/ks-fab.js';
-import '@kraft.stitch/core/dist/components/ks-datepicker.js';
-import '@kraft.stitch/core/dist/components/ks-daterange.js';
-import '@kraft.stitch/core/dist/components/ks-timepicker.js';
-import '@kraft.stitch/core/dist/components/ks-dropdown.js';
-import '@kraft.stitch/core/dist/components/ks-listbox.js';
-import '@kraft.stitch/core/dist/components/ks-checkbox.js';
-import '@kraft.stitch/core/dist/components/ks-colour-picker.js';
-import '@kraft.stitch/core/dist/components/ks-input.js';
-import '@kraft.stitch/core/dist/components/ks-otp-input.js';
-import '@kraft.stitch/core/dist/components/ks-radio.js';
-import '@kraft.stitch/core/dist/components/ks-rating.js';
-import '@kraft.stitch/core/dist/components/ks-slider.js';
-import '@kraft.stitch/core/dist/components/ks-switch.js';
-import '@kraft.stitch/core/dist/components/ks-textarea.js';
-import '@kraft.stitch/core/dist/components/ks-theme-switch.js';
-import { ThemeMode, LoaderStateEnum } from '@kraft.stitch/core';
-export { toastStore } from '@kraft.stitch/core';
-import '@kraft.stitch/core/dist/components/ks-uploader.js';
-import '@kraft.stitch/core/dist/components/ks-avatar.js';
-import '@kraft.stitch/core/dist/components/ks-card.js';
-import '@kraft.stitch/core/dist/components/ks-code-view.js';
-import '@kraft.stitch/core/dist/components/ks-dialog.js';
-import '@kraft.stitch/core/dist/components/ks-not-found.js';
-import '@kraft.stitch/core/dist/components/ks-sidebar.js';
-import '@kraft.stitch/core/dist/components/ks-table.js';
-import '@kraft.stitch/core/dist/components/ks-tooltip.js';
-import '@kraft.stitch/core/dist/components/ks-accordion.js';
-import '@kraft.stitch/core/dist/components/ks-breadcrumb.js';
-import '@kraft.stitch/core/dist/components/ks-carousel.js';
-import '@kraft.stitch/core/dist/components/ks-context-menu.js';
-import '@kraft.stitch/core/dist/components/ks-nav-bar.js';
-import '@kraft.stitch/core/dist/components/ks-pagination.js';
-import '@kraft.stitch/core/dist/components/ks-stepper.js';
-import '@kraft.stitch/core/dist/components/ks-tab.js';
-import '@kraft.stitch/core/dist/components/ks-toolbar.js';
-import '@kraft.stitch/core/dist/components/ks-top-nav-bar.js';
-import '@kraft.stitch/core/dist/components/ks-tree-view.js';
-import '@kraft.stitch/core/dist/components/ks-badge.js';
-import '@kraft.stitch/core/dist/components/ks-loader.js';
-import '@kraft.stitch/core/dist/components/ks-message.js';
-import '@kraft.stitch/core/dist/components/ks-progress.js';
-import '@kraft.stitch/core/dist/components/ks-spinner.js';
-import '@kraft.stitch/core/dist/components/ks-toast-outlet.js';
-
-// Side-effect import: registers the `ks-button` tag in the browser's
-// CustomElementRegistry (via Stencil's `auto-define-custom-elements`
-// behavior in `core/stencil.config.ts`). Nothing in THIS file renders the
-// button — see the class doc comment below for exactly what does.
-/**
- * Angular wrapper around the `<ks-button>` Stencil custom element.
- *
- * ## How this actually renders a button (no markup lives in this file)
- *
- * 1. A parent template writes `<ks-button name="Save" (ksClick)="save()">`.
- * 2. Angular's renderer creates that host node with
- *    `document.createElement('ks-button')`. Because the side-effect import
- *    above already ran `customElements.define('ks-button', ...)`, the
- *    **browser itself** immediately upgrades that node into an instance of
- *    Stencil's compiled `KsButton` class — this is standard Custom Elements
- *    behavior, nothing Angular-specific.
- * 3. That upgrade runs Stencil's `connectedCallback` → `render()`, which
- *    injects the real `<button>…</button>` markup as children of the host
- *    node. This happens **regardless of Angular** — it's the same thing
- *    that would happen if you dropped `<ks-button>` in a plain HTML file.
- * 4. `KsButtonComponent` (this class) is a *second, independent* thing
- *    attached to that same host node — Angular doesn't care that the node
- *    is also a custom element instance. Its only job is translation:
- *    push signal-input values onto the element's real DOM properties, and
- *    re-emit the native `clicked` DOM event as an Angular `output()`.
- *
- * `template: ''` (no `<ng-content>`) is intentional: `ks-button`'s Stencil
- * `render()` has no `<slot>`, so there is nothing to project — content
- * written between `<ks-button>` tags wouldn't be displayed by the real
- * component anyway. Content projection would only make sense here if the
- * wrapped Stencil component actually declared a `<slot>`.
- *
- * ## Why the output is called `ksClick`, NOT `clicked`
- *
- * `<ks-button>` (the Stencil element) dispatches a **native** DOM
- * `CustomEvent` literally named `clicked` on the host node. It is tempting
- * to expose the wrapper's own output using that exact same name so the
- * public API "mirrors" the native event — but doing so creates a **name
- * collision** that makes the event fire twice from a parent template such
- * as `<ks-button (clicked)="log($event)">`:
- *
- * For *any* event binding in a template, Ivy's `ɵɵlistener` instruction
- * does two things whenever the bound name also happens to match a
- * directive/component **output** on that element (`tNode.outputs[name]`):
- * 1. It subscribes the template's handler to that output (`output.emit()`
- *    calls it).
- * 2. It **also** attaches a genuine `addEventListener(name, …)` straight
- *    onto the host DOM node for that same literal name, independent of
- *    step 1 — Ivy can't know whether the name is "just" an output or also
- *    a real DOM event some element in the tree might dispatch, so it wires
- *    both to be safe.
- *
- * If the output were named `clicked`, both of those fire for the *same*
- * underlying interaction here: (1) our own `this.ksClick.emit(...)` call
- * below invokes the template handler once, and (2) the raw native
- * `clicked` `CustomEvent` that `<ks-button>` dispatches on the host node
- * is picked up by Ivy's own native listener from step 2 and invokes the
- * *same* template handler a second time — with a different, unwrapped
- * event object. (An earlier attempt at fixing this used
- * `@HostListener('clicked', ['$event'])`, which hits the same
- * `tNode.outputs['clicked']` check and instead causes *infinite emit
- * recursion*, since the host listener itself becomes a subscriber of the
- * output it emits on.)
- *
- * Naming the output `ksClick` (no relation to any real DOM event name)
- * removes the collision entirely: a parent writes
- * `<ks-button (ksClick)="log($event)">`, Ivy subscribes that to our
- * output, and the phantom native `addEventListener('ksClick', …)` it also
- * attaches never fires because no such DOM event exists. Only the manual
- * `addEventListener('clicked', …)` below — on the *internal* native event
- * name, never referenced in any template — observes the real click and
- * re-emits it once through `ksClick`. (This mirrors how libraries like
- * Ionic prefix outputs, e.g. `ionChange` instead of `change`, for exactly
- * this reason.)
- */
-class KsButtonComponent {
-    el;
-    /** Icon class string (e.g. Material Icon or Font Awesome class) */
-    icon = input('', ...(ngDevMode ? [{ debugName: "icon" }] : /* istanbul ignore next */ []));
-    /** Button label text */
-    name = input('', ...(ngDevMode ? [{ debugName: "name" }] : /* istanbul ignore next */ []));
-    /** Visual style variant */
-    variant = input('brand', ...(ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []));
-    /** Size */
-    size = input('md', ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
-    /** Renders the button with fully-rounded pill corners */
-    isRounded = input(false, ...(ngDevMode ? [{ debugName: "isRounded" }] : /* istanbul ignore next */ []));
-    /** Disables the button */
-    disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
-    /**
-     * Emits the `MouseEvent` from the native `clicked` `CustomEvent`
-     * dispatched by `<ks-button>`. Deliberately NOT named `clicked` — see
-     * the class doc comment above for why that would fire this event twice.
-     */
-    ksClick = output();
-    constructor(ref) {
-        this.el = ref.nativeElement;
-        // Each signal input gets its own effect so only the properties that
-        // actually changed are written back to the DOM. Stencil's own
-        // `@Prop()` watchers take it from there and re-render the button.
-        effect(() => (this.el.icon = this.icon()));
-        effect(() => (this.el.name = this.name()));
-        effect(() => (this.el.variant = this.variant()));
-        effect(() => (this.el.size = this.size()));
-        effect(() => (this.el.isRounded = this.isRounded()));
-        effect(() => (this.el.disabled = this.disabled()));
-        // Attached manually (NOT `@HostListener`) to the *internal* native
-        // event name `clicked`, which is never referenced by name in any
-        // Angular template (`ksClick` is what templates bind to instead) — so
-        // there is no `tNode.outputs` name collision for Ivy to double-wire.
-        // zone.js's patched `addEventListener` means this still runs inside
-        // the Angular zone, so no manual `NgZone.run()` is needed, and change
-        // detection still runs after `emit()` below.
-        const onNativeClicked = (event) => {
-            this.ksClick.emit(event.detail);
-            event.preventDefault();
-        };
-        this.el.addEventListener('clicked', onNativeClicked);
-        inject(DestroyRef).onDestroy(() => this.el.removeEventListener('clicked', onNativeClicked));
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KsButtonComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.25", type: KsButtonComponent, isStandalone: true, selector: "ks-button", inputs: { icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, isRounded: { classPropertyName: "isRounded", publicName: "isRounded", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { ksClick: "ksClick" }, ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KsButtonComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'ks-button',
-                    standalone: true,
-                    template: '',
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                }]
-        }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { icon: [{ type: i0.Input, args: [{ isSignal: true, alias: "icon", required: false }] }], name: [{ type: i0.Input, args: [{ isSignal: true, alias: "name", required: false }] }], variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], isRounded: [{ type: i0.Input, args: [{ isSignal: true, alias: "isRounded", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], ksClick: [{ type: i0.Output, args: ["ksClick"] }] } });
-
-// Side-effect import: registers the `ks-button-group` tag in the browser's
-// CustomElementRegistry — see `button/button.ts` for the full explanation of
-// this pattern (Stencil owns rendering, this class only translates
-// Angular-idiomatic Input/Output into DOM property writes + event listeners).
-/**
- * Angular wrapper around the `<ks-button-group>` Stencil custom element.
- *
- * `template: ''` — the Stencil `render()` for this element has no `<slot>`,
- * so there is nothing for this wrapper to project; every button is
- * generated from the `buttons` input.
- *
- * ## Output naming
- * The native element dispatches DOM `CustomEvent`s named `clicked` and
- * `selectionChanged`. Both outputs below are renamed with a `ks` prefix
- * (`ksClick`, `ksSelectionChange`) rather than reusing those exact strings.
- * Doing so is required, not just cosmetic: for a template binding such as
- * `<ks-button-group (clicked)="...">`, Angular's `ɵɵlistener` instruction
- * *always* attaches a raw `addEventListener('clicked', …)` to the host
- * element in addition to subscribing to a same-named component output —
- * this is unconditional for element nodes (see
- * `packages/core/src/render3/instructions/listener.ts` →
- * `listenerInternal`), not something a custom-elements schema can opt out
- * of. With a same-named output, the parent handler would therefore run
- * *twice* per interaction — once via our own unwrapped `.emit()` call, once
- * via Angular's own raw listener receiving the untouched `CustomEvent`
- * (defeating the "no `event.detail`" requirement). Prefixing every output
- * with `ks` guarantees the literal name never matches a real DOM event, so
- * only our manual listener (below) ever observes it. See `button/button.ts`
- * for the original write-up of this same issue.
- */
-class KsButtonGroupComponent {
-    el;
-    /** The buttons to render */
-    buttons = input([], ...(ngDevMode ? [{ debugName: "buttons" }] : /* istanbul ignore next */ []));
-    /** Visual variant */
-    variant = input('brand', ...(ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []));
-    /** Size */
-    size = input('md', ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
-    /** Display style: 'default' (filled/outlined) or 'switch' (pill toggle) */
-    displayStyle = input('default', ...(ngDevMode ? [{ debugName: "displayStyle" }] : /* istanbul ignore next */ []));
-    /** Allow multiple selected buttons (toggle mode) */
-    multi = input(false, ...(ngDevMode ? [{ debugName: "multi" }] : /* istanbul ignore next */ []));
-    /** Toggle/selection mode — shows active state on click */
-    selectable = input(false, ...(ngDevMode ? [{ debugName: "selectable" }] : /* istanbul ignore next */ []));
-    /** Disables the entire group */
-    disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
-    /** Emits the clicked button's `key`. From the native `clicked` event. */
-    ksClick = output();
-    /** Emits the current selection when `selectable`. From the native `selectionChanged` event. */
-    ksSelectionChange = output();
-    constructor(ref) {
-        this.el = ref.nativeElement;
-        effect(() => (this.el.buttons = this.buttons()));
-        effect(() => (this.el.variant = this.variant()));
-        effect(() => (this.el.size = this.size()));
-        effect(() => (this.el.displayStyle = this.displayStyle()));
-        effect(() => (this.el.multi = this.multi()));
-        effect(() => (this.el.selectable = this.selectable()));
-        effect(() => (this.el.disabled = this.disabled()));
-        const onNativeClicked = (event) => {
-            this.ksClick.emit(event.detail);
-        };
-        const onNativeSelectionChanged = (event) => {
-            this.ksSelectionChange.emit(event.detail);
-        };
-        this.el.addEventListener('clicked', onNativeClicked);
-        this.el.addEventListener('selectionChanged', onNativeSelectionChanged);
-        inject(DestroyRef).onDestroy(() => {
-            this.el.removeEventListener('clicked', onNativeClicked);
-            this.el.removeEventListener('selectionChanged', onNativeSelectionChanged);
-        });
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KsButtonGroupComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.25", type: KsButtonGroupComponent, isStandalone: true, selector: "ks-button-group", inputs: { buttons: { classPropertyName: "buttons", publicName: "buttons", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, displayStyle: { classPropertyName: "displayStyle", publicName: "displayStyle", isSignal: true, isRequired: false, transformFunction: null }, multi: { classPropertyName: "multi", publicName: "multi", isSignal: true, isRequired: false, transformFunction: null }, selectable: { classPropertyName: "selectable", publicName: "selectable", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { ksClick: "ksClick", ksSelectionChange: "ksSelectionChange" }, ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KsButtonGroupComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'ks-button-group',
-                    standalone: true,
-                    template: '',
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                }]
-        }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { buttons: [{ type: i0.Input, args: [{ isSignal: true, alias: "buttons", required: false }] }], variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], displayStyle: [{ type: i0.Input, args: [{ isSignal: true, alias: "displayStyle", required: false }] }], multi: [{ type: i0.Input, args: [{ isSignal: true, alias: "multi", required: false }] }], selectable: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectable", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], ksClick: [{ type: i0.Output, args: ["ksClick"] }], ksSelectionChange: [{ type: i0.Output, args: ["ksSelectionChange"] }] } });
-
-// Side-effect import: registers the `ks-chips` tag — see `button/button.ts`
-// for the full explanation of this pattern.
-/**
- * Angular wrapper around the `<ks-chips>` Stencil custom element.
- *
- * ## Two-way binding
- * The Stencil source's own doc comment says Angular forms integration
- * (`ngModel`/`formControl`) would be "provided later by the generated
- * output-target wrappers" — this is that wrapper. Rather than trying to
- * reuse Angular's `[(value)]` banana-box sugar (which would require an
- * output literally named `valueChange`, colliding with the native
- * `valueChange` `CustomEvent` the element already dispatches — see
- * `button/button.ts` for why that double-fires), two-way binding is
- * implemented the idiomatic Angular way: `ControlValueAccessor`. Bind with
- * `[(ngModel)]="fruit"` or `formControlName="fruit"` and it Just Works,
- * because `NgModel`/`FormControlDirective` talk to `writeValue` /
- * `registerOnChange` directly through DI — no template event-name matching
- * involved, so there's no collision to worry about.
- *
- * For plain (non-forms) two-way use, bind explicitly instead:
- * `[value]="fruit" (ksValueChange)="fruit = $event"`.
- *
- * `template: ''` — no `<slot>` in the wrapped Stencil render, nothing to project.
- */
-class KsChipsComponent {
-    el;
-    onChange = () => { };
-    onTouched = () => { };
-    /** Full list of chip options */
-    options = input([], ...(ngDevMode ? [{ debugName: "options" }] : /* istanbul ignore next */ []));
-    /** Allow selecting multiple chips */
-    multi = input(false, ...(ngDevMode ? [{ debugName: "multi" }] : /* istanbul ignore next */ []));
-    /** Field label */
-    label = input('', ...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
-    /** Size */
-    size = input('md', ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
-    /** Renders chips with fully-rounded pill corners */
-    isRounded = input(true, ...(ngDevMode ? [{ debugName: "isRounded" }] : /* istanbul ignore next */ []));
-    /** Disabled state */
-    disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
-    /** Initial/controlled value for plain (non-forms) usage. Prefer `[(ngModel)]` / `formControlName` when inside a form. */
-    value = input(null, ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
-    /** Emits the newly-selected value(s). From the native `valueChange` event. */
-    ksValueChange = output();
-    constructor(ref) {
-        this.el = ref.nativeElement;
-        effect(() => (this.el.options = this.options()));
-        effect(() => (this.el.multi = this.multi()));
-        effect(() => (this.el.label = this.label()));
-        effect(() => (this.el.size = this.size()));
-        effect(() => (this.el.isRounded = this.isRounded()));
-        effect(() => (this.el.disabled = this.disabled()));
-        effect(() => void this.el.writeValue(this.value()));
-        const onNativeValueChange = (event) => {
-            const detail = event.detail;
-            this.ksValueChange.emit(detail);
-            this.onChange(detail);
-            this.onTouched();
-        };
-        this.el.addEventListener('valueChange', onNativeValueChange);
-        inject(DestroyRef).onDestroy(() => this.el.removeEventListener('valueChange', onNativeValueChange));
-    }
-    /** `ControlValueAccessor` — called by `ngModel`/`formControl` to push a value in. */
-    writeValue(value) {
-        void this.el.writeValue(value ?? null);
-    }
-    registerOnChange(fn) {
-        this.onChange = fn;
-    }
-    registerOnTouched(fn) {
-        this.onTouched = fn;
-    }
-    setDisabledState(isDisabled) {
-        this.el.disabled = isDisabled;
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KsChipsComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.25", type: KsChipsComponent, isStandalone: true, selector: "ks-chips", inputs: { options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, multi: { classPropertyName: "multi", publicName: "multi", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, isRounded: { classPropertyName: "isRounded", publicName: "isRounded", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { ksValueChange: "ksValueChange" }, providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: KsChipsComponent, multi: true }], ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KsChipsComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'ks-chips',
-                    standalone: true,
-                    template: '',
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                    providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: KsChipsComponent, multi: true }],
-                }]
-        }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { options: [{ type: i0.Input, args: [{ isSignal: true, alias: "options", required: false }] }], multi: [{ type: i0.Input, args: [{ isSignal: true, alias: "multi", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], isRounded: [{ type: i0.Input, args: [{ isSignal: true, alias: "isRounded", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], ksValueChange: [{ type: i0.Output, args: ["ksValueChange"] }] } });
-
-// Side-effect import: registers the `ks-fab` tag — see `button/button.ts`
-// for the full explanation of this pattern.
-/**
- * Angular wrapper around the `<ks-fab>` Stencil custom element.
- *
- * `ksClick` is renamed away from the native `clicked` event name for the
- * same double-fire reason documented in `button/button.ts` and
- * `button-group/button-group.ts`. `template: ''` — no `<slot>` in the
- * wrapped Stencil render.
- */
-class KsFabComponent {
-    el;
-    /** Icon for the main FAB button */
-    icon = input('', ...(ngDevMode ? [{ debugName: "icon" }] : /* istanbul ignore next */ []));
-    /** Accessible label / tooltip */
-    label = input('', ...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
-    /** Variant */
-    variant = input('brand', ...(ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []));
-    /** Size */
-    size = input('md', ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
-    /** Speed-dial actions shown on expand */
-    actions = input([], ...(ngDevMode ? [{ debugName: "actions" }] : /* istanbul ignore next */ []));
-    /** Disabled */
-    disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
-    /** Corner to anchor the FAB inside its nearest positioned container */
-    position = input('bottom-right', ...(ngDevMode ? [{ debugName: "position" }] : /* istanbul ignore next */ []));
-    /** When true (default), positions `absolute` inside the nearest positioned ancestor; when false, `fixed` to the viewport */
-    appendToParent = input(true, ...(ngDevMode ? [{ debugName: "appendToParent" }] : /* istanbul ignore next */ []));
-    /** Emits `'main'` for the main button, or a speed-dial action's `key`. From the native `clicked` event. */
-    ksClick = output();
-    constructor(ref) {
-        this.el = ref.nativeElement;
-        effect(() => (this.el.icon = this.icon()));
-        effect(() => (this.el.label = this.label()));
-        effect(() => (this.el.variant = this.variant()));
-        effect(() => (this.el.size = this.size()));
-        effect(() => (this.el.actions = this.actions()));
-        effect(() => (this.el.disabled = this.disabled()));
-        effect(() => (this.el.position = this.position()));
-        effect(() => (this.el.appendToParent = this.appendToParent()));
-        const onNativeClicked = (event) => {
-            this.ksClick.emit(event.detail);
-        };
-        this.el.addEventListener('clicked', onNativeClicked);
-        inject(DestroyRef).onDestroy(() => this.el.removeEventListener('clicked', onNativeClicked));
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KsFabComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.25", type: KsFabComponent, isStandalone: true, selector: "ks-fab", inputs: { icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, actions: { classPropertyName: "actions", publicName: "actions", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, position: { classPropertyName: "position", publicName: "position", isSignal: true, isRequired: false, transformFunction: null }, appendToParent: { classPropertyName: "appendToParent", publicName: "appendToParent", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { ksClick: "ksClick" }, ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KsFabComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'ks-fab',
-                    standalone: true,
-                    template: '',
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                }]
-        }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { icon: [{ type: i0.Input, args: [{ isSignal: true, alias: "icon", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], actions: [{ type: i0.Input, args: [{ isSignal: true, alias: "actions", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], position: [{ type: i0.Input, args: [{ isSignal: true, alias: "position", required: false }] }], appendToParent: [{ type: i0.Input, args: [{ isSignal: true, alias: "appendToParent", required: false }] }], ksClick: [{ type: i0.Output, args: ["ksClick"] }] } });
-
-// Side-effect import: registers the `ks-datepicker` tag — see
-// `button/button.ts` for the full explanation of this pattern.
-/**
- * Angular wrapper around the `<ks-datepicker>` Stencil custom element.
- *
- * Two-way binding is via `ControlValueAccessor` — use `[(ngModel)]` or
- * `formControlName` and it works through DI (`writeValue` /
- * `registerOnChange`), with no template event-name collision to worry
- * about. See `chips/chips.ts` for the full rationale (same pattern, same
- * reason the native `selectedDateChange` event can't be reused verbatim as
- * an Angular output name).
- *
- * For plain (non-forms) two-way use, bind explicitly instead:
- * `[selectedDate]="d" (ksSelectedDateChange)="d = $event"`.
- *
- * `template: ''` — the projected panel content in the Stencil render is
- * internal (calendar grid projected into the shared `<ks-overlay-field>`
- * default slot); there is no slot exposed on `<ks-datepicker>` itself for
- * a consumer to project into.
- */
-class KsDatepickerComponent {
-    el;
-    onChange = () => { };
-    onTouched = () => { };
-    /** Field label */
-    label = input('', ...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
-    /** Placeholder text */
-    placeholder = input('Select date', ...(ngDevMode ? [{ debugName: "placeholder" }] : /* istanbul ignore next */ []));
-    /** Min selectable date */
-    minDate = input(null, ...(ngDevMode ? [{ debugName: "minDate" }] : /* istanbul ignore next */ []));
-    /** Max selectable date */
-    maxDate = input(null, ...(ngDevMode ? [{ debugName: "maxDate" }] : /* istanbul ignore next */ []));
-    /** Disabled state */
-    disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
-    /** Initial/controlled value for plain (non-forms) usage. Prefer `[(ngModel)]` / `formControlName` when inside a form. */
-    selectedDate = input(null, ...(ngDevMode ? [{ debugName: "selectedDate" }] : /* istanbul ignore next */ []));
-    /** Emits the newly-picked date. From the native `selectedDateChange` event. */
-    ksSelectedDateChange = output();
-    constructor(ref) {
-        this.el = ref.nativeElement;
-        effect(() => (this.el.label = this.label()));
-        effect(() => (this.el.placeholder = this.placeholder()));
-        effect(() => (this.el.minDate = this.minDate()));
-        effect(() => (this.el.maxDate = this.maxDate()));
-        effect(() => (this.el.disabled = this.disabled()));
-        effect(() => void this.el.writeValue(this.selectedDate()));
-        const onNativeSelectedDateChange = (event) => {
-            const detail = event.detail;
-            this.ksSelectedDateChange.emit(detail);
-            this.onChange(detail);
-            this.onTouched();
-        };
-        this.el.addEventListener('selectedDateChange', onNativeSelectedDateChange);
-        inject(DestroyRef).onDestroy(() => this.el.removeEventListener('selectedDateChange', onNativeSelectedDateChange));
-    }
-    writeValue(value) {
-        void this.el.writeValue(value ?? null);
-    }
-    registerOnChange(fn) {
-        this.onChange = fn;
-    }
-    registerOnTouched(fn) {
-        this.onTouched = fn;
-    }
-    setDisabledState(isDisabled) {
-        this.el.disabled = isDisabled;
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KsDatepickerComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.25", type: KsDatepickerComponent, isStandalone: true, selector: "ks-datepicker", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, minDate: { classPropertyName: "minDate", publicName: "minDate", isSignal: true, isRequired: false, transformFunction: null }, maxDate: { classPropertyName: "maxDate", publicName: "maxDate", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, selectedDate: { classPropertyName: "selectedDate", publicName: "selectedDate", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { ksSelectedDateChange: "ksSelectedDateChange" }, providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: KsDatepickerComponent, multi: true }], ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KsDatepickerComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'ks-datepicker',
-                    standalone: true,
-                    template: '',
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                    providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: KsDatepickerComponent, multi: true }],
-                }]
-        }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], minDate: [{ type: i0.Input, args: [{ isSignal: true, alias: "minDate", required: false }] }], maxDate: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxDate", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], selectedDate: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectedDate", required: false }] }], ksSelectedDateChange: [{ type: i0.Output, args: ["ksSelectedDateChange"] }] } });
-
-// Side-effect import: registers the `ks-daterange` tag — see
-// `button/button.ts` for the full explanation of this pattern.
-/**
- * Angular wrapper around the `<ks-daterange>` Stencil custom element.
- *
- * Two-way binding is via `ControlValueAccessor` — use `[(ngModel)]` or
- * `formControlName`. See `chips/chips.ts` for the full rationale (the
- * native `rangeChange` event can't be reused verbatim as an Angular output
- * name without a double-fire risk).
- *
- * For plain (non-forms) two-way use, bind explicitly instead:
- * `[range]="r" (ksRangeChange)="r = $event"`.
- *
- * `template: ''` — no slot is exposed on `<ks-daterange>` itself.
- */
-class KsDaterangeComponent {
-    el;
-    onChange = () => { };
-    onTouched = () => { };
-    label = input('', ...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
-    placeholder = input('Select date range…', ...(ngDevMode ? [{ debugName: "placeholder" }] : /* istanbul ignore next */ []));
-    minDate = input(null, ...(ngDevMode ? [{ debugName: "minDate" }] : /* istanbul ignore next */ []));
-    maxDate = input(null, ...(ngDevMode ? [{ debugName: "maxDate" }] : /* istanbul ignore next */ []));
-    presets = input([], ...(ngDevMode ? [{ debugName: "presets" }] : /* istanbul ignore next */ []));
-    showPresets = input(true, ...(ngDevMode ? [{ debugName: "showPresets" }] : /* istanbul ignore next */ []));
-    disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
-    /** Initial/controlled value for plain (non-forms) usage. Prefer `[(ngModel)]` / `formControlName` when inside a form. */
-    range = input({ start: null, end: null }, ...(ngDevMode ? [{ debugName: "range" }] : /* istanbul ignore next */ []));
-    /** Emits the newly-picked range. From the native `rangeChange` event. */
-    ksRangeChange = output();
-    constructor(ref) {
-        this.el = ref.nativeElement;
-        effect(() => (this.el.label = this.label()));
-        effect(() => (this.el.placeholder = this.placeholder()));
-        effect(() => (this.el.minDate = this.minDate()));
-        effect(() => (this.el.maxDate = this.maxDate()));
-        effect(() => (this.el.presets = this.presets()));
-        effect(() => (this.el.showPresets = this.showPresets()));
-        effect(() => (this.el.disabled = this.disabled()));
-        effect(() => void this.el.writeValue(this.range()));
-        const onNativeRangeChange = (event) => {
-            const detail = event.detail;
-            this.ksRangeChange.emit(detail);
-            this.onChange(detail);
-            this.onTouched();
-        };
-        this.el.addEventListener('rangeChange', onNativeRangeChange);
-        inject(DestroyRef).onDestroy(() => this.el.removeEventListener('rangeChange', onNativeRangeChange));
-    }
-    writeValue(value) {
-        void this.el.writeValue(value ?? { start: null, end: null });
-    }
-    registerOnChange(fn) {
-        this.onChange = fn;
-    }
-    registerOnTouched(fn) {
-        this.onTouched = fn;
-    }
-    setDisabledState(isDisabled) {
-        this.el.disabled = isDisabled;
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KsDaterangeComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.25", type: KsDaterangeComponent, isStandalone: true, selector: "ks-daterange", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, minDate: { classPropertyName: "minDate", publicName: "minDate", isSignal: true, isRequired: false, transformFunction: null }, maxDate: { classPropertyName: "maxDate", publicName: "maxDate", isSignal: true, isRequired: false, transformFunction: null }, presets: { classPropertyName: "presets", publicName: "presets", isSignal: true, isRequired: false, transformFunction: null }, showPresets: { classPropertyName: "showPresets", publicName: "showPresets", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, range: { classPropertyName: "range", publicName: "range", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { ksRangeChange: "ksRangeChange" }, providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: KsDaterangeComponent, multi: true }], ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KsDaterangeComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'ks-daterange',
-                    standalone: true,
-                    template: '',
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                    providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: KsDaterangeComponent, multi: true }],
-                }]
-        }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], minDate: [{ type: i0.Input, args: [{ isSignal: true, alias: "minDate", required: false }] }], maxDate: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxDate", required: false }] }], presets: [{ type: i0.Input, args: [{ isSignal: true, alias: "presets", required: false }] }], showPresets: [{ type: i0.Input, args: [{ isSignal: true, alias: "showPresets", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], range: [{ type: i0.Input, args: [{ isSignal: true, alias: "range", required: false }] }], ksRangeChange: [{ type: i0.Output, args: ["ksRangeChange"] }] } });
-
-// Side-effect import: registers the `ks-timepicker` tag — see
-// `button/button.ts` for the full explanation of this pattern.
-/**
- * Angular wrapper around the `<ks-timepicker>` Stencil custom element.
- *
- * Two-way binding is via `ControlValueAccessor` — use `[(ngModel)]` or
- * `formControlName`. See `chips/chips.ts` for the full rationale (the
- * native `valueChange` event can't be reused verbatim as an Angular output
- * name without a double-fire risk).
- *
- * For plain (non-forms) two-way use, bind explicitly instead:
- * `[value]="t" (ksValueChange)="t = $event"`.
- *
- * `template: ''` — no slot is exposed on `<ks-timepicker>` itself.
- */
-class KsTimepickerComponent {
-    el;
-    onChange = () => { };
-    onTouched = () => { };
-    /** Field label */
-    label = input('', ...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
-    /** Placeholder */
-    placeholder = input('Select time…', ...(ngDevMode ? [{ debugName: "placeholder" }] : /* istanbul ignore next */ []));
-    /** Use 12-hour clock (AM/PM) */
-    use12Hour = input(false, ...(ngDevMode ? [{ debugName: "use12Hour" }] : /* istanbul ignore next */ []));
-    /** Show seconds */
-    showSeconds = input(false, ...(ngDevMode ? [{ debugName: "showSeconds" }] : /* istanbul ignore next */ []));
-    /** Disabled */
-    disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
-    /** Error message */
-    error = input('', ...(ngDevMode ? [{ debugName: "error" }] : /* istanbul ignore next */ []));
-    /** Initial/controlled value for plain (non-forms) usage. Prefer `[(ngModel)]` / `formControlName` when inside a form. */
-    value = model(null, ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
-    /** Emits the confirmed time. From the native `valueChange` event. */
-    ksValueChange = output();
-    constructor(ref) {
-        this.el = ref.nativeElement;
-        effect(() => (this.el.label = this.label()));
-        effect(() => (this.el.placeholder = this.placeholder()));
-        effect(() => (this.el.use12Hour = this.use12Hour()));
-        effect(() => (this.el.showSeconds = this.showSeconds()));
-        effect(() => (this.el.disabled = this.disabled()));
-        effect(() => (this.el.error = this.error()));
-        effect(() => void this.el.writeValue(this.value()));
-        const onNativeValueChange = (event) => {
-            const detail = event.detail;
-            this.ksValueChange.emit(detail);
-            this.onChange(detail);
-            this.onTouched();
-        };
-        this.el.addEventListener('valueChange', onNativeValueChange);
-        inject(DestroyRef).onDestroy(() => this.el.removeEventListener('valueChange', onNativeValueChange));
-    }
-    writeValue(value) {
-        void this.el.writeValue(value ?? null);
-    }
-    registerOnChange(fn) {
-        this.onChange = fn;
-    }
-    registerOnTouched(fn) {
-        this.onTouched = fn;
-    }
-    setDisabledState(isDisabled) {
-        this.el.disabled = isDisabled;
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KsTimepickerComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.25", type: KsTimepickerComponent, isStandalone: true, selector: "ks-timepicker", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, use12Hour: { classPropertyName: "use12Hour", publicName: "use12Hour", isSignal: true, isRequired: false, transformFunction: null }, showSeconds: { classPropertyName: "showSeconds", publicName: "showSeconds", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, error: { classPropertyName: "error", publicName: "error", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange", ksValueChange: "ksValueChange" }, providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: KsTimepickerComponent, multi: true }], ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KsTimepickerComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'ks-timepicker',
-                    standalone: true,
-                    template: '',
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                    providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: KsTimepickerComponent, multi: true }],
-                }]
-        }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], use12Hour: [{ type: i0.Input, args: [{ isSignal: true, alias: "use12Hour", required: false }] }], showSeconds: [{ type: i0.Input, args: [{ isSignal: true, alias: "showSeconds", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], error: [{ type: i0.Input, args: [{ isSignal: true, alias: "error", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], ksValueChange: [{ type: i0.Output, args: ["ksValueChange"] }] } });
-
-// Side-effect import: registers the `ks-dropdown` tag — see
-// `button/button.ts` for the full explanation of this pattern.
-/**
- * Angular wrapper around the `<ks-dropdown>` Stencil custom element.
- *
- * Two-way binding is via `ControlValueAccessor` — use `[(ngModel)]` or
- * `formControlName`. See `chips/chips.ts` for the full rationale (the
- * native `selectedValuesChange` event can't be reused verbatim as an
- * Angular output name without a double-fire risk).
- *
- * For plain (non-forms) two-way use, bind explicitly instead:
- * `[selectedValues]="v" (ksSelectedValuesChange)="v = $event"`.
- *
- * `template: ''` — the option list / search box in the Stencil render are
- * projected into the shared, internal `<ks-overlay-field>` slot; there is
- * no slot exposed on `<ks-dropdown>` itself for a consumer to project into.
- */
-class KsDropdownComponent {
-    el;
-    onChange = () => { };
-    onTouched = () => { };
-    /** Full list of options */
-    options = input([], ...(ngDevMode ? [{ debugName: "options" }] : /* istanbul ignore next */ []));
-    /** Placeholder text shown when nothing is selected */
-    placeholder = input('Select…', ...(ngDevMode ? [{ debugName: "placeholder" }] : /* istanbul ignore next */ []));
-    /** Allow selecting multiple options */
-    multi = input(false, ...(ngDevMode ? [{ debugName: "multi" }] : /* istanbul ignore next */ []));
-    /** Show a search box inside the dropdown */
-    searchable = input(false, ...(ngDevMode ? [{ debugName: "searchable" }] : /* istanbul ignore next */ []));
-    /** Field label */
-    label = input('', ...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
-    /** Disabled state */
-    disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
-    /** Initial/controlled selected value(s) for plain (non-forms) usage. Prefer `[(ngModel)]` / `formControlName` when inside a form. */
-    selectedValues = input([], ...(ngDevMode ? [{ debugName: "selectedValues" }] : /* istanbul ignore next */ []));
-    /** Emits the new selection — an array when `multi`, otherwise a single value. From the native `selectedValuesChange` event. */
-    ksSelectedValuesChange = output();
-    constructor(ref) {
-        this.el = ref.nativeElement;
-        effect(() => (this.el.options = this.options()));
-        effect(() => (this.el.placeholder = this.placeholder()));
-        effect(() => (this.el.multi = this.multi()));
-        effect(() => (this.el.searchable = this.searchable()));
-        effect(() => (this.el.label = this.label()));
-        effect(() => (this.el.disabled = this.disabled()));
-        effect(() => void this.el.writeValue(this.selectedValues()));
-        const onNativeSelectedValuesChange = (event) => {
-            const detail = event.detail;
-            this.ksSelectedValuesChange.emit(detail);
-            this.onChange(detail);
-            this.onTouched();
-        };
-        this.el.addEventListener('selectedValuesChange', onNativeSelectedValuesChange);
-        inject(DestroyRef).onDestroy(() => this.el.removeEventListener('selectedValuesChange', onNativeSelectedValuesChange));
-    }
-    writeValue(value) {
-        void this.el.writeValue(value ?? null);
-    }
-    registerOnChange(fn) {
-        this.onChange = fn;
-    }
-    registerOnTouched(fn) {
-        this.onTouched = fn;
-    }
-    setDisabledState(isDisabled) {
-        this.el.disabled = isDisabled;
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KsDropdownComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.25", type: KsDropdownComponent, isStandalone: true, selector: "ks-dropdown", inputs: { options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, multi: { classPropertyName: "multi", publicName: "multi", isSignal: true, isRequired: false, transformFunction: null }, searchable: { classPropertyName: "searchable", publicName: "searchable", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, selectedValues: { classPropertyName: "selectedValues", publicName: "selectedValues", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { ksSelectedValuesChange: "ksSelectedValuesChange" }, providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: KsDropdownComponent, multi: true }], ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KsDropdownComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'ks-dropdown',
-                    standalone: true,
-                    template: '',
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                    providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: KsDropdownComponent, multi: true }],
-                }]
-        }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { options: [{ type: i0.Input, args: [{ isSignal: true, alias: "options", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], multi: [{ type: i0.Input, args: [{ isSignal: true, alias: "multi", required: false }] }], searchable: [{ type: i0.Input, args: [{ isSignal: true, alias: "searchable", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], selectedValues: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectedValues", required: false }] }], ksSelectedValuesChange: [{ type: i0.Output, args: ["ksSelectedValuesChange"] }] } });
-
-// Side-effect import: registers the `ks-listbox` tag — see
-// `button/button.ts` for the full explanation of this pattern.
-/**
- * Angular wrapper around the `<ks-listbox>` Stencil custom element.
- *
- * Two-way binding is via `ControlValueAccessor` — use `[(ngModel)]` or
- * `formControlName`. See `chips/chips.ts` for the full rationale (the
- * native `selectedChange` event can't be reused verbatim as an Angular
- * output name without a double-fire risk).
- *
- * For plain (non-forms) two-way use, bind explicitly instead:
- * `[selected]="v" (ksSelectedChange)="v = $event"`.
- *
- * `template: ''` — no slot is exposed on `<ks-listbox>` itself.
- */
-class KsListBoxComponent {
-    el;
-    onChange = () => { };
-    onTouched = () => { };
-    /** Options list */
-    options = input([], ...(ngDevMode ? [{ debugName: "options" }] : /* istanbul ignore next */ []));
-    /** Allow multi-select */
-    multi = input(false, ...(ngDevMode ? [{ debugName: "multi" }] : /* istanbul ignore next */ []));
-    /** Show search box */
-    searchable = input(false, ...(ngDevMode ? [{ debugName: "searchable" }] : /* istanbul ignore next */ []));
-    /** Disabled */
-    disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
-    /** Enable group headers using the `group` field on each option */
-    groupBy = input(false, ...(ngDevMode ? [{ debugName: "groupBy" }] : /* istanbul ignore next */ []));
-    /** Initial/controlled selected value(s) for plain (non-forms) usage. Prefer `[(ngModel)]` / `formControlName` when inside a form. */
-    selected = input([], ...(ngDevMode ? [{ debugName: "selected" }] : /* istanbul ignore next */ []));
-    /** Emits the new selection — an array when `multi`, otherwise a single value. From the native `selectedChange` event. */
-    ksSelectedChange = output();
-    constructor(ref) {
-        this.el = ref.nativeElement;
-        effect(() => (this.el.options = this.options()));
-        effect(() => (this.el.multi = this.multi()));
-        effect(() => (this.el.searchable = this.searchable()));
-        effect(() => (this.el.disabled = this.disabled()));
-        effect(() => (this.el.groupBy = this.groupBy()));
-        effect(() => void this.el.writeValue(this.selected()));
-        const onNativeSelectedChange = (event) => {
-            const detail = event.detail;
-            this.ksSelectedChange.emit(detail);
-            this.onChange(detail);
-            this.onTouched();
-        };
-        this.el.addEventListener('selectedChange', onNativeSelectedChange);
-        inject(DestroyRef).onDestroy(() => this.el.removeEventListener('selectedChange', onNativeSelectedChange));
-    }
-    writeValue(value) {
-        void this.el.writeValue(value ?? null);
-    }
-    registerOnChange(fn) {
-        this.onChange = fn;
-    }
-    registerOnTouched(fn) {
-        this.onTouched = fn;
-    }
-    setDisabledState(isDisabled) {
-        this.el.disabled = isDisabled;
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KsListBoxComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.25", type: KsListBoxComponent, isStandalone: true, selector: "ks-listbox", inputs: { options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, multi: { classPropertyName: "multi", publicName: "multi", isSignal: true, isRequired: false, transformFunction: null }, searchable: { classPropertyName: "searchable", publicName: "searchable", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, groupBy: { classPropertyName: "groupBy", publicName: "groupBy", isSignal: true, isRequired: false, transformFunction: null }, selected: { classPropertyName: "selected", publicName: "selected", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { ksSelectedChange: "ksSelectedChange" }, providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: KsListBoxComponent, multi: true }], ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KsListBoxComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'ks-listbox',
-                    standalone: true,
-                    template: '',
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                    providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: KsListBoxComponent, multi: true }],
-                }]
-        }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { options: [{ type: i0.Input, args: [{ isSignal: true, alias: "options", required: false }] }], multi: [{ type: i0.Input, args: [{ isSignal: true, alias: "multi", required: false }] }], searchable: [{ type: i0.Input, args: [{ isSignal: true, alias: "searchable", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], groupBy: [{ type: i0.Input, args: [{ isSignal: true, alias: "groupBy", required: false }] }], selected: [{ type: i0.Input, args: [{ isSignal: true, alias: "selected", required: false }] }], ksSelectedChange: [{ type: i0.Output, args: ["ksSelectedChange"] }] } });
-
-// Side-effect import: registers the `ks-checkbox` tag — see
-// `Buttons/button/button.ts` for the full explanation of this pattern.
-/**
- * Angular wrapper around the `<ks-checkbox>` Stencil custom element.
- *
- * Supports two modes, mirroring the Stencil source:
- * - **Single** mode (no `options`): two-way bind `checked` (boolean).
- * - **Group** mode (`options` set): two-way bind `selected` (string[]).
- *
- * Two-way binding for either mode is via `ControlValueAccessor` — use
- * `[(ngModel)]`/`formControlName` and it works for whichever mode is
- * active (see `Buttons/chips/chips.ts` for the full rationale on why CVA
- * is used instead of reusing a native event name as an Angular output).
- *
- * For plain (non-forms) two-way use, bind explicitly instead:
- * `[checked]="c" (ksCheckedChange)="c = $event"` or
- * `[selected]="s" (ksSelectedChange)="s = $event"`.
- *
- * `template: ''` — no `<slot>` in the wrapped Stencil render.
- */
-class KsCheckboxComponent {
-    el;
-    onChange = () => { };
-    onTouched = () => { };
-    /** Label shown next to the control (single mode) */
-    label = input('', ...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
-    /** Optional set of multiple options (multi-select / group mode) */
-    options = input([], ...(ngDevMode ? [{ debugName: "options" }] : /* istanbul ignore next */ []));
-    /** Disabled state */
-    disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
-    /** Single mode: initial/controlled checked value. Prefer `[(ngModel)]` / `formControlName`. */
-    checked = input(false, ...(ngDevMode ? [{ debugName: "checked" }] : /* istanbul ignore next */ []));
-    /** Group mode: initial/controlled selected values. Prefer `[(ngModel)]` / `formControlName`. */
-    selected = input([], ...(ngDevMode ? [{ debugName: "selected" }] : /* istanbul ignore next */ []));
-    /** Emits whenever `checked` changes (single mode). From the native `checkedChange` event. */
-    ksCheckedChange = output();
-    /** Emits whenever `selected` changes (group mode). From the native `selectedChange` event. */
-    ksSelectedChange = output();
-    constructor(ref) {
-        this.el = ref.nativeElement;
-        effect(() => (this.el.label = this.label()));
-        effect(() => (this.el.options = this.options()));
-        effect(() => (this.el.disabled = this.disabled()));
-        effect(() => (this.el.checked = this.checked()));
-        effect(() => (this.el.selected = this.selected()));
-        const onNativeCheckedChange = (event) => {
-            const detail = event.detail;
-            this.ksCheckedChange.emit(detail);
-            this.onChange(detail);
-            this.onTouched();
-        };
-        const onNativeSelectedChange = (event) => {
-            const detail = event.detail;
-            this.ksSelectedChange.emit(detail);
-            this.onChange(detail);
-            this.onTouched();
-        };
-        this.el.addEventListener('checkedChange', onNativeCheckedChange);
-        this.el.addEventListener('selectedChange', onNativeSelectedChange);
-        inject(DestroyRef).onDestroy(() => {
-            this.el.removeEventListener('checkedChange', onNativeCheckedChange);
-            this.el.removeEventListener('selectedChange', onNativeSelectedChange);
-        });
-    }
-    /** `ControlValueAccessor` — called by `ngModel`/`formControl` to push a value in (either mode). */
-    writeValue(value) {
-        void this.el.writeValue(value);
-    }
-    registerOnChange(fn) {
-        this.onChange = fn;
-    }
-    registerOnTouched(fn) {
-        this.onTouched = fn;
-    }
-    setDisabledState(isDisabled) {
-        this.el.disabled = isDisabled;
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KsCheckboxComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.25", type: KsCheckboxComponent, isStandalone: true, selector: "ks-checkbox", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, checked: { classPropertyName: "checked", publicName: "checked", isSignal: true, isRequired: false, transformFunction: null }, selected: { classPropertyName: "selected", publicName: "selected", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { ksCheckedChange: "ksCheckedChange", ksSelectedChange: "ksSelectedChange" }, providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: KsCheckboxComponent, multi: true }], ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KsCheckboxComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'ks-checkbox',
-                    standalone: true,
-                    template: '',
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                    providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: KsCheckboxComponent, multi: true }],
-                }]
-        }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], options: [{ type: i0.Input, args: [{ isSignal: true, alias: "options", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], checked: [{ type: i0.Input, args: [{ isSignal: true, alias: "checked", required: false }] }], selected: [{ type: i0.Input, args: [{ isSignal: true, alias: "selected", required: false }] }], ksCheckedChange: [{ type: i0.Output, args: ["ksCheckedChange"] }], ksSelectedChange: [{ type: i0.Output, args: ["ksSelectedChange"] }] } });
-
-// Side-effect import: registers the `ks-colour-picker` tag — see
-// `Buttons/button/button.ts` for the full explanation of this pattern.
-const DEFAULT_SWATCHES = ['#ef4444', '#f97316', '#eab308', '#22c55e', '#3b82f6', '#8b5cf6', '#ec4899', '#64748b', '#000000', '#ffffff'];
-/**
- * Angular wrapper around the `<ks-colour-picker>` Stencil custom element.
- *
- * Two-way binding is via `ControlValueAccessor` — use `[(ngModel)]` or
- * `formControlName`. See `Buttons/chips/chips.ts` for the full rationale
- * (the native `valueChange` event can't be reused verbatim as an Angular
- * output name without a double-fire risk).
- *
- * For plain (non-forms) two-way use, bind explicitly instead:
- * `[value]="hex" (ksValueChange)="hex = $event"`.
- *
- * `template: ''` — the panel is rendered into the internal
- * `<ks-overlay-field>`; there is no slot on `<ks-colour-picker>` itself.
- */
-class KsColourPickerComponent {
-    el;
-    onChange = () => { };
-    onTouched = () => { };
-    /** Field label */
-    label = input('', ...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
-    /** Picker UI variant */
-    variant = input('input', ...(ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []));
-    /** Preset swatch colours */
-    swatches = input(DEFAULT_SWATCHES, ...(ngDevMode ? [{ debugName: "swatches" }] : /* istanbul ignore next */ []));
-    /** Disabled */
-    disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
-    /** Initial/controlled hex value. Prefer `[(ngModel)]` / `formControlName`. */
-    value = input('#3b82f6', ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
-    /** Emits the newly-picked hex colour. From the native `valueChange` event. */
-    ksValueChange = output();
-    constructor(ref) {
-        this.el = ref.nativeElement;
-        effect(() => (this.el.label = this.label()));
-        effect(() => (this.el.variant = this.variant()));
-        effect(() => (this.el.swatches = this.swatches()));
-        effect(() => (this.el.disabled = this.disabled()));
-        effect(() => void this.el.writeValue(this.value()));
-        const onNativeValueChange = (event) => {
-            const detail = event.detail;
-            this.ksValueChange.emit(detail);
-            this.onChange(detail);
-            this.onTouched();
-        };
-        this.el.addEventListener('valueChange', onNativeValueChange);
-        inject(DestroyRef).onDestroy(() => this.el.removeEventListener('valueChange', onNativeValueChange));
-    }
-    writeValue(value) {
-        void this.el.writeValue(value ?? '#3b82f6');
-    }
-    registerOnChange(fn) {
-        this.onChange = fn;
-    }
-    registerOnTouched(fn) {
-        this.onTouched = fn;
-    }
-    setDisabledState(isDisabled) {
-        this.el.disabled = isDisabled;
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KsColourPickerComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.25", type: KsColourPickerComponent, isStandalone: true, selector: "ks-colour-picker", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, swatches: { classPropertyName: "swatches", publicName: "swatches", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { ksValueChange: "ksValueChange" }, providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: KsColourPickerComponent, multi: true }], ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KsColourPickerComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'ks-colour-picker',
-                    standalone: true,
-                    template: '',
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                    providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: KsColourPickerComponent, multi: true }],
-                }]
-        }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], swatches: [{ type: i0.Input, args: [{ isSignal: true, alias: "swatches", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], ksValueChange: [{ type: i0.Output, args: ["ksValueChange"] }] } });
-
-// Side-effect import: registers the `ks-input` tag — see
-// `Buttons/button/button.ts` for the full explanation of this pattern.
-/**
- * Angular wrapper around the `<ks-input>` Stencil custom element.
- *
- * Two-way binding is via `ControlValueAccessor` — use `[(ngModel)]` or
- * `formControlName`. `<ks-input>` has no `@Method() writeValue()` of its
- * own (unlike `chips`/`dropdown`/…), so this wrapper's `writeValue` sets
- * `el.value` directly instead of delegating to a Stencil method.
- *
- * The native `ksBlur` event is already prefixed `ks` by the Stencil
- * author, so re-using that exact name here as the Angular output would
- * still hit the double-fire collision described in `Buttons/button.ts`
- * (Ivy's `tNode.outputs` match is purely by literal name, `ks`-prefix or
- * not) — hence `ksBlurred` (distinct spelling) instead.
- *
- * For plain (non-forms) two-way use, bind explicitly instead:
- * `[value]="v" (ksValueChange)="v = $event"`.
- *
- * `template: ''` — no `<slot>` in the wrapped Stencil render.
- */
-class KsInputComponent {
-    el;
-    onChange = () => { };
-    onTouched = () => { };
-    /** HTML input type */
-    type = input('text', ...(ngDevMode ? [{ debugName: "type" }] : /* istanbul ignore next */ []));
-    /** Placeholder text */
-    placeholder = input('', ...(ngDevMode ? [{ debugName: "placeholder" }] : /* istanbul ignore next */ []));
-    /** Field label */
-    label = input('', ...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
-    /** Helper / hint text shown below the input */
-    hint = input('', ...(ngDevMode ? [{ debugName: "hint" }] : /* istanbul ignore next */ []));
-    /** Error message — also triggers the error state */
-    error = input('', ...(ngDevMode ? [{ debugName: "error" }] : /* istanbul ignore next */ []));
-    /** Leading icon class (e.g. Material Symbol name) */
-    prefixIcon = input('', ...(ngDevMode ? [{ debugName: "prefixIcon" }] : /* istanbul ignore next */ []));
-    /** Trailing icon class */
-    suffixIcon = input('', ...(ngDevMode ? [{ debugName: "suffixIcon" }] : /* istanbul ignore next */ []));
-    /** Size variant */
-    size = input('md', ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
-    /** Initial/controlled value. Prefer `[(ngModel)]` / `formControlName`. */
-    value = model('', ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
-    /** Disabled state */
-    disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
-    /** Emits the newly-typed value. From the native `valueChange` event. */
-    ksValueChange = output();
-    /** Emitted on native blur (mirrors Angular's onTouched callback). From the native `ksBlur` event. */
-    ksBlurred = output();
-    constructor(ref) {
-        this.el = ref.nativeElement;
-        effect(() => (this.el.type = this.type()));
-        effect(() => (this.el.placeholder = this.placeholder()));
-        effect(() => (this.el.label = this.label()));
-        effect(() => (this.el.hint = this.hint()));
-        effect(() => (this.el.error = this.error()));
-        effect(() => (this.el.prefixIcon = this.prefixIcon()));
-        effect(() => (this.el.suffixIcon = this.suffixIcon()));
-        effect(() => (this.el.size = this.size()));
-        effect(() => (this.el.disabled = this.disabled()));
-        effect(() => (this.el.value = this.value()));
-        const onNativeValueChange = (event) => {
-            const detail = event.detail;
-            this.ksValueChange.emit(detail);
-            this.onChange(detail);
-        };
-        const onNativeBlur = () => {
-            this.ksBlurred.emit();
-            this.onTouched();
-        };
-        this.el.addEventListener('valueChange', onNativeValueChange);
-        this.el.addEventListener('ksBlur', onNativeBlur);
-        inject(DestroyRef).onDestroy(() => {
-            this.el.removeEventListener('valueChange', onNativeValueChange);
-            this.el.removeEventListener('ksBlur', onNativeBlur);
-        });
-    }
-    writeValue(value) {
-        this.el.value = value ?? '';
-    }
-    registerOnChange(fn) {
-        this.onChange = fn;
-    }
-    registerOnTouched(fn) {
-        this.onTouched = fn;
-    }
-    setDisabledState(isDisabled) {
-        this.el.disabled = isDisabled;
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KsInputComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.25", type: KsInputComponent, isStandalone: true, selector: "ks-input", inputs: { type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, hint: { classPropertyName: "hint", publicName: "hint", isSignal: true, isRequired: false, transformFunction: null }, error: { classPropertyName: "error", publicName: "error", isSignal: true, isRequired: false, transformFunction: null }, prefixIcon: { classPropertyName: "prefixIcon", publicName: "prefixIcon", isSignal: true, isRequired: false, transformFunction: null }, suffixIcon: { classPropertyName: "suffixIcon", publicName: "suffixIcon", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange", ksValueChange: "ksValueChange", ksBlurred: "ksBlurred" }, providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: KsInputComponent, multi: true }], ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KsInputComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'ks-input',
-                    standalone: true,
-                    template: '',
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                    providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: KsInputComponent, multi: true }],
-                }]
-        }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { type: [{ type: i0.Input, args: [{ isSignal: true, alias: "type", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], hint: [{ type: i0.Input, args: [{ isSignal: true, alias: "hint", required: false }] }], error: [{ type: i0.Input, args: [{ isSignal: true, alias: "error", required: false }] }], prefixIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "prefixIcon", required: false }] }], suffixIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "suffixIcon", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], ksValueChange: [{ type: i0.Output, args: ["ksValueChange"] }], ksBlurred: [{ type: i0.Output, args: ["ksBlurred"] }] } });
-
-// Side-effect import: registers the `ks-otp-input` tag — see
-// `Buttons/button/button.ts` for the full explanation of this pattern.
-/**
- * Angular wrapper around the `<ks-otp-input>` Stencil custom element.
- *
- * Two-way binding is via `ControlValueAccessor` — use `[(ngModel)]` or
- * `formControlName`. See `Buttons/chips/chips.ts` for the full rationale.
- *
- * For plain (non-forms) two-way use, bind explicitly instead:
- * `[value]="v" (ksValueChange)="v = $event"`.
- *
- * `template: ''` — no `<slot>` in the wrapped Stencil render.
- */
-class KsOtpInputComponent {
-    el;
-    onChange = () => { };
-    onTouched = () => { };
-    /** Number of digits */
-    length = input(6, ...(ngDevMode ? [{ debugName: "length" }] : /* istanbul ignore next */ []));
-    /** Input type: 'number' | 'text' */
-    inputType = input('number', ...(ngDevMode ? [{ debugName: "inputType" }] : /* istanbul ignore next */ []));
-    /** Field label */
-    label = input('', ...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
-    /** Error message */
-    error = input('', ...(ngDevMode ? [{ debugName: "error" }] : /* istanbul ignore next */ []));
-    /** Mask the input (like a password) */
-    masked = input(false, ...(ngDevMode ? [{ debugName: "masked" }] : /* istanbul ignore next */ []));
-    /** Disabled */
-    disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
-    /** Initial/controlled value. Prefer `[(ngModel)]` / `formControlName`. */
-    value = input('', ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
-    /** Emits whenever `value` changes. From the native `valueChange` event. */
-    ksValueChange = output();
-    /** Emits the full OTP string when all digits are filled. From the native `completed` event. */
-    ksCompleted = output();
-    constructor(ref) {
-        this.el = ref.nativeElement;
-        effect(() => (this.el.length = this.length()));
-        effect(() => (this.el.inputType = this.inputType()));
-        effect(() => (this.el.label = this.label()));
-        effect(() => (this.el.error = this.error()));
-        effect(() => (this.el.masked = this.masked()));
-        effect(() => (this.el.disabled = this.disabled()));
-        effect(() => void this.el.writeValue(this.value()));
-        const onNativeValueChange = (event) => {
-            const detail = event.detail;
-            this.ksValueChange.emit(detail);
-            this.onChange(detail);
-            this.onTouched();
-        };
-        const onNativeCompleted = (event) => {
-            this.ksCompleted.emit(event.detail);
-        };
-        this.el.addEventListener('valueChange', onNativeValueChange);
-        this.el.addEventListener('completed', onNativeCompleted);
-        inject(DestroyRef).onDestroy(() => {
-            this.el.removeEventListener('valueChange', onNativeValueChange);
-            this.el.removeEventListener('completed', onNativeCompleted);
-        });
-    }
-    writeValue(value) {
-        void this.el.writeValue(value ?? '');
-    }
-    registerOnChange(fn) {
-        this.onChange = fn;
-    }
-    registerOnTouched(fn) {
-        this.onTouched = fn;
-    }
-    setDisabledState(isDisabled) {
-        this.el.disabled = isDisabled;
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KsOtpInputComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.25", type: KsOtpInputComponent, isStandalone: true, selector: "ks-otp-input", inputs: { length: { classPropertyName: "length", publicName: "length", isSignal: true, isRequired: false, transformFunction: null }, inputType: { classPropertyName: "inputType", publicName: "inputType", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, error: { classPropertyName: "error", publicName: "error", isSignal: true, isRequired: false, transformFunction: null }, masked: { classPropertyName: "masked", publicName: "masked", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { ksValueChange: "ksValueChange", ksCompleted: "ksCompleted" }, providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: KsOtpInputComponent, multi: true }], ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KsOtpInputComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'ks-otp-input',
-                    standalone: true,
-                    template: '',
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                    providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: KsOtpInputComponent, multi: true }],
-                }]
-        }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { length: [{ type: i0.Input, args: [{ isSignal: true, alias: "length", required: false }] }], inputType: [{ type: i0.Input, args: [{ isSignal: true, alias: "inputType", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], error: [{ type: i0.Input, args: [{ isSignal: true, alias: "error", required: false }] }], masked: [{ type: i0.Input, args: [{ isSignal: true, alias: "masked", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], ksValueChange: [{ type: i0.Output, args: ["ksValueChange"] }], ksCompleted: [{ type: i0.Output, args: ["ksCompleted"] }] } });
-
-// Side-effect import: registers the `ks-radio` tag — see
-// `Buttons/button/button.ts` for the full explanation of this pattern.
-/**
- * Angular wrapper around the `<ks-radio>` Stencil custom element.
- *
- * Two-way binding is via `ControlValueAccessor` — use `[(ngModel)]` or
- * `formControlName`. See `Buttons/chips/chips.ts` for the full rationale.
- *
- * For plain (non-forms) two-way use, bind explicitly instead:
- * `[value]="v" (ksValueChange)="v = $event"`.
- *
- * `template: ''` — no `<slot>` in the wrapped Stencil render.
- */
-class KsRadioComponent {
-    el;
-    onChange = () => { };
-    onTouched = () => { };
-    /** List of options — the component renders a radio group */
-    options = input([], ...(ngDevMode ? [{ debugName: "options" }] : /* istanbul ignore next */ []));
-    /** Label shown above the group */
-    label = input('', ...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
-    /** Name attribute shared across all radio inputs in the group */
-    name = input('ks-radio', ...(ngDevMode ? [{ debugName: "name" }] : /* istanbul ignore next */ []));
-    /** Colour variant applied to the selected indicator */
-    variant = input('brand', ...(ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []));
-    /** Size variant — affects label text size */
-    size = input('md', ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
-    /** Disabled state */
-    disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
-    /** Initial/controlled selected value. Prefer `[(ngModel)]` / `formControlName`. */
-    value = input('', ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
-    /** Emits the selected value on every change. From the native `valueChange` event. */
-    ksValueChange = output();
-    constructor(ref) {
-        this.el = ref.nativeElement;
-        effect(() => (this.el.options = this.options()));
-        effect(() => (this.el.label = this.label()));
-        effect(() => (this.el.name = this.name()));
-        effect(() => (this.el.variant = this.variant()));
-        effect(() => (this.el.size = this.size()));
-        effect(() => (this.el.disabled = this.disabled()));
-        effect(() => void this.el.writeValue(this.value()));
-        const onNativeValueChange = (event) => {
-            const detail = event.detail;
-            this.ksValueChange.emit(detail);
-            this.onChange(detail);
-            this.onTouched();
-        };
-        this.el.addEventListener('valueChange', onNativeValueChange);
-        inject(DestroyRef).onDestroy(() => this.el.removeEventListener('valueChange', onNativeValueChange));
-    }
-    writeValue(value) {
-        void this.el.writeValue(value ?? '');
-    }
-    registerOnChange(fn) {
-        this.onChange = fn;
-    }
-    registerOnTouched(fn) {
-        this.onTouched = fn;
-    }
-    setDisabledState(isDisabled) {
-        this.el.disabled = isDisabled;
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KsRadioComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.25", type: KsRadioComponent, isStandalone: true, selector: "ks-radio", inputs: { options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { ksValueChange: "ksValueChange" }, providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: KsRadioComponent, multi: true }], ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KsRadioComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'ks-radio',
-                    standalone: true,
-                    template: '',
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                    providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: KsRadioComponent, multi: true }],
-                }]
-        }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { options: [{ type: i0.Input, args: [{ isSignal: true, alias: "options", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], name: [{ type: i0.Input, args: [{ isSignal: true, alias: "name", required: false }] }], variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], ksValueChange: [{ type: i0.Output, args: ["ksValueChange"] }] } });
-
-// Side-effect import: registers the `ks-rating` tag — see
-// `Buttons/button/button.ts` for the full explanation of this pattern.
-/**
- * Angular wrapper around the `<ks-rating>` Stencil custom element.
- *
- * Two-way binding is via `ControlValueAccessor` — use `[(ngModel)]` or
- * `formControlName`. See `Buttons/chips/chips.ts` for the full rationale.
- *
- * For plain (non-forms) two-way use, bind explicitly instead:
- * `[value]="v" (ksValueChange)="v = $event"`.
- *
- * `template: ''` — no `<slot>` in the wrapped Stencil render.
- */
-class KsRatingComponent {
-    el;
-    onChange = () => { };
-    onTouched = () => { };
-    /** Total number of stars */
-    max = input(5, ...(ngDevMode ? [{ debugName: "max" }] : /* istanbul ignore next */ []));
-    /** Size */
-    size = input('md', ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
-    /** Read-only / non-interactive */
-    readOnly = input(false, ...(ngDevMode ? [{ debugName: "readOnly" }] : /* istanbul ignore next */ []));
-    /** Show numeric label */
-    showLabel = input(false, ...(ngDevMode ? [{ debugName: "showLabel" }] : /* istanbul ignore next */ []));
-    /** Field label */
-    label = input('', ...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
-    /** Disabled */
-    disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
-    /** Initial/controlled value. Prefer `[(ngModel)]` / `formControlName`. */
-    value = input(0, ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
-    /** Emits the newly-picked rating. From the native `valueChange` event. */
-    ksValueChange = output();
-    constructor(ref) {
-        this.el = ref.nativeElement;
-        effect(() => (this.el.max = this.max()));
-        effect(() => (this.el.size = this.size()));
-        effect(() => (this.el.readOnly = this.readOnly()));
-        effect(() => (this.el.showLabel = this.showLabel()));
-        effect(() => (this.el.label = this.label()));
-        effect(() => (this.el.disabled = this.disabled()));
-        effect(() => void this.el.writeValue(this.value()));
-        const onNativeValueChange = (event) => {
-            const detail = event.detail;
-            this.ksValueChange.emit(detail);
-            this.onChange(detail);
-            this.onTouched();
-        };
-        this.el.addEventListener('valueChange', onNativeValueChange);
-        inject(DestroyRef).onDestroy(() => this.el.removeEventListener('valueChange', onNativeValueChange));
-    }
-    writeValue(value) {
-        void this.el.writeValue(value ?? 0);
-    }
-    registerOnChange(fn) {
-        this.onChange = fn;
-    }
-    registerOnTouched(fn) {
-        this.onTouched = fn;
-    }
-    setDisabledState(isDisabled) {
-        this.el.disabled = isDisabled;
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KsRatingComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.25", type: KsRatingComponent, isStandalone: true, selector: "ks-rating", inputs: { max: { classPropertyName: "max", publicName: "max", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, readOnly: { classPropertyName: "readOnly", publicName: "readOnly", isSignal: true, isRequired: false, transformFunction: null }, showLabel: { classPropertyName: "showLabel", publicName: "showLabel", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { ksValueChange: "ksValueChange" }, providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: KsRatingComponent, multi: true }], ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KsRatingComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'ks-rating',
-                    standalone: true,
-                    template: '',
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                    providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: KsRatingComponent, multi: true }],
-                }]
-        }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { max: [{ type: i0.Input, args: [{ isSignal: true, alias: "max", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], readOnly: [{ type: i0.Input, args: [{ isSignal: true, alias: "readOnly", required: false }] }], showLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "showLabel", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], ksValueChange: [{ type: i0.Output, args: ["ksValueChange"] }] } });
-
-// Side-effect import: registers the `ks-slider` tag — see
-// `Buttons/button/button.ts` for the full explanation of this pattern.
-/**
- * Angular wrapper around the `<ks-slider>` Stencil custom element.
- *
- * Two-way binding is via `ControlValueAccessor` — use `[(ngModel)]` or
- * `formControlName`. See `Buttons/chips/chips.ts` for the full rationale.
- * The native `ksBlur` event (already `ks`-prefixed by the Stencil author)
- * is re-exposed as `ksBlurred` — see `Inputs/input/input.ts` for why the
- * literal name can't be reused.
- *
- * For plain (non-forms) two-way use, bind explicitly instead:
- * `[value]="v" (ksValueChange)="v = $event"`.
- *
- * `template: ''` — no `<slot>` in the wrapped Stencil render.
- */
-class KsSliderComponent {
-    el;
-    onChange = () => { };
-    onTouched = () => { };
-    /** Minimum value */
-    min = input(0, ...(ngDevMode ? [{ debugName: "min" }] : /* istanbul ignore next */ []));
-    /** Maximum value */
-    max = input(100, ...(ngDevMode ? [{ debugName: "max" }] : /* istanbul ignore next */ []));
-    /** Step increment */
-    step = input(1, ...(ngDevMode ? [{ debugName: "step" }] : /* istanbul ignore next */ []));
-    /** Show value tooltip */
-    showTooltip = input(true, ...(ngDevMode ? [{ debugName: "showTooltip" }] : /* istanbul ignore next */ []));
-    /** Show min/max labels */
-    showLabels = input(false, ...(ngDevMode ? [{ debugName: "showLabels" }] : /* istanbul ignore next */ []));
-    /** Field label */
-    label = input('', ...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
-    /** Disabled state */
-    disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
-    /** Initial/controlled value. Prefer `[(ngModel)]` / `formControlName`. */
-    value = input(0, ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
-    /** Emits the newly-picked value. From the native `valueChange` event. */
-    ksValueChange = output();
-    /** Emitted on native blur. From the native `ksBlur` event. */
-    ksBlurred = output();
-    constructor(ref) {
-        this.el = ref.nativeElement;
-        effect(() => (this.el.min = this.min()));
-        effect(() => (this.el.max = this.max()));
-        effect(() => (this.el.step = this.step()));
-        effect(() => (this.el.showTooltip = this.showTooltip()));
-        effect(() => (this.el.showLabels = this.showLabels()));
-        effect(() => (this.el.label = this.label()));
-        effect(() => (this.el.disabled = this.disabled()));
-        effect(() => void this.el.writeValue(this.value()));
-        const onNativeValueChange = (event) => {
-            const detail = event.detail;
-            this.ksValueChange.emit(detail);
-            this.onChange(detail);
-        };
-        const onNativeBlur = () => {
-            this.ksBlurred.emit();
-            this.onTouched();
-        };
-        this.el.addEventListener('valueChange', onNativeValueChange);
-        this.el.addEventListener('ksBlur', onNativeBlur);
-        inject(DestroyRef).onDestroy(() => {
-            this.el.removeEventListener('valueChange', onNativeValueChange);
-            this.el.removeEventListener('ksBlur', onNativeBlur);
-        });
-    }
-    writeValue(value) {
-        void this.el.writeValue(value ?? 0);
-    }
-    registerOnChange(fn) {
-        this.onChange = fn;
-    }
-    registerOnTouched(fn) {
-        this.onTouched = fn;
-    }
-    setDisabledState(isDisabled) {
-        this.el.disabled = isDisabled;
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KsSliderComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.25", type: KsSliderComponent, isStandalone: true, selector: "ks-slider", inputs: { min: { classPropertyName: "min", publicName: "min", isSignal: true, isRequired: false, transformFunction: null }, max: { classPropertyName: "max", publicName: "max", isSignal: true, isRequired: false, transformFunction: null }, step: { classPropertyName: "step", publicName: "step", isSignal: true, isRequired: false, transformFunction: null }, showTooltip: { classPropertyName: "showTooltip", publicName: "showTooltip", isSignal: true, isRequired: false, transformFunction: null }, showLabels: { classPropertyName: "showLabels", publicName: "showLabels", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { ksValueChange: "ksValueChange", ksBlurred: "ksBlurred" }, providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: KsSliderComponent, multi: true }], ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KsSliderComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'ks-slider',
-                    standalone: true,
-                    template: '',
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                    providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: KsSliderComponent, multi: true }],
-                }]
-        }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { min: [{ type: i0.Input, args: [{ isSignal: true, alias: "min", required: false }] }], max: [{ type: i0.Input, args: [{ isSignal: true, alias: "max", required: false }] }], step: [{ type: i0.Input, args: [{ isSignal: true, alias: "step", required: false }] }], showTooltip: [{ type: i0.Input, args: [{ isSignal: true, alias: "showTooltip", required: false }] }], showLabels: [{ type: i0.Input, args: [{ isSignal: true, alias: "showLabels", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], ksValueChange: [{ type: i0.Output, args: ["ksValueChange"] }], ksBlurred: [{ type: i0.Output, args: ["ksBlurred"] }] } });
-
-// Side-effect import: registers the `ks-switch` tag — see
-// `Buttons/button/button.ts` for the full explanation of this pattern.
-/**
- * Angular wrapper around the `<ks-switch>` Stencil custom element.
- *
- * Two-way binding is via `ControlValueAccessor` — use `[(ngModel)]` or
- * `formControlName`. Unlike most other form-control wrappers here,
- * `<ks-switch>` has no `@Method() writeValue()`, so `writeValue` below
- * sets `el.checked` directly; it DOES expose a real
- * `@Method() setDisabledState()` (mirroring CVA exactly), which
- * `setDisabledState` below delegates to instead of setting a plain prop.
- *
- * For plain (non-forms) two-way use, bind explicitly instead:
- * `[checked]="c" (ksCheckedChange)="c = $event"`.
- *
- * `template: ''` — no `<slot>` in the wrapped Stencil render.
- */
-class KsSwitchComponent {
-    el;
-    onChange = () => { };
-    onTouched = () => { };
-    /** Label text */
-    label = input('', ...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
-    /** Colour variant */
-    variant = input('brand', ...(ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []));
-    /** Disabled */
-    disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
-    /** Initial/controlled checked value. Prefer `[(ngModel)]` / `formControlName`. */
-    checked = input(false, ...(ngDevMode ? [{ debugName: "checked" }] : /* istanbul ignore next */ []));
-    /** Label position relative to the switch track */
-    labelPosition = input('left', ...(ngDevMode ? [{ debugName: "labelPosition" }] : /* istanbul ignore next */ []));
-    /** Emits whenever `checked` changes. From the native `checkedChange` event. */
-    ksCheckedChange = output();
-    constructor(ref) {
-        this.el = ref.nativeElement;
-        effect(() => (this.el.label = this.label()));
-        effect(() => (this.el.variant = this.variant()));
-        effect(() => (this.el.disabled = this.disabled()));
-        effect(() => (this.el.checked = this.checked()));
-        effect(() => (this.el.labelPosition = this.labelPosition()));
-        const onNativeCheckedChange = (event) => {
-            const detail = event.detail;
-            this.ksCheckedChange.emit(detail);
-            this.onChange(detail);
-            this.onTouched();
-        };
-        this.el.addEventListener('checkedChange', onNativeCheckedChange);
-        inject(DestroyRef).onDestroy(() => this.el.removeEventListener('checkedChange', onNativeCheckedChange));
-    }
-    writeValue(value) {
-        this.el.checked = value ?? false;
-    }
-    registerOnChange(fn) {
-        this.onChange = fn;
-    }
-    registerOnTouched(fn) {
-        this.onTouched = fn;
-    }
-    /** Delegates to `<ks-switch>`'s own `@Method() setDisabledState()`. */
-    setDisabledState(isDisabled) {
-        void this.el.setDisabledState(isDisabled);
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KsSwitchComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.25", type: KsSwitchComponent, isStandalone: true, selector: "ks-switch", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, checked: { classPropertyName: "checked", publicName: "checked", isSignal: true, isRequired: false, transformFunction: null }, labelPosition: { classPropertyName: "labelPosition", publicName: "labelPosition", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { ksCheckedChange: "ksCheckedChange" }, providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: KsSwitchComponent, multi: true }], ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KsSwitchComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'ks-switch',
-                    standalone: true,
-                    template: '',
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                    providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: KsSwitchComponent, multi: true }],
-                }]
-        }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], checked: [{ type: i0.Input, args: [{ isSignal: true, alias: "checked", required: false }] }], labelPosition: [{ type: i0.Input, args: [{ isSignal: true, alias: "labelPosition", required: false }] }], ksCheckedChange: [{ type: i0.Output, args: ["ksCheckedChange"] }] } });
-
-// Side-effect import: registers the `ks-textarea` tag — see
-// `Buttons/button/button.ts` for the full explanation of this pattern.
-/**
- * Angular wrapper around the `<ks-textarea>` Stencil custom element.
- *
- * Two-way binding is via `ControlValueAccessor` (see `Inputs/input/input.ts`
- * for the equivalent no-`writeValue()`-method pattern this follows —
- * `writeValue` here sets `el.value` directly). The native `ksBlur` event
- * is re-exposed as `ksBlurred` for the same reason.
- *
- * For plain (non-forms) two-way use, bind explicitly instead:
- * `[value]="v" (ksValueChange)="v = $event"`.
- *
- * `template: ''` — no `<slot>` in the wrapped Stencil render.
- */
-class KsTextareaComponent {
-    el;
-    onChange = () => { };
-    onTouched = () => { };
-    /** Textarea label */
-    label = input('', ...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
-    /** Placeholder text */
-    placeholder = input('', ...(ngDevMode ? [{ debugName: "placeholder" }] : /* istanbul ignore next */ []));
-    /** Number of visible rows */
-    rows = input(3, ...(ngDevMode ? [{ debugName: "rows" }] : /* istanbul ignore next */ []));
-    /** Maximum character count */
-    maxLength = input(500, ...(ngDevMode ? [{ debugName: "maxLength" }] : /* istanbul ignore next */ []));
-    /** Show character counter */
-    showCounter = input(false, ...(ngDevMode ? [{ debugName: "showCounter" }] : /* istanbul ignore next */ []));
-    /** Auto-resize based on content */
-    autoResize = input(false, ...(ngDevMode ? [{ debugName: "autoResize" }] : /* istanbul ignore next */ []));
-    /** Disabled state */
-    disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
-    /** Error state */
-    error = input('', ...(ngDevMode ? [{ debugName: "error" }] : /* istanbul ignore next */ []));
-    /** Helper/error text */
-    hint = input('', ...(ngDevMode ? [{ debugName: "hint" }] : /* istanbul ignore next */ []));
-    /** Initial/controlled value. Prefer `[(ngModel)]` / `formControlName`. */
-    value = input('', ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
-    /** Emits the newly-typed value. From the native `valueChange` event. */
-    ksValueChange = output();
-    /** Emitted on native blur. From the native `ksBlur` event. */
-    ksBlurred = output();
-    constructor(ref) {
-        this.el = ref.nativeElement;
-        effect(() => (this.el.label = this.label()));
-        effect(() => (this.el.placeholder = this.placeholder()));
-        effect(() => (this.el.rows = this.rows()));
-        effect(() => (this.el.maxLength = this.maxLength()));
-        effect(() => (this.el.showCounter = this.showCounter()));
-        effect(() => (this.el.autoResize = this.autoResize()));
-        effect(() => (this.el.disabled = this.disabled()));
-        effect(() => (this.el.error = this.error()));
-        effect(() => (this.el.hint = this.hint()));
-        effect(() => (this.el.value = this.value()));
-        const onNativeValueChange = (event) => {
-            const detail = event.detail;
-            this.ksValueChange.emit(detail);
-            this.onChange(detail);
-        };
-        const onNativeBlur = () => {
-            this.ksBlurred.emit();
-            this.onTouched();
-        };
-        this.el.addEventListener('valueChange', onNativeValueChange);
-        this.el.addEventListener('ksBlur', onNativeBlur);
-        inject(DestroyRef).onDestroy(() => {
-            this.el.removeEventListener('valueChange', onNativeValueChange);
-            this.el.removeEventListener('ksBlur', onNativeBlur);
-        });
-    }
-    writeValue(value) {
-        this.el.value = value ?? '';
-    }
-    registerOnChange(fn) {
-        this.onChange = fn;
-    }
-    registerOnTouched(fn) {
-        this.onTouched = fn;
-    }
-    setDisabledState(isDisabled) {
-        this.el.disabled = isDisabled;
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KsTextareaComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.25", type: KsTextareaComponent, isStandalone: true, selector: "ks-textarea", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, rows: { classPropertyName: "rows", publicName: "rows", isSignal: true, isRequired: false, transformFunction: null }, maxLength: { classPropertyName: "maxLength", publicName: "maxLength", isSignal: true, isRequired: false, transformFunction: null }, showCounter: { classPropertyName: "showCounter", publicName: "showCounter", isSignal: true, isRequired: false, transformFunction: null }, autoResize: { classPropertyName: "autoResize", publicName: "autoResize", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, error: { classPropertyName: "error", publicName: "error", isSignal: true, isRequired: false, transformFunction: null }, hint: { classPropertyName: "hint", publicName: "hint", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { ksValueChange: "ksValueChange", ksBlurred: "ksBlurred" }, providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: KsTextareaComponent, multi: true }], ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KsTextareaComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'ks-textarea',
-                    standalone: true,
-                    template: '',
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                    providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: KsTextareaComponent, multi: true }],
-                }]
-        }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], rows: [{ type: i0.Input, args: [{ isSignal: true, alias: "rows", required: false }] }], maxLength: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxLength", required: false }] }], showCounter: [{ type: i0.Input, args: [{ isSignal: true, alias: "showCounter", required: false }] }], autoResize: [{ type: i0.Input, args: [{ isSignal: true, alias: "autoResize", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], error: [{ type: i0.Input, args: [{ isSignal: true, alias: "error", required: false }] }], hint: [{ type: i0.Input, args: [{ isSignal: true, alias: "hint", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], ksValueChange: [{ type: i0.Output, args: ["ksValueChange"] }], ksBlurred: [{ type: i0.Output, args: ["ksBlurred"] }] } });
-
-// Side-effect import: registers the `ks-theme-switch` tag — see
-// `Buttons/button/button.ts` for the full explanation of this pattern.
-/**
- * Angular wrapper around the `<ks-theme-switch>` Stencil custom element.
- *
- * Purely presentational — it drives the shared `themeService` singleton
- * (see `core/src/utils/ks-theme.util.ts`) directly and dispatches no
- * events of its own, so this wrapper has plain inputs only, no outputs
- * and no `ControlValueAccessor`.
- *
- * `template: ''` — no `<slot>` in the wrapped Stencil render.
- */
-class KsThemeSwitchComponent {
-    el;
-    /** When true the mode-toggle shows three options: System | Light | Dark. */
-    includeSystem = input(true, ...(ngDevMode ? [{ debugName: "includeSystem" }] : /* istanbul ignore next */ []));
-    /** When true the colour-palette switcher is shown. */
-    includePalette = input(false, ...(ngDevMode ? [{ debugName: "includePalette" }] : /* istanbul ignore next */ []));
-    /** When true only icons are shown in the mode-toggle switch. */
-    onlyIcon = input(false, ...(ngDevMode ? [{ debugName: "onlyIcon" }] : /* istanbul ignore next */ []));
-    /** The palette that should be active on init. */
-    palette = input('ForestGreen', ...(ngDevMode ? [{ debugName: "palette" }] : /* istanbul ignore next */ []));
-    /** The mode that should be active on init. */
-    mode = input(ThemeMode.Light, ...(ngDevMode ? [{ debugName: "mode" }] : /* istanbul ignore next */ []));
-    constructor(ref) {
-        this.el = ref.nativeElement;
-        effect(() => (this.el.includeSystem = this.includeSystem()));
-        effect(() => (this.el.includePalette = this.includePalette()));
-        effect(() => (this.el.onlyIcon = this.onlyIcon()));
-        effect(() => (this.el.palette = this.palette()));
-        effect(() => (this.el.mode = this.mode()));
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KsThemeSwitchComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.25", type: KsThemeSwitchComponent, isStandalone: true, selector: "ks-theme-switch", inputs: { includeSystem: { classPropertyName: "includeSystem", publicName: "includeSystem", isSignal: true, isRequired: false, transformFunction: null }, includePalette: { classPropertyName: "includePalette", publicName: "includePalette", isSignal: true, isRequired: false, transformFunction: null }, onlyIcon: { classPropertyName: "onlyIcon", publicName: "onlyIcon", isSignal: true, isRequired: false, transformFunction: null }, palette: { classPropertyName: "palette", publicName: "palette", isSignal: true, isRequired: false, transformFunction: null }, mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KsThemeSwitchComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'ks-theme-switch',
-                    standalone: true,
-                    template: '',
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                }]
-        }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { includeSystem: [{ type: i0.Input, args: [{ isSignal: true, alias: "includeSystem", required: false }] }], includePalette: [{ type: i0.Input, args: [{ isSignal: true, alias: "includePalette", required: false }] }], onlyIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "onlyIcon", required: false }] }], palette: [{ type: i0.Input, args: [{ isSignal: true, alias: "palette", required: false }] }], mode: [{ type: i0.Input, args: [{ isSignal: true, alias: "mode", required: false }] }] } });
-
-// Side-effect import: registers the `ks-uploader` tag — see
-// `Buttons/button/button.ts` for the full explanation of this pattern.
-/**
- * Angular wrapper around the `<ks-uploader>` Stencil custom element.
- *
- * No two-way "value" here — the Stencil source has no `writeValue()`
- * method and no single controlled prop, just a plain `filesChange`/
- * `filesRejected` event pair, so no `ControlValueAccessor` is implemented
- * (unlike the other `Inputs/*` wrappers).
- *
- * `template: ''` — no `<slot>` in the wrapped Stencil render.
- */
-class KsUploaderComponent {
-    el;
-    /** Accepted MIME types / extensions, e.g. "image/*,.pdf" */
-    accept = input('', ...(ngDevMode ? [{ debugName: "accept" }] : /* istanbul ignore next */ []));
-    /** Allow selecting multiple files */
-    multiple = input(false, ...(ngDevMode ? [{ debugName: "multiple" }] : /* istanbul ignore next */ []));
-    /** Maximum file size in bytes (0 = no limit) */
-    maxSize = input(0, ...(ngDevMode ? [{ debugName: "maxSize" }] : /* istanbul ignore next */ []));
-    /** Show image thumbnails for image/* files */
-    previewImages = input(true, ...(ngDevMode ? [{ debugName: "previewImages" }] : /* istanbul ignore next */ []));
-    /** Custom drop-zone label */
-    label = input('or Drop files here', ...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
-    /** Disabled state */
-    disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
-    /** Emits the accepted files whenever the selection changes. From the native `filesChange` event. */
-    ksFilesChange = output();
-    /** Emits rejected files (wrong type / over size limit). From the native `filesRejected` event. */
-    ksFilesRejected = output();
-    constructor(ref) {
-        this.el = ref.nativeElement;
-        effect(() => (this.el.accept = this.accept()));
-        effect(() => (this.el.multiple = this.multiple()));
-        effect(() => (this.el.maxSize = this.maxSize()));
-        effect(() => (this.el.previewImages = this.previewImages()));
-        effect(() => (this.el.label = this.label()));
-        effect(() => (this.el.disabled = this.disabled()));
-        const onNativeFilesChange = (event) => {
-            this.ksFilesChange.emit(event.detail);
-        };
-        const onNativeFilesRejected = (event) => {
-            this.ksFilesRejected.emit(event.detail);
-        };
-        this.el.addEventListener('filesChange', onNativeFilesChange);
-        this.el.addEventListener('filesRejected', onNativeFilesRejected);
-        inject(DestroyRef).onDestroy(() => {
-            this.el.removeEventListener('filesChange', onNativeFilesChange);
-            this.el.removeEventListener('filesRejected', onNativeFilesRejected);
-        });
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KsUploaderComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.25", type: KsUploaderComponent, isStandalone: true, selector: "ks-uploader", inputs: { 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 }, previewImages: { classPropertyName: "previewImages", publicName: "previewImages", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { ksFilesChange: "ksFilesChange", ksFilesRejected: "ksFilesRejected" }, ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KsUploaderComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'ks-uploader',
-                    standalone: true,
-                    template: '',
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                }]
-        }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { 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 }] }], previewImages: [{ type: i0.Input, args: [{ isSignal: true, alias: "previewImages", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], ksFilesChange: [{ type: i0.Output, args: ["ksFilesChange"] }], ksFilesRejected: [{ type: i0.Output, args: ["ksFilesRejected"] }] } });
-
-// Side-effect import: registers the `ks-avatar` tag — see
-// `Buttons/button/button.ts` for the full explanation of this pattern.
-/**
- * Angular wrapper around the `<ks-avatar>` Stencil custom element.
- *
- * Purely presentational — no events, no `<slot>` in the wrapped Stencil
- * render, plain inputs only (same shape as `Inputs/theme-switch/theme-switch.ts`).
- */
-class KsAvatarComponent {
-    el;
-    /** Image URL — takes priority over initials */
-    src = input('', ...(ngDevMode ? [{ debugName: "src" }] : /* istanbul ignore next */ []));
-    /** Alt text for the image */
-    alt = input('', ...(ngDevMode ? [{ debugName: "alt" }] : /* istanbul ignore next */ []));
-    /** Initials shown when no image (e.g. "KS") */
-    initials = input('', ...(ngDevMode ? [{ debugName: "initials" }] : /* istanbul ignore next */ []));
-    /** Icon class shown when neither src nor initials */
-    icon = input('', ...(ngDevMode ? [{ debugName: "icon" }] : /* istanbul ignore next */ []));
-    /** Size */
-    size = input('md', ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
-    /** Colour variant — used when showing initials or icon */
-    variant = input('brand', ...(ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []));
-    /** Circular (default) or rounded-square */
-    square = input(false, ...(ngDevMode ? [{ debugName: "square" }] : /* istanbul ignore next */ []));
-    constructor(ref) {
-        this.el = ref.nativeElement;
-        effect(() => (this.el.src = this.src()));
-        effect(() => (this.el.alt = this.alt()));
-        effect(() => (this.el.initials = this.initials()));
-        effect(() => (this.el.icon = this.icon()));
-        effect(() => (this.el.size = this.size()));
-        effect(() => (this.el.variant = this.variant()));
-        effect(() => (this.el.square = this.square()));
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KsAvatarComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.25", type: KsAvatarComponent, isStandalone: true, selector: "ks-avatar", inputs: { src: { classPropertyName: "src", publicName: "src", isSignal: true, isRequired: false, transformFunction: null }, alt: { classPropertyName: "alt", publicName: "alt", isSignal: true, isRequired: false, transformFunction: null }, initials: { classPropertyName: "initials", publicName: "initials", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, square: { classPropertyName: "square", publicName: "square", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KsAvatarComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'ks-avatar',
-                    standalone: true,
-                    template: '',
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                }]
-        }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { src: [{ type: i0.Input, args: [{ isSignal: true, alias: "src", required: false }] }], alt: [{ type: i0.Input, args: [{ isSignal: true, alias: "alt", required: false }] }], initials: [{ type: i0.Input, args: [{ isSignal: true, alias: "initials", required: false }] }], icon: [{ type: i0.Input, args: [{ isSignal: true, alias: "icon", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], square: [{ type: i0.Input, args: [{ isSignal: true, alias: "square", required: false }] }] } });
-
-// Side-effect import: registers the `ks-card` tag — see
-// `Buttons/button/button.ts` for the full explanation of this pattern.
-/**
- * Angular wrapper around the `<ks-card>` Stencil custom element.
- *
- * ## Slots
- * Unlike the Buttons/Calendars/Dropdowns wrappers, `<ks-card>` renders
- * real, consumer-facing `<slot name="header" />`, `<slot />` (default) and
- * `<slot name="footer" />` in its scoped (non-shadow) Stencil `render()`.
- * `template: '<ng-content></ng-content>'` (a single unfiltered pass-through,
- * not per-slot `<ng-content select="...">`) projects ALL of this Angular
- * component's content as real light-DOM children of the `<ks-card>` host
- * node; Stencil's own scoped-slot relocation logic (see `shadow: false,
- * scoped: true` on the Stencil class) then places each child into the
- * right native `<slot>` based on that child's own `slot="header"` /
- * `slot="footer"` attribute — same as plain HTML, nothing Angular-specific
- * needed beyond forwarding the projected content through untouched.
- * Usage: `<ks-card><ks-header slot="header">…</ks-header>Body<ks-footer slot="footer">…</ks-footer></ks-card>`.
- */
-class KsCardComponent {
-    el;
-    /** Card title */
-    label = input('', ...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
-    /** Card title (Angular input name was `title`; aliased to avoid clashing with the native `title` attribute/tooltip). */
-    cardTitle = input('', ...(ngDevMode ? [{ debugName: "cardTitle" }] : /* istanbul ignore next */ []));
-    /** Subtitle / subheading */
-    subtitle = input('', ...(ngDevMode ? [{ debugName: "subtitle" }] : /* istanbul ignore next */ []));
-    /** URL for header image */
-    imageUrl = input('', ...(ngDevMode ? [{ debugName: "imageUrl" }] : /* istanbul ignore next */ []));
-    /** Alt text for image */
-    imageAlt = input('', ...(ngDevMode ? [{ debugName: "imageAlt" }] : /* istanbul ignore next */ []));
-    /** SVG icon class */
-    iconClass = input('', ...(ngDevMode ? [{ debugName: "iconClass" }] : /* istanbul ignore next */ []));
-    /** Card visual variant */
-    variant = input('default', ...(ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []));
-    /** Emits when clicked (only when clickable). From the native `cardClick` event. */
-    ksCardClick = output();
-    constructor(ref) {
-        this.el = ref.nativeElement;
-        effect(() => (this.el.label = this.label()));
-        effect(() => (this.el.cardTitle = this.cardTitle()));
-        effect(() => (this.el.subtitle = this.subtitle()));
-        effect(() => (this.el.imageUrl = this.imageUrl()));
-        effect(() => (this.el.imageAlt = this.imageAlt()));
-        effect(() => (this.el.iconClass = this.iconClass()));
-        effect(() => (this.el.variant = this.variant()));
-        const onNativeCardClick = (event) => {
-            this.ksCardClick.emit(event.detail);
-        };
-        this.el.addEventListener('cardClick', onNativeCardClick);
-        inject(DestroyRef).onDestroy(() => this.el.removeEventListener('cardClick', onNativeCardClick));
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KsCardComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.25", type: KsCardComponent, isStandalone: true, selector: "ks-card", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, cardTitle: { classPropertyName: "cardTitle", publicName: "cardTitle", isSignal: true, isRequired: false, transformFunction: null }, subtitle: { classPropertyName: "subtitle", publicName: "subtitle", isSignal: true, isRequired: false, transformFunction: null }, imageUrl: { classPropertyName: "imageUrl", publicName: "imageUrl", isSignal: true, isRequired: false, transformFunction: null }, imageAlt: { classPropertyName: "imageAlt", publicName: "imageAlt", isSignal: true, isRequired: false, transformFunction: null }, iconClass: { classPropertyName: "iconClass", publicName: "iconClass", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { ksCardClick: "ksCardClick" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KsCardComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'ks-card',
-                    standalone: true,
-                    template: '<ng-content></ng-content>',
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                }]
-        }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], cardTitle: [{ type: i0.Input, args: [{ isSignal: true, alias: "cardTitle", required: false }] }], subtitle: [{ type: i0.Input, args: [{ isSignal: true, alias: "subtitle", required: false }] }], imageUrl: [{ type: i0.Input, args: [{ isSignal: true, alias: "imageUrl", required: false }] }], imageAlt: [{ type: i0.Input, args: [{ isSignal: true, alias: "imageAlt", required: false }] }], iconClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "iconClass", required: false }] }], variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], ksCardClick: [{ type: i0.Output, args: ["ksCardClick"] }] } });
-
-// Side-effect import: registers the `ks-code-view` tag — see
-// `Buttons/button/button.ts` for the full explanation of this pattern.
-/**
- * Angular wrapper around the `<ks-code-view>` Stencil custom element.
- * Purely presentational — no events, no `<slot>` in the wrapped Stencil
- * render, plain inputs only.
- */
-class KsCodeViewComponent {
-    el;
-    /** The source code string to display */
-    code = input('', ...(ngDevMode ? [{ debugName: "code" }] : /* istanbul ignore next */ []));
-    /** Language hint shown in the header badge */
-    language = input('html', ...(ngDevMode ? [{ debugName: "language" }] : /* istanbul ignore next */ []));
-    /** Optional title shown in the header */
-    label = input('', ...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
-    /** Max visible height before scroll kicks in (CSS value, e.g. '20rem') */
-    maxHeight = input('24rem', ...(ngDevMode ? [{ debugName: "maxHeight" }] : /* istanbul ignore next */ []));
-    /** Show the header bar with language badge & copy button */
-    showHeader = input(true, ...(ngDevMode ? [{ debugName: "showHeader" }] : /* istanbul ignore next */ []));
-    /** Whether the code block is currently collapsed */
-    collapsed = input(false, ...(ngDevMode ? [{ debugName: "collapsed" }] : /* istanbul ignore next */ []));
-    /** Whether the code block is to show and hide buttons */
-    actionButtonConfig = input({ expand: true, code: true }, ...(ngDevMode ? [{ debugName: "actionButtonConfig" }] : /* istanbul ignore next */ []));
-    constructor(ref) {
-        this.el = ref.nativeElement;
-        effect(() => (this.el.code = this.code()));
-        effect(() => (this.el.language = this.language()));
-        effect(() => (this.el.label = this.label()));
-        effect(() => (this.el.maxHeight = this.maxHeight()));
-        effect(() => (this.el.showHeader = this.showHeader()));
-        effect(() => (this.el.collapsed = this.collapsed()));
-        effect(() => (this.el.actionButtonConfig = this.actionButtonConfig()));
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KsCodeViewComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.25", type: KsCodeViewComponent, isStandalone: true, selector: "ks-code-view", inputs: { code: { classPropertyName: "code", publicName: "code", isSignal: true, isRequired: false, transformFunction: null }, language: { classPropertyName: "language", publicName: "language", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, maxHeight: { classPropertyName: "maxHeight", publicName: "maxHeight", isSignal: true, isRequired: false, transformFunction: null }, showHeader: { classPropertyName: "showHeader", publicName: "showHeader", isSignal: true, isRequired: false, transformFunction: null }, collapsed: { classPropertyName: "collapsed", publicName: "collapsed", isSignal: true, isRequired: false, transformFunction: null }, actionButtonConfig: { classPropertyName: "actionButtonConfig", publicName: "actionButtonConfig", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KsCodeViewComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'ks-code-view',
-                    standalone: true,
-                    template: '',
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                }]
-        }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { code: [{ type: i0.Input, args: [{ isSignal: true, alias: "code", required: false }] }], language: [{ type: i0.Input, args: [{ isSignal: true, alias: "language", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], maxHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxHeight", required: false }] }], showHeader: [{ type: i0.Input, args: [{ isSignal: true, alias: "showHeader", required: false }] }], collapsed: [{ type: i0.Input, args: [{ isSignal: true, alias: "collapsed", required: false }] }], actionButtonConfig: [{ type: i0.Input, args: [{ isSignal: true, alias: "actionButtonConfig", required: false }] }] } });
-
-// Side-effect import: registers the `ks-dialog` tag — see
-// `Buttons/button/button.ts` for the full explanation of this pattern.
-/**
- * Angular wrapper around the `<ks-dialog>` Stencil custom element.
- *
- * `open` is a plain input, not `ControlValueAccessor` — a dialog's open
- * state isn't form data. For the same reason described throughout this
- * repo, the output can't be named `openChange` (it would collide with the
- * native `openChange`-style close event — see below), so bind explicitly:
- * `[open]="isOpen" (ksCloseDialog)="isOpen = false"`.
- *
- * ## Slots
- * `<ks-dialog>` renders real, consumer-facing `<slot />` (default) and
- * `<slot name="footer" />`. Same single unfiltered `<ng-content>`
- * pass-through as `Layout/card/card.ts` — see that file's doc comment for
- * the full explanation of how native `slot="footer"` attributes on
- * projected children route into the right Stencil `<slot>`.
- */
-class KsDialogComponent {
-    el;
-    /** Whether the dialog is open */
-    open = input(false, ...(ngDevMode ? [{ debugName: "open" }] : /* istanbul ignore next */ []));
-    /** Dialog title */
-    label = input('', ...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
-    /** Hide the built-in close (✕) button */
-    hideClose = input(false, ...(ngDevMode ? [{ debugName: "hideClose" }] : /* istanbul ignore next */ []));
-    /** Prevent closing by clicking the backdrop */
-    persistent = input(false, ...(ngDevMode ? [{ debugName: "persistent" }] : /* istanbul ignore next */ []));
-    /** Panel size */
-    size = input('md', ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
-    /** Target element id (without #), or '' to use `<body>`. When set, the overlay covers only that element and the dialog is centred inside it. */
-    target = input('', ...(ngDevMode ? [{ debugName: "target" }] : /* istanbul ignore next */ []));
-    /** Emits when the dialog requests close. From the native `closeDialog` event. */
-    ksCloseDialog = output();
-    constructor(ref) {
-        this.el = ref.nativeElement;
-        effect(() => (this.el.open = this.open()));
-        effect(() => (this.el.label = this.label()));
-        effect(() => (this.el.hideClose = this.hideClose()));
-        effect(() => (this.el.persistent = this.persistent()));
-        effect(() => (this.el.size = this.size()));
-        effect(() => (this.el.target = this.target()));
-        const onNativeCloseDialog = () => this.ksCloseDialog.emit();
-        this.el.addEventListener('closeDialog', onNativeCloseDialog);
-        inject(DestroyRef).onDestroy(() => this.el.removeEventListener('closeDialog', onNativeCloseDialog));
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KsDialogComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.25", type: KsDialogComponent, isStandalone: true, selector: "ks-dialog", inputs: { open: { classPropertyName: "open", publicName: "open", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, hideClose: { classPropertyName: "hideClose", publicName: "hideClose", isSignal: true, isRequired: false, transformFunction: null }, persistent: { classPropertyName: "persistent", publicName: "persistent", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, target: { classPropertyName: "target", publicName: "target", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { ksCloseDialog: "ksCloseDialog" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KsDialogComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'ks-dialog',
-                    standalone: true,
-                    template: '<ng-content></ng-content>',
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                }]
-        }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { open: [{ type: i0.Input, args: [{ isSignal: true, alias: "open", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], hideClose: [{ type: i0.Input, args: [{ isSignal: true, alias: "hideClose", required: false }] }], persistent: [{ type: i0.Input, args: [{ isSignal: true, alias: "persistent", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], target: [{ type: i0.Input, args: [{ isSignal: true, alias: "target", required: false }] }], ksCloseDialog: [{ type: i0.Output, args: ["ksCloseDialog"] }] } });
-
-// Side-effect import: registers the `ks-not-found` tag — see
-// `Buttons/button/button.ts` for the full explanation of this pattern.
-/**
- * Angular wrapper around the `<ks-not-found>` Stencil custom element.
- *
- * `<ks-not-found>` renders a real, consumer-facing default `<slot />`.
- * Same single unfiltered `<ng-content>` pass-through as
- * `Layout/card/card.ts` — see that file's doc comment for the full
- * explanation of how projected content routes into the Stencil `<slot>`.
- */
-class KsNotFoundComponent {
-    el;
-    /** Label shown on the redirect button (default: "Go to Home") */
-    buttonLabel = input('Go to Home', ...(ngDevMode ? [{ debugName: "buttonLabel" }] : /* istanbul ignore next */ []));
-    /** href the button and auto-redirect navigate to (default: "./") */
-    homeHref = input('./', ...(ngDevMode ? [{ debugName: "homeHref" }] : /* istanbul ignore next */ []));
-    /** Seconds before auto-redirect fires. Set to `0` to disable the countdown. */
-    countdown = input(30, ...(ngDevMode ? [{ debugName: "countdown" }] : /* istanbul ignore next */ []));
-    showActionButtons = input(true, ...(ngDevMode ? [{ debugName: "showActionButtons" }] : /* istanbul ignore next */ []));
-    /** Custom heading (default: "404") */
-    code = input('404', ...(ngDevMode ? [{ debugName: "code" }] : /* istanbul ignore next */ []));
-    /** Custom sub-heading (default: "Page not found") */
-    message = input('Page not found', ...(ngDevMode ? [{ debugName: "message" }] : /* istanbul ignore next */ []));
-    /** Custom description below the heading */
-    description = input("The page you're looking for doesn't exist or has been moved.", ...(ngDevMode ? [{ debugName: "description" }] : /* istanbul ignore next */ []));
-    /** Emitted just before the auto-redirect navigates away. From the native `redirecting` event. */
-    ksRedirecting = output();
-    constructor(ref) {
-        this.el = ref.nativeElement;
-        effect(() => (this.el.buttonLabel = this.buttonLabel()));
-        effect(() => (this.el.homeHref = this.homeHref()));
-        effect(() => (this.el.countdown = this.countdown()));
-        effect(() => (this.el.showActionButtons = this.showActionButtons()));
-        effect(() => (this.el.code = this.code()));
-        effect(() => (this.el.message = this.message()));
-        effect(() => (this.el.description = this.description()));
-        const onNativeRedirecting = () => this.ksRedirecting.emit();
-        this.el.addEventListener('redirecting', onNativeRedirecting);
-        inject(DestroyRef).onDestroy(() => this.el.removeEventListener('redirecting', onNativeRedirecting));
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KsNotFoundComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.25", type: KsNotFoundComponent, isStandalone: true, selector: "ks-not-found", inputs: { buttonLabel: { classPropertyName: "buttonLabel", publicName: "buttonLabel", isSignal: true, isRequired: false, transformFunction: null }, homeHref: { classPropertyName: "homeHref", publicName: "homeHref", isSignal: true, isRequired: false, transformFunction: null }, countdown: { classPropertyName: "countdown", publicName: "countdown", isSignal: true, isRequired: false, transformFunction: null }, showActionButtons: { classPropertyName: "showActionButtons", publicName: "showActionButtons", isSignal: true, isRequired: false, transformFunction: null }, code: { classPropertyName: "code", publicName: "code", isSignal: true, isRequired: false, transformFunction: null }, message: { classPropertyName: "message", publicName: "message", isSignal: true, isRequired: false, transformFunction: null }, description: { classPropertyName: "description", publicName: "description", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { ksRedirecting: "ksRedirecting" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KsNotFoundComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'ks-not-found',
-                    standalone: true,
-                    template: '<ng-content></ng-content>',
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                }]
-        }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { buttonLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "buttonLabel", required: false }] }], homeHref: [{ type: i0.Input, args: [{ isSignal: true, alias: "homeHref", required: false }] }], countdown: [{ type: i0.Input, args: [{ isSignal: true, alias: "countdown", required: false }] }], showActionButtons: [{ type: i0.Input, args: [{ isSignal: true, alias: "showActionButtons", required: false }] }], code: [{ type: i0.Input, args: [{ isSignal: true, alias: "code", required: false }] }], message: [{ type: i0.Input, args: [{ isSignal: true, alias: "message", required: false }] }], description: [{ type: i0.Input, args: [{ isSignal: true, alias: "description", required: false }] }], ksRedirecting: [{ type: i0.Output, args: ["ksRedirecting"] }] } });
-
-// Side-effect import: registers the `ks-sidebar` tag — see
-// `Buttons/button/button.ts` for the full explanation of this pattern.
-/**
- * Angular wrapper around the `<ks-sidebar>` Stencil custom element.
- *
- * `open` is a plain input/output pair, not `ControlValueAccessor` — panel
- * open state isn't form data. The native event is literally `openChange`,
- * so (per the double-fire rule in `Buttons/button.ts`) the Angular output
- * can't reuse that name; bind explicitly instead:
- * `[open]="isOpen" (ksOpenChange)="isOpen = $event"`.
- *
- * `<ks-sidebar>`'s own `@Method()`s (`openPanel`/`close`/`toggle`) are
- * exposed here as real passthrough methods — grab the component instance
- * with `@ViewChild(KsSidebarComponent)` and call them directly.
- *
- * ## Slots
- * Renders real `<slot name="header" />`, `<slot />` (default) and
- * `<slot name="footer" />`. Same single unfiltered `<ng-content>`
- * pass-through as `Layout/card/card.ts`.
- */
-class KsSidebarComponent {
-    el;
-    /** Which side the panel appears on */
-    position = input('left', ...(ngDevMode ? [{ debugName: "position" }] : /* istanbul ignore next */ []));
-    /** Behaviour type */
-    type = input('over', ...(ngDevMode ? [{ debugName: "type" }] : /* istanbul ignore next */ []));
-    /** Initial/controlled open state. Bind explicitly: `[open]="isOpen" (ksOpenChange)="isOpen = $event"`. */
-    open = model(false, ...(ngDevMode ? [{ debugName: "open" }] : /* istanbul ignore next */ []));
-    /** Width of the sidebar panel */
-    width = input('18rem', ...(ngDevMode ? [{ debugName: "width" }] : /* istanbul ignore next */ []));
-    /** Target element id (without #) or '' to use the page. */
-    target = input('', ...(ngDevMode ? [{ debugName: "target" }] : /* istanbul ignore next */ []));
-    /** Fires whenever `open` changes. From the native `openChange` event. */
-    ksOpenChange = output();
-    constructor(ref) {
-        this.el = ref.nativeElement;
-        effect(() => (this.el.position = this.position()));
-        effect(() => (this.el.type = this.type()));
-        effect(() => (this.el.open = this.open()));
-        effect(() => (this.el.width = this.width()));
-        effect(() => (this.el.target = this.target()));
-        const onNativeOpenChange = (event) => {
-            this.ksOpenChange.emit(event.detail);
-        };
-        this.el.addEventListener('openChange', onNativeOpenChange);
-        inject(DestroyRef).onDestroy(() => this.el.removeEventListener('openChange', onNativeOpenChange));
-    }
-    /** Passthrough to `<ks-sidebar>`'s own `@Method() openPanel()`. */
-    openPanel() {
-        return this.el.openPanel();
-    }
-    /** Passthrough to `<ks-sidebar>`'s own `@Method() close()`. */
-    close() {
-        return this.el.close();
-    }
-    /** Passthrough to `<ks-sidebar>`'s own `@Method() toggle()`. */
-    toggle() {
-        return this.el.toggle();
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KsSidebarComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.25", type: KsSidebarComponent, isStandalone: true, selector: "ks-sidebar", inputs: { position: { classPropertyName: "position", publicName: "position", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, open: { classPropertyName: "open", publicName: "open", isSignal: true, isRequired: false, transformFunction: null }, width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null }, target: { classPropertyName: "target", publicName: "target", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { open: "openChange", ksOpenChange: "ksOpenChange" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KsSidebarComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'ks-sidebar',
-                    standalone: true,
-                    template: '<ng-content></ng-content>',
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                }]
-        }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { position: [{ type: i0.Input, args: [{ isSignal: true, alias: "position", required: false }] }], type: [{ type: i0.Input, args: [{ isSignal: true, alias: "type", required: false }] }], open: [{ type: i0.Input, args: [{ isSignal: true, alias: "open", required: false }] }, { type: i0.Output, args: ["openChange"] }], width: [{ type: i0.Input, args: [{ isSignal: true, alias: "width", required: false }] }], target: [{ type: i0.Input, args: [{ isSignal: true, alias: "target", required: false }] }], ksOpenChange: [{ type: i0.Output, args: ["ksOpenChange"] }] } });
-
-// Side-effect import: registers the `ks-table` tag — see
-// `Buttons/button/button.ts` for the full explanation of this pattern.
-/**
- * Angular wrapper around the `<ks-table>` Stencil custom element.
- * No `<slot>` in the wrapped Stencil render — data-driven only.
- */
-class KsTableComponent {
-    el;
-    /** Array of objects to render as table rows */
-    data = input([], ...(ngDevMode ? [{ debugName: "data" }] : /* istanbul ignore next */ []));
-    /** Optional explicit column order; defaults to keys of the first row */
-    columns = input([], ...(ngDevMode ? [{ debugName: "columns" }] : /* istanbul ignore next */ []));
-    /** Optional custom column header labels: { key: 'Display Label' } */
-    columnLabels = input({}, ...(ngDevMode ? [{ debugName: "columnLabels" }] : /* istanbul ignore next */ []));
-    /** Visual variant */
-    variant = input('default', ...(ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []));
-    /** Row size */
-    size = input('md', ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
-    /** Show a caption / title above the table */
-    caption = input('', ...(ngDevMode ? [{ debugName: "caption" }] : /* istanbul ignore next */ []));
-    /** Make the table horizontally scrollable on overflow */
-    scrollable = input(true, ...(ngDevMode ? [{ debugName: "scrollable" }] : /* istanbul ignore next */ []));
-    /** Highlight row on hover */
-    hoverable = input(true, ...(ngDevMode ? [{ debugName: "hoverable" }] : /* istanbul ignore next */ []));
-    /** Emits the clicked row's data. From the native `rowClick` event. */
-    ksRowClick = output();
-    constructor(ref) {
-        this.el = ref.nativeElement;
-        effect(() => (this.el.data = this.data()));
-        effect(() => (this.el.columns = this.columns()));
-        effect(() => (this.el.columnLabels = this.columnLabels()));
-        effect(() => (this.el.variant = this.variant()));
-        effect(() => (this.el.size = this.size()));
-        effect(() => (this.el.caption = this.caption()));
-        effect(() => (this.el.scrollable = this.scrollable()));
-        effect(() => (this.el.hoverable = this.hoverable()));
-        const onNativeRowClick = (event) => {
-            this.ksRowClick.emit(event.detail);
-        };
-        this.el.addEventListener('rowClick', onNativeRowClick);
-        inject(DestroyRef).onDestroy(() => this.el.removeEventListener('rowClick', onNativeRowClick));
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KsTableComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.25", type: KsTableComponent, isStandalone: true, selector: "ks-table", inputs: { data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: false, transformFunction: null }, columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: false, transformFunction: null }, columnLabels: { classPropertyName: "columnLabels", publicName: "columnLabels", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, caption: { classPropertyName: "caption", publicName: "caption", isSignal: true, isRequired: false, transformFunction: null }, scrollable: { classPropertyName: "scrollable", publicName: "scrollable", isSignal: true, isRequired: false, transformFunction: null }, hoverable: { classPropertyName: "hoverable", publicName: "hoverable", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { ksRowClick: "ksRowClick" }, ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KsTableComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'ks-table',
-                    standalone: true,
-                    template: '',
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                }]
-        }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { data: [{ type: i0.Input, args: [{ isSignal: true, alias: "data", required: false }] }], columns: [{ type: i0.Input, args: [{ isSignal: true, alias: "columns", required: false }] }], columnLabels: [{ type: i0.Input, args: [{ isSignal: true, alias: "columnLabels", required: false }] }], variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], caption: [{ type: i0.Input, args: [{ isSignal: true, alias: "caption", required: false }] }], scrollable: [{ type: i0.Input, args: [{ isSignal: true, alias: "scrollable", required: false }] }], hoverable: [{ type: i0.Input, args: [{ isSignal: true, alias: "hoverable", required: false }] }], ksRowClick: [{ type: i0.Output, args: ["ksRowClick"] }] } });
-
-// Side-effect import: registers the `ks-tooltip` tag — see
-// `Buttons/button/button.ts` for the full explanation of this pattern.
-/**
- * Angular wrapper around the `<ks-tooltip>` Stencil custom element.
- *
- * `<ks-tooltip>` renders a real, consumer-facing default `<slot />` for
- * the element the tooltip is attached to. Same single unfiltered
- * `<ng-content>` pass-through as `Layout/card/card.ts` — wrap the
- * trigger element as `<ks-tooltip text="Hi"><button>Hover me</button></ks-tooltip>`.
- */
-class KsTooltipComponent {
-    el;
-    /** Tooltip text */
-    text = input('', ...(ngDevMode ? [{ debugName: "text" }] : /* istanbul ignore next */ []));
-    /** Preferred placement */
-    position = input('top', ...(ngDevMode ? [{ debugName: "position" }] : /* istanbul ignore next */ []));
-    /** Show tooltip on demand (true = always visible) — leave false for hover behaviour */
-    visible = input(false, ...(ngDevMode ? [{ debugName: "visible" }] : /* istanbul ignore next */ []));
-    constructor(ref) {
-        this.el = ref.nativeElement;
-        effect(() => (this.el.text = this.text()));
-        effect(() => (this.el.position = this.position()));
-        effect(() => (this.el.visible = this.visible()));
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KsTooltipComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.25", type: KsTooltipComponent, isStandalone: true, selector: "ks-tooltip", inputs: { text: { classPropertyName: "text", publicName: "text", isSignal: true, isRequired: false, transformFunction: null }, position: { classPropertyName: "position", publicName: "position", isSignal: true, isRequired: false, transformFunction: null }, visible: { classPropertyName: "visible", publicName: "visible", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KsTooltipComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'ks-tooltip',
-                    standalone: true,
-                    template: '<ng-content></ng-content>',
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                }]
-        }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { text: [{ type: i0.Input, args: [{ isSignal: true, alias: "text", required: false }] }], position: [{ type: i0.Input, args: [{ isSignal: true, alias: "position", required: false }] }], visible: [{ type: i0.Input, args: [{ isSignal: true, alias: "visible", required: false }] }] } });
-
-// Side-effect import: registers the `ks-accordion` tag — see
-// `Buttons/button/button.ts` for the full explanation of this pattern.
-/**
- * Angular wrapper around the `<ks-accordion>` Stencil custom element.
- *
- * ## Panel content — `ksPanel`, NOT a native `slot` attribute
- * The Stencil source maps each light-DOM child carrying a `ksPanel="key"`
- * attribute to a matching named `<slot>` internally (see
- * `core/src/utils/ks-slots.util.ts`'s `getKsPanelMap()`) — it does NOT use
- * the browser-native `slot="..."` attribute consumers would use for
- * `Layout/card/card.ts`-style components. `template: '<ng-content></ng-content>'`
- * still applies the same way: it's a single, unfiltered pass-through of
- * whatever this Angular component's own template projects, as real
- * light-DOM children of the `<ks-accordion>` host — the wrapper does no
- * filtering itself, it just needs to exist so the projected content
- * becomes real children for Stencil's `getKsPanelMap()` scan to find.
- * Usage:
- *   `<ks-accordion [items]="items">
- *      <div ksPanel="profile">Profile body…</div>
- *      <div ksPanel="settings">Settings body…</div>
- *    </ks-accordion>`
- */
-class KsAccordionComponent {
-    el;
-    /** List of accordion panel definitions */
-    items = input([], ...(ngDevMode ? [{ debugName: "items" }] : /* istanbul ignore next */ []));
-    /** Allow multiple panels open simultaneously */
-    multi = input(false, ...(ngDevMode ? [{ debugName: "multi" }] : /* istanbul ignore next */ []));
-    /** Keys that should be open by default */
-    openKeys = input([], ...(ngDevMode ? [{ debugName: "openKeys" }] : /* istanbul ignore next */ []));
-    /** Emits the key that was toggled. From the native `toggled` event. */
-    ksToggled = output();
-    constructor(ref) {
-        this.el = ref.nativeElement;
-        effect(() => (this.el.items = this.items()));
-        effect(() => (this.el.multi = this.multi()));
-        effect(() => (this.el.openKeys = this.openKeys()));
-        const onNativeToggled = (event) => {
-            this.ksToggled.emit(event.detail);
-        };
-        this.el.addEventListener('toggled', onNativeToggled);
-        inject(DestroyRef).onDestroy(() => this.el.removeEventListener('toggled', onNativeToggled));
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KsAccordionComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.25", type: KsAccordionComponent, isStandalone: true, selector: "ks-accordion", inputs: { items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: false, transformFunction: null }, multi: { classPropertyName: "multi", publicName: "multi", isSignal: true, isRequired: false, transformFunction: null }, openKeys: { classPropertyName: "openKeys", publicName: "openKeys", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { ksToggled: "ksToggled" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KsAccordionComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'ks-accordion',
-                    standalone: true,
-                    template: '<ng-content></ng-content>',
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                }]
-        }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { items: [{ type: i0.Input, args: [{ isSignal: true, alias: "items", required: false }] }], multi: [{ type: i0.Input, args: [{ isSignal: true, alias: "multi", required: false }] }], openKeys: [{ type: i0.Input, args: [{ isSignal: true, alias: "openKeys", required: false }] }], ksToggled: [{ type: i0.Output, args: ["ksToggled"] }] } });
-
-// Side-effect import: registers the `ks-breadcrumb` tag — see
-// `Buttons/button/button.ts` for the full explanation of this pattern.
-/**
- * Angular wrapper around the `<ks-breadcrumb>` Stencil custom element.
- * Purely presentational — no events, no `<slot>` in the wrapped Stencil
- * render, plain inputs only.
- */
-class KsBreadcrumbComponent {
-    el;
-    /** Ordered list of breadcrumb items */
-    items = input([], ...(ngDevMode ? [{ debugName: "items" }] : /* istanbul ignore next */ []));
-    /** Separator character or symbol */
-    separator = input('/', ...(ngDevMode ? [{ debugName: "separator" }] : /* istanbul ignore next */ []));
-    /** Size */
-    size = input('lg', ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
-    constructor(ref) {
-        this.el = ref.nativeElement;
-        effect(() => (this.el.items = this.items()));
-        effect(() => (this.el.separator = this.separator()));
-        effect(() => (this.el.size = this.size()));
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KsBreadcrumbComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.25", type: KsBreadcrumbComponent, isStandalone: true, selector: "ks-breadcrumb", inputs: { items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: false, transformFunction: null }, separator: { classPropertyName: "separator", publicName: "separator", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KsBreadcrumbComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'ks-breadcrumb',
-                    standalone: true,
-                    template: '',
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                }]
-        }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { items: [{ type: i0.Input, args: [{ isSignal: true, alias: "items", required: false }] }], separator: [{ type: i0.Input, args: [{ isSignal: true, alias: "separator", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }] } });
-
-// Side-effect import: registers the `ks-carousel` tag — see
-// `Buttons/button/button.ts` for the full explanation of this pattern.
-/**
- * Angular wrapper around the `<ks-carousel>` Stencil custom element.
- * No `<slot>` in the wrapped Stencil render — data-driven only.
- */
-class KsCarouselComponent {
-    el;
-    /** Slides to display */
-    slides = input([], ...(ngDevMode ? [{ debugName: "slides" }] : /* istanbul ignore next */ []));
-    /** Auto-play interval in ms (0 = disabled) */
-    autoPlay = input(0, ...(ngDevMode ? [{ debugName: "autoPlay" }] : /* istanbul ignore next */ []));
-    /** Show prev/next arrow controls */
-    showControls = input(true, ...(ngDevMode ? [{ debugName: "showControls" }] : /* istanbul ignore next */ []));
-    /** Show dot indicators */
-    showDots = input(true, ...(ngDevMode ? [{ debugName: "showDots" }] : /* istanbul ignore next */ []));
-    /** Emits the current slide index on change. From the native `slideChange` event. */
-    ksSlideChange = output();
-    constructor(ref) {
-        this.el = ref.nativeElement;
-        effect(() => (this.el.slides = this.slides()));
-        effect(() => (this.el.autoPlay = this.autoPlay()));
-        effect(() => (this.el.showControls = this.showControls()));
-        effect(() => (this.el.showDots = this.showDots()));
-        const onNativeSlideChange = (event) => {
-            this.ksSlideChange.emit(event.detail);
-        };
-        this.el.addEventListener('slideChange', onNativeSlideChange);
-        inject(DestroyRef).onDestroy(() => this.el.removeEventListener('slideChange', onNativeSlideChange));
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KsCarouselComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.25", type: KsCarouselComponent, isStandalone: true, selector: "ks-carousel", inputs: { slides: { classPropertyName: "slides", publicName: "slides", isSignal: true, isRequired: false, transformFunction: null }, autoPlay: { classPropertyName: "autoPlay", publicName: "autoPlay", isSignal: true, isRequired: false, transformFunction: null }, showControls: { classPropertyName: "showControls", publicName: "showControls", isSignal: true, isRequired: false, transformFunction: null }, showDots: { classPropertyName: "showDots", publicName: "showDots", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { ksSlideChange: "ksSlideChange" }, ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KsCarouselComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'ks-carousel',
-                    standalone: true,
-                    template: '',
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                }]
-        }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { slides: [{ type: i0.Input, args: [{ isSignal: true, alias: "slides", required: false }] }], autoPlay: [{ type: i0.Input, args: [{ isSignal: true, alias: "autoPlay", required: false }] }], showControls: [{ type: i0.Input, args: [{ isSignal: true, alias: "showControls", required: false }] }], showDots: [{ type: i0.Input, args: [{ isSignal: true, alias: "showDots", required: false }] }], ksSlideChange: [{ type: i0.Output, args: ["ksSlideChange"] }] } });
-
-// Side-effect import: registers the `ks-context-menu` tag — see
-// `Buttons/button/button.ts` for the full explanation of this pattern.
-/**
- * Angular wrapper around the `<ks-context-menu>` Stencil custom element.
- *
- * `<ks-context-menu>`'s own `@Method()`s (`open(pos)`/`close()`) are
- * exposed here as real passthrough methods — grab the component instance
- * with `@ViewChild(KsContextMenuComponent)` and call them directly, e.g.
- * `onContextMenu(e: MouseEvent) { menu.open({ x: e.clientX, y: e.clientY }); }`.
- *
- * No `<slot>` in the wrapped Stencil render — data-driven only.
- */
-class KsContextMenuComponent {
-    el;
-    /** Menu items */
-    items = input([], ...(ngDevMode ? [{ debugName: "items" }] : /* istanbul ignore next */ []));
-    /** Emits the clicked item key. From the native `itemClicked` event. */
-    ksItemClicked = output();
-    constructor(ref) {
-        this.el = ref.nativeElement;
-        effect(() => (this.el.items = this.items()));
-        const onNativeItemClicked = (event) => {
-            this.ksItemClicked.emit(event.detail);
-        };
-        this.el.addEventListener('itemClicked', onNativeItemClicked);
-        inject(DestroyRef).onDestroy(() => this.el.removeEventListener('itemClicked', onNativeItemClicked));
-    }
-    /** Passthrough to `<ks-context-menu>`'s own `@Method() open(pos)`. */
-    open(pos) {
-        return this.el.open(pos);
-    }
-    /** Passthrough to `<ks-context-menu>`'s own `@Method() close()`. */
-    close() {
-        return this.el.close();
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KsContextMenuComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.25", type: KsContextMenuComponent, isStandalone: true, selector: "ks-context-menu", inputs: { items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { ksItemClicked: "ksItemClicked" }, ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KsContextMenuComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'ks-context-menu',
-                    standalone: true,
-                    template: '',
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                }]
-        }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { items: [{ type: i0.Input, args: [{ isSignal: true, alias: "items", required: false }] }], ksItemClicked: [{ type: i0.Output, args: ["ksItemClicked"] }] } });
-
-// Side-effect import: registers the `ks-nav-bar` tag — see
-// `Buttons/button/button.ts` for the full explanation of this pattern.
-/**
- * Angular wrapper around the `<ks-nav-bar>` Stencil custom element.
- * Renders a real, consumer-facing default `<slot />` — same single
- * unfiltered `<ng-content>` pass-through as `Layout/card/card.ts`.
- */
-class KsNavBarComponent {
-    el;
-    /** All nav items with their section assignment */
-    items = input([], ...(ngDevMode ? [{ debugName: "items" }] : /* istanbul ignore next */ []));
-    /** Expansion mode */
-    mode = input('iconOnly', ...(ngDevMode ? [{ debugName: "mode" }] : /* istanbul ignore next */ []));
-    /** Width of the icon-only rail */
-    iconWidth = input('3.5rem', ...(ngDevMode ? [{ debugName: "iconWidth" }] : /* istanbul ignore next */ []));
-    /** Width of the expanded label panel */
-    expandedWidth = input('13rem', ...(ngDevMode ? [{ debugName: "expandedWidth" }] : /* istanbul ignore next */ []));
-    constructor(ref) {
-        this.el = ref.nativeElement;
-        effect(() => (this.el.items = this.items()));
-        effect(() => (this.el.mode = this.mode()));
-        effect(() => (this.el.iconWidth = this.iconWidth()));
-        effect(() => (this.el.expandedWidth = this.expandedWidth()));
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KsNavBarComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.25", type: KsNavBarComponent, isStandalone: true, selector: "ks-nav-bar", inputs: { items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: false, transformFunction: null }, mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null }, iconWidth: { classPropertyName: "iconWidth", publicName: "iconWidth", isSignal: true, isRequired: false, transformFunction: null }, expandedWidth: { classPropertyName: "expandedWidth", publicName: "expandedWidth", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KsNavBarComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'ks-nav-bar',
-                    standalone: true,
-                    template: '<ng-content></ng-content>',
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                }]
-        }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { items: [{ type: i0.Input, args: [{ isSignal: true, alias: "items", required: false }] }], mode: [{ type: i0.Input, args: [{ isSignal: true, alias: "mode", required: false }] }], iconWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "iconWidth", required: false }] }], expandedWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "expandedWidth", required: false }] }] } });
-
-// Side-effect import: registers the `ks-pagination` tag — see
-// `Buttons/button/button.ts` for the full explanation of this pattern.
-/**
- * Angular wrapper around the `<ks-pagination>` Stencil custom element.
- * No `<slot>` in the wrapped Stencil render — data-driven only.
- */
-class KsPaginationComponent {
-    el;
-    /** Total number of items */
-    total = input(0, ...(ngDevMode ? [{ debugName: "total" }] : /* istanbul ignore next */ []));
-    /** Items per page */
-    pageSize = input(10, ...(ngDevMode ? [{ debugName: "pageSize" }] : /* istanbul ignore next */ []));
-    /** Current page (1-indexed) */
-    currentPage = input(1, ...(ngDevMode ? [{ debugName: "currentPage" }] : /* istanbul ignore next */ []));
-    /** Show page size selector */
-    showPageSize = input(false, ...(ngDevMode ? [{ debugName: "showPageSize" }] : /* istanbul ignore next */ []));
-    /** Available page sizes */
-    pageSizeOptions = input([10, 20, 50, 100], ...(ngDevMode ? [{ debugName: "pageSizeOptions" }] : /* istanbul ignore next */ []));
-    /** Show quick jumper */
-    showQuickJumper = input(false, ...(ngDevMode ? [{ debugName: "showQuickJumper" }] : /* istanbul ignore next */ []));
-    /** Maximum number of page buttons to show */
-    maxPageButtons = input(7, ...(ngDevMode ? [{ debugName: "maxPageButtons" }] : /* istanbul ignore next */ []));
-    /** Emits when page changes. From the native `pageChange` event. */
-    ksPageChange = output();
-    /** Emits when page size changes. From the native `pageSizeChange` event. */
-    ksPageSizeChange = output();
-    constructor(ref) {
-        this.el = ref.nativeElement;
-        effect(() => (this.el.total = this.total()));
-        effect(() => (this.el.pageSize = this.pageSize()));
-        effect(() => (this.el.currentPage = this.currentPage()));
-        effect(() => (this.el.showPageSize = this.showPageSize()));
-        effect(() => (this.el.pageSizeOptions = this.pageSizeOptions()));
-        effect(() => (this.el.showQuickJumper = this.showQuickJumper()));
-        effect(() => (this.el.maxPageButtons = this.maxPageButtons()));
-        const onNativePageChange = (event) => {
-            this.ksPageChange.emit(event.detail);
-        };
-        const onNativePageSizeChange = (event) => {
-            this.ksPageSizeChange.emit(event.detail);
-        };
-        this.el.addEventListener('pageChange', onNativePageChange);
-        this.el.addEventListener('pageSizeChange', onNativePageSizeChange);
-        inject(DestroyRef).onDestroy(() => {
-            this.el.removeEventListener('pageChange', onNativePageChange);
-            this.el.removeEventListener('pageSizeChange', onNativePageSizeChange);
-        });
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KsPaginationComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.25", type: KsPaginationComponent, isStandalone: true, selector: "ks-pagination", inputs: { total: { classPropertyName: "total", publicName: "total", isSignal: true, isRequired: false, transformFunction: null }, pageSize: { classPropertyName: "pageSize", publicName: "pageSize", isSignal: true, isRequired: false, transformFunction: null }, currentPage: { classPropertyName: "currentPage", publicName: "currentPage", isSignal: true, isRequired: false, transformFunction: null }, showPageSize: { classPropertyName: "showPageSize", publicName: "showPageSize", isSignal: true, isRequired: false, transformFunction: null }, pageSizeOptions: { classPropertyName: "pageSizeOptions", publicName: "pageSizeOptions", isSignal: true, isRequired: false, transformFunction: null }, showQuickJumper: { classPropertyName: "showQuickJumper", publicName: "showQuickJumper", isSignal: true, isRequired: false, transformFunction: null }, maxPageButtons: { classPropertyName: "maxPageButtons", publicName: "maxPageButtons", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { ksPageChange: "ksPageChange", ksPageSizeChange: "ksPageSizeChange" }, ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KsPaginationComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'ks-pagination',
-                    standalone: true,
-                    template: '',
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                }]
-        }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { total: [{ type: i0.Input, args: [{ isSignal: true, alias: "total", required: false }] }], pageSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "pageSize", required: false }] }], currentPage: [{ type: i0.Input, args: [{ isSignal: true, alias: "currentPage", required: false }] }], showPageSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "showPageSize", required: false }] }], pageSizeOptions: [{ type: i0.Input, args: [{ isSignal: true, alias: "pageSizeOptions", required: false }] }], showQuickJumper: [{ type: i0.Input, args: [{ isSignal: true, alias: "showQuickJumper", required: false }] }], maxPageButtons: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxPageButtons", required: false }] }], ksPageChange: [{ type: i0.Output, args: ["ksPageChange"] }], ksPageSizeChange: [{ type: i0.Output, args: ["ksPageSizeChange"] }] } });
-
-// Side-effect import: registers the `ks-stepper` tag — see
-// `Buttons/button/button.ts` for the full explanation of this pattern.
-/**
- * Angular wrapper around the `<ks-stepper>` Stencil custom element.
- * No `<slot>` in the wrapped Stencil render — data-driven only.
- */
-class KsStepperComponent {
-    el;
-    /** Step definitions */
-    steps = input([], ...(ngDevMode ? [{ debugName: "steps" }] : /* istanbul ignore next */ []));
-    /** Currently active step index (0-based) */
-    activeStep = input(0, ...(ngDevMode ? [{ debugName: "activeStep" }] : /* istanbul ignore next */ []));
-    /** Layout orientation */
-    orientation = input('horizontal', ...(ngDevMode ? [{ debugName: "orientation" }] : /* istanbul ignore next */ []));
-    /** Allow clicking steps to navigate */
-    clickable = input(false, ...(ngDevMode ? [{ debugName: "clickable" }] : /* istanbul ignore next */ []));
-    /** Marks completed steps */
-    completedSteps = input([], ...(ngDevMode ? [{ debugName: "completedSteps" }] : /* istanbul ignore next */ []));
-    /** Emits the new step index. From the native `stepChange` event. */
-    ksStepChange = output();
-    constructor(ref) {
-        this.el = ref.nativeElement;
-        effect(() => (this.el.steps = this.steps()));
-        effect(() => (this.el.activeStep = this.activeStep()));
-        effect(() => (this.el.orientation = this.orientation()));
-        effect(() => (this.el.clickable = this.clickable()));
-        effect(() => (this.el.completedSteps = this.completedSteps()));
-        const onNativeStepChange = (event) => {
-            this.ksStepChange.emit(event.detail);
-        };
-        this.el.addEventListener('stepChange', onNativeStepChange);
-        inject(DestroyRef).onDestroy(() => this.el.removeEventListener('stepChange', onNativeStepChange));
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KsStepperComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.25", type: KsStepperComponent, isStandalone: true, selector: "ks-stepper", inputs: { steps: { classPropertyName: "steps", publicName: "steps", isSignal: true, isRequired: false, transformFunction: null }, activeStep: { classPropertyName: "activeStep", publicName: "activeStep", isSignal: true, isRequired: false, transformFunction: null }, orientation: { classPropertyName: "orientation", publicName: "orientation", isSignal: true, isRequired: false, transformFunction: null }, clickable: { classPropertyName: "clickable", publicName: "clickable", isSignal: true, isRequired: false, transformFunction: null }, completedSteps: { classPropertyName: "completedSteps", publicName: "completedSteps", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { ksStepChange: "ksStepChange" }, ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KsStepperComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'ks-stepper',
-                    standalone: true,
-                    template: '',
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                }]
-        }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { steps: [{ type: i0.Input, args: [{ isSignal: true, alias: "steps", required: false }] }], activeStep: [{ type: i0.Input, args: [{ isSignal: true, alias: "activeStep", required: false }] }], orientation: [{ type: i0.Input, args: [{ isSignal: true, alias: "orientation", required: false }] }], clickable: [{ type: i0.Input, args: [{ isSignal: true, alias: "clickable", required: false }] }], completedSteps: [{ type: i0.Input, args: [{ isSignal: true, alias: "completedSteps", required: false }] }], ksStepChange: [{ type: i0.Output, args: ["ksStepChange"] }] } });
-
-// Side-effect import: registers the `ks-tab` tag — see
-// `Buttons/button/button.ts` for the full explanation of this pattern.
-/**
- * Angular wrapper around the `<ks-tab>` Stencil custom element.
- *
- * Same `ksPanel="key"` → named-`<slot>` strategy as
- * `Navigation/accordion/accordion.ts` (NOT the native `slot="..."`
- * attribute) — see that file's doc comment for the full explanation.
- * Usage:
- *   `<ks-tab [tabs]="tabs" activeKey="tab1">
- *      <div ksPanel="tab1">Tab 1 content</div>
- *      <div ksPanel="tab2">Tab 2 content</div>
- *    </ks-tab>`
- */
-class KsTabComponent {
-    el;
-    /** List of tab definitions */
-    tabs = input([], ...(ngDevMode ? [{ debugName: "tabs" }] : /* istanbul ignore next */ []));
-    /** Key of the initially active tab */
-    activeKey = input('', ...(ngDevMode ? [{ debugName: "activeKey" }] : /* istanbul ignore next */ []));
-    tabHeaderStyle = input('default', ...(ngDevMode ? [{ debugName: "tabHeaderStyle" }] : /* istanbul ignore next */ []));
-    /** Emits the key of the newly selected tab. From the native `tabChange` event. */
-    ksTabChange = output();
-    constructor(ref) {
-        this.el = ref.nativeElement;
-        effect(() => (this.el.tabs = this.tabs()));
-        effect(() => (this.el.activeKey = this.activeKey()));
-        effect(() => (this.el.tabHeaderStyle = this.tabHeaderStyle()));
-        const onNativeTabChange = (event) => {
-            this.ksTabChange.emit(event.detail);
-        };
-        this.el.addEventListener('tabChange', onNativeTabChange);
-        inject(DestroyRef).onDestroy(() => this.el.removeEventListener('tabChange', onNativeTabChange));
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KsTabComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.25", type: KsTabComponent, isStandalone: true, selector: "ks-tab", inputs: { tabs: { classPropertyName: "tabs", publicName: "tabs", isSignal: true, isRequired: false, transformFunction: null }, activeKey: { classPropertyName: "activeKey", publicName: "activeKey", isSignal: true, isRequired: false, transformFunction: null }, tabHeaderStyle: { classPropertyName: "tabHeaderStyle", publicName: "tabHeaderStyle", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { ksTabChange: "ksTabChange" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KsTabComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'ks-tab',
-                    standalone: true,
-                    template: '<ng-content></ng-content>',
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                }]
-        }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { tabs: [{ type: i0.Input, args: [{ isSignal: true, alias: "tabs", required: false }] }], activeKey: [{ type: i0.Input, args: [{ isSignal: true, alias: "activeKey", required: false }] }], tabHeaderStyle: [{ type: i0.Input, args: [{ isSignal: true, alias: "tabHeaderStyle", required: false }] }], ksTabChange: [{ type: i0.Output, args: ["ksTabChange"] }] } });
-
-// Side-effect import: registers the `ks-toolbar` tag — see
-// `Buttons/button/button.ts` for the full explanation of this pattern.
-/**
- * Angular wrapper around the `<ks-toolbar>` Stencil custom element.
- * Renders a real, consumer-facing default `<slot />` for extra trailing
- * content — same single unfiltered `<ng-content>` pass-through as
- * `Layout/card/card.ts`.
- */
-class KsToolbarComponent {
-    el;
-    /** Toolbar items */
-    items = input([], ...(ngDevMode ? [{ debugName: "items" }] : /* istanbul ignore next */ []));
-    /** Emits the clicked item key. From the native `itemClicked` event. */
-    ksItemClicked = output();
-    constructor(ref) {
-        this.el = ref.nativeElement;
-        effect(() => (this.el.items = this.items()));
-        const onNativeItemClicked = (event) => {
-            this.ksItemClicked.emit(event.detail);
-        };
-        this.el.addEventListener('itemClicked', onNativeItemClicked);
-        inject(DestroyRef).onDestroy(() => this.el.removeEventListener('itemClicked', onNativeItemClicked));
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KsToolbarComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.25", type: KsToolbarComponent, isStandalone: true, selector: "ks-toolbar", inputs: { items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { ksItemClicked: "ksItemClicked" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KsToolbarComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'ks-toolbar',
-                    standalone: true,
-                    template: '<ng-content></ng-content>',
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                }]
-        }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { items: [{ type: i0.Input, args: [{ isSignal: true, alias: "items", required: false }] }], ksItemClicked: [{ type: i0.Output, args: ["ksItemClicked"] }] } });
-
-// Side-effect import: registers the `ks-top-nav-bar` tag — see
-// `Buttons/button/button.ts` for the full explanation of this pattern.
-/**
- * Angular wrapper around the `<ks-top-nav-bar>` Stencil custom element.
- * Renders a real, consumer-facing default `<slot />` — same single
- * unfiltered `<ng-content>` pass-through as `Layout/card/card.ts`.
- */
-class KsTopNavBarComponent {
-    el;
-    /** Navigation items */
-    items = input([], ...(ngDevMode ? [{ debugName: "items" }] : /* istanbul ignore next */ []));
-    /** Visual style of the active indicator */
-    variant = input('default', ...(ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []));
-    /** Show icon alongside label */
-    showIcons = input(true, ...(ngDevMode ? [{ debugName: "showIcons" }] : /* istanbul ignore next */ []));
-    /** Show label text */
-    showLabels = input(true, ...(ngDevMode ? [{ debugName: "showLabels" }] : /* istanbul ignore next */ []));
-    /** Aria label for the nav element */
-    label = input('Top navigation', ...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
-    constructor(ref) {
-        this.el = ref.nativeElement;
-        effect(() => (this.el.items = this.items()));
-        effect(() => (this.el.variant = this.variant()));
-        effect(() => (this.el.showIcons = this.showIcons()));
-        effect(() => (this.el.showLabels = this.showLabels()));
-        effect(() => (this.el.label = this.label()));
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KsTopNavBarComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.25", type: KsTopNavBarComponent, isStandalone: true, selector: "ks-top-nav-bar", inputs: { items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, showIcons: { classPropertyName: "showIcons", publicName: "showIcons", isSignal: true, isRequired: false, transformFunction: null }, showLabels: { classPropertyName: "showLabels", publicName: "showLabels", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KsTopNavBarComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'ks-top-nav-bar',
-                    standalone: true,
-                    template: '<ng-content></ng-content>',
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                }]
-        }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { items: [{ type: i0.Input, args: [{ isSignal: true, alias: "items", required: false }] }], variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], showIcons: [{ type: i0.Input, args: [{ isSignal: true, alias: "showIcons", required: false }] }], showLabels: [{ type: i0.Input, args: [{ isSignal: true, alias: "showLabels", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }] } });
-
-// Side-effect import: registers the `ks-tree-view` tag — see
-// `Buttons/button/button.ts` for the full explanation of this pattern.
-/**
- * Angular wrapper around the `<ks-tree-view>` Stencil custom element.
- * No `<slot>` in the wrapped Stencil render — data-driven only.
- */
-class KsTreeViewComponent {
-    el;
-    /** Tree data */
-    nodes = input([], ...(ngDevMode ? [{ debugName: "nodes" }] : /* istanbul ignore next */ []));
-    /** Keys of nodes that start expanded */
-    expandedKeys = input([], ...(ngDevMode ? [{ debugName: "expandedKeys" }] : /* istanbul ignore next */ []));
-    /** Allow selecting multiple nodes */
-    multi = input(false, ...(ngDevMode ? [{ debugName: "multi" }] : /* istanbul ignore next */ []));
-    /** Emits key(s) when selection changes. From the native `selectionChanged` event. */
-    ksSelectionChanged = output();
-    /** Emits when a node is expanded/collapsed. From the native `expandChange` event. */
-    ksExpandChange = output();
-    constructor(ref) {
-        this.el = ref.nativeElement;
-        effect(() => (this.el.nodes = this.nodes()));
-        effect(() => (this.el.expandedKeys = this.expandedKeys()));
-        effect(() => (this.el.multi = this.multi()));
-        const onNativeSelectionChanged = (event) => {
-            this.ksSelectionChanged.emit(event.detail);
-        };
-        const onNativeExpandChange = (event) => {
-            this.ksExpandChange.emit(event.detail);
-        };
-        this.el.addEventListener('selectionChanged', onNativeSelectionChanged);
-        this.el.addEventListener('expandChange', onNativeExpandChange);
-        inject(DestroyRef).onDestroy(() => {
-            this.el.removeEventListener('selectionChanged', onNativeSelectionChanged);
-            this.el.removeEventListener('expandChange', onNativeExpandChange);
-        });
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KsTreeViewComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.25", type: KsTreeViewComponent, isStandalone: true, selector: "ks-tree-view", inputs: { nodes: { classPropertyName: "nodes", publicName: "nodes", isSignal: true, isRequired: false, transformFunction: null }, expandedKeys: { classPropertyName: "expandedKeys", publicName: "expandedKeys", isSignal: true, isRequired: false, transformFunction: null }, multi: { classPropertyName: "multi", publicName: "multi", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { ksSelectionChanged: "ksSelectionChanged", ksExpandChange: "ksExpandChange" }, ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KsTreeViewComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'ks-tree-view',
-                    standalone: true,
-                    template: '',
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                }]
-        }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { nodes: [{ type: i0.Input, args: [{ isSignal: true, alias: "nodes", required: false }] }], expandedKeys: [{ type: i0.Input, args: [{ isSignal: true, alias: "expandedKeys", required: false }] }], multi: [{ type: i0.Input, args: [{ isSignal: true, alias: "multi", required: false }] }], ksSelectionChanged: [{ type: i0.Output, args: ["ksSelectionChanged"] }], ksExpandChange: [{ type: i0.Output, args: ["ksExpandChange"] }] } });
-
-// Side-effect import: registers the `ks-badge` tag — see
-// `Buttons/button/button.ts` for the full explanation of this pattern.
-/**
- * Angular wrapper around the `<ks-badge>` Stencil custom element.
- * Purely presentational — no events, no `<slot>` in the wrapped Stencil
- * render, plain inputs only.
- */
-class KsBadgeComponent {
-    el;
-    /** Display text */
-    label = input('', ...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
-    /** Colour variant */
-    variant = input('brand', ...(ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []));
-    /** Size */
-    size = input('md', ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
-    /** Show a dot instead of text */
-    dot = input(false, ...(ngDevMode ? [{ debugName: "dot" }] : /* istanbul ignore next */ []));
-    /** Pill (fully rounded) shape */
-    pill = input(true, ...(ngDevMode ? [{ debugName: "pill" }] : /* istanbul ignore next */ []));
-    constructor(ref) {
-        this.el = ref.nativeElement;
-        effect(() => (this.el.label = this.label()));
-        effect(() => (this.el.variant = this.variant()));
-        effect(() => (this.el.size = this.size()));
-        effect(() => (this.el.dot = this.dot()));
-        effect(() => (this.el.pill = this.pill()));
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KsBadgeComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.25", type: KsBadgeComponent, isStandalone: true, selector: "ks-badge", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, dot: { classPropertyName: "dot", publicName: "dot", isSignal: true, isRequired: false, transformFunction: null }, pill: { classPropertyName: "pill", publicName: "pill", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KsBadgeComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'ks-badge',
-                    standalone: true,
-                    template: '',
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                }]
-        }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], dot: [{ type: i0.Input, args: [{ isSignal: true, alias: "dot", required: false }] }], pill: [{ type: i0.Input, args: [{ isSignal: true, alias: "pill", required: false }] }] } });
-
-// Side-effect import: registers the `ks-loader` tag — see
-// `Buttons/button/button.ts` for the full explanation of this pattern.
-/**
- * Angular wrapper around the `<ks-loader>` Stencil custom element.
- *
- * Renders real, consumer-facing named slots — `loading`, `empty`,
- * `empty-action`, `error`, `error-action` — plus a default (unnamed)
- * slot for the `Success` state. Same single unfiltered
- * `<ng-content>` pass-through as `Layout/card/card.ts`: give each
- * projected child its own native `slot="loading"` / `slot="empty"` /
- * `slot="empty-action"` / `slot="error"` / `slot="error-action"`
- * attribute (or none, for the default/success slot).
- */
-class KsLoaderComponent {
-    el;
-    /** Current state */
-    state = input(LoaderStateEnum.Loading, ...(ngDevMode ? [{ debugName: "state" }] : /* istanbul ignore next */ []));
-    constructor(ref) {
-        this.el = ref.nativeElement;
-        effect(() => (this.el.state = this.state()));
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KsLoaderComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.25", type: KsLoaderComponent, isStandalone: true, selector: "ks-loader", inputs: { state: { classPropertyName: "state", publicName: "state", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KsLoaderComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'ks-loader',
-                    standalone: true,
-                    template: '<ng-content></ng-content>',
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                }]
-        }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { state: [{ type: i0.Input, args: [{ isSignal: true, alias: "state", required: false }] }] } });
-
-// Side-effect import: registers the `ks-message` tag — see
-// `Buttons/button/button.ts` for the full explanation of this pattern.
-/**
- * Angular wrapper around the `<ks-message>` Stencil custom element.
- *
- * `<ks-message>` renders a default `<slot />` only as a fallback when
- * `text` is empty — same single unfiltered `<ng-content>` pass-through as
- * `Layout/card/card.ts`; omit `text` and project content instead if
- * richer markup is needed.
- */
-class KsMessageComponent {
-    el;
-    /** Main message text */
-    text = input('', ...(ngDevMode ? [{ debugName: "text" }] : /* istanbul ignore next */ []));
-    /** Optional icon class (e.g. Material Icon or Font Awesome) */
-    icon = input('', ...(ngDevMode ? [{ debugName: "icon" }] : /* istanbul ignore next */ []));
-    /** Colour variant */
-    variant = input('info', ...(ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []));
-    /** Show a dismiss (×) button */
-    dismissible = input(false, ...(ngDevMode ? [{ debugName: "dismissible" }] : /* istanbul ignore next */ []));
-    /** Emits when the message is dismissed. From the native `dismissed` event. */
-    ksDismissed = output();
-    constructor(ref) {
-        this.el = ref.nativeElement;
-        effect(() => (this.el.text = this.text()));
-        effect(() => (this.el.icon = this.icon()));
-        effect(() => (this.el.variant = this.variant()));
-        effect(() => (this.el.dismissible = this.dismissible()));
-        const onNativeDismissed = () => this.ksDismissed.emit();
-        this.el.addEventListener('dismissed', onNativeDismissed);
-        inject(DestroyRef).onDestroy(() => this.el.removeEventListener('dismissed', onNativeDismissed));
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KsMessageComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.25", type: KsMessageComponent, isStandalone: true, selector: "ks-message", inputs: { text: { classPropertyName: "text", publicName: "text", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, dismissible: { classPropertyName: "dismissible", publicName: "dismissible", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { ksDismissed: "ksDismissed" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KsMessageComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'ks-message',
-                    standalone: true,
-                    template: '<ng-content></ng-content>',
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                }]
-        }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { text: [{ type: i0.Input, args: [{ isSignal: true, alias: "text", required: false }] }], icon: [{ type: i0.Input, args: [{ isSignal: true, alias: "icon", required: false }] }], variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], dismissible: [{ type: i0.Input, args: [{ isSignal: true, alias: "dismissible", required: false }] }], ksDismissed: [{ type: i0.Output, args: ["ksDismissed"] }] } });
-
-// Side-effect import: registers the `ks-progress` tag — see
-// `Buttons/button/button.ts` for the full explanation of this pattern.
-/**
- * Angular wrapper around the `<ks-progress>` Stencil custom element.
- * Purely presentational — no events, no `<slot>` in the wrapped Stencil
- * render, plain inputs only.
- */
-class KsProgressComponent {
-    el;
-    /** Progress value (0-100) */
-    value = input(0, ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
-    /** Maximum value */
-    max = input(100, ...(ngDevMode ? [{ debugName: "max" }] : /* istanbul ignore next */ []));
-    /** Show percentage label */
-    showLabel = input(false, ...(ngDevMode ? [{ debugName: "showLabel" }] : /* istanbul ignore next */ []));
-    /** Progress variant */
-    variant = input('brand', ...(ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []));
-    /** Progress size */
-    size = input('md', ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
-    /** Indeterminate/loading state */
-    indeterminate = input(false, ...(ngDevMode ? [{ debugName: "indeterminate" }] : /* istanbul ignore next */ []));
-    /** Optional label text */
-    label = input('', ...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
-    constructor(ref) {
-        this.el = ref.nativeElement;
-        effect(() => (this.el.value = this.value()));
-        effect(() => (this.el.max = this.max()));
-        effect(() => (this.el.showLabel = this.showLabel()));
-        effect(() => (this.el.variant = this.variant()));
-        effect(() => (this.el.size = this.size()));
-        effect(() => (this.el.indeterminate = this.indeterminate()));
-        effect(() => (this.el.label = this.label()));
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KsProgressComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.25", type: KsProgressComponent, isStandalone: true, selector: "ks-progress", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, max: { classPropertyName: "max", publicName: "max", isSignal: true, isRequired: false, transformFunction: null }, showLabel: { classPropertyName: "showLabel", publicName: "showLabel", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, indeterminate: { classPropertyName: "indeterminate", publicName: "indeterminate", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KsProgressComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'ks-progress',
-                    standalone: true,
-                    template: '',
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                }]
-        }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], max: [{ type: i0.Input, args: [{ isSignal: true, alias: "max", required: false }] }], showLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "showLabel", required: false }] }], variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], indeterminate: [{ type: i0.Input, args: [{ isSignal: true, alias: "indeterminate", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }] } });
-
-// Side-effect import: registers the `ks-spinner` tag — see
-// `Buttons/button/button.ts` for the full explanation of this pattern.
-/**
- * Angular wrapper around the `<ks-spinner>` Stencil custom element.
- * Purely presentational — no events, no `<slot>` in the wrapped Stencil
- * render, plain inputs only.
- */
-class KsSpinnerComponent {
-    el;
-    /** Spinner size */
-    size = input('md', ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
-    /** Spinner variant/color */
-    variant = input('brand', ...(ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []));
-    /** Optional text to display */
-    text = input('', ...(ngDevMode ? [{ debugName: "text" }] : /* istanbul ignore next */ []));
-    /** Center the spinner in container */
-    centered = input(false, ...(ngDevMode ? [{ debugName: "centered" }] : /* istanbul ignore next */ []));
-    constructor(ref) {
-        this.el = ref.nativeElement;
-        effect(() => (this.el.size = this.size()));
-        effect(() => (this.el.variant = this.variant()));
-        effect(() => (this.el.text = this.text()));
-        effect(() => (this.el.centered = this.centered()));
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KsSpinnerComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.25", type: KsSpinnerComponent, isStandalone: true, selector: "ks-spinner", inputs: { size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, text: { classPropertyName: "text", publicName: "text", isSignal: true, isRequired: false, transformFunction: null }, centered: { classPropertyName: "centered", publicName: "centered", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KsSpinnerComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'ks-spinner',
-                    standalone: true,
-                    template: '',
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                }]
-        }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], text: [{ type: i0.Input, args: [{ isSignal: true, alias: "text", required: false }] }], centered: [{ type: i0.Input, args: [{ isSignal: true, alias: "centered", required: false }] }] } });
-
-// Side-effect import: registers the `ks-toast-outlet` tag — see
-// `Buttons/button/button.ts` for the full explanation of this pattern.
-/**
- * Angular wrapper around the `<ks-toast-outlet>` Stencil custom element.
- * Named `KsToastOutletComponent` (matching the literal tag, not just
- * `KsToastComponent`) for consistency with the React wrapper, which must
- * avoid colliding with the re-exported `KsToast` *data* interface above
- * (TypeScript disallows a value and a type export sharing one identifier
- * from the same module) — see `react/src/components/Notification/toast/toast.tsx`.
- * `<ks-toast-outlet position="top-right" />` is all a consumer needs; add
- * one per screen corner they want to stack toasts in.
- *
- * No `<slot>`, no events — it purely subscribes to the shared
- * `toastStore` singleton (re-exported above) and renders whatever's
- * enqueued.
- */
-class KsToastOutletComponent {
-    el;
-    /** Where on screen to stack toasts */
-    position = input('top-right', ...(ngDevMode ? [{ debugName: "position" }] : /* istanbul ignore next */ []));
-    constructor(ref) {
-        this.el = ref.nativeElement;
-        effect(() => (this.el.position = this.position()));
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KsToastOutletComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.25", type: KsToastOutletComponent, isStandalone: true, selector: "ks-toast-outlet", inputs: { position: { classPropertyName: "position", publicName: "position", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: KsToastOutletComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'ks-toast-outlet',
-                    standalone: true,
-                    template: '',
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                }]
-        }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { position: [{ type: i0.Input, args: [{ isSignal: true, alias: "position", required: false }] }] } });
-
-/**
- * Public API surface of `@ks/wc-angular`.
- */
-/* ================= Buttons ================= */
-
-/**
- * Generated bundle index. Do not edit.
- */
-
-export { KsAccordionComponent, KsAvatarComponent, KsBadgeComponent, KsBreadcrumbComponent, KsButtonComponent, KsButtonGroupComponent, KsCardComponent, KsCarouselComponent, KsCheckboxComponent, KsChipsComponent, KsCodeViewComponent, KsColourPickerComponent, KsContextMenuComponent, KsDatepickerComponent, KsDaterangeComponent, KsDialogComponent, KsDropdownComponent, KsFabComponent, KsInputComponent, KsListBoxComponent, KsLoaderComponent, KsMessageComponent, KsNavBarComponent, KsNotFoundComponent, KsOtpInputComponent, KsPaginationComponent, KsProgressComponent, KsRadioComponent, KsRatingComponent, KsSidebarComponent, KsSliderComponent, KsSpinnerComponent, KsStepperComponent, KsSwitchComponent, KsTabComponent, KsTableComponent, KsTextareaComponent, KsThemeSwitchComponent, KsTimepickerComponent, KsToastOutletComponent, KsToolbarComponent, KsTooltipComponent, KsTopNavBarComponent, KsTreeViewComponent, KsUploaderComponent };
-//# sourceMappingURL=kraft.stitch-angular.mjs.map