@instructure/ui-tabs 8.13.1-snapshot.46 → 8.13.1-snapshot.55

package/types/Tabs/Panel/props.d.ts

@@ -2,7 +2,12 @@ import React from 'react';
 import type { Spacing, WithStyleProps, ComponentStyle } from '@instructure/emotion';
 import type { OtherHTMLAttributes, PropValidators, TabsPanelTheme } from '@instructure/shared-types';
 declare type TabsPanelOwnProps = {
-    renderTitle: React.ReactNode | ((...args: any[]) => any);
+    /**
+     * The content that will be rendered in the corresponding <Tab /> and will label
+     * this `<Tabs.Panel />` for screen readers
+     */
+    renderTitle: React.ReactNode | (() => React.ReactNode);
+    children?: React.ReactNode;
     variant?: 'default' | 'secondary';
     isSelected?: boolean;
     isDisabled?: boolean;
@@ -12,8 +17,10 @@ declare type TabsPanelOwnProps = {
     labelledBy?: string;
     padding?: Spacing;
     textAlign?: 'start' | 'center' | 'end';
-    elementRef?: (element: Element | null) => void;
-    children?: React.ReactNode;
+    /**
+     * provides a reference to the underlying html root element
+     */
+    elementRef?: (element: HTMLDivElement | null) => void;
 };
 declare type PropKeys = keyof TabsPanelOwnProps;
 declare type AllowedPropKeys = Readonly<Array<PropKeys>>;

package/types/Tabs/Panel/props.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"props.d.ts","sourceRoot":"","sources":["../../../src/Tabs/Panel/props.ts"],"names":[],"mappings":"AAwBA,OAAO,KAAK,MAAM,OAAO,CAAA;AAKzB,OAAO,KAAK,EACV,OAAO,EACP,cAAc,EACd,cAAc,EACf,MAAM,sBAAsB,CAAA;AAC7B,OAAO,KAAK,EACV,mBAAmB,EACnB,cAAc,EACd,cAAc,EACf,MAAM,2BAA2B,CAAA;AAElC,aAAK,iBAAiB,GAAG;IACvB,WAAW,EAAE,KAAK,CAAC,SAAS,GAAG,CAAC,CAAC,GAAG,IAAI,EAAE,GAAG,EAAE,KAAK,GAAG,CAAC,CAAA;IACxD,OAAO,CAAC,EAAE,SAAS,GAAG,WAAW,CAAA;IACjC,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,SAAS,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IAC3B,SAAS,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IAC3B,EAAE,CAAC,EAAE,MAAM,CAAA;IACX,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,SAAS,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,KAAK,CAAA;IACtC,UAAU,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,GAAG,IAAI,KAAK,IAAI,CAAA;IAC9C,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;CAC3B,CAAA;AAED,aAAK,QAAQ,GAAG,MAAM,iBAAiB,CAAA;AAEvC,aAAK,eAAe,GAAG,QAAQ,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAA;AAEhD,aAAK,cAAc,GAAG,iBAAiB,GACrC,cAAc,CAAC,cAAc,EAAE,cAAc,CAAC,GAC9C,mBAAmB,CAAC,iBAAiB,CAAC,CAAA;AAExC,aAAK,cAAc,GAAG,cAAc,CAAC,OAAO,GAAG,SAAS,CAAC,CAAA;AAEzD,QAAA,MAAM,SAAS,EAAE,cAAc,CAAC,QAAQ,CAoBvC,CAAA;AAED,QAAA,MAAM,YAAY,EAAE,eAanB,CAAA;AAED,YAAY,EAAE,cAAc,EAAE,cAAc,EAAE,CAAA;AAC9C,OAAO,EAAE,SAAS,EAAE,YAAY,EAAE,CAAA"}
+{"version":3,"file":"props.d.ts","sourceRoot":"","sources":["../../../src/Tabs/Panel/props.ts"],"names":[],"mappings":"AAwBA,OAAO,KAAK,MAAM,OAAO,CAAA;AAKzB,OAAO,KAAK,EACV,OAAO,EACP,cAAc,EACd,cAAc,EACf,MAAM,sBAAsB,CAAA;AAC7B,OAAO,KAAK,EACV,mBAAmB,EACnB,cAAc,EACd,cAAc,EACf,MAAM,2BAA2B,CAAA;AAElC,aAAK,iBAAiB,GAAG;IACvB;;;OAGG;IACH,WAAW,EAAE,KAAK,CAAC,SAAS,GAAG,CAAC,MAAM,KAAK,CAAC,SAAS,CAAC,CAAA;IACtD,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC1B,OAAO,CAAC,EAAE,SAAS,GAAG,WAAW,CAAA;IACjC,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,SAAS,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IAC3B,SAAS,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IAC3B,EAAE,CAAC,EAAE,MAAM,CAAA;IACX,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,SAAS,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,KAAK,CAAA;IACtC;;OAEG;IACH,UAAU,CAAC,EAAE,CAAC,OAAO,EAAE,cAAc,GAAG,IAAI,KAAK,IAAI,CAAA;CACtD,CAAA;AAED,aAAK,QAAQ,GAAG,MAAM,iBAAiB,CAAA;AAEvC,aAAK,eAAe,GAAG,QAAQ,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAA;AAEhD,aAAK,cAAc,GAAG,iBAAiB,GACrC,cAAc,CAAC,cAAc,EAAE,cAAc,CAAC,GAC9C,mBAAmB,CAAC,iBAAiB,CAAC,CAAA;AAExC,aAAK,cAAc,GAAG,cAAc,CAAC,OAAO,GAAG,SAAS,CAAC,CAAA;AAEzD,QAAA,MAAM,SAAS,EAAE,cAAc,CAAC,QAAQ,CAavC,CAAA;AAED,QAAA,MAAM,YAAY,EAAE,eAanB,CAAA;AAED,YAAY,EAAE,cAAc,EAAE,cAAc,EAAE,CAAA;AAC9C,OAAO,EAAE,SAAS,EAAE,YAAY,EAAE,CAAA"}

