zmp-react - npm Package Compare versions

Comparing version 2.4.0-0 to 2.4.0-1

cjs/zalo-ui-kits/swiper.js

@@ -25,5 +25,5 @@ "use strict";
   zoom?: boolean;
-  pagination: boolean,
-  scrollbar: boolean,
-  navigation: boolean,
+  pagination: boolean;
+  scrollbar: boolean;
+  navigation: boolean;
   autoplay?: boolean;
@@ -30,0 +30,0 @@ allowSlideNext?: boolean;

cjs/zmp-react.js

 /**
- * ZMP React 2.4.0-0
+ * ZMP React 2.4.0-1
  * Build full featured iOS & Android apps using ZMP & React
@@ -4,0 +4,0 @@ * https://h5.zalo.me/react/

components/swiper-slide/swiper-slide.d.ts

@@ -1,5 +0,7 @@
-import React from 'react';
-import { classNames, getSlots } from '../shared/utils';
 
-/* dts-props
+import * as React from 'react';
+
+
+interface SwiperSlideProps {
+  slot?: string;
   id?: string | number;
@@ -9,19 +11,6 @@ className?: string;
   zoom?: boolean;
-*/
+}
+declare const SwiperSlide: React.FunctionComponent<SwiperSlideProps>;
 
-const SwiperSlide = (props) => {
-  const { className, id, style, zoom } = props;
-
-  const classes = classNames(className, 'swiper-slide');
-  const slots = getSlots(props);
-
-  return (
-    <div id={id} style={style} className={classes}>
-      {zoom ? <div className="swiper-zoom-container">{slots.default}</div> : slots.default}
-    </div>
-  );
-};
-
-SwiperSlide.displayName = 'zmp-swiper-slide';
-
 export default SwiperSlide;
+  

components/swiper/swiper.d.ts

@@ -1,8 +0,7 @@
-import React, { useEffect, useRef, useState, forwardRef, useImperativeHandle } from 'react';
-import { extend, classNames, getSlots, noUndefinedProps } from '../shared/utils';
-import { colorClasses } from '../shared/mixins';
-import { useIsomorphicLayoutEffect } from '../shared/use-isomorphic-layout-effect';
-import { zmpready } from '../shared/zmp';
 
-/* dts-props
+import * as React from 'react';
+
+
+interface SwiperProps {
+  slot?: string;
   id?: string | number;
@@ -12,5 +11,5 @@ className?: string;
   zoom?: boolean;
-  pagination: boolean,
-  scrollbar: boolean,
-  navigation: boolean,
+  pagination?: boolean;
+  scrollbar?: boolean;
+  navigation?: boolean;
   autoplay?: boolean;
@@ -22,3 +21,3 @@ allowSlideNext?: boolean;
   direction?: 'horizontal' | 'vertical';
-  effect?: 	'slide' | 'fade' | 'cube' | 'coverflow' | 'flip' | 'creative' | 'cards';
+  effect?: 'slide' | 'fade' | 'cube' | 'coverflow' | 'flip' | 'creative' | 'cards';
   enabled?: boolean;
@@ -29,131 +28,7 @@ loop?: boolean;
   speed?: number;
-  onSlideChange?: (instance?: swiper) => void
-*/
+  onSlideChange?: (instance?: swiper) => void;
+}
+declare const Swiper: React.FunctionComponent<SwiperProps>;
 
