@fluentui-react-native/tester 0.151.0 → 0.151.2

package/lib-commonjs/fluent-tester/src/TestComponents/Chip/ChipDefault.js

@@ -0,0 +1,57 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ChipDefault = void 0;
+var tslib_1 = require("tslib");
+/* eslint-disable @typescript-eslint/no-var-requires */
+var react_1 = tslib_1.__importStar(require("react"));
+var react_native_1 = require("react-native");
+var chip_1 = require("@fluentui-react-native/chip");
+var switch_1 = require("@fluentui-react-native/switch");
+var text_1 = require("@fluentui-react-native/text");
+var iconExamples_1 = require("../Common/iconExamples");
+var ChipDefault = function () {
+    var _a = react_1.default.useState(false), showCloseIcon = _a[0], setShowCloseIcon = _a[1];
+    var toggleActivityState = (0, react_1.useCallback)(function (_e, isActive) { return setShowCloseIcon(isActive); }, []);
+    var showToast = function () {
+        react_native_1.ToastAndroid.show('Close icon clicked!', react_native_1.ToastAndroid.SHORT);
+    };
+    return (react_1.default.createElement(react_native_1.View, null,
+        react_1.default.createElement(switch_1.Switch, { label: 'Show Close Icon', defaultChecked: showCloseIcon, onChange: toggleActivityState }),
+        react_1.default.createElement(react_native_1.View, { style: styles.rowStyle },
+            react_1.default.createElement(chip_1.Chip, { size: "small", style: styles.rowGap, showCloseIcon: showCloseIcon, closeIconOnPress: showToast }, "Neutral"),
+            react_1.default.createElement(chip_1.Chip, { size: "medium", icon: { svgSource: iconExamples_1.svgProps }, showCloseIcon: showCloseIcon, closeIconOnPress: showToast }, "Neutral")),
+        react_1.default.createElement(react_native_1.View, { style: styles.rowStyle },
+            react_1.default.createElement(chip_1.Chip, { size: "small", style: styles.rowGap, disabled: true, showCloseIcon: showCloseIcon, closeIconOnPress: showToast }, "Disabled"),
+            react_1.default.createElement(chip_1.Chip, { size: "medium", icon: { svgSource: iconExamples_1.svgProps }, disabled: true, showCloseIcon: showCloseIcon, closeIconOnPress: showToast }, "Disabled")),
+        react_1.default.createElement(react_native_1.View, { style: styles.rowStyle },
+            react_1.default.createElement(chip_1.Chip, { size: "small", chipColor: "brand", style: styles.rowGap, showCloseIcon: showCloseIcon, closeIconOnPress: showToast }, "Brand"),
+            react_1.default.createElement(chip_1.Chip, { size: "medium", chipColor: "brand", icon: { svgSource: iconExamples_1.svgProps }, showCloseIcon: showCloseIcon, closeIconOnPress: showToast }, "Brand")),
+        react_1.default.createElement(react_native_1.View, { style: styles.rowStyle },
+            react_1.default.createElement(chip_1.Chip, { size: "small", chipColor: "danger", style: styles.rowGap, showCloseIcon: showCloseIcon, closeIconOnPress: showToast }, "Danger"),
+            react_1.default.createElement(chip_1.Chip, { size: "medium", chipColor: "danger", icon: { svgSource: iconExamples_1.svgProps }, showCloseIcon: showCloseIcon, closeIconOnPress: showToast }, "Danger")),
+        react_1.default.createElement(react_native_1.View, { style: styles.rowStyle },
+            react_1.default.createElement(chip_1.Chip, { size: "small", chipColor: "severe", style: styles.rowGap, showCloseIcon: showCloseIcon, closeIconOnPress: showToast }, "Severe"),
+            react_1.default.createElement(chip_1.Chip, { size: "medium", chipColor: "severe", icon: { svgSource: iconExamples_1.svgProps }, showCloseIcon: showCloseIcon, closeIconOnPress: showToast }, "Severe")),
+        react_1.default.createElement(react_native_1.View, { style: styles.rowStyle },
+            react_1.default.createElement(chip_1.Chip, { size: "small", chipColor: "warning", style: styles.rowGap, showCloseIcon: showCloseIcon, closeIconOnPress: showToast }, "Warning"),
+            react_1.default.createElement(chip_1.Chip, { size: "medium", chipColor: "warning", icon: { svgSource: iconExamples_1.svgProps }, showCloseIcon: showCloseIcon, closeIconOnPress: showToast }, "Warning")),
+        react_1.default.createElement(react_native_1.View, { style: styles.rowStyle },
+            react_1.default.createElement(chip_1.Chip, { size: "small", chipColor: "success", style: styles.rowGap, showCloseIcon: showCloseIcon, closeIconOnPress: showToast }, "Success"),
+            react_1.default.createElement(chip_1.Chip, { size: "medium", chipColor: "success", icon: { svgSource: iconExamples_1.svgProps }, showCloseIcon: showCloseIcon, closeIconOnPress: showToast }, "Success")),
+        react_1.default.createElement(text_1.Text, null, "Search Bar Chip"),
+        react_1.default.createElement(react_native_1.View, { style: styles.rowStyle },
+            react_1.default.createElement(chip_1.Chip, { searchBar: true, size: "small", style: styles.rowGap, showCloseIcon: showCloseIcon, closeIconOnPress: showToast }, "Chip"),
+            react_1.default.createElement(chip_1.Chip, { searchBar: true, size: "medium", icon: { svgSource: iconExamples_1.svgProps }, showCloseIcon: showCloseIcon, closeIconOnPress: showToast }, "Chip")),
+        react_1.default.createElement(react_native_1.View, { style: styles.rowStyle },
+            react_1.default.createElement(chip_1.Chip, { searchBar: true, size: "small", chipColor: "brand", style: styles.rowGap, showCloseIcon: showCloseIcon, closeIconOnPress: showToast }, "Brand"),
+            react_1.default.createElement(chip_1.Chip, { searchBar: true, size: "medium", chipColor: "brand", icon: { svgSource: iconExamples_1.svgProps }, showCloseIcon: showCloseIcon, closeIconOnPress: showToast }, "Brand")),
+        react_1.default.createElement(react_native_1.View, { style: styles.rowStyle },
+            react_1.default.createElement(chip_1.Chip, { searchBar: true, size: "small", style: styles.rowGap, disabled: true, showCloseIcon: showCloseIcon, closeIconOnPress: showToast }, "Disabled"),
+            react_1.default.createElement(chip_1.Chip, { searchBar: true, size: "medium", icon: { svgSource: iconExamples_1.svgProps }, disabled: true, showCloseIcon: showCloseIcon, closeIconOnPress: showToast }, "Disabled"))));
+};
+exports.ChipDefault = ChipDefault;
+var styles = react_native_1.StyleSheet.create({
+    rowStyle: { flexDirection: 'row', marginTop: 6 },
+    rowGap: { marginRight: 6 },
+});
+//# sourceMappingURL=ChipDefault.js.map

