import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { Button, ButtonGroup } from "@material-ui/core";
import styled from "styled-components";
import { ButtonControlSize } from "../../Form/FormDesignConstants";
import Radio from "@material-ui/core/Radio";
import RadioGroup from "@material-ui/core/RadioGroup";
import FormControlLabel from "@material-ui/core/FormControlLabel";
import FormControl from "@material-ui/core/FormControl";
import FormLabel from "@material-ui/core/FormLabel";
const TextSizeButton = styled(Button) `
    && {
        width: 120px;
        height: 46px;
        padding: 0;
        display: flex;
        align-items: center;
        justify-content: center;
        border-radius: 4px;
        color: #01244E;
        border: 1px solid #E6E9ED

        &:hover {
            background: #F2FAFE;
        }

        &.Mui-disabled {
			background: #F2FAFE;
			color: black;
		}
    }

`;
export const PropertyEditorLinkStyleSelection = (props) => {
    var _a;
    const handleChangeStyle = (event) => {
        if (props.parentDefaultValue &&
            props.parentDefaultValue === event.target.value) {
            Reflect.set(props.editObject, props.propertyName, null);
        }
        else {
            Reflect.set(props.editObject, props.propertyName, event.target.value);
        }
        props.updateCallback();
    };
    const value = (_a = Reflect.get(props.editObject, props.propertyName)) !== null && _a !== void 0 ? _a : props.parentDefaultValue;
    return (_jsxs(FormControl, Object.assign({ component: "fieldset" }, { children: [_jsx(FormLabel, Object.assign({ component: "legend" }, { children: "Underline" }), void 0),
            _jsxs(RadioGroup, Object.assign({ "aria-label": "underline", name: "underline", value: value, onChange: handleChangeStyle }, { children: [_jsx(FormControlLabel, { value: "none", control: _jsx(Radio, {}, void 0), label: "None" }, void 0),
                    _jsx(FormControlLabel, { value: "hover", control: _jsx(Radio, {}, void 0), label: "Hover" }, void 0),
                    _jsx(FormControlLabel, { value: "always", control: _jsx(Radio, {}, void 0), label: "Always" }, void 0)] }), void 0)] }), void 0));
};
export const PropertyEditorLinkTypeSelection = (props) => {
    var _a;
    const handleChangeType = (event) => {
        if (props.parentDefaultValue &&
            props.parentDefaultValue === event.target.value) {
            Reflect.set(props.editObject, props.propertyName, null);
        }
        else {
            Reflect.set(props.editObject, props.propertyName, event.target.value);
        }
        props.updateCallback();
    };
    const value = (_a = Reflect.get(props.editObject, props.propertyName)) !== null && _a !== void 0 ? _a : props.parentDefaultValue;
    return (_jsxs(FormControl, Object.assign({ component: "fieldset" }, { children: [_jsx(FormLabel, Object.assign({ component: "legend" }, { children: "Link Type" }), void 0),
            _jsxs(RadioGroup, Object.assign({ "aria-label": "linkType", name: "linkType", value: value, onChange: handleChangeType }, { children: [_jsx(FormControlLabel, { value: "action", control: _jsx(Radio, {}, void 0), label: "Action" }, void 0),
                    _jsx(FormControlLabel, { value: "url", control: _jsx(Radio, {}, void 0), label: "Url" }, void 0)] }), void 0)] }), void 0));
};
export const PropertyEditorLinkSizeSelection = (props) => {
    var _a;
    function handleChangeSize(newSize) {
        if (props.parentDefaultValue && newSize === props.parentDefaultValue) {
            Reflect.set(props.editObject, props.propertyName, null);
        }
        else {
            Reflect.set(props.editObject, props.propertyName, newSize);
        }
        props.updateCallback();
    }
    const value = (_a = Reflect.get(props.editObject, props.propertyName)) !== null && _a !== void 0 ? _a : props.parentDefaultValue;
    return (_jsxs(FormControl, Object.assign({ component: "fieldset" }, { children: [_jsx(FormLabel, Object.assign({ component: "legend" }, { children: "Size" }), void 0),
            _jsxs(ButtonGroup, Object.assign({ size: "large", "aria-label": "large outlined primary button group", style: { height: "49px", width: "240px", marginTop: "10px" } }, { children: [_jsx(TextSizeButton, Object.assign({ onClick: () => {
                            handleChangeSize(ButtonControlSize.STANDARD);
                        }, style: { textTransform: "lowercase" }, disabled: value === ButtonControlSize.STANDARD }, { children: "Standard" }), void 0),
                    _jsx(TextSizeButton, Object.assign({ onClick: () => {
                            handleChangeSize(ButtonControlSize.SMALL);
                        }, style: { textTransform: "lowercase" }, disabled: value === ButtonControlSize.SMALL }, { children: "Small" }), void 0),
                    _jsx(TextSizeButton, Object.assign({ onClick: () => {
                            handleChangeSize(ButtonControlSize.LARGE);
                        }, style: { textTransform: "lowercase" }, disabled: value === ButtonControlSize.LARGE }, { children: "Large" }), void 0)] }), void 0)] }), void 0));
};
//# sourceMappingURL=PropertyEditorLinkControl.js.map