blob: 9c54d8beb549359f78197644627cb0f350b6e8a1 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
|
import * as Uebersicht from "uebersicht";
import * as Icons from "../icons/icons.jsx";
import { SuspenseIcon } from "../icons/icon.jsx";
import { useSimpleBarContext } from "../simple-bar-context.jsx";
import * as Utils from "../../utils.js";
import * as Yabai from "../../yabai.js";
const { React } = Uebersicht;
/**
* SpaceOptions component provides options to manipulate spaces (move left, move right, remove).
* @param {Object} props - The component props.
* @param {number} props.index - The index of the space.
* @param {Function} props.setHovered - Function to set the hovered state.
* @returns {JSX.Element} The SpaceOptions component.
*/
export default function SpaceOptions({ index, setHovered }) {
// Get displayIndex from the context
const { displayIndex } = useSimpleBarContext();
/**
* Handles the click event to remove a space.
* @param {Event} e - The click event.
*/
const remove = async (e) => {
e.stopPropagation();
Utils.clickEffect(e);
setHovered(false);
await Yabai.removeSpace(index, displayIndex);
};
/**
* Returns a function to handle the click event to swap a space.
* @param {string} direction - The direction to swap the space ("left" or "right").
* @returns {Function} The click event handler.
*/
const moveTo = (direction) => async (e) => {
Utils.clickEffect(e);
setHovered(false);
await Yabai.swapSpace(index, direction);
};
/**
* Prevents the default behavior of the mouse down event.
* @param {Event} e - The mouse down event.
*/
const onMouseDown = (e) => e.preventDefault();
/**
* Handles the mouse leave event to unset the hovered state.
*/
const onMouseLeave = () => setHovered(false);
return (
<span className="space-options" onMouseLeave={onMouseLeave}>
<div
className="space-options__option space-options__option--move-prev"
onMouseDown={onMouseDown}
onClick={moveTo("left")}
>
<SuspenseIcon>
<Icons.ChevronLeft />
</SuspenseIcon>
</div>
<div
className="space-options__option space-options__option--move-next"
onMouseDown={onMouseDown}
onClick={moveTo("right")}
>
<SuspenseIcon>
<Icons.ChevronRight />
</SuspenseIcon>
</div>
<div
className="space-options__option space-options__option--remove"
onClick={remove}
>
<SuspenseIcon>
<Icons.Remove />
</SuspenseIcon>
</div>
</span>
);
}
|