@fluentui/react-popover 9.0.0-alpha.8 → 9.0.0-nightly.f81b28ceb3.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 +1800 -1
- package/CHANGELOG.md +566 -2
- package/Spec.md +6 -6
- package/dist/react-popover.d.ts +59 -77
- package/lib/Popover.js.map +1 -1
- package/lib/PopoverSurface.js.map +1 -1
- package/lib/PopoverTrigger.js.map +1 -1
- package/lib/common/isConformant.d.ts +1 -1
- package/lib/common/isConformant.js +9 -5
- package/lib/common/isConformant.js.map +1 -1
- package/lib/common/mockUsePopoverContext.d.ts +1 -1
- package/lib/common/mockUsePopoverContext.js +28 -6
- package/lib/common/mockUsePopoverContext.js.map +1 -1
- package/lib/components/Popover/Popover.d.ts +2 -2
- package/lib/components/Popover/Popover.js +4 -3
- package/lib/components/Popover/Popover.js.map +1 -1
- package/lib/components/Popover/Popover.types.d.ts +24 -33
- package/lib/components/Popover/Popover.types.js.map +1 -1
- package/lib/components/Popover/index.js.map +1 -1
- package/lib/components/Popover/renderPopover.d.ts +1 -1
- package/lib/components/Popover/renderPopover.js +29 -17
- package/lib/components/Popover/renderPopover.js.map +1 -1
- package/lib/components/Popover/usePopover.d.ts +2 -3
- package/lib/components/Popover/usePopover.js +110 -88
- package/lib/components/Popover/usePopover.js.map +1 -1
- package/lib/components/PopoverSurface/PopoverSurface.d.ts +3 -3
- package/lib/components/PopoverSurface/PopoverSurface.js +5 -4
- package/lib/components/PopoverSurface/PopoverSurface.js.map +1 -1
- package/lib/components/PopoverSurface/PopoverSurface.types.d.ts +9 -18
- package/lib/components/PopoverSurface/PopoverSurface.types.js.map +1 -1
- package/lib/components/PopoverSurface/index.js.map +1 -1
- package/lib/components/PopoverSurface/renderPopoverSurface.d.ts +1 -1
- package/lib/components/PopoverSurface/renderPopoverSurface.js +18 -10
- package/lib/components/PopoverSurface/renderPopoverSurface.js.map +1 -1
- package/lib/components/PopoverSurface/usePopoverSurface.d.ts +4 -4
- package/lib/components/PopoverSurface/usePopoverSurface.js +94 -54
- package/lib/components/PopoverSurface/usePopoverSurface.js.map +1 -1
- package/lib/components/PopoverSurface/usePopoverSurfaceStyles.d.ts +2 -2
- package/lib/components/PopoverSurface/usePopoverSurfaceStyles.js +88 -64
- package/lib/components/PopoverSurface/usePopoverSurfaceStyles.js.map +1 -1
- package/lib/components/PopoverTrigger/PopoverTrigger.d.ts +2 -2
- package/lib/components/PopoverTrigger/PopoverTrigger.js +4 -3
- package/lib/components/PopoverTrigger/PopoverTrigger.js.map +1 -1
- package/lib/components/PopoverTrigger/PopoverTrigger.types.d.ts +3 -4
- package/lib/components/PopoverTrigger/PopoverTrigger.types.js.map +1 -1
- package/lib/components/PopoverTrigger/index.js.map +1 -1
- package/lib/components/PopoverTrigger/renderPopoverTrigger.d.ts +1 -1
- package/lib/components/PopoverTrigger/renderPopoverTrigger.js +1 -1
- package/lib/components/PopoverTrigger/renderPopoverTrigger.js.map +1 -1
- package/lib/components/PopoverTrigger/usePopoverTrigger.d.ts +2 -3
- package/lib/components/PopoverTrigger/usePopoverTrigger.js +83 -60
- package/lib/components/PopoverTrigger/usePopoverTrigger.js.map +1 -1
- package/lib/index.js.map +1 -1
- package/lib/popoverContext.d.ts +4 -5
- package/lib/popoverContext.js +19 -12
- package/lib/popoverContext.js.map +1 -1
- package/lib/tsdoc-metadata.json +1 -1
- package/lib-commonjs/Popover.js +7 -2
- package/lib-commonjs/Popover.js.map +1 -1
- package/lib-commonjs/PopoverSurface.js +7 -2
- package/lib-commonjs/PopoverSurface.js.map +1 -1
- package/lib-commonjs/PopoverTrigger.js +7 -2
- package/lib-commonjs/PopoverTrigger.js.map +1 -1
- package/lib-commonjs/common/isConformant.d.ts +1 -1
- package/lib-commonjs/common/isConformant.js +18 -7
- package/lib-commonjs/common/isConformant.js.map +1 -1
- package/lib-commonjs/common/mockUsePopoverContext.d.ts +1 -1
- package/lib-commonjs/common/mockUsePopoverContext.js +38 -9
- package/lib-commonjs/common/mockUsePopoverContext.js.map +1 -1
- package/lib-commonjs/components/Popover/Popover.d.ts +2 -2
- package/lib-commonjs/components/Popover/Popover.js +14 -6
- package/lib-commonjs/components/Popover/Popover.js.map +1 -1
- package/lib-commonjs/components/Popover/Popover.types.d.ts +24 -33
- package/lib-commonjs/components/Popover/Popover.types.js +4 -1
- package/lib-commonjs/components/Popover/Popover.types.js.map +1 -1
- package/lib-commonjs/components/Popover/index.js +10 -2
- package/lib-commonjs/components/Popover/index.js.map +1 -1
- package/lib-commonjs/components/Popover/renderPopover.d.ts +1 -1
- package/lib-commonjs/components/Popover/renderPopover.js +39 -20
- package/lib-commonjs/components/Popover/renderPopover.js.map +1 -1
- package/lib-commonjs/components/Popover/usePopover.d.ts +2 -3
- package/lib-commonjs/components/Popover/usePopover.js +127 -93
- package/lib-commonjs/components/Popover/usePopover.js.map +1 -1
- package/lib-commonjs/components/PopoverSurface/PopoverSurface.d.ts +3 -3
- package/lib-commonjs/components/PopoverSurface/PopoverSurface.js +18 -9
- package/lib-commonjs/components/PopoverSurface/PopoverSurface.js.map +1 -1
- package/lib-commonjs/components/PopoverSurface/PopoverSurface.types.d.ts +9 -18
- package/lib-commonjs/components/PopoverSurface/PopoverSurface.types.js +4 -1
- package/lib-commonjs/components/PopoverSurface/PopoverSurface.types.js.map +1 -1
- package/lib-commonjs/components/PopoverSurface/index.js +11 -2
- package/lib-commonjs/components/PopoverSurface/index.js.map +1 -1
- package/lib-commonjs/components/PopoverSurface/renderPopoverSurface.d.ts +1 -1
- package/lib-commonjs/components/PopoverSurface/renderPopoverSurface.js +32 -14
- package/lib-commonjs/components/PopoverSurface/renderPopoverSurface.js.map +1 -1
- package/lib-commonjs/components/PopoverSurface/usePopoverSurface.d.ts +4 -4
- package/lib-commonjs/components/PopoverSurface/usePopoverSurface.js +110 -60
- package/lib-commonjs/components/PopoverSurface/usePopoverSurface.js.map +1 -1
- package/lib-commonjs/components/PopoverSurface/usePopoverSurfaceStyles.d.ts +2 -2
- package/lib-commonjs/components/PopoverSurface/usePopoverSurfaceStyles.js +95 -65
- package/lib-commonjs/components/PopoverSurface/usePopoverSurfaceStyles.js.map +1 -1
- package/lib-commonjs/components/PopoverTrigger/PopoverTrigger.d.ts +2 -2
- package/lib-commonjs/components/PopoverTrigger/PopoverTrigger.js +14 -6
- package/lib-commonjs/components/PopoverTrigger/PopoverTrigger.js.map +1 -1
- package/lib-commonjs/components/PopoverTrigger/PopoverTrigger.types.d.ts +3 -4
- package/lib-commonjs/components/PopoverTrigger/PopoverTrigger.types.js +4 -1
- package/lib-commonjs/components/PopoverTrigger/PopoverTrigger.types.js.map +1 -1
- package/lib-commonjs/components/PopoverTrigger/index.js +10 -2
- package/lib-commonjs/components/PopoverTrigger/index.js.map +1 -1
- package/lib-commonjs/components/PopoverTrigger/renderPopoverTrigger.d.ts +1 -1
- package/lib-commonjs/components/PopoverTrigger/renderPopoverTrigger.js +7 -2
- package/lib-commonjs/components/PopoverTrigger/renderPopoverTrigger.js.map +1 -1
- package/lib-commonjs/components/PopoverTrigger/usePopoverTrigger.d.ts +2 -3
- package/lib-commonjs/components/PopoverTrigger/usePopoverTrigger.js +98 -65
- package/lib-commonjs/components/PopoverTrigger/usePopoverTrigger.js.map +1 -1
- package/lib-commonjs/index.js +10 -2
- package/lib-commonjs/index.js.map +1 -1
- package/lib-commonjs/popoverContext.d.ts +4 -5
- package/lib-commonjs/popoverContext.js +28 -14
- package/lib-commonjs/popoverContext.js.map +1 -1
- package/package.json +18 -15
- package/.storybook/main.js +0 -11
- package/.storybook/preview.js +0 -4
- package/bundle-size/Popover.fixture.js +0 -7
- package/config/api-extractor.json +0 -3
- package/config/tests.js +0 -7
- package/e2e/Popover.e2e.ts +0 -139
- package/etc/react-popover.api.md +0 -135
- package/just.config.ts +0 -3
- package/lib/Popover.stories.d.ts +0 -62
- package/lib/Popover.stories.js +0 -114
- package/lib/Popover.stories.js.map +0 -1
- package/lib/components/Popover/getOffsetWithArrow.d.ts +0 -7
- package/lib/components/Popover/getOffsetWithArrow.js +0 -34
- package/lib/components/Popover/getOffsetWithArrow.js.map +0 -1
- package/lib-amd/Popover.d.ts +0 -1
- package/lib-amd/Popover.js +0 -6
- package/lib-amd/Popover.js.map +0 -1
- package/lib-amd/Popover.stories.d.ts +0 -62
- package/lib-amd/Popover.stories.js +0 -121
- package/lib-amd/Popover.stories.js.map +0 -1
- package/lib-amd/PopoverSurface.d.ts +0 -1
- package/lib-amd/PopoverSurface.js +0 -6
- package/lib-amd/PopoverSurface.js.map +0 -1
- package/lib-amd/PopoverTrigger.d.ts +0 -1
- package/lib-amd/PopoverTrigger.js +0 -6
- package/lib-amd/PopoverTrigger.js.map +0 -1
- package/lib-amd/common/isConformant.d.ts +0 -4
- package/lib-amd/common/isConformant.js +0 -14
- package/lib-amd/common/isConformant.js.map +0 -1
- package/lib-amd/common/mockUsePopoverContext.d.ts +0 -7
- package/lib-amd/common/mockUsePopoverContext.js +0 -20
- package/lib-amd/common/mockUsePopoverContext.js.map +0 -1
- package/lib-amd/components/Popover/Popover.d.ts +0 -6
- package/lib-amd/components/Popover/Popover.js +0 -15
- package/lib-amd/components/Popover/Popover.js.map +0 -1
- package/lib-amd/components/Popover/Popover.types.d.ts +0 -109
- package/lib-amd/components/Popover/Popover.types.js +0 -5
- package/lib-amd/components/Popover/Popover.types.js.map +0 -1
- package/lib-amd/components/Popover/getOffsetWithArrow.d.ts +0 -7
- package/lib-amd/components/Popover/getOffsetWithArrow.js +0 -40
- package/lib-amd/components/Popover/getOffsetWithArrow.js.map +0 -1
- package/lib-amd/components/Popover/index.d.ts +0 -4
- package/lib-amd/components/Popover/index.js +0 -9
- package/lib-amd/components/Popover/index.js.map +0 -1
- package/lib-amd/components/Popover/renderPopover.d.ts +0 -5
- package/lib-amd/components/Popover/renderPopover.js +0 -29
- package/lib-amd/components/Popover/renderPopover.js.map +0 -1
- package/lib-amd/components/Popover/usePopover.d.ts +0 -11
- package/lib-amd/components/Popover/usePopover.js +0 -112
- package/lib-amd/components/Popover/usePopover.js.map +0 -1
- package/lib-amd/components/PopoverSurface/PopoverSurface.d.ts +0 -6
- package/lib-amd/components/PopoverSurface/PopoverSurface.js +0 -15
- package/lib-amd/components/PopoverSurface/PopoverSurface.js.map +0 -1
- package/lib-amd/components/PopoverSurface/PopoverSurface.types.d.ts +0 -30
- package/lib-amd/components/PopoverSurface/PopoverSurface.types.js +0 -5
- package/lib-amd/components/PopoverSurface/PopoverSurface.types.js.map +0 -1
- package/lib-amd/components/PopoverSurface/index.d.ts +0 -5
- package/lib-amd/components/PopoverSurface/index.js +0 -10
- package/lib-amd/components/PopoverSurface/index.js.map +0 -1
- package/lib-amd/components/PopoverSurface/renderPopoverSurface.d.ts +0 -5
- package/lib-amd/components/PopoverSurface/renderPopoverSurface.js +0 -21
- package/lib-amd/components/PopoverSurface/renderPopoverSurface.js.map +0 -1
- package/lib-amd/components/PopoverSurface/usePopoverSurface.d.ts +0 -13
- package/lib-amd/components/PopoverSurface/usePopoverSurface.js +0 -69
- package/lib-amd/components/PopoverSurface/usePopoverSurface.js.map +0 -1
- package/lib-amd/components/PopoverSurface/usePopoverSurfaceStyles.d.ts +0 -7
- package/lib-amd/components/PopoverSurface/usePopoverSurfaceStyles.js +0 -81
- package/lib-amd/components/PopoverSurface/usePopoverSurfaceStyles.js.map +0 -1
- package/lib-amd/components/PopoverTrigger/PopoverTrigger.d.ts +0 -6
- package/lib-amd/components/PopoverTrigger/PopoverTrigger.js +0 -15
- package/lib-amd/components/PopoverTrigger/PopoverTrigger.js.map +0 -1
- package/lib-amd/components/PopoverTrigger/PopoverTrigger.types.d.ts +0 -12
- package/lib-amd/components/PopoverTrigger/PopoverTrigger.types.js +0 -5
- package/lib-amd/components/PopoverTrigger/PopoverTrigger.types.js.map +0 -1
- package/lib-amd/components/PopoverTrigger/index.d.ts +0 -4
- package/lib-amd/components/PopoverTrigger/index.js +0 -9
- package/lib-amd/components/PopoverTrigger/index.js.map +0 -1
- package/lib-amd/components/PopoverTrigger/renderPopoverTrigger.d.ts +0 -5
- package/lib-amd/components/PopoverTrigger/renderPopoverTrigger.js +0 -13
- package/lib-amd/components/PopoverTrigger/renderPopoverTrigger.js.map +0 -1
- package/lib-amd/components/PopoverTrigger/usePopoverTrigger.d.ts +0 -11
- package/lib-amd/components/PopoverTrigger/usePopoverTrigger.js +0 -75
- package/lib-amd/components/PopoverTrigger/usePopoverTrigger.js.map +0 -1
- package/lib-amd/index.d.ts +0 -4
- package/lib-amd/index.js +0 -9
- package/lib-amd/index.js.map +0 -1
- package/lib-amd/popoverContext.d.ts +0 -9
- package/lib-amd/popoverContext.js +0 -22
- package/lib-amd/popoverContext.js.map +0 -1
- package/lib-commonjs/Popover.stories.d.ts +0 -62
- package/lib-commonjs/Popover.stories.js +0 -122
- package/lib-commonjs/Popover.stories.js.map +0 -1
- package/lib-commonjs/components/Popover/getOffsetWithArrow.d.ts +0 -7
- package/lib-commonjs/components/Popover/getOffsetWithArrow.js +0 -38
- package/lib-commonjs/components/Popover/getOffsetWithArrow.js.map +0 -1
- package/src/components/Popover/Popover.types.ts +0 -124
- package/src/components/PopoverSurface/PopoverSurface.types.ts +0 -36
- package/src/components/PopoverTrigger/PopoverTrigger.types.ts +0 -13
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"isConformant.js","sourceRoot":"../src/","sources":["common/isConformant.ts"],"names":[],"mappings":";;;;IAEA,SAAgB,YAAY,CAC1B,QAAyF;QAEzF,IAAM,cAAc,GAAyC;YAC3D,gBAAgB,EAAE,IAAI;YACtB,aAAa,EAAE,MAAO,CAAC,MAAO,CAAC,QAAQ,CAAC,OAAO,CAAC,OAAO,EAAE,EAAE,CAAC;SAC7D,CAAC;QAEF,gCAAgB,CAAC,cAAc,EAAE,QAAQ,CAAC,CAAC;IAC7C,CAAC;IATD,oCASC","sourcesContent":["import { isConformant as baseIsConformant, IsConformantOptions } from '@fluentui/react-conformance';\n\nexport function isConformant<TProps = {}>(\n testInfo: Omit<IsConformantOptions<TProps>, 'componentPath'> & { componentPath?: string },\n) {\n const defaultOptions: Partial<IsConformantOptions<TProps>> = {\n asPropHandlesRef: true,\n componentPath: module!.parent!.filename.replace('.test', ''),\n };\n\n baseIsConformant(defaultOptions, testInfo);\n}\n"]}
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
import { 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,20 +0,0 @@
|
|
|
1
|
-
define(["require", "exports", "tslib", "../popoverContext"], function (require, exports, tslib_1, popoverContext_1) {
|
|
2
|
-
"use strict";
|
|
3
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
4
|
-
exports.mockPopoverContext = void 0;
|
|
5
|
-
/**
|
|
6
|
-
* A test utility to mock the usePopoverContext hook that relies on context selector
|
|
7
|
-
* Don't forget to call `jest.mock(**\/popupContext.ts)` while using this
|
|
8
|
-
* @param options Popover context values to set for testing
|
|
9
|
-
*/
|
|
10
|
-
var mockPopoverContext = function (options) {
|
|
11
|
-
if (options === void 0) { options = {}; }
|
|
12
|
-
var mockContext = tslib_1.__assign({ open: false, setOpen: function () { return null; }, triggerRef: { current: null }, contentRef: { current: null }, arrowRef: { current: null }, target: undefined, openOnContext: false, openOnHover: false, size: 'medium' }, options);
|
|
13
|
-
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
14
|
-
popoverContext_1.usePopoverContext.mockImplementation(function (selector) {
|
|
15
|
-
return selector(mockContext);
|
|
16
|
-
});
|
|
17
|
-
};
|
|
18
|
-
exports.mockPopoverContext = mockPopoverContext;
|
|
19
|
-
});
|
|
20
|
-
//# sourceMappingURL=mockUsePopoverContext.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"mockUsePopoverContext.js","sourceRoot":"../src/","sources":["common/mockUsePopoverContext.ts"],"names":[],"mappings":";;;;IAEA;;;;OAIG;IACI,IAAM,kBAAkB,GAAG,UAAC,OAA0C;QAA1C,wBAAA,EAAA,YAA0C;QAC3E,IAAM,WAAW,sBACf,IAAI,EAAE,KAAK,EACX,OAAO,EAAE,cAAM,OAAA,IAAI,EAAJ,CAAI,EACnB,UAAU,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,EAC7B,UAAU,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,EAC7B,QAAQ,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,EAC3B,MAAM,EAAE,SAAS,EACjB,aAAa,EAAE,KAAK,EACpB,WAAW,EAAE,KAAK,EAClB,IAAI,EAAE,QAAQ,IACX,OAAO,CACX,CAAC;QACF,8DAA8D;QAC7D,kCAA+B,CAAC,kBAAkB,CAAC,UAAC,QAA+C;YAClG,OAAO,QAAQ,CAAC,WAAW,CAAC,CAAC;QAC/B,CAAC,CAAC,CAAC;IACL,CAAC,CAAC;IAjBW,QAAA,kBAAkB,sBAiB7B","sourcesContent":["import { PopoverContextValue, usePopoverContext } from '../popoverContext';\n\n/**\n * A test utility to mock the usePopoverContext hook that relies on context selector\n * Don't forget to call `jest.mock(**\\/popupContext.ts)` while using this\n * @param options Popover context values to set for testing\n */\nexport const mockPopoverContext = (options: Partial<PopoverContextValue> = {}) => {\n const mockContext: PopoverContextValue = {\n open: false,\n setOpen: () => null,\n triggerRef: { current: null },\n contentRef: { current: null },\n arrowRef: { current: null },\n target: undefined,\n openOnContext: false,\n openOnHover: false,\n size: 'medium',\n ...options,\n };\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n (usePopoverContext as jest.Mock).mockImplementation((selector: (context: PopoverContextValue) => any) => {\n return selector(mockContext);\n });\n};\n"]}
|
|
@@ -1,15 +0,0 @@
|
|
|
1
|
-
define(["require", "exports", "./usePopover", "./renderPopover"], function (require, exports, usePopover_1, renderPopover_1) {
|
|
2
|
-
"use strict";
|
|
3
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
4
|
-
exports.Popover = void 0;
|
|
5
|
-
/**
|
|
6
|
-
* Popover component
|
|
7
|
-
*/
|
|
8
|
-
var Popover = function (props) {
|
|
9
|
-
var state = usePopover_1.usePopover(props);
|
|
10
|
-
return renderPopover_1.renderPopover(state);
|
|
11
|
-
};
|
|
12
|
-
exports.Popover = Popover;
|
|
13
|
-
exports.Popover.displayName = 'Popover';
|
|
14
|
-
});
|
|
15
|
-
//# sourceMappingURL=Popover.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"Popover.js","sourceRoot":"../src/","sources":["components/Popover/Popover.tsx"],"names":[],"mappings":";;;;IAKA;;OAEG;IACI,IAAM,OAAO,GAA2B,UAAA,KAAK;QAClD,IAAM,KAAK,GAAG,uBAAU,CAAC,KAAK,CAAC,CAAC;QAEhC,OAAO,6BAAa,CAAC,KAAK,CAAC,CAAC;IAC9B,CAAC,CAAC;IAJW,QAAA,OAAO,WAIlB;IAEF,eAAO,CAAC,WAAW,GAAG,SAAS,CAAC","sourcesContent":["import * as React from 'react';\nimport { usePopover } from './usePopover';\nimport { PopoverProps } from './Popover.types';\nimport { renderPopover } from './renderPopover';\n\n/**\n * Popover component\n */\nexport const Popover: React.FC<PopoverProps> = props => {\n const state = usePopover(props);\n\n return renderPopover(state);\n};\n\nPopover.displayName = 'Popover';\n"]}
|
|
@@ -1,109 +0,0 @@
|
|
|
1
|
-
import * as React from 'react';
|
|
2
|
-
import { PopperOptions, PopperVirtualElement } from '@fluentui/react-positioning';
|
|
3
|
-
import { PortalProps } from '@fluentui/react-portal';
|
|
4
|
-
import { ComponentState } from '@fluentui/react-utilities';
|
|
5
|
-
/**
|
|
6
|
-
* Determines popover padding and arrow size
|
|
7
|
-
*/
|
|
8
|
-
export declare type PopoverSize = 'small' | 'medium' | 'large';
|
|
9
|
-
/**
|
|
10
|
-
* Popover Props
|
|
11
|
-
*/
|
|
12
|
-
export interface PopoverProps extends Pick<PopperOptions, 'position' | 'align' | 'offset' | 'coverTarget' | 'target'>, Pick<PortalProps, 'mountNode'> {
|
|
13
|
-
children: React.ReactNode;
|
|
14
|
-
/**
|
|
15
|
-
* Controls the opening of the Popover
|
|
16
|
-
*/
|
|
17
|
-
open?: boolean;
|
|
18
|
-
/**
|
|
19
|
-
* Used to set the initial open state of the Popover in uncontrolled mode
|
|
20
|
-
*/
|
|
21
|
-
defaultOpen?: boolean;
|
|
22
|
-
/**
|
|
23
|
-
* Call back when the component requests to change value
|
|
24
|
-
* The `open` value is used as a hint when directly controlling the component
|
|
25
|
-
*/
|
|
26
|
-
onOpenChange?: (e: OpenPopoverEvents, data: OnOpenChangeData) => void;
|
|
27
|
-
/**
|
|
28
|
-
* Flag to open the Popover by hovering the trigger
|
|
29
|
-
*/
|
|
30
|
-
openOnHover?: boolean;
|
|
31
|
-
/**
|
|
32
|
-
* Flag to open the Popover as a context menu. Disables all other interactions
|
|
33
|
-
*/
|
|
34
|
-
openOnContext?: boolean;
|
|
35
|
-
/**
|
|
36
|
-
* Do not display the arrow
|
|
37
|
-
*/
|
|
38
|
-
noArrow?: boolean;
|
|
39
|
-
/**
|
|
40
|
-
* Determines popover padding and arrow size
|
|
41
|
-
* @default medium
|
|
42
|
-
*/
|
|
43
|
-
size?: PopoverSize;
|
|
44
|
-
/**
|
|
45
|
-
* Uses brand colour as background
|
|
46
|
-
* Mutually exclusive with `inverted`
|
|
47
|
-
*/
|
|
48
|
-
brand?: boolean;
|
|
49
|
-
/**
|
|
50
|
-
* Inverts the foreground/background colour of the popover
|
|
51
|
-
* Mutually exclusive with `brand`
|
|
52
|
-
*/
|
|
53
|
-
inverted?: boolean;
|
|
54
|
-
/**
|
|
55
|
-
* Should trap focus
|
|
56
|
-
*/
|
|
57
|
-
trapFocus?: boolean;
|
|
58
|
-
}
|
|
59
|
-
/**
|
|
60
|
-
* Names of the shorthand properties in PopoverProps
|
|
61
|
-
*/
|
|
62
|
-
export declare type PopoverShorthandProps = never;
|
|
63
|
-
/**
|
|
64
|
-
* Names of PopoverProps that have a default value in usePopover
|
|
65
|
-
*/
|
|
66
|
-
export declare type PopoverDefaultedProps = never;
|
|
67
|
-
/**
|
|
68
|
-
* Popover State
|
|
69
|
-
*/
|
|
70
|
-
export interface PopoverState extends ComponentState<PopoverProps, PopoverShorthandProps, PopoverDefaultedProps> {
|
|
71
|
-
/**
|
|
72
|
-
* Open state of the Popover
|
|
73
|
-
*/
|
|
74
|
-
open: boolean;
|
|
75
|
-
/**
|
|
76
|
-
* Callback to open/close the Popover
|
|
77
|
-
*/
|
|
78
|
-
setOpen: (e: OpenPopoverEvents, open: boolean) => void;
|
|
79
|
-
/**
|
|
80
|
-
* Ref of the PopoverTrigger
|
|
81
|
-
*/
|
|
82
|
-
triggerRef: React.MutableRefObject<HTMLElement | null>;
|
|
83
|
-
/**
|
|
84
|
-
* Ref of the PopoverSurface
|
|
85
|
-
*/
|
|
86
|
-
contentRef: React.MutableRefObject<HTMLElement | null>;
|
|
87
|
-
/**
|
|
88
|
-
* Ref of the pointing arrow
|
|
89
|
-
*/
|
|
90
|
-
arrowRef: React.MutableRefObject<HTMLDivElement | null>;
|
|
91
|
-
/**
|
|
92
|
-
* Anchors the popper to the mouse click for context events
|
|
93
|
-
*/
|
|
94
|
-
contextTarget: PopperVirtualElement | undefined;
|
|
95
|
-
/**
|
|
96
|
-
* A callback to set the target of the popper to the mouse click for context events
|
|
97
|
-
*/
|
|
98
|
-
setContextTarget: React.Dispatch<PopperVirtualElement | undefined>;
|
|
99
|
-
size: NonNullable<PopoverProps['size']>;
|
|
100
|
-
}
|
|
101
|
-
/**
|
|
102
|
-
* Data attached to open/close events
|
|
103
|
-
*/
|
|
104
|
-
export interface OnOpenChangeData extends Pick<PopoverState, 'open'> {
|
|
105
|
-
}
|
|
106
|
-
/**
|
|
107
|
-
* The supported events that will trigger open/close of the menu
|
|
108
|
-
*/
|
|
109
|
-
export declare type OpenPopoverEvents = MouseEvent | TouchEvent | React.MouseEvent<HTMLElement> | React.KeyboardEvent<HTMLElement> | React.FocusEvent<HTMLElement>;
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"Popover.types.js","sourceRoot":"../src/","sources":["components/Popover/Popover.types.ts"],"names":[],"mappings":"","sourcesContent":["import * as React from 'react';\nimport { PopperOptions, PopperVirtualElement } from '@fluentui/react-positioning';\nimport { PortalProps } from '@fluentui/react-portal';\nimport { ComponentState } from '@fluentui/react-utilities';\n\n/**\n * Determines popover padding and arrow size\n */\nexport type PopoverSize = 'small' | 'medium' | 'large';\n\n/**\n * Popover Props\n */\nexport interface PopoverProps\n extends Pick<PopperOptions, 'position' | 'align' | 'offset' | 'coverTarget' | 'target'>,\n Pick<PortalProps, 'mountNode'> {\n children: React.ReactNode;\n /**\n * Controls the opening of the Popover\n */\n open?: boolean;\n /**\n * Used to set the initial open state of the Popover in uncontrolled mode\n */\n defaultOpen?: boolean;\n /**\n * Call back when the component requests to change value\n * The `open` value is used as a hint when directly controlling the component\n */\n onOpenChange?: (e: OpenPopoverEvents, data: OnOpenChangeData) => void;\n /**\n * Flag to open the Popover by hovering the trigger\n */\n openOnHover?: boolean;\n /**\n * Flag to open the Popover as a context menu. Disables all other interactions\n */\n openOnContext?: boolean;\n /**\n * Do not display the arrow\n */\n noArrow?: boolean;\n /**\n * Determines popover padding and arrow size\n * @default medium\n */\n size?: PopoverSize;\n /**\n * Uses brand colour as background\n * Mutually exclusive with `inverted`\n */\n brand?: boolean;\n /**\n * Inverts the foreground/background colour of the popover\n * Mutually exclusive with `brand`\n */\n inverted?: boolean;\n\n /**\n * Should trap focus\n */\n trapFocus?: boolean;\n}\n\n/**\n * Names of the shorthand properties in PopoverProps\n */\nexport type PopoverShorthandProps = never;\n\n/**\n * Names of PopoverProps that have a default value in usePopover\n */\nexport type PopoverDefaultedProps = never;\n\n/**\n * Popover State\n */\nexport interface PopoverState extends ComponentState<PopoverProps, PopoverShorthandProps, PopoverDefaultedProps> {\n /**\n * Open state of the Popover\n */\n open: boolean;\n /**\n * Callback to open/close the Popover\n */\n setOpen: (e: OpenPopoverEvents, open: boolean) => void;\n /**\n * Ref of the PopoverTrigger\n */\n triggerRef: React.MutableRefObject<HTMLElement | null>;\n /**\n * Ref of the PopoverSurface\n */\n contentRef: React.MutableRefObject<HTMLElement | null>;\n /**\n * Ref of the pointing arrow\n */\n arrowRef: React.MutableRefObject<HTMLDivElement | null>;\n /**\n * Anchors the popper to the mouse click for context events\n */\n contextTarget: PopperVirtualElement | undefined;\n /**\n * A callback to set the target of the popper to the mouse click for context events\n */\n setContextTarget: React.Dispatch<PopperVirtualElement | undefined>;\n\n size: NonNullable<PopoverProps['size']>;\n}\n\n/**\n * Data attached to open/close events\n */\nexport interface OnOpenChangeData extends Pick<PopoverState, 'open'> {}\n\n/**\n * The supported events that will trigger open/close of the menu\n */\nexport type OpenPopoverEvents =\n | MouseEvent\n | TouchEvent\n | React.MouseEvent<HTMLElement>\n | React.KeyboardEvent<HTMLElement>\n | React.FocusEvent<HTMLElement>;\n"]}
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
import { Offset } from '@fluentui/react-positioning';
|
|
2
|
-
/**
|
|
3
|
-
* @param userOffset - The offset provided by the user
|
|
4
|
-
* @param arrowHeight - The height of the arrow in px
|
|
5
|
-
* @returns User offset augmented with arrow height
|
|
6
|
-
*/
|
|
7
|
-
export declare function getOffsetWithArrow(userOffset: Offset | undefined | null, arrowHeight: number): Offset;
|
|
@@ -1,40 +0,0 @@
|
|
|
1
|
-
define(["require", "exports"], function (require, exports) {
|
|
2
|
-
"use strict";
|
|
3
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
4
|
-
exports.getOffsetWithArrow = void 0;
|
|
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
|
-
function getOffsetWithArrow(userOffset, arrowHeight) {
|
|
11
|
-
var offsetWithArrow = userOffset;
|
|
12
|
-
if (!userOffset) {
|
|
13
|
-
return [0, arrowHeight];
|
|
14
|
-
}
|
|
15
|
-
if (Array.isArray(offsetWithArrow)) {
|
|
16
|
-
setArrowOffset(offsetWithArrow, arrowHeight);
|
|
17
|
-
return offsetWithArrow;
|
|
18
|
-
}
|
|
19
|
-
if (typeof offsetWithArrow === 'function') {
|
|
20
|
-
var userOffsetFn_1 = offsetWithArrow;
|
|
21
|
-
offsetWithArrow = function (offsetParams) {
|
|
22
|
-
var offset = userOffsetFn_1(offsetParams);
|
|
23
|
-
setArrowOffset(offset, arrowHeight);
|
|
24
|
-
return offset;
|
|
25
|
-
};
|
|
26
|
-
}
|
|
27
|
-
// This should never happen
|
|
28
|
-
return [0, 0];
|
|
29
|
-
}
|
|
30
|
-
exports.getOffsetWithArrow = getOffsetWithArrow;
|
|
31
|
-
var setArrowOffset = function (offset, arrowHeight) {
|
|
32
|
-
if (offset[1] !== null && offset[1] !== undefined) {
|
|
33
|
-
offset[1] += arrowHeight;
|
|
34
|
-
}
|
|
35
|
-
else {
|
|
36
|
-
offset[1] = arrowHeight;
|
|
37
|
-
}
|
|
38
|
-
};
|
|
39
|
-
});
|
|
40
|
-
//# sourceMappingURL=getOffsetWithArrow.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"getOffsetWithArrow.js","sourceRoot":"../src/","sources":["components/Popover/getOffsetWithArrow.ts"],"names":[],"mappings":";;;;IAEA;;;;OAIG;IACH,SAAgB,kBAAkB,CAAC,UAAqC,EAAE,WAAmB;QAC3F,IAAI,eAAe,GAAG,UAAU,CAAC;QACjC,IAAI,CAAC,UAAU,EAAE;YACf,OAAO,CAAC,CAAC,EAAE,WAAW,CAAC,CAAC;SACzB;QAED,IAAI,KAAK,CAAC,OAAO,CAAC,eAAe,CAAC,EAAE;YAClC,cAAc,CAAC,eAAe,EAAE,WAAW,CAAC,CAAC;YAC7C,OAAO,eAAe,CAAC;SACxB;QAED,IAAI,OAAO,eAAe,KAAK,UAAU,EAAE;YACzC,IAAM,cAAY,GAAG,eAAe,CAAC;YACrC,eAAe,GAAG,UAAA,YAAY;gBAC5B,IAAM,MAAM,GAAG,cAAY,CAAC,YAAY,CAAC,CAAC;gBAC1C,cAAc,CAAC,MAAM,EAAE,WAAW,CAAC,CAAC;gBACpC,OAAO,MAAM,CAAC;YAChB,CAAC,CAAC;SACH;QAED,2BAA2B;QAC3B,OAAO,CAAC,CAAC,EAAE,CAAC,CAAU,CAAC;IACzB,CAAC;IAtBD,gDAsBC;IAED,IAAM,cAAc,GAAG,UAAC,MAA8D,EAAE,WAAmB;QACzG,IAAI,MAAM,CAAC,CAAC,CAAC,KAAK,IAAI,IAAI,MAAM,CAAC,CAAC,CAAC,KAAK,SAAS,EAAE;YACjD,MAAM,CAAC,CAAC,CAAC,IAAI,WAAW,CAAC;SAC1B;aAAM;YACL,MAAM,CAAC,CAAC,CAAC,GAAG,WAAW,CAAC;SACzB;IACH,CAAC,CAAC","sourcesContent":["import { Offset } from '@fluentui/react-positioning';\n\n/**\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 getOffsetWithArrow(userOffset: Offset | undefined | null, arrowHeight: number): Offset {\n let offsetWithArrow = userOffset;\n if (!userOffset) {\n return [0, arrowHeight];\n }\n\n if (Array.isArray(offsetWithArrow)) {\n setArrowOffset(offsetWithArrow, arrowHeight);\n return offsetWithArrow;\n }\n\n if (typeof offsetWithArrow === 'function') {\n const userOffsetFn = offsetWithArrow;\n offsetWithArrow = offsetParams => {\n const offset = userOffsetFn(offsetParams);\n setArrowOffset(offset, arrowHeight);\n return offset;\n };\n }\n\n // This should never happen\n return [0, 0] as never;\n}\n\nconst setArrowOffset = (offset: [number | null | undefined, number | null | undefined], arrowHeight: number) => {\n if (offset[1] !== null && offset[1] !== undefined) {\n offset[1] += arrowHeight;\n } else {\n offset[1] = arrowHeight;\n }\n};\n"]}
|
|
@@ -1,9 +0,0 @@
|
|
|
1
|
-
define(["require", "exports", "tslib", "./Popover", "./Popover.types", "./renderPopover", "./usePopover"], function (require, exports, tslib_1, Popover_1, Popover_types_1, renderPopover_1, usePopover_1) {
|
|
2
|
-
"use strict";
|
|
3
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
4
|
-
tslib_1.__exportStar(Popover_1, exports);
|
|
5
|
-
tslib_1.__exportStar(Popover_types_1, exports);
|
|
6
|
-
tslib_1.__exportStar(renderPopover_1, exports);
|
|
7
|
-
tslib_1.__exportStar(usePopover_1, exports);
|
|
8
|
-
});
|
|
9
|
-
//# sourceMappingURL=index.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"../src/","sources":["components/Popover/index.ts"],"names":[],"mappings":";;;IAAA,yCAA0B;IAC1B,+CAAgC;IAChC,+CAAgC;IAChC,4CAA6B","sourcesContent":["export * from './Popover';\nexport * from './Popover.types';\nexport * from './renderPopover';\nexport * from './usePopover';\n"]}
|
|
@@ -1,29 +0,0 @@
|
|
|
1
|
-
define(["require", "exports", "react", "../../popoverContext"], function (require, exports, React, popoverContext_1) {
|
|
2
|
-
"use strict";
|
|
3
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
4
|
-
exports.renderPopover = void 0;
|
|
5
|
-
/**
|
|
6
|
-
* Render the final JSX of Popover
|
|
7
|
-
*/
|
|
8
|
-
var renderPopover = function (state) {
|
|
9
|
-
var open = state.open, setOpen = state.setOpen, triggerRef = state.triggerRef, contentRef = state.contentRef, target = state.target, openOnContext = state.openOnContext, openOnHover = state.openOnHover, mountNode = state.mountNode, arrowRef = state.arrowRef, size = state.size, noArrow = state.noArrow, brand = state.brand, inverted = state.inverted, trapFocus = state.trapFocus;
|
|
10
|
-
return (React.createElement(popoverContext_1.PopoverContext.Provider, { value: {
|
|
11
|
-
open: open,
|
|
12
|
-
setOpen: setOpen,
|
|
13
|
-
triggerRef: triggerRef,
|
|
14
|
-
contentRef: contentRef,
|
|
15
|
-
target: target,
|
|
16
|
-
openOnHover: openOnHover,
|
|
17
|
-
openOnContext: openOnContext,
|
|
18
|
-
mountNode: mountNode,
|
|
19
|
-
arrowRef: arrowRef,
|
|
20
|
-
size: size,
|
|
21
|
-
noArrow: noArrow,
|
|
22
|
-
brand: brand,
|
|
23
|
-
inverted: inverted,
|
|
24
|
-
trapFocus: trapFocus,
|
|
25
|
-
} }, state.children));
|
|
26
|
-
};
|
|
27
|
-
exports.renderPopover = renderPopover;
|
|
28
|
-
});
|
|
29
|
-
//# sourceMappingURL=renderPopover.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"renderPopover.js","sourceRoot":"../src/","sources":["components/Popover/renderPopover.tsx"],"names":[],"mappings":";;;;IAIA;;OAEG;IACI,IAAM,aAAa,GAAG,UAAC,KAAmB;QAE7C,IAAA,IAAI,GAcF,KAAK,KAdH,EACJ,OAAO,GAaL,KAAK,QAbA,EACP,UAAU,GAYR,KAAK,WAZG,EACV,UAAU,GAWR,KAAK,WAXG,EACV,MAAM,GAUJ,KAAK,OAVD,EACN,aAAa,GASX,KAAK,cATM,EACb,WAAW,GAQT,KAAK,YARI,EACX,SAAS,GAOP,KAAK,UAPE,EACT,QAAQ,GAMN,KAAK,SANC,EACR,IAAI,GAKF,KAAK,KALH,EACJ,OAAO,GAIL,KAAK,QAJA,EACP,KAAK,GAGH,KAAK,MAHF,EACL,QAAQ,GAEN,KAAK,SAFC,EACR,SAAS,GACP,KAAK,UADE,CACD;QAEV,OAAO,CACL,oBAAC,+BAAc,CAAC,QAAQ,IACtB,KAAK,EAAE;gBACL,IAAI,MAAA;gBACJ,OAAO,SAAA;gBACP,UAAU,YAAA;gBACV,UAAU,YAAA;gBACV,MAAM,QAAA;gBACN,WAAW,aAAA;gBACX,aAAa,eAAA;gBACb,SAAS,WAAA;gBACT,QAAQ,UAAA;gBACR,IAAI,MAAA;gBACJ,OAAO,SAAA;gBACP,KAAK,OAAA;gBACL,QAAQ,UAAA;gBACR,SAAS,WAAA;aACV,IAEA,KAAK,CAAC,QAAQ,CACS,CAC3B,CAAC;IACJ,CAAC,CAAC;IAxCW,QAAA,aAAa,iBAwCxB","sourcesContent":["import * as React from 'react';\nimport { PopoverContext } from '../../popoverContext';\nimport { PopoverState } from './Popover.types';\n\n/**\n * Render the final JSX of Popover\n */\nexport const renderPopover = (state: PopoverState) => {\n const {\n open,\n setOpen,\n triggerRef,\n contentRef,\n target,\n openOnContext,\n openOnHover,\n mountNode,\n arrowRef,\n size,\n noArrow,\n brand,\n inverted,\n trapFocus,\n } = state;\n\n return (\n <PopoverContext.Provider\n value={{\n open,\n setOpen,\n triggerRef,\n contentRef,\n target,\n openOnHover,\n openOnContext,\n mountNode,\n arrowRef,\n size,\n noArrow,\n brand,\n inverted,\n trapFocus,\n }}\n >\n {state.children}\n </PopoverContext.Provider>\n );\n};\n"]}
|
|
@@ -1,11 +0,0 @@
|
|
|
1
|
-
import { 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
|
-
* @param defaultProps - (optional) default prop values provided by the implementing type
|
|
10
|
-
*/
|
|
11
|
-
export declare const usePopover: (props: PopoverProps, defaultProps?: PopoverProps | undefined) => PopoverState;
|
|
@@ -1,112 +0,0 @@
|
|
|
1
|
-
define(["require", "exports", "react", "@fluentui/react-utilities", "@fluentui/react-shared-contexts", "@fluentui/react-positioning", "@fluentui/react-portal", "../PopoverSurface/index", "./getOffsetWithArrow"], function (require, exports, React, react_utilities_1, react_shared_contexts_1, react_positioning_1, react_portal_1, index_1, getOffsetWithArrow_1) {
|
|
2
|
-
"use strict";
|
|
3
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
4
|
-
exports.usePopover = void 0;
|
|
5
|
-
/**
|
|
6
|
-
* Names of the shorthand properties in PopoverProps
|
|
7
|
-
*/
|
|
8
|
-
var mergeProps = react_utilities_1.makeMergeProps({});
|
|
9
|
-
/**
|
|
10
|
-
* Create the state required to render Popover.
|
|
11
|
-
*
|
|
12
|
-
* The returned state can be modified with hooks such as usePopoverStyles,
|
|
13
|
-
* before being passed to renderPopover.
|
|
14
|
-
*
|
|
15
|
-
* @param props - props from this instance of Popover
|
|
16
|
-
* @param defaultProps - (optional) default prop values provided by the implementing type
|
|
17
|
-
*/
|
|
18
|
-
var usePopover = function (props, defaultProps) {
|
|
19
|
-
var state = mergeProps({
|
|
20
|
-
size: 'medium',
|
|
21
|
-
open: undefined,
|
|
22
|
-
setOpen: function () { return null; },
|
|
23
|
-
triggerRef: { current: null },
|
|
24
|
-
contentRef: { current: null },
|
|
25
|
-
arrowRef: { current: null },
|
|
26
|
-
children: null,
|
|
27
|
-
position: 'above',
|
|
28
|
-
align: 'center',
|
|
29
|
-
setContextTarget: function () { return null; },
|
|
30
|
-
contextTarget: undefined,
|
|
31
|
-
}, defaultProps, props);
|
|
32
|
-
// no reason to render arrow when covering the target
|
|
33
|
-
if (state.coverTarget) {
|
|
34
|
-
state.noArrow = true;
|
|
35
|
-
}
|
|
36
|
-
var _a = React.useState(), contextTarget = _a[0], setContextTarget = _a[1];
|
|
37
|
-
state.setContextTarget = setContextTarget;
|
|
38
|
-
state.contextTarget = contextTarget;
|
|
39
|
-
useOpenState(state);
|
|
40
|
-
usePopoverRefs(state);
|
|
41
|
-
var targetDocument = react_shared_contexts_1.useFluent().targetDocument;
|
|
42
|
-
react_utilities_1.useOnClickOutside({
|
|
43
|
-
contains: react_portal_1.elementContains,
|
|
44
|
-
element: targetDocument,
|
|
45
|
-
callback: function (ev) { return state.setOpen(ev, false); },
|
|
46
|
-
refs: [state.triggerRef, state.contentRef],
|
|
47
|
-
disabled: !state.open,
|
|
48
|
-
});
|
|
49
|
-
react_utilities_1.useOnScrollOutside({
|
|
50
|
-
contains: react_portal_1.elementContains,
|
|
51
|
-
element: targetDocument,
|
|
52
|
-
callback: function (ev) { return state.setOpen(ev, false); },
|
|
53
|
-
refs: [state.triggerRef, state.contentRef],
|
|
54
|
-
disabled: !state.open || !state.openOnContext,
|
|
55
|
-
});
|
|
56
|
-
return state;
|
|
57
|
-
};
|
|
58
|
-
exports.usePopover = usePopover;
|
|
59
|
-
/**
|
|
60
|
-
* Creates and manages the Popover open state
|
|
61
|
-
* @param state Popover state
|
|
62
|
-
*/
|
|
63
|
-
function useOpenState(state) {
|
|
64
|
-
var onOpenChange = react_utilities_1.useEventCallback(function (e, data) { var _a; return (_a = state.onOpenChange) === null || _a === void 0 ? void 0 : _a.call(state, e, data); });
|
|
65
|
-
var _a = react_utilities_1.useControllableValue(state.open, state.defaultOpen), open = _a[0], setOpen = _a[1];
|
|
66
|
-
state.open = open !== undefined ? open : state.open;
|
|
67
|
-
var setContextTarget = state.setContextTarget;
|
|
68
|
-
state.setOpen = React.useCallback(function (e, shouldOpen) {
|
|
69
|
-
if (shouldOpen && e.type === 'contextmenu') {
|
|
70
|
-
var virtualElement = react_positioning_1.createVirtualElementFromClick(e.nativeEvent);
|
|
71
|
-
setContextTarget(virtualElement);
|
|
72
|
-
}
|
|
73
|
-
if (!shouldOpen) {
|
|
74
|
-
setContextTarget(undefined);
|
|
75
|
-
}
|
|
76
|
-
setOpen(function (prevOpen) {
|
|
77
|
-
// More than one event (mouse, focus, keyboard) can request the Popover to close
|
|
78
|
-
// We assume the first event is the correct one
|
|
79
|
-
if (prevOpen !== shouldOpen) {
|
|
80
|
-
onOpenChange === null || onOpenChange === void 0 ? void 0 : onOpenChange(e, { open: shouldOpen });
|
|
81
|
-
}
|
|
82
|
-
return shouldOpen;
|
|
83
|
-
});
|
|
84
|
-
}, [setOpen, onOpenChange, setContextTarget]);
|
|
85
|
-
return state;
|
|
86
|
-
}
|
|
87
|
-
/**
|
|
88
|
-
* Creates and sets the necessary trigger, target and content refs used by Popover
|
|
89
|
-
* @param state Popover state
|
|
90
|
-
*/
|
|
91
|
-
function usePopoverRefs(state) {
|
|
92
|
-
if (!state.noArrow) {
|
|
93
|
-
state.offset = getOffsetWithArrow_1.getOffsetWithArrow(state.offset, index_1.arrowHeights[state.size]);
|
|
94
|
-
}
|
|
95
|
-
if (!state.target && state.openOnContext && state.contextTarget) {
|
|
96
|
-
state.target = state.contextTarget;
|
|
97
|
-
}
|
|
98
|
-
var _a = react_positioning_1.usePopper({
|
|
99
|
-
align: state.align,
|
|
100
|
-
position: state.position,
|
|
101
|
-
target: state.target,
|
|
102
|
-
coverTarget: state.coverTarget,
|
|
103
|
-
offset: state.offset,
|
|
104
|
-
arrowPadding: index_1.arrowHeights[state.size],
|
|
105
|
-
}), triggerRef = _a.targetRef, contentRef = _a.containerRef, arrowRef = _a.arrowRef;
|
|
106
|
-
state.contentRef = contentRef;
|
|
107
|
-
state.triggerRef = triggerRef;
|
|
108
|
-
state.arrowRef = arrowRef;
|
|
109
|
-
return state;
|
|
110
|
-
}
|
|
111
|
-
});
|
|
112
|
-
//# sourceMappingURL=usePopover.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"usePopover.js","sourceRoot":"../src/","sources":["components/Popover/usePopover.ts"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport {\n makeMergeProps,\n useControllableValue,\n useEventCallback,\n useOnClickOutside,\n useOnScrollOutside,\n} from '@fluentui/react-utilities';\nimport { useFluent } from '@fluentui/react-shared-contexts';\nimport { usePopper, PopperVirtualElement, createVirtualElementFromClick } from '@fluentui/react-positioning';\nimport { elementContains } from '@fluentui/react-portal';\nimport { PopoverProps, PopoverState } from './Popover.types';\nimport { arrowHeights } from '../PopoverSurface/index';\nimport { getOffsetWithArrow } from './getOffsetWithArrow';\n\n/**\n * Names of the shorthand properties in PopoverProps\n */\nconst mergeProps = makeMergeProps<PopoverState>({});\n\n/**\n * Create the state required to render Popover.\n *\n * The returned state can be modified with hooks such as usePopoverStyles,\n * before being passed to renderPopover.\n *\n * @param props - props from this instance of Popover\n * @param defaultProps - (optional) default prop values provided by the implementing type\n */\nexport const usePopover = (props: PopoverProps, defaultProps?: PopoverProps): PopoverState => {\n const state = mergeProps(\n {\n size: 'medium',\n open: (undefined as unknown) as boolean, // mergeProps typings require this\n setOpen: () => null,\n triggerRef: { current: null },\n contentRef: { current: null },\n arrowRef: { current: null },\n children: null,\n position: 'above',\n align: 'center',\n setContextTarget: () => null,\n contextTarget: undefined,\n },\n defaultProps,\n props,\n );\n\n // no reason to render arrow when covering the target\n if (state.coverTarget) {\n state.noArrow = true;\n }\n\n const [contextTarget, setContextTarget] = React.useState<PopperVirtualElement>();\n state.setContextTarget = setContextTarget;\n state.contextTarget = contextTarget;\n\n useOpenState(state);\n usePopoverRefs(state);\n\n const { targetDocument } = useFluent();\n useOnClickOutside({\n contains: elementContains,\n element: targetDocument,\n callback: ev => state.setOpen(ev, false),\n refs: [state.triggerRef, state.contentRef],\n disabled: !state.open,\n });\n useOnScrollOutside({\n contains: elementContains,\n element: targetDocument,\n callback: ev => state.setOpen(ev, false),\n refs: [state.triggerRef, state.contentRef],\n disabled: !state.open || !state.openOnContext,\n });\n\n return state;\n};\n\n/**\n * Creates and manages the Popover open state\n * @param state Popover state\n */\nfunction useOpenState(state: PopoverState): PopoverState {\n const onOpenChange: PopoverState['onOpenChange'] = useEventCallback((e, data) => state.onOpenChange?.(e, data));\n\n const [open, setOpen] = useControllableValue(state.open, state.defaultOpen);\n state.open = open !== undefined ? open : state.open;\n const setContextTarget = state.setContextTarget;\n\n state.setOpen = React.useCallback(\n (e, shouldOpen) => {\n if (shouldOpen && e.type === 'contextmenu') {\n const virtualElement = createVirtualElementFromClick((e as React.MouseEvent).nativeEvent);\n setContextTarget(virtualElement);\n }\n\n if (!shouldOpen) {\n setContextTarget(undefined);\n }\n\n setOpen(prevOpen => {\n // More than one event (mouse, focus, keyboard) can request the Popover to close\n // We assume the first event is the correct one\n if (prevOpen !== shouldOpen) {\n onOpenChange?.(e, { open: shouldOpen });\n }\n\n return shouldOpen;\n });\n },\n [setOpen, onOpenChange, setContextTarget],\n );\n\n return state;\n}\n\n/**\n * Creates and sets the necessary trigger, target and content refs used by Popover\n * @param state Popover state\n */\nfunction usePopoverRefs(state: PopoverState): PopoverState {\n if (!state.noArrow) {\n state.offset = getOffsetWithArrow(state.offset, arrowHeights[state.size]);\n }\n\n if (!state.target && state.openOnContext && state.contextTarget) {\n state.target = state.contextTarget;\n }\n\n const { targetRef: triggerRef, containerRef: contentRef, arrowRef } = usePopper({\n align: state.align,\n position: state.position,\n target: state.target,\n coverTarget: state.coverTarget,\n offset: state.offset,\n arrowPadding: arrowHeights[state.size],\n });\n\n state.contentRef = contentRef;\n state.triggerRef = triggerRef;\n state.arrowRef = arrowRef;\n\n return state;\n}\n"]}
|
|
@@ -1,6 +0,0 @@
|
|
|
1
|
-
import * as React from 'react';
|
|
2
|
-
import { PopoverSurfaceProps } from './PopoverSurface.types';
|
|
3
|
-
/**
|
|
4
|
-
* PopoverSurface component renders react children in a positioned box
|
|
5
|
-
*/
|
|
6
|
-
export declare const PopoverSurface: React.ForwardRefExoticComponent<PopoverSurfaceProps & React.RefAttributes<HTMLElement>>;
|
|
@@ -1,15 +0,0 @@
|
|
|
1
|
-
define(["require", "exports", "react", "./usePopoverSurface", "./renderPopoverSurface", "./usePopoverSurfaceStyles"], function (require, exports, React, usePopoverSurface_1, renderPopoverSurface_1, usePopoverSurfaceStyles_1) {
|
|
2
|
-
"use strict";
|
|
3
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
4
|
-
exports.PopoverSurface = void 0;
|
|
5
|
-
/**
|
|
6
|
-
* PopoverSurface component renders react children in a positioned box
|
|
7
|
-
*/
|
|
8
|
-
exports.PopoverSurface = React.forwardRef(function (props, ref) {
|
|
9
|
-
var state = usePopoverSurface_1.usePopoverSurface(props, ref);
|
|
10
|
-
usePopoverSurfaceStyles_1.usePopoverSurfaceStyles(state);
|
|
11
|
-
return renderPopoverSurface_1.renderPopoverSurface(state);
|
|
12
|
-
});
|
|
13
|
-
exports.PopoverSurface.displayName = 'PopoverSurface';
|
|
14
|
-
});
|
|
15
|
-
//# sourceMappingURL=PopoverSurface.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"PopoverSurface.js","sourceRoot":"../src/","sources":["components/PopoverSurface/PopoverSurface.tsx"],"names":[],"mappings":";;;;IAMA;;OAEG;IACU,QAAA,cAAc,GAAG,KAAK,CAAC,UAAU,CAAmC,UAAC,KAAK,EAAE,GAAG;QAC1F,IAAM,KAAK,GAAG,qCAAiB,CAAC,KAAK,EAAE,GAAG,CAAC,CAAC;QAE5C,iDAAuB,CAAC,KAAK,CAAC,CAAC;QAC/B,OAAO,2CAAoB,CAAC,KAAK,CAAC,CAAC;IACrC,CAAC,CAAC,CAAC;IAEH,sBAAc,CAAC,WAAW,GAAG,gBAAgB,CAAC","sourcesContent":["import * as React from 'react';\nimport { usePopoverSurface } from './usePopoverSurface';\nimport { PopoverSurfaceProps } from './PopoverSurface.types';\nimport { renderPopoverSurface } from './renderPopoverSurface';\nimport { usePopoverSurfaceStyles } from './usePopoverSurfaceStyles';\n\n/**\n * PopoverSurface component renders react children in a positioned box\n */\nexport const PopoverSurface = React.forwardRef<HTMLElement, PopoverSurfaceProps>((props, ref) => {\n const state = usePopoverSurface(props, ref);\n\n usePopoverSurfaceStyles(state);\n return renderPopoverSurface(state);\n});\n\nPopoverSurface.displayName = 'PopoverSurface';\n"]}
|
|
@@ -1,30 +0,0 @@
|
|
|
1
|
-
import * as React from 'react';
|
|
2
|
-
import { ComponentProps, ComponentState } from '@fluentui/react-utilities';
|
|
3
|
-
import { PopoverContextValue } from '../../popoverContext';
|
|
4
|
-
/**
|
|
5
|
-
* PopoverSurface Props
|
|
6
|
-
*/
|
|
7
|
-
export interface PopoverSurfaceProps extends ComponentProps, React.HTMLAttributes<HTMLElement> {
|
|
8
|
-
}
|
|
9
|
-
/**
|
|
10
|
-
* Names of the shorthand properties in PopoverSurfaceProps
|
|
11
|
-
*/
|
|
12
|
-
export declare type PopoverSurfaceShorthandProps = never;
|
|
13
|
-
/**
|
|
14
|
-
* Names of PopoverSurfaceProps that have a default value in usePopoverSurface
|
|
15
|
-
*/
|
|
16
|
-
export declare type PopoverSurfaceDefaultedProps = never;
|
|
17
|
-
/**
|
|
18
|
-
* PopoverSurface State
|
|
19
|
-
*/
|
|
20
|
-
export interface PopoverSurfaceState extends ComponentState<PopoverSurfaceProps, PopoverSurfaceShorthandProps, PopoverSurfaceDefaultedProps>, Pick<PopoverContextValue, 'open' | 'mountNode' | 'noArrow' | 'size' | 'brand' | 'inverted'> {
|
|
21
|
-
ref: React.Ref<HTMLElement>;
|
|
22
|
-
/**
|
|
23
|
-
* Ref to the arrow element
|
|
24
|
-
*/
|
|
25
|
-
arrowRef?: React.Ref<HTMLDivElement>;
|
|
26
|
-
/**
|
|
27
|
-
* CSS class for the arrow element
|
|
28
|
-
*/
|
|
29
|
-
arrowClassName?: string;
|
|
30
|
-
}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"PopoverSurface.types.js","sourceRoot":"../src/","sources":["components/PopoverSurface/PopoverSurface.types.ts"],"names":[],"mappings":"","sourcesContent":["import * as React from 'react';\nimport { ComponentProps, ComponentState } from '@fluentui/react-utilities';\nimport { PopoverContextValue } from '../../popoverContext';\n\n/**\n * PopoverSurface Props\n */\nexport interface PopoverSurfaceProps extends ComponentProps, React.HTMLAttributes<HTMLElement> {}\n\n/**\n * Names of the shorthand properties in PopoverSurfaceProps\n */\nexport type PopoverSurfaceShorthandProps = never;\n\n/**\n * Names of PopoverSurfaceProps that have a default value in usePopoverSurface\n */\nexport type PopoverSurfaceDefaultedProps = never;\n\n/**\n * PopoverSurface State\n */\nexport interface PopoverSurfaceState\n extends ComponentState<PopoverSurfaceProps, PopoverSurfaceShorthandProps, PopoverSurfaceDefaultedProps>,\n Pick<PopoverContextValue, 'open' | 'mountNode' | 'noArrow' | 'size' | 'brand' | 'inverted'> {\n ref: React.Ref<HTMLElement>;\n /**\n * Ref to the arrow element\n */\n arrowRef?: React.Ref<HTMLDivElement>;\n\n /**\n * CSS class for the arrow element\n */\n arrowClassName?: string;\n}\n"]}
|
|
@@ -1,10 +0,0 @@
|
|
|
1
|
-
define(["require", "exports", "tslib", "./PopoverSurface", "./PopoverSurface.types", "./renderPopoverSurface", "./usePopoverSurface", "./usePopoverSurfaceStyles"], function (require, exports, tslib_1, PopoverSurface_1, PopoverSurface_types_1, renderPopoverSurface_1, usePopoverSurface_1, usePopoverSurfaceStyles_1) {
|
|
2
|
-
"use strict";
|
|
3
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
4
|
-
tslib_1.__exportStar(PopoverSurface_1, exports);
|
|
5
|
-
tslib_1.__exportStar(PopoverSurface_types_1, exports);
|
|
6
|
-
tslib_1.__exportStar(renderPopoverSurface_1, exports);
|
|
7
|
-
tslib_1.__exportStar(usePopoverSurface_1, exports);
|
|
8
|
-
tslib_1.__exportStar(usePopoverSurfaceStyles_1, exports);
|
|
9
|
-
});
|
|
10
|
-
//# sourceMappingURL=index.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"../src/","sources":["components/PopoverSurface/index.ts"],"names":[],"mappings":";;;IAAA,gDAAiC;IACjC,sDAAuC;IACvC,sDAAuC;IACvC,mDAAoC;IACpC,yDAA0C","sourcesContent":["export * from './PopoverSurface';\nexport * from './PopoverSurface.types';\nexport * from './renderPopoverSurface';\nexport * from './usePopoverSurface';\nexport * from './usePopoverSurfaceStyles';\n"]}
|
|
@@ -1,21 +0,0 @@
|
|
|
1
|
-
define(["require", "exports", "tslib", "react", "@fluentui/react-utilities", "@fluentui/react-portal"], function (require, exports, tslib_1, React, react_utilities_1, react_portal_1) {
|
|
2
|
-
"use strict";
|
|
3
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
4
|
-
exports.renderPopoverSurface = void 0;
|
|
5
|
-
/**
|
|
6
|
-
* Render the final JSX of PopoverSurface
|
|
7
|
-
*/
|
|
8
|
-
var renderPopoverSurface = function (state) {
|
|
9
|
-
var _a = react_utilities_1.getSlots(state), slots = _a.slots, slotProps = _a.slotProps;
|
|
10
|
-
// TODO should hidden Popovers be supported ?
|
|
11
|
-
if (!state.open) {
|
|
12
|
-
return null;
|
|
13
|
-
}
|
|
14
|
-
return (React.createElement(react_portal_1.Portal, { mountNode: state.mountNode },
|
|
15
|
-
React.createElement(slots.root, tslib_1.__assign({}, slotProps.root),
|
|
16
|
-
!state.noArrow && React.createElement("div", { ref: state.arrowRef, className: state.arrowClassName }),
|
|
17
|
-
state.children)));
|
|
18
|
-
};
|
|
19
|
-
exports.renderPopoverSurface = renderPopoverSurface;
|
|
20
|
-
});
|
|
21
|
-
//# sourceMappingURL=renderPopoverSurface.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"renderPopoverSurface.js","sourceRoot":"../src/","sources":["components/PopoverSurface/renderPopoverSurface.tsx"],"names":[],"mappings":";;;;IAKA;;OAEG;IACI,IAAM,oBAAoB,GAAG,UAAC,KAA0B;QACvD,IAAA,KAAuB,0BAAQ,CAAC,KAAK,CAAC,EAApC,KAAK,WAAA,EAAE,SAAS,eAAoB,CAAC;QAE7C,6CAA6C;QAC7C,IAAI,CAAC,KAAK,CAAC,IAAI,EAAE;YACf,OAAO,IAAI,CAAC;SACb;QAED,OAAO,CACL,oBAAC,qBAAM,IAAC,SAAS,EAAE,KAAK,CAAC,SAAS;YAChC,oBAAC,KAAK,CAAC,IAAI,uBAAK,SAAS,CAAC,IAAI;gBAC3B,CAAC,KAAK,CAAC,OAAO,IAAI,6BAAK,GAAG,EAAE,KAAK,CAAC,QAAQ,EAAE,SAAS,EAAE,KAAK,CAAC,cAAc,GAAI;gBAC/E,KAAK,CAAC,QAAQ,CACJ,CACN,CACV,CAAC;IACJ,CAAC,CAAC;IAhBW,QAAA,oBAAoB,wBAgB/B","sourcesContent":["import * as React from 'react';\nimport { getSlots } from '@fluentui/react-utilities';\nimport { Portal } from '@fluentui/react-portal';\nimport { PopoverSurfaceState } from './PopoverSurface.types';\n\n/**\n * Render the final JSX of PopoverSurface\n */\nexport const renderPopoverSurface = (state: PopoverSurfaceState) => {\n const { slots, slotProps } = getSlots(state);\n\n // TODO should hidden Popovers be supported ?\n if (!state.open) {\n return null;\n }\n\n return (\n <Portal mountNode={state.mountNode}>\n <slots.root {...slotProps.root}>\n {!state.noArrow && <div ref={state.arrowRef} className={state.arrowClassName} />}\n {state.children}\n </slots.root>\n </Portal>\n );\n};\n"]}
|
|
@@ -1,13 +0,0 @@
|
|
|
1
|
-
import * as React from 'react';
|
|
2
|
-
import { PopoverSurfaceProps, PopoverSurfaceState } from './PopoverSurface.types';
|
|
3
|
-
/**
|
|
4
|
-
* Create the state required to render PopoverSurface.
|
|
5
|
-
*
|
|
6
|
-
* The returned state can be modified with hooks such as usePopoverSurfaceStyles,
|
|
7
|
-
* before being passed to renderPopoverSurface.
|
|
8
|
-
*
|
|
9
|
-
* @param props - props from this instance of PopoverSurface
|
|
10
|
-
* @param ref - reference to root HTMLElement of PopoverSurface
|
|
11
|
-
* @param defaultProps - (optional) default prop values provided by the implementing type
|
|
12
|
-
*/
|
|
13
|
-
export declare const usePopoverSurface: (props: PopoverSurfaceProps, ref: React.Ref<HTMLElement>, defaultProps?: PopoverSurfaceProps | undefined) => PopoverSurfaceState;
|