@telefonica/mistica 12.9.1 → 12.11.0

package/dist/credit-card-number-field.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, "__esModule", {
 Object.defineProperty(exports, "default", {
     enumerable: true,
     get: function() {
-        return dr;
+        return gr;
     }
 });
 var _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
@@ -17,10 +17,10 @@ var _iconCreditcardJs = /*#__PURE__*/ _interopRequireDefault(require("./icons/ic
 var _iconVisaJs = /*#__PURE__*/ _interopRequireDefault(require("./icons/icon-visa.js"));
 var _iconMastercardJs = /*#__PURE__*/ _interopRequireDefault(require("./icons/icon-mastercard.js"));
 var _iconAmexJs = /*#__PURE__*/ _interopRequireDefault(require("./icons/icon-amex.js"));
-var _jssJs = require("./jss.js");
 var _rifm = require("rifm");
 var _domJs = require("./utils/dom.js");
 var _commonJs = require("./utils/common.js");
+var _creditCardNumberFieldCssMisticaJs = require("./credit-card-number-field.css-mistica.js");
 var _jsxRuntimeJs = require("./_virtual/jsx-runtime.js");
 function _interopRequireDefault(obj) {
     return obj && obj.__esModule ? obj : {
@@ -195,29 +195,29 @@ function _unsupportedIterableToArray(o, minLen) {
     if (n === "Map" || n === "Set") return Array.from(n);
     if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen);
 }
-var J = function J(r) {
+var X = function X(r) {
     var t, e;
     var i = String(r != null ? r : "").replace(/[^\d]/g, "");
     return (e = (t = i.match(/.{1,4}/g)) == null ? void 0 : t.join(" ")) != null ? e : i;
-}, K = function K(_param) {
-    var r = _param.inputRef, i = _param.value, t = _param.defaultValue, e = _param.onChange, a = _objectWithoutProperties(_param, [
+}, Y = function Y(_param) {
+    var r = _param.inputRef, i = _param.value, t = _param.defaultValue, e = _param.onChange, c = _objectWithoutProperties(_param, [
         "inputRef",
         "value",
         "defaultValue",
         "onChange"
     ]);
-    var ref = _slicedToArray(_react.useState(t != null ? t : ""), 2), s = ref[0], N = ref[1], f = _react.useRef(null), u = (typeof i === "undefined" ? "undefined" : _typeof(i)) < "u", d = u ? i : s, m = _react.useCallback(function(g) {
-        u || N(g), f.current && (e == null || e((0, _domJs.createChangeEvent)(f.current, g)));
+    var ref = _slicedToArray(_react.useState(t != null ? t : ""), 2), m = ref[0], N = ref[1], f = _react.useRef(null), u = (typeof i === "undefined" ? "undefined" : _typeof(i)) < "u", d = u ? i : m, a = _react.useCallback(function(l) {
+        u || N(l), f.current && (e == null || e((0, _domJs.createChangeEvent)(f.current, l)));
     }, [
         u,
         e
     ]), p = (0, _rifm.useRifm)({
-        format: J,
+        format: X,
         value: d,
-        onChange: m,
+        onChange: a,
         accept: /[\d]+/g
     });
-    return /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)("input", _objectSpreadProps(_objectSpread({}, a), {
+    return /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)("input", _objectSpreadProps(_objectSpread({}, c), {
         type: "text",
         inputMode: "decimal",
         maxLength: (0, _creditCardJs.getCreditCardNumberLength)(p.value) + 3,
@@ -225,16 +225,16 @@ var J = function J(r) {
         value: p.value,
         ref: (0, _commonJs.combineRefs)(r, f)
     }));
-}, Q = function Q(r) {
+}, Z = function Z(r) {
     return (0, _creditCardJs.isVisa)(r) ? /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(_iconVisaJs.default, {}) : (0, _creditCardJs.isMasterCard)(r) ? /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(_iconMastercardJs.default, {}) : (0, _creditCardJs.isAmericanExpress)(r) ? /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(_iconAmexJs.default, {}) : null;
-}, W = {
+}, $ = {
     showBackface: !1,
     animationTarget: /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(_iconCreditcardJs.default, {}),
     isAnimating: !1
-}, X = function X(r, param) {
+}, v = function v(r, param) {
     var i = param.type, t = param.value;
     if (i === "INPUT") {
-        var e = Q(t);
+        var e = Z(t);
         if (e && !r.showBackface) return {
             animationTarget: e,
             showBackface: !0,
@@ -252,71 +252,43 @@ var J = function J(r) {
     return i === "TRANSITION_END" ? _objectSpreadProps(_objectSpread({}, r), {
         isAnimating: !1
     }) : r;
-}, Z = (0, _jssJs.createUseStyles)(function() {
-    return {
-        flip: {
-            perspective: 1e3
-        },
-        flipInner: {
-            position: "relative",
-            transition: "transform 0.4s",
-            transformStyle: "preserve-3d",
-            "& div": {
-                backfaceVisibility: "hidden"
-            },
-            transform: function transform(param) {
-                var r = param.showBackface;
-                return r ? "rotateY(180deg)" : "none";
-            }
-        },
-        flipFront: {
-            position: "absolute"
-        },
-        flipBack: {
-            transform: "rotateY(180deg)"
-        }
-    };
-}), $ = function $(param) {
+}, rr = function rr(param) {
     var r = param.value;
-    var ref = _slicedToArray(_react.useReducer(X, W), 2), ref1 = ref[0], i = ref1.showBackface, t = ref1.animationTarget, e = ref1.isAnimating, a = ref[1];
-    _react.useEffect(function() {
-        a({
+    var ref = _slicedToArray(_react.useReducer(v, $), 2), ref1 = ref[0], i = ref1.showBackface, t = ref1.animationTarget, e = ref1.isAnimating, c = ref[1];
+    return _react.useEffect(function() {
+        c({
             type: "INPUT",
             value: r
         });
     }, [
         r
-    ]);
-    var s = Z({
-        showBackface: i
-    });
-    return /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)("div", {
-        className: s.flip,
+    ]), /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)("div", {
+        className: _creditCardNumberFieldCssMisticaJs.flip,
         children: /* @__PURE__ */ (0, _jsxRuntimeJs.jsxs)("div", {
-            className: s.flipInner,
+            className: _creditCardNumberFieldCssMisticaJs.variants[i ? "backface" : "default"],
             onTransitionEnd: function onTransitionEnd() {
-                return e && a({
+                return e && c({
                     type: "TRANSITION_END"
                 });
             },
             children: [
                 /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)("div", {
-                    className: s.flipFront,
+                    className: _creditCardNumberFieldCssMisticaJs.flipFront,
                     children: /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(_iconCreditcardJs.default, {})
                 }),
                 /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)("div", {
-                    className: s.flipBack,
+                    className: _creditCardNumberFieldCssMisticaJs.flipBack,
                     children: t
                 })
             ]
         })
     });
-}, dr = function dr(_param) {
-    var r = _param.disabled, i = _param.error, t = _param.helperText, e = _param.name, a = _param.optional, s = _param.validate, N = _param.onChange, f = _param.onChangeValue, u = _param.onBlur, tmp = _param.acceptedCards, d = tmp === void 0 ? {
+}, gr = function gr(_param) {
+    var r = _param.disabled, i = _param.error, t = _param.helperText, e = _param.name, c = _param.optional, m = _param.validate, N = _param.onChange, f = _param.onChangeValue, u = _param.onBlur, tmp = _param.acceptedCards, d = tmp === void 0 ? {
         americanExpress: !0,
         visa: !0,
         masterCard: !0
-    } : tmp, m = _param.value, tmp1 = _param.autoComplete, p = tmp1 === void 0 ? "cc-number" : tmp1, g = _param.defaultValue, w = _objectWithoutProperties(_param, [
+    } : tmp, a = _param.value, tmp1 = _param.autoComplete, p = tmp1 === void 0 ? "cc-number" : tmp1, l = _param.defaultValue, F = _objectWithoutProperties(_param, [
         "disabled",
         "error",
         "helperText",
@@ -331,19 +303,19 @@ var J = function J(r) {
         "autoComplete",
         "defaultValue"
     ]);
-    var E;
-    var ref = (0, _hooksJs.useTheme)(), b = ref.texts, ref1 = (0, _formContextJs.useForm)(), F = ref1.jumpToNext, R = ref1.rawValues, V = ref1.setFormError, h = function h(n, C) {
-        var c = b.formCreditCardNumberError;
-        return n ? (0, _creditCardJs.isAmericanExpress)(n) && !d.americanExpress || (0, _creditCardJs.isVisa)(n) && !d.visa || (0, _creditCardJs.isMasterCard)(n) && !d.masterCard || !(0, _creditCardJs.isValidCreditCardNumber)(n) || (0, _creditCardJs.getCreditCardNumberLength)(n) !== n.length ? c : s == null ? void 0 : s(n, C) : a ? "" : b.formFieldErrorIsMandatory;
+    var b;
+    var ref = (0, _hooksJs.useTheme)(), E = ref.texts, ref1 = (0, _formContextJs.useForm)(), S = ref1.jumpToNext, y = ref1.rawValues, V = ref1.setFormError, h = function h(n, C) {
+        var s = E.formCreditCardNumberError;
+        return n ? (0, _creditCardJs.isAmericanExpress)(n) && !d.americanExpress || (0, _creditCardJs.isVisa)(n) && !d.visa || (0, _creditCardJs.isMasterCard)(n) && !d.masterCard || !(0, _creditCardJs.isValidCreditCardNumber)(n) || (0, _creditCardJs.getCreditCardNumberLength)(n) !== n.length ? s : m == null ? void 0 : m(n, C) : c ? "" : E.formFieldErrorIsMandatory;
     }, k = function k(n) {
         return n.replace(/\s/g, "");
     }, B = (0, _formContextJs.useFieldProps)({
         name: e,
-        value: m,
-        defaultValue: g,
+        value: a,
+        defaultValue: l,
         processValue: k,
         helperText: t,
-        optional: a,
+        optional: c,
         error: i,
         disabled: r,
         onBlur: u,
@@ -351,22 +323,22 @@ var J = function J(r) {
         onChange: N,
         onChangeValue: f
     });
-    return /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(_textFieldBaseJs.TextFieldBaseAutosuggest, _objectSpreadProps(_objectSpread({}, w, B), {
+    return /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(_textFieldBaseJs.TextFieldBaseAutosuggest, _objectSpreadProps(_objectSpread({}, F, B), {
         onChange: function onChange(n) {
             B.onChange(n);
-            var C = n.currentTarget.value, c = k(C);
-            if (c.length >= (0, _creditCardJs.getCreditCardNumberLength)(c)) {
-                var y = h == null ? void 0 : h(c, C);
-                y ? V({
+            var C = n.currentTarget.value, s = k(C);
+            if (s.length >= (0, _creditCardJs.getCreditCardNumberLength)(s)) {
+                var w = h == null ? void 0 : h(s, C);
+                w ? V({
                     name: e,
-                    error: y
-                }) : F(e);
+                    error: w
+                }) : S(e);
             }
         },
-        inputComponent: K,
+        inputComponent: Y,
         autoComplete: p,
-        endIcon: /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)($, {
-            value: (E = m != null ? m : R[e]) != null ? E : ""
+        endIcon: /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(rr, {
+            value: (b = a != null ? a : y[e]) != null ? b : ""
         })
     }));
 };

package/dist/cvv-field.css-mistica.js

@@ -0,0 +1,21 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: all[name]
+    });
+}
+_export(exports, {
+    cvvText: function() {
+        return v;
+    },
+    tooltipContainer: function() {
+        return i;
+    }
+});
+require("./sprinkles.css.ts.vanilla.js");
+require("./cvv-field.css.ts.vanilla.js");
+var v = "_10ijton2 _1y2v1nf1i", i = "_1y2v1nf7b _1y2v1nf7q";

package/dist/cvv-field.css.d.ts

@@ -0,0 +1,2 @@
+export declare const tooltipContainer: string;
+export declare const cvvText: string;

package/dist/cvv-field.css.js.flow

@@ -0,0 +1,4 @@
+// @flow
+
+declare export var tooltipContainer: string;
+declare export var cvvText: string;

package/dist/cvv-field.css.ts.vanilla.js

@@ -0,0 +1,11 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "default", {
+    enumerable: true,
+    get: function() {
+        return s;
+    }
+});
+var s = "";

package/dist/cvv-field.js

@@ -5,10 +5,9 @@ Object.defineProperty(exports, "__esModule", {
 Object.defineProperty(exports, "default", {
     enumerable: true,
     get: function() {
-        return $;
+        return L;
     }
 });
-var _jssJs = require("./jss.js");
 var _hooksJs = require("./hooks.js");
 var _iconCvvVisaMcJs = /*#__PURE__*/ _interopRequireDefault(require("./icons/icon-cvv-visa-mc.js"));
 var _iconCvvAmexJs = /*#__PURE__*/ _interopRequireDefault(require("./icons/icon-cvv-amex.js"));
@@ -18,6 +17,7 @@ var _iconInfoCvvJs = /*#__PURE__*/ _interopRequireDefault(require("./icons/icon-
 var _formContextJs = require("./form-context.js");
 var _textFieldBaseJs = require("./text-field-base.js");
 var _integerFieldJs = require("./integer-field.js");
+var _cvvFieldCssMisticaJs = require("./cvv-field.css-mistica.js");
 var _jsxRuntimeJs = require("./_virtual/jsx-runtime.js");
 function _interopRequireDefault(obj) {
     return obj && obj.__esModule ? obj : {
@@ -103,59 +103,45 @@ function _objectWithoutPropertiesLoose(source, excluded) {
     }
     return target;
 }
-var D = (0, _jssJs.createUseStyles)(function(e) {
-    return {
-        cvvText: {
-            margin: 0,
-            marginLeft: 16,
-            color: e.colors.textPrimary,
-            lineHeight: 1.42857142,
-            fontSize: 14
-        },
-        tooltipContainer: {
-            display: "flex",
-            alignItems: "center"
-        }
-    };
-}), G = function G(param) {
-    var e = param.acceptedCards;
-    var o = D(), ref = (0, _hooksJs.useTheme)(), i = ref.texts;
+var K = function K(param) {
+    var t = param.acceptedCards;
+    var ref = (0, _hooksJs.useTheme)(), e = ref.texts;
     return /* @__PURE__ */ (0, _jsxRuntimeJs.jsxs)(_jsxRuntimeJs.Fragment, {
         children: [
             /* @__PURE__ */ (0, _jsxRuntimeJs.jsxs)("div", {
-                className: o.tooltipContainer,
+                className: _cvvFieldCssMisticaJs.tooltipContainer,
                 children: [
                     /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(_iconCvvVisaMcJs.default, {
                         size: 48,
                         role: "img"
                     }),
                     /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)("p", {
-                        className: o.cvvText,
-                        children: i.formCreditCardCvvTooltipVisaMc
+                        className: _cvvFieldCssMisticaJs.cvvText,
+                        children: e.formCreditCardCvvTooltipVisaMc
                     })
                 ]
             }),
-            (e == null ? void 0 : e.americanExpress) && /* @__PURE__ */ (0, _jsxRuntimeJs.jsxs)("div", {
-                className: o.tooltipContainer,
+            (t == null ? void 0 : t.americanExpress) && /* @__PURE__ */ (0, _jsxRuntimeJs.jsxs)("div", {
+                className: _cvvFieldCssMisticaJs.tooltipContainer,
                 children: [
                     /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(_iconCvvAmexJs.default, {
                         size: 48,
                         role: "img"
                     }),
                     /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)("p", {
-                        className: o.cvvText,
-                        children: i.formCreditCardCvvTooltipAmex
+                        className: _cvvFieldCssMisticaJs.cvvText,
+                        children: e.formCreditCardCvvTooltipAmex
                     })
                 ]
             })
         ]
     });
-}, $ = function $(_param) {
-    var e = _param.disabled, o = _param.error, i = _param.helperText, n = _param.name, f = _param.optional, l = _param.validate, h = _param.onChange, x = _param.onChangeValue, T = _param.onBlur, tmp = _param.acceptedCards, I = tmp === void 0 ? {
+}, L = function L(_param) {
+    var t = _param.disabled, e = _param.error, x = _param.helperText, s = _param.name, f = _param.optional, n = _param.validate, I = _param.onChange, T = _param.onChangeValue, F = _param.onBlur, tmp = _param.acceptedCards, y = tmp === void 0 ? {
         americanExpress: !0,
         visa: !0,
         masterCard: !0
-    } : tmp, tmp1 = _param.maxLength, m = tmp1 === void 0 ? 4 : tmp1, y = _param.value, tmp2 = _param.autoComplete, F = tmp2 === void 0 ? "cc-csc" : tmp2, z = _param.defaultValue, E = _objectWithoutProperties(_param, [
+    } : tmp, tmp1 = _param.maxLength, m = tmp1 === void 0 ? 4 : tmp1, E = _param.value, tmp2 = _param.autoComplete, N = tmp2 === void 0 ? "cc-csc" : tmp2, V = _param.defaultValue, j = _objectWithoutProperties(_param, [
         "disabled",
         "error",
         "helperText",
@@ -171,43 +157,43 @@ var D = (0, _jssJs.createUseStyles)(function(e) {
         "autoComplete",
         "defaultValue"
     ]);
-    var ref = (0, _hooksJs.useTheme)(), c = ref.texts, ref1 = (0, _formContextJs.useForm)(), N = ref1.setFormError, V = ref1.jumpToNext, p = function p(r, s) {
-        return r ? r.length !== m ? c.formCreditCardCvvError : l == null ? void 0 : l(r, s) : f ? "" : c.formFieldErrorIsMandatory;
-    }, u = function u(r) {
-        return r;
-    }, v = (0, _formContextJs.useFieldProps)({
-        name: n,
-        value: y,
-        defaultValue: z,
-        processValue: u,
-        helperText: i,
+    var ref = (0, _hooksJs.useTheme)(), l = ref.texts, ref1 = (0, _formContextJs.useForm)(), z = ref1.setFormError, M = ref1.jumpToNext, p = function p(o, i) {
+        return o ? o.length !== m ? l.formCreditCardCvvError : n == null ? void 0 : n(o, i) : f ? "" : l.formFieldErrorIsMandatory;
+    }, a = function a(o) {
+        return o;
+    }, u = (0, _formContextJs.useFieldProps)({
+        name: s,
+        value: E,
+        defaultValue: V,
+        processValue: a,
+        helperText: x,
         optional: f,
-        error: o,
-        disabled: e,
-        onBlur: T,
+        error: e,
+        disabled: t,
+        onBlur: F,
         validate: p,
-        onChange: h,
-        onChangeValue: x
+        onChange: I,
+        onChangeValue: T
     });
-    return /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(_textFieldBaseJs.TextFieldBaseAutosuggest, _objectSpreadProps(_objectSpread({}, E, v), {
+    return /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(_textFieldBaseJs.TextFieldBaseAutosuggest, _objectSpreadProps(_objectSpread({}, j, u), {
         maxLength: m,
-        onChange: function onChange(r) {
-            v.onChange(r);
-            var s = r.currentTarget.value, d = u(s);
+        onChange: function onChange(o) {
+            u.onChange(o);
+            var i = o.currentTarget.value, d = a(i);
             if (d.length === m) {
-                var C = p(d, s);
-                C ? N({
-                    name: n,
-                    error: C
-                }) : V(n);
+                var v = p(d, i);
+                v ? z({
+                    name: s,
+                    error: v
+                }) : M(s);
             }
         },
         endIcon: /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(_tooltipJs.default, {
             position: "top",
-            children: /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(G, {
-                acceptedCards: I
+            children: /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)(K, {
+                acceptedCards: y
             }),
-            targetLabel: c.formCreditCardCvvTooltipVisaMcButton,
+            targetLabel: l.formCreditCardCvvTooltipVisaMcButton,
             target: /* @__PURE__ */ (0, _jsxRuntimeJs.jsx)("div", {
                 style: {
                     width: 16,
@@ -229,7 +215,7 @@ var D = (0, _jssJs.createUseStyles)(function(e) {
                 })
             })
         }),
-        autoComplete: F,
+        autoComplete: N,
         inputComponent: _integerFieldJs.IntegerInput
     }));
 };

package/dist/date-time-picker.css-mistica.js

@@ -0,0 +1,12 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "reactDatePicker", {
+    enumerable: true,
+    get: function() {
+        return e;
+    }
+});
+require("./date-time-picker.css.ts.vanilla.js");
+var e = "c0yqjy0";

package/dist/date-time-picker.css.d.ts

@@ -0,0 +1 @@
+export declare const reactDatePicker: string;

package/dist/date-time-picker.css.js.flow

@@ -0,0 +1,3 @@
+// @flow
+
+declare export var reactDatePicker: string;

package/dist/date-time-picker.css.ts.vanilla.js

@@ -0,0 +1,11 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "default", {
+    enumerable: true,
+    get: function() {
+        return a;
+    }
+});
+var a = "";