@telefonica/mistica 16.1.0 → 16.2.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (148) hide show
  1. package/css/mistica.css +1 -1
  2. package/dist/accordion.css-mistica.js +12 -9
  3. package/dist/accordion.css.d.ts +1 -0
  4. package/dist/accordion.js +36 -39
  5. package/dist/align.css-mistica.js +12 -0
  6. package/dist/align.css.d.ts +1 -0
  7. package/dist/align.css.ts.vanilla.css-mistica.js +11 -0
  8. package/dist/align.d.ts +12 -0
  9. package/dist/align.js +79 -0
  10. package/dist/box.css-mistica.js +41 -0
  11. package/dist/box.css.d.ts +23 -0
  12. package/dist/box.css.ts.vanilla.css-mistica.js +11 -0
  13. package/dist/box.d.ts +4 -0
  14. package/dist/box.js +39 -31
  15. package/dist/boxed.css-mistica.js +10 -5
  16. package/dist/boxed.css.d.ts +3 -0
  17. package/dist/boxed.js +20 -24
  18. package/dist/callout.css-mistica.js +12 -4
  19. package/dist/callout.css.d.ts +1 -0
  20. package/dist/callout.js +14 -22
  21. package/dist/card.css-mistica.js +26 -23
  22. package/dist/card.css.d.ts +1 -0
  23. package/dist/card.js +17 -23
  24. package/dist/community/advanced-data-card.css-mistica.js +32 -23
  25. package/dist/community/advanced-data-card.css.d.ts +3 -0
  26. package/dist/community/advanced-data-card.js +46 -55
  27. package/dist/empty-state.css-mistica.js +11 -8
  28. package/dist/empty-state.css.d.ts +1 -0
  29. package/dist/empty-state.js +10 -13
  30. package/dist/form.css-mistica.js +12 -0
  31. package/dist/form.css.d.ts +1 -0
  32. package/dist/form.js +8 -10
  33. package/dist/grid.css-mistica.js +143 -126
  34. package/dist/grid.css.d.ts +13 -0
  35. package/dist/grid.js +35 -38
  36. package/dist/hero.css-mistica.js +14 -8
  37. package/dist/hero.css.d.ts +2 -0
  38. package/dist/hero.js +17 -25
  39. package/dist/image.js +23 -25
  40. package/dist/index.d.ts +1 -0
  41. package/dist/index.js +4 -0
  42. package/dist/inline.js +10 -11
  43. package/dist/list.css-mistica.js +12 -9
  44. package/dist/list.css.d.ts +1 -0
  45. package/dist/list.js +43 -46
  46. package/dist/loading-screen.js +16 -16
  47. package/dist/logo-blau.d.ts +1 -1
  48. package/dist/logo-blau.js +10 -10
  49. package/dist/logo-common.d.ts +1 -0
  50. package/dist/logo-movistar.d.ts +1 -1
  51. package/dist/logo-movistar.js +4 -4
  52. package/dist/logo-o2-new.d.ts +1 -1
  53. package/dist/logo-o2-new.js +5 -5
  54. package/dist/logo-o2.d.ts +1 -1
  55. package/dist/logo-o2.js +5 -5
  56. package/dist/logo-telefonica.d.ts +1 -1
  57. package/dist/logo-telefonica.js +4 -4
  58. package/dist/logo-tu.d.ts +1 -1
  59. package/dist/logo-tu.js +5 -5
  60. package/dist/logo-vivo.d.ts +1 -1
  61. package/dist/logo-vivo.js +7 -7
  62. package/dist/logo.d.ts +9 -8
  63. package/dist/logo.js +125 -102
  64. package/dist/navigation-bar.css-mistica.js +23 -20
  65. package/dist/navigation-bar.css.d.ts +1 -0
  66. package/dist/navigation-bar.js +30 -37
  67. package/dist/package-version.js +1 -1
  68. package/dist/phone-number-field.d.ts +1 -4
  69. package/dist/phone-number-field.js +52 -82
  70. package/dist/popover.d.ts +1 -0
  71. package/dist/popover.js +9 -10
  72. package/dist/sheet-common.css-mistica.js +5 -5
  73. package/dist/skeleton-base.js +10 -12
  74. package/dist/skeletons.css-mistica.js +11 -5
  75. package/dist/skeletons.css.d.ts +1 -0
  76. package/dist/snackbar.css-mistica.js +20 -14
  77. package/dist/snackbar.css.d.ts +3 -1
  78. package/dist/snackbar.js +65 -75
  79. package/dist/tag.css-mistica.js +15 -4
  80. package/dist/tag.css.d.ts +2 -0
  81. package/dist/tag.js +20 -24
  82. package/dist/text-field-base.d.ts +1 -1
  83. package/dist/text-field-components.css-mistica.js +16 -10
  84. package/dist/text-field-components.css.d.ts +1 -0
  85. package/dist/text-field-components.js +32 -35
  86. package/dist/timer.js +42 -43
  87. package/dist/tooltip.d.ts +3 -1
  88. package/dist/tooltip.js +106 -106
  89. package/dist/touchable.js +47 -42
  90. package/dist-es/accordion.css-mistica.js +3 -3
  91. package/dist-es/accordion.js +58 -61
  92. package/dist-es/align.css-mistica.js +3 -0
  93. package/dist-es/align.css.ts.vanilla.css-mistica.js +2 -0
  94. package/dist-es/align.js +70 -0
  95. package/dist-es/box.css-mistica.js +24 -0
  96. package/dist-es/box.css.ts.vanilla.css-mistica.js +2 -0
  97. package/dist-es/box.js +43 -35
  98. package/dist-es/boxed.css-mistica.js +5 -3
  99. package/dist-es/boxed.js +28 -32
  100. package/dist-es/callout.css-mistica.js +7 -2
  101. package/dist-es/callout.js +44 -52
  102. package/dist-es/card.css-mistica.js +4 -4
  103. package/dist-es/card.js +11 -17
  104. package/dist-es/community/advanced-data-card.css-mistica.js +7 -7
  105. package/dist-es/community/advanced-data-card.js +90 -99
  106. package/dist-es/empty-state.css-mistica.js +3 -3
  107. package/dist-es/empty-state.js +19 -22
  108. package/dist-es/form.css-mistica.js +3 -0
  109. package/dist-es/form.js +12 -14
  110. package/dist-es/grid.css-mistica.js +123 -112
  111. package/dist-es/grid.js +38 -41
  112. package/dist-es/hero.css-mistica.js +2 -2
  113. package/dist-es/hero.js +36 -44
  114. package/dist-es/image.js +28 -30
  115. package/dist-es/index.js +1844 -1843
  116. package/dist-es/inline.js +19 -20
  117. package/dist-es/list.css-mistica.js +2 -2
  118. package/dist-es/list.js +75 -78
  119. package/dist-es/loading-screen.js +30 -30
  120. package/dist-es/logo-blau.js +11 -11
  121. package/dist-es/logo-movistar.js +5 -5
  122. package/dist-es/logo-o2-new.js +8 -8
  123. package/dist-es/logo-o2.js +8 -8
  124. package/dist-es/logo-telefonica.js +4 -4
  125. package/dist-es/logo-tu.js +8 -8
  126. package/dist-es/logo-vivo.js +16 -16
  127. package/dist-es/logo.js +132 -109
  128. package/dist-es/navigation-bar.css-mistica.js +11 -11
  129. package/dist-es/navigation-bar.js +80 -87
  130. package/dist-es/package-version.js +1 -1
  131. package/dist-es/phone-number-field.js +59 -89
  132. package/dist-es/popover.js +17 -18
  133. package/dist-es/sheet-common.css-mistica.js +2 -2
  134. package/dist-es/skeleton-base.js +15 -17
  135. package/dist-es/skeletons.css-mistica.js +5 -2
  136. package/dist-es/snackbar.css-mistica.js +4 -4
  137. package/dist-es/snackbar.js +93 -103
  138. package/dist-es/style.css +1 -1
  139. package/dist-es/tag.css-mistica.js +2 -2
  140. package/dist-es/tag.js +34 -38
  141. package/dist-es/text-field-components.css-mistica.js +5 -2
  142. package/dist-es/text-field-components.js +48 -51
  143. package/dist-es/timer.js +80 -81
  144. package/dist-es/tooltip.js +148 -148
  145. package/dist-es/touchable.js +55 -50
  146. package/package.json +1 -1
  147. package/dist/sprinkles.css-mistica.js +0 -2494
  148. package/dist-es/sprinkles.css-mistica.js +0 -2485
