@elliemae/ds-tabs 3.55.0-next.6 → 3.55.0-next.8

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

@@ -33,27 +33,34 @@ __export(TabsPanels_exports, {
 module.exports = __toCommonJS(TabsPanels_exports);
 var React = __toESM(require("react"));
 var import_jsx_runtime = require("react/jsx-runtime");
-var import_react = require("react");
-var import_react2 = __toESM(require("react"));
-var import_react_swipeable_views = __toESM(require("react-swipeable-views"));
+var import_react = __toESM(require("react"));
+var import_ds_swipe_card = require("@elliemae/ds-swipe-card");
 var import_styles = require("./styles.js");
 var import_DSTabsCTX = require("../../DSTabsCTX.js");
+const CardRender = (props) => {
+  const { content, tabPanelsProps, isDSMobile, hide, style, role, tabId, ...rest } = props;
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    import_styles.StyledPanelContainer,
+    {
+      id: tabId,
+      ...tabPanelsProps,
+      ...rest,
+      isDSMobile,
+      hide,
+      style,
+      role,
+      children: content
+    }
+  );
+};
 const TabsPanels = () => {
   const {
     actualActiveTab,
     focusableTabsRef,
-    props: {
-      animated,
-      enableMouseEvents,
-      onlyRenderActiveTab,
-      children: tabs,
-      isDSMobile,
-      tabPanelsProps,
-      swipeableViewsContainerProps
-    },
+    props: { onlyRenderActiveTab, children: tabs, isDSMobile, tabPanelsProps, animated },
     globalClickHandler
-  } = (0, import_react2.useContext)(import_DSTabsCTX.DSTabsContext);
-  const handleOnChangeIndex = (0, import_react2.useCallback)(
+  } = (0, import_react.useContext)(import_DSTabsCTX.DSTabsContext);
+  const handleOnChangeIndex = (0, import_react.useCallback)(
     (index, indexLatest) => {
       if (!focusableTabsRef.current) return;
       const offset = index - indexLatest;
@@ -72,65 +79,47 @@ const TabsPanels = () => {
     },
     [actualActiveTab, focusableTabsRef, globalClickHandler]
   );
-  const panels = (0, import_react2.useMemo)(() => {
-    const emptyPanelRender = animated ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {}) : null;
-    return import_react2.default.Children.map(tabs, (tab) => {
+  const panels = (0, import_react.useMemo)(() => {
+    const mapResult = import_react.default.Children.map(tabs, (tab, index) => {
       const { tabId: panelId = "", style, children: content, disabled, applyAriaDisabled } = tab.props;
       const isActive = actualActiveTab === panelId;
       const shouldRender = !onlyRenderActiveTab || isActive;
-      const getOwnerProps = () => tab.props;
-      const getOwnerPropsArguments = () => ({ panelId });
-      if (disabled) return emptyPanelRender;
-      if (!shouldRender) return emptyPanelRender;
-      return /* @__PURE__ */ (0, import_react.createElement)(
-        import_styles.StyledPanelContainer,
-        {
-          ...tabPanelsProps,
-          getOwnerProps,
-          getOwnerPropsArguments,
-          key: panelId,
-          id: panelId,
-          "aria-labelledby": `${panelId}-label`,
-          "aria-hidden": !isActive || !!applyAriaDisabled,
-          "data-panel-id": panelId,
-          "data-testid": "ds-tabs-tab-panel",
-          hide: !isActive,
-          onClick: (event) => globalClickHandler({ event, target: "panel" }),
-          role: "tabpanel",
-          style: {
-            ...tabPanelsProps?.style || {},
-            ...style || {}
-          },
-          isDSMobile
-        },
-        content
-      );
-    });
-  }, [animated, tabs, actualActiveTab, onlyRenderActiveTab, tabPanelsProps, globalClickHandler, isDSMobile]);
-  const indexExclusiveToSwipeableIndexThatReliesOnReactChildrenToArrayWhichAutoFiltersNull = (0, import_react2.useMemo)(() => {
-    const childrenArray = import_react2.default.Children.toArray(tabs);
-    const index = childrenArray.findIndex((tab) => tab.props.tabId === actualActiveTab);
-    if (index === -1) return 0;
-    return index;
-  }, [actualActiveTab, tabs]);
-  if (animated) {
-    const Comp = import_react_swipeable_views.default?.default ?? import_react_swipeable_views.default;
-    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-      Comp,
-      {
-        ...swipeableViewsContainerProps,
+      const baseDescriptor = {
+        index,
+        tabId: panelId,
+        isActive: Boolean(isActive),
+        isDSMobile: Boolean(isDSMobile),
+        content: shouldRender && !disabled ? content : null,
         style: {
-          overflow: "hidden",
-          // https://jira.elliemae.io/browse/PUI-9906
-          ...swipeableViewsContainerProps?.style || {}
+          ...tabPanelsProps?.style || {},
+          ...style || {}
         },
-        enableMouseEvents,
-        index: indexExclusiveToSwipeableIndexThatReliesOnReactChildrenToArrayWhichAutoFiltersNull,
-        onChangeIndex: handleOnChangeIndex,
-        children: panels
-      }
-    );
-  }
-  return panels;
+        tabPanelsProps,
+        "aria-hidden": !(isActive && !applyAriaDisabled),
+        "data-panel-id": panelId,
+        "data-testid": "ds-tabs-tab-panel",
+        hide: !isActive,
+        onClick: (event) => globalClickHandler({ event, target: "panel" }),
+        role: "tabpanel"
+      };
+      return baseDescriptor;
+    });
+    return mapResult || [];
+  }, [tabs, actualActiveTab, onlyRenderActiveTab, tabPanelsProps, globalClickHandler, isDSMobile]);
+  const activeSlide = (() => {
+    const idx = panels.findIndex((panel) => panel.isActive);
+    return idx >= 0 ? idx : 0;
+  })();
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    import_ds_swipe_card.DSSwipeCard,
+    {
+      activeSlide,
+      onSwipe: (i) => handleOnChangeIndex(i, activeSlide),
+      enableTouch: true,
+      enableAnimation: animated,
+      CardRender,
+      slidesProps: panels
+    }
+  );
 };
 //# sourceMappingURL=TabsPanels.js.map

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/parts/tabsPanel/TabsPanels.tsx", "../../../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["/* eslint-disable arrow-body-style */\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.js';\nimport { DSTabsContext } from '../../DSTabsCTX.js';\nimport type { DSTabT } from '../../react-desc-prop-types.js';\n\nexport const TabsPanels = (): JSX.Element | JSX.Element[] => {\n  const {\n    actualActiveTab,\n    focusableTabsRef,\n    props: {\n      animated,\n      enableMouseEvents,\n      onlyRenderActiveTab,\n      children: tabs,\n      isDSMobile,\n      tabPanelsProps,\n      swipeableViewsContainerProps,\n    },\n    globalClickHandler,\n  } = useContext(DSTabsContext);\n\n  /** [PUI-15772] - Tabs Pre Refactor\n   * Handler for swipe gestures and tab index changes. It:\n   * 1. Calculates the offset between current and new tab index\n   * 2. Finds the new focusable tab based on the offset\n   * 3. Updates the active tab and forces a click event\n   * 4. May cause unnecessary rerenders due to forced click events\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        globalClickHandler({\n          event: { type: 'click' } as React.MouseEvent<HTMLDivElement>,\n          target: 'swipeableViews',\n          tabId: focusableTabsRef.current[newFocusableIndex].dataset.tabId,\n        });\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, globalClickHandler],\n  );\n\n  const panels = useMemo(() => {\n    // this component is based on React.children, swipeable views want an index in the array, not a tabId\n    // two bad patterns relying on each others results in:\n    //   - because of react.children,\n    //       to guarantee predictability in finding the index based on tabId we should never return \"null\" which is not part of React.Children.toArray\n    //\n    //  when not using swipeable views, we don't need to find the index based on tabId\n    //    so even if we return null the variable\n    //    indexExclusiveToSwipeableIndexThatReliesOnReactChildrenToArrayWhichAutoFiltersNull\n    //      (which will be calculating the wrong index)\n    //    will have no impact on the rendering\n    // https://react.dev/reference/react/Children#children-toarray-caveats\n    // Caveats\n    // Empty nodes (null, undefined, and Booleans) will be omitted in the returned array.\n    //\n    // So, long story short,\n    //  1 - do not remove next line, keep the <div /> instead of null when \"animated\"\n    //  2 - NEVER EVER BUILD API BASED ON REACT.CHILDREN (if you are writing code post 2022 and you are not working on a legacy codebase)\n    const emptyPanelRender = animated ? <div /> : null;\n    return React.Children.map(tabs, (tab: React.ReactElement<DSTabT.Props>) => {\n      const { tabId: panelId = '', style, children: content, disabled, applyAriaDisabled } = tab.props;\n      const isActive = actualActiveTab === panelId;\n      const shouldRender = !onlyRenderActiveTab || isActive;\n      const getOwnerProps = () => tab.props;\n      const getOwnerPropsArguments = () => ({ panelId });\n\n      if (disabled) return emptyPanelRender;\n      if (!shouldRender) return emptyPanelRender;\n      return (\n        <StyledPanelContainer\n          {...tabPanelsProps}\n          getOwnerProps={getOwnerProps}\n          getOwnerPropsArguments={getOwnerPropsArguments}\n          key={panelId}\n          id={panelId}\n          aria-labelledby={`${panelId}-label`}\n          aria-hidden={!isActive || !!applyAriaDisabled}\n          data-panel-id={panelId}\n          data-testid=\"ds-tabs-tab-panel\"\n          hide={!isActive}\n          onClick={(event) => globalClickHandler({ event, target: 'panel' })}\n          role=\"tabpanel\"\n          style={{\n            ...(tabPanelsProps?.style || {}),\n            ...(style || {}),\n          }}\n          isDSMobile={isDSMobile}\n        >\n          {content}\n        </StyledPanelContainer>\n      );\n    });\n  }, [animated, tabs, actualActiveTab, onlyRenderActiveTab, tabPanelsProps, globalClickHandler, isDSMobile]);\n\n  const indexExclusiveToSwipeableIndexThatReliesOnReactChildrenToArrayWhichAutoFiltersNull = useMemo(() => {\n    const childrenArray = React.Children.toArray(tabs) as React.ReactElement<DSTabT.Props>[];\n    const index = childrenArray.findIndex((tab) => tab.props.tabId === actualActiveTab);\n\n    if (index === -1) return 0;\n    return index;\n  }, [actualActiveTab, tabs]);\n\n  if (animated) {\n    // Ignore ts errors on the next line because the 'react-swipeable-views' package does not export a type for the SwipeableViews component\n    // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access, @typescript-eslint/no-explicit-any, @typescript-eslint/no-unsafe-assignment\n    const Comp = (SwipeableViews as any)?.default ?? SwipeableViews;\n    return (\n      <Comp\n        {...swipeableViewsContainerProps}\n        style={{\n          overflow: 'hidden', // https://jira.elliemae.io/browse/PUI-9906\n          ...(swipeableViewsContainerProps?.style || {}),\n        }}\n        enableMouseEvents={enableMouseEvents}\n        index={indexExclusiveToSwipeableIndexThatReliesOnReactChildrenToArrayWhichAutoFiltersNull}\n        onChangeIndex={handleOnChangeIndex}\n      >\n        {panels}\n      </Comp>\n    );\n  }\n\n  return panels;\n};\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": "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",
-  "names": ["import_react", "React", "SwipeableViews"]
+  "sourcesContent": ["/* eslint-disable arrow-body-style */\n/* eslint-disable jsx-a11y/no-noninteractive-element-interactions */\nimport React, { useMemo, useContext, useCallback } from 'react';\nimport { DSSwipeCard } from '@elliemae/ds-swipe-card';\nimport type { DSSwipeCardT } from '@elliemae/ds-swipe-card/src/react-desc-prop-types.js';\nimport type { GlobalAttributesT } from '@elliemae/ds-props-helpers';\nimport { StyledPanelContainer } from './styles.js';\nimport { DSTabsContext } from '../../DSTabsCTX.js';\nimport type { DSTabT } from '../../react-desc-prop-types.js';\n/**\n * Describes the data needed to render a single Tab panel slide.\n */\ninterface PanelDescriptor extends Record<string, unknown> {\n  index: number;\n  tabId: string;\n  isActive: boolean;\n  isDSMobile: boolean;\n  content: React.ReactNode;\n  style: React.CSSProperties;\n  tabPanelsProps?: GlobalAttributesT<HTMLDivElement>;\n  'aria-hidden': boolean;\n  'data-panel-id': string;\n  'data-testid': string;\n  hide: boolean;\n  onClick: (event: React.MouseEvent<HTMLDivElement>) => void;\n  role: 'tabpanel';\n}\n\n/**\n * Responsible for rendering a single slide using the provided panel descriptor.\n * Receives a `dsIndex` prop from DSSwipeCard which indicates the slide position.\n */\nconst CardRender: React.ComponentType<DSSwipeCardT.CardRenderProps<PanelDescriptor>> = (props) => {\n  const { content, tabPanelsProps, isDSMobile, hide, style, role, tabId, ...rest } = props;\n  // We pass through all attributes, including accessibility and dataset attributes.\n  return (\n    <StyledPanelContainer\n      id={tabId}\n      {...tabPanelsProps}\n      {...rest}\n      // Styled component specific props\n      isDSMobile={isDSMobile}\n      hide={hide}\n      style={style}\n      role={role}\n    >\n      {content}\n    </StyledPanelContainer>\n  );\n};\n\nexport const TabsPanels = (): JSX.Element => {\n  const {\n    actualActiveTab,\n    focusableTabsRef,\n    props: { onlyRenderActiveTab, children: tabs, isDSMobile, tabPanelsProps, animated },\n    globalClickHandler,\n  } = useContext(DSTabsContext);\n\n  /** [PUI-15772] - Tabs Pre Refactor\n   * Handler for swipe gestures and tab index changes. It:\n   * 1. Calculates the offset between current and new tab index\n   * 2. Finds the new focusable tab based on the offset\n   * 3. Updates the active tab and forces a click event\n   * 4. May cause unnecessary rerenders due to forced click events\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        globalClickHandler({\n          event: { type: 'click' } as React.MouseEvent<HTMLDivElement>,\n          target: 'swipeableViews',\n          tabId: focusableTabsRef.current[newFocusableIndex].dataset.tabId,\n        });\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, globalClickHandler],\n  );\n\n  const panels: PanelDescriptor[] = useMemo(() => {\n    // this component is based on React.children, swipeable views want an index in the array, not a tabId\n    // two bad patterns relying on each others results in:\n    //   - because of react.children,\n    //       to guarantee predictability in finding the index based on tabId we should never return \"null\" which is not part of React.Children.toArray\n    //\n    //  when not using swipeable views, we don't need to find the index based on tabId\n    //    so even if we return null the variable\n    //    indexExclusiveToSwipeableIndexThatReliesOnReactChildrenToArrayWhichAutoFiltersNull\n    //      (which will be calculating the wrong index)\n    //    will have no impact on the rendering\n    // https://react.dev/reference/react/Children#children-toarray-caveats\n    // Caveats\n    // Empty nodes (null, undefined, and Booleans) will be omitted in the returned array.\n    //\n    // So, long story short,\n    //  1 - do not remove next line, keep the <div /> instead of null when \"animated\"\n    //  2 - NEVER EVER BUILD API BASED ON REACT.CHILDREN (if you are writing code post 2022 and you are not working on a legacy codebase)\n    // To preserve indices for swipe behavior, we return a fully-typed placeholder panel\n    // instead of null when a panel should not be rendered. This keeps array length stable.\n    const mapResult = React.Children.map(tabs, (tab: React.ReactElement<DSTabT.Props>, index: number) => {\n      const { tabId: panelId = '', style, children: content, disabled, applyAriaDisabled } = tab.props;\n      const isActive = actualActiveTab === panelId;\n      const shouldRender = !onlyRenderActiveTab || isActive;\n      // const getOwnerProps = () => tab.props;\n      // const getOwnerPropsArguments = () => ({ panelId });\n\n      const baseDescriptor: PanelDescriptor = {\n        index,\n        tabId: panelId,\n        isActive: Boolean(isActive),\n        isDSMobile: Boolean(isDSMobile),\n        content: shouldRender && !disabled ? content : null,\n        style: {\n          ...(tabPanelsProps?.style || {}),\n          ...(style || {}),\n        } as React.CSSProperties,\n        tabPanelsProps,\n        'aria-hidden': !(isActive && !applyAriaDisabled),\n        'data-panel-id': panelId,\n        'data-testid': 'ds-tabs-tab-panel',\n        hide: !isActive,\n        onClick: (event: React.MouseEvent<HTMLDivElement>) => globalClickHandler({ event, target: 'panel' }),\n        role: 'tabpanel',\n      };\n\n      return baseDescriptor;\n\n      // (\n      //   <StyledPanelContainer\n      //     {...tabPanelsProps}\n\n      //     isDSMobile={isDSMobile}\n      //   >\n      //     {}\n      //   </StyledPanelContainer>\n      // );\n    });\n\n    // Children.map can return null if there are no children; ensure an array is returned\n    return mapResult || [];\n  }, [tabs, actualActiveTab, onlyRenderActiveTab, tabPanelsProps, globalClickHandler, isDSMobile]);\n\n  // Safely compute the active slide index. Default to 0 when none found.\n  const activeSlide = (() => {\n    const idx = panels.findIndex((panel) => panel.isActive);\n    return idx >= 0 ? idx : 0;\n  })();\n\n  return (\n    <DSSwipeCard<PanelDescriptor>\n      activeSlide={activeSlide}\n      onSwipe={(i) => handleOnChangeIndex(i, activeSlide)}\n      enableTouch\n      enableAnimation={animated}\n      CardRender={CardRender}\n      slidesProps={panels}\n    />\n  );\n};\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": "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",
+  "names": ["React"]
 }

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

@@ -42,9 +42,5 @@ const StyledPanelContainer = (0, import_ds_system.styled)("div", {
   &:focus {
     outline: none;
   }
-
-  ${({ hide }) => hide ? "visibility: hidden; position: absolute;" : ""}
-
-  ${({ isDSMobile }) => isDSMobile ? `padding-top: 0;` : ``}
 `;
 //# sourceMappingURL=styles.js.map

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/parts/tabsPanel/styles.tsx", "../../../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["import { styled } from '@elliemae/ds-system';\nimport { TABS_SLOTS, DSTabsName } from '../../constants/index.js';\n\ninterface StyledPanelContainerPropsT {\n  hide: boolean;\n  isDSMobile: boolean;\n}\n\nexport const StyledPanelContainer = styled('div', {\n  name: DSTabsName,\n  slot: TABS_SLOTS.TAB_PANEL,\n})<StyledPanelContainerPropsT>`\n  padding-top: 8px;\n  &:focus {\n    outline: none;\n  }\n\n  ${({ hide }) => (hide ? 'visibility: hidden; position: absolute;' : '')}\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;AACvB,uBAAuC;AAOhC,MAAM,2BAAuB,yBAAO,OAAO;AAAA,EAChD,MAAM;AAAA,EACN,MAAM,4BAAW;AACnB,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAMG,CAAC,EAAE,KAAK,MAAO,OAAO,4CAA4C,EAAG;AAAA;AAAA,IAErE,CAAC,EAAE,WAAW,MAAO,aAAa,oBAAoB,EAAG;AAAA;",
+  "sourcesContent": ["import { styled } from '@elliemae/ds-system';\nimport { TABS_SLOTS, DSTabsName } from '../../constants/index.js';\n\ninterface StyledPanelContainerPropsT {\n  hide: boolean;\n  isDSMobile: boolean;\n}\n\nexport const StyledPanelContainer = styled('div', {\n  name: DSTabsName,\n  slot: TABS_SLOTS.TAB_PANEL,\n})<StyledPanelContainerPropsT>`\n  padding-top: 8px;\n  &:focus {\n    outline: none;\n  }\n`;\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,uBAAuB;AACvB,uBAAuC;AAOhC,MAAM,2BAAuB,yBAAO,OAAO;AAAA,EAChD,MAAM;AAAA,EACN,MAAM,4BAAW;AACnB,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;",
   "names": []
 }

package/dist/cjs/react-desc-prop-types.js

@@ -59,7 +59,7 @@ const DSTabsPropTypes = {
   ...import_ds_props_helpers.globalAttributesPropTypes,
   ...import_ds_props_helpers.xstyledPropTypes,
   animated: import_ds_props_helpers.PropTypes.bool.description("Whether the Tab transition should animate or not.").defaultValue(true),
-  enableMouseEvents: import_ds_props_helpers.PropTypes.bool.description("Enables Tab transition with mouse drag events.").defaultValue(false),
+  enableMouseEvents: import_ds_props_helpers.PropTypes.bool.description("Enables Tab transition with mouse drag events.").defaultValue(false).deprecated({ version: "3.55.x", message: "This prop is no longer supported." }),
   allowTextSelection: import_ds_props_helpers.PropTypes.bool.description("Allows text selection when mouse drag events are active.").defaultValue(false),
   onTabChange: import_ds_props_helpers.PropTypes.func.description("Handler when a user clicks on a different Tab.").defaultValue("() => {}"),
   type: import_ds_props_helpers.PropTypes.oneOf(import_constants.TAB_TYPES_VALUES_AS_ARRAY).description("Tab type.").defaultValue(import_constants.TAB_TYPES_VALUES_AS_ARRAY[0]),
@@ -75,7 +75,7 @@ const DSTabsPropTypes = {
   containerProps: import_ds_props_helpers.PropTypes.object.description("Additional properties for the container.").defaultValue({}),
   innerRef: import_ds_props_helpers.PropTypes.oneOfType([import_ds_props_helpers.PropTypes.func, import_ds_props_helpers.PropTypes.shape({ current: import_ds_props_helpers.PropTypes.any })]).description("Ref to the container.").defaultValue(void 0),
   tabPanelsProps: import_ds_props_helpers.PropTypes.shape(import_ds_props_helpers.globalAttributesPropTypes).description("Additional properties for the tab container.").defaultValue({}),
-  swipeableViewsContainerProps: import_ds_props_helpers.PropTypes.object.description("Additional properties for the swipeable container.").defaultValue({}),
+  swipeableViewsContainerProps: import_ds_props_helpers.PropTypes.object.description("Additional properties for the swipeable container.").defaultValue(void 0).deprecated({ version: "3.55.x", message: "This prop is no longer supported." }),
   firstSubtabRef: import_ds_props_helpers.PropTypes.shape({ current: import_ds_props_helpers.PropTypes.any }).description("Ref to the first subtab element.").defaultValue(void 0),
   lastTabRef: import_ds_props_helpers.PropTypes.shape({ current: import_ds_props_helpers.PropTypes.any }).description("Ref to the last tab element.").defaultValue(void 0),
   TabBarExtraContent: import_ds_props_helpers.PropTypes.element.description("Additional content to display in the tab bar."),

package/dist/cjs/react-desc-prop-types.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/react-desc-prop-types.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["import type { DSPropTypesSchema, GlobalAttributesT, XstyledProps } from '@elliemae/ds-props-helpers';\nimport {\n  PropTypes,\n  getPropsPerSlotPropTypes,\n  globalAttributesPropTypes,\n  xstyledPropTypes,\n} from '@elliemae/ds-props-helpers';\nimport type { TypescriptHelpersT } from '@elliemae/ds-typescript-helpers';\nimport type { SwipeableViewsProps } from 'react-swipeable-views';\nimport type { DSTabsInternalsT } from './sharedTypes.js';\n\nimport { DSTabsName, TABS_SLOTS, TAB_TYPES, TAB_TYPES_VALUES_AS_ARRAY } from './constants/index.js';\n\nconst noop = (): void => {};\n\nexport declare namespace DSTabT {\n  export interface DefaultProps {\n    tabId: string;\n    applyAriaDisabled: boolean;\n  }\n\n  export interface OptionalProps {\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 RequiredProps {\n    children: TypescriptHelpersT.ReactChildrenComplete;\n  }\n\n  export interface Props extends Partial<DefaultProps>, OptionalProps, RequiredProps {}\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, e?: React.MouseEvent) => void;\n    tabsListAriaLabel: string;\n    type: DSTabsInternalsT.TabTypesT;\n    children: React.ReactElement<DSTabT.Props>[] | readonly React.ReactElement<DSTabT.Props>[];\n    onlyRenderActiveTab: boolean;\n    fixedTabsHeaders: boolean;\n    withCarousel: boolean;\n    isDSMobile: boolean;\n    showSelectionIndicator: boolean;\n    showSeparator: boolean;\n    tabPanelsProps: GlobalAttributesT<HTMLDivElement>;\n    swipeableViewsContainerProps: SwipeableViewsProps;\n  }\n\n  export interface OptionalProps {\n    firstSubtabRef?: React.MutableRefObject<HTMLElement>;\n    lastTabRef?: React.MutableRefObject<HTMLElement>;\n    TabBarExtraContent?: React.ComponentType;\n    tabBarExtraContent?: React.ReactNode;\n    activeTab?: string;\n    innerRef?: React.MutableRefObject<HTMLDivElement>;\n  }\n\n  export interface Props\n    extends Partial<DefaultProps>,\n      OptionalProps,\n      Omit<GlobalAttributesT<HTMLElement>, keyof DefaultProps | keyof XstyledProps>,\n      XstyledProps {}\n\n  export interface InternalProps\n    extends DefaultProps,\n      OptionalProps,\n      Omit<GlobalAttributesT<HTMLElement>, keyof DefaultProps | keyof XstyledProps>,\n      XstyledProps {}\n}\n\nexport const DSTabPropTypes: DSPropTypesSchema<DSTabT.Props> = {\n  ...globalAttributesPropTypes,\n  ...xstyledPropTypes,\n  tabId: PropTypes.string.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  applyAriaDisabled: PropTypes.bool\n    .description(\n      'Whether to apply disabled styling and announce as disabled in SR. CAN STILL RECEIVE FOCUS. PREVENTS ONLY MAIN ACTION.',\n    )\n    .defaultValue(false),\n  style: PropTypes.object.description('Custom styles for the tab.').defaultValue({}),\n  ref: PropTypes.shape({ current: PropTypes.any }).description('Ref to the tab element.').defaultValue(undefined),\n  onClick: PropTypes.func.description('Click handler for the tab.').defaultValue(undefined),\n  onKeyDown: PropTypes.func.description('Keydown handler for the tab.').defaultValue(undefined),\n  children: PropTypes.node.description('Content of the tab.').isRequired,\n};\n\nexport const DSTabsPropTypes: DSPropTypesSchema<DSTabsT.Props> = {\n  ...getPropsPerSlotPropTypes(DSTabsName, TABS_SLOTS),\n  ...globalAttributesPropTypes,\n  ...xstyledPropTypes,\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(TAB_TYPES_VALUES_AS_ARRAY).description('Tab type.').defaultValue(TAB_TYPES_VALUES_AS_ARRAY[0]),\n  fixedTabsHeaders: PropTypes.bool.description('Fixes the tab headers.').defaultValue(false),\n  isDSMobile: PropTypes.bool.description('Indicates if the component is in mobile mode.').defaultValue(false),\n  showSelectionIndicator: PropTypes.bool\n    .description('Shows the selection indicator for the active tab.')\n    .defaultValue(true),\n  showSeparator: PropTypes.bool.description('Shows a separator between tabs.').defaultValue(true),\n\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  tabPanelsProps: PropTypes.shape(globalAttributesPropTypes)\n    .description('Additional properties for the tab container.')\n    .defaultValue({}),\n  swipeableViewsContainerProps: PropTypes.object\n    .description('Additional properties for the swipeable container.')\n    .defaultValue({}),\n  firstSubtabRef: PropTypes.shape({ current: PropTypes.any })\n    .description('Ref to the first subtab element.')\n    .defaultValue(undefined),\n  lastTabRef: PropTypes.shape({ current: PropTypes.any })\n    .description('Ref to the last tab element.')\n    .defaultValue(undefined),\n  TabBarExtraContent: PropTypes.element.description('Additional content to display in the tab bar.'),\n  tabBarExtraContent: PropTypes.node\n    .description('Additional content to display in the tab bar.')\n    .defaultValue(undefined),\n};\n\nexport const DSTabsDefaultProps: DSTabsT.DefaultProps = {\n  containerProps: {},\n  animated: true,\n  enableMouseEvents: false,\n  allowTextSelection: false,\n  onTabChange: noop,\n  tabsListAriaLabel: 'Tab list',\n  type: TAB_TYPES.NORMAL,\n  onlyRenderActiveTab: false,\n  withCarousel: false,\n  isDSMobile: false,\n  showSelectionIndicator: true,\n  children: [],\n  fixedTabsHeaders: false,\n  showSeparator: true,\n  tabPanelsProps: {},\n  swipeableViewsContainerProps: {},\n};\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": "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",
+  "sourcesContent": ["import type { DSPropTypesSchema, GlobalAttributesT, XstyledProps } from '@elliemae/ds-props-helpers';\nimport {\n  PropTypes,\n  getPropsPerSlotPropTypes,\n  globalAttributesPropTypes,\n  xstyledPropTypes,\n} from '@elliemae/ds-props-helpers';\nimport type { TypescriptHelpersT } from '@elliemae/ds-typescript-helpers';\nimport type { DSTabsInternalsT } from './sharedTypes.js';\n\nimport { DSTabsName, TABS_SLOTS, TAB_TYPES, TAB_TYPES_VALUES_AS_ARRAY } from './constants/index.js';\n\nconst noop = (): void => {};\n\nexport declare namespace DSTabT {\n  export interface DefaultProps {\n    tabId: string;\n    applyAriaDisabled: boolean;\n  }\n\n  export interface OptionalProps {\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 RequiredProps {\n    children: TypescriptHelpersT.ReactChildrenComplete;\n  }\n\n  export interface Props extends Partial<DefaultProps>, OptionalProps, RequiredProps {}\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, e?: React.MouseEvent) => void;\n    tabsListAriaLabel: string;\n    type: DSTabsInternalsT.TabTypesT;\n    children: React.ReactElement<DSTabT.Props>[] | readonly React.ReactElement<DSTabT.Props>[];\n    onlyRenderActiveTab: boolean;\n    fixedTabsHeaders: boolean;\n    withCarousel: boolean;\n    isDSMobile: boolean;\n    showSelectionIndicator: boolean;\n    showSeparator: boolean;\n    tabPanelsProps: GlobalAttributesT<HTMLDivElement>;\n    swipeableViewsContainerProps: object;\n  }\n\n  export interface OptionalProps {\n    firstSubtabRef?: React.MutableRefObject<HTMLElement>;\n    lastTabRef?: React.MutableRefObject<HTMLElement>;\n    TabBarExtraContent?: React.ComponentType;\n    tabBarExtraContent?: React.ReactNode;\n    activeTab?: string;\n    innerRef?: React.MutableRefObject<HTMLDivElement>;\n  }\n\n  export interface Props\n    extends Partial<DefaultProps>,\n      OptionalProps,\n      Omit<GlobalAttributesT<HTMLElement>, keyof DefaultProps | keyof XstyledProps>,\n      XstyledProps {}\n\n  export interface InternalProps\n    extends DefaultProps,\n      OptionalProps,\n      Omit<GlobalAttributesT<HTMLElement>, keyof DefaultProps | keyof XstyledProps>,\n      XstyledProps {}\n}\n\nexport const DSTabPropTypes: DSPropTypesSchema<DSTabT.Props> = {\n  ...globalAttributesPropTypes,\n  ...xstyledPropTypes,\n  tabId: PropTypes.string.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  applyAriaDisabled: PropTypes.bool\n    .description(\n      'Whether to apply disabled styling and announce as disabled in SR. CAN STILL RECEIVE FOCUS. PREVENTS ONLY MAIN ACTION.',\n    )\n    .defaultValue(false),\n  style: PropTypes.object.description('Custom styles for the tab.').defaultValue({}),\n  ref: PropTypes.shape({ current: PropTypes.any }).description('Ref to the tab element.').defaultValue(undefined),\n  onClick: PropTypes.func.description('Click handler for the tab.').defaultValue(undefined),\n  onKeyDown: PropTypes.func.description('Keydown handler for the tab.').defaultValue(undefined),\n  children: PropTypes.node.description('Content of the tab.').isRequired,\n};\n\nexport const DSTabsPropTypes: DSPropTypesSchema<DSTabsT.Props> = {\n  ...getPropsPerSlotPropTypes(DSTabsName, TABS_SLOTS),\n  ...globalAttributesPropTypes,\n  ...xstyledPropTypes,\n  animated: PropTypes.bool.description('Whether the Tab transition should animate or not.').defaultValue(true),\n  enableMouseEvents: PropTypes.bool\n    .description('Enables Tab transition with mouse drag events.')\n    .defaultValue(false)\n    .deprecated({ version: '3.55.x', message: 'This prop is no longer supported.' }),\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(TAB_TYPES_VALUES_AS_ARRAY).description('Tab type.').defaultValue(TAB_TYPES_VALUES_AS_ARRAY[0]),\n  fixedTabsHeaders: PropTypes.bool.description('Fixes the tab headers.').defaultValue(false),\n  isDSMobile: PropTypes.bool.description('Indicates if the component is in mobile mode.').defaultValue(false),\n  showSelectionIndicator: PropTypes.bool\n    .description('Shows the selection indicator for the active tab.')\n    .defaultValue(true),\n  showSeparator: PropTypes.bool.description('Shows a separator between tabs.').defaultValue(true),\n\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  tabPanelsProps: PropTypes.shape(globalAttributesPropTypes)\n    .description('Additional properties for the tab container.')\n    .defaultValue({}),\n  swipeableViewsContainerProps: PropTypes.object\n    .description('Additional properties for the swipeable container.')\n    .defaultValue(undefined)\n    .deprecated({ version: '3.55.x', message: 'This prop is no longer supported.' }),\n  firstSubtabRef: PropTypes.shape({ current: PropTypes.any })\n    .description('Ref to the first subtab element.')\n    .defaultValue(undefined),\n  lastTabRef: PropTypes.shape({ current: PropTypes.any })\n    .description('Ref to the last tab element.')\n    .defaultValue(undefined),\n  TabBarExtraContent: PropTypes.element.description('Additional content to display in the tab bar.'),\n  tabBarExtraContent: PropTypes.node\n    .description('Additional content to display in the tab bar.')\n    .defaultValue(undefined),\n};\n\nexport const DSTabsDefaultProps: DSTabsT.DefaultProps = {\n  containerProps: {},\n  animated: true,\n  enableMouseEvents: false,\n  allowTextSelection: false,\n  onTabChange: noop,\n  tabsListAriaLabel: 'Tab list',\n  type: TAB_TYPES.NORMAL,\n  onlyRenderActiveTab: false,\n  withCarousel: false,\n  isDSMobile: false,\n  showSelectionIndicator: true,\n  children: [],\n  fixedTabsHeaders: false,\n  showSeparator: true,\n  tabPanelsProps: {},\n  swipeableViewsContainerProps: {},\n};\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": "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",
   "names": []
 }

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

@@ -1,23 +1,30 @@
 import * as React from "react";
 import { jsx } from "react/jsx-runtime";
-import { createElement } from "react";
 import React2, { useMemo, useContext, useCallback } from "react";
-import SwipeableViews from "react-swipeable-views";
+import { DSSwipeCard } from "@elliemae/ds-swipe-card";
 import { StyledPanelContainer } from "./styles.js";
 import { DSTabsContext } from "../../DSTabsCTX.js";
+const CardRender = (props) => {
+  const { content, tabPanelsProps, isDSMobile, hide, style, role, tabId, ...rest } = props;
+  return /* @__PURE__ */ jsx(
+    StyledPanelContainer,
+    {
+      id: tabId,
+      ...tabPanelsProps,
+      ...rest,
+      isDSMobile,
+      hide,
+      style,
+      role,
+      children: content
+    }
+  );
+};
 const TabsPanels = () => {
   const {
     actualActiveTab,
     focusableTabsRef,
-    props: {
-      animated,
-      enableMouseEvents,
-      onlyRenderActiveTab,
-      children: tabs,
-      isDSMobile,
-      tabPanelsProps,
-      swipeableViewsContainerProps
-    },
+    props: { onlyRenderActiveTab, children: tabs, isDSMobile, tabPanelsProps, animated },
     globalClickHandler
   } = useContext(DSTabsContext);
   const handleOnChangeIndex = useCallback(
@@ -40,65 +47,47 @@ const TabsPanels = () => {
     [actualActiveTab, focusableTabsRef, globalClickHandler]
   );
   const panels = useMemo(() => {
-    const emptyPanelRender = animated ? /* @__PURE__ */ jsx("div", {}) : null;
-    return React2.Children.map(tabs, (tab) => {
+    const mapResult = React2.Children.map(tabs, (tab, index) => {
       const { tabId: panelId = "", style, children: content, disabled, applyAriaDisabled } = tab.props;
       const isActive = actualActiveTab === panelId;
       const shouldRender = !onlyRenderActiveTab || isActive;
-      const getOwnerProps = () => tab.props;
-      const getOwnerPropsArguments = () => ({ panelId });
-      if (disabled) return emptyPanelRender;
-      if (!shouldRender) return emptyPanelRender;
-      return /* @__PURE__ */ createElement(
-        StyledPanelContainer,
-        {
-          ...tabPanelsProps,
-          getOwnerProps,
-          getOwnerPropsArguments,
-          key: panelId,
-          id: panelId,
-          "aria-labelledby": `${panelId}-label`,
-          "aria-hidden": !isActive || !!applyAriaDisabled,
-          "data-panel-id": panelId,
-          "data-testid": "ds-tabs-tab-panel",
-          hide: !isActive,
-          onClick: (event) => globalClickHandler({ event, target: "panel" }),
-          role: "tabpanel",
-          style: {
-            ...tabPanelsProps?.style || {},
-            ...style || {}
-          },
-          isDSMobile
-        },
-        content
-      );
-    });
-  }, [animated, tabs, actualActiveTab, onlyRenderActiveTab, tabPanelsProps, globalClickHandler, isDSMobile]);
-  const indexExclusiveToSwipeableIndexThatReliesOnReactChildrenToArrayWhichAutoFiltersNull = useMemo(() => {
-    const childrenArray = React2.Children.toArray(tabs);
-    const index = childrenArray.findIndex((tab) => tab.props.tabId === actualActiveTab);
-    if (index === -1) return 0;
-    return index;
-  }, [actualActiveTab, tabs]);
-  if (animated) {
-    const Comp = SwipeableViews?.default ?? SwipeableViews;
-    return /* @__PURE__ */ jsx(
-      Comp,
-      {
-        ...swipeableViewsContainerProps,
+      const baseDescriptor = {
+        index,
+        tabId: panelId,
+        isActive: Boolean(isActive),
+        isDSMobile: Boolean(isDSMobile),
+        content: shouldRender && !disabled ? content : null,
         style: {
-          overflow: "hidden",
-          // https://jira.elliemae.io/browse/PUI-9906
-          ...swipeableViewsContainerProps?.style || {}
+          ...tabPanelsProps?.style || {},
+          ...style || {}
         },
-        enableMouseEvents,
-        index: indexExclusiveToSwipeableIndexThatReliesOnReactChildrenToArrayWhichAutoFiltersNull,
-        onChangeIndex: handleOnChangeIndex,
-        children: panels
-      }
-    );
-  }
-  return panels;
+        tabPanelsProps,
+        "aria-hidden": !(isActive && !applyAriaDisabled),
+        "data-panel-id": panelId,
+        "data-testid": "ds-tabs-tab-panel",
+        hide: !isActive,
+        onClick: (event) => globalClickHandler({ event, target: "panel" }),
+        role: "tabpanel"
+      };
+      return baseDescriptor;
+    });
+    return mapResult || [];
+  }, [tabs, actualActiveTab, onlyRenderActiveTab, tabPanelsProps, globalClickHandler, isDSMobile]);
+  const activeSlide = (() => {
+    const idx = panels.findIndex((panel) => panel.isActive);
+    return idx >= 0 ? idx : 0;
+  })();
+  return /* @__PURE__ */ jsx(
+    DSSwipeCard,
+    {
+      activeSlide,
+      onSwipe: (i) => handleOnChangeIndex(i, activeSlide),
+      enableTouch: true,
+      enableAnimation: animated,
+      CardRender,
+      slidesProps: panels
+    }
+  );
 };
 export {
   TabsPanels

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 arrow-body-style */\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.js';\nimport { DSTabsContext } from '../../DSTabsCTX.js';\nimport type { DSTabT } from '../../react-desc-prop-types.js';\n\nexport const TabsPanels = (): JSX.Element | JSX.Element[] => {\n  const {\n    actualActiveTab,\n    focusableTabsRef,\n    props: {\n      animated,\n      enableMouseEvents,\n      onlyRenderActiveTab,\n      children: tabs,\n      isDSMobile,\n      tabPanelsProps,\n      swipeableViewsContainerProps,\n    },\n    globalClickHandler,\n  } = useContext(DSTabsContext);\n\n  /** [PUI-15772] - Tabs Pre Refactor\n   * Handler for swipe gestures and tab index changes. It:\n   * 1. Calculates the offset between current and new tab index\n   * 2. Finds the new focusable tab based on the offset\n   * 3. Updates the active tab and forces a click event\n   * 4. May cause unnecessary rerenders due to forced click events\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        globalClickHandler({\n          event: { type: 'click' } as React.MouseEvent<HTMLDivElement>,\n          target: 'swipeableViews',\n          tabId: focusableTabsRef.current[newFocusableIndex].dataset.tabId,\n        });\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, globalClickHandler],\n  );\n\n  const panels = useMemo(() => {\n    // this component is based on React.children, swipeable views want an index in the array, not a tabId\n    // two bad patterns relying on each others results in:\n    //   - because of react.children,\n    //       to guarantee predictability in finding the index based on tabId we should never return \"null\" which is not part of React.Children.toArray\n    //\n    //  when not using swipeable views, we don't need to find the index based on tabId\n    //    so even if we return null the variable\n    //    indexExclusiveToSwipeableIndexThatReliesOnReactChildrenToArrayWhichAutoFiltersNull\n    //      (which will be calculating the wrong index)\n    //    will have no impact on the rendering\n    // https://react.dev/reference/react/Children#children-toarray-caveats\n    // Caveats\n    // Empty nodes (null, undefined, and Booleans) will be omitted in the returned array.\n    //\n    // So, long story short,\n    //  1 - do not remove next line, keep the <div /> instead of null when \"animated\"\n    //  2 - NEVER EVER BUILD API BASED ON REACT.CHILDREN (if you are writing code post 2022 and you are not working on a legacy codebase)\n    const emptyPanelRender = animated ? <div /> : null;\n    return React.Children.map(tabs, (tab: React.ReactElement<DSTabT.Props>) => {\n      const { tabId: panelId = '', style, children: content, disabled, applyAriaDisabled } = tab.props;\n      const isActive = actualActiveTab === panelId;\n      const shouldRender = !onlyRenderActiveTab || isActive;\n      const getOwnerProps = () => tab.props;\n      const getOwnerPropsArguments = () => ({ panelId });\n\n      if (disabled) return emptyPanelRender;\n      if (!shouldRender) return emptyPanelRender;\n      return (\n        <StyledPanelContainer\n          {...tabPanelsProps}\n          getOwnerProps={getOwnerProps}\n          getOwnerPropsArguments={getOwnerPropsArguments}\n          key={panelId}\n          id={panelId}\n          aria-labelledby={`${panelId}-label`}\n          aria-hidden={!isActive || !!applyAriaDisabled}\n          data-panel-id={panelId}\n          data-testid=\"ds-tabs-tab-panel\"\n          hide={!isActive}\n          onClick={(event) => globalClickHandler({ event, target: 'panel' })}\n          role=\"tabpanel\"\n          style={{\n            ...(tabPanelsProps?.style || {}),\n            ...(style || {}),\n          }}\n          isDSMobile={isDSMobile}\n        >\n          {content}\n        </StyledPanelContainer>\n      );\n    });\n  }, [animated, tabs, actualActiveTab, onlyRenderActiveTab, tabPanelsProps, globalClickHandler, isDSMobile]);\n\n  const indexExclusiveToSwipeableIndexThatReliesOnReactChildrenToArrayWhichAutoFiltersNull = useMemo(() => {\n    const childrenArray = React.Children.toArray(tabs) as React.ReactElement<DSTabT.Props>[];\n    const index = childrenArray.findIndex((tab) => tab.props.tabId === actualActiveTab);\n\n    if (index === -1) return 0;\n    return index;\n  }, [actualActiveTab, tabs]);\n\n  if (animated) {\n    // Ignore ts errors on the next line because the 'react-swipeable-views' package does not export a type for the SwipeableViews component\n    // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access, @typescript-eslint/no-explicit-any, @typescript-eslint/no-unsafe-assignment\n    const Comp = (SwipeableViews as any)?.default ?? SwipeableViews;\n    return (\n      <Comp\n        {...swipeableViewsContainerProps}\n        style={{\n          overflow: 'hidden', // https://jira.elliemae.io/browse/PUI-9906\n          ...(swipeableViewsContainerProps?.style || {}),\n        }}\n        enableMouseEvents={enableMouseEvents}\n        index={indexExclusiveToSwipeableIndexThatReliesOnReactChildrenToArrayWhichAutoFiltersNull}\n        onChangeIndex={handleOnChangeIndex}\n      >\n        {panels}\n      </Comp>\n    );\n  }\n\n  return panels;\n};\n"],
-  "mappings": "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",
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable arrow-body-style */\n/* eslint-disable jsx-a11y/no-noninteractive-element-interactions */\nimport React, { useMemo, useContext, useCallback } from 'react';\nimport { DSSwipeCard } from '@elliemae/ds-swipe-card';\nimport type { DSSwipeCardT } from '@elliemae/ds-swipe-card/src/react-desc-prop-types.js';\nimport type { GlobalAttributesT } from '@elliemae/ds-props-helpers';\nimport { StyledPanelContainer } from './styles.js';\nimport { DSTabsContext } from '../../DSTabsCTX.js';\nimport type { DSTabT } from '../../react-desc-prop-types.js';\n/**\n * Describes the data needed to render a single Tab panel slide.\n */\ninterface PanelDescriptor extends Record<string, unknown> {\n  index: number;\n  tabId: string;\n  isActive: boolean;\n  isDSMobile: boolean;\n  content: React.ReactNode;\n  style: React.CSSProperties;\n  tabPanelsProps?: GlobalAttributesT<HTMLDivElement>;\n  'aria-hidden': boolean;\n  'data-panel-id': string;\n  'data-testid': string;\n  hide: boolean;\n  onClick: (event: React.MouseEvent<HTMLDivElement>) => void;\n  role: 'tabpanel';\n}\n\n/**\n * Responsible for rendering a single slide using the provided panel descriptor.\n * Receives a `dsIndex` prop from DSSwipeCard which indicates the slide position.\n */\nconst CardRender: React.ComponentType<DSSwipeCardT.CardRenderProps<PanelDescriptor>> = (props) => {\n  const { content, tabPanelsProps, isDSMobile, hide, style, role, tabId, ...rest } = props;\n  // We pass through all attributes, including accessibility and dataset attributes.\n  return (\n    <StyledPanelContainer\n      id={tabId}\n      {...tabPanelsProps}\n      {...rest}\n      // Styled component specific props\n      isDSMobile={isDSMobile}\n      hide={hide}\n      style={style}\n      role={role}\n    >\n      {content}\n    </StyledPanelContainer>\n  );\n};\n\nexport const TabsPanels = (): JSX.Element => {\n  const {\n    actualActiveTab,\n    focusableTabsRef,\n    props: { onlyRenderActiveTab, children: tabs, isDSMobile, tabPanelsProps, animated },\n    globalClickHandler,\n  } = useContext(DSTabsContext);\n\n  /** [PUI-15772] - Tabs Pre Refactor\n   * Handler for swipe gestures and tab index changes. It:\n   * 1. Calculates the offset between current and new tab index\n   * 2. Finds the new focusable tab based on the offset\n   * 3. Updates the active tab and forces a click event\n   * 4. May cause unnecessary rerenders due to forced click events\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        globalClickHandler({\n          event: { type: 'click' } as React.MouseEvent<HTMLDivElement>,\n          target: 'swipeableViews',\n          tabId: focusableTabsRef.current[newFocusableIndex].dataset.tabId,\n        });\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, globalClickHandler],\n  );\n\n  const panels: PanelDescriptor[] = useMemo(() => {\n    // this component is based on React.children, swipeable views want an index in the array, not a tabId\n    // two bad patterns relying on each others results in:\n    //   - because of react.children,\n    //       to guarantee predictability in finding the index based on tabId we should never return \"null\" which is not part of React.Children.toArray\n    //\n    //  when not using swipeable views, we don't need to find the index based on tabId\n    //    so even if we return null the variable\n    //    indexExclusiveToSwipeableIndexThatReliesOnReactChildrenToArrayWhichAutoFiltersNull\n    //      (which will be calculating the wrong index)\n    //    will have no impact on the rendering\n    // https://react.dev/reference/react/Children#children-toarray-caveats\n    // Caveats\n    // Empty nodes (null, undefined, and Booleans) will be omitted in the returned array.\n    //\n    // So, long story short,\n    //  1 - do not remove next line, keep the <div /> instead of null when \"animated\"\n    //  2 - NEVER EVER BUILD API BASED ON REACT.CHILDREN (if you are writing code post 2022 and you are not working on a legacy codebase)\n    // To preserve indices for swipe behavior, we return a fully-typed placeholder panel\n    // instead of null when a panel should not be rendered. This keeps array length stable.\n    const mapResult = React.Children.map(tabs, (tab: React.ReactElement<DSTabT.Props>, index: number) => {\n      const { tabId: panelId = '', style, children: content, disabled, applyAriaDisabled } = tab.props;\n      const isActive = actualActiveTab === panelId;\n      const shouldRender = !onlyRenderActiveTab || isActive;\n      // const getOwnerProps = () => tab.props;\n      // const getOwnerPropsArguments = () => ({ panelId });\n\n      const baseDescriptor: PanelDescriptor = {\n        index,\n        tabId: panelId,\n        isActive: Boolean(isActive),\n        isDSMobile: Boolean(isDSMobile),\n        content: shouldRender && !disabled ? content : null,\n        style: {\n          ...(tabPanelsProps?.style || {}),\n          ...(style || {}),\n        } as React.CSSProperties,\n        tabPanelsProps,\n        'aria-hidden': !(isActive && !applyAriaDisabled),\n        'data-panel-id': panelId,\n        'data-testid': 'ds-tabs-tab-panel',\n        hide: !isActive,\n        onClick: (event: React.MouseEvent<HTMLDivElement>) => globalClickHandler({ event, target: 'panel' }),\n        role: 'tabpanel',\n      };\n\n      return baseDescriptor;\n\n      // (\n      //   <StyledPanelContainer\n      //     {...tabPanelsProps}\n\n      //     isDSMobile={isDSMobile}\n      //   >\n      //     {}\n      //   </StyledPanelContainer>\n      // );\n    });\n\n    // Children.map can return null if there are no children; ensure an array is returned\n    return mapResult || [];\n  }, [tabs, actualActiveTab, onlyRenderActiveTab, tabPanelsProps, globalClickHandler, isDSMobile]);\n\n  // Safely compute the active slide index. Default to 0 when none found.\n  const activeSlide = (() => {\n    const idx = panels.findIndex((panel) => panel.isActive);\n    return idx >= 0 ? idx : 0;\n  })();\n\n  return (\n    <DSSwipeCard<PanelDescriptor>\n      activeSlide={activeSlide}\n      onSwipe={(i) => handleOnChangeIndex(i, activeSlide)}\n      enableTouch\n      enableAnimation={animated}\n      CardRender={CardRender}\n      slidesProps={panels}\n    />\n  );\n};\n"],
+  "mappings": "AAAA,YAAY,WAAW;ACoCnB;AAlCJ,OAAOA,UAAS,SAAS,YAAY,mBAAmB;AACxD,SAAS,mBAAmB;AAG5B,SAAS,4BAA4B;AACrC,SAAS,qBAAqB;AAyB9B,MAAM,aAAiF,CAAC,UAAU;AAChG,QAAM,EAAE,SAAS,gBAAgB,YAAY,MAAM,OAAO,MAAM,OAAO,GAAG,KAAK,IAAI;AAEnF,SACE;AAAA,IAAC;AAAA;AAAA,MACC,IAAI;AAAA,MACH,GAAG;AAAA,MACH,GAAG;AAAA,MAEJ;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MAEC;AAAA;AAAA,EACH;AAEJ;AAEO,MAAM,aAAa,MAAmB;AAC3C,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA,OAAO,EAAE,qBAAqB,UAAU,MAAM,YAAY,gBAAgB,SAAS;AAAA,IACnF;AAAA,EACF,IAAI,WAAW,aAAa;AAS5B,QAAM,sBAAsB;AAAA,IAC1B,CAAC,OAAe,gBAAwB;AACtC,UAAI,CAAC,iBAAiB,QAAS;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,iBAAiB;AAE7C;AACF,2BAAmB;AAAA,UACjB,OAAO,EAAE,MAAM,QAAQ;AAAA,UACvB,QAAQ;AAAA,UACR,OAAO,iBAAiB,QAAQ,iBAAiB,EAAE,QAAQ;AAAA,QAC7D,CAAC;AAKD,yBAAiB,QAAQ,iBAAiB,EAAE,MAAM;AAAA,MACpD;AAAA,IACF;AAAA,IACA,CAAC,iBAAiB,kBAAkB,kBAAkB;AAAA,EACxD;AAEA,QAAM,SAA4B,QAAQ,MAAM;AAoB9C,UAAM,YAAYA,OAAM,SAAS,IAAI,MAAM,CAAC,KAAuC,UAAkB;AACnG,YAAM,EAAE,OAAO,UAAU,IAAI,OAAO,UAAU,SAAS,UAAU,kBAAkB,IAAI,IAAI;AAC3F,YAAM,WAAW,oBAAoB;AACrC,YAAM,eAAe,CAAC,uBAAuB;AAI7C,YAAM,iBAAkC;AAAA,QACtC;AAAA,QACA,OAAO;AAAA,QACP,UAAU,QAAQ,QAAQ;AAAA,QAC1B,YAAY,QAAQ,UAAU;AAAA,QAC9B,SAAS,gBAAgB,CAAC,WAAW,UAAU;AAAA,QAC/C,OAAO;AAAA,UACL,GAAI,gBAAgB,SAAS,CAAC;AAAA,UAC9B,GAAI,SAAS,CAAC;AAAA,QAChB;AAAA,QACA;AAAA,QACA,eAAe,EAAE,YAAY,CAAC;AAAA,QAC9B,iBAAiB;AAAA,QACjB,eAAe;AAAA,QACf,MAAM,CAAC;AAAA,QACP,SAAS,CAAC,UAA4C,mBAAmB,EAAE,OAAO,QAAQ,QAAQ,CAAC;AAAA,QACnG,MAAM;AAAA,MACR;AAEA,aAAO;AAAA,IAWT,CAAC;AAGD,WAAO,aAAa,CAAC;AAAA,EACvB,GAAG,CAAC,MAAM,iBAAiB,qBAAqB,gBAAgB,oBAAoB,UAAU,CAAC;AAG/F,QAAM,eAAe,MAAM;AACzB,UAAM,MAAM,OAAO,UAAU,CAAC,UAAU,MAAM,QAAQ;AACtD,WAAO,OAAO,IAAI,MAAM;AAAA,EAC1B,GAAG;AAEH,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA,SAAS,CAAC,MAAM,oBAAoB,GAAG,WAAW;AAAA,MAClD,aAAW;AAAA,MACX,iBAAiB;AAAA,MACjB;AAAA,MACA,aAAa;AAAA;AAAA,EACf;AAEJ;",
   "names": ["React"]
 }

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

@@ -9,10 +9,6 @@ const StyledPanelContainer = styled("div", {
   &:focus {
     outline: none;
   }
-
-  ${({ hide }) => hide ? "visibility: hidden; position: absolute;" : ""}
-
-  ${({ isDSMobile }) => isDSMobile ? `padding-top: 0;` : ``}
 `;
 export {
   StyledPanelContainer

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/parts/tabsPanel/styles.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { styled } from '@elliemae/ds-system';\nimport { TABS_SLOTS, DSTabsName } from '../../constants/index.js';\n\ninterface StyledPanelContainerPropsT {\n  hide: boolean;\n  isDSMobile: boolean;\n}\n\nexport const StyledPanelContainer = styled('div', {\n  name: DSTabsName,\n  slot: TABS_SLOTS.TAB_PANEL,\n})<StyledPanelContainerPropsT>`\n  padding-top: 8px;\n  &:focus {\n    outline: none;\n  }\n\n  ${({ hide }) => (hide ? 'visibility: hidden; position: absolute;' : '')}\n\n  ${({ isDSMobile }) => (isDSMobile ? `padding-top: 0;` : ``)}\n`;\n"],
-  "mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,cAAc;AACvB,SAAS,YAAY,kBAAkB;AAOhC,MAAM,uBAAuB,OAAO,OAAO;AAAA,EAChD,MAAM;AAAA,EACN,MAAM,WAAW;AACnB,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAMG,CAAC,EAAE,KAAK,MAAO,OAAO,4CAA4C,EAAG;AAAA;AAAA,IAErE,CAAC,EAAE,WAAW,MAAO,aAAa,oBAAoB,EAAG;AAAA;",
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { styled } from '@elliemae/ds-system';\nimport { TABS_SLOTS, DSTabsName } from '../../constants/index.js';\n\ninterface StyledPanelContainerPropsT {\n  hide: boolean;\n  isDSMobile: boolean;\n}\n\nexport const StyledPanelContainer = styled('div', {\n  name: DSTabsName,\n  slot: TABS_SLOTS.TAB_PANEL,\n})<StyledPanelContainerPropsT>`\n  padding-top: 8px;\n  &:focus {\n    outline: none;\n  }\n`;\n"],
+  "mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,cAAc;AACvB,SAAS,YAAY,kBAAkB;AAOhC,MAAM,uBAAuB,OAAO,OAAO;AAAA,EAChD,MAAM;AAAA,EACN,MAAM,WAAW;AACnB,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;",
   "names": []
 }

package/dist/esm/react-desc-prop-types.js

@@ -29,7 +29,7 @@ const DSTabsPropTypes = {
   ...globalAttributesPropTypes,
   ...xstyledPropTypes,
   animated: PropTypes.bool.description("Whether the Tab transition should animate or not.").defaultValue(true),
-  enableMouseEvents: PropTypes.bool.description("Enables Tab transition with mouse drag events.").defaultValue(false),
+  enableMouseEvents: PropTypes.bool.description("Enables Tab transition with mouse drag events.").defaultValue(false).deprecated({ version: "3.55.x", message: "This prop is no longer supported." }),
   allowTextSelection: PropTypes.bool.description("Allows text selection when mouse drag events are active.").defaultValue(false),
   onTabChange: PropTypes.func.description("Handler when a user clicks on a different Tab.").defaultValue("() => {}"),
   type: PropTypes.oneOf(TAB_TYPES_VALUES_AS_ARRAY).description("Tab type.").defaultValue(TAB_TYPES_VALUES_AS_ARRAY[0]),
@@ -45,7 +45,7 @@ const DSTabsPropTypes = {
   containerProps: PropTypes.object.description("Additional properties for the container.").defaultValue({}),
   innerRef: PropTypes.oneOfType([PropTypes.func, PropTypes.shape({ current: PropTypes.any })]).description("Ref to the container.").defaultValue(void 0),
   tabPanelsProps: PropTypes.shape(globalAttributesPropTypes).description("Additional properties for the tab container.").defaultValue({}),
-  swipeableViewsContainerProps: PropTypes.object.description("Additional properties for the swipeable container.").defaultValue({}),
+  swipeableViewsContainerProps: PropTypes.object.description("Additional properties for the swipeable container.").defaultValue(void 0).deprecated({ version: "3.55.x", message: "This prop is no longer supported." }),
   firstSubtabRef: PropTypes.shape({ current: PropTypes.any }).description("Ref to the first subtab element.").defaultValue(void 0),
   lastTabRef: PropTypes.shape({ current: PropTypes.any }).description("Ref to the last tab element.").defaultValue(void 0),
   TabBarExtraContent: PropTypes.element.description("Additional content to display in the tab bar."),

package/dist/esm/react-desc-prop-types.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../src/react-desc-prop-types.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import type { DSPropTypesSchema, GlobalAttributesT, XstyledProps } from '@elliemae/ds-props-helpers';\nimport {\n  PropTypes,\n  getPropsPerSlotPropTypes,\n  globalAttributesPropTypes,\n  xstyledPropTypes,\n} from '@elliemae/ds-props-helpers';\nimport type { TypescriptHelpersT } from '@elliemae/ds-typescript-helpers';\nimport type { SwipeableViewsProps } from 'react-swipeable-views';\nimport type { DSTabsInternalsT } from './sharedTypes.js';\n\nimport { DSTabsName, TABS_SLOTS, TAB_TYPES, TAB_TYPES_VALUES_AS_ARRAY } from './constants/index.js';\n\nconst noop = (): void => {};\n\nexport declare namespace DSTabT {\n  export interface DefaultProps {\n    tabId: string;\n    applyAriaDisabled: boolean;\n  }\n\n  export interface OptionalProps {\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 RequiredProps {\n    children: TypescriptHelpersT.ReactChildrenComplete;\n  }\n\n  export interface Props extends Partial<DefaultProps>, OptionalProps, RequiredProps {}\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, e?: React.MouseEvent) => void;\n    tabsListAriaLabel: string;\n    type: DSTabsInternalsT.TabTypesT;\n    children: React.ReactElement<DSTabT.Props>[] | readonly React.ReactElement<DSTabT.Props>[];\n    onlyRenderActiveTab: boolean;\n    fixedTabsHeaders: boolean;\n    withCarousel: boolean;\n    isDSMobile: boolean;\n    showSelectionIndicator: boolean;\n    showSeparator: boolean;\n    tabPanelsProps: GlobalAttributesT<HTMLDivElement>;\n    swipeableViewsContainerProps: SwipeableViewsProps;\n  }\n\n  export interface OptionalProps {\n    firstSubtabRef?: React.MutableRefObject<HTMLElement>;\n    lastTabRef?: React.MutableRefObject<HTMLElement>;\n    TabBarExtraContent?: React.ComponentType;\n    tabBarExtraContent?: React.ReactNode;\n    activeTab?: string;\n    innerRef?: React.MutableRefObject<HTMLDivElement>;\n  }\n\n  export interface Props\n    extends Partial<DefaultProps>,\n      OptionalProps,\n      Omit<GlobalAttributesT<HTMLElement>, keyof DefaultProps | keyof XstyledProps>,\n      XstyledProps {}\n\n  export interface InternalProps\n    extends DefaultProps,\n      OptionalProps,\n      Omit<GlobalAttributesT<HTMLElement>, keyof DefaultProps | keyof XstyledProps>,\n      XstyledProps {}\n}\n\nexport const DSTabPropTypes: DSPropTypesSchema<DSTabT.Props> = {\n  ...globalAttributesPropTypes,\n  ...xstyledPropTypes,\n  tabId: PropTypes.string.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  applyAriaDisabled: PropTypes.bool\n    .description(\n      'Whether to apply disabled styling and announce as disabled in SR. CAN STILL RECEIVE FOCUS. PREVENTS ONLY MAIN ACTION.',\n    )\n    .defaultValue(false),\n  style: PropTypes.object.description('Custom styles for the tab.').defaultValue({}),\n  ref: PropTypes.shape({ current: PropTypes.any }).description('Ref to the tab element.').defaultValue(undefined),\n  onClick: PropTypes.func.description('Click handler for the tab.').defaultValue(undefined),\n  onKeyDown: PropTypes.func.description('Keydown handler for the tab.').defaultValue(undefined),\n  children: PropTypes.node.description('Content of the tab.').isRequired,\n};\n\nexport const DSTabsPropTypes: DSPropTypesSchema<DSTabsT.Props> = {\n  ...getPropsPerSlotPropTypes(DSTabsName, TABS_SLOTS),\n  ...globalAttributesPropTypes,\n  ...xstyledPropTypes,\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(TAB_TYPES_VALUES_AS_ARRAY).description('Tab type.').defaultValue(TAB_TYPES_VALUES_AS_ARRAY[0]),\n  fixedTabsHeaders: PropTypes.bool.description('Fixes the tab headers.').defaultValue(false),\n  isDSMobile: PropTypes.bool.description('Indicates if the component is in mobile mode.').defaultValue(false),\n  showSelectionIndicator: PropTypes.bool\n    .description('Shows the selection indicator for the active tab.')\n    .defaultValue(true),\n  showSeparator: PropTypes.bool.description('Shows a separator between tabs.').defaultValue(true),\n\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  tabPanelsProps: PropTypes.shape(globalAttributesPropTypes)\n    .description('Additional properties for the tab container.')\n    .defaultValue({}),\n  swipeableViewsContainerProps: PropTypes.object\n    .description('Additional properties for the swipeable container.')\n    .defaultValue({}),\n  firstSubtabRef: PropTypes.shape({ current: PropTypes.any })\n    .description('Ref to the first subtab element.')\n    .defaultValue(undefined),\n  lastTabRef: PropTypes.shape({ current: PropTypes.any })\n    .description('Ref to the last tab element.')\n    .defaultValue(undefined),\n  TabBarExtraContent: PropTypes.element.description('Additional content to display in the tab bar.'),\n  tabBarExtraContent: PropTypes.node\n    .description('Additional content to display in the tab bar.')\n    .defaultValue(undefined),\n};\n\nexport const DSTabsDefaultProps: DSTabsT.DefaultProps = {\n  containerProps: {},\n  animated: true,\n  enableMouseEvents: false,\n  allowTextSelection: false,\n  onTabChange: noop,\n  tabsListAriaLabel: 'Tab list',\n  type: TAB_TYPES.NORMAL,\n  onlyRenderActiveTab: false,\n  withCarousel: false,\n  isDSMobile: false,\n  showSelectionIndicator: true,\n  children: [],\n  fixedTabsHeaders: false,\n  showSeparator: true,\n  tabPanelsProps: {},\n  swipeableViewsContainerProps: {},\n};\n"],
-  "mappings": "AAAA,YAAY,WAAW;ACCvB;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAKP,SAAS,YAAY,YAAY,WAAW,iCAAiC;AAE7E,MAAM,OAAO,MAAY;AAAC;AAmEnB,MAAM,iBAAkD;AAAA,EAC7D,GAAG;AAAA,EACH,GAAG;AAAA,EACH,OAAO,UAAU,OAAO,YAAY,gBAAgB,EAAE,aAAa,EAAE;AAAA,EACrE,OAAO,UAAU,OAAO,YAAY,YAAY,EAAE,aAAa,EAAE;AAAA,EACjE,UAAU,UAAU,KAAK,YAAY,yCAAyC,EAAE,aAAa,KAAK;AAAA,EAClG,UAAU,UAAU,KAAK,YAAY,eAAe,EAAE,aAAa,KAAK;AAAA,EACxE,mBAAmB,UAAU,KAC1B;AAAA,IACC;AAAA,EACF,EACC,aAAa,KAAK;AAAA,EACrB,OAAO,UAAU,OAAO,YAAY,4BAA4B,EAAE,aAAa,CAAC,CAAC;AAAA,EACjF,KAAK,UAAU,MAAM,EAAE,SAAS,UAAU,IAAI,CAAC,EAAE,YAAY,yBAAyB,EAAE,aAAa,MAAS;AAAA,EAC9G,SAAS,UAAU,KAAK,YAAY,4BAA4B,EAAE,aAAa,MAAS;AAAA,EACxF,WAAW,UAAU,KAAK,YAAY,8BAA8B,EAAE,aAAa,MAAS;AAAA,EAC5F,UAAU,UAAU,KAAK,YAAY,qBAAqB,EAAE;AAC9D;AAEO,MAAM,kBAAoD;AAAA,EAC/D,GAAG,yBAAyB,YAAY,UAAU;AAAA,EAClD,GAAG;AAAA,EACH,GAAG;AAAA,EACH,UAAU,UAAU,KAAK,YAAY,mDAAmD,EAAE,aAAa,IAAI;AAAA,EAC3G,mBAAmB,UAAU,KAAK,YAAY,gDAAgD,EAAE,aAAa,KAAK;AAAA,EAClH,oBAAoB,UAAU,KAC3B,YAAY,0DAA0D,EACtE,aAAa,KAAK;AAAA,EACrB,aAAa,UAAU,KAAK,YAAY,gDAAgD,EAAE,aAAa,UAAU;AAAA,EACjH,MAAM,UAAU,MAAM,yBAAyB,EAAE,YAAY,WAAW,EAAE,aAAa,0BAA0B,CAAC,CAAC;AAAA,EACnH,kBAAkB,UAAU,KAAK,YAAY,wBAAwB,EAAE,aAAa,KAAK;AAAA,EACzF,YAAY,UAAU,KAAK,YAAY,+CAA+C,EAAE,aAAa,KAAK;AAAA,EAC1G,wBAAwB,UAAU,KAC/B,YAAY,mDAAmD,EAC/D,aAAa,IAAI;AAAA,EACpB,eAAe,UAAU,KAAK,YAAY,iCAAiC,EAAE,aAAa,IAAI;AAAA,EAE9F,qBAAqB,UAAU,KAAK,YAAY,yCAAyC,EAAE,aAAa,KAAK;AAAA,EAC7G,cAAc,UAAU,KAAK,YAAY,6BAA6B,EAAE,aAAa,KAAK;AAAA,EAC1F,WAAW,UAAU,OAClB,YAAY,sDAAsD,EAClE,aAAa,uBAAuB;AAAA,EACvC,UAAU,UAAU,KAAK,YAAY,kCAAkC,EAAE;AAAA,EACzE,mBAAmB,UAAU,OAAO,YAAY,0BAA0B,EAAE,aAAa,WAAW;AAAA,EACpG,gBAAgB,UAAU,OAAO,YAAY,0CAA0C,EAAE,aAAa,CAAC,CAAC;AAAA,EACxG,UAAU,UAAU,UAAU,CAAC,UAAU,MAAM,UAAU,MAAM,EAAE,SAAS,UAAU,IAAI,CAAC,CAAC,CAAC,EACxF,YAAY,uBAAuB,EACnC,aAAa,MAAS;AAAA,EACzB,gBAAgB,UAAU,MAAM,yBAAyB,EACtD,YAAY,8CAA8C,EAC1D,aAAa,CAAC,CAAC;AAAA,EAClB,8BAA8B,UAAU,OACrC,YAAY,oDAAoD,EAChE,aAAa,CAAC,CAAC;AAAA,EAClB,gBAAgB,UAAU,MAAM,EAAE,SAAS,UAAU,IAAI,CAAC,EACvD,YAAY,kCAAkC,EAC9C,aAAa,MAAS;AAAA,EACzB,YAAY,UAAU,MAAM,EAAE,SAAS,UAAU,IAAI,CAAC,EACnD,YAAY,8BAA8B,EAC1C,aAAa,MAAS;AAAA,EACzB,oBAAoB,UAAU,QAAQ,YAAY,+CAA+C;AAAA,EACjG,oBAAoB,UAAU,KAC3B,YAAY,+CAA+C,EAC3D,aAAa,MAAS;AAC3B;AAEO,MAAM,qBAA2C;AAAA,EACtD,gBAAgB,CAAC;AAAA,EACjB,UAAU;AAAA,EACV,mBAAmB;AAAA,EACnB,oBAAoB;AAAA,EACpB,aAAa;AAAA,EACb,mBAAmB;AAAA,EACnB,MAAM,UAAU;AAAA,EAChB,qBAAqB;AAAA,EACrB,cAAc;AAAA,EACd,YAAY;AAAA,EACZ,wBAAwB;AAAA,EACxB,UAAU,CAAC;AAAA,EACX,kBAAkB;AAAA,EAClB,eAAe;AAAA,EACf,gBAAgB,CAAC;AAAA,EACjB,8BAA8B,CAAC;AACjC;",
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import type { DSPropTypesSchema, GlobalAttributesT, XstyledProps } from '@elliemae/ds-props-helpers';\nimport {\n  PropTypes,\n  getPropsPerSlotPropTypes,\n  globalAttributesPropTypes,\n  xstyledPropTypes,\n} from '@elliemae/ds-props-helpers';\nimport type { TypescriptHelpersT } from '@elliemae/ds-typescript-helpers';\nimport type { DSTabsInternalsT } from './sharedTypes.js';\n\nimport { DSTabsName, TABS_SLOTS, TAB_TYPES, TAB_TYPES_VALUES_AS_ARRAY } from './constants/index.js';\n\nconst noop = (): void => {};\n\nexport declare namespace DSTabT {\n  export interface DefaultProps {\n    tabId: string;\n    applyAriaDisabled: boolean;\n  }\n\n  export interface OptionalProps {\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 RequiredProps {\n    children: TypescriptHelpersT.ReactChildrenComplete;\n  }\n\n  export interface Props extends Partial<DefaultProps>, OptionalProps, RequiredProps {}\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, e?: React.MouseEvent) => void;\n    tabsListAriaLabel: string;\n    type: DSTabsInternalsT.TabTypesT;\n    children: React.ReactElement<DSTabT.Props>[] | readonly React.ReactElement<DSTabT.Props>[];\n    onlyRenderActiveTab: boolean;\n    fixedTabsHeaders: boolean;\n    withCarousel: boolean;\n    isDSMobile: boolean;\n    showSelectionIndicator: boolean;\n    showSeparator: boolean;\n    tabPanelsProps: GlobalAttributesT<HTMLDivElement>;\n    swipeableViewsContainerProps: object;\n  }\n\n  export interface OptionalProps {\n    firstSubtabRef?: React.MutableRefObject<HTMLElement>;\n    lastTabRef?: React.MutableRefObject<HTMLElement>;\n    TabBarExtraContent?: React.ComponentType;\n    tabBarExtraContent?: React.ReactNode;\n    activeTab?: string;\n    innerRef?: React.MutableRefObject<HTMLDivElement>;\n  }\n\n  export interface Props\n    extends Partial<DefaultProps>,\n      OptionalProps,\n      Omit<GlobalAttributesT<HTMLElement>, keyof DefaultProps | keyof XstyledProps>,\n      XstyledProps {}\n\n  export interface InternalProps\n    extends DefaultProps,\n      OptionalProps,\n      Omit<GlobalAttributesT<HTMLElement>, keyof DefaultProps | keyof XstyledProps>,\n      XstyledProps {}\n}\n\nexport const DSTabPropTypes: DSPropTypesSchema<DSTabT.Props> = {\n  ...globalAttributesPropTypes,\n  ...xstyledPropTypes,\n  tabId: PropTypes.string.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  applyAriaDisabled: PropTypes.bool\n    .description(\n      'Whether to apply disabled styling and announce as disabled in SR. CAN STILL RECEIVE FOCUS. PREVENTS ONLY MAIN ACTION.',\n    )\n    .defaultValue(false),\n  style: PropTypes.object.description('Custom styles for the tab.').defaultValue({}),\n  ref: PropTypes.shape({ current: PropTypes.any }).description('Ref to the tab element.').defaultValue(undefined),\n  onClick: PropTypes.func.description('Click handler for the tab.').defaultValue(undefined),\n  onKeyDown: PropTypes.func.description('Keydown handler for the tab.').defaultValue(undefined),\n  children: PropTypes.node.description('Content of the tab.').isRequired,\n};\n\nexport const DSTabsPropTypes: DSPropTypesSchema<DSTabsT.Props> = {\n  ...getPropsPerSlotPropTypes(DSTabsName, TABS_SLOTS),\n  ...globalAttributesPropTypes,\n  ...xstyledPropTypes,\n  animated: PropTypes.bool.description('Whether the Tab transition should animate or not.').defaultValue(true),\n  enableMouseEvents: PropTypes.bool\n    .description('Enables Tab transition with mouse drag events.')\n    .defaultValue(false)\n    .deprecated({ version: '3.55.x', message: 'This prop is no longer supported.' }),\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(TAB_TYPES_VALUES_AS_ARRAY).description('Tab type.').defaultValue(TAB_TYPES_VALUES_AS_ARRAY[0]),\n  fixedTabsHeaders: PropTypes.bool.description('Fixes the tab headers.').defaultValue(false),\n  isDSMobile: PropTypes.bool.description('Indicates if the component is in mobile mode.').defaultValue(false),\n  showSelectionIndicator: PropTypes.bool\n    .description('Shows the selection indicator for the active tab.')\n    .defaultValue(true),\n  showSeparator: PropTypes.bool.description('Shows a separator between tabs.').defaultValue(true),\n\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  tabPanelsProps: PropTypes.shape(globalAttributesPropTypes)\n    .description('Additional properties for the tab container.')\n    .defaultValue({}),\n  swipeableViewsContainerProps: PropTypes.object\n    .description('Additional properties for the swipeable container.')\n    .defaultValue(undefined)\n    .deprecated({ version: '3.55.x', message: 'This prop is no longer supported.' }),\n  firstSubtabRef: PropTypes.shape({ current: PropTypes.any })\n    .description('Ref to the first subtab element.')\n    .defaultValue(undefined),\n  lastTabRef: PropTypes.shape({ current: PropTypes.any })\n    .description('Ref to the last tab element.')\n    .defaultValue(undefined),\n  TabBarExtraContent: PropTypes.element.description('Additional content to display in the tab bar.'),\n  tabBarExtraContent: PropTypes.node\n    .description('Additional content to display in the tab bar.')\n    .defaultValue(undefined),\n};\n\nexport const DSTabsDefaultProps: DSTabsT.DefaultProps = {\n  containerProps: {},\n  animated: true,\n  enableMouseEvents: false,\n  allowTextSelection: false,\n  onTabChange: noop,\n  tabsListAriaLabel: 'Tab list',\n  type: TAB_TYPES.NORMAL,\n  onlyRenderActiveTab: false,\n  withCarousel: false,\n  isDSMobile: false,\n  showSelectionIndicator: true,\n  children: [],\n  fixedTabsHeaders: false,\n  showSeparator: true,\n  tabPanelsProps: {},\n  swipeableViewsContainerProps: {},\n};\n"],
+  "mappings": "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",
   "names": []
 }

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

@@ -1 +1 @@
-export declare const TabsPanels: () => JSX.Element | JSX.Element[];
+export declare const TabsPanels: () => JSX.Element;

package/dist/types/react-desc-prop-types.d.ts

@@ -1,6 +1,5 @@
 import type { DSPropTypesSchema, GlobalAttributesT, XstyledProps } from '@elliemae/ds-props-helpers';
 import type { TypescriptHelpersT } from '@elliemae/ds-typescript-helpers';
-import type { SwipeableViewsProps } from 'react-swipeable-views';
 import type { DSTabsInternalsT } from './sharedTypes.js';
 export declare namespace DSTabT {
     interface DefaultProps {
@@ -39,7 +38,7 @@ export declare namespace DSTabsT {
         showSelectionIndicator: boolean;
         showSeparator: boolean;
         tabPanelsProps: GlobalAttributesT<HTMLDivElement>;
-        swipeableViewsContainerProps: SwipeableViewsProps;
+        swipeableViewsContainerProps: object;
     }
     interface OptionalProps {
         firstSubtabRef?: React.MutableRefObject<HTMLElement>;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@elliemae/ds-tabs",
-  "version": "3.55.0-next.6",
+  "version": "3.55.0-next.8",
   "license": "MIT",
   "description": "ICE MT - Dimsum - Tabs",
   "files": [
@@ -37,20 +37,19 @@
   },
   "dependencies": {
     "@react-hook/resize-observer": "~1.2.6",
-    "react-swipeable-views": "~0.14.0",
-    "@elliemae/ds-button-v2": "3.55.0-next.6",
-    "@elliemae/ds-icon": "3.55.0-next.6",
-    "@elliemae/ds-props-helpers": "3.55.0-next.6",
-    "@elliemae/ds-system": "3.55.0-next.6",
-    "@elliemae/ds-typescript-helpers": "3.55.0-next.6",
-    "@elliemae/ds-icons": "3.55.0-next.6"
+    "@elliemae/ds-button-v2": "3.55.0-next.8",
+    "@elliemae/ds-icon": "3.55.0-next.8",
+    "@elliemae/ds-props-helpers": "3.55.0-next.8",
+    "@elliemae/ds-icons": "3.55.0-next.8",
+    "@elliemae/ds-system": "3.55.0-next.8",
+    "@elliemae/ds-typescript-helpers": "3.55.0-next.8"
   },
   "devDependencies": {
     "@elliemae/pui-cli": "9.0.0-next.65",
     "jest": "~29.7.0",
     "styled-components": "~5.3.9",
-    "@elliemae/ds-monorepo-devops": "3.55.0-next.6",
-    "@elliemae/ds-test-utils": "3.55.0-next.6"
+    "@elliemae/ds-monorepo-devops": "3.55.0-next.8",
+    "@elliemae/ds-test-utils": "3.55.0-next.8"
   },
   "peerDependencies": {
     "lodash-es": "^4.17.21",