@egjs/vue-flicking - npm Package Compare versions

Comparing version 4.1.2 to 4.2.0

declaration/Flicking.d.ts

@@ -7,2 +7,4 @@ import { Vue } from "vue-property-decorator";
     cameraTag: string;
+    hideBeforeInit: string;
+    firstPanelSize?: string;
     options: Partial<FlickingOptions>;
@@ -9,0 +11,0 @@ plugins: Plugin[];

dist/flicking.cjs.js

@@ -7,3 +7,3 @@ /*
 repository: https://github.com/naver/egjs-flicking/tree/master/packages/vue-flicking
-version: 4.1.2
+version: 4.2.0
 */
@@ -468,2 +468,3 @@ 'use strict';
     var flicking = this._vanillaFlicking;
+    var initialized = this._diffResult && flicking && flicking.initialized;
     var isHorizontal = flicking ? flicking.horizontal : (_a = this.options.horizontal) !== null && _a !== void 0 ? _a : true;
@@ -473,3 +474,4 @@ var viewportData = {
         "flicking-viewport": true,
-        "vertical": !isHorizontal
+        "vertical": !isHorizontal,
+        "flicking-hidden": this.hideBeforeInit && !initialized
       }
@@ -480,5 +482,8 @@ };
         "flicking-camera": true
-      }
+      },
+      style: !initialized && this.firstPanelSize ? {
+        transform: VanillaFlicking.getDefaultCameraTransform(this.options.align, this.options.horizontal, this.firstPanelSize)
+      } : {}
     };
