@i-cell/ids-angular 0.1.8 → 0.1.9

package/badge/badge-defaults.d.ts

@@ -0,0 +1,13 @@
+import { IdsBadgeAppearanceType } from './types/badge-appearance.type';
+import { IdsBadgeVariantType } from './types/badge-variant.type';
+import { InjectionToken } from '@angular/core';
+import { IdsSizeType } from '@i-cell/ids-angular/core';
+export interface IdsBadgeDefaultConfig {
+    appearance?: IdsBadgeAppearanceType;
+    size?: IdsSizeType;
+    variant?: IdsBadgeVariantType;
+    showLeadingElement?: boolean;
+    label?: string;
+}
+export declare const IDS_BADGE_DEFAULT_CONFIG: InjectionToken<IdsBadgeDefaultConfig>;
+export declare function IDS_BADGE_DEFAULT_CONFIG_FACTORY(): Required<IdsBadgeDefaultConfig>;

package/badge/badge-limit.pipe.d.ts

@@ -0,0 +1,7 @@
+import { PipeTransform } from '@angular/core';
+import * as i0 from "@angular/core";
+export declare class BadgeLimitPipe implements PipeTransform {
+    transform(value: string, max: number | string | null): string;
+    static ɵfac: i0.ɵɵFactoryDeclaration<BadgeLimitPipe, never>;
+    static ɵpipe: i0.ɵɵPipeDeclaration<BadgeLimitPipe, "badgeLimit", true>;
+}

package/badge/badge.component.d.ts

