@limetech/lime-elements
Version:
36 lines (32 loc) • 2.03 kB
JavaScript
import { r as registerInstance, h, H as Host } from './index-DBTJNfo7.js';
import { a as abbreviate } from './format-BMPGHLQ8.js';
import './_commonjsHelpers-BFTU3MAI.js';
const badgeCss = () => ` "UTF-8";:host([hidden]){display:none}:host(limel-badge){--limel-min-badge-size:1rem;display:inline-flex;justify-content:center;align-items:center;flex-shrink:0;min-height:var(--limel-min-badge-size);min-width:var(--limel-min-badge-size);border-radius:var(--limel-min-badge-size)}span{cursor:default;box-sizing:border-box;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;text-align:center;font-size:0.6875rem;line-height:var(--limel-min-badge-size);color:var(--badge-text-color, rgb(var(--contrast-1200)));border-radius:var(--limel-min-badge-size);max-height:var(--limel-min-badge-size);min-width:0.5rem;min-height:0.5rem;background-color:var(--badge-background-color, rgb(var(--contrast-500)))}span:not(:empty){min-width:var(--limel-min-badge-size);max-width:var(--badge-max-width, 2.75rem);padding:0 0.28125rem}:host(.has-large-label) span{cursor:help}`;
const Badge = class {
constructor(hostRef) {
registerInstance(this, hostRef);
}
render() {
return (h(Host, { key: '995d46502d8ea017877e6308ea9dde691706cf9a', title: this.labelIsLarge() ? this.label : '', class: {
'has-large-label': this.labelIsLarge(),
} }, h("span", { key: 'dc6f429f03e8768b2af2fb254bef0715e9fce839' }, this.renderLabel())));
}
renderLabel() {
if (typeof this.label === 'number') {
return abbreviate(this.label);
}
return this.label;
}
labelIsLarge() {
const largeNumericLabel = 999;
const largeStringLabel = 6;
if ((typeof this.label === 'number' &&
this.label > largeNumericLabel) ||
(typeof this.label === 'string' &&
this.label.length > largeStringLabel)) {
return true;
}
}
};
Badge.style = badgeCss();
export { Badge as limel_badge };