@elliemae/ds-tabs 3.5.0-rc.2 → 3.5.0-rc.5

package/dist/cjs/parts/tabBar/useTabBar.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../../../src/parts/tabBar/useTabBar.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
   "sourcesContent": ["/* eslint-disable max-statements */\nimport { useCallback, useLayoutEffect, useState, useContext } from 'react';\nimport useResizeObserver from '@react-hook/resize-observer';\nimport { isElementVisible, shouldHaveLeftGradient, shouldHaveRightGradient } from '../../utils/helpers';\nimport { DSTabsContext } from '../../DSTabsCTX';\nimport { defaultIndicatorStyles } from '../../utils/constants';\nimport type { DSTabsInternalsT } from '../../sharedTypes';\n\ninterface UseTabBarReturnTypeT {\n  updateIndicatorStyle: () => void;\n  updateMobileGradients: () => void;\n  setIndicatorStyle: React.Dispatch<React.SetStateAction<DSTabsInternalsT.IndicatorStyleT>>;\n  indicatorStyle: DSTabsInternalsT.IndicatorStyleT;\n  mobileGradients: DSTabsInternalsT.MobileGradientsT;\n}\n\nexport const useTabBar = (): UseTabBarReturnTypeT => {\n  const {\n    actualActiveTab,\n    actualActiveTabRef,\n    tabsListRef,\n    props: { showSelectionIndicator, isDSMobile, fixedTabsHeaders },\n  } = useContext(DSTabsContext);\n\n  const [mobileGradients, setMobileGradients] = useState<DSTabsInternalsT.MobileGradientsT>({\n    left: false,\n    right: false,\n  });\n  const [indicatorStyle, setIndicatorStyle] = useState<DSTabsInternalsT.IndicatorStyleT>(defaultIndicatorStyles);\n\n  const getIndicatorStyles = useCallback(() => {\n    if (tabsListRef.current) {\n      const tabList = tabsListRef.current;\n      const activeTabButton = actualActiveTabRef.current;\n\n      if (!activeTabButton || !isElementVisible(activeTabButton, tabList)) return defaultIndicatorStyles;\n\n      // The missingMargins are to make the selection indicator white marks work properly in desktop, we need\n      // the full width of the tab button with margins.\n      const missingMargins = isDSMobile ? 0 : 16;\n\n      const tabClientWidth =\n        isDSMobile && !fixedTabsHeaders\n          ? activeTabButton.clientWidth\n          : activeTabButton.clientWidth + missingMargins * 2;\n\n      // The reason why we use the tabList.scrollLeft is due to the centerOnTabChange (only in Mobile and FlexibleTabs)\n      // behavior that adds scroll to the tabList\n      const position =\n        isDSMobile && !fixedTabsHeaders\n          ? activeTabButton.getBoundingClientRect().left - tabList.getBoundingClientRect().left + tabList.scrollLeft\n          : activeTabButton.getBoundingClientRect().left - tabList.getBoundingClientRect().left - missingMargins;\n\n      return {\n        left: Math.round(position),\n        width: Math.round(tabClientWidth),\n      };\n    }\n    return defaultIndicatorStyles;\n  }, [actualActiveTabRef, fixedTabsHeaders, isDSMobile, tabsListRef]);\n\n  const updateIndicatorStyle = useCallback(\n    () => setTimeout(() => setIndicatorStyle(getIndicatorStyles()), 100),\n    [getIndicatorStyles, setIndicatorStyle],\n  );\n\n  useResizeObserver(tabsListRef, updateIndicatorStyle);\n\n  const updateMobileGradients = useCallback(() => {\n    if (tabsListRef.current && isDSMobile && !fixedTabsHeaders) {\n      const { scrollLeft, scrollWidth, clientWidth } = tabsListRef.current;\n      setMobileGradients({\n        left: shouldHaveLeftGradient(scrollLeft),\n        right: shouldHaveRightGradient(scrollLeft, clientWidth, scrollWidth),\n      });\n    }\n  }, [fixedTabsHeaders, isDSMobile, tabsListRef]);\n\n  useLayoutEffect(() => {\n    if (showSelectionIndicator) {\n      updateIndicatorStyle();\n    }\n    if (isDSMobile && !fixedTabsHeaders) {\n      updateMobileGradients();\n    }\n  }, [\n    updateMobileGradients,\n    showSelectionIndicator,\n    updateIndicatorStyle,\n    isDSMobile,\n    fixedTabsHeaders,\n    actualActiveTab,\n  ]);\n\n  return {\n    updateIndicatorStyle,\n    setIndicatorStyle,\n    indicatorStyle,\n    mobileGradients,\n    updateMobileGradients,\n  };\n};\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADCvB,mBAAmE;AACnE,6BAA8B;AAC9B,qBAAkF;AAClF,uBAA8B;AAC9B,uBAAuC;AAWhC,MAAM,YAAY,MAA4B;AACnD,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA,OAAO,EAAE,wBAAwB,YAAY;AAAA,MAC3C,6BAAW,8BAAa;AAE5B,QAAM,CAAC,iBAAiB,sBAAsB,2BAA4C;AAAA,IACxF,MAAM;AAAA,IACN,OAAO;AAAA,EACT,CAAC;AACD,QAAM,CAAC,gBAAgB,qBAAqB,2BAA2C,uCAAsB;AAE7G,QAAM,qBAAqB,8BAAY,MAAM;AAC3C,QAAI,YAAY,SAAS;AACvB,YAAM,UAAU,YAAY;AAC5B,YAAM,kBAAkB,mBAAmB;AAE3C,UAAI,CAAC,mBAAmB,CAAC,qCAAiB,iBAAiB,OAAO;AAAG,eAAO;AAI5E,YAAM,iBAAiB,aAAa,IAAI;AAExC,YAAM,iBACJ,cAAc,CAAC,mBACX,gBAAgB,cAChB,gBAAgB,cAAc,iBAAiB;AAIrD,YAAM,WACJ,cAAc,CAAC,mBACX,gBAAgB,sBAAsB,EAAE,OAAO,QAAQ,sBAAsB,EAAE,OAAO,QAAQ,aAC9F,gBAAgB,sBAAsB,EAAE,OAAO,QAAQ,sBAAsB,EAAE,OAAO;AAE5F,aAAO;AAAA,QACL,MAAM,KAAK,MAAM,QAAQ;AAAA,QACzB,OAAO,KAAK,MAAM,cAAc;AAAA,MAClC;AAAA,IACF;AACA,WAAO;AAAA,EACT,GAAG,CAAC,oBAAoB,kBAAkB,YAAY,WAAW,CAAC;AAElE,QAAM,uBAAuB,8BAC3B,MAAM,WAAW,MAAM,kBAAkB,mBAAmB,CAAC,GAAG,GAAG,GACnE,CAAC,oBAAoB,iBAAiB,CACxC;AAEA,sCAAkB,aAAa,oBAAoB;AAEnD,QAAM,wBAAwB,8BAAY,MAAM;AAC9C,QAAI,YAAY,WAAW,cAAc,CAAC,kBAAkB;AAC1D,YAAM,EAAE,YAAY,aAAa,gBAAgB,YAAY;AAC7D,yBAAmB;AAAA,QACjB,MAAM,2CAAuB,UAAU;AAAA,QACvC,OAAO,4CAAwB,YAAY,aAAa,WAAW;AAAA,MACrE,CAAC;AAAA,IACH;AAAA,EACF,GAAG,CAAC,kBAAkB,YAAY,WAAW,CAAC;AAE9C,oCAAgB,MAAM;AACpB,QAAI,wBAAwB;AAC1B,2BAAqB;AAAA,IACvB;AACA,QAAI,cAAc,CAAC,kBAAkB;AACnC,4BAAsB;AAAA,IACxB;AAAA,EACF,GAAG;AAAA,IACD;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AAED,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF;AACF;",
-  "names": []
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADCvB,mBAAmE;AACnE,6BAA8B;AAC9B,qBAAkF;AAClF,uBAA8B;AAC9B,uBAAuC;AAWhC,MAAM,YAAY,MAA4B;AACnD,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA,OAAO,EAAE,wBAAwB,YAAY,iBAAiB;AAAA,EAChE,QAAI,yBAAW,8BAAa;AAE5B,QAAM,CAAC,iBAAiB,kBAAkB,QAAI,uBAA4C;AAAA,IACxF,MAAM;AAAA,IACN,OAAO;AAAA,EACT,CAAC;AACD,QAAM,CAAC,gBAAgB,iBAAiB,QAAI,uBAA2C,uCAAsB;AAE7G,QAAM,yBAAqB,0BAAY,MAAM;AAC3C,QAAI,YAAY,SAAS;AACvB,YAAM,UAAU,YAAY;AAC5B,YAAM,kBAAkB,mBAAmB;AAE3C,UAAI,CAAC,mBAAmB,KAAC,iCAAiB,iBAAiB,OAAO;AAAG,eAAO;AAI5E,YAAM,iBAAiB,aAAa,IAAI;AAExC,YAAM,iBACJ,cAAc,CAAC,mBACX,gBAAgB,cAChB,gBAAgB,cAAc,iBAAiB;AAIrD,YAAM,WACJ,cAAc,CAAC,mBACX,gBAAgB,sBAAsB,EAAE,OAAO,QAAQ,sBAAsB,EAAE,OAAO,QAAQ,aAC9F,gBAAgB,sBAAsB,EAAE,OAAO,QAAQ,sBAAsB,EAAE,OAAO;AAE5F,aAAO;AAAA,QACL,MAAM,KAAK,MAAM,QAAQ;AAAA,QACzB,OAAO,KAAK,MAAM,cAAc;AAAA,MAClC;AAAA,IACF;AACA,WAAO;AAAA,EACT,GAAG,CAAC,oBAAoB,kBAAkB,YAAY,WAAW,CAAC;AAElE,QAAM,2BAAuB;AAAA,IAC3B,MAAM,WAAW,MAAM,kBAAkB,mBAAmB,CAAC,GAAG,GAAG;AAAA,IACnE,CAAC,oBAAoB,iBAAiB;AAAA,EACxC;AAEA,6BAAAA,SAAkB,aAAa,oBAAoB;AAEnD,QAAM,4BAAwB,0BAAY,MAAM;AAC9C,QAAI,YAAY,WAAW,cAAc,CAAC,kBAAkB;AAC1D,YAAM,EAAE,YAAY,aAAa,YAAY,IAAI,YAAY;AAC7D,yBAAmB;AAAA,QACjB,UAAM,uCAAuB,UAAU;AAAA,QACvC,WAAO,wCAAwB,YAAY,aAAa,WAAW;AAAA,MACrE,CAAC;AAAA,IACH;AAAA,EACF,GAAG,CAAC,kBAAkB,YAAY,WAAW,CAAC;AAE9C,oCAAgB,MAAM;AACpB,QAAI,wBAAwB;AAC1B,2BAAqB;AAAA,IACvB;AACA,QAAI,cAAc,CAAC,kBAAkB;AACnC,4BAAsB;AAAA,IACxB;AAAA,EACF,GAAG;AAAA,IACD;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AAED,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF;AACF;",
+  "names": ["useResizeObserver"]
 }

