@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
package/dist/index.js CHANGED
@@ -9,6 +9,12 @@ function _export(target, all) {
9
9
  });
10
10
  }
11
11
  _export(exports, {
12
+ Accordion: function() {
13
+ return _accordion.Accordion;
14
+ },
15
+ AccordionItem: function() {
16
+ return _accordion.AccordionItem;
17
+ },
12
18
  ActionsListSheet: function() {
13
19
  return _sheet.ActionsListSheet;
14
20
  },
@@ -33,6 +39,12 @@ _export(exports, {
33
39
  Boxed: function() {
34
40
  return _boxed.Boxed;
35
41
  },
42
+ BoxedAccordion: function() {
43
+ return _accordion.BoxedAccordion;
44
+ },
45
+ BoxedAccordionItem: function() {
46
+ return _accordion.BoxedAccordionItem;
47
+ },
36
48
  BoxedRow: function() {
37
49
  return _list.BoxedRow;
38
50
  },
@@ -5221,7 +5233,13 @@ _export(exports, {
5221
5233
  return _card.MediaCard;
5222
5234
  },
5223
5235
  Menu: function() {
5224
- return _menu.default;
5236
+ return _menu.Menu;
5237
+ },
5238
+ MenuItem: function() {
5239
+ return _menu.MenuItem;
5240
+ },
5241
+ MenuSection: function() {
5242
+ return _menu.MenuSection;
5225
5243
  },
5226
5244
  MonthField: function() {
5227
5245
  return _monthfield.default;
@@ -5277,6 +5295,9 @@ _export(exports, {
5277
5295
  PhoneNumberField: function() {
5278
5296
  return _phonenumberfield.default;
5279
5297
  },
5298
+ PinField: function() {
5299
+ return _pinfield.default;
5300
+ },
5280
5301
  Placeholder: function() {
5281
5302
  return _placeholder.Placeholder;
5282
5303
  },
@@ -5290,7 +5311,10 @@ _export(exports, {
5290
5311
  return _card.PosterCard;
5291
5312
  },
5292
5313
  ProgressBar: function() {
5293
- return _progressbar.default;
5314
+ return _progressbar.ProgressBar;
5315
+ },
5316
+ ProgressBarStepped: function() {
5317
+ return _progressbar.ProgressBarStepped;
5294
5318
  },
5295
5319
  RadioButton: function() {
5296
5320
  return _radiobutton.default;
@@ -5606,6 +5630,7 @@ const _screenreaderonly = /*#__PURE__*/ _interop_require_default(require("./scre
5606
5630
  const _touchable = /*#__PURE__*/ _interop_require_default(require("./touchable.js"));
5607
5631
  const _spinner = /*#__PURE__*/ _interop_require_default(require("./spinner.js"));
5608
5632
  const _fadein = /*#__PURE__*/ _interop_require_default(require("./fade-in.js"));
5633
+ const _accordion = require("./accordion.js");
5609
5634
  const _button = require("./button.js");
5610
5635
  const _buttonlayout = /*#__PURE__*/ _interop_require_default(require("./button-layout.js"));
5611
5636
  const _fixedfooterlayout = /*#__PURE__*/ _interop_require_default(require("./fixed-footer-layout.js"));
@@ -5647,11 +5672,11 @@ const _inline = /*#__PURE__*/ _interop_require_default(require("./inline.js"));
5647
5672
  const _horizontalscroll = /*#__PURE__*/ _interop_require_default(require("./horizontal-scroll.js"));
5648
5673
  const _highlightedcard = /*#__PURE__*/ _interop_require_default(require("./highlighted-card.js"));
5649
5674
  const _stepper = /*#__PURE__*/ _interop_require_default(require("./stepper.js"));
5650
- const _progressbar = /*#__PURE__*/ _interop_require_default(require("./progress-bar.js"));
5675
+ const _progressbar = require("./progress-bar.js");
5651
5676
  const _card = require("./card.js");
5652
5677
  const _hero = /*#__PURE__*/ _interop_require_default(require("./hero.js"));
5653
5678
  const _divider = /*#__PURE__*/ _interop_require_default(require("./divider.js"));
5654
- const _menu = /*#__PURE__*/ _interop_require_default(require("./menu.js"));
5679
+ const _menu = require("./menu.js");
5655
5680
  const _emptystate = /*#__PURE__*/ _interop_require_default(require("./empty-state.js"));
5656
5681
  const _emptystatecard = /*#__PURE__*/ _interop_require_default(require("./empty-state-card.js"));
5657
5682
  const _callout = /*#__PURE__*/ _interop_require_default(require("./callout.js"));
@@ -5671,6 +5696,7 @@ const _stackinggroup = /*#__PURE__*/ _interop_require_default(require("./stackin
5671
5696
  const _form = /*#__PURE__*/ _interop_require_default(require("./form.js"));
5672
5697
  const _select = /*#__PURE__*/ _interop_require_default(require("./select.js"));
5673
5698
  const _textfield = /*#__PURE__*/ _interop_require_default(require("./text-field.js"));
5699
+ const _pinfield = /*#__PURE__*/ _interop_require_default(require("./pin-field.js"));
5674
5700
  const _textfieldbase = require("./text-field-base.js");
5675
5701
  const _searchfield = /*#__PURE__*/ _interop_require_default(require("./search-field.js"));
5676
5702
  const _emailfield = /*#__PURE__*/ _interop_require_default(require("./email-field.js"));
@@ -1,6 +1,10 @@
1
1
  import * as React from 'react';
2
2
  import type { CommonFormFieldProps } from './text-field-base';
3
- export declare const IntegerInput: React.FC<any>;
3
+ type IntegerInputProps = Omit<React.InputHTMLAttributes<HTMLInputElement>, 'inputMode' | 'pattern' | 'onInput' | 'type'> & {
4
+ inputRef: React.ForwardedRef<HTMLInputElement>;
5
+ type?: 'text' | 'password';
6
+ };
7
+ export declare const IntegerInput: ({ inputRef, value, defaultValue, type, ...rest }: IntegerInputProps) => React.ReactElement;
4
8
  export interface IntegerFieldProps extends CommonFormFieldProps {
5
9
  onChangeValue?: (value: string, rawValue: string) => void;
6
10
  }
@@ -100,25 +100,26 @@ function _object_without_properties_loose(source, excluded) {
100
100
  return target;
101
101
  }
102
102
  const T = (_param)=>{
103
- var { inputRef: u , value: r , defaultValue: n } = _param, i = _object_without_properties(_param, [
103
+ var { inputRef: u , value: r , defaultValue: n , type: i = "text" } = _param, o = _object_without_properties(_param, [
104
104
  "inputRef",
105
105
  "value",
106
- "defaultValue"
106
+ "defaultValue",
107
+ "type"
107
108
  ]);
108
109
  const t = (e)=>String(e !== null && e !== void 0 ? e : "").replace(/[^\d]/g, "");
109
- return /* @__PURE__ */ (0, _jsxruntime.jsx)("input", _object_spread_props(_object_spread({}, i), {
110
+ return /* @__PURE__ */ (0, _jsxruntime.jsx)("input", _object_spread_props(_object_spread({}, o), {
110
111
  inputMode: "numeric",
111
112
  pattern: "[0-9]*",
112
113
  onInput: (e)=>{
113
114
  e.currentTarget.value = t(e.currentTarget.value);
114
115
  },
115
116
  ref: u,
116
- type: "text",
117
+ type: i,
117
118
  value: r === void 0 ? void 0 : t(r),
118
119
  defaultValue: n === void 0 ? void 0 : t(n)
119
120
  }));
120
121
  }, h = (_param)=>{
121
- var { disabled: u , error: r , helperText: n , name: i , optional: t , validate: o , onChange: e , onChangeValue: d , onBlur: p , value: m , defaultValue: a } = _param, l = _object_without_properties(_param, [
122
+ var { disabled: u , error: r , helperText: n , name: i , optional: o , validate: t , onChange: c , onChangeValue: e , onBlur: m , value: p , defaultValue: a } = _param, l = _object_without_properties(_param, [
122
123
  "disabled",
123
124
  "error",
124
125
  "helperText",
@@ -133,17 +134,17 @@ const T = (_param)=>{
133
134
  ]);
134
135
  const { texts: f } = (0, _hooks.useTheme)(), g = (0, _formcontext.useFieldProps)({
135
136
  name: i,
136
- value: m,
137
+ value: p,
137
138
  defaultValue: a,
138
139
  processValue: (s)=>s.trim(),
139
140
  helperText: n,
140
- optional: t,
141
+ optional: o,
141
142
  error: r,
142
143
  disabled: u,
143
- onBlur: p,
144
- validate: (s, I)=>s ? o == null ? void 0 : o(s, I) : t ? "" : f.formFieldErrorIsMandatory,
145
- onChange: e,
146
- onChangeValue: d
144
+ onBlur: m,
145
+ validate: (s, I)=>s ? t == null ? void 0 : t(s, I) : o ? "" : f.formFieldErrorIsMandatory,
146
+ onChange: c,
147
+ onChangeValue: e
147
148
  });
148
149
  return /* @__PURE__ */ (0, _jsxruntime.jsx)(_textfieldbase.TextFieldBaseAutosuggest, _object_spread_props(_object_spread({}, l, g), {
149
150
  inputComponent: T
package/dist/list.d.ts CHANGED
@@ -23,6 +23,14 @@ interface CommonProps {
23
23
  type Right = (({ centerY }: {
24
24
  centerY: boolean;
25
25
  }) => React.ReactNode) | React.ReactNode;
26
+ interface ContentProps extends CommonProps {
27
+ isClickable?: boolean;
28
+ type?: 'chevron' | 'basic' | 'custom' | 'control';
29
+ right?: Right;
30
+ /** This id is to link the title with the related control */
31
+ labelId?: string;
32
+ }
33
+ export declare const Content: React.FC<ContentProps>;
26
34
  type ControlProps = {
27
35
  name?: string;
28
36
  value?: boolean;
package/dist/list.js CHANGED
@@ -15,6 +15,9 @@ _export(exports, {
15
15
  BoxedRowList: function() {
16
16
  return Je;
17
17
  },
18
+ Content: function() {
19
+ return ye;
20
+ },
18
21
  Row: function() {
19
22
  return qe;
20
23
  },
@@ -9,26 +9,50 @@ function _export(target, all) {
9
9
  });
10
10
  }
11
11
  _export(exports, {
12
- hideItems: function() {
12
+ iconContainer: function() {
13
13
  return r;
14
14
  },
15
+ itemContent: function() {
16
+ return n;
17
+ },
15
18
  menuContainer: function() {
19
+ return v;
20
+ },
21
+ menuItem: function() {
22
+ return t;
23
+ },
24
+ menuItemDisabled: function() {
16
25
  return _;
17
26
  },
18
- showItems: function() {
27
+ menuItemEnabled: function() {
19
28
  return a;
20
29
  },
30
+ menuItemHovered: function() {
31
+ return u;
32
+ },
33
+ menuSectionDivider: function() {
34
+ return i;
35
+ },
36
+ menuTransitionClasses: function() {
37
+ return m;
38
+ },
21
39
  vars: function() {
22
- return n;
40
+ return o;
23
41
  }
24
42
  });
25
43
  require("./sprinkles.css.ts.vanilla.css-mistica.js");
26
44
  require("./menu.css.ts.vanilla.css-mistica.js");
27
- var r = "_2k0k3u9", _ = "_2k0k3u7 _1y2v1nf5z _1y2v1nf78 _1y2v1nf8h _1y2v1nf9q _1y2v1nf31 _1y2v1nfdx _1y2v1nfb6 _1y2v1nfbc _1y2v1nfb1", a = "_2k0k3u8", n = {
45
+ var r = "_2k0k3uj", n = "_2k0k3ui", v = "_2k0k3u8 _1y2v1nf68 _1y2v1nf7h _1y2v1nf8q _1y2v1nf9z _1y2v1nf31 _1y2v1nfdz _1y2v1nfb6 _1y2v1nfbc _1y2v1nfb1", t = "_2k0k3ud", _ = "_2k0k3ug", a = "_2k0k3uf", u = "_2k0k3ue", i = "_2k0k3uh", m = {
46
+ enter: "_2k0k3u9",
47
+ enterActive: "_2k0k3ua",
48
+ exit: "_2k0k3ub",
49
+ exitActive: "_2k0k3uc"
50
+ }, o = {
28
51
  top: "var(--_2k0k3u0)",
29
52
  bottom: "var(--_2k0k3u1)",
30
53
  left: "var(--_2k0k3u2)",
54
+ right: "var(--_2k0k3u4)",
31
55
  width: "var(--_2k0k3u3)",
32
- maxHeight: "var(--_2k0k3u4)",
33
- transformOrigin: "var(--_2k0k3u5)"
56
+ maxHeight: "var(--_2k0k3u5)",
57
+ transformOrigin: "var(--_2k0k3u6)"
34
58
  };
@@ -2,10 +2,22 @@ export declare const vars: {
2
2
  top: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
3
3
  bottom: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4
4
  left: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
5
+ right: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
5
6
  width: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
6
7
  maxHeight: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
7
8
  transformOrigin: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
8
9
  };
9
10
  export declare const menuContainer: string;
10
- export declare const showItems: string;
11
- export declare const hideItems: string;
11
+ export declare const menuTransitionClasses: {
12
+ enter: string;
13
+ enterActive: string;
14
+ exit: string;
15
+ exitActive: string;
16
+ };
17
+ export declare const menuItem: string;
18
+ export declare const menuItemHovered: string;
19
+ export declare const menuItemEnabled: string;
20
+ export declare const menuItemDisabled: string;
21
+ export declare const menuSectionDivider: string;
22
+ export declare const itemContent: string;
23
+ export declare const iconContainer: string;
package/dist/menu.d.ts CHANGED
@@ -1,5 +1,27 @@
1
1
  import * as React from 'react';
2
- import type { DataAttributes } from './utils/types';
2
+ import type { ExclusifyUnion } from './utils/utility-types';
3
+ import type { DataAttributes, IconProps } from './utils/types';
4
+ interface MenuItemBaseProps {
5
+ label: string;
6
+ Icon?: React.FC<IconProps>;
7
+ destructive?: boolean;
8
+ disabled?: boolean;
9
+ onPress: (item: number) => void;
10
+ }
11
+ interface MenuItemWithoutControlProps extends MenuItemBaseProps {
12
+ controlType?: undefined;
13
+ checked?: undefined;
14
+ }
15
+ interface MenuItemWithControlProps extends MenuItemBaseProps {
16
+ controlType?: 'checkbox';
17
+ checked?: boolean;
18
+ }
19
+ type MenuItemProps = ExclusifyUnion<MenuItemWithControlProps | MenuItemWithoutControlProps>;
20
+ export declare const MenuItem: React.FC<MenuItemProps>;
21
+ type MenuSectionProps = {
22
+ children?: React.ReactNode;
23
+ };
24
+ export declare const MenuSection: React.FC<MenuSectionProps>;
3
25
  type MenuRenderProps = {
4
26
  ref: (element: HTMLElement | null) => void;
5
27
  className: string;
@@ -18,5 +40,5 @@ export type MenuProps = {
18
40
  position?: 'left' | 'right';
19
41
  dataAttributes?: DataAttributes;
20
42
  };
21
- declare const Menu: React.FC<MenuProps>;
22
- export default Menu;
43
+ export declare const Menu: React.FC<MenuProps>;
44
+ export {};