@everymatrix/lottery-oddsbom-ticket-result 0.0.1

package/dist/cjs/lottery-oddsbom-ticket-result.cjs.js

@@ -0,0 +1,25 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+const index = require('./index-2be14604.js');
+const appGlobals = require('./app-globals-3a1e7e63.js');
+
+/*
+ Stencil Client Patch Browser v4.19.2 | MIT Licensed | https://stenciljs.com
+ */
+var patchBrowser = () => {
+  const importMeta = (typeof document === 'undefined' ? new (require('u' + 'rl').URL)('file:' + __filename).href : (document.currentScript && document.currentScript.src || new URL('lottery-oddsbom-ticket-result.cjs.js', document.baseURI).href));
+  const opts = {};
+  if (importMeta !== "") {
+    opts.resourcesUrl = new URL(".", importMeta).href;
+  }
+  return index.promiseResolve(opts);
+};
+
+patchBrowser().then(async (options) => {
+  await appGlobals.globalScripts();
+  return index.bootstrapLazy([["lottery-oddsbom-bullet_2.cjs",[[1,"lottery-oddsbom-ticket-result",{"mbSource":[513,"mb-source"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"translationUrl":[513,"translation-url"],"language":[513],"sessionId":[513,"session-id"],"endpoint":[513],"gameId":[513,"game-id"],"drawId":[513,"draw-id"],"defaultResults":[513,"default-results"],"splitView":[516,"split-view"],"allResults":[32],"ticketBetDataSource":[32],"isLoading":[32]},null,{"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"],"mbSource":["handleMbSourceChange"],"gameId":["fetchMatchData"],"drawId":["fetchMatchData"],"defaultResults":["fetchMatchData"]}],[1,"lottery-oddsbom-bullet",{"isSelected":[516,"is-selected"],"disabled":[516],"text":[513],"idx":[514],"isReading":[516,"is-reading"],"isDeleteByIcon":[516,"is-delete-by-icon"],"isCallDialogBtn":[516,"is-call-dialog-btn"],"isAddedByMoreBtn":[516,"is-added-by-more-btn"],"mbSource":[513,"mb-source"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"]},null,{"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"],"mbSource":["handleMbSourceChange"]}]]]], options);
+});
+
+exports.setNonce = index.setNonce;

package/dist/collection/collection-manifest.json

@@ -0,0 +1,19 @@
+{
+  "entries": [
+    "components/lottery-oddsbom-ticket-result/lottery-oddsbom-ticket-result.js"
+  ],
+  "compiler": {
+    "name": "@stencil/core",
+    "version": "4.19.2",
+    "typescriptVersion": "5.4.5"
+  },
+  "collections": [
+    {
+      "name": "@everymatrix/lottery-oddsbom-bullet",
+      "tags": [
+        "lottery-oddsbom-bullet"
+      ]
+    }
+  ],
+  "bundles": []
+}

package/dist/collection/components/lottery-oddsbom-ticket-result/index.js

@@ -0,0 +1 @@
+export { LotteryOddsbomTicketResult } from './lottery-oddsbom-ticket-result';

package/dist/collection/components/lottery-oddsbom-ticket-result/lottery-oddsbom-ticket-result.css

@@ -0,0 +1,221 @@
+.LotteryTippingTicketBet__container {
+  display: block; /* Or inline-block, depending on desired layout flow */
+  font-size: 14px;
+  line-height: 1.5715;
+  color: var(--emw--color-typography, #000);
+  background: var(--emw--color-background, #fff);
+  overflow: hidden;
+  min-width: 300px;
+  container-type: inline-size;
+}
+@container (max-width: 375px) {
+  .LotteryTippingTicketBet__container {
+    font-size: 12px;
+  }
+}
+
+.my-table-component {
+  width: 100%;
+  border-collapse: collapse; /* Important for borders */
+  text-align: left;
+  border-radius: 0.1rem; /* Ant Design like subtle rounding */
+  border-spacing: 0;
+}
+
+/* Header */
+.my-table-component th {
+  background: var(--emw--color-background-secondary, #f5f5f5);
+  color: var(--emw--color-typography, #000);
+  font-weight: 600;
+  padding: 0.4rem 0.5rem;
+  transition: background 0.3s ease;
+}
+
+/* Cells */
+.my-table-component td {
+  padding: 0.4rem 0.5rem;
+  color: var(--emw--color-typography, #000);
+  background: var(--emw--color-background, #fff);
+  transition: background 0.3s;
+}
+@container (max-width: 400px) {
+  .my-table-component td {
+    padding: 0.3rem 0.3rem;
+  }
+}
+
+.my-table-component.bordered th,
+.my-table-component.bordered td {
+  border-bottom: 1px solid var(--emw--color-gray-100, #e6e6e6);
+}
+
+/* Bordered style */
+.my-table-component.grid th,
+.my-table-component.grid td {
+  border: 1px solid var(--emw--color-gray-100, #e6e6e6);
+}
+
+.my-table-component.grid th {
+  border-bottom-width: 1px; /* Ensure bottom border is consistent */
+}
+
+.my-table-component.grid {
+  border: 1px solid var(--emw--color-gray-100, #e6e6e6); /* Outer border */
+  border-right-width: 0;
+  border-bottom-width: 0;
+}
+
+.my-table-component.grid th:last-child,
+.my-table-component.grid td:last-child {
+  border-right: 1px solid var(--emw--color-gray-100, #e6e6e6);
+}
+
+.my-table-component.grid tr:last-child td {
+  border-bottom: 1px solid var(--emw--color-gray-100, #e6e6e6);
+}
+
+/* Striped style */
+.my-table-component.striped tbody tr:nth-child(even) td {
+  background-color: var(--emw--color-background-secondary, #f5f5f5);
+}
+
+/* Hover (optional, but nice) */
+.my-table-component tbody tr:hover td {
+  background-color: var(--emw--color-background-secondary, #f5f5f5);
+}
+
+.flex {
+  display: flex;
+}
+
+.justify-end {
+  justify-content: flex-end;
+}
+
+.gap-1 {
+  gap: 4px;
+}
+
+.justify-between {
+  justify-content: space-between;
+}
+
+.align-center {
+  align-items: center;
+}
+
+.gap-1 {
+  gap: 0.5rem;
+}
+
+.match-info-item {
+  display: flex;
+}
+
+.match-info-item-label {
+  margin-right: 6px;
+}
+
+.info-icon:hover {
+  cursor: pointer;
+}
+
+.LotteryTippingTicketBet__empty p {
+  text-align: center;
+}
+
+.no-wrap {
+  white-space: nowrap;
+  overflow: hidden;
+}
+
+.eventNameContainer__item {
+  line-height: 1rem;
+}
+.eventNameContainer__item--title {
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  max-width: 300px;
+}
+@container (max-width: 600px) {
+  .eventNameContainer__item--title {
+    max-width: 180px;
+  }
+}
+@container (max-width: 500px) {
+  .eventNameContainer__item--title {
+    max-width: 150px;
+  }
+}
+@container (max-width: 400px) {
+  .eventNameContainer__item--title {
+    max-width: 100px;
+  }
+}
+@container (max-width: 330px) {
+  .eventNameContainer__item--title {
+    max-width: 70px;
+  }
+}
+
+.LotteryTippingTicketBet__main {
+  perspective: 800px;
+  will-change: transform, opacity;
+  backface-visibility: hidden;
+}
+
+@container (max-width: 520px) {
+  .LotteryTippingTicketBet__main {
+    flex-wrap: wrap;
+    justify-content: center;
+  }
+}
+.loading-wrap {
+  margin: 20px 0;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  min-height: 40vh;
+}
+.loading-wrap .dots-container {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  height: 100%;
+  width: 100%;
+}
+.loading-wrap .dot {
+  height: 14px;
+  width: 14px;
+  margin-right: 14px;
+  border-radius: 14px;
+  background-color: var(--emw--color-gray-300, #333);
+  animation: pulse 1.5s infinite ease-in-out;
+}
+.loading-wrap .dot:last-child {
+  margin-right: 0;
+}
+.loading-wrap .dot:nth-child(1) {
+  animation-delay: -0.3s;
+}
+.loading-wrap .dot:nth-child(2) {
+  animation-delay: -0.1s;
+}
+.loading-wrap .dot:nth-child(3) {
+  animation-delay: 0.1s;
+}
+@keyframes pulse {
+  0% {
+    transform: scale(0.8);
+    background-color: var(--emw--color-gray-300, #333);
+  }
+  50% {
+    transform: scale(1.2);
+    background-color: var(--emw--color-gray-100, #e6e6e6);
+  }
+  100% {
+    transform: scale(0.8);
+    background-color: var(--emw--color-gray-150, #6f6f6f);
+  }
+}

package/dist/collection/components/lottery-oddsbom-ticket-result/lottery-oddsbom-ticket-result.js

@@ -0,0 +1,413 @@
+import { h } from "@stencil/core";
+import { setClientStyling, setClientStylingURL, setStreamStyling } from "../../../../../../../../libs/common/src/styling/index";
+import "../../../../../lottery-oddsbom-bullet/dist/types/index";
+import { buildTicketBetDataSource } from "../../utils/api";
+import { resolveTranslationUrl, translate } from "../../utils/locale.utils";
+import { formatDate } from "../../utils/utils";
+export class LotteryOddsbomTicketResult {
+    constructor() {
+        this.latestRequestId = 0;
+        this.mbSource = undefined;
+        this.clientStyling = undefined;
+        this.clientStylingUrl = undefined;
+        this.translationUrl = '';
+        this.language = 'en';
+        this.sessionId = undefined;
+        this.endpoint = '';
+        this.gameId = undefined;
+        this.drawId = undefined;
+        this.defaultResults = undefined;
+        this.splitView = false;
+        this.allResults = undefined;
+        this.ticketBetDataSource = [];
+        this.isLoading = false;
+    }
+    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();
+    }
+    componentWillLoad() {
+        resolveTranslationUrl(this.translationUrl);
+        this.fetchMatchData();
+    }
+    async fetchMatchData() {
+        const currentId = ++this.latestRequestId;
+        if (!this.gameId || !this.drawId) {
+            return;
+        }
+        try {
+            if (this.defaultResults)
+                this.allResults = JSON.parse(this.defaultResults);
+            this.isLoading = true;
+            const res = await buildTicketBetDataSource({
+                endpoint: this.endpoint,
+                gameId: this.gameId,
+                drawId: this.drawId,
+                results: this.allResults || [[]],
+                splitView: this.splitView
+            });
+            if (currentId === this.latestRequestId) {
+                this.ticketBetDataSource = res;
+            }
+        }
+        finally {
+            if (currentId === this.latestRequestId) {
+                this.isLoading = false;
+            }
+        }
+    }
+    get columns() {
+        const dateRender = (_, value) => formatDate({ date: value, format: 'ccc dd/MM HH:mm' });
+        if (this.splitView) {
+            return [
+                {
+                    title: 'No.',
+                    value: 'index',
+                    width: 5,
+                    rowSpan: 2
+                },
+                {
+                    title: 'Date',
+                    value: 'startTime',
+                    width: 25,
+                    rowSpan: 2,
+                    nowrap: true,
+                    render: dateRender
+                },
+                {
+                    title: 'Team',
+                    value: 'teamName',
+                    width: 30
+                },
+                {
+                    title: 'Scores',
+                    value: 'results',
+                    width: 45,
+                    render: (_, value) => (h("div", { class: "flex gap-1" }, value.map((i) => (h("lottery-oddsbom-bullet", { text: i, "is-reading": true, "is-selected": true })))))
+                }
+            ];
+        }
+        const eventNameRender = (_, value) => (h("div", { class: "flex gap-1 eventNameContainer__item" }, h("span", { class: "eventNameContainer__item--title" }, value)));
+        return [
+            {
+                title: 'Match',
+                value: 'eventName',
+                width: 50,
+                render: eventNameRender
+            },
+            {
+                title: 'Date',
+                value: 'startTime',
+                width: 25,
+                nowrap: true,
+                render: dateRender
+            },
+            {
+                title: 'Match Result',
+                value: 'results',
+                width: 25,
+                render: (_, value) => h("div", null, value === null || value === void 0 ? void 0 : value[0])
+            }
+        ];
+    }
+    renderLoading() {
+        return (h("div", { class: "loading-wrap" }, h("section", { class: "dots-container" }, h("div", { class: "dot" }), h("div", { class: "dot" }), h("div", { class: "dot" }), h("div", { class: "dot" }), h("div", { class: "dot" }))));
+    }
+    renderEmpty() {
+        return (h("div", { class: "LotteryTippingTicketBet__empty" }, h("p", null, translate('noData', this.language))));
+    }
+    renderTable({ columns, dataSource, hideHead = false, grid = true, bordered = true }) {
+        const skipMap = {};
+        return (h("table", { class: { bordered: bordered, grid: grid, 'my-table-component': true } }, !hideHead && (h("thead", null, h("tr", null, columns.map((column) => {
+            var _a;
+            return (h("th", { key: column.value, style: { width: column.width + '%', textAlign: column.align } }, typeof column.title === 'string' ? column.title : (_a = column.title) === null || _a === void 0 ? void 0 : _a.call(column)));
+        })))), h("tbody", null, dataSource.map((row, index) => (h("tr", { key: index }, columns.map((column) => {
+            if (skipMap[column.value] && skipMap[column.value] > 0) {
+                skipMap[column.value]--;
+                return null;
+            }
+            const span = column.rowSpan;
+            if (span && span > 1) {
+                skipMap[column.value] = span - 1;
+            }
+            return (h("td", { key: column.value, rowSpan: span, style: { width: column.width + '%', textAlign: column.align }, class: { 'no-wrap': column.nowrap } }, column.render ? column.render(row, row[column.value], index) : row[column.value]));
+        })))))));
+    }
+    renderContent() {
+        if (this.isLoading) {
+            return this.renderLoading();
+        }
+        if (!this.ticketBetDataSource || this.ticketBetDataSource.length === 0) {
+            return this.renderEmpty();
+        }
+        return (h("div", { class: "flex align-center LotteryTippingTicketBet__main" }, this.renderTable({
+            columns: this.columns,
+            dataSource: this.ticketBetDataSource || [],
+            hideHead: false,
+            grid: false,
+            bordered: false
+        })));
+    }
+    render() {
+        return (h("div", { key: '9932926b2958b13636d617cc20a0c77a76a36ebe', ref: (el) => (this.stylingContainer = el), class: "LotteryTippingTicketBet__container" }, this.renderContent()));
+    }
+    static get is() { return "lottery-oddsbom-ticket-result"; }
+    static get encapsulation() { return "shadow"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["lottery-oddsbom-ticket-result.scss"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["lottery-oddsbom-ticket-result.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "mbSource": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Client custom styling via message bus"
+                },
+                "attribute": "mb-source",
+                "reflect": true
+            },
+            "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
+            },
+            "clientStylingUrl": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Client custom styling via css file url"
+                },
+                "attribute": "client-styling-url",
+                "reflect": true
+            },
+            "translationUrl": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Client custom translation via json file url"
+                },
+                "attribute": "translation-url",
+                "reflect": true,
+                "defaultValue": "''"
+            },
+            "language": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Client custom language for translation"
+                },
+                "attribute": "language",
+                "reflect": true,
+                "defaultValue": "'en'"
+            },
+            "sessionId": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "GIC Session"
+                },
+                "attribute": "session-id",
+                "reflect": true
+            },
+            "endpoint": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Endpoint URL for the source of data"
+                },
+                "attribute": "endpoint",
+                "reflect": true,
+                "defaultValue": "''"
+            },
+            "gameId": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "ID of the pool game"
+                },
+                "attribute": "game-id",
+                "reflect": true
+            },
+            "drawId": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "ID of the pool game draw"
+                },
+                "attribute": "draw-id",
+                "reflect": true
+            },
+            "defaultResults": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "default-results",
+                "reflect": true
+            },
+            "splitView": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "split-view",
+                "reflect": true,
+                "defaultValue": "false"
+            }
+        };
+    }
+    static get states() {
+        return {
+            "allResults": {},
+            "ticketBetDataSource": {},
+            "isLoading": {}
+        };
+    }
+    static get watchers() {
+        return [{
+                "propName": "clientStyling",
+                "methodName": "handleClientStylingChange"
+            }, {
+                "propName": "clientStylingUrl",
+                "methodName": "handleClientStylingUrlChange"
+            }, {
+                "propName": "mbSource",
+                "methodName": "handleMbSourceChange"
+            }, {
+                "propName": "gameId",
+                "methodName": "fetchMatchData"
+            }, {
+                "propName": "drawId",
+                "methodName": "fetchMatchData"
+            }, {
+                "propName": "defaultResults",
+                "methodName": "fetchMatchData"
+            }];
+    }
+}

package/dist/collection/index.js

@@ -0,0 +1 @@
+export * from './components/lottery-oddsbom-ticket-result';

package/dist/collection/models/index.js

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