@fluentui/react-positioning 9.0.0-nightly.f81b28ceb3.1 → 9.0.0-rc.4

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 (80) hide show
  1. package/CHANGELOG.json +235 -10
  2. package/CHANGELOG.md +72 -7
  3. package/dist/react-positioning.d.ts +113 -35
  4. package/lib/createArrowStyles.d.ts +64 -0
  5. package/lib/createArrowStyles.js +87 -0
  6. package/lib/createArrowStyles.js.map +1 -0
  7. package/lib/createVirtualElementFromClick.js +17 -15
  8. package/lib/createVirtualElementFromClick.js.map +1 -1
  9. package/lib/index.d.ts +2 -1
  10. package/lib/index.js +2 -1
  11. package/lib/index.js.map +1 -1
  12. package/lib/isIntersectingModifier.d.ts +4 -0
  13. package/lib/isIntersectingModifier.js +26 -0
  14. package/lib/isIntersectingModifier.js.map +1 -0
  15. package/lib/types.d.ts +28 -7
  16. package/lib/types.js.map +1 -1
  17. package/lib/usePopper.d.ts +2 -14
  18. package/lib/usePopper.js +369 -319
  19. package/lib/usePopper.js.map +1 -1
  20. package/lib/usePopperMouseTarget.js +28 -22
  21. package/lib/usePopperMouseTarget.js.map +1 -1
  22. package/lib/utils/getBasePlacement.js +1 -1
  23. package/lib/utils/getBasePlacement.js.map +1 -1
  24. package/lib/utils/getBoundary.js +15 -10
  25. package/lib/utils/getBoundary.js.map +1 -1
  26. package/lib/utils/getReactFiberFromNode.d.ts +0 -1
  27. package/lib/utils/getReactFiberFromNode.js +39 -35
  28. package/lib/utils/getReactFiberFromNode.js.map +1 -1
  29. package/lib/utils/getScrollParent.js +46 -32
  30. package/lib/utils/getScrollParent.js.map +1 -1
  31. package/lib/utils/index.js.map +1 -1
  32. package/lib/utils/mergeArrowOffset.js +30 -25
  33. package/lib/utils/mergeArrowOffset.js.map +1 -1
  34. package/lib/utils/positioningHelper.d.ts +2 -2
  35. package/lib/utils/positioningHelper.js +42 -34
  36. package/lib/utils/positioningHelper.js.map +1 -1
  37. package/lib/utils/resolvePositioningShorthand.js +58 -20
  38. package/lib/utils/resolvePositioningShorthand.js.map +1 -1
  39. package/lib/utils/useCallbackRef.js +35 -29
  40. package/lib/utils/useCallbackRef.js.map +1 -1
  41. package/lib-commonjs/createArrowStyles.d.ts +64 -0
  42. package/lib-commonjs/createArrowStyles.js +100 -0
  43. package/lib-commonjs/createArrowStyles.js.map +1 -0
  44. package/lib-commonjs/createVirtualElementFromClick.js +23 -16
  45. package/lib-commonjs/createVirtualElementFromClick.js.map +1 -1
  46. package/lib-commonjs/index.d.ts +2 -1
  47. package/lib-commonjs/index.js +28 -6
  48. package/lib-commonjs/index.js.map +1 -1
  49. package/lib-commonjs/isIntersectingModifier.d.ts +4 -0
  50. package/lib-commonjs/isIntersectingModifier.js +34 -0
  51. package/lib-commonjs/isIntersectingModifier.js.map +1 -0
  52. package/lib-commonjs/types.d.ts +28 -7
  53. package/lib-commonjs/types.js +4 -1
  54. package/lib-commonjs/types.js.map +1 -1
  55. package/lib-commonjs/usePopper.d.ts +2 -14
  56. package/lib-commonjs/usePopper.js +385 -324
  57. package/lib-commonjs/usePopper.js.map +1 -1
  58. package/lib-commonjs/usePopperMouseTarget.js +38 -25
  59. package/lib-commonjs/usePopperMouseTarget.js.map +1 -1
  60. package/lib-commonjs/utils/getBasePlacement.js +7 -2
  61. package/lib-commonjs/utils/getBasePlacement.js.map +1 -1
  62. package/lib-commonjs/utils/getBoundary.js +23 -12
  63. package/lib-commonjs/utils/getBoundary.js.map +1 -1
  64. package/lib-commonjs/utils/getReactFiberFromNode.d.ts +0 -1
  65. package/lib-commonjs/utils/getReactFiberFromNode.js +44 -36
  66. package/lib-commonjs/utils/getReactFiberFromNode.js.map +1 -1
  67. package/lib-commonjs/utils/getScrollParent.js +53 -33
  68. package/lib-commonjs/utils/getScrollParent.js.map +1 -1
  69. package/lib-commonjs/utils/index.js +14 -2
  70. package/lib-commonjs/utils/index.js.map +1 -1
  71. package/lib-commonjs/utils/mergeArrowOffset.js +36 -26
  72. package/lib-commonjs/utils/mergeArrowOffset.js.map +1 -1
  73. package/lib-commonjs/utils/positioningHelper.d.ts +2 -2
  74. package/lib-commonjs/utils/positioningHelper.js +50 -35
  75. package/lib-commonjs/utils/positioningHelper.js.map +1 -1
  76. package/lib-commonjs/utils/resolvePositioningShorthand.js +66 -23
  77. package/lib-commonjs/utils/resolvePositioningShorthand.js.map +1 -1
  78. package/lib-commonjs/utils/useCallbackRef.js +45 -32
  79. package/lib-commonjs/utils/useCallbackRef.js.map +1 -1
  80. package/package.json +8 -8
