@primer/react 38.23.0 → 38.24.0-rc.24c0460eb
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 +34 -0
- package/dist/ActionBar/ActionBar-e63def3c.css +2 -0
- package/dist/ActionBar/ActionBar-e63def3c.css.map +1 -0
- package/dist/ActionBar/ActionBar.d.ts +1 -1
- package/dist/ActionBar/ActionBar.d.ts.map +1 -1
- package/dist/ActionBar/ActionBar.js +298 -384
- package/dist/ActionBar/ActionBar.module.css.js +2 -2
- package/dist/ActionBar/index.d.ts +1 -1
- package/dist/ActionList/{Group-743ff5c8.css → Group-efcb39da.css} +2 -2
- package/dist/ActionList/Group-efcb39da.css.map +1 -0
- package/dist/ActionList/Group.d.ts +6 -9
- package/dist/ActionList/Group.d.ts.map +1 -1
- package/dist/ActionList/Group.js +52 -22
- package/dist/ActionList/Group.module.css.js +2 -2
- package/dist/ActionList/GroupHeadingTrailingAction.d.ts +21 -0
- package/dist/ActionList/GroupHeadingTrailingAction.d.ts.map +1 -0
- package/dist/ActionList/GroupHeadingTrailingAction.js +66 -0
- package/dist/ActionList/Heading.js +17 -16
- package/dist/ActionList/index.d.ts +7 -1
- package/dist/ActionList/index.d.ts.map +1 -1
- package/dist/Autocomplete/AutocompleteInput.js +3 -3
- package/dist/Autocomplete/AutocompleteOverlay.js +3 -3
- package/dist/Blankslate/Blankslate.d.ts.map +1 -1
- package/dist/Blankslate/Blankslate.js +6 -0
- package/dist/BranchName/BranchName.js +1 -0
- package/dist/Breadcrumbs/Breadcrumbs.d.ts.map +1 -1
- package/dist/Breadcrumbs/Breadcrumbs.js +3 -0
- package/dist/Button/ButtonBase.js +3 -3
- package/dist/ButtonGroup/ButtonGroup.d.ts.map +1 -1
- package/dist/ButtonGroup/ButtonGroup.js +1 -0
- package/dist/Checkbox/Checkbox.d.ts +1 -0
- package/dist/Checkbox/Checkbox.d.ts.map +1 -1
- package/dist/Checkbox/Checkbox.js +10 -5
- package/dist/CheckboxGroup/CheckboxGroup.js +1 -0
- package/dist/CircleBadge/CircleBadge.d.ts.map +1 -1
- package/dist/CircleBadge/CircleBadge.js +44 -28
- package/dist/ConfirmationDialog/ConfirmationDialog.d.ts.map +1 -1
- package/dist/ConfirmationDialog/ConfirmationDialog.js +1 -0
- package/dist/CounterLabel/CounterLabel.d.ts +2 -0
- package/dist/CounterLabel/CounterLabel.d.ts.map +1 -1
- package/dist/CounterLabel/CounterLabel.js +25 -90
- package/dist/Details/Details.d.ts +6 -2
- package/dist/Details/Details.d.ts.map +1 -1
- package/dist/Details/Details.js +31 -22
- package/dist/Dialog/Dialog-b7da369a.css +2 -0
- package/dist/Dialog/Dialog-b7da369a.css.map +1 -0
- package/dist/Dialog/Dialog.d.ts +5 -2
- package/dist/Dialog/Dialog.d.ts.map +1 -1
- package/dist/Dialog/Dialog.js +34 -11
- package/dist/Dialog/Dialog.module.css.js +1 -1
- package/dist/FeatureFlags/DefaultFeatureFlags.d.ts.map +1 -1
- package/dist/FeatureFlags/DefaultFeatureFlags.js +2 -1
- package/dist/Flash/Flash.d.ts.map +1 -1
- package/dist/Flash/Flash.js +2 -1
- package/dist/FormControl/FormControl.d.ts.map +1 -1
- package/dist/FormControl/FormControl.js +2 -0
- package/dist/FormControl/FormControlCaption.d.ts.map +1 -1
- package/dist/FormControl/FormControlCaption.js +1 -0
- package/dist/FormControl/FormControlLabel.d.ts.map +1 -1
- package/dist/FormControl/FormControlLabel.js +1 -0
- package/dist/FormControl/FormControlLeadingVisual.d.ts.map +1 -1
- package/dist/FormControl/FormControlLeadingVisual.js +1 -0
- package/dist/FormControl/_FormControlValidation.d.ts.map +1 -1
- package/dist/FormControl/_FormControlValidation.js +1 -0
- package/dist/Header/Header.d.ts.map +1 -1
- package/dist/Header/Header.js +3 -0
- package/dist/Heading/Heading.d.ts.map +1 -1
- package/dist/Heading/Heading.js +4 -3
- package/dist/Link/Link.js +3 -3
- package/dist/Overlay/Overlay.d.ts.map +1 -1
- package/dist/Overlay/Overlay.js +20 -19
- package/dist/PageLayout/PageLayout.js +5 -5
- package/dist/PageLayout/usePaneWidth.d.ts.map +1 -1
- package/dist/PageLayout/usePaneWidth.js +12 -6
- package/dist/TextInputWithTokens/TextInputWithTokens.js +91 -90
- package/dist/Timeline/{Timeline-ad31a7fb.css → Timeline-05decc91.css} +2 -2
- package/dist/Timeline/Timeline-05decc91.css.map +1 -0
- package/dist/Timeline/Timeline.module.css.js +1 -1
- package/dist/deprecated/DialogV1/Dialog.js +10 -9
- package/dist/index.d.ts +1 -1
- package/dist/index.d.ts.map +1 -1
- package/dist/internal/components/CheckboxOrRadioGroup/CheckboxOrRadioGroup.d.ts +1 -0
- package/dist/internal/components/CheckboxOrRadioGroup/CheckboxOrRadioGroup.d.ts.map +1 -1
- package/dist/internal/components/CheckboxOrRadioGroup/CheckboxOrRadioGroup.js +5 -2
- package/dist/internal/components/CheckboxOrRadioGroup/CheckboxOrRadioGroupCaption.d.ts.map +1 -1
- package/dist/internal/components/CheckboxOrRadioGroup/CheckboxOrRadioGroupCaption.js +3 -1
- package/dist/internal/components/CheckboxOrRadioGroup/CheckboxOrRadioGroupContext.d.ts +1 -0
- package/dist/internal/components/CheckboxOrRadioGroup/CheckboxOrRadioGroupContext.d.ts.map +1 -1
- package/dist/internal/components/CheckboxOrRadioGroup/CheckboxOrRadioGroupLabel.d.ts.map +1 -1
- package/dist/internal/components/CheckboxOrRadioGroup/CheckboxOrRadioGroupLabel.js +3 -1
- package/dist/internal/components/CheckboxOrRadioGroup/CheckboxOrRadioGroupValidation.d.ts.map +1 -1
- package/dist/internal/components/CheckboxOrRadioGroup/CheckboxOrRadioGroupValidation.js +3 -1
- package/dist/internal/components/InputValidation.d.ts +2 -1
- package/dist/internal/components/InputValidation.d.ts.map +1 -1
- package/dist/internal/components/InputValidation.js +64 -33
- package/generated/components.json +6 -2
- package/package.json +1 -1
- package/dist/ActionBar/ActionBar-a41224b2.css +0 -2
- package/dist/ActionBar/ActionBar-a41224b2.css.map +0 -1
- package/dist/ActionList/Group-743ff5c8.css.map +0 -1
- package/dist/Dialog/Dialog-f9bb927a.css +0 -2
- package/dist/Dialog/Dialog-f9bb927a.css.map +0 -1
- package/dist/Timeline/Timeline-ad31a7fb.css.map +0 -1
package/dist/Dialog/Dialog.js
CHANGED
|
@@ -6,18 +6,26 @@ import { XIcon } from '@primer/octicons-react';
|
|
|
6
6
|
import { useFocusZone } from '../hooks/useFocusZone.js';
|
|
7
7
|
import { FocusKeys } from '@primer/behaviors';
|
|
8
8
|
import { Portal } from '../Portal/Portal.js';
|
|
9
|
-
import { useRefObjectAsForwardedRef } from '../hooks/useRefObjectAsForwardedRef.js';
|
|
10
9
|
import { useId } from '../hooks/useId.js';
|
|
11
10
|
import classes from './Dialog.module.css.js';
|
|
12
11
|
import { clsx } from 'clsx';
|
|
13
12
|
import { useSlots } from '../hooks/useSlots.js';
|
|
14
13
|
import { useResizeObserver } from '../hooks/useResizeObserver.js';
|
|
15
14
|
import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
|
|
15
|
+
import { useMergedRefs } from '../hooks/useMergedRefs.js';
|
|
16
16
|
import { useOnEscapePress } from '../hooks/useOnEscapePress.js';
|
|
17
17
|
import { ScrollableRegion } from '../ScrollableRegion/ScrollableRegion.js';
|
|
18
18
|
import { useProvidedRefOrCreate } from '../hooks/useProvidedRefOrCreate.js';
|
|
19
19
|
|
|
20
20
|
let dialogScrollDisabledCount = 0;
|
|
21
|
+
const widthMap = {
|
|
22
|
+
small: '296px',
|
|
23
|
+
medium: '320px',
|
|
24
|
+
large: '480px',
|
|
25
|
+
xlarge: '640px'
|
|
26
|
+
};
|
|
27
|
+
const isWidthMapKey = width => typeof width === 'string' && Object.hasOwn(widthMap, width);
|
|
28
|
+
const normalizeWidth = width => typeof width === 'number' ? `${width}px` : width;
|
|
21
29
|
const DefaultHeader = ({
|
|
22
30
|
dialogLabelId,
|
|
23
31
|
title,
|
|
@@ -85,6 +93,7 @@ const DIALOG_CONTEXT_VALUE = Object.freeze({});
|
|
|
85
93
|
const _Dialog = /*#__PURE__*/React.forwardRef((props, forwardedRef) => {
|
|
86
94
|
var _slots$header, _slots$body, _slots$footer;
|
|
87
95
|
const {
|
|
96
|
+
'data-component': dataComponentProp,
|
|
88
97
|
title = 'Dialog',
|
|
89
98
|
subtitle = '',
|
|
90
99
|
renderHeader,
|
|
@@ -132,7 +141,7 @@ const _Dialog = /*#__PURE__*/React.forwardRef((props, forwardedRef) => {
|
|
|
132
141
|
footer: Dialog.Footer
|
|
133
142
|
});
|
|
134
143
|
const dialogRef = useRef(null);
|
|
135
|
-
|
|
144
|
+
const mergedDialogRef = useMergedRefs(forwardedRef, dialogRef);
|
|
136
145
|
const backdropRef = useRef(null);
|
|
137
146
|
useFocusTrap({
|
|
138
147
|
containerRef: dialogRef,
|
|
@@ -192,6 +201,7 @@ const _Dialog = /*#__PURE__*/React.forwardRef((props, forwardedRef) => {
|
|
|
192
201
|
} : Object.fromEntries(Object.entries(position).map(([key, value]) => {
|
|
193
202
|
return [`data-position-${key}`, value];
|
|
194
203
|
}));
|
|
204
|
+
const dataComponent = dataComponentProp !== null && dataComponentProp !== void 0 ? dataComponentProp : 'Dialog';
|
|
195
205
|
return /*#__PURE__*/jsx(DialogContext.Provider, {
|
|
196
206
|
value: DIALOG_CONTEXT_VALUE,
|
|
197
207
|
children: /*#__PURE__*/jsx(Portal, {
|
|
@@ -207,7 +217,7 @@ const _Dialog = /*#__PURE__*/React.forwardRef((props, forwardedRef) => {
|
|
|
207
217
|
setLastMouseDownIsBackdrop(e.target === e.currentTarget);
|
|
208
218
|
},
|
|
209
219
|
children: /*#__PURE__*/jsxs("div", {
|
|
210
|
-
ref:
|
|
220
|
+
ref: mergedDialogRef,
|
|
211
221
|
role: role,
|
|
212
222
|
"aria-labelledby": dialogLabelId,
|
|
213
223
|
"aria-describedby": dialogDescriptionId,
|
|
@@ -216,12 +226,18 @@ const _Dialog = /*#__PURE__*/React.forwardRef((props, forwardedRef) => {
|
|
|
216
226
|
...(align && {
|
|
217
227
|
'data-align': align
|
|
218
228
|
}),
|
|
219
|
-
"data-width": width,
|
|
229
|
+
"data-width": isWidthMapKey(width) ? width : undefined,
|
|
220
230
|
"data-height": height,
|
|
221
231
|
"data-has-footer": hasFooter ? '' : undefined,
|
|
222
232
|
"data-footer-button-layout": hasFooter ? footerButtonLayout : undefined,
|
|
223
233
|
className: clsx(className, classes.Dialog),
|
|
224
|
-
style:
|
|
234
|
+
style: {
|
|
235
|
+
...style,
|
|
236
|
+
...(!isWidthMapKey(width) ? {
|
|
237
|
+
'--dialog-width': normalizeWidth(width)
|
|
238
|
+
} : {})
|
|
239
|
+
},
|
|
240
|
+
"data-component": dataComponent,
|
|
225
241
|
children: [header, /*#__PURE__*/jsx(ScrollableRegion, {
|
|
226
242
|
"aria-labelledby": dialogLabelId,
|
|
227
243
|
className: classes.DialogOverflowWrapper,
|
|
@@ -240,7 +256,8 @@ const Header = /*#__PURE__*/React.forwardRef(function Header({
|
|
|
240
256
|
return /*#__PURE__*/jsx("div", {
|
|
241
257
|
ref: forwardRef,
|
|
242
258
|
className: clsx(className, classes.Header),
|
|
243
|
-
...rest
|
|
259
|
+
...rest,
|
|
260
|
+
"data-component": "Dialog.Header"
|
|
244
261
|
});
|
|
245
262
|
});
|
|
246
263
|
Header.displayName = 'Dialog.Header';
|
|
@@ -251,7 +268,8 @@ const Title = /*#__PURE__*/React.forwardRef(function Title({
|
|
|
251
268
|
return /*#__PURE__*/jsx("h1", {
|
|
252
269
|
ref: forwardRef,
|
|
253
270
|
className: clsx(className, classes.Title),
|
|
254
|
-
...rest
|
|
271
|
+
...rest,
|
|
272
|
+
"data-component": "Dialog.Title"
|
|
255
273
|
});
|
|
256
274
|
});
|
|
257
275
|
Title.displayName = 'Dialog.Title';
|
|
@@ -262,7 +280,8 @@ const Subtitle = /*#__PURE__*/React.forwardRef(function Subtitle({
|
|
|
262
280
|
return /*#__PURE__*/jsx("h2", {
|
|
263
281
|
ref: forwardRef,
|
|
264
282
|
className: clsx(className, classes.Subtitle),
|
|
265
|
-
...rest
|
|
283
|
+
...rest,
|
|
284
|
+
"data-component": "Dialog.Subtitle"
|
|
266
285
|
});
|
|
267
286
|
});
|
|
268
287
|
Subtitle.displayName = 'Dialog.Subtitle';
|
|
@@ -273,7 +292,8 @@ const Body = /*#__PURE__*/React.forwardRef(function Body({
|
|
|
273
292
|
return /*#__PURE__*/jsx("div", {
|
|
274
293
|
ref: forwardRef,
|
|
275
294
|
className: clsx(className, classes.Body),
|
|
276
|
-
...rest
|
|
295
|
+
...rest,
|
|
296
|
+
"data-component": "Dialog.Body"
|
|
277
297
|
});
|
|
278
298
|
});
|
|
279
299
|
Body.displayName = 'Dialog.Body';
|
|
@@ -284,7 +304,8 @@ const Footer = /*#__PURE__*/React.forwardRef(function Footer({
|
|
|
284
304
|
return /*#__PURE__*/jsx("div", {
|
|
285
305
|
ref: forwardRef,
|
|
286
306
|
className: clsx(className, classes.Footer),
|
|
287
|
-
...rest
|
|
307
|
+
...rest,
|
|
308
|
+
"data-component": "Dialog.Footer"
|
|
288
309
|
});
|
|
289
310
|
});
|
|
290
311
|
Footer.displayName = 'Dialog.Footer';
|
|
@@ -314,6 +335,7 @@ const Buttons = ({
|
|
|
314
335
|
...buttonProps
|
|
315
336
|
} = dialogButtonProps;
|
|
316
337
|
return /*#__PURE__*/jsx(ButtonComponent, {
|
|
338
|
+
"data-component": "Dialog.FooterButton",
|
|
317
339
|
...buttonProps,
|
|
318
340
|
// 'normal' value is equivalent to 'default', this is used for backwards compatibility
|
|
319
341
|
variant: buttonType === 'normal' ? 'default' : buttonType
|
|
@@ -332,7 +354,8 @@ const CloseButton = ({
|
|
|
332
354
|
icon: XIcon,
|
|
333
355
|
"aria-label": "Close",
|
|
334
356
|
onClick: onClose,
|
|
335
|
-
variant: "invisible"
|
|
357
|
+
variant: "invisible",
|
|
358
|
+
"data-component": "Dialog.CloseButton"
|
|
336
359
|
});
|
|
337
360
|
};
|
|
338
361
|
CloseButton.displayName = "CloseButton";
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import './Dialog-
|
|
1
|
+
import './Dialog-b7da369a.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","DialogOverflowWrapper":"prc-Dialog-DialogOverflowWrapper-JvHzz","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","Footer":"prc-Dialog-Footer-PMeQk"};
|
|
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,kBAM9B,CAAA"}
|
|
@@ -4,7 +4,8 @@ const DefaultFeatureFlags = FeatureFlagScope.create({
|
|
|
4
4
|
primer_react_css_anchor_positioning: false,
|
|
5
5
|
primer_react_select_panel_fullscreen_on_narrow: false,
|
|
6
6
|
primer_react_select_panel_order_selected_at_top: false,
|
|
7
|
-
primer_react_styled_react_use_primer_theme_providers: false
|
|
7
|
+
primer_react_styled_react_use_primer_theme_providers: false,
|
|
8
|
+
primer_react_action_list_group_heading_trailing_action: false
|
|
8
9
|
});
|
|
9
10
|
|
|
10
11
|
export { DefaultFeatureFlags };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Flash.d.ts","sourceRoot":"","sources":["../../src/Flash/Flash.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,KAAK,EAAC,mBAAmB,IAAI,8BAA8B,EAAC,MAAM,sBAAsB,CAAA;AAG/F,MAAM,MAAM,UAAU,GAAG,KAAK,CAAC,wBAAwB,CAAC,KAAK,CAAC,GAAG;IAC/D,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,OAAO,CAAC,EAAE,SAAS,GAAG,SAAS,GAAG,SAAS,GAAG,QAAQ,CAAA;IACtD,IAAI,CAAC,EAAE,OAAO,CAAA;CACf,CAAA;AAED,QAAA,MAAM,KAAK,
|
|
1
|
+
{"version":3,"file":"Flash.d.ts","sourceRoot":"","sources":["../../src/Flash/Flash.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,KAAK,EAAC,mBAAmB,IAAI,8BAA8B,EAAC,MAAM,sBAAsB,CAAA;AAG/F,MAAM,MAAM,UAAU,GAAG,KAAK,CAAC,wBAAwB,CAAC,KAAK,CAAC,GAAG;IAC/D,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,OAAO,CAAC,EAAE,SAAS,GAAG,SAAS,GAAG,SAAS,GAAG,QAAQ,CAAA;IACtD,IAAI,CAAC,EAAE,OAAO,CAAA;CACf,CAAA;AAED,QAAA,MAAM,KAAK,EAcL,8BAA8B,CAAC,KAAK,EAAE,UAAU,CAAC,CAAA;AAMvD,eAAe,KAAK,CAAA"}
|
package/dist/Flash/Flash.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FormControl.d.ts","sourceRoot":"","sources":["../../src/FormControl/FormControl.tsx"],"names":[],"mappings":"AACA,OAAO,KAAmB,MAAM,OAAO,CAAA;AAavC,OAAO,EAAC,kBAAkB,EAAC,MAAM,sBAAsB,CAAA;AASvD,MAAM,MAAM,gBAAgB,GAAG;IAC7B,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC1B;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB;;OAEG;IACH,EAAE,CAAC,EAAE,MAAM,CAAA;IACX;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB;;;OAGG;IACH,MAAM,CAAC,EAAE,YAAY,GAAG,UAAU,CAAA;IAClC,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAA;CAC5B,CAAA;;;;;;;;;;;;;;
|
|
1
|
+
{"version":3,"file":"FormControl.d.ts","sourceRoot":"","sources":["../../src/FormControl/FormControl.tsx"],"names":[],"mappings":"AACA,OAAO,KAAmB,MAAM,OAAO,CAAA;AAavC,OAAO,EAAC,kBAAkB,EAAC,MAAM,sBAAsB,CAAA;AASvD,MAAM,MAAM,gBAAgB,GAAG;IAC7B,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC1B;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB;;OAEG;IACH,EAAE,CAAC,EAAE,MAAM,CAAA;IACX;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB;;;OAGG;IACH,MAAM,CAAC,EAAE,YAAY,GAAG,UAAU,CAAA;IAClC,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAA;CAC5B,CAAA;;;;;;;;;;;;;;AAmMD,wBAME"}
|
|
@@ -182,12 +182,14 @@ const FormControl = /*#__PURE__*/React.forwardRef((t0, ref) => {
|
|
|
182
182
|
"data-has-leading-visual": slots.leadingVisual ? "" : undefined,
|
|
183
183
|
className: clsx(className, classes.ControlHorizontalLayout),
|
|
184
184
|
style: style,
|
|
185
|
+
"data-component": "FormControl",
|
|
185
186
|
children: InputChildren
|
|
186
187
|
}) : /*#__PURE__*/jsxs("div", {
|
|
187
188
|
ref: ref,
|
|
188
189
|
"data-has-label": !isLabelHidden ? "" : undefined,
|
|
189
190
|
className: clsx(className, classes.ControlVerticalLayout),
|
|
190
191
|
style: style,
|
|
192
|
+
"data-component": "FormControl",
|
|
191
193
|
children: [slots.label, /*#__PURE__*/React.isValidElement(InputComponent) && /*#__PURE__*/React.cloneElement(InputComponent, Object.assign({
|
|
192
194
|
id,
|
|
193
195
|
required,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FormControlCaption.d.ts","sourceRoot":"","sources":["../../src/FormControl/FormControlCaption.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAK9B,MAAM,MAAM,uBAAuB,GAAG,KAAK,CAAC,iBAAiB,CAAC;IAC5D,EAAE,CAAC,EAAE,MAAM,CAAA;IACX,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAA;CAC5B,CAAC,CAAA;AAEF,iBAAS,kBAAkB,CAAC,EAAC,EAAE,EAAE,QAAQ,EAAE,SAAS,EAAE,KAAK,EAAC,EAAE,uBAAuB,
|
|
1
|
+
{"version":3,"file":"FormControlCaption.d.ts","sourceRoot":"","sources":["../../src/FormControl/FormControlCaption.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAK9B,MAAM,MAAM,uBAAuB,GAAG,KAAK,CAAC,iBAAiB,CAAC;IAC5D,EAAE,CAAC,EAAE,MAAM,CAAA;IACX,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAA;CAC5B,CAAC,CAAA;AAEF,iBAAS,kBAAkB,CAAC,EAAC,EAAE,EAAE,QAAQ,EAAE,SAAS,EAAE,KAAK,EAAC,EAAE,uBAAuB,qBAcpF;kBAdQ,kBAAkB;;;AAkB3B,OAAO,EAAC,kBAAkB,EAAC,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FormControlLabel.d.ts","sourceRoot":"","sources":["../../src/FormControl/FormControlLabel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,EAAC,UAAU,EAAC,MAAM,mCAAmC,CAAA;AAC5D,OAAO,KAAK,EAAC,gBAAgB,EAAC,MAAM,gBAAgB,CAAA;AAEpD,MAAM,MAAM,KAAK,GAAG;IAClB;;OAEG;IACH,cAAc,CAAC,EAAE,OAAO,CAAA;IACxB,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,iBAAiB,CAAC,EAAE,OAAO,CAAA;IAC3B,EAAE,CAAC,EAAE,MAAM,CAAA;IACX,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAA;CAC5B,CAAA;AAED,QAAA,MAAM,gBAAgB,EAAE,gBAAgB,CACtC,KAAK,CAAC,iBAAiB,CAAC;IAAC,OAAO,CAAC,EAAE,MAAM,CAAA;CAAC,GAAG,KAAK,CAAC,cAAc,CAAC,OAAO,UAAU,CAAC,GAAG,KAAK,CAAC,
|
|
1
|
+
{"version":3,"file":"FormControlLabel.d.ts","sourceRoot":"","sources":["../../src/FormControl/FormControlLabel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,EAAC,UAAU,EAAC,MAAM,mCAAmC,CAAA;AAC5D,OAAO,KAAK,EAAC,gBAAgB,EAAC,MAAM,gBAAgB,CAAA;AAEpD,MAAM,MAAM,KAAK,GAAG;IAClB;;OAEG;IACH,cAAc,CAAC,EAAE,OAAO,CAAA;IACxB,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,iBAAiB,CAAC,EAAE,OAAO,CAAA;IAC3B,EAAE,CAAC,EAAE,MAAM,CAAA;IACX,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAA;CAC5B,CAAA;AAED,QAAA,MAAM,gBAAgB,EAAE,gBAAgB,CACtC,KAAK,CAAC,iBAAiB,CAAC;IAAC,OAAO,CAAC,EAAE,MAAM,CAAA;CAAC,GAAG,KAAK,CAAC,cAAc,CAAC,OAAO,UAAU,CAAC,GAAG,KAAK,CAAC,CAuC9F,CAAA;AAID,eAAe,gBAAgB,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FormControlLeadingVisual.d.ts","sourceRoot":"","sources":["../../src/FormControl/FormControlLeadingVisual.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAG9B,OAAO,KAAK,EAAC,gBAAgB,EAAC,MAAM,gBAAgB,CAAA;AAEpD,QAAA,MAAM,wBAAwB,EAAE,gBAAgB,CAAC,KAAK,CAAC,iBAAiB,CAAC;IAAC,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAA;CAAC,CAAC,
|
|
1
|
+
{"version":3,"file":"FormControlLeadingVisual.d.ts","sourceRoot":"","sources":["../../src/FormControl/FormControlLeadingVisual.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAG9B,OAAO,KAAK,EAAC,gBAAgB,EAAC,MAAM,gBAAgB,CAAA;AAEpD,QAAA,MAAM,wBAAwB,EAAE,gBAAgB,CAAC,KAAK,CAAC,iBAAiB,CAAC;IAAC,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAA;CAAC,CAAC,CAgBtG,CAAA;AAID,eAAe,wBAAwB,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"_FormControlValidation.d.ts","sourceRoot":"","sources":["../../src/FormControl/_FormControlValidation.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,KAAK,EAAC,oBAAoB,EAAC,MAAM,qCAAqC,CAAA;AAE7E,OAAO,KAAK,EAAC,gBAAgB,EAAC,MAAM,gBAAgB,CAAA;AAEpD,MAAM,MAAM,0BAA0B,GAAG;IACvC,OAAO,EAAE,oBAAoB,CAAA;IAC7B,EAAE,CAAC,EAAE,MAAM,CAAA;IACX,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAA;CAC5B,CAAA;AAED,QAAA,MAAM,qBAAqB,EAAE,gBAAgB,CAAC,KAAK,CAAC,iBAAiB,CAAC,0BAA0B,CAAC,
|
|
1
|
+
{"version":3,"file":"_FormControlValidation.d.ts","sourceRoot":"","sources":["../../src/FormControl/_FormControlValidation.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,KAAK,EAAC,oBAAoB,EAAC,MAAM,qCAAqC,CAAA;AAE7E,OAAO,KAAK,EAAC,gBAAgB,EAAC,MAAM,gBAAgB,CAAA;AAEpD,MAAM,MAAM,0BAA0B,GAAG;IACvC,OAAO,EAAE,oBAAoB,CAAA;IAC7B,EAAE,CAAC,EAAE,MAAM,CAAA;IACX,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAA;CAC5B,CAAA;AAED,QAAA,MAAM,qBAAqB,EAAE,gBAAgB,CAAC,KAAK,CAAC,iBAAiB,CAAC,0BAA0B,CAAC,CAmBhG,CAAA;AAID,eAAe,qBAAqB,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Header.d.ts","sourceRoot":"","sources":["../../src/Header/Header.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAC,QAAQ,EAAE,QAAQ,EAAC,MAAM,SAAS,CAAA;AAC/C,OAAO,KAAK,MAAM,OAAO,CAAA;AAGzB,OAAO,KAAK,EAAC,mBAAmB,IAAI,8BAA8B,EAAC,MAAM,sBAAsB,CAAA;AAE/F,MAAM,MAAM,WAAW,GAAG,KAAK,CAAC,cAAc,CAAC,QAAQ,CAAC,GAAG;IAAC,EAAE,CAAC,EAAE,KAAK,CAAC,WAAW,CAAA;CAAC,CAAA;AACnF,MAAM,MAAM,eAAe,GAAG,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAAG;IAAC,IAAI,CAAC,EAAE,OAAO,CAAA;CAAC,CAAA;AAC5E,MAAM,MAAM,eAAe,GAAG,KAAK,CAAC,cAAc,CAAC,GAAG,CAAC,GAAG;IAAC,EAAE,CAAC,EAAE,QAAQ,GAAG,QAAQ,CAAC;IAAC,EAAE,CAAC,EAAE,KAAK,CAAC,WAAW,CAAA;CAAC,CAAA;;;;;
|
|
1
|
+
{"version":3,"file":"Header.d.ts","sourceRoot":"","sources":["../../src/Header/Header.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAC,QAAQ,EAAE,QAAQ,EAAC,MAAM,SAAS,CAAA;AAC/C,OAAO,KAAK,MAAM,OAAO,CAAA;AAGzB,OAAO,KAAK,EAAC,mBAAmB,IAAI,8BAA8B,EAAC,MAAM,sBAAsB,CAAA;AAE/F,MAAM,MAAM,WAAW,GAAG,KAAK,CAAC,cAAc,CAAC,QAAQ,CAAC,GAAG;IAAC,EAAE,CAAC,EAAE,KAAK,CAAC,WAAW,CAAA;CAAC,CAAA;AACnF,MAAM,MAAM,eAAe,GAAG,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAAG;IAAC,IAAI,CAAC,EAAE,OAAO,CAAA;CAAC,CAAA;AAC5E,MAAM,MAAM,eAAe,GAAG,KAAK,CAAC,cAAc,CAAC,GAAG,CAAC,GAAG;IAAC,EAAE,CAAC,EAAE,QAAQ,GAAG,QAAQ,CAAC;IAAC,EAAE,CAAC,EAAE,KAAK,CAAC,WAAW,CAAA;CAAC,CAAA;;;;;AAoD5G,wBAA0E"}
|
package/dist/Header/Header.js
CHANGED
|
@@ -43,6 +43,7 @@ const Header = /*#__PURE__*/React.forwardRef(function Header(t0, forwardRef) {
|
|
|
43
43
|
ref: forwardRef,
|
|
44
44
|
className: t2,
|
|
45
45
|
...rest,
|
|
46
|
+
"data-component": "Header",
|
|
46
47
|
children: children
|
|
47
48
|
});
|
|
48
49
|
$[7] = BaseComponent;
|
|
@@ -96,6 +97,7 @@ const HeaderItem = /*#__PURE__*/React.forwardRef(function HeaderItem(t0, forward
|
|
|
96
97
|
className: t1,
|
|
97
98
|
"data-full": full,
|
|
98
99
|
...rest,
|
|
100
|
+
"data-component": "Header.Item",
|
|
99
101
|
children: children
|
|
100
102
|
});
|
|
101
103
|
$[7] = children;
|
|
@@ -149,6 +151,7 @@ const HeaderLink = /*#__PURE__*/React.forwardRef(function HeaderLink(t0, forward
|
|
|
149
151
|
ref: forwardRef,
|
|
150
152
|
className: t2,
|
|
151
153
|
...rest,
|
|
154
|
+
"data-component": "Header.Link",
|
|
152
155
|
children: children
|
|
153
156
|
});
|
|
154
157
|
$[7] = BaseComponent;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Heading.d.ts","sourceRoot":"","sources":["../../src/Heading/Heading.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAC,cAAc,EAAC,MAAM,gBAAgB,CAAA;AAClD,OAAO,KAAK,EAAC,mBAAmB,IAAI,8BAA8B,EAAC,MAAM,sBAAsB,CAAA;AAG/F,KAAK,aAAa,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAA;AAE5D,KAAK,kBAAkB,GAAG;IACxB,EAAE,CAAC,EAAE,aAAa,CAAA;IAClB,OAAO,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAA;CACvC,CAAA;AAED,QAAA,MAAM,OAAO,
|
|
1
|
+
{"version":3,"file":"Heading.d.ts","sourceRoot":"","sources":["../../src/Heading/Heading.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAC,cAAc,EAAC,MAAM,gBAAgB,CAAA;AAClD,OAAO,KAAK,EAAC,mBAAmB,IAAI,8BAA8B,EAAC,MAAM,sBAAsB,CAAA;AAG/F,KAAK,aAAa,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAA;AAE5D,KAAK,kBAAkB,GAAG;IACxB,EAAE,CAAC,EAAE,aAAa,CAAA;IAClB,OAAO,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAA;CACvC,CAAA;AAED,QAAA,MAAM,OAAO,EA6BP,8BAA8B,CAAC,aAAa,EAAE,kBAAkB,CAAC,CAAA;AAIvE,MAAM,MAAM,YAAY,GAAG,cAAc,CAAC,OAAO,OAAO,CAAC,CAAA;AACzD,eAAe,OAAO,CAAA"}
|
package/dist/Heading/Heading.js
CHANGED
|
@@ -2,7 +2,7 @@ import { clsx } from 'clsx';
|
|
|
2
2
|
import React, { forwardRef, useEffect } from 'react';
|
|
3
3
|
import classes from './Heading.module.css.js';
|
|
4
4
|
import { jsx } from 'react/jsx-runtime';
|
|
5
|
-
import {
|
|
5
|
+
import { useMergedRefs } from '../hooks/useMergedRefs.js';
|
|
6
6
|
|
|
7
7
|
const Heading = /*#__PURE__*/forwardRef(({
|
|
8
8
|
as: Component = 'h2',
|
|
@@ -11,7 +11,7 @@ const Heading = /*#__PURE__*/forwardRef(({
|
|
|
11
11
|
...props
|
|
12
12
|
}, forwardedRef) => {
|
|
13
13
|
const innerRef = React.useRef(null);
|
|
14
|
-
|
|
14
|
+
const mergedRef = useMergedRefs(forwardedRef, innerRef);
|
|
15
15
|
if (process.env.NODE_ENV !== "production") {
|
|
16
16
|
/**
|
|
17
17
|
* The Linter yells because it thinks this conditionally calls an effect,
|
|
@@ -30,8 +30,9 @@ const Heading = /*#__PURE__*/forwardRef(({
|
|
|
30
30
|
return /*#__PURE__*/jsx(Component, {
|
|
31
31
|
className: clsx(className, classes.Heading),
|
|
32
32
|
"data-variant": variant,
|
|
33
|
+
"data-component": "Heading",
|
|
33
34
|
...props,
|
|
34
|
-
ref:
|
|
35
|
+
ref: mergedRef
|
|
35
36
|
});
|
|
36
37
|
});
|
|
37
38
|
Heading.displayName = 'Heading';
|
package/dist/Link/Link.js
CHANGED
|
@@ -3,7 +3,7 @@ import React, { useEffect } from 'react';
|
|
|
3
3
|
import classes from './Link.module.css.js';
|
|
4
4
|
import { fixedForwardRef } from '../utils/modern-polymorphic.js';
|
|
5
5
|
import { jsx } from 'react/jsx-runtime';
|
|
6
|
-
import {
|
|
6
|
+
import { useMergedRefs } from '../hooks/useMergedRefs.js';
|
|
7
7
|
|
|
8
8
|
const UnwrappedLink = (props, ref) => {
|
|
9
9
|
const {
|
|
@@ -15,7 +15,7 @@ const UnwrappedLink = (props, ref) => {
|
|
|
15
15
|
...restProps
|
|
16
16
|
} = props;
|
|
17
17
|
const innerRef = React.useRef(null);
|
|
18
|
-
|
|
18
|
+
const mergedRef = useMergedRefs(ref, innerRef);
|
|
19
19
|
if (process.env.NODE_ENV !== "production") {
|
|
20
20
|
/**
|
|
21
21
|
* The Linter yells because it thinks this conditionally calls an effect,
|
|
@@ -39,7 +39,7 @@ const UnwrappedLink = (props, ref) => {
|
|
|
39
39
|
"data-hover-color": hoverColor,
|
|
40
40
|
...restProps,
|
|
41
41
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
42
|
-
ref:
|
|
42
|
+
ref: mergedRef
|
|
43
43
|
});
|
|
44
44
|
};
|
|
45
45
|
UnwrappedLink.displayName = "UnwrappedLink";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Overlay.d.ts","sourceRoot":"","sources":["../../src/Overlay/Overlay.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAC,qBAAqB,EAAe,MAAM,OAAO,CAAA;AAC9D,OAAO,KAA0B,MAAM,OAAO,CAAA;AAE9C,OAAO,KAAK,EAAC,QAAQ,EAAE,KAAK,EAAC,MAAM,gBAAgB,CAAA;AACnD,OAAO,KAAK,EAAC,iBAAiB,EAAC,MAAM,UAAU,CAAA;
|
|
1
|
+
{"version":3,"file":"Overlay.d.ts","sourceRoot":"","sources":["../../src/Overlay/Overlay.tsx"],"names":[],"mappings":"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"}
|
package/dist/Overlay/Overlay.js
CHANGED
|
@@ -2,10 +2,10 @@ import { c } from 'react-compiler-runtime';
|
|
|
2
2
|
import React, { useRef, useEffect } from 'react';
|
|
3
3
|
import useIsomorphicLayoutEffect from '../utils/useIsomorphicLayoutEffect.js';
|
|
4
4
|
import { Portal } from '../Portal/Portal.js';
|
|
5
|
-
import { useRefObjectAsForwardedRef } from '../hooks/useRefObjectAsForwardedRef.js';
|
|
6
5
|
import classes from './Overlay.module.css.js';
|
|
7
6
|
import { clsx } from 'clsx';
|
|
8
7
|
import { jsx } from 'react/jsx-runtime';
|
|
8
|
+
import { useMergedRefs } from '../hooks/useMergedRefs.js';
|
|
9
9
|
import { useFeatureFlag } from '../FeatureFlags/useFeatureFlag.js';
|
|
10
10
|
import { useOverlay } from '../hooks/useOverlay.js';
|
|
11
11
|
|
|
@@ -124,7 +124,7 @@ const BaseOverlay = /*#__PURE__*/React.forwardRef(({
|
|
|
124
124
|
|
|
125
125
|
*/
|
|
126
126
|
const Overlay = /*#__PURE__*/React.forwardRef((t0, forwardedRef) => {
|
|
127
|
-
const $ = c(
|
|
127
|
+
const $ = c(47);
|
|
128
128
|
let _PrivateDisablePortal;
|
|
129
129
|
let anchorSide;
|
|
130
130
|
let ignoreClickRefs;
|
|
@@ -209,7 +209,7 @@ const Overlay = /*#__PURE__*/React.forwardRef((t0, forwardedRef) => {
|
|
|
209
209
|
const visibility = t4 === undefined ? "visible" : t4;
|
|
210
210
|
const width = t5 === undefined ? "auto" : t5;
|
|
211
211
|
const overlayRef = useRef(null);
|
|
212
|
-
|
|
212
|
+
const mergedOverlayRef = useMergedRefs(forwardedRef, overlayRef);
|
|
213
213
|
const cssAnchorPositioning = useFeatureFlag("primer_react_css_anchor_positioning");
|
|
214
214
|
let t6;
|
|
215
215
|
if ($[19] !== ignoreClickRefs || $[20] !== initialFocusRef || $[21] !== onClickOutside || $[22] !== onEscape || $[23] !== preventFocusOnOpen || $[24] !== returnFocusRef) {
|
|
@@ -283,12 +283,12 @@ const Overlay = /*#__PURE__*/React.forwardRef((t0, forwardedRef) => {
|
|
|
283
283
|
const leftPosition = left === undefined && right === undefined ? 0 : left;
|
|
284
284
|
const t11 = !preventOverflow ? true : undefined;
|
|
285
285
|
let t12;
|
|
286
|
-
if ($[33] !== height || $[34] !== leftPosition || $[35] !==
|
|
286
|
+
if ($[33] !== height || $[34] !== leftPosition || $[35] !== mergedOverlayRef || $[36] !== props || $[37] !== responsiveVariant || $[38] !== right || $[39] !== role || $[40] !== t11 || $[41] !== visibility || $[42] !== width) {
|
|
287
287
|
t12 = /*#__PURE__*/jsx(BaseOverlay, {
|
|
288
288
|
role: role,
|
|
289
289
|
width: width,
|
|
290
290
|
"data-reflow-container": t11,
|
|
291
|
-
ref:
|
|
291
|
+
ref: mergedOverlayRef,
|
|
292
292
|
left: leftPosition,
|
|
293
293
|
right: right,
|
|
294
294
|
height: height,
|
|
@@ -298,32 +298,33 @@ const Overlay = /*#__PURE__*/React.forwardRef((t0, forwardedRef) => {
|
|
|
298
298
|
});
|
|
299
299
|
$[33] = height;
|
|
300
300
|
$[34] = leftPosition;
|
|
301
|
-
$[35] =
|
|
302
|
-
$[36] =
|
|
303
|
-
$[37] =
|
|
304
|
-
$[38] =
|
|
305
|
-
$[39] =
|
|
306
|
-
$[40] =
|
|
307
|
-
$[41] =
|
|
308
|
-
$[42] =
|
|
301
|
+
$[35] = mergedOverlayRef;
|
|
302
|
+
$[36] = props;
|
|
303
|
+
$[37] = responsiveVariant;
|
|
304
|
+
$[38] = right;
|
|
305
|
+
$[39] = role;
|
|
306
|
+
$[40] = t11;
|
|
307
|
+
$[41] = visibility;
|
|
308
|
+
$[42] = width;
|
|
309
|
+
$[43] = t12;
|
|
309
310
|
} else {
|
|
310
|
-
t12 = $[
|
|
311
|
+
t12 = $[43];
|
|
311
312
|
}
|
|
312
313
|
const overlayContent = t12;
|
|
313
314
|
if (_PrivateDisablePortal && cssAnchorPositioning) {
|
|
314
315
|
return overlayContent;
|
|
315
316
|
}
|
|
316
317
|
let t13;
|
|
317
|
-
if ($[
|
|
318
|
+
if ($[44] !== overlayContent || $[45] !== portalContainerName) {
|
|
318
319
|
t13 = /*#__PURE__*/jsx(Portal, {
|
|
319
320
|
containerName: portalContainerName,
|
|
320
321
|
children: overlayContent
|
|
321
322
|
});
|
|
322
|
-
$[
|
|
323
|
-
$[
|
|
324
|
-
$[
|
|
323
|
+
$[44] = overlayContent;
|
|
324
|
+
$[45] = portalContainerName;
|
|
325
|
+
$[46] = t13;
|
|
325
326
|
} else {
|
|
326
|
-
t13 = $[
|
|
327
|
+
t13 = $[46];
|
|
327
328
|
}
|
|
328
329
|
return t13;
|
|
329
330
|
});
|
|
@@ -1,7 +1,6 @@
|
|
|
1
1
|
import React, { useRef, memo } from 'react';
|
|
2
2
|
import { clsx } from 'clsx';
|
|
3
3
|
import { useId } from '../hooks/useId.js';
|
|
4
|
-
import { useRefObjectAsForwardedRef } from '../hooks/useRefObjectAsForwardedRef.js';
|
|
5
4
|
import { isResponsiveValue } from '../hooks/useResponsiveValue.js';
|
|
6
5
|
import { useSlots } from '../hooks/useSlots.js';
|
|
7
6
|
import { useOverflow } from '../hooks/useOverflow.js';
|
|
@@ -11,6 +10,7 @@ import classes from './PageLayout.module.css.js';
|
|
|
11
10
|
import { usePaneWidth, isPaneWidth, isCustomWidthOptions, updateAriaValues, ARROW_KEY_STEP } from './usePaneWidth.js';
|
|
12
11
|
import { setDraggingStyles, removeDraggingStyles } from './paneUtils.js';
|
|
13
12
|
import { jsx, jsxs } from 'react/jsx-runtime';
|
|
13
|
+
import { useMergedRefs } from '../hooks/useMergedRefs.js';
|
|
14
14
|
|
|
15
15
|
const isArrowKey = key => key === 'ArrowLeft' || key === 'ArrowRight' || key === 'ArrowUp' || key === 'ArrowDown';
|
|
16
16
|
const isShrinkKey = key => key === 'ArrowLeft' || key === 'ArrowDown';
|
|
@@ -581,7 +581,7 @@ const Pane = /*#__PURE__*/React.forwardRef(({
|
|
|
581
581
|
onResizeEnd,
|
|
582
582
|
currentWidth: controlledWidth
|
|
583
583
|
});
|
|
584
|
-
|
|
584
|
+
const mergedPaneRef = useMergedRefs(forwardRef, paneRef);
|
|
585
585
|
const hasOverflow = useOverflow(paneRef);
|
|
586
586
|
const paneId = useId(id);
|
|
587
587
|
const labelProp = {};
|
|
@@ -615,7 +615,7 @@ const Pane = /*#__PURE__*/React.forwardRef(({
|
|
|
615
615
|
},
|
|
616
616
|
position: positionProp
|
|
617
617
|
}), /*#__PURE__*/jsx("div", {
|
|
618
|
-
ref:
|
|
618
|
+
ref: mergedPaneRef
|
|
619
619
|
// Suppress hydration mismatch for --pane-width when localStorage
|
|
620
620
|
// provides a width that differs from the server-rendered default.
|
|
621
621
|
// Not needed when onResizeEnd is provided (localStorage isn't read).
|
|
@@ -785,7 +785,7 @@ const Sidebar = /*#__PURE__*/React.forwardRef(({
|
|
|
785
785
|
contentWrapperRef: sidebarContentWrapperRef,
|
|
786
786
|
constrainToViewport: true
|
|
787
787
|
});
|
|
788
|
-
|
|
788
|
+
const mergedSidebarRef = useMergedRefs(forwardRef, sidebarRef);
|
|
789
789
|
const hasOverflow = useOverflow(sidebarRef);
|
|
790
790
|
const sidebarId = useId(id);
|
|
791
791
|
const labelProp = {};
|
|
@@ -824,7 +824,7 @@ const Sidebar = /*#__PURE__*/React.forwardRef(({
|
|
|
824
824
|
getDefaultWidth: getDefaultWidth,
|
|
825
825
|
saveWidth: saveWidth
|
|
826
826
|
}), /*#__PURE__*/jsx("div", {
|
|
827
|
-
ref:
|
|
827
|
+
ref: mergedSidebarRef
|
|
828
828
|
// Suppress hydration mismatch for --pane-width when localStorage
|
|
829
829
|
// provides a width that differs from the server-rendered default.
|
|
830
830
|
,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"usePaneWidth.d.ts","sourceRoot":"","sources":["../../src/PageLayout/usePaneWidth.ts"],"names":[],"mappings":"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
|
|
1
|
+
{"version":3,"file":"usePaneWidth.d.ts","sourceRoot":"","sources":["../../src/PageLayout/usePaneWidth.ts"],"names":[],"mappings":"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"}
|
|
@@ -246,6 +246,7 @@ function usePaneWidth(t0) {
|
|
|
246
246
|
t6 = $[16];
|
|
247
247
|
}
|
|
248
248
|
const [maxPaneWidth, setMaxPaneWidth] = React.useState(t6);
|
|
249
|
+
const maxPaneWidthRef = React.useRef(maxPaneWidth);
|
|
249
250
|
let t7;
|
|
250
251
|
let t8;
|
|
251
252
|
if ($[17] !== currentWidth) {
|
|
@@ -335,15 +336,20 @@ function usePaneWidth(t0) {
|
|
|
335
336
|
max: actualMax,
|
|
336
337
|
current: currentWidthRef.current
|
|
337
338
|
});
|
|
338
|
-
|
|
339
|
-
|
|
340
|
-
|
|
341
|
-
|
|
342
|
-
|
|
343
|
-
|
|
339
|
+
const maxChanged = actualMax !== maxPaneWidthRef.current;
|
|
340
|
+
if (maxChanged || wasClamped) {
|
|
341
|
+
maxPaneWidthRef.current = actualMax;
|
|
342
|
+
startTransition(() => {
|
|
343
|
+
setMaxPaneWidth(actualMax);
|
|
344
|
+
if (wasClamped) {
|
|
345
|
+
setCurrentWidthState(actualMax);
|
|
346
|
+
}
|
|
347
|
+
});
|
|
348
|
+
}
|
|
344
349
|
};
|
|
345
350
|
maxWidthDiffRef.current = getMaxWidthDiffFromViewport();
|
|
346
351
|
const initialMax = getMaxPaneWidthRef.current();
|
|
352
|
+
maxPaneWidthRef.current = initialMax;
|
|
347
353
|
setMaxPaneWidth(initialMax);
|
|
348
354
|
(_paneRef$current3 = paneRef.current) === null || _paneRef$current3 === void 0 ? void 0 : _paneRef$current3.style.setProperty("--pane-max-width", `${initialMax}px`);
|
|
349
355
|
updateAriaValues(handleRef.current, {
|