package/dist/cjs/parts/tabsContent/TabsContent.js

@@ -17,7 +17,10 @@ var __copyProps = (to, from, except, desc) => {
   }
   return to;
 };
-var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target, mod));
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 var TabsContent_exports = {};
 __export(TabsContent_exports, {

package/dist/cjs/parts/tabsContent/TabsContent.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../../../src/parts/tabsContent/TabsContent.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
   "sourcesContent": ["import React, { useContext } from 'react';\nimport { TabsPanels } from '../tabsPanel/TabsPanels';\nimport { TabBar } from '../tabBar/TabBar';\nimport { StyledTabBarContainer } from './styles';\nimport { DSTabsContext } from '../../DSTabsCTX';\nimport { DSTabsDatatestid } from '../../DSTabsDatatestid';\n\nexport const TabsContent = (): JSX.Element => {\n  const {\n    props: { containerProps, innerRef, tabsListAriaLabel, tabBarExtraContent },\n  } = useContext(DSTabsContext);\n\n  return (\n    <div {...containerProps} ref={innerRef} data-testid={DSTabsDatatestid.TABS_CONTAINER}>\n      <StyledTabBarContainer aria-label={tabsListAriaLabel} role=\"tablist\">\n        <TabBar />\n        {tabBarExtraContent}\n      </StyledTabBarContainer>\n      <TabsPanels />\n    </div>\n  );\n};\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAkC;AAClC,wBAA2B;AAC3B,oBAAuB;AACvB,oBAAsC;AACtC,uBAA8B;AAC9B,8BAAiC;AAE1B,MAAM,cAAc,MAAmB;AAC5C,QAAM;AAAA,IACJ,OAAO,EAAE,gBAAgB,UAAU,mBAAmB;AAAA,MACpD,6BAAW,8BAAa;AAE5B,SACE,mDAAC;AAAA,IAAK,GAAG;AAAA,IAAgB,KAAK;AAAA,IAAU,eAAa,yCAAiB;AAAA,KACpE,mDAAC;AAAA,IAAsB,cAAY;AAAA,IAAmB,MAAK;AAAA,KACzD,mDAAC,0BAAO,GACP,kBACH,GACA,mDAAC,kCAAW,CACd;AAEJ;",
-  "names": []
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAkC;AAClC,wBAA2B;AAC3B,oBAAuB;AACvB,oBAAsC;AACtC,uBAA8B;AAC9B,8BAAiC;AAE1B,MAAM,cAAc,MAAmB;AAC5C,QAAM;AAAA,IACJ,OAAO,EAAE,gBAAgB,UAAU,mBAAmB,mBAAmB;AAAA,EAC3E,QAAI,yBAAW,8BAAa;AAE5B,SACE,6BAAAA,QAAA,cAAC;AAAA,IAAK,GAAG;AAAA,IAAgB,KAAK;AAAA,IAAU,eAAa,yCAAiB;AAAA,KACpE,6BAAAA,QAAA,cAAC;AAAA,IAAsB,cAAY;AAAA,IAAmB,MAAK;AAAA,KACzD,6BAAAA,QAAA,cAAC,0BAAO,GACP,kBACH,GACA,6BAAAA,QAAA,cAAC,kCAAW,CACd;AAEJ;",
+  "names": ["React"]
 }

package/dist/cjs/parts/tabsContent/styles.js

@@ -17,7 +17,10 @@ var __copyProps = (to, from, except, desc) => {
   }
   return to;
 };
-var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target, mod));
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 var styles_exports = {};
 __export(styles_exports, {

package/dist/cjs/parts/tabsContent/styles.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../../../src/parts/tabsContent/styles.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
   "sourcesContent": ["import { styled } from '@elliemae/ds-system';\n\nexport const StyledTabBarContainer = styled.div`\n  display: flex;\n  overflow-x: hidden;\n`;\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,uBAAuB;AAEhB,MAAM,wBAAwB,wBAAO;AAAA;AAAA;AAAA;",
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,uBAAuB;AAEhB,MAAM,wBAAwB,wBAAO;AAAA;AAAA;AAAA;",
   "names": []
 }

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

@@ -17,7 +17,10 @@ var __copyProps = (to, from, except, desc) => {
   }
   return to;
 };
-var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target, mod));
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 var TabsPanels_exports = {};
 __export(TabsPanels_exports, {
@@ -37,19 +40,22 @@ const TabsPanels = () => {
     props: { animated, enableMouseEvents, onlyRenderActiveTab, children: tabs, isDSMobile }
   } = (0, import_react.useContext)(import_DSTabsCTX.DSTabsContext);
   const { handleOnTabChange, handleOnMouseDown } = (0, import_useTabsCallbacks.useTabsCallbacks)();
-  const handleOnChangeIndex = (0, import_react.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])
+  const handleOnChangeIndex = (0, import_react.useCallback)(
+    (index, indexLatest) => {
+      if (!focusableTabsRef.current)
         return;
-      handleOnTabChange(focusableTabsRef.current[newFocusableIndex].dataset?.tabId);
-      focusableTabsRef.current[newFocusableIndex].click();
-    }
-  }, [actualActiveTab, focusableTabsRef, handleOnTabChange]);
+      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 = (0, import_react.useMemo)(() => {
     const childrenArray = import_react.default.Children.toArray(tabs);
     const index = childrenArray.filter((tab) => tab.props.disabled !== true).findIndex((tab) => tab.props.tabId === actualActiveTab);
@@ -57,26 +63,29 @@ const TabsPanels = () => {
       return 0;
     return index;
   }, [actualActiveTab, tabs]);
-  const panels = (0, import_react.useMemo)(() => import_react.default.Children.map(tabs, (tab) => {
-    const { tabId: panelId = "", style, children: content, disabled } = tab.props;
-    const isActive = actualActiveTab === panelId;
-    const shouldRender = !onlyRenderActiveTab || isActive;
-    if (disabled)
-      return null;
-    return shouldRender && /* @__PURE__ */ import_react.default.createElement(import_styles.StyledPanelContainer, {
-      key: panelId,
-      id: panelId,
-      "aria-labelledby": `${panelId}-label`,
-      "aria-hidden": !isActive,
-      "data-panel-id": panelId,
-      "data-testid": "ds-tabs-tab-panel",
-      hidden: !isActive,
-      onMouseDown: handleOnMouseDown,
-      role: "tabpanel",
-      style,
-      isDSMobile
-    }, content);
-  }), [actualActiveTab, handleOnMouseDown, isDSMobile, onlyRenderActiveTab, tabs]);
+  const panels = (0, import_react.useMemo)(
+    () => import_react.default.Children.map(tabs, (tab) => {
+      const { tabId: panelId = "", style, children: content, disabled } = tab.props;
+      const isActive = actualActiveTab === panelId;
+      const shouldRender = !onlyRenderActiveTab || isActive;
+      if (disabled)
+        return null;
+      return shouldRender && /* @__PURE__ */ import_react.default.createElement(import_styles.StyledPanelContainer, {
+        key: panelId,
+        id: panelId,
+        "aria-labelledby": `${panelId}-label`,
+        "aria-hidden": !isActive,
+        "data-panel-id": panelId,
+        "data-testid": "ds-tabs-tab-panel",
+        hidden: !isActive,
+        onMouseDown: handleOnMouseDown,
+        role: "tabpanel",
+        style,
+        isDSMobile
+      }, content);
+    }),
+    [actualActiveTab, handleOnMouseDown, isDSMobile, onlyRenderActiveTab, tabs]
+  );
   if (animated) {
     return /* @__PURE__ */ import_react.default.createElement(import_react_swipeable_views.default, {
       enableMouseEvents,

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

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../../../src/parts/tabsPanel/TabsPanels.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
   "sourcesContent": ["/* 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 type { DSTabT } from '../../propTypes';\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<DSTabT.Props>[];\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<DSTabT.Props>) => {\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", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADCvB,mBAAwD;AACxD,mCAA2B;AAC3B,oBAAqC;AACrC,uBAA8B;AAC9B,8BAAiC;AAG1B,MAAM,aAAa,MAAmB;AAC3C,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA,OAAO,EAAE,UAAU,mBAAmB,qBAAqB,UAAU,MAAM;AAAA,MACzE,6BAAW,8BAAa;AAE5B,QAAM,EAAE,mBAAmB,sBAAsB,8CAAiB;AAElE,QAAM,sBAAsB,8BAC1B,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,eAAe;AAE9G,YAAM,oBAAoB,yBAAyB,IAAI,wBAAwB,SAAS;AAExF,UACE,oBAAoB,KACpB,oBAAoB,iBAAiB,SAAS,UAC9C,CAAC,iBAAiB,UAAU;AAE5B;AACF,wBAAkB,iBAAiB,QAAQ,mBAAmB,SAAS,KAAe;AAKtF,uBAAiB,QAAQ,mBAAmB,MAAM;AAAA,IACpD;AAAA,EACF,GACA,CAAC,iBAAiB,kBAAkB,iBAAiB,CACvD;AAEA,QAAM,mBAAmB,0BAAQ,MAAM;AACrC,UAAM,gBAAgB,qBAAM,SAAS,QAAQ,IAAI;AACjD,UAAM,QAAQ,cACX,OAAO,CAAC,QAAQ,IAAI,MAAM,aAAa,IAAI,EAC3C,UAAU,CAAC,QAAQ,IAAI,MAAM,UAAU,eAAe;AAEzD,QAAI,UAAU;AAAI,aAAO;AACzB,WAAO;AAAA,EACT,GAAG,CAAC,iBAAiB,IAAI,CAAC;AAE1B,QAAM,SAAS,0BACb,MACE,qBAAM,SAAS,IAAI,MAAM,CAAC,QAA0C;AAClE,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,mDAAC;AAAA,MACC,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,OACH;AAAA,EAGN,CAAC,GACH,CAAC,iBAAiB,mBAAmB,YAAY,qBAAqB,IAAI,CAC5E;AAEA,MAAI,UAAU;AACZ,WACE,mDAAC;AAAA,MACC;AAAA,MACA,OAAO;AAAA,MACP,eAAe;AAAA,OAEd,MACH;AAAA,EAEJ;AAEA,SAAO,wFAAG,MAAO;AACnB;",
-  "names": []
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADCvB,mBAAwD;AACxD,mCAA2B;AAC3B,oBAAqC;AACrC,uBAA8B;AAC9B,8BAAiC;AAG1B,MAAM,aAAa,MAAmB;AAC3C,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA,OAAO,EAAE,UAAU,mBAAmB,qBAAqB,UAAU,MAAM,WAAW;AAAA,EACxF,QAAI,yBAAW,8BAAa;AAE5B,QAAM,EAAE,mBAAmB,kBAAkB,QAAI,0CAAiB;AAElE,QAAM,0BAAsB;AAAA,IAC1B,CAAC,OAAe,gBAAwB;AACtC,UAAI,CAAC,iBAAiB;AAAS;AAE/B,YAAM,SAAS,QAAQ;AAEvB,UAAI,iBAAiB,SAAS;AAC5B,cAAM,wBAAwB,iBAAiB,SAAS,UAAU,CAAC,OAAO,GAAG,QAAQ,UAAU,eAAe;AAE9G,cAAM,oBAAoB,yBAAyB,IAAI,wBAAwB,SAAS;AAExF,YACE,oBAAoB,KACpB,oBAAoB,iBAAiB,SAAS,UAC9C,CAAC,iBAAiB,UAAU;AAE5B;AACF,0BAAkB,iBAAiB,QAAQ,mBAAmB,SAAS,KAAe;AAKtF,yBAAiB,QAAQ,mBAAmB,MAAM;AAAA,MACpD;AAAA,IACF;AAAA,IACA,CAAC,iBAAiB,kBAAkB,iBAAiB;AAAA,EACvD;AAEA,QAAM,uBAAmB,sBAAQ,MAAM;AACrC,UAAM,gBAAgB,aAAAA,QAAM,SAAS,QAAQ,IAAI;AACjD,UAAM,QAAQ,cACX,OAAO,CAAC,QAAQ,IAAI,MAAM,aAAa,IAAI,EAC3C,UAAU,CAAC,QAAQ,IAAI,MAAM,UAAU,eAAe;AAEzD,QAAI,UAAU;AAAI,aAAO;AACzB,WAAO;AAAA,EACT,GAAG,CAAC,iBAAiB,IAAI,CAAC;AAE1B,QAAM,aAAS;AAAA,IACb,MACE,aAAAA,QAAM,SAAS,IAAI,MAAM,CAAC,QAA0C;AAClE,YAAM,EAAE,OAAO,UAAU,IAAI,OAAO,UAAU,SAAS,SAAS,IAAI,IAAI;AACxE,YAAM,WAAW,oBAAoB;AACrC,YAAM,eAAe,CAAC,uBAAuB;AAE7C,UAAI;AAAU,eAAO;AACrB,aACE,gBACE,6BAAAA,QAAA,cAAC;AAAA,QACC,KAAK;AAAA,QACL,IAAI;AAAA,QACJ,mBAAiB,GAAG;AAAA,QACpB,eAAa,CAAC;AAAA,QACd,iBAAe;AAAA,QACf,eAAY;AAAA,QACZ,QAAQ,CAAC;AAAA,QACT,aAAa;AAAA,QACb,MAAK;AAAA,QACL;AAAA,QACA;AAAA,SAEC,OACH;AAAA,IAGN,CAAC;AAAA,IACH,CAAC,iBAAiB,mBAAmB,YAAY,qBAAqB,IAAI;AAAA,EAC5E;AAEA,MAAI,UAAU;AACZ,WACE,6BAAAA,QAAA,cAAC,6BAAAC,SAAA;AAAA,MACC;AAAA,MACA,OAAO;AAAA,MACP,eAAe;AAAA,OAEd,MACH;AAAA,EAEJ;AAEA,SAAO,6BAAAD,QAAA,2BAAAA,QAAA,gBAAG,MAAO;AACnB;",
+  "names": ["React", "SwipeableViews"]
 }

package/dist/cjs/parts/tabsPanel/styles.js

@@ -17,7 +17,10 @@ var __copyProps = (to, from, except, desc) => {
   }
   return to;
 };
-var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target, mod));
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 var styles_exports = {};
 __export(styles_exports, {

package/dist/cjs/parts/tabsPanel/styles.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../../../src/parts/tabsPanel/styles.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
   "sourcesContent": ["import { styled } from '@elliemae/ds-system';\n\ninterface StyledPanelContainerPropsT {\n  hidden: boolean;\n  isDSMobile: boolean;\n}\n\nexport const StyledPanelContainer = styled.div<StyledPanelContainerPropsT>`\n  padding-top: 8px;\n  &:focus {\n    outline: none;\n  }\n\n  ${({ hidden }) => (hidden ? 'visibility: hidden;' : '')}\n\n  ${({ isDSMobile }) => (isDSMobile ? `padding-top: 0;` : ``)}\n`;\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,uBAAuB;AAOhB,MAAM,uBAAuB,wBAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAMvC,CAAC,EAAE,aAAc,SAAS,wBAAwB;AAAA;AAAA,IAElD,CAAC,EAAE,iBAAkB,aAAa,oBAAoB;AAAA;",
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,uBAAuB;AAOhB,MAAM,uBAAuB,wBAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAMvC,CAAC,EAAE,OAAO,MAAO,SAAS,wBAAwB;AAAA;AAAA,IAElD,CAAC,EAAE,WAAW,MAAO,aAAa,oBAAoB;AAAA;",
   "names": []
 }

package/dist/cjs/propTypes.js

@@ -17,7 +17,10 @@ var __copyProps = (to, from, except, desc) => {
   }
   return to;
 };
-var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target, mod));
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 var propTypes_exports = {};
 __export(propTypes_exports, {

package/dist/cjs/propTypes.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../src/propTypes.tsx", "../../../../scripts/build/transpile/react-shim.js"],
   "sourcesContent": ["import { PropTypes } from '@elliemae/ds-utilities';\nimport { TabTypes, TabTypesValuesAsArray } from './utils/constants';\nimport type { DSTabsInternalsT } from './sharedTypes';\n\nconst noop = (): void => {};\n\nexport declare namespace DSTabT {\n  export interface PropsOptional {\n    style?: Record<string, unknown>;\n    title?: string;\n    required?: boolean;\n    disabled?: boolean;\n    ref?: React.MutableRefObject<HTMLButtonElement>;\n    onClick?: (tabId: string | number, e: React.MouseEvent) => null | void;\n    onKeyDown?: (e: React.KeyboardEvent) => null | void;\n  }\n\n  export interface PropsRequired {\n    children: React.ReactNode;\n    tabId: string | number;\n  }\n\n  export interface Props extends PropsOptional, PropsRequired {}\n}\n\nexport declare namespace DSTabsT {\n  export interface DefaultProps {\n    containerProps: Record<string, unknown>;\n    animated: boolean;\n    enableMouseEvents: boolean;\n    allowTextSelection: boolean;\n    onTabChange: (tabId: string | number, e?: React.MouseEvent) => void;\n    tabsListAriaLabel: string;\n    type: DSTabsInternalsT.TabTypesT;\n    children: React.ReactElement<DSTabT.Props>[];\n    onlyRenderActiveTab: boolean;\n    fixedTabsHeaders: boolean;\n    withCarousel: boolean;\n    isDSMobile: boolean;\n    showSelectionIndicator: boolean;\n    showSeparator: boolean;\n  }\n\n  export interface PropsOptional {\n    firstSubtabRef?: React.MutableRefObject<HTMLElement>;\n    lastTabRef?: React.MutableRefObject<HTMLElement>;\n    tabBarExtraContent?: React.ReactNode;\n    activeTab?: string;\n    innerRef?: React.MutableRefObject<HTMLDivElement>;\n  }\n\n  export interface Props extends Partial<DefaultProps>, PropsOptional {}\n\n  export interface InternalProps extends DefaultProps, PropsOptional {}\n}\n\nexport const tabPropTypes = {\n  tabId: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).description('Unique Tab id.').defaultValue(''),\n  title: PropTypes.string.description('Tab title.').defaultValue(''),\n  required: PropTypes.bool.description('Show a required mark next to the title.').defaultValue(false),\n  disabled: PropTypes.bool.description('Disables Tab.').defaultValue(false),\n};\n\nexport const tabsPropTypes = {\n  animated: PropTypes.bool.description('Whether the Tab transition should animate or not.').defaultValue(true),\n  enableMouseEvents: PropTypes.bool.description('Enables Tab transition with mouse drag events.').defaultValue(false),\n  allowTextSelection: PropTypes.bool\n    .description('Allows text selection when mouse drag events are active.')\n    .defaultValue(false),\n  onTabChange: PropTypes.func.description('Handler when a user clicks on a different Tab.').defaultValue('() => {}'),\n  type: PropTypes.oneOf(TabTypesValuesAsArray).description('Tab type.').defaultValue(TabTypesValuesAsArray[0]),\n  tabBarExtraContent: PropTypes.element.description('Extra content next to the Tab Bar.').defaultValue(undefined),\n  onlyRenderActiveTab: PropTypes.bool.description('Only renders the active Tab in the DOM.').defaultValue(false),\n  withCarousel: PropTypes.bool.description('Activate carousel behavior.').defaultValue(false),\n  activeTab: PropTypes.string\n    .description('Passing a value makes DSTabs a controlled component.')\n    .defaultValue('First DSTab children.'),\n  children: PropTypes.node.description('Use DSTab component as children.').isRequired,\n  tabsListAriaLabel: PropTypes.string.description('Aria label for the list.').defaultValue('Tab list.'),\n  containerProps: PropTypes.object.description('Additional properties for the container.').defaultValue({}),\n  innerRef: PropTypes.oneOfType([PropTypes.func, PropTypes.shape({ current: PropTypes.any })])\n    .description('Ref to the container.')\n    .defaultValue(undefined),\n};\n\nexport const tabsDefaultProps: DSTabsT.DefaultProps = {\n  containerProps: {},\n  animated: true,\n  enableMouseEvents: false,\n  allowTextSelection: false,\n  onTabChange: noop,\n  tabsListAriaLabel: 'Tab list',\n  type: TabTypes.NORMAL,\n  onlyRenderActiveTab: false,\n  withCarousel: false,\n  isDSMobile: false,\n  showSelectionIndicator: true,\n  children: [],\n  fixedTabsHeaders: false,\n  showSeparator: true,\n};\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,0BAA0B;AAC1B,uBAAgD;AAGhD,MAAM,OAAO,MAAY;AAAC;AAoDnB,MAAM,eAAe;AAAA,EAC1B,OAAO,8BAAU,UAAU,CAAC,8BAAU,QAAQ,8BAAU,MAAM,CAAC,EAAE,YAAY,gBAAgB,EAAE,aAAa,EAAE;AAAA,EAC9G,OAAO,8BAAU,OAAO,YAAY,YAAY,EAAE,aAAa,EAAE;AAAA,EACjE,UAAU,8BAAU,KAAK,YAAY,yCAAyC,EAAE,aAAa,KAAK;AAAA,EAClG,UAAU,8BAAU,KAAK,YAAY,eAAe,EAAE,aAAa,KAAK;AAC1E;AAEO,MAAM,gBAAgB;AAAA,EAC3B,UAAU,8BAAU,KAAK,YAAY,mDAAmD,EAAE,aAAa,IAAI;AAAA,EAC3G,mBAAmB,8BAAU,KAAK,YAAY,gDAAgD,EAAE,aAAa,KAAK;AAAA,EAClH,oBAAoB,8BAAU,KAC3B,YAAY,0DAA0D,EACtE,aAAa,KAAK;AAAA,EACrB,aAAa,8BAAU,KAAK,YAAY,gDAAgD,EAAE,aAAa,UAAU;AAAA,EACjH,MAAM,8BAAU,MAAM,sCAAqB,EAAE,YAAY,WAAW,EAAE,aAAa,uCAAsB,EAAE;AAAA,EAC3G,oBAAoB,8BAAU,QAAQ,YAAY,oCAAoC,EAAE,aAAa,MAAS;AAAA,EAC9G,qBAAqB,8BAAU,KAAK,YAAY,yCAAyC,EAAE,aAAa,KAAK;AAAA,EAC7G,cAAc,8BAAU,KAAK,YAAY,6BAA6B,EAAE,aAAa,KAAK;AAAA,EAC1F,WAAW,8BAAU,OAClB,YAAY,sDAAsD,EAClE,aAAa,uBAAuB;AAAA,EACvC,UAAU,8BAAU,KAAK,YAAY,kCAAkC,EAAE;AAAA,EACzE,mBAAmB,8BAAU,OAAO,YAAY,0BAA0B,EAAE,aAAa,WAAW;AAAA,EACpG,gBAAgB,8BAAU,OAAO,YAAY,0CAA0C,EAAE,aAAa,CAAC,CAAC;AAAA,EACxG,UAAU,8BAAU,UAAU,CAAC,8BAAU,MAAM,8BAAU,MAAM,EAAE,SAAS,8BAAU,IAAI,CAAC,CAAC,CAAC,EACxF,YAAY,uBAAuB,EACnC,aAAa,MAAS;AAC3B;AAEO,MAAM,mBAAyC;AAAA,EACpD,gBAAgB,CAAC;AAAA,EACjB,UAAU;AAAA,EACV,mBAAmB;AAAA,EACnB,oBAAoB;AAAA,EACpB,aAAa;AAAA,EACb,mBAAmB;AAAA,EACnB,MAAM,0BAAS;AAAA,EACf,qBAAqB;AAAA,EACrB,cAAc;AAAA,EACd,YAAY;AAAA,EACZ,wBAAwB;AAAA,EACxB,UAAU,CAAC;AAAA,EACX,kBAAkB;AAAA,EAClB,eAAe;AACjB;",
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,0BAA0B;AAC1B,uBAAgD;AAGhD,MAAM,OAAO,MAAY;AAAC;AAoDnB,MAAM,eAAe;AAAA,EAC1B,OAAO,8BAAU,UAAU,CAAC,8BAAU,QAAQ,8BAAU,MAAM,CAAC,EAAE,YAAY,gBAAgB,EAAE,aAAa,EAAE;AAAA,EAC9G,OAAO,8BAAU,OAAO,YAAY,YAAY,EAAE,aAAa,EAAE;AAAA,EACjE,UAAU,8BAAU,KAAK,YAAY,yCAAyC,EAAE,aAAa,KAAK;AAAA,EAClG,UAAU,8BAAU,KAAK,YAAY,eAAe,EAAE,aAAa,KAAK;AAC1E;AAEO,MAAM,gBAAgB;AAAA,EAC3B,UAAU,8BAAU,KAAK,YAAY,mDAAmD,EAAE,aAAa,IAAI;AAAA,EAC3G,mBAAmB,8BAAU,KAAK,YAAY,gDAAgD,EAAE,aAAa,KAAK;AAAA,EAClH,oBAAoB,8BAAU,KAC3B,YAAY,0DAA0D,EACtE,aAAa,KAAK;AAAA,EACrB,aAAa,8BAAU,KAAK,YAAY,gDAAgD,EAAE,aAAa,UAAU;AAAA,EACjH,MAAM,8BAAU,MAAM,sCAAqB,EAAE,YAAY,WAAW,EAAE,aAAa,uCAAsB,EAAE;AAAA,EAC3G,oBAAoB,8BAAU,QAAQ,YAAY,oCAAoC,EAAE,aAAa,MAAS;AAAA,EAC9G,qBAAqB,8BAAU,KAAK,YAAY,yCAAyC,EAAE,aAAa,KAAK;AAAA,EAC7G,cAAc,8BAAU,KAAK,YAAY,6BAA6B,EAAE,aAAa,KAAK;AAAA,EAC1F,WAAW,8BAAU,OAClB,YAAY,sDAAsD,EAClE,aAAa,uBAAuB;AAAA,EACvC,UAAU,8BAAU,KAAK,YAAY,kCAAkC,EAAE;AAAA,EACzE,mBAAmB,8BAAU,OAAO,YAAY,0BAA0B,EAAE,aAAa,WAAW;AAAA,EACpG,gBAAgB,8BAAU,OAAO,YAAY,0CAA0C,EAAE,aAAa,CAAC,CAAC;AAAA,EACxG,UAAU,8BAAU,UAAU,CAAC,8BAAU,MAAM,8BAAU,MAAM,EAAE,SAAS,8BAAU,IAAI,CAAC,CAAC,CAAC,EACxF,YAAY,uBAAuB,EACnC,aAAa,MAAS;AAC3B;AAEO,MAAM,mBAAyC;AAAA,EACpD,gBAAgB,CAAC;AAAA,EACjB,UAAU;AAAA,EACV,mBAAmB;AAAA,EACnB,oBAAoB;AAAA,EACpB,aAAa;AAAA,EACb,mBAAmB;AAAA,EACnB,MAAM,0BAAS;AAAA,EACf,qBAAqB;AAAA,EACrB,cAAc;AAAA,EACd,YAAY;AAAA,EACZ,wBAAwB;AAAA,EACxB,UAAU,CAAC;AAAA,EACX,kBAAkB;AAAA,EAClB,eAAe;AACjB;",
   "names": []
 }

package/dist/cjs/sharedTypes.js

@@ -13,7 +13,10 @@ var __copyProps = (to, from, except, desc) => {
   }
   return to;
 };
-var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target, mod));
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 var sharedTypes_exports = {};
 module.exports = __toCommonJS(sharedTypes_exports);

