@kelvininc/ui-components
Version:
Kelvin UI Components
60 lines (59 loc) • 5.46 kB
JavaScript
import { Host, h } from "@stencil/core";
import { getClassMap } from "../../../utils/css-class.helper";
/**
* @part illustration - The illustration container.
*/
export class KvNoContentHere {
constructor() {
/** @inheritdoc */
this.customClass = '';
}
render() {
return (h(Host, { key: 'cb22607f63ce7221a3b62299d59d7b60c004b715' }, h("svg", { key: '18da90497bdb06e23c5e8a956209ee6d51e3ca04', part: "illustration", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 100 86", fill: "none", class: Object.assign(Object.assign({}, getClassMap(this.customClass)), { illustration: true }) }, h("circle", { key: '0d17c5bd6bd0b38f34ad954b0a8b216faa01db05', cx: "56.5", cy: "43", r: "40", fill: "var(--illustrations-background, #262626)" }), h("mask", { key: 'a1368c5f1a636a497c49bfee99b7d56ec672116b', id: "a", width: "81", height: "80", x: "16", y: "3", maskUnits: "userSpaceOnUse", style: { "mask-type": "alpha" } }, h("circle", { key: 'f3cbab07c19b2919d976b72d014f18ceab175bdc', cx: "56.5", cy: "43", r: "40", fill: "var(--illustrations-background, #262626)" })), h("g", { key: '1cc4124ecd9d4215521469e4385197a2b2ce88c9', mask: "url(#a)" }, h("path", { key: '2dfd3a7fb16e2a1490cdecca1e63f20455d92ede', fill: "var(--illustrations-shape-secondary, #404040)", d: "M86.5 33h-60v54h60z" }), h("path", { key: '34ab8c7002f4152f73fd15109dfc55004cefd831', fill: "var(--illustrations-shape-primary, #595959)", d: "M87.5 33h-62v3h62z" }), h("path", { key: 'ecf0128ccad68eb42387e44f90840b1a00ab4c47', fill: "var(--illustrations-shape-tertiary, #1a1a1a)", d: "M81.5 60v-2h-10v2z" }), h("g", { key: '035bbe4df309e8f740a7d1bef3b2b2a02e653590', fill: "var(--illustrations-shape-tertiary, #1a1a1a)" }, h("path", { key: '6f639a894fbf255f1183ce883172696643c6306f', d: "M72.451 32.925h-1.95v58.15h1.95zm10.049 0h-1.95v58.15h1.95z" }), h("path", { key: 'e7ba27e7bf29a08b41577db2fa02c21b2a8efad5', d: "M82 74v-2H72v2zm-.5-7v-2h-10v2zm0-14v-2h-10v2zm0-7v-2h-10v2zm0-7v-2h-10v2z" })), h("path", { key: '0ee35c72d6b5eb2cb59b626ec33aabb6ffc23ade', fill: "var(--illustrations-shape-primary, #595959)", d: "M48.782 58.283c1.426-4.818 7.104-13.547 7.463-13.547s6.045 8.729 7.462 13.547c1.474 4.978-3.089 9.267-7.462 9.267-4.374 0-8.937-4.29-7.463-9.267" }), h("path", { key: '3f1d122974a460167cec569cb1d5db6ff6218e04', fill: "var(--illustrations-shape-secondary, #404040)", d: "M63.5 31h-13v2h13z" }), h("path", { key: 'd9351e08d0bbdc3b87ea4107a7cbf1e63b9635a9', fill: "var(--illustrations-shape-primary, #595959)", d: "M65.5 30h-17v1h17z" })), h("path", { key: '74e38789c46b819bb5e0ec4520a9185edad2fdf1', fill: "var(--illustrations-accent-primary, #7c4dff)", d: "M13.402 57.8V83h5.4V57.8z" }), h("path", { key: '43f04ecbeaf8d30689726fee853d227e7de41c07', fill: "var(--illustrations-accent-secondary, #6933ff)", d: "M13.402 61.58v17.64h2.7V61.58z" }), h("path", { key: '69cbbb949411d57b838def3402319f68498d8277', fill: "var(--illustrations-accent-primary, #7c4dff)", d: "M24.201 57.8V83h5.4V57.8z" }), h("path", { key: 'e26d7f4f5f22e2950eb64d34fd88f0a21434fde9', fill: "var(--illustrations-accent-secondary, #6933ff)", d: "M24.201 61.58v17.64h2.7V61.58z" }), h("path", { key: '5f2564a91b1227899274e53c8e08ea2e1218fbfc', fill: "var(--illustrations-icon-secondary, #bfbfbf)", d: "M39.5 57.421h-36v5.684h36z" }), h("path", { key: 'ab9daa47dc8b9e144969ac1e478fe39e5ae5a56a', fill: "var(--illustrations-icon-primary, #e5e5e5)", d: "M36.658 57.421H5.395v2.842h31.263z" }), h("path", { key: 'd62330726c13ee4581d00e75930cae1d1e779b1d', fill: "var(--illustrations-icon-primary, #e5e5e5)", "fill-rule": "evenodd", d: "M6.2 83a2.7 2.7 0 0 1-2.7-2.7V49.7A2.7 2.7 0 0 1 6.2 47h30.6a2.7 2.7 0 0 1 2.7 2.7v30.6a2.7 2.7 0 0 1-2.7 2.7zm29.51-3.79V50.79H7.29v28.42z", "clip-rule": "evenodd" }))));
}
static get is() { return "kv-no-content-here"; }
static get encapsulation() { return "shadow"; }
static get originalStyleUrls() {
return {
"$": ["../../../illustrations/illustrations.scss"]
};
}
static get styleUrls() {
return {
"$": ["../../../illustrations/illustrations.css"]
};
}
static get properties() {
return {
"customClass": {
"type": "string",
"attribute": "custom-class",
"mutable": false,
"complexType": {
"original": "CustomCssClass",
"resolved": "CssClassMap | string | string[]",
"references": {
"CustomCssClass": {
"location": "import",
"path": "../../../types",
"id": "src/types.ts::CustomCssClass"
}
}
},
"required": false,
"optional": false,
"docs": {
"tags": [{
"name": "inheritdoc",
"text": undefined
}],
"text": "(optional) Additional classes to apply for custom CSS. If multiple classes are\nprovided they should be separated by spaces. It is also valid to provide\nCssClassMap with boolean logic."
},
"getter": false,
"setter": false,
"reflect": true,
"defaultValue": "''"
}
};
}
}