@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.
- package/dist/components/Calendar/calendar.variants.d.ts +132 -419
- package/dist/components/CommandPalette/commandPalette.variants.d.ts +24 -51
- package/dist/components/CompositionBar/CompositionBar.svelte +6 -1
- package/dist/components/CompositionBar/composition-bar.variants.d.ts +23 -83
- package/dist/components/CompositionBar/composition-bar.variants.js +9 -3
- package/dist/components/EmptyState/emptyState.variants.d.ts +11 -27
- package/dist/components/FileUpload/fileUpload.variants.d.ts +24 -93
- package/dist/components/Guide/GuidePanel.svelte +38 -0
- package/dist/components/Guide/guide.variants.d.ts +69 -124
- package/dist/components/Guide/guide.variants.js +6 -1
- package/dist/components/Planner/planner.variants.d.ts +23 -94
- package/dist/components/Sankey/sankey.variants.d.ts +15 -48
- package/dist/components/SidebarLayout/sidebar-layout.variants.d.ts +10 -38
- package/dist/components/SidebarLayout/sidebar-layout.variants.js +12 -2
- package/dist/components/ThemeSwitcher/themeSwitcher.variants.d.ts +9 -36
- package/dist/i18n/index.d.ts +2 -372
- package/dist/internal/charts/variants.d.ts +18 -31
- package/dist/primitives/Accordion/Accordion.svelte +11 -0
- package/dist/primitives/Accordion/AccordionItem.svelte +9 -3
- package/dist/primitives/Accordion/accordion.variants.d.ts +12 -43
- package/dist/primitives/Accordion/accordion.variants.js +6 -2
- package/dist/primitives/Accordion/index.d.ts +12 -0
- package/dist/primitives/Alert/alert.variants.d.ts +21 -62
- package/dist/primitives/Avatar/avatar.variants.d.ts +18 -138
- package/dist/primitives/Badge/badge.variants.d.ts +19 -92
- package/dist/primitives/Badge/badge.variants.js +11 -4
- package/dist/primitives/Breadcrumb/breadcrumb.variants.d.ts +13 -40
- package/dist/primitives/Button/button.variants.d.ts +19 -98
- package/dist/primitives/Button/button.variants.js +13 -9
- package/dist/primitives/ButtonGroup/buttongroup.variants.d.ts +9 -29
- package/dist/primitives/ButtonGroup/buttongroup.variants.js +3 -1
- package/dist/primitives/Card/card.variants.d.ts +14 -81
- package/dist/primitives/Checkbox/checkbox.variants.d.ts +18 -77
- package/dist/primitives/Collapsible/Collapsible.svelte +10 -0
- package/dist/primitives/Collapsible/collapsible.variants.d.ts +11 -40
- package/dist/primitives/Collapsible/collapsible.variants.js +7 -2
- package/dist/primitives/Collapsible/index.d.ts +16 -0
- package/dist/primitives/Combobox/combobox.variants.d.ts +24 -78
- package/dist/primitives/Dialog/Dialog.svelte +21 -10
- package/dist/primitives/Dialog/dialog.variants.d.ts +15 -54
- package/dist/primitives/Drawer/Drawer.svelte +21 -10
- package/dist/primitives/Drawer/drawer.variants.d.ts +14 -49
- package/dist/primitives/Input/input.variants.d.ts +32 -139
- package/dist/primitives/Input/input.variants.js +12 -10
- package/dist/primitives/JourneyTimeline/journey-timeline.variants.d.ts +55 -197
- package/dist/primitives/JourneyTimeline/journey-timeline.variants.js +4 -1
- package/dist/primitives/Menu/menu.variants.d.ts +29 -93
- package/dist/primitives/Pagination/pagination.variants.d.ts +16 -54
- package/dist/primitives/Pagination/pagination.variants.js +16 -14
- package/dist/primitives/Popover/Popover.svelte +1 -1
- package/dist/primitives/Popover/popover.variants.d.ts +4 -2
- package/dist/primitives/Progress/progress.variants.d.ts +19 -83
- package/dist/primitives/Progress/progress.variants.js +2 -1
- package/dist/primitives/RadioGroup/radioGroup.variants.d.ts +28 -109
- package/dist/primitives/SegmentGroup/SegmentGroup.svelte +14 -6
- package/dist/primitives/SegmentGroup/segmentgroup.variants.d.ts +12 -53
- package/dist/primitives/SegmentGroup/segmentgroup.variants.js +10 -10
- package/dist/primitives/Select/select.variants.d.ts +45 -134
- package/dist/primitives/Select/select.variants.js +6 -4
- package/dist/primitives/Separator/separator.variants.d.ts +4 -2
- package/dist/primitives/Sidebar/Sidebar.svelte +10 -15
- package/dist/primitives/Sidebar/sidebar.variants.d.ts +11 -29
- package/dist/primitives/Skeleton/skeleton.variants.d.ts +9 -36
- package/dist/primitives/Slider/slider.variants.d.ts +37 -136
- package/dist/primitives/Slider/slider.variants.js +8 -5
- package/dist/primitives/Spinner/spinner.variants.d.ts +38 -135
- package/dist/primitives/Stepper/stepper.variants.d.ts +32 -130
- package/dist/primitives/Tab/Tab.svelte +14 -6
- package/dist/primitives/Tab/tab.variants.d.ts +17 -78
- package/dist/primitives/Textarea/textarea.variants.d.ts +27 -112
- package/dist/primitives/Textarea/textarea.variants.js +12 -10
- package/dist/primitives/Toast/Toaster.svelte +16 -3
- package/dist/primitives/Toast/index.d.ts +9 -0
- package/dist/primitives/Toast/toast.variants.d.ts +22 -78
- package/dist/primitives/Toggle/toggle.variants.d.ts +17 -71
- package/dist/primitives/Toolbar/toolbar.variants.d.ts +9 -60
- package/dist/primitives/Tooltip/Tooltip.svelte +11 -0
- package/dist/primitives/Tooltip/index.d.ts +14 -0
- package/dist/primitives/Tooltip/tooltip.variants.d.ts +11 -50
- package/dist/primitives/Tooltip/tooltip.variants.js +7 -1
- package/dist/style/foundation.css +4 -1
- package/dist/style/interaction.css +39 -11
- package/dist/style/semantic.css +2 -2
- package/dist/style/themes/index.css +1 -1
- package/dist/utils/index.d.ts +2 -1
- package/dist/utils/index.js +5 -0
- package/dist/utils/overlay.d.ts +33 -4
- package/dist/utils/overlay.js +61 -18
- package/dist/utils/roving.d.ts +15 -0
- package/dist/utils/roving.js +44 -0
- package/dist/utils/use-floating-panel.svelte.d.ts +4 -1
- package/dist/utils/use-floating-panel.svelte.js +23 -1
- package/dist/utils/variants.d.ts +60 -16
- package/dist/utils/variants.js +424 -123
- 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?:
|
|
3
|
-
tier
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
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
|
-
|
|
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
|
-
|
|
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?:
|
|
3
|
-
size
|
|
4
|
-
|
|
5
|
-
|
|
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
|
-
|
|
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
|
-
|
|
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
|
}
|