@donkit-ai/design-system 0.4.3 → 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 (5) hide show
  1. package/README.md +119 -137
  2. package/dist/index.cjs.js +4 -4
  3. package/dist/index.es.js +1042 -680
  4. package/dist/tokens.css +1 -1
  5. package/package.json +1 -1
package/dist/index.es.js CHANGED
@@ -1,13 +1,14 @@
1
- import $, { useState as P, useRef as F, useEffect as M } from "react";
2
- import { ChevronDown as G, Minus as ce, Plus as le, XCircle as ie, AlertTriangle as de, CheckCircle as ue, Info as fe, X as re, Check as pe } from "lucide-react";
1
+ import S, { useState as g, useRef as B, useEffect as L } from "react";
2
+ import J from "react-dom";
3
+ import { ChevronDown as C, Minus as ve, Plus as je, XCircle as fe, AlertTriangle as me, CheckCircle as pe, Info as be, X as se, Check as _e, ChevronUp as we, ChevronsUpDown as Ne } from "lucide-react";
3
4
  const T = {
4
- xs: 16,
5
- s: 20,
6
- m: 24,
7
- l: 28,
8
- xl: 48
5
+ 1: 16,
6
+ 2: 20,
7
+ 3: 24,
8
+ 4: 28,
9
+ 5: 48
9
10
  };
10
- var q = { exports: {} }, B = {};
11
+ var ee = { exports: {} }, H = {};
11
12
  /**
12
13
  * @license React
13
14
  * react-jsx-runtime.production.js
@@ -17,29 +18,29 @@ var q = { exports: {} }, B = {};
17
18
  * This source code is licensed under the MIT license found in the
18
19
  * LICENSE file in the root directory of this source tree.
19
20
  */