package/lib-commonjs/fluent-tester/src/TestComponents/Chip/ChipDefault.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ChipDefault.js","sourceRoot":"","sources":["../../../../../src/TestComponents/Chip/ChipDefault.tsx"],"names":[],"mappings":"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"}

package/lib-commonjs/fluent-tester/src/TestComponents/Chip/ChipTest.d.ts

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

package/lib-commonjs/fluent-tester/src/TestComponents/Chip/ChipTest.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ChipTest.d.ts","sourceRoot":"","sources":["../../../../../src/TestComponents/Chip/ChipTest.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAuB/B,eAAO,MAAM,QAAQ,EAAE,KAAK,CAAC,iBAe5B,CAAC"}

package/lib-commonjs/fluent-tester/src/TestComponents/Chip/ChipTest.js

@@ -0,0 +1,36 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ChipTest = void 0;
+var tslib_1 = require("tslib");
+var React = tslib_1.__importStar(require("react"));
+var ChipDefault_1 = require("./ChipDefault");
+var E2EChipTest_1 = require("./E2EChipTest");
+var consts_1 = require("../../../../E2E/src/Chip/consts");
+var Test_1 = require("../Test");
+var chipSections = [
+    {
+        name: 'Default Chip',
+        testID: consts_1.CHIP_TESTPAGE,
+        component: ChipDefault_1.ChipDefault,
+    },
+];
+var e2eSections = [
+    {
+        name: 'Chip E2E',
+        component: E2EChipTest_1.E2EChipTest,
+    },
+];
+var ChipTest = function () {
+    var status = {
+        win32Status: 'Backlog',
+        uwpStatus: 'Backlog',
+        iosStatus: 'Backlog',
+        macosStatus: 'Backlog',
+        androidStatus: 'Experimental',
+    };
+    var description = 'Chips are compact representations of entities (most commonly, people) that can be typed in, deleted or dragged easily.';
+    var spec = 'https://github.com/microsoft/fluentui-react-native/blob/main/packages/components/Chip/SPEC.md';
+    return React.createElement(Test_1.Test, { name: "Chip Test", description: description, spec: spec, sections: chipSections, status: status, e2eSections: e2eSections });
+};
+exports.ChipTest = ChipTest;
+//# sourceMappingURL=ChipTest.js.map

