@ebrains/components 0.9.2-beta → 0.9.3-beta

package/dist/components/eds-card-tool.js

@@ -0,0 +1,137 @@
+import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client';
+import { s as sendAnalytics } from './analytics.js';
+import { d as defineCustomElement$6 } from './eds-avatar2.js';
+import { d as defineCustomElement$5 } from './eds-card-desc2.js';
+import { d as defineCustomElement$4 } from './eds-card-title2.js';
+import { d as defineCustomElement$3 } from './eds-img2.js';
+import { d as defineCustomElement$2 } from './eds-tag2.js';
+
+const edsCardToolCss = ".h-auto{height:auto}.h-full{height:100%}.\\!min-h-20{min-height:1.25rem !important}.min-h-120{min-height:120px}.min-h-156{min-height:156px}.bg-default{background-color:var(--grey-200)}.bg-inverse{background-color:var(--white)}.effect-shadow{transition-property:box-shadow;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:300ms;transition-timing-function:cubic-bezier(0, 0, 0.2, 1)}.hover\\:shadow-hover:hover{--tw-shadow:0px 0px 16px rgba(0, 0, 0, 0.2);--tw-shadow-colored:0px 0px 16px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}.cursor-pointer{cursor:pointer}.border-soft{border-color:rgba(0, 0, 0, .15 )}.border-softer{border:2px solid rgba(0, 0, 0, .1 )}.effect-focus-within{outline-width:3px;outline-offset:2px;outline-color:var(--green-500)}.effect-focus-within:focus-within{outline-style:solid}.fixed{position:fixed}.absolute{position:absolute}.relative{position:relative}.inline{display:inline}.flex{display:flex}.inline-flex{display:inline-flex}.grow{flex-grow:1}.flex-col{flex-direction:column}.rounded-lg{border-radius:16px}.border-2{border-width:2px}.p-12{padding:0.75rem}.p-16{padding:1rem}.mt-6{margin-top:0.375rem}.mt-8{margin-top:0.5rem}.gap-y-4{row-gap:0.25rem}.order-first{order:-9999}.mb-10{margin-bottom:0.625rem}.mb-12{margin-bottom:0.75rem}";
+const EdsCardToolStyle0 = edsCardToolCss;
+
+const EdsCardTool$1 = /*@__PURE__*/ proxyCustomElement(class EdsCardTool extends HTMLElement {
+    constructor() {
+        super();
+        this.__registerHost();
+        this.__attachShadow();
+        this.cardTitle = undefined;
+        this.url = undefined;
+        this.description = undefined;
+        this.image = undefined;
+        this.avatar = undefined;
+        this.shortAbbreviation = undefined;
+        this.headingLevel = 'h5';
+        this.tags = '';
+        this.tiny = false;
+        this.bg = true;
+        this.withHover = true;
+        this.external = false;
+        this.hierarchy = true;
+    }
+    /**
+     * Parses the `tags` prop into an array of link objects.
+     * Returns an empty array if parsing fails or if `tags` is not a valid JSON string or object.
+     *
+     * @returns {any[]} Array of parsed link objects
+     */
+    get parsedTags() {
+        if (typeof this.tags === 'object') {
+            return this.tags;
+        }
+        else if (typeof this.tags === 'string') {
+            try {
+                return JSON.parse(this.tags);
+            }
+            catch (e) {
+                // eslint-disable-next-line
+                console.error('Error parsing links prop:', e);
+                return [];
+            }
+        }
+        return [];
+    }
+    componentWillLoad() { }
+    parseTags() {
+        return this.tags.split(',');
+    }
+    articleClasses() {
+        return [
+            this.tiny ? 'min-h-120' : 'min-h-156',
+            this.bg ? 'bg-inverse' : 'bg-default',
+            this.withHover ? 'effect-shadow hover:shadow-hover cursor-pointer' : '',
+            'border-softer effect-focus-within relative flex grow flex-col rounded-lg border-2 p-16'
+        ].join(' ');
+    }
+    handleClick() {
+        var _a;
+        //event.preventDefault();
+        sendAnalytics({
+            category: 'ui-component',
+            tag: this.el.tagName.toLowerCase(),
+            name: ((_a = this.cardTitle) === null || _a === void 0 ? void 0 : _a.toLowerCase()) || '',
+            action: 'click'
+        });
+    }
+    render() {
+        return (h("article", { key: '92103cb449fbdfd41adaeb29053746fb652a5203', class: `${this.el.tagName.toLowerCase()} ${this.articleClasses()}`, onClick: () => this.handleClick() }, h("eds-card-title", { key: '8aebade7b0cfe5ac529ff552113509314ffa4061', "heading-level": this.headingLevel, titleClass: this.image ? 'f-ui-01' : undefined, "card-title": this.cardTitle, url: this.url, "external-link": this.external, hierarchy: this.hierarchy }), this.description && (h("eds-card-desc", { key: '38abb7a59054c6fce836322c26eab77bb508845f', class: "mt-8", "truncate-lines": "3", description: this.description })), this.image ? (h("eds-img", { src: this.image, alt: "Sample Image", width: 200, height: 150 })) : this.avatar || this.shortAbbreviation ? (h("eds-avatar", { class: "order-first mb-12", picture: this.avatar, initials: this.shortAbbreviation })) : null, h("div", { key: '99158cab0d83e64bf9c45e00c06572efe7328516', class: "flex flex-wrap gap-y-4" }, this.parsedTags.map((tag, index) => (h("eds-tag", { key: index, intent: tag.style, label: tag.label }))))));
+    }
+    get el() { return this; }
+    static get style() { return EdsCardToolStyle0; }
+}, [1, "eds-card-tool", {
+        "cardTitle": [1, "card-title"],
+        "url": [1],
+        "description": [1],
+        "image": [8],
+        "avatar": [1],
+        "shortAbbreviation": [1, "short-abbreviation"],
+        "headingLevel": [1, "heading-level"],
+        "tags": [8],
+        "tiny": [4],
+        "bg": [4],
+        "withHover": [4, "with-hover"],
+        "external": [4],
+        "hierarchy": [4]
+    }]);
+function defineCustomElement$1() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["eds-card-tool", "eds-avatar", "eds-card-desc", "eds-card-title", "eds-img", "eds-tag"];
+    components.forEach(tagName => { switch (tagName) {
+        case "eds-card-tool":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, EdsCardTool$1);
+            }
+            break;
+        case "eds-avatar":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$6();
+            }
+            break;
+        case "eds-card-desc":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$5();
+            }
+            break;
+        case "eds-card-title":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$4();
+            }
+            break;
+        case "eds-img":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$3();
+            }
+            break;
+        case "eds-tag":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$2();
+            }
+            break;
+    } });
+}
+
+const EdsCardTool = EdsCardTool$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { EdsCardTool, defineCustomElement };

