@fluentui/react-popover 9.0.0-nightly.f81b28ceb3.1 → 9.0.0-rc.11
Sign up to get free protection for your applications and to get access to all the features.
- package/CHANGELOG.json +935 -25
- package/CHANGELOG.md +297 -80
- package/Spec.md +20 -0
- package/dist/{react-popover.d.ts → index.d.ts} +117 -71
- package/{lib → dist}/tsdoc-metadata.json +0 -0
- package/lib/Popover.js.map +1 -1
- package/lib/PopoverSurface.js.map +1 -1
- package/lib/PopoverTrigger.js.map +1 -1
- package/lib/components/Popover/Popover.js +5 -5
- package/lib/components/Popover/Popover.js.map +1 -1
- package/lib/components/Popover/Popover.types.js.map +1 -1
- package/lib/components/Popover/index.js.map +1 -1
- package/lib/components/Popover/renderPopover.js +30 -26
- package/lib/components/Popover/renderPopover.js.map +1 -1
- package/lib/components/Popover/usePopover.js +118 -56
- package/lib/components/Popover/usePopover.js.map +1 -1
- package/lib/components/PopoverSurface/PopoverSurface.js +7 -7
- package/lib/components/PopoverSurface/PopoverSurface.js.map +1 -1
- package/lib/components/PopoverSurface/PopoverSurface.types.js.map +1 -1
- package/lib/components/PopoverSurface/index.js.map +1 -1
- package/lib/components/PopoverSurface/renderPopoverSurface.js +13 -13
- package/lib/components/PopoverSurface/renderPopoverSurface.js.map +1 -1
- package/lib/components/PopoverSurface/usePopoverSurface.js +40 -64
- package/lib/components/PopoverSurface/usePopoverSurface.js.map +1 -1
- package/lib/components/PopoverSurface/usePopoverSurfaceStyles.js +36 -22
- package/lib/components/PopoverSurface/usePopoverSurfaceStyles.js.map +1 -1
- package/lib/components/PopoverTrigger/PopoverTrigger.js +6 -5
- package/lib/components/PopoverTrigger/PopoverTrigger.js.map +1 -1
- package/lib/components/PopoverTrigger/PopoverTrigger.types.js.map +1 -1
- package/lib/components/PopoverTrigger/index.js.map +1 -1
- package/lib/components/PopoverTrigger/renderPopoverTrigger.js +1 -1
- package/lib/components/PopoverTrigger/renderPopoverTrigger.js.map +1 -1
- package/lib/components/PopoverTrigger/usePopoverTrigger.js +40 -55
- package/lib/components/PopoverTrigger/usePopoverTrigger.js.map +1 -1
- package/lib/index.js +4 -4
- package/lib/index.js.map +1 -1
- package/lib/popoverContext.js +7 -9
- package/lib/popoverContext.js.map +1 -1
- package/lib-commonjs/Popover.js +1 -1
- package/lib-commonjs/Popover.js.map +1 -1
- package/lib-commonjs/PopoverSurface.js +1 -1
- package/lib-commonjs/PopoverSurface.js.map +1 -1
- package/lib-commonjs/PopoverTrigger.js +1 -1
- package/lib-commonjs/PopoverTrigger.js.map +1 -1
- package/lib-commonjs/components/Popover/Popover.js +5 -5
- package/lib-commonjs/components/Popover/Popover.js.map +1 -1
- package/lib-commonjs/components/Popover/Popover.types.js.map +1 -1
- package/lib-commonjs/components/Popover/index.js +1 -1
- package/lib-commonjs/components/Popover/index.js.map +1 -1
- package/lib-commonjs/components/Popover/renderPopover.js +34 -30
- package/lib-commonjs/components/Popover/renderPopover.js.map +1 -1
- package/lib-commonjs/components/Popover/usePopover.js +125 -63
- package/lib-commonjs/components/Popover/usePopover.js.map +1 -1
- package/lib-commonjs/components/PopoverSurface/PopoverSurface.js +8 -8
- package/lib-commonjs/components/PopoverSurface/PopoverSurface.js.map +1 -1
- package/lib-commonjs/components/PopoverSurface/PopoverSurface.types.js.map +1 -1
- package/lib-commonjs/components/PopoverSurface/index.js +1 -1
- package/lib-commonjs/components/PopoverSurface/index.js.map +1 -1
- package/lib-commonjs/components/PopoverSurface/renderPopoverSurface.js +18 -20
- package/lib-commonjs/components/PopoverSurface/renderPopoverSurface.js.map +1 -1
- package/lib-commonjs/components/PopoverSurface/usePopoverSurface.js +44 -70
- package/lib-commonjs/components/PopoverSurface/usePopoverSurface.js.map +1 -1
- package/lib-commonjs/components/PopoverSurface/usePopoverSurfaceStyles.js +40 -24
- package/lib-commonjs/components/PopoverSurface/usePopoverSurfaceStyles.js.map +1 -1
- package/lib-commonjs/components/PopoverTrigger/PopoverTrigger.js +6 -5
- package/lib-commonjs/components/PopoverTrigger/PopoverTrigger.js.map +1 -1
- package/lib-commonjs/components/PopoverTrigger/PopoverTrigger.types.js.map +1 -1
- package/lib-commonjs/components/PopoverTrigger/index.js +1 -1
- package/lib-commonjs/components/PopoverTrigger/index.js.map +1 -1
- package/lib-commonjs/components/PopoverTrigger/renderPopoverTrigger.js +3 -3
- package/lib-commonjs/components/PopoverTrigger/renderPopoverTrigger.js.map +1 -1
- package/lib-commonjs/components/PopoverTrigger/usePopoverTrigger.js +45 -61
- package/lib-commonjs/components/PopoverTrigger/usePopoverTrigger.js.map +1 -1
- package/lib-commonjs/index.js +92 -5
- package/lib-commonjs/index.js.map +1 -1
- package/lib-commonjs/popoverContext.js +9 -11
- package/lib-commonjs/popoverContext.js.map +1 -1
- package/package.json +23 -27
- package/lib/Popover.d.ts +0 -1
- package/lib/PopoverSurface.d.ts +0 -1
- package/lib/PopoverTrigger.d.ts +0 -1
- package/lib/common/isConformant.d.ts +0 -4
- package/lib/common/isConformant.js +0 -13
- package/lib/common/isConformant.js.map +0 -1
- package/lib/common/mockUsePopoverContext.d.ts +0 -7
- package/lib/common/mockUsePopoverContext.js +0 -38
- package/lib/common/mockUsePopoverContext.js.map +0 -1
- package/lib/components/Popover/Popover.d.ts +0 -6
- package/lib/components/Popover/Popover.types.d.ts +0 -100
- package/lib/components/Popover/index.d.ts +0 -4
- package/lib/components/Popover/renderPopover.d.ts +0 -5
- package/lib/components/Popover/usePopover.d.ts +0 -10
- package/lib/components/PopoverSurface/PopoverSurface.d.ts +0 -6
- package/lib/components/PopoverSurface/PopoverSurface.types.d.ts +0 -21
- package/lib/components/PopoverSurface/index.d.ts +0 -5
- package/lib/components/PopoverSurface/renderPopoverSurface.d.ts +0 -5
- package/lib/components/PopoverSurface/usePopoverSurface.d.ts +0 -13
- package/lib/components/PopoverSurface/usePopoverSurfaceStyles.d.ts +0 -7
- package/lib/components/PopoverTrigger/PopoverTrigger.d.ts +0 -6
- package/lib/components/PopoverTrigger/PopoverTrigger.types.d.ts +0 -11
- package/lib/components/PopoverTrigger/index.d.ts +0 -4
- package/lib/components/PopoverTrigger/renderPopoverTrigger.d.ts +0 -5
- package/lib/components/PopoverTrigger/usePopoverTrigger.d.ts +0 -10
- package/lib/index.d.ts +0 -4
- package/lib/popoverContext.d.ts +0 -8
- package/lib-commonjs/Popover.d.ts +0 -1
- package/lib-commonjs/PopoverSurface.d.ts +0 -1
- package/lib-commonjs/PopoverTrigger.d.ts +0 -1
- package/lib-commonjs/common/isConformant.d.ts +0 -4
- package/lib-commonjs/common/isConformant.js +0 -24
- package/lib-commonjs/common/isConformant.js.map +0 -1
- package/lib-commonjs/common/mockUsePopoverContext.d.ts +0 -7
- package/lib-commonjs/common/mockUsePopoverContext.js +0 -49
- package/lib-commonjs/common/mockUsePopoverContext.js.map +0 -1
- package/lib-commonjs/components/Popover/Popover.d.ts +0 -6
- package/lib-commonjs/components/Popover/Popover.types.d.ts +0 -100
- package/lib-commonjs/components/Popover/index.d.ts +0 -4
- package/lib-commonjs/components/Popover/renderPopover.d.ts +0 -5
- package/lib-commonjs/components/Popover/usePopover.d.ts +0 -10
- package/lib-commonjs/components/PopoverSurface/PopoverSurface.d.ts +0 -6
- package/lib-commonjs/components/PopoverSurface/PopoverSurface.types.d.ts +0 -21
- package/lib-commonjs/components/PopoverSurface/index.d.ts +0 -5
- package/lib-commonjs/components/PopoverSurface/renderPopoverSurface.d.ts +0 -5
- package/lib-commonjs/components/PopoverSurface/usePopoverSurface.d.ts +0 -13
- package/lib-commonjs/components/PopoverSurface/usePopoverSurfaceStyles.d.ts +0 -7
- package/lib-commonjs/components/PopoverTrigger/PopoverTrigger.d.ts +0 -6
- package/lib-commonjs/components/PopoverTrigger/PopoverTrigger.types.d.ts +0 -11
- package/lib-commonjs/components/PopoverTrigger/index.d.ts +0 -4
- package/lib-commonjs/components/PopoverTrigger/renderPopoverTrigger.d.ts +0 -5
- package/lib-commonjs/components/PopoverTrigger/usePopoverTrigger.d.ts +0 -10
- package/lib-commonjs/index.d.ts +0 -4
- package/lib-commonjs/popoverContext.d.ts +0 -8
package/package.json
CHANGED
@@ -1,10 +1,10 @@
|
|
1
1
|
{
|
2
2
|
"name": "@fluentui/react-popover",
|
3
|
-
"version": "9.0.0-
|
3
|
+
"version": "9.0.0-rc.11",
|
4
4
|
"description": "Popover component for Fluent UI",
|
5
5
|
"main": "lib-commonjs/index.js",
|
6
6
|
"module": "lib/index.js",
|
7
|
-
"typings": "
|
7
|
+
"typings": "dist/index.d.ts",
|
8
8
|
"sideEffects": false,
|
9
9
|
"repository": {
|
10
10
|
"type": "git",
|
@@ -20,37 +20,27 @@
|
|
20
20
|
"lint": "just-scripts lint",
|
21
21
|
"start": "yarn storybook",
|
22
22
|
"e2e": "e2e",
|
23
|
-
"storybook": "
|
24
|
-
"test": "jest",
|
23
|
+
"storybook": "node ../../../scripts/storybook/runner",
|
24
|
+
"test": "jest --passWithNoTests",
|
25
25
|
"docs": "api-extractor run --config=config/api-extractor.local.json --local",
|
26
|
-
"build:local": "tsc -p . --module esnext --emitDeclarationOnly && node
|
26
|
+
"build:local": "tsc -p ./tsconfig.lib.json --module esnext --emitDeclarationOnly && node ../../../scripts/typescript/normalize-import --output ./dist/packages/react-components/react-popover/src && yarn docs",
|
27
|
+
"type-check": "tsc -b tsconfig.json"
|
27
28
|
},
|
28
29
|
"devDependencies": {
|
29
|
-
"@fluentui/babel-make-styles": "9.0.0-nightly.f81b28ceb3.1",
|
30
30
|
"@fluentui/eslint-plugin": "*",
|
31
|
-
"@fluentui/jest-serializer-make-styles": "9.0.0-nightly.f81b28ceb3.1",
|
32
31
|
"@fluentui/react-conformance": "*",
|
33
|
-
"@fluentui/react-conformance-
|
34
|
-
"@fluentui/scripts": "^1.0.0"
|
35
|
-
"@types/enzyme": "3.10.3",
|
36
|
-
"@types/enzyme-adapter-react-16": "1.0.3",
|
37
|
-
"@types/react": "16.9.42",
|
38
|
-
"@types/react-dom": "16.9.10",
|
39
|
-
"@types/react-test-renderer": "^16.0.0",
|
40
|
-
"enzyme": "~3.10.0",
|
41
|
-
"enzyme-adapter-react-16": "^1.15.0",
|
42
|
-
"react": "16.8.6",
|
43
|
-
"react-dom": "16.8.6",
|
44
|
-
"react-test-renderer": "^16.3.0"
|
32
|
+
"@fluentui/react-conformance-griffel": "9.0.0-beta.7",
|
33
|
+
"@fluentui/scripts": "^1.0.0"
|
45
34
|
},
|
46
35
|
"dependencies": {
|
47
|
-
"@fluentui/react-context-selector": "9.0.0-
|
48
|
-
"@
|
49
|
-
"@fluentui/react-portal": "9.0.0-
|
50
|
-
"@fluentui/react-positioning": "9.0.0-
|
51
|
-
"@fluentui/react-shared-contexts": "9.0.0-
|
52
|
-
"@fluentui/react-tabster": "9.0.0-
|
53
|
-
"@fluentui/react-
|
36
|
+
"@fluentui/react-context-selector": "9.0.0-rc.9",
|
37
|
+
"@griffel/react": "1.0.5",
|
38
|
+
"@fluentui/react-portal": "9.0.0-rc.11",
|
39
|
+
"@fluentui/react-positioning": "9.0.0-rc.10",
|
40
|
+
"@fluentui/react-shared-contexts": "9.0.0-rc.9",
|
41
|
+
"@fluentui/react-tabster": "9.0.0-rc.11",
|
42
|
+
"@fluentui/react-theme": "9.0.0-rc.9",
|
43
|
+
"@fluentui/react-utilities": "9.0.0-rc.9",
|
54
44
|
"tslib": "^2.1.0"
|
55
45
|
},
|
56
46
|
"peerDependencies": {
|
@@ -60,11 +50,17 @@
|
|
60
50
|
"react-dom": ">=16.8.0 <18.0.0"
|
61
51
|
},
|
62
52
|
"beachball": {
|
63
|
-
"tag": "beta",
|
64
53
|
"disallowedChangeTypes": [
|
65
54
|
"major",
|
66
55
|
"minor",
|
67
56
|
"patch"
|
68
57
|
]
|
58
|
+
},
|
59
|
+
"exports": {
|
60
|
+
".": {
|
61
|
+
"types": "./lib/index.d.ts",
|
62
|
+
"import": "./lib/index.js",
|
63
|
+
"require": "./lib-commonjs/index.js"
|
64
|
+
}
|
69
65
|
}
|
70
66
|
}
|
package/lib/Popover.d.ts
DELETED
@@ -1 +0,0 @@
|
|
1
|
-
export * from './components/Popover/index';
|
package/lib/PopoverSurface.d.ts
DELETED
@@ -1 +0,0 @@
|
|
1
|
-
export * from './components/PopoverSurface/index';
|
package/lib/PopoverTrigger.d.ts
DELETED
@@ -1 +0,0 @@
|
|
1
|
-
export * from './components/PopoverTrigger/index';
|
@@ -1,13 +0,0 @@
|
|
1
|
-
import { isConformant as baseIsConformant } from '@fluentui/react-conformance';
|
2
|
-
import makeStylesTests from '@fluentui/react-conformance-make-styles';
|
3
|
-
export function isConformant(testInfo) {
|
4
|
-
var defaultOptions = {
|
5
|
-
asPropHandlesRef: true,
|
6
|
-
componentPath: module.parent.filename.replace('.test', ''),
|
7
|
-
// TODO // https://github.com/microsoft/fluentui/issues/19522
|
8
|
-
skipAsPropTests: true,
|
9
|
-
extraTests: makeStylesTests
|
10
|
-
};
|
11
|
-
baseIsConformant(defaultOptions, testInfo);
|
12
|
-
}
|
13
|
-
//# sourceMappingURL=isConformant.js.map
|
@@ -1 +0,0 @@
|
|
1
|
-
{"version":3,"sources":["../../src/common/isConformant.ts"],"names":[],"mappings":"AAAA,SAAS,YAAY,IAAI,gBAAzB,QAAiD,6BAAjD;AAEA,OAAO,eAAP,MAA4B,yCAA5B;AAEA,OAAM,SAAU,YAAV,CACJ,QADI,EACqF;AAEzF,MAAM,cAAc,GAAyC;AAC3D,IAAA,gBAAgB,EAAE,IADyC;AAE3D,IAAA,aAAa,EAAE,MAAO,CAAC,MAAR,CAAgB,QAAhB,CAAyB,OAAzB,CAAiC,OAAjC,EAA0C,EAA1C,CAF4C;AAG3D;AACA,IAAA,eAAe,EAAE,IAJ0C;AAK3D,IAAA,UAAU,EAAE;AAL+C,GAA7D;AAQA,EAAA,gBAAgB,CAAC,cAAD,EAAiB,QAAjB,CAAhB;AACD","sourceRoot":""}
|
@@ -1,7 +0,0 @@
|
|
1
|
-
import type { PopoverContextValue } from '../popoverContext';
|
2
|
-
/**
|
3
|
-
* A test utility to mock the usePopoverContext hook that relies on context selector
|
4
|
-
* Don't forget to call `jest.mock(**\/popupContext.ts)` while using this
|
5
|
-
* @param options Popover context values to set for testing
|
6
|
-
*/
|
7
|
-
export declare const mockPopoverContext: (options?: Partial<PopoverContextValue>) => void;
|
@@ -1,38 +0,0 @@
|
|
1
|
-
import { __assign } from "tslib";
|
2
|
-
import { usePopoverContext } from '../popoverContext';
|
3
|
-
/**
|
4
|
-
* A test utility to mock the usePopoverContext hook that relies on context selector
|
5
|
-
* Don't forget to call `jest.mock(**\/popupContext.ts)` while using this
|
6
|
-
* @param options Popover context values to set for testing
|
7
|
-
*/
|
8
|
-
|
9
|
-
export var mockPopoverContext = function (options) {
|
10
|
-
if (options === void 0) {
|
11
|
-
options = {};
|
12
|
-
}
|
13
|
-
|
14
|
-
var mockContext = __assign({
|
15
|
-
open: false,
|
16
|
-
setOpen: function () {
|
17
|
-
return null;
|
18
|
-
},
|
19
|
-
triggerRef: {
|
20
|
-
current: null
|
21
|
-
},
|
22
|
-
contentRef: {
|
23
|
-
current: null
|
24
|
-
},
|
25
|
-
arrowRef: {
|
26
|
-
current: null
|
27
|
-
},
|
28
|
-
openOnContext: false,
|
29
|
-
openOnHover: false,
|
30
|
-
size: 'medium'
|
31
|
-
}, options); // eslint-disable-next-line @typescript-eslint/no-explicit-any
|
32
|
-
|
33
|
-
|
34
|
-
usePopoverContext.mockImplementation(function (selector) {
|
35
|
-
return selector(mockContext);
|
36
|
-
});
|
37
|
-
};
|
38
|
-
//# sourceMappingURL=mockUsePopoverContext.js.map
|
@@ -1 +0,0 @@
|
|
1
|
-
{"version":3,"sources":["../../src/common/mockUsePopoverContext.ts"],"names":[],"mappings":";AAAA,SAAS,iBAAT,QAAkC,mBAAlC;AAGA;;;;AAIG;;AACH,OAAO,IAAM,kBAAkB,GAAG,UAAC,OAAD,EAA2C;AAA1C,MAAA,OAAA,KAAA,KAAA,CAAA,EAAA;AAAA,IAAA,OAAA,GAAA,EAAA;AAA0C;;AAC3E,MAAM,WAAW,GAAA,QAAA,CAAA;AACf,IAAA,IAAI,EAAE,KADS;AAEf,IAAA,OAAO,EAAE,YAAA;AAAM,aAAA,IAAA;AAAI,KAFJ;AAGf,IAAA,UAAU,EAAE;AAAE,MAAA,OAAO,EAAE;AAAX,KAHG;AAIf,IAAA,UAAU,EAAE;AAAE,MAAA,OAAO,EAAE;AAAX,KAJG;AAKf,IAAA,QAAQ,EAAE;AAAE,MAAA,OAAO,EAAE;AAAX,KALK;AAMf,IAAA,aAAa,EAAE,KANA;AAOf,IAAA,WAAW,EAAE,KAPE;AAQf,IAAA,IAAI,EAAE;AARS,GAAA,EASZ,OATY,CAAjB,CAD2E,CAY3E;;;AACC,EAAA,iBAA+B,CAAC,kBAAhC,CAAmD,UAAC,QAAD,EAAgD;AAClG,WAAO,QAAQ,CAAC,WAAD,CAAf;AACD,GAFA;AAGF,CAhBM","sourceRoot":""}
|
@@ -1,100 +0,0 @@
|
|
1
|
-
import * as React from 'react';
|
2
|
-
import type { PopperVirtualElement, PositioningShorthand, usePopperMouseTarget } from '@fluentui/react-positioning';
|
3
|
-
import type { PortalProps } from '@fluentui/react-portal';
|
4
|
-
/**
|
5
|
-
* Determines popover padding and arrow size
|
6
|
-
*/
|
7
|
-
export declare type PopoverSize = 'small' | 'medium' | 'large';
|
8
|
-
export declare type PopoverCommons = Pick<PortalProps, 'mountNode'> & {
|
9
|
-
/**
|
10
|
-
* Controls the opening of the Popover
|
11
|
-
*/
|
12
|
-
open: boolean;
|
13
|
-
/**
|
14
|
-
* Used to set the initial open state of the Popover in uncontrolled mode
|
15
|
-
*/
|
16
|
-
defaultOpen?: boolean;
|
17
|
-
/**
|
18
|
-
* Call back when the component requests to change value
|
19
|
-
* The `open` value is used as a hint when directly controlling the component
|
20
|
-
*/
|
21
|
-
onOpenChange?: (e: OpenPopoverEvents, data: OnOpenChangeData) => void;
|
22
|
-
/**
|
23
|
-
* Flag to open the Popover by hovering the trigger
|
24
|
-
*/
|
25
|
-
openOnHover?: boolean;
|
26
|
-
/**
|
27
|
-
* Flag to open the Popover as a context menu. Disables all other interactions
|
28
|
-
*/
|
29
|
-
openOnContext?: boolean;
|
30
|
-
/**
|
31
|
-
* Do not display the arrow
|
32
|
-
*/
|
33
|
-
noArrow?: boolean;
|
34
|
-
/**
|
35
|
-
* Determines popover padding and arrow size
|
36
|
-
* @default medium
|
37
|
-
*/
|
38
|
-
size?: PopoverSize;
|
39
|
-
/**
|
40
|
-
* A popover can appear styled with brand or inverted.
|
41
|
-
* When not specified, the default style is used.
|
42
|
-
*/
|
43
|
-
appearance?: 'brand' | 'inverted';
|
44
|
-
/**
|
45
|
-
* Should trap focus
|
46
|
-
*/
|
47
|
-
trapFocus?: boolean;
|
48
|
-
/**
|
49
|
-
* Configures the position of the Popover
|
50
|
-
*/
|
51
|
-
positioning?: PositioningShorthand;
|
52
|
-
};
|
53
|
-
/**
|
54
|
-
* Popover Props
|
55
|
-
*/
|
56
|
-
export declare type PopoverProps = Partial<PopoverCommons> & {
|
57
|
-
/**
|
58
|
-
* Can contain two children including {@link PopoverTrigger} and {@link PopoverPopover}.
|
59
|
-
* Alternatively can only contain {@link PopoverPopover} if using a custom `target`.
|
60
|
-
*/
|
61
|
-
children: [JSX.Element, JSX.Element] | JSX.Element;
|
62
|
-
};
|
63
|
-
/**
|
64
|
-
* Popover State
|
65
|
-
*/
|
66
|
-
export declare type PopoverState = PopoverCommons & Pick<PopoverProps, 'children'> & {
|
67
|
-
/**
|
68
|
-
* Callback to open/close the Popover
|
69
|
-
*/
|
70
|
-
setOpen: (e: OpenPopoverEvents, open: boolean) => void;
|
71
|
-
/**
|
72
|
-
* Ref of the PopoverTrigger
|
73
|
-
*/
|
74
|
-
triggerRef: React.MutableRefObject<HTMLElement | null>;
|
75
|
-
/**
|
76
|
-
* Ref of the PopoverSurface
|
77
|
-
*/
|
78
|
-
contentRef: React.MutableRefObject<HTMLElement | null>;
|
79
|
-
/**
|
80
|
-
* Ref of the pointing arrow
|
81
|
-
*/
|
82
|
-
arrowRef: React.MutableRefObject<HTMLDivElement | null>;
|
83
|
-
/**
|
84
|
-
* Anchors the popper to the mouse click for context events
|
85
|
-
*/
|
86
|
-
contextTarget: PopperVirtualElement | undefined;
|
87
|
-
/**
|
88
|
-
* A callback to set the target of the popper to the mouse click for context events
|
89
|
-
*/
|
90
|
-
setContextTarget: ReturnType<typeof usePopperMouseTarget>[1];
|
91
|
-
size: NonNullable<PopoverProps['size']>;
|
92
|
-
};
|
93
|
-
/**
|
94
|
-
* Data attached to open/close events
|
95
|
-
*/
|
96
|
-
export declare type OnOpenChangeData = Pick<PopoverState, 'open'>;
|
97
|
-
/**
|
98
|
-
* The supported events that will trigger open/close of the menu
|
99
|
-
*/
|
100
|
-
export declare type OpenPopoverEvents = MouseEvent | TouchEvent | React.MouseEvent<HTMLElement> | React.KeyboardEvent<HTMLElement> | React.FocusEvent<HTMLElement>;
|
@@ -1,10 +0,0 @@
|
|
1
|
-
import type { PopoverProps, PopoverState } from './Popover.types';
|
2
|
-
/**
|
3
|
-
* Create the state required to render Popover.
|
4
|
-
*
|
5
|
-
* The returned state can be modified with hooks such as usePopoverStyles,
|
6
|
-
* before being passed to renderPopover.
|
7
|
-
*
|
8
|
-
* @param props - props from this instance of Popover
|
9
|
-
*/
|
10
|
-
export declare const usePopover: (props: PopoverProps) => PopoverState;
|
@@ -1,6 +0,0 @@
|
|
1
|
-
import type { PopoverSurfaceProps } from './PopoverSurface.types';
|
2
|
-
import type { ForwardRefComponent } from '@fluentui/react-utilities';
|
3
|
-
/**
|
4
|
-
* PopoverSurface component renders react children in a positioned box
|
5
|
-
*/
|
6
|
-
export declare const PopoverSurface: ForwardRefComponent<PopoverSurfaceProps>;
|
@@ -1,21 +0,0 @@
|
|
1
|
-
import type { ComponentProps, ComponentState, IntrinsicShorthandProps } from '@fluentui/react-utilities';
|
2
|
-
import type { PopoverContextValue } from '../../popoverContext';
|
3
|
-
/**
|
4
|
-
* PopoverSurface Props
|
5
|
-
*/
|
6
|
-
export declare type PopoverSurfaceProps = ComponentProps<PopoverSurfaceSlots>;
|
7
|
-
/**
|
8
|
-
* Names of the slots in PopoverSurfaceProps
|
9
|
-
*/
|
10
|
-
export declare type PopoverSurfaceSlots = {
|
11
|
-
root: IntrinsicShorthandProps<'div'>;
|
12
|
-
};
|
13
|
-
/**
|
14
|
-
* PopoverSurface State
|
15
|
-
*/
|
16
|
-
export declare type PopoverSurfaceState = ComponentState<PopoverSurfaceSlots> & Pick<PopoverContextValue, 'open' | 'mountNode' | 'noArrow' | 'size' | 'appearance' | 'arrowRef'> & {
|
17
|
-
/**
|
18
|
-
* CSS class for the arrow element
|
19
|
-
*/
|
20
|
-
arrowClassName?: string;
|
21
|
-
};
|
@@ -1,13 +0,0 @@
|
|
1
|
-
import * as React from 'react';
|
2
|
-
import type { PopoverSurfaceProps, PopoverSurfaceSlots, PopoverSurfaceState } from './PopoverSurface.types';
|
3
|
-
export declare const popoverSurfaceSlots: Array<keyof PopoverSurfaceSlots>;
|
4
|
-
/**
|
5
|
-
* Create the state required to render PopoverSurface.
|
6
|
-
*
|
7
|
-
* The returned state can be modified with hooks such as usePopoverSurfaceStyles,
|
8
|
-
* before being passed to renderPopoverSurface.
|
9
|
-
*
|
10
|
-
* @param props - props from this instance of PopoverSurface
|
11
|
-
* @param ref - reference to root HTMLDivElement of PopoverSurface
|
12
|
-
*/
|
13
|
-
export declare const usePopoverSurface: (props: PopoverSurfaceProps, ref: React.Ref<HTMLDivElement>) => PopoverSurfaceState;
|
@@ -1,7 +0,0 @@
|
|
1
|
-
import type { PopoverSize } from '../Popover/Popover.types';
|
2
|
-
import type { PopoverSurfaceState } from './PopoverSurface.types';
|
3
|
-
export declare const arrowHeights: Record<PopoverSize, number>;
|
4
|
-
/**
|
5
|
-
* Apply styling to the PopoverSurface slots based on the state
|
6
|
-
*/
|
7
|
-
export declare const usePopoverSurfaceStyles: (state: PopoverSurfaceState) => PopoverSurfaceState;
|
@@ -1,6 +0,0 @@
|
|
1
|
-
import * as React from 'react';
|
2
|
-
import type { PopoverTriggerProps } from './PopoverTrigger.types';
|
3
|
-
/**
|
4
|
-
* Wraps a trigger element as an only child and adds the necessary event handling to open a popover.
|
5
|
-
*/
|
6
|
-
export declare const PopoverTrigger: React.FC<PopoverTriggerProps>;
|
@@ -1,10 +0,0 @@
|
|
1
|
-
import type { PopoverTriggerProps, PopoverTriggerState } from './PopoverTrigger.types';
|
2
|
-
/**
|
3
|
-
* Create the state required to render PopoverTrigger.
|
4
|
-
*
|
5
|
-
* The returned state can be modified with hooks such as usePopoverTriggerStyles,
|
6
|
-
* before being passed to renderPopoverTrigger.
|
7
|
-
*
|
8
|
-
* @param props - props from this instance of PopoverTrigger
|
9
|
-
*/
|
10
|
-
export declare const usePopoverTrigger: (props: PopoverTriggerProps) => PopoverTriggerState;
|
package/lib/index.d.ts
DELETED
package/lib/popoverContext.d.ts
DELETED
@@ -1,8 +0,0 @@
|
|
1
|
-
import type { ContextSelector, Context } from '@fluentui/react-context-selector';
|
2
|
-
import type { PopoverState } from './components/Popover/index';
|
3
|
-
export declare const PopoverContext: Context<PopoverContextValue>;
|
4
|
-
/**
|
5
|
-
* Context shared between Popover and its children components
|
6
|
-
*/
|
7
|
-
export declare type PopoverContextValue = Pick<PopoverState, 'open' | 'setOpen' | 'triggerRef' | 'contentRef' | 'openOnHover' | 'openOnContext' | 'mountNode' | 'noArrow' | 'arrowRef' | 'size' | 'appearance' | 'trapFocus'>;
|
8
|
-
export declare const usePopoverContext: <T>(selector: ContextSelector<Pick<PopoverState, "mountNode" | "open" | "setOpen" | "triggerRef" | "contentRef" | "openOnHover" | "openOnContext" | "noArrow" | "arrowRef" | "size" | "appearance" | "trapFocus">, T>) => T;
|
@@ -1 +0,0 @@
|
|
1
|
-
export * from './components/Popover/index';
|
@@ -1 +0,0 @@
|
|
1
|
-
export * from './components/PopoverSurface/index';
|
@@ -1 +0,0 @@
|
|
1
|
-
export * from './components/PopoverTrigger/index';
|
@@ -1,24 +0,0 @@
|
|
1
|
-
"use strict";
|
2
|
-
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
4
|
-
value: true
|
5
|
-
});
|
6
|
-
exports.isConformant = void 0;
|
7
|
-
|
8
|
-
var react_conformance_1 = /*#__PURE__*/require("@fluentui/react-conformance");
|
9
|
-
|
10
|
-
var react_conformance_make_styles_1 = /*#__PURE__*/require("@fluentui/react-conformance-make-styles");
|
11
|
-
|
12
|
-
function isConformant(testInfo) {
|
13
|
-
var defaultOptions = {
|
14
|
-
asPropHandlesRef: true,
|
15
|
-
componentPath: module.parent.filename.replace('.test', ''),
|
16
|
-
// TODO // https://github.com/microsoft/fluentui/issues/19522
|
17
|
-
skipAsPropTests: true,
|
18
|
-
extraTests: react_conformance_make_styles_1.default
|
19
|
-
};
|
20
|
-
react_conformance_1.isConformant(defaultOptions, testInfo);
|
21
|
-
}
|
22
|
-
|
23
|
-
exports.isConformant = isConformant;
|
24
|
-
//# sourceMappingURL=isConformant.js.map
|
@@ -1 +0,0 @@
|
|
1
|
-
{"version":3,"sources":["../../src/common/isConformant.ts"],"names":[],"mappings":";;;;;;;AAAA,IAAA,mBAAA,gBAAA,OAAA,CAAA,6BAAA,CAAA;;AAEA,IAAA,+BAAA,gBAAA,OAAA,CAAA,yCAAA,CAAA;;AAEA,SAAgB,YAAhB,CACE,QADF,EAC2F;AAEzF,MAAM,cAAc,GAAyC;AAC3D,IAAA,gBAAgB,EAAE,IADyC;AAE3D,IAAA,aAAa,EAAE,MAAO,CAAC,MAAR,CAAgB,QAAhB,CAAyB,OAAzB,CAAiC,OAAjC,EAA0C,EAA1C,CAF4C;AAG3D;AACA,IAAA,eAAe,EAAE,IAJ0C;AAK3D,IAAA,UAAU,EAAE,+BAAA,CAAA;AAL+C,GAA7D;AAQA,EAAA,mBAAA,CAAA,YAAA,CAAiB,cAAjB,EAAiC,QAAjC;AACD;;AAZD,OAAA,CAAA,YAAA,GAAA,YAAA","sourceRoot":""}
|
@@ -1,7 +0,0 @@
|
|
1
|
-
import type { PopoverContextValue } from '../popoverContext';
|
2
|
-
/**
|
3
|
-
* A test utility to mock the usePopoverContext hook that relies on context selector
|
4
|
-
* Don't forget to call `jest.mock(**\/popupContext.ts)` while using this
|
5
|
-
* @param options Popover context values to set for testing
|
6
|
-
*/
|
7
|
-
export declare const mockPopoverContext: (options?: Partial<PopoverContextValue>) => void;
|
@@ -1,49 +0,0 @@
|
|
1
|
-
"use strict";
|
2
|
-
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
4
|
-
value: true
|
5
|
-
});
|
6
|
-
exports.mockPopoverContext = void 0;
|
7
|
-
|
8
|
-
var tslib_1 = /*#__PURE__*/require("tslib");
|
9
|
-
|
10
|
-
var popoverContext_1 = /*#__PURE__*/require("../popoverContext");
|
11
|
-
/**
|
12
|
-
* A test utility to mock the usePopoverContext hook that relies on context selector
|
13
|
-
* Don't forget to call `jest.mock(**\/popupContext.ts)` while using this
|
14
|
-
* @param options Popover context values to set for testing
|
15
|
-
*/
|
16
|
-
|
17
|
-
|
18
|
-
var mockPopoverContext = function (options) {
|
19
|
-
if (options === void 0) {
|
20
|
-
options = {};
|
21
|
-
}
|
22
|
-
|
23
|
-
var mockContext = tslib_1.__assign({
|
24
|
-
open: false,
|
25
|
-
setOpen: function () {
|
26
|
-
return null;
|
27
|
-
},
|
28
|
-
triggerRef: {
|
29
|
-
current: null
|
30
|
-
},
|
31
|
-
contentRef: {
|
32
|
-
current: null
|
33
|
-
},
|
34
|
-
arrowRef: {
|
35
|
-
current: null
|
36
|
-
},
|
37
|
-
openOnContext: false,
|
38
|
-
openOnHover: false,
|
39
|
-
size: 'medium'
|
40
|
-
}, options); // eslint-disable-next-line @typescript-eslint/no-explicit-any
|
41
|
-
|
42
|
-
|
43
|
-
popoverContext_1.usePopoverContext.mockImplementation(function (selector) {
|
44
|
-
return selector(mockContext);
|
45
|
-
});
|
46
|
-
};
|
47
|
-
|
48
|
-
exports.mockPopoverContext = mockPopoverContext;
|
49
|
-
//# sourceMappingURL=mockUsePopoverContext.js.map
|
@@ -1 +0,0 @@
|
|
1
|
-
{"version":3,"sources":["../../src/common/mockUsePopoverContext.ts"],"names":[],"mappings":";;;;;;;;;AAAA,IAAA,gBAAA,gBAAA,OAAA,CAAA,mBAAA,CAAA;AAGA;;;;AAIG;;;AACI,IAAM,kBAAkB,GAAG,UAAC,OAAD,EAA2C;AAA1C,MAAA,OAAA,KAAA,KAAA,CAAA,EAAA;AAAA,IAAA,OAAA,GAAA,EAAA;AAA0C;;AAC3E,MAAM,WAAW,GAAA,OAAA,CAAA,QAAA,CAAA;AACf,IAAA,IAAI,EAAE,KADS;AAEf,IAAA,OAAO,EAAE,YAAA;AAAM,aAAA,IAAA;AAAI,KAFJ;AAGf,IAAA,UAAU,EAAE;AAAE,MAAA,OAAO,EAAE;AAAX,KAHG;AAIf,IAAA,UAAU,EAAE;AAAE,MAAA,OAAO,EAAE;AAAX,KAJG;AAKf,IAAA,QAAQ,EAAE;AAAE,MAAA,OAAO,EAAE;AAAX,KALK;AAMf,IAAA,aAAa,EAAE,KANA;AAOf,IAAA,WAAW,EAAE,KAPE;AAQf,IAAA,IAAI,EAAE;AARS,GAAA,EASZ,OATY,CAAjB,CAD2E,CAY3E;;;AACC,EAAA,gBAAA,CAAA,iBAAA,CAAgC,kBAAhC,CAAmD,UAAC,QAAD,EAAgD;AAClG,WAAO,QAAQ,CAAC,WAAD,CAAf;AACD,GAFA;AAGF,CAhBM;;AAAM,OAAA,CAAA,kBAAA,GAAkB,kBAAlB","sourceRoot":""}
|
@@ -1,100 +0,0 @@
|
|
1
|
-
import * as React from 'react';
|
2
|
-
import type { PopperVirtualElement, PositioningShorthand, usePopperMouseTarget } from '@fluentui/react-positioning';
|
3
|
-
import type { PortalProps } from '@fluentui/react-portal';
|
4
|
-
/**
|
5
|
-
* Determines popover padding and arrow size
|
6
|
-
*/
|
7
|
-
export declare type PopoverSize = 'small' | 'medium' | 'large';
|
8
|
-
export declare type PopoverCommons = Pick<PortalProps, 'mountNode'> & {
|
9
|
-
/**
|
10
|
-
* Controls the opening of the Popover
|
11
|
-
*/
|
12
|
-
open: boolean;
|
13
|
-
/**
|
14
|
-
* Used to set the initial open state of the Popover in uncontrolled mode
|
15
|
-
*/
|
16
|
-
defaultOpen?: boolean;
|
17
|
-
/**
|
18
|
-
* Call back when the component requests to change value
|
19
|
-
* The `open` value is used as a hint when directly controlling the component
|
20
|
-
*/
|
21
|
-
onOpenChange?: (e: OpenPopoverEvents, data: OnOpenChangeData) => void;
|
22
|
-
/**
|
23
|
-
* Flag to open the Popover by hovering the trigger
|
24
|
-
*/
|
25
|
-
openOnHover?: boolean;
|
26
|
-
/**
|
27
|
-
* Flag to open the Popover as a context menu. Disables all other interactions
|
28
|
-
*/
|
29
|
-
openOnContext?: boolean;
|
30
|
-
/**
|
31
|
-
* Do not display the arrow
|
32
|
-
*/
|
33
|
-
noArrow?: boolean;
|
34
|
-
/**
|
35
|
-
* Determines popover padding and arrow size
|
36
|
-
* @default medium
|
37
|
-
*/
|
38
|
-
size?: PopoverSize;
|
39
|
-
/**
|
40
|
-
* A popover can appear styled with brand or inverted.
|
41
|
-
* When not specified, the default style is used.
|
42
|
-
*/
|
43
|
-
appearance?: 'brand' | 'inverted';
|
44
|
-
/**
|
45
|
-
* Should trap focus
|
46
|
-
*/
|
47
|
-
trapFocus?: boolean;
|
48
|
-
/**
|
49
|
-
* Configures the position of the Popover
|
50
|
-
*/
|
51
|
-
positioning?: PositioningShorthand;
|
52
|
-
};
|
53
|
-
/**
|
54
|
-
* Popover Props
|
55
|
-
*/
|
56
|
-
export declare type PopoverProps = Partial<PopoverCommons> & {
|
57
|
-
/**
|
58
|
-
* Can contain two children including {@link PopoverTrigger} and {@link PopoverPopover}.
|
59
|
-
* Alternatively can only contain {@link PopoverPopover} if using a custom `target`.
|
60
|
-
*/
|
61
|
-
children: [JSX.Element, JSX.Element] | JSX.Element;
|
62
|
-
};
|
63
|
-
/**
|
64
|
-
* Popover State
|
65
|
-
*/
|
66
|
-
export declare type PopoverState = PopoverCommons & Pick<PopoverProps, 'children'> & {
|
67
|
-
/**
|
68
|
-
* Callback to open/close the Popover
|
69
|
-
*/
|
70
|
-
setOpen: (e: OpenPopoverEvents, open: boolean) => void;
|
71
|
-
/**
|
72
|
-
* Ref of the PopoverTrigger
|
73
|
-
*/
|
74
|
-
triggerRef: React.MutableRefObject<HTMLElement | null>;
|
75
|
-
/**
|
76
|
-
* Ref of the PopoverSurface
|
77
|
-
*/
|
78
|
-
contentRef: React.MutableRefObject<HTMLElement | null>;
|
79
|
-
/**
|
80
|
-
* Ref of the pointing arrow
|
81
|
-
*/
|
82
|
-
arrowRef: React.MutableRefObject<HTMLDivElement | null>;
|
83
|
-
/**
|
84
|
-
* Anchors the popper to the mouse click for context events
|
85
|
-
*/
|
86
|
-
contextTarget: PopperVirtualElement | undefined;
|
87
|
-
/**
|
88
|
-
* A callback to set the target of the popper to the mouse click for context events
|
89
|
-
*/
|
90
|
-
setContextTarget: ReturnType<typeof usePopperMouseTarget>[1];
|
91
|
-
size: NonNullable<PopoverProps['size']>;
|
92
|
-
};
|
93
|
-
/**
|
94
|
-
* Data attached to open/close events
|
95
|
-
*/
|
96
|
-
export declare type OnOpenChangeData = Pick<PopoverState, 'open'>;
|
97
|
-
/**
|
98
|
-
* The supported events that will trigger open/close of the menu
|
99
|
-
*/
|
100
|
-
export declare type OpenPopoverEvents = MouseEvent | TouchEvent | React.MouseEvent<HTMLElement> | React.KeyboardEvent<HTMLElement> | React.FocusEvent<HTMLElement>;
|