@telefonica/mistica 12.1.0 → 12.2.0

package/dist-es/skins/o2.js

@@ -54,7 +54,7 @@ export var getO2Skin = function() {
             backgroundContainer: palette.white,
             backgroundBrand: palette.o2BluePrimary,
             backgroundOverlay: applyAlpha(palette.grey6, 0.6),
-            backgroundSkeleton: palette.grey1,
+            backgroundSkeleton: palette.grey2,
             backgroundSkeletonInverse: applyAlpha(palette.white, 0.2),
             navigationBarBackground: palette.o2BluePrimary,
             backgroundAlternative: palette.grey1,

package/dist-es/skins/telefonica.js

@@ -50,7 +50,7 @@ export var getTelefonicaSkin = function() {
             backgroundContainer: palette.white,
             backgroundBrand: palette.telefonicaBlue,
             backgroundOverlay: applyAlpha(palette.grey6, 0.6),
-            backgroundSkeleton: palette.grey1,
+            backgroundSkeleton: palette.grey2,
             backgroundSkeletonInverse: palette.telefonicaBlue70,
             navigationBarBackground: palette.telefonicaBlue,
             backgroundAlternative: palette.grey1,
@@ -173,7 +173,7 @@ export var getTelefonicaSkin = function() {
             textButtonSecondaryInverseSelected: palette.grey4,
             textLink: palette.telefonicaBlue,
             textLinkInverse: palette.telefonicaBlue,
-            control: palette.darkModeGrey,
+            control: palette.darkModeGrey6,
             controlActivated: palette.telefonicaBlue,
             loadingBar: palette.telefonicaBlue,
             loadingBarBackground: applyAlpha(palette.white, 0.05),

package/dist-es/skins/utils.js

@@ -1,3 +1,4 @@
+import * as React from "react";
 import { BLAU_SKIN, TELEFONICA_SKIN, VIVO_SKIN, O2_SKIN, O2_CLASSIC_SKIN, MOVISTAR_SKIN } from "./constants";
 import { getBlauSkin } from "./blau";
 import { getTelefonicaSkin } from "./telefonica";
@@ -26,3 +27,14 @@ export var getSkinByName = function(name, variant) {
             }
     }
 };
+// copied/adapted from https://github.com/gregberge/react-flatten-children/blob/master/src/index.tsx
+export var flattenChildren = function(children) {
+    var childrenArray = React.Children.toArray(children);
+    return childrenArray.reduce(function(flatChildren, child) {
+        if (child.type === React.Fragment) {
+            return flatChildren.concat(flattenChildren(child.props.children));
+        }
+        flatChildren.push(child);
+        return flatChildren;
+    }, []);
+};

package/dist-es/skins/vivo.js

@@ -48,7 +48,7 @@ export var getVivoSkin = function() {
             backgroundContainer: palette.white,
             backgroundBrand: palette.vivoPurple,
             backgroundOverlay: applyAlpha(palette.grey6, 0.6),
-            backgroundSkeleton: palette.grey1,
+            backgroundSkeleton: palette.grey2,
             backgroundSkeletonInverse: applyAlpha(palette.white, 0.2),
             backgroundFeedbackBottom: palette.vivoPurple,
             navigationBarBackground: palette.vivoPurple,

package/dist-es/tabs.js

@@ -46,6 +46,21 @@ function _iterableToArrayLimit(arr, i) {
 function _nonIterableRest() {
     throw new TypeError("Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
 }
+function _objectSpread(target) {
+    for(var i = 1; i < arguments.length; i++){
+        var source = arguments[i] != null ? arguments[i] : {};
+        var ownKeys = Object.keys(source);
+        if (typeof Object.getOwnPropertySymbols === "function") {
+            ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function(sym) {
+                return Object.getOwnPropertyDescriptor(source, sym).enumerable;
+            }));
+        }
+        ownKeys.forEach(function(key) {
+            _defineProperty(target, key, source[key]);
+        });
+    }
+    return target;
+}
 function _slicedToArray(arr, i) {
     return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest();
 }
@@ -67,6 +82,7 @@ import { useAriaId, useElementDimensions } from "./hooks";
 import { Text3 } from "./text";
 import { pxToRem } from "./utils/css";
 import { isRunningAcceptanceTest } from "./utils/platform";
+import { getPrefixedDataAttributes } from "./utils/dom";
 var TAB_MAX_WIDTH = 284;
 var TAB_HEIGHT = 56;
 var LINE_ANIMATION_DURATION_MS = isRunningAcceptanceTest() ? 0 : 300;
@@ -158,7 +174,7 @@ var useStyles = createUseStyles(function(param1) {
     };
 });
 var Tabs = function(param2) {
-    var selectedIndex = param2.selectedIndex, onChange = param2.onChange, tabs = param2.tabs;
+    var selectedIndex = param2.selectedIndex, onChange = param2.onChange, tabs = param2.tabs, dataAttributes = param2.dataAttributes;
     var id = useAriaId();
     var ref = useElementDimensions(), width = ref.width, ref1 = ref.ref;
     var animatedLineRef = React.useRef(null);
@@ -194,11 +210,12 @@ var Tabs = function(param2) {
             }, LINE_ANIMATION_DURATION_MS);
         }
     };
-    return /*#__PURE__*/ _jsx("div", {
+    return /*#__PURE__*/ _jsx("div", _objectSpread({
         id: id,
         role: "tablist",
         ref: ref1,
-        className: classes.outerBorder,
+        className: classes.outerBorder
+    }, getPrefixedDataAttributes(dataAttributes), {
         children: /*#__PURE__*/ _jsx(ResponsiveLayout, {
             fullWidth: true,
             children: /*#__PURE__*/ _jsxs("div", {
@@ -250,6 +267,6 @@ var Tabs = function(param2) {
                 ]
             })
         })
-    });
+    }));
 };
 export default Tabs;

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@telefonica/mistica",
-    "version": "12.1.0",
+    "version": "12.2.0",
     "license": "MIT",
     "repository": {
         "type": "git",
@@ -79,7 +79,7 @@
         "@telefonica/acceptance-testing": "^2.7.0",
         "@telefonica/eslint-config": "^1.0.7",
         "@telefonica/prettier-config": "^1.1.0",
-        "@telefonica/ts-to-flow": "1.2.0",
+        "@telefonica/ts-to-flow": "1.2.2",
         "@testing-library/jest-dom": "^5.16.3",
         "@testing-library/react": "^12.1.4",
         "@testing-library/user-event": "^13.5.0",