@telefonica/mistica 14.25.0 → 14.26.1

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 (80) hide show
  1. package/css/mistica.css +1 -1
  2. package/dist/accordion.css-mistica.js +41 -0
  3. package/dist/accordion.css.d.ts +12 -0
  4. package/dist/accordion.css.ts.vanilla.css-mistica.js +11 -0
  5. package/dist/accordion.d.ts +47 -0
  6. package/dist/accordion.js +350 -0
  7. package/dist/boxed.d.ts +1 -0
  8. package/dist/boxed.js +17 -16
  9. package/dist/card.js +345 -345
  10. package/dist/carousel.js +58 -52
  11. package/dist/checkbox.css.d.ts +1 -1
  12. package/dist/checkbox.d.ts +3 -1
  13. package/dist/checkbox.js +23 -22
  14. package/dist/community/blocks.js +3 -2
  15. package/dist/form-context.d.ts +9 -9
  16. package/dist/generated/mistica-icons/icons-keywords.d.ts +4 -0
  17. package/dist/icons/icon-chevron.d.ts +1 -0
  18. package/dist/icons/icon-chevron.js +21 -18
  19. package/dist/index.d.ts +4 -2
  20. package/dist/index.js +30 -4
  21. package/dist/integer-field.d.ts +5 -1
  22. package/dist/integer-field.js +12 -11
  23. package/dist/list.d.ts +8 -0
  24. package/dist/list.js +3 -0
  25. package/dist/menu.css-mistica.js +30 -6
  26. package/dist/menu.css.d.ts +14 -2
  27. package/dist/menu.d.ts +25 -3
  28. package/dist/menu.js +264 -84
  29. package/dist/overlay.js +11 -52
  30. package/dist/overscroll-color-context.js +23 -11
  31. package/dist/package-version.js +1 -1
  32. package/dist/pin-field.css-mistica.js +37 -0
  33. package/dist/pin-field.css.d.ts +7 -0
  34. package/dist/pin-field.css.ts.vanilla.css-mistica.js +11 -0
  35. package/dist/pin-field.d.ts +25 -0
  36. package/dist/pin-field.js +269 -0
  37. package/dist/progress-bar.css-mistica.js +7 -4
  38. package/dist/progress-bar.css.d.ts +1 -0
  39. package/dist/progress-bar.d.ts +12 -3
  40. package/dist/progress-bar.js +109 -13
  41. package/dist/stepper.js +34 -27
  42. package/dist/tabs.js +4 -3
  43. package/dist/text-field-base.css.d.ts +2 -0
  44. package/dist/text-field-base.d.ts +1 -0
  45. package/dist/text-field-components.js +28 -26
  46. package/dist/text-field.d.ts +1 -0
  47. package/dist/theme.d.ts +3 -0
  48. package/dist/theme.js +24 -12
  49. package/dist/touchable.js +5 -4
  50. package/dist/video.js +8 -9
  51. package/dist-es/accordion.css-mistica.js +9 -0
  52. package/dist-es/accordion.css.ts.vanilla.css-mistica.js +2 -0
  53. package/dist-es/accordion.js +280 -0
  54. package/dist-es/boxed.js +25 -24
  55. package/dist-es/card.js +475 -475
  56. package/dist-es/carousel.js +95 -89
  57. package/dist-es/checkbox.js +42 -41
  58. package/dist-es/community/blocks.js +2 -1
  59. package/dist-es/icons/icon-chevron.js +25 -22
  60. package/dist-es/index.js +1768 -1766
  61. package/dist-es/integer-field.js +14 -13
  62. package/dist-es/list.js +9 -9
  63. package/dist-es/menu.css-mistica.js +10 -4
  64. package/dist-es/menu.js +262 -93
  65. package/dist-es/overlay.js +18 -20
  66. package/dist-es/overscroll-color-context.js +30 -18
  67. package/dist-es/package-version.js +1 -1
  68. package/dist-es/pin-field.css-mistica.js +5 -0
  69. package/dist-es/pin-field.css.ts.vanilla.css-mistica.js +2 -0
  70. package/dist-es/pin-field.js +217 -0
  71. package/dist-es/progress-bar.css-mistica.js +2 -2
  72. package/dist-es/progress-bar.js +67 -18
  73. package/dist-es/stepper.js +61 -54
  74. package/dist-es/style.css +1 -1
  75. package/dist-es/tabs.js +11 -10
  76. package/dist-es/text-field-components.js +38 -36
  77. package/dist-es/theme.js +24 -12
  78. package/dist-es/touchable.js +9 -8
  79. package/dist-es/video.js +16 -17
  80. package/package.json +1 -1
