ropav 0.0.9 → 0.0.11

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (289) hide show
  1. package/README.md +6 -0
  2. package/dist/accordion.css +115 -111
  3. package/dist/accordion.js +60 -16
  4. package/dist/alert.css +110 -108
  5. package/dist/alert.js +48 -26
  6. package/dist/aspect-ratio.css +17 -15
  7. package/dist/aspect-ratio.js +20 -6
  8. package/dist/avatar.css +98 -96
  9. package/dist/avatar.js +27 -16
  10. package/dist/badge.css +95 -93
  11. package/dist/badge.js +29 -16
  12. package/dist/base.css +672 -671
  13. package/dist/button-group.css +39 -37
  14. package/dist/button-group.js +23 -12
  15. package/dist/button-link.css +160 -158
  16. package/dist/button-link.js +43 -24
  17. package/dist/button.css +160 -158
  18. package/dist/button.js +37 -19
  19. package/dist/card.css +109 -107
  20. package/dist/card.js +42 -17
  21. package/dist/checkbox.css +139 -137
  22. package/dist/checkbox.js +79 -28
  23. package/dist/collapse.css +29 -27
  24. package/dist/collapse.js +44 -10
  25. package/dist/color-input.css +137 -107
  26. package/dist/color-input.js +91 -17
  27. package/dist/color-picker.css +309 -303
  28. package/dist/color-picker.js +250 -77
  29. package/dist/color-picker2.js +9 -1
  30. package/dist/color-swatch.css +48 -46
  31. package/dist/color-swatch.js +15 -11
  32. package/dist/color-swatch2.js +4 -0
  33. package/dist/components/accordion/accordion-item.d.ts +16 -4
  34. package/dist/components/accordion/accordion.d.ts +1 -1
  35. package/dist/components/accordion/index.d.ts +5 -4
  36. package/dist/components/accordion/index.js +2 -2
  37. package/dist/components/accordion/types.d.ts +10 -5
  38. package/dist/components/accordion/useAccordion.d.ts +1 -1
  39. package/dist/components/alert/alert.d.ts +3 -3
  40. package/dist/components/alert/index.d.ts +3 -3
  41. package/dist/components/alert/index.js +2 -2
  42. package/dist/components/alert/types.d.ts +5 -2
  43. package/dist/components/alert/useAlertColor.d.ts +1 -1
  44. package/dist/components/aspect-ratio/aspect-ratio.d.ts +1 -1
  45. package/dist/components/aspect-ratio/index.d.ts +3 -2
  46. package/dist/components/aspect-ratio/index.js +2 -2
  47. package/dist/components/aspect-ratio/types.d.ts +4 -1
  48. package/dist/components/avatar/avatar.d.ts +1 -1
  49. package/dist/components/avatar/index.d.ts +3 -3
  50. package/dist/components/avatar/index.js +2 -2
  51. package/dist/components/avatar/types.d.ts +5 -2
  52. package/dist/components/avatar/useAvatarColor.d.ts +1 -1
  53. package/dist/components/badge/badge.d.ts +1 -1
  54. package/dist/components/badge/index.d.ts +3 -3
  55. package/dist/components/badge/index.js +2 -2
  56. package/dist/components/badge/types.d.ts +5 -2
  57. package/dist/components/badge/useBadgeColor.d.ts +1 -1
  58. package/dist/components/button/button.d.ts +1 -1
  59. package/dist/components/button/index.d.ts +3 -2
  60. package/dist/components/button/index.js +2 -2
  61. package/dist/components/button/types.d.ts +5 -2
  62. package/dist/components/button/useButtonColor.d.ts +1 -1
  63. package/dist/components/button-group/button-group.d.ts +1 -1
  64. package/dist/components/button-group/index.d.ts +3 -2
  65. package/dist/components/button-group/index.js +2 -2
  66. package/dist/components/button-group/types.d.ts +4 -1
  67. package/dist/components/button-link/button-link.d.ts +1 -1
  68. package/dist/components/button-link/index.d.ts +3 -2
  69. package/dist/components/button-link/index.js +2 -2
  70. package/dist/components/button-link/types.d.ts +5 -2
  71. package/dist/components/card/card.d.ts +1 -1
  72. package/dist/components/card/index.d.ts +3 -2
  73. package/dist/components/card/index.js +2 -2
  74. package/dist/components/card/types.d.ts +5 -1
  75. package/dist/components/checkbox/checkbox.d.ts +5 -2
  76. package/dist/components/checkbox/index.d.ts +3 -2
  77. package/dist/components/checkbox/index.js +2 -2
  78. package/dist/components/checkbox/types.d.ts +7 -2
  79. package/dist/components/checkbox/useCheckbox.d.ts +4 -2
  80. package/dist/components/collapse/collapse.d.ts +2 -2
  81. package/dist/components/collapse/index.d.ts +4 -3
  82. package/dist/components/collapse/index.js +2 -2
  83. package/dist/components/collapse/types.d.ts +9 -2
  84. package/dist/components/collapse/useCollapse.d.ts +1 -1
  85. package/dist/components/color-input/color-input.d.ts +1 -1
  86. package/dist/components/color-input/index.d.ts +3 -2
  87. package/dist/components/color-input/index.js +2 -2
  88. package/dist/components/color-input/types.d.ts +8 -4
  89. package/dist/components/color-input/useColorInput.d.ts +5 -5
  90. package/dist/components/color-input/useColorInputEyeDropper.d.ts +1 -1
  91. package/dist/components/color-input/useColorInputPopover.d.ts +2 -2
  92. package/dist/components/color-input/useColorInputValue.d.ts +1 -1
  93. package/dist/components/color-picker/color-picker-saturation.d.ts +1 -1
  94. package/dist/components/color-picker/color-picker-slider.d.ts +1 -1
  95. package/dist/components/color-picker/color-picker-utils.d.ts +1 -1
  96. package/dist/components/color-picker/color-picker.d.ts +1 -1
  97. package/dist/components/color-picker/index.d.ts +3 -3
  98. package/dist/components/color-picker/index.js +2 -2
  99. package/dist/components/color-picker/types.d.ts +13 -1
  100. package/dist/components/color-picker/useColorPickerDrag.d.ts +7 -2
  101. package/dist/components/color-picker/useColorPickerSwatches.d.ts +1 -1
  102. package/dist/components/color-picker/useColorPickerValue.d.ts +2 -2
  103. package/dist/components/color-swatch/color-swatch.d.ts +1 -1
  104. package/dist/components/color-swatch/index.d.ts +3 -2
  105. package/dist/components/color-swatch/index.js +2 -1
  106. package/dist/components/color-swatch/types.d.ts +4 -1
  107. package/dist/components/dropdown-menu/dropdown-menu-items.d.ts +15 -6
  108. package/dist/components/dropdown-menu/dropdown-menu-primitives.d.ts +724 -0
  109. package/dist/components/dropdown-menu/dropdown-menu-utils.d.ts +1 -1
  110. package/dist/components/dropdown-menu/dropdown-menu.d.ts +3 -3
  111. package/dist/components/dropdown-menu/index.d.ts +55 -3
  112. package/dist/components/dropdown-menu/index.js +2 -2
  113. package/dist/components/dropdown-menu/types.d.ts +142 -6
  114. package/dist/components/dropdown-menu/useDropdownMenu.d.ts +21 -12
  115. package/dist/components/dropdown-menu/useDropdownMenuDisclosure.d.ts +6 -4
  116. package/dist/components/dropdown-menu/useDropdownMenuDom.d.ts +4 -3
  117. package/dist/components/dropdown-menu/useDropdownMenuHoverIntent.d.ts +2 -2
  118. package/dist/components/dropdown-menu/useDropdownMenuInteractions.d.ts +5 -5
  119. package/dist/components/dropdown-menu/useDropdownMenuNavigation.d.ts +3 -3
  120. package/dist/components/dropdown-menu/useDropdownMenuPortalPosition.d.ts +19 -0
  121. package/dist/components/dropdown-menu/useDropdownMenuRenderItems.d.ts +25 -5
  122. package/dist/components/dropdown-menu/useDropdownSubmenus.d.ts +3 -3
  123. package/dist/components/field/field.d.ts +2 -2
  124. package/dist/components/field/index.d.ts +3 -2
  125. package/dist/components/field/index.js +2 -2
  126. package/dist/components/field/types.d.ts +4 -1
  127. package/dist/components/field/useField.d.ts +1 -1
  128. package/dist/components/floating/index.d.ts +1 -0
  129. package/dist/components/floating/index.js +0 -0
  130. package/dist/components/floating/types.d.ts +31 -0
  131. package/dist/components/floating/useFloatingPosition.d.ts +38 -0
  132. package/dist/components/focus-trap/focus-trap.d.ts +31 -0
  133. package/dist/components/focus-trap/index.d.ts +4 -0
  134. package/dist/components/focus-trap/index.js +3 -0
  135. package/dist/components/focus-trap/types.d.ts +41 -0
  136. package/dist/components/focus-trap/useFocusTrap.d.ts +2 -0
  137. package/dist/components/icon-button/icon-button.d.ts +1 -1
  138. package/dist/components/icon-button/index.d.ts +3 -2
  139. package/dist/components/icon-button/index.js +2 -1
  140. package/dist/components/icon-button/types.d.ts +5 -2
  141. package/dist/components/input/index.d.ts +3 -2
  142. package/dist/components/input/index.js +2 -1
  143. package/dist/components/input/input.d.ts +1 -1
  144. package/dist/components/input/types.d.ts +4 -1
  145. package/dist/components/input/useInput.d.ts +2 -2
  146. package/dist/components/modal/index.d.ts +3 -2
  147. package/dist/components/modal/index.js +2 -2
  148. package/dist/components/modal/modal.d.ts +1 -1
  149. package/dist/components/modal/types.d.ts +9 -2
  150. package/dist/components/modal/useModal.d.ts +1 -1
  151. package/dist/components/number-input/index.d.ts +3 -2
  152. package/dist/components/number-input/index.js +2 -2
  153. package/dist/components/number-input/number-input.d.ts +1 -1
  154. package/dist/components/number-input/types.d.ts +5 -2
  155. package/dist/components/number-input/useNumberInput.d.ts +2 -2
  156. package/dist/components/overlay/index.d.ts +3 -2
  157. package/dist/components/overlay/index.js +2 -1
  158. package/dist/components/overlay/overlay.d.ts +1 -1
  159. package/dist/components/overlay/types.d.ts +4 -1
  160. package/dist/components/overlay/useOverlay.d.ts +1 -1
  161. package/dist/components/popover/index.d.ts +3 -3
  162. package/dist/components/popover/index.js +2 -2
  163. package/dist/components/popover/popover.d.ts +2 -2
  164. package/dist/components/popover/types.d.ts +21 -11
  165. package/dist/components/popover/usePopover.d.ts +11 -2
  166. package/dist/components/progress/index.d.ts +3 -3
  167. package/dist/components/progress/index.js +2 -2
  168. package/dist/components/progress/progress.d.ts +1 -1
  169. package/dist/components/progress/types.d.ts +5 -2
  170. package/dist/components/progress/useProgress.d.ts +2 -2
  171. package/dist/components/radio/index.d.ts +4 -3
  172. package/dist/components/radio/index.js +2 -2
  173. package/dist/components/radio/radio-group.d.ts +1 -1
  174. package/dist/components/radio/radio.d.ts +9 -4
  175. package/dist/components/radio/types.d.ts +21 -4
  176. package/dist/components/radio/useRadio.d.ts +10 -5
  177. package/dist/components/select/index.d.ts +3 -2
  178. package/dist/components/select/index.js +2 -2
  179. package/dist/components/select/select.d.ts +1 -1
  180. package/dist/components/select/types.d.ts +4 -1
  181. package/dist/components/select/useSelect.d.ts +4 -3
  182. package/dist/components/slider/index.d.ts +4 -4
  183. package/dist/components/slider/index.js +2 -2
  184. package/dist/components/slider/range-slider-tooltip.d.ts +37 -0
  185. package/dist/components/slider/range-slider.d.ts +8 -13
  186. package/dist/components/slider/slider.d.ts +5 -2
  187. package/dist/components/slider/sliderCore.d.ts +35 -0
  188. package/dist/components/slider/types.d.ts +14 -7
  189. package/dist/components/slider/useRangeSlider.d.ts +5 -7
  190. package/dist/components/slider/useRangeSliderPointer.d.ts +19 -0
  191. package/dist/components/slider/useRangeSliderTooltipCollision.d.ts +31 -2
  192. package/dist/components/slider/useRangeSliderTooltipState.d.ts +23 -0
  193. package/dist/components/slider/useSlider.d.ts +11 -15
  194. package/dist/components/switch/index.d.ts +3 -2
  195. package/dist/components/switch/index.js +2 -2
  196. package/dist/components/switch/switch.d.ts +5 -2
  197. package/dist/components/switch/types.d.ts +7 -2
  198. package/dist/components/switch/useSwitch.d.ts +4 -2
  199. package/dist/components/tabs/index.d.ts +7 -6
  200. package/dist/components/tabs/index.js +2 -2
  201. package/dist/components/tabs/tabs-content.d.ts +2 -2
  202. package/dist/components/tabs/tabs-list.d.ts +4 -4
  203. package/dist/components/tabs/tabs-trigger.d.ts +5 -5
  204. package/dist/components/tabs/tabs.d.ts +5 -5
  205. package/dist/components/tabs/types.d.ts +13 -4
  206. package/dist/components/tabs/useTabs.d.ts +1 -1
  207. package/dist/components/teleport-provider/index.d.ts +2 -0
  208. package/dist/components/teleport-provider/index.js +2 -0
  209. package/dist/components/teleport-provider/teleport-provider.d.ts +21 -0
  210. package/dist/components/teleport-provider/types.d.ts +4 -0
  211. package/dist/components/teleport-provider/useTeleportTarget.d.ts +5 -0
  212. package/dist/components/textarea/index.d.ts +3 -2
  213. package/dist/components/textarea/index.js +2 -2
  214. package/dist/components/textarea/textarea.d.ts +5 -2
  215. package/dist/components/textarea/types.d.ts +6 -1
  216. package/dist/components/textarea/useTextarea.d.ts +3 -2
  217. package/dist/components/toast/defaults.d.ts +7 -0
  218. package/dist/components/toast/index.d.ts +7 -0
  219. package/dist/components/toast/index.js +2 -0
  220. package/dist/components/toast/toast-provider.d.ts +21 -0
  221. package/dist/components/toast/toast-viewport.d.ts +34 -0
  222. package/dist/components/toast/toast.d.ts +31 -0
  223. package/dist/components/toast/types.d.ts +110 -0
  224. package/dist/components/toast/useToast.d.ts +4 -0
  225. package/dist/components/toast/useToastColor.d.ts +3 -0
  226. package/dist/components/toast/useToastState.d.ts +2 -0
  227. package/dist/components/tooltip/index.d.ts +3 -2
  228. package/dist/components/tooltip/index.js +2 -1
  229. package/dist/components/tooltip/tooltip.d.ts +2 -2
  230. package/dist/components/tooltip/types.d.ts +14 -13
  231. package/dist/components/tooltip/useTooltip.d.ts +15 -3
  232. package/dist/dropdown-menu.css +191 -107
  233. package/dist/dropdown-menu.js +1729 -107
  234. package/dist/field.css +41 -39
  235. package/dist/field.js +40 -16
  236. package/dist/focus-trap.js +80 -0
  237. package/dist/icon-button.css +193 -189
  238. package/dist/icon-button.js +23 -18
  239. package/dist/icon-button2.js +8 -0
  240. package/dist/index.d.ts +35 -30
  241. package/dist/index.js +36 -31
  242. package/dist/input.css +122 -120
  243. package/dist/input.js +47 -34
  244. package/dist/input2.js +9 -0
  245. package/dist/legacy-unlayered.css +5461 -0
  246. package/dist/modal.css +129 -127
  247. package/dist/modal.js +160 -200
  248. package/dist/number-input.css +87 -85
  249. package/dist/number-input.js +61 -17
  250. package/dist/overlay.css +26 -24
  251. package/dist/overlay.js +17 -9
  252. package/dist/overlay2.js +4 -0
  253. package/dist/popover.css +140 -107
  254. package/dist/popover.js +295 -189
  255. package/dist/popover2.js +6 -1
  256. package/dist/progress.css +101 -99
  257. package/dist/progress.js +50 -28
  258. package/dist/radio.css +114 -105
  259. package/dist/radio.js +154 -56
  260. package/dist/select.css +244 -242
  261. package/dist/select.js +92 -47
  262. package/dist/slider.css +1109 -904
  263. package/dist/slider.js +1118 -923
  264. package/dist/styles-api.d.ts +22 -0
  265. package/dist/styles-api.js +49 -0
  266. package/dist/switch.css +120 -108
  267. package/dist/switch.js +89 -33
  268. package/dist/tabs.css +286 -278
  269. package/dist/tabs.js +60 -21
  270. package/dist/teleport-provider.js +15 -0
  271. package/dist/textarea.css +132 -130
  272. package/dist/textarea.js +77 -29
  273. package/dist/toast.css +236 -0
  274. package/dist/toast.js +739 -0
  275. package/dist/tooltip.css +137 -107
  276. package/dist/tooltip.js +182 -223
  277. package/dist/tooltip2.js +8 -0
  278. package/dist/useClickOutside.js +1 -1
  279. package/dist/useFloatingPosition.js +1284 -0
  280. package/dist/useFocusTrap.js +130 -0
  281. package/dist/useTeleportTarget.js +29 -0
  282. package/dist/utils/componentColors.d.ts +60 -0
  283. package/docs/public-styles-api.md +133 -0
  284. package/docs/public-tokens.md +545 -0
  285. package/package.json +44 -12
  286. package/src/styles/_tokens.scss +33 -28
  287. package/src/styles/_utilities.scss +11 -9
  288. package/src/styles/styles-manifest.json +4125 -0
  289. package/dist/components/slider/useRangeSliderTooltipTransition.d.ts +0 -4