package/dist/components/eds-card-wrapper.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface EdsCardWrapper extends Components.EdsCardWrapper, HTMLElement {}
+export const EdsCardWrapper: {
+    prototype: EdsCardWrapper;
+    new (): EdsCardWrapper;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/components/eds-card-wrapper.js

@@ -0,0 +1,49 @@
+import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client';
+
+const EdsCardWrapper$1 = /*@__PURE__*/ proxyCustomElement(class EdsCardWrapper extends HTMLElement {
+    constructor() {
+        super();
+        this.__registerHost();
+        this.tiny = false;
+        this.withBg = true;
+        this.withHover = true;
+    }
+    hasSlot(name) {
+        if (name) {
+            return !!this.el.querySelector(`[slot="${name}"]`);
+        }
+        return !!this.el.querySelector(':not([slot])');
+    }
+    render() {
+        const articleClasses = [
+            this.tiny ? 'min-h-120' : 'min-h-156',
+            this.withBg ? 'bg-inverse' : 'bg-default',
+            this.withHover ? 'effect-shadow hover:shadow-hover cursor-pointer' : '',
+            'border-softer effect-focus-within relative flex grow flex-col rounded-lg border-2 p-16'
+        ].join(' ');
+        return (h("article", { key: '7a191039487c388e752c964c8fd47fb397943994', class: articleClasses }, h("slot", { key: 'ac497c9f36089467abcb6b52e3e356405616dfd6' }), this.hasSlot('footer') && (h("div", { key: 'eba2425d01514dffa83ec4b4fdfe1878719addd8', class: "mt-auto" }, h("slot", { key: '57f799838be78cdc8b61b9071d68f913b8eef51b', name: "footer" })))));
+    }
+    get el() { return this; }
+}, [4, "eds-card-wrapper", {
+        "tiny": [4],
+        "withBg": [4, "with-bg"],
+        "withHover": [4, "with-hover"]
+    }]);
+function defineCustomElement$1() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["eds-card-wrapper"];
+    components.forEach(tagName => { switch (tagName) {
+        case "eds-card-wrapper":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, EdsCardWrapper$1);
+            }
+            break;
+    } });
+}
+
+const EdsCardWrapper = EdsCardWrapper$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { EdsCardWrapper, defineCustomElement };

package/dist/components/eds-code-block.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface EdsCodeBlock extends Components.EdsCodeBlock, HTMLElement {}
+export const EdsCodeBlock: {
+    prototype: EdsCodeBlock;
+    new (): EdsCodeBlock;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/components/eds-code-block.js

@@ -0,0 +1,6 @@
+import { E as EdsCodeBlock$1, d as defineCustomElement$1 } from './eds-code-block2.js';
+
+const EdsCodeBlock = EdsCodeBlock$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { EdsCodeBlock, defineCustomElement };