@scania/tegel
Version:
Tegel Design System
46 lines (41 loc) • 2.47 kB
JavaScript
'use strict';
var index = require('./index-DGsdvbvx.js');
const linkCss = () => `:host{display:inline}:host ::slotted(*){all:unset;cursor:pointer;outline:none;color:var(--tds-link);text-decoration:underline}:host ::slotted(*:hover){color:var(--tds-link-hover);text-decoration:none}:host .no-underline ::slotted(*){text-decoration:none}:host .no-underline ::slotted(*:hover){color:var(--tds-link-hover);text-decoration:underline;text-decoration-color:var(--tds-link-hover)}:host ::slotted(*:focus-visible){color:var(--tds-link-focus);text-decoration:none;box-shadow:0 0 0 1px var(--tds-white), 0 0 0 3px var(--tds-link-focus)}:host ::slotted(*:active){color:var(--tds-link);text-decoration:underline;text-decoration-color:var(--tds-link)}:host ::slotted(*:visited){color:var(--tds-link-visited);text-decoration-color:var(--tds-link-visited)}.disabled ::slotted(*),.disabled ::slotted(*:visited){color:var(--tds-link-disabled);text-decoration-color:var(--tds-link-disabled);pointer-events:none}.standalone ::slotted(*){font:var(--tds-detail-02);letter-spacing:var(--tds-detail-02-ls)}`;
const TdsLink = class {
constructor(hostRef) {
index.registerInstance(this, hostRef);
/** Disables the Link */
this.disabled = false;
/** Displays the Link with an underline. */
this.underline = true;
/** Displays the Link as a standalone component. Not part of a paragraph. */
this.standalone = false;
}
connectedCallback() {
const links = this.host.querySelectorAll('a');
if (links.length > 1) {
console.warn('tds-link is only intended to wrap one <a> tag');
}
const link = links[0];
if (link) {
if (this.disabled) {
link.setAttribute('tabindex', '-1');
link.setAttribute('aria-disabled', 'true');
}
else {
link.removeAttribute('tabindex');
link.removeAttribute('aria-disabled');
}
}
}
render() {
return (index.h("span", { key: '4b56921da22a5b976ebf4985d04e8af3b5917329', class: {
'disabled': this.disabled,
'no-underline': !this.underline,
'standalone': this.standalone,
} }, index.h("slot", { key: 'bad6ba1260f82de37b1939d2cca208053e52126b' })));
}
get host() { return index.getElement(this); }
};
TdsLink.style = linkCss();
exports.tds_link = TdsLink;