@fluentui/react-positioning 9.20.5 → 9.20.7

package/CHANGELOG.md

@@ -1,12 +1,32 @@
 # Change Log - @fluentui/react-positioning
 
-This log was last generated on Mon, 08 Sep 2025 12:41:56 GMT and should not be manually modified.
+This log was last generated on Wed, 08 Oct 2025 12:00:20 GMT and should not be manually modified.
 
 <!-- Start content -->
 
+## [9.20.7](https://github.com/microsoft/fluentui/tree/@fluentui/react-positioning_v9.20.7)
+
+Wed, 08 Oct 2025 12:00:20 GMT 
+[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-positioning_v9.20.6..@fluentui/react-positioning_v9.20.7)
+
+### Patches
+
+- Bump @fluentui/react-utilities to v9.25.1 ([PR #35294](https://github.com/microsoft/fluentui/pull/35294) by beachball)
+
+## [9.20.6](https://github.com/microsoft/fluentui/tree/@fluentui/react-positioning_v9.20.6)
+
+Thu, 02 Oct 2025 15:12:31 GMT 
+[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-positioning_v9.20.5..@fluentui/react-positioning_v9.20.6)
+
+### Patches
+
+- feat: enforce usage of use client directive for files with client-only features ([PR #35173](https://github.com/microsoft/fluentui/pull/35173) by dmytrokirpa@microsoft.com)
+- Bump @fluentui/react-shared-contexts to v9.25.2 ([PR #35133](https://github.com/microsoft/fluentui/pull/35133) by beachball)
+- Bump @fluentui/react-utilities to v9.25.0 ([PR #35133](https://github.com/microsoft/fluentui/pull/35133) by beachball)
+
 ## [9.20.5](https://github.com/microsoft/fluentui/tree/@fluentui/react-positioning_v9.20.5)
 
-Mon, 08 Sep 2025 12:41:56 GMT 
+Mon, 08 Sep 2025 12:51:16 GMT 
 [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-positioning_v9.20.4..@fluentui/react-positioning_v9.20.5)
 
 ### Patches

package/lib/PositioningConfigurationContext.js

@@ -1,3 +1,4 @@
+'use client';
 import * as React from 'react';
 // ---
 const DEFAULT_CONFIGURATION = ({ options })=>{

package/lib/PositioningConfigurationContext.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/PositioningConfigurationContext.ts"],"sourcesContent":["import * as React from 'react';\nimport type { PositioningConfigurationFn } from './types';\n\n// ---\n\nconst DEFAULT_CONFIGURATION: PositioningConfigurationFn = ({ options }) => {\n  return options;\n};\n\n// ---\n\nconst PositioningConfigurationContext = React.createContext<PositioningConfigurationFn | undefined>(undefined);\n\n/**\n * A context provider for the positioning configuration.\n *\n * Accepts a function that takes the positioning options and returns them modified.\n */\nexport const PositioningConfigurationProvider = PositioningConfigurationContext.Provider;\n\nexport const usePositioningConfiguration = (): PositioningConfigurationFn => {\n  return React.useContext(PositioningConfigurationContext) ?? DEFAULT_CONFIGURATION;\n};\n"],"names":["React","DEFAULT_CONFIGURATION","options","PositioningConfigurationContext","createContext","undefined","PositioningConfigurationProvider","Provider","usePositioningConfiguration","useContext"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAG/B,MAAM;AAEN,MAAMC,wBAAoD,CAAC,EAAEC,OAAO,EAAE;IACpE,OAAOA;AACT;AAEA,MAAM;AAEN,MAAMC,kCAAkCH,MAAMI,aAAa,CAAyCC;AAEpG;;;;CAIC,GACD,OAAO,MAAMC,mCAAmCH,gCAAgCI,QAAQ,CAAC;AAEzF,OAAO,MAAMC,8BAA8B;QAClCR;IAAP,OAAOA,CAAAA,oBAAAA,MAAMS,UAAU,CAACN,8CAAjBH,+BAAAA,oBAAqDC;AAC9D,EAAE"}
+{"version":3,"sources":["../src/PositioningConfigurationContext.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport type { PositioningConfigurationFn } from './types';\n\n// ---\n\nconst DEFAULT_CONFIGURATION: PositioningConfigurationFn = ({ options }) => {\n  return options;\n};\n\n// ---\n\nconst PositioningConfigurationContext = React.createContext<PositioningConfigurationFn | undefined>(undefined);\n\n/**\n * A context provider for the positioning configuration.\n *\n * Accepts a function that takes the positioning options and returns them modified.\n */\nexport const PositioningConfigurationProvider = PositioningConfigurationContext.Provider;\n\nexport const usePositioningConfiguration = (): PositioningConfigurationFn => {\n  return React.useContext(PositioningConfigurationContext) ?? DEFAULT_CONFIGURATION;\n};\n"],"names":["React","DEFAULT_CONFIGURATION","options","PositioningConfigurationContext","createContext","undefined","PositioningConfigurationProvider","Provider","usePositioningConfiguration","useContext"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAG/B,MAAM;AAEN,MAAMC,wBAAoD,CAAC,EAAEC,OAAO,EAAE;IACpE,OAAOA;AACT;AAEA,MAAM;AAEN,MAAMC,kCAAkCH,MAAMI,aAAa,CAAyCC;AAEpG;;;;CAIC,GACD,OAAO,MAAMC,mCAAmCH,gCAAgCI,QAAQ,CAAC;AAEzF,OAAO,MAAMC,8BAA8B;QAClCR;IAAP,OAAOA,CAAAA,oBAAAA,MAAMS,UAAU,CAACN,8CAAjBH,+BAAAA,oBAAqDC;AAC9D,EAAE"}

package/lib/hooks/useSafeZoneArea/SafeZoneArea.js

@@ -1,3 +1,4 @@
+'use client';
 import { mergeClasses } from '@griffel/react';
 import { useId } from '@fluentui/react-utilities';
 import * as React from 'react';

package/lib/hooks/useSafeZoneArea/SafeZoneArea.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/hooks/useSafeZoneArea/SafeZoneArea.tsx"],"sourcesContent":["import { mergeClasses } from '@griffel/react';\nimport { useId } from '@fluentui/react-utilities';\nimport type { JSXElement } from '@fluentui/react-utilities';\nimport * as React from 'react';\nimport { useSyncExternalStore } from 'use-sync-external-store/shim';\n\nimport type { createSafeZoneAreaStateStore } from './createSafeZoneAreaStateStore';\nimport { getRectCorners } from './getRectCorners';\nimport { getMouseAnchor } from './getMouseAnchor';\nimport { pointsToSvgPath } from './pointsToSvgPath';\nimport { useStyles } from './SafeZoneArea.styles';\nimport type { Point } from './types';\nimport { computeOutsideClipPath } from './computeOutsideClipPath';\n\nexport type SafeZoneAreaImperativeHandle = {\n  updateSVG: (options: { containerRect: DOMRect; targetRect: DOMRect; mouseCoordinates: Point }) => void;\n};\n\nexport type SafeZoneAreaProps = {\n  /** Enables debug mode: makes drawn shapes visible. */\n  debug: boolean;\n\n  /** A reference to the SafeZoneArea imperative handle. */\n  imperativeRef: React.Ref<SafeZoneAreaImperativeHandle>;\n\n  // eslint-disable-next-line @nx/workspace-consistent-callback-type\n  onMouseEnter: (e: React.MouseEvent) => void;\n  // eslint-disable-next-line @nx/workspace-consistent-callback-type\n  onMouseMove: (e: React.MouseEvent) => void;\n  // eslint-disable-next-line @nx/workspace-consistent-callback-type\n  onMouseLeave: (e: React.MouseEvent) => void;\n\n  stateStore: ReturnType<typeof createSafeZoneAreaStateStore>;\n};\n\n/**\n * @internal\n */\ntype SafeZoneAreaState = {\n  containerRect: DOMRect;\n  targetRect: DOMRect;\n  mouseCoordinates: Point;\n};\n\n// ---\n\nconst EMPTY_RECT: DOMRect = {\n  top: 0,\n  right: 0,\n  bottom: 0,\n  left: 0,\n  width: 0,\n  height: 0,\n  x: 0,\n  y: 0,\n  toJSON() {\n    return '';\n  },\n};\n\nexport function isSameRect(a: DOMRect, b: DOMRect): boolean {\n  return (\n    a.top === b.top &&\n    a.right === b.right &&\n    a.bottom === b.bottom &&\n    a.left === b.left &&\n    a.width === b.width &&\n    a.height === b.height\n  );\n}\n\nexport function isSameCoordinates(a: Point, b: Point): boolean {\n  return a[0] === b[0] && a[1] === b[1];\n}\n\n// ---\n\n/**\n * A component that renders a safe zone area with SVG shapes. Uses `useSyncExternalStore` to manage its active state\n * to avoid causing re-renders in `useSafeZoneArea()` as the hook might be used in host components like `Menu`.\n *\n * Draws two shapes:\n * - a triangle that points to the target element which is an actual safe zone\n * - a rectangle for a clip path that clips out the target element\n *\n * @internal\n */\nexport const SafeZoneArea = React.memo((props: SafeZoneAreaProps): JSXElement => {\n  const { debug, onMouseEnter, onMouseMove, onMouseLeave, stateStore } = props;\n\n  const clipPathId = useId();\n  const styles = useStyles();\n\n  const active = useSyncExternalStore(stateStore.subscribe, stateStore.isActive);\n  const svgRef = React.useRef<SVGSVGElement>(null);\n\n  const [state, setState] = React.useState<SafeZoneAreaState>(() => ({\n    containerRect: EMPTY_RECT,\n    targetRect: EMPTY_RECT,\n    mouseCoordinates: [0, 0],\n  }));\n\n  React.useImperativeHandle(\n    props.imperativeRef,\n    () => ({\n      updateSVG(newState) {\n        setState(prevState => {\n          // Heads up!\n          // A small optimization to avoid unnecessary re-renders\n          if (\n            isSameRect(prevState.containerRect, newState.containerRect) &&\n            isSameRect(prevState.targetRect, newState.targetRect) &&\n            isSameCoordinates(prevState.mouseCoordinates, newState.mouseCoordinates)\n          ) {\n            return prevState;\n          }\n\n          return newState;\n        });\n      },\n    }),\n    [],\n  );\n\n  const { containerRect, targetRect, mouseCoordinates } = state;\n\n  const topOffset = Math.min(targetRect.top, containerRect.top);\n  const leftOffset = Math.min(targetRect.left, containerRect.left);\n  const bottomOffset = Math.max(targetRect.bottom, containerRect.bottom);\n  const rightOffset = Math.max(targetRect.right, containerRect.right);\n\n  // ---\n\n  const containerCorners = getRectCorners(containerRect, [leftOffset, topOffset]);\n  const targetCorners = getRectCorners(targetRect, [leftOffset, topOffset]);\n\n  // Heads up!\n  // The SVG coordinate system starts at the top-left corner of the SVG element,\n  // so we need to adjust the mouse coordinates relative to the SVG's top-left corner.\n  const relativeMouseCoordinates: Point = [mouseCoordinates[0] - leftOffset, mouseCoordinates[1] - topOffset];\n  const mouseAnchor = getMouseAnchor(containerCorners.topLeft, containerCorners.bottomRight, relativeMouseCoordinates);\n\n  const triangleA = [mouseAnchor, containerCorners.topLeft, containerCorners.topRight];\n  const triangleB = [mouseAnchor, containerCorners.topRight, containerCorners.bottomRight];\n  const triangleC = [mouseAnchor, containerCorners.bottomRight, containerCorners.bottomLeft];\n  const triangleD = [mouseAnchor, containerCorners.bottomLeft, containerCorners.topLeft];\n\n  const svgWidth = rightOffset - leftOffset;\n  const svgHeight = bottomOffset - topOffset;\n\n  const clipPath = computeOutsideClipPath(\n    svgWidth,\n    svgHeight,\n    {\n      x: targetCorners.topLeft[0],\n      y: targetCorners.topLeft[1],\n      width: targetRect.width,\n      height: targetRect.height,\n    },\n    {\n      x: containerCorners.topLeft[0],\n      y: containerCorners.topLeft[1],\n      width: containerRect.width,\n      height: containerRect.height,\n    },\n  );\n\n  return (\n    <div className={mergeClasses(styles.wrapper, active && styles.wrapperActive)} data-safe-zone=\"\">\n      {active ? (\n        <svg\n          aria-hidden\n          className={styles.svg}\n          xmlns=\"http://www.w3.org/2000/svg\"\n          ref={svgRef}\n          style={{\n            width: `${svgWidth}px`,\n            height: `${svgHeight}px`,\n            transform: `translate(${leftOffset}px, ${topOffset}px)`,\n          }}\n        >\n          <g\n            className={mergeClasses(styles.triangle, debug && styles.triangleDebug)}\n            clipPath={`url(#${clipPathId})`}\n            onMouseEnter={onMouseEnter}\n            onMouseMove={onMouseMove}\n            onMouseLeave={onMouseLeave}\n          >\n            <path d={pointsToSvgPath(triangleA)} />\n            <path d={pointsToSvgPath(triangleB)} />\n            <path d={pointsToSvgPath(triangleC)} />\n            <path d={pointsToSvgPath(triangleD)} />\n          </g>\n\n          <clipPath id={clipPathId}>\n            <path d={clipPath} />\n          </clipPath>\n\n          {debug && <path className={styles.rectDebug} d={clipPath} />}\n        </svg>\n      ) : null}\n    </div>\n  );\n});\n"],"names":["mergeClasses","useId","React","useSyncExternalStore","getRectCorners","getMouseAnchor","pointsToSvgPath","useStyles","computeOutsideClipPath","EMPTY_RECT","top","right","bottom","left","width","height","x","y","toJSON","isSameRect","a","b","isSameCoordinates","SafeZoneArea","memo","props","debug","onMouseEnter","onMouseMove","onMouseLeave","stateStore","clipPathId","styles","active","subscribe","isActive","svgRef","useRef","state","setState","useState","containerRect","targetRect","mouseCoordinates","useImperativeHandle","imperativeRef","updateSVG","newState","prevState","topOffset","Math","min","leftOffset","bottomOffset","max","rightOffset","containerCorners","targetCorners","relativeMouseCoordinates","mouseAnchor","topLeft","bottomRight","triangleA","topRight","triangleB","triangleC","bottomLeft","triangleD","svgWidth","svgHeight","clipPath","div","className","wrapper","wrapperActive","data-safe-zone","svg","aria-hidden","xmlns","ref","style","transform","g","triangle","triangleDebug","path","d","id","rectDebug"],"mappings":"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"}
+{"version":3,"sources":["../src/hooks/useSafeZoneArea/SafeZoneArea.tsx"],"sourcesContent":["'use client';\n\nimport { mergeClasses } from '@griffel/react';\nimport { useId } from '@fluentui/react-utilities';\nimport type { JSXElement } from '@fluentui/react-utilities';\nimport * as React from 'react';\nimport { useSyncExternalStore } from 'use-sync-external-store/shim';\n\nimport type { createSafeZoneAreaStateStore } from './createSafeZoneAreaStateStore';\nimport { getRectCorners } from './getRectCorners';\nimport { getMouseAnchor } from './getMouseAnchor';\nimport { pointsToSvgPath } from './pointsToSvgPath';\nimport { useStyles } from './SafeZoneArea.styles';\nimport type { Point } from './types';\nimport { computeOutsideClipPath } from './computeOutsideClipPath';\n\nexport type SafeZoneAreaImperativeHandle = {\n  updateSVG: (options: { containerRect: DOMRect; targetRect: DOMRect; mouseCoordinates: Point }) => void;\n};\n\nexport type SafeZoneAreaProps = {\n  /** Enables debug mode: makes drawn shapes visible. */\n  debug: boolean;\n\n  /** A reference to the SafeZoneArea imperative handle. */\n  imperativeRef: React.Ref<SafeZoneAreaImperativeHandle>;\n\n  // eslint-disable-next-line @nx/workspace-consistent-callback-type\n  onMouseEnter: (e: React.MouseEvent) => void;\n  // eslint-disable-next-line @nx/workspace-consistent-callback-type\n  onMouseMove: (e: React.MouseEvent) => void;\n  // eslint-disable-next-line @nx/workspace-consistent-callback-type\n  onMouseLeave: (e: React.MouseEvent) => void;\n\n  stateStore: ReturnType<typeof createSafeZoneAreaStateStore>;\n};\n\n/**\n * @internal\n */\ntype SafeZoneAreaState = {\n  containerRect: DOMRect;\n  targetRect: DOMRect;\n  mouseCoordinates: Point;\n};\n\n// ---\n\nconst EMPTY_RECT: DOMRect = {\n  top: 0,\n  right: 0,\n  bottom: 0,\n  left: 0,\n  width: 0,\n  height: 0,\n  x: 0,\n  y: 0,\n  toJSON() {\n    return '';\n  },\n};\n\nexport function isSameRect(a: DOMRect, b: DOMRect): boolean {\n  return (\n    a.top === b.top &&\n    a.right === b.right &&\n    a.bottom === b.bottom &&\n    a.left === b.left &&\n    a.width === b.width &&\n    a.height === b.height\n  );\n}\n\nexport function isSameCoordinates(a: Point, b: Point): boolean {\n  return a[0] === b[0] && a[1] === b[1];\n}\n\n// ---\n\n/**\n * A component that renders a safe zone area with SVG shapes. Uses `useSyncExternalStore` to manage its active state\n * to avoid causing re-renders in `useSafeZoneArea()` as the hook might be used in host components like `Menu`.\n *\n * Draws two shapes:\n * - a triangle that points to the target element which is an actual safe zone\n * - a rectangle for a clip path that clips out the target element\n *\n * @internal\n */\nexport const SafeZoneArea = React.memo((props: SafeZoneAreaProps): JSXElement => {\n  const { debug, onMouseEnter, onMouseMove, onMouseLeave, stateStore } = props;\n\n  const clipPathId = useId();\n  const styles = useStyles();\n\n  const active = useSyncExternalStore(stateStore.subscribe, stateStore.isActive);\n  const svgRef = React.useRef<SVGSVGElement>(null);\n\n  const [state, setState] = React.useState<SafeZoneAreaState>(() => ({\n    containerRect: EMPTY_RECT,\n    targetRect: EMPTY_RECT,\n    mouseCoordinates: [0, 0],\n  }));\n\n  React.useImperativeHandle(\n    props.imperativeRef,\n    () => ({\n      updateSVG(newState) {\n        setState(prevState => {\n          // Heads up!\n          // A small optimization to avoid unnecessary re-renders\n          if (\n            isSameRect(prevState.containerRect, newState.containerRect) &&\n            isSameRect(prevState.targetRect, newState.targetRect) &&\n            isSameCoordinates(prevState.mouseCoordinates, newState.mouseCoordinates)\n          ) {\n            return prevState;\n          }\n\n          return newState;\n        });\n      },\n    }),\n    [],\n  );\n\n  const { containerRect, targetRect, mouseCoordinates } = state;\n\n  const topOffset = Math.min(targetRect.top, containerRect.top);\n  const leftOffset = Math.min(targetRect.left, containerRect.left);\n  const bottomOffset = Math.max(targetRect.bottom, containerRect.bottom);\n  const rightOffset = Math.max(targetRect.right, containerRect.right);\n\n  // ---\n\n  const containerCorners = getRectCorners(containerRect, [leftOffset, topOffset]);\n  const targetCorners = getRectCorners(targetRect, [leftOffset, topOffset]);\n\n  // Heads up!\n  // The SVG coordinate system starts at the top-left corner of the SVG element,\n  // so we need to adjust the mouse coordinates relative to the SVG's top-left corner.\n  const relativeMouseCoordinates: Point = [mouseCoordinates[0] - leftOffset, mouseCoordinates[1] - topOffset];\n  const mouseAnchor = getMouseAnchor(containerCorners.topLeft, containerCorners.bottomRight, relativeMouseCoordinates);\n\n  const triangleA = [mouseAnchor, containerCorners.topLeft, containerCorners.topRight];\n  const triangleB = [mouseAnchor, containerCorners.topRight, containerCorners.bottomRight];\n  const triangleC = [mouseAnchor, containerCorners.bottomRight, containerCorners.bottomLeft];\n  const triangleD = [mouseAnchor, containerCorners.bottomLeft, containerCorners.topLeft];\n\n  const svgWidth = rightOffset - leftOffset;\n  const svgHeight = bottomOffset - topOffset;\n\n  const clipPath = computeOutsideClipPath(\n    svgWidth,\n    svgHeight,\n    {\n      x: targetCorners.topLeft[0],\n      y: targetCorners.topLeft[1],\n      width: targetRect.width,\n      height: targetRect.height,\n    },\n    {\n      x: containerCorners.topLeft[0],\n      y: containerCorners.topLeft[1],\n      width: containerRect.width,\n      height: containerRect.height,\n    },\n  );\n\n  return (\n    <div className={mergeClasses(styles.wrapper, active && styles.wrapperActive)} data-safe-zone=\"\">\n      {active ? (\n        <svg\n          aria-hidden\n          className={styles.svg}\n          xmlns=\"http://www.w3.org/2000/svg\"\n          ref={svgRef}\n          style={{\n            width: `${svgWidth}px`,\n            height: `${svgHeight}px`,\n            transform: `translate(${leftOffset}px, ${topOffset}px)`,\n          }}\n        >\n          <g\n            className={mergeClasses(styles.triangle, debug && styles.triangleDebug)}\n            clipPath={`url(#${clipPathId})`}\n            onMouseEnter={onMouseEnter}\n            onMouseMove={onMouseMove}\n            onMouseLeave={onMouseLeave}\n          >\n            <path d={pointsToSvgPath(triangleA)} />\n            <path d={pointsToSvgPath(triangleB)} />\n            <path d={pointsToSvgPath(triangleC)} />\n            <path d={pointsToSvgPath(triangleD)} />\n          </g>\n\n          <clipPath id={clipPathId}>\n            <path d={clipPath} />\n          </clipPath>\n\n          {debug && <path className={styles.rectDebug} d={clipPath} />}\n        </svg>\n      ) : null}\n    </div>\n  );\n});\n"],"names":["mergeClasses","useId","React","useSyncExternalStore","getRectCorners","getMouseAnchor","pointsToSvgPath","useStyles","computeOutsideClipPath","EMPTY_RECT","top","right","bottom","left","width","height","x","y","toJSON","isSameRect","a","b","isSameCoordinates","SafeZoneArea","memo","props","debug","onMouseEnter","onMouseMove","onMouseLeave","stateStore","clipPathId","styles","active","subscribe","isActive","svgRef","useRef","state","setState","useState","containerRect","targetRect","mouseCoordinates","useImperativeHandle","imperativeRef","updateSVG","newState","prevState","topOffset","Math","min","leftOffset","bottomOffset","max","rightOffset","containerCorners","targetCorners","relativeMouseCoordinates","mouseAnchor","topLeft","bottomRight","triangleA","topRight","triangleB","triangleC","bottomLeft","triangleD","svgWidth","svgHeight","clipPath","div","className","wrapper","wrapperActive","data-safe-zone","svg","aria-hidden","xmlns","ref","style","transform","g","triangle","triangleDebug","path","d","id","rectDebug"],"mappings":"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"}

package/lib/hooks/useSafeZoneArea/useSafeZoneArea.js

@@ -1,3 +1,4 @@
+'use client';
 import { useAnimationFrame, useEventCallback, useMergedRefs, useTimeout } from '@fluentui/react-utilities';
 import * as React from 'react';
 import { createSafeZoneAreaStateStore } from './createSafeZoneAreaStateStore';

package/lib/hooks/useSafeZoneArea/useSafeZoneArea.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/hooks/useSafeZoneArea/useSafeZoneArea.tsx"],"sourcesContent":["import { useAnimationFrame, useEventCallback, useMergedRefs, useTimeout } from '@fluentui/react-utilities';\nimport type { JSXElement, RefObjectFunction } from '@fluentui/react-utilities';\nimport * as React from 'react';\n\nimport { createSafeZoneAreaStateStore } from './createSafeZoneAreaStateStore';\nimport { type SafeZoneAreaImperativeHandle, SafeZoneArea } from './SafeZoneArea';\n\nexport type UseSafeZoneOptions = {\n  /** Enables debug mode: makes drawn shapes visible. */\n  debug?: boolean;\n\n  /** Disables the safe zone area. */\n  disabled?: boolean;\n\n  /** The time in milliseconds to wait before clearing the safe zone. */\n  timeout?: number;\n\n  /** Called when the mouse enters the safe zone. */\n  onSafeZoneEnter?: (e: React.MouseEvent) => void;\n\n  /** Called when the mouse moves within the safe zone. */\n  onSafeZoneMove?: (e: React.MouseEvent) => void;\n\n  /** Called when the mouse leaves the safe zone. */\n  onSafeZoneLeave?: (e: React.MouseEvent) => void;\n\n  /** Called when the safe zone times out, even if a cursor is still over a safe zone. */\n  onSafeZoneTimeout?: () => void;\n};\n\n/**\n * Time in milliseconds after which the safe zone area will be cleared if no mouse movement is detected.\n *\n * Only affects the target element, not the safe zone area itself.\n */\nconst MOUSE_MOVE_TARGET_POLLING_TIMEOUT = 2000;\n\n// ---\n\nexport function useSafeZoneArea({\n  debug = false,\n  disabled = false,\n\n  onSafeZoneEnter,\n  onSafeZoneMove,\n  onSafeZoneLeave,\n  onSafeZoneTimeout,\n\n  timeout = 1500,\n}: UseSafeZoneOptions = {}): {\n  containerRef: RefObjectFunction<HTMLElement>;\n  targetRef: RefObjectFunction<HTMLElement>;\n  elementToRender: JSXElement | null;\n} {\n  const [stateStore] = React.useState(createSafeZoneAreaStateStore);\n\n  const safeZoneAreaRef = React.useRef<SafeZoneAreaImperativeHandle>(null);\n  const containerRef = React.useRef<HTMLElement>(null);\n  const targetRef = React.useRef<HTMLElement>(null);\n\n  const [setSafeZoneCloseTimeout, clearSafeZoneCloseTimeout] = useTimeout();\n  const [requestUpdateFrame, clearUpdateFrame] = useAnimationFrame();\n\n  const mouseCoordinatesRef = React.useRef<{ x: number; y: number }>({ x: 0, y: 0 });\n\n  const containerListenerRef = React.useMemo(() => {\n    if (disabled) {\n      return () => {\n        // do nothing\n      };\n    }\n\n    let containerEl: HTMLElement | null = null;\n\n    function onContainerMouseEnter() {\n      clearSafeZoneCloseTimeout();\n      stateStore.toggleActive(false);\n    }\n\n    return (el: HTMLElement | null) => {\n      if (el === null) {\n        containerEl?.removeEventListener('mouseenter', onContainerMouseEnter);\n      }\n\n      containerEl = el;\n      el?.addEventListener('mouseenter', onContainerMouseEnter);\n    };\n  }, [clearSafeZoneCloseTimeout, disabled, stateStore]);\n\n  const targetListenerRef = React.useMemo(() => {\n    if (disabled) {\n      return () => {\n        // do nothing\n      };\n    }\n\n    let targetEl: HTMLElement | null = null;\n\n    function onTargetMouseMove(e: MouseEvent) {\n      mouseCoordinatesRef.current = { x: e.clientX, y: e.clientY };\n\n      if (!stateStore.isActive()) {\n        stateStore.toggleActive(true);\n      }\n\n      setSafeZoneCloseTimeout(() => {\n        stateStore.toggleActive(false);\n      }, MOUSE_MOVE_TARGET_POLLING_TIMEOUT);\n    }\n\n    return (el: HTMLElement | null) => {\n      if (el === null) {\n        clearUpdateFrame();\n        clearSafeZoneCloseTimeout();\n\n        targetEl?.removeEventListener('mousemove', onTargetMouseMove);\n      }\n\n      targetEl = el;\n      el?.addEventListener('mousemove', onTargetMouseMove);\n    };\n  }, [clearUpdateFrame, clearSafeZoneCloseTimeout, disabled, stateStore, setSafeZoneCloseTimeout]);\n\n  const onSvgMouseEnter = useEventCallback((e: React.MouseEvent) => {\n    onSafeZoneEnter?.(e);\n\n    setSafeZoneCloseTimeout(() => {\n      stateStore.toggleActive(false);\n      onSafeZoneTimeout?.();\n    }, timeout);\n  });\n\n  const onSvgMouseMove = useEventCallback((e: React.MouseEvent) => {\n    setSafeZoneCloseTimeout(() => {\n      stateStore.toggleActive(false);\n      onSafeZoneTimeout?.();\n    }, timeout);\n    onSafeZoneMove?.(e);\n  });\n\n  const onSvgMouseLeave = useEventCallback((e: React.MouseEvent) => {\n    onSafeZoneLeave?.(e);\n  });\n\n  React.useEffect(() => {\n    return stateStore.subscribe(isActive => {\n      if (isActive) {\n        function updateSVGs() {\n          const containerEl = containerRef.current;\n          const targetEl = targetRef.current;\n\n          if (containerEl && targetEl) {\n            safeZoneAreaRef.current?.updateSVG({\n              containerRect: containerEl.getBoundingClientRect(),\n              mouseCoordinates: [mouseCoordinatesRef.current.x, mouseCoordinatesRef.current.y],\n              targetRect: targetEl.getBoundingClientRect(),\n            });\n          }\n\n          requestUpdateFrame(updateSVGs);\n        }\n\n        updateSVGs();\n        return;\n      }\n\n      clearUpdateFrame();\n    });\n  }, [clearUpdateFrame, requestUpdateFrame, stateStore]);\n\n  return {\n    containerRef: useMergedRefs(containerRef, containerListenerRef),\n    targetRef: useMergedRefs(targetRef, targetListenerRef),\n\n    elementToRender: React.useMemo(\n      () =>\n        disabled ? null : (\n          <SafeZoneArea\n            debug={debug}\n            onMouseEnter={onSvgMouseEnter}\n            onMouseMove={onSvgMouseMove}\n            onMouseLeave={onSvgMouseLeave}\n            imperativeRef={safeZoneAreaRef}\n            stateStore={stateStore}\n          />\n        ),\n      [disabled, debug, onSvgMouseEnter, onSvgMouseMove, onSvgMouseLeave, stateStore],\n    ),\n  };\n}\n"],"names":["useAnimationFrame","useEventCallback","useMergedRefs","useTimeout","React","createSafeZoneAreaStateStore","SafeZoneArea","MOUSE_MOVE_TARGET_POLLING_TIMEOUT","useSafeZoneArea","debug","disabled","onSafeZoneEnter","onSafeZoneMove","onSafeZoneLeave","onSafeZoneTimeout","timeout","stateStore","useState","safeZoneAreaRef","useRef","containerRef","targetRef","setSafeZoneCloseTimeout","clearSafeZoneCloseTimeout","requestUpdateFrame","clearUpdateFrame","mouseCoordinatesRef","x","y","containerListenerRef","useMemo","containerEl","onContainerMouseEnter","toggleActive","el","removeEventListener","addEventListener","targetListenerRef","targetEl","onTargetMouseMove","e","current","clientX","clientY","isActive","onSvgMouseEnter","onSvgMouseMove","onSvgMouseLeave","useEffect","subscribe","updateSVGs","updateSVG","containerRect","getBoundingClientRect","mouseCoordinates","targetRect","elementToRender","onMouseEnter","onMouseMove","onMouseLeave","imperativeRef"],"mappings":"AAAA,SAASA,iBAAiB,EAAEC,gBAAgB,EAAEC,aAAa,EAAEC,UAAU,QAAQ,4BAA4B;AAE3G,YAAYC,WAAW,QAAQ;AAE/B,SAASC,4BAA4B,QAAQ,iCAAiC;AAC9E,SAA4CC,YAAY,QAAQ,iBAAiB;AAyBjF;;;;CAIC,GACD,MAAMC,oCAAoC;AAE1C,MAAM;AAEN,OAAO,SAASC,gBAAgB,EAC9BC,QAAQ,KAAK,EACbC,WAAW,KAAK,EAEhBC,eAAe,EACfC,cAAc,EACdC,eAAe,EACfC,iBAAiB,EAEjBC,UAAU,IAAI,EACK,GAAG,CAAC,CAAC;IAKxB,MAAM,CAACC,WAAW,GAAGZ,MAAMa,QAAQ,CAACZ;IAEpC,MAAMa,kBAAkBd,MAAMe,MAAM,CAA+B;IACnE,MAAMC,eAAehB,MAAMe,MAAM,CAAc;IAC/C,MAAME,YAAYjB,MAAMe,MAAM,CAAc;IAE5C,MAAM,CAACG,yBAAyBC,0BAA0B,GAAGpB;IAC7D,MAAM,CAACqB,oBAAoBC,iBAAiB,GAAGzB;IAE/C,MAAM0B,sBAAsBtB,MAAMe,MAAM,CAA2B;QAAEQ,GAAG;QAAGC,GAAG;IAAE;IAEhF,MAAMC,uBAAuBzB,MAAM0B,OAAO,CAAC;QACzC,IAAIpB,UAAU;YACZ,OAAO;YACL,aAAa;YACf;QACF;QAEA,IAAIqB,cAAkC;QAEtC,SAASC;YACPT;YACAP,WAAWiB,YAAY,CAAC;QAC1B;QAEA,OAAO,CAACC;YACN,IAAIA,OAAO,MAAM;gBACfH,wBAAAA,kCAAAA,YAAaI,mBAAmB,CAAC,cAAcH;YACjD;YAEAD,cAAcG;YACdA,eAAAA,yBAAAA,GAAIE,gBAAgB,CAAC,cAAcJ;QACrC;IACF,GAAG;QAACT;QAA2Bb;QAAUM;KAAW;IAEpD,MAAMqB,oBAAoBjC,MAAM0B,OAAO,CAAC;QACtC,IAAIpB,UAAU;YACZ,OAAO;YACL,aAAa;YACf;QACF;QAEA,IAAI4B,WAA+B;QAEnC,SAASC,kBAAkBC,CAAa;YACtCd,oBAAoBe,OAAO,GAAG;gBAAEd,GAAGa,EAAEE,OAAO;gBAAEd,GAAGY,EAAEG,OAAO;YAAC;YAE3D,IAAI,CAAC3B,WAAW4B,QAAQ,IAAI;gBAC1B5B,WAAWiB,YAAY,CAAC;YAC1B;YAEAX,wBAAwB;gBACtBN,WAAWiB,YAAY,CAAC;YAC1B,GAAG1B;QACL;QAEA,OAAO,CAAC2B;YACN,IAAIA,OAAO,MAAM;gBACfT;gBACAF;gBAEAe,qBAAAA,+BAAAA,SAAUH,mBAAmB,CAAC,aAAaI;YAC7C;YAEAD,WAAWJ;YACXA,eAAAA,yBAAAA,GAAIE,gBAAgB,CAAC,aAAaG;QACpC;IACF,GAAG;QAACd;QAAkBF;QAA2Bb;QAAUM;QAAYM;KAAwB;IAE/F,MAAMuB,kBAAkB5C,iBAAiB,CAACuC;QACxC7B,4BAAAA,sCAAAA,gBAAkB6B;QAElBlB,wBAAwB;YACtBN,WAAWiB,YAAY,CAAC;YACxBnB,8BAAAA,wCAAAA;QACF,GAAGC;IACL;IAEA,MAAM+B,iBAAiB7C,iBAAiB,CAACuC;QACvClB,wBAAwB;YACtBN,WAAWiB,YAAY,CAAC;YACxBnB,8BAAAA,wCAAAA;QACF,GAAGC;QACHH,2BAAAA,qCAAAA,eAAiB4B;IACnB;IAEA,MAAMO,kBAAkB9C,iBAAiB,CAACuC;QACxC3B,4BAAAA,sCAAAA,gBAAkB2B;IACpB;IAEApC,MAAM4C,SAAS,CAAC;QACd,OAAOhC,WAAWiC,SAAS,CAACL,CAAAA;YAC1B,IAAIA,UAAU;gBACZ,SAASM;oBACP,MAAMnB,cAAcX,aAAaqB,OAAO;oBACxC,MAAMH,WAAWjB,UAAUoB,OAAO;oBAElC,IAAIV,eAAeO,UAAU;4BAC3BpB;yBAAAA,2BAAAA,gBAAgBuB,OAAO,cAAvBvB,+CAAAA,yBAAyBiC,SAAS,CAAC;4BACjCC,eAAerB,YAAYsB,qBAAqB;4BAChDC,kBAAkB;gCAAC5B,oBAAoBe,OAAO,CAACd,CAAC;gCAAED,oBAAoBe,OAAO,CAACb,CAAC;6BAAC;4BAChF2B,YAAYjB,SAASe,qBAAqB;wBAC5C;oBACF;oBAEA7B,mBAAmB0B;gBACrB;gBAEAA;gBACA;YACF;YAEAzB;QACF;IACF,GAAG;QAACA;QAAkBD;QAAoBR;KAAW;IAErD,OAAO;QACLI,cAAclB,cAAckB,cAAcS;QAC1CR,WAAWnB,cAAcmB,WAAWgB;QAEpCmB,iBAAiBpD,MAAM0B,OAAO,CAC5B,IACEpB,WAAW,qBACT,oBAACJ;gBACCG,OAAOA;gBACPgD,cAAcZ;gBACda,aAAaZ;gBACba,cAAcZ;gBACda,eAAe1C;gBACfF,YAAYA;gBAGlB;YAACN;YAAUD;YAAOoC;YAAiBC;YAAgBC;YAAiB/B;SAAW;IAEnF;AACF"}
+{"version":3,"sources":["../src/hooks/useSafeZoneArea/useSafeZoneArea.tsx"],"sourcesContent":["'use client';\n\nimport { useAnimationFrame, useEventCallback, useMergedRefs, useTimeout } from '@fluentui/react-utilities';\nimport type { JSXElement, RefObjectFunction } from '@fluentui/react-utilities';\nimport * as React from 'react';\n\nimport { createSafeZoneAreaStateStore } from './createSafeZoneAreaStateStore';\nimport { type SafeZoneAreaImperativeHandle, SafeZoneArea } from './SafeZoneArea';\n\nexport type UseSafeZoneOptions = {\n  /** Enables debug mode: makes drawn shapes visible. */\n  debug?: boolean;\n\n  /** Disables the safe zone area. */\n  disabled?: boolean;\n\n  /** The time in milliseconds to wait before clearing the safe zone. */\n  timeout?: number;\n\n  /** Called when the mouse enters the safe zone. */\n  onSafeZoneEnter?: (e: React.MouseEvent) => void;\n\n  /** Called when the mouse moves within the safe zone. */\n  onSafeZoneMove?: (e: React.MouseEvent) => void;\n\n  /** Called when the mouse leaves the safe zone. */\n  onSafeZoneLeave?: (e: React.MouseEvent) => void;\n\n  /** Called when the safe zone times out, even if a cursor is still over a safe zone. */\n  onSafeZoneTimeout?: () => void;\n};\n\n/**\n * Time in milliseconds after which the safe zone area will be cleared if no mouse movement is detected.\n *\n * Only affects the target element, not the safe zone area itself.\n */\nconst MOUSE_MOVE_TARGET_POLLING_TIMEOUT = 2000;\n\n// ---\n\nexport function useSafeZoneArea({\n  debug = false,\n  disabled = false,\n\n  onSafeZoneEnter,\n  onSafeZoneMove,\n  onSafeZoneLeave,\n  onSafeZoneTimeout,\n\n  timeout = 1500,\n}: UseSafeZoneOptions = {}): {\n  containerRef: RefObjectFunction<HTMLElement>;\n  targetRef: RefObjectFunction<HTMLElement>;\n  elementToRender: JSXElement | null;\n} {\n  const [stateStore] = React.useState(createSafeZoneAreaStateStore);\n\n  const safeZoneAreaRef = React.useRef<SafeZoneAreaImperativeHandle>(null);\n  const containerRef = React.useRef<HTMLElement>(null);\n  const targetRef = React.useRef<HTMLElement>(null);\n\n  const [setSafeZoneCloseTimeout, clearSafeZoneCloseTimeout] = useTimeout();\n  const [requestUpdateFrame, clearUpdateFrame] = useAnimationFrame();\n\n  const mouseCoordinatesRef = React.useRef<{ x: number; y: number }>({ x: 0, y: 0 });\n\n  const containerListenerRef = React.useMemo(() => {\n    if (disabled) {\n      return () => {\n        // do nothing\n      };\n    }\n\n    let containerEl: HTMLElement | null = null;\n\n    function onContainerMouseEnter() {\n      clearSafeZoneCloseTimeout();\n      stateStore.toggleActive(false);\n    }\n\n    return (el: HTMLElement | null) => {\n      if (el === null) {\n        containerEl?.removeEventListener('mouseenter', onContainerMouseEnter);\n      }\n\n      containerEl = el;\n      el?.addEventListener('mouseenter', onContainerMouseEnter);\n    };\n  }, [clearSafeZoneCloseTimeout, disabled, stateStore]);\n\n  const targetListenerRef = React.useMemo(() => {\n    if (disabled) {\n      return () => {\n        // do nothing\n      };\n    }\n\n    let targetEl: HTMLElement | null = null;\n\n    function onTargetMouseMove(e: MouseEvent) {\n      mouseCoordinatesRef.current = { x: e.clientX, y: e.clientY };\n\n      if (!stateStore.isActive()) {\n        stateStore.toggleActive(true);\n      }\n\n      setSafeZoneCloseTimeout(() => {\n        stateStore.toggleActive(false);\n      }, MOUSE_MOVE_TARGET_POLLING_TIMEOUT);\n    }\n\n    return (el: HTMLElement | null) => {\n      if (el === null) {\n        clearUpdateFrame();\n        clearSafeZoneCloseTimeout();\n\n        targetEl?.removeEventListener('mousemove', onTargetMouseMove);\n      }\n\n      targetEl = el;\n      el?.addEventListener('mousemove', onTargetMouseMove);\n    };\n  }, [clearUpdateFrame, clearSafeZoneCloseTimeout, disabled, stateStore, setSafeZoneCloseTimeout]);\n\n  const onSvgMouseEnter = useEventCallback((e: React.MouseEvent) => {\n    onSafeZoneEnter?.(e);\n\n    setSafeZoneCloseTimeout(() => {\n      stateStore.toggleActive(false);\n      onSafeZoneTimeout?.();\n    }, timeout);\n  });\n\n  const onSvgMouseMove = useEventCallback((e: React.MouseEvent) => {\n    setSafeZoneCloseTimeout(() => {\n      stateStore.toggleActive(false);\n      onSafeZoneTimeout?.();\n    }, timeout);\n    onSafeZoneMove?.(e);\n  });\n\n  const onSvgMouseLeave = useEventCallback((e: React.MouseEvent) => {\n    onSafeZoneLeave?.(e);\n  });\n\n  React.useEffect(() => {\n    return stateStore.subscribe(isActive => {\n      if (isActive) {\n        function updateSVGs() {\n          const containerEl = containerRef.current;\n          const targetEl = targetRef.current;\n\n          if (containerEl && targetEl) {\n            safeZoneAreaRef.current?.updateSVG({\n              containerRect: containerEl.getBoundingClientRect(),\n              mouseCoordinates: [mouseCoordinatesRef.current.x, mouseCoordinatesRef.current.y],\n              targetRect: targetEl.getBoundingClientRect(),\n            });\n          }\n\n          requestUpdateFrame(updateSVGs);\n        }\n\n        updateSVGs();\n        return;\n      }\n\n      clearUpdateFrame();\n    });\n  }, [clearUpdateFrame, requestUpdateFrame, stateStore]);\n\n  return {\n    containerRef: useMergedRefs(containerRef, containerListenerRef),\n    targetRef: useMergedRefs(targetRef, targetListenerRef),\n\n    elementToRender: React.useMemo(\n      () =>\n        disabled ? null : (\n          <SafeZoneArea\n            debug={debug}\n            onMouseEnter={onSvgMouseEnter}\n            onMouseMove={onSvgMouseMove}\n            onMouseLeave={onSvgMouseLeave}\n            imperativeRef={safeZoneAreaRef}\n            stateStore={stateStore}\n          />\n        ),\n      [disabled, debug, onSvgMouseEnter, onSvgMouseMove, onSvgMouseLeave, stateStore],\n    ),\n  };\n}\n"],"names":["useAnimationFrame","useEventCallback","useMergedRefs","useTimeout","React","createSafeZoneAreaStateStore","SafeZoneArea","MOUSE_MOVE_TARGET_POLLING_TIMEOUT","useSafeZoneArea","debug","disabled","onSafeZoneEnter","onSafeZoneMove","onSafeZoneLeave","onSafeZoneTimeout","timeout","stateStore","useState","safeZoneAreaRef","useRef","containerRef","targetRef","setSafeZoneCloseTimeout","clearSafeZoneCloseTimeout","requestUpdateFrame","clearUpdateFrame","mouseCoordinatesRef","x","y","containerListenerRef","useMemo","containerEl","onContainerMouseEnter","toggleActive","el","removeEventListener","addEventListener","targetListenerRef","targetEl","onTargetMouseMove","e","current","clientX","clientY","isActive","onSvgMouseEnter","onSvgMouseMove","onSvgMouseLeave","useEffect","subscribe","updateSVGs","updateSVG","containerRect","getBoundingClientRect","mouseCoordinates","targetRect","elementToRender","onMouseEnter","onMouseMove","onMouseLeave","imperativeRef"],"mappings":"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"}

package/lib/usePositioning.js

@@ -1,3 +1,4 @@
+'use client';
 import { canUseDOM, useEventCallback, useIsomorphicLayoutEffect } from '@fluentui/react-utilities';
 import * as React from 'react';
 import { POSITIONING_END_EVENT } from './constants';

package/lib/usePositioning.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/usePositioning.ts"],"sourcesContent":["import { canUseDOM, useEventCallback, useIsomorphicLayoutEffect } from '@fluentui/react-utilities';\nimport * as React from 'react';\n\nimport { POSITIONING_END_EVENT } from './constants';\nimport { createPositionManager } from './createPositionManager';\nimport type {\n  PositioningOptions,\n  PositioningProps,\n  PositionManager,\n  TargetElement,\n  UsePositioningReturn,\n} from './types';\nimport { usePositioningOptions } from './usePositioningOptions';\nimport { useCallbackRef, hasAutofocusFilter } from './utils';\n\n/**\n * @internal\n */\nexport function usePositioning(options: PositioningProps & PositioningOptions): UsePositioningReturn {\n  'use no memo';\n\n  const managerRef = React.useRef<PositionManager | null>(null);\n  const targetRef = React.useRef<TargetElement | null>(null);\n  const overrideTargetRef = React.useRef<TargetElement | null>(null);\n  const containerRef = React.useRef<HTMLElement | null>(null);\n  const arrowRef = React.useRef<HTMLElement | null>(null);\n\n  const { enabled = true } = options;\n  const resolvePositioningOptions = usePositioningOptions(options);\n  const updatePositionManager = React.useCallback(() => {\n    if (managerRef.current) {\n      managerRef.current.dispose();\n    }\n    managerRef.current = null;\n\n    const target = overrideTargetRef.current ?? targetRef.current;\n\n    if (enabled && canUseDOM() && target && containerRef.current) {\n      managerRef.current = createPositionManager({\n        container: containerRef.current,\n        target,\n        arrow: arrowRef.current,\n        ...resolvePositioningOptions(containerRef.current, arrowRef.current),\n      });\n    }\n  }, [enabled, resolvePositioningOptions]);\n\n  const setOverrideTarget = useEventCallback((target: TargetElement | null) => {\n    overrideTargetRef.current = target;\n    updatePositionManager();\n  });\n\n  React.useImperativeHandle(\n    options.positioningRef,\n    () => ({\n      updatePosition: () => managerRef.current?.updatePosition(),\n      setTarget: (target: TargetElement | null) => {\n        if (options.target && process.env.NODE_ENV !== 'production') {\n          const err = new Error();\n          // eslint-disable-next-line no-console\n          console.warn('Imperative setTarget should not be used at the same time as target option');\n          // eslint-disable-next-line no-console\n          console.warn(err.stack);\n        }\n\n        setOverrideTarget(target);\n      },\n    }),\n    [options.target, setOverrideTarget],\n  );\n\n  useIsomorphicLayoutEffect(() => {\n    setOverrideTarget(options.target ?? null);\n  }, [options.target, setOverrideTarget]);\n\n  useIsomorphicLayoutEffect(() => {\n    updatePositionManager();\n  }, [updatePositionManager]);\n\n  if (process.env.NODE_ENV !== 'production') {\n    // This checked should run only in development mode\n    // eslint-disable-next-line react-hooks/rules-of-hooks\n    React.useEffect(() => {\n      if (containerRef.current) {\n        const contentNode = containerRef.current;\n        const treeWalker = contentNode.ownerDocument?.createTreeWalker(contentNode, NodeFilter.SHOW_ELEMENT, {\n          acceptNode: hasAutofocusFilter,\n        });\n\n        while (treeWalker.nextNode()) {\n          const node = treeWalker.currentNode;\n          // eslint-disable-next-line no-console\n          console.warn('usePositioning():', node);\n          // eslint-disable-next-line no-console\n          console.warn(\n            [\n              'usePositioning(): ^ this node contains \"autoFocus\" prop on a React element. This can break the initial',\n              'positioning of an element and cause a window jump effect. This issue occurs because React polyfills',\n              '\"autoFocus\" behavior to solve inconsistencies between different browsers:',\n              'https://github.com/facebook/react/issues/11851#issuecomment-351787078',\n              '\\n',\n              'However, \".focus()\" in this case occurs before any other React effects will be executed',\n              '(React.useEffect(), componentDidMount(), etc.) and we can not prevent this behavior. If you really',\n              'want to use \"autoFocus\" please add \"position: fixed\" to styles of the element that is wrapped by',\n              '\"Popper\".',\n              `In general, it's not recommended to use \"autoFocus\" as it may break accessibility aspects:`,\n              'https://github.com/jsx-eslint/eslint-plugin-jsx-a11y/blob/master/docs/rules/no-autofocus.md',\n              '\\n',\n              'We suggest to use the \"trapFocus\" prop on Fluent components or a catch \"ref\" and then use',\n              '\"ref.current.focus\" in React.useEffect():',\n              'https://reactjs.org/docs/refs-and-the-dom.html#adding-a-ref-to-a-dom-element',\n            ].join(' '),\n          );\n        }\n      }\n      // We run this check once, no need to add deps here\n      // TODO: Should be rework to handle options.enabled and contentRef updates\n    }, []);\n  }\n\n  const setTarget = useCallbackRef<TargetElement>(null, target => {\n    if (targetRef.current !== target) {\n      targetRef.current = target;\n      updatePositionManager();\n    }\n  });\n\n  const onPositioningEnd = useEventCallback(() => options.onPositioningEnd?.());\n  const setContainer = useCallbackRef<HTMLElement | null>(null, container => {\n    if (containerRef.current !== container) {\n      containerRef.current?.removeEventListener(POSITIONING_END_EVENT, onPositioningEnd);\n      container?.addEventListener(POSITIONING_END_EVENT, onPositioningEnd);\n      containerRef.current = container;\n      updatePositionManager();\n    }\n  });\n\n  const setArrow = useCallbackRef<HTMLElement | null>(null, arrow => {\n    if (arrowRef.current !== arrow) {\n      arrowRef.current = arrow;\n      updatePositionManager();\n    }\n  });\n\n  // Let users use callback refs so they feel like 'normal' DOM refs\n  return { targetRef: setTarget, containerRef: setContainer, arrowRef: setArrow };\n}\n"],"names":["canUseDOM","useEventCallback","useIsomorphicLayoutEffect","React","POSITIONING_END_EVENT","createPositionManager","usePositioningOptions","useCallbackRef","hasAutofocusFilter","usePositioning","options","managerRef","useRef","targetRef","overrideTargetRef","containerRef","arrowRef","enabled","resolvePositioningOptions","updatePositionManager","useCallback","current","dispose","target","container","arrow","setOverrideTarget","useImperativeHandle","positioningRef","updatePosition","setTarget","process","env","NODE_ENV","err","Error","console","warn","stack","useEffect","contentNode","treeWalker","ownerDocument","createTreeWalker","NodeFilter","SHOW_ELEMENT","acceptNode","nextNode","node","currentNode","join","onPositioningEnd","setContainer","removeEventListener","addEventListener","setArrow"],"mappings":"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"}
+{"version":3,"sources":["../src/usePositioning.ts"],"sourcesContent":["'use client';\n\nimport { canUseDOM, useEventCallback, useIsomorphicLayoutEffect } from '@fluentui/react-utilities';\nimport * as React from 'react';\n\nimport { POSITIONING_END_EVENT } from './constants';\nimport { createPositionManager } from './createPositionManager';\nimport type {\n  PositioningOptions,\n  PositioningProps,\n  PositionManager,\n  TargetElement,\n  UsePositioningReturn,\n} from './types';\nimport { usePositioningOptions } from './usePositioningOptions';\nimport { useCallbackRef, hasAutofocusFilter } from './utils';\n\n/**\n * @internal\n */\nexport function usePositioning(options: PositioningProps & PositioningOptions): UsePositioningReturn {\n  'use no memo';\n\n  const managerRef = React.useRef<PositionManager | null>(null);\n  const targetRef = React.useRef<TargetElement | null>(null);\n  const overrideTargetRef = React.useRef<TargetElement | null>(null);\n  const containerRef = React.useRef<HTMLElement | null>(null);\n  const arrowRef = React.useRef<HTMLElement | null>(null);\n\n  const { enabled = true } = options;\n  const resolvePositioningOptions = usePositioningOptions(options);\n  const updatePositionManager = React.useCallback(() => {\n    if (managerRef.current) {\n      managerRef.current.dispose();\n    }\n    managerRef.current = null;\n\n    const target = overrideTargetRef.current ?? targetRef.current;\n\n    if (enabled && canUseDOM() && target && containerRef.current) {\n      managerRef.current = createPositionManager({\n        container: containerRef.current,\n        target,\n        arrow: arrowRef.current,\n        ...resolvePositioningOptions(containerRef.current, arrowRef.current),\n      });\n    }\n  }, [enabled, resolvePositioningOptions]);\n\n  const setOverrideTarget = useEventCallback((target: TargetElement | null) => {\n    overrideTargetRef.current = target;\n    updatePositionManager();\n  });\n\n  React.useImperativeHandle(\n    options.positioningRef,\n    () => ({\n      updatePosition: () => managerRef.current?.updatePosition(),\n      setTarget: (target: TargetElement | null) => {\n        if (options.target && process.env.NODE_ENV !== 'production') {\n          const err = new Error();\n          // eslint-disable-next-line no-console\n          console.warn('Imperative setTarget should not be used at the same time as target option');\n          // eslint-disable-next-line no-console\n          console.warn(err.stack);\n        }\n\n        setOverrideTarget(target);\n      },\n    }),\n    [options.target, setOverrideTarget],\n  );\n\n  useIsomorphicLayoutEffect(() => {\n    setOverrideTarget(options.target ?? null);\n  }, [options.target, setOverrideTarget]);\n\n  useIsomorphicLayoutEffect(() => {\n    updatePositionManager();\n  }, [updatePositionManager]);\n\n  if (process.env.NODE_ENV !== 'production') {\n    // This checked should run only in development mode\n    // eslint-disable-next-line react-hooks/rules-of-hooks\n    React.useEffect(() => {\n      if (containerRef.current) {\n        const contentNode = containerRef.current;\n        const treeWalker = contentNode.ownerDocument?.createTreeWalker(contentNode, NodeFilter.SHOW_ELEMENT, {\n          acceptNode: hasAutofocusFilter,\n        });\n\n        while (treeWalker.nextNode()) {\n          const node = treeWalker.currentNode;\n          // eslint-disable-next-line no-console\n          console.warn('usePositioning():', node);\n          // eslint-disable-next-line no-console\n          console.warn(\n            [\n              'usePositioning(): ^ this node contains \"autoFocus\" prop on a React element. This can break the initial',\n              'positioning of an element and cause a window jump effect. This issue occurs because React polyfills',\n              '\"autoFocus\" behavior to solve inconsistencies between different browsers:',\n              'https://github.com/facebook/react/issues/11851#issuecomment-351787078',\n              '\\n',\n              'However, \".focus()\" in this case occurs before any other React effects will be executed',\n              '(React.useEffect(), componentDidMount(), etc.) and we can not prevent this behavior. If you really',\n              'want to use \"autoFocus\" please add \"position: fixed\" to styles of the element that is wrapped by',\n              '\"Popper\".',\n              `In general, it's not recommended to use \"autoFocus\" as it may break accessibility aspects:`,\n              'https://github.com/jsx-eslint/eslint-plugin-jsx-a11y/blob/master/docs/rules/no-autofocus.md',\n              '\\n',\n              'We suggest to use the \"trapFocus\" prop on Fluent components or a catch \"ref\" and then use',\n              '\"ref.current.focus\" in React.useEffect():',\n              'https://reactjs.org/docs/refs-and-the-dom.html#adding-a-ref-to-a-dom-element',\n            ].join(' '),\n          );\n        }\n      }\n      // We run this check once, no need to add deps here\n      // TODO: Should be rework to handle options.enabled and contentRef updates\n    }, []);\n  }\n\n  const setTarget = useCallbackRef<TargetElement>(null, target => {\n    if (targetRef.current !== target) {\n      targetRef.current = target;\n      updatePositionManager();\n    }\n  });\n\n  const onPositioningEnd = useEventCallback(() => options.onPositioningEnd?.());\n  const setContainer = useCallbackRef<HTMLElement | null>(null, container => {\n    if (containerRef.current !== container) {\n      containerRef.current?.removeEventListener(POSITIONING_END_EVENT, onPositioningEnd);\n      container?.addEventListener(POSITIONING_END_EVENT, onPositioningEnd);\n      containerRef.current = container;\n      updatePositionManager();\n    }\n  });\n\n  const setArrow = useCallbackRef<HTMLElement | null>(null, arrow => {\n    if (arrowRef.current !== arrow) {\n      arrowRef.current = arrow;\n      updatePositionManager();\n    }\n  });\n\n  // Let users use callback refs so they feel like 'normal' DOM refs\n  return { targetRef: setTarget, containerRef: setContainer, arrowRef: setArrow };\n}\n"],"names":["canUseDOM","useEventCallback","useIsomorphicLayoutEffect","React","POSITIONING_END_EVENT","createPositionManager","usePositioningOptions","useCallbackRef","hasAutofocusFilter","usePositioning","options","managerRef","useRef","targetRef","overrideTargetRef","containerRef","arrowRef","enabled","resolvePositioningOptions","updatePositionManager","useCallback","current","dispose","target","container","arrow","setOverrideTarget","useImperativeHandle","positioningRef","updatePosition","setTarget","process","env","NODE_ENV","err","Error","console","warn","stack","useEffect","contentNode","treeWalker","ownerDocument","createTreeWalker","NodeFilter","SHOW_ELEMENT","acceptNode","nextNode","node","currentNode","join","onPositioningEnd","setContainer","removeEventListener","addEventListener","setArrow"],"mappings":"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"}

package/lib/usePositioningMouseTarget.js

@@ -1,3 +1,4 @@
+'use client';
 import * as React from 'react';
 import { createVirtualElementFromClick } from './createVirtualElementFromClick';
 /**

package/lib/usePositioningMouseTarget.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/usePositioningMouseTarget.ts"],"sourcesContent":["import * as React from 'react';\nimport { createVirtualElementFromClick } from './createVirtualElementFromClick';\nimport { PositioningVirtualElement, SetVirtualMouseTarget } from './types';\n\n/**\n * @internal\n * A state hook that manages a popper virtual element from mouseevents.\n * Useful for scenarios where a component needs to be positioned by mouse click (e.g. contextmenu)\n * React synthetic events are not persisted by this hook\n *\n * @param initialState - initializes a user provided state similare to useState\n * @returns state and dispatcher for a Popper virtual element that uses native/synthetic mouse events\n */\nexport const usePositioningMouseTarget = (\n  initialState?: PositioningVirtualElement | (() => PositioningVirtualElement),\n): readonly [PositioningVirtualElement | undefined, SetVirtualMouseTarget] => {\n  const [virtualElement, setVirtualElement] = React.useState<PositioningVirtualElement | undefined>(initialState);\n\n  const setVirtualMouseTarget: SetVirtualMouseTarget = event => {\n    if (event === undefined || event === null) {\n      setVirtualElement(undefined);\n      return;\n    }\n\n    let mouseevent: MouseEvent;\n    if (!(event instanceof MouseEvent)) {\n      mouseevent = event.nativeEvent;\n    } else {\n      mouseevent = event;\n    }\n\n    if (!(mouseevent instanceof MouseEvent) && process.env.NODE_ENV !== 'production') {\n      // eslint-disable-next-line no-console\n      console.error('usePositioningMouseTarget should only be used with MouseEvent');\n    }\n\n    const contextTarget = createVirtualElementFromClick(mouseevent);\n    setVirtualElement(contextTarget);\n  };\n\n  return [virtualElement, setVirtualMouseTarget] as const;\n};\n"],"names":["React","createVirtualElementFromClick","usePositioningMouseTarget","initialState","virtualElement","setVirtualElement","useState","setVirtualMouseTarget","event","undefined","mouseevent","MouseEvent","nativeEvent","process","env","NODE_ENV","console","error","contextTarget"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,6BAA6B,QAAQ,kCAAkC;AAGhF;;;;;;;;CAQC,GACD,OAAO,MAAMC,4BAA4B,CACvCC;IAEA,MAAM,CAACC,gBAAgBC,kBAAkB,GAAGL,MAAMM,QAAQ,CAAwCH;IAElG,MAAMI,wBAA+CC,CAAAA;QACnD,IAAIA,UAAUC,aAAaD,UAAU,MAAM;YACzCH,kBAAkBI;YAClB;QACF;QAEA,IAAIC;QACJ,IAAI,CAAEF,CAAAA,iBAAiBG,UAAS,GAAI;YAClCD,aAAaF,MAAMI,WAAW;QAChC,OAAO;YACLF,aAAaF;QACf;QAEA,IAAI,CAAEE,CAAAA,sBAAsBC,UAAS,KAAME,QAAQC,GAAG,CAACC,QAAQ,KAAK,cAAc;YAChF,sCAAsC;YACtCC,QAAQC,KAAK,CAAC;QAChB;QAEA,MAAMC,gBAAgBjB,8BAA8BS;QACpDL,kBAAkBa;IACpB;IAEA,OAAO;QAACd;QAAgBG;KAAsB;AAChD,EAAE"}
+{"version":3,"sources":["../src/usePositioningMouseTarget.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { createVirtualElementFromClick } from './createVirtualElementFromClick';\nimport { PositioningVirtualElement, SetVirtualMouseTarget } from './types';\n\n/**\n * @internal\n * A state hook that manages a popper virtual element from mouseevents.\n * Useful for scenarios where a component needs to be positioned by mouse click (e.g. contextmenu)\n * React synthetic events are not persisted by this hook\n *\n * @param initialState - initializes a user provided state similare to useState\n * @returns state and dispatcher for a Popper virtual element that uses native/synthetic mouse events\n */\nexport const usePositioningMouseTarget = (\n  initialState?: PositioningVirtualElement | (() => PositioningVirtualElement),\n): readonly [PositioningVirtualElement | undefined, SetVirtualMouseTarget] => {\n  const [virtualElement, setVirtualElement] = React.useState<PositioningVirtualElement | undefined>(initialState);\n\n  const setVirtualMouseTarget: SetVirtualMouseTarget = event => {\n    if (event === undefined || event === null) {\n      setVirtualElement(undefined);\n      return;\n    }\n\n    let mouseevent: MouseEvent;\n    if (!(event instanceof MouseEvent)) {\n      mouseevent = event.nativeEvent;\n    } else {\n      mouseevent = event;\n    }\n\n    if (!(mouseevent instanceof MouseEvent) && process.env.NODE_ENV !== 'production') {\n      // eslint-disable-next-line no-console\n      console.error('usePositioningMouseTarget should only be used with MouseEvent');\n    }\n\n    const contextTarget = createVirtualElementFromClick(mouseevent);\n    setVirtualElement(contextTarget);\n  };\n\n  return [virtualElement, setVirtualMouseTarget] as const;\n};\n"],"names":["React","createVirtualElementFromClick","usePositioningMouseTarget","initialState","virtualElement","setVirtualElement","useState","setVirtualMouseTarget","event","undefined","mouseevent","MouseEvent","nativeEvent","process","env","NODE_ENV","console","error","contextTarget"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,6BAA6B,QAAQ,kCAAkC;AAGhF;;;;;;;;CAQC,GACD,OAAO,MAAMC,4BAA4B,CACvCC;IAEA,MAAM,CAACC,gBAAgBC,kBAAkB,GAAGL,MAAMM,QAAQ,CAAwCH;IAElG,MAAMI,wBAA+CC,CAAAA;QACnD,IAAIA,UAAUC,aAAaD,UAAU,MAAM;YACzCH,kBAAkBI;YAClB;QACF;QAEA,IAAIC;QACJ,IAAI,CAAEF,CAAAA,iBAAiBG,UAAS,GAAI;YAClCD,aAAaF,MAAMI,WAAW;QAChC,OAAO;YACLF,aAAaF;QACf;QAEA,IAAI,CAAEE,CAAAA,sBAAsBC,UAAS,KAAME,QAAQC,GAAG,CAACC,QAAQ,KAAK,cAAc;YAChF,sCAAsC;YACtCC,QAAQC,KAAK,CAAC;QAChB;QAEA,MAAMC,gBAAgBjB,8BAA8BS;QACpDL,kBAAkBa;IACpB;IAEA,OAAO;QAACd;QAAgBG;KAAsB;AAChD,EAAE"}

package/lib/usePositioningOptions.js

@@ -1,3 +1,4 @@
+'use client';
 import { devtools } from '@floating-ui/devtools';
 import { hide as hideMiddleware, arrow as arrowMiddleware } from '@floating-ui/dom';
 import { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';

package/lib/usePositioningOptions.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/usePositioningOptions.ts"],"sourcesContent":["import { devtools } from '@floating-ui/devtools';\nimport { hide as hideMiddleware, arrow as arrowMiddleware } from '@floating-ui/dom';\nimport type { Middleware, Placement, Strategy } from '@floating-ui/dom';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport * as React from 'react';\n\nimport {\n  shift as shiftMiddleware,\n  flip as flipMiddleware,\n  coverTarget as coverTargetMiddleware,\n  maxSize as maxSizeMiddleware,\n  resetMaxSize as resetMaxSizeMiddleware,\n  offset as offsetMiddleware,\n  intersecting as intersectingMiddleware,\n  matchTargetSize as matchTargetSizeMiddleware,\n} from './middleware';\nimport type { PositioningConfigurationFn, PositioningConfigurationFnOptions, PositioningOptions } from './types';\nimport { toFloatingUIPlacement, hasScrollParent, normalizeAutoSize } from './utils';\nimport { devtoolsCallback } from './utils/devtools';\nimport { usePositioningConfiguration } from './PositioningConfigurationContext';\n\n/**\n * @internal\n *\n * This is redundant and exists only to manage React dependencies properly & avoid leaking individual options to the\n * scope of `usePositioningOptions`.\n */\nfunction usePositioningConfigFn(\n  configFn: PositioningConfigurationFn,\n  options: PositioningOptions,\n): (container: HTMLElement, arrow: HTMLElement | null) => PositioningConfigurationFnOptions {\n  const {\n    align,\n    arrowPadding,\n    autoSize,\n    coverTarget,\n    disableUpdateOnResize,\n    flipBoundary,\n    offset,\n    overflowBoundary,\n    pinned,\n    position,\n    // eslint-disable-next-line @typescript-eslint/naming-convention\n    unstable_disableTether,\n    strategy,\n    overflowBoundaryPadding,\n    fallbackPositions,\n    useTransform,\n    matchTargetSize,\n    shiftToCoverTarget,\n  } = options;\n\n  return React.useCallback(\n    (container: HTMLElement, arrow: HTMLElement | null) => {\n      return configFn({\n        container,\n        arrow,\n        options: {\n          autoSize,\n          disableUpdateOnResize,\n          matchTargetSize,\n          offset,\n          strategy,\n          coverTarget,\n          flipBoundary,\n          overflowBoundary,\n          useTransform,\n          overflowBoundaryPadding,\n          pinned,\n          arrowPadding,\n          align,\n          fallbackPositions,\n          shiftToCoverTarget,\n          position,\n          // eslint-disable-next-line @typescript-eslint/naming-convention\n          unstable_disableTether,\n        },\n      });\n    },\n    [\n      autoSize,\n      disableUpdateOnResize,\n      matchTargetSize,\n      offset,\n      strategy,\n      coverTarget,\n      flipBoundary,\n      overflowBoundary,\n      useTransform,\n      overflowBoundaryPadding,\n      pinned,\n      arrowPadding,\n      align,\n      fallbackPositions,\n      shiftToCoverTarget,\n      position,\n      unstable_disableTether,\n      configFn,\n    ],\n  );\n}\n\n/**\n * @internal\n */\nexport function usePositioningOptions(options: PositioningOptions): (\n  container: HTMLElement,\n  arrow: HTMLElement | null,\n) => {\n  placement: Placement | undefined;\n  middleware: Middleware[];\n  strategy: Strategy;\n  disableUpdateOnResize?: boolean;\n  useTransform?: boolean;\n} {\n  const { dir, targetDocument } = useFluent();\n  const isRtl = dir === 'rtl';\n\n  const configFn = usePositioningConfigFn(usePositioningConfiguration(), options);\n  const {\n    // eslint-disable-next-line @typescript-eslint/no-deprecated\n    positionFixed,\n  } = options;\n\n  return React.useCallback(\n    (container: HTMLElement, arrow: HTMLElement | null) => {\n      const hasScrollableElement = hasScrollParent(container);\n\n      const optionsAfterEnhancement = configFn(container, arrow);\n      const {\n        autoSize,\n        disableUpdateOnResize,\n        matchTargetSize,\n        offset,\n        coverTarget,\n        flipBoundary,\n        overflowBoundary,\n        useTransform,\n        overflowBoundaryPadding,\n        pinned,\n        position,\n        arrowPadding,\n        strategy,\n        align,\n        fallbackPositions,\n        shiftToCoverTarget,\n        // eslint-disable-next-line @typescript-eslint/naming-convention\n        unstable_disableTether,\n      } = optionsAfterEnhancement;\n      const normalizedAutoSize = normalizeAutoSize(autoSize);\n\n      const middleware = [\n        normalizedAutoSize && resetMaxSizeMiddleware(normalizedAutoSize),\n        matchTargetSize && matchTargetSizeMiddleware(),\n        offset && offsetMiddleware(offset),\n        coverTarget && coverTargetMiddleware(),\n        !pinned && flipMiddleware({ container, flipBoundary, hasScrollableElement, isRtl, fallbackPositions }),\n        shiftMiddleware({\n          container,\n          hasScrollableElement,\n          overflowBoundary,\n          disableTether: unstable_disableTether,\n          overflowBoundaryPadding,\n          isRtl,\n          shiftToCoverTarget,\n        }),\n        normalizedAutoSize &&\n          maxSizeMiddleware(normalizedAutoSize, { container, overflowBoundary, overflowBoundaryPadding, isRtl }),\n        intersectingMiddleware(),\n        arrow && arrowMiddleware({ element: arrow, padding: arrowPadding }),\n        hideMiddleware({ strategy: 'referenceHidden' }),\n        hideMiddleware({ strategy: 'escaped' }),\n        process.env.NODE_ENV !== 'production' &&\n          targetDocument &&\n          devtools(targetDocument, devtoolsCallback(optionsAfterEnhancement)),\n      ].filter(Boolean) as Middleware[];\n\n      const placement = toFloatingUIPlacement(align, position, isRtl);\n\n      return {\n        placement,\n        middleware,\n        strategy: strategy ?? positionFixed ? ('fixed' as const) : ('absolute' as const),\n\n        disableUpdateOnResize,\n        useTransform,\n      };\n    },\n    [configFn, isRtl, targetDocument, positionFixed],\n  );\n}\n"],"names":["devtools","hide","hideMiddleware","arrow","arrowMiddleware","useFluent_unstable","useFluent","React","shift","shiftMiddleware","flip","flipMiddleware","coverTarget","coverTargetMiddleware","maxSize","maxSizeMiddleware","resetMaxSize","resetMaxSizeMiddleware","offset","offsetMiddleware","intersecting","intersectingMiddleware","matchTargetSize","matchTargetSizeMiddleware","toFloatingUIPlacement","hasScrollParent","normalizeAutoSize","devtoolsCallback","usePositioningConfiguration","usePositioningConfigFn","configFn","options","align","arrowPadding","autoSize","disableUpdateOnResize","flipBoundary","overflowBoundary","pinned","position","unstable_disableTether","strategy","overflowBoundaryPadding","fallbackPositions","useTransform","shiftToCoverTarget","useCallback","container","usePositioningOptions","dir","targetDocument","isRtl","positionFixed","hasScrollableElement","optionsAfterEnhancement","normalizedAutoSize","middleware","disableTether","element","padding","process","env","NODE_ENV","filter","Boolean","placement"],"mappings":"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"}
+{"version":3,"sources":["../src/usePositioningOptions.ts"],"sourcesContent":["'use client';\n\nimport { devtools } from '@floating-ui/devtools';\nimport { hide as hideMiddleware, arrow as arrowMiddleware } from '@floating-ui/dom';\nimport type { Middleware, Placement, Strategy } from '@floating-ui/dom';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport * as React from 'react';\n\nimport {\n  shift as shiftMiddleware,\n  flip as flipMiddleware,\n  coverTarget as coverTargetMiddleware,\n  maxSize as maxSizeMiddleware,\n  resetMaxSize as resetMaxSizeMiddleware,\n  offset as offsetMiddleware,\n  intersecting as intersectingMiddleware,\n  matchTargetSize as matchTargetSizeMiddleware,\n} from './middleware';\nimport type { PositioningConfigurationFn, PositioningConfigurationFnOptions, PositioningOptions } from './types';\nimport { toFloatingUIPlacement, hasScrollParent, normalizeAutoSize } from './utils';\nimport { devtoolsCallback } from './utils/devtools';\nimport { usePositioningConfiguration } from './PositioningConfigurationContext';\n\n/**\n * @internal\n *\n * This is redundant and exists only to manage React dependencies properly & avoid leaking individual options to the\n * scope of `usePositioningOptions`.\n */\nfunction usePositioningConfigFn(\n  configFn: PositioningConfigurationFn,\n  options: PositioningOptions,\n): (container: HTMLElement, arrow: HTMLElement | null) => PositioningConfigurationFnOptions {\n  const {\n    align,\n    arrowPadding,\n    autoSize,\n    coverTarget,\n    disableUpdateOnResize,\n    flipBoundary,\n    offset,\n    overflowBoundary,\n    pinned,\n    position,\n    // eslint-disable-next-line @typescript-eslint/naming-convention\n    unstable_disableTether,\n    strategy,\n    overflowBoundaryPadding,\n    fallbackPositions,\n    useTransform,\n    matchTargetSize,\n    shiftToCoverTarget,\n  } = options;\n\n  return React.useCallback(\n    (container: HTMLElement, arrow: HTMLElement | null) => {\n      return configFn({\n        container,\n        arrow,\n        options: {\n          autoSize,\n          disableUpdateOnResize,\n          matchTargetSize,\n          offset,\n          strategy,\n          coverTarget,\n          flipBoundary,\n          overflowBoundary,\n          useTransform,\n          overflowBoundaryPadding,\n          pinned,\n          arrowPadding,\n          align,\n          fallbackPositions,\n          shiftToCoverTarget,\n          position,\n          // eslint-disable-next-line @typescript-eslint/naming-convention\n          unstable_disableTether,\n        },\n      });\n    },\n    [\n      autoSize,\n      disableUpdateOnResize,\n      matchTargetSize,\n      offset,\n      strategy,\n      coverTarget,\n      flipBoundary,\n      overflowBoundary,\n      useTransform,\n      overflowBoundaryPadding,\n      pinned,\n      arrowPadding,\n      align,\n      fallbackPositions,\n      shiftToCoverTarget,\n      position,\n      unstable_disableTether,\n      configFn,\n    ],\n  );\n}\n\n/**\n * @internal\n */\nexport function usePositioningOptions(options: PositioningOptions): (\n  container: HTMLElement,\n  arrow: HTMLElement | null,\n) => {\n  placement: Placement | undefined;\n  middleware: Middleware[];\n  strategy: Strategy;\n  disableUpdateOnResize?: boolean;\n  useTransform?: boolean;\n} {\n  const { dir, targetDocument } = useFluent();\n  const isRtl = dir === 'rtl';\n\n  const configFn = usePositioningConfigFn(usePositioningConfiguration(), options);\n  const {\n    // eslint-disable-next-line @typescript-eslint/no-deprecated\n    positionFixed,\n  } = options;\n\n  return React.useCallback(\n    (container: HTMLElement, arrow: HTMLElement | null) => {\n      const hasScrollableElement = hasScrollParent(container);\n\n      const optionsAfterEnhancement = configFn(container, arrow);\n      const {\n        autoSize,\n        disableUpdateOnResize,\n        matchTargetSize,\n        offset,\n        coverTarget,\n        flipBoundary,\n        overflowBoundary,\n        useTransform,\n        overflowBoundaryPadding,\n        pinned,\n        position,\n        arrowPadding,\n        strategy,\n        align,\n        fallbackPositions,\n        shiftToCoverTarget,\n        // eslint-disable-next-line @typescript-eslint/naming-convention\n        unstable_disableTether,\n      } = optionsAfterEnhancement;\n      const normalizedAutoSize = normalizeAutoSize(autoSize);\n\n      const middleware = [\n        normalizedAutoSize && resetMaxSizeMiddleware(normalizedAutoSize),\n        matchTargetSize && matchTargetSizeMiddleware(),\n        offset && offsetMiddleware(offset),\n        coverTarget && coverTargetMiddleware(),\n        !pinned && flipMiddleware({ container, flipBoundary, hasScrollableElement, isRtl, fallbackPositions }),\n        shiftMiddleware({\n          container,\n          hasScrollableElement,\n          overflowBoundary,\n          disableTether: unstable_disableTether,\n          overflowBoundaryPadding,\n          isRtl,\n          shiftToCoverTarget,\n        }),\n        normalizedAutoSize &&\n          maxSizeMiddleware(normalizedAutoSize, { container, overflowBoundary, overflowBoundaryPadding, isRtl }),\n        intersectingMiddleware(),\n        arrow && arrowMiddleware({ element: arrow, padding: arrowPadding }),\n        hideMiddleware({ strategy: 'referenceHidden' }),\n        hideMiddleware({ strategy: 'escaped' }),\n        process.env.NODE_ENV !== 'production' &&\n          targetDocument &&\n          devtools(targetDocument, devtoolsCallback(optionsAfterEnhancement)),\n      ].filter(Boolean) as Middleware[];\n\n      const placement = toFloatingUIPlacement(align, position, isRtl);\n\n      return {\n        placement,\n        middleware,\n        strategy: strategy ?? positionFixed ? ('fixed' as const) : ('absolute' as const),\n\n        disableUpdateOnResize,\n        useTransform,\n      };\n    },\n    [configFn, isRtl, targetDocument, positionFixed],\n  );\n}\n"],"names":["devtools","hide","hideMiddleware","arrow","arrowMiddleware","useFluent_unstable","useFluent","React","shift","shiftMiddleware","flip","flipMiddleware","coverTarget","coverTargetMiddleware","maxSize","maxSizeMiddleware","resetMaxSize","resetMaxSizeMiddleware","offset","offsetMiddleware","intersecting","intersectingMiddleware","matchTargetSize","matchTargetSizeMiddleware","toFloatingUIPlacement","hasScrollParent","normalizeAutoSize","devtoolsCallback","usePositioningConfiguration","usePositioningConfigFn","configFn","options","align","arrowPadding","autoSize","disableUpdateOnResize","flipBoundary","overflowBoundary","pinned","position","unstable_disableTether","strategy","overflowBoundaryPadding","fallbackPositions","useTransform","shiftToCoverTarget","useCallback","container","usePositioningOptions","dir","targetDocument","isRtl","positionFixed","hasScrollableElement","optionsAfterEnhancement","normalizedAutoSize","middleware","disableTether","element","padding","process","env","NODE_ENV","filter","Boolean","placement"],"mappings":"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"}

package/lib/utils/getScrollParent.js

@@ -2,7 +2,8 @@
  * Returns the parent node or the host of the node argument.
  * @param node - DOM node.
  * @returns - parent DOM node.
- */ export const getParentNode = (node)=>{
+ */ 'use client';
+export const getParentNode = (node)=>{
     if (node.nodeName === 'HTML') {
         return node;
     }

package/lib/utils/getScrollParent.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/utils/getScrollParent.ts"],"sourcesContent":["/**\n * Returns the parent node or the host of the node argument.\n * @param node - DOM node.\n * @returns - parent DOM node.\n */\nexport const getParentNode = (node: HTMLElement): HTMLElement => {\n  if (node.nodeName === 'HTML') {\n    return node;\n  }\n\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  return node.parentNode || (node as any).host;\n};\n\n/**\n * Returns CSS styles of the given node.\n * @param node - DOM node.\n * @returns - CSS styles.\n */\nexport const getStyleComputedProperty = (node: HTMLElement): Partial<CSSStyleDeclaration> => {\n  if (node.nodeType !== 1) {\n    return {};\n  }\n\n  const targetWindow = node.ownerDocument?.defaultView;\n\n  if (targetWindow) {\n    return targetWindow.getComputedStyle(node, null);\n  }\n\n  return {};\n};\n\n/**\n * Returns the first scrollable parent of the given element.\n * @param node - DOM node.\n * @returns - the first scrollable parent.\n */\nexport const getScrollParent = (node: Document | HTMLElement | null): HTMLElement => {\n  // Return body, `getScroll` will take care to get the correct `scrollTop` from it\n  const parentNode = node && getParentNode(node as HTMLElement);\n  // eslint-disable-next-line\n  if (!parentNode) return document.body;\n\n  switch (parentNode.nodeName) {\n    case 'HTML':\n    case 'BODY':\n      return parentNode.ownerDocument!.body;\n    case '#document':\n      return (parentNode as unknown as Document).body;\n  }\n\n  // If any of the overflow props is defined for the node then we return it as the parent\n  const { overflow, overflowX, overflowY } = getStyleComputedProperty(parentNode);\n  if (/(auto|scroll|overlay)/.test(overflow! + overflowY! + overflowX)) {\n    return parentNode;\n  }\n\n  return getScrollParent(parentNode);\n};\n\nexport const hasScrollParent = (node: Document | HTMLElement | null): boolean => {\n  const scrollParentElement: HTMLElement = getScrollParent(node);\n\n  return scrollParentElement ? scrollParentElement !== scrollParentElement.ownerDocument?.body : false;\n};\n"],"names":["getParentNode","node","nodeName","parentNode","host","getStyleComputedProperty","nodeType","targetWindow","ownerDocument","defaultView","getComputedStyle","getScrollParent","document","body","overflow","overflowX","overflowY","test","hasScrollParent","scrollParentElement"],"mappings":"AAAA;;;;CAIC,GACD,OAAO,MAAMA,gBAAgB,CAACC;IAC5B,IAAIA,KAAKC,QAAQ,KAAK,QAAQ;QAC5B,OAAOD;IACT;IAEA,8DAA8D;IAC9D,OAAOA,KAAKE,UAAU,IAAI,AAACF,KAAaG,IAAI;AAC9C,EAAE;AAEF;;;;CAIC,GACD,OAAO,MAAMC,2BAA2B,CAACJ;QAKlBA;IAJrB,IAAIA,KAAKK,QAAQ,KAAK,GAAG;QACvB,OAAO,CAAC;IACV;IAEA,MAAMC,gBAAeN,sBAAAA,KAAKO,aAAa,cAAlBP,0CAAAA,oBAAoBQ,WAAW;IAEpD,IAAIF,cAAc;QAChB,OAAOA,aAAaG,gBAAgB,CAACT,MAAM;IAC7C;IAEA,OAAO,CAAC;AACV,EAAE;AAEF;;;;CAIC,GACD,OAAO,MAAMU,kBAAkB,CAACV;IAC9B,iFAAiF;IACjF,MAAME,aAAaF,QAAQD,cAAcC;IACzC,2BAA2B;IAC3B,IAAI,CAACE,YAAY,OAAOS,SAASC,IAAI;IAErC,OAAQV,WAAWD,QAAQ;QACzB,KAAK;QACL,KAAK;YACH,OAAOC,WAAWK,aAAa,CAAEK,IAAI;QACvC,KAAK;YACH,OAAO,AAACV,WAAmCU,IAAI;IACnD;IAEA,uFAAuF;IACvF,MAAM,EAAEC,QAAQ,EAAEC,SAAS,EAAEC,SAAS,EAAE,GAAGX,yBAAyBF;IACpE,IAAI,wBAAwBc,IAAI,CAACH,WAAYE,YAAaD,YAAY;QACpE,OAAOZ;IACT;IAEA,OAAOQ,gBAAgBR;AACzB,EAAE;AAEF,OAAO,MAAMe,kBAAkB,CAACjB;QAGuBkB;IAFrD,MAAMA,sBAAmCR,gBAAgBV;IAEzD,OAAOkB,sBAAsBA,0BAAwBA,qCAAAA,oBAAoBX,aAAa,cAAjCW,yDAAAA,mCAAmCN,IAAI,IAAG;AACjG,EAAE"}
+{"version":3,"sources":["../src/utils/getScrollParent.ts"],"sourcesContent":["/**\n * Returns the parent node or the host of the node argument.\n * @param node - DOM node.\n * @returns - parent DOM node.\n */\n\n'use client';\n\nexport const getParentNode = (node: HTMLElement): HTMLElement => {\n  if (node.nodeName === 'HTML') {\n    return node;\n  }\n\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  return node.parentNode || (node as any).host;\n};\n\n/**\n * Returns CSS styles of the given node.\n * @param node - DOM node.\n * @returns - CSS styles.\n */\nexport const getStyleComputedProperty = (node: HTMLElement): Partial<CSSStyleDeclaration> => {\n  if (node.nodeType !== 1) {\n    return {};\n  }\n\n  const targetWindow = node.ownerDocument?.defaultView;\n\n  if (targetWindow) {\n    return targetWindow.getComputedStyle(node, null);\n  }\n\n  return {};\n};\n\n/**\n * Returns the first scrollable parent of the given element.\n * @param node - DOM node.\n * @returns - the first scrollable parent.\n */\nexport const getScrollParent = (node: Document | HTMLElement | null): HTMLElement => {\n  // Return body, `getScroll` will take care to get the correct `scrollTop` from it\n  const parentNode = node && getParentNode(node as HTMLElement);\n  // eslint-disable-next-line\n  if (!parentNode) return document.body;\n\n  switch (parentNode.nodeName) {\n    case 'HTML':\n    case 'BODY':\n      return parentNode.ownerDocument!.body;\n    case '#document':\n      return (parentNode as unknown as Document).body;\n  }\n\n  // If any of the overflow props is defined for the node then we return it as the parent\n  const { overflow, overflowX, overflowY } = getStyleComputedProperty(parentNode);\n  if (/(auto|scroll|overlay)/.test(overflow! + overflowY! + overflowX)) {\n    return parentNode;\n  }\n\n  return getScrollParent(parentNode);\n};\n\nexport const hasScrollParent = (node: Document | HTMLElement | null): boolean => {\n  const scrollParentElement: HTMLElement = getScrollParent(node);\n\n  return scrollParentElement ? scrollParentElement !== scrollParentElement.ownerDocument?.body : false;\n};\n"],"names":["getParentNode","node","nodeName","parentNode","host","getStyleComputedProperty","nodeType","targetWindow","ownerDocument","defaultView","getComputedStyle","getScrollParent","document","body","overflow","overflowX","overflowY","test","hasScrollParent","scrollParentElement"],"mappings":"AAAA;;;;CAIC,GAED;AAEA,OAAO,MAAMA,gBAAgB,CAACC;IAC5B,IAAIA,KAAKC,QAAQ,KAAK,QAAQ;QAC5B,OAAOD;IACT;IAEA,8DAA8D;IAC9D,OAAOA,KAAKE,UAAU,IAAI,AAACF,KAAaG,IAAI;AAC9C,EAAE;AAEF;;;;CAIC,GACD,OAAO,MAAMC,2BAA2B,CAACJ;QAKlBA;IAJrB,IAAIA,KAAKK,QAAQ,KAAK,GAAG;QACvB,OAAO,CAAC;IACV;IAEA,MAAMC,gBAAeN,sBAAAA,KAAKO,aAAa,cAAlBP,0CAAAA,oBAAoBQ,WAAW;IAEpD,IAAIF,cAAc;QAChB,OAAOA,aAAaG,gBAAgB,CAACT,MAAM;IAC7C;IAEA,OAAO,CAAC;AACV,EAAE;AAEF;;;;CAIC,GACD,OAAO,MAAMU,kBAAkB,CAACV;IAC9B,iFAAiF;IACjF,MAAME,aAAaF,QAAQD,cAAcC;IACzC,2BAA2B;IAC3B,IAAI,CAACE,YAAY,OAAOS,SAASC,IAAI;IAErC,OAAQV,WAAWD,QAAQ;QACzB,KAAK;QACL,KAAK;YACH,OAAOC,WAAWK,aAAa,CAAEK,IAAI;QACvC,KAAK;YACH,OAAO,AAACV,WAAmCU,IAAI;IACnD;IAEA,uFAAuF;IACvF,MAAM,EAAEC,QAAQ,EAAEC,SAAS,EAAEC,SAAS,EAAE,GAAGX,yBAAyBF;IACpE,IAAI,wBAAwBc,IAAI,CAACH,WAAYE,YAAaD,YAAY;QACpE,OAAOZ;IACT;IAEA,OAAOQ,gBAAgBR;AACzB,EAAE;AAEF,OAAO,MAAMe,kBAAkB,CAACjB;QAGuBkB;IAFrD,MAAMA,sBAAmCR,gBAAgBV;IAEzD,OAAOkB,sBAAsBA,0BAAwBA,qCAAAA,oBAAoBX,aAAa,cAAjCW,yDAAAA,mCAAmCN,IAAI,IAAG;AACjG,EAAE"}

package/lib/utils/mergeArrowOffset.js

@@ -1,3 +1,4 @@
+'use client';
 /**
  * Generally when adding an arrow to popper, it's necessary to offset the position of the popper by the
  * height of the arrow. A simple utility to merge a provided offset with an arrow height to return the final offset

package/lib/utils/mergeArrowOffset.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/utils/mergeArrowOffset.ts"],"sourcesContent":["import type { Offset, OffsetObject } from '../types';\n\n/**\n * Generally when adding an arrow to popper, it's necessary to offset the position of the popper by the\n * height of the arrow. A simple utility to merge a provided offset with an arrow height to return the final offset\n *\n * @internal\n * @param userOffset - The offset provided by the user\n * @param arrowHeight - The height of the arrow in px\n * @returns User offset augmented with arrow height\n */\nexport function mergeArrowOffset(userOffset: Offset | undefined | null, arrowHeight: number): Offset {\n  if (typeof userOffset === 'number') {\n    return addArrowOffset(userOffset, arrowHeight);\n  }\n\n  if (typeof userOffset === 'object' && userOffset !== null) {\n    return addArrowOffset(userOffset, arrowHeight);\n  }\n\n  if (typeof userOffset === 'function') {\n    return offsetParams => {\n      const offset = userOffset(offsetParams);\n      return addArrowOffset(offset, arrowHeight);\n    };\n  }\n\n  return { mainAxis: arrowHeight };\n}\n\nconst addArrowOffset = (offset: OffsetObject | number, arrowHeight: number): OffsetObject => {\n  if (typeof offset === 'number') {\n    return { mainAxis: offset + arrowHeight };\n  }\n\n  return { ...offset, mainAxis: (offset.mainAxis ?? 0) + arrowHeight };\n};\n"],"names":["mergeArrowOffset","userOffset","arrowHeight","addArrowOffset","offsetParams","offset","mainAxis"],"mappings":"AAEA;;;;;;;;CAQC,GACD,OAAO,SAASA,iBAAiBC,UAAqC,EAAEC,WAAmB;IACzF,IAAI,OAAOD,eAAe,UAAU;QAClC,OAAOE,eAAeF,YAAYC;IACpC;IAEA,IAAI,OAAOD,eAAe,YAAYA,eAAe,MAAM;QACzD,OAAOE,eAAeF,YAAYC;IACpC;IAEA,IAAI,OAAOD,eAAe,YAAY;QACpC,OAAOG,CAAAA;YACL,MAAMC,SAASJ,WAAWG;YAC1B,OAAOD,eAAeE,QAAQH;QAChC;IACF;IAEA,OAAO;QAAEI,UAAUJ;IAAY;AACjC;AAEA,MAAMC,iBAAiB,CAACE,QAA+BH;IACrD,IAAI,OAAOG,WAAW,UAAU;QAC9B,OAAO;YAAEC,UAAUD,SAASH;QAAY;IAC1C;QAE+BG;IAA/B,OAAO;QAAE,GAAGA,MAAM;QAAEC,UAAU,AAACD,CAAAA,CAAAA,mBAAAA,OAAOC,QAAQ,cAAfD,8BAAAA,mBAAmB,CAAA,IAAKH;IAAY;AACrE"}
+{"version":3,"sources":["../src/utils/mergeArrowOffset.ts"],"sourcesContent":["'use client';\n\nimport type { Offset, OffsetObject } from '../types';\n\n/**\n * Generally when adding an arrow to popper, it's necessary to offset the position of the popper by the\n * height of the arrow. A simple utility to merge a provided offset with an arrow height to return the final offset\n *\n * @internal\n * @param userOffset - The offset provided by the user\n * @param arrowHeight - The height of the arrow in px\n * @returns User offset augmented with arrow height\n */\nexport function mergeArrowOffset(userOffset: Offset | undefined | null, arrowHeight: number): Offset {\n  if (typeof userOffset === 'number') {\n    return addArrowOffset(userOffset, arrowHeight);\n  }\n\n  if (typeof userOffset === 'object' && userOffset !== null) {\n    return addArrowOffset(userOffset, arrowHeight);\n  }\n\n  if (typeof userOffset === 'function') {\n    return offsetParams => {\n      const offset = userOffset(offsetParams);\n      return addArrowOffset(offset, arrowHeight);\n    };\n  }\n\n  return { mainAxis: arrowHeight };\n}\n\nconst addArrowOffset = (offset: OffsetObject | number, arrowHeight: number): OffsetObject => {\n  if (typeof offset === 'number') {\n    return { mainAxis: offset + arrowHeight };\n  }\n\n  return { ...offset, mainAxis: (offset.mainAxis ?? 0) + arrowHeight };\n};\n"],"names":["mergeArrowOffset","userOffset","arrowHeight","addArrowOffset","offsetParams","offset","mainAxis"],"mappings":"AAAA;AAIA;;;;;;;;CAQC,GACD,OAAO,SAASA,iBAAiBC,UAAqC,EAAEC,WAAmB;IACzF,IAAI,OAAOD,eAAe,UAAU;QAClC,OAAOE,eAAeF,YAAYC;IACpC;IAEA,IAAI,OAAOD,eAAe,YAAYA,eAAe,MAAM;QACzD,OAAOE,eAAeF,YAAYC;IACpC;IAEA,IAAI,OAAOD,eAAe,YAAY;QACpC,OAAOG,CAAAA;YACL,MAAMC,SAASJ,WAAWG;YAC1B,OAAOD,eAAeE,QAAQH;QAChC;IACF;IAEA,OAAO;QAAEI,UAAUJ;IAAY;AACjC;AAEA,MAAMC,iBAAiB,CAACE,QAA+BH;IACrD,IAAI,OAAOG,WAAW,UAAU;QAC9B,OAAO;YAAEC,UAAUD,SAASH;QAAY;IAC1C;QAE+BG;IAA/B,OAAO;QAAE,GAAGA,MAAM;QAAEC,UAAU,AAACD,CAAAA,CAAAA,mBAAAA,OAAOC,QAAQ,cAAfD,8BAAAA,mBAAmB,CAAA,IAAKH;IAAY;AACrE"}

package/lib/utils/useCallbackRef.js

@@ -1,3 +1,4 @@
+'use client';
 import * as React from 'react';
 import { useIsomorphicLayoutEffect } from '@fluentui/react-utilities';
 /**

package/lib/utils/useCallbackRef.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/utils/useCallbackRef.ts"],"sourcesContent":["import * as React from 'react';\nimport { useIsomorphicLayoutEffect } from '@fluentui/react-utilities';\n\n/**\n * Creates a MutableRef with ref change callback. Is useful as React.useRef() doesn't notify you when its content\n * changes and mutating the .current property doesn't cause a re-render. An opt-out will be use a callback ref via\n * React.useState(), but it will cause re-renders always.\n *\n * https://reactjs.org/docs/hooks-reference.html#useref\n * https://github.com/theKashey/use-callback-ref#usecallbackref---to-replace-reactuseref\n *\n * @param initialValue - initial ref value\n * @param callback - a callback to run when value changes\n * @param skipInitialResolve - a flag to skip an initial ref report\n *\n * @example\n * const ref = useCallbackRef(0, (newValue, oldValue) => console.log(oldValue, '->', newValue);\n * ref.current = 1;\n * // prints 0 -> 1\n */\nexport function useCallbackRef<T>(\n  initialValue: T | null,\n  callback: (newValue: T | null, lastValue: T | null) => void,\n  skipInitialResolve?: boolean,\n): React.MutableRefObject<T | null> {\n  const isFirst = React.useRef(true);\n  const [ref] = React.useState(() => ({\n    // value\n    value: initialValue,\n    // last callback\n    callback,\n    // \"memoized\" public interface\n    facade: {\n      get current() {\n        return ref.value;\n      },\n      set current(value) {\n        const last = ref.value;\n\n        if (last !== value) {\n          ref.value = value;\n\n          if (skipInitialResolve && isFirst.current) {\n            return;\n          }\n\n          ref.callback(value, last);\n        }\n      },\n    },\n  }));\n\n  useIsomorphicLayoutEffect(() => {\n    isFirst.current = false;\n  }, []);\n\n  // update callback\n  ref.callback = callback;\n\n  return ref.facade;\n}\n"],"names":["React","useIsomorphicLayoutEffect","useCallbackRef","initialValue","callback","skipInitialResolve","isFirst","useRef","ref","useState","value","facade","current","last"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,yBAAyB,QAAQ,4BAA4B;AAEtE;;;;;;;;;;;;;;;;CAgBC,GACD,OAAO,SAASC,eACdC,YAAsB,EACtBC,QAA2D,EAC3DC,kBAA4B;IAE5B,MAAMC,UAAUN,MAAMO,MAAM,CAAC;IAC7B,MAAM,CAACC,IAAI,GAAGR,MAAMS,QAAQ,CAAC,IAAO,CAAA;YAClC,QAAQ;YACRC,OAAOP;YACP,gBAAgB;YAChBC;YACA,8BAA8B;YAC9BO,QAAQ;gBACN,IAAIC,WAAU;oBACZ,OAAOJ,IAAIE,KAAK;gBAClB;gBACA,IAAIE,SAAQF,MAAO;oBACjB,MAAMG,OAAOL,IAAIE,KAAK;oBAEtB,IAAIG,SAASH,OAAO;wBAClBF,IAAIE,KAAK,GAAGA;wBAEZ,IAAIL,sBAAsBC,QAAQM,OAAO,EAAE;4BACzC;wBACF;wBAEAJ,IAAIJ,QAAQ,CAACM,OAAOG;oBACtB;gBACF;YACF;QACF,CAAA;IAEAZ,0BAA0B;QACxBK,QAAQM,OAAO,GAAG;IACpB,GAAG,EAAE;IAEL,kBAAkB;IAClBJ,IAAIJ,QAAQ,GAAGA;IAEf,OAAOI,IAAIG,MAAM;AACnB"}
+{"version":3,"sources":["../src/utils/useCallbackRef.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { useIsomorphicLayoutEffect } from '@fluentui/react-utilities';\n\n/**\n * Creates a MutableRef with ref change callback. Is useful as React.useRef() doesn't notify you when its content\n * changes and mutating the .current property doesn't cause a re-render. An opt-out will be use a callback ref via\n * React.useState(), but it will cause re-renders always.\n *\n * https://reactjs.org/docs/hooks-reference.html#useref\n * https://github.com/theKashey/use-callback-ref#usecallbackref---to-replace-reactuseref\n *\n * @param initialValue - initial ref value\n * @param callback - a callback to run when value changes\n * @param skipInitialResolve - a flag to skip an initial ref report\n *\n * @example\n * const ref = useCallbackRef(0, (newValue, oldValue) => console.log(oldValue, '->', newValue);\n * ref.current = 1;\n * // prints 0 -> 1\n */\nexport function useCallbackRef<T>(\n  initialValue: T | null,\n  callback: (newValue: T | null, lastValue: T | null) => void,\n  skipInitialResolve?: boolean,\n): React.MutableRefObject<T | null> {\n  const isFirst = React.useRef(true);\n  const [ref] = React.useState(() => ({\n    // value\n    value: initialValue,\n    // last callback\n    callback,\n    // \"memoized\" public interface\n    facade: {\n      get current() {\n        return ref.value;\n      },\n      set current(value) {\n        const last = ref.value;\n\n        if (last !== value) {\n          ref.value = value;\n\n          if (skipInitialResolve && isFirst.current) {\n            return;\n          }\n\n          ref.callback(value, last);\n        }\n      },\n    },\n  }));\n\n  useIsomorphicLayoutEffect(() => {\n    isFirst.current = false;\n  }, []);\n\n  // update callback\n  ref.callback = callback;\n\n  return ref.facade;\n}\n"],"names":["React","useIsomorphicLayoutEffect","useCallbackRef","initialValue","callback","skipInitialResolve","isFirst","useRef","ref","useState","value","facade","current","last"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,yBAAyB,QAAQ,4BAA4B;AAEtE;;;;;;;;;;;;;;;;CAgBC,GACD,OAAO,SAASC,eACdC,YAAsB,EACtBC,QAA2D,EAC3DC,kBAA4B;IAE5B,MAAMC,UAAUN,MAAMO,MAAM,CAAC;IAC7B,MAAM,CAACC,IAAI,GAAGR,MAAMS,QAAQ,CAAC,IAAO,CAAA;YAClC,QAAQ;YACRC,OAAOP;YACP,gBAAgB;YAChBC;YACA,8BAA8B;YAC9BO,QAAQ;gBACN,IAAIC,WAAU;oBACZ,OAAOJ,IAAIE,KAAK;gBAClB;gBACA,IAAIE,SAAQF,MAAO;oBACjB,MAAMG,OAAOL,IAAIE,KAAK;oBAEtB,IAAIG,SAASH,OAAO;wBAClBF,IAAIE,KAAK,GAAGA;wBAEZ,IAAIL,sBAAsBC,QAAQM,OAAO,EAAE;4BACzC;wBACF;wBAEAJ,IAAIJ,QAAQ,CAACM,OAAOG;oBACtB;gBACF;YACF;QACF,CAAA;IAEAZ,0BAA0B;QACxBK,QAAQM,OAAO,GAAG;IACpB,GAAG,EAAE;IAEL,kBAAkB;IAClBJ,IAAIJ,QAAQ,GAAGA;IAEf,OAAOI,IAAIG,MAAM;AACnB"}

package/lib-commonjs/PositioningConfigurationContext.js

@@ -1,3 +1,4 @@
+'use client';
 "use strict";
 Object.defineProperty(exports, "__esModule", {
     value: true

package/lib-commonjs/PositioningConfigurationContext.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/PositioningConfigurationContext.ts"],"sourcesContent":["import * as React from 'react';\nimport type { PositioningConfigurationFn } from './types';\n\n// ---\n\nconst DEFAULT_CONFIGURATION: PositioningConfigurationFn = ({ options }) => {\n  return options;\n};\n\n// ---\n\nconst PositioningConfigurationContext = React.createContext<PositioningConfigurationFn | undefined>(undefined);\n\n/**\n * A context provider for the positioning configuration.\n *\n * Accepts a function that takes the positioning options and returns them modified.\n */\nexport const PositioningConfigurationProvider = PositioningConfigurationContext.Provider;\n\nexport const usePositioningConfiguration = (): PositioningConfigurationFn => {\n  return React.useContext(PositioningConfigurationContext) ?? DEFAULT_CONFIGURATION;\n};\n"],"names":["React","DEFAULT_CONFIGURATION","options","PositioningConfigurationContext","createContext","undefined","PositioningConfigurationProvider","Provider","usePositioningConfiguration","useContext"],"mappings":";;;;;;;;;;;oCAkBaM;;;+BAEAE;;;;;iEApBU,QAAQ;AAG/B,MAAM;AAEN,MAAMP,wBAAoD,CAAC,EAAEC,OAAO,EAAE;IACpE,OAAOA;AACT;AAEA,MAAM;AAEN,MAAMC,gDAAkCH,OAAMI,aAAa,CAAyCC;AAO7F,MAAMC,mCAAmCH,gCAAgCI,QAAQ,CAAC;AAElF,MAAMC,8BAA8B;QAClCR;IAAP,OAAOA,CAAAA,oBAAAA,OAAMS,UAAU,CAACN,gCAAAA,MAAAA,QAAjBH,sBAAAA,KAAAA,IAAAA,oBAAqDC;AAC9D,EAAE"}
+{"version":3,"sources":["../src/PositioningConfigurationContext.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport type { PositioningConfigurationFn } from './types';\n\n// ---\n\nconst DEFAULT_CONFIGURATION: PositioningConfigurationFn = ({ options }) => {\n  return options;\n};\n\n// ---\n\nconst PositioningConfigurationContext = React.createContext<PositioningConfigurationFn | undefined>(undefined);\n\n/**\n * A context provider for the positioning configuration.\n *\n * Accepts a function that takes the positioning options and returns them modified.\n */\nexport const PositioningConfigurationProvider = PositioningConfigurationContext.Provider;\n\nexport const usePositioningConfiguration = (): PositioningConfigurationFn => {\n  return React.useContext(PositioningConfigurationContext) ?? DEFAULT_CONFIGURATION;\n};\n"],"names":["React","DEFAULT_CONFIGURATION","options","PositioningConfigurationContext","createContext","undefined","PositioningConfigurationProvider","Provider","usePositioningConfiguration","useContext"],"mappings":"AAAA;;;;;;;;;;;;IAoBaM,gCAAAA;;;+BAEAE;;;;;iEApBU,QAAQ;AAG/B,MAAM;AAEN,MAAMP,wBAAoD,CAAC,EAAEC,OAAO,EAAE;IACpE,OAAOA;AACT;AAEA,MAAM;AAEN,MAAMC,gDAAkCH,OAAMI,aAAa,CAAyCC;AAO7F,yCAAyCF,gCAAgCI,QAAQ,CAAC;AAElF,MAAMC,8BAA8B;QAClCR;IAAP,OAAOA,CAAAA,oBAAAA,OAAMS,UAAU,CAACN,gCAAAA,MAAAA,QAAjBH,sBAAAA,KAAAA,IAAAA,oBAAqDC;AAC9D,EAAE"}

package/lib-commonjs/hooks/useSafeZoneArea/SafeZoneArea.js

@@ -1,3 +1,4 @@
+'use client';
 "use strict";
 Object.defineProperty(exports, "__esModule", {
     value: true

package/lib-commonjs/hooks/useSafeZoneArea/SafeZoneArea.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/hooks/useSafeZoneArea/SafeZoneArea.tsx"],"sourcesContent":["import { mergeClasses } from '@griffel/react';\nimport { useId } from '@fluentui/react-utilities';\nimport type { JSXElement } from '@fluentui/react-utilities';\nimport * as React from 'react';\nimport { useSyncExternalStore } from 'use-sync-external-store/shim';\n\nimport type { createSafeZoneAreaStateStore } from './createSafeZoneAreaStateStore';\nimport { getRectCorners } from './getRectCorners';\nimport { getMouseAnchor } from './getMouseAnchor';\nimport { pointsToSvgPath } from './pointsToSvgPath';\nimport { useStyles } from './SafeZoneArea.styles';\nimport type { Point } from './types';\nimport { computeOutsideClipPath } from './computeOutsideClipPath';\n\nexport type SafeZoneAreaImperativeHandle = {\n  updateSVG: (options: { containerRect: DOMRect; targetRect: DOMRect; mouseCoordinates: Point }) => void;\n};\n\nexport type SafeZoneAreaProps = {\n  /** Enables debug mode: makes drawn shapes visible. */\n  debug: boolean;\n\n  /** A reference to the SafeZoneArea imperative handle. */\n  imperativeRef: React.Ref<SafeZoneAreaImperativeHandle>;\n\n  // eslint-disable-next-line @nx/workspace-consistent-callback-type\n  onMouseEnter: (e: React.MouseEvent) => void;\n  // eslint-disable-next-line @nx/workspace-consistent-callback-type\n  onMouseMove: (e: React.MouseEvent) => void;\n  // eslint-disable-next-line @nx/workspace-consistent-callback-type\n  onMouseLeave: (e: React.MouseEvent) => void;\n\n  stateStore: ReturnType<typeof createSafeZoneAreaStateStore>;\n};\n\n/**\n * @internal\n */\ntype SafeZoneAreaState = {\n  containerRect: DOMRect;\n  targetRect: DOMRect;\n  mouseCoordinates: Point;\n};\n\n// ---\n\nconst EMPTY_RECT: DOMRect = {\n  top: 0,\n  right: 0,\n  bottom: 0,\n  left: 0,\n  width: 0,\n  height: 0,\n  x: 0,\n  y: 0,\n  toJSON() {\n    return '';\n  },\n};\n\nexport function isSameRect(a: DOMRect, b: DOMRect): boolean {\n  return (\n    a.top === b.top &&\n    a.right === b.right &&\n    a.bottom === b.bottom &&\n    a.left === b.left &&\n    a.width === b.width &&\n    a.height === b.height\n  );\n}\n\nexport function isSameCoordinates(a: Point, b: Point): boolean {\n  return a[0] === b[0] && a[1] === b[1];\n}\n\n// ---\n\n/**\n * A component that renders a safe zone area with SVG shapes. Uses `useSyncExternalStore` to manage its active state\n * to avoid causing re-renders in `useSafeZoneArea()` as the hook might be used in host components like `Menu`.\n *\n * Draws two shapes:\n * - a triangle that points to the target element which is an actual safe zone\n * - a rectangle for a clip path that clips out the target element\n *\n * @internal\n */\nexport const SafeZoneArea = React.memo((props: SafeZoneAreaProps): JSXElement => {\n  const { debug, onMouseEnter, onMouseMove, onMouseLeave, stateStore } = props;\n\n  const clipPathId = useId();\n  const styles = useStyles();\n\n  const active = useSyncExternalStore(stateStore.subscribe, stateStore.isActive);\n  const svgRef = React.useRef<SVGSVGElement>(null);\n\n  const [state, setState] = React.useState<SafeZoneAreaState>(() => ({\n    containerRect: EMPTY_RECT,\n    targetRect: EMPTY_RECT,\n    mouseCoordinates: [0, 0],\n  }));\n\n  React.useImperativeHandle(\n    props.imperativeRef,\n    () => ({\n      updateSVG(newState) {\n        setState(prevState => {\n          // Heads up!\n          // A small optimization to avoid unnecessary re-renders\n          if (\n            isSameRect(prevState.containerRect, newState.containerRect) &&\n            isSameRect(prevState.targetRect, newState.targetRect) &&\n            isSameCoordinates(prevState.mouseCoordinates, newState.mouseCoordinates)\n          ) {\n            return prevState;\n          }\n\n          return newState;\n        });\n      },\n    }),\n    [],\n  );\n\n  const { containerRect, targetRect, mouseCoordinates } = state;\n\n  const topOffset = Math.min(targetRect.top, containerRect.top);\n  const leftOffset = Math.min(targetRect.left, containerRect.left);\n  const bottomOffset = Math.max(targetRect.bottom, containerRect.bottom);\n  const rightOffset = Math.max(targetRect.right, containerRect.right);\n\n  // ---\n\n  const containerCorners = getRectCorners(containerRect, [leftOffset, topOffset]);\n  const targetCorners = getRectCorners(targetRect, [leftOffset, topOffset]);\n\n  // Heads up!\n  // The SVG coordinate system starts at the top-left corner of the SVG element,\n  // so we need to adjust the mouse coordinates relative to the SVG's top-left corner.\n  const relativeMouseCoordinates: Point = [mouseCoordinates[0] - leftOffset, mouseCoordinates[1] - topOffset];\n  const mouseAnchor = getMouseAnchor(containerCorners.topLeft, containerCorners.bottomRight, relativeMouseCoordinates);\n\n  const triangleA = [mouseAnchor, containerCorners.topLeft, containerCorners.topRight];\n  const triangleB = [mouseAnchor, containerCorners.topRight, containerCorners.bottomRight];\n  const triangleC = [mouseAnchor, containerCorners.bottomRight, containerCorners.bottomLeft];\n  const triangleD = [mouseAnchor, containerCorners.bottomLeft, containerCorners.topLeft];\n\n  const svgWidth = rightOffset - leftOffset;\n  const svgHeight = bottomOffset - topOffset;\n\n  const clipPath = computeOutsideClipPath(\n    svgWidth,\n    svgHeight,\n    {\n      x: targetCorners.topLeft[0],\n      y: targetCorners.topLeft[1],\n      width: targetRect.width,\n      height: targetRect.height,\n    },\n    {\n      x: containerCorners.topLeft[0],\n      y: containerCorners.topLeft[1],\n      width: containerRect.width,\n      height: containerRect.height,\n    },\n  );\n\n  return (\n    <div className={mergeClasses(styles.wrapper, active && styles.wrapperActive)} data-safe-zone=\"\">\n      {active ? (\n        <svg\n          aria-hidden\n          className={styles.svg}\n          xmlns=\"http://www.w3.org/2000/svg\"\n          ref={svgRef}\n          style={{\n            width: `${svgWidth}px`,\n            height: `${svgHeight}px`,\n            transform: `translate(${leftOffset}px, ${topOffset}px)`,\n          }}\n        >\n          <g\n            className={mergeClasses(styles.triangle, debug && styles.triangleDebug)}\n            clipPath={`url(#${clipPathId})`}\n            onMouseEnter={onMouseEnter}\n            onMouseMove={onMouseMove}\n            onMouseLeave={onMouseLeave}\n          >\n            <path d={pointsToSvgPath(triangleA)} />\n            <path d={pointsToSvgPath(triangleB)} />\n            <path d={pointsToSvgPath(triangleC)} />\n            <path d={pointsToSvgPath(triangleD)} />\n          </g>\n\n          <clipPath id={clipPathId}>\n            <path d={clipPath} />\n          </clipPath>\n\n          {debug && <path className={styles.rectDebug} d={clipPath} />}\n        </svg>\n      ) : null}\n    </div>\n  );\n});\n"],"names":["mergeClasses","useId","React","useSyncExternalStore","getRectCorners","getMouseAnchor","pointsToSvgPath","useStyles","computeOutsideClipPath","EMPTY_RECT","top","right","bottom","left","width","height","x","y","toJSON","isSameRect","a","b","isSameCoordinates","SafeZoneArea","memo","props","debug","onMouseEnter","onMouseMove","onMouseLeave","stateStore","clipPathId","styles","active","subscribe","isActive","svgRef","useRef","state","setState","useState","containerRect","targetRect","mouseCoordinates","useImperativeHandle","imperativeRef","updateSVG","newState","prevState","topOffset","Math","min","leftOffset","bottomOffset","max","rightOffset","containerCorners","targetCorners","relativeMouseCoordinates","mouseAnchor","topLeft","bottomRight","triangleA","topRight","triangleB","triangleC","bottomLeft","triangleD","svgWidth","svgHeight","clipPath","div","className","wrapper","wrapperActive","data-safe-zone","svg","aria-hidden","xmlns","ref","style","transform","g","triangle","triangleDebug","path","d","id","rectDebug"],"mappings":";;;;;;;;;;;IAuFauB,YAAAA;;;qBAhBGD;;;cAXAH;;;;;uBA5Da,iBAAiB;gCACxB,4BAA4B;kEAE3B,QAAQ;sBACM,+BAA+B;gCAGrC,mBAAmB;gCACnB,mBAAmB;iCAClB,oBAAoB;oCAC1B,wBAAwB;wCAEX,2BAA2B;AAgClE,MAAM;AAEN,MAAMV,aAAsB;IAC1BC,KAAK;IACLC,OAAO;IACPC,QAAQ;IACRC,MAAM;IACNC,OAAO;IACPC,QAAQ;IACRC,GAAG;IACHC,GAAG;IACHC;QACE,OAAO;IACT;AACF;AAEO,SAASC,WAAWC,CAAU,EAAEC,CAAU;IAC/C,OACED,EAAEV,GAAG,KAAKW,EAAEX,GAAG,IACfU,EAAET,KAAK,KAAKU,EAAEV,KAAK,IACnBS,EAAER,MAAM,KAAKS,EAAET,MAAM,IACrBQ,EAAEP,IAAI,KAAKQ,EAAER,IAAI,IACjBO,EAAEN,KAAK,KAAKO,EAAEP,KAAK,IACnBM,EAAEL,MAAM,KAAKM,EAAEN,MAAM;AAEzB;AAEO,SAASO,kBAAkBF,CAAQ,EAAEC,CAAQ;IAClD,OAAOD,CAAC,CAAC,EAAE,KAAKC,CAAC,CAAC,EAAE,IAAID,CAAC,CAAC,EAAE,KAAKC,CAAC,CAAC,EAAE;AACvC;AAcO,qBAAME,WAAAA,GAAerB,QAAMsB,IAAI,CAAC,CAACC;IACtC,MAAM,EAAEC,KAAK,EAAEC,YAAY,EAAEC,WAAW,EAAEC,YAAY,EAAEC,UAAU,EAAE,GAAGL;IAEvE,MAAMM,iBAAa9B,qBAAAA;IACnB,MAAM+B,aAASzB,6BAAAA;IAEf,MAAM0B,aAAS9B,0BAAAA,EAAqB2B,WAAWI,SAAS,EAAEJ,WAAWK,QAAQ;IAC7E,MAAMC,SAASlC,QAAMmC,MAAM,CAAgB;IAE3C,MAAM,CAACC,OAAOC,SAAS,GAAGrC,QAAMsC,QAAQ,CAAoB,IAAO,CAAA;YACjEC,eAAehC;YACfiC,YAAYjC;YACZkC,kBAAkB;gBAAC;gBAAG;aAAE;SAC1B,CAAA;IAEAzC,QAAM0C,mBAAmB,CACvBnB,MAAMoB,aAAa,EACnB,IAAO,CAAA;YACLC,WAAUC,QAAQ;gBAChBR,SAASS,CAAAA;oBACP,YAAY;oBACZ,uDAAuD;oBACvD,IACE7B,WAAW6B,UAAUP,aAAa,EAAEM,SAASN,aAAa,KAC1DtB,WAAW6B,UAAUN,UAAU,EAAEK,SAASL,UAAU,KACpDpB,kBAAkB0B,UAAUL,gBAAgB,EAAEI,SAASJ,gBAAgB,GACvE;wBACA,OAAOK;oBACT;oBAEA,OAAOD;gBACT;YACF;SACF,CAAA,EACA,EAAE;IAGJ,MAAM,EAAEN,aAAa,EAAEC,UAAU,EAAEC,gBAAgB,EAAE,GAAGL;IAExD,MAAMW,YAAYC,KAAKC,GAAG,CAACT,WAAWhC,GAAG,EAAE+B,cAAc/B,GAAG;IAC5D,MAAM0C,aAAaF,KAAKC,GAAG,CAACT,WAAW7B,IAAI,EAAE4B,cAAc5B,IAAI;IAC/D,MAAMwC,eAAeH,KAAKI,GAAG,CAACZ,WAAW9B,MAAM,EAAE6B,cAAc7B,MAAM;IACrE,MAAM2C,cAAcL,KAAKI,GAAG,CAACZ,WAAW/B,KAAK,EAAE8B,cAAc9B,KAAK;IAElE,MAAM;IAEN,MAAM6C,uBAAmBpD,8BAAAA,EAAeqC,eAAe;QAACW;QAAYH;KAAU;IAC9E,MAAMQ,gBAAgBrD,kCAAAA,EAAesC,YAAY;QAACU;QAAYH;KAAU;IAExE,YAAY;IACZ,8EAA8E;IAC9E,oFAAoF;IACpF,MAAMS,2BAAkC;QAACf,gBAAgB,CAAC,EAAE,GAAGS;QAAYT,gBAAgB,CAAC,EAAE,GAAGM;KAAU;IAC3G,MAAMU,kBAActD,8BAAAA,EAAemD,iBAAiBI,OAAO,EAAEJ,iBAAiBK,WAAW,EAAEH;IAE3F,MAAMI,YAAY;QAACH;QAAaH,iBAAiBI,OAAO;QAAEJ,iBAAiBO,QAAQ;KAAC;IACpF,MAAMC,YAAY;QAACL;QAAaH,iBAAiBO,QAAQ;QAAEP,iBAAiBK,WAAW;KAAC;IACxF,MAAMI,YAAY;QAACN;QAAaH,iBAAiBK,WAAW;QAAEL,iBAAiBU,UAAU;KAAC;IAC1F,MAAMC,YAAY;QAACR;QAAaH,iBAAiBU,UAAU;QAAEV,iBAAiBI,OAAO;KAAC;IAEtF,MAAMQ,WAAWb,cAAcH;IAC/B,MAAMiB,YAAYhB,eAAeJ;IAEjC,MAAMqB,eAAW9D,8CAAAA,EACf4D,UACAC,WACA;QACErD,GAAGyC,cAAcG,OAAO,CAAC,EAAE;QAC3B3C,GAAGwC,cAAcG,OAAO,CAAC,EAAE;QAC3B9C,OAAO4B,WAAW5B,KAAK;QACvBC,QAAQ2B,WAAW3B,MAAM;IAC3B,GACA;QACEC,GAAGwC,iBAAiBI,OAAO,CAAC,EAAE;QAC9B3C,GAAGuC,iBAAiBI,OAAO,CAAC,EAAE;QAC9B9C,OAAO2B,cAAc3B,KAAK;QAC1BC,QAAQ0B,cAAc1B,MAAM;IAC9B;IAGF,OAAA,WAAA,GACE,QAAA,aAAA,CAACwD,OAAAA;QAAIC,eAAWxE,mBAAAA,EAAagC,OAAOyC,OAAO,EAAExC,UAAUD,OAAO0C,aAAa;QAAGC,kBAAe;OAC1F1C,SAAAA,WAAAA,GACC,QAAA,aAAA,CAAC2C,OAAAA;QACCC,eAAAA;QACAL,WAAWxC,OAAO4C,GAAG;QACrBE,OAAM;QACNC,KAAK3C;QACL4C,OAAO;YACLlE,OAAO,GAAGsD,SAAS,EAAE,CAAC;YACtBrD,QAAQ,GAAGsD,UAAU,EAAE,CAAC;YACxBY,WAAW,CAAC,UAAU,EAAE7B,WAAW,IAAI,EAAEH,UAAU,GAAG,CAAC;QACzD;qBAEA,QAAA,aAAA,CAACiC,KAAAA;QACCV,eAAWxE,mBAAAA,EAAagC,OAAOmD,QAAQ,EAAEzD,SAASM,OAAOoD,aAAa;QACtEd,UAAU,CAAC,KAAK,EAAEvC,WAAW,CAAC,CAAC;QAC/BJ,cAAcA;QACdC,aAAaA;QACbC,cAAcA;qBAEd,QAAA,aAAA,CAACwD,QAAAA;QAAKC,OAAGhF,gCAAAA,EAAgBwD;sBACzB,QAAA,aAAA,CAACuB,QAAAA;QAAKC,OAAGhF,gCAAAA,EAAgB0D;sBACzB,QAAA,aAAA,CAACqB,QAAAA;QAAKC,OAAGhF,gCAAAA,EAAgB2D;sBACzB,QAAA,aAAA,CAACoB,QAAAA;QAAKC,OAAGhF,gCAAAA,EAAgB6D;uBAG3B,QAAA,aAAA,CAACG,YAAAA;QAASiB,IAAIxD;qBACZ,QAAA,aAAA,CAACsD,QAAAA;QAAKC,GAAGhB;SAGV5C,SAAAA,WAAAA,GAAS,QAAA,aAAA,CAAC2D,QAAAA;QAAKb,WAAWxC,OAAOwD,SAAS;QAAEF,GAAGhB;UAEhD;AAGV,GAAG"}
+{"version":3,"sources":["../src/hooks/useSafeZoneArea/SafeZoneArea.tsx"],"sourcesContent":["'use client';\n\nimport { mergeClasses } from '@griffel/react';\nimport { useId } from '@fluentui/react-utilities';\nimport type { JSXElement } from '@fluentui/react-utilities';\nimport * as React from 'react';\nimport { useSyncExternalStore } from 'use-sync-external-store/shim';\n\nimport type { createSafeZoneAreaStateStore } from './createSafeZoneAreaStateStore';\nimport { getRectCorners } from './getRectCorners';\nimport { getMouseAnchor } from './getMouseAnchor';\nimport { pointsToSvgPath } from './pointsToSvgPath';\nimport { useStyles } from './SafeZoneArea.styles';\nimport type { Point } from './types';\nimport { computeOutsideClipPath } from './computeOutsideClipPath';\n\nexport type SafeZoneAreaImperativeHandle = {\n  updateSVG: (options: { containerRect: DOMRect; targetRect: DOMRect; mouseCoordinates: Point }) => void;\n};\n\nexport type SafeZoneAreaProps = {\n  /** Enables debug mode: makes drawn shapes visible. */\n  debug: boolean;\n\n  /** A reference to the SafeZoneArea imperative handle. */\n  imperativeRef: React.Ref<SafeZoneAreaImperativeHandle>;\n\n  // eslint-disable-next-line @nx/workspace-consistent-callback-type\n  onMouseEnter: (e: React.MouseEvent) => void;\n  // eslint-disable-next-line @nx/workspace-consistent-callback-type\n  onMouseMove: (e: React.MouseEvent) => void;\n  // eslint-disable-next-line @nx/workspace-consistent-callback-type\n  onMouseLeave: (e: React.MouseEvent) => void;\n\n  stateStore: ReturnType<typeof createSafeZoneAreaStateStore>;\n};\n\n/**\n * @internal\n */\ntype SafeZoneAreaState = {\n  containerRect: DOMRect;\n  targetRect: DOMRect;\n  mouseCoordinates: Point;\n};\n\n// ---\n\nconst EMPTY_RECT: DOMRect = {\n  top: 0,\n  right: 0,\n  bottom: 0,\n  left: 0,\n  width: 0,\n  height: 0,\n  x: 0,\n  y: 0,\n  toJSON() {\n    return '';\n  },\n};\n\nexport function isSameRect(a: DOMRect, b: DOMRect): boolean {\n  return (\n    a.top === b.top &&\n    a.right === b.right &&\n    a.bottom === b.bottom &&\n    a.left === b.left &&\n    a.width === b.width &&\n    a.height === b.height\n  );\n}\n\nexport function isSameCoordinates(a: Point, b: Point): boolean {\n  return a[0] === b[0] && a[1] === b[1];\n}\n\n// ---\n\n/**\n * A component that renders a safe zone area with SVG shapes. Uses `useSyncExternalStore` to manage its active state\n * to avoid causing re-renders in `useSafeZoneArea()` as the hook might be used in host components like `Menu`.\n *\n * Draws two shapes:\n * - a triangle that points to the target element which is an actual safe zone\n * - a rectangle for a clip path that clips out the target element\n *\n * @internal\n */\nexport const SafeZoneArea = React.memo((props: SafeZoneAreaProps): JSXElement => {\n  const { debug, onMouseEnter, onMouseMove, onMouseLeave, stateStore } = props;\n\n  const clipPathId = useId();\n  const styles = useStyles();\n\n  const active = useSyncExternalStore(stateStore.subscribe, stateStore.isActive);\n  const svgRef = React.useRef<SVGSVGElement>(null);\n\n  const [state, setState] = React.useState<SafeZoneAreaState>(() => ({\n    containerRect: EMPTY_RECT,\n    targetRect: EMPTY_RECT,\n    mouseCoordinates: [0, 0],\n  }));\n\n  React.useImperativeHandle(\n    props.imperativeRef,\n    () => ({\n      updateSVG(newState) {\n        setState(prevState => {\n          // Heads up!\n          // A small optimization to avoid unnecessary re-renders\n          if (\n            isSameRect(prevState.containerRect, newState.containerRect) &&\n            isSameRect(prevState.targetRect, newState.targetRect) &&\n            isSameCoordinates(prevState.mouseCoordinates, newState.mouseCoordinates)\n          ) {\n            return prevState;\n          }\n\n          return newState;\n        });\n      },\n    }),\n    [],\n  );\n\n  const { containerRect, targetRect, mouseCoordinates } = state;\n\n  const topOffset = Math.min(targetRect.top, containerRect.top);\n  const leftOffset = Math.min(targetRect.left, containerRect.left);\n  const bottomOffset = Math.max(targetRect.bottom, containerRect.bottom);\n  const rightOffset = Math.max(targetRect.right, containerRect.right);\n\n  // ---\n\n  const containerCorners = getRectCorners(containerRect, [leftOffset, topOffset]);\n  const targetCorners = getRectCorners(targetRect, [leftOffset, topOffset]);\n\n  // Heads up!\n  // The SVG coordinate system starts at the top-left corner of the SVG element,\n  // so we need to adjust the mouse coordinates relative to the SVG's top-left corner.\n  const relativeMouseCoordinates: Point = [mouseCoordinates[0] - leftOffset, mouseCoordinates[1] - topOffset];\n  const mouseAnchor = getMouseAnchor(containerCorners.topLeft, containerCorners.bottomRight, relativeMouseCoordinates);\n\n  const triangleA = [mouseAnchor, containerCorners.topLeft, containerCorners.topRight];\n  const triangleB = [mouseAnchor, containerCorners.topRight, containerCorners.bottomRight];\n  const triangleC = [mouseAnchor, containerCorners.bottomRight, containerCorners.bottomLeft];\n  const triangleD = [mouseAnchor, containerCorners.bottomLeft, containerCorners.topLeft];\n\n  const svgWidth = rightOffset - leftOffset;\n  const svgHeight = bottomOffset - topOffset;\n\n  const clipPath = computeOutsideClipPath(\n    svgWidth,\n    svgHeight,\n    {\n      x: targetCorners.topLeft[0],\n      y: targetCorners.topLeft[1],\n      width: targetRect.width,\n      height: targetRect.height,\n    },\n    {\n      x: containerCorners.topLeft[0],\n      y: containerCorners.topLeft[1],\n      width: containerRect.width,\n      height: containerRect.height,\n    },\n  );\n\n  return (\n    <div className={mergeClasses(styles.wrapper, active && styles.wrapperActive)} data-safe-zone=\"\">\n      {active ? (\n        <svg\n          aria-hidden\n          className={styles.svg}\n          xmlns=\"http://www.w3.org/2000/svg\"\n          ref={svgRef}\n          style={{\n            width: `${svgWidth}px`,\n            height: `${svgHeight}px`,\n            transform: `translate(${leftOffset}px, ${topOffset}px)`,\n          }}\n        >\n          <g\n            className={mergeClasses(styles.triangle, debug && styles.triangleDebug)}\n            clipPath={`url(#${clipPathId})`}\n            onMouseEnter={onMouseEnter}\n            onMouseMove={onMouseMove}\n            onMouseLeave={onMouseLeave}\n          >\n            <path d={pointsToSvgPath(triangleA)} />\n            <path d={pointsToSvgPath(triangleB)} />\n            <path d={pointsToSvgPath(triangleC)} />\n            <path d={pointsToSvgPath(triangleD)} />\n          </g>\n\n          <clipPath id={clipPathId}>\n            <path d={clipPath} />\n          </clipPath>\n\n          {debug && <path className={styles.rectDebug} d={clipPath} />}\n        </svg>\n      ) : null}\n    </div>\n  );\n});\n"],"names":["mergeClasses","useId","React","useSyncExternalStore","getRectCorners","getMouseAnchor","pointsToSvgPath","useStyles","computeOutsideClipPath","EMPTY_RECT","top","right","bottom","left","width","height","x","y","toJSON","isSameRect","a","b","isSameCoordinates","SafeZoneArea","memo","props","debug","onMouseEnter","onMouseMove","onMouseLeave","stateStore","clipPathId","styles","active","subscribe","isActive","svgRef","useRef","state","setState","useState","containerRect","targetRect","mouseCoordinates","useImperativeHandle","imperativeRef","updateSVG","newState","prevState","topOffset","Math","min","leftOffset","bottomOffset","max","rightOffset","containerCorners","targetCorners","relativeMouseCoordinates","mouseAnchor","topLeft","bottomRight","triangleA","topRight","triangleB","triangleC","bottomLeft","triangleD","svgWidth","svgHeight","clipPath","div","className","wrapper","wrapperActive","data-safe-zone","svg","aria-hidden","xmlns","ref","style","transform","g","triangle","triangleDebug","path","d","id","rectDebug"],"mappings":"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"}

package/lib-commonjs/hooks/useSafeZoneArea/useSafeZoneArea.js

@@ -1,3 +1,4 @@
+'use client';
 "use strict";
 Object.defineProperty(exports, "__esModule", {
     value: true

package/lib-commonjs/hooks/useSafeZoneArea/useSafeZoneArea.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/hooks/useSafeZoneArea/useSafeZoneArea.tsx"],"sourcesContent":["import { useAnimationFrame, useEventCallback, useMergedRefs, useTimeout } from '@fluentui/react-utilities';\nimport type { JSXElement, RefObjectFunction } from '@fluentui/react-utilities';\nimport * as React from 'react';\n\nimport { createSafeZoneAreaStateStore } from './createSafeZoneAreaStateStore';\nimport { type SafeZoneAreaImperativeHandle, SafeZoneArea } from './SafeZoneArea';\n\nexport type UseSafeZoneOptions = {\n  /** Enables debug mode: makes drawn shapes visible. */\n  debug?: boolean;\n\n  /** Disables the safe zone area. */\n  disabled?: boolean;\n\n  /** The time in milliseconds to wait before clearing the safe zone. */\n  timeout?: number;\n\n  /** Called when the mouse enters the safe zone. */\n  onSafeZoneEnter?: (e: React.MouseEvent) => void;\n\n  /** Called when the mouse moves within the safe zone. */\n  onSafeZoneMove?: (e: React.MouseEvent) => void;\n\n  /** Called when the mouse leaves the safe zone. */\n  onSafeZoneLeave?: (e: React.MouseEvent) => void;\n\n  /** Called when the safe zone times out, even if a cursor is still over a safe zone. */\n  onSafeZoneTimeout?: () => void;\n};\n\n/**\n * Time in milliseconds after which the safe zone area will be cleared if no mouse movement is detected.\n *\n * Only affects the target element, not the safe zone area itself.\n */\nconst MOUSE_MOVE_TARGET_POLLING_TIMEOUT = 2000;\n\n// ---\n\nexport function useSafeZoneArea({\n  debug = false,\n  disabled = false,\n\n  onSafeZoneEnter,\n  onSafeZoneMove,\n  onSafeZoneLeave,\n  onSafeZoneTimeout,\n\n  timeout = 1500,\n}: UseSafeZoneOptions = {}): {\n  containerRef: RefObjectFunction<HTMLElement>;\n  targetRef: RefObjectFunction<HTMLElement>;\n  elementToRender: JSXElement | null;\n} {\n  const [stateStore] = React.useState(createSafeZoneAreaStateStore);\n\n  const safeZoneAreaRef = React.useRef<SafeZoneAreaImperativeHandle>(null);\n  const containerRef = React.useRef<HTMLElement>(null);\n  const targetRef = React.useRef<HTMLElement>(null);\n\n  const [setSafeZoneCloseTimeout, clearSafeZoneCloseTimeout] = useTimeout();\n  const [requestUpdateFrame, clearUpdateFrame] = useAnimationFrame();\n\n  const mouseCoordinatesRef = React.useRef<{ x: number; y: number }>({ x: 0, y: 0 });\n\n  const containerListenerRef = React.useMemo(() => {\n    if (disabled) {\n      return () => {\n        // do nothing\n      };\n    }\n\n    let containerEl: HTMLElement | null = null;\n\n    function onContainerMouseEnter() {\n      clearSafeZoneCloseTimeout();\n      stateStore.toggleActive(false);\n    }\n\n    return (el: HTMLElement | null) => {\n      if (el === null) {\n        containerEl?.removeEventListener('mouseenter', onContainerMouseEnter);\n      }\n\n      containerEl = el;\n      el?.addEventListener('mouseenter', onContainerMouseEnter);\n    };\n  }, [clearSafeZoneCloseTimeout, disabled, stateStore]);\n\n  const targetListenerRef = React.useMemo(() => {\n    if (disabled) {\n      return () => {\n        // do nothing\n      };\n    }\n\n    let targetEl: HTMLElement | null = null;\n\n    function onTargetMouseMove(e: MouseEvent) {\n      mouseCoordinatesRef.current = { x: e.clientX, y: e.clientY };\n\n      if (!stateStore.isActive()) {\n        stateStore.toggleActive(true);\n      }\n\n      setSafeZoneCloseTimeout(() => {\n        stateStore.toggleActive(false);\n      }, MOUSE_MOVE_TARGET_POLLING_TIMEOUT);\n    }\n\n    return (el: HTMLElement | null) => {\n      if (el === null) {\n        clearUpdateFrame();\n        clearSafeZoneCloseTimeout();\n\n        targetEl?.removeEventListener('mousemove', onTargetMouseMove);\n      }\n\n      targetEl = el;\n      el?.addEventListener('mousemove', onTargetMouseMove);\n    };\n  }, [clearUpdateFrame, clearSafeZoneCloseTimeout, disabled, stateStore, setSafeZoneCloseTimeout]);\n\n  const onSvgMouseEnter = useEventCallback((e: React.MouseEvent) => {\n    onSafeZoneEnter?.(e);\n\n    setSafeZoneCloseTimeout(() => {\n      stateStore.toggleActive(false);\n      onSafeZoneTimeout?.();\n    }, timeout);\n  });\n\n  const onSvgMouseMove = useEventCallback((e: React.MouseEvent) => {\n    setSafeZoneCloseTimeout(() => {\n      stateStore.toggleActive(false);\n      onSafeZoneTimeout?.();\n    }, timeout);\n    onSafeZoneMove?.(e);\n  });\n\n  const onSvgMouseLeave = useEventCallback((e: React.MouseEvent) => {\n    onSafeZoneLeave?.(e);\n  });\n\n  React.useEffect(() => {\n    return stateStore.subscribe(isActive => {\n      if (isActive) {\n        function updateSVGs() {\n          const containerEl = containerRef.current;\n          const targetEl = targetRef.current;\n\n          if (containerEl && targetEl) {\n            safeZoneAreaRef.current?.updateSVG({\n              containerRect: containerEl.getBoundingClientRect(),\n              mouseCoordinates: [mouseCoordinatesRef.current.x, mouseCoordinatesRef.current.y],\n              targetRect: targetEl.getBoundingClientRect(),\n            });\n          }\n\n          requestUpdateFrame(updateSVGs);\n        }\n\n        updateSVGs();\n        return;\n      }\n\n      clearUpdateFrame();\n    });\n  }, [clearUpdateFrame, requestUpdateFrame, stateStore]);\n\n  return {\n    containerRef: useMergedRefs(containerRef, containerListenerRef),\n    targetRef: useMergedRefs(targetRef, targetListenerRef),\n\n    elementToRender: React.useMemo(\n      () =>\n        disabled ? null : (\n          <SafeZoneArea\n            debug={debug}\n            onMouseEnter={onSvgMouseEnter}\n            onMouseMove={onSvgMouseMove}\n            onMouseLeave={onSvgMouseLeave}\n            imperativeRef={safeZoneAreaRef}\n            stateStore={stateStore}\n          />\n        ),\n      [disabled, debug, onSvgMouseEnter, onSvgMouseMove, onSvgMouseLeave, stateStore],\n    ),\n  };\n}\n"],"names":["useAnimationFrame","useEventCallback","useMergedRefs","useTimeout","React","createSafeZoneAreaStateStore","SafeZoneArea","MOUSE_MOVE_TARGET_POLLING_TIMEOUT","useSafeZoneArea","debug","disabled","onSafeZoneEnter","onSafeZoneMove","onSafeZoneLeave","onSafeZoneTimeout","timeout","stateStore","useState","safeZoneAreaRef","useRef","containerRef","targetRef","setSafeZoneCloseTimeout","clearSafeZoneCloseTimeout","requestUpdateFrame","clearUpdateFrame","mouseCoordinatesRef","x","y","containerListenerRef","useMemo","containerEl","onContainerMouseEnter","toggleActive","el","removeEventListener","addEventListener","targetListenerRef","targetEl","onTargetMouseMove","e","current","clientX","clientY","isActive","onSvgMouseEnter","onSvgMouseMove","onSvgMouseLeave","useEffect","subscribe","updateSVGs","updateSVG","containerRect","getBoundingClientRect","mouseCoordinates","targetRect","elementToRender","onMouseEnter","onMouseMove","onMouseLeave","imperativeRef"],"mappings":"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"}
+{"version":3,"sources":["../src/hooks/useSafeZoneArea/useSafeZoneArea.tsx"],"sourcesContent":["'use client';\n\nimport { useAnimationFrame, useEventCallback, useMergedRefs, useTimeout } from '@fluentui/react-utilities';\nimport type { JSXElement, RefObjectFunction } from '@fluentui/react-utilities';\nimport * as React from 'react';\n\nimport { createSafeZoneAreaStateStore } from './createSafeZoneAreaStateStore';\nimport { type SafeZoneAreaImperativeHandle, SafeZoneArea } from './SafeZoneArea';\n\nexport type UseSafeZoneOptions = {\n  /** Enables debug mode: makes drawn shapes visible. */\n  debug?: boolean;\n\n  /** Disables the safe zone area. */\n  disabled?: boolean;\n\n  /** The time in milliseconds to wait before clearing the safe zone. */\n  timeout?: number;\n\n  /** Called when the mouse enters the safe zone. */\n  onSafeZoneEnter?: (e: React.MouseEvent) => void;\n\n  /** Called when the mouse moves within the safe zone. */\n  onSafeZoneMove?: (e: React.MouseEvent) => void;\n\n  /** Called when the mouse leaves the safe zone. */\n  onSafeZoneLeave?: (e: React.MouseEvent) => void;\n\n  /** Called when the safe zone times out, even if a cursor is still over a safe zone. */\n  onSafeZoneTimeout?: () => void;\n};\n\n/**\n * Time in milliseconds after which the safe zone area will be cleared if no mouse movement is detected.\n *\n * Only affects the target element, not the safe zone area itself.\n */\nconst MOUSE_MOVE_TARGET_POLLING_TIMEOUT = 2000;\n\n// ---\n\nexport function useSafeZoneArea({\n  debug = false,\n  disabled = false,\n\n  onSafeZoneEnter,\n  onSafeZoneMove,\n  onSafeZoneLeave,\n  onSafeZoneTimeout,\n\n  timeout = 1500,\n}: UseSafeZoneOptions = {}): {\n  containerRef: RefObjectFunction<HTMLElement>;\n  targetRef: RefObjectFunction<HTMLElement>;\n  elementToRender: JSXElement | null;\n} {\n  const [stateStore] = React.useState(createSafeZoneAreaStateStore);\n\n  const safeZoneAreaRef = React.useRef<SafeZoneAreaImperativeHandle>(null);\n  const containerRef = React.useRef<HTMLElement>(null);\n  const targetRef = React.useRef<HTMLElement>(null);\n\n  const [setSafeZoneCloseTimeout, clearSafeZoneCloseTimeout] = useTimeout();\n  const [requestUpdateFrame, clearUpdateFrame] = useAnimationFrame();\n\n  const mouseCoordinatesRef = React.useRef<{ x: number; y: number }>({ x: 0, y: 0 });\n\n  const containerListenerRef = React.useMemo(() => {\n    if (disabled) {\n      return () => {\n        // do nothing\n      };\n    }\n\n    let containerEl: HTMLElement | null = null;\n\n    function onContainerMouseEnter() {\n      clearSafeZoneCloseTimeout();\n      stateStore.toggleActive(false);\n    }\n\n    return (el: HTMLElement | null) => {\n      if (el === null) {\n        containerEl?.removeEventListener('mouseenter', onContainerMouseEnter);\n      }\n\n      containerEl = el;\n      el?.addEventListener('mouseenter', onContainerMouseEnter);\n    };\n  }, [clearSafeZoneCloseTimeout, disabled, stateStore]);\n\n  const targetListenerRef = React.useMemo(() => {\n    if (disabled) {\n      return () => {\n        // do nothing\n      };\n    }\n\n    let targetEl: HTMLElement | null = null;\n\n    function onTargetMouseMove(e: MouseEvent) {\n      mouseCoordinatesRef.current = { x: e.clientX, y: e.clientY };\n\n      if (!stateStore.isActive()) {\n        stateStore.toggleActive(true);\n      }\n\n      setSafeZoneCloseTimeout(() => {\n        stateStore.toggleActive(false);\n      }, MOUSE_MOVE_TARGET_POLLING_TIMEOUT);\n    }\n\n    return (el: HTMLElement | null) => {\n      if (el === null) {\n        clearUpdateFrame();\n        clearSafeZoneCloseTimeout();\n\n        targetEl?.removeEventListener('mousemove', onTargetMouseMove);\n      }\n\n      targetEl = el;\n      el?.addEventListener('mousemove', onTargetMouseMove);\n    };\n  }, [clearUpdateFrame, clearSafeZoneCloseTimeout, disabled, stateStore, setSafeZoneCloseTimeout]);\n\n  const onSvgMouseEnter = useEventCallback((e: React.MouseEvent) => {\n    onSafeZoneEnter?.(e);\n\n    setSafeZoneCloseTimeout(() => {\n      stateStore.toggleActive(false);\n      onSafeZoneTimeout?.();\n    }, timeout);\n  });\n\n  const onSvgMouseMove = useEventCallback((e: React.MouseEvent) => {\n    setSafeZoneCloseTimeout(() => {\n      stateStore.toggleActive(false);\n      onSafeZoneTimeout?.();\n    }, timeout);\n    onSafeZoneMove?.(e);\n  });\n\n  const onSvgMouseLeave = useEventCallback((e: React.MouseEvent) => {\n    onSafeZoneLeave?.(e);\n  });\n\n  React.useEffect(() => {\n    return stateStore.subscribe(isActive => {\n      if (isActive) {\n        function updateSVGs() {\n          const containerEl = containerRef.current;\n          const targetEl = targetRef.current;\n\n          if (containerEl && targetEl) {\n            safeZoneAreaRef.current?.updateSVG({\n              containerRect: containerEl.getBoundingClientRect(),\n              mouseCoordinates: [mouseCoordinatesRef.current.x, mouseCoordinatesRef.current.y],\n              targetRect: targetEl.getBoundingClientRect(),\n            });\n          }\n\n          requestUpdateFrame(updateSVGs);\n        }\n\n        updateSVGs();\n        return;\n      }\n\n      clearUpdateFrame();\n    });\n  }, [clearUpdateFrame, requestUpdateFrame, stateStore]);\n\n  return {\n    containerRef: useMergedRefs(containerRef, containerListenerRef),\n    targetRef: useMergedRefs(targetRef, targetListenerRef),\n\n    elementToRender: React.useMemo(\n      () =>\n        disabled ? null : (\n          <SafeZoneArea\n            debug={debug}\n            onMouseEnter={onSvgMouseEnter}\n            onMouseMove={onSvgMouseMove}\n            onMouseLeave={onSvgMouseLeave}\n            imperativeRef={safeZoneAreaRef}\n            stateStore={stateStore}\n          />\n        ),\n      [disabled, debug, onSvgMouseEnter, onSvgMouseMove, onSvgMouseLeave, stateStore],\n    ),\n  };\n}\n"],"names":["useAnimationFrame","useEventCallback","useMergedRefs","useTimeout","React","createSafeZoneAreaStateStore","SafeZoneArea","MOUSE_MOVE_TARGET_POLLING_TIMEOUT","useSafeZoneArea","debug","disabled","onSafeZoneEnter","onSafeZoneMove","onSafeZoneLeave","onSafeZoneTimeout","timeout","stateStore","useState","safeZoneAreaRef","useRef","containerRef","targetRef","setSafeZoneCloseTimeout","clearSafeZoneCloseTimeout","requestUpdateFrame","clearUpdateFrame","mouseCoordinatesRef","x","y","containerListenerRef","useMemo","containerEl","onContainerMouseEnter","toggleActive","el","removeEventListener","addEventListener","targetListenerRef","targetEl","onTargetMouseMove","e","current","clientX","clientY","isActive","onSvgMouseEnter","onSvgMouseMove","onSvgMouseLeave","useEffect","subscribe","updateSVGs","updateSVG","containerRect","getBoundingClientRect","mouseCoordinates","targetRect","elementToRender","onMouseEnter","onMouseMove","onMouseLeave","imperativeRef"],"mappings":"AAAA;;;;;+BAyCgBQ;;;;;;;gCAvC+D,4BAA4B;iEAEpF,QAAQ;8CAEc,iCAAiC;8BACd,iBAAiB;AAyBjF;;;;CAIC,GACD,MAAMD,oCAAoC;AAInC,yBAAyB,EAC9BE,QAAQ,KAAK,EACbC,WAAW,KAAK,EAEhBC,eAAe,EACfC,cAAc,EACdC,eAAe,EACfC,iBAAiB,EAEjBC,UAAU,IAAI,EACK,GAAG,CAAC,CAAC;IAKxB,MAAM,CAACC,WAAW,GAAGZ,OAAMa,QAAQ,CAACZ,0DAAAA;IAEpC,MAAMa,kBAAkBd,OAAMe,MAAM,CAA+B;IACnE,MAAMC,eAAehB,OAAMe,MAAM,CAAc;IAC/C,MAAME,YAAYjB,OAAMe,MAAM,CAAc;IAE5C,MAAM,CAACG,yBAAyBC,0BAA0B,OAAGpB,0BAAAA;IAC7D,MAAM,CAACqB,oBAAoBC,iBAAiB,OAAGzB,iCAAAA;IAE/C,MAAM0B,sBAAsBtB,OAAMe,MAAM,CAA2B;QAAEQ,GAAG;QAAGC,GAAG;IAAE;IAEhF,MAAMC,uBAAuBzB,OAAM0B,OAAO,CAAC;QACzC,IAAIpB,UAAU;YACZ,OAAO;YACL,aAAa;YACf;QACF;QAEA,IAAIqB,cAAkC;QAEtC,SAASC;YACPT;YACAP,WAAWiB,YAAY,CAAC;QAC1B;QAEA,OAAO,CAACC;YACN,IAAIA,OAAO,MAAM;gBACfH,gBAAAA,QAAAA,gBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,YAAaI,mBAAmB,CAAC,cAAcH;YACjD;YAEAD,cAAcG;YACdA,OAAAA,QAAAA,OAAAA,KAAAA,IAAAA,KAAAA,IAAAA,GAAIE,gBAAgB,CAAC,cAAcJ;QACrC;IACF,GAAG;QAACT;QAA2Bb;QAAUM;KAAW;IAEpD,MAAMqB,oBAAoBjC,OAAM0B,OAAO,CAAC;QACtC,IAAIpB,UAAU;YACZ,OAAO;YACL,aAAa;YACf;QACF;QAEA,IAAI4B,WAA+B;QAEnC,SAASC,kBAAkBC,CAAa;YACtCd,oBAAoBe,OAAO,GAAG;gBAAEd,GAAGa,EAAEE,OAAO;gBAAEd,GAAGY,EAAEG,OAAO;YAAC;YAE3D,IAAI,CAAC3B,WAAW4B,QAAQ,IAAI;gBAC1B5B,WAAWiB,YAAY,CAAC;YAC1B;YAEAX,wBAAwB;gBACtBN,WAAWiB,YAAY,CAAC;YAC1B,GAAG1B;QACL;QAEA,OAAO,CAAC2B;YACN,IAAIA,OAAO,MAAM;gBACfT;gBACAF;gBAEAe,aAAAA,QAAAA,aAAAA,KAAAA,IAAAA,KAAAA,IAAAA,SAAUH,mBAAmB,CAAC,aAAaI;YAC7C;YAEAD,WAAWJ;YACXA,OAAAA,QAAAA,OAAAA,KAAAA,IAAAA,KAAAA,IAAAA,GAAIE,gBAAgB,CAAC,aAAaG;QACpC;IACF,GAAG;QAACd;QAAkBF;QAA2Bb;QAAUM;QAAYM;KAAwB;IAE/F,MAAMuB,sBAAkB5C,gCAAAA,EAAiB,CAACuC;QACxC7B,oBAAAA,QAAAA,oBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,gBAAkB6B;QAElBlB,wBAAwB;YACtBN,WAAWiB,YAAY,CAAC;YACxBnB,sBAAAA,QAAAA,sBAAAA,KAAAA,IAAAA,KAAAA,IAAAA;QACF,GAAGC;IACL;IAEA,MAAM+B,qBAAiB7C,gCAAAA,EAAiB,CAACuC;QACvClB,wBAAwB;YACtBN,WAAWiB,YAAY,CAAC;YACxBnB,sBAAAA,QAAAA,sBAAAA,KAAAA,IAAAA,KAAAA,IAAAA;QACF,GAAGC;QACHH,mBAAAA,QAAAA,mBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,eAAiB4B;IACnB;IAEA,MAAMO,kBAAkB9C,oCAAAA,EAAiB,CAACuC;QACxC3B,oBAAAA,QAAAA,oBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,gBAAkB2B;IACpB;IAEApC,OAAM4C,SAAS,CAAC;QACd,OAAOhC,WAAWiC,SAAS,CAACL,CAAAA;YAC1B,IAAIA,UAAU;gBACZ,SAASM;oBACP,MAAMnB,cAAcX,aAAaqB,OAAO;oBACxC,MAAMH,WAAWjB,UAAUoB,OAAO;oBAElC,IAAIV,eAAeO,UAAU;4BAC3BpB;yBAAAA,2BAAAA,gBAAgBuB,OAAAA,AAAO,MAAA,QAAvBvB,6BAAAA,KAAAA,IAAAA,KAAAA,IAAAA,yBAAyBiC,SAAS,CAAC;4BACjCC,eAAerB,YAAYsB,qBAAqB;4BAChDC,kBAAkB;gCAAC5B,oBAAoBe,OAAO,CAACd,CAAC;gCAAED,oBAAoBe,OAAO,CAACb,CAAC;6BAAC;4BAChF2B,YAAYjB,SAASe,qBAAqB;wBAC5C;oBACF;oBAEA7B,mBAAmB0B;gBACrB;gBAEAA;gBACA;YACF;YAEAzB;QACF;IACF,GAAG;QAACA;QAAkBD;QAAoBR;KAAW;IAErD,OAAO;QACLI,kBAAclB,6BAAAA,EAAckB,cAAcS;QAC1CR,eAAWnB,6BAAAA,EAAcmB,WAAWgB;QAEpCmB,iBAAiBpD,OAAM0B,OAAO,CAC5B,IACEpB,WAAW,OAAA,WAAA,GACT,OAAA,aAAA,CAACJ,0BAAAA,EAAAA;gBACCG,OAAOA;gBACPgD,cAAcZ;gBACda,aAAaZ;gBACba,cAAcZ;gBACda,eAAe1C;gBACfF,YAAYA;gBAGlB;YAACN;YAAUD;YAAOoC;YAAiBC;YAAgBC;YAAiB/B;SAAW;IAEnF;AACF"}

package/lib-commonjs/usePositioning.js

@@ -1,3 +1,4 @@
+'use client';
 "use strict";
 Object.defineProperty(exports, "__esModule", {
     value: true

package/lib-commonjs/usePositioning.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/usePositioning.ts"],"sourcesContent":["import { canUseDOM, useEventCallback, useIsomorphicLayoutEffect } from '@fluentui/react-utilities';\nimport * as React from 'react';\n\nimport { POSITIONING_END_EVENT } from './constants';\nimport { createPositionManager } from './createPositionManager';\nimport type {\n  PositioningOptions,\n  PositioningProps,\n  PositionManager,\n  TargetElement,\n  UsePositioningReturn,\n} from './types';\nimport { usePositioningOptions } from './usePositioningOptions';\nimport { useCallbackRef, hasAutofocusFilter } from './utils';\n\n/**\n * @internal\n */\nexport function usePositioning(options: PositioningProps & PositioningOptions): UsePositioningReturn {\n  'use no memo';\n\n  const managerRef = React.useRef<PositionManager | null>(null);\n  const targetRef = React.useRef<TargetElement | null>(null);\n  const overrideTargetRef = React.useRef<TargetElement | null>(null);\n  const containerRef = React.useRef<HTMLElement | null>(null);\n  const arrowRef = React.useRef<HTMLElement | null>(null);\n\n  const { enabled = true } = options;\n  const resolvePositioningOptions = usePositioningOptions(options);\n  const updatePositionManager = React.useCallback(() => {\n    if (managerRef.current) {\n      managerRef.current.dispose();\n    }\n    managerRef.current = null;\n\n    const target = overrideTargetRef.current ?? targetRef.current;\n\n    if (enabled && canUseDOM() && target && containerRef.current) {\n      managerRef.current = createPositionManager({\n        container: containerRef.current,\n        target,\n        arrow: arrowRef.current,\n        ...resolvePositioningOptions(containerRef.current, arrowRef.current),\n      });\n    }\n  }, [enabled, resolvePositioningOptions]);\n\n  const setOverrideTarget = useEventCallback((target: TargetElement | null) => {\n    overrideTargetRef.current = target;\n    updatePositionManager();\n  });\n\n  React.useImperativeHandle(\n    options.positioningRef,\n    () => ({\n      updatePosition: () => managerRef.current?.updatePosition(),\n      setTarget: (target: TargetElement | null) => {\n        if (options.target && process.env.NODE_ENV !== 'production') {\n          const err = new Error();\n          // eslint-disable-next-line no-console\n          console.warn('Imperative setTarget should not be used at the same time as target option');\n          // eslint-disable-next-line no-console\n          console.warn(err.stack);\n        }\n\n        setOverrideTarget(target);\n      },\n    }),\n    [options.target, setOverrideTarget],\n  );\n\n  useIsomorphicLayoutEffect(() => {\n    setOverrideTarget(options.target ?? null);\n  }, [options.target, setOverrideTarget]);\n\n  useIsomorphicLayoutEffect(() => {\n    updatePositionManager();\n  }, [updatePositionManager]);\n\n  if (process.env.NODE_ENV !== 'production') {\n    // This checked should run only in development mode\n    // eslint-disable-next-line react-hooks/rules-of-hooks\n    React.useEffect(() => {\n      if (containerRef.current) {\n        const contentNode = containerRef.current;\n        const treeWalker = contentNode.ownerDocument?.createTreeWalker(contentNode, NodeFilter.SHOW_ELEMENT, {\n          acceptNode: hasAutofocusFilter,\n        });\n\n        while (treeWalker.nextNode()) {\n          const node = treeWalker.currentNode;\n          // eslint-disable-next-line no-console\n          console.warn('usePositioning():', node);\n          // eslint-disable-next-line no-console\n          console.warn(\n            [\n              'usePositioning(): ^ this node contains \"autoFocus\" prop on a React element. This can break the initial',\n              'positioning of an element and cause a window jump effect. This issue occurs because React polyfills',\n              '\"autoFocus\" behavior to solve inconsistencies between different browsers:',\n              'https://github.com/facebook/react/issues/11851#issuecomment-351787078',\n              '\\n',\n              'However, \".focus()\" in this case occurs before any other React effects will be executed',\n              '(React.useEffect(), componentDidMount(), etc.) and we can not prevent this behavior. If you really',\n              'want to use \"autoFocus\" please add \"position: fixed\" to styles of the element that is wrapped by',\n              '\"Popper\".',\n              `In general, it's not recommended to use \"autoFocus\" as it may break accessibility aspects:`,\n              'https://github.com/jsx-eslint/eslint-plugin-jsx-a11y/blob/master/docs/rules/no-autofocus.md',\n              '\\n',\n              'We suggest to use the \"trapFocus\" prop on Fluent components or a catch \"ref\" and then use',\n              '\"ref.current.focus\" in React.useEffect():',\n              'https://reactjs.org/docs/refs-and-the-dom.html#adding-a-ref-to-a-dom-element',\n            ].join(' '),\n          );\n        }\n      }\n      // We run this check once, no need to add deps here\n      // TODO: Should be rework to handle options.enabled and contentRef updates\n    }, []);\n  }\n\n  const setTarget = useCallbackRef<TargetElement>(null, target => {\n    if (targetRef.current !== target) {\n      targetRef.current = target;\n      updatePositionManager();\n    }\n  });\n\n  const onPositioningEnd = useEventCallback(() => options.onPositioningEnd?.());\n  const setContainer = useCallbackRef<HTMLElement | null>(null, container => {\n    if (containerRef.current !== container) {\n      containerRef.current?.removeEventListener(POSITIONING_END_EVENT, onPositioningEnd);\n      container?.addEventListener(POSITIONING_END_EVENT, onPositioningEnd);\n      containerRef.current = container;\n      updatePositionManager();\n    }\n  });\n\n  const setArrow = useCallbackRef<HTMLElement | null>(null, arrow => {\n    if (arrowRef.current !== arrow) {\n      arrowRef.current = arrow;\n      updatePositionManager();\n    }\n  });\n\n  // Let users use callback refs so they feel like 'normal' DOM refs\n  return { targetRef: setTarget, containerRef: setContainer, arrowRef: setArrow };\n}\n"],"names":["canUseDOM","useEventCallback","useIsomorphicLayoutEffect","React","POSITIONING_END_EVENT","createPositionManager","usePositioningOptions","useCallbackRef","hasAutofocusFilter","usePositioning","options","managerRef","useRef","targetRef","overrideTargetRef","containerRef","arrowRef","enabled","resolvePositioningOptions","updatePositionManager","useCallback","current","dispose","target","container","arrow","setOverrideTarget","useImperativeHandle","positioningRef","updatePosition","setTarget","process","env","NODE_ENV","err","Error","console","warn","stack","useEffect","contentNode","treeWalker","ownerDocument","createTreeWalker","NodeFilter","SHOW_ELEMENT","acceptNode","nextNode","node","currentNode","join","onPositioningEnd","setContainer","removeEventListener","addEventListener","setArrow"],"mappings":"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"}
+{"version":3,"sources":["../src/usePositioning.ts"],"sourcesContent":["'use client';\n\nimport { canUseDOM, useEventCallback, useIsomorphicLayoutEffect } from '@fluentui/react-utilities';\nimport * as React from 'react';\n\nimport { POSITIONING_END_EVENT } from './constants';\nimport { createPositionManager } from './createPositionManager';\nimport type {\n  PositioningOptions,\n  PositioningProps,\n  PositionManager,\n  TargetElement,\n  UsePositioningReturn,\n} from './types';\nimport { usePositioningOptions } from './usePositioningOptions';\nimport { useCallbackRef, hasAutofocusFilter } from './utils';\n\n/**\n * @internal\n */\nexport function usePositioning(options: PositioningProps & PositioningOptions): UsePositioningReturn {\n  'use no memo';\n\n  const managerRef = React.useRef<PositionManager | null>(null);\n  const targetRef = React.useRef<TargetElement | null>(null);\n  const overrideTargetRef = React.useRef<TargetElement | null>(null);\n  const containerRef = React.useRef<HTMLElement | null>(null);\n  const arrowRef = React.useRef<HTMLElement | null>(null);\n\n  const { enabled = true } = options;\n  const resolvePositioningOptions = usePositioningOptions(options);\n  const updatePositionManager = React.useCallback(() => {\n    if (managerRef.current) {\n      managerRef.current.dispose();\n    }\n    managerRef.current = null;\n\n    const target = overrideTargetRef.current ?? targetRef.current;\n\n    if (enabled && canUseDOM() && target && containerRef.current) {\n      managerRef.current = createPositionManager({\n        container: containerRef.current,\n        target,\n        arrow: arrowRef.current,\n        ...resolvePositioningOptions(containerRef.current, arrowRef.current),\n      });\n    }\n  }, [enabled, resolvePositioningOptions]);\n\n  const setOverrideTarget = useEventCallback((target: TargetElement | null) => {\n    overrideTargetRef.current = target;\n    updatePositionManager();\n  });\n\n  React.useImperativeHandle(\n    options.positioningRef,\n    () => ({\n      updatePosition: () => managerRef.current?.updatePosition(),\n      setTarget: (target: TargetElement | null) => {\n        if (options.target && process.env.NODE_ENV !== 'production') {\n          const err = new Error();\n          // eslint-disable-next-line no-console\n          console.warn('Imperative setTarget should not be used at the same time as target option');\n          // eslint-disable-next-line no-console\n          console.warn(err.stack);\n        }\n\n        setOverrideTarget(target);\n      },\n    }),\n    [options.target, setOverrideTarget],\n  );\n\n  useIsomorphicLayoutEffect(() => {\n    setOverrideTarget(options.target ?? null);\n  }, [options.target, setOverrideTarget]);\n\n  useIsomorphicLayoutEffect(() => {\n    updatePositionManager();\n  }, [updatePositionManager]);\n\n  if (process.env.NODE_ENV !== 'production') {\n    // This checked should run only in development mode\n    // eslint-disable-next-line react-hooks/rules-of-hooks\n    React.useEffect(() => {\n      if (containerRef.current) {\n        const contentNode = containerRef.current;\n        const treeWalker = contentNode.ownerDocument?.createTreeWalker(contentNode, NodeFilter.SHOW_ELEMENT, {\n          acceptNode: hasAutofocusFilter,\n        });\n\n        while (treeWalker.nextNode()) {\n          const node = treeWalker.currentNode;\n          // eslint-disable-next-line no-console\n          console.warn('usePositioning():', node);\n          // eslint-disable-next-line no-console\n          console.warn(\n            [\n              'usePositioning(): ^ this node contains \"autoFocus\" prop on a React element. This can break the initial',\n              'positioning of an element and cause a window jump effect. This issue occurs because React polyfills',\n              '\"autoFocus\" behavior to solve inconsistencies between different browsers:',\n              'https://github.com/facebook/react/issues/11851#issuecomment-351787078',\n              '\\n',\n              'However, \".focus()\" in this case occurs before any other React effects will be executed',\n              '(React.useEffect(), componentDidMount(), etc.) and we can not prevent this behavior. If you really',\n              'want to use \"autoFocus\" please add \"position: fixed\" to styles of the element that is wrapped by',\n              '\"Popper\".',\n              `In general, it's not recommended to use \"autoFocus\" as it may break accessibility aspects:`,\n              'https://github.com/jsx-eslint/eslint-plugin-jsx-a11y/blob/master/docs/rules/no-autofocus.md',\n              '\\n',\n              'We suggest to use the \"trapFocus\" prop on Fluent components or a catch \"ref\" and then use',\n              '\"ref.current.focus\" in React.useEffect():',\n              'https://reactjs.org/docs/refs-and-the-dom.html#adding-a-ref-to-a-dom-element',\n            ].join(' '),\n          );\n        }\n      }\n      // We run this check once, no need to add deps here\n      // TODO: Should be rework to handle options.enabled and contentRef updates\n    }, []);\n  }\n\n  const setTarget = useCallbackRef<TargetElement>(null, target => {\n    if (targetRef.current !== target) {\n      targetRef.current = target;\n      updatePositionManager();\n    }\n  });\n\n  const onPositioningEnd = useEventCallback(() => options.onPositioningEnd?.());\n  const setContainer = useCallbackRef<HTMLElement | null>(null, container => {\n    if (containerRef.current !== container) {\n      containerRef.current?.removeEventListener(POSITIONING_END_EVENT, onPositioningEnd);\n      container?.addEventListener(POSITIONING_END_EVENT, onPositioningEnd);\n      containerRef.current = container;\n      updatePositionManager();\n    }\n  });\n\n  const setArrow = useCallbackRef<HTMLElement | null>(null, arrow => {\n    if (arrowRef.current !== arrow) {\n      arrowRef.current = arrow;\n      updatePositionManager();\n    }\n  });\n\n  // Let users use callback refs so they feel like 'normal' DOM refs\n  return { targetRef: setTarget, containerRef: setContainer, arrowRef: setArrow };\n}\n"],"names":["canUseDOM","useEventCallback","useIsomorphicLayoutEffect","React","POSITIONING_END_EVENT","createPositionManager","usePositioningOptions","useCallbackRef","hasAutofocusFilter","usePositioning","options","managerRef","useRef","targetRef","overrideTargetRef","containerRef","arrowRef","enabled","resolvePositioningOptions","updatePositionManager","useCallback","current","dispose","target","container","arrow","setOverrideTarget","useImperativeHandle","positioningRef","updatePosition","setTarget","process","env","NODE_ENV","err","Error","console","warn","stack","useEffect","contentNode","treeWalker","ownerDocument","createTreeWalker","NodeFilter","SHOW_ELEMENT","acceptNode","nextNode","node","currentNode","join","onPositioningEnd","setContainer","removeEventListener","addEventListener","setArrow"],"mappings":"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"}

package/lib-commonjs/usePositioningMouseTarget.js

@@ -1,3 +1,4 @@
+'use client';
 "use strict";
 Object.defineProperty(exports, "__esModule", {
     value: true

package/lib-commonjs/usePositioningMouseTarget.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/usePositioningMouseTarget.ts"],"sourcesContent":["import * as React from 'react';\nimport { createVirtualElementFromClick } from './createVirtualElementFromClick';\nimport { PositioningVirtualElement, SetVirtualMouseTarget } from './types';\n\n/**\n * @internal\n * A state hook that manages a popper virtual element from mouseevents.\n * Useful for scenarios where a component needs to be positioned by mouse click (e.g. contextmenu)\n * React synthetic events are not persisted by this hook\n *\n * @param initialState - initializes a user provided state similare to useState\n * @returns state and dispatcher for a Popper virtual element that uses native/synthetic mouse events\n */\nexport const usePositioningMouseTarget = (\n  initialState?: PositioningVirtualElement | (() => PositioningVirtualElement),\n): readonly [PositioningVirtualElement | undefined, SetVirtualMouseTarget] => {\n  const [virtualElement, setVirtualElement] = React.useState<PositioningVirtualElement | undefined>(initialState);\n\n  const setVirtualMouseTarget: SetVirtualMouseTarget = event => {\n    if (event === undefined || event === null) {\n      setVirtualElement(undefined);\n      return;\n    }\n\n    let mouseevent: MouseEvent;\n    if (!(event instanceof MouseEvent)) {\n      mouseevent = event.nativeEvent;\n    } else {\n      mouseevent = event;\n    }\n\n    if (!(mouseevent instanceof MouseEvent) && process.env.NODE_ENV !== 'production') {\n      // eslint-disable-next-line no-console\n      console.error('usePositioningMouseTarget should only be used with MouseEvent');\n    }\n\n    const contextTarget = createVirtualElementFromClick(mouseevent);\n    setVirtualElement(contextTarget);\n  };\n\n  return [virtualElement, setVirtualMouseTarget] as const;\n};\n"],"names":["React","createVirtualElementFromClick","usePositioningMouseTarget","initialState","virtualElement","setVirtualElement","useState","setVirtualMouseTarget","event","undefined","mouseevent","MouseEvent","nativeEvent","process","env","NODE_ENV","console","error","contextTarget"],"mappings":";;;;+BAaaE;;;;;;;iEAbU,QAAQ;+CACe,kCAAkC;AAYzE,kCAAkC,CACvCC;IAEA,MAAM,CAACC,gBAAgBC,kBAAkB,GAAGL,OAAMM,QAAQ,CAAwCH;IAElG,MAAMI,wBAA+CC,CAAAA;QACnD,IAAIA,UAAUC,aAAaD,UAAU,MAAM;YACzCH,kBAAkBI;YAClB;QACF;QAEA,IAAIC;QACJ,IAAI,CAAEF,CAAAA,iBAAiBG,UAAAA,CAAS,EAAI;YAClCD,aAAaF,MAAMI,WAAW;QAChC,OAAO;YACLF,aAAaF;QACf;QAEA,IAAI,CAAEE,CAAAA,sBAAsBC,UAAAA,CAAS,IAAME,QAAQC,GAAG,CAACC,QAAQ,KAAK,cAAc;YAChF,sCAAsC;YACtCC,QAAQC,KAAK,CAAC;QAChB;QAEA,MAAMC,oBAAgBjB,4DAAAA,EAA8BS;QACpDL,kBAAkBa;IACpB;IAEA,OAAO;QAACd;QAAgBG;KAAsB;AAChD,EAAE"}
+{"version":3,"sources":["../src/usePositioningMouseTarget.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { createVirtualElementFromClick } from './createVirtualElementFromClick';\nimport { PositioningVirtualElement, SetVirtualMouseTarget } from './types';\n\n/**\n * @internal\n * A state hook that manages a popper virtual element from mouseevents.\n * Useful for scenarios where a component needs to be positioned by mouse click (e.g. contextmenu)\n * React synthetic events are not persisted by this hook\n *\n * @param initialState - initializes a user provided state similare to useState\n * @returns state and dispatcher for a Popper virtual element that uses native/synthetic mouse events\n */\nexport const usePositioningMouseTarget = (\n  initialState?: PositioningVirtualElement | (() => PositioningVirtualElement),\n): readonly [PositioningVirtualElement | undefined, SetVirtualMouseTarget] => {\n  const [virtualElement, setVirtualElement] = React.useState<PositioningVirtualElement | undefined>(initialState);\n\n  const setVirtualMouseTarget: SetVirtualMouseTarget = event => {\n    if (event === undefined || event === null) {\n      setVirtualElement(undefined);\n      return;\n    }\n\n    let mouseevent: MouseEvent;\n    if (!(event instanceof MouseEvent)) {\n      mouseevent = event.nativeEvent;\n    } else {\n      mouseevent = event;\n    }\n\n    if (!(mouseevent instanceof MouseEvent) && process.env.NODE_ENV !== 'production') {\n      // eslint-disable-next-line no-console\n      console.error('usePositioningMouseTarget should only be used with MouseEvent');\n    }\n\n    const contextTarget = createVirtualElementFromClick(mouseevent);\n    setVirtualElement(contextTarget);\n  };\n\n  return [virtualElement, setVirtualMouseTarget] as const;\n};\n"],"names":["React","createVirtualElementFromClick","usePositioningMouseTarget","initialState","virtualElement","setVirtualElement","useState","setVirtualMouseTarget","event","undefined","mouseevent","MouseEvent","nativeEvent","process","env","NODE_ENV","console","error","contextTarget"],"mappings":"AAAA;;;;;+BAeaE;;;;;;;iEAbU,QAAQ;+CACe,kCAAkC;AAYzE,kCAAkC,CACvCC;IAEA,MAAM,CAACC,gBAAgBC,kBAAkB,GAAGL,OAAMM,QAAQ,CAAwCH;IAElG,MAAMI,wBAA+CC,CAAAA;QACnD,IAAIA,UAAUC,aAAaD,UAAU,MAAM;YACzCH,kBAAkBI;YAClB;QACF;QAEA,IAAIC;QACJ,IAAI,CAAEF,CAAAA,iBAAiBG,UAAAA,CAAS,EAAI;YAClCD,aAAaF,MAAMI,WAAW;QAChC,OAAO;YACLF,aAAaF;QACf;QAEA,IAAI,CAAEE,CAAAA,sBAAsBC,UAAAA,CAAS,IAAME,QAAQC,GAAG,CAACC,QAAQ,KAAK,cAAc;YAChF,sCAAsC;YACtCC,QAAQC,KAAK,CAAC;QAChB;QAEA,MAAMC,oBAAgBjB,4DAAAA,EAA8BS;QACpDL,kBAAkBa;IACpB;IAEA,OAAO;QAACd;QAAgBG;KAAsB;AAChD,EAAE"}

package/lib-commonjs/usePositioningOptions.js

@@ -1,3 +1,4 @@
+'use client';
 "use strict";
 Object.defineProperty(exports, "__esModule", {
     value: true

package/lib-commonjs/usePositioningOptions.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/usePositioningOptions.ts"],"sourcesContent":["import { devtools } from '@floating-ui/devtools';\nimport { hide as hideMiddleware, arrow as arrowMiddleware } from '@floating-ui/dom';\nimport type { Middleware, Placement, Strategy } from '@floating-ui/dom';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport * as React from 'react';\n\nimport {\n  shift as shiftMiddleware,\n  flip as flipMiddleware,\n  coverTarget as coverTargetMiddleware,\n  maxSize as maxSizeMiddleware,\n  resetMaxSize as resetMaxSizeMiddleware,\n  offset as offsetMiddleware,\n  intersecting as intersectingMiddleware,\n  matchTargetSize as matchTargetSizeMiddleware,\n} from './middleware';\nimport type { PositioningConfigurationFn, PositioningConfigurationFnOptions, PositioningOptions } from './types';\nimport { toFloatingUIPlacement, hasScrollParent, normalizeAutoSize } from './utils';\nimport { devtoolsCallback } from './utils/devtools';\nimport { usePositioningConfiguration } from './PositioningConfigurationContext';\n\n/**\n * @internal\n *\n * This is redundant and exists only to manage React dependencies properly & avoid leaking individual options to the\n * scope of `usePositioningOptions`.\n */\nfunction usePositioningConfigFn(\n  configFn: PositioningConfigurationFn,\n  options: PositioningOptions,\n): (container: HTMLElement, arrow: HTMLElement | null) => PositioningConfigurationFnOptions {\n  const {\n    align,\n    arrowPadding,\n    autoSize,\n    coverTarget,\n    disableUpdateOnResize,\n    flipBoundary,\n    offset,\n    overflowBoundary,\n    pinned,\n    position,\n    // eslint-disable-next-line @typescript-eslint/naming-convention\n    unstable_disableTether,\n    strategy,\n    overflowBoundaryPadding,\n    fallbackPositions,\n    useTransform,\n    matchTargetSize,\n    shiftToCoverTarget,\n  } = options;\n\n  return React.useCallback(\n    (container: HTMLElement, arrow: HTMLElement | null) => {\n      return configFn({\n        container,\n        arrow,\n        options: {\n          autoSize,\n          disableUpdateOnResize,\n          matchTargetSize,\n          offset,\n          strategy,\n          coverTarget,\n          flipBoundary,\n          overflowBoundary,\n          useTransform,\n          overflowBoundaryPadding,\n          pinned,\n          arrowPadding,\n          align,\n          fallbackPositions,\n          shiftToCoverTarget,\n          position,\n          // eslint-disable-next-line @typescript-eslint/naming-convention\n          unstable_disableTether,\n        },\n      });\n    },\n    [\n      autoSize,\n      disableUpdateOnResize,\n      matchTargetSize,\n      offset,\n      strategy,\n      coverTarget,\n      flipBoundary,\n      overflowBoundary,\n      useTransform,\n      overflowBoundaryPadding,\n      pinned,\n      arrowPadding,\n      align,\n      fallbackPositions,\n      shiftToCoverTarget,\n      position,\n      unstable_disableTether,\n      configFn,\n    ],\n  );\n}\n\n/**\n * @internal\n */\nexport function usePositioningOptions(options: PositioningOptions): (\n  container: HTMLElement,\n  arrow: HTMLElement | null,\n) => {\n  placement: Placement | undefined;\n  middleware: Middleware[];\n  strategy: Strategy;\n  disableUpdateOnResize?: boolean;\n  useTransform?: boolean;\n} {\n  const { dir, targetDocument } = useFluent();\n  const isRtl = dir === 'rtl';\n\n  const configFn = usePositioningConfigFn(usePositioningConfiguration(), options);\n  const {\n    // eslint-disable-next-line @typescript-eslint/no-deprecated\n    positionFixed,\n  } = options;\n\n  return React.useCallback(\n    (container: HTMLElement, arrow: HTMLElement | null) => {\n      const hasScrollableElement = hasScrollParent(container);\n\n      const optionsAfterEnhancement = configFn(container, arrow);\n      const {\n        autoSize,\n        disableUpdateOnResize,\n        matchTargetSize,\n        offset,\n        coverTarget,\n        flipBoundary,\n        overflowBoundary,\n        useTransform,\n        overflowBoundaryPadding,\n        pinned,\n        position,\n        arrowPadding,\n        strategy,\n        align,\n        fallbackPositions,\n        shiftToCoverTarget,\n        // eslint-disable-next-line @typescript-eslint/naming-convention\n        unstable_disableTether,\n      } = optionsAfterEnhancement;\n      const normalizedAutoSize = normalizeAutoSize(autoSize);\n\n      const middleware = [\n        normalizedAutoSize && resetMaxSizeMiddleware(normalizedAutoSize),\n        matchTargetSize && matchTargetSizeMiddleware(),\n        offset && offsetMiddleware(offset),\n        coverTarget && coverTargetMiddleware(),\n        !pinned && flipMiddleware({ container, flipBoundary, hasScrollableElement, isRtl, fallbackPositions }),\n        shiftMiddleware({\n          container,\n          hasScrollableElement,\n          overflowBoundary,\n          disableTether: unstable_disableTether,\n          overflowBoundaryPadding,\n          isRtl,\n          shiftToCoverTarget,\n        }),\n        normalizedAutoSize &&\n          maxSizeMiddleware(normalizedAutoSize, { container, overflowBoundary, overflowBoundaryPadding, isRtl }),\n        intersectingMiddleware(),\n        arrow && arrowMiddleware({ element: arrow, padding: arrowPadding }),\n        hideMiddleware({ strategy: 'referenceHidden' }),\n        hideMiddleware({ strategy: 'escaped' }),\n        process.env.NODE_ENV !== 'production' &&\n          targetDocument &&\n          devtools(targetDocument, devtoolsCallback(optionsAfterEnhancement)),\n      ].filter(Boolean) as Middleware[];\n\n      const placement = toFloatingUIPlacement(align, position, isRtl);\n\n      return {\n        placement,\n        middleware,\n        strategy: strategy ?? positionFixed ? ('fixed' as const) : ('absolute' as const),\n\n        disableUpdateOnResize,\n        useTransform,\n      };\n    },\n    [configFn, isRtl, targetDocument, positionFixed],\n  );\n}\n"],"names":["devtools","hide","hideMiddleware","arrow","arrowMiddleware","useFluent_unstable","useFluent","React","shift","shiftMiddleware","flip","flipMiddleware","coverTarget","coverTargetMiddleware","maxSize","maxSizeMiddleware","resetMaxSize","resetMaxSizeMiddleware","offset","offsetMiddleware","intersecting","intersectingMiddleware","matchTargetSize","matchTargetSizeMiddleware","toFloatingUIPlacement","hasScrollParent","normalizeAutoSize","devtoolsCallback","usePositioningConfiguration","usePositioningConfigFn","configFn","options","align","arrowPadding","autoSize","disableUpdateOnResize","flipBoundary","overflowBoundary","pinned","position","unstable_disableTether","strategy","overflowBoundaryPadding","fallbackPositions","useTransform","shiftToCoverTarget","useCallback","container","usePositioningOptions","dir","targetDocument","isRtl","positionFixed","hasScrollableElement","optionsAfterEnhancement","normalizedAutoSize","middleware","disableTether","element","padding","process","env","NODE_ENV","filter","Boolean","placement"],"mappings":"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"}
+{"version":3,"sources":["../src/usePositioningOptions.ts"],"sourcesContent":["'use client';\n\nimport { devtools } from '@floating-ui/devtools';\nimport { hide as hideMiddleware, arrow as arrowMiddleware } from '@floating-ui/dom';\nimport type { Middleware, Placement, Strategy } from '@floating-ui/dom';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport * as React from 'react';\n\nimport {\n  shift as shiftMiddleware,\n  flip as flipMiddleware,\n  coverTarget as coverTargetMiddleware,\n  maxSize as maxSizeMiddleware,\n  resetMaxSize as resetMaxSizeMiddleware,\n  offset as offsetMiddleware,\n  intersecting as intersectingMiddleware,\n  matchTargetSize as matchTargetSizeMiddleware,\n} from './middleware';\nimport type { PositioningConfigurationFn, PositioningConfigurationFnOptions, PositioningOptions } from './types';\nimport { toFloatingUIPlacement, hasScrollParent, normalizeAutoSize } from './utils';\nimport { devtoolsCallback } from './utils/devtools';\nimport { usePositioningConfiguration } from './PositioningConfigurationContext';\n\n/**\n * @internal\n *\n * This is redundant and exists only to manage React dependencies properly & avoid leaking individual options to the\n * scope of `usePositioningOptions`.\n */\nfunction usePositioningConfigFn(\n  configFn: PositioningConfigurationFn,\n  options: PositioningOptions,\n): (container: HTMLElement, arrow: HTMLElement | null) => PositioningConfigurationFnOptions {\n  const {\n    align,\n    arrowPadding,\n    autoSize,\n    coverTarget,\n    disableUpdateOnResize,\n    flipBoundary,\n    offset,\n    overflowBoundary,\n    pinned,\n    position,\n    // eslint-disable-next-line @typescript-eslint/naming-convention\n    unstable_disableTether,\n    strategy,\n    overflowBoundaryPadding,\n    fallbackPositions,\n    useTransform,\n    matchTargetSize,\n    shiftToCoverTarget,\n  } = options;\n\n  return React.useCallback(\n    (container: HTMLElement, arrow: HTMLElement | null) => {\n      return configFn({\n        container,\n        arrow,\n        options: {\n          autoSize,\n          disableUpdateOnResize,\n          matchTargetSize,\n          offset,\n          strategy,\n          coverTarget,\n          flipBoundary,\n          overflowBoundary,\n          useTransform,\n          overflowBoundaryPadding,\n          pinned,\n          arrowPadding,\n          align,\n          fallbackPositions,\n          shiftToCoverTarget,\n          position,\n          // eslint-disable-next-line @typescript-eslint/naming-convention\n          unstable_disableTether,\n        },\n      });\n    },\n    [\n      autoSize,\n      disableUpdateOnResize,\n      matchTargetSize,\n      offset,\n      strategy,\n      coverTarget,\n      flipBoundary,\n      overflowBoundary,\n      useTransform,\n      overflowBoundaryPadding,\n      pinned,\n      arrowPadding,\n      align,\n      fallbackPositions,\n      shiftToCoverTarget,\n      position,\n      unstable_disableTether,\n      configFn,\n    ],\n  );\n}\n\n/**\n * @internal\n */\nexport function usePositioningOptions(options: PositioningOptions): (\n  container: HTMLElement,\n  arrow: HTMLElement | null,\n) => {\n  placement: Placement | undefined;\n  middleware: Middleware[];\n  strategy: Strategy;\n  disableUpdateOnResize?: boolean;\n  useTransform?: boolean;\n} {\n  const { dir, targetDocument } = useFluent();\n  const isRtl = dir === 'rtl';\n\n  const configFn = usePositioningConfigFn(usePositioningConfiguration(), options);\n  const {\n    // eslint-disable-next-line @typescript-eslint/no-deprecated\n    positionFixed,\n  } = options;\n\n  return React.useCallback(\n    (container: HTMLElement, arrow: HTMLElement | null) => {\n      const hasScrollableElement = hasScrollParent(container);\n\n      const optionsAfterEnhancement = configFn(container, arrow);\n      const {\n        autoSize,\n        disableUpdateOnResize,\n        matchTargetSize,\n        offset,\n        coverTarget,\n        flipBoundary,\n        overflowBoundary,\n        useTransform,\n        overflowBoundaryPadding,\n        pinned,\n        position,\n        arrowPadding,\n        strategy,\n        align,\n        fallbackPositions,\n        shiftToCoverTarget,\n        // eslint-disable-next-line @typescript-eslint/naming-convention\n        unstable_disableTether,\n      } = optionsAfterEnhancement;\n      const normalizedAutoSize = normalizeAutoSize(autoSize);\n\n      const middleware = [\n        normalizedAutoSize && resetMaxSizeMiddleware(normalizedAutoSize),\n        matchTargetSize && matchTargetSizeMiddleware(),\n        offset && offsetMiddleware(offset),\n        coverTarget && coverTargetMiddleware(),\n        !pinned && flipMiddleware({ container, flipBoundary, hasScrollableElement, isRtl, fallbackPositions }),\n        shiftMiddleware({\n          container,\n          hasScrollableElement,\n          overflowBoundary,\n          disableTether: unstable_disableTether,\n          overflowBoundaryPadding,\n          isRtl,\n          shiftToCoverTarget,\n        }),\n        normalizedAutoSize &&\n          maxSizeMiddleware(normalizedAutoSize, { container, overflowBoundary, overflowBoundaryPadding, isRtl }),\n        intersectingMiddleware(),\n        arrow && arrowMiddleware({ element: arrow, padding: arrowPadding }),\n        hideMiddleware({ strategy: 'referenceHidden' }),\n        hideMiddleware({ strategy: 'escaped' }),\n        process.env.NODE_ENV !== 'production' &&\n          targetDocument &&\n          devtools(targetDocument, devtoolsCallback(optionsAfterEnhancement)),\n      ].filter(Boolean) as Middleware[];\n\n      const placement = toFloatingUIPlacement(align, position, isRtl);\n\n      return {\n        placement,\n        middleware,\n        strategy: strategy ?? positionFixed ? ('fixed' as const) : ('absolute' as const),\n\n        disableUpdateOnResize,\n        useTransform,\n      };\n    },\n    [configFn, isRtl, targetDocument, positionFixed],\n  );\n}\n"],"names":["devtools","hide","hideMiddleware","arrow","arrowMiddleware","useFluent_unstable","useFluent","React","shift","shiftMiddleware","flip","flipMiddleware","coverTarget","coverTargetMiddleware","maxSize","maxSizeMiddleware","resetMaxSize","resetMaxSizeMiddleware","offset","offsetMiddleware","intersecting","intersectingMiddleware","matchTargetSize","matchTargetSizeMiddleware","toFloatingUIPlacement","hasScrollParent","normalizeAutoSize","devtoolsCallback","usePositioningConfiguration","usePositioningConfigFn","configFn","options","align","arrowPadding","autoSize","disableUpdateOnResize","flipBoundary","overflowBoundary","pinned","position","unstable_disableTether","strategy","overflowBoundaryPadding","fallbackPositions","useTransform","shiftToCoverTarget","useCallback","container","usePositioningOptions","dir","targetDocument","isRtl","positionFixed","hasScrollableElement","optionsAfterEnhancement","normalizedAutoSize","middleware","disableTether","element","padding","process","env","NODE_ENV","filter","Boolean","placement"],"mappings":"AAAA;;;;;+BA2GgBgD;;;;;;;0BAzGS,wBAAwB;qBACgB,mBAAmB;qCAEpC,kCAAkC;iEAC3D,QAAQ;4BAWxB,eAAe;uBAEoD,UAAU;2BACnD,mBAAmB;iDACR,oCAAoC;AAEhF;;;;;CAKC,GACD,SAASnB,uBACPC,QAAoC,EACpCC,OAA2B;IAE3B,MAAM,EACJC,KAAK,EACLC,YAAY,EACZC,QAAQ,EACRtB,WAAW,EACXuB,qBAAqB,EACrBC,YAAY,EACZlB,MAAM,EACNmB,gBAAgB,EAChBC,MAAM,EACNC,QAAQ,EACR,AACAC,sBAAsB,EACtBC,QAAQ,EACRC,uBAAuB,EACvBC,KAJgE,YAI/C,EACjBC,YAAY,EACZtB,eAAe,EACfuB,kBAAkB,EACnB,GAAGd;IAEJ,OAAOxB,OAAMuC,WAAW,CACtB,CAACC,WAAwB5C;QACvB,OAAO2B,SAAS;YACdiB;YACA5C;YACA4B,SAAS;gBACPG;gBACAC;gBACAb;gBACAJ;gBACAuB;gBACA7B;gBACAwB;gBACAC;gBACAO;gBACAF;gBACAJ;gBACAL;gBACAD;gBACAW;gBACAE;gBACAN;gBACA,gEAAgE;gBAChEC;YACF;QACF;IACF,GACA;QACEN;QACAC;QACAb;QACAJ;QACAuB;QACA7B;QACAwB;QACAC;QACAO;QACAF;QACAJ;QACAL;QACAD;QACAW;QACAE;QACAN;QACAC;QACAV;KACD;AAEL;AAKO,+BAA+BC,OAA2B;IAU/D,MAAM,EAAEkB,GAAG,EAAEC,cAAc,EAAE,OAAG5C,uCAAAA;IAChC,MAAM6C,QAAQF,QAAQ;IAEtB,MAAMnB,WAAWD,2BAAuBD,4DAAAA,KAA+BG;IACvE,MAAM,EACJ,AACAqB,aAAa,EACd,GAAGrB,0CAF0D;IAI9D,OAAOxB,OAAMuC,WAAW,CACtB,CAACC,WAAwB5C;QACvB,MAAMkD,uBAAuB5B,0BAAAA,EAAgBsB;QAE7C,MAAMO,0BAA0BxB,SAASiB,WAAW5C;QACpD,MAAM,EACJ+B,QAAQ,EACRC,qBAAqB,EACrBb,eAAe,EACfJ,MAAM,EACNN,WAAW,EACXwB,YAAY,EACZC,gBAAgB,EAChBO,YAAY,EACZF,uBAAuB,EACvBJ,MAAM,EACNC,QAAQ,EACRN,YAAY,EACZQ,QAAQ,EACRT,KAAK,EACLW,iBAAiB,EACjBE,kBAAkB,EAClB,AACAL,sBAAsB,EACvB,GAAGc,qCAF8D;QAGlE,MAAMC,yBAAqB7B,wBAAAA,EAAkBQ;QAE7C,MAAMsB,aAAa;YACjBD,0BAAsBtC,wBAAAA,EAAuBsC;YAC7CjC,uBAAmBC,2BAAAA;YACnBL,cAAUC,kBAAAA,EAAiBD;YAC3BN,mBAAeC,uBAAAA;YACf,CAACyB,cAAU3B,gBAAAA,EAAe;gBAAEoC;gBAAWX;gBAAciB;gBAAsBF;gBAAOR;YAAkB;YACpGlC,qBAAAA,EAAgB;gBACdsC;gBACAM;gBACAhB;gBACAoB,eAAejB;gBACfE;gBACAS;gBACAN;YACF;YACAU,0BACExC,mBAAAA,EAAkBwC,oBAAoB;gBAAER;gBAAWV;gBAAkBK;gBAAyBS;YAAM;gBACtG9B,wBAAAA;YACAlB,aAASC,UAAAA,EAAgB;gBAAEsD,SAASvD;gBAAOwD,SAAS1B;YAAa;gBACjE/B,SAAAA,EAAe;gBAAEuC,UAAU;YAAkB;gBAC7CvC,SAAAA,EAAe;gBAAEuC,UAAU;YAAU;YACrCmB,QAAQC,GAAG,CAACC,QAAQ,KAAK,gBACvBZ,sBACAlD,kBAAAA,EAASkD,oBAAgBvB,2BAAAA,EAAiB2B;SAC7C,CAACS,MAAM,CAACC;QAET,MAAMC,gBAAYzC,4BAAAA,EAAsBQ,OAAOO,UAAUY;QAEzD,OAAO;YACLc;YACAT;YACAf,UAAUA,CAAAA,aAAAA,QAAAA,aAAAA,KAAAA,IAAAA,WAAYW,aAAAA,CAAY,GAAK,UAAqB;YAE5DjB;YACAS;QACF;IACF,GACA;QAACd;QAAUqB;QAAOD;QAAgBE;KAAc;AAEpD"}

package/lib-commonjs/utils/getScrollParent.js

@@ -2,7 +2,8 @@
  * Returns the parent node or the host of the node argument.
  * @param node - DOM node.
  * @returns - parent DOM node.
- */ "use strict";
+ */ 'use client';
+"use strict";
 Object.defineProperty(exports, "__esModule", {
     value: true
 });

package/lib-commonjs/utils/getScrollParent.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/utils/getScrollParent.ts"],"sourcesContent":["/**\n * Returns the parent node or the host of the node argument.\n * @param node - DOM node.\n * @returns - parent DOM node.\n */\nexport const getParentNode = (node: HTMLElement): HTMLElement => {\n  if (node.nodeName === 'HTML') {\n    return node;\n  }\n\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  return node.parentNode || (node as any).host;\n};\n\n/**\n * Returns CSS styles of the given node.\n * @param node - DOM node.\n * @returns - CSS styles.\n */\nexport const getStyleComputedProperty = (node: HTMLElement): Partial<CSSStyleDeclaration> => {\n  if (node.nodeType !== 1) {\n    return {};\n  }\n\n  const targetWindow = node.ownerDocument?.defaultView;\n\n  if (targetWindow) {\n    return targetWindow.getComputedStyle(node, null);\n  }\n\n  return {};\n};\n\n/**\n * Returns the first scrollable parent of the given element.\n * @param node - DOM node.\n * @returns - the first scrollable parent.\n */\nexport const getScrollParent = (node: Document | HTMLElement | null): HTMLElement => {\n  // Return body, `getScroll` will take care to get the correct `scrollTop` from it\n  const parentNode = node && getParentNode(node as HTMLElement);\n  // eslint-disable-next-line\n  if (!parentNode) return document.body;\n\n  switch (parentNode.nodeName) {\n    case 'HTML':\n    case 'BODY':\n      return parentNode.ownerDocument!.body;\n    case '#document':\n      return (parentNode as unknown as Document).body;\n  }\n\n  // If any of the overflow props is defined for the node then we return it as the parent\n  const { overflow, overflowX, overflowY } = getStyleComputedProperty(parentNode);\n  if (/(auto|scroll|overlay)/.test(overflow! + overflowY! + overflowX)) {\n    return parentNode;\n  }\n\n  return getScrollParent(parentNode);\n};\n\nexport const hasScrollParent = (node: Document | HTMLElement | null): boolean => {\n  const scrollParentElement: HTMLElement = getScrollParent(node);\n\n  return scrollParentElement ? scrollParentElement !== scrollParentElement.ownerDocument?.body : false;\n};\n"],"names":["getParentNode","node","nodeName","parentNode","host","getStyleComputedProperty","nodeType","targetWindow","ownerDocument","defaultView","getComputedStyle","getScrollParent","document","body","overflow","overflowX","overflowY","test","hasScrollParent","scrollParentElement"],"mappings":"AAAA;;;;CAIC,GACD;;;;;;;;;;;IAAaA,aAAAA;;;mBAiCAW;;;4BAnBAN;eAAAA;;mBA0CAa;;;;AAxDN,sBAAsB,CAACjB;IAC5B,IAAIA,KAAKC,QAAQ,KAAK,QAAQ;QAC5B,OAAOD;IACT;IAEA,8DAA8D;IAC9D,OAAOA,KAAKE,UAAU,IAAKF,KAAaG,IAAI;AAC9C,EAAE;AAOK,iCAAiC,CAACH;QAKlBA;IAJrB,IAAIA,KAAKK,QAAQ,KAAK,GAAG;QACvB,OAAO,CAAC;IACV;IAEA,MAAMC,eAAAA,CAAeN,sBAAAA,KAAKO,aAAAA,AAAa,MAAA,QAAlBP,wBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,oBAAoBQ,WAAW;IAEpD,IAAIF,cAAc;QAChB,OAAOA,aAAaG,gBAAgB,CAACT,MAAM;IAC7C;IAEA,OAAO,CAAC;AACV,EAAE;AAOK,MAAMU,kBAAkB,CAACV;IAC9B,iFAAiF;IACjF,MAAME,aAAaF,QAAQD,cAAcC;IACzC,2BAA2B;IAC3B,IAAI,CAACE,YAAY,OAAOS,SAASC,IAAI;IAErC,OAAQV,WAAWD,QAAQ;QACzB,KAAK;QACL,KAAK;YACH,OAAOC,WAAWK,aAAa,CAAEK,IAAI;QACvC,KAAK;YACH,OAAQV,WAAmCU,IAAI;IACnD;IAEA,uFAAuF;IACvF,MAAM,EAAEC,QAAQ,EAAEC,SAAS,EAAEC,SAAS,EAAE,GAAGX,yBAAyBF;IACpE,IAAI,wBAAwBc,IAAI,CAACH,WAAYE,YAAaD,YAAY;QACpE,OAAOZ;IACT;IAEA,OAAOQ,gBAAgBR;AACzB,EAAE;AAEK,MAAMe,kBAAkB,CAACjB;QAGuBkB;IAFrD,MAAMA,sBAAmCR,gBAAgBV;IAEzD,OAAOkB,sBAAsBA,wBAAAA,CAAAA,CAAwBA,qCAAAA,oBAAoBX,aAAAA,AAAa,MAAA,QAAjCW,uCAAAA,KAAAA,IAAAA,KAAAA,IAAAA,mCAAmCN,IAAAA,AAAI,IAAG;AACjG,EAAE"}
+{"version":3,"sources":["../src/utils/getScrollParent.ts"],"sourcesContent":["/**\n * Returns the parent node or the host of the node argument.\n * @param node - DOM node.\n * @returns - parent DOM node.\n */\n\n'use client';\n\nexport const getParentNode = (node: HTMLElement): HTMLElement => {\n  if (node.nodeName === 'HTML') {\n    return node;\n  }\n\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  return node.parentNode || (node as any).host;\n};\n\n/**\n * Returns CSS styles of the given node.\n * @param node - DOM node.\n * @returns - CSS styles.\n */\nexport const getStyleComputedProperty = (node: HTMLElement): Partial<CSSStyleDeclaration> => {\n  if (node.nodeType !== 1) {\n    return {};\n  }\n\n  const targetWindow = node.ownerDocument?.defaultView;\n\n  if (targetWindow) {\n    return targetWindow.getComputedStyle(node, null);\n  }\n\n  return {};\n};\n\n/**\n * Returns the first scrollable parent of the given element.\n * @param node - DOM node.\n * @returns - the first scrollable parent.\n */\nexport const getScrollParent = (node: Document | HTMLElement | null): HTMLElement => {\n  // Return body, `getScroll` will take care to get the correct `scrollTop` from it\n  const parentNode = node && getParentNode(node as HTMLElement);\n  // eslint-disable-next-line\n  if (!parentNode) return document.body;\n\n  switch (parentNode.nodeName) {\n    case 'HTML':\n    case 'BODY':\n      return parentNode.ownerDocument!.body;\n    case '#document':\n      return (parentNode as unknown as Document).body;\n  }\n\n  // If any of the overflow props is defined for the node then we return it as the parent\n  const { overflow, overflowX, overflowY } = getStyleComputedProperty(parentNode);\n  if (/(auto|scroll|overlay)/.test(overflow! + overflowY! + overflowX)) {\n    return parentNode;\n  }\n\n  return getScrollParent(parentNode);\n};\n\nexport const hasScrollParent = (node: Document | HTMLElement | null): boolean => {\n  const scrollParentElement: HTMLElement = getScrollParent(node);\n\n  return scrollParentElement ? scrollParentElement !== scrollParentElement.ownerDocument?.body : false;\n};\n"],"names":["getParentNode","node","nodeName","parentNode","host","getStyleComputedProperty","nodeType","targetWindow","ownerDocument","defaultView","getComputedStyle","getScrollParent","document","body","overflow","overflowX","overflowY","test","hasScrollParent","scrollParentElement"],"mappings":"AAAA;;;;CAIC,GAED;;;;;;;;;;;;iBAEaA;;;IAiCAW,eAAAA;;;IAnBAN,wBAAAA;;;IA0CAa,eAAAA;;;;AAxDN,MAAMlB,gBAAgB,CAACC;IAC5B,IAAIA,KAAKC,QAAQ,KAAK,QAAQ;QAC5B,OAAOD;IACT;IAEA,8DAA8D;IAC9D,OAAOA,KAAKE,UAAU,IAAKF,KAAaG,IAAI;AAC9C,EAAE;AAOK,iCAAiC,CAACH;QAKlBA;IAJrB,IAAIA,KAAKK,QAAQ,KAAK,GAAG;QACvB,OAAO,CAAC;IACV;IAEA,MAAMC,eAAAA,CAAeN,sBAAAA,KAAKO,aAAAA,AAAa,MAAA,QAAlBP,wBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,oBAAoBQ,WAAW;IAEpD,IAAIF,cAAc;QAChB,OAAOA,aAAaG,gBAAgB,CAACT,MAAM;IAC7C;IAEA,OAAO,CAAC;AACV,EAAE;AAOK,wBAAwB,CAACA;IAC9B,iFAAiF;IACjF,MAAME,aAAaF,QAAQD,cAAcC;IACzC,2BAA2B;IAC3B,IAAI,CAACE,YAAY,OAAOS,SAASC,IAAI;IAErC,OAAQV,WAAWD,QAAQ;QACzB,KAAK;QACL,KAAK;YACH,OAAOC,WAAWK,aAAa,CAAEK,IAAI;QACvC,KAAK;YACH,OAAQV,WAAmCU,IAAI;IACnD;IAEA,uFAAuF;IACvF,MAAM,EAAEC,QAAQ,EAAEC,SAAS,EAAEC,SAAS,EAAE,GAAGX,yBAAyBF;IACpE,IAAI,wBAAwBc,IAAI,CAACH,WAAYE,YAAaD,YAAY;QACpE,OAAOZ;IACT;IAEA,OAAOQ,gBAAgBR;AACzB,EAAE;AAEK,wBAAwB,CAACF;QAGuBkB;IAFrD,MAAMA,sBAAmCR,gBAAgBV;IAEzD,OAAOkB,sBAAsBA,wBAAAA,CAAAA,CAAwBA,qCAAAA,oBAAoBX,aAAAA,AAAa,MAAA,QAAjCW,uCAAAA,KAAAA,IAAAA,KAAAA,IAAAA,mCAAmCN,IAAAA,AAAI,IAAG;AACjG,EAAE"}

package/lib-commonjs/utils/mergeArrowOffset.js

@@ -1,12 +1,5 @@
-/**
- * Generally when adding an arrow to popper, it's necessary to offset the position of the popper by the
- * height of the arrow. A simple utility to merge a provided offset with an arrow height to return the final offset
- *
- * @internal
- * @param userOffset - The offset provided by the user
- * @param arrowHeight - The height of the arrow in px
- * @returns User offset augmented with arrow height
- */ "use strict";
+'use client';
+"use strict";
 Object.defineProperty(exports, "__esModule", {
     value: true
 });

package/lib-commonjs/utils/mergeArrowOffset.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/utils/mergeArrowOffset.ts"],"sourcesContent":["import type { Offset, OffsetObject } from '../types';\n\n/**\n * Generally when adding an arrow to popper, it's necessary to offset the position of the popper by the\n * height of the arrow. A simple utility to merge a provided offset with an arrow height to return the final offset\n *\n * @internal\n * @param userOffset - The offset provided by the user\n * @param arrowHeight - The height of the arrow in px\n * @returns User offset augmented with arrow height\n */\nexport function mergeArrowOffset(userOffset: Offset | undefined | null, arrowHeight: number): Offset {\n  if (typeof userOffset === 'number') {\n    return addArrowOffset(userOffset, arrowHeight);\n  }\n\n  if (typeof userOffset === 'object' && userOffset !== null) {\n    return addArrowOffset(userOffset, arrowHeight);\n  }\n\n  if (typeof userOffset === 'function') {\n    return offsetParams => {\n      const offset = userOffset(offsetParams);\n      return addArrowOffset(offset, arrowHeight);\n    };\n  }\n\n  return { mainAxis: arrowHeight };\n}\n\nconst addArrowOffset = (offset: OffsetObject | number, arrowHeight: number): OffsetObject => {\n  if (typeof offset === 'number') {\n    return { mainAxis: offset + arrowHeight };\n  }\n\n  return { ...offset, mainAxis: (offset.mainAxis ?? 0) + arrowHeight };\n};\n"],"names":["mergeArrowOffset","userOffset","arrowHeight","addArrowOffset","offsetParams","offset","mainAxis"],"mappings":"AAEA;;;;;;;;CAQC,GACD;;;;;;;;;;AAAO,SAASA,iBAAiBC,UAAqC,EAAEC,WAAmB;IACzF,IAAI,OAAOD,eAAe,UAAU;QAClC,OAAOE,eAAeF,YAAYC;IACpC;IAEA,IAAI,OAAOD,eAAe,YAAYA,eAAe,MAAM;QACzD,OAAOE,eAAeF,YAAYC;IACpC;IAEA,IAAI,OAAOD,eAAe,YAAY;QACpC,OAAOG,CAAAA;YACL,MAAMC,SAASJ,WAAWG;YAC1B,OAAOD,eAAeE,QAAQH;QAChC;IACF;IAEA,OAAO;QAAEI,UAAUJ;IAAY;AACjC;AAEA,MAAMC,iBAAiB,CAACE,QAA+BH;IACrD,IAAI,OAAOG,WAAW,UAAU;QAC9B,OAAO;YAAEC,UAAUD,SAASH;QAAY;IAC1C;QAE+BG;IAA/B,OAAO;QAAE,GAAGA,MAAM;QAAEC,UAAWD,CAAAA,CAAAA,mBAAAA,OAAOC,QAAAA,AAAQ,MAAA,QAAfD,qBAAAA,KAAAA,IAAAA,oBAAmB,CAAA,GAAKH;IAAY;AACrE"}
+{"version":3,"sources":["../src/utils/mergeArrowOffset.ts"],"sourcesContent":["'use client';\n\nimport type { Offset, OffsetObject } from '../types';\n\n/**\n * Generally when adding an arrow to popper, it's necessary to offset the position of the popper by the\n * height of the arrow. A simple utility to merge a provided offset with an arrow height to return the final offset\n *\n * @internal\n * @param userOffset - The offset provided by the user\n * @param arrowHeight - The height of the arrow in px\n * @returns User offset augmented with arrow height\n */\nexport function mergeArrowOffset(userOffset: Offset | undefined | null, arrowHeight: number): Offset {\n  if (typeof userOffset === 'number') {\n    return addArrowOffset(userOffset, arrowHeight);\n  }\n\n  if (typeof userOffset === 'object' && userOffset !== null) {\n    return addArrowOffset(userOffset, arrowHeight);\n  }\n\n  if (typeof userOffset === 'function') {\n    return offsetParams => {\n      const offset = userOffset(offsetParams);\n      return addArrowOffset(offset, arrowHeight);\n    };\n  }\n\n  return { mainAxis: arrowHeight };\n}\n\nconst addArrowOffset = (offset: OffsetObject | number, arrowHeight: number): OffsetObject => {\n  if (typeof offset === 'number') {\n    return { mainAxis: offset + arrowHeight };\n  }\n\n  return { ...offset, mainAxis: (offset.mainAxis ?? 0) + arrowHeight };\n};\n"],"names":["mergeArrowOffset","userOffset","arrowHeight","addArrowOffset","offsetParams","offset","mainAxis"],"mappings":"AAAA;;;;;+BAagBA;;;;;;AAAT,0BAA0BC,UAAqC,EAAEC,WAAmB;IACzF,IAAI,OAAOD,eAAe,UAAU;QAClC,OAAOE,eAAeF,YAAYC;IACpC;IAEA,IAAI,OAAOD,eAAe,YAAYA,eAAe,MAAM;QACzD,OAAOE,eAAeF,YAAYC;IACpC;IAEA,IAAI,OAAOD,eAAe,YAAY;QACpC,OAAOG,CAAAA;YACL,MAAMC,SAASJ,WAAWG;YAC1B,OAAOD,eAAeE,QAAQH;QAChC;IACF;IAEA,OAAO;QAAEI,UAAUJ;IAAY;AACjC;AAEA,MAAMC,iBAAiB,CAACE,QAA+BH;IACrD,IAAI,OAAOG,WAAW,UAAU;QAC9B,OAAO;YAAEC,UAAUD,SAASH;QAAY;IAC1C;QAE+BG;IAA/B,OAAO;QAAE,GAAGA,MAAM;QAAEC,UAAWD,CAAAA,CAAAA,mBAAAA,OAAOC,QAAAA,AAAQ,MAAA,QAAfD,qBAAAA,KAAAA,IAAAA,oBAAmB,CAAA,GAAKH;IAAY;AACrE"}

package/lib-commonjs/utils/useCallbackRef.js

@@ -1,3 +1,4 @@
+'use client';
 "use strict";
 Object.defineProperty(exports, "__esModule", {
     value: true

package/lib-commonjs/utils/useCallbackRef.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/utils/useCallbackRef.ts"],"sourcesContent":["import * as React from 'react';\nimport { useIsomorphicLayoutEffect } from '@fluentui/react-utilities';\n\n/**\n * Creates a MutableRef with ref change callback. Is useful as React.useRef() doesn't notify you when its content\n * changes and mutating the .current property doesn't cause a re-render. An opt-out will be use a callback ref via\n * React.useState(), but it will cause re-renders always.\n *\n * https://reactjs.org/docs/hooks-reference.html#useref\n * https://github.com/theKashey/use-callback-ref#usecallbackref---to-replace-reactuseref\n *\n * @param initialValue - initial ref value\n * @param callback - a callback to run when value changes\n * @param skipInitialResolve - a flag to skip an initial ref report\n *\n * @example\n * const ref = useCallbackRef(0, (newValue, oldValue) => console.log(oldValue, '->', newValue);\n * ref.current = 1;\n * // prints 0 -> 1\n */\nexport function useCallbackRef<T>(\n  initialValue: T | null,\n  callback: (newValue: T | null, lastValue: T | null) => void,\n  skipInitialResolve?: boolean,\n): React.MutableRefObject<T | null> {\n  const isFirst = React.useRef(true);\n  const [ref] = React.useState(() => ({\n    // value\n    value: initialValue,\n    // last callback\n    callback,\n    // \"memoized\" public interface\n    facade: {\n      get current() {\n        return ref.value;\n      },\n      set current(value) {\n        const last = ref.value;\n\n        if (last !== value) {\n          ref.value = value;\n\n          if (skipInitialResolve && isFirst.current) {\n            return;\n          }\n\n          ref.callback(value, last);\n        }\n      },\n    },\n  }));\n\n  useIsomorphicLayoutEffect(() => {\n    isFirst.current = false;\n  }, []);\n\n  // update callback\n  ref.callback = callback;\n\n  return ref.facade;\n}\n"],"names":["React","useIsomorphicLayoutEffect","useCallbackRef","initialValue","callback","skipInitialResolve","isFirst","useRef","ref","useState","value","facade","current","last"],"mappings":";;;;+BAoBgBE;;;;;;;iEApBO,QAAQ;gCACW,4BAA4B;AAmB/D,wBACLC,YAAsB,EACtBC,QAA2D,EAC3DC,kBAA4B;IAE5B,MAAMC,UAAUN,OAAMO,MAAM,CAAC;IAC7B,MAAM,CAACC,IAAI,GAAGR,OAAMS,QAAQ,CAAC,IAAO,CAAA;YAClC,QAAQ;YACRC,OAAOP;YACP,gBAAgB;YAChBC;YACA,8BAA8B;YAC9BO,QAAQ;gBACN,IAAIC,WAAU;oBACZ,OAAOJ,IAAIE,KAAK;gBAClB;gBACA,IAAIE,SAAQF,MAAO;oBACjB,MAAMG,OAAOL,IAAIE,KAAK;oBAEtB,IAAIG,SAASH,OAAO;wBAClBF,IAAIE,KAAK,GAAGA;wBAEZ,IAAIL,sBAAsBC,QAAQM,OAAO,EAAE;4BACzC;wBACF;wBAEAJ,IAAIJ,QAAQ,CAACM,OAAOG;oBACtB;gBACF;YACF;SACF,CAAA;QAEAZ,yCAAAA,EAA0B;QACxBK,QAAQM,OAAO,GAAG;IACpB,GAAG,EAAE;IAEL,kBAAkB;IAClBJ,IAAIJ,QAAQ,GAAGA;IAEf,OAAOI,IAAIG,MAAM;AACnB"}
+{"version":3,"sources":["../src/utils/useCallbackRef.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { useIsomorphicLayoutEffect } from '@fluentui/react-utilities';\n\n/**\n * Creates a MutableRef with ref change callback. Is useful as React.useRef() doesn't notify you when its content\n * changes and mutating the .current property doesn't cause a re-render. An opt-out will be use a callback ref via\n * React.useState(), but it will cause re-renders always.\n *\n * https://reactjs.org/docs/hooks-reference.html#useref\n * https://github.com/theKashey/use-callback-ref#usecallbackref---to-replace-reactuseref\n *\n * @param initialValue - initial ref value\n * @param callback - a callback to run when value changes\n * @param skipInitialResolve - a flag to skip an initial ref report\n *\n * @example\n * const ref = useCallbackRef(0, (newValue, oldValue) => console.log(oldValue, '->', newValue);\n * ref.current = 1;\n * // prints 0 -> 1\n */\nexport function useCallbackRef<T>(\n  initialValue: T | null,\n  callback: (newValue: T | null, lastValue: T | null) => void,\n  skipInitialResolve?: boolean,\n): React.MutableRefObject<T | null> {\n  const isFirst = React.useRef(true);\n  const [ref] = React.useState(() => ({\n    // value\n    value: initialValue,\n    // last callback\n    callback,\n    // \"memoized\" public interface\n    facade: {\n      get current() {\n        return ref.value;\n      },\n      set current(value) {\n        const last = ref.value;\n\n        if (last !== value) {\n          ref.value = value;\n\n          if (skipInitialResolve && isFirst.current) {\n            return;\n          }\n\n          ref.callback(value, last);\n        }\n      },\n    },\n  }));\n\n  useIsomorphicLayoutEffect(() => {\n    isFirst.current = false;\n  }, []);\n\n  // update callback\n  ref.callback = callback;\n\n  return ref.facade;\n}\n"],"names":["React","useIsomorphicLayoutEffect","useCallbackRef","initialValue","callback","skipInitialResolve","isFirst","useRef","ref","useState","value","facade","current","last"],"mappings":"AAAA;;;;;+BAsBgBE;;;;;;;iEApBO,QAAQ;gCACW,4BAA4B;AAmB/D,wBACLC,YAAsB,EACtBC,QAA2D,EAC3DC,kBAA4B;IAE5B,MAAMC,UAAUN,OAAMO,MAAM,CAAC;IAC7B,MAAM,CAACC,IAAI,GAAGR,OAAMS,QAAQ,CAAC,IAAO,CAAA;YAClC,QAAQ;YACRC,OAAOP;YACP,gBAAgB;YAChBC;YACA,8BAA8B;YAC9BO,QAAQ;gBACN,IAAIC,WAAU;oBACZ,OAAOJ,IAAIE,KAAK;gBAClB;gBACA,IAAIE,SAAQF,MAAO;oBACjB,MAAMG,OAAOL,IAAIE,KAAK;oBAEtB,IAAIG,SAASH,OAAO;wBAClBF,IAAIE,KAAK,GAAGA;wBAEZ,IAAIL,sBAAsBC,QAAQM,OAAO,EAAE;4BACzC;wBACF;wBAEAJ,IAAIJ,QAAQ,CAACM,OAAOG;oBACtB;gBACF;YACF;SACF,CAAA;QAEAZ,yCAAAA,EAA0B;QACxBK,QAAQM,OAAO,GAAG;IACpB,GAAG,EAAE;IAEL,kBAAkB;IAClBJ,IAAIJ,QAAQ,GAAGA;IAEf,OAAOI,IAAIG,MAAM;AACnB"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fluentui/react-positioning",
-  "version": "9.20.5",
+  "version": "9.20.7",
   "description": "A react wrapper around Popper.js for Fluent UI",
   "main": "lib-commonjs/index.js",
   "module": "lib/index.js",
@@ -19,9 +19,9 @@
   "dependencies": {
     "@floating-ui/dom": "^1.6.12",
     "@floating-ui/devtools": "^0.2.3",
-    "@fluentui/react-shared-contexts": "^9.25.1",
+    "@fluentui/react-shared-contexts": "^9.25.2",
     "@fluentui/react-theme": "^9.2.0",
-    "@fluentui/react-utilities": "^9.24.1",
+    "@fluentui/react-utilities": "^9.25.1",
     "@griffel/react": "^1.5.22",
     "@swc/helpers": "^0.5.1",
     "use-sync-external-store": "^1.2.0"