import * as React from 'react';
import { Platform, View } from 'react-native';
import { ButtonV1 as Button } from '@fluentui/react-native';
import { isGestureResponderEvent } from '@fluentui-react-native/interactive-hooks';
import { TextV1 as Text } from '@fluentui-react-native/text';
import { svgProps } from '../Common/iconExamples';
import { commonTestStyles, stackStyle } from '../Common/styles';
var CustomText = Text.customize({ fontSize: 'header', color: 'hotpink' });
var CustomButton = Button.customize({ backgroundColor: 'pink' });
var CustomIconButton = Button.customize({ iconColor: 'yellow' });
var ComposedButton = Button.compose({
    // eslint-disable-next-line @typescript-eslint/ban-ts-comment
    // @ts-ignore Not all slots have to be overridden for compose to work
    slots: {
        content: CustomText,
    },
    slotProps: {
        content: {
            style: { marginTop: -1, marginBottom: 1, marginStart: 0, marginEnd: -2 },
        },
    },
});
export var ButtonHOCTest = function () {
    var buttonRef = React.useRef(null);
    var svgIconsEnabled = ['ios', 'macos', 'win32', 'android'].includes(Platform.OS);
    return (React.createElement(View, { style: stackStyle },
        React.createElement(CustomButton, { style: commonTestStyles.vmargin, componentRef: buttonRef }, "Customized Button with ref"),
        svgIconsEnabled && React.createElement(CustomIconButton, { icon: { svgSource: svgProps } }, "Customized Icon Button"),
        React.createElement(Button, { style: commonTestStyles.vmargin, onClick: function (e) {
                console.log(e.timeStamp);
                if (isGestureResponderEvent(e)) {
                    console.log('I was clicked!');
                }
                if (buttonRef.current) {
                    buttonRef.current.focus();
                }
            } }, "Press to focus Customized Button"),
        React.createElement(ComposedButton, { style: commonTestStyles.vmargin }, "Composed button using customized Text for text slot")));
};
//# sourceMappingURL=ButtonHOCTestSection.js.map