@fluentui/react-popover 9.0.0-alpha.8 → 9.0.0-nightly.f81b28ceb3.1

Sign up to get free protection for your applications and to get access to all the features.
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,135 +0,0 @@
1
- ## API Report File for "@fluentui/react-popover"
2
-
3
- > Do not edit this file. It is a report generated by [API Extractor](https://api-extractor.com/).
4
-
5
- ```ts
6
-
7
- import { ComponentProps } from '@fluentui/react-utilities';
8
- import { ComponentState } from '@fluentui/react-utilities';
9
- import { Context } from '@fluentui/react-context-selector';
10
- import { ContextSelector } from '@fluentui/react-context-selector';
11
- import { PopperOptions } from '@fluentui/react-positioning';
12
- import { PopperVirtualElement } from '@fluentui/react-positioning';
13
- import { PortalProps } from '@fluentui/react-portal';
14
- import * as React_2 from 'react';
15
-
16
- // @public (undocumented)
17
- export const arrowHeights: Record<PopoverSize, number>;
18
-
19
- // @public
20
- export interface OnOpenChangeData extends Pick<PopoverState, 'open'> {
21
- }
22
-
23
- // @public
24
- export type OpenPopoverEvents = MouseEvent | TouchEvent | React_2.MouseEvent<HTMLElement> | React_2.KeyboardEvent<HTMLElement> | React_2.FocusEvent<HTMLElement>;
25
-
26
- // @public
27
- export const Popover: React_2.FC<PopoverProps>;
28
-
29
- // @public (undocumented)
30
- export const PopoverContext: Context<PopoverContextValue>;
31
-
32
- // @public
33
- export interface PopoverContextValue extends Pick<PopoverState, 'open' | 'setOpen' | 'triggerRef' | 'contentRef' | 'target' | 'openOnHover' | 'openOnContext' | 'mountNode' | 'noArrow' | 'arrowRef' | 'size' | 'brand' | 'inverted' | 'trapFocus'> {
34
- }
35
-
36
- // @public
37
- export type PopoverDefaultedProps = never;
38
-
39
- // @public
40
- export interface PopoverProps extends Pick<PopperOptions, 'position' | 'align' | 'offset' | 'coverTarget' | 'target'>, Pick<PortalProps, 'mountNode'> {
41
- brand?: boolean;
42
- // (undocumented)
43
- children: React_2.ReactNode;
44
- defaultOpen?: boolean;
45
- inverted?: boolean;
46
- noArrow?: boolean;
47
- onOpenChange?: (e: OpenPopoverEvents, data: OnOpenChangeData) => void;
48
- open?: boolean;
49
- openOnContext?: boolean;
50
- openOnHover?: boolean;
51
- size?: PopoverSize;
52
- trapFocus?: boolean;
53
- }
54
-
55
- // @public
56
- export type PopoverShorthandProps = never;
57
-
58
- // @public
59
- export type PopoverSize = 'small' | 'medium' | 'large';
60
-
61
- // @public
62
- export interface PopoverState extends ComponentState<PopoverProps, PopoverShorthandProps, PopoverDefaultedProps> {
63
- arrowRef: React_2.MutableRefObject<HTMLDivElement | null>;
64
- contentRef: React_2.MutableRefObject<HTMLElement | null>;
65
- contextTarget: PopperVirtualElement | undefined;
66
- open: boolean;
67
- setContextTarget: React_2.Dispatch<PopperVirtualElement | undefined>;
68
- setOpen: (e: OpenPopoverEvents, open: boolean) => void;
69
- // (undocumented)
70
- size: NonNullable<PopoverProps['size']>;
71
- triggerRef: React_2.MutableRefObject<HTMLElement | null>;
72
- }
73
-
74
- // @public
75
- export const PopoverSurface: React_2.ForwardRefExoticComponent<PopoverSurfaceProps & React_2.RefAttributes<HTMLElement>>;
76
-
77
- // @public
78
- export type PopoverSurfaceDefaultedProps = never;
79
-
80
- // @public
81
- export interface PopoverSurfaceProps extends ComponentProps, React_2.HTMLAttributes<HTMLElement> {
82
- }
83
-
84
- // @public
85
- export type PopoverSurfaceShorthandProps = never;
86
-
87
- // @public
88
- export interface PopoverSurfaceState extends ComponentState<PopoverSurfaceProps, PopoverSurfaceShorthandProps, PopoverSurfaceDefaultedProps>, Pick<PopoverContextValue, 'open' | 'mountNode' | 'noArrow' | 'size' | 'brand' | 'inverted'> {
89
- arrowClassName?: string;
90
- arrowRef?: React_2.Ref<HTMLDivElement>;
91
- // (undocumented)
92
- ref: React_2.Ref<HTMLElement>;
93
- }
94
-
95
- // @public
96
- export const PopoverTrigger: React_2.FC<PopoverTriggerProps>;
97
-
98
- // @public
99
- export interface PopoverTriggerProps {
100
- // (undocumented)
101
- children: React_2.ReactElement;
102
- }
103
-
104
- // @public
105
- export interface PopoverTriggerState extends PopoverTriggerProps {
106
- }
107
-
108
- // @public
109
- export const renderPopover: (state: PopoverState) => JSX.Element;
110
-
111
- // @public
112
- export const renderPopoverSurface: (state: PopoverSurfaceState) => JSX.Element | null;
113
-
114
- // @public
115
- export const renderPopoverTrigger: (state: PopoverTriggerState) => JSX.Element;
116
-
117
- // @public
118
- export const usePopover: (props: PopoverProps, defaultProps?: PopoverProps | undefined) => PopoverState;
119
-
120
- // @public (undocumented)
121
- export const usePopoverContext: <T>(selector: ContextSelector<PopoverContextValue, T>) => T;
122
-
123
- // @public
124
- export const usePopoverSurface: (props: PopoverSurfaceProps, ref: React_2.Ref<HTMLElement>, defaultProps?: PopoverSurfaceProps | undefined) => PopoverSurfaceState;
125
-
126
- // @public
127
- export const usePopoverSurfaceStyles: (state: PopoverSurfaceState) => PopoverSurfaceState;
128
-
129
- // @public
130
- export const usePopoverTrigger: (props: PopoverTriggerProps, defaultProps?: PopoverTriggerProps | undefined) => PopoverTriggerState;
131
-
132
-
133
- // (No @packageDocumentation comment for this package)
134
-
135
- ```
package/just.config.ts DELETED
@@ -1,3 +0,0 @@
1
- import { preset } from '@fluentui/scripts';
2
-
3
- preset();
@@ -1,62 +0,0 @@
1
- import * as React from 'react';
2
- import { PopoverProps } from './index';
3
- export declare const Default: {
4
- (props: PopoverProps): JSX.Element;
5
- argTypes: {
6
- open: {
7
- defaultValue: boolean;
8
- control: string;
9
- };
10
- openOnContext: {
11
- defaultValue: boolean;
12
- control: string;
13
- };
14
- openOnHover: {
15
- defaultValue: boolean;
16
- control: string;
17
- };
18
- position: {
19
- type: {
20
- name: string;
21
- required: boolean;
22
- };
23
- control: {
24
- type: string;
25
- options: string[];
26
- };
27
- };
28
- align: {
29
- type: {
30
- name: string;
31
- required: boolean;
32
- };
33
- control: {
34
- type: string;
35
- options: string[];
36
- };
37
- };
38
- size: {
39
- type: {
40
- name: string;
41
- required: boolean;
42
- };
43
- control: {
44
- type: string;
45
- options: string[];
46
- };
47
- };
48
- trapFocus: {
49
- defaultValue: boolean;
50
- control: string;
51
- };
52
- };
53
- };
54
- export declare const AnchorToTarget: () => JSX.Element;
55
- export declare const Controlled: () => JSX.Element;
56
- export declare const WithCustomTrigger: () => JSX.Element;
57
- export declare const NestedPopovers: () => JSX.Element;
58
- declare const _default: {
59
- title: string;
60
- component: React.FC<PopoverProps>;
61
- };
62
- export default _default;
@@ -1,114 +0,0 @@
1
- import { __assign } from "tslib";
2
- import * as React from 'react';
3
- import { Popover, PopoverTrigger, PopoverSurface } from './index';
4
- var ExampleContent = function () {
5
- return (React.createElement("div", null,
6
- React.createElement("h3", null, "Popover content"),
7
- React.createElement("div", null, "This is some popover content")));
8
- };
9
- export var Default = function (props) { return (React.createElement(Popover, __assign({}, props),
10
- React.createElement(PopoverTrigger, null,
11
- React.createElement("button", null, "Popover trigger")),
12
- React.createElement(PopoverSurface, null,
13
- React.createElement(ExampleContent, null),
14
- React.createElement("div", null,
15
- React.createElement("button", null, "Action"),
16
- React.createElement("button", null, "Action"))))); };
17
- Default.argTypes = {
18
- open: {
19
- defaultValue: false,
20
- control: 'boolean',
21
- },
22
- openOnContext: {
23
- defaultValue: false,
24
- control: 'boolean',
25
- },
26
- openOnHover: {
27
- defaultValue: false,
28
- control: 'boolean',
29
- },
30
- position: {
31
- type: { name: 'string', required: false },
32
- control: {
33
- type: 'select',
34
- options: ['above', 'below', 'before', 'after'],
35
- },
36
- },
37
- align: {
38
- type: { name: 'string', required: false },
39
- control: {
40
- type: 'select',
41
- options: ['top', 'bottom', 'start', 'end', 'center'],
42
- },
43
- },
44
- size: {
45
- type: { name: 'string', required: false },
46
- control: {
47
- type: 'select',
48
- options: ['small', 'medium', 'large'],
49
- },
50
- },
51
- trapFocus: {
52
- defaultValue: true,
53
- control: 'boolean',
54
- },
55
- };
56
- export var AnchorToTarget = function () {
57
- var _a = React.useState(), target = _a[0], setTarget = _a[1];
58
- return (React.createElement(React.Fragment, null,
59
- React.createElement("div", null,
60
- React.createElement(Popover, { target: target },
61
- React.createElement(PopoverTrigger, null,
62
- React.createElement("button", null, "Popover trigger")),
63
- React.createElement(PopoverSurface, null,
64
- React.createElement(ExampleContent, null)))),
65
- React.createElement("button", { ref: setTarget }, "Custom target")));
66
- };
67
- export var Controlled = function () {
68
- var _a = React.useState(false), open = _a[0], setOpen = _a[1];
69
- var onOpenChange = function (_, data) { return setOpen(data.open || false); };
70
- return (React.createElement(Popover, { open: open, onOpenChange: onOpenChange },
71
- React.createElement(PopoverTrigger, null,
72
- React.createElement("button", null, "Controlled trigger")),
73
- React.createElement(PopoverSurface, null,
74
- React.createElement(ExampleContent, null))));
75
- };
76
- export var WithCustomTrigger = function () {
77
- var _a = React.useState(false), open = _a[0], setOpen = _a[1];
78
- var _b = React.useState(null), target = _b[0], setTarget = _b[1];
79
- var onClick = function () { return setOpen(function (s) { return !s; }); };
80
- var onOpenChange = function (_, data) { return setOpen(data.open || false); };
81
- return (React.createElement(React.Fragment, null,
82
- React.createElement("button", { "aria-haspopup": true, ref: setTarget, onClick: onClick }, "Custom trigger"),
83
- React.createElement(Popover, { target: target, open: open, onOpenChange: onOpenChange },
84
- React.createElement(PopoverSurface, null,
85
- React.createElement(ExampleContent, null)))));
86
- };
87
- var FirstNestedPopover = function () { return (React.createElement(Popover, { trapFocus: true },
88
- React.createElement(PopoverTrigger, null,
89
- React.createElement("button", null, "First nested trigger")),
90
- React.createElement(PopoverSurface, null,
91
- React.createElement(ExampleContent, null),
92
- React.createElement("button", null, "First nested button"),
93
- React.createElement(SecondNestedPopover, null),
94
- React.createElement(SecondNestedPopover, null)))); };
95
- var SecondNestedPopover = function () { return (React.createElement(Popover, { trapFocus: true },
96
- React.createElement(PopoverTrigger, null,
97
- React.createElement("button", null, "Second nested trigger")),
98
- React.createElement(PopoverSurface, null,
99
- React.createElement(ExampleContent, null),
100
- React.createElement("button", null, "Second nested button")))); };
101
- export var NestedPopovers = function () {
102
- return (React.createElement(Popover, { trapFocus: true },
103
- React.createElement(PopoverTrigger, null,
104
- React.createElement("button", null, "Root trigger")),
105
- React.createElement(PopoverSurface, null,
106
- React.createElement(ExampleContent, null),
107
- React.createElement("button", null, "Root button"),
108
- React.createElement(FirstNestedPopover, null))));
109
- };
110
- export default {
111
- title: 'Components/Popover',
112
- component: Popover,
113
- };
114
- //# sourceMappingURL=Popover.stories.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Popover.stories.js","sourceRoot":"../src/","sources":["Popover.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { Popover, PopoverTrigger, PopoverSurface, PopoverProps } from './index';\n\nconst ExampleContent = () => {\n return (\n <div>\n <h3>Popover content</h3>\n\n <div>This is some popover content</div>\n </div>\n );\n};\n\nexport const Default = (props: PopoverProps) => (\n <Popover {...props}>\n <PopoverTrigger>\n <button>Popover trigger</button>\n </PopoverTrigger>\n\n <PopoverSurface>\n <ExampleContent />\n\n <div>\n <button>Action</button>\n <button>Action</button>\n </div>\n </PopoverSurface>\n </Popover>\n);\n\nDefault.argTypes = {\n open: {\n defaultValue: false,\n control: 'boolean',\n },\n\n openOnContext: {\n defaultValue: false,\n control: 'boolean',\n },\n\n openOnHover: {\n defaultValue: false,\n control: 'boolean',\n },\n\n position: {\n type: { name: 'string', required: false },\n control: {\n type: 'select',\n options: ['above', 'below', 'before', 'after'],\n },\n },\n\n align: {\n type: { name: 'string', required: false },\n control: {\n type: 'select',\n options: ['top', 'bottom', 'start', 'end', 'center'],\n },\n },\n\n size: {\n type: { name: 'string', required: false },\n control: {\n type: 'select',\n options: ['small', 'medium', 'large'],\n },\n },\n\n trapFocus: {\n defaultValue: true,\n control: 'boolean',\n },\n};\n\nexport const AnchorToTarget = () => {\n const [target, setTarget] = React.useState<HTMLButtonElement | null>();\n\n return (\n <>\n <div>\n <Popover target={target}>\n <PopoverTrigger>\n <button>Popover trigger</button>\n </PopoverTrigger>\n\n <PopoverSurface>\n <ExampleContent />\n </PopoverSurface>\n </Popover>\n </div>\n\n <button ref={setTarget}>Custom target</button>\n </>\n );\n};\n\nexport const Controlled = () => {\n const [open, setOpen] = React.useState(false);\n const onOpenChange: PopoverProps['onOpenChange'] = (_, data) => setOpen(data.open || false);\n\n return (\n <Popover open={open} onOpenChange={onOpenChange}>\n <PopoverTrigger>\n <button>Controlled trigger</button>\n </PopoverTrigger>\n <PopoverSurface>\n <ExampleContent />\n </PopoverSurface>\n </Popover>\n );\n};\n\nexport const WithCustomTrigger = () => {\n const [open, setOpen] = React.useState(false);\n const [target, setTarget] = React.useState<HTMLElement | null>(null);\n const onClick = () => setOpen(s => !s);\n const onOpenChange: PopoverProps['onOpenChange'] = (_, data) => setOpen(data.open || false);\n\n return (\n <>\n <button aria-haspopup ref={setTarget} onClick={onClick}>\n Custom trigger\n </button>\n <Popover target={target} open={open} onOpenChange={onOpenChange}>\n <PopoverSurface>\n <ExampleContent />\n </PopoverSurface>\n </Popover>\n </>\n );\n};\n\nconst FirstNestedPopover = () => (\n <Popover trapFocus>\n <PopoverTrigger>\n <button>First nested trigger</button>\n </PopoverTrigger>\n\n <PopoverSurface>\n <ExampleContent />\n <button>First nested button</button>\n <SecondNestedPopover />\n <SecondNestedPopover />\n </PopoverSurface>\n </Popover>\n);\n\nconst SecondNestedPopover = () => (\n <Popover trapFocus>\n <PopoverTrigger>\n <button>Second nested trigger</button>\n </PopoverTrigger>\n\n <PopoverSurface>\n <ExampleContent />\n <button>Second nested button</button>\n </PopoverSurface>\n </Popover>\n);\n\nexport const NestedPopovers = () => {\n return (\n <Popover trapFocus>\n <PopoverTrigger>\n <button>Root trigger</button>\n </PopoverTrigger>\n\n <PopoverSurface>\n <ExampleContent />\n <button>Root button</button>\n <FirstNestedPopover />\n </PopoverSurface>\n </Popover>\n );\n};\n\nexport default {\n title: 'Components/Popover',\n component: Popover,\n};\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,34 +0,0 @@
1
- /**
2
- * @param userOffset - The offset provided by the user
3
- * @param arrowHeight - The height of the arrow in px
4
- * @returns User offset augmented with arrow height
5
- */
6
- export function getOffsetWithArrow(userOffset, arrowHeight) {
7
- var offsetWithArrow = userOffset;
8
- if (!userOffset) {
9
- return [0, arrowHeight];
10
- }
11
- if (Array.isArray(offsetWithArrow)) {
12
- setArrowOffset(offsetWithArrow, arrowHeight);
13
- return offsetWithArrow;
14
- }
15
- if (typeof offsetWithArrow === 'function') {
16
- var userOffsetFn_1 = offsetWithArrow;
17
- offsetWithArrow = function (offsetParams) {
18
- var offset = userOffsetFn_1(offsetParams);
19
- setArrowOffset(offset, arrowHeight);
20
- return offset;
21
- };
22
- }
23
- // This should never happen
24
- return [0, 0];
25
- }
26
- var setArrowOffset = function (offset, arrowHeight) {
27
- if (offset[1] !== null && offset[1] !== undefined) {
28
- offset[1] += arrowHeight;
29
- }
30
- else {
31
- offset[1] = arrowHeight;
32
- }
33
- };
34
- //# sourceMappingURL=getOffsetWithArrow.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"getOffsetWithArrow.js","sourceRoot":"../src/","sources":["components/Popover/getOffsetWithArrow.ts"],"names":[],"mappings":"AAEA;;;;GAIG;AACH,MAAM,UAAU,kBAAkB,CAAC,UAAqC,EAAE,WAAmB;IAC3F,IAAI,eAAe,GAAG,UAAU,CAAC;IACjC,IAAI,CAAC,UAAU,EAAE;QACf,OAAO,CAAC,CAAC,EAAE,WAAW,CAAC,CAAC;KACzB;IAED,IAAI,KAAK,CAAC,OAAO,CAAC,eAAe,CAAC,EAAE;QAClC,cAAc,CAAC,eAAe,EAAE,WAAW,CAAC,CAAC;QAC7C,OAAO,eAAe,CAAC;KACxB;IAED,IAAI,OAAO,eAAe,KAAK,UAAU,EAAE;QACzC,IAAM,cAAY,GAAG,eAAe,CAAC;QACrC,eAAe,GAAG,UAAA,YAAY;YAC5B,IAAM,MAAM,GAAG,cAAY,CAAC,YAAY,CAAC,CAAC;YAC1C,cAAc,CAAC,MAAM,EAAE,WAAW,CAAC,CAAC;YACpC,OAAO,MAAM,CAAC;QAChB,CAAC,CAAC;KACH;IAED,2BAA2B;IAC3B,OAAO,CAAC,CAAC,EAAE,CAAC,CAAU,CAAC;AACzB,CAAC;AAED,IAAM,cAAc,GAAG,UAAC,MAA8D,EAAE,WAAmB;IACzG,IAAI,MAAM,CAAC,CAAC,CAAC,KAAK,IAAI,IAAI,MAAM,CAAC,CAAC,CAAC,KAAK,SAAS,EAAE;QACjD,MAAM,CAAC,CAAC,CAAC,IAAI,WAAW,CAAC;KAC1B;SAAM;QACL,MAAM,CAAC,CAAC,CAAC,GAAG,WAAW,CAAC;KACzB;AACH,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 +0,0 @@
1
- export * from './components/Popover/index';
@@ -1,6 +0,0 @@
1
- define(["require", "exports", "tslib", "./components/Popover/index"], function (require, exports, tslib_1, index_1) {
2
- "use strict";
3
- Object.defineProperty(exports, "__esModule", { value: true });
4
- tslib_1.__exportStar(index_1, exports);
5
- });
6
- //# sourceMappingURL=Popover.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Popover.js","sourceRoot":"../src/","sources":["Popover.ts"],"names":[],"mappings":";;;IAAA,uCAA2C","sourcesContent":["export * from './components/Popover/index';\n"]}
@@ -1,62 +0,0 @@
1
- import * as React from 'react';
2
- import { PopoverProps } from './index';
3
- export declare const Default: {
4
- (props: PopoverProps): JSX.Element;
5
- argTypes: {
6
- open: {
7
- defaultValue: boolean;
8
- control: string;
9
- };
10
- openOnContext: {
11
- defaultValue: boolean;
12
- control: string;
13
- };
14
- openOnHover: {
15
- defaultValue: boolean;
16
- control: string;
17
- };
18
- position: {
19
- type: {
20
- name: string;
21
- required: boolean;
22
- };
23
- control: {
24
- type: string;
25
- options: string[];
26
- };
27
- };
28
- align: {
29
- type: {
30
- name: string;
31
- required: boolean;
32
- };
33
- control: {
34
- type: string;
35
- options: string[];
36
- };
37
- };
38
- size: {
39
- type: {
40
- name: string;
41
- required: boolean;
42
- };
43
- control: {
44
- type: string;
45
- options: string[];
46
- };
47
- };
48
- trapFocus: {
49
- defaultValue: boolean;
50
- control: string;
51
- };
52
- };
53
- };
54
- export declare const AnchorToTarget: () => JSX.Element;
55
- export declare const Controlled: () => JSX.Element;
56
- export declare const WithCustomTrigger: () => JSX.Element;
57
- export declare const NestedPopovers: () => JSX.Element;
58
- declare const _default: {
59
- title: string;
60
- component: React.FC<PopoverProps>;
61
- };
62
- export default _default;
@@ -1,121 +0,0 @@
1
- define(["require", "exports", "tslib", "react", "./index"], function (require, exports, tslib_1, React, index_1) {
2
- "use strict";
3
- Object.defineProperty(exports, "__esModule", { value: true });
4
- exports.NestedPopovers = exports.WithCustomTrigger = exports.Controlled = exports.AnchorToTarget = exports.Default = void 0;
5
- var ExampleContent = function () {
6
- return (React.createElement("div", null,
7
- React.createElement("h3", null, "Popover content"),
8
- React.createElement("div", null, "This is some popover content")));
9
- };
10
- var Default = function (props) { return (React.createElement(index_1.Popover, tslib_1.__assign({}, props),
11
- React.createElement(index_1.PopoverTrigger, null,
12
- React.createElement("button", null, "Popover trigger")),
13
- React.createElement(index_1.PopoverSurface, null,
14
- React.createElement(ExampleContent, null),
15
- React.createElement("div", null,
16
- React.createElement("button", null, "Action"),
17
- React.createElement("button", null, "Action"))))); };
18
- exports.Default = Default;
19
- exports.Default.argTypes = {
20
- open: {
21
- defaultValue: false,
22
- control: 'boolean',
23
- },
24
- openOnContext: {
25
- defaultValue: false,
26
- control: 'boolean',
27
- },
28
- openOnHover: {
29
- defaultValue: false,
30
- control: 'boolean',
31
- },
32
- position: {
33
- type: { name: 'string', required: false },
34
- control: {
35
- type: 'select',
36
- options: ['above', 'below', 'before', 'after'],
37
- },
38
- },
39
- align: {
40
- type: { name: 'string', required: false },
41
- control: {
42
- type: 'select',
43
- options: ['top', 'bottom', 'start', 'end', 'center'],
44
- },
45
- },
46
- size: {
47
- type: { name: 'string', required: false },
48
- control: {
49
- type: 'select',
50
- options: ['small', 'medium', 'large'],
51
- },
52
- },
53
- trapFocus: {
54
- defaultValue: true,
55
- control: 'boolean',
56
- },
57
- };
58
- var AnchorToTarget = function () {
59
- var _a = React.useState(), target = _a[0], setTarget = _a[1];
60
- return (React.createElement(React.Fragment, null,
61
- React.createElement("div", null,
62
- React.createElement(index_1.Popover, { target: target },
63
- React.createElement(index_1.PopoverTrigger, null,
64
- React.createElement("button", null, "Popover trigger")),
65
- React.createElement(index_1.PopoverSurface, null,
66
- React.createElement(ExampleContent, null)))),
67
- React.createElement("button", { ref: setTarget }, "Custom target")));
68
- };
69
- exports.AnchorToTarget = AnchorToTarget;
70
- var Controlled = function () {
71
- var _a = React.useState(false), open = _a[0], setOpen = _a[1];
72
- var onOpenChange = function (_, data) { return setOpen(data.open || false); };
73
- return (React.createElement(index_1.Popover, { open: open, onOpenChange: onOpenChange },
74
- React.createElement(index_1.PopoverTrigger, null,
75
- React.createElement("button", null, "Controlled trigger")),
76
- React.createElement(index_1.PopoverSurface, null,
77
- React.createElement(ExampleContent, null))));
78
- };
79
- exports.Controlled = Controlled;
80
- var WithCustomTrigger = function () {
81
- var _a = React.useState(false), open = _a[0], setOpen = _a[1];
82
- var _b = React.useState(null), target = _b[0], setTarget = _b[1];
83
- var onClick = function () { return setOpen(function (s) { return !s; }); };
84
- var onOpenChange = function (_, data) { return setOpen(data.open || false); };
85
- return (React.createElement(React.Fragment, null,
86
- React.createElement("button", { "aria-haspopup": true, ref: setTarget, onClick: onClick }, "Custom trigger"),
87
- React.createElement(index_1.Popover, { target: target, open: open, onOpenChange: onOpenChange },
88
- React.createElement(index_1.PopoverSurface, null,
89
- React.createElement(ExampleContent, null)))));
90
- };
91
- exports.WithCustomTrigger = WithCustomTrigger;
92
- var FirstNestedPopover = function () { return (React.createElement(index_1.Popover, { trapFocus: true },
93
- React.createElement(index_1.PopoverTrigger, null,
94
- React.createElement("button", null, "First nested trigger")),
95
- React.createElement(index_1.PopoverSurface, null,
96
- React.createElement(ExampleContent, null),
97
- React.createElement("button", null, "First nested button"),
98
- React.createElement(SecondNestedPopover, null),
99
- React.createElement(SecondNestedPopover, null)))); };
100
- var SecondNestedPopover = function () { return (React.createElement(index_1.Popover, { trapFocus: true },
101
- React.createElement(index_1.PopoverTrigger, null,
102
- React.createElement("button", null, "Second nested trigger")),
103
- React.createElement(index_1.PopoverSurface, null,
104
- React.createElement(ExampleContent, null),
105
- React.createElement("button", null, "Second nested button")))); };
106
- var NestedPopovers = function () {
107
- return (React.createElement(index_1.Popover, { trapFocus: true },
108
- React.createElement(index_1.PopoverTrigger, null,
109
- React.createElement("button", null, "Root trigger")),
110
- React.createElement(index_1.PopoverSurface, null,
111
- React.createElement(ExampleContent, null),
112
- React.createElement("button", null, "Root button"),
113
- React.createElement(FirstNestedPopover, null))));
114
- };
115
- exports.NestedPopovers = NestedPopovers;
116
- exports.default = {
117
- title: 'Components/Popover',
118
- component: index_1.Popover,
119
- };
120
- });
121
- //# sourceMappingURL=Popover.stories.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Popover.stories.js","sourceRoot":"../src/","sources":["Popover.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { Popover, PopoverTrigger, PopoverSurface, PopoverProps } from './index';\n\nconst ExampleContent = () => {\n return (\n <div>\n <h3>Popover content</h3>\n\n <div>This is some popover content</div>\n </div>\n );\n};\n\nexport const Default = (props: PopoverProps) => (\n <Popover {...props}>\n <PopoverTrigger>\n <button>Popover trigger</button>\n </PopoverTrigger>\n\n <PopoverSurface>\n <ExampleContent />\n\n <div>\n <button>Action</button>\n <button>Action</button>\n </div>\n </PopoverSurface>\n </Popover>\n);\n\nDefault.argTypes = {\n open: {\n defaultValue: false,\n control: 'boolean',\n },\n\n openOnContext: {\n defaultValue: false,\n control: 'boolean',\n },\n\n openOnHover: {\n defaultValue: false,\n control: 'boolean',\n },\n\n position: {\n type: { name: 'string', required: false },\n control: {\n type: 'select',\n options: ['above', 'below', 'before', 'after'],\n },\n },\n\n align: {\n type: { name: 'string', required: false },\n control: {\n type: 'select',\n options: ['top', 'bottom', 'start', 'end', 'center'],\n },\n },\n\n size: {\n type: { name: 'string', required: false },\n control: {\n type: 'select',\n options: ['small', 'medium', 'large'],\n },\n },\n\n trapFocus: {\n defaultValue: true,\n control: 'boolean',\n },\n};\n\nexport const AnchorToTarget = () => {\n const [target, setTarget] = React.useState<HTMLButtonElement | null>();\n\n return (\n <>\n <div>\n <Popover target={target}>\n <PopoverTrigger>\n <button>Popover trigger</button>\n </PopoverTrigger>\n\n <PopoverSurface>\n <ExampleContent />\n </PopoverSurface>\n </Popover>\n </div>\n\n <button ref={setTarget}>Custom target</button>\n </>\n );\n};\n\nexport const Controlled = () => {\n const [open, setOpen] = React.useState(false);\n const onOpenChange: PopoverProps['onOpenChange'] = (_, data) => setOpen(data.open || false);\n\n return (\n <Popover open={open} onOpenChange={onOpenChange}>\n <PopoverTrigger>\n <button>Controlled trigger</button>\n </PopoverTrigger>\n <PopoverSurface>\n <ExampleContent />\n </PopoverSurface>\n </Popover>\n );\n};\n\nexport const WithCustomTrigger = () => {\n const [open, setOpen] = React.useState(false);\n const [target, setTarget] = React.useState<HTMLElement | null>(null);\n const onClick = () => setOpen(s => !s);\n const onOpenChange: PopoverProps['onOpenChange'] = (_, data) => setOpen(data.open || false);\n\n return (\n <>\n <button aria-haspopup ref={setTarget} onClick={onClick}>\n Custom trigger\n </button>\n <Popover target={target} open={open} onOpenChange={onOpenChange}>\n <PopoverSurface>\n <ExampleContent />\n </PopoverSurface>\n </Popover>\n </>\n );\n};\n\nconst FirstNestedPopover = () => (\n <Popover trapFocus>\n <PopoverTrigger>\n <button>First nested trigger</button>\n </PopoverTrigger>\n\n <PopoverSurface>\n <ExampleContent />\n <button>First nested button</button>\n <SecondNestedPopover />\n <SecondNestedPopover />\n </PopoverSurface>\n </Popover>\n);\n\nconst SecondNestedPopover = () => (\n <Popover trapFocus>\n <PopoverTrigger>\n <button>Second nested trigger</button>\n </PopoverTrigger>\n\n <PopoverSurface>\n <ExampleContent />\n <button>Second nested button</button>\n </PopoverSurface>\n </Popover>\n);\n\nexport const NestedPopovers = () => {\n return (\n <Popover trapFocus>\n <PopoverTrigger>\n <button>Root trigger</button>\n </PopoverTrigger>\n\n <PopoverSurface>\n <ExampleContent />\n <button>Root button</button>\n <FirstNestedPopover />\n </PopoverSurface>\n </Popover>\n );\n};\n\nexport default {\n title: 'Components/Popover',\n component: Popover,\n};\n"]}
@@ -1 +0,0 @@
1
- export * from './components/PopoverSurface/index';
@@ -1,6 +0,0 @@
1
- define(["require", "exports", "tslib", "./components/PopoverSurface/index"], function (require, exports, tslib_1, index_1) {
2
- "use strict";
3
- Object.defineProperty(exports, "__esModule", { value: true });
4
- tslib_1.__exportStar(index_1, exports);
5
- });
6
- //# sourceMappingURL=PopoverSurface.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"PopoverSurface.js","sourceRoot":"../src/","sources":["PopoverSurface.ts"],"names":[],"mappings":";;;IAAA,uCAAkD","sourcesContent":["export * from './components/PopoverSurface/index';\n"]}
@@ -1 +0,0 @@
1
- export * from './components/PopoverTrigger/index';
@@ -1,6 +0,0 @@
1
- define(["require", "exports", "tslib", "./components/PopoverTrigger/index"], function (require, exports, tslib_1, index_1) {
2
- "use strict";
3
- Object.defineProperty(exports, "__esModule", { value: true });
4
- tslib_1.__exportStar(index_1, exports);
5
- });
6
- //# sourceMappingURL=PopoverTrigger.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"PopoverTrigger.js","sourceRoot":"../src/","sources":["PopoverTrigger.ts"],"names":[],"mappings":";;;IAAA,uCAAkD","sourcesContent":["export * from './components/PopoverTrigger/index';\n"]}
@@ -1,4 +0,0 @@
1
- import { IsConformantOptions } from '@fluentui/react-conformance';
2
- export declare function isConformant<TProps = {}>(testInfo: Omit<IsConformantOptions<TProps>, 'componentPath'> & {
3
- componentPath?: string;
4
- }): void;
@@ -1,14 +0,0 @@
1
- define(["require", "exports", "@fluentui/react-conformance"], function (require, exports, react_conformance_1) {
2
- "use strict";
3
- Object.defineProperty(exports, "__esModule", { value: true });
4
- exports.isConformant = void 0;
5
- function isConformant(testInfo) {
6
- var defaultOptions = {
7
- asPropHandlesRef: true,
8
- componentPath: module.parent.filename.replace('.test', ''),
9
- };
10
- react_conformance_1.isConformant(defaultOptions, testInfo);
11
- }
12
- exports.isConformant = isConformant;
13
- });
14
- //# sourceMappingURL=isConformant.js.map