@kelvininc/ui-components
Version:
Kelvin UI Components
42 lines (38 loc) • 2.67 kB
JavaScript
import { H as proxyCustomElement, I as H, K as h } from './p-BP5CxQcH.js';
import { d as defineCustomElement$1 } from './p-RSgE4CBK.js';
const illustrationMessageCss = "@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{--image-width:60px;--image-height:auto;--header-color:var(--text-surface-neutral-secondary);--description-color:var(--text-surface-neutral-tertiary)}.illustration-message{display:flex;flex-direction:column;justify-content:center;align-items:center}.image{margin-bottom:var(--spacing-xl);--illustration-width:var(--image-width);--illustration-height:var(--image-height)}.header{color:var(--header-color);text-align:center;font-family:Proxima Nova;font-weight:600;font-size:14px;line-height:20px;letter-spacing:0}.description{color:var(--description-color);text-align:center;font-family:Proxima Nova;font-weight:400;font-size:12px;line-height:16px;letter-spacing:0;white-space:break-spaces;margin-top:var(--spacing-xs)}";
const KvIllustrationMessage = /*@__PURE__*/ proxyCustomElement(class KvIllustrationMessage extends H {
constructor() {
super();
this.__registerHost();
this.__attachShadow();
}
render() {
return (h("div", { key: 'ef0e6bacbfff0d771ffdf7d61c079d9a68297670', class: "illustration-message" }, h("kv-illustration", { key: '8a14a60ffaea67fabb4b505f2116ca21535dcb4d', name: this.illustration, class: "image", part: "illustration" }), h("div", { key: '0e4e4a900c82509a11bda981ea20bcf8a0e43ccb', class: "header", part: "header" }, this.header), this.description && (h("div", { key: '090e4a40ef55b9417c5648959caa1b5475ee560e', class: "description", part: "description" }, this.description))));
}
static get style() { return illustrationMessageCss; }
}, [257, "kv-illustration-message", {
"illustration": [513],
"header": [513],
"description": [513]
}]);
function defineCustomElement() {
if (typeof customElements === "undefined") {
return;
}
const components = ["kv-illustration-message", "kv-illustration"];
components.forEach(tagName => { switch (tagName) {
case "kv-illustration-message":
if (!customElements.get(tagName)) {
customElements.define(tagName, KvIllustrationMessage);
}
break;
case "kv-illustration":
if (!customElements.get(tagName)) {
defineCustomElement$1();
}
break;
} });
}
defineCustomElement();
export { KvIllustrationMessage as K, defineCustomElement as d };