@urbicon-ui/blocks 6.21.0 → 6.21.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (95) hide show
  1. package/dist/components/Calendar/calendar.variants.d.ts +132 -419
  2. package/dist/components/CommandPalette/commandPalette.variants.d.ts +24 -51
  3. package/dist/components/CompositionBar/CompositionBar.svelte +6 -1
  4. package/dist/components/CompositionBar/composition-bar.variants.d.ts +23 -83
  5. package/dist/components/CompositionBar/composition-bar.variants.js +9 -3
  6. package/dist/components/EmptyState/emptyState.variants.d.ts +11 -27
  7. package/dist/components/FileUpload/fileUpload.variants.d.ts +24 -93
  8. package/dist/components/Guide/GuidePanel.svelte +38 -0
  9. package/dist/components/Guide/guide.variants.d.ts +69 -124
  10. package/dist/components/Guide/guide.variants.js +6 -1
  11. package/dist/components/Planner/planner.variants.d.ts +23 -94
  12. package/dist/components/Sankey/sankey.variants.d.ts +15 -48
  13. package/dist/components/SidebarLayout/sidebar-layout.variants.d.ts +10 -38
  14. package/dist/components/SidebarLayout/sidebar-layout.variants.js +12 -2
  15. package/dist/components/ThemeSwitcher/themeSwitcher.variants.d.ts +9 -36
  16. package/dist/i18n/index.d.ts +2 -372
  17. package/dist/internal/charts/variants.d.ts +18 -31
  18. package/dist/primitives/Accordion/Accordion.svelte +11 -0
  19. package/dist/primitives/Accordion/AccordionItem.svelte +9 -3
  20. package/dist/primitives/Accordion/accordion.variants.d.ts +12 -43
  21. package/dist/primitives/Accordion/accordion.variants.js +6 -2
  22. package/dist/primitives/Accordion/index.d.ts +12 -0
  23. package/dist/primitives/Alert/alert.variants.d.ts +21 -62
  24. package/dist/primitives/Avatar/avatar.variants.d.ts +18 -138
  25. package/dist/primitives/Badge/badge.variants.d.ts +19 -92
  26. package/dist/primitives/Badge/badge.variants.js +11 -4
  27. package/dist/primitives/Breadcrumb/breadcrumb.variants.d.ts +13 -40
  28. package/dist/primitives/Button/button.variants.d.ts +19 -98
  29. package/dist/primitives/Button/button.variants.js +13 -9
  30. package/dist/primitives/ButtonGroup/buttongroup.variants.d.ts +9 -29
  31. package/dist/primitives/ButtonGroup/buttongroup.variants.js +3 -1
  32. package/dist/primitives/Card/card.variants.d.ts +14 -81
  33. package/dist/primitives/Checkbox/checkbox.variants.d.ts +18 -77
  34. package/dist/primitives/Collapsible/Collapsible.svelte +10 -0
  35. package/dist/primitives/Collapsible/collapsible.variants.d.ts +11 -40
  36. package/dist/primitives/Collapsible/collapsible.variants.js +7 -2
  37. package/dist/primitives/Collapsible/index.d.ts +16 -0
  38. package/dist/primitives/Combobox/combobox.variants.d.ts +24 -78
  39. package/dist/primitives/Dialog/Dialog.svelte +21 -10
  40. package/dist/primitives/Dialog/dialog.variants.d.ts +15 -54
  41. package/dist/primitives/Drawer/Drawer.svelte +21 -10
  42. package/dist/primitives/Drawer/drawer.variants.d.ts +14 -49
  43. package/dist/primitives/Input/input.variants.d.ts +32 -139
  44. package/dist/primitives/Input/input.variants.js +12 -10
  45. package/dist/primitives/JourneyTimeline/journey-timeline.variants.d.ts +55 -197
  46. package/dist/primitives/JourneyTimeline/journey-timeline.variants.js +4 -1
  47. package/dist/primitives/Menu/menu.variants.d.ts +29 -93
  48. package/dist/primitives/Pagination/pagination.variants.d.ts +16 -54
  49. package/dist/primitives/Pagination/pagination.variants.js +16 -14
  50. package/dist/primitives/Popover/Popover.svelte +1 -1
  51. package/dist/primitives/Popover/popover.variants.d.ts +4 -2
  52. package/dist/primitives/Progress/progress.variants.d.ts +19 -83
  53. package/dist/primitives/Progress/progress.variants.js +2 -1
  54. package/dist/primitives/RadioGroup/radioGroup.variants.d.ts +28 -109
  55. package/dist/primitives/SegmentGroup/SegmentGroup.svelte +14 -6
  56. package/dist/primitives/SegmentGroup/segmentgroup.variants.d.ts +12 -53
  57. package/dist/primitives/SegmentGroup/segmentgroup.variants.js +10 -10
  58. package/dist/primitives/Select/select.variants.d.ts +45 -134
  59. package/dist/primitives/Select/select.variants.js +6 -4
  60. package/dist/primitives/Separator/separator.variants.d.ts +4 -2
  61. package/dist/primitives/Sidebar/Sidebar.svelte +10 -15
  62. package/dist/primitives/Sidebar/sidebar.variants.d.ts +11 -29
  63. package/dist/primitives/Skeleton/skeleton.variants.d.ts +9 -36
  64. package/dist/primitives/Slider/slider.variants.d.ts +37 -136
  65. package/dist/primitives/Slider/slider.variants.js +8 -5
  66. package/dist/primitives/Spinner/spinner.variants.d.ts +38 -135
  67. package/dist/primitives/Stepper/stepper.variants.d.ts +32 -130
  68. package/dist/primitives/Tab/Tab.svelte +14 -6
  69. package/dist/primitives/Tab/tab.variants.d.ts +17 -78
  70. package/dist/primitives/Textarea/textarea.variants.d.ts +27 -112
  71. package/dist/primitives/Textarea/textarea.variants.js +12 -10
  72. package/dist/primitives/Toast/Toaster.svelte +16 -3
  73. package/dist/primitives/Toast/index.d.ts +9 -0
  74. package/dist/primitives/Toast/toast.variants.d.ts +22 -78
  75. package/dist/primitives/Toggle/toggle.variants.d.ts +17 -71
  76. package/dist/primitives/Toolbar/toolbar.variants.d.ts +9 -60
  77. package/dist/primitives/Tooltip/Tooltip.svelte +11 -0
  78. package/dist/primitives/Tooltip/index.d.ts +14 -0
  79. package/dist/primitives/Tooltip/tooltip.variants.d.ts +11 -50
  80. package/dist/primitives/Tooltip/tooltip.variants.js +7 -1
  81. package/dist/style/foundation.css +4 -1
  82. package/dist/style/interaction.css +39 -11
  83. package/dist/style/semantic.css +2 -2
  84. package/dist/style/themes/index.css +1 -1
  85. package/dist/utils/index.d.ts +2 -1
  86. package/dist/utils/index.js +5 -0
  87. package/dist/utils/overlay.d.ts +33 -4
  88. package/dist/utils/overlay.js +61 -18
  89. package/dist/utils/roving.d.ts +15 -0
  90. package/dist/utils/roving.js +44 -0
  91. package/dist/utils/use-floating-panel.svelte.d.ts +4 -1
  92. package/dist/utils/use-floating-panel.svelte.js +23 -1
  93. package/dist/utils/variants.d.ts +60 -16
  94. package/dist/utils/variants.js +424 -123
  95. package/package.json +9 -6
