"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.ShadowWithDifferentPropsTestSection = void 0;
var tslib_1 = require("tslib");
var React = tslib_1.__importStar(require("react"));
var react_native_1 = require("react-native");
var react_native_2 = require("@fluentui/react-native");
var experimental_shadow_1 = require("@fluentui-react-native/experimental-shadow");
var framework_1 = require("@fluentui-react-native/framework");
var merge_props_1 = require("@fluentui-react-native/merge-props");
var themed_stylesheet_1 = require("@fluentui-react-native/themed-stylesheet");
var ShadowTestPageStyles_1 = require("./ShadowTestPageStyles");
var getThemedStyles = (0, themed_stylesheet_1.themedStyleSheet)(function (t) {
    var defaultShadowTestBoxPropsWithoutSpacing = tslib_1.__assign({ maxWidth: 732, minHeight: 64 }, (0, ShadowTestPageStyles_1.shadowTestPageStyles)(t).backgroundColor);
    var marginTestProps = {
        marginVertical: 16,
        marginHorizontal: 32,
    };
    var paddingTestProps = {
        padding: 20,
    };
    return {
        headerTextPadding: {
            padding: 16,
        },
        defaultShadowTestBoxPropsWithoutSpacing: defaultShadowTestBoxPropsWithoutSpacing,
        defaultShadowTestBoxProps: tslib_1.__assign(tslib_1.__assign(tslib_1.__assign({}, defaultShadowTestBoxPropsWithoutSpacing), marginTestProps), paddingTestProps),
        marginTestProps: marginTestProps,
        paddingTestProps: paddingTestProps,
        borderRadiusTestProps: {
            borderRadius: 8,
        },
        borderWidthTestProps: {
            borderWidth: 2,
            borderColor: 'black',
        },
        offsetTestProps: { start: 10 },
        alignItemsTestProps: { alignItems: 'flex-start' },
        flexDirectionTestProps: { flexDirection: 'row' },
        flexWrapTestProps: { flexWrap: 'wrap' },
    };
});
var ShadowWithDifferentPropsTestSection = function () {
    var theme = (0, framework_1.useFluentTheme)();
    var themedStyles = getThemedStyles(theme);
    return (React.createElement(react_native_1.View, { style: (0, ShadowTestPageStyles_1.shadowTestPageStyles)(theme).backgroundColor },
        React.createElement(react_native_2.Text, { style: themedStyles.headerTextPadding }, "The following tests have a Shadow16 set on a child view that has some specific props."),
        React.createElement(react_native_1.View, null,
            React.createElement(experimental_shadow_1.Shadow, { shadowToken: theme.shadows.shadow16 },
                React.createElement(react_native_1.View, { style: themedStyles.defaultShadowTestBoxProps },
                    React.createElement(react_native_2.Text, { variant: "bodySemibold" }, "padding: 20, marginVertical: 16, marginHorizontal: 32"))),
            React.createElement(experimental_shadow_1.Shadow, { shadowToken: theme.shadows.shadow16 },
                React.createElement(react_native_1.View, { style: (0, merge_props_1.mergeStyles)(themedStyles.defaultShadowTestBoxPropsWithoutSpacing, themedStyles.paddingTestProps) },
                    React.createElement(react_native_2.Text, { variant: "bodySemibold" }, "padding only"))),
            React.createElement(experimental_shadow_1.Shadow, { shadowToken: theme.shadows.shadow16 },
                React.createElement(react_native_1.View, { style: (0, merge_props_1.mergeStyles)(themedStyles.defaultShadowTestBoxPropsWithoutSpacing, themedStyles.marginTestProps) },
                    React.createElement(react_native_2.Text, { variant: "bodySemibold" }, "margins only"))),
            React.createElement(experimental_shadow_1.Shadow, { shadowToken: theme.shadows.shadow16 },
                React.createElement(react_native_1.View, { style: (0, merge_props_1.mergeStyles)(themedStyles.defaultShadowTestBoxProps, themedStyles.borderRadiusTestProps) },
                    React.createElement(react_native_2.Text, { variant: "bodySemibold" }, "borderRadius: 8"))),
            React.createElement(experimental_shadow_1.Shadow, { shadowToken: theme.shadows.shadow16 },
                React.createElement(react_native_1.View, { style: (0, merge_props_1.mergeStyles)(themedStyles.defaultShadowTestBoxProps, themedStyles.borderRadiusTestProps, themedStyles.borderWidthTestProps) },
                    React.createElement(react_native_2.Text, { variant: "bodySemibold" }, "borderWidth: 2"))),
            React.createElement(experimental_shadow_1.Shadow, { shadowToken: theme.shadows.shadow16 },
                React.createElement(react_native_1.View, { style: (0, merge_props_1.mergeStyles)(themedStyles.defaultShadowTestBoxProps, themedStyles.offsetTestProps) },
                    React.createElement(react_native_2.Text, { variant: "bodySemibold" }, "start: 10"))),
            React.createElement(experimental_shadow_1.Shadow, { shadowToken: theme.shadows.shadow16 },
                React.createElement(react_native_1.View, { style: (0, merge_props_1.mergeStyles)(themedStyles.defaultShadowTestBoxProps, themedStyles.alignItemsTestProps) },
                    React.createElement(react_native_2.Text, { variant: "bodySemibold" }, "alignItems: flex-start"))),
            React.createElement(experimental_shadow_1.Shadow, { shadowToken: theme.shadows.shadow16 },
                React.createElement(react_native_1.View, { style: (0, merge_props_1.mergeStyles)(themedStyles.defaultShadowTestBoxProps, themedStyles.flexDirectionTestProps) },
                    React.createElement(react_native_2.Text, { variant: "bodySemibold" }, "flexDirection: row"))),
            React.createElement(experimental_shadow_1.Shadow, { shadowToken: theme.shadows.shadow16 },
                React.createElement(react_native_1.View, { style: (0, merge_props_1.mergeStyles)(themedStyles.defaultShadowTestBoxProps, themedStyles.flexWrapTestProps) },
                    React.createElement(react_native_2.Text, { variant: "bodySemibold" }, "flexWrap: wrap"))))));
};
exports.ShadowWithDifferentPropsTestSection = ShadowWithDifferentPropsTestSection;
//# sourceMappingURL=ShadowWithDifferentPropsTestSection.js.map