@ngneers/controls 0.0.1-next.1 → 0.0.1-next.2

package/fesm2022/ngneers-controls-stepper.mjs

@@ -0,0 +1,142 @@
+import * as i0 from '@angular/core';
+import { input, booleanAttribute, model, contentChild, Component, contentChildren, viewChildren, computed, effect } from '@angular/core';
+import { NgnBase, provideSelf, NgnPt } from '@ngneers/controls/base';
+import { NgnDefer } from '@ngneers/controls/defer';
+import { NgnIcon } from '@ngneers/controls/icon';
+import { NgnRovingItem, NgnRovingGroup } from '@ngneers/controls/roving-focus';
+import { stepperControlTemplate } from '@ngneers/controls-themes/templates/stepper';
+
+/**
+ * A single step within an `ngn-stepper`. Declares the step's header metadata and
+ * projects its content via `<ng-template #content>`.
+ * @category control
+ */
+class NgnStep extends NgnBase {
+    theme = null;
+    /** The step's header label. */
+    label = input('', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
+    /** Custom marker icon; when unset the 1-based step number is shown. */
+    iconStep = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "iconStep" }] : /* istanbul ignore next */ []));
+    /** Marks the step optional (shown as a hint; skippable in linear mode). @default false */
+    optional = input(false, { ...(ngDevMode ? { debugName: "optional" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    /** Disables navigation to this step. @default false */
+    disabled = input(false, { ...(ngDevMode ? { debugName: "disabled" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    /** Renders the step's marker in an error state. @default false */
+    error = input(false, { ...(ngDevMode ? { debugName: "error" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    /**
+     * Whether the step is complete. The app sets this; in linear mode it gates
+     * forward navigation past this step. @default false
+     */
+    completed = model(false, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "completed" }] : /* istanbul ignore next */ []));
+    content = contentChild('content', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "content" }] : /* istanbul ignore next */ []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: NgnStep, deps: null, target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "22.0.5", type: NgnStep, isStandalone: true, selector: "ngn-step", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, iconStep: { classPropertyName: "iconStep", publicName: "iconStep", isSignal: true, isRequired: false, transformFunction: null }, optional: { classPropertyName: "optional", publicName: "optional", 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 }, completed: { classPropertyName: "completed", publicName: "completed", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { completed: "completedChange" }, providers: [provideSelf(NgnStep)], queries: [{ propertyName: "content", first: true, predicate: ["content"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: '', isInline: true });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: NgnStep, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'ngn-step',
+                    template: '',
+                    providers: [provideSelf(NgnStep)],
+                }]
+        }], propDecorators: { label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], iconStep: [{ type: i0.Input, args: [{ isSignal: true, alias: "iconStep", required: false }] }], optional: [{ type: i0.Input, args: [{ isSignal: true, alias: "optional", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], error: [{ type: i0.Input, args: [{ isSignal: true, alias: "error", required: false }] }], completed: [{ type: i0.Input, args: [{ isSignal: true, alias: "completed", required: false }] }, { type: i0.Output, args: ["completedChange"] }], content: [{ type: i0.ContentChild, args: ['content', { isSignal: true }] }] } });
+
+/**
+ * @category control
+ */
+class NgnStepper extends NgnBase {
+    theme = this.injectThemeTemplate(stepperControlTemplate, 'root');
+    steps = contentChildren(NgnStep, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "steps" }] : /* istanbul ignore next */ []));
+    /** The header buttons' roving items, in step order (one per step; connectors are plain spans). */
+    _rovingItems = viewChildren(NgnRovingItem, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "_rovingItems" }] : /* istanbul ignore next */ []));
+    /** The active step index (zero-based). @default 0 */
+    active = model(0, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "active" }] : /* istanbul ignore next */ []));
+    /** Gate forward navigation on prior steps being `completed`. @default false */
+    linear = input(false, { ...(ngDevMode ? { debugName: "linear" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    /** Lazily render step content (forwarded to `ngn-defer`). @default true */
+    lazy = input(true, { ...(ngDevMode ? { debugName: "lazy" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    /** Keep opened step content in the DOM to preserve state (forwarded to `ngn-defer`). @default true */
+    cache = input(true, { ...(ngDevMode ? { debugName: "cache" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    /**
+     * Index of the first step that is not yet completed (the furthest reachable in linear mode).
+     * Optional steps are exempt — an incomplete optional step never blocks forward progress.
+     */
+    _firstIncomplete = computed(() => {
+        const steps = this.steps();
+        const idx = steps.findIndex(s => !s.completed() && !s.optional());
+        return idx === -1 ? steps.length - 1 : idx;
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "_firstIncomplete" }] : /* istanbul ignore next */ []));
+    constructor() {
+        super();
+        // Clamp active into range when steps change.
+        effect(() => {
+            const n = this.steps().length;
+            if (n === 0) {
+                return;
+            }
+            const a = this.active();
+            if (a > n - 1) {
+                this.active.set(n - 1);
+            }
+            else if (a < 0) {
+                this.active.set(0);
+            }
+        });
+        // Keep each header's roving item in sync with its step's NATIVE `disabled` input (not
+        // `canGoTo()` gating) — a merely gated step stays arrow-focusable, only a truly disabled
+        // step is skipped by keyboard navigation. Mirrors NgnButtonGroup's roving-disabled sync.
+        effect(() => {
+            const items = this._rovingItems();
+            const steps = this.steps();
+            items.forEach((item, i) => item.disabled.set(!!steps[i]?.disabled()));
+        });
+    }
+    /** Whether navigation to `index` is currently permitted. */
+    canGoTo(index) {
+        const steps = this.steps();
+        const step = steps[index];
+        if (!step || step.disabled()) {
+            return false;
+        }
+        if (!this.linear()) {
+            return true;
+        }
+        // Linear: can go backward freely, or forward up to the first incomplete step.
+        return index <= Math.max(this.active(), this._firstIncomplete());
+    }
+    goTo(index) {
+        if (this.canGoTo(index)) {
+            this.active.set(index);
+        }
+    }
+    next() {
+        this.goTo(this.active() + 1);
+    }
+    previous() {
+        this.goTo(this.active() - 1);
+    }
+    onHeaderActivate(index) {
+        this.goTo(index);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: NgnStepper, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: NgnStepper, isStandalone: true, selector: "ngn-stepper", inputs: { active: { classPropertyName: "active", publicName: "active", isSignal: true, isRequired: false, transformFunction: null }, linear: { classPropertyName: "linear", publicName: "linear", isSignal: true, isRequired: false, transformFunction: null }, lazy: { classPropertyName: "lazy", publicName: "lazy", isSignal: true, isRequired: false, transformFunction: null }, cache: { classPropertyName: "cache", publicName: "cache", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { active: "activeChange" }, providers: [provideSelf(NgnStepper)], queries: [{ propertyName: "steps", predicate: NgnStep, isSignal: true }], viewQueries: [{ propertyName: "_rovingItems", predicate: NgnRovingItem, descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<div ngnRovingGroup [ptInt]=\"this\" [ptClass]=\"'header'\" role=\"tablist\">\n  @for (step of steps(); track $index; let i = $index; let last = $last) {\n    <button\n      type=\"button\"\n      ngnRovingItem\n      role=\"tab\"\n      [attr.aria-selected]=\"i === active()\"\n      [attr.aria-disabled]=\"!canGoTo(i) ? 'true' : null\"\n      [disabled]=\"step.disabled()\"\n      [ptInt]=\"this\"\n      [ptClass]=\"{\n        step: true,\n        active: i === active(),\n        completed: !!step.completed(),\n        error: !!step.error(),\n        disabled: step.disabled() || !canGoTo(i),\n      }\"\n      (click)=\"onHeaderActivate(i)\"\n    >\n      <span [ptInt]=\"this\" [ptClass]=\"'marker'\">\n        @if (step.iconStep(); as icon) {\n          <ngn-icon [ptInt]=\"this\" [ptClass]=\"'marker-icon'\" [icon]=\"icon\" />\n        } @else if (step.completed() && i !== active()) {\n          <ngn-icon [ptInt]=\"this\" [ptClass]=\"'marker-icon'\" [defaultIcon]=\"'stepper-completed'\" />\n        } @else {\n          <span [ptInt]=\"this\" [ptClass]=\"'marker-index'\">{{ i + 1 }}</span>\n        }\n      </span>\n      <span [ptInt]=\"this\" [ptClass]=\"'label'\">\n        {{ step.label() }}\n        @if (step.optional()) {\n          <span [ptInt]=\"this\" [ptClass]=\"'optional'\">(optional)</span>\n        }\n      </span>\n    </button>\n    @if (!last) {\n      <span [ptInt]=\"this\" [ptClass]=\"'connector'\"></span>\n    }\n  }\n</div>\n\n@for (step of steps(); track $index; let i = $index) {\n  <div\n    role=\"tabpanel\"\n    [ptInt]=\"this\"\n    [ptClass]=\"{ content: i === active() }\"\n    [hidden]=\"i !== active()\"\n  >\n    <ngn-defer\n      [lazyContent]=\"step.content()\"\n      [open]=\"i === active()\"\n      [lazy]=\"lazy()\"\n      [cache]=\"cache()\"\n    />\n  </div>\n}\n", dependencies: [{ kind: "directive", type: NgnPt, selector: "[ptInt]", inputs: ["ptInt", "ptClass", "ptDep"] }, { kind: "component", type: NgnDefer, selector: "ngn-defer", inputs: ["lazyContent", "lazyContentContext", "open", "lazy", "cache", "hiddenOnClosed"] }, { kind: "component", type: NgnIcon, selector: "ngn-icon", inputs: ["defaultIcon", "icon"] }, { kind: "directive", type: NgnRovingGroup, selector: "[ngnRovingGroup]", inputs: ["orientation", "rovingMode", "rovingWrap"], outputs: ["activeItemChange"], exportAs: ["ngnRovingGroup"] }, { kind: "directive", type: NgnRovingItem, selector: "[ngnRovingItem]", inputs: ["ngnRovingItem"], exportAs: ["ngnRovingItem"] }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: NgnStepper, decorators: [{
+            type: Component,
+            args: [{ selector: 'ngn-stepper', imports: [NgnPt, NgnDefer, NgnIcon, NgnRovingGroup, NgnRovingItem], providers: [provideSelf(NgnStepper)], template: "<div ngnRovingGroup [ptInt]=\"this\" [ptClass]=\"'header'\" role=\"tablist\">\n  @for (step of steps(); track $index; let i = $index; let last = $last) {\n    <button\n      type=\"button\"\n      ngnRovingItem\n      role=\"tab\"\n      [attr.aria-selected]=\"i === active()\"\n      [attr.aria-disabled]=\"!canGoTo(i) ? 'true' : null\"\n      [disabled]=\"step.disabled()\"\n      [ptInt]=\"this\"\n      [ptClass]=\"{\n        step: true,\n        active: i === active(),\n        completed: !!step.completed(),\n        error: !!step.error(),\n        disabled: step.disabled() || !canGoTo(i),\n      }\"\n      (click)=\"onHeaderActivate(i)\"\n    >\n      <span [ptInt]=\"this\" [ptClass]=\"'marker'\">\n        @if (step.iconStep(); as icon) {\n          <ngn-icon [ptInt]=\"this\" [ptClass]=\"'marker-icon'\" [icon]=\"icon\" />\n        } @else if (step.completed() && i !== active()) {\n          <ngn-icon [ptInt]=\"this\" [ptClass]=\"'marker-icon'\" [defaultIcon]=\"'stepper-completed'\" />\n        } @else {\n          <span [ptInt]=\"this\" [ptClass]=\"'marker-index'\">{{ i + 1 }}</span>\n        }\n      </span>\n      <span [ptInt]=\"this\" [ptClass]=\"'label'\">\n        {{ step.label() }}\n        @if (step.optional()) {\n          <span [ptInt]=\"this\" [ptClass]=\"'optional'\">(optional)</span>\n        }\n      </span>\n    </button>\n    @if (!last) {\n      <span [ptInt]=\"this\" [ptClass]=\"'connector'\"></span>\n    }\n  }\n</div>\n\n@for (step of steps(); track $index; let i = $index) {\n  <div\n    role=\"tabpanel\"\n    [ptInt]=\"this\"\n    [ptClass]=\"{ content: i === active() }\"\n    [hidden]=\"i !== active()\"\n  >\n    <ngn-defer\n      [lazyContent]=\"step.content()\"\n      [open]=\"i === active()\"\n      [lazy]=\"lazy()\"\n      [cache]=\"cache()\"\n    />\n  </div>\n}\n" }]
+        }], ctorParameters: () => [], propDecorators: { steps: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => NgnStep), { isSignal: true }] }], _rovingItems: [{ type: i0.ViewChildren, args: [i0.forwardRef(() => NgnRovingItem), { isSignal: true }] }], active: [{ type: i0.Input, args: [{ isSignal: true, alias: "active", required: false }] }, { type: i0.Output, args: ["activeChange"] }], linear: [{ type: i0.Input, args: [{ isSignal: true, alias: "linear", required: false }] }], lazy: [{ type: i0.Input, args: [{ isSignal: true, alias: "lazy", required: false }] }], cache: [{ type: i0.Input, args: [{ isSignal: true, alias: "cache", required: false }] }] } });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { NgnStep, NgnStepper };
+//# sourceMappingURL=ngneers-controls-stepper.mjs.map

package/fesm2022/ngneers-controls-stepper.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ngneers-controls-stepper.mjs","sources":["../../src/stepper/step.ts","../../src/stepper/stepper.ts","../../src/stepper/stepper.html","../../src/stepper/ngneers-controls-stepper.ts"],"sourcesContent":["import {\n  booleanAttribute,\n  Component,\n  contentChild,\n  input,\n  model,\n  TemplateRef,\n} from '@angular/core';\nimport { NgnBase, provideSelf } from '@ngneers/controls/base';\n\nimport type { IconType } from '@ngneers/controls-custom-types';\n\n/**\n * A single step within an `ngn-stepper`. Declares the step's header metadata and\n * projects its content via `<ng-template #content>`.\n * @category control\n */\n@Component({\n  selector: 'ngn-step',\n  template: '',\n  providers: [provideSelf(NgnStep)],\n})\nexport class NgnStep extends NgnBase<'stepper'> {\n  protected readonly theme = null;\n\n  /** The step's header label. */\n  public readonly label = input<string>('');\n  /** Custom marker icon; when unset the 1-based step number is shown. */\n  public readonly iconStep = input<IconType>();\n  /** Marks the step optional (shown as a hint; skippable in linear mode). @default false */\n  public readonly optional = input(false, { transform: booleanAttribute });\n  /** Disables navigation to this step. @default false */\n  public readonly disabled = input(false, { transform: booleanAttribute });\n  /** Renders the step's marker in an error state. @default false */\n  public readonly error = input(false, { transform: booleanAttribute });\n  /**\n   * Whether the step is complete. The app sets this; in linear mode it gates\n   * forward navigation past this step. @default false\n   */\n  public readonly completed = model(false);\n\n  public readonly content = contentChild<TemplateRef<unknown>>('content');\n}\n","import {\n  booleanAttribute,\n  Component,\n  computed,\n  contentChildren,\n  effect,\n  input,\n  model,\n  viewChildren,\n} from '@angular/core';\nimport { NgnBase, NgnPt, provideSelf } from '@ngneers/controls/base';\nimport { NgnDefer } from '@ngneers/controls/defer';\nimport { NgnIcon } from '@ngneers/controls/icon';\nimport { NgnRovingGroup, NgnRovingItem } from '@ngneers/controls/roving-focus';\nimport { stepperControlTemplate } from '@ngneers/controls-themes/templates/stepper';\n\nimport { NgnStep } from './step';\n\n/**\n * @category control\n */\n@Component({\n  selector: 'ngn-stepper',\n  templateUrl: './stepper.html',\n  imports: [NgnPt, NgnDefer, NgnIcon, NgnRovingGroup, NgnRovingItem],\n  providers: [provideSelf(NgnStepper)],\n})\nexport class NgnStepper extends NgnBase<'stepper'> {\n  protected readonly theme = this.injectThemeTemplate(stepperControlTemplate, 'root');\n\n  protected readonly steps = contentChildren(NgnStep);\n\n  /** The header buttons' roving items, in step order (one per step; connectors are plain spans). */\n  private readonly _rovingItems = viewChildren(NgnRovingItem);\n\n  /** The active step index (zero-based). @default 0 */\n  public readonly active = model<number>(0);\n  /** Gate forward navigation on prior steps being `completed`. @default false */\n  public readonly linear = input(false, { transform: booleanAttribute });\n  /** Lazily render step content (forwarded to `ngn-defer`). @default true */\n  public readonly lazy = input(true, { transform: booleanAttribute });\n  /** Keep opened step content in the DOM to preserve state (forwarded to `ngn-defer`). @default true */\n  public readonly cache = input(true, { transform: booleanAttribute });\n\n  /**\n   * Index of the first step that is not yet completed (the furthest reachable in linear mode).\n   * Optional steps are exempt — an incomplete optional step never blocks forward progress.\n   */\n  private readonly _firstIncomplete = computed(() => {\n    const steps = this.steps();\n    const idx = steps.findIndex(s => !s.completed() && !s.optional());\n    return idx === -1 ? steps.length - 1 : idx;\n  });\n\n  constructor() {\n    super();\n    // Clamp active into range when steps change.\n    effect(() => {\n      const n = this.steps().length;\n      if (n === 0) {\n        return;\n      }\n      const a = this.active();\n      if (a > n - 1) {\n        this.active.set(n - 1);\n      } else if (a < 0) {\n        this.active.set(0);\n      }\n    });\n\n    // Keep each header's roving item in sync with its step's NATIVE `disabled` input (not\n    // `canGoTo()` gating) — a merely gated step stays arrow-focusable, only a truly disabled\n    // step is skipped by keyboard navigation. Mirrors NgnButtonGroup's roving-disabled sync.\n    effect(() => {\n      const items = this._rovingItems();\n      const steps = this.steps();\n      items.forEach((item, i) => item.disabled.set(!!steps[i]?.disabled()));\n    });\n  }\n\n  /** Whether navigation to `index` is currently permitted. */\n  public canGoTo(index: number): boolean {\n    const steps = this.steps();\n    const step = steps[index];\n    if (!step || step.disabled()) {\n      return false;\n    }\n    if (!this.linear()) {\n      return true;\n    }\n    // Linear: can go backward freely, or forward up to the first incomplete step.\n    return index <= Math.max(this.active(), this._firstIncomplete());\n  }\n\n  public goTo(index: number): void {\n    if (this.canGoTo(index)) {\n      this.active.set(index);\n    }\n  }\n\n  public next(): void {\n    this.goTo(this.active() + 1);\n  }\n\n  public previous(): void {\n    this.goTo(this.active() - 1);\n  }\n\n  protected onHeaderActivate(index: number): void {\n    this.goTo(index);\n  }\n}\n","<div ngnRovingGroup [ptInt]=\"this\" [ptClass]=\"'header'\" role=\"tablist\">\n  @for (step of steps(); track $index; let i = $index; let last = $last) {\n    <button\n      type=\"button\"\n      ngnRovingItem\n      role=\"tab\"\n      [attr.aria-selected]=\"i === active()\"\n      [attr.aria-disabled]=\"!canGoTo(i) ? 'true' : null\"\n      [disabled]=\"step.disabled()\"\n      [ptInt]=\"this\"\n      [ptClass]=\"{\n        step: true,\n        active: i === active(),\n        completed: !!step.completed(),\n        error: !!step.error(),\n        disabled: step.disabled() || !canGoTo(i),\n      }\"\n      (click)=\"onHeaderActivate(i)\"\n    >\n      <span [ptInt]=\"this\" [ptClass]=\"'marker'\">\n        @if (step.iconStep(); as icon) {\n          <ngn-icon [ptInt]=\"this\" [ptClass]=\"'marker-icon'\" [icon]=\"icon\" />\n        } @else if (step.completed() && i !== active()) {\n          <ngn-icon [ptInt]=\"this\" [ptClass]=\"'marker-icon'\" [defaultIcon]=\"'stepper-completed'\" />\n        } @else {\n          <span [ptInt]=\"this\" [ptClass]=\"'marker-index'\">{{ i + 1 }}</span>\n        }\n      </span>\n      <span [ptInt]=\"this\" [ptClass]=\"'label'\">\n        {{ step.label() }}\n        @if (step.optional()) {\n          <span [ptInt]=\"this\" [ptClass]=\"'optional'\">(optional)</span>\n        }\n      </span>\n    </button>\n    @if (!last) {\n      <span [ptInt]=\"this\" [ptClass]=\"'connector'\"></span>\n    }\n  }\n</div>\n\n@for (step of steps(); track $index; let i = $index) {\n  <div\n    role=\"tabpanel\"\n    [ptInt]=\"this\"\n    [ptClass]=\"{ content: i === active() }\"\n    [hidden]=\"i !== active()\"\n  >\n    <ngn-defer\n      [lazyContent]=\"step.content()\"\n      [open]=\"i === active()\"\n      [lazy]=\"lazy()\"\n      [cache]=\"cache()\"\n    />\n  </div>\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}

package/fesm2022/ngneers-controls-switch.mjs

@@ -9,7 +9,7 @@ import { switchControlTemplate } from '@ngneers/controls-themes/templates/switch
 class NgnSwitch extends ValueControlBase {
     theme = this.injectThemeTemplate(switchControlTemplate, {
         root: true,
-        invalid: () => this.invalid(),
+        invalid: () => this.invalidState(),
     });
     changed(event) {
         const target = event.target;
@@ -24,11 +24,11 @@ class NgnSwitch extends ValueControlBase {
         super();
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: NgnSwitch, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.5", type: NgnSwitch, isStandalone: true, selector: "ngn-switch", providers: [provideSelf(NgnSwitch)], usesInheritance: true, ngImport: i0, template: "<div [ptInt]=\"this\" [ptClass]=\"{ track: true, 'track-checked': !!value() }\">\n  <div [ptInt]=\"this\" [ptClass]=\"'thumb'\"></div>\n</div>\n<input\n  type=\"checkbox\"\n  [checked]=\"value()\"\n  (change)=\"changed($event)\"\n  (click)=\"onClick($event)\"\n  [ptInt]=\"this\"\n  [ptClass]=\"'input'\"\n  [attr.disabled]=\"disabled() ? '' : undefined\"\n  [ariaReadOnly]=\"readonly() ? '' : undefined\"\n  [ariaInvalid]=\"invalid() ? 'true' : undefined\"\n  [attr.aria-label]=\"label()\"\n  [ariaLabelledByElements]=\"labelledBy()\"\n  (blur)=\"touched.set(true)\"\n  [id]=\"inputId()\"\n/>\n", dependencies: [{ kind: "directive", type: NgnPt, selector: "[ptInt]", inputs: ["ptInt", "ptClass", "ptDep"] }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.5", type: NgnSwitch, isStandalone: true, selector: "ngn-switch", providers: [provideSelf(NgnSwitch)], usesInheritance: true, ngImport: i0, template: "<div [ptInt]=\"this\" [ptClass]=\"{ track: true, 'track-checked': !!value() }\">\n  <div [ptInt]=\"this\" [ptClass]=\"'thumb'\"></div>\n</div>\n<input\n  type=\"checkbox\"\n  [checked]=\"value()\"\n  (change)=\"changed($event)\"\n  (click)=\"onClick($event)\"\n  [ptInt]=\"this\"\n  [ptClass]=\"'input'\"\n  [attr.disabled]=\"disabled() ? '' : undefined\"\n  [ariaReadOnly]=\"readonly() ? '' : undefined\"\n  [ariaInvalid]=\"invalidState() ? 'true' : undefined\"\n  [attr.aria-label]=\"label()\"\n  [ariaLabelledByElements]=\"labelledBy()\"\n  [id]=\"inputId()\"\n  (blur)=\"markTouched()\"\n/>\n", dependencies: [{ kind: "directive", type: NgnPt, selector: "[ptInt]", inputs: ["ptInt", "ptClass", "ptDep"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: NgnSwitch, decorators: [{
             type: Component,
-            args: [{ selector: 'ngn-switch', imports: [NgnPt], providers: [provideSelf(NgnSwitch)], template: "<div [ptInt]=\"this\" [ptClass]=\"{ track: true, 'track-checked': !!value() }\">\n  <div [ptInt]=\"this\" [ptClass]=\"'thumb'\"></div>\n</div>\n<input\n  type=\"checkbox\"\n  [checked]=\"value()\"\n  (change)=\"changed($event)\"\n  (click)=\"onClick($event)\"\n  [ptInt]=\"this\"\n  [ptClass]=\"'input'\"\n  [attr.disabled]=\"disabled() ? '' : undefined\"\n  [ariaReadOnly]=\"readonly() ? '' : undefined\"\n  [ariaInvalid]=\"invalid() ? 'true' : undefined\"\n  [attr.aria-label]=\"label()\"\n  [ariaLabelledByElements]=\"labelledBy()\"\n  (blur)=\"touched.set(true)\"\n  [id]=\"inputId()\"\n/>\n" }]
+            args: [{ selector: 'ngn-switch', imports: [NgnPt], providers: [provideSelf(NgnSwitch)], template: "<div [ptInt]=\"this\" [ptClass]=\"{ track: true, 'track-checked': !!value() }\">\n  <div [ptInt]=\"this\" [ptClass]=\"'thumb'\"></div>\n</div>\n<input\n  type=\"checkbox\"\n  [checked]=\"value()\"\n  (change)=\"changed($event)\"\n  (click)=\"onClick($event)\"\n  [ptInt]=\"this\"\n  [ptClass]=\"'input'\"\n  [attr.disabled]=\"disabled() ? '' : undefined\"\n  [ariaReadOnly]=\"readonly() ? '' : undefined\"\n  [ariaInvalid]=\"invalidState() ? 'true' : undefined\"\n  [attr.aria-label]=\"label()\"\n  [ariaLabelledByElements]=\"labelledBy()\"\n  [id]=\"inputId()\"\n  (blur)=\"markTouched()\"\n/>\n" }]
         }], ctorParameters: () => [] });
 
 /**

package/fesm2022/ngneers-controls-switch.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ngneers-controls-switch.mjs","sources":["../../src/switch/switch.ts","../../src/switch/switch.html","../../src/switch/ngneers-controls-switch.ts"],"sourcesContent":["import { Component } from '@angular/core';\nimport { NgnPt, provideSelf, ValueControlBase } from '@ngneers/controls/base';\nimport { switchControlTemplate } from '@ngneers/controls-themes/templates/switch';\n\n/**\n * @category control\n */\n@Component({\n  selector: 'ngn-switch',\n  templateUrl: './switch.html',\n  imports: [NgnPt],\n  providers: [provideSelf(NgnSwitch)],\n})\nexport class NgnSwitch extends ValueControlBase<'switch', boolean> {\n  protected readonly theme = this.injectThemeTemplate(switchControlTemplate, {\n    root: true,\n    invalid: () => this.invalid(),\n  });\n\n  protected changed(event: Event) {\n    const target = event.target as HTMLInputElement;\n    this.value.set(target.checked);\n  }\n\n  protected onClick(event: Event) {\n    if (this.readonly() || this.disabled()) {\n      event.preventDefault();\n    }\n  }\n\n  constructor() {\n    super();\n  }\n}\n","<div [ptInt]=\"this\" [ptClass]=\"{ track: true, 'track-checked': !!value() }\">\n  <div [ptInt]=\"this\" [ptClass]=\"'thumb'\"></div>\n</div>\n<input\n  type=\"checkbox\"\n  [checked]=\"value()\"\n  (change)=\"changed($event)\"\n  (click)=\"onClick($event)\"\n  [ptInt]=\"this\"\n  [ptClass]=\"'input'\"\n  [attr.disabled]=\"disabled() ? '' : undefined\"\n  [ariaReadOnly]=\"readonly() ? '' : undefined\"\n  [ariaInvalid]=\"invalid() ? 'true' : undefined\"\n  [attr.aria-label]=\"label()\"\n  [ariaLabelledByElements]=\"labelledBy()\"\n  (blur)=\"touched.set(true)\"\n  [id]=\"inputId()\"\n/>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;AAIA;;AAEG;AAOG,MAAO,SAAU,SAAQ,gBAAmC,CAAA;AAC7C,IAAA,KAAK,GAAG,IAAI,CAAC,mBAAmB,CAAC,qBAAqB,EAAE;AACzE,QAAA,IAAI,EAAE,IAAI;AACV,QAAA,OAAO,EAAE,MAAM,IAAI,CAAC,OAAO,EAAE;AAC9B,KAAA,CAAC;AAEQ,IAAA,OAAO,CAAC,KAAY,EAAA;AAC5B,QAAA,MAAM,MAAM,GAAG,KAAK,CAAC,MAA0B;QAC/C,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,MAAM,CAAC,OAAO,CAAC;IAChC;AAEU,IAAA,OAAO,CAAC,KAAY,EAAA;QAC5B,IAAI,IAAI,CAAC,QAAQ,EAAE,IAAI,IAAI,CAAC,QAAQ,EAAE,EAAE;YACtC,KAAK,CAAC,cAAc,EAAE;QACxB;IACF;AAEA,IAAA,WAAA,GAAA;AACE,QAAA,KAAK,EAAE;IACT;uGAnBW,SAAS,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;2FAAT,SAAS,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,YAAA,EAAA,SAAA,EAFT,CAAC,WAAW,CAAC,SAAS,CAAC,CAAC,EAAA,eAAA,EAAA,IAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,ECXrC,qlBAkBA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EDRY,KAAK,EAAA,QAAA,EAAA,SAAA,EAAA,MAAA,EAAA,CAAA,OAAA,EAAA,SAAA,EAAA,OAAA,CAAA,EAAA,CAAA,EAAA,CAAA;;2FAGJ,SAAS,EAAA,UAAA,EAAA,CAAA;kBANrB,SAAS;+BACE,YAAY,EAAA,OAAA,EAEb,CAAC,KAAK,CAAC,aACL,CAAC,WAAW,WAAW,CAAC,EAAA,QAAA,EAAA,qlBAAA,EAAA;;;AEXrC;;AAEG;;;;"}
+{"version":3,"file":"ngneers-controls-switch.mjs","sources":["../../src/switch/switch.ts","../../src/switch/switch.html","../../src/switch/ngneers-controls-switch.ts"],"sourcesContent":["import { Component } from '@angular/core';\nimport { NgnPt, provideSelf, ValueControlBase } from '@ngneers/controls/base';\nimport { switchControlTemplate } from '@ngneers/controls-themes/templates/switch';\n\n/**\n * @category control\n */\n@Component({\n  selector: 'ngn-switch',\n  templateUrl: './switch.html',\n  imports: [NgnPt],\n  providers: [provideSelf(NgnSwitch)],\n})\nexport class NgnSwitch extends ValueControlBase<'switch', boolean> {\n  protected readonly theme = this.injectThemeTemplate(switchControlTemplate, {\n    root: true,\n    invalid: () => this.invalidState(),\n  });\n\n  protected changed(event: Event) {\n    const target = event.target as HTMLInputElement;\n    this.value.set(target.checked);\n  }\n\n  protected onClick(event: Event) {\n    if (this.readonly() || this.disabled()) {\n      event.preventDefault();\n    }\n  }\n\n  constructor() {\n    super();\n  }\n}\n","<div [ptInt]=\"this\" [ptClass]=\"{ track: true, 'track-checked': !!value() }\">\n  <div [ptInt]=\"this\" [ptClass]=\"'thumb'\"></div>\n</div>\n<input\n  type=\"checkbox\"\n  [checked]=\"value()\"\n  (change)=\"changed($event)\"\n  (click)=\"onClick($event)\"\n  [ptInt]=\"this\"\n  [ptClass]=\"'input'\"\n  [attr.disabled]=\"disabled() ? '' : undefined\"\n  [ariaReadOnly]=\"readonly() ? '' : undefined\"\n  [ariaInvalid]=\"invalidState() ? 'true' : undefined\"\n  [attr.aria-label]=\"label()\"\n  [ariaLabelledByElements]=\"labelledBy()\"\n  [id]=\"inputId()\"\n  (blur)=\"markTouched()\"\n/>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;AAIA;;AAEG;AAOG,MAAO,SAAU,SAAQ,gBAAmC,CAAA;AAC7C,IAAA,KAAK,GAAG,IAAI,CAAC,mBAAmB,CAAC,qBAAqB,EAAE;AACzE,QAAA,IAAI,EAAE,IAAI;AACV,QAAA,OAAO,EAAE,MAAM,IAAI,CAAC,YAAY,EAAE;AACnC,KAAA,CAAC;AAEQ,IAAA,OAAO,CAAC,KAAY,EAAA;AAC5B,QAAA,MAAM,MAAM,GAAG,KAAK,CAAC,MAA0B;QAC/C,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,MAAM,CAAC,OAAO,CAAC;IAChC;AAEU,IAAA,OAAO,CAAC,KAAY,EAAA;QAC5B,IAAI,IAAI,CAAC,QAAQ,EAAE,IAAI,IAAI,CAAC,QAAQ,EAAE,EAAE;YACtC,KAAK,CAAC,cAAc,EAAE;QACxB;IACF;AAEA,IAAA,WAAA,GAAA;AACE,QAAA,KAAK,EAAE;IACT;uGAnBW,SAAS,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;2FAAT,SAAS,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,YAAA,EAAA,SAAA,EAFT,CAAC,WAAW,CAAC,SAAS,CAAC,CAAC,EAAA,eAAA,EAAA,IAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,ECXrC,slBAkBA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EDRY,KAAK,EAAA,QAAA,EAAA,SAAA,EAAA,MAAA,EAAA,CAAA,OAAA,EAAA,SAAA,EAAA,OAAA,CAAA,EAAA,CAAA,EAAA,CAAA;;2FAGJ,SAAS,EAAA,UAAA,EAAA,CAAA;kBANrB,SAAS;+BACE,YAAY,EAAA,OAAA,EAEb,CAAC,KAAK,CAAC,aACL,CAAC,WAAW,WAAW,CAAC,EAAA,QAAA,EAAA,slBAAA,EAAA;;;AEXrC;;AAEG;;;;"}