@telefonica/mistica 12.7.0 → 12.8.0

package/dist/carousel.d.ts

@@ -20,6 +20,7 @@ declare type CarouselProps = {
     itemClassName?: string;
     withBullets?: boolean;
     renderBullets?: (bulletsProps: PageBulletsProps) => React.ReactNode;
+    initialActiveItem?: number;
     itemsPerPage?: ItemsPerPageProp;
     /** scrolls one page by default */
     itemsToScroll?: number;
@@ -45,6 +46,7 @@ declare type CenteredCarouselProps = {
     itemClassName?: string;
     withBullets?: boolean;
     renderBullets?: (bulletsProps: PageBulletsProps) => React.ReactNode;
+    initialActiveItem?: number;
     onPageChange?: (newPageInfo: {
         pageIndex: number;
         shownItemIndexes: Array<number>;

package/dist/carousel.js

@@ -420,7 +420,7 @@ var calcCurrentPageIndex = function calcCurrentPageIndex(scrollPosition, pagesSc
 };
 var DEFAULT_AUTOPLAY_TIME = 5000;
 var BaseCarousel = function BaseCarousel(param) {
-    var items = param.items, itemStyle = param.itemStyle, itemClassName = param.itemClassName, withBullets = param.withBullets, renderBullets = param.renderBullets, itemsPerPage = param.itemsPerPage, itemsToScroll = param.itemsToScroll, _mobilePageOffset = param.mobilePageOffset, mobilePageOffset = _mobilePageOffset === void 0 ? 16 : _mobilePageOffset, gapProp = param.gap, free = param.free, centered = param.centered, autoplay = param.autoplay, onPageChange = param.onPageChange, dataAttributes = param.dataAttributes;
+    var items = param.items, itemStyle = param.itemStyle, itemClassName = param.itemClassName, withBullets = param.withBullets, renderBullets = param.renderBullets, initialActiveItem = param.initialActiveItem, itemsPerPage = param.itemsPerPage, itemsToScroll = param.itemsToScroll, _mobilePageOffset = param.mobilePageOffset, mobilePageOffset = _mobilePageOffset === void 0 ? 16 : _mobilePageOffset, gapProp = param.gap, free = param.free, centered = param.centered, autoplay = param.autoplay, onPageChange = param.onPageChange, dataAttributes = param.dataAttributes;
     var texts = (0, _hooks).useTheme().texts;
     var containerType = (0, _containerTypeContext).useContainerType();
     var itemsPerPageConfig = normalizeItemsPerPage(itemsPerPage);
@@ -445,7 +445,12 @@ var BaseCarousel = function BaseCarousel(param) {
         scrollRight: 0
     }), 2), ref2 = ref1[0], scrollLeft1 = ref2.scrollLeft, scrollRight1 = ref2.scrollRight, setScroll = ref1[1];
     var ref3 = _slicedToArray(React.useState([]), 2), itemScrollPositions = ref3[0], setItemScrollPositions = ref3[1];
-    var pagesScrollPositions = calcPagesScrollPositions(itemScrollPositions, pagesCount);
+    var pagesScrollPositions = React.useMemo(function() {
+        return calcPagesScrollPositions(itemScrollPositions, pagesCount);
+    }, [
+        itemScrollPositions,
+        pagesCount
+    ]);
     var scrollPositions = itemsToScroll ? calcPagesScrollPositions(itemScrollPositions, Math.ceil(items.length / itemsToScroll)) : pagesScrollPositions;
     var showNextArrow = scrollRight1 !== 0;
     var showPrevArrow = scrollLeft1 !== 0;
@@ -553,6 +558,15 @@ var BaseCarousel = function BaseCarousel(param) {
         scrollPositions
     ]);
     var shouldAutoplay = useShouldAutoplay(!!autoplay, carouselRef);
+    React.useEffect(function() {
+        if (initialActiveItem !== undefined) {
+            goToPage(Math.floor(initialActiveItem / itemsPerPageFloor));
+        }
+    }, [
+        initialActiveItem,
+        goToPage,
+        itemsPerPageFloor
+    ]);
     React.useEffect(function() {
         if (shouldAutoplay && autoplay) {
             var time = typeof autoplay === "boolean" ? DEFAULT_AUTOPLAY_TIME : autoplay.time;
@@ -668,7 +682,7 @@ var Carousel = function Carousel(props) {
 };
 exports.Carousel = Carousel;
 var CenteredCarousel = function CenteredCarousel(param) {
-    var items = param.items, itemStyle = param.itemStyle, itemClassName = param.itemClassName, withBullets = param.withBullets, renderBullets = param.renderBullets, onPageChange = param.onPageChange, dataAttributes = param.dataAttributes;
+    var items = param.items, itemStyle = param.itemStyle, itemClassName = param.itemClassName, withBullets = param.withBullets, renderBullets = param.renderBullets, initialActiveItem = param.initialActiveItem, onPageChange = param.onPageChange, dataAttributes = param.dataAttributes;
     return /*#__PURE__*/ (0, _jsxRuntime).jsx(BaseCarousel, {
         items: items,
         itemStyle: itemStyle,
@@ -683,6 +697,7 @@ var CenteredCarousel = function CenteredCarousel(param) {
         gap: 0,
         withBullets: withBullets,
         renderBullets: renderBullets,
+        initialActiveItem: initialActiveItem,
         onPageChange: onPageChange,
         dataAttributes: dataAttributes
     });

package/dist/carousel.js.flow

@@ -26,6 +26,7 @@ declare type CarouselProps = {
   itemClassName?: string,
   withBullets?: boolean,
   renderBullets?: (bulletsProps: PageBulletsProps) => React.Node,
+  initialActiveItem?: number,
   itemsPerPage?: ItemsPerPageProp,
   /**
    * scrolls one page by default
@@ -58,6 +59,7 @@ declare type CenteredCarouselProps = {
   itemClassName?: string,
   withBullets?: boolean,
   renderBullets?: (bulletsProps: PageBulletsProps) => React.Node,
+  initialActiveItem?: number,
   onPageChange?: (newPageInfo: {
     pageIndex: number,
     shownItemIndexes: Array<number>,

package/dist/list.d.ts

@@ -113,6 +113,7 @@ declare type RowListProps = {
     children: React.ReactNode;
     ariaLabelledby?: string;
     role?: string;
+    noLastDivider?: boolean;
     dataAttributes?: DataAttributes;
 };
 export declare const RowList: React.FC<RowListProps>;

package/dist/list.js

@@ -564,7 +564,9 @@ var Row = /*#__PURE__*/ React.forwardRef(function(props, ref) {
 });
 exports.Row = Row;
 var RowList = function RowList(param) {
-    var children = param.children, ariaLabelledby = param.ariaLabelledby, role = param.role, dataAttributes = param.dataAttributes;
+    var children = param.children, ariaLabelledby = param.ariaLabelledby, role = param.role, dataAttributes = param.dataAttributes, noLastDivider = param.noLastDivider;
+    var lastIndex = React.Children.count(children) - 1;
+    var showLastDivider = !noLastDivider;
     return /*#__PURE__*/ (0, _jsxRuntime).jsx("div", _objectSpread({
         role: role,
         "aria-labelledby": ariaLabelledby
@@ -573,7 +575,7 @@ var RowList = function RowList(param) {
             return /*#__PURE__*/ (0, _jsxRuntime).jsxs(React.Fragment, {
                 children: [
                     child,
-                    /*#__PURE__*/ (0, _jsxRuntime).jsx(_box.default, {
+                    (index < lastIndex || showLastDivider) && /*#__PURE__*/ (0, _jsxRuntime).jsx(_box.default, {
                         paddingX: 16,
                         children: /*#__PURE__*/ (0, _jsxRuntime).jsx(_divider.default, {})
                     })

package/dist/list.js.flow

@@ -82,6 +82,7 @@ declare type RowListProps = {
   children: React.Node,
   ariaLabelledby?: string,
   role?: string,
+  noLastDivider?: boolean,
   dataAttributes?: DataAttributes,
 };
 declare export var RowList: React.ComponentType<RowListProps>;

package/dist/package-version.js

@@ -3,5 +3,5 @@ Object.defineProperty(exports, "__esModule", {
     value: true
 });
 exports.PACKAGE_VERSION = void 0;
-var PACKAGE_VERSION = "12.7.0";
+var PACKAGE_VERSION = "12.8.0";
 exports.PACKAGE_VERSION = PACKAGE_VERSION;

package/dist-es/carousel.js

@@ -393,7 +393,7 @@ var calcCurrentPageIndex = function(scrollPosition, pagesScrollPositions) {
 };
 var DEFAULT_AUTOPLAY_TIME = 5000;
 var BaseCarousel = function(param) {
-    var items = param.items, itemStyle = param.itemStyle, itemClassName = param.itemClassName, withBullets = param.withBullets, renderBullets = param.renderBullets, itemsPerPage = param.itemsPerPage, itemsToScroll = param.itemsToScroll, _mobilePageOffset = param.mobilePageOffset, mobilePageOffset = _mobilePageOffset === void 0 ? 16 : _mobilePageOffset, gapProp = param.gap, free = param.free, centered = param.centered, autoplay = param.autoplay, onPageChange = param.onPageChange, dataAttributes = param.dataAttributes;
+    var items = param.items, itemStyle = param.itemStyle, itemClassName = param.itemClassName, withBullets = param.withBullets, renderBullets = param.renderBullets, initialActiveItem = param.initialActiveItem, itemsPerPage = param.itemsPerPage, itemsToScroll = param.itemsToScroll, _mobilePageOffset = param.mobilePageOffset, mobilePageOffset = _mobilePageOffset === void 0 ? 16 : _mobilePageOffset, gapProp = param.gap, free = param.free, centered = param.centered, autoplay = param.autoplay, onPageChange = param.onPageChange, dataAttributes = param.dataAttributes;
     var texts = useTheme().texts;
     var containerType = useContainerType();
     var itemsPerPageConfig = normalizeItemsPerPage(itemsPerPage);
@@ -418,7 +418,12 @@ var BaseCarousel = function(param) {
         scrollRight: 0
     }), 2), ref2 = ref1[0], scrollLeft1 = ref2.scrollLeft, scrollRight1 = ref2.scrollRight, setScroll = ref1[1];
     var ref3 = _slicedToArray(React.useState([]), 2), itemScrollPositions = ref3[0], setItemScrollPositions = ref3[1];
-    var pagesScrollPositions = calcPagesScrollPositions(itemScrollPositions, pagesCount);
+    var pagesScrollPositions = React.useMemo(function() {
+        return calcPagesScrollPositions(itemScrollPositions, pagesCount);
+    }, [
+        itemScrollPositions,
+        pagesCount
+    ]);
     var scrollPositions = itemsToScroll ? calcPagesScrollPositions(itemScrollPositions, Math.ceil(items.length / itemsToScroll)) : pagesScrollPositions;
     var showNextArrow = scrollRight1 !== 0;
     var showPrevArrow = scrollLeft1 !== 0;
@@ -526,6 +531,15 @@ var BaseCarousel = function(param) {
         scrollPositions
     ]);
     var shouldAutoplay = useShouldAutoplay(!!autoplay, carouselRef);
+    React.useEffect(function() {
+        if (initialActiveItem !== undefined) {
+            goToPage(Math.floor(initialActiveItem / itemsPerPageFloor));
+        }
+    }, [
+        initialActiveItem,
+        goToPage,
+        itemsPerPageFloor
+    ]);
     React.useEffect(function() {
         if (shouldAutoplay && autoplay) {
             var time = typeof autoplay === "boolean" ? DEFAULT_AUTOPLAY_TIME : autoplay.time;
@@ -640,7 +654,7 @@ export var Carousel = function(props) {
     return /*#__PURE__*/ _jsx(BaseCarousel, _objectSpread({}, props));
 };
 export var CenteredCarousel = function(param) {
-    var items = param.items, itemStyle = param.itemStyle, itemClassName = param.itemClassName, withBullets = param.withBullets, renderBullets = param.renderBullets, onPageChange = param.onPageChange, dataAttributes = param.dataAttributes;
+    var items = param.items, itemStyle = param.itemStyle, itemClassName = param.itemClassName, withBullets = param.withBullets, renderBullets = param.renderBullets, initialActiveItem = param.initialActiveItem, onPageChange = param.onPageChange, dataAttributes = param.dataAttributes;
     return /*#__PURE__*/ _jsx(BaseCarousel, {
         items: items,
         itemStyle: itemStyle,
@@ -655,6 +669,7 @@ export var CenteredCarousel = function(param) {
         gap: 0,
         withBullets: withBullets,
         renderBullets: renderBullets,
+        initialActiveItem: initialActiveItem,
         onPageChange: onPageChange,
         dataAttributes: dataAttributes
     });

package/dist-es/list.js

@@ -536,7 +536,9 @@ export var Row = /*#__PURE__*/ React.forwardRef(function(props, ref) {
     }));
 });
 export var RowList = function(param) {
-    var children = param.children, ariaLabelledby = param.ariaLabelledby, role = param.role, dataAttributes = param.dataAttributes;
+    var children = param.children, ariaLabelledby = param.ariaLabelledby, role = param.role, dataAttributes = param.dataAttributes, noLastDivider = param.noLastDivider;
+    var lastIndex = React.Children.count(children) - 1;
+    var showLastDivider = !noLastDivider;
     return /*#__PURE__*/ _jsx("div", _objectSpread({
         role: role,
         "aria-labelledby": ariaLabelledby
@@ -545,7 +547,7 @@ export var RowList = function(param) {
             return /*#__PURE__*/ _jsxs(React.Fragment, {
                 children: [
                     child,
-                    /*#__PURE__*/ _jsx(Box, {
+                    (index < lastIndex || showLastDivider) && /*#__PURE__*/ _jsx(Box, {
                         paddingX: 16,
                         children: /*#__PURE__*/ _jsx(Divider, {})
                     })

package/dist-es/package-version.js

@@ -1,2 +1,2 @@
 // DO NOT EDIT THIS FILE. It's autogenerated by set-version.js
-export var PACKAGE_VERSION = "12.7.0";
+export var PACKAGE_VERSION = "12.8.0";

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@telefonica/mistica",
-    "version": "12.7.0",
+    "version": "12.8.0",
     "license": "MIT",
     "repository": {
         "type": "git",