@telefonica/mistica 14.8.0 → 14.10.0

package/dist-es/chip.js

@@ -50,75 +50,88 @@ function _objectSpreadProps(target, source) {
     }
     return target;
 }
-import v from "classnames";
-import { useTheme as x } from "./hooks.js";
-import r from "./box.js";
-import { Text2 as C } from "./text.js";
-import y from "./icon-button.js";
-import A from "./generated/mistica-icons/icon-close-regular.js";
-import { pxToRem as R } from "./utils/css.js";
-import { iconActive as T, icon as b, chipVariants as i, chipInteractiveVariants as j } from "./chip.css-mistica.js";
-import { vars as z } from "./skins/skin-contract.css-mistica.js";
-import { getPrefixedDataAttributes as c } from "./utils/dom.js";
-import { useThemeVariant as B } from "./theme-variant-context.js";
-import { jsxs as d, Fragment as I, jsx as e } from "./_virtual/jsx-runtime.js";
-const H = (param)=>{
-    let { Icon: t , children: p , id: f , dataAttributes: n , active: o , onClose: a  } = param;
-    const { texts: u , isDarkMode: h  } = x(), s = B() === "alternative", m = /* @__PURE__ */ d(I, {
+import k from "classnames";
+import { useTheme as P } from "./hooks.js";
+import n from "./box.js";
+import { Text2 as T } from "./text.js";
+import A from "./icon-button.js";
+import E from "./generated/mistica-icons/icon-close-regular.js";
+import { pxToRem as I } from "./utils/css.js";
+import { iconActive as V, icon as w, chipVariants as a, button as y, chipInteractiveVariants as B } from "./chip.css-mistica.js";
+import { vars as N } from "./skins/skin-contract.css-mistica.js";
+import { getPrefixedDataAttributes as u } from "./utils/dom.js";
+import { useThemeVariant as R } from "./theme-variant-context.js";
+import { BaseTouchable as c } from "./touchable.js";
+import { jsxs as h, Fragment as j, jsx as t } from "./_virtual/jsx-runtime.js";
+const S = (e)=>{
+    const { Icon: i , children: v , id: g , dataAttributes: l , active: o , onClose: s  } = e, { texts: b , isDarkMode: x  } = P(), m = R() === "alternative", d = /* @__PURE__ */ h(j, {
         children: [
-            t && /* @__PURE__ */ e(r, {
+            i && /* @__PURE__ */ t(n, {
                 paddingRight: 4,
-                className: o ? T : b,
-                children: /* @__PURE__ */ e(t, {
+                className: o ? V : w,
+                children: /* @__PURE__ */ t(i, {
                     color: "currentColor",
-                    size: R(16)
+                    size: I(16)
                 })
             }),
-            /* @__PURE__ */ e(C, {
-                id: f,
+            /* @__PURE__ */ t(T, {
+                id: g,
                 medium: !0,
                 truncate: 1,
                 color: "currentColor",
-                children: p
+                children: v
             })
         ]
-    }), l = t ? 8 : 12;
-    if (a) return /* @__PURE__ */ d(r, _objectSpreadProps(_objectSpread({
-        className: s ? i.overAlternative : i.default,
-        paddingLeft: l
-    }, c(n, "Chip")), {
+    }), f = i ? 8 : 12;
+    if (s) return /* @__PURE__ */ h(n, _objectSpreadProps(_objectSpread({
+        className: m ? a.overAlternative : a.default,
+        paddingLeft: f
+    }, u(l, "Chip")), {
         children: [
-            m,
-            /* @__PURE__ */ e(r, {
+            d,
+            /* @__PURE__ */ t(n, {
                 paddingLeft: 4,
-                children: /* @__PURE__ */ e(y, {
+                children: /* @__PURE__ */ t(A, {
                     size: 24,
                     style: {
                         display: "flex",
                         justifyContent: "center",
                         alignItems: "center"
                     },
-                    "aria-label": u.closeButtonLabel,
-                    onPress: ()=>a(),
-                    children: /* @__PURE__ */ e(A, {
+                    "aria-label": b.closeButtonLabel,
+                    onPress: ()=>s(),
+                    children: /* @__PURE__ */ t(E, {
                         size: 16,
-                        color: z.colors.neutralMedium
+                        color: N.colors.neutralMedium
                     })
                 })
             })
         ]
     }));
-    {
-        const g = o !== void 0;
-        return /* @__PURE__ */ e(r, _objectSpreadProps(_objectSpread({
-            className: v(i[o ? "active" : s ? "overAlternative" : "default"], {
-                [j[h ? "dark" : "light"]]: g
+    const C = o !== void 0 || e.href || e.onPress || e.to, r = ()=>/* @__PURE__ */ t(n, _objectSpreadProps(_objectSpread({
+            className: k(a[o ? "active" : m ? "overAlternative" : "default"], {
+                [B[x ? "dark" : "light"]]: C
             }),
-            paddingLeft: l,
+            paddingLeft: f,
             paddingRight: 12
-        }, c(n, "Chip")), {
-            children: m
+        }, u(l, "Chip")), {
+            children: d
         }));
-    }
+    return e.onPress ? /* @__PURE__ */ t(c, {
+        className: y,
+        trackingEvent: e.trackingEvent,
+        onPress: e.onPress,
+        children: r()
+    }) : e.to ? /* @__PURE__ */ t(c, {
+        trackingEvent: e.trackingEvent,
+        to: e.to,
+        fullPageOnWebView: e.fullPageOnWebView,
+        children: r()
+    }) : e.href ? /* @__PURE__ */ t(c, {
+        trackingEvent: e.trackingEvent,
+        href: e.href,
+        newTab: e.newTab,
+        children: r()
+    }) : r();
 };
-export { H as default };
+export { S as default };

package/dist-es/circle.js

@@ -1,16 +1,19 @@
-import { circle as i } from "./circle.css-mistica.js";
-import { jsx as l } from "./_virtual/jsx-runtime.js";
-const s = (param)=>/* @__PURE__ */ {
-    let { children: e , backgroundColor: o , backgroundImage: r , size: t  } = param;
-    return l("div", {
-        className: i,
+import { circle as c } from "./circle.css-mistica.js";
+import { vars as d } from "./skins/skin-contract.css-mistica.js";
+import { jsx as m } from "./_virtual/jsx-runtime.js";
+const f = (param)=>{
+    let { children: e , backgroundColor: s , backgroundImage: o , size: t , border: r = !1  } = param;
+    const l = r === !0 ? d.colors.border : r, i = r ? `1px solid ${l}` : void 0;
+    return /* @__PURE__ */ m("div", {
+        className: c,
         style: {
             width: t,
             height: t,
-            backgroundColor: o,
-            backgroundImage: r ? `url(${r})` : "none"
+            backgroundColor: s,
+            backgroundImage: o ? `url(${o})` : "none",
+            border: i
         },
         children: e
     });
 };
-export { s as default };
+export { f as default };

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

@@ -77,36 +77,36 @@ function _objectWithoutPropertiesLoose(source, excluded) {
     }
     return target;
 }
-import { useTheme as s } from "../../hooks.js";
+import { useTheme as l } from "../../hooks.js";
 import { useIsInverseVariant as h } from "../../theme-variant-context.js";
 import { vars as n } from "../../skins/skin-contract.css-mistica.js";
 import { jsx as t } from "../../_virtual/jsx-runtime.js";
-const c = (_param)=>{
-    var { color: r , size: e = 24  } = _param, a = _objectWithoutProperties(_param, [
+const v = (_param)=>{
+    var { color: r , size: e = 24  } = _param, i = _objectWithoutProperties(_param, [
         "color",
         "size"
     ]);
-    const o = h(), i = r != null ? r : o ? n.colors.inverse : n.colors.neutralHigh, { skinName: l  } = s();
-    return l.match(/^o2/i) ? /* @__PURE__ */ t("svg", _objectSpreadProps(_objectSpread({
+    const o = h(), a = r != null ? r : o ? n.colors.inverse : n.colors.neutralHigh, { skinName: s  } = l();
+    return s.match(/^o2/i) ? /* @__PURE__ */ t("svg", _objectSpreadProps(_objectSpread({
         width: e,
         height: e,
         viewBox: "0 0 24 24",
         role: "presentation"
-    }, a), {
+    }, i), {
         children: /* @__PURE__ */ t("path", {
-            fill: i,
-            d: "M15.889 4.117a.368.368 0 00-.538 0l-7.24 7.585a.413.413 0 00-.071.46c.019.05.048.099.088.14l6.008 6.296a.377.377 0 00.55 0 .422.422 0 000-.577l-5.765-6.04 6.968-7.3a.412.412 0 000-.564zM14.866 19.41c0-.326.252-.59.563-.59.312 0 .564.264.564.59 0 .326-.252.59-.564.59a.577.577 0 01-.563-.59z"
+            fill: a,
+            d: "M14.889 4.117a.368.368 0 00-.538 0l-7.24 7.585a.413.413 0 00-.071.46c.019.05.048.099.088.14l6.008 6.296a.377.377 0 00.55 0 .422.422 0 000-.577l-5.765-6.04 6.968-7.3a.412.412 0 000-.564zM13.866 19.41c0-.326.252-.59.563-.59.312 0 .564.264.564.59 0 .326-.252.59-.564.59a.577.577 0 01-.563-.59z"
         })
     })) : /* @__PURE__ */ t("svg", _objectSpreadProps(_objectSpread({
         width: e,
         height: e,
         viewBox: "0 0 24 24",
         role: "presentation"
-    }, a), {
+    }, i), {
         children: /* @__PURE__ */ t("path", {
-            fill: i,
-            d: "M16.32 20a.7.7 0 01-.45-.16l-8.658-7.314a.577.577 0 010-.897l8.659-7.451a.71.71 0 01.939 0 .595.595 0 010 .872l-8.171 7.02 8.132 6.862a.584.584 0 01.005.868l-.005.004a.727.727 0 01-.451.196z"
+            fill: a,
+            d: "M14.387 4a.583.583 0 01.442.198.644.644 0 010 .875l-7.356 6.99 7.318 6.865c.242.23.26.622.038.872a.584.584 0 01-.846.037L6.19 12.525a.645.645 0 01-.025-.886l.025-.025 7.794-7.46A.61.61 0 0114.387 4z"
         })
     }));
 };
-export { c as default };
+export { v as default };

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

@@ -82,40 +82,40 @@ import { useIsInverseVariant as s } from "../../theme-variant-context.js";
 import { vars as n } from "../../skins/skin-contract.css-mistica.js";
 import { jsx as t } from "../../_virtual/jsx-runtime.js";
 const v = (_param)=>{
-    var { color: r , size: e = 24  } = _param, a = _objectWithoutProperties(_param, [
+    var { color: r , size: e = 24  } = _param, i = _objectWithoutProperties(_param, [
         "color",
         "size"
     ]);
-    const o = s(), i = r != null ? r : o ? n.colors.inverse : n.colors.neutralHigh, { skinName: l  } = h();
+    const o = s(), a = r != null ? r : o ? n.colors.inverse : n.colors.neutralHigh, { skinName: l  } = h();
     return l.match(/^blau/i) ? /* @__PURE__ */ t("svg", _objectSpreadProps(_objectSpread({
         width: e,
         height: e,
         viewBox: "0 0 24 24",
         role: "presentation"
-    }, a), {
+    }, i), {
         children: /* @__PURE__ */ t("path", {
-            fill: i,
-            d: "M15.855 4.16a.535.535 0 010 .77L8.586 12l7.27 7.07a.535.535 0 010 .77.571.571 0 01-.793 0L7 12l8.063-7.84a.571.571 0 01.792 0z"
+            fill: a,
+            d: "M14.855 4.16a.535.535 0 010 .77L7.586 12l7.27 7.07a.535.535 0 010 .77.571.571 0 01-.793 0L6 12l8.063-7.84a.571.571 0 01.792 0z"
         })
     })) : l.match(/^o2/i) ? /* @__PURE__ */ t("svg", _objectSpreadProps(_objectSpread({
         width: e,
         height: e,
         viewBox: "0 0 24 24",
         role: "presentation"
-    }, a), {
+    }, i), {
         children: /* @__PURE__ */ t("path", {
-            fill: i,
-            d: "M15.8 5.266a.79.79 0 000-1.049.641.641 0 00-.962 0L8.2 11.455A.777.777 0 008 12a.777.777 0 00.2.545l6.638 7.238c.266.29.697.29.963 0a.79.79 0 000-1.05L9.624 12l6.177-6.734z"
+            fill: a,
+            d: "M14.8 5.266a.79.79 0 000-1.049.641.641 0 00-.962 0L7.2 11.455A.777.777 0 007 12a.777.777 0 00.2.545l6.638 7.238c.266.29.697.29.963 0a.79.79 0 000-1.05L8.624 12l6.177-6.734z"
         })
     })) : /* @__PURE__ */ t("svg", _objectSpreadProps(_objectSpread({
         width: e,
         height: e,
         viewBox: "0 0 24 24",
         role: "presentation"
-    }, a), {
+    }, i), {
         children: /* @__PURE__ */ t("path", {
-            fill: i,
-            d: "M16.068 20a.96.96 0 01-.627-.23l-8.133-7.05a.858.858 0 01-.05-1.273c.013-.014.028-.025.042-.04l8.137-7.17a.964.964 0 011.297.029l.02.02a.861.861 0 01-.054 1.257L9.31 12.06l7.385 6.393c.38.33.407.892.06 1.257a.964.964 0 01-.687.291z"
+            fill: a,
+            d: "M14.161 4.024c.235 0 .46.105.617.285a.928.928 0 01-.048 1.257L8 12.083l6.78 6.541c.343.335.22.9 0 1.108-.28.28-.82.392-1.163.08l-.02-.018-7.323-7.046A.905.905 0 016 12.095a.913.913 0 01.268-.658l7.325-7.176a.803.803 0 01.568-.237z"
         })
     }));
 };

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

@@ -95,7 +95,7 @@ const c = (_param)=>{
     }, i), {
         children: /* @__PURE__ */ t("path", {
             fill: a,
-            d: "M8.111 4.117a.368.368 0 01.538 0l7.24 7.585c.118.124.142.31.071.46a.41.41 0 01-.088.14l-6.008 6.296a.377.377 0 01-.55 0 .422.422 0 010-.577l5.765-6.04-6.968-7.3a.412.412 0 010-.564zM9.134 19.41a.577.577 0 00-.563-.59.577.577 0 00-.564.59c0 .326.252.59.564.59a.577.577 0 00.563-.59z"
+            d: "M9.111 4.117a.368.368 0 01.538 0l7.24 7.585c.118.124.142.31.071.46a.41.41 0 01-.088.14l-6.008 6.296a.377.377 0 01-.55 0 .422.422 0 010-.577l5.765-6.04-6.968-7.3a.412.412 0 010-.564zm1.023 15.293a.577.577 0 00-.563-.59.577.577 0 00-.564.59c0 .326.252.59.564.59a.577.577 0 00.563-.59z"
         })
     })) : /* @__PURE__ */ t("svg", _objectSpreadProps(_objectSpread({
         width: e,
@@ -105,7 +105,7 @@ const c = (_param)=>{
     }, i), {
         children: /* @__PURE__ */ t("path", {
             fill: a,
-            d: "M8.113 20a.583.583 0 01-.442-.198.644.644 0 010-.875l7.356-6.99-7.318-6.865A.635.635 0 017.67 4.2a.585.585 0 01.846-.037l7.794 7.312a.645.645 0 01.025.886l-.024.025-7.795 7.46a.61.61 0 01-.404.154z"
+            d: "M9.613 20a.583.583 0 01-.442-.198.644.644 0 010-.875l7.356-6.99-7.318-6.865A.635.635 0 019.17 4.2a.585.585 0 01.846-.037l7.794 7.312a.645.645 0 01.025.886l-.024.025-7.795 7.46a.61.61 0 01-.404.154z"
         })
     }));
 };

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

@@ -105,7 +105,7 @@ const d = (_param)=>{
     }, i), {
         children: /* @__PURE__ */ t("path", {
             fill: a,
-            d: "M8.2 18.733a.79.79 0 000 1.05.64.64 0 00.962 0l6.639-7.238A.777.777 0 0016 12a.777.777 0 00-.2-.545L9.163 4.217a.641.641 0 00-.963 0 .79.79 0 000 1.05L14.376 12l-6.177 6.733z"
+            d: "M9.2 18.733a.79.79 0 000 1.05.64.64 0 00.962 0l6.639-7.238A.777.777 0 0017 12a.777.777 0 00-.2-.545l-6.638-7.238a.641.641 0 00-.963 0 .79.79 0 000 1.05L15.376 12l-6.177 6.733z"
         })
     })) : /* @__PURE__ */ t("svg", _objectSpreadProps(_objectSpread({
         width: e,
@@ -115,7 +115,7 @@ const d = (_param)=>{
     }, i), {
         children: /* @__PURE__ */ t("path", {
             fill: a,
-            d: "M8.339 20a.823.823 0 01-.617-.285.928.928 0 01.048-1.256l6.73-6.518L7.72 5.4c-.343-.335-.22-.9 0-1.108.28-.28.82-.392 1.163-.08l.02.018 7.323 7.046a.905.905 0 01.274.654.913.913 0 01-.268.658l-7.325 7.175A.804.804 0 018.34 20z"
+            d: "M9.839 20a.823.823 0 01-.617-.285.928.928 0 01.048-1.256L16 11.94 9.22 5.4c-.343-.335-.22-.9 0-1.108.28-.28.82-.392 1.163-.08l.02.018 7.323 7.046a.905.905 0 01.274.654.913.913 0 01-.268.658l-7.325 7.175A.803.803 0 019.84 20z"
         })
     }));
 };

package/dist-es/horizontal-scroll.css-mistica.js

@@ -0,0 +1,5 @@
+import "./sprinkles.css.ts.vanilla.js";
+import "./responsive-layout.css.ts.vanilla.js";
+import "./horizontal-scroll.css.ts.vanilla.js";
+var m = "_1gl3gmv2", v = "_1gl3gmv1 _1y2v1nf5q";
+export { m as noScrollbar, v as scroll };

package/dist-es/horizontal-scroll.css.ts.vanilla.js

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

package/dist-es/horizontal-scroll.js

@@ -0,0 +1,15 @@
+import l from "classnames";
+import * as m from "react";
+import { scroll as s, noScrollbar as t } from "./horizontal-scroll.css-mistica.js";
+import { jsx as c } from "./_virtual/jsx-runtime.js";
+const n = /*#__PURE__*/ m.forwardRef((param, a)=>/* @__PURE__ */ {
+    let { children: r , noScrollbar: o  } = param;
+    return c("div", {
+        className: l(s, {
+            [t]: o
+        }),
+        ref: a,
+        children: r
+    });
+});
+export { n as default };