@everymatrix/lottery-tipping-ticket-controller 1.77.30 → 1.77.31

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (36) hide show
  1. package/dist/cjs/general-tooltip_6.cjs.entry.js +49 -17
  2. package/dist/cjs/{index-b8586f2f.js → index-3e1fe885.js} +0 -7
  3. package/dist/cjs/index.cjs.js +2 -2
  4. package/dist/cjs/loader.cjs.js +2 -2
  5. package/dist/cjs/{lottery-tipping-ticket-controller-a62bd4e8.js → lottery-tipping-ticket-controller-15f47527.js} +58 -5
  6. package/dist/cjs/lottery-tipping-ticket-controller.cjs.js +2 -2
  7. package/dist/collection/components/lottery-tipping-ticket-banner/lottery-tipping-ticket-banner.css +0 -2
  8. package/dist/collection/components/lottery-tipping-ticket-banner/lottery-tipping-ticket-banner.js +21 -4
  9. package/dist/collection/components/lottery-tipping-ticket-controller/lottery-tipping-ticket-controller.css +20 -1
  10. package/dist/collection/components/lottery-tipping-ticket-controller/lottery-tipping-ticket-controller.js +26 -4
  11. package/dist/esm/general-tooltip_6.entry.js +50 -18
  12. package/dist/esm/{index-7fe75b42.js → index-e3ec645c.js} +1 -7
  13. package/dist/esm/index.js +2 -2
  14. package/dist/esm/loader.js +3 -3
  15. package/dist/esm/{lottery-tipping-ticket-controller-71cc1f83.js → lottery-tipping-ticket-controller-cdb985e7.js} +58 -6
  16. package/dist/esm/lottery-tipping-ticket-controller.js +3 -3
  17. package/dist/lottery-tipping-ticket-controller/general-tooltip_6.entry.js +99 -99
  18. package/dist/lottery-tipping-ticket-controller/index-e3ec645c.js +2 -0
  19. package/dist/lottery-tipping-ticket-controller/index.esm.js +1 -1
  20. package/dist/lottery-tipping-ticket-controller/lottery-tipping-ticket-controller-cdb985e7.js +1 -0
  21. package/dist/lottery-tipping-ticket-controller/lottery-tipping-ticket-controller.esm.js +1 -1
  22. package/dist/stencil.config.dev.js +2 -1
  23. package/dist/stencil.config.js +2 -1
  24. package/dist/types/components/lottery-tipping-ticket-banner/lottery-tipping-ticket-banner.d.ts +4 -0
  25. package/dist/types/components/lottery-tipping-ticket-controller/lottery-tipping-ticket-controller.d.ts +4 -1
  26. package/dist/types/components.d.ts +16 -0
  27. package/package.json +1 -1
  28. package/dist/collection/components/static/loading.svg +0 -10
  29. package/dist/lottery-tipping-ticket-controller/index-7fe75b42.js +0 -2
  30. package/dist/lottery-tipping-ticket-controller/lottery-tipping-ticket-controller-71cc1f83.js +0 -1
  31. package/dist/static/add.svg +0 -8
  32. package/dist/static/delete.svg +0 -37
  33. package/dist/static/info.svg +0 -6
  34. package/dist/static/left-arrow.svg +0 -15
  35. package/dist/static/loading.svg +0 -10
  36. package/dist/static/right-arrow.svg +0 -15
@@ -2,8 +2,8 @@
2
2
 
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
- const index = require('./index-b8586f2f.js');
6
- const lotteryTippingTicketController = require('./lottery-tipping-ticket-controller-a62bd4e8.js');
5
+ const index = require('./index-3e1fe885.js');
6
+ const lotteryTippingTicketController = require('./lottery-tipping-ticket-controller-15f47527.js');
7
7
 
