@fluentui/react-radio 9.1.8 → 9.1.9
Sign up to get free protection for your applications and to get access to all the features.
- package/CHANGELOG.json +46 -1
- package/CHANGELOG.md +16 -2
- package/dist/index.d.ts +2 -2
- package/lib/components/Radio/useRadio.js +3 -0
- package/lib/components/Radio/useRadio.js.map +1 -1
- package/lib/components/RadioGroup/RadioGroup.types.js.map +1 -1
- package/lib/contexts/useRadioGroupContextValues.js +2 -1
- package/lib/contexts/useRadioGroupContextValues.js.map +1 -1
- package/lib-commonjs/components/Radio/useRadio.js +3 -1
- package/lib-commonjs/components/Radio/useRadio.js.map +1 -1
- package/lib-commonjs/contexts/useRadioGroupContextValues.js +2 -1
- package/lib-commonjs/contexts/useRadioGroupContextValues.js.map +1 -1
- package/package.json +6 -6
package/CHANGELOG.json
CHANGED
@@ -2,7 +2,52 @@
|
|
2
2
|
"name": "@fluentui/react-radio",
|
3
3
|
"entries": [
|
4
4
|
{
|
5
|
-
"date": "
|
5
|
+
"date": "Wed, 12 Apr 2023 09:28:16 GMT",
|
6
|
+
"tag": "@fluentui/react-radio_v9.1.9",
|
7
|
+
"version": "9.1.9",
|
8
|
+
"comments": {
|
9
|
+
"patch": [
|
10
|
+
{
|
11
|
+
"author": "behowell@microsoft.com",
|
12
|
+
"package": "@fluentui/react-radio",
|
13
|
+
"commit": "865a699268e85c55ba9f26c2b4a109161e48576c",
|
14
|
+
"comment": "fix: Have RadioGroup forward aria-describedby to each of the Radio items inside"
|
15
|
+
},
|
16
|
+
{
|
17
|
+
"author": "beachball",
|
18
|
+
"package": "@fluentui/react-radio",
|
19
|
+
"comment": "Bump @fluentui/react-context-selector to v9.1.17",
|
20
|
+
"commit": "b48890859f5ce28fe12fd40f6bda26ed486c5e47"
|
21
|
+
},
|
22
|
+
{
|
23
|
+
"author": "beachball",
|
24
|
+
"package": "@fluentui/react-radio",
|
25
|
+
"comment": "Bump @fluentui/react-field to v9.0.0-beta.2",
|
26
|
+
"commit": "b48890859f5ce28fe12fd40f6bda26ed486c5e47"
|
27
|
+
},
|
28
|
+
{
|
29
|
+
"author": "beachball",
|
30
|
+
"package": "@fluentui/react-radio",
|
31
|
+
"comment": "Bump @fluentui/react-label to v9.1.8",
|
32
|
+
"commit": "b48890859f5ce28fe12fd40f6bda26ed486c5e47"
|
33
|
+
},
|
34
|
+
{
|
35
|
+
"author": "beachball",
|
36
|
+
"package": "@fluentui/react-radio",
|
37
|
+
"comment": "Bump @fluentui/react-tabster to v9.6.4",
|
38
|
+
"commit": "b48890859f5ce28fe12fd40f6bda26ed486c5e47"
|
39
|
+
},
|
40
|
+
{
|
41
|
+
"author": "beachball",
|
42
|
+
"package": "@fluentui/react-radio",
|
43
|
+
"comment": "Bump @fluentui/react-utilities to v9.7.4",
|
44
|
+
"commit": "b48890859f5ce28fe12fd40f6bda26ed486c5e47"
|
45
|
+
}
|
46
|
+
]
|
47
|
+
}
|
48
|
+
},
|
49
|
+
{
|
50
|
+
"date": "Fri, 07 Apr 2023 00:01:40 GMT",
|
6
51
|
"tag": "@fluentui/react-radio_v9.1.8",
|
7
52
|
"version": "9.1.8",
|
8
53
|
"comments": {
|
package/CHANGELOG.md
CHANGED
@@ -1,12 +1,26 @@
|
|
1
1
|
# Change Log - @fluentui/react-radio
|
2
2
|
|
3
|
-
This log was last generated on
|
3
|
+
This log was last generated on Wed, 12 Apr 2023 09:28:16 GMT and should not be manually modified.
|
4
4
|
|
5
5
|
<!-- Start content -->
|
6
6
|
|
7
|
+
## [9.1.9](https://github.com/microsoft/fluentui/tree/@fluentui/react-radio_v9.1.9)
|
8
|
+
|
9
|
+
Wed, 12 Apr 2023 09:28:16 GMT
|
10
|
+
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-radio_v9.1.8..@fluentui/react-radio_v9.1.9)
|
11
|
+
|
12
|
+
### Patches
|
13
|
+
|
14
|
+
- fix: Have RadioGroup forward aria-describedby to each of the Radio items inside ([PR #27456](https://github.com/microsoft/fluentui/pull/27456) by behowell@microsoft.com)
|
15
|
+
- Bump @fluentui/react-context-selector to v9.1.17 ([commit](https://github.com/microsoft/fluentui/commit/b48890859f5ce28fe12fd40f6bda26ed486c5e47) by beachball)
|
16
|
+
- Bump @fluentui/react-field to v9.0.0-beta.2 ([commit](https://github.com/microsoft/fluentui/commit/b48890859f5ce28fe12fd40f6bda26ed486c5e47) by beachball)
|
17
|
+
- Bump @fluentui/react-label to v9.1.8 ([commit](https://github.com/microsoft/fluentui/commit/b48890859f5ce28fe12fd40f6bda26ed486c5e47) by beachball)
|
18
|
+
- Bump @fluentui/react-tabster to v9.6.4 ([commit](https://github.com/microsoft/fluentui/commit/b48890859f5ce28fe12fd40f6bda26ed486c5e47) by beachball)
|
19
|
+
- Bump @fluentui/react-utilities to v9.7.4 ([commit](https://github.com/microsoft/fluentui/commit/b48890859f5ce28fe12fd40f6bda26ed486c5e47) by beachball)
|
20
|
+
|
7
21
|
## [9.1.8](https://github.com/microsoft/fluentui/tree/@fluentui/react-radio_v9.1.8)
|
8
22
|
|
9
|
-
|
23
|
+
Fri, 07 Apr 2023 00:01:40 GMT
|
10
24
|
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-radio_v9.1.7..@fluentui/react-radio_v9.1.8)
|
11
25
|
|
12
26
|
### Patches
|
package/dist/index.d.ts
CHANGED
@@ -27,7 +27,7 @@ export declare const RadioGroup: ForwardRefComponent<RadioGroupProps>;
|
|
27
27
|
|
28
28
|
export declare const radioGroupClassNames: SlotClassNames<RadioGroupSlots>;
|
29
29
|
|
30
|
-
export declare type RadioGroupContextValue = Pick<RadioGroupProps, 'name' | 'value' | 'defaultValue' | 'disabled' | 'layout' | 'required'>;
|
30
|
+
export declare type RadioGroupContextValue = Pick<RadioGroupProps, 'name' | 'value' | 'defaultValue' | 'disabled' | 'layout' | 'required' | 'aria-describedby'>;
|
31
31
|
|
32
32
|
export declare type RadioGroupContextValues = {
|
33
33
|
radioGroup: RadioGroupContextValue;
|
@@ -110,7 +110,7 @@ export declare type RadioGroupSlots = {
|
|
110
110
|
/**
|
111
111
|
* State used in rendering RadioGroup
|
112
112
|
*/
|
113
|
-
export declare type RadioGroupState = ComponentState<RadioGroupSlots> & Required<Pick<RadioGroupProps, 'layout'>> &
|
113
|
+
export declare type RadioGroupState = ComponentState<RadioGroupSlots> & Required<Pick<RadioGroupProps, 'layout'>> & Pick<RadioGroupProps, 'name' | 'value' | 'defaultValue' | 'disabled' | 'layout' | 'required'>;
|
114
114
|
|
115
115
|
/**
|
116
116
|
* Data for the onChange event for Radio.
|
@@ -20,6 +20,7 @@ export const useRadio_unstable = (props, ref) => {
|
|
20
20
|
const disabledGroup = useRadioGroupContext_unstable(ctx => ctx.disabled);
|
21
21
|
const layout = useRadioGroupContext_unstable(ctx => ctx.layout);
|
22
22
|
const requiredGroup = useRadioGroupContext_unstable(ctx => ctx.required);
|
23
|
+
const describedByGroup = useRadioGroupContext_unstable(ctx => ctx['aria-describedby']);
|
23
24
|
const {
|
24
25
|
name = nameGroup,
|
25
26
|
checked = value !== undefined ? value === props.value : undefined,
|
@@ -27,6 +28,7 @@ export const useRadio_unstable = (props, ref) => {
|
|
27
28
|
labelPosition = layout === 'horizontal-stacked' ? 'below' : 'after',
|
28
29
|
disabled = disabledGroup,
|
29
30
|
required = requiredGroup,
|
31
|
+
'aria-describedby': ariaDescribedBy = describedByGroup,
|
30
32
|
onChange
|
31
33
|
} = props;
|
32
34
|
const nativeProps = getPartitionedNativeProps({
|
@@ -52,6 +54,7 @@ export const useRadio_unstable = (props, ref) => {
|
|
52
54
|
defaultChecked,
|
53
55
|
disabled,
|
54
56
|
required,
|
57
|
+
'aria-describedby': ariaDescribedBy,
|
55
58
|
...nativeProps.primary
|
56
59
|
}
|
57
60
|
});
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"names":["React","CircleFilled","Label","getPartitionedNativeProps","mergeCallbacks","resolveShorthand","useId","useRadioGroupContext_unstable","useFocusWithin","useRadio_unstable","props","ref","nameGroup","ctx","name","value","defaultValue","disabledGroup","disabled","layout","requiredGroup","required","checked","undefined","defaultChecked","labelPosition","onChange","nativeProps","primarySlotTagName","excludedPropNames","root","defaultProps","input","type","id","primary","ev","currentTarget","label","htmlFor","indicator","children","createElement","components"],"sources":["../../../src/components/Radio/useRadio.tsx"],"sourcesContent":["import * as React from 'react';\nimport { CircleFilled } from '@fluentui/react-icons';\nimport { Label } from '@fluentui/react-label';\nimport { getPartitionedNativeProps, mergeCallbacks, resolveShorthand, useId } from '@fluentui/react-utilities';\nimport { useRadioGroupContext_unstable } from '../../contexts/RadioGroupContext';\nimport { useFocusWithin } from '@fluentui/react-tabster';\nimport type { RadioProps, RadioState } from './Radio.types';\n\n/**\n * Create the state required to render Radio.\n *\n * The returned state can be modified with hooks such as useRadioStyles_unstable,\n * before being passed to renderRadio_unstable.\n *\n * @param props - props from this instance of Radio\n * @param ref - reference to `<input>` element of Radio\n */\nexport const useRadio_unstable = (props: RadioProps, ref: React.Ref<HTMLInputElement>): RadioState => {\n const nameGroup = useRadioGroupContext_unstable(ctx => ctx.name);\n const value = useRadioGroupContext_unstable(ctx => ctx.value);\n const defaultValue = useRadioGroupContext_unstable(ctx => ctx.defaultValue);\n const disabledGroup = useRadioGroupContext_unstable(ctx => ctx.disabled);\n const layout = useRadioGroupContext_unstable(ctx => ctx.layout);\n const requiredGroup = useRadioGroupContext_unstable(ctx => ctx.required);\n\n const {\n name = nameGroup,\n checked = value !== undefined ? value === props.value : undefined,\n defaultChecked = defaultValue !== undefined ? defaultValue === props.value : undefined,\n labelPosition = layout === 'horizontal-stacked' ? 'below' : 'after',\n disabled = disabledGroup,\n required = requiredGroup,\n onChange,\n } = props;\n\n const nativeProps = getPartitionedNativeProps({\n props,\n primarySlotTagName: 'input',\n excludedPropNames: ['checked', 'defaultChecked', 'onChange'],\n });\n\n const root = resolveShorthand(props.root, {\n required: true,\n defaultProps: {\n ref: useFocusWithin<HTMLSpanElement>(),\n ...nativeProps.root,\n },\n });\n\n const input = resolveShorthand(props.input, {\n required: true,\n defaultProps: {\n ref,\n type: 'radio',\n id: useId('radio-', nativeProps.primary.id),\n name,\n checked,\n defaultChecked,\n disabled,\n required,\n ...nativeProps.primary,\n },\n });\n\n input.onChange = mergeCallbacks(input.onChange, ev => onChange?.(ev, { value: ev.currentTarget.value }));\n\n const label = resolveShorthand(props.label, {\n defaultProps: {\n htmlFor: input.id,\n disabled,\n },\n });\n\n const indicator = resolveShorthand(props.indicator, {\n required: true,\n defaultProps: {\n 'aria-hidden': true,\n children: <CircleFilled />,\n },\n });\n\n return {\n labelPosition,\n components: {\n root: 'span',\n input: 'input',\n label: Label,\n indicator: 'div',\n },\n root,\n input,\n label,\n indicator,\n };\n};\n"],"mappings":"AAAA,YAAYA,KAAA,MAAW;AACvB,SAASC,YAAY,QAAQ;AAC7B,SAASC,KAAK,QAAQ;AACtB,SAASC,yBAAyB,EAAEC,cAAc,EAAEC,gBAAgB,EAAEC,KAAK,QAAQ;AACnF,SAASC,6BAA6B,QAAQ;AAC9C,SAASC,cAAc,QAAQ;AAG/B;;;;;;;;;AASA,OAAO,MAAMC,iBAAA,GAAoBA,CAACC,KAAA,EAAmBC,GAAA,KAAiD;EACpG,MAAMC,SAAA,GAAYL,6BAAA,CAA8BM,GAAA,IAAOA,GAAA,CAAIC,IAAI;EAC/D,MAAMC,KAAA,GAAQR,6BAAA,CAA8BM,GAAA,IAAOA,GAAA,CAAIE,KAAK;EAC5D,MAAMC,YAAA,GAAeT,6BAAA,CAA8BM,GAAA,IAAOA,GAAA,CAAIG,YAAY;EAC1E,MAAMC,aAAA,GAAgBV,6BAAA,CAA8BM,GAAA,IAAOA,GAAA,CAAIK,QAAQ;EACvE,MAAMC,MAAA,GAASZ,6BAAA,CAA8BM,GAAA,IAAOA,GAAA,CAAIM,MAAM;EAC9D,MAAMC,aAAA,GAAgBb,6BAAA,CAA8BM,GAAA,IAAOA,GAAA,CAAIQ,QAAQ;
|
1
|
+
{"version":3,"names":["React","CircleFilled","Label","getPartitionedNativeProps","mergeCallbacks","resolveShorthand","useId","useRadioGroupContext_unstable","useFocusWithin","useRadio_unstable","props","ref","nameGroup","ctx","name","value","defaultValue","disabledGroup","disabled","layout","requiredGroup","required","describedByGroup","checked","undefined","defaultChecked","labelPosition","ariaDescribedBy","onChange","nativeProps","primarySlotTagName","excludedPropNames","root","defaultProps","input","type","id","primary","ev","currentTarget","label","htmlFor","indicator","children","createElement","components"],"sources":["../../../src/components/Radio/useRadio.tsx"],"sourcesContent":["import * as React from 'react';\nimport { CircleFilled } from '@fluentui/react-icons';\nimport { Label } from '@fluentui/react-label';\nimport { getPartitionedNativeProps, mergeCallbacks, resolveShorthand, useId } from '@fluentui/react-utilities';\nimport { useRadioGroupContext_unstable } from '../../contexts/RadioGroupContext';\nimport { useFocusWithin } from '@fluentui/react-tabster';\nimport type { RadioProps, RadioState } from './Radio.types';\n\n/**\n * Create the state required to render Radio.\n *\n * The returned state can be modified with hooks such as useRadioStyles_unstable,\n * before being passed to renderRadio_unstable.\n *\n * @param props - props from this instance of Radio\n * @param ref - reference to `<input>` element of Radio\n */\nexport const useRadio_unstable = (props: RadioProps, ref: React.Ref<HTMLInputElement>): RadioState => {\n const nameGroup = useRadioGroupContext_unstable(ctx => ctx.name);\n const value = useRadioGroupContext_unstable(ctx => ctx.value);\n const defaultValue = useRadioGroupContext_unstable(ctx => ctx.defaultValue);\n const disabledGroup = useRadioGroupContext_unstable(ctx => ctx.disabled);\n const layout = useRadioGroupContext_unstable(ctx => ctx.layout);\n const requiredGroup = useRadioGroupContext_unstable(ctx => ctx.required);\n const describedByGroup = useRadioGroupContext_unstable(ctx => ctx['aria-describedby']);\n\n const {\n name = nameGroup,\n checked = value !== undefined ? value === props.value : undefined,\n defaultChecked = defaultValue !== undefined ? defaultValue === props.value : undefined,\n labelPosition = layout === 'horizontal-stacked' ? 'below' : 'after',\n disabled = disabledGroup,\n required = requiredGroup,\n 'aria-describedby': ariaDescribedBy = describedByGroup,\n onChange,\n } = props;\n\n const nativeProps = getPartitionedNativeProps({\n props,\n primarySlotTagName: 'input',\n excludedPropNames: ['checked', 'defaultChecked', 'onChange'],\n });\n\n const root = resolveShorthand(props.root, {\n required: true,\n defaultProps: {\n ref: useFocusWithin<HTMLSpanElement>(),\n ...nativeProps.root,\n },\n });\n\n const input = resolveShorthand(props.input, {\n required: true,\n defaultProps: {\n ref,\n type: 'radio',\n id: useId('radio-', nativeProps.primary.id),\n name,\n checked,\n defaultChecked,\n disabled,\n required,\n 'aria-describedby': ariaDescribedBy,\n ...nativeProps.primary,\n },\n });\n\n input.onChange = mergeCallbacks(input.onChange, ev => onChange?.(ev, { value: ev.currentTarget.value }));\n\n const label = resolveShorthand(props.label, {\n defaultProps: {\n htmlFor: input.id,\n disabled,\n },\n });\n\n const indicator = resolveShorthand(props.indicator, {\n required: true,\n defaultProps: {\n 'aria-hidden': true,\n children: <CircleFilled />,\n },\n });\n\n return {\n labelPosition,\n components: {\n root: 'span',\n input: 'input',\n label: Label,\n indicator: 'div',\n },\n root,\n input,\n label,\n indicator,\n };\n};\n"],"mappings":"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"}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"names":["React"],"sources":["../../../src/components/RadioGroup/RadioGroup.types.ts"],"sourcesContent":["import * as React from 'react';\nimport type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\n\nexport type RadioGroupSlots = {\n /**\n * The radio group root.\n */\n root: NonNullable<Slot<'div'>>;\n};\n\nexport type RadioGroupProps = Omit<ComponentProps<Partial<RadioGroupSlots>>, 'onChange'> & {\n /**\n * The name of this radio group. This name is applied to all Radio items inside this group.\n *\n * If no name is provided, one will be generated so that all of the Radio items have the same name.\n */\n name?: string;\n\n /**\n * The selected Radio item in this group.\n *\n * This should be the `value` prop of one of the Radio items inside this group.\n */\n value?: string;\n\n /**\n * The default selected Radio item in this group.\n *\n * This should be the `value` prop of one of the Radio items inside this group.\n */\n defaultValue?: string;\n\n /**\n * Callback when the selected Radio item changes.\n */\n onChange?: (ev: React.FormEvent<HTMLDivElement>, data: RadioGroupOnChangeData) => void;\n\n /**\n * How the radio items are laid out in the group.\n *\n * @default vertical\n */\n layout?: 'vertical' | 'horizontal' | 'horizontal-stacked';\n\n /**\n * Disable all Radio items in this group.\n */\n disabled?: boolean;\n\n /**\n * Require a selection in this group. Adds the `required` prop to all child Radio items.\n */\n required?: boolean;\n};\n\n/**\n * Data for the onChange event for RadioGroup.\n */\nexport type RadioGroupOnChangeData = {\n /**\n * The value of the newly selected Radio item.\n */\n value: string;\n};\n\n/**\n * State used in rendering RadioGroup\n */\nexport type RadioGroupState = ComponentState<RadioGroupSlots> &\n Required<Pick<RadioGroupProps, 'layout'>> &\n
|
1
|
+
{"version":3,"names":["React"],"sources":["../../../src/components/RadioGroup/RadioGroup.types.ts"],"sourcesContent":["import * as React from 'react';\nimport type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\n\nexport type RadioGroupSlots = {\n /**\n * The radio group root.\n */\n root: NonNullable<Slot<'div'>>;\n};\n\nexport type RadioGroupProps = Omit<ComponentProps<Partial<RadioGroupSlots>>, 'onChange'> & {\n /**\n * The name of this radio group. This name is applied to all Radio items inside this group.\n *\n * If no name is provided, one will be generated so that all of the Radio items have the same name.\n */\n name?: string;\n\n /**\n * The selected Radio item in this group.\n *\n * This should be the `value` prop of one of the Radio items inside this group.\n */\n value?: string;\n\n /**\n * The default selected Radio item in this group.\n *\n * This should be the `value` prop of one of the Radio items inside this group.\n */\n defaultValue?: string;\n\n /**\n * Callback when the selected Radio item changes.\n */\n onChange?: (ev: React.FormEvent<HTMLDivElement>, data: RadioGroupOnChangeData) => void;\n\n /**\n * How the radio items are laid out in the group.\n *\n * @default vertical\n */\n layout?: 'vertical' | 'horizontal' | 'horizontal-stacked';\n\n /**\n * Disable all Radio items in this group.\n */\n disabled?: boolean;\n\n /**\n * Require a selection in this group. Adds the `required` prop to all child Radio items.\n */\n required?: boolean;\n};\n\n/**\n * Data for the onChange event for RadioGroup.\n */\nexport type RadioGroupOnChangeData = {\n /**\n * The value of the newly selected Radio item.\n */\n value: string;\n};\n\n/**\n * State used in rendering RadioGroup\n */\nexport type RadioGroupState = ComponentState<RadioGroupSlots> &\n Required<Pick<RadioGroupProps, 'layout'>> &\n Pick<RadioGroupProps, 'name' | 'value' | 'defaultValue' | 'disabled' | 'layout' | 'required'>;\n\nexport type RadioGroupContextValue = Pick<\n RadioGroupProps,\n 'name' | 'value' | 'defaultValue' | 'disabled' | 'layout' | 'required' | 'aria-describedby'\n>;\n\nexport type RadioGroupContextValues = {\n radioGroup: RadioGroupContextValue;\n};\n"],"mappings":"AAAA,YAAYA,KAAA,MAAW"}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"names":["useRadioGroupContextValues","state","name","value","defaultValue","disabled","layout","required","radioGroup"],"sources":["../../src/contexts/useRadioGroupContextValues.ts"],"sourcesContent":["import type { RadioGroupContextValue, RadioGroupContextValues, RadioGroupState } from '../RadioGroup';\n\nexport const useRadioGroupContextValues = (state: RadioGroupState): RadioGroupContextValues => {\n const { name, value, defaultValue, disabled, layout, required } = state;\n\n const radioGroup: RadioGroupContextValue = {\n name,\n value,\n defaultValue,\n disabled,\n layout,\n required,\n };\n\n return { radioGroup };\n};\n"],"mappings":"AAEA,OAAO,MAAMA,0BAAA,GAA8BC,KAAA,IAAoD;EAC7F,MAAM;IAAEC,IAAA;IAAMC,KAAA;IAAOC,YAAA;IAAcC,QAAA;IAAUC,MAAA;IAAQC;EAAQ,CAAE,GAAGN,KAAA;EAElE,MAAMO,UAAA,GAAqC;IACzCN,IAAA;IACAC,KAAA;IACAC,YAAA;IACAC,QAAA;IACAC,MAAA;IACAC;
|
1
|
+
{"version":3,"names":["useRadioGroupContextValues","state","name","value","defaultValue","disabled","layout","required","radioGroup","root"],"sources":["../../src/contexts/useRadioGroupContextValues.ts"],"sourcesContent":["import type { RadioGroupContextValue, RadioGroupContextValues, RadioGroupState } from '../RadioGroup';\n\nexport const useRadioGroupContextValues = (state: RadioGroupState): RadioGroupContextValues => {\n const { name, value, defaultValue, disabled, layout, required } = state;\n\n const radioGroup: RadioGroupContextValue = {\n name,\n value,\n defaultValue,\n disabled,\n layout,\n required,\n 'aria-describedby': state.root['aria-describedby'],\n };\n\n return { radioGroup };\n};\n"],"mappings":"AAEA,OAAO,MAAMA,0BAAA,GAA8BC,KAAA,IAAoD;EAC7F,MAAM;IAAEC,IAAA;IAAMC,KAAA;IAAOC,YAAA;IAAcC,QAAA;IAAUC,MAAA;IAAQC;EAAQ,CAAE,GAAGN,KAAA;EAElE,MAAMO,UAAA,GAAqC;IACzCN,IAAA;IACAC,KAAA;IACAC,YAAA;IACAC,QAAA;IACAC,MAAA;IACAC,QAAA;IACA,oBAAoBN,KAAA,CAAMQ,IAAI,CAAC;EACjC;EAEA,OAAO;IAAED;EAAW;AACtB"}
|
@@ -20,7 +20,8 @@ const useRadio_unstable = (props, ref)=>{
|
|
20
20
|
const disabledGroup = (0, _radioGroupContext.useRadioGroupContext_unstable)((ctx)=>ctx.disabled);
|
21
21
|
const layout = (0, _radioGroupContext.useRadioGroupContext_unstable)((ctx)=>ctx.layout);
|
22
22
|
const requiredGroup = (0, _radioGroupContext.useRadioGroupContext_unstable)((ctx)=>ctx.required);
|
23
|
-
const
|
23
|
+
const describedByGroup = (0, _radioGroupContext.useRadioGroupContext_unstable)((ctx)=>ctx['aria-describedby']);
|
24
|
+
const { name =nameGroup , checked =value !== undefined ? value === props.value : undefined , defaultChecked =defaultValue !== undefined ? defaultValue === props.value : undefined , labelPosition =layout === 'horizontal-stacked' ? 'below' : 'after' , disabled =disabledGroup , required =requiredGroup , 'aria-describedby': ariaDescribedBy = describedByGroup , onChange } = props;
|
24
25
|
const nativeProps = (0, _reactUtilities.getPartitionedNativeProps)({
|
25
26
|
props,
|
26
27
|
primarySlotTagName: 'input',
|
@@ -48,6 +49,7 @@ const useRadio_unstable = (props, ref)=>{
|
|
48
49
|
defaultChecked,
|
49
50
|
disabled,
|
50
51
|
required,
|
52
|
+
'aria-describedby': ariaDescribedBy,
|
51
53
|
...nativeProps.primary
|
52
54
|
}
|
53
55
|
});
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../../../lib/components/Radio/useRadio.js"],"sourcesContent":["import * as React from 'react';\nimport { CircleFilled } from '@fluentui/react-icons';\nimport { Label } from '@fluentui/react-label';\nimport { getPartitionedNativeProps, mergeCallbacks, resolveShorthand, useId } from '@fluentui/react-utilities';\nimport { useRadioGroupContext_unstable } from '../../contexts/RadioGroupContext';\nimport { useFocusWithin } from '@fluentui/react-tabster';\n/**\n * Create the state required to render Radio.\n *\n * The returned state can be modified with hooks such as useRadioStyles_unstable,\n * before being passed to renderRadio_unstable.\n *\n * @param props - props from this instance of Radio\n * @param ref - reference to `<input>` element of Radio\n */\nexport const useRadio_unstable = (props, ref) => {\n const nameGroup = useRadioGroupContext_unstable(ctx => ctx.name);\n const value = useRadioGroupContext_unstable(ctx => ctx.value);\n const defaultValue = useRadioGroupContext_unstable(ctx => ctx.defaultValue);\n const disabledGroup = useRadioGroupContext_unstable(ctx => ctx.disabled);\n const layout = useRadioGroupContext_unstable(ctx => ctx.layout);\n const requiredGroup = useRadioGroupContext_unstable(ctx => ctx.required);\n const {\n name = nameGroup,\n checked = value !== undefined ? value === props.value : undefined,\n defaultChecked = defaultValue !== undefined ? defaultValue === props.value : undefined,\n labelPosition = layout === 'horizontal-stacked' ? 'below' : 'after',\n disabled = disabledGroup,\n required = requiredGroup,\n onChange\n } = props;\n const nativeProps = getPartitionedNativeProps({\n props,\n primarySlotTagName: 'input',\n excludedPropNames: ['checked', 'defaultChecked', 'onChange']\n });\n const root = resolveShorthand(props.root, {\n required: true,\n defaultProps: {\n ref: useFocusWithin(),\n ...nativeProps.root\n }\n });\n const input = resolveShorthand(props.input, {\n required: true,\n defaultProps: {\n ref,\n type: 'radio',\n id: useId('radio-', nativeProps.primary.id),\n name,\n checked,\n defaultChecked,\n disabled,\n required,\n ...nativeProps.primary\n }\n });\n input.onChange = mergeCallbacks(input.onChange, ev => {\n return onChange === null || onChange === void 0 ? void 0 : onChange(ev, {\n value: ev.currentTarget.value\n });\n });\n const label = resolveShorthand(props.label, {\n defaultProps: {\n htmlFor: input.id,\n disabled\n }\n });\n const indicator = resolveShorthand(props.indicator, {\n required: true,\n defaultProps: {\n 'aria-hidden': true,\n children: /*#__PURE__*/React.createElement(CircleFilled, null)\n }\n });\n return {\n labelPosition,\n components: {\n root: 'span',\n input: 'input',\n label: Label,\n indicator: 'div'\n },\n root,\n input,\n label,\n indicator\n };\n};\n//# sourceMappingURL=useRadio.js.map"],"names":["useRadio_unstable","props","ref","nameGroup","useRadioGroupContext_unstable","ctx","name","value","defaultValue","disabledGroup","disabled","layout","requiredGroup","required","checked","undefined","defaultChecked","labelPosition","onChange","nativeProps","getPartitionedNativeProps","primarySlotTagName","excludedPropNames","root","resolveShorthand","defaultProps","useFocusWithin","input","type","id","useId","primary","mergeCallbacks","ev","currentTarget","label","htmlFor","indicator","children","React","createElement","CircleFilled","components","Label"],"mappings":";;;;+BAeaA;;aAAAA;;;6DAfU;4BACM;4BACP;gCAC6D;mCACrC;8BACf;AAUxB,MAAMA,oBAAoB,CAACC,OAAOC,MAAQ;IAC/C,MAAMC,YAAYC,IAAAA,gDAA6B,EAACC,CAAAA,MAAOA,IAAIC,IAAI;IAC/D,MAAMC,QAAQH,IAAAA,gDAA6B,EAACC,CAAAA,MAAOA,IAAIE,KAAK;IAC5D,MAAMC,eAAeJ,IAAAA,gDAA6B,EAACC,CAAAA,MAAOA,IAAIG,YAAY;IAC1E,MAAMC,gBAAgBL,IAAAA,gDAA6B,EAACC,CAAAA,MAAOA,IAAIK,QAAQ;IACvE,MAAMC,SAASP,IAAAA,gDAA6B,EAACC,CAAAA,MAAOA,IAAIM,MAAM;IAC9D,MAAMC,gBAAgBR,IAAAA,gDAA6B,EAACC,CAAAA,MAAOA,IAAIQ,QAAQ;IACvE,MAAM,
|
1
|
+
{"version":3,"sources":["../../../lib/components/Radio/useRadio.js"],"sourcesContent":["import * as React from 'react';\nimport { CircleFilled } from '@fluentui/react-icons';\nimport { Label } from '@fluentui/react-label';\nimport { getPartitionedNativeProps, mergeCallbacks, resolveShorthand, useId } from '@fluentui/react-utilities';\nimport { useRadioGroupContext_unstable } from '../../contexts/RadioGroupContext';\nimport { useFocusWithin } from '@fluentui/react-tabster';\n/**\n * Create the state required to render Radio.\n *\n * The returned state can be modified with hooks such as useRadioStyles_unstable,\n * before being passed to renderRadio_unstable.\n *\n * @param props - props from this instance of Radio\n * @param ref - reference to `<input>` element of Radio\n */\nexport const useRadio_unstable = (props, ref) => {\n const nameGroup = useRadioGroupContext_unstable(ctx => ctx.name);\n const value = useRadioGroupContext_unstable(ctx => ctx.value);\n const defaultValue = useRadioGroupContext_unstable(ctx => ctx.defaultValue);\n const disabledGroup = useRadioGroupContext_unstable(ctx => ctx.disabled);\n const layout = useRadioGroupContext_unstable(ctx => ctx.layout);\n const requiredGroup = useRadioGroupContext_unstable(ctx => ctx.required);\n const describedByGroup = useRadioGroupContext_unstable(ctx => ctx['aria-describedby']);\n const {\n name = nameGroup,\n checked = value !== undefined ? value === props.value : undefined,\n defaultChecked = defaultValue !== undefined ? defaultValue === props.value : undefined,\n labelPosition = layout === 'horizontal-stacked' ? 'below' : 'after',\n disabled = disabledGroup,\n required = requiredGroup,\n 'aria-describedby': ariaDescribedBy = describedByGroup,\n onChange\n } = props;\n const nativeProps = getPartitionedNativeProps({\n props,\n primarySlotTagName: 'input',\n excludedPropNames: ['checked', 'defaultChecked', 'onChange']\n });\n const root = resolveShorthand(props.root, {\n required: true,\n defaultProps: {\n ref: useFocusWithin(),\n ...nativeProps.root\n }\n });\n const input = resolveShorthand(props.input, {\n required: true,\n defaultProps: {\n ref,\n type: 'radio',\n id: useId('radio-', nativeProps.primary.id),\n name,\n checked,\n defaultChecked,\n disabled,\n required,\n 'aria-describedby': ariaDescribedBy,\n ...nativeProps.primary\n }\n });\n input.onChange = mergeCallbacks(input.onChange, ev => {\n return onChange === null || onChange === void 0 ? void 0 : onChange(ev, {\n value: ev.currentTarget.value\n });\n });\n const label = resolveShorthand(props.label, {\n defaultProps: {\n htmlFor: input.id,\n disabled\n }\n });\n const indicator = resolveShorthand(props.indicator, {\n required: true,\n defaultProps: {\n 'aria-hidden': true,\n children: /*#__PURE__*/React.createElement(CircleFilled, null)\n }\n });\n return {\n labelPosition,\n components: {\n root: 'span',\n input: 'input',\n label: Label,\n indicator: 'div'\n },\n root,\n input,\n label,\n indicator\n };\n};\n//# sourceMappingURL=useRadio.js.map"],"names":["useRadio_unstable","props","ref","nameGroup","useRadioGroupContext_unstable","ctx","name","value","defaultValue","disabledGroup","disabled","layout","requiredGroup","required","describedByGroup","checked","undefined","defaultChecked","labelPosition","ariaDescribedBy","onChange","nativeProps","getPartitionedNativeProps","primarySlotTagName","excludedPropNames","root","resolveShorthand","defaultProps","useFocusWithin","input","type","id","useId","primary","mergeCallbacks","ev","currentTarget","label","htmlFor","indicator","children","React","createElement","CircleFilled","components","Label"],"mappings":";;;;+BAeaA;;aAAAA;;;6DAfU;4BACM;4BACP;gCAC6D;mCACrC;8BACf;AAUxB,MAAMA,oBAAoB,CAACC,OAAOC,MAAQ;IAC/C,MAAMC,YAAYC,IAAAA,gDAA6B,EAACC,CAAAA,MAAOA,IAAIC,IAAI;IAC/D,MAAMC,QAAQH,IAAAA,gDAA6B,EAACC,CAAAA,MAAOA,IAAIE,KAAK;IAC5D,MAAMC,eAAeJ,IAAAA,gDAA6B,EAACC,CAAAA,MAAOA,IAAIG,YAAY;IAC1E,MAAMC,gBAAgBL,IAAAA,gDAA6B,EAACC,CAAAA,MAAOA,IAAIK,QAAQ;IACvE,MAAMC,SAASP,IAAAA,gDAA6B,EAACC,CAAAA,MAAOA,IAAIM,MAAM;IAC9D,MAAMC,gBAAgBR,IAAAA,gDAA6B,EAACC,CAAAA,MAAOA,IAAIQ,QAAQ;IACvE,MAAMC,mBAAmBV,IAAAA,gDAA6B,EAACC,CAAAA,MAAOA,GAAG,CAAC,mBAAmB;IACrF,MAAM,EACJC,MAAOH,UAAS,EAChBY,SAAUR,UAAUS,YAAYT,UAAUN,MAAMM,KAAK,GAAGS,SAAS,CAAA,EACjEC,gBAAiBT,iBAAiBQ,YAAYR,iBAAiBP,MAAMM,KAAK,GAAGS,SAAS,CAAA,EACtFE,eAAgBP,WAAW,uBAAuB,UAAU,OAAO,CAAA,EACnED,UAAWD,cAAa,EACxBI,UAAWD,cAAa,EACxB,oBAAoBO,kBAAkBL,gBAAgB,CAAA,EACtDM,SAAQ,EACT,GAAGnB;IACJ,MAAMoB,cAAcC,IAAAA,yCAAyB,EAAC;QAC5CrB;QACAsB,oBAAoB;QACpBC,mBAAmB;YAAC;YAAW;YAAkB;SAAW;IAC9D;IACA,MAAMC,OAAOC,IAAAA,gCAAgB,EAACzB,MAAMwB,IAAI,EAAE;QACxCZ,UAAU,IAAI;QACdc,cAAc;YACZzB,KAAK0B,IAAAA,4BAAc;YACnB,GAAGP,YAAYI,IAAI;QACrB;IACF;IACA,MAAMI,QAAQH,IAAAA,gCAAgB,EAACzB,MAAM4B,KAAK,EAAE;QAC1ChB,UAAU,IAAI;QACdc,cAAc;YACZzB;YACA4B,MAAM;YACNC,IAAIC,IAAAA,qBAAK,EAAC,UAAUX,YAAYY,OAAO,CAACF,EAAE;YAC1CzB;YACAS;YACAE;YACAP;YACAG;YACA,oBAAoBM;YACpB,GAAGE,YAAYY,OAAO;QACxB;IACF;IACAJ,MAAMT,QAAQ,GAAGc,IAAAA,8BAAc,EAACL,MAAMT,QAAQ,EAAEe,CAAAA,KAAM;QACpD,OAAOf,aAAa,IAAI,IAAIA,aAAa,KAAK,IAAI,KAAK,IAAIA,SAASe,IAAI;YACtE5B,OAAO4B,GAAGC,aAAa,CAAC7B,KAAK;QAC/B,EAAE;IACJ;IACA,MAAM8B,QAAQX,IAAAA,gCAAgB,EAACzB,MAAMoC,KAAK,EAAE;QAC1CV,cAAc;YACZW,SAAST,MAAME,EAAE;YACjBrB;QACF;IACF;IACA,MAAM6B,YAAYb,IAAAA,gCAAgB,EAACzB,MAAMsC,SAAS,EAAE;QAClD1B,UAAU,IAAI;QACdc,cAAc;YACZ,eAAe,IAAI;YACnBa,UAAU,WAAW,GAAEC,OAAMC,aAAa,CAACC,wBAAY,EAAE,IAAI;QAC/D;IACF;IACA,OAAO;QACLzB;QACA0B,YAAY;YACVnB,MAAM;YACNI,OAAO;YACPQ,OAAOQ,iBAAK;YACZN,WAAW;QACb;QACAd;QACAI;QACAQ;QACAE;IACF;AACF,GACA,oCAAoC"}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../../lib/contexts/useRadioGroupContextValues.js"],"sourcesContent":["export const useRadioGroupContextValues = state => {\n const {\n name,\n value,\n defaultValue,\n disabled,\n layout,\n required\n } = state;\n const radioGroup = {\n name,\n value,\n defaultValue,\n disabled,\n layout,\n required\n };\n return {\n radioGroup\n };\n};\n//# sourceMappingURL=useRadioGroupContextValues.js.map"],"names":["useRadioGroupContextValues","state","name","value","defaultValue","disabled","layout","required","radioGroup"],"mappings":";;;;+BAAaA;;aAAAA;;AAAN,MAAMA,6BAA6BC,CAAAA,QAAS;IACjD,MAAM,EACJC,KAAI,EACJC,MAAK,EACLC,aAAY,EACZC,SAAQ,EACRC,OAAM,EACNC,SAAQ,EACT,GAAGN;IACJ,MAAMO,aAAa;QACjBN;QACAC;QACAC;QACAC;QACAC;QACAC;
|
1
|
+
{"version":3,"sources":["../../lib/contexts/useRadioGroupContextValues.js"],"sourcesContent":["export const useRadioGroupContextValues = state => {\n const {\n name,\n value,\n defaultValue,\n disabled,\n layout,\n required\n } = state;\n const radioGroup = {\n name,\n value,\n defaultValue,\n disabled,\n layout,\n required,\n 'aria-describedby': state.root['aria-describedby']\n };\n return {\n radioGroup\n };\n};\n//# sourceMappingURL=useRadioGroupContextValues.js.map"],"names":["useRadioGroupContextValues","state","name","value","defaultValue","disabled","layout","required","radioGroup","root"],"mappings":";;;;+BAAaA;;aAAAA;;AAAN,MAAMA,6BAA6BC,CAAAA,QAAS;IACjD,MAAM,EACJC,KAAI,EACJC,MAAK,EACLC,aAAY,EACZC,SAAQ,EACRC,OAAM,EACNC,SAAQ,EACT,GAAGN;IACJ,MAAMO,aAAa;QACjBN;QACAC;QACAC;QACAC;QACAC;QACAC;QACA,oBAAoBN,MAAMQ,IAAI,CAAC,mBAAmB;IACpD;IACA,OAAO;QACLD;IACF;AACF,GACA,sDAAsD"}
|
package/package.json
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
{
|
2
2
|
"name": "@fluentui/react-radio",
|
3
|
-
"version": "9.1.
|
3
|
+
"version": "9.1.9",
|
4
4
|
"description": "Fluent UI Radio component",
|
5
5
|
"main": "lib-commonjs/index.js",
|
6
6
|
"module": "lib/index.js",
|
@@ -32,14 +32,14 @@
|
|
32
32
|
"@fluentui/scripts-tasks": "*"
|
33
33
|
},
|
34
34
|
"dependencies": {
|
35
|
-
"@fluentui/react-context-selector": "^9.1.
|
36
|
-
"@fluentui/react-field": "9.0.0-beta.
|
35
|
+
"@fluentui/react-context-selector": "^9.1.17",
|
36
|
+
"@fluentui/react-field": "9.0.0-beta.2",
|
37
37
|
"@fluentui/react-icons": "^2.0.196",
|
38
|
-
"@fluentui/react-label": "^9.1.
|
38
|
+
"@fluentui/react-label": "^9.1.8",
|
39
39
|
"@fluentui/react-shared-contexts": "^9.3.3",
|
40
|
-
"@fluentui/react-tabster": "^9.6.
|
40
|
+
"@fluentui/react-tabster": "^9.6.4",
|
41
41
|
"@fluentui/react-theme": "^9.1.7",
|
42
|
-
"@fluentui/react-utilities": "^9.7.
|
42
|
+
"@fluentui/react-utilities": "^9.7.4",
|
43
43
|
"@griffel/react": "^1.5.2",
|
44
44
|
"@swc/helpers": "^0.4.14"
|
45
45
|
},
|