package/types/Tabs/Tab/index.d.ts

@@ -1,5 +1,6 @@
 /** @jsx jsx */
-import { Component } from 'react';
+import React, { Component } from 'react';
+import type { ViewOwnProps } from '@instructure/ui-view';
 import { jsx } from '@instructure/emotion';
 import type { TabsTabProps } from './props';
 /**
@@ -7,6 +8,7 @@ import type { TabsTabProps } from './props';
 parent: Tabs
 id: Tabs.Tab
 ---
+@tsProps
 **/
 declare class Tab extends Component<TabsTabProps> {
     static readonly componentId = "Tabs.Tab";
@@ -17,9 +19,15 @@ declare class Tab extends Component<TabsTabProps> {
         controls: string;
         isDisabled?: boolean | undefined;
         isSelected?: boolean | undefined;
-        onClick?: ((...args: any[]) => any) | undefined;
-        onKeyDown?: ((...args: any[]) => any) | undefined;
-        children?: import("react").ReactNode | ((...args: any[]) => import("react").ReactNode);
+        onClick?: ((event: React.MouseEvent<ViewOwnProps, MouseEvent>, tabData: {
+            index: number;
+            id: string;
+        }) => void) | undefined;
+        onKeyDown?: ((event: React.KeyboardEvent<ViewOwnProps>, tabData: {
+            index: number;
+            id: string;
+        }) => void) | undefined;
+        children?: React.ReactNode | (() => React.ReactNode);
     })[];
     static propTypes: import("@instructure/shared-types/types/UtilityTypes").PropValidators<keyof {
         variant?: "default" | "secondary" | undefined;
@@ -28,28 +36,25 @@ declare class Tab extends Component<TabsTabProps> {
         controls: string;
         isDisabled?: boolean | undefined;
         isSelected?: boolean | undefined;
-        onClick?: ((...args: any[]) => any) | undefined;
-        onKeyDown?: ((...args: any[]) => any) | undefined;
-        children?: import("react").ReactNode | ((...args: any[]) => import("react").ReactNode);
+        onClick?: ((event: React.MouseEvent<ViewOwnProps, MouseEvent>, tabData: {
+            index: number;
+            id: string;
+        }) => void) | undefined;
+        onKeyDown?: ((event: React.KeyboardEvent<ViewOwnProps>, tabData: {
+            index: number;
+            id: string;
+        }) => void) | undefined;
+        children?: React.ReactNode | (() => React.ReactNode);
     }>;
     static defaultProps: {
-        children: null;
         variant: string;
         isDisabled: boolean;
         isSelected: boolean;
-        onClick: (event: any, { index, id }: {
-            index: any;
-            id: any;
-        }) => void;
-        onKeyDown: (event: any, { index, id }: {
-            index: any;
-            id: any;
-        }) => void;
     };
     componentDidMount(): void;
-    componentDidUpdate(prevProps: any, prevState: any, snapshot: any): void;
-    handleClick: (event: any) => void;
-    handleKeyDown: (event: any) => void;
+    componentDidUpdate(): void;
+    handleClick: (event: React.MouseEvent<ViewOwnProps>) => void;
+    handleKeyDown: (event: React.KeyboardEvent<ViewOwnProps>) => void;
     render(): jsx.JSX.Element;
 }
 export default Tab;