package/lib-commonjs/fluent-tester/src/TestComponents/Chip/ChipTest.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ChipTest.js","sourceRoot":"","sources":["../../../../../src/TestComponents/Chip/ChipTest.tsx"],"names":[],"mappings":";;;;AAAA,mDAA+B;AAE/B,6CAA4C;AAC5C,6CAA4C;AAC5C,0DAAgE;AAEhE,gCAA+B;AAE/B,IAAM,YAAY,GAAkB;IAClC;QACE,IAAI,EAAE,cAAc;QACpB,MAAM,EAAE,sBAAa;QACrB,SAAS,EAAE,yBAAW;KACvB;CACF,CAAC;AAEF,IAAM,WAAW,GAAkB;IACjC;QACE,IAAI,EAAE,UAAU;QAChB,SAAS,EAAE,yBAAW;KACvB;CACF,CAAC;AAEK,IAAM,QAAQ,GAA4B;IAC/C,IAAM,MAAM,GAAmB;QAC7B,WAAW,EAAE,SAAS;QACtB,SAAS,EAAE,SAAS;QACpB,SAAS,EAAE,SAAS;QACpB,WAAW,EAAE,SAAS;QACtB,aAAa,EAAE,cAAc;KAC9B,CAAC;IAEF,IAAM,WAAW,GACf,wHAAwH,CAAC;IAE3H,IAAM,IAAI,GAAG,+FAA+F,CAAC;IAE7G,OAAO,oBAAC,WAAI,IAAC,IAAI,EAAC,WAAW,EAAC,WAAW,EAAE,WAAW,EAAE,IAAI,EAAE,IAAI,EAAE,QAAQ,EAAE,YAAY,EAAE,MAAM,EAAE,MAAM,EAAE,WAAW,EAAE,WAAW,GAAI,CAAC;AAC3I,CAAC,CAAC;AAfW,QAAA,QAAQ,YAenB"}

package/lib-commonjs/fluent-tester/src/TestComponents/Chip/E2EChipTest.d.ts

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

package/lib-commonjs/fluent-tester/src/TestComponents/Chip/E2EChipTest.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"E2EChipTest.d.ts","sourceRoot":"","sources":["../../../../../src/TestComponents/Chip/E2EChipTest.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAe/B,eAAO,MAAM,WAAW,EAAE,KAAK,CAAC,iBAoB/B,CAAC"}

package/lib-commonjs/fluent-tester/src/TestComponents/Chip/E2EChipTest.js

@@ -0,0 +1,21 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.E2EChipTest = void 0;
+var tslib_1 = require("tslib");
+var React = tslib_1.__importStar(require("react"));
+var react_native_1 = require("react-native");
+var chip_1 = require("@fluentui-react-native/chip");
+var text_1 = require("@fluentui-react-native/text");
+var consts_1 = require("../../../../E2E/src/Chip/consts");
+var TestProps_1 = require("../Common/TestProps");
+var E2EChipTest = function () {
+    var _a = React.useState(consts_1.CHIP_CALLBACK_TEXT_START_STATE), text = _a[0], setText = _a[1];
+    var showTextOnSelection = React.useCallback(function (_e, isSelected) { return setText(isSelected ? consts_1.CHIP_CALLBACK_TEXT_END_STATE : consts_1.CHIP_CALLBACK_TEXT_START_STATE); }, []);
+    return (React.createElement(react_native_1.View, null,
+        React.createElement(text_1.Text, tslib_1.__assign({}, (0, TestProps_1.testProps)(consts_1.CHIP_TEXT)), text),
+        React.createElement(chip_1.Chip
+        /* For Android E2E testing purposes, testProps must be passed in after accessibilityLabel. */
+        , tslib_1.__assign({}, (0, TestProps_1.testProps)(consts_1.CHIP_TEST_COMPONENT), { chipColor: "success", showCloseIcon: true, onSelectionChange: showTextOnSelection }), "Basic Chip")));
+};
+exports.E2EChipTest = E2EChipTest;
+//# sourceMappingURL=E2EChipTest.js.map