8
8
  /**
9
9
  * @name startOfDay
@@ -91,6 +91,26 @@ function isToday(dirtyDate) {
91
91
  return isSameDay(dirtyDate, Date.now());
92
92
  }
93
93
 
94
+ // This icon file is generated automatically.
95
+ var DeleteOutlined = { "icon": { "tag": "svg", "attrs": { "viewBox": "64 64 896 896", "focusable": "false" }, "children": [{ "tag": "path", "attrs": { "d": "M360 184h-8c4.4 0 8-3.6 8-8v8h304v-8c0 4.4 3.6 8 8 8h-8v72h72v-80c0-35.3-28.7-64-64-64H352c-35.3 0-64 28.7-64 64v80h72v-72zm504 72H160c-17.7 0-32 14.3-32 32v32c0 4.4 3.6 8 8 8h60.4l24.7 523c1.6 34.1 29.8 61 63.9 61h454c34.2 0 62.3-26.8 63.9-61l24.7-523H888c4.4 0 8-3.6 8-8v-32c0-17.7-14.3-32-32-32zM731.3 840H292.7l-24.2-512h487l-24.2 512z" } }] }, "name": "delete", "theme": "outlined" };
96
+ const DeleteOutlined$1 = DeleteOutlined;
97
+
98
+ // This icon file is generated automatically.
99
+ var InfoCircleOutlined = { "icon": { "tag": "svg", "attrs": { "viewBox": "64 64 896 896", "focusable": "false" }, "children": [{ "tag": "path", "attrs": { "d": "M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm0 820c-205.4 0-372-166.6-372-372s166.6-372 372-372 372 166.6 372 372-166.6 372-372 372z" } }, { "tag": "path", "attrs": { "d": "M464 336a48 48 0 1096 0 48 48 0 10-96 0zm72 112h-48c-4.4 0-8 3.6-8 8v272c0 4.4 3.6 8 8 8h48c4.4 0 8-3.6 8-8V456c0-4.4-3.6-8-8-8z" } }] }, "name": "info-circle", "theme": "outlined" };
100
+ const InfoCircleOutlined$1 = InfoCircleOutlined;
101
+
102
+ // This icon file is generated automatically.
103
+ var LeftOutlined = { "icon": { "tag": "svg", "attrs": { "viewBox": "64 64 896 896", "focusable": "false" }, "children": [{ "tag": "path", "attrs": { "d": "M724 218.3V141c0-6.7-7.7-10.4-12.9-6.3L260.3 486.8a31.86 31.86 0 000 50.3l450.8 352.1c5.3 4.1 12.9.4 12.9-6.3v-77.3c0-4.9-2.3-9.6-6.1-12.6l-360-281 360-281.1c3.8-3 6.1-7.7 6.1-12.6z" } }] }, "name": "left", "theme": "outlined" };
104
+ const LeftOutlined$1 = LeftOutlined;
105
+
106
+ // This icon file is generated automatically.
107
+ var PlusSquareOutlined = { "icon": { "tag": "svg", "attrs": { "viewBox": "64 64 896 896", "focusable": "false" }, "children": [{ "tag": "path", "attrs": { "d": "M328 544h152v152c0 4.4 3.6 8 8 8h48c4.4 0 8-3.6 8-8V544h152c4.4 0 8-3.6 8-8v-48c0-4.4-3.6-8-8-8H544V328c0-4.4-3.6-8-8-8h-48c-4.4 0-8 3.6-8 8v152H328c-4.4 0-8 3.6-8 8v48c0 4.4 3.6 8 8 8z" } }, { "tag": "path", "attrs": { "d": "M880 112H144c-17.7 0-32 14.3-32 32v736c0 17.7 14.3 32 32 32h736c17.7 0 32-14.3 32-32V144c0-17.7-14.3-32-32-32zm-40 728H184V184h656v656z" } }] }, "name": "plus-square", "theme": "outlined" };
108
+ const PlusSquareOutlined$1 = PlusSquareOutlined;
109
+
110
+ // This icon file is generated automatically.
111
+ var RightOutlined = { "icon": { "tag": "svg", "attrs": { "viewBox": "64 64 896 896", "focusable": "false" }, "children": [{ "tag": "path", "attrs": { "d": "M765.7 486.8L314.9 134.7A7.97 7.97 0 00302 141v77.3c0 4.9 2.3 9.6 6.1 12.6l360 281.1-360 281.1c-3.9 3-6.1 7.7-6.1 12.6V883c0 6.7 7.7 10.4 12.9 6.3l450.8-352.1a31.96 31.96 0 000-50.4z" } }] }, "name": "right", "theme": "outlined" };
112
+ const RightOutlined$1 = RightOutlined;
113
+
94
114
  const generalTooltipCss = ".general-tooltip-wrapper{display:inline-block;position:relative;line-height:0}.general-tooltip-container{display:contents;}.general-tooltip-popup{position:absolute;color:var(--emw--color-typography-inverse, #fff);background:var(--emw--color-background-inverse, #000);padding:8px 12px;border-radius:4px;font-size:0.875em;line-height:1.4;z-index:1000;opacity:0;visibility:hidden;transition:opacity 0.2s ease-in-out, visibility 0.2s ease-in-out;white-space:nowrap;pointer-events:none;}.general-tooltip-popup.visible{opacity:1;visibility:visible}.general-tooltip-arrow{position:absolute;width:0;height:0;border-style:solid}.general-tooltip-top{bottom:100%;left:50%;transform:translateX(-50%);margin-bottom:8px;}.general-tooltip-top .general-tooltip-arrow{top:100%;left:50%;transform:translateX(-50%);border-width:6px 6px 0 6px;border-color:var(--emw--color-gray-300, #333) transparent transparent transparent}.general-tooltip-bottom{top:100%;left:50%;transform:translateX(-50%);margin-top:8px;}.general-tooltip-bottom .general-tooltip-arrow{bottom:100%;left:50%;transform:translateX(-50%);border-width:0 6px 6px 6px;border-color:transparent transparent var(--emw--color-gray-300, #333) transparent}.general-tooltip-left{right:100%;top:50%;transform:translateY(-50%);margin-right:8px;}.general-tooltip-left .general-tooltip-arrow{left:100%;top:50%;transform:translateY(-50%);border-width:6px 0 6px 6px;border-color:transparent transparent transparent var(--emw--color-gray-300, #333)}.general-tooltip-right{left:100%;top:50%;transform:translateY(-50%);margin-left:8px;}.general-tooltip-right .general-tooltip-arrow{right:100%;top:50%;transform:translateY(-50%);border-width:6px 6px 6px 0;border-color:transparent var(--emw--color-gray-300, #333) transparent transparent}";
95
115
  const GeneralTooltipStyle0 = generalTooltipCss;
96
116
 
@@ -373,7 +393,7 @@ const translate$1 = (key, customLang) => {
373
393
  return TRANSLATIONS$1[lang !== undefined && SUPPORTED_LANGUAGES$1.includes(lang) ? lang : DEFAULT_LANGUAGE$1][key];
374
394
  };
375
395
 
376
- const lotteryTippingTicketBannerCss = ".lottery-tipping-ticket-banner__container {\n font-family: system-ui, sans-serif;\n font-size: 14px;\n container-type: inline-size;\n}\n\n.banner {\n display: flex;\n flex-wrap: wrap;\n align-items: center;\n justify-content: space-between;\n padding: 0 1rem;\n background: var(--emw--color-primary, #fed275);\n border-top: 2px solid var(--emw--color-primary, #fed275);\n border-bottom: 2px solid var(--emw--color-primary, #fed275);\n gap: 0.5rem;\n white-space: nowrap;\n position: relative;\n height: 46px;\n}\n\n.left {\n flex: 1;\n gap: 0.4rem;\n}\n.left .logo {\n width: 216px;\n position: absolute;\n top: -7px;\n}\n\n.brand {\n font-weight: 700;\n color: var(--emw--color-typography, #000);\n}\n\n.mid {\n flex: 1;\n font-size: 1.5rem;\n font-weight: 800;\n font-style: italic;\n letter-spacing: 0.04em;\n color: var(--emw--color-typography, #000);\n text-align: center;\n}\n\n.right {\n flex: 1;\n display: flex;\n gap: 0.4rem;\n flex-wrap: wrap;\n justify-content: flex-end;\n}\n\n@container (max-width: 420px) {\n .mid {\n text-align: right;\n }\n .right {\n justify-content: center;\n }\n}\n.pill {\n border: 1px solid var(--emw--color-gray-150, #6f6f6f);\n border-radius: 0.4rem;\n padding: 0.25rem 0.7rem;\n font-size: 0.9rem;\n color: var(--emw--color-gray-400, #000);\n display: inline-flex;\n align-items: baseline;\n}\n\n.pill > strong {\n font-weight: 700;\n}";
396
+ const lotteryTippingTicketBannerCss = ".lottery-tipping-ticket-banner__container {\n font-family: system-ui, sans-serif;\n font-size: 14px;\n container-type: inline-size;\n}\n\n.banner {\n display: flex;\n flex-wrap: wrap;\n align-items: center;\n justify-content: space-between;\n padding: 0 1rem;\n background: var(--emw--color-primary, #fed275);\n border-top: 2px solid var(--emw--color-primary, #fed275);\n border-bottom: 2px solid var(--emw--color-primary, #fed275);\n gap: 0.5rem;\n white-space: nowrap;\n position: relative;\n height: 46px;\n}\n\n.left {\n flex: 1;\n gap: 0.4rem;\n}\n.left .logo {\n width: 216px;\n position: absolute;\n top: -7px;\n}\n\n.brand {\n font-weight: 700;\n color: var(--emw--color-typography, #000);\n}\n\n.mid {\n flex: 1;\n font-size: 1.5rem;\n font-weight: 800;\n font-style: italic;\n letter-spacing: 0.04em;\n color: var(--emw--color-typography, #000);\n text-align: center;\n}\n\n.right {\n flex: 1;\n display: flex;\n gap: 0.4rem;\n flex-wrap: wrap;\n justify-content: flex-end;\n}\n\n@container (max-width: 420px) {\n .mid {\n text-align: right;\n }\n .right {\n justify-content: center;\n }\n}\n.pill {\n padding: 0.25rem 0.7rem;\n font-size: 0.9rem;\n color: var(--emw--color-gray-400, #000);\n display: inline-flex;\n align-items: baseline;\n}\n\n.pill > strong {\n font-weight: 700;\n}";
377
397
  const LotteryTippingTicketBannerStyle0 = lotteryTippingTicketBannerCss;
378
398
 
379
399
  const LotteryTippingTicketBanner = class {
@@ -384,6 +404,7 @@ const LotteryTippingTicketBanner = class {
384
404
  this.clientStylingUrl = undefined;
385
405
  this.language = 'en';
386
406
  this.translationUrl = '';
407
+ this.logoUrl = undefined;
387
408
  this.stopTime = '';
388
409
  this.period = undefined;
389
410
  }
@@ -440,8 +461,7 @@ const LotteryTippingTicketBanner = class {
440
461
  this.stylingSubscription && this.stylingSubscription.unsubscribe();
441
462
  }
442
463
  render() {
443
- const backgroundImagePath = index.getAssetPath('../static/poolgame-bg.webp');
444
- return (index.h("div", { key: '07515ab821761d26edcc285f83f6e81dfab269ca', ref: (el) => (this.stylingContainer = el), class: "lottery-tipping-ticket-banner__container" }, index.h("section", { key: 'bbd8a3ae1b718f77b726dc89be4f901757579541', class: "banner" }, index.h("div", { key: '2b1883da2db0bfae83e5b4997c999fff433eb7a8', class: "left" }, index.h("img", { key: '54b482734d27bdfbbd2983bc95704273195fdd0d', alt: "Betting", src: backgroundImagePath, class: "logo" })), index.h("div", { key: '2a735ea687f0aaea72b0142f7026c9da0e15195d', class: "mid period" }, this.formattedPeriod), index.h("div", { key: '9c797b4a3bc6d2f0a69f4fd8af07f80eb765d0aa', class: "right" }, index.h("span", { key: '8c3abf153cf7f9ee1e2afcd42f67f7d90fe2f2a6', class: "pill" }, index.h("strong", { key: '4b3d99c269b4f494f62cbacc943f93f248004a96' }, translate$1('stop', this.language)), "\u00A0", translate$1('at', this.language), "\u00A0", this.formattedStopTime)))));
464
+ return (index.h("div", { key: '8b8b9d66021090e8a4f566e11908341fb6a65bad', ref: (el) => (this.stylingContainer = el), class: "lottery-tipping-ticket-banner__container" }, index.h("section", { key: '37d23ad6aca6c4a02283a78e6011d0c6e4f81dff', class: "banner" }, index.h("div", { key: '919a9f7535468d5d75fa21e5c48c56c6c994aea7', class: "left" }, this.logoUrl && index.h("img", { key: '1d8e9f3e9ed7eaec36b604401c0a4045d735c209', alt: "Betting", src: this.logoUrl, class: "logo" })), index.h("div", { key: '3cdc189bcab34d964e6a17339c60e449ba4883d7', class: "mid period" }, this.formattedPeriod), index.h("div", { key: '526f90497ed8a14ba03d04cffbbe7c263b0bd23c', class: "right" }, index.h("span", { key: '00676d5b0fae7ad7b4d2cf549572ae7b3d3091c1', class: "pill" }, index.h("strong", { key: 'dde2bac5a9316cf97d34a19a433e6bcb74d50750' }, translate$1('stop', this.language)), "\u00A0", translate$1('at', this.language), "\u00A0", this.formattedStopTime)))));
445
465
  }
446
466
  static get assetsDirs() { return ["../static"]; }
447
467
  static get watchers() { return {
@@ -7238,16 +7258,30 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
7238
7258
  <div on-click="_scrollForward" part="forward-button" aria-hidden="true"></div>
7239
7259
  `}static get is(){return "vaadin-tabs"}}v(_h);
7240
7260
 
7241
- const lotteryTippingTicketBetCss = ".LotteryTippingTicketBet__container {\n display: block; /* Or inline-block, depending on desired layout flow */\n font-size: 14px;\n line-height: 1.5715;\n color: var(--emw--color-typography, #000);\n background: var(--emw--color-background, #fff);\n overflow: hidden;\n min-width: 300px;\n container-type: inline-size;\n}\n@container (max-width: 375px) {\n .LotteryTippingTicketBet__container {\n font-size: 12px;\n }\n}\n\n.table-wrapper {\n overflow-x: auto; /* Handle horizontal scroll if content overflows */\n}\n\n.my-table-component {\n width: 100%;\n border-collapse: collapse; /* Important for borders */\n text-align: left;\n border-radius: 0.1rem; /* Ant Design like subtle rounding */\n border-spacing: 0;\n}\n\n/* Header */\n.my-table-component th {\n background: var(--emw--color-background-secondary, #f5f5f5);\n color: var(--emw--color-typography, #000);\n font-weight: 500;\n padding: 0.4rem 0.5rem;\n transition: background 0.3s ease;\n}\n\n/* Cells */\n.my-table-component td {\n padding: 0.4rem 0.5rem;\n color: var(--emw--color-typography, #000);\n background: var(--emw--color-background, #fff);\n transition: background 0.3s;\n}\n@container (max-width: 400px) {\n .my-table-component td {\n padding: 0.3rem 0.3rem;\n }\n}\n\n.my-table-component.bordered th,\n.my-table-component.bordered td {\n border-bottom: 1px solid var(--emw--color-gray-100, #e6e6e6);\n}\n\n/* Bordered style */\n.my-table-component.grid th,\n.my-table-component.grid td {\n border: 1px solid var(--emw--color-gray-100, #e6e6e6);\n}\n\n.my-table-component.grid th {\n border-bottom-width: 1px; /* Ensure bottom border is consistent */\n}\n\n.my-table-component.grid {\n border: 1px solid var(--emw--color-gray-100, #e6e6e6); /* Outer border */\n border-right-width: 0;\n border-bottom-width: 0;\n}\n\n.my-table-component.grid th:last-child,\n.my-table-component.grid td:last-child {\n border-right: 1px solid var(--emw--color-gray-100, #e6e6e6);\n}\n\n.my-table-component.grid tr:last-child td {\n border-bottom: 1px solid var(--emw--color-gray-100, #e6e6e6);\n}\n\n/* Striped style */\n.my-table-component.striped tbody tr:nth-child(even) td {\n background-color: var(--emw--color-background-secondary, #f5f5f5);\n}\n\n/* Hover (optional, but nice) */\n.my-table-component tbody tr:hover td {\n background-color: var(--emw--color-background-secondary, #f5f5f5);\n}\n\n.flex {\n display: flex;\n}\n\n.justify-end {\n justify-content: flex-end;\n}\n\n.gap-1 {\n gap: 4px;\n}\n\n.justify-between {\n justify-content: space-between;\n}\n\n.align-center {\n align-items: center;\n}\n\n.gap-1 {\n gap: 0.5rem;\n}\n\n.btn {\n color: var(--emw--color-typography, #000);\n background: var(--emw--color-background, #fff);\n font-size: 14px;\n transition: all 0.2s ease;\n}\n.btn:hover {\n cursor: pointer;\n}\n\n.btn:hover {\n background-color: var(--emw--color-gray-100, #e6e6e6);\n}\n\n.btn.disabled {\n opacity: 0.5;\n pointer-events: none;\n}\n.btn.disabled:hover {\n cursor: not-allowed !important;\n}\n\n.LotteryTippingTicketBet__tableToolbar {\n width: 100%;\n margin-bottom: 1rem;\n}\n\n.LotteryTippingTicketBet__tableToolbar--item {\n background-color: transparent;\n cursor: pointer;\n font-weight: 500;\n white-space: nowrap;\n display: inline-flex;\n border-radius: 1.6rem;\n border: 1px solid var(--emw--color-gray-100, #e6e6e6);\n padding-top: 0.5rem;\n padding-bottom: 0.5rem;\n padding-left: 1rem;\n padding-right: 1rem;\n margin-right: 2rem;\n color: var(--emw--color-typography, #000);\n}\n.LotteryTippingTicketBet__tableToolbar--item.mr-0 {\n margin-right: 0rem !important;\n}\n\n.LotteryTippingTicketBet__lineOperatorGroup {\n flex-basis: 2rem;\n display: flex;\n flex-direction: column;\n gap: 1rem;\n border-radius: 8px;\n}\n\n.LotteryTippingTicketBet__lineOperatorGroup--item {\n display: flex;\n justify-content: center;\n align-items: center;\n width: 2rem;\n height: 2rem;\n background-color: var(--emw--color-background-secondary, #f5f5f5);\n color: var(--emw--color-typography, #000);\n border-radius: 8px;\n transition: all 0.2s ease-in-out;\n cursor: pointer;\n}\n\n.LotteryTippingTicketBet__lineOperatorGroup--item:hover {\n transform: scale(1.1);\n box-shadow: 0 6px 14px var(--emw-calender-curday-box-shadow, rgba(0, 0, 0, 0.09));\n}\n\n.LotteryTippingTicketBet__lineOperatorGroup--item img {\n width: 20px;\n height: 20px;\n transition: filter 0.2s ease-in-out;\n filter: grayscale(0.3);\n}\n\n.LotteryTippingTicketBet__lineOperatorGroup--item:hover img {\n filter: grayscale(0);\n transform: rotate(3deg);\n}\n\ndiv.border-line {\n margin-top: 1rem;\n height: 1px;\n width: 100%;\n box-sizing: border-box;\n background-color: var(--emw--color-background-secondary, #f5f5f5);\n transition: all 0.3s ease;\n}\n\n.LotteryTippingTicketBet__footer {\n padding: 0.5rem;\n}\n\n.my-pagination {\n display: flex;\n justify-content: space-between;\n align-items: center;\n gap: 1rem;\n font-size: 0.8rem;\n color: var(--emw--color-typography-secondary, #333);\n}\n\n.my-pagination span {\n font-weight: 500;\n user-select: none;\n}\n\n.my-pagination .btn {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 2rem;\n height: 2rem;\n border-radius: 50%;\n transition: all 0.3s ease;\n cursor: pointer;\n opacity: 0.9;\n color: var(--emw--color-typography, #000);\n background-color: var(--emw--color-background-secondary, #f5f5f5);\n}\n\n.my-pagination .btn img {\n width: 20px;\n height: 20px;\n transition: transform 0.2s ease;\n}\n\n.my-pagination .btn:hover {\n transform: scale(1.1);\n box-shadow: 0 6px 14px var(--emw-calender-curday-box-shadow, rgba(0, 0, 0, 0.09));\n}\n\n.my-pagination .btn.disabled {\n background-color: var(--emw--color-background-tertiary, #ccc);\n cursor: not-allowed;\n opacity: 0.5;\n transform: scale(1);\n}\n\n.match-info-item {\n display: flex;\n}\n\n.match-info-item-label {\n margin-right: 6px;\n}\n\n.info-icon:hover {\n cursor: pointer;\n}\n\n.LotteryTippingTicketBet__empty p {\n text-align: center;\n}\n\n.no-wrap {\n white-space: nowrap;\n overflow: hidden;\n}\n\n.eventNameContainer__item {\n line-height: 1rem;\n}\n.eventNameContainer__item--title {\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n max-width: 300px;\n}\n@container (max-width: 600px) {\n .eventNameContainer__item--title {\n max-width: 180px;\n }\n}\n@container (max-width: 500px) {\n .eventNameContainer__item--title {\n max-width: 150px;\n }\n}\n@container (max-width: 400px) {\n .eventNameContainer__item--title {\n max-width: 100px;\n }\n}\n@container (max-width: 330px) {\n .eventNameContainer__item--title {\n max-width: 70px;\n }\n}\n\n.LotteryTippingTicketBet__main {\n perspective: 800px;\n will-change: transform, opacity;\n backface-visibility: hidden;\n}\n\n@container (max-width: 520px) {\n .LotteryTippingTicketBet__main {\n flex-wrap: wrap;\n justify-content: center;\n }\n .LotteryTippingTicketBet__tableToolbar--item {\n margin-right: 0 !important;\n }\n}\n/* Fade-In Keyframes */\n@keyframes fadeInLeft {\n from {\n opacity: 0;\n transform: translateX(100%);\n }\n to {\n opacity: 1;\n transform: translateX(0);\n }\n}\n/* Fade-Out Keyframes */\n@keyframes fadeOut {\n from {\n opacity: 1;\n }\n to {\n opacity: 0;\n }\n}\n@keyframes fadeInRight {\n from {\n opacity: 0;\n transform: translateX(-100%);\n }\n to {\n opacity: 1;\n transform: translateX(0);\n }\n}\n@keyframes fadeInUp {\n from {\n opacity: 0;\n transform: translateY(100%);\n }\n to {\n opacity: 1;\n transform: translateY(0);\n }\n}\n@-webkit-keyframes slide-left {\n 0% {\n -webkit-transform: translateX(0);\n transform: translateX(0);\n }\n 100% {\n -webkit-transform: translateX(-100px);\n transform: translateX(-100px);\n }\n}\n@keyframes slide-left {\n 0% {\n -webkit-transform: translateX(100%);\n transform: translateX(100%);\n }\n 100% {\n -webkit-transform: translateX(0px);\n transform: translateX(0px);\n }\n}\n@-webkit-keyframes slide-right {\n 0% {\n -webkit-transform: translateX(-100%);\n transform: translateX(-100%);\n }\n 100% {\n -webkit-transform: translateX(0px);\n transform: translateX(0px);\n }\n}\n@keyframes slide-right {\n 0% {\n -webkit-transform: translateX(-100px);\n transform: translateX(-100px);\n }\n 100% {\n -webkit-transform: translateX(0);\n transform: translateX(0);\n }\n}\n@-webkit-keyframes slide-top {\n 0% {\n -webkit-transform: translateY(-100px);\n transform: translateY(-100px);\n }\n 100% {\n -webkit-transform: translateY(0px);\n transform: translateY(0px);\n }\n}\n@keyframes slide-top {\n 0% {\n -webkit-transform: translateY(-100px);\n transform: translateY(-100px);\n }\n 100% {\n -webkit-transform: translateY(0px);\n transform: translateY(0px);\n }\n}\n/* Apply to your card classes */\n.card-in-left {\n -webkit-animation: slide-left 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) both;\n animation: slide-left 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) both;\n}\n\n.card-out-left {\n animation: fadeOut 0.2s ease-out both;\n}\n\n.card-in-right {\n -webkit-animation: slide-right 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) both;\n animation: slide-right 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) both;\n}\n\n.card-out-right {\n animation: fadeOut 0.2s ease-out both;\n}\n\n.card-in-up {\n -webkit-animation: slide-top 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) both;\n animation: slide-top 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) both;\n}\n\n.card-out-down {\n animation: fadeOut 0.2s ease-out both;\n}";
7261
+ const lotteryTippingTicketBetCss = ".LotteryTippingTicketBet__container {\n display: block; /* Or inline-block, depending on desired layout flow */\n font-size: 14px;\n line-height: 1.5715;\n color: var(--emw--color-typography, #000);\n background: var(--emw--color-background, #fff);\n overflow: hidden;\n min-width: 300px;\n container-type: inline-size;\n}\n@container (max-width: 375px) {\n .LotteryTippingTicketBet__container {\n font-size: 12px;\n }\n}\n\n.table-wrapper {\n overflow-x: auto; /* Handle horizontal scroll if content overflows */\n}\n\n.my-table-component {\n width: 100%;\n border-collapse: collapse; /* Important for borders */\n text-align: left;\n border-radius: 0.1rem; /* Ant Design like subtle rounding */\n border-spacing: 0;\n}\n\n/* Header */\n.my-table-component th {\n background: var(--emw--color-background-secondary, #f5f5f5);\n color: var(--emw--color-typography, #000);\n font-weight: 500;\n padding: 0.4rem 0.5rem;\n transition: background 0.3s ease;\n}\n\n/* Cells */\n.my-table-component td {\n padding: 0.4rem 0.5rem;\n color: var(--emw--color-typography, #000);\n background: var(--emw--color-background, #fff);\n transition: background 0.3s;\n}\n@container (max-width: 400px) {\n .my-table-component td {\n padding: 0.3rem 0.3rem;\n }\n}\n\n.my-table-component.bordered th,\n.my-table-component.bordered td {\n border-bottom: 1px solid var(--emw--color-gray-100, #e6e6e6);\n}\n\n/* Bordered style */\n.my-table-component.grid th,\n.my-table-component.grid td {\n border: 1px solid var(--emw--color-gray-100, #e6e6e6);\n}\n\n.my-table-component.grid th {\n border-bottom-width: 1px; /* Ensure bottom border is consistent */\n}\n\n.my-table-component.grid {\n border: 1px solid var(--emw--color-gray-100, #e6e6e6); /* Outer border */\n border-right-width: 0;\n border-bottom-width: 0;\n}\n\n.my-table-component.grid th:last-child,\n.my-table-component.grid td:last-child {\n border-right: 1px solid var(--emw--color-gray-100, #e6e6e6);\n}\n\n.my-table-component.grid tr:last-child td {\n border-bottom: 1px solid var(--emw--color-gray-100, #e6e6e6);\n}\n\n/* Striped style */\n.my-table-component.striped tbody tr:nth-child(even) td {\n background-color: var(--emw--color-background-secondary, #f5f5f5);\n}\n\n/* Hover (optional, but nice) */\n.my-table-component tbody tr:hover td {\n background-color: var(--emw--color-background-secondary, #f5f5f5);\n}\n\n.flex {\n display: flex;\n}\n\n.justify-end {\n justify-content: flex-end;\n}\n\n.gap-1 {\n gap: 4px;\n}\n\n.justify-between {\n justify-content: space-between;\n}\n\n.align-center {\n align-items: center;\n}\n\n.gap-1 {\n gap: 0.5rem;\n}\n\n.btn {\n color: var(--emw--color-typography, #000);\n background: var(--emw--color-background, #fff);\n font-size: 14px;\n transition: all 0.2s ease;\n}\n.btn:hover {\n cursor: pointer;\n}\n\n.btn:hover {\n background-color: var(--emw--color-gray-100, #e6e6e6);\n}\n\n.btn.disabled {\n opacity: 0.5;\n pointer-events: none;\n}\n.btn.disabled:hover {\n cursor: not-allowed !important;\n}\n\n.LotteryTippingTicketBet__tableToolbar {\n width: 100%;\n margin-bottom: 1rem;\n}\n\n.LotteryTippingTicketBet__tableToolbar--item {\n background-color: transparent;\n cursor: pointer;\n font-weight: 500;\n white-space: nowrap;\n display: inline-flex;\n border-radius: 1.6rem;\n border: 1px solid var(--emw--color-gray-100, #e6e6e6);\n padding-top: 0.5rem;\n padding-bottom: 0.5rem;\n padding-left: 1rem;\n padding-right: 1rem;\n margin-right: 2rem;\n color: var(--emw--color-typography, #000);\n}\n.LotteryTippingTicketBet__tableToolbar--item.mr-0 {\n margin-right: 0rem !important;\n}\n\n.LotteryTippingTicketBet__lineOperatorGroup {\n flex-basis: 2rem;\n display: flex;\n flex-direction: column;\n gap: 1rem;\n border-radius: 8px;\n}\n\n.LotteryTippingTicketBet__lineOperatorGroup--item {\n display: flex;\n justify-content: center;\n align-items: center;\n width: 2rem;\n height: 2rem;\n background-color: var(--emw--color-background-secondary, #f5f5f5);\n color: var(--emw--color-typography, #000);\n border-radius: 8px;\n transition: all 0.2s ease-in-out;\n cursor: pointer;\n}\n\n.LotteryTippingTicketBet__lineOperatorGroup--item:hover {\n transform: scale(1.1);\n box-shadow: 0 6px 14px var(--emw-calender-curday-box-shadow, rgba(0, 0, 0, 0.09));\n}\n\n.LotteryTippingTicketBet__lineOperatorGroup--item .icon {\n width: 20px;\n height: 20px;\n transition: filter 0.2s ease-in-out;\n filter: grayscale(0.3);\n}\n\n.LotteryTippingTicketBet__lineOperatorGroup--item:hover .icon {\n filter: grayscale(0);\n transform: rotate(3deg);\n}\n\ndiv.border-line {\n margin-top: 1rem;\n height: 1px;\n width: 100%;\n box-sizing: border-box;\n background-color: var(--emw--color-background-secondary, #f5f5f5);\n transition: all 0.3s ease;\n}\n\n.LotteryTippingTicketBet__footer {\n padding: 0.5rem;\n}\n\n.my-pagination {\n display: flex;\n justify-content: space-between;\n align-items: center;\n gap: 1rem;\n font-size: 0.8rem;\n color: var(--emw--color-typography-secondary, #333);\n}\n\n.my-pagination span {\n font-weight: 500;\n user-select: none;\n}\n\n.my-pagination .btn {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 2rem;\n height: 2rem;\n border-radius: 50%;\n transition: all 0.3s ease;\n cursor: pointer;\n opacity: 0.9;\n color: var(--emw--color-typography, #000);\n background-color: var(--emw--color-background-secondary, #f5f5f5);\n}\n\n.my-pagination .btn .icon {\n width: 20px;\n height: 20px;\n transition: transform 0.2s ease;\n}\n\n.my-pagination .btn:hover {\n transform: scale(1.1);\n box-shadow: 0 6px 14px var(--emw-calender-curday-box-shadow, rgba(0, 0, 0, 0.09));\n}\n\n.my-pagination .btn.disabled {\n background-color: var(--emw--color-background-tertiary, #ccc);\n cursor: not-allowed;\n opacity: 0.5;\n transform: scale(1);\n}\n\n.match-info-item {\n display: flex;\n}\n\n.match-info-item-label {\n margin-right: 6px;\n}\n\n.info-icon:hover {\n cursor: pointer;\n}\n\n.LotteryTippingTicketBet__empty p {\n text-align: center;\n}\n\n.no-wrap {\n white-space: nowrap;\n overflow: hidden;\n}\n\n.eventNameContainer__item--title {\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n max-width: 300px;\n}\n@container (max-width: 600px) {\n .eventNameContainer__item--title {\n max-width: 180px;\n }\n}\n@container (max-width: 500px) {\n .eventNameContainer__item--title {\n max-width: 150px;\n }\n}\n@container (max-width: 400px) {\n .eventNameContainer__item--title {\n max-width: 100px;\n }\n}\n@container (max-width: 330px) {\n .eventNameContainer__item--title {\n max-width: 70px;\n }\n}\n\n.LotteryTippingTicketBet__main {\n perspective: 800px;\n will-change: transform, opacity;\n backface-visibility: hidden;\n}\n\n@container (max-width: 520px) {\n .LotteryTippingTicketBet__main {\n flex-wrap: wrap;\n justify-content: center;\n }\n .LotteryTippingTicketBet__tableToolbar--item {\n margin-right: 0 !important;\n }\n}\n/* Fade-In Keyframes */\n@keyframes fadeInLeft {\n from {\n opacity: 0;\n transform: translateX(100%);\n }\n to {\n opacity: 1;\n transform: translateX(0);\n }\n}\n/* Fade-Out Keyframes */\n@keyframes fadeOut {\n from {\n opacity: 1;\n }\n to {\n opacity: 0;\n }\n}\n@keyframes fadeInRight {\n from {\n opacity: 0;\n transform: translateX(-100%);\n }\n to {\n opacity: 1;\n transform: translateX(0);\n }\n}\n@keyframes fadeInUp {\n from {\n opacity: 0;\n transform: translateY(100%);\n }\n to {\n opacity: 1;\n transform: translateY(0);\n }\n}\n@-webkit-keyframes slide-left {\n 0% {\n -webkit-transform: translateX(0);\n transform: translateX(0);\n }\n 100% {\n -webkit-transform: translateX(-100px);\n transform: translateX(-100px);\n }\n}\n@keyframes slide-left {\n 0% {\n -webkit-transform: translateX(100%);\n transform: translateX(100%);\n }\n 100% {\n -webkit-transform: translateX(0px);\n transform: translateX(0px);\n }\n}\n@-webkit-keyframes slide-right {\n 0% {\n -webkit-transform: translateX(-100%);\n transform: translateX(-100%);\n }\n 100% {\n -webkit-transform: translateX(0px);\n transform: translateX(0px);\n }\n}\n@keyframes slide-right {\n 0% {\n -webkit-transform: translateX(-100px);\n transform: translateX(-100px);\n }\n 100% {\n -webkit-transform: translateX(0);\n transform: translateX(0);\n }\n}\n@-webkit-keyframes slide-top {\n 0% {\n -webkit-transform: translateY(-100px);\n transform: translateY(-100px);\n }\n 100% {\n -webkit-transform: translateY(0px);\n transform: translateY(0px);\n }\n}\n@keyframes slide-top {\n 0% {\n -webkit-transform: translateY(-100px);\n transform: translateY(-100px);\n }\n 100% {\n -webkit-transform: translateY(0px);\n transform: translateY(0px);\n }\n}\n/* Apply to your card classes */\n.card-in-left {\n -webkit-animation: slide-left 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) both;\n animation: slide-left 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) both;\n}\n\n.card-out-left {\n animation: fadeOut 0.2s ease-out both;\n}\n\n.card-in-right {\n -webkit-animation: slide-right 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) both;\n animation: slide-right 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) both;\n}\n\n.card-out-right {\n animation: fadeOut 0.2s ease-out both;\n}\n\n.card-in-up {\n -webkit-animation: slide-top 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) both;\n animation: slide-top 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) both;\n}\n\n.card-out-down {\n animation: fadeOut 0.2s ease-out both;\n}\n\n.loading-wrap {\n margin: 20px 0;\n display: flex;\n align-items: center;\n justify-content: center;\n min-height: 40vh;\n}\n.loading-wrap .dots-container {\n display: flex;\n align-items: center;\n justify-content: center;\n height: 100%;\n width: 100%;\n}\n.loading-wrap .dot {\n height: 14px;\n width: 14px;\n margin-right: 14px;\n border-radius: 14px;\n background-color: var(--emw--color-gray-300, #333);\n animation: pulse 1.5s infinite ease-in-out;\n}\n.loading-wrap .dot:last-child {\n margin-right: 0;\n}\n.loading-wrap .dot:nth-child(1) {\n animation-delay: -0.3s;\n}\n.loading-wrap .dot:nth-child(2) {\n animation-delay: -0.1s;\n}\n.loading-wrap .dot:nth-child(3) {\n animation-delay: 0.1s;\n}\n@keyframes pulse {\n 0% {\n transform: scale(0.8);\n background-color: var(--emw--color-gray-300, #333);\n }\n 50% {\n transform: scale(1.2);\n background-color: var(--emw--color-gray-100, #e6e6e6);\n }\n 100% {\n transform: scale(0.8);\n background-color: var(--emw--color-gray-150, #6f6f6f);\n }\n}";
7242
7262
  const LotteryTippingTicketBetStyle0 = lotteryTippingTicketBetCss;
7243
7263
 
7264
+ const addImagePath = lotteryTippingTicketController.renderIconDefinitionToSVGElement(PlusSquareOutlined$1, {
7265
+ extraSVGAttrs: { width: '20px', height: '20px', fill: 'currentColor' }
7266
+ });
7267
+ const deleteImagePath = lotteryTippingTicketController.renderIconDefinitionToSVGElement(DeleteOutlined$1, {
7268
+ extraSVGAttrs: { width: '20px', height: '20px', fill: 'currentColor' }
7269
+ });
7270
+ const infoImagePath = lotteryTippingTicketController.renderIconDefinitionToSVGElement(InfoCircleOutlined$1, {
7271
+ extraSVGAttrs: { width: '16px', height: '16px', fill: 'currentColor' }
7272
+ });
7273
+ const leftImagePath = lotteryTippingTicketController.renderIconDefinitionToSVGElement(LeftOutlined$1, {
7274
+ extraSVGAttrs: { width: '20px', height: '20px', fill: 'currentColor' }
7275
+ });
7276
+ const rightImagePath = lotteryTippingTicketController.renderIconDefinitionToSVGElement(RightOutlined$1, {
7277
+ extraSVGAttrs: { width: '20px', height: '20px', fill: 'currentColor' }
7278
+ });
7244
7279
  const LotteryTippingTicketBet = class {
7245
7280
  constructor(hostRef) {
7246
7281
  index.registerInstance(this, hostRef);
7247
7282
  this.lotteryTippingBulletBetEvent = index.createEvent(this, "lotteryTippingBulletBetSelect", 7);
7248
7283
  this.lotteryTippingCurrentPageChangeEvent = index.createEvent(this, "lotteryTippingCurrentPageChange", 7);
7249
- this.infoImagePath = index.getAssetPath('../static/info.svg');
7250
- this.eventNameRender = (item, value) => (index.h("div", { class: "flex gap-1 eventNameContainer__item" }, index.h("span", { class: "eventNameContainer__item--title" }, value), index.h("general-tooltip", null, index.h("img", { slot: "trigger", class: "info-icon", src: this.infoImagePath, style: { width: '18px' } }), index.h("div", { slot: "content" }, index.h("div", { class: "match-info" }, index.h("div", { class: "match-info-item" }, index.h("div", { class: "match-info-item-label" }, translate('homeTeam', this.language)), index.h("div", { class: "match-info-item-value" }, item.homeName)), index.h("div", { class: "match-info-item" }, index.h("div", { class: "match-info-item-label" }, translate('awayTeam', this.language)), index.h("div", { class: "match-info-item-value" }, item.awayName)))))));
7284
+ this.eventNameRender = (item, value) => (index.h("div", { class: "flex gap-1 eventNameContainer__item" }, index.h("span", { class: "eventNameContainer__item--title" }, value), index.h("general-tooltip", null, index.h("span", { slot: "trigger", class: "icon info-icon", innerHTML: infoImagePath, style: { width: '18px' } }), index.h("div", { slot: "content" }, index.h("div", { class: "match-info" }, index.h("div", { class: "match-info-item" }, index.h("div", { class: "match-info-item-label" }, translate('homeTeam', this.language)), index.h("div", { class: "match-info-item-value" }, item.homeName)), index.h("div", { class: "match-info-item" }, index.h("div", { class: "match-info-item-label" }, translate('awayTeam', this.language)), index.h("div", { class: "match-info-item-value" }, item.awayName)))))));
7251
7285
  this.columns = [
7252
7286
  { title: '', value: 'index', width: 3 },
7253
7287
  {
@@ -7513,11 +7547,13 @@ const LotteryTippingTicketBet = class {
7513
7547
  handleCurrentPageChange() {
7514
7548
  this.lotteryTippingCurrentPageChangeEvent.emit({ currentPage: this.currentPage });
7515
7549
  }
7550
+ renderLoading() {
7551
+ return (index.h("div", { class: "loading-wrap" }, index.h("section", { class: "dots-container" }, index.h("div", { class: "dot" }), index.h("div", { class: "dot" }), index.h("div", { class: "dot" }), index.h("div", { class: "dot" }), index.h("div", { class: "dot" }))));
7552
+ }
7516
7553
  render() {
7517
7554
  var _a, _b, _c, _d;
7518
- const loadingImagePath = index.getAssetPath('../static/loading.svg');
7519
7555
  if (this.isLoading) {
7520
- return (index.h("div", { ref: (el) => (this.stylingContainer = el), class: "LotteryTippingTicketBet__container" }, index.h("div", { class: "flex align-center gap-1" }, index.h("p", null, translate('loading', this.language)), index.h("img", { src: loadingImagePath }))));
7556
+ return this.renderLoading();
7521
7557
  }
7522
7558
  if (this.hasErrors) {
7523
7559
  return (index.h("div", { ref: (el) => (this.stylingContainer = el), class: "LotteryTippingTicketBet__container" }, index.h("p", null, translate('error', this.language))));
@@ -7526,10 +7562,6 @@ const LotteryTippingTicketBet = class {
7526
7562
  var _a;
7527
7563
  return (index.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)));
7528
7564
  })))), index.h("tbody", null, dataSource.map((row, index$1) => (index.h("tr", { key: index$1 }, columns.map((column) => (index.h("td", { key: column.value, style: { width: column.width + '%', textAlign: column.align }, class: { 'no-wrap': column.nowrap } }, column.render ? column.render(row, row[column.value], index$1) : row[column.value])))))))));