@@ -1,52 +1,11 @@
1
1
  import { type SlotNames, type VariantProps } from '../../utils/variants.js';
2
- export declare const comboboxVariants: (props?: import("../../utils/variants.js").TVProps<{
3
- tier: {
4
- modify: {
5
- input: string;
6
- };
7
- commit: {
8
- input: string;
9
- };
10
- };
11
- variant: {
12
- outlined: {
13
- input: string;
14
- };
15
- filled: {
16
- input: string;
17
- };
18
- ghost: {
19
- input: string;
20
- };
21
- underline: {
22
- input: string;
23
- };
24
- };
25
- size: {
26
- sm: {
27
- input: string;
28
- option: string;
29
- };
30
- md: {
31
- input: string;
32
- option: string;
33
- };
34
- lg: {
35
- input: string;
36
- option: string;
37
- };
38
- };
39
- open: {
40
- true: {
41
- chevron: string;
42
- };
43
- };
44
- disabled: {
45
- true: {
46
- base: string;
47
- };
48
- };
49
- }> | undefined) => {
2
+ export declare const comboboxVariants: ((props?: {
3
+ tier?: "commit" | "modify" | undefined;
4
+ variant?: "ghost" | "filled" | "outlined" | "underline" | undefined;
5
+ size?: "sm" | "md" | "lg" | undefined;
6
+ open?: boolean | undefined;
7
+ disabled?: boolean | undefined;
8
+ } | undefined) => {
50
9
  base: (props?: ({
51
10
  tier?: "commit" | "modify" | undefined;
52
11
  variant?: "ghost" | "filled" | "outlined" | "underline" | undefined;
@@ -54,8 +13,7 @@ export declare const comboboxVariants: (props?: import("../../utils/variants.js"
54
13
  open?: boolean | undefined;
55
14
  disabled?: boolean | undefined;
56
15
  } & {
57
- class?: string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | /*elided*/ any | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined;
58
- className?: string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | /*elided*/ any | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined;
16
+ class?: string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | /*elided*/ any | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined;
59
17
  }) | undefined) => string;
60
18
  label: (props?: ({
61
19
  tier?: "commit" | "modify" | undefined;
@@ -64,8 +22,7 @@ export declare const comboboxVariants: (props?: import("../../utils/variants.js"
64
22
  open?: boolean | undefined;
65
23
  disabled?: boolean | undefined;
66
24
  } & {
67
- class?: string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | /*elided*/ any | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined;
68
- className?: string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | /*elided*/ any | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined;
25
+ class?: string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | /*elided*/ any | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined;
69
26
  }) | undefined) => string;
70
27
  requiredMark: (props?: ({
71
28
  tier?: "commit" | "modify" | undefined;
@@ -74,8 +31,7 @@ export declare const comboboxVariants: (props?: import("../../utils/variants.js"
74
31
  open?: boolean | undefined;
75
32
  disabled?: boolean | undefined;
76
33
  } & {
77
- class?: string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | /*elided*/ any | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined;
78
- className?: string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | /*elided*/ any | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined;
34
+ class?: string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | /*elided*/ any | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined;
79
35
  }) | undefined) => string;
80
36
  inputWrapper: (props?: ({
81
37
  tier?: "commit" | "modify" | undefined;
@@ -84,8 +40,7 @@ export declare const comboboxVariants: (props?: import("../../utils/variants.js"
84
40
  open?: boolean | undefined;
85
41
  disabled?: boolean | undefined;
86
42
  } & {
87
- class?: string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | /*elided*/ any | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined;
88
- className?: string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | /*elided*/ any | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined;
43
+ class?: string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | /*elided*/ any | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined;
89
44
  }) | undefined) => string;
90
45
  input: (props?: ({
91
46
  tier?: "commit" | "modify" | undefined;
@@ -94,8 +49,7 @@ export declare const comboboxVariants: (props?: import("../../utils/variants.js"
94
49
  open?: boolean | undefined;
95
50
  disabled?: boolean | undefined;
96
51
  } & {
97
- class?: string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | /*elided*/ any | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined;
98
- className?: string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | /*elided*/ any | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined;
52
+ class?: string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | /*elided*/ any | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined;
99
53
  }) | undefined) => string;
100
54
  message: (props?: ({
101
55
  tier?: "commit" | "modify" | undefined;
@@ -104,8 +58,7 @@ export declare const comboboxVariants: (props?: import("../../utils/variants.js"
104
58
  open?: boolean | undefined;
105
59
  disabled?: boolean | undefined;
106
60
  } & {
107
- class?: string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | /*elided*/ any | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined;
108
- className?: string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | /*elided*/ any | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined;
61
+ class?: string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | /*elided*/ any | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined;
109
62
  }) | undefined) => string;
110
63
  hint: (props?: ({
111
64
  tier?: "commit" | "modify" | undefined;
@@ -114,8 +67,7 @@ export declare const comboboxVariants: (props?: import("../../utils/variants.js"
114
67
  open?: boolean | undefined;
115
68
  disabled?: boolean | undefined;
116
69
  } & {
117
- class?: string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | /*elided*/ any | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined;
118
- className?: string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | /*elided*/ any | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined;
70
+ class?: string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | /*elided*/ any | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined;
119
71
  }) | undefined) => string;
120
72
  listbox: (props?: ({
121
73
  tier?: "commit" | "modify" | undefined;
@@ -124,8 +76,7 @@ export declare const comboboxVariants: (props?: import("../../utils/variants.js"
124
76
  open?: boolean | undefined;
125
77
  disabled?: boolean | undefined;
126
78
  } & {
127
- class?: string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | /*elided*/ any | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined;
128
- className?: string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | /*elided*/ any | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined;
79
+ class?: string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | /*elided*/ any | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined;
129
80
  }) | undefined) => string;
130
81
  option: (props?: ({
131
82
  tier?: "commit" | "modify" | undefined;
@@ -134,8 +85,7 @@ export declare const comboboxVariants: (props?: import("../../utils/variants.js"
134
85
  open?: boolean | undefined;
135
86
  disabled?: boolean | undefined;
136
87
  } & {
137
- class?: string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | /*elided*/ any | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined;
138
- className?: string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | /*elided*/ any | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined;
88
+ class?: string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | /*elided*/ any | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined;
139
89
  }) | undefined) => string;
140
90
  optionActive: (props?: ({
141
91
  tier?: "commit" | "modify" | undefined;
@@ -144,8 +94,7 @@ export declare const comboboxVariants: (props?: import("../../utils/variants.js"
144
94
  open?: boolean | undefined;
145
95
  disabled?: boolean | undefined;
146
96
  } & {
147
- class?: string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | /*elided*/ any | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined;
148
- className?: string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | /*elided*/ any | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined;
97
+ class?: string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | /*elided*/ any | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined;
149
98
  }) | undefined) => string;
150
99
  optionSelected: (props?: ({
151
100
  tier?: "commit" | "modify" | undefined;
@@ -154,8 +103,7 @@ export declare const comboboxVariants: (props?: import("../../utils/variants.js"
154
103
  open?: boolean | undefined;
155
104
  disabled?: boolean | undefined;
156
105
  } & {
157
- class?: string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | /*elided*/ any | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined;
158
- className?: string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | /*elided*/ any | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined;
106
+ class?: string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | /*elided*/ any | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined;
159
107
  }) | undefined) => string;
160
108
  noResults: (props?: ({
161
109
  tier?: "commit" | "modify" | undefined;
@@ -164,8 +112,7 @@ export declare const comboboxVariants: (props?: import("../../utils/variants.js"
164
112
  open?: boolean | undefined;
165
113
  disabled?: boolean | undefined;
166
114
  } & {
167
- class?: string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | /*elided*/ any | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined;
168
- className?: string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | /*elided*/ any | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined;
115
+ class?: string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | /*elided*/ any | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined;
169
116
  }) | undefined) => string;
170
117
  clear: (props?: ({
171
118
  tier?: "commit" | "modify" | undefined;
@@ -174,8 +121,7 @@ export declare const comboboxVariants: (props?: import("../../utils/variants.js"
174
121
  open?: boolean | undefined;
175
122
  disabled?: boolean | undefined;
176
123
  } & {
177
- class?: string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | /*elided*/ any | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined;
178
- className?: string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | /*elided*/ any | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined;
124
+ class?: string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | /*elided*/ any | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined;
179
125
  }) | undefined) => string;
180
126
  chevronButton: (props?: ({
181
127
  tier?: "commit" | "modify" | undefined;
@@ -184,8 +130,7 @@ export declare const comboboxVariants: (props?: import("../../utils/variants.js"
184
130
  open?: boolean | undefined;
185
131
  disabled?: boolean | undefined;
186
132
  } & {
187
- class?: string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | /*elided*/ any | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined;
188
- className?: string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | /*elided*/ any | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined;
133
+ class?: string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | /*elided*/ any | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined;
189
134
  }) | undefined) => string;
190
135
  chevron: (props?: ({
191
136
  tier?: "commit" | "modify" | undefined;
@@ -194,9 +139,10 @@ export declare const comboboxVariants: (props?: import("../../utils/variants.js"
194
139
  open?: boolean | undefined;
195
140
  disabled?: boolean | undefined;
196
141
  } & {
197
- class?: string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | /*elided*/ any | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined;
198
- className?: string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | /*elided*/ any | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined;
142
+ class?: string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | /*elided*/ any | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined;
199
143
  }) | undefined) => string;
144
+ }) & {
145
+ readonly config: import("../../utils/variants.js").TVConfig;
200
146
  };
201
147
  export type ComboboxVariants = VariantProps<typeof comboboxVariants>;
202
148
  /** Slot names derived from the tv() config — single source of truth for slotClasses. */
@@ -3,14 +3,9 @@
3
3
  import { getBlocksConfig, resolveSlotClasses } from '../../provider';
4
4
  import { resolveIcon } from '../../icons';
5
5
  import CloseIconDefault from '../../icons/CloseIcon.svelte';
6
- import { onDestroy } from 'svelte';
6
+ import { onDestroy, tick } from 'svelte';
7
7
  import { fade, scale } from 'svelte/transition';
8
- import {
9
- trapFocus,
10
- showDialogModal,
11
- closeDialogModal,
12
- unlockBodyScroll
13
- } from '../../utils/overlay';
8
+ import { trapFocus, showDialogModal, closeDialogModal } from '../../utils/overlay';
14
9
  import { overlayStack, getOverlayMotion } from '../../utils';
15
10
  import Button from '../Button/Button.svelte';
16
11
  import type { DialogProps } from './index';
@@ -69,6 +64,9 @@
69
64
  let panelEl = $state<HTMLElement>();
70
65
  let isVisible = $state(false);
71
66
  let previouslyFocused: HTMLElement | null = null;
67
+ // Release for the body-scroll lock this instance holds while modal — set by
68
+ // showDialogModal, idempotent, so both teardown paths below may call it.
69
+ let releaseScrollLock: (() => void) | undefined;
72
70
 
73
71
  const structured = $derived(!!title);
74
72
 
@@ -120,7 +118,8 @@
120
118
  }
121
119
 
122
120
  function handleOutroEnd() {
123
- closeDialogModal(dialogEl, previouslyFocused);
121
+ closeDialogModal(dialogEl, previouslyFocused, releaseScrollLock);
122
+ releaseScrollLock = undefined;
124
123
  isVisible = false;
125
124
  previouslyFocused = null;
126
125
  }
@@ -129,7 +128,15 @@
129
128
  if (open && !isVisible) {
130
129
  isVisible = true;
131
130
  previouslyFocused = document.activeElement as HTMLElement;
132
- showDialogModal(dialogEl, panelEl);
131
+ // Defer until the `{#if isVisible}` block has rendered so `bind:this` has
132
+ // assigned dialogEl/panelEl — showDialogModal captures the refs by value,
133
+ // so promoting before the bind would silently no-op (never actually modal).
134
+ // The guard covers same-flush teardown: if the component unmounts before
135
+ // the tick resolves, bind:this has nulled dialogEl and onDestroy has
136
+ // already run — a lock taken now could never be released.
137
+ tick().then(() => {
138
+ if (dialogEl) releaseScrollLock = showDialogModal(dialogEl, panelEl);
139
+ });
133
140
  }
134
141
  });
135
142
 
@@ -139,7 +146,11 @@
139
146
  });
140
147
 
141
148
  onDestroy(() => {
142
- unlockBodyScroll();
149
+ // Safety net for destroy-while-open, where no outro runs. Releasing is
150
+ // idempotent and scoped to this instance's own lock, so a regular close
151
+ // (already released in handleOutroEnd) or a never-opened instance make
152
+ // this a no-op — it can never free another overlay's lock.
153
+ releaseScrollLock?.();
143
154
  });
144
155
  </script>
145
156
 
@@ -1,106 +1,67 @@
1
1
  import { type SlotNames, type VariantProps } from '../../utils/variants.js';
2
- export declare const dialogVariants: (props?: import("../../utils/variants.js").TVProps<{
3
- size: {
4
- sm: {
5
- panel: string;
6
- };
7
- md: {
8
- panel: string;
9
- };
10
- lg: {
11
- panel: string;
12
- };
13
- xl: {
14
- panel: string;
15
- };
16
- full: {
17
- panel: string[];
18
- };
19
- fullscreen: {
20
- panel: string[];
21
- };
22
- };
23
- placement: {
24
- center: {
25
- dialog: string;
26
- };
27
- top: {
28
- dialog: string;
29
- };
30
- };
31
- intent: {
32
- neutral: {};
33
- primary: {};
34
- secondary: {};
35
- success: {};
36
- warning: {};
37
- danger: {};
38
- };
39
- }> | undefined) => {
2
+ export declare const dialogVariants: ((props?: {
3
+ size?: "sm" | "md" | "lg" | "xl" | "full" | "fullscreen" | undefined;
4
+ placement?: "top" | "center" | undefined;
5
+ intent?: "primary" | "secondary" | "success" | "warning" | "danger" | "neutral" | undefined;
6
+ } | undefined) => {
40
7
  dialog: (props?: ({
41
8
  size?: "sm" | "md" | "lg" | "xl" | "full" | "fullscreen" | undefined;
42
9
  placement?: "top" | "center" | undefined;
43
10
  intent?: "primary" | "secondary" | "success" | "warning" | "danger" | "neutral" | undefined;
44
11
  } & {
45
- class?: string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | /*elided*/ any | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined;
46
- className?: string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | /*elided*/ any | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined;
12
+ class?: string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | /*elided*/ any | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined;
47
13
  }) | undefined) => string;
48
14
  backdrop: (props?: ({
49
15
  size?: "sm" | "md" | "lg" | "xl" | "full" | "fullscreen" | undefined;
50
16
  placement?: "top" | "center" | undefined;
51
17
  intent?: "primary" | "secondary" | "success" | "warning" | "danger" | "neutral" | undefined;
52
18
  } & {
53
- class?: string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | /*elided*/ any | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined;
54
- className?: string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | /*elided*/ any | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined;
19
+ class?: string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | /*elided*/ any | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined;
55
20
  }) | undefined) => string;
56
21
  panel: (props?: ({
57
22
  size?: "sm" | "md" | "lg" | "xl" | "full" | "fullscreen" | undefined;
58
23
  placement?: "top" | "center" | undefined;
59
24
  intent?: "primary" | "secondary" | "success" | "warning" | "danger" | "neutral" | undefined;
60
25
  } & {
61
- class?: string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | /*elided*/ any | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined;
62
- className?: string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | /*elided*/ any | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined;
26
+ class?: string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | /*elided*/ any | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined;
63
27
  }) | undefined) => string;
64
28
  content: (props?: ({
65
29
  size?: "sm" | "md" | "lg" | "xl" | "full" | "fullscreen" | undefined;
66
30
  placement?: "top" | "center" | undefined;
67
31
  intent?: "primary" | "secondary" | "success" | "warning" | "danger" | "neutral" | undefined;
68
32
  } & {
69
- class?: string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | /*elided*/ any | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined;
70
- className?: string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | /*elided*/ any | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined;
33
+ class?: string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | /*elided*/ any | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined;
71
34
  }) | undefined) => string;
72
35
  header: (props?: ({
73
36
  size?: "sm" | "md" | "lg" | "xl" | "full" | "fullscreen" | undefined;
74
37
  placement?: "top" | "center" | undefined;
75
38
  intent?: "primary" | "secondary" | "success" | "warning" | "danger" | "neutral" | undefined;
76
39
  } & {
77
- class?: string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | /*elided*/ any | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined;
78
- className?: string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | /*elided*/ any | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined;
40
+ class?: string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | /*elided*/ any | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined;
79
41
  }) | undefined) => string;
80
42
  title: (props?: ({
81
43
  size?: "sm" | "md" | "lg" | "xl" | "full" | "fullscreen" | undefined;
82
44
  placement?: "top" | "center" | undefined;
83
45
  intent?: "primary" | "secondary" | "success" | "warning" | "danger" | "neutral" | undefined;
84
46
  } & {
85
- class?: string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | /*elided*/ any | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined;
86
- className?: string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | /*elided*/ any | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined;
47
+ class?: string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | /*elided*/ any | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined;
87
48
  }) | undefined) => string;
88
49
  body: (props?: ({
89
50
  size?: "sm" | "md" | "lg" | "xl" | "full" | "fullscreen" | undefined;
90
51
  placement?: "top" | "center" | undefined;
91
52
  intent?: "primary" | "secondary" | "success" | "warning" | "danger" | "neutral" | undefined;
92
53
  } & {
93
- class?: string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | /*elided*/ any | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined;
94
- className?: string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | /*elided*/ any | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined;
54
+ class?: string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | /*elided*/ any | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined;
95
55
  }) | undefined) => string;
96
56
  footer: (props?: ({
97
57
  size?: "sm" | "md" | "lg" | "xl" | "full" | "fullscreen" | undefined;
98
58
  placement?: "top" | "center" | undefined;
99
59
  intent?: "primary" | "secondary" | "success" | "warning" | "danger" | "neutral" | undefined;
100
60
  } & {
101
- class?: string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | /*elided*/ any | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined;
102
- className?: string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | /*elided*/ any | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined;
61
+ class?: string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | (string | number | false | /*elided*/ any | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined)[] | Record<string, boolean | null | undefined> | null | undefined;
103
62
  }) | undefined) => string;
63
+ }) & {
64
+ readonly config: import("../../utils/variants.js").TVConfig;
104
65
  };
105
66
  export type DialogVariants = VariantProps<typeof dialogVariants>;
106
67
  /** Slot names derived from the `tv()` config above — single source of truth for `slotClasses`. */
@@ -3,14 +3,9 @@
3
3
  import { getBlocksConfig, resolveSlotClasses } from '../../provider';
4
4
  import { resolveIcon } from '../../icons';
5
5
  import CloseIconDefault from '../../icons/CloseIcon.svelte';
6
- import { onDestroy } from 'svelte';
6
+ import { onDestroy, tick } from 'svelte';
7
7
  import { fade, fly } from 'svelte/transition';
8
- import {
9
- trapFocus,
10
- showDialogModal,
11
- closeDialogModal,
12
- unlockBodyScroll
13
- } from '../../utils/overlay';
8
+ import { trapFocus, showDialogModal, closeDialogModal } from '../../utils/overlay';
14
9
  import { overlayStack, getOverlayMotion } from '../../utils';
15
10
  import Button from '../Button/Button.svelte';
16
11
  import type { DrawerProps } from './index';
@@ -61,6 +56,9 @@
61
56
  let panelElement = $state<HTMLElement>();
62
57
  let isVisible = $state(false);
63
58
  let previouslyFocused: HTMLElement | null = null;
59
+ // Release for the body-scroll lock this instance holds while modal — set by
60
+ // showDialogModal, idempotent, so both teardown paths below may call it.
61
+ let releaseScrollLock: (() => void) | undefined;
64
62
 
65
63
  const uid = $props.id();
66
64
  const titleId = $derived(title ? `drawer-title-${uid}` : undefined);
@@ -122,7 +120,15 @@
122
120
  if (open && !isVisible) {
123
121
  isVisible = true;
124
122
  previouslyFocused = document.activeElement as HTMLElement;
125
- showDialogModal(dialogElement, panelElement);
123
+ // Defer until the `{#if isVisible}` block has rendered so `bind:this` has
124
+ // assigned dialogElement/panelElement — showDialogModal captures the refs
125
+ // by value, so promoting before the bind would silently no-op (never modal).
126
+ // The guard covers same-flush teardown: if the component unmounts before
127
+ // the tick resolves, bind:this has nulled dialogElement and onDestroy has
128
+ // already run — a lock taken now could never be released.
129
+ tick().then(() => {
130
+ if (dialogElement) releaseScrollLock = showDialogModal(dialogElement, panelElement);
131
+ });
126
132
  }
127
133
  });
128
134
 
@@ -132,7 +138,11 @@
132
138
  });
133
139
 
134
140
  onDestroy(() => {
135
- unlockBodyScroll();
141
+ // Safety net for destroy-while-open, where no outro runs. Releasing is
142
+ // idempotent and scoped to this instance's own lock, so a regular close
143
+ // (already released in handleOutroEnd) or a never-opened instance make
144
+ // this a no-op — it can never free another overlay's lock.
145
+ releaseScrollLock?.();
136
146
  });
137
147
 
138
148
  function handleBackdropDirectClick() {
@@ -149,7 +159,8 @@
149
159
  }
150
160
 
151
161
  function handleOutroEnd() {
152
- closeDialogModal(dialogElement, previouslyFocused);
162
+ closeDialogModal(dialogElement, previouslyFocused, releaseScrollLock);
163
+ releaseScrollLock = undefined;
153
164
  isVisible = false;
154
165
  previouslyFocused = null;
155
166
  }