package/dist/cjs/sharedTypes.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../src/sharedTypes.tsx", "../../../../scripts/build/transpile/react-shim.js"],
   "sourcesContent": ["import { TabTypes } from './utils/constants';\nimport type { DSTabsT } from './propTypes';\n\nexport namespace DSTabsInternalsT {\n  export type TabTypesT = typeof TabTypes[keyof typeof TabTypes];\n\n  export interface MobileGradientsT {\n    right: boolean;\n    left: boolean;\n  }\n\n  export interface IndicatorStyleT {\n    left: number;\n    width: number;\n  }\n\n  export interface ShowChevronsT {\n    right: boolean;\n    left: boolean;\n  }\n\n  export interface DSTabsUseTabsContextT {\n    props: DSTabsT.InternalProps;\n    tabsRef: React.MutableRefObject<Record<number, HTMLButtonElement> | null>;\n    focusableTabsRef: React.MutableRefObject<HTMLButtonElement[] | null>;\n    tabsListRef: React.MutableRefObject<HTMLDivElement | null>;\n    tabsRefAsArray: React.MutableRefObject<HTMLButtonElement[] | null>;\n    actualActiveTabRef: React.MutableRefObject<HTMLButtonElement | null>;\n    carouselOnlyListRef: React.MutableRefObject<HTMLDivElement | null>;\n    setInternalActiveTab: React.Dispatch<React.SetStateAction<string>>;\n    actualActiveTab: string;\n  }\n\n  export interface DSTabsUseCrossRefContextT {\n    lastTabInternalRef: React.MutableRefObject<HTMLButtonElement | null | undefined>;\n    firstSubtabInternalRef: React.MutableRefObject<HTMLButtonElement | null | undefined>;\n  }\n}\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;AAAA;AAAA;ACAA,YAAuB;",
+  "mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;ACAA,YAAuB;",
   "names": []
 }

