@kelvininc/ui-components
Version:
Kelvin UI Components
60 lines (59 loc) • 5.64 kB
JavaScript
import { Host, h } from "@stencil/core";
import { getClassMap } from "../../../utils/css-class.helper";
/**
* @part illustration - The illustration container.
*/
export class KvNoResultsFound {
constructor() {
/** @inheritdoc */
this.customClass = '';
}
render() {
return (h(Host, { key: 'ad74ec03a74534f62b02e56dc599596517aa6eb1' }, h("svg", { key: '1aa42f0d9789b98eff728bd889e61e42d9895e64', 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: '2642471fe557369de9b8194b72245c4f88e4c7b7', cx: "58.768", cy: "42", r: "40", fill: "var(--illustrations-background, var(--color-gray-800, #262626))" }), h("mask", { key: 'ed5ae54511e0082bc76a91d10dfdfc20705a9cd4', id: "a", width: "81", height: "80", x: "18", y: "2", maskUnits: "userSpaceOnUse", style: { "mask-type": "alpha" } }, h("circle", { key: '54affc20650310ca779c08d173b0dfa781865586', cx: "58.768", cy: "42", r: "40", fill: "var(--illustrations-background, var(--color-gray-800, #262626))" })), h("g", { key: '455cd95f474588842cfb638c949b1b5e63f23b3b', mask: "url(#a)" }, h("path", { key: '423a8f6f1603326d8f88b7e3ced7169e5738f692', fill: "var(--illustrations-shape-tertiary, #1a1a1a)", d: "M85.396 86.11h3.663L77.788 34.403h-4.344L62.173 86.11h3.663l1.526-6.892H83.87zm-5.025-22.604h-9.534l1.832-8.285h5.847l1.832 8.285zm-2.653-11.998h-4.204l2.09-9.446 2.09 9.446zm-9.534 24.019 1.832-8.285h11.177l1.832 8.285H68.16z" }), h("path", { key: 'b9f882c45878c832e89030abdbde3051da7fdb65', fill: "var(--illustrations-shape-tertiary, #1a1a1a)", d: "m106.343 50-2 3.464-51.961-30 2-3.464z" }), h("path", { key: '26a3b4695922f60df957a8daaa3085f46bf9ab36', fill: "var(--illustrations-shape-secondary, #404040)", d: "M75.673 38c1.93 0 3.5-1.57 3.5-3.5s-1.57-3.5-3.5-3.5-3.5 1.57-3.5 3.5 1.57 3.5 3.5 3.5m-26.5 20h-1a1 1 0 0 0-1 1v5a1 1 0 0 0 1 1h1a1 1 0 0 0 1-1v-5a1 1 0 0 0-1-1" }), h("path", { key: '725cd13784126c1e07069757c66463c3380a68fa', fill: "var(--illustrations-shape-secondary, #404040)", d: "M49.173 34h-1v28h1z" }), h("rect", { key: '9df9973893c15eb922e111beaf07fafecf575d8e', width: "24", height: "6", x: "45.173", y: "33.785", fill: "var(--illustrations-shape-primary, #595959)", rx: "3", transform: "rotate(-60 45.173 33.785)" })), h("path", { key: '603a157b53e8291a627626dfd263b28ce59c7ed6', fill: "var(--illustrations-icon-secondary, #bfbfbf)", d: "m27.463 66.058 1.295-1.544 6.945 5.828-1.295 1.543z" }), h("rect", { key: '53989ac6b319db4d7928103a5f388a1005814531', width: "20.148", height: "6.044", x: "44.687", y: "83.142", fill: "var(--illustrations-accent-primary, #7c4dff)", rx: "3", transform: "rotate(-140 44.687 83.142)" }), h("path", { key: '035604eb969a7eec1ab6856c5870319a2880dcba', fill: "var(--illustrations-accent-secondary, #6933ff)", d: "m46.63 80.827-15.433-12.95c1.065-1.27 2.971-1.453 4.24-.388l10.838 9.094c1.27 1.065 1.42 2.975.356 4.244" }), h("g", { key: '552627ee8ad26467fd7968d01edaece703e11ee1', "fill-rule": "evenodd", "clip-rule": "evenodd" }, h("path", { key: '7412622039759dd04c860da1b3413ee510b013c9', fill: "var(--illustrations-icon-secondary, #bfbfbf)", d: "M27.995 65.2c4.96-5.91 4.188-14.721-1.722-19.68-5.91-4.96-14.72-4.188-19.68 1.721-4.959 5.91-4.188 14.721 1.722 19.68 5.91 4.96 14.721 4.189 19.68-1.721m1.646 1.381c5.723-6.819 4.833-16.986-1.986-22.708-6.82-5.721-16.986-4.832-22.708 1.987C-.775 52.68.115 62.846 6.934 68.568S23.92 73.4 29.642 66.58" }), h("path", { key: '16fb2d0e0b924f4a78aa7efc2b60a3c7487fb4e7', fill: "var(--illustrations-icon-primary, #e5e5e5)", d: "M26.349 63.819c4.196-5 3.543-12.456-1.457-16.653s-12.456-3.543-16.653 1.457C4.043 53.624 4.696 61.08 9.696 65.276c5.001 4.196 12.457 3.544 16.653-1.457m1.646 1.381c4.959-5.91 4.188-14.72-1.722-19.68s-14.72-4.188-19.68 1.722-4.188 14.72 1.722 19.68 14.72 4.188 19.68-1.722" })))));
}
static get is() { return "kv-no-results-found"; }
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": "''"
}
};
}
}