@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.
- package/README.md +119 -137
- package/dist/index.cjs.js +4 -4
- package/dist/index.es.js +1042 -680
- package/dist/tokens.css +1 -1
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -110,33 +110,16 @@ function MyComponent() {
|
|
|
110
110
|
```javascript
|
|
111
111
|
import { iconSizes } from '@donkit-ai/design-system';
|
|
112
112
|
|
|
113
|
-
// iconSizes = {
|
|
113
|
+
// iconSizes = { 1: 16, 2: 20, 3: 24, 4: 28, 5: 48 }
|
|
114
114
|
```
|
|
115
115
|
|
|
116
116
|
**Соответствие размеров компонентам:**
|
|
117
117
|
|
|
118
|
-
- **16px (
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
- **
|
|
123
|
-
- Small кнопки (`size="s"`)
|
|
124
|
-
- Small табы (`size="s"`)
|
|
125
|
-
- Modal (иконка закрытия)
|
|
126
|
-
- Accordion, CodeAccordion
|
|
127
|
-
|
|
128
|
-
- **24px (m)** - стандартные элементы
|
|
129
|
-
- Medium кнопки (`size="m"`, по умолчанию)
|
|
130
|
-
- Medium табы (`size="m"`)
|
|
131
|
-
- Input (иконки в полях ввода)
|
|
132
|
-
- Alert (иконки статусов)
|
|
133
|
-
- Select (иконка выпадающего списка)
|
|
134
|
-
|
|
135
|
-
- **28px (l)** - крупные элементы
|
|
136
|
-
- Large кнопки (`size="l"`)
|
|
137
|
-
- Large табы (`size="l"`)
|
|
138
|
-
|
|
139
|
-
- **48px (xl)** - очень крупные элементы
|
|
118
|
+
- **16px (`iconSizes[1]`)** — XS-кнопки, XS-табы
|
|
119
|
+
- **20px (`iconSizes[2]`)** — S-кнопки, S-табы, Modal, Accordion
|
|
120
|
+
- **24px (`iconSizes[3]`)** — M-кнопки (default), Input, Alert, Select
|
|
121
|
+
- **28px (`iconSizes[4]`)** — L-кнопки, L-табы
|
|
122
|
+
- **48px (`iconSizes[5]`)** — крупные декоративные иконки
|
|
140
123
|
|
|
141
124
|
**Всегда используется `strokeWidth={1.5}`** для единообразия дизайна.
|
|
142
125
|
|
|
@@ -147,33 +130,23 @@ import { Mail, Search, Eye, EyeOff, AlertCircle, Check, X } from 'lucide-react';
|
|
|
147
130
|
import { iconSizes } from '@donkit-ai/design-system';
|
|
148
131
|
|
|
149
132
|
// Small button / Tabs / Modal
|
|
150
|
-
<Button size="s" icon={<Mail size={iconSizes
|
|
133
|
+
<Button size="s" icon={<Mail size={iconSizes[2]} strokeWidth={1.5} />}>
|
|
151
134
|
Send
|
|
152
135
|
</Button>
|
|
153
|
-
<Tab icon={<AlertCircle size={iconSizes.s} strokeWidth={1.5} />}>
|
|
154
|
-
Alerts
|
|
155
|
-
</Tab>
|
|
156
136
|
|
|
157
|
-
// Medium button / Input / Alert
|
|
158
|
-
<Button size="m" icon={<Search size={iconSizes
|
|
137
|
+
// Medium button / Input / Alert (default)
|
|
138
|
+
<Button size="m" icon={<Search size={iconSizes[3]} strokeWidth={1.5} />}>
|
|
159
139
|
Search
|
|
160
140
|
</Button>
|
|
161
|
-
<Input
|
|
162
|
-
icon={<Search size={iconSizes.m} strokeWidth={1.5} />}
|
|
163
|
-
placeholder="Search..."
|
|
164
|
-
/>
|
|
165
|
-
<Alert
|
|
166
|
-
type="success"
|
|
167
|
-
icon={<Check size={iconSizes.m} strokeWidth={1.5} />}
|
|
168
|
-
/>
|
|
141
|
+
<Input icon={<Search size={iconSizes[3]} strokeWidth={1.5} />} placeholder="Search..." />
|
|
169
142
|
|
|
170
143
|
// Large button
|
|
171
|
-
<Button size="l" icon={<Mail size={iconSizes
|
|
144
|
+
<Button size="l" icon={<Mail size={iconSizes[4]} strokeWidth={1.5} />}>
|
|
172
145
|
Send Email
|
|
173
146
|
</Button>
|
|
174
147
|
|
|
175
|
-
//
|
|
176
|
-
<Mail size={iconSizes
|
|
148
|
+
// Крупные декоративные
|
|
149
|
+
<Mail size={iconSizes[5]} strokeWidth={1.5} />
|
|
177
150
|
```
|
|
178
151
|
|
|
179
152
|
### 3. Переключение темы
|
|
@@ -190,115 +163,124 @@ document.documentElement.setAttribute('data-theme', 'light');
|
|
|
190
163
|
|
|
191
164
|
### Цвета
|
|
192
165
|
|
|
193
|
-
####
|
|
194
|
-
- `--color-white`: #
|
|
195
|
-
- `--color-white-95/92/65/50/40/20/15/13/06`: rgba с прозрачностью 95%, 92%, 65%, 50%, 40%, 20%, 15%, 13%, 6%
|
|
166
|
+
#### Примитивы (не использовать напрямую)
|
|
167
|
+
- `--color-white`: #F8F9FA
|
|
196
168
|
- `--color-black`: #0E0F11
|
|
197
|
-
- `--color-black-95/65/60/50/40/20/10/08/04`: rgba с прозрачностью 95%, 65%, 60%, 50%, 40%, 20%, 10%, 8%, 4%
|
|
198
169
|
- `--color-red`: #EA6464
|
|
199
|
-
|
|
200
|
-
|
|
201
|
-
|
|
202
|
-
- `--color-
|
|
203
|
-
- `--color-
|
|
204
|
-
- `--color-
|
|
205
|
-
|
|
206
|
-
####
|
|
207
|
-
- `--color-
|
|
208
|
-
- `--color-
|
|
209
|
-
- `--color-
|
|
210
|
-
|
|
211
|
-
|
|
212
|
-
-
|
|
213
|
-
- `--color-
|
|
214
|
-
- `--color-
|
|
215
|
-
- `--color-
|
|
216
|
-
|
|
217
|
-
|
|
218
|
-
- `--color-
|
|
219
|
-
|
|
220
|
-
|
|
221
|
-
|
|
222
|
-
|
|
223
|
-
|
|
224
|
-
- `--
|
|
225
|
-
- `--
|
|
226
|
-
- `--
|
|
227
|
-
|
|
228
|
-
|
|
229
|
-
|
|
230
|
-
|
|
231
|
-
|
|
232
|
-
|
|
233
|
-
|
|
234
|
-
-
|
|
235
|
-
-
|
|
236
|
-
|
|
237
|
-
|
|
238
|
-
-
|
|
239
|
-
|
|
240
|
-
|
|
241
|
-
- `--
|
|
242
|
-
- `--
|
|
243
|
-
- `--
|
|
244
|
-
- `--
|
|
245
|
-
- `--
|
|
246
|
-
|
|
247
|
-
|
|
248
|
-
|
|
249
|
-
|
|
250
|
-
-
|
|
251
|
-
-
|
|
252
|
-
-
|
|
253
|
-
|
|
254
|
-
|
|
255
|
-
- `--
|
|
256
|
-
- `--
|
|
257
|
-
- `--
|
|
258
|
-
- `--
|
|
170
|
+
|
|
171
|
+
#### Поверхности — solid (меняются в зависимости от темы)
|
|
172
|
+
- `--color-surface-0` — page background
|
|
173
|
+
- `--color-surface-1` — card, panel, sidebar
|
|
174
|
+
- `--color-surface-2` — input, nested element
|
|
175
|
+
- `--color-surface-3` — dropdown, tooltip, popover
|
|
176
|
+
|
|
177
|
+
#### Foreground
|
|
178
|
+
- `--color-fg-primary` — основной текст и иконки
|
|
179
|
+
- `--color-fg-secondary` — вторичный текст
|
|
180
|
+
- `--color-fg-disabled` — disabled состояние
|
|
181
|
+
|
|
182
|
+
#### Interactive States
|
|
183
|
+
Прозрачные наложения. В компонентах реализованы через `::before` псевдоэлемент с `z-index: -1` + `isolation: isolate` на родителе — оверлей рисуется поверх базового фона, но под контентом (текст, иконки).
|
|
184
|
+
- `--color-state-hover` — hover (dark: white/7%, light: black/5%)
|
|
185
|
+
- `--color-state-active` — pressed/active (dark: white/12%, light: black/10%)
|
|
186
|
+
- `--color-state-selected` — selected/checked (dark: white/10%, light: black/8%)
|
|
187
|
+
|
|
188
|
+
#### Borders
|
|
189
|
+
- `--color-border-default` — стандартная граница
|
|
190
|
+
- `--color-border-strong` — hover/выделенная
|
|
191
|
+
- `--color-border-focus` — focus ring
|
|
192
|
+
|
|
193
|
+
#### Accent
|
|
194
|
+
- `--color-accent-default` — акцентный цвет (#EA6464)
|
|
195
|
+
- `--color-accent-hover` — акцент при hover
|
|
196
|
+
- `--color-accent-fg` — текст/иконки на акцентном фоне
|
|
197
|
+
- `--color-accent-bg` — subtle акцентный фон (бейджи)
|
|
198
|
+
|
|
199
|
+
#### Status/Alert
|
|
200
|
+
- `--color-status-info/success/warning/error` — адаптивные цвета для статусов
|
|
201
|
+
- `--color-status-*-bg` — фон для статусных бейджей и алертов
|
|
202
|
+
|
|
203
|
+
### Elevation / Shadows
|
|
204
|
+
|
|
205
|
+
- `--shadow-1` — dropdown, select, popover
|
|
206
|
+
- `--shadow-2` — modal, drawer
|
|
207
|
+
- `--shadow-3` — toast, критические оверлеи
|
|
208
|
+
|
|
209
|
+
### Z-index Scale
|
|
210
|
+
|
|
211
|
+
- `--z-dropdown`: 100
|
|
212
|
+
- `--z-sticky`: 200
|
|
213
|
+
- `--z-drawer`: 300
|
|
214
|
+
- `--z-modal`: 400
|
|
215
|
+
- `--z-toast`: 500
|
|
216
|
+
- `--z-tooltip`: 600
|
|
217
|
+
|
|
218
|
+
### Отступы — 4px grid
|
|
219
|
+
|
|
220
|
+
- `--space-1`: 4px
|
|
221
|
+
- `--space-2`: 8px
|
|
222
|
+
- `--space-3`: 12px
|
|
223
|
+
- `--space-4`: 16px
|
|
224
|
+
- `--space-5`: 20px
|
|
225
|
+
- `--space-6`: 24px
|
|
226
|
+
- `--space-8`: 32px
|
|
227
|
+
- `--space-10`: 40px
|
|
228
|
+
- `--space-12`: 48px
|
|
229
|
+
- `--space-16`: 64px
|
|
230
|
+
|
|
231
|
+
### Border Radius
|
|
232
|
+
|
|
233
|
+
- `--radius-1`: 2px
|
|
234
|
+
- `--radius-2`: 4px
|
|
235
|
+
- `--radius-3`: 6px — кнопки, inputs
|
|
236
|
+
- `--radius-4`: 8px — карточки, модалки
|
|
237
|
+
- `--radius-6`: 12px — drawer, панели
|
|
238
|
+
- `--radius-8`: 16px — крупные контейнеры
|
|
239
|
+
- `--radius-full`: 9999px — pill, аватары
|
|
240
|
+
|
|
241
|
+
### Component Heights
|
|
242
|
+
|
|
243
|
+
- `--height-1`: 24px (XS)
|
|
244
|
+
- `--height-2`: 32px (S)
|
|
245
|
+
- `--height-3`: 44px (M, touch target)
|
|
246
|
+
- `--height-4`: 56px (L)
|
|
247
|
+
|
|
248
|
+
### Типографика (adaptive mobile → tablet+)
|
|
249
|
+
|
|
250
|
+
**Font weights:**
|
|
251
|
+
- `--font-weight-regular`: 400
|
|
252
|
+
- `--font-weight-medium`: 500
|
|
253
|
+
- `--font-weight-semibold`: 600
|
|
254
|
+
|
|
255
|
+
**Размеры:**
|
|
256
|
+
- `--text-4xl`: 32px → 40px (H1)
|
|
257
|
+
- `--text-3xl`: 28px → 36px (H2)
|
|
258
|
+
- `--text-2xl`: 24px → 28px (H3)
|
|
259
|
+
- `--text-xl`: 20px → 24px (H4)
|
|
260
|
+
- `--text-lg`: 16px → 18px (P1, основной текст)
|
|
261
|
+
- `--text-md`: 14px → 16px (P2)
|
|
262
|
+
- `--text-sm`: 12px → 14px (P3, метки)
|
|
263
|
+
|
|
264
|
+
**Letter Spacing:**
|
|
265
|
+
- `--tracking-4xl/3xl/2xl/xl`: 0 (крупные кегли — без трекинга)
|
|
266
|
+
- `--tracking-lg`: 0.02em
|
|
267
|
+
- `--tracking-md`: 0.04em → 0.02em
|
|
268
|
+
- `--tracking-sm`: 0.06em → 0.04em
|
|
259
269
|
|
|
260
270
|
### Переходы
|
|
261
271
|
|
|
262
272
|
- `--transition-fast`: 0.15s ease
|
|
263
|
-
- `--transition-normal`: 0.
|
|
264
|
-
- `--transition-slow`: 0.
|
|
273
|
+
- `--transition-normal`: 0.20s ease
|
|
274
|
+
- `--transition-slow`: 0.30s ease
|
|
265
275
|
|
|
266
276
|
## Disabled States (состояния недоступности)
|
|
267
277
|
|
|
268
|
-
Базовые правила для disabled состояний интерактивных компонентов:
|
|
269
|
-
|
|
270
|
-
### Стили
|
|
271
|
-
|
|
272
|
-
```css
|
|
273
|
-
/* Для кнопок */
|
|
274
|
-
.button:disabled {
|
|
275
|
-
opacity: 0.5;
|
|
276
|
-
cursor: not-allowed;
|
|
277
|
-
}
|
|
278
|
-
|
|
279
|
-
/* Для полей ввода - применяется ко всему wrapper */
|
|
280
|
-
.input-wrapper--disabled,
|
|
281
|
-
.select-wrapper--disabled {
|
|
282
|
-
opacity: 0.5;
|
|
283
|
-
cursor: not-allowed;
|
|
284
|
-
}
|
|
285
|
-
|
|
286
|
-
/* Отключение hover эффектов */
|
|
287
|
-
.component:hover:not(:disabled) {
|
|
288
|
-
/* hover стили */
|
|
289
|
-
}
|
|
290
|
-
```
|
|
291
|
-
|
|
292
278
|
### Правила
|
|
293
279
|
|
|
294
|
-
-
|
|
295
|
-
-
|
|
296
|
-
-
|
|
297
|
-
- Для **Button** - применяется к самой кнопке
|
|
298
|
-
- Для **Input/Select** - применяется ко всему полю целиком (wrapper), включая label, input/select, hint/error
|
|
280
|
+
- **Button disabled** — нейтральный стиль вместо opacity на акцентном цвете: прозрачный фон, `--color-fg-disabled`, стандартная рамка
|
|
281
|
+
- **Input/Select/Textarea disabled** — применяется к wrapper целиком (label + поле + hint/error)
|
|
282
|
+
- **Курсор**: `cursor: not-allowed`
|
|
299
283
|
- **Hover эффекты**: отключаются через `:hover:not(:disabled)`
|
|
300
|
-
- **Цвет текста**: не меняется (сохраняет семантический цвет в зависимости от состояния поля)
|
|
301
|
-
- **Применимо к**: Button, Input, Select и другие интерактивные компоненты
|
|
302
284
|
|
|
303
285
|
### Примеры
|
|
304
286
|
|
package/dist/index.cjs.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const p=require("react"),q=require("react-dom"),E=require("lucide-react"),g={1:16,2:20,3:24,4:28,5:48};var K={exports:{}},V={};/**
|
|
2
2
|
* @license React
|
|
3
3
|
* react-jsx-runtime.production.js
|
|
4
4
|
*
|
|
@@ -6,7 +6,7 @@
|
|
|
6
6
|
*
|
|
7
7
|
* This source code is licensed under the MIT license found in the
|
|
8
8
|
* LICENSE file in the root directory of this source tree.
|
|
9
|
-
*/var
|
|
9
|
+
*/var ae;function fe(){if(ae)return V;ae=1;var t=Symbol.for("react.transitional.element"),e=Symbol.for("react.fragment");function s(c,n,a){var l=null;if(a!==void 0&&(l=""+a),n.key!==void 0&&(l=""+n.key),"key"in n){a={};for(var i in n)i!=="key"&&(a[i]=n[i])}else a=n;return n=a.ref,{$$typeof:t,type:c,key:l,ref:n!==void 0?n:null,props:a}}return V.Fragment=e,V.jsx=s,V.jsxs=s,V}var C={};/**
|
|
10
10
|
* @license React
|
|
11
11
|
* react-jsx-runtime.development.js
|
|
12
12
|
*
|
|
@@ -14,9 +14,9 @@
|
|
|
14
14
|
*
|
|
15
15
|
* This source code is licensed under the MIT license found in the
|
|
16
16
|
* LICENSE file in the root directory of this source tree.
|
|
17
|
-
*/var
|
|
17
|
+
*/var oe;function me(){return oe||(oe=1,process.env.NODE_ENV!=="production"&&function(){function t(o){if(o==null)return null;if(typeof o=="function")return o.$$typeof===L?null:o.displayName||o.name||null;if(typeof o=="string")return o;switch(o){case S:return"Fragment";case m:return"Profiler";case $:return"StrictMode";case I:return"Suspense";case P:return"SuspenseList";case N:return"Activity"}if(typeof o=="object")switch(typeof o.tag=="number"&&console.error("Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."),o.$$typeof){case j:return"Portal";case k:return o.displayName||"Context";case w:return(o._context.displayName||"Context")+".Consumer";case A:var h=o.render;return o=o.displayName,o||(o=h.displayName||h.name||"",o=o!==""?"ForwardRef("+o+")":"ForwardRef"),o;case X:return h=o.displayName||null,h!==null?h:t(o.type)||"Memo";case z:h=o._payload,o=o._init;try{return t(o(h))}catch{}}return null}function e(o){return""+o}function s(o){try{e(o);var h=!1}catch{h=!0}if(h){h=console;var y=h.error,R=typeof Symbol=="function"&&Symbol.toStringTag&&o[Symbol.toStringTag]||o.constructor.name||"Object";return y.call(h,"The provided key is an unsupported type %s. This value must be coerced to a string before using it here.",R),e(o)}}function c(o){if(o===S)return"<>";if(typeof o=="object"&&o!==null&&o.$$typeof===z)return"<...>";try{var h=t(o);return h?"<"+h+">":"<...>"}catch{return"<...>"}}function n(){var o=B.A;return o===null?null:o.getOwner()}function a(){return Error("react-stack-top-frame")}function l(o){if(H.call(o,"key")){var h=Object.getOwnPropertyDescriptor(o,"key").get;if(h&&h.isReactWarning)return!1}return o.key!==void 0}function i(o,h){function y(){Y||(Y=!0,console.error("%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)",h))}y.isReactWarning=!0,Object.defineProperty(o,"key",{get:y,configurable:!0})}function b(){var o=t(this.type);return te[o]||(te[o]=!0,console.error("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.")),o=this.props.ref,o!==void 0?o:null}function f(o,h,y,R,U,G){var T=y.ref;return o={$$typeof:_,type:o,key:h,props:y,_owner:R},(T!==void 0?T:null)!==null?Object.defineProperty(o,"ref",{enumerable:!1,get:b}):Object.defineProperty(o,"ref",{enumerable:!1,value:null}),o._store={},Object.defineProperty(o._store,"validated",{configurable:!1,enumerable:!1,writable:!0,value:0}),Object.defineProperty(o,"_debugInfo",{configurable:!1,enumerable:!1,writable:!0,value:null}),Object.defineProperty(o,"_debugStack",{configurable:!1,enumerable:!1,writable:!0,value:U}),Object.defineProperty(o,"_debugTask",{configurable:!1,enumerable:!1,writable:!0,value:G}),Object.freeze&&(Object.freeze(o.props),Object.freeze(o)),o}function d(o,h,y,R,U,G){var T=h.children;if(T!==void 0)if(R)if(ee(T)){for(R=0;R<T.length;R++)u(T[R]);Object.freeze&&Object.freeze(T)}else console.error("React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead.");else u(T);if(H.call(h,"key")){T=t(o);var M=Object.keys(h).filter(function(ue){return ue!=="key"});R=0<M.length?"{key: someKey, "+M.join(": ..., ")+": ...}":"{key: someKey}",ne[T+R]||(M=0<M.length?"{"+M.join(": ..., ")+": ...}":"{}",console.error(`A props object containing a "key" prop is being spread into JSX:
|
|
18
18
|
let props = %s;
|
|
19
19
|
<%s {...props} />
|
|
20
20
|
React keys must be passed directly to JSX without using spread:
|
|
21
21
|
let props = %s;
|
|
22
|
-
<%s key={someKey} {...props} />`,E,w,M,w),K[w+E]=!0)}if(w=null,v!==void 0&&(r(v),w=""+v),i(f)&&(r(f.key),w=""+f.key),"key"in f){v={};for(var V in f)V!=="key"&&(v[V]=f[V])}else v=f;return w&&c(v,typeof t=="function"?t.displayName||t.name||"Unknown":t),p(t,w,v,n(),W,H)}function u(t){b(t)?t._store&&(t._store.validated=1):typeof t=="object"&&t!==null&&t.$$typeof===A&&(t._payload.status==="fulfilled"?b(t._payload.value)&&t._payload.value._store&&(t._payload.value._store.validated=1):t._store&&(t._store.validated=1))}function b(t){return typeof t=="object"&&t!==null&&t.$$typeof===_}var h=x,_=Symbol.for("react.transitional.element"),R=Symbol.for("react.portal"),j=Symbol.for("react.fragment"),N=Symbol.for("react.strict_mode"),k=Symbol.for("react.profiler"),$=Symbol.for("react.consumer"),y=Symbol.for("react.context"),I=Symbol.for("react.forward_ref"),g=Symbol.for("react.suspense"),O=Symbol.for("react.suspense_list"),P=Symbol.for("react.memo"),A=Symbol.for("react.lazy"),D=Symbol.for("react.activity"),se=Symbol.for("react.client.reference"),L=h.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE,q=Object.prototype.hasOwnProperty,re=Array.isArray,Y=console.createTask?console.createTask:function(){return null};h={react_stack_bottom_frame:function(t){return t()}};var X,C={},G=h.react_stack_bottom_frame.bind(h,a)(),J=Y(l(a)),K={};F.Fragment=j,F.jsx=function(t,f,v){var E=1e4>L.recentlyCreatedOwnerStacks++;return d(t,f,v,!1,E?Error("react-stack-top-frame"):G,E?Y(l(t)):J)},F.jsxs=function(t,f,v){var E=1e4>L.recentlyCreatedOwnerStacks++;return d(t,f,v,!0,E?Error("react-stack-top-frame"):G,E?Y(l(t)):J)}}()),F}process.env.NODE_ENV==="production"?z.exports=ae():z.exports=oe();var e=z.exports;function ee({children:o,variant:s="primary",size:r="m",fullWidth:l=!1,icon:n,disabled:a=!1,onClick:i,type:c="button",href:m,"aria-label":p,...d}){const u=n&&!o,b=["ds-button",`ds-button--${s}`,`ds-button--${r}`,l&&"ds-button--full",u&&"ds-button--icon-only"].filter(Boolean).join(" "),h=e.jsxs(e.Fragment,{children:[n&&!u&&e.jsx("span",{className:"ds-button__icon","aria-hidden":"true",children:n}),o,u&&e.jsx("span",{className:"ds-button__icon","aria-hidden":"true",children:n})]});if(m){const _=R=>{if(a){R.preventDefault();return}R.metaKey||R.ctrlKey||R.button===1||(R.preventDefault(),i==null||i(R))};return e.jsx("a",{className:b,href:a?void 0:m,onClick:_,"aria-label":p,"aria-disabled":a?"true":void 0,...d,children:h})}return e.jsx("button",{type:c,className:b,disabled:a,onClick:i,"aria-label":p,...d,children:h})}function ce({label:o,error:s,hint:r,fullWidth:l=!0,icon:n,iconRight:a,onIconRightClick:i,size:c="m",disabled:m,id:p,...d}){const u=p||`input-${x.useId()}`,b=r?`${u}-hint`:void 0,h=s?`${u}-error`:void 0,_=h||b;return e.jsxs("div",{className:`ds-input-wrapper ${l?"ds-input-wrapper--full":""} ${m?"ds-input-wrapper--disabled":""}`,children:[o&&e.jsx("label",{className:"ds-input-label",htmlFor:u,children:o}),e.jsxs("div",{className:"ds-input-container",children:[n&&e.jsx("span",{className:`ds-input-icon ds-input-icon--${c}`,"aria-hidden":"true",children:n}),e.jsx("input",{id:u,className:`ds-input ds-input--${c} ${n?"ds-input--with-icon":""} ${a?"ds-input--with-icon-right":""} ${s?"ds-input--error":""}`,disabled:m,"aria-invalid":s?"true":"false","aria-describedby":_,...d}),a&&e.jsx("button",{type:"button",className:`ds-input-icon-right ds-input-icon-right--${c}`,onClick:i,tabIndex:-1,"aria-label":"Toggle visibility",children:a})]}),r&&!s&&e.jsx("span",{id:b,className:"ds-input-hint",children:r}),s&&e.jsx("span",{id:h,className:"ds-input-error",role:"alert",children:s})]})}function le({label:o,error:s,hint:r,fullWidth:l=!0,size:n="m",disabled:a,id:i,resize:c=!0,rows:m=3,...p}){const d=i||`textarea-${x.useId()}`,u=r?`${d}-hint`:void 0,b=s?`${d}-error`:void 0,h=b||u;return e.jsxs("div",{className:`ds-textarea-wrapper ${l?"ds-textarea-wrapper--full":""} ${a?"ds-textarea-wrapper--disabled":""}`,children:[o&&e.jsx("label",{className:"ds-textarea-label",htmlFor:d,children:o}),e.jsx("textarea",{id:d,className:`ds-textarea ds-textarea--${n} ${s?"ds-textarea--error":""} ${c?"":"ds-textarea--no-resize"}`,disabled:a,"aria-invalid":s?"true":"false","aria-describedby":h,rows:m,...p}),r&&!s&&e.jsx("span",{id:u,className:"ds-textarea-hint",children:r}),s&&e.jsx("span",{id:b,className:"ds-textarea-error",role:"alert",children:s})]})}function ie({label:o,value:s,onChange:r,options:l=[],placeholder:n="Select option",error:a,fullWidth:i=!0,size:c="m",disabled:m=!1,id:p,...d}){const[u,b]=x.useState(!1),[h,_]=x.useState("down"),R=x.useRef(null),j=x.useRef(null),N=p||`select-${x.useId()}`,k=`${N}-label`,$=a?`${N}-error`:void 0;x.useEffect(()=>{const g=O=>{R.current&&!R.current.contains(O.target)&&b(!1)};return document.addEventListener("mousedown",g),()=>document.removeEventListener("mousedown",g)},[]),x.useEffect(()=>{if(u&&R.current){const g=R.current.getBoundingClientRect(),P=window.innerHeight-g.bottom,A=g.top;P<300&&A>P?_("up"):_("down")}},[u]);const y=l.find(g=>g.value===s),I=c==="xs"?S.xs:c==="small"?S.s:S.m;return e.jsxs("div",{className:`ds-select-wrapper ${i?"ds-select-wrapper--full":""} ${m?"ds-select-wrapper--disabled":""}`,children:[o&&e.jsx("label",{id:k,className:"ds-select-label",children:o}),e.jsxs("div",{className:"ds-select-container",ref:R,children:[e.jsxs("button",{type:"button",id:N,role:"combobox","aria-haspopup":"listbox","aria-expanded":u,"aria-labelledby":o?k:void 0,"aria-invalid":a?"true":"false","aria-describedby":$,className:`ds-select-trigger ds-select-trigger--${c} ${a?"ds-select-trigger--error":""}`,onClick:()=>!m&&b(!u),disabled:m,...d,children:[e.jsx("span",{className:y?"":"ds-select-placeholder",children:(y==null?void 0:y.label)||n}),e.jsx(T.ChevronDown,{size:I,strokeWidth:1.5,className:`ds-select-icon ${u&&h==="down"?"ds-select-icon--open":""} ${u&&h==="up"?"ds-select-icon--up":""}`,"aria-hidden":"true"})]}),u&&e.jsx("div",{ref:j,role:"listbox","aria-labelledby":o?k:void 0,className:`ds-select-dropdown ds-select-dropdown--${c} ds-select-dropdown--${h}`,children:l.map(g=>e.jsx("button",{type:"button",role:"option","aria-selected":s===g.value,className:`ds-select-option ds-select-option--${c} ${s===g.value?"ds-select-option--selected":""}`,onClick:()=>{r==null||r(g.value),b(!1)},children:g.label},g.value))})]}),a&&e.jsx("span",{id:$,className:"ds-select-error",role:"alert",children:a})]})}function de({label:o,value:s=0,onChange:r,min:l=0,max:n=100,step:a=1,size:i="m",disabled:c=!1,hint:m,error:p,...d}){const u=()=>{if(c)return;const N=Math.min(Number(s)+a,n);r==null||r(N)},b=()=>{if(c)return;const N=Math.max(Number(s)-a,l);r==null||r(N)},h=N=>{if(c)return;const k=N.target.value;if(k===""){r==null||r(l);return}const $=Number(k);if(!isNaN($)){const y=Math.min(Math.max($,l),n);r==null||r(y)}},_=["ds-stepper-wrapper",c&&"ds-stepper-wrapper--disabled",p&&"ds-stepper-wrapper--error"].filter(Boolean).join(" "),R=["ds-stepper",`ds-stepper--${i}`,c&&"ds-stepper--disabled"].filter(Boolean).join(" "),j=i==="xs"?S.xs:i==="small"?S.s:S.m;return e.jsxs("div",{className:_,children:[o&&e.jsx("label",{className:"ds-stepper-label",children:o}),e.jsxs("div",{className:R,children:[e.jsx("button",{type:"button",className:"ds-stepper-button ds-stepper-button--minus",onClick:b,disabled:c||s<=l,"aria-label":"Decrease",children:e.jsx(T.Minus,{size:j,strokeWidth:1.5})}),e.jsx("input",{type:"number",className:"ds-stepper-input",value:s,onChange:h,min:l,max:n,step:a,disabled:c,...d}),e.jsx("button",{type:"button",className:"ds-stepper-button ds-stepper-button--plus",onClick:u,disabled:c||s>=n,"aria-label":"Increase",children:e.jsx(T.Plus,{size:j,strokeWidth:1.5})})]}),m&&!p&&e.jsx("div",{className:"ds-stepper-hint",children:m}),p&&e.jsx("div",{className:"ds-stepper-error",children:p})]})}function ue({children:o,padding:s="m",variant:r="info",hover:l=!1,onClick:n,href:a,disabled:i=!1,...c}){const p=(l?"interactive":r)==="interactive"||n||a,d=["ds-card",`ds-card--${s}`,p&&"ds-card--interactive"].filter(Boolean).join(" ");if(a){const h=_=>{if(i){_.preventDefault();return}_.metaKey||_.ctrlKey||_.button===1||(_.preventDefault(),n==null||n(_))};return e.jsx("a",{className:d,href:i?void 0:a,onClick:h,"aria-disabled":i?"true":void 0,...c,children:o})}const u=p&&n?"button":"div",b=p&&n?{type:"button",onClick:n,disabled:i}:{};return e.jsx(u,{className:d,role:p&&!n?"article":void 0,...b,...c,children:o})}function fe({children:o,...s}){return e.jsx("h1",{className:"ds-h1",...s,children:o})}function pe({children:o,...s}){return e.jsx("h2",{className:"ds-h2",...s,children:o})}function me({children:o,...s}){return e.jsx("h3",{className:"ds-h3",...s,children:o})}function xe({children:o,...s}){return e.jsx("h4",{className:"ds-h4",...s,children:o})}function be({children:o,secondary:s=!1,...r}){return e.jsx("p",{className:`ds-p1 ${s?"ds-p1--secondary":""}`,...r,children:o})}function he({children:o,secondary:s=!1,...r}){return e.jsx("p",{className:`ds-p2 ${s?"ds-p2--secondary":""}`,...r,children:o})}function je({children:o,secondary:s=!1,...r}){return e.jsx("p",{className:`ds-p3 ${s?"ds-p3--secondary":""}`,...r,children:o})}function ve({children:o,variant:s="default",size:r="m",role:l,...n}){const a=["ds-badge",`ds-badge--${s}`,`ds-badge--${r}`].filter(Boolean).join(" "),i=l||(["info","success","warning","error"].includes(s)?"status":void 0);return e.jsx("span",{className:a,role:i,...n,children:o})}const _e={info:T.Info,success:T.CheckCircle,warning:T.AlertTriangle,error:T.XCircle};function Ne({children:o,variant:s="info",title:r,onClose:l,role:n,...a}){const i=_e[s],c=n||(s==="error"?"alert":"status");return e.jsxs("div",{className:`ds-alert ds-alert--${s} ${r?"":"ds-alert--no-title"}`,role:c,...a,children:[i&&e.jsx("div",{className:"ds-alert__icon",children:e.jsx(i,{size:S.m,strokeWidth:1.5})}),e.jsxs("div",{className:"ds-alert__content",children:[r&&e.jsx("div",{className:"ds-alert__title",children:r}),o&&e.jsx("div",{className:"ds-alert__message",children:o})]}),l&&e.jsx("button",{type:"button",className:"ds-alert__close",onClick:l,"aria-label":"Close alert",children:e.jsx(T.X,{size:S.m,strokeWidth:1.5})})]})}function Ee({children:o,title:s,onClose:r,size:l="m",...n}){const a=x.useRef(null),i=x.useId();x.useEffect(()=>{const d=b=>{b.key==="Escape"&&(r==null||r())},u=b=>{a.current&&!a.current.contains(b.target)&&(r==null||r())};return document.addEventListener("keydown",d),document.addEventListener("mousedown",u),()=>{document.removeEventListener("keydown",d),document.removeEventListener("mousedown",u)}},[r]);const c=x.Children.toArray(o),m=c.find(d=>(d==null?void 0:d.type)===U),p=c.filter(d=>(d==null?void 0:d.type)!==U);return e.jsx("div",{className:"ds-modal-overlay",...n,children:e.jsxs("div",{className:`ds-modal ds-modal--${l}`,ref:a,role:"dialog","aria-modal":"true","aria-labelledby":s?i:void 0,children:[(s||r)&&e.jsxs("div",{className:"ds-modal__header",children:[s&&e.jsx("h3",{id:i,className:"ds-modal__title",children:s}),r&&e.jsx(ee,{variant:"ghost",size:"small",icon:e.jsx(T.X,{size:S.s,strokeWidth:1.5}),onClick:r,"aria-label":"Close modal"})]}),e.jsx("div",{className:"ds-modal__body",children:p}),m]})})}function U({children:o}){return e.jsx("div",{className:"ds-modal__footer",children:o})}function te({children:o,title:s="Code",defaultExpanded:r=!1,padding:l="s",...n}){const[a,i]=x.useState(r),c=["ds-code-accordion",`ds-code-accordion--${l}`].filter(Boolean).join(" ");return e.jsxs("div",{className:c,children:[e.jsxs("button",{type:"button",className:"ds-code-accordion__header",onClick:()=>i(!a),"aria-expanded":a,children:[e.jsx("span",{className:"ds-code-accordion__title",children:s}),e.jsx(T.ChevronDown,{size:S.s,strokeWidth:1.5,className:`ds-code-accordion__icon ${a?"ds-code-accordion__icon--expanded":""}`})]}),a&&e.jsx("pre",{className:"ds-code-accordion__content",...n,children:e.jsx("code",{children:o})})]})}function we({children:o,block:s=!1,collapsible:r=!1,title:l="Code",defaultExpanded:n=!1,...a}){return s?r?e.jsx(te,{title:l,defaultExpanded:n,...a,children:o}):e.jsx("pre",{className:"ds-code-block",...a,children:e.jsx("code",{children:o})}):e.jsx("code",{className:"ds-code-inline",...a,children:o})}function Re({href:o,children:s,onClick:r,target:l,rel:n,...a}){const c=l==="_blank"?n?`${n} noopener noreferrer`:"noopener noreferrer":n;return e.jsx("a",{href:o,className:"ds-link",onClick:r,target:l,rel:c,...a,children:s})}function ge({children:o,size:s="m",variant:r="ghost",...l}){return e.jsx("div",{className:"ds-tabs",role:"tablist",...l,children:x.Children.map(o,n=>x.isValidElement(n)?x.cloneElement(n,{size:s,variant:r}):n)})}function ye({children:o,selected:s=!1,onClick:r,size:l="m",variant:n="ghost",disabled:a=!1,icon:i,href:c,...m}){const p=i&&!o,d=["ds-tab",`ds-tab--${l}`,`ds-tab--${n}`,s&&"ds-tab--selected",p&&"ds-tab--icon-only"].filter(Boolean).join(" "),u=e.jsxs(e.Fragment,{children:[i&&e.jsx("span",{className:"ds-tab-icon",children:i}),o]});if(c){const b=h=>{if(a){h.preventDefault();return}h.metaKey||h.ctrlKey||h.button===1||(h.preventDefault(),r==null||r(h))};return e.jsx("a",{role:"tab","aria-current":s?"page":void 0,"aria-disabled":a?"true":void 0,className:d,href:a?void 0:c,onClick:b,...m,children:u})}return e.jsx("button",{role:"tab","aria-selected":s,className:d,onClick:r,disabled:a,...m,children:u})}function ke({children:o,title:s,defaultExpanded:r=!1,padding:l="m",...n}){const[a,i]=x.useState(r),c=["ds-accordion",`ds-accordion--${l}`].filter(Boolean).join(" ");return e.jsxs("div",{className:c,...n,children:[e.jsxs("button",{type:"button",className:"ds-accordion__header",onClick:()=>i(!a),"aria-expanded":a,children:[e.jsx("span",{className:"ds-accordion__title",children:s}),e.jsx(T.ChevronDown,{size:S.s,strokeWidth:1.5,className:`ds-accordion__icon ${a?"ds-accordion__icon--expanded":""}`})]}),a&&e.jsx("div",{className:"ds-accordion__content",children:o})]})}function $e({children:o,content:s,position:r,...l}){const[n,a]=x.useState(!1),[i,c]=x.useState(r||"top"),[m,p]=x.useState({x:0,arrowOffset:0}),d=x.useRef(null),u=x.useRef(null),b=x.useRef(!1);x.useEffect(()=>{n&&!r&&d.current&&u.current?requestAnimationFrame(()=>{if(!d.current||!u.current)return;const j=d.current.getBoundingClientRect(),N=u.current.getBoundingClientRect(),k=window.innerHeight,$=window.innerWidth,y=j.top,I=k-j.bottom,g=j.left,O=$-j.right,P=N.height,A=N.width;if(y>=P+8)c("top");else if(I>=P+8)c("bottom");else if(O>=A+8)c("right");else if(g>=A+8)c("left");else{const D=Math.max(y,I,g,O);c(D===y?"top":D===I?"bottom":D===O?"right":"left")}}):r&&c(r)},[n,r]),x.useEffect(()=>{n&&u.current&&d.current?requestAnimationFrame(()=>{if(!u.current||!d.current)return;const j=u.current.getBoundingClientRect(),N=window.innerWidth,k=8;let $=0,y=0;(i==="top"||i==="bottom")&&(j.right>N-k?($=N-k-j.right,y=-$):j.left<k&&($=k-j.left,y=-$)),p({x:$,arrowOffset:y})}):p({x:0,arrowOffset:0})},[n,i]),x.useEffect(()=>{if(!n)return;const j=N=>{d.current&&!d.current.contains(N.target)&&a(!1)};return document.addEventListener("touchstart",j),()=>{document.removeEventListener("touchstart",j)}},[n]);const h=()=>{b.current=!0,a(j=>!j)},_=()=>{b.current||a(!0)},R=()=>{b.current||a(!1)};return s?e.jsxs("div",{ref:d,className:"ds-tooltip-wrapper",onMouseEnter:_,onMouseLeave:R,onTouchStart:h,...l,children:[o,n&&e.jsx("div",{ref:u,className:`ds-tooltip ds-tooltip--${i}`,role:"tooltip",style:{"--tooltip-offset-x":`${m.x}px`,"--arrow-offset":`${m.arrowOffset}px`},children:s})]}):o}function Te({checked:o=!1,onChange:s,size:r="m",disabled:l=!1,label:n,id:a,...i}){const c=a||`toggle-${x.useId()}`,m=["ds-toggle",`ds-toggle--${r}`,l&&"ds-toggle--disabled"].filter(Boolean).join(" ");return e.jsxs("label",{className:m,htmlFor:c,children:[e.jsx("input",{type:"checkbox",id:c,className:"ds-toggle__input",checked:o,onChange:p=>s==null?void 0:s(p.target.checked),disabled:l,...i}),e.jsx("span",{className:"ds-toggle__track",children:e.jsx("span",{className:"ds-toggle__thumb"})}),n&&e.jsx("span",{className:"ds-toggle__label",children:n})]})}function Se({checked:o=!1,onChange:s,size:r="m",disabled:l=!1,label:n,id:a,...i}){const c=a||`checkbox-${x.useId()}`,m=["ds-checkbox",`ds-checkbox--${r}`,l&&"ds-checkbox--disabled"].filter(Boolean).join(" "),p=r==="xs"?10:r==="small"?14:r==="large"?20:16;return e.jsxs("label",{className:m,htmlFor:c,children:[e.jsx("input",{type:"checkbox",id:c,className:"ds-checkbox__input",checked:o,onChange:d=>s==null?void 0:s(d.target.checked),disabled:l,...i}),e.jsx("span",{className:"ds-checkbox__box",children:o&&e.jsx(T.Check,{size:p,strokeWidth:2.5,className:"ds-checkbox__icon"})}),n&&e.jsx("span",{className:"ds-checkbox__label",children:n})]})}function Oe({checked:o=!1,onChange:s,size:r="m",disabled:l=!1,label:n,name:a,value:i,id:c,...m}){const p=c||`radio-${x.useId()}`,d=["ds-radio",`ds-radio--${r}`,l&&"ds-radio--disabled"].filter(Boolean).join(" ");return e.jsxs("label",{className:d,htmlFor:p,children:[e.jsx("input",{type:"radio",id:p,className:"ds-radio__input",checked:o,onChange:u=>s==null?void 0:s(u.target.checked),disabled:l,name:a,value:i,...m}),e.jsx("span",{className:"ds-radio__circle",children:e.jsx("span",{className:"ds-radio__dot"})}),n&&e.jsx("span",{className:"ds-radio__label",children:n})]})}exports.Accordion=ke;exports.Alert=Ne;exports.Badge=ve;exports.Button=ee;exports.Card=ue;exports.Checkbox=Se;exports.Code=we;exports.CodeAccordion=te;exports.H1=fe;exports.H2=pe;exports.H3=me;exports.H4=xe;exports.Input=ce;exports.Link=Re;exports.Modal=Ee;exports.ModalFooter=U;exports.P1=be;exports.P2=he;exports.P3=je;exports.Radio=Oe;exports.Select=ie;exports.Stepper=de;exports.Tab=ye;exports.Tabs=ge;exports.Textarea=le;exports.Toggle=Te;exports.Tooltip=$e;exports.iconSizes=S;
|
|
22
|
+
<%s key={someKey} {...props} />`,R,T,M,T),ne[T+R]=!0)}if(T=null,y!==void 0&&(s(y),T=""+y),l(h)&&(s(h.key),T=""+h.key),"key"in h){y={};for(var J in h)J!=="key"&&(y[J]=h[J])}else y=h;return T&&i(y,typeof o=="function"?o.displayName||o.name||"Unknown":o),f(o,T,y,n(),U,G)}function u(o){x(o)?o._store&&(o._store.validated=1):typeof o=="object"&&o!==null&&o.$$typeof===z&&(o._payload.status==="fulfilled"?x(o._payload.value)&&o._payload.value._store&&(o._payload.value._store.validated=1):o._store&&(o._store.validated=1))}function x(o){return typeof o=="object"&&o!==null&&o.$$typeof===_}var v=p,_=Symbol.for("react.transitional.element"),j=Symbol.for("react.portal"),S=Symbol.for("react.fragment"),$=Symbol.for("react.strict_mode"),m=Symbol.for("react.profiler"),w=Symbol.for("react.consumer"),k=Symbol.for("react.context"),A=Symbol.for("react.forward_ref"),I=Symbol.for("react.suspense"),P=Symbol.for("react.suspense_list"),X=Symbol.for("react.memo"),z=Symbol.for("react.lazy"),N=Symbol.for("react.activity"),L=Symbol.for("react.client.reference"),B=v.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE,H=Object.prototype.hasOwnProperty,ee=Array.isArray,D=console.createTask?console.createTask:function(){return null};v={react_stack_bottom_frame:function(o){return o()}};var Y,te={},se=v.react_stack_bottom_frame.bind(v,a)(),re=D(c(a)),ne={};C.Fragment=S,C.jsx=function(o,h,y){var R=1e4>B.recentlyCreatedOwnerStacks++;return d(o,h,y,!1,R?Error("react-stack-top-frame"):se,R?D(c(o)):re)},C.jsxs=function(o,h,y){var R=1e4>B.recentlyCreatedOwnerStacks++;return d(o,h,y,!0,R?Error("react-stack-top-frame"):se,R?D(c(o)):re)}}()),C}process.env.NODE_ENV==="production"?K.exports=fe():K.exports=me();var r=K.exports;function le({children:t,variant:e="primary",size:s="m",fullWidth:c=!1,icon:n,disabled:a=!1,onClick:l,type:i="button",href:b,"aria-label":f,...d}){const u=n&&!t,x=["ds-button",`ds-button--${e}`,`ds-button--${s}`,c&&"ds-button--full",u&&"ds-button--icon-only"].filter(Boolean).join(" "),v=r.jsxs(r.Fragment,{children:[n&&!u&&r.jsx("span",{className:"ds-button__icon","aria-hidden":"true",children:n}),t,u&&r.jsx("span",{className:"ds-button__icon","aria-hidden":"true",children:n})]});if(b){const _=j=>{if(a){j.preventDefault();return}j.metaKey||j.ctrlKey||j.button===1||(j.preventDefault(),l==null||l(j))};return r.jsx("a",{className:x,href:a?void 0:b,onClick:_,"aria-label":f,"aria-disabled":a?"true":void 0,...d,children:v})}return r.jsx("button",{type:i,className:x,disabled:a,onClick:l,"aria-label":f,...d,children:v})}function pe({label:t,error:e,hint:s,fullWidth:c=!0,icon:n,iconRight:a,onIconRightClick:l,size:i="m",disabled:b,id:f,...d}){const u=f||`input-${p.useId()}`,x=s?`${u}-hint`:void 0,v=e?`${u}-error`:void 0,_=v||x;return r.jsxs("div",{className:`ds-input-wrapper ${c?"ds-input-wrapper--full":""} ${b?"ds-input-wrapper--disabled":""}`,children:[t&&r.jsx("label",{className:"ds-input-label",htmlFor:u,children:t}),r.jsxs("div",{className:"ds-input-container",children:[n&&r.jsx("span",{className:`ds-input-icon ds-input-icon--${i}`,"aria-hidden":"true",children:n}),r.jsx("input",{id:u,className:`ds-input ds-input--${i} ${n?"ds-input--with-icon":""} ${a?"ds-input--with-icon-right":""} ${e?"ds-input--error":""}`,disabled:b,"aria-invalid":e?"true":"false","aria-describedby":_,...d}),a&&r.jsx("button",{type:"button",className:`ds-input-icon-right ds-input-icon-right--${i}`,onClick:l,tabIndex:-1,"aria-label":"Toggle visibility",children:a})]}),s&&!e&&r.jsx("span",{id:x,className:"ds-input-hint",children:s}),e&&r.jsx("span",{id:v,className:"ds-input-error",role:"alert",children:e})]})}function be({label:t,error:e,hint:s,fullWidth:c=!0,size:n="m",disabled:a,id:l,resize:i=!0,rows:b=3,...f}){const d=l||`textarea-${p.useId()}`,u=s?`${d}-hint`:void 0,x=e?`${d}-error`:void 0,v=x||u;return r.jsxs("div",{className:`ds-textarea-wrapper ${c?"ds-textarea-wrapper--full":""} ${a?"ds-textarea-wrapper--disabled":""}`,children:[t&&r.jsx("label",{className:"ds-textarea-label",htmlFor:d,children:t}),r.jsx("textarea",{id:d,className:`ds-textarea ds-textarea--${n} ${e?"ds-textarea--error":""} ${i?"":"ds-textarea--no-resize"}`,disabled:a,"aria-invalid":e?"true":"false","aria-describedby":v,rows:b,...f}),s&&!e&&r.jsx("span",{id:u,className:"ds-textarea-hint",children:s}),e&&r.jsx("span",{id:x,className:"ds-textarea-error",role:"alert",children:e})]})}function he({label:t,value:e,onChange:s,options:c=[],placeholder:n="Select option",error:a,fullWidth:l=!0,size:i="m",disabled:b=!1,id:f,...d}){const[u,x]=p.useState(!1),[v,_]=p.useState({}),[j,S]=p.useState("down"),$=p.useRef(null),m=p.useRef(null),w=f||`select-${p.useId()}`,k=`${w}-label`,A=a?`${w}-error`:void 0,I=()=>{var Y;const N=(Y=$.current)==null?void 0:Y.getBoundingClientRect();if(!N)return;const L=window.innerHeight,B=L-N.bottom,H=N.top,D=B<300&&H>B;S(D?"up":"down"),_(D?{bottom:L-N.top+4,left:N.left,width:N.width}:{top:N.bottom+4,left:N.left,width:N.width})};p.useEffect(()=>{if(u)return I(),window.addEventListener("scroll",I,!0),window.addEventListener("resize",I),()=>{window.removeEventListener("scroll",I,!0),window.removeEventListener("resize",I)}},[u]),p.useEffect(()=>{const N=L=>{$.current&&!$.current.contains(L.target)&&m.current&&!m.current.contains(L.target)&&x(!1)};return document.addEventListener("mousedown",N),()=>document.removeEventListener("mousedown",N)},[]);const P=c.find(N=>N.value===e),X=i==="xs"?g[1]:i==="small"?g[2]:g[3],z=u&&r.jsx("div",{ref:m,role:"listbox","aria-labelledby":t?k:void 0,className:`ds-select-dropdown ds-select-dropdown--${i} ds-select-dropdown--${j}`,style:v,children:c.map(N=>r.jsx("button",{type:"button",role:"option","aria-selected":e===N.value,className:`ds-select-option ds-select-option--${i} ${e===N.value?"ds-select-option--selected":""}`,onClick:()=>{s==null||s(N.value),x(!1)},children:N.label},N.value))});return r.jsxs("div",{className:`ds-select-wrapper ${l?"ds-select-wrapper--full":""} ${b?"ds-select-wrapper--disabled":""}`,children:[t&&r.jsx("label",{id:k,className:"ds-select-label",children:t}),r.jsx("div",{className:"ds-select-container",ref:$,children:r.jsxs("button",{type:"button",id:w,role:"combobox","aria-haspopup":"listbox","aria-expanded":u,"aria-labelledby":t?k:void 0,"aria-invalid":a?"true":"false","aria-describedby":A,className:`ds-select-trigger ds-select-trigger--${i} ${a?"ds-select-trigger--error":""}`,onClick:()=>!b&&x(!u),disabled:b,...d,children:[r.jsx("span",{className:P?"":"ds-select-placeholder",children:(P==null?void 0:P.label)||n}),r.jsx(E.ChevronDown,{size:X,strokeWidth:1.5,className:`ds-select-icon ${u&&j==="down"?"ds-select-icon--open":""} ${u&&j==="up"?"ds-select-icon--up":""}`,"aria-hidden":"true"})]})}),a&&r.jsx("span",{id:A,className:"ds-select-error",role:"alert",children:a}),typeof document<"u"&&q.createPortal(z,document.body)]})}function xe({label:t,value:e=0,onChange:s,min:c=0,max:n=100,step:a=1,size:l="m",disabled:i=!1,hint:b,error:f,...d}){const u=()=>{if(i)return;const $=Math.min(Number(e)+a,n);s==null||s($)},x=()=>{if(i)return;const $=Math.max(Number(e)-a,c);s==null||s($)},v=$=>{if(i)return;const m=$.target.value;if(m===""){s==null||s(c);return}const w=Number(m);if(!isNaN(w)){const k=Math.min(Math.max(w,c),n);s==null||s(k)}},_=["ds-stepper-wrapper",i&&"ds-stepper-wrapper--disabled",f&&"ds-stepper-wrapper--error"].filter(Boolean).join(" "),j=["ds-stepper",`ds-stepper--${l}`,i&&"ds-stepper--disabled"].filter(Boolean).join(" "),S=l==="xs"?g[1]:l==="small"?g[2]:g[3];return r.jsxs("div",{className:_,children:[t&&r.jsx("label",{className:"ds-stepper-label",children:t}),r.jsxs("div",{className:j,children:[r.jsx("button",{type:"button",className:"ds-stepper-button ds-stepper-button--minus",onClick:x,disabled:i||e<=c,"aria-label":"Decrease",children:r.jsx(E.Minus,{size:S,strokeWidth:1.5})}),r.jsx("input",{type:"number",className:"ds-stepper-input",value:e,onChange:v,min:c,max:n,step:a,disabled:i,...d}),r.jsx("button",{type:"button",className:"ds-stepper-button ds-stepper-button--plus",onClick:u,disabled:i||e>=n,"aria-label":"Increase",children:r.jsx(E.Plus,{size:S,strokeWidth:1.5})})]}),b&&!f&&r.jsx("div",{className:"ds-stepper-hint",children:b}),f&&r.jsx("div",{className:"ds-stepper-error",children:f})]})}function ve({children:t,padding:e="m",variant:s="info",hover:c=!1,onClick:n,href:a,disabled:l=!1,...i}){const f=(c?"interactive":s)==="interactive"||n||a,d=["ds-card",`ds-card--${e}`,f&&"ds-card--interactive"].filter(Boolean).join(" ");if(a){const v=_=>{if(l){_.preventDefault();return}_.metaKey||_.ctrlKey||_.button===1||(_.preventDefault(),n==null||n(_))};return r.jsx("a",{className:d,href:l?void 0:a,onClick:v,"aria-disabled":l?"true":void 0,...i,children:t})}const u=f&&n?"button":"div",x=f&&n?{type:"button",onClick:n,disabled:l}:{};return r.jsx(u,{className:d,role:f&&!n?"article":void 0,...x,...i,children:t})}function je({children:t,...e}){return r.jsx("h1",{className:"ds-h1",...e,children:t})}function _e({children:t,...e}){return r.jsx("h2",{className:"ds-h2",...e,children:t})}function we({children:t,...e}){return r.jsx("h3",{className:"ds-h3",...e,children:t})}function Ne({children:t,...e}){return r.jsx("h4",{className:"ds-h4",...e,children:t})}function ye({children:t,secondary:e=!1,...s}){return r.jsx("p",{className:`ds-p1 ${e?"ds-p1--secondary":""}`,...s,children:t})}function Ee({children:t,secondary:e=!1,...s}){return r.jsx("p",{className:`ds-p2 ${e?"ds-p2--secondary":""}`,...s,children:t})}function ke({children:t,secondary:e=!1,...s}){return r.jsx("p",{className:`ds-p3 ${e?"ds-p3--secondary":""}`,...s,children:t})}function Re({children:t,variant:e="default",size:s="m",role:c,...n}){const a=["ds-badge",`ds-badge--${e}`,`ds-badge--${s}`].filter(Boolean).join(" "),l=c||(["info","success","warning","error"].includes(e)?"status":void 0);return r.jsx("span",{className:a,role:l,...n,children:t})}const Te={info:E.Info,success:E.CheckCircle,warning:E.AlertTriangle,error:E.XCircle};function $e({children:t,variant:e="info",title:s,onClose:c,role:n,...a}){const l=Te[e],i=n||(e==="error"?"alert":"status");return r.jsxs("div",{className:`ds-alert ds-alert--${e} ${s?"":"ds-alert--no-title"}`,role:i,...a,children:[l&&r.jsx("div",{className:"ds-alert__icon",children:r.jsx(l,{size:g[3],strokeWidth:1.5})}),r.jsxs("div",{className:"ds-alert__content",children:[s&&r.jsx("div",{className:"ds-alert__title",children:s}),t&&r.jsx("div",{className:"ds-alert__message",children:t})]}),c&&r.jsx("button",{type:"button",className:"ds-alert__close",onClick:c,"aria-label":"Close alert",children:r.jsx(E.X,{size:g[3],strokeWidth:1.5})})]})}function Se({children:t,title:e,onClose:s,size:c="m",...n}){const a=p.useRef(null),l=p.useId();p.useEffect(()=>{const d=x=>{x.key==="Escape"&&(s==null||s())},u=x=>{a.current&&!a.current.contains(x.target)&&(s==null||s())};return document.addEventListener("keydown",d),document.addEventListener("mousedown",u),()=>{document.removeEventListener("keydown",d),document.removeEventListener("mousedown",u)}},[s]);const i=p.Children.toArray(t),b=i.find(d=>(d==null?void 0:d.type)===Z),f=i.filter(d=>(d==null?void 0:d.type)!==Z);return r.jsx("div",{className:"ds-modal-overlay",...n,children:r.jsxs("div",{className:`ds-modal ds-modal--${c}`,ref:a,role:"dialog","aria-modal":"true","aria-labelledby":e?l:void 0,children:[(e||s)&&r.jsxs("div",{className:"ds-modal__header",children:[e&&r.jsx("h3",{id:l,className:"ds-modal__title",children:e}),s&&r.jsx(le,{variant:"ghost",size:"small",icon:r.jsx(E.X,{size:g[2],strokeWidth:1.5}),onClick:s,"aria-label":"Close modal"})]}),r.jsx("div",{className:"ds-modal__body",children:f}),b]})})}function Z({children:t}){return r.jsx("div",{className:"ds-modal__footer",children:t})}function ie({children:t,title:e="Code",defaultExpanded:s=!1,expanded:c,onToggle:n,padding:a="s",className:l="",...i}){const[b,f]=p.useState(s),d=c!==void 0,u=d?c:b,x=()=>{d?n==null||n(!c):f(_=>!_)},v=["ds-code-accordion",`ds-code-accordion--${a}`,l].filter(Boolean).join(" ");return r.jsxs("div",{className:v,...i,children:[r.jsxs("button",{type:"button",className:"ds-code-accordion__header",onClick:x,"aria-expanded":u,children:[r.jsx("span",{className:"ds-code-accordion__title",children:e}),r.jsx(E.ChevronDown,{size:g[2],strokeWidth:1.5,className:`ds-code-accordion__icon ${u?"ds-code-accordion__icon--expanded":""}`})]}),u&&r.jsx("pre",{className:"ds-code-accordion__content",children:r.jsx("code",{children:t})})]})}function ge({children:t,block:e=!1,collapsible:s=!1,title:c="Code",defaultExpanded:n=!1,...a}){return e?s?r.jsx(ie,{title:c,defaultExpanded:n,...a,children:t}):r.jsx("pre",{className:"ds-code-block",...a,children:r.jsx("code",{children:t})}):r.jsx("code",{className:"ds-code-inline",...a,children:t})}function Ae({href:t,children:e,onClick:s,target:c,rel:n,...a}){const i=c==="_blank"?n?`${n} noopener noreferrer`:"noopener noreferrer":n;return r.jsx("a",{href:t,className:"ds-link",onClick:s,target:c,rel:i,...a,children:e})}function Ie({children:t,size:e="m",variant:s="ghost",...c}){return r.jsx("div",{className:"ds-tabs",role:"tablist",...c,children:p.Children.map(t,n=>p.isValidElement(n)?p.cloneElement(n,{size:e,variant:s}):n)})}function Pe({children:t,selected:e=!1,onClick:s,size:c="m",variant:n="ghost",disabled:a=!1,icon:l,href:i,...b}){const f=l&&!t,d=["ds-tab",`ds-tab--${c}`,`ds-tab--${n}`,e&&"ds-tab--selected",f&&"ds-tab--icon-only"].filter(Boolean).join(" "),u=r.jsxs(r.Fragment,{children:[l&&r.jsx("span",{className:"ds-tab-icon",children:l}),t]});if(i){const x=v=>{if(a){v.preventDefault();return}v.metaKey||v.ctrlKey||v.button===1||(v.preventDefault(),s==null||s(v))};return r.jsx("a",{role:"tab","aria-current":e?"page":void 0,"aria-disabled":a?"true":void 0,className:d,href:a?void 0:i,onClick:x,...b,children:u})}return r.jsx("button",{role:"tab","aria-selected":e,className:d,onClick:s,disabled:a,...b,children:u})}function Oe({children:t,title:e,defaultExpanded:s=!1,expanded:c,onToggle:n,padding:a="m",...l}){const[i,b]=p.useState(s),f=c!==void 0,d=f?c:i,u=()=>{f?n==null||n(!c):b(v=>!v)},x=["ds-accordion",`ds-accordion--${a}`].filter(Boolean).join(" ");return r.jsxs("div",{className:x,...l,children:[r.jsxs("button",{type:"button",className:"ds-accordion__header",onClick:u,"aria-expanded":d,children:[r.jsx("span",{className:"ds-accordion__title",children:e}),r.jsx(E.ChevronDown,{size:g[2],strokeWidth:1.5,className:`ds-accordion__icon ${d?"ds-accordion__icon--expanded":""}`})]}),d&&r.jsx("div",{className:"ds-accordion__content",children:t})]})}const O=8,F=8;function Le(t,e,s){const c=window.innerWidth;let n,a;switch(t){case"top":n=e.top-s.height-O,a=e.left+e.width/2-s.width/2;break;case"bottom":n=e.bottom+O,a=e.left+e.width/2-s.width/2;break;case"left":n=e.top+e.height/2-s.height/2,a=e.left-s.width-O;break;case"right":n=e.top+e.height/2-s.height/2,a=e.right+O;break;default:n=e.bottom+O,a=e.left}const l=Math.max(F,Math.min(c-s.width-F,a)),i=a-l;return{top:n,left:l,arrowOffset:i}}function Be(t,e,s){const c=window.innerWidth,n=window.innerHeight;if(t.top>=e+O+F)return"top";if(n-t.bottom>=e+O+F)return"bottom";if(c-t.right>=s+O+F)return"right";if(t.left>=s+O+F)return"left";const a=Math.max(t.top,n-t.bottom,t.left,c-t.right);return a===t.top?"top":a===n-t.bottom?"bottom":a===c-t.right?"right":"left"}function De({children:t,content:e,position:s,...c}){const[n,a]=p.useState(!1),[l,i]=p.useState({visibility:"hidden"}),[b,f]=p.useState(s||"top"),d=p.useRef(null),u=p.useRef(null),x=p.useRef(!1),v=()=>{if(!d.current||!u.current)return;const j=d.current.getBoundingClientRect(),S=u.current.getBoundingClientRect(),$=s||Be(j,S.height,S.width),{top:m,left:w,arrowOffset:k}=Le($,j,S);f($),i({position:"fixed",top:m,left:w,visibility:"visible","--arrow-offset":`${k}px`})};if(p.useEffect(()=>{if(!n)return;i({position:"fixed",visibility:"hidden"});const j=requestAnimationFrame(v);return window.addEventListener("scroll",v,!0),window.addEventListener("resize",v),()=>{cancelAnimationFrame(j),window.removeEventListener("scroll",v,!0),window.removeEventListener("resize",v)}},[n,s]),p.useEffect(()=>{if(!n)return;const j=S=>{d.current&&!d.current.contains(S.target)&&a(!1)};return document.addEventListener("touchstart",j),()=>document.removeEventListener("touchstart",j)},[n]),!e)return t;const _=n&&r.jsx("div",{ref:u,className:`ds-tooltip ds-tooltip--${b}`,role:"tooltip",style:l,children:e});return r.jsxs("div",{ref:d,className:"ds-tooltip-wrapper",onMouseEnter:()=>{x.current||a(!0)},onMouseLeave:()=>{x.current||a(!1)},onTouchStart:()=>{x.current=!0,a(j=>!j)},...c,children:[t,typeof document<"u"&&q.createPortal(_,document.body)]})}function Me({checked:t=!1,onChange:e,size:s="m",disabled:c=!1,label:n,id:a,...l}){const i=a||`toggle-${p.useId()}`,b=["ds-toggle",`ds-toggle--${s}`,c&&"ds-toggle--disabled"].filter(Boolean).join(" ");return r.jsxs("label",{className:b,htmlFor:i,children:[r.jsx("input",{type:"checkbox",id:i,className:"ds-toggle__input",checked:t,onChange:f=>e==null?void 0:e(f.target.checked),disabled:c,...l}),r.jsx("span",{className:"ds-toggle__track",children:r.jsx("span",{className:"ds-toggle__thumb"})}),n&&r.jsx("span",{className:"ds-toggle__label",children:n})]})}function Fe({checked:t=!1,onChange:e,size:s="m",disabled:c=!1,label:n,id:a,...l}){const i=a||`checkbox-${p.useId()}`,b=["ds-checkbox",`ds-checkbox--${s}`,c&&"ds-checkbox--disabled"].filter(Boolean).join(" "),f=s==="xs"?10:s==="small"?14:s==="large"?20:16;return r.jsxs("label",{className:b,htmlFor:i,children:[r.jsx("input",{type:"checkbox",id:i,className:"ds-checkbox__input",checked:t,onChange:d=>e==null?void 0:e(d.target.checked),disabled:c,...l}),r.jsx("span",{className:"ds-checkbox__box",children:t&&r.jsx(E.Check,{size:f,strokeWidth:2.5,className:"ds-checkbox__icon"})}),n&&r.jsx("span",{className:"ds-checkbox__label",children:n})]})}function We({checked:t=!1,onChange:e,size:s="m",disabled:c=!1,label:n,name:a,value:l,id:i,...b}){const f=i||`radio-${p.useId()}`,d=["ds-radio",`ds-radio--${s}`,c&&"ds-radio--disabled"].filter(Boolean).join(" ");return r.jsxs("label",{className:d,htmlFor:f,children:[r.jsx("input",{type:"radio",id:f,className:"ds-radio__input",checked:t,onChange:u=>e==null?void 0:e(u.target.checked),disabled:c,name:a,value:l,...b}),r.jsx("span",{className:"ds-radio__circle",children:r.jsx("span",{className:"ds-radio__dot"})}),n&&r.jsx("span",{className:"ds-radio__label",children:n})]})}function ze({size:t="m",color:e="default",className:s="",...c}){return r.jsx("span",{className:["ds-spinner",`ds-spinner--${t}`,`ds-spinner--${e}`,s].filter(Boolean).join(" "),role:"status","aria-label":"Loading",...c})}function Ye({width:t,height:e,shape:s="rect",className:c="",style:n={},...a}){return r.jsx("span",{className:["ds-skeleton",`ds-skeleton--${s}`,c].filter(Boolean).join(" "),style:{width:t,height:e,...n},"aria-hidden":"true",...a})}function Ve(t){let e=2166136261;for(let s=0;s<t.length;s++)e^=t.charCodeAt(s),e=Math.imul(e,16777619)>>>0;return e%360}function Ce({seed:t,icon:e,size:s=32,className:c="",style:n={},...a}){const l=Ve(t??"");return r.jsx("div",{className:["ds-avatar",c].filter(Boolean).join(" "),style:{width:s,height:s,"--ds-avatar-h":l,...n},"aria-hidden":"true",...a,children:e})}function He({children:t,size:e="compact",stickyTop:s,maxHeight:c,className:n="",style:a={},...l}){const i={...c?{maxHeight:c}:{},...s!==void 0?{"--ds-table-sticky-top":typeof s=="number"?`${s}px`:s}:{},...a};return r.jsx("div",{className:["ds-table-wrap",c?"ds-table-wrap--scroll":""].filter(Boolean).join(" "),style:i,children:r.jsx("table",{className:["ds-table",`ds-table--${e}`,n].filter(Boolean).join(" "),...l,children:t})})}function Ue({children:t,...e}){return r.jsx("thead",{...e,children:t})}function qe({children:t,...e}){return r.jsx("tbody",{...e,children:t})}function Xe({children:t,interactive:e,selected:s,className:c="",onClick:n,...a}){return r.jsx("tr",{className:["ds-table-row",e||n?"ds-table-row--interactive":"",s?"ds-table-row--selected":"",c].filter(Boolean).join(" "),onClick:n,...a,children:t})}function Ge({children:t,align:e="left",sortDir:s,onSort:c,width:n,className:a="",style:l={},...i}){const b=!!c||s!==void 0,f=s==="asc"?E.ChevronUp:s==="desc"?E.ChevronDown:E.ChevronsUpDown;return r.jsx("th",{className:["ds-th",b?"ds-th--sortable":"",s?"ds-th--sorted":"",e!=="left"?`ds-table-cell--${e}`:"",a].filter(Boolean).join(" "),onClick:c,style:{width:n,...l},...i,children:b?r.jsxs("span",{className:"ds-th__inner",children:[t,r.jsx("span",{className:"ds-th__sort-icon",children:r.jsx(f,{size:11,strokeWidth:2.5})})]}):t})}function Je({children:t,align:e="left",secondary:s,muted:c,truncate:n,nowrap:a,className:l="",...i}){return r.jsx("td",{className:["ds-td",e!=="left"?`ds-table-cell--${e}`:"",s?"ds-table-cell--secondary":"",c?"ds-table-cell--muted":"",n?"ds-table-cell--truncate":"",a?"ds-table-cell--nowrap":"",l].filter(Boolean).join(" "),...i,children:t})}function Ke({icon:t,title:e,description:s,action:c,size:n="m",className:a="",...l}){return r.jsxs("div",{className:["ds-empty-state",`ds-empty-state--${n}`,a].filter(Boolean).join(" "),...l,children:[t&&r.jsx("div",{className:"ds-empty-state__icon",children:t}),r.jsx("div",{className:"ds-empty-state__title",children:e}),s&&r.jsx("div",{className:"ds-empty-state__description",children:s}),c&&r.jsx("div",{className:"ds-empty-state__action",children:c})]})}function Ze({trigger:t,items:e=[],open:s,onOpenChange:c,align:n="left",className:a="",style:l,...i}){const[b,f]=p.useState(!1),d=s!==void 0,u=d?s:b,x=p.useRef(null),[v,_]=p.useState({}),j=()=>{d?c==null||c(!1):f(!1)},S=()=>{const m=!u;d?c==null||c(m):f(m)};p.useEffect(()=>{if(!u)return;const m=()=>{var k;const w=(k=x.current)==null?void 0:k.getBoundingClientRect();w&&_(n==="right"?{top:w.bottom+4,right:window.innerWidth-w.right}:{top:w.bottom+4,left:w.left})};return m(),window.addEventListener("scroll",m,!0),window.addEventListener("resize",m),()=>{window.removeEventListener("scroll",m,!0),window.removeEventListener("resize",m)}},[u,n]),p.useEffect(()=>{if(!u)return;const m=k=>{var A;(A=x.current)!=null&&A.contains(k.target)||j()},w=k=>{k.key==="Escape"&&j()};return document.addEventListener("mousedown",m),document.addEventListener("keydown",w),()=>{document.removeEventListener("mousedown",m),document.removeEventListener("keydown",w)}},[u]);const $=u&&r.jsx("div",{className:["ds-dropdown__menu",`ds-dropdown__menu--${n}`].join(" "),style:v,children:e.map((m,w)=>{if(m.separator)return r.jsx("div",{className:"ds-dropdown__separator"},w);if(m.type==="section")return r.jsxs("div",{className:"ds-dropdown__section",children:[m.label&&r.jsx("div",{className:"ds-dropdown__section-label",children:m.label}),r.jsx("div",{className:"ds-dropdown__section-content",children:m.content})]},w);const k=!!m.href,A=k?"a":"button",I=k?{href:m.disabled?void 0:m.href,"aria-disabled":m.disabled?"true":void 0}:{type:"button",disabled:m.disabled};return r.jsxs(A,{className:["ds-dropdown__item",m.danger&&"ds-dropdown__item--danger"].filter(Boolean).join(" "),...I,onClick:()=>{var P;(P=m.onClick)==null||P.call(m),j()},children:[m.icon&&r.jsx("span",{className:"ds-dropdown__item-icon",children:m.icon}),r.jsx("span",{className:"ds-dropdown__item-label",children:m.label}),m.shortcut&&r.jsx("span",{className:"ds-dropdown__item-shortcut",children:m.shortcut})]},w)})});return r.jsxs("div",{ref:x,className:["ds-dropdown",a].filter(Boolean).join(" "),style:l,...i,children:[r.jsx("div",{className:"ds-dropdown__trigger",onClick:S,children:t}),typeof document<"u"&&q.createPortal($,document.body)]})}const ce={default:E.Info,success:E.CheckCircle,warning:E.AlertTriangle,error:E.XCircle};let W=[];const Q=new Set;function de(){Q.forEach(t=>t([...W]))}function Qe(t){W=[...W,t],de()}function et(t){W=W.filter(e=>e.id!==t),de()}function tt(){const t=(e,s={})=>{Qe({id:`${Date.now()}-${Math.random()}`,message:e,type:"default",duration:4e3,...s})};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}}function st({data:t,onDismiss:e}){const[s,c]=p.useState(!1),n=p.useRef(null);p.useEffect(()=>(requestAnimationFrame(()=>c(!0)),t.duration>0&&(n.current=setTimeout(()=>a(),t.duration)),()=>clearTimeout(n.current)),[]);function a(){c(!1),setTimeout(()=>e(t.id),250)}const l=ce[t.type]??ce.default;return r.jsxs("div",{className:["ds-toast",`ds-toast--${t.type}`,s&&"ds-toast--visible"].filter(Boolean).join(" "),role:t.type==="error"?"alert":"status","aria-live":"polite",children:[r.jsx("div",{className:"ds-toast__icon",children:r.jsx(l,{size:g[3],strokeWidth:1.5})}),r.jsx("span",{className:"ds-toast__message",children:t.message}),r.jsx("button",{className:"ds-toast__close",onClick:a,"aria-label":"Закрыть",children:r.jsx(E.X,{size:g[3],strokeWidth:1.5})})]})}function rt({position:t="bottom-right"}){const[e,s]=p.useState(()=>[...W]);return p.useEffect(()=>(Q.add(s),()=>Q.delete(s)),[]),!e.length||typeof document>"u"?null:q.createPortal(r.jsx("div",{className:["ds-toast-container",`ds-toast-container--${t}`].join(" "),children:e.map(c=>r.jsx(st,{data:c,onDismiss:et},c.id))}),document.body)}exports.Accordion=Oe;exports.Alert=$e;exports.Avatar=Ce;exports.Badge=Re;exports.Button=le;exports.Card=ve;exports.Checkbox=Fe;exports.Code=ge;exports.CodeAccordion=ie;exports.Dropdown=Ze;exports.EmptyState=Ke;exports.H1=je;exports.H2=_e;exports.H3=we;exports.H4=Ne;exports.Input=pe;exports.Link=Ae;exports.Modal=Se;exports.ModalFooter=Z;exports.P1=ye;exports.P2=Ee;exports.P3=ke;exports.Radio=We;exports.Select=he;exports.Skeleton=Ye;exports.Spinner=ze;exports.Stepper=xe;exports.Tab=Pe;exports.Table=He;exports.TableBody=qe;exports.TableHead=Ue;exports.TableRow=Xe;exports.Tabs=Ie;exports.Td=Je;exports.Textarea=be;exports.Th=Ge;exports.ToastContainer=rt;exports.Toggle=Me;exports.Tooltip=De;exports.iconSizes=g;exports.useToast=tt;
|