package/types/Tabs/Tab/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/Tabs/Tab/index.tsx"],"names":[],"mappings":"AAwBA,eAAe;AACf,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAKjC,OAAO,EAAa,GAAG,EAAE,MAAM,sBAAsB,CAAA;AAIrD,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,SAAS,CAAA;AAG3C;;;;;GAKG;AACH,cACM,GAAI,SAAQ,SAAS,CAAC,YAAY,CAAC;IACvC,MAAM,CAAC,QAAQ,CAAC,WAAW,cAAa;IAExC,MAAM,CAAC,YAAY;;;;;;;;;;SAAe;IAClC,MAAM,CAAC,SAAS;;;;;;;;;;OAAY;IAE5B,MAAM,CAAC,YAAY;;;;;;;;;;;;;MASlB;IAED,iBAAiB;IAKjB,kBAAkB,CAAC,SAAS,KAAA,EAAE,SAAS,KAAA,EAAE,QAAQ,KAAA;IAKjD,WAAW,uBASV;IAGD,aAAa,uBASZ;IAED,MAAM;CAiCP;AAED,eAAe,GAAG,CAAA;AAClB,OAAO,EAAE,GAAG,EAAE,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/Tabs/Tab/index.tsx"],"names":[],"mappings":"AAwBA,eAAe;AACf,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAIxC,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,sBAAsB,CAAA;AAExD,OAAO,EAAa,GAAG,EAAE,MAAM,sBAAsB,CAAA;AAKrD,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,SAAS,CAAA;AAG3C;;;;;;GAMG;AACH,cACM,GAAI,SAAQ,SAAS,CAAC,YAAY,CAAC;IACvC,MAAM,CAAC,QAAQ,CAAC,WAAW,cAAa;IAExC,MAAM,CAAC,YAAY;;;;;;;;;;;;;;;;SAAe;IAClC,MAAM,CAAC,SAAS;;;;;;;;;;;;;;;;OAAY;IAE5B,MAAM,CAAC,YAAY;;;;MAIlB;IAED,iBAAiB;IAIjB,kBAAkB;IAIlB,WAAW,UAAW,gBAAgB,CAAC,YAAY,CAAC,UAUnD;IAED,aAAa,UAAW,mBAAmB,CAAC,YAAY,CAAC,UAUxD;IAED,MAAM;CAgCP;AAED,eAAe,GAAG,CAAA;AAClB,OAAO,EAAE,GAAG,EAAE,CAAA"}

package/types/Tabs/Tab/props.d.ts

@@ -1,6 +1,7 @@
 import React from 'react';
 import type { OtherHTMLAttributes, PropValidators, TabsTabTheme } from '@instructure/shared-types';
 import type { WithStyleProps, ComponentStyle } from '@instructure/emotion';
