@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.
Files changed (132) hide show
  1. package/CHANGELOG.json +935 -25
  2. package/CHANGELOG.md +297 -80
  3. package/Spec.md +20 -0
  4. package/dist/{react-popover.d.ts → index.d.ts} +117 -71
  5. package/{lib → dist}/tsdoc-metadata.json +0 -0
  6. package/lib/Popover.js.map +1 -1
  7. package/lib/PopoverSurface.js.map +1 -1
  8. package/lib/PopoverTrigger.js.map +1 -1
  9. package/lib/components/Popover/Popover.js +5 -5
  10. package/lib/components/Popover/Popover.js.map +1 -1
  11. package/lib/components/Popover/Popover.types.js.map +1 -1
  12. package/lib/components/Popover/index.js.map +1 -1
  13. package/lib/components/Popover/renderPopover.js +30 -26
  14. package/lib/components/Popover/renderPopover.js.map +1 -1
  15. package/lib/components/Popover/usePopover.js +118 -56
  16. package/lib/components/Popover/usePopover.js.map +1 -1
  17. package/lib/components/PopoverSurface/PopoverSurface.js +7 -7
  18. package/lib/components/PopoverSurface/PopoverSurface.js.map +1 -1
  19. package/lib/components/PopoverSurface/PopoverSurface.types.js.map +1 -1
  20. package/lib/components/PopoverSurface/index.js.map +1 -1
  21. package/lib/components/PopoverSurface/renderPopoverSurface.js +13 -13
  22. package/lib/components/PopoverSurface/renderPopoverSurface.js.map +1 -1
  23. package/lib/components/PopoverSurface/usePopoverSurface.js +40 -64
  24. package/lib/components/PopoverSurface/usePopoverSurface.js.map +1 -1
  25. package/lib/components/PopoverSurface/usePopoverSurfaceStyles.js +36 -22
  26. package/lib/components/PopoverSurface/usePopoverSurfaceStyles.js.map +1 -1
  27. package/lib/components/PopoverTrigger/PopoverTrigger.js +6 -5
  28. package/lib/components/PopoverTrigger/PopoverTrigger.js.map +1 -1
  29. package/lib/components/PopoverTrigger/PopoverTrigger.types.js.map +1 -1
  30. package/lib/components/PopoverTrigger/index.js.map +1 -1
  31. package/lib/components/PopoverTrigger/renderPopoverTrigger.js +1 -1
  32. package/lib/components/PopoverTrigger/renderPopoverTrigger.js.map +1 -1
  33. package/lib/components/PopoverTrigger/usePopoverTrigger.js +40 -55
  34. package/lib/components/PopoverTrigger/usePopoverTrigger.js.map +1 -1
  35. package/lib/index.js +4 -4
  36. package/lib/index.js.map +1 -1
  37. package/lib/popoverContext.js +7 -9
  38. package/lib/popoverContext.js.map +1 -1
  39. package/lib-commonjs/Popover.js +1 -1
  40. package/lib-commonjs/Popover.js.map +1 -1
  41. package/lib-commonjs/PopoverSurface.js +1 -1
  42. package/lib-commonjs/PopoverSurface.js.map +1 -1
  43. package/lib-commonjs/PopoverTrigger.js +1 -1
  44. package/lib-commonjs/PopoverTrigger.js.map +1 -1
  45. package/lib-commonjs/components/Popover/Popover.js +5 -5
  46. package/lib-commonjs/components/Popover/Popover.js.map +1 -1
  47. package/lib-commonjs/components/Popover/Popover.types.js.map +1 -1
  48. package/lib-commonjs/components/Popover/index.js +1 -1
  49. package/lib-commonjs/components/Popover/index.js.map +1 -1
  50. package/lib-commonjs/components/Popover/renderPopover.js +34 -30
  51. package/lib-commonjs/components/Popover/renderPopover.js.map +1 -1
  52. package/lib-commonjs/components/Popover/usePopover.js +125 -63
  53. package/lib-commonjs/components/Popover/usePopover.js.map +1 -1
  54. package/lib-commonjs/components/PopoverSurface/PopoverSurface.js +8 -8
  55. package/lib-commonjs/components/PopoverSurface/PopoverSurface.js.map +1 -1
  56. package/lib-commonjs/components/PopoverSurface/PopoverSurface.types.js.map +1 -1
  57. package/lib-commonjs/components/PopoverSurface/index.js +1 -1
  58. package/lib-commonjs/components/PopoverSurface/index.js.map +1 -1
  59. package/lib-commonjs/components/PopoverSurface/renderPopoverSurface.js +18 -20
  60. package/lib-commonjs/components/PopoverSurface/renderPopoverSurface.js.map +1 -1
  61. package/lib-commonjs/components/PopoverSurface/usePopoverSurface.js +44 -70
  62. package/lib-commonjs/components/PopoverSurface/usePopoverSurface.js.map +1 -1
  63. package/lib-commonjs/components/PopoverSurface/usePopoverSurfaceStyles.js +40 -24
  64. package/lib-commonjs/components/PopoverSurface/usePopoverSurfaceStyles.js.map +1 -1
  65. package/lib-commonjs/components/PopoverTrigger/PopoverTrigger.js +6 -5
  66. package/lib-commonjs/components/PopoverTrigger/PopoverTrigger.js.map +1 -1
  67. package/lib-commonjs/components/PopoverTrigger/PopoverTrigger.types.js.map +1 -1
  68. package/lib-commonjs/components/PopoverTrigger/index.js +1 -1
  69. package/lib-commonjs/components/PopoverTrigger/index.js.map +1 -1
  70. package/lib-commonjs/components/PopoverTrigger/renderPopoverTrigger.js +3 -3
  71. package/lib-commonjs/components/PopoverTrigger/renderPopoverTrigger.js.map +1 -1
  72. package/lib-commonjs/components/PopoverTrigger/usePopoverTrigger.js +45 -61
  73. package/lib-commonjs/components/PopoverTrigger/usePopoverTrigger.js.map +1 -1
  74. package/lib-commonjs/index.js +92 -5
  75. package/lib-commonjs/index.js.map +1 -1
  76. package/lib-commonjs/popoverContext.js +9 -11
  77. package/lib-commonjs/popoverContext.js.map +1 -1
  78. package/package.json +23 -27
  79. package/lib/Popover.d.ts +0 -1
  80. package/lib/PopoverSurface.d.ts +0 -1
  81. package/lib/PopoverTrigger.d.ts +0 -1
  82. package/lib/common/isConformant.d.ts +0 -4
  83. package/lib/common/isConformant.js +0 -13
  84. package/lib/common/isConformant.js.map +0 -1
  85. package/lib/common/mockUsePopoverContext.d.ts +0 -7
  86. package/lib/common/mockUsePopoverContext.js +0 -38
  87. package/lib/common/mockUsePopoverContext.js.map +0 -1
  88. package/lib/components/Popover/Popover.d.ts +0 -6
  89. package/lib/components/Popover/Popover.types.d.ts +0 -100
  90. package/lib/components/Popover/index.d.ts +0 -4
  91. package/lib/components/Popover/renderPopover.d.ts +0 -5
  92. package/lib/components/Popover/usePopover.d.ts +0 -10
  93. package/lib/components/PopoverSurface/PopoverSurface.d.ts +0 -6
  94. package/lib/components/PopoverSurface/PopoverSurface.types.d.ts +0 -21
  95. package/lib/components/PopoverSurface/index.d.ts +0 -5
  96. package/lib/components/PopoverSurface/renderPopoverSurface.d.ts +0 -5
  97. package/lib/components/PopoverSurface/usePopoverSurface.d.ts +0 -13
  98. package/lib/components/PopoverSurface/usePopoverSurfaceStyles.d.ts +0 -7
  99. package/lib/components/PopoverTrigger/PopoverTrigger.d.ts +0 -6
  100. package/lib/components/PopoverTrigger/PopoverTrigger.types.d.ts +0 -11
  101. package/lib/components/PopoverTrigger/index.d.ts +0 -4
  102. package/lib/components/PopoverTrigger/renderPopoverTrigger.d.ts +0 -5
  103. package/lib/components/PopoverTrigger/usePopoverTrigger.d.ts +0 -10
  104. package/lib/index.d.ts +0 -4
  105. package/lib/popoverContext.d.ts +0 -8
  106. package/lib-commonjs/Popover.d.ts +0 -1
  107. package/lib-commonjs/PopoverSurface.d.ts +0 -1
  108. package/lib-commonjs/PopoverTrigger.d.ts +0 -1
  109. package/lib-commonjs/common/isConformant.d.ts +0 -4
  110. package/lib-commonjs/common/isConformant.js +0 -24
  111. package/lib-commonjs/common/isConformant.js.map +0 -1
  112. package/lib-commonjs/common/mockUsePopoverContext.d.ts +0 -7
  113. package/lib-commonjs/common/mockUsePopoverContext.js +0 -49
  114. package/lib-commonjs/common/mockUsePopoverContext.js.map +0 -1
  115. package/lib-commonjs/components/Popover/Popover.d.ts +0 -6
  116. package/lib-commonjs/components/Popover/Popover.types.d.ts +0 -100
  117. package/lib-commonjs/components/Popover/index.d.ts +0 -4
  118. package/lib-commonjs/components/Popover/renderPopover.d.ts +0 -5
  119. package/lib-commonjs/components/Popover/usePopover.d.ts +0 -10
  120. package/lib-commonjs/components/PopoverSurface/PopoverSurface.d.ts +0 -6
  121. package/lib-commonjs/components/PopoverSurface/PopoverSurface.types.d.ts +0 -21
  122. package/lib-commonjs/components/PopoverSurface/index.d.ts +0 -5
  123. package/lib-commonjs/components/PopoverSurface/renderPopoverSurface.d.ts +0 -5
  124. package/lib-commonjs/components/PopoverSurface/usePopoverSurface.d.ts +0 -13
  125. package/lib-commonjs/components/PopoverSurface/usePopoverSurfaceStyles.d.ts +0 -7
  126. package/lib-commonjs/components/PopoverTrigger/PopoverTrigger.d.ts +0 -6
  127. package/lib-commonjs/components/PopoverTrigger/PopoverTrigger.types.d.ts +0 -11
  128. package/lib-commonjs/components/PopoverTrigger/index.d.ts +0 -4
  129. package/lib-commonjs/components/PopoverTrigger/renderPopoverTrigger.d.ts +0 -5
  130. package/lib-commonjs/components/PopoverTrigger/usePopoverTrigger.d.ts +0 -10
  131. package/lib-commonjs/index.d.ts +0 -4
  132. 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-nightly.f81b28ceb3.1",
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": "lib/index.d.ts",
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": "start-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 ../../scripts/typescript/normalize-import --output dist/react-popover/src && yarn docs"
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-make-styles": "9.0.0-nightly.f81b28ceb3.1",
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-nightly.f81b28ceb3.1",
48
- "@fluentui/react-make-styles": "9.0.0-nightly.f81b28ceb3.1",
49
- "@fluentui/react-portal": "9.0.0-nightly.f81b28ceb3.1",
50
- "@fluentui/react-positioning": "9.0.0-nightly.f81b28ceb3.1",
51
- "@fluentui/react-shared-contexts": "9.0.0-nightly.f81b28ceb3.1",
52
- "@fluentui/react-tabster": "9.0.0-nightly.f81b28ceb3.1",
53
- "@fluentui/react-utilities": "9.0.0-nightly.f81b28ceb3.1",
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';
@@ -1 +0,0 @@
1
- export * from './components/PopoverSurface/index';
@@ -1 +0,0 @@
1
- export * from './components/PopoverTrigger/index';
@@ -1,4 +0,0 @@
1
- import type { IsConformantOptions } from '@fluentui/react-conformance';
2
- export declare function isConformant<TProps = {}>(testInfo: Omit<IsConformantOptions<TProps>, 'componentPath'> & {
3
- componentPath?: string;
4
- }): void;
@@ -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,6 +0,0 @@
1
- import * as React from 'react';
2
- import type { PopoverProps } from './Popover.types';
3
- /**
4
- * Wrapper component that manages state for a PopoverTrigger and a PopoverSurface components.
5
- */
6
- export declare const Popover: React.FC<PopoverProps>;
@@ -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,4 +0,0 @@
1
- export * from './Popover';
2
- export * from './Popover.types';
3
- export * from './renderPopover';
4
- export * from './usePopover';
@@ -1,5 +0,0 @@
1
- import type { PopoverState } from './Popover.types';
2
- /**
3
- * Render the final JSX of Popover
4
- */
5
- export declare const renderPopover: (state: PopoverState) => JSX.Element;
@@ -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,5 +0,0 @@
1
- export * from './PopoverSurface';
2
- export * from './PopoverSurface.types';
3
- export * from './renderPopoverSurface';
4
- export * from './usePopoverSurface';
5
- export * from './usePopoverSurfaceStyles';
@@ -1,5 +0,0 @@
1
- import type { PopoverSurfaceState } from './PopoverSurface.types';
2
- /**
3
- * Render the final JSX of PopoverSurface
4
- */
5
- export declare const renderPopoverSurface: (state: PopoverSurfaceState) => JSX.Element | null;
@@ -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,11 +0,0 @@
1
- import * as React from 'react';
2
- /**
3
- * PopoverTrigger Props
4
- */
5
- export declare type PopoverTriggerProps = {
6
- children: React.ReactElement;
7
- };
8
- /**
9
- * PopoverTrigger State
10
- */
11
- export declare type PopoverTriggerState = PopoverTriggerProps;
@@ -1,4 +0,0 @@
1
- export * from './PopoverTrigger';
2
- export * from './PopoverTrigger.types';
3
- export * from './renderPopoverTrigger';
4
- export * from './usePopoverTrigger';
@@ -1,5 +0,0 @@
1
- import type { PopoverTriggerState } from './PopoverTrigger.types';
2
- /**
3
- * Render the final JSX of PopoverTrigger
4
- */
5
- export declare const renderPopoverTrigger: (state: PopoverTriggerState) => JSX.Element;
@@ -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
@@ -1,4 +0,0 @@
1
- export * from './Popover';
2
- export * from './PopoverSurface';
3
- export * from './popoverContext';
4
- export * from './PopoverTrigger';
@@ -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,4 +0,0 @@
1
- import type { IsConformantOptions } from '@fluentui/react-conformance';
2
- export declare function isConformant<TProps = {}>(testInfo: Omit<IsConformantOptions<TProps>, 'componentPath'> & {
3
- componentPath?: string;
4
- }): void;
@@ -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,6 +0,0 @@
1
- import * as React from 'react';
2
- import type { PopoverProps } from './Popover.types';
3
- /**
4
- * Wrapper component that manages state for a PopoverTrigger and a PopoverSurface components.
5
- */
6
- export declare const Popover: React.FC<PopoverProps>;
@@ -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>;