@public-ui/components 4.1.2-rc.3 → 4.1.2-rc.4

package/dist/types/components/popover-button/component.d.ts

@@ -1,19 +1,19 @@
 import type { JSX } from '../../stencil-public-runtime';
-import type { AccessKeyPropType, AriaDescriptionPropType, ButtonTypePropType, ButtonVariantPropType, CustomClassPropType, IconsPropType, IdPropType, InlinePropType, LabelWithExpertSlotPropType, PopoverAlignPropType, ShortKeyPropType, StencilUnknown, SyncValueBySelectorPropType, TooltipAlignPropType } from '../../schema';
+import type { AccessKeyPropType, AriaDescriptionPropType, ButtonTypePropType, ButtonVariantPropType, CustomClassPropType, FocusableElement, IconsPropType, IdPropType, InlinePropType, LabelWithExpertSlotPropType, PopoverAlignPropType, ShortKeyPropType, StencilUnknown, SyncValueBySelectorPropType, TooltipAlignPropType } from '../../schema';
 import type { PopoverButtonProps, PopoverButtonStates } from '../../schema/components/popover-button';
-export declare class KolPopoverButton implements PopoverButtonProps {
+export declare class KolPopoverButtonWc implements PopoverButtonProps, FocusableElement {
     private refButton?;
     private readonly popoverCtrl;
     private popoverElement?;
     private readonly popoverId;
-    private setPopoverElementRef;
-    private setButtonElementRef;
+    private readonly setPopoverElementRef;
+    private readonly setButtonElementRef;
     private on;
     state: PopoverButtonStates;
     private popoverOpen;
     hidePopover(): Promise<void>;
     showPopover(): Promise<void>;
-    focus(): Promise<void | undefined>;
+    focus(): Promise<void>;
     private handleToggle;
     render(): JSX.Element;
     _accessKey?: AccessKeyPropType;

package/dist/types/components/popover-button/shadow.d.ts

@@ -1,12 +1,13 @@
 import type { JSX } from '../../stencil-public-runtime';
-import type { AccessKeyPropType, AriaDescriptionPropType, ButtonTypePropType, ButtonVariantPropType, CustomClassPropType, IconsPropType, InlinePropType, LabelWithExpertSlotPropType, PopoverAlignPropType, ShortKeyPropType, StencilUnknown, SyncValueBySelectorPropType, TooltipAlignPropType } from '../../schema';
+import type { AccessKeyPropType, AriaDescriptionPropType, ButtonTypePropType, ButtonVariantPropType, CustomClassPropType, FocusableElement, IconsPropType, InlinePropType, LabelWithExpertSlotPropType, PopoverAlignPropType, ShortKeyPropType, StencilUnknown, SyncValueBySelectorPropType, TooltipAlignPropType } from '../../schema';
 import type { PopoverButtonProps } from '../../schema/components/popover-button';
-export declare class KolPopoverButton implements PopoverButtonProps {
+export declare class KolPopoverButton implements PopoverButtonProps, FocusableElement {
+    private readonly host?;
     private ref?;
     hidePopover(): Promise<void>;
     showPopover(): Promise<void>;
-    private catchRef;
-    focus(): Promise<any>;
+    private readonly setRef;
+    focus(): Promise<void>;
     render(): JSX.Element;
     _accessKey?: AccessKeyPropType;
     _ariaDescription?: AriaDescriptionPropType;

package/dist/types/components/select/component.d.ts

@@ -3,7 +3,7 @@ import type { DisabledPropType, FocusableElement, HideLabelPropType, HideMsgProp
 export declare class KolSelectWc implements SelectAPI, FocusableElement {
     private readonly host?;
     private selectRef?;
-    private readonly catchRef;
+    private readonly setSelectRef;
     getValue(): Promise<StencilUnknown[] | StencilUnknown>;
     focus(): Promise<void>;
     private getFormFieldProps;

package/dist/types/components/select/shadow.d.ts

@@ -1,10 +1,11 @@
 import type { JSX } from '../../stencil-public-runtime';
 import type { FocusableElement, IconsHorizontalPropType, InputTypeOnDefault, LabelWithExpertSlotPropType, MsgPropType, NamePropType, OptionsWithOptgroupPropType, RowsPropType, SelectProps, ShortKeyPropType, StencilUnknown, Stringified, SyncValueBySelectorPropType, TooltipAlignPropType } from '../../schema';
 export declare class KolSelect implements SelectProps, FocusableElement {
+    private readonly host?;
     private selectWcRef?;
-    private readonly catchRef;
+    private readonly setSelectWcRef;
     getValue(): Promise<StencilUnknown[] | StencilUnknown>;
-    focus(): Promise<void | undefined>;
+    focus(): Promise<void>;
     render(): JSX.Element;
     _accessKey?: string;
     _disabled?: boolean;

package/dist/types/components/single-select/shadow.d.ts

@@ -1,6 +1,6 @@
 import type { JSX } from '../../stencil-public-runtime';
-import type { DisabledPropType, HideLabelPropType, HideMsgPropType, HintPropType, IconsHorizontalPropType, InputTypeOnDefault, LabelWithExpertSlotPropType, MsgPropType, NamePropType, OptionsPropType, PlaceholderPropType, RequiredPropType, RowsPropType, ShortKeyPropType, SingleSelectAPI, SingleSelectStates, StencilUnknown, Stringified, SyncValueBySelectorPropType, TooltipAlignPropType } from '../../schema';
-export declare class KolSingleSelect implements SingleSelectAPI {
+import type { DisabledPropType, FocusableElement, HideLabelPropType, HideMsgPropType, HintPropType, IconsHorizontalPropType, InputTypeOnDefault, LabelWithExpertSlotPropType, MsgPropType, NamePropType, OptionsPropType, PlaceholderPropType, RequiredPropType, RowsPropType, ShortKeyPropType, SingleSelectAPI, SingleSelectStates, StencilUnknown, Stringified, SyncValueBySelectorPropType, TooltipAlignPropType } from '../../schema';
+export declare class KolSingleSelect implements SingleSelectAPI, FocusableElement {
     private readonly host?;
     private refInput?;
     private refOptions;
@@ -10,7 +10,7 @@ export declare class KolSingleSelect implements SingleSelectAPI {
     private isClearing;
     getValue(): Promise<StencilUnknown>;
     focus(): Promise<void>;
-    private readonly catchRef;
+    private readonly setRefInput;
     private toggleListbox;
     private onBlur;
     private createEventWithTarget;

package/dist/types/components/skip-nav/shadow.d.ts

@@ -1,9 +1,10 @@
-import type { LabelPropType, LinkProps, SkipNavAPI, SkipNavStates, Stringified } from '../../schema';
+import type { FocusableElement, LabelPropType, LinkProps, SkipNavAPI, SkipNavStates, Stringified } from '../../schema';
 import type { JSX } from '../../stencil-public-runtime';
-export declare class KolSkipNav implements SkipNavAPI {
+export declare class KolSkipNav implements SkipNavAPI, FocusableElement {
+    private readonly host?;
     private firstLinkRef?;
     render(): JSX.Element;
-    focus(): Promise<void | undefined>;
+    focus(): Promise<void>;
     _label: LabelPropType;
     _links: Stringified<LinkProps[]>;
     state: SkipNavStates;

package/dist/types/components/split-button/shadow.d.ts

@@ -1,12 +1,13 @@
 import type { JSX } from '../../stencil-public-runtime';
-import type { AccessKeyPropType, AlternativeButtonLinkRolePropType, AriaDescriptionPropType, ButtonCallbacksPropType, ButtonTypePropType, ButtonVariantPropType, CustomClassPropType, IconsPropType, LabelWithExpertSlotPropType, ShortKeyPropType, SplitButtonProps, SplitButtonStates, StencilUnknown, SyncValueBySelectorPropType, TooltipAlignPropType } from '../../schema';
-export declare class KolSplitButton implements SplitButtonProps {
+import type { AccessKeyPropType, AlternativeButtonLinkRolePropType, AriaDescriptionPropType, ButtonCallbacksPropType, ButtonTypePropType, ButtonVariantPropType, CustomClassPropType, FocusableElement, IconsPropType, LabelWithExpertSlotPropType, ShortKeyPropType, SplitButtonProps, SplitButtonStates, StencilUnknown, SyncValueBySelectorPropType, TooltipAlignPropType } from '../../schema';
+export declare class KolSplitButton implements SplitButtonProps, FocusableElement {
+    private readonly host?;
     private primaryButtonWcRef?;
     private popoverButtonRef?;
-    private readonly catchPrimaryRef;
-    private readonly catchPopoverButtonRef;
+    private readonly setPrimaryButtonWcRef;
+    private readonly setPopoverButtonRef;
     getValue(): Promise<StencilUnknown>;
-    focus(): Promise<void | undefined>;
+    focus(): Promise<void>;
     private readonly clickButtonHandler;
     render(): JSX.Element;
     connectedCallback(): void;

package/dist/types/components/table-stateless/component.d.ts

@@ -1,6 +1,6 @@
 import type { JSX } from '../../stencil-public-runtime';
 import type { FixedColsPropType, HasSettingsMenuPropType, KoliBriTableHeaderCell, LabelPropType, TableCallbacksPropType, TableDataFootPropType, TableDataPropType, TableHeaderCellsPropType, TableSelectionPropType, TableStatelessAPI, TableStatelessStates } from '../../schema';
-export declare class KolTableStateless implements TableStatelessAPI {
+export declare class KolTableStatelessWc implements TableStatelessAPI {
     private readonly host?;
     private readonly translateNoEntries;
     state: TableStatelessStates;

package/dist/types/components/tabs/shadow.d.ts

@@ -1,11 +1,12 @@
 import type { JSX } from '../../stencil-public-runtime';
-import type { AlignPropType, KoliBriTabsCallbacks, LabelPropType, Stringified, TabBehaviorPropType, TabButtonProps, TabsAPI, TabsStates } from '../../schema';
+import type { AlignPropType, FocusableElement, KoliBriTabsCallbacks, LabelPropType, Stringified, TabBehaviorPropType, TabButtonProps, TabsAPI, TabsStates } from '../../schema';
 import type { HasCreateButtonPropType } from '../../schema/props/has-create-button';
-export declare class KolTabs implements TabsAPI {
+export declare class KolTabs implements TabsAPI, FocusableElement {
     private readonly host?;
     private tabPanelsElement?;
     private onCreateLabel;
     private currentFocusIndex;
+    private currentTabButtonRef?;
     private nextPossibleTabIndex;
     private prevPossibleTabIndex;
     private onKeyDown;
@@ -18,6 +19,8 @@ export declare class KolTabs implements TabsAPI {
     private selectNextTabEvent;
     private readonly onMouseDown;
     private readonly callbacks;
+    focus(): Promise<void>;
+    private readonly setCurrentTabButtonRef;
     private renderButtonGroup;
     private tabPanelHost?;
     private readonly catchTabPanelHost;

package/dist/types/components/textarea/shadow.d.ts

@@ -3,7 +3,7 @@ import type { AdjustHeightPropType, DisabledPropType, FocusableElement, HasCount
 export declare class KolTextarea implements TextareaAPI, FocusableElement {
     private readonly host?;
     private textareaRef?;
-    private readonly catchRef;
+    private readonly setTextareaRef;
     getValue(): Promise<string | undefined>;
     focus(): Promise<void>;
     private getFormFieldProps;

package/dist/types/components/toolbar/shadow.d.ts

@@ -1,11 +1,12 @@
 import type { JSX } from '../../stencil-public-runtime';
-import type { LabelPropType, ToolbarAPI, ToolbarItemsPropType, ToolbarStates } from '../../schema';
+import type { FocusableElement, LabelPropType, ToolbarAPI, ToolbarItemsPropType, ToolbarStates } from '../../schema';
 import type { OrientationPropType } from '../../schema/props/orientation';
-export declare class KolToolbar implements ToolbarAPI {
-    host: HTMLElement;
+export declare class KolToolbar implements ToolbarAPI, FocusableElement {
+    private readonly host?;
     state: ToolbarStates;
     private currentIndex;
     private indexToElement;
+    focus(): Promise<void>;
     private normalizeItem;
     private renderItem;
     render(): JSX.Element;

package/dist/types/components/tooltip/component.d.ts

@@ -1,7 +1,7 @@
 import type { JSX } from '../../stencil-public-runtime';
 import type { AlignPropType, BadgeTextPropType, IdPropType, LabelPropType, TooltipAPI, TooltipStates } from '../../schema';
 export declare class KolTooltipWc implements TooltipAPI {
-    private host?;
+    private readonly host?;
     private arrowElement?;
     private previousSibling?;
     private parentElement?;

package/dist/types/components/tree/component.d.ts

@@ -1,12 +1,17 @@
 import type { JSX } from '../../stencil-public-runtime';
-import type { LabelPropType, TreeAPI, TreeStates } from '../../schema';
-export declare class KolTreeWc implements TreeAPI {
-    host: HTMLElement;
+import type { FocusableElement, LabelPropType, TreeAPI, TreeStates } from '../../schema';
+export declare class KolTreeWc implements TreeAPI, FocusableElement {
+    private readonly host?;
     state: TreeStates;
     private observer?;
     private treeItemElements?;
+    private cachedOpenItems?;
+    private cacheValid;
+    private rafHandle?;
     _label: LabelPropType;
     validateLabel(value?: LabelPropType): void;
+    focus(): Promise<void>;
+    invalidateOpenItemsCache(): Promise<void>;
     render(): JSX.Element;
     private static isTreeItem;
     componentWillLoad(): void;
@@ -14,11 +19,13 @@ export declare class KolTreeWc implements TreeAPI {
     private observeChildListMutations;
     private handleSlotchange;
     private observeTopLevelItems;
+    private scheduleTreeChange;
     private getTopLevelTreeItems;
     private handleTreeChange;
     private getTreeItemElements;
     private getOpenTreeItemElements;
     handleKeyDown(event: KeyboardEvent): Promise<void>;
-    handleFocusOut(event: FocusEvent): Promise<void>;
+    handleFocusIn(event: FocusEvent): void;
+    handleFocusOut(event: FocusEvent): void;
     private ensureActiveItemVisibility;
 }

package/dist/types/components/tree/shadow.d.ts

@@ -1,6 +1,10 @@
 import type { JSX } from '../../stencil-public-runtime';
-import type { LabelPropType, TreeProps } from '../../schema';
-export declare class KolTree implements TreeProps {
+import type { FocusableElement, LabelPropType, TreeProps } from '../../schema';
+export declare class KolTree implements TreeProps, FocusableElement {
+    private readonly host?;
+    private treeWcRef?;
+    private readonly setTreeWcRef;
     _label: LabelPropType;
+    focus(): Promise<void>;
     render(): JSX.Element;
 }

package/dist/types/components/tree-item/component.d.ts

@@ -1,10 +1,10 @@
 import { type JSX } from '../../stencil-public-runtime';
 import type { ActivePropType, HrefPropType, LabelPropType, OpenPropType, TreeItemAPI, TreeItemStates } from '../../schema';
 export declare class KolTreeItemWc implements TreeItemAPI {
+    private readonly host?;
     private linkElement?;
     private groupId;
     private level?;
-    host: HTMLElement;
     render(): JSX.Element;
     state: TreeItemStates;
     _active?: OpenPropType;
@@ -19,7 +19,8 @@ export declare class KolTreeItemWc implements TreeItemAPI {
     private determineTreeItemDepth;
     private handleSlotchange;
     private checkForChildren;
-    focus(): Promise<void | undefined>;
+    private getTreeParent;
+    focus(): Promise<void>;
     private handleExpandClick;
     expand(): Promise<void>;
     private handleCollapseClick;

package/dist/types/components.d.ts

@@ -66,7 +66,7 @@ export namespace Components {
         /**
           * Sets focus on the internal element.
          */
-        "focus": () => Promise<void | undefined>;
+        "focus": () => Promise<void>;
     }
     /**
      * The **Alert** component provides visual feedback to users. It consists of a color-coded container, a heading, content text, and an icon. The icon used and the color scheme depend on the `_type` of the alert.
@@ -295,7 +295,7 @@ export namespace Components {
         /**
           * Sets focus on the internal element.
          */
-        "focus": () => Promise<void | undefined>;
+        "focus": () => Promise<void>;
         /**
           * Returns the current value.
          */
@@ -398,7 +398,7 @@ export namespace Components {
         /**
           * Sets focus on the internal element.
          */
-        "focus": () => Promise<void | undefined>;
+        "focus": () => Promise<void>;
         /**
           * Returns the current value.
          */
@@ -699,7 +699,7 @@ export namespace Components {
         /**
           * Sets focus on the internal element.
          */
-        "focus": () => Promise<void | undefined>;
+        "focus": () => Promise<void>;
     }
     interface KolDialog {
         /**
@@ -814,9 +814,6 @@ export namespace Components {
          */
         "focusErrorList": () => Promise<void>;
     }
-    /**
-     * The **Heading** component can be used wherever a heading needs to be displayed. By using the different sizes, content can be clearly structured and pages can be presented effectively and with variety. It separates styling from semantics and enables flexibility.
-     */
     interface KolHeading {
         /**
           * Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.). Set to `false` to enable the expert slot.
@@ -2148,7 +2145,7 @@ export namespace Components {
         /**
           * Sets focus on the internal element.
          */
-        "focus": () => Promise<void | undefined>;
+        "focus": () => Promise<void>;
     }
     /**
      * The **LinkButton** component is semantically a link but has the appearance of a button. All relevant properties of the Link component are adopted and extended with the design-defining properties of a button.
@@ -2231,7 +2228,7 @@ export namespace Components {
         /**
           * Sets focus on the internal element.
          */
-        "focus": () => Promise<void | undefined>;
+        "focus": () => Promise<void>;
     }
     interface KolLinkWc {
         /**
@@ -2585,7 +2582,7 @@ export namespace Components {
         /**
           * Sets focus on the internal element.
          */
-        "focus": () => Promise<any>;
+        "focus": () => Promise<void>;
         /**
           * Hides the popover programmatically by forwarding the call to the web component.
          */
@@ -2679,7 +2676,7 @@ export namespace Components {
         /**
           * Sets focus on the internal element.
          */
-        "focus": () => Promise<void | undefined>;
+        "focus": () => Promise<void>;
         /**
           * Hides the popover programmatically by calling the PopoverController.
          */
@@ -2834,7 +2831,7 @@ export namespace Components {
         /**
           * Sets focus on the internal element.
          */
-        "focus": () => Promise<void | undefined>;
+        "focus": () => Promise<void>;
         /**
           * Returns the selected values.
          */
@@ -3079,7 +3076,7 @@ export namespace Components {
         /**
           * Sets focus on the internal element.
          */
-        "focus": () => Promise<void | undefined>;
+        "focus": () => Promise<void>;
     }
     /**
      * The **Spin** component informs users about loading or processing operations being performed by the system. Progress can be communicated through a repeated animation.
@@ -3196,7 +3193,7 @@ export namespace Components {
         /**
           * Sets focus on the internal element.
          */
-        "focus": () => Promise<void | undefined>;
+        "focus": () => Promise<void>;
         /**
           * Returns the current value.
          */
@@ -3366,6 +3363,10 @@ export namespace Components {
           * Defines the tab captions.
          */
         "_tabs": Stringified<TabButtonProps[]>;
+        /**
+          * Sets focus on the current tab button.
+         */
+        "focus": () => Promise<void>;
     }
     /**
      * The **Textarea** component provides a larger input field for content. Unlike InputText, it also allows extensive content to be entered, including line breaks.
@@ -3525,6 +3526,10 @@ export namespace Components {
           * Defines whether the orientation of the component is horizontal or vertical.
          */
         "_orientation"?: OrientationPropType;
+        /**
+          * Sets focus on the currently active toolbar item.
+         */
+        "focus": () => Promise<void>;
     }
     interface KolTooltipWc {
         /**
@@ -3554,6 +3559,10 @@ export namespace Components {
           * Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.).
          */
         "_label": LabelPropType;
+        /**
+          * Sets focus on the first focusable tree item.
+         */
+        "focus": () => Promise<void>;
     }
     interface KolTreeItem {
         /**
@@ -3617,7 +3626,7 @@ export namespace Components {
         /**
           * Focuses the link element.
          */
-        "focus": () => Promise<void | undefined>;
+        "focus": () => Promise<void>;
         /**
           * Returns whether the tree item is expanded.
          */
@@ -3628,6 +3637,14 @@ export namespace Components {
           * Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.).
          */
         "_label": LabelPropType;
+        /**
+          * Sets focus on the first focusable tree item.
+         */
+        "focus": () => Promise<void>;
+        /**
+          * Invalidates the cache for open tree items. Called by tree-item when expand/collapse occurs.
+         */
+        "invalidateOpenItemsCache": () => Promise<void>;
     }
     interface KolVersion {
         /**
@@ -3661,7 +3678,7 @@ declare global {
         /**
           * Sets focus on the internal element.
          */
-        "focus": () => Promise<void | undefined>;
+        "focus": () => Promise<void>;
     }
     var HTMLKolAccordionElement: {
         prototype: HTMLKolAccordionElement;
@@ -3721,7 +3738,7 @@ declare global {
         /**
           * Sets focus on the internal element.
          */
-        "focus": () => Promise<void | undefined>;
+        "focus": () => Promise<void>;
     }
     var HTMLKolButtonElement: {
         prototype: HTMLKolButtonElement;
@@ -3738,7 +3755,7 @@ declare global {
         /**
           * Sets focus on the internal element.
          */
-        "focus": () => Promise<void | undefined>;
+        "focus": () => Promise<void>;
     }
     var HTMLKolButtonLinkElement: {
         prototype: HTMLKolButtonLinkElement;
@@ -3803,7 +3820,7 @@ declare global {
         /**
           * Sets focus on the internal element.
          */
-        "focus": () => Promise<void | undefined>;
+        "focus": () => Promise<void>;
     }
     var HTMLKolDetailsElement: {
         prototype: HTMLKolDetailsElement;
@@ -3839,9 +3856,6 @@ declare global {
         prototype: HTMLKolFormElement;
         new (): HTMLKolFormElement;
     };
-    /**
-     * The **Heading** component can be used wherever a heading needs to be displayed. By using the different sizes, content can be clearly structured and pages can be presented effectively and with variety. It separates styling from semantics and enables flexibility.
-     */
     interface HTMLKolHeadingElement extends Components.KolHeading, HTMLStencilElement {
     }
     var HTMLKolHeadingElement: {
@@ -4006,7 +4020,7 @@ declare global {
         /**
           * Sets focus on the internal element.
          */
-        "focus": () => Promise<void | undefined>;
+        "focus": () => Promise<void>;
     }
     var HTMLKolLinkElement: {
         prototype: HTMLKolLinkElement;
@@ -4019,7 +4033,7 @@ declare global {
         /**
           * Sets focus on the internal element.
          */
-        "focus": () => Promise<void | undefined>;
+        "focus": () => Promise<void>;
     }
     var HTMLKolLinkButtonElement: {
         prototype: HTMLKolLinkButtonElement;
@@ -4083,7 +4097,7 @@ declare global {
         /**
           * Sets focus on the internal element.
          */
-        "focus": () => Promise<any>;
+        "focus": () => Promise<void>;
     }
     var HTMLKolPopoverButtonElement: {
         prototype: HTMLKolPopoverButtonElement;
@@ -4101,7 +4115,7 @@ declare global {
         /**
           * Sets focus on the internal element.
          */
-        "focus": () => Promise<void | undefined>;
+        "focus": () => Promise<void>;
     }
     var HTMLKolPopoverButtonWcElement: {
         prototype: HTMLKolPopoverButtonWcElement;
@@ -4129,7 +4143,7 @@ declare global {
         /**
           * Sets focus on the internal element.
          */
-        "focus": () => Promise<void | undefined>;
+        "focus": () => Promise<void>;
     }
     var HTMLKolSelectElement: {
         prototype: HTMLKolSelectElement;
@@ -4187,7 +4201,7 @@ declare global {
         /**
           * Sets focus on the internal element.
          */
-        "focus": () => Promise<void | undefined>;
+        "focus": () => Promise<void>;
     }
     var HTMLKolSkipNavElement: {
         prototype: HTMLKolSkipNavElement;
@@ -4210,7 +4224,7 @@ declare global {
         /**
           * Sets focus on the internal element.
          */
-        "focus": () => Promise<void | undefined>;
+        "focus": () => Promise<void>;
     }
     var HTMLKolSplitButtonElement: {
         prototype: HTMLKolSplitButtonElement;
@@ -4246,7 +4260,11 @@ declare global {
     /**
      * The **Tabs** component is used to organize related content on the same page and navigate between them. Tabs ensure that large amounts of content can be more easily organized for users.
      */
-    interface HTMLKolTabsElement extends Components.KolTabs, HTMLStencilElement {
+    interface HTMLKolTabsElement extends Omit<Components.KolTabs, "focus">, HTMLStencilElement {
+        /**
+          * Sets focus on the current tab button.
+         */
+        "focus": () => Promise<void>;
     }
     var HTMLKolTabsElement: {
         prototype: HTMLKolTabsElement;
@@ -4274,7 +4292,11 @@ declare global {
         prototype: HTMLKolToastContainerElement;
         new (): HTMLKolToastContainerElement;
     };
-    interface HTMLKolToolbarElement extends Components.KolToolbar, HTMLStencilElement {
+    interface HTMLKolToolbarElement extends Omit<Components.KolToolbar, "focus">, HTMLStencilElement {
+        /**
+          * Sets focus on the currently active toolbar item.
+         */
+        "focus": () => Promise<void>;
     }
     var HTMLKolToolbarElement: {
         prototype: HTMLKolToolbarElement;
@@ -4286,7 +4308,11 @@ declare global {
         prototype: HTMLKolTooltipWcElement;
         new (): HTMLKolTooltipWcElement;
     };
-    interface HTMLKolTreeElement extends Components.KolTree, HTMLStencilElement {
+    interface HTMLKolTreeElement extends Omit<Components.KolTree, "focus">, HTMLStencilElement {
+        /**
+          * Sets focus on the first focusable tree item.
+         */
+        "focus": () => Promise<void>;
     }
     var HTMLKolTreeElement: {
         prototype: HTMLKolTreeElement;
@@ -4306,13 +4332,17 @@ declare global {
         /**
           * Focuses the link element.
          */
-        "focus": () => Promise<void | undefined>;
+        "focus": () => Promise<void>;
     }
     var HTMLKolTreeItemWcElement: {
         prototype: HTMLKolTreeItemWcElement;
         new (): HTMLKolTreeItemWcElement;
     };
-    interface HTMLKolTreeWcElement extends Components.KolTreeWc, HTMLStencilElement {
+    interface HTMLKolTreeWcElement extends Omit<Components.KolTreeWc, "focus">, HTMLStencilElement {
+        /**
+          * Sets focus on the first focusable tree item.
+         */
+        "focus": () => Promise<void>;
     }
     var HTMLKolTreeWcElement: {
         prototype: HTMLKolTreeWcElement;
@@ -5090,9 +5120,6 @@ declare namespace LocalJSX {
          */
         "_requiredText"?: Stringified<boolean>;
     }
-    /**
-     * The **Heading** component can be used wherever a heading needs to be displayed. By using the different sizes, content can be clearly structured and pages can be presented effectively and with variety. It separates styling from semantics and enables flexibility.
-     */
     interface KolHeading {
         /**
           * Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.). Set to `false` to enable the expert slot.
@@ -7727,9 +7754,6 @@ declare module "@stencil/core" {
              * The **Form** component is used to wrap all input fields, correctly position the required-fields hint text, and forward the `submit` and `reset` events.
              */
             "kol-form": LocalJSX.KolForm & JSXBase.HTMLAttributes<HTMLKolFormElement>;
-            /**
-             * The **Heading** component can be used wherever a heading needs to be displayed. By using the different sizes, content can be clearly structured and pages can be presented effectively and with variety. It separates styling from semantics and enables flexibility.
-             */
             "kol-heading": LocalJSX.KolHeading & JSXBase.HTMLAttributes<HTMLKolHeadingElement>;
             /**
              * The **Icon** component allows icons from included icon fonts to be displayed at any position.

package/dist/types/internal/functional-components/heading/api.d.ts

@@ -0,0 +1,6 @@
+import type { ApiFromConfig } from '../generic-types';
+export declare const headingPropsConfig: {
+    readonly optional: readonly [import("../../props").PropDefinition<import("../../props").InternalPropValue<import("../../props").LevelProp>, import("../../props").LevelProp>, import("../../props").PropDefinition<string, import("../../props").SecondaryHeadlineProp>];
+    readonly required: readonly [import("../../props").PropDefinition<string, import("../../props").LabelWithExpertSlotProp>];
+};
+export type HeadingApi = ApiFromConfig<typeof headingPropsConfig>;

package/dist/types/internal/functional-components/heading/component.d.ts

@@ -0,0 +1,4 @@
+import type { FunctionalComponent as FC } from '../../../stencil-public-runtime';
+import type { FunctionalComponentProps } from '../generic-types';
+import type { HeadingApi } from './api';
+export declare const HeadingFC: FC<FunctionalComponentProps<HeadingApi>>;

package/dist/types/internal/functional-components/heading/controller.d.ts

@@ -0,0 +1,10 @@
+import { BaseController } from '../base-controller';
+import type { ControllerInterface, GetStateFn, ResolvedInputProps, SetStateFn } from '../generic-types';
+import type { HeadingApi } from './api';
+export declare class HeadingController extends BaseController<HeadingApi> implements ControllerInterface<HeadingApi> {
+    constructor(setState: SetStateFn<HeadingApi>, getState: GetStateFn<HeadingApi>);
+    componentWillLoad(props: ResolvedInputProps<HeadingApi>): void;
+    watchLabel(value?: string): void;
+    watchLevel(value?: number): void;
+    watchSecondaryHeadline(value?: string): void;
+}

package/dist/types/internal/props/index.d.ts

@@ -1 +1 @@
-export*from"./align";export*from"./allow-markdown";export*from"./alt";export*from"./badge-text";export*from"./color";export*from"./helpers/factory";export*from"./hide-label";export*from"./href";export*from"./icons";export*from"./label";export*from"./loading";export*from"./max";export*from"./name";export*from"./quote";export*from"./show";export*from"./sizes";export*from"./span-icons";export*from"./src";export*from"./srcset";export*from"./unit";export*from"./value-number";export*from"./value-number-clamped";export*from"./variant-progress";export*from"./variant-quote";
+export*from"./align";export*from"./allow-markdown";export*from"./alt";export*from"./badge-text";export*from"./color";export*from"./helpers/factory";export*from"./hide-label";export*from"./href";export*from"./icons";export*from"./label";export*from"./label-with-expert-slot";export*from"./level";export*from"./loading";export*from"./max";export*from"./name";export*from"./quote";export*from"./secondary-headline";export*from"./show";export*from"./sizes";export*from"./span-icons";export*from"./src";export*from"./srcset";export*from"./unit";export*from"./value-number";export*from"./value-number-clamped";export*from"./variant-progress";export*from"./variant-quote";

package/dist/types/internal/props/label-with-expert-slot.d.ts

@@ -0,0 +1,3 @@
+import type { SimpleProp } from './helpers/factory';
+export type LabelWithExpertSlotProp = SimpleProp<'label', string>;
+export declare const labelWithExpertSlotProp: import("./helpers/factory").PropDefinition<string, LabelWithExpertSlotProp>;