@scania/tegel/dist/cjs/tds-breadcrumb.cjs.entry.js

Tegel Design System

'use strict';

var index = require('./index-DGsdvbvx.js');

const breadcrumbCss = () => `@charset "UTF-8";:host([role=listitem]) div ::slotted(*){color:var(--tds-breadcrumb-color);text-decoration:none}:host([role=listitem]) div:hover ::slotted(*){color:var(--tds-breadcrumb-color-hover);text-decoration:underline}:host([role=listitem]) div ::slotted(*:focus-visible){outline:2px solid var(--tds-focus-outline-color);box-shadow:0 0 0 1px var(--tds-white);outline-offset:1px;z-index:1}:host([role=listitem]) div.current ::slotted(*),:host([role=listitem]) div [aria-current=page] ::slotted(*){pointer-events:none;cursor:default;color:var(--tds-breadcrumb-color-current)}:host([role=listitem]) div.current:hover ::slotted(*),:host([role=listitem]) div [aria-current=page]:hover ::slotted(*){text-decoration:none;cursor:not-allowed}:host([role=listitem]) div::after{content:"›";color:var(--tds-breadcrumb-separator-color);margin-right:4px;margin-left:4px;display:inline-block;width:4px;height:8px}:host([role=listitem]) .current::after{display:none}`;

const TdsBreadcrumb = class {
    constructor(hostRef) {
        index.registerInstance(this, hostRef);
        /** Boolean for the current link */
        this.current = false;
    }
    render() {
        return (index.h(index.Host, { key: 'f1a223cf44e435b547b42382e8b3d47979c71793', role: "listitem" }, index.h("div", Object.assign({ key: '41baa33ae1474121ae4512ddf89fb960670d1cea', class: { current: this.current } }, (this.current ? { 'aria-current': 'page' } : {})), index.h("slot", { key: '8f14f28f7e9824e76886a1d49f15d3404666771a' }))));
    }
};
TdsBreadcrumb.style = breadcrumbCss();

exports.tds_breadcrumb = TdsBreadcrumb;