@everymatrix/lottery-banner 0.7.3 → 0.7.5

package/dist/cjs/helper-count-down_2.cjs.entry.js

@@ -0,0 +1,172 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+const index = require('./index-21014502.js');
+const lotteryBanner = require('./lottery-banner-c5020b47.js');
+
+const helperCountDownCss = ":host{display:block}.helper-count-down-container{display:flex;align-items:center}.helper-count-down-prefix{margin-right:4px}.helper-count-down-suffix{margin-left:4px}.helper-count-down-values{display:flex;align-items:center}.helper-count-down-item{display:flex;align-items:center;justify-content:center}.helper-count-down-item-num{font-variant-numeric:tabular-nums}";
+const HelperCountDownStyle0 = helperCountDownCss;
+
+const HelperCountDown = class {
+    constructor(hostRef) {
+        index.registerInstance(this, hostRef);
+        this.countDownChange = index.createEvent(this, "countDownChange", 7);
+        this.countDownFinish = index.createEvent(this, "countDownFinish", 7);
+        this.value = undefined;
+        this.format = 'HH:mm:ss';
+        this.prefix = undefined;
+        this.suffix = undefined;
+        this.mbSource = undefined;
+        this.clientStyling = undefined;
+        this.clientStylingUrl = undefined;
+        this.endTime = undefined;
+        this.timeObj = {
+            day: { str: '00', unit: '' },
+            hour: { str: '00', unit: '' },
+            minute: { str: '00', unit: '' },
+            second: { str: '00', unit: '' }
+        };
+    }
+    handleClientStylingChange(newValue, oldValue) {
+        if (newValue != oldValue) {
+            lotteryBanner.setClientStyling(this.stylingContainer, this.clientStyling);
+        }
+    }
+    handleClientStylingUrlChange(newValue, oldValue) {
+        if (newValue != oldValue) {
+            lotteryBanner.setClientStylingURL(this.stylingContainer, this.clientStylingUrl);
+        }
+    }
+    handleMbSourceChange(newValue, oldValue) {
+        if (newValue != oldValue) {
+            lotteryBanner.setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
+        }
+    }
+    handleValueChange(newValue) {
+        this.setEndTime(newValue);
+        if (newValue) {
+            this.startCountDown();
+        }
+        else {
+            this.clearCountDown();
+        }
+    }
+    componentDidLoad() {
+        if (this.stylingContainer) {
+            if (this.mbSource)
+                lotteryBanner.setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
+            if (this.clientStyling)
+                lotteryBanner.setClientStyling(this.stylingContainer, this.clientStyling);
+            if (this.clientStylingUrl)
+                lotteryBanner.setClientStylingURL(this.stylingContainer, this.clientStylingUrl);
+        }
+        this.setEndTime(this.value);
+        if (this.value)
+            this.startCountDown();
+    }
+    setEndTime(value) {
+        if (typeof value === 'string') {
+            // If it's a string, parse it and get the milliseconds
+            const time = lotteryBanner.parseISO(value).getTime();
+            this.endTime = isNaN(time) ? null : time;
+        }
+        else {
+            // If it's a number, use it directly
+            this.endTime = value;
+        }
+    }
+    disconnectedCallback() {
+        this.stylingSubscription && this.stylingSubscription.unsubscribe();
+        this.clearCountDown();
+    }
+    startCountDown() {
+        this.clearCountDown();
+        this.tick();
+        this.timer = setInterval(() => {
+            this.tick();
+        }, 1000);
+    }
+    clearCountDown() {
+        if (this.timer) {
+            clearInterval(this.timer);
+            this.timer = null;
+        }
+    }
+    tick() {
+        if (!this.endTime)
+            return;
+        let leftTime = this.endTime - Date.now();
+        if (leftTime <= 0) {
+            leftTime = 0;
+            this.clearCountDown();
+            this.countDownFinish.emit();
+        }
+        const d = Math.floor(leftTime / (1000 * 60 * 60 * 24));
+        const h = Math.floor((leftTime / (1000 * 60 * 60)) % 24);
+        const m = Math.floor((leftTime / 1000 / 60) % 60);
+        const s = Math.floor((leftTime / 1000) % 60);
+        const pad = (n) => (n < 10 ? `0${n}` : `${n}`);
+        this.timeObj = {
+            day: { str: pad(d), unit: 'd' },
+            hour: { str: pad(h), unit: 'h' },
+            minute: { str: pad(m), unit: 'm' },
+            second: { str: pad(s), unit: 's' }
+        };
+        const formatTime = this.getFormatTime();
+        this.countDownChange.emit({ leftTime, formatTime, legalTime: formatTime });
+    }
+    getFormatTime() {
+        return this.format
+            .replace('DD', this.timeObj.day.str)
+            .replace('HH', this.timeObj.hour.str)
+            .replace('mm', this.timeObj.minute.str)
+            .replace('ss', this.timeObj.second.str);
+    }
+    renderItems() {
+        const regex = /(DD|HH|mm|ss)|([\s\S]+?)(?=(DD|HH|mm|ss)|$)/g;
+        const items = [];
+        let match;
+        while ((match = regex.exec(this.format)) !== null) {
+            if (match[1]) {
+                let val = '';
+                switch (match[1]) {
+                    case 'DD':
+                        val = this.timeObj.day.str;
+                        break;
+                    case 'HH':
+                        val = this.timeObj.hour.str;
+                        break;
+                    case 'mm':
+                        val = this.timeObj.minute.str;
+                        break;
+                    case 'ss':
+                        val = this.timeObj.second.str;
+                        break;
+                }
+                items.push({ val, unit: '' });
+            }
+            else if (match[2]) {
+                if (items.length > 0) {
+                    items[items.length - 1].unit = match[2];
+                }
+            }
+        }
+        return items.map((item, index$1) => {
+            return (index.h("div", { key: index$1 + item.unit, class: "helper-count-down-item", part: "item" }, index.h("div", { class: "helper-count-down-item-num" }, item.val), index.h("div", { class: "helper-count-down-item-unit" }, item.unit)));
+        });
+    }
+    render() {
+        return (index.h("div", { key: 'b360412e045020b5ac0263c6ca56458f31eedb2c', class: "helper-count-down-container", ref: (el) => (this.stylingContainer = el) }, index.h("slot", { key: 'c72bed87fba869c842407b04e0cbfe038e5b7ea8' }), this.prefix && index.h("div", { key: '8d3ba9d60577421f81bae7bc76f52a774b17e1fe', class: "helper-count-down-prefix" }, this.prefix), index.h("div", { key: '187edf3b8eb6de85efe1a748fd8ef47a68e19611', class: "helper-count-down-values", part: "values" }, this.renderItems()), this.suffix && index.h("div", { key: '3a8e5d9561ecd3f52eff423bd43c8b60a261a17c', class: "helper-count-down-suffix" }, this.suffix)));
+    }
+    static get watchers() { return {
+        "clientStyling": ["handleClientStylingChange"],
+        "clientStylingUrl": ["handleClientStylingUrlChange"],
+        "mbSource": ["handleMbSourceChange"],
+        "value": ["handleValueChange"]
+    }; }
+};
+HelperCountDown.style = HelperCountDownStyle0;
+
+exports.lottery_banner = lotteryBanner.LotteryBanner;
+exports.helper_count_down = HelperCountDown;

