@everymatrix/user-transaction-history 1.60.2 → 1.61.0

package/dist/cjs/index-8b5843ec.js

@@ -71,10 +71,10 @@ var loadModule = (cmpMeta, hostRef, hmrVersionId) => {
           }
           switch(bundleId) {
               
-                case 'user-transaction-history.cjs':
+                case 'ui-image_2.cjs':
                     return Promise.resolve().then(function () { return /*#__PURE__*/_interopNamespace(require(
                         /* webpackMode: "lazy" */
-                        './user-transaction-history.cjs.entry.js')); }).then(processMod, consoleError);
+                        './ui-image_2.cjs.entry.js')); }).then(processMod, consoleError);
           }
       }
   return Promise.resolve().then(function () { return /*#__PURE__*/_interopNamespace(require(

package/dist/cjs/loader.cjs.js

@@ -8,7 +8,7 @@ const appGlobals = require('./app-globals-3a1e7e63.js');
 const defineCustomElements = async (win, options) => {
   if (typeof window === 'undefined') return undefined;
   await appGlobals.globalScripts();
-  return index.bootstrapLazy([["user-transaction-history.cjs",[[1,"user-transaction-history",{"endpoint":[513],"session":[513],"language":[513],"userId":[513,"user-id"],"translationUrl":[513,"translation-url"],"mobile":[516],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"mbSource":[513,"mb-source"],"page":[32],"pageSize":[32],"showMobileFilter":[32],"to":[32],"from":[32],"type":[32],"transactions":[32],"showLoader":[32]},[[9,"resize","getComponentHeight"]],{"page":["watchMultiple"],"type":["watchMultiple"],"session":["watchMultiple"],"userId":["watchMultiple"],"pageSize":["watchMultiple"],"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"],"showMobileFilter":["getComponentHeight"]}]]]], options);
+  return index.bootstrapLazy([["ui-image_2.cjs",[[1,"user-transaction-history",{"endpoint":[513],"session":[513],"language":[513],"userId":[513,"user-id"],"translationUrl":[513,"translation-url"],"mobile":[516],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"mbSource":[513,"mb-source"],"page":[32],"pageSize":[32],"showMobileFilter":[32],"to":[32],"from":[32],"type":[32],"transactions":[32],"showLoader":[32]},[[9,"resize","getComponentHeight"]],{"page":["watchMultiple"],"type":["watchMultiple"],"session":["watchMultiple"],"userId":["watchMultiple"],"pageSize":["watchMultiple"],"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"],"showMobileFilter":["getComponentHeight"]}],[0,"ui-image",{"src":[1],"width":[1],"height":[1],"alt":[1],"imgClass":[1,"img-class"],"styles":[8],"detectDistance":[1,"detect-distance"],"imgLoaded":[32],"shouldLoad":[32]},null,{"src":["handleSrc"]}]]]], options);
 };
 
 exports.setNonce = index.setNonce;

package/dist/cjs/{user-transaction-history.cjs.entry.js → ui-image_2.cjs.entry.js}

@@ -4,6 +4,70 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-8b5843ec.js');
 
+const uiImageCss = ":host{display:block}.Hidden{opacity:0;transition:opacity 0.5s ease-in-out}.Visible{opacity:1;transition:opacity 0.5s ease-in-out}";
+const UiImageStyle0 = uiImageCss;
+
+const UiImage = class {
+    constructor(hostRef) {
+        index.registerInstance(this, hostRef);
+        this.src = undefined;
+        this.width = undefined;
+        this.height = undefined;
+        this.alt = undefined;
+        this.imgClass = '';
+        this.styles = undefined;
+        this.detectDistance = '200px';
+        this.imgLoaded = false;
+        this.shouldLoad = false;
+    }
+    handleSrc() {
+        if (!this.shouldLoad) {
+            return;
+        }
+        const tempImage = new Image();
+        tempImage.src = this.src;
+        tempImage.onload = () => {
+            if (this.image) {
+                this.image.src = this.src;
+                this.imgLoaded = true;
+                this.el.dispatchEvent(new CustomEvent('load', { bubbles: true }));
+            }
+        };
+    }
+    componentDidLoad() {
+        if ('IntersectionObserver' in window) {
+            this.el.__uxComponent = this;
+            if (!window.EMUxObserver) {
+                window.EMUxObserver = new IntersectionObserver((entries) => {
+                    entries.forEach(entry => {
+                        if (entry.isIntersecting) {
+                            const comp = entry.target.__uxComponent;
+                            if (comp) {
+                                comp.shouldLoad = true;
+                                comp.handleSrc();
+                            }
+                            window.EMUxObserver.unobserve(entry.target);
+                        }
+                    });
+                }, { rootMargin: this.detectDistance });
+            }
+            window.EMUxObserver.observe(this.el);
+        }
+        else {
+            this.shouldLoad = true;
+            this.handleSrc();
+        }
+    }
+    render() {
+        return (index.h("img", { key: '2bb4dc391fc2f753514103e91c0abf065de3236a', ref: el => (this.image = el), style: this.styles, class: `${this.imgClass} ${this.imgLoaded ? 'Visible' : 'Hidden'}`, alt: this.alt, width: this.width, height: this.height, loading: "lazy" }));
+    }
+    get el() { return index.getElement(this); }
+    static get watchers() { return {
+        "src": ["handleSrc"]
+    }; }
+};
+UiImage.style = UiImageStyle0;
+
 const DEFAULT_TRANSLATIONS = {
     "en": {
         "deposit": "Deposit",
@@ -348,7 +412,7 @@ const UserTransactionHistory = class {
         var _a;
         const filterSrc = index.getAssetPath('../assets/filter.svg');
         const warningSrc = index.getAssetPath('../assets/warning.svg');
-        return (index.h(index.Host, { key: '8d6470d73afff5dbc8a8c3a1a47426223971ad47' }, this.showLoader ? index.h(Loader, null) : '', index.h("div", { key: '8c32d9425b701747559ea1e63a3b2c4bb31780ab', class: "wrapper", ref: el => (this.stylingContainer = el) }, index.h("div", { key: 'b2a9216bfcfa5950c174f6e06a179e2ae3790f6b', class: { 'types types-mobile': this.mobile, 'types types-desktop': !this.mobile } }, index.h("button", { key: 'e2ce33fe2ab27abab68bd721b8b945bde5d672ac', class: 'transaction-type' + ' ' + (this.type === '0' ? 'clicked' : ''), onClick: () => this.changeTransactionsType('0') }, Localization.translate('deposit', this.language)), index.h("button", { key: '6d80bef56bf4ec590cc2e4aa704f930a47b29f3c', class: 'transaction-type' + ' ' + (this.type === '1' ? 'clicked' : ''), onClick: () => this.changeTransactionsType('1') }, Localization.translate('withdrawals', this.language))), !this.mobile ? index.h(PageSize, { language: this.language, pageSizes: this.pageSizes, currentPageSize: this.pageSize, changePageSize: s => this.changePageSize(s) }) : '', this.mobile ? (index.h("button", { class: "mobile-filter-button", onClick: () => this.showFilter() }, index.h("img", { src: filterSrc, alt: "Filter" }), Localization.translate('filter', this.language))) : (''), !this.mobile || (this.showMobileFilter && this.mobile) ? index.h(Filters, { language: this.language, applyFilters: (from, to) => this.applyFilters(from, to) }) : '', ((_a = this.transactions) === null || _a === void 0 ? void 0 : _a.length) > 0 ? (index.h("div", { class: "table" }, this.mobile ? (index.h("div", { class: "mobile-table" }, this.transactions.map(transaction => (index.h(TransactionComponent, Object.assign({}, transaction)))))) : (index.h(TableComponent, { source: this.transactions, language: this.language })))) : (index.h("div", { class: "noData" }, index.h("img", { src: warningSrc, alt: "Warning" }), index.h("span", null, Localization.translate('noData', this.language)))), index.h("div", { key: '9b7950ed91c4795f4355ce406d7cba40c46c0184', class: "pagination" }, index.h("button", { key: 'bc7b2bce0a21763fc5a10d2249b74c2d9805d3b5', onClick: () => this.prev() }, '<'), index.h("button", { key: '69210c5b101a24563babdbe6b3361d091afc2cc0', onClick: () => this.next() }, '>')))));
+        return (index.h(index.Host, { key: 'd467e9c565084cc1cdd633e00448b3f96389ce34' }, this.showLoader ? index.h(Loader, null) : '', index.h("div", { key: 'e1286eeb391fa540ffa413a2ad55f8b9161c1a2d', class: "wrapper", ref: el => (this.stylingContainer = el) }, index.h("div", { key: '3482b2f6417b78c402b6499c1e80e79772e066ae', class: { 'types types-mobile': this.mobile, 'types types-desktop': !this.mobile } }, index.h("button", { key: '37c9da8cd84ac3b01e0d28088999604005b22740', class: 'transaction-type' + ' ' + (this.type === '0' ? 'clicked' : ''), onClick: () => this.changeTransactionsType('0') }, Localization.translate('deposit', this.language)), index.h("button", { key: 'e6fd6057fc0adaf6741023997c870004baf8eb5d', class: 'transaction-type' + ' ' + (this.type === '1' ? 'clicked' : ''), onClick: () => this.changeTransactionsType('1') }, Localization.translate('withdrawals', this.language))), !this.mobile ? index.h(PageSize, { language: this.language, pageSizes: this.pageSizes, currentPageSize: this.pageSize, changePageSize: s => this.changePageSize(s) }) : '', this.mobile ? (index.h("button", { class: "mobile-filter-button", onClick: () => this.showFilter() }, index.h("ui-image", { src: filterSrc, alt: "Filter" }), Localization.translate('filter', this.language))) : (''), !this.mobile || (this.showMobileFilter && this.mobile) ? index.h(Filters, { language: this.language, applyFilters: (from, to) => this.applyFilters(from, to) }) : '', ((_a = this.transactions) === null || _a === void 0 ? void 0 : _a.length) > 0 ? (index.h("div", { class: "table" }, this.mobile ? (index.h("div", { class: "mobile-table" }, this.transactions.map(transaction => (index.h(TransactionComponent, Object.assign({}, transaction)))))) : (index.h(TableComponent, { source: this.transactions, language: this.language })))) : (index.h("div", { class: "noData" }, index.h("ui-image", { src: warningSrc, alt: "Warning" }), index.h("span", null, Localization.translate('noData', this.language)))), index.h("div", { key: 'f1e16d2395614016c31dd35f422ca9146c7dfdfa', class: "pagination" }, index.h("button", { key: 'be18928021e45ed4e4c3dc5fe6e3d41a51c2c95e', onClick: () => this.prev() }, '<'), index.h("button", { key: '3e871ad1f4aff6c8f43c93ba2f95d122c6bc8af8', onClick: () => this.next() }, '>')))));
     }
     async loadTransactions() {
         this.showLoader = true;
@@ -398,4 +462,5 @@ const UserTransactionHistory = class {
 };
 UserTransactionHistory.style = UserTransactionHistoryStyle0;
 
+exports.ui_image = UiImage;
 exports.user_transaction_history = UserTransactionHistory;

package/dist/cjs/user-transaction-history.cjs.js

@@ -19,7 +19,7 @@ var patchBrowser = () => {
 
 patchBrowser().then(async (options) => {
   await appGlobals.globalScripts();
-  return index.bootstrapLazy([["user-transaction-history.cjs",[[1,"user-transaction-history",{"endpoint":[513],"session":[513],"language":[513],"userId":[513,"user-id"],"translationUrl":[513,"translation-url"],"mobile":[516],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"mbSource":[513,"mb-source"],"page":[32],"pageSize":[32],"showMobileFilter":[32],"to":[32],"from":[32],"type":[32],"transactions":[32],"showLoader":[32]},[[9,"resize","getComponentHeight"]],{"page":["watchMultiple"],"type":["watchMultiple"],"session":["watchMultiple"],"userId":["watchMultiple"],"pageSize":["watchMultiple"],"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"],"showMobileFilter":["getComponentHeight"]}]]]], options);
+  return index.bootstrapLazy([["ui-image_2.cjs",[[1,"user-transaction-history",{"endpoint":[513],"session":[513],"language":[513],"userId":[513,"user-id"],"translationUrl":[513,"translation-url"],"mobile":[516],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"mbSource":[513,"mb-source"],"page":[32],"pageSize":[32],"showMobileFilter":[32],"to":[32],"from":[32],"type":[32],"transactions":[32],"showLoader":[32]},[[9,"resize","getComponentHeight"]],{"page":["watchMultiple"],"type":["watchMultiple"],"session":["watchMultiple"],"userId":["watchMultiple"],"pageSize":["watchMultiple"],"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"],"showMobileFilter":["getComponentHeight"]}],[0,"ui-image",{"src":[1],"width":[1],"height":[1],"alt":[1],"imgClass":[1,"img-class"],"styles":[8],"detectDistance":[1,"detect-distance"],"imgLoaded":[32],"shouldLoad":[32]},null,{"src":["handleSrc"]}]]]], options);
 });
 
 exports.setNonce = index.setNonce;

package/dist/collection/collection-manifest.json

@@ -7,6 +7,13 @@
     "version": "4.19.2",
     "typescriptVersion": "5.4.5"
   },
-  "collections": [],
+  "collections": [
+    {
+      "name": "@everymatrix/ui-image",
+      "tags": [
+        "ui-image"
+      ]
+    }
+  ],
   "bundles": []
 }

package/dist/collection/components/user-transaction-history/user-transaction-history.js

@@ -5,6 +5,7 @@ import { TransactionComponent } from "../internal/transaction";
 import { PageSize } from "../internal/page-size";
 import { Filters } from "../internal/filters";
 import { TableComponent } from "../internal/table";
+import "../../../../../ui-image/dist/types/index";
 import { setClientStyling, setClientStylingURL, setStreamStyling } from "../../../../../../../../libs/common/src/styling/index";
 export class UserTransactionHistory {
     constructor() {
@@ -110,7 +111,7 @@ export class UserTransactionHistory {
         var _a;
         const filterSrc = getAssetPath('../assets/filter.svg');
         const warningSrc = getAssetPath('../assets/warning.svg');
-        return (h(Host, { key: '8d6470d73afff5dbc8a8c3a1a47426223971ad47' }, this.showLoader ? h(Loader, null) : '', h("div", { key: '8c32d9425b701747559ea1e63a3b2c4bb31780ab', class: "wrapper", ref: el => (this.stylingContainer = el) }, h("div", { key: 'b2a9216bfcfa5950c174f6e06a179e2ae3790f6b', class: { 'types types-mobile': this.mobile, 'types types-desktop': !this.mobile } }, h("button", { key: 'e2ce33fe2ab27abab68bd721b8b945bde5d672ac', class: 'transaction-type' + ' ' + (this.type === '0' ? 'clicked' : ''), onClick: () => this.changeTransactionsType('0') }, Localization.translate('deposit', this.language)), h("button", { key: '6d80bef56bf4ec590cc2e4aa704f930a47b29f3c', class: 'transaction-type' + ' ' + (this.type === '1' ? 'clicked' : ''), onClick: () => this.changeTransactionsType('1') }, Localization.translate('withdrawals', this.language))), !this.mobile ? h(PageSize, { language: this.language, pageSizes: this.pageSizes, currentPageSize: this.pageSize, changePageSize: s => this.changePageSize(s) }) : '', this.mobile ? (h("button", { class: "mobile-filter-button", onClick: () => this.showFilter() }, h("img", { src: filterSrc, alt: "Filter" }), Localization.translate('filter', this.language))) : (''), !this.mobile || (this.showMobileFilter && this.mobile) ? h(Filters, { language: this.language, applyFilters: (from, to) => this.applyFilters(from, to) }) : '', ((_a = this.transactions) === null || _a === void 0 ? void 0 : _a.length) > 0 ? (h("div", { class: "table" }, this.mobile ? (h("div", { class: "mobile-table" }, this.transactions.map(transaction => (h(TransactionComponent, Object.assign({}, transaction)))))) : (h(TableComponent, { source: this.transactions, language: this.language })))) : (h("div", { class: "noData" }, h("img", { src: warningSrc, alt: "Warning" }), h("span", null, Localization.translate('noData', this.language)))), h("div", { key: '9b7950ed91c4795f4355ce406d7cba40c46c0184', class: "pagination" }, h("button", { key: 'bc7b2bce0a21763fc5a10d2249b74c2d9805d3b5', onClick: () => this.prev() }, '<'), h("button", { key: '69210c5b101a24563babdbe6b3361d091afc2cc0', onClick: () => this.next() }, '>')))));
+        return (h(Host, { key: 'd467e9c565084cc1cdd633e00448b3f96389ce34' }, this.showLoader ? h(Loader, null) : '', h("div", { key: 'e1286eeb391fa540ffa413a2ad55f8b9161c1a2d', class: "wrapper", ref: el => (this.stylingContainer = el) }, h("div", { key: '3482b2f6417b78c402b6499c1e80e79772e066ae', class: { 'types types-mobile': this.mobile, 'types types-desktop': !this.mobile } }, h("button", { key: '37c9da8cd84ac3b01e0d28088999604005b22740', class: 'transaction-type' + ' ' + (this.type === '0' ? 'clicked' : ''), onClick: () => this.changeTransactionsType('0') }, Localization.translate('deposit', this.language)), h("button", { key: 'e6fd6057fc0adaf6741023997c870004baf8eb5d', class: 'transaction-type' + ' ' + (this.type === '1' ? 'clicked' : ''), onClick: () => this.changeTransactionsType('1') }, Localization.translate('withdrawals', this.language))), !this.mobile ? h(PageSize, { language: this.language, pageSizes: this.pageSizes, currentPageSize: this.pageSize, changePageSize: s => this.changePageSize(s) }) : '', this.mobile ? (h("button", { class: "mobile-filter-button", onClick: () => this.showFilter() }, h("ui-image", { src: filterSrc, alt: "Filter" }), Localization.translate('filter', this.language))) : (''), !this.mobile || (this.showMobileFilter && this.mobile) ? h(Filters, { language: this.language, applyFilters: (from, to) => this.applyFilters(from, to) }) : '', ((_a = this.transactions) === null || _a === void 0 ? void 0 : _a.length) > 0 ? (h("div", { class: "table" }, this.mobile ? (h("div", { class: "mobile-table" }, this.transactions.map(transaction => (h(TransactionComponent, Object.assign({}, transaction)))))) : (h(TableComponent, { source: this.transactions, language: this.language })))) : (h("div", { class: "noData" }, h("ui-image", { src: warningSrc, alt: "Warning" }), h("span", null, Localization.translate('noData', this.language)))), h("div", { key: 'f1e16d2395614016c31dd35f422ca9146c7dfdfa', class: "pagination" }, h("button", { key: 'be18928021e45ed4e4c3dc5fe6e3d41a51c2c95e', onClick: () => this.prev() }, '<'), h("button", { key: '3e871ad1f4aff6c8f43c93ba2f95d122c6bc8af8', onClick: () => this.next() }, '>')))));
     }
     async loadTransactions() {
         this.showLoader = true;

package/dist/esm/{index-7c5e707a.js → index-21ba09dd.js}

@@ -49,10 +49,10 @@ var loadModule = (cmpMeta, hostRef, hmrVersionId) => {
           }
           switch(bundleId) {
               
-                case 'user-transaction-history':
+                case 'ui-image_2':
                     return import(
                       /* webpackMode: "lazy" */
-                      './user-transaction-history.entry.js').then(processMod, consoleError);
+                      './ui-image_2.entry.js').then(processMod, consoleError);
           }
       }
   return import(
@@ -1341,4 +1341,4 @@ var hostListenerOpts = (flags) => supportsListenerOptions ? {
 // src/runtime/nonce.ts
 var setNonce = (nonce) => plt.$nonce$ = nonce;
 
-export { Host as H, getElement as a, bootstrapLazy as b, getAssetPath as g, h, promiseResolve as p, registerInstance as r, setNonce as s };
+export { Host as H, getAssetPath as a, bootstrapLazy as b, getElement as g, h, promiseResolve as p, registerInstance as r, setNonce as s };

package/dist/esm/loader.js

@@ -1,11 +1,11 @@
-import { b as bootstrapLazy } from './index-7c5e707a.js';
-export { s as setNonce } from './index-7c5e707a.js';
+import { b as bootstrapLazy } from './index-21ba09dd.js';
+export { s as setNonce } from './index-21ba09dd.js';
 import { g as globalScripts } from './app-globals-0f993ce5.js';
 
 const defineCustomElements = async (win, options) => {
   if (typeof window === 'undefined') return undefined;
   await globalScripts();
-  return bootstrapLazy([["user-transaction-history",[[1,"user-transaction-history",{"endpoint":[513],"session":[513],"language":[513],"userId":[513,"user-id"],"translationUrl":[513,"translation-url"],"mobile":[516],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"mbSource":[513,"mb-source"],"page":[32],"pageSize":[32],"showMobileFilter":[32],"to":[32],"from":[32],"type":[32],"transactions":[32],"showLoader":[32]},[[9,"resize","getComponentHeight"]],{"page":["watchMultiple"],"type":["watchMultiple"],"session":["watchMultiple"],"userId":["watchMultiple"],"pageSize":["watchMultiple"],"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"],"showMobileFilter":["getComponentHeight"]}]]]], options);
+  return bootstrapLazy([["ui-image_2",[[1,"user-transaction-history",{"endpoint":[513],"session":[513],"language":[513],"userId":[513,"user-id"],"translationUrl":[513,"translation-url"],"mobile":[516],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"mbSource":[513,"mb-source"],"page":[32],"pageSize":[32],"showMobileFilter":[32],"to":[32],"from":[32],"type":[32],"transactions":[32],"showLoader":[32]},[[9,"resize","getComponentHeight"]],{"page":["watchMultiple"],"type":["watchMultiple"],"session":["watchMultiple"],"userId":["watchMultiple"],"pageSize":["watchMultiple"],"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"],"showMobileFilter":["getComponentHeight"]}],[0,"ui-image",{"src":[1],"width":[1],"height":[1],"alt":[1],"imgClass":[1,"img-class"],"styles":[8],"detectDistance":[1,"detect-distance"],"imgLoaded":[32],"shouldLoad":[32]},null,{"src":["handleSrc"]}]]]], options);
 };
 
 export { defineCustomElements };

package/dist/esm/{user-transaction-history.entry.js → ui-image_2.entry.js}

@@ -1,4 +1,68 @@
-import { h, r as registerInstance, g as getAssetPath, H as Host, a as getElement } from './index-7c5e707a.js';
+import { r as registerInstance, h, g as getElement, a as getAssetPath, H as Host } from './index-21ba09dd.js';
+
+const uiImageCss = ":host{display:block}.Hidden{opacity:0;transition:opacity 0.5s ease-in-out}.Visible{opacity:1;transition:opacity 0.5s ease-in-out}";
+const UiImageStyle0 = uiImageCss;
+
+const UiImage = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        this.src = undefined;
+        this.width = undefined;
+        this.height = undefined;
+        this.alt = undefined;
+        this.imgClass = '';
+        this.styles = undefined;
+        this.detectDistance = '200px';
+        this.imgLoaded = false;
+        this.shouldLoad = false;
+    }
+    handleSrc() {
+        if (!this.shouldLoad) {
+            return;
+        }
+        const tempImage = new Image();
+        tempImage.src = this.src;
+        tempImage.onload = () => {
+            if (this.image) {
+                this.image.src = this.src;
+                this.imgLoaded = true;
+                this.el.dispatchEvent(new CustomEvent('load', { bubbles: true }));
+            }
+        };
+    }
+    componentDidLoad() {
+        if ('IntersectionObserver' in window) {
+            this.el.__uxComponent = this;
+            if (!window.EMUxObserver) {
+                window.EMUxObserver = new IntersectionObserver((entries) => {
+                    entries.forEach(entry => {
+                        if (entry.isIntersecting) {
+                            const comp = entry.target.__uxComponent;
+                            if (comp) {
+                                comp.shouldLoad = true;
+                                comp.handleSrc();
+                            }
+                            window.EMUxObserver.unobserve(entry.target);
+                        }
+                    });
+                }, { rootMargin: this.detectDistance });
+            }
+            window.EMUxObserver.observe(this.el);
+        }
+        else {
+            this.shouldLoad = true;
+            this.handleSrc();
+        }
+    }
+    render() {
+        return (h("img", { key: '2bb4dc391fc2f753514103e91c0abf065de3236a', ref: el => (this.image = el), style: this.styles, class: `${this.imgClass} ${this.imgLoaded ? 'Visible' : 'Hidden'}`, alt: this.alt, width: this.width, height: this.height, loading: "lazy" }));
+    }
+    get el() { return getElement(this); }
+    static get watchers() { return {
+        "src": ["handleSrc"]
+    }; }
+};
+UiImage.style = UiImageStyle0;
 
 const DEFAULT_TRANSLATIONS = {
     "en": {
@@ -344,7 +408,7 @@ const UserTransactionHistory = class {
         var _a;
         const filterSrc = getAssetPath('../assets/filter.svg');
         const warningSrc = getAssetPath('../assets/warning.svg');
-        return (h(Host, { key: '8d6470d73afff5dbc8a8c3a1a47426223971ad47' }, this.showLoader ? h(Loader, null) : '', h("div", { key: '8c32d9425b701747559ea1e63a3b2c4bb31780ab', class: "wrapper", ref: el => (this.stylingContainer = el) }, h("div", { key: 'b2a9216bfcfa5950c174f6e06a179e2ae3790f6b', class: { 'types types-mobile': this.mobile, 'types types-desktop': !this.mobile } }, h("button", { key: 'e2ce33fe2ab27abab68bd721b8b945bde5d672ac', class: 'transaction-type' + ' ' + (this.type === '0' ? 'clicked' : ''), onClick: () => this.changeTransactionsType('0') }, Localization.translate('deposit', this.language)), h("button", { key: '6d80bef56bf4ec590cc2e4aa704f930a47b29f3c', class: 'transaction-type' + ' ' + (this.type === '1' ? 'clicked' : ''), onClick: () => this.changeTransactionsType('1') }, Localization.translate('withdrawals', this.language))), !this.mobile ? h(PageSize, { language: this.language, pageSizes: this.pageSizes, currentPageSize: this.pageSize, changePageSize: s => this.changePageSize(s) }) : '', this.mobile ? (h("button", { class: "mobile-filter-button", onClick: () => this.showFilter() }, h("img", { src: filterSrc, alt: "Filter" }), Localization.translate('filter', this.language))) : (''), !this.mobile || (this.showMobileFilter && this.mobile) ? h(Filters, { language: this.language, applyFilters: (from, to) => this.applyFilters(from, to) }) : '', ((_a = this.transactions) === null || _a === void 0 ? void 0 : _a.length) > 0 ? (h("div", { class: "table" }, this.mobile ? (h("div", { class: "mobile-table" }, this.transactions.map(transaction => (h(TransactionComponent, Object.assign({}, transaction)))))) : (h(TableComponent, { source: this.transactions, language: this.language })))) : (h("div", { class: "noData" }, h("img", { src: warningSrc, alt: "Warning" }), h("span", null, Localization.translate('noData', this.language)))), h("div", { key: '9b7950ed91c4795f4355ce406d7cba40c46c0184', class: "pagination" }, h("button", { key: 'bc7b2bce0a21763fc5a10d2249b74c2d9805d3b5', onClick: () => this.prev() }, '<'), h("button", { key: '69210c5b101a24563babdbe6b3361d091afc2cc0', onClick: () => this.next() }, '>')))));
+        return (h(Host, { key: 'd467e9c565084cc1cdd633e00448b3f96389ce34' }, this.showLoader ? h(Loader, null) : '', h("div", { key: 'e1286eeb391fa540ffa413a2ad55f8b9161c1a2d', class: "wrapper", ref: el => (this.stylingContainer = el) }, h("div", { key: '3482b2f6417b78c402b6499c1e80e79772e066ae', class: { 'types types-mobile': this.mobile, 'types types-desktop': !this.mobile } }, h("button", { key: '37c9da8cd84ac3b01e0d28088999604005b22740', class: 'transaction-type' + ' ' + (this.type === '0' ? 'clicked' : ''), onClick: () => this.changeTransactionsType('0') }, Localization.translate('deposit', this.language)), h("button", { key: 'e6fd6057fc0adaf6741023997c870004baf8eb5d', class: 'transaction-type' + ' ' + (this.type === '1' ? 'clicked' : ''), onClick: () => this.changeTransactionsType('1') }, Localization.translate('withdrawals', this.language))), !this.mobile ? h(PageSize, { language: this.language, pageSizes: this.pageSizes, currentPageSize: this.pageSize, changePageSize: s => this.changePageSize(s) }) : '', this.mobile ? (h("button", { class: "mobile-filter-button", onClick: () => this.showFilter() }, h("ui-image", { src: filterSrc, alt: "Filter" }), Localization.translate('filter', this.language))) : (''), !this.mobile || (this.showMobileFilter && this.mobile) ? h(Filters, { language: this.language, applyFilters: (from, to) => this.applyFilters(from, to) }) : '', ((_a = this.transactions) === null || _a === void 0 ? void 0 : _a.length) > 0 ? (h("div", { class: "table" }, this.mobile ? (h("div", { class: "mobile-table" }, this.transactions.map(transaction => (h(TransactionComponent, Object.assign({}, transaction)))))) : (h(TableComponent, { source: this.transactions, language: this.language })))) : (h("div", { class: "noData" }, h("ui-image", { src: warningSrc, alt: "Warning" }), h("span", null, Localization.translate('noData', this.language)))), h("div", { key: 'f1e16d2395614016c31dd35f422ca9146c7dfdfa', class: "pagination" }, h("button", { key: 'be18928021e45ed4e4c3dc5fe6e3d41a51c2c95e', onClick: () => this.prev() }, '<'), h("button", { key: '3e871ad1f4aff6c8f43c93ba2f95d122c6bc8af8', onClick: () => this.next() }, '>')))));
     }
     async loadTransactions() {
         this.showLoader = true;
@@ -394,4 +458,4 @@ const UserTransactionHistory = class {
 };
 UserTransactionHistory.style = UserTransactionHistoryStyle0;
 
-export { UserTransactionHistory as user_transaction_history };
+export { UiImage as ui_image, UserTransactionHistory as user_transaction_history };

package/dist/esm/user-transaction-history.js

@@ -1,5 +1,5 @@
-import { p as promiseResolve, b as bootstrapLazy } from './index-7c5e707a.js';
-export { s as setNonce } from './index-7c5e707a.js';
+import { p as promiseResolve, b as bootstrapLazy } from './index-21ba09dd.js';
+export { s as setNonce } from './index-21ba09dd.js';
 import { g as globalScripts } from './app-globals-0f993ce5.js';
 
 /*
@@ -16,5 +16,5 @@ var patchBrowser = () => {
 
 patchBrowser().then(async (options) => {
   await globalScripts();
-  return bootstrapLazy([["user-transaction-history",[[1,"user-transaction-history",{"endpoint":[513],"session":[513],"language":[513],"userId":[513,"user-id"],"translationUrl":[513,"translation-url"],"mobile":[516],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"mbSource":[513,"mb-source"],"page":[32],"pageSize":[32],"showMobileFilter":[32],"to":[32],"from":[32],"type":[32],"transactions":[32],"showLoader":[32]},[[9,"resize","getComponentHeight"]],{"page":["watchMultiple"],"type":["watchMultiple"],"session":["watchMultiple"],"userId":["watchMultiple"],"pageSize":["watchMultiple"],"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"],"showMobileFilter":["getComponentHeight"]}]]]], options);
+  return bootstrapLazy([["ui-image_2",[[1,"user-transaction-history",{"endpoint":[513],"session":[513],"language":[513],"userId":[513,"user-id"],"translationUrl":[513,"translation-url"],"mobile":[516],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"mbSource":[513,"mb-source"],"page":[32],"pageSize":[32],"showMobileFilter":[32],"to":[32],"from":[32],"type":[32],"transactions":[32],"showLoader":[32]},[[9,"resize","getComponentHeight"]],{"page":["watchMultiple"],"type":["watchMultiple"],"session":["watchMultiple"],"userId":["watchMultiple"],"pageSize":["watchMultiple"],"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"],"showMobileFilter":["getComponentHeight"]}],[0,"ui-image",{"src":[1],"width":[1],"height":[1],"alt":[1],"imgClass":[1,"img-class"],"styles":[8],"detectDistance":[1,"detect-distance"],"imgLoaded":[32],"shouldLoad":[32]},null,{"src":["handleSrc"]}]]]], options);
 });

package/dist/types/components/user-transaction-history/user-transaction-history.d.ts

@@ -1,4 +1,5 @@
 import { Transaction } from '../../models/transactions-response.model';
+import "../../../../../../dist/packages/stencil/ui-image/dist/types/index";
 export declare class UserTransactionHistory {
     private pageSizes;
     private pagination;

package/dist/user-transaction-history/p-6df80ecb.entry.js

@@ -0,0 +1 @@
+import{r as t,h as e,g as i,a,H as o}from"./p-d0caa719.js";const n=class{constructor(e){t(this,e),this.src=void 0,this.width=void 0,this.height=void 0,this.alt=void 0,this.imgClass="",this.styles=void 0,this.detectDistance="200px",this.imgLoaded=!1,this.shouldLoad=!1}handleSrc(){if(!this.shouldLoad)return;const t=new Image;t.src=this.src,t.onload=()=>{this.image&&(this.image.src=this.src,this.imgLoaded=!0,this.el.dispatchEvent(new CustomEvent("load",{bubbles:!0})))}}componentDidLoad(){"IntersectionObserver"in window?(this.el.__uxComponent=this,window.EMUxObserver||(window.EMUxObserver=new IntersectionObserver((t=>{t.forEach((t=>{if(t.isIntersecting){const e=t.target.__uxComponent;e&&(e.shouldLoad=!0,e.handleSrc()),window.EMUxObserver.unobserve(t.target)}}))}),{rootMargin:this.detectDistance})),window.EMUxObserver.observe(this.el)):(this.shouldLoad=!0,this.handleSrc())}render(){return e("img",{key:"2bb4dc391fc2f753514103e91c0abf065de3236a",ref:t=>this.image=t,style:this.styles,class:`${this.imgClass} ${this.imgLoaded?"Visible":"Hidden"}`,alt:this.alt,width:this.width,height:this.height,loading:"lazy"})}get el(){return i(this)}static get watchers(){return{src:["handleSrc"]}}};n.style=":host{display:block}.Hidden{opacity:0;transition:opacity 0.5s ease-in-out}.Visible{opacity:1;transition:opacity 0.5s ease-in-out}";class r{constructor(){}static async loadCustomTranslations(t){try{const e=await fetch(t,{headers:{"Content-Type":"application/json"}});if(!e.ok){const t=await e.text();throw new Error(t)}const i=await e.json();r.updateTranslations(i)}catch(e){console.error(`Failed to load translations ${t}. ${e.message}`)}}static translate(t,e){var i,a;const o=r.getAvaliableLanguages(e);return(null===(a=null===(i=r.customTranslation)||void 0===i?void 0:i[o.customLanguage])||void 0===a?void 0:a[t])||r.defaultTranslation[o.predefinedLanguage][t]}static getAvaliableLanguages(t){var e;const i=(null===(e=r.customLanguages)||void 0===e?void 0:e.includes(t))?t:r.defaultLanguage;return{predefinedLanguage:r.supportedLanguages.includes(t)?t:r.defaultLanguage,customLanguage:i}}static updateTranslations(t){r.customLanguages=Array.from(new Set([...r.supportedLanguages,...Object.keys(t).map((t=>t.toLowerCase()))])),r.customTranslation=t}}r.defaultLanguage="en",r.supportedLanguages=["en"],r.defaultTranslation={en:{deposit:"Deposit",withdrawals:"Withdrawals",show:"Show",from:"From",to:"To",filter:"Filter",transactionId:"Transaction ID",date:"Date",amount:"Amount",productType:"Product Type",status:"Status",noData:"There are no account activities"},hr:{deposit:"Uplate",withdrawals:"Isplate",show:"Prikaži",from:"Od",to:"Do",filter:"Filter",transactionId:"ID transakcije",date:"Datum",amount:"Iznos",productType:"Vrsta proizvoda",status:"Status",noData:"Nema aktivnosti na računu"}};const s=()=>e("div",{class:"loader"},e("div",null),e("div",null),e("div",null),e("div",null),e("div",null),e("div",null),e("div",null),e("div",null),e("div",null),e("div",null),e("div",null),e("div",null));class l{constructor(){}static dateToFormatedString(t){return`${t.toLocaleDateString("en-gb")}, ${t.toLocaleTimeString([],{hour:"2-digit",minute:"2-digit",hour12:!1})}`}}class d{constructor(){}static format(t,e){let i=`${e} ${t}`;try{i=new Intl.NumberFormat("en-US",{style:"currency",currency:t}).format(e)}catch(t){}return i}}const c=t=>e("div",{class:"data-transaction"},e("p",null,t.productType),e("p",{class:"text-style text-style-status"},e("span",{class:t.status.toLowerCase()},t.status)),e("p",{class:"date"},t.transId," | ",l.dateToFormatedString(new Date(t.created))),e("p",{class:"text-style"},d.format(t.currency,t.realAmount)," ")),h=t=>e("div",{class:"page-size"},e("span",null,r.translate("show",t.language)),t.pageSizes.map((i=>e("button",{class:t.currentPageSize===i?"active":"",onClick:()=>t.changePageSize(i)},i)))),p=({from:t,to:i,applyFilters:a,language:o})=>{let n,s;return e("div",{class:"period"},e("div",{class:"period-content"},e("div",{class:"date-input"},e("vaadin-date-picker",{value:t,ref:t=>n=t,label:r.translate("from",o),onChange:()=>{t=n.value}})),e("span",null,e("svg",{width:"24px",viewBox:"0 0 24 24",xmlns:"http://www.w3.org/2000/svg"},e("path",{d:"m21 11.75c0-.414-.336-.75-.75-.75h-16.5c-.414 0-.75.336-.75.75s.336.75.75.75h16.5c.414 0 .75-.336.75-.75z","fill-rule":"nonzero",fill:"#5d687b"}))),e("div",{class:"date-input"},e("vaadin-date-picker",{value:i,ref:t=>s=t,label:r.translate("to",o),onChange:()=>{i=s.value}})),e("button",{class:"filter-btn",onClick:()=>a(t,i)},r.translate("filter",o))))},u=({source:t,language:i})=>{const a=[{name:r.translate("transactionId",i)},{name:r.translate("date",i)},{name:r.translate("amount",i)},{name:r.translate("productType",i)},{name:r.translate("status",i)}];return e("table",null,e("thead",null,e("tr",null,a.map((t=>e("th",null,t.name))))),e("tbody",null,t.map((t=>e("tr",null,e("td",null,t.transId),e("td",null,l.dateToFormatedString(new Date(t.created))),e("td",null,d.format(t.currency,t.realAmount)," "),e("td",null,t.productType),e("td",null,e("span",{class:t.status.toLowerCase()},t.status)))))))};function g(t,e){if(t){const i=document.createElement("style");i.innerHTML=e,t.appendChild(i)}}function b(t,e){const i=new URL(e);fetch(i.href).then((t=>t.text())).then((e=>{const i=document.createElement("style");i.innerHTML=e,t&&t.appendChild(i)})).catch((t=>{console.error("There was an error while trying to load client styling from URL",t)}))}const m=class{constructor(e){t(this,e),this.pageSizes=[10,25,50],this.pagination=null,this.endpoint=void 0,this.session=void 0,this.language=r.defaultLanguage,this.userId=void 0,this.translationUrl=void 0,this.mobile=!1,this.clientStyling=null,this.clientStylingUrl=null,this.mbSource=void 0,this.page=0,this.pageSize=this.pageSizes[0],this.showMobileFilter=!1,this.to=void 0,this.from=void 0,this.type="0",this.transactions=void 0,this.showLoader=!0}watchMultiple(){this.loadTransactions()}handleClientStylingChange(t,e){t!=e&&g(this.stylingContainer,this.clientStyling)}handleClientStylingUrlChange(t,e){t!=e&&this.clientStylingUrl&&b(this.stylingContainer,this.clientStylingUrl)}async componentWillLoad(){this.translationUrl&&await r.loadCustomTranslations(this.translationUrl),this.loadTransactions()}componentDidLoad(){this.stylingContainer&&(null!=window.emMessageBus?function(t,e){if(window.emMessageBus){const i=document.createElement("style");window.emMessageBus.subscribe(e,(e=>{i.innerHTML=e,t&&t.appendChild(i)}))}}(this.stylingContainer,`${this.mbSource}.Style`):(this.clientStyling&&g(this.stylingContainer,this.clientStyling),this.clientStylingUrl&&b(this.stylingContainer,this.clientStylingUrl)))}componentDidRender(){this.getComponentHeight()}getComponentHeight(){var t;if(this.mobile){let e=this.el.getBoundingClientRect().height-(null===(t=this.el.shadowRoot.querySelector(".table"))||void 0===t?void 0:t.getBoundingClientRect().y);this.el.style.setProperty("--heightScrollableContainer",e+"px")}}setHeightTableProperty(){let t=this.getComponentHeight();this.el.style.setProperty("--heightScrollableContainer",t+"px")}changeTransactionsType(t){this.type=t}changePageSize(t){this.pageSize=t}prev(){var t;(null===(t=this.pagination)||void 0===t?void 0:t.previous)&&this.page--}next(){var t;(null===(t=this.pagination)||void 0===t?void 0:t.next)&&this.page++}applyFilters(t,e){this.from=t?new Date(t).toISOString():null,this.to=e?new Date(e).toISOString():null,this.loadTransactions()}showFilter(){this.showMobileFilter=!this.showMobileFilter}disconnectedCallback(){this.stylingSubscription&&this.stylingSubscription.unsubscribe()}render(){var t;const i=a("../assets/filter.svg"),n=a("../assets/warning.svg");return e(o,{key:"d467e9c565084cc1cdd633e00448b3f96389ce34"},this.showLoader?e(s,null):"",e("div",{key:"e1286eeb391fa540ffa413a2ad55f8b9161c1a2d",class:"wrapper",ref:t=>this.stylingContainer=t},e("div",{key:"3482b2f6417b78c402b6499c1e80e79772e066ae",class:{"types types-mobile":this.mobile,"types types-desktop":!this.mobile}},e("button",{key:"37c9da8cd84ac3b01e0d28088999604005b22740",class:"transaction-type "+("0"===this.type?"clicked":""),onClick:()=>this.changeTransactionsType("0")},r.translate("deposit",this.language)),e("button",{key:"e6fd6057fc0adaf6741023997c870004baf8eb5d",class:"transaction-type "+("1"===this.type?"clicked":""),onClick:()=>this.changeTransactionsType("1")},r.translate("withdrawals",this.language))),this.mobile?"":e(h,{language:this.language,pageSizes:this.pageSizes,currentPageSize:this.pageSize,changePageSize:t=>this.changePageSize(t)}),this.mobile?e("button",{class:"mobile-filter-button",onClick:()=>this.showFilter()},e("ui-image",{src:i,alt:"Filter"}),r.translate("filter",this.language)):"",!this.mobile||this.showMobileFilter&&this.mobile?e(p,{language:this.language,applyFilters:(t,e)=>this.applyFilters(t,e)}):"",(null===(t=this.transactions)||void 0===t?void 0:t.length)>0?e("div",{class:"table"},this.mobile?e("div",{class:"mobile-table"},this.transactions.map((t=>e(c,Object.assign({},t))))):e(u,{source:this.transactions,language:this.language})):e("div",{class:"noData"},e("ui-image",{src:n,alt:"Warning"}),e("span",null,r.translate("noData",this.language))),e("div",{key:"f1e16d2395614016c31dd35f422ca9146c7dfdfa",class:"pagination"},e("button",{key:"be18928021e45ed4e4c3dc5fe6e3d41a51c2c95e",onClick:()=>this.prev()},"<"),e("button",{key:"3e871ad1f4aff6c8f43c93ba2f95d122c6bc8af8",onClick:()=>this.next()},">"))))}async loadTransactions(){this.showLoader=!0;try{const t=`${this.endpoint}/v1/player/${this.userId}/transactions/banking?${this.getParams()}`,e=await fetch(t,{headers:{"X-Sessionid":this.session,"Content-Type":"application/json"}});if(!e.ok){const t=await e.text();throw new Error(t)}const i=await e.json();this.pagination=i.pagination,this.transactions=i.transactions}catch(t){console.error(t)}finally{this.showLoader=!1}}getParams(){var t,e;const i=new Date,a=(this.page*this.pageSize).toString(),o=null!==(t=this.from)&&void 0!==t?t:new Date(i.getFullYear(),i.getMonth(),1).toISOString();return`offset=${a}&endDate=${null!==(e=this.to)&&void 0!==e?e:new Date(i.getFullYear(),i.getMonth()+1,0).toISOString()}&startDate=${o}&type=${this.type}&limit=${this.pageSize}`}static get assetsDirs(){return["../assets"]}get el(){return i(this)}static get watchers(){return{page:["watchMultiple"],type:["watchMultiple"],session:["watchMultiple"],userId:["watchMultiple"],pageSize:["watchMultiple"],clientStyling:["handleClientStylingChange"],clientStylingUrl:["handleClientStylingUrlChange"],showMobileFilter:["getComponentHeight"]}}};m.style=':host{--activeButtonBackground:#7ec51e;--activeButtonFont:#002149;--hoverBackground:#ffffff;--background:#e4e6e8;--success:#7ac345;--heightScrollableContainer:400px;--borderColor:#d3d3d3;--borderColorButton:#c4c4c4;--textColor:#002554;--textColorHover:#7ac345;--errorColor:#c23b21;--loaderColor:#7ac345;--headerTableBackground:#cdcdcd;--borderTable:#dedede;--shadowBorderTable:#f1f1f1;--backgroundTable:#ffffff;font-family:Roboto, Arial, sans-serif;font-size:14px;color:var(--textColor);display:block;background-color:var(--background)}:host .wrapper{height:100%;padding:1rem}:host .types{display:flex;width:100%;gap:5px}:host .transaction-type{background:inherit;font-weight:600;padding:0.6rem 1.6rem;border:1px solid #6c757d;cursor:pointer}:host .transaction-type:hover{color:var(--activeButtonBackground);border-color:var(--activeButtonBackground);background:var(--hoverBackground)}:host .clicked{background-color:var(--activeButtonBackground);border-color:var(--activeButtonBackground)}:host .types-mobile{justify-content:center;margin-bottom:15px}:host .types-desktop{justify-content:flex-end;margin-bottom:3rem}:host .page-size{display:flex;width:100%;justify-content:flex-end;align-items:center}:host .page-size button{background:transparent;border:none;cursor:pointer;margin:0.4rem;width:2rem;height:2rem}:host .page-size button:hover{color:var(--textColorHover)}:host .page-size button.active{background:var(--activeButtonBackground);color:var(--textColor);font-weight:600;border-radius:0.4rem}:host .period{display:flex;width:100%;align-items:flex-end;justify-content:center;gap:10px;background:#f0f0f0;border-bottom:2px solid #e9e9e9;padding:1.6rem 0 0;margin-bottom:4rem}@media (max-width: 801px){:host .period{margin-bottom:0;flex-direction:column;align-items:stretch;width:auto;padding:1.4rem 2.8rem;box-shadow:0 4px 5px 0 rgba(90, 90, 90, 0.24)}}:host .period .range{color:var(--errorColor)}:host .period .filter-btn{height:40px;background:transparent;border:0.1rem solid var(--borderColorButton);min-width:12rem;max-width:17rem;cursor:pointer}@media (max-width: 801px){:host .period .filter-btn{max-width:none;min-width:none;margin-top:1rem}}:host .period .filter-btn:hover{border:none;background:var(--hoverBackground)}:host .period .duet-date__input{padding:7px 60px 7px 7px}:host .period+button{padding:9px 15px}:host .period-content{display:flex;flex-direction:row;width:100%;justify-content:center;align-items:flex-end;margin:0 auto 1.6rem}@media (max-width: 801px){:host .period-content{flex-direction:column;align-items:stretch}}:host .period-content span{height:40px;display:flex;align-items:center;justify-content:center}@media (max-width: 801px){:host .period-content span{display:none}}:host .period-content .filter-btn{margin-left:60px}@media (max-width: 801px){:host .period-content .filter-btn{margin-left:0}}:host .period-content .date-input{padding:0 4px}@media (max-width: 801px){:host .period-content .date-input{width:auto}:host .period-content .date-input:first-child{margin-bottom:0.5rem}}:host .period-content .date-input label{display:inline-block;margin-bottom:0.9rem}:host .period-content .date-input input{border:0.1rem solid var(--borderColor);box-sizing:border-box;border-radius:0.2rem}:host .pagination{display:flex;width:100%;justify-content:center;margin-top:1.5rem}:host .pagination button{cursor:pointer;border:none;background-color:var(--activeButtonBackground);color:#fff;opacity:0.5;padding:7px 12px}:host .pagination button:hover{opacity:1}:host .pagination button:focus{opacity:1}:host button.active{color:var(--activeButtonFont);background-color:var(--activeButtonBackground)}.mobile-filter-button{display:flex;justify-content:center;align-items:center;width:100%;height:2.8rem;background:inherit;border:1px solid var(--borderColorButton)}.mobile-filter-button img{height:50%;margin-right:0.5rem}.noData{display:flex;align-items:center;box-shadow:0 0.4rem 0.4rem rgba(0, 0, 0, 0.25);padding:1.1rem;border-radius:0.6rem}.noData span{margin-left:0.5rem}.table{height:var(--heightScrollableContainer);overflow-y:auto}.table .mobile-table{height:100%}.data-transaction{border-bottom:1px solid var(--borderColor);background-color:var(--hoverBackground);padding:0 20px;display:grid;grid-template-columns:repeat(2, 1fr)}.data-transaction .text-style-status{font-weight:600}.data-transaction .text-style-status .success{color:var(--success)}.data-transaction .text-style-status .error{color:var(--errorColor)}.data-transaction .text-style{text-align:end}.data-transaction .date{font-size:12px;display:flex;align-items:center}.loader{display:inline-block;position:absolute;width:80px;height:80px;top:calc(50% - 40px);left:calc(50% - 40px);z-index:100}.loader::before{content:"";position:fixed;top:0;bottom:0;left:0;right:0;background-color:rgba(255, 255, 255, 0.6)}.loader div{position:absolute;width:6px;height:6px;background:var(--loaderColor);border-radius:50%;animation:loader 1.2s linear infinite}.loader div:nth-child(1){animation-delay:0s;top:37px;left:66px}.loader div:nth-child(2){animation-delay:-0.1s;top:22px;left:62px}.loader div:nth-child(3){animation-delay:-0.2s;top:11px;left:52px}.loader div:nth-child(4){animation-delay:-0.3s;top:7px;left:37px}.loader div:nth-child(5){animation-delay:-0.4s;top:11px;left:22px}.loader div:nth-child(6){animation-delay:-0.5s;top:22px;left:11px}.loader div:nth-child(7){animation-delay:-0.6s;top:37px;left:7px}.loader div:nth-child(8){animation-delay:-0.7s;top:52px;left:11px}.loader div:nth-child(9){animation-delay:-0.8s;top:62px;left:22px}.loader div:nth-child(10){animation-delay:-0.9s;top:66px;left:37px}.loader div:nth-child(11){animation-delay:-1s;top:62px;left:52px}.loader div:nth-child(12){animation-delay:-1.1s;top:52px;left:62px}@keyframes loader{0%,20%,80%,100%{transform:scale(1)}50%{transform:scale(1.5)}}.table thead th{position:sticky;top:0}table{border-collapse:collapse;width:100%}table th{padding:14px 24px;text-align:left;font-weight:600;color:var(--textColor);background:var(--headerTableBackground)}table td{padding:1rem 1.7rem;box-shadow:0 -1px 0 0 var(--shadowBorderTable) inset;border-bottom:0.1rem solid var(--borderTable);text-align:left;color:var(--textColor)}table tbody{background:var(--backgroundTable)}table .success{color:var(--success)}table .error{color:var(--errorColor)}vaadin-date-picker{min-width:320px}@media (max-width: 1261px){vaadin-date-picker{width:auto;min-width:auto}}@media (max-width: 801px){vaadin-date-picker{width:100%}}';export{n as ui_image,m as user_transaction_history}

package/dist/user-transaction-history/{p-437ed177.js → p-d0caa719.js}

@@ -1,2 +1,2 @@
 var e=Object.defineProperty,t=new WeakMap,n=e=>t.get(e),l=(e,n)=>t.set(n.t=e,n),o=(e,t)=>t in e,s=(e,t)=>(0,console.error)(e,t),r=new Map,i=new Map,c="slot-fb{display:contents}slot-fb[hidden]{display:none}",u="http://www.w3.org/1999/xlink",a="undefined"!=typeof window?window:{},f=a.document||{head:{}},h={l:0,o:"",jmp:e=>e(),raf:e=>requestAnimationFrame(e),ael:(e,t,n,l)=>e.addEventListener(t,n,l),rel:(e,t,n,l)=>e.removeEventListener(t,n,l),ce:(e,t)=>new CustomEvent(e,t)},p=e=>Promise.resolve(e),d=(()=>{try{return new CSSStyleSheet,"function"==typeof(new CSSStyleSheet).replaceSync}catch(e){}return!1})(),m=!1,y=[],v=[],w=(e,t)=>n=>{e.push(n),m||(m=!0,t&&4&h.l?g(b):h.raf(b))},$=e=>{for(let t=0;t<e.length;t++)try{e[t](performance.now())}catch(e){s(e)}e.length=0},b=()=>{$(y),$(v),(m=y.length>0)&&h.raf(b)},g=e=>p().then(e),S=w(v,!0),j=e=>{const t=new URL(e,h.o);return t.origin!==a.location.origin?t.href:t.pathname},k={},O=e=>"object"==(e=typeof e)||"function"===e;function E(e){var t,n,l;return null!=(l=null==(n=null==(t=e.head)?void 0:t.querySelector('meta[name="csp-nonce"]'))?void 0:n.getAttribute("content"))?l:void 0}((t,n)=>{for(var l in n)e(t,l,{get:n[l],enumerable:!0})})({},{err:()=>C,map:()=>M,ok:()=>x,unwrap:()=>L,unwrapErr:()=>T});var x=e=>({isOk:!0,isErr:!1,value:e}),C=e=>({isOk:!1,isErr:!0,value:e});function M(e,t){if(e.isOk){const n=t(e.value);return n instanceof Promise?n.then((e=>x(e))):x(n)}if(e.isErr)return C(e.value);throw"should never get here"}var P,R,L=e=>{if(e.isOk)return e.value;throw e.value},T=e=>{if(e.isErr)return e.value;throw e.value},U=(e,t,...n)=>{let l=null,o=null,s=!1,r=!1;const i=[],c=t=>{for(let n=0;n<t.length;n++)l=t[n],Array.isArray(l)?c(l):null!=l&&"boolean"!=typeof l&&((s="function"!=typeof e&&!O(l))&&(l+=""),s&&r?i[i.length-1].i+=l:i.push(s?A(null,l):l),r=s)};if(c(n),t){t.key&&(o=t.key);{const e=t.className||t.class;e&&(t.class="object"!=typeof e?e:Object.keys(e).filter((t=>e[t])).join(" "))}}if("function"==typeof e)return e(null===t?{}:t,i,H);const u=A(e,null);return u.u=t,i.length>0&&(u.h=i),u.p=o,u},A=(e,t)=>({l:0,m:e,i:t,v:null,h:null,u:null,p:null}),D={},H={forEach:(e,t)=>e.map(N).forEach(t),map:(e,t)=>e.map(N).map(t).map(W)},N=e=>({vattrs:e.u,vchildren:e.h,vkey:e.p,vname:e.$,vtag:e.m,vtext:e.i}),W=e=>{if("function"==typeof e.vtag){const t={...e.vattrs};return e.vkey&&(t.key=e.vkey),e.vname&&(t.name=e.vname),U(e.vtag,t,...e.vchildren||[])}const t=A(e.vtag,e.vtext);return t.u=e.vattrs,t.h=e.vchildren,t.p=e.vkey,t.$=e.vname,t},F=e=>n(e).$hostElement$,q=new WeakMap,G=e=>"sc-"+e.S,V=(e,t,n,l,s,r)=>{if(n!==l){let i=o(e,t),c=t.toLowerCase();if("class"===t){const t=e.classList,o=z(n),s=z(l);t.remove(...o.filter((e=>e&&!s.includes(e)))),t.add(...s.filter((e=>e&&!o.includes(e))))}else if("style"===t){for(const t in n)l&&null!=l[t]||(t.includes("-")?e.style.removeProperty(t):e.style[t]="");for(const t in l)n&&l[t]===n[t]||(t.includes("-")?e.style.setProperty(t,l[t]):e.style[t]=l[t])}else if("key"===t);else if("ref"===t)l&&l(e);else if(i||"o"!==t[0]||"n"!==t[1]){const o=O(l);if((i||o&&null!==l)&&!s)try{if(e.tagName.includes("-"))e[t]=l;else{const o=null==l?"":l;"list"===t?i=!1:null!=n&&e[t]==o||(e[t]=o)}}catch(e){}let a=!1;c!==(c=c.replace(/^xlink\:?/,""))&&(t=c,a=!0),null==l||!1===l?!1===l&&""!==e.getAttribute(t)||(a?e.removeAttributeNS(u,t):e.removeAttribute(t)):(!i||4&r||s)&&!o&&(l=!0===l?"":l,a?e.setAttributeNS(u,t,l):e.setAttribute(t,l))}else if(t="-"===t[2]?t.slice(3):o(a,c)?c.slice(2):c[2]+t.slice(3),n||l){const o=t.endsWith(B);t=t.replace(I,""),n&&h.rel(e,t,n,o),l&&h.ael(e,t,l,o)}}},_=/\s/,z=e=>e?e.split(_):[],B="Capture",I=RegExp(B+"$"),J=(e,t,n)=>{const l=11===t.v.nodeType&&t.v.host?t.v.host:t.v,o=e&&e.u||k,s=t.u||k;for(const e of K(Object.keys(o)))e in s||V(l,e,o[e],void 0,n,t.l);for(const e of K(Object.keys(s)))V(l,e,o[e],s[e],n,t.l)};function K(e){return e.includes("ref")?[...e.filter((e=>"ref"!==e)),"ref"]:e}var Q=!1,X=(e,t,n)=>{const l=t.h[n];let o,s,r=0;if(null!==l.i)o=l.v=f.createTextNode(l.i);else{if(Q||(Q="svg"===l.m),o=l.v=f.createElementNS(Q?"http://www.w3.org/2000/svg":"http://www.w3.org/1999/xhtml",l.m),Q&&"foreignObject"===l.m&&(Q=!1),J(null,l,Q),null!=P&&o["s-si"]!==P&&o.classList.add(o["s-si"]=P),l.h)for(r=0;r<l.h.length;++r)s=X(e,l,r),s&&o.appendChild(s);"svg"===l.m?Q=!1:"foreignObject"===o.tagName&&(Q=!0)}return o["s-hn"]=R,o},Y=(e,t,n,l,o,s)=>{let r,i=e;for(i.shadowRoot&&i.tagName===R&&(i=i.shadowRoot);o<=s;++o)l[o]&&(r=X(null,n,o),r&&(l[o].v=r,le(i,r,t)))},Z=(e,t,n)=>{for(let l=t;l<=n;++l){const t=e[l];if(t){const e=t.v;ne(t),e&&e.remove()}}},ee=(e,t,n=!1)=>e.m===t.m&&(!!n||e.p===t.p),te=(e,t,n=!1)=>{const l=t.v=e.v,o=e.h,s=t.h,r=t.m,i=t.i;null===i?(J(e,t,Q="svg"===r||"foreignObject"!==r&&Q),null!==o&&null!==s?((e,t,n,l,o=!1)=>{let s,r,i=0,c=0,u=0,a=0,f=t.length-1,h=t[0],p=t[f],d=l.length-1,m=l[0],y=l[d];for(;i<=f&&c<=d;)if(null==h)h=t[++i];else if(null==p)p=t[--f];else if(null==m)m=l[++c];else if(null==y)y=l[--d];else if(ee(h,m,o))te(h,m,o),h=t[++i],m=l[++c];else if(ee(p,y,o))te(p,y,o),p=t[--f],y=l[--d];else if(ee(h,y,o))te(h,y,o),le(e,h.v,p.v.nextSibling),h=t[++i],y=l[--d];else if(ee(p,m,o))te(p,m,o),le(e,p.v,h.v),p=t[--f],m=l[++c];else{for(u=-1,a=i;a<=f;++a)if(t[a]&&null!==t[a].p&&t[a].p===m.p){u=a;break}u>=0?(r=t[u],r.m!==m.m?s=X(t&&t[c],n,u):(te(r,m,o),t[u]=void 0,s=r.v),m=l[++c]):(s=X(t&&t[c],n,c),m=l[++c]),s&&le(h.v.parentNode,s,h.v)}i>f?Y(e,null==l[d+1]?null:l[d+1].v,n,l,c,d):c>d&&Z(t,i,f)})(l,o,t,s,n):null!==s?(null!==e.i&&(l.textContent=""),Y(l,null,t,s,0,s.length-1)):null!==o&&Z(o,0,o.length-1),Q&&"svg"===r&&(Q=!1)):e.i!==i&&(l.data=i)},ne=e=>{e.u&&e.u.ref&&e.u.ref(null),e.h&&e.h.map(ne)},le=(e,t,n)=>null==e?void 0:e.insertBefore(t,n),oe=(e,t)=>{t&&!e.j&&t["s-p"]&&t["s-p"].push(new Promise((t=>e.j=t)))},se=(e,t)=>{if(e.l|=16,!(4&e.l))return oe(e,e.k),S((()=>re(e,t)));e.l|=512},re=(e,t)=>{const n=e.t;if(!n)throw Error(`Can't render component <${e.$hostElement$.tagName.toLowerCase()} /> with invalid Stencil runtime! Make sure this imported component is compiled with a \`externalRuntime: true\` flag. For more information, please refer to https://stenciljs.com/docs/custom-elements#externalruntime`);let l;return t&&(e.l|=256,e.O&&(e.O.map((([e,t])=>pe(n,e,t))),e.O=void 0),l=pe(n,"componentWillLoad")),ie(l,(()=>ue(e,n,t)))},ie=(e,t)=>ce(e)?e.then(t).catch((e=>{console.error(e),t()})):t(),ce=e=>e instanceof Promise||e&&e.then&&"function"==typeof e.then,ue=async(e,t,n)=>{var l;const o=e.$hostElement$,s=o["s-rc"];n&&(e=>{const t=e.C,n=e.$hostElement$,l=t.l,o=((e,t)=>{var n;const l=G(t),o=i.get(l);if(e=11===e.nodeType?e:f,o)if("string"==typeof o){let s,r=q.get(e=e.head||e);if(r||q.set(e,r=new Set),!r.has(l)){{s=f.createElement("style"),s.innerHTML=o;const t=null!=(n=h.M)?n:E(f);null!=t&&s.setAttribute("nonce",t),e.insertBefore(s,e.querySelector("link"))}4&t.l&&(s.innerHTML+=c),r&&r.add(l)}}else e.adoptedStyleSheets.includes(o)||(e.adoptedStyleSheets=[...e.adoptedStyleSheets,o]);return l})(n.shadowRoot?n.shadowRoot:n.getRootNode(),t);10&l&&(n["s-sc"]=o,n.classList.add(o+"-h"))})(e);ae(e,t,o,n),s&&(s.map((e=>e())),o["s-rc"]=void 0);{const t=null!=(l=o["s-p"])?l:[],n=()=>fe(e);0===t.length?n():(Promise.all(t).then(n),e.l|=4,t.length=0)}},ae=(e,t,n,l)=>{try{t=t.render(),e.l&=-17,e.l|=2,((e,t,n=!1)=>{const l=e.$hostElement$,o=e.C,s=e.P||A(null,null),r=(e=>e&&e.m===D)(t)?t:U(null,null,t);if(R=l.tagName,o.R&&(r.u=r.u||{},o.R.map((([e,t])=>r.u[t]=l[e]))),n&&r.u)for(const e of Object.keys(r.u))l.hasAttribute(e)&&!["key","ref","style","class"].includes(e)&&(r.u[e]=l[e]);r.m=null,r.l|=4,e.P=r,r.v=s.v=l.shadowRoot||l,P=l["s-sc"],te(s,r,n)})(e,t,l)}catch(t){s(t,e.$hostElement$)}return null},fe=e=>{const t=e.$hostElement$,n=e.t,l=e.k;pe(n,"componentDidRender"),64&e.l||(e.l|=64,de(t),pe(n,"componentDidLoad"),e.L(t),l||he()),e.j&&(e.j(),e.j=void 0),512&e.l&&g((()=>se(e,!1))),e.l&=-517},he=()=>{de(f.documentElement),g((()=>(e=>{const t=h.ce("appload",{detail:{namespace:"user-transaction-history"}});return e.dispatchEvent(t),t})(a)))},pe=(e,t,n)=>{if(e&&e[t])try{return e[t](n)}catch(e){s(e)}},de=e=>e.classList.add("hydrated"),me=(e,t,l)=>{var o,r;const i=e.prototype;if(t.T||t.U||e.watchers){e.watchers&&!t.U&&(t.U=e.watchers);const c=Object.entries(null!=(o=t.T)?o:{});if(c.map((([e,[o]])=>{(31&o||2&l&&32&o)&&Object.defineProperty(i,e,{get(){return((e,t)=>n(this).A.get(t))(0,e)},set(l){((e,t,l,o)=>{const r=n(e);if(!r)throw Error(`Couldn't find host element for "${o.S}" as it is unknown to this Stencil runtime. This usually happens when integrating a 3rd party Stencil component with another Stencil component or application. Please reach out to the maintainers of the 3rd party Stencil component or report this on the Stencil Discord server (https://chat.stenciljs.com) or comment on this similar [GitHub issue](https://github.com/ionic-team/stencil/issues/5457).`);const i=r.$hostElement$,c=r.A.get(t),u=r.l,a=r.t;if(l=((e,t)=>null==e||O(e)?e:4&t?"false"!==e&&(""===e||!!e):1&t?e+"":e)(l,o.T[t][0]),(!(8&u)||void 0===c)&&l!==c&&(!Number.isNaN(c)||!Number.isNaN(l))&&(r.A.set(t,l),a)){if(o.U&&128&u){const e=o.U[t];e&&e.map((e=>{try{a[e](l,c,t)}catch(e){s(e,i)}}))}2==(18&u)&&se(r,!1)}})(this,e,l,t)},configurable:!0,enumerable:!0})})),1&l){const l=new Map;i.attributeChangedCallback=function(e,o,s){h.jmp((()=>{var r;const c=l.get(e);if(this.hasOwnProperty(c))s=this[c],delete this[c];else{if(i.hasOwnProperty(c)&&"number"==typeof this[c]&&this[c]==s)return;if(null==c){const l=n(this),i=null==l?void 0:l.l;if(i&&!(8&i)&&128&i&&s!==o){const n=l.t,i=null==(r=t.U)?void 0:r[e];null==i||i.forEach((t=>{null!=n[t]&&n[t].call(n,s,o,e)}))}return}}this[c]=(null!==s||"boolean"!=typeof this[c])&&s}))},e.observedAttributes=Array.from(new Set([...Object.keys(null!=(r=t.U)?r:{}),...c.filter((([e,t])=>15&t[0])).map((([e,n])=>{var o;const s=n[1]||e;return l.set(s,e),512&n[0]&&(null==(o=t.R)||o.push([e,s])),s}))]))}}return e},ye=e=>{pe(e,"disconnectedCallback")},ve=(e,l={})=>{var o;const u=[],p=l.exclude||[],m=a.customElements,y=f.head,v=y.querySelector("meta[charset]"),w=f.createElement("style"),$=[];let b,g=!0;Object.assign(h,l),h.o=new URL(l.resourcesUrl||"./",f.baseURI).href;let S=!1;if(e.map((e=>{e[1].map((l=>{var o;const c={l:l[0],S:l[1],T:l[2],D:l[3]};4&c.l&&(S=!0),c.T=l[2],c.D=l[3],c.R=[],c.U=null!=(o=l[4])?o:{};const a=c.S,f=class extends HTMLElement{constructor(e){if(super(e),this.hasRegisteredEventListeners=!1,((e,n)=>{const l={l:0,$hostElement$:e,C:n,A:new Map};l.H=new Promise((e=>l.L=e)),e["s-p"]=[],e["s-rc"]=[],t.set(e,l)})(e=this,c),1&c.l)if(e.shadowRoot){if("open"!==e.shadowRoot.mode)throw Error(`Unable to re-use existing shadow root for ${c.S}! Mode is set to ${e.shadowRoot.mode} but Stencil only supports open shadow roots.`)}else e.attachShadow({mode:"open"})}connectedCallback(){const e=n(this);this.hasRegisteredEventListeners||(this.hasRegisteredEventListeners=!0,we(this,e,c.D)),b&&(clearTimeout(b),b=null),g?$.push(this):h.jmp((()=>(e=>{if(!(1&h.l)){const t=n(e),l=t.C,o=()=>{};if(1&t.l)we(e,t,l.D),(null==t?void 0:t.t)||(null==t?void 0:t.H)&&t.H.then((()=>{}));else{t.l|=1;{let n=e;for(;n=n.parentNode||n.host;)if(n["s-p"]){oe(t,t.k=n);break}}l.T&&Object.entries(l.T).map((([t,[n]])=>{if(31&n&&e.hasOwnProperty(t)){const n=e[t];delete e[t],e[t]=n}})),(async(e,t,n)=>{let l;if(!(32&t.l)){if(t.l|=32,n.N){const e=(e=>{const t=e.S.replace(/-/g,"_"),n=e.N;if(!n)return;const l=r.get(n);return l?l[t]:import(`./${n}.entry.js`).then((e=>(r.set(n,e),e[t])),s)
-/*!__STENCIL_STATIC_IMPORT_SWITCH__*/})(n);if(e&&"then"in e){const t=()=>{};l=await e,t()}else l=e;if(!l)throw Error(`Constructor for "${n.S}#${t.W}" was not found`);l.isProxied||(n.U=l.watchers,me(l,n,2),l.isProxied=!0);const o=()=>{};t.l|=8;try{new l(t)}catch(e){s(e)}t.l&=-9,t.l|=128,o()}else l=e.constructor,customElements.whenDefined(e.localName).then((()=>t.l|=128));if(l&&l.style){let e;"string"==typeof l.style&&(e=l.style);const t=G(n);if(!i.has(t)){const l=()=>{};((e,t,n)=>{let l=i.get(e);d&&n?(l=l||new CSSStyleSheet,"string"==typeof l?l=t:l.replaceSync(t)):l=t,i.set(e,l)})(t,e,!!(1&n.l)),l()}}}const o=t.k,c=()=>se(t,!0);o&&o["s-rc"]?o["s-rc"].push(c):c()})(e,t,l)}o()}})(this)))}disconnectedCallback(){h.jmp((()=>(async()=>{if(!(1&h.l)){const e=n(this);e.F&&(e.F.map((e=>e())),e.F=void 0),(null==e?void 0:e.t)?ye(e.t):(null==e?void 0:e.H)&&e.H.then((()=>ye(e.t)))}})()))}componentOnReady(){return n(this).H}};c.N=e[0],p.includes(a)||m.get(a)||(u.push(a),m.define(a,me(f,c,1)))}))})),u.length>0&&(S&&(w.textContent+=c),w.textContent+=u.sort()+"{visibility:hidden}.hydrated{visibility:inherit}",w.innerHTML.length)){w.setAttribute("data-styles","");const e=null!=(o=h.M)?o:E(f);null!=e&&w.setAttribute("nonce",e),y.insertBefore(w,v?v.nextSibling:y.firstChild)}g=!1,$.length?$.map((e=>e.connectedCallback())):h.jmp((()=>b=setTimeout(he,30)))},we=(e,t,n)=>{n&&n.map((([n,l,o])=>{const s=be(e,n),r=$e(t,o),i=ge(n);h.ael(s,l,r,i),(t.F=t.F||[]).push((()=>h.rel(s,l,r,i)))}))},$e=(e,t)=>n=>{var l;try{256&e.l?null==(l=e.t)||l[t](n):(e.O=e.O||[]).push([t,n])}catch(e){s(e)}},be=(e,t)=>8&t?a:e,ge=e=>({passive:!!(1&e),capture:!!(2&e)}),Se=e=>h.M=e;export{D as H,F as a,ve as b,j as g,U as h,p,l as r,Se as s}
+/*!__STENCIL_STATIC_IMPORT_SWITCH__*/})(n);if(e&&"then"in e){const t=()=>{};l=await e,t()}else l=e;if(!l)throw Error(`Constructor for "${n.S}#${t.W}" was not found`);l.isProxied||(n.U=l.watchers,me(l,n,2),l.isProxied=!0);const o=()=>{};t.l|=8;try{new l(t)}catch(e){s(e)}t.l&=-9,t.l|=128,o()}else l=e.constructor,customElements.whenDefined(e.localName).then((()=>t.l|=128));if(l&&l.style){let e;"string"==typeof l.style&&(e=l.style);const t=G(n);if(!i.has(t)){const l=()=>{};((e,t,n)=>{let l=i.get(e);d&&n?(l=l||new CSSStyleSheet,"string"==typeof l?l=t:l.replaceSync(t)):l=t,i.set(e,l)})(t,e,!!(1&n.l)),l()}}}const o=t.k,c=()=>se(t,!0);o&&o["s-rc"]?o["s-rc"].push(c):c()})(e,t,l)}o()}})(this)))}disconnectedCallback(){h.jmp((()=>(async()=>{if(!(1&h.l)){const e=n(this);e.F&&(e.F.map((e=>e())),e.F=void 0),(null==e?void 0:e.t)?ye(e.t):(null==e?void 0:e.H)&&e.H.then((()=>ye(e.t)))}})()))}componentOnReady(){return n(this).H}};c.N=e[0],p.includes(a)||m.get(a)||(u.push(a),m.define(a,me(f,c,1)))}))})),u.length>0&&(S&&(w.textContent+=c),w.textContent+=u.sort()+"{visibility:hidden}.hydrated{visibility:inherit}",w.innerHTML.length)){w.setAttribute("data-styles","");const e=null!=(o=h.M)?o:E(f);null!=e&&w.setAttribute("nonce",e),y.insertBefore(w,v?v.nextSibling:y.firstChild)}g=!1,$.length?$.map((e=>e.connectedCallback())):h.jmp((()=>b=setTimeout(he,30)))},we=(e,t,n)=>{n&&n.map((([n,l,o])=>{const s=be(e,n),r=$e(t,o),i=ge(n);h.ael(s,l,r,i),(t.F=t.F||[]).push((()=>h.rel(s,l,r,i)))}))},$e=(e,t)=>n=>{var l;try{256&e.l?null==(l=e.t)||l[t](n):(e.O=e.O||[]).push([t,n])}catch(e){s(e)}},be=(e,t)=>8&t?a:e,ge=e=>({passive:!!(1&e),capture:!!(2&e)}),Se=e=>h.M=e;export{D as H,j as a,ve as b,F as g,U as h,p,l as r,Se as s}