@@ -79,8 +79,8 @@ function _object_without_properties_loose(source, excluded) {
79
79
  return target;
80
80
  }
81
81
  import { jsxs as C, jsx as n } from "react/jsx-runtime";
82
- import * as c from "react";
83
- import m from "classnames";
82
+ import * as o from "react";
83
+ import s from "classnames";
84
84
  import E from "./screen-reader-only.js";
85
85
  import { notTouchable as j, touchable as B, base as V, marginReset as L } from "./touchable.css-mistica.js";
86
86
  import { useTheme as $ } from "./hooks.js";
@@ -89,14 +89,14 @@ import { ENTER as z, SPACE as F } from "./utils/keys.js";
89
89
  import { getPrefixedDataAttributes as G } from "./utils/dom.js";
90
90
  import { redirect as J } from "./utils/browser.js";
91
91
  import { linkOpensInNewTab as M, linkOpensInCurrentPage as Q } from "./text-tokens.js";
92
- const I = /*#__PURE__*/ c.forwardRef((e, t)=>{
93
- var w;
94
- const { texts: o, analytics: R, platformOverrides: x, Link: D, useHrefDecorator: A, t: s } = $(), H = A(), u = c.useRef(!1);
95
- let l = [];
96
- e.trackingEvent && (Array.isArray(e.trackingEvent) ? l = e.trackingEvent : l = [
92
+ const I = /*#__PURE__*/ o.forwardRef((e, t)=>{
93
+ var O;
94
+ const { texts: d, analytics: R, platformOverrides: x, Link: D, useHrefDecorator: A, t: h } = $(), H = A(), b = o.useRef(!1);
95
+ let r = [];
96
+ e.trackingEvent && (Array.isArray(e.trackingEvent) ? r = e.trackingEvent : r = [
97
97
  e.trackingEvent
98
98
  ]);
99
- const d = e.children, i = _object_spread({
99
+ const f = e.children, i = _object_spread({
100
100
  className: e.className,
101
101
  disabled: e.disabled,
102
102
  style: e.style,
@@ -110,58 +110,58 @@ const I = /*#__PURE__*/ c.forwardRef((e, t)=>{
110
110
  "aria-selected": e["aria-selected"],
111
111
  "aria-live": e["aria-live"],
112
112
  tabIndex: e.tabIndex
113
- }, G(e.dataAttributes, "Touchable")), h = e.type ? e.type : "button", r = !!e.newTab, K = (w = e.href) == null ? void 0 : w.startsWith("#"), g = !r && !!e.href && !!e.loadOnTop, b = (a)=>{
113
+ }, G(e.dataAttributes, "Touchable")), g = e.type ? e.type : "button", l = !!e.newTab, K = (O = e.href) == null ? void 0 : O.startsWith("#"), k = !l && !!e.href && !!e.loadOnTop, m = (a)=>{
114
114
  e.stopPropagation && a.stopPropagation();
115
- }, k = (a)=>{
115
+ }, v = (a)=>{
116
116
  e.onPress && e.onPress(a);
117
117
  }, y = ()=>{
118
118
  var _e_to_pathname;
119
119
  return e.href ? H(e.href) : e.to && e.fullPageOnWebView ? typeof e.to == "string" ? e.to : (_e_to_pathname = e.to.pathname) !== null && _e_to_pathname !== void 0 ? _e_to_pathname : "" : "";
120
- }, v = ()=>Promise.all(l.map((a)=>R.logEvent(a))), N = (a)=>{
121
- u.current || (u.current = !0, v().finally(()=>{
122
- u.current = !1, a();
120
+ }, N = ()=>Promise.all(r.map((a)=>R.logEvent(a))), T = (a)=>{
121
+ b.current || (b.current = !0, N().finally(()=>{
122
+ b.current = !1, a();
123
123
  }));
124
124
  }, S = (a)=>{
125
- if (b(a), !l.length) {
126
- k(a);
125
+ if (m(a), !r.length) {
126
+ v(a);
127
127
  return;
128
128
  }
129
- N(()=>k(a));
129
+ T(()=>v(a));
130
130
  }, W = (a)=>{
131
- var O;
132
- b(a);
133
- const f = !!(e.href && e.onNavigate);
134
- !l.length && !f || (a.preventDefault(), Promise.resolve(f ? (O = e.onNavigate) == null ? void 0 : O.call(e) : void 0).finally(()=>{
135
- N(()=>J(y(), r, g));
131
+ var c;
132
+ m(a);
133
+ const u = !!(e.href && e.onNavigate);
134
+ !r.length && !u || (a.preventDefault(), Promise.resolve(u ? (c = e.onNavigate) == null ? void 0 : c.call(e) : void 0).finally(()=>{
135
+ T(()=>J(y(), l, k));
136
136
  }));
137
137
  }, _ = (a)=>{
138
- b(a), e.to && e.onNavigate && e.onNavigate(), v();
139
- }, T = (a)=>{
138
+ m(a), e.to && e.onNavigate && e.onNavigate(), N();
139
+ }, P = (a)=>{
140
140
  (a.key === z || a.key === F) && (a.preventDefault(), a.currentTarget.click());
141
- }, P = ()=>r ? /* @__PURE__ */ n(E, {
141
+ }, w = ()=>l ? /* @__PURE__ */ n(E, {
142
142
  children: /* @__PURE__ */ n("span", {
143
- children: o.linkOpensInNewTab || s(M)
143
+ children: d.linkOpensInNewTab || h(M)
144
144
  })
145
145
  }) : K ? /* @__PURE__ */ n(E, {
146
146
  children: /* @__PURE__ */ n("span", {
147
- children: o.linkOpensInCurrentPage || s(Q)
147
+ children: d.linkOpensInCurrentPage || h(Q)
148
148
  })
149
149
  }) : null;
150
150
  if (e.href || e.to && e.fullPageOnWebView && q(x)) return /* @__PURE__ */ C("a", _object_spread_props(_object_spread({}, i), {
151
151
  "aria-label": e["aria-label"],
152
152
  "aria-labelledby": e["aria-labelledby"],
153
153
  onClick: W,
154
- onKeyDown: T,
154
+ onKeyDown: P,
155
155
  href: e.disabled ? void 0 : y(),
156
156
  target: (()=>{
157
- if (r) return "_blank";
158
- if (g) return "_top";
157
+ if (l) return "_blank";
158
+ if (k) return "_top";
159
159
  })(),
160
- rel: r ? "noopener noreferrer" : void 0,
160
+ rel: l ? "noopener noreferrer" : void 0,
161
161
  ref: t,
162
162
  children: [
163
- d,
164
- P()
163
+ f,
164
+ w()
165
165
  ]
166
166
  }));
167
167
  if (e.to) return /* @__PURE__ */ C(D, _object_spread_props(_object_spread({}, i), {
@@ -172,47 +172,52 @@ const I = /*#__PURE__*/ c.forwardRef((e, t)=>{
172
172
  to: e.disabled ? "" : e.to,
173
173
  replace: e.replace,
174
174
  onClick: _,
175
- onKeyDown: T,
175
+ onKeyDown: P,
176
176
  children: [
177
- d,
178
- P()
177
+ f,
178
+ w()
179
179
  ]
180
180
  }));
181
181
  if (e.onPress) {
182
182
  var _e_as, _i_role;
183
- const a = (_e_as = e.as) !== null && _e_as !== void 0 ? _e_as : "button", f = (_i_role = i.role) !== null && _i_role !== void 0 ? _i_role : e.as === "a" ? "button" : void 0;
184
- return /*#__PURE__*/ c.createElement(a, _object_spread_props(_object_spread({}, i), {
185
- role: f,
183
+ const a = (_e_as = e.as) !== null && _e_as !== void 0 ? _e_as : "button", u = (_i_role = i.role) !== null && _i_role !== void 0 ? _i_role : e.as === "a" ? "button" : void 0;
184
+ return /*#__PURE__*/ o.createElement(a, _object_spread_props(_object_spread({}, i), {
185
+ role: u,
186
+ // When an <a/> is rendered without an href value, the element is not accesible
187
+ // by keyboard (using tab key). We add a fictional href to "#" to avoid this.
188
+ href: a === "a" ? "#" : void 0,
186
189
  // this "form" attribute is useful when the form's submit button
187
190
  // is located outside the <form> element, for example if you use
188
191
  // a ButtonFixedFooter layout inside a form with the submit
189
192
  // button located at the footer, which is redered using a Portal
190
- form: h === "submit" && e.formId ? e.formId : void 0,
193
+ form: g === "submit" && e.formId ? e.formId : void 0,
191
194
  "aria-label": e["aria-label"],
192
195
  "aria-labelledby": e["aria-labelledby"],
193
- type: h,
196
+ type: g,
194
197
  ref: t,
195
- onClick: S,
196
- children: d
198
+ onClick: (c)=>{
199
+ a === "a" && c.preventDefault(), S(c);
200
+ },
201
+ children: f
197
202
  }));
198
203
  }
199
204
  return /* @__PURE__ */ n("div", _object_spread_props(_object_spread({}, i), {
200
205
  ref: t,
201
- className: m(i.className, j),
202
- children: d
206
+ className: s(i.className, j),
207
+ children: f
203
208
  }));
204
- }), U = /*#__PURE__*/ c.forwardRef((e, t)=>/* @__PURE__ */ n(I, _object_spread_props(_object_spread({}, e), {
205
- className: m(B, e.className),
209
+ }), U = /*#__PURE__*/ o.forwardRef((e, t)=>/* @__PURE__ */ n(I, _object_spread_props(_object_spread({}, e), {
210
+ className: s(B, e.className),
206
211
  ref: t
207
- }))), re = /*#__PURE__*/ c.forwardRef((_param, o)=>{
212
+ }))), le = /*#__PURE__*/ o.forwardRef((_param, d)=>{
208
213
  var { resetMargin: e = !0 } = _param, t = _object_without_properties(_param, [
209
214
  "resetMargin"
210
215
  ]);
211
216
  return /* @__PURE__ */ n(I, _object_spread_props(_object_spread({}, t), {
212
- className: m(V, t.className, {
217
+ className: s(V, t.className, {
213
218
  [L]: e
214
219
  }),
215
- ref: o
220
+ ref: d
216
221
  }));
217
222
  }), ce = U;
218
- export { re as BaseTouchable, ce as default };
223
+ export { le as BaseTouchable, ce as default };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@telefonica/mistica",
3
- "version": "16.1.0",
3
+ "version": "16.2.0",
4
4
  "license": "MIT",
5
5
  "repository": {
6
6
  "type": "git",