vlite3 0.5.2 → 0.5.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 (12) hide show
  1. package/README.md +117 -116
  2. package/_virtual/index10.js +2 -2
  3. package/_virtual/index11.js +2 -2
  4. package/_virtual/index7.js +2 -2
  5. package/_virtual/index9.js +2 -2
  6. package/components/Dropdown/DropdownItem.vue.js +28 -20
  7. package/components/Dropdown/DropdownMenu.vue.js +20 -19
  8. package/components/Modal.vue.d.ts +6 -2
  9. package/components/Modal.vue.js +1 -1
  10. package/components/Modal.vue2.js +56 -53
  11. package/package.json +2 -2
  12. package/style.css +1 -1
package/README.md CHANGED
@@ -24,7 +24,6 @@ import tailwindcss from '@tailwindcss/vite'
24
24
  export default defineConfig({
25
25
  plugins: [vue(), tailwindcss()],
26
26
  })
27
-
28
27
  ```
29
28
 
30
29
  `style.css`
@@ -35,7 +34,6 @@ export default defineConfig({
35
34
 
36
35
  @import 'vlite3/style.css';
37
36
  @source "../node_modules/vlite3";
38
-
39
37
  ```
40
38
 
41
39
  ## 3. Usage
@@ -53,7 +51,6 @@ import { Button, Input } from 'vlite3'
53
51
  <Input placeholder="Type here..." />
54
52
  </div>
55
53
  </template>
56
-
57
54
  ```
58
55
 
59
56
  ## Global Configuration (Registry System)
@@ -117,21 +114,20 @@ const vlite = createVLite({
117
114
  return data.url // MUST return the file URL string
118
115
  },
119
116
  },
120
-
117
+
121
118
  // Global UI Components Configuration
122
119
  components: {
123
120
  form: {
124
121
  variant: 'outline', // Applies 'outline' globally to all Form inputs ('solid' | 'outline' | 'floating' | etc.)
125
- size: 'md', // Global size for form inputs ('sm' | 'md' | 'lg')
126
- rounded: 'md', // Global border radius for forms
122
+ size: 'md', // Global size for form inputs ('sm' | 'md' | 'lg')
123
+ rounded: 'md', // Global border radius for forms
127
124
  showRequiredAsterisk: true, // Globally toggle the visibility of the required asterisk
128
- }
129
- }
125
+ },
126
+ },
130
127
  })
131
128
 
132
129
  app.use(vlite)
133
130
  app.mount('#app')
134
-
135
131
  ```
136
132
 
137
133
  ### How it works
