@db-ux/wc-core-components 4.7.0-tabs-34782eb → 4.7.1

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

@@ -1,3 +1,4 @@
+import { InputEvent } from "../../shared/model";
 import { DBTabsProps } from "./model";
 import { EventEmitter } from "../../stencil-public-runtime";
 /**
@@ -6,50 +7,32 @@ import { EventEmitter } from "../../stencil-public-runtime";
  */
 export declare class DBTabs {
     private _ref;
-    initialSelectedIndex: DBTabsProps["initialSelectedIndex"];
-    initialSelectedMode: DBTabsProps["initialSelectedMode"];
     name: DBTabsProps["name"];
     tabs: DBTabsProps["tabs"];
-    activeIndex: DBTabsProps["activeIndex"];
-    id: DBTabsProps["id"];
-    indexChange: EventEmitter<Parameters<Required<DBTabsProps>["onIndexChange"]>[number]> | void;
-    valueChange: EventEmitter<Parameters<Required<DBTabsProps>["onValueChange"]>[number]> | void;
     arrowScrollDistance: DBTabsProps["arrowScrollDistance"];
     orientation: DBTabsProps["orientation"];
     behavior: DBTabsProps["behavior"];
+    initialSelectedMode: DBTabsProps["initialSelectedMode"];
+    initialSelectedIndex: DBTabsProps["initialSelectedIndex"];
+    indexChange: EventEmitter<Parameters<Required<DBTabsProps>["onIndexChange"]>[number]> | void;
+    tabSelect: EventEmitter<Parameters<Required<DBTabsProps>["onTabSelect"]>[number]> | void;
+    id: DBTabsProps["id"];
     propOverrides: DBTabsProps["propOverrides"];
     className: DBTabsProps["className"];
-    tabItemAlignment: DBTabsProps["tabItemAlignment"];
-    tabItemWidth: DBTabsProps["tabItemWidth"];
-    scrollStartLabel: DBTabsProps["scrollStartLabel"];
-    scrollEndLabel: DBTabsProps["scrollEndLabel"];
-    _generatedId: string;
-    _generatedName: string;
-    activeTabIndex: number;
+    alignment: DBTabsProps["alignment"];
+    width: DBTabsProps["width"];
+    _name: string;
     initialized: boolean;
-    showScrollStart: boolean;
-    showScrollEnd: boolean;
+    showScrollLeft: boolean;
+    showScrollRight: boolean;
+    scrollContainer: any;
     _resizeObserver: any;
-    _observer: any;
-    _pendingRafId: any;
-    _scrollListener: any;
-    _cachedTabs: any[];
-    _id(): string;
-    _name(): string;
-    getTabId(index: number | string): string;
-    getPanelId(index: number | string): string;
-    activateTab(index: number): void;
-    handleClick(event: any): void;
-    handleKeyDown(event: any): void;
-    isIndexActive(index: number | string): boolean;
-    getTabItemTabIndex(index: number | string): 0 | -1;
-    _updateCachedTabs(): void;
-    _getScrollContainer(): Element;
-    _isRtl(): boolean;
+    convertTabs(): any;
     evaluateScrollButtons(tList: Element): void;
-    scroll(toStart?: boolean): void;
+    scroll(left?: boolean): void;
     initTabList(): void;
-    initTabs(activeIndex?: number): void;
+    initTabs(init?: boolean): void;
+    handleChange(event: InputEvent<HTMLElement>): void;
     /**
      * Passes `aria-*`, `data-*` & `class` attributes to correct child. Used in angular and stencil.
      * @param element  the ref for the component
@@ -58,8 +41,6 @@ export declare class DBTabs {
     private enableAttributePassing;
     watch0Fn(): void;
     watch0(): void;
-    watch1Fn(): void;
-    watch1(): void;
     componentDidLoad(): void;
     disconnectedCallback(): void;
     render(): any;

package/dist/types/components.d.ts

@@ -557,7 +557,7 @@ export namespace Components {
     }
     interface DbTabItem {
         "active": DBTabItemProps["active"];
-        "ariaControls": DBTabItemProps["ariaControls"];
+        "checked": DBTabItemProps["checked"];
         "className": DBTabItemProps["className"];
         "disabled": DBTabItemProps["disabled"];
         "icon": DBTabItemProps["icon"];
@@ -565,31 +565,26 @@ export namespace Components {
         "iconTrailing": DBTabItemProps["iconTrailing"];
         "id": DBTabItemProps["id"];
         "label": DBTabItemProps["label"];
+        "name": DBTabItemProps["name"];
         "noText": DBTabItemProps["noText"];
+        "propOverrides": DBTabItemProps["propOverrides"];
         "showIcon": DBTabItemProps["showIcon"];
         "showIconLeading": DBTabItemProps["showIconLeading"];
         "showIconTrailing": DBTabItemProps["showIconTrailing"];
-        "tabIndex": DBTabItemProps["tabIndex"];
-        "value": DBTabItemProps["value"];
     }
     interface DbTabList {
-        "ariaLabel": DBTabListProps["ariaLabel"];
-        "ariaLabelledby": DBTabListProps["ariaLabelledby"];
         "className": DBTabListProps["className"];
         "id": DBTabListProps["id"];
-        "orientation": DBTabListProps["orientation"];
+        "propOverrides": DBTabListProps["propOverrides"];
     }
     interface DbTabPanel {
-        "ariaLabel": DBTabPanelProps["ariaLabel"];
-        "ariaLabelledby": DBTabPanelProps["ariaLabelledby"];
         "className": DBTabPanelProps["className"];
         "content": DBTabPanelProps["content"];
-        "hidden": DBTabPanelProps["hidden"];
         "id": DBTabPanelProps["id"];
         "propOverrides": DBTabPanelProps["propOverrides"];
     }
     interface DbTabs {
-        "activeIndex": DBTabsProps["activeIndex"];
+        "alignment": DBTabsProps["alignment"];
         "arrowScrollDistance": DBTabsProps["arrowScrollDistance"];
         "behavior": DBTabsProps["behavior"];
         "className": DBTabsProps["className"];
@@ -599,23 +594,8 @@ export namespace Components {
         "name": DBTabsProps["name"];
         "orientation": DBTabsProps["orientation"];
         "propOverrides": DBTabsProps["propOverrides"];
-        /**
-          * @default "Scroll end"
-         */
-        "scrollEndLabel": DBTabsProps["scrollEndLabel"];
-        /**
-          * @default "Scroll start"
-         */
-        "scrollStartLabel": DBTabsProps["scrollStartLabel"];
-        /**
-          * @default "start"
-         */
-        "tabItemAlignment": DBTabsProps["tabItemAlignment"];
-        /**
-          * @default "auto"
-         */
-        "tabItemWidth": DBTabsProps["tabItemWidth"];
         "tabs": DBTabsProps["tabs"];
+        "width": DBTabsProps["width"];
     }
     interface DbTag {
         "behavior": DBTagProps["behavior"];
@@ -1107,7 +1087,7 @@ declare global {
         new (): HTMLDbSwitchElement;
     };
     interface HTMLDbTabItemElementEventMap {
-        "click": any;
+        "change": any;
     }
     interface HTMLDbTabItemElement extends Components.DbTabItem, HTMLStencilElement {
         addEventListener<K extends keyof HTMLDbTabItemElementEventMap>(type: K, listener: (this: HTMLDbTabItemElement, ev: DbTabItemCustomEvent<HTMLDbTabItemElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
@@ -1137,7 +1117,7 @@ declare global {
     };
     interface HTMLDbTabsElementEventMap {
         "indexChange": any;
-        "valueChange": any;
+        "tabSelect": any;
     }
     interface HTMLDbTabsElement extends Components.DbTabs, HTMLStencilElement {
         addEventListener<K extends keyof HTMLDbTabsElementEventMap>(type: K, listener: (this: HTMLDbTabsElement, ev: DbTabsCustomEvent<HTMLDbTabsElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
@@ -1745,7 +1725,7 @@ declare namespace LocalJSX {
     }
     interface DbTabItem {
         "active"?: DBTabItemProps["active"];
-        "ariaControls"?: DBTabItemProps["ariaControls"];
+        "checked"?: DBTabItemProps["checked"];
         "className"?: DBTabItemProps["className"];
         "disabled"?: DBTabItemProps["disabled"];
         "icon"?: DBTabItemProps["icon"];
@@ -1753,32 +1733,27 @@ declare namespace LocalJSX {
         "iconTrailing"?: DBTabItemProps["iconTrailing"];
         "id"?: DBTabItemProps["id"];
         "label"?: DBTabItemProps["label"];
+        "name"?: DBTabItemProps["name"];
         "noText"?: DBTabItemProps["noText"];
-        "onClick"?: (event: DbTabItemCustomEvent<any>) => void;
+        "onChange"?: (event: DbTabItemCustomEvent<any>) => void;
+        "propOverrides"?: DBTabItemProps["propOverrides"];
         "showIcon"?: DBTabItemProps["showIcon"];
         "showIconLeading"?: DBTabItemProps["showIconLeading"];
         "showIconTrailing"?: DBTabItemProps["showIconTrailing"];
-        "tabIndex"?: DBTabItemProps["tabIndex"];
-        "value"?: DBTabItemProps["value"];
     }
     interface DbTabList {
-        "ariaLabel"?: DBTabListProps["ariaLabel"];
-        "ariaLabelledby"?: DBTabListProps["ariaLabelledby"];
         "className"?: DBTabListProps["className"];
         "id"?: DBTabListProps["id"];
-        "orientation"?: DBTabListProps["orientation"];
+        "propOverrides"?: DBTabListProps["propOverrides"];
     }
     interface DbTabPanel {
-        "ariaLabel"?: DBTabPanelProps["ariaLabel"];
-        "ariaLabelledby"?: DBTabPanelProps["ariaLabelledby"];
         "className"?: DBTabPanelProps["className"];
         "content"?: DBTabPanelProps["content"];
-        "hidden"?: DBTabPanelProps["hidden"];
         "id"?: DBTabPanelProps["id"];
         "propOverrides"?: DBTabPanelProps["propOverrides"];
     }
     interface DbTabs {
-        "activeIndex"?: DBTabsProps["activeIndex"];
+        "alignment"?: DBTabsProps["alignment"];
         "arrowScrollDistance"?: DBTabsProps["arrowScrollDistance"];
         "behavior"?: DBTabsProps["behavior"];
         "className"?: DBTabsProps["className"];
@@ -1787,26 +1762,11 @@ declare namespace LocalJSX {
         "initialSelectedMode"?: DBTabsProps["initialSelectedMode"];
         "name"?: DBTabsProps["name"];
         "onIndexChange"?: (event: DbTabsCustomEvent<any>) => void;
-        "onValueChange"?: (event: DbTabsCustomEvent<any>) => void;
+        "onTabSelect"?: (event: DbTabsCustomEvent<any>) => void;
         "orientation"?: DBTabsProps["orientation"];
         "propOverrides"?: DBTabsProps["propOverrides"];
-        /**
-          * @default "Scroll end"
-         */
-        "scrollEndLabel"?: DBTabsProps["scrollEndLabel"];
-        /**
-          * @default "Scroll start"
-         */
-        "scrollStartLabel"?: DBTabsProps["scrollStartLabel"];
-        /**
-          * @default "start"
-         */
-        "tabItemAlignment"?: DBTabsProps["tabItemAlignment"];
-        /**
-          * @default "auto"
-         */
-        "tabItemWidth"?: DBTabsProps["tabItemWidth"];
         "tabs"?: DBTabsProps["tabs"];
+        "width"?: DBTabsProps["width"];
     }
     interface DbTag {
         "behavior"?: DBTagProps["behavior"];
@@ -2308,51 +2268,41 @@ declare namespace LocalJSX {
     }
     interface DbTabItemAttributes {
         "active": string;
-        "label": DBTabItemProps["label"];
-        "showIcon": string;
-        "icon": DBTabItemProps["icon"];
-        "tabIndex": string;
-        "disabled": string;
+        "name": DBTabItemProps["name"];
         "className": DBTabItemProps["className"];
-        "noText": string;
-        "ariaControls": DBTabItemProps["ariaControls"];
         "id": DBTabItemProps["id"];
-        "value": DBTabItemProps["value"];
-        "showIconLeading": string;
         "iconLeading": DBTabItemProps["iconLeading"];
-        "showIconTrailing": string;
+        "icon": DBTabItemProps["icon"];
         "iconTrailing": DBTabItemProps["iconTrailing"];
+        "showIconLeading": string;
+        "showIcon": string;
+        "showIconTrailing": string;
+        "noText": string;
+        "disabled": string;
+        "checked": string;
+        "label": DBTabItemProps["label"];
     }
     interface DbTabListAttributes {
         "id": DBTabListProps["id"];
         "className": DBTabListProps["className"];
-        "orientation": DBTabListProps["orientation"];
-        "ariaLabelledby": DBTabListProps["ariaLabelledby"];
-        "ariaLabel": DBTabListProps["ariaLabel"];
     }
     interface DbTabPanelAttributes {
         "className": DBTabPanelProps["className"];
         "id": DBTabPanelProps["id"];
-        "hidden": DBTabPanelProps["hidden"];
-        "ariaLabel": DBTabPanelProps["ariaLabel"];
-        "ariaLabelledby": DBTabPanelProps["ariaLabelledby"];
         "content": DBTabPanelProps["content"];
     }
     interface DbTabsAttributes {
-        "initialSelectedIndex": string;
-        "initialSelectedMode": DBTabsProps["initialSelectedMode"];
         "name": DBTabsProps["name"];
         "tabs": DBTabsProps["tabs"];
-        "activeIndex": string;
-        "id": DBTabsProps["id"];
         "arrowScrollDistance": string;
         "orientation": DBTabsProps["orientation"];
         "behavior": DBTabsProps["behavior"];
+        "initialSelectedMode": DBTabsProps["initialSelectedMode"];
+        "initialSelectedIndex": string;
+        "id": DBTabsProps["id"];
         "className": DBTabsProps["className"];
-        "tabItemAlignment": DBTabsProps["tabItemAlignment"];
-        "tabItemWidth": DBTabsProps["tabItemWidth"];
-        "scrollStartLabel": DBTabsProps["scrollStartLabel"];
-        "scrollEndLabel": DBTabsProps["scrollEndLabel"];
+        "alignment": DBTabsProps["alignment"];
+        "width": DBTabsProps["width"];
     }
     interface DbTagAttributes {
         "removeButton": DBTagProps["removeButton"];

package/dist/types/shared/model.d.ts

@@ -460,13 +460,13 @@ export type CloseEventProps<T> = {
 export type CloseEventState<T> = {
     handleClose: (event?: T | void, forceClose?: boolean) => void;
 };
-export declare const TabItemAlignmentList: readonly ["start", "center", "end"];
-export type TabItemAlignmentType = (typeof TabItemAlignmentList)[number];
-export type TabItemAlignmentProps = {
+export declare const AlignmentList: readonly ["start", "center"];
+export type AlignmentType = (typeof AlignmentList)[number];
+export type AlignmentProps = {
     /**
-     * Define the tab-item alignment in full width
+     * Define the content alignment in full width
      */
-    tabItemAlignment?: TabItemAlignmentType | string;
+    alignment?: AlignmentType | string;
 };
 export type ActiveProps = {
     /**