groove-dev 0.27.72 → 0.27.73

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 (129) hide show
  1. package/node_modules/@groove-dev/cli/package.json +1 -1
  2. package/node_modules/@groove-dev/daemon/package.json +1 -1
  3. package/node_modules/@groove-dev/daemon/src/api.js +10 -7
  4. package/node_modules/@groove-dev/gui/dist/assets/index-BFc7Ov6v.css +1 -0
  5. package/node_modules/@groove-dev/gui/dist/assets/{index-CHSXqfwy.js → index-Deza1S0i.js} +159 -159
  6. package/node_modules/@groove-dev/gui/dist/index.html +2 -2
  7. package/node_modules/@groove-dev/gui/package.json +1 -1
  8. package/node_modules/@groove-dev/gui/src/components/editor/editor-tabs.jsx +5 -5
  9. package/node_modules/@groove-dev/gui/src/components/settings/ProviderSetupWizard.jsx +7 -2
  10. package/node_modules/@groove-dev/gui/src/stores/groove.js +41 -52
  11. package/node_modules/@groove-dev/gui/src/views/editor.jsx +2 -9
  12. package/package.json +1 -1
  13. package/packages/cli/package.json +1 -1
  14. package/packages/daemon/package.json +1 -1
  15. package/packages/daemon/src/api.js +10 -7
  16. package/packages/gui/dist/assets/index-BFc7Ov6v.css +1 -0
  17. package/packages/gui/dist/assets/{index-CHSXqfwy.js → index-Deza1S0i.js} +159 -159
  18. package/packages/gui/dist/index.html +2 -2
  19. package/packages/gui/package.json +1 -1
  20. package/packages/gui/src/components/editor/editor-tabs.jsx +5 -5
  21. package/packages/gui/src/components/settings/ProviderSetupWizard.jsx +7 -2
  22. package/packages/gui/src/stores/groove.js +41 -52
  23. package/packages/gui/src/views/editor.jsx +2 -9
  24. package/node_modules/@groove-dev/gui/dist/assets/index-74E3YTkT.css +0 -1
  25. package/packages/gui/dist/assets/index-74E3YTkT.css +0 -1
  26. package/packages/gui/node_modules/.vite/deps/@codemirror_autocomplete.js +0 -68
  27. package/packages/gui/node_modules/.vite/deps/@codemirror_autocomplete.js.map +0 -7
  28. package/packages/gui/node_modules/.vite/deps/@codemirror_commands.js +0 -1420
  29. package/packages/gui/node_modules/.vite/deps/@codemirror_commands.js.map +0 -7
  30. package/packages/gui/node_modules/.vite/deps/@codemirror_lang-css.js +0 -17
  31. package/packages/gui/node_modules/.vite/deps/@codemirror_lang-css.js.map +0 -7
  32. package/packages/gui/node_modules/.vite/deps/@codemirror_lang-html.js +0 -22
  33. package/packages/gui/node_modules/.vite/deps/@codemirror_lang-html.js.map +0 -7
  34. package/packages/gui/node_modules/.vite/deps/@codemirror_lang-javascript.js +0 -34
  35. package/packages/gui/node_modules/.vite/deps/@codemirror_lang-javascript.js.map +0 -7
  36. package/packages/gui/node_modules/.vite/deps/@codemirror_lang-json.js +0 -101
  37. package/packages/gui/node_modules/.vite/deps/@codemirror_lang-json.js.map +0 -7
  38. package/packages/gui/node_modules/.vite/deps/@codemirror_lang-markdown.js +0 -2534
  39. package/packages/gui/node_modules/.vite/deps/@codemirror_lang-markdown.js.map +0 -7
  40. package/packages/gui/node_modules/.vite/deps/@codemirror_lang-python.js +0 -789
  41. package/packages/gui/node_modules/.vite/deps/@codemirror_lang-python.js.map +0 -7
  42. package/packages/gui/node_modules/.vite/deps/@codemirror_language.js +0 -115
  43. package/packages/gui/node_modules/.vite/deps/@codemirror_language.js.map +0 -7
  44. package/packages/gui/node_modules/.vite/deps/@codemirror_search.js +0 -1136
  45. package/packages/gui/node_modules/.vite/deps/@codemirror_search.js.map +0 -7
  46. package/packages/gui/node_modules/.vite/deps/@codemirror_state.js +0 -63
  47. package/packages/gui/node_modules/.vite/deps/@codemirror_state.js.map +0 -7
  48. package/packages/gui/node_modules/.vite/deps/@codemirror_theme-one-dark.js +0 -179
  49. package/packages/gui/node_modules/.vite/deps/@codemirror_theme-one-dark.js.map +0 -7
  50. package/packages/gui/node_modules/.vite/deps/@codemirror_view.js +0 -104
  51. package/packages/gui/node_modules/.vite/deps/@codemirror_view.js.map +0 -7
  52. package/packages/gui/node_modules/.vite/deps/@radix-ui_react-context-menu.js +0 -1202
  53. package/packages/gui/node_modules/.vite/deps/@radix-ui_react-context-menu.js.map +0 -7
  54. package/packages/gui/node_modules/.vite/deps/@radix-ui_react-dialog.js +0 -365
  55. package/packages/gui/node_modules/.vite/deps/@radix-ui_react-dialog.js.map +0 -7
  56. package/packages/gui/node_modules/.vite/deps/@radix-ui_react-scroll-area.js +0 -757
  57. package/packages/gui/node_modules/.vite/deps/@radix-ui_react-scroll-area.js.map +0 -7
  58. package/packages/gui/node_modules/.vite/deps/@radix-ui_react-tabs.js +0 -219
  59. package/packages/gui/node_modules/.vite/deps/@radix-ui_react-tabs.js.map +0 -7
  60. package/packages/gui/node_modules/.vite/deps/@radix-ui_react-tooltip.js +0 -562
  61. package/packages/gui/node_modules/.vite/deps/@radix-ui_react-tooltip.js.map +0 -7
  62. package/packages/gui/node_modules/.vite/deps/@xterm_addon-fit.js +0 -46
  63. package/packages/gui/node_modules/.vite/deps/@xterm_addon-fit.js.map +0 -7
  64. package/packages/gui/node_modules/.vite/deps/@xterm_addon-web-links.js +0 -121
  65. package/packages/gui/node_modules/.vite/deps/@xterm_addon-web-links.js.map +0 -7
  66. package/packages/gui/node_modules/.vite/deps/@xterm_xterm.js +0 -9237
  67. package/packages/gui/node_modules/.vite/deps/@xterm_xterm.js.map +0 -7
  68. package/packages/gui/node_modules/.vite/deps/@xyflow_react.js +0 -9934
  69. package/packages/gui/node_modules/.vite/deps/@xyflow_react.js.map +0 -7
  70. package/packages/gui/node_modules/.vite/deps/_metadata.json +0 -259
  71. package/packages/gui/node_modules/.vite/deps/chunk-3EE34IFC.js +0 -5169
  72. package/packages/gui/node_modules/.vite/deps/chunk-3EE34IFC.js.map +0 -7
  73. package/packages/gui/node_modules/.vite/deps/chunk-3IB5EUP7.js +0 -2000
  74. package/packages/gui/node_modules/.vite/deps/chunk-3IB5EUP7.js.map +0 -7
  75. package/packages/gui/node_modules/.vite/deps/chunk-44CLUOQE.js +0 -1776
  76. package/packages/gui/node_modules/.vite/deps/chunk-44CLUOQE.js.map +0 -7
  77. package/packages/gui/node_modules/.vite/deps/chunk-4JHIKDUF.js +0 -435
  78. package/packages/gui/node_modules/.vite/deps/chunk-4JHIKDUF.js.map +0 -7
  79. package/packages/gui/node_modules/.vite/deps/chunk-ACEP5X2F.js +0 -292
  80. package/packages/gui/node_modules/.vite/deps/chunk-ACEP5X2F.js.map +0 -7
  81. package/packages/gui/node_modules/.vite/deps/chunk-CDLO3JFW.js +0 -1004
  82. package/packages/gui/node_modules/.vite/deps/chunk-CDLO3JFW.js.map +0 -7
  83. package/packages/gui/node_modules/.vite/deps/chunk-FOR2E6IR.js +0 -105
  84. package/packages/gui/node_modules/.vite/deps/chunk-FOR2E6IR.js.map +0 -7
  85. package/packages/gui/node_modules/.vite/deps/chunk-HPXOV7QR.js +0 -23
  86. package/packages/gui/node_modules/.vite/deps/chunk-HPXOV7QR.js.map +0 -7
  87. package/packages/gui/node_modules/.vite/deps/chunk-HVFOBSCQ.js +0 -1062
  88. package/packages/gui/node_modules/.vite/deps/chunk-HVFOBSCQ.js.map +0 -7
  89. package/packages/gui/node_modules/.vite/deps/chunk-PGL3TTJA.js +0 -1115
  90. package/packages/gui/node_modules/.vite/deps/chunk-PGL3TTJA.js.map +0 -7
  91. package/packages/gui/node_modules/.vite/deps/chunk-PGMATLPZ.js +0 -2294
  92. package/packages/gui/node_modules/.vite/deps/chunk-PGMATLPZ.js.map +0 -7
  93. package/packages/gui/node_modules/.vite/deps/chunk-PR4QN5HX.js +0 -42
  94. package/packages/gui/node_modules/.vite/deps/chunk-PR4QN5HX.js.map +0 -7
  95. package/packages/gui/node_modules/.vite/deps/chunk-QX3PPTYO.js +0 -315
  96. package/packages/gui/node_modules/.vite/deps/chunk-QX3PPTYO.js.map +0 -7
  97. package/packages/gui/node_modules/.vite/deps/chunk-RE2FU7ZU.js +0 -10985
  98. package/packages/gui/node_modules/.vite/deps/chunk-RE2FU7ZU.js.map +0 -7
  99. package/packages/gui/node_modules/.vite/deps/chunk-SPKVQGZX.js +0 -701
  100. package/packages/gui/node_modules/.vite/deps/chunk-SPKVQGZX.js.map +0 -7
  101. package/packages/gui/node_modules/.vite/deps/chunk-YAD7VOVN.js +0 -280
  102. package/packages/gui/node_modules/.vite/deps/chunk-YAD7VOVN.js.map +0 -7
  103. package/packages/gui/node_modules/.vite/deps/chunk-YEUURE4V.js +0 -264
  104. package/packages/gui/node_modules/.vite/deps/chunk-YEUURE4V.js.map +0 -7
  105. package/packages/gui/node_modules/.vite/deps/chunk-YYJMNVCJ.js +0 -3459
  106. package/packages/gui/node_modules/.vite/deps/chunk-YYJMNVCJ.js.map +0 -7
  107. package/packages/gui/node_modules/.vite/deps/chunk-Z5NIFSCT.js +0 -1106
  108. package/packages/gui/node_modules/.vite/deps/chunk-Z5NIFSCT.js.map +0 -7
  109. package/packages/gui/node_modules/.vite/deps/clsx.js +0 -22
  110. package/packages/gui/node_modules/.vite/deps/clsx.js.map +0 -7
  111. package/packages/gui/node_modules/.vite/deps/framer-motion.js +0 -12732
  112. package/packages/gui/node_modules/.vite/deps/framer-motion.js.map +0 -7
  113. package/packages/gui/node_modules/.vite/deps/lucide-react.js +0 -29653
  114. package/packages/gui/node_modules/.vite/deps/lucide-react.js.map +0 -7
  115. package/packages/gui/node_modules/.vite/deps/package.json +0 -3
  116. package/packages/gui/node_modules/.vite/deps/react-dom.js +0 -6
  117. package/packages/gui/node_modules/.vite/deps/react-dom.js.map +0 -7
  118. package/packages/gui/node_modules/.vite/deps/react-dom_client.js +0 -20217
  119. package/packages/gui/node_modules/.vite/deps/react-dom_client.js.map +0 -7
  120. package/packages/gui/node_modules/.vite/deps/react.js +0 -5
  121. package/packages/gui/node_modules/.vite/deps/react.js.map +0 -7
  122. package/packages/gui/node_modules/.vite/deps/react_jsx-dev-runtime.js +0 -278
  123. package/packages/gui/node_modules/.vite/deps/react_jsx-dev-runtime.js.map +0 -7
  124. package/packages/gui/node_modules/.vite/deps/react_jsx-runtime.js +0 -6
  125. package/packages/gui/node_modules/.vite/deps/react_jsx-runtime.js.map +0 -7
  126. package/packages/gui/node_modules/.vite/deps/tailwind-merge.js +0 -3263
  127. package/packages/gui/node_modules/.vite/deps/tailwind-merge.js.map +0 -7
  128. package/packages/gui/node_modules/.vite/deps/zustand.js +0 -56
  129. package/packages/gui/node_modules/.vite/deps/zustand.js.map +0 -7
