@limetech/lime-elements
Version:
38 lines (33 loc) • 2.03 kB
JavaScript
'use strict';
var index = require('./index-BjHIBY-I.js');
var format = require('./format-D04vDIBj.js');
require('./_commonjsHelpers-BJu3ubxk.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) {
index.registerInstance(this, hostRef);
}
render() {
return (index.h(index.Host, { key: '995d46502d8ea017877e6308ea9dde691706cf9a', title: this.labelIsLarge() ? this.label : '', class: {
'has-large-label': this.labelIsLarge(),
} }, index.h("span", { key: 'dc6f429f03e8768b2af2fb254bef0715e9fce839' }, this.renderLabel())));
}
renderLabel() {
if (typeof this.label === 'number') {
return format.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();
exports.limel_badge = Badge;