@postnord/web-components
Version:
PostNord Web Components
82 lines (78 loc) • 4.44 kB
JavaScript
/*!
* Built with Stencil
* By PostNord.
*/
import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client';
import { d as defineCustomElement$1 } from './pn-icon2.js';
const pnTextLinkCss = "pn-text-link{display:inline}pn-text-link .pn-text-link{border-radius:0.25em;color:#005d92;font-weight:500;text-decoration:underline;font-size:1em;transition-property:color, outline-color, text-decoration-color;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.7, 0, 0.3, 1)}@media (prefers-reduced-motion: reduce){pn-text-link .pn-text-link{transition-duration:0s;transition-delay:0s}}pn-text-link .pn-text-link{outline:0.2rem solid transparent;outline-offset:0.2rem}pn-text-link .pn-text-link:focus-visible{outline-color:#005d92}pn-text-link .pn-text-link:hover{color:#0d234b;text-decoration-color:#0d234b}pn-text-link .pn-text-link[data-icon]{display:inline-flex;gap:0.25em;align-items:center;text-decoration-color:transparent;padding:0.1em;border-radius:0.5em}pn-text-link .pn-text-link[data-icon] .pn-icon-svg path{fill:#005d92}pn-text-link .pn-text-link[data-icon]:hover{text-decoration-color:#0d234b}pn-text-link .pn-text-link[data-icon]:hover .pn-icon-svg path,pn-text-link .pn-text-link[data-icon]:focus-visible .pn-icon-svg path{fill:#0d234b}pn-text-link .pn-text-link[data-icon][data-icon-left]{flex-direction:row-reverse}pn-text-link .pn-text-link[data-light]{color:#ffffff}pn-text-link .pn-text-link[data-light]:focus-visible{outline-color:#ffffff}pn-text-link .pn-text-link[data-light]:hover{text-decoration-color:#ffffff}pn-text-link .pn-text-link[data-light][data-icon] pn-icon .pn-icon-svg path{fill:#ffffff}";
const PnTextLink = /*@__PURE__*/ proxyCustomElement(class PnTextLink extends HTMLElement {
constructor(registerHost) {
super();
if (registerHost !== false) {
this.__registerHost();
}
}
get hostElement() { return this; }
/** The link text. @since v7.5.0 */
label;
/** The URL string. */
href;
/** Use the light version of the link. @category Visual */
light = false;
/** SVG content of the icon. @category Visual */
icon;
/** Align the icon on the left. @category Visual */
leftIcon = false;
/** Treat the link as a download link. @category Link attributes */
download;
/** Set the hreflang of the URL destination. @category Link attributes */
hreflang;
/** Link media. @category Link attributes */
media;
/** Set referrerpolicy on the link. @category Link attributes */
referrerpolicy;
/** Set the rel of the link. @category Link attributes */
rel = 'noopener noreferrer';
/** Set the target of the link. @category Link attributes */
target;
/** Set a unique html ID of the a element. @category Link attributes */
linkid;
render() {
return (h("a", { key: '81133ec8e015ae1173fa9e48763f65c1503b154d', id: this.linkid, class: "pn-text-link", href: this.href, rel: this.rel, target: this.target, download: this.download, hreflang: this.hreflang, media: this.media, referrerPolicy: this.referrerpolicy, "data-icon": !!this.icon, "data-icon-left": this.leftIcon, "data-light": this.light }, this.label, h("slot", { key: '9bfea6c6f3980bd925a6126af5a6db0477706ad6' }), this.icon && h("pn-icon", { key: 'a86cef98f5d24dc7424e32d0fc1d26e8a1df8f0d', icon: this.icon })));
}
static get style() { return pnTextLinkCss; }
}, [260, "pn-text-link", {
"label": [1],
"href": [1],
"light": [4],
"icon": [1],
"leftIcon": [4, "left-icon"],
"download": [1],
"hreflang": [1],
"media": [1],
"referrerpolicy": [1],
"rel": [1],
"target": [1],
"linkid": [1]
}]);
function defineCustomElement() {
if (typeof customElements === "undefined") {
return;
}
const components = ["pn-text-link", "pn-icon"];
components.forEach(tagName => { switch (tagName) {
case "pn-text-link":
if (!customElements.get(tagName)) {
customElements.define(tagName, PnTextLink);
}
break;
case "pn-icon":
if (!customElements.get(tagName)) {
defineCustomElement$1();
}
break;
} });
}
export { PnTextLink as P, defineCustomElement as d };
//# sourceMappingURL=pn-text-link2.js.map
//# sourceMappingURL=pn-text-link2.js.map