@everymatrix/lottery-tipping-page 0.1.5 → 0.1.7

package/dist/cjs/{general-tooltip_7.cjs.entry.js → general-multi-select_13.cjs.entry.js}

@@ -2,8 +2,154 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-335e7b86.js');
-const lotteryTippingPage = require('./lottery-tipping-page-6e72415a.js');
+const index = require('./index-eb012321.js');
+const lotteryTippingPage = require('./lottery-tipping-page-80f111ca.js');
+
+const generalMultiSelectCss = ".multi-select-container{position:relative;font-family:\"Inter\", sans-serif;margin-top:4px;width:100%}.flex-row{display:flex;flex-direction:row;align-items:center;flex-wrap:nowrap;padding:8px 12px;padding-right:4px;border-radius:4px;background:var(--emw-selector-color-background, #e8ebef);cursor:pointer}.control{flex:1;display:flex;align-items:center;flex-wrap:nowrap;overflow:hidden}.control:focus-within{border-color:var(--emw--color-primary, #fed275);box-shadow:0 0 0 2px var(--emw--button-box-shadow-color-secondary, rgba(0, 0, 0, 0.15))}.chip{display:inline-flex;align-items:center;background:var(--emw--color-gray-50, #f5f5f5);color:var(--emw--color-typography, #555);border-radius:4px;padding:2px 8px;margin-right:6px;font-size:0.875rem;line-height:1.2;justify-content:space-between;flex:0 1 auto;min-width:0}.chip-text{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.overflow-chip{background:var(--emw--color-gray-100, #e6e6e6);color:var(--emw--color-gray-300, #333);width:20px;text-align:center;display:block}.remove-btn{background:none;border:none;font-size:1rem;margin-left:6px;cursor:pointer;color:var(--emw--color-gray-150, #6f6f6f)}.remove-btn:hover{color:var(--emw--color-error, red)}.placeholder{color:var(--emw--color-gray-150, #6f6f6f);font-size:0.875rem;padding:3px 8px;line-height:1.2}.arrow{margin-left:auto;font-size:0.8rem;width:20px;color:var(--emw--color-gray-150, #6f6f6f)}.dropdown{position:absolute;top:calc(100% + 4px);left:0;width:100%;max-height:240px;overflow-y:auto;border:1px solid var(--emw--color-gray-100, #e6e6e6);border-radius:6px;background:var(--emw--color-background, #ffffff);box-shadow:0 4px 12px var(--emw--button-box-shadow-color-secondary, rgba(0, 0, 0, 0.15));z-index:10}.dropdown-item{padding:10px 14px;cursor:pointer;font-size:0.875rem;line-height:1.4;transition:background 0.2s}.dropdown-item:hover{background:var(--emw--color-gray-100, #f4f5f7)}.dropdown-item.selected{background:var(--emw--color-primary-variant, #bae7ff);color:var(--emw--color-primary, #0050b3);font-weight:500}.overflow-popover{position:absolute;top:var(--overflow-top, 0px);left:var(--overflow-left, 0px);max-width:200px;padding:12px;display:flex;flex-wrap:wrap;gap:6px;border:1px solid var(--emw--color-gray-100, #d0d5dd);border-radius:6px;background:var(--emw--color-background, #ffffff);box-shadow:0 4px 12px var(--emw--button-box-shadow-color-secondary, rgba(0, 0, 0, 0.15));z-index:20}";
+const GeneralMultiSelectStyle0 = generalMultiSelectCss;
+
+const GeneralMultiSelect = class {
+    constructor(hostRef) {
+        index.registerInstance(this, hostRef);
+        this.change = index.createEvent(this, "change", 7);
+        this.handleOutsideClick = (e) => {
+            // If click happens outside our component root, close both panels
+            const path = e.composedPath();
+            if (!path.includes(this.el)) {
+                this.dropdownOpen = false;
+                this.overflowOpen = false;
+            }
+        };
+        this.toggleDropdown = (e) => {
+            e.stopPropagation();
+            this.dropdownOpen = !this.dropdownOpen;
+            this.overflowOpen = false; // close overflow if open
+        };
+        this.isSelected = (value) => this.selectedValues.includes(value);
+        this.selectItem = (item) => {
+            if (!this.isSelected(item.value)) {
+                this.selectedValues = [...this.selectedValues, item.value];
+                this.change.emit(this.selectedValues);
+            }
+        };
+        this.toggleItem = (item) => {
+            if (this.isSelected(item.value)) {
+                this.removeItem(item.value);
+            }
+            else {
+                this.selectItem(item);
+            }
+        };
+        this.removeItem = (value, e) => {
+            e && e.stopPropagation();
+            this.selectedValues = this.selectedValues.filter((v) => v !== value);
+            this.change.emit(this.selectedValues);
+        };
+        this.downIcon = index.getAssetPath('../static/dropdown.svg');
+        this.upIcon = index.getAssetPath('../static/dropup.svg');
+        /** Touch-capable device? */
+        this.isTouch = 'ontouchstart' in window;
+        /** Open overflow popover */
+        this.openOverflow = () => {
+            if (!this.isTouch) {
+                // hover only on non-touch
+                this.computePopoverPosition();
+                this.overflowOpen = true;
+            }
+        };
+        /** Close overflow popover */
+        this.closeOverflow = () => {
+            if (!this.isTouch) {
+                this.overflowOpen = false;
+            }
+        };
+        this.toggleOverflow = (e) => {
+            e.stopPropagation();
+            this.computePopoverPosition();
+            this.overflowOpen = !this.overflowOpen;
+        };
+        this.mbSource = undefined;
+        this.clientStyling = undefined;
+        this.clientStylingUrl = undefined;
+        this.options = [];
+        this.maxVisibleChips = 2;
+        this.placeholder = '';
+        this.selectedValues = [];
+        this.dropdownOpen = false;
+        this.overflowOpen = false;
+        this.popoverStyle = { top: '0px', left: '0px' };
+    }
+    handleClientStylingChange(newValue, oldValue) {
+        if (newValue != oldValue) {
+            lotteryTippingPage.setClientStyling(this.stylingContainer, this.clientStyling);
+        }
+    }
+    handleClientStylingUrlChange(newValue, oldValue) {
+        if (newValue != oldValue) {
+            lotteryTippingPage.setClientStylingURL(this.stylingContainer, this.clientStylingUrl);
+        }
+    }
+    handleMbSourceChange(newValue, oldValue) {
+        if (newValue != oldValue) {
+            lotteryTippingPage.setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
+        }
+    }
+    componentDidLoad() {
+        if (this.stylingContainer) {
+            if (this.mbSource)
+                lotteryTippingPage.setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
+            if (this.clientStyling)
+                lotteryTippingPage.setClientStyling(this.stylingContainer, this.clientStyling);
+            if (this.clientStylingUrl)
+                lotteryTippingPage.setClientStylingURL(this.stylingContainer, this.clientStylingUrl);
+        }
+    }
+    async clear() {
+        this.selectedValues = [];
+        this.change.emit(this.selectedValues);
+    }
+    componentWillLoad() {
+        // Listen for clicks anywhere to close panels on outside click
+        document.addEventListener('click', this.handleOutsideClick);
+    }
+    disconnectedCallback() {
+        document.removeEventListener('click', this.handleOutsideClick);
+        this.stylingSubscription && this.stylingSubscription.unsubscribe();
+    }
+    get selectedOptions() {
+        return this.options.filter((o) => this.isSelected(o.value));
+    }
+    get visibleChips() {
+        return this.selectedOptions.slice(0, this.maxVisibleChips);
+    }
+    get hiddenChips() {
+        return this.selectedOptions.slice(this.maxVisibleChips);
+    }
+    computePopoverPosition() {
+        if (this.overflowChipEl && this.el) {
+            const { left: overflowChipElLeft } = this.overflowChipEl.getBoundingClientRect();
+            const { left: elLeft, height } = this.el.getBoundingClientRect();
+            this.popoverStyle = {
+                top: `${height - 10}px`,
+                left: `${overflowChipElLeft - elLeft}px`
+            };
+        }
+    }
+    render() {
+        var _a;
+        return (index.h("div", { key: '50b48397be3ede1907ab2c2abcd1cf2f43f69c13', class: "general-multi-select-container", ref: (el) => (this.stylingContainer = el) }, index.h("div", { key: '696a1bb1f221f8f5cf290fac040af10e2e5a115e', class: "multi-select-container", ref: (el) => (this.el = el) }, index.h("div", { key: '9ea92f01787b26d43054573a11896cf65065b073', class: "flex-row", onClick: this.toggleDropdown }, index.h("div", { key: 'f79720ca3ec383ee7f95b09483698ee18119c79a', class: "control" }, this.visibleChips.map((opt) => (index.h("span", { class: "chip" }, index.h("div", { class: "chip-text", title: opt.text }, opt.text), index.h("div", { class: "remove-btn", onClick: (e) => this.removeItem(opt.value, e) }, "\u00D7")))), this.hiddenChips.length > 0 && (index.h("span", { key: '25e9e527c33dd7a315dacb10cc51084fe69b9b7e', class: "chip overflow-chip", ref: (el) => (this.overflowChipEl = el), onMouseEnter: this.openOverflow, onMouseLeave: this.closeOverflow, onClick: this.toggleOverflow }, "\u2022\u2022\u2022")), this.selectedValues.length === 0 && index.h("span", { key: 'b061de660a55f7a0d41ce9aa650108d3f38a9dc0', class: "placeholder" }, this.placeholder)), index.h("div", { key: 'f83b6517e88b3976cdc18590f8f1233cb2515230', class: "arrow" }, index.h("img", { key: '1b61a49090237057b98e5ce8a4f7c1e3bfc9d4ba', class: "info-icon", src: this.dropdownOpen ? this.upIcon : this.downIcon, style: { width: '18px' } }))), this.dropdownOpen && (index.h("div", { key: 'e5b081007bcbdd251ce5ac235c1f19f17852c420', class: "dropdown" }, this.options.map((opt) => (index.h("div", { class: {
+                'dropdown-item': true,
+                selected: this.isSelected(opt.value)
+            }, onClick: () => this.toggleItem(opt) }, opt.text))))), this.overflowOpen && !!((_a = this.hiddenChips) === null || _a === void 0 ? void 0 : _a.length) && (index.h("div", { key: 'f8e3289042c69c569bebcd0a40d90f31261c6c12', class: "overflow-popover", style: { top: this.popoverStyle.top, left: this.popoverStyle.left }, onMouseEnter: this.openOverflow, onMouseLeave: this.closeOverflow }, this.hiddenChips.map((opt) => (index.h("span", { class: "chip" }, index.h("span", { class: "chip-text", title: opt.text }, opt.text), index.h("span", { class: "remove-btn", onClick: (e) => this.removeItem(opt.value, e) }, "\u00D7")))))))));
+    }
+    static get assetsDirs() { return ["../static"]; }
+    static get watchers() { return {
+        "clientStyling": ["handleClientStylingChange"],
+        "clientStylingUrl": ["handleClientStylingUrlChange"],
+        "mbSource": ["handleMbSourceChange"]
+    }; }
+};
+GeneralMultiSelect.style = GeneralMultiSelectStyle0;
 
 const generalTooltipCss = ".general-tooltip-wrapper{display:inline-block;position:relative;line-height:0}.general-tooltip-container{display:contents;}.general-tooltip-popup{position:absolute;background-color:var(--emw--color-gray-300, #333);color:var(--emw--color-background, #fff);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}";
 const GeneralTooltipStyle0 = generalTooltipCss;
@@ -258,6 +404,148 @@ const LotteryTippingBulletGroup = class {
 };
 LotteryTippingBulletGroup.style = LotteryTippingBulletGroupStyle0;
 
