ropav 0.0.7 → 0.0.9
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/accordion.css +10 -10
- package/dist/accordion.js +2 -4
- package/dist/alert.css +109 -0
- package/dist/alert.js +168 -0
- package/dist/aspect-ratio.css +17 -0
- package/dist/aspect-ratio.js +26 -0
- package/dist/avatar.css +97 -0
- package/dist/avatar.js +161 -0
- package/dist/badge.css +40 -115
- package/dist/badge.js +19 -18
- package/dist/base.css +609 -180
- package/dist/bem.js +0 -2
- package/dist/button-group.js +0 -2
- package/dist/button-link.css +161 -0
- package/dist/button-link.js +108 -0
- package/dist/button.css +50 -229
- package/dist/button.js +7 -11
- package/dist/card.css +50 -30
- package/dist/card.js +69 -38
- package/dist/check.js +12 -0
- package/dist/checkbox.css +16 -57
- package/dist/checkbox.js +14 -33
- package/dist/collapse.css +8 -8
- package/dist/collapse.js +4 -10
- package/dist/color-input.css +108 -0
- package/dist/color-input.js +344 -0
- package/dist/color-picker.css +304 -0
- package/dist/color-picker.js +717 -0
- package/dist/color-picker2.js +18 -0
- package/dist/color-swatch.css +50 -0
- package/dist/color-swatch.js +73 -0
- package/dist/color.js +190 -0
- package/dist/componentColors.js +206 -15
- package/dist/components/alert/alert.d.ts +30 -0
- package/dist/components/alert/index.d.ts +3 -0
- package/dist/components/alert/index.js +2 -0
- package/dist/components/alert/types.d.ts +20 -0
- package/dist/components/alert/useAlertColor.d.ts +3 -0
- package/dist/components/aspect-ratio/aspect-ratio.d.ts +21 -0
- package/dist/components/aspect-ratio/index.d.ts +2 -0
- package/dist/components/aspect-ratio/index.js +2 -0
- package/dist/components/aspect-ratio/types.d.ts +3 -0
- package/dist/components/avatar/avatar.d.ts +24 -0
- package/dist/components/avatar/index.d.ts +3 -0
- package/dist/components/avatar/index.js +2 -0
- package/dist/components/avatar/types.d.ts +20 -0
- package/dist/components/avatar/useAvatarColor.d.ts +3 -0
- package/dist/components/badge/types.d.ts +2 -1
- package/dist/components/badge/useBadgeColor.d.ts +3 -8
- package/dist/components/button/types.d.ts +1 -0
- package/dist/components/button/useButtonColor.d.ts +3 -13
- package/dist/components/button-link/button-link.d.ts +27 -0
- package/dist/components/button-link/index.d.ts +2 -0
- package/dist/components/button-link/index.js +2 -0
- package/dist/components/button-link/types.d.ts +20 -0
- package/dist/components/card/card.d.ts +4 -0
- package/dist/components/card/types.d.ts +4 -0
- package/dist/components/checkbox/types.d.ts +1 -0
- package/dist/components/checkbox/useCheckbox.d.ts +2 -4
- package/dist/components/collapse/types.d.ts +0 -2
- package/dist/components/color-input/color-input.d.ts +29 -0
- package/dist/components/color-input/index.d.ts +2 -0
- package/dist/components/color-input/index.js +2 -0
- package/dist/components/color-input/types.d.ts +34 -0
- package/dist/components/color-input/useColorInput.d.ts +27 -0
- package/dist/components/color-input/useColorInputEyeDropper.d.ts +13 -0
- package/dist/components/color-input/useColorInputPopover.d.ts +11 -0
- package/dist/components/color-input/useColorInputValue.d.ts +8 -0
- package/dist/components/color-picker/color-picker-saturation.d.ts +21 -0
- package/dist/components/color-picker/color-picker-slider.d.ts +21 -0
- package/dist/components/color-picker/color-picker-utils.d.ts +23 -0
- package/dist/components/color-picker/color-picker.d.ts +23 -0
- package/dist/components/color-picker/index.d.ts +3 -0
- package/dist/components/color-picker/index.js +3 -0
- package/dist/components/color-picker/types.d.ts +39 -0
- package/dist/components/color-picker/useColorPickerDrag.d.ts +11 -0
- package/dist/components/color-picker/useColorPickerSwatches.d.ts +21 -0
- package/dist/components/color-picker/useColorPickerValue.d.ts +15 -0
- package/dist/components/color-swatch/color-swatch.d.ts +21 -0
- package/dist/components/color-swatch/index.d.ts +2 -0
- package/dist/components/color-swatch/index.js +2 -0
- package/dist/components/color-swatch/types.d.ts +6 -0
- package/dist/components/color-swatch/useColorSwatchColor.d.ts +5 -0
- package/dist/components/dropdown-menu/dropdown-menu.d.ts +2 -2
- package/dist/components/dropdown-menu/useDropdownMenu.d.ts +1 -1
- package/dist/components/dropdown-menu/useDropdownMenuNavigation.d.ts +1 -1
- package/dist/components/dropdown-menu/useDropdownSubmenus.d.ts +1 -1
- package/dist/components/field/types.d.ts +0 -2
- package/dist/components/field/useField.d.ts +1 -2
- package/dist/components/icon-button/types.d.ts +1 -0
- package/dist/components/input/types.d.ts +3 -0
- package/dist/components/modal/types.d.ts +0 -1
- package/dist/components/number-input/index.d.ts +2 -0
- package/dist/components/number-input/index.js +2 -0
- package/dist/components/number-input/number-input.d.ts +29 -0
- package/dist/components/number-input/types.d.ts +34 -0
- package/dist/components/number-input/useNumberInput.d.ts +31 -0
- package/dist/components/popover/index.d.ts +1 -0
- package/dist/components/popover/index.js +2 -1
- package/dist/components/popover/types.d.ts +6 -2
- package/dist/components/popover/usePopover.d.ts +5 -2
- package/dist/components/progress/types.d.ts +1 -1
- package/dist/components/radio/types.d.ts +3 -0
- package/dist/components/radio/useRadio.d.ts +2 -4
- package/dist/components/select/index.d.ts +1 -1
- package/dist/components/select/types.d.ts +3 -0
- package/dist/components/slider/index.d.ts +2 -1
- package/dist/components/slider/index.js +2 -2
- package/dist/components/slider/range-slider.d.ts +45 -0
- package/dist/components/slider/types.d.ts +14 -2
- package/dist/components/slider/useRangeSlider.d.ts +59 -0
- package/dist/components/slider/useRangeSliderTooltipCollision.d.ts +7 -0
- package/dist/components/slider/useRangeSliderTooltipTransition.d.ts +4 -0
- package/dist/components/switch/useSwitch.d.ts +2 -3
- package/dist/components/tooltip/types.d.ts +1 -0
- package/dist/dropdown-menu.css +17 -17
- package/dist/dropdown-menu.js +0 -2
- package/dist/field.css +17 -17
- package/dist/field.js +56 -51
- package/dist/icon-button.css +57 -236
- package/dist/icon-button.js +5 -8
- package/dist/index.d.ts +8 -0
- package/dist/index.js +16 -4
- package/dist/input.css +40 -46
- package/dist/input.js +39 -23
- package/dist/minus.js +12 -0
- package/dist/modal.css +37 -37
- package/dist/modal.js +10 -16
- package/dist/number-input.css +86 -0
- package/dist/number-input.js +350 -0
- package/dist/overlay.css +5 -5
- package/dist/overlay.js +3 -5
- package/dist/popover.css +62 -29
- package/dist/popover.js +25 -12
- package/dist/popover2.js +17 -0
- package/dist/progress.css +9 -30
- package/dist/progress.js +3 -8
- package/dist/radio.css +34 -62
- package/dist/radio.js +28 -18
- package/dist/select.css +105 -61
- package/dist/select.js +12 -10
- package/dist/slider.css +508 -41
- package/dist/slider.js +1122 -50
- package/dist/switch.css +19 -44
- package/dist/switch.js +4 -7
- package/dist/tabs.css +36 -36
- package/dist/tabs.js +1 -3
- package/dist/textarea.css +33 -25
- package/dist/textarea.js +0 -2
- package/dist/tooltip.css +7 -35
- package/dist/tooltip.js +13 -10
- package/dist/useButtonColor.js +16 -16
- package/dist/useClickOutside.js +0 -2
- package/dist/useCollapse.js +1 -3
- package/dist/useControlState.js +0 -2
- package/dist/useRequiredInject.js +0 -2
- package/dist/x.js +0 -2
- package/package.json +43 -7
- package/src/styles/_mixins.scss +25 -41
- package/src/styles/_tokens.scss +615 -182
- package/src/styles/_variables.scss +177 -49
- package/dist/accordion.js.map +0 -1
- package/dist/badge.js.map +0 -1
- package/dist/bem.js.map +0 -1
- package/dist/button-group.js.map +0 -1
- package/dist/button.js.map +0 -1
- package/dist/card.js.map +0 -1
- package/dist/checkbox.js.map +0 -1
- package/dist/collapse.js.map +0 -1
- package/dist/componentColors.js.map +0 -1
- package/dist/dropdown-menu.js.map +0 -1
- package/dist/field.js.map +0 -1
- package/dist/icon-button.js.map +0 -1
- package/dist/input.js.map +0 -1
- package/dist/modal.js.map +0 -1
- package/dist/overlay.js.map +0 -1
- package/dist/popover.js.map +0 -1
- package/dist/progress.js.map +0 -1
- package/dist/radio.js.map +0 -1
- package/dist/select.js.map +0 -1
- package/dist/slider.js.map +0 -1
- package/dist/switch.js.map +0 -1
- package/dist/tabs.js.map +0 -1
- package/dist/textarea.js.map +0 -1
- package/dist/tooltip.js.map +0 -1
- package/dist/useButtonColor.js.map +0 -1
- package/dist/useClickOutside.js.map +0 -1
- package/dist/useCollapse.js.map +0 -1
- package/dist/useControlState.js.map +0 -1
- package/dist/useRequiredInject.js.map +0 -1
- package/dist/x.js.map +0 -1
|
@@ -5,49 +5,155 @@
|
|
|
5
5
|
$font-family-base: system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif !default;
|
|
6
6
|
|
|
7
7
|
// Colors
|
|
8
|
-
$color-
|
|
9
|
-
$color-
|
|
10
|
-
$color-
|
|
11
|
-
$color-
|
|
12
|
-
$color-
|
|
13
|
-
$color-
|
|
14
|
-
$color-
|
|
15
|
-
$color-
|
|
16
|
-
$color-
|
|
17
|
-
$color-
|
|
18
|
-
$color-
|
|
19
|
-
$color-
|
|
20
|
-
$color-gray-
|
|
21
|
-
$color-gray-
|
|
22
|
-
$color-gray-
|
|
23
|
-
$color-gray-
|
|
24
|
-
$color-gray-
|
|
25
|
-
$color-gray-
|
|
26
|
-
$color-gray-
|
|
27
|
-
$color-gray-
|
|
28
|
-
$color-gray-
|
|
29
|
-
$color-
|
|
30
|
-
$color-
|
|
31
|
-
$color-
|
|
32
|
-
$color-
|
|
33
|
-
$color-
|
|
34
|
-
$color-
|
|
35
|
-
$color-
|
|
36
|
-
$color-
|
|
37
|
-
$color-
|
|
38
|
-
$color-
|
|
39
|
-
$color-
|
|
40
|
-
$color-
|
|
41
|
-
$color-
|
|
8
|
+
$color-white : #ffffff !default;
|
|
9
|
+
$color-black : #000000 !default;
|
|
10
|
+
$color-dark-0 : #C9C9C9 !default;
|
|
11
|
+
$color-dark-1 : #b8b8b8 !default;
|
|
12
|
+
$color-dark-2 : #828282 !default;
|
|
13
|
+
$color-dark-3 : #696969 !default;
|
|
14
|
+
$color-dark-4 : #424242 !default;
|
|
15
|
+
$color-dark-5 : #3b3b3b !default;
|
|
16
|
+
$color-dark-6 : #2e2e2e !default;
|
|
17
|
+
$color-dark-7 : #242424 !default;
|
|
18
|
+
$color-dark-8 : #1f1f1f !default;
|
|
19
|
+
$color-dark-9 : #141414 !default;
|
|
20
|
+
$color-gray-0 : #f8f9fa !default;
|
|
21
|
+
$color-gray-1 : #f1f3f5 !default;
|
|
22
|
+
$color-gray-2 : #e9ecef !default;
|
|
23
|
+
$color-gray-3 : #dee2e6 !default;
|
|
24
|
+
$color-gray-4 : #ced4da !default;
|
|
25
|
+
$color-gray-5 : #adb5bd !default;
|
|
26
|
+
$color-gray-6 : #868e96 !default;
|
|
27
|
+
$color-gray-7 : #495057 !default;
|
|
28
|
+
$color-gray-8 : #343a40 !default;
|
|
29
|
+
$color-gray-9 : #212529 !default;
|
|
30
|
+
$color-red-0 : #fff5f5 !default;
|
|
31
|
+
$color-red-1 : #ffe3e3 !default;
|
|
32
|
+
$color-red-2 : #ffc9c9 !default;
|
|
33
|
+
$color-red-3 : #ffa8a8 !default;
|
|
34
|
+
$color-red-4 : #ff8787 !default;
|
|
35
|
+
$color-red-5 : #ff6b6b !default;
|
|
36
|
+
$color-red-6 : #fa5252 !default;
|
|
37
|
+
$color-red-7 : #f03e3e !default;
|
|
38
|
+
$color-red-8 : #e03131 !default;
|
|
39
|
+
$color-red-9 : #c92a2a !default;
|
|
40
|
+
$color-pink-0 : #fff0f6 !default;
|
|
41
|
+
$color-pink-1 : #ffdeeb !default;
|
|
42
|
+
$color-pink-2 : #fcc2d7 !default;
|
|
43
|
+
$color-pink-3 : #faa2c1 !default;
|
|
44
|
+
$color-pink-4 : #f783ac !default;
|
|
45
|
+
$color-pink-5 : #f06595 !default;
|
|
46
|
+
$color-pink-6 : #e64980 !default;
|
|
47
|
+
$color-pink-7 : #d6336c !default;
|
|
48
|
+
$color-pink-8 : #c2255c !default;
|
|
49
|
+
$color-pink-9 : #a61e4d !default;
|
|
50
|
+
$color-grape-0 : #f8f0fc !default;
|
|
51
|
+
$color-grape-1 : #f3d9fa !default;
|
|
52
|
+
$color-grape-2 : #eebefa !default;
|
|
53
|
+
$color-grape-3 : #e599f7 !default;
|
|
54
|
+
$color-grape-4 : #da77f2 !default;
|
|
55
|
+
$color-grape-5 : #cc5de8 !default;
|
|
56
|
+
$color-grape-6 : #be4bdb !default;
|
|
57
|
+
$color-grape-7 : #ae3ec9 !default;
|
|
58
|
+
$color-grape-8 : #9c36b5 !default;
|
|
59
|
+
$color-grape-9 : #862e9c !default;
|
|
60
|
+
$color-violet-0: #f3f0ff !default;
|
|
61
|
+
$color-violet-1: #e5dbff !default;
|
|
62
|
+
$color-violet-2: #d0bfff !default;
|
|
63
|
+
$color-violet-3: #b197fc !default;
|
|
64
|
+
$color-violet-4: #9775fa !default;
|
|
65
|
+
$color-violet-5: #845ef7 !default;
|
|
66
|
+
$color-violet-6: #7950f2 !default;
|
|
67
|
+
$color-violet-7: #7048e8 !default;
|
|
68
|
+
$color-violet-8: #6741d9 !default;
|
|
69
|
+
$color-violet-9: #5f3dc4 !default;
|
|
70
|
+
$color-indigo-0: #edf2ff !default;
|
|
71
|
+
$color-indigo-1: #dbe4ff !default;
|
|
72
|
+
$color-indigo-2: #bac8ff !default;
|
|
73
|
+
$color-indigo-3: #91a7ff !default;
|
|
74
|
+
$color-indigo-4: #748ffc !default;
|
|
75
|
+
$color-indigo-5: #5c7cfa !default;
|
|
76
|
+
$color-indigo-6: #4c6ef5 !default;
|
|
77
|
+
$color-indigo-7: #4263eb !default;
|
|
78
|
+
$color-indigo-8: #3b5bdb !default;
|
|
79
|
+
$color-indigo-9: #364fc7 !default;
|
|
80
|
+
$color-blue-0 : #e7f5ff !default;
|
|
81
|
+
$color-blue-1 : #d0ebff !default;
|
|
82
|
+
$color-blue-2 : #a5d8ff !default;
|
|
83
|
+
$color-blue-3 : #74c0fc !default;
|
|
84
|
+
$color-blue-4 : #4dabf7 !default;
|
|
85
|
+
$color-blue-5 : #339af0 !default;
|
|
86
|
+
$color-blue-6 : #228be6 !default;
|
|
87
|
+
$color-blue-7 : #1c7ed6 !default;
|
|
88
|
+
$color-blue-8 : #1971c2 !default;
|
|
89
|
+
$color-blue-9 : #1864ab !default;
|
|
90
|
+
$color-cyan-0 : #e3fafc !default;
|
|
91
|
+
$color-cyan-1 : #c5f6fa !default;
|
|
92
|
+
$color-cyan-2 : #99e9f2 !default;
|
|
93
|
+
$color-cyan-3 : #66d9e8 !default;
|
|
94
|
+
$color-cyan-4 : #3bc9db !default;
|
|
95
|
+
$color-cyan-5 : #22b8cf !default;
|
|
96
|
+
$color-cyan-6 : #15aabf !default;
|
|
97
|
+
$color-cyan-7 : #1098ad !default;
|
|
98
|
+
$color-cyan-8 : #0c8599 !default;
|
|
99
|
+
$color-cyan-9 : #0b7285 !default;
|
|
100
|
+
$color-teal-0 : #e6fcf5 !default;
|
|
101
|
+
$color-teal-1 : #c3fae8 !default;
|
|
102
|
+
$color-teal-2 : #96f2d7 !default;
|
|
103
|
+
$color-teal-3 : #63e6be !default;
|
|
104
|
+
$color-teal-4 : #38d9a9 !default;
|
|
105
|
+
$color-teal-5 : #20c997 !default;
|
|
106
|
+
$color-teal-6 : #12b886 !default;
|
|
107
|
+
$color-teal-7 : #0ca678 !default;
|
|
108
|
+
$color-teal-8 : #099268 !default;
|
|
109
|
+
$color-teal-9 : #087f5b !default;
|
|
110
|
+
$color-green-0 : #ebfbee !default;
|
|
111
|
+
$color-green-1 : #d3f9d8 !default;
|
|
112
|
+
$color-green-2 : #b2f2bb !default;
|
|
113
|
+
$color-green-3 : #8ce99a !default;
|
|
114
|
+
$color-green-4 : #69db7c !default;
|
|
115
|
+
$color-green-5 : #51cf66 !default;
|
|
116
|
+
$color-green-6 : #40c057 !default;
|
|
117
|
+
$color-green-7 : #37b24d !default;
|
|
118
|
+
$color-green-8 : #2f9e44 !default;
|
|
119
|
+
$color-green-9 : #2b8a3e !default;
|
|
120
|
+
$color-lime-0 : #f4fce3 !default;
|
|
121
|
+
$color-lime-1 : #e9fac8 !default;
|
|
122
|
+
$color-lime-2 : #d8f5a2 !default;
|
|
123
|
+
$color-lime-3 : #c0eb75 !default;
|
|
124
|
+
$color-lime-4 : #a9e34b !default;
|
|
125
|
+
$color-lime-5 : #94d82d !default;
|
|
126
|
+
$color-lime-6 : #82c91e !default;
|
|
127
|
+
$color-lime-7 : #74b816 !default;
|
|
128
|
+
$color-lime-8 : #66a80f !default;
|
|
129
|
+
$color-lime-9 : #5c940d !default;
|
|
130
|
+
$color-yellow-0: #fff9db !default;
|
|
131
|
+
$color-yellow-1: #fff3bf !default;
|
|
132
|
+
$color-yellow-2: #ffec99 !default;
|
|
133
|
+
$color-yellow-3: #ffe066 !default;
|
|
134
|
+
$color-yellow-4: #ffd43b !default;
|
|
135
|
+
$color-yellow-5: #fcc419 !default;
|
|
136
|
+
$color-yellow-6: #fab005 !default;
|
|
137
|
+
$color-yellow-7: #f59f00 !default;
|
|
138
|
+
$color-yellow-8: #f08c00 !default;
|
|
139
|
+
$color-yellow-9: #e67700 !default;
|
|
140
|
+
$color-orange-0: #fff4e6 !default;
|
|
141
|
+
$color-orange-1: #ffe8cc !default;
|
|
142
|
+
$color-orange-2: #ffd8a8 !default;
|
|
143
|
+
$color-orange-3: #ffc078 !default;
|
|
144
|
+
$color-orange-4: #ffa94d !default;
|
|
145
|
+
$color-orange-5: #ff922b !default;
|
|
146
|
+
$color-orange-6: #fd7e14 !default;
|
|
147
|
+
$color-orange-7: #f76707 !default;
|
|
148
|
+
$color-orange-8: #e8590c !default;
|
|
149
|
+
$color-orange-9: #d9480f !default;
|
|
42
150
|
|
|
43
151
|
// Font sizes
|
|
44
|
-
$font-size-xs
|
|
45
|
-
$font-size-sm
|
|
46
|
-
$font-size-
|
|
47
|
-
$font-size-lg
|
|
48
|
-
$font-size-xl
|
|
49
|
-
$font-size-2xl : 1.5rem !default;
|
|
50
|
-
$font-size-3xl : 1.875rem !default;
|
|
152
|
+
$font-size-xs: 0.75rem !default;
|
|
153
|
+
$font-size-sm: 0.875rem !default;
|
|
154
|
+
$font-size-md: 1rem !default;
|
|
155
|
+
$font-size-lg: 1.125rem !default;
|
|
156
|
+
$font-size-xl: 1.25rem !default;
|
|
51
157
|
|
|
52
158
|
// Font weights
|
|
53
159
|
$font-weight-normal : 400 !default;
|
|
@@ -55,12 +161,32 @@ $font-weight-medium : 500 !default;
|
|
|
55
161
|
$font-weight-semibold: 600 !default;
|
|
56
162
|
$font-weight-bold : 700 !default;
|
|
57
163
|
|
|
164
|
+
// Headings
|
|
165
|
+
$heading-h1-font-size : 2.125rem !default;
|
|
166
|
+
$heading-h1-line-height: 1.3 !default;
|
|
167
|
+
$heading-h1-font-weight: 700 !default;
|
|
168
|
+
$heading-h2-font-size : 1.625rem !default;
|
|
169
|
+
$heading-h2-line-height: 1.35 !default;
|
|
170
|
+
$heading-h2-font-weight: 700 !default;
|
|
171
|
+
$heading-h3-font-size : 1.375rem !default;
|
|
172
|
+
$heading-h3-line-height: 1.4 !default;
|
|
173
|
+
$heading-h3-font-weight: 700 !default;
|
|
174
|
+
$heading-h4-font-size : 1.125rem !default;
|
|
175
|
+
$heading-h4-line-height: 1.45 !default;
|
|
176
|
+
$heading-h4-font-weight: 700 !default;
|
|
177
|
+
$heading-h5-font-size : 1rem !default;
|
|
178
|
+
$heading-h5-line-height: 1.5 !default;
|
|
179
|
+
$heading-h5-font-weight: 700 !default;
|
|
180
|
+
$heading-h6-font-size : 0.875rem !default;
|
|
181
|
+
$heading-h6-line-height: 1.5 !default;
|
|
182
|
+
$heading-h6-font-weight: 700 !default;
|
|
183
|
+
|
|
58
184
|
// Line heights
|
|
59
|
-
$line-height-
|
|
60
|
-
$line-height-
|
|
61
|
-
$line-height-
|
|
62
|
-
$line-height-
|
|
63
|
-
$line-height-
|
|
185
|
+
$line-height-xs: 1.4 !default;
|
|
186
|
+
$line-height-sm: 1.45 !default;
|
|
187
|
+
$line-height-md: 1.55 !default;
|
|
188
|
+
$line-height-lg: 1.6 !default;
|
|
189
|
+
$line-height-xl: 1.65 !default;
|
|
64
190
|
|
|
65
191
|
// Spacing
|
|
66
192
|
$spacing-0 : 0 !default;
|
|
@@ -88,9 +214,11 @@ $border-width-thin : 1px !default;
|
|
|
88
214
|
$border-width-medium: 2px !default;
|
|
89
215
|
|
|
90
216
|
// Control sizes
|
|
91
|
-
$size-control-
|
|
92
|
-
$size-control-
|
|
93
|
-
$size-control-
|
|
217
|
+
$size-control-xs: 30px !default;
|
|
218
|
+
$size-control-sm: 36px !default;
|
|
219
|
+
$size-control-md: 42px !default;
|
|
220
|
+
$size-control-lg: 50px !default;
|
|
221
|
+
$size-control-xl: 60px !default;
|
|
94
222
|
|
|
95
223
|
// Component tokens
|
|
96
224
|
$component-menu-min-width : 180px !default;
|
package/dist/accordion.js.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"accordion.js","names":[],"sources":["../src/components/accordion/types.ts","../src/components/accordion/useAccordion.ts","../src/components/accordion/accordion.vue","../src/components/accordion/accordion.vue","../src/components/accordion/accordion-item.vue","../src/components/accordion/accordion-item.vue"],"sourcesContent":["import type { ComputedRef, InjectionKey } from 'vue';\nimport type {\n CollapseContentProps,\n CollapseContentRole,\n CollapseTriggerProps,\n} from '../collapse/types';\n\nexport type AccordionItemValue = string | number;\n\nexport type AccordionModelValue = AccordionItemValue | AccordionItemValue[] | null;\n\nexport type AccordionOrientation = 'vertical' | 'horizontal';\n\nexport type AccordionState = 'open' | 'closed';\n\nexport interface AccordionProps {\n id?: string;\n modelValue?: AccordionModelValue;\n defaultValue?: AccordionModelValue;\n multiple?: boolean;\n collapsible?: boolean;\n disabled?: boolean;\n unmountOnExit?: boolean;\n orientation?: AccordionOrientation;\n ariaLabel?: string;\n describedby?: string;\n labelledby?: string;\n}\n\nexport interface AccordionItemProps {\n id?: string;\n value: AccordionItemValue;\n title?: string;\n disabled?: boolean;\n unmountOnExit?: boolean;\n role?: CollapseContentRole;\n ariaLabel?: string;\n ariaDescribedby?: string;\n ariaLabelledby?: string;\n}\n\nexport interface AccordionRootProps {\n id?: string;\n class: string[];\n 'data-disabled'?: boolean;\n 'data-orientation': AccordionOrientation;\n 'aria-label'?: string;\n 'aria-labelledby'?: string;\n 'aria-describedby'?: string;\n onKeydown: (event: KeyboardEvent) => void;\n}\n\nexport interface AccordionItemRootProps {\n id: string;\n class: string[];\n 'data-state': AccordionState;\n 'data-disabled'?: boolean;\n}\n\nexport interface AccordionTriggerProps extends CollapseTriggerProps {\n id: string;\n class: string;\n 'aria-disabled'?: boolean;\n}\n\nexport interface AccordionContentProps extends CollapseContentProps {\n class: string;\n}\n\nexport interface AccordionItemSlotProps {\n value: AccordionItemValue;\n isOpen: boolean;\n disabled: boolean;\n open: () => void;\n close: () => void;\n toggle: () => void;\n}\n\nexport interface AccordionItemTriggerSlotProps extends AccordionItemSlotProps {\n triggerProps: AccordionTriggerProps;\n}\n\nexport interface AccordionContext {\n multiple: boolean;\n collapsible: boolean;\n disabled: boolean;\n unmountOnExit: boolean;\n orientation: AccordionOrientation;\n isItemOpen: (value: AccordionItemValue) => boolean;\n setItemOpen: (value: AccordionItemValue, open: boolean) => void;\n}\n\nexport interface UseAccordionReturn {\n rootClass: ComputedRef<string[]>;\n rootProps: ComputedRef<AccordionRootProps>;\n openValues: ComputedRef<AccordionItemValue[]>;\n setItemOpen: (value: AccordionItemValue, open: boolean) => void;\n}\n\nexport interface UseAccordionItemReturn {\n group: AccordionContext;\n id: ComputedRef<string>;\n triggerId: ComputedRef<string>;\n contentId: ComputedRef<string>;\n state: ComputedRef<AccordionState>;\n isOpen: ComputedRef<boolean>;\n isDisabled: ComputedRef<boolean>;\n shouldRenderContent: ComputedRef<boolean>;\n rootClass: ComputedRef<string[]>;\n rootProps: ComputedRef<AccordionItemRootProps>;\n triggerProps: ComputedRef<AccordionTriggerProps>;\n contentProps: ComputedRef<AccordionContentProps>;\n triggerSlotProps: ComputedRef<AccordionItemTriggerSlotProps>;\n contentSlotProps: ComputedRef<AccordionItemSlotProps>;\n open: () => void;\n close: () => void;\n toggle: () => void;\n}\n\nexport const accordionKey = Symbol('accordion') as InjectionKey<AccordionContext>;\n","import { computed, provide, ref, useId } from 'vue';\nimport { useRequiredInject } from '@/composables/useRequiredInject';\nimport { bem } from '@/utils/bem';\nimport { useCollapse } from '../collapse/useCollapse';\nimport { accordionKey } from './types';\nimport type {\n AccordionContentProps,\n AccordionContext,\n AccordionItemProps,\n AccordionItemRootProps,\n AccordionItemSlotProps,\n AccordionItemTriggerSlotProps,\n AccordionItemValue,\n AccordionModelValue,\n AccordionOrientation,\n AccordionProps,\n AccordionRootProps,\n AccordionState,\n AccordionTriggerProps,\n UseAccordionItemReturn,\n UseAccordionReturn,\n} from './types';\n\nconst ACCORDION_SELECTOR = '.rp-accordion';\nconst TRIGGER_SELECTOR = '.rp-accordion-item__trigger';\n\nfunction normalizeValue(value: AccordionModelValue | undefined, multiple: boolean) {\n if (value == null) return [];\n const values = Array.isArray(value) ? value : [value];\n return multiple ? values : values.slice(0, 1);\n}\n\nfunction toModelValue(values: AccordionItemValue[], multiple: boolean): AccordionModelValue {\n return multiple ? [...values] : (values[0] ?? null);\n}\n\nfunction hasValue(values: AccordionItemValue[], value: AccordionItemValue) {\n return values.some((itemValue) => itemValue === value);\n}\n\nfunction withoutValue(values: AccordionItemValue[], value: AccordionItemValue) {\n return values.filter((itemValue) => itemValue !== value);\n}\n\ntype NavigationDirection = 1 | -1;\n\nconst ORIENTATION_NAVIGATION_KEYS: Record<\n AccordionOrientation,\n Partial<Record<string, NavigationDirection>>\n> = {\n vertical: {\n ArrowDown: 1,\n ArrowUp: -1,\n },\n horizontal: {\n ArrowRight: 1,\n ArrowLeft: -1,\n },\n};\n\nfunction getAccordionTrigger(event: KeyboardEvent, root: HTMLElement) {\n const target = event.target;\n if (!(target instanceof Element)) return undefined;\n\n const trigger = target.closest<HTMLButtonElement>(TRIGGER_SELECTOR);\n if (!trigger || trigger.closest(ACCORDION_SELECTOR) !== root) return undefined;\n\n return trigger;\n}\n\nfunction getAccordionTriggers(root: HTMLElement) {\n return Array.from(root.querySelectorAll<HTMLButtonElement>(TRIGGER_SELECTOR)).filter(\n (trigger) => trigger.closest(ACCORDION_SELECTOR) === root && !trigger.disabled,\n );\n}\n\nfunction getNextTrigger(\n root: HTMLElement,\n currentTrigger: HTMLButtonElement,\n key: string,\n orientation: AccordionOrientation,\n) {\n const triggers = getAccordionTriggers(root);\n const currentIndex = triggers.indexOf(currentTrigger);\n if (currentIndex === -1 || triggers.length === 0) return undefined;\n\n if (key === 'Home') return triggers[0];\n if (key === 'End') return triggers[triggers.length - 1];\n\n const direction = ORIENTATION_NAVIGATION_KEYS[orientation][key];\n if (!direction) return undefined;\n\n return triggers[(currentIndex + direction + triggers.length) % triggers.length];\n}\n\nexport function useAccordion(\n props: Readonly<AccordionProps>,\n emitUpdate: (value: AccordionModelValue) => void,\n): UseAccordionReturn {\n const isMultiple = computed(() => Boolean(props.multiple));\n const isCollapsible = computed(() => props.collapsible !== false);\n const isDisabled = computed(() => Boolean(props.disabled));\n const orientation = computed(() => props.orientation ?? 'vertical');\n const isControlled = computed(() => props.modelValue !== undefined);\n const uncontrolledValue = ref<AccordionModelValue>(props.defaultValue ?? null);\n\n const openValues = computed(() =>\n normalizeValue(\n isControlled.value ? props.modelValue : uncontrolledValue.value,\n isMultiple.value,\n ),\n );\n\n const rootClass = computed(() =>\n bem('rp-accordion', {\n disabled: isDisabled.value,\n multiple: isMultiple.value,\n [`${orientation.value}`]: true,\n }),\n );\n\n const rootProps = computed<AccordionRootProps>(() => ({\n id: props.id,\n class: rootClass.value,\n 'data-disabled': isDisabled.value || undefined,\n 'data-orientation': orientation.value,\n 'aria-label': props.ariaLabel || undefined,\n 'aria-labelledby': props.labelledby || undefined,\n 'aria-describedby': props.describedby || undefined,\n onKeydown: onRootKeydown,\n }));\n\n function setValues(nextValues: AccordionItemValue[]) {\n const nextModelValue = toModelValue(nextValues, isMultiple.value);\n\n if (!isControlled.value) uncontrolledValue.value = nextModelValue;\n emitUpdate(nextModelValue);\n }\n\n function setItemOpen(value: AccordionItemValue, open: boolean) {\n if (isDisabled.value) return;\n\n const values = openValues.value;\n const itemIsOpen = hasValue(values, value);\n if (itemIsOpen === open) return;\n if (!open && !isCollapsible.value) return;\n\n if (isMultiple.value) {\n setValues(open ? [...values, value] : withoutValue(values, value));\n return;\n }\n\n setValues(open ? [value] : []);\n }\n\n function onRootKeydown(event: KeyboardEvent) {\n const root = event.currentTarget as HTMLElement | null;\n if (!root) return;\n\n const trigger = getAccordionTrigger(event, root);\n if (!trigger) return;\n\n const nextTrigger = getNextTrigger(root, trigger, event.key, orientation.value);\n if (!nextTrigger) return;\n\n event.preventDefault();\n nextTrigger.focus();\n }\n\n provide<AccordionContext>(accordionKey, {\n get multiple() {\n return isMultiple.value;\n },\n get collapsible() {\n return isCollapsible.value;\n },\n get disabled() {\n return isDisabled.value;\n },\n get unmountOnExit() {\n return Boolean(props.unmountOnExit);\n },\n get orientation() {\n return orientation.value;\n },\n isItemOpen(value) {\n return hasValue(openValues.value, value);\n },\n setItemOpen,\n });\n\n return {\n rootClass,\n rootProps,\n openValues,\n setItemOpen,\n };\n}\n\nexport function useAccordionItem(props: Readonly<AccordionItemProps>): UseAccordionItemReturn {\n const group = useRequiredInject(accordionKey, 'RpAccordionItem');\n const generatedId = useId();\n\n const id = computed(() => props.id ?? `${generatedId}-accordion-item`);\n const triggerId = computed(() => `${id.value}-trigger`);\n const contentId = computed(() => `${id.value}-content`);\n const isOpen = computed(() => group.isItemOpen(props.value));\n const isDisabled = computed(() => Boolean(group.disabled || props.disabled));\n const shouldUnmountOnExit = computed(() => props.unmountOnExit ?? group.unmountOnExit);\n const state = computed<AccordionState>(() => (isOpen.value ? 'open' : 'closed'));\n const triggerAriaDisabled = computed(\n () => isDisabled.value || (!group.collapsible && isOpen.value),\n );\n\n const collapse = useCollapse(\n {\n id: contentId,\n open: isOpen,\n disabled: isDisabled,\n unmountOnExit: shouldUnmountOnExit,\n role: () => props.role ?? 'region',\n ariaLabel: () => props.ariaLabel,\n ariaDescribedby: () => props.ariaDescribedby,\n ariaLabelledby: () => props.ariaLabelledby ?? triggerId.value,\n },\n (nextOpen) => {\n setOpen(nextOpen);\n },\n );\n\n const rootClass = computed(() =>\n bem('rp-accordion-item', {\n open: isOpen.value,\n closed: !isOpen.value,\n disabled: isDisabled.value,\n [`${group.orientation}`]: true,\n }),\n );\n\n const rootProps = computed<AccordionItemRootProps>(() => ({\n id: id.value,\n class: rootClass.value,\n 'data-state': state.value,\n 'data-disabled': isDisabled.value || undefined,\n }));\n\n const triggerProps = computed<AccordionTriggerProps>(() => ({\n ...collapse.triggerProps.value,\n id: triggerId.value,\n class: 'rp-accordion-item__trigger',\n 'aria-controls': contentId.value,\n 'aria-expanded': isOpen.value,\n 'aria-disabled': triggerAriaDisabled.value || undefined,\n disabled: isDisabled.value || undefined,\n onClick: onTriggerClick,\n }));\n\n const contentProps = computed<AccordionContentProps>(() => ({\n ...collapse.contentProps.value,\n class: 'rp-accordion-item__content',\n id: contentId.value,\n 'aria-labelledby': props.ariaLabelledby ?? triggerId.value,\n }));\n\n const contentSlotProps = computed<AccordionItemSlotProps>(() => ({\n value: props.value,\n isOpen: isOpen.value,\n disabled: isDisabled.value,\n open,\n close,\n toggle,\n }));\n\n const triggerSlotProps = computed<AccordionItemTriggerSlotProps>(() => ({\n triggerProps: triggerProps.value,\n ...contentSlotProps.value,\n }));\n\n function open() {\n setOpen(true);\n }\n\n function close() {\n setOpen(false);\n }\n\n function toggle() {\n setOpen(!isOpen.value);\n }\n\n function setOpen(nextOpen: boolean) {\n if (isDisabled.value) return;\n group.setItemOpen(props.value, nextOpen);\n }\n\n function onTriggerClick() {\n toggle();\n }\n\n return {\n group,\n id,\n triggerId,\n contentId,\n state,\n isOpen,\n isDisabled,\n shouldRenderContent: collapse.shouldRenderContent,\n rootClass,\n rootProps,\n triggerProps,\n contentProps,\n triggerSlotProps,\n contentSlotProps,\n open,\n close,\n toggle,\n };\n}\n","<template>\n <div v-bind=\"rootProps\">\n <slot />\n </div>\n</template>\n\n<script lang=\"ts\" setup vapor>\nimport { useAccordion } from './useAccordion';\nimport type { AccordionModelValue, AccordionProps } from './types';\n\ndefineOptions({ name: 'RpAccordion' });\n\nconst props = withDefaults(defineProps<AccordionProps>(), {\n modelValue: undefined,\n defaultValue: undefined,\n multiple: false,\n collapsible: true,\n disabled: false,\n unmountOnExit: false,\n orientation: 'vertical',\n});\n\nconst emit = defineEmits<{\n 'update:modelValue': [value: AccordionModelValue];\n}>();\n\nconst { rootProps } = useAccordion(props, (value) => {\n emit('update:modelValue', value);\n});\n</script>\n\n<style src=\"./accordion.scss\" lang=\"scss\" scoped></style>\n","<template>\n <div v-bind=\"rootProps\">\n <slot />\n </div>\n</template>\n\n<script lang=\"ts\" setup vapor>\nimport { useAccordion } from './useAccordion';\nimport type { AccordionModelValue, AccordionProps } from './types';\n\ndefineOptions({ name: 'RpAccordion' });\n\nconst props = withDefaults(defineProps<AccordionProps>(), {\n modelValue: undefined,\n defaultValue: undefined,\n multiple: false,\n collapsible: true,\n disabled: false,\n unmountOnExit: false,\n orientation: 'vertical',\n});\n\nconst emit = defineEmits<{\n 'update:modelValue': [value: AccordionModelValue];\n}>();\n\nconst { rootProps } = useAccordion(props, (value) => {\n emit('update:modelValue', value);\n});\n</script>\n\n<style src=\"./accordion.scss\" lang=\"scss\" scoped></style>\n","<template>\n <div v-bind=\"rootProps\">\n <h3 class=\"rp-accordion-item__heading\">\n <slot name=\"trigger\" v-bind=\"triggerSlotProps\">\n <button v-bind=\"triggerProps\">\n <span class=\"rp-accordion-item__title\">\n <slot name=\"title\">{{ title }}</slot>\n </span>\n <span class=\"rp-accordion-item__icon\" aria-hidden=\"true\">\n <IconChevronDown />\n </span>\n </button>\n </slot>\n </h3>\n\n <Transition name=\"rp-accordion-content\">\n <section v-if=\"shouldRenderContent\" v-show=\"isOpen\" v-bind=\"contentProps\">\n <div class=\"rp-accordion-item__inner\">\n <slot v-bind=\"contentSlotProps\" />\n </div>\n </section>\n </Transition>\n </div>\n</template>\n\n<script lang=\"ts\" setup vapor>\nimport IconChevronDown from '~icons/lucide/chevron-down';\nimport { useAccordionItem } from './useAccordion';\nimport type { AccordionItemProps } from './types';\n\ndefineOptions({ name: 'RpAccordionItem' });\n\nconst props = withDefaults(defineProps<AccordionItemProps>(), {\n title: '',\n disabled: false,\n unmountOnExit: undefined,\n role: 'region',\n});\n\nconst {\n rootProps,\n triggerProps,\n contentProps,\n triggerSlotProps,\n contentSlotProps,\n isOpen,\n shouldRenderContent,\n} = useAccordionItem(props);\n</script>\n\n<style src=\"./accordion-item.scss\" lang=\"scss\" scoped></style>\n","<template>\n <div v-bind=\"rootProps\">\n <h3 class=\"rp-accordion-item__heading\">\n <slot name=\"trigger\" v-bind=\"triggerSlotProps\">\n <button v-bind=\"triggerProps\">\n <span class=\"rp-accordion-item__title\">\n <slot name=\"title\">{{ title }}</slot>\n </span>\n <span class=\"rp-accordion-item__icon\" aria-hidden=\"true\">\n <IconChevronDown />\n </span>\n </button>\n </slot>\n </h3>\n\n <Transition name=\"rp-accordion-content\">\n <section v-if=\"shouldRenderContent\" v-show=\"isOpen\" v-bind=\"contentProps\">\n <div class=\"rp-accordion-item__inner\">\n <slot v-bind=\"contentSlotProps\" />\n </div>\n </section>\n </Transition>\n </div>\n</template>\n\n<script lang=\"ts\" setup vapor>\nimport IconChevronDown from '~icons/lucide/chevron-down';\nimport { useAccordionItem } from './useAccordion';\nimport type { AccordionItemProps } from './types';\n\ndefineOptions({ name: 'RpAccordionItem' });\n\nconst props = withDefaults(defineProps<AccordionItemProps>(), {\n title: '',\n disabled: false,\n unmountOnExit: undefined,\n role: 'region',\n});\n\nconst {\n rootProps,\n triggerProps,\n contentProps,\n triggerSlotProps,\n contentSlotProps,\n isOpen,\n shouldRenderContent,\n} = useAccordionItem(props);\n</script>\n\n<style src=\"./accordion-item.scss\" lang=\"scss\" scoped></style>\n"],"mappings":"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"}
|
package/dist/badge.js.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"badge.js","names":[],"sources":["../src/components/badge/useBadgeColor.ts","../src/components/badge/badge.vue","../src/components/badge/badge.vue","../src/components/badge/types.ts"],"sourcesContent":["import type { CSSProperties } from 'vue';\nimport { getComponentCustomColor } from '@/utils/componentColors';\nimport type { BadgeColor } from './types';\n\nexport function getBadgeColorStyle(color: BadgeColor | undefined) {\n const customColor = getComponentCustomColor(color);\n if (!customColor) return undefined;\n\n return {\n '--_rp-badge-custom-color': customColor,\n '--_rp-badge-custom-fg': customColor,\n '--_rp-badge-custom-on': 'var(--rp-color-on-primary)',\n '--_rp-badge-custom-subtle-bg': `color-mix(in srgb, ${customColor} 12%, transparent)`,\n '--_rp-badge-custom-border': `color-mix(in srgb, ${customColor} 45%, transparent)`,\n } satisfies CSSProperties;\n}\n","<template>\n <span :class=\"rootClass\" :style=\"rootStyle\" :aria-label=\"ariaLabel || undefined\">\n <span v-if=\"$slots.left\" class=\"rp-badge__left\">\n <slot name=\"left\" />\n </span>\n <span v-if=\"$slots.default\" class=\"rp-badge__label\">\n <slot />\n </span>\n <span v-if=\"$slots.right\" class=\"rp-badge__right\">\n <slot name=\"right\" />\n </span>\n </span>\n</template>\n\n<script lang=\"ts\" setup vapor>\nimport { computed } from 'vue';\nimport { bem } from '@/utils/bem';\nimport { isComponentPresetColor } from '@/utils/componentColors';\nimport type { BadgeProps } from './types';\nimport { getBadgeColorStyle } from './useBadgeColor';\n\ndefineOptions({ name: 'RpBadge' });\n\nconst props = defineProps<BadgeProps>();\n\nconst rootClass = computed(() =>\n bem('rp-badge', {\n [props.variant ?? '']: Boolean(props.variant),\n [`color-${props.color}`]: isComponentPresetColor(props.color),\n [`size-${props.size}`]: Boolean(props.size),\n [`radius-${props.radius}`]: Boolean(props.radius),\n }),\n);\n\nconst rootStyle = computed(() => getBadgeColorStyle(props.color));\n</script>\n\n<style src=\"./badge.scss\" lang=\"scss\" scoped></style>\n","<template>\n <span :class=\"rootClass\" :style=\"rootStyle\" :aria-label=\"ariaLabel || undefined\">\n <span v-if=\"$slots.left\" class=\"rp-badge__left\">\n <slot name=\"left\" />\n </span>\n <span v-if=\"$slots.default\" class=\"rp-badge__label\">\n <slot />\n </span>\n <span v-if=\"$slots.right\" class=\"rp-badge__right\">\n <slot name=\"right\" />\n </span>\n </span>\n</template>\n\n<script lang=\"ts\" setup vapor>\nimport { computed } from 'vue';\nimport { bem } from '@/utils/bem';\nimport { isComponentPresetColor } from '@/utils/componentColors';\nimport type { BadgeProps } from './types';\nimport { getBadgeColorStyle } from './useBadgeColor';\n\ndefineOptions({ name: 'RpBadge' });\n\nconst props = defineProps<BadgeProps>();\n\nconst rootClass = computed(() =>\n bem('rp-badge', {\n [props.variant ?? '']: Boolean(props.variant),\n [`color-${props.color}`]: isComponentPresetColor(props.color),\n [`size-${props.size}`]: Boolean(props.size),\n [`radius-${props.radius}`]: Boolean(props.radius),\n }),\n);\n\nconst rootStyle = computed(() => getBadgeColorStyle(props.color));\n</script>\n\n<style src=\"./badge.scss\" lang=\"scss\" scoped></style>\n","import { componentColors, type ComponentColorValue } from '../../utils/componentColors';\n\nexport const badgeColors = componentColors;\n\nexport const badgeSizes = ['xs', 'sm', 'md', 'lg', 'xl'] as const;\n\nexport const badgeRadiuses = ['none', 'xs', 'sm', 'md', 'lg', 'xl', 'full'] as const;\n\nexport const badgeVariants = ['solid', 'subtle', 'surface', 'outline'] as const;\n\nexport type BadgeColor = ComponentColorValue;\n\nexport type BadgeSize = (typeof badgeSizes)[number];\n\nexport type BadgeRadius = (typeof badgeRadiuses)[number];\n\nexport type BadgeVariant = (typeof badgeVariants)[number];\n\nexport interface BadgeProps {\n variant?: BadgeVariant;\n color?: BadgeColor;\n size?: BadgeSize;\n radius?: BadgeRadius;\n ariaLabel?: string;\n}\n"],"mappings":";;;;;AAIA,SAAgB,mBAAmB,OAA+B;CAC9D,MAAM,cAAc,wBAAwB,KAAK;CACjD,IAAI,CAAC,aAAa,OAAO,KAAA;CAEzB,OAAO;EACH,4BAA4B;EAC5B,yBAAyB;EACzB,yBAAyB;EACzB,gCAAgC,sBAAsB,YAAY;EAClE,6BAA6B,sBAAsB,YAAY;CACnE;AACJ;;;;;;;;;;;;;;;;;;;;ECQA,MAAM,QAAQ;EAEd,MAAM,YAAY,eACd,IAAI,YAAY;IACX,MAAM,WAAW,KAAK,QAAQ,MAAM,OAAO;IAC3C,SAAS,MAAM,UAAU,uBAAuB,MAAM,KAAK;IAC3D,QAAQ,MAAM,SAAS,QAAQ,MAAM,IAAI;IACzC,UAAU,MAAM,WAAW,QAAQ,MAAM,MAAM;EACpD,CAAC,CACL;EAEA,MAAM,YAAY,eAAe,mBAAmB,MAAM,KAAK,CAAC;;;iBAjC9C,UAAA,KAAS;iBAAU,UAAA,KAAS;gBAAG,cAAY,QAAA,aAAa,KAAA,CAAS;;;iBAC/D,OAAM,YAAA;;;cACR,QAAW,MAAA,MAAA,CAAA;;;;iBAET,OAAM,eAAA;;;;;;;iBAGN,OAAM,aAAA;;;cACR,SAAY,MAAA,MAAA,CAAA;;;;;;;;AEP9B,IAAa,cAAc;AAE3B,IAAa,aAAa;CAAC;CAAM;CAAM;CAAM;CAAM;AAAI;AAEvD,IAAa,gBAAgB;CAAC;CAAQ;CAAM;CAAM;CAAM;CAAM;CAAM;AAAM;AAE1E,IAAa,gBAAgB;CAAC;CAAS;CAAU;CAAW;AAAS"}
|
package/dist/bem.js.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"bem.js","names":[],"sources":["../src/utils/bem.ts"],"sourcesContent":["type BemModifier = string | Record<string, boolean | undefined>;\n\nexport function bem(block: string, ...modifiers: BemModifier[]): string[] {\n const classes = [block];\n for (const mod of modifiers) {\n if (typeof mod === 'string') {\n classes.push(`${block}--${mod}`);\n } else {\n for (const [key, val] of Object.entries(mod)) {\n if (val) classes.push(`${block}--${key}`);\n }\n }\n }\n return classes;\n}\n"],"mappings":";AAEA,SAAgB,IAAI,OAAe,GAAG,WAAoC;CACtE,MAAM,UAAU,CAAC,KAAK;CACtB,KAAK,MAAM,OAAO,WACd,IAAI,OAAO,QAAQ,UACf,QAAQ,KAAK,GAAG,MAAM,IAAI,KAAK;MAE/B,KAAK,MAAM,CAAC,KAAK,QAAQ,OAAO,QAAQ,GAAG,GACvC,IAAI,KAAK,QAAQ,KAAK,GAAG,MAAM,IAAI,KAAK;CAIpD,OAAO;AACX"}
|
package/dist/button-group.js.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"button-group.js","names":[],"sources":["../src/components/button-group/button-group.vue","../src/components/button-group/button-group.vue"],"sourcesContent":["<template>\n <div\n :id=\"id\"\n :class=\"rootClass\"\n role=\"group\"\n :aria-label=\"ariaLabel || undefined\"\n :aria-labelledby=\"labelledby\"\n :aria-describedby=\"describedby\"\n >\n <slot />\n </div>\n</template>\n\n<script lang=\"ts\" setup vapor>\nimport { computed } from 'vue';\nimport { bem } from '@/utils/bem';\nimport type { ButtonGroupProps } from './types';\n\ndefineOptions({ name: 'RpButtonGroup' });\n\nconst props = withDefaults(defineProps<ButtonGroupProps>(), {\n orientation: 'horizontal',\n attached: false,\n wrap: false,\n});\n\nconst rootClass = computed(() =>\n bem('rp-button-group', {\n vertical: props.orientation === 'vertical',\n attached: props.attached,\n wrap: props.wrap,\n }),\n);\n</script>\n\n<style src=\"./button-group.scss\" lang=\"scss\" scoped></style>\n","<template>\n <div\n :id=\"id\"\n :class=\"rootClass\"\n role=\"group\"\n :aria-label=\"ariaLabel || undefined\"\n :aria-labelledby=\"labelledby\"\n :aria-describedby=\"describedby\"\n >\n <slot />\n </div>\n</template>\n\n<script lang=\"ts\" setup vapor>\nimport { computed } from 'vue';\nimport { bem } from '@/utils/bem';\nimport type { ButtonGroupProps } from './types';\n\ndefineOptions({ name: 'RpButtonGroup' });\n\nconst props = withDefaults(defineProps<ButtonGroupProps>(), {\n orientation: 'horizontal',\n attached: false,\n wrap: false,\n});\n\nconst rootClass = computed(() =>\n bem('rp-button-group', {\n vertical: props.orientation === 'vertical',\n attached: props.attached,\n wrap: props.wrap,\n }),\n);\n</script>\n\n<style src=\"./button-group.scss\" lang=\"scss\" scoped></style>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;EAoBA,MAAM,QAAQ;EAMd,MAAM,YAAY,eACd,IAAI,mBAAmB;GACnB,UAAU,MAAM,gBAAgB;GAChC,UAAU,MAAM;GAChB,MAAM,MAAM;EAChB,CAAC,CACL;;;eA9BS,MAAI,QAAA,EAAE;gBACC,UAAA,KAAS;eAEhB,cAAY,QAAA,aAAa,KAAA,CAAS;eAClC,mBAAiB,QAAA,UAAU;eAC3B,oBAAkB,QAAA,WAAW"}
|
package/dist/button.js.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"button.js","names":[],"sources":["../src/components/button/button.vue","../src/components/button/button.vue"],"sourcesContent":["<template>\n <button\n :class=\"rootClass\"\n :style=\"rootStyle\"\n :disabled=\"disabled || loading || undefined\"\n :type=\"type\"\n :aria-busy=\"loading || undefined\"\n >\n <span v-if=\"loading\" class=\"rp-button__loading\" aria-hidden=\"true\">\n <slot name=\"loading\">\n <IconLoaderCircle class=\"rp-button__spinner\" />\n </slot>\n </span>\n <span class=\"rp-button__content\" :aria-hidden=\"loading || undefined\">\n <span v-if=\"$slots.left\" class=\"rp-button__left\">\n <slot name=\"left\" />\n </span>\n <span class=\"rp-button__label\">\n <slot />\n </span>\n <span v-if=\"$slots.right\" class=\"rp-button__right\">\n <slot name=\"right\" />\n </span>\n </span>\n </button>\n</template>\n\n<script lang=\"ts\" setup vapor>\nimport { computed } from 'vue';\nimport IconLoaderCircle from '~icons/lucide/loader-circle';\nimport { isComponentPresetColor } from '@/utils/componentColors';\nimport { bem } from '@/utils/bem';\nimport type { ButtonProps } from './types';\nimport { getButtonColorStyle } from './useButtonColor';\n\ndefineOptions({ name: 'RpButton' });\n\nconst props = withDefaults(defineProps<ButtonProps>(), {\n type: 'button',\n disabled: false,\n loading: false,\n});\n\nconst rootClass = computed(() =>\n bem('rp-button', {\n [props.variant ?? '']: Boolean(props.variant),\n [`color-${props.color}`]: isComponentPresetColor(props.color),\n [`size-${props.size}`]: Boolean(props.size),\n [`radius-${props.radius}`]: Boolean(props.radius),\n loading: props.loading,\n }),\n);\n\nconst rootStyle = computed(() => getButtonColorStyle(props.color));\n</script>\n\n<style src=\"./button.scss\" lang=\"scss\" scoped></style>\n","<template>\n <button\n :class=\"rootClass\"\n :style=\"rootStyle\"\n :disabled=\"disabled || loading || undefined\"\n :type=\"type\"\n :aria-busy=\"loading || undefined\"\n >\n <span v-if=\"loading\" class=\"rp-button__loading\" aria-hidden=\"true\">\n <slot name=\"loading\">\n <IconLoaderCircle class=\"rp-button__spinner\" />\n </slot>\n </span>\n <span class=\"rp-button__content\" :aria-hidden=\"loading || undefined\">\n <span v-if=\"$slots.left\" class=\"rp-button__left\">\n <slot name=\"left\" />\n </span>\n <span class=\"rp-button__label\">\n <slot />\n </span>\n <span v-if=\"$slots.right\" class=\"rp-button__right\">\n <slot name=\"right\" />\n </span>\n </span>\n </button>\n</template>\n\n<script lang=\"ts\" setup vapor>\nimport { computed } from 'vue';\nimport IconLoaderCircle from '~icons/lucide/loader-circle';\nimport { isComponentPresetColor } from '@/utils/componentColors';\nimport { bem } from '@/utils/bem';\nimport type { ButtonProps } from './types';\nimport { getButtonColorStyle } from './useButtonColor';\n\ndefineOptions({ name: 'RpButton' });\n\nconst props = withDefaults(defineProps<ButtonProps>(), {\n type: 'button',\n disabled: false,\n loading: false,\n});\n\nconst rootClass = computed(() =>\n bem('rp-button', {\n [props.variant ?? '']: Boolean(props.variant),\n [`color-${props.color}`]: isComponentPresetColor(props.color),\n [`size-${props.size}`]: Boolean(props.size),\n [`radius-${props.radius}`]: Boolean(props.radius),\n loading: props.loading,\n }),\n);\n\nconst rootStyle = computed(() => getButtonColorStyle(props.color));\n</script>\n\n<style src=\"./button.scss\" lang=\"scss\" scoped></style>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAqCA,MAAM,QAAQ;EAMd,MAAM,YAAY,eACd,IAAI,aAAa;IACZ,MAAM,WAAW,KAAK,QAAQ,MAAM,OAAO;IAC3C,SAAS,MAAM,UAAU,uBAAuB,MAAM,KAAK;IAC3D,QAAQ,MAAM,SAAS,QAAQ,MAAM,IAAI;IACzC,UAAU,MAAM,WAAW,QAAQ,MAAM,MAAM;GAChD,SAAS,MAAM;EACnB,CAAC,CACL;EAEA,MAAM,YAAY,eAAe,oBAAoB,MAAM,KAAK,CAAC;;;;;;iBAnDjD,UAAA,KAAS;iBACT,UAAA,KAAS;gBAChB,YAAU,QAAA,YAAY,YAAW,KAAA,CAAS;gBAC1C,QAAM,QAAA,IAAI;gBACV,aAAW,YAAW,KAAA,CAAS;;;iBAEpB,QAAA,eAAO;;;cACT,WAAc,YAAA;2DACE,OAAM,qBAAoB,CAAA;;;;kCAGlB,eAAa,QAAA,WAAW,KAAA,CAAS,CAAA;;iBACnD,OAAM,YAAA;;;cACR,QAAW,MAAA,MAAA,CAAA;;;;;;iBAKT,OAAM,aAAA;;;cACR,SAAY,MAAA,MAAA,CAAA"}
|
package/dist/card.js.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"card.js","names":[],"sources":["../src/components/card/card.vue","../src/components/card/card.vue"],"sourcesContent":["<template>\n <div :class=\"rootClass\">\n <div v-if=\"hasHeader\" class=\"rp-card__header\">\n <div v-if=\"hasTitle\" class=\"rp-card__title\">\n {{ title }}\n </div>\n <p v-if=\"hasDescription\" class=\"rp-card__description\">\n {{ description }}\n </p>\n </div>\n\n <div v-if=\"$slots.default\" class=\"rp-card__body\">\n <slot />\n </div>\n </div>\n</template>\n\n<script lang=\"ts\" setup vapor>\nimport { computed } from 'vue';\nimport { bem } from '@/utils/bem';\nimport type { CardProps } from './types';\n\ndefineOptions({ name: 'RpCard' });\n\nconst props = withDefaults(defineProps<CardProps>(), {\n border: true,\n title: '',\n description: '',\n});\n\nconst hasTitle = computed(() => Boolean(props.title));\nconst hasDescription = computed(() => Boolean(props.description));\nconst hasHeader = computed(() => Boolean(hasTitle.value || hasDescription.value));\n\nconst rootClass = computed(() =>\n bem('rp-card', {\n [`layer-${props.layer}`]: Boolean(props.layer),\n [`padding-${props.padding}`]: Boolean(props.padding),\n [`radius-${props.radius}`]: Boolean(props.radius),\n borderless: !props.border,\n }),\n);\n</script>\n\n<style src=\"./card.scss\" lang=\"scss\" scoped></style>\n","<template>\n <div :class=\"rootClass\">\n <div v-if=\"hasHeader\" class=\"rp-card__header\">\n <div v-if=\"hasTitle\" class=\"rp-card__title\">\n {{ title }}\n </div>\n <p v-if=\"hasDescription\" class=\"rp-card__description\">\n {{ description }}\n </p>\n </div>\n\n <div v-if=\"$slots.default\" class=\"rp-card__body\">\n <slot />\n </div>\n </div>\n</template>\n\n<script lang=\"ts\" setup vapor>\nimport { computed } from 'vue';\nimport { bem } from '@/utils/bem';\nimport type { CardProps } from './types';\n\ndefineOptions({ name: 'RpCard' });\n\nconst props = withDefaults(defineProps<CardProps>(), {\n border: true,\n title: '',\n description: '',\n});\n\nconst hasTitle = computed(() => Boolean(props.title));\nconst hasDescription = computed(() => Boolean(props.description));\nconst hasHeader = computed(() => Boolean(hasTitle.value || hasDescription.value));\n\nconst rootClass = computed(() =>\n bem('rp-card', {\n [`layer-${props.layer}`]: Boolean(props.layer),\n [`padding-${props.padding}`]: Boolean(props.padding),\n [`radius-${props.radius}`]: Boolean(props.radius),\n borderless: !props.border,\n }),\n);\n</script>\n\n<style src=\"./card.scss\" lang=\"scss\" scoped></style>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;EAwBA,MAAM,QAAQ;EAMd,MAAM,WAAW,eAAe,QAAQ,MAAM,KAAK,CAAC;EACpD,MAAM,iBAAiB,eAAe,QAAQ,MAAM,WAAW,CAAC;EAChE,MAAM,YAAY,eAAe,QAAQ,SAAS,SAAS,eAAe,KAAK,CAAC;EAEhF,MAAM,YAAY,eACd,IAAI,WAAW;IACV,SAAS,MAAM,UAAU,QAAQ,MAAM,KAAK;IAC5C,WAAW,MAAM,YAAY,QAAQ,MAAM,OAAO;IAClD,UAAU,MAAM,WAAW,QAAQ,MAAM,MAAM;GAChD,YAAY,CAAC,MAAM;EACvB,CAAC,CACL;;mCAxCiB,UAAA,KAAS,CAAA;;iBACP,UAAA,aAAS;;;kBACL,SAAA,aAAQ;;;mDACZ,QAAA,KAAK,CAAA,CAAA;;;;kBAEH,eAAA,aAAc;;;mDAChB,QAAA,WAAW,CAAA,CAAA;;;;;;iBAIX,OAAM,eAAA"}
|
package/dist/checkbox.js.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"checkbox.js","names":[],"sources":["../src/components/checkbox/useCheckbox.ts","../src/components/checkbox/checkbox.vue","../src/components/checkbox/checkbox.vue"],"sourcesContent":["import { computed, type CSSProperties } from 'vue';\nimport { useControlState } from '@/composables/useControlState';\nimport { getComponentCustomColor, isComponentPresetColor } from '@/utils/componentColors';\nimport { bem } from '@/utils/bem';\nimport type { CheckboxProps } from './types';\n\nfunction getCheckboxColorStyle(color: CheckboxProps['color']) {\n const customColor = getComponentCustomColor(color);\n if (!customColor) return undefined;\n\n return {\n '--_rp-checkbox-custom-color': customColor,\n '--_rp-checkbox-custom-on-color': 'var(--rp-color-on-primary)',\n } satisfies CSSProperties;\n}\n\nexport function useCheckbox(props: Readonly<CheckboxProps>, emitUpdate: (value: boolean) => void) {\n const control = useControlState(props);\n\n const rootClass = computed(() =>\n bem('rp-checkbox', {\n checked: props.modelValue,\n indeterminate: props.indeterminate,\n disabled: control.disabled,\n invalid: control.invalid,\n [props.variant ?? '']: Boolean(props.variant),\n [`color-${props.color}`]: isComponentPresetColor(props.color),\n [`size-${props.size}`]: Boolean(props.size),\n [`radius-${props.radius}`]: Boolean(props.radius),\n }),\n );\n\n const rootStyle = computed(() => getCheckboxColorStyle(props.color));\n\n function onChange(e: Event) {\n emitUpdate((e.target as HTMLInputElement).checked);\n }\n\n return {\n control,\n rootClass,\n rootStyle,\n onChange,\n };\n}\n","<template>\n <label\n :class=\"rootClass\"\n :style=\"rootStyle\"\n :data-disabled=\"control.disabled || undefined\"\n :data-state=\"indeterminate ? 'indeterminate' : modelValue ? 'checked' : 'unchecked'\"\n >\n <input\n :id=\"control.id\"\n :name=\"name\"\n type=\"checkbox\"\n class=\"rp-checkbox__native\"\n :checked=\"modelValue\"\n :disabled=\"control.disabled || undefined\"\n :required=\"control.required || undefined\"\n :indeterminate=\"indeterminate\"\n :aria-checked=\"indeterminate ? 'mixed' : modelValue\"\n :aria-label=\"ariaLabel || undefined\"\n :aria-labelledby=\"control.ariaLabelledby\"\n :aria-describedby=\"control.ariaDescribedby\"\n :aria-invalid=\"control.invalid || undefined\"\n :aria-required=\"control.required || undefined\"\n @change=\"onChange\"\n />\n <span class=\"rp-checkbox__box\">\n <Transition name=\"rp-checkbox-icon\" mode=\"out-in\">\n <MinusIcon v-if=\"indeterminate\" key=\"minus\" class=\"rp-checkbox__icon\" />\n <CheckIcon v-else-if=\"modelValue\" key=\"check\" class=\"rp-checkbox__icon\" />\n </Transition>\n </span>\n <span v-if=\"$slots.default\" class=\"rp-checkbox__label\">\n <slot />\n </span>\n </label>\n</template>\n\n<script lang=\"ts\" setup vapor>\nimport CheckIcon from '~icons/lucide/check';\nimport MinusIcon from '~icons/lucide/minus';\nimport { useCheckbox } from './useCheckbox';\nimport type { CheckboxProps } from './types';\n\ndefineOptions({ name: 'RpCheckbox' });\n\nconst props = withDefaults(defineProps<CheckboxProps>(), {\n disabled: undefined,\n required: undefined,\n invalid: undefined,\n indeterminate: false,\n});\n\nconst emit = defineEmits<{\n 'update:modelValue': [value: boolean];\n}>();\n\nconst { control, rootClass, rootStyle, onChange } = useCheckbox(props, (value) => {\n emit('update:modelValue', value);\n});\n</script>\n\n<style src=\"./checkbox.scss\" lang=\"scss\" scoped></style>\n","<template>\n <label\n :class=\"rootClass\"\n :style=\"rootStyle\"\n :data-disabled=\"control.disabled || undefined\"\n :data-state=\"indeterminate ? 'indeterminate' : modelValue ? 'checked' : 'unchecked'\"\n >\n <input\n :id=\"control.id\"\n :name=\"name\"\n type=\"checkbox\"\n class=\"rp-checkbox__native\"\n :checked=\"modelValue\"\n :disabled=\"control.disabled || undefined\"\n :required=\"control.required || undefined\"\n :indeterminate=\"indeterminate\"\n :aria-checked=\"indeterminate ? 'mixed' : modelValue\"\n :aria-label=\"ariaLabel || undefined\"\n :aria-labelledby=\"control.ariaLabelledby\"\n :aria-describedby=\"control.ariaDescribedby\"\n :aria-invalid=\"control.invalid || undefined\"\n :aria-required=\"control.required || undefined\"\n @change=\"onChange\"\n />\n <span class=\"rp-checkbox__box\">\n <Transition name=\"rp-checkbox-icon\" mode=\"out-in\">\n <MinusIcon v-if=\"indeterminate\" key=\"minus\" class=\"rp-checkbox__icon\" />\n <CheckIcon v-else-if=\"modelValue\" key=\"check\" class=\"rp-checkbox__icon\" />\n </Transition>\n </span>\n <span v-if=\"$slots.default\" class=\"rp-checkbox__label\">\n <slot />\n </span>\n </label>\n</template>\n\n<script lang=\"ts\" setup vapor>\nimport CheckIcon from '~icons/lucide/check';\nimport MinusIcon from '~icons/lucide/minus';\nimport { useCheckbox } from './useCheckbox';\nimport type { CheckboxProps } from './types';\n\ndefineOptions({ name: 'RpCheckbox' });\n\nconst props = withDefaults(defineProps<CheckboxProps>(), {\n disabled: undefined,\n required: undefined,\n invalid: undefined,\n indeterminate: false,\n});\n\nconst emit = defineEmits<{\n 'update:modelValue': [value: boolean];\n}>();\n\nconst { control, rootClass, rootStyle, onChange } = useCheckbox(props, (value) => {\n emit('update:modelValue', value);\n});\n</script>\n\n<style src=\"./checkbox.scss\" lang=\"scss\" scoped></style>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAMA,SAAS,sBAAsB,OAA+B;CAC1D,MAAM,cAAc,wBAAwB,KAAK;CACjD,IAAI,CAAC,aAAa,OAAO,KAAA;CAEzB,OAAO;EACH,+BAA+B;EAC/B,kCAAkC;CACtC;AACJ;AAEA,SAAgB,YAAY,OAAgC,YAAsC;CAC9F,MAAM,UAAU,gBAAgB,KAAK;CAErC,MAAM,YAAY,eACd,IAAI,eAAe;EACf,SAAS,MAAM;EACf,eAAe,MAAM;EACrB,UAAU,QAAQ;EAClB,SAAS,QAAQ;GAChB,MAAM,WAAW,KAAK,QAAQ,MAAM,OAAO;GAC3C,SAAS,MAAM,UAAU,uBAAuB,MAAM,KAAK;GAC3D,QAAQ,MAAM,SAAS,QAAQ,MAAM,IAAI;GACzC,UAAU,MAAM,WAAW,QAAQ,MAAM,MAAM;CACpD,CAAC,CACL;CAEA,MAAM,YAAY,eAAe,sBAAsB,MAAM,KAAK,CAAC;CAEnE,SAAS,SAAS,GAAU;EACxB,WAAY,EAAE,OAA4B,OAAO;CACrD;CAEA,OAAO;EACH;EACA;EACA;EACA;CACJ;AACJ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ECAA,MAAM,QAAQ;EAOd,MAAM,OAAO;EAIb,MAAM,EAAE,SAAS,WAAW,WAAW,aAAa,YAAY,QAAQ,UAAU;GAC9E,KAAK,qBAAqB,KAAK;EACnC,CAAC;;;;SAnCY,WAAM,MAAE,MAAA,QAAA,CAAQ,CAAA,CAAA,CAAA;;;;;;;iBApBb,MAAA,SAAA,CAAS;iBACT,MAAA,SAAA,CAAS;gBAChB,iBAAe,qBAAoB,KAAA,CAAS;gBAC5C,cAAY,iBAAa,kBAAqB,cAAU,YAAA,WAAA;eAGpD,MAAI,SAAO,EAAA;eACX,QAAM,QAAA,IAAI;eAGV,WAAS,WAAU;eACnB,YAAU,qBAAoB,KAAA,CAAS;eACvC,YAAU,qBAAoB,KAAA,CAAS;eACvC,iBAAe,cAAa;eAC5B,gBAAc,iBAAa,UAAa,WAAU;eAClD,cAAY,QAAA,aAAa,KAAA,CAAS;eAClC,mBAAiB,SAAO,cAAA;eACxB,oBAAkB,SAAO,eAAA;eACzB,gBAAc,SAAO,WAAY,KAAA,CAAS;eAC1C,iBAAe,qBAAoB,KAAA,CAAS;;;;GAIjC,MAAK;GAAmB,MAAK;;yBACpB,QAAA,qBAAa;uDAAc,OAAM,oBAAmB,CAAA;oBAAjC,OAAO;;2BACrB,QAAA,kBAAU;uDAAc,OAAM,oBAAmB,CAAA;oBAAjC,OAAO;;;;;iBAGzC,OAAM,eAAA"}
|
package/dist/collapse.js.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"collapse.js","names":[],"sources":["../src/components/collapse/collapse.vue","../src/components/collapse/collapse.vue"],"sourcesContent":["<template>\n <div v-bind=\"rootProps\">\n <slot name=\"trigger\" v-bind=\"triggerSlotProps\" />\n\n <Transition name=\"rp-collapse-content\">\n <section v-if=\"shouldRenderContent\" v-show=\"isOpen\" v-bind=\"contentProps\">\n <div class=\"rp-collapse__inner\">\n <slot v-bind=\"contentSlotProps\" />\n </div>\n </section>\n </Transition>\n </div>\n</template>\n\n<script lang=\"ts\" setup vapor>\nimport { useCollapse } from './useCollapse';\nimport type { CollapseProps } from './types';\n\ndefineOptions({ name: 'RpCollapse' });\n\nconst props = withDefaults(defineProps<CollapseProps>(), {\n open: undefined,\n defaultOpen: false,\n disabled: false,\n unmountOnExit: false,\n role: 'region',\n});\n\nconst emit = defineEmits<{\n 'update:open': [value: boolean];\n}>();\n\nconst { isOpen, shouldRenderContent, rootProps, contentProps, triggerSlotProps, contentSlotProps } =\n useCollapse(props, (open) => {\n emit('update:open', open);\n });\n</script>\n\n<style src=\"./collapse.scss\" lang=\"scss\" scoped></style>\n","<template>\n <div v-bind=\"rootProps\">\n <slot name=\"trigger\" v-bind=\"triggerSlotProps\" />\n\n <Transition name=\"rp-collapse-content\">\n <section v-if=\"shouldRenderContent\" v-show=\"isOpen\" v-bind=\"contentProps\">\n <div class=\"rp-collapse__inner\">\n <slot v-bind=\"contentSlotProps\" />\n </div>\n </section>\n </Transition>\n </div>\n</template>\n\n<script lang=\"ts\" setup vapor>\nimport { useCollapse } from './useCollapse';\nimport type { CollapseProps } from './types';\n\ndefineOptions({ name: 'RpCollapse' });\n\nconst props = withDefaults(defineProps<CollapseProps>(), {\n open: undefined,\n defaultOpen: false,\n disabled: false,\n unmountOnExit: false,\n role: 'region',\n});\n\nconst emit = defineEmits<{\n 'update:open': [value: boolean];\n}>();\n\nconst { isOpen, shouldRenderContent, rootProps, contentProps, triggerSlotProps, contentSlotProps } =\n useCollapse(props, (open) => {\n emit('update:open', open);\n });\n</script>\n\n<style src=\"./collapse.scss\" lang=\"scss\" scoped></style>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAoBA,MAAM,QAAQ;EAQd,MAAM,OAAO;EAIb,MAAM,EAAE,QAAQ,qBAAqB,WAAW,cAAc,kBAAkB,qBAC5E,YAAY,QAAQ,SAAS;GACzB,KAAK,eAAe,IAAI;EAC5B,CAAC;;0CAlCY,MAAA,SAAA,CAAS,CAAA,CAAA;;aACZ,WAAc,EAAA,GAAA,OAAS,MAAA,gBAAA,CAAA,EAAA,GAAA,MAAA,CAAA;;;GAEjB,MAAK;GAAjB,WAMa;;yBALM,MAAA,mBAAA,SAAmB;;;4CAA0B,MAAA,YAAA,CAAY,CAAA,CAAA;;sCAElD,MAAA,gBAAA,CAAA,EAAA,GAAA,MAAA,CAAA;yBAFsB,MAAA,MAAA,CAAM"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"componentColors.js","names":[],"sources":["../src/utils/componentColors.ts"],"sourcesContent":["export const componentColors = [\n 'primary',\n 'secondary',\n 'success',\n 'warning',\n 'danger',\n 'info',\n 'neutral',\n] as const;\n\nexport type ComponentColor = (typeof componentColors)[number];\n\nexport type ComponentColorValue = ComponentColor | (string & {});\n\nconst componentColorNames = new Set<string>(componentColors);\n\nexport function isComponentPresetColor(\n color: ComponentColorValue | undefined,\n): color is ComponentColor {\n return Boolean(color && componentColorNames.has(color));\n}\n\nexport function getComponentCustomColor(color: ComponentColorValue | undefined) {\n if (!color || isComponentPresetColor(color)) return undefined;\n\n return color;\n}\n"],"mappings":";AAAA,IAAa,kBAAkB;CAC3B;CACA;CACA;CACA;CACA;CACA;CACA;AACJ;AAMA,IAAM,sBAAsB,IAAI,IAAY,eAAe;AAE3D,SAAgB,uBACZ,OACuB;CACvB,OAAO,QAAQ,SAAS,oBAAoB,IAAI,KAAK,CAAC;AAC1D;AAEA,SAAgB,wBAAwB,OAAwC;CAC5E,IAAI,CAAC,SAAS,uBAAuB,KAAK,GAAG,OAAO,KAAA;CAEpD,OAAO;AACX"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"dropdown-menu.js","names":[],"sources":["../src/components/dropdown-menu/dropdown-menu-items.ts","../src/components/dropdown-menu/dropdown-menu-utils.ts","../src/components/dropdown-menu/useDropdownMenuDisclosure.ts","../src/components/dropdown-menu/useDropdownMenuDom.ts","../src/components/dropdown-menu/useDropdownMenuHoverIntent.ts","../src/components/dropdown-menu/useDropdownMenuInteractions.ts","../src/components/dropdown-menu/useDropdownMenuNavigation.ts","../src/components/dropdown-menu/useDropdownMenuRenderItems.ts","../src/components/dropdown-menu/useDropdownSubmenus.ts","../src/components/dropdown-menu/useDropdownMenu.ts","../src/components/dropdown-menu/dropdown-menu.vue","../src/components/dropdown-menu/dropdown-menu.vue"],"sourcesContent":["import { defineComponent, h, type PropType } from 'vue';\nimport type { DropdownMenuItemSlotProps, DropdownMenuRenderedItem } from './types';\n\nexport default defineComponent({\n name: 'RpDropdownMenuItems',\n props: {\n items: {\n type: Array as PropType<DropdownMenuRenderedItem[]>,\n required: true,\n },\n },\n setup(props, { slots }) {\n function renderItems(items: DropdownMenuRenderedItem[]) {\n return items.map((renderedItem) => {\n const children = [\n h(\n 'button',\n renderedItem.props,\n slots.item?.(renderedItem.slotProps as DropdownMenuItemSlotProps),\n ),\n ];\n\n if (renderedItem.hasSubmenu && renderedItem.submenuOpen) {\n children.push(\n h('div', renderedItem.submenuProps, renderItems(renderedItem.children)),\n );\n }\n\n return h(\n 'div',\n {\n key: renderedItem.key,\n class: 'rp-dropdown-menu__item-wrap',\n role: 'none',\n },\n children,\n );\n });\n }\n\n return () => renderItems(props.items);\n },\n});\n","import { bem } from '@/utils/bem';\nimport type {\n DropdownMenuFocusTarget,\n DropdownMenuItem,\n DropdownMenuItemPath,\n DropdownMenuOpenOptions,\n DropdownMenuPlacement,\n} from './types';\n\nexport const DEFAULT_PLACEMENT: DropdownMenuPlacement = 'bottom-start';\nexport const DEFAULT_FOCUS_TARGET: DropdownMenuFocusTarget = 'first';\n\nexport type ItemPath = DropdownMenuItemPath;\nexport type SubmenuFocusTarget = DropdownMenuFocusTarget | false;\n\nexport type PointerPoint = {\n x: number;\n y: number;\n};\n\nexport function getOpenFocusTarget(\n options: DropdownMenuOpenOptions | DropdownMenuFocusTarget | undefined,\n) {\n if (typeof options === 'string') return options;\n return options?.focus ?? DEFAULT_FOCUS_TARGET;\n}\n\nexport function getItemClass(\n item: DropdownMenuItem,\n focused: boolean,\n disabled: boolean,\n hasSubmenu: boolean,\n submenuOpen: boolean,\n) {\n return bem('rp-dropdown-menu__item', {\n focused,\n disabled,\n destructive: item.destructive,\n submenu: hasSubmenu,\n open: submenuOpen,\n });\n}\n\nexport function hasItemSubmenu(item: DropdownMenuItem) {\n return (item.children?.length ?? 0) > 0;\n}\n\nexport function hasNestedItems(items: DropdownMenuItem[]): boolean {\n return items.some((item) => hasItemSubmenu(item) || hasNestedItems(item.children ?? []));\n}\n\nexport function getPathKey(path: ItemPath) {\n return path.length === 0 ? 'root' : path.join('-');\n}\n\nexport function getParentPath(path: ItemPath) {\n return path.slice(0, -1);\n}\n\nexport function arePathsEqual(a: ItemPath, b: ItemPath) {\n return a.length === b.length && a.every((part, index) => part === b[index]);\n}\n\nexport function isPathPrefix(prefix: ItemPath, path: ItemPath) {\n return prefix.length <= path.length && prefix.every((part, index) => part === path[index]);\n}\n\nexport function normalizePath(indexOrPath: number | ItemPath): ItemPath {\n return Array.isArray(indexOrPath) ? indexOrPath : [indexOrPath];\n}\n\nexport function getEventPoint(event: MouseEvent): PointerPoint {\n return {\n x: event.clientX,\n y: event.clientY,\n };\n}\n\nexport function hasMeasuredRect(rect: DOMRect) {\n return rect.width > 0 || rect.height > 0;\n}\n\nexport function isPointInRect(point: PointerPoint, rect: DOMRect, padding = 0) {\n return (\n point.x >= rect.left - padding &&\n point.x <= rect.right + padding &&\n point.y >= rect.top - padding &&\n point.y <= rect.bottom + padding\n );\n}\n\nexport function getEnabledIndexes(items: DropdownMenuItem[]) {\n return items.map((item, index) => (item.disabled ? -1 : index)).filter((index) => index >= 0);\n}\n\nexport function getNextEnabledIndex(items: DropdownMenuItem[], index: number, direction: 1 | -1) {\n const enabledIndexes = getEnabledIndexes(items);\n if (enabledIndexes.length === 0) return undefined;\n\n if (direction === 1) {\n return enabledIndexes.find((candidate) => candidate > index) ?? enabledIndexes[0];\n }\n\n for (let i = enabledIndexes.length - 1; i >= 0; i -= 1) {\n const candidate = enabledIndexes[i]!;\n if (candidate < index) return candidate;\n }\n\n return enabledIndexes[enabledIndexes.length - 1];\n}\n","import { watch, type Ref } from 'vue';\nimport { useClickOutside } from '@/composables/useClickOutside';\nimport type {\n DropdownMenuCloseOptions,\n DropdownMenuFocusTarget,\n DropdownMenuItem,\n DropdownMenuOpenOptions,\n DropdownMenuProps,\n} from './types';\nimport { DEFAULT_FOCUS_TARGET, getOpenFocusTarget, type ItemPath } from './dropdown-menu-utils';\n\ntype BooleanSource = Readonly<Ref<boolean>>;\n\ntype UseDropdownMenuDisclosureOptions = {\n props: Readonly<DropdownMenuProps>;\n emit: {\n openChange?: (open: boolean) => void;\n select?: (item: DropdownMenuItem) => void;\n };\n rootRef: Ref<HTMLElement | null>;\n uncontrolledOpen: Ref<boolean>;\n isDisabled: BooleanSource;\n isOpen: BooleanSource;\n isVisible: BooleanSource;\n focusedPath: Ref<ItemPath>;\n resetFocus: () => void;\n resetSubmenus: () => void;\n resetHoverIntent: () => void;\n focusItem: (target: DropdownMenuFocusTarget, menuPath?: ItemPath) => boolean;\n focusMenu: () => void;\n focusTrigger: () => void;\n};\n\nexport function useDropdownMenuDisclosure({\n props,\n emit,\n rootRef,\n uncontrolledOpen,\n isDisabled,\n isOpen,\n isVisible,\n focusedPath,\n resetFocus,\n resetSubmenus,\n resetHoverIntent,\n focusItem,\n focusMenu,\n focusTrigger,\n}: UseDropdownMenuDisclosureOptions) {\n function setOpen(nextOpen: boolean) {\n if (nextOpen && isDisabled.value) return;\n\n const previousOpen = isOpen.value;\n if (props.open === undefined) uncontrolledOpen.value = nextOpen;\n if (previousOpen !== nextOpen) emit.openChange?.(nextOpen);\n }\n\n function resetMenuFocus() {\n resetFocus();\n resetSubmenus();\n resetHoverIntent();\n }\n\n function open(options?: DropdownMenuOpenOptions | DropdownMenuFocusTarget) {\n if (isDisabled.value) return;\n\n setOpen(true);\n focusItem(getOpenFocusTarget(options));\n resetSubmenus();\n resetHoverIntent();\n focusMenu();\n }\n\n function close(options: DropdownMenuCloseOptions = {}) {\n setOpen(false);\n resetMenuFocus();\n if (options.focusTrigger) focusTrigger();\n }\n\n function toggle() {\n if (isVisible.value) {\n close({ focusTrigger: true });\n } else {\n open();\n }\n }\n\n watch(isDisabled, (disabled) => {\n if (disabled) close();\n });\n\n watch(isVisible, (visible) => {\n if (visible) {\n if (focusedPath.value.length === 0) focusItem(DEFAULT_FOCUS_TARGET);\n focusMenu();\n } else {\n resetMenuFocus();\n }\n });\n\n useClickOutside(rootRef, isVisible, () => close());\n\n return {\n open,\n close,\n toggle,\n resetMenuFocus,\n };\n}\n","import { computed, nextTick, watch, type Ref } from 'vue';\nimport type { DropdownMenuPlacement } from './types';\nimport {\n arePathsEqual,\n getParentPath,\n getPathKey,\n hasMeasuredRect,\n normalizePath,\n type ItemPath,\n} from './dropdown-menu-utils';\n\ntype StringSource = {\n readonly value: string;\n};\ntype PlacementSource = {\n readonly value: DropdownMenuPlacement;\n};\n\ntype UseDropdownMenuDomOptions = {\n menuId: StringSource;\n rootRef: Ref<HTMLElement | null>;\n menuRef: Ref<HTMLElement | null>;\n placement: PlacementSource;\n focusedPath: Ref<ItemPath>;\n};\n\nexport function useDropdownMenuDom({\n menuId,\n rootRef,\n menuRef,\n placement,\n focusedPath,\n}: UseDropdownMenuDomOptions) {\n const activeDescendantId = computed(() =>\n focusedPath.value.length === 0 ? undefined : getItemId(focusedPath.value),\n );\n\n function focusMenu() {\n nextTick(() => menuRef.value?.focus());\n }\n\n function focusTrigger() {\n nextTick(() => {\n const trigger = rootRef.value?.querySelector<HTMLElement>('[aria-haspopup=\"menu\"]');\n trigger?.focus();\n });\n }\n\n function getItemId(indexOrPath: number | ItemPath) {\n return `${menuId.value}-item-${getPathKey(normalizePath(indexOrPath))}`;\n }\n\n function getSubmenuId(path: ItemPath) {\n return `${menuId.value}-submenu-${getPathKey(path)}`;\n }\n\n function getItemElement(path: ItemPath) {\n return document.getElementById(getItemId(path));\n }\n\n function getSubmenuElement(path: ItemPath) {\n return document.getElementById(getSubmenuId(path));\n }\n\n function isSubmenuOpeningLeft(path: ItemPath) {\n const submenuRect = getSubmenuElement(path)?.getBoundingClientRect();\n const itemRect = getItemElement(path)?.getBoundingClientRect();\n\n if (submenuRect && itemRect && hasMeasuredRect(submenuRect) && hasMeasuredRect(itemRect)) {\n return submenuRect.right <= itemRect.left;\n }\n\n return placement.value.endsWith('end');\n }\n\n function getMenuActiveDescendant(menuPath: ItemPath) {\n return arePathsEqual(getParentPath(focusedPath.value), menuPath)\n ? getItemId(focusedPath.value)\n : undefined;\n }\n\n watch(focusedPath, (path) => {\n if (path.length === 0) return;\n\n const targetPath = [...path];\n nextTick(() => {\n if (!arePathsEqual(targetPath, focusedPath.value)) return;\n getItemElement(targetPath)?.scrollIntoView?.({ block: 'nearest' });\n });\n });\n\n return {\n activeDescendantId,\n focusMenu,\n focusTrigger,\n getItemId,\n getSubmenuId,\n getItemElement,\n getSubmenuElement,\n isSubmenuOpeningLeft,\n getMenuActiveDescendant,\n };\n}\n","import { onUnmounted, ref, type Ref } from 'vue';\nimport type { DropdownMenuItem } from './types';\nimport {\n arePathsEqual,\n getEventPoint,\n hasMeasuredRect,\n isPathPrefix,\n isPointInRect,\n type ItemPath,\n type PointerPoint,\n} from './dropdown-menu-utils';\n\nconst SAFE_TRIANGLE_PADDING = 2;\nconst SAFE_TRIANGLE_ORIGIN_OFFSET = 2;\nconst SAFE_TRIANGLE_TIMEOUT = 400;\n\nexport type SafeTriangle = [PointerPoint, PointerPoint, PointerPoint];\ntype GetSafeTriangleOptions = {\n itemRect: DOMRect | null;\n submenuRect: DOMRect;\n origin: PointerPoint;\n};\ntype PendingHover = {\n item: DropdownMenuItem;\n path: ItemPath;\n};\ntype HoverCommit = (item: DropdownMenuItem, path: ItemPath, point?: PointerPoint) => void;\n\ntype UseDropdownMenuHoverIntentOptions = {\n openSubmenuPath: Ref<ItemPath>;\n getItemElement: (path: ItemPath) => HTMLElement | null;\n getSubmenuElement: (path: ItemPath) => HTMLElement | null;\n};\n\nfunction getTriangleArea(a: PointerPoint, b: PointerPoint, c: PointerPoint) {\n return Math.abs((a.x * (b.y - c.y) + b.x * (c.y - a.y) + c.x * (a.y - b.y)) / 2);\n}\n\nfunction isPointInTriangle(point: PointerPoint, triangle: SafeTriangle) {\n const [a, b, c] = triangle;\n const area = getTriangleArea(a, b, c);\n const area1 = getTriangleArea(point, b, c);\n const area2 = getTriangleArea(a, point, c);\n const area3 = getTriangleArea(a, b, point);\n\n return Math.abs(area - (area1 + area2 + area3)) < 0.5;\n}\n\nfunction clamp(value: number, min: number, max: number) {\n return Math.min(Math.max(value, min), max);\n}\n\nfunction clampPointToRect(point: PointerPoint, rect: DOMRect): PointerPoint {\n return {\n x: clamp(point.x, rect.left, rect.right),\n y: clamp(point.y, rect.top, rect.bottom),\n };\n}\n\nexport function getDropdownMenuSafeTriangle({\n itemRect,\n submenuRect,\n origin,\n}: GetSafeTriangleOptions): SafeTriangle {\n const measuredItemRect = itemRect && hasMeasuredRect(itemRect) ? itemRect : null;\n const opensRight = !measuredItemRect || submenuRect.left >= measuredItemRect.right;\n const edgeX = opensRight ? submenuRect.left : submenuRect.right;\n const boundedOrigin = measuredItemRect ? clampPointToRect(origin, measuredItemRect) : origin;\n const expandedOrigin = {\n x:\n boundedOrigin.x +\n (opensRight ? -SAFE_TRIANGLE_ORIGIN_OFFSET : SAFE_TRIANGLE_ORIGIN_OFFSET),\n y: boundedOrigin.y,\n };\n\n return [\n expandedOrigin,\n {\n x: edgeX,\n y: submenuRect.top - SAFE_TRIANGLE_PADDING,\n },\n {\n x: edgeX,\n y: submenuRect.bottom + SAFE_TRIANGLE_PADDING,\n },\n ];\n}\n\nexport function useDropdownMenuHoverIntent({\n openSubmenuPath,\n getItemElement,\n getSubmenuElement,\n}: UseDropdownMenuHoverIntentOptions) {\n const safeTriangleOrigin = ref<PointerPoint | null>(null);\n let latestPointerPoint: PointerPoint | null = null;\n let pendingHover: PendingHover | null = null;\n let pendingHoverTimer: number | undefined;\n\n function clearPendingHover() {\n pendingHover = null;\n if (pendingHoverTimer !== undefined) {\n window.clearTimeout(pendingHoverTimer);\n pendingHoverTimer = undefined;\n }\n }\n\n function resetHoverIntent() {\n safeTriangleOrigin.value = null;\n latestPointerPoint = null;\n clearPendingHover();\n }\n\n function getFallbackTriangleOrigin(path: ItemPath): PointerPoint | null {\n const itemRect = getItemElement(path)?.getBoundingClientRect();\n if (!itemRect) return null;\n\n const submenuRect = getSubmenuElement(path)?.getBoundingClientRect();\n const opensRight = !submenuRect || submenuRect.left >= itemRect.right;\n return {\n x: opensRight ? itemRect.right : itemRect.left,\n y: itemRect.top + itemRect.height / 2,\n };\n }\n\n function trackSubmenuOpen(path: ItemPath, point?: PointerPoint) {\n safeTriangleOrigin.value = point ?? getFallbackTriangleOrigin(path);\n clearPendingHover();\n }\n\n function isPointInCurrentSubmenu(point: PointerPoint) {\n if (openSubmenuPath.value.length === 0) return false;\n\n const submenuRect = getSubmenuElement(openSubmenuPath.value)?.getBoundingClientRect();\n return submenuRect ? isPointInRect(point, submenuRect, SAFE_TRIANGLE_PADDING) : false;\n }\n\n function getSafeTriangle(path: ItemPath): SafeTriangle | null {\n const submenuRect = getSubmenuElement(path)?.getBoundingClientRect();\n const itemRect = getItemElement(path)?.getBoundingClientRect();\n const origin = safeTriangleOrigin.value ?? getFallbackTriangleOrigin(path);\n\n if (!submenuRect || !origin) return null;\n\n return getDropdownMenuSafeTriangle({\n itemRect: itemRect ?? null,\n submenuRect,\n origin,\n });\n }\n\n function updateSafeTriangleOrigin(point: PointerPoint) {\n if (openSubmenuPath.value.length === 0) return;\n\n const itemRect = getItemElement(openSubmenuPath.value)?.getBoundingClientRect();\n if (itemRect && isPointInRect(point, itemRect)) {\n safeTriangleOrigin.value = point;\n }\n }\n\n function shouldDelayHover(path: ItemPath, point: PointerPoint) {\n if (openSubmenuPath.value.length === 0) return false;\n if (arePathsEqual(path, openSubmenuPath.value)) return false;\n if (isPathPrefix(openSubmenuPath.value, path)) return false;\n if (isPointInCurrentSubmenu(point)) return true;\n\n const triangle = getSafeTriangle(openSubmenuPath.value);\n return triangle ? isPointInTriangle(point, triangle) : false;\n }\n\n function delayHoveredItem(item: DropdownMenuItem, path: ItemPath, commit: HoverCommit) {\n pendingHover = {\n item,\n path,\n };\n\n if (pendingHoverTimer !== undefined) window.clearTimeout(pendingHoverTimer);\n pendingHoverTimer = window.setTimeout(() => {\n if (!pendingHover) return;\n\n const nextHover = pendingHover;\n if (latestPointerPoint && isPointInCurrentSubmenu(latestPointerPoint)) {\n clearPendingHover();\n return;\n }\n\n commit(nextHover.item, nextHover.path);\n }, SAFE_TRIANGLE_TIMEOUT);\n }\n\n function handleItemHover(\n item: DropdownMenuItem,\n path: ItemPath,\n event: MouseEvent | undefined,\n commit: HoverCommit,\n ) {\n const point = event ? getEventPoint(event) : undefined;\n latestPointerPoint = point ?? latestPointerPoint;\n\n if (point && shouldDelayHover(path, point)) {\n delayHoveredItem(item, path, commit);\n return;\n }\n\n commit(item, path, point);\n }\n\n function handleMenuMousemove(event: MouseEvent, commit: HoverCommit) {\n const point = getEventPoint(event);\n latestPointerPoint = point;\n updateSafeTriangleOrigin(point);\n if (!pendingHover) return;\n\n if (shouldDelayHover(pendingHover.path, point)) return;\n\n const nextHover = pendingHover;\n commit(nextHover.item, nextHover.path, point);\n }\n\n onUnmounted(clearPendingHover);\n\n return {\n clearPendingHover,\n resetHoverIntent,\n trackSubmenuOpen,\n handleItemHover,\n handleMenuMousemove,\n };\n}\n","import type { Ref } from 'vue';\nimport type {\n DropdownMenuCloseOptions,\n DropdownMenuFocusTarget,\n DropdownMenuItem,\n DropdownMenuOpenOptions,\n DropdownMenuProps,\n} from './types';\nimport {\n arePathsEqual,\n DEFAULT_FOCUS_TARGET,\n getEventPoint,\n getParentPath,\n hasItemSubmenu,\n normalizePath,\n type ItemPath,\n type PointerPoint,\n type SubmenuFocusTarget,\n} from './dropdown-menu-utils';\n\ntype BooleanSource = Readonly<Ref<boolean>>;\n\ntype DisclosureControls = {\n open: (options?: DropdownMenuOpenOptions | DropdownMenuFocusTarget) => void;\n close: (options?: DropdownMenuCloseOptions) => void;\n toggle: () => void;\n};\n\ntype SubmenuControls = {\n closeSubmenusAfter: (menuPath: ItemPath) => void;\n openSubmenu: (path: ItemPath, focus?: SubmenuFocusTarget) => boolean;\n closeSubmenu: (path: ItemPath) => boolean;\n closeCurrentSubmenu: () => boolean;\n};\n\ntype HoverIntentControls = {\n clearPendingHover: () => void;\n resetHoverIntent: () => void;\n trackSubmenuOpen: (path: ItemPath, point?: PointerPoint) => void;\n handleItemHover: (\n item: DropdownMenuItem,\n path: ItemPath,\n event: MouseEvent | undefined,\n commit: (item: DropdownMenuItem, path: ItemPath, point?: PointerPoint) => void,\n ) => void;\n handleMenuMousemove: (\n event: MouseEvent,\n commit: (item: DropdownMenuItem, path: ItemPath, point?: PointerPoint) => void,\n ) => void;\n};\n\ntype UseDropdownMenuInteractionsOptions = {\n props: Readonly<DropdownMenuProps>;\n emit: {\n select?: (item: DropdownMenuItem) => void;\n };\n isDisabled: BooleanSource;\n focusedPath: Ref<ItemPath>;\n openSubmenuPath: Ref<ItemPath>;\n getItemAtPath: (path: ItemPath) => DropdownMenuItem | undefined;\n focusItem: (target: DropdownMenuFocusTarget, menuPath?: ItemPath) => boolean;\n moveFocus: (direction: 1 | -1) => ItemPath | undefined;\n submenus: SubmenuControls;\n hoverIntent: HoverIntentControls;\n disclosure: DisclosureControls;\n isSubmenuOpeningLeft: (path: ItemPath) => boolean;\n};\n\nexport function useDropdownMenuInteractions({\n props,\n emit,\n isDisabled,\n focusedPath,\n openSubmenuPath,\n getItemAtPath,\n focusItem,\n moveFocus,\n submenus,\n hoverIntent,\n disclosure,\n isSubmenuOpeningLeft,\n}: UseDropdownMenuInteractionsOptions) {\n function activateItem(item: DropdownMenuItem, path: ItemPath, event?: MouseEvent) {\n if (item.disabled) return;\n\n if (hasItemSubmenu(item)) {\n openSubmenu(path, DEFAULT_FOCUS_TARGET, event ? getEventPoint(event) : undefined);\n return;\n }\n\n selectItem(item);\n }\n\n function selectItem(item: DropdownMenuItem) {\n if (item.disabled) return;\n\n emit.select?.(item);\n if (props.closeOnSelect !== false) {\n disclosure.close({ focusTrigger: true });\n }\n }\n\n function closeSubmenusAfter(menuPath: ItemPath) {\n submenus.closeSubmenusAfter(menuPath);\n hoverIntent.resetHoverIntent();\n }\n\n function openSubmenu(\n path: ItemPath,\n focus: SubmenuFocusTarget = DEFAULT_FOCUS_TARGET,\n point?: PointerPoint,\n ) {\n const opened = submenus.openSubmenu(path, focus);\n if (opened) hoverIntent.trackSubmenuOpen(path, point);\n return opened;\n }\n\n function closeSubmenu(path: ItemPath) {\n const closed = submenus.closeSubmenu(path);\n if (closed) hoverIntent.resetHoverIntent();\n return closed;\n }\n\n function closeCurrentSubmenu() {\n const closed = submenus.closeCurrentSubmenu();\n if (closed) hoverIntent.resetHoverIntent();\n return closed;\n }\n\n function commitHoveredItem(item: DropdownMenuItem, path: ItemPath, point?: PointerPoint) {\n hoverIntent.clearPendingHover();\n focusedPath.value = [...path];\n\n if (hasItemSubmenu(item)) {\n openSubmenu(path, false, point);\n } else {\n closeSubmenusAfter(getParentPath(path));\n }\n }\n\n function focusHoveredItem(\n item: DropdownMenuItem,\n indexOrPath: number | ItemPath,\n event?: MouseEvent,\n ) {\n if (item.disabled) return;\n\n const path = normalizePath(indexOrPath);\n hoverIntent.handleItemHover(item, path, event, commitHoveredItem);\n }\n\n function selectFocusedItem() {\n const item = getItemAtPath(focusedPath.value);\n if (!item) return;\n activateItem(item, focusedPath.value);\n }\n\n function moveFocusedItem(direction: 1 | -1) {\n const menuPath = moveFocus(direction);\n if (menuPath) closeSubmenusAfter(menuPath);\n }\n\n function onTriggerClick() {\n disclosure.toggle();\n }\n\n function onTriggerKeydown(event: KeyboardEvent) {\n if (isDisabled.value) return;\n\n switch (event.key) {\n case 'Enter':\n case ' ':\n case 'ArrowDown':\n event.preventDefault();\n disclosure.open();\n break;\n case 'ArrowUp':\n event.preventDefault();\n disclosure.open({ focus: 'last' });\n break;\n case 'Escape':\n disclosure.close({ focusTrigger: true });\n break;\n }\n }\n\n function onMenuKeydown(event: KeyboardEvent) {\n hoverIntent.resetHoverIntent();\n\n switch (event.key) {\n case 'ArrowDown':\n event.preventDefault();\n moveFocusedItem(1);\n break;\n case 'ArrowUp':\n event.preventDefault();\n moveFocusedItem(-1);\n break;\n case 'Home':\n event.preventDefault();\n focusItem('first', getParentPath(focusedPath.value));\n break;\n case 'End':\n event.preventDefault();\n focusItem('last', getParentPath(focusedPath.value));\n break;\n case 'ArrowRight':\n case 'ArrowLeft':\n onMenuHorizontalKeydown(event);\n break;\n case 'Enter':\n case ' ':\n event.preventDefault();\n selectFocusedItem();\n break;\n case 'Escape':\n event.preventDefault();\n if (!closeCurrentSubmenu()) disclosure.close({ focusTrigger: true });\n break;\n case 'Tab':\n disclosure.close();\n break;\n }\n }\n\n function onMenuHorizontalKeydown(event: KeyboardEvent) {\n const isRight = event.key === 'ArrowRight';\n const currentMenuPath = getParentPath(focusedPath.value);\n const closePath =\n focusedPath.value.length > 1\n ? currentMenuPath\n : arePathsEqual(focusedPath.value, openSubmenuPath.value)\n ? focusedPath.value\n : undefined;\n\n if (closePath && isRight === isSubmenuOpeningLeft(closePath)) {\n event.preventDefault();\n closeSubmenu(closePath);\n return;\n }\n\n const item = getItemAtPath(focusedPath.value);\n if (!item || item.disabled || !hasItemSubmenu(item)) return;\n\n const nextSubmenuOpensLeft = isSubmenuOpeningLeft(focusedPath.value);\n if (isRight === nextSubmenuOpensLeft) return;\n\n event.preventDefault();\n openSubmenu(focusedPath.value);\n }\n\n function onMenuMousemove(event: MouseEvent) {\n hoverIntent.handleMenuMousemove(event, commitHoveredItem);\n }\n\n function onMenuMouseleave() {\n hoverIntent.resetHoverIntent();\n }\n\n return {\n activateItem,\n selectItem,\n openSubmenu,\n closeSubmenu,\n focusHoveredItem,\n onTriggerClick,\n onTriggerKeydown,\n onMenuKeydown,\n onMenuMousemove,\n onMenuMouseleave,\n };\n}\n","import { computed, ref } from 'vue';\nimport type { DropdownMenuFocusTarget, DropdownMenuItem } from './types';\nimport {\n arePathsEqual,\n getEnabledIndexes,\n getNextEnabledIndex,\n getParentPath,\n normalizePath,\n type ItemPath,\n} from './dropdown-menu-utils';\n\ntype DropdownMenuItemsSource = {\n readonly value: DropdownMenuItem[];\n};\n\nexport function useDropdownMenuNavigation(items: DropdownMenuItemsSource) {\n const focusedPath = ref<ItemPath>([]);\n const focusedIndex = computed(() => focusedPath.value[0] ?? -1);\n\n function getItemsAtPath(path: ItemPath) {\n let currentItems = items.value;\n for (const index of path) {\n const item = currentItems[index];\n if (!item) return [];\n currentItems = item.children ?? [];\n }\n return currentItems;\n }\n\n function getItemAtPath(path: ItemPath) {\n if (path.length === 0) return undefined;\n const parentItems = getItemsAtPath(getParentPath(path));\n return parentItems[path[path.length - 1]];\n }\n\n function focusItem(target: DropdownMenuFocusTarget, menuPath: ItemPath = []) {\n const enabledIndexes = getEnabledIndexes(getItemsAtPath(menuPath));\n const index =\n target === 'last' ? enabledIndexes[enabledIndexes.length - 1] : enabledIndexes[0];\n\n if (index === undefined) {\n if (menuPath.length === 0) focusedPath.value = [];\n return false;\n }\n\n focusedPath.value = [...menuPath, index];\n return true;\n }\n\n function resetFocus() {\n focusedPath.value = [];\n }\n\n function isItemFocused(indexOrPath: number | ItemPath) {\n return arePathsEqual(normalizePath(indexOrPath), focusedPath.value);\n }\n\n function moveFocus(direction: 1 | -1) {\n const menuPath = getParentPath(focusedPath.value);\n const itemsAtPath = getItemsAtPath(menuPath);\n const currentIndex =\n focusedPath.value.length === 0\n ? direction === 1\n ? -1\n : itemsAtPath.length\n : focusedPath.value[focusedPath.value.length - 1]!;\n const nextIndex = getNextEnabledIndex(itemsAtPath, currentIndex, direction);\n\n if (nextIndex === undefined) {\n focusedPath.value = [];\n return undefined;\n }\n\n focusedPath.value = [...menuPath, nextIndex];\n return menuPath;\n }\n\n return {\n focusedPath,\n focusedIndex,\n getItemsAtPath,\n getItemAtPath,\n focusItem,\n resetFocus,\n isItemFocused,\n moveFocus,\n };\n}\n","import { computed } from 'vue';\nimport { bem } from '@/utils/bem';\nimport type {\n DropdownMenuCloseOptions,\n DropdownMenuFocusTarget,\n DropdownMenuItem,\n DropdownMenuItemProps,\n DropdownMenuItemSlotProps,\n DropdownMenuRenderedItem,\n DropdownMenuSubmenuProps,\n} from './types';\nimport {\n DEFAULT_FOCUS_TARGET,\n getItemClass,\n getPathKey,\n hasItemSubmenu,\n hasNestedItems,\n normalizePath,\n type ItemPath,\n} from './dropdown-menu-utils';\n\ntype DropdownMenuItemsSource = {\n readonly value: DropdownMenuItem[];\n};\n\ntype UseDropdownMenuRenderItemsOptions = {\n items: DropdownMenuItemsSource;\n getItemId: (path: ItemPath) => string;\n getSubmenuId: (path: ItemPath) => string;\n getMenuActiveDescendant: (path: ItemPath) => string | undefined;\n isItemFocused: (indexOrPath: number | ItemPath) => boolean;\n isSubmenuOpen: (path: ItemPath) => boolean;\n activateItem: (item: DropdownMenuItem, path: ItemPath, event?: MouseEvent) => void;\n focusHoveredItem: (\n item: DropdownMenuItem,\n indexOrPath: number | ItemPath,\n event?: MouseEvent,\n ) => void;\n selectItem: (item: DropdownMenuItem) => void;\n openSubmenu: (path: ItemPath, focus?: DropdownMenuFocusTarget) => void;\n closeSubmenu: (path: ItemPath) => void;\n close: (options?: DropdownMenuCloseOptions) => void;\n};\n\nexport function useDropdownMenuRenderItems({\n items,\n getItemId,\n getSubmenuId,\n getMenuActiveDescendant,\n isItemFocused,\n isSubmenuOpen,\n activateItem,\n focusHoveredItem,\n selectItem,\n openSubmenu,\n closeSubmenu,\n close,\n}: UseDropdownMenuRenderItemsOptions) {\n const renderedItems = computed<DropdownMenuRenderedItem[]>(() => getRenderedItems(items.value));\n\n function getRenderedItems(\n dropdownItems: DropdownMenuItem[],\n parentPath: ItemPath = [],\n ): DropdownMenuRenderedItem[] {\n return dropdownItems.map((item, index) => {\n const path = [...parentPath, index];\n const level = parentPath.length;\n const focused = isItemFocused(path);\n const disabled = Boolean(item.disabled);\n const hasSubmenu = hasItemSubmenu(item);\n const submenuOpen = hasSubmenu && isSubmenuOpen(path);\n\n return {\n item,\n index,\n key: `${getPathKey(path)}:${String(item.value)}`,\n path,\n level,\n focused,\n disabled,\n hasSubmenu,\n submenuOpen,\n props: getItemProps(item, path, focused, disabled),\n submenuProps: hasSubmenu ? getSubmenuProps(item, path) : undefined,\n slotProps: getItemSlotProps(item, path, focused, disabled),\n children: hasSubmenu ? getRenderedItems(item.children ?? [], path) : [],\n };\n });\n }\n\n function getItemProps(\n item: DropdownMenuItem,\n indexOrPath: number | ItemPath,\n focused = isItemFocused(indexOrPath),\n disabled = Boolean(item.disabled),\n ): DropdownMenuItemProps {\n const path = normalizePath(indexOrPath);\n const hasSubmenu = hasItemSubmenu(item);\n const submenuOpen = hasSubmenu && isSubmenuOpen(path);\n\n return {\n id: getItemId(path),\n type: 'button',\n role: 'menuitem',\n tabindex: -1,\n class: getItemClass(item, focused, disabled, hasSubmenu, submenuOpen),\n 'aria-controls': hasSubmenu ? getSubmenuId(path) : undefined,\n 'aria-expanded': hasSubmenu ? submenuOpen : undefined,\n 'aria-haspopup': hasSubmenu ? 'menu' : undefined,\n 'aria-disabled': disabled || undefined,\n 'data-disabled': disabled || undefined,\n 'data-focused': focused || undefined,\n 'data-submenu': hasSubmenu || undefined,\n onClick: (event) => activateItem(item, path, event),\n onMouseenter: (event) => focusHoveredItem(item, path, event),\n };\n }\n\n function getSubmenuProps(item: DropdownMenuItem, path: ItemPath): DropdownMenuSubmenuProps {\n return {\n id: getSubmenuId(path),\n role: 'menu',\n class: bem('rp-dropdown-menu__submenu', {\n open: isSubmenuOpen(path),\n 'has-submenu': hasNestedItems(item.children ?? []),\n }),\n 'aria-label': item.label,\n 'aria-activedescendant': getMenuActiveDescendant(path),\n };\n }\n\n function getItemSlotProps(\n item: DropdownMenuItem,\n indexOrPath: number | ItemPath,\n focused = isItemFocused(indexOrPath),\n disabled = Boolean(item.disabled),\n ): DropdownMenuItemSlotProps {\n const path = normalizePath(indexOrPath);\n const hasSubmenu = hasItemSubmenu(item);\n\n return {\n item,\n index: path[path.length - 1] ?? -1,\n path,\n level: path.length - 1,\n focused,\n disabled,\n hasSubmenu,\n isSubmenuOpen: hasSubmenu && isSubmenuOpen(path),\n select: () => selectItem(item),\n openSubmenu: (focus = DEFAULT_FOCUS_TARGET) => openSubmenu(path, focus),\n closeSubmenu: () => closeSubmenu(path),\n close,\n };\n }\n\n return {\n renderedItems,\n getItemProps,\n getItemSlotProps,\n };\n}\n","import { ref, type Ref } from 'vue';\nimport type { DropdownMenuItem } from './types';\nimport {\n DEFAULT_FOCUS_TARGET,\n getParentPath,\n hasItemSubmenu,\n isPathPrefix,\n type ItemPath,\n type SubmenuFocusTarget,\n} from './dropdown-menu-utils';\n\ntype UseDropdownSubmenusOptions = {\n focusedPath: Ref<ItemPath>;\n getItemAtPath: (path: ItemPath) => DropdownMenuItem | undefined;\n focusItem: (target: Exclude<SubmenuFocusTarget, false>, menuPath?: ItemPath) => boolean;\n};\n\nexport function useDropdownSubmenus({\n focusedPath,\n getItemAtPath,\n focusItem,\n}: UseDropdownSubmenusOptions) {\n const openSubmenuPath = ref<ItemPath>([]);\n\n function resetSubmenus() {\n openSubmenuPath.value = [];\n }\n\n function isSubmenuOpen(path: ItemPath) {\n return path.length > 0 && isPathPrefix(path, openSubmenuPath.value);\n }\n\n function closeSubmenusAfter(menuPath: ItemPath) {\n openSubmenuPath.value = [...menuPath];\n }\n\n function openSubmenu(path: ItemPath, focus: SubmenuFocusTarget = DEFAULT_FOCUS_TARGET) {\n const item = getItemAtPath(path);\n if (!item || item.disabled || !hasItemSubmenu(item)) return false;\n\n openSubmenuPath.value = [...path];\n if (focus && !focusItem(focus, path)) focusedPath.value = [...path];\n return true;\n }\n\n function closeSubmenu(path: ItemPath) {\n if (!isSubmenuOpen(path)) return false;\n\n openSubmenuPath.value = getParentPath(path);\n if (isPathPrefix(path, focusedPath.value) && focusedPath.value.length > path.length) {\n focusedPath.value = [...path];\n }\n return true;\n }\n\n function closeCurrentSubmenu() {\n const path =\n focusedPath.value.length > 1 ? getParentPath(focusedPath.value) : focusedPath.value;\n\n if (path.length === 0 || !isSubmenuOpen(path)) return false;\n\n return closeSubmenu(path);\n }\n\n return {\n openSubmenuPath,\n resetSubmenus,\n isSubmenuOpen,\n closeSubmenusAfter,\n openSubmenu,\n closeSubmenu,\n closeCurrentSubmenu,\n };\n}\n","import { computed, ref, useId } from 'vue';\nimport { bem } from '@/utils/bem';\nimport type {\n DropdownMenuContentProps,\n DropdownMenuItem,\n DropdownMenuProps,\n DropdownMenuSlotProps,\n DropdownMenuTriggerProps,\n} from './types';\nimport { DEFAULT_PLACEMENT, hasNestedItems } from './dropdown-menu-utils';\nimport { useDropdownMenuDisclosure } from './useDropdownMenuDisclosure';\nimport { useDropdownMenuDom } from './useDropdownMenuDom';\nimport { useDropdownMenuHoverIntent } from './useDropdownMenuHoverIntent';\nimport { useDropdownMenuInteractions } from './useDropdownMenuInteractions';\nimport { useDropdownMenuNavigation } from './useDropdownMenuNavigation';\nimport { useDropdownMenuRenderItems } from './useDropdownMenuRenderItems';\nimport { useDropdownSubmenus } from './useDropdownSubmenus';\n\nexport function useDropdownMenu(\n props: Readonly<DropdownMenuProps>,\n emit: {\n openChange?: (open: boolean) => void;\n select?: (item: DropdownMenuItem) => void;\n } = {},\n) {\n const rootRef = ref<HTMLElement | null>(null);\n const menuRef = ref<HTMLElement | null>(null);\n const uncontrolledOpen = ref(false);\n\n const generatedId = useId();\n const menuId = computed(() => props.id ?? `${generatedId}-menu`);\n const placement = computed(() => props.placement ?? DEFAULT_PLACEMENT);\n const visibleItems = computed(() => props.items ?? []);\n const isDisabled = computed(() => Boolean(props.disabled));\n const isOpen = computed(() => props.open ?? uncontrolledOpen.value);\n const isVisible = computed(() => isOpen.value && !isDisabled.value);\n const contentHasSubmenu = computed(() => hasNestedItems(visibleItems.value));\n const isEmpty = computed(() => visibleItems.value.length === 0);\n\n const {\n focusedPath,\n focusedIndex,\n getItemAtPath,\n focusItem,\n resetFocus,\n isItemFocused,\n moveFocus,\n } = useDropdownMenuNavigation(visibleItems);\n\n const submenus = useDropdownSubmenus({\n focusedPath,\n getItemAtPath,\n focusItem,\n });\n const { openSubmenuPath, isSubmenuOpen } = submenus;\n\n const {\n activeDescendantId,\n focusMenu,\n focusTrigger,\n getItemId,\n getSubmenuId,\n getItemElement,\n getSubmenuElement,\n isSubmenuOpeningLeft,\n getMenuActiveDescendant,\n } = useDropdownMenuDom({\n menuId,\n rootRef,\n menuRef,\n placement,\n focusedPath,\n });\n\n const hoverIntent = useDropdownMenuHoverIntent({\n openSubmenuPath,\n getItemElement,\n getSubmenuElement,\n });\n\n const disclosure = useDropdownMenuDisclosure({\n props,\n emit,\n rootRef,\n uncontrolledOpen,\n isDisabled,\n isOpen,\n isVisible,\n focusedPath,\n resetFocus,\n resetSubmenus: submenus.resetSubmenus,\n resetHoverIntent: hoverIntent.resetHoverIntent,\n focusItem,\n focusMenu,\n focusTrigger,\n });\n const { open, close, toggle } = disclosure;\n\n const {\n activateItem,\n selectItem,\n openSubmenu,\n closeSubmenu,\n focusHoveredItem,\n onTriggerClick,\n onTriggerKeydown,\n onMenuKeydown,\n onMenuMousemove,\n onMenuMouseleave,\n } = useDropdownMenuInteractions({\n props,\n emit,\n isDisabled,\n focusedPath,\n openSubmenuPath,\n getItemAtPath,\n focusItem,\n moveFocus,\n submenus,\n hoverIntent,\n disclosure,\n isSubmenuOpeningLeft,\n });\n\n const rootClass = computed(() =>\n bem('rp-dropdown-menu', {\n [`placement-${placement.value}`]: true,\n open: isVisible.value,\n disabled: isDisabled.value,\n }),\n );\n\n const contentClass = computed(() =>\n bem('rp-dropdown-menu__content', {\n 'has-submenu': contentHasSubmenu.value,\n }),\n );\n\n const triggerProps = computed<DropdownMenuTriggerProps>(() => ({\n 'aria-controls': isDisabled.value ? undefined : menuId.value,\n 'aria-expanded': isDisabled.value ? undefined : isVisible.value,\n 'aria-haspopup': 'menu',\n disabled: isDisabled.value || undefined,\n onClick: onTriggerClick,\n onKeydown: onTriggerKeydown,\n }));\n\n const contentProps = computed<DropdownMenuContentProps>(() => ({\n id: menuId.value,\n role: 'menu',\n tabindex: -1,\n 'aria-label': props.ariaLabel || undefined,\n 'aria-activedescendant': activeDescendantId.value,\n onKeydown: onMenuKeydown,\n onMousemove: onMenuMousemove,\n onMouseleave: onMenuMouseleave,\n }));\n\n const slotProps = computed<DropdownMenuSlotProps>(() => ({\n triggerProps: triggerProps.value,\n isOpen: isVisible.value,\n open,\n close,\n toggle,\n }));\n\n const { renderedItems, getItemProps, getItemSlotProps } = useDropdownMenuRenderItems({\n items: visibleItems,\n getItemId,\n getSubmenuId,\n getMenuActiveDescendant,\n isItemFocused,\n isSubmenuOpen,\n activateItem,\n focusHoveredItem,\n selectItem,\n openSubmenu,\n closeSubmenu,\n close,\n });\n\n return {\n rootRef,\n menuRef,\n menuId,\n isVisible,\n isEmpty,\n visibleItems,\n renderedItems,\n focusedIndex,\n focusedPath,\n activeDescendantId,\n rootClass,\n contentClass,\n triggerProps,\n contentProps,\n slotProps,\n open,\n close,\n toggle,\n selectItem,\n openSubmenu,\n closeSubmenu,\n onItemMouseenter: focusHoveredItem,\n onTriggerKeydown,\n onMenuKeydown,\n getItemProps,\n getItemSlotProps,\n };\n}\n","<template>\n <span ref=\"rootRef\" :class=\"rootClass\">\n <slot v-bind=\"slotProps\" />\n\n <Transition name=\"rp-dropdown-menu-content\">\n <div v-if=\"isVisible\" ref=\"menuRef\" :class=\"contentClass\" v-bind=\"contentProps\">\n <div v-if=\"isEmpty\" class=\"rp-dropdown-menu__empty\">\n <slot name=\"empty\">No actions</slot>\n </div>\n\n <DropdownMenuItems :items=\"renderedItems\">\n <template #item=\"itemSlotProps\">\n <slot name=\"item\" v-bind=\"itemSlotProps\">\n <span class=\"rp-dropdown-menu__label\">{{\n itemSlotProps.item.label\n }}</span>\n <kbd\n v-if=\"itemSlotProps.item.shortcut\"\n class=\"rp-dropdown-menu__shortcut\"\n >\n {{ itemSlotProps.item.shortcut }}\n </kbd>\n </slot>\n <span\n v-if=\"itemSlotProps.hasSubmenu\"\n class=\"rp-dropdown-menu__submenu-icon\"\n aria-hidden=\"true\"\n >\n <IconChevronRight />\n </span>\n </template>\n </DropdownMenuItems>\n </div>\n </Transition>\n </span>\n</template>\n\n<script lang=\"ts\" setup vapor>\nimport IconChevronRight from '~icons/lucide/chevron-right';\nimport DropdownMenuItems from './dropdown-menu-items';\nimport { useDropdownMenu } from './useDropdownMenu';\nimport type {\n DropdownMenuItem,\n DropdownMenuItemSlotProps,\n DropdownMenuProps,\n DropdownMenuSlotProps,\n} from './types';\n\ndefineOptions({ name: 'RpDropdownMenu' });\n\nconst props = withDefaults(defineProps<DropdownMenuProps>(), {\n items: () => [],\n placement: 'bottom-start',\n open: undefined,\n disabled: false,\n closeOnSelect: true,\n});\n\nconst emit = defineEmits<{\n 'update:open': [value: boolean];\n select: [item: DropdownMenuItem];\n}>();\n\ndefineSlots<{\n default(props: DropdownMenuSlotProps): unknown;\n item?(props: DropdownMenuItemSlotProps): unknown;\n empty?(): unknown;\n}>();\n\nconst {\n rootRef,\n menuRef,\n isVisible,\n isEmpty,\n renderedItems,\n rootClass,\n contentClass,\n contentProps,\n slotProps,\n} = useDropdownMenu(props, {\n openChange: (open) => emit('update:open', open),\n select: (item) => emit('select', item),\n});\n\nvoid rootRef;\nvoid menuRef;\n</script>\n\n<style src=\"./dropdown-menu.scss\" lang=\"scss\"></style>\n","<template>\n <span ref=\"rootRef\" :class=\"rootClass\">\n <slot v-bind=\"slotProps\" />\n\n <Transition name=\"rp-dropdown-menu-content\">\n <div v-if=\"isVisible\" ref=\"menuRef\" :class=\"contentClass\" v-bind=\"contentProps\">\n <div v-if=\"isEmpty\" class=\"rp-dropdown-menu__empty\">\n <slot name=\"empty\">No actions</slot>\n </div>\n\n <DropdownMenuItems :items=\"renderedItems\">\n <template #item=\"itemSlotProps\">\n <slot name=\"item\" v-bind=\"itemSlotProps\">\n <span class=\"rp-dropdown-menu__label\">{{\n itemSlotProps.item.label\n }}</span>\n <kbd\n v-if=\"itemSlotProps.item.shortcut\"\n class=\"rp-dropdown-menu__shortcut\"\n >\n {{ itemSlotProps.item.shortcut }}\n </kbd>\n </slot>\n <span\n v-if=\"itemSlotProps.hasSubmenu\"\n class=\"rp-dropdown-menu__submenu-icon\"\n aria-hidden=\"true\"\n >\n <IconChevronRight />\n </span>\n </template>\n </DropdownMenuItems>\n </div>\n </Transition>\n </span>\n</template>\n\n<script lang=\"ts\" setup vapor>\nimport IconChevronRight from '~icons/lucide/chevron-right';\nimport DropdownMenuItems from './dropdown-menu-items';\nimport { useDropdownMenu } from './useDropdownMenu';\nimport type {\n DropdownMenuItem,\n DropdownMenuItemSlotProps,\n DropdownMenuProps,\n DropdownMenuSlotProps,\n} from './types';\n\ndefineOptions({ name: 'RpDropdownMenu' });\n\nconst props = withDefaults(defineProps<DropdownMenuProps>(), {\n items: () => [],\n placement: 'bottom-start',\n open: undefined,\n disabled: false,\n closeOnSelect: true,\n});\n\nconst emit = defineEmits<{\n 'update:open': [value: boolean];\n select: [item: DropdownMenuItem];\n}>();\n\ndefineSlots<{\n default(props: DropdownMenuSlotProps): unknown;\n item?(props: DropdownMenuItemSlotProps): unknown;\n empty?(): unknown;\n}>();\n\nconst {\n rootRef,\n menuRef,\n isVisible,\n isEmpty,\n renderedItems,\n rootClass,\n contentClass,\n contentProps,\n slotProps,\n} = useDropdownMenu(props, {\n openChange: (open) => emit('update:open', open),\n select: (item) => emit('select', item),\n});\n\nvoid rootRef;\nvoid menuRef;\n</script>\n\n<style src=\"./dropdown-menu.scss\" lang=\"scss\"></style>\n"],"mappings":"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"}
|
package/dist/field.js.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"field.js","names":[],"sources":["../src/components/field/useField.ts","../src/components/field/field.vue","../src/components/field/field.vue"],"sourcesContent":["import { computed, useId, useSlots } from 'vue';\nimport { bem } from '@/utils/bem';\nimport type { FieldControlProps, FieldProps } from './types';\n\nexport function useField(props: Readonly<FieldProps>) {\n const slots = useSlots();\n const generatedId = useId();\n\n const controlId = computed(() => props.id ?? `${generatedId}-control`);\n const labelId = computed(() => `${controlId.value}-label`);\n const descriptionId = computed(() => `${controlId.value}-description`);\n const messageId = computed(() => `${controlId.value}-message`);\n\n const isInvalid = computed(() => Boolean(props.invalid || props.error));\n const messageText = computed(() => props.error || props.message);\n\n const hasLabel = computed(() => Boolean(props.label || slots.label));\n const hasDescription = computed(() => Boolean(props.description || slots.description));\n const hasMessage = computed(() => Boolean(messageText.value || slots.message));\n\n const controlLabelledby = computed(() => (hasLabel.value ? labelId.value : undefined));\n const controlDescribedby = computed(\n () =>\n [\n hasDescription.value ? descriptionId.value : undefined,\n hasMessage.value ? messageId.value : undefined,\n ]\n .filter(Boolean)\n .join(' ') || undefined,\n );\n\n const rootClass = computed(() =>\n bem('rp-field', {\n disabled: props.disabled,\n required: props.required,\n invalid: isInvalid.value,\n }),\n );\n\n const controlProps = computed<FieldControlProps>(() => ({\n id: controlId.value,\n disabled: props.disabled || undefined,\n required: props.required || undefined,\n invalid: isInvalid.value || undefined,\n labelledby: controlLabelledby.value,\n describedby: controlDescribedby.value,\n }));\n\n return {\n controlId,\n labelId,\n descriptionId,\n messageId,\n isInvalid,\n messageText,\n hasLabel,\n hasDescription,\n hasMessage,\n controlLabelledby,\n controlDescribedby,\n rootClass,\n controlProps,\n };\n}\n","<template>\n <div :class=\"rootClass\">\n <label v-if=\"hasLabel\" :id=\"labelId\" class=\"rp-field__label\" :for=\"controlId\">\n <slot name=\"label\">{{ label }}</slot>\n <span v-if=\"required\" class=\"rp-field__required\" aria-hidden=\"true\">*</span>\n </label>\n\n <div class=\"rp-field__control\">\n <slot\n :id=\"controlId\"\n :disabled=\"disabled || undefined\"\n :required=\"required || undefined\"\n :invalid=\"isInvalid || undefined\"\n :labelledby=\"controlLabelledby\"\n :describedby=\"controlDescribedby\"\n :control-props=\"controlProps\"\n />\n </div>\n\n <p v-if=\"hasDescription\" :id=\"descriptionId\" class=\"rp-field__description\">\n <slot name=\"description\">{{ description }}</slot>\n </p>\n\n <p\n v-if=\"hasMessage\"\n :id=\"messageId\"\n class=\"rp-field__message\"\n :role=\"isInvalid ? 'alert' : undefined\"\n >\n <slot name=\"message\">{{ messageText }}</slot>\n </p>\n </div>\n</template>\n\n<script lang=\"ts\" setup vapor>\nimport { useField } from './useField';\nimport type { FieldProps } from './types';\n\ndefineOptions({ name: 'RpField' });\n\nconst props = withDefaults(defineProps<FieldProps>(), {\n label: '',\n description: '',\n message: '',\n error: '',\n disabled: undefined,\n required: false,\n invalid: undefined,\n});\n\nconst {\n controlId,\n labelId,\n descriptionId,\n messageId,\n isInvalid,\n messageText,\n hasLabel,\n hasDescription,\n hasMessage,\n controlLabelledby,\n controlDescribedby,\n rootClass,\n controlProps,\n} = useField(props);\n</script>\n\n<style src=\"./field.scss\" lang=\"scss\" scoped></style>\n","<template>\n <div :class=\"rootClass\">\n <label v-if=\"hasLabel\" :id=\"labelId\" class=\"rp-field__label\" :for=\"controlId\">\n <slot name=\"label\">{{ label }}</slot>\n <span v-if=\"required\" class=\"rp-field__required\" aria-hidden=\"true\">*</span>\n </label>\n\n <div class=\"rp-field__control\">\n <slot\n :id=\"controlId\"\n :disabled=\"disabled || undefined\"\n :required=\"required || undefined\"\n :invalid=\"isInvalid || undefined\"\n :labelledby=\"controlLabelledby\"\n :describedby=\"controlDescribedby\"\n :control-props=\"controlProps\"\n />\n </div>\n\n <p v-if=\"hasDescription\" :id=\"descriptionId\" class=\"rp-field__description\">\n <slot name=\"description\">{{ description }}</slot>\n </p>\n\n <p\n v-if=\"hasMessage\"\n :id=\"messageId\"\n class=\"rp-field__message\"\n :role=\"isInvalid ? 'alert' : undefined\"\n >\n <slot name=\"message\">{{ messageText }}</slot>\n </p>\n </div>\n</template>\n\n<script lang=\"ts\" setup vapor>\nimport { useField } from './useField';\nimport type { FieldProps } from './types';\n\ndefineOptions({ name: 'RpField' });\n\nconst props = withDefaults(defineProps<FieldProps>(), {\n label: '',\n description: '',\n message: '',\n error: '',\n disabled: undefined,\n required: false,\n invalid: undefined,\n});\n\nconst {\n controlId,\n labelId,\n descriptionId,\n messageId,\n isInvalid,\n messageText,\n hasLabel,\n hasDescription,\n hasMessage,\n controlLabelledby,\n controlDescribedby,\n rootClass,\n controlProps,\n} = useField(props);\n</script>\n\n<style src=\"./field.scss\" lang=\"scss\" scoped></style>\n"],"mappings":";;;;AAIA,SAAgB,SAAS,OAA6B;CAClD,MAAM,QAAQ,SAAS;CACvB,MAAM,cAAc,MAAM;CAE1B,MAAM,YAAY,eAAe,MAAM,MAAM,GAAG,YAAY,SAAS;CACrE,MAAM,UAAU,eAAe,GAAG,UAAU,MAAM,OAAO;CACzD,MAAM,gBAAgB,eAAe,GAAG,UAAU,MAAM,aAAa;CACrE,MAAM,YAAY,eAAe,GAAG,UAAU,MAAM,SAAS;CAE7D,MAAM,YAAY,eAAe,QAAQ,MAAM,WAAW,MAAM,KAAK,CAAC;CACtE,MAAM,cAAc,eAAe,MAAM,SAAS,MAAM,OAAO;CAE/D,MAAM,WAAW,eAAe,QAAQ,MAAM,SAAS,MAAM,KAAK,CAAC;CACnE,MAAM,iBAAiB,eAAe,QAAQ,MAAM,eAAe,MAAM,WAAW,CAAC;CACrF,MAAM,aAAa,eAAe,QAAQ,YAAY,SAAS,MAAM,OAAO,CAAC;CAE7E,MAAM,oBAAoB,eAAgB,SAAS,QAAQ,QAAQ,QAAQ,KAAA,CAAU;CACrF,MAAM,qBAAqB,eAEnB,CACI,eAAe,QAAQ,cAAc,QAAQ,KAAA,GAC7C,WAAW,QAAQ,UAAU,QAAQ,KAAA,CACzC,CAAC,CACI,OAAO,OAAO,CAAC,CACf,KAAK,GAAG,KAAK,KAAA,CAC1B;CAmBA,OAAO;EACH;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,WA7Bc,eACd,IAAI,YAAY;GACZ,UAAU,MAAM;GAChB,UAAU,MAAM;GAChB,SAAS,UAAU;EACvB,CAAC,CAwBD;EACA,cAtBiB,gBAAmC;GACpD,IAAI,UAAU;GACd,UAAU,MAAM,YAAY,KAAA;GAC5B,UAAU,MAAM,YAAY,KAAA;GAC5B,SAAS,UAAU,SAAS,KAAA;GAC5B,YAAY,kBAAkB;GAC9B,aAAa,mBAAmB;EACpC,EAeI;CACJ;AACJ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ECbA,MAAM,EACF,WACA,SACA,eACA,WACA,WACA,aACA,UACA,gBACA,YACA,mBACA,oBACA,WACA,iBACA,SAAS,OAAK;;;mCA/DD,MAAA,SAAA,CAAS,CAAA;;iBACL,MAAA,QAAA,SAAQ;;;gBAAG,MAAI,MAAA,OAAA,CAAO;gBAA2B,OAAK,MAAA,SAAA,CAAS;;;cAClE,SAAY,YAAA;;mDAAI,QAAA,KAAK,CAAA,CAAA;;;;kBACf,QAAA,gBAAQ;;;;;;;GAKf,UAAI,MAAA,SAAA;GACJ,gBAAU,QAAA,YAAY,KAAA;GACtB,gBAAU,QAAA,YAAY,KAAA;GACtB,eAAS,MAAA,SAAA,KAAa,KAAA;GACtB,kBAAY,MAAA,iBAAA;GACZ,mBAAa,MAAA,kBAAA;GACb,oBAAe,MAAA,YAAA;;;iBAIf,MAAA,cAAA,SAAc;;mCAAG,MAAI,MAAA,aAAA,CAAa,CAAA;;cACjC,eAAkB,YAAA;;oDAAI,QAAA,WAAW,CAAA,CAAA;;;;;;iBAIjC,MAAA,UAAA,SAAU;;;iBACf,MAAI,MAAA,SAAA,CAAS;iBAEb,QAAM,MAAA,SAAA,IAAS,UAAa,KAAA,CAAS;;;cAEhC,WAAc,YAAA;;oDAAI,MAAA,WAAA,CAAW,CAAA,CAAA"}
|
package/dist/icon-button.js.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"icon-button.js","names":[],"sources":["../src/components/icon-button/icon-button.vue","../src/components/icon-button/icon-button.vue"],"sourcesContent":["<template>\n <button\n :class=\"rootClass\"\n :style=\"rootStyle\"\n :disabled=\"disabled || loading || undefined\"\n :type=\"type\"\n :aria-label=\"ariaLabel || undefined\"\n :aria-busy=\"loading || undefined\"\n >\n <IconLoaderCircle v-if=\"loading\" class=\"rp-icon-button__spinner\" aria-hidden=\"true\" />\n <span v-else class=\"rp-icon-button__icon\" aria-hidden=\"true\">\n <slot />\n </span>\n </button>\n</template>\n\n<script lang=\"ts\" setup vapor>\nimport { computed } from 'vue';\nimport IconLoaderCircle from '~icons/lucide/loader-circle';\nimport { isComponentPresetColor } from '@/utils/componentColors';\nimport { bem } from '@/utils/bem';\nimport { getButtonColorStyle } from '../button/useButtonColor';\nimport type { IconButtonProps } from './types';\n\ndefineOptions({ name: 'RpIconButton' });\n\nconst props = withDefaults(defineProps<IconButtonProps>(), {\n type: 'button',\n disabled: false,\n loading: false,\n});\n\nconst rootClass = computed(() => [\n ...bem('rp-button', {\n [props.variant ?? '']: Boolean(props.variant),\n [`color-${props.color}`]: isComponentPresetColor(props.color),\n [`size-${props.size}`]: Boolean(props.size),\n [`radius-${props.radius}`]: Boolean(props.radius),\n }),\n 'rp-icon-button',\n]);\n\nconst rootStyle = computed(() => getButtonColorStyle(props.color));\n</script>\n\n<style src=\"../button/button.scss\" lang=\"scss\" scoped></style>\n<style src=\"./icon-button.scss\" lang=\"scss\" scoped></style>\n","<template>\n <button\n :class=\"rootClass\"\n :style=\"rootStyle\"\n :disabled=\"disabled || loading || undefined\"\n :type=\"type\"\n :aria-label=\"ariaLabel || undefined\"\n :aria-busy=\"loading || undefined\"\n >\n <IconLoaderCircle v-if=\"loading\" class=\"rp-icon-button__spinner\" aria-hidden=\"true\" />\n <span v-else class=\"rp-icon-button__icon\" aria-hidden=\"true\">\n <slot />\n </span>\n </button>\n</template>\n\n<script lang=\"ts\" setup vapor>\nimport { computed } from 'vue';\nimport IconLoaderCircle from '~icons/lucide/loader-circle';\nimport { isComponentPresetColor } from '@/utils/componentColors';\nimport { bem } from '@/utils/bem';\nimport { getButtonColorStyle } from '../button/useButtonColor';\nimport type { IconButtonProps } from './types';\n\ndefineOptions({ name: 'RpIconButton' });\n\nconst props = withDefaults(defineProps<IconButtonProps>(), {\n type: 'button',\n disabled: false,\n loading: false,\n});\n\nconst rootClass = computed(() => [\n ...bem('rp-button', {\n [props.variant ?? '']: Boolean(props.variant),\n [`color-${props.color}`]: isComponentPresetColor(props.color),\n [`size-${props.size}`]: Boolean(props.size),\n [`radius-${props.radius}`]: Boolean(props.radius),\n }),\n 'rp-icon-button',\n]);\n\nconst rootStyle = computed(() => getButtonColorStyle(props.color));\n</script>\n\n<style src=\"../button/button.scss\" lang=\"scss\" scoped></style>\n<style src=\"./icon-button.scss\" lang=\"scss\" scoped></style>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA0BA,MAAM,QAAQ;EAMd,MAAM,YAAY,eAAe,CAC7B,GAAG,IAAI,aAAa;IACf,MAAM,WAAW,KAAK,QAAQ,MAAM,OAAO;IAC3C,SAAS,MAAM,UAAU,uBAAuB,MAAM,KAAK;IAC3D,QAAQ,MAAM,SAAS,QAAQ,MAAM,IAAI;IACzC,UAAU,MAAM,WAAW,QAAQ,MAAM,MAAM;EACpD,CAAC,GACD,gBACJ,CAAC;EAED,MAAM,YAAY,eAAe,oBAAoB,MAAM,KAAK,CAAC;;;;gBAxCjD,UAAA,KAAS;gBACT,UAAA,KAAS;eAChB,YAAU,QAAA,YAAY,YAAW,KAAA,CAAS;eAC1C,QAAM,QAAA,IAAI;eACV,cAAY,QAAA,aAAa,KAAA,CAAS;eAClC,aAAW,YAAW,KAAA,CAAS;;;iBAER,QAAA,eAAO;;IAAE,OAAM;IAA0B,eAAY"}
|