@db-ux/ngx-core-components 2.0.0-0-6589a60 → 2.0.0

package/components/accordion/accordion.d.ts

@@ -1,22 +1,23 @@
-import { ElementRef, SimpleChanges } from "@angular/core";
-import { DBAccordionProps, DBAccordionState } from "./model";
+import { AfterViewInit, ElementRef } from "@angular/core";
+import { DBAccordionItemDefaultProps } from "../accordion-item/model";
 import * as i0 from "@angular/core";
-export declare class DBAccordion {
-    cls: (...args: import("../../utils").ClassNameArg[]) => string;
-    id: DBAccordionProps["id"];
-    name: DBAccordionProps["name"];
-    behavior: DBAccordionProps["behavior"];
-    initOpenIndex: DBAccordionProps["initOpenIndex"];
-    className: DBAccordionProps["className"];
-    variant: DBAccordionProps["variant"];
-    items: DBAccordionProps["items"];
-    _ref: ElementRef | undefined;
-    _id: DBAccordionState["_id"];
-    _name: DBAccordionState["_name"];
-    initialized: DBAccordionState["initialized"];
-    _initOpenIndexDone: DBAccordionState["_initOpenIndexDone"];
-    convertItems(items: unknown[] | string | undefined): ReturnType<DBAccordionState["convertItems"]>;
-    trackByItem0(index: any, item: any): string;
+export declare class DBAccordion implements AfterViewInit {
+    protected readonly cls: (...args: import("../../utils").ClassNameArg[]) => string;
+    id: import("@angular/core").InputSignal<string | undefined>;
+    name: import("@angular/core").InputSignal<string | undefined>;
+    behavior: import("@angular/core").InputSignal<"multiple" | "single" | undefined>;
+    initOpenIndex: import("@angular/core").InputSignal<number[] | undefined>;
+    items: import("@angular/core").InputSignal<string | DBAccordionItemDefaultProps[] | undefined>;
+    className: import("@angular/core").InputSignal<string | undefined>;
+    variant: import("@angular/core").InputSignal<"divider" | "card" | undefined>;
+    _ref: import("@angular/core").Signal<ElementRef<any> | undefined>;
+    _id: import("@angular/core").WritableSignal<string | undefined>;
+    _name: import("@angular/core").WritableSignal<string | undefined>;
+    initialized: import("@angular/core").WritableSignal<boolean>;
+    _initOpenIndexDone: import("@angular/core").WritableSignal<boolean>;
+    convertItems(): any;
+    trackByItem0(index: number, item: any): string;
+    constructor();
     /**
      * Passes `aria-*`, `data-*` & `class` attributes to correct child. Used in angular and stencil.
      * @param element  the ref for the component
@@ -25,7 +26,6 @@ export declare class DBAccordion {
     private enableAttributePassing;
     ngOnInit(): void;
     ngAfterViewInit(): void;
-    ngAfterContentChecked(changes: SimpleChanges): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<DBAccordion, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<DBAccordion, "db-accordion", never, { "id": { "alias": "id"; "required": false; }; "name": { "alias": "name"; "required": false; }; "behavior": { "alias": "behavior"; "required": false; }; "initOpenIndex": { "alias": "initOpenIndex"; "required": false; }; "className": { "alias": "className"; "required": false; }; "variant": { "alias": "variant"; "required": false; }; "items": { "alias": "items"; "required": false; }; }, {}, never, ["*"], true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<DBAccordion, "db-accordion", never, { "id": { "alias": "id"; "required": false; "isSignal": true; }; "name": { "alias": "name"; "required": false; "isSignal": true; }; "behavior": { "alias": "behavior"; "required": false; "isSignal": true; }; "initOpenIndex": { "alias": "initOpenIndex"; "required": false; "isSignal": true; }; "items": { "alias": "items"; "required": false; "isSignal": true; }; "className": { "alias": "className"; "required": false; "isSignal": true; }; "variant": { "alias": "variant"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
 }

package/components/accordion/model.d.ts

@@ -35,7 +35,7 @@ export type DBAccordionDefaultProps = {
 export type DBAccordionProps = DBAccordionDefaultProps & GlobalProps;
 export type DBAccordionDefaultState = {
     _initOpenIndexDone: boolean;
-    _name: string;
-    convertItems: (items?: unknown[] | string) => DBAccordionItemDefaultProps[];
+    _name?: string;
+    convertItems: () => DBAccordionItemDefaultProps[];
 };
 export type DBAccordionState = DBAccordionDefaultState & GlobalState & InitializedState;

package/components/accordion-item/accordion-item.d.ts

@@ -1,21 +1,25 @@
-import { EventEmitter, ElementRef } from "@angular/core";
-import { DBAccordionItemProps, DBAccordionItemState } from "./model";
+import { AfterViewInit, ElementRef } from "@angular/core";
 import { ClickEvent } from "../../shared/model";
 import * as i0 from "@angular/core";
-export declare class DBAccordionItem {
-    cls: (...args: import("../../utils").ClassNameArg[]) => string;
-    getBooleanAsString: (originBool?: boolean | undefined) => any;
-    id: DBAccordionItemProps["id"];
-    defaultOpen: DBAccordionItemProps["defaultOpen"];
-    className: DBAccordionItemProps["className"];
-    disabled: DBAccordionItemProps["disabled"];
-    headlinePlain: DBAccordionItemProps["headlinePlain"];
-    text: DBAccordionItemProps["text"];
-    onToggle: EventEmitter<any>;
-    _ref: ElementRef | undefined;
-    _id: DBAccordionItemState["_id"];
-    _open: DBAccordionItemState["_open"];
-    toggle(event: ClickEvent<HTMLElement>): ReturnType<DBAccordionItemState["toggle"]>;
+export declare class DBAccordionItem implements AfterViewInit {
+    protected readonly cls: (...args: import("../../utils").ClassNameArg[]) => string;
+    protected readonly getBooleanAsString: (originBool?: boolean | string) => any;
+    id: import("@angular/core").InputSignal<string | undefined>;
+    defaultOpen: import("@angular/core").InputSignal<boolean | undefined>;
+    name: import("@angular/core").InputSignal<string | undefined>;
+    className: import("@angular/core").InputSignal<string | undefined>;
+    disabled: import("@angular/core").InputSignal<string | boolean | undefined>;
+    headlinePlain: import("@angular/core").InputSignal<string | undefined>;
+    text: import("@angular/core").InputSignal<string | undefined>;
+    toggle: import("@angular/core").OutputEmitterRef<any>;
+    _ref: import("@angular/core").Signal<ElementRef<any> | undefined>;
+    _id: import("@angular/core").WritableSignal<string | undefined>;
+    _open: import("@angular/core").WritableSignal<boolean | undefined>;
+    _name: import("@angular/core").WritableSignal<string | undefined>;
+    initialized: import("@angular/core").WritableSignal<boolean>;
+    handleNameAttribute(): void;
+    handleToggle(event: ClickEvent<HTMLElement> | any): void;
+    constructor();
     /**
      * Passes `aria-*`, `data-*` & `class` attributes to correct child. Used in angular and stencil.
      * @param element  the ref for the component
@@ -25,5 +29,5 @@ export declare class DBAccordionItem {
     ngOnInit(): void;
     ngAfterViewInit(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<DBAccordionItem, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<DBAccordionItem, "db-accordion-item", never, { "id": { "alias": "id"; "required": false; }; "defaultOpen": { "alias": "defaultOpen"; "required": false; }; "className": { "alias": "className"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "headlinePlain": { "alias": "headlinePlain"; "required": false; }; "text": { "alias": "text"; "required": false; }; }, { "onToggle": "onToggle"; }, never, ["[headline]", "*"], true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<DBAccordionItem, "db-accordion-item", never, { "id": { "alias": "id"; "required": false; "isSignal": true; }; "defaultOpen": { "alias": "defaultOpen"; "required": false; "isSignal": true; }; "name": { "alias": "name"; "required": false; "isSignal": true; }; "className": { "alias": "className"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "headlinePlain": { "alias": "headlinePlain"; "required": false; "isSignal": true; }; "text": { "alias": "text"; "required": false; "isSignal": true; }; }, { "toggle": "toggle"; }, never, ["[headline]", "*"], true, never>;
 }

package/components/accordion-item/model.d.ts

@@ -1,4 +1,4 @@
-import { GlobalProps, GlobalState, TextProps, ToggleEventProps, ToggleEventState } from '../../shared/model';
+import { GlobalProps, GlobalState, InitializedState, NameProps, NameState, TextProps, ToggleEventProps, ToggleEventState } from '../../shared/model';
 export type DBAccordionItemDefaultProps = {
     /**
      * Initial state for the accordion item
@@ -7,7 +7,7 @@ export type DBAccordionItemDefaultProps = {
     /**
      * The disabled attribute can be set to keep a user from clicking on the element.
      */
-    disabled?: boolean;
+    disabled?: boolean | string;
     /**
      * Title of the accordion-item as slot
      */
@@ -17,8 +17,8 @@ export type DBAccordionItemDefaultProps = {
      */
     headlinePlain?: string;
 } & TextProps;
-export type DBAccordionItemProps = DBAccordionItemDefaultProps & GlobalProps & ToggleEventProps;
+export type DBAccordionItemProps = DBAccordionItemDefaultProps & GlobalProps & ToggleEventProps & NameProps;
 export type DBAccordionItemDefaultState = {
-    _open: boolean;
+    _open?: boolean;
 };
-export type DBAccordionItemState = DBAccordionItemDefaultState & GlobalState & ToggleEventState<HTMLElement>;
+export type DBAccordionItemState = DBAccordionItemDefaultState & GlobalState & ToggleEventState<HTMLElement> & InitializedState & NameState;

package/components/badge/badge.d.ts

@@ -1,19 +1,19 @@
-import { ElementRef, SimpleChanges } from "@angular/core";
-import { DBBadgeProps, DBBadgeState } from "./model";
+import { AfterViewInit, ElementRef } from "@angular/core";
 import * as i0 from "@angular/core";
-export declare class DBBadge {
-    cls: (...args: import("../../utils").ClassNameArg[]) => string;
-    DEFAULT_LABEL: string;
-    placement: DBBadgeProps["placement"];
-    id: DBBadgeProps["id"];
-    className: DBBadgeProps["className"];
-    semantic: DBBadgeProps["semantic"];
-    size: DBBadgeProps["size"];
-    emphasis: DBBadgeProps["emphasis"];
-    label: DBBadgeProps["label"];
-    text: DBBadgeProps["text"];
-    _ref: ElementRef | undefined;
-    initialized: DBBadgeState["initialized"];
+export declare class DBBadge implements AfterViewInit {
+    protected readonly cls: (...args: import("../../utils").ClassNameArg[]) => string;
+    protected readonly DEFAULT_LABEL: string;
+    placement: import("@angular/core").InputSignal<"inline" | "corner-top-left" | "corner-top-right" | "corner-center-left" | "corner-center-right" | "corner-bottom-left" | "corner-bottom-right" | undefined>;
+    id: import("@angular/core").InputSignal<string | undefined>;
+    className: import("@angular/core").InputSignal<string | undefined>;
+    semantic: import("@angular/core").InputSignal<"adaptive" | "neutral" | "critical" | "informational" | "warning" | "successful" | undefined>;
+    size: import("@angular/core").InputSignal<"medium" | "small" | undefined>;
+    emphasis: import("@angular/core").InputSignal<"weak" | "strong" | undefined>;
+    label: import("@angular/core").InputSignal<string | undefined>;
+    text: import("@angular/core").InputSignal<string | undefined>;
+    _ref: import("@angular/core").Signal<ElementRef<any> | undefined>;
+    initialized: import("@angular/core").WritableSignal<boolean>;
+    constructor();
     /**
      * Passes `aria-*`, `data-*` & `class` attributes to correct child. Used in angular and stencil.
      * @param element  the ref for the component
@@ -22,7 +22,6 @@ export declare class DBBadge {
     private enableAttributePassing;
     ngOnInit(): void;
     ngAfterViewInit(): void;
-    ngAfterContentChecked(changes: SimpleChanges): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<DBBadge, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<DBBadge, "db-badge", never, { "placement": { "alias": "placement"; "required": false; }; "id": { "alias": "id"; "required": false; }; "className": { "alias": "className"; "required": false; }; "semantic": { "alias": "semantic"; "required": false; }; "size": { "alias": "size"; "required": false; }; "emphasis": { "alias": "emphasis"; "required": false; }; "label": { "alias": "label"; "required": false; }; "text": { "alias": "text"; "required": false; }; }, {}, never, ["*"], true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<DBBadge, "db-badge", never, { "placement": { "alias": "placement"; "required": false; "isSignal": true; }; "id": { "alias": "id"; "required": false; "isSignal": true; }; "className": { "alias": "className"; "required": false; "isSignal": true; }; "semantic": { "alias": "semantic"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "emphasis": { "alias": "emphasis"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "text": { "alias": "text"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
 }

package/components/badge/model.d.ts

@@ -1,4 +1,4 @@
-import { GlobalProps, GlobalState, InitializedState, SemanticProps, SizeProps, TagEmphasisProps, TextProps } from '../../shared/model';
+import { GlobalProps, GlobalState, InitializedState, SemanticProps, SizeProps, EmphasisProps, TextProps } from '../../shared/model';
 export declare const BadgePlacementList: readonly ["inline", "corner-top-left", "corner-top-right", "corner-center-left", "corner-center-right", "corner-bottom-left", "corner-bottom-right"];
 export type BadgePlacementType = (typeof BadgePlacementList)[number];
 export type DBBadgeDefaultProps = {
@@ -11,6 +11,6 @@ export type DBBadgeDefaultProps = {
      */
     label?: string;
 };
-export type DBBadgeProps = DBBadgeDefaultProps & GlobalProps & SemanticProps & SizeProps & TagEmphasisProps & TextProps;
+export type DBBadgeProps = DBBadgeDefaultProps & GlobalProps & SemanticProps & SizeProps & EmphasisProps & TextProps;
 export type DBBadgeDefaultState = {};
 export type DBBadgeState = DBBadgeDefaultState & GlobalState & InitializedState;

package/components/brand/brand.d.ts

@@ -1,17 +1,17 @@
-import { ElementRef } from "@angular/core";
-import { DBBrandProps } from "./model";
+import { AfterViewInit, ElementRef } from "@angular/core";
 import * as i0 from "@angular/core";
-export declare class DBBrand {
-    cls: (...args: import("../../utils").ClassNameArg[]) => string;
-    getHideProp: (show?: boolean | undefined) => any;
-    DEFAULT_ICON: string;
-    hideLogo: DBBrandProps["hideLogo"];
-    icon: DBBrandProps["icon"];
-    showIcon: DBBrandProps["showIcon"];
-    id: DBBrandProps["id"];
-    className: DBBrandProps["className"];
-    text: DBBrandProps["text"];
-    _ref: ElementRef | undefined;
+export declare class DBBrand implements AfterViewInit {
+    protected readonly DEFAULT_ICON: string;
+    protected readonly getHideProp: (show?: boolean | string) => any;
+    protected readonly cls: (...args: import("../../utils").ClassNameArg[]) => string;
+    hideLogo: import("@angular/core").InputSignal<boolean | undefined>;
+    icon: import("@angular/core").InputSignal<import("@db-ux/core-foundations").BaseIconTypes | import("@db-ux/core-foundations").LooseAutocomplete | undefined>;
+    showIcon: import("@angular/core").InputSignal<string | boolean | undefined>;
+    id: import("@angular/core").InputSignal<string | undefined>;
+    className: import("@angular/core").InputSignal<string | undefined>;
+    text: import("@angular/core").InputSignal<string | undefined>;
+    _ref: import("@angular/core").Signal<ElementRef<any> | undefined>;
+    constructor();
     /**
      * Passes `aria-*`, `data-*` & `class` attributes to correct child. Used in angular and stencil.
      * @param element  the ref for the component
@@ -20,5 +20,5 @@ export declare class DBBrand {
     private enableAttributePassing;
     ngAfterViewInit(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<DBBrand, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<DBBrand, "db-brand", never, { "hideLogo": { "alias": "hideLogo"; "required": false; }; "icon": { "alias": "icon"; "required": false; }; "showIcon": { "alias": "showIcon"; "required": false; }; "id": { "alias": "id"; "required": false; }; "className": { "alias": "className"; "required": false; }; "text": { "alias": "text"; "required": false; }; }, {}, never, ["*"], true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<DBBrand, "db-brand", never, { "hideLogo": { "alias": "hideLogo"; "required": false; "isSignal": true; }; "icon": { "alias": "icon"; "required": false; "isSignal": true; }; "showIcon": { "alias": "showIcon"; "required": false; "isSignal": true; }; "id": { "alias": "id"; "required": false; "isSignal": true; }; "className": { "alias": "className"; "required": false; "isSignal": true; }; "text": { "alias": "text"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
 }

package/components/button/button.d.ts

@@ -1,32 +1,34 @@
-import { EventEmitter, ElementRef } from "@angular/core";
-import type { DBButtonProps, DBButtonState } from "./model";
+import { AfterViewInit, ElementRef } from "@angular/core";
 import { ClickEvent } from "../../shared/model";
 import * as i0 from "@angular/core";
-export declare class DBButton {
-    cls: (...args: import("../../utils").ClassNameArg[]) => string;
-    getBooleanAsString: (originBool?: boolean | undefined) => any;
-    getHideProp: (show?: boolean | undefined) => any;
-    id: DBButtonProps["id"];
-    className: DBButtonProps["className"];
-    type: DBButtonProps["type"];
-    disabled: DBButtonProps["disabled"];
-    label: DBButtonProps["label"];
-    icon: DBButtonProps["icon"];
-    showIcon: DBButtonProps["showIcon"];
-    size: DBButtonProps["size"];
-    state: DBButtonProps["state"];
-    width: DBButtonProps["width"];
-    variant: DBButtonProps["variant"];
-    noText: DBButtonProps["noText"];
-    name: DBButtonProps["name"];
-    value: DBButtonProps["value"];
-    describedbyid: DBButtonProps["describedbyid"];
-    ariaexpanded: DBButtonProps["ariaexpanded"];
-    ariapressed: DBButtonProps["ariapressed"];
-    text: DBButtonProps["text"];
-    onClick: EventEmitter<any>;
-    _ref: ElementRef | undefined;
-    handleClick(event: ClickEvent<HTMLButtonElement>): ReturnType<DBButtonState["handleClick"]>;
+export declare class DBButton implements AfterViewInit {
+    protected readonly cls: (...args: import("../../utils").ClassNameArg[]) => string;
+    protected readonly getBoolean: (originBool?: boolean | string, propertyName?: string) => boolean | undefined;
+    protected readonly getHideProp: (show?: boolean | string) => any;
+    protected readonly getBooleanAsString: (originBool?: boolean | string) => any;
+    id: import("@angular/core").InputSignal<string | undefined>;
+    className: import("@angular/core").InputSignal<string | undefined>;
+    type: import("@angular/core").InputSignal<"button" | "reset" | "submit" | undefined>;
+    disabled: import("@angular/core").InputSignal<string | boolean | undefined>;
+    label: import("@angular/core").InputSignal<string | undefined>;
+    icon: import("@angular/core").InputSignal<import("@db-ux/core-foundations").BaseIconTypes | import("@db-ux/core-foundations").LooseAutocomplete | undefined>;
+    showIcon: import("@angular/core").InputSignal<string | boolean | undefined>;
+    size: import("@angular/core").InputSignal<"medium" | "small" | undefined>;
+    state: import("@angular/core").InputSignal<"loading" | undefined>;
+    width: import("@angular/core").InputSignal<string | undefined>;
+    variant: import("@angular/core").InputSignal<string | undefined>;
+    noText: import("@angular/core").InputSignal<string | boolean | undefined>;
+    name: import("@angular/core").InputSignal<string | undefined>;
+    form: import("@angular/core").InputSignal<string | undefined>;
+    value: import("@angular/core").InputSignal<string | undefined>;
+    describedbyid: import("@angular/core").InputSignal<string | undefined>;
+    ariaexpanded: import("@angular/core").InputSignal<boolean | undefined>;
+    ariapressed: import("@angular/core").InputSignal<boolean | undefined>;
+    text: import("@angular/core").InputSignal<string | undefined>;
+    click: import("@angular/core").OutputEmitterRef<void | MouseEvent>;
+    _ref: import("@angular/core").Signal<ElementRef<any> | undefined>;
+    handleClick(event: ClickEvent<HTMLButtonElement>): void;
+    constructor();
     /**
      * Passes `aria-*`, `data-*` & `class` attributes to correct child. Used in angular and stencil.
      * @param element  the ref for the component
@@ -35,5 +37,5 @@ export declare class DBButton {
     private enableAttributePassing;
     ngAfterViewInit(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<DBButton, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<DBButton, "db-button", never, { "id": { "alias": "id"; "required": false; }; "className": { "alias": "className"; "required": false; }; "type": { "alias": "type"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "label": { "alias": "label"; "required": false; }; "icon": { "alias": "icon"; "required": false; }; "showIcon": { "alias": "showIcon"; "required": false; }; "size": { "alias": "size"; "required": false; }; "state": { "alias": "state"; "required": false; }; "width": { "alias": "width"; "required": false; }; "variant": { "alias": "variant"; "required": false; }; "noText": { "alias": "noText"; "required": false; }; "name": { "alias": "name"; "required": false; }; "value": { "alias": "value"; "required": false; }; "describedbyid": { "alias": "describedbyid"; "required": false; }; "ariaexpanded": { "alias": "ariaexpanded"; "required": false; }; "ariapressed": { "alias": "ariapressed"; "required": false; }; "text": { "alias": "text"; "required": false; }; }, { "onClick": "onClick"; }, never, ["*"], true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<DBButton, "db-button", never, { "id": { "alias": "id"; "required": false; "isSignal": true; }; "className": { "alias": "className"; "required": false; "isSignal": true; }; "type": { "alias": "type"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "icon": { "alias": "icon"; "required": false; "isSignal": true; }; "showIcon": { "alias": "showIcon"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "state": { "alias": "state"; "required": false; "isSignal": true; }; "width": { "alias": "width"; "required": false; "isSignal": true; }; "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "noText": { "alias": "noText"; "required": false; "isSignal": true; }; "name": { "alias": "name"; "required": false; "isSignal": true; }; "form": { "alias": "form"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; "describedbyid": { "alias": "describedbyid"; "required": false; "isSignal": true; }; "ariaexpanded": { "alias": "ariaexpanded"; "required": false; "isSignal": true; }; "ariapressed": { "alias": "ariapressed"; "required": false; "isSignal": true; }; "text": { "alias": "text"; "required": false; "isSignal": true; }; }, { "click": "click"; }, never, ["*"], true, never>;
 }

package/components/button/model.d.ts

@@ -17,11 +17,11 @@ export type DBButtonDefaultProps = {
     /**
      * The disabled attribute can be set to [keep a user from clicking on the button](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#disabled).
      */
-    disabled?: boolean;
+    disabled?: boolean | string;
     /**
-     * Define the text next to the icon specified via the icon Property to get hidden.
+     * 	Associates the control with a form element
      */
-    noText?: boolean;
+    form?: string;
     /**
      * The label represents the [aria-label attributes](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-label) value of the button
      */
@@ -30,6 +30,14 @@ export type DBButtonDefaultProps = {
      * The name attribute specifies a [name attributes value](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#name) for the button.
      */
     name?: string;
+    /**
+     * Define the text next to the icon specified via the icon Property to get hidden.
+     */
+    noText?: boolean | string;
+    /**
+     * Show loading progress inside button.
+     */
+    state?: ButtonStateType;
     /**
      * The type attribute specifies the [type of button](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#type).
      */
@@ -38,10 +46,6 @@ export type DBButtonDefaultProps = {
      * The value attribute specifies an initial [value for the button](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#value).
      */
     value?: string;
-    /**
-     * Show loading progress inside button.
-     */
-    state?: ButtonStateType;
     /**
      * Variant of the button. Use only 1 primary button on a page as CTA otherwise use one of the adaptive buttons.
      */

package/components/card/card.d.ts

@@ -1,17 +1,17 @@
-import { EventEmitter, ElementRef } from "@angular/core";
-import type { DBCardProps, DBCardState } from "./model";
+import { AfterViewInit, ElementRef } from "@angular/core";
 import { ClickEvent } from "../../shared/model";
 import * as i0 from "@angular/core";
-export declare class DBCard {
-    cls: (...args: import("../../utils").ClassNameArg[]) => string;
-    id: DBCardProps["id"];
-    className: DBCardProps["className"];
-    behavior: DBCardProps["behavior"];
-    elevationLevel: DBCardProps["elevationLevel"];
-    spacing: DBCardProps["spacing"];
-    onClick: EventEmitter<any>;
-    _ref: ElementRef | undefined;
-    handleClick(event: ClickEvent<HTMLElement>): ReturnType<DBCardState["handleClick"]>;
+export declare class DBCard implements AfterViewInit {
+    protected readonly cls: (...args: import("../../utils").ClassNameArg[]) => string;
+    id: import("@angular/core").InputSignal<string | undefined>;
+    className: import("@angular/core").InputSignal<string | undefined>;
+    behavior: import("@angular/core").InputSignal<"static" | "interactive" | undefined>;
+    elevationLevel: import("@angular/core").InputSignal<"1" | "2" | "3" | undefined>;
+    spacing: import("@angular/core").InputSignal<string | undefined>;
+    click: import("@angular/core").OutputEmitterRef<void | MouseEvent>;
+    _ref: import("@angular/core").Signal<ElementRef<any> | undefined>;
+    handleClick(event: ClickEvent<HTMLElement>): void;
+    constructor();
     /**
      * Passes `aria-*`, `data-*` & `class` attributes to correct child. Used in angular and stencil.
      * @param element  the ref for the component
@@ -20,5 +20,5 @@ export declare class DBCard {
     private enableAttributePassing;
     ngAfterViewInit(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<DBCard, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<DBCard, "db-card", never, { "id": { "alias": "id"; "required": false; }; "className": { "alias": "className"; "required": false; }; "behavior": { "alias": "behavior"; "required": false; }; "elevationLevel": { "alias": "elevationLevel"; "required": false; }; "spacing": { "alias": "spacing"; "required": false; }; }, { "onClick": "onClick"; }, never, ["*"], true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<DBCard, "db-card", never, { "id": { "alias": "id"; "required": false; "isSignal": true; }; "className": { "alias": "className"; "required": false; "isSignal": true; }; "behavior": { "alias": "behavior"; "required": false; "isSignal": true; }; "elevationLevel": { "alias": "elevationLevel"; "required": false; "isSignal": true; }; "spacing": { "alias": "spacing"; "required": false; "isSignal": true; }; }, { "click": "click"; }, never, ["*"], true, never>;
 }

package/components/checkbox/checkbox.d.ts

@@ -1,50 +1,49 @@
-import { EventEmitter, ElementRef, SimpleChanges, Renderer2 } from "@angular/core";
+import { AfterViewInit, ElementRef, Renderer2 } from "@angular/core";
 import { ControlValueAccessor } from '@angular/forms';
-import { DBCheckboxProps, DBCheckboxState } from "./model";
 import { ChangeEvent, InteractionEvent } from "../../shared/model";
 import * as i0 from "@angular/core";
-export declare class DBCheckbox implements ControlValueAccessor {
+export declare class DBCheckbox implements AfterViewInit, ControlValueAccessor {
     private renderer;
+    protected readonly cls: (...args: import("../../utils").ClassNameArg[]) => string;
+    protected readonly getHideProp: (show?: boolean | string) => any;
+    protected readonly getBoolean: (originBool?: boolean | string, propertyName?: string) => boolean | undefined;
+    protected readonly stringPropVisible: (givenString?: string, showString?: boolean | string) => boolean;
+    protected readonly DEFAULT_VALID_MESSAGE: string;
+    id: import("@angular/core").InputSignal<string | undefined>;
+    invalidMessage: import("@angular/core").InputSignal<string | undefined>;
+    message: import("@angular/core").InputSignal<string | undefined>;
+    showMessage: import("@angular/core").InputSignal<string | boolean | undefined>;
+    indeterminate: import("@angular/core").InputSignal<string | boolean | undefined>;
+    checked: import("@angular/core").ModelSignal<string | boolean | undefined>;
+    validMessage: import("@angular/core").InputSignal<string | undefined>;
+    validation: import("@angular/core").InputSignal<"invalid" | "valid" | "no-validation" | undefined>;
+    required: import("@angular/core").InputSignal<string | boolean | undefined>;
+    className: import("@angular/core").InputSignal<string | undefined>;
+    size: import("@angular/core").InputSignal<"medium" | "small" | undefined>;
+    showLabel: import("@angular/core").InputSignal<string | boolean | undefined>;
+    name: import("@angular/core").InputSignal<string | undefined>;
+    disabled: import("@angular/core").ModelSignal<string | boolean | undefined>;
+    value: import("@angular/core").InputSignal<any>;
+    label: import("@angular/core").InputSignal<string | undefined>;
+    messageIcon: import("@angular/core").InputSignal<import("@db-ux/core-foundations").BaseIconTypes | import("@db-ux/core-foundations").LooseAutocomplete | undefined>;
+    change: import("@angular/core").OutputEmitterRef<void | Event>;
+    blur: import("@angular/core").OutputEmitterRef<void | FocusEvent>;
+    focus: import("@angular/core").OutputEmitterRef<void | FocusEvent>;
+    _ref: import("@angular/core").Signal<ElementRef<any> | undefined>;
+    initialized: import("@angular/core").WritableSignal<boolean>;
+    _id: import("@angular/core").WritableSignal<string | undefined>;
+    _messageId: import("@angular/core").WritableSignal<string | undefined>;
+    _validMessageId: import("@angular/core").WritableSignal<string | undefined>;
+    _invalidMessageId: import("@angular/core").WritableSignal<string | undefined>;
+    _invalidMessage: import("@angular/core").WritableSignal<string | undefined>;
+    _descByIds: import("@angular/core").WritableSignal<string | undefined>;
+    _voiceOverFallback: import("@angular/core").WritableSignal<string | undefined>;
+    hasValidState(): boolean;
+    handleValidation(): void;
+    handleChange(event: ChangeEvent<HTMLInputElement>): void;
+    handleBlur(event: InteractionEvent<HTMLInputElement> | any): void;
+    handleFocus(event: InteractionEvent<HTMLInputElement> | any): void;
     constructor(renderer: Renderer2);
-    DEFAULT_INVALID_MESSAGE: string;
-    DEFAULT_VALID_MESSAGE: string;
-    cls: (...args: import("../../utils").ClassNameArg[]) => string;
-    getHideProp: (show?: boolean | undefined) => any;
-    stringPropVisible: (givenString?: string | undefined, showString?: boolean | undefined) => string | boolean | undefined;
-    id: DBCheckboxProps["id"];
-    message: DBCheckboxProps["message"];
-    showMessage: DBCheckboxProps["showMessage"];
-    indeterminate: DBCheckboxProps["indeterminate"];
-    checked: DBCheckboxProps["checked"];
-    validation: DBCheckboxProps["validation"];
-    invalidMessage: DBCheckboxProps["invalidMessage"];
-    required: DBCheckboxProps["required"];
-    validMessage: DBCheckboxProps["validMessage"];
-    className: DBCheckboxProps["className"];
-    size: DBCheckboxProps["size"];
-    showLabel: DBCheckboxProps["showLabel"];
-    name: DBCheckboxProps["name"];
-    disabled: DBCheckboxProps["disabled"];
-    value: DBCheckboxProps["value"];
-    label: DBCheckboxProps["label"];
-    messageIcon: DBCheckboxProps["messageIcon"];
-    onChange: EventEmitter<any>;
-    change: EventEmitter<any>;
-    onBlur: EventEmitter<any>;
-    blur: EventEmitter<any>;
-    onFocus: EventEmitter<any>;
-    focus: EventEmitter<any>;
-    _ref: ElementRef | undefined;
-    initialized: DBCheckboxState["initialized"];
-    _id: DBCheckboxState["_id"];
-    _messageId: DBCheckboxState["_messageId"];
-    _validMessageId: DBCheckboxState["_validMessageId"];
-    _invalidMessageId: DBCheckboxState["_invalidMessageId"];
-    _descByIds: DBCheckboxState["_descByIds"];
-    _voiceOverFallback: DBCheckboxState["_voiceOverFallback"];
-    handleChange(event: ChangeEvent<HTMLInputElement>): ReturnType<DBCheckboxState["handleChange"]>;
-    handleBlur(event: InteractionEvent<HTMLInputElement>): ReturnType<DBCheckboxState["handleBlur"]>;
-    handleFocus(event: InteractionEvent<HTMLInputElement>): ReturnType<DBCheckboxState["handleFocus"]>;
     /**
      * Passes `aria-*`, `data-*` & `class` attributes to correct child. Used in angular and stencil.
      * @param element  the ref for the component
@@ -58,7 +57,6 @@ export declare class DBCheckbox implements ControlValueAccessor {
     setDisabledState(disabled: boolean): void;
     ngOnInit(): void;
     ngAfterViewInit(): void;
-    ngAfterContentChecked(changes: SimpleChanges): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<DBCheckbox, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<DBCheckbox, "db-checkbox", never, { "id": { "alias": "id"; "required": false; }; "message": { "alias": "message"; "required": false; }; "showMessage": { "alias": "showMessage"; "required": false; }; "indeterminate": { "alias": "indeterminate"; "required": false; }; "checked": { "alias": "checked"; "required": false; }; "validation": { "alias": "validation"; "required": false; }; "invalidMessage": { "alias": "invalidMessage"; "required": false; }; "required": { "alias": "required"; "required": false; }; "validMessage": { "alias": "validMessage"; "required": false; }; "className": { "alias": "className"; "required": false; }; "size": { "alias": "size"; "required": false; }; "showLabel": { "alias": "showLabel"; "required": false; }; "name": { "alias": "name"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "value": { "alias": "value"; "required": false; }; "label": { "alias": "label"; "required": false; }; "messageIcon": { "alias": "messageIcon"; "required": false; }; }, { "onChange": "onChange"; "change": "change"; "onBlur": "onBlur"; "blur": "blur"; "onFocus": "onFocus"; "focus": "focus"; }, never, ["*"], true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<DBCheckbox, "db-checkbox", never, { "id": { "alias": "id"; "required": false; "isSignal": true; }; "invalidMessage": { "alias": "invalidMessage"; "required": false; "isSignal": true; }; "message": { "alias": "message"; "required": false; "isSignal": true; }; "showMessage": { "alias": "showMessage"; "required": false; "isSignal": true; }; "indeterminate": { "alias": "indeterminate"; "required": false; "isSignal": true; }; "checked": { "alias": "checked"; "required": false; "isSignal": true; }; "validMessage": { "alias": "validMessage"; "required": false; "isSignal": true; }; "validation": { "alias": "validation"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "className": { "alias": "className"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "showLabel": { "alias": "showLabel"; "required": false; "isSignal": true; }; "name": { "alias": "name"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "messageIcon": { "alias": "messageIcon"; "required": false; "isSignal": true; }; }, { "checked": "checkedChange"; "disabled": "disabledChange"; "change": "change"; "blur": "blur"; "focus": "focus"; }, never, ["*"], true, never>;
 }

package/components/checkbox/model.d.ts

@@ -1,10 +1,10 @@
-import { ChangeEventProps, ChangeEventState, FocusEventProps, FocusEventState, FormCheckProps, FormMessageProps, FormProps, FormState, GlobalProps, GlobalState, InitializedState, SizeProps } from '../../shared/model';
+import { ChangeEventProps, ChangeEventState, FocusEventProps, FocusEventState, FormCheckProps, FormMessageProps, FormProps, FormState, FromValidState, GlobalProps, GlobalState, InitializedState, SizeProps } from '../../shared/model';
 export type DBCheckboxDefaultProps = {
     /**
      * Define an [indeterminate](https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement#indeterminate) state of a checkbox
      */
-    indeterminate?: boolean;
+    indeterminate?: boolean | string;
 };
 export type DBCheckboxProps = DBCheckboxDefaultProps & GlobalProps & ChangeEventProps<HTMLInputElement> & FocusEventProps<HTMLInputElement> & FormProps & FormCheckProps & FormMessageProps & SizeProps;
 export type DBCheckboxDefaultState = {};
-export type DBCheckboxState = DBCheckboxDefaultState & GlobalState & ChangeEventState<HTMLInputElement> & FocusEventState<HTMLInputElement> & FormState & InitializedState;
+export type DBCheckboxState = DBCheckboxDefaultState & GlobalState & ChangeEventState<HTMLInputElement> & FocusEventState<HTMLInputElement> & FormState & InitializedState & FromValidState;