@telefonica/mistica 14.28.1 → 14.30.0

package/dist-es/counter.css-mistica.js

@@ -0,0 +1,4 @@
+import "./sprinkles.css.ts.vanilla.css-mistica.js";
+import "./counter.css.ts.vanilla.css-mistica.js";
+var r = "rijsns8 _1y2v1nf5y _1y2v1nfdo _1y2v1nfb1 _1y2v1nfc4 _1y2v1nfck", s = "rijsnse _1y2v1nfc3 _1y2v1nfcj _1y2v1nfb1 _1y2v1nfdv _1y2v1nf5k", a = "rijsns6", f = "rijsns3 _1y2v1nfdv _1y2v1nf31 _1y2v1nfb7 _1y2v1nfe6", t = "rijsnsc rijsnsa _1y2v1nfb1", y = "rijsnsa _1y2v1nfb1", _ = "rijsns4", i = "rijsns0", o = "rijsns1", b = "rijsnsb rijsnsa _1y2v1nfb1", e = "_1y2v1nfb0 _1y2v1nfb6 _1y2v1nfbf";
+export { r as button, s as buttonBackground, a as buttonContainer, f as counter, t as decreaseButtonIcon, y as defaultButtonIcon, _ as disabled, i as hasTrashIcon, o as isButtonDisabled, b as trashButtonIcon, e as valueContainer };

package/dist-es/counter.css.ts.vanilla.css-mistica.js

@@ -0,0 +1,2 @@
+const s = "";
+export { s as default };

package/dist-es/counter.js

