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

Experimental React components for building experiences for Office 365.

import * as tslib_1 from "tslib";
/** @jsx withSlots */
import { Stack, Text } from 'office-ui-fabric-react';
import { withSlots, getSlots } from '../../Foundation';
import { getNativeProps, buttonProperties } from '../../Utilities';
import { Icon } from '../../utilities/factoryComponents';
export var 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({}, getNativeProps(rest, buttonProperties));
    var Slots = getSlots(props, {
        root: _deriveRootType(props),
        stack: Stack,
        icon: Icon,
        content: Text
    });
    var _onClick = function (ev) {
        if (!disabled && onClick) {
            onClick(ev);
            if (ev.defaultPrevented) {
                return;
            }
        }
    };
    return (withSlots(Slots.root, tslib_1.__assign({ type: "button" // stack doesn't take in native button props
        , role: "button", onClick: _onClick }, buttonProps, { "aria-disabled": disabled }),
        withSlots(Slots.stack, { horizontal: true, as: "span", gap: 8, verticalAlign: "center", horizontalAlign: "center", verticalFill: true },
            icon && withSlots(Slots.icon, null),
            content && withSlots(Slots.content, null),
            children)));
};
function _deriveRootType(props) {
    return !!props.href ? 'a' : 'button';
}
//# sourceMappingURL=Button.view.js.map