@scania/tegel
Version:
Tegel Design System
42 lines (37 loc) • 2.59 kB
JavaScript
import { p as proxyCustomElement, H, h, c as Host } from './p-28ef5186.js';
const popoverMenuItemCss = ":host{box-sizing:border-box;display:block}:host *{box-sizing:border-box}:host .wrapper{font:var(--tds-detail-02);letter-spacing:var(--tds-detail-02-ls);color:var(--tds-popover-menu-color);position:relative;width:100%;display:flex;align-items:center;transition:background-color var(--tds-motion-duration-fast-02) var(--tds-motion-easing-easy)}:host .wrapper:hover{cursor:pointer;background-color:var(--tds-popover-menu-background-hover)}:host .wrapper.disabled{cursor:not-allowed;color:var(--tds-popover-menu-divider-disabled-color)}:host .wrapper.disabled:hover{background-color:inherit}:host .wrapper.disabled ::slotted(tds-icon){color:var(--tds-popover-menu-divider-disabled-icon-color)}:host .wrapper.disabled ::slotted(*){pointer-events:none}:host ::slotted(*:not(tds-icon)){all:unset;width:100%;display:inline-flex;display:flex;align-items:center;gap:10px;padding:10px 16px}:host ::slotted(*:focus-visible)::before{z-index:-1;content:\"\";display:block;position:absolute;width:calc(100% - 4px);height:100%;top:0;left:2px;outline:1px solid var(--tds-blue-400);outline-offset:1px}";
const TdsPopoverMenuItemStyle0 = popoverMenuItemCss;
const TdsPopoverMenuItem$1 = /*@__PURE__*/ proxyCustomElement(class TdsPopoverMenuItem extends H {
constructor() {
super();
this.__registerHost();
this.__attachShadow();
this.disabled = false;
}
render() {
return (h(Host, { key: '64faf6cb0d6b7cf61baa086984db76a18c786920', role: "menuitem", "aria-disabled": this.disabled ? 'true' : 'false' }, h("div", { key: 'af8cf012fd1f2e02862b5830608aadf6bc183c4b', class: {
wrapper: true,
disabled: this.disabled,
} }, h("slot", { key: 'e1057d681689dc614415e980894b85a6b6289a88' }))));
}
static get style() { return TdsPopoverMenuItemStyle0; }
}, [1, "tds-popover-menu-item", {
"disabled": [4]
}]);
function defineCustomElement$1() {
if (typeof customElements === "undefined") {
return;
}
const components = ["tds-popover-menu-item"];
components.forEach(tagName => { switch (tagName) {
case "tds-popover-menu-item":
if (!customElements.get(tagName)) {
customElements.define(tagName, TdsPopoverMenuItem$1);
}
break;
} });
}
defineCustomElement$1();
const TdsPopoverMenuItem = TdsPopoverMenuItem$1;
const defineCustomElement = defineCustomElement$1;
export { TdsPopoverMenuItem, defineCustomElement };