@fluentui/react-positioning 9.0.0-rc.8 → 9.0.0-rc.9

Sign up to get free protection for your applications and to get access to all the features.
Files changed (36) hide show
  1. package/CHANGELOG.json +46 -1
  2. package/CHANGELOG.md +16 -2
  3. package/{lib → dist}/tsdoc-metadata.json +0 -0
  4. package/package.json +6 -6
  5. package/lib/createArrowStyles.d.ts +0 -64
  6. package/lib/createVirtualElementFromClick.d.ts +0 -6
  7. package/lib/index.d.ts +0 -7
  8. package/lib/isIntersectingModifier.d.ts +0 -4
  9. package/lib/types.d.ts +0 -89
  10. package/lib/usePopper.d.ts +0 -23
  11. package/lib/usePopperMouseTarget.d.ts +0 -11
  12. package/lib/utils/getBasePlacement.d.ts +0 -8
  13. package/lib/utils/getBoundary.d.ts +0 -6
  14. package/lib/utils/getReactFiberFromNode.d.ts +0 -108
  15. package/lib/utils/getScrollParent.d.ts +0 -12
  16. package/lib/utils/index.d.ts +0 -8
  17. package/lib/utils/mergeArrowOffset.d.ts +0 -10
  18. package/lib/utils/positioningHelper.d.ts +0 -7
  19. package/lib/utils/resolvePositioningShorthand.d.ts +0 -2
  20. package/lib/utils/useCallbackRef.d.ts +0 -19
  21. package/lib-commonjs/createArrowStyles.d.ts +0 -64
  22. package/lib-commonjs/createVirtualElementFromClick.d.ts +0 -6
  23. package/lib-commonjs/index.d.ts +0 -7
  24. package/lib-commonjs/isIntersectingModifier.d.ts +0 -4
  25. package/lib-commonjs/types.d.ts +0 -89
  26. package/lib-commonjs/usePopper.d.ts +0 -23
  27. package/lib-commonjs/usePopperMouseTarget.d.ts +0 -11
  28. package/lib-commonjs/utils/getBasePlacement.d.ts +0 -8
  29. package/lib-commonjs/utils/getBoundary.d.ts +0 -6
  30. package/lib-commonjs/utils/getReactFiberFromNode.d.ts +0 -108
  31. package/lib-commonjs/utils/getScrollParent.d.ts +0 -12
  32. package/lib-commonjs/utils/index.d.ts +0 -8
  33. package/lib-commonjs/utils/mergeArrowOffset.d.ts +0 -10
  34. package/lib-commonjs/utils/positioningHelper.d.ts +0 -7
  35. package/lib-commonjs/utils/resolvePositioningShorthand.d.ts +0 -2
  36. package/lib-commonjs/utils/useCallbackRef.d.ts +0 -19
package/CHANGELOG.json CHANGED
@@ -2,7 +2,52 @@
2
2
  "name": "@fluentui/react-positioning",