package/lib-commonjs/fluent-tester/src/TestComponents/Chip/E2EChipTest.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"E2EChipTest.js","sourceRoot":"","sources":["../../../../../src/TestComponents/Chip/E2EChipTest.tsx"],"names":[],"mappings":";;;;AAAA,mDAA+B;AAC/B,6CAAoC;AAEpC,oDAAmD;AAEnD,oDAAmD;AAEnD,0DAKyC;AACzC,iDAAgD;AAEzC,IAAM,WAAW,GAA4B;IAC5C,IAAA,KAAkB,KAAK,CAAC,QAAQ,CAAS,uCAA8B,CAAC,EAAvE,IAAI,QAAA,EAAE,OAAO,QAA0D,CAAC;IAC/E,IAAM,mBAAmB,GAAG,KAAK,CAAC,WAAW,CAC3C,UAAC,EAAoB,EAAE,UAAmB,IAAK,OAAA,OAAO,CAAC,UAAU,CAAC,CAAC,CAAC,qCAA4B,CAAC,CAAC,CAAC,uCAA8B,CAAC,EAAnF,CAAmF,EAClI,EAAE,CACH,CAAC;IACF,OAAO,CACL,oBAAC,mBAAI;QACH,oBAAC,WAAI,uBAAK,IAAA,qBAAS,EAAC,kBAAS,CAAC,GAAG,IAAI,CAAQ;QAC7C,oBAAC,WAAI;QACH,6FAA6F;+BACzF,IAAA,qBAAS,EAAC,4BAAmB,CAAC,IAClC,SAAS,EAAC,SAAS,EACnB,aAAa,QACb,iBAAiB,EAAE,mBAAmB,kBAGjC,CACF,CACR,CAAC;AACJ,CAAC,CAAC;AApBW,QAAA,WAAW,eAoBtB"}

package/lib-commonjs/fluent-tester/src/TestComponents/Chip/index.d.ts

@@ -0,0 +1,2 @@
+export * from './ChipTest';
+//# sourceMappingURL=index.d.ts.map

package/lib-commonjs/fluent-tester/src/TestComponents/Chip/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/TestComponents/Chip/index.ts"],"names":[],"mappings":"AAAA,cAAc,YAAY,CAAC"}

package/lib-commonjs/fluent-tester/src/TestComponents/Chip/index.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./ChipTest"), exports);
+//# sourceMappingURL=index.js.map

package/lib-commonjs/fluent-tester/src/TestComponents/Chip/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/TestComponents/Chip/index.ts"],"names":[],"mappings":";;;AAAA,qDAA2B"}

