@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,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":";;;;IAGA,IAAM,cAAc,GAAG;QACrB,OAAO,CACL;YACE,kDAAwB;YAExB,gEAAuC,CACnC,CACP,CAAC;IACJ,CAAC,CAAC;IAEK,IAAM,OAAO,GAAG,UAAC,KAAmB,IAAK,OAAA,CAC9C,oBAAC,eAAO,uBAAK,KAAK;QAChB,oBAAC,sBAAc;YACb,sDAAgC,CACjB;QAEjB,oBAAC,sBAAc;YACb,oBAAC,cAAc,OAAG;YAElB;gBACE,6CAAuB;gBACvB,6CAAuB,CACnB,CACS,CACT,CACX,EAf+C,CAe/C,CAAC;IAfW,QAAA,OAAO,WAelB;IAEF,eAAO,CAAC,QAAQ,GAAG;QACjB,IAAI,EAAE;YACJ,YAAY,EAAE,KAAK;YACnB,OAAO,EAAE,SAAS;SACnB;QAED,aAAa,EAAE;YACb,YAAY,EAAE,KAAK;YACnB,OAAO,EAAE,SAAS;SACnB;QAED,WAAW,EAAE;YACX,YAAY,EAAE,KAAK;YACnB,OAAO,EAAE,SAAS;SACnB;QAED,QAAQ,EAAE;YACR,IAAI,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE,QAAQ,EAAE,KAAK,EAAE;YACzC,OAAO,EAAE;gBACP,IAAI,EAAE,QAAQ;gBACd,OAAO,EAAE,CAAC,OAAO,EAAE,OAAO,EAAE,QAAQ,EAAE,OAAO,CAAC;aAC/C;SACF;QAED,KAAK,EAAE;YACL,IAAI,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE,QAAQ,EAAE,KAAK,EAAE;YACzC,OAAO,EAAE;gBACP,IAAI,EAAE,QAAQ;gBACd,OAAO,EAAE,CAAC,KAAK,EAAE,QAAQ,EAAE,OAAO,EAAE,KAAK,EAAE,QAAQ,CAAC;aACrD;SACF;QAED,IAAI,EAAE;YACJ,IAAI,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE,QAAQ,EAAE,KAAK,EAAE;YACzC,OAAO,EAAE;gBACP,IAAI,EAAE,QAAQ;gBACd,OAAO,EAAE,CAAC,OAAO,EAAE,QAAQ,EAAE,OAAO,CAAC;aACtC;SACF;QAED,SAAS,EAAE;YACT,YAAY,EAAE,IAAI;YAClB,OAAO,EAAE,SAAS;SACnB;KACF,CAAC;IAEK,IAAM,cAAc,GAAG;QACtB,IAAA,KAAsB,KAAK,CAAC,QAAQ,EAA4B,EAA/D,MAAM,QAAA,EAAE,SAAS,QAA8C,CAAC;QAEvE,OAAO,CACL;YACE;gBACE,oBAAC,eAAO,IAAC,MAAM,EAAE,MAAM;oBACrB,oBAAC,sBAAc;wBACb,sDAAgC,CACjB;oBAEjB,oBAAC,sBAAc;wBACb,oBAAC,cAAc,OAAG,CACH,CACT,CACN;YAEN,gCAAQ,GAAG,EAAE,SAAS,oBAAwB,CAC7C,CACJ,CAAC;IACJ,CAAC,CAAC;IApBW,QAAA,cAAc,kBAoBzB;IAEK,IAAM,UAAU,GAAG;QAClB,IAAA,KAAkB,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,EAAtC,IAAI,QAAA,EAAE,OAAO,QAAyB,CAAC;QAC9C,IAAM,YAAY,GAAiC,UAAC,CAAC,EAAE,IAAI,IAAK,OAAA,OAAO,CAAC,IAAI,CAAC,IAAI,IAAI,KAAK,CAAC,EAA3B,CAA2B,CAAC;QAE5F,OAAO,CACL,oBAAC,eAAO,IAAC,IAAI,EAAE,IAAI,EAAE,YAAY,EAAE,YAAY;YAC7C,oBAAC,sBAAc;gBACb,yDAAmC,CACpB;YACjB,oBAAC,sBAAc;gBACb,oBAAC,cAAc,OAAG,CACH,CACT,CACX,CAAC;IACJ,CAAC,CAAC;IAdW,QAAA,UAAU,cAcrB;IAEK,IAAM,iBAAiB,GAAG;QACzB,IAAA,KAAkB,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,EAAtC,IAAI,QAAA,EAAE,OAAO,QAAyB,CAAC;QACxC,IAAA,KAAsB,KAAK,CAAC,QAAQ,CAAqB,IAAI,CAAC,EAA7D,MAAM,QAAA,EAAE,SAAS,QAA4C,CAAC;QACrE,IAAM,OAAO,GAAG,cAAM,OAAA,OAAO,CAAC,UAAA,CAAC,IAAI,OAAA,CAAC,CAAC,EAAF,CAAE,CAAC,EAAhB,CAAgB,CAAC;QACvC,IAAM,YAAY,GAAiC,UAAC,CAAC,EAAE,IAAI,IAAK,OAAA,OAAO,CAAC,IAAI,CAAC,IAAI,IAAI,KAAK,CAAC,EAA3B,CAA2B,CAAC;QAE5F,OAAO,CACL;YACE,uDAAsB,GAAG,EAAE,SAAS,EAAE,OAAO,EAAE,OAAO,qBAE7C;YACT,oBAAC,eAAO,IAAC,MAAM,EAAE,MAAM,EAAE,IAAI,EAAE,IAAI,EAAE,YAAY,EAAE,YAAY;gBAC7D,oBAAC,sBAAc;oBACb,oBAAC,cAAc,OAAG,CACH,CACT,CACT,CACJ,CAAC;IACJ,CAAC,CAAC;IAlBW,QAAA,iBAAiB,qBAkB5B;IAEF,IAAM,kBAAkB,GAAG,cAAM,OAAA,CAC/B,oBAAC,eAAO,IAAC,SAAS;QAChB,oBAAC,sBAAc;YACb,2DAAqC,CACtB;QAEjB,oBAAC,sBAAc;YACb,oBAAC,cAAc,OAAG;YAClB,0DAAoC;YACpC,oBAAC,mBAAmB,OAAG;YACvB,oBAAC,mBAAmB,OAAG,CACR,CACT,CACX,EAbgC,CAahC,CAAC;IAEF,IAAM,mBAAmB,GAAG,cAAM,OAAA,CAChC,oBAAC,eAAO,IAAC,SAAS;QAChB,oBAAC,sBAAc;YACb,4DAAsC,CACvB;QAEjB,oBAAC,sBAAc;YACb,oBAAC,cAAc,OAAG;YAClB,2DAAqC,CACtB,CACT,CACX,EAXiC,CAWjC,CAAC;IAEK,IAAM,cAAc,GAAG;QAC5B,OAAO,CACL,oBAAC,eAAO,IAAC,SAAS;YAChB,oBAAC,sBAAc;gBACb,mDAA6B,CACd;YAEjB,oBAAC,sBAAc;gBACb,oBAAC,cAAc,OAAG;gBAClB,kDAA4B;gBAC5B,oBAAC,kBAAkB,OAAG,CACP,CACT,CACX,CAAC;IACJ,CAAC,CAAC;IAdW,QAAA,cAAc,kBAczB;IAEF,kBAAe;QACb,KAAK,EAAE,oBAAoB;QAC3B,SAAS,EAAE,eAAO;KACnB,CAAC","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