@varlet/ui/es/link/Link.mjs

A Vue3 component library based on Material Design 2 and 3, supporting mobile and desktop.

import { computed, defineComponent, ref } from "vue";
import { call, inMobile } from "@varlet/shared";
import { createNamespace } from "../utils/components.mjs";
import { toSizeUnit } from "../utils/elements.mjs";
import { props } from "./props.mjs";
const { name, n, classes } = createNamespace("link");
import { renderSlot as _renderSlot, resolveDynamicComponent as _resolveDynamicComponent, mergeProps as _mergeProps, withCtx as _withCtx, openBlock as _openBlock, createBlock as _createBlock } from "vue";
function __render__(_ctx, _cache) {
  return _openBlock(), _createBlock(_resolveDynamicComponent(_ctx.tag), _mergeProps(_ctx.linkProps, {
    class: _ctx.classes(
      _ctx.n(),
      _ctx.n("$--box"),
      _ctx.n("$--inline-flex"),
      _ctx.n(`--${_ctx.type}`),
      [_ctx.underline !== "none", _ctx.n(`--underline-${_ctx.underline}`)],
      [_ctx.disabled, _ctx.n("--disabled")],
      [_ctx.isFocusing && !_ctx.inMobile(), _ctx.n("--focusing")]
    ),
    style: {
      color: _ctx.textColor,
      fontSize: _ctx.toSizeUnit(_ctx.textSize)
    },
    onClick: _ctx.handleClick,
    onFocus: _cache[0] || (_cache[0] = ($event) => _ctx.isFocusing = true),
    onBlur: _cache[1] || (_cache[1] = ($event) => _ctx.isFocusing = false)
  }), {
    default: _withCtx(() => [
      _renderSlot(_ctx.$slots, "default")
    ]),
    _: 3
    /* FORWARDED */
  }, 16, ["class", "style", "onClick"]);
}
const __sfc__ = defineComponent({
  name,
  props,
  setup(props2) {
    const isFocusing = ref(false);
    const tag = computed(() => {
      const { disabled, href, to } = props2;
      if (disabled) {
        return "span";
      }
      if (href) {
        return "a";
      }
      if (to) {
        return "router-link";
      }
      return "a";
    });
    const linkProps = computed(() => {
      const { disabled, href, target, to, replace, rel } = props2;
      if (disabled) {
        return {};
      }
      if (href) {
        return { href, target, rel };
      }
      if (to) {
        return { to, target, replace };
      }
      return {};
    });
    function handleClick(e) {
      if (props2.disabled) {
        return;
      }
      call(props2.onClick, e);
    }
    return {
      tag,
      linkProps,
      isFocusing,
      inMobile,
      n,
      classes,
      handleClick,
      toSizeUnit
    };
  }
});
__sfc__.render = __render__;
var stdin_default = __sfc__;
export {
  stdin_default as default
};