@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
package/dist/theme.js
CHANGED
|
@@ -10,10 +10,10 @@ function _export(target, all) {
|
|
|
10
10
|
}
|
|
11
11
|
_export(exports, {
|
|
12
12
|
NAVBAR_HEIGHT_DESKTOP: function() {
|
|
13
|
-
return
|
|
13
|
+
return d;
|
|
14
14
|
},
|
|
15
15
|
NAVBAR_HEIGHT_MOBILE: function() {
|
|
16
|
-
return
|
|
16
|
+
return u;
|
|
17
17
|
},
|
|
18
18
|
dimensions: function() {
|
|
19
19
|
return E;
|
|
@@ -22,7 +22,7 @@ _export(exports, {
|
|
|
22
22
|
return h;
|
|
23
23
|
},
|
|
24
24
|
getTexts: function() {
|
|
25
|
-
return
|
|
25
|
+
return g;
|
|
26
26
|
}
|
|
27
27
|
});
|
|
28
28
|
const _jsxruntime = require("react/jsx-runtime");
|
|
@@ -141,7 +141,13 @@ const l = {
|
|
|
141
141
|
sheetConfirmButton: "Continuar",
|
|
142
142
|
progressBarCompletedLabel: "completo",
|
|
143
143
|
progressBarStepLabel: "Paso 1$s de 2$s",
|
|
144
|
-
pinFieldInputLabel: "D\xedgito 1$s de 2$s"
|
|
144
|
+
pinFieldInputLabel: "D\xedgito 1$s de 2$s",
|
|
145
|
+
counterRemoveLabel: "Borrar elemento",
|
|
146
|
+
counterIncreaseLabel: "Aumentar valor",
|
|
147
|
+
counterDecreaseLabel: "Disminuir valor",
|
|
148
|
+
counterQuantity: "cantidad",
|
|
149
|
+
counterMinValue: "m\xednimo",
|
|
150
|
+
counterMaxValue: "m\xe1ximo"
|
|
145
151
|
}, i = {
|
|
146
152
|
expirationDatePlaceholder: "MM/YY",
|
|
147
153
|
togglePasswordVisibilityLabel: "Toggle password visibility",
|
|
@@ -178,7 +184,13 @@ const l = {
|
|
|
178
184
|
sheetConfirmButton: "Continue",
|
|
179
185
|
progressBarCompletedLabel: "completed",
|
|
180
186
|
progressBarStepLabel: "Step 1$s of 2$s",
|
|
181
|
-
pinFieldInputLabel: "Digit 1$s of 2$s"
|
|
187
|
+
pinFieldInputLabel: "Digit 1$s of 2$s",
|
|
188
|
+
counterRemoveLabel: "Remove element",
|
|
189
|
+
counterIncreaseLabel: "Increase value",
|
|
190
|
+
counterDecreaseLabel: "Decrease value",
|
|
191
|
+
counterQuantity: "quantity",
|
|
192
|
+
counterMinValue: "minimum of",
|
|
193
|
+
counterMaxValue: "maximum of"
|
|
182
194
|
}, s = {
|
|
183
195
|
expirationDatePlaceholder: "MM/JJ",
|
|
184
196
|
togglePasswordVisibilityLabel: "Passwort un-/sichtbar machen",
|
|
@@ -215,8 +227,14 @@ const l = {
|
|
|
215
227
|
sheetConfirmButton: "Fortfahren",
|
|
216
228
|
progressBarCompletedLabel: "vollendet",
|
|
217
229
|
progressBarStepLabel: "Schritt 1$s von 2$s",
|
|
218
|
-
pinFieldInputLabel: "Ziffer 1$s von 2$s"
|
|
219
|
-
|
|
230
|
+
pinFieldInputLabel: "Ziffer 1$s von 2$s",
|
|
231
|
+
counterRemoveLabel: "Element entfernen",
|
|
232
|
+
counterIncreaseLabel: "Wert steigern",
|
|
233
|
+
counterDecreaseLabel: "Wert verringern",
|
|
234
|
+
counterQuantity: "menge",
|
|
235
|
+
counterMinValue: "minimal",
|
|
236
|
+
counterMaxValue: "maximal"
|
|
237
|
+
}, c = {
|
|
220
238
|
expirationDatePlaceholder: "MM/AA",
|
|
221
239
|
togglePasswordVisibilityLabel: "Mostrar ou ocultar senha",
|
|
222
240
|
loading: "Carregando",
|
|
@@ -252,13 +270,19 @@ const l = {
|
|
|
252
270
|
sheetConfirmButton: "Continuar",
|
|
253
271
|
progressBarCompletedLabel: "conclu\xeddo",
|
|
254
272
|
progressBarStepLabel: "Etapa 1$s de 2$s",
|
|
255
|
-
pinFieldInputLabel: "D\xedgito 1$s de 2$s"
|
|
256
|
-
|
|
273
|
+
pinFieldInputLabel: "D\xedgito 1$s de 2$s",
|
|
274
|
+
counterRemoveLabel: "Remover elemento",
|
|
275
|
+
counterIncreaseLabel: "aumentar valor",
|
|
276
|
+
counterDecreaseLabel: "diminuir valor",
|
|
277
|
+
counterQuantity: "quantidade",
|
|
278
|
+
counterMinValue: "m\xednimo",
|
|
279
|
+
counterMaxValue: "m\xe1ximo"
|
|
280
|
+
}, g = (e)=>{
|
|
257
281
|
switch(e.toLocaleLowerCase().split(/[-_]/)[0]){
|
|
258
282
|
case "es":
|
|
259
283
|
return l;
|
|
260
284
|
case "pt":
|
|
261
|
-
return
|
|
285
|
+
return c;
|
|
262
286
|
case "de":
|
|
263
287
|
return s;
|
|
264
288
|
case "en":
|
|
@@ -266,29 +290,29 @@ const l = {
|
|
|
266
290
|
default:
|
|
267
291
|
return process.env.NODE_ENV !== "production" && console.error(`Invalid locale: ${e}`), i;
|
|
268
292
|
}
|
|
269
|
-
},
|
|
270
|
-
headerMobileHeight:
|
|
271
|
-
headerDesktopHeight:
|
|
272
|
-
},
|
|
273
|
-
var { to: e , innerRef: r } = _param,
|
|
293
|
+
}, u = 56, d = 80, E = {
|
|
294
|
+
headerMobileHeight: u,
|
|
295
|
+
headerDesktopHeight: d
|
|
296
|
+
}, m = (_param)=>/* @__PURE__ */ {
|
|
297
|
+
var { to: e , innerRef: r } = _param, a = _object_without_properties(_param, [
|
|
274
298
|
"to",
|
|
275
299
|
"innerRef"
|
|
276
300
|
]);
|
|
277
301
|
return (0, _jsxruntime.jsx)("a", _object_spread_props(_object_spread({
|
|
278
302
|
ref: r,
|
|
279
303
|
href: typeof e == "string" ? e : e == null ? void 0 : e.pathname
|
|
280
|
-
},
|
|
281
|
-
children:
|
|
304
|
+
}, a), {
|
|
305
|
+
children: a.children
|
|
282
306
|
}));
|
|
283
|
-
},
|
|
284
|
-
var { innerRef: r } = _param,
|
|
307
|
+
}, C = (e)=>e, f = (e)=>(_param)=>/* @__PURE__ */ {
|
|
308
|
+
var { innerRef: r } = _param, a = _object_without_properties(_param, [
|
|
285
309
|
"innerRef"
|
|
286
310
|
]);
|
|
287
311
|
return (0, _jsxruntime.jsx)(e, _object_spread({
|
|
288
312
|
ref: r
|
|
289
|
-
},
|
|
313
|
+
}, a));
|
|
290
314
|
}, p = (e)=>(_param)=>/* @__PURE__ */ {
|
|
291
|
-
var { to: r , innerRef:
|
|
315
|
+
var { to: r , innerRef: a , children: t } = _param, n = _object_without_properties(_param, [
|
|
292
316
|
"to",
|
|
293
317
|
"innerRef",
|
|
294
318
|
"children"
|
|
@@ -296,35 +320,35 @@ const l = {
|
|
|
296
320
|
return (0, _jsxruntime.jsx)(e, {
|
|
297
321
|
href: r,
|
|
298
322
|
children: /* @__PURE__ */ (0, _jsxruntime.jsx)("a", _object_spread_props(_object_spread({
|
|
299
|
-
ref:
|
|
323
|
+
ref: a
|
|
300
324
|
}, n), {
|
|
301
325
|
children: t
|
|
302
326
|
}))
|
|
303
327
|
});
|
|
304
|
-
},
|
|
305
|
-
var { to: r , innerRef:
|
|
328
|
+
}, b = (e)=>(_param)=>/* @__PURE__ */ {
|
|
329
|
+
var { to: r , innerRef: a , children: t } = _param, n = _object_without_properties(_param, [
|
|
306
330
|
"to",
|
|
307
331
|
"innerRef",
|
|
308
332
|
"children"
|
|
309
333
|
]);
|
|
310
334
|
return (0, _jsxruntime.jsx)(e, _object_spread_props(_object_spread({
|
|
311
335
|
href: r,
|
|
312
|
-
ref:
|
|
336
|
+
ref: a
|
|
313
337
|
}, n), {
|
|
314
338
|
children: t
|
|
315
339
|
}));
|
|
316
340
|
}, h = (e)=>{
|
|
317
|
-
if (!e) return
|
|
341
|
+
if (!e) return m;
|
|
318
342
|
if (typeof e == "function" || e.$$typeof) return e;
|
|
319
343
|
switch(e.type){
|
|
320
344
|
case "ReactRouter5":
|
|
321
|
-
return
|
|
345
|
+
return C(e.Component);
|
|
322
346
|
case "ReactRouter6":
|
|
323
347
|
return f(e.Component);
|
|
324
348
|
case "Next12":
|
|
325
349
|
return p(e.Component);
|
|
326
350
|
case "Next13":
|
|
327
|
-
return
|
|
351
|
+
return b(e.Component);
|
|
328
352
|
default:
|
|
329
353
|
const r = e.type;
|
|
330
354
|
throw new Error(`Invalid Link type: ${r}`);
|
package/dist-es/accordion.js
CHANGED
|
@@ -81,11 +81,11 @@ import { jsxs as g, jsx as t } from "react/jsx-runtime";
|
|
|
81
81
|
import * as c from "react";
|
|
82
82
|
import { Content as N } from "./list.js";
|
|
83
83
|
import S from "./icons/icon-chevron.js";
|
|
84
|
-
import
|
|
85
|
-
import { itemContent as
|
|
86
|
-
import
|
|
87
|
-
import { BaseTouchable as
|
|
88
|
-
import
|
|
84
|
+
import x from "./box.js";
|
|
85
|
+
import { itemContent as T, touchableBackgroundInverse as y, touchableBackground as O, chevronContainer as D, panelTransitionClasses as E, panelContainer as P, panel as w } from "./accordion.css-mistica.js";
|
|
86
|
+
import _ from "./stack.js";
|
|
87
|
+
import { BaseTouchable as k } from "./touchable.js";
|
|
88
|
+
import L from "classnames";
|
|
89
89
|
import { vars as A } from "./skins/skin-contract.css-mistica.js";
|
|
90
90
|
import { getPrefixedDataAttributes as C } from "./utils/dom.js";
|
|
91
91
|
import V from "./divider.js";
|
|
@@ -93,87 +93,88 @@ import { Boxed as X } from "./boxed.js";
|
|
|
93
93
|
import { useIsInverseVariant as j } from "./theme-variant-context.js";
|
|
94
94
|
import { useAriaId as v } from "./hooks.js";
|
|
95
95
|
import { CSSTransition as M } from "react-transition-group";
|
|
96
|
-
|
|
96
|
+
import { isRunningAcceptanceTest as q } from "./utils/platform.js";
|
|
97
|
+
const z = 400, h = /*#__PURE__*/ c.createContext({
|
|
97
98
|
index: [],
|
|
98
99
|
toogle: ()=>{}
|
|
99
|
-
}),
|
|
100
|
-
let { value: o , defaultValue: r , onChange: n , singleOpen:
|
|
101
|
-
const
|
|
100
|
+
}), F = ()=>c.useContext(h), R = (param)=>{
|
|
101
|
+
let { value: o , defaultValue: r , onChange: n , singleOpen: s } = param;
|
|
102
|
+
const u = o !== void 0, d = (e)=>e === void 0 ? [] : typeof e == "number" ? [
|
|
102
103
|
e
|
|
103
|
-
] : e, [i,
|
|
104
|
-
c.useEffect(()=>
|
|
104
|
+
] : e, [i, a] = c.useState(d(r));
|
|
105
|
+
c.useEffect(()=>a(d(r)), [
|
|
105
106
|
r
|
|
106
107
|
]), c.useEffect(()=>{
|
|
107
|
-
i.length > 1 &&
|
|
108
|
+
i.length > 1 && s && (i.splice(1), a([
|
|
108
109
|
...i
|
|
109
110
|
]));
|
|
110
111
|
}, [
|
|
111
|
-
|
|
112
|
+
s,
|
|
112
113
|
i
|
|
113
114
|
]);
|
|
114
|
-
const p = (e,
|
|
115
|
-
if (!
|
|
115
|
+
const p = (e, l)=>{
|
|
116
|
+
if (!l) return [
|
|
116
117
|
e
|
|
117
118
|
];
|
|
118
|
-
const
|
|
119
|
-
return
|
|
119
|
+
const f = l.indexOf(e);
|
|
120
|
+
return f === -1 ? s ? l = [
|
|
120
121
|
e
|
|
121
|
-
] :
|
|
122
|
-
...
|
|
122
|
+
] : l.push(e) : l.splice(f, 1), [
|
|
123
|
+
...l
|
|
123
124
|
];
|
|
124
|
-
},
|
|
125
|
-
if (
|
|
126
|
-
const
|
|
127
|
-
n(e, !
|
|
125
|
+
}, m = (e)=>{
|
|
126
|
+
if (u || a(p(e, i)), n) {
|
|
127
|
+
const l = (u ? d(o) : i).includes(e);
|
|
128
|
+
n(e, !l);
|
|
128
129
|
}
|
|
129
130
|
};
|
|
130
|
-
return
|
|
131
|
-
|
|
132
|
-
|
|
131
|
+
return u ? [
|
|
132
|
+
d(o),
|
|
133
|
+
m
|
|
133
134
|
] : [
|
|
134
135
|
i,
|
|
135
|
-
|
|
136
|
+
m
|
|
136
137
|
];
|
|
137
|
-
},
|
|
138
|
+
}, H = (o)=>{
|
|
138
139
|
const r = o == null ? void 0 : o.closest("[data-accordion]");
|
|
139
140
|
if (r) return Array.from(r.querySelectorAll("[data-accordion-item]")).filter((n)=>n.closest("[data-accordion]") === r).findIndex((n)=>n === o);
|
|
140
|
-
},
|
|
141
|
-
var { content: o , dataAttributes: r , trackingEvent: n } = _param,
|
|
141
|
+
}, B = /*#__PURE__*/ c.forwardRef((_param, u)=>{
|
|
142
|
+
var { content: o , dataAttributes: r , trackingEvent: n } = _param, s = _object_without_properties(_param, [
|
|
142
143
|
"content",
|
|
143
144
|
"dataAttributes",
|
|
144
145
|
"trackingEvent"
|
|
145
146
|
]);
|
|
146
|
-
const
|
|
147
|
+
const d = c.useRef(null), i = c.useRef(null), { index: a , toogle: p } = F(), m = j(), e = v(), l = v(), [f, b] = c.useState(), I = f !== void 0 && (a == null ? void 0 : a.includes(f));
|
|
147
148
|
return c.useEffect(()=>{
|
|
148
|
-
b(
|
|
149
|
+
b(H(i.current));
|
|
149
150
|
}, []), /* @__PURE__ */ g("div", _object_spread_props(_object_spread({
|
|
150
151
|
ref: i
|
|
151
152
|
}, C(_object_spread_props(_object_spread({}, r), {
|
|
152
153
|
"accordion-item": !0
|
|
153
154
|
}))), {
|
|
154
155
|
children: [
|
|
155
|
-
/* @__PURE__ */ t(
|
|
156
|
-
ref:
|
|
157
|
-
className:
|
|
156
|
+
/* @__PURE__ */ t(k, {
|
|
157
|
+
ref: u,
|
|
158
|
+
className: L(T, m ? y : O),
|
|
158
159
|
onPress: ()=>{
|
|
159
|
-
|
|
160
|
+
f !== void 0 && p(f);
|
|
160
161
|
},
|
|
161
162
|
trackingEvent: n,
|
|
162
163
|
"aria-expanded": I,
|
|
163
|
-
"aria-controls":
|
|
164
|
-
children: /* @__PURE__ */ t(
|
|
164
|
+
"aria-controls": l,
|
|
165
|
+
children: /* @__PURE__ */ t(x, {
|
|
165
166
|
paddingX: 16,
|
|
166
167
|
children: /* @__PURE__ */ t(N, _object_spread_props(_object_spread({
|
|
167
168
|
labelId: e,
|
|
168
169
|
type: "custom"
|
|
169
|
-
},
|
|
170
|
+
}, s), {
|
|
170
171
|
right: /* @__PURE__ */ t("div", {
|
|
171
172
|
className: D,
|
|
172
173
|
children: /* @__PURE__ */ t(S, {
|
|
173
174
|
size: 24,
|
|
174
175
|
transitionDuration: 400,
|
|
175
176
|
direction: I ? "up" : "down",
|
|
176
|
-
color:
|
|
177
|
+
color: m ? A.colors.inverse : I ? A.colors.neutralHigh : A.colors.neutralMedium
|
|
177
178
|
})
|
|
178
179
|
})
|
|
179
180
|
}))
|
|
@@ -181,20 +182,20 @@ const q = 400, x = /*#__PURE__*/ c.createContext({
|
|
|
181
182
|
}),
|
|
182
183
|
/* @__PURE__ */ t(M, {
|
|
183
184
|
in: I,
|
|
184
|
-
timeout: q,
|
|
185
|
-
nodeRef:
|
|
186
|
-
classNames:
|
|
185
|
+
timeout: q() ? 0 : z,
|
|
186
|
+
nodeRef: d,
|
|
187
|
+
classNames: E,
|
|
187
188
|
mountOnEnter: !0,
|
|
188
189
|
unmountOnExit: !0,
|
|
189
190
|
children: /* @__PURE__ */ t("div", {
|
|
190
|
-
className:
|
|
191
|
-
ref:
|
|
191
|
+
className: P,
|
|
192
|
+
ref: d,
|
|
192
193
|
children: /* @__PURE__ */ t("div", {
|
|
193
|
-
className:
|
|
194
|
+
className: w,
|
|
194
195
|
role: "region",
|
|
195
196
|
"aria-labelledby": e,
|
|
196
|
-
id:
|
|
197
|
-
children: /* @__PURE__ */ t(
|
|
197
|
+
id: l,
|
|
198
|
+
children: /* @__PURE__ */ t(x, {
|
|
198
199
|
paddingX: 16,
|
|
199
200
|
paddingBottom: 16,
|
|
200
201
|
children: o
|
|
@@ -204,70 +205,70 @@ const q = 400, x = /*#__PURE__*/ c.createContext({
|
|
|
204
205
|
})
|
|
205
206
|
]
|
|
206
207
|
}));
|
|
207
|
-
}),
|
|
208
|
+
}), so = /*#__PURE__*/ c.forwardRef((_param, n)=>/* @__PURE__ */ {
|
|
208
209
|
var { dataAttributes: o } = _param, r = _object_without_properties(_param, [
|
|
209
210
|
"dataAttributes"
|
|
210
211
|
]);
|
|
211
|
-
return t(
|
|
212
|
+
return t(B, _object_spread_props(_object_spread({}, r), {
|
|
212
213
|
ref: n,
|
|
213
214
|
dataAttributes: _object_spread({
|
|
214
215
|
"component-name": "AccordionItem"
|
|
215
216
|
}, o)
|
|
216
217
|
}));
|
|
217
|
-
}),
|
|
218
|
-
let { children: o , dataAttributes: r ,
|
|
219
|
-
const [
|
|
220
|
-
value:
|
|
221
|
-
defaultValue:
|
|
222
|
-
onChange:
|
|
223
|
-
singleOpen:
|
|
224
|
-
}),
|
|
225
|
-
return /* @__PURE__ */ t(
|
|
218
|
+
}), ao = (param)=>{
|
|
219
|
+
let { children: o , dataAttributes: r , index: n , defaultIndex: s , onChange: u , singleOpen: d } = param;
|
|
220
|
+
const [i, a] = R({
|
|
221
|
+
value: n,
|
|
222
|
+
defaultValue: s,
|
|
223
|
+
onChange: u,
|
|
224
|
+
singleOpen: d
|
|
225
|
+
}), p = c.Children.count(o) - 1;
|
|
226
|
+
return /* @__PURE__ */ t(h.Provider, {
|
|
226
227
|
value: {
|
|
227
|
-
index:
|
|
228
|
-
toogle:
|
|
228
|
+
index: i,
|
|
229
|
+
toogle: a
|
|
229
230
|
},
|
|
230
231
|
children: /* @__PURE__ */ t("div", _object_spread_props(_object_spread({}, C(_object_spread_props(_object_spread({}, r), {
|
|
231
232
|
accordion: !0
|
|
232
233
|
}), "Accordion")), {
|
|
233
|
-
children: c.Children.toArray(o).filter(Boolean).map((
|
|
234
|
+
children: c.Children.toArray(o).filter(Boolean).map((m, e)=>/* @__PURE__ */ g(c.Fragment, {
|
|
234
235
|
children: [
|
|
235
|
-
|
|
236
|
-
|
|
236
|
+
m,
|
|
237
|
+
e < p && /* @__PURE__ */ t(x, {
|
|
237
238
|
paddingX: 16,
|
|
238
239
|
children: /* @__PURE__ */ t(V, {})
|
|
239
240
|
})
|
|
240
241
|
]
|
|
241
|
-
},
|
|
242
|
+
}, e))
|
|
242
243
|
}))
|
|
243
244
|
});
|
|
244
|
-
},
|
|
245
|
+
}, lo = /*#__PURE__*/ c.forwardRef((_param, s)=>/* @__PURE__ */ {
|
|
245
246
|
var { dataAttributes: o , isInverse: r } = _param, n = _object_without_properties(_param, [
|
|
246
247
|
"dataAttributes",
|
|
247
248
|
"isInverse"
|
|
248
249
|
]);
|
|
249
250
|
return t(X, {
|
|
250
251
|
isInverse: r,
|
|
251
|
-
ref:
|
|
252
|
+
ref: s,
|
|
252
253
|
dataAttributes: _object_spread({
|
|
253
254
|
"component-name": "BoxedAccordionItem"
|
|
254
255
|
}, o),
|
|
255
|
-
children: /* @__PURE__ */ t(
|
|
256
|
+
children: /* @__PURE__ */ t(B, _object_spread({}, n))
|
|
256
257
|
});
|
|
257
|
-
}),
|
|
258
|
-
let { children: o , dataAttributes: r , index: n , defaultIndex:
|
|
259
|
-
const [i,
|
|
258
|
+
}), uo = (param)=>{
|
|
259
|
+
let { children: o , dataAttributes: r , index: n , defaultIndex: s , onChange: u , singleOpen: d } = param;
|
|
260
|
+
const [i, a] = R({
|
|
260
261
|
value: n,
|
|
261
|
-
defaultValue:
|
|
262
|
-
onChange:
|
|
263
|
-
singleOpen:
|
|
262
|
+
defaultValue: s,
|
|
263
|
+
onChange: u,
|
|
264
|
+
singleOpen: d
|
|
264
265
|
});
|
|
265
|
-
return /* @__PURE__ */ t(
|
|
266
|
+
return /* @__PURE__ */ t(h.Provider, {
|
|
266
267
|
value: {
|
|
267
268
|
index: i,
|
|
268
|
-
toogle:
|
|
269
|
+
toogle: a
|
|
269
270
|
},
|
|
270
|
-
children: /* @__PURE__ */ t(
|
|
271
|
+
children: /* @__PURE__ */ t(_, {
|
|
271
272
|
space: 16,
|
|
272
273
|
dataAttributes: _object_spread({
|
|
273
274
|
"component-name": "BoxedAccordion",
|
|
@@ -277,4 +278,4 @@ const q = 400, x = /*#__PURE__*/ c.createContext({
|
|
|
277
278
|
})
|
|
278
279
|
});
|
|
279
280
|
};
|
|
280
|
-
export {
|
|
281
|
+
export { ao as Accordion, so as AccordionItem, uo as BoxedAccordion, lo as BoxedAccordionItem, F as useAccordionContext };
|
|
@@ -1,12 +1,10 @@
|
|
|
1
1
|
import "./sprinkles.css.ts.vanilla.css-mistica.js";
|
|
2
2
|
import "./button.css.ts.vanilla.css-mistica.js";
|
|
3
3
|
import "./button-layout.css.ts.vanilla.css-mistica.js";
|
|
4
|
-
var
|
|
4
|
+
var l = "kfxylhg", a = {
|
|
5
5
|
right: "_1y2v1nfbg",
|
|
6
6
|
left: "_1y2v1nfbe",
|
|
7
7
|
center: "_1y2v1nfbf",
|
|
8
|
-
"full-width": "
|
|
9
|
-
},
|
|
10
|
-
|
|
11
|
-
};
|
|
12
|
-
export { f as alignMoreThanOneChildred, l as alignVariant, t as baseContainer, i as container, v as fullWidthContainer, h as link, y as linkAlignment, e as margins, k as noButtonWidth, o as vars };
|
|
8
|
+
"full-width": "kfxylhf _1y2v1nfbf"
|
|
9
|
+
}, i = "kfxylh5 _1y2v1nfb6", t = "kfxylh6", v = "kfxylh7", y = "kfxylh2 _1y2v1nfb6 _1y2v1nfbt", e = "kfxylh3", h = "kfxylh0";
|
|
10
|
+
export { l as alignMoreThanOneChildren, a as alignVariant, i as baseContainer, t as container, v as fullWidthContainer, y as link, e as linkAlignment, h as margins };
|
package/dist-es/button-layout.js
CHANGED
|
@@ -50,111 +50,40 @@ function _object_spread_props(target, source) {
|
|
|
50
50
|
}
|
|
51
51
|
return target;
|
|
52
52
|
}
|
|
53
|
-
import { jsxs as
|
|
54
|
-
import * as
|
|
55
|
-
import {
|
|
56
|
-
import
|
|
57
|
-
import {
|
|
58
|
-
import {
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
import { getPrefixedDataAttributes as N } from "./utils/dom.js";
|
|
62
|
-
import { baseContainer as R, alignVariant as S, fullWidthContainer as k, container as A, noButtonWidth as D, alignMoreThanOneChildred as I, vars as T, link as V, linkAlignment as _, margins as j } from "./button-layout.css-mistica.js";
|
|
63
|
-
const z = (t)=>{
|
|
64
|
-
o.useEffect(()=>{
|
|
65
|
-
var r, u;
|
|
66
|
-
let e = !1;
|
|
67
|
-
return (u = (r = document.fonts) == null ? void 0 : r.ready) != null && u.then && document.fonts.ready.then(()=>{
|
|
68
|
-
e || t();
|
|
69
|
-
}), ()=>{
|
|
70
|
-
e = !0;
|
|
71
|
-
};
|
|
72
|
-
}, [
|
|
73
|
-
t
|
|
74
|
-
]);
|
|
75
|
-
}, P = (t, e)=>{
|
|
76
|
-
o.useEffect(()=>{
|
|
77
|
-
if (t) {
|
|
78
|
-
const r = new MutationObserver(e);
|
|
79
|
-
return r.observe(t, {
|
|
80
|
-
childList: !0,
|
|
81
|
-
attributes: !1,
|
|
82
|
-
subtree: !0
|
|
83
|
-
}), ()=>{
|
|
84
|
-
r.disconnect();
|
|
85
|
-
};
|
|
86
|
-
}
|
|
87
|
-
return ()=>{};
|
|
88
|
-
}, [
|
|
89
|
-
e,
|
|
90
|
-
t
|
|
91
|
-
]);
|
|
92
|
-
}, p = [
|
|
53
|
+
import { jsxs as y, jsx as e } from "react/jsx-runtime";
|
|
54
|
+
import * as a from "react";
|
|
55
|
+
import { ButtonSecondary as g, ButtonDanger as B, ButtonPrimary as x } from "./button.js";
|
|
56
|
+
import i from "classnames";
|
|
57
|
+
import { getPrefixedDataAttributes as C } from "./utils/dom.js";
|
|
58
|
+
import { baseContainer as b, alignVariant as k, fullWidthContainer as v, container as A, alignMoreThanOneChildren as L, link as N, linkAlignment as O, margins as j } from "./button-layout.css-mistica.js";
|
|
59
|
+
const s = [
|
|
60
|
+
g,
|
|
93
61
|
B,
|
|
94
|
-
M,
|
|
95
62
|
x
|
|
96
|
-
],
|
|
97
|
-
let { children:
|
|
98
|
-
const
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
}),
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
isMeasuring: i,
|
|
105
|
-
buttonWidth: a
|
|
106
|
-
});
|
|
107
|
-
}, c = o.useRef(null);
|
|
108
|
-
L(()=>{
|
|
109
|
-
if (s.isMeasuring && c.current) {
|
|
110
|
-
const i = Array.from(c.current.children).map((d)=>d.dataset.link ? 0 : d.offsetWidth + 1), a = Math.ceil(Math.max(...i, C));
|
|
111
|
-
f({
|
|
112
|
-
isMeasuring: !1,
|
|
113
|
-
buttonWidth: a
|
|
114
|
-
});
|
|
115
|
-
}
|
|
116
|
-
}, [
|
|
117
|
-
s.isMeasuring
|
|
118
|
-
]);
|
|
119
|
-
const n = o.useMemo(()=>O(()=>{
|
|
120
|
-
f({
|
|
121
|
-
isMeasuring: !0,
|
|
122
|
-
buttonWidth: 0
|
|
123
|
-
});
|
|
124
|
-
}, 5, {
|
|
125
|
-
maxWait: 50
|
|
126
|
-
}), []);
|
|
127
|
-
P(c.current, n), z(n), o.useEffect(()=>(window.addEventListener("resize", n), window.addEventListener("focus", n), document.addEventListener("visibilitychange", n), ()=>{
|
|
128
|
-
window.removeEventListener("resize", n), window.removeEventListener("focus", n), document.removeEventListener("visibilitychange", n);
|
|
129
|
-
}), [
|
|
130
|
-
n
|
|
131
|
-
]);
|
|
132
|
-
const g = o.Children.toArray(t).sort((i, a)=>{
|
|
133
|
-
const d = p.indexOf(i.type), E = p.indexOf(a.type);
|
|
134
|
-
return d - E;
|
|
135
|
-
}), l = /* @__PURE__ */ W("div", _object_spread_props(_object_spread({
|
|
136
|
-
ref: c,
|
|
137
|
-
className: h(R, S[e], s.buttonWidth ? e === "full-width" ? k : A : D, {
|
|
138
|
-
[I]: v > 1
|
|
139
|
-
}),
|
|
140
|
-
style: w({
|
|
141
|
-
[T.buttonWidth]: s.buttonWidth ? `${s.buttonWidth}px` : "auto"
|
|
63
|
+
], w = (param)=>{
|
|
64
|
+
let { children: n , align: t = "full-width" , link: o , withMargins: l = !1 , dataAttributes: u } = param;
|
|
65
|
+
const c = a.Children.count(n), d = a.Children.toArray(n).sort((m, f)=>{
|
|
66
|
+
const h = s.indexOf(m.type), p = s.indexOf(f.type);
|
|
67
|
+
return h - p;
|
|
68
|
+
}), r = /* @__PURE__ */ y("div", _object_spread_props(_object_spread({
|
|
69
|
+
className: i(b, k[t], t === "full-width" ? v : A, {
|
|
70
|
+
[L]: c > 1
|
|
142
71
|
})
|
|
143
|
-
},
|
|
72
|
+
}, C(u, "ButtonLayout")), {
|
|
144
73
|
children: [
|
|
145
|
-
|
|
146
|
-
className:
|
|
147
|
-
[
|
|
74
|
+
o ? /* @__PURE__ */ e("div", {
|
|
75
|
+
className: i(N, {
|
|
76
|
+
[O]: t === "left"
|
|
148
77
|
}),
|
|
149
78
|
"data-link": "true",
|
|
150
|
-
children:
|
|
79
|
+
children: o
|
|
151
80
|
}) : null,
|
|
152
|
-
|
|
81
|
+
d
|
|
153
82
|
]
|
|
154
83
|
}));
|
|
155
|
-
return
|
|
84
|
+
return l ? /* @__PURE__ */ e("div", {
|
|
156
85
|
className: j,
|
|
157
|
-
children:
|
|
158
|
-
}) :
|
|
159
|
-
},
|
|
160
|
-
export {
|
|
86
|
+
children: r
|
|
87
|
+
}) : r;
|
|
88
|
+
}, T = w;
|
|
89
|
+
export { T as default };
|
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
import "./sprinkles.css.ts.vanilla.css-mistica.js";
|
|
2
2
|
import "./button.css.ts.vanilla.css-mistica.js";
|
|
3
|
-
var _ =
|
|
3
|
+
var _ = 2, y = 8, f = 24, r = 12, b = 6, a = 20, p = 16, e = 20, I = 14.5, i = 10.5, N = "rrbrpni _1y2v1nf28", d = {
|
|
4
4
|
primary: "rrbrpno rrbrpn2 _1y2v1nf5z _1y2v1nf78 _1y2v1nf8h _1y2v1nf9q _1y2v1nfba _1y2v1nfb0 _1y2v1nfbu _1y2v1nfdv _1y2v1nfe6 _1y2v1nf21 _1y2v1nf3s",
|
|
5
5
|
secondary: "rrbrpnp rrbrpn2 _1y2v1nf5z _1y2v1nf78 _1y2v1nf8h _1y2v1nf9q _1y2v1nfba _1y2v1nfb0 _1y2v1nfbu _1y2v1nfdv _1y2v1nfe6 _1y2v1nf25 _1y2v1nf5y",
|
|
6
6
|
danger: "rrbrpnq rrbrpn2 _1y2v1nf5z _1y2v1nf78 _1y2v1nf8h _1y2v1nf9q _1y2v1nfba _1y2v1nfb0 _1y2v1nfbu _1y2v1nfdv _1y2v1nfe6 _1y2v1nf20 _1y2v1nf3m"
|
|
7
|
-
},
|
|
7
|
+
}, t = "rrbrpn0", o = "rrbrpng _1y2v1nf8t _1y2v1nfa2 _1y2v1nfba _1y2v1nfbu _1y2v1nfb0 _1y2v1nfdv _1y2v1nfdo _1y2v1nf27 _1y2v1nf5y _1y2v1nfe6 _1y2v1nfd0", L = "rrbrpn7 _1y2v1nfb7 _1y2v1nfb1 _1y2v1nfec _1y2v1nffl _1y2v1nfbf _1y2v1nfbl", l = "rrbrpn4 _1y2v1nfb8 _1y2v1nfcb _1y2v1nfe6", s = "rrbrpn5", A = "rrbrpn9 _1y2v1nfb6 _1y2v1nfbl _1y2v1nfbf", P = "rrbrpnk _1y2v1nfb6 _1y2v1nfbl _1y2v1nfbf", S = {
|
|
8
8
|
primary: "rrbrpnl rrbrpn2 _1y2v1nf5z _1y2v1nf78 _1y2v1nf8h _1y2v1nf9q _1y2v1nfba _1y2v1nfb0 _1y2v1nfbu _1y2v1nfdv _1y2v1nfe6 _1y2v1nf20 _1y2v1nf3r",
|
|
9
9
|
secondary: "rrbrpnm rrbrpn2 _1y2v1nf5z _1y2v1nf78 _1y2v1nf8h _1y2v1nf9q _1y2v1nfba _1y2v1nfb0 _1y2v1nfbu _1y2v1nfdv _1y2v1nfe6 _1y2v1nf23 _1y2v1nf5y",
|
|
10
10
|
danger: "rrbrpnn rrbrpn2 _1y2v1nf5z _1y2v1nf78 _1y2v1nf8h _1y2v1nf9q _1y2v1nfba _1y2v1nfb0 _1y2v1nfbu _1y2v1nfdv _1y2v1nfe6 _1y2v1nf20 _1y2v1nf3m"
|
|
11
11
|
};
|
|
12
|
-
export { _ as
|
|
12
|
+
export { _ as CHEVRON_MARGIN_LEFT_LINK, y as ICON_MARGIN_PX, f as ICON_SIZE, r as PADDING_X_LINK, b as PADDING_Y_LINK, a as SMALL_ICON_SIZE, p as SMALL_SPINNER_SIZE, e as SPINNER_SIZE, I as X_PADDING_PX, i as X_SMALL_PADDING_PX, N as inverseLink, d as inverseVariants, t as isLoading, o as link, L as loadingContent, l as loadingFiller, s as small, A as textContent, P as textContentLink, S as variants };
|
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
import "./sprinkles.css.ts.vanilla.css-mistica.js";
|
|
2
|
+
import "./counter.css.ts.vanilla.css-mistica.js";
|
|
3
|
+
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";
|
|
4
|
+
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 };
|