@elliemae/ds-tabs 3.0.0-alpha.0 → 3.0.0-alpha.1

package/dist/esm/parts/tabsPanel/TabsPanels.js

@@ -1,7 +1,6 @@
 import * as React from "react";
 import React2, { useMemo, useContext, useCallback } from "react";
 import SwipeableViews from "react-swipeable-views";
-import { getIdByIndex, getIndexById } from "../../utils/helpers";
 import { StyledPanelContainer } from "./styles";
 import { DSTabsContext } from "../../DSTabsCTX";
 import { useTabsCallbacks } from "../../utils/hooks/useTabsCallbacks";
@@ -12,15 +11,32 @@ const TabsPanels = () => {
     props: { animated, enableMouseEvents, onlyRenderActiveTab, children: tabs, isDSMobile }
   } = useContext(DSTabsContext);
   const { handleOnTabChange, handleOnMouseDown } = useTabsCallbacks();
-  const handleOnChangeIndex = useCallback((index) => {
-    handleOnTabChange(getIdByIndex(tabs, index));
-    if (focusableTabsRef.current)
-      focusableTabsRef.current[index].click();
-  }, [focusableTabsRef, handleOnTabChange, tabs]);
+  const handleOnChangeIndex = useCallback((index, indexLatest) => {
+    if (!focusableTabsRef.current)
+      return;
+    const offset = index - indexLatest;
+    if (focusableTabsRef.current) {
+      const currentIndexFocusable = focusableTabsRef.current?.findIndex((el) => el.dataset.tabId === actualActiveTab);
+      const newFocusableIndex = currentIndexFocusable >= 0 ? currentIndexFocusable + offset : -1;
+      if (newFocusableIndex < 0 || newFocusableIndex > focusableTabsRef.current?.length || !focusableTabsRef.current?.[newFocusableIndex])
+        return;
+      handleOnTabChange(focusableTabsRef.current[newFocusableIndex].dataset?.tabId);
+      focusableTabsRef.current[newFocusableIndex].click();
+    }
+  }, [actualActiveTab, focusableTabsRef, handleOnTabChange]);
+  const firstSlideToShow = useMemo(() => {
+    const childrenArray = React2.Children.toArray(tabs);
+    const index = childrenArray.filter((tab) => tab.props.disabled !== true).findIndex((tab) => tab.props.tabId === actualActiveTab);
+    if (index === -1)
+      return 0;
+    return index;
+  }, [actualActiveTab, tabs]);
   const panels = useMemo(() => React2.Children.map(tabs, (tab) => {
-    const { tabId: panelId = "", style, children: content } = tab.props;
+    const { tabId: panelId = "", style, children: content, disabled } = tab.props;
     const isActive = actualActiveTab === panelId;
     const shouldRender = !onlyRenderActiveTab || isActive;
+    if (disabled)
+      return null;
     return shouldRender && /* @__PURE__ */ React2.createElement(StyledPanelContainer, {
       key: panelId,
       id: panelId,
@@ -38,7 +54,7 @@ const TabsPanels = () => {
   if (animated) {
     return /* @__PURE__ */ React2.createElement(SwipeableViews, {
       enableMouseEvents,
-      index: getIndexById(tabs, actualActiveTab),
+      index: firstSlideToShow,
       onChangeIndex: handleOnChangeIndex
     }, panels);
   }

package/dist/esm/parts/tabsPanel/TabsPanels.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/parts/tabsPanel/TabsPanels.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable jsx-a11y/no-noninteractive-element-interactions */\nimport React, { useMemo, useContext, useCallback } from 'react';\nimport SwipeableViews from 'react-swipeable-views';\nimport { getIdByIndex, getIndexById } from '../../utils/helpers';\nimport { StyledPanelContainer } from './styles';\nimport { DSTabsContext } from '../../DSTabsCTX';\nimport { useTabsCallbacks } from '../../utils/hooks/useTabsCallbacks';\nimport { DSTabPropsWithDefaultT } from '../../DSTabsTypes';\n\nexport const TabsPanels = (): JSX.Element => {\n  const {\n    actualActiveTab,\n    focusableTabsRef,\n    props: { animated, enableMouseEvents, onlyRenderActiveTab, children: tabs, isDSMobile },\n  } = useContext(DSTabsContext);\n\n  const { handleOnTabChange, handleOnMouseDown } = useTabsCallbacks();\n\n  const handleOnChangeIndex = useCallback(\n    (index: number) => {\n      handleOnTabChange(getIdByIndex(tabs, index));\n\n      if (focusableTabsRef.current) focusableTabsRef.current[index].click();\n    },\n    [focusableTabsRef, handleOnTabChange, tabs],\n  );\n\n  const panels = useMemo(\n    () =>\n      React.Children.map(tabs, (tab: React.ReactElement<DSTabPropsWithDefaultT>) => {\n        const { tabId: panelId = '', style, children: content } = tab.props;\n        const isActive = actualActiveTab === panelId;\n        const shouldRender = !onlyRenderActiveTab || isActive;\n        return (\n          shouldRender && (\n            <StyledPanelContainer\n              key={panelId}\n              id={panelId}\n              aria-labelledby={`${panelId}-label`}\n              aria-hidden={!isActive}\n              data-panel-id={panelId}\n              data-testid=\"ds-tabs-tab-panel\"\n              hidden={!isActive}\n              onMouseDown={handleOnMouseDown}\n              role=\"tabpanel\"\n              style={style}\n              isDSMobile={isDSMobile}\n            >\n              {content}\n            </StyledPanelContainer>\n          )\n        );\n      }),\n    [actualActiveTab, handleOnMouseDown, isDSMobile, onlyRenderActiveTab, tabs],\n  );\n\n  if (animated) {\n    return (\n      <SwipeableViews\n        enableMouseEvents={enableMouseEvents}\n        index={getIndexById(tabs, actualActiveTab)}\n        onChangeIndex={handleOnChangeIndex}\n      >\n        {panels}\n      </SwipeableViews>\n    );\n  }\n\n  return <>{panels}</>;\n};\n"],
-  "mappings": "AAAA;ACCA;AACA;AACA;AACA;AACA;AACA;AAGO,MAAM,aAAa,MAAmB;AAC3C,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA,OAAO,EAAE,UAAU,mBAAmB,qBAAqB,UAAU,MAAM;AAAA,MACzE,WAAW;AAEf,QAAM,EAAE,mBAAmB,sBAAsB;AAEjD,QAAM,sBAAsB,YAC1B,CAAC,UAAkB;AACjB,sBAAkB,aAAa,MAAM;AAErC,QAAI,iBAAiB;AAAS,uBAAiB,QAAQ,OAAO;AAAA,KAEhE,CAAC,kBAAkB,mBAAmB;AAGxC,QAAM,SAAS,QACb,MACE,OAAM,SAAS,IAAI,MAAM,CAAC,QAAoD;AAC5E,UAAM,EAAE,OAAO,UAAU,IAAI,OAAO,UAAU,YAAY,IAAI;AAC9D,UAAM,WAAW,oBAAoB;AACrC,UAAM,eAAe,CAAC,uBAAuB;AAC7C,WACE,gBACE,qCAAC,sBAAD;AAAA,MACE,KAAK;AAAA,MACL,IAAI;AAAA,MACJ,mBAAiB,GAAG;AAAA,MACpB,eAAa,CAAC;AAAA,MACd,iBAAe;AAAA,MACf,eAAY;AAAA,MACZ,QAAQ,CAAC;AAAA,MACT,aAAa;AAAA,MACb,MAAK;AAAA,MACL;AAAA,MACA;AAAA,OAEC;AAAA,MAKX,CAAC,iBAAiB,mBAAmB,YAAY,qBAAqB;AAGxE,MAAI,UAAU;AACZ,WACE,qCAAC,gBAAD;AAAA,MACE;AAAA,MACA,OAAO,aAAa,MAAM;AAAA,MAC1B,eAAe;AAAA,OAEd;AAAA;AAKP,SAAO,4DAAG;AAAA;",
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable jsx-a11y/no-noninteractive-element-interactions */\nimport React, { useMemo, useContext, useCallback } from 'react';\nimport SwipeableViews from 'react-swipeable-views';\nimport { StyledPanelContainer } from './styles';\nimport { DSTabsContext } from '../../DSTabsCTX';\nimport { useTabsCallbacks } from '../../utils/hooks/useTabsCallbacks';\nimport { DSTabPropsWithDefaultT } from '../../DSTabsTypes';\n\nexport const TabsPanels = (): JSX.Element => {\n  const {\n    actualActiveTab,\n    focusableTabsRef,\n    props: { animated, enableMouseEvents, onlyRenderActiveTab, children: tabs, isDSMobile },\n  } = useContext(DSTabsContext);\n\n  const { handleOnTabChange, handleOnMouseDown } = useTabsCallbacks();\n\n  const handleOnChangeIndex = useCallback(\n    (index: number, indexLatest: number) => {\n      if (!focusableTabsRef.current) return;\n\n      const offset = index - indexLatest;\n\n      if (focusableTabsRef.current) {\n        const currentIndexFocusable = focusableTabsRef.current?.findIndex((el) => el.dataset.tabId === actualActiveTab);\n\n        const newFocusableIndex = currentIndexFocusable >= 0 ? currentIndexFocusable + offset : -1;\n\n        if (\n          newFocusableIndex < 0 ||\n          newFocusableIndex > focusableTabsRef.current?.length ||\n          !focusableTabsRef.current?.[newFocusableIndex]\n        )\n          return;\n        handleOnTabChange(focusableTabsRef.current[newFocusableIndex].dataset?.tabId as string);\n\n        // swiping does not trigger centerTab function inside handleOnTabChange because there is no event\n        // by clicking we are manually forcing to center the tab\n\n        focusableTabsRef.current[newFocusableIndex].click();\n      }\n    },\n    [actualActiveTab, focusableTabsRef, handleOnTabChange],\n  );\n\n  const firstSlideToShow = useMemo(() => {\n    const childrenArray = React.Children.toArray(tabs) as React.ReactElement<DSTabPropsWithDefaultT>[];\n    const index = childrenArray\n      .filter((tab) => tab.props.disabled !== true)\n      .findIndex((tab) => tab.props.tabId === actualActiveTab);\n\n    if (index === -1) return 0;\n    return index;\n  }, [actualActiveTab, tabs]);\n\n  const panels = useMemo(\n    () =>\n      React.Children.map(tabs, (tab: React.ReactElement<DSTabPropsWithDefaultT>) => {\n        const { tabId: panelId = '', style, children: content, disabled } = tab.props;\n        const isActive = actualActiveTab === panelId;\n        const shouldRender = !onlyRenderActiveTab || isActive;\n\n        if (disabled) return null;\n        return (\n          shouldRender && (\n            <StyledPanelContainer\n              key={panelId}\n              id={panelId}\n              aria-labelledby={`${panelId}-label`}\n              aria-hidden={!isActive}\n              data-panel-id={panelId}\n              data-testid=\"ds-tabs-tab-panel\"\n              hidden={!isActive}\n              onMouseDown={handleOnMouseDown}\n              role=\"tabpanel\"\n              style={style}\n              isDSMobile={isDSMobile}\n            >\n              {content}\n            </StyledPanelContainer>\n          )\n        );\n      }),\n    [actualActiveTab, handleOnMouseDown, isDSMobile, onlyRenderActiveTab, tabs],\n  );\n\n  if (animated) {\n    return (\n      <SwipeableViews\n        enableMouseEvents={enableMouseEvents}\n        index={firstSlideToShow}\n        onChangeIndex={handleOnChangeIndex}\n      >\n        {panels}\n      </SwipeableViews>\n    );\n  }\n\n  return <>{panels}</>;\n};\n"],
+  "mappings": "AAAA;ACCA;AACA;AACA;AACA;AACA;AAGO,MAAM,aAAa,MAAmB;AAC3C,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA,OAAO,EAAE,UAAU,mBAAmB,qBAAqB,UAAU,MAAM;AAAA,MACzE,WAAW;AAEf,QAAM,EAAE,mBAAmB,sBAAsB;AAEjD,QAAM,sBAAsB,YAC1B,CAAC,OAAe,gBAAwB;AACtC,QAAI,CAAC,iBAAiB;AAAS;AAE/B,UAAM,SAAS,QAAQ;AAEvB,QAAI,iBAAiB,SAAS;AAC5B,YAAM,wBAAwB,iBAAiB,SAAS,UAAU,CAAC,OAAO,GAAG,QAAQ,UAAU;AAE/F,YAAM,oBAAoB,yBAAyB,IAAI,wBAAwB,SAAS;AAExF,UACE,oBAAoB,KACpB,oBAAoB,iBAAiB,SAAS,UAC9C,CAAC,iBAAiB,UAAU;AAE5B;AACF,wBAAkB,iBAAiB,QAAQ,mBAAmB,SAAS;AAKvE,uBAAiB,QAAQ,mBAAmB;AAAA;AAAA,KAGhD,CAAC,iBAAiB,kBAAkB;AAGtC,QAAM,mBAAmB,QAAQ,MAAM;AACrC,UAAM,gBAAgB,OAAM,SAAS,QAAQ;AAC7C,UAAM,QAAQ,cACX,OAAO,CAAC,QAAQ,IAAI,MAAM,aAAa,MACvC,UAAU,CAAC,QAAQ,IAAI,MAAM,UAAU;AAE1C,QAAI,UAAU;AAAI,aAAO;AACzB,WAAO;AAAA,KACN,CAAC,iBAAiB;AAErB,QAAM,SAAS,QACb,MACE,OAAM,SAAS,IAAI,MAAM,CAAC,QAAoD;AAC5E,UAAM,EAAE,OAAO,UAAU,IAAI,OAAO,UAAU,SAAS,aAAa,IAAI;AACxE,UAAM,WAAW,oBAAoB;AACrC,UAAM,eAAe,CAAC,uBAAuB;AAE7C,QAAI;AAAU,aAAO;AACrB,WACE,gBACE,qCAAC,sBAAD;AAAA,MACE,KAAK;AAAA,MACL,IAAI;AAAA,MACJ,mBAAiB,GAAG;AAAA,MACpB,eAAa,CAAC;AAAA,MACd,iBAAe;AAAA,MACf,eAAY;AAAA,MACZ,QAAQ,CAAC;AAAA,MACT,aAAa;AAAA,MACb,MAAK;AAAA,MACL;AAAA,MACA;AAAA,OAEC;AAAA,MAKX,CAAC,iBAAiB,mBAAmB,YAAY,qBAAqB;AAGxE,MAAI,UAAU;AACZ,WACE,qCAAC,gBAAD;AAAA,MACE;AAAA,MACA,OAAO;AAAA,MACP,eAAe;AAAA,OAEd;AAAA;AAKP,SAAO,4DAAG;AAAA;",
   "names": []
 }

package/dist/esm/utils/helpers.js

@@ -42,14 +42,10 @@ const getVisibleDimensions = (node, referenceNode) => {
     height: Math.min(node.clientHeight, referenceNodeDimensions.top + referenceNode.clientHeight - nodeDimensions.top, node.clientHeight - (referenceNodeDimensions.top - nodeDimensions.top))
   };
 };
-const getIndexById = (children, activeId) => children && children.findIndex((item) => item.props.tabId === activeId);
-const getIdByIndex = (children, index) => children && children[index].props.tabId || "";
 const shouldHaveLeftGradient = (scrollLeft) => Math.abs(scrollLeft) > MOBILE_GRADIENT_WIDTH;
 const shouldHaveRightGradient = (scrollLeft, clientWidth, scrollWidth) => Math.abs(scrollLeft) <= scrollWidth - (clientWidth + MOBILE_GRADIENT_WIDTH);
 export {
   centerTab,
-  getIdByIndex,
-  getIndexById,
   getVisibleDimensions,
   isElementVisible,
   isElementVisibleCarousel,

package/dist/esm/utils/helpers.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/utils/helpers.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import type { CenterTabPropsT, DSTabPropsWithDefaultT, VisibleDimensionsT } from '../DSTabsTypes';\nimport { MOBILE_GRADIENT_WIDTH } from './constants';\n\nexport const isElementVisible = (tab: HTMLElement, tabList: HTMLElement): boolean => {\n  const tabDimensions = tab.getBoundingClientRect();\n  const tabListDimensions = tabList.getBoundingClientRect();\n\n  return tabDimensions.left <= tabListDimensions.left\n    ? tabListDimensions.left - tabDimensions.left <= tabDimensions.width\n    : tabDimensions.right - tabListDimensions.right <= tabDimensions.width;\n};\n\nexport const isElementVisibleCarousel = (\n  tab: HTMLElement | null,\n  tabContainer: HTMLDivElement | null,\n  firstOrLastItem = true,\n): boolean => {\n  if (tab && tabContainer) {\n    const tabDimensions = tab.getBoundingClientRect();\n    const tabContainerDimensions = tabContainer.getBoundingClientRect();\n\n    const offset = firstOrLastItem ? 16 : 32;\n    const tabDimensionsLeft = Math.floor(tabDimensions.left - offset);\n    const tabDimensionsRight = Math.floor(tabDimensions.right + offset);\n\n    const tabContainerDimensionsLeft = Math.floor(tabContainerDimensions.left);\n    const tabContainerDimensionsRight = Math.floor(tabContainerDimensions.right);\n\n    return tabDimensionsLeft >= tabContainerDimensionsLeft && tabDimensionsRight <= tabContainerDimensionsRight;\n  }\n  return false;\n};\n\nexport const centerTab = ({ e, listRef }: CenterTabPropsT) => {\n  if (listRef.current) {\n    const { offsetLeft } = e?.target as HTMLButtonElement;\n    const { width: tabWidth } = (e?.target as HTMLButtonElement).getBoundingClientRect();\n    const { width: listWidth } = listRef.current.getBoundingClientRect();\n    const extraSideSpace = listWidth - tabWidth;\n    const leftOffsetToCenter = extraSideSpace > 0 ? extraSideSpace / 2 : 0;\n    const centeredLeftOffset = offsetLeft > leftOffsetToCenter ? offsetLeft - leftOffsetToCenter : 0;\n    listRef.current.scrollTo({\n      top: 0,\n      left: centeredLeftOffset,\n      behavior: 'smooth',\n    });\n\n    e?.preventDefault();\n  }\n};\n\nexport const getVisibleDimensions = (node: HTMLElement, referenceNode: HTMLElement): VisibleDimensionsT => {\n  const nodeDimensions = node.getBoundingClientRect();\n  const referenceNodeDimensions = referenceNode.getBoundingClientRect();\n\n  return {\n    width: Math.min(\n      node.clientWidth,\n      referenceNodeDimensions.left + referenceNode.clientWidth - nodeDimensions.left,\n      node.clientWidth - (referenceNodeDimensions.left - nodeDimensions.left),\n    ),\n    height: Math.min(\n      node.clientHeight,\n      referenceNodeDimensions.top + referenceNode.clientHeight - nodeDimensions.top,\n      node.clientHeight - (referenceNodeDimensions.top - nodeDimensions.top),\n    ),\n  };\n};\n\nexport const getIndexById = (children: React.ReactElement<DSTabPropsWithDefaultT>[], activeId?: string): number =>\n  children && children.findIndex((item: React.ReactElement<DSTabPropsWithDefaultT>) => item.props.tabId === activeId);\n\nexport const getIdByIndex = (children: React.ReactElement<DSTabPropsWithDefaultT>[], index: number): string =>\n  (children && children[index].props.tabId) || '';\n\nexport const shouldHaveLeftGradient = (scrollLeft: number): boolean => Math.abs(scrollLeft) > MOBILE_GRADIENT_WIDTH;\n\nexport const shouldHaveRightGradient = (scrollLeft: number, clientWidth: number, scrollWidth: number): boolean =>\n  Math.abs(scrollLeft) <= scrollWidth - (clientWidth + MOBILE_GRADIENT_WIDTH);\n"],
-  "mappings": "AAAA;ACCA;AAEO,MAAM,mBAAmB,CAAC,KAAkB,YAAkC;AACnF,QAAM,gBAAgB,IAAI;AAC1B,QAAM,oBAAoB,QAAQ;AAElC,SAAO,cAAc,QAAQ,kBAAkB,OAC3C,kBAAkB,OAAO,cAAc,QAAQ,cAAc,QAC7D,cAAc,QAAQ,kBAAkB,SAAS,cAAc;AAAA;AAG9D,MAAM,2BAA2B,CACtC,KACA,cACA,kBAAkB,SACN;AACZ,MAAI,OAAO,cAAc;AACvB,UAAM,gBAAgB,IAAI;AAC1B,UAAM,yBAAyB,aAAa;AAE5C,UAAM,SAAS,kBAAkB,KAAK;AACtC,UAAM,oBAAoB,KAAK,MAAM,cAAc,OAAO;AAC1D,UAAM,qBAAqB,KAAK,MAAM,cAAc,QAAQ;AAE5D,UAAM,6BAA6B,KAAK,MAAM,uBAAuB;AACrE,UAAM,8BAA8B,KAAK,MAAM,uBAAuB;AAEtE,WAAO,qBAAqB,8BAA8B,sBAAsB;AAAA;AAElF,SAAO;AAAA;AAGF,MAAM,YAAY,CAAC,EAAE,GAAG,cAA+B;AAC5D,MAAI,QAAQ,SAAS;AACnB,UAAM,EAAE,eAAe,GAAG;AAC1B,UAAM,EAAE,OAAO,aAAc,IAAG,QAA6B;AAC7D,UAAM,EAAE,OAAO,cAAc,QAAQ,QAAQ;AAC7C,UAAM,iBAAiB,YAAY;AACnC,UAAM,qBAAqB,iBAAiB,IAAI,iBAAiB,IAAI;AACrE,UAAM,qBAAqB,aAAa,qBAAqB,aAAa,qBAAqB;AAC/F,YAAQ,QAAQ,SAAS;AAAA,MACvB,KAAK;AAAA,MACL,MAAM;AAAA,MACN,UAAU;AAAA;AAGZ,OAAG;AAAA;AAAA;AAIA,MAAM,uBAAuB,CAAC,MAAmB,kBAAmD;AACzG,QAAM,iBAAiB,KAAK;AAC5B,QAAM,0BAA0B,cAAc;AAE9C,SAAO;AAAA,IACL,OAAO,KAAK,IACV,KAAK,aACL,wBAAwB,OAAO,cAAc,cAAc,eAAe,MAC1E,KAAK,cAAe,yBAAwB,OAAO,eAAe;AAAA,IAEpE,QAAQ,KAAK,IACX,KAAK,cACL,wBAAwB,MAAM,cAAc,eAAe,eAAe,KAC1E,KAAK,eAAgB,yBAAwB,MAAM,eAAe;AAAA;AAAA;AAKjE,MAAM,eAAe,CAAC,UAAwD,aACnF,YAAY,SAAS,UAAU,CAAC,SAAqD,KAAK,MAAM,UAAU;AAErG,MAAM,eAAe,CAAC,UAAwD,UAClF,YAAY,SAAS,OAAO,MAAM,SAAU;AAExC,MAAM,yBAAyB,CAAC,eAAgC,KAAK,IAAI,cAAc;AAEvF,MAAM,0BAA0B,CAAC,YAAoB,aAAqB,gBAC/E,KAAK,IAAI,eAAe,cAAe,eAAc;",
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport type { CenterTabPropsT, VisibleDimensionsT } from '../DSTabsTypes';\nimport { MOBILE_GRADIENT_WIDTH } from './constants';\n\nexport const isElementVisible = (tab: HTMLElement, tabList: HTMLElement): boolean => {\n  const tabDimensions = tab.getBoundingClientRect();\n  const tabListDimensions = tabList.getBoundingClientRect();\n\n  return tabDimensions.left <= tabListDimensions.left\n    ? tabListDimensions.left - tabDimensions.left <= tabDimensions.width\n    : tabDimensions.right - tabListDimensions.right <= tabDimensions.width;\n};\n\nexport const isElementVisibleCarousel = (\n  tab: HTMLElement | null,\n  tabContainer: HTMLDivElement | null,\n  firstOrLastItem = true,\n): boolean => {\n  if (tab && tabContainer) {\n    const tabDimensions = tab.getBoundingClientRect();\n    const tabContainerDimensions = tabContainer.getBoundingClientRect();\n\n    const offset = firstOrLastItem ? 16 : 32;\n    const tabDimensionsLeft = Math.floor(tabDimensions.left - offset);\n    const tabDimensionsRight = Math.floor(tabDimensions.right + offset);\n\n    const tabContainerDimensionsLeft = Math.floor(tabContainerDimensions.left);\n    const tabContainerDimensionsRight = Math.floor(tabContainerDimensions.right);\n\n    return tabDimensionsLeft >= tabContainerDimensionsLeft && tabDimensionsRight <= tabContainerDimensionsRight;\n  }\n  return false;\n};\n\nexport const centerTab = ({ e, listRef }: CenterTabPropsT) => {\n  if (listRef.current) {\n    const { offsetLeft } = e?.target as HTMLButtonElement;\n    const { width: tabWidth } = (e?.target as HTMLButtonElement).getBoundingClientRect();\n    const { width: listWidth } = listRef.current.getBoundingClientRect();\n    const extraSideSpace = listWidth - tabWidth;\n    const leftOffsetToCenter = extraSideSpace > 0 ? extraSideSpace / 2 : 0;\n    const centeredLeftOffset = offsetLeft > leftOffsetToCenter ? offsetLeft - leftOffsetToCenter : 0;\n    listRef.current.scrollTo({\n      top: 0,\n      left: centeredLeftOffset,\n      behavior: 'smooth',\n    });\n\n    e?.preventDefault();\n  }\n};\n\nexport const getVisibleDimensions = (node: HTMLElement, referenceNode: HTMLElement): VisibleDimensionsT => {\n  const nodeDimensions = node.getBoundingClientRect();\n  const referenceNodeDimensions = referenceNode.getBoundingClientRect();\n\n  return {\n    width: Math.min(\n      node.clientWidth,\n      referenceNodeDimensions.left + referenceNode.clientWidth - nodeDimensions.left,\n      node.clientWidth - (referenceNodeDimensions.left - nodeDimensions.left),\n    ),\n    height: Math.min(\n      node.clientHeight,\n      referenceNodeDimensions.top + referenceNode.clientHeight - nodeDimensions.top,\n      node.clientHeight - (referenceNodeDimensions.top - nodeDimensions.top),\n    ),\n  };\n};\n\nexport const shouldHaveLeftGradient = (scrollLeft: number): boolean => Math.abs(scrollLeft) > MOBILE_GRADIENT_WIDTH;\n\nexport const shouldHaveRightGradient = (scrollLeft: number, clientWidth: number, scrollWidth: number): boolean =>\n  Math.abs(scrollLeft) <= scrollWidth - (clientWidth + MOBILE_GRADIENT_WIDTH);\n"],
+  "mappings": "AAAA;ACEA;AAEO,MAAM,mBAAmB,CAAC,KAAkB,YAAkC;AACnF,QAAM,gBAAgB,IAAI;AAC1B,QAAM,oBAAoB,QAAQ;AAElC,SAAO,cAAc,QAAQ,kBAAkB,OAC3C,kBAAkB,OAAO,cAAc,QAAQ,cAAc,QAC7D,cAAc,QAAQ,kBAAkB,SAAS,cAAc;AAAA;AAG9D,MAAM,2BAA2B,CACtC,KACA,cACA,kBAAkB,SACN;AACZ,MAAI,OAAO,cAAc;AACvB,UAAM,gBAAgB,IAAI;AAC1B,UAAM,yBAAyB,aAAa;AAE5C,UAAM,SAAS,kBAAkB,KAAK;AACtC,UAAM,oBAAoB,KAAK,MAAM,cAAc,OAAO;AAC1D,UAAM,qBAAqB,KAAK,MAAM,cAAc,QAAQ;AAE5D,UAAM,6BAA6B,KAAK,MAAM,uBAAuB;AACrE,UAAM,8BAA8B,KAAK,MAAM,uBAAuB;AAEtE,WAAO,qBAAqB,8BAA8B,sBAAsB;AAAA;AAElF,SAAO;AAAA;AAGF,MAAM,YAAY,CAAC,EAAE,GAAG,cAA+B;AAC5D,MAAI,QAAQ,SAAS;AACnB,UAAM,EAAE,eAAe,GAAG;AAC1B,UAAM,EAAE,OAAO,aAAc,IAAG,QAA6B;AAC7D,UAAM,EAAE,OAAO,cAAc,QAAQ,QAAQ;AAC7C,UAAM,iBAAiB,YAAY;AACnC,UAAM,qBAAqB,iBAAiB,IAAI,iBAAiB,IAAI;AACrE,UAAM,qBAAqB,aAAa,qBAAqB,aAAa,qBAAqB;AAC/F,YAAQ,QAAQ,SAAS;AAAA,MACvB,KAAK;AAAA,MACL,MAAM;AAAA,MACN,UAAU;AAAA;AAGZ,OAAG;AAAA;AAAA;AAIA,MAAM,uBAAuB,CAAC,MAAmB,kBAAmD;AACzG,QAAM,iBAAiB,KAAK;AAC5B,QAAM,0BAA0B,cAAc;AAE9C,SAAO;AAAA,IACL,OAAO,KAAK,IACV,KAAK,aACL,wBAAwB,OAAO,cAAc,cAAc,eAAe,MAC1E,KAAK,cAAe,yBAAwB,OAAO,eAAe;AAAA,IAEpE,QAAQ,KAAK,IACX,KAAK,cACL,wBAAwB,MAAM,cAAc,eAAe,eAAe,KAC1E,KAAK,eAAgB,yBAAwB,MAAM,eAAe;AAAA;AAAA;AAKjE,MAAM,yBAAyB,CAAC,eAAgC,KAAK,IAAI,cAAc;AAEvF,MAAM,0BAA0B,CAAC,YAAoB,aAAqB,gBAC/E,KAAK,IAAI,eAAe,cAAe,eAAc;",
   "names": []
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@elliemae/ds-tabs",
-  "version": "3.0.0-alpha.0",
+  "version": "3.0.0-alpha.1",
   "license": "MIT",
   "description": "ICE MT - Dimsum - Tabs",
   "files": [
@@ -131,11 +131,11 @@
     "indent": 4
   },
   "dependencies": {
-    "@elliemae/ds-button": "3.0.0-alpha.0",
-    "@elliemae/ds-icon": "3.0.0-alpha.0",
-    "@elliemae/ds-icons": "3.0.0-alpha.0",
-    "@elliemae/ds-props-helpers": "3.0.0-alpha.0",
-    "@elliemae/ds-system": "3.0.0-alpha.0",
+    "@elliemae/ds-button": "3.0.0-alpha.1",
+    "@elliemae/ds-icon": "3.0.0-alpha.1",
+    "@elliemae/ds-icons": "3.0.0-alpha.1",
+    "@elliemae/ds-props-helpers": "3.0.0-alpha.1",
+    "@elliemae/ds-system": "3.0.0-alpha.1",
     "@react-hook/resize-observer": "~1.2.5",
     "prop-types": "~15.7.2",
     "react-desc": "~4.1.3",
@@ -161,6 +161,7 @@
     "dev": "cross-env NODE_ENV=development node ../../scripts/build/build.mjs --watch",
     "test": "node ../../scripts/testing/test.mjs",
     "lint": "node ../../scripts/lint.mjs",
+    "dts": "node ../../scripts/dts.mjs",
     "build": "cross-env NODE_ENV=production node ../../scripts/build/build.mjs"
   }
 }

package/dist/types/DSTabs.d.ts

@@ -1,14 +0,0 @@
-/// <reference path="../../../../shared/typings/react-desc.d.ts" />
-import React from 'react';
-import type { DSTabsPropsT } from './DSTabsTypes';
-declare const DSTabs: {
-    (props: DSTabsPropsT): JSX.Element;
-    propTypes: React.WeakValidationMap<unknown>;
-};
-declare const DSTabsWithSchema: {
-    (props?: DSTabsPropsT | undefined): JSX.Element;
-    propTypes: unknown;
-    toTypescript: () => import("react-desc").TypescriptSchema;
-};
-export { DSTabs, DSTabsWithSchema };
-export default DSTabs;

package/dist/types/DSTabsCTX.d.ts

@@ -1,4 +0,0 @@
-/// <reference types="react" />
-import type { DSTabsUseCrossRefContextT, DSTabsUseTabsContextT } from './DSTabsTypes';
-export declare const DSTabsContext: import("react").Context<DSTabsUseTabsContextT>;
-export declare const DSTabsCrossRefContext: import("react").Context<DSTabsUseCrossRefContextT>;

package/dist/types/DSTabsDatatestid.d.ts

@@ -1,12 +0,0 @@
-export declare const DSTabsDatatestid: {
-    TABS_CONTAINER: string;
-    TAB_BUTTON: string;
-    SUBTAB_BUTTON: string;
-    TAB_PANEL: string;
-    SUB_TAB_LIST: string;
-    TAB_LIST: string;
-    CAROUSEL: {
-        BUTTON_RIGHT: string;
-        BUTTON_LEFT: string;
-    };
-};

package/dist/types/DSTabsTypes.d.ts

@@ -1,205 +0,0 @@
-import type React from 'react';
-import { TabTypes } from './utils/constants';
-declare type TabTypesT = typeof TabTypes[keyof typeof TabTypes];
-export interface DSTabsPropsT {
-    containerProps?: Record<string, unknown>;
-    innerRef?: React.MutableRefObject<HTMLDivElement>;
-    animated?: boolean;
-    enableMouseEvents?: boolean;
-    allowTextSelection?: boolean;
-    onTabChange?: (tabId: string, e?: React.MouseEvent) => void;
-    tabsListAriaLabel?: string;
-    type?: TabTypesT;
-    tabBarExtraContent?: React.ReactNode;
-    children: React.ReactElement<DSTabPropsWithDefaultT>[];
-    onlyRenderActiveTab?: boolean;
-    activeTab?: string;
-    withCarousel?: boolean;
-    firstSubtabRef?: React.MutableRefObject<HTMLElement>;
-    lastTabRef?: React.MutableRefObject<HTMLElement>;
-    fixedTabsHeaders?: boolean;
-    isDSMobile?: boolean;
-    showSelectionIndicator?: boolean;
-    showSeparator?: boolean;
-}
-export interface DSTabsPropsWithDefaultsT {
-    containerProps: Record<string, unknown>;
-    innerRef?: React.MutableRefObject<HTMLDivElement>;
-    animated: boolean;
-    enableMouseEvents: boolean;
-    allowTextSelection: boolean;
-    onTabChange: (tabId: string, e?: React.MouseEvent) => void;
-    tabsListAriaLabel: string;
-    type: TabTypesT;
-    tabBarExtraContent?: React.ReactNode;
-    children: React.ReactElement<DSTabPropsWithDefaultT>[];
-    onlyRenderActiveTab: boolean;
-    activeTab?: string;
-    withCarousel: boolean;
-    firstSubtabRef?: React.MutableRefObject<HTMLElement>;
-    lastTabRef?: React.MutableRefObject<HTMLElement>;
-    fixedTabsHeaders: boolean;
-    isDSMobile: boolean;
-    showSelectionIndicator: boolean;
-    showSeparator: boolean;
-}
-export interface DSTabsDefaultPropsT {
-    containerProps: Record<string, unknown>;
-    animated: boolean;
-    enableMouseEvents: boolean;
-    allowTextSelection: boolean;
-    onTabChange: (tabId: string, e?: React.MouseEvent) => void;
-    tabsListAriaLabel: string;
-    type: TabTypesT;
-    onlyRenderActiveTab: boolean;
-    fixedTabsHeaders: boolean;
-    children: React.ReactElement<DSTabPropsWithDefaultT>[];
-    withCarousel: boolean;
-    isDSMobile: boolean;
-    showSelectionIndicator: boolean;
-    showSeparator: boolean;
-}
-export interface CarouselPropsT {
-    children: React.ReactNode[];
-    updateIndicatorStyle?: () => void;
-}
-export interface DSTabPropsT {
-    tabId: string;
-    title?: string;
-    required?: boolean;
-    children?: React.ReactNode;
-    style?: Record<string, unknown>;
-    disabled?: boolean;
-    ref?: React.MutableRefObject<HTMLButtonElement>;
-    onClick?: (tabId: string, e: React.MouseEvent) => null | void;
-    onKeyDown?: (e: React.KeyboardEvent) => null | void;
-}
-export interface DSTabPropsWithDefaultT {
-    tabId: string;
-    title: string;
-    required: boolean;
-    children?: React.ReactNode;
-    style?: Record<string, unknown>;
-    disabled: boolean;
-    ref?: React.MutableRefObject<HTMLButtonElement>;
-    onClick?: (tabId: string, e: React.MouseEvent) => null | void;
-    onKeyDown?: (e: React.KeyboardEvent) => null | void;
-}
-export interface CarouselButtonsPropsT {
-    leftButtonOnClick: () => void;
-    rightButtonOnClick: () => void;
-    showChevrons: ShowChevronsT;
-    type: TabTypesT;
-}
-export interface DSTabsUseCrossRefContextT {
-    lastTabInternalRef: React.MutableRefObject<HTMLButtonElement | null | undefined>;
-    firstSubtabInternalRef: React.MutableRefObject<HTMLButtonElement | null | undefined>;
-}
-export interface DSTabsUseTabsContextT {
-    props: DSTabsPropsWithDefaultsT;
-    tabsRef: React.MutableRefObject<Record<number, HTMLButtonElement> | null>;
-    focusableTabsRef: React.MutableRefObject<HTMLButtonElement[] | null>;
-    tabsListRef: React.MutableRefObject<HTMLDivElement | null>;
-    tabsRefAsArray: React.MutableRefObject<HTMLButtonElement[] | null>;
-    actualActiveTabRef: React.MutableRefObject<HTMLButtonElement | null>;
-    carouselOnlyListRef: React.MutableRefObject<HTMLDivElement | null>;
-    setInternalActiveTab: React.Dispatch<React.SetStateAction<string>>;
-    actualActiveTab: string;
-}
-export interface UseRezisePropsT {
-    ref: React.MutableRefObject<HTMLDivElement | null>;
-    callback: () => void;
-}
-export interface UseCarouselPropsT {
-    updateIndicatorStyle?: () => void;
-}
-export interface ShowChevronsT {
-    right: boolean;
-    left: boolean;
-}
-export interface MobileGradientsT {
-    right: boolean;
-    left: boolean;
-}
-export interface IndicatorStyleT {
-    left: string;
-    width: string;
-    backgroundWithTransparent: string;
-}
-export interface UseCarouselReturnTypeT {
-    showChevrons: ShowChevronsT;
-    leftButtonOnClick: () => void;
-    rightButtonOnClick: () => void;
-    handleOnClick: (e: React.MouseEvent) => void;
-    handleOnScroll: (e: React.UIEvent) => void;
-}
-export interface UseCarouselCallbacksPropsT {
-    getVisibleItemsOffset: () => number;
-    recalcChevrons: () => void;
-    updateIndicatorStyle?: () => void;
-}
-export interface UseCarouselCallbacksReturnTypeT {
-    leftButtonOnClick: () => void;
-    rightButtonOnClick: () => void;
-    handleOnClick: (e: React.MouseEvent) => void;
-    handleOnScroll: (e: React.UIEvent) => void;
-}
-export interface UseKeyboardNavigationReturnTypeT {
-    handleOnKeyDown: (e: React.KeyboardEvent) => void;
-}
-export interface UseTabsCallbacksReturnTypeT {
-    handleOnTabChange: (tabId: string, e?: React.MouseEvent) => void;
-    handleOnMouseDown: (e: React.MouseEvent) => void;
-}
-export interface UseTabBarReturnTypeT {
-    updateIndicatorStyle: () => void;
-    updateMobileGradients: () => void;
-    setIndicatorStyle: React.Dispatch<React.SetStateAction<IndicatorStyleT>>;
-    indicatorStyle: IndicatorStyleT;
-    mobileGradients: MobileGradientsT;
-}
-export interface VisibleDimensionsT {
-    width: number;
-    height: number;
-}
-export interface CenterTabPropsT {
-    e?: React.MouseEvent | React.FocusEvent;
-    listRef: React.MutableRefObject<HTMLDivElement | null>;
-}
-export interface StyledTabWrapperPropsT {
-    isDSMobile: boolean;
-    fixedTabsHeaders: boolean;
-}
-export interface StyledTabListPropsT {
-    withCarousel: boolean;
-    isDSMobile: boolean;
-    fixedTabsHeaders: boolean;
-    mobileGradients: MobileGradientsT;
-    indicatorStyle: IndicatorStyleT;
-    tabType: TabTypesT;
-}
-export interface StyledSubTabsListPropsT {
-    withCarousel: boolean;
-}
-export interface StyledTabButtonPropsT {
-    isActive: boolean;
-    disabled: boolean;
-    showSeparator: boolean;
-    isDSMobile: boolean;
-    fixedTabsHeaders: boolean;
-    withCarousel: boolean;
-    tabType: TabTypesT;
-}
-export interface StyledCarouselButtonWrapperPropsT {
-    right?: boolean;
-    tabType: TabTypesT;
-}
-export interface StyledPanelContainerPropsT {
-    hidden: boolean;
-    isDSMobile: boolean;
-}
-export interface StyledSelectionIndicatoPropsT {
-    isDSMobile: boolean;
-    tabType: TabTypesT;
-}
-export {};

package/dist/types/config/useCrossRef.d.ts

@@ -1,2 +0,0 @@
-import type { DSTabsUseCrossRefContextT } from '../DSTabsTypes';
-export declare const useCrossRef: () => DSTabsUseCrossRefContextT;

package/dist/types/config/useTabs.d.ts

@@ -1,2 +0,0 @@
-import type { DSTabsPropsT, DSTabsUseTabsContextT } from '../DSTabsTypes';
-export declare const useTabs: (props: DSTabsPropsT) => DSTabsUseTabsContextT;

package/dist/types/defaultProps.d.ts

@@ -1,2 +0,0 @@
-import type { DSTabsDefaultPropsT } from './DSTabsTypes';
-export declare const tabsDefaultProps: DSTabsDefaultPropsT;

package/dist/types/exportsRelated/DSTab.d.ts

@@ -1,14 +0,0 @@
-/// <reference path="../../../../../shared/typings/react-desc.d.ts" />
-import React from 'react';
-import type { DSTabPropsT } from '../DSTabsTypes';
-declare const DSTab: {
-    (props: DSTabPropsT): JSX.Element;
-    propTypes: React.WeakValidationMap<unknown>;
-};
-declare const DSTabWithSchema: {
-    (props?: DSTabPropsT | undefined): JSX.Element;
-    propTypes: unknown;
-    toTypescript: () => import("react-desc").TypescriptSchema;
-};
-export { DSTab, DSTabWithSchema };
-export default DSTab;

package/dist/types/index.d.ts

@@ -1,5 +0,0 @@
-export * from './exportsRelated/DSTab';
-export * from './DSTabs';
-export { TabTypes } from './utils/constants';
-export * from './DSTabsDatatestid';
-export type { DSTabsPropsT, DSTabPropsT } from './DSTabsTypes';

package/dist/types/parts/carousel/Carousel.d.ts

@@ -1,3 +0,0 @@
-/// <reference types="react" />
-import type { CarouselPropsT } from '../../DSTabsTypes';
-export declare const Carousel: ({ children, updateIndicatorStyle }: CarouselPropsT) => JSX.Element;

package/dist/types/parts/carousel/styles.d.ts

@@ -1,9 +0,0 @@
-/// <reference types="react" />
-import type { StyledCarouselButtonWrapperPropsT } from '../../DSTabsTypes';
-export declare const StyledCarouselBtn: import("styled-components").StyledComponent<{
-    (props: import("@elliemae/ds-button/dist/types/v2/propTypes").DSButtonPropsT): JSX.Element;
-    propTypes: import("react").WeakValidationMap<unknown>;
-}, import("styled-components").DefaultTheme, {}, never>;
-export declare const StyledCarouselWrapper: import("styled-components").StyledComponent<"span", import("styled-components").DefaultTheme, {}, never>;
-export declare const StyledChildrenWrap: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
-export declare const StyledCarouselButtonWrapper: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, StyledCarouselButtonWrapperPropsT, never>;

package/dist/types/parts/carousel/useCarousel.d.ts

@@ -1,2 +0,0 @@
-import type { UseCarouselPropsT, UseCarouselReturnTypeT } from '../../DSTabsTypes';
-export declare const useCarousel: ({ updateIndicatorStyle }: UseCarouselPropsT) => UseCarouselReturnTypeT;

package/dist/types/parts/carousel/useCarouselCallbacks.d.ts

@@ -1,2 +0,0 @@
-import type { UseCarouselCallbacksPropsT, UseCarouselCallbacksReturnTypeT } from '../../DSTabsTypes';
-export declare const useCarouselCallbacks: ({ getVisibleItemsOffset, updateIndicatorStyle, recalcChevrons, }: UseCarouselCallbacksPropsT) => UseCarouselCallbacksReturnTypeT;

package/dist/types/parts/tabBar/TabBar.d.ts

@@ -1,2 +0,0 @@
-/// <reference types="react" />
-export declare const TabBar: () => JSX.Element;

package/dist/types/parts/tabBar/styles.d.ts

@@ -1,7 +0,0 @@
-import type { StyledSelectionIndicatoPropsT, StyledSubTabsListPropsT, StyledTabListPropsT, StyledTabButtonPropsT, StyledTabWrapperPropsT } from '../../DSTabsTypes';
-export declare const StyledSelectionIndicator: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, StyledSelectionIndicatoPropsT, never>;
-export declare const StyledTabWrapper: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, StyledTabWrapperPropsT, never>;
-export declare const StyledTabButton: import("styled-components").StyledComponent<"button", import("styled-components").DefaultTheme, StyledTabButtonPropsT, never>;
-export declare const StyledSubTabsList: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, StyledSubTabsListPropsT, never>;
-export declare const StyledTabList: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, StyledTabListPropsT, never>;
-export declare const StyledRequiredMark: import("styled-components").StyledComponent<"span", import("styled-components").DefaultTheme, {}, never>;

package/dist/types/parts/tabBar/useTabBar.d.ts

@@ -1,2 +0,0 @@
-import type { UseTabBarReturnTypeT } from '../../DSTabsTypes';
-export declare const useTabBar: () => UseTabBarReturnTypeT;

package/dist/types/parts/tabsContent/TabsContent.d.ts

@@ -1,2 +0,0 @@
-/// <reference types="react" />
-export declare const TabsContent: () => JSX.Element;

package/dist/types/parts/tabsContent/styles.d.ts

@@ -1 +0,0 @@
-export declare const StyledTabBarContainer: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;

package/dist/types/parts/tabsPanel/TabsPanels.d.ts

@@ -1,2 +0,0 @@
-/// <reference types="react" />
-export declare const TabsPanels: () => JSX.Element;

package/dist/types/parts/tabsPanel/styles.d.ts

@@ -1,2 +0,0 @@
-import type { StyledPanelContainerPropsT } from '../../DSTabsTypes';
-export declare const StyledPanelContainer: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, StyledPanelContainerPropsT, never>;

package/dist/types/propTypes.d.ts

@@ -1,54 +0,0 @@
-/// <reference path="../../../../shared/typings/react-desc.d.ts" />
-export declare const tabPropTypes: {
-    tabId: {
-        deprecated: import("react-desc").PropTypesDescValidator;
-    };
-    title: {
-        deprecated: import("react-desc").PropTypesDescValidator;
-    };
-    required: {
-        deprecated: import("react-desc").PropTypesDescValidator;
-    };
-    disabled: {
-        deprecated: import("react-desc").PropTypesDescValidator;
-    };
-};
-export declare const tabsPropTypes: {
-    animated: {
-        deprecated: import("react-desc").PropTypesDescValidator;
-    };
-    enableMouseEvents: {
-        deprecated: import("react-desc").PropTypesDescValidator;
-    };
-    allowTextSelection: {
-        deprecated: import("react-desc").PropTypesDescValidator;
-    };
-    onTabChange: {
-        deprecated: import("react-desc").PropTypesDescValidator;
-    };
-    type: {
-        deprecated: import("react-desc").PropTypesDescValidator;
-    };
-    tabBarExtraContent: {
-        deprecated: import("react-desc").PropTypesDescValidator;
-    };
-    onlyRenderActiveTab: {
-        deprecated: import("react-desc").PropTypesDescValidator;
-    };
-    withCarousel: {
-        deprecated: import("react-desc").PropTypesDescValidator;
-    };
-    activeTab: {
-        deprecated: import("react-desc").PropTypesDescValidator;
-    };
-    children: import("react-desc").PropTypesDescValue;
-    tabsListAriaLabel: {
-        deprecated: import("react-desc").PropTypesDescValidator;
-    };
-    containerProps: {
-        deprecated: import("react-desc").PropTypesDescValidator;
-    };
-    innerRef: {
-        deprecated: import("react-desc").PropTypesDescValidator;
-    };
-};

package/dist/types/tests/DSTabs.callbacks.test.d.ts

@@ -1 +0,0 @@
-export {};

package/dist/types/tests/DSTabs.func.test.d.ts

@@ -1 +0,0 @@
-export {};

package/dist/types/tests/DSTabs.keyboard.test.d.ts

@@ -1 +0,0 @@
-export {};

package/dist/types/tests/DSTabs.test.d.ts

@@ -1 +0,0 @@
-export {};

package/dist/types/utils/constants.d.ts

@@ -1,18 +0,0 @@
-export declare const TabTypes: {
-    NORMAL: "normal";
-    NORMAL_SMALL: "normal_small";
-    SUBTABS: "subtabs";
-};
-export declare const TabTypesValuesAsArray: ("normal" | "normal_small" | "subtabs")[];
-export declare const MOBILE_GRADIENT_WIDTH = 24;
-export declare const defaultIndicatorStyles: {
-    left: string;
-    width: string;
-    backgroundWithTransparent: string;
-};
-export declare const gradientOffsetsAccordingType: {
-    normal_small: number;
-    normal: number;
-    subtabs: number;
-    fixedTabsHeaders: number;
-};

package/dist/types/utils/helpers.d.ts

@@ -1,9 +0,0 @@
-import type { CenterTabPropsT, DSTabPropsWithDefaultT, VisibleDimensionsT } from '../DSTabsTypes';
-export declare const isElementVisible: (tab: HTMLElement, tabList: HTMLElement) => boolean;
-export declare const isElementVisibleCarousel: (tab: HTMLElement | null, tabContainer: HTMLDivElement | null, firstOrLastItem?: boolean) => boolean;
-export declare const centerTab: ({ e, listRef }: CenterTabPropsT) => void;
-export declare const getVisibleDimensions: (node: HTMLElement, referenceNode: HTMLElement) => VisibleDimensionsT;
-export declare const getIndexById: (children: React.ReactElement<DSTabPropsWithDefaultT>[], activeId?: string | undefined) => number;
-export declare const getIdByIndex: (children: React.ReactElement<DSTabPropsWithDefaultT>[], index: number) => string;
-export declare const shouldHaveLeftGradient: (scrollLeft: number) => boolean;
-export declare const shouldHaveRightGradient: (scrollLeft: number, clientWidth: number, scrollWidth: number) => boolean;

package/dist/types/utils/hooks/useKeyboardNavigation.d.ts

@@ -1,2 +0,0 @@
-import type { UseKeyboardNavigationReturnTypeT } from '../../DSTabsTypes';
-export declare const useKeyboardNavigation: () => UseKeyboardNavigationReturnTypeT;

package/dist/types/utils/hooks/useTabsCallbacks.d.ts

@@ -1,2 +0,0 @@
-import type { UseTabsCallbacksReturnTypeT } from '../../DSTabsTypes';
-export declare const useTabsCallbacks: () => UseTabsCallbacksReturnTypeT;