-    var slots = this._diffResult && flicking && flicking.initialized ? VanillaFlicking.getRenderingPanels(flicking, this._diffResult) : this._getSlots();
+    var slots = initialized ? VanillaFlicking.getRenderingPanels(flicking, this._diffResult) : this._getSlots();
     var panels = slots.map(function (slot) {
@@ -558,2 +563,13 @@ return h("Panel", {
   __decorate([vuePropertyDecorator.Prop({
+    type: Boolean,
+    default: false,
+    required: false
+  })], Flicking.prototype, "hideBeforeInit", void 0);
+
+  __decorate([vuePropertyDecorator.Prop({
+    type: String,
+    required: false
+  })], Flicking.prototype, "firstPanelSize", void 0);
+
+  __decorate([vuePropertyDecorator.Prop({
     type: Object,
@@ -590,3 +606,3 @@ default: function () {
 
-var version = "4.1.2";
+var version = "4.2.0";
 
@@ -593,0 +609,0 @@ var install = function (Vue) {

dist/flicking.esm.js

@@ -7,7 +7,7 @@ /*
 repository: https://github.com/naver/egjs-flicking/tree/master/packages/vue-flicking
-version: 4.1.2
+version: 4.2.0
 */
 import ListDiffer from '@egjs/list-differ';
 import { Component, Vue, Prop } from 'vue-property-decorator';
-import VanillaFlicking, { ExternalPanel, ExternalRenderer, EVENTS, sync, getRenderingPanels, withFlickingMethods } from '@egjs/flicking';
+import VanillaFlicking, { ExternalPanel, ExternalRenderer, EVENTS, sync, getDefaultCameraTransform, getRenderingPanels, withFlickingMethods } from '@egjs/flicking';
 export * from '@egjs/flicking';
@@ -467,2 +467,3 @@
     var flicking = this._vanillaFlicking;
+    var initialized = this._diffResult && flicking && flicking.initialized;
     var isHorizontal = flicking ? flicking.horizontal : (_a = this.options.horizontal) !== null && _a !== void 0 ? _a : true;
@@ -472,3 +473,4 @@ var viewportData = {
         "flicking-viewport": true,
-        "vertical": !isHorizontal
+        "vertical": !isHorizontal,
+        "flicking-hidden": this.hideBeforeInit && !initialized
       }
@@ -479,5 +481,8 @@ };
         "flicking-camera": true
-      }
+      },
+      style: !initialized && this.firstPanelSize ? {
+        transform: getDefaultCameraTransform(this.options.align, this.options.horizontal, this.firstPanelSize)
+      } : {}
     };
-    var slots = this._diffResult && flicking && flicking.initialized ? getRenderingPanels(flicking, this._diffResult) : this._getSlots();
+    var slots = initialized ? getRenderingPanels(flicking, this._diffResult) : this._getSlots();
     var panels = slots.map(function (slot) {
@@ -557,2 +562,13 @@ return h("Panel", {
   __decorate([Prop({
+    type: Boolean,
+    default: false,
+    required: false
+  })], Flicking.prototype, "hideBeforeInit", void 0);
+
+  __decorate([Prop({
+    type: String,
+    required: false
+  })], Flicking.prototype, "firstPanelSize", void 0);
+
+  __decorate([Prop({
     type: Object,
@@ -589,3 +605,3 @@ default: function () {
 
-var version = "4.1.2";
+var version = "4.2.0";
 
@@ -592,0 +608,0 @@ var install = function (Vue) {

package.json

 {
   "name": "@egjs/vue-flicking",
-  "version": "4.1.2",
+  "version": "4.2.0",
   "description": "Everyday 30 million people experience. It's reliable, flexible and extendable carousel.",
@@ -39,3 +39,3 @@ "main": "dist/flicking.cjs.js",
   "dependencies": {
-    "@egjs/flicking": "^4.1.1",
+    "@egjs/flicking": "^4.2.0",
     "@egjs/list-differ": "^1.0.0",
@@ -42,0 +42,0 @@ "vue-property-decorator": "^8.1.0"

src/Flicking.ts

@@ -15,3 +15,4 @@ /**
   Status,
-  getRenderingPanels
+  getRenderingPanels,
+  getDefaultCameraTransform
 } from "@egjs/flicking";
@@ -33,2 +34,4 @@
   @Prop({ type: String, default: "div", required: false }) public cameraTag!: string;
+  @Prop({ type: Boolean, default: false, required: false }) public hideBeforeInit!: string;
+  @Prop({ type: String, required: false }) public firstPanelSize?: string;
   @Prop({ type: Object, default: () => ({}), required: false }) public options!: Partial<FlickingOptions>;
@@ -102,2 +105,3 @@ @Prop({ type: Array, default: () => ([]), required: false }) public plugins!: Plugin[];
     const flicking = this._vanillaFlicking;
+    const initialized = this._diffResult && flicking && flicking.initialized;
     const isHorizontal = flicking
@@ -110,3 +114,4 @@ ? flicking.horizontal
         "flicking-viewport": true,
-        "vertical": !isHorizontal
+        "vertical": !isHorizontal,
+        "flicking-hidden": this.hideBeforeInit && !initialized
       }
@@ -117,7 +122,10 @@ };
         "flicking-camera": true
-      }
+      },
+      style: !initialized && this.firstPanelSize
+        ? { transform: getDefaultCameraTransform(this.options.align, this.options.horizontal, this.firstPanelSize) }
+        : {}
     };
 
-    const slots = (this._diffResult && flicking && flicking.initialized)
-      ? getRenderingPanels(flicking, this._diffResult)
+    const slots = initialized
+      ? getRenderingPanels(flicking, this._diffResult!)
       : this._getSlots();
@@ -124,0 +132,0 @@ const panels = slots.map(slot => h("Panel", { key: slot.key }, [slot]));

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

90644

increased by4.36%

Lines of code

1450

increased by2.69%

Dependency changes

• + Addedmagic-string@0.30.14(transitive)

• + Addednanoid@3.3.8(transitive)

• - Removedmagic-string@0.30.13(transitive)

• - Removednanoid@3.3.7(transitive)

• Updated@egjs/flicking@^4.2.0