"use strict";
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
    if (k2 === undefined) k2 = k;
    var desc = Object.getOwnPropertyDescriptor(m, k);
    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
      desc = { enumerable: true, get: function() { return m[k]; } };
    }
    Object.defineProperty(o, k2, desc);
}) : (function(o, m, k, k2) {
    if (k2 === undefined) k2 = k;
    o[k2] = m[k];
}));
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
    Object.defineProperty(o, "default", { enumerable: true, value: v });
}) : function(o, v) {
    o["default"] = v;
});
var __importStar = (this && this.__importStar) || function (mod) {
    if (mod && mod.__esModule) return mod;
    var result = {};
    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
    __setModuleDefault(result, mod);
    return result;
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.ButtonIconTest = void 0;
const React = __importStar(require("react"));
const react_native_1 = require("react-native");
const react_native_2 = require("@fluentui/react-native");
const react_native_svg_1 = require("react-native-svg");
const iconExamples_1 = require("../Common/iconExamples");
const styles_1 = require("../Common/styles");
const styles = react_native_1.StyleSheet.create({
    balloon: { paddingStart: 4 },
});
const ButtonIconTest = () => {
    const fontBuiltInProps = {
        fontFamily: 'Arial',
        codepoint: 0x2663,
        fontSize: 24,
    };
    const svgIconsEnabled = ['ios', 'macos', 'win32', 'android'].includes(react_native_1.Platform.OS);
    const balloonXml = `
          <svg width="12" height="12" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg">
            <path d="M5.00498 3.4296C5.04386 3.15621 5.29701 2.9661 5.5704 3.00498C6.30797 3.10988 6.89039 3.69171 6.9962 4.42897C7.03543 4.70232 6.84564 4.9557 6.5723 4.99493C6.29896 5.03416 6.04557 4.84437 6.00634 4.57103C5.96366 4.27364 5.7271 4.03733 5.4296 3.99502C5.15621 3.95614 4.9661 3.70299 5.00498 3.4296ZM2 4.36364C2 2.48429 3.58918 1 5.5 1C7.41082 1 9 2.48429 9 4.36364C9 5.59911 8.53933 6.7387 7.8958 7.57241C7.38607 8.23279 6.71092 8.76136 6 8.93727V9.39999C6 9.62091 6.17909 9.79999 6.4 9.79999H7.60001C8.37321 9.79999 9.00001 10.4268 9.00001 11.2V11.5C9.00001 11.7761 8.77615 12 8.50001 12C8.22386 12 8.00001 11.7761 8.00001 11.5V11.2C8.00001 10.9791 7.82092 10.8 7.60001 10.8H6.4C5.6268 10.8 5 10.1732 5 9.39999V8.93735C4.28929 8.7617 3.61415 8.23398 3.10428 7.57379C2.4606 6.74035 2 5.60069 2 4.36364ZM5.5 2C4.09711 2 3 3.0799 3 4.36364C3 5.35685 3.37273 6.28538 3.89572 6.96255C4.43393 7.65943 5.05441 8 5.5 8C5.94529 8 6.56577 7.65894 7.1042 6.96139C7.62734 6.28363 8 5.35505 8 4.36364C8 3.0799 6.90289 2 5.5 2Z" fill="#212121"/>
          </svg>`;
    return (React.createElement(react_native_1.View, { style: styles_1.testContentRootViewStyle },
        React.createElement(react_native_2.ButtonV1, { icon: { fontSource: { ...fontBuiltInProps, fontSize: 32 }, color: '#060' }, style: styles_1.commonTestStyles.vmargin }, "Font icon"),
        React.createElement(react_native_2.ButtonV1, { icon: { fontSource: { ...fontBuiltInProps, fontSize: 32 }, color: '#060' }, style: styles_1.commonTestStyles.vmargin, iconPosition: "after" }, "Icon after"),
        React.createElement(react_native_2.ButtonV1, { icon: { fontSource: fontBuiltInProps }, style: styles_1.commonTestStyles.vmargin }, "Font icon"),
        React.createElement(react_native_2.ButtonV1, { appearance: "primary", icon: { fontSource: fontBuiltInProps }, style: styles_1.commonTestStyles.vmargin }, "Font icon"),
        svgIconsEnabled && (React.createElement(React.Fragment, null,
            React.createElement(react_native_2.ButtonV1, { appearance: "primary", icon: { svgSource: iconExamples_1.svgProps, color: 'red' }, style: styles_1.commonTestStyles.vmargin }, "SVG"),
            React.createElement(react_native_2.ButtonV1, { icon: iconExamples_1.iconProps, style: styles_1.commonTestStyles.vmargin }, "SVG"))),
        React.createElement(react_native_2.ButtonV1, { appearance: "primary", icon: iconExamples_1.testImage, style: styles_1.commonTestStyles.vmargin }, "PNG"),
        React.createElement(react_native_2.ButtonV1, { icon: iconExamples_1.testImage, style: styles_1.commonTestStyles.vmargin }, "PNG"),
        svgIconsEnabled && (React.createElement(react_native_2.ButtonV1, { style: styles_1.commonTestStyles.vmargin, icon: iconExamples_1.iconProps },
            "Icon Button and Balloon",
            React.createElement(react_native_1.View, { style: styles.balloon },
                React.createElement(react_native_svg_1.SvgXml, { xml: balloonXml }))))));
};
exports.ButtonIconTest = ButtonIconTest;
//# sourceMappingURL=ButtonIconTestSection.js.map