@elliemae/ds-tabs 3.4.2 → 3.4.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (88) hide show
  1. package/dist/cjs/DSTabs.js +16 -10
  2. package/dist/cjs/DSTabs.js.map +1 -1
  3. package/dist/cjs/DSTabsCTX.js +4 -1
  4. package/dist/cjs/DSTabsCTX.js.map +2 -2
  5. package/dist/cjs/DSTabsDatatestid.js +4 -1
  6. package/dist/cjs/DSTabsDatatestid.js.map +1 -1
  7. package/dist/cjs/config/useCrossRef.js +11 -5
  8. package/dist/cjs/config/useCrossRef.js.map +1 -1
  9. package/dist/cjs/config/useTabs.js +18 -12
  10. package/dist/cjs/config/useTabs.js.map +1 -1
  11. package/dist/cjs/exported-related/DSTab.js +6 -2
  12. package/dist/cjs/exported-related/DSTab.js.map +2 -2
  13. package/dist/cjs/index.js +4 -1
  14. package/dist/cjs/index.js.map +1 -1
  15. package/dist/cjs/parts/carousel/Carousel.js +42 -27
  16. package/dist/cjs/parts/carousel/Carousel.js.map +1 -1
  17. package/dist/cjs/parts/carousel/styles.js +4 -1
  18. package/dist/cjs/parts/carousel/styles.js.map +1 -1
  19. package/dist/cjs/parts/carousel/useCarousel.js +12 -3
  20. package/dist/cjs/parts/carousel/useCarousel.js.map +2 -2
  21. package/dist/cjs/parts/carousel/useCarouselCallbacks.js +29 -23
  22. package/dist/cjs/parts/carousel/useCarouselCallbacks.js.map +1 -1
  23. package/dist/cjs/parts/tabBar/TabBar.js +42 -23
  24. package/dist/cjs/parts/tabBar/TabBar.js.map +2 -2
  25. package/dist/cjs/parts/tabBar/styles.js +7 -2
  26. package/dist/cjs/parts/tabBar/styles.js.map +1 -1
  27. package/dist/cjs/parts/tabBar/useTabBar.js +8 -2
  28. package/dist/cjs/parts/tabBar/useTabBar.js.map +2 -2
  29. package/dist/cjs/parts/tabsContent/TabsContent.js +20 -8
  30. package/dist/cjs/parts/tabsContent/TabsContent.js.map +1 -1
  31. package/dist/cjs/parts/tabsContent/styles.js +4 -1
  32. package/dist/cjs/parts/tabsContent/styles.js.map +1 -1
  33. package/dist/cjs/parts/tabsPanel/TabsPanels.js +50 -37
  34. package/dist/cjs/parts/tabsPanel/TabsPanels.js.map +2 -2
  35. package/dist/cjs/parts/tabsPanel/styles.js +4 -1
  36. package/dist/cjs/parts/tabsPanel/styles.js.map +1 -1
  37. package/dist/cjs/propTypes.js +4 -1
  38. package/dist/cjs/propTypes.js.map +1 -1
  39. package/dist/cjs/sharedTypes.js +4 -1
  40. package/dist/cjs/sharedTypes.js.map +1 -1
  41. package/dist/cjs/utils/constants.js +4 -1
  42. package/dist/cjs/utils/constants.js.map +1 -1
  43. package/dist/cjs/utils/helpers.js +14 -3
  44. package/dist/cjs/utils/helpers.js.map +1 -1
  45. package/dist/cjs/utils/hooks/useKeyboardNavigation.js +41 -35
  46. package/dist/cjs/utils/hooks/useKeyboardNavigation.js.map +1 -1
  47. package/dist/cjs/utils/hooks/useTabsCallbacks.js +22 -13
  48. package/dist/cjs/utils/hooks/useTabsCallbacks.js.map +1 -1
  49. package/dist/esm/DSTabs.js +12 -9
  50. package/dist/esm/DSTabs.js.map +1 -1
  51. package/dist/esm/DSTabsCTX.js.map +1 -1
  52. package/dist/esm/DSTabsDatatestid.js.map +1 -1
  53. package/dist/esm/config/useCrossRef.js +7 -4
  54. package/dist/esm/config/useCrossRef.js.map +1 -1
  55. package/dist/esm/config/useTabs.js +14 -11
  56. package/dist/esm/config/useTabs.js.map +1 -1
  57. package/dist/esm/exported-related/DSTab.js +2 -1
  58. package/dist/esm/exported-related/DSTab.js.map +2 -2
  59. package/dist/esm/index.js.map +1 -1
  60. package/dist/esm/parts/carousel/Carousel.js +38 -26
  61. package/dist/esm/parts/carousel/Carousel.js.map +1 -1
  62. package/dist/esm/parts/carousel/styles.js.map +1 -1
  63. package/dist/esm/parts/carousel/useCarousel.js +8 -2
  64. package/dist/esm/parts/carousel/useCarousel.js.map +1 -1
  65. package/dist/esm/parts/carousel/useCarouselCallbacks.js +25 -22
  66. package/dist/esm/parts/carousel/useCarouselCallbacks.js.map +1 -1
  67. package/dist/esm/parts/tabBar/TabBar.js +38 -22
  68. package/dist/esm/parts/tabBar/TabBar.js.map +2 -2
  69. package/dist/esm/parts/tabBar/styles.js +3 -1
  70. package/dist/esm/parts/tabBar/styles.js.map +1 -1
  71. package/dist/esm/parts/tabBar/useTabBar.js +4 -1
  72. package/dist/esm/parts/tabBar/useTabBar.js.map +1 -1
  73. package/dist/esm/parts/tabsContent/TabsContent.js +16 -7
  74. package/dist/esm/parts/tabsContent/TabsContent.js.map +1 -1
  75. package/dist/esm/parts/tabsContent/styles.js.map +1 -1
  76. package/dist/esm/parts/tabsPanel/TabsPanels.js +46 -36
  77. package/dist/esm/parts/tabsPanel/TabsPanels.js.map +2 -2
  78. package/dist/esm/parts/tabsPanel/styles.js.map +1 -1
  79. package/dist/esm/propTypes.js.map +1 -1
  80. package/dist/esm/sharedTypes.js.map +1 -1
  81. package/dist/esm/utils/constants.js.map +1 -1
  82. package/dist/esm/utils/helpers.js +10 -2
  83. package/dist/esm/utils/helpers.js.map +1 -1
  84. package/dist/esm/utils/hooks/useKeyboardNavigation.js +37 -34
  85. package/dist/esm/utils/hooks/useKeyboardNavigation.js.map +1 -1
  86. package/dist/esm/utils/hooks/useTabsCallbacks.js +18 -12
  87. package/dist/esm/utils/hooks/useTabsCallbacks.js.map +1 -1
  88. package/package.json +6 -6
@@ -17,7 +17,10 @@ var __copyProps = (to, from, except, desc) => {
17
17
  }
18
18
  return to;
19
19
  };
20
- 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));
20
+ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
21
+ isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
22
+ mod
23
+ ));
21
24
  var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
22
25
  var DSTabs_exports = {};
23
26
  __export(DSTabs_exports, {
@@ -27,7 +30,7 @@ __export(DSTabs_exports, {
27
30
  });
28
31
  module.exports = __toCommonJS(DSTabs_exports);
29
32
  var React = __toESM(require("react"));
30
- var import_react = __toESM(require("react"));
33
+ var import_jsx_runtime = require("react/jsx-runtime");
31
34
  var import_ds_utilities = require("@elliemae/ds-utilities");
32
35
  var import_propTypes = require("./propTypes");
33
36
  var import_DSTabsCTX = require("./DSTabsCTX");
@@ -40,15 +43,18 @@ const DSTabs = (props) => {
40
43
  const crossRefsCtx = (0, import_useCrossRef.useCrossRef)();
41
44
  const { type } = props;
42
45
  if (type === import_constants.TabTypes.SUBTABS) {
43
- return /* @__PURE__ */ import_react.default.createElement(import_DSTabsCTX.DSTabsContext.Provider, {
44
- value: ctx
45
- }, /* @__PURE__ */ import_react.default.createElement(import_TabsContent.TabsContent, null));
46
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_DSTabsCTX.DSTabsContext.Provider, {
47
+ value: ctx,
48
+ children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_TabsContent.TabsContent, {})
49
+ });
46
50
  }
47
- return /* @__PURE__ */ import_react.default.createElement(import_DSTabsCTX.DSTabsCrossRefContext.Provider, {
48
- value: crossRefsCtx
49
- }, /* @__PURE__ */ import_react.default.createElement(import_DSTabsCTX.DSTabsContext.Provider, {
50
- value: ctx
51
- }, /* @__PURE__ */ import_react.default.createElement(import_TabsContent.TabsContent, null)));
51
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_DSTabsCTX.DSTabsCrossRefContext.Provider, {
52
+ value: crossRefsCtx,
53
+ children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_DSTabsCTX.DSTabsContext.Provider, {
54
+ value: ctx,
55
+ children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_TabsContent.TabsContent, {})
56
+ })
57
+ });
52
58
  };