package/dist/cjs/{index-7e1b19dd.js → index-21014502.js}

@@ -21,7 +21,7 @@ function _interopNamespace(e) {
 }
 
 const NAMESPACE = 'lottery-banner';
-const BUILD = /* lottery-banner */ { allRenderFn: true, appendChildSlotFix: false, asyncLoading: true, asyncQueue: false, attachStyles: true, cloneNodeFix: false, cmpDidLoad: true, cmpDidRender: false, cmpDidUnload: false, cmpDidUpdate: false, cmpShouldUpdate: false, cmpWillLoad: true, cmpWillRender: false, cmpWillUpdate: false, connectedCallback: false, constructableCSS: true, cssAnnotations: true, devTools: false, disconnectedCallback: true, element: false, event: true, experimentalScopedSlotChanges: false, experimentalSlotFixes: false, formAssociated: false, hasRenderFn: true, hostListener: false, hostListenerTarget: false, hostListenerTargetBody: false, hostListenerTargetDocument: false, hostListenerTargetParent: false, hostListenerTargetWindow: false, hotModuleReplacement: false, hydrateClientSide: false, hydrateServerSide: false, hydratedAttribute: false, hydratedClass: true, hydratedSelectorName: "hydrated", initializeNextTick: false, invisiblePrehydration: true, isDebug: false, isDev: false, isTesting: false, lazyLoad: true, lifecycle: true, lifecycleDOMEvents: false, member: true, method: false, mode: false, observeAttribute: true, profile: false, prop: true, propBoolean: false, propMutable: false, propNumber: false, propString: true, reflect: true, scoped: false, scopedSlotTextContentFix: false, scriptDataOpts: false, shadowDelegatesFocus: false, shadowDom: true, slot: false, slotChildNodesFix: false, slotRelocation: false, state: true, style: true, svg: false, taskQueue: true, transformTagName: false, updatable: true, vdomAttribute: true, vdomClass: true, vdomFunctional: false, vdomKey: true, vdomListener: false, vdomPropOrAttr: true, vdomRef: true, vdomRender: true, vdomStyle: false, vdomText: true, vdomXlink: false, watchCallback: true };
+const BUILD = /* lottery-banner */ { allRenderFn: true, appendChildSlotFix: false, asyncLoading: true, asyncQueue: false, attachStyles: true, cloneNodeFix: false, cmpDidLoad: true, cmpDidRender: false, cmpDidUnload: false, cmpDidUpdate: false, cmpShouldUpdate: false, cmpWillLoad: true, cmpWillRender: false, cmpWillUpdate: false, connectedCallback: false, constructableCSS: true, cssAnnotations: true, devTools: false, disconnectedCallback: true, element: false, event: true, experimentalScopedSlotChanges: false, experimentalSlotFixes: false, formAssociated: false, hasRenderFn: true, hostListener: false, hostListenerTarget: false, hostListenerTargetBody: false, hostListenerTargetDocument: false, hostListenerTargetParent: false, hostListenerTargetWindow: false, hotModuleReplacement: false, hydrateClientSide: false, hydrateServerSide: false, hydratedAttribute: false, hydratedClass: true, hydratedSelectorName: "hydrated", initializeNextTick: false, invisiblePrehydration: true, isDebug: false, isDev: false, isTesting: false, lazyLoad: true, lifecycle: true, lifecycleDOMEvents: false, member: true, method: false, mode: false, observeAttribute: true, profile: false, prop: true, propBoolean: false, propMutable: false, propNumber: false, propString: true, reflect: true, scoped: false, scopedSlotTextContentFix: false, scriptDataOpts: false, shadowDelegatesFocus: false, shadowDom: true, slot: true, slotChildNodesFix: false, slotRelocation: false, state: true, style: true, svg: false, taskQueue: true, transformTagName: false, updatable: true, vdomAttribute: true, vdomClass: true, vdomFunctional: false, vdomKey: true, vdomListener: true, vdomPropOrAttr: true, vdomRef: true, vdomRender: true, vdomStyle: false, vdomText: true, vdomXlink: false, watchCallback: true };
 
 /*
  Stencil Client Platform v4.19.2 | MIT Licensed | https://stenciljs.com
@@ -71,10 +71,10 @@ var loadModule = (cmpMeta, hostRef, hmrVersionId) => {
           }
           switch(bundleId) {
               
-                case 'lottery-banner.cjs':
+                case 'helper-count-down_2.cjs':
                     return Promise.resolve().then(function () { return /*#__PURE__*/_interopNamespace(require(
                         /* webpackMode: "lazy" */
-                        './lottery-banner.cjs.entry.js')); }).then(processMod, consoleError);
+                        './helper-count-down_2.cjs.entry.js')); }).then(processMod, consoleError);
           }
       }
   return Promise.resolve().then(function () { return /*#__PURE__*/_interopNamespace(require(
@@ -398,7 +398,7 @@ var getScopeId = (cmp, mode) => "sc-" + (cmp.$tagName$);
 var setAccessor = (elm, memberName, oldValue, newValue, isSvg, flags) => {
   if (oldValue !== newValue) {
     let isProp = isMemberInElement(elm, memberName);
-    memberName.toLowerCase();
+    let ln = memberName.toLowerCase();
     if (memberName === "class") {
       const classList = elm.classList;
       const oldClasses = parseClassList(oldValue);
@@ -409,6 +409,24 @@ var setAccessor = (elm, memberName, oldValue, newValue, isSvg, flags) => {
       if (newValue) {
         newValue(elm);
       }
+    } else if ((!isProp ) && memberName[0] === "o" && memberName[1] === "n") {
+      if (memberName[2] === "-") {
+        memberName = memberName.slice(3);
+      } else if (isMemberInElement(win, ln)) {
+        memberName = ln.slice(2);
+      } else {
+        memberName = ln[2] + memberName.slice(3);
+      }
+      if (oldValue || newValue) {
+        const capture = memberName.endsWith(CAPTURE_EVENT_SUFFIX);
+        memberName = memberName.replace(CAPTURE_EVENT_REGEX, "");
+        if (oldValue) {
+          plt.rel(elm, memberName, oldValue, capture);
+        }
+        if (newValue) {
+          plt.ael(elm, memberName, newValue, capture);
+        }
+      }
     } else {
       const isComplex = isComplexType(newValue);
       if ((isProp || isComplex && newValue !== null) && !isSvg) {
@@ -443,6 +461,8 @@ var setAccessor = (elm, memberName, oldValue, newValue, isSvg, flags) => {
 };
 var parseClassListRegex = /\s/;
 var parseClassList = (value) => !value ? [] : value.split(parseClassListRegex);
+var CAPTURE_EVENT_SUFFIX = "Capture";
+var CAPTURE_EVENT_REGEX = new RegExp(CAPTURE_EVENT_SUFFIX + "$");
 
 // src/runtime/vdom/update-element.ts
 var updateElement = (oldVnode, newVnode, isSvgMode2) => {
@@ -629,10 +649,11 @@ var patch = (oldVNode, newVNode2, isInitialRender = false) => {
   const elm = newVNode2.$elm$ = oldVNode.$elm$;
   const oldChildren = oldVNode.$children$;
   const newChildren = newVNode2.$children$;
+  const tag = newVNode2.$tag$;
   const text = newVNode2.$text$;
   if (text === null) {
     {
-      {
+      if (tag === "slot" && !useNativeShadowDom) ; else {
         updateElement(oldVNode, newVNode2, isSvgMode);
       }
     }

package/dist/cjs/index.cjs.js

@@ -2,8 +2,8 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const lotteryBanner = require('./lottery-banner-c3bceca9.js');
-require('./index-7e1b19dd.js');
+const lotteryBanner = require('./lottery-banner-c5020b47.js');
+require('./index-21014502.js');
 
 
 

package/dist/cjs/loader.cjs.js

@@ -2,13 +2,13 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-7e1b19dd.js');
+const index = require('./index-21014502.js');
 const appGlobals = require('./app-globals-3a1e7e63.js');
 
 const defineCustomElements = async (win, options) => {
   if (typeof window === 'undefined') return undefined;
   await appGlobals.globalScripts();
-  return index.bootstrapLazy([["lottery-banner.cjs",[[1,"lottery-banner",{"mbSource":[513,"mb-source"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"translationUrl":[513,"translation-url"],"language":[513],"logoUrl":[513,"logo-url"],"stopTime":[1,"stop-time"],"startTime":[1,"start-time"],"bannerTitle":[1,"banner-title"],"turnover":[1],"layout":[1],"formattedTime":[32]},null,{"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"],"mbSource":["handleMbSourceChange"],"startTime":["handleTimeChange"],"stopTime":["handleTimeChange"]}]]]], options);
+  return index.bootstrapLazy([["helper-count-down_2.cjs",[[1,"lottery-banner",{"mbSource":[513,"mb-source"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"translationUrl":[513,"translation-url"],"language":[513],"logoUrl":[513,"logo-url"],"stopTime":[1,"stop-time"],"startTime":[1,"start-time"],"bannerTitle":[1,"banner-title"],"turnover":[1],"layout":[1],"isWagerStarted":[32],"formattedStopTime":[32]},null,{"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"],"mbSource":["handleMbSourceChange"],"startTime":["handleTimeChange"],"stopTime":["handleTimeChange"]}],[1,"helper-count-down",{"value":[520],"format":[513],"prefix":[513],"suffix":[513],"mbSource":[513,"mb-source"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"endTime":[32],"timeObj":[32]},null,{"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"],"mbSource":["handleMbSourceChange"],"value":["handleValueChange"]}]]]], options);
 };
 
 exports.setNonce = index.setNonce;