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

Experimental React components for building experiences for Microsoft 365.

import { __assign, __rest } from "tslib";
import { Text, KeytipData } from 'office-ui-fabric-react';
import { withSlots } from '../../Foundation';
import { getNativeProps, anchorProperties, buttonProperties } from '../../Utilities';
import { FontIcon } from '../../utilities/factoryComponents';
/* eslint-disable deprecation/deprecation */
/** @deprecated */
export var ButtonSlots = function (props) { return ({
    root: props.href ? 'a' : 'button',
    icon: FontIcon,
    content: Text,
}); };
/** @deprecated */
export var ButtonView = function (props, slots) {
    var icon = props.icon, content = props.content, children = props.children, disabled = props.disabled, onClick = props.onClick, allowDisabledFocus = props.allowDisabledFocus, ariaLabel = props.ariaLabel, keytipProps = props.keytipProps, buttonRef = props.buttonRef, rest = __rest(props, ["icon", "content", "children", "disabled", "onClick", "allowDisabledFocus", "ariaLabel", "keytipProps", "buttonRef"]);
    var _a = _deriveRootType(props), htmlType = _a.htmlType, propertiesType = _a.propertiesType;
    var buttonProps = __assign({}, getNativeProps(rest, propertiesType));
    var _onClick = function (ev) {
        if (!disabled && onClick) {
            onClick(ev);
            if (ev.defaultPrevented) {
                return;
            }
        }
    };
    var Button = function (keytipAttributes) { return (withSlots(slots.root, __assign({ type: htmlType, role: "button", onClick: _onClick }, buttonProps, keytipAttributes, { disabled: disabled && !allowDisabledFocus, "aria-disabled": disabled, tabIndex: !disabled || allowDisabledFocus ? 0 : undefined, "aria-label": ariaLabel, ref: buttonRef }),
        icon && withSlots(slots.icon, null),
        content && withSlots(slots.content, null),
        children)); };
    return keytipProps ? (withSlots(KeytipData, { keytipProps: keytipProps, disabled: disabled && !allowDisabledFocus }, function (keytipAttributes) { return Button(keytipAttributes); })) : (Button());
};
function _deriveRootType(props) {
    return props.href
        ? { htmlType: 'link', propertiesType: anchorProperties }
        : { htmlType: 'button', propertiesType: buttonProperties };
}
//# sourceMappingURL=Button.view.js.map