package/dist/select.css CHANGED
@@ -1,243 +1,245 @@
1
- .rp-select[data-v-abf4b97a] {
2
- --_rp-select-height: var(--rp-size-control-md);
3
- --_rp-select-padding-x: calc(var(--rp-size-control-md) / 3);
4
- --_rp-select-font-size: var(--rp-font-size-md);
5
- --_rp-select-option-min-height: calc(var(--rp-size-control-md) - var(--rp-spacing-4));
6
- --_rp-select-option-padding-y: var(--rp-spacing-1);
7
- --_rp-select-radius: var(--rp-radius-sm);
8
- --_rp-select-invalid-border: var(--rp-color-red-filled);
9
- --_rp-select-invalid-ring: color-mix(in srgb, var(--rp-color-red-filled) 32%, transparent);
10
- --_rp-select-option-focused-bg: var(--rp-color-default-hover);
11
- position: relative;
12
- display: inline-flex;
13
- font-family: var(--rp-font-family);
14
- font-weight: var(--rp-font-weight-normal);
15
- line-height: 1;
16
- }
17
- .rp-select--size-xs[data-v-abf4b97a] {
18
- --_rp-select-height: var(--rp-size-control-xs);
19
- --_rp-select-padding-x: calc(var(--rp-size-control-xs) / 3);
20
- --_rp-select-font-size: var(--rp-font-size-xs);
21
- --_rp-select-option-min-height: calc(var(--rp-size-control-xs) - var(--rp-spacing-2));
22
- --_rp-select-option-padding-y: calc(var(--rp-spacing-1) / 2);
23
- }
24
- .rp-select--size-sm[data-v-abf4b97a] {
25
- --_rp-select-height: var(--rp-size-control-sm);
26
- --_rp-select-padding-x: calc(var(--rp-size-control-sm) / 3);
27
- --_rp-select-font-size: var(--rp-font-size-sm);
28
- --_rp-select-option-min-height: calc(var(--rp-size-control-sm) - var(--rp-spacing-3));
29
- --_rp-select-option-padding-y: var(--rp-spacing-1);
30
- }
31
- .rp-select--size-md[data-v-abf4b97a] {
32
- --_rp-select-height: var(--rp-size-control-md);
33
- --_rp-select-padding-x: calc(var(--rp-size-control-md) / 3);
34
- --_rp-select-font-size: var(--rp-font-size-md);
35
- --_rp-select-option-min-height: calc(var(--rp-size-control-md) - var(--rp-spacing-4));
36
- --_rp-select-option-padding-y: var(--rp-spacing-1);
37
- }
38
- .rp-select--size-lg[data-v-abf4b97a] {
39
- --_rp-select-height: var(--rp-size-control-lg);
40
- --_rp-select-padding-x: calc(var(--rp-size-control-lg) / 3);
41
- --_rp-select-font-size: var(--rp-font-size-lg);
42
- --_rp-select-option-min-height: calc(var(--rp-size-control-lg) - var(--rp-spacing-5));
43
- --_rp-select-option-padding-y: calc(var(--rp-spacing-3) / 2);
44
- }
45
- .rp-select--size-xl[data-v-abf4b97a] {
46
- --_rp-select-height: var(--rp-size-control-xl);
47
- --_rp-select-padding-x: calc(var(--rp-size-control-xl) / 3);
48
- --_rp-select-font-size: var(--rp-font-size-xl);
49
- --_rp-select-option-min-height: calc(var(--rp-size-control-xl) - var(--rp-spacing-6));
50
- --_rp-select-option-padding-y: var(--rp-spacing-2);
51
- }
52
- html.dark .rp-select[data-v-abf4b97a], [data-rp-color-scheme=dark] .rp-select[data-v-abf4b97a] {
53
- --_rp-select-invalid-border: var(--rp-color-red-light-color);
54
- --_rp-select-invalid-ring: color-mix(
55
- in srgb,
56
- var(--rp-color-red-light-color) 32%,
57
- transparent
58
- );
59
- --_rp-select-option-focused-bg: var(--rp-color-default-hover);
60
- }
61
- .rp-select--disabled[data-v-abf4b97a] {
62
- opacity: var(--rp-opacity-disabled);
63
- cursor: not-allowed;
64
- }
65
- .rp-select__trigger[data-v-abf4b97a] {
66
- display: inline-flex;
67
- align-items: center;
68
- justify-content: center;
69
- justify-content: space-between;
70
- width: 100%;
71
- min-width: 180px;
72
- height: var(--_rp-select-height);
73
- padding: 0 var(--_rp-select-padding-x);
74
- font-size: var(--_rp-select-font-size);
75
- background-color: var(--rp-color-control-bg);
76
- border: var(--rp-border-width-thin) solid var(--rp-color-control-border);
77
- border-radius: var(--_rp-select-radius);
78
- cursor: pointer;
79
- transition: border-color var(--rp-transition-fast), box-shadow var(--rp-transition-fast);
80
- gap: var(--rp-spacing-2);
81
- }
82
- .rp-select__trigger[data-v-abf4b97a]:hover {
83
- border-color: var(--rp-color-control-border-hover);
84
- }
85
- .rp-select__trigger[data-v-abf4b97a]:focus-visible {
86
- outline: none;
87
- border-color: var(--rp-color-control-border-focus);
88
- box-shadow: 0 0 0 var(--rp-border-width-medium) var(--rp-color-focus-ring);
89
- }
90
- .rp-select--radius-xs[data-v-abf4b97a] {
91
- --_rp-select-radius: var(--rp-radius-xs);
92
- }
93
- .rp-select--radius-sm[data-v-abf4b97a] {
94
- --_rp-select-radius: var(--rp-radius-sm);
95
- }
96
- .rp-select--radius-md[data-v-abf4b97a] {
97
- --_rp-select-radius: var(--rp-radius-md);
98
- }
99
- .rp-select--radius-lg[data-v-abf4b97a] {
100
- --_rp-select-radius: var(--rp-radius-lg);
101
- }
102
- .rp-select--radius-xl[data-v-abf4b97a] {
103
- --_rp-select-radius: var(--rp-radius-xl);
104
- }
105
- .rp-select--open .rp-select__trigger[data-v-abf4b97a] {
106
- border-color: var(--rp-color-control-border-focus);
107
- box-shadow: 0 0 0 var(--rp-border-width-medium) var(--rp-color-focus-ring);
108
- }
109
- .rp-select--invalid .rp-select__trigger[data-v-abf4b97a] {
110
- border-color: var(--_rp-select-invalid-border);
111
- }
112
- .rp-select--invalid .rp-select__trigger[data-v-abf4b97a]:focus-visible, .rp-select--open.rp-select--invalid .rp-select__trigger[data-v-abf4b97a] {
113
- border-color: var(--_rp-select-invalid-border);
114
- box-shadow: 0 0 0 var(--rp-border-width-medium) var(--_rp-select-invalid-ring);
115
- }
116
- .rp-select__value[data-v-abf4b97a] {
117
- flex: 1;
118
- overflow: hidden;
119
- text-overflow: ellipsis;
120
- white-space: nowrap;
121
- color: var(--rp-color-control-fg);
122
- }
123
- .rp-select__placeholder[data-v-abf4b97a] {
124
- color: var(--rp-color-control-placeholder);
125
- }
126
- .rp-select__indicator[data-v-abf4b97a] {
127
- display: inline-flex;
128
- align-items: center;
129
- width: 1em;
130
- height: 1em;
131
- flex-shrink: 0;
132
- }
133
- .rp-select__indicator svg[data-v-abf4b97a] {
134
- width: 100%;
135
- height: 100%;
136
- }
137
- .rp-select__indicator[data-v-abf4b97a] {
138
- position: relative;
139
- color: var(--rp-color-control-icon);
140
- transform: translateX(var(--rp-spacing-1));
141
- }
142
- .rp-select__arrow[data-v-abf4b97a] {
143
- display: inline-flex;
144
- align-items: center;
145
- width: 1em;
146
- height: 1em;
147
- flex-shrink: 0;
148
- }
149
- .rp-select__arrow svg[data-v-abf4b97a] {
150
- width: 100%;
151
- height: 100%;
152
- }
153
- .rp-select__arrow[data-v-abf4b97a] {
154
- transition: opacity var(--rp-transition-fast);
155
- }
156
- .rp-select__clear[data-v-abf4b97a] {
157
- padding: 0;
158
- font: inherit;
159
- background: none;
160
- border: none;
161
- cursor: pointer;
162
- display: inline-flex;
163
- align-items: center;
164
- width: 1em;
165
- height: 1em;
166
- flex-shrink: 0;
167
- }
168
- .rp-select__clear svg[data-v-abf4b97a] {
169
- width: 100%;
170
- height: 100%;
171
- }
172
- .rp-select__clear[data-v-abf4b97a] {
173
- position: absolute;
174
- inset: 0;
175
- z-index: 1;
176
- color: var(--rp-color-control-icon);
177
- opacity: 0;
178
- pointer-events: none;
179
- transition: color var(--rp-transition-fast), opacity var(--rp-transition-fast);
180
- }
181
- .rp-select__clear[data-v-abf4b97a]:hover {
182
- color: var(--rp-color-control-fg);
183
- }
184
- .rp-select__trigger:hover .rp-select__clear[data-v-abf4b97a] {
185
- opacity: 1;
186
- pointer-events: auto;
187
- }
188
- .rp-select__trigger:hover .rp-select__clear + .rp-select__arrow[data-v-abf4b97a] {
189
- opacity: 0;
190
- }
191
- .rp-select__dropdown[data-v-abf4b97a] {
192
- position: absolute;
193
- top: calc(100% + var(--rp-spacing-2));
194
- left: 0;
195
- right: 0;
196
- z-index: 100;
197
- background-color: var(--rp-color-default);
198
- border: var(--rp-border-width-thin) solid var(--rp-color-default-border);
199
- border-radius: var(--_rp-select-radius);
200
- box-shadow: var(--rp-shadow-md);
201
- padding: var(--rp-spacing-1) 0;
202
- max-height: 240px;
203
- overflow-y: auto;
204
- padding: var(--rp-spacing-1);
205
- }
206
- .rp-select__option[data-v-abf4b97a] {
207
- display: flex;
208
- align-items: center;
209
- min-height: var(--_rp-select-option-min-height);
210
- padding: var(--_rp-select-option-padding-y) var(--_rp-select-padding-x);
211
- border-radius: var(--_rp-select-radius);
212
- font-size: var(--_rp-select-font-size);
213
- cursor: pointer;
214
- transition: color var(--rp-transition-fast);
215
- color: var(--rp-color-control-fg);
216
- }
217
- .rp-select__option--focused[data-v-abf4b97a] {
218
- background-color: var(--_rp-select-option-focused-bg);
219
- }
220
- .rp-select__option--selected[data-v-abf4b97a] {
221
- color: var(--rp-primary-color-light-color);
222
- }
223
- .rp-select__option--disabled[data-v-abf4b97a] {
224
- color: var(--rp-color-disabled-color);
225
- cursor: not-allowed;
226
- }
227
- .rp-select__empty[data-v-abf4b97a] {
228
- display: flex;
229
- align-items: center;
230
- justify-content: center;
231
- padding: var(--rp-spacing-4);
232
- color: var(--rp-color-dimmed);
233
- font-size: var(--_rp-select-font-size);
234
- }
235
- .rp-select-dropdown-enter-active[data-v-abf4b97a],
236
- .rp-select-dropdown-leave-active[data-v-abf4b97a] {
237
- transition: opacity var(--rp-transition-fast), transform var(--rp-transition-fast);
238
- }
239
- .rp-select-dropdown-enter-from[data-v-abf4b97a],
240
- .rp-select-dropdown-leave-to[data-v-abf4b97a] {
241
- opacity: 0;
242
- transform: translateY(calc(-1 * var(--rp-spacing-1)));
1
+ @layer ropav.components {
2
+ .rp-select[data-v-e6060752] {
3
+ --_rp-select-height: var(--rp-size-control-md);
4
+ --_rp-select-padding-x: calc(var(--rp-size-control-md) / 3);
5
+ --_rp-select-font-size: var(--rp-font-size-md);
6
+ --_rp-select-option-min-height: calc(var(--rp-size-control-md) - var(--rp-spacing-4));
7
+ --_rp-select-option-padding-y: var(--rp-spacing-1);
8
+ --_rp-select-radius: var(--rp-radius-sm);
9
+ --_rp-select-invalid-border: var(--rp-color-red-filled);
10
+ --_rp-select-invalid-ring: color-mix(in srgb, var(--rp-color-red-filled) 32%, transparent);
11
+ --_rp-select-option-focused-bg: var(--rp-color-default-hover);
12
+ position: relative;
13
+ display: inline-flex;
14
+ font-family: var(--rp-font-family);
15
+ font-weight: var(--rp-font-weight-normal);
16
+ line-height: 1;
17
+ }
18
+ .rp-select--size-xs[data-v-e6060752] {
19
+ --_rp-select-height: var(--rp-size-control-xs);
20
+ --_rp-select-padding-x: calc(var(--rp-size-control-xs) / 3);
21
+ --_rp-select-font-size: var(--rp-font-size-xs);
22
+ --_rp-select-option-min-height: calc(var(--rp-size-control-xs) - var(--rp-spacing-2));
23
+ --_rp-select-option-padding-y: calc(var(--rp-spacing-1) / 2);
24
+ }
25
+ .rp-select--size-sm[data-v-e6060752] {
26
+ --_rp-select-height: var(--rp-size-control-sm);
27
+ --_rp-select-padding-x: calc(var(--rp-size-control-sm) / 3);
28
+ --_rp-select-font-size: var(--rp-font-size-sm);
29
+ --_rp-select-option-min-height: calc(var(--rp-size-control-sm) - var(--rp-spacing-3));
30
+ --_rp-select-option-padding-y: var(--rp-spacing-1);
31
+ }
32
+ .rp-select--size-md[data-v-e6060752] {
33
+ --_rp-select-height: var(--rp-size-control-md);
34
+ --_rp-select-padding-x: calc(var(--rp-size-control-md) / 3);
35
+ --_rp-select-font-size: var(--rp-font-size-md);
36
+ --_rp-select-option-min-height: calc(var(--rp-size-control-md) - var(--rp-spacing-4));
37
+ --_rp-select-option-padding-y: var(--rp-spacing-1);
38
+ }
39
+ .rp-select--size-lg[data-v-e6060752] {
40
+ --_rp-select-height: var(--rp-size-control-lg);
41
+ --_rp-select-padding-x: calc(var(--rp-size-control-lg) / 3);
42
+ --_rp-select-font-size: var(--rp-font-size-lg);
43
+ --_rp-select-option-min-height: calc(var(--rp-size-control-lg) - var(--rp-spacing-5));
44
+ --_rp-select-option-padding-y: calc(var(--rp-spacing-3) / 2);
45
+ }
46
+ .rp-select--size-xl[data-v-e6060752] {
47
+ --_rp-select-height: var(--rp-size-control-xl);
48
+ --_rp-select-padding-x: calc(var(--rp-size-control-xl) / 3);
49
+ --_rp-select-font-size: var(--rp-font-size-xl);
50
+ --_rp-select-option-min-height: calc(var(--rp-size-control-xl) - var(--rp-spacing-6));
51
+ --_rp-select-option-padding-y: var(--rp-spacing-2);
52
+ }
53
+ html.dark .rp-select[data-v-e6060752], [data-rp-color-scheme=dark] .rp-select[data-v-e6060752] {
54
+ --_rp-select-invalid-border: var(--rp-color-red-light-color);
55
+ --_rp-select-invalid-ring: color-mix(
56
+ in srgb,
57
+ var(--rp-color-red-light-color) 32%,
58
+ transparent
59
+ );
60
+ --_rp-select-option-focused-bg: var(--rp-color-default-hover);
61
+ }
62
+ .rp-select--disabled[data-v-e6060752] {
63
+ opacity: var(--rp-opacity-disabled);
64
+ cursor: not-allowed;
65
+ }
66
+ .rp-select__trigger[data-v-e6060752] {
67
+ display: inline-flex;
68
+ align-items: center;
69
+ justify-content: center;
70
+ justify-content: space-between;
71
+ width: 100%;
72
+ min-width: 180px;
73
+ height: var(--_rp-select-height);
74
+ padding: 0 var(--_rp-select-padding-x);
75
+ font-size: var(--_rp-select-font-size);
76
+ background-color: var(--rp-color-control-bg);
77
+ border: var(--rp-border-width-thin) solid var(--rp-color-control-border);
78
+ border-radius: var(--_rp-select-radius);
79
+ cursor: pointer;
80
+ transition: border-color var(--rp-transition-fast), box-shadow var(--rp-transition-fast);
81
+ gap: var(--rp-spacing-2);
82
+ }
83
+ .rp-select__trigger[data-v-e6060752]:hover {
84
+ border-color: var(--rp-color-control-border-hover);
85
+ }
86
+ .rp-select__trigger[data-v-e6060752]:focus-visible {
87
+ outline: none;
88
+ border-color: var(--rp-color-control-border-focus);
89
+ box-shadow: 0 0 0 var(--rp-border-width-medium) var(--rp-color-focus-ring);
90
+ }
91
+ .rp-select--radius-xs[data-v-e6060752] {
92
+ --_rp-select-radius: var(--rp-radius-xs);
93
+ }
94
+ .rp-select--radius-sm[data-v-e6060752] {
95
+ --_rp-select-radius: var(--rp-radius-sm);
96
+ }
97
+ .rp-select--radius-md[data-v-e6060752] {
98
+ --_rp-select-radius: var(--rp-radius-md);
99
+ }
100
+ .rp-select--radius-lg[data-v-e6060752] {
101
+ --_rp-select-radius: var(--rp-radius-lg);
102
+ }
103
+ .rp-select--radius-xl[data-v-e6060752] {
104
+ --_rp-select-radius: var(--rp-radius-xl);
105
+ }
106
+ .rp-select--open .rp-select__trigger[data-v-e6060752] {
107
+ border-color: var(--rp-color-control-border-focus);
108
+ box-shadow: 0 0 0 var(--rp-border-width-medium) var(--rp-color-focus-ring);
109
+ }
110
+ .rp-select--invalid .rp-select__trigger[data-v-e6060752] {
111
+ border-color: var(--_rp-select-invalid-border);
112
+ }
113
+ .rp-select--invalid .rp-select__trigger[data-v-e6060752]:focus-visible, .rp-select--open.rp-select--invalid .rp-select__trigger[data-v-e6060752] {
114
+ border-color: var(--_rp-select-invalid-border);
115
+ box-shadow: 0 0 0 var(--rp-border-width-medium) var(--_rp-select-invalid-ring);
116
+ }
117
+ .rp-select__value[data-v-e6060752] {
118
+ flex: 1;
119
+ overflow: hidden;
120
+ text-overflow: ellipsis;
121
+ white-space: nowrap;
122
+ color: var(--rp-color-control-fg);
123
+ }
124
+ .rp-select__placeholder[data-v-e6060752] {
125
+ color: var(--rp-color-control-placeholder);
126
+ }
127
+ .rp-select__indicator[data-v-e6060752] {
128
+ display: inline-flex;
129
+ align-items: center;
130
+ width: 1em;
131
+ height: 1em;
132
+ flex-shrink: 0;
133
+ }
134
+ .rp-select__indicator svg[data-v-e6060752] {
135
+ width: 100%;
136
+ height: 100%;
137
+ }
138
+ .rp-select__indicator[data-v-e6060752] {
139
+ position: relative;
140
+ color: var(--rp-color-control-icon);
141
+ transform: translateX(var(--rp-spacing-1));
142
+ }
143
+ .rp-select__arrow[data-v-e6060752] {
144
+ display: inline-flex;
145
+ align-items: center;
146
+ width: 1em;
147
+ height: 1em;
148
+ flex-shrink: 0;
149
+ }
150
+ .rp-select__arrow svg[data-v-e6060752] {
151
+ width: 100%;
152
+ height: 100%;
153
+ }
154
+ .rp-select__arrow[data-v-e6060752] {
155
+ transition: opacity var(--rp-transition-fast);
156
+ }
157
+ .rp-select__clear[data-v-e6060752] {
158
+ padding: 0;
159
+ font: inherit;
160
+ background: none;
161
+ border: none;
162
+ cursor: pointer;
163
+ display: inline-flex;
164
+ align-items: center;
165
+ width: 1em;
166
+ height: 1em;
167
+ flex-shrink: 0;
168
+ }
169
+ .rp-select__clear svg[data-v-e6060752] {
170
+ width: 100%;
171
+ height: 100%;
172
+ }
173
+ .rp-select__clear[data-v-e6060752] {
174
+ position: absolute;
175
+ inset: 0;
176
+ z-index: 1;
177
+ color: var(--rp-color-control-icon);
178
+ opacity: 0;
179
+ pointer-events: none;
180
+ transition: color var(--rp-transition-fast), opacity var(--rp-transition-fast);
181
+ }
182
+ .rp-select__clear[data-v-e6060752]:hover {
183
+ color: var(--rp-color-control-fg);
184
+ }
185
+ .rp-select__trigger:hover .rp-select__clear[data-v-e6060752] {
186
+ opacity: 1;
187
+ pointer-events: auto;
188
+ }
189
+ .rp-select__trigger:hover .rp-select__clear + .rp-select__arrow[data-v-e6060752] {
190
+ opacity: 0;
191
+ }
192
+ .rp-select__dropdown[data-v-e6060752] {
193
+ position: absolute;
194
+ top: calc(100% + var(--rp-spacing-2));
195
+ left: 0;
196
+ right: 0;
197
+ z-index: 100;
198
+ background-color: var(--rp-color-default);
199
+ border: var(--rp-border-width-thin) solid var(--rp-color-default-border);
200
+ border-radius: var(--_rp-select-radius);
201
+ box-shadow: var(--rp-shadow-md);
202
+ padding: var(--rp-spacing-1) 0;
203
+ max-height: 240px;
204
+ overflow-y: auto;
205
+ padding: var(--rp-spacing-1);
206
+ }
207
+ .rp-select__option[data-v-e6060752] {
208
+ display: flex;
209
+ align-items: center;
210
+ min-height: var(--_rp-select-option-min-height);
211
+ padding: var(--_rp-select-option-padding-y) var(--_rp-select-padding-x);
212
+ border-radius: var(--_rp-select-radius);
213
+ font-size: var(--_rp-select-font-size);
214
+ cursor: pointer;
215
+ transition: color var(--rp-transition-fast);
216
+ color: var(--rp-color-control-fg);
217
+ }
218
+ .rp-select__option--focused[data-v-e6060752] {
219
+ background-color: var(--_rp-select-option-focused-bg);
220
+ }
221
+ .rp-select__option--selected[data-v-e6060752] {
222
+ color: var(--rp-primary-color-light-color);
223
+ }
224
+ .rp-select__option--disabled[data-v-e6060752] {
225
+ color: var(--rp-color-disabled-color);
226
+ cursor: not-allowed;
227
+ }
228
+ .rp-select__empty[data-v-e6060752] {
229
+ display: flex;
230
+ align-items: center;
231
+ justify-content: center;
232
+ padding: var(--rp-spacing-4);
233
+ color: var(--rp-color-dimmed);
234
+ font-size: var(--_rp-select-font-size);
235
+ }
236
+ .rp-select-dropdown-enter-active[data-v-e6060752],
237
+ .rp-select-dropdown-leave-active[data-v-e6060752] {
238
+ transition: opacity var(--rp-transition-fast), transform var(--rp-transition-fast);
239
+ }
240
+ .rp-select-dropdown-enter-from[data-v-e6060752],
241
+ .rp-select-dropdown-leave-to[data-v-e6060752] {
242
+ opacity: 0;
243
+ transform: translateY(calc(-1 * var(--rp-spacing-1)));
244
+ }
243
245
  }