@fluentui/react-positioning 0.0.0-nightly627ad67f1120211109.1 → 0.0.0-nightly695230dc7220220301.1

Sign up to get free protection for your applications and to get access to all the features.
Files changed (78) hide show
  1. package/CHANGELOG.json +233 -8
  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 +368 -311
  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.js +39 -35
  27. package/lib/utils/getReactFiberFromNode.js.map +1 -1
  28. package/lib/utils/getScrollParent.js +46 -32
  29. package/lib/utils/getScrollParent.js.map +1 -1
  30. package/lib/utils/index.js.map +1 -1
  31. package/lib/utils/mergeArrowOffset.js +29 -24
  32. package/lib/utils/mergeArrowOffset.js.map +1 -1
  33. package/lib/utils/positioningHelper.d.ts +2 -2
  34. package/lib/utils/positioningHelper.js +38 -30
  35. package/lib/utils/positioningHelper.js.map +1 -1
  36. package/lib/utils/resolvePositioningShorthand.js +57 -19
  37. package/lib/utils/resolvePositioningShorthand.js.map +1 -1
  38. package/lib/utils/useCallbackRef.js +35 -29
  39. package/lib/utils/useCallbackRef.js.map +1 -1
  40. package/lib-commonjs/createArrowStyles.d.ts +64 -0
  41. package/lib-commonjs/createArrowStyles.js +100 -0
  42. package/lib-commonjs/createArrowStyles.js.map +1 -0
  43. package/lib-commonjs/createVirtualElementFromClick.js +23 -16
  44. package/lib-commonjs/createVirtualElementFromClick.js.map +1 -1
  45. package/lib-commonjs/index.d.ts +2 -1
  46. package/lib-commonjs/index.js +28 -6
  47. package/lib-commonjs/index.js.map +1 -1
  48. package/lib-commonjs/isIntersectingModifier.d.ts +4 -0
  49. package/lib-commonjs/isIntersectingModifier.js +34 -0
  50. package/lib-commonjs/isIntersectingModifier.js.map +1 -0
  51. package/lib-commonjs/types.d.ts +28 -7
  52. package/lib-commonjs/types.js +4 -1
  53. package/lib-commonjs/types.js.map +1 -1
  54. package/lib-commonjs/usePopper.d.ts +2 -14
  55. package/lib-commonjs/usePopper.js +384 -316
  56. package/lib-commonjs/usePopper.js.map +1 -1
  57. package/lib-commonjs/usePopperMouseTarget.js +38 -25
  58. package/lib-commonjs/usePopperMouseTarget.js.map +1 -1
  59. package/lib-commonjs/utils/getBasePlacement.js +7 -2
  60. package/lib-commonjs/utils/getBasePlacement.js.map +1 -1
  61. package/lib-commonjs/utils/getBoundary.js +23 -12
  62. package/lib-commonjs/utils/getBoundary.js.map +1 -1
  63. package/lib-commonjs/utils/getReactFiberFromNode.js +44 -36
  64. package/lib-commonjs/utils/getReactFiberFromNode.js.map +1 -1
  65. package/lib-commonjs/utils/getScrollParent.js +53 -33
  66. package/lib-commonjs/utils/getScrollParent.js.map +1 -1
  67. package/lib-commonjs/utils/index.js +14 -2
  68. package/lib-commonjs/utils/index.js.map +1 -1
  69. package/lib-commonjs/utils/mergeArrowOffset.js +35 -25
  70. package/lib-commonjs/utils/mergeArrowOffset.js.map +1 -1
  71. package/lib-commonjs/utils/positioningHelper.d.ts +2 -2
  72. package/lib-commonjs/utils/positioningHelper.js +46 -31
  73. package/lib-commonjs/utils/positioningHelper.js.map +1 -1
  74. package/lib-commonjs/utils/resolvePositioningShorthand.js +65 -22
  75. package/lib-commonjs/utils/resolvePositioningShorthand.js.map +1 -1
  76. package/lib-commonjs/utils/useCallbackRef.js +45 -32
  77. package/lib-commonjs/utils/useCallbackRef.js.map +1 -1
  78. package/package.json +8 -8
package/CHANGELOG.json CHANGED
@@ -2,17 +2,234 @@
2
2
  "name": "@fluentui/react-positioning",
