@db-ux/ngx-core-components 3.0.2-copilot-66b0168 → 3.0.2-shell-ed0ed7c

package/components/navigation-item-group/navigation-item-group.d.ts

@@ -0,0 +1,49 @@
+import { ElementRef, AfterViewInit, InputSignal } from "@angular/core";
+import { ClickEvent } from "../../shared/model";
+import { NavigationItemSafeTriangle } from "../../utils/navigation";
+import { DBNavigationItemGroupProps } from "./model";
+import * as i0 from "@angular/core";
+export declare class DBNavigationItemGroup implements AfterViewInit {
+    protected readonly cls: (...args: import("../../utils").ClassNameArg[]) => string;
+    protected readonly getHideProp: (show?: boolean | string) => any;
+    protected readonly getBooleanAsString: (originBool?: boolean | string) => any;
+    protected readonly getBoolean: (originBool?: boolean | string, propertyName?: string) => boolean | undefined;
+    protected readonly DEFAULT_BACK: string;
+    expanded: InputSignal<DBNavigationItemGroupProps["expanded"]>;
+    id: InputSignal<DBNavigationItemGroupProps["id"]>;
+    className: InputSignal<DBNavigationItemGroupProps["className"]>;
+    icon: InputSignal<DBNavigationItemGroupProps["icon"]>;
+    showIcon: InputSignal<DBNavigationItemGroupProps["showIcon"]>;
+    active: InputSignal<DBNavigationItemGroupProps["active"]>;
+    disabled: InputSignal<DBNavigationItemGroupProps["disabled"]>;
+    text: InputSignal<DBNavigationItemGroupProps["text"]>;
+    backButtonId: InputSignal<DBNavigationItemGroupProps["backButtonId"]>;
+    backButtonText: InputSignal<DBNavigationItemGroupProps["backButtonText"]>;
+    click: import("@angular/core").OutputEmitterRef<void | MouseEvent>;
+    _ref: import("@angular/core").Signal<ElementRef<any> | undefined>;
+    _buttonRef: import("@angular/core").Signal<ElementRef<any> | undefined>;
+    _menuRef: import("@angular/core").Signal<ElementRef<any> | undefined>;
+    hasSubNavigation: import("@angular/core").WritableSignal<boolean | undefined>;
+    isSubNavigationExpanded: import("@angular/core").WritableSignal<boolean>;
+    autoClose: import("@angular/core").WritableSignal<boolean | undefined>;
+    hasPopup: import("@angular/core").WritableSignal<boolean | undefined>;
+    initialized: import("@angular/core").WritableSignal<boolean>;
+    subNavigationId: import("@angular/core").WritableSignal<string>;
+    navigationItemSafeTriangle: import("@angular/core").WritableSignal<NavigationItemSafeTriangle | undefined>;
+    onScroll(): void;
+    handleNavigationItemClick(event: any): void;
+    forceClose(): void;
+    handleClick(event: ClickEvent<HTMLButtonElement> | any): void;
+    handleBackClick(event: ClickEvent<HTMLButtonElement> | any): void;
+    handleEscape(event: any): void;
+    constructor();
+    /**
+     * Passes `aria-*`, `data-*` & `class` attributes to correct child. Used in angular and stencil.
+     * @param element  the ref for the component
+     * @param customElementSelector  the custom element like `my-component`
+     */
+    private enableAttributePassing;
+    ngAfterViewInit(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<DBNavigationItemGroup, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<DBNavigationItemGroup, "db-navigation-item-group", never, { "expanded": { "alias": "expanded"; "required": false; "isSignal": true; }; "id": { "alias": "id"; "required": false; "isSignal": true; }; "className": { "alias": "className"; "required": false; "isSignal": true; }; "icon": { "alias": "icon"; "required": false; "isSignal": true; }; "showIcon": { "alias": "showIcon"; "required": false; "isSignal": true; }; "active": { "alias": "active"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "text": { "alias": "text"; "required": false; "isSignal": true; }; "backButtonId": { "alias": "backButtonId"; "required": false; "isSignal": true; }; "backButtonText": { "alias": "backButtonText"; "required": false; "isSignal": true; }; }, { "click": "click"; }, never, ["[additional-information]", "*"], true, never>;
+}

package/components/notification/index.d.ts

@@ -0,0 +1 @@
+export { DBNotification } from './notification';

package/components/notification/model.d.ts

@@ -0,0 +1,57 @@
+import { ClickEvent, CloseEventProps, CloseEventState, GlobalProps, GlobalState, IconProps, InnerCloseButtonProps, PopoverProps, SemanticProps, ShowIconProps, TextProps } from '../../shared/model';
+export declare const NotificationVariantList: readonly ["docked", "standalone", "overlay"];
+export type NotificationVariantType = (typeof NotificationVariantList)[number];
+export declare const NotificationLinkVariantList: readonly ["block", "inline"];
+export type NotificationLinkVariantType = (typeof NotificationLinkVariantList)[number];
+export declare const NotificationAriaLiveList: readonly ["assertive", "polite", "off"];
+export type NotificationAriaLiveType = (typeof NotificationAriaLiveList)[number];
+export type DBNotificationDefaultProps = {
+    /**
+     * The arialive attribute will lead to that the screenreader interrupts immediately
+     * and reads out the notification if set to "assertive", while it will wait for the
+     * user's idleness when set to "polite", compare to [aria-live](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-live)
+     */
+    ariaLive?: NotificationAriaLiveType;
+    /**
+     * The closeable attribute shows/hides the close button on the top right.
+     */
+    closeable?: boolean | string;
+    /**
+     * The headline attribute changes the text of the bold headline.
+     */
+    headline?: string | any;
+    /**
+     * The slotImage can be set instead of an icon.
+     */
+    image?: any;
+    /**
+     * The slotLink can be set for non overlay-notifications
+     */
+    link?: any;
+    /**
+     * The linkVariant will be used if slotLink is set.
+     */
+    linkVariant?: NotificationLinkVariantType;
+    /**
+     * Enables or disables the visibility of the headline.
+     */
+    showHeadline?: boolean | string;
+    /**
+     * The timestamp attribute can be set for overlay notifications
+     */
+    timestamp?: string;
+    /**
+     * Enables or disables the visibility of the timestamp.
+     */
+    showTimestamp?: boolean | string;
+    /**
+     * The variant attribute changes the styling of the notification.
+     * - The docked notifications are used e.g. between header and main content to show a global alert.
+     * - The standalone notifications are used  e.g. inside a form to show an alert for a specific field.
+     * - The overlay notifications are used for absolute and floating notifications like snackbars etc.
+     */
+    variant?: NotificationVariantType;
+};
+export type DBNotificationProps = DBNotificationDefaultProps & GlobalProps & CloseEventProps<ClickEvent<HTMLButtonElement>> & IconProps & SemanticProps & InnerCloseButtonProps & PopoverProps & ShowIconProps & TextProps;
+export type DBNotificationDefaultState = {};
+export type DBNotificationState = DBNotificationDefaultState & GlobalState & CloseEventState<ClickEvent<HTMLButtonElement>>;

package/components/notification/notification.d.ts

@@ -0,0 +1,40 @@
+import { ElementRef, AfterViewInit, InputSignal } from "@angular/core";
+import { ClickEvent } from "../../shared/model";
+import { DBNotificationProps } from "./model";
+import * as i0 from "@angular/core";
+export declare class DBNotification implements AfterViewInit {
+    protected readonly cls: (...args: import("../../utils").ClassNameArg[]) => string;
+    protected readonly getBooleanAsString: (originBool?: boolean | string) => any;
+    protected readonly stringPropVisible: (givenString?: string, showString?: boolean | string) => boolean;
+    protected readonly getBoolean: (originBool?: boolean | string, propertyName?: string) => boolean | undefined;
+    protected readonly DEFAULT_CLOSE_BUTTON: string;
+    id: InputSignal<DBNotificationProps["id"]>;
+    className: InputSignal<DBNotificationProps["className"]>;
+    ariaLive: InputSignal<DBNotificationProps["ariaLive"]>;
+    semantic: InputSignal<DBNotificationProps["semantic"]>;
+    variant: InputSignal<DBNotificationProps["variant"]>;
+    icon: InputSignal<DBNotificationProps["icon"]>;
+    showIcon: InputSignal<DBNotificationProps["showIcon"]>;
+    linkVariant: InputSignal<DBNotificationProps["linkVariant"]>;
+    headline: InputSignal<DBNotificationProps["headline"]>;
+    showHeadline: InputSignal<DBNotificationProps["showHeadline"]>;
+    text: InputSignal<DBNotificationProps["text"]>;
+    timestamp: InputSignal<DBNotificationProps["timestamp"]>;
+    showTimestamp: InputSignal<DBNotificationProps["showTimestamp"]>;
+    closeable: InputSignal<DBNotificationProps["closeable"]>;
+    closeButtonId: InputSignal<DBNotificationProps["closeButtonId"]>;
+    closeButtonText: InputSignal<DBNotificationProps["closeButtonText"]>;
+    close: import("@angular/core").OutputEmitterRef<void | MouseEvent | undefined>;
+    _ref: import("@angular/core").Signal<ElementRef<any> | undefined>;
+    handleClose(event?: ClickEvent<HTMLButtonElement> | void): void;
+    constructor();
+    /**
+     * Passes `aria-*`, `data-*` & `class` attributes to correct child. Used in angular and stencil.
+     * @param element  the ref for the component
+     * @param customElementSelector  the custom element like `my-component`
+     */
+    private enableAttributePassing;
+    ngAfterViewInit(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<DBNotification, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<DBNotification, "db-notification", never, { "id": { "alias": "id"; "required": false; "isSignal": true; }; "className": { "alias": "className"; "required": false; "isSignal": true; }; "ariaLive": { "alias": "ariaLive"; "required": false; "isSignal": true; }; "semantic": { "alias": "semantic"; "required": false; "isSignal": true; }; "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "icon": { "alias": "icon"; "required": false; "isSignal": true; }; "showIcon": { "alias": "showIcon"; "required": false; "isSignal": true; }; "linkVariant": { "alias": "linkVariant"; "required": false; "isSignal": true; }; "headline": { "alias": "headline"; "required": false; "isSignal": true; }; "showHeadline": { "alias": "showHeadline"; "required": false; "isSignal": true; }; "text": { "alias": "text"; "required": false; "isSignal": true; }; "timestamp": { "alias": "timestamp"; "required": false; "isSignal": true; }; "showTimestamp": { "alias": "showTimestamp"; "required": false; "isSignal": true; }; "closeable": { "alias": "closeable"; "required": false; "isSignal": true; }; "closeButtonId": { "alias": "closeButtonId"; "required": false; "isSignal": true; }; "closeButtonText": { "alias": "closeButtonText"; "required": false; "isSignal": true; }; }, { "close": "close"; }, never, ["[image]", "*", "[link]"], true, never>;
+}

package/components/popover/index.d.ts

@@ -0,0 +1 @@
+export { DBPopover } from './popover';

package/components/popover/model.d.ts

@@ -0,0 +1,17 @@
+import { GapProps, GlobalProps, GlobalState, InitializedState, PlacementProps, PopoverProps, PopoverState, SpacingProps } from '../../shared/model';
+export type DBPopoverDefaultProps = {
+    /**
+     * Use open to disable the default hover/focus behavior to use it on click or other trigger.
+     */
+    open?: boolean | string;
+    /**
+     * The trigger to open the popover e.g. a button
+     */
+    trigger?: any;
+};
+export type DBPopoverProps = DBPopoverDefaultProps & GlobalProps & SpacingProps & PlacementProps & GapProps & PopoverProps;
+export type DBPopoverDefaultState = {
+    isExpanded?: boolean;
+    getTrigger: () => Element | null;
+};
+export type DBPopoverState = DBPopoverDefaultState & GlobalState & PopoverState & InitializedState;

package/components/popover/popover.d.ts

@@ -0,0 +1,37 @@
+import { ElementRef, AfterViewInit, InputSignal } from "@angular/core";
+import { DBPopoverProps } from "./model";
+import * as i0 from "@angular/core";
+export declare class DBPopover implements AfterViewInit {
+    protected readonly cls: (...args: import("../../utils").ClassNameArg[]) => string;
+    protected readonly getBooleanAsString: (originBool?: boolean | string) => any;
+    id: InputSignal<DBPopoverProps["id"]>;
+    className: InputSignal<DBPopoverProps["className"]>;
+    spacing: InputSignal<DBPopoverProps["spacing"]>;
+    gap: InputSignal<DBPopoverProps["gap"]>;
+    animation: InputSignal<DBPopoverProps["animation"]>;
+    open: InputSignal<DBPopoverProps["open"]>;
+    delay: InputSignal<DBPopoverProps["delay"]>;
+    width: InputSignal<DBPopoverProps["width"]>;
+    placement: InputSignal<DBPopoverProps["placement"]>;
+    _ref: import("@angular/core").Signal<ElementRef<any> | undefined>;
+    initialized: import("@angular/core").WritableSignal<boolean>;
+    isExpanded: import("@angular/core").WritableSignal<boolean | undefined>;
+    _documentScrollListenerCallbackId: import("@angular/core").WritableSignal<string | undefined>;
+    _observer: import("@angular/core").WritableSignal<IntersectionObserver | undefined>;
+    handleEscape(event: any): void;
+    handleAutoPlacement(): void;
+    handleDocumentScroll(event: any): void;
+    handleEnter(): void;
+    handleLeave(event?: any): void;
+    getTrigger(): Element | null;
+    constructor();
+    /**
+     * Passes `aria-*`, `data-*` & `class` attributes to correct child. Used in angular and stencil.
+     * @param element  the ref for the component
+     * @param customElementSelector  the custom element like `my-component`
+     */
+    private enableAttributePassing;
+    ngAfterViewInit(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<DBPopover, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<DBPopover, "db-popover", never, { "id": { "alias": "id"; "required": false; "isSignal": true; }; "className": { "alias": "className"; "required": false; "isSignal": true; }; "spacing": { "alias": "spacing"; "required": false; "isSignal": true; }; "gap": { "alias": "gap"; "required": false; "isSignal": true; }; "animation": { "alias": "animation"; "required": false; "isSignal": true; }; "open": { "alias": "open"; "required": false; "isSignal": true; }; "delay": { "alias": "delay"; "required": false; "isSignal": true; }; "width": { "alias": "width"; "required": false; "isSignal": true; }; "placement": { "alias": "placement"; "required": false; "isSignal": true; }; }, {}, never, ["[trigger]", "*"], true, never>;
+}

package/components/radio/index.d.ts

@@ -0,0 +1 @@
+export { DBRadio } from './radio';

package/components/radio/model.d.ts

@@ -0,0 +1,5 @@
+import { ChangeEventProps, ChangeEventState, FocusEventProps, FocusEventState, FormCheckProps, FormProps, FormState, GlobalProps, GlobalState, InitializedState, SizeProps } from '../../shared/model';
+export type DBRadioDefaultProps = {};
+export type DBRadioProps = DBRadioDefaultProps & GlobalProps & ChangeEventProps<HTMLInputElement> & FocusEventProps<HTMLInputElement> & FormProps & FormCheckProps & SizeProps;
+export type DBRadioDefaultState = {};
+export type DBRadioState = DBRadioDefaultState & GlobalState & ChangeEventState<HTMLInputElement> & FocusEventState<HTMLInputElement> & FormState & InitializedState;

package/components/radio/radio.d.ts

@@ -0,0 +1,47 @@
+import { ElementRef, AfterViewInit, InputSignal, ModelSignal, Renderer2 } from "@angular/core";
+import { ControlValueAccessor } from '@angular/forms';
+import { ChangeEvent, InteractionEvent } from "../../shared/model";
+import { DBRadioProps } from "./model";
+import * as i0 from "@angular/core";
+export declare class DBRadio implements AfterViewInit, ControlValueAccessor {
+    private renderer;
+    protected readonly getHideProp: (show?: boolean | string) => any;
+    protected readonly cls: (...args: import("../../utils").ClassNameArg[]) => string;
+    protected readonly getBoolean: (originBool?: boolean | string, propertyName?: string) => boolean | undefined;
+    id: InputSignal<DBRadioProps["id"]>;
+    checked: InputSignal<DBRadioProps["checked"]>;
+    size: InputSignal<DBRadioProps["size"]>;
+    showLabel: InputSignal<DBRadioProps["showLabel"]>;
+    showRequiredAsterisk: InputSignal<DBRadioProps["showRequiredAsterisk"]>;
+    className: InputSignal<DBRadioProps["className"]>;
+    validation: InputSignal<DBRadioProps["validation"]>;
+    name: InputSignal<DBRadioProps["name"]>;
+    disabled: ModelSignal<DBRadioProps["disabled"]>;
+    value: ModelSignal<DBRadioProps["value"]>;
+    required: InputSignal<DBRadioProps["required"]>;
+    label: InputSignal<DBRadioProps["label"]>;
+    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>;
+    handleChange(event: ChangeEvent<HTMLInputElement> | any): void;
+    handleBlur(event: InteractionEvent<HTMLInputElement> | any): void;
+    handleFocus(event: InteractionEvent<HTMLInputElement> | any): void;
+    constructor(renderer: Renderer2);
+    /**
+     * Passes `aria-*`, `data-*` & `class` attributes to correct child. Used in angular and stencil.
+     * @param element  the ref for the component
+     * @param customElementSelector  the custom element like `my-component`
+     */
+    private enableAttributePassing;
+    writeValue(value: any): void;
+    propagateChange(_: any): void;
+    registerOnChange(onChange: any): void;
+    registerOnTouched(onTouched: any): void;
+    setDisabledState(disabled: boolean): void;
+    ngAfterViewInit(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<DBRadio, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<DBRadio, "db-radio", never, { "id": { "alias": "id"; "required": false; "isSignal": true; }; "checked": { "alias": "checked"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "showLabel": { "alias": "showLabel"; "required": false; "isSignal": true; }; "showRequiredAsterisk": { "alias": "showRequiredAsterisk"; "required": false; "isSignal": true; }; "className": { "alias": "className"; "required": false; "isSignal": true; }; "validation": { "alias": "validation"; "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; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; }, { "disabled": "disabledChange"; "value": "valueChange"; "change": "change"; "blur": "blur"; "focus": "focus"; }, never, ["*"], true, never>;
+}

package/components/section/index.d.ts

@@ -0,0 +1 @@
+export { DBSection } from './section';

package/components/section/model.d.ts

@@ -0,0 +1,5 @@
+import { ContainerWidthProps, GlobalProps, GlobalState, SpacingProps } from '../../shared/model';
+export type DBSectionDefaultProps = {};
+export type DBSectionProps = DBSectionDefaultProps & GlobalProps & SpacingProps & ContainerWidthProps;
+export type DBSectionDefaultState = {};
+export type DBSectionState = DBSectionDefaultState & GlobalState;

package/components/section/section.d.ts

@@ -0,0 +1,22 @@
+import { ElementRef, AfterViewInit, InputSignal } from "@angular/core";
+import { DBSectionProps } from "./model";
+import * as i0 from "@angular/core";
+export declare class DBSection implements AfterViewInit {
+    protected readonly cls: (...args: import("../../utils").ClassNameArg[]) => string;
+    id: InputSignal<DBSectionProps["id"]>;
+    className: InputSignal<DBSectionProps["className"]>;
+    spacing: InputSignal<DBSectionProps["spacing"]>;
+    width: InputSignal<DBSectionProps["width"]>;
+    _ref: import("@angular/core").Signal<ElementRef<any> | undefined>;
+    _id: import("@angular/core").WritableSignal<string | undefined>;
+    constructor();
+    /**
+     * Passes `aria-*`, `data-*` & `class` attributes to correct child. Used in angular and stencil.
+     * @param element  the ref for the component
+     * @param customElementSelector  the custom element like `my-component`
+     */
+    private enableAttributePassing;
+    ngAfterViewInit(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<DBSection, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<DBSection, "db-section", never, { "id": { "alias": "id"; "required": false; "isSignal": true; }; "className": { "alias": "className"; "required": false; "isSignal": true; }; "spacing": { "alias": "spacing"; "required": false; "isSignal": true; }; "width": { "alias": "width"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
+}

package/components/select/index.d.ts

@@ -0,0 +1 @@
+export { DBSelect } from './select';

package/components/select/model.d.ts

@@ -0,0 +1,44 @@
+import { ChangeEventProps, ChangeEventState, ClickEventProps, ClickEventState, FocusEventProps, FocusEventState, FormMessageProps, FormProps, FormSizeProps, FormState, FromValidState, GlobalProps, GlobalState, IconProps, InitializedState, InputEventProps, InputEventState, ShowIconProps } from '../../shared/model';
+export type DBSelectDefaultProps = {
+    /**
+     * @deprecated
+     * Enables multiple select, but it isn't styled, please use DBCustomSelect/db-custom-select instead
+     */
+    multiple?: boolean;
+    /**
+     * If you don't/can't use children/slots you can pass in the options as an array.
+     */
+    options?: DBSelectOptionType[];
+};
+export type DBSelectOptionType = {
+    /**
+     * Identifier for option
+     */
+    id?: string;
+    /**
+     * Disables this option
+     */
+    disabled?: boolean;
+    /**
+     * Selects this option
+     */
+    selected?: boolean;
+    /**
+     * If the value is different from the label you want to show to the user.
+     */
+    label?: string;
+    /**
+     * If you want to use optgroup you can nest options here.
+     */
+    options?: DBSelectOptionType[];
+    /**
+     * The main value you select, will be shown as default label if no label is set.
+     */
+    value: string | string[] | number;
+};
+export type DBSelectProps = GlobalProps & ClickEventProps<HTMLSelectElement> & ChangeEventProps<HTMLSelectElement> & FocusEventProps<HTMLSelectElement> & InputEventProps<HTMLSelectElement> & FormProps & IconProps & FormMessageProps & DBSelectDefaultProps & ShowIconProps & FormSizeProps;
+export type DBSelectDefaultState = {
+    _placeholderId: string;
+    getOptionLabel: (option: DBSelectOptionType) => string;
+};
+export type DBSelectState = DBSelectDefaultState & GlobalState & ClickEventState<HTMLSelectElement> & ChangeEventState<HTMLSelectElement> & FocusEventState<HTMLSelectElement> & InputEventState<HTMLSelectElement> & FormState & InitializedState & FromValidState;

package/components/select/select.d.ts

@@ -0,0 +1,83 @@
+import { ElementRef, AfterViewInit, InputSignal, ModelSignal, Renderer2 } from "@angular/core";
+import { ControlValueAccessor } from '@angular/forms';
+import { ChangeEvent, ClickEvent, InputEvent, InteractionEvent } from "../../shared/model";
+import { DBSelectOptionType, DBSelectProps } from "./model";
+import * as i0 from "@angular/core";
+export declare class DBSelect implements AfterViewInit, ControlValueAccessor {
+    private renderer;
+    protected readonly cls: (...args: import("../../utils").ClassNameArg[]) => string;
+    protected readonly getHideProp: (show?: boolean | string) => any;
+    protected readonly getBooleanAsString: (originBool?: boolean | string) => any;
+    protected readonly DEFAULT_LABEL: string;
+    protected readonly getBoolean: (originBool?: boolean | string, propertyName?: string) => boolean | undefined;
+    protected readonly getOptionKey: (option: {
+        id?: string;
+        value?: string | number | string[] | undefined;
+    }, prefix: string) => string;
+    protected readonly stringPropVisible: (givenString?: string, showString?: boolean | string) => boolean;
+    protected readonly DEFAULT_VALID_MESSAGE: string;
+    id: InputSignal<DBSelectProps["id"]>;
+    invalidMessage: InputSignal<DBSelectProps["invalidMessage"]>;
+    message: InputSignal<DBSelectProps["message"]>;
+    showMessage: InputSignal<DBSelectProps["showMessage"]>;
+    value: ModelSignal<DBSelectProps["value"]>;
+    validMessage: InputSignal<DBSelectProps["validMessage"]>;
+    validation: InputSignal<DBSelectProps["validation"]>;
+    required: InputSignal<DBSelectProps["required"]>;
+    className: InputSignal<DBSelectProps["className"]>;
+    variant: InputSignal<DBSelectProps["variant"]>;
+    showLabel: InputSignal<DBSelectProps["showLabel"]>;
+    showRequiredAsterisk: InputSignal<DBSelectProps["showRequiredAsterisk"]>;
+    icon: InputSignal<DBSelectProps["icon"]>;
+    showIcon: InputSignal<DBSelectProps["showIcon"]>;
+    label: InputSignal<DBSelectProps["label"]>;
+    disabled: ModelSignal<DBSelectProps["disabled"]>;
+    name: InputSignal<DBSelectProps["name"]>;
+    size: InputSignal<DBSelectProps["size"]>;
+    autocomplete: InputSignal<DBSelectProps["autocomplete"]>;
+    multiple: InputSignal<DBSelectProps["multiple"]>;
+    ariaDescribedBy: InputSignal<DBSelectProps["ariaDescribedBy"]>;
+    options: InputSignal<DBSelectProps["options"]>;
+    placeholder: InputSignal<DBSelectProps["placeholder"]>;
+    messageIcon: InputSignal<DBSelectProps["messageIcon"]>;
+    click: import("@angular/core").OutputEmitterRef<void | MouseEvent>;
+    input: import("@angular/core").OutputEmitterRef<void | Event>;
+    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>;
+    _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>;
+    _placeholderId: import("@angular/core").WritableSignal<string>;
+    _descByIds: import("@angular/core").WritableSignal<string | undefined>;
+    _value: import("@angular/core").WritableSignal<string | undefined>;
+    initialized: import("@angular/core").WritableSignal<boolean>;
+    _voiceOverFallback: import("@angular/core").WritableSignal<string | undefined>;
+    hasValidState(): boolean;
+    handleValidation(): void;
+    handleClick(event: ClickEvent<HTMLSelectElement> | any): void;
+    handleInput(event: InputEvent<HTMLSelectElement> | any): void;
+    handleChange(event: ChangeEvent<HTMLSelectElement> | any): void;
+    handleBlur(event: InteractionEvent<HTMLSelectElement> | any): void;
+    handleFocus(event: InteractionEvent<HTMLSelectElement> | any): void;
+    getOptionLabel(option: DBSelectOptionType): string;
+    trackByOptgroupOption0(_: number, optgroupOption: any): string;
+    constructor(renderer: Renderer2);
+    /**
+     * Passes `aria-*`, `data-*` & `class` attributes to correct child. Used in angular and stencil.
+     * @param element  the ref for the component
+     * @param customElementSelector  the custom element like `my-component`
+     */
+    private enableAttributePassing;
+    writeValue(value: any): void;
+    propagateChange(_: any): void;
+    registerOnChange(onChange: any): void;
+    registerOnTouched(onTouched: any): void;
+    setDisabledState(disabled: boolean): void;
+    ngAfterViewInit(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<DBSelect, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<DBSelect, "db-select", 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; }; "value": { "alias": "value"; "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; }; "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "showLabel": { "alias": "showLabel"; "required": false; "isSignal": true; }; "showRequiredAsterisk": { "alias": "showRequiredAsterisk"; "required": false; "isSignal": true; }; "icon": { "alias": "icon"; "required": false; "isSignal": true; }; "showIcon": { "alias": "showIcon"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "name": { "alias": "name"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "autocomplete": { "alias": "autocomplete"; "required": false; "isSignal": true; }; "multiple": { "alias": "multiple"; "required": false; "isSignal": true; }; "ariaDescribedBy": { "alias": "ariaDescribedBy"; "required": false; "isSignal": true; }; "options": { "alias": "options"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "messageIcon": { "alias": "messageIcon"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "disabled": "disabledChange"; "click": "click"; "input": "input"; "change": "change"; "blur": "blur"; "focus": "focus"; }, never, ["*"], true, never>;
+}

package/components/shell/index.d.ts

@@ -0,0 +1 @@
+export { DBShell } from './shell';

package/components/shell/model.d.ts

@@ -0,0 +1,50 @@
+import { GlobalProps, GlobalState, ShellControlPanelDesktopPositionType, ShellControlPanelMobilePositionType } from '../../shared/model';
+export declare const ShellSubNavigationMobilePosition: readonly ["top", "bottom"];
+export type ShellSubNavigationMobilePositionType = (typeof ShellSubNavigationMobilePosition)[number];
+export type DBShellDefaultProps = {
+    /**
+     * The slot can be used for React to set a desktopControlPanel.
+     */
+    controlPanelDesktop?: any;
+    /**
+     * Change the position of the desktop content panel
+     */
+    controlPanelDesktopPosition?: ShellControlPanelDesktopPositionType;
+    /**
+     * The slot can be used for React to set a mobileControlPanel.
+     */
+    controlPanelMobile?: any;
+    /**
+     * Change the position of the mobile content panel
+     */
+    controlPanelMobilePosition?: ShellControlPanelMobilePositionType;
+    /**
+     * Set this to have a transition with opacity to avoid layout-shifts https://simonhearne.com/2021/layout-shifts-webfonts/
+     */
+    fadeIn?: boolean | string;
+    /**
+     * Adds `class` to `<main>` element
+     */
+    mainClass?: string;
+    /**
+     * The slot can be used for React to set a subNavigation.
+     */
+    subNavigation?: any;
+    /**
+     * Change the position of the optional sub navigation for desktop
+     */
+    subNavigationDesktopPosition?: ShellControlPanelDesktopPositionType;
+    /**
+     * Change the position of the optional sub navigation for mobile
+     */
+    subNavigationMobilePosition?: ShellSubNavigationMobilePositionType;
+    /**
+     * Shows sub-navigation
+     */
+    showSubNavigation?: boolean | string;
+};
+export type DBShellProps = DBShellDefaultProps & GlobalProps;
+export type DBShellDefaultState = {
+    fontsLoaded?: boolean;
+};
+export type DBShellState = DBShellDefaultState & GlobalState;

package/components/shell/shell.d.ts

@@ -0,0 +1,28 @@
+import { ElementRef, AfterViewInit, InputSignal } from "@angular/core";
+import { DBShellProps } from "./model";
+import * as i0 from "@angular/core";
+export declare class DBShell implements AfterViewInit {
+    protected readonly cls: (...args: import("../../utils").ClassNameArg[]) => string;
+    protected readonly getBooleanAsString: (originBool?: boolean | string) => any;
+    fadeIn: InputSignal<DBShellProps["fadeIn"]>;
+    id: InputSignal<DBShellProps["id"]>;
+    className: InputSignal<DBShellProps["className"]>;
+    controlPanelDesktopPosition: InputSignal<DBShellProps["controlPanelDesktopPosition"]>;
+    controlPanelMobilePosition: InputSignal<DBShellProps["controlPanelMobilePosition"]>;
+    subNavigationDesktopPosition: InputSignal<DBShellProps["subNavigationDesktopPosition"]>;
+    subNavigationMobilePosition: InputSignal<DBShellProps["subNavigationMobilePosition"]>;
+    showSubNavigation: InputSignal<DBShellProps["showSubNavigation"]>;
+    mainClass: InputSignal<DBShellProps["mainClass"]>;
+    _ref: import("@angular/core").Signal<ElementRef<any> | undefined>;
+    fontsLoaded: import("@angular/core").WritableSignal<boolean | undefined>;
+    constructor();
+    /**
+     * Passes `aria-*`, `data-*` & `class` attributes to correct child. Used in angular and stencil.
+     * @param element  the ref for the component
+     * @param customElementSelector  the custom element like `my-component`
+     */
+    private enableAttributePassing;
+    ngAfterViewInit(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<DBShell, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<DBShell, "db-shell", never, { "fadeIn": { "alias": "fadeIn"; "required": false; "isSignal": true; }; "id": { "alias": "id"; "required": false; "isSignal": true; }; "className": { "alias": "className"; "required": false; "isSignal": true; }; "controlPanelDesktopPosition": { "alias": "controlPanelDesktopPosition"; "required": false; "isSignal": true; }; "controlPanelMobilePosition": { "alias": "controlPanelMobilePosition"; "required": false; "isSignal": true; }; "subNavigationDesktopPosition": { "alias": "subNavigationDesktopPosition"; "required": false; "isSignal": true; }; "subNavigationMobilePosition": { "alias": "subNavigationMobilePosition"; "required": false; "isSignal": true; }; "showSubNavigation": { "alias": "showSubNavigation"; "required": false; "isSignal": true; }; "mainClass": { "alias": "mainClass"; "required": false; "isSignal": true; }; }, {}, never, ["[control-panel-desktop]", "[control-panel-mobile]", "[sub-navigation]", "*"], true, never>;
+}

package/components/shell-sub-navigation/index.d.ts

@@ -0,0 +1 @@
+export { DBShellSubNavigation } from './shell-sub-navigation';

package/components/shell-sub-navigation/model.d.ts

@@ -0,0 +1,5 @@
+import { GlobalProps, GlobalState, SidebarProps, SidebarState, ToggleEventState } from '../../shared/model';
+export type DBShellSubNavigationDefaultProps = {};
+export type DBShellSubNavigationProps = DBShellSubNavigationDefaultProps & GlobalProps & SidebarProps;
+export type DBShellSubNavigationDefaultState = {};
+export type DBShellSubNavigationState = DBShellSubNavigationDefaultState & GlobalState & ToggleEventState<HTMLButtonElement> & SidebarState;

package/components/shell-sub-navigation/shell-sub-navigation.d.ts

@@ -0,0 +1,27 @@
+import { ElementRef, AfterViewInit, InputSignal } from "@angular/core";
+import { DBShellSubNavigationProps } from "./model";
+import * as i0 from "@angular/core";
+export declare class DBShellSubNavigation implements AfterViewInit {
+    protected readonly getBooleanAsString: (originBool?: boolean | string) => any;
+    protected readonly cls: (...args: import("../../utils").ClassNameArg[]) => string;
+    expanded: InputSignal<DBShellSubNavigationProps["expanded"]>;
+    expandButtonTooltip: InputSignal<DBShellSubNavigationProps["expandButtonTooltip"]>;
+    id: InputSignal<DBShellSubNavigationProps["id"]>;
+    className: InputSignal<DBShellSubNavigationProps["className"]>;
+    _ref: import("@angular/core").Signal<ElementRef<any> | undefined>;
+    _id: import("@angular/core").WritableSignal<string | undefined>;
+    _open: import("@angular/core").WritableSignal<boolean>;
+    handleToggle(event: any): void;
+    getToggleButtonText(): string | undefined;
+    constructor();
+    /**
+     * Passes `aria-*`, `data-*` & `class` attributes to correct child. Used in angular and stencil.
+     * @param element  the ref for the component
+     * @param customElementSelector  the custom element like `my-component`
+     */
+    private enableAttributePassing;
+    ngOnInit(): void;
+    ngAfterViewInit(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<DBShellSubNavigation, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<DBShellSubNavigation, "db-shell-sub-navigation", never, { "expanded": { "alias": "expanded"; "required": false; "isSignal": true; }; "expandButtonTooltip": { "alias": "expandButtonTooltip"; "required": false; "isSignal": true; }; "id": { "alias": "id"; "required": false; "isSignal": true; }; "className": { "alias": "className"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
+}

package/components/stack/index.d.ts

@@ -0,0 +1 @@
+export { DBStack } from './stack';

package/components/stack/model.d.ts

@@ -0,0 +1,34 @@
+import { GapSpacingProps, GlobalProps, GlobalState } from '../../shared/model';
+export declare const StackVariantList: readonly ["simple", "divider"];
+export type StackVariantType = (typeof StackVariantList)[number];
+export declare const StackDirectionList: readonly ["row", "column"];
+export type StackDirectionType = (typeof StackDirectionList)[number];
+export declare const StackAlignmentList: readonly ["stretch", "start", "end", "center"];
+export type StackAlignmentType = (typeof StackAlignmentList)[number];
+export declare const StackJustifyContentList: readonly ["space-between", "start", "end", "center"];
+export type StackJustifyContentType = (typeof StackJustifyContentList)[number];
+export type DBStackDefaultProps = {
+    /**
+     * Change variant of stack. To use variant="divider" add a DBDivider after each element
+     */
+    variant?: StackVariantType;
+    /**
+     * Set the direction of the stack. Defaults to "column"
+     */
+    direction?: StackDirectionType;
+    /**
+     * If the stack should wrap if parent is too small otherwise you get an overflow
+     */
+    wrap?: boolean | string;
+    /**
+     * Represents css align-items
+     */
+    alignment?: StackAlignmentType;
+    /**
+     * Represents css justify-content
+     */
+    justifyContent?: StackJustifyContentType;
+};
+export type DBStackProps = DBStackDefaultProps & GlobalProps & GapSpacingProps;
+export type DBStackDefaultState = {};
+export type DBStackState = DBStackDefaultState & GlobalState;