@fluentui/react-radio 0.0.0-nightly-20220315-0418.1 → 0.0.0-nightly-20220318-0416.1
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.json +37 -13
- package/CHANGELOG.md +13 -9
- package/dist/react-radio.d.ts +29 -1
- package/lib/components/Radio/Radio.types.d.ts +17 -0
- package/lib/components/Radio/Radio.types.js.map +1 -1
- package/lib/components/Radio/useRadio.js +7 -3
- package/lib/components/Radio/useRadio.js.map +1 -1
- package/lib/components/Radio/useRadioStyles.d.ts +6 -1
- package/lib/components/Radio/useRadioStyles.js +14 -6
- package/lib/components/Radio/useRadioStyles.js.map +1 -1
- package/lib/components/RadioGroup/RadioGroup.types.d.ts +1 -1
- package/lib/components/RadioGroup/RadioGroup.types.js.map +1 -1
- package/lib/components/RadioGroup/useRadioGroupStyles.d.ts +6 -1
- package/lib/components/RadioGroup/useRadioGroupStyles.js +8 -1
- package/lib/components/RadioGroup/useRadioGroupStyles.js.map +1 -1
- package/lib/index.d.ts +6 -3
- package/lib/index.js +7 -3
- package/lib/index.js.map +1 -1
- package/lib-commonjs/components/Radio/Radio.types.d.ts +17 -0
- package/lib-commonjs/components/Radio/useRadio.js +6 -2
- package/lib-commonjs/components/Radio/useRadio.js.map +1 -1
- package/lib-commonjs/components/Radio/useRadioStyles.d.ts +6 -1
- package/lib-commonjs/components/Radio/useRadioStyles.js +15 -7
- package/lib-commonjs/components/Radio/useRadioStyles.js.map +1 -1
- package/lib-commonjs/components/RadioGroup/RadioGroup.types.d.ts +1 -1
- package/lib-commonjs/components/RadioGroup/useRadioGroupStyles.d.ts +6 -1
- package/lib-commonjs/components/RadioGroup/useRadioGroupStyles.js +9 -2
- package/lib-commonjs/components/RadioGroup/useRadioGroupStyles.js.map +1 -1
- package/lib-commonjs/index.d.ts +6 -3
- package/lib-commonjs/index.js +88 -4
- package/lib-commonjs/index.js.map +1 -1
- package/package.json +6 -6
package/CHANGELOG.json
CHANGED
|
@@ -2,9 +2,9 @@
|
|
|
2
2
|
"name": "@fluentui/react-radio",
|
|
3
3
|
"entries": [
|
|
4
4
|
{
|
|
5
|
-
"date": "
|
|
6
|
-
"tag": "@fluentui/react-radio_v0.0.0-nightly-
|
|
7
|
-
"version": "0.0.0-nightly-
|
|
5
|
+
"date": "Fri, 18 Mar 2022 04:27:21 GMT",
|
|
6
|
+
"tag": "@fluentui/react-radio_v0.0.0-nightly-20220318-0416.1",
|
|
7
|
+
"version": "0.0.0-nightly-20220318-0416.1",
|
|
8
8
|
"comments": {
|
|
9
9
|
"prerelease": [
|
|
10
10
|
{
|
|
@@ -13,35 +13,59 @@
|
|
|
13
13
|
"commit": "not available",
|
|
14
14
|
"comment": "Release nightly v9"
|
|
15
15
|
},
|
|
16
|
+
{
|
|
17
|
+
"author": "seanmonahan@microsoft.com",
|
|
18
|
+
"package": "@fluentui/react-radio",
|
|
19
|
+
"commit": "086a675fd0c648944ff4048450190a0a13467de3",
|
|
20
|
+
"comment": "Deprecate static classname string for Radio."
|
|
21
|
+
},
|
|
22
|
+
{
|
|
23
|
+
"author": "seanmonahan@microsoft.com",
|
|
24
|
+
"package": "@fluentui/react-radio",
|
|
25
|
+
"commit": "c0c9b30ae2393775eac02870f6b04cade31ef3ac",
|
|
26
|
+
"comment": "Remove star exports from react-radio"
|
|
27
|
+
},
|
|
28
|
+
{
|
|
29
|
+
"author": "seanmonahan@microsoft.com",
|
|
30
|
+
"package": "@fluentui/react-radio",
|
|
31
|
+
"commit": "c6af0f7fa900a2f497f4c7477bb05ca2c59c7987",
|
|
32
|
+
"comment": "Add onChange event prop to Radio"
|
|
33
|
+
},
|
|
34
|
+
{
|
|
35
|
+
"author": "seanmonahan@microsoft.com",
|
|
36
|
+
"package": "@fluentui/react-radio",
|
|
37
|
+
"commit": "0f509ed4c7e26548ae9d27e3001bd8db4784e838",
|
|
38
|
+
"comment": "Radio/RadioGroup API alignment."
|
|
39
|
+
},
|
|
16
40
|
{
|
|
17
41
|
"author": "beachball",
|
|
18
42
|
"package": "@fluentui/react-radio",
|
|
19
|
-
"comment": "Bump @fluentui/react-label to v0.0.0-nightly-
|
|
20
|
-
"commit": "
|
|
43
|
+
"comment": "Bump @fluentui/react-label to v0.0.0-nightly-20220318-0416.1",
|
|
44
|
+
"commit": "9fe23c6e14ceb14d72b49bf59ded7e05f0dc185d"
|
|
21
45
|
},
|
|
22
46
|
{
|
|
23
47
|
"author": "beachball",
|
|
24
48
|
"package": "@fluentui/react-radio",
|
|
25
|
-
"comment": "Bump @fluentui/react-tabster to v0.0.0-nightly-
|
|
26
|
-
"commit": "
|
|
49
|
+
"comment": "Bump @fluentui/react-tabster to v0.0.0-nightly-20220318-0416.1",
|
|
50
|
+
"commit": "9fe23c6e14ceb14d72b49bf59ded7e05f0dc185d"
|
|
27
51
|
},
|
|
28
52
|
{
|
|
29
53
|
"author": "beachball",
|
|
30
54
|
"package": "@fluentui/react-radio",
|
|
31
|
-
"comment": "Bump @fluentui/react-theme to v0.0.0-nightly-
|
|
32
|
-
"commit": "
|
|
55
|
+
"comment": "Bump @fluentui/react-theme to v0.0.0-nightly-20220318-0416.1",
|
|
56
|
+
"commit": "9fe23c6e14ceb14d72b49bf59ded7e05f0dc185d"
|
|
33
57
|
},
|
|
34
58
|
{
|
|
35
59
|
"author": "beachball",
|
|
36
60
|
"package": "@fluentui/react-radio",
|
|
37
|
-
"comment": "Bump @fluentui/react-utilities to v0.0.0-nightly-
|
|
38
|
-
"commit": "
|
|
61
|
+
"comment": "Bump @fluentui/react-utilities to v0.0.0-nightly-20220318-0416.1",
|
|
62
|
+
"commit": "9fe23c6e14ceb14d72b49bf59ded7e05f0dc185d"
|
|
39
63
|
},
|
|
40
64
|
{
|
|
41
65
|
"author": "beachball",
|
|
42
66
|
"package": "@fluentui/react-radio",
|
|
43
|
-
"comment": "Bump @fluentui/react-conformance-griffel to v0.0.0-nightly-
|
|
44
|
-
"commit": "
|
|
67
|
+
"comment": "Bump @fluentui/react-conformance-griffel to v0.0.0-nightly-20220318-0416.1",
|
|
68
|
+
"commit": "9fe23c6e14ceb14d72b49bf59ded7e05f0dc185d"
|
|
45
69
|
}
|
|
46
70
|
],
|
|
47
71
|
"none": [
|
package/CHANGELOG.md
CHANGED
|
@@ -1,22 +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 Fri, 18 Mar 2022 04:27:21 GMT and should not be manually modified.
|
|
4
4
|
|
|
5
5
|
<!-- Start content -->
|
|
6
6
|
|
|
7
|
-
## [0.0.0-nightly-
|
|
7
|
+
## [0.0.0-nightly-20220318-0416.1](https://github.com/microsoft/fluentui/tree/@fluentui/react-radio_v0.0.0-nightly-20220318-0416.1)
|
|
8
8
|
|
|
9
|
-
|
|
10
|
-
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-radio_v9.0.0-beta.2..@fluentui/react-radio_v0.0.0-nightly-
|
|
9
|
+
Fri, 18 Mar 2022 04:27:21 GMT
|
|
10
|
+
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-radio_v9.0.0-beta.2..@fluentui/react-radio_v0.0.0-nightly-20220318-0416.1)
|
|
11
11
|
|
|
12
12
|
### Changes
|
|
13
13
|
|
|
14
14
|
- Release nightly v9 ([commit](https://github.com/microsoft/fluentui/commit/not available) by email not defined)
|
|
15
|
-
-
|
|
16
|
-
-
|
|
17
|
-
-
|
|
18
|
-
-
|
|
19
|
-
- Bump @fluentui/react-
|
|
15
|
+
- Deprecate static classname string for Radio. ([PR #21960](https://github.com/microsoft/fluentui/pull/21960) by seanmonahan@microsoft.com)
|
|
16
|
+
- Remove star exports from react-radio ([PR #22106](https://github.com/microsoft/fluentui/pull/22106) by seanmonahan@microsoft.com)
|
|
17
|
+
- Add onChange event prop to Radio ([PR #22104](https://github.com/microsoft/fluentui/pull/22104) by seanmonahan@microsoft.com)
|
|
18
|
+
- Radio/RadioGroup API alignment. ([PR #22065](https://github.com/microsoft/fluentui/pull/22065) by seanmonahan@microsoft.com)
|
|
19
|
+
- Bump @fluentui/react-label to v0.0.0-nightly-20220318-0416.1 ([commit](https://github.com/microsoft/fluentui/commit/9fe23c6e14ceb14d72b49bf59ded7e05f0dc185d) by beachball)
|
|
20
|
+
- Bump @fluentui/react-tabster to v0.0.0-nightly-20220318-0416.1 ([commit](https://github.com/microsoft/fluentui/commit/9fe23c6e14ceb14d72b49bf59ded7e05f0dc185d) by beachball)
|
|
21
|
+
- Bump @fluentui/react-theme to v0.0.0-nightly-20220318-0416.1 ([commit](https://github.com/microsoft/fluentui/commit/9fe23c6e14ceb14d72b49bf59ded7e05f0dc185d) by beachball)
|
|
22
|
+
- Bump @fluentui/react-utilities to v0.0.0-nightly-20220318-0416.1 ([commit](https://github.com/microsoft/fluentui/commit/9fe23c6e14ceb14d72b49bf59ded7e05f0dc185d) by beachball)
|
|
23
|
+
- Bump @fluentui/react-conformance-griffel to v0.0.0-nightly-20220318-0416.1 ([commit](https://github.com/microsoft/fluentui/commit/9fe23c6e14ceb14d72b49bf59ded7e05f0dc185d) by beachball)
|
|
20
24
|
|
|
21
25
|
## [9.0.0-beta.2](https://github.com/microsoft/fluentui/tree/@fluentui/react-radio_v9.0.0-beta.2)
|
|
22
26
|
|
package/dist/react-radio.d.ts
CHANGED
|
@@ -4,21 +4,32 @@ import type { ForwardRefComponent } from '@fluentui/react-utilities';
|
|
|
4
4
|
import { Label } from '@fluentui/react-label';
|
|
5
5
|
import * as React_2 from 'react';
|
|
6
6
|
import type { Slot } from '@fluentui/react-utilities';
|
|
7
|
+
import type { SlotClassNames } from '@fluentui/react-utilities';
|
|
7
8
|
|
|
8
9
|
/**
|
|
9
10
|
* Radio component is a wrapper for a radio button with a label.
|
|
10
11
|
*/
|
|
11
12
|
export declare const Radio: ForwardRefComponent<RadioProps>;
|
|
12
13
|
|
|
14
|
+
/**
|
|
15
|
+
* @deprecated Use `radioClassNames.root` instead.
|
|
16
|
+
*/
|
|
13
17
|
export declare const radioClassName = "fui-Radio";
|
|
14
18
|
|
|
19
|
+
export declare const radioClassNames: SlotClassNames<RadioSlots>;
|
|
20
|
+
|
|
15
21
|
/**
|
|
16
22
|
* A RadioGroup component presents a set of options where only one option can be selected.
|
|
17
23
|
*/
|
|
18
24
|
export declare const RadioGroup: ForwardRefComponent<RadioGroupProps>;
|
|
19
25
|
|
|
26
|
+
/**
|
|
27
|
+
* @deprecated Use `radioGroupClassNames.root` instead.
|
|
28
|
+
*/
|
|
20
29
|
export declare const radioGroupClassName = "fui-RadioGroup";
|
|
21
30
|
|
|
31
|
+
export declare const radioGroupClassNames: SlotClassNames<RadioGroupSlots>;
|
|
32
|
+
|
|
22
33
|
/**
|
|
23
34
|
* RadioGroupContext is provided by RadioGroup, and is consumed by Radio to determine default values of some props.
|
|
24
35
|
*/
|
|
@@ -75,7 +86,7 @@ export declare type RadioGroupSlots = {
|
|
|
75
86
|
/**
|
|
76
87
|
* The radio group root.
|
|
77
88
|
*/
|
|
78
|
-
root: Slot<'div'
|
|
89
|
+
root: NonNullable<Slot<'div'>>;
|
|
79
90
|
};
|
|
80
91
|
|
|
81
92
|
/**
|
|
@@ -85,6 +96,16 @@ export declare type RadioGroupState = ComponentState<RadioGroupSlots> & Required
|
|
|
85
96
|
context: RadioGroupContextValue;
|
|
86
97
|
};
|
|
87
98
|
|
|
99
|
+
/**
|
|
100
|
+
* Data for the onChange event for Radio.
|
|
101
|
+
*/
|
|
102
|
+
export declare type RadioOnChangeData = {
|
|
103
|
+
/**
|
|
104
|
+
* The value prop of this Radio item.
|
|
105
|
+
*/
|
|
106
|
+
value: string;
|
|
107
|
+
};
|
|
108
|
+
|
|
88
109
|
/**
|
|
89
110
|
* Radio Props
|
|
90
111
|
*/
|
|
@@ -106,6 +127,13 @@ export declare type RadioProps = Omit<ComponentProps<Partial<RadioSlots>, 'input
|
|
|
106
127
|
* Disable this Radio item.
|
|
107
128
|
*/
|
|
108
129
|
disabled?: boolean;
|
|
130
|
+
/**
|
|
131
|
+
* Callback when this Radio is selected in its group.
|
|
132
|
+
*
|
|
133
|
+
* **Note:** `onChange` is NOT called when this Radio is deselected.
|
|
134
|
+
* Use RadioGroup's `onChange` event to determine when the selection in the group changes.
|
|
135
|
+
*/
|
|
136
|
+
onChange?: (ev: React_2.ChangeEvent<HTMLInputElement>, data: RadioOnChangeData) => void;
|
|
109
137
|
};
|
|
110
138
|
|
|
111
139
|
export declare type RadioSlots = {
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
1
2
|
import { Label } from '@fluentui/react-label';
|
|
2
3
|
import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';
|
|
3
4
|
export declare type RadioSlots = {
|
|
@@ -45,6 +46,22 @@ export declare type RadioProps = Omit<ComponentProps<Partial<RadioSlots>, 'input
|
|
|
45
46
|
* Disable this Radio item.
|
|
46
47
|
*/
|
|
47
48
|
disabled?: boolean;
|
|
49
|
+
/**
|
|
50
|
+
* Callback when this Radio is selected in its group.
|
|
51
|
+
*
|
|
52
|
+
* **Note:** `onChange` is NOT called when this Radio is deselected.
|
|
53
|
+
* Use RadioGroup's `onChange` event to determine when the selection in the group changes.
|
|
54
|
+
*/
|
|
55
|
+
onChange?: (ev: React.ChangeEvent<HTMLInputElement>, data: RadioOnChangeData) => void;
|
|
56
|
+
};
|
|
57
|
+
/**
|
|
58
|
+
* Data for the onChange event for Radio.
|
|
59
|
+
*/
|
|
60
|
+
export declare type RadioOnChangeData = {
|
|
61
|
+
/**
|
|
62
|
+
* The value prop of this Radio item.
|
|
63
|
+
*/
|
|
64
|
+
value: string;
|
|
48
65
|
};
|
|
49
66
|
/**
|
|
50
67
|
* State used in rendering Radio
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Radio.types.js","sourceRoot":"../src/","sources":["components/Radio/Radio.types.ts"],"names":[],"mappings":"","sourcesContent":["import { Label } from '@fluentui/react-label';\nimport type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\n\nexport type RadioSlots = {\n /**\n * The root element of the Radio.\n *\n * The root slot receives the `className` and `style` specified directly on the `<Radio>`.\n * All other native props will be applied to the primary slot: `input`\n */\n root: NonNullable<Slot<'span'>>;\n\n /**\n * The Radio's label.\n */\n label: Slot<typeof Label>;\n\n /**\n * Hidden input that handles the radio's functionality.\n *\n * This is the PRIMARY slot: all native properties specified directly on `<Radio>` will be applied to this slot,\n * except `className` and `style`, which remain on the root slot.\n */\n input: NonNullable<Slot<'input'>>;\n\n /**\n * A circle outline, with a filled circle icon inside when the Radio is checked.\n */\n indicator: NonNullable<Slot<'div'>>;\n};\n\n/**\n * Radio Props\n */\nexport type RadioProps = Omit<ComponentProps<Partial<RadioSlots>, 'input'>, 'size'> & {\n /**\n * The value of the RadioGroup when this Radio item is selected.\n */\n value?: string;\n\n /**\n * The position of the label relative to the radio indicator.\n *\n * This defaults to `after` unless the Radio is inside a RadioGroup with `layout=\"horizontalStacked\"`,\n * in which case it defaults to `below`.\n *\n * @defaultvalue after\n */\n labelPosition?: 'after' | 'below';\n\n /**\n * Disable this Radio item.\n */\n disabled?: boolean;\n};\n\n/**\n * State used in rendering Radio\n */\nexport type RadioState = ComponentState<RadioSlots> & Required<Pick<RadioProps, 'labelPosition'>>;\n"]}
|
|
1
|
+
{"version":3,"file":"Radio.types.js","sourceRoot":"../src/","sources":["components/Radio/Radio.types.ts"],"names":[],"mappings":"","sourcesContent":["import * as React from 'react';\nimport { Label } from '@fluentui/react-label';\nimport type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\n\nexport type RadioSlots = {\n /**\n * The root element of the Radio.\n *\n * The root slot receives the `className` and `style` specified directly on the `<Radio>`.\n * All other native props will be applied to the primary slot: `input`\n */\n root: NonNullable<Slot<'span'>>;\n\n /**\n * The Radio's label.\n */\n label: Slot<typeof Label>;\n\n /**\n * Hidden input that handles the radio's functionality.\n *\n * This is the PRIMARY slot: all native properties specified directly on `<Radio>` will be applied to this slot,\n * except `className` and `style`, which remain on the root slot.\n */\n input: NonNullable<Slot<'input'>>;\n\n /**\n * A circle outline, with a filled circle icon inside when the Radio is checked.\n */\n indicator: NonNullable<Slot<'div'>>;\n};\n\n/**\n * Radio Props\n */\nexport type RadioProps = Omit<ComponentProps<Partial<RadioSlots>, 'input'>, 'size'> & {\n /**\n * The value of the RadioGroup when this Radio item is selected.\n */\n value?: string;\n\n /**\n * The position of the label relative to the radio indicator.\n *\n * This defaults to `after` unless the Radio is inside a RadioGroup with `layout=\"horizontalStacked\"`,\n * in which case it defaults to `below`.\n *\n * @defaultvalue after\n */\n labelPosition?: 'after' | 'below';\n\n /**\n * Disable this Radio item.\n */\n disabled?: boolean;\n\n /**\n * Callback when this Radio is selected in its group.\n *\n * **Note:** `onChange` is NOT called when this Radio is deselected.\n * Use RadioGroup's `onChange` event to determine when the selection in the group changes.\n */\n onChange?: (ev: React.ChangeEvent<HTMLInputElement>, data: RadioOnChangeData) => void;\n};\n\n/**\n * Data for the onChange event for Radio.\n */\nexport type RadioOnChangeData = {\n /**\n * The value prop of this Radio item.\n */\n value: string;\n};\n\n/**\n * State used in rendering Radio\n */\nexport type RadioState = ComponentState<RadioSlots> & Required<Pick<RadioProps, 'labelPosition'>>;\n"]}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
import { CircleFilled } from '@fluentui/react-icons';
|
|
3
3
|
import { Label } from '@fluentui/react-label';
|
|
4
|
-
import { getPartitionedNativeProps, resolveShorthand, useId } from '@fluentui/react-utilities';
|
|
4
|
+
import { getPartitionedNativeProps, resolveShorthand, useId, useMergedEventCallbacks } from '@fluentui/react-utilities';
|
|
5
5
|
import { RadioGroupContext } from '../../contexts/RadioGroupContext';
|
|
6
6
|
/**
|
|
7
7
|
* Create the state required to render Radio.
|
|
@@ -21,12 +21,13 @@ export const useRadio_unstable = (props, ref) => {
|
|
|
21
21
|
defaultChecked = group.defaultValue !== undefined ? group.defaultValue === props.value : undefined,
|
|
22
22
|
labelPosition = group.layout === 'horizontalStacked' ? 'below' : 'after',
|
|
23
23
|
disabled = group.disabled,
|
|
24
|
-
required
|
|
24
|
+
required,
|
|
25
|
+
onChange
|
|
25
26
|
} = props;
|
|
26
27
|
const nativeProps = getPartitionedNativeProps({
|
|
27
28
|
props,
|
|
28
29
|
primarySlotTagName: 'input',
|
|
29
|
-
excludedPropNames: ['checked', 'defaultChecked']
|
|
30
|
+
excludedPropNames: ['checked', 'defaultChecked', 'onChange']
|
|
30
31
|
});
|
|
31
32
|
const root = resolveShorthand(props.root, {
|
|
32
33
|
required: true,
|
|
@@ -45,6 +46,9 @@ export const useRadio_unstable = (props, ref) => {
|
|
|
45
46
|
...nativeProps.primary
|
|
46
47
|
}
|
|
47
48
|
});
|
|
49
|
+
input.onChange = useMergedEventCallbacks(input.onChange, ev => onChange === null || onChange === void 0 ? void 0 : onChange(ev, {
|
|
50
|
+
value: ev.currentTarget.value
|
|
51
|
+
}));
|
|
48
52
|
const label = resolveShorthand(props.label, {
|
|
49
53
|
defaultProps: {
|
|
50
54
|
htmlFor: input.id,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["components/Radio/useRadio.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,YAAT,QAA6B,uBAA7B;AACA,SAAS,KAAT,QAAsB,uBAAtB;AACA,SAAS,yBAAT,EAAoC,gBAApC,EAAsD,KAAtD,
|
|
1
|
+
{"version":3,"sources":["components/Radio/useRadio.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { CircleFilled } from '@fluentui/react-icons';\nimport { Label } from '@fluentui/react-label';\nimport { getPartitionedNativeProps, resolveShorthand, useId, useMergedEventCallbacks } from '@fluentui/react-utilities';\nimport { RadioGroupContext } from '../../contexts/RadioGroupContext';\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 group = React.useContext(RadioGroupContext);\n\n const {\n name = group.name,\n checked = group.value !== undefined ? group.value === props.value : undefined,\n defaultChecked = group.defaultValue !== undefined ? group.defaultValue === props.value : undefined,\n labelPosition = group.layout === 'horizontalStacked' ? 'below' : 'after',\n disabled = group.disabled,\n required,\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: 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 ...nativeProps.primary,\n },\n });\n\n input.onChange = useMergedEventCallbacks(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 required,\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"],"sourceRoot":"../src/"}
|
|
@@ -1,5 +1,10 @@
|
|
|
1
|
-
import type { RadioState } from './Radio.types';
|
|
1
|
+
import type { RadioSlots, RadioState } from './Radio.types';
|
|
2
|
+
import type { SlotClassNames } from '@fluentui/react-utilities';
|
|
3
|
+
/**
|
|
4
|
+
* @deprecated Use `radioClassNames.root` instead.
|
|
5
|
+
*/
|
|
2
6
|
export declare const radioClassName = "fui-Radio";
|
|
7
|
+
export declare const radioClassNames: SlotClassNames<RadioSlots>;
|
|
3
8
|
/**
|
|
4
9
|
* Apply styling to the Radio slots based on the state
|
|
5
10
|
*/
|
|
@@ -1,9 +1,17 @@
|
|
|
1
1
|
import { createFocusOutlineStyle } from '@fluentui/react-tabster';
|
|
2
2
|
import { tokens } from '@fluentui/react-theme';
|
|
3
3
|
import { __styles, mergeClasses, shorthands } from '@griffel/react';
|
|
4
|
+
/**
|
|
5
|
+
* @deprecated Use `radioClassNames.root` instead.
|
|
6
|
+
*/
|
|
7
|
+
|
|
4
8
|
export const radioClassName = 'fui-Radio';
|
|
5
|
-
const
|
|
6
|
-
|
|
9
|
+
export const radioClassNames = {
|
|
10
|
+
root: 'fui-Radio',
|
|
11
|
+
indicator: 'fui-Radio__indicator',
|
|
12
|
+
input: 'fui-Radio__input',
|
|
13
|
+
label: 'fui-Radio__label'
|
|
14
|
+
}; // TODO replace these spacing constants with theme values once they're on the theme
|
|
7
15
|
|
|
8
16
|
const spacingHorizontalS = '8px';
|
|
9
17
|
const spacingHorizontalM = '12px'; // The indicator size is used by the indicator and label styles
|
|
@@ -174,15 +182,15 @@ const useLabelStyles = /*#__PURE__*/__styles({
|
|
|
174
182
|
|
|
175
183
|
export const useRadioStyles_unstable = state => {
|
|
176
184
|
const rootStyles = useRootStyles();
|
|
177
|
-
state.root.className = mergeClasses(
|
|
185
|
+
state.root.className = mergeClasses(radioClassNames.root, rootStyles.base, rootStyles.focusIndicator, state.labelPosition === 'below' && rootStyles.vertical, state.root.className);
|
|
178
186
|
const inputStyles = useInputStyles();
|
|
179
|
-
state.input.className = mergeClasses(inputStyles.base, state.input.className);
|
|
187
|
+
state.input.className = mergeClasses(radioClassNames.input, inputStyles.base, state.input.className);
|
|
180
188
|
const indicatorStyles = useIndicatorStyles();
|
|
181
|
-
state.indicator.className = mergeClasses(
|
|
189
|
+
state.indicator.className = mergeClasses(radioClassNames.indicator, indicatorStyles.base, state.indicator.className);
|
|
182
190
|
const labelStyles = useLabelStyles();
|
|
183
191
|
|
|
184
192
|
if (state.label) {
|
|
185
|
-
state.label.className = mergeClasses(
|
|
193
|
+
state.label.className = mergeClasses(radioClassNames.label, labelStyles.base, state.labelPosition === 'below' && labelStyles.below, state.label.className);
|
|
186
194
|
}
|
|
187
195
|
};
|
|
188
196
|
//# sourceMappingURL=useRadioStyles.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["components/Radio/useRadioStyles.ts"],"names":[],"mappings":"AAAA,SAAS,uBAAT,QAAwC,yBAAxC;AACA,SAAS,MAAT,QAAuB,uBAAvB;AACA,mBAAqB,YAArB,EAAmC,UAAnC,QAAqD,gBAArD;
|
|
1
|
+
{"version":3,"sources":["components/Radio/useRadioStyles.ts"],"names":[],"mappings":"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","sourcesContent":["import { createFocusOutlineStyle } from '@fluentui/react-tabster';\nimport { tokens } from '@fluentui/react-theme';\nimport { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport type { RadioSlots, RadioState } from './Radio.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\n/**\n * @deprecated Use `radioClassNames.root` instead.\n */\nexport const radioClassName = 'fui-Radio';\nexport const radioClassNames: SlotClassNames<RadioSlots> = {\n root: 'fui-Radio',\n indicator: 'fui-Radio__indicator',\n input: 'fui-Radio__input',\n label: 'fui-Radio__label',\n};\n\n// TODO replace these spacing constants with theme values once they're on the theme\nconst spacingHorizontalS = '8px';\nconst spacingHorizontalM = '12px';\n\n// The indicator size is used by the indicator and label styles\nconst indicatorSize = '16px';\n\n/**\n * Styles for the root slot\n */\nconst useRootStyles = makeStyles({\n base: {\n display: 'inline-flex',\n position: 'relative',\n columnGap: spacingHorizontalM,\n ...shorthands.padding(spacingHorizontalS),\n },\n\n vertical: {\n flexDirection: 'column',\n alignItems: 'center',\n rowGap: spacingHorizontalM,\n },\n\n focusIndicator: createFocusOutlineStyle({ style: {}, selector: 'focus-within' }),\n});\n\nconst useInputStyles = makeStyles({\n base: {\n position: 'absolute',\n left: 0,\n top: 0,\n width: '100%',\n height: '100%',\n boxSizing: 'border-box',\n ...shorthands.margin(0),\n opacity: 0,\n\n ':enabled': {\n cursor: 'pointer',\n },\n\n // When unchecked, hide the circle icon (child of the indicator)\n [`:not(:checked) ~ .${radioClassNames.indicator} > *`]: {\n opacity: '0',\n },\n\n // Colors for the unchecked state\n ':enabled:not(:checked)': {\n [`& ~ .${radioClassNames.label}`]: {\n color: tokens.colorNeutralForeground3,\n },\n [`& ~ .${radioClassNames.indicator}`]: {\n ...shorthands.borderColor(tokens.colorNeutralStrokeAccessible),\n },\n\n ':hover': {\n [`& ~ .${radioClassNames.label}`]: {\n color: tokens.colorNeutralForeground2,\n },\n [`& ~ .${radioClassNames.indicator}`]: {\n ...shorthands.borderColor(tokens.colorNeutralStrokeAccessibleHover),\n },\n },\n\n ':hover:active': {\n [`& ~ .${radioClassNames.label}`]: {\n color: tokens.colorNeutralForeground1,\n },\n [`& ~ .${radioClassNames.indicator}`]: {\n ...shorthands.borderColor(tokens.colorNeutralStrokeAccessiblePressed),\n },\n },\n },\n\n // Colors for the checked state\n ':enabled:checked': {\n [`& ~ .${radioClassNames.label}`]: {\n color: tokens.colorNeutralForeground1,\n },\n [`& ~ .${radioClassNames.indicator}`]: {\n ...shorthands.borderColor(tokens.colorCompoundBrandStroke),\n color: tokens.colorCompoundBrandForeground1,\n },\n\n ':hover': {\n [`& ~ .${radioClassNames.indicator}`]: {\n ...shorthands.borderColor(tokens.colorCompoundBrandStrokeHover),\n color: tokens.colorCompoundBrandForeground1Hover,\n },\n },\n\n ':hover:active': {\n [`& ~ .${radioClassNames.indicator}`]: {\n ...shorthands.borderColor(tokens.colorCompoundBrandStrokePressed),\n color: tokens.colorCompoundBrandForeground1Pressed,\n },\n },\n },\n\n // Colors for the disabled state\n ':disabled': {\n [`& ~ .${radioClassNames.label}`]: {\n color: tokens.colorNeutralForegroundDisabled,\n },\n [`& ~ .${radioClassNames.indicator}`]: {\n ...shorthands.borderColor(tokens.colorNeutralStrokeDisabled),\n color: tokens.colorNeutralForegroundDisabled,\n },\n },\n },\n});\n\nconst useIndicatorStyles = makeStyles({\n base: {\n width: indicatorSize,\n height: indicatorSize,\n fontSize: '12px',\n boxSizing: 'border-box',\n flexShrink: 0,\n\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n ...shorthands.overflow('hidden'),\n\n ...shorthands.border(tokens.strokeWidthThin, 'solid'),\n ...shorthands.borderRadius(tokens.borderRadiusCircular),\n fill: 'currentColor',\n pointerEvents: 'none',\n },\n});\n\nconst useLabelStyles = makeStyles({\n base: {\n alignSelf: 'center',\n userSelect: 'none',\n\n // Use a (negative) margin to account for the difference between the indicator's height and the label's line height.\n // This prevents the label from expanding the height of the Radio, but preserves line height if the label wraps.\n ...shorthands.margin(`calc((${indicatorSize} - ${tokens.lineHeightBase300}) / 2)`, 0),\n },\n\n below: {\n textAlign: 'center',\n },\n});\n\n/**\n * Apply styling to the Radio slots based on the state\n */\nexport const useRadioStyles_unstable = (state: RadioState) => {\n const rootStyles = useRootStyles();\n state.root.className = mergeClasses(\n radioClassNames.root,\n rootStyles.base,\n rootStyles.focusIndicator,\n state.labelPosition === 'below' && rootStyles.vertical,\n state.root.className,\n );\n\n const inputStyles = useInputStyles();\n state.input.className = mergeClasses(radioClassNames.input, inputStyles.base, state.input.className);\n\n const indicatorStyles = useIndicatorStyles();\n state.indicator.className = mergeClasses(radioClassNames.indicator, indicatorStyles.base, state.indicator.className);\n\n const labelStyles = useLabelStyles();\n if (state.label) {\n state.label.className = mergeClasses(\n radioClassNames.label,\n labelStyles.base,\n state.labelPosition === 'below' && labelStyles.below,\n state.label.className,\n );\n }\n};\n"],"sourceRoot":"../src/"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"RadioGroup.types.js","sourceRoot":"../src/","sources":["components/RadioGroup/RadioGroup.types.ts"],"names":[],"mappings":"","sourcesContent":["import * as React from 'react';\nimport type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\nimport { RadioGroupContextValue } from '../../contexts/RadioGroupContext';\n\nexport type RadioGroupSlots = {\n /**\n * The radio group root.\n */\n root: Slot<'div'
|
|
1
|
+
{"version":3,"file":"RadioGroup.types.js","sourceRoot":"../src/","sources":["components/RadioGroup/RadioGroup.types.ts"],"names":[],"mappings":"","sourcesContent":["import * as React from 'react';\nimport type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\nimport { RadioGroupContextValue } from '../../contexts/RadioGroupContext';\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 * @defaultvalue vertical\n */\n layout?: 'vertical' | 'horizontal' | 'horizontalStacked';\n\n /**\n * Disable all Radio items in this group.\n */\n disabled?: 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 context: RadioGroupContextValue;\n };\n"]}
|
|
@@ -1,5 +1,10 @@
|
|
|
1
|
-
import { RadioGroupState } from './RadioGroup.types';
|
|
1
|
+
import { RadioGroupSlots, RadioGroupState } from './RadioGroup.types';
|
|
2
|
+
import type { SlotClassNames } from '@fluentui/react-utilities';
|
|
3
|
+
/**
|
|
4
|
+
* @deprecated Use `radioGroupClassNames.root` instead.
|
|
5
|
+
*/
|
|
2
6
|
export declare const radioGroupClassName = "fui-RadioGroup";
|
|
7
|
+
export declare const radioGroupClassNames: SlotClassNames<RadioGroupSlots>;
|
|
3
8
|
/**
|
|
4
9
|
* Apply styling to the RadioGroup slots based on the state
|
|
5
10
|
*/
|
|
@@ -1,5 +1,12 @@
|
|
|
1
1
|
import { __styles, mergeClasses } from '@griffel/react';
|
|
2
|
+
/**
|
|
3
|
+
* @deprecated Use `radioGroupClassNames.root` instead.
|
|
4
|
+
*/
|
|
5
|
+
|
|
2
6
|
export const radioGroupClassName = 'fui-RadioGroup';
|
|
7
|
+
export const radioGroupClassNames = {
|
|
8
|
+
root: 'fui-RadioGroup'
|
|
9
|
+
};
|
|
3
10
|
|
|
4
11
|
const useStyles = /*#__PURE__*/__styles({
|
|
5
12
|
"root": {
|
|
@@ -19,6 +26,6 @@ const useStyles = /*#__PURE__*/__styles({
|
|
|
19
26
|
|
|
20
27
|
export const useRadioGroupStyles_unstable = state => {
|
|
21
28
|
const styles = useStyles();
|
|
22
|
-
state.root.className = mergeClasses(
|
|
29
|
+
state.root.className = mergeClasses(radioGroupClassNames.root, styles.root, state.layout === 'vertical' && styles.vertical, state.root.className);
|
|
23
30
|
};
|
|
24
31
|
//# sourceMappingURL=useRadioGroupStyles.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["components/RadioGroup/useRadioGroupStyles.ts"],"names":[],"mappings":"AAAA,mBAAqB,YAArB,QAAyC,gBAAzC;
|
|
1
|
+
{"version":3,"sources":["components/RadioGroup/useRadioGroupStyles.ts"],"names":[],"mappings":"AAAA,mBAAqB,YAArB,QAAyC,gBAAzC;AAIA;;AAEG;;AACH,OAAO,MAAM,mBAAmB,GAAG,gBAA5B;AACP,OAAO,MAAM,oBAAoB,GAAoC;AACnE,EAAA,IAAI,EAAE;AAD6D,CAA9D;;AAIP,MAAM,SAAS,gBAAG;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAAlB;AAWA;;AAEG;;;AACH,OAAO,MAAM,4BAA4B,GAAI,KAAD,IAA2B;AACrE,QAAM,MAAM,GAAG,SAAS,EAAxB;AACA,EAAA,KAAK,CAAC,IAAN,CAAW,SAAX,GAAuB,YAAY,CACjC,oBAAoB,CAAC,IADY,EAEjC,MAAM,CAAC,IAF0B,EAGjC,KAAK,CAAC,MAAN,KAAiB,UAAjB,IAA+B,MAAM,CAAC,QAHL,EAIjC,KAAK,CAAC,IAAN,CAAW,SAJsB,CAAnC;AAMD,CARM","sourcesContent":["import { makeStyles, mergeClasses } from '@griffel/react';\nimport { RadioGroupSlots, RadioGroupState } from './RadioGroup.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\n/**\n * @deprecated Use `radioGroupClassNames.root` instead.\n */\nexport const radioGroupClassName = 'fui-RadioGroup';\nexport const radioGroupClassNames: SlotClassNames<RadioGroupSlots> = {\n root: 'fui-RadioGroup',\n};\n\nconst useStyles = makeStyles({\n root: {\n display: 'flex',\n alignItems: 'flex-start',\n },\n\n vertical: {\n flexDirection: 'column',\n },\n});\n\n/**\n * Apply styling to the RadioGroup slots based on the state\n */\nexport const useRadioGroupStyles_unstable = (state: RadioGroupState) => {\n const styles = useStyles();\n state.root.className = mergeClasses(\n radioGroupClassNames.root,\n styles.root,\n state.layout === 'vertical' && styles.vertical,\n state.root.className,\n );\n};\n"],"sourceRoot":"../src/"}
|
package/lib/index.d.ts
CHANGED
|
@@ -1,3 +1,6 @@
|
|
|
1
|
-
export
|
|
2
|
-
export
|
|
3
|
-
export
|
|
1
|
+
export { RadioGroup, radioGroupClassName, radioGroupClassNames, renderRadioGroup_unstable, useRadioGroupStyles_unstable, useRadioGroup_unstable, } from './RadioGroup';
|
|
2
|
+
export type { RadioGroupOnChangeData, RadioGroupProps, RadioGroupSlots, RadioGroupState } from './RadioGroup';
|
|
3
|
+
export { Radio, radioClassName, radioClassNames, renderRadio_unstable, useRadioStyles_unstable, useRadio_unstable, } from './Radio';
|
|
4
|
+
export type { RadioProps, RadioSlots, RadioState, RadioOnChangeData } from './Radio';
|
|
5
|
+
export { RadioGroupContext } from './contexts/RadioGroupContext';
|
|
6
|
+
export type { RadioGroupContextValue } from './contexts/RadioGroupContext';
|
package/lib/index.js
CHANGED
|
@@ -1,4 +1,8 @@
|
|
|
1
|
-
export
|
|
2
|
-
|
|
3
|
-
|
|
1
|
+
export { RadioGroup,
|
|
2
|
+
/* eslint-disable-next-line deprecation/deprecation */
|
|
3
|
+
radioGroupClassName, radioGroupClassNames, renderRadioGroup_unstable, useRadioGroupStyles_unstable, useRadioGroup_unstable } from './RadioGroup';
|
|
4
|
+
export { Radio,
|
|
5
|
+
/* eslint-disable-next-line deprecation/deprecation */
|
|
6
|
+
radioClassName, radioClassNames, renderRadio_unstable, useRadioStyles_unstable, useRadio_unstable } from './Radio';
|
|
7
|
+
export { RadioGroupContext } from './contexts/RadioGroupContext';
|
|
4
8
|
//# sourceMappingURL=index.js.map
|
package/lib/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"sources":["index.ts"],"names":[],"mappings":"AAAA,SACE,UADF;AAEE;AACA,mBAHF,EAIE,oBAJF,EAKE,yBALF,EAME,4BANF,EAOE,sBAPF,QAQO,cARP;AAUA,SACE,KADF;AAEE;AACA,cAHF,EAIE,eAJF,EAKE,oBALF,EAME,uBANF,EAOE,iBAPF,QAQO,SARP;AAUA,SAAS,iBAAT,QAAkC,8BAAlC","sourcesContent":["export {\n RadioGroup,\n /* eslint-disable-next-line deprecation/deprecation */\n radioGroupClassName,\n radioGroupClassNames,\n renderRadioGroup_unstable,\n useRadioGroupStyles_unstable,\n useRadioGroup_unstable,\n} from './RadioGroup';\nexport type { RadioGroupOnChangeData, RadioGroupProps, RadioGroupSlots, RadioGroupState } from './RadioGroup';\nexport {\n Radio,\n /* eslint-disable-next-line deprecation/deprecation */\n radioClassName,\n radioClassNames,\n renderRadio_unstable,\n useRadioStyles_unstable,\n useRadio_unstable,\n} from './Radio';\nexport type { RadioProps, RadioSlots, RadioState, RadioOnChangeData } from './Radio';\nexport { RadioGroupContext } from './contexts/RadioGroupContext';\nexport type { RadioGroupContextValue } from './contexts/RadioGroupContext';\n"],"sourceRoot":"../src/"}
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
1
2
|
import { Label } from '@fluentui/react-label';
|
|
2
3
|
import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';
|
|
3
4
|
export declare type RadioSlots = {
|
|
@@ -45,6 +46,22 @@ export declare type RadioProps = Omit<ComponentProps<Partial<RadioSlots>, 'input
|
|
|
45
46
|
* Disable this Radio item.
|
|
46
47
|
*/
|
|
47
48
|
disabled?: boolean;
|
|
49
|
+
/**
|
|
50
|
+
* Callback when this Radio is selected in its group.
|
|
51
|
+
*
|
|
52
|
+
* **Note:** `onChange` is NOT called when this Radio is deselected.
|
|
53
|
+
* Use RadioGroup's `onChange` event to determine when the selection in the group changes.
|
|
54
|
+
*/
|
|
55
|
+
onChange?: (ev: React.ChangeEvent<HTMLInputElement>, data: RadioOnChangeData) => void;
|
|
56
|
+
};
|
|
57
|
+
/**
|
|
58
|
+
* Data for the onChange event for Radio.
|
|
59
|
+
*/
|
|
60
|
+
export declare type RadioOnChangeData = {
|
|
61
|
+
/**
|
|
62
|
+
* The value prop of this Radio item.
|
|
63
|
+
*/
|
|
64
|
+
value: string;
|
|
48
65
|
};
|
|
49
66
|
/**
|
|
50
67
|
* State used in rendering Radio
|
|
@@ -33,12 +33,13 @@ const useRadio_unstable = (props, ref) => {
|
|
|
33
33
|
defaultChecked = group.defaultValue !== undefined ? group.defaultValue === props.value : undefined,
|
|
34
34
|
labelPosition = group.layout === 'horizontalStacked' ? 'below' : 'after',
|
|
35
35
|
disabled = group.disabled,
|
|
36
|
-
required
|
|
36
|
+
required,
|
|
37
|
+
onChange
|
|
37
38
|
} = props;
|
|
38
39
|
const nativeProps = react_utilities_1.getPartitionedNativeProps({
|
|
39
40
|
props,
|
|
40
41
|
primarySlotTagName: 'input',
|
|
41
|
-
excludedPropNames: ['checked', 'defaultChecked']
|
|
42
|
+
excludedPropNames: ['checked', 'defaultChecked', 'onChange']
|
|
42
43
|
});
|
|
43
44
|
const root = react_utilities_1.resolveShorthand(props.root, {
|
|
44
45
|
required: true,
|
|
@@ -57,6 +58,9 @@ const useRadio_unstable = (props, ref) => {
|
|
|
57
58
|
...nativeProps.primary
|
|
58
59
|
}
|
|
59
60
|
});
|
|
61
|
+
input.onChange = react_utilities_1.useMergedEventCallbacks(input.onChange, ev => onChange === null || onChange === void 0 ? void 0 : onChange(ev, {
|
|
62
|
+
value: ev.currentTarget.value
|
|
63
|
+
}));
|
|
60
64
|
const label = react_utilities_1.resolveShorthand(props.label, {
|
|
61
65
|
defaultProps: {
|
|
62
66
|
htmlFor: input.id,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["components/Radio/useRadio.tsx"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,MAAA,aAAA,gBAAA,OAAA,CAAA,uBAAA,CAAA;;AACA,MAAA,aAAA,gBAAA,OAAA,CAAA,uBAAA,CAAA;;AACA,MAAA,iBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA;;AACA,MAAA,mBAAA,gBAAA,OAAA,CAAA,kCAAA,CAAA;AAGA;;;;;;;;AAQG;;;AACI,MAAM,iBAAiB,GAAG,CAAC,KAAD,EAAoB,GAApB,KAAoE;AACnG,QAAM,KAAK,GAAG,KAAK,CAAC,UAAN,CAAiB,mBAAA,CAAA,iBAAjB,CAAd;AAEA,QAAM;AACJ,IAAA,IAAI,GAAG,KAAK,CAAC,IADT;AAEJ,IAAA,OAAO,GAAG,KAAK,CAAC,KAAN,KAAgB,SAAhB,GAA4B,KAAK,CAAC,KAAN,KAAgB,KAAK,CAAC,KAAlD,GAA0D,SAFhE;AAGJ,IAAA,cAAc,GAAG,KAAK,CAAC,YAAN,KAAuB,SAAvB,GAAmC,KAAK,CAAC,YAAN,KAAuB,KAAK,CAAC,KAAhE,GAAwE,SAHrF;AAIJ,IAAA,aAAa,GAAG,KAAK,CAAC,MAAN,KAAiB,mBAAjB,GAAuC,OAAvC,GAAiD,OAJ7D;AAKJ,IAAA,QAAQ,GAAG,KAAK,CAAC,QALb;AAMJ,IAAA;
|
|
1
|
+
{"version":3,"sources":["components/Radio/useRadio.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { CircleFilled } from '@fluentui/react-icons';\nimport { Label } from '@fluentui/react-label';\nimport { getPartitionedNativeProps, resolveShorthand, useId, useMergedEventCallbacks } from '@fluentui/react-utilities';\nimport { RadioGroupContext } from '../../contexts/RadioGroupContext';\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 group = React.useContext(RadioGroupContext);\n\n const {\n name = group.name,\n checked = group.value !== undefined ? group.value === props.value : undefined,\n defaultChecked = group.defaultValue !== undefined ? group.defaultValue === props.value : undefined,\n labelPosition = group.layout === 'horizontalStacked' ? 'below' : 'after',\n disabled = group.disabled,\n required,\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: 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 ...nativeProps.primary,\n },\n });\n\n input.onChange = useMergedEventCallbacks(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 required,\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"],"sourceRoot":"../src/"}
|
|
@@ -1,5 +1,10 @@
|
|
|
1
|
-
import type { RadioState } from './Radio.types';
|
|
1
|
+
import type { RadioSlots, RadioState } from './Radio.types';
|
|
2
|
+
import type { SlotClassNames } from '@fluentui/react-utilities';
|
|
3
|
+
/**
|
|
4
|
+
* @deprecated Use `radioClassNames.root` instead.
|
|
5
|
+
*/
|
|
2
6
|
export declare const radioClassName = "fui-Radio";
|
|
7
|
+
export declare const radioClassNames: SlotClassNames<RadioSlots>;
|
|
3
8
|
/**
|
|
4
9
|
* Apply styling to the Radio slots based on the state
|
|
5
10
|
*/
|
|
@@ -3,17 +3,25 @@
|
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
|
-
exports.useRadioStyles_unstable = exports.radioClassName = void 0;
|
|
6
|
+
exports.useRadioStyles_unstable = exports.radioClassNames = exports.radioClassName = void 0;
|
|
7
7
|
|
|
8
8
|
const react_tabster_1 = /*#__PURE__*/require("@fluentui/react-tabster");
|
|
9
9
|
|
|
10
10
|
const react_theme_1 = /*#__PURE__*/require("@fluentui/react-theme");
|
|
11
11
|
|
|
12
12
|
const react_1 = /*#__PURE__*/require("@griffel/react");
|
|
13
|
+
/**
|
|
14
|
+
* @deprecated Use `radioClassNames.root` instead.
|
|
15
|
+
*/
|
|
16
|
+
|
|
13
17
|
|
|
14
18
|
exports.radioClassName = 'fui-Radio';
|
|
15
|
-
|
|
16
|
-
|
|
19
|
+
exports.radioClassNames = {
|
|
20
|
+
root: 'fui-Radio',
|
|
21
|
+
indicator: 'fui-Radio__indicator',
|
|
22
|
+
input: 'fui-Radio__input',
|
|
23
|
+
label: 'fui-Radio__label'
|
|
24
|
+
}; // TODO replace these spacing constants with theme values once they're on the theme
|
|
17
25
|
|
|
18
26
|
const spacingHorizontalS = '8px';
|
|
19
27
|
const spacingHorizontalM = '12px'; // The indicator size is used by the indicator and label styles
|
|
@@ -184,15 +192,15 @@ const useLabelStyles = /*#__PURE__*/react_1.__styles({
|
|
|
184
192
|
|
|
185
193
|
const useRadioStyles_unstable = state => {
|
|
186
194
|
const rootStyles = useRootStyles();
|
|
187
|
-
state.root.className = react_1.mergeClasses(exports.
|
|
195
|
+
state.root.className = react_1.mergeClasses(exports.radioClassNames.root, rootStyles.base, rootStyles.focusIndicator, state.labelPosition === 'below' && rootStyles.vertical, state.root.className);
|
|
188
196
|
const inputStyles = useInputStyles();
|
|
189
|
-
state.input.className = react_1.mergeClasses(inputStyles.base, state.input.className);
|
|
197
|
+
state.input.className = react_1.mergeClasses(exports.radioClassNames.input, inputStyles.base, state.input.className);
|
|
190
198
|
const indicatorStyles = useIndicatorStyles();
|
|
191
|
-
state.indicator.className = react_1.mergeClasses(
|
|
199
|
+
state.indicator.className = react_1.mergeClasses(exports.radioClassNames.indicator, indicatorStyles.base, state.indicator.className);
|
|
192
200
|
const labelStyles = useLabelStyles();
|
|
193
201
|
|
|
194
202
|
if (state.label) {
|
|
195
|
-
state.label.className = react_1.mergeClasses(
|
|
203
|
+
state.label.className = react_1.mergeClasses(exports.radioClassNames.label, labelStyles.base, state.labelPosition === 'below' && labelStyles.below, state.label.className);
|
|
196
204
|
}
|
|
197
205
|
};
|
|
198
206
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["components/Radio/useRadioStyles.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,eAAA,gBAAA,OAAA,CAAA,yBAAA,CAAA;;AACA,MAAA,aAAA,gBAAA,OAAA,CAAA,uBAAA,CAAA;;AACA,MAAA,OAAA,gBAAA,OAAA,CAAA,gBAAA,CAAA;;
|
|
1
|
+
{"version":3,"sources":["components/Radio/useRadioStyles.ts"],"names":[],"mappings":"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","sourcesContent":["import { createFocusOutlineStyle } from '@fluentui/react-tabster';\nimport { tokens } from '@fluentui/react-theme';\nimport { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport type { RadioSlots, RadioState } from './Radio.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\n/**\n * @deprecated Use `radioClassNames.root` instead.\n */\nexport const radioClassName = 'fui-Radio';\nexport const radioClassNames: SlotClassNames<RadioSlots> = {\n root: 'fui-Radio',\n indicator: 'fui-Radio__indicator',\n input: 'fui-Radio__input',\n label: 'fui-Radio__label',\n};\n\n// TODO replace these spacing constants with theme values once they're on the theme\nconst spacingHorizontalS = '8px';\nconst spacingHorizontalM = '12px';\n\n// The indicator size is used by the indicator and label styles\nconst indicatorSize = '16px';\n\n/**\n * Styles for the root slot\n */\nconst useRootStyles = makeStyles({\n base: {\n display: 'inline-flex',\n position: 'relative',\n columnGap: spacingHorizontalM,\n ...shorthands.padding(spacingHorizontalS),\n },\n\n vertical: {\n flexDirection: 'column',\n alignItems: 'center',\n rowGap: spacingHorizontalM,\n },\n\n focusIndicator: createFocusOutlineStyle({ style: {}, selector: 'focus-within' }),\n});\n\nconst useInputStyles = makeStyles({\n base: {\n position: 'absolute',\n left: 0,\n top: 0,\n width: '100%',\n height: '100%',\n boxSizing: 'border-box',\n ...shorthands.margin(0),\n opacity: 0,\n\n ':enabled': {\n cursor: 'pointer',\n },\n\n // When unchecked, hide the circle icon (child of the indicator)\n [`:not(:checked) ~ .${radioClassNames.indicator} > *`]: {\n opacity: '0',\n },\n\n // Colors for the unchecked state\n ':enabled:not(:checked)': {\n [`& ~ .${radioClassNames.label}`]: {\n color: tokens.colorNeutralForeground3,\n },\n [`& ~ .${radioClassNames.indicator}`]: {\n ...shorthands.borderColor(tokens.colorNeutralStrokeAccessible),\n },\n\n ':hover': {\n [`& ~ .${radioClassNames.label}`]: {\n color: tokens.colorNeutralForeground2,\n },\n [`& ~ .${radioClassNames.indicator}`]: {\n ...shorthands.borderColor(tokens.colorNeutralStrokeAccessibleHover),\n },\n },\n\n ':hover:active': {\n [`& ~ .${radioClassNames.label}`]: {\n color: tokens.colorNeutralForeground1,\n },\n [`& ~ .${radioClassNames.indicator}`]: {\n ...shorthands.borderColor(tokens.colorNeutralStrokeAccessiblePressed),\n },\n },\n },\n\n // Colors for the checked state\n ':enabled:checked': {\n [`& ~ .${radioClassNames.label}`]: {\n color: tokens.colorNeutralForeground1,\n },\n [`& ~ .${radioClassNames.indicator}`]: {\n ...shorthands.borderColor(tokens.colorCompoundBrandStroke),\n color: tokens.colorCompoundBrandForeground1,\n },\n\n ':hover': {\n [`& ~ .${radioClassNames.indicator}`]: {\n ...shorthands.borderColor(tokens.colorCompoundBrandStrokeHover),\n color: tokens.colorCompoundBrandForeground1Hover,\n },\n },\n\n ':hover:active': {\n [`& ~ .${radioClassNames.indicator}`]: {\n ...shorthands.borderColor(tokens.colorCompoundBrandStrokePressed),\n color: tokens.colorCompoundBrandForeground1Pressed,\n },\n },\n },\n\n // Colors for the disabled state\n ':disabled': {\n [`& ~ .${radioClassNames.label}`]: {\n color: tokens.colorNeutralForegroundDisabled,\n },\n [`& ~ .${radioClassNames.indicator}`]: {\n ...shorthands.borderColor(tokens.colorNeutralStrokeDisabled),\n color: tokens.colorNeutralForegroundDisabled,\n },\n },\n },\n});\n\nconst useIndicatorStyles = makeStyles({\n base: {\n width: indicatorSize,\n height: indicatorSize,\n fontSize: '12px',\n boxSizing: 'border-box',\n flexShrink: 0,\n\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n ...shorthands.overflow('hidden'),\n\n ...shorthands.border(tokens.strokeWidthThin, 'solid'),\n ...shorthands.borderRadius(tokens.borderRadiusCircular),\n fill: 'currentColor',\n pointerEvents: 'none',\n },\n});\n\nconst useLabelStyles = makeStyles({\n base: {\n alignSelf: 'center',\n userSelect: 'none',\n\n // Use a (negative) margin to account for the difference between the indicator's height and the label's line height.\n // This prevents the label from expanding the height of the Radio, but preserves line height if the label wraps.\n ...shorthands.margin(`calc((${indicatorSize} - ${tokens.lineHeightBase300}) / 2)`, 0),\n },\n\n below: {\n textAlign: 'center',\n },\n});\n\n/**\n * Apply styling to the Radio slots based on the state\n */\nexport const useRadioStyles_unstable = (state: RadioState) => {\n const rootStyles = useRootStyles();\n state.root.className = mergeClasses(\n radioClassNames.root,\n rootStyles.base,\n rootStyles.focusIndicator,\n state.labelPosition === 'below' && rootStyles.vertical,\n state.root.className,\n );\n\n const inputStyles = useInputStyles();\n state.input.className = mergeClasses(radioClassNames.input, inputStyles.base, state.input.className);\n\n const indicatorStyles = useIndicatorStyles();\n state.indicator.className = mergeClasses(radioClassNames.indicator, indicatorStyles.base, state.indicator.className);\n\n const labelStyles = useLabelStyles();\n if (state.label) {\n state.label.className = mergeClasses(\n radioClassNames.label,\n labelStyles.base,\n state.labelPosition === 'below' && labelStyles.below,\n state.label.className,\n );\n }\n};\n"],"sourceRoot":"../src/"}
|
|
@@ -1,5 +1,10 @@
|
|
|
1
|
-
import { RadioGroupState } from './RadioGroup.types';
|
|
1
|
+
import { RadioGroupSlots, RadioGroupState } from './RadioGroup.types';
|
|
2
|
+
import type { SlotClassNames } from '@fluentui/react-utilities';
|
|
3
|
+
/**
|
|
4
|
+
* @deprecated Use `radioGroupClassNames.root` instead.
|
|
5
|
+
*/
|
|
2
6
|
export declare const radioGroupClassName = "fui-RadioGroup";
|
|
7
|
+
export declare const radioGroupClassNames: SlotClassNames<RadioGroupSlots>;
|
|
3
8
|
/**
|
|
4
9
|
* Apply styling to the RadioGroup slots based on the state
|
|
5
10
|
*/
|
|
@@ -3,11 +3,18 @@
|
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
|
-
exports.useRadioGroupStyles_unstable = exports.radioGroupClassName = void 0;
|
|
6
|
+
exports.useRadioGroupStyles_unstable = exports.radioGroupClassNames = exports.radioGroupClassName = void 0;
|
|
7
7
|
|
|
8
8
|
const react_1 = /*#__PURE__*/require("@griffel/react");
|
|
9
|
+
/**
|
|
10
|
+
* @deprecated Use `radioGroupClassNames.root` instead.
|
|
11
|
+
*/
|
|
12
|
+
|
|
9
13
|
|
|
10
14
|
exports.radioGroupClassName = 'fui-RadioGroup';
|
|
15
|
+
exports.radioGroupClassNames = {
|
|
16
|
+
root: 'fui-RadioGroup'
|
|
17
|
+
};
|
|
11
18
|
|
|
12
19
|
const useStyles = /*#__PURE__*/react_1.__styles({
|
|
13
20
|
"root": {
|
|
@@ -27,7 +34,7 @@ const useStyles = /*#__PURE__*/react_1.__styles({
|
|
|
27
34
|
|
|
28
35
|
const useRadioGroupStyles_unstable = state => {
|
|
29
36
|
const styles = useStyles();
|
|
30
|
-
state.root.className = react_1.mergeClasses(exports.
|
|
37
|
+
state.root.className = react_1.mergeClasses(exports.radioGroupClassNames.root, styles.root, state.layout === 'vertical' && styles.vertical, state.root.className);
|
|
31
38
|
};
|
|
32
39
|
|
|
33
40
|
exports.useRadioGroupStyles_unstable = useRadioGroupStyles_unstable;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["components/RadioGroup/useRadioGroupStyles.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,OAAA,gBAAA,OAAA,CAAA,gBAAA,CAAA;;
|
|
1
|
+
{"version":3,"sources":["components/RadioGroup/useRadioGroupStyles.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,OAAA,gBAAA,OAAA,CAAA,gBAAA,CAAA;AAIA;;AAEG;;;AACU,OAAA,CAAA,mBAAA,GAAsB,gBAAtB;AACA,OAAA,CAAA,oBAAA,GAAwD;AACnE,EAAA,IAAI,EAAE;AAD6D,CAAxD;;AAIb,MAAM,SAAS,gBAAG,OAAA,SAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAAlB;AAWA;;AAEG;;;AACI,MAAM,4BAA4B,GAAI,KAAD,IAA2B;AACrE,QAAM,MAAM,GAAG,SAAS,EAAxB;AACA,EAAA,KAAK,CAAC,IAAN,CAAW,SAAX,GAAuB,OAAA,CAAA,YAAA,CACrB,OAAA,CAAA,oBAAA,CAAqB,IADA,EAErB,MAAM,CAAC,IAFc,EAGrB,KAAK,CAAC,MAAN,KAAiB,UAAjB,IAA+B,MAAM,CAAC,QAHjB,EAIrB,KAAK,CAAC,IAAN,CAAW,SAJU,CAAvB;AAMD,CARM;;AAAM,OAAA,CAAA,4BAAA,GAA4B,4BAA5B","sourcesContent":["import { makeStyles, mergeClasses } from '@griffel/react';\nimport { RadioGroupSlots, RadioGroupState } from './RadioGroup.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\n/**\n * @deprecated Use `radioGroupClassNames.root` instead.\n */\nexport const radioGroupClassName = 'fui-RadioGroup';\nexport const radioGroupClassNames: SlotClassNames<RadioGroupSlots> = {\n root: 'fui-RadioGroup',\n};\n\nconst useStyles = makeStyles({\n root: {\n display: 'flex',\n alignItems: 'flex-start',\n },\n\n vertical: {\n flexDirection: 'column',\n },\n});\n\n/**\n * Apply styling to the RadioGroup slots based on the state\n */\nexport const useRadioGroupStyles_unstable = (state: RadioGroupState) => {\n const styles = useStyles();\n state.root.className = mergeClasses(\n radioGroupClassNames.root,\n styles.root,\n state.layout === 'vertical' && styles.vertical,\n state.root.className,\n );\n};\n"],"sourceRoot":"../src/"}
|
package/lib-commonjs/index.d.ts
CHANGED
|
@@ -1,3 +1,6 @@
|
|
|
1
|
-
export
|
|
2
|
-
export
|
|
3
|
-
export
|
|
1
|
+
export { RadioGroup, radioGroupClassName, radioGroupClassNames, renderRadioGroup_unstable, useRadioGroupStyles_unstable, useRadioGroup_unstable, } from './RadioGroup';
|
|
2
|
+
export type { RadioGroupOnChangeData, RadioGroupProps, RadioGroupSlots, RadioGroupState } from './RadioGroup';
|
|
3
|
+
export { Radio, radioClassName, radioClassNames, renderRadio_unstable, useRadioStyles_unstable, useRadio_unstable, } from './Radio';
|
|
4
|
+
export type { RadioProps, RadioSlots, RadioState, RadioOnChangeData } from './Radio';
|
|
5
|
+
export { RadioGroupContext } from './contexts/RadioGroupContext';
|
|
6
|
+
export type { RadioGroupContextValue } from './contexts/RadioGroupContext';
|
package/lib-commonjs/index.js
CHANGED
|
@@ -3,12 +3,96 @@
|
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
|
+
exports.RadioGroupContext = exports.useRadio_unstable = exports.useRadioStyles_unstable = exports.renderRadio_unstable = exports.radioClassNames = exports.radioClassName = exports.Radio = exports.useRadioGroup_unstable = exports.useRadioGroupStyles_unstable = exports.renderRadioGroup_unstable = exports.radioGroupClassNames = exports.radioGroupClassName = exports.RadioGroup = void 0;
|
|
6
7
|
|
|
7
|
-
|
|
8
|
+
var RadioGroup_1 = /*#__PURE__*/require("./RadioGroup");
|
|
8
9
|
|
|
9
|
-
|
|
10
|
+
Object.defineProperty(exports, "RadioGroup", {
|
|
11
|
+
enumerable: true,
|
|
12
|
+
get: function () {
|
|
13
|
+
return RadioGroup_1.RadioGroup;
|
|
14
|
+
}
|
|
15
|
+
});
|
|
16
|
+
/* eslint-disable-next-line deprecation/deprecation */
|
|
10
17
|
|
|
11
|
-
|
|
18
|
+
Object.defineProperty(exports, "radioGroupClassName", {
|
|
19
|
+
enumerable: true,
|
|
20
|
+
get: function () {
|
|
21
|
+
return RadioGroup_1.radioGroupClassName;
|
|
22
|
+
}
|
|
23
|
+
});
|
|
24
|
+
Object.defineProperty(exports, "radioGroupClassNames", {
|
|
25
|
+
enumerable: true,
|
|
26
|
+
get: function () {
|
|
27
|
+
return RadioGroup_1.radioGroupClassNames;
|
|
28
|
+
}
|
|
29
|
+
});
|
|
30
|
+
Object.defineProperty(exports, "renderRadioGroup_unstable", {
|
|
31
|
+
enumerable: true,
|
|
32
|
+
get: function () {
|
|
33
|
+
return RadioGroup_1.renderRadioGroup_unstable;
|
|
34
|
+
}
|
|
35
|
+
});
|
|
36
|
+
Object.defineProperty(exports, "useRadioGroupStyles_unstable", {
|
|
37
|
+
enumerable: true,
|
|
38
|
+
get: function () {
|
|
39
|
+
return RadioGroup_1.useRadioGroupStyles_unstable;
|
|
40
|
+
}
|
|
41
|
+
});
|
|
42
|
+
Object.defineProperty(exports, "useRadioGroup_unstable", {
|
|
43
|
+
enumerable: true,
|
|
44
|
+
get: function () {
|
|
45
|
+
return RadioGroup_1.useRadioGroup_unstable;
|
|
46
|
+
}
|
|
47
|
+
});
|
|
48
|
+
|
|
49
|
+
var Radio_1 = /*#__PURE__*/require("./Radio");
|
|
50
|
+
|
|
51
|
+
Object.defineProperty(exports, "Radio", {
|
|
52
|
+
enumerable: true,
|
|
53
|
+
get: function () {
|
|
54
|
+
return Radio_1.Radio;
|
|
55
|
+
}
|
|
56
|
+
});
|
|
57
|
+
/* eslint-disable-next-line deprecation/deprecation */
|
|
12
58
|
|
|
13
|
-
|
|
59
|
+
Object.defineProperty(exports, "radioClassName", {
|
|
60
|
+
enumerable: true,
|
|
61
|
+
get: function () {
|
|
62
|
+
return Radio_1.radioClassName;
|
|
63
|
+
}
|
|
64
|
+
});
|
|
65
|
+
Object.defineProperty(exports, "radioClassNames", {
|
|
66
|
+
enumerable: true,
|
|
67
|
+
get: function () {
|
|
68
|
+
return Radio_1.radioClassNames;
|
|
69
|
+
}
|
|
70
|
+
});
|
|
71
|
+
Object.defineProperty(exports, "renderRadio_unstable", {
|
|
72
|
+
enumerable: true,
|
|
73
|
+
get: function () {
|
|
74
|
+
return Radio_1.renderRadio_unstable;
|
|
75
|
+
}
|
|
76
|
+
});
|
|
77
|
+
Object.defineProperty(exports, "useRadioStyles_unstable", {
|
|
78
|
+
enumerable: true,
|
|
79
|
+
get: function () {
|
|
80
|
+
return Radio_1.useRadioStyles_unstable;
|
|
81
|
+
}
|
|
82
|
+
});
|
|
83
|
+
Object.defineProperty(exports, "useRadio_unstable", {
|
|
84
|
+
enumerable: true,
|
|
85
|
+
get: function () {
|
|
86
|
+
return Radio_1.useRadio_unstable;
|
|
87
|
+
}
|
|
88
|
+
});
|
|
89
|
+
|
|
90
|
+
var RadioGroupContext_1 = /*#__PURE__*/require("./contexts/RadioGroupContext");
|
|
91
|
+
|
|
92
|
+
Object.defineProperty(exports, "RadioGroupContext", {
|
|
93
|
+
enumerable: true,
|
|
94
|
+
get: function () {
|
|
95
|
+
return RadioGroupContext_1.RadioGroupContext;
|
|
96
|
+
}
|
|
97
|
+
});
|
|
14
98
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["index.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"sources":["index.ts"],"names":[],"mappings":";;;;;;;AAAA,IAAA,YAAA,gBAAA,OAAA,CAAA,cAAA,CAAA;;AACE,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,YAAA,EAAA;AAAA,EAAA,UAAA,EAAA,IAAA;AAAA,EAAA,GAAA,EAAA,YAAA;AAAA,WAAA,YAAA,CAAA,UAAA;AAAU;AAAV,CAAA;AACA;;AACA,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,qBAAA,EAAA;AAAA,EAAA,UAAA,EAAA,IAAA;AAAA,EAAA,GAAA,EAAA,YAAA;AAAA,WAAA,YAAA,CAAA,mBAAA;AAAmB;AAAnB,CAAA;AACA,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,sBAAA,EAAA;AAAA,EAAA,UAAA,EAAA,IAAA;AAAA,EAAA,GAAA,EAAA,YAAA;AAAA,WAAA,YAAA,CAAA,oBAAA;AAAoB;AAApB,CAAA;AACA,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,2BAAA,EAAA;AAAA,EAAA,UAAA,EAAA,IAAA;AAAA,EAAA,GAAA,EAAA,YAAA;AAAA,WAAA,YAAA,CAAA,yBAAA;AAAyB;AAAzB,CAAA;AACA,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,8BAAA,EAAA;AAAA,EAAA,UAAA,EAAA,IAAA;AAAA,EAAA,GAAA,EAAA,YAAA;AAAA,WAAA,YAAA,CAAA,4BAAA;AAA4B;AAA5B,CAAA;AACA,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,wBAAA,EAAA;AAAA,EAAA,UAAA,EAAA,IAAA;AAAA,EAAA,GAAA,EAAA,YAAA;AAAA,WAAA,YAAA,CAAA,sBAAA;AAAsB;AAAtB,CAAA;;AAGF,IAAA,OAAA,gBAAA,OAAA,CAAA,SAAA,CAAA;;AACE,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,OAAA,EAAA;AAAA,EAAA,UAAA,EAAA,IAAA;AAAA,EAAA,GAAA,EAAA,YAAA;AAAA,WAAA,OAAA,CAAA,KAAA;AAAK;AAAL,CAAA;AACA;;AACA,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,gBAAA,EAAA;AAAA,EAAA,UAAA,EAAA,IAAA;AAAA,EAAA,GAAA,EAAA,YAAA;AAAA,WAAA,OAAA,CAAA,cAAA;AAAc;AAAd,CAAA;AACA,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,iBAAA,EAAA;AAAA,EAAA,UAAA,EAAA,IAAA;AAAA,EAAA,GAAA,EAAA,YAAA;AAAA,WAAA,OAAA,CAAA,eAAA;AAAe;AAAf,CAAA;AACA,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,sBAAA,EAAA;AAAA,EAAA,UAAA,EAAA,IAAA;AAAA,EAAA,GAAA,EAAA,YAAA;AAAA,WAAA,OAAA,CAAA,oBAAA;AAAoB;AAApB,CAAA;AACA,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,yBAAA,EAAA;AAAA,EAAA,UAAA,EAAA,IAAA;AAAA,EAAA,GAAA,EAAA,YAAA;AAAA,WAAA,OAAA,CAAA,uBAAA;AAAuB;AAAvB,CAAA;AACA,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,mBAAA,EAAA;AAAA,EAAA,UAAA,EAAA,IAAA;AAAA,EAAA,GAAA,EAAA,YAAA;AAAA,WAAA,OAAA,CAAA,iBAAA;AAAiB;AAAjB,CAAA;;AAGF,IAAA,mBAAA,gBAAA,OAAA,CAAA,8BAAA,CAAA;;AAAS,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,mBAAA,EAAA;AAAA,EAAA,UAAA,EAAA,IAAA;AAAA,EAAA,GAAA,EAAA,YAAA;AAAA,WAAA,mBAAA,CAAA,iBAAA;AAAiB;AAAjB,CAAA","sourcesContent":["export {\n RadioGroup,\n /* eslint-disable-next-line deprecation/deprecation */\n radioGroupClassName,\n radioGroupClassNames,\n renderRadioGroup_unstable,\n useRadioGroupStyles_unstable,\n useRadioGroup_unstable,\n} from './RadioGroup';\nexport type { RadioGroupOnChangeData, RadioGroupProps, RadioGroupSlots, RadioGroupState } from './RadioGroup';\nexport {\n Radio,\n /* eslint-disable-next-line deprecation/deprecation */\n radioClassName,\n radioClassNames,\n renderRadio_unstable,\n useRadioStyles_unstable,\n useRadio_unstable,\n} from './Radio';\nexport type { RadioProps, RadioSlots, RadioState, RadioOnChangeData } from './Radio';\nexport { RadioGroupContext } from './contexts/RadioGroupContext';\nexport type { RadioGroupContextValue } from './contexts/RadioGroupContext';\n"],"sourceRoot":"../src/"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@fluentui/react-radio",
|
|
3
|
-
"version": "0.0.0-nightly-
|
|
3
|
+
"version": "0.0.0-nightly-20220318-0416.1",
|
|
4
4
|
"description": "Fluent UI Radio component",
|
|
5
5
|
"main": "lib-commonjs/index.js",
|
|
6
6
|
"module": "lib/index.js",
|
|
@@ -27,14 +27,14 @@
|
|
|
27
27
|
"devDependencies": {
|
|
28
28
|
"@fluentui/eslint-plugin": "*",
|
|
29
29
|
"@fluentui/react-conformance": "*",
|
|
30
|
-
"@fluentui/react-conformance-griffel": "0.0.0-nightly-
|
|
30
|
+
"@fluentui/react-conformance-griffel": "0.0.0-nightly-20220318-0416.1"
|
|
31
31
|
},
|
|
32
32
|
"dependencies": {
|
|
33
33
|
"@fluentui/react-icons": "^2.0.159-beta.10",
|
|
34
|
-
"@fluentui/react-label": "0.0.0-nightly-
|
|
35
|
-
"@fluentui/react-tabster": "0.0.0-nightly-
|
|
36
|
-
"@fluentui/react-theme": "0.0.0-nightly-
|
|
37
|
-
"@fluentui/react-utilities": "0.0.0-nightly-
|
|
34
|
+
"@fluentui/react-label": "0.0.0-nightly-20220318-0416.1",
|
|
35
|
+
"@fluentui/react-tabster": "0.0.0-nightly-20220318-0416.1",
|
|
36
|
+
"@fluentui/react-theme": "0.0.0-nightly-20220318-0416.1",
|
|
37
|
+
"@fluentui/react-utilities": "0.0.0-nightly-20220318-0416.1",
|
|
38
38
|
"@griffel/react": "1.0.0",
|
|
39
39
|
"tslib": "^2.1.0"
|
|
40
40
|
},
|