@@ -0,0 +1,17 @@
+import { IdsBadgeVariantType } from './types/badge-variant.type';
+import { ComponentBase, IdsSizeType } from '@i-cell/ids-angular/core';
+import { IdsIconComponent } from '@i-cell/ids-angular/icon';
+import * as i0 from "@angular/core";
+export declare class IdsBadgeComponent extends ComponentBase {
+    protected get _hostName(): string;
+    appearance: import("@angular/core").InputSignal<"filled" | undefined>;
+    variant: import("@angular/core").InputSignal<IdsBadgeVariantType | undefined>;
+    label: import("@angular/core").InputSignal<string>;
+    size: import("@angular/core").InputSignal<IdsSizeType | undefined>;
+    limit: import("@angular/core").InputSignal<number | null>;
+    showLeadingElement: import("@angular/core").InputSignal<boolean>;
+    protected _iconLeading: import("@angular/core").Signal<readonly IdsIconComponent[]>;
+    protected _hostClasses: import("@angular/core").Signal<string>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<IdsBadgeComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<IdsBadgeComponent, "ids-badge", never, { "appearance": { "alias": "appearance"; "required": false; "isSignal": true; }; "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "limit": { "alias": "limit"; "required": false; "isSignal": true; }; "showLeadingElement": { "alias": "showLeadingElement"; "required": false; "isSignal": true; }; }, {}, ["_iconLeading"], ["ids-icon[icon-leading]"], true, never>;
+}

package/badge/badge.directive.d.ts

@@ -0,0 +1,25 @@
+import { IdsBadgeDefaultConfig } from './badge-defaults';
+import { IdsBadgeVariantType } from './types/badge-variant.type';
+import { OnDestroy, OnInit } from '@angular/core';
+import { DirectiveBaseWithDefaults, IdsSizeType } from '@i-cell/ids-angular/core';
+import * as i0 from "@angular/core";
+export declare class IdsBadgeDirective extends DirectiveBaseWithDefaults<IdsBadgeDefaultConfig> implements OnInit, OnDestroy {
+    private _badgeRef;
+    private _iconEffectRef?;
+    private readonly _elementRef;
+    private readonly _viewContainerRef;
+    private readonly _injector;
+    protected readonly _defaultConfig: Required<IdsBadgeDefaultConfig>;
+    appearance: import("@angular/core").InputSignal<"filled">;
+    label: import("@angular/core").InputSignal<string>;
+    size: import("@angular/core").InputSignal<IdsSizeType>;
+    variant: import("@angular/core").InputSignal<IdsBadgeVariantType>;
+    limit: import("@angular/core").InputSignal<number | null>;
+    showLeadingElement: import("@angular/core").InputSignal<boolean>;
+    ngOnInit(): void;
+    private _moveIconIfNeeded;
+    ngOnDestroy(): void;
+    protected _hostClasses: import("@angular/core").Signal<string>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<IdsBadgeDirective, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<IdsBadgeDirective, "[idsBadge]", never, { "appearance": { "alias": "badgeAppearance"; "required": false; "isSignal": true; }; "label": { "alias": "badgeLabel"; "required": false; "isSignal": true; }; "size": { "alias": "badgeSize"; "required": false; "isSignal": true; }; "variant": { "alias": "badgeVariant"; "required": false; "isSignal": true; }; "limit": { "alias": "badgeLimit"; "required": false; "isSignal": true; }; "showLeadingElement": { "alias": "badgeShowLeadingElement"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}

package/badge/index.d.ts

@@ -0,0 +1,5 @@
+/**
+ * Generated bundle index. Do not edit.
+ */
+/// <amd-module name="@i-cell/ids-angular/badge" />
+export * from './public-api';

package/badge/public-api.d.ts

@@ -0,0 +1,5 @@
+export * from './badge.directive';
+export * from './types/badge-variant.type';
+export * from './types/badge-appearance.type';
+export * from './badge-defaults';
+export * from './badge-limit.pipe';

package/badge/types/badge-appearance.type.d.ts

@@ -0,0 +1,4 @@
+export declare const IdsBadgeAppearance: {
+    readonly FILLED: "filled";
+};
+export type IdsBadgeAppearanceType = (typeof IdsBadgeAppearance)[keyof typeof IdsBadgeAppearance];

package/badge/types/badge-variant.type.d.ts

@@ -0,0 +1,12 @@
+export declare const IdsBadgeVariant: {
+    readonly PRIMARY: "primary";
+    readonly SECONDARY: "secondary";
+    readonly SURFACE: "surface";
+    readonly BRAND: "brand";
+    readonly ERROR: "error";
+    readonly WARNING: "warning";
+    readonly SUCCESS: "success";
+    readonly LIGHT: "light";
+    readonly DARK: "dark";
+};
+export type IdsBadgeVariantType = (typeof IdsBadgeVariant)[keyof typeof IdsBadgeVariant];

package/fesm2022/i-cell-ids-angular-badge.mjs

@@ -0,0 +1,172 @@
+import * as i0 from '@angular/core';
+import { InjectionToken, Pipe, input, contentChildren, computed, Component, inject, ElementRef, ViewContainerRef, Injector, runInInjectionContext, effect, Directive } from '@angular/core';
+import { IdsSize, ComponentBase, DirectiveBaseWithDefaults } from '@i-cell/ids-angular/core';
+import { NgClass } from '@angular/common';
+
+const IdsBadgeAppearance = {
+    FILLED: 'filled',
+};
+
+const IdsBadgeVariant = {
+    PRIMARY: 'primary',
+    SECONDARY: 'secondary',
+    SURFACE: 'surface',
+    BRAND: 'brand',
+    ERROR: 'error',
+    WARNING: 'warning',
+    SUCCESS: 'success',
+    LIGHT: 'light',
+    DARK: 'dark',
+};
+
+const IDS_BADGE_DEFAULT_CONFIG = new InjectionToken('IDS_BADGE_DEFAULT_CONFIG', {
+    providedIn: 'root',
+    factory: IDS_BADGE_DEFAULT_CONFIG_FACTORY,
+});
+function IDS_BADGE_DEFAULT_CONFIG_FACTORY() {
+    return {
+        appearance: IdsBadgeAppearance.FILLED,
+        size: IdsSize.COMPACT,
+        variant: IdsBadgeVariant.SURFACE,
+        showLeadingElement: false,
+        label: '',
+    };
+}
+
+class BadgeLimitPipe {
+    transform(value, max) {
+        if (value === null || value === undefined || value === '') {
+            return '';
+        }
+        if (max === null || max === undefined || max === '') {
+            return String(value);
+        }
+        const num = Number(value);
+        const maxNum = Number(max);
+        if (!isNaN(num) && !isNaN(maxNum)) {
+            return num > maxNum ? `${maxNum}+` : `${num}`;
+        }
+        return String(value);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.2", ngImport: i0, type: BadgeLimitPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
+    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.1.2", ngImport: i0, type: BadgeLimitPipe, isStandalone: true, name: "badgeLimit", pure: false }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.2", ngImport: i0, type: BadgeLimitPipe, decorators: [{
+            type: Pipe,
+            args: [{
+                    name: 'badgeLimit',
+                    standalone: true,
+                    pure: false,
+                }]
+        }] });
+
+class IdsBadgeComponent extends ComponentBase {
+    constructor() {
+        super(...arguments);
+        this.appearance = input();
+        this.variant = input();
+        this.label = input('');
+        this.size = input();
+        this.limit = input(null);
+        this.showLeadingElement = input(false);
+        this._iconLeading = contentChildren('ids-icon[icon-leading]');
+        this._hostClasses = computed(() => this._getHostClasses([
+            this.size(),
+            this.variant(),
+        ]));
+    }
+    get _hostName() {
+        return 'badge';
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.2", ngImport: i0, type: IdsBadgeComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.1.2", type: IdsBadgeComponent, isStandalone: true, selector: "ids-badge", inputs: { appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", 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 }, limit: { classPropertyName: "limit", publicName: "limit", isSignal: true, isRequired: false, transformFunction: null }, showLeadingElement: { classPropertyName: "showLeadingElement", publicName: "showLeadingElement", isSignal: true, isRequired: false, transformFunction: null } }, queries: [{ propertyName: "_iconLeading", predicate: ["ids-icon[icon-leading]"], isSignal: true }], usesInheritance: true, ngImport: i0, template: "<div [ngClass]=\"!showLeadingElement() && !label() ? 'ids-badge__container-no-element' : 'ids-badge__container'\">\n  @if (_iconLeading()) {\n    <ng-content select=\"ids-icon[icon-leading]\"/>\n  }\n  <span class=\"ids-badge__label\" aria-live=\"polite\">{{ label() | badgeLimit:limit() }}</span>\n</div>\n", dependencies: [{ kind: "pipe", type: BadgeLimitPipe, name: "badgeLimit" }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.2", ngImport: i0, type: IdsBadgeComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'ids-badge', standalone: true, imports: [
+                        BadgeLimitPipe,
+                        NgClass,
+                    ], template: "<div [ngClass]=\"!showLeadingElement() && !label() ? 'ids-badge__container-no-element' : 'ids-badge__container'\">\n  @if (_iconLeading()) {\n    <ng-content select=\"ids-icon[icon-leading]\"/>\n  }\n  <span class=\"ids-badge__label\" aria-live=\"polite\">{{ label() | badgeLimit:limit() }}</span>\n</div>\n" }]
+        }] });
+
+const defaultConfig = IDS_BADGE_DEFAULT_CONFIG_FACTORY();
+class IdsBadgeDirective extends DirectiveBaseWithDefaults {
+    constructor() {
+        super(...arguments);
+        this._elementRef = inject((ElementRef));
+        this._viewContainerRef = inject(ViewContainerRef);
+        this._injector = inject(Injector);
+        this._defaultConfig = this._getDefaultConfig(defaultConfig, IDS_BADGE_DEFAULT_CONFIG);
+        this.appearance = input(this._defaultConfig.appearance, { alias: 'badgeAppearance' });
+        this.label = input('', { alias: 'badgeLabel' });
+        this.size = input(this._defaultConfig.size, { alias: 'badgeSize' });
+        this.variant = input(this._defaultConfig.variant, { alias: 'badgeVariant' });
+        this.limit = input(null, { alias: 'badgeLimit' });
+        this.showLeadingElement = input(this._defaultConfig.showLeadingElement, { alias: 'badgeShowLeadingElement' });
+        this._hostClasses = computed(() => this._getHostClasses([]));
+    }
+    ngOnInit() {
+        const originalEl = this._elementRef.nativeElement;
+        runInInjectionContext(this._injector, () => {
+            this._badgeRef = this._viewContainerRef.createComponent(IdsBadgeComponent, {
+                injector: this._injector,
+            });
+            const badgeEl = this._badgeRef.location.nativeElement;
+            const parent = originalEl.parentElement;
+            if (!parent) {
+                return;
+            }
+            const placeholder = document.createComment('ids-badge-wrapper');
+            parent.replaceChild(placeholder, originalEl);
+            badgeEl.appendChild(originalEl);
+            parent.replaceChild(badgeEl, placeholder);
+            effect(() => {
+                this._badgeRef.setInput('appearance', this.appearance());
+                this._badgeRef.setInput('variant', this.variant());
+                this._badgeRef.setInput('label', this.label());
+                this._badgeRef.setInput('size', this.size());
+                this._badgeRef.setInput('limit', this.limit());
+                this._badgeRef.setInput('showLeadingElement', this.showLeadingElement());
+            });
+            this._iconEffectRef = effect(() => {
+                if (this.showLeadingElement()) {
+                    queueMicrotask(() => this._moveIconIfNeeded());
+                }
+            });
+            this._moveIconIfNeeded();
+        });
+    }
+    _moveIconIfNeeded() {
+        const host = this._elementRef.nativeElement;
+        const icon = host.querySelector('ids-icon[icon-leading]');
+        const badgeEl = this._badgeRef?.location.nativeElement;
+        if (!icon || !badgeEl) {
+            return;
+        }
+        const container = badgeEl.querySelector('.ids-badge__container') ||
+            badgeEl.querySelector('.ids-badge__container-no-element');
+        if (container && !container.contains(icon)) {
+            container.prepend(icon);
+        }
+    }
+    ngOnDestroy() {
+        this._iconEffectRef?.destroy();
+        this._badgeRef?.destroy();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.2", ngImport: i0, type: IdsBadgeDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.1.2", type: IdsBadgeDirective, isStandalone: true, selector: "[idsBadge]", inputs: { appearance: { classPropertyName: "appearance", publicName: "badgeAppearance", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "badgeLabel", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "badgeSize", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "badgeVariant", isSignal: true, isRequired: false, transformFunction: null }, limit: { classPropertyName: "limit", publicName: "badgeLimit", isSignal: true, isRequired: false, transformFunction: null }, showLeadingElement: { classPropertyName: "showLeadingElement", publicName: "badgeShowLeadingElement", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.2", ngImport: i0, type: IdsBadgeDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[idsBadge]',
+                    standalone: true,
+                }]
+        }] });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { BadgeLimitPipe, IDS_BADGE_DEFAULT_CONFIG, IDS_BADGE_DEFAULT_CONFIG_FACTORY, IdsBadgeAppearance, IdsBadgeDirective, IdsBadgeVariant };
+//# sourceMappingURL=i-cell-ids-angular-badge.mjs.map

