@midas-ds/components 1.0.2 → 1.0.3

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 (125) hide show
  1. package/Button-B4vMZbC6.js +182 -0
  2. package/CHANGELOG.md +10 -0
  3. package/Checkbox-DnKWanep.js +402 -0
  4. package/{Collection-B3xUVWPF.js → Collection-COLWgm24.js} +179 -152
  5. package/Dialog-Cb6toyXO.js +1951 -0
  6. package/DragAndDrop-B0T3WgjL.js +40 -0
  7. package/FocusScope-C8i7CH6y.js +513 -0
  8. package/Form-BQQs3jUk.js +238 -0
  9. package/Group-CdwXhx8Q.js +42 -0
  10. package/{Hidden-BQWDvze4.js → Hidden-DngIphiL.js} +1 -1
  11. package/Link-iAZLB3RI.js +75 -0
  12. package/ListBox-BKWkIIm6.js +474 -0
  13. package/ListKeyboardDelegate-BH-K5hyq.js +172 -0
  14. package/{PressResponder-DP8ZDNGy.js → PressResponder-Cz-TRBHO.js} +10 -10
  15. package/README.md +21 -3
  16. package/SelectionManager-8o40f7mx.js +1047 -0
  17. package/Separator-BlvmQjwz.js +49 -0
  18. package/Tag--W5TgxmK.js +728 -0
  19. package/Text-CQPW6xs7.js +15 -0
  20. package/TextField-DeK_yiK-.js +225 -0
  21. package/TextField.module-0-u4LVPp.js +143 -0
  22. package/{VisuallyHidden-B_XzVvlX.js → VisuallyHidden-CFx06Bae.js} +1 -1
  23. package/{context-ScOIq_Gu.js → context-Bnqknrce.js} +1 -1
  24. package/index-B-jHjTDC.js +120 -0
  25. package/{index-CorR1LBD.js → index-BPdc9gJ8.js} +3 -3
  26. package/index-DK9ZACEc.js +642 -0
  27. package/{index-Dl1Q-tbj.js → index-KSgQWWiy.js} +5315 -5315
  28. package/index.js +45 -47
  29. package/index15.js +1 -1
  30. package/index16.js +1 -1
  31. package/index25.js +1 -1
  32. package/index26.js +1 -1
  33. package/index3.js +2 -4
  34. package/index31.js +3 -3
  35. package/index32.js +2 -2
  36. package/index33.js +2 -2
  37. package/index34.js +1 -1
  38. package/index35.js +1 -1
  39. package/index36.js +1 -1
  40. package/index37.js +1 -1
  41. package/index38.js +1 -1
  42. package/index39.js +1 -1
  43. package/index40.js +1 -1
  44. package/index41.js +1 -1
  45. package/index42.js +1 -1
  46. package/index43.js +1 -1
  47. package/index45.js +3 -3
  48. package/index5.js +1 -1
  49. package/index50.js +1 -1
  50. package/index52.js +3 -3
  51. package/index53.js +3 -3
  52. package/index54.js +1 -1
  53. package/index55.js +4 -4
  54. package/index56.js +1 -1
  55. package/index57.js +1 -1
  56. package/index58.js +1 -1
  57. package/index59.js +3 -3
  58. package/index60.js +1 -1
  59. package/index61.js +1 -1
  60. package/index62.js +1 -1
  61. package/index63.js +4 -4
  62. package/index64.js +3 -3
  63. package/index65.js +3 -3
  64. package/index66.js +1 -1
  65. package/index67.js +3 -3
  66. package/index68.js +2 -2
  67. package/index69.js +1 -1
  68. package/index71.js +1 -1
  69. package/index76.js +5 -5
  70. package/index77.js +2 -2
  71. package/index78.js +2 -2
  72. package/index79.js +1 -1
  73. package/index80.js +226 -227
  74. package/index81.js +197 -199
  75. package/index82.js +192 -195
  76. package/index83.js +181 -183
  77. package/index84.js +52 -54
  78. package/index85.js +261 -262
  79. package/index86.js +262 -262
  80. package/index87.js +209 -211
  81. package/index88.js +436 -440
  82. package/index89.js +962 -964
  83. package/index90.js +2401 -2399
  84. package/index92.js +5 -5
  85. package/index93.js +1 -1
  86. package/index94.js +1 -1
  87. package/link/Link.d.ts +2 -2
  88. package/link-button/LinkButton.d.ts +1 -1
  89. package/package.json +7 -1
  90. package/{react.esm-D8HpDGKP.js → react.esm-sMU8Z7rL.js} +1872 -1872
  91. package/textfield/index.d.ts +0 -2
  92. package/{useControlledState-S_TYcV_c.js → useControlledState-DrAoodI6.js} +1 -1
  93. package/{useDescription-D4_zk_sA.js → useDescription-BPs7eRff.js} +1 -1
  94. package/useField-Dz62UHCP.js +67 -0
  95. package/{useFilter-BnJDBCkt.js → useFilter-ViwzkzZe.js} +1 -1
  96. package/useFocusRing-BKGhL91C.js +1297 -0
  97. package/{useFocusable-C-N9wcwm.js → useFocusable-CRSmYEQc.js} +11 -8
  98. package/{useGridSelectionCheckbox-i1rsjlC-.js → useGridSelectionCheckbox-CVEvUCJL.js} +3 -3
  99. package/useHasTabbableChild-C8y4fwiY.js +34 -0
  100. package/{useHighlightSelectionDescription-JVx2MW_e.js → useHighlightSelectionDescription-CD74uzLh.js} +19 -19
  101. package/useListState-DKnP5TB5.js +119 -0
  102. package/{useLocalizedStringFormatter-DVCAZqcL.js → useLocalizedStringFormatter-DsZ-ZWSk.js} +29 -29
  103. package/{useSingleSelectListState-CmX9_L5H.js → useSingleSelectListState-BHTLh8Ob.js} +5 -5
  104. package/Button-CCevm2s3.js +0 -183
  105. package/Checkbox-CllWDBxF.js +0 -405
  106. package/Dialog-CLTyYwkS.js +0 -1889
  107. package/DragAndDrop-OTN7La7U.js +0 -42
  108. package/FocusScope-BR0SJ-cZ.js +0 -512
  109. package/Form-DXLoQL91.js +0 -240
  110. package/Group-DPMuN3h8.js +0 -44
  111. package/Label-C18A_4Z5.js +0 -69
  112. package/Link-BU1h3K2a.js +0 -77
  113. package/ListBox-D21tdwTs.js +0 -463
  114. package/ListKeyboardDelegate-DxMjfMsI.js +0 -172
  115. package/SelectionManager-D4WtKtey.js +0 -988
  116. package/Separator-DLUHK9vv.js +0 -48
  117. package/Tag-CEd6WWSc.js +0 -725
  118. package/Text-DGLaY3HR.js +0 -17
  119. package/TextField-C_hq9WeT.js +0 -226
  120. package/TextField.module-Cwq1FAm7.js +0 -141
  121. package/index-CEg5vZQH.js +0 -132
  122. package/index-CgfokhRq.js +0 -674
  123. package/useFocusRing-D97-G3fT.js +0 -1324
  124. package/useHasTabbableChild-DeuCnGGv.js +0 -34
  125. package/useListState-DSOTbsL3.js +0 -119
