@everymatrix/lottery-tipping-bullet-group 0.0.1

package/dist/collection/components/lottery-tipping-bullet-group/lottery-tipping-bullet-group.js

@@ -0,0 +1,275 @@
+import { h } from "@stencil/core";
+import { setClientStyling, setClientStylingURL, setStreamStyling } from "../../../../../../../../libs/common/src/styling/index";
+export class LotteryTippingBulletGroup {
+    constructor() {
+        this.mbSource = undefined;
+        this.clientStyling = undefined;
+        this.clientStylingUrl = undefined;
+        this.positionIdx = undefined;
+        this.theme = 'default';
+        this.mode = 'single';
+        this.bulletConfigContent = '';
+    }
+    get bulletConfigArr() {
+        const defaultConfig = [
+            {
+                value: '1'
+            },
+            {
+                value: 'X'
+            },
+            {
+                value: '2'
+            }
+        ];
+        if (typeof this.bulletConfigContent === 'string' && this.bulletConfigContent) {
+            try {
+                const _temp = JSON.parse(this.bulletConfigContent);
+                return _temp;
+            }
+            catch (e) {
+                console.error('Error parsing bulletConfigContent:', e);
+                return defaultConfig;
+            }
+        }
+        else {
+            return defaultConfig;
+        }
+    }
+    handleClientStylingChange(newValue, oldValue) {
+        if (newValue != oldValue) {
+            setClientStyling(this.stylingContainer, this.clientStyling);
+        }
+    }
+    handleClientStylingUrlChange(newValue, oldValue) {
+        if (newValue != oldValue) {
+            setClientStylingURL(this.stylingContainer, this.clientStylingUrl);
+        }
+    }
+    handleMbSourceChange(newValue, oldValue) {
+        if (newValue != oldValue) {
+            setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
+        }
+    }
+    componentDidLoad() {
+        if (this.stylingContainer) {
+            if (this.mbSource)
+                setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
+            if (this.clientStyling)
+                setClientStyling(this.stylingContainer, this.clientStyling);
+            if (this.clientStylingUrl)
+                setClientStylingURL(this.stylingContainer, this.clientStylingUrl);
+        }
+    }
+    disconnectedCallback() {
+        this.stylingSubscription && this.stylingSubscription.unsubscribe();
+    }
+    lotteryTippingBulletSelectionHandler(event) {
+        const { positionIdx } = event.detail;
+        this.handleToggle(positionIdx);
+    }
+    handleToggle(index) {
+        let newConfigArr = [...this.bulletConfigArr];
+        if (this.mode === 'single') {
+            // single mode: only one button can be selected
+            newConfigArr = newConfigArr.map((item) => (Object.assign(Object.assign({}, item), { isSelected: false })));
+            newConfigArr[index].isSelected = true;
+        }
+        else {
+            // multi mode: multiple buttons can be selected
+            newConfigArr = newConfigArr.map((item) => (Object.assign({}, item)));
+            newConfigArr[index].isSelected = !newConfigArr[index].isSelected;
+        }
+        this.lotteryTippingBulletGroupToggleEvent.emit({
+            bulletConfigArr: newConfigArr,
+            positionIdx: this.positionIdx + '-' + index
+        });
+    }
+    render() {
+        var _a;
+        return (h("div", { ref: (el) => (this.stylingContainer = el), key: this.positionIdx }, h("div", { key: '68223022eed831932c571378164be913206d98e9', style: { display: 'flex', flexDirection: 'row', gap: '10px' } }, (_a = this.bulletConfigArr) === null || _a === void 0 ? void 0 : _a.map((item, index) => (h("div", { key: index }, h("lottery-tipping-bullet", { value: item.value, isSelected: item.isSelected, "position-idx": index, disabled: item.disabled, theme: this.theme, clientStyling: this.clientStyling, clientStylingUrl: this.clientStylingUrl, mbSource: this.mbSource })))))));
+    }
+    static get is() { return "lottery-tipping-bullet-group"; }
+    static get encapsulation() { return "shadow"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["lottery-tipping-bullet-group.scss"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["lottery-tipping-bullet-group.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "mbSource": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "mb-source",
+                "reflect": true
+            },
+            "clientStyling": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "client-styling",
+                "reflect": true
+            },
+            "clientStylingUrl": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "client-styling-url",
+                "reflect": true
+            },
+            "positionIdx": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "position-idx",
+                "reflect": true
+            },
+            "theme": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "'default' | 'text'",
+                    "resolved": "\"default\" | \"text\"",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "theme",
+                "reflect": true,
+                "defaultValue": "'default'"
+            },
+            "mode": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "'single' | 'multi'",
+                    "resolved": "\"multi\" | \"single\"",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "mode",
+                "reflect": true,
+                "defaultValue": "'single'"
+            },
+            "bulletConfigContent": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "bullet-config-content",
+                "reflect": true,
+                "defaultValue": "''"
+            }
+        };
+    }
+    static get events() {
+        return [{
+                "method": "lotteryTippingBulletGroupToggleEvent",
+                "name": "lotteryTippingBulletGroupToggle",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "complexType": {
+                    "original": "{\n    bulletConfigArr: BulletConfigType[];\n    positionIdx: string;\n  }",
+                    "resolved": "{ bulletConfigArr: BulletConfigType[]; positionIdx: string; }",
+                    "references": {
+                        "BulletConfigType": {
+                            "location": "import",
+                            "path": "../../models",
+                            "id": "../../../../packages/stencil/lottery-tipping-bullet-group/src/models/index.ts::BulletConfigType"
+                        }
+                    }
+                }
+            }];
+    }
+    static get watchers() {
+        return [{
+                "propName": "clientStyling",
+                "methodName": "handleClientStylingChange"
+            }, {
+                "propName": "clientStylingUrl",
+                "methodName": "handleClientStylingUrlChange"
+            }, {
+                "propName": "mbSource",
+                "methodName": "handleMbSourceChange"
+            }];
+    }
+    static get listeners() {
+        return [{
+                "name": "lotteryTippingBulletToggle",
+                "method": "lotteryTippingBulletSelectionHandler",
+                "target": undefined,
+                "capture": false,
+                "passive": false
+            }];
+    }
+}

package/dist/collection/index.js

@@ -0,0 +1 @@
+export * from './components/lottery-tipping-bullet-group';

package/dist/collection/models/index.js

@@ -0,0 +1 @@
+export {};

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 };