package/dist/user-transaction-history/user-transaction-history.esm.js

@@ -1 +1 @@
-import{p as e,b as t}from"./p-437ed177.js";export{s as setNonce}from"./p-437ed177.js";import{g as i}from"./p-e1255160.js";(()=>{const t=import.meta.url,i={};return""!==t&&(i.resourcesUrl=new URL(".",t).href),e(i)})().then((async e=>(await i(),t([["p-a465efd0",[[1,"user-transaction-history",{endpoint:[513],session:[513],language:[513],userId:[513,"user-id"],translationUrl:[513,"translation-url"],mobile:[516],clientStyling:[513,"client-styling"],clientStylingUrl:[513,"client-styling-url"],mbSource:[513,"mb-source"],page:[32],pageSize:[32],showMobileFilter:[32],to:[32],from:[32],type:[32],transactions:[32],showLoader:[32]},[[9,"resize","getComponentHeight"]],{page:["watchMultiple"],type:["watchMultiple"],session:["watchMultiple"],userId:["watchMultiple"],pageSize:["watchMultiple"],clientStyling:["handleClientStylingChange"],clientStylingUrl:["handleClientStylingUrlChange"],showMobileFilter:["getComponentHeight"]}]]]],e))));
+import{p as e,b as t}from"./p-d0caa719.js";export{s as setNonce}from"./p-d0caa719.js";import{g as i}from"./p-e1255160.js";(()=>{const t=import.meta.url,i={};return""!==t&&(i.resourcesUrl=new URL(".",t).href),e(i)})().then((async e=>(await i(),t([["p-6df80ecb",[[1,"user-transaction-history",{endpoint:[513],session:[513],language:[513],userId:[513,"user-id"],translationUrl:[513,"translation-url"],mobile:[516],clientStyling:[513,"client-styling"],clientStylingUrl:[513,"client-styling-url"],mbSource:[513,"mb-source"],page:[32],pageSize:[32],showMobileFilter:[32],to:[32],from:[32],type:[32],transactions:[32],showLoader:[32]},[[9,"resize","getComponentHeight"]],{page:["watchMultiple"],type:["watchMultiple"],session:["watchMultiple"],userId:["watchMultiple"],pageSize:["watchMultiple"],clientStyling:["handleClientStylingChange"],clientStylingUrl:["handleClientStylingUrlChange"],showMobileFilter:["getComponentHeight"]}],[0,"ui-image",{src:[1],width:[1],height:[1],alt:[1],imgClass:[1,"img-class"],styles:[8],detectDistance:[1,"detect-distance"],imgLoaded:[32],shouldLoad:[32]},null,{src:["handleSrc"]}]]]],e))));

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@everymatrix/user-transaction-history",
-  "version": "1.60.2",
+  "version": "1.61.0",
   "main": "./dist/index.cjs.js",
   "module": "./dist/index.js",
   "es2015": "./dist/esm/index.mjs",