@@ -0,0 +1,187 @@
+function _define_property(obj, key, value) {
+    if (key in obj) {
+        Object.defineProperty(obj, key, {
+            value: value,
+            enumerable: true,
+            configurable: true,
+            writable: true
+        });
+    } else {
+        obj[key] = value;
+    }
+    return obj;
+}
+function _object_spread(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) {
+            _define_property(target, key, source[key]);
+        });
+    }
+    return target;
+}
+function ownKeys(object, enumerableOnly) {
+    var keys = Object.keys(object);
+    if (Object.getOwnPropertySymbols) {
+        var symbols = Object.getOwnPropertySymbols(object);
+        if (enumerableOnly) {
+            symbols = symbols.filter(function(sym) {
+                return Object.getOwnPropertyDescriptor(object, sym).enumerable;
+            });
+        }
+        keys.push.apply(keys, symbols);
+    }
+    return keys;
+}
+function _object_spread_props(target, source) {
+    source = source != null ? source : {};
+    if (Object.getOwnPropertyDescriptors) {
+        Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));
+    } else {
+        ownKeys(Object(source)).forEach(function(key) {
+            Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
+        });
+    }
+    return target;
+}
+import { jsx as r, jsxs as I } from "react/jsx-runtime";
+import * as V from "react";
+import { getPrefixedDataAttributes as L } from "./utils/dom.js";
+import { counter as R, disabled as g, buttonContainer as B, hasTrashIcon as j, isButtonDisabled as M, button as y, buttonBackground as S, decreaseButtonIcon as E, trashButtonIcon as O, valueContainer as Q, defaultButtonIcon as Z } from "./counter.css-mistica.js";
+import { useThemeVariant as _, ThemeVariant as q } from "./theme-variant-context.js";
+import { vars as c } from "./skins/skin-contract.css-mistica.js";
+import w from "./inline.js";
+import { Text3 as F } from "./text.js";
+import { BaseTouchable as P } from "./touchable.js";
+import G from "./generated/mistica-icons/icon-subtract-regular.js";
+import H from "./generated/mistica-icons/icon-add-more-regular.js";
+import J from "./generated/mistica-icons/icon-trash-can-regular.js";
+import { useTheme as K } from "./hooks.js";
+import N from "classnames";
+import U from "./screen-reader-only.js";
+const x = 20, W = (param)=>{
+    let { value: h , defaultValue: b , min: m , max: s , onChangeValue: a  } = param;
+    const i = h !== void 0, f = V.useCallback((n)=>n === void 0 ? m : Math.max(m, Math.min(s, n)), [
+        m,
+        s
+    ]), [e, p] = V.useState(f(b)), v = (n)=>{
+        i || p(n), a == null || a(n);
+    };
+    return [
+        i ? f(h) : e,
+        v
+    ];
+}, X = (param)=>{
+    let { value: h , defaultValue: b , onChangeValue: m , onRemove: s , min: a , max: i , dataAttributes: f , disabled: e , removeLabel: p , increaseLabel: v , decreaseLabel: n , valueLabel: C  } = param;
+    const A = _(), { texts: u  } = K(), l = a === void 0 ? 0 : a, d = Math.max(l, i === void 0 ? 999 : i), [t, T] = W({
+        value: h,
+        defaultValue: b,
+        min: l,
+        max: d,
+        onChangeValue: m
+    }), o = !!s && t === l, D = ()=>p === void 0 ? u.counterRemoveLabel : p, $ = ()=>v === void 0 ? u.counterIncreaseLabel : v, k = ()=>n === void 0 ? u.counterDecreaseLabel : n, z = ()=>`${t}, ${C === void 0 ? u.counterQuantity : C}${a !== void 0 ? `, ${u.counterMinValue} ${a}` : ""}${i !== void 0 ? `, ${u.counterMaxValue} ${i}` : ""}`;
+    return /* @__PURE__ */ r("div", _object_spread_props(_object_spread({
+        className: N(R, {
+            [g]: e
+        })
+    }, L(f, "Counter")), {
+        style: {
+            border: `1px solid ${A === "inverse" ? c.colors.backgroundContainer : c.colors.border}`
+        },
+        children: /* @__PURE__ */ I(w, {
+            space: 8,
+            alignItems: "center",
+            children: [
+                /* @__PURE__ */ r("div", {
+                    className: N(B, {
+                        [j]: o,
+                        [M]: e || !o && t === l,
+                        [g]: !e && !o && t === l
+                    }),
+                    children: /* @__PURE__ */ I(P, {
+                        className: y,
+                        disabled: !o && t === l || e,
+                        onPress: ()=>o ? s == null ? void 0 : s() : T(t - 1),
+                        "aria-label": o ? D() : k(),
+                        children: [
+                            /* @__PURE__ */ r("div", {
+                                className: S
+                            }),
+                            /* @__PURE__ */ r("div", {
+                                className: E,
+                                "aria-hidden": o,
+                                children: /* @__PURE__ */ r(G, {
+                                    size: x,
+                                    color: t === l && !o || e ? c.colors.control : c.colors.controlActivated
+                                })
+                            }),
+                            /* @__PURE__ */ r("div", {
+                                className: O,
+                                "aria-hidden": !o,
+                                children: /* @__PURE__ */ r(J, {
+                                    size: x,
+                                    color: c.colors.controlError
+                                })
+                            })
+                        ]
+                    })
+                }),
+                /* @__PURE__ */ r("div", {
+                    className: Q,
+                    style: {
+                        width: `${Math.max(3, String(d).length) * 1.25}ch`
+                    },
+                    children: /* @__PURE__ */ I(q, {
+                        variant: "default",
+                        children: [
+                            /* @__PURE__ */ r("div", {
+                                "aria-hidden": !0,
+                                children: /* @__PURE__ */ r(F, {
+                                    regular: !0,
+                                    color: c.colors.textPrimary,
+                                    children: t
+                                })
+                            }),
+                            /* @__PURE__ */ r(U, {
+                                children: /* @__PURE__ */ r("span", {
+                                    children: z()
+                                })
+                            })
+                        ]
+                    })
+                }),
+                /* @__PURE__ */ r("div", {
+                    className: N(B, {
+                        [M]: e || t === d,
+                        [g]: !e && t === d
+                    }),
+                    children: /* @__PURE__ */ I(P, {
+                        className: y,
+                        disabled: t === d || e,
+                        onPress: ()=>T(t + 1),
+                        "aria-label": $(),
+                        children: [
+                            /* @__PURE__ */ r("div", {
+                                className: S
+                            }),
+                            /* @__PURE__ */ r("div", {
+                                className: Z,
+                                children: /* @__PURE__ */ r(H, {
+                                    size: x,
+                                    color: t === d || e ? c.colors.control : c.colors.controlActivated
+                                })
+                            })
+                        ]
+                    })
+                })
+            ]
+        })
+    }));
+}, hr = X;
+export { hr as default };

package/dist-es/generated/mistica-icons/icon-add-more-filled.js

@@ -94,7 +94,7 @@ const a = (_param)=>{
     }, s), {
         children: /* @__PURE__ */ r("path", {
             fill: l,
-            d: "M12 4a1 1 0 0 0-1 1v5.498H6.002a1.002 1.002 0 1 0 0 2.004H11V18a1 1 0 1 0 2 0v-5.498h4.998a1.002 1.002 0 1 0 0-2.004H13V5a1 1 0 0 0-1-1Z"
+            d: "M12 2a1 1 0 0 0-1 1v7.498H3.002a1.002 1.002 0 1 0 0 2.004H11V21a1 1 0 1 0 2 0v-8.498h7.998a1.002 1.002 0 1 0 0-2.004H13V3a1 1 0 0 0-1-1Z"
         })
     }));
 }, h = a;