7529
- const deleteImagePath = index.getAssetPath('../static/delete.svg');
7530
- const addImagePath = index.getAssetPath('../static/add.svg');
7531
- const leftImagePath = index.getAssetPath('../static/left-arrow.svg');
7532
- const rightImagePath = index.getAssetPath('../static/right-arrow.svg');
7533
7565
  const lineOperatorAddShow = this.totalPages < this.maxTotalPages && this.currentPage === this.totalPages ? true : false;
7534
7566
  const lineOperatorRemoveShow = this.totalPages > this.minTotalPages ? true : false;
7535
7567
  if (this.ticketDataSource.length === 0 || this.minTotalPages === 0 || this.maxTotalPages === 0) {
@@ -7539,16 +7571,16 @@ const LotteryTippingTicketBet = class {
7539
7571
  return (index.h("div", { class: "LotteryTippingTicketBet__container", ref: (el) => (this.stylingContainer = el) }, index.h("div", { class: "LotteryTippingTicketBet__main", ref: (el) => (this.mainContainer = el) }, index.h(MyTable, { columns: this.columns, dataSource: ((_a = this.ticketDataSource) === null || _a === void 0 ? void 0 : _a.map((item, index) => (Object.assign(Object.assign({}, item), { index: index + 1 })))) || [], hideHead: false, grid: false, bordered: false }), this.totalPages > 1 && (index.h("div", null, index.h("div", { class: 'border-line' }), index.h("div", { class: "LotteryTippingTicketBet__footer" }, index.h("div", { class: "my-pagination flex justify-between" }, index.h("span", null, translate('lineInfo', this.language, {
7540
7572
  currentPage: this.currentPage,
7541
7573
  totalPages: this.totalPages
7542
- })), index.h("div", { class: 'flex gap-1' }, index.h("span", { class: `btn ${this.currentPage === 1 ? 'disabled' : ''}`, onClick: this.prevPage.bind(this) }, index.h("img", { src: leftImagePath })), index.h("span", { class: `btn ${this.currentPage === this.totalPages ? 'disabled' : ''}`, onClick: this.nextPage.bind(this) }, index.h("img", { src: rightImagePath }))))))))));
7574
+ })), index.h("div", { class: 'flex gap-1' }, index.h("span", { class: `btn ${this.currentPage === 1 ? 'disabled' : ''}`, onClick: this.prevPage.bind(this) }, index.h("span", { class: "icon", innerHTML: leftImagePath })), index.h("span", { class: `btn ${this.currentPage === this.totalPages ? 'disabled' : ''}`, onClick: this.nextPage.bind(this) }, index.h("span", { class: "icon", innerHTML: rightImagePath }))))))))));
7543
7575
  }
