@fluentui/react-positioning 9.0.0-rc.1 → 9.0.0-rc.12

Sign up to get free protection for your applications and to get access to all the features.
Files changed (99) hide show
  1. package/CHANGELOG.json +335 -1
  2. package/CHANGELOG.md +186 -69
  3. package/dist/{react-positioning.d.ts → index.d.ts} +72 -46
  4. package/{lib → dist}/tsdoc-metadata.json +0 -0
  5. package/lib/createArrowStyles.js.map +1 -1
  6. package/lib/createVirtualElementFromClick.js +2 -0
  7. package/lib/createVirtualElementFromClick.js.map +1 -1
  8. package/lib/index.js +4 -5
  9. package/lib/index.js.map +1 -1
  10. package/lib/isIntersectingModifier.js +26 -0
  11. package/lib/isIntersectingModifier.js.map +1 -0
  12. package/lib/types.js.map +1 -1
  13. package/lib/{usePopper.js → usePositioning.js} +11 -9
  14. package/lib/usePositioning.js.map +1 -0
  15. package/lib/{usePopperMouseTarget.js → usePositioningMouseTarget.js} +3 -3
  16. package/lib/usePositioningMouseTarget.js.map +1 -0
  17. package/lib/utils/fromPopperPlacement.js +40 -0
  18. package/lib/utils/fromPopperPlacement.js.map +1 -0
  19. package/lib/utils/getBoundary.js.map +1 -1
  20. package/lib/utils/getPopperOffset.js +44 -0
  21. package/lib/utils/getPopperOffset.js.map +1 -0
  22. package/lib/utils/getReactFiberFromNode.js.map +1 -1
  23. package/lib/utils/getScrollParent.js.map +1 -1
  24. package/lib/utils/index.js +1 -1
  25. package/lib/utils/index.js.map +1 -1
  26. package/lib/utils/mergeArrowOffset.js +23 -22
  27. package/lib/utils/mergeArrowOffset.js.map +1 -1
  28. package/lib/utils/parsePopperPlacement.js +14 -0
  29. package/lib/utils/parsePopperPlacement.js.map +1 -0
  30. package/lib/utils/positioningHelper.js.map +1 -1
  31. package/lib/utils/resolvePositioningShorthand.js.map +1 -1
  32. package/lib/utils/useCallbackRef.js.map +1 -1
  33. package/lib-commonjs/createArrowStyles.js.map +1 -1
  34. package/lib-commonjs/createVirtualElementFromClick.js +2 -0
  35. package/lib-commonjs/createVirtualElementFromClick.js.map +1 -1
  36. package/lib-commonjs/index.js +38 -8
  37. package/lib-commonjs/index.js.map +1 -1
  38. package/lib-commonjs/isIntersectingModifier.js +34 -0
  39. package/lib-commonjs/isIntersectingModifier.js.map +1 -0
  40. package/lib-commonjs/types.js.map +1 -1
  41. package/lib-commonjs/{usePopper.js → usePositioning.js} +15 -11
  42. package/lib-commonjs/usePositioning.js.map +1 -0
  43. package/lib-commonjs/{usePopperMouseTarget.js → usePositioningMouseTarget.js} +5 -5
  44. package/lib-commonjs/usePositioningMouseTarget.js.map +1 -0
  45. package/lib-commonjs/utils/fromPopperPlacement.js +50 -0
  46. package/lib-commonjs/utils/fromPopperPlacement.js.map +1 -0
  47. package/lib-commonjs/utils/getBoundary.js.map +1 -1
  48. package/lib-commonjs/utils/getPopperOffset.js +54 -0
  49. package/lib-commonjs/utils/getPopperOffset.js.map +1 -0
  50. package/lib-commonjs/utils/getReactFiberFromNode.js.map +1 -1
  51. package/lib-commonjs/utils/getScrollParent.js.map +1 -1
  52. package/lib-commonjs/utils/index.js +2 -2
  53. package/lib-commonjs/utils/index.js.map +1 -1
  54. package/lib-commonjs/utils/mergeArrowOffset.js +23 -22
  55. package/lib-commonjs/utils/mergeArrowOffset.js.map +1 -1
  56. package/lib-commonjs/utils/parsePopperPlacement.js +23 -0
  57. package/lib-commonjs/utils/parsePopperPlacement.js.map +1 -0
  58. package/lib-commonjs/utils/positioningHelper.js.map +1 -1
  59. package/lib-commonjs/utils/resolvePositioningShorthand.js.map +1 -1
  60. package/lib-commonjs/utils/useCallbackRef.js.map +1 -1
  61. package/package.json +15 -11
  62. package/lib/createArrowStyles.d.ts +0 -64
  63. package/lib/createVirtualElementFromClick.d.ts +0 -6
  64. package/lib/index.d.ts +0 -6
  65. package/lib/types.d.ts +0 -89
  66. package/lib/usePopper.d.ts +0 -23
  67. package/lib/usePopper.js.map +0 -1
  68. package/lib/usePopperMouseTarget.d.ts +0 -11
  69. package/lib/usePopperMouseTarget.js.map +0 -1
  70. package/lib/utils/getBasePlacement.d.ts +0 -8
  71. package/lib/utils/getBasePlacement.js +0 -10
  72. package/lib/utils/getBasePlacement.js.map +0 -1
  73. package/lib/utils/getBoundary.d.ts +0 -6
  74. package/lib/utils/getReactFiberFromNode.d.ts +0 -108
  75. package/lib/utils/getScrollParent.d.ts +0 -12
  76. package/lib/utils/index.d.ts +0 -8
  77. package/lib/utils/mergeArrowOffset.d.ts +0 -10
  78. package/lib/utils/positioningHelper.d.ts +0 -7
  79. package/lib/utils/resolvePositioningShorthand.d.ts +0 -2
  80. package/lib/utils/useCallbackRef.d.ts +0 -19
  81. package/lib-commonjs/createArrowStyles.d.ts +0 -64
  82. package/lib-commonjs/createVirtualElementFromClick.d.ts +0 -6
  83. package/lib-commonjs/index.d.ts +0 -6
  84. package/lib-commonjs/types.d.ts +0 -89
  85. package/lib-commonjs/usePopper.d.ts +0 -23
  86. package/lib-commonjs/usePopper.js.map +0 -1
  87. package/lib-commonjs/usePopperMouseTarget.d.ts +0 -11
  88. package/lib-commonjs/usePopperMouseTarget.js.map +0 -1
  89. package/lib-commonjs/utils/getBasePlacement.d.ts +0 -8
  90. package/lib-commonjs/utils/getBasePlacement.js +0 -19
  91. package/lib-commonjs/utils/getBasePlacement.js.map +0 -1
  92. package/lib-commonjs/utils/getBoundary.d.ts +0 -6
  93. package/lib-commonjs/utils/getReactFiberFromNode.d.ts +0 -108
  94. package/lib-commonjs/utils/getScrollParent.d.ts +0 -12
  95. package/lib-commonjs/utils/index.d.ts +0 -8
  96. package/lib-commonjs/utils/mergeArrowOffset.d.ts +0 -10
  97. package/lib-commonjs/utils/positioningHelper.d.ts +0 -7
  98. package/lib-commonjs/utils/resolvePositioningShorthand.d.ts +0 -2
  99. package/lib-commonjs/utils/useCallbackRef.d.ts +0 -19
@@ -1,12 +1,11 @@
1
1
  import type { GriffelStyle } from '@griffel/react';
2
- import * as PopperJs from '@popperjs/core';
3
2
  import * as React_2 from 'react';
4
3
 
5
4
  export declare type Alignment = 'top' | 'bottom' | 'start' | 'end' | 'center';
6
5
 
7
6
  export declare type AutoSize = 'height' | 'height-always' | 'width' | 'width-always' | 'always' | boolean;
8
7
 
9
- export declare type Boundary = PopperJs.Boundary | 'scrollParent' | 'window';
8
+ export declare type Boundary = HTMLElement | Array<HTMLElement> | 'clippingParents' | 'scrollParent' | 'window';
10
9
 
11
10
  /**
12
11
  * Creates CSS styles to size the arrow created by createArrowStyles to the given height.
@@ -78,7 +77,7 @@ export declare type CreateArrowStylesOptions = {
78
77
  * Creates a virtual element based on the position of a click event
79
78
  * Can be used as a target for popper in scenarios such as context menus
80
79
  */
81
- export declare function createVirtualElementFromClick(nativeEvent: MouseEvent): PopperVirtualElement;
80
+ export declare function createVirtualElementFromClick(nativeEvent: MouseEvent): PositioningVirtualElement;
82
81
 
83
82
  /**
84
83
  * Generally when adding an arrow to popper, it's necessary to offset the position of the popper by the
@@ -90,22 +89,45 @@ export declare function createVirtualElementFromClick(nativeEvent: MouseEvent):
90
89
  */
91
90
  export declare function mergeArrowOffset(userOffset: Offset | undefined | null, arrowHeight: number): Offset;
92
91
 
93
- export declare type Offset = OffsetFunction | [number | null | undefined, number | null | undefined];
92
+ export declare type Offset = OffsetFunction | OffsetObject | OffsetShorthand;
94
93
 
95
- export declare type OffsetFunction = (param: OffsetFunctionParam) => [number | null | undefined, number | null | undefined];
94
+ export declare type OffsetFunction = (param: OffsetFunctionParam) => OffsetObject | OffsetShorthand;
96
95
 
97
96
  export declare type OffsetFunctionParam = {
98
- popper: PopperJs.Rect;
99
- reference: PopperJs.Rect;
100
- placement: PopperJs.Placement;
97
+ positionedRect: Rect;
98
+ targetRect: Rect;
99
+ position: Position;
100
+ alignment?: Alignment;
101
101
  };
102
102
 