package/fesm2022/i-cell-ids-angular-badge.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"i-cell-ids-angular-badge.mjs","sources":["../../../projects/widgets/badge/types/badge-appearance.type.ts","../../../projects/widgets/badge/types/badge-variant.type.ts","../../../projects/widgets/badge/badge-defaults.ts","../../../projects/widgets/badge/badge-limit.pipe.ts","../../../projects/widgets/badge/badge.component.ts","../../../projects/widgets/badge/badge.component.html","../../../projects/widgets/badge/badge.directive.ts","../../../projects/widgets/badge/i-cell-ids-angular-badge.ts"],"sourcesContent":["export const IdsBadgeAppearance = {\n  FILLED: 'filled',\n} as const;\n\nexport type IdsBadgeAppearanceType =\n  (typeof IdsBadgeAppearance)[keyof typeof IdsBadgeAppearance];\n","export const IdsBadgeVariant = {\n  PRIMARY: 'primary',\n  SECONDARY: 'secondary',\n  SURFACE: 'surface',\n  BRAND: 'brand',\n  ERROR: 'error',\n  WARNING: 'warning',\n  SUCCESS: 'success',\n  LIGHT: 'light',\n  DARK: 'dark',\n} as const;\n\nexport type IdsBadgeVariantType =\n  (typeof IdsBadgeVariant)[keyof typeof IdsBadgeVariant];\n","import { IdsBadgeAppearanceType, IdsBadgeAppearance } from './types/badge-appearance.type';\nimport { IdsBadgeVariantType, IdsBadgeVariant } from './types/badge-variant.type';\n\nimport { InjectionToken } from '@angular/core';\nimport { IdsSizeType, IdsSize } from '@i-cell/ids-angular/core';\n\nexport interface IdsBadgeDefaultConfig {\n  appearance?: IdsBadgeAppearanceType;\n  size?: IdsSizeType;\n  variant?: IdsBadgeVariantType;\n  showLeadingElement?: boolean;\n  label?: string;\n}\n\nexport const IDS_BADGE_DEFAULT_CONFIG = new InjectionToken<IdsBadgeDefaultConfig>(\n  'IDS_BADGE_DEFAULT_CONFIG',\n  {\n    providedIn: 'root',\n    factory: IDS_BADGE_DEFAULT_CONFIG_FACTORY,\n  },\n);\n\nexport function IDS_BADGE_DEFAULT_CONFIG_FACTORY(): Required<IdsBadgeDefaultConfig> {\n  return {\n    appearance: IdsBadgeAppearance.FILLED,\n    size: IdsSize.COMPACT,\n    variant: IdsBadgeVariant.SURFACE,\n    showLeadingElement: false,\n    label: '',\n  };\n}\n","import { Pipe, PipeTransform } from '@angular/core';\n\n@Pipe({\n  name: 'badgeLimit',\n  standalone: true,\n  pure: false,\n})\nexport class BadgeLimitPipe implements PipeTransform {\n  public transform(value: string, max: number | string | null): string {\n    if (value === null || value === undefined || value === '') {\n      return '';\n    }\n\n    if (max === null || max === undefined || max === '') {\n      return String(value);\n    }\n\n    const num = Number(value);\n    const maxNum = Number(max);\n\n    if (!isNaN(num) && !isNaN(maxNum)) {\n      return num > maxNum ? `${maxNum}+` : `${num}`;\n    }\n\n    return String(value);\n  }\n}\n","import { BadgeLimitPipe } from './badge-limit.pipe';\nimport { IdsBadgeAppearanceType } from './types/badge-appearance.type';\nimport { IdsBadgeVariantType } from './types/badge-variant.type';\n\nimport { NgClass } from '@angular/common';\nimport {\n  Component,\n  computed,\n  contentChildren,\n  input,\n} from '@angular/core';\nimport { ComponentBase, IdsSizeType } from '@i-cell/ids-angular/core';\nimport { IdsIconComponent } from '@i-cell/ids-angular/icon';\n\n@Component({\n  selector: 'ids-badge',\n  standalone: true,\n  templateUrl: './badge.component.html',\n  imports: [\n    BadgeLimitPipe,\n    NgClass,\n  ],\n})\nexport class IdsBadgeComponent extends ComponentBase  {\n  protected override get _hostName(): string {\n    return 'badge';\n  }\n\n  public appearance = input<IdsBadgeAppearanceType>();\n  public variant = input<IdsBadgeVariantType>();\n  public label = input<string>('');\n  public size = input<IdsSizeType>();\n  public limit = input<null | number>(null);\n  public showLeadingElement = input<boolean>(false);\n\n  protected _iconLeading = contentChildren<IdsIconComponent>('ids-icon[icon-leading]');\n\n  protected _hostClasses = computed(() => this._getHostClasses([\n    this.size(),\n    this.variant(),\n  ]));\n}\n","<div [ngClass]=\"!showLeadingElement() && !label() ? 'ids-badge__container-no-element' : 'ids-badge__container'\">\n  @if (_iconLeading()) {\n    <ng-content select=\"ids-icon[icon-leading]\"/>\n  }\n  <span class=\"ids-badge__label\" aria-live=\"polite\">{{ label() | badgeLimit:limit() }}</span>\n</div>\n","import {\n  IDS_BADGE_DEFAULT_CONFIG,\n  IDS_BADGE_DEFAULT_CONFIG_FACTORY,\n  IdsBadgeDefaultConfig,\n} from './badge-defaults';\nimport { IdsBadgeComponent } from './badge.component';\nimport { IdsBadgeAppearanceType } from './types/badge-appearance.type';\nimport { IdsBadgeVariantType } from './types/badge-variant.type';\n\nimport {\n  ComponentRef,\n  computed,\n  Directive, effect, EffectRef,\n  ElementRef, inject,\n  Injector,\n  input, OnDestroy,\n  OnInit, runInInjectionContext,\n  ViewContainerRef,\n} from '@angular/core';\nimport { DirectiveBaseWithDefaults, IdsSizeType } from '@i-cell/ids-angular/core';\n\nconst defaultConfig = IDS_BADGE_DEFAULT_CONFIG_FACTORY();\n\n@Directive({\n  selector: '[idsBadge]',\n  standalone: true,\n})\nexport class IdsBadgeDirective extends DirectiveBaseWithDefaults<IdsBadgeDefaultConfig> implements OnInit, OnDestroy {\n  private _badgeRef!: ComponentRef<IdsBadgeComponent>;\n  private _iconEffectRef?: EffectRef;\n  private readonly _elementRef = inject(ElementRef<HTMLElement>);\n  private readonly _viewContainerRef = inject(ViewContainerRef);\n  private readonly _injector = inject(Injector);\n\n  protected readonly _defaultConfig = this._getDefaultConfig(defaultConfig, IDS_BADGE_DEFAULT_CONFIG);\n\n  public appearance = input<IdsBadgeAppearanceType>(this._defaultConfig.appearance, { alias: 'badgeAppearance' });\n  public label = input<string>('', { alias: 'badgeLabel' });\n  public size = input<IdsSizeType>(this._defaultConfig.size, { alias: 'badgeSize' });\n  public variant = input<IdsBadgeVariantType>(this._defaultConfig.variant, { alias: 'badgeVariant' });\n  public limit = input<number | null>(null, { alias: 'badgeLimit' });\n  public showLeadingElement = input<boolean>(this._defaultConfig.showLeadingElement, { alias: 'badgeShowLeadingElement' });\n\n  public ngOnInit(): void {\n    const originalEl = this._elementRef.nativeElement;\n\n    runInInjectionContext(this._injector, () => {\n      this._badgeRef = this._viewContainerRef.createComponent(IdsBadgeComponent, {\n        injector: this._injector,\n      });\n      const badgeEl = this._badgeRef.location.nativeElement;\n\n      const parent = originalEl.parentElement;\n      if (!parent) {\n        return;\n      }\n\n      const placeholder = document.createComment('ids-badge-wrapper');\n      parent.replaceChild(placeholder, originalEl);\n      badgeEl.appendChild(originalEl);\n      parent.replaceChild(badgeEl, placeholder);\n\n      effect(() => {\n        this._badgeRef.setInput('appearance', this.appearance());\n        this._badgeRef.setInput('variant', this.variant());\n        this._badgeRef.setInput('label', this.label());\n        this._badgeRef.setInput('size', this.size());\n        this._badgeRef.setInput('limit', this.limit());\n        this._badgeRef.setInput('showLeadingElement', this.showLeadingElement());\n      });\n\n      this._iconEffectRef = effect(() => {\n        if (this.showLeadingElement()) {\n          queueMicrotask(() => this._moveIconIfNeeded());\n        }\n      });\n\n      this._moveIconIfNeeded();\n    });\n  }\n\n  private _moveIconIfNeeded(): void {\n    const host = this._elementRef.nativeElement;\n    const icon = host.querySelector('ids-icon[icon-leading]');\n    const badgeEl = this._badgeRef?.location.nativeElement;\n    if (!icon || !badgeEl) {\n      return;\n    }\n    const container =\n      badgeEl.querySelector('.ids-badge__container') ||\n      badgeEl.querySelector('.ids-badge__container-no-element');\n    if (container && !container.contains(icon)) {\n      container.prepend(icon);\n    }\n  }\n\n  public ngOnDestroy(): void {\n    this._iconEffectRef?.destroy();\n    this._badgeRef?.destroy();\n  }\n\n  protected _hostClasses = computed(() => this._getHostClasses([]));\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}

package/fesm2022/i-cell-ids-angular-forms.mjs

@@ -609,11 +609,11 @@ class IdsFormFieldComponent extends ComponentBaseWithDefaults {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.2", ngImport: i0, type: IdsFormFieldComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.1.2", type: IdsFormFieldComponent, isStandalone: true, selector: "ids-form-field", inputs: { size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null } }, queries: [{ propertyName: "_child", first: true, predicate: IDS_FORM_FIELD_CONTROL, descendants: true, isSignal: true }, { propertyName: "_hintMessages", predicate: IdsHintMessageComponent, descendants: true, isSignal: true }, { propertyName: "_successMessages", predicate: IdsSuccessMessageComponent, descendants: true, isSignal: true }, { propertyName: "_errorMessages", predicate: IdsErrorMessageComponent, descendants: true, isSignal: true }, { propertyName: "_actions", predicate: IdsFormFieldActionDirective, isSignal: true }, { propertyName: "_prefixes", predicate: IdsPrefixDirective, isSignal: true }, { propertyName: "_suffixes", predicate: IdsSuffixDirective, isSignal: true }], viewQueries: [{ propertyName: "_fieldWrapper", first: true, predicate: ["fieldWrapper"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<label class=\"ids-form-field__label\" [for]=\"_inputId()\">\n  <ng-content select=\"ids-label\" />\n  @if (hasRequiredValidator()) {\n    <span class=\"ids-form-field__required-marker\"></span>\n  }\n</label>\n\n<div #fieldWrapper class=\"ids-form-field__field-wrapper\">\n  <div class=\"ids-form-field__field-wrapper__container\" (click)=\"containerClick($event)\">\n    @if (_hasLeadingIcon()) {\n      <div class=\"ids-form-field__leading-icon\">\n        <ng-content select=\"ids-icon[idsLeadingIcon]\" />\n      </div>\n    }\n    @if (_hasPrefix()) {\n      <div class=\"ids-form-field__prefix\">\n        <ng-content select=\"[idsPrefix]\" />\n      </div>\n    }\n    <div class=\"ids-form-field__infix\">\n      <ng-content />\n    </div>\n    @if (_hasSuffix()) {\n      <div class=\"ids-form-field__suffix\">\n        <ng-content select=\"[idsSuffix]\" />\n      </div>\n    }\n    @if (_hasTrailingIcon()) {\n      <div class=\"ids-form-field__trailing-icon\">\n        <ng-content select=\"ids-icon[idsTrailingIcon]\" />\n      </div>\n    }\n  </div>\n  @if (_hasActions()) {\n    <div class=\"ids-form-field__field-wrapper__action\">\n      <ng-content select=\"[idsFormFieldAction]\" />\n    </div>\n  }\n</div>\n\n<div class=\"ids-form-field__subscript-wrapper\">\n  @let messages = _displayedMessages();\n  @if (messages) {\n    <div class=\"ids-form-field__message-container\">\n      @switch (messages) {\n        @case (\"error\") {\n          <ng-content select=\"ids-error-message\" />\n        }\n        @case (\"success\") {\n          <ng-content select=\"ids-success-message\" />\n        }\n        @case (\"hint\") {\n          <ng-content select=\"ids-hint-message\" />\n        }\n      }\n    </div>\n  }\n</div>\n", changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.1.2", type: IdsFormFieldComponent, isStandalone: true, selector: "ids-form-field", inputs: { size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null } }, queries: [{ propertyName: "_child", first: true, predicate: IDS_FORM_FIELD_CONTROL, descendants: true, isSignal: true }, { propertyName: "_hintMessages", predicate: IdsHintMessageComponent, descendants: true, isSignal: true }, { propertyName: "_successMessages", predicate: IdsSuccessMessageComponent, descendants: true, isSignal: true }, { propertyName: "_errorMessages", predicate: IdsErrorMessageComponent, descendants: true, isSignal: true }, { propertyName: "_actions", predicate: IdsFormFieldActionDirective, isSignal: true }, { propertyName: "_prefixes", predicate: IdsPrefixDirective, isSignal: true }, { propertyName: "_suffixes", predicate: IdsSuffixDirective, isSignal: true }], viewQueries: [{ propertyName: "_fieldWrapper", first: true, predicate: ["fieldWrapper"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<label class=\"ids-form-field__label\" [for]=\"_inputId()\">\n  @if (hasRequiredValidator()) {\n    <span class=\"ids-form-field__required-marker\"></span>\n  }\n  <ng-content select=\"ids-label\" />\n</label>\n\n<div #fieldWrapper class=\"ids-form-field__field-wrapper\">\n  <div class=\"ids-form-field__field-wrapper__container\" (click)=\"containerClick($event)\">\n    @if (_hasLeadingIcon()) {\n      <div class=\"ids-form-field__leading-icon\">\n        <ng-content select=\"ids-icon[idsLeadingIcon]\" />\n      </div>\n    }\n    @if (_hasPrefix()) {\n      <div class=\"ids-form-field__prefix\">\n        <ng-content select=\"[idsPrefix]\" />\n      </div>\n    }\n    <div class=\"ids-form-field__infix\">\n      <ng-content />\n    </div>\n    @if (_hasSuffix()) {\n      <div class=\"ids-form-field__suffix\">\n        <ng-content select=\"[idsSuffix]\" />\n      </div>\n    }\n    @if (_hasTrailingIcon()) {\n      <div class=\"ids-form-field__trailing-icon\">\n        <ng-content select=\"ids-icon[idsTrailingIcon]\" />\n      </div>\n    }\n  </div>\n  @if (_hasActions()) {\n    <div class=\"ids-form-field__field-wrapper__action\">\n      <ng-content select=\"[idsFormFieldAction]\" />\n    </div>\n  }\n</div>\n\n<div class=\"ids-form-field__subscript-wrapper\">\n  @let messages = _displayedMessages();\n  @if (messages) {\n    <div class=\"ids-form-field__message-container\">\n      @switch (messages) {\n        @case (\"error\") {\n          <ng-content select=\"ids-error-message\" />\n        }\n        @case (\"success\") {\n          <ng-content select=\"ids-success-message\" />\n        }\n        @case (\"hint\") {\n          <ng-content select=\"ids-hint-message\" />\n        }\n      }\n    </div>\n  }\n</div>\n", changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.2", ngImport: i0, type: IdsFormFieldComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ids-form-field', imports: [], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<label class=\"ids-form-field__label\" [for]=\"_inputId()\">\n  <ng-content select=\"ids-label\" />\n  @if (hasRequiredValidator()) {\n    <span class=\"ids-form-field__required-marker\"></span>\n  }\n</label>\n\n<div #fieldWrapper class=\"ids-form-field__field-wrapper\">\n  <div class=\"ids-form-field__field-wrapper__container\" (click)=\"containerClick($event)\">\n    @if (_hasLeadingIcon()) {\n      <div class=\"ids-form-field__leading-icon\">\n        <ng-content select=\"ids-icon[idsLeadingIcon]\" />\n      </div>\n    }\n    @if (_hasPrefix()) {\n      <div class=\"ids-form-field__prefix\">\n        <ng-content select=\"[idsPrefix]\" />\n      </div>\n    }\n    <div class=\"ids-form-field__infix\">\n      <ng-content />\n    </div>\n    @if (_hasSuffix()) {\n      <div class=\"ids-form-field__suffix\">\n        <ng-content select=\"[idsSuffix]\" />\n      </div>\n    }\n    @if (_hasTrailingIcon()) {\n      <div class=\"ids-form-field__trailing-icon\">\n        <ng-content select=\"ids-icon[idsTrailingIcon]\" />\n      </div>\n    }\n  </div>\n  @if (_hasActions()) {\n    <div class=\"ids-form-field__field-wrapper__action\">\n      <ng-content select=\"[idsFormFieldAction]\" />\n    </div>\n  }\n</div>\n\n<div class=\"ids-form-field__subscript-wrapper\">\n  @let messages = _displayedMessages();\n  @if (messages) {\n    <div class=\"ids-form-field__message-container\">\n      @switch (messages) {\n        @case (\"error\") {\n          <ng-content select=\"ids-error-message\" />\n        }\n        @case (\"success\") {\n          <ng-content select=\"ids-success-message\" />\n        }\n        @case (\"hint\") {\n          <ng-content select=\"ids-hint-message\" />\n        }\n      }\n    </div>\n  }\n</div>\n" }]
+            args: [{ selector: 'ids-form-field', imports: [], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<label class=\"ids-form-field__label\" [for]=\"_inputId()\">\n  @if (hasRequiredValidator()) {\n    <span class=\"ids-form-field__required-marker\"></span>\n  }\n  <ng-content select=\"ids-label\" />\n</label>\n\n<div #fieldWrapper class=\"ids-form-field__field-wrapper\">\n  <div class=\"ids-form-field__field-wrapper__container\" (click)=\"containerClick($event)\">\n    @if (_hasLeadingIcon()) {\n      <div class=\"ids-form-field__leading-icon\">\n        <ng-content select=\"ids-icon[idsLeadingIcon]\" />\n      </div>\n    }\n    @if (_hasPrefix()) {\n      <div class=\"ids-form-field__prefix\">\n        <ng-content select=\"[idsPrefix]\" />\n      </div>\n    }\n    <div class=\"ids-form-field__infix\">\n      <ng-content />\n    </div>\n    @if (_hasSuffix()) {\n      <div class=\"ids-form-field__suffix\">\n        <ng-content select=\"[idsSuffix]\" />\n      </div>\n    }\n    @if (_hasTrailingIcon()) {\n      <div class=\"ids-form-field__trailing-icon\">\n        <ng-content select=\"ids-icon[idsTrailingIcon]\" />\n      </div>\n    }\n  </div>\n  @if (_hasActions()) {\n    <div class=\"ids-form-field__field-wrapper__action\">\n      <ng-content select=\"[idsFormFieldAction]\" />\n    </div>\n  }\n</div>\n\n<div class=\"ids-form-field__subscript-wrapper\">\n  @let messages = _displayedMessages();\n  @if (messages) {\n    <div class=\"ids-form-field__message-container\">\n      @switch (messages) {\n        @case (\"error\") {\n          <ng-content select=\"ids-error-message\" />\n        }\n        @case (\"success\") {\n          <ng-content select=\"ids-success-message\" />\n        }\n        @case (\"hint\") {\n          <ng-content select=\"ids-hint-message\" />\n        }\n      }\n    </div>\n  }\n</div>\n" }]
         }] });
 
 const IDS_INPUT_DEFAULT_CONFIG = new InjectionToken('IDS_INPUT_DEFAULT_CONFIG', {