@everymatrix/casino-challenges-list 0.0.1

package/dist/esm/casino-challenges-list_2.entry.js

@@ -0,0 +1,179 @@
+export { C as casino_challenges_list } from './casino-challenges-list-d8eefa92.js';
+import { r as registerInstance, h, H as Host } from './index-e9d014fd.js';
+import '@everymatrix/casino-challenge-card';
+
+const uiSkeletonCss = ":host{display:block}.Skeleton{animation:skeleton-loading 1s linear infinite alternate}.Rectangle{background-color:var(--emw-skeleton-rectangle-background, #c2c2c2);width:var(--emw-skeleton-rectangle-width, 400px);height:var(--emw-skeleton-rectangle-height, 200px);border-radius:var(--emw-skeleton-rectangle-border-radius, 10px)}.Circle{background-color:var(--emw-skeleton-circle-background, #c2c2c2);width:var(--emw-skeleton-circle-size, 400px);height:var(--emw-skeleton-circle-size, 400px);border-radius:50%}.Text{background-color:var(--emw-skeleton-text-background, #c2c2c2);width:var(--emw-skeleton-text-width, 500px);height:var(--emw-skeleton-text-height, 20px);border-radius:var(--emw-skeleton-text-border-radius, 10px);margin-bottom:var(--emw-skeleton-text-margin-bottom, 5px)}.Text:last-child{width:calc(var(--emw-skeleton-text-width, 400px) - 100px)}.Title{background-color:var(--emw-skeleton-title-background, #c2c2c2);width:var(--emw-skeleton-title-width, 300px);height:var(--emw-skeleton-title-height, 30px);border-radius:var(--emw-skeleton-title-border-radius, 10px);margin-bottom:var(--emw-skeleton-title-margin-bottom, 5px)}.Image{background-color:var(--emw-skeleton-image-background, #c2c2c2);width:var(--emw-skeleton-image-width, 100%);height:var(--emw-skeleton-image-height, 100%);border-radius:var(--emw-skeleton-image-border-radius, unset)}.Logo{background-color:var(--emw-skeleton-logo-background, #c2c2c2);width:var(--emw-skeleton-logo-width, 120px);height:var(--emw-skeleton-logo-height, 75px);border-radius:var(--emw-skeleton-logo-border-radius, 10px)}@keyframes skeleton-loading{0%{background-color:var(--emw-skeleton-primary-color, #e0e0e0)}100%{background-color:var(--emw-skeleton-secondary-color, #f0f0f0)}}";
+const UiSkeletonStyle0 = uiSkeletonCss;
+
+const UiSkeleton = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        this.stylingValue = {
+            width: this.handleStylingProps(this.width),
+            height: this.handleStylingProps(this.height),
+            borderRadius: this.handleStylingProps(this.borderRadius),
+            marginBottom: this.handleStylingProps(this.marginBottom),
+            marginTop: this.handleStylingProps(this.marginTop),
+            marginLeft: this.handleStylingProps(this.marginLeft),
+            marginRight: this.handleStylingProps(this.marginRight),
+            size: this.handleStylingProps(this.size)
+        };
+        this.structure = undefined;
+        this.width = 'unset';
+        this.height = 'unset';
+        this.borderRadius = 'unset';
+        this.marginBottom = 'unset';
+        this.marginTop = 'unset';
+        this.marginLeft = 'unset';
+        this.marginRight = 'unset';
+        this.animation = true;
+        this.rows = 0;
+        this.size = '100%';
+    }
+    handleStructureChange(newValue, oldValue) {
+        if (oldValue !== newValue) {
+            this.handleStructure(newValue);
+        }
+    }
+    handleStylingProps(value) {
+        switch (typeof value) {
+            case 'number':
+                return value === 0 ? 0 : `${value}px`;
+            case 'undefined':
+                return 'unset';
+            case 'string':
+                if (['auto', 'unset', 'none', 'inherit', 'initial'].includes(value) ||
+                    value.endsWith('px') ||
+                    value.endsWith('%')) {
+                    return value;
+                }
+                else {
+                    return 'unset';
+                }
+            default:
+                return 'unset';
+        }
+    }
+    handleStructure(structure) {
+        switch (structure) {
+            case 'logo':
+                return this.renderLogo();
+            case 'image':
+                return this.renderImage();
+            case 'title':
+                return this.renderTitle();
+            case 'text':
+                return this.renderText();
+            case 'rectangle':
+                return this.renderRectangle();
+            case 'circle':
+                return this.renderCircle();
+            default:
+                return null;
+        }
+    }
+    renderLogo() {
+        return (h("div", { class: "SkeletonContainer" }, h("div", { class: 'Logo ' + (this.animation ? 'Skeleton' : '') })));
+    }
+    renderImage() {
+        return h("div", { class: 'Image ' + (this.animation ? 'Skeleton' : '') });
+    }
+    renderTitle() {
+        return (h("div", { class: "SkeletonContainer" }, h("div", { class: 'Title ' + (this.animation ? 'Skeleton' : '') })));
+    }
+    renderText() {
+        return (h("div", { class: "SkeletonContainer" }, Array.from({ length: this.rows > 0 ? this.rows : 1 }).map((_, index) => (h("div", { key: index, class: 'Text ' + (this.animation ? 'Skeleton' : '') })))));
+    }
+    renderRectangle() {
+        return (h("div", { class: "SkeletonContainer" }, h("div", { class: 'Rectangle ' + (this.animation ? 'Skeleton' : '') })));
+    }
+    renderCircle() {
+        return (h("div", { class: "SkeletonContainer" }, h("div", { class: 'Circle ' + (this.animation ? 'Skeleton' : '') })));
+    }
+    render() {
+        let styleBlock = '';
+        switch (this.structure) {
+            case 'logo':
+                styleBlock = `
+          :host {
+            --emw-skeleton-logo-width: ${this.stylingValue.width};
+            --emw-skeleton-logo-height: ${this.stylingValue.height};
+            --emw-skeleton-logo-border-radius: ${this.stylingValue.borderRadius};
+            --emw-skeleton-logo-margin-bottom: ${this.stylingValue.marginBottom};
+            --emw-skeleton-logo-margin-top: ${this.stylingValue.marginTop};
+            --emw-skeleton-logo-margin-left: ${this.stylingValue.marginLeft};
+            --emw-skeleton-logo-margin-right: ${this.stylingValue.marginRight};
+          }
+        `;
+                break;
+            case 'image':
+                styleBlock = `
+          :host {
+            --emw-skeleton-image-width: ${this.stylingValue.width};
+            --emw-skeleton-image-height: ${this.stylingValue.height};
+            --emw-skeleton-image-border-radius: ${this.stylingValue.borderRadius};
+            --emw-skeleton-image-margin-bottom: ${this.stylingValue.marginBottom};
+            --emw-skeleton-image-margin-top: ${this.stylingValue.marginTop};
+            --emw-skeleton-image-margin-left: ${this.stylingValue.marginLeft};
+            --emw-skeleton-image-margin-right: ${this.stylingValue.marginRight};
+          }
+        `;
+                break;
+            case 'title':
+                styleBlock = `
+          :host {
+            --emw-skeleton-title-width: ${this.stylingValue.width};
+            --emw-skeleton-title-height: ${this.stylingValue.height};
+            --emw-skeleton-title-border-radius: ${this.stylingValue.borderRadius};
+            --emw-skeleton-title-margin-bottom: ${this.stylingValue.marginBottom};
+            --emw-skeleton-title-margin-top: ${this.stylingValue.marginTop};
+            --emw-skeleton-title-margin-left: ${this.stylingValue.marginLeft};
+            --emw-skeleton-title-margin-right: ${this.stylingValue.marginRight};
+          }
+        `;
+                break;
+            case 'text':
+                styleBlock = `
+          :host {
+            --emw-skeleton-text-width: ${this.stylingValue.width};
+            --emw-skeleton-text-height: ${this.stylingValue.height};
+            --emw-skeleton-text-border-radius: ${this.stylingValue.borderRadius};
+            --emw-skeleton-text-margin-bottom: ${this.stylingValue.marginBottom};
+            --emw-skeleton-text-margin-top: ${this.stylingValue.marginTop};
+            --emw-skeleton-text-margin-left: ${this.stylingValue.marginLeft};
+            --emw-skeleton-text-margin-right: ${this.stylingValue.marginRight};
+          }
+        `;
+                break;
+            case 'rectangle':
+                styleBlock = `
+          :host {
+            --emw-skeleton-rectangle-width: ${this.stylingValue.width};
+            --emw-skeleton-rectangle-height: ${this.stylingValue.height};
+            --emw-skeleton-rectangle-border-radius: ${this.stylingValue.borderRadius};
+            --emw-skeleton-rectangle-margin-bottom: ${this.stylingValue.marginBottom};
+            --emw-skeleton-rectangle-margin-top: ${this.stylingValue.marginTop};
+            --emw-skeleton-rectangle-margin-left: ${this.stylingValue.marginLeft};
+            --emw-skeleton-rectangle-margin-right: ${this.stylingValue.marginRight};
+          }
+        `;
+                break;
+            case 'circle':
+                styleBlock = `
+          :host {
+            --emw-skeleton-circle-size: ${this.stylingValue.size};
+          }
+        `;
+                break;
+            default:
+                styleBlock = '';
+        }
+        return (h(Host, { key: 'e6b885bfd985ce7663d990756fe9101e25eb97f0' }, h("style", { key: '06ae24c7bb74f4dacfc12ae58085333f9dc89da5' }, styleBlock), this.handleStructure(this.structure)));
+    }
+    static get watchers() { return {
+        "structure": ["handleStructureChange"]
+    }; }
+};
+UiSkeleton.style = UiSkeletonStyle0;
+
+export { UiSkeleton as ui_skeleton };