103
- export declare interface PopperOptions {
103
+ export declare type OffsetObject = {
104
+ crossAxis?: number;
105
+ mainAxis: number;
106
+ };
107
+
108
+ export declare type OffsetShorthand = number;
109
+
110
+ export declare type Position = 'above' | 'below' | 'before' | 'after';
111
+
112
+ export declare type PositioningImperativeRef = {
113
+ /**
114
+ * Updates the position imperatively.
115
+ * Useful when the position of the target changes from other factors than scrolling of window resize.
116
+ */
117
+ updatePosition: () => void;
118
+ /**
119
+ * Sets the target and updates positioning imperatively.
120
+ * Useful for avoiding double renders with the target option.
121
+ */
122
+ setTarget: (target: HTMLElement | PositioningVirtualElement) => void;
123
+ };
124
+
125
+ declare interface PositioningOptions {
104
126
  /** Alignment for the component. Only has an effect if used with the @see position option */
105
127
  align?: Alignment;
106
- /** The element which will define the boundaries of the popper position for the flip behavior. */
128
+ /** The element which will define the boundaries of the positioned element for the flip behavior. */
107
129
  flipBoundary?: Boundary;
108
- /** The element which will define the boundaries of the popper position for the overflow behavior. */
130
+ /** The element which will define the boundaries of the positioned element for the overflow behavior. */
109
131
  overflowBoundary?: Boundary;
110
132
  /**
111
133
  * Position for the component. Position has higher priority than align. If position is vertical ('above' | 'below')
@@ -115,12 +137,12 @@ export declare interface PopperOptions {
115
137
  */
116
138
  position?: Position;
117
139
  /**
118
- * Enables the Popper box to position itself in 'fixed' mode (default value is position: 'absolute')
140
+ * Enables the position element to be positioned with 'fixed' (default value is position: 'absolute')
119
141
  * @default false
120
142
  */
121
143
  positionFixed?: boolean;
122
144
  /**
123
- * Lets you displace a popper element from its reference element.
145
+ * Lets you displace a positioned element from its reference element.
124
146
  * This can be useful if you need to apply some margin between them or if you need to fine tune the
125
147
  * position according to some custom logic.
126
148
  */
@@ -131,7 +153,7 @@ export declare interface PopperOptions {
131
153
  */
132
154
  arrowPadding?: number;
133
155
  /**
134
- * Applies max-height and max-width on popper to fit it within the available space in viewport.
156
+ * Applies max-height and max-width on the positioned element to fit it within the available space in viewport.
135
157
  * true enables this for both width and height when overflow happens.
136
158
  * 'always' applies `max-height`/`max-width` regardless of overflow.
137
159
  * 'height' applies `max-height` when overflow happens, and 'width' for `max-width`
@@ -148,44 +170,56 @@ export declare interface PopperOptions {
148
170
  */
149
171
  pinned?: boolean;
150
172
  /**
151
- * When the reference element or the viewport is outside viewport allows a popper element to be fully in viewport.
173
+ * When the reference element or the viewport is outside viewport allows a positioned element to be fully in viewport.
152
174
  * "all" enables this behavior for all axis.
153
175
  */
154
176
  unstable_disableTether?: boolean | 'all';
155
177
  }
156
178
 
157
- export declare type PopperRefHandle = {
158
- /**
159
- * Updates the position of the popper imperatively.
160
- * Useful when the position of the target changes from other factors than scrolling of window resize.
161
- */
162
- updatePosition: () => void;
163
- /**
164
- * Sets the target and updates positioning imperatively.
165
- * Useful for avoiding double renders with the target option.
166
- */
167
- setTarget: (target: HTMLElement) => void;
168
- };
169
-
170
- export declare type PopperVirtualElement = PopperJs.VirtualElement;
171
-
172
- export declare type Position = 'above' | 'below' | 'before' | 'after';
173
-
174
- export declare interface PositioningProps extends Omit<PopperOptions, 'positionFixed' | 'unstable_disableTether'> {
179
+ export declare interface PositioningProps extends Omit<PositioningOptions, 'positionFixed' | 'unstable_disableTether'> {
175
180
  /** An imperative handle to Popper methods. */
176
- popperRef?: React_2.Ref<PopperRefHandle>;
181
+ positioningRef?: React_2.Ref<PositioningImperativeRef>;
177
182
  /**
178
- * Manual override for popper target. Useful for scenarios where a component accepts user prop to override target
183
+ * Manual override for the target element. Useful for scenarios where a component accepts user prop to override target
179
184
  */
180
- target?: HTMLElement | PopperVirtualElement | null;
185
+ target?: HTMLElement | PositioningVirtualElement | null;
181
186
  }
182
187
 
183
188
  export declare type PositioningShorthand = PositioningProps | PositioningShorthandValue;
184
189
 
185
190
  export declare type PositioningShorthandValue = 'above' | 'above-start' | 'above-end' | 'below' | 'below-start' | 'below-end' | 'before' | 'before-top' | 'before-bottom' | 'after' | 'after-top' | 'after-bottom';
186
191
 
192
+ export declare type PositioningVirtualElement = {
193
+ getBoundingClientRect: () => {
194
+ x: number;
195
+ y: number;
196
+ top: number;
197
+ left: number;
198
+ bottom: number;
199
+ right: number;
200
+ width: number;
201
+ height: number;
202
+ };
203
+ contextElement?: Element;
204
+ };
205
+
206
+ declare type Rect = {
207
+ width: number;
208
+ height: number;
209
+ x: number;
210
+ y: number;
211
+ };
212
+
187
213
  export declare function resolvePositioningShorthand(shorthand: PositioningShorthand | undefined | null): Readonly<PositioningProps>;
188
214
 
215
+ declare interface UsePopperOptions extends PositioningProps {
216
+ /**
217
+ * If false, delays Popper's creation.
218
+ * @default true
219
+ */
220
+ enabled?: boolean;
221
+ }
222
+
189
223
  /**
190
224
  * Exposes Popper positioning API via React hook. Contains few important differences between an official "react-popper"
191
225
  * package:
@@ -194,7 +228,7 @@ export declare function resolvePositioningShorthand(shorthand: PositioningShorth
194
228
  * - contains a specific to React fix related to initial positioning when containers have components with managed focus
195
229
  * to avoid focus jumps
196
230
  */
197
- export declare function usePopper(options?: UsePopperOptions): {
231
+ export declare function usePositioning(options?: UsePopperOptions): {
198
232
  targetRef: React_2.MutableRefObject<any>;
199
233
  containerRef: React_2.MutableRefObject<any>;
200
234
  arrowRef: React_2.MutableRefObject<any>;
@@ -208,14 +242,6 @@ export declare function usePopper(options?: UsePopperOptions): {
208
242
  * @param initialState - initializes a user provided state similare to useState
209
243
  * @returns state and dispatcher for a Popper virtual element that uses native/synthetic mouse events
210
244
  */
211
- export declare const usePopperMouseTarget: (initialState?: PopperJs.VirtualElement | (() => PopperJs.VirtualElement) | undefined) => readonly [PopperJs.VirtualElement | undefined, (event: React_2.MouseEvent | MouseEvent | undefined | null) => void];
212
-
213
- declare interface UsePopperOptions extends PositioningProps {
214
- /**
215
- * If false, delays Popper's creation.
216
- * @default true
217
- */
218
- enabled?: boolean;
219
- }
245
+ export declare const usePositioningMouseTarget: (initialState?: PositioningVirtualElement | (() => PositioningVirtualElement) | undefined) => readonly [PositioningVirtualElement | undefined, (event: React_2.MouseEvent | MouseEvent | undefined | null) => void];
220
246
 
221
247
  export { }
File without changes
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/createArrowStyles.ts"],"names":[],"mappings":"AAAA,SAAS,UAAT,QAA2B,gBAA3B;AACA,SAAS,MAAT,QAAuB,uBAAvB;AAqCA;;;;;;;;;;;;;;;;;;;;;AAqBG;;AACH,OAAM,SAAU,iBAAV,CAA4B,OAA5B,EAA6D;AACjE,QAAM;AACJ,IAAA,WADI;AAEJ,IAAA,WAAW,GAAG,KAFV;AAGJ,IAAA,WAAW,GAAG,OAHV;AAIJ,IAAA,WAAW,GAAG,MAAM,CAAC;AAJjB,MAKF,OALJ;AAOA,SAAO;AACL,IAAA,QAAQ,EAAE,UADL;AAEL,IAAA,eAAe,EAAE,SAFZ;AAGL,IAAA,UAAU,EAAE,QAHP;AAIL,IAAA,MAAM,EAAE,CAAC,CAJJ;AAML,QAAI,WAAW,IAAI,uBAAuB,CAAC,WAAD,CAA1C,CANK;AAQL,eAAW;AACT,MAAA,OAAO,EAAE,IADA;AAET,MAAA,UAAU,EAAE,SAFH;AAGT,MAAA,QAAQ,EAAE,UAHD;AAIT,MAAA,SAAS,EAAE,YAJF;AAKT,MAAA,KAAK,EAAE,SALE;AAMT,MAAA,MAAM,EAAE,SANC;AAOT,MAAA,eAAe,EAAE,SAPR;AAQT,SAAG,UAAU,CAAC,WAAX,CACD,GAAG,WAAW,gBADb,EAED,GAAG,WAAW,gBAFb,EAGD,GAAG,WAAW,gBAHb,CARM;AAaT,SAAG,UAAU,CAAC,YAAX,CAAwB,WAAxB,EAAqC,WAArC,EAAkD,WAAlD,CAbM;AAcT,MAAA,uBAAuB,EAAE,MAAM,CAAC,iBAdvB;AAeT,MAAA,SAAS,EAAE;AAfF,KARN;AA0BL;AACA,+CAA2C;AACzC,MAAA,MAAM,EAAE,IAAI,WAAW,EADkB;AAEzC,iBAAW;AAF8B,KA3BtC;AA+BL,iDAA6C;AAC3C,MAAA,IAAI,EAAE,IAAI,WAAW,gBADsB;AAE3C,iBAAW;AAFgC,KA/BxC;AAmCL,kDAA8C;AAC5C,MAAA,GAAG,EAAE,IAAI,WAAW,EADwB;AAE5C,iBAAW;AAFiC,KAnCzC;AAuCL,gDAA4C;AAC1C,MAAA,KAAK,EAAE,IAAI,WAAW,gBADoB;AAE1C,iBAAW;AAF+B;AAvCvC,GAAP;AA4CD;AAED;;;;;AAKG;;AACH,OAAM,SAAU,uBAAV,CAAkC,WAAlC,EAAqD;AACzD;AACA;AACA,QAAM,UAAU,GAAG,GAAG,QAAQ,WAAW,IAAzC;AACA,SAAO;AAAE,IAAA,KAAK,EAAE,UAAT;AAAqB,IAAA,MAAM,EAAE;AAA7B,GAAP;AACD","sourceRoot":""}
1
+ {"version":3,"sources":["createArrowStyles.ts"],"names":[],"mappings":"AAAA,SAAS,UAAT,QAA2B,gBAA3B;AACA,SAAS,MAAT,QAAuB,uBAAvB;AAqCA;;;;;;;;;;;;;;;;;;;;;AAqBG;;AACH,OAAM,SAAU,iBAAV,CAA4B,OAA5B,EAA6D;AACjE,QAAM;AACJ,IAAA,WADI;AAEJ,IAAA,WAAW,GAAG,KAFV;AAGJ,IAAA,WAAW,GAAG,OAHV;AAIJ,IAAA,WAAW,GAAG,MAAM,CAAC;AAJjB,MAKF,OALJ;AAOA,SAAO;AACL,IAAA,QAAQ,EAAE,UADL;AAEL,IAAA,eAAe,EAAE,SAFZ;AAGL,IAAA,UAAU,EAAE,QAHP;AAIL,IAAA,MAAM,EAAE,CAAC,CAJJ;AAML,QAAI,WAAW,IAAI,uBAAuB,CAAC,WAAD,CAA1C,CANK;AAQL,eAAW;AACT,MAAA,OAAO,EAAE,IADA;AAET,MAAA,UAAU,EAAE,SAFH;AAGT,MAAA,QAAQ,EAAE,UAHD;AAIT,MAAA,SAAS,EAAE,YAJF;AAKT,MAAA,KAAK,EAAE,SALE;AAMT,MAAA,MAAM,EAAE,SANC;AAOT,MAAA,eAAe,EAAE,SAPR;AAQT,SAAG,UAAU,CAAC,WAAX,CACD,GAAG,WAAW,gBADb,EAED,GAAG,WAAW,gBAFb,EAGD,GAAG,WAAW,gBAHb,CARM;AAaT,SAAG,UAAU,CAAC,YAAX,CAAwB,WAAxB,EAAqC,WAArC,EAAkD,WAAlD,CAbM;AAcT,MAAA,uBAAuB,EAAE,MAAM,CAAC,iBAdvB;AAeT,MAAA,SAAS,EAAE;AAfF,KARN;AA0BL;AACA,+CAA2C;AACzC,MAAA,MAAM,EAAE,IAAI,WAAW,EADkB;AAEzC,iBAAW;AAF8B,KA3BtC;AA+BL,iDAA6C;AAC3C,MAAA,IAAI,EAAE,IAAI,WAAW,gBADsB;AAE3C,iBAAW;AAFgC,KA/BxC;AAmCL,kDAA8C;AAC5C,MAAA,GAAG,EAAE,IAAI,WAAW,EADwB;AAE5C,iBAAW;AAFiC,KAnCzC;AAuCL,gDAA4C;AAC1C,MAAA,KAAK,EAAE,IAAI,WAAW,gBADoB;AAE1C,iBAAW;AAF+B;AAvCvC,GAAP;AA4CD;AAED;;;;;AAKG;;AACH,OAAM,SAAU,uBAAV,CAAkC,WAAlC,EAAqD;AACzD;AACA;AACA,QAAM,UAAU,GAAG,GAAG,QAAQ,WAAW,IAAzC;AACA,SAAO;AAAE,IAAA,KAAK,EAAE,UAAT;AAAqB,IAAA,MAAM,EAAE;AAA7B,GAAP;AACD","sourcesContent":["import { shorthands } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport type { GriffelStyle } from '@griffel/react';\n\n/**\n * Options parameter for the createArrowStyles function\n */\nexport type CreateArrowStylesOptions = {\n /**\n * The height of the arrow from the base to the tip, in px. The base width of the arrow is always twice its height.\n *\n * This can be undefined to leave out the arrow size styles. You must then add styles created by\n * createArrowHeightStyles to set the arrow's size correctly. This can be useful if the arrow can be different sizes.\n */\n arrowHeight: number | undefined;\n\n /**\n * The borderWidth of the arrow. Should be the same borderWidth as the parent element.\n *\n * @defaultvalue 1px\n */\n borderWidth?: GriffelStyle['borderBottomWidth'];\n\n /**\n * The borderStyle for the arrow. Should be the same borderStyle as the parent element.\n *\n * @defaultvalue solid\n */\n borderStyle?: GriffelStyle['borderBottomStyle'];\n\n /**\n * The borderColor of the arrow. Should be the same borderColor as the parent element.\n *\n * @defaultvalue tokens.colorTransparentStroke\n */\n borderColor?: GriffelStyle['borderBottomColor'];\n};\n\n/**\n * Helper that creates a makeStyles rule for an arrow element.\n * For runtime arrow size toggling simply create extra classnames to apply to the arrow element\n *\n * ```ts\n * makeStyles({\n * arrowWithSize: createArrowStyles({ arrowHeight: 6 }),\n *\n * arrowWithoutSize: createArrowStyles({ arrowHeight: undefined }),\n * mediumArrow: createArrowHeightStyles(4),\n * smallArrow: createArrowHeightStyles(2),\n * })\n * ...\n *\n * state.arrowWithSize.className = styles.arrowWithSize;\n * state.arrowWithoutSize.className = mergeClasses(\n * styles.arrowWithoutSize,\n * state.smallArrow && styles.smallArrow,\n * state.mediumArrow && styles.mediumArrow,\n * )\n * ```\n */\nexport function createArrowStyles(options: CreateArrowStylesOptions): GriffelStyle {\n const {\n arrowHeight,\n borderWidth = '1px',\n borderStyle = 'solid',\n borderColor = tokens.colorTransparentStroke,\n } = options;\n\n return {\n position: 'absolute',\n backgroundColor: 'inherit',\n visibility: 'hidden',\n zIndex: -1,\n\n ...(arrowHeight && createArrowHeightStyles(arrowHeight)),\n\n ':before': {\n content: '\"\"',\n visibility: 'visible',\n position: 'absolute',\n boxSizing: 'border-box',\n width: 'inherit',\n height: 'inherit',\n backgroundColor: 'inherit',\n ...shorthands.borderRight(\n `${borderWidth} /* @noflip */`,\n `${borderStyle} /* @noflip */`,\n `${borderColor} /* @noflip */`,\n ),\n ...shorthands.borderBottom(borderWidth, borderStyle, borderColor),\n borderBottomRightRadius: tokens.borderRadiusSmall,\n transform: 'rotate(var(--angle)) translate(0, 50%) rotate(45deg)',\n },\n\n // Popper sets data-popper-placement on the root element, which is used to align the arrow\n ':global([data-popper-placement^=\"top\"])': {\n bottom: `-${borderWidth}`,\n '--angle': '0',\n },\n ':global([data-popper-placement^=\"right\"])': {\n left: `-${borderWidth} /* @noflip */`,\n '--angle': '90deg',\n },\n ':global([data-popper-placement^=\"bottom\"])': {\n top: `-${borderWidth}`,\n '--angle': '180deg',\n },\n ':global([data-popper-placement^=\"left\"])': {\n right: `-${borderWidth} /* @noflip */`,\n '--angle': '270deg',\n },\n };\n}\n\n/**\n * Creates CSS styles to size the arrow created by createArrowStyles to the given height.\n *\n * Use this when you need to create classes for several different arrow sizes. If you only need a\n * constant arrow size, you can pass the `arrowHeight` param to createArrowStyles instead.\n */\nexport function createArrowHeightStyles(arrowHeight: number) {\n // The arrow is a square rotated 45 degrees to have its bottom and right edges form a right triangle.\n // Multiply the triangle's height by sqrt(2) to get length of its edges.\n const edgeLength = `${1.414 * arrowHeight}px`;\n return { width: edgeLength, height: edgeLength };\n}\n"],"sourceRoot":"../src/"}
@@ -14,6 +14,8 @@ export function createVirtualElementFromClick(nativeEvent) {
14
14
  top,
15
15
  right,
16
16
  bottom,
17
+ x: left,
18
+ y: top,
17
19
  height: 1,
18
20
  width: 1
19
21
  };
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/createVirtualElementFromClick.ts"],"names":[],"mappings":"AAEA;;;AAGG;AACH,OAAM,SAAU,6BAAV,CAAwC,WAAxC,EAA+D;AACnE,QAAM,IAAI,GAAG,WAAW,CAAC,OAAzB;AACA,QAAM,GAAG,GAAG,WAAW,CAAC,OAAxB;AACA,QAAM,KAAK,GAAG,IAAI,GAAG,CAArB;AACA,QAAM,MAAM,GAAG,GAAG,GAAG,CAArB;;AAEA,WAAS,qBAAT,GAA8B;AAC5B,WAAO;AACL,MAAA,IADK;AAEL,MAAA,GAFK;AAGL,MAAA,KAHK;AAIL,MAAA,MAJK;AAML,MAAA,MAAM,EAAE,CANH;AAOL,MAAA,KAAK,EAAE;AAPF,KAAP;AASD;;AAED,SAAO;AACL,IAAA;AADK,GAAP;AAGD","sourceRoot":""}
1
+ {"version":3,"sources":["createVirtualElementFromClick.ts"],"names":[],"mappings":"AAEA;;;AAGG;AACH,OAAM,SAAU,6BAAV,CAAwC,WAAxC,EAA+D;AACnE,QAAM,IAAI,GAAG,WAAW,CAAC,OAAzB;AACA,QAAM,GAAG,GAAG,WAAW,CAAC,OAAxB;AACA,QAAM,KAAK,GAAG,IAAI,GAAG,CAArB;AACA,QAAM,MAAM,GAAG,GAAG,GAAG,CAArB;;AAEA,WAAS,qBAAT,GAA8B;AAC5B,WAAO;AACL,MAAA,IADK;AAEL,MAAA,GAFK;AAGL,MAAA,KAHK;AAIL,MAAA,MAJK;AAKL,MAAA,CAAC,EAAE,IALE;AAML,MAAA,CAAC,EAAE,GANE;AAOL,MAAA,MAAM,EAAE,CAPH;AAQL,MAAA,KAAK,EAAE;AARF,KAAP;AAUD;;AAED,SAAO;AACL,IAAA;AADK,GAAP;AAGD","sourcesContent":["import type { PositioningVirtualElement } from './types';\n\n/**\n * Creates a virtual element based on the position of a click event\n * Can be used as a target for popper in scenarios such as context menus\n */\nexport function createVirtualElementFromClick(nativeEvent: MouseEvent): PositioningVirtualElement {\n const left = nativeEvent.clientX;\n const top = nativeEvent.clientY;\n const right = left + 1;\n const bottom = top + 1;\n\n function getBoundingClientRect() {\n return {\n left,\n top,\n right,\n bottom,\n x: left,\n y: top,\n height: 1,\n width: 1,\n };\n }\n\n return {\n getBoundingClientRect,\n };\n}\n"],"sourceRoot":"../src/"}
package/lib/index.js CHANGED
@@ -1,7 +1,6 @@
1
- export * from './createVirtualElementFromClick';
2
- export * from './createArrowStyles';
3
- export * from './usePopper';
4
- export * from './usePopperMouseTarget';
1
+ export { createVirtualElementFromClick } from './createVirtualElementFromClick';
2
+ export { createArrowHeightStyles, createArrowStyles } from './createArrowStyles';
3
+ export { usePositioning } from './usePositioning';
4
+ export { usePositioningMouseTarget } from './usePositioningMouseTarget';
5
5
  export { resolvePositioningShorthand, mergeArrowOffset } from './utils/index';
6
- export * from './types';
7
6
  //# sourceMappingURL=index.js.map
package/lib/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,iCAAiC,CAAC;AAChD,cAAc,qBAAqB,CAAC;AACpC,cAAc,aAAa,CAAC;AAC5B,cAAc,wBAAwB,CAAC;AACvC,OAAO,EAAE,2BAA2B,EAAE,gBAAgB,EAAE,MAAM,eAAe,CAAC;AAC9E,cAAc,SAAS,CAAC"}
1
+ {"version":3,"file":"index.js","sourceRoot":"../src/","sources":["index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,6BAA6B,EAAE,MAAM,iCAAiC,CAAC;AAChF,OAAO,EAAE,uBAAuB,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AAEjF,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAClD,OAAO,EAAE,yBAAyB,EAAE,MAAM,6BAA6B,CAAC;AACxE,OAAO,EAAE,2BAA2B,EAAE,gBAAgB,EAAE,MAAM,eAAe,CAAC","sourcesContent":["export { createVirtualElementFromClick } from './createVirtualElementFromClick';\nexport { createArrowHeightStyles, createArrowStyles } from './createArrowStyles';\nexport type { CreateArrowStylesOptions } from './createArrowStyles';\nexport { usePositioning } from './usePositioning';\nexport { usePositioningMouseTarget } from './usePositioningMouseTarget';\nexport { resolvePositioningShorthand, mergeArrowOffset } from './utils/index';\nexport type {\n Alignment,\n AutoSize,\n Boundary,\n Offset,\n OffsetFunction,\n OffsetFunctionParam,\n OffsetObject,\n OffsetShorthand,\n Position,\n PositioningImperativeRef,\n PositioningProps,\n PositioningShorthand,\n PositioningShorthandValue,\n PositioningVirtualElement,\n} from './types';\n"]}
@@ -0,0 +1,26 @@
1
+ import { detectOverflow } from '@popperjs/core';
2
+ export const isIntersectingModifier = {
3
+ name: 'is-intersecting-modifier',
4
+ enabled: true,
5
+ phase: 'main',
6
+ requires: ['preventOverflow'],
7
+ fn: ({
8
+ state,
9
+ name
10
+ }) => {
11
+ const popperRect = state.rects.popper;
12
+ const popperAltOverflow = detectOverflow(state, {
13
+ altBoundary: true
14
+ });
15
+ const isIntersectingTop = popperAltOverflow.top < popperRect.height && popperAltOverflow.top > 0;
16
+ const isIntersectingBottom = popperAltOverflow.bottom < popperRect.height && popperAltOverflow.bottom > 0;
17
+ const isIntersecting = isIntersectingTop || isIntersectingBottom;
18
+ state.modifiersData[name] = {
19
+ isIntersecting
20
+ };
21
+ state.attributes.popper = { ...state.attributes.popper,
22
+ 'data-popper-is-intersecting': isIntersecting
23
+ };
24
+ }
25
+ };
26
+ //# sourceMappingURL=isIntersectingModifier.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["isIntersectingModifier.ts"],"names":[],"mappings":"AAAA,SAAS,cAAT,QAAyC,gBAAzC;AAEA,OAAO,MAAM,sBAAsB,GAA2B;AAC5D,EAAA,IAAI,EAAE,0BADsD;AAE5D,EAAA,OAAO,EAAE,IAFmD;AAG5D,EAAA,KAAK,EAAE,MAHqD;AAI5D,EAAA,QAAQ,EAAE,CAAC,iBAAD,CAJkD;AAK5D,EAAA,EAAE,EAAE,CAAC;AAAE,IAAA,KAAF;AAAS,IAAA;AAAT,GAAD,KAAoB;AACtB,UAAM,UAAU,GAAG,KAAK,CAAC,KAAN,CAAY,MAA/B;AACA,UAAM,iBAAiB,GAAG,cAAc,CAAC,KAAD,EAAQ;AAAE,MAAA,WAAW,EAAE;AAAf,KAAR,CAAxC;AAEA,UAAM,iBAAiB,GAAG,iBAAiB,CAAC,GAAlB,GAAwB,UAAU,CAAC,MAAnC,IAA6C,iBAAiB,CAAC,GAAlB,GAAwB,CAA/F;AACA,UAAM,oBAAoB,GAAG,iBAAiB,CAAC,MAAlB,GAA2B,UAAU,CAAC,MAAtC,IAAgD,iBAAiB,CAAC,MAAlB,GAA2B,CAAxG;AAEA,UAAM,cAAc,GAAG,iBAAiB,IAAI,oBAA5C;AAEA,IAAA,KAAK,CAAC,aAAN,CAAoB,IAApB,IAA4B;AAC1B,MAAA;AAD0B,KAA5B;AAGA,IAAA,KAAK,CAAC,UAAN,CAAiB,MAAjB,GAA0B,EACxB,GAAG,KAAK,CAAC,UAAN,CAAiB,MADI;AAExB,qCAA+B;AAFP,KAA1B;AAID;AArB2D,CAAvD","sourcesContent":["import { detectOverflow, Modifier } from '@popperjs/core';\n\nexport const isIntersectingModifier: IsIntersectingModifier = {\n name: 'is-intersecting-modifier',\n enabled: true,\n phase: 'main',\n requires: ['preventOverflow'],\n fn: ({ state, name }) => {\n const popperRect = state.rects.popper;\n const popperAltOverflow = detectOverflow(state, { altBoundary: true });\n\n const isIntersectingTop = popperAltOverflow.top < popperRect.height && popperAltOverflow.top > 0;\n const isIntersectingBottom = popperAltOverflow.bottom < popperRect.height && popperAltOverflow.bottom > 0;\n\n const isIntersecting = isIntersectingTop || isIntersectingBottom;\n\n state.modifiersData[name] = {\n isIntersecting,\n };\n state.attributes.popper = {\n ...state.attributes.popper,\n 'data-popper-is-intersecting': isIntersecting,\n };\n },\n};\n\ntype IsIntersectingModifier = Modifier<'is-intersecting-modifier', never>;\n"],"sourceRoot":"../src/"}
package/lib/types.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"types.js","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":""}
1
+ {"version":3,"file":"types.js","sourceRoot":"../src/","sources":["types.ts"],"names":[],"mappings":"","sourcesContent":["import * as React from 'react';\n\ntype Rect = {\n width: number;\n height: number;\n x: number;\n y: number;\n};\n\nexport type OffsetFunctionParam = {\n positionedRect: Rect;\n targetRect: Rect;\n position: Position;\n alignment?: Alignment;\n};\n\nexport type OffsetObject = { crossAxis?: number; mainAxis: number };\n\nexport type OffsetShorthand = number;\n\nexport type OffsetFunction = (param: OffsetFunctionParam) => OffsetObject | OffsetShorthand;\n\nexport type Offset = OffsetFunction | OffsetObject | OffsetShorthand;\n\nexport type Position = 'above' | 'below' | 'before' | 'after';\nexport type Alignment = 'top' | 'bottom' | 'start' | 'end' | 'center';\n\nexport type AutoSize = 'height' | 'height-always' | 'width' | 'width-always' | 'always' | boolean;\n\nexport type Boundary = HTMLElement | Array<HTMLElement> | 'clippingParents' | 'scrollParent' | 'window';\n\nexport type PositioningImperativeRef = {\n /**\n * Updates the position imperatively.\n * Useful when the position of the target changes from other factors than scrolling of window resize.\n */\n updatePosition: () => void;\n\n /**\n * Sets the target and updates positioning imperatively.\n * Useful for avoiding double renders with the target option.\n */\n setTarget: (target: HTMLElement | PositioningVirtualElement) => void;\n};\n\nexport type PositioningVirtualElement = {\n getBoundingClientRect: () => {\n x: number;\n y: number;\n top: number;\n left: number;\n bottom: number;\n right: number;\n width: number;\n height: number;\n };\n contextElement?: Element;\n};\n\nexport interface PositioningOptions {\n /** Alignment for the component. Only has an effect if used with the @see position option */\n align?: Alignment;\n\n /** The element which will define the boundaries of the positioned element for the flip behavior. */\n flipBoundary?: Boundary;\n\n /** The element which will define the boundaries of the positioned element for the overflow behavior. */\n overflowBoundary?: Boundary;\n\n /**\n * Position for the component. Position has higher priority than align. If position is vertical ('above' | 'below')\n * and align is also vertical ('top' | 'bottom') or if both position and align are horizontal ('before' | 'after'\n * and 'start' | 'end' respectively),\n * then provided value for 'align' will be ignored and 'center' will be used instead.\n */\n position?: Position;\n\n /**\n * Enables the position element to be positioned with 'fixed' (default value is position: 'absolute')\n * @default false\n */\n positionFixed?: boolean;\n\n /**\n * Lets you displace a positioned element from its reference element.\n * This can be useful if you need to apply some margin between them or if you need to fine tune the\n * position according to some custom logic.\n */\n offset?: Offset;\n\n /**\n * Defines padding between the corner of the popup element and the arrow.\n * Use to prevent the arrow from overlapping a rounded corner, for example.\n */\n arrowPadding?: number;\n\n /**\n * Applies max-height and max-width on the positioned element to fit it within the available space in viewport.\n * true enables this for both width and height when overflow happens.\n * 'always' applies `max-height`/`max-width` regardless of overflow.\n * 'height' applies `max-height` when overflow happens, and 'width' for `max-width`\n * `height-always` applies `max-height` regardless of overflow, and 'width-always' for always applying `max-width`\n */\n autoSize?: AutoSize;\n\n /**\n * Modifies position and alignment to cover the target\n */\n coverTarget?: boolean;\n\n /**\n * Disables automatic repositioning of the component; it will always be placed according to the values of `align` and\n * `position` props, regardless of the size of the component, the reference element or the viewport.\n */\n pinned?: boolean;\n\n /**\n * When the reference element or the viewport is outside viewport allows a positioned element to be fully in viewport.\n * \"all\" enables this behavior for all axis.\n */\n // eslint-disable-next-line @typescript-eslint/naming-convention\n unstable_disableTether?: boolean | 'all';\n}\n\nexport interface PositioningProps\n // \"positionFixed\" & \"unstable_disableTether\" are not exported as public API (yet)\n extends Omit<PositioningOptions, 'positionFixed' | 'unstable_disableTether'> {\n /** An imperative handle to Popper methods. */\n positioningRef?: React.Ref<PositioningImperativeRef>;\n\n /**\n * Manual override for the target element. Useful for scenarios where a component accepts user prop to override target\n */\n target?: HTMLElement | PositioningVirtualElement | null;\n}\n\nexport type PositioningShorthandValue =\n | 'above'\n | 'above-start'\n | 'above-end'\n | 'below'\n | 'below-start'\n | 'below-end'\n | 'before'\n | 'before-top'\n | 'before-bottom'\n | 'after'\n | 'after-top'\n | 'after-bottom';\n\nexport type PositioningShorthand = PositioningProps | PositioningShorthandValue;\n"]}
@@ -1,8 +1,10 @@
1
1
  import { useEventCallback, useIsomorphicLayoutEffect, useFirstMount, canUseDOM } from '@fluentui/react-utilities';
2
- import { useFluent } from '@fluentui/react-shared-contexts';
2
+ import { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';
3
3
  import * as PopperJs from '@popperjs/core';
4
4
  import * as React from 'react';
5
- import { getScrollParent, applyRtlToOffset, getPlacement, getReactFiberFromNode, getBoundary, useCallbackRef, getBasePlacement } from './utils/index'; //
5
+ import { isIntersectingModifier } from './isIntersectingModifier';
6
+ import { getScrollParent, applyRtlToOffset, getPlacement, getReactFiberFromNode, getBoundary, useCallbackRef, parsePopperPlacement } from './utils/index';
7
+ import { getPopperOffset } from './utils/getPopperOffset'; //
6
8
  // Dev utils to detect if nodes have "autoFocus" props.
7
9
  //
8
10
 
@@ -57,7 +59,7 @@ function usePopperOptions(options, popperOriginalPositionRef) {
57
59
  const offsetModifier = React.useMemo(() => offset ? {
58
60
  name: 'offset',
59
61
  options: {
60
- offset: isRtl ? applyRtlToOffset(offset) : offset
62
+ offset: isRtl ? applyRtlToOffset(getPopperOffset(offset)) : getPopperOffset(offset)
61
63
  }
62
64
  } : null, [offset, isRtl]);
63
65
  return React.useCallback((target, container, arrow) => {
@@ -65,7 +67,7 @@ function usePopperOptions(options, popperOriginalPositionRef) {
65
67
 
66
68
  const scrollParentElement = getScrollParent(container);
67
69
  const hasScrollableElement = scrollParentElement ? scrollParentElement !== ((_a = scrollParentElement.ownerDocument) === null || _a === void 0 ? void 0 : _a.body) : false;
68
- const modifiers = [
70
+ const modifiers = [isIntersectingModifier,
69
71
  /**
70
72
  * We are setting the position to `fixed` in the first effect to prevent scroll jumps in case of the content
71
73
  * with managed focus. Modifier sets the position to `fixed` before all other modifier effects. Another part of
@@ -174,7 +176,7 @@ function usePopperOptions(options, popperOriginalPositionRef) {
174
176
  width,
175
177
  height
176
178
  } = state.rects.popper;
177
- const basePlacement = getBasePlacement(state.placement);
179
+ const basePlacement = parsePopperPlacement(state.placement).basePlacement;
178
180
  const widthProp = basePlacement === 'left' ? 'left' : 'right';
179
181
  const heightProp = basePlacement === 'top' ? 'top' : 'bottom';
180
182
  const applyMaxWidth = autoSize === 'always' || autoSize === 'width-always' || overflow[widthProp] > 0 && (autoSize === true || autoSize === 'width');
@@ -214,7 +216,7 @@ function usePopperOptions(options, popperOriginalPositionRef) {
214
216
  fn({
215
217
  state
216
218
  }) {
217
- const basePlacement = getBasePlacement(state.placement);
219
+ const basePlacement = parsePopperPlacement(state.placement).basePlacement;
218
220
 
219
221
  switch (basePlacement) {
220
222
  case 'bottom':
@@ -256,7 +258,7 @@ function usePopperOptions(options, popperOriginalPositionRef) {
256
258
  */
257
259
 
258
260
 
259
- export function usePopper(options = {}) {
261
+ export function usePositioning(options = {}) {
260
262
  const {
261
263
  enabled = true
262
264
  } = options;
@@ -323,7 +325,7 @@ export function usePopper(options = {}) {
323
325
  const arrowRef = useCallbackRef(null, handlePopperUpdate, true); // Stores external target from options.target or setTarget
324
326
 
325
327
  const overrideTargetRef = useCallbackRef(null, handlePopperUpdate, true);
326
- React.useImperativeHandle(options.popperRef, () => ({
328
+ React.useImperativeHandle(options.positioningRef, () => ({
327
329
  updatePosition: () => {
328
330
  var _a;
329
331
 
@@ -403,4 +405,4 @@ export function usePopper(options = {}) {
403
405
  arrowRef
404
406
  };
405
407
  }
406
- //# sourceMappingURL=usePopper.js.map
408
+ //# sourceMappingURL=usePositioning.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["usePositioning.ts"],"names":[],"mappings":"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","sourcesContent":["import { useEventCallback, useIsomorphicLayoutEffect, useFirstMount, canUseDOM } from '@fluentui/react-utilities';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport * as PopperJs from '@popperjs/core';\nimport * as React from 'react';\n\nimport { isIntersectingModifier } from './isIntersectingModifier';\nimport {\n getScrollParent,\n applyRtlToOffset,\n getPlacement,\n getReactFiberFromNode,\n getBoundary,\n useCallbackRef,\n parsePopperPlacement,\n} from './utils/index';\nimport type { PositioningVirtualElement, PositioningOptions, PositioningProps } from './types';\nimport { getPopperOffset } from './utils/getPopperOffset';\n\ntype PopperInstance = PopperJs.Instance & { isFirstRun?: boolean };\n\ninterface UsePopperOptions extends PositioningProps {\n /**\n * If false, delays Popper's creation.\n * @default true\n */\n enabled?: boolean;\n}\n\n//\n// Dev utils to detect if nodes have \"autoFocus\" props.\n//\n\n/**\n * Detects if a passed HTML node has \"autoFocus\" prop on a React's fiber. Is needed as React handles autofocus behavior\n * in React DOM and will not pass \"autoFocus\" to an actual HTML.\n */\nfunction hasAutofocusProp(node: Node): boolean {\n // https://github.com/facebook/react/blob/848bb2426e44606e0a55dfe44c7b3ece33772485/packages/react-dom/src/client/ReactDOMHostConfig.js#L157-L166\n const isAutoFocusableElement =\n node.nodeName === 'BUTTON' ||\n node.nodeName === 'INPUT' ||\n node.nodeName === 'SELECT' ||\n node.nodeName === 'TEXTAREA';\n\n if (isAutoFocusableElement) {\n return !!getReactFiberFromNode(node)?.pendingProps.autoFocus;\n }\n\n return false;\n}\n\nfunction hasAutofocusFilter(node: Node) {\n return hasAutofocusProp(node) ? NodeFilter.FILTER_ACCEPT : NodeFilter.FILTER_SKIP;\n}\n\n/**\n * Provides a callback to resolve Popper options, it's stable and should be used as a dependency to trigger updates\n * of Popper options.\n *\n * A callback is used there intentionally as some of Popper.js modifiers require DOM nodes (targer, container, arrow)\n * that can't be resolved properly during an initial rendering.\n */\nfunction usePopperOptions(options: PositioningOptions, popperOriginalPositionRef: React.MutableRefObject<string>) {\n const {\n align,\n arrowPadding,\n autoSize,\n coverTarget,\n flipBoundary,\n offset,\n overflowBoundary,\n pinned,\n position,\n positionFixed,\n // eslint-disable-next-line @typescript-eslint/naming-convention\n unstable_disableTether,\n } = options;\n\n const isRtl = useFluent().dir === 'rtl';\n const placement = getPlacement(align, position, isRtl);\n const strategy = positionFixed ? 'fixed' : 'absolute';\n\n const offsetModifier = React.useMemo(\n () =>\n offset\n ? {\n name: 'offset',\n options: { offset: isRtl ? applyRtlToOffset(getPopperOffset(offset)) : getPopperOffset(offset) },\n }\n : null,\n [offset, isRtl],\n );\n\n return React.useCallback(\n (\n target: HTMLElement | PopperJs.VirtualElement | null,\n container: HTMLElement | null,\n arrow: HTMLElement | null,\n ): PopperJs.Options => {\n const scrollParentElement: HTMLElement = getScrollParent(container);\n const hasScrollableElement = scrollParentElement\n ? scrollParentElement !== scrollParentElement.ownerDocument?.body\n : false;\n\n const modifiers: PopperJs.Options['modifiers'] = [\n isIntersectingModifier,\n\n /**\n * We are setting the position to `fixed` in the first effect to prevent scroll jumps in case of the content\n * with managed focus. Modifier sets the position to `fixed` before all other modifier effects. Another part of\n * a patch modifies \".forceUpdate()\" directly after a Popper will be created.\n */\n {\n name: 'positionStyleFix',\n enabled: true,\n phase: 'afterWrite' as PopperJs.ModifierPhases,\n effect: ({ state, instance }: { state: PopperJs.State; instance: PopperInstance }) => {\n // \".isFirstRun\" is a part of our patch, on a first evaluation it will \"undefined\"\n // should be disabled for subsequent runs as it breaks positioning for them\n if (instance.isFirstRun !== false) {\n popperOriginalPositionRef.current = state.elements.popper.style.position;\n state.elements.popper.style.position = 'fixed';\n }\n\n return () => undefined;\n },\n requires: [],\n },\n\n { name: 'flip', options: { flipVariations: true } },\n\n /**\n * pinned disables the flip modifier by setting flip.enabled to false; this\n * disables automatic repositioning of the popper box; it will always be placed according to\n * the values of `align` and `position` props, regardless of the size of the component, the\n * reference element or the viewport.\n */\n pinned && { name: 'flip', enabled: false },\n\n /**\n * When the popper box is placed in the context of a scrollable element, we need to set\n * preventOverflow.escapeWithReference to true and flip.boundariesElement to 'scrollParent'\n * (default is 'viewport') so that the popper box will stick with the targetRef when we\n * scroll targetRef out of the viewport.\n */\n hasScrollableElement && { name: 'flip', options: { boundary: 'clippingParents' } },\n hasScrollableElement && { name: 'preventOverflow', options: { boundary: 'clippingParents' } },\n\n offsetModifier,\n\n /**\n * This modifier is necessary to retain behaviour from popper v1 where untethered poppers are allowed by\n * default. i.e. popper is still rendered fully in the viewport even if anchor element is no longer in the\n * viewport.\n */\n unstable_disableTether && {\n name: 'preventOverflow',\n options: { altAxis: unstable_disableTether === 'all', tether: false },\n },\n\n flipBoundary && {\n name: 'flip',\n options: {\n altBoundary: true,\n boundary: getBoundary(container, flipBoundary),\n },\n },\n overflowBoundary && {\n name: 'preventOverflow',\n options: {\n altBoundary: true,\n boundary: getBoundary(container, overflowBoundary),\n },\n },\n\n {\n // Similar code as popper-maxsize-modifier: https://github.com/atomiks/popper.js/blob/master/src/modifiers/maxSize.js\n // popper-maxsize-modifier only calculates the max sizes.\n // This modifier can apply max sizes always, or apply the max sizes only when overflow is detected\n name: 'applyMaxSize',\n enabled: !!autoSize,\n phase: 'beforeWrite' as PopperJs.ModifierPhases,\n requiresIfExists: ['offset', 'preventOverflow', 'flip'],\n options: {\n altBoundary: true,\n boundary: getBoundary(container, overflowBoundary),\n },\n fn({ state, options: modifierOptions }: PopperJs.ModifierArguments<{}>) {\n const overflow = PopperJs.detectOverflow(state, modifierOptions);\n const { x, y } = state.modifiersData.preventOverflow || { x: 0, y: 0 };\n const { width, height } = state.rects.popper;\n const basePlacement = parsePopperPlacement(state.placement).basePlacement;\n\n const widthProp: keyof PopperJs.SideObject = basePlacement === 'left' ? 'left' : 'right';\n const heightProp: keyof PopperJs.SideObject = basePlacement === 'top' ? 'top' : 'bottom';\n\n const applyMaxWidth =\n autoSize === 'always' ||\n autoSize === 'width-always' ||\n (overflow[widthProp] > 0 && (autoSize === true || autoSize === 'width'));\n const applyMaxHeight =\n autoSize === 'always' ||\n autoSize === 'height-always' ||\n (overflow[heightProp] > 0 && (autoSize === true || autoSize === 'height'));\n\n if (applyMaxWidth) {\n state.styles.popper.maxWidth = `${width - overflow[widthProp] - x}px`;\n }\n if (applyMaxHeight) {\n state.styles.popper.maxHeight = `${height - overflow[heightProp] - y}px`;\n }\n },\n },\n\n /**\n * This modifier is necessary in order to render the pointer. Refs are resolved in effects, so it can't be\n * placed under computed modifiers. Deep merge is not required as this modifier has only these properties.\n */\n {\n name: 'arrow',\n enabled: !!arrow,\n options: { element: arrow, padding: arrowPadding },\n },\n\n /**\n * Modifies popper offsets to cover the reference rect, but still keep edge alignment\n */\n {\n name: 'coverTarget',\n enabled: !!coverTarget,\n phase: 'main',\n requiresIfExists: ['offset', 'preventOverflow', 'flip'],\n fn({ state }: PopperJs.ModifierArguments<{}>) {\n const basePlacement = parsePopperPlacement(state.placement).basePlacement;\n switch (basePlacement) {\n case 'bottom':\n state.modifiersData.popperOffsets!.y -= state.rects.reference.height;\n break;\n case 'top':\n state.modifiersData.popperOffsets!.y += state.rects.reference.height;\n break;\n case 'left':\n state.modifiersData.popperOffsets!.x += state.rects.reference.width;\n break;\n case 'right':\n state.modifiersData.popperOffsets!.x -= state.rects.reference.width;\n break;\n }\n },\n },\n ].filter(Boolean) as PopperJs.Options['modifiers']; // filter boolean conditional spreading values\n\n const popperOptions: PopperJs.Options = {\n modifiers,\n\n placement,\n strategy,\n };\n\n return popperOptions;\n },\n [\n arrowPadding,\n autoSize,\n coverTarget,\n flipBoundary,\n offsetModifier,\n overflowBoundary,\n placement,\n strategy,\n unstable_disableTether,\n pinned,\n\n // These can be skipped from deps as they will not ever change\n popperOriginalPositionRef,\n ],\n );\n}\n\n/**\n * Exposes Popper positioning API via React hook. Contains few important differences between an official \"react-popper\"\n * package:\n * - style attributes are applied directly on DOM to avoid re-renders\n * - refs changes and resolution is handled properly without re-renders\n * - contains a specific to React fix related to initial positioning when containers have components with managed focus\n * to avoid focus jumps\n */\nexport function usePositioning(\n options: UsePopperOptions = {},\n): {\n // React refs are supposed to be contravariant\n // (allows a more general type to be passed rather than a more specific one)\n // However, Typescript currently can't infer that fact for refs\n // See https://github.com/microsoft/TypeScript/issues/30748 for more information\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n targetRef: React.MutableRefObject<any>;\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n containerRef: React.MutableRefObject<any>;\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n arrowRef: React.MutableRefObject<any>;\n} {\n const { enabled = true } = options;\n const isFirstMount = useFirstMount();\n\n const popperOriginalPositionRef = React.useRef<string>('absolute');\n const resolvePopperOptions = usePopperOptions(options, popperOriginalPositionRef);\n\n const popperInstanceRef = React.useRef<PopperInstance | null>(null);\n\n const handlePopperUpdate = useEventCallback(() => {\n popperInstanceRef.current?.destroy();\n popperInstanceRef.current = null;\n\n const target = overrideTargetRef.current ?? targetRef.current;\n\n let popperInstance: PopperInstance | null = null;\n\n if (canUseDOM() && enabled) {\n if (target && containerRef.current) {\n popperInstance = PopperJs.createPopper(\n target,\n containerRef.current,\n resolvePopperOptions(target, containerRef.current, arrowRef.current),\n );\n }\n }\n\n if (popperInstance) {\n /**\n * The patch updates `.forceUpdate()` Popper function which restores the original position before the first\n * forceUpdate() call. See also \"positionStyleFix\" modifier in usePopperOptions().\n */\n const originalForceUpdate = popperInstance.forceUpdate;\n\n popperInstance.isFirstRun = true;\n popperInstance.forceUpdate = () => {\n if (popperInstance?.isFirstRun) {\n popperInstance.state.elements.popper.style.position = popperOriginalPositionRef.current;\n popperInstance.isFirstRun = false;\n }\n\n originalForceUpdate();\n };\n }\n\n popperInstanceRef.current = popperInstance;\n });\n\n // Refs are managed by useCallbackRef() to handle ref updates scenarios.\n //\n // The first scenario are updates for a targetRef, we can handle it properly only via callback refs, but it causes\n // re-renders (we would like to avoid them).\n //\n // The second problem is related to refs resolution on React's layer: refs are resolved in the same order as effects\n // that causes an issue when you have a container inside a target, for example: a menu in ChatMessage.\n //\n // function ChatMessage(props) {\n // <div className=\"message\" ref={targetRef}> // 3) ref will be resolved only now, but it's too late already\n // <Popper target={targetRef}> // 2) create a popper instance\n // <div className=\"menu\" /> // 1) capture ref from this element\n // </Popper>\n // </div>\n // }\n //\n // Check a demo on CodeSandbox: https://codesandbox.io/s/popper-refs-emy60.\n //\n // This again can be solved with callback refs. It's not a huge issue as with hooks we are moving popper's creation\n // to ChatMessage itself, however, without `useCallback()` refs it's still a Pandora box.\n const targetRef = useCallbackRef<HTMLElement | PopperJs.VirtualElement | null>(null, handlePopperUpdate, true);\n const containerRef = useCallbackRef<HTMLElement | null>(null, handlePopperUpdate, true);\n const arrowRef = useCallbackRef<HTMLElement | null>(null, handlePopperUpdate, true);\n\n // Stores external target from options.target or setTarget\n const overrideTargetRef = useCallbackRef<HTMLElement | PositioningVirtualElement | null>(\n null,\n handlePopperUpdate,\n true,\n );\n\n React.useImperativeHandle(\n options.positioningRef,\n () => ({\n updatePosition: () => {\n popperInstanceRef.current?.update();\n },\n setTarget: (target: HTMLElement | PositioningVirtualElement) => {\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 overrideTargetRef.current = target;\n },\n }),\n // Missing deps:\n // options.target - only used for a runtime warning\n // targetRef - Stable between renders\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [],\n );\n\n useIsomorphicLayoutEffect(() => {\n if (options.target) {\n overrideTargetRef.current = options.target;\n }\n }, [options.target, overrideTargetRef]);\n useIsomorphicLayoutEffect(() => {\n handlePopperUpdate();\n\n return () => {\n popperInstanceRef.current?.destroy();\n popperInstanceRef.current = null;\n };\n }, [handlePopperUpdate, options.enabled]);\n useIsomorphicLayoutEffect(\n () => {\n if (!isFirstMount) {\n popperInstanceRef.current?.setOptions(\n resolvePopperOptions(overrideTargetRef.current ?? targetRef.current, containerRef.current, arrowRef.current),\n );\n }\n },\n // Missing deps:\n // isFirstMount - Should never change after mount\n // arrowRef, containerRef, targetRef - Stable between renders\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [resolvePopperOptions],\n );\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('<Popper>:', node);\n // eslint-disable-next-line no-console\n console.warn(\n [\n '<Popper>: ^ 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 // eslint-disable-next-line react-hooks/exhaustive-deps\n }, []);\n }\n\n return { targetRef, containerRef, arrowRef };\n}\n"],"sourceRoot":"../src/"}
@@ -9,7 +9,7 @@ import { createVirtualElementFromClick } from './createVirtualElementFromClick';
9
9
  * @returns state and dispatcher for a Popper virtual element that uses native/synthetic mouse events
10
10
  */
11
11
 
12
- export const usePopperMouseTarget = initialState => {
12
+ export const usePositioningMouseTarget = initialState => {
13
13
  const [virtualElement, setVirtualElement] = React.useState(initialState);
14
14
 
15
15
  const setVirtualMouseTarget = event => {
@@ -28,7 +28,7 @@ export const usePopperMouseTarget = initialState => {
28
28
 
29
29
  if (!(mouseevent instanceof MouseEvent) && process.env.NODE_ENV !== 'production') {
30
30
  // eslint-disable-next-line no-console
31
- console.error('usePopperMouseTarget should only be used with MouseEvent');
31
+ console.error('usePositioningMouseTarget should only be used with MouseEvent');
32
32
  }
33
33
 
34
34
  const contextTarget = createVirtualElementFromClick(mouseevent);
@@ -37,4 +37,4 @@ export const usePopperMouseTarget = initialState => {
37
37
 
38
38
  return [virtualElement, setVirtualMouseTarget];
39
39
  };
40
- //# sourceMappingURL=usePopperMouseTarget.js.map
40
+ //# sourceMappingURL=usePositioningMouseTarget.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["usePositioningMouseTarget.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,6BAAT,QAA8C,iCAA9C;AAGA;;;;;;;AAOG;;AACH,OAAO,MAAM,yBAAyB,GACpC,YADuC,IAErC;AACF,QAAM,CAAC,cAAD,EAAiB,iBAAjB,IAAsC,KAAK,CAAC,QAAN,CAAsD,YAAtD,CAA5C;;AAEA,QAAM,qBAAqB,GAAI,KAAD,IAA4D;AACxF,QAAI,KAAK,KAAK,SAAV,IAAuB,KAAK,KAAK,IAArC,EAA2C;AACzC,MAAA,iBAAiB,CAAC,SAAD,CAAjB;AACA;AACD;;AAED,QAAI,UAAJ;;AACA,QAAI,EAAE,KAAK,YAAY,UAAnB,CAAJ,EAAoC;AAClC,MAAA,UAAU,GAAG,KAAK,CAAC,WAAnB;AACD,KAFD,MAEO;AACL,MAAA,UAAU,GAAG,KAAb;AACD;;AAED,QAAI,EAAE,UAAU,YAAY,UAAxB,KAAuC,OAAO,CAAC,GAAR,CAAY,QAAZ,KAAyB,YAApE,EAAkF;AAChF;AACA,MAAA,OAAO,CAAC,KAAR,CAAc,+DAAd;AACD;;AAED,UAAM,aAAa,GAAG,6BAA6B,CAAC,UAAD,CAAnD;AACA,IAAA,iBAAiB,CAAC,aAAD,CAAjB;AACD,GApBD;;AAsBA,SAAO,CAAC,cAAD,EAAiB,qBAAjB,CAAP;AACD,CA5BM","sourcesContent":["import * as React from 'react';\nimport { createVirtualElementFromClick } from './createVirtualElementFromClick';\nimport { PositioningVirtualElement } from './types';\n\n/**\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) => {\n const [virtualElement, setVirtualElement] = React.useState<PositioningVirtualElement | undefined>(initialState);\n\n const setVirtualMouseTarget = (event: React.MouseEvent | MouseEvent | undefined | null) => {\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"],"sourceRoot":"../src/"}
@@ -0,0 +1,40 @@
1
+ import { parsePopperPlacement } from './parsePopperPlacement';
2
+ const positionMap = {
3
+ top: 'above',
4
+ bottom: 'below',
5
+ right: 'after',
6
+ left: 'before'
7
+ };
8
+
9
+ const getAlignmentMap = position => {
10
+ if (position === 'above' || position === 'below') {
11
+ return {
12
+ start: 'start',
13
+ end: 'end'
14
+ };
15
+ }
16
+
17
+ return {
18
+ start: 'top',
19
+ end: 'bottom'
20
+ };
21
+ };
22
+ /**
23
+ * Maps Popper.js placement to positioning values
24
+ * @see positioningHelper.test.ts for expected placement values
25
+ */
26
+
27
+
28
+ export const fromPopperPlacement = placement => {
29
+ const {
30
+ basePlacement,
31
+ alignment: popperAlignment
32
+ } = parsePopperPlacement(placement);
33
+ const position = positionMap[basePlacement];
34
+ const alignment = popperAlignment && getAlignmentMap(position)[popperAlignment];
35
+ return {
36
+ position,
37
+ alignment
38
+ };
39
+ };
40
+ //# sourceMappingURL=fromPopperPlacement.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["utils/fromPopperPlacement.ts"],"names":[],"mappings":"AAEA,SAAS,oBAAT,QAAqC,wBAArC;AAEA,MAAM,WAAW,GAAG;AAClB,EAAA,GAAG,EAAE,OADa;AAElB,EAAA,MAAM,EAAE,OAFU;AAGlB,EAAA,KAAK,EAAE,OAHW;AAIlB,EAAA,IAAI,EAAE;AAJY,CAApB;;AAOA,MAAM,eAAe,GAAI,QAAD,IAA2D;AACjF,MAAI,QAAQ,KAAK,OAAb,IAAwB,QAAQ,KAAK,OAAzC,EAAkD;AAChD,WAAO;AACL,MAAA,KAAK,EAAE,OADF;AAEL,MAAA,GAAG,EAAE;AAFA,KAAP;AAID;;AAED,SAAO;AACL,IAAA,KAAK,EAAE,KADF;AAEL,IAAA,GAAG,EAAE;AAFA,GAAP;AAID,CAZD;AAcA;;;AAGG;;;AACH,OAAO,MAAM,mBAAmB,GAAI,SAAD,IAAwE;AACzG,QAAM;AAAE,IAAA,aAAF;AAAiB,IAAA,SAAS,EAAE;AAA5B,MAAgD,oBAAoB,CAAC,SAAD,CAA1E;AACA,QAAM,QAAQ,GAAG,WAAW,CAAC,aAAD,CAA5B;AACA,QAAM,SAAS,GAAG,eAAe,IAAI,eAAe,CAAC,QAAD,CAAf,CAA0B,eAA1B,CAArC;AAEA,SAAO;AAAE,IAAA,QAAF;AAAY,IAAA;AAAZ,GAAP;AACD,CANM","sourcesContent":["import type { Variation as PopperAlignment, Placement } from '@popperjs/core';\nimport type { Alignment, Position } from '../types';\nimport { parsePopperPlacement } from './parsePopperPlacement';\n\nconst positionMap = {\n top: 'above',\n bottom: 'below',\n right: 'after',\n left: 'before',\n} as const;\n\nconst getAlignmentMap = (position: Position): Record<PopperAlignment, Alignment> => {\n if (position === 'above' || position === 'below') {\n return {\n start: 'start',\n end: 'end',\n };\n }\n\n return {\n start: 'top',\n end: 'bottom',\n };\n};\n\n/**\n * Maps Popper.js placement to positioning values\n * @see positioningHelper.test.ts for expected placement values\n */\nexport const fromPopperPlacement = (placement: Placement): { position: Position; alignment?: Alignment } => {\n const { basePlacement, alignment: popperAlignment } = parsePopperPlacement(placement);\n const position = positionMap[basePlacement];\n const alignment = popperAlignment && getAlignmentMap(position)[popperAlignment];\n\n return { position, alignment };\n};\n"],"sourceRoot":"../src/"}
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/utils/getBoundary.ts"],"names":[],"mappings":"AAEA,SAAS,eAAT,QAAgC,mBAAhC;AAGA;;AAEG;;AACH,OAAM,SAAU,WAAV,CAAsB,OAAtB,EAAmD,QAAnD,EAAsE;AAC1E,MAAI,QAAQ,KAAK,QAAjB,EAA2B;AACzB,WAAO,OAAO,KAAA,IAAP,IAAA,OAAO,KAAA,KAAA,CAAP,GAAO,KAAA,CAAP,GAAA,OAAO,CAAE,aAAT,CAAwB,eAA/B;AACD;;AAED,MAAI,QAAQ,KAAK,cAAjB,EAAiC;AAC/B,QAAI,cAAc,GAA4B,eAAe,CAAC,OAAD,CAA7D;;AAEA,QAAI,cAAc,CAAC,QAAf,KAA4B,MAAhC,EAAwC;AACtC,MAAA,cAAc,GAAG,OAAO,KAAA,IAAP,IAAA,OAAO,KAAA,KAAA,CAAP,GAAO,KAAA,CAAP,GAAA,OAAO,CAAE,aAAT,CAAwB,eAAzC;AACD;;AAED,WAAO,cAAP;AACD;;AAED,SAAO,QAAP;AACD","sourceRoot":""}
1
+ {"version":3,"sources":["utils/getBoundary.ts"],"names":[],"mappings":"AAEA,SAAS,eAAT,QAAgC,mBAAhC;AAGA;;AAEG;;AACH,OAAM,SAAU,WAAV,CAAsB,OAAtB,EAAmD,QAAnD,EAAsE;AAC1E,MAAI,QAAQ,KAAK,QAAjB,EAA2B;AACzB,WAAO,OAAO,KAAA,IAAP,IAAA,OAAO,KAAA,KAAA,CAAP,GAAO,KAAA,CAAP,GAAA,OAAO,CAAE,aAAT,CAAwB,eAA/B;AACD;;AAED,MAAI,QAAQ,KAAK,cAAjB,EAAiC;AAC/B,QAAI,cAAc,GAA4B,eAAe,CAAC,OAAD,CAA7D;;AAEA,QAAI,cAAc,CAAC,QAAf,KAA4B,MAAhC,EAAwC;AACtC,MAAA,cAAc,GAAG,OAAO,KAAA,IAAP,IAAA,OAAO,KAAA,KAAA,CAAP,GAAO,KAAA,CAAP,GAAA,OAAO,CAAE,aAAT,CAAwB,eAAzC;AACD;;AAED,WAAO,cAAP;AACD;;AAED,SAAO,QAAP;AACD","sourcesContent":["import * as PopperJs from '@popperjs/core';\n\nimport { getScrollParent } from './getScrollParent';\nimport type { Boundary } from '../types';\n\n/**\n * Allows to mimic a behavior from V1 of Popper and accept `window` and `scrollParent` as strings.\n */\nexport function getBoundary(element: HTMLElement | null, boundary?: Boundary): PopperJs.Boundary | undefined {\n if (boundary === 'window') {\n return element?.ownerDocument!.documentElement;\n }\n\n if (boundary === 'scrollParent') {\n let boundariesNode: HTMLElement | undefined = getScrollParent(element);\n\n if (boundariesNode.nodeName === 'BODY') {\n boundariesNode = element?.ownerDocument!.documentElement;\n }\n\n return boundariesNode;\n }\n\n return boundary;\n}\n"],"sourceRoot":"../src/"}
@@ -0,0 +1,44 @@
1
+ import { fromPopperPlacement } from './fromPopperPlacement';
2
+ /**
3
+ * Shim to transform offset values from this library to Popper.js
4
+ * @param rawOffset Offset from this library
5
+ * @returns An offset value compatible with Popper.js
6
+ */
7
+
8
+ export function getPopperOffset(rawOffset) {
9
+ if (rawOffset === undefined || rawOffset === null) {
10
+ return rawOffset;
11
+ }
12
+
13
+ if (typeof rawOffset === 'number') {
14
+ return [0, rawOffset];
15
+ }
16
+
17
+ if (typeof rawOffset === 'object') {
18
+ return [rawOffset.crossAxis, rawOffset.mainAxis];
19
+ }
20
+
21
+ return ({
22
+ popper,
23
+ reference,
24
+ placement
25
+ }) => {
26
+ const {
27
+ position,
28
+ alignment
29
+ } = fromPopperPlacement(placement);
30
+ const computedOffset = rawOffset({
31
+ positionedRect: popper,
32
+ targetRect: reference,
33
+ position,
34
+ alignment
35
+ });
36
+
37
+ if (typeof computedOffset === 'number') {
38
+ return [0, computedOffset];
39
+ }
40
+
41
+ return [computedOffset.crossAxis, computedOffset.mainAxis];
42
+ };
43
+ }
44
+ //# sourceMappingURL=getPopperOffset.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["utils/getPopperOffset.ts"],"names":[],"mappings":"AAEA,SAAS,mBAAT,QAAoC,uBAApC;AAyBA;;;;AAIG;;AACH,OAAM,SAAU,eAAV,CAA0B,SAA1B,EAAuD;AAC3D,MAAI,SAAS,KAAK,SAAd,IAA2B,SAAS,KAAK,IAA7C,EAAmD;AACjD,WAAO,SAAP;AACD;;AAED,MAAI,OAAO,SAAP,KAAqB,QAAzB,EAAmC;AACjC,WAAO,CAAC,CAAD,EAAI,SAAJ,CAAP;AACD;;AAED,MAAI,OAAO,SAAP,KAAqB,QAAzB,EAAmC;AACjC,WAAO,CAAC,SAAS,CAAC,SAAX,EAAsB,SAAS,CAAC,QAAhC,CAAP;AACD;;AAED,SAAO,CAAC;AAAE,IAAA,MAAF;AAAU,IAAA,SAAV;AAAqB,IAAA;AAArB,GAAD,KAAqC;AAC1C,UAAM;AAAE,MAAA,QAAF;AAAY,MAAA;AAAZ,QAA0B,mBAAmB,CAAC,SAAD,CAAnD;AACA,UAAM,cAAc,GAAG,SAAS,CAAC;AAAE,MAAA,cAAc,EAAE,MAAlB;AAA0B,MAAA,UAAU,EAAE,SAAtC;AAAiD,MAAA,QAAjD;AAA2D,MAAA;AAA3D,KAAD,CAAhC;;AACA,QAAI,OAAO,cAAP,KAA0B,QAA9B,EAAwC;AACtC,aAAO,CAAC,CAAD,EAAI,cAAJ,CAAP;AACD;;AAED,WAAO,CAAC,cAAc,CAAC,SAAhB,EAA2B,cAAc,CAAC,QAA1C,CAAP;AACD,GARD;AASD","sourcesContent":["import type { Offset } from '../types';\nimport type { Rect, Placement } from '@popperjs/core';\nimport { fromPopperPlacement } from './fromPopperPlacement';\n/**\n * Type taken from Popper since it is not exported\n */\nexport type PopperOffsetValue = [number | null | undefined, number | null | undefined];\n\n/**\n * Type taken from Popper since it is not exported\n */\nexport type PopperOffset = PopperOffsetValue | PopperOffsetFunction;\n\n/**\n * Type taken from Popper.js since it is not exported\n */\nexport type PopperOffsetFunctionParam = {\n popper: Rect;\n reference: Rect;\n placement: Placement;\n};\n\n/**\n * Type taken from Popper.js since it is not exported\n */\nexport type PopperOffsetFunction = (args: { popper: Rect; reference: Rect; placement: Placement }) => PopperOffsetValue;\n\n/**\n * Shim to transform offset values from this library to Popper.js\n * @param rawOffset Offset from this library\n * @returns An offset value compatible with Popper.js\n */\nexport function getPopperOffset(rawOffset: Offset | undefined): PopperOffsetValue | PopperOffsetFunction | undefined {\n if (rawOffset === undefined || rawOffset === null) {\n return rawOffset;\n }\n\n if (typeof rawOffset === 'number') {\n return [0, rawOffset];\n }\n\n if (typeof rawOffset === 'object') {\n return [rawOffset.crossAxis, rawOffset.mainAxis];\n }\n\n return ({ popper, reference, placement }) => {\n const { position, alignment } = fromPopperPlacement(placement);\n const computedOffset = rawOffset({ positionedRect: popper, targetRect: reference, position, alignment });\n if (typeof computedOffset === 'number') {\n return [0, computedOffset];\n }\n\n return [computedOffset.crossAxis, computedOffset.mainAxis];\n };\n}\n"],"sourceRoot":"../src/"}