@@ -1,757 +0,0 @@
1
- "use client";
2
- import {
3
- useDirection
4
- } from "./chunk-HPXOV7QR.js";
5
- import {
6
- Presence,
7
- Primitive,
8
- composeEventHandlers,
9
- createContextScope,
10
- useCallbackRef,
11
- useComposedRefs,
12
- useLayoutEffect2
13
- } from "./chunk-4JHIKDUF.js";
14
- import "./chunk-YAD7VOVN.js";
15
- import {
16
- require_jsx_runtime
17
- } from "./chunk-ACEP5X2F.js";
18
- import {
19
- require_react
20
- } from "./chunk-CDLO3JFW.js";
21
- import {
22
- __toESM
23
- } from "./chunk-PR4QN5HX.js";
24
-
25
- // ../../node_modules/@radix-ui/react-scroll-area/dist/index.mjs
26
- var React2 = __toESM(require_react(), 1);
27
-
28
- // ../../node_modules/@radix-ui/number/dist/index.mjs
29
- function clamp(value, [min, max]) {
30
- return Math.min(max, Math.max(min, value));
31
- }
32
-
33
- // ../../node_modules/@radix-ui/react-scroll-area/dist/index.mjs
34
- var React = __toESM(require_react(), 1);
35
- var import_jsx_runtime = __toESM(require_jsx_runtime(), 1);
36
- function useStateMachine(initialState, machine) {
37
- return React.useReducer((state, event) => {
38
- const nextState = machine[state][event];
39
- return nextState ?? state;
40
- }, initialState);
41
- }
42
- var SCROLL_AREA_NAME = "ScrollArea";
43
- var [createScrollAreaContext, createScrollAreaScope] = createContextScope(SCROLL_AREA_NAME);
44
- var [ScrollAreaProvider, useScrollAreaContext] = createScrollAreaContext(SCROLL_AREA_NAME);
45
- var ScrollArea = React2.forwardRef(
46
- (props, forwardedRef) => {
47
- const {
48
- __scopeScrollArea,
49
- type = "hover",
50
- dir,
51
- scrollHideDelay = 600,
52
- ...scrollAreaProps
53
- } = props;
54
- const [scrollArea, setScrollArea] = React2.useState(null);
55
- const [viewport, setViewport] = React2.useState(null);
56
- const [content, setContent] = React2.useState(null);
57
- const [scrollbarX, setScrollbarX] = React2.useState(null);
58
- const [scrollbarY, setScrollbarY] = React2.useState(null);
59
- const [cornerWidth, setCornerWidth] = React2.useState(0);
60
- const [cornerHeight, setCornerHeight] = React2.useState(0);
61
- const [scrollbarXEnabled, setScrollbarXEnabled] = React2.useState(false);
62
- const [scrollbarYEnabled, setScrollbarYEnabled] = React2.useState(false);
63
- const composedRefs = useComposedRefs(forwardedRef, (node) => setScrollArea(node));
64
- const direction = useDirection(dir);
65
- return (0, import_jsx_runtime.jsx)(
66
- ScrollAreaProvider,
67
- {
68
- scope: __scopeScrollArea,
69
- type,
70
- dir: direction,
71
- scrollHideDelay,
72
- scrollArea,
73
- viewport,
74
- onViewportChange: setViewport,
75
- content,
76
- onContentChange: setContent,
77
- scrollbarX,
78
- onScrollbarXChange: setScrollbarX,
79
- scrollbarXEnabled,
80
- onScrollbarXEnabledChange: setScrollbarXEnabled,
81
- scrollbarY,
82
- onScrollbarYChange: setScrollbarY,
83
- scrollbarYEnabled,
84
- onScrollbarYEnabledChange: setScrollbarYEnabled,
85
- onCornerWidthChange: setCornerWidth,
86
- onCornerHeightChange: setCornerHeight,
87
- children: (0, import_jsx_runtime.jsx)(
88
- Primitive.div,
89
- {
90
- dir: direction,
91
- ...scrollAreaProps,
92
- ref: composedRefs,
93
- style: {
94
- position: "relative",
95
- // Pass corner sizes as CSS vars to reduce re-renders of context consumers
96
- ["--radix-scroll-area-corner-width"]: cornerWidth + "px",
97
- ["--radix-scroll-area-corner-height"]: cornerHeight + "px",
98
- ...props.style
99
- }
100
- }
101
- )
102
- }
103
- );
104
- }
105
- );
106
- ScrollArea.displayName = SCROLL_AREA_NAME;
107
- var VIEWPORT_NAME = "ScrollAreaViewport";
108
- var ScrollAreaViewport = React2.forwardRef(
109
- (props, forwardedRef) => {
110
- const { __scopeScrollArea, children, nonce, ...viewportProps } = props;
111
- const context = useScrollAreaContext(VIEWPORT_NAME, __scopeScrollArea);
112
- const ref = React2.useRef(null);
113
- const composedRefs = useComposedRefs(forwardedRef, ref, context.onViewportChange);
114
- return (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
115
- (0, import_jsx_runtime.jsx)(
116
- "style",
117
- {
118
- dangerouslySetInnerHTML: {
119
- __html: `[data-radix-scroll-area-viewport]{scrollbar-width:none;-ms-overflow-style:none;-webkit-overflow-scrolling:touch;}[data-radix-scroll-area-viewport]::-webkit-scrollbar{display:none}`
120
- },
121
- nonce
122
- }
123
- ),
124
- (0, import_jsx_runtime.jsx)(
125
- Primitive.div,
126
- {
127
- "data-radix-scroll-area-viewport": "",
128
- ...viewportProps,
129
- ref: composedRefs,
130
- style: {
131
- /**
132
- * We don't support `visible` because the intention is to have at least one scrollbar
133
- * if this component is used and `visible` will behave like `auto` in that case
134
- * https://developer.mozilla.org/en-US/docs/Web/CSS/overflow#description
135
- *
136
- * We don't handle `auto` because the intention is for the native implementation
137
- * to be hidden if using this component. We just want to ensure the node is scrollable
138
- * so could have used either `scroll` or `auto` here. We picked `scroll` to prevent
139
- * the browser from having to work out whether to render native scrollbars or not,
140
- * we tell it to with the intention of hiding them in CSS.
141
- */
142
- overflowX: context.scrollbarXEnabled ? "scroll" : "hidden",
143
- overflowY: context.scrollbarYEnabled ? "scroll" : "hidden",
144
- ...props.style
145
- },
146
- children: (0, import_jsx_runtime.jsx)("div", { ref: context.onContentChange, style: { minWidth: "100%", display: "table" }, children })
147
- }
148
- )
149
- ] });
150
- }
151
- );
152
- ScrollAreaViewport.displayName = VIEWPORT_NAME;
153
- var SCROLLBAR_NAME = "ScrollAreaScrollbar";
154
- var ScrollAreaScrollbar = React2.forwardRef(
155
- (props, forwardedRef) => {
156
- const { forceMount, ...scrollbarProps } = props;
157
- const context = useScrollAreaContext(SCROLLBAR_NAME, props.__scopeScrollArea);
158
- const { onScrollbarXEnabledChange, onScrollbarYEnabledChange } = context;
159
- const isHorizontal = props.orientation === "horizontal";
160
- React2.useEffect(() => {
161
- isHorizontal ? onScrollbarXEnabledChange(true) : onScrollbarYEnabledChange(true);
162
- return () => {
163
- isHorizontal ? onScrollbarXEnabledChange(false) : onScrollbarYEnabledChange(false);
164
- };
165
- }, [isHorizontal, onScrollbarXEnabledChange, onScrollbarYEnabledChange]);
166
- return context.type === "hover" ? (0, import_jsx_runtime.jsx)(ScrollAreaScrollbarHover, { ...scrollbarProps, ref: forwardedRef, forceMount }) : context.type === "scroll" ? (0, import_jsx_runtime.jsx)(ScrollAreaScrollbarScroll, { ...scrollbarProps, ref: forwardedRef, forceMount }) : context.type === "auto" ? (0, import_jsx_runtime.jsx)(ScrollAreaScrollbarAuto, { ...scrollbarProps, ref: forwardedRef, forceMount }) : context.type === "always" ? (0, import_jsx_runtime.jsx)(ScrollAreaScrollbarVisible, { ...scrollbarProps, ref: forwardedRef }) : null;
167
- }
168
- );
169
- ScrollAreaScrollbar.displayName = SCROLLBAR_NAME;
170
- var ScrollAreaScrollbarHover = React2.forwardRef((props, forwardedRef) => {
171
- const { forceMount, ...scrollbarProps } = props;
172
- const context = useScrollAreaContext(SCROLLBAR_NAME, props.__scopeScrollArea);
173
- const [visible, setVisible] = React2.useState(false);
174
- React2.useEffect(() => {
175
- const scrollArea = context.scrollArea;
176
- let hideTimer = 0;
177
- if (scrollArea) {
178
- const handlePointerEnter = () => {
179
- window.clearTimeout(hideTimer);
180
- setVisible(true);
181
- };
182
- const handlePointerLeave = () => {
183
- hideTimer = window.setTimeout(() => setVisible(false), context.scrollHideDelay);
184
- };
185
- scrollArea.addEventListener("pointerenter", handlePointerEnter);
186
- scrollArea.addEventListener("pointerleave", handlePointerLeave);
187
- return () => {
188
- window.clearTimeout(hideTimer);
189
- scrollArea.removeEventListener("pointerenter", handlePointerEnter);
190
- scrollArea.removeEventListener("pointerleave", handlePointerLeave);
191
- };
192
- }
193
- }, [context.scrollArea, context.scrollHideDelay]);
194
- return (0, import_jsx_runtime.jsx)(Presence, { present: forceMount || visible, children: (0, import_jsx_runtime.jsx)(
195
- ScrollAreaScrollbarAuto,
196
- {
197
- "data-state": visible ? "visible" : "hidden",
198
- ...scrollbarProps,
199
- ref: forwardedRef
200
- }
201
- ) });
202
- });
203
- var ScrollAreaScrollbarScroll = React2.forwardRef((props, forwardedRef) => {
204
- const { forceMount, ...scrollbarProps } = props;
205
- const context = useScrollAreaContext(SCROLLBAR_NAME, props.__scopeScrollArea);
206
- const isHorizontal = props.orientation === "horizontal";
207
- const debounceScrollEnd = useDebounceCallback(() => send("SCROLL_END"), 100);
208
- const [state, send] = useStateMachine("hidden", {
209
- hidden: {
210
- SCROLL: "scrolling"
211
- },
212
- scrolling: {
213
- SCROLL_END: "idle",
214
- POINTER_ENTER: "interacting"
215
- },
216
- interacting: {
217
- SCROLL: "interacting",
218
- POINTER_LEAVE: "idle"
219
- },
220
- idle: {
221
- HIDE: "hidden",
222
- SCROLL: "scrolling",
223
- POINTER_ENTER: "interacting"
224
- }
225
- });
226
- React2.useEffect(() => {
227
- if (state === "idle") {
228
- const hideTimer = window.setTimeout(() => send("HIDE"), context.scrollHideDelay);
229
- return () => window.clearTimeout(hideTimer);
230
- }
231
- }, [state, context.scrollHideDelay, send]);
232
- React2.useEffect(() => {
233
- const viewport = context.viewport;
234
- const scrollDirection = isHorizontal ? "scrollLeft" : "scrollTop";
235
- if (viewport) {
236
- let prevScrollPos = viewport[scrollDirection];
237
- const handleScroll = () => {
238
- const scrollPos = viewport[scrollDirection];
239
- const hasScrollInDirectionChanged = prevScrollPos !== scrollPos;
240
- if (hasScrollInDirectionChanged) {
241
- send("SCROLL");
242
- debounceScrollEnd();
243
- }
244
- prevScrollPos = scrollPos;
245
- };
246
- viewport.addEventListener("scroll", handleScroll);
247
- return () => viewport.removeEventListener("scroll", handleScroll);
248
- }
249
- }, [context.viewport, isHorizontal, send, debounceScrollEnd]);
250
- return (0, import_jsx_runtime.jsx)(Presence, { present: forceMount || state !== "hidden", children: (0, import_jsx_runtime.jsx)(
251
- ScrollAreaScrollbarVisible,
252
- {
253
- "data-state": state === "hidden" ? "hidden" : "visible",
254
- ...scrollbarProps,
255
- ref: forwardedRef,
256
- onPointerEnter: composeEventHandlers(props.onPointerEnter, () => send("POINTER_ENTER")),
257
- onPointerLeave: composeEventHandlers(props.onPointerLeave, () => send("POINTER_LEAVE"))
258
- }
259
- ) });
260
- });
261
- var ScrollAreaScrollbarAuto = React2.forwardRef((props, forwardedRef) => {
262
- const context = useScrollAreaContext(SCROLLBAR_NAME, props.__scopeScrollArea);
263
- const { forceMount, ...scrollbarProps } = props;
264
- const [visible, setVisible] = React2.useState(false);
265
- const isHorizontal = props.orientation === "horizontal";
266
- const handleResize = useDebounceCallback(() => {
267
- if (context.viewport) {
268
- const isOverflowX = context.viewport.offsetWidth < context.viewport.scrollWidth;
269
- const isOverflowY = context.viewport.offsetHeight < context.viewport.scrollHeight;
270
- setVisible(isHorizontal ? isOverflowX : isOverflowY);
271
- }
272
- }, 10);
273
- useResizeObserver(context.viewport, handleResize);
274
- useResizeObserver(context.content, handleResize);
275
- return (0, import_jsx_runtime.jsx)(Presence, { present: forceMount || visible, children: (0, import_jsx_runtime.jsx)(
276
- ScrollAreaScrollbarVisible,
277
- {
278
- "data-state": visible ? "visible" : "hidden",
279
- ...scrollbarProps,
280
- ref: forwardedRef
281
- }
282
- ) });
283
- });
284
- var ScrollAreaScrollbarVisible = React2.forwardRef((props, forwardedRef) => {
285
- const { orientation = "vertical", ...scrollbarProps } = props;
286
- const context = useScrollAreaContext(SCROLLBAR_NAME, props.__scopeScrollArea);
287
- const thumbRef = React2.useRef(null);
288
- const pointerOffsetRef = React2.useRef(0);
289
- const [sizes, setSizes] = React2.useState({
290
- content: 0,
291
- viewport: 0,
292
- scrollbar: { size: 0, paddingStart: 0, paddingEnd: 0 }
293
- });
294
- const thumbRatio = getThumbRatio(sizes.viewport, sizes.content);
295
- const commonProps = {
296
- ...scrollbarProps,
297
- sizes,
298
- onSizesChange: setSizes,
299
- hasThumb: Boolean(thumbRatio > 0 && thumbRatio < 1),
300
- onThumbChange: (thumb) => thumbRef.current = thumb,
301
- onThumbPointerUp: () => pointerOffsetRef.current = 0,
302
- onThumbPointerDown: (pointerPos) => pointerOffsetRef.current = pointerPos
303
- };
304
- function getScrollPosition(pointerPos, dir) {
305
- return getScrollPositionFromPointer(pointerPos, pointerOffsetRef.current, sizes, dir);
306
- }
307
- if (orientation === "horizontal") {
308
- return (0, import_jsx_runtime.jsx)(
309
- ScrollAreaScrollbarX,
310
- {
311
- ...commonProps,
312
- ref: forwardedRef,
313
- onThumbPositionChange: () => {
314
- if (context.viewport && thumbRef.current) {
315
- const scrollPos = context.viewport.scrollLeft;
316
- const offset = getThumbOffsetFromScroll(scrollPos, sizes, context.dir);
317
- thumbRef.current.style.transform = `translate3d(${offset}px, 0, 0)`;
318
- }
319
- },
320
- onWheelScroll: (scrollPos) => {
321
- if (context.viewport) context.viewport.scrollLeft = scrollPos;
322
- },
323
- onDragScroll: (pointerPos) => {
324
- if (context.viewport) {
325
- context.viewport.scrollLeft = getScrollPosition(pointerPos, context.dir);
326
- }
327
- }
328
- }
329
- );
330
- }
331
- if (orientation === "vertical") {
332
- return (0, import_jsx_runtime.jsx)(
333
- ScrollAreaScrollbarY,
334
- {
335
- ...commonProps,
336
- ref: forwardedRef,
337
- onThumbPositionChange: () => {
338
- if (context.viewport && thumbRef.current) {
339
- const scrollPos = context.viewport.scrollTop;
340
- const offset = getThumbOffsetFromScroll(scrollPos, sizes);
341
- thumbRef.current.style.transform = `translate3d(0, ${offset}px, 0)`;
342
- }
343
- },
344
- onWheelScroll: (scrollPos) => {
345
- if (context.viewport) context.viewport.scrollTop = scrollPos;
346
- },
347
- onDragScroll: (pointerPos) => {
348
- if (context.viewport) context.viewport.scrollTop = getScrollPosition(pointerPos);
349
- }
350
- }
351
- );
352
- }
353
- return null;
354
- });
355
- var ScrollAreaScrollbarX = React2.forwardRef((props, forwardedRef) => {
356
- const { sizes, onSizesChange, ...scrollbarProps } = props;
357
- const context = useScrollAreaContext(SCROLLBAR_NAME, props.__scopeScrollArea);
358
- const [computedStyle, setComputedStyle] = React2.useState();
359
- const ref = React2.useRef(null);
360
- const composeRefs = useComposedRefs(forwardedRef, ref, context.onScrollbarXChange);
361
- React2.useEffect(() => {
362
- if (ref.current) setComputedStyle(getComputedStyle(ref.current));
363
- }, [ref]);
364
- return (0, import_jsx_runtime.jsx)(
365
- ScrollAreaScrollbarImpl,
366
- {
367
- "data-orientation": "horizontal",
368
- ...scrollbarProps,
369
- ref: composeRefs,
370
- sizes,
371
- style: {
372
- bottom: 0,
373
- left: context.dir === "rtl" ? "var(--radix-scroll-area-corner-width)" : 0,
374
- right: context.dir === "ltr" ? "var(--radix-scroll-area-corner-width)" : 0,
375
- ["--radix-scroll-area-thumb-width"]: getThumbSize(sizes) + "px",
376
- ...props.style
377
- },
378
- onThumbPointerDown: (pointerPos) => props.onThumbPointerDown(pointerPos.x),
379
- onDragScroll: (pointerPos) => props.onDragScroll(pointerPos.x),
380
- onWheelScroll: (event, maxScrollPos) => {
381
- if (context.viewport) {
382
- const scrollPos = context.viewport.scrollLeft + event.deltaX;
383
- props.onWheelScroll(scrollPos);
384
- if (isScrollingWithinScrollbarBounds(scrollPos, maxScrollPos)) {
385
- event.preventDefault();
386
- }
387
- }
388
- },
389
- onResize: () => {
390
- if (ref.current && context.viewport && computedStyle) {
391
- onSizesChange({
392
- content: context.viewport.scrollWidth,
393
- viewport: context.viewport.offsetWidth,
394
- scrollbar: {
395
- size: ref.current.clientWidth,
396
- paddingStart: toInt(computedStyle.paddingLeft),
397
- paddingEnd: toInt(computedStyle.paddingRight)
398
- }
399
- });
400
- }
401
- }
402
- }
403
- );
404
- });
405
- var ScrollAreaScrollbarY = React2.forwardRef((props, forwardedRef) => {
406
- const { sizes, onSizesChange, ...scrollbarProps } = props;
407
- const context = useScrollAreaContext(SCROLLBAR_NAME, props.__scopeScrollArea);
408
- const [computedStyle, setComputedStyle] = React2.useState();
409
- const ref = React2.useRef(null);
410
- const composeRefs = useComposedRefs(forwardedRef, ref, context.onScrollbarYChange);
411
- React2.useEffect(() => {
412
- if (ref.current) setComputedStyle(getComputedStyle(ref.current));
413
- }, [ref]);
414
- return (0, import_jsx_runtime.jsx)(
415
- ScrollAreaScrollbarImpl,
416
- {
417
- "data-orientation": "vertical",
418
- ...scrollbarProps,
419
- ref: composeRefs,
420
- sizes,
421
- style: {
422
- top: 0,
423
- right: context.dir === "ltr" ? 0 : void 0,
424
- left: context.dir === "rtl" ? 0 : void 0,
425
- bottom: "var(--radix-scroll-area-corner-height)",
426
- ["--radix-scroll-area-thumb-height"]: getThumbSize(sizes) + "px",
427
- ...props.style
428
- },
429
- onThumbPointerDown: (pointerPos) => props.onThumbPointerDown(pointerPos.y),
430
- onDragScroll: (pointerPos) => props.onDragScroll(pointerPos.y),
431
- onWheelScroll: (event, maxScrollPos) => {
432
- if (context.viewport) {
433
- const scrollPos = context.viewport.scrollTop + event.deltaY;
434
- props.onWheelScroll(scrollPos);
435
- if (isScrollingWithinScrollbarBounds(scrollPos, maxScrollPos)) {
436
- event.preventDefault();
437
- }
438
- }
439
- },
440
- onResize: () => {
441
- if (ref.current && context.viewport && computedStyle) {
442
- onSizesChange({
443
- content: context.viewport.scrollHeight,
444
- viewport: context.viewport.offsetHeight,
445
- scrollbar: {
446
- size: ref.current.clientHeight,
447
- paddingStart: toInt(computedStyle.paddingTop),
448
- paddingEnd: toInt(computedStyle.paddingBottom)
449
- }
450
- });
451
- }
452
- }
453
- }
454
- );
455
- });
456
- var [ScrollbarProvider, useScrollbarContext] = createScrollAreaContext(SCROLLBAR_NAME);
457
- var ScrollAreaScrollbarImpl = React2.forwardRef((props, forwardedRef) => {
458
- const {
459
- __scopeScrollArea,
460
- sizes,
461
- hasThumb,
462
- onThumbChange,
463
- onThumbPointerUp,
464
- onThumbPointerDown,
465
- onThumbPositionChange,
466
- onDragScroll,
467
- onWheelScroll,
468
- onResize,
469
- ...scrollbarProps
470
- } = props;
471
- const context = useScrollAreaContext(SCROLLBAR_NAME, __scopeScrollArea);
472
- const [scrollbar, setScrollbar] = React2.useState(null);
473
- const composeRefs = useComposedRefs(forwardedRef, (node) => setScrollbar(node));
474
- const rectRef = React2.useRef(null);
475
- const prevWebkitUserSelectRef = React2.useRef("");
476
- const viewport = context.viewport;
477
- const maxScrollPos = sizes.content - sizes.viewport;
478
- const handleWheelScroll = useCallbackRef(onWheelScroll);
479
- const handleThumbPositionChange = useCallbackRef(onThumbPositionChange);
480
- const handleResize = useDebounceCallback(onResize, 10);
481
- function handleDragScroll(event) {
482
- if (rectRef.current) {
483
- const x = event.clientX - rectRef.current.left;
484
- const y = event.clientY - rectRef.current.top;
485
- onDragScroll({ x, y });
486
- }
487
- }
488
- React2.useEffect(() => {
489
- const handleWheel = (event) => {
490
- const element = event.target;
491
- const isScrollbarWheel = scrollbar == null ? void 0 : scrollbar.contains(element);
492
- if (isScrollbarWheel) handleWheelScroll(event, maxScrollPos);
493
- };
494
- document.addEventListener("wheel", handleWheel, { passive: false });
495
- return () => document.removeEventListener("wheel", handleWheel, { passive: false });
496
- }, [viewport, scrollbar, maxScrollPos, handleWheelScroll]);
497
- React2.useEffect(handleThumbPositionChange, [sizes, handleThumbPositionChange]);
498
- useResizeObserver(scrollbar, handleResize);
499
- useResizeObserver(context.content, handleResize);
500
- return (0, import_jsx_runtime.jsx)(
501
- ScrollbarProvider,
502
- {
503
- scope: __scopeScrollArea,
504
- scrollbar,
505
- hasThumb,
506
- onThumbChange: useCallbackRef(onThumbChange),
507
- onThumbPointerUp: useCallbackRef(onThumbPointerUp),
508
- onThumbPositionChange: handleThumbPositionChange,
509
- onThumbPointerDown: useCallbackRef(onThumbPointerDown),
510
- children: (0, import_jsx_runtime.jsx)(
511
- Primitive.div,
512
- {
513
- ...scrollbarProps,
514
- ref: composeRefs,
515
- style: { position: "absolute", ...scrollbarProps.style },
516
- onPointerDown: composeEventHandlers(props.onPointerDown, (event) => {
517
- const mainPointer = 0;
518
- if (event.button === mainPointer) {
519
- const element = event.target;
520
- element.setPointerCapture(event.pointerId);
521
- rectRef.current = scrollbar.getBoundingClientRect();
522
- prevWebkitUserSelectRef.current = document.body.style.webkitUserSelect;
523
- document.body.style.webkitUserSelect = "none";
524
- if (context.viewport) context.viewport.style.scrollBehavior = "auto";
525
- handleDragScroll(event);
526
- }
527
- }),
528
- onPointerMove: composeEventHandlers(props.onPointerMove, handleDragScroll),
529
- onPointerUp: composeEventHandlers(props.onPointerUp, (event) => {
530
- const element = event.target;
531
- if (element.hasPointerCapture(event.pointerId)) {
532
- element.releasePointerCapture(event.pointerId);
533
- }
534
- document.body.style.webkitUserSelect = prevWebkitUserSelectRef.current;
535
- if (context.viewport) context.viewport.style.scrollBehavior = "";
536
- rectRef.current = null;
537
- })
538
- }
539
- )
540
- }
541
- );
542
- });
543
- var THUMB_NAME = "ScrollAreaThumb";
544
- var ScrollAreaThumb = React2.forwardRef(
545
- (props, forwardedRef) => {
546
- const { forceMount, ...thumbProps } = props;
547
- const scrollbarContext = useScrollbarContext(THUMB_NAME, props.__scopeScrollArea);
548
- return (0, import_jsx_runtime.jsx)(Presence, { present: forceMount || scrollbarContext.hasThumb, children: (0, import_jsx_runtime.jsx)(ScrollAreaThumbImpl, { ref: forwardedRef, ...thumbProps }) });
549
- }
550
- );
551
- var ScrollAreaThumbImpl = React2.forwardRef(
552
- (props, forwardedRef) => {
553
- const { __scopeScrollArea, style, ...thumbProps } = props;
554
- const scrollAreaContext = useScrollAreaContext(THUMB_NAME, __scopeScrollArea);
555
- const scrollbarContext = useScrollbarContext(THUMB_NAME, __scopeScrollArea);
556
- const { onThumbPositionChange } = scrollbarContext;
557
- const composedRef = useComposedRefs(
558
- forwardedRef,
559
- (node) => scrollbarContext.onThumbChange(node)
560
- );
561
- const removeUnlinkedScrollListenerRef = React2.useRef(void 0);
562
- const debounceScrollEnd = useDebounceCallback(() => {
563
- if (removeUnlinkedScrollListenerRef.current) {
564
- removeUnlinkedScrollListenerRef.current();
565
- removeUnlinkedScrollListenerRef.current = void 0;
566
- }
567
- }, 100);
568
- React2.useEffect(() => {
569
- const viewport = scrollAreaContext.viewport;
570
- if (viewport) {
571
- const handleScroll = () => {
572
- debounceScrollEnd();
573
- if (!removeUnlinkedScrollListenerRef.current) {
574
- const listener = addUnlinkedScrollListener(viewport, onThumbPositionChange);
575
- removeUnlinkedScrollListenerRef.current = listener;
576
- onThumbPositionChange();
577
- }
578
- };
579
- onThumbPositionChange();
580
- viewport.addEventListener("scroll", handleScroll);
581
- return () => viewport.removeEventListener("scroll", handleScroll);
582
- }
583
- }, [scrollAreaContext.viewport, debounceScrollEnd, onThumbPositionChange]);
584
- return (0, import_jsx_runtime.jsx)(
585
- Primitive.div,
586
- {
587
- "data-state": scrollbarContext.hasThumb ? "visible" : "hidden",
588
- ...thumbProps,
589
- ref: composedRef,
590
- style: {
591
- width: "var(--radix-scroll-area-thumb-width)",
592
- height: "var(--radix-scroll-area-thumb-height)",
593
- ...style
594
- },
595
- onPointerDownCapture: composeEventHandlers(props.onPointerDownCapture, (event) => {
596
- const thumb = event.target;
597
- const thumbRect = thumb.getBoundingClientRect();
598
- const x = event.clientX - thumbRect.left;
599
- const y = event.clientY - thumbRect.top;
600
- scrollbarContext.onThumbPointerDown({ x, y });
601
- }),
602
- onPointerUp: composeEventHandlers(props.onPointerUp, scrollbarContext.onThumbPointerUp)
603
- }
604
- );
605
- }
606
- );
607
- ScrollAreaThumb.displayName = THUMB_NAME;
608
- var CORNER_NAME = "ScrollAreaCorner";
609
- var ScrollAreaCorner = React2.forwardRef(
610
- (props, forwardedRef) => {
611
- const context = useScrollAreaContext(CORNER_NAME, props.__scopeScrollArea);
612
- const hasBothScrollbarsVisible = Boolean(context.scrollbarX && context.scrollbarY);
613
- const hasCorner = context.type !== "scroll" && hasBothScrollbarsVisible;
614
- return hasCorner ? (0, import_jsx_runtime.jsx)(ScrollAreaCornerImpl, { ...props, ref: forwardedRef }) : null;
615
- }
616
- );
617
- ScrollAreaCorner.displayName = CORNER_NAME;
618
- var ScrollAreaCornerImpl = React2.forwardRef((props, forwardedRef) => {
619
- const { __scopeScrollArea, ...cornerProps } = props;
620
- const context = useScrollAreaContext(CORNER_NAME, __scopeScrollArea);
621
- const [width, setWidth] = React2.useState(0);
622
- const [height, setHeight] = React2.useState(0);
623
- const hasSize = Boolean(width && height);
624
- useResizeObserver(context.scrollbarX, () => {
625
- var _a;
626
- const height2 = ((_a = context.scrollbarX) == null ? void 0 : _a.offsetHeight) || 0;
627
- context.onCornerHeightChange(height2);
628
- setHeight(height2);
629
- });
630
- useResizeObserver(context.scrollbarY, () => {
631
- var _a;
632
- const width2 = ((_a = context.scrollbarY) == null ? void 0 : _a.offsetWidth) || 0;
633
- context.onCornerWidthChange(width2);
634
- setWidth(width2);
635
- });
636
- return hasSize ? (0, import_jsx_runtime.jsx)(
637
- Primitive.div,
638
- {
639
- ...cornerProps,
640
- ref: forwardedRef,
641
- style: {
642
- width,
643
- height,
644
- position: "absolute",
645
- right: context.dir === "ltr" ? 0 : void 0,
646
- left: context.dir === "rtl" ? 0 : void 0,
647
- bottom: 0,
648
- ...props.style
649
- }
650
- }
651
- ) : null;
652
- });
653
- function toInt(value) {
654
- return value ? parseInt(value, 10) : 0;
655
- }
656
- function getThumbRatio(viewportSize, contentSize) {
657
- const ratio = viewportSize / contentSize;
658
- return isNaN(ratio) ? 0 : ratio;
659
- }
660
- function getThumbSize(sizes) {
661
- const ratio = getThumbRatio(sizes.viewport, sizes.content);
662
- const scrollbarPadding = sizes.scrollbar.paddingStart + sizes.scrollbar.paddingEnd;
663
- const thumbSize = (sizes.scrollbar.size - scrollbarPadding) * ratio;
664
- return Math.max(thumbSize, 18);
665
- }
666
- function getScrollPositionFromPointer(pointerPos, pointerOffset, sizes, dir = "ltr") {
667
- const thumbSizePx = getThumbSize(sizes);
668
- const thumbCenter = thumbSizePx / 2;
669
- const offset = pointerOffset || thumbCenter;
670
- const thumbOffsetFromEnd = thumbSizePx - offset;
671
- const minPointerPos = sizes.scrollbar.paddingStart + offset;
672
- const maxPointerPos = sizes.scrollbar.size - sizes.scrollbar.paddingEnd - thumbOffsetFromEnd;
673
- const maxScrollPos = sizes.content - sizes.viewport;
674
- const scrollRange = dir === "ltr" ? [0, maxScrollPos] : [maxScrollPos * -1, 0];
675
- const interpolate = linearScale([minPointerPos, maxPointerPos], scrollRange);
676
- return interpolate(pointerPos);
677
- }
678
- function getThumbOffsetFromScroll(scrollPos, sizes, dir = "ltr") {
679
- const thumbSizePx = getThumbSize(sizes);
680
- const scrollbarPadding = sizes.scrollbar.paddingStart + sizes.scrollbar.paddingEnd;
681
- const scrollbar = sizes.scrollbar.size - scrollbarPadding;
682
- const maxScrollPos = sizes.content - sizes.viewport;
683
- const maxThumbPos = scrollbar - thumbSizePx;
684
- const scrollClampRange = dir === "ltr" ? [0, maxScrollPos] : [maxScrollPos * -1, 0];
685
- const scrollWithoutMomentum = clamp(scrollPos, scrollClampRange);
686
- const interpolate = linearScale([0, maxScrollPos], [0, maxThumbPos]);
687
- return interpolate(scrollWithoutMomentum);
688
- }
689
- function linearScale(input, output) {
690
- return (value) => {
691
- if (input[0] === input[1] || output[0] === output[1]) return output[0];
692
- const ratio = (output[1] - output[0]) / (input[1] - input[0]);
693
- return output[0] + ratio * (value - input[0]);
694
- };
695
- }
696
- function isScrollingWithinScrollbarBounds(scrollPos, maxScrollPos) {
697
- return scrollPos > 0 && scrollPos < maxScrollPos;
698
- }
699
- var addUnlinkedScrollListener = (node, handler = () => {
700
- }) => {
701
- let prevPosition = { left: node.scrollLeft, top: node.scrollTop };
702
- let rAF = 0;
703
- (function loop() {
704
- const position = { left: node.scrollLeft, top: node.scrollTop };
705
- const isHorizontalScroll = prevPosition.left !== position.left;
706
- const isVerticalScroll = prevPosition.top !== position.top;
707
- if (isHorizontalScroll || isVerticalScroll) handler();
708
- prevPosition = position;
709
- rAF = window.requestAnimationFrame(loop);
710
- })();
711
- return () => window.cancelAnimationFrame(rAF);
712
- };
713
- function useDebounceCallback(callback, delay) {
714
- const handleCallback = useCallbackRef(callback);
715
- const debounceTimerRef = React2.useRef(0);
716
- React2.useEffect(() => () => window.clearTimeout(debounceTimerRef.current), []);
717
- return React2.useCallback(() => {
718
- window.clearTimeout(debounceTimerRef.current);
719
- debounceTimerRef.current = window.setTimeout(handleCallback, delay);
720
- }, [handleCallback, delay]);
721
- }
722
- function useResizeObserver(element, onResize) {
723
- const handleResize = useCallbackRef(onResize);
724
- useLayoutEffect2(() => {
725
- let rAF = 0;
726
- if (element) {
727
- const resizeObserver = new ResizeObserver(() => {
728
- cancelAnimationFrame(rAF);
729
- rAF = window.requestAnimationFrame(handleResize);
730
- });
731
- resizeObserver.observe(element);
732
- return () => {
733
- window.cancelAnimationFrame(rAF);
734
- resizeObserver.unobserve(element);
735
- };
736
- }
737
- }, [element, handleResize]);
738
- }
739
- var Root = ScrollArea;
740
- var Viewport = ScrollAreaViewport;
741
- var Scrollbar = ScrollAreaScrollbar;
742
- var Thumb = ScrollAreaThumb;
743
- var Corner = ScrollAreaCorner;
744
- export {
745
- Corner,
746
- Root,
747
- ScrollArea,
748
- ScrollAreaCorner,
749
- ScrollAreaScrollbar,
750
- ScrollAreaThumb,
751
- ScrollAreaViewport,
752
- Scrollbar,
753
- Thumb,
754
- Viewport,
755
- createScrollAreaScope
756
- };
757
- //# sourceMappingURL=@radix-ui_react-scroll-area.js.map