@fluentui/react-carousel 9.7.1 → 9.7.2

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.
package/CHANGELOG.md CHANGED
@@ -1,12 +1,29 @@
1
1
  # Change Log - @fluentui/react-carousel
2
2
 
3
- This log was last generated on Fri, 13 Jun 2025 12:30:21 GMT and should not be manually modified.
3
+ This log was last generated on Wed, 18 Jun 2025 17:29:28 GMT and should not be manually modified.
4
4
 
5
5
  <!-- Start content -->
6
6
 
7
+ ## [9.7.2](https://github.com/microsoft/fluentui/tree/@fluentui/react-carousel_v9.7.2)
8
+
9
+ Wed, 18 Jun 2025 17:29:28 GMT
10
+ [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-carousel_v9.7.1..@fluentui/react-carousel_v9.7.2)
11
+
12
+ ### Patches
13
+
14
+ - fix: Ensure documentDownListener is removed on unmount ([PR #34661](https://github.com/microsoft/fluentui/pull/34661) by mifraser@microsoft.com)
15
+ - Bump @fluentui/react-aria to v9.15.1 ([PR #34675](https://github.com/microsoft/fluentui/pull/34675) by beachball)
16
+ - Bump @fluentui/react-button to v9.5.1 ([PR #34675](https://github.com/microsoft/fluentui/pull/34675) by beachball)
17
+ - Bump @fluentui/react-context-selector to v9.2.1 ([PR #34675](https://github.com/microsoft/fluentui/pull/34675) by beachball)
18
+ - Bump @fluentui/react-tooltip to v9.7.2 ([PR #34675](https://github.com/microsoft/fluentui/pull/34675) by beachball)
19
+ - Bump @fluentui/react-jsx-runtime to v9.1.1 ([PR #34675](https://github.com/microsoft/fluentui/pull/34675) by beachball)
20
+ - Bump @fluentui/react-shared-contexts to v9.24.0 ([PR #34675](https://github.com/microsoft/fluentui/pull/34675) by beachball)
21
+ - Bump @fluentui/react-tabster to v9.25.1 ([PR #34675](https://github.com/microsoft/fluentui/pull/34675) by beachball)
22
+ - Bump @fluentui/react-utilities to v9.21.1 ([PR #34675](https://github.com/microsoft/fluentui/pull/34675) by beachball)
23
+
7
24
  ## [9.7.1](https://github.com/microsoft/fluentui/tree/@fluentui/react-carousel_v9.7.1)
8
25
 
9
- Fri, 13 Jun 2025 12:30:21 GMT
26
+ Fri, 13 Jun 2025 12:32:53 GMT
10
27
  [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-carousel_v9.7.0..@fluentui/react-carousel_v9.7.1)
11
28
 
12
29
  ### Patches
@@ -2,21 +2,28 @@ import { carouselClassNames } from '../Carousel';
2
2
  export function pointerEventPlugin(options) {
3
3
  let emblaApi;
4
4
  let pointerEvent;
5
- function documentDownListener(event) {
6
- const targetDocument = emblaApi.containerNode().ownerDocument;
5
+ let carouselListenerTarget;
6
+ /**
7
+ * Heads up!
8
+ *
9
+ * We don't use `emblaApi.on('pointerDown', ...)` as the callback does not provide the event.
10
+ */ function documentDownListener(event) {
7
11
  if (event.target) {
8
12
  const targetNode = event.target;
9
- if (targetNode.classList.contains(carouselClassNames.root) || emblaApi.containerNode().contains(targetNode)) {
13
+ if (targetNode.classList.contains(carouselClassNames.root) || (carouselListenerTarget === null || carouselListenerTarget === void 0 ? void 0 : carouselListenerTarget.contains(targetNode))) {
10
14
  pointerEvent = event;
11
15
  }
12
16
  }
13
- targetDocument.removeEventListener('mousedown', documentDownListener);
14
- targetDocument.removeEventListener('pointerdown', documentDownListener);
17
+ if (carouselListenerTarget) {
18
+ carouselListenerTarget.removeEventListener('mousedown', documentDownListener);
19
+ carouselListenerTarget.removeEventListener('pointerdown', documentDownListener);
20
+ }
15
21
  }
16
22
  function pointerUpListener() {
17
- const targetDocument = emblaApi.containerNode().ownerDocument;
18
- targetDocument.addEventListener('mousedown', documentDownListener);
19
- targetDocument.addEventListener('pointerdown', documentDownListener);
23
+ if (carouselListenerTarget) {
24
+ carouselListenerTarget.addEventListener('mousedown', documentDownListener);
25
+ carouselListenerTarget.addEventListener('pointerdown', documentDownListener);
26
+ }
20
27
  }
21
28
  function clearPointerEvent() {
22
29
  pointerEvent = undefined;
@@ -28,23 +35,24 @@ export function pointerEventPlugin(options) {
28
35
  const newIndex = (_emblaApi_selectedScrollSnap = emblaApi.selectedScrollSnap()) !== null && _emblaApi_selectedScrollSnap !== void 0 ? _emblaApi_selectedScrollSnap : 0;
29
36
  options.onSelectViaDrag(pointerEvent, newIndex);
30
37
  }
31
- clearPointerEvent();
32
38
  }
33
39
  function init(emblaApiInstance, optionsHandler) {
34
40
  emblaApi = emblaApiInstance;
35
41
  // Initialize the listener for first mouse/pointerDown event
36
- const targetDocument = emblaApi.containerNode().ownerDocument;
37
- targetDocument.addEventListener('mousedown', documentDownListener);
38
- targetDocument.addEventListener('pointerdown', documentDownListener);
42
+ carouselListenerTarget = emblaApi.containerNode();
43
+ carouselListenerTarget.addEventListener('mousedown', documentDownListener);
44
+ carouselListenerTarget.addEventListener('pointerdown', documentDownListener);
39
45
  emblaApi.on('pointerUp', pointerUpListener);
40
46
  emblaApi.on('select', selectListener);
41
- // Settle is used to clear pointer in cases where active index does not change
47
+ // Settle is used to clear pointer and conclude drag event
42
48
  emblaApi.on('settle', clearPointerEvent);
43
49
  }
44
50
  function destroy() {
45
- const targetDocument = emblaApi.containerNode().ownerDocument;
46
- targetDocument.removeEventListener('mousedown', documentDownListener);
47
- targetDocument.removeEventListener('pointerdown', documentDownListener);
51
+ if (carouselListenerTarget) {
52
+ carouselListenerTarget.removeEventListener('mousedown', documentDownListener);
53
+ carouselListenerTarget.removeEventListener('pointerdown', documentDownListener);
54
+ }
55
+ carouselListenerTarget = undefined;
48
56
  emblaApi.off('pointerUp', pointerUpListener);
49
57
  emblaApi.off('select', selectListener);
50
58
  emblaApi.off('settle', clearPointerEvent);
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/pointerEvents.ts"],"sourcesContent":["import type { CreatePluginType, EmblaCarouselType, OptionsHandlerType } from 'embla-carousel';\nimport { carouselClassNames } from '../Carousel';\n\nexport type PointerEventPluginOptions = {\n onSelectViaDrag: (event: PointerEvent | MouseEvent, index: number) => void;\n};\n\nexport type PointerEventPlugin = CreatePluginType<{}, PointerEventPluginOptions>;\n\nexport function pointerEventPlugin(options: PointerEventPluginOptions): PointerEventPlugin {\n let emblaApi: EmblaCarouselType;\n let pointerEvent: PointerEvent | MouseEvent | undefined;\n\n function documentDownListener(event: PointerEvent | MouseEvent) {\n const targetDocument = emblaApi.containerNode().ownerDocument;\n\n if (event.target) {\n const targetNode = event.target as Element;\n if (targetNode.classList.contains(carouselClassNames.root) || emblaApi.containerNode().contains(targetNode)) {\n pointerEvent = event;\n }\n }\n\n targetDocument.removeEventListener('mousedown', documentDownListener);\n targetDocument.removeEventListener('pointerdown', documentDownListener);\n }\n\n function pointerUpListener() {\n const targetDocument = emblaApi.containerNode().ownerDocument;\n\n targetDocument.addEventListener('mousedown', documentDownListener);\n targetDocument.addEventListener('pointerdown', documentDownListener);\n }\n\n function clearPointerEvent() {\n pointerEvent = undefined;\n pointerUpListener();\n }\n\n function selectListener() {\n if (pointerEvent) {\n const newIndex = emblaApi.selectedScrollSnap() ?? 0;\n\n options.onSelectViaDrag(pointerEvent, newIndex);\n }\n clearPointerEvent();\n }\n\n function init(emblaApiInstance: EmblaCarouselType, optionsHandler: OptionsHandlerType): void {\n emblaApi = emblaApiInstance;\n\n // Initialize the listener for first mouse/pointerDown event\n const targetDocument = emblaApi.containerNode().ownerDocument;\n targetDocument.addEventListener('mousedown', documentDownListener);\n targetDocument.addEventListener('pointerdown', documentDownListener);\n\n emblaApi.on('pointerUp', pointerUpListener);\n emblaApi.on('select', selectListener);\n // Settle is used to clear pointer in cases where active index does not change\n emblaApi.on('settle', clearPointerEvent);\n }\n\n function destroy(): void {\n const targetDocument = emblaApi.containerNode().ownerDocument;\n targetDocument.removeEventListener('mousedown', documentDownListener);\n targetDocument.removeEventListener('pointerdown', documentDownListener);\n emblaApi.off('pointerUp', pointerUpListener);\n emblaApi.off('select', selectListener);\n emblaApi.off('settle', clearPointerEvent);\n }\n\n return {\n name: 'pointerEvent',\n options,\n init,\n destroy,\n };\n}\n"],"names":["carouselClassNames","pointerEventPlugin","options","emblaApi","pointerEvent","documentDownListener","event","targetDocument","containerNode","ownerDocument","target","targetNode","classList","contains","root","removeEventListener","pointerUpListener","addEventListener","clearPointerEvent","undefined","selectListener","newIndex","selectedScrollSnap","onSelectViaDrag","init","emblaApiInstance","optionsHandler","on","destroy","off","name"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AACA,SAASA,kBAAkB,QAAQ,cAAc;AAQjD,OAAO,SAASC,mBAAmBC,OAAkC;IACnE,IAAIC;IACJ,IAAIC;IAEJ,SAASC,qBAAqBC,KAAgC;QAC5D,MAAMC,iBAAiBJ,SAASK,aAAa,GAAGC,aAAa;QAE7D,IAAIH,MAAMI,MAAM,EAAE;YAChB,MAAMC,aAAaL,MAAMI,MAAM;YAC/B,IAAIC,WAAWC,SAAS,CAACC,QAAQ,CAACb,mBAAmBc,IAAI,KAAKX,SAASK,aAAa,GAAGK,QAAQ,CAACF,aAAa;gBAC3GP,eAAeE;YACjB;QACF;QAEAC,eAAeQ,mBAAmB,CAAC,aAAaV;QAChDE,eAAeQ,mBAAmB,CAAC,eAAeV;IACpD;IAEA,SAASW;QACP,MAAMT,iBAAiBJ,SAASK,aAAa,GAAGC,aAAa;QAE7DF,eAAeU,gBAAgB,CAAC,aAAaZ;QAC7CE,eAAeU,gBAAgB,CAAC,eAAeZ;IACjD;IAEA,SAASa;QACPd,eAAee;QACfH;IACF;IAEA,SAASI;QACP,IAAIhB,cAAc;gBACCD;YAAjB,MAAMkB,WAAWlB,CAAAA,+BAAAA,SAASmB,kBAAkB,gBAA3BnB,0CAAAA,+BAAiC;YAElDD,QAAQqB,eAAe,CAACnB,cAAciB;QACxC;QACAH;IACF;IAEA,SAASM,KAAKC,gBAAmC,EAAEC,cAAkC;QACnFvB,WAAWsB;QAEX,4DAA4D;QAC5D,MAAMlB,iBAAiBJ,SAASK,aAAa,GAAGC,aAAa;QAC7DF,eAAeU,gBAAgB,CAAC,aAAaZ;QAC7CE,eAAeU,gBAAgB,CAAC,eAAeZ;QAE/CF,SAASwB,EAAE,CAAC,aAAaX;QACzBb,SAASwB,EAAE,CAAC,UAAUP;QACtB,8EAA8E;QAC9EjB,SAASwB,EAAE,CAAC,UAAUT;IACxB;IAEA,SAASU;QACP,MAAMrB,iBAAiBJ,SAASK,aAAa,GAAGC,aAAa;QAC7DF,eAAeQ,mBAAmB,CAAC,aAAaV;QAChDE,eAAeQ,mBAAmB,CAAC,eAAeV;QAClDF,SAAS0B,GAAG,CAAC,aAAab;QAC1Bb,SAAS0B,GAAG,CAAC,UAAUT;QACvBjB,SAAS0B,GAAG,CAAC,UAAUX;IACzB;IAEA,OAAO;QACLY,MAAM;QACN5B;QACAsB;QACAI;IACF;AACF"}
1
+ {"version":3,"sources":["../src/components/pointerEvents.ts"],"sourcesContent":["import type { CreatePluginType, EmblaCarouselType, OptionsHandlerType } from 'embla-carousel';\nimport { carouselClassNames } from '../Carousel';\n\nexport type PointerEventPluginOptions = {\n onSelectViaDrag: (event: PointerEvent | MouseEvent, index: number) => void;\n};\n\nexport type PointerEventPlugin = CreatePluginType<{}, PointerEventPluginOptions>;\n\nexport function pointerEventPlugin(options: PointerEventPluginOptions): PointerEventPlugin {\n let emblaApi: EmblaCarouselType;\n let pointerEvent: PointerEvent | MouseEvent | undefined;\n let carouselListenerTarget: HTMLElement | undefined;\n\n /**\n * Heads up!\n *\n * We don't use `emblaApi.on('pointerDown', ...)` as the callback does not provide the event.\n */\n function documentDownListener(event: PointerEvent | MouseEvent) {\n if (event.target) {\n const targetNode = event.target as Element;\n\n if (targetNode.classList.contains(carouselClassNames.root) || carouselListenerTarget?.contains(targetNode)) {\n pointerEvent = event;\n }\n }\n\n if (carouselListenerTarget) {\n carouselListenerTarget.removeEventListener('mousedown', documentDownListener);\n carouselListenerTarget.removeEventListener('pointerdown', documentDownListener);\n }\n }\n\n function pointerUpListener() {\n if (carouselListenerTarget) {\n carouselListenerTarget.addEventListener('mousedown', documentDownListener);\n carouselListenerTarget.addEventListener('pointerdown', documentDownListener);\n }\n }\n\n function clearPointerEvent() {\n pointerEvent = undefined;\n pointerUpListener();\n }\n\n function selectListener() {\n if (pointerEvent) {\n const newIndex = emblaApi.selectedScrollSnap() ?? 0;\n options.onSelectViaDrag(pointerEvent, newIndex);\n }\n }\n\n function init(emblaApiInstance: EmblaCarouselType, optionsHandler: OptionsHandlerType): void {\n emblaApi = emblaApiInstance;\n // Initialize the listener for first mouse/pointerDown event\n carouselListenerTarget = emblaApi.containerNode();\n\n carouselListenerTarget.addEventListener('mousedown', documentDownListener);\n carouselListenerTarget.addEventListener('pointerdown', documentDownListener);\n\n emblaApi.on('pointerUp', pointerUpListener);\n emblaApi.on('select', selectListener);\n // Settle is used to clear pointer and conclude drag event\n emblaApi.on('settle', clearPointerEvent);\n }\n\n function destroy(): void {\n if (carouselListenerTarget) {\n carouselListenerTarget.removeEventListener('mousedown', documentDownListener);\n carouselListenerTarget.removeEventListener('pointerdown', documentDownListener);\n }\n\n carouselListenerTarget = undefined;\n\n emblaApi.off('pointerUp', pointerUpListener);\n emblaApi.off('select', selectListener);\n emblaApi.off('settle', clearPointerEvent);\n }\n\n return {\n name: 'pointerEvent',\n options,\n init,\n destroy,\n };\n}\n"],"names":["carouselClassNames","pointerEventPlugin","options","emblaApi","pointerEvent","carouselListenerTarget","documentDownListener","event","target","targetNode","classList","contains","root","removeEventListener","pointerUpListener","addEventListener","clearPointerEvent","undefined","selectListener","newIndex","selectedScrollSnap","onSelectViaDrag","init","emblaApiInstance","optionsHandler","containerNode","on","destroy","off","name"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AACA,SAASA,kBAAkB,QAAQ,cAAc;AAQjD,OAAO,SAASC,mBAAmBC,OAAkC;IACnE,IAAIC;IACJ,IAAIC;IACJ,IAAIC;IAEJ;;;;GAIC,GACD,SAASC,qBAAqBC,KAAgC;QAC5D,IAAIA,MAAMC,MAAM,EAAE;YAChB,MAAMC,aAAaF,MAAMC,MAAM;YAE/B,IAAIC,WAAWC,SAAS,CAACC,QAAQ,CAACX,mBAAmBY,IAAI,MAAKP,mCAAAA,6CAAAA,uBAAwBM,QAAQ,CAACF,cAAa;gBAC1GL,eAAeG;YACjB;QACF;QAEA,IAAIF,wBAAwB;YAC1BA,uBAAuBQ,mBAAmB,CAAC,aAAaP;YACxDD,uBAAuBQ,mBAAmB,CAAC,eAAeP;QAC5D;IACF;IAEA,SAASQ;QACP,IAAIT,wBAAwB;YAC1BA,uBAAuBU,gBAAgB,CAAC,aAAaT;YACrDD,uBAAuBU,gBAAgB,CAAC,eAAeT;QACzD;IACF;IAEA,SAASU;QACPZ,eAAea;QACfH;IACF;IAEA,SAASI;QACP,IAAId,cAAc;gBACCD;YAAjB,MAAMgB,WAAWhB,CAAAA,+BAAAA,SAASiB,kBAAkB,gBAA3BjB,0CAAAA,+BAAiC;YAClDD,QAAQmB,eAAe,CAACjB,cAAce;QACxC;IACF;IAEA,SAASG,KAAKC,gBAAmC,EAAEC,cAAkC;QACnFrB,WAAWoB;QACX,4DAA4D;QAC5DlB,yBAAyBF,SAASsB,aAAa;QAE/CpB,uBAAuBU,gBAAgB,CAAC,aAAaT;QACrDD,uBAAuBU,gBAAgB,CAAC,eAAeT;QAEvDH,SAASuB,EAAE,CAAC,aAAaZ;QACzBX,SAASuB,EAAE,CAAC,UAAUR;QACtB,0DAA0D;QAC1Df,SAASuB,EAAE,CAAC,UAAUV;IACxB;IAEA,SAASW;QACP,IAAItB,wBAAwB;YAC1BA,uBAAuBQ,mBAAmB,CAAC,aAAaP;YACxDD,uBAAuBQ,mBAAmB,CAAC,eAAeP;QAC5D;QAEAD,yBAAyBY;QAEzBd,SAASyB,GAAG,CAAC,aAAad;QAC1BX,SAASyB,GAAG,CAAC,UAAUV;QACvBf,SAASyB,GAAG,CAAC,UAAUZ;IACzB;IAEA,OAAO;QACLa,MAAM;QACN3B;QACAoB;QACAK;IACF;AACF"}
@@ -12,21 +12,28 @@ const _Carousel = require("../Carousel");
12
12
  function pointerEventPlugin(options) {
13
13
  let emblaApi;
14
14
  let pointerEvent;
15
- function documentDownListener(event) {
16
- const targetDocument = emblaApi.containerNode().ownerDocument;
15
+ let carouselListenerTarget;
16
+ /**
17
+ * Heads up!
18
+ *
19
+ * We don't use `emblaApi.on('pointerDown', ...)` as the callback does not provide the event.
20
+ */ function documentDownListener(event) {
17
21
  if (event.target) {
18
22
  const targetNode = event.target;
19
- if (targetNode.classList.contains(_Carousel.carouselClassNames.root) || emblaApi.containerNode().contains(targetNode)) {
23
+ if (targetNode.classList.contains(_Carousel.carouselClassNames.root) || (carouselListenerTarget === null || carouselListenerTarget === void 0 ? void 0 : carouselListenerTarget.contains(targetNode))) {
20
24
  pointerEvent = event;
21
25
  }
22
26
  }
23
- targetDocument.removeEventListener('mousedown', documentDownListener);
24
- targetDocument.removeEventListener('pointerdown', documentDownListener);
27
+ if (carouselListenerTarget) {
28
+ carouselListenerTarget.removeEventListener('mousedown', documentDownListener);
29
+ carouselListenerTarget.removeEventListener('pointerdown', documentDownListener);
30
+ }
25
31
  }
26
32
  function pointerUpListener() {
27
- const targetDocument = emblaApi.containerNode().ownerDocument;
28
- targetDocument.addEventListener('mousedown', documentDownListener);
29
- targetDocument.addEventListener('pointerdown', documentDownListener);
33
+ if (carouselListenerTarget) {
34
+ carouselListenerTarget.addEventListener('mousedown', documentDownListener);
35
+ carouselListenerTarget.addEventListener('pointerdown', documentDownListener);
36
+ }
30
37
  }
31
38
  function clearPointerEvent() {
32
39
  pointerEvent = undefined;
@@ -38,23 +45,24 @@ function pointerEventPlugin(options) {
38
45
  const newIndex = (_emblaApi_selectedScrollSnap = emblaApi.selectedScrollSnap()) !== null && _emblaApi_selectedScrollSnap !== void 0 ? _emblaApi_selectedScrollSnap : 0;
39
46
  options.onSelectViaDrag(pointerEvent, newIndex);
40
47
  }
41
- clearPointerEvent();
42
48
  }
43
49
  function init(emblaApiInstance, optionsHandler) {
44
50
  emblaApi = emblaApiInstance;
45
51
  // Initialize the listener for first mouse/pointerDown event
46
- const targetDocument = emblaApi.containerNode().ownerDocument;
47
- targetDocument.addEventListener('mousedown', documentDownListener);
48
- targetDocument.addEventListener('pointerdown', documentDownListener);
52
+ carouselListenerTarget = emblaApi.containerNode();
53
+ carouselListenerTarget.addEventListener('mousedown', documentDownListener);
54
+ carouselListenerTarget.addEventListener('pointerdown', documentDownListener);
49
55
  emblaApi.on('pointerUp', pointerUpListener);
50
56
  emblaApi.on('select', selectListener);
51
- // Settle is used to clear pointer in cases where active index does not change
57
+ // Settle is used to clear pointer and conclude drag event
52
58
  emblaApi.on('settle', clearPointerEvent);
53
59
  }
54
60
  function destroy() {
55
- const targetDocument = emblaApi.containerNode().ownerDocument;
56
- targetDocument.removeEventListener('mousedown', documentDownListener);
57
- targetDocument.removeEventListener('pointerdown', documentDownListener);
61
+ if (carouselListenerTarget) {
62
+ carouselListenerTarget.removeEventListener('mousedown', documentDownListener);
63
+ carouselListenerTarget.removeEventListener('pointerdown', documentDownListener);
64
+ }
65
+ carouselListenerTarget = undefined;
58
66
  emblaApi.off('pointerUp', pointerUpListener);
59
67
  emblaApi.off('select', selectListener);
60
68
  emblaApi.off('settle', clearPointerEvent);
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/pointerEvents.ts"],"sourcesContent":["import type { CreatePluginType, EmblaCarouselType, OptionsHandlerType } from 'embla-carousel';\nimport { carouselClassNames } from '../Carousel';\n\nexport type PointerEventPluginOptions = {\n onSelectViaDrag: (event: PointerEvent | MouseEvent, index: number) => void;\n};\n\nexport type PointerEventPlugin = CreatePluginType<{}, PointerEventPluginOptions>;\n\nexport function pointerEventPlugin(options: PointerEventPluginOptions): PointerEventPlugin {\n let emblaApi: EmblaCarouselType;\n let pointerEvent: PointerEvent | MouseEvent | undefined;\n\n function documentDownListener(event: PointerEvent | MouseEvent) {\n const targetDocument = emblaApi.containerNode().ownerDocument;\n\n if (event.target) {\n const targetNode = event.target as Element;\n if (targetNode.classList.contains(carouselClassNames.root) || emblaApi.containerNode().contains(targetNode)) {\n pointerEvent = event;\n }\n }\n\n targetDocument.removeEventListener('mousedown', documentDownListener);\n targetDocument.removeEventListener('pointerdown', documentDownListener);\n }\n\n function pointerUpListener() {\n const targetDocument = emblaApi.containerNode().ownerDocument;\n\n targetDocument.addEventListener('mousedown', documentDownListener);\n targetDocument.addEventListener('pointerdown', documentDownListener);\n }\n\n function clearPointerEvent() {\n pointerEvent = undefined;\n pointerUpListener();\n }\n\n function selectListener() {\n if (pointerEvent) {\n const newIndex = emblaApi.selectedScrollSnap() ?? 0;\n\n options.onSelectViaDrag(pointerEvent, newIndex);\n }\n clearPointerEvent();\n }\n\n function init(emblaApiInstance: EmblaCarouselType, optionsHandler: OptionsHandlerType): void {\n emblaApi = emblaApiInstance;\n\n // Initialize the listener for first mouse/pointerDown event\n const targetDocument = emblaApi.containerNode().ownerDocument;\n targetDocument.addEventListener('mousedown', documentDownListener);\n targetDocument.addEventListener('pointerdown', documentDownListener);\n\n emblaApi.on('pointerUp', pointerUpListener);\n emblaApi.on('select', selectListener);\n // Settle is used to clear pointer in cases where active index does not change\n emblaApi.on('settle', clearPointerEvent);\n }\n\n function destroy(): void {\n const targetDocument = emblaApi.containerNode().ownerDocument;\n targetDocument.removeEventListener('mousedown', documentDownListener);\n targetDocument.removeEventListener('pointerdown', documentDownListener);\n emblaApi.off('pointerUp', pointerUpListener);\n emblaApi.off('select', selectListener);\n emblaApi.off('settle', clearPointerEvent);\n }\n\n return {\n name: 'pointerEvent',\n options,\n init,\n destroy,\n };\n}\n"],"names":["pointerEventPlugin","options","emblaApi","pointerEvent","documentDownListener","event","targetDocument","containerNode","ownerDocument","target","targetNode","classList","contains","carouselClassNames","root","removeEventListener","pointerUpListener","addEventListener","clearPointerEvent","undefined","selectListener","newIndex","selectedScrollSnap","onSelectViaDrag","init","emblaApiInstance","optionsHandler","on","destroy","off","name"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BASgBA;;;eAAAA;;;0BARmB;AAQ5B,SAASA,mBAAmBC,OAAkC;IACnE,IAAIC;IACJ,IAAIC;IAEJ,SAASC,qBAAqBC,KAAgC;QAC5D,MAAMC,iBAAiBJ,SAASK,aAAa,GAAGC,aAAa;QAE7D,IAAIH,MAAMI,MAAM,EAAE;YAChB,MAAMC,aAAaL,MAAMI,MAAM;YAC/B,IAAIC,WAAWC,SAAS,CAACC,QAAQ,CAACC,4BAAAA,CAAmBC,IAAI,KAAKZ,SAASK,aAAa,GAAGK,QAAQ,CAACF,aAAa;gBAC3GP,eAAeE;YACjB;QACF;QAEAC,eAAeS,mBAAmB,CAAC,aAAaX;QAChDE,eAAeS,mBAAmB,CAAC,eAAeX;IACpD;IAEA,SAASY;QACP,MAAMV,iBAAiBJ,SAASK,aAAa,GAAGC,aAAa;QAE7DF,eAAeW,gBAAgB,CAAC,aAAab;QAC7CE,eAAeW,gBAAgB,CAAC,eAAeb;IACjD;IAEA,SAASc;QACPf,eAAegB;QACfH;IACF;IAEA,SAASI;QACP,IAAIjB,cAAc;gBACCD;YAAjB,MAAMmB,WAAWnB,CAAAA,+BAAAA,SAASoB,kBAAkB,EAAA,MAAA,QAA3BpB,iCAAAA,KAAAA,IAAAA,+BAAiC;YAElDD,QAAQsB,eAAe,CAACpB,cAAckB;QACxC;QACAH;IACF;IAEA,SAASM,KAAKC,gBAAmC,EAAEC,cAAkC;QACnFxB,WAAWuB;QAEX,4DAA4D;QAC5D,MAAMnB,iBAAiBJ,SAASK,aAAa,GAAGC,aAAa;QAC7DF,eAAeW,gBAAgB,CAAC,aAAab;QAC7CE,eAAeW,gBAAgB,CAAC,eAAeb;QAE/CF,SAASyB,EAAE,CAAC,aAAaX;QACzBd,SAASyB,EAAE,CAAC,UAAUP;QACtB,8EAA8E;QAC9ElB,SAASyB,EAAE,CAAC,UAAUT;IACxB;IAEA,SAASU;QACP,MAAMtB,iBAAiBJ,SAASK,aAAa,GAAGC,aAAa;QAC7DF,eAAeS,mBAAmB,CAAC,aAAaX;QAChDE,eAAeS,mBAAmB,CAAC,eAAeX;QAClDF,SAAS2B,GAAG,CAAC,aAAab;QAC1Bd,SAAS2B,GAAG,CAAC,UAAUT;QACvBlB,SAAS2B,GAAG,CAAC,UAAUX;IACzB;IAEA,OAAO;QACLY,MAAM;QACN7B;QACAuB;QACAI;IACF;AACF"}
1
+ {"version":3,"sources":["../src/components/pointerEvents.ts"],"sourcesContent":["import type { CreatePluginType, EmblaCarouselType, OptionsHandlerType } from 'embla-carousel';\nimport { carouselClassNames } from '../Carousel';\n\nexport type PointerEventPluginOptions = {\n onSelectViaDrag: (event: PointerEvent | MouseEvent, index: number) => void;\n};\n\nexport type PointerEventPlugin = CreatePluginType<{}, PointerEventPluginOptions>;\n\nexport function pointerEventPlugin(options: PointerEventPluginOptions): PointerEventPlugin {\n let emblaApi: EmblaCarouselType;\n let pointerEvent: PointerEvent | MouseEvent | undefined;\n let carouselListenerTarget: HTMLElement | undefined;\n\n /**\n * Heads up!\n *\n * We don't use `emblaApi.on('pointerDown', ...)` as the callback does not provide the event.\n */\n function documentDownListener(event: PointerEvent | MouseEvent) {\n if (event.target) {\n const targetNode = event.target as Element;\n\n if (targetNode.classList.contains(carouselClassNames.root) || carouselListenerTarget?.contains(targetNode)) {\n pointerEvent = event;\n }\n }\n\n if (carouselListenerTarget) {\n carouselListenerTarget.removeEventListener('mousedown', documentDownListener);\n carouselListenerTarget.removeEventListener('pointerdown', documentDownListener);\n }\n }\n\n function pointerUpListener() {\n if (carouselListenerTarget) {\n carouselListenerTarget.addEventListener('mousedown', documentDownListener);\n carouselListenerTarget.addEventListener('pointerdown', documentDownListener);\n }\n }\n\n function clearPointerEvent() {\n pointerEvent = undefined;\n pointerUpListener();\n }\n\n function selectListener() {\n if (pointerEvent) {\n const newIndex = emblaApi.selectedScrollSnap() ?? 0;\n options.onSelectViaDrag(pointerEvent, newIndex);\n }\n }\n\n function init(emblaApiInstance: EmblaCarouselType, optionsHandler: OptionsHandlerType): void {\n emblaApi = emblaApiInstance;\n // Initialize the listener for first mouse/pointerDown event\n carouselListenerTarget = emblaApi.containerNode();\n\n carouselListenerTarget.addEventListener('mousedown', documentDownListener);\n carouselListenerTarget.addEventListener('pointerdown', documentDownListener);\n\n emblaApi.on('pointerUp', pointerUpListener);\n emblaApi.on('select', selectListener);\n // Settle is used to clear pointer and conclude drag event\n emblaApi.on('settle', clearPointerEvent);\n }\n\n function destroy(): void {\n if (carouselListenerTarget) {\n carouselListenerTarget.removeEventListener('mousedown', documentDownListener);\n carouselListenerTarget.removeEventListener('pointerdown', documentDownListener);\n }\n\n carouselListenerTarget = undefined;\n\n emblaApi.off('pointerUp', pointerUpListener);\n emblaApi.off('select', selectListener);\n emblaApi.off('settle', clearPointerEvent);\n }\n\n return {\n name: 'pointerEvent',\n options,\n init,\n destroy,\n };\n}\n"],"names":["pointerEventPlugin","options","emblaApi","pointerEvent","carouselListenerTarget","documentDownListener","event","target","targetNode","classList","contains","carouselClassNames","root","removeEventListener","pointerUpListener","addEventListener","clearPointerEvent","undefined","selectListener","newIndex","selectedScrollSnap","onSelectViaDrag","init","emblaApiInstance","optionsHandler","containerNode","on","destroy","off","name"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BASgBA;;;eAAAA;;;0BARmB;AAQ5B,SAASA,mBAAmBC,OAAkC;IACnE,IAAIC;IACJ,IAAIC;IACJ,IAAIC;IAEJ;;;;GAIC,GACD,SAASC,qBAAqBC,KAAgC;QAC5D,IAAIA,MAAMC,MAAM,EAAE;YAChB,MAAMC,aAAaF,MAAMC,MAAM;YAE/B,IAAIC,WAAWC,SAAS,CAACC,QAAQ,CAACC,4BAAAA,CAAmBC,IAAI,KAAKR,CAAAA,2BAAAA,QAAAA,2BAAAA,KAAAA,IAAAA,KAAAA,IAAAA,uBAAwBM,QAAQ,CAACF,WAAAA,GAAa;gBAC1GL,eAAeG;YACjB;QACF;QAEA,IAAIF,wBAAwB;YAC1BA,uBAAuBS,mBAAmB,CAAC,aAAaR;YACxDD,uBAAuBS,mBAAmB,CAAC,eAAeR;QAC5D;IACF;IAEA,SAASS;QACP,IAAIV,wBAAwB;YAC1BA,uBAAuBW,gBAAgB,CAAC,aAAaV;YACrDD,uBAAuBW,gBAAgB,CAAC,eAAeV;QACzD;IACF;IAEA,SAASW;QACPb,eAAec;QACfH;IACF;IAEA,SAASI;QACP,IAAIf,cAAc;gBACCD;YAAjB,MAAMiB,WAAWjB,CAAAA,+BAAAA,SAASkB,kBAAkB,EAAA,MAAA,QAA3BlB,iCAAAA,KAAAA,IAAAA,+BAAiC;YAClDD,QAAQoB,eAAe,CAAClB,cAAcgB;QACxC;IACF;IAEA,SAASG,KAAKC,gBAAmC,EAAEC,cAAkC;QACnFtB,WAAWqB;QACX,4DAA4D;QAC5DnB,yBAAyBF,SAASuB,aAAa;QAE/CrB,uBAAuBW,gBAAgB,CAAC,aAAaV;QACrDD,uBAAuBW,gBAAgB,CAAC,eAAeV;QAEvDH,SAASwB,EAAE,CAAC,aAAaZ;QACzBZ,SAASwB,EAAE,CAAC,UAAUR;QACtB,0DAA0D;QAC1DhB,SAASwB,EAAE,CAAC,UAAUV;IACxB;IAEA,SAASW;QACP,IAAIvB,wBAAwB;YAC1BA,uBAAuBS,mBAAmB,CAAC,aAAaR;YACxDD,uBAAuBS,mBAAmB,CAAC,eAAeR;QAC5D;QAEAD,yBAAyBa;QAEzBf,SAAS0B,GAAG,CAAC,aAAad;QAC1BZ,SAAS0B,GAAG,CAAC,UAAUV;QACvBhB,SAAS0B,GAAG,CAAC,UAAUZ;IACzB;IAEA,OAAO;QACLa,MAAM;QACN5B;QACAqB;QACAK;IACF;AACF"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@fluentui/react-carousel",
3
- "version": "9.7.1",
3
+ "version": "9.7.2",
4
4
  "description": "A composable carousel component that enables pagination with minimal rerenders",
5
5
  "main": "lib-commonjs/index.js",
6
6
  "module": "lib/index.js",
@@ -25,16 +25,16 @@
25
25
  "@fluentui/scripts-cypress": "*"
26
26
  },
27
27
  "dependencies": {
28
- "@fluentui/react-aria": "^9.15.0",
29
- "@fluentui/react-button": "^9.5.0",
30
- "@fluentui/react-context-selector": "^9.2.0",
28
+ "@fluentui/react-aria": "^9.15.1",
29
+ "@fluentui/react-button": "^9.5.1",
30
+ "@fluentui/react-context-selector": "^9.2.1",
31
31
  "@fluentui/react-icons": "^2.0.245",
32
- "@fluentui/react-tooltip": "^9.7.1",
33
- "@fluentui/react-jsx-runtime": "^9.1.0",
34
- "@fluentui/react-shared-contexts": "^9.23.1",
35
- "@fluentui/react-tabster": "^9.25.0",
32
+ "@fluentui/react-tooltip": "^9.7.2",
33
+ "@fluentui/react-jsx-runtime": "^9.1.1",
34
+ "@fluentui/react-shared-contexts": "^9.24.0",
35
+ "@fluentui/react-tabster": "^9.25.1",
36
36
  "@fluentui/react-theme": "^9.1.24",
37
- "@fluentui/react-utilities": "^9.21.0",
37
+ "@fluentui/react-utilities": "^9.21.1",
38
38
  "@griffel/react": "^1.5.22",
39
39
  "@swc/helpers": "^0.5.1",
40
40
  "embla-carousel": "^8.5.1",