@fluentui-react-native/tester 0.98.0 → 0.99.0

package/CHANGELOG.json

@@ -2,7 +2,28 @@
   "name": "@fluentui-react-native/tester",
   "entries": [
     {
-      "date": "Tue, 27 Sep 2022 18:09:15 GMT",
+      "date": "Tue, 27 Sep 2022 20:55:38 GMT",
+      "tag": "@fluentui-react-native/tester_v0.99.0",
+      "version": "0.99.0",
+      "comments": {
+        "minor": [
+          {
+            "author": "gulnazsayed@microsoft.com",
+            "package": "@fluentui-react-native/tester",
+            "commit": "93fb68fc7b815141a45c275b56330761ff210c38",
+            "comment": "Added required RadioGroup to tester app"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui-react-native/tester",
+            "comment": "Bump @fluentui-react-native/experimental-radio-group to v0.5.0",
+            "commit": "93fb68fc7b815141a45c275b56330761ff210c38"
+          }
+        ]
+      }
+    },
+    {
+      "date": "Tue, 27 Sep 2022 18:09:32 GMT",
       "tag": "@fluentui-react-native/tester_v0.98.0",
       "version": "0.98.0",
       "comments": {

package/CHANGELOG.md

@@ -1,12 +1,21 @@
 # Change Log - @fluentui-react-native/tester
 
-This log was last generated on Tue, 27 Sep 2022 18:09:15 GMT and should not be manually modified.
+This log was last generated on Tue, 27 Sep 2022 20:55:38 GMT and should not be manually modified.
 
 <!-- Start content -->
 
+## 0.99.0
+
+Tue, 27 Sep 2022 20:55:38 GMT
+
+### Minor changes
+
+- Added required RadioGroup to tester app (gulnazsayed@microsoft.com)
+- Bump @fluentui-react-native/experimental-radio-group to v0.5.0
+
 ## 0.98.0
 
-Tue, 27 Sep 2022 18:09:15 GMT
+Tue, 27 Sep 2022 18:09:32 GMT
 
 ### Minor changes
 

package/lib/TestComponents/RadioGroupExperimental/RadioGroupExperimentalTest.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"RadioGroupExperimentalTest.d.ts","sourceRoot":"","sources":["../../../src/TestComponents/RadioGroupExperimental/RadioGroupExperimentalTest.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAmB/B,eAAO,MAAM,0BAA0B,EAAE,KAAK,CAAC,iBAuB9C,CAAC"}
+{"version":3,"file":"RadioGroupExperimentalTest.d.ts","sourceRoot":"","sources":["../../../src/TestComponents/RadioGroupExperimental/RadioGroupExperimentalTest.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAyB/B,eAAO,MAAM,0BAA0B,EAAE,KAAK,CAAC,iBAuB9C,CAAC"}

package/lib/TestComponents/RadioGroupExperimental/RadioGroupExperimentalTest.js

@@ -1,6 +1,7 @@
 import * as React from 'react';
 import { RADIO_GROUP_EXPERIMENTAL_TESTPAGE } from './consts';
 import { DefaultRadioGroup } from './DefaultRadioGroup';
+import { RequiredRadioGroup } from './RequiredRadioGroup';
 import { DisabledRadioGroup } from './DisabledRadioGroup';
 import { Test } from '../Test';
 var radioGroupExperimentalSections = [
@@ -14,6 +15,11 @@ var radioGroupExperimentalSections = [
         testID: RADIO_GROUP_EXPERIMENTAL_TESTPAGE,
         component: DisabledRadioGroup,
     },
+    {
+        name: 'Required RadioGroup',
+        testID: RADIO_GROUP_EXPERIMENTAL_TESTPAGE,
+        component: RequiredRadioGroup,
+    },
 ];
 export var RadioGroupExperimentalTest = function () {
     var status = {

package/lib/TestComponents/RadioGroupExperimental/RadioGroupExperimentalTest.js.map

@@ -1 +1 @@
-{"version":3,"file":"RadioGroupExperimentalTest.js","sourceRoot":"","sources":["../../../src/TestComponents/RadioGroupExperimental/RadioGroupExperimentalTest.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,iCAAiC,EAAE,MAAM,UAAU,CAAC;AAC7D,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AACxD,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AAC1D,OAAO,EAAE,IAAI,EAA+B,MAAM,SAAS,CAAC;AAE5D,IAAM,8BAA8B,GAAkB;IACpD;QACE,IAAI,EAAE,0BAA0B;QAChC,MAAM,EAAE,iCAAiC;QACzC,SAAS,EAAE,iBAAiB;KAC7B;IACD;QACE,IAAI,EAAE,qBAAqB;QAC3B,MAAM,EAAE,iCAAiC;QACzC,SAAS,EAAE,kBAAkB;KAC9B;CACF,CAAC;AAEF,MAAM,CAAC,IAAM,0BAA0B,GAA4B;IACjE,IAAM,MAAM,GAAmB;QAC7B,WAAW,EAAE,MAAM;QACnB,SAAS,EAAE,cAAc;QACzB,SAAS,EAAE,cAAc;QACzB,WAAW,EAAE,SAAS;QACtB,aAAa,EAAE,SAAS;KACzB,CAAC;IAEF,IAAM,WAAW,GACf,mKAAmK,CAAC;IAEtK,IAAM,IAAI,GAAG,uGAAuG,CAAC;IAErH,OAAO,CACL,oBAAC,IAAI,IACH,IAAI,EAAC,8BAA8B,EACnC,WAAW,EAAE,WAAW,EACxB,IAAI,EAAE,IAAI,EACV,QAAQ,EAAE,8BAA8B,EACxC,MAAM,EAAE,MAAM,GACd,CACH,CAAC;AACJ,CAAC,CAAC"}
+{"version":3,"file":"RadioGroupExperimentalTest.js","sourceRoot":"","sources":["../../../src/TestComponents/RadioGroupExperimental/RadioGroupExperimentalTest.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,iCAAiC,EAAE,MAAM,UAAU,CAAC;AAC7D,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AACxD,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AAC1D,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AAC1D,OAAO,EAAE,IAAI,EAA+B,MAAM,SAAS,CAAC;AAE5D,IAAM,8BAA8B,GAAkB;IACpD;QACE,IAAI,EAAE,0BAA0B;QAChC,MAAM,EAAE,iCAAiC;QACzC,SAAS,EAAE,iBAAiB;KAC7B;IACD;QACE,IAAI,EAAE,qBAAqB;QAC3B,MAAM,EAAE,iCAAiC;QACzC,SAAS,EAAE,kBAAkB;KAC9B;IACD;QACE,IAAI,EAAE,qBAAqB;QAC3B,MAAM,EAAE,iCAAiC;QACzC,SAAS,EAAE,kBAAkB;KAC9B;CACF,CAAC;AAEF,MAAM,CAAC,IAAM,0BAA0B,GAA4B;IACjE,IAAM,MAAM,GAAmB;QAC7B,WAAW,EAAE,MAAM;QACnB,SAAS,EAAE,cAAc;QACzB,SAAS,EAAE,cAAc;QACzB,WAAW,EAAE,SAAS;QACtB,aAAa,EAAE,SAAS;KACzB,CAAC;IAEF,IAAM,WAAW,GACf,mKAAmK,CAAC;IAEtK,IAAM,IAAI,GAAG,uGAAuG,CAAC;IAErH,OAAO,CACL,oBAAC,IAAI,IACH,IAAI,EAAC,8BAA8B,EACnC,WAAW,EAAE,WAAW,EACxB,IAAI,EAAE,IAAI,EACV,QAAQ,EAAE,8BAA8B,EACxC,MAAM,EAAE,MAAM,GACd,CACH,CAAC;AACJ,CAAC,CAAC"}

package/lib/TestComponents/RadioGroupExperimental/RequiredRadioGroup.d.ts

@@ -0,0 +1,3 @@
+import * as React from 'react';
+export declare const RequiredRadioGroup: React.FunctionComponent;
+//# sourceMappingURL=RequiredRadioGroup.d.ts.map

package/lib/TestComponents/RadioGroupExperimental/RequiredRadioGroup.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"RequiredRadioGroup.d.ts","sourceRoot":"","sources":["../../../src/TestComponents/RadioGroupExperimental/RequiredRadioGroup.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,eAAO,MAAM,kBAAkB,EAAE,KAAK,CAAC,iBAgBtC,CAAC"}

package/lib/TestComponents/RadioGroupExperimental/RequiredRadioGroup.js

@@ -0,0 +1,16 @@
+import { RadioGroup, Radio } from '@fluentui-react-native/experimental-radio-group';
+import * as React from 'react';
+import { View } from 'react-native';
+export var RequiredRadioGroup = function () {
+    // Client's example onChange function
+    var onChange = function (key) {
+        console.log(key);
+    };
+    return (React.createElement(View, null,
+        React.createElement(RadioGroup, { required: true, label: "Required RadioGroup", defaultValue: "X", onChange: onChange },
+            React.createElement(Radio, { label: "Option W", value: "W", accessibilityLabel: "Test Accessibility Label" }),
+            React.createElement(Radio, { label: "Option X", value: "X" }),
+            React.createElement(Radio, { label: "Option Y", value: "C" }),
+            React.createElement(Radio, { label: "Option Z", value: "Z" }))));
+};
+//# sourceMappingURL=RequiredRadioGroup.js.map

package/lib/TestComponents/RadioGroupExperimental/RequiredRadioGroup.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RequiredRadioGroup.js","sourceRoot":"","sources":["../../../src/TestComponents/RadioGroupExperimental/RequiredRadioGroup.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,KAAK,EAAE,MAAM,iDAAiD,CAAC;AACpF,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,IAAI,EAAE,MAAM,cAAc,CAAC;AAEpC,MAAM,CAAC,IAAM,kBAAkB,GAA4B;IACzD,qCAAqC;IACrC,IAAM,QAAQ,GAAG,UAAC,GAAW;QAC3B,OAAO,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;IACnB,CAAC,CAAC;IAEF,OAAO,CACL,oBAAC,IAAI;QACH,oBAAC,UAAU,IAAC,QAAQ,QAAC,KAAK,EAAC,qBAAqB,EAAC,YAAY,EAAC,GAAG,EAAC,QAAQ,EAAE,QAAQ;YAClF,oBAAC,KAAK,IAAC,KAAK,EAAC,UAAU,EAAC,KAAK,EAAC,GAAG,EAAC,kBAAkB,EAAC,0BAA0B,GAAG;YAClF,oBAAC,KAAK,IAAC,KAAK,EAAC,UAAU,EAAC,KAAK,EAAC,GAAG,GAAG;YACpC,oBAAC,KAAK,IAAC,KAAK,EAAC,UAAU,EAAC,KAAK,EAAC,GAAG,GAAG;YACpC,oBAAC,KAAK,IAAC,KAAK,EAAC,UAAU,EAAC,KAAK,EAAC,GAAG,GAAG,CACzB,CACR,CACR,CAAC;AACJ,CAAC,CAAC"}

package/lib-commonjs/TestComponents/RadioGroupExperimental/RadioGroupExperimentalTest.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"RadioGroupExperimentalTest.d.ts","sourceRoot":"","sources":["../../../src/TestComponents/RadioGroupExperimental/RadioGroupExperimentalTest.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAmB/B,eAAO,MAAM,0BAA0B,EAAE,KAAK,CAAC,iBAuB9C,CAAC"}
+{"version":3,"file":"RadioGroupExperimentalTest.d.ts","sourceRoot":"","sources":["../../../src/TestComponents/RadioGroupExperimental/RadioGroupExperimentalTest.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAyB/B,eAAO,MAAM,0BAA0B,EAAE,KAAK,CAAC,iBAuB9C,CAAC"}

package/lib-commonjs/TestComponents/RadioGroupExperimental/RadioGroupExperimentalTest.js

@@ -5,6 +5,7 @@ var tslib_1 = require("tslib");
 var React = (0, tslib_1.__importStar)(require("react"));
 var consts_1 = require("./consts");
 var DefaultRadioGroup_1 = require("./DefaultRadioGroup");
+var RequiredRadioGroup_1 = require("./RequiredRadioGroup");
 var DisabledRadioGroup_1 = require("./DisabledRadioGroup");
 var Test_1 = require("../Test");
 var radioGroupExperimentalSections = [
@@ -18,6 +19,11 @@ var radioGroupExperimentalSections = [
         testID: consts_1.RADIO_GROUP_EXPERIMENTAL_TESTPAGE,
         component: DisabledRadioGroup_1.DisabledRadioGroup,
     },
+    {
+        name: 'Required RadioGroup',
+        testID: consts_1.RADIO_GROUP_EXPERIMENTAL_TESTPAGE,
+        component: RequiredRadioGroup_1.RequiredRadioGroup,
+    },
 ];
 var RadioGroupExperimentalTest = function () {
     var status = {

package/lib-commonjs/TestComponents/RadioGroupExperimental/RadioGroupExperimentalTest.js.map

@@ -1 +1 @@
-{"version":3,"file":"RadioGroupExperimentalTest.js","sourceRoot":"","sources":["../../../src/TestComponents/RadioGroupExperimental/RadioGroupExperimentalTest.tsx"],"names":[],"mappings":";;;;AAAA,wDAA+B;AAC/B,mCAA6D;AAC7D,yDAAwD;AACxD,2DAA0D;AAC1D,gCAA4D;AAE5D,IAAM,8BAA8B,GAAkB;IACpD;QACE,IAAI,EAAE,0BAA0B;QAChC,MAAM,EAAE,0CAAiC;QACzC,SAAS,EAAE,qCAAiB;KAC7B;IACD;QACE,IAAI,EAAE,qBAAqB;QAC3B,MAAM,EAAE,0CAAiC;QACzC,SAAS,EAAE,uCAAkB;KAC9B;CACF,CAAC;AAEK,IAAM,0BAA0B,GAA4B;IACjE,IAAM,MAAM,GAAmB;QAC7B,WAAW,EAAE,MAAM;QACnB,SAAS,EAAE,cAAc;QACzB,SAAS,EAAE,cAAc;QACzB,WAAW,EAAE,SAAS;QACtB,aAAa,EAAE,SAAS;KACzB,CAAC;IAEF,IAAM,WAAW,GACf,mKAAmK,CAAC;IAEtK,IAAM,IAAI,GAAG,uGAAuG,CAAC;IAErH,OAAO,CACL,oBAAC,WAAI,IACH,IAAI,EAAC,8BAA8B,EACnC,WAAW,EAAE,WAAW,EACxB,IAAI,EAAE,IAAI,EACV,QAAQ,EAAE,8BAA8B,EACxC,MAAM,EAAE,MAAM,GACd,CACH,CAAC;AACJ,CAAC,CAAC;AAvBW,QAAA,0BAA0B,8BAuBrC"}
+{"version":3,"file":"RadioGroupExperimentalTest.js","sourceRoot":"","sources":["../../../src/TestComponents/RadioGroupExperimental/RadioGroupExperimentalTest.tsx"],"names":[],"mappings":";;;;AAAA,wDAA+B;AAC/B,mCAA6D;AAC7D,yDAAwD;AACxD,2DAA0D;AAC1D,2DAA0D;AAC1D,gCAA4D;AAE5D,IAAM,8BAA8B,GAAkB;IACpD;QACE,IAAI,EAAE,0BAA0B;QAChC,MAAM,EAAE,0CAAiC;QACzC,SAAS,EAAE,qCAAiB;KAC7B;IACD;QACE,IAAI,EAAE,qBAAqB;QAC3B,MAAM,EAAE,0CAAiC;QACzC,SAAS,EAAE,uCAAkB;KAC9B;IACD;QACE,IAAI,EAAE,qBAAqB;QAC3B,MAAM,EAAE,0CAAiC;QACzC,SAAS,EAAE,uCAAkB;KAC9B;CACF,CAAC;AAEK,IAAM,0BAA0B,GAA4B;IACjE,IAAM,MAAM,GAAmB;QAC7B,WAAW,EAAE,MAAM;QACnB,SAAS,EAAE,cAAc;QACzB,SAAS,EAAE,cAAc;QACzB,WAAW,EAAE,SAAS;QACtB,aAAa,EAAE,SAAS;KACzB,CAAC;IAEF,IAAM,WAAW,GACf,mKAAmK,CAAC;IAEtK,IAAM,IAAI,GAAG,uGAAuG,CAAC;IAErH,OAAO,CACL,oBAAC,WAAI,IACH,IAAI,EAAC,8BAA8B,EACnC,WAAW,EAAE,WAAW,EACxB,IAAI,EAAE,IAAI,EACV,QAAQ,EAAE,8BAA8B,EACxC,MAAM,EAAE,MAAM,GACd,CACH,CAAC;AACJ,CAAC,CAAC;AAvBW,QAAA,0BAA0B,8BAuBrC"}

package/lib-commonjs/TestComponents/RadioGroupExperimental/RequiredRadioGroup.d.ts

@@ -0,0 +1,3 @@
+import * as React from 'react';
+export declare const RequiredRadioGroup: React.FunctionComponent;
+//# sourceMappingURL=RequiredRadioGroup.d.ts.map

package/lib-commonjs/TestComponents/RadioGroupExperimental/RequiredRadioGroup.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"RequiredRadioGroup.d.ts","sourceRoot":"","sources":["../../../src/TestComponents/RadioGroupExperimental/RequiredRadioGroup.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,eAAO,MAAM,kBAAkB,EAAE,KAAK,CAAC,iBAgBtC,CAAC"}

package/lib-commonjs/TestComponents/RadioGroupExperimental/RequiredRadioGroup.js

@@ -0,0 +1,21 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.RequiredRadioGroup = void 0;
+var tslib_1 = require("tslib");
+var experimental_radio_group_1 = require("@fluentui-react-native/experimental-radio-group");
+var React = (0, tslib_1.__importStar)(require("react"));
+var react_native_1 = require("react-native");
+var RequiredRadioGroup = function () {
+    // Client's example onChange function
+    var onChange = function (key) {
+        console.log(key);
+    };
+    return (React.createElement(react_native_1.View, null,
+        React.createElement(experimental_radio_group_1.RadioGroup, { required: true, label: "Required RadioGroup", defaultValue: "X", onChange: onChange },
+            React.createElement(experimental_radio_group_1.Radio, { label: "Option W", value: "W", accessibilityLabel: "Test Accessibility Label" }),
+            React.createElement(experimental_radio_group_1.Radio, { label: "Option X", value: "X" }),
+            React.createElement(experimental_radio_group_1.Radio, { label: "Option Y", value: "C" }),
+            React.createElement(experimental_radio_group_1.Radio, { label: "Option Z", value: "Z" }))));
+};
+exports.RequiredRadioGroup = RequiredRadioGroup;
+//# sourceMappingURL=RequiredRadioGroup.js.map

package/lib-commonjs/TestComponents/RadioGroupExperimental/RequiredRadioGroup.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RequiredRadioGroup.js","sourceRoot":"","sources":["../../../src/TestComponents/RadioGroupExperimental/RequiredRadioGroup.tsx"],"names":[],"mappings":";;;;AAAA,4FAAoF;AACpF,wDAA+B;AAC/B,6CAAoC;AAE7B,IAAM,kBAAkB,GAA4B;IACzD,qCAAqC;IACrC,IAAM,QAAQ,GAAG,UAAC,GAAW;QAC3B,OAAO,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;IACnB,CAAC,CAAC;IAEF,OAAO,CACL,oBAAC,mBAAI;QACH,oBAAC,qCAAU,IAAC,QAAQ,QAAC,KAAK,EAAC,qBAAqB,EAAC,YAAY,EAAC,GAAG,EAAC,QAAQ,EAAE,QAAQ;YAClF,oBAAC,gCAAK,IAAC,KAAK,EAAC,UAAU,EAAC,KAAK,EAAC,GAAG,EAAC,kBAAkB,EAAC,0BAA0B,GAAG;YAClF,oBAAC,gCAAK,IAAC,KAAK,EAAC,UAAU,EAAC,KAAK,EAAC,GAAG,GAAG;YACpC,oBAAC,gCAAK,IAAC,KAAK,EAAC,UAAU,EAAC,KAAK,EAAC,GAAG,GAAG;YACpC,oBAAC,gCAAK,IAAC,KAAK,EAAC,UAAU,EAAC,KAAK,EAAC,GAAG,GAAG,CACzB,CACR,CACR,CAAC;AACJ,CAAC,CAAC;AAhBW,QAAA,kBAAkB,sBAgB7B"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fluentui-react-native/tester",
-  "version": "0.98.0",
+  "version": "0.99.0",
   "description": "A test app to test FluentUI React Native Components during development",
   "license": "MIT",
   "author": "Microsoft <fluentuinativeowners@microsoft.com>",
@@ -50,7 +50,7 @@
     "@fluentui-react-native/experimental-expander": "0.4.5",
     "@fluentui-react-native/experimental-menu-button": ">=0.4.32 <1.0.0",
     "@fluentui-react-native/experimental-native-date-picker": ">=0.7.1 <1.0.0",
-    "@fluentui-react-native/experimental-radio-group": "^0.4.0",
+    "@fluentui-react-native/experimental-radio-group": "^0.5.0",
     "@fluentui-react-native/experimental-shadow": "0.2.21",
     "@fluentui-react-native/experimental-shimmer": "0.7.4",
     "@fluentui-react-native/experimental-tabs": "0.5.17",

package/src/TestComponents/RadioGroupExperimental/RadioGroupExperimentalTest.tsx

@@ -1,6 +1,7 @@
 import * as React from 'react';
 import { RADIO_GROUP_EXPERIMENTAL_TESTPAGE } from './consts';
 import { DefaultRadioGroup } from './DefaultRadioGroup';
+import { RequiredRadioGroup } from './RequiredRadioGroup';
 import { DisabledRadioGroup } from './DisabledRadioGroup';
 import { Test, TestSection, PlatformStatus } from '../Test';
 
@@ -15,6 +16,11 @@ const radioGroupExperimentalSections: TestSection[] = [
     testID: RADIO_GROUP_EXPERIMENTAL_TESTPAGE,
     component: DisabledRadioGroup,
   },
+  {
+    name: 'Required RadioGroup',
+    testID: RADIO_GROUP_EXPERIMENTAL_TESTPAGE,
+    component: RequiredRadioGroup,
+  },
 ];
 
 export const RadioGroupExperimentalTest: React.FunctionComponent = () => {

package/src/TestComponents/RadioGroupExperimental/RequiredRadioGroup.tsx

@@ -0,0 +1,21 @@
+import { RadioGroup, Radio } from '@fluentui-react-native/experimental-radio-group';
+import * as React from 'react';
+import { View } from 'react-native';
+
+export const RequiredRadioGroup: React.FunctionComponent = () => {
+  // Client's example onChange function
+  const onChange = (key: string) => {
+    console.log(key);
+  };
+
+  return (
+    <View>
+      <RadioGroup required label="Required RadioGroup" defaultValue="X" onChange={onChange}>
+        <Radio label="Option W" value="W" accessibilityLabel="Test Accessibility Label" />
+        <Radio label="Option X" value="X" />
+        <Radio label="Option Y" value="C" />
+        <Radio label="Option Z" value="Z" />
+      </RadioGroup>
+    </View>
+  );
+};