@@ -10,13 +10,13 @@ function _export(target, all) {
10
10
  }
11
11
  _export(exports, {
12
12
  FieldContainer: function() {
13
- return J;
13
+ return K;
14
14
  },
15
15
  HelperText: function() {
16
- return G;
16
+ return J;
17
17
  },
18
18
  Label: function() {
19
- return B;
19
+ return G;
20
20
  }
21
21
  });
22
22
  const _jsxruntime = require("react/jsx-runtime");
@@ -124,25 +124,25 @@ function _object_spread_props(target, source) {
124
124
  }
125
125
  return target;
126
126
  }
127
- const B = (param)=>{
128
- let { shrinkLabel: o , forId: t , inputState: r , error: l , children: i , style: n , optional: d } = param;
129
- const m = o || r === "focused" || r === "filled", [v, T] = _react.useState("initial"), { texts: b } = (0, _hooks.useTheme)();
127
+ const G = (param)=>{
128
+ let { shrinkLabel: l , forId: s , inputState: r , error: o , children: i , style: n , optional: d } = param;
129
+ const m = l || r === "focused" || r === "filled", [v, b] = _react.useState("initial"), { texts: N } = (0, _hooks.useTheme)();
130
130
  _react.useEffect(()=>{
131
- const N = setTimeout(()=>{
132
- process.env.NODE_ENV !== "test" && T("transform 150ms, width 150ms");
131
+ const T = setTimeout(()=>{
132
+ process.env.NODE_ENV !== "test" && b("transform 150ms, width 150ms");
133
133
  });
134
134
  return ()=>{
135
- clearTimeout(N);
135
+ clearTimeout(T);
136
136
  };
137
137
  }, []);
138
138
  let f = _skincontractcssmistica.vars.colors.textSecondary;
139
- return l && r !== "default" ? f = _skincontractcssmistica.vars.colors.error : r === "focused" && (f = _skincontractcssmistica.vars.colors.controlActivated), /* @__PURE__ */ (0, _jsxruntime.jsxs)("label", {
139
+ return o && r !== "default" ? f = _skincontractcssmistica.vars.colors.error : r === "focused" && (f = _skincontractcssmistica.vars.colors.controlActivated), /* @__PURE__ */ (0, _jsxruntime.jsxs)("label", {
140
140
  className: (0, _classnames.default)(_textfieldcomponentscssmistica.labelContainer, {
141
141
  [_textfieldcomponentscssmistica.shrinked]: m
142
142
  }, (0, _sprinklescssmistica.sprinkles)({
143
143
  color: f
144
144
  })),
145
- htmlFor: t,
145
+ htmlFor: s,
146
146
  style: _object_spread_props(_object_spread({}, n), {
147
147
  transition: v
148
148
  }),
@@ -154,53 +154,55 @@ const B = (param)=>{
154
154
  d ? /* @__PURE__ */ (0, _jsxruntime.jsxs)("span", {
155
155
  children: [
156
156
  "\xa0(",
157
- b.formFieldOptionalLabelSuffix,
157
+ N.formFieldOptionalLabelSuffix,
158
158
  ")"
159
159
  ]
160
160
  }) : null
161
161
  ]
162
162
  });
163
- }, G = (param)=>{
164
- let { leftText: o , rightText: t , error: r } = param;
165
- const l = (0, _themevariantcontext.useIsInverseVariant)(), i = l ? _skincontractcssmistica.vars.colors.textPrimaryInverse : r ? _skincontractcssmistica.vars.colors.error : _skincontractcssmistica.vars.colors.textSecondary, n = l ? _skincontractcssmistica.vars.colors.textPrimaryInverse : _skincontractcssmistica.vars.colors.textSecondary;
166
- return /* @__PURE__ */ (0, _jsxruntime.jsxs)("div", {
167
- className: _textfieldcomponentscssmistica.helperContainer,
163
+ }, J = (param)=>{
164
+ let { leftText: l , rightText: s , error: r } = param;
165
+ const o = (0, _themevariantcontext.useIsInverseVariant)(), i = o ? _skincontractcssmistica.vars.colors.textPrimaryInverse : r ? _skincontractcssmistica.vars.colors.error : _skincontractcssmistica.vars.colors.textSecondary, n = o ? _skincontractcssmistica.vars.colors.textPrimaryInverse : _skincontractcssmistica.vars.colors.textSecondary;
166
+ return /* @__PURE__ */ (0, _jsxruntime.jsxs)(_jsxruntime.Fragment, {
168
167
  children: [
169
- o && /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
168
+ l && /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
170
169
  className: (0, _classnames.default)(_textfieldcomponentscssmistica.helperText, _textfieldcomponentscssmistica.leftText),
171
170
  children: /* @__PURE__ */ (0, _jsxruntime.jsx)(_text.Text1, {
172
171
  color: i,
173
172
  regular: !0,
174
173
  as: "p",
175
- children: o
174
+ children: l
176
175
  })
177
176
  }),
178
- t && /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
177
+ s && /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
179
178
  className: (0, _classnames.default)(_textfieldcomponentscssmistica.helperText, _textfieldcomponentscssmistica.rightText),
180
179
  children: /* @__PURE__ */ (0, _jsxruntime.jsx)(_text.Text1, {
181
180
  color: n,
182
181
  regular: !0,
183
182
  as: "p",
184
- children: t
183
+ children: s
185
184
  })
186
185
  })
187
186
  ]
188
187
  });
189
- }, J = (param)=>/* @__PURE__ */ {
190
- let { multiline: o , disabled: t , children: r , helperText: l , className: i , fieldRef: n , fullWidth: d , readOnly: m } = param;
188
+ }, K = (param)=>/* @__PURE__ */ {
189
+ let { multiline: l , disabled: s , children: r , helperText: o , className: i , fieldRef: n , fullWidth: d , readOnly: m } = param;
191
190
  return (0, _jsxruntime.jsxs)("div", {
192
191
  className: (0, _classnames.default)(_textfieldcomponentscssmistica.fieldContainer, d ? _textfieldcomponentscssmistica.fullWidth : _textfieldcomponentscssmistica.normalWidth, {
193
- [_textfieldcomponentscssmistica.disabled]: t
192
+ [_textfieldcomponentscssmistica.disabled]: s
194
193
  }),
195
194
  children: [
196
195
  /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
197
- className: (0, _classnames.default)(_textfieldcomponentscssmistica.field, o ? _textfieldcomponentscssmistica.fieldMulti : _textfieldcomponentscssmistica.fieldSingle, (0, _sprinklescssmistica.sprinkles)({
196
+ className: (0, _classnames.default)(_textfieldcomponentscssmistica.field, l ? _textfieldcomponentscssmistica.fieldMulti : _textfieldcomponentscssmistica.fieldSingle, (0, _sprinklescssmistica.sprinkles)({
198
197
  background: m ? _skincontractcssmistica.vars.colors.neutralLow : _skincontractcssmistica.vars.colors.backgroundContainer
199
198
  }), i),
200
199
  ref: n,
201
200
  children: r
202
201
  }),
203
- l
202
+ o && /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
203
+ className: _textfieldcomponentscssmistica.helperContainer,
204
+ children: o
205
+ })
204
206
  ]
205
207
  });
206
208
  };
@@ -7,6 +7,7 @@ export interface TextFieldProps extends CommonFormFieldProps<HTMLInputElement |
7
7
  prefix?: React.ReactNode;
8
8
  endIcon?: React.ReactNode;
9
9
  getSuggestions?: (value: string) => ReadonlyArray<string>;
10
+ role?: string;
10
11
  }
11
12
  declare const TextField: React.ForwardRefExoticComponent<TextFieldProps & React.RefAttributes<HTMLInputElement>>;
12
13
  export default TextField;
package/dist/theme.d.ts CHANGED
@@ -38,6 +38,9 @@ declare const TEXTS_ES: {
38
38
  playIconButtonLabel: string;
39
39
  pauseIconButtonLabel: string;
40
40
  sheetConfirmButton: string;
41
+ progressBarCompletedLabel: string;
42
+ progressBarStepLabel: string;
43
+ pinFieldInputLabel: string;
41
44
  };
42
45
  export declare const getTexts: (locale: Locale) => typeof TEXTS_ES;
43
46
  export declare const NAVBAR_HEIGHT_MOBILE = 56;
package/dist/theme.js CHANGED
@@ -22,7 +22,7 @@ _export(exports, {
22
22
  return h;
23
23
  },
24
24
  getTexts: function() {
25
- return b;
25
+ return v;
26
26
  }
27
27
  });
