@primer/react 38.24.0-rc.ff9ea71b3 → 38.25.0-rc.3cd58f825
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 +28 -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/Heading.js +17 -16
- 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/Card/{Card-cec366f8.css → Card-d8a02dd9.css} +2 -2
- package/dist/Card/{Card-cec366f8.css.map → Card-d8a02dd9.css.map} +1 -1
- package/dist/Card/Card.d.ts +75 -39
- package/dist/Card/Card.d.ts.map +1 -1
- package/dist/Card/Card.js +260 -160
- package/dist/Card/Card.module.css.js +2 -2
- package/dist/Card/index.d.ts +16 -16
- package/dist/Card/index.d.ts.map +1 -1
- package/dist/Card/index.js +2 -2
- 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/DataTable/useTable.d.ts.map +1 -1
- package/dist/DataTable/useTable.js +8 -3
- 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/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/Hidden/Hidden.d.ts.map +1 -1
- package/dist/Hidden/Hidden.js +1 -0
- package/dist/InlineMessage/InlineMessage.d.ts.map +1 -1
- package/dist/InlineMessage/InlineMessage.js +1 -0
- package/dist/KeybindingHint/KeybindingHint.d.ts.map +1 -1
- package/dist/KeybindingHint/KeybindingHint.js +1 -0
- package/dist/Label/Label.d.ts.map +1 -1
- package/dist/Label/Label.js +2 -1
- package/dist/LabelGroup/LabelGroup.d.ts.map +1 -1
- package/dist/LabelGroup/LabelGroup.js +4 -1
- 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/experimental/index.d.ts +1 -1
- package/dist/experimental/index.d.ts.map +1 -1
- package/dist/hooks/useMergedRefs.d.ts +1 -1
- package/dist/hooks/useMergedRefs.d.ts.map +1 -1
- package/dist/hooks/useMergedRefs.js +13 -0
- 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/dist/utils/environment.d.ts +4 -1
- package/dist/utils/environment.d.ts.map +1 -1
- package/dist/utils/environment.js +17 -2
- package/generated/components.json +59 -10
- package/package.json +1 -1
- package/dist/ActionBar/ActionBar-a41224b2.css +0 -2
- package/dist/ActionBar/ActionBar-a41224b2.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
|
@@ -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, {
|
|
@@ -3,7 +3,7 @@ import { FocusKeys } from '@primer/behaviors';
|
|
|
3
3
|
import { isFocusable } from '@primer/behaviors/utils';
|
|
4
4
|
import React, { useRef, useState } from 'react';
|
|
5
5
|
import { isValidElementType } from 'react-is';
|
|
6
|
-
import {
|
|
6
|
+
import { useMergedRefs } from '../hooks/useMergedRefs.js';
|
|
7
7
|
import { useFocusZone } from '../hooks/useFocusZone.js';
|
|
8
8
|
import { useId } from '../hooks/useId.js';
|
|
9
9
|
import Token from '../Token/Token.js';
|
|
@@ -25,7 +25,7 @@ const overflowCountClassMap = {
|
|
|
25
25
|
|
|
26
26
|
// using forwardRef is important so that other components (ex. Autocomplete) can use the ref
|
|
27
27
|
function TextInputWithTokensInnerComponent(t0, forwardedRef) {
|
|
28
|
-
const $ = c(
|
|
28
|
+
const $ = c(152);
|
|
29
29
|
let IconComponent;
|
|
30
30
|
let LeadingVisual;
|
|
31
31
|
let TrailingVisual;
|
|
@@ -164,8 +164,8 @@ function TextInputWithTokensInnerComponent(t0, forwardedRef) {
|
|
|
164
164
|
role = $[31];
|
|
165
165
|
}
|
|
166
166
|
const ref = useRef(null);
|
|
167
|
+
const mergedRef = useMergedRefs(forwardedRef, ref);
|
|
167
168
|
const selectedValuesDescriptionId = useId();
|
|
168
|
-
useRefObjectAsForwardedRef(forwardedRef, ref);
|
|
169
169
|
const [selectedTokenIndex, setSelectedTokenIndex] = useState();
|
|
170
170
|
const [tokensAreTruncated, setTokensAreTruncated] = useState(Boolean(visibleTokenCount));
|
|
171
171
|
let t6;
|
|
@@ -457,9 +457,9 @@ function TextInputWithTokensInnerComponent(t0, forwardedRef) {
|
|
|
457
457
|
const t32 = validationStatus === "error" ? "true" : "false";
|
|
458
458
|
const t33 = ariaDescribedBy || undefined;
|
|
459
459
|
let t34;
|
|
460
|
-
if ($[80] !== disabled || $[81] !== handleInputBlur || $[82] !== handleInputFocus || $[83] !== handleInputKeyDown || $[84] !== inputPropsRest || $[85] !==
|
|
460
|
+
if ($[80] !== disabled || $[81] !== handleInputBlur || $[82] !== handleInputFocus || $[83] !== handleInputKeyDown || $[84] !== inputPropsRest || $[85] !== mergedRef || $[86] !== role || $[87] !== t32 || $[88] !== t33) {
|
|
461
461
|
t34 = /*#__PURE__*/jsx(UnstyledTextInput, {
|
|
462
|
-
ref:
|
|
462
|
+
ref: mergedRef,
|
|
463
463
|
disabled: disabled,
|
|
464
464
|
onFocus: handleInputFocus,
|
|
465
465
|
onBlur: handleInputBlur,
|
|
@@ -477,42 +477,43 @@ function TextInputWithTokensInnerComponent(t0, forwardedRef) {
|
|
|
477
477
|
$[82] = handleInputFocus;
|
|
478
478
|
$[83] = handleInputKeyDown;
|
|
479
479
|
$[84] = inputPropsRest;
|
|
480
|
-
$[85] =
|
|
481
|
-
$[86] =
|
|
482
|
-
$[87] =
|
|
483
|
-
$[88] =
|
|
480
|
+
$[85] = mergedRef;
|
|
481
|
+
$[86] = role;
|
|
482
|
+
$[87] = t32;
|
|
483
|
+
$[88] = t33;
|
|
484
|
+
$[89] = t34;
|
|
484
485
|
} else {
|
|
485
|
-
t34 = $[
|
|
486
|
+
t34 = $[89];
|
|
486
487
|
}
|
|
487
488
|
let t35;
|
|
488
|
-
if ($[
|
|
489
|
+
if ($[90] !== selectedValuesDescription || $[91] !== selectedValuesDescriptionId || $[92] !== shouldExposeSelectedValuesDescription) {
|
|
489
490
|
t35 = shouldExposeSelectedValuesDescription ? /*#__PURE__*/jsx(VisuallyHidden, {
|
|
490
491
|
id: selectedValuesDescriptionId,
|
|
491
492
|
children: selectedValuesDescription
|
|
492
493
|
}) : null;
|
|
493
|
-
$[
|
|
494
|
-
$[
|
|
495
|
-
$[
|
|
496
|
-
$[
|
|
494
|
+
$[90] = selectedValuesDescription;
|
|
495
|
+
$[91] = selectedValuesDescriptionId;
|
|
496
|
+
$[92] = shouldExposeSelectedValuesDescription;
|
|
497
|
+
$[93] = t35;
|
|
497
498
|
} else {
|
|
498
|
-
t35 = $[
|
|
499
|
+
t35 = $[93];
|
|
499
500
|
}
|
|
500
501
|
let t36;
|
|
501
|
-
if ($[
|
|
502
|
+
if ($[94] !== t34 || $[95] !== t35) {
|
|
502
503
|
t36 = /*#__PURE__*/jsxs("div", {
|
|
503
504
|
className: styles.InputWrapper,
|
|
504
505
|
children: [t34, t35]
|
|
505
506
|
});
|
|
506
|
-
$[
|
|
507
|
-
$[
|
|
508
|
-
$[
|
|
507
|
+
$[94] = t34;
|
|
508
|
+
$[95] = t35;
|
|
509
|
+
$[96] = t36;
|
|
509
510
|
} else {
|
|
510
|
-
t36 = $[
|
|
511
|
+
t36 = $[96];
|
|
511
512
|
}
|
|
512
513
|
let t37;
|
|
513
|
-
if ($[
|
|
514
|
+
if ($[97] !== TokenComponent || $[98] !== disabled || $[99] !== handleTokenBlur || $[100] !== handleTokenFocus || $[101] !== handleTokenRemove || $[102] !== hideTokenRemoveButtons || $[103] !== selectedTokenIndex || $[104] !== size || $[105] !== visibleTokens) {
|
|
514
515
|
let t38;
|
|
515
|
-
if ($[
|
|
516
|
+
if ($[107] !== TokenComponent || $[108] !== disabled || $[109] !== handleTokenBlur || $[110] !== handleTokenFocus || $[111] !== handleTokenRemove || $[112] !== hideTokenRemoveButtons || $[113] !== selectedTokenIndex || $[114] !== size) {
|
|
516
517
|
t38 = (t39, i) => {
|
|
517
518
|
const {
|
|
518
519
|
id,
|
|
@@ -535,75 +536,75 @@ function TextInputWithTokensInnerComponent(t0, forwardedRef) {
|
|
|
535
536
|
...tokenRest
|
|
536
537
|
}, id);
|
|
537
538
|
};
|
|
538
|
-
$[
|
|
539
|
-
$[
|
|
540
|
-
$[
|
|
541
|
-
$[
|
|
542
|
-
$[
|
|
543
|
-
$[
|
|
544
|
-
$[
|
|
545
|
-
$[
|
|
546
|
-
$[
|
|
539
|
+
$[107] = TokenComponent;
|
|
540
|
+
$[108] = disabled;
|
|
541
|
+
$[109] = handleTokenBlur;
|
|
542
|
+
$[110] = handleTokenFocus;
|
|
543
|
+
$[111] = handleTokenRemove;
|
|
544
|
+
$[112] = hideTokenRemoveButtons;
|
|
545
|
+
$[113] = selectedTokenIndex;
|
|
546
|
+
$[114] = size;
|
|
547
|
+
$[115] = t38;
|
|
547
548
|
} else {
|
|
548
|
-
t38 = $[
|
|
549
|
+
t38 = $[115];
|
|
549
550
|
}
|
|
550
551
|
t37 = visibleTokens.map(t38);
|
|
551
|
-
$[
|
|
552
|
-
$[
|
|
553
|
-
$[
|
|
554
|
-
$[
|
|
555
|
-
$[
|
|
556
|
-
$[
|
|
557
|
-
$[
|
|
558
|
-
$[
|
|
559
|
-
$[
|
|
560
|
-
$[
|
|
552
|
+
$[97] = TokenComponent;
|
|
553
|
+
$[98] = disabled;
|
|
554
|
+
$[99] = handleTokenBlur;
|
|
555
|
+
$[100] = handleTokenFocus;
|
|
556
|
+
$[101] = handleTokenRemove;
|
|
557
|
+
$[102] = hideTokenRemoveButtons;
|
|
558
|
+
$[103] = selectedTokenIndex;
|
|
559
|
+
$[104] = size;
|
|
560
|
+
$[105] = visibleTokens;
|
|
561
|
+
$[106] = t37;
|
|
561
562
|
} else {
|
|
562
|
-
t37 = $[
|
|
563
|
+
t37 = $[106];
|
|
563
564
|
}
|
|
564
565
|
let t38;
|
|
565
|
-
if ($[
|
|
566
|
+
if ($[116] !== size || $[117] !== tokens.length || $[118] !== tokensAreTruncated || $[119] !== visibleTokens.length) {
|
|
566
567
|
t38 = tokensAreTruncated && tokens.length - visibleTokens.length ? /*#__PURE__*/jsxs(Text, {
|
|
567
568
|
className: overflowCountClassMap[size],
|
|
568
569
|
"data-component": "TextInputWithTokens.OverflowCount",
|
|
569
570
|
children: ["+", tokens.length - visibleTokens.length]
|
|
570
571
|
}) : null;
|
|
571
|
-
$[
|
|
572
|
-
$[
|
|
573
|
-
$[
|
|
574
|
-
$[
|
|
575
|
-
$[
|
|
572
|
+
$[116] = size;
|
|
573
|
+
$[117] = tokens.length;
|
|
574
|
+
$[118] = tokensAreTruncated;
|
|
575
|
+
$[119] = visibleTokens.length;
|
|
576
|
+
$[120] = t38;
|
|
576
577
|
} else {
|
|
577
|
-
t38 = $[
|
|
578
|
+
t38 = $[120];
|
|
578
579
|
}
|
|
579
580
|
let t39;
|
|
580
|
-
if ($[
|
|
581
|
+
if ($[121] !== preventTokenWrapping || $[122] !== t31 || $[123] !== t36 || $[124] !== t37 || $[125] !== t38) {
|
|
581
582
|
t39 = /*#__PURE__*/jsxs("div", {
|
|
582
583
|
ref: t31,
|
|
583
584
|
className: styles.Container,
|
|
584
585
|
"data-prevent-token-wrapping": preventTokenWrapping,
|
|
585
586
|
children: [t36, t37, t38]
|
|
586
587
|
});
|
|
587
|
-
$[
|
|
588
|
-
$[
|
|
589
|
-
$[
|
|
590
|
-
$[
|
|
591
|
-
$[
|
|
592
|
-
$[
|
|
588
|
+
$[121] = preventTokenWrapping;
|
|
589
|
+
$[122] = t31;
|
|
590
|
+
$[123] = t36;
|
|
591
|
+
$[124] = t37;
|
|
592
|
+
$[125] = t38;
|
|
593
|
+
$[126] = t39;
|
|
593
594
|
} else {
|
|
594
|
-
t39 = $[
|
|
595
|
+
t39 = $[126];
|
|
595
596
|
}
|
|
596
597
|
const t40 = typeof loading === "boolean";
|
|
597
598
|
let t41;
|
|
598
|
-
if ($[
|
|
599
|
+
if ($[127] !== TrailingVisual) {
|
|
599
600
|
t41 = typeof TrailingVisual !== "string" && isValidElementType(TrailingVisual) ? /*#__PURE__*/jsx(TrailingVisual, {}) : TrailingVisual;
|
|
600
|
-
$[
|
|
601
|
-
$[
|
|
601
|
+
$[127] = TrailingVisual;
|
|
602
|
+
$[128] = t41;
|
|
602
603
|
} else {
|
|
603
|
-
t41 = $[
|
|
604
|
+
t41 = $[128];
|
|
604
605
|
}
|
|
605
606
|
let t42;
|
|
606
|
-
if ($[
|
|
607
|
+
if ($[129] !== showTrailingLoadingIndicator || $[130] !== t40 || $[131] !== t41) {
|
|
607
608
|
t42 = /*#__PURE__*/jsx(TextInputInnerVisualSlot, {
|
|
608
609
|
hasLoadingIndicator: t40,
|
|
609
610
|
visualPosition: "trailing",
|
|
@@ -611,15 +612,15 @@ function TextInputWithTokensInnerComponent(t0, forwardedRef) {
|
|
|
611
612
|
componentPrefix: "TextInputWithTokens",
|
|
612
613
|
children: t41
|
|
613
614
|
});
|
|
614
|
-
$[
|
|
615
|
-
$[
|
|
616
|
-
$[
|
|
617
|
-
$[
|
|
615
|
+
$[129] = showTrailingLoadingIndicator;
|
|
616
|
+
$[130] = t40;
|
|
617
|
+
$[131] = t41;
|
|
618
|
+
$[132] = t42;
|
|
618
619
|
} else {
|
|
619
|
-
t42 = $[
|
|
620
|
+
t42 = $[132];
|
|
620
621
|
}
|
|
621
622
|
let t43;
|
|
622
|
-
if ($[
|
|
623
|
+
if ($[133] !== block || $[134] !== contrast || $[135] !== disabled || $[136] !== maxWidthProp || $[137] !== minWidthProp || $[138] !== t21 || $[139] !== t22 || $[140] !== t23 || $[141] !== t24 || $[142] !== t25 || $[143] !== t26 || $[144] !== t27 || $[145] !== t30 || $[146] !== t39 || $[147] !== t42 || $[148] !== validationStatus || $[149] !== variantProp || $[150] !== widthProp) {
|
|
623
624
|
t43 = /*#__PURE__*/jsxs(TextInputWrapper, {
|
|
624
625
|
block: block,
|
|
625
626
|
contrast: contrast,
|
|
@@ -639,27 +640,27 @@ function TextInputWithTokensInnerComponent(t0, forwardedRef) {
|
|
|
639
640
|
"data-component": "TextInputWithTokens",
|
|
640
641
|
children: [t27, t30, t39, t42]
|
|
641
642
|
});
|
|
642
|
-
$[
|
|
643
|
-
$[
|
|
644
|
-
$[
|
|
645
|
-
$[
|
|
646
|
-
$[
|
|
647
|
-
$[
|
|
648
|
-
$[
|
|
649
|
-
$[
|
|
650
|
-
$[
|
|
651
|
-
$[
|
|
652
|
-
$[
|
|
653
|
-
$[
|
|
654
|
-
$[
|
|
655
|
-
$[
|
|
656
|
-
$[
|
|
657
|
-
$[
|
|
658
|
-
$[
|
|
659
|
-
$[
|
|
660
|
-
$[
|
|
643
|
+
$[133] = block;
|
|
644
|
+
$[134] = contrast;
|
|
645
|
+
$[135] = disabled;
|
|
646
|
+
$[136] = maxWidthProp;
|
|
647
|
+
$[137] = minWidthProp;
|
|
648
|
+
$[138] = t21;
|
|
649
|
+
$[139] = t22;
|
|
650
|
+
$[140] = t23;
|
|
651
|
+
$[141] = t24;
|
|
652
|
+
$[142] = t25;
|
|
653
|
+
$[143] = t26;
|
|
654
|
+
$[144] = t27;
|
|
655
|
+
$[145] = t30;
|
|
656
|
+
$[146] = t39;
|
|
657
|
+
$[147] = t42;
|
|
658
|
+
$[148] = validationStatus;
|
|
659
|
+
$[149] = variantProp;
|
|
660
|
+
$[150] = widthProp;
|
|
661
|
+
$[151] = t43;
|
|
661
662
|
} else {
|
|
662
|
-
t43 = $[
|
|
663
|
+
t43 = $[151];
|
|
663
664
|
}
|
|
664
665
|
return t43;
|
|
665
666
|
}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
.prc-Timeline-Timeline-awSoC{display:flex;flex-direction:column}:is(.prc-Timeline-Timeline-awSoC:where([data-clip-sidebar=start]),.prc-Timeline-Timeline-awSoC:where([data-clip-sidebar=both])) .prc-Timeline-TimelineItem-QwDVH:first-child{padding-top:0}:is(:is(.prc-Timeline-Timeline-awSoC:where([data-clip-sidebar=start]),.prc-Timeline-Timeline-awSoC:where([data-clip-sidebar=both])) .prc-Timeline-TimelineItem-QwDVH:first-child):where([data-condensed]):before{top:var(--base-size-12,.75rem)}:is(.prc-Timeline-Timeline-awSoC:where([data-clip-sidebar=end]),.prc-Timeline-Timeline-awSoC:where([data-clip-sidebar=both])) .prc-Timeline-TimelineItem-QwDVH:last-child{padding-bottom:0}:is(:is(.prc-Timeline-Timeline-awSoC:where([data-clip-sidebar=end]),.prc-Timeline-Timeline-awSoC:where([data-clip-sidebar=both])) .prc-Timeline-TimelineItem-QwDVH:last-child):where([data-condensed]):before{height:var(--base-size-12,.75rem)}.prc-Timeline-TimelineItem-QwDVH{display:flex;margin-left:var(--base-size-16,1rem);padding:var(--base-size-16,1rem) 0;position:relative}.prc-Timeline-TimelineItem-QwDVH:before{background-color:var(--borderColor-muted,#d1d9e0b3);bottom:0;content:"";display:block;left:0;position:absolute;top:0;width:2px}.prc-Timeline-TimelineItem-QwDVH:where([data-condensed]){padding-bottom:0;padding-top:var(--base-size-4,.25rem)}.prc-Timeline-TimelineItem-QwDVH:where([data-condensed]):last-child{padding-bottom:var(--base-size-16,1rem)}.prc-Timeline-TimelineItem-QwDVH:where([data-condensed]) .prc-Timeline-TimelineBadge-u0qSm{background-color:var(--bgColor-default,#fff);border:0;color:var(--fgColor-muted,#59636e);height:16px;margin-bottom:var(--base-size-8,.5rem);margin-top:var(--base-size-8,.5rem)}.prc-Timeline-TimelineBadgeWrapper-SZw4k{position:relative;z-index:1}.prc-Timeline-TimelineBadge-u0qSm{align-items:center;background-color:var(--timelineBadge-bgColor,#f6f8fa);border-color:var(--bgColor-default,#fff);border-radius:50%;border-style:solid;border-width:var(--borderWidth-thick,.125rem);color:var(--fgColor-muted,#59636e);display:flex;flex-shrink:0;height:32px;justify-content:center;margin-left:-15px;margin-right:var(--base-size-8,.5rem);overflow:hidden;width:32px}.prc-Timeline-TimelineBadge-u0qSm:where([data-variant]){
|
|
2
|
-
/*# sourceMappingURL=Timeline-
|
|
1
|
+
.prc-Timeline-Timeline-awSoC{display:flex;flex-direction:column}:is(.prc-Timeline-Timeline-awSoC:where([data-clip-sidebar=start]),.prc-Timeline-Timeline-awSoC:where([data-clip-sidebar=both])) .prc-Timeline-TimelineItem-QwDVH:first-child{padding-top:0}:is(:is(.prc-Timeline-Timeline-awSoC:where([data-clip-sidebar=start]),.prc-Timeline-Timeline-awSoC:where([data-clip-sidebar=both])) .prc-Timeline-TimelineItem-QwDVH:first-child):where([data-condensed]):before{top:var(--base-size-12,.75rem)}:is(.prc-Timeline-Timeline-awSoC:where([data-clip-sidebar=end]),.prc-Timeline-Timeline-awSoC:where([data-clip-sidebar=both])) .prc-Timeline-TimelineItem-QwDVH:last-child{padding-bottom:0}:is(:is(.prc-Timeline-Timeline-awSoC:where([data-clip-sidebar=end]),.prc-Timeline-Timeline-awSoC:where([data-clip-sidebar=both])) .prc-Timeline-TimelineItem-QwDVH:last-child):where([data-condensed]):before{height:var(--base-size-12,.75rem)}.prc-Timeline-TimelineItem-QwDVH{display:flex;margin-left:var(--base-size-16,1rem);padding:var(--base-size-16,1rem) 0;position:relative}.prc-Timeline-TimelineItem-QwDVH:before{background-color:var(--borderColor-muted,#d1d9e0b3);bottom:0;content:"";display:block;left:0;position:absolute;top:0;width:2px}.prc-Timeline-TimelineItem-QwDVH:where([data-condensed]){padding-bottom:0;padding-top:var(--base-size-4,.25rem)}.prc-Timeline-TimelineItem-QwDVH:where([data-condensed]):last-child{padding-bottom:var(--base-size-16,1rem)}.prc-Timeline-TimelineItem-QwDVH:where([data-condensed]) .prc-Timeline-TimelineBadge-u0qSm{background-color:var(--bgColor-default,#fff);border:0;color:var(--fgColor-muted,#59636e);height:16px;margin-bottom:var(--base-size-8,.5rem);margin-top:var(--base-size-8,.5rem)}.prc-Timeline-TimelineBadgeWrapper-SZw4k{position:relative;z-index:1}.prc-Timeline-TimelineBadge-u0qSm{align-items:center;background-color:var(--timelineBadge-bgColor,#f6f8fa);border-color:var(--bgColor-default,#fff);border-radius:50%;border-style:solid;border-width:var(--borderWidth-thick,.125rem);color:var(--fgColor-muted,#59636e);display:flex;flex-shrink:0;height:32px;justify-content:center;margin-left:-15px;margin-right:var(--base-size-8,.5rem);overflow:hidden;width:32px}.prc-Timeline-TimelineBadge-u0qSm:where([data-variant]){color:var(--fgColor-onEmphasis,#fff)}.prc-Timeline-TimelineBadge-u0qSm:where([data-variant=accent]){background-color:var(--bgColor-accent-emphasis,#0969da)}.prc-Timeline-TimelineBadge-u0qSm:where([data-variant=success]){background-color:var(--bgColor-success-emphasis,#1f883d)}.prc-Timeline-TimelineBadge-u0qSm:where([data-variant=attention]){background-color:var(--bgColor-attention-emphasis,#9a6700)}.prc-Timeline-TimelineBadge-u0qSm:where([data-variant=severe]){background-color:var(--bgColor-severe-emphasis,#bc4c00)}.prc-Timeline-TimelineBadge-u0qSm:where([data-variant=danger]){background-color:var(--bgColor-danger-emphasis,#cf222e)}.prc-Timeline-TimelineBadge-u0qSm:where([data-variant=done]){background-color:var(--bgColor-done-emphasis,#8250df)}.prc-Timeline-TimelineBadge-u0qSm:where([data-variant=open]){background-color:var(--bgColor-open-emphasis,#1f883d)}.prc-Timeline-TimelineBadge-u0qSm:where([data-variant=closed]){background-color:var(--bgColor-closed-emphasis,#cf222e)}.prc-Timeline-TimelineBadge-u0qSm:where([data-variant=sponsors]){background-color:var(--bgColor-sponsors-emphasis,#bf3989)}.prc-Timeline-TimelineBody-tjOtb{color:var(--fgColor-muted,#59636e);flex:auto;font-size:var(--text-body-size-medium,.875rem);margin-top:calc(var(--base-size-4,.25rem) + 1px);max-width:100%;min-width:0}.prc-Timeline-TimelineBreak-X8eti{background-color:var(--bgColor-default,#fff);border:0;border-top:var(--borderWidth-thicker,.25rem) solid var(--borderColor-default,#d1d9e0);height:var(--base-size-24,1.5rem);margin:0;margin-bottom:calc(var(--base-size-16,1rem)*-1);margin-left:0;position:relative;z-index:1}.prc-Timeline-TimelineBreak-X8eti:has(+[data-condensed]){margin-bottom:calc(var(--base-size-12,.75rem)*-1)}
|
|
2
|
+
/*# sourceMappingURL=Timeline-05decc91.css.map */
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/Timeline/Timeline.module.css.js"],"names":[],"mappings":"AAAA,6BACE,YAAa,CACb,qBAuBF,CAnBI,6KACE,aAKF,CAHE,iNACE,8BACF,CAMF,0KACE,gBAKF,CAHE,8MACE,iCACF,CAKN,iCAEE,YAAa,CAEb,oCAAgC,CADhC,kCAA8B,CAF9B,iBAkCF,CA7BE,wCASE,mDAA0C,CAN1C,QAAS,CAIT,UAAW,CAFX,aAAc,CADd,MAAO,CAHP,iBAAkB,CAClB,KAAM,CAIN,SAIF,CAEA,yDAEE,gBAAiB,CADjB,qCAeF,CAZE,oEACE,uCACF,CAEA,2FAKE,4CAAwC,CACxC,QAAS,CAFT,kCAA2B,CAH3B,WAAY,CAEZ,sCAAiC,CADjC,mCAKF,CAIJ,yCACE,iBAAkB,CAClB,SACF,CAEA,kCAkBE,kBAAmB,CANnB,qDAA8C,CAE9C,wCAAoC,CAGpC,iBAAkB,CAFlB,kBAAmB,CACnB,6CAAsC,CAPtC,kCAA2B,CAR3B,YAAa,CAMb,aAAc,CAJd,WAAY,CAgBZ,sBAAuB,CAbvB,iBAAkB,CAFlB,qCAAgC,CAIhC,eAAgB,CANhB,UA0DF,CAvCE,wDACE,oCACF,CAEA,+DACE,uDACF,CAEA,gEACE,wDACF,CAEA,kEACE,0DACF,CAEA,+DACE,uDACF,CAEA,+DACE,uDACF,CAEA,6DACE,qDACF,CAEA,6DACE,qDACF,CAEA,+DACE,uDACF,CAEA,iEACE,yDACF,CAGF,iCAME,kCAA2B,CAC3B,SAAU,CAFV,8CAAuC,CADvC,gDAA0C,CAF1C,cAAe,CADf,WAOF,CAEA,kCAOE,4CAAwC,CACxC,QAAS,CACT,qFAAuE,CANvE,iCAA2B,CAC3B,QAAS,CACT,+CAA6C,CAC7C,aAAc,CALd,iBAAkB,CAClB,SAaF,CAHE,yDACE,iDACF","file":"Timeline-05decc91.css","sourcesContent":[".Timeline {\n display: flex;\n flex-direction: column;\n\n &:where([data-clip-sidebar='start']),\n &:where([data-clip-sidebar='both']) {\n .TimelineItem:first-child {\n padding-top: 0;\n\n &:where([data-condensed])::before {\n top: var(--base-size-12);\n }\n }\n }\n\n &:where([data-clip-sidebar='end']),\n &:where([data-clip-sidebar='both']) {\n .TimelineItem:last-child {\n padding-bottom: 0;\n\n &:where([data-condensed])::before {\n height: var(--base-size-12);\n }\n }\n }\n}\n\n.TimelineItem {\n position: relative;\n display: flex;\n padding: var(--base-size-16) 0;\n margin-left: var(--base-size-16);\n\n &::before {\n position: absolute;\n top: 0;\n bottom: 0;\n left: 0;\n display: block;\n width: 2px;\n content: '';\n /* stylelint-disable-next-line primer/colors */\n background-color: var(--borderColor-muted);\n }\n\n &:where([data-condensed]) {\n padding-top: var(--base-size-4);\n padding-bottom: 0;\n\n &:last-child {\n padding-bottom: var(--base-size-16);\n }\n\n .TimelineBadge {\n height: 16px;\n margin-top: var(--base-size-8);\n margin-bottom: var(--base-size-8);\n color: var(--fgColor-muted);\n background-color: var(--bgColor-default);\n border: 0;\n }\n }\n}\n\n.TimelineBadgeWrapper {\n position: relative;\n z-index: 1;\n}\n\n.TimelineBadge {\n display: flex;\n width: 32px;\n height: 32px;\n margin-right: var(--base-size-8);\n /* stylelint-disable-next-line primer/spacing */\n margin-left: -15px;\n flex-shrink: 0;\n overflow: hidden;\n color: var(--fgColor-muted);\n\n /* TODOl not quite sure if this is the correct migration for this line */\n background-color: var(--timelineBadge-bgColor);\n /* stylelint-disable-next-line primer/colors */\n border-color: var(--bgColor-default);\n border-style: solid;\n border-width: var(--borderWidth-thick);\n border-radius: 50%;\n align-items: center;\n justify-content: center;\n\n &:where([data-variant]) {\n color: var(--fgColor-onEmphasis);\n }\n\n &:where([data-variant='accent']) {\n background-color: var(--bgColor-accent-emphasis);\n }\n\n &:where([data-variant='success']) {\n background-color: var(--bgColor-success-emphasis);\n }\n\n &:where([data-variant='attention']) {\n background-color: var(--bgColor-attention-emphasis);\n }\n\n &:where([data-variant='severe']) {\n background-color: var(--bgColor-severe-emphasis);\n }\n\n &:where([data-variant='danger']) {\n background-color: var(--bgColor-danger-emphasis);\n }\n\n &:where([data-variant='done']) {\n background-color: var(--bgColor-done-emphasis);\n }\n\n &:where([data-variant='open']) {\n background-color: var(--bgColor-open-emphasis);\n }\n\n &:where([data-variant='closed']) {\n background-color: var(--bgColor-closed-emphasis);\n }\n\n &:where([data-variant='sponsors']) {\n background-color: var(--bgColor-sponsors-emphasis);\n }\n}\n\n.TimelineBody {\n min-width: 0;\n max-width: 100%;\n /* stylelint-disable-next-line primer/spacing */\n margin-top: calc(var(--base-size-4) + 1px);\n font-size: var(--text-body-size-medium);\n color: var(--fgColor-muted);\n flex: auto;\n}\n\n.TimelineBreak {\n position: relative;\n z-index: 1;\n height: var(--base-size-24);\n margin: 0;\n margin-bottom: calc(-1 * var(--base-size-16));\n margin-left: 0;\n background-color: var(--bgColor-default);\n border: 0;\n border-top: var(--borderWidth-thicker) solid var(--borderColor-default);\n\n /* stylelint-disable-next-line selector-pseudo-class-disallowed-list -- scoped to CSS Module, audited (github/github-ui#17224) */\n &:has(+ [data-condensed]) {\n margin-bottom: calc(-1 * var(--base-size-12));\n }\n}\n"]}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import './Timeline-
|
|
1
|
+
import './Timeline-05decc91.css';
|
|
2
2
|
|
|
3
3
|
var classes = {"Timeline":"prc-Timeline-Timeline-awSoC","TimelineItem":"prc-Timeline-TimelineItem-QwDVH","TimelineBadge":"prc-Timeline-TimelineBadge-u0qSm","TimelineBadgeWrapper":"prc-Timeline-TimelineBadgeWrapper-SZw4k","TimelineBody":"prc-Timeline-TimelineBody-tjOtb","TimelineBreak":"prc-Timeline-TimelineBreak-X8eti"};
|
|
4
4
|
|
|
@@ -2,7 +2,7 @@ import { c } from 'react-compiler-runtime';
|
|
|
2
2
|
import React, { forwardRef, useRef } from 'react';
|
|
3
3
|
import { IconButton } from '../../Button/IconButton.js';
|
|
4
4
|
import useDialog from '../../hooks/useDialog.js';
|
|
5
|
-
import {
|
|
5
|
+
import { useMergedRefs } from '../../hooks/useMergedRefs.js';
|
|
6
6
|
import { XIcon } from '@primer/octicons-react';
|
|
7
7
|
import { clsx } from 'clsx';
|
|
8
8
|
import classes from './Dialog.module.css.js';
|
|
@@ -78,7 +78,7 @@ function _temp(ch) {
|
|
|
78
78
|
return typeof ch === "string";
|
|
79
79
|
}
|
|
80
80
|
const Dialog = /*#__PURE__*/forwardRef((t0, forwardedRef) => {
|
|
81
|
-
const $ = c(
|
|
81
|
+
const $ = c(26);
|
|
82
82
|
let children;
|
|
83
83
|
let className;
|
|
84
84
|
let initialFocusRef;
|
|
@@ -121,7 +121,7 @@ const Dialog = /*#__PURE__*/forwardRef((t0, forwardedRef) => {
|
|
|
121
121
|
const Component = t2 === undefined ? "div" : t2;
|
|
122
122
|
const overlayRef = useRef(null);
|
|
123
123
|
const modalRef = useRef(null);
|
|
124
|
-
|
|
124
|
+
const mergedRef = useMergedRefs(forwardedRef, modalRef);
|
|
125
125
|
const closeButtonRef = useRef(null);
|
|
126
126
|
let t3;
|
|
127
127
|
if ($[9] !== onDismiss || $[10] !== returnFocusRef) {
|
|
@@ -161,14 +161,14 @@ const Dialog = /*#__PURE__*/forwardRef((t0, forwardedRef) => {
|
|
|
161
161
|
getDialogProps
|
|
162
162
|
} = useDialog(t4);
|
|
163
163
|
let t5;
|
|
164
|
-
if ($[17] !== Component || $[18] !== children || $[19] !== className || $[20] !== getDialogProps || $[21] !== isOpen || $[22] !==
|
|
164
|
+
if ($[17] !== Component || $[18] !== children || $[19] !== className || $[20] !== getDialogProps || $[21] !== isOpen || $[22] !== mergedRef || $[23] !== onCloseClick || $[24] !== props) {
|
|
165
165
|
t5 = isOpen ? /*#__PURE__*/jsxs(Fragment, {
|
|
166
166
|
children: [/*#__PURE__*/jsx("span", {
|
|
167
167
|
className: classes.Overlay,
|
|
168
168
|
ref: overlayRef
|
|
169
169
|
}), /*#__PURE__*/jsxs(Component, {
|
|
170
170
|
tabIndex: -1,
|
|
171
|
-
ref:
|
|
171
|
+
ref: mergedRef,
|
|
172
172
|
role: "dialog",
|
|
173
173
|
"aria-modal": "true",
|
|
174
174
|
...props,
|
|
@@ -190,11 +190,12 @@ const Dialog = /*#__PURE__*/forwardRef((t0, forwardedRef) => {
|
|
|
190
190
|
$[19] = className;
|
|
191
191
|
$[20] = getDialogProps;
|
|
192
192
|
$[21] = isOpen;
|
|
193
|
-
$[22] =
|
|
194
|
-
$[23] =
|
|
195
|
-
$[24] =
|
|
193
|
+
$[22] = mergedRef;
|
|
194
|
+
$[23] = onCloseClick;
|
|
195
|
+
$[24] = props;
|
|
196
|
+
$[25] = t5;
|
|
196
197
|
} else {
|
|
197
|
-
t5 = $[
|
|
198
|
+
t5 = $[25];
|
|
198
199
|
}
|
|
199
200
|
return t5;
|
|
200
201
|
});
|
|
@@ -10,7 +10,7 @@ export type { BlankslateProps } from '../Blankslate';
|
|
|
10
10
|
export { ButtonBase } from '../Button';
|
|
11
11
|
export type { ButtonBaseProps } from '../Button';
|
|
12
12
|
export { Card } from '../Card';
|
|
13
|
-
export type { CardProps, CardIconProps, CardImageProps, CardHeadingProps, CardDescriptionProps,
|
|
13
|
+
export type { CardProps, CardIconProps, CardImageProps, CardHeadingProps, CardDescriptionProps, CardActionProps, CardMetadataProps, } from '../Card';
|
|
14
14
|
export { DataTable, Table, createColumnHelper } from '../DataTable';
|
|
15
15
|
export type { DataTableProps, TableProps, TableHeadProps, TableBodyProps, TableRowProps, TableHeaderProps, TableCellProps, TableContainerProps, TableTitleProps, TableSubtitleProps, TableActionsProps, Column, CellAlignment, ColumnWidth, UniqueRow, ObjectPaths, } from '../DataTable';
|
|
16
16
|
export * from '../Dialog';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/experimental/index.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAIH,OAAO,EAAC,UAAU,EAAC,MAAM,eAAe,CAAA;AACxC,YAAY,EAAC,eAAe,EAAC,MAAM,eAAe,CAAA;AAElD,OAAO,EAAC,UAAU,EAAC,MAAM,WAAW,CAAA;AACpC,YAAY,EAAC,eAAe,EAAC,MAAM,WAAW,CAAA;AAE9C,OAAO,EAAC,IAAI,EAAC,MAAM,SAAS,CAAA;AAC5B,YAAY,EACV,SAAS,EACT,aAAa,EACb,cAAc,EACd,gBAAgB,EAChB,oBAAoB,EACpB,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/experimental/index.ts"],"names":[],"mappings":"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"}
|
|
@@ -29,7 +29,7 @@ import type { ForwardedRef, Ref as StandardRef } from 'react';
|
|
|
29
29
|
* return <button ref={combinedRef} />
|
|
30
30
|
* }
|
|
31
31
|
*/
|
|
32
|
-
export declare function useMergedRefs<T>(refA: Ref<T | null>, refB: Ref<T | null>): (value: T | null) => () => void;
|
|
32
|
+
export declare function useMergedRefs<T>(refA: Ref<T | null>, refB: Ref<T | null>): (value: T | null) => (() => void) | undefined;
|
|
33
33
|
type CleanupFunction = () => void;
|
|
34
34
|
/**
|
|
35
35
|
* React 19 supports callback refs that can return a cleanup function. If a cleanup function is returned, the
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useMergedRefs.d.ts","sourceRoot":"","sources":["../../src/hooks/useMergedRefs.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAC,YAAY,EAAE,GAAG,IAAI,WAAW,EAAmB,MAAM,OAAO,CAAA;
|
|
1
|
+
{"version":3,"file":"useMergedRefs.d.ts","sourceRoot":"","sources":["../../src/hooks/useMergedRefs.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAC,YAAY,EAAE,GAAG,IAAI,WAAW,EAAmB,MAAM,OAAO,CAAA;AAa7E;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA6BG;AACH,wBAAgB,aAAa,CAAC,CAAC,EAAE,IAAI,EAAE,GAAG,CAAC,CAAC,GAAG,IAAI,CAAC,EAAE,IAAI,EAAE,GAAG,CAAC,CAAC,GAAG,IAAI,CAAC,WAE7D,CAAC,GAAG,IAAI,8BAsBnB;AAED,KAAK,eAAe,GAAG,MAAM,IAAI,CAAA;AAEjC;;;GAGG;AAEH,KAAK,kBAAkB,CAAC,CAAC,IAAI;IAC3B,cAAc,CAAC,QAAQ,EAAE,CAAC,GAAG,IAAI,GAAG,eAAe,CAAA;CACpD,CAAC,gBAAgB,CAAC,CAAA;AAEnB;;;;;;;GAOG;AACH,KAAK,GAAG,CAAC,CAAC,IAAI,YAAY,CAAC,CAAC,CAAC,GAAG,kBAAkB,CAAC,CAAC,CAAC,GAAG,WAAW,CAAC,CAAC,CAAC,GAAG,SAAS,CAAA"}
|
|
@@ -1,5 +1,15 @@
|
|
|
1
1
|
import { c } from 'react-compiler-runtime';
|
|
2
2
|
import 'react';
|
|
3
|
+
import { reactMajorVersion, isExperimentalReactVersion } from '../utils/environment.js';
|
|
4
|
+
|
|
5
|
+
/**
|
|
6
|
+
* Cleanup functions for refs were introduced in React 19. For feature detection,
|
|
7
|
+
* we look to see if current version of React is >= 19 or if it is an
|
|
8
|
+
* experimental version of React
|
|
9
|
+
*
|
|
10
|
+
* @see https://react.dev/blog/2024/12/05/react-19
|
|
11
|
+
*/
|
|
12
|
+
const supportsRefCleanup = reactMajorVersion >= 19 || isExperimentalReactVersion;
|
|
3
13
|
|
|
4
14
|
/**
|
|
5
15
|
* Combine two refs of matching type (typically an external or forwarded ref and an internal `useRef` object or
|
|
@@ -38,6 +48,9 @@ function useMergedRefs(refA, refB) {
|
|
|
38
48
|
t0 = value => {
|
|
39
49
|
const cleanupA = setRef(refA, value);
|
|
40
50
|
const cleanupB = setRef(refB, value);
|
|
51
|
+
if (!supportsRefCleanup) {
|
|
52
|
+
return;
|
|
53
|
+
}
|
|
41
54
|
return () => {
|
|
42
55
|
if (cleanupA) {
|
|
43
56
|
cleanupA();
|
|
@@ -19,6 +19,7 @@ export type CheckboxOrRadioGroupProps = {
|
|
|
19
19
|
* If true, the user must make a selection before the owning form can be submitted
|
|
20
20
|
*/
|
|
21
21
|
required?: boolean;
|
|
22
|
+
'data-component'?: string;
|
|
22
23
|
};
|
|
23
24
|
export type { CheckboxOrRadioGroupLabelProps } from './CheckboxOrRadioGroupLabel';
|
|
24
25
|
declare const _default: React.FC<React.PropsWithChildren<CheckboxOrRadioGroupProps>> & {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CheckboxOrRadioGroup.d.ts","sourceRoot":"","sources":["../../../../src/internal/components/CheckboxOrRadioGroup/CheckboxOrRadioGroup.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAazB,MAAM,MAAM,yBAAyB,GAAG;IACtC,oCAAoC;IACpC,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB;;OAEG;IACH,CAAC,iBAAiB,CAAC,CAAC,EAAE,MAAM,CAAA;IAC5B;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB;;;OAGG;IACH,EAAE,CAAC,EAAE,MAAM,CAAA;IACX;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAA;
|
|
1
|
+
{"version":3,"file":"CheckboxOrRadioGroup.d.ts","sourceRoot":"","sources":["../../../../src/internal/components/CheckboxOrRadioGroup/CheckboxOrRadioGroup.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAazB,MAAM,MAAM,yBAAyB,GAAG;IACtC,oCAAoC;IACpC,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB;;OAEG;IACH,CAAC,iBAAiB,CAAC,CAAC,EAAE,MAAM,CAAA;IAC5B;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB;;;OAGG;IACH,EAAE,CAAC,EAAE,MAAM,CAAA;IACX;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,gBAAgB,CAAC,EAAE,MAAM,CAAA;CAC1B,CAAA;AA4HD,YAAY,EAAC,8BAA8B,EAAC,MAAM,6BAA6B,CAAA;;;;;;;;;;AAC/E,wBAIE"}
|
|
@@ -18,7 +18,8 @@ const CheckboxOrRadioGroup = ({
|
|
|
18
18
|
disabled = false,
|
|
19
19
|
id: idProp,
|
|
20
20
|
required = false,
|
|
21
|
-
className
|
|
21
|
+
className,
|
|
22
|
+
'data-component': dataComponentProp
|
|
22
23
|
}) => {
|
|
23
24
|
const [slots, rest] = useSlots(children, {
|
|
24
25
|
caption: CheckboxOrRadioGroupCaption,
|
|
@@ -43,10 +44,12 @@ const CheckboxOrRadioGroup = ({
|
|
|
43
44
|
disabled,
|
|
44
45
|
required,
|
|
45
46
|
captionId,
|
|
46
|
-
validationMessageId
|
|
47
|
+
validationMessageId,
|
|
48
|
+
parentName: dataComponentProp
|
|
47
49
|
},
|
|
48
50
|
children: /*#__PURE__*/jsxs("div", {
|
|
49
51
|
children: [/*#__PURE__*/jsxs(Component, {
|
|
52
|
+
"data-component": dataComponentProp,
|
|
50
53
|
className: clsx(className, classes.GroupFieldset),
|
|
51
54
|
"data-validation": validationChild ? '' : undefined,
|
|
52
55
|
...(labelChild ? {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CheckboxOrRadioGroupCaption.d.ts","sourceRoot":"","sources":["../../../../src/internal/components/CheckboxOrRadioGroup/CheckboxOrRadioGroupCaption.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAKzB,OAAO,KAAK,EAAC,gBAAgB,EAAC,MAAM,sBAAsB,CAAA;AAE1D,KAAK,gCAAgC,GAAG,KAAK,CAAC,iBAAiB,CAAC;IAAC,SAAS,CAAC,EAAE,MAAM,CAAA;CAAC,CAAC,CAAA;AAErF,QAAA,MAAM,2BAA2B,EAAE,gBAAgB,CAAC,gCAAgC,
|
|
1
|
+
{"version":3,"file":"CheckboxOrRadioGroupCaption.d.ts","sourceRoot":"","sources":["../../../../src/internal/components/CheckboxOrRadioGroup/CheckboxOrRadioGroupCaption.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAKzB,OAAO,KAAK,EAAC,gBAAgB,EAAC,MAAM,sBAAsB,CAAA;AAE1D,KAAK,gCAAgC,GAAG,KAAK,CAAC,iBAAiB,CAAC;IAAC,SAAS,CAAC,EAAE,MAAM,CAAA;CAAC,CAAC,CAAA;AAErF,QAAA,MAAM,2BAA2B,EAAE,gBAAgB,CAAC,gCAAgC,CAWnF,CAAA;AAED,eAAe,2BAA2B,CAAA"}
|
|
@@ -10,11 +10,13 @@ const CheckboxOrRadioGroupCaption = ({
|
|
|
10
10
|
children
|
|
11
11
|
}) => {
|
|
12
12
|
const {
|
|
13
|
-
captionId
|
|
13
|
+
captionId,
|
|
14
|
+
parentName
|
|
14
15
|
} = React.useContext(CheckboxOrRadioGroupContext);
|
|
15
16
|
return /*#__PURE__*/jsx(Text, {
|
|
16
17
|
className: clsx(className, classes.CheckboxOrRadioGroupCaption),
|
|
17
18
|
id: captionId,
|
|
19
|
+
"data-component": parentName ? `${parentName}.Caption` : undefined,
|
|
18
20
|
children: children
|
|
19
21
|
});
|
|
20
22
|
};
|
|
@@ -3,6 +3,7 @@ import type { CheckboxOrRadioGroupProps } from './CheckboxOrRadioGroup';
|
|
|
3
3
|
export type CheckboxOrRadioGroupContext = {
|
|
4
4
|
validationMessageId?: string;
|
|
5
5
|
captionId?: string;
|
|
6
|
+
parentName?: string;
|
|
6
7
|
} & CheckboxOrRadioGroupProps;
|
|
7
8
|
declare const CheckboxOrRadioGroupContext: React.Context<CheckboxOrRadioGroupContext>;
|
|
8
9
|
export default CheckboxOrRadioGroupContext;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CheckboxOrRadioGroupContext.d.ts","sourceRoot":"","sources":["../../../../src/internal/components/CheckboxOrRadioGroup/CheckboxOrRadioGroupContext.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,KAAK,EAAC,yBAAyB,EAAC,MAAM,wBAAwB,CAAA;AAErE,MAAM,MAAM,2BAA2B,GAAG;IACxC,mBAAmB,CAAC,EAAE,MAAM,CAAA;IAC5B,SAAS,CAAC,EAAE,MAAM,CAAA;
|
|
1
|
+
{"version":3,"file":"CheckboxOrRadioGroupContext.d.ts","sourceRoot":"","sources":["../../../../src/internal/components/CheckboxOrRadioGroup/CheckboxOrRadioGroupContext.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,KAAK,EAAC,yBAAyB,EAAC,MAAM,wBAAwB,CAAA;AAErE,MAAM,MAAM,2BAA2B,GAAG;IACxC,mBAAmB,CAAC,EAAE,MAAM,CAAA;IAC5B,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,UAAU,CAAC,EAAE,MAAM,CAAA;CACpB,GAAG,yBAAyB,CAAA;AAE7B,QAAA,MAAM,2BAA2B,4CAAuD,CAAA;AAExF,eAAe,2BAA2B,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CheckboxOrRadioGroupLabel.d.ts","sourceRoot":"","sources":["../../../../src/internal/components/CheckboxOrRadioGroup/CheckboxOrRadioGroupLabel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAMzB,OAAO,KAAK,EAAC,gBAAgB,EAAC,MAAM,sBAAsB,CAAA;AAE1D,MAAM,MAAM,8BAA8B,GAAG;IAC3C,oCAAoC;IACpC,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB;;OAEG;IACH,cAAc,CAAC,EAAE,OAAO,CAAA;CACzB,CAAA;AAED,QAAA,MAAM,yBAAyB,EAAE,gBAAgB,CAAC,KAAK,CAAC,iBAAiB,CAAC,8BAA8B,CAAC,
|
|
1
|
+
{"version":3,"file":"CheckboxOrRadioGroupLabel.d.ts","sourceRoot":"","sources":["../../../../src/internal/components/CheckboxOrRadioGroup/CheckboxOrRadioGroupLabel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAMzB,OAAO,KAAK,EAAC,gBAAgB,EAAC,MAAM,sBAAsB,CAAA;AAE1D,MAAM,MAAM,8BAA8B,GAAG;IAC3C,oCAAoC;IACpC,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB;;OAEG;IACH,cAAc,CAAC,EAAE,OAAO,CAAA;CACzB,CAAA;AAED,QAAA,MAAM,yBAAyB,EAAE,gBAAgB,CAAC,KAAK,CAAC,iBAAiB,CAAC,8BAA8B,CAAC,CAyBxG,CAAA;AAED,eAAe,yBAAyB,CAAA"}
|
|
@@ -13,13 +13,15 @@ const CheckboxOrRadioGroupLabel = ({
|
|
|
13
13
|
}) => {
|
|
14
14
|
const {
|
|
15
15
|
required,
|
|
16
|
-
disabled
|
|
16
|
+
disabled,
|
|
17
|
+
parentName
|
|
17
18
|
} = React.useContext(CheckboxOrRadioGroupContext);
|
|
18
19
|
return /*#__PURE__*/jsx(VisuallyHidden, {
|
|
19
20
|
className: clsx(className, classes.RadioGroupLabel),
|
|
20
21
|
isVisible: !visuallyHidden,
|
|
21
22
|
title: required ? 'required field' : undefined,
|
|
22
23
|
"data-label-disabled": disabled ? '' : undefined,
|
|
24
|
+
"data-component": parentName ? `${parentName}.Label` : undefined,
|
|
23
25
|
children: required ? /*#__PURE__*/jsxs(Stack, {
|
|
24
26
|
direction: "horizontal",
|
|
25
27
|
gap: "none",
|
package/dist/internal/components/CheckboxOrRadioGroup/CheckboxOrRadioGroupValidation.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CheckboxOrRadioGroupValidation.d.ts","sourceRoot":"","sources":["../../../../src/internal/components/CheckboxOrRadioGroup/CheckboxOrRadioGroupValidation.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,KAAK,EAAC,oBAAoB,EAAC,MAAM,2CAA2C,CAAA;AAEnF,OAAO,KAAK,EAAC,gBAAgB,EAAC,MAAM,sBAAsB,CAAA;AAE1D,MAAM,MAAM,mCAAmC,GAAG;IAChD,8DAA8D;IAC9D,OAAO,EAAE,oBAAoB,CAAA;CAC9B,CAAA;AAED,QAAA,MAAM,8BAA8B,EAAE,gBAAgB,CACpD,KAAK,CAAC,iBAAiB,CAAC,mCAAmC,CAAC,
|
|
1
|
+
{"version":3,"file":"CheckboxOrRadioGroupValidation.d.ts","sourceRoot":"","sources":["../../../../src/internal/components/CheckboxOrRadioGroup/CheckboxOrRadioGroupValidation.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,KAAK,EAAC,oBAAoB,EAAC,MAAM,2CAA2C,CAAA;AAEnF,OAAO,KAAK,EAAC,gBAAgB,EAAC,MAAM,sBAAsB,CAAA;AAE1D,MAAM,MAAM,mCAAmC,GAAG;IAChD,8DAA8D;IAC9D,OAAO,EAAE,oBAAoB,CAAA;CAC9B,CAAA;AAED,QAAA,MAAM,8BAA8B,EAAE,gBAAgB,CACpD,KAAK,CAAC,iBAAiB,CAAC,mCAAmC,CAAC,CAY7D,CAAA;AAED,eAAe,8BAA8B,CAAA"}
|
|
@@ -8,11 +8,13 @@ const CheckboxOrRadioGroupValidation = ({
|
|
|
8
8
|
variant
|
|
9
9
|
}) => {
|
|
10
10
|
const {
|
|
11
|
-
validationMessageId = ''
|
|
11
|
+
validationMessageId = '',
|
|
12
|
+
parentName
|
|
12
13
|
} = React.useContext(CheckboxOrRadioGroupContext);
|
|
13
14
|
return /*#__PURE__*/jsx(InputValidation, {
|
|
14
15
|
validationStatus: variant,
|
|
15
16
|
id: validationMessageId,
|
|
17
|
+
"data-component": parentName ? `${parentName}.Validation` : undefined,
|
|
16
18
|
children: children
|
|
17
19
|
});
|
|
18
20
|
};
|
|
@@ -1,10 +1,11 @@
|
|
|
1
1
|
import type React from 'react';
|
|
2
2
|
import type { FormValidationStatus } from '../../utils/types/FormValidationStatus';
|
|
3
|
-
type Props = {
|
|
3
|
+
type Props = React.HTMLAttributes<HTMLElement> & {
|
|
4
4
|
className?: string;
|
|
5
5
|
id: string;
|
|
6
6
|
validationStatus?: FormValidationStatus;
|
|
7
7
|
style?: React.CSSProperties;
|
|
8
|
+
'data-component'?: string;
|
|
8
9
|
};
|
|
9
10
|
declare const InputValidation: React.FC<React.PropsWithChildren<Props>>;
|
|
10
11
|
export default InputValidation;
|