53
59
  DSTabs.propTypes = import_propTypes.tabsPropTypes;
54
60
  const DSTabsWithSchema = (0, import_ds_utilities.describe)(DSTabs);
@@ -2,6 +2,6 @@
2
2
  "version": 3,
3
3
  "sources": ["../../src/DSTabs.tsx", "../../../../scripts/build/transpile/react-shim.js"],
4
4
  "sourcesContent": ["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", "import * as React from 'react';\nexport { React };\n"],
5
- "mappings": ";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAkB;AAElB,0BAAyB;AACzB,uBAA8B;AAC9B,uBAAqD;AACrD,yBAA4B;AAC5B,qBAAwB;AACxB,yBAA4B;AAC5B,uBAAyB;AAGzB,MAAM,SAAS,CAAC,UAAsC;AACpD,QAAM,MAAM,4BAAQ,KAAK;AACzB,QAAM,eAAe,oCAAY;AAEjC,QAAM,EAAE,SAAS;AAEjB,MAAI,SAAS,0BAAS,SAAS;AAC7B,WACE,mDAAC,+BAAc,UAAd;AAAA,MAAuB,OAAO;AAAA,OAC7B,mDAAC,oCAAY,CACf;AAAA,EAEJ;AAEA,SACE,mDAAC,uCAAsB,UAAtB;AAAA,IAA+B,OAAO;AAAA,KACrC,mDAAC,+BAAc,UAAd;AAAA,IAAuB,OAAO;AAAA,KAC7B,mDAAC,oCAAY,CACf,CACF;AAEJ;AAEA,OAAO,YAAY;AACnB,MAAM,mBAAmB,kCAAwB,MAAM;AACvD,iBAAiB,YAAY;AAG7B,IAAO,iBAAQ;",
5
+ "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB;AAEA,0BAAyB;AACzB,uBAA8B;AAC9B,uBAAqD;AACrD,yBAA4B;AAC5B,qBAAwB;AACxB,yBAA4B;AAC5B,uBAAyB;AAGzB,MAAM,SAAS,CAAC,UAAsC;AACpD,QAAM,UAAM,wBAAQ,KAAK;AACzB,QAAM,mBAAe,gCAAY;AAEjC,QAAM,EAAE,KAAK,IAAI;AAEjB,MAAI,SAAS,0BAAS,SAAS;AAC7B,WACE,4CAAC,+BAAc,UAAd;AAAA,MAAuB,OAAO;AAAA,MAC7B,sDAAC,kCAAY;AAAA,KACf;AAAA,EAEJ;AAEA,SACE,4CAAC,uCAAsB,UAAtB;AAAA,IAA+B,OAAO;AAAA,IACrC,sDAAC,+BAAc,UAAd;AAAA,MAAuB,OAAO;AAAA,MAC7B,sDAAC,kCAAY;AAAA,KACf;AAAA,GACF;AAEJ;AAEA,OAAO,YAAY;AACnB,MAAM,uBAAmB,8BAAwB,MAAM;AACvD,iBAAiB,YAAY;AAG7B,IAAO,iBAAQ;",
6
6
  "names": []
7
7
  }
@@ -17,7 +17,10 @@ var __copyProps = (to, from, except, desc) => {
17
17
  }
18
18
  return to;
19
19
  };
20
- 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));
20
+ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
21
+ isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
22
+ mod
23
+ ));
21
24
  var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
22
25
  var DSTabsCTX_exports = {};
23
26
  __export(DSTabsCTX_exports, {
@@ -2,6 +2,6 @@
2
2
  "version": 3,
3
3
  "sources": ["../../src/DSTabsCTX.tsx", "../../../../scripts/build/transpile/react-shim.js"],
4
4
  "sourcesContent": ["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", "import * as React from 'react';\nexport { React };\n"],
5
- "mappings": ";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAyC;AACzC,uBAAiD;AAIjD,MAAM,OAAO,MAAM;AAAC;AAEpB,MAAM,iBAAiB;AAAA,EACrB,OAAO;AAAA,EACP,SAAS,4BAAoD;AAAA,EAC7D,aAAa,4BAAiC;AAAA,EAC9C,qBAAqB,4BAAiC;AAAA,EACtD,kBAAkB,4BAAsC;AAAA,EACxD,gBAAgB,4BAAsC;AAAA,EACtD,oBAAoB,4BAAoC;AAAA,EACxD,sBAAsB;AAAA,EACtB,iBAAiB;AACnB;AAEA,MAAM,0BAA0B;AAAA,EAC9B,oBAAoB,4BAAoC;AAAA,EACxD,wBAAwB,4BAAoC;AAC9D;AAEO,MAAM,gBAAgB,gCAAsD,cAAc;AAC1F,MAAM,wBAAwB,gCAA0D,uBAAuB;",
6
- "names": []
5
+ "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAyC;AACzC,uBAAiD;AAIjD,MAAM,OAAO,MAAM;AAAC;AAEpB,MAAM,iBAAiB;AAAA,EACrB,OAAO,iBAAAA;AAAA,EACP,aAAS,wBAAoD;AAAA,EAC7D,iBAAa,wBAAiC;AAAA,EAC9C,yBAAqB,wBAAiC;AAAA,EACtD,sBAAkB,wBAAsC;AAAA,EACxD,oBAAgB,wBAAsC;AAAA,EACtD,wBAAoB,wBAAoC;AAAA,EACxD,sBAAsB;AAAA,EACtB,iBAAiB;AACnB;AAEA,MAAM,0BAA0B;AAAA,EAC9B,wBAAoB,wBAAoC;AAAA,EACxD,4BAAwB,wBAAoC;AAC9D;AAEO,MAAM,oBAAgB,4BAAsD,cAAc;AAC1F,MAAM,4BAAwB,4BAA0D,uBAAuB;",
6
+ "names": ["defaultProps"]
7
7
  }
@@ -17,7 +17,10 @@ var __copyProps = (to, from, except, desc) => {
17
17
  }
18
18
  return to;
19
19
  };
20
- 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));
20
+ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
21
+ isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
22
+ mod
23
+ ));
21
24
  var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
22
25
  var DSTabsDatatestid_exports = {};
23
26
  __export(DSTabsDatatestid_exports, {
@@ -2,6 +2,6 @@
2
2
  "version": 3,
3
3
  "sources": ["../../src/DSTabsDatatestid.tsx", "../../../../scripts/build/transpile/react-shim.js"],
4
4
  "sourcesContent": ["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", "import * as React from 'react';\nexport { React };\n"],
5
- "mappings": ";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAhB,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;",
5
+ "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAhB,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;",
6
6
  "names": []
7
7
  }
@@ -17,7 +17,10 @@ var __copyProps = (to, from, except, desc) => {
17
17
  }
18
18
  return to;
19
19
  };
20
- 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));
20
+ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
21
+ isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
22
+ mod
23
+ ));
21
24
  var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
22
25
  var useCrossRef_exports = {};
23
26
  __export(useCrossRef_exports, {
@@ -29,10 +32,13 @@ var import_react = require("react");
29
32
  const useCrossRef = () => {
30
33
  const firstSubtabInternalRef = (0, import_react.useRef)();
31
34
  const lastTabInternalRef = (0, import_react.useRef)();
32
- const ctx = (0, import_react.useMemo)(() => ({
33
- firstSubtabInternalRef,
34
- lastTabInternalRef
35
- }), []);
35
+ const ctx = (0, import_react.useMemo)(
36
+ () => ({
37
+ firstSubtabInternalRef,
38
+ lastTabInternalRef
39
+ }),
40
+ []
41
+ );
36
42
  return ctx;
37
43
  };
38
44
  //# sourceMappingURL=useCrossRef.js.map
@@ -2,6 +2,6 @@
2
2
  "version": 3,
3
3
  "sources": ["../../../src/config/useCrossRef.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
4
4
  "sourcesContent": ["import { useRef, useMemo } from 'react';\nimport type { DSTabsInternalsT } from '../sharedTypes';\n\nexport const useCrossRef = (): DSTabsInternalsT.DSTabsUseCrossRefContextT => {\n const firstSubtabInternalRef = useRef<HTMLButtonElement>();\n const lastTabInternalRef = useRef<HTMLButtonElement>();\n\n const ctx = useMemo(\n () => ({\n firstSubtabInternalRef,\n lastTabInternalRef,\n }),\n [],\n );\n\n return ctx;\n};\n", "import * as React from 'react';\nexport { React };\n"],
5
- "mappings": ";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAgC;AAGzB,MAAM,cAAc,MAAkD;AAC3E,QAAM,yBAAyB,yBAA0B;AACzD,QAAM,qBAAqB,yBAA0B;AAErD,QAAM,MAAM,0BACV,MAAO;AAAA,IACL;AAAA,IACA;AAAA,EACF,IACA,CAAC,CACH;AAEA,SAAO;AACT;",
5
+ "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAgC;AAGzB,MAAM,cAAc,MAAkD;AAC3E,QAAM,6BAAyB,qBAA0B;AACzD,QAAM,yBAAqB,qBAA0B;AAErD,QAAM,UAAM;AAAA,IACV,OAAO;AAAA,MACL;AAAA,MACA;AAAA,IACF;AAAA,IACA,CAAC;AAAA,EACH;AAEA,SAAO;AACT;",
6
6
  "names": []
7
7
  }
@@ -17,7 +17,10 @@ var __copyProps = (to, from, except, desc) => {
17
17
  }
18
18
  return to;
19
19
  };
20
- 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));
20
+ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
21
+ isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
22
+ mod
23
+ ));
21
24
  var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
