import { l as d } from "./if-defined-66202ed0.mjs";
import { n as f } from "./static-be5c3b1c.mjs";
import { e as u } from "./custom-element-eaccb8d2.mjs";
import { P as h, n as i } from "./plus-base-1920dd44.mjs";
import { s as v } from "./index-975d3293.mjs";
const m = v({
  slots: {
    base: [
      "outline-none focus-visible:ring-2 focus-visible:ring-offset-2",
      "transition-colors duration-200 ease-in-out"
    ]
  },
  variants: {
    kind: {
      default: "text-color-link hover:underline visited:text-color-visited",
      primary: "text-color-primary hover:underline visited:text-color-visited"
    },
    disabled: {
      true: "cursor-not-allowed text-color-disabled user-select-none pointer-events-none",
      false: ""
    }
  },
  defaultVariants: {
    kind: "default",
    disabled: !1
  }
});
var b = Object.defineProperty, y = Object.getOwnPropertyDescriptor, r = (p, o, l, s) => {
  for (var e = s > 1 ? void 0 : s ? y(o, l) : o, n = p.length - 1, a; n >= 0; n--)
    (a = p[n]) && (e = (s ? a(o, l, e) : a(e)) || e);
  return s && e && b(o, l, e), e;
};
let t = class extends h {
  constructor() {
    super(...arguments), this.kind = "default", this.href = "", this.rel = "noreferrer noopener", this.size = "inherit";
  }
  handleClick() {
    this.emit("plus-click");
  }
  render() {
    const { href: p, target: o, download: l, rel: s, kind: e, disabled: n, size: a } = this, { base: c } = m({ kind: e, disabled: n });
    return f`
      <plus-text size=${a}>
        <a class="${c()}" href="${p}" target="${d(o)}" download="${d(l)}" rel="${d(s)}" @click="${this.handleClick}">
          <slot></slot>
        </a>
      </plus-text>
    `;
  }
};
r([
  i({ type: String })
], t.prototype, "kind", 2);
r([
  i()
], t.prototype, "href", 2);
r([
  i()
], t.prototype, "target", 2);
r([
  i()
], t.prototype, "download", 2);
r([
  i()
], t.prototype, "rel", 2);
r([
  i()
], t.prototype, "size", 2);
t = r([
  u("plus-link")
], t);
export {
  t as LinkComponent
};
