UNPKG

@vue-layout/link

Version:

A package containing a link component.

146 lines (140 loc) 4.44 kB
'use strict'; Object.defineProperty(exports, '__esModule', { value: true }); var vue = require('vue'); const VCLink = vue.defineComponent({ props: { active: { type: Boolean, default: false }, disabled: { type: Boolean, default: false }, href: { type: String, default: undefined }, prefetch: { type: Boolean, default: true }, target: { type: String, default: '_self' }, to: { type: String, default: undefined } }, emits: [ 'click', 'clicked' ], setup (props, { emit, slots }) { const routerLink = vue.resolveDynamicComponent('RouterLink'); const nuxtLink = vue.resolveDynamicComponent('NuxtLink'); const computedTag = vue.computed(()=>{ const hasRouter = typeof routerLink !== 'string'; if (!hasRouter || props.disabled || !props.to) { return 'a'; } if (typeof nuxtLink !== 'string') { return 'nuxt-link'; } return 'router-link'; }); const isRouterLink = vue.computed(()=>computedTag.value !== 'a'); const computedHref = vue.computed(()=>{ if (props.href) { return props.href; } if (isRouterLink.value) { return null; } return '#'; }); const computedProps = vue.computed(()=>{ if (!isRouterLink.value) { return {}; } return { ...props.to ? { to: props.to } : {}, ...typeof props.prefetch !== 'undefined' ? { prefetch: props.prefetch } : {} }; }); const computedAttrs = vue.computed(()=>({ ...props.href ? { href: props.href } : {}, ...isRouterLink.value ? {} : { target: props.target } })); const buildVNodeProps = ()=>{ const onClick = (event)=>{ const isEvent = typeof event.preventDefault !== 'undefined' && typeof event.stopPropagation !== 'undefined' && typeof event.stopImmediatePropagation !== 'undefined'; if (isEvent && props.disabled) { event.preventDefault(); event.stopPropagation(); event.stopImmediatePropagation(); } else { if (isRouterLink.value) { emit('click', event); } emit('clicked', event); } if (isEvent && !isRouterLink.value && computedHref.value === '#') { event.preventDefault(); event.stopPropagation(); event.stopImmediatePropagation(); } }; const vNodeProps = { class: { active: props.active, disabled: props.disabled }, ...computedAttrs.value, ...computedProps.value, onClick }; return vNodeProps; }; let component; switch(computedTag.value){ case 'router-link': component = routerLink; break; case 'nuxt-link': component = nuxtLink; break; default: component = 'a'; } if (typeof component === 'string') { return ()=>vue.h(component, buildVNodeProps(), [ typeof slots.default === 'function' ? slots.default() : [] ]); } return ()=>vue.h(component, buildVNodeProps(), { default: ()=>typeof slots.default === 'function' ? slots.default() : [] }); } }); function install(instance, options) { instance.component('VCLink', VCLink); } var index = { install }; exports.VCLink = VCLink; exports.default = index; exports.install = install; module.exports = Object.assign(exports.default, exports); //# sourceMappingURL=index.cjs.map