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/toast.js ADDED
@@ -0,0 +1,739 @@
1
+ import './toast.css';
2
+ import { t as x_default } from "./x.js";
3
+ import { t as bem } from "./bem.js";
4
+ import { n as useStylesApi } from "./styles-api.js";
5
+ import { i as getComponentVariantColorRoles, t as componentColors } from "./componentColors.js";
6
+ import { t as _plugin_vue_export_helper_default } from "./_plugin-vue_export-helper.js";
7
+ import { n as useTeleportTarget } from "./useTeleportTarget.js";
8
+ import { VaporTeleport, VaporTransition, VaporTransitionGroup, computed, createComponent, createFor, createIf, createInvoker, createSlot, defineVaporComponent, delegateEvents, extend, inject, nextTick, onBeforeUnmount, onMounted, provide, ref, renderEffect, setDynamicProps, setInsertionState, setText, template, toDisplayString, toValue, txt, unref, useId, useSlots, watch } from "vue";
9
+ //#region src/components/toast/defaults.ts
10
+ var DEFAULT_TOAST_DURATION = 5e3;
11
+ var DEFAULT_TOAST_ROLE = "status";
12
+ var DEFAULT_TOAST_CLOSE_LABEL = "Close toast";
13
+ //#endregion
14
+ //#region src/components/toast/useToastColor.ts
15
+ function getToastColorStyle(color, variant, autoContrast) {
16
+ if (!color && !variant) return void 0;
17
+ const resolvedVariant = variant ?? "surface";
18
+ const roles = getComponentVariantColorRoles({
19
+ color,
20
+ variant: resolvedVariant,
21
+ defaultColor: "cyan",
22
+ autoContrast
23
+ });
24
+ if (!roles) return void 0;
25
+ return {
26
+ "--_rp-toast-bg": roles.background,
27
+ "--_rp-toast-fg": resolvedVariant === "solid" ? roles.color : "var(--rp-color-text)",
28
+ "--_rp-toast-title-fg": resolvedVariant === "solid" ? roles.color : "var(--rp-color-text)",
29
+ "--_rp-toast-icon-fg": roles.color,
30
+ "--_rp-toast-border": roles.border
31
+ };
32
+ }
33
+ //#endregion
34
+ //#region src/components/toast/toast.vue?vue&type=script&setup=true&vapor=true&lang.ts
35
+ var t0$1 = template("<div data-v-6944ac43>");
36
+ var t1 = template(" ");
37
+ var t2 = template("<p data-v-6944ac43> ");
38
+ var t3 = template("<div data-v-6944ac43 class=rp-toast__content>");
39
+ var t4 = template("<button data-v-6944ac43>");
40
+ delegateEvents("click");
41
+ //#endregion
42
+ //#region src/components/toast/toast.vue
43
+ var toast_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__ */ defineVaporComponent({
44
+ name: "RpToast",
45
+ inheritAttrs: false,
46
+ __name: "toast",
47
+ props: {
48
+ open: {
49
+ type: Boolean,
50
+ default: void 0
51
+ },
52
+ title: { default: "" },
53
+ description: { default: "" },
54
+ variant: {},
55
+ color: {},
56
+ autoContrast: { type: Boolean },
57
+ radius: {},
58
+ role: { default: DEFAULT_TOAST_ROLE },
59
+ duration: { default: DEFAULT_TOAST_DURATION },
60
+ pauseOnHover: {
61
+ type: Boolean,
62
+ default: true
63
+ },
64
+ pauseOnFocus: {
65
+ type: Boolean,
66
+ default: true
67
+ },
68
+ closable: {
69
+ type: Boolean,
70
+ default: true
71
+ },
72
+ closeLabel: { default: DEFAULT_TOAST_CLOSE_LABEL },
73
+ classNames: {},
74
+ styles: {}
75
+ },
76
+ emits: [
77
+ "update:open",
78
+ "close",
79
+ "after-leave"
80
+ ],
81
+ setup(__props, { emit: __emit, slots: $slots }) {
82
+ const props = __props;
83
+ const emit = __emit;
84
+ const slots = useSlots();
85
+ const localOpen = ref(props.open ?? true);
86
+ const isMounted = ref(false);
87
+ const pausedByHover = ref(false);
88
+ const pausedByFocus = ref(false);
89
+ let closePending = false;
90
+ let timer;
91
+ let timerStartedAt = 0;
92
+ let remainingDuration = 0;
93
+ watch(() => props.open, (open) => {
94
+ if (open !== void 0) localOpen.value = open;
95
+ if (open) closePending = false;
96
+ });
97
+ watch(() => props.pauseOnHover, (pauseOnHover) => {
98
+ if (pauseOnHover || !pausedByHover.value) return;
99
+ pausedByHover.value = false;
100
+ resumeTimer();
101
+ });
102
+ watch(() => props.pauseOnFocus, (pauseOnFocus) => {
103
+ if (pauseOnFocus || !pausedByFocus.value) return;
104
+ pausedByFocus.value = false;
105
+ resumeTimer();
106
+ });
107
+ const isOpen = computed(() => props.open ?? localOpen.value);
108
+ const hasTitle = computed(() => Boolean(props.title || slots.title));
109
+ const hasDescription = computed(() => Boolean(props.description));
110
+ const hasContent = computed(() => Boolean(hasTitle.value || hasDescription.value || slots.default));
111
+ const resolvedRole = computed(() => props.role === "none" ? void 0 : props.role);
112
+ const hasIcon = computed(() => Boolean(slots.icon));
113
+ const rootClass = computed(() => bem("rp-toast", {
114
+ [props.variant ?? ""]: Boolean(props.variant),
115
+ [`radius-${props.radius}`]: Boolean(props.radius)
116
+ }));
117
+ const rootStyle = computed(() => getToastColorStyle(props.color, props.variant, props.autoContrast));
118
+ const { getPartAttrs, getRootAttrs } = useStylesApi(props, "root");
119
+ const rootAttrs = computed(() => getRootAttrs({
120
+ class: rootClass.value,
121
+ style: rootStyle.value,
122
+ role: resolvedRole.value,
123
+ onMouseenter,
124
+ onMouseleave,
125
+ onFocusin,
126
+ onFocusout
127
+ }));
128
+ watch([isOpen, () => props.duration], ([open], [wasOpen]) => {
129
+ if (!isMounted.value) return;
130
+ if (!open || !wasOpen) {
131
+ pausedByHover.value = false;
132
+ pausedByFocus.value = false;
133
+ }
134
+ resetTimer();
135
+ });
136
+ onMounted(() => {
137
+ isMounted.value = true;
138
+ resetTimer();
139
+ });
140
+ onBeforeUnmount(clearTimer);
141
+ function getDuration() {
142
+ return Number.isFinite(props.duration) && props.duration > 0 ? props.duration : 0;
143
+ }
144
+ function resetTimer() {
145
+ clearTimer();
146
+ remainingDuration = getDuration();
147
+ scheduleTimer();
148
+ }
149
+ function scheduleTimer() {
150
+ if (!isOpen.value || remainingDuration <= 0 || pausedByHover.value || pausedByFocus.value) return;
151
+ timerStartedAt = Date.now();
152
+ timer = setTimeout(() => {
153
+ timer = void 0;
154
+ remainingDuration = 0;
155
+ closeToast("timeout");
156
+ }, remainingDuration);
157
+ }
158
+ function clearTimer() {
159
+ if (timer === void 0) return;
160
+ clearTimeout(timer);
161
+ timer = void 0;
162
+ }
163
+ function pauseTimer() {
164
+ if (timer === void 0) return;
165
+ remainingDuration = Math.max(0, remainingDuration - (Date.now() - timerStartedAt));
166
+ clearTimer();
167
+ if (remainingDuration === 0) closeToast("timeout");
168
+ }
169
+ function resumeTimer() {
170
+ if (pausedByHover.value || pausedByFocus.value) return;
171
+ scheduleTimer();
172
+ }
173
+ function onMouseenter() {
174
+ if (!props.pauseOnHover) return;
175
+ pausedByHover.value = true;
176
+ pauseTimer();
177
+ }
178
+ function onMouseleave() {
179
+ if (!props.pauseOnHover) return;
180
+ pausedByHover.value = false;
181
+ resumeTimer();
182
+ }
183
+ function onFocusin() {
184
+ if (!props.pauseOnFocus) return;
185
+ pausedByFocus.value = true;
186
+ pauseTimer();
187
+ }
188
+ function onFocusout(event) {
189
+ if (!props.pauseOnFocus) return;
190
+ const currentTarget = event.currentTarget;
191
+ if (currentTarget instanceof HTMLElement && event.relatedTarget instanceof Node && currentTarget.contains(event.relatedTarget)) return;
192
+ pausedByFocus.value = false;
193
+ resumeTimer();
194
+ }
195
+ function closeToast(reason) {
196
+ if (closePending) return;
197
+ closePending = true;
198
+ clearTimer();
199
+ localOpen.value = false;
200
+ emit("update:open", false);
201
+ emit("close", reason);
202
+ if (isOpen.value) {
203
+ resetTimer();
204
+ nextTick(() => {
205
+ if (isOpen.value) closePending = false;
206
+ });
207
+ }
208
+ }
209
+ const _on_after_leave = () => emit("after-leave");
210
+ return createComponent(VaporTransition, {
211
+ name: "rp-toast",
212
+ onAfterLeave: () => _on_after_leave
213
+ }, extend(() => {
214
+ return createIf(() => isOpen.value, () => {
215
+ const n30 = t0$1();
216
+ renderEffect(() => setDynamicProps(n30, [rootAttrs.value]));
217
+ setInsertionState(n30, null, 0);
218
+ createIf(() => hasIcon.value, () => {
219
+ const n5 = t0$1();
220
+ renderEffect(() => setDynamicProps(n5, [unref(getPartAttrs)("icon", { class: "rp-toast__icon" }), { "aria-hidden": "true" }]));
221
+ setInsertionState(n5, null, 0);
222
+ createSlot("icon", null, null, 1);
223
+ return n5;
224
+ });
225
+ setInsertionState(n30, null, 1);
226
+ createIf(() => hasContent.value, () => {
227
+ const n21 = t3();
228
+ setInsertionState(n21, null, 0);
229
+ createIf(() => hasTitle.value, () => {
230
+ const n13 = t0$1();
231
+ renderEffect(() => setDynamicProps(n13, [unref(getPartAttrs)("title", { class: "rp-toast__title" })]));
232
+ setInsertionState(n13, null, 0);
233
+ createSlot("title", null, () => {
234
+ const n12 = t1();
235
+ renderEffect(() => setText(n12, toDisplayString(__props.title)));
236
+ return n12;
237
+ }, 1);
238
+ return n13;
239
+ });
240
+ setInsertionState(n21, null, 1);
241
+ createIf(() => hasDescription.value, () => {
242
+ const n16 = t2();
243
+ const x16 = txt(n16);
244
+ renderEffect(() => {
245
+ setDynamicProps(n16, [unref(getPartAttrs)("description", { class: "rp-toast__description" })]);
246
+ setText(x16, toDisplayString(__props.description));
247
+ });
248
+ return n16;
249
+ });
250
+ setInsertionState(n21, null, 2);
251
+ createIf(() => $slots.default, () => {
252
+ const n20 = t0$1();
253
+ renderEffect(() => setDynamicProps(n20, [unref(getPartAttrs)("body", { class: "rp-toast__body" })]));
254
+ setInsertionState(n20, null, 0);
255
+ createSlot("default", null, null, 1);
256
+ return n20;
257
+ });
258
+ return n21;
259
+ });
260
+ setInsertionState(n30, null, 2);
261
+ createIf(() => $slots.action, () => {
262
+ const n25 = t0$1();
263
+ renderEffect(() => setDynamicProps(n25, [unref(getPartAttrs)("action", { class: "rp-toast__action" })]));
264
+ setInsertionState(n25, null, 0);
265
+ createSlot("action", null, null, 1);
266
+ return n25;
267
+ });
268
+ setInsertionState(n30, null, 3);
269
+ createIf(() => __props.closable, () => {
270
+ const n29 = t4();
271
+ renderEffect(() => setDynamicProps(n29, [unref(getPartAttrs)("close", { class: "rp-toast__close" }), {
272
+ type: "button",
273
+ "aria-label": __props.closeLabel
274
+ }]));
275
+ setInsertionState(n29, null, 0);
276
+ createComponent(unref(x_default), { "aria-hidden": "true" });
277
+ n29.$evtclick = createInvoker(() => closeToast("dismiss"));
278
+ return n29;
279
+ });
280
+ return n30;
281
+ }, null, 129);
282
+ }, { _: 8 }), true);
283
+ }
284
+ }), [["__scopeId", "data-v-6944ac43"]]);
285
+ //#endregion
286
+ //#region src/components/toast/types.ts
287
+ var toastParts = [
288
+ "root",
289
+ "icon",
290
+ "title",
291
+ "description",
292
+ "body",
293
+ "action",
294
+ "close"
295
+ ];
296
+ var toastViewportParts = [
297
+ "root",
298
+ "item",
299
+ "toast",
300
+ "toastIcon",
301
+ "toastTitle",
302
+ "toastDescription",
303
+ "toastBody",
304
+ "toastAction",
305
+ "toastClose"
306
+ ];
307
+ var toastColors = componentColors;
308
+ var toastVariants = [
309
+ "subtle",
310
+ "surface",
311
+ "outline",
312
+ "solid"
313
+ ];
314
+ var toastRadiuses = [
315
+ "none",
316
+ "xs",
317
+ "sm",
318
+ "md",
319
+ "lg",
320
+ "xl"
321
+ ];
322
+ var toastPositions = [
323
+ "top-left",
324
+ "top-center",
325
+ "top-right",
326
+ "bottom-left",
327
+ "bottom-center",
328
+ "bottom-right"
329
+ ];
330
+ var toastTypes = [
331
+ "default",
332
+ "success",
333
+ "error",
334
+ "warning",
335
+ "info"
336
+ ];
337
+ var toastProviderKey = Symbol("toast-provider");
338
+ //#endregion
339
+ //#region src/components/toast/useToast.ts
340
+ var TYPE_DEFAULTS = {
341
+ default: {},
342
+ success: { color: "green" },
343
+ error: {
344
+ color: "red",
345
+ role: "alert"
346
+ },
347
+ warning: {
348
+ color: "yellow",
349
+ role: "alert"
350
+ },
351
+ info: { color: "blue" }
352
+ };
353
+ function withoutUndefined(value) {
354
+ return Object.fromEntries(Object.entries(value).filter(([, entry]) => entry !== void 0));
355
+ }
356
+ function normalizeMax(max) {
357
+ if (max === Infinity) return Infinity;
358
+ if (!Number.isFinite(max)) return 5;
359
+ return Math.max(1, Math.floor(max ?? 5));
360
+ }
361
+ function normalizeInput(input, options) {
362
+ return {
363
+ ...typeof input === "string" ? { title: input } : input,
364
+ ...options
365
+ };
366
+ }
367
+ function splitOptions(options) {
368
+ const { id, type, onClose, ...toastProps } = options;
369
+ return {
370
+ id,
371
+ type,
372
+ onClose,
373
+ toastProps: withoutUndefined(toastProps)
374
+ };
375
+ }
376
+ function getProviderDefaults(props) {
377
+ return withoutUndefined({
378
+ duration: props.duration ?? 5e3,
379
+ variant: props.variant,
380
+ color: props.color,
381
+ autoContrast: props.autoContrast,
382
+ radius: props.radius,
383
+ role: props.role,
384
+ pauseOnHover: props.pauseOnHover ?? true,
385
+ pauseOnFocus: props.pauseOnFocus ?? true,
386
+ closable: props.closable ?? true,
387
+ closeLabel: props.closeLabel ?? "Close toast"
388
+ });
389
+ }
390
+ function replaceAt(items, index, value) {
391
+ const nextItems = items.slice();
392
+ nextItems[index] = value;
393
+ return nextItems;
394
+ }
395
+ function notify(item, reason) {
396
+ item.onClose?.(reason);
397
+ }
398
+ function partitionOverflow(items, max) {
399
+ if (max === Infinity || items.length <= max) return {
400
+ kept: items,
401
+ evicted: []
402
+ };
403
+ const overflow = items.length - max;
404
+ return {
405
+ kept: items.slice(overflow),
406
+ evicted: items.slice(0, overflow)
407
+ };
408
+ }
409
+ function provideToast(props) {
410
+ const scopeId = useId();
411
+ const items = ref([]);
412
+ const toasts = computed(() => items.value);
413
+ const records = /* @__PURE__ */ new Map();
414
+ let sequence = 0;
415
+ function createInstanceId() {
416
+ sequence += 1;
417
+ return `${scopeId}-toast-${sequence}`;
418
+ }
419
+ function resolveItem(id, instanceId, record) {
420
+ return {
421
+ id,
422
+ instanceId,
423
+ type: record.type,
424
+ props: {
425
+ ...TYPE_DEFAULTS[record.type],
426
+ ...getProviderDefaults(props),
427
+ ...record.props
428
+ },
429
+ onClose: record.onClose
430
+ };
431
+ }
432
+ function forget(removedItems) {
433
+ for (const item of removedItems) records.delete(item.instanceId);
434
+ }
435
+ function notifyAll(removedItems, reason) {
436
+ for (const item of removedItems) notify(item, reason);
437
+ }
438
+ function create(type, input, options) {
439
+ const split = splitOptions(normalizeInput(input, options));
440
+ const instanceId = createInstanceId();
441
+ const id = split.id ?? instanceId;
442
+ const record = {
443
+ type: split.type ?? type,
444
+ props: split.toastProps,
445
+ onClose: split.onClose
446
+ };
447
+ const item = resolveItem(id, instanceId, record);
448
+ const replaced = items.value.filter((current) => current.id === id);
449
+ const { kept, evicted } = partitionOverflow([...items.value.filter((current) => current.id !== id), item], normalizeMax(props.max));
450
+ records.set(instanceId, record);
451
+ forget([...replaced, ...evicted]);
452
+ items.value = kept;
453
+ notifyAll([...replaced, ...evicted], "dismiss");
454
+ return id;
455
+ }
456
+ function show(input, options) {
457
+ return create("default", input, options);
458
+ }
459
+ function success(input, options) {
460
+ return create("success", input, options);
461
+ }
462
+ function error(input, options) {
463
+ return create("error", input, options);
464
+ }
465
+ function warning(input, options) {
466
+ return create("warning", input, options);
467
+ }
468
+ function info(input, options) {
469
+ return create("info", input, options);
470
+ }
471
+ function update(id, options) {
472
+ const index = items.value.findIndex((item) => item.id === id);
473
+ if (index === -1) return;
474
+ const current = items.value[index];
475
+ const record = records.get(current.instanceId);
476
+ if (!record) return;
477
+ const { type, onClose, ...toastProps } = options;
478
+ const nextRecord = {
479
+ type: type ?? record.type,
480
+ props: {
481
+ ...record.props,
482
+ ...withoutUndefined(toastProps)
483
+ },
484
+ onClose: Object.hasOwn(options, "onClose") ? onClose : record.onClose
485
+ };
486
+ records.set(current.instanceId, nextRecord);
487
+ items.value = replaceAt(items.value, index, resolveItem(current.id, current.instanceId, nextRecord));
488
+ }
489
+ function closeAt(index, reason) {
490
+ if (index === -1) return;
491
+ const current = items.value[index];
492
+ records.delete(current.instanceId);
493
+ items.value = items.value.filter((_, currentIndex) => currentIndex !== index);
494
+ notify(current, reason);
495
+ }
496
+ function dismiss(id, reason = "dismiss") {
497
+ closeAt(items.value.findIndex((item) => item.id === id), reason);
498
+ }
499
+ function dismissInstance(instanceId, reason = "dismiss") {
500
+ closeAt(items.value.findIndex((item) => item.instanceId === instanceId), reason);
501
+ }
502
+ function dismissAll(reason = "dismiss") {
503
+ const dismissed = items.value;
504
+ records.clear();
505
+ items.value = [];
506
+ notifyAll(dismissed, reason);
507
+ }
508
+ const context = {
509
+ toasts,
510
+ show,
511
+ success,
512
+ error,
513
+ warning,
514
+ info,
515
+ update,
516
+ dismiss,
517
+ dismissAll,
518
+ dismissInstance
519
+ };
520
+ provide(toastProviderKey, context);
521
+ watch(() => normalizeMax(props.max), (max) => {
522
+ const { kept, evicted } = partitionOverflow(items.value, max);
523
+ if (evicted.length === 0) return;
524
+ forget(evicted);
525
+ items.value = kept;
526
+ notifyAll(evicted, "dismiss");
527
+ }, { flush: "sync" });
528
+ return context;
529
+ }
530
+ function useToastContext(consumer) {
531
+ const context = inject(toastProviderKey);
532
+ if (!context) throw new Error(`[Ropav] ${consumer} must be used inside <ToastProvider>.`);
533
+ return context;
534
+ }
535
+ function useToast() {
536
+ return useToastContext("useToast()");
537
+ }
538
+ //#endregion
539
+ //#region src/components/toast/toast-provider.vue
540
+ var toast_provider_default = /* @__PURE__ */ defineVaporComponent({
541
+ name: "RpToastProvider",
542
+ __name: "toast-provider",
543
+ props: {
544
+ max: { default: 5 },
545
+ duration: { default: DEFAULT_TOAST_DURATION },
546
+ variant: { default: void 0 },
547
+ color: { default: void 0 },
548
+ autoContrast: {
549
+ type: Boolean,
550
+ default: void 0
551
+ },
552
+ radius: { default: void 0 },
553
+ role: { default: void 0 },
554
+ pauseOnHover: {
555
+ type: Boolean,
556
+ default: true
557
+ },
558
+ pauseOnFocus: {
559
+ type: Boolean,
560
+ default: true
561
+ },
562
+ closable: {
563
+ type: Boolean,
564
+ default: true
565
+ },
566
+ closeLabel: { default: DEFAULT_TOAST_CLOSE_LABEL }
567
+ },
568
+ setup(__props) {
569
+ provideToast(__props);
570
+ return createSlot();
571
+ }
572
+ });
573
+ //#endregion
574
+ //#region src/components/toast/toast-viewport.vue?vue&type=script&setup=true&vapor=true&lang.ts
575
+ var t0 = template("<li data-v-e14bb4e0>");
576
+ //#endregion
577
+ //#region src/components/toast/toast-viewport.vue
578
+ var toast_viewport_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__ */ defineVaporComponent({
579
+ name: "RpToastViewport",
580
+ inheritAttrs: false,
581
+ __name: "toast-viewport",
582
+ props: {
583
+ position: { default: "top-right" },
584
+ label: { default: "Notifications" },
585
+ teleport: {
586
+ type: Boolean,
587
+ default: true
588
+ },
589
+ teleportTo: {},
590
+ classNames: {},
591
+ styles: {}
592
+ },
593
+ setup(__props, { slots: $slots }) {
594
+ const props = __props;
595
+ const resolvedTeleportTo = useTeleportTarget(() => props.teleportTo);
596
+ const context = useToastContext("<ToastViewport>");
597
+ function reverseToasts(toasts) {
598
+ return toasts.map((_, index) => toasts[toasts.length - index - 1]);
599
+ }
600
+ const orderedToasts = computed(() => props.position.startsWith("top") ? reverseToasts(context.toasts.value) : context.toasts.value);
601
+ const { getPartAttrs, getRootAttrs } = useStylesApi(props, "root");
602
+ const rootAttrs = computed(() => getRootAttrs({
603
+ class: [
604
+ "rp-toast-viewport",
605
+ `rp-toast-viewport--${props.position}`,
606
+ { "rp-toast-viewport--empty": orderedToasts.value.length === 0 }
607
+ ],
608
+ "data-position": props.position,
609
+ "aria-label": props.label
610
+ }));
611
+ const viewportToastPartMap = {
612
+ root: "toast",
613
+ icon: "toastIcon",
614
+ title: "toastTitle",
615
+ description: "toastDescription",
616
+ body: "toastBody",
617
+ action: "toastAction",
618
+ close: "toastClose"
619
+ };
620
+ function getToastClassNames(toast) {
621
+ return Object.fromEntries(Object.entries(viewportToastPartMap).map(([toastPart, viewportPart]) => [toastPart, [toast.props.classNames?.[toastPart], props.classNames?.[viewportPart]]]));
622
+ }
623
+ function getToastStyles(toast) {
624
+ return Object.fromEntries(Object.entries(viewportToastPartMap).map(([toastPart, viewportPart]) => [toastPart, [toast.props.styles?.[toastPart], props.styles?.[viewportPart]]]));
625
+ }
626
+ function dismiss(toast) {
627
+ context.dismissInstance(toast.instanceId);
628
+ }
629
+ return createComponent(VaporTeleport, {
630
+ to: () => unref(resolvedTeleportTo),
631
+ disabled: () => !__props.teleport
632
+ }, () => {
633
+ return createComponent(VaporTransitionGroup, {
634
+ tag: "ol",
635
+ name: "rp-toast-viewport-item",
636
+ $: [() => rootAttrs.value]
637
+ }, extend(() => {
638
+ return createFor(() => orderedToasts.value, (_for_item0) => {
639
+ const n10 = t0();
640
+ renderEffect(() => setDynamicProps(n10, [unref(getPartAttrs)("item", { class: "rp-toast-viewport__item" }), { "data-type": _for_item0.value.type }]));
641
+ setInsertionState(n10, null, 0);
642
+ createComponent(toast_default, { $: [() => _for_item0.value.props, {
643
+ open: true,
644
+ "class-names": () => getToastClassNames(_for_item0.value),
645
+ styles: () => getToastStyles(_for_item0.value),
646
+ "data-type": () => _for_item0.value.type,
647
+ onClose: () => ($event) => unref(context).dismissInstance(_for_item0.value.instanceId, $event)
648
+ }] }, { $: [
649
+ () => $slots.icon ? {
650
+ name: "icon",
651
+ fn: () => {
652
+ return createSlot("icon", {
653
+ toast: () => _for_item0.value,
654
+ dismiss: () => (() => dismiss(_for_item0.value))
655
+ }, null, 1);
656
+ }
657
+ } : void 0,
658
+ () => $slots.action ? {
659
+ name: "action",
660
+ fn: () => {
661
+ return createSlot("action", {
662
+ toast: () => _for_item0.value,
663
+ dismiss: () => (() => dismiss(_for_item0.value))
664
+ }, null, 1);
665
+ }
666
+ } : void 0,
667
+ { "default": extend(() => {
668
+ return createIf(() => $slots.default, () => {
669
+ return createSlot("default", {
670
+ toast: () => _for_item0.value,
671
+ dismiss: () => (() => dismiss(_for_item0.value))
672
+ }, null, 1);
673
+ }, null, 129);
674
+ }, { _: 8 }) }
675
+ ] });
676
+ return n10;
677
+ }, (toast) => toast.instanceId, 40);
678
+ }, { _: 8 }));
679
+ }, true);
680
+ }
681
+ }), [["__scopeId", "data-v-e14bb4e0"]]);
682
+ //#endregion
683
+ //#region src/components/toast/useToastState.ts
684
+ function optionValue(value) {
685
+ return toValue(value);
686
+ }
687
+ function useToastState(options = {}) {
688
+ const uncontrolledOpen = ref(options.defaultOpen ?? false);
689
+ const closeReason = ref(null);
690
+ const controlledOpen = computed(() => optionValue(options.open));
691
+ const isOpen = computed(() => controlledOpen.value ?? uncontrolledOpen.value);
692
+ const lastCloseReason = computed(() => closeReason.value);
693
+ watch(controlledOpen, (nextOpen) => {
694
+ if (nextOpen === void 0) return;
695
+ uncontrolledOpen.value = nextOpen;
696
+ if (nextOpen) closeReason.value = null;
697
+ }, {
698
+ flush: "sync",
699
+ immediate: true
700
+ });
701
+ const toastProps = computed(() => ({
702
+ open: isOpen.value,
703
+ "onUpdate:open": setOpen,
704
+ onClose: handleToastClose
705
+ }));
706
+ function setOpen(nextOpen) {
707
+ if (nextOpen === isOpen.value) return;
708
+ if (controlledOpen.value === void 0) uncontrolledOpen.value = nextOpen;
709
+ if (nextOpen) closeReason.value = null;
710
+ options.onOpenChange?.(nextOpen);
711
+ }
712
+ function open() {
713
+ setOpen(true);
714
+ }
715
+ function close(reason = "dismiss") {
716
+ if (!isOpen.value) return;
717
+ setOpen(false);
718
+ handleToastClose(reason);
719
+ }
720
+ function toggle() {
721
+ if (isOpen.value) close();
722
+ else open();
723
+ }
724
+ function handleToastClose(reason) {
725
+ closeReason.value = reason;
726
+ options.onClose?.(reason);
727
+ }
728
+ return {
729
+ isOpen,
730
+ lastCloseReason,
731
+ toastProps,
732
+ setOpen,
733
+ open,
734
+ close,
735
+ toggle
736
+ };
737
+ }
738
+ //#endregion
739
+ export { toastColors as a, toastRadiuses as c, toastViewportParts as d, toast_default as f, useToast as i, toastTypes as l, toast_viewport_default as n, toastParts as o, toast_provider_default as r, toastPositions as s, useToastState as t, toastVariants as u };