@primer/react 38.6.2 → 38.6.3-rc.077bdd513
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 +47 -0
- package/dist/Autocomplete/Autocomplete.d.ts +0 -3
- package/dist/Autocomplete/Autocomplete.d.ts.map +1 -1
- package/dist/Autocomplete/Autocomplete.js +69 -23
- package/dist/Autocomplete/AutocompleteContext.d.ts +23 -3
- package/dist/Autocomplete/AutocompleteContext.d.ts.map +1 -1
- package/dist/Autocomplete/AutocompleteContext.js +20 -1
- package/dist/Autocomplete/AutocompleteInput.d.ts.map +1 -1
- package/dist/Autocomplete/AutocompleteInput.js +8 -5
- package/dist/Autocomplete/AutocompleteMenu.d.ts.map +1 -1
- package/dist/Autocomplete/AutocompleteMenu.js +123 -121
- package/dist/{BaseStyles-79fd37c4.css → BaseStyles-7e59cc50.css} +2 -2
- package/dist/BaseStyles-7e59cc50.css.map +1 -0
- package/dist/BaseStyles.module.css.js +1 -1
- package/dist/Dialog/{Dialog-1a61e61a.css → Dialog-92b5e3b7.css} +2 -2
- package/dist/Dialog/Dialog-92b5e3b7.css.map +1 -0
- package/dist/Dialog/Dialog.d.ts.map +1 -1
- package/dist/Dialog/Dialog.js +21 -5
- package/dist/Dialog/Dialog.module.css.js +1 -1
- package/dist/FeatureFlags/DefaultFeatureFlags.d.ts.map +1 -1
- package/dist/FeatureFlags/DefaultFeatureFlags.js +1 -0
- package/dist/FeatureFlags/FeatureFlags.d.ts +6 -0
- package/dist/FeatureFlags/FeatureFlags.d.ts.map +1 -1
- package/dist/FeatureFlags/FeatureFlags.js +41 -32
- package/dist/PageLayout/{PageLayout-c092f3db.css → PageLayout-51007c87.css} +2 -2
- package/dist/PageLayout/PageLayout-51007c87.css.map +1 -0
- package/dist/PageLayout/PageLayout.d.ts.map +1 -1
- package/dist/PageLayout/PageLayout.js +399 -313
- package/dist/PageLayout/PageLayout.module.css.js +1 -1
- package/dist/PageLayout/paneUtils.d.ts +11 -0
- package/dist/PageLayout/paneUtils.d.ts.map +1 -0
- package/dist/PageLayout/paneUtils.js +34 -0
- package/dist/PageLayout/usePaneWidth.d.ts +2 -1
- package/dist/PageLayout/usePaneWidth.d.ts.map +1 -1
- package/dist/PageLayout/usePaneWidth.js +56 -44
- package/dist/ToggleSwitch/ToggleSwitch-40bab513.css +2 -0
- package/dist/ToggleSwitch/ToggleSwitch-40bab513.css.map +1 -0
- package/dist/ToggleSwitch/ToggleSwitch.module.css.js +1 -1
- package/dist/internal/utils/hasInteractiveNodes.d.ts.map +1 -1
- package/dist/internal/utils/hasInteractiveNodes.js +22 -16
- package/package.json +8 -8
- package/dist/BaseStyles-79fd37c4.css.map +0 -1
- package/dist/Dialog/Dialog-1a61e61a.css.map +0 -1
- package/dist/PageLayout/PageLayout-c092f3db.css.map +0 -1
- package/dist/ToggleSwitch/ToggleSwitch-d1bd60b0.css +0 -2
- package/dist/ToggleSwitch/ToggleSwitch-d1bd60b0.css.map +0 -1
|
@@ -6,7 +6,7 @@ import { scrollIntoView } from '@primer/behaviors';
|
|
|
6
6
|
import { ActionList } from '../ActionList/index.js';
|
|
7
7
|
import { useFocusZone } from '../hooks/useFocusZone.js';
|
|
8
8
|
import { useId } from '../hooks/useId.js';
|
|
9
|
-
import { AutocompleteContext } from './AutocompleteContext.js';
|
|
9
|
+
import { AutocompleteContext, AutocompleteDeferredInputContext } from './AutocompleteContext.js';
|
|
10
10
|
import { PlusIcon } from '@primer/octicons-react';
|
|
11
11
|
import VisuallyHidden from '../_VisuallyHidden.js';
|
|
12
12
|
import { isElement } from 'react-is';
|
|
@@ -50,14 +50,14 @@ const debounceAnnouncement = debounce(announcement => {
|
|
|
50
50
|
function AutocompleteMenu(props) {
|
|
51
51
|
const $ = c(78);
|
|
52
52
|
const autocompleteContext = useContext(AutocompleteContext);
|
|
53
|
-
|
|
53
|
+
const deferredInputContext = useContext(AutocompleteDeferredInputContext);
|
|
54
|
+
if (autocompleteContext === null || deferredInputContext === null) {
|
|
54
55
|
throw new Error("AutocompleteContext returned null values");
|
|
55
56
|
}
|
|
56
57
|
const {
|
|
57
58
|
activeDescendantRef,
|
|
58
59
|
id,
|
|
59
60
|
inputRef,
|
|
60
|
-
inputValue: t0,
|
|
61
61
|
scrollContainerRef,
|
|
62
62
|
setAutocompleteSuggestion,
|
|
63
63
|
setShowMenu,
|
|
@@ -66,46 +66,48 @@ function AutocompleteMenu(props) {
|
|
|
66
66
|
setSelectedItemLength,
|
|
67
67
|
showMenu
|
|
68
68
|
} = autocompleteContext;
|
|
69
|
-
const
|
|
69
|
+
const {
|
|
70
|
+
deferredInputValue
|
|
71
|
+
} = deferredInputContext;
|
|
70
72
|
const {
|
|
71
73
|
items,
|
|
72
74
|
selectedItemIds,
|
|
73
75
|
sortOnCloseFn,
|
|
74
|
-
emptyStateText:
|
|
76
|
+
emptyStateText: t0,
|
|
75
77
|
addNewItem,
|
|
76
78
|
loading,
|
|
77
|
-
selectionVariant:
|
|
79
|
+
selectionVariant: t1,
|
|
78
80
|
filterFn,
|
|
79
81
|
"aria-labelledby": ariaLabelledBy,
|
|
80
82
|
onOpenChange,
|
|
81
83
|
onSelectedChange,
|
|
82
84
|
customScrollContainerRef
|
|
83
85
|
} = props;
|
|
84
|
-
const emptyStateText =
|
|
85
|
-
const selectionVariant =
|
|
86
|
+
const emptyStateText = t0 === undefined ? "No selectable options" : t0;
|
|
87
|
+
const selectionVariant = t1 === undefined ? "single" : t1;
|
|
86
88
|
const listContainerRef = useRef(null);
|
|
87
|
-
let
|
|
89
|
+
let t2;
|
|
88
90
|
if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
|
|
89
|
-
|
|
90
|
-
$[0] =
|
|
91
|
+
t2 = [];
|
|
92
|
+
$[0] = t2;
|
|
91
93
|
} else {
|
|
92
|
-
|
|
94
|
+
t2 = $[0];
|
|
93
95
|
}
|
|
94
|
-
const allItemsToRenderRef = useRef(
|
|
96
|
+
const allItemsToRenderRef = useRef(t2);
|
|
95
97
|
const [highlightedItem, setHighlightedItem] = useState();
|
|
96
|
-
let
|
|
98
|
+
let t3;
|
|
97
99
|
if ($[1] !== items) {
|
|
98
|
-
|
|
100
|
+
t3 = items.map(_temp);
|
|
99
101
|
$[1] = items;
|
|
100
|
-
$[2] =
|
|
102
|
+
$[2] = t3;
|
|
101
103
|
} else {
|
|
102
|
-
|
|
104
|
+
t3 = $[2];
|
|
103
105
|
}
|
|
104
|
-
const [sortedItemIds, setSortedItemIds] = useState(
|
|
106
|
+
const [sortedItemIds, setSortedItemIds] = useState(t3);
|
|
105
107
|
const generatedUniqueId = useId(id);
|
|
106
|
-
let
|
|
108
|
+
let t4;
|
|
107
109
|
if ($[3] !== (highlightedItem === null || highlightedItem === void 0 ? void 0 : highlightedItem.id) || $[4] !== inputRef || $[5] !== items || $[6] !== onSelectedChange || $[7] !== selectedItemIds || $[8] !== selectionVariant || $[9] !== setAutocompleteSuggestion || $[10] !== setInputValue || $[11] !== setShowMenu) {
|
|
108
|
-
|
|
110
|
+
t4 = items.map(selectableItem => ({
|
|
109
111
|
...selectableItem,
|
|
110
112
|
role: "option",
|
|
111
113
|
id: selectableItem.id,
|
|
@@ -135,43 +137,43 @@ function AutocompleteMenu(props) {
|
|
|
135
137
|
$[9] = setAutocompleteSuggestion;
|
|
136
138
|
$[10] = setInputValue;
|
|
137
139
|
$[11] = setShowMenu;
|
|
138
|
-
$[12] =
|
|
140
|
+
$[12] = t4;
|
|
139
141
|
} else {
|
|
140
|
-
|
|
142
|
+
t4 = $[12];
|
|
141
143
|
}
|
|
142
|
-
const selectableItems =
|
|
143
|
-
let
|
|
144
|
+
const selectableItems = t4;
|
|
145
|
+
let t5;
|
|
144
146
|
if ($[13] !== sortedItemIds) {
|
|
145
|
-
|
|
147
|
+
t5 = sortedItemIds.reduce(_temp2, {});
|
|
146
148
|
$[13] = sortedItemIds;
|
|
147
|
-
$[14] =
|
|
149
|
+
$[14] = t5;
|
|
148
150
|
} else {
|
|
149
|
-
|
|
151
|
+
t5 = $[14];
|
|
150
152
|
}
|
|
151
|
-
const itemSortOrderData =
|
|
152
|
-
let
|
|
153
|
-
if ($[15] !==
|
|
154
|
-
let
|
|
153
|
+
const itemSortOrderData = t5;
|
|
154
|
+
let t6;
|
|
155
|
+
if ($[15] !== deferredInputValue || $[16] !== filterFn || $[17] !== itemSortOrderData || $[18] !== selectableItems) {
|
|
156
|
+
let t7;
|
|
155
157
|
if ($[20] !== itemSortOrderData) {
|
|
156
|
-
|
|
158
|
+
t7 = (a, b) => itemSortOrderData[a.id] - itemSortOrderData[b.id];
|
|
157
159
|
$[20] = itemSortOrderData;
|
|
158
|
-
$[21] =
|
|
160
|
+
$[21] = t7;
|
|
159
161
|
} else {
|
|
160
|
-
|
|
162
|
+
t7 = $[21];
|
|
161
163
|
}
|
|
162
|
-
|
|
163
|
-
$[15] =
|
|
164
|
-
$[16] =
|
|
164
|
+
t6 = selectableItems.filter(filterFn ? filterFn : getDefaultItemFilter(deferredInputValue)).sort(t7);
|
|
165
|
+
$[15] = deferredInputValue;
|
|
166
|
+
$[16] = filterFn;
|
|
165
167
|
$[17] = itemSortOrderData;
|
|
166
168
|
$[18] = selectableItems;
|
|
167
|
-
$[19] =
|
|
169
|
+
$[19] = t6;
|
|
168
170
|
} else {
|
|
169
|
-
|
|
171
|
+
t6 = $[19];
|
|
170
172
|
}
|
|
171
|
-
const sortedAndFilteredItemsToRender =
|
|
172
|
-
let
|
|
173
|
+
const sortedAndFilteredItemsToRender = t6;
|
|
174
|
+
let t7;
|
|
173
175
|
if ($[22] !== addNewItem || $[23] !== generatedUniqueId || $[24] !== (highlightedItem === null || highlightedItem === void 0 ? void 0 : highlightedItem.id) || $[25] !== selectedItemIds || $[26] !== selectionVariant || $[27] !== setAutocompleteSuggestion || $[28] !== setInputValue) {
|
|
174
|
-
|
|
176
|
+
t7 = addNewItem ? [{
|
|
175
177
|
...addNewItem,
|
|
176
178
|
role: "option",
|
|
177
179
|
key: addNewItem.id,
|
|
@@ -197,52 +199,52 @@ function AutocompleteMenu(props) {
|
|
|
197
199
|
$[26] = selectionVariant;
|
|
198
200
|
$[27] = setAutocompleteSuggestion;
|
|
199
201
|
$[28] = setInputValue;
|
|
200
|
-
$[29] =
|
|
202
|
+
$[29] = t7;
|
|
201
203
|
} else {
|
|
202
|
-
|
|
204
|
+
t7 = $[29];
|
|
203
205
|
}
|
|
204
|
-
let
|
|
205
|
-
if ($[30] !== sortedAndFilteredItemsToRender || $[31] !==
|
|
206
|
-
|
|
206
|
+
let t8;
|
|
207
|
+
if ($[30] !== sortedAndFilteredItemsToRender || $[31] !== t7) {
|
|
208
|
+
t8 = [...sortedAndFilteredItemsToRender, ...t7];
|
|
207
209
|
$[30] = sortedAndFilteredItemsToRender;
|
|
208
|
-
$[31] =
|
|
209
|
-
$[32] =
|
|
210
|
+
$[31] = t7;
|
|
211
|
+
$[32] = t8;
|
|
210
212
|
} else {
|
|
211
|
-
|
|
213
|
+
t8 = $[32];
|
|
212
214
|
}
|
|
213
|
-
const allItemsToRender =
|
|
214
|
-
let
|
|
215
|
+
const allItemsToRender = t8;
|
|
216
|
+
let t9;
|
|
215
217
|
if ($[33] !== allItemsToRender) {
|
|
216
|
-
|
|
218
|
+
t9 = () => {
|
|
217
219
|
allItemsToRenderRef.current = allItemsToRender;
|
|
218
220
|
};
|
|
219
221
|
$[33] = allItemsToRender;
|
|
220
|
-
$[34] =
|
|
222
|
+
$[34] = t9;
|
|
221
223
|
} else {
|
|
222
|
-
|
|
224
|
+
t9 = $[34];
|
|
223
225
|
}
|
|
224
|
-
React.useEffect(
|
|
226
|
+
React.useEffect(t9);
|
|
227
|
+
let t10;
|
|
225
228
|
let t11;
|
|
226
|
-
let t12;
|
|
227
229
|
if ($[35] !== allItemsToRender || $[36] !== emptyStateText) {
|
|
228
|
-
|
|
230
|
+
t10 = () => {
|
|
229
231
|
if (allItemsToRender.length === 0) {
|
|
230
232
|
debounceAnnouncement(emptyStateText);
|
|
231
233
|
}
|
|
232
234
|
};
|
|
233
|
-
|
|
235
|
+
t11 = [allItemsToRender, emptyStateText];
|
|
234
236
|
$[35] = allItemsToRender;
|
|
235
237
|
$[36] = emptyStateText;
|
|
236
|
-
$[37] =
|
|
237
|
-
$[38] =
|
|
238
|
+
$[37] = t10;
|
|
239
|
+
$[38] = t11;
|
|
238
240
|
} else {
|
|
239
|
-
|
|
240
|
-
|
|
241
|
+
t10 = $[37];
|
|
242
|
+
t11 = $[38];
|
|
241
243
|
}
|
|
242
|
-
React.useEffect(
|
|
243
|
-
let
|
|
244
|
+
React.useEffect(t10, t11);
|
|
245
|
+
let t12;
|
|
244
246
|
if ($[39] !== activeDescendantRef || $[40] !== customScrollContainerRef || $[41] !== scrollContainerRef || $[42] !== setIsMenuDirectlyActivated) {
|
|
245
|
-
|
|
247
|
+
t12 = (current, _previous, directlyActivated) => {
|
|
246
248
|
activeDescendantRef.current = current || null;
|
|
247
249
|
if (current) {
|
|
248
250
|
const selectedItem = allItemsToRenderRef.current.find(item_1 => {
|
|
@@ -264,61 +266,61 @@ function AutocompleteMenu(props) {
|
|
|
264
266
|
$[40] = customScrollContainerRef;
|
|
265
267
|
$[41] = scrollContainerRef;
|
|
266
268
|
$[42] = setIsMenuDirectlyActivated;
|
|
267
|
-
$[43] =
|
|
269
|
+
$[43] = t12;
|
|
268
270
|
} else {
|
|
269
|
-
|
|
271
|
+
t12 = $[43];
|
|
270
272
|
}
|
|
271
|
-
let
|
|
272
|
-
if ($[44] !== inputRef || $[45] !==
|
|
273
|
-
|
|
273
|
+
let t13;
|
|
274
|
+
if ($[44] !== inputRef || $[45] !== t12) {
|
|
275
|
+
t13 = {
|
|
274
276
|
containerRef: listContainerRef,
|
|
275
277
|
focusOutBehavior: "wrap",
|
|
276
278
|
focusableElementFilter: _temp4,
|
|
277
279
|
activeDescendantFocus: inputRef,
|
|
278
|
-
onActiveDescendantChanged:
|
|
280
|
+
onActiveDescendantChanged: t12
|
|
279
281
|
};
|
|
280
282
|
$[44] = inputRef;
|
|
281
|
-
$[45] =
|
|
282
|
-
$[46] =
|
|
283
|
+
$[45] = t12;
|
|
284
|
+
$[46] = t13;
|
|
283
285
|
} else {
|
|
284
|
-
|
|
286
|
+
t13 = $[46];
|
|
285
287
|
}
|
|
286
|
-
let
|
|
288
|
+
let t14;
|
|
287
289
|
if ($[47] !== loading) {
|
|
288
|
-
|
|
290
|
+
t14 = [loading];
|
|
289
291
|
$[47] = loading;
|
|
290
|
-
$[48] =
|
|
292
|
+
$[48] = t14;
|
|
291
293
|
} else {
|
|
292
|
-
|
|
294
|
+
t14 = $[48];
|
|
293
295
|
}
|
|
294
|
-
useFocusZone(
|
|
296
|
+
useFocusZone(t13, t14);
|
|
297
|
+
let t15;
|
|
295
298
|
let t16;
|
|
296
|
-
|
|
297
|
-
|
|
298
|
-
t16 = () => {
|
|
299
|
+
if ($[49] !== deferredInputValue || $[50] !== highlightedItem || $[51] !== selectedItemIds || $[52] !== setAutocompleteSuggestion) {
|
|
300
|
+
t15 = () => {
|
|
299
301
|
var _highlightedItem$text;
|
|
300
|
-
if (highlightedItem !== null && highlightedItem !== void 0 && (_highlightedItem$text = highlightedItem.text) !== null && _highlightedItem$text !== void 0 && _highlightedItem$text.startsWith(
|
|
302
|
+
if (highlightedItem !== null && highlightedItem !== void 0 && (_highlightedItem$text = highlightedItem.text) !== null && _highlightedItem$text !== void 0 && _highlightedItem$text.startsWith(deferredInputValue) && !selectedItemIds.includes(highlightedItem.id)) {
|
|
301
303
|
setAutocompleteSuggestion(highlightedItem.text);
|
|
302
304
|
} else {
|
|
303
305
|
setAutocompleteSuggestion("");
|
|
304
306
|
}
|
|
305
307
|
};
|
|
306
|
-
|
|
307
|
-
$[49] =
|
|
308
|
-
$[50] =
|
|
308
|
+
t16 = [highlightedItem, deferredInputValue, selectedItemIds, setAutocompleteSuggestion];
|
|
309
|
+
$[49] = deferredInputValue;
|
|
310
|
+
$[50] = highlightedItem;
|
|
309
311
|
$[51] = selectedItemIds;
|
|
310
312
|
$[52] = setAutocompleteSuggestion;
|
|
311
|
-
$[53] =
|
|
312
|
-
$[54] =
|
|
313
|
+
$[53] = t15;
|
|
314
|
+
$[54] = t16;
|
|
313
315
|
} else {
|
|
314
|
-
|
|
315
|
-
|
|
316
|
+
t15 = $[53];
|
|
317
|
+
t16 = $[54];
|
|
316
318
|
}
|
|
317
|
-
useEffect(
|
|
319
|
+
useEffect(t15, t16);
|
|
320
|
+
let t17;
|
|
318
321
|
let t18;
|
|
319
|
-
let t19;
|
|
320
322
|
if ($[55] !== onOpenChange || $[56] !== selectedItemIds || $[57] !== showMenu || $[58] !== sortOnCloseFn || $[59] !== sortedItemIds) {
|
|
321
|
-
|
|
323
|
+
t17 = () => {
|
|
322
324
|
const itemIdSortResult = [...sortedItemIds].sort(sortOnCloseFn ? sortOnCloseFn : getDefaultSortFn(itemId_0 => isItemSelected(itemId_0, selectedItemIds)));
|
|
323
325
|
const sortResultMatchesState = itemIdSortResult.length === sortedItemIds.length && itemIdSortResult.every((element_0, index) => element_0 === sortedItemIds[index]);
|
|
324
326
|
if (showMenu === false && !sortResultMatchesState) {
|
|
@@ -326,48 +328,48 @@ function AutocompleteMenu(props) {
|
|
|
326
328
|
}
|
|
327
329
|
onOpenChange && onOpenChange(Boolean(showMenu));
|
|
328
330
|
};
|
|
329
|
-
|
|
331
|
+
t18 = [showMenu, onOpenChange, selectedItemIds, sortOnCloseFn, sortedItemIds];
|
|
330
332
|
$[55] = onOpenChange;
|
|
331
333
|
$[56] = selectedItemIds;
|
|
332
334
|
$[57] = showMenu;
|
|
333
335
|
$[58] = sortOnCloseFn;
|
|
334
336
|
$[59] = sortedItemIds;
|
|
335
|
-
$[60] =
|
|
336
|
-
$[61] =
|
|
337
|
+
$[60] = t17;
|
|
338
|
+
$[61] = t18;
|
|
337
339
|
} else {
|
|
338
|
-
|
|
339
|
-
|
|
340
|
+
t17 = $[60];
|
|
341
|
+
t18 = $[61];
|
|
340
342
|
}
|
|
341
|
-
useEffect(
|
|
342
|
-
let
|
|
343
|
+
useEffect(t17, t18);
|
|
344
|
+
let t19;
|
|
343
345
|
if ($[62] !== selectedItemIds.length || $[63] !== setSelectedItemLength) {
|
|
344
|
-
|
|
346
|
+
t19 = () => {
|
|
345
347
|
if (selectedItemIds.length) {
|
|
346
348
|
setSelectedItemLength(selectedItemIds.length);
|
|
347
349
|
}
|
|
348
350
|
};
|
|
349
351
|
$[62] = selectedItemIds.length;
|
|
350
352
|
$[63] = setSelectedItemLength;
|
|
351
|
-
$[64] =
|
|
353
|
+
$[64] = t19;
|
|
352
354
|
} else {
|
|
353
|
-
|
|
355
|
+
t19 = $[64];
|
|
354
356
|
}
|
|
355
|
-
let
|
|
357
|
+
let t20;
|
|
356
358
|
if ($[65] !== selectedItemIds || $[66] !== setSelectedItemLength) {
|
|
357
|
-
|
|
359
|
+
t20 = [selectedItemIds, setSelectedItemLength];
|
|
358
360
|
$[65] = selectedItemIds;
|
|
359
361
|
$[66] = setSelectedItemLength;
|
|
360
|
-
$[67] =
|
|
362
|
+
$[67] = t20;
|
|
361
363
|
} else {
|
|
362
|
-
|
|
364
|
+
t20 = $[67];
|
|
363
365
|
}
|
|
364
|
-
useEffect(
|
|
366
|
+
useEffect(t19, t20);
|
|
365
367
|
if (selectionVariant === "single" && selectedItemIds.length > 1) {
|
|
366
368
|
throw new Error("Autocomplete: selectionVariant \"single\" cannot be used with multiple selected items");
|
|
367
369
|
}
|
|
368
|
-
let
|
|
370
|
+
let t21;
|
|
369
371
|
if ($[68] !== allItemsToRender || $[69] !== ariaLabelledBy || $[70] !== emptyStateText || $[71] !== id || $[72] !== loading || $[73] !== selectionVariant) {
|
|
370
|
-
|
|
372
|
+
t21 = loading ? /*#__PURE__*/jsx("div", {
|
|
371
373
|
className: classes.SpinnerWrapper,
|
|
372
374
|
children: /*#__PURE__*/jsx(Spinner, {})
|
|
373
375
|
}) : /*#__PURE__*/jsx("div", {
|
|
@@ -389,23 +391,23 @@ function AutocompleteMenu(props) {
|
|
|
389
391
|
$[71] = id;
|
|
390
392
|
$[72] = loading;
|
|
391
393
|
$[73] = selectionVariant;
|
|
392
|
-
$[74] =
|
|
394
|
+
$[74] = t21;
|
|
393
395
|
} else {
|
|
394
|
-
|
|
396
|
+
t21 = $[74];
|
|
395
397
|
}
|
|
396
|
-
let
|
|
397
|
-
if ($[75] !== showMenu || $[76] !==
|
|
398
|
-
|
|
398
|
+
let t22;
|
|
399
|
+
if ($[75] !== showMenu || $[76] !== t21) {
|
|
400
|
+
t22 = /*#__PURE__*/jsx(VisuallyHidden, {
|
|
399
401
|
isVisible: showMenu,
|
|
400
|
-
children:
|
|
402
|
+
children: t21
|
|
401
403
|
});
|
|
402
404
|
$[75] = showMenu;
|
|
403
|
-
$[76] =
|
|
404
|
-
$[77] =
|
|
405
|
+
$[76] = t21;
|
|
406
|
+
$[77] = t22;
|
|
405
407
|
} else {
|
|
406
|
-
|
|
408
|
+
t22 = $[77];
|
|
407
409
|
}
|
|
408
|
-
return
|
|
410
|
+
return t22;
|
|
409
411
|
}
|
|
410
412
|
function _temp5(item_2) {
|
|
411
413
|
const {
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
*{box-sizing:border-box}body{margin:0}table{border-collapse:collapse}[data-color-mode=light] input{--csstools-color-scheme--light:initial;color-scheme:light}[data-color-mode=dark] input{--csstools-color-scheme--light: ;color-scheme:dark}@media (prefers-color-scheme:light){[data-color-mode=auto][data-light-theme*=light]{--csstools-color-scheme--light:initial;color-scheme:light}}@media (prefers-color-scheme:dark){[data-color-mode=auto][data-dark-theme*=dark]{--csstools-color-scheme--light: ;color-scheme:dark}}[role=button]:focus:not(:focus-visible):not(.focus-visible),[role=tabpanel][tabindex="0"]:focus:not(:focus-visible):not(.focus-visible),a:focus:not(:focus-visible):not(.focus-visible),button:focus:not(:focus-visible):not(.focus-visible),summary:focus:not(:focus-visible):not(.focus-visible){box-shadow:none;outline:none}[tabindex="0"]:focus:not(:focus-visible):not(.focus-visible),details-dialog:focus:not(:focus-visible):not(.focus-visible){outline:none}.prc-src-BaseStyles-aopSS{color:var(--BaseStyles-fgColor,var(--fgColor-default,var(--color-fg-default)));font-family:var(--BaseStyles-fontFamily,var(--fontStack-system,-apple-system,BlinkMacSystemFont,"Segoe UI","Noto Sans",Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji"));line-height:var(--BaseStyles-lineHeight,1.5)}
|
|
2
|
-
/*# sourceMappingURL=BaseStyles-
|
|
1
|
+
*{box-sizing:border-box}body{margin:0}table{border-collapse:collapse}[data-color-mode=light] input{--csstools-color-scheme--light:initial;color-scheme:light}[data-color-mode=dark] input{--csstools-color-scheme--light: ;color-scheme:dark}@media (prefers-color-scheme:light){[data-color-mode=auto][data-light-theme*=light]{--csstools-color-scheme--light:initial;color-scheme:light}}@media (prefers-color-scheme:dark){[data-color-mode=auto][data-dark-theme*=dark]{--csstools-color-scheme--light: ;color-scheme:dark}}[role=button]:focus:not(:focus-visible):not(.focus-visible),[role=tabpanel][tabindex="0"]:focus:not(:focus-visible):not(.focus-visible),a:focus:not(:focus-visible):not(.focus-visible),button:focus:not(:focus-visible):not(.focus-visible),summary:focus:not(:focus-visible):not(.focus-visible){box-shadow:none;outline:none}[tabindex="0"]:focus:not(:focus-visible):not(.focus-visible),details-dialog:focus:not(:focus-visible):not(.focus-visible){outline:none}.prc-src-BaseStyles-aopSS{color:var(--BaseStyles-fgColor,var(--fgColor-default,var(--color-fg-default)));font-family:var(--BaseStyles-fontFamily,var(--fontStack-system,-apple-system,BlinkMacSystemFont,"Segoe UI","Noto Sans",Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji"));line-height:var(--BaseStyles-lineHeight,1.5)}.prc-src-BaseStyles-aopSS :where(a:not([class*=prc-]):not([class*=PRC-]):not([class*=Primer_Brand__])){color:var(--fgColor-accent,var(--color-accent-fg));-webkit-text-decoration:none;text-decoration:none}:is(.prc-src-BaseStyles-aopSS :where(a:not([class*=prc-]):not([class*=PRC-]):not([class*=Primer_Brand__]))):hover{-webkit-text-decoration:underline;text-decoration:underline}
|
|
2
|
+
/*# sourceMappingURL=BaseStyles-7e59cc50.css.map */
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["src/BaseStyles.module.css.js"],"names":[],"mappings":"AAMA,EACE,qBACF,CAEA,KACE,QACF,CAEA,MAEE,wBACF,CAEA,8BACE,sCAAmB,CAAnB,kBACF,CAEA,6BACE,gCAAkB,CAAlB,iBACF,CAEA,oCACE,gDACE,sCAAmB,CAAnB,kBACF,CACF,CAEA,mCACE,8CACE,gCAAkB,CAAlB,iBACF,CACF,CAEA,mSAME,eAAgB,CADhB,YAEF,CAEA,0HAEE,YACF,CAIA,0BAKE,8EAAwD,CAJxD,wLAAkE,CAElE,4CAoBF,CARE,uGACE,kDAAoD,CACpD,4BAAqB,CAArB,oBAKF,CAHE,kHACE,iCAA0B,CAA1B,yBACF","file":"BaseStyles-7e59cc50.css","sourcesContent":["/* stylelint-disable selector-max-specificity */\n/* stylelint-disable selector-type-no-unknown */\n\n/* -------------------------------- \n * Global Styles \n *--------------------------------- */\n* {\n box-sizing: border-box;\n}\n\nbody {\n margin: 0;\n}\n\ntable {\n /* stylelint-disable-next-line primer/borders */\n border-collapse: collapse;\n}\n\n[data-color-mode='light'] input {\n color-scheme: light;\n}\n\n[data-color-mode='dark'] input {\n color-scheme: dark;\n}\n\n@media (prefers-color-scheme: light) {\n [data-color-mode='auto'][data-light-theme*='light'] {\n color-scheme: light;\n }\n}\n\n@media (prefers-color-scheme: dark) {\n [data-color-mode='auto'][data-dark-theme*='dark'] {\n color-scheme: dark;\n }\n}\n\n[role='button']:focus:not(:focus-visible):not(:global(.focus-visible)),\n[role='tabpanel'][tabindex='0']:focus:not(:focus-visible):not(:global(.focus-visible)),\nbutton:focus:not(:focus-visible):not(:global(.focus-visible)),\nsummary:focus:not(:focus-visible):not(:global(.focus-visible)),\na:focus:not(:focus-visible):not(:global(.focus-visible)) {\n outline: none;\n box-shadow: none;\n}\n\n[tabindex='0']:focus:not(:focus-visible):not(:global(.focus-visible)),\ndetails-dialog:focus:not(:focus-visible):not(:global(.focus-visible)) {\n outline: none;\n}\n\n/* -------------------------------------------------------------------------- */\n\n.BaseStyles {\n font-family: var(--BaseStyles-fontFamily, var(--fontStack-system));\n /* stylelint-disable-next-line primer/typography */\n line-height: var(--BaseStyles-lineHeight, 1.5);\n /* stylelint-disable-next-line primer/colors */\n color: var(--BaseStyles-fgColor, var(--fgColor-default));\n\n /*\n * PERFORMANCE: Removed :has([data-color-mode]) selectors that scanned entire DOM.\n * Input color-scheme is already handled by global selectors above:\n * [data-color-mode='light'] input { color-scheme: light; }\n * [data-color-mode='dark'] input { color-scheme: dark; }\n */\n\n /* Low-specificity default link styling */\n :where(a:not([class*='prc-']):not([class*='PRC-']):not([class*='Primer_Brand__'])) {\n color: var(--fgColor-accent, var(--color-accent-fg));\n text-decoration: none;\n\n &:hover {\n text-decoration: underline;\n }\n }\n}\n"]}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
@property --prc-dialog-scrollgutter{initial-value:0;inherits:false;syntax:"<length>"}@keyframes prc-Dialog-dialog-backdrop-appear-tCG2K{0%{opacity:0}to{opacity:1}}@keyframes prc-Dialog-Overlay--motion-scaleFade-mE6-C{0%{opacity:0;transform:scale(.5)}to{opacity:1;transform:scale(1)}}@keyframes prc-Dialog-Overlay--motion-slideUp-tPElO{0%{transform:translateY(100%)}}@keyframes prc-Dialog-Overlay--motion-slideInRight-BR-CZ{0%{transform:translateX(-100%)}}@keyframes prc-Dialog-Overlay--motion-slideInLeft-ISmQZ{0%{transform:translateX(100%)}}@keyframes prc-Dialog-detect-scroll-b3i8Q{0%,to{--can-scroll:1}}.prc-Dialog-Backdrop-5Nt2U{animation:prc-Dialog-dialog-backdrop-appear-tCG2K .2s cubic-bezier(.33,1,.68,1);background-color:var(--overlay-backdrop-bgColor,var(--color-overlay-backdrop));bottom:0;display:flex;left:0;position:fixed;right:0;top:0}.prc-Dialog-Backdrop-5Nt2U,.prc-Dialog-Backdrop-5Nt2U[data-position-regular=center]{align-items:center;justify-content:center}.prc-Dialog-Backdrop-5Nt2U[data-position-regular=left]{align-items:center;justify-content:flex-start}.prc-Dialog-Backdrop-5Nt2U[data-position-regular=right]{align-items:center;justify-content:flex-end}@media (max-width:767px){.prc-Dialog-Backdrop-5Nt2U[data-position-narrow=center]{align-items:center;justify-content:center}.prc-Dialog-Backdrop-5Nt2U[data-position-narrow=bottom]{align-items:end;justify-content:center}}.prc-Dialog-Dialog-G8cDF{background-color:var(--overlay-bgColor,var(--color-canvas-overlay));border-radius:var(--borderRadius-large,.75rem);border-radius:var(--borderRadius-large,var(--borderRadius-large,.75rem));box-shadow:var(--shadow-floating-small,var(--color-overlay-shadow));display:flex;flex-direction:column;height:auto;max-height:calc(100dvh - 64px);max-width:calc(100dvw - 64px);min-width:296px;opacity:1;width:640px}.prc-Dialog-Dialog-G8cDF:where([data-width=small]){width:296px}.prc-Dialog-Dialog-G8cDF:where([data-width=medium]){width:320px}.prc-Dialog-Dialog-G8cDF:where([data-width=large]){width:480px}.prc-Dialog-Dialog-G8cDF:where([data-height=small]){height:480px}.prc-Dialog-Dialog-G8cDF:where([data-height=large]){height:640px}@media screen and (prefers-reduced-motion:no-preference){.prc-Dialog-Dialog-G8cDF{animation:prc-Dialog-Overlay--motion-scaleFade-mE6-C .2s cubic-bezier(.33,1,.68,1) 1ms 1 normal none running}}.prc-Dialog-Dialog-G8cDF[data-position-regular=center]{border-radius:var(--borderRadius-large,var(--borderRadius-large,.75rem))}@media screen and (prefers-reduced-motion:no-preference){.prc-Dialog-Dialog-G8cDF[data-position-regular=center]{animation:prc-Dialog-Overlay--motion-scaleFade-mE6-C .2s cubic-bezier(.33,1,.68,1) 1ms 1 normal none running}}.prc-Dialog-Dialog-G8cDF[data-position-regular=left]{border-radius:var(--borderRadius-large,var(--borderRadius-large,.75rem));border-bottom-left-radius:0;border-top-left-radius:0;height:100dvh;max-height:unset}@media screen and (prefers-reduced-motion:no-preference){.prc-Dialog-Dialog-G8cDF[data-position-regular=left]{animation:prc-Dialog-Overlay--motion-slideInRight-BR-CZ .25s cubic-bezier(.33,1,.68,1) 1ms 1 normal none running}}.prc-Dialog-Dialog-G8cDF[data-position-regular=right]{border-radius:var(--borderRadius-large,var(--borderRadius-large,.75rem));border-bottom-right-radius:0;border-top-right-radius:0;height:100dvh;max-height:unset}@media screen and (prefers-reduced-motion:no-preference){.prc-Dialog-Dialog-G8cDF[data-position-regular=right]{animation:prc-Dialog-Overlay--motion-slideInLeft-ISmQZ .25s cubic-bezier(.33,1,.68,1) 0s 1 normal none running}}@media (max-width:767px){.prc-Dialog-Dialog-G8cDF[data-position-narrow=center]{border-radius:var(--borderRadius-large,var(--borderRadius-large,.75rem));height:auto;width:640px}.prc-Dialog-Dialog-G8cDF[data-position-narrow=center]:where([data-width=small]){width:296px}.prc-Dialog-Dialog-G8cDF[data-position-narrow=center]:where([data-width=medium]){width:320px}.prc-Dialog-Dialog-G8cDF[data-position-narrow=center]:where([data-width=large]){width:480px}.prc-Dialog-Dialog-G8cDF[data-position-narrow=center]:where([data-height=small]){height:480px}.prc-Dialog-Dialog-G8cDF[data-position-narrow=center]:where([data-height=large]){height:640px}.prc-Dialog-Dialog-G8cDF[data-position-narrow=bottom]{border-radius:var(--borderRadius-large,var(--borderRadius-large,.75rem));border-bottom-left-radius:0;border-bottom-right-radius:0;height:auto;max-height:calc(100dvh - 64px);max-width:100dvw;width:100dvw}@media screen and (prefers-reduced-motion:no-preference){.prc-Dialog-Dialog-G8cDF[data-position-narrow=bottom]{animation:prc-Dialog-Overlay--motion-slideUp-tPElO .25s cubic-bezier(.33,1,.68,1) 1ms 1 normal none running}}.prc-Dialog-Dialog-G8cDF[data-position-narrow=fullscreen]{border-radius:unset!important;flex-grow:1;height:100%;max-height:100dvh;max-width:100dvw;width:100%}@media screen and (prefers-reduced-motion:no-preference){.prc-Dialog-Dialog-G8cDF[data-position-narrow=fullscreen]{animation:prc-Dialog-Overlay--motion-scaleFade-mE6-C .2s cubic-bezier(.33,1,.68,1) 1ms 1 normal none running}}}body:has(.prc-Dialog-Dialog-G8cDF.prc-Dialog-DisableScroll-UkWFM){overflow:hidden!important;padding-right:var(--prc-dialog-scrollgutter)!important}.prc-Dialog-DialogOverflowWrapper-JvHzz{flex-grow:1}.prc-Dialog-Dialog-G8cDF:has(.prc-Dialog-Footer-PMeQk){--can-scroll:0}.prc-Dialog-Dialog-G8cDF:has(.prc-Dialog-Footer-PMeQk) .prc-Dialog-DialogOverflowWrapper-JvHzz{animation:prc-Dialog-detect-scroll-b3i8Q;border-bottom:var(--borderWidth-default,.0625rem) solid var(--borderColor-default,var(--color-border-default));animation-timeline:scroll(self)}@supports (animation-timeline:scroll(self)){.prc-Dialog-Dialog-G8cDF:has(.prc-Dialog-Footer-PMeQk) .prc-Dialog-DialogOverflowWrapper-JvHzz{border-bottom:calc(var(--borderWidth-thin,.0625rem)*var(--can-scroll)) solid var(--borderColor-default,var(--color-border-default))}}.prc-Dialog-Header-f7Me-{box-shadow:0 1px 0 var(--borderColor-default,var(--color-border-default));flex-shrink:0;max-height:35vh;overflow-y:auto;padding:var(--base-size-8,.5rem);z-index:1}.prc-Dialog-HeaderInner-H-fFY{display:flex}.prc-Dialog-HeaderContent-mjAsn{display:flex;flex-direction:column;flex-grow:1;padding-block:var(--base-size-6,.375rem);padding-inline:var(--base-size-8,.5rem)}.prc-Dialog-Title-M-iPn{font-size:var(--text-body-size-medium,.875rem);font-weight:var(--text-title-weight-large,600);margin:0}.prc-Dialog-Subtitle-aBFSq{color:var(--fgColor-muted,var(--color-fg-muted));font-size:var(--text-body-size-small,.75rem);font-weight:var(--base-text-weight-normal,400);margin:0;margin-top:var(--base-size-4,.25rem)}.prc-Dialog-Body-bB903{flex-grow:1;overflow:auto}.prc-Dialog-Body-bB903,.prc-Dialog-Footer-PMeQk{padding:var(--base-size-16,1rem)}.prc-Dialog-Footer-PMeQk{display:flex;flex-flow:wrap;flex-shrink:0;gap:var(--base-size-8,.5rem);justify-content:flex-end;z-index:1}@media (max-height:325px){.prc-Dialog-Footer-PMeQk{flex-direction:row;flex-wrap:nowrap;justify-content:unset;overflow-x:scroll}}
|
|
2
|
-
/*# sourceMappingURL=Dialog-
|
|
1
|
+
@property --prc-dialog-scrollgutter{initial-value:0;inherits:false;syntax:"<length>"}@keyframes prc-Dialog-dialog-backdrop-appear-tCG2K{0%{opacity:0}to{opacity:1}}@keyframes prc-Dialog-Overlay--motion-scaleFade-mE6-C{0%{opacity:0;transform:scale(.5)}to{opacity:1;transform:scale(1)}}@keyframes prc-Dialog-Overlay--motion-slideUp-tPElO{0%{transform:translateY(100%)}}@keyframes prc-Dialog-Overlay--motion-slideInRight-BR-CZ{0%{transform:translateX(-100%)}}@keyframes prc-Dialog-Overlay--motion-slideInLeft-ISmQZ{0%{transform:translateX(100%)}}@keyframes prc-Dialog-detect-scroll-b3i8Q{0%,to{--can-scroll:1}}.prc-Dialog-Backdrop-5Nt2U{animation:prc-Dialog-dialog-backdrop-appear-tCG2K .2s cubic-bezier(.33,1,.68,1);background-color:var(--overlay-backdrop-bgColor,var(--color-overlay-backdrop));bottom:0;display:flex;left:0;position:fixed;right:0;top:0}.prc-Dialog-Backdrop-5Nt2U,.prc-Dialog-Backdrop-5Nt2U[data-position-regular=center]{align-items:center;justify-content:center}.prc-Dialog-Backdrop-5Nt2U[data-position-regular=left]{align-items:center;justify-content:flex-start}.prc-Dialog-Backdrop-5Nt2U[data-position-regular=right]{align-items:center;justify-content:flex-end}@media (max-width:767px){.prc-Dialog-Backdrop-5Nt2U[data-position-narrow=center]{align-items:center;justify-content:center}.prc-Dialog-Backdrop-5Nt2U[data-position-narrow=bottom]{align-items:end;justify-content:center}}.prc-Dialog-Dialog-G8cDF{background-color:var(--overlay-bgColor,var(--color-canvas-overlay));border-radius:var(--borderRadius-large,.75rem);border-radius:var(--borderRadius-large,var(--borderRadius-large,.75rem));box-shadow:var(--shadow-floating-small,var(--color-overlay-shadow));display:flex;flex-direction:column;height:auto;max-height:calc(100dvh - 64px);max-width:calc(100dvw - 64px);min-width:296px;opacity:1;width:640px}.prc-Dialog-Dialog-G8cDF:where([data-width=small]){width:296px}.prc-Dialog-Dialog-G8cDF:where([data-width=medium]){width:320px}.prc-Dialog-Dialog-G8cDF:where([data-width=large]){width:480px}.prc-Dialog-Dialog-G8cDF:where([data-height=small]){height:480px}.prc-Dialog-Dialog-G8cDF:where([data-height=large]){height:640px}@media screen and (prefers-reduced-motion:no-preference){.prc-Dialog-Dialog-G8cDF{animation:prc-Dialog-Overlay--motion-scaleFade-mE6-C .2s cubic-bezier(.33,1,.68,1) 1ms 1 normal none running}}.prc-Dialog-Dialog-G8cDF[data-position-regular=center]{border-radius:var(--borderRadius-large,var(--borderRadius-large,.75rem))}@media screen and (prefers-reduced-motion:no-preference){.prc-Dialog-Dialog-G8cDF[data-position-regular=center]{animation:prc-Dialog-Overlay--motion-scaleFade-mE6-C .2s cubic-bezier(.33,1,.68,1) 1ms 1 normal none running}}.prc-Dialog-Dialog-G8cDF[data-position-regular=left]{border-radius:var(--borderRadius-large,var(--borderRadius-large,.75rem));border-bottom-left-radius:0;border-top-left-radius:0;height:100dvh;max-height:unset}@media screen and (prefers-reduced-motion:no-preference){.prc-Dialog-Dialog-G8cDF[data-position-regular=left]{animation:prc-Dialog-Overlay--motion-slideInRight-BR-CZ .25s cubic-bezier(.33,1,.68,1) 1ms 1 normal none running}}.prc-Dialog-Dialog-G8cDF[data-position-regular=right]{border-radius:var(--borderRadius-large,var(--borderRadius-large,.75rem));border-bottom-right-radius:0;border-top-right-radius:0;height:100dvh;max-height:unset}@media screen and (prefers-reduced-motion:no-preference){.prc-Dialog-Dialog-G8cDF[data-position-regular=right]{animation:prc-Dialog-Overlay--motion-slideInLeft-ISmQZ .25s cubic-bezier(.33,1,.68,1) 0s 1 normal none running}}@media (max-width:767px){.prc-Dialog-Dialog-G8cDF[data-position-narrow=center]{border-radius:var(--borderRadius-large,var(--borderRadius-large,.75rem));height:auto;width:640px}.prc-Dialog-Dialog-G8cDF[data-position-narrow=center]:where([data-width=small]){width:296px}.prc-Dialog-Dialog-G8cDF[data-position-narrow=center]:where([data-width=medium]){width:320px}.prc-Dialog-Dialog-G8cDF[data-position-narrow=center]:where([data-width=large]){width:480px}.prc-Dialog-Dialog-G8cDF[data-position-narrow=center]:where([data-height=small]){height:480px}.prc-Dialog-Dialog-G8cDF[data-position-narrow=center]:where([data-height=large]){height:640px}.prc-Dialog-Dialog-G8cDF[data-position-narrow=bottom]{border-radius:var(--borderRadius-large,var(--borderRadius-large,.75rem));border-bottom-left-radius:0;border-bottom-right-radius:0;height:auto;max-height:calc(100dvh - 64px);max-width:100dvw;width:100dvw}@media screen and (prefers-reduced-motion:no-preference){.prc-Dialog-Dialog-G8cDF[data-position-narrow=bottom]{animation:prc-Dialog-Overlay--motion-slideUp-tPElO .25s cubic-bezier(.33,1,.68,1) 1ms 1 normal none running}}.prc-Dialog-Dialog-G8cDF[data-position-narrow=fullscreen]{border-radius:unset!important;flex-grow:1;height:100%;max-height:100dvh;max-width:100dvw;width:100%}@media screen and (prefers-reduced-motion:no-preference){.prc-Dialog-Dialog-G8cDF[data-position-narrow=fullscreen]{animation:prc-Dialog-Overlay--motion-scaleFade-mE6-C .2s cubic-bezier(.33,1,.68,1) 1ms 1 normal none running}}}body:not([data-dialog-scroll-optimized]):has(.prc-Dialog-Dialog-G8cDF.prc-Dialog-DisableScroll-UkWFM){overflow:hidden!important;padding-right:var(--prc-dialog-scrollgutter)!important}body[data-dialog-scroll-disabled]{overflow:hidden!important;padding-right:var(--prc-dialog-scrollgutter)!important}.prc-Dialog-DialogOverflowWrapper-JvHzz{flex-grow:1}.prc-Dialog-Dialog-G8cDF:has(.prc-Dialog-Footer-PMeQk){--can-scroll:0}.prc-Dialog-Dialog-G8cDF:has(.prc-Dialog-Footer-PMeQk) .prc-Dialog-DialogOverflowWrapper-JvHzz{animation:prc-Dialog-detect-scroll-b3i8Q;border-bottom:var(--borderWidth-default,.0625rem) solid var(--borderColor-default,var(--color-border-default));animation-timeline:scroll(self)}@supports (animation-timeline:scroll(self)){.prc-Dialog-Dialog-G8cDF:has(.prc-Dialog-Footer-PMeQk) .prc-Dialog-DialogOverflowWrapper-JvHzz{border-bottom:calc(var(--borderWidth-thin,.0625rem)*var(--can-scroll)) solid var(--borderColor-default,var(--color-border-default))}}.prc-Dialog-Header-f7Me-{box-shadow:0 1px 0 var(--borderColor-default,var(--color-border-default));flex-shrink:0;max-height:35vh;overflow-y:auto;padding:var(--base-size-8,.5rem);z-index:1}.prc-Dialog-HeaderInner-H-fFY{display:flex}.prc-Dialog-HeaderContent-mjAsn{display:flex;flex-direction:column;flex-grow:1;padding-block:var(--base-size-6,.375rem);padding-inline:var(--base-size-8,.5rem)}.prc-Dialog-Title-M-iPn{font-size:var(--text-body-size-medium,.875rem);font-weight:var(--text-title-weight-large,600);margin:0}.prc-Dialog-Subtitle-aBFSq{color:var(--fgColor-muted,var(--color-fg-muted));font-size:var(--text-body-size-small,.75rem);font-weight:var(--base-text-weight-normal,400);margin:0;margin-top:var(--base-size-4,.25rem)}.prc-Dialog-Body-bB903{flex-grow:1;overflow:auto}.prc-Dialog-Body-bB903,.prc-Dialog-Footer-PMeQk{padding:var(--base-size-16,1rem)}.prc-Dialog-Footer-PMeQk{display:flex;flex-flow:wrap;flex-shrink:0;gap:var(--base-size-8,.5rem);justify-content:flex-end;z-index:1}@media (max-height:325px){.prc-Dialog-Footer-PMeQk{flex-direction:row;flex-wrap:nowrap;justify-content:unset;overflow-x:scroll}}
|
|
2
|
+
/*# sourceMappingURL=Dialog-92b5e3b7.css.map */
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/Dialog/Dialog.module.css.js"],"names":[],"mappings":"AAOA,oCACE,eAAgB,CAChB,cAAe,CACf,iBACF,CAEA,mDACE,GACE,SACF,CAEA,GACE,SACF,CACF,CAEA,sDACE,GACE,SAAU,CACV,mBACF,CAEA,GACE,SAAU,CACV,kBACF,CACF,CAEA,oDACE,GACE,0BACF,CACF,CAEA,yDACE,GACE,2BACF,CACF,CAEA,wDACE,GACE,0BACF,CACF,CAGA,0CACE,MAEE,cACF,CACF,CAEA,2BAQE,+EAAsE,CADtE,8EAAiD,CAHjD,QAAS,CAET,YAAa,CADb,MAAO,CAJP,cAAe,CAEf,OAAQ,CADR,KAoCF,CA1BE,oFAHA,kBAAmB,CACnB,sBAKA,CAEA,uDACE,kBAAmB,CACnB,0BACF,CAEA,wDACE,kBAAmB,CACnB,wBACF,CAEA,yBACE,wDACE,kBAAmB,CACnB,sBACF,CAEA,wDACE,eAAgB,CAChB,sBACF,CACF,CAGF,yBASE,mEAAwC,CACxC,8CAAwC,CACxC,wEAAmE,CACnE,mEAAwC,CAXxC,YAAa,CAOb,qBAAsB,CAFtB,WAAY,CACZ,8BAA+B,CAF/B,6BAA8B,CAD9B,eAAgB,CAShB,SAAU,CAVV,WA6HF,CAjHE,mDACE,WACF,CAEA,oDACE,WACF,CAEA,mDAEE,WACF,CAEA,oDACE,YACF,CAEA,oDACE,YACF,CAEA,yDApCF,yBAqCI,4GA2FJ,CA1FE,CAEA,uDACE,wEAKF,CAHE,yDAHF,uDAII,4GAEJ,CADE,CAGF,qDAGE,wEAAmE,CAEnE,2BAA4B,CAD5B,wBAAyB,CAHzB,aAAc,CACd,gBAQF,CAHE,yDAPF,qDAQI,gHAEJ,CADE,CAGF,sDAGE,wEAAmE,CAEnE,4BAA6B,CAD7B,yBAA0B,CAH1B,aAAc,CACd,gBAQF,CAHE,yDAPF,sDAQI,8GAEJ,CADE,CAGF,yBACE,sDAIE,wEAAmE,CADnE,WAAY,CADZ,WAwBF,CApBE,gFACE,WACF,CAEA,iFACE,WACF,CAEA,gFAEE,WACF,CAEA,iFACE,YACF,CAEA,iFACE,YACF,CAGF,sDAKE,wEAAmE,CAEnE,2BAA4B,CAD5B,4BAA6B,CAH7B,WAAY,CACZ,8BAA+B,CAF/B,gBAAiB,CADjB,YAWF,CAHE,yDATF,sDAUI,2GAEJ,CADE,CAGF,0DAKE,6BAA+B,CAC/B,WAAY,CAHZ,WAAY,CACZ,iBAAkB,CAFlB,gBAAiB,CADjB,UAUF,CAHE,yDARF,0DASI,4GAEJ,CADE,CAEJ,CAcF,sGAGE,yBAA2B,CAD3B,sDAEF,CAOA,kCAGE,yBAA2B,CAD3B,sDAEF,CAEA,wCACE,WACF,CAQA,uDACE,cAYF,CAVE,+FAGE,wCAAwB,CADxB,8GAA0E,CAE1E,+BAKF,CAHE,4CANF,+FAOI,mIAEJ,CADE,CAIJ,yBAME,yEAA8C,CAC9C,aAAc,CALd,eAAgB,CAEhB,eAAgB,CADhB,gCAA2B,CAF3B,SAOF,CAEA,8BACE,YACF,CAEA,gCACE,YAAa,CAGb,qBAAsB,CACtB,WAAY,CAFZ,wCAAiC,CADjC,uCAIF,CAEA,wBAEE,8CAAuC,CACvC,8CAA2C,CAF3C,QAGF,CAEA,2BAKE,gDAA2B,CAF3B,4CAAsC,CACtC,8CAA2C,CAH3C,QAAS,CACT,oCAIF,CAEA,uBAGE,WAAY,CADZ,aAEF,CAEA,gDALE,gCAoBF,CAfA,yBAEE,YAAa,CACb,cAAe,CAIf,aAAc,CADd,4BAAuB,CAFvB,wBAAyB,CAHzB,SAcF,CANE,0BATF,yBAYI,kBAAmB,CAFnB,gBAAiB,CAGjB,qBAAsB,CAFtB,iBAIJ,CADE","file":"Dialog-92b5e3b7.css","sourcesContent":["/* The --prc-dialog-scrollgutter property is used only on the body element to\n * simulate scrollbar-gutter:stable. This property is not and should not\n * be used elsewhere in the DOM. There is a performance penalty to\n * setting inherited properties which can cause a large style recalc to\n * occur, so it benefits us to prevent inheritance for this property.\n * See https://web.dev/blog/at-property-performance\n */\n@property --prc-dialog-scrollgutter {\n initial-value: 0;\n inherits: false;\n syntax: '<length>';\n}\n\n@keyframes dialog-backdrop-appear {\n 0% {\n opacity: 0;\n }\n\n 100% {\n opacity: 1;\n }\n}\n\n@keyframes Overlay--motion-scaleFade {\n 0% {\n opacity: 0;\n transform: scale(0.5);\n }\n\n 100% {\n opacity: 1;\n transform: scale(1);\n }\n}\n\n@keyframes Overlay--motion-slideUp {\n from {\n transform: translateY(100%);\n }\n}\n\n@keyframes Overlay--motion-slideInRight {\n from {\n transform: translateX(-100%);\n }\n}\n\n@keyframes Overlay--motion-slideInLeft {\n from {\n transform: translateX(100%);\n }\n}\n\n/* Used to determine whether there should be a border between the body and footer */\n@keyframes detect-scroll {\n from,\n to {\n --can-scroll: 1;\n }\n}\n\n.Backdrop {\n position: fixed;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n display: flex;\n background-color: var(--overlay-backdrop-bgColor);\n animation: dialog-backdrop-appear 200ms cubic-bezier(0.33, 1, 0.68, 1);\n align-items: center;\n justify-content: center;\n\n &[data-position-regular='center'] {\n align-items: center;\n justify-content: center;\n }\n\n &[data-position-regular='left'] {\n align-items: center;\n justify-content: flex-start;\n }\n\n &[data-position-regular='right'] {\n align-items: center;\n justify-content: flex-end;\n }\n\n @media (max-width: 767px) {\n &[data-position-narrow='center'] {\n align-items: center;\n justify-content: center;\n }\n\n &[data-position-narrow='bottom'] {\n align-items: end;\n justify-content: center;\n }\n }\n}\n\n.Dialog {\n display: flex;\n /* stylelint-disable-next-line primer/responsive-widths */\n width: 640px;\n min-width: 296px;\n max-width: calc(100dvw - 64px);\n height: auto;\n max-height: calc(100dvh - 64px);\n flex-direction: column;\n background-color: var(--overlay-bgColor);\n border-radius: var(--borderRadius-large);\n border-radius: var(--borderRadius-large, var(--borderRadius-large));\n box-shadow: var(--shadow-floating-small);\n opacity: 1;\n\n &:where([data-width='small']) {\n width: 296px;\n }\n\n &:where([data-width='medium']) {\n width: 320px;\n }\n\n &:where([data-width='large']) {\n /* stylelint-disable-next-line primer/responsive-widths */\n width: 480px;\n }\n\n &:where([data-height='small']) {\n height: 480px;\n }\n\n &:where([data-height='large']) {\n height: 640px;\n }\n\n @media screen and (prefers-reduced-motion: no-preference) {\n animation: Overlay--motion-scaleFade 0.2s cubic-bezier(0.33, 1, 0.68, 1) 1ms 1 normal none running;\n }\n\n &[data-position-regular='center'] {\n border-radius: var(--borderRadius-large, var(--borderRadius-large));\n\n @media screen and (prefers-reduced-motion: no-preference) {\n animation: Overlay--motion-scaleFade 0.2s cubic-bezier(0.33, 1, 0.68, 1) 1ms 1 normal none running;\n }\n }\n\n &[data-position-regular='left'] {\n height: 100dvh;\n max-height: unset;\n border-radius: var(--borderRadius-large, var(--borderRadius-large));\n border-top-left-radius: 0;\n border-bottom-left-radius: 0;\n\n @media screen and (prefers-reduced-motion: no-preference) {\n animation: Overlay--motion-slideInRight 0.25s cubic-bezier(0.33, 1, 0.68, 1) 1ms 1 normal none running;\n }\n }\n\n &[data-position-regular='right'] {\n height: 100dvh;\n max-height: unset;\n border-radius: var(--borderRadius-large, var(--borderRadius-large));\n border-top-right-radius: 0;\n border-bottom-right-radius: 0;\n\n @media screen and (prefers-reduced-motion: no-preference) {\n animation: Overlay--motion-slideInLeft 0.25s cubic-bezier(0.33, 1, 0.68, 1) 0s 1 normal none running;\n }\n }\n\n @media (max-width: 767px) {\n &[data-position-narrow='center'] {\n /* stylelint-disable-next-line primer/responsive-widths */\n width: 640px;\n height: auto;\n border-radius: var(--borderRadius-large, var(--borderRadius-large));\n\n &:where([data-width='small']) {\n width: 296px;\n }\n\n &:where([data-width='medium']) {\n width: 320px;\n }\n\n &:where([data-width='large']) {\n /* stylelint-disable-next-line primer/responsive-widths */\n width: 480px;\n }\n\n &:where([data-height='small']) {\n height: 480px;\n }\n\n &:where([data-height='large']) {\n height: 640px;\n }\n }\n\n &[data-position-narrow='bottom'] {\n width: 100dvw;\n max-width: 100dvw;\n height: auto;\n max-height: calc(100dvh - 64px);\n border-radius: var(--borderRadius-large, var(--borderRadius-large));\n border-bottom-right-radius: 0;\n border-bottom-left-radius: 0;\n\n @media screen and (prefers-reduced-motion: no-preference) {\n animation: Overlay--motion-slideUp 0.25s cubic-bezier(0.33, 1, 0.68, 1) 1ms 1 normal none running;\n }\n }\n\n &[data-position-narrow='fullscreen'] {\n width: 100%;\n max-width: 100dvw;\n height: 100%;\n max-height: 100dvh;\n border-radius: unset !important;\n flex-grow: 1;\n\n @media screen and (prefers-reduced-motion: no-preference) {\n animation: Overlay--motion-scaleFade 0.2s cubic-bezier(0.33, 1, 0.68, 1) 1ms 1 normal none running;\n }\n }\n }\n}\n\n/* DisableScroll class is added to Dialog when scroll should be disabled on body */\n.DisableScroll {\n /* This class is used as a selector target for the legacy :has() CSS selector */\n}\n\n/*\n * LEGACY: Scoped :has() selector with negation guard\n * Only evaluates when data-dialog-scroll-optimized is NOT present on body.\n * When the attribute IS present (flag ON), browser skips :has() evaluation\n * because the :not() check fails first (O(1) attribute lookup).\n */\nbody:not([data-dialog-scroll-optimized]):has(.Dialog.DisableScroll) {\n /* stylelint-disable-next-line primer/spacing */\n padding-right: var(--prc-dialog-scrollgutter) !important;\n overflow: hidden !important;\n}\n\n/*\n * PERFORMANCE OPTIMIZATION: Direct attribute on body - O(1) lookup\n * Active when primer_react_css_has_selector_perf flag is ON\n */\n/* stylelint-disable-next-line selector-no-qualifying-type */\nbody[data-dialog-scroll-disabled] {\n /* stylelint-disable-next-line primer/spacing */\n padding-right: var(--prc-dialog-scrollgutter) !important;\n overflow: hidden !important;\n}\n\n.DialogOverflowWrapper {\n flex-grow: 1;\n}\n\n/*\nAdd a border between the body and footer if:\n- the dialog has a footer\n- the dialog has a body that can scroll\n- the browser supports the `animation-timeline` property and its `scroll()` function\n*/\n.Dialog:has(.Footer) {\n --can-scroll: 0;\n\n .DialogOverflowWrapper {\n /* If the browser does not support the `animation-timeline` property, always show a border */\n border-bottom: var(--borderWidth-default) solid var(--borderColor-default);\n animation: detect-scroll;\n animation-timeline: scroll(self);\n\n @supports (animation-timeline: scroll(self)) {\n border-bottom: calc(var(--borderWidth-thin) * var(--can-scroll)) solid var(--borderColor-default);\n }\n }\n}\n\n.Header {\n z-index: 1;\n max-height: 35vh;\n padding: var(--base-size-8);\n overflow-y: auto;\n /* stylelint-disable-next-line primer/box-shadow */\n box-shadow: 0 1px 0 var(--borderColor-default);\n flex-shrink: 0;\n}\n\n.HeaderInner {\n display: flex;\n}\n\n.HeaderContent {\n display: flex;\n padding-inline: var(--base-size-8);\n padding-block: var(--base-size-6);\n flex-direction: column;\n flex-grow: 1;\n}\n\n.Title {\n margin: 0; /* override default margin */\n font-size: var(--text-body-size-medium);\n font-weight: var(--text-title-weight-large);\n}\n\n.Subtitle {\n margin: 0; /* override default margin */\n margin-top: var(--base-size-4);\n font-size: var(--text-body-size-small);\n font-weight: var(--base-text-weight-normal);\n color: var(--fgColor-muted);\n}\n\n.Body {\n padding: var(--base-size-16);\n overflow: auto;\n flex-grow: 1;\n}\n\n.Footer {\n z-index: 1;\n display: flex;\n flex-flow: wrap;\n justify-content: flex-end;\n padding: var(--base-size-16);\n gap: var(--base-size-8);\n flex-shrink: 0;\n\n @media (max-height: 325px) {\n flex-wrap: nowrap;\n overflow-x: scroll;\n flex-direction: row;\n justify-content: unset;\n }\n}\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Dialog.d.ts","sourceRoot":"","sources":["../../src/Dialog/Dialog.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAsE,MAAM,OAAO,CAAA;AAC1F,OAAO,KAAK,EAAC,WAAW,EAAC,MAAM,WAAW,CAAA;AAW1C,OAAO,KAAK,EAAC,eAAe,EAAC,MAAM,6BAA6B,CAAA;AAChE,OAAO,KAAK,EAAC,mBAAmB,IAAI,8BAA8B,EAAC,MAAM,sBAAsB,CAAA;AAQ/F;;;GAGG;AACH,MAAM,MAAM,iBAAiB,GAAG,IAAI,CAAC,WAAW,EAAE,SAAS,CAAC,GAAG;IAC7D;;OAEG;IACH,UAAU,CAAC,EAAE,SAAS,GAAG,SAAS,GAAG,QAAQ,GAAG,QAAQ,CAAA;IAExD;;OAEG;IACH,OAAO,EAAE,KAAK,CAAC,SAAS,CAAA;IAExB;;;OAGG;IACH,SAAS,CAAC,EAAE,OAAO,CAAA;IAEnB;;;OAGG;IACH,GAAG,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,iBAAiB,GAAG,IAAI,CAAC,CAAA;CAChD,CAAA;AAED;;GAEG;AACH,MAAM,WAAW,WAAW;IAC1B;;OAEG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAEvB;;;;OAIG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAE1B;;;;;;OAMG;IACH,YAAY,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC,KAAK,CAAC,iBAAiB,CAAC,iBAAiB,CAAC,CAAC,CAAA;IAElF;;;;;;OAMG;IACH,UAAU,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC,KAAK,CAAC,iBAAiB,CAAC,WAAW,CAAC,CAAC,CAAA;IAE1E;;;;;;OAMG;IACH,YAAY,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC,KAAK,CAAC,iBAAiB,CAAC,WAAW,CAAC,CAAC,CAAA;IAE5E;;OAEG;IACH,aAAa,CAAC,EAAE,iBAAiB,EAAE,CAAA;IAEnC;;;;;OAKG;IACH,OAAO,EAAE,CAAC,OAAO,EAAE,cAAc,GAAG,QAAQ,KAAK,IAAI,CAAA;IAErD;;;;OAIG;IACH,IAAI,CAAC,EAAE,QAAQ,GAAG,aAAa,CAAA;IAE/B;;;;;;OAMG;IACH,KAAK,CAAC,EAAE,WAAW,CAAA;IAEnB;;;;;OAKG;IACH,MAAM,CAAC,EAAE,YAAY,CAAA;IAErB;;OAEG;IACH,QAAQ,CAAC,EAAE,QAAQ,GAAG,MAAM,GAAG,OAAO,GAAG,eAAe,CAAC,MAAM,GAAG,OAAO,GAAG,QAAQ,GAAG,YAAY,GAAG,QAAQ,CAAC,CAAA;IAE/G;;;OAGG;IACH,cAAc,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAAA;IAEpD;;OAEG;IACH,eAAe,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAAA;IAErD;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAED;;GAEG;AACH,MAAM,WAAW,iBAAkB,SAAQ,WAAW;IACpD;;;OAGG;IACH,aAAa,EAAE,MAAM,CAAA;IAErB;;;OAGG;IACH,mBAAmB,EAAE,MAAM,CAAA;CAC5B;AAGD,QAAA,MAAM,SAAS;;;;CAIL,CAAA;AAGV,QAAA,MAAM,QAAQ;;;;;CAKJ,CAAA;AAEV,MAAM,MAAM,WAAW,GAAG,MAAM,OAAO,QAAQ,CAAA;AAC/C,MAAM,MAAM,YAAY,GAAG,MAAM,OAAO,SAAS,CAAA;
|
|
1
|
+
{"version":3,"file":"Dialog.d.ts","sourceRoot":"","sources":["../../src/Dialog/Dialog.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAsE,MAAM,OAAO,CAAA;AAC1F,OAAO,KAAK,EAAC,WAAW,EAAC,MAAM,WAAW,CAAA;AAW1C,OAAO,KAAK,EAAC,eAAe,EAAC,MAAM,6BAA6B,CAAA;AAChE,OAAO,KAAK,EAAC,mBAAmB,IAAI,8BAA8B,EAAC,MAAM,sBAAsB,CAAA;AAQ/F;;;GAGG;AACH,MAAM,MAAM,iBAAiB,GAAG,IAAI,CAAC,WAAW,EAAE,SAAS,CAAC,GAAG;IAC7D;;OAEG;IACH,UAAU,CAAC,EAAE,SAAS,GAAG,SAAS,GAAG,QAAQ,GAAG,QAAQ,CAAA;IAExD;;OAEG;IACH,OAAO,EAAE,KAAK,CAAC,SAAS,CAAA;IAExB;;;OAGG;IACH,SAAS,CAAC,EAAE,OAAO,CAAA;IAEnB;;;OAGG;IACH,GAAG,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,iBAAiB,GAAG,IAAI,CAAC,CAAA;CAChD,CAAA;AAED;;GAEG;AACH,MAAM,WAAW,WAAW;IAC1B;;OAEG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAEvB;;;;OAIG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAE1B;;;;;;OAMG;IACH,YAAY,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC,KAAK,CAAC,iBAAiB,CAAC,iBAAiB,CAAC,CAAC,CAAA;IAElF;;;;;;OAMG;IACH,UAAU,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC,KAAK,CAAC,iBAAiB,CAAC,WAAW,CAAC,CAAC,CAAA;IAE1E;;;;;;OAMG;IACH,YAAY,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC,KAAK,CAAC,iBAAiB,CAAC,WAAW,CAAC,CAAC,CAAA;IAE5E;;OAEG;IACH,aAAa,CAAC,EAAE,iBAAiB,EAAE,CAAA;IAEnC;;;;;OAKG;IACH,OAAO,EAAE,CAAC,OAAO,EAAE,cAAc,GAAG,QAAQ,KAAK,IAAI,CAAA;IAErD;;;;OAIG;IACH,IAAI,CAAC,EAAE,QAAQ,GAAG,aAAa,CAAA;IAE/B;;;;;;OAMG;IACH,KAAK,CAAC,EAAE,WAAW,CAAA;IAEnB;;;;;OAKG;IACH,MAAM,CAAC,EAAE,YAAY,CAAA;IAErB;;OAEG;IACH,QAAQ,CAAC,EAAE,QAAQ,GAAG,MAAM,GAAG,OAAO,GAAG,eAAe,CAAC,MAAM,GAAG,OAAO,GAAG,QAAQ,GAAG,YAAY,GAAG,QAAQ,CAAC,CAAA;IAE/G;;;OAGG;IACH,cAAc,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAAA;IAEpD;;OAEG;IACH,eAAe,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAAA;IAErD;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAED;;GAEG;AACH,MAAM,WAAW,iBAAkB,SAAQ,WAAW;IACpD;;;OAGG;IACH,aAAa,EAAE,MAAM,CAAA;IAErB;;;OAGG;IACH,mBAAmB,EAAE,MAAM,CAAA;CAC5B;AAGD,QAAA,MAAM,SAAS;;;;CAIL,CAAA;AAGV,QAAA,MAAM,QAAQ;;;;;CAKJ,CAAA;AAEV,MAAM,MAAM,WAAW,GAAG,MAAM,OAAO,QAAQ,CAAA;AAC/C,MAAM,MAAM,YAAY,GAAG,MAAM,OAAO,SAAS,CAAA;AA+RjD,eAAO,MAAM,MAAM;;;;;;;;;;iBAhEuC,iBAAiB,EAAE;;;iBAkCf,MAAM,IAAI;;CAuCtE,CAAA"}
|
package/dist/Dialog/Dialog.js
CHANGED
|
@@ -216,13 +216,29 @@ const _Dialog = /*#__PURE__*/React.forwardRef((props, forwardedRef) => {
|
|
|
216
216
|
event.preventDefault();
|
|
217
217
|
}, [onClose]);
|
|
218
218
|
React.useEffect(() => {
|
|
219
|
-
var _dialogRef$current;
|
|
220
219
|
const scrollbarWidth = window.innerWidth - document.body.clientWidth;
|
|
221
|
-
|
|
222
|
-
|
|
223
|
-
|
|
224
|
-
//
|
|
220
|
+
const dialog = dialogRef.current;
|
|
221
|
+
const usePerfOptimization = document.body.hasAttribute('data-dialog-scroll-optimized');
|
|
222
|
+
|
|
223
|
+
// Add DisableScroll class to this dialog (for legacy :has() selector path)
|
|
224
|
+
dialog === null || dialog === void 0 ? void 0 : dialog.classList.add(classes.DisableScroll);
|
|
225
225
|
document.body.style.setProperty('--prc-dialog-scrollgutter', `${scrollbarWidth}px`);
|
|
226
|
+
if (usePerfOptimization) {
|
|
227
|
+
// Optimized path: set attribute on body for direct CSS targeting
|
|
228
|
+
document.body.setAttribute('data-dialog-scroll-disabled', '');
|
|
229
|
+
}
|
|
230
|
+
// Legacy path: no action needed - CSS :has(.Dialog.DisableScroll) handles it
|
|
231
|
+
|
|
232
|
+
return () => {
|
|
233
|
+
dialog === null || dialog === void 0 ? void 0 : dialog.classList.remove(classes.DisableScroll);
|
|
234
|
+
const remainingDialogs = document.querySelectorAll(`.${classes.DisableScroll}`);
|
|
235
|
+
if (remainingDialogs.length === 0) {
|
|
236
|
+
document.body.style.removeProperty('--prc-dialog-scrollgutter');
|
|
237
|
+
if (usePerfOptimization) {
|
|
238
|
+
document.body.removeAttribute('data-dialog-scroll-disabled');
|
|
239
|
+
}
|
|
240
|
+
}
|
|
241
|
+
};
|
|
226
242
|
}, []);
|
|
227
243
|
const header = (_slots$header = slots.header) !== null && _slots$header !== void 0 ? _slots$header : (renderHeader !== null && renderHeader !== void 0 ? renderHeader : DefaultHeader)(defaultedProps);
|
|
228
244
|
const body = (_slots$body = slots.body) !== null && _slots$body !== void 0 ? _slots$body : (renderBody !== null && renderBody !== void 0 ? renderBody : DefaultBody)({
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import './Dialog-
|
|
1
|
+
import './Dialog-92b5e3b7.css';
|
|
2
2
|
|
|
3
3
|
var classes = {"Backdrop":"prc-Dialog-Backdrop-5Nt2U","dialog-backdrop-appear":"prc-Dialog-dialog-backdrop-appear-tCG2K","Dialog":"prc-Dialog-Dialog-G8cDF","Overlay--motion-scaleFade":"prc-Dialog-Overlay--motion-scaleFade-mE6-C","Overlay--motion-slideInRight":"prc-Dialog-Overlay--motion-slideInRight-BR-CZ","Overlay--motion-slideInLeft":"prc-Dialog-Overlay--motion-slideInLeft-ISmQZ","Overlay--motion-slideUp":"prc-Dialog-Overlay--motion-slideUp-tPElO","DisableScroll":"prc-Dialog-DisableScroll-UkWFM","DialogOverflowWrapper":"prc-Dialog-DialogOverflowWrapper-JvHzz","Footer":"prc-Dialog-Footer-PMeQk","detect-scroll":"prc-Dialog-detect-scroll-b3i8Q","Header":"prc-Dialog-Header-f7Me-","HeaderInner":"prc-Dialog-HeaderInner-H-fFY","HeaderContent":"prc-Dialog-HeaderContent-mjAsn","Title":"prc-Dialog-Title-M-iPn","Subtitle":"prc-Dialog-Subtitle-aBFSq","Body":"prc-Dialog-Body-bB903"};
|
|
4
4
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DefaultFeatureFlags.d.ts","sourceRoot":"","sources":["../../src/FeatureFlags/DefaultFeatureFlags.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,gBAAgB,EAAC,MAAM,oBAAoB,CAAA;AAEnD,eAAO,MAAM,mBAAmB,
|
|
1
|
+
{"version":3,"file":"DefaultFeatureFlags.d.ts","sourceRoot":"","sources":["../../src/FeatureFlags/DefaultFeatureFlags.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,gBAAgB,EAAC,MAAM,oBAAoB,CAAA;AAEnD,eAAO,MAAM,mBAAmB,kBAS9B,CAAA"}
|
|
@@ -3,6 +3,7 @@ import { FeatureFlagScope } from './FeatureFlagScope.js';
|
|
|
3
3
|
const DefaultFeatureFlags = FeatureFlagScope.create({
|
|
4
4
|
primer_react_action_list_item_as_button: false,
|
|
5
5
|
primer_react_breadcrumbs_overflow_menu: false,
|
|
6
|
+
primer_react_css_has_selector_perf: false,
|
|
6
7
|
primer_react_overlay_overflow: false,
|
|
7
8
|
primer_react_select_panel_fullscreen_on_narrow: false,
|
|
8
9
|
primer_react_select_panel_order_selected_at_top: false,
|
|
@@ -3,5 +3,11 @@ import { type FeatureFlags } from './FeatureFlagScope';
|
|
|
3
3
|
export type FeatureFlagsProps = React.PropsWithChildren<{
|
|
4
4
|
flags: FeatureFlags;
|
|
5
5
|
}>;
|
|
6
|
+
/**
|
|
7
|
+
* Reset the ref count for testing purposes only.
|
|
8
|
+
*
|
|
9
|
+
* @internal - Not part of the public API. Only exported for test isolation.
|
|
10
|
+
*/
|
|
11
|
+
export declare function __resetDialogScrollOptimizedCount(): void;
|
|
6
12
|
export declare function FeatureFlags({ children, flags }: FeatureFlagsProps): React.JSX.Element;
|
|
7
13
|
//# sourceMappingURL=FeatureFlags.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FeatureFlags.d.ts","sourceRoot":"","sources":["../../src/FeatureFlags/FeatureFlags.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAG9B,OAAO,EAAmB,KAAK,YAAY,EAAC,MAAM,oBAAoB,CAAA;
|
|
1
|
+
{"version":3,"file":"FeatureFlags.d.ts","sourceRoot":"","sources":["../../src/FeatureFlags/FeatureFlags.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAG9B,OAAO,EAAmB,KAAK,YAAY,EAAC,MAAM,oBAAoB,CAAA;AAGtE,MAAM,MAAM,iBAAiB,GAAG,KAAK,CAAC,iBAAiB,CAAC;IACtD,KAAK,EAAE,YAAY,CAAA;CACpB,CAAC,CAAA;AAcF;;;;GAIG;AACH,wBAAgB,iCAAiC,IAAI,IAAI,CAGxD;AAED,wBAAgB,YAAY,CAAC,EAAC,QAAQ,EAAE,KAAK,EAAC,EAAE,iBAAiB,qBAyBhE"}
|