package/dist/user-transaction-history/p-a465efd0.entry.js

@@ -1 +0,0 @@
-import{h as t,r as e,g as a,H as i,a as o}from"./p-437ed177.js";class n{constructor(){}static async loadCustomTranslations(t){try{const e=await fetch(t,{headers:{"Content-Type":"application/json"}});if(!e.ok){const t=await e.text();throw new Error(t)}const a=await e.json();n.updateTranslations(a)}catch(e){console.error(`Failed to load translations ${t}. ${e.message}`)}}static translate(t,e){var a,i;const o=n.getAvaliableLanguages(e);return(null===(i=null===(a=n.customTranslation)||void 0===a?void 0:a[o.customLanguage])||void 0===i?void 0:i[t])||n.defaultTranslation[o.predefinedLanguage][t]}static getAvaliableLanguages(t){var e;const a=(null===(e=n.customLanguages)||void 0===e?void 0:e.includes(t))?t:n.defaultLanguage;return{predefinedLanguage:n.supportedLanguages.includes(t)?t:n.defaultLanguage,customLanguage:a}}static updateTranslations(t){n.customLanguages=Array.from(new Set([...n.supportedLanguages,...Object.keys(t).map((t=>t.toLowerCase()))])),n.customTranslation=t}}n.defaultLanguage="en",n.supportedLanguages=["en"],n.defaultTranslation={en:{deposit:"Deposit",withdrawals:"Withdrawals",show:"Show",from:"From",to:"To",filter:"Filter",transactionId:"Transaction ID",date:"Date",amount:"Amount",productType:"Product Type",status:"Status",noData:"There are no account activities"},hr:{deposit:"Uplate",withdrawals:"Isplate",show:"Prikaži",from:"Od",to:"Do",filter:"Filter",transactionId:"ID transakcije",date:"Datum",amount:"Iznos",productType:"Vrsta proizvoda",status:"Status",noData:"Nema aktivnosti na računu"}};const r=()=>t("div",{class:"loader"},t("div",null),t("div",null),t("div",null),t("div",null),t("div",null),t("div",null),t("div",null),t("div",null),t("div",null),t("div",null),t("div",null),t("div",null));class s{constructor(){}static dateToFormatedString(t){return`${t.toLocaleDateString("en-gb")}, ${t.toLocaleTimeString([],{hour:"2-digit",minute:"2-digit",hour12:!1})}`}}class l{constructor(){}static format(t,e){let a=`${e} ${t}`;try{a=new Intl.NumberFormat("en-US",{style:"currency",currency:t}).format(e)}catch(t){}return a}}const d=e=>t("div",{class:"data-transaction"},t("p",null,e.productType),t("p",{class:"text-style text-style-status"},t("span",{class:e.status.toLowerCase()},e.status)),t("p",{class:"date"},e.transId," | ",s.dateToFormatedString(new Date(e.created))),t("p",{class:"text-style"},l.format(e.currency,e.realAmount)," ")),c=e=>t("div",{class:"page-size"},t("span",null,n.translate("show",e.language)),e.pageSizes.map((a=>t("button",{class:e.currentPageSize===a?"active":"",onClick:()=>e.changePageSize(a)},a)))),h=({from:e,to:a,applyFilters:i,language:o})=>{let r,s;return t("div",{class:"period"},t("div",{class:"period-content"},t("div",{class:"date-input"},t("vaadin-date-picker",{value:e,ref:t=>r=t,label:n.translate("from",o),onChange:()=>{e=r.value}})),t("span",null,t("svg",{width:"24px",viewBox:"0 0 24 24",xmlns:"http://www.w3.org/2000/svg"},t("path",{d:"m21 11.75c0-.414-.336-.75-.75-.75h-16.5c-.414 0-.75.336-.75.75s.336.75.75.75h16.5c.414 0 .75-.336.75-.75z","fill-rule":"nonzero",fill:"#5d687b"}))),t("div",{class:"date-input"},t("vaadin-date-picker",{value:a,ref:t=>s=t,label:n.translate("to",o),onChange:()=>{a=s.value}})),t("button",{class:"filter-btn",onClick:()=>i(e,a)},n.translate("filter",o))))},p=({source:e,language:a})=>{const i=[{name:n.translate("transactionId",a)},{name:n.translate("date",a)},{name:n.translate("amount",a)},{name:n.translate("productType",a)},{name:n.translate("status",a)}];return t("table",null,t("thead",null,t("tr",null,i.map((e=>t("th",null,e.name))))),t("tbody",null,e.map((e=>t("tr",null,t("td",null,e.transId),t("td",null,s.dateToFormatedString(new Date(e.created))),t("td",null,l.format(e.currency,e.realAmount)," "),t("td",null,e.productType),t("td",null,t("span",{class:e.status.toLowerCase()},e.status)))))))};function u(t,e){if(t){const a=document.createElement("style");a.innerHTML=e,t.appendChild(a)}}function g(t,e){const a=new URL(e);fetch(a.href).then((t=>t.text())).then((e=>{const a=document.createElement("style");a.innerHTML=e,t&&t.appendChild(a)})).catch((t=>{console.error("There was an error while trying to load client styling from URL",t)}))}const b=class{constructor(t){e(this,t),this.pageSizes=[10,25,50],this.pagination=null,this.endpoint=void 0,this.session=void 0,this.language=n.defaultLanguage,this.userId=void 0,this.translationUrl=void 0,this.mobile=!1,this.clientStyling=null,this.clientStylingUrl=null,this.mbSource=void 0,this.page=0,this.pageSize=this.pageSizes[0],this.showMobileFilter=!1,this.to=void 0,this.from=void 0,this.type="0",this.transactions=void 0,this.showLoader=!0}watchMultiple(){this.loadTransactions()}handleClientStylingChange(t,e){t!=e&&u(this.stylingContainer,this.clientStyling)}handleClientStylingUrlChange(t,e){t!=e&&this.clientStylingUrl&&g(this.stylingContainer,this.clientStylingUrl)}async componentWillLoad(){this.translationUrl&&await n.loadCustomTranslations(this.translationUrl),this.loadTransactions()}componentDidLoad(){this.stylingContainer&&(null!=window.emMessageBus?function(t,e){if(window.emMessageBus){const a=document.createElement("style");window.emMessageBus.subscribe(e,(e=>{a.innerHTML=e,t&&t.appendChild(a)}))}}(this.stylingContainer,`${this.mbSource}.Style`):(this.clientStyling&&u(this.stylingContainer,this.clientStyling),this.clientStylingUrl&&g(this.stylingContainer,this.clientStylingUrl)))}componentDidRender(){this.getComponentHeight()}getComponentHeight(){var t;if(this.mobile){let e=this.el.getBoundingClientRect().height-(null===(t=this.el.shadowRoot.querySelector(".table"))||void 0===t?void 0:t.getBoundingClientRect().y);this.el.style.setProperty("--heightScrollableContainer",e+"px")}}setHeightTableProperty(){let t=this.getComponentHeight();this.el.style.setProperty("--heightScrollableContainer",t+"px")}changeTransactionsType(t){this.type=t}changePageSize(t){this.pageSize=t}prev(){var t;(null===(t=this.pagination)||void 0===t?void 0:t.previous)&&this.page--}next(){var t;(null===(t=this.pagination)||void 0===t?void 0:t.next)&&this.page++}applyFilters(t,e){this.from=t?new Date(t).toISOString():null,this.to=e?new Date(e).toISOString():null,this.loadTransactions()}showFilter(){this.showMobileFilter=!this.showMobileFilter}disconnectedCallback(){this.stylingSubscription&&this.stylingSubscription.unsubscribe()}render(){var e;const o=a("../assets/filter.svg"),s=a("../assets/warning.svg");return t(i,{key:"8d6470d73afff5dbc8a8c3a1a47426223971ad47"},this.showLoader?t(r,null):"",t("div",{key:"8c32d9425b701747559ea1e63a3b2c4bb31780ab",class:"wrapper",ref:t=>this.stylingContainer=t},t("div",{key:"b2a9216bfcfa5950c174f6e06a179e2ae3790f6b",class:{"types types-mobile":this.mobile,"types types-desktop":!this.mobile}},t("button",{key:"e2ce33fe2ab27abab68bd721b8b945bde5d672ac",class:"transaction-type "+("0"===this.type?"clicked":""),onClick:()=>this.changeTransactionsType("0")},n.translate("deposit",this.language)),t("button",{key:"6d80bef56bf4ec590cc2e4aa704f930a47b29f3c",class:"transaction-type "+("1"===this.type?"clicked":""),onClick:()=>this.changeTransactionsType("1")},n.translate("withdrawals",this.language))),this.mobile?"":t(c,{language:this.language,pageSizes:this.pageSizes,currentPageSize:this.pageSize,changePageSize:t=>this.changePageSize(t)}),this.mobile?t("button",{class:"mobile-filter-button",onClick:()=>this.showFilter()},t("img",{src:o,alt:"Filter"}),n.translate("filter",this.language)):"",!this.mobile||this.showMobileFilter&&this.mobile?t(h,{language:this.language,applyFilters:(t,e)=>this.applyFilters(t,e)}):"",(null===(e=this.transactions)||void 0===e?void 0:e.length)>0?t("div",{class:"table"},this.mobile?t("div",{class:"mobile-table"},this.transactions.map((e=>t(d,Object.assign({},e))))):t(p,{source:this.transactions,language:this.language})):t("div",{class:"noData"},t("img",{src:s,alt:"Warning"}),t("span",null,n.translate("noData",this.language))),t("div",{key:"9b7950ed91c4795f4355ce406d7cba40c46c0184",class:"pagination"},t("button",{key:"bc7b2bce0a21763fc5a10d2249b74c2d9805d3b5",onClick:()=>this.prev()},"<"),t("button",{key:"69210c5b101a24563babdbe6b3361d091afc2cc0",onClick:()=>this.next()},">"))))}async loadTransactions(){this.showLoader=!0;try{const t=`${this.endpoint}/v1/player/${this.userId}/transactions/banking?${this.getParams()}`,e=await fetch(t,{headers:{"X-Sessionid":this.session,"Content-Type":"application/json"}});if(!e.ok){const t=await e.text();throw new Error(t)}const a=await e.json();this.pagination=a.pagination,this.transactions=a.transactions}catch(t){console.error(t)}finally{this.showLoader=!1}}getParams(){var t,e;const a=new Date,i=(this.page*this.pageSize).toString(),o=null!==(t=this.from)&&void 0!==t?t:new Date(a.getFullYear(),a.getMonth(),1).toISOString();return`offset=${i}&endDate=${null!==(e=this.to)&&void 0!==e?e:new Date(a.getFullYear(),a.getMonth()+1,0).toISOString()}&startDate=${o}&type=${this.type}&limit=${this.pageSize}`}static get assetsDirs(){return["../assets"]}get el(){return o(this)}static get watchers(){return{page:["watchMultiple"],type:["watchMultiple"],session:["watchMultiple"],userId:["watchMultiple"],pageSize:["watchMultiple"],clientStyling:["handleClientStylingChange"],clientStylingUrl:["handleClientStylingUrlChange"],showMobileFilter:["getComponentHeight"]}}};b.style=':host{--activeButtonBackground:#7ec51e;--activeButtonFont:#002149;--hoverBackground:#ffffff;--background:#e4e6e8;--success:#7ac345;--heightScrollableContainer:400px;--borderColor:#d3d3d3;--borderColorButton:#c4c4c4;--textColor:#002554;--textColorHover:#7ac345;--errorColor:#c23b21;--loaderColor:#7ac345;--headerTableBackground:#cdcdcd;--borderTable:#dedede;--shadowBorderTable:#f1f1f1;--backgroundTable:#ffffff;font-family:Roboto, Arial, sans-serif;font-size:14px;color:var(--textColor);display:block;background-color:var(--background)}:host .wrapper{height:100%;padding:1rem}:host .types{display:flex;width:100%;gap:5px}:host .transaction-type{background:inherit;font-weight:600;padding:0.6rem 1.6rem;border:1px solid #6c757d;cursor:pointer}:host .transaction-type:hover{color:var(--activeButtonBackground);border-color:var(--activeButtonBackground);background:var(--hoverBackground)}:host .clicked{background-color:var(--activeButtonBackground);border-color:var(--activeButtonBackground)}:host .types-mobile{justify-content:center;margin-bottom:15px}:host .types-desktop{justify-content:flex-end;margin-bottom:3rem}:host .page-size{display:flex;width:100%;justify-content:flex-end;align-items:center}:host .page-size button{background:transparent;border:none;cursor:pointer;margin:0.4rem;width:2rem;height:2rem}:host .page-size button:hover{color:var(--textColorHover)}:host .page-size button.active{background:var(--activeButtonBackground);color:var(--textColor);font-weight:600;border-radius:0.4rem}:host .period{display:flex;width:100%;align-items:flex-end;justify-content:center;gap:10px;background:#f0f0f0;border-bottom:2px solid #e9e9e9;padding:1.6rem 0 0;margin-bottom:4rem}@media (max-width: 801px){:host .period{margin-bottom:0;flex-direction:column;align-items:stretch;width:auto;padding:1.4rem 2.8rem;box-shadow:0 4px 5px 0 rgba(90, 90, 90, 0.24)}}:host .period .range{color:var(--errorColor)}:host .period .filter-btn{height:40px;background:transparent;border:0.1rem solid var(--borderColorButton);min-width:12rem;max-width:17rem;cursor:pointer}@media (max-width: 801px){:host .period .filter-btn{max-width:none;min-width:none;margin-top:1rem}}:host .period .filter-btn:hover{border:none;background:var(--hoverBackground)}:host .period .duet-date__input{padding:7px 60px 7px 7px}:host .period+button{padding:9px 15px}:host .period-content{display:flex;flex-direction:row;width:100%;justify-content:center;align-items:flex-end;margin:0 auto 1.6rem}@media (max-width: 801px){:host .period-content{flex-direction:column;align-items:stretch}}:host .period-content span{height:40px;display:flex;align-items:center;justify-content:center}@media (max-width: 801px){:host .period-content span{display:none}}:host .period-content .filter-btn{margin-left:60px}@media (max-width: 801px){:host .period-content .filter-btn{margin-left:0}}:host .period-content .date-input{padding:0 4px}@media (max-width: 801px){:host .period-content .date-input{width:auto}:host .period-content .date-input:first-child{margin-bottom:0.5rem}}:host .period-content .date-input label{display:inline-block;margin-bottom:0.9rem}:host .period-content .date-input input{border:0.1rem solid var(--borderColor);box-sizing:border-box;border-radius:0.2rem}:host .pagination{display:flex;width:100%;justify-content:center;margin-top:1.5rem}:host .pagination button{cursor:pointer;border:none;background-color:var(--activeButtonBackground);color:#fff;opacity:0.5;padding:7px 12px}:host .pagination button:hover{opacity:1}:host .pagination button:focus{opacity:1}:host button.active{color:var(--activeButtonFont);background-color:var(--activeButtonBackground)}.mobile-filter-button{display:flex;justify-content:center;align-items:center;width:100%;height:2.8rem;background:inherit;border:1px solid var(--borderColorButton)}.mobile-filter-button img{height:50%;margin-right:0.5rem}.noData{display:flex;align-items:center;box-shadow:0 0.4rem 0.4rem rgba(0, 0, 0, 0.25);padding:1.1rem;border-radius:0.6rem}.noData span{margin-left:0.5rem}.table{height:var(--heightScrollableContainer);overflow-y:auto}.table .mobile-table{height:100%}.data-transaction{border-bottom:1px solid var(--borderColor);background-color:var(--hoverBackground);padding:0 20px;display:grid;grid-template-columns:repeat(2, 1fr)}.data-transaction .text-style-status{font-weight:600}.data-transaction .text-style-status .success{color:var(--success)}.data-transaction .text-style-status .error{color:var(--errorColor)}.data-transaction .text-style{text-align:end}.data-transaction .date{font-size:12px;display:flex;align-items:center}.loader{display:inline-block;position:absolute;width:80px;height:80px;top:calc(50% - 40px);left:calc(50% - 40px);z-index:100}.loader::before{content:"";position:fixed;top:0;bottom:0;left:0;right:0;background-color:rgba(255, 255, 255, 0.6)}.loader div{position:absolute;width:6px;height:6px;background:var(--loaderColor);border-radius:50%;animation:loader 1.2s linear infinite}.loader div:nth-child(1){animation-delay:0s;top:37px;left:66px}.loader div:nth-child(2){animation-delay:-0.1s;top:22px;left:62px}.loader div:nth-child(3){animation-delay:-0.2s;top:11px;left:52px}.loader div:nth-child(4){animation-delay:-0.3s;top:7px;left:37px}.loader div:nth-child(5){animation-delay:-0.4s;top:11px;left:22px}.loader div:nth-child(6){animation-delay:-0.5s;top:22px;left:11px}.loader div:nth-child(7){animation-delay:-0.6s;top:37px;left:7px}.loader div:nth-child(8){animation-delay:-0.7s;top:52px;left:11px}.loader div:nth-child(9){animation-delay:-0.8s;top:62px;left:22px}.loader div:nth-child(10){animation-delay:-0.9s;top:66px;left:37px}.loader div:nth-child(11){animation-delay:-1s;top:62px;left:52px}.loader div:nth-child(12){animation-delay:-1.1s;top:52px;left:62px}@keyframes loader{0%,20%,80%,100%{transform:scale(1)}50%{transform:scale(1.5)}}.table thead th{position:sticky;top:0}table{border-collapse:collapse;width:100%}table th{padding:14px 24px;text-align:left;font-weight:600;color:var(--textColor);background:var(--headerTableBackground)}table td{padding:1rem 1.7rem;box-shadow:0 -1px 0 0 var(--shadowBorderTable) inset;border-bottom:0.1rem solid var(--borderTable);text-align:left;color:var(--textColor)}table tbody{background:var(--backgroundTable)}table .success{color:var(--success)}table .error{color:var(--errorColor)}vaadin-date-picker{min-width:320px}@media (max-width: 1261px){vaadin-date-picker{width:auto;min-width:auto}}@media (max-width: 801px){vaadin-date-picker{width:100%}}';export{b as user_transaction_history}