package/dist/cjs/utils/constants.js

@@ -17,7 +17,10 @@ var __copyProps = (to, from, except, desc) => {
   }
   return to;
 };
-var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target, mod));
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 var constants_exports = {};
 __export(constants_exports, {

package/dist/cjs/utils/constants.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../../src/utils/constants.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
   "sourcesContent": ["export const TabTypes = {\n  NORMAL: 'normal' as const,\n  NORMAL_SMALL: 'normal_small' as const,\n  SUBTABS: 'subtabs' as const,\n};\n\nexport const TabTypesValuesAsArray = Object.values(TabTypes);\n\nexport const MOBILE_GRADIENT_WIDTH = 24;\n\nexport const defaultIndicatorStyles = {\n  left: 0,\n  width: 0,\n};\n\nexport const gradientOffsetsAccordingType = {\n  normal_small: 14,\n  normal: 16,\n  subtabs: 16,\n  fixedTabsHeaders: 0,\n};\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAhB,MAAM,WAAW;AAAA,EACtB,QAAQ;AAAA,EACR,cAAc;AAAA,EACd,SAAS;AACX;AAEO,MAAM,wBAAwB,OAAO,OAAO,QAAQ;AAEpD,MAAM,wBAAwB;AAE9B,MAAM,yBAAyB;AAAA,EACpC,MAAM;AAAA,EACN,OAAO;AACT;AAEO,MAAM,+BAA+B;AAAA,EAC1C,cAAc;AAAA,EACd,QAAQ;AAAA,EACR,SAAS;AAAA,EACT,kBAAkB;AACpB;",
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAhB,MAAM,WAAW;AAAA,EACtB,QAAQ;AAAA,EACR,cAAc;AAAA,EACd,SAAS;AACX;AAEO,MAAM,wBAAwB,OAAO,OAAO,QAAQ;AAEpD,MAAM,wBAAwB;AAE9B,MAAM,yBAAyB;AAAA,EACpC,MAAM;AAAA,EACN,OAAO;AACT;AAEO,MAAM,+BAA+B;AAAA,EAC1C,cAAc;AAAA,EACd,QAAQ;AAAA,EACR,SAAS;AAAA,EACT,kBAAkB;AACpB;",
   "names": []
 }

package/dist/cjs/utils/helpers.js

@@ -17,7 +17,10 @@ var __copyProps = (to, from, except, desc) => {
   }
   return to;
 };
-var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target, mod));
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 var helpers_exports = {};
 __export(helpers_exports, {
@@ -69,8 +72,16 @@ const getVisibleDimensions = (node, referenceNode) => {
   const nodeDimensions = node.getBoundingClientRect();
   const referenceNodeDimensions = referenceNode.getBoundingClientRect();
   return {
-    width: Math.min(node.clientWidth, referenceNodeDimensions.left + referenceNode.clientWidth - nodeDimensions.left, node.clientWidth - (referenceNodeDimensions.left - nodeDimensions.left)),
-    height: Math.min(node.clientHeight, referenceNodeDimensions.top + referenceNode.clientHeight - nodeDimensions.top, node.clientHeight - (referenceNodeDimensions.top - nodeDimensions.top))
+    width: Math.min(
+      node.clientWidth,
+      referenceNodeDimensions.left + referenceNode.clientWidth - nodeDimensions.left,
+      node.clientWidth - (referenceNodeDimensions.left - nodeDimensions.left)
+    ),
+    height: Math.min(
+      node.clientHeight,
+      referenceNodeDimensions.top + referenceNode.clientHeight - nodeDimensions.top,
+      node.clientHeight - (referenceNodeDimensions.top - nodeDimensions.top)
+    )
   };
 };
 const shouldHaveLeftGradient = (scrollLeft) => Math.abs(scrollLeft) > import_constants.MOBILE_GRADIENT_WIDTH;

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

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../../src/utils/helpers.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
   "sourcesContent": ["import React from 'react';\nimport { MOBILE_GRADIENT_WIDTH } from './constants';\n\ninterface VisibleDimensionsT {\n  width: number;\n  height: number;\n}\n\ninterface CenterTabPropsT {\n  e?: React.MouseEvent | React.FocusEvent;\n  listRef: React.MutableRefObject<HTMLDivElement | null>;\n}\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", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADCvB,uBAAsC;AAY/B,MAAM,mBAAmB,CAAC,KAAkB,YAAkC;AACnF,QAAM,gBAAgB,IAAI,sBAAsB;AAChD,QAAM,oBAAoB,QAAQ,sBAAsB;AAExD,SAAO,cAAc,QAAQ,kBAAkB,OAC3C,kBAAkB,OAAO,cAAc,QAAQ,cAAc,QAC7D,cAAc,QAAQ,kBAAkB,SAAS,cAAc;AACrE;AAEO,MAAM,2BAA2B,CACtC,KACA,cACA,kBAAkB,SACN;AACZ,MAAI,OAAO,cAAc;AACvB,UAAM,gBAAgB,IAAI,sBAAsB;AAChD,UAAM,yBAAyB,aAAa,sBAAsB;AAElE,UAAM,SAAS,kBAAkB,KAAK;AACtC,UAAM,oBAAoB,KAAK,MAAM,cAAc,OAAO,MAAM;AAChE,UAAM,qBAAqB,KAAK,MAAM,cAAc,QAAQ,MAAM;AAElE,UAAM,6BAA6B,KAAK,MAAM,uBAAuB,IAAI;AACzE,UAAM,8BAA8B,KAAK,MAAM,uBAAuB,KAAK;AAE3E,WAAO,qBAAqB,8BAA8B,sBAAsB;AAAA,EAClF;AACA,SAAO;AACT;AAEO,MAAM,YAAY,CAAC,EAAE,GAAG,cAA+B;AAC5D,MAAI,QAAQ,SAAS;AACnB,UAAM,EAAE,eAAe,GAAG;AAC1B,UAAM,EAAE,OAAO,aAAc,IAAG,QAA6B,sBAAsB;AACnF,UAAM,EAAE,OAAO,cAAc,QAAQ,QAAQ,sBAAsB;AACnE,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,IACZ,CAAC;AAED,OAAG,eAAe;AAAA,EACpB;AACF;AAEO,MAAM,uBAAuB,CAAC,MAAmB,kBAAmD;AACzG,QAAM,iBAAiB,KAAK,sBAAsB;AAClD,QAAM,0BAA0B,cAAc,sBAAsB;AAEpE,SAAO;AAAA,IACL,OAAO,KAAK,IACV,KAAK,aACL,wBAAwB,OAAO,cAAc,cAAc,eAAe,MAC1E,KAAK,cAAe,yBAAwB,OAAO,eAAe,KACpE;AAAA,IACA,QAAQ,KAAK,IACX,KAAK,cACL,wBAAwB,MAAM,cAAc,eAAe,eAAe,KAC1E,KAAK,eAAgB,yBAAwB,MAAM,eAAe,IACpE;AAAA,EACF;AACF;AAEO,MAAM,yBAAyB,CAAC,eAAgC,KAAK,IAAI,UAAU,IAAI;AAEvF,MAAM,0BAA0B,CAAC,YAAoB,aAAqB,gBAC/E,KAAK,IAAI,UAAU,KAAK,cAAe,eAAc;",
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADCvB,uBAAsC;AAY/B,MAAM,mBAAmB,CAAC,KAAkB,YAAkC;AACnF,QAAM,gBAAgB,IAAI,sBAAsB;AAChD,QAAM,oBAAoB,QAAQ,sBAAsB;AAExD,SAAO,cAAc,QAAQ,kBAAkB,OAC3C,kBAAkB,OAAO,cAAc,QAAQ,cAAc,QAC7D,cAAc,QAAQ,kBAAkB,SAAS,cAAc;AACrE;AAEO,MAAM,2BAA2B,CACtC,KACA,cACA,kBAAkB,SACN;AACZ,MAAI,OAAO,cAAc;AACvB,UAAM,gBAAgB,IAAI,sBAAsB;AAChD,UAAM,yBAAyB,aAAa,sBAAsB;AAElE,UAAM,SAAS,kBAAkB,KAAK;AACtC,UAAM,oBAAoB,KAAK,MAAM,cAAc,OAAO,MAAM;AAChE,UAAM,qBAAqB,KAAK,MAAM,cAAc,QAAQ,MAAM;AAElE,UAAM,6BAA6B,KAAK,MAAM,uBAAuB,IAAI;AACzE,UAAM,8BAA8B,KAAK,MAAM,uBAAuB,KAAK;AAE3E,WAAO,qBAAqB,8BAA8B,sBAAsB;AAAA,EAClF;AACA,SAAO;AACT;AAEO,MAAM,YAAY,CAAC,EAAE,GAAG,QAAQ,MAAuB;AAC5D,MAAI,QAAQ,SAAS;AACnB,UAAM,EAAE,WAAW,IAAI,GAAG;AAC1B,UAAM,EAAE,OAAO,SAAS,KAAK,GAAG,QAA6B,sBAAsB;AACnF,UAAM,EAAE,OAAO,UAAU,IAAI,QAAQ,QAAQ,sBAAsB;AACnE,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,IACZ,CAAC;AAED,OAAG,eAAe;AAAA,EACpB;AACF;AAEO,MAAM,uBAAuB,CAAC,MAAmB,kBAAmD;AACzG,QAAM,iBAAiB,KAAK,sBAAsB;AAClD,QAAM,0BAA0B,cAAc,sBAAsB;AAEpE,SAAO;AAAA,IACL,OAAO,KAAK;AAAA,MACV,KAAK;AAAA,MACL,wBAAwB,OAAO,cAAc,cAAc,eAAe;AAAA,MAC1E,KAAK,eAAe,wBAAwB,OAAO,eAAe;AAAA,IACpE;AAAA,IACA,QAAQ,KAAK;AAAA,MACX,KAAK;AAAA,MACL,wBAAwB,MAAM,cAAc,eAAe,eAAe;AAAA,MAC1E,KAAK,gBAAgB,wBAAwB,MAAM,eAAe;AAAA,IACpE;AAAA,EACF;AACF;AAEO,MAAM,yBAAyB,CAAC,eAAgC,KAAK,IAAI,UAAU,IAAI;AAEvF,MAAM,0BAA0B,CAAC,YAAoB,aAAqB,gBAC/E,KAAK,IAAI,UAAU,KAAK,eAAe,cAAc;",
   "names": []
 }

package/dist/cjs/utils/hooks/useKeyboardNavigation.js

@@ -17,7 +17,10 @@ var __copyProps = (to, from, except, desc) => {
   }
   return to;
 };
-var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target, mod));
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 var useKeyboardNavigation_exports = {};
 __export(useKeyboardNavigation_exports, {
@@ -30,40 +33,43 @@ var import_DSTabsCTX = require("../../DSTabsCTX");
 const useKeyboardNavigation = () => {
   const { focusableTabsRef } = (0, import_react.useContext)(import_DSTabsCTX.DSTabsContext);
   const { firstSubtabInternalRef, lastTabInternalRef } = (0, import_react.useContext)(import_DSTabsCTX.DSTabsCrossRefContext);
-  const handleOnKeyDown = (0, import_react.useCallback)((e) => {
-    if (e.key === "ArrowRight" && focusableTabsRef.current) {
-      e.preventDefault();
-      e.stopPropagation();
-      const nextTab = focusableTabsRef.current[focusableTabsRef?.current?.indexOf?.(e.target) + 1];
-      if (nextTab)
-        nextTab.focus();
-      if (!nextTab)
-        return;
-    }
-    if (e.key === "ArrowLeft" && focusableTabsRef.current) {
-      e.preventDefault();
-      e.stopPropagation();
-      const prevTab = focusableTabsRef.current[focusableTabsRef?.current?.indexOf?.(e.target) - 1];
-      if (prevTab)
-        prevTab.focus();
-      if (!prevTab)
-        return;
-    }
-    if (e.key === "ArrowDown") {
-      e.preventDefault();
-      e.stopPropagation();
-      const canFocusCrossTabs = firstSubtabInternalRef?.current && lastTabInternalRef?.current;
-      if (canFocusCrossTabs)
-        firstSubtabInternalRef.current?.focus();
-    }
-    if (e.key === "ArrowUp") {
-      e.preventDefault();
-      e.stopPropagation();
-      const canFocusCrossTabs = firstSubtabInternalRef?.current && lastTabInternalRef?.current;
-      if (canFocusCrossTabs)
-        lastTabInternalRef.current?.focus();
-    }
-  }, [firstSubtabInternalRef, lastTabInternalRef, focusableTabsRef]);
+  const handleOnKeyDown = (0, import_react.useCallback)(
+    (e) => {
+      if (e.key === "ArrowRight" && focusableTabsRef.current) {
+        e.preventDefault();
+        e.stopPropagation();
+        const nextTab = focusableTabsRef.current[focusableTabsRef?.current?.indexOf?.(e.target) + 1];
+        if (nextTab)
+          nextTab.focus();
+        if (!nextTab)
+          return;
+      }
+      if (e.key === "ArrowLeft" && focusableTabsRef.current) {
+        e.preventDefault();
+        e.stopPropagation();
+        const prevTab = focusableTabsRef.current[focusableTabsRef?.current?.indexOf?.(e.target) - 1];
+        if (prevTab)
+          prevTab.focus();
+        if (!prevTab)
+          return;
+      }
+      if (e.key === "ArrowDown") {
+        e.preventDefault();
+        e.stopPropagation();
+        const canFocusCrossTabs = firstSubtabInternalRef?.current && lastTabInternalRef?.current;
+        if (canFocusCrossTabs)
+          firstSubtabInternalRef.current?.focus();
+      }
+      if (e.key === "ArrowUp") {
+        e.preventDefault();
+        e.stopPropagation();
+        const canFocusCrossTabs = firstSubtabInternalRef?.current && lastTabInternalRef?.current;
+        if (canFocusCrossTabs)
+          lastTabInternalRef.current?.focus();
+      }
+    },
+    [firstSubtabInternalRef, lastTabInternalRef, focusableTabsRef]
+  );
   return {
     handleOnKeyDown
   };

package/dist/cjs/utils/hooks/useKeyboardNavigation.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../../../src/utils/hooks/useKeyboardNavigation.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
   "sourcesContent": ["/* eslint-disable max-statements */\n/* eslint-disable complexity */\nimport React, { useCallback, useContext } from 'react';\nimport { DSTabsContext, DSTabsCrossRefContext } from '../../DSTabsCTX';\n\ninterface UseKeyboardNavigationReturnTypeT {\n  handleOnKeyDown: (e: React.KeyboardEvent) => void;\n}\n\nexport const useKeyboardNavigation = (): UseKeyboardNavigationReturnTypeT => {\n  const { focusableTabsRef } = useContext(DSTabsContext);\n  const { firstSubtabInternalRef, lastTabInternalRef } = useContext(DSTabsCrossRefContext);\n\n  const handleOnKeyDown = useCallback(\n    (e: React.KeyboardEvent) => {\n      if (e.key === 'ArrowRight' && focusableTabsRef.current) {\n        e.preventDefault();\n        e.stopPropagation();\n        const nextTab =\n          focusableTabsRef.current[focusableTabsRef?.current?.indexOf?.(e.target as HTMLButtonElement) + 1];\n        if (nextTab) nextTab.focus();\n        if (!nextTab) return;\n      }\n\n      if (e.key === 'ArrowLeft' && focusableTabsRef.current) {\n        e.preventDefault();\n        e.stopPropagation();\n        const prevTab =\n          focusableTabsRef.current[focusableTabsRef?.current?.indexOf?.(e.target as HTMLButtonElement) - 1];\n        if (prevTab) prevTab.focus();\n        if (!prevTab) return;\n      }\n\n      if (e.key === 'ArrowDown') {\n        e.preventDefault();\n        e.stopPropagation();\n        const canFocusCrossTabs = firstSubtabInternalRef?.current && lastTabInternalRef?.current;\n        if (canFocusCrossTabs) firstSubtabInternalRef.current?.focus();\n      }\n\n      if (e.key === 'ArrowUp') {\n        e.preventDefault();\n        e.stopPropagation();\n        const canFocusCrossTabs = firstSubtabInternalRef?.current && lastTabInternalRef?.current;\n        if (canFocusCrossTabs) lastTabInternalRef.current?.focus();\n      }\n    },\n    [firstSubtabInternalRef, lastTabInternalRef, focusableTabsRef],\n  );\n\n  return {\n    handleOnKeyDown,\n  };\n};\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADEvB,mBAA+C;AAC/C,uBAAqD;AAM9C,MAAM,wBAAwB,MAAwC;AAC3E,QAAM,EAAE,qBAAqB,6BAAW,8BAAa;AACrD,QAAM,EAAE,wBAAwB,uBAAuB,6BAAW,sCAAqB;AAEvF,QAAM,kBAAkB,8BACtB,CAAC,MAA2B;AAC1B,QAAI,EAAE,QAAQ,gBAAgB,iBAAiB,SAAS;AACtD,QAAE,eAAe;AACjB,QAAE,gBAAgB;AAClB,YAAM,UACJ,iBAAiB,QAAQ,kBAAkB,SAAS,UAAU,EAAE,MAA2B,IAAI;AACjG,UAAI;AAAS,gBAAQ,MAAM;AAC3B,UAAI,CAAC;AAAS;AAAA,IAChB;AAEA,QAAI,EAAE,QAAQ,eAAe,iBAAiB,SAAS;AACrD,QAAE,eAAe;AACjB,QAAE,gBAAgB;AAClB,YAAM,UACJ,iBAAiB,QAAQ,kBAAkB,SAAS,UAAU,EAAE,MAA2B,IAAI;AACjG,UAAI;AAAS,gBAAQ,MAAM;AAC3B,UAAI,CAAC;AAAS;AAAA,IAChB;AAEA,QAAI,EAAE,QAAQ,aAAa;AACzB,QAAE,eAAe;AACjB,QAAE,gBAAgB;AAClB,YAAM,oBAAoB,wBAAwB,WAAW,oBAAoB;AACjF,UAAI;AAAmB,+BAAuB,SAAS,MAAM;AAAA,IAC/D;AAEA,QAAI,EAAE,QAAQ,WAAW;AACvB,QAAE,eAAe;AACjB,QAAE,gBAAgB;AAClB,YAAM,oBAAoB,wBAAwB,WAAW,oBAAoB;AACjF,UAAI;AAAmB,2BAAmB,SAAS,MAAM;AAAA,IAC3D;AAAA,EACF,GACA,CAAC,wBAAwB,oBAAoB,gBAAgB,CAC/D;AAEA,SAAO;AAAA,IACL;AAAA,EACF;AACF;",
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADEvB,mBAA+C;AAC/C,uBAAqD;AAM9C,MAAM,wBAAwB,MAAwC;AAC3E,QAAM,EAAE,iBAAiB,QAAI,yBAAW,8BAAa;AACrD,QAAM,EAAE,wBAAwB,mBAAmB,QAAI,yBAAW,sCAAqB;AAEvF,QAAM,sBAAkB;AAAA,IACtB,CAAC,MAA2B;AAC1B,UAAI,EAAE,QAAQ,gBAAgB,iBAAiB,SAAS;AACtD,UAAE,eAAe;AACjB,UAAE,gBAAgB;AAClB,cAAM,UACJ,iBAAiB,QAAQ,kBAAkB,SAAS,UAAU,EAAE,MAA2B,IAAI;AACjG,YAAI;AAAS,kBAAQ,MAAM;AAC3B,YAAI,CAAC;AAAS;AAAA,MAChB;AAEA,UAAI,EAAE,QAAQ,eAAe,iBAAiB,SAAS;AACrD,UAAE,eAAe;AACjB,UAAE,gBAAgB;AAClB,cAAM,UACJ,iBAAiB,QAAQ,kBAAkB,SAAS,UAAU,EAAE,MAA2B,IAAI;AACjG,YAAI;AAAS,kBAAQ,MAAM;AAC3B,YAAI,CAAC;AAAS;AAAA,MAChB;AAEA,UAAI,EAAE,QAAQ,aAAa;AACzB,UAAE,eAAe;AACjB,UAAE,gBAAgB;AAClB,cAAM,oBAAoB,wBAAwB,WAAW,oBAAoB;AACjF,YAAI;AAAmB,iCAAuB,SAAS,MAAM;AAAA,MAC/D;AAEA,UAAI,EAAE,QAAQ,WAAW;AACvB,UAAE,eAAe;AACjB,UAAE,gBAAgB;AAClB,cAAM,oBAAoB,wBAAwB,WAAW,oBAAoB;AACjF,YAAI;AAAmB,6BAAmB,SAAS,MAAM;AAAA,MAC3D;AAAA,IACF;AAAA,IACA,CAAC,wBAAwB,oBAAoB,gBAAgB;AAAA,EAC/D;AAEA,SAAO;AAAA,IACL;AAAA,EACF;AACF;",
   "names": []
 }

package/dist/cjs/utils/hooks/useTabsCallbacks.js

@@ -17,7 +17,10 @@ var __copyProps = (to, from, except, desc) => {
   }
   return to;
 };
-var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target, mod));
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 var useTabsCallbacks_exports = {};
 __export(useTabsCallbacks_exports, {
@@ -34,18 +37,24 @@ const useTabsCallbacks = () => {
     tabsListRef,
     props: { onTabChange, isDSMobile, allowTextSelection, fixedTabsHeaders }
   } = (0, import_react.useContext)(import_DSTabsCTX.DSTabsContext);
-  const handleOnTabChange = (0, import_react.useCallback)((tabId, e) => {
-    setInternalActiveTab(tabId);
-    onTabChange(tabId, e);
-    if (isDSMobile && !fixedTabsHeaders && e) {
-      (0, import_helpers.centerTab)({ e, listRef: tabsListRef });
-    }
-  }, [fixedTabsHeaders, isDSMobile, onTabChange, setInternalActiveTab, tabsListRef]);
-  const handleOnMouseDown = (0, import_react.useCallback)((e) => {
-    const role = e.target.getAttribute("role");
-    if (role !== "tabpanel" && allowTextSelection)
-      e.stopPropagation();
-  }, [allowTextSelection]);
+  const handleOnTabChange = (0, import_react.useCallback)(
+    (tabId, e) => {
+      setInternalActiveTab(tabId);
+      onTabChange(tabId, e);
+      if (isDSMobile && !fixedTabsHeaders && e) {
+        (0, import_helpers.centerTab)({ e, listRef: tabsListRef });
+      }
+    },
+    [fixedTabsHeaders, isDSMobile, onTabChange, setInternalActiveTab, tabsListRef]
+  );
+  const handleOnMouseDown = (0, import_react.useCallback)(
+    (e) => {
+      const role = e.target.getAttribute("role");
+      if (role !== "tabpanel" && allowTextSelection)
+        e.stopPropagation();
+    },
+    [allowTextSelection]
+  );
   return {
     handleOnTabChange,
     handleOnMouseDown

package/dist/cjs/utils/hooks/useTabsCallbacks.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../../../src/utils/hooks/useTabsCallbacks.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
   "sourcesContent": ["import React, { useCallback, useContext } from 'react';\nimport { centerTab } from '../helpers';\nimport { DSTabsContext } from '../../DSTabsCTX';\n\ninterface UseTabsCallbacksReturnTypeT {\n  handleOnTabChange: (tabId: string, e?: React.MouseEvent) => void;\n  handleOnMouseDown: (e: React.MouseEvent) => void;\n}\n\nexport const useTabsCallbacks = (): UseTabsCallbacksReturnTypeT => {\n  const {\n    setInternalActiveTab,\n    tabsListRef,\n    props: { onTabChange, isDSMobile, allowTextSelection, fixedTabsHeaders },\n  } = useContext(DSTabsContext);\n\n  const handleOnTabChange = useCallback(\n    (tabId: string, e?: React.MouseEvent) => {\n      setInternalActiveTab(tabId);\n      onTabChange(tabId, e);\n      if (isDSMobile && !fixedTabsHeaders && e) {\n        centerTab({ e, listRef: tabsListRef });\n      }\n    },\n    [fixedTabsHeaders, isDSMobile, onTabChange, setInternalActiveTab, tabsListRef],\n  );\n\n  const handleOnMouseDown = useCallback(\n    (e: React.MouseEvent) => {\n      const role = (e.target as HTMLElement).getAttribute('role');\n      if (role !== 'tabpanel' && allowTextSelection) e.stopPropagation();\n    },\n    [allowTextSelection],\n  );\n\n  return {\n    handleOnTabChange,\n    handleOnMouseDown,\n  };\n};\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAA+C;AAC/C,qBAA0B;AAC1B,uBAA8B;AAOvB,MAAM,mBAAmB,MAAmC;AACjE,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA,OAAO,EAAE,aAAa,YAAY,oBAAoB;AAAA,MACpD,6BAAW,8BAAa;AAE5B,QAAM,oBAAoB,8BACxB,CAAC,OAAe,MAAyB;AACvC,yBAAqB,KAAK;AAC1B,gBAAY,OAAO,CAAC;AACpB,QAAI,cAAc,CAAC,oBAAoB,GAAG;AACxC,oCAAU,EAAE,GAAG,SAAS,YAAY,CAAC;AAAA,IACvC;AAAA,EACF,GACA,CAAC,kBAAkB,YAAY,aAAa,sBAAsB,WAAW,CAC/E;AAEA,QAAM,oBAAoB,8BACxB,CAAC,MAAwB;AACvB,UAAM,OAAQ,EAAE,OAAuB,aAAa,MAAM;AAC1D,QAAI,SAAS,cAAc;AAAoB,QAAE,gBAAgB;AAAA,EACnE,GACA,CAAC,kBAAkB,CACrB;AAEA,SAAO;AAAA,IACL;AAAA,IACA;AAAA,EACF;AACF;",
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAA+C;AAC/C,qBAA0B;AAC1B,uBAA8B;AAOvB,MAAM,mBAAmB,MAAmC;AACjE,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA,OAAO,EAAE,aAAa,YAAY,oBAAoB,iBAAiB;AAAA,EACzE,QAAI,yBAAW,8BAAa;AAE5B,QAAM,wBAAoB;AAAA,IACxB,CAAC,OAAe,MAAyB;AACvC,2BAAqB,KAAK;AAC1B,kBAAY,OAAO,CAAC;AACpB,UAAI,cAAc,CAAC,oBAAoB,GAAG;AACxC,sCAAU,EAAE,GAAG,SAAS,YAAY,CAAC;AAAA,MACvC;AAAA,IACF;AAAA,IACA,CAAC,kBAAkB,YAAY,aAAa,sBAAsB,WAAW;AAAA,EAC/E;AAEA,QAAM,wBAAoB;AAAA,IACxB,CAAC,MAAwB;AACvB,YAAM,OAAQ,EAAE,OAAuB,aAAa,MAAM;AAC1D,UAAI,SAAS,cAAc;AAAoB,UAAE,gBAAgB;AAAA,IACnE;AAAA,IACA,CAAC,kBAAkB;AAAA,EACrB;AAEA,SAAO;AAAA,IACL;AAAA,IACA;AAAA,EACF;AACF;",
   "names": []
 }

package/dist/esm/DSTabs.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/DSTabs.tsx"],
   "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport type { WeakValidationMap } from 'react';\nimport { describe } from '@elliemae/ds-utilities';\nimport { tabsPropTypes } from './propTypes';\nimport { DSTabsContext, DSTabsCrossRefContext } from './DSTabsCTX';\nimport { TabsContent } from './parts/tabsContent/TabsContent';\nimport { useTabs } from './config/useTabs';\nimport { useCrossRef } from './config/useCrossRef';\nimport { TabTypes } from './utils/constants';\nimport type { DSTabsT } from './propTypes';\n\nconst DSTabs = (props: DSTabsT.Props): JSX.Element => {\n  const ctx = useTabs(props);\n  const crossRefsCtx = useCrossRef();\n\n  const { type } = props;\n\n  if (type === TabTypes.SUBTABS) {\n    return (\n      <DSTabsContext.Provider value={ctx}>\n        <TabsContent />\n      </DSTabsContext.Provider>\n    );\n  }\n\n  return (\n    <DSTabsCrossRefContext.Provider value={crossRefsCtx}>\n      <DSTabsContext.Provider value={ctx}>\n        <TabsContent />\n      </DSTabsContext.Provider>\n    </DSTabsCrossRefContext.Provider>\n  );\n};\n\nDSTabs.propTypes = tabsPropTypes as WeakValidationMap<unknown>;\nconst DSTabsWithSchema = describe<DSTabsT.Props>(DSTabs);\nDSTabsWithSchema.propTypes = tabsPropTypes;\n\nexport { DSTabs, DSTabsWithSchema };\nexport default DSTabs;\n"],
-  "mappings": "AAAA;ACAA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAGA,MAAM,SAAS,CAAC,UAAsC;AACpD,QAAM,MAAM,QAAQ,KAAK;AACzB,QAAM,eAAe,YAAY;AAEjC,QAAM,EAAE,SAAS;AAEjB,MAAI,SAAS,SAAS,SAAS;AAC7B,WACE,qCAAC,cAAc,UAAd;AAAA,MAAuB,OAAO;AAAA,OAC7B,qCAAC,iBAAY,CACf;AAAA,EAEJ;AAEA,SACE,qCAAC,sBAAsB,UAAtB;AAAA,IAA+B,OAAO;AAAA,KACrC,qCAAC,cAAc,UAAd;AAAA,IAAuB,OAAO;AAAA,KAC7B,qCAAC,iBAAY,CACf,CACF;AAEJ;AAEA,OAAO,YAAY;AACnB,MAAM,mBAAmB,SAAwB,MAAM;AACvD,iBAAiB,YAAY;AAG7B,IAAO,iBAAQ;",
-  "names": []
+  "mappings": "AAAA,YAAY,WAAW;ACAvB,OAAOA,YAAW;AAElB,SAAS,gBAAgB;AACzB,SAAS,qBAAqB;AAC9B,SAAS,eAAe,6BAA6B;AACrD,SAAS,mBAAmB;AAC5B,SAAS,eAAe;AACxB,SAAS,mBAAmB;AAC5B,SAAS,gBAAgB;AAGzB,MAAM,SAAS,CAAC,UAAsC;AACpD,QAAM,MAAM,QAAQ,KAAK;AACzB,QAAM,eAAe,YAAY;AAEjC,QAAM,EAAE,KAAK,IAAI;AAEjB,MAAI,SAAS,SAAS,SAAS;AAC7B,WACE,gBAAAA,OAAA,cAAC,cAAc,UAAd;AAAA,MAAuB,OAAO;AAAA,OAC7B,gBAAAA,OAAA,cAAC,iBAAY,CACf;AAAA,EAEJ;AAEA,SACE,gBAAAA,OAAA,cAAC,sBAAsB,UAAtB;AAAA,IAA+B,OAAO;AAAA,KACrC,gBAAAA,OAAA,cAAC,cAAc,UAAd;AAAA,IAAuB,OAAO;AAAA,KAC7B,gBAAAA,OAAA,cAAC,iBAAY,CACf,CACF;AAEJ;AAEA,OAAO,YAAY;AACnB,MAAM,mBAAmB,SAAwB,MAAM;AACvD,iBAAiB,YAAY;AAG7B,IAAO,iBAAQ;",
+  "names": ["React"]
 }

package/dist/esm/DSTabsCTX.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/DSTabsCTX.tsx"],
   "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { createContext, createRef } from 'react';\nimport { tabsDefaultProps as defaultProps } from './propTypes';\nimport type { DSTabsInternalsT } from './sharedTypes';\n\n// eslint-disable-next-line @typescript-eslint/no-empty-function\nconst noop = () => {};\n\nconst defaultContext = {\n  props: defaultProps,\n  tabsRef: createRef<Record<number, HTMLButtonElement> | null>(),\n  tabsListRef: createRef<HTMLDivElement | null>(),\n  carouselOnlyListRef: createRef<HTMLDivElement | null>(),\n  focusableTabsRef: createRef<HTMLButtonElement[] | null>(),\n  tabsRefAsArray: createRef<HTMLButtonElement[] | null>(),\n  actualActiveTabRef: createRef<HTMLButtonElement | null>(),\n  setInternalActiveTab: noop,\n  actualActiveTab: '',\n};\n\nconst defaultCrossRefsContext = {\n  lastTabInternalRef: createRef<HTMLButtonElement | null>(),\n  firstSubtabInternalRef: createRef<HTMLButtonElement | null>(),\n};\n\nexport const DSTabsContext = createContext<DSTabsInternalsT.DSTabsUseTabsContextT>(defaultContext);\nexport const DSTabsCrossRefContext = createContext<DSTabsInternalsT.DSTabsUseCrossRefContextT>(defaultCrossRefsContext);\n"],
