@hulkapps/app-manager-vue 2.5.12 → 3.0.3

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hulkapps/app-manager-vue",
-  "version": "2.5.12",
+  "version": "3.0.3",
   "description": "Vue SDK to render app manager contents",
   "main": "dist/app-manager-vue.ssr.js",
   "browser": "dist/app-manager-vue.esm.js",
@@ -23,6 +23,7 @@
   "dependencies": {
     "axios": "^0.26.1",
     "change-case": "^4.1.2",
+    "swiper": "^8.0.6",
     "vue-carousel": "^0.18.0"
   },
   "devDependencies": {
@@ -33,15 +34,18 @@
     "@rollup/plugin-commonjs": "^14.0.0",
     "@rollup/plugin-node-resolve": "^9.0.0",
     "@rollup/plugin-replace": "^2.4.2",
+    "@rollup/plugin-url": "^8.0.2",
     "@vue/cli-plugin-babel": "^4.5.13",
     "@vue/cli-service": "^4.5.13",
     "clean-css-cli": "^5.6.0",
     "cross-env": "^7.0.3",
     "minimist": "^1.2.5",
     "node-sass": "^7.0.1",
+    "postcss": "^8.5.4",
     "rimraf": "^3.0.2",
     "rollup": "^2.52.8",
     "rollup-plugin-node-polyfills": "^0.2.1",
+    "rollup-plugin-postcss": "^4.0.2",
     "rollup-plugin-terser": "^7.0.2",
     "rollup-plugin-vue": "^5.1.9",
     "sass-loader": "^10.0.5",

package/src/components/Plans/AppManagerGroupPlan.vue

@@ -71,7 +71,7 @@
                     <VariantButton id="pricing-tab" v-if="valid_annual_plans.length > 0" :variant="selectedPlan === 'annually' ? 'primary' : 'secondary'" @click="selectPlan('annually')">
                         {{ translateMe('Annually') }}
                     </VariantButton>
-                    <VariantButton id="pricing-tab" v-if="bundle_plan !== null" :variant="selectedPlan === 'bundle' ? 'primary' : 'secondary'" @click="selectPlan('bundle')" :additionalText="'25 Apps'">
+                    <VariantButton id="pricing-tab" v-if="bundle_plan !== null" :variant="selectedPlan === 'bundle' ? 'primary' : 'secondary'" @click="selectPlan('bundle')" :additionalText=" totalBundleApps +' Apps'">
                         {{ translateMe('Bundle') }}
                     </VariantButton>
                 </div>
@@ -253,7 +253,7 @@
             </PLayoutSection>
         </PLayout>
         <div v-if="bundle_plan !== null" class="bundle-plan">
-            <PlanShowcaseBanner useCardStyle="true" :showcaseData="bundle_plan" :realPrice="parseFloat(calculateDiscountedPrice(bundle_plan)).toFixed(0)" :oldPrice="bundle_plan.price" @plan-clicked="handlePlanClicked(bundle_plan)" :isCurrentPlan="isCurrentPlanId(bundle_plan)"/>
+            <PlanShowcaseBanner useCardStyle="true" :bundleApps="totalBundleApps" :showcaseData="bundle_plan" :realPrice="parseFloat(calculateDiscountedPrice(bundle_plan)).toFixed(0)" :oldPrice="bundle_plan.price" @plan-clicked="handlePlanClicked(bundle_plan)" :isCurrentPlan="isCurrentPlanId(bundle_plan)"/>
             <div class="light-divider"></div>
             <div class="bundle-category" v-for="category in bundle_details">
                 <CategoryHeading :headingData="category" />
@@ -263,7 +263,7 @@
             </div>
             <CategoryHeading :headingData="additionalBenefitsHeading" />
             <BenefitsBanner />
-            <PlanShowcaseBanner style="margin-top: 20px;" :showcaseData="bundle_plan" :realPrice="parseFloat(calculateDiscountedPrice(bundle_plan)).toFixed(0)" :oldPrice="bundle_plan.price" :showDescription="false" :isCurrentPlan="isCurrentPlanId(bundle_plan)" @plan-clicked="handlePlanClicked(bundle_plan)"/>
+            <PlanShowcaseBanner style="margin-top: 20px;" :bundleApps="totalBundleApps"  :showcaseData="bundle_plan" :realPrice="parseFloat(calculateDiscountedPrice(bundle_plan)).toFixed(0)" :oldPrice="bundle_plan.price" :showDescription="false" :isCurrentPlan="isCurrentPlanId(bundle_plan)" @plan-clicked="handlePlanClicked(bundle_plan)"/>
         </div>
         <!--====================================================================-->
     </PPage>
@@ -411,6 +411,15 @@
                 }
                 return plans;
             },
+            totalBundleApps() {
+                let totalApps = 0;
+                if (this.bundle_details) {
+                    this.bundle_details.forEach(category => {
+                        totalApps += category.apps_relation.length;
+                    });
+                }
+                return totalApps;
+            }
         },
         methods: {
             translateMe(message) {

package/src/components/Plans/AppManagerPlan.vue

@@ -1,7 +1,13 @@
 <template>
-  <AppManagerGroupPlan  @handlePlanSelect="handlePlanSelect" @handlePlanBannerClose="handlePlanBannerClose" v-if="group_plan"
-                       :shop_domain="shop_domain" :host="host" :discount_code="discount_code"></AppManagerGroupPlan>
-  <AppManagerSliderPlan @handlePlanSelect="handlePlanSelect" @handlePlanBannerClose="handlePlanBannerClose" v-else :shop_domain="shop_domain" :host="host" :discount_code="discount_code"></AppManagerSliderPlan>
+  <AppManagerSliderPlan
+    :shop_domain="shop_domain"
+    :host="host"
+    :discount_code="discount_code"
+    :is_customizable="is_customizable"
+    @handlePlanSelect="handlePlanSelect"
+    @handlePlanBannerClose="handlePlanBannerClose"
+    @handleCustomizePlan="handleCustomizePlan"
+  ></AppManagerSliderPlan>
 </template>
 
 <script>
@@ -33,6 +39,10 @@ export default {
       type: String,
       default: null
     },
+    is_customizable: {
+      type: Boolean,
+      default: false
+    },
     translations:{
       type: Object,
       default() {
@@ -48,6 +58,9 @@ export default {
     handlePlanBannerClose(payload) {
       this.$emit('handlePlanBannerClose', payload)
       this.$emit('handle-plan-banner-close', payload)
+    },
+    handleCustomizePlan(){
+      this.$emit('handleCustomizePlan')
     }
   },
   created() {