package/dist-es/generated/mistica-icons/icon-add-more-light.js

@@ -95,7 +95,7 @@ const v = (_param)=>{
     }, e), {
         children: /* @__PURE__ */ r("path", {
             fill: t,
-            d: "M11.676 4.35a.35.35 0 1 1 .7 0v6.8h4.414a.35.35 0 1 1 0 .7h-4.414v6.8a.35.35 0 1 1-.7 0v-6.8H5.35a.35.35 0 1 1 0-.7h6.326v-6.8Zm6.752 7.72a.573.573 0 0 0 .572-.574.573.573 0 0 0-.572-.574.573.573 0 0 0-.571.574c0 .317.256.574.572.574Z"
+            d: "M11.676 2.35a.35.35 0 1 1 .7 0v8.8h7.414a.35.35 0 1 1 0 .7h-7.414v9.8a.35.35 0 1 1-.7 0v-9.8H2.35a.35.35 0 1 1 0-.7h9.326v-8.8Zm9.752 9.72a.573.573 0 0 0 .572-.574.573.573 0 0 0-.572-.574.573.573 0 0 0-.571.574c0 .317.256.574.572.574Z"
         })
     })) : /* @__PURE__ */ r("svg", _object_spread_props(_object_spread({
         width: o,

package/dist-es/generated/mistica-icons/icon-add-more-regular.js

@@ -95,7 +95,7 @@ const v = (_param)=>{
     }, o), {
         children: /* @__PURE__ */ r("path", {
             fill: t,
-            d: "M18.524 11.525h-6.057v-6.05a.475.475 0 0 0-.951 0v6.05H5.459a.476.476 0 1 0 0 .95h6.057v6.05a.476.476 0 0 0 .95 0v-6.05h6.058a.475.475 0 1 0 0-.95Z"
+            d: "M21.321 11.321h-8.643V2.68a.679.679 0 1 0-1.357 0v8.642H2.679a.679.679 0 1 0 0 1.357h8.642v8.643a.679.679 0 0 0 1.357 0v-8.643h8.643a.679.679 0 1 0 0-1.357Z"
         })
     })) : a.match(/^o2/i) ? /* @__PURE__ */ r("svg", _object_spread_props(_object_spread({
         width: e,
@@ -105,7 +105,7 @@ const v = (_param)=>{
     }, o), {
         children: /* @__PURE__ */ r("path", {
             fill: t,
-            d: "M11.42 4.72a.722.722 0 0 1 .716-.716.722.722 0 0 1 .716.716l.003 6.064 5.426.003a.722.722 0 0 1 .716.716.84.84 0 0 1-.22.552c-.127.127-.3.16-.493.16l-5.432.003v6.073a.703.703 0 0 1-.713.712.722.722 0 0 1-.715-.715v-6.072l-5.712.005a.722.722 0 0 1-.716-.715.722.722 0 0 1 .716-.716l5.712-.006-.003-6.064Z"
+            d: "M11.42 2.72a.722.722 0 0 1 .716-.716.722.722 0 0 1 .716.716l.003 8.064 8.426.003a.722.722 0 0 1 .716.716.84.84 0 0 1-.22.552c-.127.127-.3.16-.493.16l-8.432.003v9.073a.703.703 0 0 1-.713.712.722.722 0 0 1-.715-.715v-9.072l-8.712.005a.722.722 0 0 1-.716-.715.722.722 0 0 1 .716-.716l8.711-.006-.002-8.064Z"
         })
     })) : /* @__PURE__ */ r("svg", _object_spread_props(_object_spread({
         width: e,

package/dist-es/generated/mistica-icons/icon-subtract-light.js

@@ -77,25 +77,36 @@ function _object_without_properties_loose(source, excluded) {
     }
     return target;
 }
-import { jsx as t } from "react/jsx-runtime";
+import { jsx as o } from "react/jsx-runtime";
+import { useTheme as h } from "../../hooks.js";
 import { useIsInverseVariant as c } from "../../theme-variant-context.js";
-import { vars as o } from "../../skins/skin-contract.css-mistica.js";
-const a = (_param)=>{
-    var { color: e , size: r = 24  } = _param, s = _object_without_properties(_param, [
+import { vars as i } from "../../skins/skin-contract.css-mistica.js";
+const l = (_param)=>{
+    var { color: n , size: t = 24  } = _param, r = _object_without_properties(_param, [
         "color",
         "size"
     ]);
-    const i = c(), n = e !== null && e !== void 0 ? e : i ? o.colors.inverse : o.colors.neutralHigh;
-    return /* @__PURE__ */ t("svg", _object_spread_props(_object_spread({
-        width: r,
-        height: r,
+    const s = c(), e = n !== null && n !== void 0 ? n : s ? i.colors.inverse : i.colors.neutralHigh, { skinName: a  } = h();
+    return a.match(/^o2/i) ? /* @__PURE__ */ o("svg", _object_spread_props(_object_spread({
+        width: t,
+        height: t,
         viewBox: "0 0 24 24",
         role: "presentation"
-    }, s), {
-        children: /* @__PURE__ */ t("path", {
-            fill: n,
+    }, r), {
+        children: /* @__PURE__ */ o("path", {
+            fill: e,
+            d: "M19.79 11.15a.35.35 0 1 1 0 .7H2.35a.35.35 0 1 1 0-.7h17.44Zm1.639.92a.573.573 0 0 0 .571-.574.573.573 0 0 0-.572-.574.573.573 0 0 0-.571.574c0 .317.256.574.572.574Z"
+        })
+    })) : /* @__PURE__ */ o("svg", _object_spread_props(_object_spread({
+        width: t,
+        height: t,
+        viewBox: "0 0 24 24",
+        role: "presentation"
+    }, r), {
+        children: /* @__PURE__ */ o("path", {
+            fill: e,
             d: "M3 12.001c0-.333.269-.6.6-.6h16.803a.6.6 0 0 1-.002 1.199H3.599A.6.6 0 0 1 3 12.002Z"
         })
     }));
-}, m = a;
-export { m as default };
+}, v = l;
+export { v as default };

package/dist-es/generated/mistica-icons/icon-subtract-regular.js

@@ -77,25 +77,46 @@ function _object_without_properties_loose(source, excluded) {
     }
     return target;
 }
-import { jsx as o } from "react/jsx-runtime";
-import { useIsInverseVariant as i } from "../../theme-variant-context.js";
-import { vars as t } from "../../skins/skin-contract.css-mistica.js";
-const l = (_param)=>{
-    var { color: e , size: r = 24  } = _param, s = _object_without_properties(_param, [
+import { jsx as t } from "react/jsx-runtime";
+import { useTheme as h } from "../../hooks.js";
+import { useIsInverseVariant as s } from "../../theme-variant-context.js";
+import { vars as a } from "../../skins/skin-contract.css-mistica.js";
+const c = (_param)=>{
+    var { color: n , size: r = 24  } = _param, e = _object_without_properties(_param, [
         "color",
         "size"
     ]);
-    const n = i(), a = e !== null && e !== void 0 ? e : n ? t.colors.inverse : t.colors.neutralHigh;
-    return /* @__PURE__ */ o("svg", _object_spread_props(_object_spread({
+    const l = s(), o = n !== null && n !== void 0 ? n : l ? a.colors.inverse : a.colors.neutralHigh, { skinName: i  } = h();
+    return i.match(/^blau/i) ? /* @__PURE__ */ t("svg", _object_spread_props(_object_spread({
         width: r,
         height: r,
         viewBox: "0 0 24 24",
         role: "presentation"
-    }, s), {
-        children: /* @__PURE__ */ o("path", {
-            fill: a,
+    }, e), {
+        children: /* @__PURE__ */ t("path", {
+            fill: o,
+            d: "M21.321 11.321H2.679a.679.679 0 1 0 0 1.357h18.642a.679.679 0 1 0 0-1.357Z"
+        })
+    })) : i.match(/^o2/i) ? /* @__PURE__ */ t("svg", _object_spread_props(_object_spread({
+        width: r,
+        height: r,
+        viewBox: "0 0 24 24",
+        role: "presentation"
+    }, e), {
+        children: /* @__PURE__ */ t("path", {
+            fill: o,
+            d: "M21.285 10.783a.722.722 0 0 1 .715.716.84.84 0 0 1-.219.551c-.127.128-.3.161-.493.161-11.82.004-6.036-.002-18.572.006A.722.722 0 0 1 2 11.5a.722.722 0 0 1 .716-.715c11.312-.008 6.967-.007 18.569-.003Z"
+        })
+    })) : /* @__PURE__ */ t("svg", _object_spread_props(_object_spread({
+        width: r,
+        height: r,
+        viewBox: "0 0 24 24",
+        role: "presentation"
+    }, e), {
+        children: /* @__PURE__ */ t("path", {
+            fill: o,
             d: "M3.001 12.047a.879.879 0 0 1 .828-.924h16.34a.876.876 0 0 1 .003 1.752H3.829A.876.876 0 0 1 3 12.047Z"
         })
     }));
-}, f = l;
-export { f as default };
+}, d = c;
+export { d as default };