@primer/react 0.0.0-20260318234026 → 0.0.0-20260319050322
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
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
# @primer/react
|
|
2
2
|
|
|
3
|
-
## 0.0.0-
|
|
3
|
+
## 0.0.0-20260319050322
|
|
4
4
|
|
|
5
5
|
### Minor Changes
|
|
6
6
|
|
|
@@ -11,7 +11,7 @@
|
|
|
11
11
|
- Deprecates `useRefObjectAsForwardedRef`; see doc comment for migration instructions
|
|
12
12
|
- Deprecates `useProvidedRefOrCreate`; see doc comment for migration instructions
|
|
13
13
|
|
|
14
|
-
- [#7623](https://github.com/primer/react/pull/7623) [`
|
|
14
|
+
- [#7623](https://github.com/primer/react/pull/7623) [`42847d1`](https://github.com/primer/react/commit/42847d1bb943c2db6d2309dfd604e8d3ab55d387) Thanks [@copilot-swe-agent](https://github.com/apps/copilot-swe-agent)! - `IconButton`: `keybindingHint` now accepts `string[]` in addition to `string`. Multiple hints are rendered joined with "or".
|
|
15
15
|
|
|
16
16
|
### Patch Changes
|
|
17
17
|
|
|
@@ -19,6 +19,8 @@
|
|
|
19
19
|
|
|
20
20
|
- [#7510](https://github.com/primer/react/pull/7510) [`8fa988b`](https://github.com/primer/react/commit/8fa988ba613117874657af722ef6de768b0e0eb8) Thanks [@francinelucca](https://github.com/francinelucca)! - chore: ensure max-height does not surpass viewport height in Overlay, ActionMenu under feature flag
|
|
21
21
|
|
|
22
|
+
- [#7682](https://github.com/primer/react/pull/7682) [`8aed331`](https://github.com/primer/react/commit/8aed331f9dcb8c51d86bf531f7e331a6ccd23d9a) Thanks [@llastflowers](https://github.com/llastflowers)! - Update CheckboxOrRadioGroup.tsx to add `required` announcement
|
|
23
|
+
|
|
22
24
|
## 38.16.0
|
|
23
25
|
|
|
24
26
|
### Minor Changes
|
|
@@ -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;CACnB,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;CACnB,CAAA;AAyHD,YAAY,EAAC,8BAA8B,EAAC,MAAM,6BAA6B,CAAA;;;;;;;;;;AAC/E,wBAIE"}
|
|
@@ -10,7 +10,7 @@ import { useSlots } from '../../../hooks/useSlots.js';
|
|
|
10
10
|
import classes from './CheckboxOrRadioGroup.module.css.js';
|
|
11
11
|
import { clsx } from 'clsx';
|
|
12
12
|
import { isSlot } from '../../../utils/is-slot.js';
|
|
13
|
-
import { jsx, jsxs } from 'react/jsx-runtime';
|
|
13
|
+
import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
|
|
14
14
|
|
|
15
15
|
const CheckboxOrRadioGroup = ({
|
|
16
16
|
'aria-labelledby': ariaLabelledby,
|
|
@@ -31,6 +31,7 @@ const CheckboxOrRadioGroup = ({
|
|
|
31
31
|
const id = useId(idProp);
|
|
32
32
|
const validationMessageId = validationChild ? `${id}-validationMessage` : undefined;
|
|
33
33
|
const captionId = captionChild ? `${id}-caption` : undefined;
|
|
34
|
+
const requiredMessageId = required ? `${id}-requiredMessage` : undefined;
|
|
34
35
|
if (!labelChild && !ariaLabelledby) {
|
|
35
36
|
// eslint-disable-next-line no-console
|
|
36
37
|
console.warn('A choice group must be labelled using a `CheckboxOrRadioGroup.Label` child, or by passing `aria-labelledby` to the CheckboxOrRadioGroup component.');
|
|
@@ -61,19 +62,27 @@ const CheckboxOrRadioGroup = ({
|
|
|
61
62
|
jsxs("legend", {
|
|
62
63
|
className: classes.GroupLegend,
|
|
63
64
|
"data-legend-visible": isLegendVisible ? '' : undefined,
|
|
64
|
-
children: [slots.label,
|
|
65
|
+
children: [slots.label, required && /*#__PURE__*/jsx(VisuallyHidden, {
|
|
66
|
+
children: ", required"
|
|
67
|
+
}), slots.caption, /*#__PURE__*/React.isValidElement(slots.validation) && slots.validation.props.children && /*#__PURE__*/jsx(VisuallyHidden, {
|
|
65
68
|
children: slots.validation.props.children
|
|
66
69
|
})]
|
|
67
|
-
}) :
|
|
70
|
+
}) :
|
|
71
|
+
/*#__PURE__*/
|
|
68
72
|
/*
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
+
If CheckboxOrRadioGroup.Label wasn't passed as a child, we don't render a <legend>
|
|
74
|
+
but we still want to render a caption
|
|
75
|
+
*/
|
|
76
|
+
jsxs(Fragment, {
|
|
77
|
+
children: [slots.caption, required && requiredMessageId && /*#__PURE__*/jsx(VisuallyHidden, {
|
|
78
|
+
id: requiredMessageId,
|
|
79
|
+
children: "Required"
|
|
80
|
+
})]
|
|
81
|
+
}), /*#__PURE__*/jsx("div", {
|
|
73
82
|
className: classes.Body,
|
|
74
83
|
...(!labelChild ? {
|
|
75
84
|
['aria-labelledby']: ariaLabelledby,
|
|
76
|
-
['aria-describedby']: [validationMessageId, captionId].filter(Boolean).join(' '),
|
|
85
|
+
['aria-describedby']: [validationMessageId, captionId, requiredMessageId].filter(Boolean).join(' '),
|
|
77
86
|
as: 'div',
|
|
78
87
|
role: 'group'
|
|
79
88
|
} : {}),
|
package/package.json
CHANGED