22
25
  var useTabs_exports = {};
23
26
  __export(useTabs_exports, {
@@ -52,17 +55,20 @@ const useTabs = (props) => {
52
55
  setInternalActiveTab(firstAvailableTab?.dataset.tabId || "");
53
56
  }
54
57
  }, [activeTab]);
55
- const ctx = (0, import_react.useMemo)(() => ({
56
- props: propsWithDefaults,
57
- tabsRef,
58
- focusableTabsRef,
59
- tabsListRef,
60
- tabsRefAsArray,
61
- setInternalActiveTab,
62
- actualActiveTab,
63
- actualActiveTabRef,
64
- carouselOnlyListRef
65
- }), [actualActiveTab, propsWithDefaults]);
58
+ const ctx = (0, import_react.useMemo)(
59
+ () => ({
60
+ props: propsWithDefaults,
61
+ tabsRef,
62
+ focusableTabsRef,
63
+ tabsListRef,
64
+ tabsRefAsArray,
65
+ setInternalActiveTab,
66
+ actualActiveTab,
67
+ actualActiveTabRef,
68
+ carouselOnlyListRef
69
+ }),
70
+ [actualActiveTab, propsWithDefaults]
71
+ );
66
72
  return ctx;
67
73
  };
68
74
  //# sourceMappingURL=useTabs.js.map
@@ -2,6 +2,6 @@
2
2
  "version": 3,
3
3
  "sources": ["../../../src/config/useTabs.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
4
4
  "sourcesContent": ["import { useRef, useState, useMemo, useEffect } from 'react';\nimport { useMemoMergePropsWithDefault } from '@elliemae/ds-utilities';\nimport { tabsDefaultProps } from '../propTypes';\nimport type { DSTabsT } from '../propTypes';\nimport type { DSTabsInternalsT } from '../sharedTypes';\n\nexport const useTabs = (props: DSTabsT.Props): DSTabsInternalsT.DSTabsUseTabsContextT => {\n const propsWithDefaults = useMemoMergePropsWithDefault<DSTabsT.InternalProps>(props, tabsDefaultProps);\n\n const { activeTab } = propsWithDefaults;\n\n const tabsRef = useRef<Record<number, HTMLButtonElement>>({});\n const tabsRefAsArray = useRef<HTMLButtonElement[]>([]);\n const focusableTabsRef = useRef<HTMLButtonElement[]>([]);\n const carouselOnlyListRef = useRef<HTMLDivElement | null>(null);\n const tabsListRef = useRef<HTMLDivElement | null>(null);\n const actualActiveTabRef = useRef<HTMLButtonElement | null>(null);\n\n const [internalActiveTab, setInternalActiveTab] = useState<string>('');\n\n const actualActiveTab = useMemo(() => {\n if (activeTab !== undefined) return activeTab;\n return internalActiveTab;\n }, [activeTab, internalActiveTab]);\n\n useEffect(() => {\n actualActiveTabRef.current = focusableTabsRef.current.find((el) => el.dataset.tabId === actualActiveTab) ?? null;\n }, [actualActiveTab]);\n\n useEffect(() => {\n if (activeTab === undefined) {\n const firstAvailableTab = focusableTabsRef.current.find((el) => el.ariaDisabled !== 'true');\n setInternalActiveTab(firstAvailableTab?.dataset.tabId || '');\n }\n }, [activeTab]);\n\n const ctx = useMemo(\n () => ({\n props: propsWithDefaults,\n tabsRef,\n focusableTabsRef,\n tabsListRef,\n tabsRefAsArray,\n setInternalActiveTab,\n actualActiveTab,\n actualActiveTabRef,\n carouselOnlyListRef,\n }),\n [actualActiveTab, propsWithDefaults],\n );\n\n return ctx;\n};\n", "import * as React from 'react';\nexport { React };\n"],
5
- "mappings": ";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAqD;AACrD,0BAA6C;AAC7C,uBAAiC;AAI1B,MAAM,UAAU,CAAC,UAAiE;AACvF,QAAM,oBAAoB,sDAAoD,OAAO,iCAAgB;AAErG,QAAM,EAAE,cAAc;AAEtB,QAAM,UAAU,yBAA0C,CAAC,CAAC;AAC5D,QAAM,iBAAiB,yBAA4B,CAAC,CAAC;AACrD,QAAM,mBAAmB,yBAA4B,CAAC,CAAC;AACvD,QAAM,sBAAsB,yBAA8B,IAAI;AAC9D,QAAM,cAAc,yBAA8B,IAAI;AACtD,QAAM,qBAAqB,yBAAiC,IAAI;AAEhE,QAAM,CAAC,mBAAmB,wBAAwB,2BAAiB,EAAE;AAErE,QAAM,kBAAkB,0BAAQ,MAAM;AACpC,QAAI,cAAc;AAAW,aAAO;AACpC,WAAO;AAAA,EACT,GAAG,CAAC,WAAW,iBAAiB,CAAC;AAEjC,8BAAU,MAAM;AACd,uBAAmB,UAAU,iBAAiB,QAAQ,KAAK,CAAC,OAAO,GAAG,QAAQ,UAAU,eAAe,KAAK;AAAA,EAC9G,GAAG,CAAC,eAAe,CAAC;AAEpB,8BAAU,MAAM;AACd,QAAI,cAAc,QAAW;AAC3B,YAAM,oBAAoB,iBAAiB,QAAQ,KAAK,CAAC,OAAO,GAAG,iBAAiB,MAAM;AAC1F,2BAAqB,mBAAmB,QAAQ,SAAS,EAAE;AAAA,IAC7D;AAAA,EACF,GAAG,CAAC,SAAS,CAAC;AAEd,QAAM,MAAM,0BACV,MAAO;AAAA,IACL,OAAO;AAAA,IACP;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IACA,CAAC,iBAAiB,iBAAiB,CACrC;AAEA,SAAO;AACT;",
5
+ "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAqD;AACrD,0BAA6C;AAC7C,uBAAiC;AAI1B,MAAM,UAAU,CAAC,UAAiE;AACvF,QAAM,wBAAoB,kDAAoD,OAAO,iCAAgB;AAErG,QAAM,EAAE,UAAU,IAAI;AAEtB,QAAM,cAAU,qBAA0C,CAAC,CAAC;AAC5D,QAAM,qBAAiB,qBAA4B,CAAC,CAAC;AACrD,QAAM,uBAAmB,qBAA4B,CAAC,CAAC;AACvD,QAAM,0BAAsB,qBAA8B,IAAI;AAC9D,QAAM,kBAAc,qBAA8B,IAAI;AACtD,QAAM,yBAAqB,qBAAiC,IAAI;AAEhE,QAAM,CAAC,mBAAmB,oBAAoB,QAAI,uBAAiB,EAAE;AAErE,QAAM,sBAAkB,sBAAQ,MAAM;AACpC,QAAI,cAAc;AAAW,aAAO;AACpC,WAAO;AAAA,EACT,GAAG,CAAC,WAAW,iBAAiB,CAAC;AAEjC,8BAAU,MAAM;AACd,uBAAmB,UAAU,iBAAiB,QAAQ,KAAK,CAAC,OAAO,GAAG,QAAQ,UAAU,eAAe,KAAK;AAAA,EAC9G,GAAG,CAAC,eAAe,CAAC;AAEpB,8BAAU,MAAM;AACd,QAAI,cAAc,QAAW;AAC3B,YAAM,oBAAoB,iBAAiB,QAAQ,KAAK,CAAC,OAAO,GAAG,iBAAiB,MAAM;AAC1F,2BAAqB,mBAAmB,QAAQ,SAAS,EAAE;AAAA,IAC7D;AAAA,EACF,GAAG,CAAC,SAAS,CAAC;AAEd,QAAM,UAAM;AAAA,IACV,OAAO;AAAA,MACL,OAAO;AAAA,MACP;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,IACA,CAAC,iBAAiB,iBAAiB;AAAA,EACrC;AAEA,SAAO;AACT;",
6
6
  "names": []
7
7
  }
@@ -17,7 +17,10 @@ var __copyProps = (to, from, except, desc) => {
17
17
  }
18
18
  return to;
19
19
  };
20
- 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));
20
+ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
21
+ isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
22
+ mod
23
+ ));
21
24
  var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
22
25
  var DSTab_exports = {};
