@subiz/widget-v4 4.0.58 → 4.0.63

package/dist/213.js

@@ -1,69 +1,5 @@
 (self["webpackChunk_subiz_widget_v4"] = self["webpackChunk_subiz_widget_v4"] || []).push([[213],{
 
-/***/ 2493:
-/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
-
-"use strict";
-/* harmony export */ __webpack_require__.d(__webpack_exports__, {
-/* harmony export */   "M": () => (/* binding */ Com),
-/* harmony export */   "u": () => (/* binding */ Clickaway)
-/* harmony export */ });
-/* harmony import */ var preact__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(6400);
-/* harmony import */ var _util_index_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(819);
-
-
-class Com extends preact__WEBPACK_IMPORTED_MODULE_0__/* .Component */ .wA {
-  constructor(props) {
-    super(props);
-    this._isMounted = true;
-    setTimeout(() => {
-      if (this.componentWillUnmount) {
-        let old = this.componentWillUnmount.bind(this);
-
-        this.componentWillUnmount = () => {
-          old();
-          this._isMounted = false;
-        };
-      }
-    }, 10);
-  }
-
-}
-class Clickaway extends Com {
-  constructor(props) {
-    super(props);
-    this.setWrapperRef = this.setWrapperRef.bind(this);
-    this.onClick = this.onClick.bind(this);
-  }
-
-  componentDidMount() {
-    document.addEventListener('mousedown', this.onClick);
-  }
-
-  componentWillUnmount() {
-    document.removeEventListener('mousedown', this.onClick);
-  }
-
-  setWrapperRef(node) {
-    this.wrapperRef = node;
-  }
-
-  onClick(event) {
-    if (this.wrapperRef && !this.wrapperRef.contains(event.target)) {
-      this.props.onClickaway && this.props.onClickaway();
-    }
-  }
-
-  render() {
-    return (0,preact__WEBPACK_IMPORTED_MODULE_0__.h)("div", {
-      ref: this.setWrapperRef
-    }, this.props.children);
-  }
-
-}
-
-/***/ }),
-
 /***/ 8213:
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
@@ -1706,22 +1642,19 @@ var tick_view_flip_commonjs_default = /*#__PURE__*/__webpack_require__.n(tick_vi
 // 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) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-
 
 
 
 
 tick_core_commonjs.plugin.add((tick_view_flip_commonjs_default()));
 
-class Countdown extends common/* Com */.M {
+class Countdown extends common/* Com */.up {
+  state = {
+    flipKey: '43'
+  };
+
   constructor(props) {
     super(props);
-
-    _defineProperty(this, "state", {
-      flipKey: '43'
-    });
-
     this.timer = setInterval(() => {
       if (this.props._destroy) return this.componentWillUnmount();
       let cd = this.props.com.countdown || {};
@@ -1927,7 +1860,7 @@ const WEEKDAY_INDEX = {
   saturday: 6
 };
 
-class Flip extends common/* Com */.M {
+class Flip extends common/* Com */.up {
   constructor(props) {
     super(props);
     this._tickRef = (0,preact_module/* createRef */.Vf)();
@@ -1970,8 +1903,6 @@ class Flip extends common/* Com */.M {
 
 }
 ;// CONCATENATED MODULE: ./src/popup/popup.js
-function popup_defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-
 
 
 
@@ -1979,18 +1910,18 @@ function popup_defineProperty(obj, key, value) { if (key in obj) { Object.define
 
 let popupCSS = (() => __webpack_require__.e(/* import() */ 782).then(__webpack_require__.bind(__webpack_require__, 9782)))();
 
-class Popup extends common/* Com */.M {
+class Popup extends common/* Com */.up {
+  state = {
+    close: false,
+    cssready: false,
+    closeAnimation: true,
+    pressedSubmit: false,
+    imageReady: false,
+    fontReady: false
+  };
+
   constructor(props) {
     super(props);
-
-    popup_defineProperty(this, "state", {
-      close: false,
-      cssready: false,
-      closeAnimation: true,
-      pressedSubmit: false,
-      imageReady: false
-    });
-
     this._formRef = (0,preact_module/* createRef */.Vf)();
     setTimeout(() => this.fillForm(), 1000);
     setTimeout(async () => {
@@ -2014,6 +1945,9 @@ class Popup extends common/* Com */.M {
           }
         });
       });
+      delete fonts.undefined;
+      delete fonts.null;
+      delete fonts[''];
       if (util/* default.size */.Z.size(images) == 0) this.setState({
         imageReady: true
       });
@@ -2021,9 +1955,33 @@ class Popup extends common/* Com */.M {
         imageReady: true
       })));
       util/* default.preloadWebfonts */.Z.preloadWebfonts(Object.keys(fonts));
+      setTimeout(async () => {
+        await this.waitForFont(Object.keys(fonts));
+        this.setState({
+          fontReady: true
+        });
+      });
     });
   }
 
+  async waitForFont(fonts) {
+    if (util/* default.size */.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.sleep */.Z.sleep(200);
+    }
+
+    return;
+  }
+
   openPopup() {
     this.setState({
       close: false
@@ -2038,7 +1996,7 @@ class Popup extends common/* Com */.M {
   isFormFilled() {
     let page = util/* default.get */.Z.get(this.props.plugin.popup, `pages.${this.getPageIndex()}`);
     let form = util/* default.find */.Z.find(page.components, com => com.type === 'form');
-    if (!form || !form.form) return;
+    if (!form || !form.form) return true;
     let fields = util/* default.get */.Z.get(form, 'form.fields', []);
     let wrong = util/* default.find */.Z.find(fields, field => {
       if (!field.is_required) return false;
@@ -2181,7 +2139,7 @@ class Popup extends common/* Com */.M {
     }
 
     if (hasConversion) {
-      var formData = new FormData(this._formRef.current);
+      var formData = this._formRef.current ? new FormData(this._formRef.current) : new FormData();
       var summitFields = [];
       let user = util/* default.cloneDeep */.Z.cloneDeep(this.props.store.matchUser());
 
@@ -2820,6 +2778,7 @@ class Popup extends common/* Com */.M {
     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.get */.Z.get(this.props.plugin, 'popup', {});
     let page = util/* default.get */.Z.get(popup, `pages.${this.getPageIndex()}`);

package/dist/292d42404e1b03398f61.png

@@ -0,0 +1 @@
+module.exports = __webpack_public_path__ + "assets/img/emoji/messenger/sub_27.451_84.314.231e2b7.png";

package/dist/312d376370831b7bea83.png

@@ -0,0 +1 @@
+module.exports = __webpack_public_path__ + "assets/img/emoji/messenger/sub_25.490_5.882.4b49e94.png";

package/dist/313d1bfc1cf776d1aefe.png

@@ -0,0 +1 @@
+module.exports = __webpack_public_path__ + "assets/img/emoji/messenger/sub_23.529_60.784.1420241.png";

package/dist/335.js

@@ -0,0 +1,408 @@
+"use strict";
+(self["webpackChunk_subiz_widget_v4"] = self["webpackChunk_subiz_widget_v4"] || []).push([[335],{
+
+/***/ 2335:
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+__webpack_require__.r(__webpack_exports__);
+/* harmony export */ __webpack_require__.d(__webpack_exports__, {
+/* harmony export */   "default": () => (/* binding */ Contact),
+/* harmony export */   "replaceCssVariable": () => (/* binding */ replaceCssVariable),
+/* harmony export */   "DEFVAL": () => (/* binding */ DEFVAL)
+/* harmony export */ });
+/* harmony import */ var _util_index_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(819);
+/* harmony import */ var preact__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(6400);
+/* harmony import */ var _common_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(2493);
+
+
+
+
+let CSS = (() => __webpack_require__.e(/* import() */ 678).then(__webpack_require__.bind(__webpack_require__, 2678)))();
+
+class Contact extends _common_js__WEBPACK_IMPORTED_MODULE_2__/* .Com */ .up {
+  state = {
+    map: false,
+    map_loading: false,
+    map_initialized: false
+  };
+
+  constructor(props) {
+    super(props);
+    this.showMap = this.showMap.bind(this);
+    this.hideMap = this.hideMap.bind(this);
+  }
+
+  async initMap() {
+    if (this.map_initialized) return;
+    this.setState({
+      map_initialized: true,
+      map_loading: true
+    });
+    await new Loader({
+      apiKey: 'YOUR_API_KEY',
+      version: 'weekly'
+    }).load();
+    this.gmap = new google.maps.Map(document.getElementById('map'));
+    this.setState({
+      map_loading: false
+    });
+  }
+
+  js2css(js, onlyProps) {
+    return _util_index_js__WEBPACK_IMPORTED_MODULE_0__/* ["default"].js2css */ .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,
+      '@primary_color': this.props.plugin.popup.primary_color,
+      '@background': this.props.plugin.popup.background,
+      '@spacer0': spacer / 2 + 'px',
+      '@spacer': spacer + 'px',
+      '@spacer2': spacer * 2 + 'px',
+      '@spacer3': spacer * 3 + 'px'
+    });
+  }
+
+  renderMapButton(button) {
+    let icon = (0,preact__WEBPACK_IMPORTED_MODULE_1__.h)("svg", {
+      width: "20px",
+      "aria-hidden": "true",
+      focusable: "false",
+      "data-prefix": "fas",
+      "data-icon": "map-marker-alt",
+      role: "img",
+      xmlns: "http://www.w3.org/2000/svg",
+      viewBox: "0 0 384 512",
+      class: "svg-inline--fa fa-map-marker-alt fa-w-12 fa-3x"
+    }, (0,preact__WEBPACK_IMPORTED_MODULE_1__.h)("path", {
+      fill: "red",
+      d: "M172.268 501.67C26.97 291.031 0 269.413 0 192 0 85.961 85.961 0 192 0s192 85.961 192 192c0 77.413-26.97 99.031-172.268 309.67-9.535 13.774-29.93 13.773-39.464 0zM192 272c44.183 0 80-35.817 80-80s-35.817-80-80-80-80 35.817-80 80 35.817 80 80 80z",
+      class: ""
+    }));
+    return (0,preact__WEBPACK_IMPORTED_MODULE_1__.h)("div", {
+      class: "contact_button",
+      onClick: this.showMap
+    }, this.renderMapModal(button), icon);
+  }
+
+  async setMap(lat, lng) {
+    console.log('HEE');
+    await this.initMap();
+    console.log('HEE22');
+    window.gmap = this.gmap;
+    this.gmap.map.setCenter(new google.maps.LatLng(lat, lng));
+  }
+
+  renderMapModal(button) {
+    let cls = 'map_modal';
+    if (this.state.map) cls += ' map_modal__show';else cls += ' map_modal__hide';
+    let overlaycls = 'overlay';
+    if (!this.state.map) overlaycls += ' overlay__hidden';
+    let $locations = _util_index_js__WEBPACK_IMPORTED_MODULE_0__/* ["default"].map */ .Z.map(button.map.locations, loc => {
+      return (0,preact__WEBPACK_IMPORTED_MODULE_1__.h)("div", {
+        class: "map_location",
+        onClick: e => this.setMap(loc.latitude, loc.longitude)
+      }, (0,preact__WEBPACK_IMPORTED_MODULE_1__.h)("div", null, loc.name), (0,preact__WEBPACK_IMPORTED_MODULE_1__.h)("div", null, loc.latitude), (0,preact__WEBPACK_IMPORTED_MODULE_1__.h)("div", null, loc.longitude));
+    });
+    $locations.unshift((0,preact__WEBPACK_IMPORTED_MODULE_1__.h)("div", {
+      class: "map_title"
+    }, button.map.title));
+    let $map = (0,preact__WEBPACK_IMPORTED_MODULE_1__.h)("div", {
+      id: "map",
+      style: "height: 100%; width: 100%"
+    }, ' ');
+    return (0,preact__WEBPACK_IMPORTED_MODULE_1__.h)("div", {
+      class: overlaycls,
+      onClick: this.hideMap
+    }, (0,preact__WEBPACK_IMPORTED_MODULE_1__.h)("div", {
+      class: cls,
+      onClick: e => e.stopPropagation()
+    }, (0,preact__WEBPACK_IMPORTED_MODULE_1__.h)("div", {
+      class: "map_body"
+    }, (0,preact__WEBPACK_IMPORTED_MODULE_1__.h)("div", {
+      class: "map_locations"
+    }, $locations), $map, (0,preact__WEBPACK_IMPORTED_MODULE_1__.h)("div", {
+      class: "mapouter"
+    }, (0,preact__WEBPACK_IMPORTED_MODULE_1__.h)("div", {
+      class: "gmap_canvas"
+    }, (0,preact__WEBPACK_IMPORTED_MODULE_1__.h)("iframe", {
+      width: "300",
+      height: "400",
+      id: "gmap_canvas",
+      src: "https://maps.google.com/maps?q=2880%20Broadway,%20New%20York&t=&z=13&ie=UTF8&iwloc=&output=embed",
+      frameborder: "0",
+      scrolling: "no",
+      marginheight: "0",
+      marginwidth: "0"
+    }))))));
+  }
+
+  hideMap(e) {
+    e.stopPropagation();
+    this.setState({
+      map: false
+    });
+  }
+
+  showMap() {
+    this.setState({
+      map: true
+    });
+  }
+
+  renderZaloButton(button) {
+    let icon = (0,preact__WEBPACK_IMPORTED_MODULE_1__.h)("svg", {
+      width: "20px ",
+      "aria-hidden": "true",
+      focusable: "false",
+      "data-prefix": "fab",
+      "data-icon": "facebook-f",
+      role: "img",
+      xmlns: "http://www.w3.org/2000/svg",
+      viewBox: "0 0 320 512",
+      class: "svg-inline--fa fa-facebook-f fa-w-10 fa-5x"
+    }, (0,preact__WEBPACK_IMPORTED_MODULE_1__.h)("path", {
+      fill: "currentColor",
+      d: "M279.14 288l14.22-92.66h-88.91v-60.13c0-25.35 12.42-50.06 52.24-50.06h40.42V6.26S260.43 0 225.36 0c-73.22 0-121.08 44.38-121.08 124.72v70.62H22.89V288h81.39v224h100.17V288z",
+      class: ""
+    }));
+    return (0,preact__WEBPACK_IMPORTED_MODULE_1__.h)("div", {
+      class: "contact_button"
+    }, icon);
+  }
+
+  renderFacebookButton(button) {
+    let icon = (0,preact__WEBPACK_IMPORTED_MODULE_1__.h)("svg", {
+      width: "20px ",
+      "aria-hidden": "true",
+      focusable: "false",
+      "data-prefix": "fab",
+      "data-icon": "facebook-f",
+      role: "img",
+      xmlns: "http://www.w3.org/2000/svg",
+      viewBox: "0 0 320 512",
+      class: "svg-inline--fa fa-facebook-f fa-w-10 fa-5x"
+    }, (0,preact__WEBPACK_IMPORTED_MODULE_1__.h)("path", {
+      fill: "currentColor",
+      d: "M279.14 288l14.22-92.66h-88.91v-60.13c0-25.35 12.42-50.06 52.24-50.06h40.42V6.26S260.43 0 225.36 0c-73.22 0-121.08 44.38-121.08 124.72v70.62H22.89V288h81.39v224h100.17V288z",
+      class: ""
+    }));
+    return (0,preact__WEBPACK_IMPORTED_MODULE_1__.h)("div", {
+      class: "contact_button"
+    }, icon);
+  }
+
+  renderChatButton() {
+    return (0,preact__WEBPACK_IMPORTED_MODULE_1__.h)("div", null, "Chat");
+  }
+
+  renderCallButton() {
+    let icon = (0,preact__WEBPACK_IMPORTED_MODULE_1__.h)("svg", {
+      width: "20px",
+      "aria-hidden": "true",
+      focusable: "false",
+      "data-prefix": "fas",
+      "data-icon": "phone",
+      role: "img",
+      xmlns: "http://www.w3.org/2000/svg",
+      viewBox: "0 0 512 512",
+      class: "svg-inline--fa fa-phone fa-w-16 fa-7x"
+    }, (0,preact__WEBPACK_IMPORTED_MODULE_1__.h)("path", {
+      fill: "currentColor",
+      d: "M493.4 24.6l-104-24c-11.3-2.6-22.9 3.3-27.5 13.9l-48 112c-4.2 9.8-1.4 21.3 6.9 28l60.6 49.6c-36 76.7-98.9 140.5-177.2 177.2l-49.6-60.6c-6.8-8.3-18.2-11.1-28-6.9l-112 48C3.9 366.5-2 378.1.6 389.4l24 104C27.1 504.2 36.7 512 48 512c256.1 0 464-207.5 464-464 0-11.2-7.7-20.9-18.6-23.4z",
+      class: ""
+    }));
+    return (0,preact__WEBPACK_IMPORTED_MODULE_1__.h)("div", null, icon);
+  }
+
+  renderButtons(buttons) {
+    if (_util_index_js__WEBPACK_IMPORTED_MODULE_0__/* ["default"].size */ .Z.size(buttons) === 0) return null;
+    return _util_index_js__WEBPACK_IMPORTED_MODULE_0__/* ["default"].map */ .Z.map(buttons, button => {
+      if (button.type === 'map') return this.renderMapButton(button);
+      if (button.type === 'zalo') return this.renderZaloButton(button);
+      if (button.type === 'facebook') return this.renderFacebookButton(button);
+      if (button.type === 'call') return this.renderCallButton(button);
+      if (button.type === 'chat') return this.renderChatButton(button);
+      return null;
+    });
+  }
+
+  renderByLayoutSideByStandard() {
+    let $buttons = this.renderButtons(this.props.plugin.contact.buttons);
+    return (0,preact__WEBPACK_IMPORTED_MODULE_1__.h)("div", null, $buttons);
+  }
+
+  renderLineComponent(com) {
+    let style = Object.assign({}, com.style, this.props.mobile ? com.mobile_style : {});
+    return (0,preact__WEBPACK_IMPORTED_MODULE_1__.h)("div", {
+      style: this.js2css(style)
+    });
+  }
+
+  renderTextComponent(com) {
+    let style = Object.assign({}, com.style, this.props.mobile ? com.mobile_style : {});
+    return (0,preact__WEBPACK_IMPORTED_MODULE_1__.h)("div", {
+      class: "text",
+      style: this.js2css(style),
+      dangerouslySetInnerHTML: {
+        __html: _util_index_js__WEBPACK_IMPORTED_MODULE_0__/* ["default"].get */ .Z.get(com, 'text.html')
+      }
+    });
+  }
+
+  async refreshCSS() {
+    let css = (await CSS).default.default.toString();
+    var outcss = replaceCssVariable(css, this.props.plugin.popup);
+    _util_index_js__WEBPACK_IMPORTED_MODULE_0__/* ["default"].setCss */ .Z.setCss(this.props.plugin.id, this.$cssStyleDiv, outcss);
+    this.setState({
+      cssready: true
+    });
+  }
+
+  componentDidMount() {
+    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.refreshCSS();
+    let pluginstringify = JSON.stringify(this.props.plugin);
+    this.setState({
+      pluginjson: pluginstringify
+    });
+  }
+
+  render() {
+    if (!this.state.cssready) return null;
+    let pluginstringify = JSON.stringify(this.props.plugin);
+
+    if (this.state.pluginjson !== pluginstringify) {
+      this.refreshCSS();
+      setTimeout(() => this.setState({
+        pluginjson: pluginstringify
+      }));
+    }
+
+    if (this.state.close) return null;
+    let containercss = '';
+    let bodycss = '';
+    let layout = _util_index_js__WEBPACK_IMPORTED_MODULE_0__/* ["default"].get */ .Z.get(this.props.plugin, 'contact.layout', 'standard');
+    let $body = null;
+
+    if (layout === 'standard' || !layout) {
+      $body = this.renderByLayoutSideByStandard();
+    }
+
+    if (layout === 'footer') {
+      $body = this.renderByLayoutFooter(_util_index_js__WEBPACK_IMPORTED_MODULE_0__/* ["default"].get */ .Z.get(this.props.plugin, `popup.pages.${this.state.pageIndex}`));
+    }
+
+    if (layout === 'mini') {
+      $body = this.renderByLayoutMini(_util_index_js__WEBPACK_IMPORTED_MODULE_0__/* ["default"].get */ .Z.get(this.props.plugin, `popup.pages.${this.state.pageIndex}`));
+    }
+
+    if (layout === 'docked') {
+      $body = this.renderByLayoutDocked(_util_index_js__WEBPACK_IMPORTED_MODULE_0__/* ["default"].get */ .Z.get(this.props.plugin, `popup.pages.${this.state.pageIndex}`));
+    }
+
+    let left, right, bottom, top, transform;
+    let position = _util_index_js__WEBPACK_IMPORTED_MODULE_0__/* ["default"].get */ .Z.get(this.props.plugin, 'contact.position', 'bottom-left');
+
+    if (position === 'center-left') {
+      left = '0';
+      top = '50%';
+      transform = 'translateY(-50%)';
+    } else if (position === 'top-left') {
+      left = '0';
+      top = '20px';
+    } else if (position === 'bottom-right') {
+      right = '0';
+      bottom = '20px';
+    } else if (position === 'center-right') {
+      right = '0';
+      top = '50%';
+      transform = 'translateY(-50%)';
+    } else if (position === 'top-right') {
+      right = '0';
+      top = '20px';
+    } else {
+      left = '0';
+      bottom = '20px';
+    }
+
+    return (0,preact__WEBPACK_IMPORTED_MODULE_1__.h)("div", {
+      style: _util_index_js__WEBPACK_IMPORTED_MODULE_0__/* ["default"].js2css */ .Z.js2css({
+        position: 'absolute',
+        left,
+        right,
+        bottom,
+        top,
+        transform,
+        display: 'flex',
+        align_items: 'center',
+        justify_content: 'center',
+        overflow: 'hidden'
+      }),
+      onClick: e => e.stopPropagation()
+    }, $body);
+  }
+
+}
+
+function isEmpty(value) {
+  return value === undefined || value === null || value === '';
+}
+
+async function runCampaign(byTrigger) {
+  if (ran && byTrigger !== 'area_clicked') return;
+  ran = true;
+  pageIndex = 0;
+  let page = sb.get(camp, `pages.${pageIndex}`) || {};
+  showPage(page);
+  triggerType = byTrigger;
+  let {
+    body: impression
+  } = await store.sendImpression(camp.id, byTrigger);
+  impressionToken = sb.get(impression, 'impression_token') || '';
+}
+
+function eq(a, b) {
+  return JSON.stringify(a) === JSON.stringify(b);
+}
+
+function replaceCssVariable(css, setting) {
+  var tokens = [css];
+  tokens = _util_index_js__WEBPACK_IMPORTED_MODULE_0__/* ["default"].tokenize */ .Z.tokenize(tokens, "'@font_family'");
+  tokens = _util_index_js__WEBPACK_IMPORTED_MODULE_0__/* ["default"].tokenize */ .Z.tokenize(tokens, "'@font_size'");
+  tokens = _util_index_js__WEBPACK_IMPORTED_MODULE_0__/* ["default"].tokenize */ .Z.tokenize(tokens, "'@text_color'");
+  tokens = _util_index_js__WEBPACK_IMPORTED_MODULE_0__/* ["default"].tokenize */ .Z.tokenize(tokens, "'@primary_color'");
+  tokens = _util_index_js__WEBPACK_IMPORTED_MODULE_0__/* ["default"].tokenize */ .Z.tokenize(tokens, "'@background'");
+  tokens = _util_index_js__WEBPACK_IMPORTED_MODULE_0__/* ["default"].tokenize */ .Z.tokenize(tokens, "'@spacer'");
+  tokens = _util_index_js__WEBPACK_IMPORTED_MODULE_0__/* ["default"].tokenize */ .Z.tokenize(tokens, "'@spacer0'");
+  tokens = _util_index_js__WEBPACK_IMPORTED_MODULE_0__/* ["default"].tokenize */ .Z.tokenize(tokens, "'@spacer2'");
+  tokens = _util_index_js__WEBPACK_IMPORTED_MODULE_0__/* ["default"].tokenize */ .Z.tokenize(tokens, "'@spacer3'");
+  var ret = [];
+
+  for (var i = 0; i < tokens.length; i++) {
+    var item = tokens[i];
+
+    if (typeof item === 'string') {
+      ret.push(item);
+      continue;
+    }
+
+    var path = item.type.substr(2, item.type.length - 3);
+    var val = _util_index_js__WEBPACK_IMPORTED_MODULE_0__/* ["default"].get */ .Z.get(setting, path) || _util_index_js__WEBPACK_IMPORTED_MODULE_0__/* ["default"].get */ .Z.get(DEFVAL, path) || '';
+    ret.push(val);
+  }
+
+  return ret.join('');
+}
+const DEFVAL = {
+  font_size: '16px',
+  font_family: 'roboto',
+  text_color: '#333',
+  primary_color: '#333'
+};
+
+/***/ })
+
+}]);