@everymatrix/casino-engagement-suite-progress-bar 1.0.69

package/dist/cjs/index.cjs.js

@@ -0,0 +1,2 @@
+'use strict';
+

package/dist/cjs/loader.cjs.js

@@ -0,0 +1,15 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+const index = require('./index-e420537d.js');
+const appGlobals = require('./app-globals-3a1e7e63.js');
+
+const defineCustomElements = async (win, options) => {
+  if (typeof window === 'undefined') return undefined;
+  await appGlobals.globalScripts();
+  return index.bootstrapLazy([["casino-engagement-suite-progress-bar.cjs",[[1,"casino-engagement-suite-progress-bar",{"value":[2],"disabled":[4],"hidePercent":[4,"hide-percent"],"indeterminate":[4],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"limitStylingAppends":[32]}]]]], options);
+};
+
+exports.setNonce = index.setNonce;
+exports.defineCustomElements = defineCustomElements;

package/dist/collection/collection-manifest.json

@@ -0,0 +1,12 @@
+{
+  "entries": [
+    "components/casino-engagement-suite-progress-bar/casino-engagement-suite-progress-bar.js"
+  ],
+  "compiler": {
+    "name": "@stencil/core",
+    "version": "4.20.0",
+    "typescriptVersion": "5.5.3"
+  },
+  "collections": [],
+  "bundles": []
+}

package/dist/collection/components/casino-engagement-suite-progress-bar/casino-engagement-suite-progress-bar.css

@@ -0,0 +1,57 @@
+:host {
+  display: block;
+  font-family: inherit;
+}
+
+:host(.Desktop) .ProgressBarPercent {
+  font-size: 14px;
+  line-height: 14px;
+}
+
+.ProgressBarBackground {
+  height: 8px;
+  background-color: var(--emw--color-background, #666178);
+  border-radius: 4px;
+  position: relative;
+}
+
+.ProgressBarLine {
+  position: absolute;
+  left: 0;
+  top: 0;
+  bottom: 0;
+  border-radius: 4px;
+  background: linear-gradient(98.25deg, #FF9400 22.48%, #FEF746 131.02%, #FFE24A 131.9%);
+  transition: width ease-out 0.3s;
+}
+
+.ProgressBarInfo {
+  margin-bottom: 8px;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+}
+
+.ProgressBarPercent {
+  font-weight: 700;
+  font-size: 12px;
+  line-height: 12px;
+}
+
+.HidePercent .ProgressBarPercent {
+  display: none;
+}
+
+.ProgressBar:not(.Disabled) .ProgressBarPercent {
+  background: linear-gradient(98.25deg, #FF9400 22.48%, #FEF746 131.02%, #FFE24A 131.9%);
+  -webkit-background-clip: text;
+  background-clip: text;
+  -webkit-text-fill-color: transparent;
+}
+
+.ProgressBar.Disabled .ProgressBarPercent {
+  color: var(--emw--color-background, #666178);
+}
+.ProgressBar.Disabled .ProgressBarLine {
+  background: var(--emw--color-background-secondary, #474668);
+}

package/dist/collection/components/casino-engagement-suite-progress-bar/casino-engagement-suite-progress-bar.js

@@ -0,0 +1,188 @@
+import { h } from "@stencil/core";
+export class CasinoEngagementSuiteProgressBar {
+    constructor() {
+        this.setClientStyling = () => {
+            let sheet = document.createElement('style');
+            sheet.innerHTML = this.clientStyling;
+            this.host.prepend(sheet);
+        };
+        this.setClientStylingURL = () => {
+            let url = new URL(this.clientStylingUrl);
+            let cssFile = document.createElement('style');
+            fetch(url.href)
+                .then((res) => res.text())
+                .then((data) => {
+                cssFile.innerHTML = data;
+                setTimeout(() => { this.host.prepend(cssFile); }, 1);
+            })
+                .catch((err) => {
+                console.log('Error ', err);
+            });
+        };
+        this.value = 0;
+        this.disabled = false;
+        this.hidePercent = false;
+        this.indeterminate = false;
+        this.clientStyling = '';
+        this.clientStylingUrl = '';
+        this.limitStylingAppends = false;
+    }
+    componentDidRender() {
+        if (!this.limitStylingAppends && this.host) {
+            if (this.clientStyling)
+                this.setClientStyling();
+            if (this.clientStylingUrl)
+                this.setClientStylingURL();
+            this.limitStylingAppends = true;
+        }
+    }
+    getProgressBarClasses() {
+        return {
+            ProgressBar: true,
+            Completed: this.value === 100,
+            Disabled: this.disabled,
+            HidePercent: this.hidePercent || this.indeterminate
+        };
+    }
+    getProgressBarLineTemplate() {
+        if (this.indeterminate) {
+            return h("div", { class: "ProgressBarLine Indeterminate", part: "ProgressBarLine Indeterminate" });
+        }
+        else {
+            return h("div", { class: "ProgressBarLine", part: "ProgressBarLine", style: { width: this.value + '%' } });
+        }
+    }
+    render() {
+        return h("div", { key: 'ecce3a26a92d2e090c1db84bdc1bdbeb505080ed', class: this.getProgressBarClasses(), part: "ProgressBar" }, h("div", { key: '649fe1103d222200f2a1ad3b5967e37da1f1ab3d', class: "ProgressBarInfo", part: "ProgressBarInfo" }, h("slot", { key: '49dc180eedd823f0027f75099813fb9d91bcd938', name: "Title" }, h("div", { key: 'e6e59da3fe7bbcb37e118e7fd23a8ff35587aca5' })), h("slot", { key: '3dc8e5fd1dbc8c268b9c76e393b751cb53605e7e', name: "Percent" }, h("div", { key: '6a9e880f3ee3c4f26e8577c69be5db5f8e2d10ad', class: "ProgressBarPercent", part: "ProgressBarPercent" }, this.value, "%"))), h("div", { key: '141106e77caad7b04bb199f911e87c0c6f0adc2d', class: "ProgressBarBackground", part: "ProgressBarBackground" }, this.getProgressBarLineTemplate()));
+    }
+    static get is() { return "casino-engagement-suite-progress-bar"; }
+    static get encapsulation() { return "shadow"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["casino-engagement-suite-progress-bar.scss"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["casino-engagement-suite-progress-bar.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "value": {
+                "type": "number",
+                "mutable": false,
+                "complexType": {
+                    "original": "number",
+                    "resolved": "number",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Value for the widget"
+                },
+                "attribute": "value",
+                "reflect": false,
+                "defaultValue": "0"
+            },
+            "disabled": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Shows disabled styles"
+                },
+                "attribute": "disabled",
+                "reflect": false,
+                "defaultValue": "false"
+            },
+            "hidePercent": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Hide percent value"
+                },
+                "attribute": "hide-percent",
+                "reflect": false,
+                "defaultValue": "false"
+            },
+            "indeterminate": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Constantly animates"
+                },
+                "attribute": "indeterminate",
+                "reflect": false,
+                "defaultValue": "false"
+            },
+            "clientStyling": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Client custom styling via string"
+                },
+                "attribute": "client-styling",
+                "reflect": true,
+                "defaultValue": "''"
+            },
+            "clientStylingUrl": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Client custom styling via url"
+                },
+                "attribute": "client-styling-url",
+                "reflect": true,
+                "defaultValue": "''"
+            }
+        };
+    }
+    static get states() {
+        return {
+            "limitStylingAppends": {}
+        };
+    }
+    static get elementRef() { return "host"; }
+}

