@uifabric/experiments/lib-amd/components/Button/Button.view.js

Experimental React components for building experiences for Office 365.

define(["require", "exports", "tslib", "office-ui-fabric-react", "../../Foundation", "../../Utilities", "../../utilities/factoryComponents"], function (require, exports, tslib_1, office_ui_fabric_react_1, Foundation_1, Utilities_1, factoryComponents_1) {
    "use strict";
    Object.defineProperty(exports, "__esModule", { value: true });
    exports.ButtonView = function (props) {
        var icon = props.icon, content = props.content, children = props.children, disabled = props.disabled, onClick = props.onClick, rest = tslib_1.__rest(props, ["icon", "content", "children", "disabled", "onClick"]);
        // TODO: 'href' is anchor property... consider getNativeProps by root type
        var buttonProps = tslib_1.__assign({}, Utilities_1.getNativeProps(rest, Utilities_1.buttonProperties));
        var Slots = Foundation_1.getSlots(props, {
            root: _deriveRootType(props),
            stack: office_ui_fabric_react_1.Stack,
            icon: factoryComponents_1.Icon,
            content: office_ui_fabric_react_1.Text
        });
        var _onClick = function (ev) {
            if (!disabled && onClick) {
                onClick(ev);
                if (ev.defaultPrevented) {
                    return;
                }
            }
        };
        return (Foundation_1.withSlots(Slots.root, tslib_1.__assign({ type: "button" // stack doesn't take in native button props
            , role: "button", onClick: _onClick }, buttonProps, { "aria-disabled": disabled }),
            Foundation_1.withSlots(Slots.stack, { horizontal: true, as: "span", gap: 8, verticalAlign: "center", horizontalAlign: "center", verticalFill: true },
                icon && Foundation_1.withSlots(Slots.icon, null),
                content && Foundation_1.withSlots(Slots.content, null),
                children)));
    };
    function _deriveRootType(props) {
        return !!props.href ? 'a' : 'button';
    }
});
//# sourceMappingURL=Button.view.js.map