package/CHANGELOG.json CHANGED
@@ -2,28 +2,253 @@
2
2
  "name": "@fluentui/react-positioning",
3
3
  "entries": [
4
4
  {
5
- "date": "Tue, 19 Oct 2021 12:39:14 GMT",
6
- "tag": "@fluentui/react-positioning_v9.0.0-nightly.f81b28ceb3.1",
7
- "version": "9.0.0-nightly.f81b28ceb3.1",
5
+ "date": "Tue, 01 Mar 2022 02:16:11 GMT",
6
+ "tag": "@fluentui/react-positioning_v9.0.0-rc.4",
7
+ "version": "9.0.0-rc.4",
8
8
  "comments": {
9
9
  "prerelease": [
10
10
  {
11
- "author": "email not defined",
11
+ "author": "olfedias@microsoft.com",
12
+ "package": "@fluentui/react-positioning",
13
+ "commit": "def76fff08777fcd5492f47824b943bab22d4515",
14
+ "comment": "feat: add isIntersectingModifier to usePopper"
15
+ },
16
+ {
17
+ "author": "olfedias@microsoft.com",
18
+ "package": "@fluentui/react-positioning",
19
+ "commit": "084d7408855f3e52b67cbca172da1acef9dcb98f",
20
+ "comment": "fix: Add react-theme as dependency"
21
+ },
22
+ {
23
+ "author": "beachball",
24
+ "package": "@fluentui/react-positioning",
25
+ "comment": "Bump @fluentui/react-utilities to v9.0.0-rc.4",
26
+ "commit": "0bc1e755543ed69443d5d03e1976c630583242f7"
27
+ }
28
+ ]
29
+ }
30
+ },
31
+ {
32
+ "date": "Fri, 18 Feb 2022 13:35:33 GMT",
33
+ "tag": "@fluentui/react-positioning_v9.0.0-rc.3",
34
+ "version": "9.0.0-rc.3",
35
+ "comments": {
36
+ "prerelease": [
37
+ {
38
+ "author": "lingfangao@hotmail.com",
39
+ "package": "@fluentui/react-positioning",
40
+ "commit": "1aa9e691fcccd9a64168cea7941c0f1e71fa1d14",
41
+ "comment": "fix: Source maps contain original source code"
42
+ },
43
+ {
44
+ "author": "beachball",
45
+ "package": "@fluentui/react-positioning",
46
+ "comment": "Bump @fluentui/react-shared-contexts to v9.0.0-rc.3",
47
+ "commit": "3b9c1e931c23173da3d1af0c696cdc58516ce504"
48
+ },
49
+ {
50
+ "author": "beachball",
51
+ "package": "@fluentui/react-positioning",
52
+ "comment": "Bump @fluentui/react-utilities to v9.0.0-rc.3",
53
+ "commit": "3b9c1e931c23173da3d1af0c696cdc58516ce504"
54
+ }
55
+ ]
56
+ }
57
+ },
58
+ {
59
+ "date": "Thu, 10 Feb 2022 08:50:40 GMT",
60
+ "tag": "@fluentui/react-positioning_v9.0.0-rc.1",
61
+ "version": "9.0.0-rc.1",
62
+ "comments": {
63
+ "prerelease": [
64
+ {
65
+ "author": "olfedias@microsoft.com",
66
+ "package": "@fluentui/react-positioning",
67
+ "commit": "a76afe26daad901ff5458ffdda7e66e600d5bcac",
68
+ "comment": "use new types from makeStyles core"
69
+ },
70
+ {
71
+ "author": "Humberto.Morimoto@microsoft.com",
72
+ "package": "@fluentui/react-positioning",
73
+ "commit": "db6526ee2d04991e4473174969e3795299b52f9e",
74
+ "comment": "Replacing use of functions in makeStyles with direct use of tokens."
75
+ },
76
+ {
77
+ "author": "behowell@microsoft.com",
78
+ "package": "@fluentui/react-positioning",
79
+ "commit": "2e34c026a354af1bbfe6a5ead1ade41348d5488f",
80
+ "comment": "Fix tooltip arrow's high contrast border in RTL"
81
+ },
82
+ {
83
+ "author": "olfedias@microsoft.com",
84
+ "package": "@fluentui/react-positioning",
85
+ "commit": "523b5785eafd28cf56b677af40274cefe5d42dcb",
86
+ "comment": "use Griffel packages"
87
+ },
88
+ {
89
+ "author": "lingfangao@hotmail.com",
90
+ "package": "@fluentui/react-positioning",
91
+ "commit": "a548a59bd94f9c4b656da3bdd149db7ac2de726f",
92
+ "comment": "feat: Imperative `setTarget` for `usePopper` and `positioning`"
93
+ },
94
+ {
95
+ "author": "bsunderhus@microsoft.com",
96
+ "package": "@fluentui/react-positioning",
97
+ "commit": "e382ad22539fc97bb283ca4ed856e126c7477e89",
98
+ "comment": "Adds @noflip annotation to data-popper-placement styles"
99
+ },
100
+ {
101
+ "author": "olfedias@microsoft.com",
102
+ "package": "@fluentui/react-positioning",
103
+ "commit": "967d6b74cf0507685a24e0cfaa8c7b9d52a351e1",
104
+ "comment": "update styles to not use CSS shorthands"
105
+ },
106
+ {
107
+ "author": "lingfangao@hotmail.com",
108
+ "package": "@fluentui/react-positioning",
109
+ "commit": "c00913d50e2dd15bbfbb0757cefe43b192ff1d7f",
110
+ "comment": "Bump Fluent UI packages to 9.0.0-rc"
111
+ },
112
+ {
113
+ "author": "behowell@microsoft.com",
114
+ "package": "@fluentui/react-positioning",
115
+ "commit": "09804275c7f346db54c33d4ff347bffc33676014",
116
+ "comment": "Fix popover arrow styling"
117
+ },
118
+ {
119
+ "author": "beachball",
120
+ "package": "@fluentui/react-positioning",
121
+ "comment": "Bump @fluentui/react-shared-contexts to v9.0.0-rc.1",
122
+ "commit": "e6c855f6d9019d6c73668d15fc9bc3a13291a6c8"
123
+ },
124
+ {
125
+ "author": "beachball",
126
+ "package": "@fluentui/react-positioning",
127
+ "comment": "Bump @fluentui/react-utilities to v9.0.0-rc.1",
128
+ "commit": "e6c855f6d9019d6c73668d15fc9bc3a13291a6c8"
129
+ }
130
+ ],
131
+ "none": [
132
+ {
133
+ "author": "olfedias@microsoft.com",
134
+ "package": "@fluentui/react-positioning",
135
+ "commit": "c061e98be4b4a718c72a144a1f60bb5515824612",
136
+ "comment": "remove inline-style-expand-shorthand from tsconfigs"
137
+ },
138
+ {
139
+ "author": "martinhochel@microsoft.com",
140
+ "package": "@fluentui/react-positioning",
141
+ "commit": "8dfa712156b70414205b87b5b6d099367b0c297d",
142
+ "comment": "chore: use storybook runner for all vNext packages"
143
+ }
144
+ ]
145
+ }
146
+ },
147
+ {
148
+ "date": "Thu, 25 Nov 2021 08:34:15 GMT",
149
+ "tag": "@fluentui/react-positioning_v9.0.0-beta.4",
150
+ "version": "9.0.0-beta.4",
151
+ "comments": {
152
+ "none": [
153
+ {
154
+ "author": "lingfangao@hotmail.com",
155
+ "package": "@fluentui/react-positioning",
156
+ "commit": "718e63006d8d07d24efab9c32942041963d78dc7",
157
+ "comment": "Migrate package to use solution style ts-configs"
158
+ }
159
+ ],
160
+ "prerelease": [
161
+ {
162
+ "author": "lingfangao@hotmail.com",
163
+ "package": "@fluentui/react-positioning",
164
+ "commit": "58db204f28af1d68df7260ff580cf91f0adcfb66",
165
+ "comment": "Add utility function to create styles for an arrow element"
166
+ },
167
+ {
168
+ "author": "beachball",
169
+ "package": "@fluentui/react-positioning",
170
+ "comment": "Bump @fluentui/react-make-styles to v9.0.0-beta.4",
171
+ "commit": "48d236ac53a4950fabc3ddd52f91dac93ca0195b"
172
+ },
173
+ {
174
+ "author": "beachball",
175
+ "package": "@fluentui/react-positioning",
176
+ "comment": "Bump @fluentui/react-shared-contexts to v9.0.0-beta.4",
177
+ "commit": "48d236ac53a4950fabc3ddd52f91dac93ca0195b"
178
+ },
179
+ {
180
+ "author": "beachball",
181
+ "package": "@fluentui/react-positioning",
182
+ "comment": "Bump @fluentui/react-utilities to v9.0.0-beta.4",
183
+ "commit": "48d236ac53a4950fabc3ddd52f91dac93ca0195b"
184
+ },
185
+ {
186
+ "author": "beachball",
187
+ "package": "@fluentui/react-positioning",
188
+ "comment": "Bump @fluentui/babel-make-styles to v9.0.0-beta.4",
189
+ "commit": "48d236ac53a4950fabc3ddd52f91dac93ca0195b"
190
+ }
191
+ ]
192
+ }
193
+ },
194
+ {
195
+ "date": "Fri, 12 Nov 2021 13:25:30 GMT",
196
+ "tag": "@fluentui/react-positioning_v9.0.0-beta.3",
197
+ "version": "9.0.0-beta.3",
198
+ "comments": {
199
+ "prerelease": [
200
+ {
201
+ "author": "gcox@microsoft.com",
202
+ "package": "@fluentui/react-positioning",
203
+ "commit": "c9bd5b5a02ae94a8239ce1b56cac2f0d0dbd3586",
204
+ "comment": "Updated beta and RC components to ES2019"
205
+ },
206
+ {
207
+ "author": "beachball",
208
+ "package": "@fluentui/react-positioning",
209
+ "comment": "Bump @fluentui/react-shared-contexts to v9.0.0-beta.3",
210
+ "commit": "742342e52c65066f779232e4e1302fedf0dd460d"
211
+ },
212
+ {
213
+ "author": "beachball",
214
+ "package": "@fluentui/react-positioning",
215
+ "comment": "Bump @fluentui/react-utilities to v9.0.0-beta.3",
216
+ "commit": "742342e52c65066f779232e4e1302fedf0dd460d"
217
+ }
218
+ ],
219
+ "none": [
220
+ {
221
+ "author": "lingfangao@hotmail.com",
222
+ "package": "@fluentui/react-positioning",
223
+ "commit": "00f70581480b536e723fb69edf0ae617beac4807",
224
+ "comment": "Remove beta release tag"
225
+ }
226
+ ]
227
+ }
228
+ },
229
+ {
230
+ "date": "Wed, 27 Oct 2021 12:14:21 GMT",
231
+ "tag": "@fluentui/react-positioning_v9.0.0-beta.2",
232
+ "version": "9.0.0-beta.2",
233
+ "comments": {
234
+ "prerelease": [
235
+ {
236
+ "author": "peter@draxler.ml",
12
237
  "package": "@fluentui/react-positioning",
13
- "comment": "Release nightly v9",
14
- "commit": "0ae8560ad3e7b4cb03f3f47152dfce2f81523cca"
238
+ "commit": "f6db7c8d6b7db0902775e7857b62b745be35b59a",
239
+ "comment": "added styling of documentation"
15
240
  },
16
241
  {
17
242
  "author": "beachball",
18
243
  "package": "@fluentui/react-positioning",
19
- "comment": "Bump @fluentui/react-shared-contexts to v9.0.0-nightly.f81b28ceb3.1",
20
- "commit": "0ae8560ad3e7b4cb03f3f47152dfce2f81523cca"
244
+ "comment": "Bump @fluentui/react-shared-contexts to v9.0.0-beta.2",
245
+ "commit": "0f8f1ae7c2d908e51e29dd342d79e041f86fac08"
21
246
  },
22
247
  {
23
248
  "author": "beachball",
24
249
  "package": "@fluentui/react-positioning",
25
- "comment": "Bump @fluentui/react-utilities to v9.0.0-nightly.f81b28ceb3.1",
26
- "commit": "0ae8560ad3e7b4cb03f3f47152dfce2f81523cca"
250
+ "comment": "Bump @fluentui/react-utilities to v9.0.0-beta.2",
251
+ "commit": "0f8f1ae7c2d908e51e29dd342d79e041f86fac08"
27
252
  }
28
253
  ]
29
254
  }
package/CHANGELOG.md CHANGED
@@ -1,19 +1,84 @@
1
1
  # Change Log - @fluentui/react-positioning
2
2
 
3
- This log was last generated on Tue, 19 Oct 2021 12:39:14 GMT and should not be manually modified.
3
+ This log was last generated on Tue, 01 Mar 2022 02:16:11 GMT and should not be manually modified.
4
4
 
5
5
  <!-- Start content -->
6
6
 
7
- ## [9.0.0-nightly.f81b28ceb3.1](https://github.com/microsoft/fluentui/tree/@fluentui/react-positioning_v9.0.0-nightly.f81b28ceb3.1)
7
+ ## [9.0.0-rc.4](https://github.com/microsoft/fluentui/tree/@fluentui/react-positioning_v9.0.0-rc.4)
8
8
 
9
- Tue, 19 Oct 2021 12:39:14 GMT
10
- [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-positioning_v9.0.0-beta.1..@fluentui/react-positioning_v9.0.0-nightly.f81b28ceb3.1)
9
+ Tue, 01 Mar 2022 02:16:11 GMT
10
+ [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-positioning_v9.0.0-rc.3..@fluentui/react-positioning_v9.0.0-rc.4)
11
11
 
12
12
  ### Changes
13
13
 
14
- - Release nightly v9 ([commit](https://github.com/microsoft/fluentui/commit/0ae8560ad3e7b4cb03f3f47152dfce2f81523cca) by email not defined)
15
- - Bump @fluentui/react-shared-contexts to v9.0.0-nightly.f81b28ceb3.1 ([commit](https://github.com/microsoft/fluentui/commit/0ae8560ad3e7b4cb03f3f47152dfce2f81523cca) by beachball)
16
- - Bump @fluentui/react-utilities to v9.0.0-nightly.f81b28ceb3.1 ([commit](https://github.com/microsoft/fluentui/commit/0ae8560ad3e7b4cb03f3f47152dfce2f81523cca) by beachball)
14
+ - feat: add isIntersectingModifier to usePopper ([PR #21855](https://github.com/microsoft/fluentui/pull/21855) by olfedias@microsoft.com)
15
+ - fix: Add react-theme as dependency ([PR #21825](https://github.com/microsoft/fluentui/pull/21825) by olfedias@microsoft.com)
16
+ - Bump @fluentui/react-utilities to v9.0.0-rc.4 ([PR #21884](https://github.com/microsoft/fluentui/pull/21884) by beachball)
17
+
18
+ ## [9.0.0-rc.3](https://github.com/microsoft/fluentui/tree/@fluentui/react-positioning_v9.0.0-rc.3)
19
+
20
+ Fri, 18 Feb 2022 13:35:33 GMT
21
+ [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-positioning_v9.0.0-rc.1..@fluentui/react-positioning_v9.0.0-rc.3)
22
+
23
+ ### Changes
24
+
25
+ - fix: Source maps contain original source code ([PR #21690](https://github.com/microsoft/fluentui/pull/21690) by lingfangao@hotmail.com)
26
+ - Bump @fluentui/react-shared-contexts to v9.0.0-rc.3 ([PR #21800](https://github.com/microsoft/fluentui/pull/21800) by beachball)
27
+ - Bump @fluentui/react-utilities to v9.0.0-rc.3 ([PR #21800](https://github.com/microsoft/fluentui/pull/21800) by beachball)
28
+
29
+ ## [9.0.0-rc.1](https://github.com/microsoft/fluentui/tree/@fluentui/react-positioning_v9.0.0-rc.1)
30
+
31
+ Thu, 10 Feb 2022 08:50:40 GMT
32
+ [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-positioning_v9.0.0-beta.4..@fluentui/react-positioning_v9.0.0-rc.1)
33
+
34
+ ### Changes
35
+
36
+ - use new types from makeStyles core ([PR #20786](https://github.com/microsoft/fluentui/pull/20786) by olfedias@microsoft.com)
37
+ - Replacing use of functions in makeStyles with direct use of tokens. ([PR #21051](https://github.com/microsoft/fluentui/pull/21051) by Humberto.Morimoto@microsoft.com)
38
+ - Fix tooltip arrow's high contrast border in RTL ([PR #21354](https://github.com/microsoft/fluentui/pull/21354) by behowell@microsoft.com)
39
+ - use Griffel packages ([PR #21421](https://github.com/microsoft/fluentui/pull/21421) by olfedias@microsoft.com)
40
+ - feat: Imperative `setTarget` for `usePopper` and `positioning` ([PR #21632](https://github.com/microsoft/fluentui/pull/21632) by lingfangao@hotmail.com)
41
+ - Adds @noflip annotation to data-popper-placement styles ([PR #20845](https://github.com/microsoft/fluentui/pull/20845) by bsunderhus@microsoft.com)
42
+ - update styles to not use CSS shorthands ([PR #20842](https://github.com/microsoft/fluentui/pull/20842) by olfedias@microsoft.com)
43
+ - Bump Fluent UI packages to 9.0.0-rc ([PR #21623](https://github.com/microsoft/fluentui/pull/21623) by lingfangao@hotmail.com)
44
+ - Fix popover arrow styling ([PR #21086](https://github.com/microsoft/fluentui/pull/21086) by behowell@microsoft.com)
45
+ - Bump @fluentui/react-shared-contexts to v9.0.0-rc.1 ([commit](https://github.com/microsoft/fluentui/commit/e6c855f6d9019d6c73668d15fc9bc3a13291a6c8) by beachball)
46
+ - Bump @fluentui/react-utilities to v9.0.0-rc.1 ([commit](https://github.com/microsoft/fluentui/commit/e6c855f6d9019d6c73668d15fc9bc3a13291a6c8) by beachball)
47
+
48
+ ## [9.0.0-beta.4](https://github.com/microsoft/fluentui/tree/@fluentui/react-positioning_v9.0.0-beta.4)
49
+
50
+ Thu, 25 Nov 2021 08:34:15 GMT
51
+ [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-positioning_v9.0.0-beta.3..@fluentui/react-positioning_v9.0.0-beta.4)
52
+
53
+ ### Changes
54
+
55
+ - Add utility function to create styles for an arrow element ([PR #20541](https://github.com/microsoft/fluentui/pull/20541) by lingfangao@hotmail.com)
56
+ - Bump @fluentui/react-make-styles to v9.0.0-beta.4 ([PR #20762](https://github.com/microsoft/fluentui/pull/20762) by beachball)
57
+ - Bump @fluentui/react-shared-contexts to v9.0.0-beta.4 ([PR #20762](https://github.com/microsoft/fluentui/pull/20762) by beachball)
58
+ - Bump @fluentui/react-utilities to v9.0.0-beta.4 ([PR #20762](https://github.com/microsoft/fluentui/pull/20762) by beachball)
59
+ - Bump @fluentui/babel-make-styles to v9.0.0-beta.4 ([PR #20762](https://github.com/microsoft/fluentui/pull/20762) by beachball)
60
+
61
+ ## [9.0.0-beta.3](https://github.com/microsoft/fluentui/tree/@fluentui/react-positioning_v9.0.0-beta.3)
62
+
63
+ Fri, 12 Nov 2021 13:25:30 GMT
64
+ [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-positioning_v9.0.0-beta.2..@fluentui/react-positioning_v9.0.0-beta.3)
65
+
66
+ ### Changes
67
+
68
+ - Updated beta and RC components to ES2019 ([PR #20405](https://github.com/microsoft/fluentui/pull/20405) by gcox@microsoft.com)
69
+ - Bump @fluentui/react-shared-contexts to v9.0.0-beta.3 ([PR #20583](https://github.com/microsoft/fluentui/pull/20583) by beachball)
70
+ - Bump @fluentui/react-utilities to v9.0.0-beta.3 ([PR #20583](https://github.com/microsoft/fluentui/pull/20583) by beachball)
71
+
72
+ ## [9.0.0-beta.2](https://github.com/microsoft/fluentui/tree/@fluentui/react-positioning_v9.0.0-beta.2)
73
+
74
+ Wed, 27 Oct 2021 12:14:21 GMT
75
+ [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-positioning_v9.0.0-beta.1..@fluentui/react-positioning_v9.0.0-beta.2)
76
+
77
+ ### Changes
78
+
79
+ - added styling of documentation ([PR #20193](https://github.com/microsoft/fluentui/pull/20193) by peter@draxler.ml)
80
+ - Bump @fluentui/react-shared-contexts to v9.0.0-beta.2 ([PR #20353](https://github.com/microsoft/fluentui/pull/20353) by beachball)
81
+ - Bump @fluentui/react-utilities to v9.0.0-beta.2 ([PR #20353](https://github.com/microsoft/fluentui/pull/20353) by beachball)
17
82
 
18
83
  ## [9.0.0-beta.1](https://github.com/microsoft/fluentui/tree/@fluentui/react-positioning_v9.0.0-beta.1)
19
84
 
@@ -1,3 +1,4 @@
1
+ import type { GriffelStyle } from '@griffel/react';
1
2
  import * as PopperJs from '@popperjs/core';
2
3
  import * as React_2 from 'react';
3
4
 
@@ -7,6 +8,72 @@ export declare type AutoSize = 'height' | 'height-always' | 'width' | 'width-alw
7
8
 
8
9
  export declare type Boundary = PopperJs.Boundary | 'scrollParent' | 'window';
9
10
 
11
+ /**
12
+ * Creates CSS styles to size the arrow created by createArrowStyles to the given height.
13
+ *
14
+ * Use this when you need to create classes for several different arrow sizes. If you only need a
15
+ * constant arrow size, you can pass the `arrowHeight` param to createArrowStyles instead.
16
+ */
17
+ export declare function createArrowHeightStyles(arrowHeight: number): {
18
+ width: string;
19
+ height: string;
20
+ };
21
+
22
+ /**
23
+ * Helper that creates a makeStyles rule for an arrow element.
24
+ * For runtime arrow size toggling simply create extra classnames to apply to the arrow element
25
+ *
26
+ * ```ts
27
+ * makeStyles({
28
+ * arrowWithSize: createArrowStyles({ arrowHeight: 6 }),
29
+ *
30
+ * arrowWithoutSize: createArrowStyles({ arrowHeight: undefined }),
31
+ * mediumArrow: createArrowHeightStyles(4),
32
+ * smallArrow: createArrowHeightStyles(2),
33
+ * })
34
+ * ...
35
+ *
36
+ * state.arrowWithSize.className = styles.arrowWithSize;
37
+ * state.arrowWithoutSize.className = mergeClasses(
38
+ * styles.arrowWithoutSize,
39
+ * state.smallArrow && styles.smallArrow,
40
+ * state.mediumArrow && styles.mediumArrow,
41
+ * )
42
+ * ```
43
+ */
44
+ export declare function createArrowStyles(options: CreateArrowStylesOptions): GriffelStyle;
45
+
46
+ /**
47
+ * Options parameter for the createArrowStyles function
48
+ */
49
+ export declare type CreateArrowStylesOptions = {
50
+ /**
51
+ * The height of the arrow from the base to the tip, in px. The base width of the arrow is always twice its height.
52
+ *
53
+ * This can be undefined to leave out the arrow size styles. You must then add styles created by
54
+ * createArrowHeightStyles to set the arrow's size correctly. This can be useful if the arrow can be different sizes.
55
+ */
56
+ arrowHeight: number | undefined;
57
+ /**
58
+ * The borderWidth of the arrow. Should be the same borderWidth as the parent element.
59
+ *
60
+ * @defaultvalue 1px
61
+ */
62
+ borderWidth?: GriffelStyle['borderBottomWidth'];
63
+ /**
64
+ * The borderStyle for the arrow. Should be the same borderStyle as the parent element.
65
+ *
66
+ * @defaultvalue solid
67
+ */
68
+ borderStyle?: GriffelStyle['borderBottomStyle'];
69
+ /**
70
+ * The borderColor of the arrow. Should be the same borderColor as the parent element.
71
+ *
72
+ * @defaultvalue tokens.colorTransparentStroke
73
+ */
74
+ borderColor?: GriffelStyle['borderBottomColor'];
75
+ };
76
+
10
77
  /**
11
78
  * Creates a virtual element based on the position of a click event
12
79
  * Can be used as a target for popper in scenarios such as context menus
@@ -33,42 +100,13 @@ export declare type OffsetFunctionParam = {
33
100
  placement: PopperJs.Placement;
34
101
  };
35
102
 
36
- declare interface PopperOptions extends PositioningProps {
37
- /**
38
- * If false, delays Popper's creation.
39
- * @default true
40
- */
41
- enabled?: boolean;
42
- onStateUpdate?: (state: Partial<PopperJs.State>) => void;
43
- /**
44
- * Enables the Popper box to position itself in 'fixed' mode (default value is position: 'absolute')
45
- * @default false
46
- */
47
- positionFixed?: boolean;
48
- /**
49
- * When the reference element or the viewport is outside viewport allows a popper element to be fully in viewport.
50
- * "all" enables this behavior for all axis.
51
- */
52
- unstable_disableTether?: boolean | 'all';
53
- }
54
-
55
- export declare type PopperRefHandle = {
56
- updatePosition: () => void;
57
- };
58
-
59
- export declare type PopperVirtualElement = PopperJs.VirtualElement;
60
-
61
- export declare type Position = 'above' | 'below' | 'before' | 'after';
62
-
63
- export declare interface PositioningProps {
103
+ export declare interface PopperOptions {
64
104
  /** Alignment for the component. Only has an effect if used with the @see position option */
65
105
  align?: Alignment;
66
106
  /** The element which will define the boundaries of the popper position for the flip behavior. */
67
107
  flipBoundary?: Boundary;
68
108
  /** The element which will define the boundaries of the popper position for the overflow behavior. */
69
109
  overflowBoundary?: Boundary;
70
- /** An imperative handle to Popper methods. */
71
- popperRef?: React_2.Ref<PopperRefHandle>;
72
110
  /**
73
111
  * Position for the component. Position has higher priority than align. If position is vertical ('above' | 'below')
74
112
  * and align is also vertical ('top' | 'bottom') or if both position and align are horizontal ('before' | 'after'
@@ -76,6 +114,11 @@ export declare interface PositioningProps {
76
114
  * then provided value for 'align' will be ignored and 'center' will be used instead.
77
115
  */
78
116
  position?: Position;
117
+ /**
118
+ * Enables the Popper box to position itself in 'fixed' mode (default value is position: 'absolute')
119
+ * @default false
120
+ */
121
+ positionFixed?: boolean;
79
122
  /**
80
123
  * Lets you displace a popper element from its reference element.
81
124
  * This can be useful if you need to apply some margin between them or if you need to fine tune the
@@ -95,10 +138,6 @@ export declare interface PositioningProps {
95
138
  * `height-always` applies `max-height` regardless of overflow, and 'width-always' for always applying `max-width`
96
139
  */
97
140
  autoSize?: AutoSize;
98
- /**
99
- * Manual override for popper target. Useful for scenarios where a component accepts user prop to override target
100
- */
101
- target?: HTMLElement | PopperVirtualElement | null;
102
141
  /**
103
142
  * Modifies position and alignment to cover the target
104
143
  */
@@ -108,6 +147,37 @@ export declare interface PositioningProps {
108
147
  * `position` props, regardless of the size of the component, the reference element or the viewport.
109
148
  */
110
149
  pinned?: boolean;
150
+ /**
151
+ * When the reference element or the viewport is outside viewport allows a popper element to be fully in viewport.
152
+ * "all" enables this behavior for all axis.
153
+ */
154
+ unstable_disableTether?: boolean | 'all';
155
+ }
156
+
157
+ export declare type PopperRefHandle = {
158
+ /**
159
+ * Updates the position of the popper imperatively.
160
+ * Useful when the position of the target changes from other factors than scrolling of window resize.
161
+ */
162
+ updatePosition: () => void;
163
+ /**
164
+ * Sets the target and updates positioning imperatively.
165
+ * Useful for avoiding double renders with the target option.
166
+ */
167
+ setTarget: (target: HTMLElement) => void;
168
+ };
169
+
170
+ export declare type PopperVirtualElement = PopperJs.VirtualElement;
171
+
172
+ export declare type Position = 'above' | 'below' | 'before' | 'after';
173
+
174
+ export declare interface PositioningProps extends Omit<PopperOptions, 'positionFixed' | 'unstable_disableTether'> {
175
+ /** An imperative handle to Popper methods. */
176
+ popperRef?: React_2.Ref<PopperRefHandle>;
177
+ /**
178
+ * Manual override for popper target. Useful for scenarios where a component accepts user prop to override target
179
+ */
180
+ target?: HTMLElement | PopperVirtualElement | null;
111
181
  }
112
182
 
113
183
  export declare type PositioningShorthand = PositioningProps | PositioningShorthandValue;
@@ -124,7 +194,7 @@ export declare function resolvePositioningShorthand(shorthand: PositioningShorth
124
194
  * - contains a specific to React fix related to initial positioning when containers have components with managed focus
125
195
  * to avoid focus jumps
126
196
  */
127
- export declare function usePopper(options?: PopperOptions): {
197
+ export declare function usePopper(options?: UsePopperOptions): {
128
198
  targetRef: React_2.MutableRefObject<any>;
129
199
  containerRef: React_2.MutableRefObject<any>;
130
200
  arrowRef: React_2.MutableRefObject<any>;
@@ -140,4 +210,12 @@ export declare function usePopper(options?: PopperOptions): {
140
210
  */
141
211
  export declare const usePopperMouseTarget: (initialState?: PopperJs.VirtualElement | (() => PopperJs.VirtualElement) | undefined) => readonly [PopperJs.VirtualElement | undefined, (event: React_2.MouseEvent | MouseEvent | undefined | null) => void];
142
212
 
213
+ declare interface UsePopperOptions extends PositioningProps {
214
+ /**
215
+ * If false, delays Popper's creation.
216
+ * @default true
217
+ */
218
+ enabled?: boolean;
219
+ }
220
+
143
221
  export { }
@@ -0,0 +1,64 @@
1
+ import type { GriffelStyle } from '@griffel/react';
2
+ /**
3
+ * Options parameter for the createArrowStyles function
4
+ */
5
+ export declare type CreateArrowStylesOptions = {
6
+ /**
7
+ * The height of the arrow from the base to the tip, in px. The base width of the arrow is always twice its height.
8
+ *
9
+ * This can be undefined to leave out the arrow size styles. You must then add styles created by
10
+ * createArrowHeightStyles to set the arrow's size correctly. This can be useful if the arrow can be different sizes.
11
+ */
12
+ arrowHeight: number | undefined;
13
+ /**
14
+ * The borderWidth of the arrow. Should be the same borderWidth as the parent element.
15
+ *
16
+ * @defaultvalue 1px
17
+ */
18
+ borderWidth?: GriffelStyle['borderBottomWidth'];
19
+ /**
20
+ * The borderStyle for the arrow. Should be the same borderStyle as the parent element.
21
+ *
22
+ * @defaultvalue solid
23
+ */
24
+ borderStyle?: GriffelStyle['borderBottomStyle'];
25
+ /**
26
+ * The borderColor of the arrow. Should be the same borderColor as the parent element.
27
+ *
28
+ * @defaultvalue tokens.colorTransparentStroke
29
+ */
30
+ borderColor?: GriffelStyle['borderBottomColor'];
31
+ };
32
+ /**
33
+ * Helper that creates a makeStyles rule for an arrow element.
34
+ * For runtime arrow size toggling simply create extra classnames to apply to the arrow element
35
+ *
36
+ * ```ts
37
+ * makeStyles({
38
+ * arrowWithSize: createArrowStyles({ arrowHeight: 6 }),
39
+ *
40
+ * arrowWithoutSize: createArrowStyles({ arrowHeight: undefined }),
41
+ * mediumArrow: createArrowHeightStyles(4),
42
+ * smallArrow: createArrowHeightStyles(2),
43
+ * })
44
+ * ...
45
+ *
46
+ * state.arrowWithSize.className = styles.arrowWithSize;
47
+ * state.arrowWithoutSize.className = mergeClasses(
48
+ * styles.arrowWithoutSize,
49
+ * state.smallArrow && styles.smallArrow,
50
+ * state.mediumArrow && styles.mediumArrow,
51
+ * )
52
+ * ```
53
+ */
54
+ export declare function createArrowStyles(options: CreateArrowStylesOptions): GriffelStyle;
55
+ /**
56
+ * Creates CSS styles to size the arrow created by createArrowStyles to the given height.
57
+ *
58
+ * Use this when you need to create classes for several different arrow sizes. If you only need a
59
+ * constant arrow size, you can pass the `arrowHeight` param to createArrowStyles instead.
60
+ */
61
+ export declare function createArrowHeightStyles(arrowHeight: number): {
62
+ width: string;
63
+ height: string;
64
+ };