"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
    return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.OtherCheckbox = void 0;
const react_1 = __importDefault(require("react"));
const react_native_1 = require("react-native");
const button_1 = require("@fluentui-react-native/button");
const experimental_checkbox_1 = require("@fluentui-react-native/experimental-checkbox");
const text_1 = require("@fluentui-react-native/text");
const styles_1 = require("../Common/styles");
const pressableStyle = { borderWidth: 1, padding: 4, gap: 4, flexDirection: 'row', alignItems: 'center' };
const OtherCheckbox = () => {
    const [isChecked, setisChecked] = react_1.default.useState(false);
    const setCheckedTrue = react_1.default.useCallback(() => {
        setisChecked(true);
    }, []);
    const setCheckedFalse = react_1.default.useCallback(() => {
        setisChecked(false);
    }, []);
    const onChange = react_1.default.useCallback((_e, checked) => {
        setisChecked(checked);
    }, []);
    const onPress = react_1.default.useCallback(() => {
        setisChecked(!isChecked);
    }, [isChecked]);
    const memoizedStyles = react_1.default.useMemo(() => (react_native_1.Platform.OS === 'android' ? { ...styles_1.mobileStyles.containerSpacedEvenly, height: 150 } : { gap: 8 }), []);
    return (react_1.default.createElement(react_native_1.View, { style: memoizedStyles },
        react_1.default.createElement(react_native_1.View, null,
            react_1.default.createElement(button_1.ButtonV1, { onClick: setCheckedTrue, size: "small" }, "Check controlled checkboxes below"),
            react_1.default.createElement(button_1.ButtonV1, { onClick: setCheckedFalse, size: "small" }, "Uncheck controlled checkboxes below")),
        react_1.default.createElement(react_native_1.View, null,
            react_1.default.createElement(experimental_checkbox_1.Checkbox, { label: "This is a controlled Checkbox", checked: isChecked, onChange: onChange }),
            react_1.default.createElement(react_native_1.Pressable, { style: pressableStyle, onPress: onPress },
                react_1.default.createElement(experimental_checkbox_1.Checkbox, { checked: isChecked, onChange: onChange }),
                react_1.default.createElement(text_1.TextV1, null, "A controlled checkbox in a Pressable. Pressing Pressable also toggles Checkbox")),
            react_native_1.Platform.OS !== 'android' && (react_1.default.createElement(react_1.default.Fragment, null,
                react_1.default.createElement(experimental_checkbox_1.Checkbox, { label: "Checkbox rendered with labelPosition 'before' (controlled)", labelPosition: "before", checked: isChecked }),
                react_1.default.createElement(experimental_checkbox_1.Checkbox, { label: "A required checkbox with other required text", required: "**" }))))));
};
exports.OtherCheckbox = OtherCheckbox;
//# sourceMappingURL=OtherCheckboxPropsTest.js.map