23
26
  __export(DSTab_exports, {
@@ -27,10 +30,11 @@ __export(DSTab_exports, {
27
30
  });
28
31
  module.exports = __toCommonJS(DSTab_exports);
29
32
  var React = __toESM(require("react"));
33
+ var import_jsx_runtime = require("react/jsx-runtime");
30
34
  var import_react = __toESM(require("react"));
31
35
  var import_ds_utilities = require("@elliemae/ds-utilities");
32
36
  var import_propTypes = require("../propTypes");
33
- const DSTab = (props) => /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, {
37
+ const DSTab = (props) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react.default.Fragment, {
34
38
  ...props
35
39
  });
36
40
  DSTab.propTypes = import_propTypes.tabPropTypes;
@@ -2,6 +2,6 @@
2
2
  "version": 3,
3
3
  "sources": ["../../../src/exported-related/DSTab.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
4
4
  "sourcesContent": ["import React from 'react';\nimport type { WeakValidationMap } from 'react';\nimport { describe } from '@elliemae/ds-utilities';\nimport { tabPropTypes } from '../propTypes';\nimport type { DSTabT } from '../propTypes';\n\nconst DSTab = (props: DSTabT.Props): JSX.Element => <React.Fragment {...props} />;\n\nDSTab.propTypes = tabPropTypes as WeakValidationMap<unknown>;\nconst DSTabWithSchema = describe<DSTabT.Props>(DSTab);\nDSTabWithSchema.propTypes = tabPropTypes;\n\nexport { DSTab, DSTabWithSchema };\nexport default DSTab;\n", "import * as React from 'react';\nexport { React };\n"],
5
- "mappings": ";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAkB;AAElB,0BAAyB;AACzB,uBAA6B;AAG7B,MAAM,QAAQ,CAAC,UAAqC,mDAAC,qBAAM,UAAN;AAAA,EAAgB,GAAG;AAAA,CAAO;AAE/E,MAAM,YAAY;AAClB,MAAM,kBAAkB,kCAAuB,KAAK;AACpD,gBAAgB,YAAY;AAG5B,IAAO,gBAAQ;",
6
- "names": []
5
+ "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB;AAAA,mBAAkB;AAElB,0BAAyB;AACzB,uBAA6B;AAG7B,MAAM,QAAQ,CAAC,UAAqC,4CAAC,aAAAA,QAAM,UAAN;AAAA,EAAgB,GAAG;AAAA,CAAO;AAE/E,MAAM,YAAY;AAClB,MAAM,sBAAkB,8BAAuB,KAAK;AACpD,gBAAgB,YAAY;AAG5B,IAAO,gBAAQ;",
6
+ "names": ["React"]
7
7
  }
package/dist/cjs/index.js CHANGED
@@ -18,7 +18,10 @@ var __copyProps = (to, from, except, desc) => {
18
18
  return to;
19
19
  };
20
20
  var __reExport = (target, mod, secondTarget) => (__copyProps(target, mod, "default"), secondTarget && __copyProps(secondTarget, mod, "default"));
21
- 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));
21
+ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
22
+ isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
23
+ mod
24
+ ));
22
25
  var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
23
26
  var src_exports = {};
24
27
  __export(src_exports, {
@@ -2,6 +2,6 @@
2
2
  "version": 3,
3
3
  "sources": ["../../src/index.tsx", "../../../../scripts/build/transpile/react-shim.js"],
4
4
  "sourcesContent": ["export * from './exported-related/DSTab';\nexport * from './DSTabs';\nexport { TabTypes } from './utils/constants';\nexport * from './DSTabsDatatestid';\nexport type { DSTabT, DSTabsT } from './propTypes';\n", "import * as React from 'react';\nexport { React };\n"],
5
- "mappings": ";;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,wBAAc,qCAAd;AACA,wBAAc,qBADd;AAEA,uBAAyB;AACzB,wBAAc,+BAHd;",
5
+ "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,wBAAc,qCAAd;AACA,wBAAc,qBADd;AAEA,uBAAyB;AACzB,wBAAc,+BAHd;",
6
6
  "names": []
7
7
  }
@@ -17,7 +17,10 @@ var __copyProps = (to, from, except, desc) => {
17
17
  }
18
18
  return to;
19
19
  };
20
- 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));
20
+ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
21
+ isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
22
+ mod
23
+ ));
21
24
  var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
22
25
  var Carousel_exports = {};
23
26
  __export(Carousel_exports, {
@@ -25,6 +28,7 @@ __export(Carousel_exports, {
25
28
  });
26
29
  module.exports = __toCommonJS(Carousel_exports);
27
30
  var React = __toESM(require("react"));
31
+ var import_jsx_runtime = require("react/jsx-runtime");
28
32
  var import_react = require("react");
29
33
  var import_ds_icon = require("@elliemae/ds-icon");
30
34
  var import_ds_button = require("@elliemae/ds-button");
@@ -41,31 +45,42 @@ const Carousel = ({ children, updateIndicatorStyle }) => {
41
45
  carouselOnlyListRef,
42
46
  props: { type }
43
47
  } = (0, import_react.useContext)(import_DSTabsCTX.DSTabsContext);
44
- return /* @__PURE__ */ React.createElement(import_styles.StyledCarouselWrapper, null, showChevrons.left && /* @__PURE__ */ React.createElement(import_styles.StyledCarouselButtonWrapper, {
45
- tabType: type
46
- }, /* @__PURE__ */ React.createElement(import_styles.StyledCarouselBtn, {
47
- size: "s",
48
- onClick: leftButtonOnClick,
49
- tabIndex: -1,
50
- "data-testid": import_DSTabsDatatestid.DSTabsDatatestid.CAROUSEL.BUTTON_LEFT,
51
- buttonType: import_ds_button.BUTTON_TYPES.ICON
52
- }, /* @__PURE__ */ React.createElement(import_ds_icons.ChevronLeft, {
53
- size: import_ds_icon.DSIconSizes.S
54
- }))), showChevrons.right && /* @__PURE__ */ React.createElement(import_styles.StyledCarouselButtonWrapper, {
55
- tabType: type,
56
- right: showChevrons.right
57
- }, /* @__PURE__ */ React.createElement(import_styles.StyledCarouselBtn, {
58
- size: "s",
59
- onClick: rightButtonOnClick,
60
- tabIndex: -1,
61
- "data-testid": import_DSTabsDatatestid.DSTabsDatatestid.CAROUSEL.BUTTON_RIGHT,
62
- buttonType: import_ds_button.BUTTON_TYPES.ICON
63
- }, /* @__PURE__ */ React.createElement(import_ds_icons.ChevronRight, {
64
- size: import_ds_icon.DSIconSizes.S
65
- }))), /* @__PURE__ */ React.createElement(import_styles.StyledChildrenWrap, {
66
- ref: carouselOnlyListRef,
67
- onClick: handleOnClick,
68
- onScroll: handleOnScroll
69
- }, children));
48
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_styles.StyledCarouselWrapper, {
49
+ children: [
50
+ showChevrons.left && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styles.StyledCarouselButtonWrapper, {
51
+ tabType: type,
52
+ children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styles.StyledCarouselBtn, {
53
+ size: "s",
54
+ onClick: leftButtonOnClick,
55
+ tabIndex: -1,
56
+ "data-testid": import_DSTabsDatatestid.DSTabsDatatestid.CAROUSEL.BUTTON_LEFT,
57
+ buttonType: import_ds_button.BUTTON_TYPES.ICON,
58
+ children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_icons.ChevronLeft, {
59
+ size: import_ds_icon.DSIconSizes.S
60
+ })
61
+ })
62
+ }),
63
+ showChevrons.right && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styles.StyledCarouselButtonWrapper, {
64
+ tabType: type,
65
+ right: showChevrons.right,
66
+ children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styles.StyledCarouselBtn, {
67
+ size: "s",
68
+ onClick: rightButtonOnClick,
69
+ tabIndex: -1,
70
+ "data-testid": import_DSTabsDatatestid.DSTabsDatatestid.CAROUSEL.BUTTON_RIGHT,
71
+ buttonType: import_ds_button.BUTTON_TYPES.ICON,
72
+ children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_icons.ChevronRight, {
73
+ size: import_ds_icon.DSIconSizes.S
74
+ })
75
+ })
76
+ }),
77
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styles.StyledChildrenWrap, {
78
+ ref: carouselOnlyListRef,
79
+ onClick: handleOnClick,
80
+ onScroll: handleOnScroll,
81
+ children
82
+ })
83
+ ]
84
+ });
70
85
  };
71
86
  //# sourceMappingURL=Carousel.js.map
@@ -2,6 +2,6 @@
2
2
  "version": 3,
