@primer/react 38.31.0-rc.f96563b64 → 38.31.0
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.
- package/CHANGELOG.md +2 -0
- package/dist/Autocomplete/Autocomplete.js +131 -74
- package/dist/Autocomplete/AutocompleteMenu.js +277 -119
- package/dist/Autocomplete/AutocompleteOverlay.js +113 -38
- package/dist/Banner/Banner.js +414 -96
- package/dist/Button/Button.js +29 -8
- package/dist/Button/IconButton.js +120 -28
- package/dist/Button/LinkButton.js +34 -8
- package/dist/ConfirmationDialog/ConfirmationDialog.js +86 -24
- package/dist/PageLayout/PageLayout.js +1274 -478
- package/dist/Pagination/Pagination.js +196 -70
- package/dist/SelectPanel/SelectPanelMessage.js +72 -29
- package/dist/UnderlineNav/UnderlineNav.js +203 -63
- package/dist/UnderlineNav/UnderlineNavItem.js +110 -22
- package/dist/hooks/useMergedRefs.js +20 -11
- package/dist/hooks/useScrollFlash.js +24 -10
- package/package.json +1 -1
package/CHANGELOG.md
CHANGED
|
@@ -6,6 +6,8 @@
|
|
|
6
6
|
|
|
7
7
|
- [#8057](https://github.com/primer/react/pull/8057) [`0b9c81e`](https://github.com/primer/react/commit/0b9c81e7e8fef1dfc98f3b86b5a375d4ec7fe204) Thanks [@francinelucca](https://github.com/francinelucca)! - ThemeProvider: Remove `primer_react_theme_provider_remove_ssr_handoff` feature flag.
|
|
8
8
|
|
|
9
|
+
- [#8105](https://github.com/primer/react/pull/8105) [`be2950f`](https://github.com/primer/react/commit/be2950fd1ac268dd4e79258ab2cfe9241dd9e1c6) Thanks [@joshblack](https://github.com/joshblack)! - React Compiler: Enable compiler output for Banner, ConfirmationDialog, PageLayout, Pagination, UnderlineNav, `useMergedRefs`, and `useScrollFlash`
|
|
10
|
+
|
|
9
11
|
### Patch Changes
|
|
10
12
|
|
|
11
13
|
- [#8066](https://github.com/primer/react/pull/8066) [`dd66aa2`](https://github.com/primer/react/commit/dd66aa27611f7ad56adb7429b50813d6af5a01d7) Thanks [@janmaarten-a11y](https://github.com/janmaarten-a11y)! - Fix invalid HTML nesting in `ActionList.Heading` by applying the visually-hidden styles directly to the heading element instead of wrapping it in a `span`.
|
|
@@ -3,8 +3,9 @@ import { AutocompleteContext, AutocompleteDeferredInputContext, AutocompleteInpu
|
|
|
3
3
|
import AutocompleteInput from "./AutocompleteInput.js";
|
|
4
4
|
import AutocompleteMenu from "./AutocompleteMenu.js";
|
|
5
5
|
import AutocompleteOverlay from "./AutocompleteOverlay.js";
|
|
6
|
+
import { c } from "react-compiler-runtime";
|
|
6
7
|
import { jsx } from "react/jsx-runtime";
|
|
7
|
-
import {
|
|
8
|
+
import { useDeferredValue, useReducer, useRef } from "react";
|
|
8
9
|
//#region src/Autocomplete/Autocomplete.tsx
|
|
9
10
|
const initialState = {
|
|
10
11
|
inputValue: "",
|
|
@@ -39,88 +40,144 @@ const reducer = (state, action) => {
|
|
|
39
40
|
default: return state;
|
|
40
41
|
}
|
|
41
42
|
};
|
|
42
|
-
const Autocomplete = (
|
|
43
|
+
const Autocomplete = (t0) => {
|
|
44
|
+
const $ = c(24);
|
|
45
|
+
const { children, id: idProp } = t0;
|
|
43
46
|
const activeDescendantRef = useRef(null);
|
|
44
47
|
const scrollContainerRef = useRef(null);
|
|
45
48
|
const inputRef = useRef(null);
|
|
46
49
|
const [state, dispatch] = useReducer(reducer, initialState);
|
|
47
50
|
const { inputValue, showMenu, autocompleteSuggestion, isMenuDirectlyActivated, selectedItemLength } = state;
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
51
|
+
let t1;
|
|
52
|
+
if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
|
|
53
|
+
t1 = (value) => {
|
|
54
|
+
dispatch({
|
|
55
|
+
type: "inputValue",
|
|
56
|
+
payload: value
|
|
57
|
+
});
|
|
58
|
+
};
|
|
59
|
+
$[0] = t1;
|
|
60
|
+
} else t1 = $[0];
|
|
61
|
+
const setInputValue = t1;
|
|
62
|
+
let t2;
|
|
63
|
+
if ($[1] === Symbol.for("react.memo_cache_sentinel")) {
|
|
64
|
+
t2 = (value_0) => {
|
|
65
|
+
dispatch({
|
|
66
|
+
type: "showMenu",
|
|
67
|
+
payload: value_0
|
|
68
|
+
});
|
|
69
|
+
};
|
|
70
|
+
$[1] = t2;
|
|
71
|
+
} else t2 = $[1];
|
|
72
|
+
const setShowMenu = t2;
|
|
73
|
+
let t3;
|
|
74
|
+
if ($[2] === Symbol.for("react.memo_cache_sentinel")) {
|
|
75
|
+
t3 = (value_1) => {
|
|
76
|
+
dispatch({
|
|
77
|
+
type: "autocompleteSuggestion",
|
|
78
|
+
payload: value_1
|
|
79
|
+
});
|
|
80
|
+
};
|
|
81
|
+
$[2] = t3;
|
|
82
|
+
} else t3 = $[2];
|
|
83
|
+
const setAutocompleteSuggestion = t3;
|
|
84
|
+
let t4;
|
|
85
|
+
if ($[3] === Symbol.for("react.memo_cache_sentinel")) {
|
|
86
|
+
t4 = (value_2) => {
|
|
87
|
+
dispatch({
|
|
88
|
+
type: "isMenuDirectlyActivated",
|
|
89
|
+
payload: value_2
|
|
90
|
+
});
|
|
91
|
+
};
|
|
92
|
+
$[3] = t4;
|
|
93
|
+
} else t4 = $[3];
|
|
94
|
+
const setIsMenuDirectlyActivated = t4;
|
|
95
|
+
let t5;
|
|
96
|
+
if ($[4] === Symbol.for("react.memo_cache_sentinel")) {
|
|
97
|
+
t5 = (value_3) => {
|
|
98
|
+
dispatch({
|
|
99
|
+
type: "selectedItemLength",
|
|
100
|
+
payload: value_3
|
|
101
|
+
});
|
|
102
|
+
};
|
|
103
|
+
$[4] = t5;
|
|
104
|
+
} else t5 = $[4];
|
|
105
|
+
const setSelectedItemLength = t5;
|
|
78
106
|
const id = useId$1(idProp);
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
107
|
+
let t6;
|
|
108
|
+
if ($[5] !== id || $[6] !== selectedItemLength || $[7] !== showMenu) {
|
|
109
|
+
t6 = {
|
|
110
|
+
activeDescendantRef,
|
|
111
|
+
id,
|
|
112
|
+
inputRef,
|
|
113
|
+
scrollContainerRef,
|
|
114
|
+
selectedItemLength,
|
|
115
|
+
setAutocompleteSuggestion,
|
|
116
|
+
setInputValue,
|
|
117
|
+
setIsMenuDirectlyActivated,
|
|
118
|
+
setShowMenu,
|
|
119
|
+
setSelectedItemLength,
|
|
120
|
+
showMenu
|
|
121
|
+
};
|
|
122
|
+
$[5] = id;
|
|
123
|
+
$[6] = selectedItemLength;
|
|
124
|
+
$[7] = showMenu;
|
|
125
|
+
$[8] = t6;
|
|
126
|
+
} else t6 = $[8];
|
|
127
|
+
const autocompleteContextValue = t6;
|
|
128
|
+
let t7;
|
|
129
|
+
if ($[9] !== autocompleteSuggestion || $[10] !== inputValue || $[11] !== isMenuDirectlyActivated) {
|
|
130
|
+
t7 = {
|
|
131
|
+
autocompleteSuggestion,
|
|
132
|
+
inputValue,
|
|
133
|
+
isMenuDirectlyActivated
|
|
134
|
+
};
|
|
135
|
+
$[9] = autocompleteSuggestion;
|
|
136
|
+
$[10] = inputValue;
|
|
137
|
+
$[11] = isMenuDirectlyActivated;
|
|
138
|
+
$[12] = t7;
|
|
139
|
+
} else t7 = $[12];
|
|
140
|
+
const autocompleteInputContextValue = t7;
|
|
110
141
|
const deferredInputValue = useDeferredValue(inputValue);
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
142
|
+
let t8;
|
|
143
|
+
if ($[13] !== deferredInputValue) {
|
|
144
|
+
t8 = { deferredInputValue };
|
|
145
|
+
$[13] = deferredInputValue;
|
|
146
|
+
$[14] = t8;
|
|
147
|
+
} else t8 = $[14];
|
|
148
|
+
const autocompleteDeferredInputContextValue = t8;
|
|
149
|
+
let t9;
|
|
150
|
+
if ($[15] !== autocompleteDeferredInputContextValue || $[16] !== children) {
|
|
151
|
+
t9 = /*#__PURE__*/ jsx(AutocompleteDeferredInputContext.Provider, {
|
|
152
|
+
value: autocompleteDeferredInputContextValue,
|
|
153
|
+
children
|
|
154
|
+
});
|
|
155
|
+
$[15] = autocompleteDeferredInputContextValue;
|
|
156
|
+
$[16] = children;
|
|
157
|
+
$[17] = t9;
|
|
158
|
+
} else t9 = $[17];
|
|
159
|
+
let t10;
|
|
160
|
+
if ($[18] !== autocompleteInputContextValue || $[19] !== t9) {
|
|
161
|
+
t10 = /*#__PURE__*/ jsx(AutocompleteInputContext.Provider, {
|
|
115
162
|
value: autocompleteInputContextValue,
|
|
116
|
-
children:
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
}
|
|
163
|
+
children: t9
|
|
164
|
+
});
|
|
165
|
+
$[18] = autocompleteInputContextValue;
|
|
166
|
+
$[19] = t9;
|
|
167
|
+
$[20] = t10;
|
|
168
|
+
} else t10 = $[20];
|
|
169
|
+
let t11;
|
|
170
|
+
if ($[21] !== autocompleteContextValue || $[22] !== t10) {
|
|
171
|
+
t11 = /*#__PURE__*/ jsx(AutocompleteContext.Provider, {
|
|
172
|
+
value: autocompleteContextValue,
|
|
173
|
+
children: t10
|
|
174
|
+
});
|
|
175
|
+
$[21] = autocompleteContextValue;
|
|
176
|
+
$[22] = t10;
|
|
177
|
+
$[23] = t11;
|
|
178
|
+
} else t11 = $[23];
|
|
179
|
+
return t11;
|
|
122
180
|
};
|
|
123
|
-
Autocomplete.displayName = "Autocomplete";
|
|
124
181
|
var Autocomplete_default = Object.assign(Autocomplete, {
|
|
125
182
|
__SLOT__: Symbol("Autocomplete"),
|
|
126
183
|
Context: AutocompleteContext,
|