+import type { ViewOwnProps } from '@instructure/ui-view';
 declare type TabsTabOwnProps = {
     variant?: 'default' | 'secondary';
     id: string;
@@ -8,9 +9,15 @@ declare type TabsTabOwnProps = {
     controls: string;
     isDisabled?: boolean;
     isSelected?: boolean;
-    onClick?: (...args: any[]) => any;
-    onKeyDown?: (...args: any[]) => any;
-    children?: React.ReactNode | ((...args: any[]) => React.ReactNode);
+    onClick?: (event: React.MouseEvent<ViewOwnProps>, tabData: {
+        index: number;
+        id: string;
+    }) => void;
+    onKeyDown?: (event: React.KeyboardEvent<ViewOwnProps>, tabData: {
+        index: number;
+        id: string;
+    }) => void;
+    children?: React.ReactNode | (() => React.ReactNode);
 };
 declare type PropKeys = keyof TabsTabOwnProps;
 declare type AllowedPropKeys = Readonly<Array<PropKeys>>;

package/types/Tabs/Tab/props.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"props.d.ts","sourceRoot":"","sources":["../../../src/Tabs/Tab/props.ts"],"names":[],"mappings":"AAwBA,OAAO,KAAK,MAAM,OAAO,CAAA;AAGzB,OAAO,KAAK,EACV,mBAAmB,EACnB,cAAc,EACd,YAAY,EACb,MAAM,2BAA2B,CAAA;AAClC,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAA;AAE1E,aAAK,eAAe,GAAG;IACrB,OAAO,CAAC,EAAE,SAAS,GAAG,WAAW,CAAA;IACjC,EAAE,EAAE,MAAM,CAAA;IACV,KAAK,EAAE,MAAM,CAAA;IACb,QAAQ,EAAE,MAAM,CAAA;IAChB,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,OAAO,CAAC,EAAE,CAAC,GAAG,IAAI,EAAE,GAAG,EAAE,KAAK,GAAG,CAAA;IACjC,SAAS,CAAC,EAAE,CAAC,GAAG,IAAI,EAAE,GAAG,EAAE,KAAK,GAAG,CAAA;IACnC,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,GAAG,CAAC,CAAC,GAAG,IAAI,EAAE,GAAG,EAAE,KAAK,KAAK,CAAC,SAAS,CAAC,CAAA;CACnE,CAAA;AAED,aAAK,QAAQ,GAAG,MAAM,eAAe,CAAA;AAErC,aAAK,eAAe,GAAG,QAAQ,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAA;AAEhD,aAAK,YAAY,GAAG,eAAe,GACjC,cAAc,CAAC,YAAY,EAAE,YAAY,CAAC,GAC1C,mBAAmB,CAAC,eAAe,CAAC,CAAA;AAEtC,aAAK,YAAY,GAAG,cAAc,CAAC,KAAK,CAAC,CAAA;AAEzC,QAAA,MAAM,SAAS,EAAE,cAAc,CAAC,QAAQ,CAUvC,CAAA;AAED,QAAA,MAAM,YAAY,EAAE,eAUnB,CAAA;AAED,YAAY,EAAE,YAAY,EAAE,YAAY,EAAE,CAAA;AAC1C,OAAO,EAAE,SAAS,EAAE,YAAY,EAAE,CAAA"}
+{"version":3,"file":"props.d.ts","sourceRoot":"","sources":["../../../src/Tabs/Tab/props.ts"],"names":[],"mappings":"AAwBA,OAAO,KAAK,MAAM,OAAO,CAAA;AAGzB,OAAO,KAAK,EACV,mBAAmB,EACnB,cAAc,EACd,YAAY,EACb,MAAM,2BAA2B,CAAA;AAClC,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAA;AAC1E,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,sBAAsB,CAAA;AAExD,aAAK,eAAe,GAAG;IACrB,OAAO,CAAC,EAAE,SAAS,GAAG,WAAW,CAAA;IACjC,EAAE,EAAE,MAAM,CAAA;IACV,KAAK,EAAE,MAAM,CAAA;IACb,QAAQ,EAAE,MAAM,CAAA;IAChB,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,OAAO,CAAC,EAAE,CACR,KAAK,EAAE,KAAK,CAAC,UAAU,CAAC,YAAY,CAAC,EACrC,OAAO,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,EAAE,EAAE,MAAM,CAAA;KAAE,KACnC,IAAI,CAAA;IACT,SAAS,CAAC,EAAE,CACV,KAAK,EAAE,KAAK,CAAC,aAAa,CAAC,YAAY,CAAC,EACxC,OAAO,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,EAAE,EAAE,MAAM,CAAA;KAAE,KACnC,IAAI,CAAA;IACT,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,GAAG,CAAC,MAAM,KAAK,CAAC,SAAS,CAAC,CAAA;CACrD,CAAA;AAED,aAAK,QAAQ,GAAG,MAAM,eAAe,CAAA;AAErC,aAAK,eAAe,GAAG,QAAQ,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAA;AAEhD,aAAK,YAAY,GAAG,eAAe,GACjC,cAAc,CAAC,YAAY,EAAE,YAAY,CAAC,GAC1C,mBAAmB,CAAC,eAAe,CAAC,CAAA;AAEtC,aAAK,YAAY,GAAG,cAAc,CAAC,KAAK,CAAC,CAAA;AAEzC,QAAA,MAAM,SAAS,EAAE,cAAc,CAAC,QAAQ,CAUvC,CAAA;AAED,QAAA,MAAM,YAAY,EAAE,eAUnB,CAAA;AAED,YAAY,EAAE,YAAY,EAAE,YAAY,EAAE,CAAA;AAC1C,OAAO,EAAE,SAAS,EAAE,YAAY,EAAE,CAAA"}

package/types/Tabs/index.d.ts

@@ -1,24 +1,31 @@
 /** @jsx jsx */
-import React, { Component, ComponentElement, ReactElement } from 'react';
+import React, { Component, ComponentElement } from 'react';
+import type { ViewOwnProps } from '@instructure/ui-view';
+import { Focusable } from '@instructure/ui-focusable';
 import { jsx } from '@instructure/emotion';
 import { Tab } from './Tab';
 import { Panel } from './Panel';
