explorer actions

website/src/lib/components/explorer/state.svelte.ts

@@ -1,2 +1,45 @@
 /** The file that the user just selected by clicking it in the explorer, until the selection changes. */
 export const clickedInExplorer: { path: string | undefined } = $state({ path: undefined });
+
+/**
+ * What is selected in the explorer (files and folders, by path), which the menu and dragging act
+ * on, and where a range selected with shift begins.
+ */
+export const explorerSelection: { paths: string[]; anchor: string | undefined } = $state({
+    paths: [],
+    anchor: undefined,
+});
+
+/** The file or folder whose name is being edited in the explorer. */
+export const renaming: { path: string | undefined } = $state({ path: undefined });
+
+/**
+ * The file or folder that is being made in a folder (`parent`) of the explorer: it is only made once
+ * the user gave it a name.
+ */
+export const creating: { parent: string | undefined; kind: 'file' | 'folder' } = $state({
+    parent: undefined,
+    kind: 'file',
+});
+
+/** What is dragged in the explorer, and the folder it would be dropped in. */
+export const dragging: { paths: string[]; target: string | undefined } = $state({
+    paths: [],
+    target: undefined,
+});
+
+/** `\` and `/` alike. */
+function isSeparator(char: string | undefined) {
+    return char === '/' || char === '\\';
+}
+
+/** Whether `path` is `folder` or something in it. */
+export function isWithin(path: string, folder: string): boolean {
+    return path === folder || (path.startsWith(folder) && isSeparator(path[folder.length]));
+}
+
+/** The name of a file without its extension, or the name of a folder. */
+export function editableName(name: string, isDir: boolean): string {
+    const dot = name.lastIndexOf('.');
+    return isDir || dot <= 0 ? name : name.slice(0, dot);
+}