carousel-lit - npm Package Compare versions

Comparing version 0.3.0 to 0.4.0

dist/cjs/index.cjs.js

@@ -256,8 +256,9 @@ 'use strict';
   var children = _ref.children,
-      _ref$offset = _ref.offset,
-      offset = _ref$offset === void 0 ? 0 : _ref$offset,
+      _ref$startAt = _ref.startAt,
+      startAt = _ref$startAt === void 0 ? 0 : _ref$startAt,
       onInitialize = _ref.onInitialize;
   return core.jsx(ContextProvider, {
     initialState: {
-      offset: offset
+      offset: 0,
+      startAt: startAt
     },
@@ -291,3 +292,4 @@ middleware: function middleware(action) {
       entries = _useState.entries,
-      range = _useState.range;
+      range = _useState.range,
+      startAt = _useState.startAt;
 
@@ -343,2 +345,12 @@ useLayoutEffect(function () {
       var _trackWidth = _offset;
+
+      if (newItemSizeCache != null && startAt != null && newItemSizeCache[startAt] != null) {
+        var scrollOffset = newItemSizeCache[startAt].offset;
+        target.scroll({
+          top: 0,
+          left: scrollOffset,
+          behavior: 'auto'
+        });
+      }
+
       dispatch({
@@ -355,3 +367,3 @@ type: ActionType.INITIALIZE,
     }
-  }, [data.length, dispatch, entry, itemSizeCache, trackHeight]);
+  }, [data.length, dispatch, entry, itemSizeCache, startAt, trackHeight]);
   var setScrollOffset = rafSchd(function (clientWidth, scrollLeft, scrollWidth) {
@@ -452,3 +464,7 @@ // Prevent Safari's elastic scrolling from causing visual shaking when
   React.useEffect(function () {
-    if (offset === 0 && alwaysVisible === false) {
+    if (alwaysVisible) {
+      return setVisibility(true);
+    }
+
+    if (offset === 0) {
       setVisibility(false);
@@ -508,3 +524,7 @@ } else {
 
-      if (endOffset > 0 && offset === endOffset && alwaysVisible === false) {
+      if (alwaysVisible) {
+        return setVisibility(true);
+      }
+
+      if (endOffset < 0 || endOffset > 0 && offset === endOffset) {
         setVisibility(false);
@@ -511,0 +531,0 @@ } else {

dist/esm/index.es.js

@@ -250,8 +250,9 @@ import _extends from '@babel/runtime/helpers/esm/extends';
   var children = _ref.children,
-      _ref$offset = _ref.offset,
-      offset = _ref$offset === void 0 ? 0 : _ref$offset,
+      _ref$startAt = _ref.startAt,
+      startAt = _ref$startAt === void 0 ? 0 : _ref$startAt,
       onInitialize = _ref.onInitialize;
   return jsx(ContextProvider, {
     initialState: {
-      offset: offset
+      offset: 0,
+      startAt: startAt
     },
@@ -285,3 +286,4 @@ middleware: function middleware(action) {
       entries = _useState.entries,
-      range = _useState.range;
+      range = _useState.range,
+      startAt = _useState.startAt;
 
@@ -337,2 +339,12 @@ useLayoutEffect(function () {
       var _trackWidth = _offset;
+
+      if (newItemSizeCache != null && startAt != null && newItemSizeCache[startAt] != null) {
+        var scrollOffset = newItemSizeCache[startAt].offset;
+        target.scroll({
+          top: 0,
+          left: scrollOffset,
+          behavior: 'auto'
+        });
+      }
+
       dispatch({
@@ -349,3 +361,3 @@ type: ActionType.INITIALIZE,
     }
-  }, [data.length, dispatch, entry, itemSizeCache, trackHeight]);
+  }, [data.length, dispatch, entry, itemSizeCache, startAt, trackHeight]);
   var setScrollOffset = rafSchd(function (clientWidth, scrollLeft, scrollWidth) {
@@ -446,3 +458,7 @@ // Prevent Safari's elastic scrolling from causing visual shaking when
   React.useEffect(function () {
-    if (offset === 0 && alwaysVisible === false) {
+    if (alwaysVisible) {
+      return setVisibility(true);
+    }
+
+    if (offset === 0) {
       setVisibility(false);
@@ -502,3 +518,7 @@ } else {
 
-      if (endOffset > 0 && offset === endOffset && alwaysVisible === false) {
+      if (alwaysVisible) {
+        return setVisibility(true);
+      }
+
+      if (endOffset < 0 || endOffset > 0 && offset === endOffset) {
         setVisibility(false);
@@ -505,0 +525,0 @@ } else {

dist/types/context.d.ts

@@ -16,2 +16,3 @@ import React from 'react';
     offset?: number;
+    startAt?: number;
     entries?: any[];
@@ -18,0 +19,0 @@ range?: [number, number];

dist/types/types.d.ts

@@ -7,3 +7,3 @@ /// <reference types="react" />
 export interface CarouselProps {
-    offset?: number;
+    startAt?: number;
     onInitialize?: (payload: OnInitializePayload) => void;
@@ -10,0 +10,0 @@ }

package.json

 {
   "name": "carousel-lit",
   "description": "Lit carousel component written in React",
-  "version": "0.3.0",
+  "version": "0.4.0",
   "author": "Joel Voss <[e-mail]>",
@@ -37,6 +37,6 @@ "license": "MIT",
   "devDependencies": {
-    "@types/jest": "25.2.1",
+    "@types/jest": "25.2.3",
     "@types/raf-schd": "4.0.0",
-    "@types/react": "16.9.34",
-    "@types/react-dom": "16.9.7",
+    "@types/react": "16.9.35",
+    "@types/react-dom": "16.9.8",
     "@types/smoothscroll-polyfill": "0.3.1",
@@ -43,0 +43,0 @@ "jvdx": "1.2.0"

No alert changes

Improved metrics

Total package byte prevSize

41997

increased by2.22%

Lines of code

1015

increased by3.36%

No dependency changes