@limetech/lime-elements/dist/cjs/limel-badge.cjs.entry.js

Lime Elements

'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

const index = require('./index-174a078a.js');
const format = require('./format-c8759d02.js');
require('./_commonjsHelpers-a5111d61.js');

const badgeCss = "@charset \"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)}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);
    this.label = undefined;
  }
  render() {
    return (index.h(index.Host, { title: this.labelIsLarge() ? this.label : '', class: {
        'has-large-label': this.labelIsLarge(),
      } }, index.h("span", null, 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;

//# sourceMappingURL=limel-badge.cjs.entry.js.map