7544
7576
  return (index.h("div", { ref: (el) => (this.stylingContainer = el), class: "LotteryTippingTicketBet__container" }, index.h("div", { class: "LotteryTippingTicketBet__tableToolbar flex justify-end gap-1" }, index.h("button", { class: {
7545
7577
  'LotteryTippingTicketBet__tableToolbar--item': true,
7546
7578
  'mr-0': !(lineOperatorAddShow || lineOperatorRemoveShow)
7547
7579
  }, onClick: this.handleClearAll.bind(this) }, translate('clearAll', this.language))), index.h("div", { class: "flex align-center LotteryTippingTicketBet__main", ref: (el) => (this.mainContainer = el) }, index.h(MyTable, { columns: this.columns, dataSource: ((_b = this.ticketDataSource) === null || _b === void 0 ? void 0 : _b.map((item, index) => (Object.assign(Object.assign({}, item), { index: index + 1 })))) || [], hideHead: false, grid: false, bordered: false }), (lineOperatorAddShow || lineOperatorRemoveShow) && (index.h("div", { class: "LotteryTippingTicketBet__lineOperatorGroup" }, lineOperatorAddShow && (index.h("div", { class: {
7548
7580
  'LotteryTippingTicketBet__lineOperatorGroup--item': true
7549
- }, onClick: this.handleAddLine.bind(this) }, index.h("img", { src: addImagePath }))), lineOperatorRemoveShow && (index.h("div", { class: {
7581
+ }, onClick: this.handleAddLine.bind(this) }, index.h("span", { class: "icon", innerHTML: addImagePath }))), lineOperatorRemoveShow && (index.h("div", { class: {
7550
7582
  'LotteryTippingTicketBet__lineOperatorGroup--item': true
7551
- }, onClick: this.handleRemoveLine.bind(this) }, index.h("img", { src: deleteImagePath })))))), index.h("div", { class: 'border-line' }), index.h("div", { class: "LotteryTippingTicketBet__footer" }, index.h("div", { class: "my-pagination flex justify-between" }, index.h("span", null, translate('lineInfo', this.language, { currentPage: this.currentPage, totalPages: this.totalPages })), index.h("div", { class: 'flex gap-1' }, index.h("span", { class: `btn ${this.currentPage === 1 ? 'disabled' : ''}`, onClick: this.prevPage.bind(this) }, index.h("img", { src: leftImagePath })), index.h("span", { class: `btn ${this.currentPage === this.totalPages ? 'disabled' : ''}`, onClick: this.nextPage.bind(this) }, index.h("img", { src: rightImagePath }))))), this.dialogConfig.visible && (index.h("vaadin-confirm-dialog", { rejectButtonVisible: true, rejectText: translate('cancel', this.language), confirmText: translate('confirm', this.language), opened: (_c = this.dialogConfig) === null || _c === void 0 ? void 0 : _c.visible, onConfirm: this.dialogConfig.onConfirm, onReject: this.dialogConfig.onCancel }, (_d = this.dialogConfig) === null || _d === void 0 ? void 0 : _d.content))));
7583
+ }, onClick: this.handleRemoveLine.bind(this) }, index.h("span", { class: "icon", innerHTML: deleteImagePath })))))), index.h("div", { class: 'border-line' }), index.h("div", { class: "LotteryTippingTicketBet__footer" }, index.h("div", { class: "my-pagination flex justify-between" }, index.h("span", null, translate('lineInfo', this.language, { currentPage: this.currentPage, totalPages: this.totalPages })), index.h("div", { class: 'flex gap-1' }, index.h("span", { class: `btn ${this.currentPage === 1 ? 'disabled' : ''}`, onClick: this.prevPage.bind(this) }, index.h("span", { class: "icon", innerHTML: leftImagePath })), index.h("span", { class: `btn ${this.currentPage === this.totalPages ? 'disabled' : ''}`, onClick: this.nextPage.bind(this) }, index.h("span", { class: "icon", innerHTML: rightImagePath }))))), this.dialogConfig.visible && (index.h("vaadin-confirm-dialog", { rejectButtonVisible: true, rejectText: translate('cancel', this.language), confirmText: translate('confirm', this.language), opened: (_c = this.dialogConfig) === null || _c === void 0 ? void 0 : _c.visible, onConfirm: this.dialogConfig.onConfirm, onReject: this.dialogConfig.onCancel }, (_d = this.dialogConfig) === null || _d === void 0 ? void 0 : _d.content))));
7552
7584
  }