package/dist/collection/components/casino-engagement-suite-progress-bar/index.js

@@ -0,0 +1 @@
+export { CasinoEngagementSuiteProgressBar } from './casino-engagement-suite-progress-bar';

package/dist/collection/index.js

@@ -0,0 +1 @@
+export * from './components';

package/dist/collection/utils/utils.js

@@ -0,0 +1,3 @@
+export function format(first, middle, last) {
+    return (first || '') + (middle ? ` ${middle}` : '') + (last ? ` ${last}` : '');
+}

package/dist/esm/app-globals-0f993ce5.js

@@ -0,0 +1,3 @@
+const globalScripts = () => {};
+
+export { globalScripts as g };

package/dist/esm/casino-engagement-suite-progress-bar.entry.js

@@ -0,0 +1,67 @@
+import { r as registerInstance, h, g as getElement } from './index-f0b13670.js';
+
+const casinoEngagementSuiteProgressBarCss = ":host{display:block;font-family:inherit}:host(.Desktop) .ProgressBarPercent{font-size:14px;line-height:14px}.ProgressBarBackground{height:8px;background-color:var(--emw--color-background, #666178);border-radius:4px;position:relative}.ProgressBarLine{position:absolute;left:0;top:0;bottom:0;border-radius:4px;background:linear-gradient(98.25deg, #FF9400 22.48%, #FEF746 131.02%, #FFE24A 131.9%);transition:width ease-out 0.3s}.ProgressBarInfo{margin-bottom:8px;display:flex;justify-content:space-between;align-items:center}.ProgressBarPercent{font-weight:700;font-size:12px;line-height:12px}.HidePercent .ProgressBarPercent{display:none}.ProgressBar:not(.Disabled) .ProgressBarPercent{background:linear-gradient(98.25deg, #FF9400 22.48%, #FEF746 131.02%, #FFE24A 131.9%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}.ProgressBar.Disabled .ProgressBarPercent{color:var(--emw--color-background, #666178)}.ProgressBar.Disabled .ProgressBarLine{background:var(--emw--color-background-secondary, #474668)}";
+const CasinoEngagementSuiteProgressBarStyle0 = casinoEngagementSuiteProgressBarCss;
+
+const CasinoEngagementSuiteProgressBar = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        this.setClientStyling = () => {
+            let sheet = document.createElement('style');
+            sheet.innerHTML = this.clientStyling;
+            this.host.prepend(sheet);
+        };
+        this.setClientStylingURL = () => {
+            let url = new URL(this.clientStylingUrl);
+            let cssFile = document.createElement('style');
+            fetch(url.href)
+                .then((res) => res.text())
+                .then((data) => {
+                cssFile.innerHTML = data;
+                setTimeout(() => { this.host.prepend(cssFile); }, 1);
+            })
+                .catch((err) => {
+                console.log('Error ', err);
+            });
+        };
+        this.value = 0;
+        this.disabled = false;
+        this.hidePercent = false;
+        this.indeterminate = false;
+        this.clientStyling = '';
+        this.clientStylingUrl = '';
+        this.limitStylingAppends = false;
+    }
+    componentDidRender() {
+        if (!this.limitStylingAppends && this.host) {
+            if (this.clientStyling)
+                this.setClientStyling();
+            if (this.clientStylingUrl)
+                this.setClientStylingURL();
+            this.limitStylingAppends = true;
+        }
+    }
+    getProgressBarClasses() {
+        return {
+            ProgressBar: true,
+            Completed: this.value === 100,
+            Disabled: this.disabled,
+            HidePercent: this.hidePercent || this.indeterminate
+        };
+    }
+    getProgressBarLineTemplate() {
+        if (this.indeterminate) {
+            return h("div", { class: "ProgressBarLine Indeterminate", part: "ProgressBarLine Indeterminate" });
+        }
+        else {
+            return h("div", { class: "ProgressBarLine", part: "ProgressBarLine", style: { width: this.value + '%' } });
+        }
+    }
+    render() {
+        return h("div", { key: 'ecce3a26a92d2e090c1db84bdc1bdbeb505080ed', class: this.getProgressBarClasses(), part: "ProgressBar" }, h("div", { key: '649fe1103d222200f2a1ad3b5967e37da1f1ab3d', class: "ProgressBarInfo", part: "ProgressBarInfo" }, h("slot", { key: '49dc180eedd823f0027f75099813fb9d91bcd938', name: "Title" }, h("div", { key: 'e6e59da3fe7bbcb37e118e7fd23a8ff35587aca5' })), h("slot", { key: '3dc8e5fd1dbc8c268b9c76e393b751cb53605e7e', name: "Percent" }, h("div", { key: '6a9e880f3ee3c4f26e8577c69be5db5f8e2d10ad', class: "ProgressBarPercent", part: "ProgressBarPercent" }, this.value, "%"))), h("div", { key: '141106e77caad7b04bb199f911e87c0c6f0adc2d', class: "ProgressBarBackground", part: "ProgressBarBackground" }, this.getProgressBarLineTemplate()));
+    }
+    get host() { return getElement(this); }
+};
+CasinoEngagementSuiteProgressBar.style = CasinoEngagementSuiteProgressBarStyle0;
+
+export { CasinoEngagementSuiteProgressBar as casino_engagement_suite_progress_bar };

package/dist/esm/casino-engagement-suite-progress-bar.js

@@ -0,0 +1,20 @@
+import { p as promiseResolve, b as bootstrapLazy } from './index-f0b13670.js';
+export { s as setNonce } from './index-f0b13670.js';
+import { g as globalScripts } from './app-globals-0f993ce5.js';
+
+/*
+ Stencil Client Patch Browser v4.20.0 | MIT Licensed | https://stenciljs.com
+ */
+var patchBrowser = () => {
+  const importMeta = import.meta.url;
+  const opts = {};
+  if (importMeta !== "") {
+    opts.resourcesUrl = new URL(".", importMeta).href;
+  }
+  return promiseResolve(opts);
+};
+
+patchBrowser().then(async (options) => {
+  await globalScripts();
+  return bootstrapLazy([["casino-engagement-suite-progress-bar",[[1,"casino-engagement-suite-progress-bar",{"value":[2],"disabled":[4],"hidePercent":[4,"hide-percent"],"indeterminate":[4],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"limitStylingAppends":[32]}]]]], options);
+});