@@ -184,11 +180,10 @@ const handleSubmit = (payload) => {
184
180
  <template>
185
181
  <div class="">
186
182
  <Form :schema="schema" @onSubmit="handleSubmit" />
187
-
183
+
188
184
  <Form :schema="schema" variant="solid" size="lg" @onSubmit="handleSubmit" />
189
185
  </div>
190
186
  </template>
191
-
192
187
  ```
193
188
 
194
189
  # 🎨 Theming & Customization
@@ -203,23 +198,23 @@ All colors are defined as CSS variables, allowing you to customize the appearanc
203
198
 
204
199
  Override these variables in `:root` or within a `.dark` class (when using class-based dark mode) to adjust your theme.
205
200
 
206
- | Variable | Utility Class | Description | Recommended Usage |
207
- | --- | --- | --- | --- |
208
- | `--color-background` | `bg-background` | Default page background (white) | Main application background |
209
- | `--color-foreground` | `text-foreground` | Default text color (gray-900) | Primary content text |
210
- | `--color-card` | `bg-card` | Card background (gray-100) | Cards, containers, surfaces, panels, dialogs |
211
- | `--color-primary` | `bg-primary` | Primary brand color (blue) | Main actions, buttons, active states |
212
- | `--color-primary-foreground` | `text-primary-foreground` | Text on primary background (white) | Text/icons displayed on primary elements |
213
- | `--color-secondary` | `bg-secondary` | Secondary background (gray-200) | Secondary actions, muted sections |
214
- | `--color-secondary-foreground` | `text-secondary-foreground` | Text on secondary background (gray-900) | Content displayed on secondary elements |
215
- | `--color-muted` | `bg-muted` | Muted background (gray-150) | Subtle surfaces, table headers, disabled states |
216
- | `--color-muted` | `text-muted` | Muted text (gray-600) | Secondary text, inactive links, descriptions |
217
- | `--color-accent` | `bg-accent` | Accent background (gray-150) | Hover states, selection highlights |
218
- | `--color-accent-foreground` | `text-accent-foreground` | Text on accent background (gray-900) | Content displayed on accent elements |
219
- | `--color-destructive` | `bg-destructive` | Destructive color (red) | Errors, warnings, destructive actions |
220
- | `--color-destructive-foreground` | `text-destructive-foreground` | Text on destructive background (white) | Content displayed on destructive elements |
221
- | `--color-border` | `border` | Default border color (gray-250) | Inputs, cards, dividers |
222
- | `--radius` | `rounded` | Global border radius | Shared radius across components |
201
+ | Variable | Utility Class | Description | Recommended Usage |
202
+ | -------------------------------- | ----------------------------- | --------------------------------------- | ----------------------------------------------- |
203
+ | `--color-background` | `bg-background` | Default page background (white) | Main application background |
204
+ | `--color-foreground` | `text-foreground` | Default text color (gray-900) | Primary content text |
205
+ | `--color-card` | `bg-card` | Card background (gray-100) | Cards, containers, surfaces, panels, dialogs |
206
+ | `--color-primary` | `bg-primary` | Primary brand color (blue) | Main actions, buttons, active states |
207
+ | `--color-primary-foreground` | `text-primary-foreground` | Text on primary background (white) | Text/icons displayed on primary elements |
208
+ | `--color-secondary` | `bg-secondary` | Secondary background (gray-200) | Secondary actions, muted sections |
209
+ | `--color-secondary-foreground` | `text-secondary-foreground` | Text on secondary background (gray-900) | Content displayed on secondary elements |
210
+ | `--color-muted` | `bg-muted` | Muted background (gray-150) | Subtle surfaces, table headers, disabled states |
211
+ | `--color-muted` | `text-muted` | Muted text (gray-600) | Secondary text, inactive links, descriptions |
212
+ | `--color-accent` | `bg-accent` | Accent background (gray-150) | Hover states, selection highlights |
213
+ | `--color-accent-foreground` | `text-accent-foreground` | Text on accent background (gray-900) | Content displayed on accent elements |
214
+ | `--color-destructive` | `bg-destructive` | Destructive color (red) | Errors, warnings, destructive actions |
215
+ | `--color-destructive-foreground` | `text-destructive-foreground` | Text on destructive background (white) | Content displayed on destructive elements |
216
+ | `--color-border` | `border` | Default border color (gray-250) | Inputs, cards, dividers |
217
+ | `--radius` | `rounded` | Global border radius | Shared radius across components |
223
218
 
224
219
  ---
225
220
 
@@ -227,9 +222,9 @@ Override these variables in `:root` or within a `.dark` class (when using class-
227
222
 
228
223
  For more complex components, vlite3 provides extended variants for main semantic colors (`primary`, `danger`, `warning`, `info`, `success`). These are useful for building nuanced UIs with subtle backgrounds, hover states, and accessible text.
229
224
 
230
- | Base Color | Variant Variables | Usage Description |
231
- | --- | --- | --- |
232
- | **Primary** | `--color-primary-light`<br>
225
+ | Base Color | Variant Variables | Usage Description |
226
+ | ----------- | --------------------------- | ----------------- |
227
+ | **Primary** | `--color-primary-light`<br> |
233
228
 
234
229
  <br>`--color-primary-dark`<br>
235
230
 
@@ -239,9 +234,9 @@ For more complex components, vlite3 provides extended variants for main semantic
239
234
 
240
235
  <br>**Dark**: Hover state for the main color.<br>
241
236
 
242
- <br>**Fg**: Text color on top of the *main* color.<br>
237
+ <br>**Fg**: Text color on top of the _main_ color.<br>
243
238
 
244
- <br>**Fg-Light**: Text color on top of the *light* variant. |
239
+ <br>**Fg-Light**: Text color on top of the _light_ variant. |
245
240
  | **Danger** | `--color-danger-light`<br>
246
241
 
247
242
  <br>`--color-danger-dark`<br>
@@ -303,19 +298,18 @@ For more complex components, vlite3 provides extended variants for main semantic
303
298
  </div>
304
299
 
305
300
  <button class="bg-danger text-danger-fg hover:bg-danger-dark">Delete</button>
306
-
307
301
  ```
308
302
 
309
303
  ### Additional Colors
310
304
 
311
305
  vlite3 also provides additional utility colors for specific feedback states:
312
306
 
313
- | Variable | Class Name | Description |
314
- | --- | --- | --- |
315
- | `--color-success` | `text-success`, `bg-success` | For success messages/badges. |
316
- | `--color-warning` | `text-warning`, `bg-warning` | For warning messages/badges. |
317
- | `--color-info` | `text-info`, `bg-info` | For informational messages/badges. |
318
- | `--color-danger` | `text-danger`, `bg-danger` | Alias for destructive in some contexts. |
307
+ | Variable | Class Name | Description |
308
+ | ----------------- | ---------------------------- | --------------------------------------- |
309
+ | `--color-success` | `text-success`, `bg-success` | For success messages/badges. |
310
+ | `--color-warning` | `text-warning`, `bg-warning` | For warning messages/badges. |
311
+ | `--color-info` | `text-info`, `bg-info` | For informational messages/badges. |
312
+ | `--color-danger` | `text-danger`, `bg-danger` | Alias for destructive in some contexts. |
319
313
 
320
314
  ---
321
315
 
@@ -323,8 +317,8 @@ vlite3 also provides additional utility colors for specific feedback states:
323
317
 
324
318
  The typography system is organized into two complementary scales:
325
319
 
326
- * Compact scale (prefixed with `--text--fs-*`)
327
- * Progressive scale (prefixed with `--text-fs-*`)
320
+ - Compact scale (prefixed with `--text--fs-*`)
321
+ - Progressive scale (prefixed with `--text-fs-*`)
328
322
 
329
323
  Use the progressive scale only when you need finer visual control beyond the standard Tailwind size tokens.
330
324
  For most layout and content needs, prefer the default Tailwind text sizes to maintain consistency.
@@ -340,7 +334,6 @@ For most layout and content needs, prefer the default Tailwind text sizes to mai
340
334
  --text--fs-6: 0.6em;
341
335
  --text--fs-7: 0.55em;
342
336
  --text--fs-8: 0.5em;
343
-
344
337
  ```
345
338
 
346
339
  ### Progressive Text Scale
@@ -366,23 +359,13 @@ For most layout and content needs, prefer the default Tailwind text sizes to mai
366
359
  --text-fs-9: 1.8em;
367
360
  --text-fs-9.5: 2em;
368
361
  --text-fs-10: 2.5em;
369
-
370
362
  ```
371
363
 
372
364
  ### Tailwind Size Tokens
373
365
 
374
366
  ```css
375
- --text-xs: 0.75rem
376
- --text-sm: 0.875rem
377
- --text-base: 1rem
378
- --text-lg: 1.125rem
379
- --text-xl: 1.25rem
380
- --text-2xl: 1.5rem
381
- --text-3xl: 1.875rem
382
- --text-4xl: 2.25rem
383
- --text-5xl: 3rem
384
- --text-6xl: 4rem;
385
-
367
+ --text-xs: 0.75rem --text-sm: 0.875rem --text-base: 1rem --text-lg: 1.125rem --text-xl: 1.25rem
368
+ --text-2xl: 1.5rem --text-3xl: 1.875rem --text-4xl: 2.25rem --text-5xl: 3rem --text-6xl: 4rem;
386
369
  ```
387
370
 
388
371
  ---
@@ -395,87 +378,105 @@ For most layout and content needs, prefer the default Tailwind text sizes to mai
395
378
  <span class="-text-fs-4 text-muted"> Caption text </span>
396
379
 
397
380
  <h1 class="text-xl font-semibold">Page Title</h1>
398
-
399
381
  ```
400
382
 
401
383
  ## Hard Rules
402
384
 
403
385
  Follow these rules strictly to ensure visual consistency and predictable styling across the system:
404
386
 
405
- * Use `border` instead of `border-border` (the default border color (gray-250) is already applied).
406
- * Use `rounded` instead of `rounded-rounded`.
407
- * Use `bg-muted` instead of `bg-secondary/20`.
408
- * Use `gap-x-*` instead of applying `ml-*` or `mr-*` directly on sibling items.
409
- * Use `gap-y-*` instead of applying `mt-*` or `mb-*` directly on sibling items.
387
+ - Use `border` instead of `border-border` (the default border color (gray-250) is already applied).
388
+ - Use `rounded` instead of `rounded-rounded`.
389
+ - Use `bg-muted` instead of `bg-secondary/20`.
390
+ - Use `gap-x-*` instead of applying `ml-*` or `mr-*` directly on sibling items.
391
+ - Use `gap-y-*` instead of applying `mt-*` or `mb-*` directly on sibling items.
410
392
 
411
393
  ---
412
394
 
413
395
  ## ✅ Components
414
396
 
415
- * **Button**
416
- * **ButtonGroup**
417
- * **Icon**
418
- * **Label**
419
- * **Badge**
420
- * **Chip**
421
- * **Logo**
422
- * **Navbar**
423
- * **SidebarMenu**
424
- * **SidePanel**
425
- * **Masonry Grid**
426
- * **ThemeToggle**
397
+ - [x] **Button**
398
+ - [x] **ButtonGroup**
399
+ - [x] **Icon**
400
+ - [x] **Label**
401
+ - [x] **Badge**
402
+ - [x] **Chip**
403
+ - [x] **Logo**
404
+ - [x] **Navbar**
405
+ - [x] **SidebarMenu**
406
+ - [x] **SidePanel**
407
+ - [x] **Breadcrumb**
408
+ - [x] **List**
409
+ - [x] **Masonry Grid**
410
+ - [x] **Stats**
411
+ - [x] **ThemeToggle**
412
+ - [x] **Screen**
427
413
 
428
414
  ### Inputs & Forms
429
415
 
430
- * **Input**
431
- * **Textarea**
432
- * **CheckBox**
433
- * **Switch**
434
- * **ChoiceBox**
435
- * **Slider**
436
- * **OTPInput**
437
- * **DatePicker**
438
- * **ColorPicker**
439
- * **FilePicker**
440
- * **AvatarUploader**
441
- * **IconPicker**
442
- * **MultiSelect**
443
- * **Form**
444
- * **CustomFields**
445
- * **NumberInput**
446
- * **Google Login**
416
+ - [x] **Input**
417
+ - [x] **Textarea**
418
+ - [x] **CheckBox**
419
+ - [x] **Switch**
420
+ - [x] **ChoiceBox**
421
+ - [x] **Slider**
422
+ - [x] **OTPInput**
423
+ - [x] **NumberInput**
424
+ - [x] **DatePicker**
425
+ - [x] **DateRangePicker**
426
+ - [x] **ColorPicker**
427
+ - [x] **FilePicker**
428
+ - [x] **AvatarUploader**
429
+ - [x] **IconPicker**
430
+ - [x] **MultiSelect**
431
+ - [x] **Forms**
432
+ - [x] **CustomFields**
433
+ - [x] **GoogleLogin**
434
+ - [x] **PermissionEditor**
447
435
 
448
436
  ### Data Display
449
437
 
450
- * **Avatar**
451
- * **Accordion**
452
- * **Carousel**
453
- * **DataTable**
454
- * **Pagination**
455
- * **Timeline**
456
- * **Heatmap**
457
- * **PricingPlan**
458
- * **FileTree**
459
- * **Workbook**
460
- * **Tabes**
438
+ - [x] **Avatar**
439
+ - [x] **Accordion**
440
+ - [x] **Carousel**
441
+ - [x] **DataTable**
442
+ - [x] **DataList**
443
+ - [x] **Pagination**
444
+ - [x] **Timeline**
445
+ - [x] **Heatmap**
446
+ - [x] **PricingPlan**
447
+ - [x] **FileTree**
448
+ - [x] **Workbook**
449
+ - [x] **Kanban**
450
+ - [x] **Tabes**
451
+ - [x] **Masonry**
452
+ - [x] **Stats**
461
453
 
462
454
  ### Feedback & Overlays
463
455
 
464
- * **Alert**
465
- * **Modal**
466
- * **ConfirmationModal**
467
- * **ToastNotification**
468
- * **Tooltip**
469
- * **Dropdown**
470
- * **ProgressBar**
471
- * **Spinner**
456
+ - [x] **Alert**
457
+ - [x] **Modal**
458
+ - [x] **ConfirmationModal**
459
+ - [x] **ToastNotification**
460
+ - [x] **Tooltip**
461
+ - [x] **Dropdown**
462
+ - [x] **ProgressBar**
463
+ - [x] **Spinner**
464
+ - [x] **CommandPalette**
465
+ - [x] **SidePanel**
472
466
 
473
- ## Complete reference for AI agents and developers:
467
+ ### Utilities & Tools
474
468
 
475
- * [1-setup.md](https://github.com/safdar-azeem/vlite3/blob/main/docs/1-setup.md)
476
- * [2-theming.md](https://github.com/safdar-azeem/vlite3/blob/main/docs/2-theming.md)
477
- * [3-all-components.md](https://github.com/safdar-azeem/vlite3/blob/main/docs/3-all-components.md)
478
- * [4-forms.md](https://github.com/safdar-azeem/vlite3/blob/main/docs/4-forms.md)
479
- * [5-utility.md](https://github.com/safdar-azeem/vlite3/blob/main/docs/5-utility.md)
480
- * [6-advance-components.md](https://github.com/safdar-azeem/vlite3/blob/main/docs/6-advance-components.md)
469
+ - [x] **Barcode**
470
+ - [x] **QRCode**
471
+ - [x] **ImportData**
472
+ - [x] **ExportData**
473
+
474
+ ## Complete reference for AI agents and developers:
481
475
 
476
+ - [0-setup.md](https://github.com/safdar-azeem/vlite3/blob/main/docs/0-vlite3-setup.md)
477
+ - [1-theming.md](https://github.com/safdar-azeem/vlite3/blob/main/docs/1-theming.md)
478
+ - [2-components.md](https://github.com/safdar-azeem/vlite3/blob/main/docs/2-all-components.md)
479
+ - [3-forms.md](https://github.com/safdar-azeem/vlite3/blob/main/docs/components/Forms.md)
480
+ - [3-utility.md](https://github.com/safdar-azeem/vlite3/blob/main/docs/3-utility.md)
481
+ - [4-i18n.md](https://github.com/safdar-azeem/vlite3/blob/main/docs/4-i18n.md)
482
+ - [5-search-util.md](https://github.com/safdar-azeem/vlite3/blob/main/docs/5-search-util.md)
package/_virtual/index10.js CHANGED
@@ -1,4 +1,4 @@
1
- var e = {};
1
+ var r = {};
2
2
  export {
3
- e as __exports
3
+ r as __exports
4
4
  };
package/_virtual/index11.js CHANGED
@@ -1,4 +1,4 @@
1
- var r = {};
1
+ var e = {};
2
2
  export {
3
- r as __exports
3
+ e as __exports
4
4
  };
package/_virtual/index7.js CHANGED
@@ -1,4 +1,4 @@
1
- var a = {};
1
+ var r = {};
2
2
  export {
3
- a as __exports
3
+ r as __exports
4
4
  };
package/_virtual/index9.js CHANGED
@@ -1,4 +1,4 @@
1
- var r = {};
1
+ var a = {};
2
2
  export {
3
- r as __exports
3
+ a as __exports
4
4
  };
package/components/Dropdown/DropdownItem.vue.js CHANGED
@@ -1,13 +1,13 @@
1
- import { defineComponent as k, computed as l, openBlock as o, createElementBlock as s, normalizeClass as h, renderSlot as g, normalizeProps as w, guardReactiveProps as I, createBlock as p, createCommentVNode as i, createElementVNode as a, toDisplayString as c } from "vue";
2
- import f from "../Icon.vue.js";
1
+ import { defineComponent as g, computed as s, openBlock as n, createElementBlock as l, withKeys as k, withModifiers as w, normalizeClass as h, renderSlot as I, normalizeProps as $, guardReactiveProps as B, createBlock as b, createCommentVNode as i, createElementVNode as c, toDisplayString as a } from "vue";
2
+ import v from "../Icon.vue.js";
3
3
  import { $t as d } from "../../utils/i18n.js";
4
- const B = ["data-disabled"], $ = { class: "flex flex-col flex-1 min-w-0" }, j = { class: "flex items-center justify-between gap-2" }, C = { class: "truncate font-medium" }, D = {
4
+ const j = ["data-disabled"], C = { class: "flex flex-col flex-1 min-w-0" }, D = { class: "flex items-center justify-between gap-2" }, S = { class: "truncate font-medium" }, z = {
5
5
  key: 0,
6
6
  class: "text-xs text-muted-foreground whitespace-nowrap opacity-90"
7
- }, S = {
7
+ }, E = {
8
8
  key: 0,
9
9
  class: "text-[10px] text-muted-foreground truncate opacity-70"
10
- }, P = /* @__PURE__ */ k({
10
+ }, P = /* @__PURE__ */ g({
11
11
  __name: "DropdownItem",
12
12
  props: {
13
13
  option: {},
@@ -17,40 +17,48 @@ const B = ["data-disabled"], $ = { class: "flex flex-col flex-1 min-w-0" }, j =
17
17
  index: {}
18
18
  },
19
19
  emits: ["click", "mouseenter"],
20
- setup(e, { emit: b }) {
21
- const t = e, x = b, y = l(() => t.option.labelI18n ? d(t.option.labelI18n) : t.option.label), r = l(() => t.option.subtitleI18n ? d(t.option.subtitleI18n) : t.option.subtitle), u = l(() => t.option.descriptionI18n ? d(t.option.descriptionI18n) : t.option.description);
22
- return (m, n) => (o(), s("div", {
20
+ setup(e, { emit: x }) {
21
+ const t = e, r = x, y = s(
22
+ () => t.option.labelI18n ? d(t.option.labelI18n) : t.option.label
23
+ ), u = s(
24
+ () => t.option.subtitleI18n ? d(t.option.subtitleI18n) : t.option.subtitle
25
+ ), m = s(
26
+ () => t.option.descriptionI18n ? d(t.option.descriptionI18n) : t.option.description
27
+ );
28
+ return (f, o) => (n(), l("div", {
29
+ tabindex: 0,
23
30
  "data-dropdown-item": "",
24
- class: h(["relative flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none transition-colors data-disabled:pointer-events-none data-disabled:opacity-50", [
31
+ class: h(["relative w-full flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none transition-colors focus-visible:bg-accent focus-visible:text-accent-foreground focus-visible:ring-1 focus-visible:ring-primary focus-visible:ring-offset-1 data-disabled:pointer-events-none data-disabled:opacity-50", [
25
32
  e.selectable && e.selected && !e.option.children ? "bg-accent" : "",
26
33
  e.focused ? "bg-accent text-accent-foreground" : "hover:bg-accent hover:text-accent-foreground",
27
34
  e.option.disabled ? "opacity-50 cursor-not-allowed" : "cursor-pointer"
28
35
  ]]),
29
36
  "data-disabled": e.option.disabled ? !0 : void 0,
30
- onClick: n[0] || (n[0] = (v) => x("click", e.option)),
31
- onMouseenter: n[1] || (n[1] = (v) => m.$emit("mouseenter", e.index ?? -1))
37
+ onClick: o[0] || (o[0] = (p) => r("click", e.option)),
38
+ onKeydown: o[1] || (o[1] = k(w((p) => r("click", e.option), ["prevent"]), ["enter"])),
39
+ onMouseenter: o[2] || (o[2] = (p) => f.$emit("mouseenter", e.index ?? -1))
32
40
  }, [
33
- g(m.$slots, "default", w(I({ option: e.option, index: e.index, selected: e.selected })), () => [
34
- e.option.icon || e.option.emoji ? (o(), p(f, {
41
+ I(f.$slots, "default", $(B({ option: e.option, index: e.index, selected: e.selected })), () => [
42
+ e.option.icon || e.option.emoji ? (n(), b(v, {
35
43
  key: 0,
36
44
  icon: e.option.icon,
37
45
  emoji: e.option.emoji,
38
46
  class: "mr-2 h-4 w-4 shrink-0 mt-0.5"
39
47
  }, null, 8, ["icon", "emoji"])) : i("", !0),
40
- a("div", $, [
41
- a("div", j, [
42
- a("span", C, c(y.value), 1),
43
- r.value ? (o(), s("span", D, c(r.value), 1)) : i("", !0)
48
+ c("div", C, [
49
+ c("div", D, [
50
+ c("span", S, a(y.value), 1),
51
+ u.value ? (n(), l("span", z, a(u.value), 1)) : i("", !0)
44
52
  ]),
45
- u.value ? (o(), s("span", S, c(u.value), 1)) : i("", !0)
53
+ m.value ? (n(), l("span", E, a(m.value), 1)) : i("", !0)
46
54
  ]),
47
- e.selectable && e.selected ? (o(), p(f, {
55
+ e.selectable && e.selected ? (n(), b(v, {
48
56
  key: 1,
49
57
  icon: "lucide:check",
50
58
  class: "ml-2 h-4 w-4 shrink-0 text-primary"
51
59
  })) : i("", !0)
52
60
  ])
53
- ], 42, B));
61
+ ], 42, j));
54
62
  }
55
63
  });
56
64
  export {
package/components/Dropdown/DropdownMenu.vue.js CHANGED
@@ -1,7 +1,7 @@
1
- import { defineComponent as Z, defineAsyncComponent as ee, ref as j, computed as h, watch as T, onMounted as te, onBeforeUnmount as le, openBlock as n, createElementBlock as d, createVNode as S, createCommentVNode as u, renderSlot as b, unref as o, normalizeStyle as se, normalizeClass as _, toDisplayString as D, createBlock as v, Fragment as E, renderList as ne, withCtx as N, createElementVNode as $, createSlots as oe, mergeProps as re, nextTick as ae } from "vue";
1
+ import { defineComponent as Z, defineAsyncComponent as ee, ref as j, computed as h, watch as T, onMounted as te, onBeforeUnmount as le, openBlock as n, createElementBlock as c, createVNode as S, createCommentVNode as u, renderSlot as b, unref as o, normalizeStyle as se, normalizeClass as _, toDisplayString as D, createBlock as v, Fragment as E, renderList as ne, withCtx as N, createElementVNode as $, createSlots as oe, mergeProps as re, nextTick as ae } from "vue";
2
2
  import I from "../Icon.vue.js";
3
- import de from "../Input.vue.js";
4
- import ce from "./DropdownItem.vue.js";
3
+ import ce from "../Input.vue.js";
4
+ import de from "./DropdownItem.vue.js";
5
5
  import ie from "./DropdownBooleanItem.vue.js";
6
6
  import ue from "./DropdownGroupedLayout.vue.js";
7
7
  import { useDropdownNavigation as fe } from "./composables/useDropdownNavigation.js";
@@ -54,7 +54,7 @@ const he = ["dir"], ve = {
54
54
  }), L = h(() => {
55
55
  const e = M("vlite.dropdown.search");
56
56
  return e !== "vlite.dropdown.search" ? e : "Search...";
57
- }), c = h(() => t.options ? t.options.map((e) => typeof e == "string" || typeof e == "number" ? { label: String(e), value: String(e) } : e) : []), R = h(() => t.remote ? t.searchable : t.searchable && (c.value.length || 0) > 9);
57
+ }), d = h(() => t.options ? t.options.map((e) => typeof e == "string" || typeof e == "number" ? { label: String(e), value: String(e) } : e) : []), R = h(() => t.remote ? t.searchable : t.searchable && (d.value.length || 0) > 9);
58
58
  let k = null;
59
59
  T(m, (e) => {
60
60
  t.remote && (k && clearTimeout(k), k = setTimeout(() => {
@@ -75,12 +75,12 @@ const he = ["dir"], ve = {
75
75
  onMouseEnterItem: x,
76
76
  scrollToIndex: U
77
77
  } = fe({
78
- options: c,
78
+ options: d,
79
79
  searchQuery: m,
80
80
  containerRef: O,
81
81
  emit: (e, ...s) => f(e, ...s),
82
82
  handleSelect: (e, s) => w(e)
83
- }), g = h(() => t.remote ? m.value ? c.value : t.cachedOptions.length ? t.cachedOptions : c.value : K.value), q = (e) => {
83
+ }), g = h(() => t.remote ? m.value ? d.value : t.cachedOptions.length ? t.cachedOptions : d.value : K.value), q = (e) => {
84
84
  if (!(!t.selected || typeof t.selected != "object") && e.key && e.key in t.selected)
85
85
  return t.selected[e.key];
86
86
  }, G = (e) => e.disabled ? !1 : Array.isArray(t.selected) ? t.selected.includes(e.value) : t.selected && typeof t.selected == "object" && e.key ? t.selected[e.key] === e.value : t.selected === e.value, J = (e) => !e.key || !t.selected || typeof t.selected != "object" ? !1 : !!t.selected[e.key], Q = (e, s) => {
@@ -105,7 +105,7 @@ const he = ["dir"], ve = {
105
105
  }, X = async () => {
106
106
  await ae();
107
107
  let e = -1;
108
- t.layout !== "grouped" && (t.selectedIndex !== null && t.selectedIndex >= 0 ? e = t.selectedIndex : t.selected !== void 0 && typeof t.selected != "object" && (e = c.value.findIndex((s) => s.value === t.selected)), e !== -1 && U(e));
108
+ t.layout !== "grouped" && (t.selectedIndex !== null && t.selectedIndex >= 0 ? e = t.selectedIndex : t.selected !== void 0 && typeof t.selected != "object" && (e = d.value.findIndex((s) => s.value === t.selected)), e !== -1 && U(e));
109
109
  };
110
110
  T(
111
111
  () => g.value,
@@ -118,12 +118,12 @@ const he = ["dir"], ve = {
118
118
  window.removeEventListener("keydown", B);
119
119
  });
120
120
  const Y = (e) => e.labelI18n ? M(e.labelI18n) : e.label;
121
- return (e, s) => (n(), d("div", {
121
+ return (e, s) => (n(), c("div", {
122
122
  class: "dropdown-menu w-full min-w-[150px] flex flex-col",
123
123
  dir: r.direction
124
124
  }, [
125
- R.value ? (n(), d("div", ve, [
126
- S(de, {
125
+ R.value ? (n(), c("div", ve, [
126
+ S(ce, {
127
127
  modelValue: m.value,
128
128
  "onUpdate:modelValue": s[0] || (s[0] = (l) => m.value = l),
129
129
  placeholder: L.value,
@@ -136,10 +136,10 @@ const he = ["dir"], ve = {
136
136
  "show-clear-button": !1
137
137
  }, null, 8, ["modelValue", "placeholder"])
138
138
  ])) : u("", !0),
139
- e.$slots.header ? (n(), d("div", ye, [
139
+ e.$slots.header ? (n(), c("div", ye, [
140
140
  b(e.$slots, "header")
141
141
  ])) : u("", !0),
142
- c.value.length > 0 || e.$slots.menu ? (n(), d("div", {
142
+ d.value.length > 0 || e.$slots.menu ? (n(), c("div", {
143
143
  key: 2,
144
144
  ref_key: "containerRef",
145
145
  ref: O,
@@ -154,7 +154,7 @@ const he = ["dir"], ve = {
154
154
  (...l) => o(C) && o(C)(...l)),
155
155
  onScroll: F
156
156
  }, [
157
- g.value.length === 0 && c.value.length > 0 && !r.loading ? (n(), d("div", ge, D(A.value), 1)) : u("", !0),
157
+ g.value.length === 0 && d.value.length > 0 && !r.loading ? (n(), c("div", ge, D(A.value), 1)) : u("", !0),
158
158
  r.layout === "grouped" ? (n(), v(ue, {
159
159
  key: 1,
160
160
  options: g.value,
@@ -162,8 +162,8 @@ const he = ["dir"], ve = {
162
162
  selectable: r.selectable,
163
163
  columns: r.columns,
164
164
  onSelect: w
165
- }, null, 8, ["options", "selected", "selectable", "columns"])) : (n(!0), d(E, { key: 2 }, ne(g.value, (l, a) => (n(), d(E, { key: a }, [
166
- l.label === "---" ? (n(), d("div", be)) : l.data?.isBoolean ? (n(), v(ie, {
165
+ }, null, 8, ["options", "selected", "selectable", "columns"])) : (n(!0), c(E, { key: 2 }, ne(g.value, (l, a) => (n(), c(E, { key: a }, [
166
+ l.label === "---" ? (n(), c("div", be)) : l.data?.isBoolean ? (n(), v(ie, {
167
167
  key: 1,
168
168
  option: l,
169
169
  value: J(l),
@@ -187,8 +187,9 @@ const he = ["dir"], ve = {
187
187
  }, {
188
188
  trigger: N(() => [
189
189
  $("div", {
190
+ tabindex: 0,
190
191
  "data-dropdown-item": "",
191
- class: _(["relative flex cursor-pointer select-none items-center rounded-sm px-2 py-1.5 text-sm font-medium outline-none transition-colors justify-between w-full", [
192
+ class: _(["relative flex cursor-pointer select-none items-center rounded-sm px-2 py-1.5 text-sm font-medium outline-none transition-colors justify-between w-full focus-visible:bg-accent focus-visible:text-accent-foreground focus-visible:ring-1 focus-visible:ring-primary focus-visible:ring-offset-1", [
192
193
  o(p) && o(y) === a ? "bg-accent text-accent-foreground" : "hover:bg-accent hover:text-accent-foreground",
193
194
  l.disabled ? "opacity-50 cursor-not-allowed" : ""
194
195
  ]]),
@@ -210,7 +211,7 @@ const he = ["dir"], ve = {
210
211
  ], 42, ke)
211
212
  ]),
212
213
  _: 2
213
- }, 1032, ["position", "offset", "options", "selected", "menuId", "nestedPosition", "nestedOffset", "selectable", "ignoreClickOutside", "direction", "onOnSelect"])) : (n(), v(ce, {
214
+ }, 1032, ["position", "offset", "options", "selected", "menuId", "nestedPosition", "nestedOffset", "selectable", "ignoreClickOutside", "direction", "onOnSelect"])) : (n(), v(de, {
214
215
  key: 3,
215
216
  option: l,
216
217
  index: a,
@@ -229,7 +230,7 @@ const he = ["dir"], ve = {
229
230
  } : void 0
230
231
  ]), 1032, ["option", "index", "selected", "focused", "selectable", "onClick", "onMouseenter"]))
231
232
  ], 64))), 128)),
232
- r.loading ? (n(), d("div", xe, [
233
+ r.loading ? (n(), c("div", xe, [
233
234
  S(I, {
234
235
  icon: "lucide:loader-2",
235
236
  class: "w-4 h-4 animate-spin text-muted-foreground"
@@ -237,7 +238,7 @@ const he = ["dir"], ve = {
237
238
  ])) : u("", !0),
238
239
  b(e.$slots, "menu")
239
240
  ], 38)) : u("", !0),
240
- e.$slots.footer ? (n(), d("div", Se, [
241
+ e.$slots.footer ? (n(), c("div", Se, [
241
242
  b(e.$slots, "footer")
242
243
  ])) : u("", !0)
243
244
  ], 8, he));
package/components/Modal.vue.d.ts CHANGED
@@ -27,7 +27,9 @@ declare function __VLS_template(): {
27
27
  close: () => void;
28
28
  }): any;
29
29
  };
30
- refs: {};
30
+ refs: {
31
+ modalRef: HTMLDivElement;
32
+ };
31
33
  rootEl: any;
32
34
  };
33
35
  type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
@@ -44,7 +46,9 @@ declare const __VLS_component: import('vue').DefineComponent<Props, {}, {}, {},
44
46
  maxWidth: string;
45
47
  closeOutside: boolean;
46
48
  backdrop: boolean;
47
- }, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
49
+ }, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {
50
+ modalRef: HTMLDivElement;
51
+ }, any>;
48
52
  declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
49
53
  export default _default;
50
54
  type __VLS_WithTemplateSlots<T, S> = T & {
package/components/Modal.vue.js CHANGED
@@ -1,7 +1,7 @@
1
1
  import o from "./Modal.vue2.js";
2
2
  /* empty css */
3
3
  import t from "../_virtual/_plugin-vue_export-helper.js";
4
- const m = /* @__PURE__ */ t(o, [["__scopeId", "data-v-32c213fd"]]);
4
+ const m = /* @__PURE__ */ t(o, [["__scopeId", "data-v-b4f8e934"]]);
5
5
  export {
6
6
  m as default
7
7
  };
package/components/Modal.vue2.js CHANGED
@@ -1,14 +1,14 @@
1
- import { defineComponent as E, ref as b, watch as g, provide as N, onUnmounted as P, computed as k, openBlock as l, createElementBlock as r, Fragment as V, createElementVNode as d, mergeProps as x, withModifiers as C, renderSlot as u, createCommentVNode as c, createBlock as w, Teleport as j, createVNode as $, Transition as K, withCtx as M, normalizeClass as a, toDisplayString as B, resolveDynamicComponent as W } from "vue";
2
- import A from "./Button.vue.js";
3
- import { useKeyStroke as F } from "../composables/useKeyStroke.js";
4
- import { $t as T } from "../utils/i18n.js";
5
- const U = {
1
+ import { defineComponent as N, ref as u, watch as g, provide as P, nextTick as V, onUnmounted as j, computed as x, openBlock as s, createElementBlock as r, Fragment as K, createElementVNode as d, mergeProps as C, withModifiers as w, renderSlot as f, createCommentVNode as c, createBlock as $, Teleport as M, createVNode as B, Transition as R, withCtx as W, normalizeClass as a, toDisplayString as T, resolveDynamicComponent as A } from "vue";
2
+ import F from "./Button.vue.js";
3
+ import { useKeyStroke as U } from "../composables/useKeyStroke.js";
4
+ import { $t as I } from "../utils/i18n.js";
5
+ const q = {
6
6
  key: 0,
7
7
  class: "flex-none flex flex-col space-y-1.5 pb-0 border-b border-border/90"
8
- }, q = { class: "text-lg font-semibold leading-none tracking-tight" }, G = {
8
+ }, G = { class: "text-lg font-semibold leading-none tracking-tight" }, H = {
9
9
  key: 0,
10
10
  class: "text-sm text-muted-foreground mb-6.5"
11
- }, R = /* @__PURE__ */ E({
11
+ }, Y = /* @__PURE__ */ N({
12
12
  inheritAttrs: !1,
13
13
  __name: "Modal",
14
14
  props: {
@@ -28,51 +28,51 @@ const U = {
28
28
  bodyProps: {}
29
29
  },
30
30
  emits: ["close", "update:show", "onOpen"],
31
- setup(t, { emit: I }) {
32
- const o = t, f = I, i = b(o.show), y = b(!1), m = b(!1);
33
- let n = null;
31
+ setup(t, { emit: S }) {
32
+ const o = t, m = S, n = u(o.show), b = u(!1), y = u(!1), p = u(null);
33
+ let i = null;
34
34
  g(
35
35
  () => o.show,
36
36
  (e) => {
37
- i.value = e, e && f("onOpen");
37
+ n.value = e, e && m("onOpen");
38
38
  }
39
39
  );
40
- const S = () => {
41
- i.value = !0;
42
- }, O = (e) => {
43
- y.value = e;
44
- }, s = () => {
45
- if (y.value) {
46
- m.value = !0, n && clearTimeout(n), n = setTimeout(() => {
47
- m.value = !1;
40
+ const O = () => {
41
+ n.value = !0;
42
+ }, z = (e) => {
43
+ b.value = e;
44
+ }, l = () => {
45
+ if (b.value) {
46
+ y.value = !0, i && clearTimeout(i), i = setTimeout(() => {
47
+ y.value = !1;
48
48
  }, 1e3);
49
49
  return;
50
50
  }
51
- i.value = !1, f("update:show", !1), f("close");
51
+ n.value = !1, m("update:show", !1), m("close");
52
52
  };
53
- N("modal-context", { close: s, setSubmitting: O });
54
- const z = () => {
55
- o.closeOutside && s();
56
- }, { onKeyStroke: D } = F();
57
- D("Escape", s), g(i, (e) => {
58
- e ? document.body.style.overflow = "hidden" : document.body.style.overflow = "";
59
- }), P(() => {
60
- document.body.style.overflow = "", n && clearTimeout(n);
53
+ P("modal-context", { close: l, setSubmitting: z });
54
+ const D = () => {
55
+ o.closeOutside && l();
56
+ }, { onKeyStroke: E } = U();
57
+ E("Escape", l), g(n, async (e) => {
58
+ e ? (document.body.style.overflow = "hidden", await V(), p.value?.focus()) : document.body.style.overflow = "";
59
+ }), j(() => {
60
+ document.body.style.overflow = "", i && clearTimeout(i);
61
61
  });
62
- const p = k(() => o.titleI18n ? T(o.titleI18n) : o.title), v = k(
63
- () => o.descriptionI18n ? T(o.descriptionI18n) : o.description
62
+ const v = x(() => o.titleI18n ? I(o.titleI18n) : o.title), h = x(
63
+ () => o.descriptionI18n ? I(o.descriptionI18n) : o.description
64
64
  );
65
- return (e, h) => (l(), r(V, null, [
66
- d("span", x({
67
- onClick: C(S, ["stop"]),
65
+ return (e, k) => (s(), r(K, null, [
66
+ d("span", C({
67
+ onClick: w(O, ["stop"]),
68
68
  class: `${t.triggerClass}`
69
69
  }, e.$attrs), [
70
- u(e.$slots, "trigger", {}, () => [
71
- t.body ? u(e.$slots, "default", { key: 0 }, void 0, !0) : c("", !0)
70
+ f(e.$slots, "trigger", {}, () => [
71
+ t.body ? f(e.$slots, "default", { key: 0 }, void 0, !0) : c("", !0)
72
72
  ], !0)
73
73
  ], 16),
74
- (l(), w(j, { to: "body" }, [
75
- $(K, {
74
+ (s(), $(M, { to: "body" }, [
75
+ B(R, {
76
76
  "enter-active-class": "transition duration-200 ease-out",
77
77
  "enter-from-class": "opacity-0",
78
78
  "enter-to-class": "opacity-100",
@@ -80,46 +80,49 @@ const U = {
80
80
  "leave-from-class": "opacity-100",
81
81
  "leave-to-class": "opacity-0"
82
82
  }, {
83
- default: M(() => [
84
- i.value ? (l(), r("div", {
83
+ default: W(() => [
84
+ n.value ? (s(), r("div", {
85
85
  key: 0,
86
86
  class: a(["fixed inset-0 z-50 flex items-center justify-center bg-[#00000051] p-4", t.backdrop && "backdrop-blur-[2px]"]),
87
- onClick: z
87
+ onClick: D
88
88
  }, [
89
89
  d("div", {
90
- class: a(["modal-body relative w-full rounded border border-border/60 bg-body shadow-lg text-foreground flex flex-col max-h-[85vh] sm:max-h-[90vh]", [t.maxWidth]]),
91
- onClick: h[0] || (h[0] = C(() => {
90
+ ref_key: "modalRef",
91
+ ref: p,
92
+ tabindex: "-1",
93
+ class: a(["modal-body relative w-full rounded border border-border/60 bg-body shadow-lg text-foreground flex flex-col max-h-[85vh] sm:max-h-[90vh] focus:outline-none", [t.maxWidth]]),
94
+ onClick: k[0] || (k[0] = w(() => {
92
95
  }, ["stop"]))
93
96
  }, [
94
- p.value ? (l(), r("div", U, [
97
+ v.value ? (s(), r("div", q, [
95
98
  d("div", {
96
99
  class: a(["flex items-center justify-between py-2 px-4 rounded-t-md", t.headerClass])
97
100
  }, [
98
- d("h3", q, B(p.value), 1),
99
- $(A, {
101
+ d("h3", G, T(v.value), 1),
102
+ B(F, {
100
103
  rounded: "full",
101
104
  size: "sm",
102
105
  icon: "lucide:x",
103
106
  variant: "ghost",
104
- class: a(["hover:bg-gray-250/25! transition-all", { "blink-bg": m.value }]),
105
- onClick: s
107
+ class: a(["hover:bg-gray-250/25! transition-all", { "blink-bg": y.value }]),
108
+ onClick: l
106
109
  }, null, 8, ["class"])
107
110
  ], 2)
108
111
  ])) : c("", !0),
109
112
  d("div", {
110
113
  class: a(["flex-1 overflow-y-auto px-4 pt-4 pb-3.5 min-h-0", t.bodyClass])
111
114
  }, [
112
- v.value ? (l(), r("p", G, B(v.value), 1)) : c("", !0),
113
- t.body ? (l(), w(W(t.body), x({ key: 1 }, { ...t.bodyProps, ...e.$attrs }, { close: s }), null, 16)) : u(e.$slots, "default", {
115
+ h.value ? (s(), r("p", H, T(h.value), 1)) : c("", !0),
116
+ t.body ? (s(), $(A(t.body), C({ key: 1 }, { ...t.bodyProps, ...e.$attrs }, { close: l }), null, 16)) : f(e.$slots, "default", {
114
117
  key: 2,
115
- close: s
118
+ close: l
116
119
  }, void 0, !0)
117
120
  ], 2),
118
- e.$slots.footer ? (l(), r("div", {
121
+ e.$slots.footer ? (s(), r("div", {
119
122
  key: 1,
120
123
  class: a([t.footerClass, "flex-none flex items-center px-4 py-3 border-t border-border/75 rounded-b-xl bg-body"])
121
124
  }, [
122
- u(e.$slots, "footer", { close: s }, void 0, !0)
125
+ f(e.$slots, "footer", { close: l }, void 0, !0)
123
126
  ], 2)) : c("", !0)
124
127
  ], 2)
125
128
  ], 2)) : c("", !0)
@@ -131,5 +134,5 @@ const U = {
131
134
  }
132
135
  });
133
136
  export {
134
- R as default
137
+ Y as default
135
138
  };
package/package.json CHANGED
@@ -3,7 +3,7 @@
3
3
  "private": false,
4
4
  "description": "A Vue 3 UI component library built with Tailwind CSS.",
5
5
  "license": "MIT",
6
- "version": "0.5.2",
6
+ "version": "0.5.3",
7
7
  "type": "module",
8
8
  "main": "index.js",
9
9
  "module": "index.js",
@@ -47,7 +47,7 @@
47
47
  "scrollreveal": "^4.0.9",
48
48
  "tailwindcss": "^4.1.18",
49
49
  "v-datepicker-lite": "^0.1.6",
50
- "v-tooltip-lite": "^0.2.1",
50
+ "v-tooltip-lite": "^0.2.3",
51
51
  "vue-carousel-lite": "^0.2.7",
52
52
  "vue-draggable-plus": "^0.5.3",
53
53
  "vue3-google-signin": "^2.1.1",
package/style.css CHANGED
@@ -714,5 +714,5 @@ textarea::-webkit-scrollbar-thumb {
714
714
  }
715
715
 
716
716
  /* --- Vite Generated CSS --- */
717
- input[data-v-e7171c4f]::-webkit-outer-spin-button,input[data-v-e7171c4f]::-webkit-inner-spin-button{-webkit-appearance:none;appearance:none;margin:0}input[type=number][data-v-e7171c4f]{-moz-appearance:textfield;appearance:textfield}.blink-bg[data-v-32c213fd]{animation:blink-animation-32c213fd 1s infinite}@keyframes blink-animation-32c213fd{0%{background-color:inherit}15%{background-color:var(--color-gray-250)}35%{background-color:inherit}75%{background-color:var(--color-gray-250)}to{background-color:inherit}}.IroBox{border-radius:8px!important}.custom-fields-table[data-v-c9831df1] .form-field-item{margin-bottom:0!important;height:100%}.custom-fields-table[data-v-c9831df1] input,.custom-fields-table[data-v-c9831df1] textarea{padding-left:1em;padding-right:.5em}.custom-fields-table[data-v-c9831df1] input,.custom-fields-table[data-v-c9831df1] textarea,.custom-fields-table[data-v-c9831df1] select,.custom-fields-table[data-v-c9831df1] .input-wrapper,.custom-fields-table[data-v-c9831df1] .tooltip-trigger button{border:none!important;background:transparent!important;box-shadow:none!important;border-radius:0!important;height:100%!important;min-height:40px}.custom-fields-table[data-v-c9831df1] .tooltip-trigger button{justify-content:space-between!important}.custom-fields-table[data-v-c9831df1] input:focus,.custom-fields-table[data-v-c9831df1] textarea:focus,.custom-fields-table[data-v-c9831df1] select:focus,.custom-fields-table[data-v-c9831df1] .input-wrapper:focus-within{background-color:hsla(var(--primary) / .03)!important;box-shadow:inset 0 0 0 2px hsla(var(--primary) / .1)!important}.custom-fields-table[data-v-c9831df1] .w-full{width:100%;height:100%}.list-enter-active[data-v-c9831df1]{transition:all .15s cubic-bezier(.16,1,.3,1)}.list-enter-from[data-v-c9831df1]{opacity:0;transform:translateY(-5px)}.form-field-item[data-v-03c267ac]{display:flex;flex-direction:column}.form-field-item[data-v-03c267ac]:has([role=switch]),.form-field-item[data-v-03c267ac]:has([role=checkbox]){flex-direction:row;align-items:center;justify-content:flex-start}.form-container[data-v-655cd96c]{width:100%}.custom-scrollbar[data-v-3849c10a]::-webkit-scrollbar{width:0px}.custom-scrollbar[data-v-3849c10a]::-webkit-scrollbar-track{background:transparent}.custom-scrollbar[data-v-3849c10a]::-webkit-scrollbar-thumb{background-color:var(--color-border);border-radius:10px}.custom-scrollbar-x[data-v-11bc76c9]::-webkit-scrollbar{height:8px}.custom-scrollbar-x[data-v-11bc76c9]::-webkit-scrollbar-track{background:transparent}.custom-scrollbar-x[data-v-11bc76c9]::-webkit-scrollbar-thumb{background-color:var(--color-border);border-radius:10px}.navbar-tabs-no-scrollbar{scrollbar-width:none;-ms-overflow-style:none}.navbar-tabs-no-scrollbar::-webkit-scrollbar{display:none}.fade-x-enter-active,.fade-x-leave-active{transition:opacity .15s ease}.fade-x-enter-from,.fade-x-leave-to{opacity:0}.breadcrumb-item[data-v-0b2efcbc]{display:inline-flex;align-items:center}.breadcrumb-link[data-v-0b2efcbc]{display:inline-flex;align-items:center;gap:.35em;color:var(--color-muted-foreground);text-decoration:none;transition:color .15s ease,background-color .15s ease;border-radius:var(--radius-sm)}.breadcrumb-link[data-v-0b2efcbc]:not(.current):not(.disabled):hover{color:var(--color-foreground)}.breadcrumb-link.current[data-v-0b2efcbc]{color:var(--color-foreground);font-weight:600;cursor:default}.breadcrumb-link.disabled[data-v-0b2efcbc]{opacity:.45;cursor:not-allowed;pointer-events:none}.breadcrumb-icon[data-v-0b2efcbc]{flex-shrink:0}.breadcrumb-list[data-v-a68fd721]{display:flex;flex-wrap:wrap;align-items:center;list-style:none;margin:0;padding:0;gap:.45em}.breadcrumb--sm[data-v-a68fd721]{font-size:var(--text--fs-2)}.breadcrumb--md[data-v-a68fd721]{font-size:var(--text-fs-0.5, 1em)}.breadcrumb--lg[data-v-a68fd721]{font-size:var(--text-fs-2)}.breadcrumb-separator[data-v-a68fd721]{display:inline-flex;align-items:center;color:var(--color-gray-400);-webkit-user-select:none;user-select:none;font-size:.9em;line-height:1;padding:0 .1em}.breadcrumb-ellipsis[data-v-a68fd721]{display:inline-flex;align-items:center}.breadcrumb-ellipsis-btn[data-v-a68fd721]{display:inline-flex;align-items:center;justify-content:center;width:1.6em;height:1.6em;border-radius:var(--radius-sm);border:1px solid var(--color-border);background:transparent;color:var(--color-muted-foreground);cursor:pointer;font-size:.9em;line-height:1;letter-spacing:.05em;transition:all .15s ease}.breadcrumb-ellipsis-btn[data-v-a68fd721]:hover{background:var(--color-accent);color:var(--color-foreground);border-color:var(--color-gray-300)}.breadcrumb--contained[data-v-a68fd721]{background:var(--color-secondary);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:.45em 1em}.breadcrumb--pills[data-v-a68fd721] .breadcrumb-link{padding:.2em .7em;border-radius:9999px;background:var(--color-secondary);border:1px solid var(--color-border)}.breadcrumb--pills[data-v-a68fd721] .breadcrumb-link:not(.current):not(.disabled):hover{background:var(--color-accent);border-color:var(--color-gray-300)}.breadcrumb--pills[data-v-a68fd721] .breadcrumb-link.current{background:var(--color-primary);color:var(--color-primary-foreground);border-color:var(--color-primary)}.breadcrumb--arrow .breadcrumb-list[data-v-a68fd721]{gap:0}.breadcrumb--arrow[data-v-a68fd721] .breadcrumb-link{padding:.35em .9em .35em 1.4em;background:var(--color-secondary);clip-path:polygon(0 0,calc(100% - .6em) 0,100% 50%,calc(100% - .6em) 100%,0 100%,.6em 50%);border:none;margin-left:-.3em}.breadcrumb--arrow[data-v-a68fd721] .breadcrumb-item:first-child .breadcrumb-link{padding-left:.9em;clip-path:polygon(0 0,calc(100% - .6em) 0,100% 50%,calc(100% - .6em) 100%,0 100%);border-radius:var(--radius-sm) 0 0 var(--radius-sm);margin-left:0}.breadcrumb--arrow[data-v-a68fd721] .breadcrumb-link:not(.current):not(.disabled):hover{background:var(--color-accent)}.breadcrumb--arrow[data-v-a68fd721] .breadcrumb-link.current{background:var(--color-primary);color:var(--color-primary-foreground)}.breadcrumb--arrow .breadcrumb-separator[data-v-a68fd721]{display:none}.heatmap-container[data-v-00476f00]{width:100%;height:100%;display:flex;flex-direction:column;min-height:0}.heatmap-wrapper[data-v-00476f00]{width:100%;height:100%;overflow:auto;flex:1;min-height:0;display:flex;align-items:center;justify-content:center;padding:16px;box-sizing:border-box;position:relative}.heatmap-grid[data-v-00476f00]{width:fit-content;height:fit-content;transition:all .2s ease-in-out}.heatmap-cell[data-v-00476f00]{aspect-ratio:1 / 1;border-radius:2px;transition:all .15s ease-in-out;border:1px solid transparent;box-sizing:border-box}.heatmap-cell-interactive[data-v-00476f00]{cursor:pointer}.heatmap-cell-interactive[data-v-00476f00]:hover{transform:scale(1.1);border-color:var(--border);box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -2px #0000001a;z-index:10;position:relative}.heatmap-cell-empty[data-v-00476f00]{opacity:.6}.heatmap-cell-hovered[data-v-00476f00]{outline:2px solid var(--primary);outline-offset:1px}.heatmap-cell-label[data-v-00476f00]{font-size:8px;font-weight:500;color:var(--foreground);opacity:.8;display:flex;align-items:center;justify-content:center;height:100%;width:100%;pointer-events:none}.heatmap-legend[data-v-00476f00]{display:flex;align-items:center;gap:.5rem;margin-top:1rem;font-size:.75rem;color:var(--muted-foreground);flex-shrink:0}.heatmap-legend-label[data-v-00476f00]{font-weight:500}.heatmap-legend-colors[data-v-00476f00]{display:flex;gap:.125rem}.heatmap-legend-item[data-v-00476f00]{width:.75rem;height:.75rem;border-radius:.375rem;border:1px solid var(--border)}@media(max-width:640px){.heatmap-wrapper[data-v-00476f00]{padding:12px}.heatmap-cell[data-v-00476f00]{border-radius:2px}.heatmap-cell-label[data-v-00476f00]{font-size:7px}}@media(min-width:641px)and (max-width:1023px){.heatmap-wrapper[data-v-00476f00]{padding:14px}.heatmap-cell[data-v-00476f00]{border-radius:2px}}@media(min-width:1024px){.heatmap-wrapper[data-v-00476f00]{padding:16px}.heatmap-cell[data-v-00476f00]{border-radius:3px}}.masonry-item[data-v-c29d0159]{content-visibility:auto;contain-intrinsic-size:1px 200px}.carousel-wrapper[data-v-655a78c8]{width:100%;position:relative}.accordion-enter-active[data-v-aa189e08],.accordion-leave-active[data-v-aa189e08]{transition:height .3s ease-in-out}.sidebar-manu-item .tooltip-trigger{width:100%!important}.sidebar-menu-tooltip{margin-left:4px!important}[dir=rtl] .sidebar-menu-tooltip{margin-right:4px!important}.bg-stripe[data-v-454a1505]{background-image:linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent);background-size:1rem 1rem}.animate-progress-stripe[data-v-454a1505]{animation:progress-stripe-454a1505 1s linear infinite}@keyframes progress-stripe-454a1505{0%{background-position:1rem 0}to{background-position:0 0}}.animate-progress-indeterminate[data-v-454a1505]{animation:progress-indeterminate-454a1505 1.5s infinite cubic-bezier(.65,.815,.735,.395)}@keyframes progress-indeterminate-454a1505{0%{transform:translate(-100%) scaleX(.2)}50%{transform:translate(0) scaleX(.5)}to{transform:translate(100%) scaleX(.2)}}.permission-matrix-wrapper[data-v-1f9be4e0]{max-height:70vh}.permission-matrix-wrapper[data-v-1f9be4e0]::-webkit-scrollbar{width:6px;height:6px}.permission-matrix-wrapper[data-v-1f9be4e0]::-webkit-scrollbar-track{background:transparent}.permission-matrix-wrapper[data-v-1f9be4e0]::-webkit-scrollbar-thumb{background:var(--color-gray-300);border-radius:3px}.permission-matrix-wrapper[data-v-1f9be4e0]::-webkit-scrollbar-thumb:hover{background:var(--color-gray-400)}.button-group[data-v-ba735fac] button{align-self:stretch;height:auto!important;min-height:unset!important;min-width:unset!important;width:auto!important}.button-group[data-v-ba735fac]:not(.vertical-group) button{aspect-ratio:unset}.attached-group[data-v-ba735fac] button{position:relative;--radius: .375rem}.attached-group[data-v-ba735fac] button:focus-visible,.attached-group[data-v-ba735fac] button:hover{z-index:10}.attached-group[data-v-ba735fac]:not(.vertical-group) button:not(:first-child){margin-left:-1px}.attached-group[data-v-ba735fac]:not(.vertical-group) button:first-child{border-top-left-radius:var(--radius);border-bottom-left-radius:var(--radius);border-top-right-radius:0;border-bottom-right-radius:0}.attached-group[data-v-ba735fac]:not(.vertical-group) button:not(:first-child):not(:last-child){border-radius:0}.attached-group[data-v-ba735fac]:not(.vertical-group) button:last-child{border-top-right-radius:var(--radius);border-bottom-right-radius:var(--radius);border-top-left-radius:0;border-bottom-left-radius:0}.vertical-group[data-v-ba735fac] button:not(:first-child){margin-top:-1px}.vertical-group[data-v-ba735fac] button:first-child{border-top-left-radius:var(--radius);border-top-right-radius:var(--radius);border-bottom-left-radius:0;border-bottom-right-radius:0}.vertical-group[data-v-ba735fac] button:not(:first-child):not(:last-child){border-radius:0}.vertical-group[data-v-ba735fac] button:last-child{border-bottom-left-radius:var(--radius);border-bottom-right-radius:var(--radius);border-top-left-radius:0;border-top-right-radius:0}.attached-group[data-v-ba735fac]:not(.vertical-group) button:not(:first-child):not(.border):before{content:"";position:absolute;left:0;top:0;bottom:0;width:1px;background-color:currentColor;opacity:.15;z-index:5;pointer-events:none;height:100%}.vertical-group[data-v-ba735fac] button:not(:first-child):not(.border):before{content:"";position:absolute;top:0;left:0;right:0;height:1px;width:100%;background-color:currentColor;opacity:.15;z-index:5;pointer-events:none}.first-toast-enter-active[data-v-dc3a3b49]{animation:first-toast-in-dc3a3b49 .45s cubic-bezier(.23,1,.32,1) forwards}.first-toast-leave-active[data-v-dc3a3b49]{transition:all .25s ease-in}.first-toast-leave-to[data-v-dc3a3b49]{opacity:0;transform:scale(.98)}@keyframes first-toast-in-dc3a3b49{0%{opacity:var(--entrance-opacity, .6);transform:translateY(var(--entrance-offset, 25px)) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}.stack-toast-enter-active[data-v-dc3a3b49],.stack-toast-leave-active[data-v-dc3a3b49]{transition:all .3s cubic-bezier(.16,1,.3,1)}.stack-toast-enter-from[data-v-dc3a3b49]{opacity:0;transform:scale(.95) translateY(10px)}.stack-toast-leave-to[data-v-dc3a3b49]{opacity:0;transform:scale(.95)}.stack-toast-move[data-v-dc3a3b49]{transition:transform .4s cubic-bezier(.16,1,.3,1)}.command-palette-content[data-v-c2e803a4] ::-webkit-scrollbar{width:4px}.command-palette-content[data-v-c2e803a4] ::-webkit-scrollbar-track{background:transparent}.command-palette-content[data-v-c2e803a4] ::-webkit-scrollbar-thumb{background:var(--border);border-radius:9999px}
717
+ input[data-v-e7171c4f]::-webkit-outer-spin-button,input[data-v-e7171c4f]::-webkit-inner-spin-button{-webkit-appearance:none;appearance:none;margin:0}input[type=number][data-v-e7171c4f]{-moz-appearance:textfield;appearance:textfield}.blink-bg[data-v-b4f8e934]{animation:blink-animation-b4f8e934 1s infinite}@keyframes blink-animation-b4f8e934{0%{background-color:inherit}15%{background-color:var(--color-gray-250)}35%{background-color:inherit}75%{background-color:var(--color-gray-250)}to{background-color:inherit}}.IroBox{border-radius:8px!important}.custom-fields-table[data-v-c9831df1] .form-field-item{margin-bottom:0!important;height:100%}.custom-fields-table[data-v-c9831df1] input,.custom-fields-table[data-v-c9831df1] textarea{padding-left:1em;padding-right:.5em}.custom-fields-table[data-v-c9831df1] input,.custom-fields-table[data-v-c9831df1] textarea,.custom-fields-table[data-v-c9831df1] select,.custom-fields-table[data-v-c9831df1] .input-wrapper,.custom-fields-table[data-v-c9831df1] .tooltip-trigger button{border:none!important;background:transparent!important;box-shadow:none!important;border-radius:0!important;height:100%!important;min-height:40px}.custom-fields-table[data-v-c9831df1] .tooltip-trigger button{justify-content:space-between!important}.custom-fields-table[data-v-c9831df1] input:focus,.custom-fields-table[data-v-c9831df1] textarea:focus,.custom-fields-table[data-v-c9831df1] select:focus,.custom-fields-table[data-v-c9831df1] .input-wrapper:focus-within{background-color:hsla(var(--primary) / .03)!important;box-shadow:inset 0 0 0 2px hsla(var(--primary) / .1)!important}.custom-fields-table[data-v-c9831df1] .w-full{width:100%;height:100%}.list-enter-active[data-v-c9831df1]{transition:all .15s cubic-bezier(.16,1,.3,1)}.list-enter-from[data-v-c9831df1]{opacity:0;transform:translateY(-5px)}.form-field-item[data-v-03c267ac]{display:flex;flex-direction:column}.form-field-item[data-v-03c267ac]:has([role=switch]),.form-field-item[data-v-03c267ac]:has([role=checkbox]){flex-direction:row;align-items:center;justify-content:flex-start}.form-container[data-v-655cd96c]{width:100%}.custom-scrollbar[data-v-3849c10a]::-webkit-scrollbar{width:0px}.custom-scrollbar[data-v-3849c10a]::-webkit-scrollbar-track{background:transparent}.custom-scrollbar[data-v-3849c10a]::-webkit-scrollbar-thumb{background-color:var(--color-border);border-radius:10px}.custom-scrollbar-x[data-v-11bc76c9]::-webkit-scrollbar{height:8px}.custom-scrollbar-x[data-v-11bc76c9]::-webkit-scrollbar-track{background:transparent}.custom-scrollbar-x[data-v-11bc76c9]::-webkit-scrollbar-thumb{background-color:var(--color-border);border-radius:10px}.navbar-tabs-no-scrollbar{scrollbar-width:none;-ms-overflow-style:none}.navbar-tabs-no-scrollbar::-webkit-scrollbar{display:none}.fade-x-enter-active,.fade-x-leave-active{transition:opacity .15s ease}.fade-x-enter-from,.fade-x-leave-to{opacity:0}.breadcrumb-item[data-v-0b2efcbc]{display:inline-flex;align-items:center}.breadcrumb-link[data-v-0b2efcbc]{display:inline-flex;align-items:center;gap:.35em;color:var(--color-muted-foreground);text-decoration:none;transition:color .15s ease,background-color .15s ease;border-radius:var(--radius-sm)}.breadcrumb-link[data-v-0b2efcbc]:not(.current):not(.disabled):hover{color:var(--color-foreground)}.breadcrumb-link.current[data-v-0b2efcbc]{color:var(--color-foreground);font-weight:600;cursor:default}.breadcrumb-link.disabled[data-v-0b2efcbc]{opacity:.45;cursor:not-allowed;pointer-events:none}.breadcrumb-icon[data-v-0b2efcbc]{flex-shrink:0}.breadcrumb-list[data-v-a68fd721]{display:flex;flex-wrap:wrap;align-items:center;list-style:none;margin:0;padding:0;gap:.45em}.breadcrumb--sm[data-v-a68fd721]{font-size:var(--text--fs-2)}.breadcrumb--md[data-v-a68fd721]{font-size:var(--text-fs-0.5, 1em)}.breadcrumb--lg[data-v-a68fd721]{font-size:var(--text-fs-2)}.breadcrumb-separator[data-v-a68fd721]{display:inline-flex;align-items:center;color:var(--color-gray-400);-webkit-user-select:none;user-select:none;font-size:.9em;line-height:1;padding:0 .1em}.breadcrumb-ellipsis[data-v-a68fd721]{display:inline-flex;align-items:center}.breadcrumb-ellipsis-btn[data-v-a68fd721]{display:inline-flex;align-items:center;justify-content:center;width:1.6em;height:1.6em;border-radius:var(--radius-sm);border:1px solid var(--color-border);background:transparent;color:var(--color-muted-foreground);cursor:pointer;font-size:.9em;line-height:1;letter-spacing:.05em;transition:all .15s ease}.breadcrumb-ellipsis-btn[data-v-a68fd721]:hover{background:var(--color-accent);color:var(--color-foreground);border-color:var(--color-gray-300)}.breadcrumb--contained[data-v-a68fd721]{background:var(--color-secondary);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:.45em 1em}.breadcrumb--pills[data-v-a68fd721] .breadcrumb-link{padding:.2em .7em;border-radius:9999px;background:var(--color-secondary);border:1px solid var(--color-border)}.breadcrumb--pills[data-v-a68fd721] .breadcrumb-link:not(.current):not(.disabled):hover{background:var(--color-accent);border-color:var(--color-gray-300)}.breadcrumb--pills[data-v-a68fd721] .breadcrumb-link.current{background:var(--color-primary);color:var(--color-primary-foreground);border-color:var(--color-primary)}.breadcrumb--arrow .breadcrumb-list[data-v-a68fd721]{gap:0}.breadcrumb--arrow[data-v-a68fd721] .breadcrumb-link{padding:.35em .9em .35em 1.4em;background:var(--color-secondary);clip-path:polygon(0 0,calc(100% - .6em) 0,100% 50%,calc(100% - .6em) 100%,0 100%,.6em 50%);border:none;margin-left:-.3em}.breadcrumb--arrow[data-v-a68fd721] .breadcrumb-item:first-child .breadcrumb-link{padding-left:.9em;clip-path:polygon(0 0,calc(100% - .6em) 0,100% 50%,calc(100% - .6em) 100%,0 100%);border-radius:var(--radius-sm) 0 0 var(--radius-sm);margin-left:0}.breadcrumb--arrow[data-v-a68fd721] .breadcrumb-link:not(.current):not(.disabled):hover{background:var(--color-accent)}.breadcrumb--arrow[data-v-a68fd721] .breadcrumb-link.current{background:var(--color-primary);color:var(--color-primary-foreground)}.breadcrumb--arrow .breadcrumb-separator[data-v-a68fd721]{display:none}.heatmap-container[data-v-00476f00]{width:100%;height:100%;display:flex;flex-direction:column;min-height:0}.heatmap-wrapper[data-v-00476f00]{width:100%;height:100%;overflow:auto;flex:1;min-height:0;display:flex;align-items:center;justify-content:center;padding:16px;box-sizing:border-box;position:relative}.heatmap-grid[data-v-00476f00]{width:fit-content;height:fit-content;transition:all .2s ease-in-out}.heatmap-cell[data-v-00476f00]{aspect-ratio:1 / 1;border-radius:2px;transition:all .15s ease-in-out;border:1px solid transparent;box-sizing:border-box}.heatmap-cell-interactive[data-v-00476f00]{cursor:pointer}.heatmap-cell-interactive[data-v-00476f00]:hover{transform:scale(1.1);border-color:var(--border);box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -2px #0000001a;z-index:10;position:relative}.heatmap-cell-empty[data-v-00476f00]{opacity:.6}.heatmap-cell-hovered[data-v-00476f00]{outline:2px solid var(--primary);outline-offset:1px}.heatmap-cell-label[data-v-00476f00]{font-size:8px;font-weight:500;color:var(--foreground);opacity:.8;display:flex;align-items:center;justify-content:center;height:100%;width:100%;pointer-events:none}.heatmap-legend[data-v-00476f00]{display:flex;align-items:center;gap:.5rem;margin-top:1rem;font-size:.75rem;color:var(--muted-foreground);flex-shrink:0}.heatmap-legend-label[data-v-00476f00]{font-weight:500}.heatmap-legend-colors[data-v-00476f00]{display:flex;gap:.125rem}.heatmap-legend-item[data-v-00476f00]{width:.75rem;height:.75rem;border-radius:.375rem;border:1px solid var(--border)}@media(max-width:640px){.heatmap-wrapper[data-v-00476f00]{padding:12px}.heatmap-cell[data-v-00476f00]{border-radius:2px}.heatmap-cell-label[data-v-00476f00]{font-size:7px}}@media(min-width:641px)and (max-width:1023px){.heatmap-wrapper[data-v-00476f00]{padding:14px}.heatmap-cell[data-v-00476f00]{border-radius:2px}}@media(min-width:1024px){.heatmap-wrapper[data-v-00476f00]{padding:16px}.heatmap-cell[data-v-00476f00]{border-radius:3px}}.masonry-item[data-v-c29d0159]{content-visibility:auto;contain-intrinsic-size:1px 200px}.carousel-wrapper[data-v-655a78c8]{width:100%;position:relative}.accordion-enter-active[data-v-aa189e08],.accordion-leave-active[data-v-aa189e08]{transition:height .3s ease-in-out}.sidebar-manu-item .tooltip-trigger{width:100%!important}.sidebar-menu-tooltip{margin-left:4px!important}[dir=rtl] .sidebar-menu-tooltip{margin-right:4px!important}.bg-stripe[data-v-454a1505]{background-image:linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent);background-size:1rem 1rem}.animate-progress-stripe[data-v-454a1505]{animation:progress-stripe-454a1505 1s linear infinite}@keyframes progress-stripe-454a1505{0%{background-position:1rem 0}to{background-position:0 0}}.animate-progress-indeterminate[data-v-454a1505]{animation:progress-indeterminate-454a1505 1.5s infinite cubic-bezier(.65,.815,.735,.395)}@keyframes progress-indeterminate-454a1505{0%{transform:translate(-100%) scaleX(.2)}50%{transform:translate(0) scaleX(.5)}to{transform:translate(100%) scaleX(.2)}}.permission-matrix-wrapper[data-v-1f9be4e0]{max-height:70vh}.permission-matrix-wrapper[data-v-1f9be4e0]::-webkit-scrollbar{width:6px;height:6px}.permission-matrix-wrapper[data-v-1f9be4e0]::-webkit-scrollbar-track{background:transparent}.permission-matrix-wrapper[data-v-1f9be4e0]::-webkit-scrollbar-thumb{background:var(--color-gray-300);border-radius:3px}.permission-matrix-wrapper[data-v-1f9be4e0]::-webkit-scrollbar-thumb:hover{background:var(--color-gray-400)}.button-group[data-v-ba735fac] button{align-self:stretch;height:auto!important;min-height:unset!important;min-width:unset!important;width:auto!important}.button-group[data-v-ba735fac]:not(.vertical-group) button{aspect-ratio:unset}.attached-group[data-v-ba735fac] button{position:relative;--radius: .375rem}.attached-group[data-v-ba735fac] button:focus-visible,.attached-group[data-v-ba735fac] button:hover{z-index:10}.attached-group[data-v-ba735fac]:not(.vertical-group) button:not(:first-child){margin-left:-1px}.attached-group[data-v-ba735fac]:not(.vertical-group) button:first-child{border-top-left-radius:var(--radius);border-bottom-left-radius:var(--radius);border-top-right-radius:0;border-bottom-right-radius:0}.attached-group[data-v-ba735fac]:not(.vertical-group) button:not(:first-child):not(:last-child){border-radius:0}.attached-group[data-v-ba735fac]:not(.vertical-group) button:last-child{border-top-right-radius:var(--radius);border-bottom-right-radius:var(--radius);border-top-left-radius:0;border-bottom-left-radius:0}.vertical-group[data-v-ba735fac] button:not(:first-child){margin-top:-1px}.vertical-group[data-v-ba735fac] button:first-child{border-top-left-radius:var(--radius);border-top-right-radius:var(--radius);border-bottom-left-radius:0;border-bottom-right-radius:0}.vertical-group[data-v-ba735fac] button:not(:first-child):not(:last-child){border-radius:0}.vertical-group[data-v-ba735fac] button:last-child{border-bottom-left-radius:var(--radius);border-bottom-right-radius:var(--radius);border-top-left-radius:0;border-top-right-radius:0}.attached-group[data-v-ba735fac]:not(.vertical-group) button:not(:first-child):not(.border):before{content:"";position:absolute;left:0;top:0;bottom:0;width:1px;background-color:currentColor;opacity:.15;z-index:5;pointer-events:none;height:100%}.vertical-group[data-v-ba735fac] button:not(:first-child):not(.border):before{content:"";position:absolute;top:0;left:0;right:0;height:1px;width:100%;background-color:currentColor;opacity:.15;z-index:5;pointer-events:none}.first-toast-enter-active[data-v-dc3a3b49]{animation:first-toast-in-dc3a3b49 .45s cubic-bezier(.23,1,.32,1) forwards}.first-toast-leave-active[data-v-dc3a3b49]{transition:all .25s ease-in}.first-toast-leave-to[data-v-dc3a3b49]{opacity:0;transform:scale(.98)}@keyframes first-toast-in-dc3a3b49{0%{opacity:var(--entrance-opacity, .6);transform:translateY(var(--entrance-offset, 25px)) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}.stack-toast-enter-active[data-v-dc3a3b49],.stack-toast-leave-active[data-v-dc3a3b49]{transition:all .3s cubic-bezier(.16,1,.3,1)}.stack-toast-enter-from[data-v-dc3a3b49]{opacity:0;transform:scale(.95) translateY(10px)}.stack-toast-leave-to[data-v-dc3a3b49]{opacity:0;transform:scale(.95)}.stack-toast-move[data-v-dc3a3b49]{transition:transform .4s cubic-bezier(.16,1,.3,1)}.command-palette-content[data-v-c2e803a4] ::-webkit-scrollbar{width:4px}.command-palette-content[data-v-c2e803a4] ::-webkit-scrollbar-track{background:transparent}.command-palette-content[data-v-c2e803a4] ::-webkit-scrollbar-thumb{background:var(--border);border-radius:9999px}
718
718