28
28
  const _jsxruntime = require("react/jsx-runtime");
@@ -138,7 +138,10 @@ const l = {
138
138
  carouselPrevButton: "anterior",
139
139
  playIconButtonLabel: "Reproducir",
140
140
  pauseIconButtonLabel: "Pausar",
141
- sheetConfirmButton: "Continuar"
141
+ sheetConfirmButton: "Continuar",
142
+ progressBarCompletedLabel: "completo",
143
+ progressBarStepLabel: "Paso 1$s de 2$s",
144
+ pinFieldInputLabel: "D\xedgito 1$s de 2$s"
142
145
  }, i = {
143
146
  expirationDatePlaceholder: "MM/YY",
144
147
  togglePasswordVisibilityLabel: "Toggle password visibility",
@@ -172,8 +175,11 @@ const l = {
172
175
  carouselPrevButton: "previous",
173
176
  playIconButtonLabel: "Play",
174
177
  pauseIconButtonLabel: "Pause",
175
- sheetConfirmButton: "Continue"
176
- }, d = {
178
+ sheetConfirmButton: "Continue",
179
+ progressBarCompletedLabel: "completed",
180
+ progressBarStepLabel: "Step 1$s of 2$s",
181
+ pinFieldInputLabel: "Digit 1$s of 2$s"
182
+ }, s = {
177
183
  expirationDatePlaceholder: "MM/JJ",
178
184
  togglePasswordVisibilityLabel: "Passwort un-/sichtbar machen",
179
185
  loading: "Wird gespeichert",
@@ -206,8 +212,11 @@ const l = {
206
212
  carouselPrevButton: "vorherige",
207
213
  playIconButtonLabel: "Abspielen",
208
214
  pauseIconButtonLabel: "Pausieren",
209
- sheetConfirmButton: "Fortfahren"
210
- }, s = {
215
+ sheetConfirmButton: "Fortfahren",
216
+ progressBarCompletedLabel: "vollendet",
217
+ progressBarStepLabel: "Schritt 1$s von 2$s",
218
+ pinFieldInputLabel: "Ziffer 1$s von 2$s"
219
+ }, d = {
211
220
  expirationDatePlaceholder: "MM/AA",
212
221
  togglePasswordVisibilityLabel: "Mostrar ou ocultar senha",
213
222
  loading: "Carregando",
@@ -240,15 +249,18 @@ const l = {
240
249
  carouselPrevButton: "anterior",
241
250
  playIconButtonLabel: "Reproduzir",
242
251
  pauseIconButtonLabel: "Pausar",
243
- sheetConfirmButton: "Continuar"
244
- }, b = (e)=>{
252
+ sheetConfirmButton: "Continuar",
253
+ progressBarCompletedLabel: "conclu\xeddo",
254
+ progressBarStepLabel: "Etapa 1$s de 2$s",
255
+ pinFieldInputLabel: "D\xedgito 1$s de 2$s"
256
+ }, v = (e)=>{
245
257
  switch(e.toLocaleLowerCase().split(/[-_]/)[0]){
246
258
  case "es":
247
259
  return l;
248
260
  case "pt":
249
- return s;
250
- case "de":
251
261
  return d;
262
+ case "de":
263
+ return s;
252
264
  case "en":
253
265
  return i;
254
266
  default:
@@ -289,7 +301,7 @@ const l = {
289
301
  children: t
290
302
  }))
291
303
  });
292
- }, v = (e)=>(_param)=>/* @__PURE__ */ {
304
+ }, g = (e)=>(_param)=>/* @__PURE__ */ {
293
305
  var { to: r , innerRef: o , children: t } = _param, n = _object_without_properties(_param, [
294
306
  "to",
295
307
  "innerRef",
@@ -312,7 +324,7 @@ const l = {
312
324
  case "Next12":
313
325
  return p(e.Component);
314
326
  case "Next13":
315
- return v(e.Component);
327
+ return g(e.Component);
316
328
  default:
317
329
  const r = e.type;
318
330
  throw new Error(`Invalid Link type: ${r}`);
package/dist/touchable.js CHANGED
@@ -137,13 +137,14 @@ const L = function(e) {
137
137
  style: e.style,
138
138
  role: e.role,
139
139
  "aria-checked": e["aria-checked"],
140
+ "aria-disabled": e.disabled ? !0 : void 0,
140
141
  "aria-controls": e["aria-controls"],
141
142
  "aria-expanded": e["aria-expanded"],
142
143
  "aria-hidden": e["aria-hidden"],
143
144
  "aria-selected": e["aria-selected"],
144
145
  "aria-live": e["aria-live"],
145
146
  tabIndex: e.tabIndex
146
- }, (0, _dom.getPrefixedDataAttributes)(e.dataAttributes, "Touchable")), u = e.type ? e.type : "button", r = !!e.href && !!e.newTab, m = !r && !!e.href && !!e.loadOnTop, s = (a)=>{
147
+ }, (0, _dom.getPrefixedDataAttributes)(e.dataAttributes, "Touchable")), u = e.type ? e.type : "button", r = !!e.href && !!e.newTab, m = !r && !!e.href && !!e.loadOnTop, b = (a)=>{
147
148
  e.stopPropagation && a.stopPropagation();
148
149
  }, h = (a)=>{
149
150
  e.onPress && e.onPress(a);
@@ -152,15 +153,15 @@ const L = function(e) {
152
153
  f.current = !1, a();
153
154
  }));
154
155
  }, x = (a)=>{
155
- if (s(a), !i.length) {
156
+ if (b(a), !i.length) {
156
157
  h(a);
157
158
  return;
158
159
  }
159
160
  g(()=>h(a));
160
161
  }, R = (a)=>{
161
- s(a), i.length && (a.preventDefault(), g(()=>L(k(), r, m)));
162
+ b(a), i.length && (a.preventDefault(), g(()=>L(k(), r, m)));
162
163
  }, D = (a)=>{
163
- s(a), y();
164
+ b(a), y();
164
165
  }, w = (a)=>{
165
166
  (a.keyCode === _keycodes.ENTER || a.keyCode === _keycodes.SPACE) && (a.preventDefault(), a.currentTarget.click());
166
167
  };
package/dist/video.js CHANGED
@@ -137,8 +137,8 @@ const q = {
137
137
  "aspectRatio",
138
138
  "dataAttributes"
139
139
  ]);