@@ -1,405 +0,0 @@
1
- import { jsx as y, jsxs as J, Fragment as K } from "react/jsx-runtime";
2
- import { c as Q } from "./clsx-OuTLNxxd.js";
3
- import { $ as U } from "./RSPContexts-EOiWkKOf.js";
4
- import { m as D, e as x, n as S, f as X, a as C, u as w, v as Y, d as M, x as Z, i as ee, H as ae, w as _, c as ie, b as de } from "./useFocusRing-D97-G3fT.js";
5
- import { a as le, $ as B, b as ne, f as E, g as te, h as se, c as F, d as re } from "./Form-DXLoQL91.js";
6
- import { $ as oe, a as ce } from "./Label-C18A_4Z5.js";
7
- import { $ as fe } from "./Text-DGLaY3HR.js";
8
- import R, { useEffect as W, useRef as G, forwardRef as N, createContext as H, useContext as ue } from "react";
9
- import { $ as L } from "./useControlledState-S_TYcV_c.js";
10
- import { $ as be } from "./useFocusable-C-N9wcwm.js";
11
- import { a as ve } from "./VisuallyHidden-B_XzVvlX.js";
12
- import './Checkbox.css';function $e(e, a, d) {
13
- let { isDisabled: n = !1, isReadOnly: s = !1, value: t, name: l, children: c, "aria-label": f, "aria-labelledby": i, validationState: r = "valid", isInvalid: o } = e, b = (g) => {
14
- g.stopPropagation(), a.setSelected(g.target.checked);
15
- }, v = c != null, u = f != null || i != null;
16
- !v && !u && console.warn("If you do not provide children, you must specify an aria-label for accessibility");
17
- let { pressProps: h, isPressed: $ } = D({
18
- isDisabled: n
19
- }), { pressProps: m, isPressed: P } = D({
20
- isDisabled: n || s,
21
- onPress() {
22
- a.toggle();
23
- }
24
- }), { focusableProps: I } = be(e, d), p = x(h, I), V = S(e, {
25
- labelable: !0
26
- });
27
- return le(d, a.isSelected, a.setSelected), {
28
- labelProps: x(m, {
29
- onClick: (g) => g.preventDefault()
30
- }),
31
- inputProps: x(V, {
32
- "aria-invalid": o || r === "invalid" || void 0,
33
- "aria-errormessage": e["aria-errormessage"],
34
- "aria-controls": e["aria-controls"],
35
- "aria-readonly": s || void 0,
36
- onChange: b,
37
- disabled: n,
38
- ...t == null ? {} : {
39
- value: t
40
- },
41
- name: l,
42
- type: "checkbox",
43
- ...p
44
- }),
45
- isSelected: a.isSelected,
46
- isPressed: $ || P,
47
- isDisabled: n,
48
- isReadOnly: s,
49
- isInvalid: o || r === "invalid"
50
- };
51
- }
52
- function j(e, a, d) {
53
- let n = B({
54
- ...e,
55
- value: a.isSelected
56
- }), { isInvalid: s, validationErrors: t, validationDetails: l } = n.displayValidation, { labelProps: c, inputProps: f, isSelected: i, isPressed: r, isDisabled: o, isReadOnly: b } = $e({
57
- ...e,
58
- isInvalid: s
59
- }, a, d);
60
- ne(e, n, d);
61
- let { isIndeterminate: v, isRequired: u, validationBehavior: h = "aria" } = e;
62
- W(() => {
63
- d.current && (d.current.indeterminate = !!v);
64
- });
65
- let { pressProps: $ } = D({
66
- isDisabled: o || b,
67
- onPress() {
68
- let { [E]: m } = e, { commitValidation: P } = m || n;
69
- P();
70
- }
71
- });
72
- return {
73
- labelProps: x(c, $),
74
- inputProps: {
75
- ...f,
76
- checked: i,
77
- "aria-required": u && h === "aria" || void 0,
78
- required: u && h === "native"
79
- },
80
- isSelected: i,
81
- isPressed: r,
82
- isDisabled: o,
83
- isReadOnly: b,
84
- isInvalid: s,
85
- validationErrors: t,
86
- validationDetails: l
87
- };
88
- }
89
- const T = /* @__PURE__ */ new WeakMap();
90
- function he(e, a) {
91
- let { isDisabled: d, name: n, validationBehavior: s = "aria" } = e, { isInvalid: t, validationErrors: l, validationDetails: c } = a.displayValidation, { labelProps: f, fieldProps: i, descriptionProps: r, errorMessageProps: o } = oe({
92
- ...e,
93
- // Checkbox group is not an HTML input element so it
94
- // shouldn't be labeled by a <label> element.
95
- labelElementType: "span",
96
- isInvalid: t,
97
- errorMessage: e.errorMessage || l
98
- });
99
- T.set(a, {
100
- name: n,
101
- descriptionId: r.id,
102
- errorMessageId: o.id,
103
- validationBehavior: s
104
- });
105
- let b = S(e, {
106
- labelable: !0
107
- }), { focusWithinProps: v } = X({
108
- onBlurWithin: e.onBlur,
109
- onFocusWithin: e.onFocus,
110
- onFocusWithinChange: e.onFocusChange
111
- });
112
- return {
113
- groupProps: x(b, {
114
- role: "group",
115
- "aria-disabled": d || void 0,
116
- ...i,
117
- ...v
118
- }),
119
- labelProps: f,
120
- descriptionProps: r,
121
- errorMessageProps: o,
122
- isInvalid: t,
123
- validationErrors: l,
124
- validationDetails: c
125
- };
126
- }
127
- function A(e = {}) {
128
- let { isReadOnly: a } = e, [d, n] = L(e.isSelected, e.defaultSelected || !1, e.onChange);
129
- function s(l) {
130
- a || n(l);
131
- }
132
- function t() {
133
- a || n(!d);
134
- }
135
- return {
136
- isSelected: d,
137
- setSelected: s,
138
- toggle: t
139
- };
140
- }
141
- function me(e, a, d) {
142
- const n = A({
143
- isReadOnly: e.isReadOnly || a.isReadOnly,
144
- isSelected: a.isSelected(e.value),
145
- onChange($) {
146
- $ ? a.addValue(e.value) : a.removeValue(e.value), e.onChange && e.onChange($);
147
- }
148
- });
149
- let { name: s, descriptionId: t, errorMessageId: l, validationBehavior: c } = T.get(a);
150
- var f;
151
- c = (f = e.validationBehavior) !== null && f !== void 0 ? f : c;
152
- let { realtimeValidation: i } = B({
153
- ...e,
154
- value: n.isSelected,
155
- // Server validation is handled at the group level.
156
- name: void 0,
157
- validationBehavior: "aria"
158
- }), r = G(te), o = () => {
159
- a.setInvalid(e.value, i.isInvalid ? i : r.current);
160
- };
161
- W(o);
162
- let b = a.realtimeValidation.isInvalid ? a.realtimeValidation : i, v = c === "native" ? a.displayValidation : b;
163
- var u;
164
- let h = j({
165
- ...e,
166
- isReadOnly: e.isReadOnly || a.isReadOnly,
167
- isDisabled: e.isDisabled || a.isDisabled,
168
- name: e.name || s,
169
- isRequired: (u = e.isRequired) !== null && u !== void 0 ? u : a.isRequired,
170
- validationBehavior: c,
171
- [E]: {
172
- realtimeValidation: b,
173
- displayValidation: v,
174
- resetValidation: a.resetValidation,
175
- commitValidation: a.commitValidation,
176
- updateValidation($) {
177
- r.current = $, o();
178
- }
179
- }
180
- }, n, d);
181
- return {
182
- ...h,
183
- inputProps: {
184
- ...h.inputProps,
185
- "aria-describedby": [
186
- e["aria-describedby"],
187
- a.isInvalid ? l : null,
188
- t
189
- ].filter(Boolean).join(" ") || void 0
190
- }
191
- };
192
- }
193
- function ge(e = {}) {
194
- let [a, d] = L(e.value, e.defaultValue || [], e.onChange), n = !!e.isRequired && a.length === 0, s = G(/* @__PURE__ */ new Map()), t = B({
195
- ...e,
196
- value: a
197
- }), l = t.displayValidation.isInvalid;
198
- var c;
199
- return {
200
- ...t,
201
- value: a,
202
- setValue(i) {
203
- e.isReadOnly || e.isDisabled || d(i);
204
- },
205
- isDisabled: e.isDisabled || !1,
206
- isReadOnly: e.isReadOnly || !1,
207
- isSelected(i) {
208
- return a.includes(i);
209
- },
210
- addValue(i) {
211
- e.isReadOnly || e.isDisabled || a.includes(i) || d(a.concat(i));
212
- },
213
- removeValue(i) {
214
- e.isReadOnly || e.isDisabled || a.includes(i) && d(a.filter((r) => r !== i));
215
- },
216
- toggleValue(i) {
217
- e.isReadOnly || e.isDisabled || (a.includes(i) ? d(a.filter((r) => r !== i)) : d(a.concat(i)));
218
- },
219
- setInvalid(i, r) {
220
- let o = new Map(s.current);
221
- r.isInvalid ? o.set(i, r) : o.delete(i), s.current = o, t.updateValidation(se(...o.values()));
222
- },
223
- validationState: (c = e.validationState) !== null && c !== void 0 ? c : l ? "invalid" : null,
224
- isInvalid: l,
225
- isRequired: n
226
- };
227
- }
228
- const xe = /* @__PURE__ */ H(null), z = /* @__PURE__ */ H(null);
229
- function Pe(e, a) {
230
- [e, a] = C(e, a, xe);
231
- let { validationBehavior: d } = w(F) || {};
232
- var n, s;
233
- let t = (s = (n = e.validationBehavior) !== null && n !== void 0 ? n : d) !== null && s !== void 0 ? s : "native", l = ge({
234
- ...e,
235
- validationBehavior: t
236
- }), [c, f] = Y(), { groupProps: i, labelProps: r, descriptionProps: o, errorMessageProps: b, ...v } = he({
237
- ...e,
238
- label: f,
239
- validationBehavior: t
240
- }, l), u = M({
241
- ...e,
242
- values: {
243
- isDisabled: l.isDisabled,
244
- isReadOnly: l.isReadOnly,
245
- isRequired: e.isRequired || !1,
246
- isInvalid: l.isInvalid,
247
- state: l
248
- },
249
- defaultClassName: "react-aria-CheckboxGroup"
250
- });
251
- return /* @__PURE__ */ R.createElement("div", {
252
- ...i,
253
- ...u,
254
- ref: a,
255
- slot: e.slot || void 0,
256
- "data-readonly": l.isReadOnly || void 0,
257
- "data-required": e.isRequired || void 0,
258
- "data-invalid": l.isInvalid || void 0,
259
- "data-disabled": e.isDisabled || void 0
260
- }, /* @__PURE__ */ R.createElement(Z, {
261
- values: [
262
- [
263
- z,
264
- l
265
- ],
266
- [
267
- ce,
268
- {
269
- ...r,
270
- ref: c,
271
- elementType: "span"
272
- }
273
- ],
274
- [
275
- fe,
276
- {
277
- slots: {
278
- description: o,
279
- errorMessage: b
280
- }
281
- }
282
- ],
283
- [
284
- re,
285
- v
286
- ]
287
- ]
288
- }, u.children));
289
- }
290
- function ye(e, a) {
291
- let { inputRef: d = null, ...n } = e;
292
- [e, a] = C(n, a, U);
293
- let { validationBehavior: s } = w(F) || {};
294
- var t, l;
295
- let c = (l = (t = e.validationBehavior) !== null && t !== void 0 ? t : s) !== null && l !== void 0 ? l : "native", f = ue(z), i = ee(ae(d, e.inputRef !== void 0 ? e.inputRef : null)), { labelProps: r, inputProps: o, isSelected: b, isDisabled: v, isReadOnly: u, isPressed: h, isInvalid: $ } = f ? me({
296
- ..._(e),
297
- // Value is optional for standalone checkboxes, but required for CheckboxGroup items;
298
- // it's passed explicitly here to avoid typescript error (requires ignore).
299
- // @ts-ignore
300
- value: e.value,
301
- // ReactNode type doesn't allow function children.
302
- children: typeof e.children == "function" ? !0 : e.children
303
- }, f, i) : j({
304
- ..._(e),
305
- children: typeof e.children == "function" ? !0 : e.children,
306
- validationBehavior: c
307
- }, A(e), i), { isFocused: m, isFocusVisible: P, focusProps: I } = ie(), p = v || u, { hoverProps: V, isHovered: g } = de({
308
- ...e,
309
- isDisabled: p
310
- }), k = M({
311
- ...e,
312
- defaultClassName: "react-aria-Checkbox",
313
- values: {
314
- isSelected: b,
315
- isIndeterminate: e.isIndeterminate || !1,
316
- isPressed: h,
317
- isHovered: g,
318
- isFocused: m,
319
- isFocusVisible: P,
320
- isDisabled: v,
321
- isReadOnly: u,
322
- isInvalid: $,
323
- isRequired: e.isRequired || !1
324
- }
325
- }), O = S(e);
326
- return delete O.id, /* @__PURE__ */ R.createElement("label", {
327
- ...x(O, r, V, k),
328
- ref: a,
329
- slot: e.slot || void 0,
330
- "data-selected": b || void 0,
331
- "data-indeterminate": e.isIndeterminate || void 0,
332
- "data-pressed": h || void 0,
333
- "data-hovered": g || void 0,
334
- "data-focused": m || void 0,
335
- "data-focus-visible": P || void 0,
336
- "data-disabled": v || void 0,
337
- "data-readonly": u || void 0,
338
- "data-invalid": $ || void 0,
339
- "data-required": e.isRequired || void 0
340
- }, /* @__PURE__ */ R.createElement(ve, {
341
- elementType: "span"
342
- }, /* @__PURE__ */ R.createElement("input", {
343
- ...x(o, I),
344
- ref: i
345
- })), k.children);
346
- }
347
- const Re = /* @__PURE__ */ N(ye), la = /* @__PURE__ */ N(Pe), Ie = '"../theme/tokens.css"', pe = '"Inter", sans-serif', Ve = "#000000", De = "#143c50", Se = "#5897b8", Be = "#25607f", ke = "#ffdfdf", Oe = "#e62323", _e = "0 0 0 2px #ffffff, 0 0 0 4px #000000", qe = "#b31b1b", Ce = "#ffffff", we = "#f2f2f2", Me = "#cccccc", Ee = "#808080", Fe = "#bfbfbf", We = "#e6e6e6", Ge = "400", Ne = "500", He = "(max-width: 767px)", Le = "#b3b3b3", je = "_wrap_qn5vw_4", Te = "_checkboxInner_qn5vw_11", Ae = "_checkbox_qn5vw_11", ze = "_checkboxGroup_qn5vw_129", q = {
348
- tokens: Ie,
349
- display: pe,
350
- black: Ve,
351
- primaryBackground: De,
352
- blue80: Se,
353
- blue130: Be,
354
- signalRed10: ke,
355
- signalRed100: Oe,
356
- focus: _e,
357
- signalRed130: qe,
358
- white: Ce,
359
- gray10: we,
360
- gray40: Me,
361
- gray100: Ee,
362
- gray50: Fe,
363
- gray20: We,
364
- regularWeight: Ge,
365
- mediumWeight: Ne,
366
- smBreakpoint: He,
367
- borderSecondary: Le,
368
- wrap: je,
369
- checkboxInner: Te,
370
- checkbox: Ae,
371
- checkboxGroup: ze
372
- }, na = ({ children: e, ...a }) => /* @__PURE__ */ y(
373
- Re,
374
- {
375
- className: Q(q.checkbox, a.className),
376
- ...a,
377
- children: ({ isIndeterminate: d }) => /* @__PURE__ */ J(K, { children: [
378
- /* @__PURE__ */ y("div", { className: q.checkboxInner, children: /* @__PURE__ */ y(
379
- "svg",
380
- {
381
- width: 16,
382
- height: 16,
383
- viewBox: "0 0 18 18",
384
- "aria-hidden": "true",
385
- children: d ? /* @__PURE__ */ y(
386
- "rect",
387
- {
388
- x: 4,
389
- y: 8,
390
- width: 10,
391
- height: 2
392
- }
393
- ) : /* @__PURE__ */ y("polyline", { points: "3,9 7,13 15,4" })
394
- }
395
- ) }),
396
- e
397
- ] })
398
- }
399
- );
400
- export {
401
- la as $,
402
- na as C,
403
- z as a,
404
- q as s
405
- };