-import type { TabsProps } from './props';
+import type { TabsProps, TabsState } from './props';
 import type { TabsTabProps } from './Tab/props';
 import type { TabsPanelProps } from './Panel/props';
-declare type TabChild = ReactElement & ComponentElement<TabsTabProps, any>;
-declare type PanelChild = ReactElement & ComponentElement<TabsPanelProps, any>;
+declare type TabChild = ComponentElement<TabsTabProps, any>;
+declare type PanelChild = ComponentElement<TabsPanelProps, any>;
 /**
 ---
 category: components
 ---
+@tsProps
 **/
-declare class Tabs extends Component<TabsProps> {
+declare class Tabs extends Component<TabsProps, TabsState> {
     static readonly componentId = "Tabs";
     static allowedProps: readonly (keyof {
+        children?: React.ReactNode;
         variant?: "default" | "secondary" | undefined;
         screenReaderLabel?: string | undefined;
-        onRequestTabChange?: ((...args: any[]) => any) | undefined;
+        onRequestTabChange?: ((event: React.KeyboardEvent<ViewOwnProps> | React.MouseEvent<ViewOwnProps, MouseEvent>, tabData: {
+            index: number;
+            id?: string | undefined;
+        }) => void) | undefined;
         maxWidth?: string | number | undefined;
         maxHeight?: string | number | undefined;
         minHeight?: string | number | undefined;
@@ -29,12 +36,15 @@ declare class Tabs extends Component<TabsProps> {
         elementRef?: ((element: Element | null) => void) | undefined;
         tabOverflow?: "scroll" | "stack" | undefined;
         shouldFocusOnRender?: boolean | undefined;
-        children?: React.ReactNode;
     })[];
     static propTypes: import("@instructure/shared-types/types/UtilityTypes").PropValidators<keyof {
+        children?: React.ReactNode;
         variant?: "default" | "secondary" | undefined;
         screenReaderLabel?: string | undefined;
-        onRequestTabChange?: ((...args: any[]) => any) | undefined;
+        onRequestTabChange?: ((event: React.KeyboardEvent<ViewOwnProps> | React.MouseEvent<ViewOwnProps, MouseEvent>, tabData: {
+            index: number;
+            id?: string | undefined;
+        }) => void) | undefined;
         maxWidth?: string | number | undefined;
         maxHeight?: string | number | undefined;
         minHeight?: string | number | undefined;
@@ -45,51 +55,44 @@ declare class Tabs extends Component<TabsProps> {
         elementRef?: ((element: Element | null) => void) | undefined;
         tabOverflow?: "scroll" | "stack" | undefined;
         shouldFocusOnRender?: boolean | undefined;
-        children?: React.ReactNode;
     }>;
     static defaultProps: {
         variant: string;
-        onRequestTabChange: (event: any, { index, id }: {
-            index: any;
-            id: any;
-        }) => void;
-        children: null;
-        elementRef: () => void;
         shouldFocusOnRender: boolean;
         tabOverflow: string;
     };
     static Panel: typeof Panel;
     static Tab: typeof Tab;
+    private _tabList;
+    private _focusable;
+    private _tabListPosition?;
+    private _debounced?;
+    private _resizeListener?;
     ref: Element | null;
     handleRef: (el: Element | null) => void;
-    constructor(props: any);
+    constructor(props: TabsProps);
     componentDidMount(): void;
-    componentDidUpdate(prevProps: any, prevState: any, snapshot: any): void;
+    componentDidUpdate(prevProps: TabsProps, prevState: TabsState): void;
     componentWillUnmount(): void;
     startScrollOverflow(): void;
     cancelScrollOverflow(): void;
-    getOverlayWidth(): number | undefined;
-    showActiveTabIfOverlayed(activeTabEl: any): void;
-    handleTabClick: (event: any, { index, id }: {
-        index: any;
-        id: any;
-    }) => void;
-    handleTabKeyDown: (event: any, { index }: {
-        index: any;
-    }) => void;
+    getOverlayWidth(): number;
+    showActiveTabIfOverlayed(activeTabEl: Element | null): void;
+    handleTabClick: TabsTabProps['onClick'];
+    handleTabKeyDown: TabsTabProps['onKeyDown'];
     handleResize: () => void;
-    getNextTab(startIndex: any, step: any): {
-        index: any;
-        id: any;
+    getNextTab(startIndex: number, step: -1 | 0 | 1): {
+        index: number;
+        id?: string;
     };
-    fireOnChange(event: any, { index, id }: {
-        index: any;
-        id: any;
+    fireOnChange(event: React.MouseEvent<ViewOwnProps> | React.KeyboardEvent<ViewOwnProps>, { index, id }: {
+        index: number;
+        id?: string;
     }): void;
     createTab(index: number, generatedId: string, selected: boolean, panel: PanelChild): TabChild;
-    clonePanel(_index: number, generatedId: string, selected: boolean, panel: PanelChild): React.ReactElement<any, string | React.JSXElementConstructor<any>>;
-    handleFocusableRef: (el: any) => void;
-    handleTabListRef: (el: any) => void;
+    clonePanel(_index: number, generatedId: string, selected: boolean, panel: PanelChild): PanelChild;
+    handleFocusableRef: (el: Focusable | null) => void;
+    handleTabListRef: (el: Element | null) => void;
     focus(): void;
     render(): jsx.JSX.Element;
 }

package/types/Tabs/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/Tabs/index.tsx"],"names":[],"mappings":"AAwBA,eAAe;AACf,OAAO,KAAK,EAAE,EACZ,SAAS,EAET,gBAAgB,EAEhB,YAAY,EACb,MAAM,OAAO,CAAA;AAmBd,OAAO,EAAa,GAAG,EAAE,MAAM,sBAAsB,CAAA;AAKrD,OAAO,EAAE,GAAG,EAAE,MAAM,OAAO,CAAA;AAC3B,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAA;AAG/B,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,SAAS,CAAA;AACxC,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,aAAa,CAAA;AAC/C,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,eAAe,CAAA;AAEnD,aAAK,QAAQ,GAAG,YAAY,GAAG,gBAAgB,CAAC,YAAY,EAAE,GAAG,CAAC,CAAA;AAClE,aAAK,UAAU,GAAG,YAAY,GAAG,gBAAgB,CAAC,cAAc,EAAE,GAAG,CAAC,CAAA;AAEtE;;;;GAIG;AACH,cAGM,IAAK,SAAQ,SAAS,CAAC,SAAS,CAAC;IACrC,MAAM,CAAC,QAAQ,CAAC,WAAW,UAAS;IAEpC,MAAM,CAAC,YAAY;;;;;;;;;;;;;;;SAAe;IAClC,MAAM,CAAC,SAAS;;;;;;;;;;;;;;;OAAY;IAE5B,MAAM,CAAC,YAAY;;;;;;;;;;MAQlB;IAED,MAAM,CAAC,KAAK,eAAQ;IACpB,MAAM,CAAC,GAAG,aAAM;IAEhB,GAAG,EAAE,OAAO,GAAG,IAAI,CAAO;IAE1B,SAAS,OAAQ,OAAO,GAAG,IAAI,UAQ9B;gBAGW,KAAK,KAAA;IAajB,iBAAiB;IAcjB,kBAAkB,CAAC,SAAS,KAAA,EAAE,SAAS,KAAA,EAAE,QAAQ,KAAA;IA+CjD,oBAAoB;IAIpB,mBAAmB;IA2BnB,oBAAoB;IAepB,eAAe;IAaf,wBAAwB,CAAC,WAAW,KAAA;IAiDpC,cAAc;;;eAGb;IAGD,gBAAgB;;eAoBf;IAED,YAAY,aAQX;IAGD,UAAU,CAAC,UAAU,KAAA,EAAE,IAAI,KAAA;;;;IA8B3B,YAAY,CAAC,KAAK,KAAA,EAAE,EAAE,KAAK,EAAE,EAAE,EAAE;;;KAAA;IAWjC,SAAS,CACP,KAAK,EAAE,MAAM,EACb,WAAW,EAAE,MAAM,EACnB,QAAQ,EAAE,OAAO,EACjB,KAAK,EAAE,UAAU,GAChB,QAAQ;IAiBX,UAAU,CACR,MAAM,EAAE,MAAM,EACd,WAAW,EAAE,MAAM,EACnB,QAAQ,EAAE,OAAO,EACjB,KAAK,EAAE,UAAU;IAqBnB,kBAAkB,oBAGjB;IAGD,gBAAgB,oBAGf;IAED,KAAK;IASL,MAAM;CAgGP;AAED,eAAe,IAAI,CAAA;AACnB,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/Tabs/index.tsx"],"names":[],"mappings":"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"}

package/types/Tabs/props.d.ts

@@ -2,28 +2,64 @@ import React from 'react';
 import type { Spacing, WithStyleProps, ComponentStyle } from '@instructure/emotion';
 import type { OtherHTMLAttributes, PropValidators, TabsTheme } from '@instructure/shared-types';
 import type { BidirectionalProps } from '@instructure/ui-i18n';
+import type { ViewOwnProps } from '@instructure/ui-view';
 declare type TabsOwnProps = {
+    /**
+     * children of type `Tabs.Panel`
+     */
+    children?: React.ReactNode;
     variant?: 'default' | 'secondary';
+    /**
+     * A screen ready only label for the list of tabs
+     */
     screenReaderLabel?: string;
-    onRequestTabChange?: (...args: any[]) => any;
+    /**
+     * Called when the selected tab should change
+     */
+    onRequestTabChange?: (event: React.MouseEvent<ViewOwnProps> | React.KeyboardEvent<ViewOwnProps>, tabData: {
+        index: number;
+        id?: string;
+    }) => void;
     maxWidth?: string | number;
     maxHeight?: string | number;
     minHeight?: string | number;
     fixHeight?: string | number;
+    /**
+     * Valid values are `0`, `none`, `auto`, `xxx-small`, `xx-small`, `x-small`,
+     * `small`, `medium`, `large`, `x-large`, `xx-large`. Apply these values via
+     * familiar CSS-like shorthand. For example: `margin="small auto large"`.
+     */
     margin?: Spacing;
+    /**
+     * Valid values are `0`, `none`, `xxx-small`, `xx-small`, `x-small`,
+     * `small`, `medium`, `large`, `x-large`, `xx-large`. Apply these values via
+     * familiar CSS-like shorthand. For example: `padding="small x-large large"`.
+     */
     padding?: Spacing;
     textAlign?: 'start' | 'center' | 'end';
+    /**
+     * provides a reference to the underlying html root element
+     */
     elementRef?: (element: Element | null) => void;
+    /**
+     * Choose whether Tabs should stack or scroll when they exceed the width of their
+     * container.
+     */
     tabOverflow?: 'stack' | 'scroll';
     shouldFocusOnRender?: boolean;
-    children?: React.ReactNode;
 };
 declare type PropKeys = keyof TabsOwnProps;
 declare type AllowedPropKeys = Readonly<Array<PropKeys>>;
 declare type TabsProps = TabsOwnProps & BidirectionalProps & WithStyleProps<TabsTheme, TabsStyle> & OtherHTMLAttributes<TabsOwnProps>;
-declare type TabsStyle = ComponentStyle<'tabs' | 'container' | 'tabList' | 'panelsContainer' | 'scrollOverlay' | 'scrollSpacer' | 'scrollOverlayWidthDefault' | 'scrollOverlayWidthSecondary'>;
+declare type TabsStyle = ComponentStyle<'tabs' | 'container' | 'tabList' | 'panelsContainer' | 'scrollOverlay' | 'scrollSpacer'> & {
+    scrollOverlayWidthDefault: string;
+    scrollOverlayWidthSecondary: string;
+};
+declare type TabsState = {
+    withTabListOverflow: boolean;
+};
 declare const propTypes: PropValidators<PropKeys>;
 declare const allowedProps: AllowedPropKeys;
-export type { TabsProps, TabsStyle };
+export type { TabsProps, TabsState, TabsStyle };
 export { propTypes, allowedProps };
 //# sourceMappingURL=props.d.ts.map

package/types/Tabs/props.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"props.d.ts","sourceRoot":"","sources":["../../src/Tabs/props.ts"],"names":[],"mappings":"AAuBA,OAAO,KAAK,MAAM,OAAO,CAAA;AAQzB,OAAO,KAAK,EACV,OAAO,EACP,cAAc,EACd,cAAc,EACf,MAAM,sBAAsB,CAAA;AAC7B,OAAO,KAAK,EACV,mBAAmB,EACnB,cAAc,EACd,SAAS,EACV,MAAM,2BAA2B,CAAA;AAClC,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAA;AAE9D,aAAK,YAAY,GAAG;IAClB,OAAO,CAAC,EAAE,SAAS,GAAG,WAAW,CAAA;IACjC,iBAAiB,CAAC,EAAE,MAAM,CAAA;IAC1B,kBAAkB,CAAC,EAAE,CAAC,GAAG,IAAI,EAAE,GAAG,EAAE,KAAK,GAAG,CAAA;IAC5C,QAAQ,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IAC1B,SAAS,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IAC3B,SAAS,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IAC3B,SAAS,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IAC3B,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,SAAS,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,KAAK,CAAA;IACtC,UAAU,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,GAAG,IAAI,KAAK,IAAI,CAAA;IAC9C,WAAW,CAAC,EAAE,OAAO,GAAG,QAAQ,CAAA;IAChC,mBAAmB,CAAC,EAAE,OAAO,CAAA;IAC7B,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;CAC3B,CAAA;AAED,aAAK,QAAQ,GAAG,MAAM,YAAY,CAAA;AAElC,aAAK,eAAe,GAAG,QAAQ,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAA;AAEhD,aAAK,SAAS,GAAG,YAAY,GAC3B,kBAAkB,GAClB,cAAc,CAAC,SAAS,EAAE,SAAS,CAAC,GACpC,mBAAmB,CAAC,YAAY,CAAC,CAAA;AAEnC,aAAK,SAAS,GAAG,cAAc,CAC3B,MAAM,GACN,WAAW,GACX,SAAS,GACT,iBAAiB,GACjB,eAAe,GACf,cAAc,GACd,2BAA2B,GAC3B,6BAA6B,CAChC,CAAA;AAED,QAAA,MAAM,SAAS,EAAE,cAAc,CAAC,QAAQ,CAyCvC,CAAA;AAED,QAAA,MAAM,YAAY,EAAE,eAenB,CAAA;AAED,YAAY,EAAE,SAAS,EAAE,SAAS,EAAE,CAAA;AACpC,OAAO,EAAE,SAAS,EAAE,YAAY,EAAE,CAAA"}
+{"version":3,"file":"props.d.ts","sourceRoot":"","sources":["../../src/Tabs/props.ts"],"names":[],"mappings":"AAuBA,OAAO,KAAK,MAAM,OAAO,CAAA;AAQzB,OAAO,KAAK,EACV,OAAO,EACP,cAAc,EACd,cAAc,EACf,MAAM,sBAAsB,CAAA;AAC7B,OAAO,KAAK,EACV,mBAAmB,EACnB,cAAc,EACd,SAAS,EACV,MAAM,2BAA2B,CAAA;AAClC,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAA;AAC9D,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,sBAAsB,CAAA;AAExD,aAAK,YAAY,GAAG;IAClB;;OAEG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC1B,OAAO,CAAC,EAAE,SAAS,GAAG,WAAW,CAAA;IACjC;;OAEG;IACH,iBAAiB,CAAC,EAAE,MAAM,CAAA;IAC1B;;OAEG;IACH,kBAAkB,CAAC,EAAE,CACnB,KAAK,EAAE,KAAK,CAAC,UAAU,CAAC,YAAY,CAAC,GAAG,KAAK,CAAC,aAAa,CAAC,YAAY,CAAC,EACzE,OAAO,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,EAAE,CAAC,EAAE,MAAM,CAAA;KAAE,KACpC,IAAI,CAAA;IACT,QAAQ,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IAC1B,SAAS,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IAC3B,SAAS,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IAC3B,SAAS,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IAC3B;;;;OAIG;IACH,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB;;;;OAIG;IACH,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,SAAS,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,KAAK,CAAA;IACtC;;OAEG;IACH,UAAU,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,GAAG,IAAI,KAAK,IAAI,CAAA;IAC9C;;;OAGG;IACH,WAAW,CAAC,EAAE,OAAO,GAAG,QAAQ,CAAA;IAChC,mBAAmB,CAAC,EAAE,OAAO,CAAA;CAC9B,CAAA;AAED,aAAK,QAAQ,GAAG,MAAM,YAAY,CAAA;AAElC,aAAK,eAAe,GAAG,QAAQ,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAA;AAEhD,aAAK,SAAS,GAAG,YAAY,GAC3B,kBAAkB,GAClB,cAAc,CAAC,SAAS,EAAE,SAAS,CAAC,GACpC,mBAAmB,CAAC,YAAY,CAAC,CAAA;AAEnC,aAAK,SAAS,GAAG,cAAc,CAC3B,MAAM,GACN,WAAW,GACX,SAAS,GACT,iBAAiB,GACjB,eAAe,GACf,cAAc,CACjB,GAAG;IACF,yBAAyB,EAAE,MAAM,CAAA;IACjC,2BAA2B,EAAE,MAAM,CAAA;CACpC,CAAA;AAED,aAAK,SAAS,GAAG;IACf,mBAAmB,EAAE,OAAO,CAAA;CAC7B,CAAA;AAED,QAAA,MAAM,SAAS,EAAE,cAAc,CAAC,QAAQ,CAevC,CAAA;AAED,QAAA,MAAM,YAAY,EAAE,eAenB,CAAA;AAED,YAAY,EAAE,SAAS,EAAE,SAAS,EAAE,SAAS,EAAE,CAAA;AAC/C,OAAO,EAAE,SAAS,EAAE,YAAY,EAAE,CAAA"}