-const Swiper = forwardRef((props, ref) => {
-  const [initialUpdate, setInitialUpdate] = useState(false);
-  const elRef = useRef(null);
-  const paginationElRef = useRef(null);
-  const scrollbarElRef = useRef(null);
-  const nextElRef = useRef(null);
-  const prevElRef = useRef(null);
-  const swiper = useRef(null);
-  const {
-    id,
-    style,
-    className,
-    pagination,
-    scrollbar,
-    navigation,
-    autoplay,
-    allowSlideNext,
-    allowSlidePrev,
-    allowTouchMove,
-    centeredSlides,
-    direction,
-    effect,
-    enabled,
-    loop,
-    slidesPerView,
-    spaceBetween,
-    speed,
-    onSlideChange,
-  } = props;
-
-  let paginationEl;
-  let scrollbarEl;
-  let buttonNextEl;
-  let buttonPrevEl;
-
-  useIsomorphicLayoutEffect(() => {
-    zmpready((zmp) => {
-      initSwiper(zmp);
-    });
-    return () => {
-      if (swiper.current && !swiper.current.destroyed) {
-        swiper.current.destroy(true, false);
-      }
-    };
-  }, []);
-
-  useIsomorphicLayoutEffect(() => {
-    if (!initialUpdate) {
-      setInitialUpdate(true);
-      return;
-    }
-    if (swiper.current && swiper.current.update && !swiper.current.destroyed) {
-      swiper.current.update();
-    }
-  });
-
-  useImperativeHandle(ref, () => ({
-    el: elRef.current,
-  }));
-
-  const initSwiper = (zmp) => {
-    const newParams = {
-      pagination: {},
-      navigation: {},
-      scrollbar: {},
-    };
-
-    const params = {
-      autoplay,
-      allowSlideNext,
-      allowSlidePrev,
-      allowTouchMove,
-      centeredSlides,
-      direction,
-      effect,
-      enabled,
-      loop,
-      slidesPerView,
-      spaceBetween,
-      speed,
-    };
-    if (typeof onSlideChange === 'function') {
-      params.on = {
-        slideChange: onSlideChange,
-      };
-    }
-    if (params) extend(newParams, noUndefinedProps(params));
-    if (pagination && !newParams.pagination.el) newParams.pagination.el = paginationElRef.current;
-    if (navigation && !newParams.navigation.nextEl && !newParams.navigation.prevEl) {
-      newParams.navigation.nextEl = nextElRef.current;
-      newParams.navigation.prevEl = prevElRef.current;
-    }
-    if (scrollbar && !newParams.scrollbar.el) newParams.scrollbar.el = scrollbarElRef.current;
-
-    swiper.current = zmp.swiper.create(elRef.current, newParams);
-  };
-
-  const slots = getSlots(props);
-
-  if (pagination) {
-    paginationEl = <div ref={paginationElRef} className="swiper-pagination" />;
-  }
-  if (scrollbar) {
-    scrollbarEl = <div ref={scrollbarElRef} className="swiper-scrollbar" />;
-  }
-  if (navigation) {
-    buttonNextEl = <div ref={nextElRef} className="swiper-button-next" />;
-    buttonPrevEl = <div ref={prevElRef} className="swiper-button-prev" />;
-  }
-
-  const classes = classNames(className, 'swiper-container', colorClasses(props));
-  return (
-    <div id={id} style={style} ref={elRef} className={classes}>
-      {slots['before-wrapper']}
-      <div className="swiper-wrapper">{slots.default}</div>
-      {paginationEl}
-      {scrollbarEl}
-      {buttonPrevEl}
-      {buttonNextEl}
-      {slots['after-wrapper']}
-    </div>
-  );
-});
-
-Swiper.displayName = 'zmp-swiper';
-
 export default Swiper;
+  

esm/zalo-ui-kits/swiper.js

@@ -11,5 +11,5 @@ import React, { useEffect, useRef, useState, forwardRef, useImperativeHandle } from 'react';
   zoom?: boolean;
-  pagination: boolean,
-  scrollbar: boolean,
-  navigation: boolean,
+  pagination: boolean;
+  scrollbar: boolean;
+  navigation: boolean;
   autoplay?: boolean;
@@ -16,0 +16,0 @@ allowSlideNext?: boolean;

esm/zmp-react.js

 /**
- * ZMP React 2.4.0-0
+ * ZMP React 2.4.0-1
  * Build full featured iOS & Android apps using ZMP & React
@@ -4,0 +4,0 @@ * https://h5.zalo.me/react/

package.json

 {
   "name": "zmp-react",
-  "version": "2.4.0-0",
+  "version": "2.4.0-1",
   "description": "Build full featured iOS & Android apps using ZMP & React",
@@ -5,0 +5,0 @@ "main": "cjs/zmp-react.js",

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

Worsened metrics

Total package byte prevSize

1784358

decreased by-0.21%

Lines of code

40258

decreased by-0.31%

No dependency changes