3
3
  "entries": [
4
4
  {
5
- "date": "Tue, 09 Nov 2021 04:20:26 GMT",
6
- "tag": "@fluentui/react-positioning_v0.0.0-nightly627ad67f1120211109.1",
7
- "version": "0.0.0-nightly627ad67f1120211109.1",
5
+ "date": "Tue, 01 Mar 2022 04:15:00 GMT",
6
+ "tag": "@fluentui/react-positioning_v0.0.0-nightly695230dc7220220301.1",
7
+ "version": "0.0.0-nightly695230dc7220220301.1",
8
8
  "comments": {
9
9
  "prerelease": [
10
10
  {
11
11
  "author": "email not defined",
12
12
  "package": "@fluentui/react-positioning",
13
- "commit": "5e2f04f4741a9e3b98463480f9c1926ea2006337",
13
+ "commit": "be1864c428aedd3bb265318a6cb6cf161ded2472",
14
14
  "comment": "Release nightly v9"
15
15
  },
16
+ {
17
+ "author": "beachball",
18
+ "package": "@fluentui/react-positioning",
19
+ "comment": "Bump @fluentui/react-shared-contexts to v0.0.0-nightly695230dc7220220301.1",
20
+ "commit": "be1864c428aedd3bb265318a6cb6cf161ded2472"
21
+ },
22
+ {
23
+ "author": "beachball",
24
+ "package": "@fluentui/react-positioning",
25
+ "comment": "Bump @fluentui/react-theme to v0.0.0-nightly695230dc7220220301.1",
26
+ "commit": "be1864c428aedd3bb265318a6cb6cf161ded2472"
27
+ },
28
+ {
29
+ "author": "beachball",
30
+ "package": "@fluentui/react-positioning",
31
+ "comment": "Bump @fluentui/react-utilities to v0.0.0-nightly695230dc7220220301.1",
32
+ "commit": "be1864c428aedd3bb265318a6cb6cf161ded2472"
33
+ }
34
+ ]
35
+ }
36
+ },
37
+ {
38
+ "date": "Tue, 01 Mar 2022 02:17:38 GMT",
39
+ "tag": "@fluentui/react-positioning_v9.0.0-rc.4",
40
+ "version": "9.0.0-rc.4",
41
+ "comments": {
42
+ "prerelease": [
43
+ {
44
+ "author": "olfedias@microsoft.com",
45
+ "package": "@fluentui/react-positioning",
46
+ "commit": "def76fff08777fcd5492f47824b943bab22d4515",
47
+ "comment": "feat: add isIntersectingModifier to usePopper"
48
+ },
49
+ {
50
+ "author": "olfedias@microsoft.com",
51
+ "package": "@fluentui/react-positioning",
52
+ "commit": "084d7408855f3e52b67cbca172da1acef9dcb98f",
53
+ "comment": "fix: Add react-theme as dependency"
54
+ },
55
+ {
56
+ "author": "beachball",
57
+ "package": "@fluentui/react-positioning",
58
+ "comment": "Bump @fluentui/react-utilities to v9.0.0-rc.4",
59
+ "commit": "0bc1e755543ed69443d5d03e1976c630583242f7"
60
+ }
61
+ ]
62
+ }
63
+ },
64
+ {
65
+ "date": "Fri, 18 Feb 2022 13:35:33 GMT",
66
+ "tag": "@fluentui/react-positioning_v9.0.0-rc.3",
67
+ "version": "9.0.0-rc.3",
68
+ "comments": {
69
+ "prerelease": [
70
+ {
71
+ "author": "lingfangao@hotmail.com",
72
+ "package": "@fluentui/react-positioning",
73
+ "commit": "1aa9e691fcccd9a64168cea7941c0f1e71fa1d14",
74
+ "comment": "fix: Source maps contain original source code"
75
+ },
76
+ {
77
+ "author": "beachball",
78
+ "package": "@fluentui/react-positioning",
79
+ "comment": "Bump @fluentui/react-shared-contexts to v9.0.0-rc.3",
80
+ "commit": "3b9c1e931c23173da3d1af0c696cdc58516ce504"
81
+ },
82
+ {
83
+ "author": "beachball",
84
+ "package": "@fluentui/react-positioning",
85
+ "comment": "Bump @fluentui/react-utilities to v9.0.0-rc.3",
86
+ "commit": "3b9c1e931c23173da3d1af0c696cdc58516ce504"
87
+ }
88
+ ]
89
+ }
90
+ },
91
+ {
92
+ "date": "Thu, 10 Feb 2022 08:50:40 GMT",
93
+ "tag": "@fluentui/react-positioning_v9.0.0-rc.1",
94
+ "version": "9.0.0-rc.1",
95
+ "comments": {
96
+ "prerelease": [
97
+ {
98
+ "author": "olfedias@microsoft.com",
99
+ "package": "@fluentui/react-positioning",
100
+ "commit": "a76afe26daad901ff5458ffdda7e66e600d5bcac",
101
+ "comment": "use new types from makeStyles core"
102
+ },
103
+ {
104
+ "author": "Humberto.Morimoto@microsoft.com",
105
+ "package": "@fluentui/react-positioning",
106
+ "commit": "db6526ee2d04991e4473174969e3795299b52f9e",
107
+ "comment": "Replacing use of functions in makeStyles with direct use of tokens."
108
+ },
109
+ {
110
+ "author": "behowell@microsoft.com",
111
+ "package": "@fluentui/react-positioning",
112
+ "commit": "2e34c026a354af1bbfe6a5ead1ade41348d5488f",
113
+ "comment": "Fix tooltip arrow's high contrast border in RTL"
114
+ },
115
+ {
116
+ "author": "olfedias@microsoft.com",
117
+ "package": "@fluentui/react-positioning",
118
+ "commit": "523b5785eafd28cf56b677af40274cefe5d42dcb",
119
+ "comment": "use Griffel packages"
120
+ },
121
+ {
122
+ "author": "lingfangao@hotmail.com",
123
+ "package": "@fluentui/react-positioning",
124
+ "commit": "a548a59bd94f9c4b656da3bdd149db7ac2de726f",
125
+ "comment": "feat: Imperative `setTarget` for `usePopper` and `positioning`"
126
+ },
127
+ {
128
+ "author": "bsunderhus@microsoft.com",
129
+ "package": "@fluentui/react-positioning",
130
+ "commit": "e382ad22539fc97bb283ca4ed856e126c7477e89",
131
+ "comment": "Adds @noflip annotation to data-popper-placement styles"
132
+ },
133
+ {
134
+ "author": "olfedias@microsoft.com",
135
+ "package": "@fluentui/react-positioning",
136
+ "commit": "967d6b74cf0507685a24e0cfaa8c7b9d52a351e1",
137
+ "comment": "update styles to not use CSS shorthands"
138
+ },
139
+ {
140
+ "author": "lingfangao@hotmail.com",
141
+ "package": "@fluentui/react-positioning",
142
+ "commit": "c00913d50e2dd15bbfbb0757cefe43b192ff1d7f",
143
+ "comment": "Bump Fluent UI packages to 9.0.0-rc"
144
+ },
145
+ {
146
+ "author": "behowell@microsoft.com",
147
+ "package": "@fluentui/react-positioning",
148
+ "commit": "09804275c7f346db54c33d4ff347bffc33676014",
149
+ "comment": "Fix popover arrow styling"
150
+ },
151
+ {
152
+ "author": "beachball",
153
+ "package": "@fluentui/react-positioning",
154
+ "comment": "Bump @fluentui/react-shared-contexts to v9.0.0-rc.1",
155
+ "commit": "e6c855f6d9019d6c73668d15fc9bc3a13291a6c8"
156
+ },
157
+ {
158
+ "author": "beachball",
159
+ "package": "@fluentui/react-positioning",
160
+ "comment": "Bump @fluentui/react-utilities to v9.0.0-rc.1",
161
+ "commit": "e6c855f6d9019d6c73668d15fc9bc3a13291a6c8"
162
+ }
163
+ ],
164
+ "none": [
165
+ {
166
+ "author": "olfedias@microsoft.com",
167
+ "package": "@fluentui/react-positioning",
168
+ "commit": "c061e98be4b4a718c72a144a1f60bb5515824612",
169
+ "comment": "remove inline-style-expand-shorthand from tsconfigs"
170
+ },
171
+ {
172
+ "author": "martinhochel@microsoft.com",
173
+ "package": "@fluentui/react-positioning",
174
+ "commit": "8dfa712156b70414205b87b5b6d099367b0c297d",
175
+ "comment": "chore: use storybook runner for all vNext packages"
176
+ }
177
+ ]
178
+ }
179
+ },
180
+ {
181
+ "date": "Thu, 25 Nov 2021 08:34:15 GMT",
182
+ "tag": "@fluentui/react-positioning_v9.0.0-beta.4",
183
+ "version": "9.0.0-beta.4",
184
+ "comments": {
185
+ "none": [
186
+ {
187
+ "author": "lingfangao@hotmail.com",
188
+ "package": "@fluentui/react-positioning",
189
+ "commit": "718e63006d8d07d24efab9c32942041963d78dc7",
190
+ "comment": "Migrate package to use solution style ts-configs"
191
+ }
192
+ ],
193
+ "prerelease": [
194
+ {
195
+ "author": "lingfangao@hotmail.com",
196
+ "package": "@fluentui/react-positioning",
197
+ "commit": "58db204f28af1d68df7260ff580cf91f0adcfb66",
198
+ "comment": "Add utility function to create styles for an arrow element"
199
+ },
200
+ {
201
+ "author": "beachball",
202
+ "package": "@fluentui/react-positioning",
203
+ "comment": "Bump @fluentui/react-make-styles to v9.0.0-beta.4",
204
+ "commit": "48d236ac53a4950fabc3ddd52f91dac93ca0195b"
205
+ },
206
+ {
207
+ "author": "beachball",
208
+ "package": "@fluentui/react-positioning",
209
+ "comment": "Bump @fluentui/react-shared-contexts to v9.0.0-beta.4",
210
+ "commit": "48d236ac53a4950fabc3ddd52f91dac93ca0195b"
211
+ },
212
+ {
213
+ "author": "beachball",
214
+ "package": "@fluentui/react-positioning",
215
+ "comment": "Bump @fluentui/react-utilities to v9.0.0-beta.4",
216
+ "commit": "48d236ac53a4950fabc3ddd52f91dac93ca0195b"
217
+ },
218
+ {
219
+ "author": "beachball",
220
+ "package": "@fluentui/react-positioning",
221
+ "comment": "Bump @fluentui/babel-make-styles to v9.0.0-beta.4",
222
+ "commit": "48d236ac53a4950fabc3ddd52f91dac93ca0195b"
223
+ }
224
+ ]
225
+ }
226
+ },
227
+ {
228
+ "date": "Fri, 12 Nov 2021 13:25:30 GMT",
229
+ "tag": "@fluentui/react-positioning_v9.0.0-beta.3",
230
+ "version": "9.0.0-beta.3",
231
+ "comments": {
232
+ "prerelease": [
16
233
  {
17
234
  "author": "gcox@microsoft.com",
18
235
  "package": "@fluentui/react-positioning",
@@ -22,14 +239,22 @@
22
239
  {
23
240
  "author": "beachball",
24
241
  "package": "@fluentui/react-positioning",
25
- "comment": "Bump @fluentui/react-shared-contexts to v0.0.0-nightly627ad67f1120211109.1",
26
- "commit": "5e2f04f4741a9e3b98463480f9c1926ea2006337"
242
+ "comment": "Bump @fluentui/react-shared-contexts to v9.0.0-beta.3",
243
+ "commit": "742342e52c65066f779232e4e1302fedf0dd460d"
27
244
  },
28
245
  {
29
246
  "author": "beachball",
30
247
  "package": "@fluentui/react-positioning",
31
- "comment": "Bump @fluentui/react-utilities to v0.0.0-nightly627ad67f1120211109.1",
32
- "commit": "5e2f04f4741a9e3b98463480f9c1926ea2006337"
248
+ "comment": "Bump @fluentui/react-utilities to v9.0.0-beta.3",
249
+ "commit": "742342e52c65066f779232e4e1302fedf0dd460d"
250
+ }
251
+ ],
252
+ "none": [
253
+ {
254
+ "author": "lingfangao@hotmail.com",
255
+ "package": "@fluentui/react-positioning",
256
+ "commit": "00f70581480b536e723fb69edf0ae617beac4807",
257
+ "comment": "Remove beta release tag"
33
258
  }
34
259
  ]
35
260
  }
package/CHANGELOG.md CHANGED
@@ -1,20 +1,85 @@
1
1
  # Change Log - @fluentui/react-positioning
2
2
 
3
- This log was last generated on Tue, 09 Nov 2021 04:20:26 GMT and should not be manually modified.
3
+ This log was last generated on Tue, 01 Mar 2022 04:15:00 GMT and should not be manually modified.
4
4
 
5
5
  <!-- Start content -->
6
6
 
7
- ## [0.0.0-nightly627ad67f1120211109.1](https://github.com/microsoft/fluentui/tree/@fluentui/react-positioning_v0.0.0-nightly627ad67f1120211109.1)
7
+ ## [0.0.0-nightly695230dc7220220301.1](https://github.com/microsoft/fluentui/tree/@fluentui/react-positioning_v0.0.0-nightly695230dc7220220301.1)
8
8
 
9
- Tue, 09 Nov 2021 04:20:26 GMT
10
- [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-positioning_v9.0.0-beta.2..@fluentui/react-positioning_v0.0.0-nightly627ad67f1120211109.1)
9
+ Tue, 01 Mar 2022 04:15:00 GMT
10
+ [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-positioning_v9.0.0-rc.4..@fluentui/react-positioning_v0.0.0-nightly695230dc7220220301.1)
11
+
12
+ ### Changes
13
+
14
+ - Release nightly v9 ([commit](https://github.com/microsoft/fluentui/commit/be1864c428aedd3bb265318a6cb6cf161ded2472) by email not defined)
15
+ - Bump @fluentui/react-shared-contexts to v0.0.0-nightly695230dc7220220301.1 ([commit](https://github.com/microsoft/fluentui/commit/be1864c428aedd3bb265318a6cb6cf161ded2472) by beachball)
16
+ - Bump @fluentui/react-theme to v0.0.0-nightly695230dc7220220301.1 ([commit](https://github.com/microsoft/fluentui/commit/be1864c428aedd3bb265318a6cb6cf161ded2472) by beachball)
17
+ - Bump @fluentui/react-utilities to v0.0.0-nightly695230dc7220220301.1 ([commit](https://github.com/microsoft/fluentui/commit/be1864c428aedd3bb265318a6cb6cf161ded2472) by beachball)
18
+
19
+ ## [9.0.0-rc.4](https://github.com/microsoft/fluentui/tree/@fluentui/react-positioning_v9.0.0-rc.4)
20
+
21
+ Tue, 01 Mar 2022 02:17:38 GMT
22
+ [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-positioning_v9.0.0-rc.3..@fluentui/react-positioning_v9.0.0-rc.4)
23
+
24
+ ### Changes
25
+
26
+ - feat: add isIntersectingModifier to usePopper ([PR #21855](https://github.com/microsoft/fluentui/pull/21855) by olfedias@microsoft.com)
27
+ - fix: Add react-theme as dependency ([PR #21825](https://github.com/microsoft/fluentui/pull/21825) by olfedias@microsoft.com)
28
+ - Bump @fluentui/react-utilities to v9.0.0-rc.4 ([PR #21884](https://github.com/microsoft/fluentui/pull/21884) by beachball)
29
+
30
+ ## [9.0.0-rc.3](https://github.com/microsoft/fluentui/tree/@fluentui/react-positioning_v9.0.0-rc.3)
31
+
32
+ Fri, 18 Feb 2022 13:35:33 GMT
33
+ [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-positioning_v9.0.0-rc.1..@fluentui/react-positioning_v9.0.0-rc.3)
34
+
35
+ ### Changes
36
+
37
+ - fix: Source maps contain original source code ([PR #21690](https://github.com/microsoft/fluentui/pull/21690) by lingfangao@hotmail.com)
38
+ - Bump @fluentui/react-shared-contexts to v9.0.0-rc.3 ([PR #21800](https://github.com/microsoft/fluentui/pull/21800) by beachball)
39
+ - Bump @fluentui/react-utilities to v9.0.0-rc.3 ([PR #21800](https://github.com/microsoft/fluentui/pull/21800) by beachball)
40
+
41
+ ## [9.0.0-rc.1](https://github.com/microsoft/fluentui/tree/@fluentui/react-positioning_v9.0.0-rc.1)
42
+
43
+ Thu, 10 Feb 2022 08:50:40 GMT
44
+ [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-positioning_v9.0.0-beta.4..@fluentui/react-positioning_v9.0.0-rc.1)
45
+
46
+ ### Changes
47
+
48
+ - use new types from makeStyles core ([PR #20786](https://github.com/microsoft/fluentui/pull/20786) by olfedias@microsoft.com)
49
+ - 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)
50
+ - Fix tooltip arrow's high contrast border in RTL ([PR #21354](https://github.com/microsoft/fluentui/pull/21354) by behowell@microsoft.com)
51
+ - use Griffel packages ([PR #21421](https://github.com/microsoft/fluentui/pull/21421) by olfedias@microsoft.com)
52
+ - feat: Imperative `setTarget` for `usePopper` and `positioning` ([PR #21632](https://github.com/microsoft/fluentui/pull/21632) by lingfangao@hotmail.com)
53
+ - Adds @noflip annotation to data-popper-placement styles ([PR #20845](https://github.com/microsoft/fluentui/pull/20845) by bsunderhus@microsoft.com)
54
+ - update styles to not use CSS shorthands ([PR #20842](https://github.com/microsoft/fluentui/pull/20842) by olfedias@microsoft.com)
55
+ - Bump Fluent UI packages to 9.0.0-rc ([PR #21623](https://github.com/microsoft/fluentui/pull/21623) by lingfangao@hotmail.com)
56
+ - Fix popover arrow styling ([PR #21086](https://github.com/microsoft/fluentui/pull/21086) by behowell@microsoft.com)
57
+ - Bump @fluentui/react-shared-contexts to v9.0.0-rc.1 ([commit](https://github.com/microsoft/fluentui/commit/e6c855f6d9019d6c73668d15fc9bc3a13291a6c8) by beachball)
58
+ - Bump @fluentui/react-utilities to v9.0.0-rc.1 ([commit](https://github.com/microsoft/fluentui/commit/e6c855f6d9019d6c73668d15fc9bc3a13291a6c8) by beachball)
59
+
60
+ ## [9.0.0-beta.4](https://github.com/microsoft/fluentui/tree/@fluentui/react-positioning_v9.0.0-beta.4)
61
+
62
+ Thu, 25 Nov 2021 08:34:15 GMT
63
+ [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-positioning_v9.0.0-beta.3..@fluentui/react-positioning_v9.0.0-beta.4)
64
+
65
+ ### Changes
66
+
67
+ - Add utility function to create styles for an arrow element ([PR #20541](https://github.com/microsoft/fluentui/pull/20541) by lingfangao@hotmail.com)
68
+ - Bump @fluentui/react-make-styles to v9.0.0-beta.4 ([PR #20762](https://github.com/microsoft/fluentui/pull/20762) by beachball)
69
+ - Bump @fluentui/react-shared-contexts to v9.0.0-beta.4 ([PR #20762](https://github.com/microsoft/fluentui/pull/20762) by beachball)
70
+ - Bump @fluentui/react-utilities to v9.0.0-beta.4 ([PR #20762](https://github.com/microsoft/fluentui/pull/20762) by beachball)
71
+ - Bump @fluentui/babel-make-styles to v9.0.0-beta.4 ([PR #20762](https://github.com/microsoft/fluentui/pull/20762) by beachball)
72
+
73
+ ## [9.0.0-beta.3](https://github.com/microsoft/fluentui/tree/@fluentui/react-positioning_v9.0.0-beta.3)
74
+
75
+ Fri, 12 Nov 2021 13:25:30 GMT
76
+ [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-positioning_v9.0.0-beta.2..@fluentui/react-positioning_v9.0.0-beta.3)
11
77
 
12
78
  ### Changes
13
79
 
14
- - Release nightly v9 ([commit](https://github.com/microsoft/fluentui/commit/5e2f04f4741a9e3b98463480f9c1926ea2006337) by email not defined)
15
80
  - Updated beta and RC components to ES2019 ([PR #20405](https://github.com/microsoft/fluentui/pull/20405) by gcox@microsoft.com)
16
- - Bump @fluentui/react-shared-contexts to v0.0.0-nightly627ad67f1120211109.1 ([commit](https://github.com/microsoft/fluentui/commit/5e2f04f4741a9e3b98463480f9c1926ea2006337) by beachball)
17
- - Bump @fluentui/react-utilities to v0.0.0-nightly627ad67f1120211109.1 ([commit](https://github.com/microsoft/fluentui/commit/5e2f04f4741a9e3b98463480f9c1926ea2006337) by beachball)
81
+ - Bump @fluentui/react-shared-contexts to v9.0.0-beta.3 ([PR #20583](https://github.com/microsoft/fluentui/pull/20583) by beachball)
82
+ - Bump @fluentui/react-utilities to v9.0.0-beta.3 ([PR #20583](https://github.com/microsoft/fluentui/pull/20583) by beachball)
18
83
 
19
84
  ## [9.0.0-beta.2](https://github.com/microsoft/fluentui/tree/@fluentui/react-positioning_v9.0.0-beta.2)
20
85
 
@@ -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
+ };