maz-ui
Version:
A standalone components library for Vue.Js 3 & Nuxt.Js 3
79 lines (78 loc) • 3.52 kB
JavaScript
import { defineComponent, defineAsyncComponent, computed, createBlock, openBlock, resolveDynamicComponent, mergeProps, unref, withCtx, renderSlot, createCommentVNode, createVNode } from "vue";
import { MazArrowTopRightOnSquare } from "@maz-ui/icons";
import { useInstanceUniqId } from "../composables/useInstanceUniqId.js";
import { _ as _export_sfc } from "../chunks/_plugin-vue_export-helper.B--vMWp3.js";
import '../assets/MazLink.C26isVfh.css';const _sfc_main = /* @__PURE__ */ defineComponent({
inheritAttrs: !1,
__name: "MazLink",
props: {
class: {},
style: {},
as: {},
id: {},
title: {},
href: {},
to: {},
color: { default: "primary" },
target: { default: "_self" },
download: {},
rel: {},
ariaLabel: {},
underline: { type: Boolean, default: !1 },
underlineHover: { type: Boolean, default: !0 },
autoExternal: { type: Boolean, default: !0 },
leftIcon: { type: [String, Function, Object] },
rightIcon: { type: [String, Function, Object] },
disabled: { type: Boolean }
},
setup(__props) {
const MazIcon = defineAsyncComponent(() => import("./MazIcon.js")), instanceId = useInstanceUniqId({
componentName: "MazLink",
providedId: __props.id
}), component = computed(() => __props.as ? __props.as : __props.to ? "router-link" : __props.href ? "a" : "button"), isButton = computed(() => component.value === "button");
return (_ctx, _cache) => (openBlock(), createBlock(resolveDynamicComponent(component.value), mergeProps({
id: unref(instanceId),
class: ["m-link m-reset-css", [
{
"--underline": _ctx.underline,
"--underline-hover": !_ctx.underline && _ctx.underlineHover
},
`--${_ctx.color}`,
__props.class
]],
to: _ctx.to,
href: _ctx.href,
title: _ctx.title,
target: !isButton.value && _ctx.target,
rel: !isButton.value && _ctx.rel,
download: !isButton.value && _ctx.download,
"aria-label": !isButton.value && _ctx.ariaLabel,
type: isButton.value && "button",
disabled: isButton.value && _ctx.disabled,
style: __props.style
}, _ctx.$attrs), {
default: withCtx(() => [
renderSlot(_ctx.$slots, "left-icon", {}, () => [
typeof _ctx.leftIcon == "string" ? (openBlock(), createBlock(unref(MazIcon), {
key: 0,
name: _ctx.leftIcon
}, null, 8, ["name"])) : _ctx.leftIcon ? (openBlock(), createBlock(resolveDynamicComponent(_ctx.leftIcon), { key: 1 })) : createCommentVNode("", !0)
], !0),
renderSlot(_ctx.$slots, "default", {}, void 0, !0),
renderSlot(_ctx.$slots, "right-icon", {}, () => [
typeof _ctx.rightIcon == "string" ? (openBlock(), createBlock(unref(MazIcon), {
key: 0,
name: _ctx.rightIcon
}, null, 8, ["name"])) : _ctx.rightIcon ? (openBlock(), createBlock(resolveDynamicComponent(_ctx.rightIcon), { key: 1 })) : createCommentVNode("", !0)
], !0),
_ctx.autoExternal && _ctx.target === "_blank" ? renderSlot(_ctx.$slots, "external-icon", { key: 0 }, () => [
createVNode(unref(MazArrowTopRightOnSquare))
], !0) : createCommentVNode("", !0)
]),
_: 3
}, 16, ["id", "class", "to", "href", "title", "target", "rel", "download", "aria-label", "type", "disabled", "style"]));
}
}), MazLink = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-db90c3fd"]]);
export {
MazLink as default
};