+const DEFAULT_LANGUAGE$4 = 'en';
+const SUPPORTED_LANGUAGES$4 = ['ro', 'en', 'fr', 'ar', 'hr'];
+const TRANSLATIONS$4 = {
+    en: {
+        cancel: 'Cancel',
+        confirm: 'Confirm'
+    },
+    ro: {
+        cancel: 'Anulează',
+        confirm: 'Confirmă'
+    },
+    fr: {
+        cancel: 'Annuler',
+        confirm: 'Confirmer'
+    },
+    ar: {
+        cancel: 'إلغاء',
+        confirm: 'تأكيد'
+    },
+    hr: {
+        cancel: 'Odustani',
+        confirm: 'Potvrdi'
+    }
+};
+const translate$4 = (key, customLang) => {
+    const lang = customLang;
+    return TRANSLATIONS$4[lang !== undefined && SUPPORTED_LANGUAGES$4.includes(lang) ? lang : DEFAULT_LANGUAGE$4][key];
+};
+const getTranslations$3 = (data) => {
+    Object.keys(data).forEach((item) => {
+        for (let key in data[item]) {
+            TRANSLATIONS$4[item][key] = data[item][key];
+        }
+    });
+};
+
+const lotteryTippingDialogCss = ".dialog-wrapper{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;visibility:hidden;opacity:1}.dialog-wrapper-visible{visibility:visible}.mask{position:fixed;inset:0;background-color:rgba(0, 0, 0, 0.5);opacity:0;z-index:1000;transition:opacity var(--duration) linear}.mask-enter{opacity:1}.mask-leave{opacity:0}.dialog{position:relative;background:var(--emw--color-background, #fff);border-radius:12px;box-shadow:0 4px 32px rgba(0, 0, 0, 0.15);opacity:0;transform:scale(0.9);transition:all var(--duration) linear;width:100%;max-width:100vw;min-height:200px;overflow:hidden;z-index:1000}.dialog-enter{opacity:1;transform:scale(1)}.dialog-leave{opacity:0}.dialog.fullscreen{width:100vw !important;height:100vh;overflow:auto;max-height:none;border-radius:0;overflow:hidden}.dialog-header{padding:16px 16px 0 16px;display:flex;justify-content:space-between;align-items:center}.dialog-header .dialog-title{margin:0;font-size:1.25rem;font-weight:500;color:var(--emw--color-gray-300, #333)}.dialog-header .close-btn{background:transparent;border:none;font-size:1.5rem;width:2rem;height:2rem;color:var(--emw--color-gray-150, #6f6f6f);cursor:pointer;border-radius:4px}.dialog-header .close-btn:hover{background:var(--emw--color-gray-50, #f5f5f5);color:var(--emw--color-gray-300, #333)}.dialog-content{padding:24px;font-size:0.95rem;line-height:1.6;color:var(--emw--color-gray-300, #333);flex:1;overflow-y:auto;max-height:calc(100vh - 200px)}.dialog.fullscreen .dialog-content{max-height:none}.dialog-footer{padding:0 16px 16px 16px;display:flex;justify-content:center;gap:12px}.dialog-footer .cancel-btn,.dialog-footer .confirm-btn{padding:10px 24px;border-radius:6px;font-size:0.9rem;cursor:pointer;transition:all 0.3s linear}.dialog-footer .cancel-btn{border:var(--emw--button-border, 1px solid rgba(221, 221, 221, 0.8666666667));color:var(--emw--color-gray-300, #333);background:var(--emw--color-background, #fff)}.dialog-footer .cancel-btn:hover{border-color:var(--emw--color-gray-100, #e6e6e6)}.dialog-footer .confirm-btn{border:none;color:var(--emw--color-background, #fff);background:var(--emw-pool-game-acition-normal, #4a90e2);box-shadow:0 2px 4px rgba(74, 144, 226, 0.2)}.dialog-footer .confirm-btn:hover{background:var(--emw-pool-game-action-hover, #357abd)}@media screen and (max-width: 480px){.dialog.fullscreen .dialog-content{padding:12px}}";
+const LotteryTippingDialogStyle0 = lotteryTippingDialogCss;
+
+const LotteryTippingDialog = class {
+    constructor(hostRef) {
+        index.registerInstance(this, hostRef);
+        this.open = index.createEvent(this, "open", 7);
+        this.close = index.createEvent(this, "close", 7);
+        this.confirm = index.createEvent(this, "confirm", 7);
+        this.cancel = index.createEvent(this, "cancel", 7);
+        this.wasVisible = false;
+        this.mbSource = undefined;
+        this.clientStyling = '';
+        this.clientStylingUrl = '';
+        this.visible = undefined;
+        this.dialogTitle = '';
+        this.width = '520px';
+        this.closable = true;
+        this.mask = true;
+        this.maskClosable = true;
+        this.animationDuration = 300;
+        this.fullscreen = false;
+        this.showFooter = true;
+        this.showCancelBtn = true;
+        this.language = 'en';
+        this.translationUrl = undefined;
+    }
+    handleClientStylingChange(newValue, oldValue) {
+        if (newValue != oldValue) {
+            lotteryTippingPage.setClientStyling(this.stylingContainer, this.clientStyling);
+        }
+    }
+    handleClientStylingUrlChange(newValue, oldValue) {
+        if (newValue != oldValue) {
+            lotteryTippingPage.setClientStylingURL(this.stylingContainer, this.clientStylingUrl);
+        }
+    }
+    handleMbSourceChange(newValue, oldValue) {
+        if (newValue != oldValue) {
+            lotteryTippingPage.setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
+        }
+    }
+    componentWillLoad() {
+        if (this.translationUrl) {
+            getTranslations$3(JSON.parse(this.translationUrl));
+        }
+    }
+    componentWillUpdate() {
+        if (this.visible && !this.wasVisible) {
+            this.disableBodyScroll();
+        }
+        else if (!this.visible && this.wasVisible) {
+            this.enableBodyScroll();
+        }
+        this.wasVisible = this.visible;
+    }
+    disconnectedCallback() {
+        this.enableBodyScroll();
+    }
+    disableBodyScroll() {
+        document.body.style.overflow = 'hidden';
+    }
+    enableBodyScroll() {
+        document.body.style.overflow = '';
+    }
+    handleClose() {
+        this.visible = false;
+        this.cancel.emit();
+    }
+    handleMaskClick(e) {
+        if (this.maskClosable && e.target === this.el.querySelector('.mask')) {
+            this.visible = false;
+            this.cancel.emit();
+        }
+    }
+    handleConfirm() {
+        this.visible = false;
+        this.confirm.emit();
+    }
+    render() {
+        const dialogStyle = {
+            width: typeof this.width === 'number' ? `${this.width}px` : this.width,
+            '--duration': `${this.animationDuration}ms`
+        };
+        const dialogWrapperClass = ['dialog-wrapper', this.visible ? 'dialog-wrapper-visible' : ''];
+        const maskClass = ['mask', this.visible ? 'mask-enter' : 'mask-leave'];
+        const dialogClass = [
+            'dialog',
+            this.visible ? 'dialog-enter' : 'dialog-leave',
+            this.fullscreen ? 'fullscreen' : ''
+        ].join(' ');
+        const contentStyle = {
+            maxHeight: 'calc(100vh - 62px)',
+            overflowY: 'auto'
+        };
+        return (index.h("div", { key: 'cf311658c951f1d8af6d015f02b30e5cfd14e972', class: dialogWrapperClass.join(' ') }, index.h("div", { key: 'bec49cd133029ca0db51462db39a6b1957d285c7', class: maskClass.join(' '), onClick: this.handleMaskClick.bind(this) }), index.h("div", { key: '7d9b2faf2fee0d483acfc00e4820d0aac82a718a', class: dialogClass, style: dialogStyle, role: "dialog", "aria-modal": "true", "aria-labelledby": "dialog-title" }, index.h("div", { key: '9d4c2471258cab88ad9ed6a05e513815d96f13a9', class: "dialog-header" }, index.h("h2", { key: '8bd30b19c31eb9fddebe8d19c6af454a89f5d234', id: "dialog-title", class: "dialog-title" }, this.dialogTitle), this.closable && (index.h("button", { key: 'f8e4dfebc9506a6aa79e1c68abdd42686a7bbc2f', class: "close-btn", onClick: this.handleClose.bind(this) }, "x"))), index.h("div", { key: 'b21127dfcb5912d35d41260798d82c15b59335ef', class: "dialog-content", style: contentStyle }, index.h("slot", { key: 'ca0dedda350d3aef9e54202f8e7add236d0a8795' })), this.showFooter && (index.h("div", { key: '2d7ccaf4414d509f30db1909948452efaf74aec1', class: "dialog-footer" }, index.h("slot", { key: '1f6d67f646936756abe1edf768dd37418683815f', name: "footer" }, this.showCancelBtn && (index.h("button", { key: '92055092b2978c41eabed218b73e242cafe4accc', class: "cancel-btn", onClick: this.handleClose.bind(this) }, translate$4('cancel', this.language))), index.h("button", { key: 'c950eefc68feb4546665105a0e2d0f2300183d8f', class: "confirm-btn", onClick: this.handleConfirm.bind(this) }, translate$4('confirm', this.language))))))));
+    }
+    get el() { return index.getElement(this); }
+    static get watchers() { return {
+        "clientStyling": ["handleClientStylingChange"],
+        "clientStylingUrl": ["handleClientStylingUrlChange"],
+        "mbSource": ["handleMbSourceChange"]
+    }; }
+};
+LotteryTippingDialog.style = LotteryTippingDialogStyle0;
+
 function _typeof(o) {
   "@babel/helpers - typeof";
 
@@ -2795,482 +3083,6 @@ function validateTimezone(_hours, minutes) {
   return minutes >= 0 && minutes <= 59;
 }
 
-const formatDate$1 = ({ date, type = 'date', format: format$1 }) => {
-    try {
-        const parsedDate = parseISO(date);
-        if (isNaN(parsedDate.getTime())) {
-            throw new Error(`Invalid date: ${date}`);
-        }
-        if (format$1)
-            return format(parsedDate, format$1);
-        let formatStr = 'dd/MM/yyyy';
-        if (type === 'time') {
-            formatStr = 'dd/MM/yyyy HH:mm:ss';
-        }
-        else if (type === 'week') {
-            formatStr = 'ccc dd/MM/yyyy HH:mm:ss';
-        }
-        return format(parsedDate, formatStr);
-    }
-    catch (error) {
-        console.error('Error formatting date:', error.message);
-        return '';
-    }
-};
-const fetcher$1 = (url) => fetch(url, {
-    method: 'GET',
-    headers: {
-        'x-scheme': 'application/json',
-        Accept: 'application/json'
-    }
-}).then((r) => r.json());
-const showNotification$1 = ({ message, theme = 'success' }) => {
-    window.postMessage({
-        type: 'ShowNotificationToast',
-        message,
-        theme
-    });
-};
-const thousandSeparator = (value) => {
-    if (value === 0) {
-        return '0';
-    }
-    if (!value) {
-        return '';
-    }
-    value = value.toString();
-    const parts = value.split('.');
-    parts[0] = parts[0].replace(/\B(?=(\d{3})+(?!\d))/g, ',');
-    return parts.join('.');
-};
-const generateUUID = () => {
-    return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function (c) {
-        var r = (Math.random() * 16) | 0, v = c == 'x' ? r : (r & 0x3) | 0x8;
-        return v.toString(16);
-    });
-};
-const TICKET_INVALID_TOKEN = 'TICKET_INVALID_TOKEN';
-// format results to winning numbers
-const formatResultsToWinningNumbers = (rawResults) => {
-    const formatMatchCheckRes = (matchRes) => matchRes.map((bulletItem) => (bulletItem.isSelected ? 1 : 0));
-    const resultsForTotalLines = rawResults.map((lineRes) => lineRes.map(formatMatchCheckRes));
-    const result = [];
-    for (let i = 0; i < resultsForTotalLines.length; i++) {
-        const resultsInLine = resultsForTotalLines[i];
-        for (let j = 0; j < resultsInLine.length; j++) {
-            const matchResult = resultsInLine[j];
-            for (let k = 0; k < matchResult.length; k++) {
-                if (!result[i])
-                    result[i] = [];
-                if (matchResult[k])
-                    result[i].push(k, j);
-            }
-        }
-    }
-    return result;
-};
-const doSubmitTicket = ({ body, sessionId, url }) => {
-    const options = {
-        method: 'POST',
-        headers: {
-            'Content-Type': 'application/json',
-            Accept: 'application/json',
-            Authorization: `Bearer ${sessionId}`,
-            'X-Idempotency-Key': generateUUID()
-        },
-        body: JSON.stringify(body)
-    };
-    return fetch(url, options).then((res) => {
-        if (res.status === 401) {
-            throw new Error(TICKET_INVALID_TOKEN);
-        }
-        if (res.status > 300) {
-            throw new Error(res.statusText);
-        }
-        return res.json();
-    });
-};
-// BettingTypes, playModes and playTypes
-const getEnableOptions = (raw = []) => raw.filter((i) => i.enabled);
-// the first one in bet type config that enabled = true, will be default choice
-const getDefaultType = ({ playTypeConfig = [], betTypeConfig = [], enabledBettingTypeOptions = [], enabledPlayingModeOptions = [] }) => {
-    const enabledBetTypeConfig = betTypeConfig.filter((i) => i.enabled);
-    for (const item of enabledBetTypeConfig) {
-        const { bettingType, playMode } = playTypeConfig === null || playTypeConfig === void 0 ? void 0 : playTypeConfig.find((i) => i.betTypeId === item.id);
-        if (enabledBettingTypeOptions.map((i) => i.code).includes(bettingType) &&
-            enabledPlayingModeOptions.map((i) => i.code).includes(playMode))
-            return { bettingType, playMode };
-    }
-    return {};
-};
-const calculatePlayingModeOptions = ({ bettingType, playTypeConfig, betTypeConfig, enabledPlayingModeOptions }) => {
-    const enabledBetTypeIdConfig = betTypeConfig.filter((i) => i.enabled).map((i) => i.id);
-    const filteredPlayTypesConfig = playTypeConfig.filter((i) => enabledBetTypeIdConfig.includes(i.betTypeId));
-    const selectedBettingTypeFilteredPlayTypesConfig = filteredPlayTypesConfig.filter((i) => i.bettingType === bettingType);
-    const _ = selectedBettingTypeFilteredPlayTypesConfig.map((i) => i.playMode);
-    return enabledPlayingModeOptions.filter((i) => _.includes(i.code));
-};
-const getCheckedCountForEachLineAndEachMatch = ({ rawResults }) => {
-    const getMatchCheckRes = (matchRes) => matchRes.filter((bulletItem) => bulletItem.isSelected).length;
-    const checkedCountForEachLineAndEachMatch = rawResults.map((lineRes) => lineRes.length > 0 ? lineRes.map(getMatchCheckRes) : [0]);
-    return checkedCountForEachLineAndEachMatch;
-};
-const getPlayTypeConfig = ({ rawData, selectedBettingType, selectedPlayingMode }) => {
-    var _a, _b, _c, _d, _e, _f;
-    const betTypeId = (_d = (_c = (_b = (_a = rawData === null || rawData === void 0 ? void 0 : rawData.rules) === null || _a === void 0 ? void 0 : _a.poolGame) === null || _b === void 0 ? void 0 : _b.playTypes) === null || _c === void 0 ? void 0 : _c.find((i) => i.bettingType === selectedBettingType && i.playMode === selectedPlayingMode)) === null || _d === void 0 ? void 0 : _d.betTypeId;
-    const betType = (_f = (_e = rawData === null || rawData === void 0 ? void 0 : rawData.rules) === null || _e === void 0 ? void 0 : _e.betTypes) === null || _f === void 0 ? void 0 : _f.find((i) => i.id === betTypeId);
-    return { betTypeId, betType };
-};
-
-const DEFAULT_LANGUAGE$2 = 'en';
-const SUPPORTED_LANGUAGES$2 = ['ro', 'en', 'fr', 'ar', 'hr'];
-const TRANSLATIONS$2 = {
-    en: {
-        stop: 'Stop',
-        at: 'at'
-    },
-    ro: {
-        stop: 'Oprește',
-        at: 'la'
-    },
-    fr: {
-        stop: 'Arrêtez',
-        at: 'à'
-    },
-    ar: {
-        stop: 'توقف',
-        at: 'في'
-    },
-    hr: {
-        stop: 'Stop',
-        at: 'u'
-    }
-};
-const translate$2 = (key, customLang) => {
-    const lang = customLang;
-    return TRANSLATIONS$2[lang !== undefined && SUPPORTED_LANGUAGES$2.includes(lang) ? lang : DEFAULT_LANGUAGE$2][key];
-};
-
-const DEFAULT_LANGUAGE$1 = 'en';
-const SUPPORTED_LANGUAGES$1 = ['ro', 'en', 'fr', 'ar', 'hr'];
-const TRANSLATIONS$1 = {
-    en: {
-        selectionCleared: 'Your selection will be cleared.',
-        ticketSubmitted: 'Ticket submitted successfully.',
-        ticketFailed: 'Failed to purchase the ticket. Please try again.',
-        lines: 'Lines',
-        line: 'Line',
-        bettingType: 'Betting Type',
-        playingMode: 'Playing Mode',
-        orderSummaryTitle: 'Order Summary',
-        orderSummaryTickets: 'Tickets',
-        orderSummaryTotal: 'Total',
-        orderSummarySubmit: 'Submit',
-        cancel: 'Cancel',
-        confirm: 'Confirm'
-    },
-    ro: {
-        selectionCleared: 'Selecția dvs. va fi ștearsă.',
-        ticketSubmitted: 'Bilet trimis cu succes.',
-        ticketFailed: 'Nu s-a putut achiziționa biletul. Vă rugăm să încercați din nou.',
-        lines: 'Linii',
-        line: 'Linie',
-        bettingType: 'Tip de pariu',
-        playingMode: 'Mod de joc',
-        orderSummaryTitle: 'Sumar comandă',
-        orderSummaryTickets: 'Bilete',
-        orderSummaryTotal: 'Total',
-        orderSummarySubmit: 'Trimite',
-        cancel: 'Anulează',
-        confirm: 'Confirmă'
-    },
-    fr: {
-        selectionCleared: 'Votre sélection sera effacée.',
-        ticketSubmitted: 'Billet soumis avec succès.',
-        ticketFailed: "Échec de l'achat du billet. Veuillez réessayer.",
-        lines: 'Lignes',
-        line: 'Ligne',
-        bettingType: 'Type de pari',
-        playingMode: 'Mode de jeu',
-        orderSummaryTitle: 'Résumé de la commande',
-        orderSummaryTickets: 'Billets',
-        orderSummaryTotal: 'Total',
-        orderSummarySubmit: 'Soumettre',
-        cancel: 'Annuler',
-        confirm: 'Confirmer'
-    },
-    ar: {
-        selectionCleared: 'سيتم مسح اختيارك.',
-        ticketSubmitted: 'تم إرسال التذكرة بنجاح.',
-        ticketFailed: 'فشل شراء التذكرة. يرجى المحاولة مرة أخرى.',
-        lines: 'خطوط',
-        line: 'خط',
-        bettingType: 'نوع الرهان',
-        playingMode: 'وضع اللعب',
-        orderSummaryTitle: 'ملخص الطلب',
-        orderSummaryTickets: 'التذاكر',
-        orderSummaryTotal: 'المجموع',
-        orderSummarySubmit: 'إرسال',
-        cancel: 'إلغاء',
-        confirm: 'تأكيد'
-    },
-    hr: {
-        selectionCleared: 'Vaš odabir bit će obrisan.',
-        ticketSubmitted: 'Listić je uspješno predan.',
-        ticketFailed: 'Kupnja listića nije uspjela. Molimo pokušajte ponovo.',
-        lines: 'Linije',
-        line: 'Linija',
-        bettingType: 'Vrsta oklade',
-        playingMode: 'Način igranja',
-        orderSummaryTitle: 'Sažetak narudžbe',
-        orderSummaryTickets: 'Listići',
-        orderSummaryTotal: 'Ukupno',
-        orderSummarySubmit: 'Pošalji',
-        cancel: 'Odustani',
-        confirm: 'Potvrdi'
-    }
-};
-const translate$1 = (key, customLang) => {
-    const lang = customLang;
-    return TRANSLATIONS$1[lang !== undefined && SUPPORTED_LANGUAGES$1.includes(lang) ? lang : DEFAULT_LANGUAGE$1][key];
-};
-const getTranslations$1 = (data) => {
-    Object.keys(data).forEach((item) => {
-        for (let key in data[item]) {
-            TRANSLATIONS$1[item][key] = data[item][key];
-        }
-    });
-};
-const resolveTranslationUrl = async (translationUrl) => {
-    if (translationUrl) {
-        try {
-            const response = await fetch(translationUrl);
-            if (!response.ok) {
-                throw new Error(`HTTP error! status: ${response.status}`);
-            }
-            const translations = await response.json();
-            getTranslations$1(translations);
-        }
-        catch (error) {
-            console.error('Failed to fetch or parse translations from URL:', error);
-        }
-    }
-};
-
-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.5rem 1rem;\n  background: var(--emw--color-primary, #fed275);\n  border-top: 2px solid var(--emw--color-primary-variant, #ffe66f);\n  border-bottom: 2px solid var(--emw--color-primary-variant, #ffe66f);\n  gap: 0.5rem;\n  white-space: nowrap;\n}\n\n.left {\n  flex: 1;\n  gap: 0.4rem;\n}\n\n.brand {\n  font-weight: 700;\n  color: var(--emw--color-gray-400, #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-gray-400, #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: 2px 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-300, #333);\n  display: inline-flex;\n  align-items: baseline;\n}\n\n.pill > strong {\n  font-weight: 700;\n}";
-const LotteryTippingTicketBannerStyle0 = lotteryTippingTicketBannerCss;
-
-const LotteryTippingTicketBanner = class {
-    constructor(hostRef) {
-        index.registerInstance(this, hostRef);
-        this.mbSource = undefined;
-        this.clientStyling = undefined;
-        this.clientStylingUrl = undefined;
-        this.language = 'en';
-        this.translationUrl = '';
-        this.stopTime = '';
-        this.period = undefined;
-    }
-    get formattedStopTime() {
-        let _temp = '';
-        if (!this.stopTime) {
-            return _temp;
-        }
-        _temp = formatDate$1({ date: this.stopTime, format: 'dd/MM/yyyy HH:mm' });
-        if (isToday(new Date(this.stopTime))) {
-            _temp = formatDate$1({ date: this.stopTime, format: 'HH:mm' });
-        }
-        return _temp;
-    }
-    get formattedPeriod() {
-        let _temp = '';
-        _temp = formatDate$1({ date: this.period, format: 'EEEE' });
-        if (_temp.toLowerCase() === 'wednesday') {
-            _temp = 'MIDWEEK';
-        }
-        return _temp.toUpperCase();
-    }
-    handleClientStylingChange(newValue, oldValue) {
-        if (newValue != oldValue) {
-            lotteryTippingPage.setClientStyling(this.stylingContainer, this.clientStyling);
-        }
-    }
-    handleClientStylingUrlChange(newValue, oldValue) {
-        if (newValue != oldValue) {
-            lotteryTippingPage.setClientStylingURL(this.stylingContainer, this.clientStylingUrl);
-        }
-    }
-    handleMbSourceChange(newValue, oldValue) {
-        if (newValue != oldValue) {
-            lotteryTippingPage.setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
-        }
-    }
-    async componentWillLoad() {
-        if (this.translationUrl) {
-            resolveTranslationUrl(this.translationUrl);
-        }
-    }
-    componentDidLoad() {
-        if (this.stylingContainer) {
-            if (this.mbSource)
-                lotteryTippingPage.setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
-            if (this.clientStyling)
-                lotteryTippingPage.setClientStyling(this.stylingContainer, this.clientStyling);
-            if (this.clientStylingUrl)
-                lotteryTippingPage.setClientStylingURL(this.stylingContainer, this.clientStylingUrl);
-        }
-    }
-    disconnectedCallback() {
-        this.stylingSubscription && this.stylingSubscription.unsubscribe();
-    }
-    render() {
-        const backgroundImagePath = index.getAssetPath('../static/tipping-full-color.svg');
-        return (index.h("div", { key: 'eb93e7946631d234963d841df9e8b753b651c795', ref: (el) => (this.stylingContainer = el), class: "lottery-tipping-ticket-banner__container" }, index.h("section", { key: '0133e845df14caa912b18e1734ad16c584b7359f', class: "banner" }, index.h("div", { key: '23bc3b34011dc5533bf70397f974936e238f04fe', class: "left" }, index.h("img", { key: '52110de0807e79c02d7934ec8a37c1322b73fe84', alt: "Betting", src: backgroundImagePath, class: "logo" })), index.h("div", { key: 'b5deae59d09b870777c913c5ebfca43886c3cf95', class: "mid period" }, this.formattedPeriod), index.h("div", { key: 'b404e474850233e2d5e139077fd774f178bc40fa', class: "right" }, index.h("span", { key: '3b9072c2165a033d17c9572c7cafe2a2c699447b', class: "pill" }, index.h("strong", { key: 'c560c2c27dc930a963b992c07e02745b18d0002f' }, translate$2('stop', this.language)), "\u00A0", translate$2('at', this.language), "\u00A0", this.formattedStopTime)))));
-    }
-    static get assetsDirs() { return ["../static"]; }
-    static get watchers() { return {
-        "clientStyling": ["handleClientStylingChange"],
-        "clientStylingUrl": ["handleClientStylingUrlChange"],
-        "mbSource": ["handleMbSourceChange"]
-    }; }
-};
-LotteryTippingTicketBanner.style = LotteryTippingTicketBannerStyle0;
-
-const DEFAULT_LANGUAGE = 'en';
-const SUPPORTED_LANGUAGES = ['ro', 'en', 'fr', 'ar', 'hr'];
-const TRANSLATIONS = {
-    en: {
-        homeTeam: 'Home team:',
-        awayTeam: 'Away team:',
-        selectionCleared: 'Your selection has been cleared.',
-        selectionOnLineCleared: 'Your selection on this line will be cleared.',
-        loading: 'Loading...',
-        error: 'Error!',
-        noData: 'No data available.',
-        lineInfo: 'Line {currentPage} of {totalPages}',
-        clearAll: 'Clear All',
-        cancel: 'Cancel',
-        confirm: 'Confirm'
-    },
-    ro: {
-        homeTeam: 'Echipa gazdă:',
-        awayTeam: 'Echipa oaspete:',
-        selectionCleared: 'Selecția dvs. a fost ștearsă.',
-        selectionOnLineCleared: 'Selecția dvs. de pe această linie va fi ștearsă.',
-        loading: `Se încarcă...',n    error: 'Eroare!`,
-        noData: 'Nu sunt date disponibile.',
-        lineInfo: 'Linia {currentPage} din {totalPages}',
-        clearAll: 'Șterge tot',
-        cancel: 'Anulează',
-        confirm: 'Confirmă'
-    },
-    fr: {
-        homeTeam: 'Équipe à domicile:',
-        awayTeam: `Équipe à l'extérieur:`,
-        selectionCleared: 'Votre sélection a été effacée.',
-        selectionOnLineCleared: 'Votre sélection sur cette ligne sera effacée.',
-        loading: `Chargement...',n    error: 'Erreur!`,
-        noData: 'Aucune donnée disponible.',
-        lineInfo: 'Ligne {currentPage} sur {totalPages}',
-        clearAll: 'Tout effacer',
-        cancel: 'Annuler',
-        confirm: 'Confirmer'
-    },
-    ar: {
-        homeTeam: 'الفريق المضيف:',
-        awayTeam: 'الفريق الضيف:',
-        selectionCleared: 'تم مسح اختيارك.',
-        selectionOnLineCleared: 'سيتم مسح اختيارك في هذا السطر.',
-        loading: `جار التحميل...',n    error: 'خطأ!`,
-        noData: 'لا توجد بيانات متاحة.',
-        lineInfo: 'السطر {currentPage} من {totalPages}',
-        clearAll: 'مسح الكل',
-        cancel: 'إلغاء',
-        confirm: 'تأكيد'
-    },
-    hr: {
-        homeTeam: 'Domaći tim:',
-        awayTeam: 'Gostujući tim:',
-        selectionCleared: 'Vaš odabir je obrisan.',
-        selectionOnLineCleared: 'Vaš odabir na ovoj liniji bit će obrisan.',
-        loading: `Učitavanje...',n    error: 'Greška!`,
-        noData: 'Nema dostupnih podataka.',
-        lineInfo: 'Linija {currentPage} od {totalPages}',
-        clearAll: 'Očisti sve',
-        cancel: 'Odustani',
-        confirm: 'Potvrdi'
-    }
-};
-const translate = (key, customLang, replacements) => {
-    const lang = customLang;
-    let translation = TRANSLATIONS[lang !== undefined && SUPPORTED_LANGUAGES.includes(lang) ? lang : DEFAULT_LANGUAGE][key];
-    if (replacements) {
-        Object.keys(replacements).forEach((placeholder) => {
-            translation = translation.replace(`{${placeholder}}`, replacements[placeholder]);
-        });
-    }
-    return translation;
-};
-const getTranslations = (data) => {
-    Object.keys(data).forEach((item) => {
-        for (let key in data[item]) {
-            TRANSLATIONS[item][key] = data[item][key];
-        }
-    });
-};
-
-const formatDate = ({ date, type = 'date', format: format$1 }) => {
-    try {
-        const parsedDate = parseISO(date);
-        if (isNaN(parsedDate.getTime())) {
-            throw new Error(`Invalid date: ${date}`);
-        }
-        if (format$1)
-            return format(parsedDate, format$1);
-        let formatStr = 'dd/MM/yyyy';
-        if (type === 'time') {
-            formatStr = 'dd/MM/yyyy HH:mm:ss';
-        }
-        else if (type === 'week') {
-            formatStr = 'ccc dd/MM/yyyy HH:mm:ss';
-        }
-        return format(parsedDate, formatStr);
-    }
-    catch (error) {
-        console.error('Error formatting date:', error.message);
-        return '';
-    }
-};
-const fetcher = (url) => fetch(url).then((r) => r.json());
-const DEFAULT_BULLET_CONFIG = [
-    {
-        value: '1'
-    },
-    {
-        value: 'X'
-    },
-    {
-        value: '2'
-    }
-];
-const SPLIT_TOKEN = '-';
-const showNotification = ({ message, theme = 'success', position = 'top-end', duration = 3000 }) => {
-    if (!customElements.get('vaadin-notification')) {
-        console.warn('vaadin-notification is not registered. Please ensure it is imported.');
-    }
-    const notification = document.createElement('vaadin-notification');
-    notification.renderer = (root) => {
-        root.textContent = message;
-    };
-    notification.duration = duration;
-    if (theme) {
-        notification.setAttribute('theme', theme);
-    }
-    notification.setAttribute('position', position);
-    document.body.appendChild(notification);
-    notification.opened = true;
-};
-
 var ka=Object.defineProperty,Ta=Object.defineProperties;var Pa=Object.getOwnPropertyDescriptors;var mo=Object.getOwnPropertySymbols;var Oa=Object.prototype.hasOwnProperty,Da=Object.prototype.propertyIsEnumerable;var ri=(s,t,e)=>t in s?ka(s,t,{enumerable:!0,configurable:!0,writable:!0,value:e}):s[t]=e,U=(s,t)=>{for(var e in t||(t={}))Oa.call(t,e)&&ri(s,e,t[e]);if(mo)for(var e of mo(t))Da.call(t,e)&&ri(s,e,t[e]);return s},Me=(s,t)=>Ta(s,Pa(t));var b=(s,t,e)=>(ri(s,typeof t!="symbol"?t+"":t,e),e);var Ne=(s,t,e)=>new Promise((i,o)=>{var r=l=>{try{a(e.next(l));}catch(d){o(d);}},n=l=>{try{a(e.throw(l));}catch(d){o(d);}},a=l=>l.done?i(l.value):Promise.resolve(l.value).then(r,n);a((e=e.apply(s,t)).next());});/**
  * @license
  * Copyright (c) 2021 - 2024 Vaadin Ltd.
@@ -10256,986 +10068,2159 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
       }
     }
 
-    :host([slot='middle'][opening]) {
-      animation: lumo-notification-enter-fade-in 300ms;
-    }
+    :host([slot='middle'][opening]) {
+      animation: lumo-notification-enter-fade-in 300ms;
+    }
+
+    :host([slot='middle'][closing]) {
+      animation: lumo-notification-exit-fade-out 300ms;
+    }
+
+    :host([slot^='top'][opening]) {
+      animation: lumo-notification-enter-slide-down 300ms;
+    }
+
+    :host([slot^='top'][closing]) {
+      animation: lumo-notification-exit-slide-up 300ms;
+    }
+
+    :host([slot^='bottom'][opening]) {
+      animation: lumo-notification-enter-slide-up 300ms;
+    }
+
+    :host([slot^='bottom'][closing]) {
+      animation: lumo-notification-exit-slide-down 300ms;
+    }
+
+    :host([theme='success']) {
+      --_focus-ring-gap-color: var(--lumo-success-color);
+      --vaadin-focus-ring-color: var(--lumo-success-contrast-color);
+    }
+
+    :host([theme='warning']) {
+      --_focus-ring-gap-color: var(--lumo-warning-color);
+      --vaadin-focus-ring-color: var(--lumo-warning-contrast-color);
+    }
+
+    :host([theme='error']) {
+      --_focus-ring-gap-color: var(--lumo-error-color);
+      --vaadin-focus-ring-color: var(--lumo-error-contrast-color);
+    }
+
+    :host([theme='primary']) {
+      --_focus-ring-gap-color: var(--lumo-primary-color);
+      --vaadin-focus-ring-color: var(--lumo-primary-contrast-color);
+    }
+
+    :host([theme~='primary']) [part='overlay'] {
+      background: var(--lumo-primary-color);
+      color: var(--lumo-primary-contrast-color);
+      box-shadow: var(--lumo-box-shadow-l);
+    }
+
+    :host([theme~='primary']) {
+      --vaadin-button-background: var(--lumo-shade-20pct);
+      --vaadin-button-text-color: var(--lumo-primary-contrast-color);
+      --vaadin-button-primary-background: var(--lumo-primary-contrast-color);
+      --vaadin-button-primary-text-color: var(--lumo-primary-text-color);
+    }
+
+    :host([theme~='contrast']) [part='overlay'] {
+      background: var(--lumo-contrast);
+      color: var(--lumo-base-color);
+      box-shadow: var(--lumo-box-shadow-l);
+    }
+
+    :host([theme~='contrast']) {
+      --vaadin-button-background: var(--lumo-contrast-20pct);
+      --vaadin-button-text-color: var(--lumo-base-color);
+      --vaadin-button-primary-background: var(--lumo-base-color);
+      --vaadin-button-primary-text-color: var(--lumo-contrast);
+    }
+
+    :host([theme~='success']) [part='overlay'] {
+      background: var(--lumo-success-color);
+      color: var(--lumo-success-contrast-color);
+      box-shadow: var(--lumo-box-shadow-l);
+    }
+
+    :host([theme~='success']) {
+      --vaadin-button-background: var(--lumo-shade-20pct);
+      --vaadin-button-text-color: var(--lumo-success-contrast-color);
+      --vaadin-button-primary-background: var(--lumo-success-contrast-color);
+      --vaadin-button-primary-text-color: var(--lumo-success-text-color);
+    }
+
+    :host([theme~='error']) [part='overlay'] {
+      background: var(--lumo-error-color);
+      color: var(--lumo-error-contrast-color);
+      box-shadow: var(--lumo-box-shadow-l);
+    }
+
+    :host([theme~='error']) {
+      --vaadin-button-background: var(--lumo-shade-20pct);
+      --vaadin-button-text-color: var(--lumo-error-contrast-color);
+      --vaadin-button-primary-background: var(--lumo-error-contrast-color);
+      --vaadin-button-primary-text-color: var(--lumo-error-text-color);
+    }
+
+    :host([theme~='warning']) [part='overlay'] {
+      background: var(--lumo-warning-color);
+      color: var(--lumo-warning-contrast-color);
+      box-shadow:
+        inset 0 0 0 1px var(--lumo-contrast-20pct),
+        var(--lumo-box-shadow-l);
+    }
+
+    :host([theme~='warning']) {
+      --vaadin-button-background: var(--lumo-shade-20pct);
+      --vaadin-button-text-color: var(--lumo-warning-contrast-color);
+      --vaadin-button-primary-background: var(--lumo-shade-50pct);
+      --vaadin-button-primary-text-color: var(--lumo-primary-contrast-color);
+    }
+  `,{moduleId:"lumo-notification-card"});/**
+ * @license
+ * Copyright 2020 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */const S_=(s,t)=>(s==null?void 0:s._$litType$)!==void 0;/**
+ * @license
+ * Copyright (c) 2017 - 2024 Vaadin Ltd.
+ * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
+ */class k_ extends On(I(q(g))){static get template(){return v`
+      <style>
+        :host {
+          position: fixed;
+          z-index: 1000;
+          top: 0;
+          left: 0;
+          bottom: 0;
+          right: 0;
+          box-sizing: border-box;
+
+          display: flex;
+          flex-direction: column;
+          align-items: stretch;
+          pointer-events: none;
+        }
+
+        [region-group] {
+          flex: 1 1 0%;
+          display: flex;
+        }
+
+        [region-group='top'] {
+          align-items: flex-start;
+        }
+
+        [region-group='bottom'] {
+          align-items: flex-end;
+        }
+
+        [region-group] > [region] {
+          flex: 1 1 0%;
+        }
+
+        @media (max-width: 420px) {
+          [region-group] {
+            flex-direction: column;
+            align-items: stretch;
+          }
+
+          [region-group='top'] {
+            justify-content: flex-start;
+          }
+
+          [region-group='bottom'] {
+            justify-content: flex-end;
+          }
+
+          [region-group] > [region] {
+            flex: initial;
+          }
+        }
+      </style>
+
+      <div region="top-stretch"><slot name="top-stretch"></slot></div>
+      <div region-group="top">
+        <div region="top-start"><slot name="top-start"></slot></div>
+        <div region="top-center"><slot name="top-center"></slot></div>
+        <div region="top-end"><slot name="top-end"></slot></div>
+      </div>
+      <div region="middle"><slot name="middle"></slot></div>
+      <div region-group="bottom">
+        <div region="bottom-start"><slot name="bottom-start"></slot></div>
+        <div region="bottom-center"><slot name="bottom-center"></slot></div>
+        <div region="bottom-end"><slot name="bottom-end"></slot></div>
+      </div>
+      <div region="bottom-stretch"><slot name="bottom-stretch"></slot></div>
+    `}static get is(){return "vaadin-notification-container"}static get properties(){return {opened:{type:Boolean,value:!1,observer:"_openedChanged"}}}constructor(){super(),this._boundVaadinOverlayClose=this._onVaadinOverlayClose.bind(this),qs&&(this._boundIosResizeListener=()=>this._detectIosNavbar());}_openedChanged(t){t?(document.body.appendChild(this),document.addEventListener("vaadin-overlay-close",this._boundVaadinOverlayClose),this._boundIosResizeListener&&(this._detectIosNavbar(),window.addEventListener("resize",this._boundIosResizeListener))):(document.body.removeChild(this),document.removeEventListener("vaadin-overlay-close",this._boundVaadinOverlayClose),this._boundIosResizeListener&&window.removeEventListener("resize",this._boundIosResizeListener));}_detectIosNavbar(){const t=window.innerHeight,i=window.innerWidth>t,o=document.documentElement.clientHeight;i&&o>t?this.style.bottom=`${o-t}px`:this.style.bottom="0";}_onVaadinOverlayClose(t){const e=t.detail.sourceEvent;e&&e.composedPath().indexOf(this)>=0&&t.preventDefault();}}class T_ extends I(g){static get template(){return v`
+      <style>
+        :host {
+          display: block;
+        }
+
+        [part='overlay'] {
+          pointer-events: auto;
+        }
+
+        @media (forced-colors: active) {
+          [part='overlay'] {
+            outline: 3px solid;
+          }
+        }
+      </style>
+
+      <div part="overlay">
+        <div part="content">
+          <slot></slot>
+        </div>
+      </div>
+    `}static get is(){return "vaadin-notification-card"}ready(){super.ready(),this.setAttribute("role","alert"),this.setAttribute("aria-live","polite");}}class K extends ct($t(q(g))){static get template(){return v`
+      <style>
+        :host {
+          display: none !important;
+        }
+      </style>
+      <vaadin-notification-card theme$="[[_theme]]"> </vaadin-notification-card>
+    `}static get is(){return "vaadin-notification"}static get properties(){return {duration:{type:Number,value:5e3},opened:{type:Boolean,value:!1,notify:!0,observer:"_openedChanged"},position:{type:String,value:"bottom-start",observer:"_positionChanged"},renderer:Function}}static get observers(){return ["_durationChanged(duration, opened)","_rendererChanged(renderer, opened, _overlayElement)"]}static show(t,e){return S_(t)?K._createAndShowNotification(i=>{Sr(t,i);},e):K._createAndShowNotification(i=>{i.innerText=t;},e)}static _createAndShowNotification(t,e){const i=document.createElement(K.is);return e&&Number.isFinite(e.duration)&&(i.duration=e.duration),e&&e.position&&(i.position=e.position),e&&e.theme&&i.setAttribute("theme",e.theme),i.renderer=t,document.body.appendChild(i),i.opened=!0,i.addEventListener("opened-changed",o=>{o.detail.value||i.remove();}),i}get _container(){return K._container||(K._container=document.createElement("vaadin-notification-container"),document.body.appendChild(K._container)),K._container}get _card(){return this._overlayElement}ready(){super.ready(),this._overlayElement=this.shadowRoot.querySelector("vaadin-notification-card"),to(this);}disconnectedCallback(){super.disconnectedCallback(),queueMicrotask(()=>{this.isConnected||(this.opened=!1);});}requestContentUpdate(){this.renderer&&this.renderer(this._card,this);}_rendererChanged(t,e,i){if(!i)return;const o=this._oldRenderer!==t;this._oldRenderer=t,o&&(i.innerHTML="",delete i._$litPart$),e&&(this._didAnimateNotificationAppend||this._animatedAppendNotificationCard(),this.requestContentUpdate());}open(){this.opened=!0;}close(){this.opened=!1;}_openedChanged(t){t?(this._container.opened=!0,this._animatedAppendNotificationCard()):this._card&&this._closeNotificationCard();}__cleanUpOpeningClosingState(){this._card.removeAttribute("opening"),this._card.removeAttribute("closing"),this._card.removeEventListener("animationend",this.__animationEndListener);}_animatedAppendNotificationCard(){this._card?(this.__cleanUpOpeningClosingState(),this._card.setAttribute("opening",""),this._appendNotificationCard(),this.__animationEndListener=()=>this.__cleanUpOpeningClosingState(),this._card.addEventListener("animationend",this.__animationEndListener),this._didAnimateNotificationAppend=!0):this._didAnimateNotificationAppend=!1;}_appendNotificationCard(){if(this._card){if(!this._container.shadowRoot.querySelector(`slot[name="${this.position}"]`)){console.warn(`Invalid alignment parameter provided: position=${this.position}`);return}this._container.bringToFront(),this._card.slot=this.position,this._container.firstElementChild&&/top/u.test(this.position)?this._container.insertBefore(this._card,this._container.firstElementChild):this._container.appendChild(this._card);}}_removeNotificationCard(){this._card.parentNode&&this._card.parentNode.removeChild(this._card),this._card.removeAttribute("closing"),this._container.opened=!!this._container.firstElementChild,this.dispatchEvent(new CustomEvent("closed"));}_closeNotificationCard(){this._durationTimeoutId&&clearTimeout(this._durationTimeoutId),this._animatedRemoveNotificationCard();}_animatedRemoveNotificationCard(){this.__cleanUpOpeningClosingState(),this._card.setAttribute("closing","");const t=getComputedStyle(this._card).getPropertyValue("animation-name");t&&t!=="none"?(this.__animationEndListener=()=>{this._removeNotificationCard(),this.__cleanUpOpeningClosingState();},this._card.addEventListener("animationend",this.__animationEndListener)):this._removeNotificationCard();}_positionChanged(){this.opened&&this._animatedAppendNotificationCard();}_durationChanged(t,e){e&&(clearTimeout(this._durationTimeoutId),t>0&&(this._durationTimeoutId=setTimeout(()=>this.close(),t)));}}x(k_);x(T_);x(K);const Ea=p`
+  :host {
+    -webkit-tap-highlight-color: transparent;
+    --_lumo-item-selected-icon-display: var(--_lumo-list-box-item-selected-icon-display, block);
+  }
+
+  /* Dividers */
+  [part='items'] ::slotted(hr) {
+    height: 1px;
+    border: 0;
+    padding: 0;
+    margin: var(--lumo-space-s) var(--lumo-border-radius-m);
+    background-color: var(--lumo-contrast-10pct);
+  }
+`;f("vaadin-list-box",Ea,{moduleId:"lumo-list-box"});/**
+ * @license
+ * Copyright (c) 2017 - 2024 Vaadin Ltd.
+ * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
+ */f("vaadin-select-item",eo,{moduleId:"lumo-select-item"});f("vaadin-select-list-box",Ea,{moduleId:"lumo-select-list-box"});const P_=p`
+  :host(:not([theme*='align'])) ::slotted([slot='value']) {
+    text-align: start;
+  }
+
+  [part='input-field'] {
+    cursor: var(--lumo-clickable-cursor);
+  }
+
+  [part='input-field'] ::slotted([slot='value']) {
+    font-weight: var(--vaadin-input-field-value-font-weight, 500);
+  }
+
+  [part='input-field'] ::slotted([slot='value']:not([placeholder])) {
+    color: var(--vaadin-input-field-value-color, var(--lumo-body-text-color));
+  }
+
+  :host([readonly]) [part='input-field'] ::slotted([slot='value']:not([placeholder])) {
+    color: var(--lumo-secondary-text-color);
+  }
+
+  /* placeholder styles */
+  [part='input-field'] ::slotted([slot='value'][placeholder]) {
+    color: var(--vaadin-input-field-placeholder-color, var(--lumo-secondary-text-color));
+  }
+
+  :host(:is([readonly], [disabled])) ::slotted([slot='value'][placeholder]) {
+    opacity: 0;
+  }
 
-    :host([slot='middle'][closing]) {
-      animation: lumo-notification-exit-fade-out 300ms;
-    }
+  [part='toggle-button']::before {
+    content: var(--lumo-icons-dropdown);
+  }
 
-    :host([slot^='top'][opening]) {
-      animation: lumo-notification-enter-slide-down 300ms;
-    }
+  /* Highlight the toggle button when hovering over the entire component */
+  :host(:hover:not([readonly]):not([disabled])) [part='toggle-button'] {
+    color: var(--lumo-contrast-80pct);
+  }
 
-    :host([slot^='top'][closing]) {
-      animation: lumo-notification-exit-slide-up 300ms;
+  :host([theme~='small']) [part='input-field'] ::slotted([slot='value']) {
+    --_lumo-selected-item-height: var(--lumo-size-s);
+    --_lumo-selected-item-padding: 0;
+  }
+`;f("vaadin-select",[Oe,P_],{moduleId:"lumo-select"});f("vaadin-select-value-button",p`
+    :host {
+      font-family: var(--lumo-font-family);
+      font-size: var(--vaadin-input-field-value-font-size, var(--lumo-font-size-m));
+      padding: 0 0.25em;
+      --_lumo-selected-item-height: var(--lumo-size-m);
+      --_lumo-selected-item-padding: 0.5em;
     }
 
-    :host([slot^='bottom'][opening]) {
-      animation: lumo-notification-enter-slide-up 300ms;
+    ::slotted(*) {
+      min-height: var(--_lumo-selected-item-height);
+      padding-top: var(--_lumo-selected-item-padding);
+      padding-bottom: var(--_lumo-selected-item-padding);
+      font-size: inherit;
     }
 
-    :host([slot^='bottom'][closing]) {
-      animation: lumo-notification-exit-slide-down 300ms;
+    ::slotted(*:hover) {
+      background-color: transparent;
     }
+  `,{moduleId:"lumo-select-value-button"});const O_=p`
+  :host {
+    --_lumo-item-selected-icon-display: block;
+  }
 
-    :host([theme='success']) {
-      --_focus-ring-gap-color: var(--lumo-success-color);
-      --vaadin-focus-ring-color: var(--lumo-success-contrast-color);
-    }
+  /* Small viewport adjustment */
+  :host([phone]) {
+    /* stylelint-disable declaration-block-no-redundant-longhand-properties */
+    top: 0 !important;
+    right: 0 !important;
+    bottom: var(--vaadin-overlay-viewport-bottom, 0) !important;
+    left: 0 !important;
+    /* stylelint-enable declaration-block-no-redundant-longhand-properties */
+    align-items: stretch;
+    justify-content: flex-end;
+  }
 
-    :host([theme='warning']) {
-      --_focus-ring-gap-color: var(--lumo-warning-color);
-      --vaadin-focus-ring-color: var(--lumo-warning-contrast-color);
-    }
+  :host([no-vertical-overlap][top-aligned]) [part='overlay'] {
+    margin-block-start: var(--lumo-space-xs);
+  }
 
-    :host([theme='error']) {
-      --_focus-ring-gap-color: var(--lumo-error-color);
-      --vaadin-focus-ring-color: var(--lumo-error-contrast-color);
-    }
+  :host([no-vertical-overlap][bottom-aligned]) [part='overlay'] {
+    margin-block-end: var(--lumo-space-xs);
+  }
 
-    :host([theme='primary']) {
-      --_focus-ring-gap-color: var(--lumo-primary-color);
-      --vaadin-focus-ring-color: var(--lumo-primary-contrast-color);
-    }
+  :host([theme~='align-left']) {
+    text-align: left;
+  }
 
-    :host([theme~='primary']) [part='overlay'] {
-      background: var(--lumo-primary-color);
-      color: var(--lumo-primary-contrast-color);
-      box-shadow: var(--lumo-box-shadow-l);
-    }
+  :host([theme~='align-right']) {
+    text-align: right;
+  }
 
-    :host([theme~='primary']) {
-      --vaadin-button-background: var(--lumo-shade-20pct);
-      --vaadin-button-text-color: var(--lumo-primary-contrast-color);
-      --vaadin-button-primary-background: var(--lumo-primary-contrast-color);
-      --vaadin-button-primary-text-color: var(--lumo-primary-text-color);
-    }
+  :host([theme~='align-center']) {
+    text-align: center;
+  }
+`;f("vaadin-select-overlay",[Hs,O_],{moduleId:"lumo-select-overlay"});/**
+ * @license
+ * Copyright (c) 2017 - 2024 Vaadin Ltd.
+ * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
+ */const D_=s=>class extends Ds(fe(s)){static get properties(){return {_hasVaadinItemMixin:{value:!0},selected:{type:Boolean,value:!1,reflectToAttribute:!0,observer:"_selectedChanged"},_value:String}}get _activeKeys(){return ["Enter"," "]}get value(){return this._value!==void 0?this._value:this.textContent.trim()}set value(e){this._value=e;}ready(){super.ready();const e=this.getAttribute("value");e!==null&&(this.value=e);}focus(){this.disabled||(super.focus(),this._setFocused(!0));}_shouldSetActive(e){return !this.disabled&&!(e.type==="keydown"&&e.defaultPrevented)}_selectedChanged(e){this.setAttribute("aria-selected",e);}_disabledChanged(e){super._disabledChanged(e),e&&(this.selected=!1,this.blur());}_onKeyDown(e){super._onKeyDown(e),this._activeKeys.includes(e.key)&&!e.defaultPrevented&&(e.preventDefault(),this.click());}};/**
+ * @license
+ * Copyright (c) 2017 - 2024 Vaadin Ltd.
+ * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
+ */class z_ extends D_(I(R(g))){static get is(){return "vaadin-select-item"}static get template(){return v`
+      <style>
+        :host {
+          display: inline-block;
+        }
 
-    :host([theme~='contrast']) [part='overlay'] {
-      background: var(--lumo-contrast);
-      color: var(--lumo-base-color);
-      box-shadow: var(--lumo-box-shadow-l);
-    }
+        :host([hidden]) {
+          display: none !important;
+        }
+      </style>
+      <span part="checkmark" aria-hidden="true"></span>
+      <div part="content">
+        <slot></slot>
+      </div>
+    `}ready(){super.ready(),this.setAttribute("role","option");}}x(z_);/**
+ * @license
+ * Copyright (c) 2021 - 2024 Vaadin Ltd.
+ * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
+ */function M_(s,t){const{scrollLeft:e}=s;return t!=="rtl"?e:s.scrollWidth-s.clientWidth+e}function N_(s,t,e){t!=="rtl"?s.scrollLeft=e:s.scrollLeft=s.clientWidth-s.scrollWidth+e;}/**
+ * @license
+ * Copyright (c) 2022 - 2024 Vaadin Ltd.
+ * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
+ */const L_=s=>class extends me(s){get focused(){return (this._getItems()||[]).find(Ns)}get _vertical(){return !0}focus(){const e=this._getItems();if(Array.isArray(e)){const i=this._getAvailableIndex(e,0,null,o=>!Ki(o));i>=0&&this._focus(i);}}_getItems(){return Array.from(this.children)}_onKeyDown(e){if(super._onKeyDown(e),e.metaKey||e.ctrlKey)return;const{key:i}=e,o=this._getItems()||[],r=o.indexOf(this.focused);let n,a;const d=!this._vertical&&this.getAttribute("dir")==="rtl"?-1:1;this.__isPrevKey(i)?(a=-d,n=r-d):this.__isNextKey(i)?(a=d,n=r+d):i==="Home"?(a=1,n=0):i==="End"&&(a=-1,n=o.length-1),n=this._getAvailableIndex(o,n,a,h=>!Ki(h)),n>=0&&(e.preventDefault(),this._focus(n,!0));}__isPrevKey(e){return this._vertical?e==="ArrowUp":e==="ArrowLeft"}__isNextKey(e){return this._vertical?e==="ArrowDown":e==="ArrowRight"}_focus(e,i=!1){const o=this._getItems();this._focusItem(o[e],i);}_focusItem(e){e&&(e.focus(),e.setAttribute("focus-ring",""));}_getAvailableIndex(e,i,o,r){const n=e.length;let a=i;for(let l=0;typeof a=="number"&&l<n;l+=1,a+=o||1){a<0?a=n-1:a>=n&&(a=0);const d=e[a];if(!d.hasAttribute("disabled")&&this.__isMatchingItem(d,r))return a}return -1}__isMatchingItem(e,i){return typeof i=="function"?i(e):!0}};/**
+ * @license
+ * Copyright (c) 2017 - 2024 Vaadin Ltd.
+ * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
+ */const V_=s=>class extends L_(s){static get properties(){return {disabled:{type:Boolean,value:!1,reflectToAttribute:!0},selected:{type:Number,reflectToAttribute:!0,notify:!0},orientation:{type:String,reflectToAttribute:!0,value:""},items:{type:Array,readOnly:!0,notify:!0},_searchBuf:{type:String,value:""}}}static get observers(){return ["_enhanceItems(items, orientation, selected, disabled)"]}get _isRTL(){return !this._vertical&&this.getAttribute("dir")==="rtl"}get _scrollerElement(){return console.warn(`Please implement the '_scrollerElement' property in <${this.localName}>`),this}get _vertical(){return this.orientation!=="horizontal"}focus(){this._observer&&this._observer.flush();const e=Array.isArray(this.items)?this.items:[],i=this._getAvailableIndex(e,0,null,o=>o.tabIndex===0&&!Ki(o));i>=0?this._focus(i):super.focus();}ready(){super.ready(),this.addEventListener("click",i=>this._onClick(i));const e=this.shadowRoot.querySelector("slot:not([name])");this._observer=new Ss(e,()=>{this._setItems(this._filterItems(cn(this)));});}_getItems(){return this.items}_enhanceItems(e,i,o,r){if(!r&&e){this.setAttribute("aria-orientation",i||"vertical"),e.forEach(a=>{i?a.setAttribute("orientation",i):a.removeAttribute("orientation");}),this._setFocusable(o<0||!o?0:o);const n=e[o];e.forEach(a=>{a.selected=a===n;}),n&&!n.disabled&&this._scrollToItem(o);}}_filterItems(e){return e.filter(i=>i._hasVaadinItemMixin)}_onClick(e){if(e.metaKey||e.shiftKey||e.ctrlKey||e.defaultPrevented)return;const i=this._filterItems(e.composedPath())[0];let o;i&&!i.disabled&&(o=this.items.indexOf(i))>=0&&(this.selected=o);}_searchKey(e,i){this._searchReset=M.debounce(this._searchReset,ie.after(500),()=>{this._searchBuf="";}),this._searchBuf+=i.toLowerCase(),this.items.some(r=>this.__isMatchingKey(r))||(this._searchBuf=i.toLowerCase());const o=this._searchBuf.length===1?e+1:e;return this._getAvailableIndex(this.items,o,1,r=>this.__isMatchingKey(r)&&getComputedStyle(r).display!=="none")}__isMatchingKey(e){return e.textContent.replace(/[^\p{L}\p{Nd}]/gu,"").toLowerCase().startsWith(this._searchBuf)}_onKeyDown(e){if(e.metaKey||e.ctrlKey)return;const i=e.key,o=this.items.indexOf(this.focused);if(/[\p{L}\p{Nd}]/u.test(i)&&i.length===1){const r=this._searchKey(o,i);r>=0&&this._focus(r);return}super._onKeyDown(e);}_isItemHidden(e){return getComputedStyle(e).display==="none"}_setFocusable(e){e=this._getAvailableIndex(this.items,e,1);const i=this.items[e];this.items.forEach(o=>{o.tabIndex=o===i?0:-1;});}_focus(e){this.items.forEach((i,o)=>{i.focused=o===e;}),this._setFocusable(e),this._scrollToItem(e),super._focus(e);}_scrollToItem(e){const i=this.items[e];if(!i)return;const o=this._vertical?["top","bottom"]:this._isRTL?["right","left"]:["left","right"],r=this._scrollerElement.getBoundingClientRect(),n=(this.items[e+1]||i).getBoundingClientRect(),a=(this.items[e-1]||i).getBoundingClientRect();let l=0;!this._isRTL&&n[o[1]]>=r[o[1]]||this._isRTL&&n[o[1]]<=r[o[1]]?l=n[o[1]]-r[o[1]]:(!this._isRTL&&a[o[0]]<=r[o[0]]||this._isRTL&&a[o[0]]>=r[o[0]])&&(l=a[o[0]]-r[o[0]]),this._scroll(l);}_scroll(e){if(this._vertical)this._scrollerElement.scrollTop+=e;else {const i=this.getAttribute("dir")||"ltr",o=M_(this._scrollerElement,i)+e;N_(this._scrollerElement,i,o);}}};/**
+ * @license
+ * Copyright (c) 2017 - 2024 Vaadin Ltd.
+ * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
+ */class B_ extends V_(I(R(J(g)))){static get is(){return "vaadin-select-list-box"}static get template(){return v`
+      <style>
+        :host {
+          display: flex;
+        }
 
-    :host([theme~='contrast']) {
-      --vaadin-button-background: var(--lumo-contrast-20pct);
-      --vaadin-button-text-color: var(--lumo-base-color);
-      --vaadin-button-primary-background: var(--lumo-base-color);
-      --vaadin-button-primary-text-color: var(--lumo-contrast);
-    }
+        :host([hidden]) {
+          display: none !important;
+        }
 
-    :host([theme~='success']) [part='overlay'] {
-      background: var(--lumo-success-color);
-      color: var(--lumo-success-contrast-color);
-      box-shadow: var(--lumo-box-shadow-l);
-    }
+        [part='items'] {
+          height: 100%;
+          width: 100%;
+          overflow-y: auto;
+          -webkit-overflow-scrolling: touch;
+        }
+      </style>
+      <div part="items">
+        <slot></slot>
+      </div>
+    `}static get properties(){return {orientation:{readOnly:!0}}}get _scrollerElement(){return this.shadowRoot.querySelector('[part="items"]')}ready(){super.ready(),this.setAttribute("role","listbox");}}x(B_);/**
+ * @license
+ * Copyright (c) 2017 - 2024 Vaadin Ltd.
+ * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
+ */const F_=s=>class extends Us(Jt(R(s))){static get observers(){return ["_updateOverlayWidth(opened, owner)"]}ready(){super.ready(),this.restoreFocusOnClose=!0;}_getMenuElement(){return Array.from(this.children).find(e=>e.localName!=="style")}_updateOverlayWidth(e,i){if(e&&i){const o="--vaadin-select-overlay-width",r=getComputedStyle(i).getPropertyValue(o);r===""?this.style.removeProperty(o):this.style.setProperty(o,r);}}};/**
+ * @license
+ * Copyright (c) 2017 - 2024 Vaadin Ltd.
+ * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
+ */const R_=p`
+  :host {
+    align-items: flex-start;
+    justify-content: flex-start;
+  }
 
-    :host([theme~='success']) {
-      --vaadin-button-background: var(--lumo-shade-20pct);
-      --vaadin-button-text-color: var(--lumo-success-contrast-color);
-      --vaadin-button-primary-background: var(--lumo-success-contrast-color);
-      --vaadin-button-primary-text-color: var(--lumo-success-text-color);
-    }
+  :host(:not([phone])) [part='overlay'] {
+    min-width: var(--vaadin-select-overlay-width, var(--vaadin-select-text-field-width));
+  }
 
-    :host([theme~='error']) [part='overlay'] {
-      background: var(--lumo-error-color);
-      color: var(--lumo-error-contrast-color);
-      box-shadow: var(--lumo-box-shadow-l);
+  @media (forced-colors: active) {
+    [part='overlay'] {
+      outline: 3px solid;
     }
+  }
+`;f("vaadin-select-overlay",[Kt,R_],{moduleId:"vaadin-select-overlay-styles"});class $_ extends F_(I(g)){static get is(){return "vaadin-select-overlay"}static get template(){return v`
+      <div id="backdrop" part="backdrop" hidden$="[[!withBackdrop]]"></div>
+      <div part="overlay" id="overlay" tabindex="0">
+        <div part="content" id="content">
+          <slot></slot>
+        </div>
+      </div>
+    `}ready(){super.ready(),this.owner=this.__dataHost,this.owner._overlayElement=this;}requestContentUpdate(){if(super.requestContentUpdate(),this.owner){const t=this._getMenuElement();this.owner._assignMenuElement(t);}}}x($_);/**
+ * @license
+ * Copyright (c) 2017 - 2024 Vaadin Ltd.
+ * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
+ */const H_=p`
+  :host {
+    display: inline-block;
+    position: relative;
+    outline: none;
+    white-space: nowrap;
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    user-select: none;
+    min-width: 0;
+    width: 0;
+  }
 
-    :host([theme~='error']) {
-      --vaadin-button-background: var(--lumo-shade-20pct);
-      --vaadin-button-text-color: var(--lumo-error-contrast-color);
-      --vaadin-button-primary-background: var(--lumo-error-contrast-color);
-      --vaadin-button-primary-text-color: var(--lumo-error-text-color);
-    }
+  ::slotted(*) {
+    padding-left: 0;
+    padding-right: 0;
+    flex: auto;
+  }
 
-    :host([theme~='warning']) [part='overlay'] {
-      background: var(--lumo-warning-color);
-      color: var(--lumo-warning-contrast-color);
-      box-shadow:
-        inset 0 0 0 1px var(--lumo-contrast-20pct),
-        var(--lumo-box-shadow-l);
-    }
+  /* placeholder styles */
+  ::slotted(*:not([selected])) {
+    line-height: 1;
+  }
+
+  .vaadin-button-container {
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    text-align: inherit;
+    width: 100%;
+    height: 100%;
+    min-height: inherit;
+    text-shadow: inherit;
+  }
 
-    :host([theme~='warning']) {
-      --vaadin-button-background: var(--lumo-shade-20pct);
-      --vaadin-button-text-color: var(--lumo-warning-contrast-color);
-      --vaadin-button-primary-background: var(--lumo-shade-50pct);
-      --vaadin-button-primary-text-color: var(--lumo-primary-contrast-color);
-    }
-  `,{moduleId:"lumo-notification-card"});/**
+  [part='label'] {
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    width: 100%;
+    line-height: inherit;
+  }
+`;/**
  * @license
- * Copyright 2020 Google LLC
- * SPDX-License-Identifier: BSD-3-Clause
- */const S_=(s,t)=>(s==null?void 0:s._$litType$)!==void 0;/**
+ * Copyright (c) 2017 - 2024 Vaadin Ltd.
+ * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
+ */f("vaadin-select-value-button",H_,{moduleId:"vaadin-select-value-button-styles"});class q_ extends Ws(I(g)){static get is(){return "vaadin-select-value-button"}static get template(){return v`
+      <div class="vaadin-button-container">
+        <span part="label">
+          <slot></slot>
+        </span>
+      </div>
+    `}}x(q_);/**
+ * @license
+ * Copyright (c) 2021 - 2024 Vaadin Ltd..
+ * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
+ */const U_=p`
+  .sr-only {
+    border: 0 !important;
+    clip: rect(1px, 1px, 1px, 1px) !important;
+    -webkit-clip-path: inset(50%) !important;
+    clip-path: inset(50%) !important;
+    height: 1px !important;
+    margin: -1px !important;
+    overflow: hidden !important;
+    padding: 0 !important;
+    position: absolute !important;
+    width: 1px !important;
+    white-space: nowrap !important;
+  }
+`;/**
+ * @license
+ * Copyright (c) 2023 - 2024 Vaadin Ltd.
+ * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
+ */class W_ extends D{constructor(t){super(t,"value","vaadin-select-value-button",{initializer:(e,i)=>{i._setFocusElement(e),i.ariaTarget=e,i.stateTarget=e,e.setAttribute("aria-haspopup","listbox");}});}}/**
  * @license
  * Copyright (c) 2017 - 2024 Vaadin Ltd.
  * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
- */class k_ extends On(I(q(g))){static get template(){return v`
+ */const j_=s=>class extends ct(Wt(Ls(me(jt(s))))){static get properties(){return {items:{type:Array,observer:"__itemsChanged"},opened:{type:Boolean,value:!1,notify:!0,reflectToAttribute:!0,sync:!0},renderer:{type:Object},value:{type:String,value:"",notify:!0,observer:"_valueChanged"},name:{type:String},placeholder:{type:String},readonly:{type:Boolean,value:!1,reflectToAttribute:!0},noVerticalOverlap:{type:Boolean,value:!1},_phone:Boolean,_phoneMediaQuery:{value:"(max-width: 450px), (max-height: 450px)"},_inputContainer:Object,_items:Object}}static get delegateAttrs(){return [...super.delegateAttrs,"invalid"]}static get observers(){return ["_updateAriaExpanded(opened, focusElement)","_updateSelectedItem(value, _items, placeholder)","_openedChanged(opened, _overlayElement, _inputContainer)"]}constructor(){super(),this._itemId=`value-${this.localName}-${lt()}`,this._srLabelController=new Cn(this),this._srLabelController.slotName="sr-label";}disconnectedCallback(){super.disconnectedCallback(),this.opened=!1;}ready(){super.ready(),this._inputContainer=this.shadowRoot.querySelector('[part~="input-field"]'),this._valueButtonController=new W_(this),this.addController(this._valueButtonController),this.addController(this._srLabelController),this.addController(new Xs(this._phoneMediaQuery,e=>{this._phone=e;})),this._tooltipController=new _e(this),this._tooltipController.setPosition("top"),this._tooltipController.setAriaTarget(this.focusElement),this.addController(this._tooltipController);}requestContentUpdate(){this._overlayElement&&(this._overlayElement.requestContentUpdate(),this._menuElement&&this._menuElement.items&&this._updateSelectedItem(this.value,this._menuElement.items));}_requiredChanged(e){super._requiredChanged(e),e===!1&&this.validate();}__itemsChanged(e,i){(e||i)&&this.requestContentUpdate();}_assignMenuElement(e){e&&e!==this.__lastMenuElement&&(this._menuElement=e,this.__initMenuItems(e),e.addEventListener("items-changed",()=>{this.__initMenuItems(e);}),e.addEventListener("selected-changed",()=>this.__updateValueButton()),e.addEventListener("keydown",i=>this._onKeyDownInside(i),!0),e.addEventListener("click",i=>{const o=i.composedPath().find(r=>r._hasVaadinItemMixin);this.__dispatchChangePending=!!(o&&o.value!==void 0&&o.value!==this.value),this.opened=!1;},!0),this.__lastMenuElement=e);}__initMenuItems(e){e.items&&(this._items=e.items);}_valueChanged(e,i){this.toggleAttribute("has-value",!!e),i!==void 0&&!this.__dispatchChangePending&&this.validate();}_onClick(e){this.disabled||(e.preventDefault(),this.opened=!this.readonly);}_onToggleMouseDown(e){e.preventDefault();}_onKeyDown(e){if(e.target===this.focusElement&&!this.readonly&&!this.disabled&&!this.opened){if(/^(Enter|SpaceBar|\s|ArrowDown|Down|ArrowUp|Up)$/u.test(e.key))e.preventDefault(),this.opened=!0;else if(/[\p{L}\p{Nd}]/u.test(e.key)&&e.key.length===1){const i=this._menuElement.selected,o=i!==void 0?i:-1,r=this._menuElement._searchKey(o,e.key);r>=0&&(this.__dispatchChangePending=!0,this._updateAriaLive(!0),this._menuElement.selected=r);}}}_onKeyDownInside(e){/^(Tab)$/u.test(e.key)&&(this.opened=!1);}_openedChanged(e,i,o){if(!(!i||!o)){if(e){if(this.disabled||this.readonly){this.opened=!1;return}this._updateAriaLive(!1),i.style.setProperty("--vaadin-select-text-field-width",`${o.offsetWidth}px`);const r=this.hasAttribute("focus-ring");this._openedWithFocusRing=r,r&&this.removeAttribute("focus-ring");}else this.__oldOpened&&(this._openedWithFocusRing&&this.setAttribute("focus-ring",""),!this.__dispatchChangePending&&!this._keyboardActive&&this.validate());this.__oldOpened=e;}}_updateAriaExpanded(e,i){i&&i.setAttribute("aria-expanded",e?"true":"false");}_updateAriaLive(e){this.focusElement&&(e?this.focusElement.setAttribute("aria-live","polite"):this.focusElement.removeAttribute("aria-live"));}__attachSelectedItem(e){let i;const o=e.getAttribute("label");o?i=this.__createItemElement({label:o}):i=e.cloneNode(!0),i._sourceItem=e,this.__appendValueItemElement(i,this.focusElement),i.selected=!0;}__createItemElement(e){const i=document.createElement(e.component||"vaadin-select-item");return e.label&&(i.textContent=e.label),e.value&&(i.value=e.value),e.disabled&&(i.disabled=e.disabled),e.className&&(i.className=e.className),i}__appendValueItemElement(e,i){i.appendChild(e),e.removeAttribute("tabindex"),e.removeAttribute("aria-selected"),e.removeAttribute("role"),e.removeAttribute("focused"),e.removeAttribute("focus-ring"),e.removeAttribute("active"),e.setAttribute("id",this._itemId);}_accessibleNameChanged(e){this._srLabelController.setLabel(e),this._setCustomAriaLabelledBy(e?this._srLabelController.defaultId:null);}_accessibleNameRefChanged(e){this._setCustomAriaLabelledBy(e);}_setCustomAriaLabelledBy(e){const i=this._getLabelIdWithItemId(e);this._fieldAriaController.setLabelId(i,!0);}_getLabelIdWithItemId(e){const o=(this._items?this._items[this._menuElement.selected]:!1)||this.placeholder?this._itemId:"";return e?`${e} ${o}`.trim():null}__updateValueButton(){const e=this.focusElement;if(!e)return;e.innerHTML="";const i=this._items[this._menuElement.selected];if(e.removeAttribute("placeholder"),this._hasContent(i))this.__attachSelectedItem(i);else if(this.placeholder){const r=this.__createItemElement({label:this.placeholder});this.__appendValueItemElement(r,e),e.setAttribute("placeholder","");}!this._valueChanging&&i&&(this._selectedChanging=!0,this.value=i.value||"",this.__dispatchChangePending&&this.__dispatchChange(),delete this._selectedChanging);const o=i||this.placeholder?{newId:this._itemId}:{oldId:this._itemId};we(e,"aria-labelledby",o),(this.accessibleName||this.accessibleNameRef)&&this._setCustomAriaLabelledBy(this.accessibleNameRef||this._srLabelController.defaultId);}_hasContent(e){if(!e)return !1;const i=!!(e.hasAttribute("label")?e.getAttribute("label"):e.textContent.trim()),o=e.childElementCount>0;return i||o}_updateSelectedItem(e,i){if(i){const o=e==null?e:e.toString();this._menuElement.selected=i.reduce((r,n,a)=>r===void 0&&n.value===o?a:r,void 0),this._selectedChanging||(this._valueChanging=!0,this.__updateValueButton(),delete this._valueChanging);}}_shouldRemoveFocus(){return !this.opened}_setFocused(e){super._setFocused(e),!e&&document.hasFocus()&&this.validate();}checkValidity(){return !this.required||this.readonly||!!this.value}__defaultRenderer(e,i){if(!this.items||this.items.length===0){e.textContent="";return}let o=e.firstElementChild;o||(o=document.createElement("vaadin-select-list-box"),e.appendChild(o)),o.textContent="",this.items.forEach(r=>{o.appendChild(this.__createItemElement(r));});}__dispatchChange(){return Ne(this,null,function*(){this.updateComplete&&(yield this.updateComplete),this.validate(),this.dispatchEvent(new CustomEvent("change",{bubbles:!0})),this.__dispatchChangePending=!1;})}};/**
+ * @license
+ * Copyright (c) 2017 - 2024 Vaadin Ltd.
+ * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
+ */f("vaadin-select",[$n,Hn,U_],{moduleId:"vaadin-select-styles"});class Y_ extends j_(q(I(g))){static get is(){return "vaadin-select"}static get template(){return v`
       <style>
         :host {
-          position: fixed;
-          z-index: 1000;
-          top: 0;
-          left: 0;
-          bottom: 0;
-          right: 0;
-          box-sizing: border-box;
-
-          display: flex;
-          flex-direction: column;
-          align-items: stretch;
-          pointer-events: none;
+          position: relative;
         }
 
-        [region-group] {
-          flex: 1 1 0%;
-          display: flex;
+        ::slotted([slot='value']) {
+          flex-grow: 1;
         }
+      </style>
 
-        [region-group='top'] {
-          align-items: flex-start;
-        }
+      <div class="vaadin-select-container">
+        <div part="label" on-click="_onClick">
+          <slot name="label"></slot>
+          <span part="required-indicator" aria-hidden="true" on-click="focus"></span>
+        </div>
 
-        [region-group='bottom'] {
-          align-items: flex-end;
-        }
+        <vaadin-input-container
+          part="input-field"
+          readonly="[[readonly]]"
+          disabled="[[disabled]]"
+          invalid="[[invalid]]"
+          theme$="[[_theme]]"
+          on-click="_onClick"
+        >
+          <slot name="prefix" slot="prefix"></slot>
+          <slot name="value"></slot>
+          <div part="toggle-button" slot="suffix" aria-hidden="true" on-mousedown="_onToggleMouseDown"></div>
+        </vaadin-input-container>
 
-        [region-group] > [region] {
-          flex: 1 1 0%;
-        }
+        <div part="helper-text">
+          <slot name="helper"></slot>
+        </div>
 
-        @media (max-width: 420px) {
-          [region-group] {
-            flex-direction: column;
-            align-items: stretch;
-          }
+        <div part="error-message">
+          <slot name="error-message"></slot>
+        </div>
+      </div>
 
-          [region-group='top'] {
-            justify-content: flex-start;
-          }
+      <vaadin-select-overlay
+        position-target="[[_inputContainer]]"
+        opened="{{opened}}"
+        with-backdrop="[[_phone]]"
+        phone$="[[_phone]]"
+        theme$="[[_theme]]"
+        no-vertical-overlap$="[[noVerticalOverlap]]"
+        on-vaadin-overlay-open="_onOverlayOpen"
+      ></vaadin-select-overlay>
 
-          [region-group='bottom'] {
-            justify-content: flex-end;
-          }
+      <slot name="tooltip"></slot>
+      <div class="sr-only">
+        <slot name="sr-label"></slot>
+      </div>
+    `}static get observers(){return ["_rendererChanged(renderer, _overlayElement)"]}ready(){super.ready(),to(this);}_rendererChanged(t,e){e&&(e.renderer=t||this.__defaultRenderer,this.requestContentUpdate());}_onOverlayOpen(){this._menuElement&&this._menuElement.focus();}}x(Y_);const Sa=p`
+  /* Optical centering */
+  :host::before,
+  :host::after {
+    content: '';
+    flex-basis: 0;
+    flex-grow: 1;
+  }
 
-          [region-group] > [region] {
-            flex: initial;
-          }
-        }
-      </style>
+  :host::after {
+    flex-grow: 1.1;
+  }
 
-      <div region="top-stretch"><slot name="top-stretch"></slot></div>
-      <div region-group="top">
-        <div region="top-start"><slot name="top-start"></slot></div>
-        <div region="top-center"><slot name="top-center"></slot></div>
-        <div region="top-end"><slot name="top-end"></slot></div>
-      </div>
-      <div region="middle"><slot name="middle"></slot></div>
-      <div region-group="bottom">
-        <div region="bottom-start"><slot name="bottom-start"></slot></div>
-        <div region="bottom-center"><slot name="bottom-center"></slot></div>
-        <div region="bottom-end"><slot name="bottom-end"></slot></div>
-      </div>
-      <div region="bottom-stretch"><slot name="bottom-stretch"></slot></div>
-    `}static get is(){return "vaadin-notification-container"}static get properties(){return {opened:{type:Boolean,value:!1,observer:"_openedChanged"}}}constructor(){super(),this._boundVaadinOverlayClose=this._onVaadinOverlayClose.bind(this),qs&&(this._boundIosResizeListener=()=>this._detectIosNavbar());}_openedChanged(t){t?(document.body.appendChild(this),document.addEventListener("vaadin-overlay-close",this._boundVaadinOverlayClose),this._boundIosResizeListener&&(this._detectIosNavbar(),window.addEventListener("resize",this._boundIosResizeListener))):(document.body.removeChild(this),document.removeEventListener("vaadin-overlay-close",this._boundVaadinOverlayClose),this._boundIosResizeListener&&window.removeEventListener("resize",this._boundIosResizeListener));}_detectIosNavbar(){const t=window.innerHeight,i=window.innerWidth>t,o=document.documentElement.clientHeight;i&&o>t?this.style.bottom=`${o-t}px`:this.style.bottom="0";}_onVaadinOverlayClose(t){const e=t.detail.sourceEvent;e&&e.composedPath().indexOf(this)>=0&&t.preventDefault();}}class T_ extends I(g){static get template(){return v`
-      <style>
-        :host {
-          display: block;
-        }
+  [part='overlay'] {
+    border-radius: var(--lumo-border-radius-l);
+    box-shadow:
+      0 0 0 1px var(--lumo-shade-5pct),
+      var(--lumo-box-shadow-xl);
+    background-image: none;
+    outline: none;
+    -webkit-tap-highlight-color: transparent;
+  }
 
-        [part='overlay'] {
-          pointer-events: auto;
-        }
+  [part='content'] {
+    padding: var(--lumo-space-l);
+  }
 
-        @media (forced-colors: active) {
-          [part='overlay'] {
-            outline: 3px solid;
-          }
-        }
-      </style>
+  :host(:is([has-header], [has-title])) [part='header'] + [part='content'] {
+    padding-top: 0;
+  }
 
-      <div part="overlay">
-        <div part="content">
-          <slot></slot>
-        </div>
-      </div>
-    `}static get is(){return "vaadin-notification-card"}ready(){super.ready(),this.setAttribute("role","alert"),this.setAttribute("aria-live","polite");}}class K extends ct($t(q(g))){static get template(){return v`
-      <style>
-        :host {
-          display: none !important;
-        }
-      </style>
-      <vaadin-notification-card theme$="[[_theme]]"> </vaadin-notification-card>
-    `}static get is(){return "vaadin-notification"}static get properties(){return {duration:{type:Number,value:5e3},opened:{type:Boolean,value:!1,notify:!0,observer:"_openedChanged"},position:{type:String,value:"bottom-start",observer:"_positionChanged"},renderer:Function}}static get observers(){return ["_durationChanged(duration, opened)","_rendererChanged(renderer, opened, _overlayElement)"]}static show(t,e){return S_(t)?K._createAndShowNotification(i=>{Sr(t,i);},e):K._createAndShowNotification(i=>{i.innerText=t;},e)}static _createAndShowNotification(t,e){const i=document.createElement(K.is);return e&&Number.isFinite(e.duration)&&(i.duration=e.duration),e&&e.position&&(i.position=e.position),e&&e.theme&&i.setAttribute("theme",e.theme),i.renderer=t,document.body.appendChild(i),i.opened=!0,i.addEventListener("opened-changed",o=>{o.detail.value||i.remove();}),i}get _container(){return K._container||(K._container=document.createElement("vaadin-notification-container"),document.body.appendChild(K._container)),K._container}get _card(){return this._overlayElement}ready(){super.ready(),this._overlayElement=this.shadowRoot.querySelector("vaadin-notification-card"),to(this);}disconnectedCallback(){super.disconnectedCallback(),queueMicrotask(()=>{this.isConnected||(this.opened=!1);});}requestContentUpdate(){this.renderer&&this.renderer(this._card,this);}_rendererChanged(t,e,i){if(!i)return;const o=this._oldRenderer!==t;this._oldRenderer=t,o&&(i.innerHTML="",delete i._$litPart$),e&&(this._didAnimateNotificationAppend||this._animatedAppendNotificationCard(),this.requestContentUpdate());}open(){this.opened=!0;}close(){this.opened=!1;}_openedChanged(t){t?(this._container.opened=!0,this._animatedAppendNotificationCard()):this._card&&this._closeNotificationCard();}__cleanUpOpeningClosingState(){this._card.removeAttribute("opening"),this._card.removeAttribute("closing"),this._card.removeEventListener("animationend",this.__animationEndListener);}_animatedAppendNotificationCard(){this._card?(this.__cleanUpOpeningClosingState(),this._card.setAttribute("opening",""),this._appendNotificationCard(),this.__animationEndListener=()=>this.__cleanUpOpeningClosingState(),this._card.addEventListener("animationend",this.__animationEndListener),this._didAnimateNotificationAppend=!0):this._didAnimateNotificationAppend=!1;}_appendNotificationCard(){if(this._card){if(!this._container.shadowRoot.querySelector(`slot[name="${this.position}"]`)){console.warn(`Invalid alignment parameter provided: position=${this.position}`);return}this._container.bringToFront(),this._card.slot=this.position,this._container.firstElementChild&&/top/u.test(this.position)?this._container.insertBefore(this._card,this._container.firstElementChild):this._container.appendChild(this._card);}}_removeNotificationCard(){this._card.parentNode&&this._card.parentNode.removeChild(this._card),this._card.removeAttribute("closing"),this._container.opened=!!this._container.firstElementChild,this.dispatchEvent(new CustomEvent("closed"));}_closeNotificationCard(){this._durationTimeoutId&&clearTimeout(this._durationTimeoutId),this._animatedRemoveNotificationCard();}_animatedRemoveNotificationCard(){this.__cleanUpOpeningClosingState(),this._card.setAttribute("closing","");const t=getComputedStyle(this._card).getPropertyValue("animation-name");t&&t!=="none"?(this.__animationEndListener=()=>{this._removeNotificationCard(),this.__cleanUpOpeningClosingState();},this._card.addEventListener("animationend",this.__animationEndListener)):this._removeNotificationCard();}_positionChanged(){this.opened&&this._animatedAppendNotificationCard();}_durationChanged(t,e){e&&(clearTimeout(this._durationTimeoutId),t>0&&(this._durationTimeoutId=setTimeout(()=>this.close(),t)));}}x(k_);x(T_);x(K);const Ea=p`
-  :host {
-    -webkit-tap-highlight-color: transparent;
-    --_lumo-item-selected-icon-display: var(--_lumo-list-box-item-selected-icon-display, block);
+  [part='header'],
+  [part='header-content'],
+  [part='footer'] {
+    gap: var(--lumo-space-xs) var(--lumo-space-s);
+    line-height: var(--lumo-line-height-s);
   }
 
-  /* Dividers */
-  [part='items'] ::slotted(hr) {
-    height: 1px;
-    border: 0;
-    padding: 0;
-    margin: var(--lumo-space-s) var(--lumo-border-radius-m);
-    background-color: var(--lumo-contrast-10pct);
+  [part='header'] {
+    padding: var(--lumo-space-m);
+    background-color: var(--lumo-base-color);
+    border-radius: var(--lumo-border-radius-l) var(--lumo-border-radius-l) 0 0; /* Needed for Safari */
   }
-`;f("vaadin-list-box",Ea,{moduleId:"lumo-list-box"});/**
- * @license
- * Copyright (c) 2017 - 2024 Vaadin Ltd.
- * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
- */f("vaadin-select-item",eo,{moduleId:"lumo-select-item"});f("vaadin-select-list-box",Ea,{moduleId:"lumo-select-list-box"});const P_=p`
-  :host(:not([theme*='align'])) ::slotted([slot='value']) {
-    text-align: start;
+
+  [part='footer'] {
+    padding: var(--lumo-space-s) var(--lumo-space-m);
+    background-color: var(--lumo-contrast-5pct);
+    border-radius: 0 0 var(--lumo-border-radius-l) var(--lumo-border-radius-l); /* Needed for Safari */
+  }
+
+  [part='title'] {
+    font-size: var(--lumo-font-size-xl);
+    font-weight: 600;
+    color: var(--lumo-header-text-color);
+    margin-inline-start: calc(var(--lumo-space-l) - var(--lumo-space-m));
+  }
+
+  /* No padding */
+  :host([theme~='no-padding']) [part='content'] {
+    padding: 0 !important;
+  }
+
+  @media (min-height: 320px) {
+    :host([overflow~='top']) [part='header'] {
+      box-shadow: 0 1px 0 0 var(--lumo-contrast-10pct);
+    }
   }
 
-  [part='input-field'] {
-    cursor: var(--lumo-clickable-cursor);
+  /* Animations */
+
+  :host([opening]),
+  :host([closing]) {
+    animation: 0.25s lumo-overlay-dummy-animation;
   }
 
-  [part='input-field'] ::slotted([slot='value']) {
-    font-weight: var(--vaadin-input-field-value-font-weight, 500);
+  :host([opening]) [part='overlay'] {
+    animation: 0.12s 0.05s vaadin-dialog-enter cubic-bezier(0.215, 0.61, 0.355, 1) both;
   }
 
-  [part='input-field'] ::slotted([slot='value']:not([placeholder])) {
-    color: var(--vaadin-input-field-value-color, var(--lumo-body-text-color));
+  @keyframes vaadin-dialog-enter {
+    0% {
+      opacity: 0;
+      transform: scale(0.95);
+    }
   }
 
-  :host([readonly]) [part='input-field'] ::slotted([slot='value']:not([placeholder])) {
-    color: var(--lumo-secondary-text-color);
+  :host([closing]) [part='overlay'] {
+    animation: 0.1s 0.03s vaadin-dialog-exit cubic-bezier(0.55, 0.055, 0.675, 0.19) both;
   }
 
-  /* placeholder styles */
-  [part='input-field'] ::slotted([slot='value'][placeholder]) {
-    color: var(--vaadin-input-field-placeholder-color, var(--lumo-secondary-text-color));
+  :host([closing]) [part='backdrop'] {
+    animation-delay: 0.05s;
   }
 
-  :host(:is([readonly], [disabled])) ::slotted([slot='value'][placeholder]) {
-    opacity: 0;
+  @keyframes vaadin-dialog-exit {
+    100% {
+      opacity: 0;
+      transform: scale(1.02);
+    }
   }
+`;f("vaadin-dialog-overlay",[ht,Sa],{moduleId:"lumo-dialog"});f("vaadin-confirm-dialog-overlay",[ht,Sa,p`
+      [part='header'] ::slotted(h3) {
+        margin-top: 0 !important;
+        margin-bottom: 0 !important;
+        margin-inline-start: calc(var(--lumo-space-l) - var(--lumo-space-m));
+      }
 
-  [part='toggle-button']::before {
-    content: var(--lumo-icons-dropdown);
+      [part='message'] {
+        width: 25em;
+        min-width: 100%;
+        max-width: 100%;
+      }
+
+      ::slotted([slot$='button'][theme~='tertiary']) {
+        padding-left: var(--lumo-space-s);
+        padding-right: var(--lumo-space-s);
+      }
+
+      [part='cancel-button'] {
+        flex-grow: 1;
+      }
+
+      @media (max-width: 360px) {
+        [part='footer'] {
+          flex-direction: column-reverse;
+          align-items: stretch;
+          padding: var(--lumo-space-s) var(--lumo-space-l);
+          gap: var(--lumo-space-s);
+        }
+
+        ::slotted([slot$='button']) {
+          width: 100%;
+          margin: 0;
+        }
+      }
+    `],{moduleId:"lumo-confirm-dialog-overlay"});/**
+ * @license
+ * Copyright (c) 2017 - 2024 Vaadin Ltd.
+ * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
+ */const G_=s=>class extends s{static get properties(){return {opened:{type:Boolean,value:!1,notify:!0},noCloseOnOutsideClick:{type:Boolean,value:!1},noCloseOnEsc:{type:Boolean,value:!1},modeless:{type:Boolean,value:!1},overlayRole:{type:String,value:"dialog"}}}ready(){super.ready();const e=this.$.overlay;e.addEventListener("vaadin-overlay-outside-click",this._handleOutsideClick.bind(this)),e.addEventListener("vaadin-overlay-escape-press",this._handleEscPress.bind(this)),e.addEventListener("vaadin-overlay-closed",this.__handleOverlayClosed.bind(this)),this._overlayElement=e;}__handleOverlayClosed(){this.dispatchEvent(new CustomEvent("closed"));}connectedCallback(){super.connectedCallback(),this.__restoreOpened&&(this.opened=!0);}disconnectedCallback(){super.disconnectedCallback(),setTimeout(()=>{this.isConnected||(this.__restoreOpened=this.opened,this.opened=!1);});}_onOverlayOpened(e){e.detail.value===!1&&(this.opened=!1);}_handleOutsideClick(e){this.noCloseOnOutsideClick&&e.preventDefault();}_handleEscPress(e){this.noCloseOnEsc&&e.preventDefault();}_bringOverlayToFront(){this.modeless&&this._overlayElement.bringToFront();}};/**
+ * @license
+ * Copyright (c) 2017 - 2024 Vaadin Ltd.
+ * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
+ */const K_=p`
+  [part='header'],
+  [part='header-content'],
+  [part='footer'] {
+    display: flex;
+    align-items: center;
+    flex-wrap: wrap;
+    flex: none;
+    pointer-events: none;
+    z-index: 1;
   }
 
-  /* Highlight the toggle button when hovering over the entire component */
-  :host(:hover:not([readonly]):not([disabled])) [part='toggle-button'] {
-    color: var(--lumo-contrast-80pct);
+  [part='header'] {
+    flex-wrap: nowrap;
   }
 
-  :host([theme~='small']) [part='input-field'] ::slotted([slot='value']) {
-    --_lumo-selected-item-height: var(--lumo-size-s);
-    --_lumo-selected-item-padding: 0;
+  ::slotted([slot='header-content']),
+  ::slotted([slot='title']),
+  ::slotted([slot='footer']) {
+    display: contents;
+    pointer-events: auto;
   }
-`;f("vaadin-select",[Oe,P_],{moduleId:"lumo-select"});f("vaadin-select-value-button",p`
-    :host {
-      font-family: var(--lumo-font-family);
-      font-size: var(--vaadin-input-field-value-font-size, var(--lumo-font-size-m));
-      padding: 0 0.25em;
-      --_lumo-selected-item-height: var(--lumo-size-m);
-      --_lumo-selected-item-padding: 0.5em;
-    }
 
-    ::slotted(*) {
-      min-height: var(--_lumo-selected-item-height);
-      padding-top: var(--_lumo-selected-item-padding);
-      padding-bottom: var(--_lumo-selected-item-padding);
-      font-size: inherit;
-    }
+  ::slotted([slot='title']) {
+    font: inherit !important;
+    overflow-wrap: anywhere;
+  }
 
-    ::slotted(*:hover) {
-      background-color: transparent;
-    }
-  `,{moduleId:"lumo-select-value-button"});const O_=p`
-  :host {
-    --_lumo-item-selected-icon-display: block;
+  [part='header-content'] {
+    flex: 1;
   }
 
-  /* Small viewport adjustment */
-  :host([phone]) {
-    /* stylelint-disable declaration-block-no-redundant-longhand-properties */
-    top: 0 !important;
-    right: 0 !important;
-    bottom: var(--vaadin-overlay-viewport-bottom, 0) !important;
-    left: 0 !important;
-    /* stylelint-enable declaration-block-no-redundant-longhand-properties */
-    align-items: stretch;
+  :host([has-title]) [part='header-content'],
+  [part='footer'] {
     justify-content: flex-end;
   }
 
-  :host([no-vertical-overlap][top-aligned]) [part='overlay'] {
-    margin-block-start: var(--lumo-space-xs);
+  :host(:not([has-title]):not([has-header])) [part='header'],
+  :host(:not([has-header])) [part='header-content'],
+  :host(:not([has-title])) [part='title'],
+  :host(:not([has-footer])) [part='footer'] {
+    display: none !important;
   }
 
-  :host([no-vertical-overlap][bottom-aligned]) [part='overlay'] {
-    margin-block-end: var(--lumo-space-xs);
+  :host(:is([has-title], [has-header], [has-footer])) [part='content'] {
+    height: auto;
   }
 
-  :host([theme~='align-left']) {
-    text-align: left;
-  }
+  @media (min-height: 320px) {
+    :host(:is([has-title], [has-header], [has-footer])) .resizer-container {
+      overflow: hidden;
+      display: flex;
+      flex-direction: column;
+    }
 
-  :host([theme~='align-right']) {
-    text-align: right;
+    :host(:is([has-title], [has-header], [has-footer])) [part='content'] {
+      flex: 1;
+      overflow: auto;
+    }
   }
 
-  :host([theme~='align-center']) {
-    text-align: center;
+  /*
+      NOTE(platosha): Make some min-width to prevent collapsing of the content
+      taking the parent width, e. g., <vaadin-grid> and such.
+    */
+  [part='content'] {
+    min-width: 12em; /* matches the default <vaadin-text-field> width */
   }
-`;f("vaadin-select-overlay",[Hs,O_],{moduleId:"lumo-select-overlay"});/**
- * @license
- * Copyright (c) 2017 - 2024 Vaadin Ltd.
- * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
- */const D_=s=>class extends Ds(fe(s)){static get properties(){return {_hasVaadinItemMixin:{value:!0},selected:{type:Boolean,value:!1,reflectToAttribute:!0,observer:"_selectedChanged"},_value:String}}get _activeKeys(){return ["Enter"," "]}get value(){return this._value!==void 0?this._value:this.textContent.trim()}set value(e){this._value=e;}ready(){super.ready();const e=this.getAttribute("value");e!==null&&(this.value=e);}focus(){this.disabled||(super.focus(),this._setFocused(!0));}_shouldSetActive(e){return !this.disabled&&!(e.type==="keydown"&&e.defaultPrevented)}_selectedChanged(e){this.setAttribute("aria-selected",e);}_disabledChanged(e){super._disabledChanged(e),e&&(this.selected=!1,this.blur());}_onKeyDown(e){super._onKeyDown(e),this._activeKeys.includes(e.key)&&!e.defaultPrevented&&(e.preventDefault(),this.click());}};/**
- * @license
- * Copyright (c) 2017 - 2024 Vaadin Ltd.
- * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
- */class z_ extends D_(I(R(g))){static get is(){return "vaadin-select-item"}static get template(){return v`
-      <style>
-        :host {
-          display: inline-block;
-        }
 
-        :host([hidden]) {
-          display: none !important;
-        }
-      </style>
-      <span part="checkmark" aria-hidden="true"></span>
-      <div part="content">
-        <slot></slot>
-      </div>
-    `}ready(){super.ready(),this.setAttribute("role","option");}}x(z_);/**
- * @license
- * Copyright (c) 2021 - 2024 Vaadin Ltd.
- * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
- */function M_(s,t){const{scrollLeft:e}=s;return t!=="rtl"?e:s.scrollWidth-s.clientWidth+e}function N_(s,t,e){t!=="rtl"?s.scrollLeft=e:s.scrollLeft=s.clientWidth-s.scrollWidth+e;}/**
- * @license
- * Copyright (c) 2022 - 2024 Vaadin Ltd.
- * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
- */const L_=s=>class extends me(s){get focused(){return (this._getItems()||[]).find(Ns)}get _vertical(){return !0}focus(){const e=this._getItems();if(Array.isArray(e)){const i=this._getAvailableIndex(e,0,null,o=>!Ki(o));i>=0&&this._focus(i);}}_getItems(){return Array.from(this.children)}_onKeyDown(e){if(super._onKeyDown(e),e.metaKey||e.ctrlKey)return;const{key:i}=e,o=this._getItems()||[],r=o.indexOf(this.focused);let n,a;const d=!this._vertical&&this.getAttribute("dir")==="rtl"?-1:1;this.__isPrevKey(i)?(a=-d,n=r-d):this.__isNextKey(i)?(a=d,n=r+d):i==="Home"?(a=1,n=0):i==="End"&&(a=-1,n=o.length-1),n=this._getAvailableIndex(o,n,a,h=>!Ki(h)),n>=0&&(e.preventDefault(),this._focus(n,!0));}__isPrevKey(e){return this._vertical?e==="ArrowUp":e==="ArrowLeft"}__isNextKey(e){return this._vertical?e==="ArrowDown":e==="ArrowRight"}_focus(e,i=!1){const o=this._getItems();this._focusItem(o[e],i);}_focusItem(e){e&&(e.focus(),e.setAttribute("focus-ring",""));}_getAvailableIndex(e,i,o,r){const n=e.length;let a=i;for(let l=0;typeof a=="number"&&l<n;l+=1,a+=o||1){a<0?a=n-1:a>=n&&(a=0);const d=e[a];if(!d.hasAttribute("disabled")&&this.__isMatchingItem(d,r))return a}return -1}__isMatchingItem(e,i){return typeof i=="function"?i(e):!0}};/**
- * @license
- * Copyright (c) 2017 - 2024 Vaadin Ltd.
- * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
- */const V_=s=>class extends L_(s){static get properties(){return {disabled:{type:Boolean,value:!1,reflectToAttribute:!0},selected:{type:Number,reflectToAttribute:!0,notify:!0},orientation:{type:String,reflectToAttribute:!0,value:""},items:{type:Array,readOnly:!0,notify:!0},_searchBuf:{type:String,value:""}}}static get observers(){return ["_enhanceItems(items, orientation, selected, disabled)"]}get _isRTL(){return !this._vertical&&this.getAttribute("dir")==="rtl"}get _scrollerElement(){return console.warn(`Please implement the '_scrollerElement' property in <${this.localName}>`),this}get _vertical(){return this.orientation!=="horizontal"}focus(){this._observer&&this._observer.flush();const e=Array.isArray(this.items)?this.items:[],i=this._getAvailableIndex(e,0,null,o=>o.tabIndex===0&&!Ki(o));i>=0?this._focus(i):super.focus();}ready(){super.ready(),this.addEventListener("click",i=>this._onClick(i));const e=this.shadowRoot.querySelector("slot:not([name])");this._observer=new Ss(e,()=>{this._setItems(this._filterItems(cn(this)));});}_getItems(){return this.items}_enhanceItems(e,i,o,r){if(!r&&e){this.setAttribute("aria-orientation",i||"vertical"),e.forEach(a=>{i?a.setAttribute("orientation",i):a.removeAttribute("orientation");}),this._setFocusable(o<0||!o?0:o);const n=e[o];e.forEach(a=>{a.selected=a===n;}),n&&!n.disabled&&this._scrollToItem(o);}}_filterItems(e){return e.filter(i=>i._hasVaadinItemMixin)}_onClick(e){if(e.metaKey||e.shiftKey||e.ctrlKey||e.defaultPrevented)return;const i=this._filterItems(e.composedPath())[0];let o;i&&!i.disabled&&(o=this.items.indexOf(i))>=0&&(this.selected=o);}_searchKey(e,i){this._searchReset=M.debounce(this._searchReset,ie.after(500),()=>{this._searchBuf="";}),this._searchBuf+=i.toLowerCase(),this.items.some(r=>this.__isMatchingKey(r))||(this._searchBuf=i.toLowerCase());const o=this._searchBuf.length===1?e+1:e;return this._getAvailableIndex(this.items,o,1,r=>this.__isMatchingKey(r)&&getComputedStyle(r).display!=="none")}__isMatchingKey(e){return e.textContent.replace(/[^\p{L}\p{Nd}]/gu,"").toLowerCase().startsWith(this._searchBuf)}_onKeyDown(e){if(e.metaKey||e.ctrlKey)return;const i=e.key,o=this.items.indexOf(this.focused);if(/[\p{L}\p{Nd}]/u.test(i)&&i.length===1){const r=this._searchKey(o,i);r>=0&&this._focus(r);return}super._onKeyDown(e);}_isItemHidden(e){return getComputedStyle(e).display==="none"}_setFocusable(e){e=this._getAvailableIndex(this.items,e,1);const i=this.items[e];this.items.forEach(o=>{o.tabIndex=o===i?0:-1;});}_focus(e){this.items.forEach((i,o)=>{i.focused=o===e;}),this._setFocusable(e),this._scrollToItem(e),super._focus(e);}_scrollToItem(e){const i=this.items[e];if(!i)return;const o=this._vertical?["top","bottom"]:this._isRTL?["right","left"]:["left","right"],r=this._scrollerElement.getBoundingClientRect(),n=(this.items[e+1]||i).getBoundingClientRect(),a=(this.items[e-1]||i).getBoundingClientRect();let l=0;!this._isRTL&&n[o[1]]>=r[o[1]]||this._isRTL&&n[o[1]]<=r[o[1]]?l=n[o[1]]-r[o[1]]:(!this._isRTL&&a[o[0]]<=r[o[0]]||this._isRTL&&a[o[0]]>=r[o[0]])&&(l=a[o[0]]-r[o[0]]),this._scroll(l);}_scroll(e){if(this._vertical)this._scrollerElement.scrollTop+=e;else {const i=this.getAttribute("dir")||"ltr",o=M_(this._scrollerElement,i)+e;N_(this._scrollerElement,i,o);}}};/**
- * @license
- * Copyright (c) 2017 - 2024 Vaadin Ltd.
- * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
- */class B_ extends V_(I(R(J(g)))){static get is(){return "vaadin-select-list-box"}static get template(){return v`
-      <style>
-        :host {
-          display: flex;
-        }
+  :host([has-bounds-set]) [part='overlay'] {
+    max-width: none;
+  }
 
-        :host([hidden]) {
-          display: none !important;
-        }
+  @media (forced-colors: active) {
+    [part='overlay'] {
+      outline: 3px solid !important;
+    }
+  }
+`;p`
+  [part='overlay'] {
+    position: relative;
+    overflow: visible;
+    max-height: 100%;
+    display: flex;
+  }
 
-        [part='items'] {
-          height: 100%;
-          width: 100%;
-          overflow-y: auto;
-          -webkit-overflow-scrolling: touch;
-        }
-      </style>
-      <div part="items">
-        <slot></slot>
-      </div>
-    `}static get properties(){return {orientation:{readOnly:!0}}}get _scrollerElement(){return this.shadowRoot.querySelector('[part="items"]')}ready(){super.ready(),this.setAttribute("role","listbox");}}x(B_);/**
- * @license
- * Copyright (c) 2017 - 2024 Vaadin Ltd.
- * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
- */const F_=s=>class extends Us(Jt(R(s))){static get observers(){return ["_updateOverlayWidth(opened, owner)"]}ready(){super.ready(),this.restoreFocusOnClose=!0;}_getMenuElement(){return Array.from(this.children).find(e=>e.localName!=="style")}_updateOverlayWidth(e,i){if(e&&i){const o="--vaadin-select-overlay-width",r=getComputedStyle(i).getPropertyValue(o);r===""?this.style.removeProperty(o):this.style.setProperty(o,r);}}};/**
- * @license
- * Copyright (c) 2017 - 2024 Vaadin Ltd.
- * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
- */const R_=p`
-  :host {
-    align-items: flex-start;
-    justify-content: flex-start;
+  [part='content'] {
+    box-sizing: border-box;
+    height: 100%;
   }
 
-  :host(:not([phone])) [part='overlay'] {
-    min-width: var(--vaadin-select-overlay-width, var(--vaadin-select-text-field-width));
+  .resizer-container {
+    overflow: auto;
+    flex-grow: 1;
+    border-radius: inherit; /* prevent child elements being drawn outside part=overlay */
   }
 
-  @media (forced-colors: active) {
-    [part='overlay'] {
-      outline: 3px solid;
-    }
+  [part='overlay'][style] .resizer-container {
+    min-height: 100%;
+    width: 100%;
   }
-`;f("vaadin-select-overlay",[Kt,R_],{moduleId:"vaadin-select-overlay-styles"});class $_ extends F_(I(g)){static get is(){return "vaadin-select-overlay"}static get template(){return v`
-      <div id="backdrop" part="backdrop" hidden$="[[!withBackdrop]]"></div>
-      <div part="overlay" id="overlay" tabindex="0">
-        <div part="content" id="content">
-          <slot></slot>
-        </div>
-      </div>
-    `}ready(){super.ready(),this.owner=this.__dataHost,this.owner._overlayElement=this;}requestContentUpdate(){if(super.requestContentUpdate(),this.owner){const t=this._getMenuElement();this.owner._assignMenuElement(t);}}}x($_);/**
- * @license
- * Copyright (c) 2017 - 2024 Vaadin Ltd.
- * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
- */const H_=p`
-  :host {
-    display: inline-block;
-    position: relative;
-    outline: none;
-    white-space: nowrap;
+
+  :host(:not([resizable])) .resizer {
+    display: none;
+  }
+
+  :host([resizable]) [part='title'] {
+    cursor: move;
     -webkit-user-select: none;
-    -moz-user-select: none;
     user-select: none;
-    min-width: 0;
-    width: 0;
   }
 
-  ::slotted(*) {
-    padding-left: 0;
-    padding-right: 0;
-    flex: auto;
+  .resizer {
+    position: absolute;
+    height: 16px;
+    width: 16px;
   }
 
-  /* placeholder styles */
-  ::slotted(*:not([selected])) {
-    line-height: 1;
+  .resizer.edge {
+    height: 8px;
+    width: 8px;
+    inset: -4px;
   }
 
-  .vaadin-button-container {
-    display: inline-flex;
-    align-items: center;
-    justify-content: center;
-    text-align: inherit;
-    width: 100%;
-    height: 100%;
-    min-height: inherit;
-    text-shadow: inherit;
+  .resizer.edge.n {
+    width: auto;
+    bottom: auto;
+    cursor: ns-resize;
   }
 
-  [part='label'] {
-    white-space: nowrap;
-    overflow: hidden;
-    text-overflow: ellipsis;
-    width: 100%;
-    line-height: inherit;
+  .resizer.ne {
+    top: -4px;
+    right: -4px;
+    cursor: nesw-resize;
+  }
+
+  .resizer.edge.e {
+    height: auto;
+    left: auto;
+    cursor: ew-resize;
+  }
+
+  .resizer.se {
+    bottom: -4px;
+    right: -4px;
+    cursor: nwse-resize;
+  }
+
+  .resizer.edge.s {
+    width: auto;
+    top: auto;
+    cursor: ns-resize;
+  }
+
+  .resizer.sw {
+    bottom: -4px;
+    left: -4px;
+    cursor: nesw-resize;
+  }
+
+  .resizer.edge.w {
+    height: auto;
+    right: auto;
+    cursor: ew-resize;
+  }
+
+  .resizer.nw {
+    top: -4px;
+    left: -4px;
+    cursor: nwse-resize;
   }
 `;/**
  * @license
- * Copyright (c) 2017 - 2024 Vaadin Ltd.
+ * Copyright (c) 2018 - 2024 Vaadin Ltd.
  * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
- */f("vaadin-select-value-button",H_,{moduleId:"vaadin-select-value-button-styles"});class q_ extends Ws(I(g)){static get is(){return "vaadin-select-value-button"}static get template(){return v`
-      <div class="vaadin-button-container">
-        <span part="label">
-          <slot></slot>
-        </span>
-      </div>
-    `}}x(q_);/**
+ */const X_=s=>class extends s{static get properties(){return {ariaLabel:{type:String,value:""},contentHeight:{type:String},contentWidth:{type:String}}}static get observers(){return ["__updateContentHeight(contentHeight, _overlayElement)","__updateContentWidth(contentWidth, _overlayElement)"]}__updateDimension(e,i,o){const r=`--_vaadin-confirm-dialog-content-${i}`;o?e.style.setProperty(r,o):e.style.removeProperty(r);}__updateContentHeight(e,i){i&&this.__updateDimension(i,"height",e);}__updateContentWidth(e,i){i&&this.__updateDimension(i,"width",e);}};/**
  * @license
- * Copyright (c) 2021 - 2024 Vaadin Ltd..
+ * Copyright (c) 2018 - 2024 Vaadin Ltd.
  * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
- */const U_=p`
-  .sr-only {
-    border: 0 !important;
-    clip: rect(1px, 1px, 1px, 1px) !important;
-    -webkit-clip-path: inset(50%) !important;
-    clip-path: inset(50%) !important;
-    height: 1px !important;
-    margin: -1px !important;
-    overflow: hidden !important;
-    padding: 0 !important;
-    position: absolute !important;
-    width: 1px !important;
-    white-space: nowrap !important;
+ */const J_=p`
+  :host {
+    --_vaadin-confirm-dialog-content-width: auto;
+    --_vaadin-confirm-dialog-content-height: auto;
+  }
+
+  [part='overlay'] {
+    width: var(--_vaadin-confirm-dialog-content-width);
+    height: var(--_vaadin-confirm-dialog-content-height);
+  }
+
+  ::slotted([slot='header']) {
+    pointer-events: auto;
+  }
+
+  /* Make buttons clickable */
+  [part='footer'] > * {
+    pointer-events: all;
   }
 `;/**
  * @license
- * Copyright (c) 2023 - 2024 Vaadin Ltd.
+ * Copyright (c) 2018 - 2024 Vaadin Ltd.
  * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
- */class W_ extends D{constructor(t){super(t,"value","vaadin-select-value-button",{initializer:(e,i)=>{i._setFocusElement(e),i.ariaTarget=e,i.stateTarget=e,e.setAttribute("aria-haspopup","listbox");}});}}/**
+ */f("vaadin-confirm-dialog-overlay",[Kt,K_,J_],{moduleId:"vaadin-confirm-dialog-overlay-styles"});class Q_ extends Jt(R(I(g))){static get is(){return "vaadin-confirm-dialog-overlay"}static get template(){return v`
+      <div part="backdrop" id="backdrop" hidden$="[[!withBackdrop]]"></div>
+      <div part="overlay" id="overlay" tabindex="0">
+        <section id="resizerContainer" class="resizer-container">
+          <header part="header"><slot name="header"></slot></header>
+          <div part="content" id="content">
+            <div part="message"><slot></slot></div>
+          </div>
+          <footer part="footer" role="toolbar">
+            <div part="cancel-button">
+              <slot name="cancel-button"></slot>
+            </div>
+            <div part="reject-button">
+              <slot name="reject-button"></slot>
+            </div>
+            <div part="confirm-button">
+              <slot name="confirm-button"></slot>
+            </div>
+          </footer>
+        </section>
+      </div>
+    `}ready(){super.ready(),this.setAttribute("has-header",""),this.setAttribute("has-footer","");}}x(Q_);class Z_ extends X_(G_(ct($t(g)))){static get is(){return "vaadin-confirm-dialog-dialog"}static get template(){return v`
+      <style>
+        :host {
+          display: none;
+        }
+      </style>
+
+      <vaadin-confirm-dialog-overlay
+        id="overlay"
+        opened="[[opened]]"
+        on-opened-changed="_onOverlayOpened"
+        on-mousedown="_bringOverlayToFront"
+        on-touchstart="_bringOverlayToFront"
+        theme$="[[_theme]]"
+        modeless="[[modeless]]"
+        with-backdrop="[[!modeless]]"
+        resizable$="[[resizable]]"
+        aria-label$="[[ariaLabel]]"
+        restore-focus-on-close
+        focus-trap
+      ></vaadin-confirm-dialog-overlay>
+    `}}x(Z_);/**
  * @license
- * Copyright (c) 2017 - 2024 Vaadin Ltd.
+ * Copyright (c) 2018 - 2024 Vaadin Ltd.
  * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
- */const j_=s=>class extends ct(Wt(Ls(me(jt(s))))){static get properties(){return {items:{type:Array,observer:"__itemsChanged"},opened:{type:Boolean,value:!1,notify:!0,reflectToAttribute:!0,sync:!0},renderer:{type:Object},value:{type:String,value:"",notify:!0,observer:"_valueChanged"},name:{type:String},placeholder:{type:String},readonly:{type:Boolean,value:!1,reflectToAttribute:!0},noVerticalOverlap:{type:Boolean,value:!1},_phone:Boolean,_phoneMediaQuery:{value:"(max-width: 450px), (max-height: 450px)"},_inputContainer:Object,_items:Object}}static get delegateAttrs(){return [...super.delegateAttrs,"invalid"]}static get observers(){return ["_updateAriaExpanded(opened, focusElement)","_updateSelectedItem(value, _items, placeholder)","_openedChanged(opened, _overlayElement, _inputContainer)"]}constructor(){super(),this._itemId=`value-${this.localName}-${lt()}`,this._srLabelController=new Cn(this),this._srLabelController.slotName="sr-label";}disconnectedCallback(){super.disconnectedCallback(),this.opened=!1;}ready(){super.ready(),this._inputContainer=this.shadowRoot.querySelector('[part~="input-field"]'),this._valueButtonController=new W_(this),this.addController(this._valueButtonController),this.addController(this._srLabelController),this.addController(new Xs(this._phoneMediaQuery,e=>{this._phone=e;})),this._tooltipController=new _e(this),this._tooltipController.setPosition("top"),this._tooltipController.setAriaTarget(this.focusElement),this.addController(this._tooltipController);}requestContentUpdate(){this._overlayElement&&(this._overlayElement.requestContentUpdate(),this._menuElement&&this._menuElement.items&&this._updateSelectedItem(this.value,this._menuElement.items));}_requiredChanged(e){super._requiredChanged(e),e===!1&&this.validate();}__itemsChanged(e,i){(e||i)&&this.requestContentUpdate();}_assignMenuElement(e){e&&e!==this.__lastMenuElement&&(this._menuElement=e,this.__initMenuItems(e),e.addEventListener("items-changed",()=>{this.__initMenuItems(e);}),e.addEventListener("selected-changed",()=>this.__updateValueButton()),e.addEventListener("keydown",i=>this._onKeyDownInside(i),!0),e.addEventListener("click",i=>{const o=i.composedPath().find(r=>r._hasVaadinItemMixin);this.__dispatchChangePending=!!(o&&o.value!==void 0&&o.value!==this.value),this.opened=!1;},!0),this.__lastMenuElement=e);}__initMenuItems(e){e.items&&(this._items=e.items);}_valueChanged(e,i){this.toggleAttribute("has-value",!!e),i!==void 0&&!this.__dispatchChangePending&&this.validate();}_onClick(e){this.disabled||(e.preventDefault(),this.opened=!this.readonly);}_onToggleMouseDown(e){e.preventDefault();}_onKeyDown(e){if(e.target===this.focusElement&&!this.readonly&&!this.disabled&&!this.opened){if(/^(Enter|SpaceBar|\s|ArrowDown|Down|ArrowUp|Up)$/u.test(e.key))e.preventDefault(),this.opened=!0;else if(/[\p{L}\p{Nd}]/u.test(e.key)&&e.key.length===1){const i=this._menuElement.selected,o=i!==void 0?i:-1,r=this._menuElement._searchKey(o,e.key);r>=0&&(this.__dispatchChangePending=!0,this._updateAriaLive(!0),this._menuElement.selected=r);}}}_onKeyDownInside(e){/^(Tab)$/u.test(e.key)&&(this.opened=!1);}_openedChanged(e,i,o){if(!(!i||!o)){if(e){if(this.disabled||this.readonly){this.opened=!1;return}this._updateAriaLive(!1),i.style.setProperty("--vaadin-select-text-field-width",`${o.offsetWidth}px`);const r=this.hasAttribute("focus-ring");this._openedWithFocusRing=r,r&&this.removeAttribute("focus-ring");}else this.__oldOpened&&(this._openedWithFocusRing&&this.setAttribute("focus-ring",""),!this.__dispatchChangePending&&!this._keyboardActive&&this.validate());this.__oldOpened=e;}}_updateAriaExpanded(e,i){i&&i.setAttribute("aria-expanded",e?"true":"false");}_updateAriaLive(e){this.focusElement&&(e?this.focusElement.setAttribute("aria-live","polite"):this.focusElement.removeAttribute("aria-live"));}__attachSelectedItem(e){let i;const o=e.getAttribute("label");o?i=this.__createItemElement({label:o}):i=e.cloneNode(!0),i._sourceItem=e,this.__appendValueItemElement(i,this.focusElement),i.selected=!0;}__createItemElement(e){const i=document.createElement(e.component||"vaadin-select-item");return e.label&&(i.textContent=e.label),e.value&&(i.value=e.value),e.disabled&&(i.disabled=e.disabled),e.className&&(i.className=e.className),i}__appendValueItemElement(e,i){i.appendChild(e),e.removeAttribute("tabindex"),e.removeAttribute("aria-selected"),e.removeAttribute("role"),e.removeAttribute("focused"),e.removeAttribute("focus-ring"),e.removeAttribute("active"),e.setAttribute("id",this._itemId);}_accessibleNameChanged(e){this._srLabelController.setLabel(e),this._setCustomAriaLabelledBy(e?this._srLabelController.defaultId:null);}_accessibleNameRefChanged(e){this._setCustomAriaLabelledBy(e);}_setCustomAriaLabelledBy(e){const i=this._getLabelIdWithItemId(e);this._fieldAriaController.setLabelId(i,!0);}_getLabelIdWithItemId(e){const o=(this._items?this._items[this._menuElement.selected]:!1)||this.placeholder?this._itemId:"";return e?`${e} ${o}`.trim():null}__updateValueButton(){const e=this.focusElement;if(!e)return;e.innerHTML="";const i=this._items[this._menuElement.selected];if(e.removeAttribute("placeholder"),this._hasContent(i))this.__attachSelectedItem(i);else if(this.placeholder){const r=this.__createItemElement({label:this.placeholder});this.__appendValueItemElement(r,e),e.setAttribute("placeholder","");}!this._valueChanging&&i&&(this._selectedChanging=!0,this.value=i.value||"",this.__dispatchChangePending&&this.__dispatchChange(),delete this._selectedChanging);const o=i||this.placeholder?{newId:this._itemId}:{oldId:this._itemId};we(e,"aria-labelledby",o),(this.accessibleName||this.accessibleNameRef)&&this._setCustomAriaLabelledBy(this.accessibleNameRef||this._srLabelController.defaultId);}_hasContent(e){if(!e)return !1;const i=!!(e.hasAttribute("label")?e.getAttribute("label"):e.textContent.trim()),o=e.childElementCount>0;return i||o}_updateSelectedItem(e,i){if(i){const o=e==null?e:e.toString();this._menuElement.selected=i.reduce((r,n,a)=>r===void 0&&n.value===o?a:r,void 0),this._selectedChanging||(this._valueChanging=!0,this.__updateValueButton(),delete this._valueChanging);}}_shouldRemoveFocus(){return !this.opened}_setFocused(e){super._setFocused(e),!e&&document.hasFocus()&&this.validate();}checkValidity(){return !this.required||this.readonly||!!this.value}__defaultRenderer(e,i){if(!this.items||this.items.length===0){e.textContent="";return}let o=e.firstElementChild;o||(o=document.createElement("vaadin-select-list-box"),e.appendChild(o)),o.textContent="",this.items.forEach(r=>{o.appendChild(this.__createItemElement(r));});}__dispatchChange(){return Ne(this,null,function*(){this.updateComplete&&(yield this.updateComplete),this.validate(),this.dispatchEvent(new CustomEvent("change",{bubbles:!0})),this.__dispatchChangePending=!1;})}};/**
+ */const em=s=>class extends s{static get properties(){return {accessibleDescriptionRef:{type:String},opened:{type:Boolean,value:!1,notify:!0},header:{type:String,value:""},message:{type:String,value:""},confirmText:{type:String,value:"Confirm"},confirmTheme:{type:String,value:"primary"},noCloseOnEsc:{type:Boolean,value:!1},rejectButtonVisible:{type:Boolean,reflectToAttribute:!0,value:!1},rejectText:{type:String,value:"Reject"},rejectTheme:{type:String,value:"error tertiary"},cancelButtonVisible:{type:Boolean,reflectToAttribute:!0,value:!1},cancelText:{type:String,value:"Cancel"},cancelTheme:{type:String,value:"tertiary"},overlayClass:{type:String},_cancelButton:{type:Object},_confirmButton:{type:Object},_headerNode:{type:Object},_messageNodes:{type:Array,value:()=>[]},_overlayElement:{type:Object,sync:!0},_rejectButton:{type:Object},_contentHeight:{type:String},_contentWidth:{type:String}}}static get observers(){return ["__updateConfirmButton(_confirmButton, confirmText, confirmTheme)","__updateCancelButton(_cancelButton, cancelText, cancelTheme, cancelButtonVisible)","__updateHeaderNode(_headerNode, header)","__updateMessageNodes(_messageNodes, message)","__updateRejectButton(_rejectButton, rejectText, rejectTheme, rejectButtonVisible)","__accessibleDescriptionRefChanged(_overlayElement, _messageNodes, accessibleDescriptionRef)"]}constructor(){super(),this.__cancel=this.__cancel.bind(this),this.__confirm=this.__confirm.bind(this),this.__reject=this.__reject.bind(this);}get __slottedNodes(){return [this._headerNode,...this._messageNodes,this._cancelButton,this._confirmButton,this._rejectButton]}ready(){super.ready(),this._headerController=new D(this,"header","h3",{initializer:e=>{this._headerNode=e;}}),this.addController(this._headerController),this._messageController=new D(this,"","div",{multiple:!0,observe:!1,initializer:e=>{const i=document.createElement("div");i.style.display="contents";const o=`confirm-dialog-message-${lt()}`;i.id=o,this.appendChild(i),i.appendChild(e),this._messageNodes=[...this._messageNodes,i];}}),this.addController(this._messageController),this._cancelController=new D(this,"cancel-button","vaadin-button",{initializer:e=>{this.__setupSlottedButton("cancel",e);}}),this.addController(this._cancelController),this._rejectController=new D(this,"reject-button","vaadin-button",{initializer:e=>{this.__setupSlottedButton("reject",e);}}),this.addController(this._rejectController),this._confirmController=new D(this,"confirm-button","vaadin-button",{initializer:e=>{this.__setupSlottedButton("confirm",e);}}),this.addController(this._confirmController);}_initOverlay(e){e.addEventListener("vaadin-overlay-escape-press",this._escPressed.bind(this)),e.addEventListener("vaadin-overlay-open",()=>this.__onDialogOpened()),e.addEventListener("vaadin-overlay-closed",()=>this.__onDialogClosed()),e.setAttribute("role","alertdialog");}__onDialogOpened(){const e=this._overlayElement;this.__slottedNodes.forEach(o=>{e.appendChild(o);});const i=e.querySelector('[slot="confirm-button"]');i&&i.focus();}__onDialogClosed(){this.__slottedNodes.forEach(e=>{this.appendChild(e);}),this.dispatchEvent(new CustomEvent("closed"));}__accessibleDescriptionRefChanged(e,i,o){!e||!i||(o!==void 0?we(e,"aria-describedby",{newId:o,oldId:this.__oldAccessibleDescriptionRef,fromUser:!0}):i.forEach(r=>{we(e,"aria-describedby",{newId:r.id});}),this.__oldAccessibleDescriptionRef=o);}__setupSlottedButton(e,i){const o=`_${e}Button`,r=`__${e}`;this[o]&&this[o]!==i&&this[o].remove(),i.addEventListener("click",this[r]),this[o]=i;}__updateCancelButton(e,i,o,r){e&&(e===this._cancelController.defaultNode&&(e.textContent=i,e.setAttribute("theme",o)),e.toggleAttribute("hidden",!r));}__updateConfirmButton(e,i,o){e&&e===this._confirmController.defaultNode&&(e.textContent=i,e.setAttribute("theme",o));}__updateHeaderNode(e,i){e&&e===this._headerController.defaultNode&&(e.textContent=i);}__updateMessageNodes(e,i){if(e&&e.length>0){const o=e.find(r=>this._messageController.defaultNode&&r===this._messageController.defaultNode.parentElement);o&&(o.firstChild.textContent=i);}}__updateRejectButton(e,i,o,r){e&&(e===this._rejectController.defaultNode&&(e.textContent=i,e.setAttribute("theme",o)),e.toggleAttribute("hidden",!r));}_escPressed(e){e.defaultPrevented||this.__cancel();}__confirm(){this.dispatchEvent(new CustomEvent("confirm")),this.opened=!1;}__cancel(){this.dispatchEvent(new CustomEvent("cancel")),this.opened=!1;}__reject(){this.dispatchEvent(new CustomEvent("reject")),this.opened=!1;}_getAriaLabel(e){return e||"confirmation"}};/**
  * @license
- * Copyright (c) 2017 - 2024 Vaadin Ltd.
+ * Copyright (c) 2018 - 2024 Vaadin Ltd.
  * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
- */f("vaadin-select",[$n,Hn,U_],{moduleId:"vaadin-select-styles"});class Y_ extends j_(q(I(g))){static get is(){return "vaadin-select"}static get template(){return v`
+ */class tm extends em(q($t(J(g)))){static get template(){return v`
       <style>
-        :host {
-          position: relative;
-        }
-
-        ::slotted([slot='value']) {
-          flex-grow: 1;
+        :host,
+        [hidden] {
+          display: none !important;
         }
       </style>
 
-      <div class="vaadin-select-container">
-        <div part="label" on-click="_onClick">
-          <slot name="label"></slot>
-          <span part="required-indicator" aria-hidden="true" on-click="focus"></span>
-        </div>
-
-        <vaadin-input-container
-          part="input-field"
-          readonly="[[readonly]]"
-          disabled="[[disabled]]"
-          invalid="[[invalid]]"
-          theme$="[[_theme]]"
-          on-click="_onClick"
-        >
-          <slot name="prefix" slot="prefix"></slot>
-          <slot name="value"></slot>
-          <div part="toggle-button" slot="suffix" aria-hidden="true" on-mousedown="_onToggleMouseDown"></div>
-        </vaadin-input-container>
-
-        <div part="helper-text">
-          <slot name="helper"></slot>
-        </div>
-
-        <div part="error-message">
-          <slot name="error-message"></slot>
-        </div>
-      </div>
-
-      <vaadin-select-overlay
-        position-target="[[_inputContainer]]"
-        opened="{{opened}}"
-        with-backdrop="[[_phone]]"
-        phone$="[[_phone]]"
+      <vaadin-confirm-dialog-dialog
+        id="dialog"
+        opened="{{opened}}"
+        overlay-class="[[overlayClass]]"
+        aria-label="[[_getAriaLabel(header)]]"
         theme$="[[_theme]]"
-        no-vertical-overlap$="[[noVerticalOverlap]]"
-        on-vaadin-overlay-open="_onOverlayOpen"
-      ></vaadin-select-overlay>
+        no-close-on-outside-click
+        no-close-on-esc="[[noCloseOnEsc]]"
+        content-height="[[_contentHeight]]"
+        content-width="[[_contentWidth]]"
+      ></vaadin-confirm-dialog-dialog>
 
-      <slot name="tooltip"></slot>
-      <div class="sr-only">
-        <slot name="sr-label"></slot>
+      <div hidden>
+        <slot name="header"></slot>
+        <slot></slot>
+        <slot name="cancel-button"></slot>
+        <slot name="reject-button"></slot>
+        <slot name="confirm-button"></slot>
       </div>
-    `}static get observers(){return ["_rendererChanged(renderer, _overlayElement)"]}ready(){super.ready(),to(this);}_rendererChanged(t,e){e&&(e.renderer=t||this.__defaultRenderer,this.requestContentUpdate());}_onOverlayOpen(){this._menuElement&&this._menuElement.focus();}}x(Y_);const Sa=p`
-  /* Optical centering */
-  :host::before,
-  :host::after {
-    content: '';
-    flex-basis: 0;
-    flex-grow: 1;
-  }
+    `}static get is(){return "vaadin-confirm-dialog"}ready(){super.ready(),this._overlayElement=this.$.dialog.$.overlay,this._initOverlay(this._overlayElement);}}x(tm);
 
-  :host::after {
-    flex-grow: 1.1;
-  }
+const DEFAULT_LANGUAGE$3 = 'en';
+const SUPPORTED_LANGUAGES$3 = ['ro', 'en', 'fr', 'ar', 'hr'];
+const TRANSLATIONS$3 = {
+    en: {
+        filter: 'Filter',
+        clear: 'Clear',
+        searchByTicketId: 'Search by Ticket ID',
+        enterTicketId: 'Enter Ticket ID',
+        searchByTicketType: 'Search by Ticket Type',
+        selectTicketType: 'Select Ticket Type',
+        searchByDate: 'Search by Date',
+        from: 'From',
+        to: 'To',
+        normal: 'Normal',
+        subscription: 'Subscription',
+        ticketsHistory: 'Tickets History',
+        settled: 'Settled',
+        purchased: 'Purchased',
+        canceled: 'Canceled',
+        noData: 'No data Avaliable.',
+        ticketId: 'Ticket ID:',
+        ticketType: 'Ticket Type:',
+        ticketAmount: 'Ticket Amount:',
+        lineDetail: 'Line Detail:',
+        seeDetails: 'See Details',
+        numberOfDraw: 'Number of Draw:',
+        ticketResult: 'Ticket Result:',
+        drawId: 'Draw ID:',
+        drawDate: 'Draw Date:',
+        result: 'Result:',
+        prize: 'Prize:',
+        bettingType: 'Betting Type:'
+    },
+    ro: {
+        ticketsHistory: 'Istoric bilete',
+        settled: 'Decontat',
+        purchased: 'Achiziționat',
+        canceled: 'Anulat',
+        noData: 'Nu sunt date disponibile.',
+        ticketId: 'ID bilet:',
+        ticketType: 'Tip bilet:',
+        ticketAmount: 'Suma biletului:',
+        lineDetail: 'Detaliu linie:',
+        seeDetails: 'Vezi detalii',
+        numberOfDraw: 'Număr de extrageri:',
+        ticketResult: 'Rezultat bilet:',
+        drawId: 'ID extragere:',
+        drawDate: 'Data extragerii:',
+        result: 'Rezultat:',
+        prize: 'Premiu:',
+        bettingType: 'Tip de pariu:'
+    },
+    fr: {
+        ticketsHistory: 'Historique des billets',
+        settled: 'Réglé',
+        purchased: 'Acheté',
+        canceled: 'Annulé',
+        noData: 'Aucune donnée disponible.',
+        ticketId: 'ID du billet:',
+        ticketType: 'Type de billet:',
+        ticketAmount: 'Montant du billet:',
+        lineDetail: 'Détail de la ligne:',
+        seeDetails: 'Voir les détails',
+        numberOfDraw: 'Nombre de tirages:',
+        ticketResult: 'Résultat du billet:',
+        drawId: 'ID du tirage:',
+        drawDate: 'Date du tirage:',
+        result: 'Résultat:',
+        prize: 'Prix:',
+        bettingType: 'Type de pari:'
+    },
+    ar: {
+        ticketsHistory: 'سجل التذاكر',
+        settled: 'تمت التسوية',
+        purchased: 'تم شراؤها',
+        canceled: 'تم الإلغاء',
+        noData: 'لا توجد بيانات متاحة.',
+        ticketId: 'معرف التذكرة:',
+        ticketType: 'نوع التذكرة:',
+        ticketAmount: 'مبلغ التذكرة:',
+        lineDetail: 'تفاصيل الخط:',
+        seeDetails: 'انظر التفاصيل',
+        numberOfDraw: 'عدد السحوبات:',
+        ticketResult: 'نتيجة التذكرة:',
+        drawId: 'معرف السحب:',
+        drawDate: 'تاريخ السحب:',
+        result: 'النتيجة:',
+        prize: 'الجائزة:',
+        bettingType: 'نوع الرهان:'
+    },
+    hr: {
+        ticketsHistory: 'Povijest listića',
+        settled: 'Riješeno',
+        purchased: 'Kupljeno',
+        canceled: 'Otkazano',
+        noData: 'Nema dostupnih podataka.',
+        ticketId: 'ID listića:',
+        ticketType: 'Vrsta listića:',
+        ticketAmount: 'Iznos listića:',
+        lineDetail: 'Detalji linije:',
+        seeDetails: 'Vidi detalje',
+        numberOfDraw: 'Broj izvlačenja:',
+        ticketResult: 'Rezultat listića:',
+        drawId: 'ID izvlačenja:',
+        drawDate: 'Datum izvlačenja:',
+        result: 'Rezultat:',
+        prize: 'Nagrada:',
+        bettingType: 'Vrsta oklade:'
+    }
+};
+const translate$3 = (key, customLang, replacements) => {
+    const lang = customLang;
+    let translation = TRANSLATIONS$3[lang !== undefined && SUPPORTED_LANGUAGES$3.includes(lang) ? lang : DEFAULT_LANGUAGE$3][key];
+    if (replacements) {
+        Object.keys(replacements).forEach((placeholder) => {
+            translation = translation.replace(`{${placeholder}}`, replacements[placeholder]);
+        });
+    }
+    return translation;
+};
+const getTranslations$2 = (data) => {
+    Object.keys(data).forEach((item) => {
+        for (let key in data[item]) {
+            TRANSLATIONS$3[item][key] = data[item][key];
+        }
+    });
+};
 
-  [part='overlay'] {
-    border-radius: var(--lumo-border-radius-l);
-    box-shadow:
-      0 0 0 1px var(--lumo-shade-5pct),
-      var(--lumo-box-shadow-xl);
-    background-image: none;
-    outline: none;
-    -webkit-tap-highlight-color: transparent;
-  }
+const lotteryTippingFilterCss = ".lottery-tipping-filter .operate-btns{display:flex;gap:10px}.lottery-tipping-filter .operate-btns .operate-btn{background:var(--emw--color-primary, #fed275);border:1px solid var(--emw--color-primary, #fed275);border-radius:16px;padding:8px 10px;font-size:14px;color:rgb(51, 51, 51);font-weight:600;cursor:pointer;transition:0.2s linear}.dialog-content{display:flex;flex-direction:column;align-items:center}.dialog-content .filter-item{margin-bottom:12px}.dialog-content .filter-item-label{text-align:center}.dialog-content .filter-item-val{display:flex;flex-wrap:wrap;gap:12px;justify-content:center}@media screen and (max-width: 480px){.lottery-tipping-filter .operate-btns{gap:4px}}.general-multi-select-container{width:var(--vaadin-field-default-width, 16em)}";
+const LotteryTippingFilterStyle0 = lotteryTippingFilterCss;
 
-  [part='content'] {
-    padding: var(--lumo-space-l);
-  }
+const LotteryTippingFilter = class {
+    constructor(hostRef) {
+        index.registerInstance(this, hostRef);
+        this.filterChange = index.createEvent(this, "filterChange", 7);
+        this.filterClear = index.createEvent(this, "filterClear", 7);
+        this.handleTicketType = (event) => {
+            if (event.detail && event.detail.length) {
+                this.filterData.ticketType = event.detail;
+            }
+        };
+        this.handleFilterFrom = (event) => {
+            const inputElement = event.target;
+            let dateArray = inputElement.value.split('-');
+            if (dateArray.length === 3) {
+                this.filterData = Object.assign(Object.assign({}, this.filterData), { filterFromCalendar: `${dateArray[2]}/${dateArray[1]}/${dateArray[0]}` });
+            }
+        };
+        this.handleFilterTo = (event) => {
+            const inputElement = event.target;
+            let dateArray = inputElement.value.split('-');
+            if (dateArray.length === 3) {
+                this.filterData = Object.assign(Object.assign({}, this.filterData), { filterToCalendar: `${dateArray[2]}/${dateArray[1]}/${dateArray[0]}` });
+            }
+        };
+        this.quickFiltersActive = false;
+        this.mbSource = undefined;
+        this.clientStyling = undefined;
+        this.clientStylingUrl = undefined;
+        this.language = 'en';
+        this.translationUrl = undefined;
+        this.isOpen = false;
+        this.filterData = {
+            filterFromCalendar: '',
+            filterToCalendar: '',
+            ticketId: '',
+            ticketType: []
+        };
+        this.ticketTypeList = undefined;
+        this.showClearButton = false;
+    }
+    handleClientStylingChange(newValue, oldValue) {
+        if (newValue != oldValue) {
+            lotteryTippingPage.setClientStyling(this.stylingContainer, this.clientStyling);
+        }
+    }
+    handleClientStylingUrlChange(newValue, oldValue) {
+        if (newValue != oldValue) {
+            lotteryTippingPage.setClientStylingURL(this.stylingContainer, this.clientStylingUrl);
+        }
+    }
+    handleMbSourceChange(newValue, oldValue) {
+        if (newValue != oldValue) {
+            lotteryTippingPage.setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
+        }
+    }
+    componentWillLoad() {
+        if (this.translationUrl) {
+            getTranslations$2(JSON.parse(this.translationUrl));
+        }
+        this.ticketTypeList = [
+            { label: translate$3('normal', this.language), value: 'NORMAL' },
+            { label: translate$3('subscription', this.language), value: 'SUBSCRIPTION' }
+        ];
+    }
+    componentDidLoad() {
+        if (this.stylingContainer) {
+            if (this.mbSource)
+                lotteryTippingPage.setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
+            if (this.clientStyling)
+                lotteryTippingPage.setClientStyling(this.stylingContainer, this.clientStyling);
+            if (this.clientStylingUrl)
+                lotteryTippingPage.setClientStylingURL(this.stylingContainer, this.clientStylingUrl);
+        }
+    }
+    disconnectedCallback() {
+        this.stylingSubscription && this.stylingSubscription.unsubscribe();
+    }
+    handleModalClose() {
+        this.isOpen = false;
+    }
+    changeFormate(str) {
+        const [day, month, year] = str.split('/');
+        return `${year}-${month}-${day}`;
+    }
+    formateDate(dateParts) {
+        const { year, month, day } = dateParts;
+        const date = new Date(year, month, day);
+        return format(date, 'dd/MM/yyyy');
+    }
+    parseDate(inputValue) {
+        const [day, month, year] = inputValue.split('/');
+        return { year, month: parseInt(month) - 1, day };
+    }
+    setDateFormate(dom) {
+        dom.i18n = Object.assign(Object.assign({}, dom.i18n), { formatDate: this.formateDate, parseDate: this.parseDate });
+    }
+    clearSelection() {
+        this.comboBox.clear();
+    }
+    resetSearch() {
+        this.showClearButton = false;
+        this.clearSelection();
+        this.filterData = {
+            filterFromCalendar: '',
+            filterToCalendar: '',
+            ticketId: '',
+            ticketType: []
+        };
+        this.filterClear.emit();
+    }
+    handleDialogConfirm() {
+        if (this.filterData.filterFromCalendar && this.filterData.filterToCalendar) {
+            let dateArray = this.filterData.filterFromCalendar.split('/');
+            let dateArrayTo = this.filterData.filterToCalendar.split('/');
+            const transferData = {
+                filterFromCalendar: new Date(Date.UTC(Number(dateArray[2]), Number(dateArray[1]) - 1, Number(dateArray[0]), 0, 0, 0)).toISOString(),
+                filterToCalendar: new Date(Date.UTC(Number(dateArrayTo[2]), Number(dateArrayTo[1]) - 1, Number(dateArrayTo[0]), 23, 59, 59)).toISOString()
+            };
+            this.filterData = Object.assign(Object.assign({}, this.filterData), transferData);
+        }
+        this.filterChange.emit(this.filterData);
+        this.isOpen = false;
+        this.showClearButton = true;
+    }
+    render() {
+        return (index.h("div", { key: '74aa590f6f92b9df971fd17cb3f573cc6a0a68e9', class: "lottery-tipping-filter", ref: (el) => (this.stylingContainer = el) }, index.h("div", { key: 'ebf385371627466c5eb06a5ef75a14a467b1badd', class: "operate-btns" }, !this.showClearButton && (index.h("div", { key: '55c709034e124b51e8b9057980f5a3c3b8c6d5ce', class: "operate-btn", onClick: () => {
+                this.isOpen = true;
+            } }, translate$3('filter', this.language))), (this.showClearButton || this.quickFiltersActive) && (index.h("div", { key: 'aa747af2461e72fbacc16decd7fc75cd6f640c47', class: "operate-btn", onClick: () => this.resetSearch() }, translate$3('clear', this.language)))), index.h("lottery-tipping-dialog", { key: 'f8f41b7ff5114a48a840063b5f063e28cc61e31c', "dialog-title": translate$3('ticketResult', this.language), visible: this.isOpen, onCancel: () => {
+                this.isOpen = false;
+            }, onConfirm: this.handleDialogConfirm(), animationDuration: 300, language: this.language, "translation-url": this.translationUrl }, index.h("div", { key: 'a7510ed9b89b568d6829777bfbbc33bc3fdbb9b4', class: "dialog-content" }, index.h("div", { key: '25f1a6e8e4f389cc6157468338eb4bac9996a5cd', class: "filter-item" }, index.h("div", { key: 'a49fded71e3ddc45dc26c7bb47f29132907bcf5f', class: "filter-item-label" }, translate$3('searchByTicketId', this.language)), index.h("div", { key: '281d3ebd48ab27fbd82328a684fcf3e11bd68176', class: "filter-item-val" }, index.h("vaadin-text-field", { key: '3ca7edba908e9ff1d6ab16c5c60e5a1cdb06d9c9', placeholder: translate$3('enterTicketId', this.language), value: this.filterData.ticketId, onInput: (event) => {
+                this.filterData.ticketId = event.target.value;
+            } }))), index.h("div", { key: '9bee76f675ef9934db69a1f06e5b40c4e2e94bf2', class: "filter-item" }, index.h("div", { key: 'd9251a523137fab3410c0ce8597a70ba7cffaf73', class: "filter-item-label" }, translate$3('searchByTicketType', this.language)), index.h("div", { key: 'ddc4c4a1c436d874f9c13d4612690d6360815633', class: "general-multi-select-container" }, index.h("general-multi-select", { key: 'b08fc68491d530937356d519f37362b2e3bf13c8', ref: (el) => (this.comboBox = el), placeholder: translate$3('selectTicketType', this.language), "max-visible-chips": "2", options: this.ticketTypeList.map((item) => ({
+                text: item.label,
+                value: item.value
+            })), onChange: this.handleTicketType, "client-styling": this.clientStyling, "client-styling-Url": this.clientStylingUrl, "mb-source": this.mbSource }))), index.h("div", { key: '516fd4574674db32d3e8c9994a8c8cfb3b972364', class: "filter-item" }, index.h("div", { key: 'ce608f365c0297ff7b3aa1cbe64a51505e441f2c', class: "filter-item-label" }, translate$3('searchByDate', this.language)), index.h("div", { key: '9456716fb9e3a392cbb5c16f706b3dc144b0ccbe', class: "filter-item-val" }, index.h("vaadin-date-picker", { key: 'fb574b38a9e9143bf47fecd16638d50e2b9605a5', value: this.filterData.filterFromCalendar, max: this.filterData.filterToCalendar === undefined
+                ? undefined
+                : this.changeFormate(this.filterData.filterToCalendar), onChange: this.handleFilterFrom, placeholder: translate$3('from', this.language), ref: (el) => this.setDateFormate(el), class: "VaadinDatePicker" }), index.h("vaadin-date-picker", { key: '3fc353dd8b7919219731934cf76c75ea13c38e35', value: this.filterData.filterToCalendar, min: this.filterData.filterFromCalendar === undefined
+                ? undefined
+                : this.changeFormate(this.filterData.filterFromCalendar), onChange: this.handleFilterTo, placeholder: translate$3('to', this.language), ref: (el) => this.setDateFormate(el), class: "VaadinDatePicker" })))))));
+    }
+    static get watchers() { return {
+        "clientStyling": ["handleClientStylingChange"],
+        "clientStylingUrl": ["handleClientStylingUrlChange"],
+        "mbSource": ["handleMbSourceChange"]
+    }; }
+};
+LotteryTippingFilter.style = LotteryTippingFilterStyle0;
 
-  :host(:is([has-header], [has-title])) [part='header'] + [part='content'] {
-    padding-top: 0;
-  }
+const generateUUID$1 = () => {
+    return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function (c) {
+        var r = (Math.random() * 16) | 0, v = c == 'x' ? r : (r & 0x3) | 0x8;
+        return v.toString(16);
+    });
+};
+function fetchRequest(url, method = 'GET', body = null, headers = {}) {
+    return new Promise((resolve, reject) => {
+        const uuid = generateUUID$1();
+        const headersOrigin = Object.assign({ 'Content-Type': 'application/json' }, headers);
+        if (method !== 'GET' && method !== 'HEAD') {
+            headersOrigin['X-Idempotency-Key'] = uuid;
+        }
+        const options = {
+            method,
+            headers: headersOrigin,
+            body: null
+        };
+        if (body && method !== 'GET' && method !== 'HEAD') {
+            options.body = JSON.stringify(body);
+        }
+        else {
+            delete options.body;
+        }
+        fetch(url, options)
+            .then((response) => {
+            if (!response.ok) {
+                return response.json().then((errorData) => {
+                    const error = {
+                        status: response.status,
+                        statusText: response.statusText,
+                        code: errorData.code || 'UNKNOWN_ERROR',
+                        message: errorData.message || 'An unknown error occurred',
+                        data: errorData.data || null
+                    };
+                    reject(error);
+                }, () => reject({
+                    status: response.status,
+                    statusText: response.statusText,
+                    code: 'PARSE_ERROR',
+                    message: 'Failed to parse error response'
+                }));
+            }
+            else {
+                return response.json();
+            }
+        })
+            .then((data) => resolve(data), (error) => reject(error));
+    });
+}
+const fetcher$2 = (url) => fetch(url, {
+    method: 'GET',
+    headers: {
+        'x-scheme': 'application/json',
+        Accept: 'application/json'
+    }
+}).then((r) => r.json());
+function isEmptyValueOfArray(arr) {
+    if (arr.length === 0) {
+        return true;
+    }
+    const len = arr.length;
+    let count = 0;
+    for (let i = 0; i < len; i++) {
+        if (isEmptyValue(arr[i])) {
+            count++;
+        }
+        else {
+            return false;
+        }
+    }
+    if (count === len) {
+        return true;
+    }
+    return false;
+}
+function isEmptyValueOfObject(obj) {
+    if (Object.keys(obj).length === 0) {
+        return true;
+    }
+    const len = Object.keys(obj).length;
+    let count = 0;
+    for (const val of Object.values(obj)) {
+        if (isEmptyValue(val)) {
+            count++;
+        }
+        else {
+            return false;
+        }
+    }
+    if (count === len) {
+        return true;
+    }
+    return false;
+}
+function isEmptyValue(value, allowZero) {
+    if (value === null || value === undefined || value === '') {
+        return true;
+    }
+    else if (value === 0 && allowZero) {
+        return false;
+    }
+    else if (Array.isArray(value)) {
+        return isEmptyValueOfArray(value);
+    }
+    else if (Object.prototype.toString.call(value) === '[object Object]') {
+        return isEmptyValueOfObject(value);
+    }
+    else {
+        return !value;
+    }
+}
+function toQueryParams(params) {
+    const finalParams = {};
+    Object.entries(params).forEach(([key, value]) => {
+        if (!isEmptyValue(value, true)) {
+            finalParams[key] = value;
+        }
+    });
+    const queryString = Object.entries(finalParams)
+        .map(([key, value]) => `${encodeURIComponent(key)}=${encodeURIComponent(value)}`)
+        .join('&');
+    return queryString ? `?${queryString}` : '';
+}
+const bulletMap = {
+    '0': '1',
+    '1': 'X',
+    '2': '2'
+};
+function parseBulletNumber(numberArr) {
+    const bulletArr = [];
+    Object.keys(bulletMap).forEach((key) => {
+        bulletArr.push({
+            isSelected: numberArr.includes(Number(key)),
+            value: bulletMap[key]
+        });
+    });
+    return bulletArr;
+}
+function parseEachLineNumber(numbers) {
+    const result = [];
+    const matchRes = [];
+    for (let i = 0; i < numbers.length; i += 2) {
+        const [resultNumber, matchNumber] = [numbers[i], numbers[i + 1]];
+        if (!matchRes[matchNumber]) {
+            matchRes[matchNumber] = [resultNumber];
+        }
+        else {
+            matchRes[matchNumber].push(resultNumber);
+        }
+    }
+    matchRes.forEach((matchArr) => {
+        result.push(parseBulletNumber(matchArr));
+    });
+    return result;
+}
+function thousandSeperator(value) {
+    if (value === 0) {
+        return '0';
+    }
+    if (!value) {
+        return '';
+    }
+    value = value.toString();
+    const parts = value.split('.');
+    parts[0] = parts[0].replace(/\B(?=(\d{3})+(?!\d))/g, ',');
+    return parts.join('.');
+}
+const isMobile = (userAgent) => {
+    return !!(userAgent.toLowerCase().match(/android/i) ||
+        userAgent.toLowerCase().match(/blackberry|bb/i) ||
+        userAgent.toLowerCase().match(/iphone|ipad|ipod/i) ||
+        userAgent.toLowerCase().match(/windows phone|windows mobile|iemobile|wpdesktop/i));
+};
 
-  [part='header'],
-  [part='header-content'],
-  [part='footer'] {
-    gap: var(--lumo-space-xs) var(--lumo-space-s);
-    line-height: var(--lumo-line-height-s);
-  }
+const lotteryTippingPaginationCss = ".paginator{display:flex;align-items:center;gap:6px;flex-wrap:wrap;justify-content:flex-end}button{padding:4px 8px;font-size:14px;background:var(--emw--color-background, #fff);border:var(--emw--button-border, 1px solid rgba(221, 221, 221, 0.8666666667));border-radius:var(--emw--border-radius-small, 4px);cursor:pointer;min-width:28px;transition:all 0.2s ease}button.active{color:#333;background:var(--emw--color-primary, #fed275);border-color:var(--emw--color-primary, #fed275);font-weight:bold}button:not(.arrow-btn):hover{background:var(--emw--color-secondary, #fff3b9);border-color:var(--emw--color-secondary, #fff3b9)}button:disabled{cursor:not-allowed;border:var(--emw--button-border, 1px solid rgba(221, 221, 221, 0.8666666667));user-select:none}.ellipsis{font-weight:bold;color:var(--emw--color-gray-400, #000);border:none}select{padding:4px 8px;border-radius:4px;border:var(--emw--button-border, 1px solid rgba(221, 221, 221, 0.8666666667));font-size:14px}.jump-box{display:flex;align-items:center;gap:4px;margin-left:8px}.jump-box input{width:50px;padding:2px 6px;font-size:14px;border:var(--emw--button-border, 1px solid rgba(221, 221, 221, 0.8666666667));border-radius:4px;text-align:center}.total-num{user-select:none;font-size:14px;color:var(--emw--color-gray-300, #333)}";
+const LotteryTippingPaginationStyle0 = lotteryTippingPaginationCss;
+
+const LotteryTippingPagination = class {
+    constructor(hostRef) {
+        index.registerInstance(this, hostRef);
+        this.pageChange = index.createEvent(this, "pageChange", 7);
+        this.pageSizeChange = index.createEvent(this, "pageSizeChange", 7);
+        this.userAgent = window.navigator.userAgent;
+        this.total = 0;
+        this.pageSizeOptions = [10, 20, 50];
+        this.mbSource = undefined;
+        this.clientStyling = undefined;
+        this.clientStylingUrl = undefined;
+        this.language = 'en';
+        this.translationUrl = undefined;
+        this.current = 1;
+        this.pageSize = 10;
+        this.totalPages = 1;
+    }
+    handleClientStylingChange(newValue, oldValue) {
+        if (newValue != oldValue) {
+            lotteryTippingPage.setClientStyling(this.stylingContainer, this.clientStyling);
+        }
+    }
+    handleClientStylingUrlChange(newValue, oldValue) {
+        if (newValue != oldValue) {
+            lotteryTippingPage.setClientStylingURL(this.stylingContainer, this.clientStylingUrl);
+        }
+    }
+    handleMbSourceChange(newValue, oldValue) {
+        if (newValue != oldValue) {
+            lotteryTippingPage.setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
+        }
+    }
+    componentDidLoad() {
+        if (this.stylingContainer) {
+            if (this.mbSource)
+                lotteryTippingPage.setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
+            if (this.clientStyling)
+                lotteryTippingPage.setClientStyling(this.stylingContainer, this.clientStyling);
+            if (this.clientStylingUrl)
+                lotteryTippingPage.setClientStylingURL(this.stylingContainer, this.clientStylingUrl);
+        }
+    }
+    componentWillLoad() {
+        if (this.translationUrl) {
+            getTranslations$2(JSON.parse(this.translationUrl));
+        }
+        this.pageSize = this.pageSizeOptions[0];
+        this.updateTotalPages();
+    }
+    updateTotalPages() {
+        this.totalPages = Math.max(Math.ceil(this.total / this.pageSize), 1);
+        if (this.current > this.totalPages) {
+            this.current = this.totalPages;
+            this.pageChange.emit(this.current);
+        }
+    }
+    goToPage(page) {
+        if (page < 1 || page > this.totalPages || page === this.current)
+            return;
+        this.current = page;
+        this.pageChange.emit(page);
+    }
+    changePageSize(newSize) {
+        this.pageSize = newSize;
+        this.pageSizeChange.emit(newSize);
+        this.updateTotalPages();
+        this.goToPage(1);
+    }
+    getPagesToShow() {
+        const result = [];
+        const range = isMobile(this.userAgent) ? 1 : 2;
+        const { totalPages, current } = this;
+        if (totalPages <= 7) {
+            for (let i = 1; i <= totalPages; i++)
+                result.push({ type: 'page', value: i });
+        }
+        else {
+            result.push({ type: 'page', value: 1 });
+            if (current > range + 2)
+                result.push({ type: 'jump', direction: 'prev' });
+            const start = Math.max(2, current - range);
+            const end = Math.min(totalPages - 1, current + range);
+            for (let i = start; i <= end; i++)
+                result.push({ type: 'page', value: i });
+            if (current < totalPages - range - 1)
+                result.push({ type: 'jump', direction: 'next' });
+            result.push({ type: 'page', value: totalPages });
+        }
+        return result;
+    }
+    jumpTo(direction) {
+        const delta = 5;
+        if (direction === 'prev')
+            this.goToPage(Math.max(1, this.current - delta));
+        else
+            this.goToPage(Math.min(this.totalPages, this.current + delta));
+    }
+    render() {
+        const pages = this.getPagesToShow();
+        return (index.h("div", { key: '056fe5c9fddd61fafba809746de794a8db9c92a9', class: "paginator", ref: (el) => (this.stylingContainer = el) }, index.h("div", { key: 'a4ceefa8aaeb5a5038e9f15d58f8b7b74f5e6726', class: "total-num" }, translate$3('totalItems', this.language, { total: this.total })), index.h("button", { key: '08a1c3a20cc576781c97e6dae6ba8db5bba1e0c2', class: "arrow-btn", disabled: this.current <= 1, onClick: () => this.goToPage(this.current - 1) }, "<"), pages.map((item) => {
+            if (item.type === 'page') {
+                return (index.h("button", { class: { page: true, active: this.current === item.value }, onClick: () => this.goToPage(item.value) }, item.value));
+            }
+            else {
+                return (index.h("button", { class: "ellipsis", onClick: () => this.jumpTo(item.direction) }, "..."));
+            }
+        }), index.h("button", { key: '893023765c2a3b55a725c32ab5edb86e14225766', class: "arrow-btn", disabled: this.current >= this.totalPages, onClick: () => this.goToPage(this.current + 1) }, ">"), index.h("select", { key: 'c3fd4ada29da74ff3e0a5d41efeb3d6eb341bd79', onInput: (e) => this.changePageSize(parseInt(e.target.value)) }, this.pageSizeOptions.map((size) => (index.h("option", { value: size }, translate$3('perPage', this.language, { size: size }))))), index.h("div", { key: 'df8b7ad7e45fc12dc25b50cb687d008b546bba5b', class: "jump-box" }, translate$3('goTo', this.language), index.h("input", { key: 'f12b2591b6cfb79e0163dcbd5631618c69140539', type: "number", min: "1", max: this.totalPages, value: this.current, onKeyDown: (e) => {
+                if (e.key === 'Enter') {
+                    const input = e.target;
+                    const page = parseInt(input.value);
+                    if (!isNaN(page))
+                        this.goToPage(page);
+                }
+            }, onInput: (e) => {
+                const input = e.target;
+                if (parseInt(input.value) > this.totalPages) {
+                    input.value = this.totalPages.toString();
+                }
+                if (parseInt(input.value) < 1) {
+                    input.value = '1';
+                }
+            } }))));
+    }
+    static get watchers() { return {
+        "clientStyling": ["handleClientStylingChange"],
+        "clientStylingUrl": ["handleClientStylingUrlChange"],
+        "mbSource": ["handleMbSourceChange"],
+        "total": ["updateTotalPages"],
+        "pageSize": ["updateTotalPages"]
+    }; }
+};
+LotteryTippingPagination.style = LotteryTippingPaginationStyle0;
+
+// This icon file is generated automatically.
+var DownOutlined = { "icon": { "tag": "svg", "attrs": { "viewBox": "64 64 896 896", "focusable": "false" }, "children": [{ "tag": "path", "attrs": { "d": "M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z" } }] }, "name": "down", "theme": "outlined" };
+const DownOutlined$1 = DownOutlined;
+
+var __assign = (undefined && undefined.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var defaultColors = {
+    primaryColor: '#333',
+    secondaryColor: '#E6E6E6'
+};
+function renderIconDefinitionToSVGElement(icond, options) {
+    if (options === void 0) { options = {}; }
+    if (typeof icond.icon === 'function') {
+        // two-tone
+        var placeholders = options.placeholders || defaultColors;
+        return renderAbstractNodeToSVGElement(icond.icon(placeholders.primaryColor, placeholders.secondaryColor), options);
+    }
+    // fill, outline
+    return renderAbstractNodeToSVGElement(icond.icon, options);
+}
+function renderAbstractNodeToSVGElement(node, options) {
+    var targetAttrs = node.tag === 'svg'
+        ? __assign(__assign({}, node.attrs), (options.extraSVGAttrs || {})) : node.attrs;
+    var attrs = Object.keys(targetAttrs).reduce(function (acc, nextKey) {
+        var key = nextKey;
+        var value = targetAttrs[key];
+        var token = "".concat(key, "=\"").concat(value, "\"");
+        acc.push(token);
+        return acc;
+    }, []);
+    var attrsToken = attrs.length ? ' ' + attrs.join(' ') : '';
+    var children = (node.children || [])
+        .map(function (child) { return renderAbstractNodeToSVGElement(child, options); })
+        .join('');
+    if (children && children.length) {
+        return "<".concat(node.tag).concat(attrsToken, ">").concat(children, "</").concat(node.tag, ">");
+    }
+    return "<".concat(node.tag).concat(attrsToken, " />");
+}
 
-  [part='header'] {
-    padding: var(--lumo-space-m);
-    background-color: var(--lumo-base-color);
-    border-radius: var(--lumo-border-radius-l) var(--lumo-border-radius-l) 0 0; /* Needed for Safari */
-  }
+const lotteryTippingPanelCss = ".panel-container{border:2px solid var(--emw--color-gray-300, #333);border-radius:8px;overflow:hidden;font-family:sans-serif;width:calc(100% - 4px)}.panel-header{background-color:var(--emw--color-background, #fff);padding:8px;display:flex;align-items:center;justify-content:space-between;cursor:pointer;font-size:14px}.panel-header:hover{background-color:var(--emw--color-primary, #fed275)}.panel-header.active{background-color:var(--emw--color-primary, #fed275)}.header-content{white-space:nowrap;user-select:none}.arrow{transition:transform 0.3s ease;font-size:16px;display:inline-flex}.arrow.expanded{transform:rotate(180deg)}.panel-body{overflow:hidden;max-height:0;transition:max-height 0.3s ease, padding 0.3s ease;background-color:var(--emw--color-background, #fff);padding:0 12px;font-size:14px}.panel-body.open{max-height:500px;padding:10px 12px}.panel-body.closed{max-height:0;padding-top:0;padding-bottom:0}";
+const LotteryTippingPanelStyle0 = lotteryTippingPanelCss;
 
-  [part='footer'] {
-    padding: var(--lumo-space-s) var(--lumo-space-m);
-    background-color: var(--lumo-contrast-5pct);
-    border-radius: 0 0 var(--lumo-border-radius-l) var(--lumo-border-radius-l); /* Needed for Safari */
-  }
+const downIcon = renderIconDefinitionToSVGElement(DownOutlined$1, {
+    extraSVGAttrs: { width: '16px', height: '16px', fill: '' }
+});
+const lotteryTippingPanel = class {
+    constructor(hostRef) {
+        index.registerInstance(this, hostRef);
+        this.togglePanel = () => {
+            this.expanded = !this.expanded;
+        };
+        this.mbSource = undefined;
+        this.clientStyling = undefined;
+        this.clientStylingUrl = undefined;
+        this.headerTitle = undefined;
+        this.expanded = false;
+    }
+    handleClientStylingChange(newValue, oldValue) {
+        if (newValue != oldValue) {
+            lotteryTippingPage.setClientStyling(this.stylingContainer, this.clientStyling);
+        }
+    }
+    handleClientStylingUrlChange(newValue, oldValue) {
+        if (newValue != oldValue) {
+            lotteryTippingPage.setClientStylingURL(this.stylingContainer, this.clientStylingUrl);
+        }
+    }
+    handleMbSourceChange(newValue, oldValue) {
+        if (newValue != oldValue) {
+            lotteryTippingPage.setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
+        }
+    }
+    componentDidLoad() {
+        if (this.stylingContainer) {
+            if (this.mbSource)
+                lotteryTippingPage.setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
+            if (this.clientStyling)
+                lotteryTippingPage.setClientStyling(this.stylingContainer, this.clientStyling);
+            if (this.clientStylingUrl)
+                lotteryTippingPage.setClientStylingURL(this.stylingContainer, this.clientStylingUrl);
+        }
+    }
+    disconnectedCallback() {
+        this.stylingSubscription && this.stylingSubscription.unsubscribe();
+    }
+    render() {
+        return (index.h("div", { key: 'aad4bd39648c6e9df1191429caa1f8b35424d31c', class: "panel-container", ref: (el) => (this.stylingContainer = el) }, index.h("div", { key: '685317142a2fe2d110bbec41c6561446f1229b5b', class: { 'panel-header': true, active: this.expanded }, onClick: this.togglePanel }, index.h("div", { key: 'bf42af64a3eac7e8998cb9fe75c465eeaf44b7ba', class: "header-content" }, index.h("slot", { key: '181469c7a4cbe6030f64d4a08eb3e11390a4f569', name: "header" }, index.h("span", { key: '25db3b952ba81bff3a17d67ab9c960365abb6852' }, this.headerTitle))), index.h("span", { key: 'fc10e5fe178aa9b6bbae680b6fe58ca66c3a7df3', class: `arrow ${this.expanded ? 'expanded' : ''}`, innerHTML: downIcon })), index.h("div", { key: '8ae6e1a6b51eb398625d11d0b94fdbebf3cbcbc1', class: `panel-body ${this.expanded ? 'open' : 'closed'}` }, index.h("slot", { key: '9fdf6862787be818e8e9655f151630fd2913c4fd', name: "content" }))));
+    }
+    get el() { return index.getElement(this); }
+    static get watchers() { return {
+        "clientStyling": ["handleClientStylingChange"],
+        "clientStylingUrl": ["handleClientStylingUrlChange"],
+        "mbSource": ["handleMbSourceChange"]
+    }; }
+};
+lotteryTippingPanel.style = LotteryTippingPanelStyle0;
 
-  [part='title'] {
-    font-size: var(--lumo-font-size-xl);
-    font-weight: 600;
-    color: var(--lumo-header-text-color);
-    margin-inline-start: calc(var(--lumo-space-l) - var(--lumo-space-m));
-  }
+const formatDate$1 = ({ date, type = 'date', format: format$1 }) => {
+    try {
+        const parsedDate = parseISO(date);
+        if (isNaN(parsedDate.getTime())) {
+            throw new Error(`Invalid date: ${date}`);
+        }
+        if (format$1)
+            return format(parsedDate, format$1);
+        let formatStr = 'dd/MM/yyyy';
+        if (type === 'time') {
+            formatStr = 'dd/MM/yyyy HH:mm:ss';
+        }
+        else if (type === 'week') {
+            formatStr = 'ccc dd/MM/yyyy HH:mm:ss';
+        }
+        return format(parsedDate, formatStr);
+    }
+    catch (error) {
+        console.error('Error formatting date:', error.message);
+        return '';
+    }
+};
+const fetcher$1 = (url) => fetch(url, {
+    method: 'GET',
+    headers: {
+        'x-scheme': 'application/json',
+        Accept: 'application/json'
+    }
+}).then((r) => r.json());
+const showNotification$1 = ({ message, theme = 'success' }) => {
+    window.postMessage({
+        type: 'ShowNotificationToast',
+        message,
+        theme
+    });
+};
+const thousandSeparator = (value) => {
+    if (value === 0) {
+        return '0';
+    }
+    if (!value) {
+        return '';
+    }
+    value = value.toString();
+    const parts = value.split('.');
+    parts[0] = parts[0].replace(/\B(?=(\d{3})+(?!\d))/g, ',');
+    return parts.join('.');
+};
+const generateUUID = () => {
+    return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function (c) {
+        var r = (Math.random() * 16) | 0, v = c == 'x' ? r : (r & 0x3) | 0x8;
+        return v.toString(16);
+    });
+};
+const TICKET_INVALID_TOKEN = 'TICKET_INVALID_TOKEN';
+// format results to winning numbers
+const formatResultsToWinningNumbers = (rawResults) => {
+    const formatMatchCheckRes = (matchRes) => matchRes.map((bulletItem) => (bulletItem.isSelected ? 1 : 0));
+    const resultsForTotalLines = rawResults.map((lineRes) => lineRes.map(formatMatchCheckRes));
+    const result = [];
+    for (let i = 0; i < resultsForTotalLines.length; i++) {
+        const resultsInLine = resultsForTotalLines[i];
+        for (let j = 0; j < resultsInLine.length; j++) {
+            const matchResult = resultsInLine[j];
+            for (let k = 0; k < matchResult.length; k++) {
+                if (!result[i])
+                    result[i] = [];
+                if (matchResult[k])
+                    result[i].push(k, j);
+            }
+        }
+    }
+    return result;
+};
+const doSubmitTicket = ({ body, sessionId, url }) => {
+    const options = {
+        method: 'POST',
+        headers: {
+            'Content-Type': 'application/json',
+            Accept: 'application/json',
+            Authorization: `Bearer ${sessionId}`,
+            'X-Idempotency-Key': generateUUID()
+        },
+        body: JSON.stringify(body)
+    };
+    return fetch(url, options).then((res) => {
+        if (res.status === 401) {
+            throw new Error(TICKET_INVALID_TOKEN);
+        }
+        if (res.status > 300) {
+            throw new Error(res.statusText);
+        }
+        return res.json();
+    });
+};
+// BettingTypes, playModes and playTypes
+const getEnableOptions = (raw = []) => raw.filter((i) => i.enabled);
+// the first one in bet type config that enabled = true, will be default choice
+const getDefaultType = ({ playTypeConfig = [], betTypeConfig = [], enabledBettingTypeOptions = [], enabledPlayingModeOptions = [] }) => {
+    const enabledBetTypeConfig = betTypeConfig.filter((i) => i.enabled);
+    for (const item of enabledBetTypeConfig) {
+        const { bettingType, playMode } = playTypeConfig === null || playTypeConfig === void 0 ? void 0 : playTypeConfig.find((i) => i.betTypeId === item.id);
+        if (enabledBettingTypeOptions.map((i) => i.code).includes(bettingType) &&
+            enabledPlayingModeOptions.map((i) => i.code).includes(playMode))
+            return { bettingType, playMode };
+    }
+    return {};
+};
+const calculatePlayingModeOptions = ({ bettingType, playTypeConfig, betTypeConfig, enabledPlayingModeOptions }) => {
+    const enabledBetTypeIdConfig = betTypeConfig.filter((i) => i.enabled).map((i) => i.id);
+    const filteredPlayTypesConfig = playTypeConfig.filter((i) => enabledBetTypeIdConfig.includes(i.betTypeId));
+    const selectedBettingTypeFilteredPlayTypesConfig = filteredPlayTypesConfig.filter((i) => i.bettingType === bettingType);
+    const _ = selectedBettingTypeFilteredPlayTypesConfig.map((i) => i.playMode);
+    return enabledPlayingModeOptions.filter((i) => _.includes(i.code));
+};
+const getCheckedCountForEachLineAndEachMatch = ({ rawResults }) => {
+    const getMatchCheckRes = (matchRes) => matchRes.filter((bulletItem) => bulletItem.isSelected).length;
+    const checkedCountForEachLineAndEachMatch = rawResults.map((lineRes) => lineRes.length > 0 ? lineRes.map(getMatchCheckRes) : [0]);
+    return checkedCountForEachLineAndEachMatch;
+};
+const getPlayTypeConfig = ({ rawData, selectedBettingType, selectedPlayingMode }) => {
+    var _a, _b, _c, _d, _e, _f;
+    const betTypeId = (_d = (_c = (_b = (_a = rawData === null || rawData === void 0 ? void 0 : rawData.rules) === null || _a === void 0 ? void 0 : _a.poolGame) === null || _b === void 0 ? void 0 : _b.playTypes) === null || _c === void 0 ? void 0 : _c.find((i) => i.bettingType === selectedBettingType && i.playMode === selectedPlayingMode)) === null || _d === void 0 ? void 0 : _d.betTypeId;
+    const betType = (_f = (_e = rawData === null || rawData === void 0 ? void 0 : rawData.rules) === null || _e === void 0 ? void 0 : _e.betTypes) === null || _f === void 0 ? void 0 : _f.find((i) => i.id === betTypeId);
+    return { betTypeId, betType };
+};
 
-  /* No padding */
-  :host([theme~='no-padding']) [part='content'] {
-    padding: 0 !important;
-  }
+const DEFAULT_LANGUAGE$2 = 'en';
+const SUPPORTED_LANGUAGES$2 = ['ro', 'en', 'fr', 'ar', 'hr'];
+const TRANSLATIONS$2 = {
+    en: {
+        stop: 'Stop',
+        at: 'at'
+    },
+    ro: {
+        stop: 'Oprește',
+        at: 'la'
+    },
+    fr: {
+        stop: 'Arrêtez',
+        at: 'à'
+    },
+    ar: {
+        stop: 'توقف',
+        at: 'في'
+    },
+    hr: {
+        stop: 'Stop',
+        at: 'u'
+    }
+};
+const translate$2 = (key, customLang) => {
+    const lang = customLang;
+    return TRANSLATIONS$2[lang !== undefined && SUPPORTED_LANGUAGES$2.includes(lang) ? lang : DEFAULT_LANGUAGE$2][key];
+};
 
-  @media (min-height: 320px) {
-    :host([overflow~='top']) [part='header'] {
-      box-shadow: 0 1px 0 0 var(--lumo-contrast-10pct);
+const DEFAULT_LANGUAGE$1 = 'en';
+const SUPPORTED_LANGUAGES$1 = ['ro', 'en', 'fr', 'ar', 'hr'];
+const TRANSLATIONS$1 = {
+    en: {
+        selectionCleared: 'Your selection will be cleared.',
+        ticketSubmitted: 'Ticket submitted successfully.',
+        ticketFailed: 'Failed to purchase the ticket. Please try again.',
+        lines: 'Lines',
+        line: 'Line',
+        bettingType: 'Betting Type',
+        playingMode: 'Playing Mode',
+        orderSummaryTitle: 'Order Summary',
+        orderSummaryTickets: 'Tickets',
+        orderSummaryTotal: 'Total',
+        orderSummarySubmit: 'Submit',
+        cancel: 'Cancel',
+        confirm: 'Confirm'
+    },
+    ro: {
+        selectionCleared: 'Selecția dvs. va fi ștearsă.',
+        ticketSubmitted: 'Bilet trimis cu succes.',
+        ticketFailed: 'Nu s-a putut achiziționa biletul. Vă rugăm să încercați din nou.',
+        lines: 'Linii',
+        line: 'Linie',
+        bettingType: 'Tip de pariu',
+        playingMode: 'Mod de joc',
+        orderSummaryTitle: 'Sumar comandă',
+        orderSummaryTickets: 'Bilete',
+        orderSummaryTotal: 'Total',
+        orderSummarySubmit: 'Trimite',
+        cancel: 'Anulează',
+        confirm: 'Confirmă'
+    },
+    fr: {
+        selectionCleared: 'Votre sélection sera effacée.',
+        ticketSubmitted: 'Billet soumis avec succès.',
+        ticketFailed: "Échec de l'achat du billet. Veuillez réessayer.",
+        lines: 'Lignes',
+        line: 'Ligne',
+        bettingType: 'Type de pari',
+        playingMode: 'Mode de jeu',
+        orderSummaryTitle: 'Résumé de la commande',
+        orderSummaryTickets: 'Billets',
+        orderSummaryTotal: 'Total',
+        orderSummarySubmit: 'Soumettre',
+        cancel: 'Annuler',
+        confirm: 'Confirmer'
+    },
+    ar: {
+        selectionCleared: 'سيتم مسح اختيارك.',
+        ticketSubmitted: 'تم إرسال التذكرة بنجاح.',
+        ticketFailed: 'فشل شراء التذكرة. يرجى المحاولة مرة أخرى.',
+        lines: 'خطوط',
+        line: 'خط',
+        bettingType: 'نوع الرهان',
+        playingMode: 'وضع اللعب',
+        orderSummaryTitle: 'ملخص الطلب',
+        orderSummaryTickets: 'التذاكر',
+        orderSummaryTotal: 'المجموع',
+        orderSummarySubmit: 'إرسال',
+        cancel: 'إلغاء',
+        confirm: 'تأكيد'
+    },
+    hr: {
+        selectionCleared: 'Vaš odabir bit će obrisan.',
+        ticketSubmitted: 'Listić je uspješno predan.',
+        ticketFailed: 'Kupnja listića nije uspjela. Molimo pokušajte ponovo.',
+        lines: 'Linije',
+        line: 'Linija',
+        bettingType: 'Vrsta oklade',
+        playingMode: 'Način igranja',
+        orderSummaryTitle: 'Sažetak narudžbe',
+        orderSummaryTickets: 'Listići',
+        orderSummaryTotal: 'Ukupno',
+        orderSummarySubmit: 'Pošalji',
+        cancel: 'Odustani',
+        confirm: 'Potvrdi'
     }
-  }
-
-  /* Animations */
-
-  :host([opening]),
-  :host([closing]) {
-    animation: 0.25s lumo-overlay-dummy-animation;
-  }
-
-  :host([opening]) [part='overlay'] {
-    animation: 0.12s 0.05s vaadin-dialog-enter cubic-bezier(0.215, 0.61, 0.355, 1) both;
-  }
-
-  @keyframes vaadin-dialog-enter {
-    0% {
-      opacity: 0;
-      transform: scale(0.95);
+};
+const translate$1 = (key, customLang) => {
+    const lang = customLang;
+    return TRANSLATIONS$1[lang !== undefined && SUPPORTED_LANGUAGES$1.includes(lang) ? lang : DEFAULT_LANGUAGE$1][key];
+};
+const getTranslations$1 = (data) => {
+    Object.keys(data).forEach((item) => {
+        for (let key in data[item]) {
+            TRANSLATIONS$1[item][key] = data[item][key];
+        }
+    });
+};
+const resolveTranslationUrl = async (translationUrl) => {
+    if (translationUrl) {
+        try {
+            const response = await fetch(translationUrl);
+            if (!response.ok) {
+                throw new Error(`HTTP error! status: ${response.status}`);
+            }
+            const translations = await response.json();
+            getTranslations$1(translations);
+        }
+        catch (error) {
+            console.error('Failed to fetch or parse translations from URL:', error);
+        }
     }
-  }
-
-  :host([closing]) [part='overlay'] {
-    animation: 0.1s 0.03s vaadin-dialog-exit cubic-bezier(0.55, 0.055, 0.675, 0.19) both;
-  }
+};
 
-  :host([closing]) [part='backdrop'] {
-    animation-delay: 0.05s;
-  }
+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.5rem 1rem;\n  background: var(--emw--color-primary, #fed275);\n  border-top: 2px solid var(--emw--color-primary-variant, #ffe66f);\n  border-bottom: 2px solid var(--emw--color-primary-variant, #ffe66f);\n  gap: 0.5rem;\n  white-space: nowrap;\n}\n\n.left {\n  flex: 1;\n  gap: 0.4rem;\n}\n\n.brand {\n  font-weight: 700;\n  color: var(--emw--color-gray-400, #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-gray-400, #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: 2px 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-300, #333);\n  display: inline-flex;\n  align-items: baseline;\n}\n\n.pill > strong {\n  font-weight: 700;\n}";
+const LotteryTippingTicketBannerStyle0 = lotteryTippingTicketBannerCss;
 
-  @keyframes vaadin-dialog-exit {
-    100% {
-      opacity: 0;
-      transform: scale(1.02);
+const LotteryTippingTicketBanner = class {
+    constructor(hostRef) {
+        index.registerInstance(this, hostRef);
+        this.mbSource = undefined;
+        this.clientStyling = undefined;
+        this.clientStylingUrl = undefined;
+        this.language = 'en';
+        this.translationUrl = '';
+        this.stopTime = '';
+        this.period = undefined;
     }
-  }
-`;f("vaadin-dialog-overlay",[ht,Sa],{moduleId:"lumo-dialog"});f("vaadin-confirm-dialog-overlay",[ht,Sa,p`
-      [part='header'] ::slotted(h3) {
-        margin-top: 0 !important;
-        margin-bottom: 0 !important;
-        margin-inline-start: calc(var(--lumo-space-l) - var(--lumo-space-m));
-      }
-
-      [part='message'] {
-        width: 25em;
-        min-width: 100%;
-        max-width: 100%;
-      }
-
-      ::slotted([slot$='button'][theme~='tertiary']) {
-        padding-left: var(--lumo-space-s);
-        padding-right: var(--lumo-space-s);
-      }
-
-      [part='cancel-button'] {
-        flex-grow: 1;
-      }
-
-      @media (max-width: 360px) {
-        [part='footer'] {
-          flex-direction: column-reverse;
-          align-items: stretch;
-          padding: var(--lumo-space-s) var(--lumo-space-l);
-          gap: var(--lumo-space-s);
+    get formattedStopTime() {
+        let _temp = '';
+        if (!this.stopTime) {
+            return _temp;
         }
-
-        ::slotted([slot$='button']) {
-          width: 100%;
-          margin: 0;
+        _temp = formatDate$1({ date: this.stopTime, format: 'dd/MM/yyyy HH:mm' });
+        if (isToday(new Date(this.stopTime))) {
+            _temp = formatDate$1({ date: this.stopTime, format: 'HH:mm' });
+        }
+        return _temp;
+    }
+    get formattedPeriod() {
+        let _temp = '';
+        _temp = formatDate$1({ date: this.period, format: 'EEEE' });
+        if (_temp.toLowerCase() === 'wednesday') {
+            _temp = 'MIDWEEK';
+        }
+        return _temp.toUpperCase();
+    }
+    handleClientStylingChange(newValue, oldValue) {
+        if (newValue != oldValue) {
+            lotteryTippingPage.setClientStyling(this.stylingContainer, this.clientStyling);
+        }
+    }
+    handleClientStylingUrlChange(newValue, oldValue) {
+        if (newValue != oldValue) {
+            lotteryTippingPage.setClientStylingURL(this.stylingContainer, this.clientStylingUrl);
+        }
+    }
+    handleMbSourceChange(newValue, oldValue) {
+        if (newValue != oldValue) {
+            lotteryTippingPage.setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
         }
-      }
-    `],{moduleId:"lumo-confirm-dialog-overlay"});/**
- * @license
- * Copyright (c) 2017 - 2024 Vaadin Ltd.
- * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
- */const G_=s=>class extends s{static get properties(){return {opened:{type:Boolean,value:!1,notify:!0},noCloseOnOutsideClick:{type:Boolean,value:!1},noCloseOnEsc:{type:Boolean,value:!1},modeless:{type:Boolean,value:!1},overlayRole:{type:String,value:"dialog"}}}ready(){super.ready();const e=this.$.overlay;e.addEventListener("vaadin-overlay-outside-click",this._handleOutsideClick.bind(this)),e.addEventListener("vaadin-overlay-escape-press",this._handleEscPress.bind(this)),e.addEventListener("vaadin-overlay-closed",this.__handleOverlayClosed.bind(this)),this._overlayElement=e;}__handleOverlayClosed(){this.dispatchEvent(new CustomEvent("closed"));}connectedCallback(){super.connectedCallback(),this.__restoreOpened&&(this.opened=!0);}disconnectedCallback(){super.disconnectedCallback(),setTimeout(()=>{this.isConnected||(this.__restoreOpened=this.opened,this.opened=!1);});}_onOverlayOpened(e){e.detail.value===!1&&(this.opened=!1);}_handleOutsideClick(e){this.noCloseOnOutsideClick&&e.preventDefault();}_handleEscPress(e){this.noCloseOnEsc&&e.preventDefault();}_bringOverlayToFront(){this.modeless&&this._overlayElement.bringToFront();}};/**
- * @license
- * Copyright (c) 2017 - 2024 Vaadin Ltd.
- * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
- */const K_=p`
-  [part='header'],
-  [part='header-content'],
-  [part='footer'] {
-    display: flex;
-    align-items: center;
-    flex-wrap: wrap;
-    flex: none;
-    pointer-events: none;
-    z-index: 1;
-  }
-
-  [part='header'] {
-    flex-wrap: nowrap;
-  }
-
-  ::slotted([slot='header-content']),
-  ::slotted([slot='title']),
-  ::slotted([slot='footer']) {
-    display: contents;
-    pointer-events: auto;
-  }
-
-  ::slotted([slot='title']) {
-    font: inherit !important;
-    overflow-wrap: anywhere;
-  }
-
-  [part='header-content'] {
-    flex: 1;
-  }
-
-  :host([has-title]) [part='header-content'],
-  [part='footer'] {
-    justify-content: flex-end;
-  }
-
-  :host(:not([has-title]):not([has-header])) [part='header'],
-  :host(:not([has-header])) [part='header-content'],
-  :host(:not([has-title])) [part='title'],
-  :host(:not([has-footer])) [part='footer'] {
-    display: none !important;
-  }
-
-  :host(:is([has-title], [has-header], [has-footer])) [part='content'] {
-    height: auto;
-  }
-
-  @media (min-height: 320px) {
-    :host(:is([has-title], [has-header], [has-footer])) .resizer-container {
-      overflow: hidden;
-      display: flex;
-      flex-direction: column;
     }
-
-    :host(:is([has-title], [has-header], [has-footer])) [part='content'] {
-      flex: 1;
-      overflow: auto;
+    async componentWillLoad() {
+        if (this.translationUrl) {
+            resolveTranslationUrl(this.translationUrl);
+        }
     }
-  }
-
-  /*
-      NOTE(platosha): Make some min-width to prevent collapsing of the content
-      taking the parent width, e. g., <vaadin-grid> and such.
-    */
-  [part='content'] {
-    min-width: 12em; /* matches the default <vaadin-text-field> width */
-  }
-
-  :host([has-bounds-set]) [part='overlay'] {
-    max-width: none;
-  }
-
-  @media (forced-colors: active) {
-    [part='overlay'] {
-      outline: 3px solid !important;
+    componentDidLoad() {
+        if (this.stylingContainer) {
+            if (this.mbSource)
+                lotteryTippingPage.setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
+            if (this.clientStyling)
+                lotteryTippingPage.setClientStyling(this.stylingContainer, this.clientStyling);
+            if (this.clientStylingUrl)
+                lotteryTippingPage.setClientStylingURL(this.stylingContainer, this.clientStylingUrl);
+        }
     }
-  }
-`;p`
-  [part='overlay'] {
-    position: relative;
-    overflow: visible;
-    max-height: 100%;
-    display: flex;
-  }
-
-  [part='content'] {
-    box-sizing: border-box;
-    height: 100%;
-  }
-
-  .resizer-container {
-    overflow: auto;
-    flex-grow: 1;
-    border-radius: inherit; /* prevent child elements being drawn outside part=overlay */
-  }
-
-  [part='overlay'][style] .resizer-container {
-    min-height: 100%;
-    width: 100%;
-  }
-
-  :host(:not([resizable])) .resizer {
-    display: none;
-  }
-
-  :host([resizable]) [part='title'] {
-    cursor: move;
-    -webkit-user-select: none;
-    user-select: none;
-  }
-
-  .resizer {
-    position: absolute;
-    height: 16px;
-    width: 16px;
-  }
-
-  .resizer.edge {
-    height: 8px;
-    width: 8px;
-    inset: -4px;
-  }
-
-  .resizer.edge.n {
-    width: auto;
-    bottom: auto;
-    cursor: ns-resize;
-  }
-
-  .resizer.ne {
-    top: -4px;
-    right: -4px;
-    cursor: nesw-resize;
-  }
-
-  .resizer.edge.e {
-    height: auto;
-    left: auto;
-    cursor: ew-resize;
-  }
-
-  .resizer.se {
-    bottom: -4px;
-    right: -4px;
-    cursor: nwse-resize;
-  }
-
-  .resizer.edge.s {
-    width: auto;
-    top: auto;
-    cursor: ns-resize;
-  }
-
-  .resizer.sw {
-    bottom: -4px;
-    left: -4px;
-    cursor: nesw-resize;
-  }
-
-  .resizer.edge.w {
-    height: auto;
-    right: auto;
-    cursor: ew-resize;
-  }
-
-  .resizer.nw {
-    top: -4px;
-    left: -4px;
-    cursor: nwse-resize;
-  }
-`;/**
- * @license
- * Copyright (c) 2018 - 2024 Vaadin Ltd.
- * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
- */const X_=s=>class extends s{static get properties(){return {ariaLabel:{type:String,value:""},contentHeight:{type:String},contentWidth:{type:String}}}static get observers(){return ["__updateContentHeight(contentHeight, _overlayElement)","__updateContentWidth(contentWidth, _overlayElement)"]}__updateDimension(e,i,o){const r=`--_vaadin-confirm-dialog-content-${i}`;o?e.style.setProperty(r,o):e.style.removeProperty(r);}__updateContentHeight(e,i){i&&this.__updateDimension(i,"height",e);}__updateContentWidth(e,i){i&&this.__updateDimension(i,"width",e);}};/**
- * @license
- * Copyright (c) 2018 - 2024 Vaadin Ltd.
- * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
- */const J_=p`
-  :host {
-    --_vaadin-confirm-dialog-content-width: auto;
-    --_vaadin-confirm-dialog-content-height: auto;
-  }
-
-  [part='overlay'] {
-    width: var(--_vaadin-confirm-dialog-content-width);
-    height: var(--_vaadin-confirm-dialog-content-height);
-  }
-
-  ::slotted([slot='header']) {
-    pointer-events: auto;
-  }
+    disconnectedCallback() {
+        this.stylingSubscription && this.stylingSubscription.unsubscribe();
+    }
+    render() {
+        const backgroundImagePath = index.getAssetPath('../static/tipping-full-color.svg');
+        return (index.h("div", { key: 'eb93e7946631d234963d841df9e8b753b651c795', ref: (el) => (this.stylingContainer = el), class: "lottery-tipping-ticket-banner__container" }, index.h("section", { key: '0133e845df14caa912b18e1734ad16c584b7359f', class: "banner" }, index.h("div", { key: '23bc3b34011dc5533bf70397f974936e238f04fe', class: "left" }, index.h("img", { key: '52110de0807e79c02d7934ec8a37c1322b73fe84', alt: "Betting", src: backgroundImagePath, class: "logo" })), index.h("div", { key: 'b5deae59d09b870777c913c5ebfca43886c3cf95', class: "mid period" }, this.formattedPeriod), index.h("div", { key: 'b404e474850233e2d5e139077fd774f178bc40fa', class: "right" }, index.h("span", { key: '3b9072c2165a033d17c9572c7cafe2a2c699447b', class: "pill" }, index.h("strong", { key: 'c560c2c27dc930a963b992c07e02745b18d0002f' }, translate$2('stop', this.language)), "\u00A0", translate$2('at', this.language), "\u00A0", this.formattedStopTime)))));
+    }
+    static get assetsDirs() { return ["../static"]; }
+    static get watchers() { return {
+        "clientStyling": ["handleClientStylingChange"],
+        "clientStylingUrl": ["handleClientStylingUrlChange"],
+        "mbSource": ["handleMbSourceChange"]
+    }; }
+};
+LotteryTippingTicketBanner.style = LotteryTippingTicketBannerStyle0;
 
-  /* Make buttons clickable */
-  [part='footer'] > * {
-    pointer-events: all;
-  }
-`;/**
- * @license
- * Copyright (c) 2018 - 2024 Vaadin Ltd.
- * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
- */f("vaadin-confirm-dialog-overlay",[Kt,K_,J_],{moduleId:"vaadin-confirm-dialog-overlay-styles"});class Q_ extends Jt(R(I(g))){static get is(){return "vaadin-confirm-dialog-overlay"}static get template(){return v`
-      <div part="backdrop" id="backdrop" hidden$="[[!withBackdrop]]"></div>
-      <div part="overlay" id="overlay" tabindex="0">
-        <section id="resizerContainer" class="resizer-container">
-          <header part="header"><slot name="header"></slot></header>
-          <div part="content" id="content">
-            <div part="message"><slot></slot></div>
-          </div>
-          <footer part="footer" role="toolbar">
-            <div part="cancel-button">
-              <slot name="cancel-button"></slot>
-            </div>
-            <div part="reject-button">
-              <slot name="reject-button"></slot>
-            </div>
-            <div part="confirm-button">
-              <slot name="confirm-button"></slot>
-            </div>
-          </footer>
-        </section>
-      </div>
-    `}ready(){super.ready(),this.setAttribute("has-header",""),this.setAttribute("has-footer","");}}x(Q_);class Z_ extends X_(G_(ct($t(g)))){static get is(){return "vaadin-confirm-dialog-dialog"}static get template(){return v`
-      <style>
-        :host {
-          display: none;
+const DEFAULT_LANGUAGE = 'en';
+const SUPPORTED_LANGUAGES = ['ro', 'en', 'fr', 'ar', 'hr'];
+const TRANSLATIONS = {
+    en: {
+        homeTeam: 'Home team:',
+        awayTeam: 'Away team:',
+        selectionCleared: 'Your selection has been cleared.',
+        selectionOnLineCleared: 'Your selection on this line will be cleared.',
+        loading: 'Loading...',
+        error: 'Error!',
+        noData: 'No data available.',
+        lineInfo: 'Line {currentPage} of {totalPages}',
+        clearAll: 'Clear All',
+        cancel: 'Cancel',
+        confirm: 'Confirm'
+    },
+    ro: {
+        homeTeam: 'Echipa gazdă:',
+        awayTeam: 'Echipa oaspete:',
+        selectionCleared: 'Selecția dvs. a fost ștearsă.',
+        selectionOnLineCleared: 'Selecția dvs. de pe această linie va fi ștearsă.',
+        loading: `Se încarcă...',n    error: 'Eroare!`,
+        noData: 'Nu sunt date disponibile.',
+        lineInfo: 'Linia {currentPage} din {totalPages}',
+        clearAll: 'Șterge tot',
+        cancel: 'Anulează',
+        confirm: 'Confirmă'
+    },
+    fr: {
+        homeTeam: 'Équipe à domicile:',
+        awayTeam: `Équipe à l'extérieur:`,
+        selectionCleared: 'Votre sélection a été effacée.',
+        selectionOnLineCleared: 'Votre sélection sur cette ligne sera effacée.',
+        loading: `Chargement...',n    error: 'Erreur!`,
+        noData: 'Aucune donnée disponible.',
+        lineInfo: 'Ligne {currentPage} sur {totalPages}',
+        clearAll: 'Tout effacer',
+        cancel: 'Annuler',
+        confirm: 'Confirmer'
+    },
+    ar: {
+        homeTeam: 'الفريق المضيف:',
+        awayTeam: 'الفريق الضيف:',
+        selectionCleared: 'تم مسح اختيارك.',
+        selectionOnLineCleared: 'سيتم مسح اختيارك في هذا السطر.',
+        loading: `جار التحميل...',n    error: 'خطأ!`,
+        noData: 'لا توجد بيانات متاحة.',
+        lineInfo: 'السطر {currentPage} من {totalPages}',
+        clearAll: 'مسح الكل',
+        cancel: 'إلغاء',
+        confirm: 'تأكيد'
+    },
+    hr: {
+        homeTeam: 'Domaći tim:',
+        awayTeam: 'Gostujući tim:',
+        selectionCleared: 'Vaš odabir je obrisan.',
+        selectionOnLineCleared: 'Vaš odabir na ovoj liniji bit će obrisan.',
+        loading: `Učitavanje...',n    error: 'Greška!`,
+        noData: 'Nema dostupnih podataka.',
+        lineInfo: 'Linija {currentPage} od {totalPages}',
+        clearAll: 'Očisti sve',
+        cancel: 'Odustani',
+        confirm: 'Potvrdi'
+    }
+};
+const translate = (key, customLang, replacements) => {
+    const lang = customLang;
+    let translation = TRANSLATIONS[lang !== undefined && SUPPORTED_LANGUAGES.includes(lang) ? lang : DEFAULT_LANGUAGE][key];
+    if (replacements) {
+        Object.keys(replacements).forEach((placeholder) => {
+            translation = translation.replace(`{${placeholder}}`, replacements[placeholder]);
+        });
+    }
+    return translation;
+};
+const getTranslations = (data) => {
+    Object.keys(data).forEach((item) => {
+        for (let key in data[item]) {
+            TRANSLATIONS[item][key] = data[item][key];
         }
-      </style>
+    });
+};
 
-      <vaadin-confirm-dialog-overlay
-        id="overlay"
-        opened="[[opened]]"
-        on-opened-changed="_onOverlayOpened"
-        on-mousedown="_bringOverlayToFront"
-        on-touchstart="_bringOverlayToFront"
-        theme$="[[_theme]]"
-        modeless="[[modeless]]"
-        with-backdrop="[[!modeless]]"
-        resizable$="[[resizable]]"
-        aria-label$="[[ariaLabel]]"
-        restore-focus-on-close
-        focus-trap
-      ></vaadin-confirm-dialog-overlay>
-    `}}x(Z_);/**
- * @license
- * Copyright (c) 2018 - 2024 Vaadin Ltd.
- * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
- */const em=s=>class extends s{static get properties(){return {accessibleDescriptionRef:{type:String},opened:{type:Boolean,value:!1,notify:!0},header:{type:String,value:""},message:{type:String,value:""},confirmText:{type:String,value:"Confirm"},confirmTheme:{type:String,value:"primary"},noCloseOnEsc:{type:Boolean,value:!1},rejectButtonVisible:{type:Boolean,reflectToAttribute:!0,value:!1},rejectText:{type:String,value:"Reject"},rejectTheme:{type:String,value:"error tertiary"},cancelButtonVisible:{type:Boolean,reflectToAttribute:!0,value:!1},cancelText:{type:String,value:"Cancel"},cancelTheme:{type:String,value:"tertiary"},overlayClass:{type:String},_cancelButton:{type:Object},_confirmButton:{type:Object},_headerNode:{type:Object},_messageNodes:{type:Array,value:()=>[]},_overlayElement:{type:Object,sync:!0},_rejectButton:{type:Object},_contentHeight:{type:String},_contentWidth:{type:String}}}static get observers(){return ["__updateConfirmButton(_confirmButton, confirmText, confirmTheme)","__updateCancelButton(_cancelButton, cancelText, cancelTheme, cancelButtonVisible)","__updateHeaderNode(_headerNode, header)","__updateMessageNodes(_messageNodes, message)","__updateRejectButton(_rejectButton, rejectText, rejectTheme, rejectButtonVisible)","__accessibleDescriptionRefChanged(_overlayElement, _messageNodes, accessibleDescriptionRef)"]}constructor(){super(),this.__cancel=this.__cancel.bind(this),this.__confirm=this.__confirm.bind(this),this.__reject=this.__reject.bind(this);}get __slottedNodes(){return [this._headerNode,...this._messageNodes,this._cancelButton,this._confirmButton,this._rejectButton]}ready(){super.ready(),this._headerController=new D(this,"header","h3",{initializer:e=>{this._headerNode=e;}}),this.addController(this._headerController),this._messageController=new D(this,"","div",{multiple:!0,observe:!1,initializer:e=>{const i=document.createElement("div");i.style.display="contents";const o=`confirm-dialog-message-${lt()}`;i.id=o,this.appendChild(i),i.appendChild(e),this._messageNodes=[...this._messageNodes,i];}}),this.addController(this._messageController),this._cancelController=new D(this,"cancel-button","vaadin-button",{initializer:e=>{this.__setupSlottedButton("cancel",e);}}),this.addController(this._cancelController),this._rejectController=new D(this,"reject-button","vaadin-button",{initializer:e=>{this.__setupSlottedButton("reject",e);}}),this.addController(this._rejectController),this._confirmController=new D(this,"confirm-button","vaadin-button",{initializer:e=>{this.__setupSlottedButton("confirm",e);}}),this.addController(this._confirmController);}_initOverlay(e){e.addEventListener("vaadin-overlay-escape-press",this._escPressed.bind(this)),e.addEventListener("vaadin-overlay-open",()=>this.__onDialogOpened()),e.addEventListener("vaadin-overlay-closed",()=>this.__onDialogClosed()),e.setAttribute("role","alertdialog");}__onDialogOpened(){const e=this._overlayElement;this.__slottedNodes.forEach(o=>{e.appendChild(o);});const i=e.querySelector('[slot="confirm-button"]');i&&i.focus();}__onDialogClosed(){this.__slottedNodes.forEach(e=>{this.appendChild(e);}),this.dispatchEvent(new CustomEvent("closed"));}__accessibleDescriptionRefChanged(e,i,o){!e||!i||(o!==void 0?we(e,"aria-describedby",{newId:o,oldId:this.__oldAccessibleDescriptionRef,fromUser:!0}):i.forEach(r=>{we(e,"aria-describedby",{newId:r.id});}),this.__oldAccessibleDescriptionRef=o);}__setupSlottedButton(e,i){const o=`_${e}Button`,r=`__${e}`;this[o]&&this[o]!==i&&this[o].remove(),i.addEventListener("click",this[r]),this[o]=i;}__updateCancelButton(e,i,o,r){e&&(e===this._cancelController.defaultNode&&(e.textContent=i,e.setAttribute("theme",o)),e.toggleAttribute("hidden",!r));}__updateConfirmButton(e,i,o){e&&e===this._confirmController.defaultNode&&(e.textContent=i,e.setAttribute("theme",o));}__updateHeaderNode(e,i){e&&e===this._headerController.defaultNode&&(e.textContent=i);}__updateMessageNodes(e,i){if(e&&e.length>0){const o=e.find(r=>this._messageController.defaultNode&&r===this._messageController.defaultNode.parentElement);o&&(o.firstChild.textContent=i);}}__updateRejectButton(e,i,o,r){e&&(e===this._rejectController.defaultNode&&(e.textContent=i,e.setAttribute("theme",o)),e.toggleAttribute("hidden",!r));}_escPressed(e){e.defaultPrevented||this.__cancel();}__confirm(){this.dispatchEvent(new CustomEvent("confirm")),this.opened=!1;}__cancel(){this.dispatchEvent(new CustomEvent("cancel")),this.opened=!1;}__reject(){this.dispatchEvent(new CustomEvent("reject")),this.opened=!1;}_getAriaLabel(e){return e||"confirmation"}};/**
- * @license
- * Copyright (c) 2018 - 2024 Vaadin Ltd.
- * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
- */class tm extends em(q($t(J(g)))){static get template(){return v`
-      <style>
-        :host,
-        [hidden] {
-          display: none !important;
+const formatDate = ({ date, type = 'date', format: format$1 }) => {
+    try {
+        const parsedDate = parseISO(date);
+        if (isNaN(parsedDate.getTime())) {
+            throw new Error(`Invalid date: ${date}`);
         }
-      </style>
-
-      <vaadin-confirm-dialog-dialog
-        id="dialog"
-        opened="{{opened}}"
-        overlay-class="[[overlayClass]]"
-        aria-label="[[_getAriaLabel(header)]]"
-        theme$="[[_theme]]"
-        no-close-on-outside-click
-        no-close-on-esc="[[noCloseOnEsc]]"
-        content-height="[[_contentHeight]]"
-        content-width="[[_contentWidth]]"
-      ></vaadin-confirm-dialog-dialog>
-
-      <div hidden>
-        <slot name="header"></slot>
-        <slot></slot>
-        <slot name="cancel-button"></slot>
-        <slot name="reject-button"></slot>
-        <slot name="confirm-button"></slot>
-      </div>
-    `}static get is(){return "vaadin-confirm-dialog"}ready(){super.ready(),this._overlayElement=this.$.dialog.$.overlay,this._initOverlay(this._overlayElement);}}x(tm);
+        if (format$1)
+            return format(parsedDate, format$1);
+        let formatStr = 'dd/MM/yyyy';
+        if (type === 'time') {
+            formatStr = 'dd/MM/yyyy HH:mm:ss';
+        }
+        else if (type === 'week') {
+            formatStr = 'ccc dd/MM/yyyy HH:mm:ss';
+        }
+        return format(parsedDate, formatStr);
+    }
+    catch (error) {
+        console.error('Error formatting date:', error.message);
+        return '';
+    }
+};
+const fetcher = (url) => fetch(url).then((r) => r.json());
+const DEFAULT_BULLET_CONFIG = [
+    {
+        value: '1'
+    },
+    {
+        value: 'X'
+    },
+    {
+        value: '2'
+    }
+];
+const SPLIT_TOKEN = '-';
+const showNotification = ({ message, theme = 'success', position = 'top-end', duration = 3000 }) => {
+    if (!customElements.get('vaadin-notification')) {
+        console.warn('vaadin-notification is not registered. Please ensure it is imported.');
+    }
+    const notification = document.createElement('vaadin-notification');
+    notification.renderer = (root) => {
+        root.textContent = message;
+    };
+    notification.duration = duration;
+    if (theme) {
+        notification.setAttribute('theme', theme);
+    }
+    notification.setAttribute('position', position);
+    document.body.appendChild(notification);
+    notification.opened = true;
+};
 
 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-gray-400, #000);\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-color: var(--emw--color-gray-50, #f5f5f5);\n  color: var(--emw--color-gray-400, #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-gray-400, #000);\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-gray-50, #f5f5f5);\n}\n\n/* Hover (optional, but nice) */\n.my-table-component tbody tr:hover td {\n  background-color: var(--emw--color-gray-50, #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  background: transparent;\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}\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, #fff);\n  border-radius: 8px;\n  box-shadow: 0 1px 4px var(--emw--button-box-shadow-color-secondary, rgba(0, 0, 0, 0.15));\n  transition: all 0.2s ease-in-out;\n  cursor: pointer;\n}\n\n.LotteryTippingTicketBet__lineOperatorGroup--item:hover {\n  background-color: var(--emw--color-gray-50, #f5f5f5);\n  box-shadow: 0 2px 6px var(--emw--button-box-shadow-color-secondary, rgba(0, 0, 0, 0.15));\n  transform: scale(1.05);\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-gray-100, #e6e6e6);\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-gray-300, #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  color: white;\n  transition: all 0.3s ease;\n  cursor: pointer;\n  box-shadow: 0 4px 10px var(--emw--button-box-shadow-color-secondary, rgba(0, 0, 0, 0.15));\n  opacity: 0.9;\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: var(--emw--color-gray-100, #e6e6e6);\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}";
 const LotteryTippingTicketBetStyle0 = lotteryTippingTicketBetCss;
@@ -11890,10 +12875,361 @@ const LotteryTippingTicketController = class {
 };
 LotteryTippingTicketController.style = LotteryTippingTicketControllerStyle0;
 
+var DrawResult;
+(function (DrawResult) {
+    DrawResult["WON"] = "Won";
+    DrawResult["LOST"] = "Lost";
+})(DrawResult || (DrawResult = {}));
+
+const lotteryTippingTicketHistoryCss = "@keyframes skeleton-loading{0%{background-position:200% 0}100%{background-position:-200% 0}}.lottery-tipping-ticket-history{padding:12px}.lottery-tipping-ticket-history .ticket-history-title{margin:20px 0;text-align:center;font-size:20px;font-weight:700}.lottery-tipping-ticket-history .ticket-info{display:flex;flex-direction:column;gap:12px}.lottery-tipping-ticket-history .ticket-info-item{display:flex;align-items:center;user-select:none}.lottery-tipping-ticket-history .ticket-info-label{margin-right:12px}.lottery-tipping-ticket-history .ticket-info-val{color:var(--emw--color-typography, #555)}.lottery-tipping-ticket-history .ticket-list-wrap{display:flex;flex-direction:column;gap:12px}.lottery-tipping-ticket-history .draw-info-skeleton{width:30%;min-width:300px;border:var(--emw--button-border, 1px solid rgba(221, 221, 221, 0.8666666667));border-radius:5px;display:flex;flex-direction:column;gap:10px;padding:10px}.lottery-tipping-ticket-history .skeleton-line{height:16px;border-radius:4px;background:linear-gradient(90deg, var(--emw--color-gray-100, #e6e6e6) 25%, var(--emw--color-gray-50, #f5f5f5) 50%, var(--emw--color-gray-100, #e6e6e6) 75%);background-size:200% 100%;animation:skeleton-loading 1.2s infinite}.lottery-tipping-ticket-history .draw-info{width:30%;min-width:300px;border:var(--emw--button-border, 1px solid rgba(221, 221, 221, 0.8666666667));border-radius:5px;padding:12px;margin-top:20px;display:flex;flex-direction:column;gap:8px;user-select:none}.lottery-tipping-ticket-history .draw-info-item{display:flex}.lottery-tipping-ticket-history .draw-info-label{margin-right:6px}.lottery-tipping-ticket-history .draw-info-val{color:var(--emw--color-typography, #555)}.lottery-tipping-ticket-history .show-detail-link{color:var(--emw-pool-game-acition-normal, #4a90e2);text-decoration:underline;cursor:pointer}.lottery-tipping-ticket-history .filter-wrap{margin-bottom:20px;display:flex;justify-content:space-between;align-items:center}.lottery-tipping-ticket-history .filter-wrap .filter-status{display:flex;gap:12px;align-items:center}.lottery-tipping-ticket-history .filter-wrap .filter-status-btn{background:var(--emw--color-background, #fff);border:2px solid var(--emw--color-primary, #fed275);border-radius:4px;padding:10px 8px;font-size:12px;text-transform:uppercase;color:var(--emw--color-typography, #555);cursor:pointer;transition:all 0.2s linear}.lottery-tipping-ticket-history .filter-wrap .filter-status-btn:hover{background-color:var(--emw--color-secondary, #fff3b9)}.lottery-tipping-ticket-history .filter-wrap .filter-status-btn.active{background:var(--emw--color-secondary, #fff3b9);color:var(--emw--color-gray-300, #333);border:2px solid var(--emw--color-gray-300, #333)}.lottery-tipping-ticket-history .pagination-wrap{margin-top:20px;display:flex;justify-content:flex-end}@media screen and (min-width: 1200px){.lottery-tipping-ticket-history{padding:24px;width:60%;margin:0 auto}}@media screen and (max-width: 480px){.lottery-tipping-ticket-history{padding:2px}.lottery-tipping-ticket-history .filter-wrap .filter-status{gap:4px}}.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-pool-game-ticket-history-loading-normal, #b3d4fc);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-pool-game-ticket-history-loading-normal, #b3d4fc);box-shadow:0 0 0 0 var(--emw-pool-game-ticket-history-loading-box-shadow-normal, rgba(178, 212, 252, 0.7))}50%{transform:scale(1.2);background-color:var(--emw-pool-game-ticket-history-loading-active, #6793fb);box-shadow:0 0 0 10px var(--emw-pool-game-ticket-history-loading-box-shadow-active, rgba(178, 212, 252, 0))}100%{transform:scale(0.8);background-color:var(--emw-pool-game-ticket-history-loading-normal, #b3d4fc);box-shadow:0 0 0 0 rgba(178, 212, 252, 0.7)}}.empty-wrap{margin:20px 0;display:flex;align-items:center;justify-content:center;min-height:40vh}.betting-type{margin-bottom:16px;display:flex;align-items:center;gap:20px}.betting-type-title{font-weight:600;font-size:16px}.betting-type-text{font-size:16px}.LotteryTippingTicketController__segmented-control{height:2.2rem;display:inline-flex;background-color:var(--emw--color-gray-100, #e6e6e6);border-radius:2rem;padding:0.2rem}.LotteryTippingTicketController__segment{background-color:transparent;border:none;padding:0.3rem 0.8rem;cursor:pointer;font-weight:500;border-radius:2rem;outline:none;transition:background-color 0.25s ease, color 0.25s ease;white-space:nowrap}.LotteryTippingTicketController__segment--active{background-color:var(--emw--color-background, #fff);color:var(--emw--color-gray-400, #000);font-weight:600}.LotteryTippingTicketController__segment:not(.LotteryTippingTicketController__segment--active):hover{background-color:var(--emw--button-box-shadow-color-secondary, rgba(0, 0, 0, 0.15))}";
+const LotteryTippingTicketHistoryStyle0 = lotteryTippingTicketHistoryCss;
+
+const LotteryTippingTicketHistory = class {
+    constructor(hostRef) {
+        index.registerInstance(this, hostRef);
+        this.logout = index.createEvent(this, "logout", 7);
+        this.ticketTypeMap = {
+            NORMAL: 'Normal',
+            SYNDICATE: 'Syndicate',
+            SUBSCRIPTION: 'Subscription'
+        };
+        this.resultMap = { [DrawResult.WON]: 'Win', [DrawResult.LOST]: 'Lose' };
+        this.displayPrizeCategory = (details) => {
+            const prizeMap = new Map();
+            details.forEach((detail) => {
+                let prizeName = detail.divisionDisplayName;
+                let amount = detail.amount;
+                let currency = detail.currency;
+                if (prizeName && prizeName != 'None') {
+                    if (prizeMap.has(prizeName)) {
+                        prizeMap.set(prizeName, {
+                            amount: prizeMap.get(prizeName)['amount'] + amount,
+                            currency,
+                            times: prizeMap.get(prizeName)['times'] + 1
+                        });
+                    }
+                    else {
+                        prizeMap.set(prizeName, { amount, currency, times: 1 });
+                    }
+                }
+            });
+            const resultArr = [];
+            for (let [key, val] of prizeMap.entries()) {
+                resultArr.push({ prizeName: key, amount: val['amount'], currency: val['currency'], times: val['times'] });
+            }
+            resultArr.sort((p1, p2) => p2.prizeName.localeCompare(p1.prizeName));
+            return resultArr;
+        };
+        this.endpoint = undefined;
+        this.endpointTicket = undefined;
+        this.gameId = undefined;
+        this.playerId = undefined;
+        this.sessionId = '';
+        this.drawId = undefined;
+        this.mbSource = undefined;
+        this.clientStyling = undefined;
+        this.clientStylingUrl = undefined;
+        this.language = 'en';
+        this.translationUrl = '';
+        this.ticketHistory = [];
+        this.activeStatus = '';
+        this.statusOptions = undefined;
+        this.isLoading = false;
+        this.rawData = {};
+        this.filterData = {
+            offset: 0,
+            limit: 10,
+            state: '',
+            from: '',
+            to: '',
+            wagerType: '',
+            vendorGameType: 'PoolGame',
+            id: ''
+        };
+        this.paginationInfo = {
+            current: 1,
+            total: 0,
+            pageSize: 10
+        };
+        this.quickFiltersActive = false;
+        this.showCurrentTicketLine = false;
+        this.curTicketItem = undefined;
+        this.curSelection = [];
+        this.curSelectionIdx = 0;
+        this.showCurrentDrawResult = false;
+        this.curDrawItem = undefined;
+        this.curDrawSelection = [];
+        this.curDrawSelectionBettingType = undefined;
+        this.curDrawSelectionMap = {};
+    }
+    handleClientStylingChange(newValue, oldValue) {
+        if (newValue != oldValue) {
+            lotteryTippingPage.setClientStyling(this.stylingContainer, this.clientStyling);
+        }
+    }
+    handleClientStylingUrlChange(newValue, oldValue) {
+        if (newValue != oldValue) {
+            lotteryTippingPage.setClientStylingURL(this.stylingContainer, this.clientStylingUrl);
+        }
+    }
+    handleMbSourceChange(newValue, oldValue) {
+        if (newValue != oldValue) {
+            lotteryTippingPage.setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
+        }
+    }
+    componentDidLoad() {
+        if (this.stylingContainer) {
+            if (this.mbSource)
+                lotteryTippingPage.setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
+            if (this.clientStyling)
+                lotteryTippingPage.setClientStyling(this.stylingContainer, this.clientStyling);
+            if (this.clientStylingUrl)
+                lotteryTippingPage.setClientStylingURL(this.stylingContainer, this.clientStylingUrl);
+        }
+    }
+    connectedCallback() {
+        const fetchData = () => {
+            let url = new URL(`${this.endpoint}/games/${this.gameId}`);
+            this.isLoading = true;
+            fetcher$2(url.href)
+                .then((res) => {
+                this.rawData = res;
+            })
+                .finally(() => {
+                this.isLoading = false;
+            });
+        };
+        fetchData();
+    }
+    disconnectedCallback() {
+        this.stylingSubscription && this.stylingSubscription.unsubscribe();
+    }
+    async fetchTicketList() {
+        this.isLoading = true;
+        try {
+            const { items, total } = await fetchRequest(`${this.endpointTicket}/tickets${toQueryParams(this.filterData)}`, 'GET', null, {
+                Authorization: `Bearer ${this.sessionId}`
+            });
+            this.ticketHistory = items;
+            this.paginationInfo.total = total;
+            this.isLoading = false;
+            if (items.length > 0) {
+                this.getDrawResult();
+            }
+        }
+        catch (e) {
+            console.log('in fetchTicketList error is: ', e);
+            if (e.status === 401) {
+                this.showNotification(e.message, 'error');
+                this.logout.emit();
+            }
+        }
+        finally {
+            this.isLoading = false;
+        }
+    }
+    async fetchDrwaResult(gameId, drawId) {
+        try {
+            const res = await fetchRequest(`${this.endpoint}/games/${gameId}/draws/${drawId}`, 'GET', {});
+            return res;
+        }
+        catch (e) {
+            console.log(e);
+        }
+    }
+    showNotification(message, theme = '', position = 'top-end') {
+        const notification = document.createElement('vaadin-notification');
+        notification.renderer = (root) => {
+            root.textContent = message;
+        };
+        notification.duration = 5000;
+        if (theme) {
+            notification.setAttribute('theme', theme);
+        }
+        notification.setAttribute('position', position);
+        document.body.appendChild(notification);
+        notification.opened = true;
+    }
+    getDivision(detail, drawData) {
+        var _a;
+        let division = detail.division;
+        let prize = (_a = drawData.prizes) === null || _a === void 0 ? void 0 : _a.filter((prize) => prize.order === division);
+        if (prize && prize.length) {
+            return prize[0].division;
+        }
+        else {
+            return null;
+        }
+    }
+    async getDrawResult() {
+        const idMapper = new Map();
+        this.ticketHistory.forEach((item, ticketIndex) => {
+            item.drawResults.forEach((drawResult, drawIndex) => {
+                const id = `${drawResult.drawId}-${item.gameId}`;
+                if (!idMapper.has(id)) {
+                    idMapper.set(id, {
+                        drawId: drawResult.drawId,
+                        gameId: item.gameId,
+                        indices: [{ ticketIndex, drawIndex }]
+                    });
+                }
+                else {
+                    idMapper.get(id).indices.push({ ticketIndex, drawIndex });
+                }
+            });
+        });
+        let updatedTicketHistory = [...this.ticketHistory];
+        await Promise.all(Array.from(idMapper.values()).map(async ({ gameId, drawId, indices }) => {
+            try {
+                const drawData = await this.fetchDrwaResult(gameId, drawId);
+                if (drawData) {
+                    indices.forEach(({ ticketIndex, drawIndex }) => {
+                        const updatedDrawResult = Object.assign(Object.assign({}, updatedTicketHistory[ticketIndex].drawResults[drawIndex]), { tempDrawData: Object.assign(Object.assign({}, drawData), { vendorGameId: updatedTicketHistory[ticketIndex].vendorGameId }), prizeDetails: this.displayPrizeCategory(updatedTicketHistory[ticketIndex].drawResults[drawIndex].details) });
+                        const updatedDrawResults = [...updatedTicketHistory[ticketIndex].drawResults];
+                        updatedDrawResults[drawIndex] = updatedDrawResult;
+                        updatedTicketHistory[ticketIndex] = Object.assign(Object.assign({}, updatedTicketHistory[ticketIndex]), { drawResults: updatedDrawResults });
+                    });
+                }
+            }
+            catch (error) {
+                console.error(`failed to fetch draw result (gameId: ${gameId}, drawId: ${drawId}):`, error);
+            }
+        }));
+        this.ticketHistory = updatedTicketHistory;
+    }
+    componentWillLoad() {
+        if (this.translationUrl) {
+            getTranslations$2(JSON.parse(this.translationUrl));
+        }
+        this.statusOptions = [
+            {
+                label: translate$3('settled', this.language),
+                value: 'Settled'
+            },
+            {
+                label: translate$3('purchased', this.language),
+                value: 'Purchased'
+            },
+            {
+                label: translate$3('canceled', this.language),
+                value: 'Canceled'
+            }
+        ];
+        this.fetchTicketList();
+    }
+    changeStatus(status) {
+        this.activeStatus = status;
+        this.filterData.state = status;
+        this.quickFiltersActive = true;
+        this.fetchTicketList();
+    }
+    handlePageSizeChange(event) {
+        this.filterData.limit = event.detail;
+        this.fetchTicketList();
+    }
+    handlePageChange(event) {
+        this.filterData.offset = (event.detail - 1) * this.filterData.limit;
+        this.fetchTicketList();
+    }
+    handleShowTicketLineDetial(item) {
+        this.curSelectionIdx = 0;
+        this.showCurrentTicketLine = true;
+        this.curTicketItem = item;
+        this.curSelection = this.parseSelection();
+    }
+    handleShowCurrentDraw(item) {
+        this.showCurrentDrawResult = true;
+        this.curDrawItem = item;
+        this.curDrawSelectionBettingType = item.winningNumbers[0].winning_type;
+        this.curDrawItem.winningNumbers.forEach((item) => {
+            this.curDrawSelectionMap[item.winning_type] = [parseEachLineNumber(item.numbers)];
+        });
+        this.curDrawSelection = this.curDrawSelectionMap[this.curDrawSelectionBettingType];
+    }
+    parseSelection() {
+        const result = [];
+        this.curTicketItem.selection.forEach((selection, index) => {
+            result[index] = parseEachLineNumber(selection.selections);
+        });
+        return result;
+    }
+    handleFilterChange(e) {
+        const filterData = e.detail;
+        this.filterData.from = filterData.filterFromCalendar;
+        this.filterData.to = filterData.filterToCalendar;
+        this.filterData.id = filterData.ticketId;
+        this.filterData.wagerType = filterData.ticketType;
+        this.fetchTicketList();
+    }
+    handleFilterClear() {
+        this.activeStatus = '';
+        this.quickFiltersActive = false;
+        this.filterData = {
+            offset: 0,
+            limit: 10,
+            state: '',
+            from: '',
+            to: '',
+            wagerType: '',
+            vendorGameType: 'PoolGame',
+            id: ''
+        };
+        this.fetchTicketList();
+    }
+    get playTypeConfig() {
+        var _a, _b, _c;
+        return (_c = (_b = (_a = this.rawData) === null || _a === void 0 ? void 0 : _a.rules) === null || _b === void 0 ? void 0 : _b.poolGame) === null || _c === void 0 ? void 0 : _c.playTypes;
+    }
+    get bettingTypeConfig() {
+        var _a, _b, _c;
+        return (_c = (_b = (_a = this.rawData) === null || _a === void 0 ? void 0 : _a.rules) === null || _b === void 0 ? void 0 : _b.poolGame) === null || _c === void 0 ? void 0 : _c.bettingTypes;
+    }
+    getBettingType(betTypeId) {
+        var _a;
+        return (_a = this.playTypeConfig.find((item) => item.betTypeId === betTypeId)['bettingType']) !== null && _a !== void 0 ? _a : '';
+    }
+    handlePoolGameCurrentPageChange(e) {
+        const { currentPage } = e.detail;
+        this.curSelectionIdx = currentPage - 1;
+    }
+    handleDrawBettingTypeChange(bettingType) {
+        this.curDrawSelectionBettingType = bettingType;
+        this.curDrawSelection = this.curDrawSelectionMap[this.curDrawSelectionBettingType];
+    }
+    getBettingTypeName(bettingType) {
+        var _a, _b;
+        const name = (_b = (_a = this.bettingTypeConfig) === null || _a === void 0 ? void 0 : _a.find((item) => item.code === bettingType)) === null || _b === void 0 ? void 0 : _b.name;
+        return name !== null && name !== void 0 ? name : bettingType;
+    }
+    render() {
+        return (index.h("div", { key: '27d7945395c1bd5cf8c50fabcf9358dd10a2f379', class: "lottery-tipping-ticket-history", ref: (el) => (this.stylingContainer = el) }, index.h("div", { key: '29bf61bc1b7a2f34bf24814c5d256bc84b703fa9', class: "ticket-history-title" }, translate$3('ticketsHistory', this.language)), index.h("div", { key: 'aabcc336535e36248c07afac1b3777c8e00e6d36', class: "filter-wrap" }, index.h("div", { key: '6a2ce1224363104c27d63026e3d246f70db12516', class: "filter-status" }, this.statusOptions.map((status) => (index.h("div", { class: 'filter-status-btn' + (this.activeStatus == status.value ? ' active' : ''), onClick: () => this.changeStatus(status.value) }, status.label)))), index.h("div", { key: '740826baea69e1adf534bcf9a2bb4d5083fa9d90', class: "filter-operation" }, index.h("lottery-tipping-filter", { key: '395ebb8b2c040804adb4e0a87daff0d01a0598cf', "quick-filters-active": this.quickFiltersActive, language: this.language, "translation-url": this.translationUrl }))), this.isLoading && (index.h("div", { key: 'c27852dcd7902ac43a1ff7408476e5f8667c1010', class: "loading-wrap" }, index.h("section", { key: '9ab2fea4cafdefe3accbc0e49be19ec16158cd14', class: "dots-container" }, index.h("div", { key: 'c5d6c3227c51c462eb4bcca926b7ab70e3676dfd', class: "dot" }), index.h("div", { key: '9ac68a72b257614a1c048a870f18753fe85967db', class: "dot" }), index.h("div", { key: '6c5d426f926a5726a3d88ad509fc6e38f715c10d', class: "dot" }), index.h("div", { key: '90959f4befb4d2308a1cf1651dd76f7be71b3e34', class: "dot" }), index.h("div", { key: '1e8dda2f5e4e460cb0f4aa7897b19fad23d98834', class: "dot" })))), !this.isLoading && (!this.ticketHistory || this.ticketHistory.length == 0) && (index.h("div", { key: '452303d3d8221e2c3905b1d0d2e81651f1e62038', class: "empty-wrap" }, translate$3('noData', this.language))), !this.isLoading && this.ticketHistory && this.ticketHistory.length != 0 && (index.h("div", { key: 'e7c5d75d70077d6b65a006fa6169ff9d2edca2ea', class: "ticket-list-wrap" }, this.ticketHistory.map((item) => (index.h("lottery-tipping-panel", { "header-title": format(new Date(item.createdAt), 'dd/MM/yyyy HH:mm:ss') + '  ' + item.state }, index.h("div", { class: "panel-content", slot: "content" }, index.h("div", { class: "ticket-info" }, index.h("div", { class: "ticket-info-item" }, index.h("div", { class: "ticket-info-label" }, translate$3('ticketId', this.language)), index.h("div", { class: "ticket-info-val" }, item.id, " ")), index.h("div", { class: "ticket-info-item" }, index.h("div", { class: "ticket-info-label" }, translate$3('ticketType', this.language)), index.h("div", { class: "ticket-info-val" }, this.ticketTypeMap[item.wagerType], " ")), index.h("div", { class: "ticket-info-item" }, index.h("div", { class: "ticket-info-label" }, translate$3('ticketAmount', this.language)), index.h("div", { class: "ticket-info-val" }, `${item.amount} ${item.currency}`)), index.h("div", { class: "ticket-info-item" }, index.h("div", { class: "ticket-info-label" }, translate$3('lineDetail', this.language)), index.h("div", { class: "ticket-info-val" }, index.h("span", { class: "show-detail-link", onClick: () => this.handleShowTicketLineDetial(item) }, translate$3('seeDetails', this.language)))), index.h("div", { class: "ticket-info-item" }, index.h("div", { class: "ticket-info-label" }, translate$3('numberOfDraw', this.language)), index.h("div", { class: "ticket-info-val" }, item.drawCount))), item.state == 'Settled' &&
+            item.drawResults.map((drawResultItem) => (index.h("div", { class: "draw-info-container" }, drawResultItem.tempDrawData ? (index.h("div", { class: "draw-info" }, index.h("div", { class: "draw-info-item" }, index.h("div", { class: "draw-info-label" }, translate$3('ticketResult', this.language)), index.h("div", { class: "draw-info-val" }, this.resultMap[drawResultItem.state])), index.h("div", { class: "draw-info-item" }, index.h("div", { class: "draw-info-label" }, translate$3('drawId', this.language)), index.h("div", { class: "draw-info-val" }, drawResultItem.drawId)), index.h("div", { class: "draw-info-item" }, index.h("div", { class: "draw-info-label" }, translate$3('drawDate', this.language)), index.h("div", { class: "draw-info-val" }, format(new Date(drawResultItem.tempDrawData.date), 'dd/MM/yyyy'))), index.h("div", { class: "draw-info-item" }, index.h("div", { class: "draw-info-label" }, translate$3('result', this.language)), index.h("div", { class: "draw-info-val" }, index.h("span", { class: "show-detail-link", onClick: () => this.handleShowCurrentDraw(drawResultItem.tempDrawData) }, translate$3('seeDetails', this.language)))), drawResultItem.state === DrawResult.WON && (index.h("div", { class: "draw-info-item" }, index.h("div", { class: "draw-info-label" }, translate$3('prize', this.language)), index.h("div", { class: "draw-info-val1" }, index.h("div", { style: { height: '20px' } }), drawResultItem.prizeDetails.map((prizeItem) => (index.h("span", null, index.h("div", null, index.h("span", { style: { color: 'rgb(85, 85, 85)' } }, prizeItem.prizeName, prizeItem.times > 1 ? ' x ' + prizeItem.times : '', ":", ' '), index.h("span", { style: { 'margin-right': '4px', color: 'rgb(85, 85, 85)' } }, thousandSeperator(prizeItem.amount)), index.h("span", { style: { color: 'rgb(85, 85, 85)' } }, prizeItem.currency)))))))))) : (index.h("div", { class: "draw-info-skeleton" }, [...Array(5)].map(() => (index.h("div", { class: "skeleton-line" })))))))))))))), index.h("lottery-tipping-dialog", { key: '913a521d05ae95b088fba515d951bc79b1433938', visible: this.showCurrentTicketLine, width: !isMobile(window.navigator.userAgent) ? '720px' : undefined, fullscreen: isMobile(window.navigator.userAgent), closable: true, showFooter: false, onCancel: () => {
+                this.showCurrentTicketLine = false;
+            }, language: this.language, "translation-url": this.translationUrl }, this.curSelection && this.curSelection.length && (index.h("div", { key: '6608c983a4bc781f4beac6488b0857abfb59ca48' }, index.h("div", { key: '77690236f6e654e8f178bdb6fb76f49826b02a60', class: "betting-type" }, index.h("div", { key: '30d239aa23d01edb20049b5fbbbbc094c6742f75', class: "betting-type-title" }, translate$3('bettingType', this.language)), index.h("div", { key: '93770717ac08bbacc84d9de8b16133073e36d4c9', class: "betting-type-text" }, this.getBettingTypeName(this.getBettingType(this.curTicketItem.selection[this.curSelectionIdx].betType)))), index.h("lottery-tipping-ticket-bet", { key: '11641a37abe2ca65ecb706f94ce8a911f9e849d9', endpoint: this.endpoint, "session-id": this.sessionId, "game-id": this.curTicketItem.vendorGameId, "draw-id": this.curTicketItem.startingDrawId, "default-bullet-config-line-group": JSON.stringify(this.curSelection), "read-pretty": true, "total-pages": this.curSelection.length, language: this.language, "translation-url": this.translationUrl })))), index.h("lottery-tipping-dialog", { key: 'fdac976410e6b1b1e1ea20072d5c4caa474f4130', visible: this.showCurrentDrawResult, width: !isMobile(window.navigator.userAgent) ? '720px' : undefined, fullscreen: isMobile(window.navigator.userAgent), closable: true, showFooter: false, onCancel: () => {
+                this.showCurrentDrawResult = false;
+            }, language: this.language, "translation-url": this.translationUrl }, this.curDrawSelection && this.curDrawSelection.length && (index.h("div", { key: 'b495d8bb01c4bb18edf951889850d56700564d8b' }, index.h("div", { key: '77443b43ee363dd2051da4a8c6cb004f2acab410', class: "betting-type" }, index.h("div", { key: 'ada4a3803b9073e78c248790f24de86900e5776f', class: "betting-type-title" }, translate$3('bettingType', this.language)), index.h("div", { key: '20826ed1192db8acfb25310c31252cb7f5a75f2a', class: "betting-type-text" }, index.h("div", { key: '7721c04879283138870833b3ce0b881cd84aec6c', class: "LotteryTippingTicketController__segmented-control" }, Object.keys(this.curDrawSelectionMap).map((bettingType) => (index.h("button", { class: {
+                LotteryTippingTicketController__segment: true,
+                'LotteryTippingTicketController__segment--active': this.curDrawSelectionBettingType === bettingType
+            }, onClick: () => this.handleDrawBettingTypeChange(bettingType) }, this.getBettingTypeName(bettingType))))))), index.h("lottery-tipping-ticket-bet", { key: 'b8b29a1a6e6bda2ce5004765e219e58d8e12bb2f', endpoint: this.endpoint, "session-id": this.sessionId, "game-id": this.curDrawItem.vendorGameId, "draw-id": this.curDrawItem.id, "default-bullet-config-line-group": JSON.stringify(this.curDrawSelection), "read-pretty": true, "total-pages": this.curDrawSelection.length, language: this.language, "translation-url": this.translationUrl })))), index.h("div", { key: 'a84c658d87e936cbf20731a64bc753f13c099024', class: "pagination-wrap" }, index.h("lottery-tipping-pagination", { key: 'fdf7443bd153e90c131e4ba937f08d611706a56d', total: this.paginationInfo.total, current: this.paginationInfo.current, "page-size": this.paginationInfo.pageSize, language: this.language, "translation-url": this.translationUrl }))));
+    }
+    static get watchers() { return {
+        "clientStyling": ["handleClientStylingChange"],
+        "clientStylingUrl": ["handleClientStylingUrlChange"],
+        "mbSource": ["handleMbSourceChange"]
+    }; }
+};
+LotteryTippingTicketHistory.style = LotteryTippingTicketHistoryStyle0;
+
 exports.lottery_tipping_page = lotteryTippingPage.LotteryTippingPage;
+exports.general_multi_select = GeneralMultiSelect;
 exports.general_tooltip = GeneralTooltip;
 exports.lottery_tipping_bullet = LotteryTippingBullet;
 exports.lottery_tipping_bullet_group = LotteryTippingBulletGroup;
+exports.lottery_tipping_dialog = LotteryTippingDialog;
+exports.lottery_tipping_filter = LotteryTippingFilter;
+exports.lottery_tipping_pagination = LotteryTippingPagination;
+exports.lottery_tipping_panel = lotteryTippingPanel;
 exports.lottery_tipping_ticket_banner = LotteryTippingTicketBanner;
 exports.lottery_tipping_ticket_bet = LotteryTippingTicketBet;
 exports.lottery_tipping_ticket_controller = LotteryTippingTicketController;
+exports.lottery_tipping_ticket_history = LotteryTippingTicketHistory;