ranui
Version:
A framework-agnostic Web Components UI library built on native custom elements, with TypeScript types, light/dark theming, SSR and PWA support.
78 lines (77 loc) • 2.53 kB
JavaScript
import { a as s, n as i, o as n, r as a, t as o } from "./utils-D1iZnChu.js";
import { t as h } from "./events-C59wGdni.js";
import { a as c, n as l } from "./ssr-DSGwPtEd.js";
import { useRouter as u } from "./utils/router.js";
var f = ".remove-wap-active-focus{outline:0;-webkit-tap-highlight-color:transparent}.remove-wap-active-focus:active,.remove-wap-active-focus:focus{outline:0;-webkit-tap-highlight-color:transparent}:host{display:inline}a{color:var(--ran-color-link, #006bff);text-decoration:none;cursor:pointer;font-family:inherit;font-size:inherit;border-radius:var(--ran-radius-sm, 6px)}a:hover{text-decoration:underline;opacity:.85}a:focus-visible{outline:2px solid var(--ran-color-primary, #006bff);outline-offset:2px}:host([active]) a{font-weight:600;text-decoration:underline}", d = class extends l {
static get observedAttributes() {
return [
"href",
"replace",
"sheet"
];
}
_events = new h();
_shadowDom;
_anchor;
constructor() {
super(), this._shadowDom = i(this, f);
const e = o(this._shadowDom, "a", () => {
const t = document.createElement("a");
return t.appendChild(document.createElement("slot")), t;
});
this._anchor = e;
}
get href() {
return a(this, "href");
}
set href(e) {
s(this, "href", e);
}
get replace() {
return this.hasAttribute("replace");
}
get sheet() {
return a(this, "sheet");
}
set sheet(e) {
s(this, "sheet", e);
}
handlerExternalCss = () => {
n(this, this._shadowDom, "sheet", null, this.sheet);
};
_handleClick = (e) => {
if (e.defaultPrevented || e.button !== 0 || e.metaKey || e.ctrlKey || e.shiftKey || e.altKey) return;
const t = this.href;
if (!t || /^(https?:\/\/|\/\/|mailto:|tel:)/.test(t)) return;
e.preventDefault();
const r = u();
if (r) {
this.replace ? r.replace(t) : r.push(t);
return;
}
this.dispatchEvent(new CustomEvent("ran-navigate", {
detail: {
path: t,
replace: this.replace
},
bubbles: !0,
composed: !0
}));
};
_syncHref() {
this._anchor && (this._anchor.href = this.href);
}
connectedCallback() {
this.handlerExternalCss(), this._syncHref(), this._events.on(this._anchor, "click", this._handleClick);
}
disconnectedCallback() {
this._events.abort();
}
attributeChangedCallback(e, t, r) {
t !== r && (e === "href" && this._syncHref(), e === "sheet" && this.handlerExternalCss());
}
};
c("r-link", d);
export {
d as t
};