@fluentui/react-positioning 0.0.0-nightly-20230317-1454.1 → 0.0.0-nightly-20230321-0440.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.json +9 -9
- package/CHANGELOG.md +7 -7
- package/lib/constants.js +4 -4
- package/lib/constants.js.map +1 -1
- package/lib/createArrowStyles.js +19 -19
- package/lib/createArrowStyles.js.map +1 -1
- package/lib/createPositionManager.js +13 -13
- package/lib/createPositionManager.js.map +1 -1
- package/lib/createVirtualElementFromClick.js +2 -1
- package/lib/createVirtualElementFromClick.js.map +1 -1
- package/lib/index.js +5 -5
- package/lib/index.js.map +1 -1
- package/lib/middleware/coverTarget.js +6 -6
- package/lib/middleware/coverTarget.js.map +1 -1
- package/lib/middleware/flip.js +4 -4
- package/lib/middleware/flip.js.map +1 -1
- package/lib/middleware/index.js +6 -6
- package/lib/middleware/index.js.map +1 -1
- package/lib/middleware/intersecting.js +2 -2
- package/lib/middleware/intersecting.js.map +1 -1
- package/lib/middleware/maxSize.js +8 -8
- package/lib/middleware/maxSize.js.map +1 -1
- package/lib/middleware/offset.js +2 -2
- package/lib/middleware/offset.js.map +1 -1
- package/lib/middleware/shift.js +5 -5
- package/lib/middleware/shift.js.map +1 -1
- package/lib/types.js +1 -1
- package/lib/types.js.map +1 -1
- package/lib/usePositioning.js +26 -20
- package/lib/usePositioning.js.map +1 -1
- package/lib/usePositioningMouseTarget.js +4 -4
- package/lib/usePositioningMouseTarget.js.map +1 -1
- package/lib/utils/debounce.js +2 -1
- package/lib/utils/debounce.js.map +1 -1
- package/lib/utils/fromFloatingUIPlacement.js +10 -10
- package/lib/utils/fromFloatingUIPlacement.js.map +1 -1
- package/lib/utils/getBoundary.js +8 -8
- package/lib/utils/getBoundary.js.map +1 -1
- package/lib/utils/getFloatingUIOffset.js +2 -2
- package/lib/utils/getFloatingUIOffset.js.map +1 -1
- package/lib/utils/getReactFiberFromNode.js +2 -3
- package/lib/utils/getReactFiberFromNode.js.map +1 -1
- package/lib/utils/getScrollParent.js +10 -7
- package/lib/utils/getScrollParent.js.map +1 -1
- package/lib/utils/hasAutoFocusFilter.js +4 -3
- package/lib/utils/hasAutoFocusFilter.js.map +1 -1
- package/lib/utils/index.js +15 -15
- package/lib/utils/index.js.map +1 -1
- package/lib/utils/mergeArrowOffset.js +8 -6
- package/lib/utils/mergeArrowOffset.js.map +1 -1
- package/lib/utils/parseFloatingUIPlacement.js +3 -2
- package/lib/utils/parseFloatingUIPlacement.js.map +1 -1
- package/lib/utils/resolvePositioningShorthand.js +33 -33
- package/lib/utils/resolvePositioningShorthand.js.map +1 -1
- package/lib/utils/toFloatingUIPadding.js +3 -3
- package/lib/utils/toFloatingUIPadding.js.map +1 -1
- package/lib/utils/toFloatingUIPlacement.js +11 -11
- package/lib/utils/toFloatingUIPlacement.js.map +1 -1
- package/lib/utils/toggleScrollListener.js +4 -4
- package/lib/utils/toggleScrollListener.js.map +1 -1
- package/lib/utils/useCallbackRef.js +2 -2
- package/lib/utils/useCallbackRef.js.map +1 -1
- package/lib/utils/writeArrowUpdates.js +2 -1
- package/lib/utils/writeArrowUpdates.js.map +1 -1
- package/lib/utils/writeContainerupdates.js +8 -7
- package/lib/utils/writeContainerupdates.js.map +1 -1
- package/lib-commonjs/constants.js +7 -18
- package/lib-commonjs/constants.js.map +1 -1
- package/lib-commonjs/createArrowStyles.js +88 -60
- package/lib-commonjs/createArrowStyles.js.map +1 -1
- package/lib-commonjs/createPositionManager.js +117 -103
- package/lib-commonjs/createPositionManager.js.map +1 -1
- package/lib-commonjs/createVirtualElementFromClick.js +26 -27
- package/lib-commonjs/createVirtualElementFromClick.js.map +1 -1
- package/lib-commonjs/index.js +51 -24
- package/lib-commonjs/index.js.map +1 -1
- package/lib-commonjs/middleware/coverTarget.js +37 -34
- package/lib-commonjs/middleware/coverTarget.js.map +1 -1
- package/lib-commonjs/middleware/flip.js +38 -31
- package/lib-commonjs/middleware/flip.js.map +1 -1
- package/lib-commonjs/middleware/index.js +9 -10
- package/lib-commonjs/middleware/index.js.map +1 -1
- package/lib-commonjs/middleware/intersecting.js +22 -24
- package/lib-commonjs/middleware/intersecting.js.map +1 -1
- package/lib-commonjs/middleware/maxSize.js +40 -34
- package/lib-commonjs/middleware/maxSize.js.map +1 -1
- package/lib-commonjs/middleware/offset.js +12 -11
- package/lib-commonjs/middleware/offset.js.map +1 -1
- package/lib-commonjs/middleware/shift.js +37 -29
- package/lib-commonjs/middleware/shift.js.map +1 -1
- package/lib-commonjs/types.js +2 -5
- package/lib-commonjs/types.js.map +1 -1
- package/lib-commonjs/usePositioning.js +164 -192
- package/lib-commonjs/usePositioning.js.map +1 -1
- package/lib-commonjs/usePositioningMouseTarget.js +37 -34
- package/lib-commonjs/usePositioningMouseTarget.js.map +1 -1
- package/lib-commonjs/utils/debounce.js +21 -22
- package/lib-commonjs/utils/debounce.js.map +1 -1
- package/lib-commonjs/utils/fromFloatingUIPlacement.js +35 -30
- package/lib-commonjs/utils/fromFloatingUIPlacement.js.map +1 -1
- package/lib-commonjs/utils/getBoundary.js +22 -21
- package/lib-commonjs/utils/getBoundary.js.map +1 -1
- package/lib-commonjs/utils/getFloatingUIOffset.js +35 -23
- package/lib-commonjs/utils/getFloatingUIOffset.js.map +1 -1
- package/lib-commonjs/utils/getReactFiberFromNode.js +41 -45
- package/lib-commonjs/utils/getReactFiberFromNode.js.map +1 -1
- package/lib-commonjs/utils/getScrollParent.js +56 -50
- package/lib-commonjs/utils/getScrollParent.js.map +1 -1
- package/lib-commonjs/utils/hasAutoFocusFilter.js +17 -17
- package/lib-commonjs/utils/hasAutoFocusFilter.js.map +1 -1
- package/lib-commonjs/utils/index.js +18 -19
- package/lib-commonjs/utils/index.js.map +1 -1
- package/lib-commonjs/utils/mergeArrowOffset.js +32 -32
- package/lib-commonjs/utils/mergeArrowOffset.js.map +1 -1
- package/lib-commonjs/utils/parseFloatingUIPlacement.js +14 -15
- package/lib-commonjs/utils/parseFloatingUIPlacement.js.map +1 -1
- package/lib-commonjs/utils/resolvePositioningShorthand.js +61 -63
- package/lib-commonjs/utils/resolvePositioningShorthand.js.map +1 -1
- package/lib-commonjs/utils/toFloatingUIPadding.js +25 -23
- package/lib-commonjs/utils/toFloatingUIPadding.js.map +1 -1
- package/lib-commonjs/utils/toFloatingUIPlacement.js +33 -31
- package/lib-commonjs/utils/toFloatingUIPlacement.js.map +1 -1
- package/lib-commonjs/utils/toggleScrollListener.js +24 -20
- package/lib-commonjs/utils/toggleScrollListener.js.map +1 -1
- package/lib-commonjs/utils/useCallbackRef.js +53 -39
- package/lib-commonjs/utils/useCallbackRef.js.map +1 -1
- package/lib-commonjs/utils/writeArrowUpdates.js +24 -19
- package/lib-commonjs/utils/writeArrowUpdates.js.map +1 -1
- package/lib-commonjs/utils/writeContainerupdates.js +45 -36
- package/lib-commonjs/utils/writeContainerupdates.js.map +1 -1
- package/package.json +7 -6
- package/.swcrc +0 -39
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["getParentNode","node","nodeName","parentNode","host","getStyleComputedProperty","nodeType","window","ownerDocument","defaultView","getComputedStyle","getScrollParent","document","body","overflow","overflowX","overflowY","test","hasScrollParent","scrollParentElement"],"sources":["
|
|
1
|
+
{"version":3,"names":["getParentNode","node","nodeName","parentNode","host","getStyleComputedProperty","nodeType","window","_a","ownerDocument","defaultView","getComputedStyle","getScrollParent","document","body","overflow","overflowX","overflowY","test","hasScrollParent","scrollParentElement"],"sources":["../../../../../../../../packages/react-components/react-positioning/src/utils/getScrollParent.ts"],"sourcesContent":["/**\n * Returns the parent node or the host of the node argument.\n * @param node - DOM node.\n * @returns - parent DOM node.\n */\nexport const getParentNode = (node: HTMLElement): HTMLElement => {\n if (node.nodeName === 'HTML') {\n return node;\n }\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n return node.parentNode || (node as any).host;\n};\n\n/**\n * Returns CSS styles of the given node.\n * @param node - DOM node.\n * @returns - CSS styles.\n */\nconst getStyleComputedProperty = (node: HTMLElement): Partial<CSSStyleDeclaration> => {\n if (node.nodeType !== 1) {\n return {};\n }\n\n const window = node.ownerDocument?.defaultView;\n return window!.getComputedStyle(node, null);\n};\n\n/**\n * Returns the first scrollable parent of the given element.\n * @param node - DOM node.\n * @returns - the first scrollable parent.\n */\nexport const getScrollParent = (node: Document | HTMLElement | null): HTMLElement => {\n // Return body, `getScroll` will take care to get the correct `scrollTop` from it\n const parentNode = node && getParentNode(node as HTMLElement);\n // eslint-disable-next-line\n if (!parentNode) return document.body;\n\n switch (parentNode.nodeName) {\n case 'HTML':\n case 'BODY':\n return parentNode.ownerDocument!.body;\n case '#document':\n return (parentNode as unknown as Document).body;\n }\n\n // If any of the overflow props is defined for the node then we return it as the parent\n const { overflow, overflowX, overflowY } = getStyleComputedProperty(parentNode);\n if (/(auto|scroll|overlay)/.test(overflow! + overflowY! + overflowX)) {\n return parentNode;\n }\n\n return getScrollParent(parentNode);\n};\n\nexport const hasScrollParent = (node: Document | HTMLElement | null): boolean => {\n const scrollParentElement: HTMLElement = getScrollParent(node);\n return scrollParentElement ? scrollParentElement !== scrollParentElement.ownerDocument?.body : false;\n};\n"],"mappings":"AAAA;;;;;AAKA,OAAO,MAAMA,aAAa,GAAIC,IAAiB,IAAiB;EAC9D,IAAIA,IAAI,CAACC,QAAQ,KAAK,MAAM,EAAE;IAC5B,OAAOD,IAAI;;EAEb;EACA,OAAOA,IAAI,CAACE,UAAU,IAAKF,IAAY,CAACG,IAAI;AAC9C,CAAC;AAED;;;;;AAKA,MAAMC,wBAAwB,GAAIJ,IAAiB,IAAkC;;EACnF,IAAIA,IAAI,CAACK,QAAQ,KAAK,CAAC,EAAE;IACvB,OAAO,EAAE;;EAGX,MAAMC,MAAM,GAAG,CAAAC,EAAA,GAAAP,IAAI,CAACQ,aAAa,cAAAD,EAAA,uBAAAA,EAAA,CAAEE,WAAW;EAC9C,OAAOH,MAAO,CAACI,gBAAgB,CAACV,IAAI,EAAE,IAAI,CAAC;AAC7C,CAAC;AAED;;;;;AAKA,OAAO,MAAMW,eAAe,GAAIX,IAAmC,IAAiB;EAClF;EACA,MAAME,UAAU,GAAGF,IAAI,IAAID,aAAa,CAACC,IAAmB,CAAC;EAC7D;EACA,IAAI,CAACE,UAAU,EAAE,OAAOU,QAAQ,CAACC,IAAI;EAErC,QAAQX,UAAU,CAACD,QAAQ;IACzB,KAAK,MAAM;IACX,KAAK,MAAM;MACT,OAAOC,UAAU,CAACM,aAAc,CAACK,IAAI;IACvC,KAAK,WAAW;MACd,OAAQX,UAAkC,CAACW,IAAI;EAAC;EAGpD;EACA,MAAM;IAAEC,QAAQ;IAAEC,SAAS;IAAEC;EAAS,CAAE,GAAGZ,wBAAwB,CAACF,UAAU,CAAC;EAC/E,IAAI,uBAAuB,CAACe,IAAI,CAACH,QAAS,GAAGE,SAAU,GAAGD,SAAS,CAAC,EAAE;IACpE,OAAOb,UAAU;;EAGnB,OAAOS,eAAe,CAACT,UAAU,CAAC;AACpC,CAAC;AAED,OAAO,MAAMgB,eAAe,GAAIlB,IAAmC,IAAa;;EAC9E,MAAMmB,mBAAmB,GAAgBR,eAAe,CAACX,IAAI,CAAC;EAC9D,OAAOmB,mBAAmB,GAAGA,mBAAmB,MAAK,CAAAZ,EAAA,GAAAY,mBAAmB,CAACX,aAAa,cAAAD,EAAA,uBAAAA,EAAA,CAAEM,IAAI,IAAG,KAAK;AACtG,CAAC"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
//
|
|
2
2
|
// Dev utils to detect if nodes have "autoFocus" props.
|
|
3
3
|
//
|
|
4
|
-
import { getReactFiberFromNode } from
|
|
4
|
+
import { getReactFiberFromNode } from './getReactFiberFromNode';
|
|
5
5
|
/**
|
|
6
6
|
* Detects if a passed HTML node has "autoFocus" prop on a React's fiber. Is needed as React handles autofocus behavior
|
|
7
7
|
* in React DOM and will not pass "autoFocus" to an actual HTML.
|
|
@@ -9,10 +9,11 @@ import { getReactFiberFromNode } from "./getReactFiberFromNode";
|
|
|
9
9
|
* @param node
|
|
10
10
|
*/
|
|
11
11
|
function hasAutofocusProp(node) {
|
|
12
|
+
var _a;
|
|
12
13
|
// https://github.com/facebook/react/blob/848bb2426e44606e0a55dfe44c7b3ece33772485/packages/react-dom/src/client/ReactDOMHostConfig.js#L157-L166
|
|
13
|
-
const isAutoFocusableElement = node.nodeName ===
|
|
14
|
+
const isAutoFocusableElement = node.nodeName === 'BUTTON' || node.nodeName === 'INPUT' || node.nodeName === 'SELECT' || node.nodeName === 'TEXTAREA';
|
|
14
15
|
if (isAutoFocusableElement) {
|
|
15
|
-
return !!getReactFiberFromNode(node)
|
|
16
|
+
return !!((_a = getReactFiberFromNode(node)) === null || _a === void 0 ? void 0 : _a.pendingProps.autoFocus);
|
|
16
17
|
}
|
|
17
18
|
return false;
|
|
18
19
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["getReactFiberFromNode","hasAutofocusProp","node","isAutoFocusableElement","nodeName","pendingProps","autoFocus","hasAutofocusFilter","NodeFilter","FILTER_ACCEPT","FILTER_SKIP"],"sources":["
|
|
1
|
+
{"version":3,"names":["getReactFiberFromNode","hasAutofocusProp","node","isAutoFocusableElement","nodeName","_a","pendingProps","autoFocus","hasAutofocusFilter","NodeFilter","FILTER_ACCEPT","FILTER_SKIP"],"sources":["../../../../../../../../packages/react-components/react-positioning/src/utils/hasAutoFocusFilter.ts"],"sourcesContent":["//\n// Dev utils to detect if nodes have \"autoFocus\" props.\n//\n\nimport { getReactFiberFromNode } from './getReactFiberFromNode';\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 *\n * @param node\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\nexport function hasAutofocusFilter(node: Node) {\n return hasAutofocusProp(node) ? NodeFilter.FILTER_ACCEPT : NodeFilter.FILTER_SKIP;\n}\n"],"mappings":"AAAA;AACA;AACA;AAEA,SAASA,qBAAqB,QAAQ,yBAAyB;AAE/D;;;;;;AAMA,SAASC,gBAAgBA,CAACC,IAAU;;EAClC;EACA,MAAMC,sBAAsB,GAC1BD,IAAI,CAACE,QAAQ,KAAK,QAAQ,IAC1BF,IAAI,CAACE,QAAQ,KAAK,OAAO,IACzBF,IAAI,CAACE,QAAQ,KAAK,QAAQ,IAC1BF,IAAI,CAACE,QAAQ,KAAK,UAAU;EAE9B,IAAID,sBAAsB,EAAE;IAC1B,OAAO,CAAC,EAAC,CAAAE,EAAA,GAAAL,qBAAqB,CAACE,IAAI,CAAC,cAAAG,EAAA,uBAAAA,EAAA,CAAEC,YAAY,CAACC,SAAS;;EAG9D,OAAO,KAAK;AACd;AAEA,OAAM,SAAUC,kBAAkBA,CAACN,IAAU;EAC3C,OAAOD,gBAAgB,CAACC,IAAI,CAAC,GAAGO,UAAU,CAACC,aAAa,GAAGD,UAAU,CAACE,WAAW;AACnF"}
|
package/lib/utils/index.js
CHANGED
|
@@ -1,16 +1,16 @@
|
|
|
1
|
-
export * from
|
|
2
|
-
export * from
|
|
3
|
-
export * from
|
|
4
|
-
export * from
|
|
5
|
-
export * from
|
|
6
|
-
export * from
|
|
7
|
-
export * from
|
|
8
|
-
export * from
|
|
9
|
-
export * from
|
|
10
|
-
export * from
|
|
11
|
-
export * from
|
|
12
|
-
export * from
|
|
13
|
-
export * from
|
|
14
|
-
export * from
|
|
15
|
-
export * from
|
|
1
|
+
export * from './parseFloatingUIPlacement';
|
|
2
|
+
export * from './getBoundary';
|
|
3
|
+
export * from './getReactFiberFromNode';
|
|
4
|
+
export * from './getScrollParent';
|
|
5
|
+
export * from './mergeArrowOffset';
|
|
6
|
+
export * from './toFloatingUIPadding';
|
|
7
|
+
export * from './toFloatingUIPlacement';
|
|
8
|
+
export * from './fromFloatingUIPlacement';
|
|
9
|
+
export * from './resolvePositioningShorthand';
|
|
10
|
+
export * from './useCallbackRef';
|
|
11
|
+
export * from './debounce';
|
|
12
|
+
export * from './toggleScrollListener';
|
|
13
|
+
export * from './hasAutoFocusFilter';
|
|
14
|
+
export * from './writeArrowUpdates';
|
|
15
|
+
export * from './writeContainerupdates';
|
|
16
16
|
//# sourceMappingURL=index.js.map
|
package/lib/utils/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../../../packages/react-components/react-positioning/src/utils/index.ts"],"names":[],"mappings":"AAAA,cAAc,4BAA4B,CAAC;AAC3C,cAAc,eAAe,CAAC;AAC9B,cAAc,yBAAyB,CAAC;AACxC,cAAc,mBAAmB,CAAC;AAClC,cAAc,oBAAoB,CAAC;AACnC,cAAc,uBAAuB,CAAC;AACtC,cAAc,yBAAyB,CAAC;AACxC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,+BAA+B,CAAC;AAC9C,cAAc,kBAAkB,CAAC;AACjC,cAAc,YAAY,CAAC;AAC3B,cAAc,wBAAwB,CAAC;AACvC,cAAc,sBAAsB,CAAC;AACrC,cAAc,qBAAqB,CAAC;AACpC,cAAc,yBAAyB,CAAC","sourcesContent":["export * from './parseFloatingUIPlacement';\nexport * from './getBoundary';\nexport * from './getReactFiberFromNode';\nexport * from './getScrollParent';\nexport * from './mergeArrowOffset';\nexport * from './toFloatingUIPadding';\nexport * from './toFloatingUIPlacement';\nexport * from './fromFloatingUIPlacement';\nexport * from './resolvePositioningShorthand';\nexport * from './useCallbackRef';\nexport * from './debounce';\nexport * from './toggleScrollListener';\nexport * from './hasAutoFocusFilter';\nexport * from './writeArrowUpdates';\nexport * from './writeContainerupdates';\n"]}
|
|
@@ -6,14 +6,15 @@
|
|
|
6
6
|
* @param userOffset - The offset provided by the user
|
|
7
7
|
* @param arrowHeight - The height of the arrow in px
|
|
8
8
|
* @returns User offset augmented with arrow height
|
|
9
|
-
*/
|
|
10
|
-
|
|
9
|
+
*/
|
|
10
|
+
export function mergeArrowOffset(userOffset, arrowHeight) {
|
|
11
|
+
if (typeof userOffset === 'number') {
|
|
11
12
|
return addArrowOffset(userOffset, arrowHeight);
|
|
12
13
|
}
|
|
13
|
-
if (typeof userOffset ===
|
|
14
|
+
if (typeof userOffset === 'object' && userOffset !== null) {
|
|
14
15
|
return addArrowOffset(userOffset, arrowHeight);
|
|
15
16
|
}
|
|
16
|
-
if (typeof userOffset ===
|
|
17
|
+
if (typeof userOffset === 'function') {
|
|
17
18
|
return offsetParams => {
|
|
18
19
|
const offset = userOffset(offsetParams);
|
|
19
20
|
return addArrowOffset(offset, arrowHeight);
|
|
@@ -24,14 +25,15 @@
|
|
|
24
25
|
};
|
|
25
26
|
}
|
|
26
27
|
const addArrowOffset = (offset, arrowHeight) => {
|
|
27
|
-
|
|
28
|
+
var _a;
|
|
29
|
+
if (typeof offset === 'number') {
|
|
28
30
|
return {
|
|
29
31
|
mainAxis: offset + arrowHeight
|
|
30
32
|
};
|
|
31
33
|
}
|
|
32
34
|
return {
|
|
33
35
|
...offset,
|
|
34
|
-
mainAxis: (offset.mainAxis
|
|
36
|
+
mainAxis: ((_a = offset.mainAxis) !== null && _a !== void 0 ? _a : 0) + arrowHeight
|
|
35
37
|
};
|
|
36
38
|
};
|
|
37
39
|
//# sourceMappingURL=mergeArrowOffset.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["mergeArrowOffset","userOffset","arrowHeight","addArrowOffset","offsetParams","offset","mainAxis"],"sources":["
|
|
1
|
+
{"version":3,"names":["mergeArrowOffset","userOffset","arrowHeight","addArrowOffset","offsetParams","offset","mainAxis","_a"],"sources":["../../../../../../../../packages/react-components/react-positioning/src/utils/mergeArrowOffset.ts"],"sourcesContent":["import type { Offset, OffsetObject } from '../types';\n\n/**\n * Generally when adding an arrow to popper, it's necessary to offset the position of the popper by the\n * height of the arrow. A simple utility to merge a provided offset with an arrow height to return the final offset\n *\n * @internal\n * @param userOffset - The offset provided by the user\n * @param arrowHeight - The height of the arrow in px\n * @returns User offset augmented with arrow height\n */\nexport function mergeArrowOffset(userOffset: Offset | undefined | null, arrowHeight: number): Offset {\n if (typeof userOffset === 'number') {\n return addArrowOffset(userOffset, arrowHeight);\n }\n\n if (typeof userOffset === 'object' && userOffset !== null) {\n return addArrowOffset(userOffset, arrowHeight);\n }\n\n if (typeof userOffset === 'function') {\n return offsetParams => {\n const offset = userOffset(offsetParams);\n return addArrowOffset(offset, arrowHeight);\n };\n }\n\n return { mainAxis: arrowHeight };\n}\n\nconst addArrowOffset = (offset: OffsetObject | number, arrowHeight: number): OffsetObject => {\n if (typeof offset === 'number') {\n return { mainAxis: offset + arrowHeight };\n }\n\n return { ...offset, mainAxis: (offset.mainAxis ?? 0) + arrowHeight };\n};\n"],"mappings":"AAEA;;;;;;;;;AASA,OAAM,SAAUA,gBAAgBA,CAACC,UAAqC,EAAEC,WAAmB;EACzF,IAAI,OAAOD,UAAU,KAAK,QAAQ,EAAE;IAClC,OAAOE,cAAc,CAACF,UAAU,EAAEC,WAAW,CAAC;;EAGhD,IAAI,OAAOD,UAAU,KAAK,QAAQ,IAAIA,UAAU,KAAK,IAAI,EAAE;IACzD,OAAOE,cAAc,CAACF,UAAU,EAAEC,WAAW,CAAC;;EAGhD,IAAI,OAAOD,UAAU,KAAK,UAAU,EAAE;IACpC,OAAOG,YAAY,IAAG;MACpB,MAAMC,MAAM,GAAGJ,UAAU,CAACG,YAAY,CAAC;MACvC,OAAOD,cAAc,CAACE,MAAM,EAAEH,WAAW,CAAC;IAC5C,CAAC;;EAGH,OAAO;IAAEI,QAAQ,EAAEJ;EAAW,CAAE;AAClC;AAEA,MAAMC,cAAc,GAAGA,CAACE,MAA6B,EAAEH,WAAmB,KAAkB;;EAC1F,IAAI,OAAOG,MAAM,KAAK,QAAQ,EAAE;IAC9B,OAAO;MAAEC,QAAQ,EAAED,MAAM,GAAGH;IAAW,CAAE;;EAG3C,OAAO;IAAE,GAAGG,MAAM;IAAEC,QAAQ,EAAE,CAAC,CAAAC,EAAA,GAAAF,MAAM,CAACC,QAAQ,cAAAC,EAAA,cAAAA,EAAA,GAAI,CAAC,IAAIL;EAAW,CAAE;AACtE,CAAC"}
|
|
@@ -3,8 +3,9 @@
|
|
|
3
3
|
* @param placement - the floating ui placement (i.e. bottom-start)
|
|
4
4
|
*
|
|
5
5
|
* @returns side and alignment components of the placement
|
|
6
|
-
*/
|
|
7
|
-
|
|
6
|
+
*/
|
|
7
|
+
export function parseFloatingUIPlacement(placement) {
|
|
8
|
+
const tokens = placement.split('-');
|
|
8
9
|
return {
|
|
9
10
|
side: tokens[0],
|
|
10
11
|
alignment: tokens[1]
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["parseFloatingUIPlacement","placement","tokens","split","side","alignment"],"sources":["
|
|
1
|
+
{"version":3,"names":["parseFloatingUIPlacement","placement","tokens","split","side","alignment"],"sources":["../../../../../../../../packages/react-components/react-positioning/src/utils/parseFloatingUIPlacement.ts"],"sourcesContent":["import type { Side, Placement, Alignment } from '@floating-ui/dom';\n\n/**\n * Parses Floating UI placement and returns the different components\n * @param placement - the floating ui placement (i.e. bottom-start)\n *\n * @returns side and alignment components of the placement\n */\nexport function parseFloatingUIPlacement(placement: Placement): { side: Side; alignment: Alignment } {\n const tokens = placement.split('-');\n return {\n side: tokens[0] as Side,\n alignment: tokens[1] as Alignment,\n };\n}\n"],"mappings":"AAEA;;;;;;AAMA,OAAM,SAAUA,wBAAwBA,CAACC,SAAoB;EAC3D,MAAMC,MAAM,GAAGD,SAAS,CAACE,KAAK,CAAC,GAAG,CAAC;EACnC,OAAO;IACLC,IAAI,EAAEF,MAAM,CAAC,CAAC,CAAS;IACvBG,SAAS,EAAEH,MAAM,CAAC,CAAC;GACpB;AACH"}
|
|
@@ -1,59 +1,59 @@
|
|
|
1
1
|
// Look up table for shorthand to avoid parsing strings
|
|
2
2
|
const shorthandLookup = {
|
|
3
3
|
above: {
|
|
4
|
-
position:
|
|
5
|
-
align:
|
|
4
|
+
position: 'above',
|
|
5
|
+
align: 'center'
|
|
6
6
|
},
|
|
7
|
-
|
|
8
|
-
position:
|
|
9
|
-
align:
|
|
7
|
+
'above-start': {
|
|
8
|
+
position: 'above',
|
|
9
|
+
align: 'start'
|
|
10
10
|
},
|
|
11
|
-
|
|
12
|
-
position:
|
|
13
|
-
align:
|
|
11
|
+
'above-end': {
|
|
12
|
+
position: 'above',
|
|
13
|
+
align: 'end'
|
|
14
14
|
},
|
|
15
15
|
below: {
|
|
16
|
-
position:
|
|
17
|
-
align:
|
|
16
|
+
position: 'below',
|
|
17
|
+
align: 'center'
|
|
18
18
|
},
|
|
19
|
-
|
|
20
|
-
position:
|
|
21
|
-
align:
|
|
19
|
+
'below-start': {
|
|
20
|
+
position: 'below',
|
|
21
|
+
align: 'start'
|
|
22
22
|
},
|
|
23
|
-
|
|
24
|
-
position:
|
|
25
|
-
align:
|
|
23
|
+
'below-end': {
|
|
24
|
+
position: 'below',
|
|
25
|
+
align: 'end'
|
|
26
26
|
},
|
|
27
27
|
before: {
|
|
28
|
-
position:
|
|
29
|
-
align:
|
|
28
|
+
position: 'before',
|
|
29
|
+
align: 'center'
|
|
30
30
|
},
|
|
31
|
-
|
|
32
|
-
position:
|
|
33
|
-
align:
|
|
31
|
+
'before-top': {
|
|
32
|
+
position: 'before',
|
|
33
|
+
align: 'top'
|
|
34
34
|
},
|
|
35
|
-
|
|
36
|
-
position:
|
|
37
|
-
align:
|
|
35
|
+
'before-bottom': {
|
|
36
|
+
position: 'before',
|
|
37
|
+
align: 'bottom'
|
|
38
38
|
},
|
|
39
39
|
after: {
|
|
40
|
-
position:
|
|
41
|
-
align:
|
|
40
|
+
position: 'after',
|
|
41
|
+
align: 'center'
|
|
42
42
|
},
|
|
43
|
-
|
|
44
|
-
position:
|
|
45
|
-
align:
|
|
43
|
+
'after-top': {
|
|
44
|
+
position: 'after',
|
|
45
|
+
align: 'top'
|
|
46
46
|
},
|
|
47
|
-
|
|
48
|
-
position:
|
|
49
|
-
align:
|
|
47
|
+
'after-bottom': {
|
|
48
|
+
position: 'after',
|
|
49
|
+
align: 'bottom'
|
|
50
50
|
}
|
|
51
51
|
};
|
|
52
52
|
export function resolvePositioningShorthand(shorthand) {
|
|
53
53
|
if (shorthand === undefined || shorthand === null) {
|
|
54
54
|
return {};
|
|
55
55
|
}
|
|
56
|
-
if (typeof shorthand ===
|
|
56
|
+
if (typeof shorthand === 'string') {
|
|
57
57
|
return shorthandLookup[shorthand];
|
|
58
58
|
}
|
|
59
59
|
return shorthand;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["shorthandLookup","above","position","align","below","before","after","resolvePositioningShorthand","shorthand","undefined"],"sources":["
|
|
1
|
+
{"version":3,"names":["shorthandLookup","above","position","align","below","before","after","resolvePositioningShorthand","shorthand","undefined"],"sources":["../../../../../../../../packages/react-components/react-positioning/src/utils/resolvePositioningShorthand.ts"],"sourcesContent":["import type { PositioningShorthand, PositioningShorthandValue, PositioningProps } from '../types';\n\n// Look up table for shorthand to avoid parsing strings\nconst shorthandLookup: Record<PositioningShorthandValue, Pick<PositioningProps, 'position' | 'align'>> = {\n above: { position: 'above', align: 'center' },\n 'above-start': { position: 'above', align: 'start' },\n 'above-end': { position: 'above', align: 'end' },\n below: { position: 'below', align: 'center' },\n 'below-start': { position: 'below', align: 'start' },\n 'below-end': { position: 'below', align: 'end' },\n before: { position: 'before', align: 'center' },\n 'before-top': { position: 'before', align: 'top' },\n 'before-bottom': { position: 'before', align: 'bottom' },\n after: { position: 'after', align: 'center' },\n 'after-top': { position: 'after', align: 'top' },\n 'after-bottom': { position: 'after', align: 'bottom' },\n};\n\nexport function resolvePositioningShorthand(\n shorthand: PositioningShorthand | undefined | null,\n): Readonly<PositioningProps> {\n if (shorthand === undefined || shorthand === null) {\n return {};\n }\n\n if (typeof shorthand === 'string') {\n return shorthandLookup[shorthand];\n }\n\n return shorthand as Readonly<PositioningProps>;\n}\n"],"mappings":"AAEA;AACA,MAAMA,eAAe,GAAoF;EACvGC,KAAK,EAAE;IAAEC,QAAQ,EAAE,OAAO;IAAEC,KAAK,EAAE;EAAQ,CAAE;EAC7C,aAAa,EAAE;IAAED,QAAQ,EAAE,OAAO;IAAEC,KAAK,EAAE;EAAO,CAAE;EACpD,WAAW,EAAE;IAAED,QAAQ,EAAE,OAAO;IAAEC,KAAK,EAAE;EAAK,CAAE;EAChDC,KAAK,EAAE;IAAEF,QAAQ,EAAE,OAAO;IAAEC,KAAK,EAAE;EAAQ,CAAE;EAC7C,aAAa,EAAE;IAAED,QAAQ,EAAE,OAAO;IAAEC,KAAK,EAAE;EAAO,CAAE;EACpD,WAAW,EAAE;IAAED,QAAQ,EAAE,OAAO;IAAEC,KAAK,EAAE;EAAK,CAAE;EAChDE,MAAM,EAAE;IAAEH,QAAQ,EAAE,QAAQ;IAAEC,KAAK,EAAE;EAAQ,CAAE;EAC/C,YAAY,EAAE;IAAED,QAAQ,EAAE,QAAQ;IAAEC,KAAK,EAAE;EAAK,CAAE;EAClD,eAAe,EAAE;IAAED,QAAQ,EAAE,QAAQ;IAAEC,KAAK,EAAE;EAAQ,CAAE;EACxDG,KAAK,EAAE;IAAEJ,QAAQ,EAAE,OAAO;IAAEC,KAAK,EAAE;EAAQ,CAAE;EAC7C,WAAW,EAAE;IAAED,QAAQ,EAAE,OAAO;IAAEC,KAAK,EAAE;EAAK,CAAE;EAChD,cAAc,EAAE;IAAED,QAAQ,EAAE,OAAO;IAAEC,KAAK,EAAE;EAAQ;CACrD;AAED,OAAM,SAAUI,2BAA2BA,CACzCC,SAAkD;EAElD,IAAIA,SAAS,KAAKC,SAAS,IAAID,SAAS,KAAK,IAAI,EAAE;IACjD,OAAO,EAAE;;EAGX,IAAI,OAAOA,SAAS,KAAK,QAAQ,EAAE;IACjC,OAAOR,eAAe,CAACQ,SAAS,CAAC;;EAGnC,OAAOA,SAAuC;AAChD"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
export function toFloatingUIPadding(padding, isRtl) {
|
|
2
|
-
if (typeof padding ===
|
|
2
|
+
if (typeof padding === 'number') {
|
|
3
3
|
return padding;
|
|
4
4
|
}
|
|
5
5
|
const {
|
|
@@ -8,8 +8,8 @@ export function toFloatingUIPadding(padding, isRtl) {
|
|
|
8
8
|
...verticalPadding
|
|
9
9
|
} = padding;
|
|
10
10
|
const paddingObject = verticalPadding;
|
|
11
|
-
const left = isRtl ?
|
|
12
|
-
const right = isRtl ?
|
|
11
|
+
const left = isRtl ? 'end' : 'start';
|
|
12
|
+
const right = isRtl ? 'start' : 'end';
|
|
13
13
|
// assign properties explicitly since undefined values are actually handled by floating UI
|
|
14
14
|
// TODO create floating UI issue
|
|
15
15
|
if (padding[left]) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["toFloatingUIPadding","padding","isRtl","start","end","verticalPadding","paddingObject","left","right"],"sources":["
|
|
1
|
+
{"version":3,"names":["toFloatingUIPadding","padding","isRtl","start","end","verticalPadding","paddingObject","left","right"],"sources":["../../../../../../../../packages/react-components/react-positioning/src/utils/toFloatingUIPadding.ts"],"sourcesContent":["import type { SideObject } from '@floating-ui/dom';\nimport { PositioningOptions } from '../types';\n\nexport function toFloatingUIPadding(\n padding: NonNullable<PositioningOptions['overflowBoundaryPadding']>,\n isRtl: boolean,\n): number | Partial<SideObject> {\n if (typeof padding === 'number') {\n return padding;\n }\n\n const { start, end, ...verticalPadding } = padding;\n\n const paddingObject: Partial<SideObject> = verticalPadding;\n\n const left = isRtl ? 'end' : 'start';\n const right = isRtl ? 'start' : 'end';\n\n // assign properties explicitly since undefined values are actually handled by floating UI\n // TODO create floating UI issue\n if (padding[left]) {\n paddingObject.left = padding[left];\n }\n\n if (padding[right]) {\n paddingObject.right = padding[right];\n }\n\n return paddingObject;\n}\n"],"mappings":"AAGA,OAAM,SAAUA,mBAAmBA,CACjCC,OAAmE,EACnEC,KAAc;EAEd,IAAI,OAAOD,OAAO,KAAK,QAAQ,EAAE;IAC/B,OAAOA,OAAO;;EAGhB,MAAM;IAAEE,KAAK;IAAEC,GAAG;IAAE,GAAGC;EAAe,CAAE,GAAGJ,OAAO;EAElD,MAAMK,aAAa,GAAwBD,eAAe;EAE1D,MAAME,IAAI,GAAGL,KAAK,GAAG,KAAK,GAAG,OAAO;EACpC,MAAMM,KAAK,GAAGN,KAAK,GAAG,OAAO,GAAG,KAAK;EAErC;EACA;EACA,IAAID,OAAO,CAACM,IAAI,CAAC,EAAE;IACjBD,aAAa,CAACC,IAAI,GAAGN,OAAO,CAACM,IAAI,CAAC;;EAGpC,IAAIN,OAAO,CAACO,KAAK,CAAC,EAAE;IAClBF,aAAa,CAACE,KAAK,GAAGP,OAAO,CAACO,KAAK,CAAC;;EAGtC,OAAOF,aAAa;AACtB"}
|
|
@@ -1,21 +1,21 @@
|
|
|
1
1
|
const getPositionMap = rtl => ({
|
|
2
|
-
above:
|
|
3
|
-
below:
|
|
4
|
-
before: rtl ?
|
|
5
|
-
after: rtl ?
|
|
2
|
+
above: 'top',
|
|
3
|
+
below: 'bottom',
|
|
4
|
+
before: rtl ? 'right' : 'left',
|
|
5
|
+
after: rtl ? 'left' : 'right'
|
|
6
6
|
});
|
|
7
7
|
// Floating UI automatically flips alignment
|
|
8
8
|
// https://github.com/floating-ui/floating-ui/issues/1563
|
|
9
9
|
const getAlignmentMap = () => ({
|
|
10
|
-
start:
|
|
11
|
-
end:
|
|
12
|
-
top:
|
|
13
|
-
bottom:
|
|
10
|
+
start: 'start',
|
|
11
|
+
end: 'end',
|
|
12
|
+
top: 'start',
|
|
13
|
+
bottom: 'end',
|
|
14
14
|
center: undefined
|
|
15
15
|
});
|
|
16
16
|
const shouldAlignToCenter = (p, a) => {
|
|
17
|
-
const positionedVertically = p ===
|
|
18
|
-
const alignedVertically = a ===
|
|
17
|
+
const positionedVertically = p === 'above' || p === 'below';
|
|
18
|
+
const alignedVertically = a === 'top' || a === 'bottom';
|
|
19
19
|
return positionedVertically && alignedVertically || !positionedVertically && !alignedVertically;
|
|
20
20
|
};
|
|
21
21
|
/**
|
|
@@ -23,7 +23,7 @@ const shouldAlignToCenter = (p, a) => {
|
|
|
23
23
|
* @see positioningHelper.test.ts for expected placement values
|
|
24
24
|
*/
|
|
25
25
|
export const toFloatingUIPlacement = (align, position, rtl) => {
|
|
26
|
-
const alignment = shouldAlignToCenter(position, align) ?
|
|
26
|
+
const alignment = shouldAlignToCenter(position, align) ? 'center' : align;
|
|
27
27
|
const computedPosition = position && getPositionMap(rtl)[position];
|
|
28
28
|
const computedAlignment = alignment && getAlignmentMap()[alignment];
|
|
29
29
|
if (computedPosition && computedAlignment) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["getPositionMap","rtl","above","below","before","after","getAlignmentMap","start","end","top","bottom","center","undefined","shouldAlignToCenter","p","a","positionedVertically","alignedVertically","toFloatingUIPlacement","align","position","alignment","computedPosition","computedAlignment"],"sources":["
|
|
1
|
+
{"version":3,"names":["getPositionMap","rtl","above","below","before","after","getAlignmentMap","start","end","top","bottom","center","undefined","shouldAlignToCenter","p","a","positionedVertically","alignedVertically","toFloatingUIPlacement","align","position","alignment","computedPosition","computedAlignment"],"sources":["../../../../../../../../packages/react-components/react-positioning/src/utils/toFloatingUIPlacement.ts"],"sourcesContent":["import type { Placement, Side, Alignment as FloatingUIAlignment } from '@floating-ui/dom';\nimport type { Alignment, Position } from '../types';\n\ntype PlacementPosition = Side;\ntype PlacementAlign = FloatingUIAlignment;\n\nconst getPositionMap = (rtl?: boolean): Record<Position, PlacementPosition> => ({\n above: 'top',\n below: 'bottom',\n before: rtl ? 'right' : 'left',\n after: rtl ? 'left' : 'right',\n});\n\n// Floating UI automatically flips alignment\n// https://github.com/floating-ui/floating-ui/issues/1563\nconst getAlignmentMap = (): Record<Alignment, PlacementAlign | undefined> => ({\n start: 'start',\n end: 'end',\n top: 'start',\n bottom: 'end',\n center: undefined,\n});\n\nconst shouldAlignToCenter = (p?: Position, a?: Alignment): boolean => {\n const positionedVertically = p === 'above' || p === 'below';\n const alignedVertically = a === 'top' || a === 'bottom';\n\n return (positionedVertically && alignedVertically) || (!positionedVertically && !alignedVertically);\n};\n\n/**\n * Maps internal positioning values to Floating UI placement\n * @see positioningHelper.test.ts for expected placement values\n */\nexport const toFloatingUIPlacement = (align?: Alignment, position?: Position, rtl?: boolean): Placement | undefined => {\n const alignment = shouldAlignToCenter(position, align) ? 'center' : align;\n\n const computedPosition = position && getPositionMap(rtl)[position];\n const computedAlignment = alignment && getAlignmentMap()[alignment];\n\n if (computedPosition && computedAlignment) {\n return `${computedPosition}-${computedAlignment}` as Placement;\n }\n\n return computedPosition;\n};\n"],"mappings":"AAMA,MAAMA,cAAc,GAAIC,GAAa,KAA2C;EAC9EC,KAAK,EAAE,KAAK;EACZC,KAAK,EAAE,QAAQ;EACfC,MAAM,EAAEH,GAAG,GAAG,OAAO,GAAG,MAAM;EAC9BI,KAAK,EAAEJ,GAAG,GAAG,MAAM,GAAG;CACvB,CAAC;AAEF;AACA;AACA,MAAMK,eAAe,GAAGA,CAAA,MAAsD;EAC5EC,KAAK,EAAE,OAAO;EACdC,GAAG,EAAE,KAAK;EACVC,GAAG,EAAE,OAAO;EACZC,MAAM,EAAE,KAAK;EACbC,MAAM,EAAEC;CACT,CAAC;AAEF,MAAMC,mBAAmB,GAAGA,CAACC,CAAY,EAAEC,CAAa,KAAa;EACnE,MAAMC,oBAAoB,GAAGF,CAAC,KAAK,OAAO,IAAIA,CAAC,KAAK,OAAO;EAC3D,MAAMG,iBAAiB,GAAGF,CAAC,KAAK,KAAK,IAAIA,CAAC,KAAK,QAAQ;EAEvD,OAAQC,oBAAoB,IAAIC,iBAAiB,IAAM,CAACD,oBAAoB,IAAI,CAACC,iBAAkB;AACrG,CAAC;AAED;;;;AAIA,OAAO,MAAMC,qBAAqB,GAAGA,CAACC,KAAiB,EAAEC,QAAmB,EAAEnB,GAAa,KAA2B;EACpH,MAAMoB,SAAS,GAAGR,mBAAmB,CAACO,QAAQ,EAAED,KAAK,CAAC,GAAG,QAAQ,GAAGA,KAAK;EAEzE,MAAMG,gBAAgB,GAAGF,QAAQ,IAAIpB,cAAc,CAACC,GAAG,CAAC,CAACmB,QAAQ,CAAC;EAClE,MAAMG,iBAAiB,GAAGF,SAAS,IAAIf,eAAe,EAAE,CAACe,SAAS,CAAC;EAEnE,IAAIC,gBAAgB,IAAIC,iBAAiB,EAAE;IACzC,OAAO,GAAGD,gBAAgB,IAAIC,iBAAiB,EAAe;;EAGhE,OAAOD,gBAAgB;AACzB,CAAC"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { isHTMLElement } from
|
|
2
|
-
import { getScrollParent } from
|
|
1
|
+
import { isHTMLElement } from '@fluentui/react-utilities';
|
|
2
|
+
import { getScrollParent } from './getScrollParent';
|
|
3
3
|
/**
|
|
4
4
|
* Toggles event listeners for scroll parent.
|
|
5
5
|
* Cleans up the event listeners for the previous element and adds them for the new scroll parent.
|
|
@@ -12,11 +12,11 @@ export function toggleScrollListener(next, prev, handler) {
|
|
|
12
12
|
}
|
|
13
13
|
if (isHTMLElement(prev)) {
|
|
14
14
|
const prevScrollParent = getScrollParent(prev);
|
|
15
|
-
prevScrollParent.removeEventListener(
|
|
15
|
+
prevScrollParent.removeEventListener('scroll', handler);
|
|
16
16
|
}
|
|
17
17
|
if (isHTMLElement(next)) {
|
|
18
18
|
const scrollParent = getScrollParent(next);
|
|
19
|
-
scrollParent.addEventListener(
|
|
19
|
+
scrollParent.addEventListener('scroll', handler);
|
|
20
20
|
}
|
|
21
21
|
}
|
|
22
22
|
//# sourceMappingURL=toggleScrollListener.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["isHTMLElement","getScrollParent","toggleScrollListener","next","prev","handler","prevScrollParent","removeEventListener","scrollParent","addEventListener"],"sources":["
|
|
1
|
+
{"version":3,"names":["isHTMLElement","getScrollParent","toggleScrollListener","next","prev","handler","prevScrollParent","removeEventListener","scrollParent","addEventListener"],"sources":["../../../../../../../../packages/react-components/react-positioning/src/utils/toggleScrollListener.ts"],"sourcesContent":["import { isHTMLElement } from '@fluentui/react-utilities';\nimport type { PositioningVirtualElement } from '../types';\nimport { getScrollParent } from './getScrollParent';\n\n/**\n * Toggles event listeners for scroll parent.\n * Cleans up the event listeners for the previous element and adds them for the new scroll parent.\n * @param next Next element\n * @param prev Previous element\n */\nexport function toggleScrollListener(\n next: HTMLElement | PositioningVirtualElement | null,\n prev: HTMLElement | PositioningVirtualElement | null,\n handler: EventListener,\n) {\n if (next === prev) {\n return;\n }\n\n if (isHTMLElement(prev)) {\n const prevScrollParent = getScrollParent(prev);\n prevScrollParent.removeEventListener('scroll', handler);\n }\n if (isHTMLElement(next)) {\n const scrollParent = getScrollParent(next);\n scrollParent.addEventListener('scroll', handler);\n }\n}\n"],"mappings":"AAAA,SAASA,aAAa,QAAQ,2BAA2B;AAEzD,SAASC,eAAe,QAAQ,mBAAmB;AAEnD;;;;;;AAMA,OAAM,SAAUC,oBAAoBA,CAClCC,IAAoD,EACpDC,IAAoD,EACpDC,OAAsB;EAEtB,IAAIF,IAAI,KAAKC,IAAI,EAAE;IACjB;;EAGF,IAAIJ,aAAa,CAACI,IAAI,CAAC,EAAE;IACvB,MAAME,gBAAgB,GAAGL,eAAe,CAACG,IAAI,CAAC;IAC9CE,gBAAgB,CAACC,mBAAmB,CAAC,QAAQ,EAAEF,OAAO,CAAC;;EAEzD,IAAIL,aAAa,CAACG,IAAI,CAAC,EAAE;IACvB,MAAMK,YAAY,GAAGP,eAAe,CAACE,IAAI,CAAC;IAC1CK,YAAY,CAACC,gBAAgB,CAAC,QAAQ,EAAEJ,OAAO,CAAC;;AAEpD"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import * as React from
|
|
2
|
-
import { useIsomorphicLayoutEffect } from
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
import { useIsomorphicLayoutEffect } from '@fluentui/react-utilities';
|
|
3
3
|
/**
|
|
4
4
|
* Creates a MutableRef with ref change callback. Is useful as React.useRef() doesn't notify you when its content
|
|
5
5
|
* changes and mutating the .current property doesn't cause a re-render. An opt-out will be use a callback ref via
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["React","useIsomorphicLayoutEffect","useCallbackRef","initialValue","callback","skipInitialResolve","isFirst","useRef","ref","useState","value","facade","current","last"],"sources":["
|
|
1
|
+
{"version":3,"names":["React","useIsomorphicLayoutEffect","useCallbackRef","initialValue","callback","skipInitialResolve","isFirst","useRef","ref","useState","value","facade","current","last"],"sources":["../../../../../../../../packages/react-components/react-positioning/src/utils/useCallbackRef.ts"],"sourcesContent":["import * as React from 'react';\nimport { useIsomorphicLayoutEffect } from '@fluentui/react-utilities';\n\n/**\n * Creates a MutableRef with ref change callback. Is useful as React.useRef() doesn't notify you when its content\n * changes and mutating the .current property doesn't cause a re-render. An opt-out will be use a callback ref via\n * React.useState(), but it will cause re-renders always.\n *\n * https://reactjs.org/docs/hooks-reference.html#useref\n * https://github.com/theKashey/use-callback-ref#usecallbackref---to-replace-reactuseref\n *\n * @param initialValue - initial ref value\n * @param callback - a callback to run when value changes\n * @param skipInitialResolve - a flag to skip an initial ref report\n *\n * @example\n * const ref = useCallbackRef(0, (newValue, oldValue) => console.log(oldValue, '->', newValue);\n * ref.current = 1;\n * // prints 0 -> 1\n */\nexport function useCallbackRef<T>(\n initialValue: T | null,\n callback: (newValue: T | null, lastValue: T | null) => void,\n skipInitialResolve?: boolean,\n): React.MutableRefObject<T | null> {\n const isFirst = React.useRef(true);\n const [ref] = React.useState(() => ({\n // value\n value: initialValue,\n // last callback\n callback,\n // \"memoized\" public interface\n facade: {\n get current() {\n return ref.value;\n },\n set current(value) {\n const last = ref.value;\n\n if (last !== value) {\n ref.value = value;\n\n if (skipInitialResolve && isFirst.current) {\n return;\n }\n\n ref.callback(value, last);\n }\n },\n },\n }));\n\n useIsomorphicLayoutEffect(() => {\n isFirst.current = false;\n }, []);\n\n // update callback\n ref.callback = callback;\n\n return ref.facade;\n}\n"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,yBAAyB,QAAQ,2BAA2B;AAErE;;;;;;;;;;;;;;;;;AAiBA,OAAM,SAAUC,cAAcA,CAC5BC,YAAsB,EACtBC,QAA2D,EAC3DC,kBAA4B;EAE5B,MAAMC,OAAO,GAAGN,KAAK,CAACO,MAAM,CAAC,IAAI,CAAC;EAClC,MAAM,CAACC,GAAG,CAAC,GAAGR,KAAK,CAACS,QAAQ,CAAC,OAAO;IAClC;IACAC,KAAK,EAAEP,YAAY;IACnB;IACAC,QAAQ;IACR;IACAO,MAAM,EAAE;MACN,IAAIC,OAAOA,CAAA;QACT,OAAOJ,GAAG,CAACE,KAAK;MAClB,CAAC;MACD,IAAIE,OAAOA,CAACF,KAAK;QACf,MAAMG,IAAI,GAAGL,GAAG,CAACE,KAAK;QAEtB,IAAIG,IAAI,KAAKH,KAAK,EAAE;UAClBF,GAAG,CAACE,KAAK,GAAGA,KAAK;UAEjB,IAAIL,kBAAkB,IAAIC,OAAO,CAACM,OAAO,EAAE;YACzC;;UAGFJ,GAAG,CAACJ,QAAQ,CAACM,KAAK,EAAEG,IAAI,CAAC;;MAE7B;;GAEH,CAAC,CAAC;EAEHZ,yBAAyB,CAAC,MAAK;IAC7BK,OAAO,CAACM,OAAO,GAAG,KAAK;EACzB,CAAC,EAAE,EAAE,CAAC;EAEN;EACAJ,GAAG,CAACJ,QAAQ,GAAGA,QAAQ;EAEvB,OAAOI,GAAG,CAACG,MAAM;AACnB"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["writeArrowUpdates","options","arrow","middlewareData","x","arrowX","y","arrowY","Object","assign","style","left","top"],"sources":["
|
|
1
|
+
{"version":3,"names":["writeArrowUpdates","options","arrow","middlewareData","x","arrowX","y","arrowY","Object","assign","style","left","top"],"sources":["../../../../../../../../packages/react-components/react-positioning/src/utils/writeArrowUpdates.ts"],"sourcesContent":["import { MiddlewareData } from '@floating-ui/dom';\n\n/**\n * Writes all DOM element updates after position is computed\n */\nexport function writeArrowUpdates(options: { arrow: HTMLElement | null; middlewareData: MiddlewareData }) {\n const { arrow, middlewareData } = options;\n if (!middlewareData.arrow || !arrow) {\n return;\n }\n\n const { x: arrowX, y: arrowY } = middlewareData.arrow;\n\n Object.assign(arrow.style, {\n left: `${arrowX}px`,\n top: `${arrowY}px`,\n });\n}\n"],"mappings":"AAEA;;;AAGA,OAAM,SAAUA,iBAAiBA,CAACC,OAAsE;EACtG,MAAM;IAAEC,KAAK;IAAEC;EAAc,CAAE,GAAGF,OAAO;EACzC,IAAI,CAACE,cAAc,CAACD,KAAK,IAAI,CAACA,KAAK,EAAE;IACnC;;EAGF,MAAM;IAAEE,CAAC,EAAEC,MAAM;IAAEC,CAAC,EAAEC;EAAM,CAAE,GAAGJ,cAAc,CAACD,KAAK;EAErDM,MAAM,CAACC,MAAM,CAACP,KAAK,CAACQ,KAAK,EAAE;IACzBC,IAAI,EAAE,GAAGN,MAAM,IAAI;IACnBO,GAAG,EAAE,GAAGL,MAAM;GACf,CAAC;AACJ"}
|
|
@@ -1,8 +1,9 @@
|
|
|
1
|
-
import { DATA_POSITIONING_ESCAPED, DATA_POSITIONING_HIDDEN, DATA_POSITIONING_INTERSECTING, DATA_POSITIONING_PLACEMENT } from
|
|
1
|
+
import { DATA_POSITIONING_ESCAPED, DATA_POSITIONING_HIDDEN, DATA_POSITIONING_INTERSECTING, DATA_POSITIONING_PLACEMENT } from '../constants';
|
|
2
2
|
/**
|
|
3
3
|
* Writes all container element position updates after the position is computed
|
|
4
4
|
*/
|
|
5
5
|
export function writeContainerUpdates(options) {
|
|
6
|
+
var _a, _b, _c;
|
|
6
7
|
const {
|
|
7
8
|
container,
|
|
8
9
|
placement,
|
|
@@ -17,21 +18,21 @@ export function writeContainerUpdates(options) {
|
|
|
17
18
|
container.setAttribute(DATA_POSITIONING_PLACEMENT, placement);
|
|
18
19
|
container.removeAttribute(DATA_POSITIONING_INTERSECTING);
|
|
19
20
|
if (middlewareData.intersectionObserver.intersecting) {
|
|
20
|
-
container.setAttribute(DATA_POSITIONING_INTERSECTING,
|
|
21
|
+
container.setAttribute(DATA_POSITIONING_INTERSECTING, '');
|
|
21
22
|
}
|
|
22
23
|
container.removeAttribute(DATA_POSITIONING_ESCAPED);
|
|
23
|
-
if (middlewareData.hide
|
|
24
|
-
container.setAttribute(DATA_POSITIONING_ESCAPED,
|
|
24
|
+
if ((_a = middlewareData.hide) === null || _a === void 0 ? void 0 : _a.escaped) {
|
|
25
|
+
container.setAttribute(DATA_POSITIONING_ESCAPED, '');
|
|
25
26
|
}
|
|
26
27
|
container.removeAttribute(DATA_POSITIONING_HIDDEN);
|
|
27
|
-
if (middlewareData.hide
|
|
28
|
-
container.setAttribute(DATA_POSITIONING_HIDDEN,
|
|
28
|
+
if ((_b = middlewareData.hide) === null || _b === void 0 ? void 0 : _b.referenceHidden) {
|
|
29
|
+
container.setAttribute(DATA_POSITIONING_HIDDEN, '');
|
|
29
30
|
}
|
|
30
31
|
// Round so that the coordinates land on device pixels.
|
|
31
32
|
// This prevents blurriness in cases where the browser doesn't apply pixel snapping, such as when other effects like
|
|
32
33
|
// `backdrop-filter: blur()` are applied to the container, and the browser is zoomed in.
|
|
33
34
|
// See https://github.com/microsoft/fluentui/issues/26764 for more info.
|
|
34
|
-
const devicePixelRatio = container.ownerDocument.defaultView
|
|
35
|
+
const devicePixelRatio = ((_c = container.ownerDocument.defaultView) === null || _c === void 0 ? void 0 : _c.devicePixelRatio) || 1;
|
|
35
36
|
const x = Math.round(coordinates.x * devicePixelRatio) / devicePixelRatio;
|
|
36
37
|
const y = Math.round(coordinates.y * devicePixelRatio) / devicePixelRatio;
|
|
37
38
|
Object.assign(container.style, {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["DATA_POSITIONING_ESCAPED","DATA_POSITIONING_HIDDEN","DATA_POSITIONING_INTERSECTING","DATA_POSITIONING_PLACEMENT","writeContainerUpdates","options","container","placement","middlewareData","strategy","lowPPI","coordinates","setAttribute","removeAttribute","intersectionObserver","intersecting","hide","escaped","referenceHidden","devicePixelRatio","ownerDocument","defaultView","x","Math","round","y","Object","assign","style","transform","position"],"sources":["
|
|
1
|
+
{"version":3,"names":["DATA_POSITIONING_ESCAPED","DATA_POSITIONING_HIDDEN","DATA_POSITIONING_INTERSECTING","DATA_POSITIONING_PLACEMENT","writeContainerUpdates","options","container","placement","middlewareData","strategy","lowPPI","coordinates","setAttribute","removeAttribute","intersectionObserver","intersecting","_a","hide","escaped","_b","referenceHidden","devicePixelRatio","_c","ownerDocument","defaultView","x","Math","round","y","Object","assign","style","transform","position"],"sources":["../../../../../../../../packages/react-components/react-positioning/src/utils/writeContainerupdates.ts"],"sourcesContent":["import type { Placement, MiddlewareData, Strategy, Coords } from '@floating-ui/dom';\nimport {\n DATA_POSITIONING_ESCAPED,\n DATA_POSITIONING_HIDDEN,\n DATA_POSITIONING_INTERSECTING,\n DATA_POSITIONING_PLACEMENT,\n} from '../constants';\n\n/**\n * Writes all container element position updates after the position is computed\n */\nexport function writeContainerUpdates(options: {\n container: HTMLElement | null;\n placement: Placement;\n middlewareData: MiddlewareData;\n /**\n * Layer acceleration can disable subpixel rendering which causes slightly\n * blurry text on low PPI displays, so we want to use 2D transforms\n * instead\n */\n lowPPI: boolean;\n strategy: Strategy;\n coordinates: Coords;\n}) {\n const { container, placement, middlewareData, strategy, lowPPI, coordinates } = options;\n if (!container) {\n return;\n }\n container.setAttribute(DATA_POSITIONING_PLACEMENT, placement);\n container.removeAttribute(DATA_POSITIONING_INTERSECTING);\n if (middlewareData.intersectionObserver.intersecting) {\n container.setAttribute(DATA_POSITIONING_INTERSECTING, '');\n }\n\n container.removeAttribute(DATA_POSITIONING_ESCAPED);\n if (middlewareData.hide?.escaped) {\n container.setAttribute(DATA_POSITIONING_ESCAPED, '');\n }\n\n container.removeAttribute(DATA_POSITIONING_HIDDEN);\n if (middlewareData.hide?.referenceHidden) {\n container.setAttribute(DATA_POSITIONING_HIDDEN, '');\n }\n\n // Round so that the coordinates land on device pixels.\n // This prevents blurriness in cases where the browser doesn't apply pixel snapping, such as when other effects like\n // `backdrop-filter: blur()` are applied to the container, and the browser is zoomed in.\n // See https://github.com/microsoft/fluentui/issues/26764 for more info.\n const devicePixelRatio = container.ownerDocument.defaultView?.devicePixelRatio || 1;\n const x = Math.round(coordinates.x * devicePixelRatio) / devicePixelRatio;\n const y = Math.round(coordinates.y * devicePixelRatio) / devicePixelRatio;\n\n Object.assign(container.style, {\n transform: lowPPI ? `translate(${x}px, ${y}px)` : `translate3d(${x}px, ${y}px, 0)`,\n position: strategy,\n });\n}\n"],"mappings":"AACA,SACEA,wBAAwB,EACxBC,uBAAuB,EACvBC,6BAA6B,EAC7BC,0BAA0B,QACrB,cAAc;AAErB;;;AAGA,OAAM,SAAUC,qBAAqBA,CAACC,OAYrC;;EACC,MAAM;IAAEC,SAAS;IAAEC,SAAS;IAAEC,cAAc;IAAEC,QAAQ;IAAEC,MAAM;IAAEC;EAAW,CAAE,GAAGN,OAAO;EACvF,IAAI,CAACC,SAAS,EAAE;IACd;;EAEFA,SAAS,CAACM,YAAY,CAACT,0BAA0B,EAAEI,SAAS,CAAC;EAC7DD,SAAS,CAACO,eAAe,CAACX,6BAA6B,CAAC;EACxD,IAAIM,cAAc,CAACM,oBAAoB,CAACC,YAAY,EAAE;IACpDT,SAAS,CAACM,YAAY,CAACV,6BAA6B,EAAE,EAAE,CAAC;;EAG3DI,SAAS,CAACO,eAAe,CAACb,wBAAwB,CAAC;EACnD,IAAI,CAAAgB,EAAA,GAAAR,cAAc,CAACS,IAAI,cAAAD,EAAA,uBAAAA,EAAA,CAAEE,OAAO,EAAE;IAChCZ,SAAS,CAACM,YAAY,CAACZ,wBAAwB,EAAE,EAAE,CAAC;;EAGtDM,SAAS,CAACO,eAAe,CAACZ,uBAAuB,CAAC;EAClD,IAAI,CAAAkB,EAAA,GAAAX,cAAc,CAACS,IAAI,cAAAE,EAAA,uBAAAA,EAAA,CAAEC,eAAe,EAAE;IACxCd,SAAS,CAACM,YAAY,CAACX,uBAAuB,EAAE,EAAE,CAAC;;EAGrD;EACA;EACA;EACA;EACA,MAAMoB,gBAAgB,GAAG,EAAAC,EAAA,GAAAhB,SAAS,CAACiB,aAAa,CAACC,WAAW,cAAAF,EAAA,uBAAAA,EAAA,CAAED,gBAAgB,KAAI,CAAC;EACnF,MAAMI,CAAC,GAAGC,IAAI,CAACC,KAAK,CAAChB,WAAW,CAACc,CAAC,GAAGJ,gBAAgB,CAAC,GAAGA,gBAAgB;EACzE,MAAMO,CAAC,GAAGF,IAAI,CAACC,KAAK,CAAChB,WAAW,CAACiB,CAAC,GAAGP,gBAAgB,CAAC,GAAGA,gBAAgB;EAEzEQ,MAAM,CAACC,MAAM,CAACxB,SAAS,CAACyB,KAAK,EAAE;IAC7BC,SAAS,EAAEtB,MAAM,GAAG,aAAae,CAAC,OAAOG,CAAC,KAAK,GAAG,eAAeH,CAAC,OAAOG,CAAC,QAAQ;IAClFK,QAAQ,EAAExB;GACX,CAAC;AACJ"}
|
|
@@ -1,22 +1,11 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
+
|
|
2
3
|
Object.defineProperty(exports, "__esModule", {
|
|
3
|
-
|
|
4
|
-
});
|
|
5
|
-
function _export(target, all) {
|
|
6
|
-
for(var name in all)Object.defineProperty(target, name, {
|
|
7
|
-
enumerable: true,
|
|
8
|
-
get: all[name]
|
|
9
|
-
});
|
|
10
|
-
}
|
|
11
|
-
_export(exports, {
|
|
12
|
-
DATA_POSITIONING_INTERSECTING: ()=>DATA_POSITIONING_INTERSECTING,
|
|
13
|
-
DATA_POSITIONING_ESCAPED: ()=>DATA_POSITIONING_ESCAPED,
|
|
14
|
-
DATA_POSITIONING_HIDDEN: ()=>DATA_POSITIONING_HIDDEN,
|
|
15
|
-
DATA_POSITIONING_PLACEMENT: ()=>DATA_POSITIONING_PLACEMENT
|
|
4
|
+
value: true
|
|
16
5
|
});
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
6
|
+
exports.DATA_POSITIONING_PLACEMENT = exports.DATA_POSITIONING_HIDDEN = exports.DATA_POSITIONING_ESCAPED = exports.DATA_POSITIONING_INTERSECTING = void 0;
|
|
7
|
+
exports.DATA_POSITIONING_INTERSECTING = 'data-popper-is-intersecting';
|
|
8
|
+
exports.DATA_POSITIONING_ESCAPED = 'data-popper-escaped';
|
|
9
|
+
exports.DATA_POSITIONING_HIDDEN = 'data-popper-reference-hidden';
|
|
10
|
+
exports.DATA_POSITIONING_PLACEMENT = 'data-popper-placement';
|
|
22
11
|
//# sourceMappingURL=constants.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["
|
|
1
|
+
{"version":3,"names":["exports","DATA_POSITIONING_INTERSECTING","DATA_POSITIONING_ESCAPED","DATA_POSITIONING_HIDDEN","DATA_POSITIONING_PLACEMENT"],"sources":["../../../../../../../packages/react-components/react-positioning/src/constants.ts"],"sourcesContent":["export const DATA_POSITIONING_INTERSECTING = 'data-popper-is-intersecting';\nexport const DATA_POSITIONING_ESCAPED = 'data-popper-escaped';\nexport const DATA_POSITIONING_HIDDEN = 'data-popper-reference-hidden';\nexport const DATA_POSITIONING_PLACEMENT = 'data-popper-placement';\n"],"mappings":";;;;;;AAAaA,OAAA,CAAAC,6BAA6B,GAAG,6BAA6B;AAC7DD,OAAA,CAAAE,wBAAwB,GAAG,qBAAqB;AAChDF,OAAA,CAAAG,uBAAuB,GAAG,8BAA8B;AACxDH,OAAA,CAAAI,0BAA0B,GAAG,uBAAuB"}
|