package/lib-commonjs/fluent-tester/src/testPages.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"testPages.d.ts","sourceRoot":"","sources":["../../../src/testPages.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,kBAAkB,CAAC;AA+CxD,eAAO,MAAM,KAAK,EAAE,eAAe,EAsRlC,CAAC"}
+{"version":3,"file":"testPages.d.ts","sourceRoot":"","sources":["../../../src/testPages.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,kBAAkB,CAAC;AAgDxD,eAAO,MAAM,KAAK,EAAE,eAAe,EA4RlC,CAAC"}

package/lib-commonjs/fluent-tester/src/testPages.js

@@ -9,6 +9,7 @@ var Button_1 = require("./TestComponents/Button");
 var Callout_1 = require("./TestComponents/Callout");
 var CheckboxLegacy_1 = require("./TestComponents/CheckboxLegacy");
 var CheckboxV1_1 = require("./TestComponents/CheckboxV1");
+var Chip_1 = require("./TestComponents/Chip");
 var ColorTokens_1 = require("./TestComponents/ColorTokens");
 var ContextualMenu_1 = require("./TestComponents/ContextualMenu");
 var CornerRadius_1 = require("./TestComponents/CornerRadius");
@@ -96,6 +97,12 @@ exports.tests = [
         testPageButton: Constants.HOMEPAGE_CHECKBOXV1_BUTTON,
         platforms: ['android', 'ios', 'macos', 'win32'], // 'windows': GH#935: Temporarily disabling while SVGs don't work in windows
     },
+    {
+        name: 'Chip',
+        component: Chip_1.ChipTest,
+        testPageButton: Constants.HOMEPAGE_CHIP_BUTTON,
+        platforms: ['android'],
+    },
     {
         name: 'Color Tokens',
         component: ColorTokens_1.ColorTokensTest,

package/lib-commonjs/fluent-tester/src/testPages.js.map

@@ -1 +1 @@
-{"version":3,"file":"testPages.js","sourceRoot":"","sources":["../../../src/testPages.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"testPages.js","sourceRoot":"","sources":["../../../src/testPages.ts"],"names":[],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fluentui-react-native/tester",
-  "version": "0.151.0",
+  "version": "0.151.2",
   "description": "A test app to test FluentUI React Native Components during development",
   "license": "MIT",
   "author": "Microsoft <fluentuinativeowners@microsoft.com>",
@@ -35,9 +35,10 @@
   "dependencies": {
     "@fluentui-react-native/android-theme": ">=0.18.1 <1.0.0",
     "@fluentui-react-native/apple-theme": ">=0.21.2 <1.0.0",
-    "@fluentui-react-native/avatar": "^1.10.3",
-    "@fluentui-react-native/badge": ">=0.6.5 <1.0.0",
+    "@fluentui-react-native/avatar": "^1.10.4",
+    "@fluentui-react-native/badge": ">=0.7.0 <1.0.0",
     "@fluentui-react-native/button": ">=0.34.4 <1.0.0",
+    "@fluentui-react-native/chip": "^0.1.1",
     "@fluentui-react-native/default-theme": ">=0.19.1 <1.0.0",
     "@fluentui-react-native/divider": "^0.5.2",
     "@fluentui-react-native/dropdown": ">=0.8.7 <1.0.0",
@@ -46,11 +47,11 @@
     "@fluentui-react-native/experimental-avatar": ">=0.19.0 <1.0.0",
     "@fluentui-react-native/experimental-button": "0.18.4",
     "@fluentui-react-native/experimental-checkbox": "0.15.3",
-    "@fluentui-react-native/experimental-expander": "0.6.1",
+    "@fluentui-react-native/experimental-expander": "0.6.2",
     "@fluentui-react-native/experimental-menu-button": ">=0.7.7 <1.0.0",
     "@fluentui-react-native/experimental-native-date-picker": ">=0.8.0 <1.0.0",
     "@fluentui-react-native/experimental-shadow": "0.4.2",
-    "@fluentui-react-native/experimental-shimmer": "0.10.1",
+    "@fluentui-react-native/experimental-shimmer": "0.10.2",
     "@fluentui-react-native/experimental-tabs": "0.9.4",
     "@fluentui-react-native/experimental-text": ">=0.13.2 <1.0.0",
     "@fluentui-react-native/framework": ">=0.11.0 <1.0.0",

package/src/TestComponents/Badge/BadgeTest.tsx

@@ -1,4 +1,5 @@
 import * as React from 'react';
+import { Platform } from 'react-native';
 
 import { BasicBadge } from './BasicBadgeTest';
 import { CounterBadgeTest } from './CounterBadgeTest';
@@ -9,19 +10,26 @@ import type { TestSection, PlatformStatus } from '../Test';
 import { Test } from '../Test';
 
 const badgeSections: TestSection[] = [
-  {
-    name: 'Basic Badge',
-    testID: BADGE_TESTPAGE,
-    component: BasicBadge,
-  },
+  Platform.select({
+    android: null,
+    default: {
+      name: 'Basic Badge',
+      testID: BADGE_TESTPAGE,
+      component: BasicBadge,
+    },
+  }),
   {
     name: 'Counter Badge',
+    testID: BADGE_TESTPAGE,
     component: CounterBadgeTest,
   },
   {
     name: 'Presence Badge',
     component: PresenceBadgeTest,
   },
+];
+
+const e2eSections: TestSection[] = [
   {
     name: 'Badge E2E',
     component: E2EBadgeTest,
@@ -42,5 +50,7 @@ export const BadgeTest: React.FunctionComponent = () => {
 
   const spec = 'https://github.com/microsoft/fluentui-react-native/blob/main/packages/components/Badge/SPEC.md';
 
-  return <Test name="Badge Test" description={description} spec={spec} sections={badgeSections} status={status} />;
+  return (
+    <Test name="Badge Test" description={description} spec={spec} sections={badgeSections} status={status} e2eSections={e2eSections} />
+  );
 };

package/src/TestComponents/Badge/CounterBadgeTest.android.tsx

@@ -0,0 +1,30 @@
+import React from 'react';
+import { View, Text } from 'react-native';
+
+import { CounterBadge } from '@fluentui-react-native/badge';
+
+export const CounterBadgeTest: React.FunctionComponent = () => {
+  return (
+    <View>
+      <Text>Dot badge</Text>
+      <CounterBadge count={13} dot={true}></CounterBadge>
+      <CounterBadge count={0} dot={true}></CounterBadge>
+      <Text>Here no Badge is displayed</Text>
+      <CounterBadge count={0}></CounterBadge>
+      <Text>And here is the Badge with showZero = true</Text>
+      <CounterBadge count={0} showZero={true}></CounterBadge>
+      <Text>Default counter badge</Text>
+      <CounterBadge>Badge</CounterBadge>
+      <CounterBadge count={10}></CounterBadge>
+      <Text>Overflow sample</Text>
+      <CounterBadge count={777}></CounterBadge>
+      <CounterBadge overflowCount={1000} count={777}></CounterBadge>
+      <Text>List counter badge</Text>
+      <CounterBadge list={true}>Badge</CounterBadge>
+      <CounterBadge count={10} list={true}></CounterBadge>
+      <Text>Overflow sample</Text>
+      <CounterBadge count={777} list={true}></CounterBadge>
+      <CounterBadge overflowCount={1000} count={777} list={true}></CounterBadge>
+    </View>
+  );
+};

package/src/TestComponents/Badge/PresenceBadgeTest.android.tsx

@@ -0,0 +1,55 @@
+/* eslint-disable @typescript-eslint/no-var-requires */
+import React, { useCallback, useState } from 'react';
+import { View, StyleSheet, Text } from 'react-native';
+
+import { ToggleButton } from '@fluentui/react-native';
+import { PresenceBadge } from '@fluentui-react-native/badge';
+
+export const PresenceBadgeTest: React.FunctionComponent = () => {
+  const [outOfOffice, setOutOfOffice] = useState(false);
+  const toggleOutOfOffice = useCallback(() => setOutOfOffice(!outOfOffice), [outOfOffice]);
+  return (
+    <View>
+      <ToggleButton onClick={toggleOutOfOffice} checked={outOfOffice}>
+        Set {outOfOffice ? ' In office' : ' Out of office'}
+      </ToggleButton>
+      <Text>Small</Text>
+      <View style={styles.rowStyle}>
+        <PresenceBadge status="available" size="small" outOfOffice={outOfOffice} />
+        <PresenceBadge status="blocked" size="small" outOfOffice={outOfOffice} />
+        <PresenceBadge status="doNotDisturb" size="small" outOfOffice={outOfOffice} />
+        <PresenceBadge status="away" size="small" outOfOffice={outOfOffice} />
+        <PresenceBadge status="busy" size="small" outOfOffice={outOfOffice} />
+        <PresenceBadge status="offline" size="small" outOfOffice={outOfOffice} />
+        <PresenceBadge status="outOfOffice" size="small" outOfOffice={outOfOffice} />
+        <PresenceBadge status="unknown" size="small" outOfOffice={outOfOffice} />
+      </View>
+      <Text>Medium</Text>
+      <View style={styles.rowStyle}>
+        <PresenceBadge status="available" size="medium" outOfOffice={outOfOffice} />
+        <PresenceBadge status="blocked" size="medium" outOfOffice={outOfOffice} />
+        <PresenceBadge status="doNotDisturb" size="medium" outOfOffice={outOfOffice} />
+        <PresenceBadge status="away" size="medium" outOfOffice={outOfOffice} />
+        <PresenceBadge status="busy" size="medium" outOfOffice={outOfOffice} />
+        <PresenceBadge status="offline" size="medium" outOfOffice={outOfOffice} />
+        <PresenceBadge status="outOfOffice" size="medium" outOfOffice={outOfOffice} />
+        <PresenceBadge status="unknown" size="medium" outOfOffice={outOfOffice} />
+      </View>
+      <Text>Large</Text>
+      <View style={styles.rowStyle}>
+        <PresenceBadge status="available" size="large" outOfOffice={outOfOffice} />
+        <PresenceBadge status="blocked" size="large" outOfOffice={outOfOffice} />
+        <PresenceBadge status="doNotDisturb" size="large" outOfOffice={outOfOffice} />
+        <PresenceBadge status="away" size="large" outOfOffice={outOfOffice} />
+        <PresenceBadge status="busy" size="large" outOfOffice={outOfOffice} />
+        <PresenceBadge status="offline" size="large" outOfOffice={outOfOffice} />
+        <PresenceBadge status="outOfOffice" size="large" outOfOffice={outOfOffice} />
+        <PresenceBadge status="unknown" size="large" outOfOffice={outOfOffice} />
+      </View>
+    </View>
+  );
+};
+
+const styles = StyleSheet.create({
+  rowStyle: { flexDirection: 'row' },
+});

package/src/TestComponents/Chip/ChipDefault.tsx

@@ -0,0 +1,117 @@
+/* eslint-disable @typescript-eslint/no-var-requires */
+import React, { useCallback } from 'react';
+import { StyleSheet, View, ToastAndroid } from 'react-native';
+
+import { Chip } from '@fluentui-react-native/chip';
+import type { InteractionEvent } from '@fluentui-react-native/interactive-hooks';
+import { Switch } from '@fluentui-react-native/switch';
+import { Text } from '@fluentui-react-native/text';
+
+import { svgProps } from '../Common/iconExamples';
+
+export const ChipDefault: React.FunctionComponent = () => {
+  const [showCloseIcon, setShowCloseIcon] = React.useState<boolean>(false);
+  const toggleActivityState = useCallback((_e: InteractionEvent, isActive: boolean) => setShowCloseIcon(isActive), []);
+  const showToast = () => {
+    ToastAndroid.show('Close icon clicked!', ToastAndroid.SHORT);
+  };
+
+  return (
+    <View>
+      <Switch label={'Show Close Icon'} defaultChecked={showCloseIcon} onChange={toggleActivityState} />
+      <View style={styles.rowStyle}>
+        <Chip size="small" style={styles.rowGap} showCloseIcon={showCloseIcon} closeIconOnPress={showToast}>
+          Neutral
+        </Chip>
+        <Chip size="medium" icon={{ svgSource: svgProps }} showCloseIcon={showCloseIcon} closeIconOnPress={showToast}>
+          Neutral
+        </Chip>
+      </View>
+      <View style={styles.rowStyle}>
+        <Chip size="small" style={styles.rowGap} disabled showCloseIcon={showCloseIcon} closeIconOnPress={showToast}>
+          Disabled
+        </Chip>
+        <Chip size="medium" icon={{ svgSource: svgProps }} disabled showCloseIcon={showCloseIcon} closeIconOnPress={showToast}>
+          Disabled
+        </Chip>
+      </View>
+      <View style={styles.rowStyle}>
+        <Chip size="small" chipColor="brand" style={styles.rowGap} showCloseIcon={showCloseIcon} closeIconOnPress={showToast}>
+          Brand
+        </Chip>
+        <Chip size="medium" chipColor="brand" icon={{ svgSource: svgProps }} showCloseIcon={showCloseIcon} closeIconOnPress={showToast}>
+          Brand
+        </Chip>
+      </View>
+      <View style={styles.rowStyle}>
+        <Chip size="small" chipColor="danger" style={styles.rowGap} showCloseIcon={showCloseIcon} closeIconOnPress={showToast}>
+          Danger
+        </Chip>
+        <Chip size="medium" chipColor="danger" icon={{ svgSource: svgProps }} showCloseIcon={showCloseIcon} closeIconOnPress={showToast}>
+          Danger
+        </Chip>
+      </View>
+      <View style={styles.rowStyle}>
+        <Chip size="small" chipColor="severe" style={styles.rowGap} showCloseIcon={showCloseIcon} closeIconOnPress={showToast}>
+          Severe
+        </Chip>
+        <Chip size="medium" chipColor="severe" icon={{ svgSource: svgProps }} showCloseIcon={showCloseIcon} closeIconOnPress={showToast}>
+          Severe
+        </Chip>
+      </View>
+      <View style={styles.rowStyle}>
+        <Chip size="small" chipColor="warning" style={styles.rowGap} showCloseIcon={showCloseIcon} closeIconOnPress={showToast}>
+          Warning
+        </Chip>
+        <Chip size="medium" chipColor="warning" icon={{ svgSource: svgProps }} showCloseIcon={showCloseIcon} closeIconOnPress={showToast}>
+          Warning
+        </Chip>
+      </View>
+      <View style={styles.rowStyle}>
+        <Chip size="small" chipColor="success" style={styles.rowGap} showCloseIcon={showCloseIcon} closeIconOnPress={showToast}>
+          Success
+        </Chip>
+        <Chip size="medium" chipColor="success" icon={{ svgSource: svgProps }} showCloseIcon={showCloseIcon} closeIconOnPress={showToast}>
+          Success
+        </Chip>
+      </View>
+      <Text>Search Bar Chip</Text>
+      <View style={styles.rowStyle}>
+        <Chip searchBar size="small" style={styles.rowGap} showCloseIcon={showCloseIcon} closeIconOnPress={showToast}>
+          Chip
+        </Chip>
+        <Chip searchBar size="medium" icon={{ svgSource: svgProps }} showCloseIcon={showCloseIcon} closeIconOnPress={showToast}>
+          Chip
+        </Chip>
+      </View>
+      <View style={styles.rowStyle}>
+        <Chip searchBar size="small" chipColor="brand" style={styles.rowGap} showCloseIcon={showCloseIcon} closeIconOnPress={showToast}>
+          Brand
+        </Chip>
+        <Chip
+          searchBar
+          size="medium"
+          chipColor="brand"
+          icon={{ svgSource: svgProps }}
+          showCloseIcon={showCloseIcon}
+          closeIconOnPress={showToast}
+        >
+          Brand
+        </Chip>
+      </View>
+      <View style={styles.rowStyle}>
+        <Chip searchBar size="small" style={styles.rowGap} disabled showCloseIcon={showCloseIcon} closeIconOnPress={showToast}>
+          Disabled
+        </Chip>
+        <Chip searchBar size="medium" icon={{ svgSource: svgProps }} disabled showCloseIcon={showCloseIcon} closeIconOnPress={showToast}>
+          Disabled
+        </Chip>
+      </View>
+    </View>
+  );
+};
+
+const styles = StyleSheet.create({
+  rowStyle: { flexDirection: 'row', marginTop: 6 },
+  rowGap: { marginRight: 6 },
+});

package/src/TestComponents/Chip/ChipTest.tsx

@@ -0,0 +1,39 @@
+import * as React from 'react';
+
+import { ChipDefault } from './ChipDefault';
+import { E2EChipTest } from './E2EChipTest';
+import { CHIP_TESTPAGE } from '../../../../E2E/src/Chip/consts';
+import type { TestSection, PlatformStatus } from '../Test';
+import { Test } from '../Test';
+
+const chipSections: TestSection[] = [
+  {
+    name: 'Default Chip',
+    testID: CHIP_TESTPAGE,
+    component: ChipDefault,
+  },
+];
+
+const e2eSections: TestSection[] = [
+  {
+    name: 'Chip E2E',
+    component: E2EChipTest,
+  },
+];
+
+export const ChipTest: React.FunctionComponent = () => {
+  const status: PlatformStatus = {
+    win32Status: 'Backlog',
+    uwpStatus: 'Backlog',
+    iosStatus: 'Backlog',
+    macosStatus: 'Backlog',
+    androidStatus: 'Experimental',
+  };
+
+  const description =
+    'Chips are compact representations of entities (most commonly, people) that can be typed in, deleted or dragged easily.';
+
+  const spec = 'https://github.com/microsoft/fluentui-react-native/blob/main/packages/components/Chip/SPEC.md';
+
+  return <Test name="Chip Test" description={description} spec={spec} sections={chipSections} status={status} e2eSections={e2eSections} />;
+};

package/src/TestComponents/Chip/E2EChipTest.tsx

@@ -0,0 +1,36 @@
+import * as React from 'react';
+import { View } from 'react-native';
+
+import { Chip } from '@fluentui-react-native/chip';
+import type { InteractionEvent } from '@fluentui-react-native/interactive-hooks';
+import { Text } from '@fluentui-react-native/text';
+
+import {
+  CHIP_CALLBACK_TEXT_END_STATE,
+  CHIP_CALLBACK_TEXT_START_STATE,
+  CHIP_TEST_COMPONENT,
+  CHIP_TEXT,
+} from '../../../../E2E/src/Chip/consts';
+import { testProps } from '../Common/TestProps';
+
+export const E2EChipTest: React.FunctionComponent = () => {
+  const [text, setText] = React.useState<string>(CHIP_CALLBACK_TEXT_START_STATE);
+  const showTextOnSelection = React.useCallback(
+    (_e: InteractionEvent, isSelected: boolean) => setText(isSelected ? CHIP_CALLBACK_TEXT_END_STATE : CHIP_CALLBACK_TEXT_START_STATE),
+    [],
+  );
+  return (
+    <View>
+      <Text {...testProps(CHIP_TEXT)}>{text}</Text>
+      <Chip
+        /* For Android E2E testing purposes, testProps must be passed in after accessibilityLabel. */
+        {...testProps(CHIP_TEST_COMPONENT)}
+        chipColor="success"
+        showCloseIcon
+        onSelectionChange={showTextOnSelection}
+      >
+        Basic Chip
+      </Chip>
+    </View>
+  );
+};

package/src/TestComponents/Chip/index.ts

@@ -0,0 +1 @@
+export * from './ChipTest';

package/src/testPages.ts

@@ -6,6 +6,7 @@ import { ButtonTest } from './TestComponents/Button';
 import { CalloutTest } from './TestComponents/Callout';
 import { CheckboxLegacyTest } from './TestComponents/CheckboxLegacy';
 import { CheckboxV1Test } from './TestComponents/CheckboxV1';
+import { ChipTest } from './TestComponents/Chip';
 import { ColorTokensTest } from './TestComponents/ColorTokens';
 import { ContextualMenuTest } from './TestComponents/ContextualMenu';
 import { CornerRadiusTokensTest } from './TestComponents/CornerRadius';
@@ -94,6 +95,12 @@ export const tests: TestDescription[] = [
     testPageButton: Constants.HOMEPAGE_CHECKBOXV1_BUTTON,
     platforms: ['android', 'ios', 'macos', 'win32'], // 'windows': GH#935: Temporarily disabling while SVGs don't work in windows
   },
+  {
+    name: 'Chip',
+    component: ChipTest,
+    testPageButton: Constants.HOMEPAGE_CHIP_BUTTON,
+    platforms: ['android'],
+  },
   {
     name: 'Color Tokens',
     component: ColorTokensTest,