7553
7585
  static get assetsDirs() { return ["../static"]; }
7554
7586
  static get watchers() { return {
@@ -170,12 +170,6 @@ var flush = () => {
170
170
  var nextTick = (cb) => promiseResolve().then(cb);
171
171
  var writeTask = /* @__PURE__ */ queueTask(queueDomWrites, true);
172
172
 
173
- // src/runtime/asset-path.ts
174
- var getAssetPath = (path) => {
175
- const assetUrl = new URL(path, plt.$resourcesUrl$);
176
- return assetUrl.origin !== win.location.origin ? assetUrl.href : assetUrl.pathname;
177
- };
178
-
179
173
  // src/utils/constants.ts
180
174
  var EMPTY_OBJ = {};
181
175
 
@@ -1365,7 +1359,6 @@ var setNonce = (nonce) => plt.$nonce$ = nonce;
1365
1359
 
1366
1360
  exports.bootstrapLazy = bootstrapLazy;
1367
1361
  exports.createEvent = createEvent;
1368
- exports.getAssetPath = getAssetPath;
1369
1362
  exports.getElement = getElement;
1370
1363
  exports.h = h;
1371
1364
  exports.promiseResolve = promiseResolve;
@@ -2,8 +2,8 @@
2
2
 
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
- const lotteryTippingTicketController = require('./lottery-tipping-ticket-controller-a62bd4e8.js');
6
- require('./index-b8586f2f.js');
5
+ const lotteryTippingTicketController = require('./lottery-tipping-ticket-controller-15f47527.js');
6
+ require('./index-3e1fe885.js');
7
7
 
8
8
 
9
9
 
@@ -2,13 +2,13 @@
2
2
 
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
- const index = require('./index-b8586f2f.js');
5
+ const index = require('./index-3e1fe885.js');
6
6
  const appGlobals = require('./app-globals-3a1e7e63.js');
7
7
 
8
8
  const defineCustomElements = async (win, options) => {
9
9
  if (typeof window === 'undefined') return undefined;
10
10
  await appGlobals.globalScripts();
11
- return index.bootstrapLazy([["general-tooltip_6.cjs",[[1,"lottery-tipping-ticket-controller",{"mbSource":[513,"mb-source"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"translationUrl":[513,"translation-url"],"language":[513],"endpoint":[513],"endpointTicket":[513,"endpoint-ticket"],"sessionId":[513,"session-id"],"gameId":[513,"game-id"],"playerId":[513,"player-id"],"drawId":[513,"draw-id"],"isLoading":[32],"bettingTypeOptions":[32],"playingModeOptions":[32],"selectedBettingType":[32],"selectedPlayingMode":[32],"hasSelectBullet":[32],"hasSelectAllBullet":[32],"totalLineCombination":[32],"submitLoading":[32],"rawData":[32],"dialogConfig":[32]},[[0,"lotteryTippingBulletBetSelect","lotteryTippingBulletGroupSelectionHandler"]],{"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"],"mbSource":["handleMbSourceChange"]}],[1,"lottery-tipping-ticket-bet",{"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"],"totalPages":[1538,"total-pages"],"minTotalPages":[514,"min-total-pages"],"maxTotalPages":[514,"max-total-pages"],"mode":[513],"readPretty":[516,"read-pretty"],"defaultBulletConfigLineGroup":[513,"default-bullet-config-line-group"],"translationData":[32],"clientStylingUrlContent":[32],"bulletConfigLineGroup":[32],"currentPage":[32],"isLoading":[32],"hasErrors":[32],"dialogConfig":[32],"ticketDataSource":[32],"resetBulletConfig":[64],"getData":[64]},[[0,"lotteryTippingBulletGroupToggle","lotteryTippingBulletGroupSelectionHandler"]],{"translationUrl":["handleNewTranslations"],"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"],"mbSource":["handleMbSourceChange"],"gameId":["fetchMatchData"],"sessionId":["fetchMatchData"],"drawId":["fetchMatchData"],"currentPage":["handleCurrentPageChange"]}],[1,"lottery-tipping-ticket-banner",{"mbSource":[513,"mb-source"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"language":[513],"translationUrl":[513,"translation-url"],"stopTime":[1,"stop-time"],"period":[1]},null,{"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"],"mbSource":["handleMbSourceChange"]}],[1,"lottery-tipping-bullet-group",{"mbSource":[513,"mb-source"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"positionIdx":[513,"position-idx"],"theme":[513],"mode":[513],"bulletConfigContent":[513,"bullet-config-content"]},[[0,"lotteryTippingBulletToggle","lotteryTippingBulletSelectionHandler"]],{"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"],"mbSource":["handleMbSourceChange"]}],[1,"general-tooltip",{"mbSource":[513,"mb-source"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"position":[1],"delay":[2],"isVisible":[32],"_tooltipId":[32]},[[1,"mouseenter","handleMouseEnterOrFocus"],[0,"focusin","handleMouseEnterOrFocus"],[1,"mouseleave","handleMouseLeaveOrBlur"],[0,"focusout","handleMouseLeaveOrBlur"],[0,"keydown","handleKeyDown"]],{"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"],"mbSource":["handleMbSourceChange"]}],[1,"lottery-tipping-bullet",{"mbSource":[513,"mb-source"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"positionIdx":[514,"position-idx"],"theme":[513],"value":[513],"disabled":[516],"isSelected":[516,"is-selected"]},null,{"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"],"mbSource":["handleMbSourceChange"]}]]]], options);
11
+ return index.bootstrapLazy([["general-tooltip_6.cjs",[[1,"lottery-tipping-ticket-controller",{"mbSource":[513,"mb-source"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"translationUrl":[513,"translation-url"],"language":[513],"logoUrl":[513,"logo-url"],"endpoint":[513],"endpointTicket":[513,"endpoint-ticket"],"sessionId":[513,"session-id"],"gameId":[513,"game-id"],"playerId":[513,"player-id"],"drawId":[513,"draw-id"],"isLoading":[32],"bettingTypeOptions":[32],"playingModeOptions":[32],"selectedBettingType":[32],"selectedPlayingMode":[32],"hasSelectBullet":[32],"hasSelectAllBullet":[32],"totalLineCombination":[32],"submitLoading":[32],"rawData":[32],"dialogConfig":[32]},[[0,"lotteryTippingBulletBetSelect","lotteryTippingBulletGroupSelectionHandler"]],{"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"],"mbSource":["handleMbSourceChange"]}],[1,"lottery-tipping-ticket-bet",{"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"],"totalPages":[1538,"total-pages"],"minTotalPages":[514,"min-total-pages"],"maxTotalPages":[514,"max-total-pages"],"mode":[513],"readPretty":[516,"read-pretty"],"defaultBulletConfigLineGroup":[513,"default-bullet-config-line-group"],"translationData":[32],"clientStylingUrlContent":[32],"bulletConfigLineGroup":[32],"currentPage":[32],"isLoading":[32],"hasErrors":[32],"dialogConfig":[32],"ticketDataSource":[32],"resetBulletConfig":[64],"getData":[64]},[[0,"lotteryTippingBulletGroupToggle","lotteryTippingBulletGroupSelectionHandler"]],{"translationUrl":["handleNewTranslations"],"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"],"mbSource":["handleMbSourceChange"],"gameId":["fetchMatchData"],"sessionId":["fetchMatchData"],"drawId":["fetchMatchData"],"currentPage":["handleCurrentPageChange"]}],[1,"lottery-tipping-ticket-banner",{"mbSource":[513,"mb-source"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"language":[513],"translationUrl":[513,"translation-url"],"logoUrl":[513,"logo-url"],"stopTime":[1,"stop-time"],"period":[1]},null,{"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"],"mbSource":["handleMbSourceChange"]}],[1,"lottery-tipping-bullet-group",{"mbSource":[513,"mb-source"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"positionIdx":[513,"position-idx"],"theme":[513],"mode":[513],"bulletConfigContent":[513,"bullet-config-content"]},[[0,"lotteryTippingBulletToggle","lotteryTippingBulletSelectionHandler"]],{"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"],"mbSource":["handleMbSourceChange"]}],[1,"general-tooltip",{"mbSource":[513,"mb-source"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"position":[1],"delay":[2],"isVisible":[32],"_tooltipId":[32]},[[1,"mouseenter","handleMouseEnterOrFocus"],[0,"focusin","handleMouseEnterOrFocus"],[1,"mouseleave","handleMouseLeaveOrBlur"],[0,"focusout","handleMouseLeaveOrBlur"],[0,"keydown","handleKeyDown"]],{"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"],"mbSource":["handleMbSourceChange"]}],[1,"lottery-tipping-bullet",{"mbSource":[513,"mb-source"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"positionIdx":[514,"position-idx"],"theme":[513],"value":[513],"disabled":[516],"isSelected":[516,"is-selected"]},null,{"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"],"mbSource":["handleMbSourceChange"]}]]]], options);
12
12
  };
