@kelvininc/ui-components
Version:
Kelvin UI Components
16 lines (12 loc) • 1.78 kB
JavaScript
import { r as registerInstance, h, H as Host } from './index-D-JVwta2.js';
const tagLetterCss = "@property --rotation{syntax:\"<angle>\";initial-value:0deg;inherits:false}@keyframes rotate-border{to{--rotation:360deg}}.tag-letter-container{height:22px;border:solid 1px var(--kv-primary, #005cc7);border-radius:2px;display:inline-flex}.letter-avatar{font-family:var(--kv-primary-font, \"proxima-nova\", sans-serif, \"Arial\");font-size:16px;font-weight:600;font-stretch:normal;font-style:normal;line-height:24px;letter-spacing:normal;text-transform:none;height:100%;width:24px;display:flex;justify-content:center;background-color:var(--kv-primary, #005cc7);color:var(--kv-neutral-0, #fff)}.label{font-family:var(--kv-primary-font, \"proxima-nova\", sans-serif, \"Arial\");font-size:12px;font-weight:400;font-stretch:normal;font-style:normal;line-height:18px;letter-spacing:normal;text-transform:none;padding:0 var(--kv-spacing, 4px);align-self:center;color:var(--kv-neutral-9, #121212)}.tag-letter-container{background-color:var(--kv-neutral-0, #fff)}";
const KvTagLetter = class {
constructor(hostRef) {
registerInstance(this, hostRef);
}
render() {
return (h(Host, { key: '7b5912af6c3d01bb28003ae49971175ed4e229a0' }, h("div", { key: '1ebdc79fd2e3715939631fae85945da98c83e618', class: "tag-letter-container", style: { borderColor: this.color } }, h("div", { key: 'fef0e10fd8a1fc36bfebec57c29199a71bdccf79', class: "letter-avatar", style: { backgroundColor: this.color } }, h("div", { key: '81912895ba5361bc050c99b984003c70cec8882a', class: "avatar" }, this.tagLetter)), h("div", { key: '4bde95afe9f06f32f1fe0fbd72ae92d26199d607', class: "label" }, this.label))));
}
};
KvTagLetter.style = tagLetterCss;
export { KvTagLetter as kv_tag_letter };