/* 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 { Switch } from '@fluentui-react-native/switch';
import { Text } from '@fluentui-react-native/text';
import { svgProps } from '../Common/iconExamples';
export var ChipDefault = function () {
    var _a = React.useState(false), showCloseIcon = _a[0], setShowCloseIcon = _a[1];
    var toggleActivityState = useCallback(function (_e, isActive) { return setShowCloseIcon(isActive); }, []);
    var showToast = function () {
        ToastAndroid.show('Close icon clicked!', ToastAndroid.SHORT);
    };
    return (React.createElement(View, null,
        React.createElement(Switch, { label: 'Show Close Icon', defaultChecked: showCloseIcon, onChange: toggleActivityState }),
        React.createElement(View, { style: styles.rowStyle },
            React.createElement(Chip, { size: "small", style: styles.rowGap, showCloseIcon: showCloseIcon, closeIconOnPress: showToast }, "Neutral"),
            React.createElement(Chip, { size: "medium", icon: { svgSource: svgProps }, showCloseIcon: showCloseIcon, closeIconOnPress: showToast }, "Neutral")),
        React.createElement(View, { style: styles.rowStyle },
            React.createElement(Chip, { size: "small", style: styles.rowGap, disabled: true, showCloseIcon: showCloseIcon, closeIconOnPress: showToast }, "Disabled"),
            React.createElement(Chip, { size: "medium", icon: { svgSource: svgProps }, disabled: true, showCloseIcon: showCloseIcon, closeIconOnPress: showToast }, "Disabled")),
        React.createElement(View, { style: styles.rowStyle },
            React.createElement(Chip, { size: "small", chipColor: "brand", style: styles.rowGap, showCloseIcon: showCloseIcon, closeIconOnPress: showToast }, "Brand"),
            React.createElement(Chip, { size: "medium", chipColor: "brand", icon: { svgSource: svgProps }, showCloseIcon: showCloseIcon, closeIconOnPress: showToast }, "Brand")),
        React.createElement(View, { style: styles.rowStyle },
            React.createElement(Chip, { size: "small", chipColor: "danger", style: styles.rowGap, showCloseIcon: showCloseIcon, closeIconOnPress: showToast }, "Danger"),
            React.createElement(Chip, { size: "medium", chipColor: "danger", icon: { svgSource: svgProps }, showCloseIcon: showCloseIcon, closeIconOnPress: showToast }, "Danger")),
        React.createElement(View, { style: styles.rowStyle },
            React.createElement(Chip, { size: "small", chipColor: "severe", style: styles.rowGap, showCloseIcon: showCloseIcon, closeIconOnPress: showToast }, "Severe"),
            React.createElement(Chip, { size: "medium", chipColor: "severe", icon: { svgSource: svgProps }, showCloseIcon: showCloseIcon, closeIconOnPress: showToast }, "Severe")),
        React.createElement(View, { style: styles.rowStyle },
            React.createElement(Chip, { size: "small", chipColor: "warning", style: styles.rowGap, showCloseIcon: showCloseIcon, closeIconOnPress: showToast }, "Warning"),
            React.createElement(Chip, { size: "medium", chipColor: "warning", icon: { svgSource: svgProps }, showCloseIcon: showCloseIcon, closeIconOnPress: showToast }, "Warning")),
        React.createElement(View, { style: styles.rowStyle },
            React.createElement(Chip, { size: "small", chipColor: "success", style: styles.rowGap, showCloseIcon: showCloseIcon, closeIconOnPress: showToast }, "Success"),
            React.createElement(Chip, { size: "medium", chipColor: "success", icon: { svgSource: svgProps }, showCloseIcon: showCloseIcon, closeIconOnPress: showToast }, "Success")),
        React.createElement(Text, null, "Search Bar Chip"),
        React.createElement(View, { style: styles.rowStyle },
            React.createElement(Chip, { searchBar: true, size: "small", style: styles.rowGap, showCloseIcon: showCloseIcon, closeIconOnPress: showToast }, "Chip"),
            React.createElement(Chip, { searchBar: true, size: "medium", icon: { svgSource: svgProps }, showCloseIcon: showCloseIcon, closeIconOnPress: showToast }, "Chip")),
        React.createElement(View, { style: styles.rowStyle },
            React.createElement(Chip, { searchBar: true, size: "small", chipColor: "brand", style: styles.rowGap, showCloseIcon: showCloseIcon, closeIconOnPress: showToast }, "Brand"),
            React.createElement(Chip, { searchBar: true, size: "medium", chipColor: "brand", icon: { svgSource: svgProps }, showCloseIcon: showCloseIcon, closeIconOnPress: showToast }, "Brand")),
        React.createElement(View, { style: styles.rowStyle },
            React.createElement(Chip, { searchBar: true, size: "small", style: styles.rowGap, disabled: true, showCloseIcon: showCloseIcon, closeIconOnPress: showToast }, "Disabled"),
            React.createElement(Chip, { searchBar: true, size: "medium", icon: { svgSource: svgProps }, disabled: true, showCloseIcon: showCloseIcon, closeIconOnPress: showToast }, "Disabled"))));
};
var styles = StyleSheet.create({
    rowStyle: { flexDirection: 'row', marginTop: 6 },
    rowGap: { marginRight: 6 },
});
//# sourceMappingURL=ChipDefault.js.map