-  "mappings": "AAAA;ACAA;AACA;AAIA,MAAM,OAAO,MAAM;AAAC;AAEpB,MAAM,iBAAiB;AAAA,EACrB,OAAO;AAAA,EACP,SAAS,UAAoD;AAAA,EAC7D,aAAa,UAAiC;AAAA,EAC9C,qBAAqB,UAAiC;AAAA,EACtD,kBAAkB,UAAsC;AAAA,EACxD,gBAAgB,UAAsC;AAAA,EACtD,oBAAoB,UAAoC;AAAA,EACxD,sBAAsB;AAAA,EACtB,iBAAiB;AACnB;AAEA,MAAM,0BAA0B;AAAA,EAC9B,oBAAoB,UAAoC;AAAA,EACxD,wBAAwB,UAAoC;AAC9D;AAEO,MAAM,gBAAgB,cAAsD,cAAc;AAC1F,MAAM,wBAAwB,cAA0D,uBAAuB;",
+  "mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,eAAe,iBAAiB;AACzC,SAAS,oBAAoB,oBAAoB;AAIjD,MAAM,OAAO,MAAM;AAAC;AAEpB,MAAM,iBAAiB;AAAA,EACrB,OAAO;AAAA,EACP,SAAS,UAAoD;AAAA,EAC7D,aAAa,UAAiC;AAAA,EAC9C,qBAAqB,UAAiC;AAAA,EACtD,kBAAkB,UAAsC;AAAA,EACxD,gBAAgB,UAAsC;AAAA,EACtD,oBAAoB,UAAoC;AAAA,EACxD,sBAAsB;AAAA,EACtB,iBAAiB;AACnB;AAEA,MAAM,0BAA0B;AAAA,EAC9B,oBAAoB,UAAoC;AAAA,EACxD,wBAAwB,UAAoC;AAC9D;AAEO,MAAM,gBAAgB,cAAsD,cAAc;AAC1F,MAAM,wBAAwB,cAA0D,uBAAuB;",
   "names": []
 }