3
3
  "entries": [
4
4
  {
5
- "date": "Thu, 05 May 2022 18:24:32 GMT",
5
+ "date": "Mon, 23 May 2022 12:09:59 GMT",
6
+ "tag": "@fluentui/react-positioning_v9.0.0-rc.9",
7
+ "version": "9.0.0-rc.9",
8
+ "comments": {
9
+ "prerelease": [
10
+ {
11
+ "author": "martinhochel@microsoft.com",
12
+ "package": "@fluentui/react-positioning",
13
+ "commit": "e7b70cb06f4422e5574993fd2ad44d9073647417",
14
+ "comment": "feat: ship rolluped only dts"
15
+ },
16
+ {
17
+ "author": "olfedias@microsoft.com",
18
+ "package": "@fluentui/react-positioning",
19
+ "commit": "60804cec07a495b8a5d1fc66338bf0443b212144",
20
+ "comment": "chore: Update Griffel to latest version"
21
+ },
22
+ {
23
+ "author": "olfedias@microsoft.com",
24
+ "package": "@fluentui/react-positioning",
25
+ "commit": "f120fe9160ad7311a87af0cfacd8d2fb26275e34",
26
+ "comment": "chore: Update Griffel to latest version"
27
+ },
28
+ {
29
+ "author": "beachball",
30
+ "package": "@fluentui/react-positioning",
31
+ "comment": "Bump @fluentui/react-shared-contexts to v9.0.0-rc.8",
32
+ "commit": "8d58f08997acf595e3eb7f628123e7fa7830c394"
33
+ },
34
+ {
35
+ "author": "beachball",
36
+ "package": "@fluentui/react-positioning",
37
+ "comment": "Bump @fluentui/react-theme to v9.0.0-rc.8",
38
+ "commit": "8d58f08997acf595e3eb7f628123e7fa7830c394"
39
+ },
40
+ {
41
+ "author": "beachball",
42
+ "package": "@fluentui/react-positioning",
43
+ "comment": "Bump @fluentui/react-utilities to v9.0.0-rc.9",
44
+ "commit": "8d58f08997acf595e3eb7f628123e7fa7830c394"
45
+ }
46
+ ]
47
+ }
48
+ },
49
+ {
50
+ "date": "Thu, 05 May 2022 18:26:25 GMT",
6
51
  "tag": "@fluentui/react-positioning_v9.0.0-rc.8",
7
52
  "version": "9.0.0-rc.8",
8
53
  "comments": {
package/CHANGELOG.md CHANGED
@@ -1,12 +1,26 @@
1
1
  # Change Log - @fluentui/react-positioning
2
2
 
3
- This log was last generated on Thu, 05 May 2022 18:24:32 GMT and should not be manually modified.
3
+ This log was last generated on Mon, 23 May 2022 12:09:59 GMT and should not be manually modified.
4
4
 
5
5
  <!-- Start content -->
6
6
 
7
+ ## [9.0.0-rc.9](https://github.com/microsoft/fluentui/tree/@fluentui/react-positioning_v9.0.0-rc.9)
8
+
9
+ Mon, 23 May 2022 12:09:59 GMT
10
+ [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-positioning_v9.0.0-rc.8..@fluentui/react-positioning_v9.0.0-rc.9)
11
+
12
+ ### Changes
13
+
14
+ - feat: ship rolluped only dts ([PR #22828](https://github.com/microsoft/fluentui/pull/22828) by martinhochel@microsoft.com)
15
+ - chore: Update Griffel to latest version ([PR #23029](https://github.com/microsoft/fluentui/pull/23029) by olfedias@microsoft.com)
16
+ - chore: Update Griffel to latest version ([PR #22894](https://github.com/microsoft/fluentui/pull/22894) by olfedias@microsoft.com)
17
+ - Bump @fluentui/react-shared-contexts to v9.0.0-rc.8 ([PR #23030](https://github.com/microsoft/fluentui/pull/23030) by beachball)
18
+ - Bump @fluentui/react-theme to v9.0.0-rc.8 ([PR #23030](https://github.com/microsoft/fluentui/pull/23030) by beachball)
19
+ - Bump @fluentui/react-utilities to v9.0.0-rc.9 ([PR #23030](https://github.com/microsoft/fluentui/pull/23030) by beachball)
20
+
7
21
  ## [9.0.0-rc.8](https://github.com/microsoft/fluentui/tree/@fluentui/react-positioning_v9.0.0-rc.8)
8
22
 
9
- Thu, 05 May 2022 18:24:32 GMT
23
+ Thu, 05 May 2022 18:26:25 GMT
10
24
  [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-positioning_v9.0.0-rc.7..@fluentui/react-positioning_v9.0.0-rc.8)
11
25
 
12
26
  ### Changes
File without changes
package/package.json CHANGED
@@ -1,10 +1,10 @@
1
1
  {
2
2
  "name": "@fluentui/react-positioning",
3
- "version": "9.0.0-rc.8",
3
+ "version": "9.0.0-rc.9",
4
4
  "description": "A react wrapper around Popper.js for Fluent UI",
5
5
  "main": "lib-commonjs/index.js",
6
6
  "module": "lib/index.js",
7
- "typings": "lib/index.d.ts",
7
+ "typings": "dist/index.d.ts",
8
8
  "sideEffects": false,
9
9
  "repository": {
10
10
  "type": "git",
@@ -28,10 +28,10 @@
28
28
  "@fluentui/scripts": "^1.0.0"
29
29
  },
30
30
  "dependencies": {
31
- "@griffel/react": "1.0.3",
32
- "@fluentui/react-shared-contexts": "9.0.0-rc.7",
33
- "@fluentui/react-theme": "9.0.0-rc.7",
34
- "@fluentui/react-utilities": "9.0.0-rc.8",
31
+ "@griffel/react": "1.0.5",
32
+ "@fluentui/react-shared-contexts": "9.0.0-rc.8",
33
+ "@fluentui/react-theme": "9.0.0-rc.8",
34
+ "@fluentui/react-utilities": "9.0.0-rc.9",
35
35
  "@popperjs/core": "~2.4.3",
36
36
  "tslib": "^2.1.0"
37
37
  },
@@ -1,64 +0,0 @@
1
- import type { GriffelStyle } from '@griffel/react';
2
- /**
3
- * Options parameter for the createArrowStyles function
4
- */
5
- export declare type CreateArrowStylesOptions = {
6
- /**
7
- * The height of the arrow from the base to the tip, in px. The base width of the arrow is always twice its height.
8
- *
9
- * This can be undefined to leave out the arrow size styles. You must then add styles created by
10
- * createArrowHeightStyles to set the arrow's size correctly. This can be useful if the arrow can be different sizes.
11
- */
12
- arrowHeight: number | undefined;
13
- /**
14
- * The borderWidth of the arrow. Should be the same borderWidth as the parent element.
15
- *
16
- * @defaultvalue 1px
17
- */
18
- borderWidth?: GriffelStyle['borderBottomWidth'];
19
- /**
20
- * The borderStyle for the arrow. Should be the same borderStyle as the parent element.
21
- *
22
- * @defaultvalue solid
23
- */
24
- borderStyle?: GriffelStyle['borderBottomStyle'];
25
- /**
26
- * The borderColor of the arrow. Should be the same borderColor as the parent element.
27
- *
28
- * @defaultvalue tokens.colorTransparentStroke
29
- */
30
- borderColor?: GriffelStyle['borderBottomColor'];
31
- };
32
- /**
33
- * Helper that creates a makeStyles rule for an arrow element.
34
- * For runtime arrow size toggling simply create extra classnames to apply to the arrow element
35
- *
36
- * ```ts
37
- * makeStyles({
38
- * arrowWithSize: createArrowStyles({ arrowHeight: 6 }),
39
- *
40
- * arrowWithoutSize: createArrowStyles({ arrowHeight: undefined }),
41
- * mediumArrow: createArrowHeightStyles(4),
42
- * smallArrow: createArrowHeightStyles(2),
43
- * })
44
- * ...
45
- *
46
- * state.arrowWithSize.className = styles.arrowWithSize;
47
- * state.arrowWithoutSize.className = mergeClasses(
48
- * styles.arrowWithoutSize,
49
- * state.smallArrow && styles.smallArrow,
50
- * state.mediumArrow && styles.mediumArrow,
51
- * )
52
- * ```
53
- */
54
- export declare function createArrowStyles(options: CreateArrowStylesOptions): GriffelStyle;
55
- /**
56
- * Creates CSS styles to size the arrow created by createArrowStyles to the given height.
57
- *
58
- * Use this when you need to create classes for several different arrow sizes. If you only need a
59
- * constant arrow size, you can pass the `arrowHeight` param to createArrowStyles instead.
60
- */
61
- export declare function createArrowHeightStyles(arrowHeight: number): {
62
- width: string;
63
- height: string;
64
- };
@@ -1,6 +0,0 @@
1
- import type { PopperVirtualElement } from './types';
2
- /**
3
- * Creates a virtual element based on the position of a click event
4
- * Can be used as a target for popper in scenarios such as context menus
5
- */
6
- export declare function createVirtualElementFromClick(nativeEvent: MouseEvent): PopperVirtualElement;
package/lib/index.d.ts DELETED
@@ -1,7 +0,0 @@
1
- export { createVirtualElementFromClick } from './createVirtualElementFromClick';
2
- export { createArrowHeightStyles, createArrowStyles } from './createArrowStyles';
3
- export type { CreateArrowStylesOptions } from './createArrowStyles';
4
- export { usePopper } from './usePopper';
5
- export { usePopperMouseTarget } from './usePopperMouseTarget';
6
- export { resolvePositioningShorthand, mergeArrowOffset } from './utils/index';
7
- export type { Alignment, AutoSize, Boundary, Offset, OffsetFunction, OffsetFunctionParam, PopperOptions, PopperRefHandle, PopperVirtualElement, Position, PositioningProps, PositioningShorthand, PositioningShorthandValue, } from './types';
@@ -1,4 +0,0 @@
1
- import { Modifier } from '@popperjs/core';
2
- export declare const isIntersectingModifier: IsIntersectingModifier;
3
- declare type IsIntersectingModifier = Modifier<'is-intersecting-modifier', never>;
4
- export {};
package/lib/types.d.ts DELETED
@@ -1,89 +0,0 @@
1
- import * as PopperJs from '@popperjs/core';
2
- import * as React from 'react';
3
- export declare type OffsetFunctionParam = {
4
- popper: PopperJs.Rect;
5
- reference: PopperJs.Rect;
6
- placement: PopperJs.Placement;
7
- };
8
- export declare type OffsetFunction = (param: OffsetFunctionParam) => [number | null | undefined, number | null | undefined];
9
- export declare type Offset = OffsetFunction | [number | null | undefined, number | null | undefined];
10
- export declare type Position = 'above' | 'below' | 'before' | 'after';
11
- export declare type Alignment = 'top' | 'bottom' | 'start' | 'end' | 'center';
12
- export declare type AutoSize = 'height' | 'height-always' | 'width' | 'width-always' | 'always' | boolean;
13
- export declare type Boundary = PopperJs.Boundary | 'scrollParent' | 'window';
14
- export declare type PopperRefHandle = {
15
- /**
16
- * Updates the position of the popper imperatively.
17
- * Useful when the position of the target changes from other factors than scrolling of window resize.
18
- */
19
- updatePosition: () => void;
20
- /**
21
- * Sets the target and updates positioning imperatively.
22
- * Useful for avoiding double renders with the target option.
23
- */
24
- setTarget: (target: HTMLElement | PopperVirtualElement) => void;
25
- };
26
- export declare type PopperVirtualElement = PopperJs.VirtualElement;
27
- export interface PopperOptions {
28
- /** Alignment for the component. Only has an effect if used with the @see position option */
29
- align?: Alignment;
30
- /** The element which will define the boundaries of the popper position for the flip behavior. */
31
- flipBoundary?: Boundary;
32
- /** The element which will define the boundaries of the popper position for the overflow behavior. */
33
- overflowBoundary?: Boundary;
34
- /**
35
- * Position for the component. Position has higher priority than align. If position is vertical ('above' | 'below')
36
- * and align is also vertical ('top' | 'bottom') or if both position and align are horizontal ('before' | 'after'
37
- * and 'start' | 'end' respectively),
38
- * then provided value for 'align' will be ignored and 'center' will be used instead.
39
- */
40
- position?: Position;
41
- /**
42
- * Enables the Popper box to position itself in 'fixed' mode (default value is position: 'absolute')
43
- * @default false
44
- */
45
- positionFixed?: boolean;
46
- /**
47
- * Lets you displace a popper element from its reference element.
48
- * This can be useful if you need to apply some margin between them or if you need to fine tune the
49
- * position according to some custom logic.
50
- */
51
- offset?: Offset;
52
- /**
53
- * Defines padding between the corner of the popup element and the arrow.
54
- * Use to prevent the arrow from overlapping a rounded corner, for example.
55
- */
56
- arrowPadding?: number;
57
- /**
58
- * Applies max-height and max-width on popper to fit it within the available space in viewport.
59
- * true enables this for both width and height when overflow happens.
60
- * 'always' applies `max-height`/`max-width` regardless of overflow.
61
- * 'height' applies `max-height` when overflow happens, and 'width' for `max-width`
62
- * `height-always` applies `max-height` regardless of overflow, and 'width-always' for always applying `max-width`
63
- */
64
- autoSize?: AutoSize;
65
- /**
66
- * Modifies position and alignment to cover the target
67
- */
68
- coverTarget?: boolean;
69
- /**
70
- * Disables automatic repositioning of the component; it will always be placed according to the values of `align` and
71
- * `position` props, regardless of the size of the component, the reference element or the viewport.
72
- */
73
- pinned?: boolean;
74
- /**
75
- * When the reference element or the viewport is outside viewport allows a popper element to be fully in viewport.
76
- * "all" enables this behavior for all axis.
77
- */
78
- unstable_disableTether?: boolean | 'all';
79
- }
80
- export interface PositioningProps extends Omit<PopperOptions, 'positionFixed' | 'unstable_disableTether'> {
81
- /** An imperative handle to Popper methods. */
82
- popperRef?: React.Ref<PopperRefHandle>;
83
- /**
84
- * Manual override for popper target. Useful for scenarios where a component accepts user prop to override target
85
- */
86
- target?: HTMLElement | PopperVirtualElement | null;
87
- }
88
- export declare type PositioningShorthandValue = 'above' | 'above-start' | 'above-end' | 'below' | 'below-start' | 'below-end' | 'before' | 'before-top' | 'before-bottom' | 'after' | 'after-top' | 'after-bottom';
89
- export declare type PositioningShorthand = PositioningProps | PositioningShorthandValue;
@@ -1,23 +0,0 @@
1
- import * as React from 'react';
2
- import type { PositioningProps } from './types';
3
- interface UsePopperOptions extends PositioningProps {
4
- /**
5
- * If false, delays Popper's creation.
6
- * @default true
7
- */
8
- enabled?: boolean;
9
- }
10
- /**
11
- * Exposes Popper positioning API via React hook. Contains few important differences between an official "react-popper"
12
- * package:
13
- * - style attributes are applied directly on DOM to avoid re-renders
14
- * - refs changes and resolution is handled properly without re-renders
15
- * - contains a specific to React fix related to initial positioning when containers have components with managed focus
16
- * to avoid focus jumps
17
- */
18
- export declare function usePopper(options?: UsePopperOptions): {
19
- targetRef: React.MutableRefObject<any>;
20
- containerRef: React.MutableRefObject<any>;
21
- arrowRef: React.MutableRefObject<any>;
22
- };
23
- export {};
@@ -1,11 +0,0 @@
1
- import * as React from 'react';
2
- import * as PopperJs from '@popperjs/core';
3
- /**
4
- * A state hook that manages a popper virtual element from mouseevents.
5
- * Useful for scenarios where a component needs to be positioned by mouse click (e.g. contextmenu)
6
- * React synthetic events are not persisted by this hook
7
- *
8
- * @param initialState - initializes a user provided state similare to useState
9
- * @returns state and dispatcher for a Popper virtual element that uses native/synthetic mouse events
10
- */
11
- export declare const usePopperMouseTarget: (initialState?: PopperJs.VirtualElement | (() => PopperJs.VirtualElement) | undefined) => readonly [PopperJs.VirtualElement | undefined, (event: React.MouseEvent | MouseEvent | undefined | null) => void];
@@ -1,8 +0,0 @@
1
- import * as PopperJs from '@popperjs/core';
2
- /**
3
- * Returns the base placement value
4
- * @param placement - the popper placement (i.e. bottom-start)
5
- *
6
- * @returns bottom-start -> bottom
7
- */
8
- export declare function getBasePlacement(placement: PopperJs.Placement): PopperJs.BasePlacement;
@@ -1,6 +0,0 @@
1
- import * as PopperJs from '@popperjs/core';
2
- import type { Boundary } from '../types';
3
- /**
4
- * Allows to mimic a behavior from V1 of Popper and accept `window` and `scrollParent` as strings.
5
- */
6
- export declare function getBoundary(element: HTMLElement | null, boundary?: Boundary): PopperJs.Boundary | undefined;
@@ -1,108 +0,0 @@
1
- import * as React from 'react';
2
- declare type ReactEventResponder<E, C> = {
3
- $$typeof: Symbol | number;
4
- displayName: string;
5
- targetEventTypes: null | string[];
6
- rootEventTypes: null | string[];
7
- getInitialState: null | ((props: Object) => Object);
8
- onEvent: null | ((event: E, context: C, props: Object, state: Object) => void);
9
- onRootEvent: null | ((event: E, context: C, props: Object, state: Object) => void);
10
- onMount: null | ((context: C, props: Object, state: Object) => void);
11
- onUnmount: null | ((context: C, props: Object, state: Object) => void);
12
- };
13
- declare type ReactEventResponderInstance<E, C> = {
14
- fiber: Object;
15
- props: Object;
16
- responder: ReactEventResponder<E, C>;
17
- rootEventTypes: null | Set<string>;
18
- state: Object;
19
- };
20
- export declare type HookType = 'useState' | 'useReducer' | 'useContext' | 'useRef' | 'useEffect' | 'useLayoutEffect' | 'useCallback' | 'useMemo' | 'useImperativeHandle' | 'useDebugValue' | 'useResponder';
21
- declare type ReactProviderType<T> = {
22
- $$typeof: Symbol | number;
23
- _context: ReactContext<T>;
24
- };
25
- declare type ReactContext<T> = {
26
- $$typeof: Symbol | number;
27
- Consumer: ReactContext<T>;
28
- Provider: ReactProviderType<T>;
29
- _calculateChangedBits: ((a: T, b: T) => number) | null;
30
- _currentValue: T;
31
- _currentValue2: T;
32
- _threadCount: number;
33
- _currentRenderer?: Object | null;
34
- _currentRenderer2?: Object | null;
35
- };
36
- declare type ContextDependency<T> = {
37
- context: ReactContext<T>;
38
- observedBits: number;
39
- next: ContextDependency<any> | null;
40
- };
41
- declare enum WorkTag {
42
- FunctionComponent = 0,
43
- ClassComponent = 1,
44
- IndeterminateComponent = 2,
45
- HostRoot = 3,
46
- HostPortal = 4,
47
- HostComponent = 5,
48
- HostText = 6,
49
- Fragment = 7,
50
- Mode = 8,
51
- ContextConsumer = 9,
52
- ContextProvider = 10,
53
- ForwardRef = 11,
54
- Profiler = 12,
55
- SuspenseComponent = 13,
56
- MemoComponent = 14,
57
- SimpleMemoComponent = 15,
58
- LazyComponent = 16,
59
- IncompleteClassComponent = 17,
60
- DehydratedFragment = 18,
61
- SuspenseListComponent = 19,
62
- FundamentalComponent = 20,
63
- ScopeComponent = 21
64
- }
65
- declare type Source = {
66
- fileName: string;
67
- lineNumber: number;
68
- };
69
- declare type ExpirationTime = number;
70
- declare type Dependencies = {
71
- expirationTime: ExpirationTime;
72
- firstContext: ContextDependency<any> | null;
73
- responders: Map<ReactEventResponder<any, any>, ReactEventResponderInstance<any, any>> | null;
74
- };
75
- export declare type Fiber = {
76
- tag: WorkTag;
77
- key: null | string;
78
- elementType: any;
79
- type: any;
80
- stateNode: any;
81
- return: Fiber | null;
82
- child: Fiber | null;
83
- sibling: Fiber | null;
84
- index: number;
85
- ref: React.Ref<any>;
86
- pendingProps: any;
87
- memoizedProps: any;
88
- memoizedState: any;
89
- dependencies: Dependencies | null;
90
- nextEffect: Fiber | null;
91
- firstEffect: Fiber | null;
92
- lastEffect: Fiber | null;
93
- expirationTime: ExpirationTime;
94
- childExpirationTime: ExpirationTime;
95
- alternate: Fiber | null;
96
- actualDuration?: number;
97
- actualStartTime?: number;
98
- selfBaseDuration?: number;
99
- treeBaseDuration?: number;
100
- _debugID?: number;
101
- _debugSource?: Source | null;
102
- _debugOwner?: Fiber | null;
103
- _debugIsCurrentlyTiming?: boolean;
104
- _debugNeedsRemount?: boolean;
105
- _debugHookTypes?: HookType[] | null;
106
- };
107
- export declare function getReactFiberFromNode(elm: Node | undefined): Fiber | null;
108
- export {};
@@ -1,12 +0,0 @@
1
- /**
2
- * Returns the parent node or the host of the node argument.
3
- * @param node - DOM node.
4
- * @returns - parent DOM node.
5
- */
6
- export declare const getParentNode: (node: HTMLElement) => HTMLElement;
7
- /**
8
- * Returns the first scrollable parent of the given element.
9
- * @param node - DOM node.
10
- * @returns - the first scrollable parent.
11
- */
12
- export declare const getScrollParent: (node: Document | HTMLElement | null) => HTMLElement;
@@ -1,8 +0,0 @@
1
- export * from './getBasePlacement';
2
- export * from './getBoundary';
3
- export * from './getReactFiberFromNode';
4
- export * from './getScrollParent';
5
- export * from './mergeArrowOffset';
6
- export * from './positioningHelper';
7
- export * from './resolvePositioningShorthand';
8
- export * from './useCallbackRef';
@@ -1,10 +0,0 @@
1
- import type { Offset } from '../types';
2
- /**
3
- * Generally when adding an arrow to popper, it's necessary to offset the position of the popper by the
4
- * height of the arrow. A simple utility to merge a provided offset with an arrow height to return the final offset
5
- *
6
- * @param userOffset - The offset provided by the user
7
- * @param arrowHeight - The height of the arrow in px
8
- * @returns User offset augmented with arrow height
9
- */
10
- export declare function mergeArrowOffset(userOffset: Offset | undefined | null, arrowHeight: number): Offset;
@@ -1,7 +0,0 @@
1
- import * as PopperJs from '@popperjs/core';
2
- import type { Alignment, Offset, Position } from '../types';
3
- /**
4
- * @see positioninHelper.test.ts for expected placement values
5
- */
6
- export declare const getPlacement: (align?: Alignment | undefined, position?: Position | undefined, rtl?: boolean | undefined) => PopperJs.Placement;
7
- export declare const applyRtlToOffset: (offset: Offset | undefined) => Offset | undefined;
@@ -1,2 +0,0 @@
1
- import type { PositioningShorthand, PositioningProps } from '../types';
2
- export declare function resolvePositioningShorthand(shorthand: PositioningShorthand | undefined | null): Readonly<PositioningProps>;
@@ -1,19 +0,0 @@
1
- import * as React from 'react';
2
- /**
3
- * Creates a MutableRef with ref change callback. Is useful as React.useRef() doesn't notify you when its content
4
- * changes and mutating the .current property doesn't cause a re-render. An opt-out will be use a callback ref via
5
- * React.useState(), but it will cause re-renders always.
6
- *
7
- * https://reactjs.org/docs/hooks-reference.html#useref
8
- * https://github.com/theKashey/use-callback-ref#usecallbackref---to-replace-reactuseref
9
- *
10
- * @param initialValue - initial ref value
11
- * @param callback - a callback to run when value changes
12
- * @param skipInitialResolve - a flag to skip an initial ref report
13
- *
14
- * @example
15
- * const ref = useCallbackRef(0, (newValue, oldValue) => console.log(oldValue, '->', newValue);
16
- * ref.current = 1;
17
- * // prints 0 -> 1
18
- */
19
- export declare function useCallbackRef<T>(initialValue: T | null, callback: (newValue: T | null, lastValue: T | null) => void, skipInitialResolve?: boolean): React.MutableRefObject<T | null>;
@@ -1,64 +0,0 @@
1
- import type { GriffelStyle } from '@griffel/react';
2
- /**
3
- * Options parameter for the createArrowStyles function
4
- */
5
- export declare type CreateArrowStylesOptions = {
6
- /**
7
- * The height of the arrow from the base to the tip, in px. The base width of the arrow is always twice its height.
8
- *
9
- * This can be undefined to leave out the arrow size styles. You must then add styles created by
10
- * createArrowHeightStyles to set the arrow's size correctly. This can be useful if the arrow can be different sizes.
11
- */
12
- arrowHeight: number | undefined;
13
- /**
14
- * The borderWidth of the arrow. Should be the same borderWidth as the parent element.
15
- *
16
- * @defaultvalue 1px
17
- */
18
- borderWidth?: GriffelStyle['borderBottomWidth'];
19
- /**
20
- * The borderStyle for the arrow. Should be the same borderStyle as the parent element.
21
- *
22
- * @defaultvalue solid
23
- */
24
- borderStyle?: GriffelStyle['borderBottomStyle'];
25
- /**
26
- * The borderColor of the arrow. Should be the same borderColor as the parent element.
27
- *
28
- * @defaultvalue tokens.colorTransparentStroke
29
- */
30
- borderColor?: GriffelStyle['borderBottomColor'];
31
- };
32
- /**
33
- * Helper that creates a makeStyles rule for an arrow element.
34
- * For runtime arrow size toggling simply create extra classnames to apply to the arrow element
35
- *
36
- * ```ts
37
- * makeStyles({
38
- * arrowWithSize: createArrowStyles({ arrowHeight: 6 }),
39
- *
40
- * arrowWithoutSize: createArrowStyles({ arrowHeight: undefined }),
41
- * mediumArrow: createArrowHeightStyles(4),
42
- * smallArrow: createArrowHeightStyles(2),
43
- * })
44
- * ...
45
- *
46
- * state.arrowWithSize.className = styles.arrowWithSize;
47
- * state.arrowWithoutSize.className = mergeClasses(
48
- * styles.arrowWithoutSize,
49
- * state.smallArrow && styles.smallArrow,
50
- * state.mediumArrow && styles.mediumArrow,
51
- * )
52
- * ```
53
- */
54
- export declare function createArrowStyles(options: CreateArrowStylesOptions): GriffelStyle;
55
- /**
56
- * Creates CSS styles to size the arrow created by createArrowStyles to the given height.
57
- *
58
- * Use this when you need to create classes for several different arrow sizes. If you only need a
59
- * constant arrow size, you can pass the `arrowHeight` param to createArrowStyles instead.
60
- */
61
- export declare function createArrowHeightStyles(arrowHeight: number): {
62
- width: string;
63
- height: string;
64
- };
@@ -1,6 +0,0 @@
1
- import type { PopperVirtualElement } from './types';
2
- /**
3
- * Creates a virtual element based on the position of a click event
4
- * Can be used as a target for popper in scenarios such as context menus
5
- */
6
- export declare function createVirtualElementFromClick(nativeEvent: MouseEvent): PopperVirtualElement;
@@ -1,7 +0,0 @@
1
- export { createVirtualElementFromClick } from './createVirtualElementFromClick';
2
- export { createArrowHeightStyles, createArrowStyles } from './createArrowStyles';
3
- export type { CreateArrowStylesOptions } from './createArrowStyles';
4
- export { usePopper } from './usePopper';
5
- export { usePopperMouseTarget } from './usePopperMouseTarget';
6
- export { resolvePositioningShorthand, mergeArrowOffset } from './utils/index';
7
- export type { Alignment, AutoSize, Boundary, Offset, OffsetFunction, OffsetFunctionParam, PopperOptions, PopperRefHandle, PopperVirtualElement, Position, PositioningProps, PositioningShorthand, PositioningShorthandValue, } from './types';
@@ -1,4 +0,0 @@
1
- import { Modifier } from '@popperjs/core';
2
- export declare const isIntersectingModifier: IsIntersectingModifier;
3
- declare type IsIntersectingModifier = Modifier<'is-intersecting-modifier', never>;
4
- export {};
@@ -1,89 +0,0 @@
1
- import * as PopperJs from '@popperjs/core';
2
- import * as React from 'react';
3
- export declare type OffsetFunctionParam = {
4
- popper: PopperJs.Rect;
5
- reference: PopperJs.Rect;
6
- placement: PopperJs.Placement;
7
- };
8
- export declare type OffsetFunction = (param: OffsetFunctionParam) => [number | null | undefined, number | null | undefined];
9
- export declare type Offset = OffsetFunction | [number | null | undefined, number | null | undefined];
10
- export declare type Position = 'above' | 'below' | 'before' | 'after';
11
- export declare type Alignment = 'top' | 'bottom' | 'start' | 'end' | 'center';
12
- export declare type AutoSize = 'height' | 'height-always' | 'width' | 'width-always' | 'always' | boolean;
13
- export declare type Boundary = PopperJs.Boundary | 'scrollParent' | 'window';
14
- export declare type PopperRefHandle = {
15
- /**
16
- * Updates the position of the popper imperatively.
17
- * Useful when the position of the target changes from other factors than scrolling of window resize.
18
- */
19
- updatePosition: () => void;
20
- /**
21
- * Sets the target and updates positioning imperatively.
22
- * Useful for avoiding double renders with the target option.
23
- */
24
- setTarget: (target: HTMLElement | PopperVirtualElement) => void;
25
- };
26
- export declare type PopperVirtualElement = PopperJs.VirtualElement;
27
- export interface PopperOptions {
28
- /** Alignment for the component. Only has an effect if used with the @see position option */
29
- align?: Alignment;
30
- /** The element which will define the boundaries of the popper position for the flip behavior. */
31
- flipBoundary?: Boundary;
32
- /** The element which will define the boundaries of the popper position for the overflow behavior. */
33
- overflowBoundary?: Boundary;
34
- /**
35
- * Position for the component. Position has higher priority than align. If position is vertical ('above' | 'below')
36
- * and align is also vertical ('top' | 'bottom') or if both position and align are horizontal ('before' | 'after'
37
- * and 'start' | 'end' respectively),
38
- * then provided value for 'align' will be ignored and 'center' will be used instead.
39
- */
40
- position?: Position;
41
- /**
42
- * Enables the Popper box to position itself in 'fixed' mode (default value is position: 'absolute')
43
- * @default false
44
- */
45
- positionFixed?: boolean;
46
- /**
47
- * Lets you displace a popper element from its reference element.
48
- * This can be useful if you need to apply some margin between them or if you need to fine tune the
49
- * position according to some custom logic.
50
- */
51
- offset?: Offset;
52
- /**
53
- * Defines padding between the corner of the popup element and the arrow.
54
- * Use to prevent the arrow from overlapping a rounded corner, for example.
55
- */
56
- arrowPadding?: number;
57
- /**
58
- * Applies max-height and max-width on popper to fit it within the available space in viewport.
59
- * true enables this for both width and height when overflow happens.
60
- * 'always' applies `max-height`/`max-width` regardless of overflow.
61
- * 'height' applies `max-height` when overflow happens, and 'width' for `max-width`
62
- * `height-always` applies `max-height` regardless of overflow, and 'width-always' for always applying `max-width`
63
- */
64
- autoSize?: AutoSize;
65
- /**
66
- * Modifies position and alignment to cover the target
67
- */
68
- coverTarget?: boolean;
69
- /**
70
- * Disables automatic repositioning of the component; it will always be placed according to the values of `align` and
71
- * `position` props, regardless of the size of the component, the reference element or the viewport.
72
- */
73
- pinned?: boolean;
74
- /**
75
- * When the reference element or the viewport is outside viewport allows a popper element to be fully in viewport.
76
- * "all" enables this behavior for all axis.
77
- */
78
- unstable_disableTether?: boolean | 'all';
79
- }
80
- export interface PositioningProps extends Omit<PopperOptions, 'positionFixed' | 'unstable_disableTether'> {
81
- /** An imperative handle to Popper methods. */
82
- popperRef?: React.Ref<PopperRefHandle>;
83
- /**
84
- * Manual override for popper target. Useful for scenarios where a component accepts user prop to override target
85
- */
86
- target?: HTMLElement | PopperVirtualElement | null;
87
- }
88
- export declare type PositioningShorthandValue = 'above' | 'above-start' | 'above-end' | 'below' | 'below-start' | 'below-end' | 'before' | 'before-top' | 'before-bottom' | 'after' | 'after-top' | 'after-bottom';
89
- export declare type PositioningShorthand = PositioningProps | PositioningShorthandValue;
@@ -1,23 +0,0 @@
1
- import * as React from 'react';
2
- import type { PositioningProps } from './types';
3
- interface UsePopperOptions extends PositioningProps {
4
- /**
5
- * If false, delays Popper's creation.
6
- * @default true
7
- */
8
- enabled?: boolean;
9
- }
10
- /**
11
- * Exposes Popper positioning API via React hook. Contains few important differences between an official "react-popper"
12
- * package:
13
- * - style attributes are applied directly on DOM to avoid re-renders
14
- * - refs changes and resolution is handled properly without re-renders
15
- * - contains a specific to React fix related to initial positioning when containers have components with managed focus
16
- * to avoid focus jumps
17
- */
18
- export declare function usePopper(options?: UsePopperOptions): {
19
- targetRef: React.MutableRefObject<any>;
20
- containerRef: React.MutableRefObject<any>;
21
- arrowRef: React.MutableRefObject<any>;
22
- };
23
- export {};
@@ -1,11 +0,0 @@
1
- import * as React from 'react';
2
- import * as PopperJs from '@popperjs/core';
3
- /**
4
- * A state hook that manages a popper virtual element from mouseevents.
5
- * Useful for scenarios where a component needs to be positioned by mouse click (e.g. contextmenu)
6
- * React synthetic events are not persisted by this hook
7
- *
8
- * @param initialState - initializes a user provided state similare to useState
9
- * @returns state and dispatcher for a Popper virtual element that uses native/synthetic mouse events
10
- */
11
- export declare const usePopperMouseTarget: (initialState?: PopperJs.VirtualElement | (() => PopperJs.VirtualElement) | undefined) => readonly [PopperJs.VirtualElement | undefined, (event: React.MouseEvent | MouseEvent | undefined | null) => void];
@@ -1,8 +0,0 @@
1
- import * as PopperJs from '@popperjs/core';
2
- /**
3
- * Returns the base placement value
4
- * @param placement - the popper placement (i.e. bottom-start)
5
- *
6
- * @returns bottom-start -> bottom
7
- */
8
- export declare function getBasePlacement(placement: PopperJs.Placement): PopperJs.BasePlacement;
@@ -1,6 +0,0 @@
1
- import * as PopperJs from '@popperjs/core';
2
- import type { Boundary } from '../types';
3
- /**
4
- * Allows to mimic a behavior from V1 of Popper and accept `window` and `scrollParent` as strings.
5
- */
6
- export declare function getBoundary(element: HTMLElement | null, boundary?: Boundary): PopperJs.Boundary | undefined;
@@ -1,108 +0,0 @@
1
- import * as React from 'react';
2
- declare type ReactEventResponder<E, C> = {
3
- $$typeof: Symbol | number;
4
- displayName: string;
5
- targetEventTypes: null | string[];
6
- rootEventTypes: null | string[];
7
- getInitialState: null | ((props: Object) => Object);
8
- onEvent: null | ((event: E, context: C, props: Object, state: Object) => void);
9
- onRootEvent: null | ((event: E, context: C, props: Object, state: Object) => void);
10
- onMount: null | ((context: C, props: Object, state: Object) => void);
11
- onUnmount: null | ((context: C, props: Object, state: Object) => void);
12
- };
13
- declare type ReactEventResponderInstance<E, C> = {
14
- fiber: Object;
15
- props: Object;
16
- responder: ReactEventResponder<E, C>;
17
- rootEventTypes: null | Set<string>;
18
- state: Object;
19
- };
20
- export declare type HookType = 'useState' | 'useReducer' | 'useContext' | 'useRef' | 'useEffect' | 'useLayoutEffect' | 'useCallback' | 'useMemo' | 'useImperativeHandle' | 'useDebugValue' | 'useResponder';
21
- declare type ReactProviderType<T> = {
22
- $$typeof: Symbol | number;
23
- _context: ReactContext<T>;
24
- };
25
- declare type ReactContext<T> = {
26
- $$typeof: Symbol | number;
27
- Consumer: ReactContext<T>;
28
- Provider: ReactProviderType<T>;
29
- _calculateChangedBits: ((a: T, b: T) => number) | null;
30
- _currentValue: T;
31
- _currentValue2: T;
32
- _threadCount: number;
33
- _currentRenderer?: Object | null;
34
- _currentRenderer2?: Object | null;
35
- };
36
- declare type ContextDependency<T> = {
37
- context: ReactContext<T>;
38
- observedBits: number;
39
- next: ContextDependency<any> | null;
40
- };
41
- declare enum WorkTag {
42
- FunctionComponent = 0,
43
- ClassComponent = 1,
44
- IndeterminateComponent = 2,
45
- HostRoot = 3,
46
- HostPortal = 4,
47
- HostComponent = 5,
48
- HostText = 6,
49
- Fragment = 7,
50
- Mode = 8,
51
- ContextConsumer = 9,
52
- ContextProvider = 10,
53
- ForwardRef = 11,
54
- Profiler = 12,
55
- SuspenseComponent = 13,
56
- MemoComponent = 14,
57
- SimpleMemoComponent = 15,
58
- LazyComponent = 16,
59
- IncompleteClassComponent = 17,
60
- DehydratedFragment = 18,
61
- SuspenseListComponent = 19,
62
- FundamentalComponent = 20,
63
- ScopeComponent = 21
64
- }
65
- declare type Source = {
66
- fileName: string;
67
- lineNumber: number;
68
- };
69
- declare type ExpirationTime = number;
70
- declare type Dependencies = {
71
- expirationTime: ExpirationTime;
72
- firstContext: ContextDependency<any> | null;
73
- responders: Map<ReactEventResponder<any, any>, ReactEventResponderInstance<any, any>> | null;
74
- };
75
- export declare type Fiber = {
76
- tag: WorkTag;
77
- key: null | string;
78
- elementType: any;
79
- type: any;
80
- stateNode: any;
81
- return: Fiber | null;
82
- child: Fiber | null;
83
- sibling: Fiber | null;
84
- index: number;
85
- ref: React.Ref<any>;
86
- pendingProps: any;
87
- memoizedProps: any;
88
- memoizedState: any;
89
- dependencies: Dependencies | null;
90
- nextEffect: Fiber | null;
91
- firstEffect: Fiber | null;
92
- lastEffect: Fiber | null;
93
- expirationTime: ExpirationTime;
94
- childExpirationTime: ExpirationTime;
95
- alternate: Fiber | null;
96
- actualDuration?: number;
97
- actualStartTime?: number;
98
- selfBaseDuration?: number;
99
- treeBaseDuration?: number;
100
- _debugID?: number;
101
- _debugSource?: Source | null;
102
- _debugOwner?: Fiber | null;
103
- _debugIsCurrentlyTiming?: boolean;
104
- _debugNeedsRemount?: boolean;
105
- _debugHookTypes?: HookType[] | null;
106
- };
107
- export declare function getReactFiberFromNode(elm: Node | undefined): Fiber | null;
108
- export {};
@@ -1,12 +0,0 @@
1
- /**
2
- * Returns the parent node or the host of the node argument.
3
- * @param node - DOM node.
4
- * @returns - parent DOM node.
5
- */
6
- export declare const getParentNode: (node: HTMLElement) => HTMLElement;
7
- /**
8
- * Returns the first scrollable parent of the given element.
9
- * @param node - DOM node.
10
- * @returns - the first scrollable parent.
11
- */
12
- export declare const getScrollParent: (node: Document | HTMLElement | null) => HTMLElement;
@@ -1,8 +0,0 @@
1
- export * from './getBasePlacement';
2
- export * from './getBoundary';
3
- export * from './getReactFiberFromNode';
4
- export * from './getScrollParent';
5
- export * from './mergeArrowOffset';
6
- export * from './positioningHelper';
7
- export * from './resolvePositioningShorthand';
8
- export * from './useCallbackRef';
@@ -1,10 +0,0 @@
1
- import type { Offset } from '../types';
2
- /**
3
- * Generally when adding an arrow to popper, it's necessary to offset the position of the popper by the
4
- * height of the arrow. A simple utility to merge a provided offset with an arrow height to return the final offset
5
- *
6
- * @param userOffset - The offset provided by the user
7
- * @param arrowHeight - The height of the arrow in px
8
- * @returns User offset augmented with arrow height
9
- */
10
- export declare function mergeArrowOffset(userOffset: Offset | undefined | null, arrowHeight: number): Offset;
@@ -1,7 +0,0 @@
1
- import * as PopperJs from '@popperjs/core';
2
- import type { Alignment, Offset, Position } from '../types';
3
- /**
4
- * @see positioninHelper.test.ts for expected placement values
5
- */
6
- export declare const getPlacement: (align?: Alignment | undefined, position?: Position | undefined, rtl?: boolean | undefined) => PopperJs.Placement;
7
- export declare const applyRtlToOffset: (offset: Offset | undefined) => Offset | undefined;
@@ -1,2 +0,0 @@
1
- import type { PositioningShorthand, PositioningProps } from '../types';
2
- export declare function resolvePositioningShorthand(shorthand: PositioningShorthand | undefined | null): Readonly<PositioningProps>;
@@ -1,19 +0,0 @@
1
- import * as React from 'react';
2
- /**
3
- * Creates a MutableRef with ref change callback. Is useful as React.useRef() doesn't notify you when its content
4
- * changes and mutating the .current property doesn't cause a re-render. An opt-out will be use a callback ref via
5
- * React.useState(), but it will cause re-renders always.
6
- *
7
- * https://reactjs.org/docs/hooks-reference.html#useref
8
- * https://github.com/theKashey/use-callback-ref#usecallbackref---to-replace-reactuseref
9
- *
10
- * @param initialValue - initial ref value
11
- * @param callback - a callback to run when value changes
12
- * @param skipInitialResolve - a flag to skip an initial ref report
13
- *
14
- * @example
15
- * const ref = useCallbackRef(0, (newValue, oldValue) => console.log(oldValue, '->', newValue);
16
- * ref.current = 1;
17
- * // prints 0 -> 1
18
- */
19
- export declare function useCallbackRef<T>(initialValue: T | null, callback: (newValue: T | null, lastValue: T | null) => void, skipInitialResolve?: boolean): React.MutableRefObject<T | null>;