@telefonica/mistica 14.28.1 → 14.29.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.
- package/css/mistica.css +1 -1
- package/dist/accordion.d.ts +3 -0
- package/dist/accordion.js +71 -70
- package/dist/button-layout.css-mistica.js +11 -19
- package/dist/button-layout.css.d.ts +1 -5
- package/dist/button-layout.js +19 -90
- package/dist/button.css-mistica.js +18 -21
- package/dist/counter.css-mistica.js +48 -0
- package/dist/counter.css.d.ts +11 -0
- package/dist/counter.css.ts.vanilla.css-mistica.js +11 -0
- package/dist/counter.d.ts +19 -0
- package/dist/counter.js +240 -0
- package/dist/generated/mistica-icons/icon-add-more-filled.js +1 -1
- package/dist/generated/mistica-icons/icon-add-more-light.js +1 -1
- package/dist/generated/mistica-icons/icon-add-more-regular.js +2 -2
- package/dist/generated/mistica-icons/icon-subtract-filled.d.ts +4 -0
- package/dist/generated/mistica-icons/icon-subtract-light.js +21 -10
- package/dist/generated/mistica-icons/icon-subtract-regular.js +29 -8
- package/dist/index.d.ts +1 -0
- package/dist/index.js +4 -0
- package/dist/list.d.ts +3 -0
- package/dist/list.js +92 -92
- package/dist/loading-bar.js +5 -4
- package/dist/menu.js +11 -10
- package/dist/navigation-bar.js +27 -26
- package/dist/package-version.js +1 -1
- package/dist/snackbar.css-mistica.js +16 -13
- package/dist/snackbar.css.d.ts +3 -2
- package/dist/snackbar.d.ts +5 -1
- package/dist/snackbar.js +119 -64
- package/dist/theme.d.ts +6 -0
- package/dist/theme.js +52 -28
- package/dist-es/accordion.js +79 -78
- package/dist-es/button-layout.css-mistica.js +4 -6
- package/dist-es/button-layout.js +27 -98
- package/dist-es/button.css-mistica.js +3 -3
- package/dist-es/counter.css-mistica.js +4 -0
- package/dist-es/counter.css.ts.vanilla.css-mistica.js +2 -0
- package/dist-es/counter.js +187 -0
- package/dist-es/generated/mistica-icons/icon-add-more-filled.js +1 -1
- package/dist-es/generated/mistica-icons/icon-add-more-light.js +1 -1
- package/dist-es/generated/mistica-icons/icon-add-more-regular.js +2 -2
- package/dist-es/generated/mistica-icons/icon-subtract-light.js +24 -13
- package/dist-es/generated/mistica-icons/icon-subtract-regular.js +33 -12
- package/dist-es/index.js +1765 -1764
- package/dist-es/list.js +125 -125
- package/dist-es/loading-bar.js +12 -11
- package/dist-es/menu.js +9 -8
- package/dist-es/navigation-bar.js +26 -25
- package/dist-es/package-version.js +1 -1
- package/dist-es/snackbar.css-mistica.js +5 -2
- package/dist-es/snackbar.js +140 -85
- package/dist-es/style.css +1 -1
- package/dist-es/theme.js +56 -32
- package/package.json +1 -1
|
@@ -0,0 +1,187 @@
|
|
|
1
|
+
function _define_property(obj, key, value) {
|
|
2
|
+
if (key in obj) {
|
|
3
|
+
Object.defineProperty(obj, key, {
|
|
4
|
+
value: value,
|
|
5
|
+
enumerable: true,
|
|
6
|
+
configurable: true,
|
|
7
|
+
writable: true
|
|
8
|
+
});
|
|
9
|
+
} else {
|
|
10
|
+
obj[key] = value;
|
|
11
|
+
}
|
|
12
|
+
return obj;
|
|
13
|
+
}
|
|
14
|
+
function _object_spread(target) {
|
|
15
|
+
for(var i = 1; i < arguments.length; i++){
|
|
16
|
+
var source = arguments[i] != null ? arguments[i] : {};
|
|
17
|
+
var ownKeys = Object.keys(source);
|
|
18
|
+
if (typeof Object.getOwnPropertySymbols === "function") {
|
|
19
|
+
ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function(sym) {
|
|
20
|
+
return Object.getOwnPropertyDescriptor(source, sym).enumerable;
|
|
21
|
+
}));
|
|
22
|
+
}
|
|
23
|
+
ownKeys.forEach(function(key) {
|
|
24
|
+
_define_property(target, key, source[key]);
|
|
25
|
+
});
|
|
26
|
+
}
|
|
27
|
+
return target;
|
|
28
|
+
}
|
|
29
|
+
function ownKeys(object, enumerableOnly) {
|
|
30
|
+
var keys = Object.keys(object);
|
|
31
|
+
if (Object.getOwnPropertySymbols) {
|
|
32
|
+
var symbols = Object.getOwnPropertySymbols(object);
|
|
33
|
+
if (enumerableOnly) {
|
|
34
|
+
symbols = symbols.filter(function(sym) {
|
|
35
|
+
return Object.getOwnPropertyDescriptor(object, sym).enumerable;
|
|
36
|
+
});
|
|
37
|
+
}
|
|
38
|
+
keys.push.apply(keys, symbols);
|
|
39
|
+
}
|
|
40
|
+
return keys;
|
|
41
|
+
}
|
|
42
|
+
function _object_spread_props(target, source) {
|
|
43
|
+
source = source != null ? source : {};
|
|
44
|
+
if (Object.getOwnPropertyDescriptors) {
|
|
45
|
+
Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));
|
|
46
|
+
} else {
|
|
47
|
+
ownKeys(Object(source)).forEach(function(key) {
|
|
48
|
+
Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
|
|
49
|
+
});
|
|
50
|
+
}
|
|
51
|
+
return target;
|
|
52
|
+
}
|
|
53
|
+
import { jsx as r, jsxs as I } from "react/jsx-runtime";
|
|
54
|
+
import * as V from "react";
|
|
55
|
+
import { getPrefixedDataAttributes as L } from "./utils/dom.js";
|
|
56
|
+
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";
|
|
57
|
+
import { useThemeVariant as _, ThemeVariant as q } from "./theme-variant-context.js";
|
|
58
|
+
import { vars as c } from "./skins/skin-contract.css-mistica.js";
|
|
59
|
+
import w from "./inline.js";
|
|
60
|
+
import { Text3 as F } from "./text.js";
|
|
61
|
+
import { BaseTouchable as P } from "./touchable.js";
|
|
62
|
+
import G from "./generated/mistica-icons/icon-subtract-regular.js";
|
|
63
|
+
import H from "./generated/mistica-icons/icon-add-more-regular.js";
|
|
64
|
+
import J from "./generated/mistica-icons/icon-trash-can-regular.js";
|
|
65
|
+
import { useTheme as K } from "./hooks.js";
|
|
66
|
+
import N from "classnames";
|
|
67
|
+
import U from "./screen-reader-only.js";
|
|
68
|
+
const x = 20, W = (param)=>{
|
|
69
|
+
let { value: h , defaultValue: b , min: m , max: s , onChangeValue: a } = param;
|
|
70
|
+
const i = h !== void 0, f = V.useCallback((n)=>n === void 0 ? m : Math.max(m, Math.min(s, n)), [
|
|
71
|
+
m,
|
|
72
|
+
s
|
|
73
|
+
]), [e, p] = V.useState(f(b)), v = (n)=>{
|
|
74
|
+
i || p(n), a == null || a(n);
|
|
75
|
+
};
|
|
76
|
+
return [
|
|
77
|
+
i ? f(h) : e,
|
|
78
|
+
v
|
|
79
|
+
];
|
|
80
|
+
}, X = (param)=>{
|
|
81
|
+
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;
|
|
82
|
+
const A = _(), { texts: u } = K(), l = a === void 0 ? 0 : a, d = Math.max(l, i === void 0 ? 999 : i), [t, T] = W({
|
|
83
|
+
value: h,
|
|
84
|
+
defaultValue: b,
|
|
85
|
+
min: l,
|
|
86
|
+
max: d,
|
|
87
|
+
onChangeValue: m
|
|
88
|
+
}), 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}` : ""}`;
|
|
89
|
+
return /* @__PURE__ */ r("div", _object_spread_props(_object_spread({
|
|
90
|
+
className: N(R, {
|
|
91
|
+
[g]: e
|
|
92
|
+
})
|
|
93
|
+
}, L(f, "Counter")), {
|
|
94
|
+
style: {
|
|
95
|
+
border: `1px solid ${A === "inverse" ? c.colors.backgroundContainer : c.colors.border}`
|
|
96
|
+
},
|
|
97
|
+
children: /* @__PURE__ */ I(w, {
|
|
98
|
+
space: 8,
|
|
99
|
+
alignItems: "center",
|
|
100
|
+
children: [
|
|
101
|
+
/* @__PURE__ */ r("div", {
|
|
102
|
+
className: N(B, {
|
|
103
|
+
[j]: o,
|
|
104
|
+
[M]: e || !o && t === l,
|
|
105
|
+
[g]: !e && !o && t === l
|
|
106
|
+
}),
|
|
107
|
+
children: /* @__PURE__ */ I(P, {
|
|
108
|
+
className: y,
|
|
109
|
+
disabled: !o && t === l || e,
|
|
110
|
+
onPress: ()=>o ? s == null ? void 0 : s() : T(t - 1),
|
|
111
|
+
"aria-label": o ? D() : k(),
|
|
112
|
+
children: [
|
|
113
|
+
/* @__PURE__ */ r("div", {
|
|
114
|
+
className: S
|
|
115
|
+
}),
|
|
116
|
+
/* @__PURE__ */ r("div", {
|
|
117
|
+
className: E,
|
|
118
|
+
"aria-hidden": o,
|
|
119
|
+
children: /* @__PURE__ */ r(G, {
|
|
120
|
+
size: x,
|
|
121
|
+
color: t === l && !o || e ? c.colors.control : c.colors.controlActivated
|
|
122
|
+
})
|
|
123
|
+
}),
|
|
124
|
+
/* @__PURE__ */ r("div", {
|
|
125
|
+
className: O,
|
|
126
|
+
"aria-hidden": !o,
|
|
127
|
+
children: /* @__PURE__ */ r(J, {
|
|
128
|
+
size: x,
|
|
129
|
+
color: c.colors.controlError
|
|
130
|
+
})
|
|
131
|
+
})
|
|
132
|
+
]
|
|
133
|
+
})
|
|
134
|
+
}),
|
|
135
|
+
/* @__PURE__ */ r("div", {
|
|
136
|
+
className: Q,
|
|
137
|
+
style: {
|
|
138
|
+
width: `${Math.max(3, String(d).length) * 1.25}ch`
|
|
139
|
+
},
|
|
140
|
+
children: /* @__PURE__ */ I(q, {
|
|
141
|
+
variant: "default",
|
|
142
|
+
children: [
|
|
143
|
+
/* @__PURE__ */ r("div", {
|
|
144
|
+
"aria-hidden": !0,
|
|
145
|
+
children: /* @__PURE__ */ r(F, {
|
|
146
|
+
regular: !0,
|
|
147
|
+
color: c.colors.textPrimary,
|
|
148
|
+
children: t
|
|
149
|
+
})
|
|
150
|
+
}),
|
|
151
|
+
/* @__PURE__ */ r(U, {
|
|
152
|
+
children: /* @__PURE__ */ r("span", {
|
|
153
|
+
children: z()
|
|
154
|
+
})
|
|
155
|
+
})
|
|
156
|
+
]
|
|
157
|
+
})
|
|
158
|
+
}),
|
|
159
|
+
/* @__PURE__ */ r("div", {
|
|
160
|
+
className: N(B, {
|
|
161
|
+
[M]: e || t === d,
|
|
162
|
+
[g]: !e && t === d
|
|
163
|
+
}),
|
|
164
|
+
children: /* @__PURE__ */ I(P, {
|
|
165
|
+
className: y,
|
|
166
|
+
disabled: t === d || e,
|
|
167
|
+
onPress: ()=>T(t + 1),
|
|
168
|
+
"aria-label": $(),
|
|
169
|
+
children: [
|
|
170
|
+
/* @__PURE__ */ r("div", {
|
|
171
|
+
className: S
|
|
172
|
+
}),
|
|
173
|
+
/* @__PURE__ */ r("div", {
|
|
174
|
+
className: Z,
|
|
175
|
+
children: /* @__PURE__ */ r(H, {
|
|
176
|
+
size: x,
|
|
177
|
+
color: t === d || e ? c.colors.control : c.colors.controlActivated
|
|
178
|
+
})
|
|
179
|
+
})
|
|
180
|
+
]
|
|
181
|
+
})
|
|
182
|
+
})
|
|
183
|
+
]
|
|
184
|
+
})
|
|
185
|
+
}));
|
|
186
|
+
}, hr = X;
|
|
187
|
+
export { hr as default };
|
|
@@ -94,7 +94,7 @@ const a = (_param)=>{
|
|
|
94
94
|
}, s), {
|
|
95
95
|
children: /* @__PURE__ */ r("path", {
|
|
96
96
|
fill: l,
|
|
97
|
-
d: "M12
|
|
97
|
+
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"
|
|
98
98
|
})
|
|
99
99
|
}));
|
|
100
100
|
}, h = a;
|
|
@@ -95,7 +95,7 @@ const v = (_param)=>{
|
|
|
95
95
|
}, e), {
|
|
96
96
|
children: /* @__PURE__ */ r("path", {
|
|
97
97
|
fill: t,
|
|
98
|
-
d: "M11.676
|
|
98
|
+
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"
|
|
99
99
|
})
|
|
100
100
|
})) : /* @__PURE__ */ r("svg", _object_spread_props(_object_spread({
|
|
101
101
|
width: o,
|
|
@@ -95,7 +95,7 @@ const v = (_param)=>{
|
|
|
95
95
|
}, o), {
|
|
96
96
|
children: /* @__PURE__ */ r("path", {
|
|
97
97
|
fill: t,
|
|
98
|
-
d: "
|
|
98
|
+
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"
|
|
99
99
|
})
|
|
100
100
|
})) : a.match(/^o2/i) ? /* @__PURE__ */ r("svg", _object_spread_props(_object_spread({
|
|
101
101
|
width: e,
|
|
@@ -105,7 +105,7 @@ const v = (_param)=>{
|
|
|
105
105
|
}, o), {
|
|
106
106
|
children: /* @__PURE__ */ r("path", {
|
|
107
107
|
fill: t,
|
|
108
|
-
d: "M11.42
|
|
108
|
+
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"
|
|
109
109
|
})
|
|
110
110
|
})) : /* @__PURE__ */ r("svg", _object_spread_props(_object_spread({
|
|
111
111
|
width: e,
|
|
@@ -77,25 +77,36 @@ function _object_without_properties_loose(source, excluded) {
|
|
|
77
77
|
}
|
|
78
78
|
return target;
|
|
79
79
|
}
|
|
80
|
-
import { jsx as
|
|
80
|
+
import { jsx as o } from "react/jsx-runtime";
|
|
81
|
+
import { useTheme as h } from "../../hooks.js";
|
|
81
82
|
import { useIsInverseVariant as c } from "../../theme-variant-context.js";
|
|
82
|
-
import { vars as
|
|
83
|
-
const
|
|
84
|
-
var { color:
|
|
83
|
+
import { vars as i } from "../../skins/skin-contract.css-mistica.js";
|
|
84
|
+
const l = (_param)=>{
|
|
85
|
+
var { color: n , size: t = 24 } = _param, r = _object_without_properties(_param, [
|
|
85
86
|
"color",
|
|
86
87
|
"size"
|
|
87
88
|
]);
|
|
88
|
-
const
|
|
89
|
-
return /* @__PURE__ */
|
|
90
|
-
width:
|
|
91
|
-
height:
|
|
89
|
+
const s = c(), e = n !== null && n !== void 0 ? n : s ? i.colors.inverse : i.colors.neutralHigh, { skinName: a } = h();
|
|
90
|
+
return a.match(/^o2/i) ? /* @__PURE__ */ o("svg", _object_spread_props(_object_spread({
|
|
91
|
+
width: t,
|
|
92
|
+
height: t,
|
|
92
93
|
viewBox: "0 0 24 24",
|
|
93
94
|
role: "presentation"
|
|
94
|
-
},
|
|
95
|
-
children: /* @__PURE__ */
|
|
96
|
-
fill:
|
|
95
|
+
}, r), {
|
|
96
|
+
children: /* @__PURE__ */ o("path", {
|
|
97
|
+
fill: e,
|
|
98
|
+
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"
|
|
99
|
+
})
|
|
100
|
+
})) : /* @__PURE__ */ o("svg", _object_spread_props(_object_spread({
|
|
101
|
+
width: t,
|
|
102
|
+
height: t,
|
|
103
|
+
viewBox: "0 0 24 24",
|
|
104
|
+
role: "presentation"
|
|
105
|
+
}, r), {
|
|
106
|
+
children: /* @__PURE__ */ o("path", {
|
|
107
|
+
fill: e,
|
|
97
108
|
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"
|
|
98
109
|
})
|
|
99
110
|
}));
|
|
100
|
-
},
|
|
101
|
-
export {
|
|
111
|
+
}, v = l;
|
|
112
|
+
export { v as default };
|
|
@@ -77,25 +77,46 @@ function _object_without_properties_loose(source, excluded) {
|
|
|
77
77
|
}
|
|
78
78
|
return target;
|
|
79
79
|
}
|
|
80
|
-
import { jsx as
|
|
81
|
-
import {
|
|
82
|
-
import {
|
|
83
|
-
|
|
84
|
-
|
|
80
|
+
import { jsx as t } from "react/jsx-runtime";
|
|
81
|
+
import { useTheme as h } from "../../hooks.js";
|
|
82
|
+
import { useIsInverseVariant as s } from "../../theme-variant-context.js";
|
|
83
|
+
import { vars as a } from "../../skins/skin-contract.css-mistica.js";
|
|
84
|
+
const c = (_param)=>{
|
|
85
|
+
var { color: n , size: r = 24 } = _param, e = _object_without_properties(_param, [
|
|
85
86
|
"color",
|
|
86
87
|
"size"
|
|
87
88
|
]);
|
|
88
|
-
const
|
|
89
|
-
return /* @__PURE__ */
|
|
89
|
+
const l = s(), o = n !== null && n !== void 0 ? n : l ? a.colors.inverse : a.colors.neutralHigh, { skinName: i } = h();
|
|
90
|
+
return i.match(/^blau/i) ? /* @__PURE__ */ t("svg", _object_spread_props(_object_spread({
|
|
90
91
|
width: r,
|
|
91
92
|
height: r,
|
|
92
93
|
viewBox: "0 0 24 24",
|
|
93
94
|
role: "presentation"
|
|
94
|
-
},
|
|
95
|
-
children: /* @__PURE__ */
|
|
96
|
-
fill:
|
|
95
|
+
}, e), {
|
|
96
|
+
children: /* @__PURE__ */ t("path", {
|
|
97
|
+
fill: o,
|
|
98
|
+
d: "M21.321 11.321H2.679a.679.679 0 1 0 0 1.357h18.642a.679.679 0 1 0 0-1.357Z"
|
|
99
|
+
})
|
|
100
|
+
})) : i.match(/^o2/i) ? /* @__PURE__ */ t("svg", _object_spread_props(_object_spread({
|
|
101
|
+
width: r,
|
|
102
|
+
height: r,
|
|
103
|
+
viewBox: "0 0 24 24",
|
|
104
|
+
role: "presentation"
|
|
105
|
+
}, e), {
|
|
106
|
+
children: /* @__PURE__ */ t("path", {
|
|
107
|
+
fill: o,
|
|
108
|
+
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"
|
|
109
|
+
})
|
|
110
|
+
})) : /* @__PURE__ */ t("svg", _object_spread_props(_object_spread({
|
|
111
|
+
width: r,
|
|
112
|
+
height: r,
|
|
113
|
+
viewBox: "0 0 24 24",
|
|
114
|
+
role: "presentation"
|
|
115
|
+
}, e), {
|
|
116
|
+
children: /* @__PURE__ */ t("path", {
|
|
117
|
+
fill: o,
|
|
97
118
|
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"
|
|
98
119
|
})
|
|
99
120
|
}));
|
|
100
|
-
},
|
|
101
|
-
export {
|
|
121
|
+
}, d = c;
|
|
122
|
+
export { d as default };
|