@subiz/widget-v4 4.1.35 → 4.1.36

package/dist/213.js

@@ -0,0 +1,2780 @@
+(self["webpackChunk_subiz_widget_v4"] = self["webpackChunk_subiz_widget_v4"] || []).push([[213],{
+
+/***/ 8213:
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+"use strict";
+// ESM COMPAT FLAG
+__webpack_require__.r(__webpack_exports__);
+
+// EXPORTS
+__webpack_require__.d(__webpack_exports__, {
+  "default": () => (/* binding */ Popup)
+});
+
+// EXTERNAL MODULE: ./src/util/index.js + 3 modules
+var util = __webpack_require__(4494);
+// EXTERNAL MODULE: ./src/common.js
+var common = __webpack_require__(2493);
+;// CONCATENATED MODULE: ./src/popup/tick.core.commonjs.js
+
+let obj = function () {
+  var module = {};
+  var ExtensionType = {
+    VIEW: 'view',
+    EASING_FUNCTION: 'easing-function'
+  };
+  var Extensions = {};
+  Extensions[ExtensionType.VIEW] = {};
+  Extensions[ExtensionType.EASING_FUNCTION] = {};
+  var addExtensions = function addExtensions(type, extensions) {
+    if (!Extensions[type]) return null;
+    for (var name in extensions) {
+      if (!extensions.hasOwnProperty(name)) continue;
+      if (Extensions[type][name]) return null;
+      Extensions[type][name] = extensions[name];
+    }
+  };
+  var isVisible = function isVisible(element) {
+    var elementRect = element.getBoundingClientRect();
+    if (elementRect.bottom < 0) {
+      return false;
+    }
+    if (elementRect.top > window.scrollY + window.innerHeight) {
+      return false;
+    }
+    return true;
+  };
+  var addExtension = function addExtension(type, name, fn) {
+    if (!Extensions[type]) {
+      throw 'Can\'t add extension with type of "' + type + '", "' + type + '" is not a valid extension type. The following types are valid: ' + keysToList(Extensions);
+    }
+    if (!/^[-a-z]+$/.test(name)) {
+      throw 'Can\'t add extension with name "' + name + '", "' + name + '" is contains invalid characters. Only lowercase alphabetical characters and dashes are allowed.';
+    }
+    if (Extensions[type][name]) {
+      throw 'Can\'t add extension with name "' + name + '", "' + name + '" is already added.';
+    }
+    Extensions[type][name] = fn;
+  };
+  var getExtension = function getExtension(type, name) {
+    if (!Extensions[type]) {
+      throw 'Can\'t get extension with type of "' + type + '", "' + type + '" is not a valid extension type. The following types are available: ' + keysToList(Extensions);
+    }
+    if (!Extensions[type][name]) {
+      throw 'Can\'t get extension with name "' + name + '", "' + name + '" is not available. The following extensions are available: ' + keysToList(Extensions[type]);
+    }
+    return Extensions[type][name];
+  };
+  var destroyer = function (state) {
+    return {
+      destroy: function destroy() {
+        state.destroyed = true;
+        if (state.frame) {
+          cancelAnimationFrame(state.frame);
+        }
+        if (state.styleObserver) {
+          state.styleObserver.disconnect();
+        }
+        if (state.didResizeWindow) {
+          window.removeEventListener('resize', state.didResizeWindow);
+        }
+        if (state.root && state.root.parentNode) {
+          state.root.parentNode.removeChild(state.root);
+        }
+      }
+    };
+  };
+  var rooter = function (state) {
+    var root = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : document.createElement('span');
+    var name = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : null;
+    state.root = root;
+    state.aligned = null;
+    state.destroyed = false;
+    if (root && name) {
+      state.root.classList.add('tick-' + name);
+      state.root.setAttribute('data-view', name);
+    }
+    if (root && root.dataset.layout) {
+      state.align = (root.dataset.layout.match(/left|right|center/) || [])[0] || 'left';
+    }
+    return {
+      appendTo: function appendTo(element) {
+        var location = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'last';
+        if (!state.root || state.root && state.root.parentNode) {
+          return;
+        }
+        if (location === 'last') {
+          if (element.childNodes.length && element.childNodes[element.childNodes.length - 1].nodeType === Node.TEXT_NODE) {
+            element.insertBefore(state.root, element.childNodes[element.childNodes.length - 1]);
+          } else {
+            element.appendChild(state.root);
+          }
+          return;
+        }
+        if (location === 'first') {
+          if (element.childNodes.length === 0) {
+            element.appendChild(state.root);
+          } else if (element.children.length === 0 && element.childNodes.length) {
+            element.insertBefore(state.root, element.childNodes[element.childNodes.length - 1]);
+          } else {
+            element.insertBefore(state.root, element.children[0]);
+          }
+        }
+        if (typeof location !== 'string') {
+          element.insertBefore(state.root, location);
+        }
+      }
+    };
+  };
+  var grouper = function (state, definition) {
+    state.definition = definition;
+    return {
+      setDefinition: function setDefinition(definition) {
+        state.definition = definition;
+      }
+    };
+  };
+  var drawer = function (state, _draw, drawViews, present) {
+    return {
+      draw: function draw() {
+        if (!state.dirty) {
+          if (drawViews) {
+            var redrawn = drawViews(state);
+            if (redrawn) {
+              fit(state);
+            }
+          }
+          return false;
+        }
+        _draw(state, present);
+        fit(state);
+        state.dirty = false;
+        return true;
+      }
+    };
+  };
+  var fit = function fit(state) {
+    if (!state.fit) {
+      if (!state.root || !(state.root.getAttribute('data-layout') || '').match(/fit/)) {
+        state.fit = false;
+        return;
+      }
+      var style = window.getComputedStyle(state.root, null);
+      state.fit = true;
+      state.fitInfo = {
+        currentFontSize: parseInt(style.getPropertyValue('font-size'), 10)
+      };
+    }
+    state.fitInfo.availableWidth = state.root.parentNode.clientWidth;
+    state.fitInfo.currentWidth = state.root.scrollWidth;
+    var newFontSize = Math.min(Math.max(4, state.fitInfo.availableWidth / state.fitInfo.currentWidth * state.fitInfo.currentFontSize), 1024);
+    var dist = Math.abs(newFontSize - state.fitInfo.currentFontSize);
+    if (dist <= 1) {
+      return;
+    }
+    state.fitInfo.currentFontSize = newFontSize;
+    state.root.style.setProperties('fontSize', state.fitInfo.currentFontSize + 'px', 'important');
+  };
+  var updater = function (state) {
+    state.dirty = true;
+    state.value = null;
+    state.valueUpdateCount = 0;
+    state.isInitialValue = function () {
+      return state.valueUpdateCount <= 1;
+    };
+    return {
+      reset: function reset() {
+        state.dirty = true;
+        state.value = null;
+        state.valueUpdateCount = 0;
+      },
+      update: function update(value) {
+        if (equal(state.value, value)) {
+          return;
+        }
+        state.value = value;
+        state.valueUpdateCount++;
+        state.dirty = true;
+      }
+    };
+  };
+  var resizer = function (state) {
+    state.didResizeWindow = function () {
+      state.dirty = true;
+    };
+    window.addEventListener('resize', state.didResizeWindow);
+  };
+  var _typeof = typeof Symbol === 'function' && typeof Symbol.iterator === 'symbol' ? function (obj) {
+    return typeof obj;
+  } : function (obj) {
+    return obj && typeof Symbol === 'function' && obj.constructor === Symbol && obj !== Symbol.prototype ? 'symbol' : typeof obj;
+  };
+  var classCallCheck = function (instance, Constructor) {
+    if (!(instance instanceof Constructor)) {
+      throw new TypeError('Cannot call a class as a function');
+    }
+  };
+  var createClass = function () {
+    function defineProperties(target, props) {
+      for (var i = 0; i < props.length; i++) {
+        var descriptor = props[i];
+        descriptor.enumerable = descriptor.enumerable || false;
+        descriptor.configurable = true;
+        if ('value' in descriptor) descriptor.writable = true;
+        Object.defineProperty(target, descriptor.key, descriptor);
+      }
+    }
+    return function (Constructor, protoProps, staticProps) {
+      if (protoProps) defineProperties(Constructor.prototype, protoProps);
+      if (staticProps) defineProperties(Constructor, staticProps);
+      return Constructor;
+    };
+  }();
+  var _extends = Object.assign || function (target) {
+    for (var i = 1; i < arguments.length; i++) {
+      var source = arguments[i];
+      for (var key in source) {
+        if (Object.prototype.hasOwnProperty.call(source, key)) {
+          target[key] = source[key];
+        }
+      }
+    }
+    return target;
+  };
+  var toConsumableArray = function (arr) {
+    if (Array.isArray(arr)) {
+      for (var i = 0, arr2 = Array(arr.length); i < arr.length; i++) arr2[i] = arr[i];
+      return arr2;
+    } else {
+      return Array.from(arr);
+    }
+  };
+  var draw = function draw(state, present) {
+    var views = (state.definition || []).concat();
+    if (state.align === 'right') {
+      views.reverse();
+    }
+    var value = Array.isArray(state.value) ? state.value.concat() : _typeof(state.value) === 'object' ? clone(state.value) : state.value;
+    views.forEach(function (view) {
+      if (!view.presenter) {
+        state.update = present(view);
+        if (!view.presenter) {
+          return;
+        }
+        view.presenter.appendTo(state.root);
+      }
+    });
+    views.filter(function (view) {
+      return view.presenter !== undefined;
+    }).forEach(function (view) {
+      if (Array.isArray(value) && state.valueMapping) {
+        state.update(view, state.valueMapping === 'indexes' ? state.align === 'right' ? value.pop() : value.shift() : value);
+      } else if (view.key && value[view.key] !== undefined) {
+        state.update(view, value[view.key]);
+      } else {
+        state.update(view, value);
+      }
+    });
+    state.views = views;
+    drawViews(state);
+  };
+  var drawViews = function drawViews(state) {
+    var redrawn = false;
+    state.views.filter(function (view) {
+      return view.presenter !== undefined;
+    }).forEach(function (view) {
+      if (view.presenter.draw()) {
+        redrawn = true;
+      }
+    });
+    return redrawn;
+  };
+  var createRoot = function (root, definition, present) {
+    var state = {
+      valueMapping: null
+    };
+    if (root && root.dataset.valueMapping) {
+      var allowed = ['none', 'indexes'];
+      var mapping = root.dataset.valueMapping;
+      state.valueMapping = allowed.indexOf(mapping) !== -1 ? mapping : null;
+    }
+    return Object.assign({}, rooter(state, root), resizer(state), updater(state), grouper(state, definition), drawer(state, draw, drawViews, present), destroyer(state));
+  };
+  var draw$1 = function draw(state, present, ready) {
+    var value = copyArray(Array.isArray(state.value) ? state.value : (state.value + '').split(''));
+    if (state.align === 'right') {
+      value.reverse();
+    }
+    if (state.definitions.length > value.length) {
+      while (state.definitions.length > value.length) {
+        var def = state.definitions.pop();
+        def.presenter.destroy();
+      }
+    }
+    value.forEach(function (value, index) {
+      var def = state.definitions[index];
+      if (!def) {
+        def = state.definitions[index] = cloneDefinition(state.definition);
+        state.update = present(def);
+        def.presenter.appendTo(state.root, state.align === 'right' ? 'first' : 'last');
+      }
+    });
+    value.forEach(function (value, index) {
+      return state.update(state.definitions[index], value);
+    });
+    state.views = value;
+    drawViews$1(state);
+  };
+  var drawViews$1 = function drawViews(state) {
+    var redrawn = false;
+    state.views.forEach(function (view, index) {
+      if (state.definitions[index].presenter.draw()) {
+        redrawn = true;
+      }
+    });
+    return redrawn;
+  };
+  var createRepeater = function (root, definition, present) {
+    var state = {
+      definitions: []
+    };
+    return Object.assign({}, rooter(state, root), updater(state), grouper(state, definition), drawer(state, draw$1, drawViews$1, present), destroyer(state));
+  };
+  var text = function text(node, value) {
+    var textNode = node.childNodes[0];
+    if (!textNode) {
+      textNode = document.createTextNode(value);
+      node.appendChild(textNode);
+    } else if (value !== textNode.nodeValue) {
+      textNode.nodeValue = value;
+    }
+  };
+  var create$1 = function create(name, className) {
+    var el = document.createElement(name);
+    if (className) {
+      el.className = className;
+    }
+    return el;
+  };
+  var observeAttributes = function observeAttributes(element, attributes, cb) {
+    var observer = new MutationObserver(function (mutations) {
+      attributes.forEach(function (attr) {
+        if (mutations.filter(function (mutation) {
+          return attributes.includes(mutation.attributeName);
+        }).length) {
+          cb(element.getAttribute(attr));
+        }
+      });
+    });
+    observer.observe(element, {
+      attributes: true
+    });
+    return observer;
+  };
+  var isHTMLElement = function isHTMLElement(value) {
+    return value instanceof HTMLElement;
+  };
+  var setTransform = function setTransform(element, name, value) {
+    var unit = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : '';
+    if (!element.transforms) {
+      element.transforms = [];
+    }
+    var t = element.transforms.find(function (t) {
+      return t.name === name;
+    });
+    if (t) {
+      t.value = value;
+    } else {
+      element.transforms.push({
+        name: name,
+        value: value,
+        unit: unit
+      });
+    }
+    setTransformStyle(element, element.transforms);
+  };
+  var setTransformStyle = function setTransformStyle(element, transforms) {
+    element.style.setProperty('transform', transforms.map(function (t) {
+      return t.name + '(' + t.value + t.unit + ')';
+    }).join(' '), 'important');
+  };
+  var capitalizeFirstLetter$1 = function capitalizeFirstLetter(string) {
+    return string.charAt(0).toUpperCase() + string.slice(1);
+  };
+  var CACHE = {};
+  var cache = function (value, fn) {
+    var fns = fn.toString();
+    if (!CACHE[fns]) {
+      CACHE[fns] = {};
+    }
+    if (!CACHE[fns][value]) {
+      CACHE[fns][value] = fn(value);
+    }
+    return CACHE[fns][value];
+  };
+  var isInt = new RegExp('^[0-9]+$');
+  var isBoolean$1 = new RegExp('^(true|false)$');
+  var isFloat = new RegExp('^[0-9.]+$');
+  var isColor = new RegExp('color');
+  var isShadow = new RegExp('shadow');
+  var isGradient = new RegExp('^(follow-gradient|horizontal-gradient|vertical-gradient)');
+  var isDuration = new RegExp('^[.0-9]+(?:ms|s){1}$');
+  var isTransition = new RegExp('^transition-?(?:in|out)?$');
+  var isURL = new RegExp('^url\\(');
+  var toDuration = function toDuration(string) {
+    return string ? parseFloat(string) * (/ms$/.test(string) ? 1 : 1000) : 0;
+  };
+  var toTransition = function toTransition(string) {
+    return string.match(/[a-z]+(?:\(.*?\))?\s?(?:origin\(.*?\))?\s?(?:[a-z]+\(.*?\))?[ .a-z-0-9]*/g).map(toTransitionPartial);
+  };
+  var toTransitionPartial = function toTransitionPartial(string) {
+    var parts = string.match(/([a-z]+(?:\(.*?\))?)\s?(?:origin\((.*?)\))?\s?([a-z]+(?:\(.*?\))?)?\s?(?:([.0-9ms]+)?\s?(?:(ease-[a-z-]+))?\s?([.0-9ms]+)?)?/);
+    var fn = toFunctionOutline(parts[1]);
+    var origin = undefined;
+    var duration = undefined;
+    var ease = undefined;
+    var delay = undefined;
+    var resolver = undefined;
+    parts.slice(2).filter(function (part) {
+      return typeof part !== 'undefined';
+    }).forEach(function (part) {
+      if (isDuration.test(part)) {
+        if (typeof duration === 'undefined') {
+          duration = toDuration(part);
+        } else {
+          delay = toDuration(part);
+        }
+      } else if (/ /.test(part)) {
+        origin = part;
+      } else if (/^ease-[a-z-]+$/.test(part)) {
+        ease = part;
+      } else if (/^[a-z]+/.test(part)) {
+        resolver = toFunctionOutline(part);
+      }
+    });
+    if (resolver) {
+      duration = undefined;
+      ease = undefined;
+    }
+    return {
+      name: fn.name,
+      parameters: fn.parameters,
+      duration: duration,
+      ease: ease,
+      delay: delay,
+      origin: origin,
+      resolver: resolver
+    };
+  };
+  var toGradient = function toGradient(string) {
+    var type = string.match(/follow-gradient|horizontal-gradient|vertical-gradient/)[0];
+    var colors = string.substr(type.length).match(/(?:transparent|rgb\(.*?\)|hsl\(.*?\)|hsla\(.*?\)|rgba\(.*?\)|[a-z]+|#[abcdefABCDEF\d]+)\s?(?:[\d]{1,3}%?)?/g).map(toGradientColor);
+    return {
+      type: type,
+      colors: colors
+    };
+  };
+  var gradientOffsetRegex = /\s([\d]{1,3})%?$/;
+  var toGradientColor = function toGradientColor(string) {
+    var offset = string.match(gradientOffsetRegex);
+    return {
+      offset: offset ? parseFloat(offset[1]) / 100 : null,
+      value: toColor(string.replace(gradientOffsetRegex, ''))
+    };
+  };
+  var toColor = typeof document === 'undefined' ? function (string) {
+    return string;
+  } : function (string) {
+    if (string === 'transparent') {
+      return 'rgba(0,0,0,0)';
+    }
+    var pipette = document.createElement('span');
+    pipette.style.cssText = 'position:absolute !important;visibility:hidden !important;color:' + string + ' !important';
+    document.body.appendChild(pipette);
+    requestAnimationFrame(function () {
+      pipette.parentNode.removeChild(pipette);
+    });
+    return window.getComputedStyle(pipette).getPropertyValue('color');
+  };
+  var toShadow = function toShadow(style) {
+    if (typeof style !== 'string') {
+      return style;
+    }
+    return style.match(/([-.\d]+(?:%|ms|s|deg|cm|em|ch|ex|q|in|mm|pc|pt|px|vh|vw|vmin|vmax)?)|[%#A-Za-z0-9,.()]+/g);
+  };
+  var toURL = function toURL(style) {
+    var urls = style.match(/url\((.*?)\)/g).map(function (url) {
+      return url.substring(4, url.length - 1);
+    });
+    return urls.length === 1 ? urls[0] : urls;
+  };
+  var toStyleProperty = function toStyleProperty(key) {
+    return key.trim().split('-').map(function (key, index) {
+      return index > 0 ? capitalizeFirstLetter$1(key) : key;
+    }).join('');
+  };
+  var toStyleValue = function toStyleValue(value, property) {
+    if (isBoolean$1.test(value)) {
+      return typeof value === 'string' ? value === 'true' : value;
+    }
+    if (isInt.test(value)) return parseInt(value, 10);
+    if (isFloat.test(value)) return parseFloat(value);
+    if (isURL.test(value)) return toURL(value);
+    if (isColor.test(property)) {
+      if (isGradient.test(value)) {
+        return cache(value, toGradient);
+      }
+      return cache(value, toColor);
+    }
+    if (isShadow.test(property)) return cache(value, toShadow);
+    if (isTransition.test(property)) {
+      if (value === 'none') return value;
+      return cache(value, toTransition);
+    }
+    return value;
+  };
+  var toStyle = function toStyle(string) {
+    var parts = string.split(':').map(trim);
+    var property = toStyleProperty(parts[0]);
+    var value = toStyleValue(parts[1], parts[0]);
+    if (!property || value === null || typeof value === 'undefined') {
+      return null;
+    }
+    return {
+      property: property,
+      value: value
+    };
+  };
+  var toStyles = function toStyles(string) {
+    return string.split(';').filter(function (style) {
+      return style.trim().length;
+    }).map(toStyle).filter(function (style) {
+      return style !== null;
+    }).reduce(function (styles, style) {
+      styles[style.property] = style.value;
+      return styles;
+    }, {});
+  };
+  var easeOutSine = function easeOutSine(t) {
+    return Math.sin(t * (Math.PI / 2));
+  };
+  var easeOutCubic = function easeOutCubic(t) {
+    var t1 = t - 1;
+    return t1 * t1 * t1 + 1;
+  };
+  var easeOutBounce = function easeOutBounce(t) {
+    var scaledTime = t / 1;
+    if (scaledTime < 1 / 2.75) {
+      return 7.5625 * scaledTime * scaledTime;
+    } else if (scaledTime < 2 / 2.75) {
+      var scaledTime2 = scaledTime - 1.5 / 2.75;
+      return 7.5625 * scaledTime2 * scaledTime2 + 0.75;
+    } else if (scaledTime < 2.5 / 2.75) {
+      var _scaledTime = scaledTime - 2.25 / 2.75;
+      return 7.5625 * _scaledTime * _scaledTime + 0.9375;
+    } else {
+      var _scaledTime2 = scaledTime - 2.625 / 2.75;
+      return 7.5625 * _scaledTime2 * _scaledTime2 + 0.984375;
+    }
+  };
+  var EasingFunctions = {
+    'ease-out-sine': easeOutSine,
+    'ease-out-cubic': easeOutCubic,
+    'ease-out-bounce': easeOutBounce
+  };
+  addExtensions(ExtensionType.EASING_FUNCTION, EasingFunctions);
+  var styler = function (state) {
+    var base = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+    state.lastAppliedStyles = null;
+    updateStyles(state, base, state.root.dataset.style);
+    state.styleObserver = observeAttributes(state.root, ['data-style'], function (string) {
+      updateStyles(state, base, string);
+    });
+    return {
+      setStyle: function setStyle(css) {
+        updateStyles(state, base, css);
+      }
+    };
+  };
+  var updateStyles = function updateStyles(state, base, css) {
+    if (state.lastAppliedStyles === css) {
+      return;
+    }
+    state.lastAppliedStyles = css;
+    state.style = css ? mergeObjects(base, toStyles(css)) : base;
+    state.dirty = true;
+  };
+  var Views = {
+    text: function text$$1() {
+      return function (root) {
+        var state = {};
+        var draw = function draw(state) {
+          state.root.setAttribute('data-value', state.value);
+          text(state.root, state.value);
+        };
+        return Object.assign({}, rooter(state, root, 'text'), updater(state), drawer(state, draw), destroyer(state));
+      };
+    }
+  };
+  addExtensions(ExtensionType.VIEW, Views);
+  var API$2 = function API() {
+    return {
+      Extension: {
+        Type: ExtensionType,
+        getExtension: getExtension
+      },
+      Utils: {},
+      Canvas: {},
+      DOM: {
+        visible: isVisible,
+        create: create$1,
+        transform: setTransform
+      },
+      Animation: {},
+      Date: {
+        performance: now
+      },
+      View: {
+        rooter: rooter,
+        drawer: drawer,
+        updater: updater,
+        styler: styler,
+        grouper: grouper,
+        resizer: resizer,
+        destroyer: destroyer
+      }
+    };
+  };
+  var createPresenterRoot = function createPresenterRoot(root, definition, presentDefinition) {
+    return createRoot(root, definition, presentDefinition);
+  };
+  var createPresenterRepeater = function createPresenterRepeater(root, definition, presentDefinition) {
+    return createRepeater(root, definition, presentDefinition);
+  };
+  var createPresenterView = function createPresenterView(name, root, style) {
+    var view = getExtension(ExtensionType.VIEW, name);
+    return view ? view(API$2())(root, style) : null;
+  };
+  var arrow = function arrow(str, i) {
+    return str[i] === '-' && str[i + 1] === '>';
+  };
+  var string = function string(c) {
+    return c === "'" || c === '"';
+  };
+  var comma = function comma(c) {
+    return c === ',';
+  };
+  var opener = function opener(c) {
+    return c === '(';
+  };
+  var closer = function closer(c) {
+    return c === ')';
+  };
+  var value = function value(v) {
+    return v.trim().length !== 0;
+  };
+  var add = function add(r, v) {
+    return r.push(v.trim());
+  };
+  var token = function token(r, v) {
+    if (value(v)) {
+      add(r, v);
+      return '';
+    }
+    return v;
+  };
+  var chain = function chain(_chain, output) {
+    if (_chain.length) {
+      output.push(_chain.length > 1 ? _chain.concat() : _chain[0]);
+    }
+    return [];
+  };
+  var parse$1 = function parse(i, str, result) {
+    var v = '';
+    var fns = [];
+    var quote = null;
+    var hitArrow = false;
+    while (i < str.length) {
+      var c = str[i];
+      if (opener(c)) {
+        hitArrow = false;
+        var fn = [v.trim()];
+        i = parse(i + 1, str, fn);
+        c = str[i];
+        fns.push(fn);
+        v = '';
+      } else if (closer(c)) {
+        if (hitArrow && v.trim().length) {
+          fns.push([v.trim()]);
+          v = '';
+          hitArrow = false;
+        }
+        if (value(v)) {
+          add(fns, v);
+        }
+        fns = chain(fns, result);
+        return i + 1;
+      } else {
+        if (quote !== null && c !== quote) {
+          v += c;
+        } else if (c === quote) {
+          fns.push(v);
+          v = '';
+          quote = null;
+        } else if (string(c)) {
+          v = '';
+          quote = c;
+        } else {
+          if (arrow(str, i)) {
+            hitArrow = true;
+            if (v.trim().length) {
+              fns.push([v.trim()]);
+              v = '';
+            }
+            i += 2;
+          } else if (comma(c)) {
+            if (hitArrow && v.trim().length) {
+              fns.push([v.trim()]);
+              v = '';
+              hitArrow = false;
+            }
+            fns = chain(fns, result);
+            v = token(result, v);
+          } else {
+            v += c;
+          }
+        }
+        i++;
+      }
+    }
+    if (hitArrow && v.trim().length || !hitArrow && v.trim().length && !fns.length) {
+      fns.push([v.trim()]);
+      v = '';
+    }
+    chain(fns, result);
+    token(result, v);
+    return i;
+  };
+  var parseTransformChain = function parseTransformChain(string) {
+    var result = [];
+    parse$1(0, string, result);
+    return result;
+  };
+  var isRootDefinition = function isRootDefinition(definition) {
+    return definition.children && definition.children.length;
+  };
+  var cloneDefinition = function cloneDefinition(definition) {
+    var clone = {};
+    for (var key in definition) {
+      if (!definition.hasOwnProperty(key)) {
+        continue;
+      }
+      if (key === 'root') {
+        clone[key] = definition[key].cloneNode();
+        continue;
+      }
+      if (key === 'children') {
+        clone[key] = definition[key] === null ? null : definition[key].map(cloneDefinition);
+        continue;
+      }
+      if (key === 'repeat') {
+        clone[key] = definition[key] === null ? null : cloneDefinition(definition[key]);
+        continue;
+      }
+      clone[key] = definition[key];
+    }
+    clone.presenter = null;
+    return clone;
+  };
+  var definitionOutline = {
+    root: null,
+    key: null,
+    view: null,
+    overlay: null,
+    presenter: null,
+    transform: null,
+    layout: null,
+    style: null,
+    repeat: null,
+    children: null,
+    className: null
+  };
+  var toPresenterDefinitionTree = function toPresenterDefinitionTree(nodes) {
+    return Array.from(nodes).map(function (node) {
+      var definition = mergeObjects(definitionOutline, {
+        root: node
+      });
+      for (var key in node.dataset) {
+        if (!node.dataset.hasOwnProperty(key)) {
+          continue;
+        }
+        if (typeof definition[key] === 'undefined') {
+          continue;
+        }
+        definition[key] = node.dataset[key];
+      }
+      if (definition.repeat) {
+        definition.repeat = toPresenterDefinitionTree(node.children).pop();
+        Array.from(node.children).forEach(function (node) {
+          node.parentNode.removeChild(node);
+        });
+      } else if (node.children.length) {
+        definition.children = toPresenterDefinitionTree(node.children);
+      }
+      return definition;
+    });
+  };
+  var createDOMTreeForDefinition = function createDOMTreeForDefinition(definition) {
+    return definition.map(function (def) {
+      def = mergeObjects(definitionOutline, def);
+      if (typeof def.root === 'string') {
+        def.root = document.createElement(def.root);
+      } else {
+        def.root = document.createElement('span');
+      }
+      if (def.transform) {
+        def.root.dataset.transform = def.transform;
+      }
+      if (def.className) {
+        def.root.className = def.className;
+      }
+      if (def.overlay) {
+        def.root.dataset.overlay = def.overlay;
+      }
+      if (def.view) {
+        def.root.dataset.view = def.view;
+        if (def.style) {
+          def.root.dataset.style = def.style;
+        }
+        def.repeat = null;
+      } else {
+        if (def.layout) {
+          def.root.dataset.layout = def.layout;
+        }
+        if (def.repeat) {
+          def.root.dataset.repeat = true;
+          def.repeat = createDOMTreeForDefinition(def.children).pop();
+        } else if (def.children) {
+          def.children = createDOMTreeForDefinition(def.children);
+          def.children.forEach(function (child) {
+            def.root.appendChild(child.root);
+          });
+        }
+      }
+      return def;
+    });
+  };
+  var createPresenterByDefinition = function createPresenterByDefinition(definition, presentDefinition) {
+    var presenter = void 0;
+    if (definition.repeat) {
+      presenter = createPresenterRepeater(definition.root, definition.repeat, presentDefinition);
+    } else if (typeof definition.view === 'string') {
+      presenter = createPresenterView(definition.view, definition.root, definition.style);
+    } else if (isRootDefinition(definition)) {
+      presenter = createPresenterRoot(definition.root, definition.children, presentDefinition);
+    }
+    return presenter;
+  };
+  var presentTick = function presentTick(instance) {
+    var isDrawing = false;
+    var update = function update(definition, value) {
+      definition.transform(value, function (output) {
+        definition.presenter.update(output);
+      }, instance);
+      if (!isDrawing) {
+        isDrawing = true;
+        draw();
+      }
+    };
+    var draw = function draw() {
+      instance.baseDefinition.presenter.draw();
+      requestAnimationFrame(draw);
+    };
+    var presentDefinition = function presentDefinition(definition) {
+      definition.presenter = createPresenterByDefinition(definition, presentDefinition);
+      definition.transform = toTransformComposition(definition.transform, instance);
+      return update;
+    };
+    return presentDefinition(instance.baseDefinition);
+  };
+  var composeAsync = function composeAsync(instance) {
+    for (var _len = arguments.length, funcs = Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
+      funcs[_key - 1] = arguments[_key];
+    }
+    return function (initialValue, callback) {
+      function compose(i, value) {
+        if (funcs.length <= i) {
+          callback(value);
+          return;
+        }
+        funcs[i](value, partial(compose, [i + 1]), instance);
+      }
+      compose(0, initialValue);
+    };
+  };
+  var partial = function partial(fn) {
+    var initialArgs = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : [];
+    var ctx = arguments[2];
+    return function () {
+      var args = Array.from(initialArgs);
+      Array.prototype.push.apply(args, arguments);
+      return fn.apply(ctx, args);
+    };
+  };
+  var toTransformComposition = function toTransformComposition(string, instance) {
+    if (!string) {
+      return function (value, cb) {
+        return cb(value);
+      };
+    }
+    if (typeof string === 'function') {
+      return string;
+    }
+    var result = parseTransformChain('transform(' + (/^[a-z]+$/.test(string) ? string + '()' : string) + ')');
+    return compose(result, instance);
+  };
+  var compose = function compose(chain, instance) {
+    var composition = chain.map(function (item) {
+      var name = item.shift();
+      var func = getExtension(ExtensionType.TRANSFORM, name) || function (value, cb, instance) {
+        cb(value);
+      };
+      var params = item.map(function (parameter) {
+        if (Array.isArray(parameter)) {
+          if (typeof parameter[0] === 'string') {
+            return compose([parameter], instance);
+          }
+          return compose(parameter, instance);
+        }
+        return toParameter(parameter);
+      });
+      return func.apply(undefined, toConsumableArray(params));
+    });
+    return composeAsync.apply(undefined, [instance].concat(toConsumableArray(composition)));
+  };
+  var toFunctionOutline = function toFunctionOutline(string) {
+    var name = string.match(/[a-z]+/)[0];
+    var parameters = toParameters(string.substring(name.length));
+    return {
+      name: name,
+      parameters: parameters
+    };
+  };
+  var toParameters = function toParameters(string) {
+    var arr = string.match(/('.+?')|(".+?")|(\[.+?])|([.:\-\d\sa-zA-Z]+%?)/g) || [];
+    arr.map(trim).filter(function (str) {
+      return str.length;
+    }).map(toParameter);
+  };
+  var trimEdges = function trimEdges(string) {
+    return string.substring(1, string.length - 1);
+  };
+  var isProbablyISODate = /^([\d]{4}-[\d]{1,2}-[\d]{1,2})/;
+  var isBoolean = /^(true|false)$/;
+  var isString = /^[\a-zA-Z]+$/;
+  var isZeroString = /^0[\d]+/;
+  var isQuotedString = /^('|")/;
+  var isNumber = /^-?(?:\d+)?(?:\.|0\.)?[\d]+$/;
+  var isArray = /^(\[)/;
+  var toParameter = function toParameter(string) {
+    if (isBoolean.test(string)) {
+      return string === 'true';
+    }
+    if (isArray.test(string)) {
+      return toParameters(trimEdges(string));
+    }
+    if (isProbablyISODate.test(string)) {
+      return dateFromISO(string);
+    }
+    if (isQuotedString.test(string)) {
+      return trimEdges(string);
+    }
+    if (isString.test(string) || isZeroString.test(string)) {
+      return string;
+    }
+    if (isNumber.test(string)) {
+      return parseFloat(string);
+    }
+    return string;
+  };
+  var toCSSValue = function toCSSValue(value) {
+    var parts = (value + '').match(/(-?[.\d]+)(%|ms|s|deg|cm|em|ch|ex|q|in|mm|pc|pt|px|vh|vw|vmin|vmax)?/);
+    return {
+      value: parseFloat(parts[1]),
+      units: parts[2]
+    };
+  };
+  var mergeObjects = function mergeObjects(a) {
+    var b = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+    var key = void 0;
+    var obj = {};
+    for (key in a) {
+      if (!a.hasOwnProperty(key)) {
+        continue;
+      }
+      obj[key] = typeof b[key] === 'undefined' ? a[key] : b[key];
+    }
+    return obj;
+  };
+  var toFunctionReference = function toFunctionReference(string) {
+    var ref = window;
+    var levels = string.split('.');
+    levels.forEach(function (level, index) {
+      if (!ref[levels[index]]) {
+        return;
+      }
+      ref = ref[levels[index]];
+    });
+    return ref !== window ? ref : null;
+  };
+  var toValue = function toValue(string) {
+    if (/^(?:[\w]+\s?:\s?[\w.]+,\s?)+(?:[\w]+\s?:\s?[\w.]+)$/g.test(string)) {
+      return string.match(/(?:(\w+)\s?:\s?([\w.]+))/g).reduce(function (obj, current) {
+        var parts = current.split(':');
+        obj[parts[0]] = toParameter(parts[1]);
+        return obj;
+      }, {});
+    }
+    return toParameter(string);
+  };
+  var toInt = function toInt(value) {
+    return parseInt(value, 10);
+  };
+  var trim = function trim(string) {
+    return string.trim();
+  };
+  var capitalizeFirstLetter = function capitalizeFirstLetter(string) {
+    return string.charAt(0).toUpperCase() + string.slice(1);
+  };
+  var dashesToCamels = function dashesToCamels(string) {
+    return string.replace(/-./g, function (sub) {
+      return sub.charAt(1).toUpperCase();
+    });
+  };
+  var clone = function clone(obj) {
+    if ((typeof obj === 'undefined' ? 'undefined' : _typeof(obj)) === 'object' && obj !== null) {
+      return util/* default */.Z.parseJSON(util/* default */.Z.stringify(obj));
+    }
+    return obj;
+  };
+  var copyArray = function copyArray(arr) {
+    return arr.slice();
+  };
+  var now = function now() {
+    return window.performance.now();
+  };
+  var equal = function equal(a, b) {
+    if (isObject(a)) {
+      return equalObjects(a, b);
+    }
+    if (Array.isArray(a)) {
+      return equalArrays(a, b);
+    }
+    return a === b;
+  };
+  var isObject = function isObject(obj) {
+    return obj === Object(obj);
+  };
+  var equalObjects = function equalObjects(a, b) {
+    for (var i in a) {
+      if (!b.hasOwnProperty(i) || a[i] !== b[i]) {
+        return false;
+      }
+    }
+    return true;
+  };
+  var equalArrays = function equalArrays(a, b) {
+    return a.length == b.length && a.every(function (v, i) {
+      return v === b[i];
+    });
+  };
+  var keysToList = function keysToList(obj) {
+    return Object.keys(obj).map(function (k) {
+      return '"' + k + '"';
+    }).join(', ');
+  };
+  var Tick = function () {
+    function Tick() {
+      var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+      var element = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : document.createElement('div');
+      classCallCheck(this, Tick);
+      this._options = mergeObjects(Tick.options(), options);
+      this._element = element;
+      this._value = null;
+      this._observer = null;
+      this._viewDefinition = null;
+      this._updater = null;
+      this._didInit = null;
+      this._didDestroy = null;
+      this._willDestroy = null;
+      this._didUpdate = null;
+      this._init();
+    }
+    createClass(Tick, [{
+      key: 'isRootElement',
+      value: function isRootElement(element) {
+        return this._element === element;
+      }
+    }, {
+      key: 'destroy',
+      value: function destroy$$1() {
+        this._willDestroy(this);
+        this._observer.disconnect();
+        this.baseDefinition.presenter.destroy();
+        this._didDestroy(this);
+      }
+    }, {
+      key: 'redraw',
+      value: function redraw() {
+        if (!this.baseDefinition || !this.baseDefinition.presenter) return;
+        this.baseDefinition.presenter.reset();
+        this.baseDefinition.presenter.draw();
+        this._updater(this.baseDefinition, this._value);
+      }
+    }, {
+      key: '_init',
+      value: function _init() {
+        var _this = this;
+        this._viewDefinition = this._options.view;
+        this._willDestroy = this._options.willDestroy;
+        this._didDestroy = this._options.didDestroy;
+        this._didInit = this._options.didInit;
+        this._didUpdate = this._options.didUpdate;
+        this._value = this._options.value;
+        if (!this._element.classList.contains('tick')) {
+          this._element.classList.add('tick');
+        }
+        this._observer = observeAttributes(this._element, ['data-value'], function (value) {
+          _this.value = value;
+        });
+        if (this._viewDefinition.root !== this._element) {
+          Array.from(this._viewDefinition.root.children).forEach(function (node) {
+            _this._element.appendChild(node);
+          });
+          this._viewDefinition.root = this._element;
+        }
+        if (!this._viewDefinition.view && !this._viewDefinition.children) {
+          this._viewDefinition.view = 'text';
+        }
+        this._updater = presentTick(this);
+        if (this.value !== null) {
+          this._update(this.value);
+        }
+        this._element.dataset.state = 'initialised';
+        this._didInit(this, this.value);
+      }
+    }, {
+      key: '_update',
+      value: function _update(value) {
+        this._updater(this.baseDefinition, value);
+        this._didUpdate(this, value);
+      }
+    }, {
+      key: 'baseDefinition',
+      get: function get$$1() {
+        return this._viewDefinition;
+      }
+    }, {
+      key: 'root',
+      get: function get$$1() {
+        return this._element;
+      }
+    }, {
+      key: 'value',
+      get: function get$$1() {
+        return this._value;
+      },
+      set: function set$$1(value) {
+        this._value = typeof value === 'string' ? toValue(value) : value;
+        this._update(value);
+      }
+    }], [{
+      key: 'options',
+      value: function options() {
+        return {
+          value: null,
+          view: null,
+          didInit: function didInit(tick) {},
+          didUpdate: function didUpdate(tick, value) {},
+          willDestroy: function willDestroy(tick) {},
+          didDestroy: function didDestroy(tick) {}
+        };
+      }
+    }]);
+    return Tick;
+  }();
+  var instances = [];
+  var attributes = {
+    value: toValue,
+    didInit: toFunctionReference,
+    didUpdate: toFunctionReference,
+    didDestroy: toFunctionReference,
+    willDestroy: toFunctionReference
+  };
+  var getOptionsFromAttributes = function getOptionsFromAttributes(element) {
+    var transfomers = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+    var defaults$$1 = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
+    var dataset = element.dataset;
+    var options = {
+      meta: {}
+    };
+    for (var prop in dataset) {
+      if (!dataset.hasOwnProperty(prop)) {
+        continue;
+      }
+      var valueTransformer = transfomers[prop];
+      var value = dataset[prop];
+      if (valueTransformer) {
+        value = valueTransformer(value);
+        value = value === null ? clone(defaults$$1[prop]) : value;
+        options[prop] = value;
+      }
+    }
+    return options;
+  };
+  var indexOfElement = function indexOfElement(instances, element) {
+    var i = 0;
+    var l = instances.length;
+    for (; i < l; i++) {
+      if (instances[i].isRootElement(element)) {
+        return i;
+      }
+    }
+    return -1;
+  };
+  var parse = function parse(context) {
+    var elements = void 0;
+    var element = void 0;
+    var i = void 0;
+    var instances = [];
+    elements = context.querySelectorAll('.tick:not([data-state])');
+    i = elements.length;
+    while (i--) {
+      element = elements[i];
+      instances.push(create(element));
+    }
+    return instances;
+  };
+  var find = function find(element) {
+    var result = instances.filter(function (instance) {
+      return instance.isRootElement(element);
+    });
+    return result ? result[0] : null;
+  };
+  var getDefaultOptions = function getDefaultOptions() {
+    return _extends({}, Tick.options());
+  };
+  var create = function create() {
+    var element = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : undefined;
+    var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : undefined;
+    if (element && !isHTMLElement(element)) {
+      options = element;
+      element = undefined;
+    }
+    if (element && find(element)) {
+      return;
+    }
+    if (options && options.view) {
+      options.view = createDOMTreeForDefinition([options.view])[0];
+    }
+    if (!options && element) {
+      options = getOptionsFromAttributes(element, attributes, getDefaultOptions());
+    }
+    if (element) {
+      if (!options) {
+        options = {};
+      }
+      if (!options.view) {
+        options.view = toPresenterDefinitionTree([element])[0];
+      }
+    }
+    var instance = new Tick(options, element);
+    instances.push(instance);
+    return instance;
+  };
+  var destroy = function destroy(element) {
+    var index = indexOfElement(instances, element);
+    if (index < 0) return false;
+    instances[index].destroy();
+    instances.splice(index, 1);
+    return true;
+  };
+  var support = function () {
+    var w = window;
+    if (typeof w === 'undefined') {
+      return false;
+    }
+    var canSupport = w.CSS && w.CSS.supports;
+    var isIE11 = !!w.MSInputMethodContext && !!document.documentMode;
+    var canTransform = canSupport && CSS.supports('transform', 'translateX(0)');
+    var features = ['MutationObserver', 'requestAnimationFrame'];
+    return isIE11 || canSupport && canTransform && !!features.filter(function (p) {
+      return p in w;
+    }).length;
+  };
+  var API = {
+    supported: support(),
+    options: {},
+    DOM: {
+      create: create,
+      destroy: destroy,
+      parse: parse,
+      find: find
+    },
+    plugin: {
+      add: function add(type, name, fn) {
+        if (typeof type === 'function') {
+          var extension = type;
+          return addExtension(extension.identifier.type, extension.identifier.name, extension);
+        }
+        return addExtension(type, name, fn);
+      }
+    }
+  };
+  var _loop = function _loop(type) {
+    if (!ExtensionType.hasOwnProperty(type)) return 'continue';
+    API.plugin[dashesToCamels('add-' + ExtensionType[type])] = function (name, fn) {
+      addExtension(ExtensionType[type], name, fn);
+    };
+  };
+  for (var type in ExtensionType) {
+    var _ret = _loop(type);
+    if (_ret === 'continue') continue;
+  }
+  module.exports = API;
+  return module.exports;
+}();
+/* harmony default export */ const tick_core_commonjs = (obj);
+// EXTERNAL MODULE: ./src/popup/tick.view.flip.commonjs.js
+var tick_view_flip_commonjs = __webpack_require__(9980);
+var tick_view_flip_commonjs_default = /*#__PURE__*/__webpack_require__.n(tick_view_flip_commonjs);
+// EXTERNAL MODULE: ./node_modules/preact/dist/preact.module.js
+var preact_module = __webpack_require__(6400);
+;// CONCATENATED MODULE: ./src/popup/countdown.js
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return typeof key === "symbol" ? key : String(key); }
+function _toPrimitive(input, hint) { if (typeof input !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (typeof res !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
+
+
+
+
+tick_core_commonjs.plugin.add((tick_view_flip_commonjs_default()));
+
+class Countdown extends common/* Com */.up {
+  constructor(props) {
+    super(props);
+    _defineProperty(this, "state", {
+      flipKey: '43'
+    });
+    this.timer = util/* default */.Z.setInterval(() => {
+      if (this.props._destroy) return this.componentWillUnmount();
+      let cd = this.props.com.countdown || {};
+      let newFlipKey = 'cd' + ':' + cd.skin + ':' + cd.size + ':' + this.props.plugin.popup.font_family + ':';
+      if (this.state.flipKey !== newFlipKey) this.setState({
+        flipKey: newFlipKey
+      });
+      this.forceUpdate();
+    }, 500);
+  }
+  componentWillUnmount() {
+    util/* default */.Z.clearInterval(this.timer);
+  }
+  getCountDownDeltaSec(countdown) {
+    let dest;
+    if (countdown.expire_time_type === 'fixed_time') dest = countdown.fixed_time;
+    if (countdown.expire_time_type === 'visit_time') dest = this.props.store.pageLoaded() + countdown.visit_time * 60000;
+    if (countdown.expire_time_type === 'repeat_daily') {
+      var start = new util/* default */.Z.Date();
+      start.setHours(0, 0, 0, 0);
+      dest = start.getTime() + countdown.repeat_daily * 60000;
+    }
+    if (countdown.expire_time_type === 'repeat_weekly') {
+      let daytill = 0;
+      let todayweekday = new util/* default */.Z.Date().getDay();
+      if (todayweekday === 0) {
+        if (countdown.repeat_weekly_weekday === 'sunday') {
+          daytill = 0;
+        } else {
+          daytill = 7 - new util/* default */.Z.Date().getDay();
+        }
+      } else {
+        if (countdown.repeat_weekly_weekday === 'sunday') {
+          daytill = 7 - todayweekday;
+        } else {
+          daytill = WEEKDAY_INDEX[countdown.repeat_weekly_weekday] - todayweekday;
+        }
+      }
+      if (daytill < 0) delta = 0;else if (daytill == 0) {
+        var start = new util/* default */.Z.Date();
+        start.setHours(0, 0, 0, 0);
+        dest = start.getTime() + countdown.repeat_weekly_min * 60000;
+      } else {
+        var start = new util/* default */.Z.Date();
+        start.setHours(0, 0, 0, 0);
+        dest = start.getTime() + countdown.repeat_weekly_min * 60000 + daytill * 86400000;
+      }
+    }
+    let delta = dest - util/* default */.Z.Date.now();
+    if (delta < 0) delta = 0;
+    return Math.floor(delta / 1000) || 0;
+  }
+  renderElectricCountdown(day, hour0, hour1, min0, min1, sec0, sec1) {
+    let fs = '28px';
+    if (this.props.com.countdown.size === 'sm') fs = '20px';
+    if (this.props.com.countdown.size === 'lg') fs = '40px';
+    return (0,preact_module.h)("div", {
+      class: "countdown_electric"
+    }, (0,preact_module.h)("div", {
+      class: "countdown_electric_group"
+    }, (0,preact_module.h)("div", {
+      class: "countdown_electric_label"
+    }, this.props.t('hour')), (0,preact_module.h)("div", {
+      class: "countdown_electric_numbers"
+    }, (0,preact_module.h)("div", {
+      class: "countdown_electric_number",
+      style: util/* default */.Z.js2css({
+        font_size: fs,
+        font_family: this.props.plugin.popup.font_family
+      })
+    }, hour0), (0,preact_module.h)("div", {
+      class: "countdown_electric_number",
+      style: util/* default */.Z.js2css({
+        font_size: fs,
+        font_family: this.props.plugin.popup.font_family
+      })
+    }, hour1))), (0,preact_module.h)("div", {
+      class: "countdown_electric_group"
+    }, (0,preact_module.h)("div", {
+      class: "countdown_electric_label"
+    }, this.props.t('min')), (0,preact_module.h)("div", {
+      class: "countdown_electric_numbers"
+    }, (0,preact_module.h)("div", {
+      class: "countdown_electric_number",
+      style: util/* default */.Z.js2css({
+        font_size: fs,
+        font_family: this.props.plugin.popup.font_family
+      })
+    }, min0), (0,preact_module.h)("div", {
+      class: "countdown_electric_number",
+      style: util/* default */.Z.js2css({
+        font_size: fs,
+        font_family: this.props.plugin.popup.font_family
+      })
+    }, min1))), (0,preact_module.h)("div", {
+      class: "countdown_electric_group"
+    }, (0,preact_module.h)("div", {
+      class: "countdown_electric_label"
+    }, this.props.t('sec')), (0,preact_module.h)("div", {
+      class: "countdown_electric_numbers"
+    }, (0,preact_module.h)("div", {
+      class: "countdown_electric_number",
+      style: util/* default */.Z.js2css({
+        font_size: fs,
+        font_family: this.props.plugin.popup.font_family
+      })
+    }, sec0), (0,preact_module.h)("div", {
+      class: "countdown_electric_number",
+      style: util/* default */.Z.js2css({
+        font_size: fs,
+        font_family: this.props.plugin.popup.font_family
+      })
+    }, sec1))));
+  }
+  renderFlipCountdown(day, hour0, hour1, min0, min1, sec0, sec1) {
+    let $day = null;
+    if (day > 99) day = 99;
+    if (day > 0) {
+      let day0 = Math.floor(day / 10) + '';
+      let day1 = day % 10 + '';
+      $day = (0,preact_module.h)("div", {
+        class: "countdown_group"
+      }, (0,preact_module.h)(Flip, {
+        key: this.state.flipKey + 4,
+        value: day0 + '' + day1,
+        plugin: this.props.plugin,
+        com: this.props.com
+      }), (0,preact_module.h)("div", {
+        class: "countdown_label"
+      }, this.props.t('day')));
+    }
+    return (0,preact_module.h)("div", {
+      class: "countdown"
+    }, $day, (0,preact_module.h)("div", {
+      class: "countdown_group"
+    }, (0,preact_module.h)(Flip, {
+      key: this.state.flipKey + 1,
+      value: hour0 + '' + hour1,
+      plugin: this.props.plugin,
+      com: this.props.com
+    }), (0,preact_module.h)("div", {
+      class: "countdown_label"
+    }, this.props.t('hour'))), (0,preact_module.h)("div", {
+      class: "countdown_group"
+    }, (0,preact_module.h)(Flip, {
+      key: this.state.flipKey + 2,
+      value: min0 + '' + min1,
+      plugin: this.props.plugin,
+      com: this.props.com
+    }), (0,preact_module.h)("div", {
+      class: "countdown_label"
+    }, this.props.t('min'))), (0,preact_module.h)("div", {
+      class: "countdown_group"
+    }, (0,preact_module.h)(Flip, {
+      key: this.state.flipKey + 3,
+      value: sec0 + '' + sec1,
+      plugin: this.props.plugin,
+      com: this.props.com
+    }), (0,preact_module.h)("div", {
+      class: "countdown_label"
+    }, this.props.t('sec'))));
+  }
+  render() {
+    let delta = this.getCountDownDeltaSec(this.props.com.countdown);
+    let day = Math.floor(delta / 86400);
+    let hour = Math.floor((delta - day * 86400) / 3600);
+    let min = Math.floor((delta - day * 86400 - hour * 3600) / 60);
+    let sec = delta - day * 86400 - hour * 3600 - min * 60;
+    let sec0 = Math.floor(sec / 10) + '';
+    let sec1 = sec % 10 + '';
+    let min0 = Math.floor(min / 10) + '';
+    let min1 = min % 10 + '';
+    let hour0 = Math.floor(hour / 10) + '';
+    let hour1 = hour % 10 + '';
+    if (this.props.com.countdown.skin === 'electric') {
+      return this.renderElectricCountdown(day, hour0, hour1, min0, min1, sec0, sec1);
+    }
+    return this.renderFlipCountdown(day, hour0, hour1, min0, min1, sec0, sec1);
+  }
+}
+const WEEKDAY_INDEX = {
+  sunday: 0,
+  monday: 1,
+  tuesday: 2,
+  wednesday: 3,
+  thursday: 4,
+  friday: 5,
+  saturday: 6
+};
+class Flip extends common/* Com */.up {
+  constructor(props) {
+    super(props);
+    this._tickRef = (0,preact_module/* createRef */.Vf)();
+  }
+  componentDidMount() {
+    this._tickInstance = tick_core_commonjs.DOM.create(this._tickRef.current, {
+      value: this.props.value
+    });
+  }
+  componentDidUpdate() {
+    if (!this._tickInstance) return;
+    this._tickInstance.value = this.props.value;
+  }
+  componentWillUnmount() {
+    if (!this._tickInstance) return;
+    tick_core_commonjs.DOM.destroy(this._tickRef.current);
+  }
+  render() {
+    let fs = '28px';
+    if (this.props.com.countdown.size === 'sm') fs = '20px';
+    if (this.props.com.countdown.size === 'lg') fs = '40px';
+    return (0,preact_module.h)("div", {
+      ref: this._tickRef,
+      class: "tick"
+    }, (0,preact_module.h)("div", {
+      "data-repeat": "true",
+      "aria-hidden": "true"
+    }, (0,preact_module.h)("span", {
+      "data-view": "flip",
+      style: util/* default */.Z.js2css({
+        font_size: fs,
+        font_family: this.props.plugin.popup.font_family
+      })
+    })));
+  }
+}
+;// CONCATENATED MODULE: ./src/popup/popup.js
+function popup_defineProperty(obj, key, value) { key = popup_toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function popup_toPropertyKey(arg) { var key = popup_toPrimitive(arg, "string"); return typeof key === "symbol" ? key : String(key); }
+function popup_toPrimitive(input, hint) { if (typeof input !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (typeof res !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
+
+
+
+
+let popupCSS = (() => __webpack_require__.e(/* import() */ 782).then(__webpack_require__.bind(__webpack_require__, 9782)))();
+class Popup extends common/* Com */.up {
+  constructor(props) {
+    super(props);
+    popup_defineProperty(this, "state", {
+      close: false,
+      cssready: false,
+      closeAnimation: true,
+      pressedSubmit: false,
+      imageReady: false,
+      fontReady: false
+    });
+    this._formRef = (0,preact_module/* createRef */.Vf)();
+    util/* default */.Z.setTimeout(() => this.fillForm(), 1000);
+    util/* default */.Z.setTimeout(async () => {
+      let {
+        body: impression
+      } = await this.props.store.sendImpression(this.props.plugin.id);
+      this.impressionToken = util/* default */.Z.get(impression, 'impression_token') || '';
+    }, 10);
+    util/* default */.Z.setTimeout(() => {
+      let fonts = {};
+      fonts[this.props.plugin.popup.font_family] = true;
+      let images = {};
+      util/* default */.Z.map(this.props.plugin.popup.pages, page => {
+        if (!page) return;
+        util/* default */.Z.map(page.components, com => {
+          fonts[util/* default */.Z.get(com, 'style.font_family')] = true;
+          fonts[util/* default */.Z.get(com, 'mobile_style.font_family')] = true;
+          if (com.type === 'image' && com.image && com.image.url && com.image.url.startsWith('http')) {
+            images[com.image.url] = true;
+          }
+        });
+      });
+      delete fonts.undefined;
+      delete fonts.null;
+      delete fonts[''];
+      if (util/* default */.Z.size(images) == 0) this.setState({
+        imageReady: true
+      });
+      util/* default */.Z.map(images, (_, image) => util/* default */.Z.preloadImg(image, () => this.setState({
+        imageReady: true
+      })));
+      util/* default */.Z.preloadWebfonts(Object.keys(fonts));
+      util/* default */.Z.setTimeout(async () => {
+        await this.waitForFont(Object.keys(fonts));
+        this.setState({
+          fontReady: true
+        });
+      });
+    });
+  }
+  async waitForFont(fonts) {
+    if (util/* default */.Z.size(fonts) == 0) return;
+    let ready = {};
+    for (var t = 0; t < 10; t++) {
+      for (var i = 0; i < fonts.length; i++) {
+        try {
+          if (document.fonts.check('normal 16px ' + fonts[i])) ready[fonts[i]] = true;
+          if (Object.keys(readycount) == fonts.length) return;
+        } catch (e) {}
+      }
+      await util/* default */.Z.sleep(200);
+    }
+    return;
+  }
+  openPopup() {
+    this.setState({
+      close: false
+    });
+  }
+  getPageIndex() {
+    if (this.props.plugin._page_index !== undefined) return this.props.plugin._page_index;
+    return this.props.pageIndex;
+  }
+  isFormFilled() {
+    let page = util/* default */.Z.get(this.props.plugin.popup, `pages.${this.getPageIndex()}`);
+    let form = util/* default */.Z.find(page.components, com => com.type === 'form');
+    if (!form || !form.form) return true;
+    let fields = util/* default */.Z.get(form, 'form.fields', []);
+    let wrong = util/* default */.Z.find(fields, field => {
+      if (!field.is_required) return false;
+      if (!this.isFieldValid(field.key, field.validate)) return true;
+      return this.isFieldEmpty(field.key);
+    });
+    return !wrong;
+  }
+  fillForm() {
+    let page = util/* default */.Z.get(this.props.plugin.popup, `pages.${this.getPageIndex()}`);
+    let form = util/* default */.Z.find(page.components, com => com.type === 'form');
+    if (!form) return;
+    let user = this.props.store.matchUser();
+    let userAttributes = util/* default */.Z.get(user, 'attributes');
+    let fields = util/* default */.Z.get(form, 'form.fields', []);
+    util/* default */.Z.each(fields, field => {
+      let fieldkey = field.key;
+      if (fieldkey === 'email') fieldkey = 'emails';
+      if (fieldkey === 'phone') fieldkey = 'phones';
+      if (fieldkey !== 'emails' || fieldkey != 'phones' || fieldkey !== 'fullname') return;
+      util/* default */.Z.map(userAttributes, attr => {
+        if (fieldkey !== attr.key) return;
+        var input = this._formRef.current.elements[field.key];
+        if (!input) return;
+        input.value = attr.text;
+      });
+    });
+  }
+  isFieldValid(key, validate) {
+    if (!validate) return true;
+    if (!this._formRef || !this._formRef.current) return false;
+    var formData = new FormData(this._formRef.current);
+    for (var pair of formData.entries()) {
+      if (pair[0] !== key) continue;
+      if (validate === 'email') return util/* default */.Z.isEmail(pair[1]);
+      if (validate === 'phone') return util/* default */.Z.isPhone(pair[1]);
+      if (validate === 'url') return util/* default */.Z.isURL(pair[1]);
+      if (validate === 'number') return util/* default */.Z.isNumber(pair[1]);
+      return true;
+    }
+    return true;
+  }
+  isFieldEmpty(key) {
+    if (!this._formRef || !this._formRef.current) return false;
+    var formData = new FormData(this._formRef.current);
+    for (var pair of formData.entries()) {
+      if (pair[0] !== key) continue;
+      return pair[1] === '' || pair[1] === undefined;
+    }
+    return true;
+  }
+  renderCloseButton() {
+    if (!this.props.plugin.popup.show_close_button) return null;
+    return (0,preact_module.h)("div", {
+      class: 'btn_close default',
+      onClick: e => this.setClose(true)
+    }, (0,preact_module.h)("svg", {
+      class: "btn_close__icon",
+      xmlns: "http://www.w3.org/2000/svg",
+      width: "24",
+      height: "24",
+      viewBox: "0 0 24 24",
+      "stroke-linecap": "round",
+      "stroke-linejoin": "round"
+    }, (0,preact_module.h)("line", {
+      x1: "17",
+      y1: "7",
+      x2: "7",
+      y2: "17",
+      style: "stroke-width: 3 !important;"
+    }), (0,preact_module.h)("line", {
+      x1: "7",
+      y1: "7",
+      x2: "17",
+      y2: "17",
+      style: "stroke-width: 3 !important;"
+    })));
+  }
+  setClose(close) {
+    if (close) {
+      document.body.style.setProperty('overflow', this.lastoverflow);
+      this.setState({
+        closeAnimation: true
+      });
+      util/* default */.Z.setTimeout(() => this.setState({
+        close: true,
+        closeAnimation: false
+      }), 150);
+      if (this.props.plugin._dont_close) util/* default */.Z.setTimeout(() => {
+        this.lastoverflow = window.getComputedStyle(document.body).getPropertyValue('overflow');
+        document.body.style.setProperty('overflow', 'hidden', 'important');
+        this.setState({
+          closeAnimation: false,
+          close: false
+        });
+      }, 1500);
+    } else {
+      this.lastoverflow = window.getComputedStyle(document.body).getPropertyValue('overflow');
+      document.body.style.setProperty('overflow', 'hidden', 'important');
+      this.setState({
+        closeAnimation: false
+      });
+    }
+  }
+  onButtonClick(e, buttontype) {
+    e.stopPropagation();
+    let popup = util/* default */.Z.get(this.props.plugin, 'popup', {});
+    let page = util/* default */.Z.get(this.props.plugin.popup, `pages.${this.getPageIndex()}`);
+    let actions = [];
+    let buttons = util/* default */.Z.find(page.components, com => com.type === 'buttons');
+    if (buttontype === 'background') actions = util/* default */.Z.get(page, 'background_click.actions') || [];
+    if (buttontype === 'primary' && buttons.buttons.primary_enabled) actions = buttons.buttons.primary_actions || [];
+    if (buttontype === 'secondary' && buttons.buttons.secondary_enabled) actions = buttons.buttons.secondary_actions || [];
+    let mustfillform = false;
+    for (let a of actions) {
+      if (a.action === 'conversion' || a.action === 'submit') {
+        mustfillform = true;
+        this.setState({
+          pressedSubmit: true
+        });
+      }
+    }
+    if (mustfillform && !this.isFormFilled()) return;
+    var hasConversion = false;
+    for (let a of actions) {
+      if (a.action === 'submit' || a.action === 'conversion') hasConversion = true;
+    }
+    if (hasConversion) {
+      var formData = this._formRef.current ? new FormData(this._formRef.current) : new FormData();
+      var summitFields = [];
+      let user = util/* default */.Z.cloneDeep(this.props.store.matchUser());
+      let is_lead = false;
+      let modifiedPairs = {};
+      for (var pair of formData.entries()) {
+        if (modifiedPairs[pair[0]]) {
+          let currentValue = util/* default */.Z.get(modifiedPairs, `${pair[0]}.1`, '');
+          currentValue += `,${pair[1]}`;
+          util/* default */.Z.set(modifiedPairs, `${pair[0]}.1`, currentValue);
+        } else {
+          modifiedPairs[pair[0]] = [pair[0], pair[1]];
+        }
+      }
+      for (const [_, pair] of Object.entries(modifiedPairs)) {
+        let page = util/* default */.Z.get(this.props.plugin.popup, `pages.${this.getPageIndex()}`);
+        let form = util/* default */.Z.find(page.components, com => com.type === 'form');
+        let fields = util/* default */.Z.get(form, 'form.fields', []);
+        let field = util/* default */.Z.find(fields, field => field.key === pair[0]) || {};
+        if (!field.type) return;
+        summitFields.push({
+          key: pair[0],
+          type: field.type,
+          value: util/* default */.Z.stringify(pair[1])
+        });
+        let key = pair[0];
+        if (key === 'email') key = 'emails';
+        if (key === 'phone') key = 'phones';
+        is_lead = is_lead || key == 'emails' || key == 'phones';
+        util/* default */.Z.setUserAttr(user, {
+          key: key,
+          text: pair[1]
+        });
+      }
+      if (is_lead) util/* default */.Z.setUserAttr(user, {
+        key: 'lead_source',
+        text: 'plugin.' + this.props.plugin.id
+      });
+      this.props.store.sendConversion(this.props.plugin.id, summitFields, this.impressionToken);
+      this.props.store.setUser(user);
+    }
+    for (let a of actions) {
+      if (a.action === 'open_widget') this.props.showWidget('list');
+    }
+    for (let a of actions) {
+      if (a.action === 'close') util/* default */.Z.setTimeout(() => this.setClose(true), 100);
+      if (a.action === 'next_page') this.props.nextPage();
+    }
+    for (let a of actions) {
+      if (!a.url) continue;
+      let url = a.url;
+      if (!url.startsWith('http://') && !url.startsWith('https://')) url = '//' + url;
+      if (a.action === 'open_url' && a.new_tab) return window.open(url, '_blank');
+      if (a.action === 'open_url' && !a.new_tab) {
+        window.location.href = url;
+        return;
+      }
+    }
+  }
+  renderButtons(com, page) {
+    let popup = util/* default */.Z.get(this.props.plugin, 'popup', {});
+    let buttonsstyle = com.style || {};
+    let primarystyle = Object.assign({}, buttonsstyle);
+    delete primarystyle.justify_content;
+    delete primarystyle.align_items;
+    delete primarystyle.flex_direction;
+    delete primarystyle.display;
+    primarystyle.color = primarystyle.color || '#fff';
+    primarystyle.font_weight = primarystyle.font_weight || '500';
+    primarystyle.font_size = primarystyle.font_size || popup.font_size || '14px';
+    primarystyle.background = primarystyle.background || popup.text_color;
+    if (this.props.mobile && com.mobile_style) {
+      primarystyle = Object.assign(primarystyle, com.mobile_style);
+    }
+    let $primary = null;
+    if (com.buttons.primary_enabled && com.buttons.primary_text) {
+      let style = Object.assign({
+        font_size: popup.font_size || '14px'
+      }, page.primary_button);
+      if (util/* default */.Z.get(com, 'style.background')) style.background = com.style.background;
+      if (util/* default */.Z.get(com, 'style.color')) style.color = com.style.color;
+      $primary = (0,preact_module.h)("div", {
+        class: 'btn btn__primary ',
+        style: this.js2css(primarystyle),
+        onClick: e => this.onButtonClick(e, 'primary')
+      }, this.props.t.i18n(com.buttons.i18n_primary_text) || com.buttons.primary_text);
+    }
+    let $secondary = null;
+    if (com.buttons.secondary_enabled && com.buttons.secondary_text) {
+      let style = Object.assign({
+        font_size: popup.font_size || '14px'
+      }, page.secondary_button);
+      if (this.props.mobile && com.mobile_style) {
+        style = Object.assign(style, com.mobile_style);
+      }
+      $secondary = (0,preact_module.h)("div", {
+        class: 'btn btn__secondary',
+        style: this.js2css(style),
+        onClick: e => this.onButtonClick(e, 'secondary')
+      }, this.props.t.i18n(com.buttons.i18n_secondary_text) || com.buttons.secondary_text);
+    }
+    return (0,preact_module.h)("div", {
+      class: "popup_component",
+      style: this.js2css({
+        display: 'flex',
+        flex_direction: buttonsstyle.flex_direction,
+        align_items: buttonsstyle.align_items
+      })
+    }, $primary, (0,preact_module.h)("div", {
+      style: this.js2css({
+        width: '10px',
+        height: '1px'
+      })
+    }), $secondary);
+  }
+  js2css(js, onlyProps) {
+    let spacer = this.props.plugin.popup.spacer || 10;
+    return util/* default */.Z.js2css(js, onlyProps, {
+      '@font_size': this.props.plugin.popup.font_size,
+      '@font_family': this.props.plugin.popup.font_family,
+      '@text_color': this.props.plugin.popup.text_color,
+      '@faded_text_color': this.props.plugin.popup.faded_text_color,
+      '@primary_color': this.props.plugin.popup.primary_color,
+      '@spacer0': spacer / 2 + 'px',
+      '@spacer': spacer + 'px',
+      '@spacer2': spacer * 2 + 'px',
+      '@spacer3': spacer * 3 + 'px'
+    });
+  }
+  renderSingleChoiceField(field) {
+    var cls = 'form-control form-control__select ' + this.props.plugin.popup.theme;
+    let $options = util/* default */.Z.map(field.options, option => {
+      return (0,preact_module.h)("label", {
+        class: cls
+      }, (0,preact_module.h)("input", {
+        type: "radio",
+        name: field.key,
+        value: option.value
+      }), (0,preact_module.h)("span", null, this.props.t.i18n(option.i18n_label) || option.label));
+    });
+    return (0,preact_module.h)(preact_module/* Fragment */.HY, null, $options);
+  }
+  renderDropdownField(field) {
+    let $options = util/* default */.Z.map(field.options, option => {
+      return (0,preact_module.h)("option", {
+        value: option.value
+      }, option.value);
+    });
+    let theme = util/* default */.Z.get(this.props.plugin, 'popup.theme');
+    var cls = 'form-control form-control__select ' + theme;
+    if (theme === 'vintage') {
+      return (0,preact_module.h)("div", {
+        class: "form-control__text_container"
+      }, (0,preact_module.h)("div", {
+        class: "form-control_inside_label form-label vintage"
+      }, this.props.t.i18n(field.i18n_label) || field.label), (0,preact_module.h)("select", {
+        class: cls,
+        name: field.key
+      }, $options));
+    }
+    return (0,preact_module.h)("select", {
+      class: cls,
+      name: field.key
+    }, $options);
+  }
+  renderMutiChoiceField(field) {
+    var cls = 'form-control form-control__check ' + this.props.plugin.popup.theme;
+    let $options = util/* default */.Z.map(field.options, option => {
+      return (0,preact_module.h)("label", {
+        class: cls
+      }, (0,preact_module.h)("input", {
+        required: field.is_required,
+        type: "checkbox",
+        name: field.key,
+        value: option.value
+      }), (0,preact_module.h)("span", null, this.props.t.i18n(option.i18n_label) || option.label));
+    });
+    return (0,preact_module.h)(preact_module/* Fragment */.HY, null, $options);
+  }
+  renderTextField(field) {
+    let theme = util/* default */.Z.get(this.props.plugin, 'popup.theme');
+    var cls = 'form-control form-control__text ' + theme;
+    if (theme === 'simple') {
+      return (0,preact_module.h)("input", {
+        type: field.type,
+        class: "form-control form-control__text simple",
+        key: 'form_field_' + field.key,
+        name: field.key,
+        placeholder: this.props.t.i18n(field.i18n_label) || field.label || this.props.t.i18n(field.i18n_placeholder) || field.placeholder
+      });
+    }
+    if (theme === 'vintage') {
+      return (0,preact_module.h)("div", {
+        class: "form-control__text_container"
+      }, (0,preact_module.h)("div", {
+        class: "form-control_inside_label form-label vintage"
+      }, this.props.t.i18n(field.i18n_label) || field.label), (0,preact_module.h)("input", {
+        type: field.type,
+        class: cls,
+        key: 'form_field_' + field.key,
+        name: field.key,
+        placeholder: this.props.t.i18n(field.i18n_placeholder) || field.placeholder
+      }));
+    }
+    return (0,preact_module.h)("input", {
+      type: field.type,
+      class: cls,
+      key: 'form_field_' + field.key,
+      name: field.key,
+      placeholder: this.props.t.i18n(field.i18n_placeholder) || field.placeholder
+    });
+  }
+  renderMultilineTextField(field) {
+    let theme = util/* default */.Z.get(this.props.plugin, 'popup.theme');
+    var cls = 'form-control form-control__text ' + theme;
+    if (theme === 'simple') {
+      return (0,preact_module.h)("textarea", {
+        rows: "3",
+        name: field.key,
+        type: field.type,
+        key: 'form_field_' + field.key,
+        class: "form-control form-control__text simple",
+        style: this.js2css({
+          overflow: 'auto',
+          resize: 'none'
+        }),
+        placeholder: this.props.t.i18n(field.i18n_label) || field.label || this.props.t.i18n(field.i18n_placeholder) || field.placeholder
+      });
+    }
+    if (theme === 'vintage') {
+      return (0,preact_module.h)("div", {
+        class: "form-control__text_container"
+      }, (0,preact_module.h)("div", {
+        class: "form-control_inside_label form-label vintage"
+      }, field.label), (0,preact_module.h)("textarea", {
+        rows: "3",
+        name: field.key,
+        type: field.type,
+        key: 'form_field_' + field.key,
+        class: cls,
+        style: this.js2css({
+          overflow: 'auto',
+          resize: 'none'
+        }),
+        placeholder: this.props.t.i18n(field.i18n_label) || field.label || this.props.t.i18n(field.i18n_placeholder) || field.placeholder
+      }));
+    }
+    return (0,preact_module.h)("textarea", {
+      rows: "3",
+      name: field.key,
+      type: field.type,
+      key: 'form_field_' + field.key,
+      class: cls,
+      style: this.js2css({
+        overflow: 'auto',
+        resize: 'none'
+      }),
+      placeholder: this.props.t.i18n(field.i18n_placeholder) || field.placeholder
+    });
+  }
+  renderFormComponent(com) {
+    let popup = util/* default */.Z.get(this.props.plugin, 'popup', {});
+    let $fields = util/* default */.Z.map(com.form.fields, field => {
+      if (field.type === 'email') return this.renderTextField(field);
+      if (field.type === 'single-choice') return this.renderSingleChoiceField(field);
+      if (field.type === 'multiple-choice') return this.renderMutiChoiceField(field);
+      if (field.type === 'multiline-text') return this.renderMultilineTextField(field);
+      if (field.type === 'text') return this.renderTextField(field);
+      if (field.type === 'dropdown') return this.renderDropdownField(field);
+      return;
+    });
+    let theme = util/* default */.Z.get(popup, 'theme');
+    $fields = util/* default */.Z.map($fields, ($field, i) => {
+      let $label = null;
+      let field = com.form.fields[i];
+      $label = (0,preact_module.h)("div", {
+        class: "form-label",
+        style: this.js2css({
+          color: popup.text_color,
+          font_family: popup.font_family,
+          font_size: popup.font_size || '14px'
+        })
+      }, this.props.t.i18n(field.i18n_label) || field.label);
+      if (theme === 'vintage' && field.type === 'dropdown') $label = null;
+      if (theme === 'vintage' || theme === 'simple') {
+        if (field.type === 'email' || field.type === 'text' || field.type === 'multiline-text') $label = null;
+      }
+      let $error = null;
+      if (this.state.pressedSubmit && !this.isFieldValid(field.key, field.validate)) {
+        $error = (0,preact_module.h)("div", {
+          class: "text__danger ",
+          style: this.js2css({
+            margin_top: '5px',
+            font_family: popup.font_family,
+            font_size: popup.font_size
+          })
+        }, this.props.t('invalid_field'));
+      }
+      if (this.state.pressedSubmit && field.is_required && this.isFieldEmpty(field.key)) {
+        $error = (0,preact_module.h)("div", {
+          class: "text__danger ",
+          style: this.js2css({
+            margin_top: '5px',
+            font_family: popup.font_family,
+            font_size: popup.font_size
+          })
+        }, this.props.t('required'));
+      }
+      return (0,preact_module.h)("div", {
+        class: "field"
+      }, $label, $field, $error);
+    });
+    return (0,preact_module.h)("form", {
+      style: this.js2css(com.style),
+      class: "form popup_component",
+      ref: this._formRef,
+      onClick: e => e.stopPropagation()
+    }, $fields);
+  }
+  renderComponents(page) {
+    let buttons = util/* default */.Z.find(page.components, com => com.type === 'buttons');
+    let $buttons = null;
+    if (buttons) $buttons = this.renderButtons(buttons, page);
+    let comIndexWithoutImg = 0;
+    return util/* default */.Z.map(page.components, (com, i) => {
+      if (com.type === 'image') return null;
+      comIndexWithoutImg++;
+      if (com.type === 'buttons') return $buttons;
+      if (com.type === 'follow_facebook') return this.renderFollowFacebook(com);
+      if (com.type === 'social_buttons') return this.renderSocialButtons(com);
+      if (com.type === 'line') return this.renderLineComponent(com);
+      if (com.type === 'text') return this.renderTextComponent(com, comIndexWithoutImg === 1);
+      if (com.type === 'form') return this.renderFormComponent(com);
+      if (com.type === 'countdown') return (0,preact_module.h)("div", {
+        class: "popup_component",
+        onClick: e => e.stopPropagation()
+      }, (0,preact_module.h)(Countdown, {
+        destroy: this.props.destroy,
+        t: this.props.t,
+        com: com,
+        store: this.props.store,
+        plugin: this.props.plugin
+      }));
+    });
+  }
+  renderFollowFacebook(com) {
+    let fburl = util/* default */.Z.get(com, 'follow_facebook.url');
+    if (!fburl) return null;
+    let style = this.props.mobile && com.mobile_style || com.style;
+    let containerstyle = {
+      display: 'flex',
+      justify_content: style.justify_content
+    };
+    let textstyle = {};
+    textstyle.font_family = style.font_family || this.props.plugin.popup.font_family;
+    textstyle.font_size = style.font_size || this.props.plugin.popup.font_size || '14px';
+    return (0,preact_module.h)("div", {
+      class: "popup_component",
+      style: this.js2css(containerstyle),
+      onClick: e => e.stopPropagation()
+    }, (0,preact_module.h)("div", {
+      class: "follow_fb_btn"
+    }, (0,preact_module.h)("img", {
+      alt: "follow",
+      class: "follow_fb_btn__img",
+      src: __webpack_require__(9639)
+    }), (0,preact_module.h)("span", {
+      style: this.js2css(Object.assign({
+        white_space: 'nowrap',
+        overflow: 'hidden',
+        text_overflow: 'ellipsis'
+      }, textstyle))
+    }, this.props.t('follow_us_on_facebook'))));
+  }
+  renderSocialButtons(com) {
+    let fburl = util/* default */.Z.get(com, 'social_buttons.facebook');
+    let $fb = null;
+    if (fburl) {
+      $fb = (0,preact_module.h)("a", {
+        href: fburl,
+        class: "social_button",
+        target: "_blank"
+      }, (0,preact_module.h)("img", {
+        alt: "facebook",
+        class: "social_button__img",
+        src: __webpack_require__(7435)
+      }));
+    }
+    let zlurl = util/* default */.Z.get(com, 'social_buttons.zalo');
+    let $zl = null;
+    if (zlurl) {
+      $zl = (0,preact_module.h)("a", {
+        href: zlurl,
+        class: "social_button",
+        target: "_blank"
+      }, (0,preact_module.h)("img", {
+        alt: "zalo",
+        class: "social_button__img",
+        src: __webpack_require__(7298)
+      }));
+    }
+    let style = this.props.mobile && com.mobile_style || com.style;
+    return (0,preact_module.h)("div", {
+      class: "social_buttons popup_component",
+      style: this.js2css(style),
+      onClick: e => e.stopPropagation()
+    }, $fb, " ", $zl);
+  }
+  renderImageComponent(com, i) {
+    let style = Object.assign({
+      pointer_events: 'none'
+    }, this.props.mobile && com.mobile_style || com.style, {
+      position: 'absolute'
+    });
+    if (!style.z_index) style.z_index = '-1';
+    return (0,preact_module.h)("div", {
+      style: this.js2css(style)
+    }, (0,preact_module.h)("div", {
+      id: 'image_component_' + this.props.plugin.id + '_' + this.getPageIndex() + '_' + i,
+      style: this.js2css({
+        width: '100%',
+        height: '100%',
+        background_image: `url("${encodeURI(util/* default */.Z.get(com, 'image.url'))}")`,
+        background_size: style.background_size || 'cover',
+        background_position: style.background_position || 'auto'
+      })
+    }));
+  }
+  renderLineComponent(com) {
+    let style = this.props.mobile && com.mobile_style || com.style;
+    return (0,preact_module.h)("div", {
+      class: "popup_component",
+      style: this.js2css(style)
+    });
+  }
+  renderTextComponent(com, isFirst) {
+    let popup = util/* default */.Z.get(this.props.plugin, 'popup', {});
+    let style = Object.assign({
+      color: popup.text_color,
+      font_family: popup.font_family,
+      font_size: popup.font_size || '14px',
+      white_space: 'pre-wrap'
+    }, this.props.mobile && com.mobile_style || com.style);
+    delete style.margin_top;
+    return (0,preact_module.h)("div", {
+      class: "text popup_component",
+      style: this.js2css(style),
+      onClick: e => e.stopPropagation()
+    }, this.props.t.i18n(util/* default */.Z.get(com, 'text.i18n_html')) || util/* default */.Z.get(com, 'text.html'));
+  }
+  async refreshCSS() {
+    let plugins = this.props.store.matchPlugin();
+    let found = util/* default */.Z.find(plugins, plugin => plugin.id === this.props.plugin.id);
+    if (!found) return;
+    let css = (await popupCSS).default.default.toString();
+    var outcss = util/* default */.Z.replaceCssVariablePlugin(css, this.props.plugin.popup);
+    let extra_css = util/* default */.Z.get(this.props.plugin, `popup.pages.0.extra_css`, []);
+    let extra_css_string = util/* default */.Z.map(extra_css, css => `#sbz92 ${css.selector} { ${this.js2css(css.style)}}`).join('\n');
+    outcss += extra_css_string;
+    util/* default */.Z.setCss(this.props.plugin.id, this.$cssStyleDiv, outcss);
+  }
+  componentWillUnmount() {
+    util/* default */.Z.setCss(this.props.plugin.id, this.$cssStyleDiv, '');
+  }
+  async componentDidMount() {
+    this.$cssStyleDiv = document.getElementById('subiz-style-for-' + this.props.plugin.id);
+    if (!this.$cssStyleDiv) {
+      this.$cssStyleDiv = document.createElement('style');
+      document.head.appendChild(this.$cssStyleDiv);
+      this.$cssStyleDiv.type = 'text/css';
+      this.$cssStyleDiv.id = 'subiz-style-for-' + this.props.plugin.id;
+    }
+    this.props.store.onResetCSS(this, () => this.refreshCSS());
+    await this.refreshCSS();
+    util/* default */.Z.setTimeout(() => {
+      this.setState({
+        cssready: true
+      });
+      this.setClose(false);
+    }, 50);
+  }
+  calculateContainerCss(popup, page) {
+    let pos = popup.position || 'center';
+    let pagestyle = Object.assign({
+      display: 'flex'
+    }, this.props.mobile && page.mobile_style || page.style, {
+      max_width: '85%',
+      max_height: '85%'
+    });
+    let containercss = {};
+    util/* default */.Z.map(['left', 'top', 'right', 'bottom', 'box_shadow', 'transform'], prop => {
+      containercss[prop] = pagestyle[prop];
+    });
+    containercss.position = 'absolute';
+    if (pos === 'center' || !pos) {
+      containercss.top = '50%';
+      containercss.transform = 'translateY(-50%) translateX(-50%)';
+      containercss.left = '50%';
+      delete containercss.right;
+      delete containercss.bottom;
+    }
+    if (pos === 'fullscreen') {
+      containercss.top = 0;
+      containercss.left = 0;
+      containercss.right = 0;
+      containercss.bottom = 0;
+      containercss.display = 'flex';
+      containercss.align_items = 'center';
+      containercss.background = popup.background;
+      delete containercss.width;
+      delete containercss.height;
+      delete containercss.transform;
+    }
+    if (pos === 'top-left') {
+      containercss.top = containercss.top || '0px';
+      containercss.left = containercss.left || '0px';
+      delete containercss.transform;
+      delete containercss.right;
+      delete containercss.bottom;
+    }
+    if (pos === 'top-right') {
+      containercss.top = containercss.top || '0px';
+      containercss.right = containercss.right || '0px';
+      delete containercss.transform;
+      delete containercss.left;
+      delete containercss.bottom;
+    }
+    if (pos === 'top-center') {
+      containercss.transform = 'translateX(-50%)';
+      containercss.left = '50%';
+      containercss.top = containercss.top || '0px';
+      delete containercss.right;
+      delete containercss.bottom;
+    }
+    if (pos === 'middle-left') {
+      containercss.top = '50%';
+      containercss.transform = 'translateY(-50%)';
+      containercss.left = containercss.left || '0px';
+      delete containercss.right;
+      delete containercss.bottom;
+    }
+    if (pos === 'middle-right') {
+      containercss.top = '50%';
+      containercss.transform = 'translateY(-50%)';
+      containercss.right = containercss.right || '0px';
+      delete containercss.left;
+      delete containercss.bottom;
+    }
+    if (pos === 'bottom-left') {
+      containercss.bottom = containercss.bottom || '0px';
+      containercss.left = containercss.left || '0px';
+      delete containercss.transform;
+      delete containercss.top;
+      delete containercss.right;
+    }
+    if (pos === 'bottom-right') {
+      containercss.bottom = containercss.bottom || '0px';
+      containercss.right = containercss.right || '0px';
+      delete containercss.transform;
+      delete containercss.top;
+      delete containercss.left;
+    }
+    if (pos === 'bottom-center') {
+      containercss.bottom = containercss.bottom || '0px';
+      containercss.transform = 'translateX(-50%)';
+      containercss.left = '50%';
+      delete containercss.top;
+      delete containercss.right;
+    }
+    containercss.width = pagestyle.width;
+    containercss.height = pagestyle.height;
+    containercss.max_width = pagestyle.max_width;
+    containercss.max_height = pagestyle.max_height;
+    containercss.display = pagestyle.display;
+    containercss.border_radius = pagestyle.border_radius;
+    containercss.overflow = pagestyle.overflow;
+    containercss.box_shadow = pagestyle.box_shadow;
+    if (!popup.type || popup.type === 'modal') {
+      containercss.max_width = '80%';
+      containercss.max_height = '95%';
+    }
+    if (pos === 'fullscreen') {
+      containercss.width = '100%';
+      containercss.height = '100%';
+      containercss.max_width = '100%';
+      containercss.max_height = '100%';
+    }
+    if (popup.type === 'bar') {
+      containercss.width = pagestyle.width || '100%';
+      containercss.max_width = '100%';
+    }
+    return containercss;
+  }
+  render() {
+    if (!this.props.t) return null;
+    if (!this.state.cssready) return null;
+    if (!this.state.imageReady) return null;
+    if (!this.state.fontReady) return null;
+    if (this.state.close) return null;
+    let popup = util/* default */.Z.get(this.props.plugin, 'popup', {});
+    let page = util/* default */.Z.get(popup, `pages.${this.getPageIndex()}`);
+    if (!page) return null;
+    let pagestyle = Object.assign({}, this.props.mobile && page.mobile_style || page.style);
+    let containercss = this.calculateContainerCss(popup, page);
+    let animation = '';
+    let pos = util/* default */.Z.get(this.props.plugin, 'popup.position', 'center');
+    if (pos === 'center' || !pos) {
+      animation = 'zoomInCenter';
+      if (this.state.closeAnimation) animation = 'zoomOutCenter';
+    }
+    if (pos === 'bottom-left' || pos === 'bottom-right') animation = 'fadeInUpBig';
+    if (pos === 'top-left' || pos === 'top-right') animation = 'fadeInDown';
+    if (pos === 'top-center') animation = 'fadeInDownCenter';
+    if (pos === 'middle-left') animation = 'fadeInLeftBig';
+    if (pos === 'middle-right') animation = 'fadeInRightBig';
+    if (pos === 'bottom-center') animation = 'fadeInUpCenter';
+    let layout = util/* default */.Z.get(page, 'layout');
+    if (this.props.mobile) layout = util/* default */.Z.get(page, 'mobile_layout');
+    let formcss = {
+      display: pagestyle.display,
+      align_items: pagestyle.align_items,
+      justify_content: pagestyle.justify_content,
+      padding_top: pagestyle.padding_top,
+      padding_left: pagestyle.padding_left,
+      padding_right: pagestyle.padding_right,
+      padding_bottom: pagestyle.padding_bottom,
+      background: pagestyle.background || popup.background || '#fff',
+      border: pagestyle.border,
+      overflow: layout === 'row' ? 'auto' : '',
+      max_height: layout === 'row' ? '100%' : '',
+      min_height: layout === 'row' ? '100%' : ''
+    };
+    let bodycss = {
+      overflow: layout === 'column' ? 'auto' : '',
+      max_height: layout === 'column' ? '100%' : '',
+      width: '100%',
+      position: 'relative',
+      padding_top: pagestyle.margin_top,
+      padding_left: pagestyle.margin_left,
+      padding_right: pagestyle.margin_right,
+      padding_bottom: pagestyle.margin_bottom
+    };
+    if (this.props.highlight === 'padding') {
+      bodycss.background = '#bad14a87';
+      formcss.background = '#ff3d006e';
+    }
+    let overlaystyle = 'position: fixed !important;';
+    if (this.props.plugin._preview) overlaystyle = 'position: absolute !important;';
+    if (popup.overlay) overlaystyle += ' background: #000c !important;';
+    let $imgs = util/* default */.Z.map(page.components, (com, i) => {
+      if (com.type === 'image') return this.renderImageComponent(com, i);
+    });
+    let formComponents = util/* default */.Z.filter(page.components, com => com.type !== 'image');
+    if (!formComponents.length) {
+      formcss.background = 'transparent';
+      formcss.padding_top = '0';
+      formcss.padding_bottom = '0';
+      formcss.padding_left = '0';
+      formcss.padding_right = '0';
+    }
+    return (0,preact_module.h)("div", {
+      class: "overlay",
+      style: overlaystyle
+    }, (0,preact_module.h)("div", {
+      class: animation,
+      style: this.js2css(containercss),
+      onClick: e => e.stopPropagation()
+    }, this.renderCloseButton(), (0,preact_module.h)("div", {
+      style: this.js2css(bodycss),
+      onClick: e => this.onButtonClick(e, 'background')
+    }, $imgs, (0,preact_module.h)("div", {
+      style: this.js2css(formcss),
+      form: true
+    }, this.renderComponents(page)))));
+  }
+}
+
+/***/ }),
+
+/***/ 9980:
+/***/ ((module) => {
+
+module.exports = function () {
+  if (!module) {
+    var module = {};
+  }
+  ;
+  'use strict';
+  var classCallCheck = function (instance, Constructor) {
+    if (!(instance instanceof Constructor)) {
+      throw new TypeError('Cannot call a class as a function');
+    }
+  };
+  var createClass = function () {
+    function defineProperties(target, props) {
+      for (var i = 0; i < props.length; i++) {
+        var descriptor = props[i];
+        descriptor.enumerable = descriptor.enumerable || false;
+        descriptor.configurable = true;
+        if ('value' in descriptor) descriptor.writable = true;
+        Object.defineProperty(target, descriptor.key, descriptor);
+      }
+    }
+    return function (Constructor, protoProps, staticProps) {
+      if (protoProps) defineProperties(Constructor.prototype, protoProps);
+      if (staticProps) defineProperties(Constructor, staticProps);
+      return Constructor;
+    };
+  }();
+  var index = function (_ref) {
+    var DOM = _ref.DOM,
+      animate = _ref.Animation.animate,
+      Extension = _ref.Extension,
+      performance = _ref.Date.performance,
+      _ref$View = _ref.View,
+      rooter = _ref$View.rooter,
+      destroyer = _ref$View.destroyer,
+      drawer = _ref$View.drawer,
+      updater = _ref$View.updater,
+      styler = _ref$View.styler;
+    var easeOutCubic = Extension.getExtension(Extension.Type.EASING_FUNCTION, 'ease-out-cubic');
+    var easeOutSine = Extension.getExtension(Extension.Type.EASING_FUNCTION, 'ease-out-sine');
+    var draw = function draw(state) {
+      if (state.isInitialValue()) {
+        state.root.textContent = '';
+        state.spacer = DOM.create('span', 'tick-flip-spacer');
+        state.root.appendChild(state.spacer);
+        var shadowTop = DOM.create('span', 'tick-flip-shadow-top tick-flip-shadow tick-flip-front');
+        var shadowBottom = DOM.create('span', 'tick-flip-shadow-bottom tick-flip-shadow tick-flip-back');
+        state.root.appendChild(shadowTop);
+        state.root.appendChild(shadowBottom);
+        state.shadowCard = DOM.create('span', 'tick-flip-card-shadow');
+        state.root.appendChild(state.shadowCard);
+      }
+      state.spacer.textContent = state.value;
+      if (!state.isInitialValue() && !DOM.visible(state.root)) {
+        state.cards.forEach(function (card) {
+          card.back = state.value;
+          card.front = state.value;
+        });
+        return;
+      }
+      var turningCard = state.cards[state.cards.length - 1];
+      if (turningCard) {
+        turningCard.waiting = false;
+        turningCard.offset = performance();
+        turningCard.back = state.value;
+      }
+      if (state.isInitialValue()) {
+        var initialBottomCard = new FlipCard();
+        initialBottomCard.back = state.value;
+        initialBottomCard.offset = null;
+        initialBottomCard.progress = 1;
+        state.root.insertBefore(initialBottomCard.root, state.root.firstChild);
+        state.cards.push(initialBottomCard);
+      }
+      var topCard = new FlipCard();
+      topCard.offset = null;
+      topCard.progress = 0;
+      topCard.visual_progress = 0;
+      topCard.waiting = true;
+      topCard.front = state.value;
+      topCard.rotate(0);
+      state.root.insertBefore(topCard.root, state.root.firstChild);
+      state.cards.push(topCard);
+      if (!state.animating) {
+        state.animating = true;
+        var ease = Extension.getExtension(Extension.Type.EASING_FUNCTION, state.style.flipEasing);
+        var tick = function tick() {
+          var cardsToAnimate = state.cards.filter(function (card) {
+            return !card.done && !card.waiting;
+          });
+          if (cardsToAnimate.length === 0) {
+            state.animating = false;
+            return;
+          }
+          cardsToAnimate.forEach(function (card) {
+            if (card.offset !== null) {
+              card.progress = (performance() - card.offset) / state.style.flipDuration;
+            }
+            if (card.progress >= 1) {
+              card.progress = 1;
+              card.done = true;
+            }
+            card.visual_progress = ease(card.progress);
+          });
+          var cardDistance = 0.01;
+          cardsToAnimate.reverse().forEach(function (card, index) {
+            var previousCard = cardsToAnimate[index - 1];
+            if (previousCard && card.visual_progress <= previousCard.visual_progress) {
+              card.visual_progress = previousCard.visual_progress + cardDistance;
+            }
+          });
+          cardsToAnimate.reverse();
+          state.cards.forEach(function (card, index) {
+            var shadowFrontProgress = 1 - Math.abs(card.visual_progress - 0.5) * 2;
+            var highlightBackProgress = 1 - (card.visual_progress - 0.5) / 0.5;
+            card.shadowFront = shadowFrontProgress;
+            card.highlightBack = highlightBackProgress;
+            var cardAbove = state.cards[index + 1];
+            if (cardAbove && card.visual_progress > 0.5 && card.visual_progress > 0) {
+              card.shadowBack = easeOutCubic(cardAbove.visual_progress);
+            }
+          });
+          cardsToAnimate.forEach(function (card, index) {
+            var p = card.visual_progress;
+            if (p > 0.5 && !card.done) {
+              card.root.style.setProperty('z-index', 10 + index, 'important');
+            } else {
+              card.root.style.removeProperty('z-index');
+            }
+            card.rotate(p * -180);
+          });
+          var shadowProgress = 0;
+          var dist = 1;
+          cardsToAnimate.forEach(function (card) {
+            var d = Math.abs(card.visual_progress - 0.5);
+            if (d < dist) {
+              dist = d;
+              shadowProgress = card.visual_progress;
+            }
+          });
+          var s = shadowProgress < 0.5 ? easeOutSine(shadowProgress / 0.5) : easeOutSine((1 - shadowProgress) / 0.5);
+          state.shadowCard.style.setProperty('opacity', s, 'important');
+          DOM.transform(state.shadowCard, 'scaleY', s);
+          state.cards.filter(function (card) {
+            return card.done;
+          }).slice(0, -1).forEach(function (card) {
+            state.cards = state.cards.filter(function (c) {
+              return c !== card;
+            });
+            if (card.root.parentNode) {
+              state.root.removeChild(card.root);
+            }
+          });
+          requestAnimationFrame(tick);
+        };
+        tick();
+      }
+    };
+    var FlipCard = function () {
+      function FlipCard() {
+        classCallCheck(this, FlipCard);
+        this._root = DOM.create('span', 'tick-flip-card');
+        var front = DOM.create('span', 'tick-flip-panel-front tick-flip-front tick-flip-panel');
+        var textFront = DOM.create('span', 'tick-flip-panel-front-text');
+        var textFrontWrapper = DOM.create('span', 'tick-flip-panel-text-wrapper');
+        textFront.appendChild(textFrontWrapper);
+        var shadowFront = DOM.create('span', 'tick-flip-panel-front-shadow');
+        front.appendChild(textFront);
+        front.appendChild(shadowFront);
+        var back = DOM.create('span', 'tick-flip-panel-back tick-flip-back tick-flip-panel');
+        var textBack = DOM.create('span', 'tick-flip-panel-back-text');
+        var textBackWrapper = DOM.create('span', 'tick-flip-panel-text-wrapper');
+        textBack.appendChild(textBackWrapper);
+        var highlightBack = DOM.create('span', 'tick-flip-panel-back-highlight');
+        var shadowBack = DOM.create('span', 'tick-flip-panel-back-shadow');
+        back.appendChild(textBack);
+        back.appendChild(highlightBack);
+        back.appendChild(shadowBack);
+        this._root.appendChild(front);
+        this._root.appendChild(back);
+        this._front = front;
+        this._back = back;
+        this._shadowFront = shadowFront;
+        this._shadowBack = shadowBack;
+        this._highlightBack = highlightBack;
+        this._textBack = textBackWrapper;
+        this._textFront = textFrontWrapper;
+        this._frontValue = null;
+        this._backValue = null;
+      }
+      createClass(FlipCard, [{
+        key: 'rotate',
+        value: function rotate(degrees) {
+          this._front.style.setProperty('transform', 'rotateX(' + degrees + 'deg)', 'important');
+          this._back.style.setProperty('transform', 'rotateX(' + (-180 + degrees) + 'deg)', 'important');
+        }
+      }, {
+        key: 'root',
+        get: function get$$1() {
+          return this._root;
+        }
+      }, {
+        key: 'front',
+        set: function set$$1(value) {
+          this._frontValue = value;
+          this._textFront.textContent = value;
+        },
+        get: function get$$1() {
+          return this._frontValue;
+        }
+      }, {
+        key: 'back',
+        set: function set$$1(value) {
+          this._backValue = value;
+          this._textBack.textContent = value;
+        },
+        get: function get$$1() {
+          return this._backValue;
+        }
+      }, {
+        key: 'highlightBack',
+        set: function set$$1(value) {
+          this._highlightBack.style.setProperty('opacity', value, 'important');
+        }
+      }, {
+        key: 'shadowBack',
+        set: function set$$1(value) {
+          this._shadowBack.style.setProperty('opacity', value, 'important');
+        }
+      }, {
+        key: 'shadowFront',
+        set: function set$$1(value) {
+          this._shadowFront.style.setProperty('opacity', value, 'important');
+        }
+      }]);
+      return FlipCard;
+    }();
+    return function (root) {
+      var state = {
+        cards: [],
+        lastCard: null,
+        initialCard: null,
+        shadowAbove: null,
+        shadowBelow: null,
+        shadowCard: null,
+        currentValue: null,
+        lastValue: null,
+        front: null,
+        back: null
+      };
+      return Object.assign({}, rooter(state, root, 'flip'), updater(state), styler(state, {
+        flipDuration: 800,
+        flipEasing: 'ease-out-bounce'
+      }), drawer(state, draw), destroyer(state));
+    };
+  };
+  module.exports = index;
+  module.exports.identifier = {
+    name: 'flip',
+    type: 'view'
+  };
+  return module.exports;
+}();
+
+/***/ }),
+
+/***/ 7435:
+/***/ ((module, __unused_webpack_exports, __webpack_require__) => {
+
+module.exports = __webpack_require__.p + "assets/img/Facebook.64607ec.png";
+
+/***/ }),
+
+/***/ 7298:
+/***/ ((module, __unused_webpack_exports, __webpack_require__) => {
+
+module.exports = __webpack_require__.p + "assets/img/Zalo.6845707.png";
+
+/***/ }),
+
+/***/ 9639:
+/***/ ((module, __unused_webpack_exports, __webpack_require__) => {
+
+module.exports = __webpack_require__.p + "assets/img/fb_inverse_circle.36c2cfc.png";
+
+/***/ })
+
+}]);