140
- const [a, l] = _react.useReducer(D, "loading"), s = _react.useRef(null), C = _react.useRef(), f = _react.useRef(null), w = (0, _image.useMediaBorderRadius)(), g = typeof c == "number" ? c : K[c], v = _react.useCallback(()=>{
141
- a === "loading" && (l("fail"), h == null || h());
140
+ const [a, d] = _react.useReducer(D, "loading"), s = _react.useRef(null), C = _react.useRef(), f = _react.useRef(null), w = (0, _image.useMediaBorderRadius)(), g = typeof c == "number" ? c : K[c], v = _react.useCallback(()=>{
141
+ a === "loading" && (d("fail"), h == null || h());
142
142
  }, [
143
143
  h,
144
144
  a
@@ -146,9 +146,8 @@ const q = {
146
146
  _react.useEffect(()=>{
147
147
  var e;
148
148
  if (C.current !== r) {
149
- C.current = r;
150
- const t = setTimeout(v, T);
151
- return l("reset"), (e = s.current) == null || e.load(), ()=>{
149
+ let t;
150
+ return C.current = r, d("reset"), r ? (t = setTimeout(v, T), (e = s.current) == null || e.load()) : d("fail"), ()=>{
152
151
  clearTimeout(t);
153
152
  };
154
153
  }
@@ -160,7 +159,7 @@ const q = {
160
159
  const I = ()=>{
161
160
  y == null || y();
162
161
  const e = s.current, t = p && !(0, _platform.isRunningAcceptanceTest)();
163
- l("finishLoad"), e && t && e.paused && e.play();
162
+ d("finishLoad"), e && t && e.paused && e.play();
164
163
  }, U = (Array.isArray(r) ? r : [
165
164
  r
166
165
  ]).map((e)=>typeof e == "string" ? {
@@ -176,11 +175,11 @@ const q = {
176
175
  preload: k,
177
176
  onError: v,
178
177
  onPause: ()=>{
179
- R == null || R(), l("pause");
178
+ R == null || R(), d("pause");
180
179
  },
181
180
  onTimeUpdate: ()=>{
182
181
  var e;
183
- a !== "playing" && ((e = s.current) == null ? void 0 : e.currentTime) !== 0 && (b == null || b(), l("play"));
182
+ a !== "playing" && ((e = s.current) == null ? void 0 : e.currentTime) !== 0 && (b == null || b(), d("play"));
184
183
  },
185
184
  onCanPlay: ()=>{
186
185
  p === "streaming" && I();
@@ -255,7 +254,7 @@ const q = {
255
254
  var i;
256
255
  (i = f.current) != null && i.style && (f.current.style.width = "100%", f.current.style.height = "100%"), setTimeout(()=>{
257
256
  var S;
258
- l("reset"), (S = s.current) == null || S.load();
257
+ d("reset"), (S = s.current) == null || S.load();
259
258
  }, 100);
260
259
  }, t.setCurrentTime = (i)=>{
261
260
  s.current && (s.current.currentTime = i);
@@ -0,0 +1,9 @@
1
+ import "./sprinkles.css.ts.vanilla.css-mistica.js";
2
+ import "./accordion.css.ts.vanilla.css-mistica.js";
3
+ var e = "_8s3szx3", v = "_1y2v1nf5z _1y2v1nf78 _1y2v1nf8h _1y2v1nf9q _1y2v1nfbt _1y2v1nfdo _1y2v1nf5y _1y2v1nfb8 _1y2v1nfca", a = "_8s3szx9", r = "_8s3szx4", t = {
4
+ enter: "_8s3szx5",
5
+ enterActive: "_8s3szx6",
6
+ exit: "_8s3szx7",
7
+ exitActive: "_8s3szx8"
8
+ }, _ = "_8s3szx1", o = "_8s3szx2";
9
+ export { e as chevronContainer, v as itemContent, a as panel, r as panelContainer, t as panelTransitionClasses, _ as touchableBackground, o as touchableBackgroundInverse };
@@ -0,0 +1,2 @@
1
+ const a = "";
2
+ export { a as default };
@@ -0,0 +1,280 @@
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
+ function _object_without_properties(source, excluded) {
54
+ if (source == null) return {};
55
+ var target = _object_without_properties_loose(source, excluded);
56
+ var key, i;
57
+ if (Object.getOwnPropertySymbols) {
58
+ var sourceSymbolKeys = Object.getOwnPropertySymbols(source);
59
+ for(i = 0; i < sourceSymbolKeys.length; i++){
60
+ key = sourceSymbolKeys[i];
61
+ if (excluded.indexOf(key) >= 0) continue;
62
+ if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue;
63
+ target[key] = source[key];
64
+ }
65
+ }
66
+ return target;
67
+ }
68
+ function _object_without_properties_loose(source, excluded) {
69
+ if (source == null) return {};
70
+ var target = {};
71
+ var sourceKeys = Object.keys(source);
72
+ var key, i;
73
+ for(i = 0; i < sourceKeys.length; i++){
74
+ key = sourceKeys[i];
75
+ if (excluded.indexOf(key) >= 0) continue;
76
+ target[key] = source[key];
77
+ }
78
+ return target;
79
+ }
80
+ import { jsxs as g, jsx as t } from "react/jsx-runtime";
81
+ import * as c from "react";
82
+ import { Content as N } from "./list.js";
83
+ import S from "./icons/icon-chevron.js";
84
+ import h from "./box.js";
85
+ import { itemContent as y, touchableBackgroundInverse as O, touchableBackground as T, chevronContainer as D, panelTransitionClasses as w, panelContainer as E, panel as P } from "./accordion.css-mistica.js";
86
+ import L from "./stack.js";
87
+ import { BaseTouchable as _ } from "./touchable.js";
88
+ import k from "classnames";
89
+ import { vars as A } from "./skins/skin-contract.css-mistica.js";
90
+ import { getPrefixedDataAttributes as C } from "./utils/dom.js";
91
+ import V from "./divider.js";
92
+ import { Boxed as X } from "./boxed.js";
93
+ import { useIsInverseVariant as j } from "./theme-variant-context.js";
94
+ import { useAriaId as v } from "./hooks.js";
95
+ import { CSSTransition as M } from "react-transition-group";
96
+ const q = 400, x = /*#__PURE__*/ c.createContext({
97
+ index: [],
98
+ toogle: ()=>{}
99
+ }), z = ()=>c.useContext(x), B = (param)=>{
100
+ let { value: o , defaultValue: r , onChange: n , singleOpen: d } = param;
101
+ const m = o !== void 0, a = (e)=>e === void 0 ? [] : typeof e == "number" ? [
102
+ e
103
+ ] : e, [i, l] = c.useState(a(r));
104
+ c.useEffect(()=>l(a(r)), [
105
+ r
106
+ ]), c.useEffect(()=>{
107
+ i.length > 1 && d && (i.splice(1), l([
108
+ ...i
109
+ ]));
110
+ }, [
111
+ d,
112
+ i
113
+ ]);
114
+ const p = (e, s)=>{
115
+ if (!s) return [
116
+ e
117
+ ];
118
+ const u = s.indexOf(e);
119
+ return u === -1 ? d ? s = [
120
+ e
121
+ ] : s.push(e) : s.splice(u, 1), [
122
+ ...s
123
+ ];
124
+ }, f = (e)=>{
125
+ if (m || l(p(e, i)), n) {
126
+ const s = (m ? a(o) : i).includes(e);
127
+ n(e, !s);
128
+ }
129
+ };
130
+ return m ? [
131
+ a(o),
132
+ f
133
+ ] : [
134
+ i,
135
+ f
136
+ ];
137
+ }, F = (o)=>{
138
+ const r = o == null ? void 0 : o.closest("[data-accordion]");
139
+ if (r) return Array.from(r.querySelectorAll("[data-accordion-item]")).filter((n)=>n.closest("[data-accordion]") === r).findIndex((n)=>n === o);
140
+ }, R = /*#__PURE__*/ c.forwardRef((_param, m)=>{
141
+ var { content: o , dataAttributes: r , trackingEvent: n } = _param, d = _object_without_properties(_param, [
142
+ "content",
143
+ "dataAttributes",
144
+ "trackingEvent"
145
+ ]);
146
+ const a = c.useRef(null), i = c.useRef(null), { index: l , toogle: p } = z(), f = j(), e = v(), s = v(), [u, b] = c.useState(), I = u !== void 0 && (l == null ? void 0 : l.includes(u));
147
+ return c.useEffect(()=>{
148
+ b(F(i.current));
149
+ }, []), /* @__PURE__ */ g("div", _object_spread_props(_object_spread({
150
+ ref: i
151
+ }, C(_object_spread_props(_object_spread({}, r), {
152
+ "accordion-item": !0
153
+ }))), {
154
+ children: [
155
+ /* @__PURE__ */ t(_, {
156
+ ref: m,
157
+ className: k(y, f ? O : T),
158
+ onPress: ()=>{
159
+ u !== void 0 && p(u);
160
+ },
161
+ trackingEvent: n,
162
+ "aria-expanded": I,
163
+ "aria-controls": s,
164
+ children: /* @__PURE__ */ t(h, {
165
+ paddingX: 16,
166
+ children: /* @__PURE__ */ t(N, _object_spread_props(_object_spread({
167
+ labelId: e,
168
+ type: "custom"
169
+ }, d), {
170
+ right: /* @__PURE__ */ t("div", {
171
+ className: D,
172
+ children: /* @__PURE__ */ t(S, {
173
+ size: 24,
174
+ transitionDuration: 400,
175
+ direction: I ? "up" : "down",
176
+ color: f ? A.colors.inverse : I ? A.colors.neutralHigh : A.colors.neutralMedium
177
+ })
178
+ })
179
+ }))
180
+ })
181
+ }),
182
+ /* @__PURE__ */ t(M, {
183
+ in: I,
184
+ timeout: q,
185
+ nodeRef: a,
186
+ classNames: w,
187
+ mountOnEnter: !0,
188
+ unmountOnExit: !0,
189
+ children: /* @__PURE__ */ t("div", {
190
+ className: E,
191
+ ref: a,
192
+ children: /* @__PURE__ */ t("div", {
193
+ className: P,
194
+ role: "region",
195
+ "aria-labelledby": e,
196
+ id: s,
197
+ children: /* @__PURE__ */ t(h, {
198
+ paddingX: 16,
199
+ paddingBottom: 16,
200
+ children: o
201
+ })
202
+ })
203
+ })
204
+ })
205
+ ]
206
+ }));
207
+ }), co = /*#__PURE__*/ c.forwardRef((_param, n)=>/* @__PURE__ */ {
208
+ var { dataAttributes: o } = _param, r = _object_without_properties(_param, [
209
+ "dataAttributes"
210
+ ]);
211
+ return t(R, _object_spread_props(_object_spread({}, r), {
212
+ ref: n,
213
+ dataAttributes: _object_spread({
214
+ "component-name": "AccordionItem"
215
+ }, o)
216
+ }));
217
+ }), io = (param)=>{
218
+ let { children: o , dataAttributes: r , noLastDivider: n , index: d , defaultIndex: m , onChange: a , singleOpen: i } = param;
219
+ const [l, p] = B({
220
+ value: d,
221
+ defaultValue: m,
222
+ onChange: a,
223
+ singleOpen: i
224
+ }), f = c.Children.count(o) - 1, e = !n;
225
+ return /* @__PURE__ */ t(x.Provider, {
226
+ value: {
227
+ index: l,
228
+ toogle: p
229
+ },
230
+ children: /* @__PURE__ */ t("div", _object_spread_props(_object_spread({}, C(_object_spread_props(_object_spread({}, r), {
231
+ accordion: !0
232
+ }), "Accordion")), {
233
+ children: c.Children.toArray(o).filter(Boolean).map((s, u)=>/* @__PURE__ */ g(c.Fragment, {
234
+ children: [
235
+ s,
236
+ (u < f || e) && /* @__PURE__ */ t(h, {
237
+ paddingX: 16,
238
+ children: /* @__PURE__ */ t(V, {})
239
+ })
240
+ ]
241
+ }, u))
242
+ }))
243
+ });
244
+ }, so = /*#__PURE__*/ c.forwardRef((_param, d)=>/* @__PURE__ */ {
245
+ var { dataAttributes: o , isInverse: r } = _param, n = _object_without_properties(_param, [
246
+ "dataAttributes",
247
+ "isInverse"
248
+ ]);
249
+ return t(X, {
250
+ isInverse: r,
251
+ ref: d,
252
+ dataAttributes: _object_spread({
253
+ "component-name": "BoxedAccordionItem"
254
+ }, o),
255
+ children: /* @__PURE__ */ t(R, _object_spread({}, n))
256
+ });
257
+ }), ao = (param)=>{
258
+ let { children: o , dataAttributes: r , index: n , defaultIndex: d , onChange: m , singleOpen: a } = param;
259
+ const [i, l] = B({
260
+ value: n,
261
+ defaultValue: d,
262
+ onChange: m,
263
+ singleOpen: a
264
+ });
265
+ return /* @__PURE__ */ t(x.Provider, {
266
+ value: {
267
+ index: i,
268
+ toogle: l
269
+ },
270
+ children: /* @__PURE__ */ t(L, {
271
+ space: 16,
272
+ dataAttributes: _object_spread({
273
+ "component-name": "BoxedAccordion",
274
+ accordion: !0
275
+ }, r),
276
+ children: o
277
+ })
278
+ });
279
+ };
280
+ export { io as Accordion, co as AccordionItem, ao as BoxedAccordion, so as BoxedAccordionItem, z as useAccordionContext };