20
- var ee;
21
- function me() {
22
- if (ee) return B;
23
- ee = 1;
24
- var o = Symbol.for("react.transitional.element"), s = Symbol.for("react.fragment");
25
- function r(l, n, a) {
26
- var i = null;
27
- if (a !== void 0 && (i = "" + a), n.key !== void 0 && (i = "" + n.key), "key" in n) {
21
+ var le;
22
+ function ye() {
23
+ if (le) return H;
24
+ le = 1;
25
+ var t = Symbol.for("react.transitional.element"), e = Symbol.for("react.fragment");
26
+ function s(c, n, a) {
27
+ var l = null;
28
+ if (a !== void 0 && (l = "" + a), n.key !== void 0 && (l = "" + n.key), "key" in n) {
28
29
  a = {};
29
- for (var c in n)
30
- c !== "key" && (a[c] = n[c]);
30
+ for (var i in n)
31
+ i !== "key" && (a[i] = n[i]);
31
32
  } else a = n;
32
33
  return n = a.ref, {
33
- $$typeof: o,
34
- type: l,
35
- key: i,
34
+ $$typeof: t,
35
+ type: c,
36
+ key: l,
36
37
  ref: n !== void 0 ? n : null,
37
38
  props: a
38
39
  };
39
40
  }
40
- return B.Fragment = s, B.jsx = r, B.jsxs = r, B;
41
+ return H.Fragment = e, H.jsx = s, H.jsxs = s, H;
41
42
  }
42
- var L = {};
43
+ var G = {};
43
44
  /**
44
45
  * @license React
45
46
  * react-jsx-runtime.development.js
@@ -49,1057 +50,1418 @@ var L = {};
49
50
  * This source code is licensed under the MIT license found in the
50
51
  * LICENSE file in the root directory of this source tree.
51
52
  */
52
- var te;
53
- function xe() {
54
- return te || (te = 1, process.env.NODE_ENV !== "production" && function() {
55
- function o(t) {
56
- if (t == null) return null;
57
- if (typeof t == "function")
58
- return t.$$typeof === ne ? null : t.displayName || t.name || null;
59
- if (typeof t == "string") return t;
60
- switch (t) {
61
- case h:
53
+ var ie;
54
+ function Ee() {
55
+ return ie || (ie = 1, process.env.NODE_ENV !== "production" && function() {
56
+ function t(o) {
57
+ if (o == null) return null;
58
+ if (typeof o == "function")
59
+ return o.$$typeof === D ? null : o.displayName || o.name || null;
60
+ if (typeof o == "string") return o;
61
+ switch (o) {
62
+ case R:
62
63
  return "Fragment";
63
- case g:
64
+ case m:
64
65
  return "Profiler";
65
- case v:
66
+ case $:
66
67
  return "StrictMode";
67
- case y:
68
+ case I:
68
69
  return "Suspense";
69
- case O:
70
+ case P:
70
71
  return "SuspenseList";
71
- case D:
72
+ case w:
72
73
  return "Activity";
73
74
  }
74
- if (typeof t == "object")
75
- switch (typeof t.tag == "number" && console.error(
75
+ if (typeof o == "object")
76
+ switch (typeof o.tag == "number" && console.error(
76
77
  "Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."
77
- ), t.$$typeof) {
78
- case E:
78
+ ), o.$$typeof) {
79
+ case v:
79
80
  return "Portal";
80
- case R:
81
- return t.displayName || "Context";
82
- case k:
83
- return (t._context.displayName || "Context") + ".Consumer";
84
- case I:
85
- var f = t.render;
86
- return t = t.displayName, t || (t = f.displayName || f.name || "", t = t !== "" ? "ForwardRef(" + t + ")" : "ForwardRef"), t;
87
- case S:
88
- return f = t.displayName || null, f !== null ? f : o(t.type) || "Memo";
81
+ case y:
82
+ return o.displayName || "Context";
83
+ case _:
84
+ return (o._context.displayName || "Context") + ".Consumer";
89
85
  case A:
90
- f = t._payload, t = t._init;
86
+ var b = o.render;
87
+ return o = o.displayName, o || (o = b.displayName || b.name || "", o = o !== "" ? "ForwardRef(" + o + ")" : "ForwardRef"), o;
88
+ case K:
89
+ return b = o.displayName || null, b !== null ? b : t(o.type) || "Memo";
90
+ case V:
91
+ b = o._payload, o = o._init;
91
92
  try {
92
- return o(t(f));
93
+ return t(o(b));
93
94
  } catch {
94
95
  }
95
96
  }
96
97
  return null;
97
98
  }
98
- function s(t) {
99
- return "" + t;
99
+ function e(o) {
100
+ return "" + o;
100
101
  }
101
- function r(t) {
102
+ function s(o) {
102
103
  try {
103
- s(t);
104
- var f = !1;
104
+ e(o);
105
+ var b = !1;
105
106
  } catch {
106
- f = !0;
107
+ b = !0;
107
108
  }
108
- if (f) {
109
- f = console;
110
- var j = f.error, N = typeof Symbol == "function" && Symbol.toStringTag && t[Symbol.toStringTag] || t.constructor.name || "Object";
111
- return j.call(
112
- f,
109
+ if (b) {
110
+ b = console;
111
+ var N = b.error, E = typeof Symbol == "function" && Symbol.toStringTag && o[Symbol.toStringTag] || o.constructor.name || "Object";
112
+ return N.call(
113
+ b,
113
114
  "The provided key is an unsupported type %s. This value must be coerced to a string before using it here.",
114
- N
115
- ), s(t);
115
+ E
116
+ ), e(o);
116
117
  }
117
118
  }
118
- function l(t) {
119
- if (t === h) return "<>";
120
- if (typeof t == "object" && t !== null && t.$$typeof === A)
119
+ function c(o) {
120
+ if (o === R) return "<>";
121
+ if (typeof o == "object" && o !== null && o.$$typeof === V)
121
122
  return "<...>";
122
123
  try {
123
- var f = o(t);
124
- return f ? "<" + f + ">" : "<...>";
124
+ var b = t(o);
125
+ return b ? "<" + b + ">" : "<...>";
125
126
  } catch {
126
127
  return "<...>";
127
128
  }
128
129
  }
129
130
  function n() {
130
- var t = V.A;
131
- return t === null ? null : t.getOwner();
131
+ var o = M.A;
132
+ return o === null ? null : o.getOwner();
132
133
  }
133
134
  function a() {
134
135
  return Error("react-stack-top-frame");
135
136
  }
136
- function i(t) {
137
- if (X.call(t, "key")) {
138
- var f = Object.getOwnPropertyDescriptor(t, "key").get;
139
- if (f && f.isReactWarning) return !1;
137
+ function l(o) {
138
+ if (q.call(o, "key")) {
139
+ var b = Object.getOwnPropertyDescriptor(o, "key").get;
140
+ if (b && b.isReactWarning) return !1;
140
141
  }
141
- return t.key !== void 0;
142
+ return o.key !== void 0;
142
143
  }
143
- function c(t, f) {
144
- function j() {
145
- J || (J = !0, console.error(
144
+ function i(o, b) {
145
+ function N() {
146
+ U || (U = !0, console.error(
146
147
  "%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://react.dev/link/special-props)",
147
- f
148
+ b
148
149
  ));
149
150
  }
150
- j.isReactWarning = !0, Object.defineProperty(t, "key", {
151
- get: j,
151
+ N.isReactWarning = !0, Object.defineProperty(o, "key", {
152
+ get: N,
152
153
  configurable: !0
153
154
  });
154
155
  }
155
- function m() {
156
- var t = o(this.type);
157
- return K[t] || (K[t] = !0, console.error(
156
+ function p() {
157
+ var o = t(this.type);
158
+ return ne[o] || (ne[o] = !0, console.error(
158
159
  "Accessing element.ref was removed in React 19. ref is now a regular prop. It will be removed from the JSX Element type in a future release."
159
- )), t = this.props.ref, t !== void 0 ? t : null;
160
+ )), o = this.props.ref, o !== void 0 ? o : null;
160
161
  }
161
- function p(t, f, j, N, Y, z) {
162
- var w = j.ref;
163
- return t = {
164
- $$typeof: _,
165
- type: t,
166
- key: f,
167
- props: j,
168
- _owner: N
169
- }, (w !== void 0 ? w : null) !== null ? Object.defineProperty(t, "ref", {
162
+ function f(o, b, N, E, X, Z) {
163
+ var k = N.ref;
164
+ return o = {
165
+ $$typeof: j,
166
+ type: o,
167
+ key: b,
168
+ props: N,
169
+ _owner: E
170
+ }, (k !== void 0 ? k : null) !== null ? Object.defineProperty(o, "ref", {
170
171
  enumerable: !1,
171
- get: m
172
- }) : Object.defineProperty(t, "ref", { enumerable: !1, value: null }), t._store = {}, Object.defineProperty(t._store, "validated", {
172
+ get: p
173
+ }) : Object.defineProperty(o, "ref", { enumerable: !1, value: null }), o._store = {}, Object.defineProperty(o._store, "validated", {
173
174
  configurable: !1,
174
175
  enumerable: !1,
175
176
  writable: !0,
176
177
  value: 0
177
- }), Object.defineProperty(t, "_debugInfo", {
178
+ }), Object.defineProperty(o, "_debugInfo", {
178
179
  configurable: !1,
179
180
  enumerable: !1,
180
181
  writable: !0,
181
182
  value: null
182
- }), Object.defineProperty(t, "_debugStack", {
183
+ }), Object.defineProperty(o, "_debugStack", {
183
184
  configurable: !1,
184
185
  enumerable: !1,
185
186
  writable: !0,
186
- value: Y
187
- }), Object.defineProperty(t, "_debugTask", {
187
+ value: X
188
+ }), Object.defineProperty(o, "_debugTask", {
188
189
  configurable: !1,
189
190
  enumerable: !1,
190
191
  writable: !0,
191
- value: z
192
- }), Object.freeze && (Object.freeze(t.props), Object.freeze(t)), t;
192
+ value: Z
193
+ }), Object.freeze && (Object.freeze(o.props), Object.freeze(o)), o;
193
194
  }
194
- function d(t, f, j, N, Y, z) {
195
- var w = f.children;
196
- if (w !== void 0)
197
- if (N)
198
- if (ae(w)) {
199
- for (N = 0; N < w.length; N++)
200
- u(w[N]);
201
- Object.freeze && Object.freeze(w);
195
+ function d(o, b, N, E, X, Z) {
196
+ var k = b.children;
197
+ if (k !== void 0)
198
+ if (E)
199
+ if (re(k)) {
200
+ for (E = 0; E < k.length; E++)
201
+ u(k[E]);
202
+ Object.freeze && Object.freeze(k);
202
203
  } else
203
204
  console.error(
204
205
  "React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead."
205
206
  );
206
- else u(w);
207
- if (X.call(f, "key")) {
208
- w = o(t);
209
- var W = Object.keys(f).filter(function(oe) {
210
- return oe !== "key";
207
+ else u(k);
208
+ if (q.call(b, "key")) {
209
+ k = t(o);
210
+ var W = Object.keys(b).filter(function(xe) {
211
+ return xe !== "key";
211
212
  });
212
- N = 0 < W.length ? "{key: someKey, " + W.join(": ..., ") + ": ...}" : "{key: someKey}", Q[w + N] || (W = 0 < W.length ? "{" + W.join(": ..., ") + ": ...}" : "{}", console.error(
213
+ E = 0 < W.length ? "{key: someKey, " + W.join(": ..., ") + ": ...}" : "{key: someKey}", ce[k + E] || (W = 0 < W.length ? "{" + W.join(": ..., ") + ": ...}" : "{}", console.error(
213
214
  `A props object containing a "key" prop is being spread into JSX:
214
215
  let props = %s;
215
216
  <%s {...props} />
216
217
  React keys must be passed directly to JSX without using spread:
217
218
  let props = %s;
218
219
  <%s key={someKey} {...props} />`,
219
- N,
220
- w,
220
+ E,
221
+ k,
221
222
  W,
222
- w
223
- ), Q[w + N] = !0);
223
+ k
224
+ ), ce[k + E] = !0);
224
225
  }
225
- if (w = null, j !== void 0 && (r(j), w = "" + j), i(f) && (r(f.key), w = "" + f.key), "key" in f) {
226
- j = {};
227
- for (var U in f)
228
- U !== "key" && (j[U] = f[U]);
229
- } else j = f;
230
- return w && c(
231
- j,
232
- typeof t == "function" ? t.displayName || t.name || "Unknown" : t
233
- ), p(
234
- t,
235
- w,
236
- j,
226
+ if (k = null, N !== void 0 && (s(N), k = "" + N), l(b) && (s(b.key), k = "" + b.key), "key" in b) {
227
+ N = {};
228
+ for (var Q in b)
229
+ Q !== "key" && (N[Q] = b[Q]);
230
+ } else N = b;
231
+ return k && i(
232
+ N,
233
+ typeof o == "function" ? o.displayName || o.name || "Unknown" : o
234
+ ), f(
235
+ o,
236
+ k,
237
+ N,
237
238
  n(),
238
- Y,
239
- z
239
+ X,
240
+ Z
240
241
  );
241
242
  }
242
- function u(t) {
243
- x(t) ? t._store && (t._store.validated = 1) : typeof t == "object" && t !== null && t.$$typeof === A && (t._payload.status === "fulfilled" ? x(t._payload.value) && t._payload.value._store && (t._payload.value._store.validated = 1) : t._store && (t._store.validated = 1));
243
+ function u(o) {
244
+ h(o) ? o._store && (o._store.validated = 1) : typeof o == "object" && o !== null && o.$$typeof === V && (o._payload.status === "fulfilled" ? h(o._payload.value) && o._payload.value._store && (o._payload.value._store.validated = 1) : o._store && (o._store.validated = 1));
244
245
  }
245
- function x(t) {
246
- return typeof t == "object" && t !== null && t.$$typeof === _;
246
+ function h(o) {
247
+ return typeof o == "object" && o !== null && o.$$typeof === j;
247
248
  }
248
- var b = $, _ = Symbol.for("react.transitional.element"), E = Symbol.for("react.portal"), h = Symbol.for("react.fragment"), v = Symbol.for("react.strict_mode"), g = Symbol.for("react.profiler"), k = Symbol.for("react.consumer"), R = Symbol.for("react.context"), I = Symbol.for("react.forward_ref"), y = Symbol.for("react.suspense"), O = Symbol.for("react.suspense_list"), S = Symbol.for("react.memo"), A = Symbol.for("react.lazy"), D = Symbol.for("react.activity"), ne = Symbol.for("react.client.reference"), V = b.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE, X = Object.prototype.hasOwnProperty, ae = Array.isArray, H = console.createTask ? console.createTask : function() {
249
+ var x = S, j = Symbol.for("react.transitional.element"), v = Symbol.for("react.portal"), R = Symbol.for("react.fragment"), $ = Symbol.for("react.strict_mode"), m = Symbol.for("react.profiler"), _ = Symbol.for("react.consumer"), y = Symbol.for("react.context"), A = Symbol.for("react.forward_ref"), I = Symbol.for("react.suspense"), P = Symbol.for("react.suspense_list"), K = Symbol.for("react.memo"), V = Symbol.for("react.lazy"), w = Symbol.for("react.activity"), D = Symbol.for("react.client.reference"), M = x.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE, q = Object.prototype.hasOwnProperty, re = Array.isArray, F = console.createTask ? console.createTask : function() {
249
250
  return null;
250
251
  };
251
- b = {
252
- react_stack_bottom_frame: function(t) {
253
- return t();
252
+ x = {
253
+ react_stack_bottom_frame: function(o) {
254
+ return o();
254
255
  }
255
256
  };
256
- var J, K = {}, Z = b.react_stack_bottom_frame.bind(
257
- b,
257
+ var U, ne = {}, ae = x.react_stack_bottom_frame.bind(
258
+ x,
258
259
  a
259
- )(), C = H(l(a)), Q = {};
260
- L.Fragment = h, L.jsx = function(t, f, j) {
261
- var N = 1e4 > V.recentlyCreatedOwnerStacks++;
260
+ )(), oe = F(c(a)), ce = {};
261
+ G.Fragment = R, G.jsx = function(o, b, N) {
262
+ var E = 1e4 > M.recentlyCreatedOwnerStacks++;
262
263
  return d(
263
- t,
264
- f,
265
- j,
264
+ o,
265
+ b,
266
+ N,
266
267
  !1,
267
- N ? Error("react-stack-top-frame") : Z,
268
- N ? H(l(t)) : C
268
+ E ? Error("react-stack-top-frame") : ae,
269
+ E ? F(c(o)) : oe
269
270
  );
270
- }, L.jsxs = function(t, f, j) {
271
- var N = 1e4 > V.recentlyCreatedOwnerStacks++;
271
+ }, G.jsxs = function(o, b, N) {
272
+ var E = 1e4 > M.recentlyCreatedOwnerStacks++;
272
273
  return d(
273
- t,
274
- f,
275
- j,
274
+ o,
275
+ b,
276
+ N,
276
277
  !0,
277
- N ? Error("react-stack-top-frame") : Z,
278
- N ? H(l(t)) : C
278
+ E ? Error("react-stack-top-frame") : ae,
279
+ E ? F(c(o)) : oe
279
280
  );
280
281
  };
281
- }()), L;
282
+ }()), G;
282
283
  }
283
- process.env.NODE_ENV === "production" ? q.exports = me() : q.exports = xe();
284
- var e = q.exports;
285
- function be({
286
- children: o,
287
- variant: s = "primary",
288
- size: r = "m",
289
- fullWidth: l = !1,
284
+ process.env.NODE_ENV === "production" ? ee.exports = ye() : ee.exports = Ee();
285
+ var r = ee.exports;
286
+ function ke({
287
+ children: t,
288
+ variant: e = "primary",
289
+ size: s = "m",
290
+ fullWidth: c = !1,
290
291
  icon: n,
291
292
  disabled: a = !1,
292
- onClick: i,
293
- type: c = "button",
294
- href: m,
295
- "aria-label": p,
293
+ onClick: l,
294
+ type: i = "button",
295
+ href: p,
296
+ "aria-label": f,
296
297
  ...d
297
298
  }) {
298
- const u = n && !o, x = [
299
+ const u = n && !t, h = [
299
300
  "ds-button",
301
+ `ds-button--${e}`,
300
302
  `ds-button--${s}`,
301
- `ds-button--${r}`,
302
- l && "ds-button--full",
303
+ c && "ds-button--full",
303
304
  u && "ds-button--icon-only"
304
- ].filter(Boolean).join(" "), b = /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
305
- n && !u && /* @__PURE__ */ e.jsx("span", { className: "ds-button__icon", "aria-hidden": "true", children: n }),
306
- o,
307
- u && /* @__PURE__ */ e.jsx("span", { className: "ds-button__icon", "aria-hidden": "true", children: n })
305
+ ].filter(Boolean).join(" "), x = /* @__PURE__ */ r.jsxs(r.Fragment, { children: [
306
+ n && !u && /* @__PURE__ */ r.jsx("span", { className: "ds-button__icon", "aria-hidden": "true", children: n }),
307
+ t,
308
+ u && /* @__PURE__ */ r.jsx("span", { className: "ds-button__icon", "aria-hidden": "true", children: n })
308
309
  ] });
309
- if (m) {
310
- const _ = (E) => {
310
+ if (p) {
311
+ const j = (v) => {
311
312
  if (a) {
312
- E.preventDefault();
313
+ v.preventDefault();
313
314
  return;
314
315
  }
315
- E.metaKey || E.ctrlKey || E.button === 1 || (E.preventDefault(), i == null || i(E));
316
+ v.metaKey || v.ctrlKey || v.button === 1 || (v.preventDefault(), l == null || l(v));
316
317
  };
317
- return /* @__PURE__ */ e.jsx(
318
+ return /* @__PURE__ */ r.jsx(
318
319
  "a",
319
320
  {
320
- className: x,
321
- href: a ? void 0 : m,
322
- onClick: _,
323
- "aria-label": p,
321
+ className: h,
322
+ href: a ? void 0 : p,
323
+ onClick: j,
324
+ "aria-label": f,
324
325
  "aria-disabled": a ? "true" : void 0,
325
326
  ...d,
326
- children: b
327
+ children: x
327
328
  }
328
329
  );
329
330
  }
330
- return /* @__PURE__ */ e.jsx(
331
+ return /* @__PURE__ */ r.jsx(
331
332
  "button",
332
333
  {
333
- type: c,
334
- className: x,
334
+ type: i,
335
+ className: h,
335
336
  disabled: a,
336
- onClick: i,
337
- "aria-label": p,
337
+ onClick: l,
338
+ "aria-label": f,
338
339
  ...d,
339
- children: b
340
+ children: x
340
341
  }
341
342
  );
342
343
  }
343
- function Ne({
344
- label: o,
345
- error: s,
346
- hint: r,
347
- fullWidth: l = !0,
344
+ function De({
345
+ label: t,
346
+ error: e,
347
+ hint: s,
348
+ fullWidth: c = !0,
348
349
  icon: n,
349
350
  iconRight: a,
350
- onIconRightClick: i,
351
- size: c = "m",
352
- disabled: m,
353
- id: p,
351
+ onIconRightClick: l,
352
+ size: i = "m",
353
+ disabled: p,
354
+ id: f,
354
355
  ...d
355
356
  }) {
356
- const u = p || `input-${$.useId()}`, x = r ? `${u}-hint` : void 0, b = s ? `${u}-error` : void 0, _ = b || x;
357
- return /* @__PURE__ */ e.jsxs("div", { className: `ds-input-wrapper ${l ? "ds-input-wrapper--full" : ""} ${m ? "ds-input-wrapper--disabled" : ""}`, children: [
358
- o && /* @__PURE__ */ e.jsx("label", { className: "ds-input-label", htmlFor: u, children: o }),
359
- /* @__PURE__ */ e.jsxs("div", { className: "ds-input-container", children: [
360
- n && /* @__PURE__ */ e.jsx("span", { className: `ds-input-icon ds-input-icon--${c}`, "aria-hidden": "true", children: n }),
361
- /* @__PURE__ */ e.jsx(
357
+ const u = f || `input-${S.useId()}`, h = s ? `${u}-hint` : void 0, x = e ? `${u}-error` : void 0, j = x || h;
358
+ return /* @__PURE__ */ r.jsxs("div", { className: `ds-input-wrapper ${c ? "ds-input-wrapper--full" : ""} ${p ? "ds-input-wrapper--disabled" : ""}`, children: [
359
+ t && /* @__PURE__ */ r.jsx("label", { className: "ds-input-label", htmlFor: u, children: t }),
360
+ /* @__PURE__ */ r.jsxs("div", { className: "ds-input-container", children: [
361
+ n && /* @__PURE__ */ r.jsx("span", { className: `ds-input-icon ds-input-icon--${i}`, "aria-hidden": "true", children: n }),
362
+ /* @__PURE__ */ r.jsx(
362
363
  "input",
363
364
  {
364
365
  id: u,
365
- className: `ds-input ds-input--${c} ${n ? "ds-input--with-icon" : ""} ${a ? "ds-input--with-icon-right" : ""} ${s ? "ds-input--error" : ""}`,
366
- disabled: m,
367
- "aria-invalid": s ? "true" : "false",
368
- "aria-describedby": _,
366
+ className: `ds-input ds-input--${i} ${n ? "ds-input--with-icon" : ""} ${a ? "ds-input--with-icon-right" : ""} ${e ? "ds-input--error" : ""}`,
367
+ disabled: p,
368
+ "aria-invalid": e ? "true" : "false",
369
+ "aria-describedby": j,
369
370
  ...d
370
371
  }
371
372
  ),
372
- a && /* @__PURE__ */ e.jsx(
373
+ a && /* @__PURE__ */ r.jsx(
373
374
  "button",
374
375
  {
375
376
  type: "button",
376
- className: `ds-input-icon-right ds-input-icon-right--${c}`,
377
- onClick: i,
377
+ className: `ds-input-icon-right ds-input-icon-right--${i}`,
378
+ onClick: l,
378
379
  tabIndex: -1,
379
380
  "aria-label": "Toggle visibility",
380
381
  children: a
381
382
  }
382
383
  )
383
384
  ] }),
384
- r && !s && /* @__PURE__ */ e.jsx("span", { id: x, className: "ds-input-hint", children: r }),
385
- s && /* @__PURE__ */ e.jsx("span", { id: b, className: "ds-input-error", role: "alert", children: s })
385
+ s && !e && /* @__PURE__ */ r.jsx("span", { id: h, className: "ds-input-hint", children: s }),
386
+ e && /* @__PURE__ */ r.jsx("span", { id: x, className: "ds-input-error", role: "alert", children: e })
386
387
  ] });
387
388
  }
388
- function we({
389
- label: o,
390
- error: s,
391
- hint: r,
392
- fullWidth: l = !0,
389
+ function Me({
390
+ label: t,
391
+ error: e,
392
+ hint: s,
393
+ fullWidth: c = !0,
393
394
  size: n = "m",
394
395
  disabled: a,
395
- id: i,
396
- resize: c = !0,
397
- rows: m = 3,
398
- ...p
396
+ id: l,
397
+ resize: i = !0,
398
+ rows: p = 3,
399
+ ...f
399
400
  }) {
400
- const d = i || `textarea-${$.useId()}`, u = r ? `${d}-hint` : void 0, x = s ? `${d}-error` : void 0, b = x || u;
401
- return /* @__PURE__ */ e.jsxs("div", { className: `ds-textarea-wrapper ${l ? "ds-textarea-wrapper--full" : ""} ${a ? "ds-textarea-wrapper--disabled" : ""}`, children: [
402
- o && /* @__PURE__ */ e.jsx("label", { className: "ds-textarea-label", htmlFor: d, children: o }),
403
- /* @__PURE__ */ e.jsx(
401
+ const d = l || `textarea-${S.useId()}`, u = s ? `${d}-hint` : void 0, h = e ? `${d}-error` : void 0, x = h || u;
402
+ return /* @__PURE__ */ r.jsxs("div", { className: `ds-textarea-wrapper ${c ? "ds-textarea-wrapper--full" : ""} ${a ? "ds-textarea-wrapper--disabled" : ""}`, children: [
403
+ t && /* @__PURE__ */ r.jsx("label", { className: "ds-textarea-label", htmlFor: d, children: t }),
404
+ /* @__PURE__ */ r.jsx(
404
405
  "textarea",
405
406
  {
406
407
  id: d,
407
- className: `ds-textarea ds-textarea--${n} ${s ? "ds-textarea--error" : ""} ${c ? "" : "ds-textarea--no-resize"}`,
408
+ className: `ds-textarea ds-textarea--${n} ${e ? "ds-textarea--error" : ""} ${i ? "" : "ds-textarea--no-resize"}`,
408
409
  disabled: a,
409
- "aria-invalid": s ? "true" : "false",
410
- "aria-describedby": b,
411
- rows: m,
412
- ...p
410
+ "aria-invalid": e ? "true" : "false",
411
+ "aria-describedby": x,
412
+ rows: p,
413
+ ...f
413
414
  }
414
415
  ),
415
- r && !s && /* @__PURE__ */ e.jsx("span", { id: u, className: "ds-textarea-hint", children: r }),
416
- s && /* @__PURE__ */ e.jsx("span", { id: x, className: "ds-textarea-error", role: "alert", children: s })
416
+ s && !e && /* @__PURE__ */ r.jsx("span", { id: u, className: "ds-textarea-hint", children: s }),
417
+ e && /* @__PURE__ */ r.jsx("span", { id: h, className: "ds-textarea-error", role: "alert", children: e })
417
418
  ] });
418
419
  }
419
- function Ee({
420
- label: o,
421
- value: s,
422
- onChange: r,
423
- options: l = [],
420
+ function Fe({
421
+ label: t,
422
+ value: e,
423
+ onChange: s,
424
+ options: c = [],
424
425
  placeholder: n = "Select option",
425
426
  error: a,
426
- fullWidth: i = !0,
427
- size: c = "m",
428
- disabled: m = !1,
429
- id: p,
427
+ fullWidth: l = !0,
428
+ size: i = "m",
429
+ disabled: p = !1,
430
+ id: f,
430
431
  ...d
431
432
  }) {
432
- const [u, x] = P(!1), [b, _] = P("down"), E = F(null), h = F(null), v = p || `select-${$.useId()}`, g = `${v}-label`, k = a ? `${v}-error` : void 0;
433
- M(() => {
434
- const y = (O) => {
435
- E.current && !E.current.contains(O.target) && x(!1);
433
+ const [u, h] = g(!1), [x, j] = g({}), [v, R] = g("down"), $ = B(null), m = B(null), _ = f || `select-${S.useId()}`, y = `${_}-label`, A = a ? `${_}-error` : void 0, I = () => {
434
+ var U;
435
+ const w = (U = $.current) == null ? void 0 : U.getBoundingClientRect();
436
+ if (!w) return;
437
+ const D = window.innerHeight, M = D - w.bottom, q = w.top, F = M < 300 && q > M;
438
+ R(F ? "up" : "down"), j(
439
+ F ? { bottom: D - w.top + 4, left: w.left, width: w.width } : { top: w.bottom + 4, left: w.left, width: w.width }
440
+ );
441
+ };
442
+ L(() => {
443
+ if (u)
444
+ return I(), window.addEventListener("scroll", I, !0), window.addEventListener("resize", I), () => {
445
+ window.removeEventListener("scroll", I, !0), window.removeEventListener("resize", I);
446
+ };
447
+ }, [u]), L(() => {
448
+ const w = (D) => {
449
+ $.current && !$.current.contains(D.target) && m.current && !m.current.contains(D.target) && h(!1);
436
450
  };
437
- return document.addEventListener("mousedown", y), () => document.removeEventListener("mousedown", y);
438
- }, []), M(() => {
439
- if (u && E.current) {
440
- const y = E.current.getBoundingClientRect(), S = window.innerHeight - y.bottom, A = y.top;
441
- S < 300 && A > S ? _("up") : _("down");
442
- }
443
- }, [u]);
444
- const R = l.find((y) => y.value === s), I = c === "xs" ? T.xs : c === "small" ? T.s : T.m;
445
- return /* @__PURE__ */ e.jsxs("div", { className: `ds-select-wrapper ${i ? "ds-select-wrapper--full" : ""} ${m ? "ds-select-wrapper--disabled" : ""}`, children: [
446
- o && /* @__PURE__ */ e.jsx("label", { id: g, className: "ds-select-label", children: o }),
447
- /* @__PURE__ */ e.jsxs("div", { className: "ds-select-container", ref: E, children: [
448
- /* @__PURE__ */ e.jsxs(
451
+ return document.addEventListener("mousedown", w), () => document.removeEventListener("mousedown", w);
452
+ }, []);
453
+ const P = c.find((w) => w.value === e), K = i === "xs" ? T[1] : i === "small" ? T[2] : T[3], V = u && /* @__PURE__ */ r.jsx(
454
+ "div",
455
+ {
456
+ ref: m,
457
+ role: "listbox",
458
+ "aria-labelledby": t ? y : void 0,
459
+ className: `ds-select-dropdown ds-select-dropdown--${i} ds-select-dropdown--${v}`,
460
+ style: x,
461
+ children: c.map((w) => /* @__PURE__ */ r.jsx(
449
462
  "button",
450
463
  {
451
464
  type: "button",
452
- id: v,
453
- role: "combobox",
454
- "aria-haspopup": "listbox",
455
- "aria-expanded": u,
456
- "aria-labelledby": o ? g : void 0,
457
- "aria-invalid": a ? "true" : "false",
458
- "aria-describedby": k,
459
- className: `ds-select-trigger ds-select-trigger--${c} ${a ? "ds-select-trigger--error" : ""}`,
460
- onClick: () => !m && x(!u),
461
- disabled: m,
462
- ...d,
463
- children: [
464
- /* @__PURE__ */ e.jsx("span", { className: R ? "" : "ds-select-placeholder", children: (R == null ? void 0 : R.label) || n }),
465
- /* @__PURE__ */ e.jsx(
466
- G,
467
- {
468
- size: I,
469
- strokeWidth: 1.5,
470
- className: `ds-select-icon ${u && b === "down" ? "ds-select-icon--open" : ""} ${u && b === "up" ? "ds-select-icon--up" : ""}`,
471
- "aria-hidden": "true"
472
- }
473
- )
474
- ]
475
- }
476
- ),
477
- u && /* @__PURE__ */ e.jsx(
478
- "div",
479
- {
480
- ref: h,
481
- role: "listbox",
482
- "aria-labelledby": o ? g : void 0,
483
- className: `ds-select-dropdown ds-select-dropdown--${c} ds-select-dropdown--${b}`,
484
- children: l.map((y) => /* @__PURE__ */ e.jsx(
485
- "button",
465
+ role: "option",
466
+ "aria-selected": e === w.value,
467
+ className: `ds-select-option ds-select-option--${i} ${e === w.value ? "ds-select-option--selected" : ""}`,
468
+ onClick: () => {
469
+ s == null || s(w.value), h(!1);
470
+ },
471
+ children: w.label
472
+ },
473
+ w.value
474
+ ))
475
+ }
476
+ );
477
+ return /* @__PURE__ */ r.jsxs("div", { className: `ds-select-wrapper ${l ? "ds-select-wrapper--full" : ""} ${p ? "ds-select-wrapper--disabled" : ""}`, children: [
478
+ t && /* @__PURE__ */ r.jsx("label", { id: y, className: "ds-select-label", children: t }),
479
+ /* @__PURE__ */ r.jsx("div", { className: "ds-select-container", ref: $, children: /* @__PURE__ */ r.jsxs(
480
+ "button",
481
+ {
482
+ type: "button",
483
+ id: _,
484
+ role: "combobox",
485
+ "aria-haspopup": "listbox",
486
+ "aria-expanded": u,
487
+ "aria-labelledby": t ? y : void 0,
488
+ "aria-invalid": a ? "true" : "false",
489
+ "aria-describedby": A,
490
+ className: `ds-select-trigger ds-select-trigger--${i} ${a ? "ds-select-trigger--error" : ""}`,
491
+ onClick: () => !p && h(!u),
492
+ disabled: p,
493
+ ...d,
494
+ children: [
495
+ /* @__PURE__ */ r.jsx("span", { className: P ? "" : "ds-select-placeholder", children: (P == null ? void 0 : P.label) || n }),
496
+ /* @__PURE__ */ r.jsx(
497
+ C,
486
498
  {
487
- type: "button",
488
- role: "option",
489
- "aria-selected": s === y.value,
490
- className: `ds-select-option ds-select-option--${c} ${s === y.value ? "ds-select-option--selected" : ""}`,
491
- onClick: () => {
492
- r == null || r(y.value), x(!1);
493
- },
494
- children: y.label
495
- },
496
- y.value
497
- ))
498
- }
499
- )
500
- ] }),
501
- a && /* @__PURE__ */ e.jsx("span", { id: k, className: "ds-select-error", role: "alert", children: a })
499
+ size: K,
500
+ strokeWidth: 1.5,
501
+ className: `ds-select-icon ${u && v === "down" ? "ds-select-icon--open" : ""} ${u && v === "up" ? "ds-select-icon--up" : ""}`,
502
+ "aria-hidden": "true"
503
+ }
504
+ )
505
+ ]
506
+ }
507
+ ) }),
508
+ a && /* @__PURE__ */ r.jsx("span", { id: A, className: "ds-select-error", role: "alert", children: a }),
509
+ typeof document < "u" && J.createPortal(V, document.body)
502
510
  ] });
503
511
  }
504
- function ye({
505
- label: o,
506
- value: s = 0,
507
- onChange: r,
508
- min: l = 0,
512
+ function We({
513
+ label: t,
514
+ value: e = 0,
515
+ onChange: s,
516
+ min: c = 0,
509
517
  max: n = 100,
510
518
  step: a = 1,
511
- size: i = "m",
512
- disabled: c = !1,
513
- hint: m,
514
- error: p,
519
+ size: l = "m",
520
+ disabled: i = !1,
521
+ hint: p,
522
+ error: f,
515
523
  ...d
516
524
  }) {
517
525
  const u = () => {
518
- if (c) return;
519
- const v = Math.min(Number(s) + a, n);
520
- r == null || r(v);
521
- }, x = () => {
522
- if (c) return;
523
- const v = Math.max(Number(s) - a, l);
524
- r == null || r(v);
525
- }, b = (v) => {
526
- if (c) return;
527
- const g = v.target.value;
528
- if (g === "") {
529
- r == null || r(l);
526
+ if (i) return;
527
+ const $ = Math.min(Number(e) + a, n);
528
+ s == null || s($);
529
+ }, h = () => {
530
+ if (i) return;
531
+ const $ = Math.max(Number(e) - a, c);
532
+ s == null || s($);
533
+ }, x = ($) => {
534
+ if (i) return;
535
+ const m = $.target.value;
536
+ if (m === "") {
537
+ s == null || s(c);
530
538
  return;
531
539
  }
532
- const k = Number(g);
533
- if (!isNaN(k)) {
534
- const R = Math.min(Math.max(k, l), n);
535
- r == null || r(R);
540
+ const _ = Number(m);
541
+ if (!isNaN(_)) {
542
+ const y = Math.min(Math.max(_, c), n);
543
+ s == null || s(y);
536
544
  }
537
- }, _ = [
545
+ }, j = [
538
546
  "ds-stepper-wrapper",
539
- c && "ds-stepper-wrapper--disabled",
540
- p && "ds-stepper-wrapper--error"
541
- ].filter(Boolean).join(" "), E = [
547
+ i && "ds-stepper-wrapper--disabled",
548
+ f && "ds-stepper-wrapper--error"
549
+ ].filter(Boolean).join(" "), v = [
542
550
  "ds-stepper",
543
- `ds-stepper--${i}`,
544
- c && "ds-stepper--disabled"
545
- ].filter(Boolean).join(" "), h = i === "xs" ? T.xs : i === "small" ? T.s : T.m;
546
- return /* @__PURE__ */ e.jsxs("div", { className: _, children: [
547
- o && /* @__PURE__ */ e.jsx("label", { className: "ds-stepper-label", children: o }),
548
- /* @__PURE__ */ e.jsxs("div", { className: E, children: [
549
- /* @__PURE__ */ e.jsx(
551
+ `ds-stepper--${l}`,
552
+ i && "ds-stepper--disabled"
553
+ ].filter(Boolean).join(" "), R = l === "xs" ? T[1] : l === "small" ? T[2] : T[3];
554
+ return /* @__PURE__ */ r.jsxs("div", { className: j, children: [
555
+ t && /* @__PURE__ */ r.jsx("label", { className: "ds-stepper-label", children: t }),
556
+ /* @__PURE__ */ r.jsxs("div", { className: v, children: [
557
+ /* @__PURE__ */ r.jsx(
550
558
  "button",
551
559
  {
552
560
  type: "button",
553
561
  className: "ds-stepper-button ds-stepper-button--minus",
554
- onClick: x,
555
- disabled: c || s <= l,
562
+ onClick: h,
563
+ disabled: i || e <= c,
556
564
  "aria-label": "Decrease",
557
- children: /* @__PURE__ */ e.jsx(ce, { size: h, strokeWidth: 1.5 })
565
+ children: /* @__PURE__ */ r.jsx(ve, { size: R, strokeWidth: 1.5 })
558
566
  }
559
567
  ),
560
- /* @__PURE__ */ e.jsx(
568
+ /* @__PURE__ */ r.jsx(
561
569
  "input",
562
570
  {
563
571
  type: "number",
564
572
  className: "ds-stepper-input",
565
- value: s,
566
- onChange: b,
567
- min: l,
573
+ value: e,
574
+ onChange: x,
575
+ min: c,
568
576
  max: n,
569
577
  step: a,
570
- disabled: c,
578
+ disabled: i,
571
579
  ...d
572
580
  }
573
581
  ),
574
- /* @__PURE__ */ e.jsx(
582
+ /* @__PURE__ */ r.jsx(
575
583
  "button",
576
584
  {
577
585
  type: "button",
578
586
  className: "ds-stepper-button ds-stepper-button--plus",
579
587
  onClick: u,
580
- disabled: c || s >= n,
588
+ disabled: i || e >= n,
581
589
  "aria-label": "Increase",
582
- children: /* @__PURE__ */ e.jsx(le, { size: h, strokeWidth: 1.5 })
590
+ children: /* @__PURE__ */ r.jsx(je, { size: R, strokeWidth: 1.5 })
583
591
  }
584
592
  )
585
593
  ] }),
586
- m && !p && /* @__PURE__ */ e.jsx("div", { className: "ds-stepper-hint", children: m }),
587
- p && /* @__PURE__ */ e.jsx("div", { className: "ds-stepper-error", children: p })
594
+ p && !f && /* @__PURE__ */ r.jsx("div", { className: "ds-stepper-hint", children: p }),
595
+ f && /* @__PURE__ */ r.jsx("div", { className: "ds-stepper-error", children: f })
588
596
  ] });
589
597
  }
590
- function Re({
591
- children: o,
592
- padding: s = "m",
593
- variant: r = "info",
594
- hover: l = !1,
598
+ function Ye({
599
+ children: t,
600
+ padding: e = "m",
601
+ variant: s = "info",
602
+ hover: c = !1,
595
603
  // deprecated, use variant="interactive"
596
604
  onClick: n,
597
605
  href: a,
598
- disabled: i = !1,
599
- ...c
606
+ disabled: l = !1,
607
+ ...i
600
608
  }) {
601
- const p = (l ? "interactive" : r) === "interactive" || n || a, d = [
609
+ const f = (c ? "interactive" : s) === "interactive" || n || a, d = [
602
610
  "ds-card",
603
- `ds-card--${s}`,
604
- p && "ds-card--interactive"
611
+ `ds-card--${e}`,
612
+ f && "ds-card--interactive"
605
613
  ].filter(Boolean).join(" ");
606
614
  if (a) {
607
- const b = (_) => {
608
- if (i) {
609
- _.preventDefault();
615
+ const x = (j) => {
616
+ if (l) {
617
+ j.preventDefault();
610
618
  return;
611
619
  }
612
- _.metaKey || _.ctrlKey || _.button === 1 || (_.preventDefault(), n == null || n(_));
620
+ j.metaKey || j.ctrlKey || j.button === 1 || (j.preventDefault(), n == null || n(j));
613
621
  };
614
- return /* @__PURE__ */ e.jsx(
622
+ return /* @__PURE__ */ r.jsx(
615
623
  "a",
616
624
  {
617
625
  className: d,
618
- href: i ? void 0 : a,
619
- onClick: b,
620
- "aria-disabled": i ? "true" : void 0,
621
- ...c,
622
- children: o
626
+ href: l ? void 0 : a,
627
+ onClick: x,
628
+ "aria-disabled": l ? "true" : void 0,
629
+ ...i,
630
+ children: t
623
631
  }
624
632
  );
625
633
  }
626
- const u = p && n ? "button" : "div", x = p && n ? {
634
+ const u = f && n ? "button" : "div", h = f && n ? {
627
635
  type: "button",
628
636
  onClick: n,
629
- disabled: i
637
+ disabled: l
630
638
  } : {};
631
- return /* @__PURE__ */ e.jsx(
639
+ return /* @__PURE__ */ r.jsx(
632
640
  u,
633
641
  {
634
642
  className: d,
635
- role: p && !n ? "article" : void 0,
636
- ...x,
637
- ...c,
638
- children: o
643
+ role: f && !n ? "article" : void 0,
644
+ ...h,
645
+ ...i,
646
+ children: t
639
647
  }
640
648
  );
641
649
  }
642
- function ge({ children: o, ...s }) {
643
- return /* @__PURE__ */ e.jsx("h1", { className: "ds-h1", ...s, children: o });
650
+ function ze({ children: t, ...e }) {
651
+ return /* @__PURE__ */ r.jsx("h1", { className: "ds-h1", ...e, children: t });
644
652
  }
645
- function ke({ children: o, ...s }) {
646
- return /* @__PURE__ */ e.jsx("h2", { className: "ds-h2", ...s, children: o });
653
+ function Ve({ children: t, ...e }) {
654
+ return /* @__PURE__ */ r.jsx("h2", { className: "ds-h2", ...e, children: t });
647
655
  }
648
- function $e({ children: o, ...s }) {
649
- return /* @__PURE__ */ e.jsx("h3", { className: "ds-h3", ...s, children: o });
656
+ function Ue({ children: t, ...e }) {
657
+ return /* @__PURE__ */ r.jsx("h3", { className: "ds-h3", ...e, children: t });
650
658
  }
651
- function Te({ children: o, ...s }) {
652
- return /* @__PURE__ */ e.jsx("h4", { className: "ds-h4", ...s, children: o });
659
+ function He({ children: t, ...e }) {
660
+ return /* @__PURE__ */ r.jsx("h4", { className: "ds-h4", ...e, children: t });
653
661
  }
654
- function Oe({ children: o, secondary: s = !1, ...r }) {
655
- return /* @__PURE__ */ e.jsx("p", { className: `ds-p1 ${s ? "ds-p1--secondary" : ""}`, ...r, children: o });
662
+ function Ge({ children: t, secondary: e = !1, ...s }) {
663
+ return /* @__PURE__ */ r.jsx("p", { className: `ds-p1 ${e ? "ds-p1--secondary" : ""}`, ...s, children: t });
656
664
  }
657
- function Ae({ children: o, secondary: s = !1, ...r }) {
658
- return /* @__PURE__ */ e.jsx("p", { className: `ds-p2 ${s ? "ds-p2--secondary" : ""}`, ...r, children: o });
665
+ function qe({ children: t, secondary: e = !1, ...s }) {
666
+ return /* @__PURE__ */ r.jsx("p", { className: `ds-p2 ${e ? "ds-p2--secondary" : ""}`, ...s, children: t });
659
667
  }
660
- function Ie({ children: o, secondary: s = !1, ...r }) {
661
- return /* @__PURE__ */ e.jsx("p", { className: `ds-p3 ${s ? "ds-p3--secondary" : ""}`, ...r, children: o });
668
+ function Xe({ children: t, secondary: e = !1, ...s }) {
669
+ return /* @__PURE__ */ r.jsx("p", { className: `ds-p3 ${e ? "ds-p3--secondary" : ""}`, ...s, children: t });
662
670
  }
663
- function Se({
664
- children: o,
665
- variant: s = "default",
666
- size: r = "m",
667
- role: l,
671
+ function Je({
672
+ children: t,
673
+ variant: e = "default",
674
+ size: s = "m",
675
+ role: c,
668
676
  ...n
669
677
  }) {
670
678
  const a = [
671
679
  "ds-badge",
672
- `ds-badge--${s}`,
673
- `ds-badge--${r}`
674
- ].filter(Boolean).join(" "), i = l || (["info", "success", "warning", "error"].includes(s) ? "status" : void 0);
675
- return /* @__PURE__ */ e.jsx("span", { className: a, role: i, ...n, children: o });
680
+ `ds-badge--${e}`,
681
+ `ds-badge--${s}`
682
+ ].filter(Boolean).join(" "), l = c || (["info", "success", "warning", "error"].includes(e) ? "status" : void 0);
683
+ return /* @__PURE__ */ r.jsx("span", { className: a, role: l, ...n, children: t });
676
684
  }
677
- const he = {
678
- info: fe,
679
- success: ue,
680
- warning: de,
681
- error: ie
685
+ const $e = {
686
+ info: be,
687
+ success: pe,
688
+ warning: me,
689
+ error: fe
682
690
  };
683
- function Pe({
684
- children: o,
685
- variant: s = "info",
686
- title: r,
687
- onClose: l,
691
+ function Ce({
692
+ children: t,
693
+ variant: e = "info",
694
+ title: s,
695
+ onClose: c,
688
696
  role: n,
689
697
  ...a
690
698
  }) {
691
- const i = he[s], c = n || (s === "error" ? "alert" : "status");
692
- return /* @__PURE__ */ e.jsxs("div", { className: `ds-alert ds-alert--${s} ${r ? "" : "ds-alert--no-title"}`, role: c, ...a, children: [
693
- i && /* @__PURE__ */ e.jsx("div", { className: "ds-alert__icon", children: /* @__PURE__ */ e.jsx(i, { size: T.m, strokeWidth: 1.5 }) }),
694
- /* @__PURE__ */ e.jsxs("div", { className: "ds-alert__content", children: [
695
- r && /* @__PURE__ */ e.jsx("div", { className: "ds-alert__title", children: r }),
696
- o && /* @__PURE__ */ e.jsx("div", { className: "ds-alert__message", children: o })
699
+ const l = $e[e], i = n || (e === "error" ? "alert" : "status");
700
+ return /* @__PURE__ */ r.jsxs("div", { className: `ds-alert ds-alert--${e} ${s ? "" : "ds-alert--no-title"}`, role: i, ...a, children: [
701
+ l && /* @__PURE__ */ r.jsx("div", { className: "ds-alert__icon", children: /* @__PURE__ */ r.jsx(l, { size: T[3], strokeWidth: 1.5 }) }),
702
+ /* @__PURE__ */ r.jsxs("div", { className: "ds-alert__content", children: [
703
+ s && /* @__PURE__ */ r.jsx("div", { className: "ds-alert__title", children: s }),
704
+ t && /* @__PURE__ */ r.jsx("div", { className: "ds-alert__message", children: t })
697
705
  ] }),
698
- l && /* @__PURE__ */ e.jsx(
706
+ c && /* @__PURE__ */ r.jsx(
699
707
  "button",
700
708
  {
701
709
  type: "button",
702
710
  className: "ds-alert__close",
703
- onClick: l,
711
+ onClick: c,
704
712
  "aria-label": "Close alert",
705
- children: /* @__PURE__ */ e.jsx(re, { size: T.m, strokeWidth: 1.5 })
713
+ children: /* @__PURE__ */ r.jsx(se, { size: T[3], strokeWidth: 1.5 })
706
714
  }
707
715
  )
708
716
  ] });
709
717
  }
710
- function De({
711
- children: o,
712
- title: s,
713
- onClose: r,
714
- size: l = "m",
718
+ function Ke({
719
+ children: t,
720
+ title: e,
721
+ onClose: s,
722
+ size: c = "m",
715
723
  ...n
716
724
  }) {
717
- const a = F(null), i = $.useId();
718
- M(() => {
719
- const d = (x) => {
720
- x.key === "Escape" && (r == null || r());
721
- }, u = (x) => {
722
- a.current && !a.current.contains(x.target) && (r == null || r());
725
+ const a = B(null), l = S.useId();
726
+ L(() => {
727
+ const d = (h) => {
728
+ h.key === "Escape" && (s == null || s());
729
+ }, u = (h) => {
730
+ a.current && !a.current.contains(h.target) && (s == null || s());
723
731
  };
724
732
  return document.addEventListener("keydown", d), document.addEventListener("mousedown", u), () => {
725
733
  document.removeEventListener("keydown", d), document.removeEventListener("mousedown", u);
726
734
  };
727
- }, [r]);
728
- const c = $.Children.toArray(o), m = c.find((d) => (d == null ? void 0 : d.type) === se), p = c.filter((d) => (d == null ? void 0 : d.type) !== se);
729
- return /* @__PURE__ */ e.jsx("div", { className: "ds-modal-overlay", ...n, children: /* @__PURE__ */ e.jsxs(
735
+ }, [s]);
736
+ const i = S.Children.toArray(t), p = i.find((d) => (d == null ? void 0 : d.type) === de), f = i.filter((d) => (d == null ? void 0 : d.type) !== de);
737
+ return /* @__PURE__ */ r.jsx("div", { className: "ds-modal-overlay", ...n, children: /* @__PURE__ */ r.jsxs(
730
738
  "div",
731
739
  {
732
- className: `ds-modal ds-modal--${l}`,
740
+ className: `ds-modal ds-modal--${c}`,
733
741
  ref: a,
734
742
  role: "dialog",
735
743
  "aria-modal": "true",
736
- "aria-labelledby": s ? i : void 0,
744
+ "aria-labelledby": e ? l : void 0,
737
745
  children: [
738
- (s || r) && /* @__PURE__ */ e.jsxs("div", { className: "ds-modal__header", children: [
739
- s && /* @__PURE__ */ e.jsx("h3", { id: i, className: "ds-modal__title", children: s }),
740
- r && /* @__PURE__ */ e.jsx(
741
- be,
746
+ (e || s) && /* @__PURE__ */ r.jsxs("div", { className: "ds-modal__header", children: [
747
+ e && /* @__PURE__ */ r.jsx("h3", { id: l, className: "ds-modal__title", children: e }),
748
+ s && /* @__PURE__ */ r.jsx(
749
+ ke,
742
750
  {
743
751
  variant: "ghost",
744
752
  size: "small",
745
- icon: /* @__PURE__ */ e.jsx(re, { size: T.s, strokeWidth: 1.5 }),
746
- onClick: r,
753
+ icon: /* @__PURE__ */ r.jsx(se, { size: T[2], strokeWidth: 1.5 }),
754
+ onClick: s,
747
755
  "aria-label": "Close modal"
748
756
  }
749
757
  )
750
758
  ] }),
751
- /* @__PURE__ */ e.jsx("div", { className: "ds-modal__body", children: p }),
752
- m
759
+ /* @__PURE__ */ r.jsx("div", { className: "ds-modal__body", children: f }),
760
+ p
753
761
  ]
754
762
  }
755
763
  ) });
756
764
  }
757
- function se({ children: o }) {
758
- return /* @__PURE__ */ e.jsx("div", { className: "ds-modal__footer", children: o });
765
+ function de({ children: t }) {
766
+ return /* @__PURE__ */ r.jsx("div", { className: "ds-modal__footer", children: t });
759
767
  }
760
- function je({
761
- children: o,
762
- title: s = "Code",
763
- defaultExpanded: r = !1,
764
- padding: l = "s",
765
- ...n
768
+ function Re({
769
+ children: t,
770
+ title: e = "Code",
771
+ defaultExpanded: s = !1,
772
+ expanded: c,
773
+ onToggle: n,
774
+ padding: a = "s",
775
+ className: l = "",
776
+ ...i
766
777
  }) {
767
- const [a, i] = P(r), c = [
778
+ const [p, f] = g(s), d = c !== void 0, u = d ? c : p, h = () => {
779
+ d ? n == null || n(!c) : f((j) => !j);
780
+ }, x = [
768
781
  "ds-code-accordion",
769
- `ds-code-accordion--${l}`
782
+ `ds-code-accordion--${a}`,
783
+ l
770
784
  ].filter(Boolean).join(" ");
771
- return /* @__PURE__ */ e.jsxs("div", { className: c, children: [
772
- /* @__PURE__ */ e.jsxs(
785
+ return /* @__PURE__ */ r.jsxs("div", { className: x, ...i, children: [
786
+ /* @__PURE__ */ r.jsxs(
773
787
  "button",
774
788
  {
775
789
  type: "button",
776
790
  className: "ds-code-accordion__header",
777
- onClick: () => i(!a),
778
- "aria-expanded": a,
791
+ onClick: h,
792
+ "aria-expanded": u,
779
793
  children: [
780
- /* @__PURE__ */ e.jsx("span", { className: "ds-code-accordion__title", children: s }),
781
- /* @__PURE__ */ e.jsx(
782
- G,
794
+ /* @__PURE__ */ r.jsx("span", { className: "ds-code-accordion__title", children: e }),
795
+ /* @__PURE__ */ r.jsx(
796
+ C,
783
797
  {
784
- size: T.s,
798
+ size: T[2],
785
799
  strokeWidth: 1.5,
786
- className: `ds-code-accordion__icon ${a ? "ds-code-accordion__icon--expanded" : ""}`
800
+ className: `ds-code-accordion__icon ${u ? "ds-code-accordion__icon--expanded" : ""}`
787
801
  }
788
802
  )
789
803
  ]
790
804
  }
791
805
  ),
792
- a && /* @__PURE__ */ e.jsx("pre", { className: "ds-code-accordion__content", ...n, children: /* @__PURE__ */ e.jsx("code", { children: o }) })
806
+ u && /* @__PURE__ */ r.jsx("pre", { className: "ds-code-accordion__content", children: /* @__PURE__ */ r.jsx("code", { children: t }) })
793
807
  ] });
794
808
  }
795
- function We({ children: o, block: s = !1, collapsible: r = !1, title: l = "Code", defaultExpanded: n = !1, ...a }) {
796
- return s ? r ? /* @__PURE__ */ e.jsx(je, { title: l, defaultExpanded: n, ...a, children: o }) : /* @__PURE__ */ e.jsx("pre", { className: "ds-code-block", ...a, children: /* @__PURE__ */ e.jsx("code", { children: o }) }) : /* @__PURE__ */ e.jsx("code", { className: "ds-code-inline", ...a, children: o });
809
+ function Ze({ children: t, block: e = !1, collapsible: s = !1, title: c = "Code", defaultExpanded: n = !1, ...a }) {
810
+ return e ? s ? /* @__PURE__ */ r.jsx(Re, { title: c, defaultExpanded: n, ...a, children: t }) : /* @__PURE__ */ r.jsx("pre", { className: "ds-code-block", ...a, children: /* @__PURE__ */ r.jsx("code", { children: t }) }) : /* @__PURE__ */ r.jsx("code", { className: "ds-code-inline", ...a, children: t });
797
811
  }
798
- function Fe({ href: o, children: s, onClick: r, target: l, rel: n, ...a }) {
799
- const c = l === "_blank" ? n ? `${n} noopener noreferrer` : "noopener noreferrer" : n;
800
- return /* @__PURE__ */ e.jsx(
812
+ function Qe({ href: t, children: e, onClick: s, target: c, rel: n, ...a }) {
813
+ const i = c === "_blank" ? n ? `${n} noopener noreferrer` : "noopener noreferrer" : n;
814
+ return /* @__PURE__ */ r.jsx(
801
815
  "a",
802
816
  {
803
- href: o,
817
+ href: t,
804
818
  className: "ds-link",
805
- onClick: r,
806
- target: l,
807
- rel: c,
819
+ onClick: s,
820
+ target: c,
821
+ rel: i,
808
822
  ...a,
809
- children: s
823
+ children: e
810
824
  }
811
825
  );
812
826
  }
813
- function Me({ children: o, size: s = "m", variant: r = "ghost", ...l }) {
814
- return /* @__PURE__ */ e.jsx("div", { className: "ds-tabs", role: "tablist", ...l, children: $.Children.map(o, (n) => $.isValidElement(n) ? $.cloneElement(n, { size: s, variant: r }) : n) });
827
+ function et({ children: t, size: e = "m", variant: s = "ghost", ...c }) {
828
+ return /* @__PURE__ */ r.jsx("div", { className: "ds-tabs", role: "tablist", ...c, children: S.Children.map(t, (n) => S.isValidElement(n) ? S.cloneElement(n, { size: e, variant: s }) : n) });
815
829
  }
816
- function Be({ children: o, selected: s = !1, onClick: r, size: l = "m", variant: n = "ghost", disabled: a = !1, icon: i, href: c, ...m }) {
817
- const p = i && !o, d = [
830
+ function tt({ children: t, selected: e = !1, onClick: s, size: c = "m", variant: n = "ghost", disabled: a = !1, icon: l, href: i, ...p }) {
831
+ const f = l && !t, d = [
818
832
  "ds-tab",
819
- `ds-tab--${l}`,
833
+ `ds-tab--${c}`,
820
834
  `ds-tab--${n}`,
821
- s && "ds-tab--selected",
822
- p && "ds-tab--icon-only"
823
- ].filter(Boolean).join(" "), u = /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
824
- i && /* @__PURE__ */ e.jsx("span", { className: "ds-tab-icon", children: i }),
825
- o
835
+ e && "ds-tab--selected",
836
+ f && "ds-tab--icon-only"
837
+ ].filter(Boolean).join(" "), u = /* @__PURE__ */ r.jsxs(r.Fragment, { children: [
838
+ l && /* @__PURE__ */ r.jsx("span", { className: "ds-tab-icon", children: l }),
839
+ t
826
840
  ] });
827
- if (c) {
828
- const x = (b) => {
841
+ if (i) {
842
+ const h = (x) => {
829
843
  if (a) {
830
- b.preventDefault();
844
+ x.preventDefault();
831
845
  return;
832
846
  }
833
- b.metaKey || b.ctrlKey || b.button === 1 || (b.preventDefault(), r == null || r(b));
847
+ x.metaKey || x.ctrlKey || x.button === 1 || (x.preventDefault(), s == null || s(x));
834
848
  };
835
- return /* @__PURE__ */ e.jsx(
849
+ return /* @__PURE__ */ r.jsx(
836
850
  "a",
837
851
  {
838
852
  role: "tab",
839
- "aria-current": s ? "page" : void 0,
853
+ "aria-current": e ? "page" : void 0,
840
854
  "aria-disabled": a ? "true" : void 0,
841
855
  className: d,
842
- href: a ? void 0 : c,
843
- onClick: x,
844
- ...m,
856
+ href: a ? void 0 : i,
857
+ onClick: h,
858
+ ...p,
845
859
  children: u
846
860
  }
847
861
  );
848
862
  }
849
- return /* @__PURE__ */ e.jsx(
863
+ return /* @__PURE__ */ r.jsx(
850
864
  "button",
851
865
  {
852
866
  role: "tab",
853
- "aria-selected": s,
867
+ "aria-selected": e,
854
868
  className: d,
855
- onClick: r,
869
+ onClick: s,
856
870
  disabled: a,
857
- ...m,
871
+ ...p,
858
872
  children: u
859
873
  }
860
874
  );
861
875
  }
862
- function Le({
863
- children: o,
864
- title: s,
865
- defaultExpanded: r = !1,
866
- padding: l = "m",
867
- ...n
876
+ function st({
877
+ children: t,
878
+ title: e,
879
+ defaultExpanded: s = !1,
880
+ expanded: c,
881
+ onToggle: n,
882
+ padding: a = "m",
883
+ ...l
868
884
  }) {
869
- const [a, i] = P(r), c = [
885
+ const [i, p] = g(s), f = c !== void 0, d = f ? c : i, u = () => {
886
+ f ? n == null || n(!c) : p((x) => !x);
887
+ }, h = [
870
888
  "ds-accordion",
871
- `ds-accordion--${l}`
889
+ `ds-accordion--${a}`
872
890
  ].filter(Boolean).join(" ");
873
- return /* @__PURE__ */ e.jsxs("div", { className: c, ...n, children: [
874
- /* @__PURE__ */ e.jsxs(
891
+ return /* @__PURE__ */ r.jsxs("div", { className: h, ...l, children: [
892
+ /* @__PURE__ */ r.jsxs(
875
893
  "button",
876
894
  {
877
895
  type: "button",
878
896
  className: "ds-accordion__header",
879
- onClick: () => i(!a),
880
- "aria-expanded": a,
897
+ onClick: u,
898
+ "aria-expanded": d,
881
899
  children: [
882
- /* @__PURE__ */ e.jsx("span", { className: "ds-accordion__title", children: s }),
883
- /* @__PURE__ */ e.jsx(
884
- G,
900
+ /* @__PURE__ */ r.jsx("span", { className: "ds-accordion__title", children: e }),
901
+ /* @__PURE__ */ r.jsx(
902
+ C,
885
903
  {
886
- size: T.s,
904
+ size: T[2],
887
905
  strokeWidth: 1.5,
888
- className: `ds-accordion__icon ${a ? "ds-accordion__icon--expanded" : ""}`
906
+ className: `ds-accordion__icon ${d ? "ds-accordion__icon--expanded" : ""}`
889
907
  }
890
908
  )
891
909
  ]
892
910
  }
893
911
  ),
894
- a && /* @__PURE__ */ e.jsx("div", { className: "ds-accordion__content", children: o })
912
+ d && /* @__PURE__ */ r.jsx("div", { className: "ds-accordion__content", children: t })
895
913
  ] });
896
914
  }
897
- function Ye({
898
- children: o,
899
- content: s,
900
- position: r,
901
- ...l
902
- }) {
903
- const [n, a] = P(!1), [i, c] = P(r || "top"), [m, p] = P({ x: 0, arrowOffset: 0 }), d = F(null), u = F(null), x = F(!1);
904
- M(() => {
905
- n && !r && d.current && u.current ? requestAnimationFrame(() => {
906
- if (!d.current || !u.current) return;
907
- const h = d.current.getBoundingClientRect(), v = u.current.getBoundingClientRect(), g = window.innerHeight, k = window.innerWidth, R = h.top, I = g - h.bottom, y = h.left, O = k - h.right, S = v.height, A = v.width;
908
- if (R >= S + 8)
909
- c("top");
910
- else if (I >= S + 8)
911
- c("bottom");
912
- else if (O >= A + 8)
913
- c("right");
914
- else if (y >= A + 8)
915
- c("left");
916
- else {
917
- const D = Math.max(R, I, y, O);
918
- c(D === R ? "top" : D === I ? "bottom" : D === O ? "right" : "left");
919
- }
920
- }) : r && c(r);
921
- }, [n, r]), M(() => {
922
- n && u.current && d.current ? requestAnimationFrame(() => {
923
- if (!u.current || !d.current) return;
924
- const h = u.current.getBoundingClientRect(), v = window.innerWidth, g = 8;
925
- let k = 0, R = 0;
926
- (i === "top" || i === "bottom") && (h.right > v - g ? (k = v - g - h.right, R = -k) : h.left < g && (k = g - h.left, R = -k)), p({ x: k, arrowOffset: R });
927
- }) : p({ x: 0, arrowOffset: 0 });
928
- }, [n, i]), M(() => {
915
+ const O = 8, Y = 8;
916
+ function Te(t, e, s) {
917
+ const c = window.innerWidth;
918
+ let n, a;
919
+ switch (t) {
920
+ case "top":
921
+ n = e.top - s.height - O, a = e.left + e.width / 2 - s.width / 2;
922
+ break;
923
+ case "bottom":
924
+ n = e.bottom + O, a = e.left + e.width / 2 - s.width / 2;
925
+ break;
926
+ case "left":
927
+ n = e.top + e.height / 2 - s.height / 2, a = e.left - s.width - O;
928
+ break;
929
+ case "right":
930
+ n = e.top + e.height / 2 - s.height / 2, a = e.right + O;
931
+ break;
932
+ default:
933
+ n = e.bottom + O, a = e.left;
934
+ }
935
+ const l = Math.max(Y, Math.min(c - s.width - Y, a)), i = a - l;
936
+ return { top: n, left: l, arrowOffset: i };
937
+ }
938
+ function Se(t, e, s) {
939
+ const c = window.innerWidth, n = window.innerHeight;
940
+ if (t.top >= e + O + Y) return "top";
941
+ if (n - t.bottom >= e + O + Y) return "bottom";
942
+ if (c - t.right >= s + O + Y) return "right";
943
+ if (t.left >= s + O + Y) return "left";
944
+ const a = Math.max(t.top, n - t.bottom, t.left, c - t.right);
945
+ return a === t.top ? "top" : a === n - t.bottom ? "bottom" : a === c - t.right ? "right" : "left";
946
+ }
947
+ function rt({ children: t, content: e, position: s, ...c }) {
948
+ const [n, a] = g(!1), [l, i] = g({ visibility: "hidden" }), [p, f] = g(s || "top"), d = B(null), u = B(null), h = B(!1), x = () => {
949
+ if (!d.current || !u.current) return;
950
+ const v = d.current.getBoundingClientRect(), R = u.current.getBoundingClientRect(), $ = s || Se(v, R.height, R.width), { top: m, left: _, arrowOffset: y } = Te($, v, R);
951
+ f($), i({
952
+ position: "fixed",
953
+ top: m,
954
+ left: _,
955
+ visibility: "visible",
956
+ "--arrow-offset": `${y}px`
957
+ });
958
+ };
959
+ if (L(() => {
929
960
  if (!n) return;
930
- const h = (v) => {
931
- d.current && !d.current.contains(v.target) && a(!1);
961
+ i({ position: "fixed", visibility: "hidden" });
962
+ const v = requestAnimationFrame(x);
963
+ return window.addEventListener("scroll", x, !0), window.addEventListener("resize", x), () => {
964
+ cancelAnimationFrame(v), window.removeEventListener("scroll", x, !0), window.removeEventListener("resize", x);
932
965
  };
933
- return document.addEventListener("touchstart", h), () => {
934
- document.removeEventListener("touchstart", h);
966
+ }, [n, s]), L(() => {
967
+ if (!n) return;
968
+ const v = (R) => {
969
+ d.current && !d.current.contains(R.target) && a(!1);
935
970
  };
936
- }, [n]);
937
- const b = () => {
938
- x.current = !0, a((h) => !h);
939
- }, _ = () => {
940
- x.current || a(!0);
941
- }, E = () => {
942
- x.current || a(!1);
943
- };
944
- return s ? /* @__PURE__ */ e.jsxs(
971
+ return document.addEventListener("touchstart", v), () => document.removeEventListener("touchstart", v);
972
+ }, [n]), !e) return t;
973
+ const j = n && /* @__PURE__ */ r.jsx(
974
+ "div",
975
+ {
976
+ ref: u,
977
+ className: `ds-tooltip ds-tooltip--${p}`,
978
+ role: "tooltip",
979
+ style: l,
980
+ children: e
981
+ }
982
+ );
983
+ return /* @__PURE__ */ r.jsxs(
945
984
  "div",
946
985
  {
947
986
  ref: d,
948
987
  className: "ds-tooltip-wrapper",
949
- onMouseEnter: _,
950
- onMouseLeave: E,
951
- onTouchStart: b,
952
- ...l,
988
+ onMouseEnter: () => {
989
+ h.current || a(!0);
990
+ },
991
+ onMouseLeave: () => {
992
+ h.current || a(!1);
993
+ },
994
+ onTouchStart: () => {
995
+ h.current = !0, a((v) => !v);
996
+ },
997
+ ...c,
953
998
  children: [
954
- o,
955
- n && /* @__PURE__ */ e.jsx(
956
- "div",
957
- {
958
- ref: u,
959
- className: `ds-tooltip ds-tooltip--${i}`,
960
- role: "tooltip",
961
- style: {
962
- "--tooltip-offset-x": `${m.x}px`,
963
- "--arrow-offset": `${m.arrowOffset}px`
964
- },
965
- children: s
966
- }
967
- )
999
+ t,
1000
+ typeof document < "u" && J.createPortal(j, document.body)
968
1001
  ]
969
1002
  }
970
- ) : o;
1003
+ );
971
1004
  }
972
- function Ve({
973
- checked: o = !1,
974
- onChange: s,
975
- size: r = "m",
976
- disabled: l = !1,
1005
+ function nt({
1006
+ checked: t = !1,
1007
+ onChange: e,
1008
+ size: s = "m",
1009
+ disabled: c = !1,
977
1010
  label: n,
978
1011
  id: a,
979
- ...i
1012
+ ...l
980
1013
  }) {
981
- const c = a || `toggle-${$.useId()}`, m = [
1014
+ const i = a || `toggle-${S.useId()}`, p = [
982
1015
  "ds-toggle",
983
- `ds-toggle--${r}`,
984
- l && "ds-toggle--disabled"
1016
+ `ds-toggle--${s}`,
1017
+ c && "ds-toggle--disabled"
985
1018
  ].filter(Boolean).join(" ");
986
- return /* @__PURE__ */ e.jsxs("label", { className: m, htmlFor: c, children: [
987
- /* @__PURE__ */ e.jsx(
1019
+ return /* @__PURE__ */ r.jsxs("label", { className: p, htmlFor: i, children: [
1020
+ /* @__PURE__ */ r.jsx(
988
1021
  "input",
989
1022
  {
990
1023
  type: "checkbox",
991
- id: c,
1024
+ id: i,
992
1025
  className: "ds-toggle__input",
993
- checked: o,
994
- onChange: (p) => s == null ? void 0 : s(p.target.checked),
995
- disabled: l,
996
- ...i
1026
+ checked: t,
1027
+ onChange: (f) => e == null ? void 0 : e(f.target.checked),
1028
+ disabled: c,
1029
+ ...l
997
1030
  }
998
1031
  ),
999
- /* @__PURE__ */ e.jsx("span", { className: "ds-toggle__track", children: /* @__PURE__ */ e.jsx("span", { className: "ds-toggle__thumb" }) }),
1000
- n && /* @__PURE__ */ e.jsx("span", { className: "ds-toggle__label", children: n })
1032
+ /* @__PURE__ */ r.jsx("span", { className: "ds-toggle__track", children: /* @__PURE__ */ r.jsx("span", { className: "ds-toggle__thumb" }) }),
1033
+ n && /* @__PURE__ */ r.jsx("span", { className: "ds-toggle__label", children: n })
1001
1034
  ] });
1002
1035
  }
1003
- function He({
1004
- checked: o = !1,
1005
- onChange: s,
1006
- size: r = "m",
1007
- disabled: l = !1,
1036
+ function at({
1037
+ checked: t = !1,
1038
+ onChange: e,
1039
+ size: s = "m",
1040
+ disabled: c = !1,
1008
1041
  label: n,
1009
1042
  id: a,
1010
- ...i
1043
+ ...l
1011
1044
  }) {
1012
- const c = a || `checkbox-${$.useId()}`, m = [
1045
+ const i = a || `checkbox-${S.useId()}`, p = [
1013
1046
  "ds-checkbox",
1014
- `ds-checkbox--${r}`,
1015
- l && "ds-checkbox--disabled"
1016
- ].filter(Boolean).join(" "), p = r === "xs" ? 10 : r === "small" ? 14 : r === "large" ? 20 : 16;
1017
- return /* @__PURE__ */ e.jsxs("label", { className: m, htmlFor: c, children: [
1018
- /* @__PURE__ */ e.jsx(
1047
+ `ds-checkbox--${s}`,
1048
+ c && "ds-checkbox--disabled"
1049
+ ].filter(Boolean).join(" "), f = s === "xs" ? 10 : s === "small" ? 14 : s === "large" ? 20 : 16;
1050
+ return /* @__PURE__ */ r.jsxs("label", { className: p, htmlFor: i, children: [
1051
+ /* @__PURE__ */ r.jsx(
1019
1052
  "input",
1020
1053
  {
1021
1054
  type: "checkbox",
1022
- id: c,
1055
+ id: i,
1023
1056
  className: "ds-checkbox__input",
1024
- checked: o,
1025
- onChange: (d) => s == null ? void 0 : s(d.target.checked),
1026
- disabled: l,
1027
- ...i
1057
+ checked: t,
1058
+ onChange: (d) => e == null ? void 0 : e(d.target.checked),
1059
+ disabled: c,
1060
+ ...l
1028
1061
  }
1029
1062
  ),
1030
- /* @__PURE__ */ e.jsx("span", { className: "ds-checkbox__box", children: o && /* @__PURE__ */ e.jsx(
1031
- pe,
1063
+ /* @__PURE__ */ r.jsx("span", { className: "ds-checkbox__box", children: t && /* @__PURE__ */ r.jsx(
1064
+ _e,
1032
1065
  {
1033
- size: p,
1066
+ size: f,
1034
1067
  strokeWidth: 2.5,
1035
1068
  className: "ds-checkbox__icon"
1036
1069
  }
1037
1070
  ) }),
1038
- n && /* @__PURE__ */ e.jsx("span", { className: "ds-checkbox__label", children: n })
1071
+ n && /* @__PURE__ */ r.jsx("span", { className: "ds-checkbox__label", children: n })
1039
1072
  ] });
1040
1073
  }
1041
- function ze({
1042
- checked: o = !1,
1043
- onChange: s,
1044
- size: r = "m",
1045
- disabled: l = !1,
1074
+ function ot({
1075
+ checked: t = !1,
1076
+ onChange: e,
1077
+ size: s = "m",
1078
+ disabled: c = !1,
1046
1079
  label: n,
1047
1080
  name: a,
1048
- value: i,
1049
- id: c,
1050
- ...m
1081
+ value: l,
1082
+ id: i,
1083
+ ...p
1051
1084
  }) {
1052
- const p = c || `radio-${$.useId()}`, d = [
1085
+ const f = i || `radio-${S.useId()}`, d = [
1053
1086
  "ds-radio",
1054
- `ds-radio--${r}`,
1055
- l && "ds-radio--disabled"
1087
+ `ds-radio--${s}`,
1088
+ c && "ds-radio--disabled"
1056
1089
  ].filter(Boolean).join(" ");
1057
- return /* @__PURE__ */ e.jsxs("label", { className: d, htmlFor: p, children: [
1058
- /* @__PURE__ */ e.jsx(
1090
+ return /* @__PURE__ */ r.jsxs("label", { className: d, htmlFor: f, children: [
1091
+ /* @__PURE__ */ r.jsx(
1059
1092
  "input",
1060
1093
  {
1061
1094
  type: "radio",
1062
- id: p,
1095
+ id: f,
1063
1096
  className: "ds-radio__input",
1064
- checked: o,
1065
- onChange: (u) => s == null ? void 0 : s(u.target.checked),
1066
- disabled: l,
1097
+ checked: t,
1098
+ onChange: (u) => e == null ? void 0 : e(u.target.checked),
1099
+ disabled: c,
1067
1100
  name: a,
1068
- value: i,
1069
- ...m
1101
+ value: l,
1102
+ ...p
1070
1103
  }
1071
1104
  ),
1072
- /* @__PURE__ */ e.jsx("span", { className: "ds-radio__circle", children: /* @__PURE__ */ e.jsx("span", { className: "ds-radio__dot" }) }),
1073
- n && /* @__PURE__ */ e.jsx("span", { className: "ds-radio__label", children: n })
1105
+ /* @__PURE__ */ r.jsx("span", { className: "ds-radio__circle", children: /* @__PURE__ */ r.jsx("span", { className: "ds-radio__dot" }) }),
1106
+ n && /* @__PURE__ */ r.jsx("span", { className: "ds-radio__label", children: n })
1074
1107
  ] });
1075
1108
  }
1109
+ function ct({ size: t = "m", color: e = "default", className: s = "", ...c }) {
1110
+ return /* @__PURE__ */ r.jsx(
1111
+ "span",
1112
+ {
1113
+ className: ["ds-spinner", `ds-spinner--${t}`, `ds-spinner--${e}`, s].filter(Boolean).join(" "),
1114
+ role: "status",
1115
+ "aria-label": "Loading",
1116
+ ...c
1117
+ }
1118
+ );
1119
+ }
1120
+ function lt({ width: t, height: e, shape: s = "rect", className: c = "", style: n = {}, ...a }) {
1121
+ return /* @__PURE__ */ r.jsx(
1122
+ "span",
1123
+ {
1124
+ className: ["ds-skeleton", `ds-skeleton--${s}`, c].filter(Boolean).join(" "),
1125
+ style: { width: t, height: e, ...n },
1126
+ "aria-hidden": "true",
1127
+ ...a
1128
+ }
1129
+ );
1130
+ }
1131
+ function ge(t) {
1132
+ let e = 2166136261;
1133
+ for (let s = 0; s < t.length; s++)
1134
+ e ^= t.charCodeAt(s), e = Math.imul(e, 16777619) >>> 0;
1135
+ return e % 360;
1136
+ }
1137
+ function it({ seed: t, icon: e, size: s = 32, className: c = "", style: n = {}, ...a }) {
1138
+ const l = ge(t ?? "");
1139
+ return /* @__PURE__ */ r.jsx(
1140
+ "div",
1141
+ {
1142
+ className: ["ds-avatar", c].filter(Boolean).join(" "),
1143
+ style: { width: s, height: s, "--ds-avatar-h": l, ...n },
1144
+ "aria-hidden": "true",
1145
+ ...a,
1146
+ children: e
1147
+ }
1148
+ );
1149
+ }
1150
+ function dt({
1151
+ children: t,
1152
+ size: e = "compact",
1153
+ stickyTop: s,
1154
+ maxHeight: c,
1155
+ className: n = "",
1156
+ style: a = {},
1157
+ ...l
1158
+ }) {
1159
+ const i = {
1160
+ ...c ? { maxHeight: c } : {},
1161
+ ...s !== void 0 ? { "--ds-table-sticky-top": typeof s == "number" ? `${s}px` : s } : {},
1162
+ ...a
1163
+ };
1164
+ return /* @__PURE__ */ r.jsx(
1165
+ "div",
1166
+ {
1167
+ className: ["ds-table-wrap", c ? "ds-table-wrap--scroll" : ""].filter(Boolean).join(" "),
1168
+ style: i,
1169
+ children: /* @__PURE__ */ r.jsx(
1170
+ "table",
1171
+ {
1172
+ className: ["ds-table", `ds-table--${e}`, n].filter(Boolean).join(" "),
1173
+ ...l,
1174
+ children: t
1175
+ }
1176
+ )
1177
+ }
1178
+ );
1179
+ }
1180
+ function ut({ children: t, ...e }) {
1181
+ return /* @__PURE__ */ r.jsx("thead", { ...e, children: t });
1182
+ }
1183
+ function ft({ children: t, ...e }) {
1184
+ return /* @__PURE__ */ r.jsx("tbody", { ...e, children: t });
1185
+ }
1186
+ function mt({ children: t, interactive: e, selected: s, className: c = "", onClick: n, ...a }) {
1187
+ return /* @__PURE__ */ r.jsx(
1188
+ "tr",
1189
+ {
1190
+ className: [
1191
+ "ds-table-row",
1192
+ e || n ? "ds-table-row--interactive" : "",
1193
+ s ? "ds-table-row--selected" : "",
1194
+ c
1195
+ ].filter(Boolean).join(" "),
1196
+ onClick: n,
1197
+ ...a,
1198
+ children: t
1199
+ }
1200
+ );
1201
+ }
1202
+ function pt({ children: t, align: e = "left", sortDir: s, onSort: c, width: n, className: a = "", style: l = {}, ...i }) {
1203
+ const p = !!c || s !== void 0, f = s === "asc" ? we : s === "desc" ? C : Ne;
1204
+ return /* @__PURE__ */ r.jsx(
1205
+ "th",
1206
+ {
1207
+ className: [
1208
+ "ds-th",
1209
+ p ? "ds-th--sortable" : "",
1210
+ s ? "ds-th--sorted" : "",
1211
+ e !== "left" ? `ds-table-cell--${e}` : "",
1212
+ a
1213
+ ].filter(Boolean).join(" "),
1214
+ onClick: c,
1215
+ style: { width: n, ...l },
1216
+ ...i,
1217
+ children: p ? /* @__PURE__ */ r.jsxs("span", { className: "ds-th__inner", children: [
1218
+ t,
1219
+ /* @__PURE__ */ r.jsx("span", { className: "ds-th__sort-icon", children: /* @__PURE__ */ r.jsx(f, { size: 11, strokeWidth: 2.5 }) })
1220
+ ] }) : t
1221
+ }
1222
+ );
1223
+ }
1224
+ function bt({ children: t, align: e = "left", secondary: s, muted: c, truncate: n, nowrap: a, className: l = "", ...i }) {
1225
+ return /* @__PURE__ */ r.jsx(
1226
+ "td",
1227
+ {
1228
+ className: [
1229
+ "ds-td",
1230
+ e !== "left" ? `ds-table-cell--${e}` : "",
1231
+ s ? "ds-table-cell--secondary" : "",
1232
+ c ? "ds-table-cell--muted" : "",
1233
+ n ? "ds-table-cell--truncate" : "",
1234
+ a ? "ds-table-cell--nowrap" : "",
1235
+ l
1236
+ ].filter(Boolean).join(" "),
1237
+ ...i,
1238
+ children: t
1239
+ }
1240
+ );
1241
+ }
1242
+ function ht({
1243
+ icon: t,
1244
+ title: e,
1245
+ description: s,
1246
+ action: c,
1247
+ size: n = "m",
1248
+ className: a = "",
1249
+ ...l
1250
+ }) {
1251
+ return /* @__PURE__ */ r.jsxs(
1252
+ "div",
1253
+ {
1254
+ className: ["ds-empty-state", `ds-empty-state--${n}`, a].filter(Boolean).join(" "),
1255
+ ...l,
1256
+ children: [
1257
+ t && /* @__PURE__ */ r.jsx("div", { className: "ds-empty-state__icon", children: t }),
1258
+ /* @__PURE__ */ r.jsx("div", { className: "ds-empty-state__title", children: e }),
1259
+ s && /* @__PURE__ */ r.jsx("div", { className: "ds-empty-state__description", children: s }),
1260
+ c && /* @__PURE__ */ r.jsx("div", { className: "ds-empty-state__action", children: c })
1261
+ ]
1262
+ }
1263
+ );
1264
+ }
1265
+ function xt({
1266
+ trigger: t,
1267
+ items: e = [],
1268
+ open: s,
1269
+ onOpenChange: c,
1270
+ align: n = "left",
1271
+ className: a = "",
1272
+ style: l,
1273
+ ...i
1274
+ }) {
1275
+ const [p, f] = g(!1), d = s !== void 0, u = d ? s : p, h = B(null), [x, j] = g({}), v = () => {
1276
+ d ? c == null || c(!1) : f(!1);
1277
+ }, R = () => {
1278
+ const m = !u;
1279
+ d ? c == null || c(m) : f(m);
1280
+ };
1281
+ L(() => {
1282
+ if (!u) return;
1283
+ const m = () => {
1284
+ var y;
1285
+ const _ = (y = h.current) == null ? void 0 : y.getBoundingClientRect();
1286
+ _ && j(
1287
+ n === "right" ? { top: _.bottom + 4, right: window.innerWidth - _.right } : { top: _.bottom + 4, left: _.left }
1288
+ );
1289
+ };
1290
+ return m(), window.addEventListener("scroll", m, !0), window.addEventListener("resize", m), () => {
1291
+ window.removeEventListener("scroll", m, !0), window.removeEventListener("resize", m);
1292
+ };
1293
+ }, [u, n]), L(() => {
1294
+ if (!u) return;
1295
+ const m = (y) => {
1296
+ var A;
1297
+ (A = h.current) != null && A.contains(y.target) || v();
1298
+ }, _ = (y) => {
1299
+ y.key === "Escape" && v();
1300
+ };
1301
+ return document.addEventListener("mousedown", m), document.addEventListener("keydown", _), () => {
1302
+ document.removeEventListener("mousedown", m), document.removeEventListener("keydown", _);
1303
+ };
1304
+ }, [u]);
1305
+ const $ = u && /* @__PURE__ */ r.jsx(
1306
+ "div",
1307
+ {
1308
+ className: ["ds-dropdown__menu", `ds-dropdown__menu--${n}`].join(" "),
1309
+ style: x,
1310
+ children: e.map((m, _) => {
1311
+ if (m.separator)
1312
+ return /* @__PURE__ */ r.jsx("div", { className: "ds-dropdown__separator" }, _);
1313
+ if (m.type === "section")
1314
+ return /* @__PURE__ */ r.jsxs("div", { className: "ds-dropdown__section", children: [
1315
+ m.label && /* @__PURE__ */ r.jsx("div", { className: "ds-dropdown__section-label", children: m.label }),
1316
+ /* @__PURE__ */ r.jsx("div", { className: "ds-dropdown__section-content", children: m.content })
1317
+ ] }, _);
1318
+ const y = !!m.href, A = y ? "a" : "button", I = y ? { href: m.disabled ? void 0 : m.href, "aria-disabled": m.disabled ? "true" : void 0 } : { type: "button", disabled: m.disabled };
1319
+ return /* @__PURE__ */ r.jsxs(
1320
+ A,
1321
+ {
1322
+ className: [
1323
+ "ds-dropdown__item",
1324
+ m.danger && "ds-dropdown__item--danger"
1325
+ ].filter(Boolean).join(" "),
1326
+ ...I,
1327
+ onClick: () => {
1328
+ var P;
1329
+ (P = m.onClick) == null || P.call(m), v();
1330
+ },
1331
+ children: [
1332
+ m.icon && /* @__PURE__ */ r.jsx("span", { className: "ds-dropdown__item-icon", children: m.icon }),
1333
+ /* @__PURE__ */ r.jsx("span", { className: "ds-dropdown__item-label", children: m.label }),
1334
+ m.shortcut && /* @__PURE__ */ r.jsx("span", { className: "ds-dropdown__item-shortcut", children: m.shortcut })
1335
+ ]
1336
+ },
1337
+ _
1338
+ );
1339
+ })
1340
+ }
1341
+ );
1342
+ return /* @__PURE__ */ r.jsxs(
1343
+ "div",
1344
+ {
1345
+ ref: h,
1346
+ className: ["ds-dropdown", a].filter(Boolean).join(" "),
1347
+ style: l,
1348
+ ...i,
1349
+ children: [
1350
+ /* @__PURE__ */ r.jsx("div", { className: "ds-dropdown__trigger", onClick: R, children: t }),
1351
+ typeof document < "u" && J.createPortal($, document.body)
1352
+ ]
1353
+ }
1354
+ );
1355
+ }
1356
+ const ue = {
1357
+ default: be,
1358
+ success: pe,
1359
+ warning: me,
1360
+ error: fe
1361
+ };
1362
+ let z = [];
1363
+ const te = /* @__PURE__ */ new Set();
1364
+ function he() {
1365
+ te.forEach((t) => t([...z]));
1366
+ }
1367
+ function Ae(t) {
1368
+ z = [...z, t], he();
1369
+ }
1370
+ function Ie(t) {
1371
+ z = z.filter((e) => e.id !== t), he();
1372
+ }
1373
+ function vt() {
1374
+ const t = (e, s = {}) => {
1375
+ Ae({
1376
+ id: `${Date.now()}-${Math.random()}`,
1377
+ message: e,
1378
+ type: "default",
1379
+ duration: 4e3,
1380
+ ...s
1381
+ });
1382
+ };
1383
+ return t.success = (e, s) => t(e, { ...s, type: "success" }), t.error = (e, s) => t(e, { ...s, type: "error" }), t.warning = (e, s) => t(e, { ...s, type: "warning" }), { toast: t };
1384
+ }
1385
+ function Pe({ data: t, onDismiss: e }) {
1386
+ const [s, c] = g(!1), n = B(null);
1387
+ L(() => (requestAnimationFrame(() => c(!0)), t.duration > 0 && (n.current = setTimeout(() => a(), t.duration)), () => clearTimeout(n.current)), []);
1388
+ function a() {
1389
+ c(!1), setTimeout(() => e(t.id), 250);
1390
+ }
1391
+ const l = ue[t.type] ?? ue.default;
1392
+ return /* @__PURE__ */ r.jsxs(
1393
+ "div",
1394
+ {
1395
+ className: [
1396
+ "ds-toast",
1397
+ `ds-toast--${t.type}`,
1398
+ s && "ds-toast--visible"
1399
+ ].filter(Boolean).join(" "),
1400
+ role: t.type === "error" ? "alert" : "status",
1401
+ "aria-live": "polite",
1402
+ children: [
1403
+ /* @__PURE__ */ r.jsx("div", { className: "ds-toast__icon", children: /* @__PURE__ */ r.jsx(l, { size: T[3], strokeWidth: 1.5 }) }),
1404
+ /* @__PURE__ */ r.jsx("span", { className: "ds-toast__message", children: t.message }),
1405
+ /* @__PURE__ */ r.jsx(
1406
+ "button",
1407
+ {
1408
+ className: "ds-toast__close",
1409
+ onClick: a,
1410
+ "aria-label": "Закрыть",
1411
+ children: /* @__PURE__ */ r.jsx(se, { size: T[3], strokeWidth: 1.5 })
1412
+ }
1413
+ )
1414
+ ]
1415
+ }
1416
+ );
1417
+ }
1418
+ function jt({ position: t = "bottom-right" }) {
1419
+ const [e, s] = g(() => [...z]);
1420
+ return L(() => (te.add(s), () => te.delete(s)), []), !e.length || typeof document > "u" ? null : J.createPortal(
1421
+ /* @__PURE__ */ r.jsx("div", { className: ["ds-toast-container", `ds-toast-container--${t}`].join(" "), children: e.map((c) => /* @__PURE__ */ r.jsx(Pe, { data: c, onDismiss: Ie }, c.id)) }),
1422
+ document.body
1423
+ );
1424
+ }
1076
1425
  export {
1077
- Le as Accordion,
1078
- Pe as Alert,
1079
- Se as Badge,
1080
- be as Button,
1081
- Re as Card,
1082
- He as Checkbox,
1083
- We as Code,
1084
- je as CodeAccordion,
1085
- ge as H1,
1086
- ke as H2,
1087
- $e as H3,
1088
- Te as H4,
1089
- Ne as Input,
1090
- Fe as Link,
1091
- De as Modal,
1092
- se as ModalFooter,
1093
- Oe as P1,
1094
- Ae as P2,
1095
- Ie as P3,
1096
- ze as Radio,
1097
- Ee as Select,
1098
- ye as Stepper,
1099
- Be as Tab,
1100
- Me as Tabs,
1101
- we as Textarea,
1102
- Ve as Toggle,
1103
- Ye as Tooltip,
1104
- T as iconSizes
1426
+ st as Accordion,
1427
+ Ce as Alert,
1428
+ it as Avatar,
1429
+ Je as Badge,
1430
+ ke as Button,
1431
+ Ye as Card,
1432
+ at as Checkbox,
1433
+ Ze as Code,
1434
+ Re as CodeAccordion,
1435
+ xt as Dropdown,
1436
+ ht as EmptyState,
1437
+ ze as H1,
1438
+ Ve as H2,
1439
+ Ue as H3,
1440
+ He as H4,
1441
+ De as Input,
1442
+ Qe as Link,
1443
+ Ke as Modal,
1444
+ de as ModalFooter,
1445
+ Ge as P1,
1446
+ qe as P2,
1447
+ Xe as P3,
1448
+ ot as Radio,
1449
+ Fe as Select,
1450
+ lt as Skeleton,
1451
+ ct as Spinner,
1452
+ We as Stepper,
1453
+ tt as Tab,
1454
+ dt as Table,
1455
+ ft as TableBody,
1456
+ ut as TableHead,
1457
+ mt as TableRow,
1458
+ et as Tabs,
1459
+ bt as Td,
1460
+ Me as Textarea,
1461
+ pt as Th,
1462
+ jt as ToastContainer,
1463
+ nt as Toggle,
1464
+ rt as Tooltip,
1465
+ T as iconSizes,
1466
+ vt as useToast
1105
1467
  };