@aotearoan/neon
Version:
Neon is a lightweight design library of Vue 3 components with minimal dependencies.
62 lines (61 loc) • 2.08 kB
JavaScript
import { defineComponent as m, useAttrs as h, computed as t } from "vue";
import { NeonOutlineStyle as y } from "../../../common/enums/NeonOutlineStyle.es.js";
import S from "../../presentation/icon/NeonIcon.vue.es.js";
import { useRouter as k, useRoute as x } from "vue-router";
const N = m({
name: "NeonLink",
components: {
NeonIcon: S
},
props: {
/**
* The href of the link, this can be an internal (relative or absolute) or an external link.
*/
href: { type: String, default: null },
/**
* set to true if you would like a completely unstyled link. This is useful for creating a complex component which may use NeonLink.
*/
noStyle: { type: Boolean, default: !1 },
/**
* Style of the outline to use when the link has focus, use <em>text</em> for wrapping text content and
* <em>border</em> for tooltips wrapping "block" elements, e.g. buttons.
*/
outlineStyle: { type: String, default: y.Text },
/**
* Display an external link icon to the right of the link indicating clicking it will take the user to another site.
*/
externalIndicator: { type: Boolean, default: !1 }
},
emits: [
/**
* Emitted when the user triggers the link by clicking on it or hitting Enter or Space when the link has focus.
* @type {void}
*/
"click"
],
setup(e, { emit: a }) {
const c = h(), f = k(), o = x(), i = t(() => {
var n;
return ((n = e.href) == null ? void 0 : n.indexOf("//")) === -1 ? e.href : void 0;
}), l = t(() => e.href && e.href.indexOf(o.fullPath) === 0), u = t(() => l.value && e.href === o.fullPath), s = t(() => {
const { onClick: n, ...d } = c;
return d;
}), r = () => {
a("click");
};
return {
routerUrl: i,
sanitizedAttributes: s,
activeRoute: l,
exactRoute: u,
onClick: r,
onSpace: async () => {
r(), i.value ? await f.push(e.href) : e.href && window.location.replace(e.href);
}
};
}
});
export {
N as default
};
//# sourceMappingURL=NeonLink.es.js.map