@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.
Files changed (218) hide show
  1. package/CHANGELOG.json +1800 -1
  2. package/CHANGELOG.md +566 -2
  3. package/Spec.md +6 -6
  4. package/dist/react-popover.d.ts +59 -77
  5. package/lib/Popover.js.map +1 -1
  6. package/lib/PopoverSurface.js.map +1 -1
  7. package/lib/PopoverTrigger.js.map +1 -1
  8. package/lib/common/isConformant.d.ts +1 -1
  9. package/lib/common/isConformant.js +9 -5
  10. package/lib/common/isConformant.js.map +1 -1
  11. package/lib/common/mockUsePopoverContext.d.ts +1 -1
  12. package/lib/common/mockUsePopoverContext.js +28 -6
  13. package/lib/common/mockUsePopoverContext.js.map +1 -1
  14. package/lib/components/Popover/Popover.d.ts +2 -2
  15. package/lib/components/Popover/Popover.js +4 -3
  16. package/lib/components/Popover/Popover.js.map +1 -1
  17. package/lib/components/Popover/Popover.types.d.ts +24 -33
  18. package/lib/components/Popover/Popover.types.js.map +1 -1
  19. package/lib/components/Popover/index.js.map +1 -1
  20. package/lib/components/Popover/renderPopover.d.ts +1 -1
  21. package/lib/components/Popover/renderPopover.js +29 -17
  22. package/lib/components/Popover/renderPopover.js.map +1 -1
  23. package/lib/components/Popover/usePopover.d.ts +2 -3
  24. package/lib/components/Popover/usePopover.js +110 -88
  25. package/lib/components/Popover/usePopover.js.map +1 -1
  26. package/lib/components/PopoverSurface/PopoverSurface.d.ts +3 -3
  27. package/lib/components/PopoverSurface/PopoverSurface.js +5 -4
  28. package/lib/components/PopoverSurface/PopoverSurface.js.map +1 -1
  29. package/lib/components/PopoverSurface/PopoverSurface.types.d.ts +9 -18
  30. package/lib/components/PopoverSurface/PopoverSurface.types.js.map +1 -1
  31. package/lib/components/PopoverSurface/index.js.map +1 -1
  32. package/lib/components/PopoverSurface/renderPopoverSurface.d.ts +1 -1
  33. package/lib/components/PopoverSurface/renderPopoverSurface.js +18 -10
  34. package/lib/components/PopoverSurface/renderPopoverSurface.js.map +1 -1
  35. package/lib/components/PopoverSurface/usePopoverSurface.d.ts +4 -4
  36. package/lib/components/PopoverSurface/usePopoverSurface.js +94 -54
  37. package/lib/components/PopoverSurface/usePopoverSurface.js.map +1 -1
  38. package/lib/components/PopoverSurface/usePopoverSurfaceStyles.d.ts +2 -2
  39. package/lib/components/PopoverSurface/usePopoverSurfaceStyles.js +88 -64
  40. package/lib/components/PopoverSurface/usePopoverSurfaceStyles.js.map +1 -1
  41. package/lib/components/PopoverTrigger/PopoverTrigger.d.ts +2 -2
  42. package/lib/components/PopoverTrigger/PopoverTrigger.js +4 -3
  43. package/lib/components/PopoverTrigger/PopoverTrigger.js.map +1 -1
  44. package/lib/components/PopoverTrigger/PopoverTrigger.types.d.ts +3 -4
  45. package/lib/components/PopoverTrigger/PopoverTrigger.types.js.map +1 -1
  46. package/lib/components/PopoverTrigger/index.js.map +1 -1
  47. package/lib/components/PopoverTrigger/renderPopoverTrigger.d.ts +1 -1
  48. package/lib/components/PopoverTrigger/renderPopoverTrigger.js +1 -1
  49. package/lib/components/PopoverTrigger/renderPopoverTrigger.js.map +1 -1
  50. package/lib/components/PopoverTrigger/usePopoverTrigger.d.ts +2 -3
  51. package/lib/components/PopoverTrigger/usePopoverTrigger.js +83 -60
  52. package/lib/components/PopoverTrigger/usePopoverTrigger.js.map +1 -1
  53. package/lib/index.js.map +1 -1
  54. package/lib/popoverContext.d.ts +4 -5
  55. package/lib/popoverContext.js +19 -12
  56. package/lib/popoverContext.js.map +1 -1
  57. package/lib/tsdoc-metadata.json +1 -1
  58. package/lib-commonjs/Popover.js +7 -2
  59. package/lib-commonjs/Popover.js.map +1 -1
  60. package/lib-commonjs/PopoverSurface.js +7 -2
  61. package/lib-commonjs/PopoverSurface.js.map +1 -1
  62. package/lib-commonjs/PopoverTrigger.js +7 -2
  63. package/lib-commonjs/PopoverTrigger.js.map +1 -1
  64. package/lib-commonjs/common/isConformant.d.ts +1 -1
  65. package/lib-commonjs/common/isConformant.js +18 -7
  66. package/lib-commonjs/common/isConformant.js.map +1 -1
  67. package/lib-commonjs/common/mockUsePopoverContext.d.ts +1 -1
  68. package/lib-commonjs/common/mockUsePopoverContext.js +38 -9
  69. package/lib-commonjs/common/mockUsePopoverContext.js.map +1 -1
  70. package/lib-commonjs/components/Popover/Popover.d.ts +2 -2
  71. package/lib-commonjs/components/Popover/Popover.js +14 -6
  72. package/lib-commonjs/components/Popover/Popover.js.map +1 -1
  73. package/lib-commonjs/components/Popover/Popover.types.d.ts +24 -33
  74. package/lib-commonjs/components/Popover/Popover.types.js +4 -1
  75. package/lib-commonjs/components/Popover/Popover.types.js.map +1 -1
  76. package/lib-commonjs/components/Popover/index.js +10 -2
  77. package/lib-commonjs/components/Popover/index.js.map +1 -1
  78. package/lib-commonjs/components/Popover/renderPopover.d.ts +1 -1
  79. package/lib-commonjs/components/Popover/renderPopover.js +39 -20
  80. package/lib-commonjs/components/Popover/renderPopover.js.map +1 -1
  81. package/lib-commonjs/components/Popover/usePopover.d.ts +2 -3
  82. package/lib-commonjs/components/Popover/usePopover.js +127 -93
  83. package/lib-commonjs/components/Popover/usePopover.js.map +1 -1
  84. package/lib-commonjs/components/PopoverSurface/PopoverSurface.d.ts +3 -3
  85. package/lib-commonjs/components/PopoverSurface/PopoverSurface.js +18 -9
  86. package/lib-commonjs/components/PopoverSurface/PopoverSurface.js.map +1 -1
  87. package/lib-commonjs/components/PopoverSurface/PopoverSurface.types.d.ts +9 -18
  88. package/lib-commonjs/components/PopoverSurface/PopoverSurface.types.js +4 -1
  89. package/lib-commonjs/components/PopoverSurface/PopoverSurface.types.js.map +1 -1
  90. package/lib-commonjs/components/PopoverSurface/index.js +11 -2
  91. package/lib-commonjs/components/PopoverSurface/index.js.map +1 -1
  92. package/lib-commonjs/components/PopoverSurface/renderPopoverSurface.d.ts +1 -1
  93. package/lib-commonjs/components/PopoverSurface/renderPopoverSurface.js +32 -14
  94. package/lib-commonjs/components/PopoverSurface/renderPopoverSurface.js.map +1 -1
  95. package/lib-commonjs/components/PopoverSurface/usePopoverSurface.d.ts +4 -4
  96. package/lib-commonjs/components/PopoverSurface/usePopoverSurface.js +110 -60
  97. package/lib-commonjs/components/PopoverSurface/usePopoverSurface.js.map +1 -1
  98. package/lib-commonjs/components/PopoverSurface/usePopoverSurfaceStyles.d.ts +2 -2
  99. package/lib-commonjs/components/PopoverSurface/usePopoverSurfaceStyles.js +95 -65
  100. package/lib-commonjs/components/PopoverSurface/usePopoverSurfaceStyles.js.map +1 -1
  101. package/lib-commonjs/components/PopoverTrigger/PopoverTrigger.d.ts +2 -2
  102. package/lib-commonjs/components/PopoverTrigger/PopoverTrigger.js +14 -6
  103. package/lib-commonjs/components/PopoverTrigger/PopoverTrigger.js.map +1 -1
  104. package/lib-commonjs/components/PopoverTrigger/PopoverTrigger.types.d.ts +3 -4
  105. package/lib-commonjs/components/PopoverTrigger/PopoverTrigger.types.js +4 -1
  106. package/lib-commonjs/components/PopoverTrigger/PopoverTrigger.types.js.map +1 -1
  107. package/lib-commonjs/components/PopoverTrigger/index.js +10 -2
  108. package/lib-commonjs/components/PopoverTrigger/index.js.map +1 -1
  109. package/lib-commonjs/components/PopoverTrigger/renderPopoverTrigger.d.ts +1 -1
  110. package/lib-commonjs/components/PopoverTrigger/renderPopoverTrigger.js +7 -2
  111. package/lib-commonjs/components/PopoverTrigger/renderPopoverTrigger.js.map +1 -1
  112. package/lib-commonjs/components/PopoverTrigger/usePopoverTrigger.d.ts +2 -3
  113. package/lib-commonjs/components/PopoverTrigger/usePopoverTrigger.js +98 -65
  114. package/lib-commonjs/components/PopoverTrigger/usePopoverTrigger.js.map +1 -1
  115. package/lib-commonjs/index.js +10 -2
  116. package/lib-commonjs/index.js.map +1 -1
  117. package/lib-commonjs/popoverContext.d.ts +4 -5
  118. package/lib-commonjs/popoverContext.js +28 -14
  119. package/lib-commonjs/popoverContext.js.map +1 -1
  120. package/package.json +18 -15
  121. package/.storybook/main.js +0 -11
  122. package/.storybook/preview.js +0 -4
  123. package/bundle-size/Popover.fixture.js +0 -7
  124. package/config/api-extractor.json +0 -3
  125. package/config/tests.js +0 -7
  126. package/e2e/Popover.e2e.ts +0 -139
  127. package/etc/react-popover.api.md +0 -135
  128. package/just.config.ts +0 -3
  129. package/lib/Popover.stories.d.ts +0 -62
  130. package/lib/Popover.stories.js +0 -114
  131. package/lib/Popover.stories.js.map +0 -1
  132. package/lib/components/Popover/getOffsetWithArrow.d.ts +0 -7
  133. package/lib/components/Popover/getOffsetWithArrow.js +0 -34
  134. package/lib/components/Popover/getOffsetWithArrow.js.map +0 -1
  135. package/lib-amd/Popover.d.ts +0 -1
  136. package/lib-amd/Popover.js +0 -6
  137. package/lib-amd/Popover.js.map +0 -1
  138. package/lib-amd/Popover.stories.d.ts +0 -62
  139. package/lib-amd/Popover.stories.js +0 -121
  140. package/lib-amd/Popover.stories.js.map +0 -1
  141. package/lib-amd/PopoverSurface.d.ts +0 -1
  142. package/lib-amd/PopoverSurface.js +0 -6
  143. package/lib-amd/PopoverSurface.js.map +0 -1
  144. package/lib-amd/PopoverTrigger.d.ts +0 -1
  145. package/lib-amd/PopoverTrigger.js +0 -6
  146. package/lib-amd/PopoverTrigger.js.map +0 -1
  147. package/lib-amd/common/isConformant.d.ts +0 -4
  148. package/lib-amd/common/isConformant.js +0 -14
  149. package/lib-amd/common/isConformant.js.map +0 -1
  150. package/lib-amd/common/mockUsePopoverContext.d.ts +0 -7
  151. package/lib-amd/common/mockUsePopoverContext.js +0 -20
  152. package/lib-amd/common/mockUsePopoverContext.js.map +0 -1
  153. package/lib-amd/components/Popover/Popover.d.ts +0 -6
  154. package/lib-amd/components/Popover/Popover.js +0 -15
  155. package/lib-amd/components/Popover/Popover.js.map +0 -1
  156. package/lib-amd/components/Popover/Popover.types.d.ts +0 -109
  157. package/lib-amd/components/Popover/Popover.types.js +0 -5
  158. package/lib-amd/components/Popover/Popover.types.js.map +0 -1
  159. package/lib-amd/components/Popover/getOffsetWithArrow.d.ts +0 -7
  160. package/lib-amd/components/Popover/getOffsetWithArrow.js +0 -40
  161. package/lib-amd/components/Popover/getOffsetWithArrow.js.map +0 -1
  162. package/lib-amd/components/Popover/index.d.ts +0 -4
  163. package/lib-amd/components/Popover/index.js +0 -9
  164. package/lib-amd/components/Popover/index.js.map +0 -1
  165. package/lib-amd/components/Popover/renderPopover.d.ts +0 -5
  166. package/lib-amd/components/Popover/renderPopover.js +0 -29
  167. package/lib-amd/components/Popover/renderPopover.js.map +0 -1
  168. package/lib-amd/components/Popover/usePopover.d.ts +0 -11
  169. package/lib-amd/components/Popover/usePopover.js +0 -112
  170. package/lib-amd/components/Popover/usePopover.js.map +0 -1
  171. package/lib-amd/components/PopoverSurface/PopoverSurface.d.ts +0 -6
  172. package/lib-amd/components/PopoverSurface/PopoverSurface.js +0 -15
  173. package/lib-amd/components/PopoverSurface/PopoverSurface.js.map +0 -1
  174. package/lib-amd/components/PopoverSurface/PopoverSurface.types.d.ts +0 -30
  175. package/lib-amd/components/PopoverSurface/PopoverSurface.types.js +0 -5
  176. package/lib-amd/components/PopoverSurface/PopoverSurface.types.js.map +0 -1
  177. package/lib-amd/components/PopoverSurface/index.d.ts +0 -5
  178. package/lib-amd/components/PopoverSurface/index.js +0 -10
  179. package/lib-amd/components/PopoverSurface/index.js.map +0 -1
  180. package/lib-amd/components/PopoverSurface/renderPopoverSurface.d.ts +0 -5
  181. package/lib-amd/components/PopoverSurface/renderPopoverSurface.js +0 -21
  182. package/lib-amd/components/PopoverSurface/renderPopoverSurface.js.map +0 -1
  183. package/lib-amd/components/PopoverSurface/usePopoverSurface.d.ts +0 -13
  184. package/lib-amd/components/PopoverSurface/usePopoverSurface.js +0 -69
  185. package/lib-amd/components/PopoverSurface/usePopoverSurface.js.map +0 -1
  186. package/lib-amd/components/PopoverSurface/usePopoverSurfaceStyles.d.ts +0 -7
  187. package/lib-amd/components/PopoverSurface/usePopoverSurfaceStyles.js +0 -81
  188. package/lib-amd/components/PopoverSurface/usePopoverSurfaceStyles.js.map +0 -1
  189. package/lib-amd/components/PopoverTrigger/PopoverTrigger.d.ts +0 -6
  190. package/lib-amd/components/PopoverTrigger/PopoverTrigger.js +0 -15
  191. package/lib-amd/components/PopoverTrigger/PopoverTrigger.js.map +0 -1
  192. package/lib-amd/components/PopoverTrigger/PopoverTrigger.types.d.ts +0 -12
  193. package/lib-amd/components/PopoverTrigger/PopoverTrigger.types.js +0 -5
  194. package/lib-amd/components/PopoverTrigger/PopoverTrigger.types.js.map +0 -1
  195. package/lib-amd/components/PopoverTrigger/index.d.ts +0 -4
  196. package/lib-amd/components/PopoverTrigger/index.js +0 -9
  197. package/lib-amd/components/PopoverTrigger/index.js.map +0 -1
  198. package/lib-amd/components/PopoverTrigger/renderPopoverTrigger.d.ts +0 -5
  199. package/lib-amd/components/PopoverTrigger/renderPopoverTrigger.js +0 -13
  200. package/lib-amd/components/PopoverTrigger/renderPopoverTrigger.js.map +0 -1
  201. package/lib-amd/components/PopoverTrigger/usePopoverTrigger.d.ts +0 -11
  202. package/lib-amd/components/PopoverTrigger/usePopoverTrigger.js +0 -75
  203. package/lib-amd/components/PopoverTrigger/usePopoverTrigger.js.map +0 -1
  204. package/lib-amd/index.d.ts +0 -4
  205. package/lib-amd/index.js +0 -9
  206. package/lib-amd/index.js.map +0 -1
  207. package/lib-amd/popoverContext.d.ts +0 -9
  208. package/lib-amd/popoverContext.js +0 -22
  209. package/lib-amd/popoverContext.js.map +0 -1
  210. package/lib-commonjs/Popover.stories.d.ts +0 -62
  211. package/lib-commonjs/Popover.stories.js +0 -122
  212. package/lib-commonjs/Popover.stories.js.map +0 -1
  213. package/lib-commonjs/components/Popover/getOffsetWithArrow.d.ts +0 -7
  214. package/lib-commonjs/components/Popover/getOffsetWithArrow.js +0 -38
  215. package/lib-commonjs/components/Popover/getOffsetWithArrow.js.map +0 -1
  216. package/src/components/Popover/Popover.types.ts +0 -124
  217. package/src/components/PopoverSurface/PopoverSurface.types.ts +0 -36
  218. 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,6 +0,0 @@
