@telefonica/mistica 10.9.0 → 10.11.0

package/dist-es/icons/__stories__/mistica-icons-story.js

@@ -0,0 +1,173 @@
+import * as React from 'react';
+import { useCheckbox } from '../../__stories__/helpers';
+import { ThemeVariant, useTheme, Box, Stack, SearchField, Inline, DoubleField, Text } from '../..';
+import IntegerField from '../../integer-field';
+import { kebabCase, camelCase, upperFirst } from 'lodash';
+function _arrayWithHoles(arr) {
+    if (Array.isArray(arr)) return arr;
+}
+function _iterableToArrayLimit(arr, i) {
+    var _arr = [];
+    var _n = true;
+    var _d = false;
+    var _e = undefined;
+    try {
+        for(var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true){
+            _arr.push(_s.value);
+            if (i && _arr.length === i) break;
+        }
+    } catch (err) {
+        _d = true;
+        _e = err;
+    } finally{
+        try {
+            if (!_n && _i["return"] != null) _i["return"]();
+        } finally{
+            if (_d) throw _e;
+        }
+    }
+    return _arr;
+}
+function _nonIterableRest() {
+    throw new TypeError("Invalid attempt to destructure non-iterable instance");
+}
+function _slicedToArray(arr, i) {
+    return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _nonIterableRest();
+}
+/**
+ * './path/icon-name-filled.tsx' => 'IconNameFilled'
+ */ var fileNameToComponentName = function(fileName) {
+    var lastSlashIdx = fileName.lastIndexOf('/');
+    return upperFirst(camelCase(fileName.slice(lastSlashIdx + 1).replace('.tsx', '')));
+};
+// require all icons
+var misticaIcons = function(requireContext) {
+    return requireContext.keys().map(function(id) {
+        var component = requireContext(id).default;
+        component.componentName = fileNameToComponentName(id);
+        return component;
+    });
+}(require.context('../../generated/mistica-icons/', true, /\.tsx$/));
+export default {
+    title: 'Icons/Mistica Icons'
+};
+export var Catalog = function() {
+    var ref = _slicedToArray(useCheckbox('Regular', true), 2), showRegular = ref[0], regularCheckbox = ref[1];
+    var ref1 = _slicedToArray(useCheckbox('Light', true), 2), showLight = ref1[0], lightCheckbox = ref1[1];
+    var ref2 = _slicedToArray(useCheckbox('Filled', true), 2), showFilled = ref2[0], filledCheckbox = ref2[1];
+    var ref3 = _slicedToArray(useCheckbox('Inverse', false), 2), isInverse = ref3[0], inverseCheckbox = ref3[1];
+    var ref4 = _slicedToArray(useCheckbox('Show names', true), 2), showNames = ref4[0], showNamesCheckbox = ref4[1];
+    var ref5 = _slicedToArray(useCheckbox('Show background', false), 2), showIConBackground = ref5[0], showIConBackgroundCheckbox = ref5[1];
+    var ref6 = _slicedToArray(React.useState(''), 2), filter = ref6[0], setFilter = ref6[1];
+    var ref7 = _slicedToArray(React.useState(64), 2), size = ref7[0], setSize = ref7[1];
+    var ref8 = useTheme(), colors = ref8.colors;
+    var getRealName = function(name) {
+        return name.replace(/^Icon/, '').replace(/(Regular|Filled|Light)$/, '');
+    };
+    var getTypeSortValue = function(name) {
+        if (name.endsWith('Regular')) {
+            return 0;
+        }
+        if (name.endsWith('Light')) {
+            return 1;
+        }
+        return 2;
+    };
+    var filterIcon = function(name) {
+        if (!showFilled && name.endsWith('Filled')) {
+            return false;
+        }
+        if (!showLight && name.endsWith('Light')) {
+            return false;
+        }
+        if (!showRegular && name.endsWith('Regular')) {
+            return false;
+        }
+        if (filter && !getRealName(name).toLowerCase().includes(filter.toLocaleLowerCase())) {
+            return false;
+        }
+        return true;
+    };
+    var compareNames = function(a, b) {
+        var realA = getRealName(a);
+        var realB = getRealName(b);
+        if (realA < realB) {
+            return -1;
+        }
+        if (realA > realB) {
+            return 1;
+        }
+        return getTypeSortValue(a) < getTypeSortValue(b) ? -1 : 1;
+    };
+    var breakName = function(name) {
+        return kebabCase(name).split('-').map(upperFirst).map(function(part, i) {
+            /*#__PURE__*/ return React.createElement("span", {
+                key: i
+            }, part, /*#__PURE__*/ React.createElement("wbr", null));
+        });
+    };
+    var backgroundColor = isInverse ? colors.backgroundBrand : colors.background;
+    var iconBackgroundColor = showIConBackground ? '#aaa' : 'none';
+    return(/*#__PURE__*/ React.createElement("div", null, /*#__PURE__*/ React.createElement(Box, {
+        paddingY: 16
+    }, /*#__PURE__*/ React.createElement(Inline, {
+        space: 16
+    }, /*#__PURE__*/ React.createElement(DoubleField, null, /*#__PURE__*/ React.createElement(SearchField, {
+        name: "filter",
+        value: filter,
+        label: "Filter",
+        onChangeValue: setFilter
+    }), /*#__PURE__*/ React.createElement(IntegerField, {
+        name: "size",
+        value: String(size || 0),
+        label: "Size (px)",
+        onChangeValue: function(v) {
+            return setSize(Number(v) || 0);
+        }
+    })), /*#__PURE__*/ React.createElement(Stack, {
+        space: 8
+    }, /*#__PURE__*/ React.createElement(Inline, {
+        space: 16
+    }, regularCheckbox, lightCheckbox, filledCheckbox), /*#__PURE__*/ React.createElement(Inline, {
+        space: 16
+    }, inverseCheckbox, showNamesCheckbox, showIConBackgroundCheckbox)))), /*#__PURE__*/ React.createElement(ThemeVariant, {
+        isInverse: isInverse
+    }, /*#__PURE__*/ React.createElement("div", {
+        style: {
+            background: backgroundColor
+        }
+    }, misticaIcons.filter(function(param) {
+        var componentName = param.componentName;
+        return filterIcon(componentName);
+    }).sort(function(a, b) {
+        return compareNames(a.componentName, b.componentName);
+    }).map(function(Icon) {
+        /*#__PURE__*/ return React.createElement("div", {
+            style: {
+                display: 'inline-block',
+                verticalAlign: 'top',
+                textAlign: 'center'
+            }
+        }, /*#__PURE__*/ React.createElement("div", {
+            style: {
+                textAlign: 'center',
+                padding: 16,
+                width: size,
+                minWidth: showNames ? 100 : 0
+            }
+        }, /*#__PURE__*/ React.createElement("div", {
+            style: {
+                width: size,
+                margin: 'auto',
+                background: iconBackgroundColor,
+                fontSize: 0
+            }
+        }, /*#__PURE__*/ React.createElement(Icon, {
+            size: size
+        })), showNames && /*#__PURE__*/ React.createElement(Box, {
+            paddingTop: 8
+        }, /*#__PURE__*/ React.createElement(Text, {
+            size: 13
+        }, breakName(Icon.componentName)))));
+    })))));
+};