3
3
  "sources": ["../../../../src/parts/carousel/Carousel.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
4
4
  "sourcesContent": ["import { useContext } from 'react';\nimport { DSIconSizes } from '@elliemae/ds-icon';\nimport { BUTTON_TYPES } from '@elliemae/ds-button';\nimport { ChevronRight, ChevronLeft } from '@elliemae/ds-icons';\nimport { StyledCarouselBtn, StyledCarouselButtonWrapper, StyledCarouselWrapper, StyledChildrenWrap } from './styles';\nimport { useCarousel } from './useCarousel';\nimport { DSTabsContext } from '../../DSTabsCTX';\nimport { DSTabsDatatestid } from '../../DSTabsDatatestid';\n\ninterface CarouselPropsT {\n children: React.ReactNode[];\n updateIndicatorStyle?: () => void;\n}\n\nexport const Carousel = ({ children, updateIndicatorStyle }: CarouselPropsT): JSX.Element => {\n const { showChevrons, leftButtonOnClick, rightButtonOnClick, handleOnClick, handleOnScroll } = useCarousel({\n updateIndicatorStyle,\n });\n\n const {\n carouselOnlyListRef,\n props: { type },\n } = useContext(DSTabsContext);\n\n return (\n <StyledCarouselWrapper>\n {showChevrons.left && (\n <StyledCarouselButtonWrapper tabType={type}>\n <StyledCarouselBtn\n size=\"s\"\n onClick={leftButtonOnClick}\n tabIndex={-1}\n data-testid={DSTabsDatatestid.CAROUSEL.BUTTON_LEFT}\n buttonType={BUTTON_TYPES.ICON}\n >\n <ChevronLeft size={DSIconSizes.S} />\n </StyledCarouselBtn>\n </StyledCarouselButtonWrapper>\n )}\n {showChevrons.right && (\n <StyledCarouselButtonWrapper tabType={type} right={showChevrons.right}>\n <StyledCarouselBtn\n size=\"s\"\n onClick={rightButtonOnClick}\n tabIndex={-1}\n data-testid={DSTabsDatatestid.CAROUSEL.BUTTON_RIGHT}\n buttonType={BUTTON_TYPES.ICON}\n >\n <ChevronRight size={DSIconSizes.S} />\n </StyledCarouselBtn>\n </StyledCarouselButtonWrapper>\n )}\n <StyledChildrenWrap ref={carouselOnlyListRef} onClick={handleOnClick} onScroll={handleOnScroll}>\n {children}\n </StyledChildrenWrap>\n </StyledCarouselWrapper>\n );\n};\n", "import * as React from 'react';\nexport { React };\n"],
5
- "mappings": ";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAA2B;AAC3B,qBAA4B;AAC5B,uBAA6B;AAC7B,sBAA0C;AAC1C,oBAA0G;AAC1G,yBAA4B;AAC5B,uBAA8B;AAC9B,8BAAiC;AAO1B,MAAM,WAAW,CAAC,EAAE,UAAU,2BAAwD;AAC3F,QAAM,EAAE,cAAc,mBAAmB,oBAAoB,eAAe,mBAAmB,oCAAY;AAAA,IACzG;AAAA,EACF,CAAC;AAED,QAAM;AAAA,IACJ;AAAA,IACA,OAAO,EAAE;AAAA,MACP,6BAAW,8BAAa;AAE5B,SACE,oCAAC,2CACE,aAAa,QACZ,oCAAC;AAAA,IAA4B,SAAS;AAAA,KACpC,oCAAC;AAAA,IACC,MAAK;AAAA,IACL,SAAS;AAAA,IACT,UAAU;AAAA,IACV,eAAa,yCAAiB,SAAS;AAAA,IACvC,YAAY,8BAAa;AAAA,KAEzB,oCAAC;AAAA,IAAY,MAAM,2BAAY;AAAA,GAAG,CACpC,CACF,GAED,aAAa,SACZ,oCAAC;AAAA,IAA4B,SAAS;AAAA,IAAM,OAAO,aAAa;AAAA,KAC9D,oCAAC;AAAA,IACC,MAAK;AAAA,IACL,SAAS;AAAA,IACT,UAAU;AAAA,IACV,eAAa,yCAAiB,SAAS;AAAA,IACvC,YAAY,8BAAa;AAAA,KAEzB,oCAAC;AAAA,IAAa,MAAM,2BAAY;AAAA,GAAG,CACrC,CACF,GAEF,oCAAC;AAAA,IAAmB,KAAK;AAAA,IAAqB,SAAS;AAAA,IAAe,UAAU;AAAA,KAC7E,QACH,CACF;AAEJ;",
5
+ "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB;AAAA,mBAA2B;AAC3B,qBAA4B;AAC5B,uBAA6B;AAC7B,sBAA0C;AAC1C,oBAA0G;AAC1G,yBAA4B;AAC5B,uBAA8B;AAC9B,8BAAiC;AAO1B,MAAM,WAAW,CAAC,EAAE,UAAU,qBAAqB,MAAmC;AAC3F,QAAM,EAAE,cAAc,mBAAmB,oBAAoB,eAAe,eAAe,QAAI,gCAAY;AAAA,IACzG;AAAA,EACF,CAAC;AAED,QAAM;AAAA,IACJ;AAAA,IACA,OAAO,EAAE,KAAK;AAAA,EAChB,QAAI,yBAAW,8BAAa;AAE5B,SACE,6CAAC;AAAA,IACE;AAAA,mBAAa,QACZ,4CAAC;AAAA,QAA4B,SAAS;AAAA,QACpC,sDAAC;AAAA,UACC,MAAK;AAAA,UACL,SAAS;AAAA,UACT,UAAU;AAAA,UACV,eAAa,yCAAiB,SAAS;AAAA,UACvC,YAAY,8BAAa;AAAA,UAEzB,sDAAC;AAAA,YAAY,MAAM,2BAAY;AAAA,WAAG;AAAA,SACpC;AAAA,OACF;AAAA,MAED,aAAa,SACZ,4CAAC;AAAA,QAA4B,SAAS;AAAA,QAAM,OAAO,aAAa;AAAA,QAC9D,sDAAC;AAAA,UACC,MAAK;AAAA,UACL,SAAS;AAAA,UACT,UAAU;AAAA,UACV,eAAa,yCAAiB,SAAS;AAAA,UACvC,YAAY,8BAAa;AAAA,UAEzB,sDAAC;AAAA,YAAa,MAAM,2BAAY;AAAA,WAAG;AAAA,SACrC;AAAA,OACF;AAAA,MAEF,4CAAC;AAAA,QAAmB,KAAK;AAAA,QAAqB,SAAS;AAAA,QAAe,UAAU;AAAA,QAC7E;AAAA,OACH;AAAA;AAAA,GACF;AAEJ;",
6
6
  "names": []
7
7
  }
@@ -17,7 +17,10 @@ var __copyProps = (to, from, except, desc) => {
17
17
  }
18
18
  return to;
19
19
  };
20
- 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));
20
+ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
21
+ isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
22
+ mod
23
+ ));
21
24
  var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
22
25
  var styles_exports = {};