1
- import * as React from 'react';
2
- import { PopoverProps } from './Popover.types';
3
- /**
4
- * Popover component
5
- */
6
- export declare const Popover: React.FC<PopoverProps>;
@@ -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,5 +0,0 @@
1
- define(["require", "exports"], function (require, exports) {
2
- "use strict";
3
- Object.defineProperty(exports, "__esModule", { value: true });
4
- });
5
- //# sourceMappingURL=Popover.types.js.map
@@ -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,4 +0,0 @@
1
- export * from './Popover';
2
- export * from './Popover.types';
3
- export * from './renderPopover';
4
- export * from './usePopover';
@@ -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,5 +0,0 @@
1
- import { PopoverState } from './Popover.types';
2
- /**
3
- * Render the final JSX of Popover
4
- */
5
- export declare const renderPopover: (state: PopoverState) => JSX.Element;
@@ -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,5 +0,0 @@
1
- define(["require", "exports"], function (require, exports) {
2
- "use strict";
3
- Object.defineProperty(exports, "__esModule", { value: true });
4
- });
5
- //# sourceMappingURL=PopoverSurface.types.js.map
@@ -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,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,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,5 +0,0 @@
1
- import { PopoverSurfaceState } from './PopoverSurface.types';
2
- /**
3
- * Render the final JSX of PopoverSurface
4
- */
5
- export declare const renderPopoverSurface: (state: PopoverSurfaceState) => JSX.Element | null;
@@ -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;