package/dist-es/icons/icon-amex.js

@@ -1,38 +1,33 @@
 import * as React from 'react';
-
-var IconAmex = function IconAmex(_ref) {
-  var _ref$role = _ref.role,
-      role = _ref$role === void 0 ? 'presentation' : _ref$role,
-      _ref$size = _ref.size,
-      size = _ref$size === void 0 ? 24 : _ref$size;
-  return /*#__PURE__*/React.createElement("svg", {
-    role: role,
-    width: size,
-    height: size,
-    viewBox: "0 0 32 32"
-  }, /*#__PURE__*/React.createElement("g", {
-    fill: "none",
-    fillRule: "evenodd"
-  }, /*#__PURE__*/React.createElement("rect", {
-    width: "32",
-    height: "32",
-    fill: "#FFF",
-    fillRule: "nonzero",
-    rx: "4"
-  }), /*#__PURE__*/React.createElement("path", {
-    fill: "#016FD0",
-    d: "M12.971 26.442v-9.554h8.36v2.138H15.56v1.634h5.636v2.011H15.56v1.697h5.77v2.074z"
-  }), /*#__PURE__*/React.createElement("path", {
-    fill: "#016FD0",
-    d: "M21.323 26.442l3.871-4.718-3.963-4.836h3.07l2.36 2.99 2.368-2.99h2.95l-3.911 4.777 3.878 4.777h-3.07L26.586 23.5l-2.236 2.942z"
-  }), /*#__PURE__*/React.createElement("path", {
-    fill: "#016FD0",
-    fillRule: "nonzero",
-    d: "M13.093 6.007l-4.185 9.23h2.724l.772-1.848h4.49l.768 1.848h2.784l-4.18-9.23h-3.173zm1.548 2.148l1.368 3.23h-2.74l1.372-3.23z"
-  }), /*#__PURE__*/React.createElement("path", {
-    fill: "#016FD0",
-    d: "M20.446 15.237v-9.23l3.673.013 2.137 5.952 2.085-5.965h3.644v9.23h-2.308V8.436l-2.446 6.801h-2.024l-2.453-6.801v6.801z"
-  })));
+var IconAmex = function(param) {
+    var _role = param.role, role = _role === void 0 ? 'presentation' : _role, _size = param.size, size = _size === void 0 ? 24 : _size;
+    /*#__PURE__*/ return React.createElement("svg", {
+        role: role,
+        width: size,
+        height: size,
+        viewBox: "0 0 32 32"
+    }, /*#__PURE__*/ React.createElement("g", {
+        fill: "none",
+        fillRule: "evenodd"
+    }, /*#__PURE__*/ React.createElement("rect", {
+        width: "32",
+        height: "32",
+        fill: "#FFF",
+        fillRule: "nonzero",
+        rx: "4"
+    }), /*#__PURE__*/ React.createElement("path", {
+        fill: "#016FD0",
+        d: "M12.971 26.442v-9.554h8.36v2.138H15.56v1.634h5.636v2.011H15.56v1.697h5.77v2.074z"
+    }), /*#__PURE__*/ React.createElement("path", {
+        fill: "#016FD0",
+        d: "M21.323 26.442l3.871-4.718-3.963-4.836h3.07l2.36 2.99 2.368-2.99h2.95l-3.911 4.777 3.878 4.777h-3.07L26.586 23.5l-2.236 2.942z"
+    }), /*#__PURE__*/ React.createElement("path", {
+        fill: "#016FD0",
+        fillRule: "nonzero",
+        d: "M13.093 6.007l-4.185 9.23h2.724l.772-1.848h4.49l.768 1.848h2.784l-4.18-9.23h-3.173zm1.548 2.148l1.368 3.23h-2.74l1.372-3.23z"
+    }), /*#__PURE__*/ React.createElement("path", {
+        fill: "#016FD0",
+        d: "M20.446 15.237v-9.23l3.673.013 2.137 5.952 2.085-5.965h3.644v9.23h-2.308V8.436l-2.446 6.801h-2.024l-2.453-6.801v6.801z"
+    })));
 };
-
-export default IconAmex;
+export default IconAmex;

package/dist-es/icons/icon-arrow-down.js

@@ -1,30 +1,20 @@
 import * as React from 'react';
 import { useTheme } from '../hooks';
-
-var IconArrowDown = function IconArrowDown(_ref) {
-  var _ref$role = _ref.role,
-      role = _ref$role === void 0 ? 'presentation' : _ref$role,
-      _ref$size = _ref.size,
-      size = _ref$size === void 0 ? 24 : _ref$size,
-      color = _ref.color,
-      style = _ref.style;
-
-  var _useTheme = useTheme(),
-      colors = _useTheme.colors;
-
-  return /*#__PURE__*/React.createElement("svg", {
-    height: size,
-    viewBox: "0 0 24 24",
-    width: size,
-    role: role,
-    style: style
-  }, /*#__PURE__*/React.createElement("path", {
-    d: "M7 10l5 5 5-5z",
-    fill: color !== null && color !== void 0 ? color : colors.neutralHigh
-  }), /*#__PURE__*/React.createElement("path", {
-    d: "M0 0h24v24H0z",
-    fill: "none"
-  }));
+/** @deprecated use IconArrowDropDownFilled instead */ var IconArrowDown = function(param) {
+    var _role = param.role, role = _role === void 0 ? 'presentation' : _role, _size = param.size, size = _size === void 0 ? 24 : _size, color = param.color, style = param.style;
+    var ref = useTheme(), colors = ref.colors;
+    return(/*#__PURE__*/ React.createElement("svg", {
+        height: size,
+        viewBox: "0 0 24 24",
+        width: size,
+        role: role,
+        style: style
+    }, /*#__PURE__*/ React.createElement("path", {
+        d: "M7 10l5 5 5-5z",
+        fill: color !== null && color !== void 0 ? color : colors.neutralHigh
+    }), /*#__PURE__*/ React.createElement("path", {
+        d: "M0 0h24v24H0z",
+        fill: "none"
+    })));
 };
-
-export default IconArrowDown;
+export default IconArrowDown;

package/dist-es/icons/icon-chevron.js

@@ -1,58 +1,56 @@
 import * as React from 'react';
 import { useTheme } from '../hooks';
-
-var IconChevronRightSvg = function IconChevronRightSvg(_ref) {
-  var size = _ref.size,
-      color = _ref.color,
-      transform = _ref.transform,
-      className = _ref.className,
-      style = _ref.style;
-  return /*#__PURE__*/React.createElement("svg", {
-    role: "presentation",
-    width: size,
-    height: size,
-    viewBox: "0 0 24 24",
-    className: className,
-    style: style
-  }, /*#__PURE__*/React.createElement("path", {
-    style: {
-      transition: 'transform 0.3s'
-    },
-    fill: color,
-    fillRule: "evenodd",
-    d: "M14.338 11.478a.75.75 0 0 1 0 1.044l-3.837 3.997a.75.75 0 1 1-1.082-1.038L12.76 12 9.42 8.52a.75.75 0 0 1 1.082-1.04l3.837 3.998z",
-    transform: transform
-  }));
+function _extends() {
+    _extends = Object.assign || function(target) {
+        for(var i = 1; i < arguments.length; i++){
+            var source = arguments[i];
+            for(var key in source){
+                if (Object.prototype.hasOwnProperty.call(source, key)) {
+                    target[key] = source[key];
+                }
+            }
+        }
+        return target;
+    };
+    return _extends.apply(this, arguments);
+}
+var IconChevronRightSvg = function(param) {
+    var size = param.size, color = param.color, transform = param.transform, className = param.className, style = param.style;
+    /*#__PURE__*/ return React.createElement("svg", {
+        role: "presentation",
+        width: size,
+        height: size,
+        viewBox: "0 0 24 24",
+        className: className,
+        style: style
+    }, /*#__PURE__*/ React.createElement("path", {
+        style: {
+            transition: 'transform 0.3s'
+        },
+        fill: color,
+        fillRule: "evenodd",
+        d: "M14.338 11.478a.75.75 0 0 1 0 1.044l-3.837 3.997a.75.75 0 1 1-1.082-1.038L12.76 12 9.42 8.52a.75.75 0 0 1 1.082-1.04l3.837 3.998z",
+        transform: transform
+    }));
 };
-
 var rotateAngleByDirection = {
-  up: -90,
-  down: 90,
-  left: 180,
-  right: 0
+    up: -90,
+    down: 90,
+    left: 180,
+    right: 0
 };
-
-var IconChevron = function IconChevron(_ref2) {
-  var _ref2$size = _ref2.size,
-      size = _ref2$size === void 0 ? 24 : _ref2$size,
-      color = _ref2.color,
-      className = _ref2.className,
-      style = _ref2.style,
-      _ref2$direction = _ref2.direction,
-      direction = _ref2$direction === void 0 ? 'right' : _ref2$direction;
-
-  var _useTheme = useTheme(),
-      colors = _useTheme.colors;
-
-  var fillColor = color || colors.neutralHigh;
-  var props = {
-    size: size,
-    color: fillColor,
-    transform: "rotate(".concat(rotateAngleByDirection[direction], " 12 12)"),
-    className: className,
-    style: style
-  };
-  return /*#__PURE__*/React.createElement(IconChevronRightSvg, props);
+var IconChevron = function(param) {
+    var _size = param.size, size = _size === void 0 ? 24 : _size, color = param.color, className = param.className, style = param.style, _direction = param.direction, direction = _direction === void 0 ? 'right' : _direction;
+    var ref = useTheme(), colors = ref.colors;
+    var fillColor = color || colors.neutralHigh;
+    var props = {
+        size: size,
+        color: fillColor,
+        transform: "rotate(".concat(rotateAngleByDirection[direction], " 12 12)"),
+        className: className,
+        style: style
+    };
+    return(/*#__PURE__*/ React.createElement(IconChevronRightSvg, _extends({
+    }, props)));
 };
-
-export default IconChevron;
+export default IconChevron;

package/dist-es/icons/icon-close.js

@@ -1,29 +1,19 @@
 import * as React from 'react';
 import { useTheme } from '../hooks';
 var ICON_SIZE_1 = 24;
-
-/** @deprecated use IconCloseRegular instead */
-var IconClose = function IconClose(_ref) {
-  var _ref$role = _ref.role,
-      role = _ref$role === void 0 ? 'presentation' : _ref$role,
-      _ref$size = _ref.size,
-      size = _ref$size === void 0 ? ICON_SIZE_1 : _ref$size,
-      color = _ref.color;
-
-  var _useTheme = useTheme(),
-      colors = _useTheme.colors;
-
-  var fillColor = color || colors.neutralHigh;
-  return /*#__PURE__*/React.createElement("svg", {
-    role: role,
-    width: size,
-    height: size,
-    viewBox: "0 0 24 24"
-  }, /*#__PURE__*/React.createElement("path", {
-    fill: fillColor,
-    fillRule: "evenodd",
-    d: "M17.4 6.6a.849.849 0 0 0-1.2 0L12 10.8 7.8 6.6a.849.849 0 1 0-1.2 1.2l4.2 4.2-4.2 4.2a.849.849 0 0 0 1.2 1.2l4.2-4.2 4.2 4.2a.849.849 0 0 0 1.2-1.2L13.2 12l4.2-4.2a.849.849 0 0 0 0-1.2z"
-  }));
+/** @deprecated use IconCloseRegular instead */ var IconClose = function(param) {
+    var _role = param.role, role = _role === void 0 ? 'presentation' : _role, _size = param.size, size = _size === void 0 ? ICON_SIZE_1 : _size, color = param.color;
+    var ref = useTheme(), colors = ref.colors;
+    var fillColor = color || colors.neutralHigh;
+    return(/*#__PURE__*/ React.createElement("svg", {
+        role: role,
+        width: size,
+        height: size,
+        viewBox: "0 0 24 24"
+    }, /*#__PURE__*/ React.createElement("path", {
+        fill: fillColor,
+        fillRule: "evenodd",
+        d: "M17.4 6.6a.849.849 0 0 0-1.2 0L12 10.8 7.8 6.6a.849.849 0 1 0-1.2 1.2l4.2 4.2-4.2 4.2a.849.849 0 0 0 1.2 1.2l4.2-4.2 4.2 4.2a.849.849 0 0 0 1.2-1.2L13.2 12l4.2-4.2a.849.849 0 0 0 0-1.2z"
+    })));
 };
-
-export default IconClose;
+export default IconClose;

package/dist-es/icons/icon-creditcard.js

@@ -1,25 +1,20 @@
 import * as React from 'react';
-
-var IconCreditcard = function IconCreditcard(_ref) {
-  var _ref$role = _ref.role,
-      role = _ref$role === void 0 ? 'presentation' : _ref$role,
-      _ref$size = _ref.size,
-      size = _ref$size === void 0 ? 24 : _ref$size;
-  var originalSize = 32;
-  return /*#__PURE__*/React.createElement("svg", {
-    role: role,
-    width: size,
-    height: size,
-    viewBox: "0 0 ".concat(size, " ").concat(size)
-  }, /*#__PURE__*/React.createElement("g", {
-    fill: "#757575",
-    fillRule: "nonzero",
-    transform: "scale(".concat(size / originalSize, ")")
-  }, /*#__PURE__*/React.createElement("path", {
-    d: "M13.58 21.075H7.039a.666.666 0 1 1 0-1.333h6.543a.667.667 0 0 1 0 1.333"
-  }), /*#__PURE__*/React.createElement("path", {
-    d: "M25.827 24.409H6.2c-.992 0-1.8-.807-1.8-1.8v-6.875h23.228v6.875c0 .993-.806 1.8-1.8 1.8M6.2 8.4h19.628c.994 0 1.8.808 1.8 1.8v1.548H4.4V10.2c0-.992.808-1.8 1.8-1.8m19.628-1.735H6.2a3.539 3.539 0 0 0-3.533 3.535v12.408A3.539 3.539 0 0 0 6.2 26.143h19.628a3.539 3.539 0 0 0 3.534-3.534V10.2a3.539 3.539 0 0 0-3.534-3.535"
-  })));
+var IconCreditcard = function(param) {
+    var _role = param.role, role = _role === void 0 ? 'presentation' : _role, _size = param.size, size = _size === void 0 ? 24 : _size;
+    var originalSize = 32;
+    return(/*#__PURE__*/ React.createElement("svg", {
+        role: role,
+        width: size,
+        height: size,
+        viewBox: "0 0 ".concat(size, " ").concat(size)
+    }, /*#__PURE__*/ React.createElement("g", {
+        fill: "#757575",
+        fillRule: "nonzero",
+        transform: "scale(".concat(size / originalSize, ")")
+    }, /*#__PURE__*/ React.createElement("path", {
+        d: "M13.58 21.075H7.039a.666.666 0 1 1 0-1.333h6.543a.667.667 0 0 1 0 1.333"
+    }), /*#__PURE__*/ React.createElement("path", {
+        d: "M25.827 24.409H6.2c-.992 0-1.8-.807-1.8-1.8v-6.875h23.228v6.875c0 .993-.806 1.8-1.8 1.8M6.2 8.4h19.628c.994 0 1.8.808 1.8 1.8v1.548H4.4V10.2c0-.992.808-1.8 1.8-1.8m19.628-1.735H6.2a3.539 3.539 0 0 0-3.533 3.535v12.408A3.539 3.539 0 0 0 6.2 26.143h19.628a3.539 3.539 0 0 0 3.534-3.534V10.2a3.539 3.539 0 0 0-3.534-3.535"
+    }))));
 };
-
-export default IconCreditcard;
+export default IconCreditcard;

package/dist-es/icons/icon-cvv-amex.js

@@ -1,30 +1,25 @@
 import * as React from 'react';
-
-var IconCvvAmex = function IconCvvAmex(_ref) {
-  var _ref$role = _ref.role,
-      role = _ref$role === void 0 ? 'presentation' : _ref$role,
-      _ref$size = _ref.size,
-      size = _ref$size === void 0 ? 48 : _ref$size;
-  return /*#__PURE__*/React.createElement("svg", {
-    width: size,
-    height: size,
-    viewBox: "0 0 48 48",
-    role: role,
-    style: {
-      flexShrink: 0
-    }
-  }, /*#__PURE__*/React.createElement("g", {
-    fill: "#00A9E0"
-  }, /*#__PURE__*/React.createElement("path", {
-    d: "M2.571 0H45.43C46.849 0 48 1.075 48 2.4v27.2c0 1.325-1.151 2.4-2.571 2.4H2.57C1.151 32 0 30.925 0 29.6V2.4C0 1.075 1.151 0 2.571 0zm0 1.2c-.71 0-1.285.537-1.285 1.2v27.2c0 .663.575 1.2 1.285 1.2H45.43c.71 0 1.285-.537 1.285-1.2V2.4c0-.663-.575-1.2-1.285-1.2H2.57z",
-    transform: "translate(0 8)"
-  }), /*#__PURE__*/React.createElement("path", {
-    d: "M24.286 6.4H42c.473 0 .857.358.857.8v6.4c0 .442-.384.8-.857.8H24.286c-.474 0-.857-.358-.857-.8V7.2c0-.442.383-.8.857-.8zm.268 1.05v5.9h17.178v-5.9H24.554z",
-    transform: "translate(0 8)"
-  }), /*#__PURE__*/React.createElement("path", {
-    d: "M26.949 12h.708V8.618h-.706l-.874.602v.659l.83-.572h.042V12zm2.509-2.56l-.015.202h.656c0-.326.225-.541.553-.541.31 0 .53.192.53.464 0 .22-.12.396-.595.86l-1.104 1.08V12h2.44v-.588h-1.481v-.042l.646-.617c.586-.55.786-.867.786-1.235 0-.581-.493-.987-1.198-.987-.658 0-1.13.361-1.218.91zm4.828 1.093h.42c.379 0 .61.183.61.478 0 .288-.245.487-.6.487-.362 0-.604-.18-.625-.466h-.677c.03.638.541 1.055 1.296 1.055.77 0 1.329-.43 1.329-1.022 0-.445-.291-.755-.755-.806v-.043c.377-.077.623-.382.623-.773 0-.532-.499-.912-1.193-.912-.738 0-1.214.403-1.237 1.043h.654c.019-.293.237-.478.565-.478.33 0 .541.174.541.445 0 .277-.218.464-.539.464h-.412v.528zM39.14 12h.675v-.59h.443v-.589h-.443V8.618h-.992l-.542.83c-.33.515-.593.953-.796 1.336v.625h1.655V12zm-1.02-1.195c.387-.701.69-1.175.999-1.636h.037v1.673H38.12v-.037z",
-    transform: "translate(0 8)"
-  })));
+var IconCvvAmex = function(param) {
+    var _role = param.role, role = _role === void 0 ? 'presentation' : _role, _size = param.size, size = _size === void 0 ? 48 : _size;
+    /*#__PURE__*/ return React.createElement("svg", {
+        width: size,
+        height: size,
+        viewBox: "0 0 48 48",
+        role: role,
+        style: {
+            flexShrink: 0
+        }
+    }, /*#__PURE__*/ React.createElement("g", {
+        fill: "#00A9E0"
+    }, /*#__PURE__*/ React.createElement("path", {
+        d: "M2.571 0H45.43C46.849 0 48 1.075 48 2.4v27.2c0 1.325-1.151 2.4-2.571 2.4H2.57C1.151 32 0 30.925 0 29.6V2.4C0 1.075 1.151 0 2.571 0zm0 1.2c-.71 0-1.285.537-1.285 1.2v27.2c0 .663.575 1.2 1.285 1.2H45.43c.71 0 1.285-.537 1.285-1.2V2.4c0-.663-.575-1.2-1.285-1.2H2.57z",
+        transform: "translate(0 8)"
+    }), /*#__PURE__*/ React.createElement("path", {
+        d: "M24.286 6.4H42c.473 0 .857.358.857.8v6.4c0 .442-.384.8-.857.8H24.286c-.474 0-.857-.358-.857-.8V7.2c0-.442.383-.8.857-.8zm.268 1.05v5.9h17.178v-5.9H24.554z",
+        transform: "translate(0 8)"
+    }), /*#__PURE__*/ React.createElement("path", {
+        d: "M26.949 12h.708V8.618h-.706l-.874.602v.659l.83-.572h.042V12zm2.509-2.56l-.015.202h.656c0-.326.225-.541.553-.541.31 0 .53.192.53.464 0 .22-.12.396-.595.86l-1.104 1.08V12h2.44v-.588h-1.481v-.042l.646-.617c.586-.55.786-.867.786-1.235 0-.581-.493-.987-1.198-.987-.658 0-1.13.361-1.218.91zm4.828 1.093h.42c.379 0 .61.183.61.478 0 .288-.245.487-.6.487-.362 0-.604-.18-.625-.466h-.677c.03.638.541 1.055 1.296 1.055.77 0 1.329-.43 1.329-1.022 0-.445-.291-.755-.755-.806v-.043c.377-.077.623-.382.623-.773 0-.532-.499-.912-1.193-.912-.738 0-1.214.403-1.237 1.043h.654c.019-.293.237-.478.565-.478.33 0 .541.174.541.445 0 .277-.218.464-.539.464h-.412v.528zM39.14 12h.675v-.59h.443v-.589h-.443V8.618h-.992l-.542.83c-.33.515-.593.953-.796 1.336v.625h1.655V12zm-1.02-1.195c.387-.701.69-1.175.999-1.636h.037v1.673H38.12v-.037z",
+        transform: "translate(0 8)"
+    })));
 };
-
-export default IconCvvAmex;
+export default IconCvvAmex;

package/dist-es/icons/icon-cvv-visa-mc.js

@@ -1,30 +1,25 @@
 import * as React from 'react';
-
-var IconCvvVisaMc = function IconCvvVisaMc(_ref) {
-  var _ref$role = _ref.role,
-      role = _ref$role === void 0 ? 'presentation' : _ref$role,
-      _ref$size = _ref.size,
-      size = _ref$size === void 0 ? 48 : _ref$size;
-  return /*#__PURE__*/React.createElement("svg", {
-    width: size,
-    height: size,
-    viewBox: "0 0 48 48",
-    role: role,
-    style: {
-      flexShrink: 0
-    }
-  }, /*#__PURE__*/React.createElement("g", {
-    fill: "#00A9E0"
-  }, /*#__PURE__*/React.createElement("path", {
-    d: "M2.571 0H45.43C46.849 0 48 1.075 48 2.4v27.2c0 1.325-1.151 2.4-2.571 2.4H2.57C1.151 32 0 30.925 0 29.6V2.4C0 1.075 1.151 0 2.571 0zm0 1.2c-.71 0-1.285.537-1.285 1.2v27.2c0 .663.575 1.2 1.285 1.2H45.43c.71 0 1.285-.537 1.285-1.2V2.4c0-.663-.575-1.2-1.285-1.2H2.57z",
-    transform: "translate(0 8)"
-  }), /*#__PURE__*/React.createElement("path", {
-    d: "M0 7.2H48V12H0zM28.286 18.4H42c.473 0 .857.358.857.8v6.4c0 .442-.384.8-.857.8H28.286c-.474 0-.857-.358-.857-.8v-6.4c0-.442.383-.8.857-.8zm.268 1.05v5.9h13.178v-5.9H28.554z",
-    transform: "translate(0 8)"
-  }), /*#__PURE__*/React.createElement("path", {
-    d: "M31.02 24v-2.693h-.045l-.89.572v-.659l.937-.602h.756V24h-.758zm2.577-2.37c0-.653.537-1.099 1.32-1.099.757 0 1.284.406 1.284.987 0 .368-.213.684-.841 1.235l-.693.617v.042h1.587V24H33.64v-.495l1.182-1.08c.51-.464.638-.64.638-.86 0-.272-.236-.464-.567-.464-.352 0-.593.215-.593.527v.014h-.703v-.012zm5.093.903v-.528h.442c.344 0 .578-.187.578-.464 0-.271-.226-.445-.58-.445-.352 0-.585.185-.605.478h-.7c.024-.64.534-1.043 1.325-1.043.743 0 1.278.38 1.278.912 0 .391-.263.696-.668.773v.043c.497.051.809.36.809.806 0 .593-.598 1.022-1.424 1.022-.809 0-1.356-.417-1.389-1.055h.726c.023.286.281.466.67.466.38 0 .643-.199.643-.487 0-.295-.248-.478-.655-.478h-.45z",
-    transform: "translate(0 8)"
-  })));
+var IconCvvVisaMc = function(param) {
+    var _role = param.role, role = _role === void 0 ? 'presentation' : _role, _size = param.size, size = _size === void 0 ? 48 : _size;
+    /*#__PURE__*/ return React.createElement("svg", {
+        width: size,
+        height: size,
+        viewBox: "0 0 48 48",
+        role: role,
+        style: {
+            flexShrink: 0
+        }
+    }, /*#__PURE__*/ React.createElement("g", {
+        fill: "#00A9E0"
+    }, /*#__PURE__*/ React.createElement("path", {
+        d: "M2.571 0H45.43C46.849 0 48 1.075 48 2.4v27.2c0 1.325-1.151 2.4-2.571 2.4H2.57C1.151 32 0 30.925 0 29.6V2.4C0 1.075 1.151 0 2.571 0zm0 1.2c-.71 0-1.285.537-1.285 1.2v27.2c0 .663.575 1.2 1.285 1.2H45.43c.71 0 1.285-.537 1.285-1.2V2.4c0-.663-.575-1.2-1.285-1.2H2.57z",
+        transform: "translate(0 8)"
+    }), /*#__PURE__*/ React.createElement("path", {
+        d: "M0 7.2H48V12H0zM28.286 18.4H42c.473 0 .857.358.857.8v6.4c0 .442-.384.8-.857.8H28.286c-.474 0-.857-.358-.857-.8v-6.4c0-.442.383-.8.857-.8zm.268 1.05v5.9h13.178v-5.9H28.554z",
+        transform: "translate(0 8)"
+    }), /*#__PURE__*/ React.createElement("path", {
+        d: "M31.02 24v-2.693h-.045l-.89.572v-.659l.937-.602h.756V24h-.758zm2.577-2.37c0-.653.537-1.099 1.32-1.099.757 0 1.284.406 1.284.987 0 .368-.213.684-.841 1.235l-.693.617v.042h1.587V24H33.64v-.495l1.182-1.08c.51-.464.638-.64.638-.86 0-.272-.236-.464-.567-.464-.352 0-.593.215-.593.527v.014h-.703v-.012zm5.093.903v-.528h.442c.344 0 .578-.187.578-.464 0-.271-.226-.445-.58-.445-.352 0-.585.185-.605.478h-.7c.024-.64.534-1.043 1.325-1.043.743 0 1.278.38 1.278.912 0 .391-.263.696-.668.773v.043c.497.051.809.36.809.806 0 .593-.598 1.022-1.424 1.022-.809 0-1.356-.417-1.389-1.055h.726c.023.286.281.466.67.466.38 0 .643-.199.643-.487 0-.295-.248-.478-.655-.478h-.45z",
+        transform: "translate(0 8)"
+    })));
 };
-
-export default IconCvvVisaMc;
+export default IconCvvVisaMc;