23
26
  __export(styles_exports, {
@@ -2,6 +2,6 @@
2
2
  "version": 3,
3
3
  "sources": ["../../../../src/parts/carousel/styles.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
4
4
  "sourcesContent": ["import { styled } from '@elliemae/ds-system';\nimport { DSButtonV2 } from '@elliemae/ds-button';\nimport { TabTypes } from '../../utils/constants';\nimport type { DSTabsInternalsT } from '../../sharedTypes';\n\ninterface StyledCarouselButtonWrapperPropsT {\n right?: boolean;\n tabType: DSTabsInternalsT.TabTypesT;\n}\n\nexport const StyledCarouselBtn = styled(DSButtonV2)`\n margin: 0;\n min-width: ${({ theme }) => theme.space.xs};\n width: ${({ theme }) => theme.space.xs};\n\n &:hover:not(:disabled) {\n background-color: transparent;\n }\n background-color: transparent;\n border-radius: 0px;\n\n & .em-ds-icon svg {\n fill: ${({ theme }) => theme.colors.brand[600]};\n }\n`;\n\nexport const StyledCarouselWrapper = styled.span`\n position: relative;\n width: 100%;\n display: flex;\n`;\n\nexport const StyledChildrenWrap = styled.div`\n display: flex;\n flex-wrap: nowrap;\n flex: 1;\n overflow-x: hidden;\n`;\n\nexport const StyledCarouselButtonWrapper = styled.div<StyledCarouselButtonWrapperPropsT>`\n max-width: 16px;\n position: absolute;\n z-index: 200;\n ${({ right }) => (right ? 'right: 0;' : `left: 0;`)}\n width: 16px;\n height: ${({ tabType }) => (tabType === TabTypes.NORMAL ? '32px' : '22px')};\n padding-top: ${({ tabType }) => (tabType === TabTypes.NORMAL ? '5px' : '0px')};\n background: white;\n ${({ theme, tabType }) =>\n tabType === TabTypes.NORMAL\n ? `\n background: linear-gradient(to bottom, white 0px, white 30px, ${theme.colors.neutral[400]} 30px, ${theme.colors.neutral[400]} 31px, white 31px , white 32px );\n `\n : ``};\n`;\n", "import * as React from 'react';\nexport { React };\n"],
5
- "mappings": ";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,uBAAuB;AACvB,uBAA2B;AAC3B,uBAAyB;AAQlB,MAAM,oBAAoB,6BAAO,2BAAU;AAAA;AAAA,eAEnC,CAAC,EAAE,YAAY,MAAM,MAAM;AAAA,WAC/B,CAAC,EAAE,YAAY,MAAM,MAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,YAS1B,CAAC,EAAE,YAAY,MAAM,OAAO,MAAM;AAAA;AAAA;AAIvC,MAAM,wBAAwB,wBAAO;AAAA;AAAA;AAAA;AAAA;AAMrC,MAAM,qBAAqB,wBAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAOlC,MAAM,8BAA8B,wBAAO;AAAA;AAAA;AAAA;AAAA,IAI9C,CAAC,EAAE,YAAa,QAAQ,cAAc;AAAA;AAAA,YAE9B,CAAC,EAAE,cAAe,YAAY,0BAAS,SAAS,SAAS;AAAA,iBACpD,CAAC,EAAE,cAAe,YAAY,0BAAS,SAAS,QAAQ;AAAA;AAAA,IAErE,CAAC,EAAE,OAAO,cACV,YAAY,0BAAS,SACjB;AAAA,sEAC8D,MAAM,OAAO,QAAQ,cAAc,MAAM,OAAO,QAAQ;AAAA,KAEtH;AAAA;",
5
+ "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,uBAAuB;AACvB,uBAA2B;AAC3B,uBAAyB;AAQlB,MAAM,wBAAoB,yBAAO,2BAAU;AAAA;AAAA,eAEnC,CAAC,EAAE,MAAM,MAAM,MAAM,MAAM;AAAA,WAC/B,CAAC,EAAE,MAAM,MAAM,MAAM,MAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,YAS1B,CAAC,EAAE,MAAM,MAAM,MAAM,OAAO,MAAM;AAAA;AAAA;AAIvC,MAAM,wBAAwB,wBAAO;AAAA;AAAA;AAAA;AAAA;AAMrC,MAAM,qBAAqB,wBAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAOlC,MAAM,8BAA8B,wBAAO;AAAA;AAAA;AAAA;AAAA,IAI9C,CAAC,EAAE,MAAM,MAAO,QAAQ,cAAc;AAAA;AAAA,YAE9B,CAAC,EAAE,QAAQ,MAAO,YAAY,0BAAS,SAAS,SAAS;AAAA,iBACpD,CAAC,EAAE,QAAQ,MAAO,YAAY,0BAAS,SAAS,QAAQ;AAAA;AAAA,IAErE,CAAC,EAAE,OAAO,QAAQ,MAClB,YAAY,0BAAS,SACjB;AAAA,sEAC8D,MAAM,OAAO,QAAQ,cAAc,MAAM,OAAO,QAAQ;AAAA,KAEtH;AAAA;",
6
6
  "names": []
7
7
  }
@@ -17,7 +17,10 @@ var __copyProps = (to, from, except, desc) => {
17
17
  }
18
18
  return to;
19
19
  };
20
- 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));
20
+ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
21
+ isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
22
+ mod
23
+ ));
21
24
  var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
22
25
  var useCarousel_exports = {};
23
26
  __export(useCarousel_exports, {
@@ -37,8 +40,14 @@ const useCarousel = ({ updateIndicatorStyle }) => {
37
40
  left: false
38
41
  });
39
42
  const { tabsRefAsArray } = (0, import_react.useContext)(import_DSTabsCTX.DSTabsContext);
40
- const shouldShowLeft = (0, import_react.useCallback)(() => carouselOnlyListRef.current ? carouselOnlyListRef.current.scrollLeft > 0 : false, [carouselOnlyListRef]);
41
- const shouldShowRight = (0, import_react.useCallback)(() => carouselOnlyListRef.current ? carouselOnlyListRef.current.scrollLeft < carouselOnlyListRef.current.scrollWidth - carouselOnlyListRef.current.clientWidth : false, [carouselOnlyListRef]);
43
+ const shouldShowLeft = (0, import_react.useCallback)(
44
+ () => carouselOnlyListRef.current ? carouselOnlyListRef.current.scrollLeft > 0 : false,
45
+ [carouselOnlyListRef]
46
+ );
47
+ const shouldShowRight = (0, import_react.useCallback)(
48
+ () => carouselOnlyListRef.current ? carouselOnlyListRef.current.scrollLeft < carouselOnlyListRef.current.scrollWidth - carouselOnlyListRef.current.clientWidth : false,
49
+ [carouselOnlyListRef]
50
+ );
42
51
  const recalcChevrons = (0, import_react.useCallback)(() => {
43
52
  setShowChevrons({ right: shouldShowRight(), left: shouldShowLeft() });
44
53
  }, [shouldShowLeft, shouldShowRight]);
@@ -2,6 +2,6 @@
2
2
  "version": 3,
3
3
  "sources": ["../../../../src/parts/carousel/useCarousel.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
4
4
  "sourcesContent": ["import { useCallback, useState, useContext } from 'react';\nimport useResizeObserver from '@react-hook/resize-observer';\nimport { DSTabsContext } from '../../DSTabsCTX';\nimport { isElementVisibleCarousel } from '../../utils/helpers';\nimport { useCarouselCallbacks } from './useCarouselCallbacks';\nimport type { DSTabsInternalsT } from '../../sharedTypes';\n\ninterface UseCarouselPropsT {\n updateIndicatorStyle?: () => void;\n}\n\ninterface UseCarouselReturnTypeT {\n showChevrons: DSTabsInternalsT.ShowChevronsT;\n leftButtonOnClick: () => void;\n rightButtonOnClick: () => void;\n handleOnClick: (e: React.MouseEvent) => void;\n handleOnScroll: (e: React.UIEvent) => void;\n}\n\nexport const useCarousel = ({ updateIndicatorStyle }: UseCarouselPropsT): UseCarouselReturnTypeT => {\n const { carouselOnlyListRef } = useContext(DSTabsContext);\n\n const [showChevrons, setShowChevrons] = useState<DSTabsInternalsT.ShowChevronsT>({\n right: false,\n left: false,\n });\n\n const { tabsRefAsArray } = useContext(DSTabsContext);\n\n const shouldShowLeft = useCallback(\n () => (carouselOnlyListRef.current ? carouselOnlyListRef.current.scrollLeft > 0 : false),\n\n [carouselOnlyListRef],\n );\n\n const shouldShowRight = useCallback(\n () =>\n carouselOnlyListRef.current\n ? carouselOnlyListRef.current.scrollLeft <\n carouselOnlyListRef.current.scrollWidth - carouselOnlyListRef.current.clientWidth\n : false,\n [carouselOnlyListRef],\n );\n\n const recalcChevrons = useCallback(() => {\n setShowChevrons({ right: shouldShowRight(), left: shouldShowLeft() });\n }, [shouldShowLeft, shouldShowRight]);\n\n const getVisibleItemsOffset = useCallback(() => {\n if (tabsRefAsArray.current) {\n const scroll = tabsRefAsArray.current.reduce((acc, c) => {\n if (isElementVisibleCarousel(c, carouselOnlyListRef.current)) {\n const styles = window.getComputedStyle(c);\n const width = c.clientWidth;\n const margin = parseFloat(styles.marginLeft) + parseFloat(styles.marginRight);\n\n return acc + (width + margin);\n }\n return acc;\n }, 0);\n\n return scroll - 16;\n }\n return 0;\n }, [tabsRefAsArray, carouselOnlyListRef]);\n\n useResizeObserver(carouselOnlyListRef, recalcChevrons);\n\n const { leftButtonOnClick, rightButtonOnClick, handleOnClick, handleOnScroll } = useCarouselCallbacks({\n getVisibleItemsOffset,\n recalcChevrons,\n updateIndicatorStyle,\n });\n\n return {\n showChevrons,\n leftButtonOnClick,\n rightButtonOnClick,\n handleOnClick,\n handleOnScroll,\n };\n};\n", "import * as React from 'react';\nexport { React };\n"],
5
- "mappings": ";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAkD;AAClD,6BAA8B;AAC9B,uBAA8B;AAC9B,qBAAyC;AACzC,kCAAqC;AAe9B,MAAM,cAAc,CAAC,EAAE,2BAAsE;AAClG,QAAM,EAAE,wBAAwB,6BAAW,8BAAa;AAExD,QAAM,CAAC,cAAc,mBAAmB,2BAAyC;AAAA,IAC/E,OAAO;AAAA,IACP,MAAM;AAAA,EACR,CAAC;AAED,QAAM,EAAE,mBAAmB,6BAAW,8BAAa;AAEnD,QAAM,iBAAiB,8BACrB,MAAO,oBAAoB,UAAU,oBAAoB,QAAQ,aAAa,IAAI,OAElF,CAAC,mBAAmB,CACtB;AAEA,QAAM,kBAAkB,8BACtB,MACE,oBAAoB,UAChB,oBAAoB,QAAQ,aAC5B,oBAAoB,QAAQ,cAAc,oBAAoB,QAAQ,cACtE,OACN,CAAC,mBAAmB,CACtB;AAEA,QAAM,iBAAiB,8BAAY,MAAM;AACvC,oBAAgB,EAAE,OAAO,gBAAgB,GAAG,MAAM,eAAe,EAAE,CAAC;AAAA,EACtE,GAAG,CAAC,gBAAgB,eAAe,CAAC;AAEpC,QAAM,wBAAwB,8BAAY,MAAM;AAC9C,QAAI,eAAe,SAAS;AAC1B,YAAM,SAAS,eAAe,QAAQ,OAAO,CAAC,KAAK,MAAM;AACvD,YAAI,6CAAyB,GAAG,oBAAoB,OAAO,GAAG;AAC5D,gBAAM,SAAS,OAAO,iBAAiB,CAAC;AACxC,gBAAM,QAAQ,EAAE;AAChB,gBAAM,SAAS,WAAW,OAAO,UAAU,IAAI,WAAW,OAAO,WAAW;AAE5E,iBAAO,MAAO,SAAQ;AAAA,QACxB;AACA,eAAO;AAAA,MACT,GAAG,CAAC;AAEJ,aAAO,SAAS;AAAA,IAClB;AACA,WAAO;AAAA,EACT,GAAG,CAAC,gBAAgB,mBAAmB,CAAC;AAExC,sCAAkB,qBAAqB,cAAc;AAErD,QAAM,EAAE,mBAAmB,oBAAoB,eAAe,mBAAmB,sDAAqB;AAAA,IACpG;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AAED,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF;AACF;",
6
- "names": []
5
+ "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAkD;AAClD,6BAA8B;AAC9B,uBAA8B;AAC9B,qBAAyC;AACzC,kCAAqC;AAe9B,MAAM,cAAc,CAAC,EAAE,qBAAqB,MAAiD;AAClG,QAAM,EAAE,oBAAoB,QAAI,yBAAW,8BAAa;AAExD,QAAM,CAAC,cAAc,eAAe,QAAI,uBAAyC;AAAA,IAC/E,OAAO;AAAA,IACP,MAAM;AAAA,EACR,CAAC;AAED,QAAM,EAAE,eAAe,QAAI,yBAAW,8BAAa;AAEnD,QAAM,qBAAiB;AAAA,IACrB,MAAO,oBAAoB,UAAU,oBAAoB,QAAQ,aAAa,IAAI;AAAA,IAElF,CAAC,mBAAmB;AAAA,EACtB;AAEA,QAAM,sBAAkB;AAAA,IACtB,MACE,oBAAoB,UAChB,oBAAoB,QAAQ,aAC5B,oBAAoB,QAAQ,cAAc,oBAAoB,QAAQ,cACtE;AAAA,IACN,CAAC,mBAAmB;AAAA,EACtB;AAEA,QAAM,qBAAiB,0BAAY,MAAM;AACvC,oBAAgB,EAAE,OAAO,gBAAgB,GAAG,MAAM,eAAe,EAAE,CAAC;AAAA,EACtE,GAAG,CAAC,gBAAgB,eAAe,CAAC;AAEpC,QAAM,4BAAwB,0BAAY,MAAM;AAC9C,QAAI,eAAe,SAAS;AAC1B,YAAM,SAAS,eAAe,QAAQ,OAAO,CAAC,KAAK,MAAM;AACvD,gBAAI,yCAAyB,GAAG,oBAAoB,OAAO,GAAG;AAC5D,gBAAM,SAAS,OAAO,iBAAiB,CAAC;AACxC,gBAAM,QAAQ,EAAE;AAChB,gBAAM,SAAS,WAAW,OAAO,UAAU,IAAI,WAAW,OAAO,WAAW;AAE5E,iBAAO,OAAO,QAAQ;AAAA,QACxB;AACA,eAAO;AAAA,MACT,GAAG,CAAC;AAEJ,aAAO,SAAS;AAAA,IAClB;AACA,WAAO;AAAA,EACT,GAAG,CAAC,gBAAgB,mBAAmB,CAAC;AAExC,6BAAAA,SAAkB,qBAAqB,cAAc;AAErD,QAAM,EAAE,mBAAmB,oBAAoB,eAAe,eAAe,QAAI,kDAAqB;AAAA,IACpG;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AAED,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF;AACF;",
6
+ "names": ["useResizeObserver"]
7
7
  }
@@ -17,7 +17,10 @@ var __copyProps = (to, from, except, desc) => {
17
17
  }
18
18
  return to;
19
19
  };
