@hulkapps/app-manager-vue 2.3.4 → 2.3.6

package/README.md

@@ -23,10 +23,10 @@ Vue.use(AppManager);
 ## Usage
 
 ```vue
-<Banners type="header" />
-<Banners type="footer" />
-<AppManagerPlan @handlePlanSelect="handlePlanSelectListener" :shop_domain="shop_domain" :translations="translations"/>
-<AppManagerSliderPlan @handlePlanSelect="handlePlanSelectListener" :shop_domain="shop_domain" :translations="translations"/>
+<Banners type="header" @handleBannerClose="handleBannerClose" :translations="translations"/>
+<Banners type="footer" @handleBannerClose="handleBannerClose" :translations="translations"/>
+<AppManagerPlan @handlePlanSelect="handlePlanSelectListener" @handlePlanBannerClose="handleBannerClose" :shop_domain="shop_domain" :translations="translations"/>
+<AppManagerSliderPlan @handlePlanSelect="handlePlanSelectListener" @handlePlanBannerClose="handleBannerClose" :shop_domain="shop_domain" :translations="translations"/>
 ```
 The AppManagerPlan component requires a Shop Domain
 
@@ -39,8 +39,8 @@ The AppManagerPlan component requires a Shop Domain
 <link href="https://cdn.jsdelivr.net/npm/@hulkapps/app-manager-vue@2.0.3/dist/hulkapps-app-manager.css" rel="stylesheet">
 
 <div id="app" class="app-manager">
-    <Banners type="header"  />
-    <app-manager-plan translations="<%= @store.translations %>" shop_domain="<%= @store.shopify_domain %>" />
+    <Banners type="header"  @handleBannerClose="handleBannerClose"/>
+    <app-manager-plan  @handle-plan-select="handlePlanSelectListener" @handlePlanBannerClose="handleBannerClose" :translations="translations" shop_domain="<%= @store.shopify_domain %>" />
 </div>
 
 <script>
