@kelvininc/ui-components
Version:
Kelvin UI Components
43 lines (36 loc) • 2.82 kB
JavaScript
'use strict';
var index = require('./index-rNNWWpit.js');
require('./wizard.types-C9Yhv1tt.js');
const breadcrumbItemCss = "@property --rotation{syntax:\"<angle>\";initial-value:0deg;inherits:false}@keyframes rotate-border{to{--rotation:360deg}}kv-dropdown-base:not(.hydrated)>[slot=list]{display:none}.breadcrumb-item{user-select:none}.breadcrumb-item--active kv-link,.breadcrumb-item--active ::slotted(*){--kv-link-pointer-events:none;--kv-link-cursor:default;--kv-link-font-weight:600}";
const KvBreadcrumbItem = class {
constructor(hostRef) {
index.registerInstance(this, hostRef);
this.breadcrumbItemClick = index.createEvent(this, "breadcrumbItemClick", 7);
this.onItemClick = () => {
this.breadcrumbItemClick.emit({
label: this.label,
active: this.active
});
};
}
render() {
return (index.h(index.Host, { key: '7e7bf20f371776be3a6bb51d528ecd5093f76601' }, index.h("div", { key: 'cb31f5f0d0433177afd10aee82334f04daad9379', class: {
'breadcrumb-item': true,
'breadcrumb-item--active': this.active
}, onClick: this.onItemClick }, index.h("slot", { key: '321610e4b7c8631e3221669af8ff554967e07135' }, this.label && index.h("kv-link", { key: '1d51baf8e586e3c7b3b22aa6cdcca9fbb0593288', label: this.label })))));
}
};
KvBreadcrumbItem.style = breadcrumbItemCss;
const breadcrumbListCss = "@property --rotation{syntax:\"<angle>\";initial-value:0deg;inherits:false}@keyframes rotate-border{to{--rotation:360deg}}kv-dropdown-base:not(.hydrated)>[slot=list]{display:none}:host{--breadcrumb-separator-color:var(--text-surface-neutral-secondary);--breadcrumb-separator-content:\"/\"}.breadcrumb-list{display:flex;align-items:center}.breadcrumb-list ::slotted(kv-breadcrumb-item:not(:last-child)){display:flex;align-items:center}.breadcrumb-list ::slotted(kv-breadcrumb-item:not(:last-child))::after{font-family:Proxima Nova;font-weight:400;font-size:14px;line-height:20px;letter-spacing:0;display:inline-block;content:var(--breadcrumb-separator-content);margin:0 var(--spacing-md);color:var(--breadcrumb-separator-color)}";
const KvBreadcrumbList = class {
constructor(hostRef) {
index.registerInstance(this, hostRef);
this.breadcrumbItemClick = index.createEvent(this, "breadcrumbItemClick", 7);
}
render() {
return (index.h(index.Host, { key: '7377f39725adbbf766e6d6c5a6506ff4c52be792' }, index.h("div", { key: '5d865c84d2c2991bf145ef67ac39c9c7fa01facc', class: "breadcrumb-list", part: "breadcrumb-list" }, index.h("slot", { key: 'c42ca51a18a11565479a6ed25a2822c651425fe5' }))));
}
};
KvBreadcrumbList.style = breadcrumbListCss;
exports.kv_breadcrumb_item = KvBreadcrumbItem;
exports.kv_breadcrumb_list = KvBreadcrumbList;