20
- 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));
20
+ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
21
+ isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
22
+ mod
23
+ ));
21
24
  var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
22
25
  var useCarouselCallbacks_exports = {};
23
26
  __export(useCarouselCallbacks_exports, {
@@ -49,30 +52,33 @@ const useCarouselCallbacks = ({
49
52
  if (updateIndicatorStyle)
50
53
  updateIndicatorStyle();
51
54
  }, [recalcChevrons, updateIndicatorStyle]);
52
- const handleOnClick = (0, import_react.useCallback)(({ target }) => {
53
- if (focusableTabsRef.current && target.getAttribute("role") === "tab") {
54
- const tabList = carouselOnlyListRef.current;
55
- const tabButton = target;
56
- const tabButtonDimensions = tabButton.getBoundingClientRect();
57
- const tabListDimensions = tabList?.getBoundingClientRect();
58
- const tabButtonIndex = tabButton.dataset.index;
59
- const lastItemIndex = focusableTabsRef.current.length.toString();
60
- const magicNumber = 34;
61
- const firstOrLastItem = tabButtonIndex === "0" || tabButtonIndex === lastItemIndex;
62
- if (!(0, import_helpers.isElementVisibleCarousel)(tabButton, tabList, firstOrLastItem) && tabListDimensions && carouselOnlyListRef.current) {
63
- const containerWidth = tabListDimensions.width;
64
- const halfContainer = containerWidth / 2;
65
- const elementScrollPosition = tabButtonDimensions.left - tabListDimensions.left;
66
- const positionInContainer = elementScrollPosition % containerWidth;
67
- const width = tabButton.offsetWidth + magicNumber;
68
- if (positionInContainer > halfContainer) {
69
- carouselOnlyListRef.current.scrollLeft += width + positionInContainer - containerWidth;
70
- } else {
71
- carouselOnlyListRef.current.scrollLeft += positionInContainer - magicNumber;
55
+ const handleOnClick = (0, import_react.useCallback)(
56
+ ({ target }) => {
57
+ if (focusableTabsRef.current && target.getAttribute("role") === "tab") {
58
+ const tabList = carouselOnlyListRef.current;
59
+ const tabButton = target;
60
+ const tabButtonDimensions = tabButton.getBoundingClientRect();
61
+ const tabListDimensions = tabList?.getBoundingClientRect();
62
+ const tabButtonIndex = tabButton.dataset.index;
63
+ const lastItemIndex = focusableTabsRef.current.length.toString();
64
+ const magicNumber = 34;
65
+ const firstOrLastItem = tabButtonIndex === "0" || tabButtonIndex === lastItemIndex;
66
+ if (!(0, import_helpers.isElementVisibleCarousel)(tabButton, tabList, firstOrLastItem) && tabListDimensions && carouselOnlyListRef.current) {
67
+ const containerWidth = tabListDimensions.width;
68
+ const halfContainer = containerWidth / 2;
69
+ const elementScrollPosition = tabButtonDimensions.left - tabListDimensions.left;
70
+ const positionInContainer = elementScrollPosition % containerWidth;
71
+ const width = tabButton.offsetWidth + magicNumber;
72
+ if (positionInContainer > halfContainer) {
73
+ carouselOnlyListRef.current.scrollLeft += width + positionInContainer - containerWidth;
74
+ } else {
75
+ carouselOnlyListRef.current.scrollLeft += positionInContainer - magicNumber;
76
+ }
72
77
  }
73
78
  }
74
- }
75
- }, [focusableTabsRef, carouselOnlyListRef]);
79
+ },
80
+ [focusableTabsRef, carouselOnlyListRef]
81
+ );
76
82
  return {
77
83
  handleOnClick,
78
84
  rightButtonOnClick,
@@ -2,6 +2,6 @@
2
2
  "version": 3,
3
3
  "sources": ["../../../../src/parts/carousel/useCarouselCallbacks.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
4
4
  "sourcesContent": ["/* eslint-disable max-statements */\nimport { useCallback, useContext } from 'react';\nimport type { MouseEvent } from 'react';\nimport { isElementVisibleCarousel } from '../../utils/helpers';\nimport { DSTabsContext } from '../../DSTabsCTX';\n\ninterface UseCarouselCallbacksPropsT {\n getVisibleItemsOffset: () => number;\n recalcChevrons: () => void;\n updateIndicatorStyle?: () => void;\n}\ninterface UseCarouselCallbacksReturnTypeT {\n leftButtonOnClick: () => void;\n rightButtonOnClick: () => void;\n handleOnClick: (e: React.MouseEvent) => void;\n handleOnScroll: (e: React.UIEvent) => void;\n}\n\nexport const useCarouselCallbacks = ({\n getVisibleItemsOffset,\n updateIndicatorStyle,\n recalcChevrons,\n}: UseCarouselCallbacksPropsT): UseCarouselCallbacksReturnTypeT => {\n const { focusableTabsRef, carouselOnlyListRef } = useContext(DSTabsContext);\n\n const rightButtonOnClick = useCallback(() => {\n if (carouselOnlyListRef.current) {\n carouselOnlyListRef.current.scrollLeft += getVisibleItemsOffset();\n }\n }, [getVisibleItemsOffset, carouselOnlyListRef]);\n\n const leftButtonOnClick = useCallback(() => {\n if (carouselOnlyListRef.current) {\n carouselOnlyListRef.current.scrollLeft -= getVisibleItemsOffset();\n }\n }, [getVisibleItemsOffset, carouselOnlyListRef]);\n\n const handleOnScroll = useCallback(() => {\n recalcChevrons();\n if (updateIndicatorStyle) updateIndicatorStyle();\n }, [recalcChevrons, updateIndicatorStyle]);\n\n const handleOnClick = useCallback(\n ({ target }: MouseEvent) => {\n if (focusableTabsRef.current && (target as HTMLButtonElement).getAttribute('role') === 'tab') {\n const tabList = carouselOnlyListRef.current;\n const tabButton = target as HTMLButtonElement;\n const tabButtonDimensions = tabButton.getBoundingClientRect();\n const tabListDimensions = tabList?.getBoundingClientRect();\n const tabButtonIndex = tabButton.dataset.index as string;\n const lastItemIndex = focusableTabsRef.current.length.toString();\n const magicNumber = 34;\n\n const firstOrLastItem = tabButtonIndex === '0' || tabButtonIndex === lastItemIndex;\n\n if (\n !isElementVisibleCarousel(tabButton, tabList, firstOrLastItem) &&\n tabListDimensions &&\n carouselOnlyListRef.current\n ) {\n const containerWidth = tabListDimensions.width;\n const halfContainer = containerWidth / 2;\n const elementScrollPosition = tabButtonDimensions.left - tabListDimensions.left;\n const positionInContainer = elementScrollPosition % containerWidth;\n const width = tabButton.offsetWidth + magicNumber;\n\n if (positionInContainer > halfContainer) {\n carouselOnlyListRef.current.scrollLeft += width + positionInContainer - containerWidth;\n } else {\n carouselOnlyListRef.current.scrollLeft += positionInContainer - magicNumber;\n }\n }\n }\n },\n [focusableTabsRef, carouselOnlyListRef],\n );\n\n return {\n handleOnClick,\n rightButtonOnClick,\n leftButtonOnClick,\n handleOnScroll,\n };\n};\n", "import * as React from 'react';\nexport { React };\n"],
5
- "mappings": ";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADCvB,mBAAwC;AAExC,qBAAyC;AACzC,uBAA8B;AAcvB,MAAM,uBAAuB,CAAC;AAAA,EACnC;AAAA,EACA;AAAA,EACA;AAAA,MACiE;AACjE,QAAM,EAAE,kBAAkB,wBAAwB,6BAAW,8BAAa;AAE1E,QAAM,qBAAqB,8BAAY,MAAM;AAC3C,QAAI,oBAAoB,SAAS;AAC/B,0BAAoB,QAAQ,cAAc,sBAAsB;AAAA,IAClE;AAAA,EACF,GAAG,CAAC,uBAAuB,mBAAmB,CAAC;AAE/C,QAAM,oBAAoB,8BAAY,MAAM;AAC1C,QAAI,oBAAoB,SAAS;AAC/B,0BAAoB,QAAQ,cAAc,sBAAsB;AAAA,IAClE;AAAA,EACF,GAAG,CAAC,uBAAuB,mBAAmB,CAAC;AAE/C,QAAM,iBAAiB,8BAAY,MAAM;AACvC,mBAAe;AACf,QAAI;AAAsB,2BAAqB;AAAA,EACjD,GAAG,CAAC,gBAAgB,oBAAoB,CAAC;AAEzC,QAAM,gBAAgB,8BACpB,CAAC,EAAE,aAAyB;AAC1B,QAAI,iBAAiB,WAAY,OAA6B,aAAa,MAAM,MAAM,OAAO;AAC5F,YAAM,UAAU,oBAAoB;AACpC,YAAM,YAAY;AAClB,YAAM,sBAAsB,UAAU,sBAAsB;AAC5D,YAAM,oBAAoB,SAAS,sBAAsB;AACzD,YAAM,iBAAiB,UAAU,QAAQ;AACzC,YAAM,gBAAgB,iBAAiB,QAAQ,OAAO,SAAS;AAC/D,YAAM,cAAc;AAEpB,YAAM,kBAAkB,mBAAmB,OAAO,mBAAmB;AAErE,UACE,CAAC,6CAAyB,WAAW,SAAS,eAAe,KAC7D,qBACA,oBAAoB,SACpB;AACA,cAAM,iBAAiB,kBAAkB;AACzC,cAAM,gBAAgB,iBAAiB;AACvC,cAAM,wBAAwB,oBAAoB,OAAO,kBAAkB;AAC3E,cAAM,sBAAsB,wBAAwB;AACpD,cAAM,QAAQ,UAAU,cAAc;AAEtC,YAAI,sBAAsB,eAAe;AACvC,8BAAoB,QAAQ,cAAc,QAAQ,sBAAsB;AAAA,QAC1E,OAAO;AACL,8BAAoB,QAAQ,cAAc,sBAAsB;AAAA,QAClE;AAAA,MACF;AAAA,IACF;AAAA,EACF,GACA,CAAC,kBAAkB,mBAAmB,CACxC;AAEA,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF;AACF;",
5
+ "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADCvB,mBAAwC;AAExC,qBAAyC;AACzC,uBAA8B;AAcvB,MAAM,uBAAuB,CAAC;AAAA,EACnC;AAAA,EACA;AAAA,EACA;AACF,MAAmE;AACjE,QAAM,EAAE,kBAAkB,oBAAoB,QAAI,yBAAW,8BAAa;AAE1E,QAAM,yBAAqB,0BAAY,MAAM;AAC3C,QAAI,oBAAoB,SAAS;AAC/B,0BAAoB,QAAQ,cAAc,sBAAsB;AAAA,IAClE;AAAA,EACF,GAAG,CAAC,uBAAuB,mBAAmB,CAAC;AAE/C,QAAM,wBAAoB,0BAAY,MAAM;AAC1C,QAAI,oBAAoB,SAAS;AAC/B,0BAAoB,QAAQ,cAAc,sBAAsB;AAAA,IAClE;AAAA,EACF,GAAG,CAAC,uBAAuB,mBAAmB,CAAC;AAE/C,QAAM,qBAAiB,0BAAY,MAAM;AACvC,mBAAe;AACf,QAAI;AAAsB,2BAAqB;AAAA,EACjD,GAAG,CAAC,gBAAgB,oBAAoB,CAAC;AAEzC,QAAM,oBAAgB;AAAA,IACpB,CAAC,EAAE,OAAO,MAAkB;AAC1B,UAAI,iBAAiB,WAAY,OAA6B,aAAa,MAAM,MAAM,OAAO;AAC5F,cAAM,UAAU,oBAAoB;AACpC,cAAM,YAAY;AAClB,cAAM,sBAAsB,UAAU,sBAAsB;AAC5D,cAAM,oBAAoB,SAAS,sBAAsB;AACzD,cAAM,iBAAiB,UAAU,QAAQ;AACzC,cAAM,gBAAgB,iBAAiB,QAAQ,OAAO,SAAS;AAC/D,cAAM,cAAc;AAEpB,cAAM,kBAAkB,mBAAmB,OAAO,mBAAmB;AAErE,YACE,KAAC,yCAAyB,WAAW,SAAS,eAAe,KAC7D,qBACA,oBAAoB,SACpB;AACA,gBAAM,iBAAiB,kBAAkB;AACzC,gBAAM,gBAAgB,iBAAiB;AACvC,gBAAM,wBAAwB,oBAAoB,OAAO,kBAAkB;AAC3E,gBAAM,sBAAsB,wBAAwB;AACpD,gBAAM,QAAQ,UAAU,cAAc;AAEtC,cAAI,sBAAsB,eAAe;AACvC,gCAAoB,QAAQ,cAAc,QAAQ,sBAAsB;AAAA,UAC1E,OAAO;AACL,gCAAoB,QAAQ,cAAc,sBAAsB;AAAA,UAClE;AAAA,QACF;AAAA,MACF;AAAA,IACF;AAAA,IACA,CAAC,kBAAkB,mBAAmB;AAAA,EACxC;AAEA,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF;AACF;",
6
6
  "names": []
7
7
  }