package/dist/esm/DSTabsDatatestid.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/DSTabsDatatestid.tsx"],
   "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export const DSTabsDatatestid = {\n  TABS_CONTAINER: 'ds-tabs-container',\n  TAB_BUTTON: 'ds-tabs-tab-button',\n  SUBTAB_BUTTON: 'ds-tabs-subtab-button',\n  TAB_PANEL: 'ds-tabs-tab-panel',\n  SUB_TAB_LIST: 'subtabs-list',\n  TAB_LIST: 'tab-list',\n  CAROUSEL: {\n    BUTTON_RIGHT: 'chevron-right',\n    BUTTON_LEFT: 'chevron-left',\n  },\n};\n"],
-  "mappings": "AAAA;ACAO,MAAM,mBAAmB;AAAA,EAC9B,gBAAgB;AAAA,EAChB,YAAY;AAAA,EACZ,eAAe;AAAA,EACf,WAAW;AAAA,EACX,cAAc;AAAA,EACd,UAAU;AAAA,EACV,UAAU;AAAA,IACR,cAAc;AAAA,IACd,aAAa;AAAA,EACf;AACF;",
+  "mappings": "AAAA,YAAY,WAAW;ACAhB,MAAM,mBAAmB;AAAA,EAC9B,gBAAgB;AAAA,EAChB,YAAY;AAAA,EACZ,eAAe;AAAA,EACf,WAAW;AAAA,EACX,cAAc;AAAA,EACd,UAAU;AAAA,EACV,UAAU;AAAA,IACR,cAAc;AAAA,IACd,aAAa;AAAA,EACf;AACF;",
   "names": []
 }

package/dist/esm/config/useCrossRef.js

@@ -3,10 +3,13 @@ import { useRef, useMemo } from "react";
 const useCrossRef = () => {
   const firstSubtabInternalRef = useRef();
   const lastTabInternalRef = useRef();
-  const ctx = useMemo(() => ({
-    firstSubtabInternalRef,
-    lastTabInternalRef
-  }), []);
+  const ctx = useMemo(
+    () => ({
+      firstSubtabInternalRef,
+      lastTabInternalRef
+    }),
+    []
+  );
   return ctx;
 };
 export {