import * as React from 'react';
import { Link, Text } from '@fluentui/react';
export var LinkBasicExample = function () {
    return (React.createElement("div", null,
        React.createElement(Text, null,
            "When a link has an href,",
            ' ',
            React.createElement(Link, { href: "https://developer.microsoft.com/en-us/fluentui#/controls/web/link", underline: true }, "it renders as an anchor tag."),
            ' ',
            "Without an href,",
            ' ',
            React.createElement(Link, { onClick: handleClickOnLink, underline: true }, "the link is rendered as a button"),
            ". You can also use the disabled attribute to create a",
            ' ',
            React.createElement(Link, { disabled: true, href: "https://developer.microsoft.com/en-us/fluentui#/controls/web/link", underline: true }, "disabled link.")),
        React.createElement(Text, null, "It's not recommended to use Links with imgs because Links are meant to render textual inline content. Buttons are inline-block or in the case of imgs, block. However, it is possible to create a linked image button by making a button with an unstyled variant and adding the img content and href source to that.")));
};
function handleClickOnLink(ev) {
    window.alert('clicked on Link component which is rendered as html button');
}
//# sourceMappingURL=Link.Basic.Example.js.map