13
13
 
14
14
  exports.setNonce = index.setNonce;
@@ -1,6 +1,6 @@
1
1
  'use strict';
2
2
 
3
- const index = require('./index-b8586f2f.js');
3
+ const index = require('./index-3e1fe885.js');
4
4
 
5
5
  /**
6
6
  * @name setClientStyling
@@ -2755,19 +2755,71 @@ const getPlayTypeConfig = ({ rawData, selectedBettingType, selectedPlayingMode }
2755
2755
  return { betTypeId, betType };
2756
2756
  };
2757
2757
 
2758
- const lotteryTippingTicketControllerCss = ".lottery-tipping-ticket-controller__container {\n display: block;\n box-sizing: border-box;\n font-size: 14px;\n container-type: inline-size;\n background: var(--emw--color-background, #fff);\n}\n@container (max-width: 375px) {\n .lottery-tipping-ticket-controller__container {\n font-size: 12px;\n }\n}\n\n.LotteryTippingTicketController__top {\n padding: 1.8rem;\n display: flex;\n flex-direction: column;\n gap: 2rem;\n margin: 0 auto;\n max-width: 800px;\n}\n.LotteryTippingTicketController__row {\n display: flex;\n align-items: center;\n gap: 1rem;\n justify-content: space-between;\n flex-wrap: wrap;\n}\n.LotteryTippingTicketController__section {\n display: flex;\n align-items: center;\n gap: 12px;\n}\n.LotteryTippingTicketController__label {\n font-weight: 500;\n white-space: nowrap;\n width: 6rem;\n color: var(--emw--color-typography-secondary, #333);\n}\n.LotteryTippingTicketController__segmented-control {\n height: 2.2rem;\n display: inline-flex;\n background-color: var(--emw--color-background-secondary, #f5f5f5);\n border-radius: 2rem;\n padding: 0.2rem;\n}\n.LotteryTippingTicketController__segment {\n background-color: transparent;\n border: none;\n padding: 0.3rem 0.8rem;\n cursor: pointer;\n font-weight: 500;\n border-radius: 2rem;\n outline: none;\n transition: background-color 0.25s ease, color 0.25s ease;\n white-space: nowrap;\n color: var(--emw--color-typography, #000);\n}\n.LotteryTippingTicketController__segment--active {\n background-color: var(--emw--color-background, #ffffff);\n color: var(--emw--color-typography, #000);\n font-weight: 600;\n}\n.LotteryTippingTicketController__segment--disabled:hover {\n cursor: not-allowed !important;\n}\n.LotteryTippingTicketController__segment:not(.LotteryTippingTicketController__segment--active):hover {\n background-color: var(--emw--color-background-tertiary, #ccc);\n}\n\n.flex {\n display: flex;\n}\n\n.flex-wrap {\n flex-wrap: wrap;\n}\n\n.align-center {\n align-items: center;\n}\n\n.gap-1 {\n gap: 4px;\n}\n\n.LotteryTippingTicketController__main {\n align-items: flex-start;\n justify-content: center;\n gap: 2rem;\n max-width: 1200px;\n margin: 0 auto;\n padding: 0 20px;\n flex-wrap: wrap;\n}\n.LotteryTippingTicketController__main--left {\n border: 1px solid var(--emw--color-gray-50, #f5f5f5);\n padding: 1rem;\n border-radius: 1rem;\n flex: 1.5;\n}\n.LotteryTippingTicketController__main--right {\n padding: 1rem;\n border-radius: 1rem;\n flex: 1;\n}\n\n.order-summary {\n max-width: 360px;\n width: 100%;\n background: var(--emw--color-background, #fff);\n}\n\n.order-summary__title {\n margin-bottom: 16px;\n text-align: center;\n color: var(--emw--color-typography, #000);\n text-transform: uppercase;\n}\n\n.order-summary__ticket-info {\n display: flex;\n align-items: center;\n margin-bottom: 16px;\n gap: 10px;\n color: var(--emw--color-typography, #000);\n}\n\n.order-summary__ticket {\n font-weight: 500;\n width: 50px;\n text-align: right;\n color: var(--emw--color-typography, #000);\n}\n\n.order-summary__details {\n display: flex;\n align-items: center;\n color: var(--emw--color-typography, #000);\n}\n\n.order-summary__multiplier {\n color: var(--emw--color-typography-secondary, #333);\n margin: 0 8px;\n}\n\n.order-summary__divider {\n border: none;\n border-top: 1px solid var(--emw--color-gray-100, #e6e6e6);\n margin: 20px 0;\n}\n\n.order-summary__button-wrapper {\n display: flex;\n justify-content: center;\n}\n\n.order-summary__button {\n cursor: pointer;\n padding: 0.5rem 4rem;\n background: var(--emw--color-primary, #fed275);\n color: var(--emw--color-typography, #000);\n border-radius: var(--emw--button-border-radius, 4px);\n border: none;\n}\n\n.order-summary__button:not(.order-summary__button--disabled):not(.order-summary__button--loading):hover {\n transform: translateY(-1px);\n background: var(--emw--color-primary-variant, #ffe66f);\n}\n\n.order-summary__button--loading {\n background: var(--emw--color-primary-variant, #ffe66f);\n cursor: not-allowed;\n}\n\n.order-summary__button--disabled {\n background: var(--emw--color-background-secondary, #f5f5f5);\n color: var(--emw--color-typography, #000);\n cursor: not-allowed;\n}\n\n.skeleton-content {\n display: flex;\n flex-direction: column;\n gap: 29px;\n align-items: center;\n}\n\n.skeleton-item {\n background: var(--emw--color-background-secondary, #f5f5f5);\n border-radius: 4px;\n height: 40px;\n width: 200px;\n}\n\n.skeleton-animated {\n animation: skeleton-shimmer 1.5s infinite linear;\n background: linear-gradient(90deg, var(--emw--color-background-secondary, #f5f5f5) 25%, var(--emw--color-background-tertiary, #ccc) 37%, var(--emw--color-background-secondary, #f5f5f5) 63%);\n background-size: 200% 100%;\n}\n\n@keyframes skeleton-shimmer {\n to {\n background-position: 100% 0;\n }\n}";
2758
+ // This icon file is generated automatically.
2759
+ var EllipsisOutlined = { "icon": { "tag": "svg", "attrs": { "viewBox": "64 64 896 896", "focusable": "false" }, "children": [{ "tag": "path", "attrs": { "d": "M176 511a56 56 0 10112 0 56 56 0 10-112 0zm280 0a56 56 0 10112 0 56 56 0 10-112 0zm280 0a56 56 0 10112 0 56 56 0 10-112 0z" } }] }, "name": "ellipsis", "theme": "outlined" };
2760
+ const EllipsisOutlined$1 = EllipsisOutlined;
2761
+
2762
+ var __assign = (undefined && undefined.__assign) || function () {
2763
+ __assign = Object.assign || function(t) {
2764
+ for (var s, i = 1, n = arguments.length; i < n; i++) {
2765
+ s = arguments[i];
2766
+ for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
2767
+ t[p] = s[p];
2768
+ }
2769
+ return t;
2770
+ };
2771
+ return __assign.apply(this, arguments);
2772
+ };
2773
+ var defaultColors = {
2774
+ primaryColor: '#333',
2775
+ secondaryColor: '#E6E6E6'
2776
+ };
2777
+ function renderIconDefinitionToSVGElement(icond, options) {
2778
+ if (options === void 0) { options = {}; }
2779
+ if (typeof icond.icon === 'function') {
2780
+ // two-tone
2781
+ var placeholders = options.placeholders || defaultColors;
2782
+ return renderAbstractNodeToSVGElement(icond.icon(placeholders.primaryColor, placeholders.secondaryColor), options);
2783
+ }
2784
+ // fill, outline
2785
+ return renderAbstractNodeToSVGElement(icond.icon, options);
2786
+ }
2787
+ function renderAbstractNodeToSVGElement(node, options) {
2788
+ var targetAttrs = node.tag === 'svg'
2789
+ ? __assign(__assign({}, node.attrs), (options.extraSVGAttrs || {})) : node.attrs;
2790
+ var attrs = Object.keys(targetAttrs).reduce(function (acc, nextKey) {
2791
+ var key = nextKey;
2792
+ var value = targetAttrs[key];
2793
+ var token = "".concat(key, "=\"").concat(value, "\"");
2794
+ acc.push(token);
2795
+ return acc;
2796
+ }, []);
2797
+ var attrsToken = attrs.length ? ' ' + attrs.join(' ') : '';
2798
+ var children = (node.children || [])
2799
+ .map(function (child) { return renderAbstractNodeToSVGElement(child, options); })
2800
+ .join('');
2801
+ if (children && children.length) {
2802
+ return "<".concat(node.tag).concat(attrsToken, ">").concat(children, "</").concat(node.tag, ">");
2803
+ }
2804
+ return "<".concat(node.tag).concat(attrsToken, " />");
2805
+ }
2806
+
2807
+ const lotteryTippingTicketControllerCss = ".lottery-tipping-ticket-controller__container {\n display: block;\n box-sizing: border-box;\n font-size: 14px;\n container-type: inline-size;\n background: var(--emw--color-background, #fff);\n}\n@container (max-width: 375px) {\n .lottery-tipping-ticket-controller__container {\n font-size: 12px;\n }\n}\n\n.LotteryTippingTicketController__top {\n padding: 1.8rem;\n display: flex;\n flex-direction: column;\n gap: 2rem;\n margin: 0 auto;\n max-width: 800px;\n}\n.LotteryTippingTicketController__row {\n display: flex;\n align-items: center;\n gap: 1rem;\n justify-content: space-between;\n flex-wrap: wrap;\n}\n.LotteryTippingTicketController__section {\n display: flex;\n align-items: center;\n gap: 12px;\n}\n.LotteryTippingTicketController__label {\n font-weight: 500;\n white-space: nowrap;\n width: 6rem;\n color: var(--emw--color-typography-secondary, #333);\n}\n.LotteryTippingTicketController__segmented-control {\n height: 2.2rem;\n display: inline-flex;\n background-color: var(--emw--color-background-secondary, #f5f5f5);\n border-radius: 2rem;\n padding: 0.2rem;\n}\n.LotteryTippingTicketController__segment {\n background-color: transparent;\n border: none;\n padding: 0.3rem 0.8rem;\n cursor: pointer;\n font-weight: 500;\n border-radius: 2rem;\n outline: none;\n transition: background-color 0.25s ease, color 0.25s ease;\n white-space: nowrap;\n color: var(--emw--color-typography, #000);\n}\n.LotteryTippingTicketController__segment--active {\n background-color: var(--emw--color-background, #ffffff);\n color: var(--emw--color-typography, #000);\n font-weight: 600;\n}\n.LotteryTippingTicketController__segment--disabled:hover {\n cursor: not-allowed !important;\n}\n.LotteryTippingTicketController__segment:not(.LotteryTippingTicketController__segment--active):hover {\n background-color: var(--emw--color-background-tertiary, #ccc);\n}\n\n.flex {\n display: flex;\n}\n\n.flex-wrap {\n flex-wrap: wrap;\n}\n\n.align-center {\n align-items: center;\n}\n\n.gap-1 {\n gap: 4px;\n}\n\n.LotteryTippingTicketController__main {\n align-items: flex-start;\n justify-content: center;\n gap: 2rem;\n max-width: 1200px;\n margin: 0 auto;\n padding: 0 20px;\n flex-wrap: wrap;\n}\n.LotteryTippingTicketController__main--left {\n border: 1px solid var(--emw--color-gray-50, #f5f5f5);\n padding: 1rem;\n border-radius: 1rem;\n flex: 1.5;\n}\n.LotteryTippingTicketController__main--right {\n padding: 1rem;\n border-radius: 1rem;\n flex: 1;\n}\n\n.order-summary {\n max-width: 360px;\n width: 100%;\n background: var(--emw--color-background, #fff);\n}\n\n.order-summary__title {\n margin-bottom: 16px;\n text-align: center;\n color: var(--emw--color-typography, #000);\n text-transform: uppercase;\n}\n\n.order-summary__ticket-info {\n display: flex;\n align-items: center;\n margin-bottom: 16px;\n gap: 10px;\n color: var(--emw--color-typography, #000);\n}\n\n.order-summary__ticket {\n font-weight: 500;\n width: 50px;\n text-align: right;\n color: var(--emw--color-typography, #000);\n}\n\n.order-summary__details {\n display: flex;\n align-items: center;\n color: var(--emw--color-typography, #000);\n}\n\n.order-summary__multiplier {\n color: var(--emw--color-typography-secondary, #333);\n margin: 0 8px;\n}\n\n.order-summary__divider {\n border: none;\n border-top: 1px solid var(--emw--color-gray-100, #e6e6e6);\n margin: 20px 0;\n}\n\n.order-summary__button-wrapper {\n display: flex;\n justify-content: center;\n}\n\n.order-summary__button {\n cursor: pointer;\n padding: 0.8rem 4rem;\n background: var(--emw--color-primary, #fed275);\n color: var(--emw--color-typography, #000);\n border-radius: var(--emw--button-border-radius, 4px);\n border: none;\n position: relative;\n}\n\n.loading-icon {\n position: absolute;\n right: 40px;\n top: 10px;\n}\n\n.order-summary__button:not(.order-summary__button--disabled):not(.order-summary__button--loading):hover {\n transform: translateY(-1px);\n background: var(--emw--color-primary-variant, #ffe66f);\n}\n\n.order-summary__button--loading {\n background: var(--emw--color-primary-variant, #ffe66f);\n cursor: not-allowed;\n}\n\n.order-summary__button--disabled {\n background: var(--emw--color-background-secondary, #f5f5f5);\n color: var(--emw--color-typography, #000);\n cursor: not-allowed;\n}\n\n.skeleton-content {\n display: flex;\n flex-direction: column;\n gap: 29px;\n align-items: center;\n}\n\n.skeleton-item {\n background: var(--emw--color-background-secondary, #f5f5f5);\n border-radius: 4px;\n height: 40px;\n width: 200px;\n}\n\n.skeleton-animated {\n animation: skeleton-shimmer 1.5s infinite linear;\n background: linear-gradient(90deg, var(--emw--color-background-secondary, #f5f5f5) 25%, var(--emw--color-background-tertiary, #ccc) 37%, var(--emw--color-background-secondary, #f5f5f5) 63%);\n background-size: 200% 100%;\n}\n\n@keyframes skeleton-shimmer {\n to {\n background-position: 100% 0;\n }\n}\n.loading-icon.scale {\n animation: scale 1s infinite ease-in-out;\n}\n\n@keyframes scale {\n 0%, 100% {\n transform: scale(1);\n }\n 50% {\n transform: scale(1.2);\n }\n}";
2759
2808
  const LotteryTippingTicketControllerStyle0 = lotteryTippingTicketControllerCss;
2760
2809
 
2810
+ const loadingImagePath = renderIconDefinitionToSVGElement(EllipsisOutlined$1, {
2811
+ extraSVGAttrs: { height: '20px', width: '20px', fill: 'currentColor' }
2812
+ });
2761
2813
  const LotteryTippingTicketController = class {
2762
2814
  constructor(hostRef) {
2763
2815
  index.registerInstance(this, hostRef);
2764
2816
  this.logoutEventHandler = index.createEvent(this, "logout", 7);
2765
- this.loadingImagePath = index.getAssetPath('../static/loading.svg');
2766
2817
  this.mbSource = undefined;
2767
2818
  this.clientStyling = undefined;
2768
2819
  this.clientStylingUrl = undefined;
2769
2820
  this.translationUrl = '';
2770
2821
  this.language = 'en';
2822
+ this.logoUrl = undefined;
2771
2823
  this.endpoint = '';
2772
2824
  this.endpointTicket = undefined;
2773
2825
  this.sessionId = undefined;
@@ -3055,11 +3107,11 @@ const LotteryTippingTicketController = class {
3055
3107
  'order-summary__button': true,
3056
3108
  'order-summary__button--disabled': !this.hasSelectAllBullet,
3057
3109
  'order-summary__button--loading': this.submitLoading
3058
- }, onClick: this.handleSubmit.bind(this), disabled: !this.hasSelectAllBullet || this.submitLoading }, index.h("div", { class: "flex align-center gap-1" }, translate('orderSummarySubmit', this.language), this.submitLoading && index.h("img", { src: this.loadingImagePath }))))));
3110
+ }, onClick: this.handleSubmit.bind(this), disabled: !this.hasSelectAllBullet || this.submitLoading }, index.h("span", { class: "order-summary__button--text" }, translate('orderSummarySubmit', this.language)), this.submitLoading && index.h("span", { class: "loading-icon scale", innerHTML: loadingImagePath })))));
3059
3111
  }
3060
3112
  render() {
3061
3113
  var _a, _b, _c, _d, _e, _f, _g;
3062
- return (index.h("div", { key: '0a07c0f2b9d0ba2f72596ca2a39daace665d752f', class: "lottery-tipping-ticket-controller__container", ref: (el) => (this.stylingContainer = el) }, index.h("lottery-tipping-ticket-banner", { key: 'c02cbcab65f5d37455fdf6f416d880e40156f7a5', "client-styling": this.clientStyling, "client-styling-Url": this.clientStylingUrl, stopTime: (_b = (_a = this.rawData) === null || _a === void 0 ? void 0 : _a.currentDraw) === null || _b === void 0 ? void 0 : _b.wagerCloseTime, period: (_d = (_c = this.rawData) === null || _c === void 0 ? void 0 : _c.currentDraw) === null || _d === void 0 ? void 0 : _d.date, language: this.language, "translation-url": this.translationUrl }), this.renderBettingControls(), index.h("div", { key: 'bab9dfd04949e8f6cf41dea54a365beb5ab68c31', class: "flex flex-wrap LotteryTippingTicketController__main" }, index.h("div", { key: '3e60ccac1e6fcac2002f969a15fe5b323778999c', class: "LotteryTippingTicketController__main--left" }, index.h("lottery-tipping-ticket-bet", { key: '687dc500753e860750d436203b7a2585ed37658d', ref: (el) => (this.childRef = el), endpoint: this.endpoint, "session-id": this.sessionId, "game-id": (_e = this.rawData) === null || _e === void 0 ? void 0 : _e.type, "draw-id": this.drawId, language: this.language, "translation-url": this.translationUrl, "max-total-pages": this.lineNumberRange.maxLineNumber, "min-total-pages": this.lineNumberRange.minLineNumber, "total-pages": this.lineNumberRange.defaultBoards, mode: this.selectedPlayingMode === PlayModeEnum.SingleBet ? 'single' : 'multi', "client-styling": this.clientStyling, "client-styling-Url": this.clientStylingUrl })), this.renderOrderSummary()), this.dialogConfig.visible && (index.h("vaadin-confirm-dialog", { key: '4e5ae727ceaff20804a3c7c9acf63f8a3d2bd54d', rejectButtonVisible: true, rejectText: translate('cancel', this.language), confirmText: translate('confirm', this.language), opened: (_f = this.dialogConfig) === null || _f === void 0 ? void 0 : _f.visible, onConfirm: this.dialogConfig.onConfirm, onReject: this.dialogConfig.onCancel }, (_g = this.dialogConfig) === null || _g === void 0 ? void 0 : _g.content))));
3114
+ return (index.h("div", { key: '6b7aee4aacf53744bed1b3f3064b3a8357806ce5', class: "lottery-tipping-ticket-controller__container", ref: (el) => (this.stylingContainer = el) }, index.h("lottery-tipping-ticket-banner", { key: '59907469fbee5440485938631bf311476d2649df', "client-styling": this.clientStyling, "client-styling-Url": this.clientStylingUrl, stopTime: (_b = (_a = this.rawData) === null || _a === void 0 ? void 0 : _a.currentDraw) === null || _b === void 0 ? void 0 : _b.wagerCloseTime, period: (_d = (_c = this.rawData) === null || _c === void 0 ? void 0 : _c.currentDraw) === null || _d === void 0 ? void 0 : _d.date, language: this.language, "translation-url": this.translationUrl, "logo-url": this.logoUrl }), this.renderBettingControls(), index.h("div", { key: '891700a5bb16ce5ddb4be8a0c48c824a97710edd', class: "flex flex-wrap LotteryTippingTicketController__main" }, index.h("div", { key: 'bdc6509e6a560bfaa01a730c3967d3e26c3e9dc9', class: "LotteryTippingTicketController__main--left" }, index.h("lottery-tipping-ticket-bet", { key: '8fbfdf48b51ac3aa8faf51da106131d25ed99992', ref: (el) => (this.childRef = el), endpoint: this.endpoint, "session-id": this.sessionId, "game-id": (_e = this.rawData) === null || _e === void 0 ? void 0 : _e.type, "draw-id": this.drawId, language: this.language, "translation-url": this.translationUrl, "max-total-pages": this.lineNumberRange.maxLineNumber, "min-total-pages": this.lineNumberRange.minLineNumber, "total-pages": this.lineNumberRange.defaultBoards, mode: this.selectedPlayingMode === PlayModeEnum.SingleBet ? 'single' : 'multi', "client-styling": this.clientStyling, "client-styling-Url": this.clientStylingUrl })), this.renderOrderSummary()), this.dialogConfig.visible && (index.h("vaadin-confirm-dialog", { key: 'a93fcec56f649438c6f0d3668d322885dd4da7dc', rejectButtonVisible: true, rejectText: translate('cancel', this.language), confirmText: translate('confirm', this.language), opened: (_f = this.dialogConfig) === null || _f === void 0 ? void 0 : _f.visible, onConfirm: this.dialogConfig.onConfirm, onReject: this.dialogConfig.onCancel }, (_g = this.dialogConfig) === null || _g === void 0 ? void 0 : _g.content))));
3063
3115
  }
3064
3116
  static get assetsDirs() { return ["../static"]; }
3065
3117
  static get watchers() { return {
@@ -3074,6 +3126,7 @@ exports.LotteryTippingTicketController = LotteryTippingTicketController;
3074
3126
  exports.format = format;
3075
3127
  exports.formatDate = formatDate;
3076
3128
  exports.parseISO = parseISO;
3129
+ exports.renderIconDefinitionToSVGElement = renderIconDefinitionToSVGElement;
3077
3130
  exports.requiredArgs = requiredArgs;
3078
3131
  exports.resolveTranslationUrl = resolveTranslationUrl;
3079
3132
  exports.setClientStyling = setClientStyling;
@@ -2,7 +2,7 @@
2
2
 
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
- const index = require('./index-b8586f2f.js');
5
+ const index = require('./index-3e1fe885.js');
6
6
  const appGlobals = require('./app-globals-3a1e7e63.js');
7
7
 
8
8
  /*
@@ -19,7 +19,7 @@ var patchBrowser = () => {
19
19
 
20
20
  patchBrowser().then(async (options) => {
21
21
  await appGlobals.globalScripts();
22
- return index.bootstrapLazy([["general-tooltip_6.cjs",[[1,"lottery-tipping-ticket-controller",{"mbSource":[513,"mb-source"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"translationUrl":[513,"translation-url"],"language":[513],"endpoint":[513],"endpointTicket":[513,"endpoint-ticket"],"sessionId":[513,"session-id"],"gameId":[513,"game-id"],"playerId":[513,"player-id"],"drawId":[513,"draw-id"],"isLoading":[32],"bettingTypeOptions":[32],"playingModeOptions":[32],"selectedBettingType":[32],"selectedPlayingMode":[32],"hasSelectBullet":[32],"hasSelectAllBullet":[32],"totalLineCombination":[32],"submitLoading":[32],"rawData":[32],"dialogConfig":[32]},[[0,"lotteryTippingBulletBetSelect","lotteryTippingBulletGroupSelectionHandler"]],{"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"],"mbSource":["handleMbSourceChange"]}],[1,"lottery-tipping-ticket-bet",{"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"],"totalPages":[1538,"total-pages"],"minTotalPages":[514,"min-total-pages"],"maxTotalPages":[514,"max-total-pages"],"mode":[513],"readPretty":[516,"read-pretty"],"defaultBulletConfigLineGroup":[513,"default-bullet-config-line-group"],"translationData":[32],"clientStylingUrlContent":[32],"bulletConfigLineGroup":[32],"currentPage":[32],"isLoading":[32],"hasErrors":[32],"dialogConfig":[32],"ticketDataSource":[32],"resetBulletConfig":[64],"getData":[64]},[[0,"lotteryTippingBulletGroupToggle","lotteryTippingBulletGroupSelectionHandler"]],{"translationUrl":["handleNewTranslations"],"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"],"mbSource":["handleMbSourceChange"],"gameId":["fetchMatchData"],"sessionId":["fetchMatchData"],"drawId":["fetchMatchData"],"currentPage":["handleCurrentPageChange"]}],[1,"lottery-tipping-ticket-banner",{"mbSource":[513,"mb-source"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"language":[513],"translationUrl":[513,"translation-url"],"stopTime":[1,"stop-time"],"period":[1]},null,{"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"],"mbSource":["handleMbSourceChange"]}],[1,"lottery-tipping-bullet-group",{"mbSource":[513,"mb-source"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"positionIdx":[513,"position-idx"],"theme":[513],"mode":[513],"bulletConfigContent":[513,"bullet-config-content"]},[[0,"lotteryTippingBulletToggle","lotteryTippingBulletSelectionHandler"]],{"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"],"mbSource":["handleMbSourceChange"]}],[1,"general-tooltip",{"mbSource":[513,"mb-source"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"position":[1],"delay":[2],"isVisible":[32],"_tooltipId":[32]},[[1,"mouseenter","handleMouseEnterOrFocus"],[0,"focusin","handleMouseEnterOrFocus"],[1,"mouseleave","handleMouseLeaveOrBlur"],[0,"focusout","handleMouseLeaveOrBlur"],[0,"keydown","handleKeyDown"]],{"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"],"mbSource":["handleMbSourceChange"]}],[1,"lottery-tipping-bullet",{"mbSource":[513,"mb-source"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"positionIdx":[514,"position-idx"],"theme":[513],"value":[513],"disabled":[516],"isSelected":[516,"is-selected"]},null,{"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"],"mbSource":["handleMbSourceChange"]}]]]], options);
22
+ return index.bootstrapLazy([["general-tooltip_6.cjs",[[1,"lottery-tipping-ticket-controller",{"mbSource":[513,"mb-source"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"translationUrl":[513,"translation-url"],"language":[513],"logoUrl":[513,"logo-url"],"endpoint":[513],"endpointTicket":[513,"endpoint-ticket"],"sessionId":[513,"session-id"],"gameId":[513,"game-id"],"playerId":[513,"player-id"],"drawId":[513,"draw-id"],"isLoading":[32],"bettingTypeOptions":[32],"playingModeOptions":[32],"selectedBettingType":[32],"selectedPlayingMode":[32],"hasSelectBullet":[32],"hasSelectAllBullet":[32],"totalLineCombination":[32],"submitLoading":[32],"rawData":[32],"dialogConfig":[32]},[[0,"lotteryTippingBulletBetSelect","lotteryTippingBulletGroupSelectionHandler"]],{"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"],"mbSource":["handleMbSourceChange"]}],[1,"lottery-tipping-ticket-bet",{"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"],"totalPages":[1538,"total-pages"],"minTotalPages":[514,"min-total-pages"],"maxTotalPages":[514,"max-total-pages"],"mode":[513],"readPretty":[516,"read-pretty"],"defaultBulletConfigLineGroup":[513,"default-bullet-config-line-group"],"translationData":[32],"clientStylingUrlContent":[32],"bulletConfigLineGroup":[32],"currentPage":[32],"isLoading":[32],"hasErrors":[32],"dialogConfig":[32],"ticketDataSource":[32],"resetBulletConfig":[64],"getData":[64]},[[0,"lotteryTippingBulletGroupToggle","lotteryTippingBulletGroupSelectionHandler"]],{"translationUrl":["handleNewTranslations"],"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"],"mbSource":["handleMbSourceChange"],"gameId":["fetchMatchData"],"sessionId":["fetchMatchData"],"drawId":["fetchMatchData"],"currentPage":["handleCurrentPageChange"]}],[1,"lottery-tipping-ticket-banner",{"mbSource":[513,"mb-source"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"language":[513],"translationUrl":[513,"translation-url"],"logoUrl":[513,"logo-url"],"stopTime":[1,"stop-time"],"period":[1]},null,{"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"],"mbSource":["handleMbSourceChange"]}],[1,"lottery-tipping-bullet-group",{"mbSource":[513,"mb-source"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"positionIdx":[513,"position-idx"],"theme":[513],"mode":[513],"bulletConfigContent":[513,"bullet-config-content"]},[[0,"lotteryTippingBulletToggle","lotteryTippingBulletSelectionHandler"]],{"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"],"mbSource":["handleMbSourceChange"]}],[1,"general-tooltip",{"mbSource":[513,"mb-source"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"position":[1],"delay":[2],"isVisible":[32],"_tooltipId":[32]},[[1,"mouseenter","handleMouseEnterOrFocus"],[0,"focusin","handleMouseEnterOrFocus"],[1,"mouseleave","handleMouseLeaveOrBlur"],[0,"focusout","handleMouseLeaveOrBlur"],[0,"keydown","handleKeyDown"]],{"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"],"mbSource":["handleMbSourceChange"]}],[1,"lottery-tipping-bullet",{"mbSource":[513,"mb-source"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"positionIdx":[514,"position-idx"],"theme":[513],"value":[513],"disabled":[516],"isSelected":[516,"is-selected"]},null,{"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"],"mbSource":["handleMbSourceChange"]}]]]], options);
23
23
  });
24
24
 
25
25
  exports.setNonce = index.setNonce;
@@ -61,8 +61,6 @@
61
61
  }
62
62
  }
63
63
  .pill {
64
- border: 1px solid var(--emw--color-gray-150, #6f6f6f);
65
- border-radius: 0.4rem;
66
64
  padding: 0.25rem 0.7rem;
67
65
  font-size: 0.9rem;
68
66
  color: var(--emw--color-gray-400, #000);
@@ -1,9 +1,9 @@
1
- import { getAssetPath, h } from "@stencil/core";
1
+ import { h } from "@stencil/core";
2
2
  import { setClientStyling, setClientStylingURL, setStreamStyling } from "../../../../../../../../libs/common/src/styling/index";
3
3
  import { isToday } from "date-fns";
4
+ import { resolveTranslationUrl } from "../../utils/locale.utils";
4
5
  import { formatDate } from "../../utils/utils";
5
6
  import { translate } from "./locale.utils";
6
- import { resolveTranslationUrl } from "../../utils/locale.utils";
7
7
  export class LotteryTippingTicketBanner {
8
8
  constructor() {
9
9
  this.mbSource = undefined;
@@ -11,6 +11,7 @@ export class LotteryTippingTicketBanner {
11
11
  this.clientStylingUrl = undefined;
12
12
  this.language = 'en';
13
13
  this.translationUrl = '';
14
+ this.logoUrl = undefined;
14
15
  this.stopTime = '';
15
16
  this.period = undefined;
16
17
  }
@@ -67,8 +68,7 @@ export class LotteryTippingTicketBanner {
67
68
  this.stylingSubscription && this.stylingSubscription.unsubscribe();
68
69
  }
69
70
  render() {
70
- const backgroundImagePath = getAssetPath('../static/poolgame-bg.webp');
71
- return (h("div", { key: '07515ab821761d26edcc285f83f6e81dfab269ca', ref: (el) => (this.stylingContainer = el), class: "lottery-tipping-ticket-banner__container" }, h("section", { key: 'bbd8a3ae1b718f77b726dc89be4f901757579541', class: "banner" }, h("div", { key: '2b1883da2db0bfae83e5b4997c999fff433eb7a8', class: "left" }, h("img", { key: '54b482734d27bdfbbd2983bc95704273195fdd0d', alt: "Betting", src: backgroundImagePath, class: "logo" })), h("div", { key: '2a735ea687f0aaea72b0142f7026c9da0e15195d', class: "mid period" }, this.formattedPeriod), h("div", { key: '9c797b4a3bc6d2f0a69f4fd8af07f80eb765d0aa', class: "right" }, h("span", { key: '8c3abf153cf7f9ee1e2afcd42f67f7d90fe2f2a6', class: "pill" }, h("strong", { key: '4b3d99c269b4f494f62cbacc943f93f248004a96' }, translate('stop', this.language)), "\u00A0", translate('at', this.language), "\u00A0", this.formattedStopTime)))));
71
+ return (h("div", { key: '8b8b9d66021090e8a4f566e11908341fb6a65bad', ref: (el) => (this.stylingContainer = el), class: "lottery-tipping-ticket-banner__container" }, h("section", { key: '37d23ad6aca6c4a02283a78e6011d0c6e4f81dff', class: "banner" }, h("div", { key: '919a9f7535468d5d75fa21e5c48c56c6c994aea7', class: "left" }, this.logoUrl && h("img", { key: '1d8e9f3e9ed7eaec36b604401c0a4045d735c209', alt: "Betting", src: this.logoUrl, class: "logo" })), h("div", { key: '3cdc189bcab34d964e6a17339c60e449ba4883d7', class: "mid period" }, this.formattedPeriod), h("div", { key: '526f90497ed8a14ba03d04cffbbe7c263b0bd23c', class: "right" }, h("span", { key: '00676d5b0fae7ad7b4d2cf549572ae7b3d3091c1', class: "pill" }, h("strong", { key: 'dde2bac5a9316cf97d34a19a433e6bcb74d50750' }, translate('stop', this.language)), "\u00A0", translate('at', this.language), "\u00A0", this.formattedStopTime)))));
72
72
  }
73
73
  static get is() { return "lottery-tipping-ticket-banner"; }
74
74
  static get encapsulation() { return "shadow"; }
@@ -172,6 +172,23 @@ export class LotteryTippingTicketBanner {
172
172
  "reflect": true,
173
173
  "defaultValue": "''"
174
174
  },
175
+ "logoUrl": {
176
+ "type": "string",
177
+ "mutable": false,
178
+ "complexType": {
179
+ "original": "string",
180
+ "resolved": "string",
181
+ "references": {}
182
+ },
183
+ "required": false,
184
+ "optional": false,
185
+ "docs": {
186
+ "tags": [],
187
+ "text": "logo image URL for the header section"
188
+ },
189
+ "attribute": "logo-url",
190
+ "reflect": true
191
+ },
175
192
  "stopTime": {
176
193
  "type": "string",
177
194
  "mutable": false,
@@ -157,11 +157,18 @@
157
157
 
158
158
  .order-summary__button {
159
159
  cursor: pointer;
160
- padding: 0.5rem 4rem;
160
+ padding: 0.8rem 4rem;
161
161
  background: var(--emw--color-primary, #fed275);
162
162
  color: var(--emw--color-typography, #000);
163
163
  border-radius: var(--emw--button-border-radius, 4px);
164
164
  border: none;
165
+ position: relative;
166
+ }
167
+
168
+ .loading-icon {
169
+ position: absolute;
170
+ right: 40px;
171
+ top: 10px;
165
172
  }
166
173
 
167
174
  .order-summary__button:not(.order-summary__button--disabled):not(.order-summary__button--loading):hover {
@@ -204,4 +211,16 @@
204
211
  to {
205
212
  background-position: 100% 0;
206
213
  }
214
+ }
215
+ .loading-icon.scale {
216
+ animation: scale 1s infinite ease-in-out;
217
+ }
218
+
219
+ @keyframes scale {
220
+ 0%, 100% {
221
+ transform: scale(1);
222
+ }
223
+ 50% {
224
+ transform: scale(1.2);
225
+ }
207
226
  }