@@ -70,6 +70,16 @@ handlePlanSelectListener(payload) {
 }
 ```
 
+
+A `handleBannerClose` event is emitted when the user closed banner.
+
+```javascript
+handleBannerClose(payload) {
+
+    //handle close event
+}
+```
+
 ## License
 
 The MIT License (MIT). Please see [License File](LICENSE) for more information.

package/dist/app-manager-vue.esm.js

@@ -23019,6 +23019,14 @@ var script$R = {
   },
   methods: {
     dismissBanner(key) {
+      this.$emit('handleBannerClose', {
+        action: 'close',
+        type: this.banner_type
+      });
+      this.$emit('handle-banner-close', {
+        action: 'close',
+        type: this.banner_type
+      });
       this.staticContent[this.banner_type].splice(key, 1);
     },
 
@@ -23052,12 +23060,11 @@ var script$R = {
         });
       }
     });
+    console.log(this.staticContent);
   },
 
   created() {
-    if (Object.keys(this.translations).length > 0) {
-      Vue.prototype.$translations = this.translations;
-    }
+    Vue.prototype.$translations = Object.keys(this.translations).length > 0 ? this.translations : {};
 
     if (this.base_url != null) {
       let config = {
@@ -23107,7 +23114,7 @@ var __vue_staticRenderFns__$P = [];
 const __vue_inject_styles__$R = undefined;
 /* scoped */
 
-const __vue_scope_id__$R = "data-v-56382236";
+const __vue_scope_id__$R = "data-v-4696e98a";
 /* module identifier */
 
 const __vue_module_identifier__$R = undefined;
@@ -23146,6 +23153,20 @@ var script$Q = {
       return this.staticContent['plans'];
     }
 
+  },
+  methods: {
+    translateMe(message) {
+      return this.$translations.hasOwnProperty(message) ? this.$translations[message] : message;
+    },
+
+    dismissBanner(key) {
+      this.$emit('handlePlanBannerClose', {
+        action: 'close',
+        type: 'plan banners'
+      });
+      this.staticContent['plans'].splice(key, 1);
+    }
+
   },
 
   async mounted() {
@@ -23168,6 +23189,59 @@ var script$Q = {
 
 };
 
+const isOldIE = typeof navigator !== 'undefined' &&
+    /msie [6-9]\\b/.test(navigator.userAgent.toLowerCase());
+function createInjector(context) {
+    return (id, style) => addStyle(id, style);
+}
+let HEAD;
+const styles = {};
+function addStyle(id, css) {
+    const group = isOldIE ? css.media || 'default' : id;
+    const style = styles[group] || (styles[group] = { ids: new Set(), styles: [] });
+    if (!style.ids.has(id)) {
+        style.ids.add(id);
+        let code = css.source;
+        if (css.map) {
+            // https://developer.chrome.com/devtools/docs/javascript-debugging
+            // this makes source maps inside style tags work properly in Chrome
+            code += '\n/*# sourceURL=' + css.map.sources[0] + ' */';
+            // http://stackoverflow.com/a/26603875
+            code +=
+                '\n/*# sourceMappingURL=data:application/json;base64,' +
+                    btoa(unescape(encodeURIComponent(JSON.stringify(css.map)))) +
+                    ' */';
+        }
+        if (!style.element) {
+            style.element = document.createElement('style');
+            style.element.type = 'text/css';
+            if (css.media)
+                style.element.setAttribute('media', css.media);
+            if (HEAD === undefined) {
+                HEAD = document.head || document.getElementsByTagName('head')[0];
+            }
+            HEAD.appendChild(style.element);
+        }
+        if ('styleSheet' in style.element) {
+            style.styles.push(code);
+            style.element.styleSheet.cssText = style.styles
+                .filter(Boolean)
+                .join('\n');
+        }
+        else {
+            const index = style.ids.size - 1;
+            const textNode = document.createTextNode(code);
+            const nodes = style.element.childNodes;
+            if (nodes[index])
+                style.element.removeChild(nodes[index]);
+            if (nodes.length)
+                style.element.insertBefore(textNode, nodes[index]);
+            else
+                style.element.appendChild(textNode);
+        }
+    }
+}
+
 /* script */
 const __vue_script__$Q = script$Q;
 /* template */
@@ -23196,11 +23270,11 @@ var __vue_render__$O = function () {
       }
     }, [_c('div', {
       domProps: {
-        "innerHTML": _vm._s(staticContent.content)
+        "innerHTML": _vm._s(_vm.translateMe(staticContent.content))
       }
     })]) : _c('div', {
       domProps: {
-        "innerHTML": _vm._s(staticContent.content)
+        "innerHTML": _vm._s(_vm.translateMe(staticContent.content))
       }
     })], 1);
   }), 0) : _vm._e();
@@ -23209,18 +23283,24 @@ var __vue_render__$O = function () {
 var __vue_staticRenderFns__$O = [];
 /* style */
 
-const __vue_inject_styles__$Q = undefined;
+const __vue_inject_styles__$Q = function (inject) {
+  if (!inject) return;
+  inject("data-v-7cc7e82e_0", {
+    source: ".app-manager-plan-footer.Polaris-Layout__Section[data-v-7cc7e82e]{margin-bottom:20px}",
+    map: undefined,
+    media: undefined
+  });
+};
 /* scoped */
 
-const __vue_scope_id__$Q = "data-v-ac88498c";
+
+const __vue_scope_id__$Q = "data-v-7cc7e82e";
 /* module identifier */
 
 const __vue_module_identifier__$Q = undefined;
 /* functional template */
 
 const __vue_is_functional_template__$Q = false;
-/* style inject */
-
 /* style inject SSR */
 
 /* style inject shadow dom */
@@ -23228,7 +23308,7 @@ const __vue_is_functional_template__$Q = false;
 const __vue_component__$R = /*#__PURE__*/normalizeComponent({
   render: __vue_render__$O,
   staticRenderFns: __vue_staticRenderFns__$O
-}, __vue_inject_styles__$Q, __vue_script__$Q, __vue_scope_id__$Q, __vue_is_functional_template__$Q, __vue_module_identifier__$Q, false, undefined, undefined, undefined);
+}, __vue_inject_styles__$Q, __vue_script__$Q, __vue_scope_id__$Q, __vue_is_functional_template__$Q, __vue_module_identifier__$Q, false, createInjector, undefined, undefined);
 
 var PlanBanners = __vue_component__$R;
 
@@ -25837,59 +25917,6 @@ var script$v = {
   }
 };
 
-const isOldIE = typeof navigator !== 'undefined' &&
-    /msie [6-9]\\b/.test(navigator.userAgent.toLowerCase());
-function createInjector(context) {
-    return (id, style) => addStyle(id, style);
-}
-let HEAD;
-const styles = {};
-function addStyle(id, css) {
-    const group = isOldIE ? css.media || 'default' : id;
-    const style = styles[group] || (styles[group] = { ids: new Set(), styles: [] });
-    if (!style.ids.has(id)) {
-        style.ids.add(id);
-        let code = css.source;
-        if (css.map) {
-            // https://developer.chrome.com/devtools/docs/javascript-debugging
-            // this makes source maps inside style tags work properly in Chrome
-            code += '\n/*# sourceURL=' + css.map.sources[0] + ' */';
-            // http://stackoverflow.com/a/26603875
-            code +=
-                '\n/*# sourceMappingURL=data:application/json;base64,' +
-                    btoa(unescape(encodeURIComponent(JSON.stringify(css.map)))) +
-                    ' */';
-        }
-        if (!style.element) {
-            style.element = document.createElement('style');
-            style.element.type = 'text/css';
-            if (css.media)
-                style.element.setAttribute('media', css.media);
-            if (HEAD === undefined) {
-                HEAD = document.head || document.getElementsByTagName('head')[0];
-            }
-            HEAD.appendChild(style.element);
-        }
-        if ('styleSheet' in style.element) {
-            style.styles.push(code);
-            style.element.styleSheet.cssText = style.styles
-                .filter(Boolean)
-                .join('\n');
-        }
-        else {
-            const index = style.ids.size - 1;
-            const textNode = document.createTextNode(code);
-            const nodes = style.element.childNodes;
-            if (nodes[index])
-                style.element.removeChild(nodes[index]);
-            if (nodes.length)
-                style.element.insertBefore(textNode, nodes[index]);
-            else
-                style.element.appendChild(textNode);
-        }
-    }
-}
-
 /* script */
 const __vue_script__$v = script$v;
 /* template */
@@ -41924,6 +41951,11 @@ var script$2 = {
       }
 
       return 'custom-choose-button';
+    },
+
+    handlePlanBannerClose(payload) {
+      this.$emit('handlePlanBannerClose', payload);
+      this.$emit('handle-plan-banner-close', payload);
     }
 
   },
@@ -42329,7 +42361,11 @@ var __vue_render__$2 = function () {
     on: {
       "click": _vm.activePlan
     }
-  }, [_vm._v(_vm._s(_vm.translateMe('I will choose the plan later')))])], 1)], 1) : _vm._e(), _vm._v(" "), _c('PlanBanners')], 2)], 1)], 1);
+  }, [_vm._v(_vm._s(_vm.translateMe('I will choose the plan later')))])], 1)], 1) : _vm._e(), _vm._v(" "), _c('PlanBanners', {
+    on: {
+      "handlePlanBannerClose": _vm.handlePlanBannerClose
+    }
+  })], 2)], 1)], 1);
 };
 
 var __vue_staticRenderFns__$2 = [];
@@ -42337,7 +42373,7 @@ var __vue_staticRenderFns__$2 = [];
 
 const __vue_inject_styles__$2 = function (inject) {
   if (!inject) return;
-  inject("data-v-13e88eae_0", {
+  inject("data-v-65bcd32a_0", {
     source: "@import url(https://fonts.googleapis.com/css2?family=Satisfy&display=swap);.app-manager .app-manager-plan-page .plan-table td:last-child>[data-v-5a078dbb],.app-manager .app-manager-plan-page .plan-table td:last-child>[data-v-7d902277]{float:none}.app-manager .app-manager-plan-page .active{background:#f0f8f5}.app-manager .app-manager-plan-page .plan-table td:last-child>[data-v-0d1b0d63]{float:none}.app-manager .app-manager-plan-page .plan-table td{border:.01px solid #ececee!important;border-collapse:collapse!important}.app-manager .app-manager-plan-page .plan-table .Polaris-DataTable__ScrollContainer{border-radius:12px;overflow:visible}.app-manager .app-manager-plan-page .plan-table table{border-collapse:collapse!important}.app-manager .app-manager-plan-page .custom-plan table{border-collapse:collapse!important}.app-manager .app-manager-plan-page .custom-plan table thead .first-column{border-radius:12px 0 0 0;border-top:0!important;border-left:0!important}.app-manager .app-manager-plan-page .custom-plan table thead .plan-heading.last-column{text-align:left!important;border-radius:0 12px 0 0;border-top:0!important}.app-manager .app-manager-plan-page .custom-plan table thead .plan-heading{background-color:#fff;box-shadow:rgba(23,24,24,.05) 1px 0 8px,rgba(0,0,0,.15) 0 0 2px}.app-manager .app-manager-plan-page .custom-plan table tbody tr:first-child{background-color:#fff;box-shadow:0 0 5px rgba(23,24,24,.05),0 1px 2px rgba(0,0,0,.15);border-radius:12px 0 0 0;overflow:hidden}.app-manager .app-manager-plan-page .custom-plan table tbody tr:not(:first-child:last-child){background-color:#fff;overflow:hidden}.app-manager .app-manager-plan-page .custom-plan table tbody tr:not(:first-child:last-child){background-color:#fff;box-shadow:0 0 5px rgba(23,24,24,.05),0 1px 2px rgba(0,0,0,.15);overflow:hidden}.app-manager .app-manager-plan-page .custom-plan table tbody tr:not(:nth-last-child(2)){background-color:#fff;overflow:hidden}.app-manager .app-manager-plan-page .custom-plan table tbody tr:not(:nth-last-child(2)){border-bottom:0}.app-manager .app-manager-plan-page .custom-plan table tbody tr:last-child{border-bottom:0;background-color:transparent!important;box-shadow:none!important}.app-manager .app-manager-plan-page .custom-plan table tbody tr:not(:last-child){pointer-events:none}.app-manager .app-manager-plan-page .custom-plan table thead tr td{pointer-events:none}.app-manager .app-manager-plan-page .custom-plan table tbody tr:first-child td:first-child{overflow:hidden;border-radius:12px 0 0 0}.app-manager .app-manager-plan-page .custom-plan table tbody tr:nth-last-child(2){overflow:hidden;border-bottom-right-radius:12px;border-bottom-left-radius:12px}.app-manager .app-manager-plan-page .custom-plan table tbody tr:nth-last-child(2) td:first-child{overflow:hidden;border-bottom:0!important;border-radius:0 0 0 12px}.app-manager .app-manager-plan-page .custom-plan table tbody tr:nth-last-child(2) td:last-child{overflow:hidden;border-radius:0 0 12px}.app-manager .app-manager-plan-page .custom-plan table tbody tr td:first-child{border-left:0!important;border-top:0!important;padding-left:20px}.app-manager .app-manager-plan-page .custom-plan table tbody tr td:last-child{border-right:0!important;border-bottom:0!important;text-align:center!important}.app-manager .app-manager-plan-page .custom-plan table thead tr td:last-child{border-right:0!important;border-bottom:0!important;text-align:center!important}.app-manager .app-manager-plan-page .custom-plan table tbody td:not(:first-child){text-align:center!important}.app-manager .app-manager-plan-page .custom-plan table tbody tr:last-child td:last-child{background:0 0;border-radius:0 0 12px 0}.app-manager .app-manager-plan-page .custom-plan table tbody tr:last-child td{border:0!important;background:0 0}.app-manager .app-manager-plan-page .custom-plan table tbody tr:last-child td:hover{border:0!important;background:0 0}.app-manager .app-manager-plan-page .custom-plan tbody tr:last-child td.Polaris-DataTable__Cell--verticalAlignTop{background:0 0!important}.app-manager .app-manager-plan-page .custom-plan table tbody tr:last-child{background:0 0;opacity:1}.app-manager .app-manager-plan-page .custom-plan table tbody tr:last-child td:first-child{visibility:hidden}.app-manager .app-manager-plan-page .plan-heading{padding-top:30px}.app-manager .app-manager-plan-page .custom-plan .Polaris-Layout__Section{max-width:calc(100% - 2rem)!important}.app-manager .app-manager-plan-page .later-link{text-align:center;clear:both;padding-top:15px}.app-manager .app-manager-plan-page .plan-badge ul{text-align:center;padding-top:2rem;border-top:.1rem solid #e1e3e5}.app-manager .app-manager-plan-page .plan-badge ul li{list-style:none;display:inline-block;padding-right:25px}.app-manager .app-manager-plan-page .plan-badge ul li img{max-width:133px}.app-manager .app-manager-plan-page .btn-group .Polaris-ButtonGroup__Item{margin-left:0!important;z-index:unset!important}.app-manager .app-manager-plan-page.custom-title .Polaris-HorizontalDivider{background-color:#e2e3e4}.app-manager .app-manager-plan-page .Polaris-Page__Content hr{border:1px solid #e2e3e4}.app-manager .app-manager-plan-page .app-manager-group-row{background:0 0!important;padding:16px 16px 16px 20px!important}.app-manager .app-manager-plan-page .feature__type__array{vertical-align:middle!important;word-spacing:999px;white-space:pre-line!important}.app-manager .app-manager-plan-page .Polaris-DataTable__Table{table-layout:fixed!important}.app-manager .app-manager-plan-page td{vertical-align:middle!important}.app-manager .app-manager-plan-page td.feature__class{word-wrap:break-word!important;white-space:normal!important}.app-manager .app-manager-plan-page .light-green-cell{background-color:#f0f8f5;color:#257f60}.app-manager .app-manager-plan-page .plan-heading b{overflow-wrap:break-word;word-wrap:break-word;white-space:initial}.app-manager .app-manager-plan-page .custom-choose-button:hover{background:#006e52;border-color:transparent;color:#fff}",
     map: undefined,
     media: undefined
@@ -42780,6 +42816,11 @@ var script$1 = {
       }
 
       return 'custom-choose-button';
+    },
+
+    handlePlanBannerClose(payload) {
+      this.$emit('handlePlanBannerClose', payload);
+      this.$emit('handle-plan-banner-close', payload);
     }
 
   },
@@ -43179,7 +43220,11 @@ var __vue_render__$1 = function () {
     on: {
       "click": _vm.activePlan
     }
-  }, [_vm._v(_vm._s(_vm.translateMe('I will choose the plan later')))])], 1)], 1) : _vm._e(), _vm._v(" "), _c('PlanBanners')], 1);
+  }, [_vm._v(_vm._s(_vm.translateMe('I will choose the plan later')))])], 1)], 1) : _vm._e(), _vm._v(" "), _c('PlanBanners', {
+    on: {
+      "handlePlanBannerClose": _vm.handlePlanBannerClose
+    }
+  })], 1);
 };
 
 var __vue_staticRenderFns__$1 = [];
@@ -43187,7 +43232,7 @@ var __vue_staticRenderFns__$1 = [];
 
 const __vue_inject_styles__$1 = function (inject) {
   if (!inject) return;
-  inject("data-v-1207c1e9_0", {
+  inject("data-v-0a3c6bdb_0", {
     source: "@import url(https://fonts.googleapis.com/css2?family=Satisfy&display=swap);.app-manager .app-manager-plan-page-slider ul{list-style:none;margin:0;padding:0}.app-manager .app-manager-plan-page-slider .Polaris-Layout__Section .VueCarousel-slide li,.app-manager .app-manager-plan-page-slider .Polaris-ResourceList__ResourceListWrapper.features li,.app-manager .app-manager-plan-page-slider .plan__price{padding:16px 16px 16px 20px}.app-manager .app-manager-plan-page-slider .Polaris-Layout.custom-plan .VueCarousel .plan__price,.app-manager .app-manager-plan-page-slider .Polaris-Layout__Section .VueCarousel-slide li:not(:last-child),.app-manager .app-manager-plan-page-slider .Polaris-ResourceList__ResourceListWrapper.features li{border-top:1px solid #ddd;border-right:1px solid #ddd;background:#fff}.app-manager .app-manager-plan-page-slider .Polaris-ResourceList__ResourceListWrapper.features li{border-right:none;border-left:1px solid #ddd}.app-manager .app-manager-plan-page-slider .Polaris-Layout__Section .VueCarousel-slide li:nth-last-child(2),.app-manager .app-manager-plan-page-slider .Polaris-ResourceList__ResourceListWrapper.features li:last-child{border-bottom:1px solid #ddd}.app-manager .app-manager-plan-page-slider .Polaris-ResourceList__ResourceListWrapper.features li:first-child{border-top-left-radius:12px}.app-manager .app-manager-plan-page-slider .Polaris-ResourceList__ResourceListWrapper.features li:last-child{border-bottom-left-radius:12px}.app-manager .app-manager-plan-page-slider .VueCarousel-inner .VueCarousel-slide.first-slide ul li:not(:last-child){border-left:1px solid #ddd}.app-manager .app-manager-plan-page-slider .VueCarousel-inner .VueCarousel-slide.first-slide .plan__price{border-left:1px solid #ddd;box-shadow:none;border-top-left-radius:12px;overflow:hidden}.app-manager .app-manager-plan-page-slider .VueCarousel-inner .VueCarousel-slide.last-slide ul li:nth-last-child(2){border-bottom-right-radius:12px}.app-manager .app-manager-plan-page-slider .VueCarousel-inner .VueCarousel-slide.last-slide .plan__price{border-right:1px solid #ddd;box-shadow:none;border-top-right-radius:12px;overflow:hidden}.app-manager .app-manager-plan-page-slider .VueCarousel-inner .VueCarousel-slide.last-slide{border-top-right-radius:12px}.app-manager .app-manager-plan-page-slider .VueCarousel-inner .VueCarousel-slide.first-slide{border-top-left-radius:12px}.app-manager .app-manager-plan-page-slider .VueCarousel .VueCarousel-inner li{text-align:center}.app-manager .app-manager-plan-page-slider .VueCarousel-navigation-button{color:#257f60}.app-manager .app-manager-plan-page-slider .btn-group .Polaris-ButtonGroup__Item{margin-left:0!important;z-index:unset!important}.app-manager .app-manager-plan-page-slider .feature__list,.app-manager .app-manager-plan-page-slider .feature__type__array{display:flex;align-items:center;word-spacing:999px;justify-content:center}.app-manager .app-manager-plan-page-slider .feature__type__array.feature__class{justify-content:left}.app-manager .app-manager-plan-page-slider .plan-heading b{overflow-wrap:break-word;word-wrap:break-word;white-space:initial}.app-manager .app-manager-plan-page-slider .custom-choose-button:hover{background:#006e52;border-color:transparent;color:#fff}",
     map: undefined,
     media: undefined
@@ -43246,14 +43291,17 @@ var script = {
     handlePlanSelect(payload) {
       this.$emit('handlePlanSelect', payload);
       this.$emit('handle-plan-select', payload);
+    },
+
+    handlePlanBannerClose(payload) {
+      this.$emit('handlePlanBannerClose', payload);
+      this.$emit('handle-plan-banner-close', payload);
     }
 
   },
 
   created() {
-    if (Object.keys(this.translations).length > 0) {
-      Vue.prototype.$translations = this.translations;
-    }
+    Vue.prototype.$translations = Object.keys(this.translations).length > 0 ? this.translations : {};
 
     if (this.base_url != null) {
       let config = {
@@ -43282,7 +43330,8 @@ var __vue_render__ = function () {
       "host": _vm.host
     },
     on: {
-      "handlePlanSelect": _vm.handlePlanSelect
+      "handlePlanSelect": _vm.handlePlanSelect,
+      "handlePlanBannerClose": _vm.handlePlanBannerClose
     }
   }) : _c('AppManagerSliderPlan', {
     attrs: {
@@ -43290,7 +43339,8 @@ var __vue_render__ = function () {
       "host": _vm.host
     },
     on: {
-      "handlePlanSelect": _vm.handlePlanSelect
+      "handlePlanSelect": _vm.handlePlanSelect,
+      "handlePlanBannerClose": _vm.handlePlanBannerClose
     }
   });
 };
@@ -43301,7 +43351,7 @@ var __vue_staticRenderFns__ = [];
 const __vue_inject_styles__ = undefined;
 /* scoped */
 
-const __vue_scope_id__ = "data-v-cff370de";
+const __vue_scope_id__ = "data-v-23079d73";
 /* module identifier */
 
 const __vue_module_identifier__ = undefined;