@floegence/floe-webapp-core 0.2.2 → 0.2.3
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.
|
@@ -12,7 +12,7 @@ export interface FileBrowserProps {
|
|
|
12
12
|
onNavigate?: (path: string) => void;
|
|
13
13
|
/** Callback when selection changes */
|
|
14
14
|
onSelect?: (items: FileItem[]) => void;
|
|
15
|
-
/** Callback when a file is opened
|
|
15
|
+
/** Callback when a file is opened */
|
|
16
16
|
onOpen?: (item: FileItem) => void;
|
|
17
17
|
/** Additional class names */
|
|
18
18
|
class?: string;
|
|
@@ -2,6 +2,7 @@ import type { FileBrowserContextValue, FileItem } from './types';
|
|
|
2
2
|
export declare function createLongPressContextMenuHandlers(ctx: FileBrowserContextValue, item: FileItem, options?: {
|
|
3
3
|
delayMs?: number;
|
|
4
4
|
moveTolerancePx?: number;
|
|
5
|
+
selectOnOpen?: boolean;
|
|
5
6
|
}): {
|
|
6
7
|
onPointerDown: (e: PointerEvent) => void;
|
|
7
8
|
onPointerMove: (e: PointerEvent) => void;
|
package/dist/index40.js
CHANGED
|
@@ -1,114 +1,133 @@
|
|
|
1
|
-
import { delegateEvents as
|
|
2
|
-
import { createMemo as
|
|
3
|
-
import { cn as
|
|
4
|
-
import { useFileBrowser as
|
|
5
|
-
import { FolderOpenIcon as
|
|
6
|
-
import { ChevronRight as
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
1
|
+
import { delegateEvents as U, template as x, insert as s, createComponent as o, effect as $, className as g, setAttribute as j, memo as k, setStyleProperty as B } from "solid-js/web";
|
|
2
|
+
import { createMemo as w, For as H, untrack as R, Show as b } from "solid-js";
|
|
3
|
+
import { cn as v } from "./index67.js";
|
|
4
|
+
import { useFileBrowser as T } from "./index39.js";
|
|
5
|
+
import { FolderOpenIcon as X, FolderIcon as Y } from "./index46.js";
|
|
6
|
+
import { ChevronRight as q } from "./index32.js";
|
|
7
|
+
import { createLongPressContextMenuHandlers as z } from "./index81.js";
|
|
8
|
+
var _ = /* @__PURE__ */ x("<div>"), G = /* @__PURE__ */ x("<button type=button>"), J = /* @__PURE__ */ x('<span class="ml-auto mr-2 text-[10px] text-muted-foreground/60 opacity-0 group-hover:opacity-100 transition-opacity">'), K = /* @__PURE__ */ x('<div class="flex flex-col"><div><button type=button><span class="flex-shrink-0 w-4 h-4"></span><span class=truncate>'), Q = /* @__PURE__ */ x('<span class="flex-shrink-0 w-3.5 h-3.5">');
|
|
9
|
+
function ie(n) {
|
|
10
|
+
const i = T(), r = w(() => i.files().filter((c) => c.type === "folder"));
|
|
10
11
|
return (() => {
|
|
11
|
-
var
|
|
12
|
-
return
|
|
12
|
+
var c = _();
|
|
13
|
+
return c.$$contextmenu = (y) => y.preventDefault(), s(c, o(F, {
|
|
13
14
|
get items() {
|
|
14
15
|
return r();
|
|
15
16
|
},
|
|
16
17
|
depth: 0
|
|
17
|
-
})),
|
|
18
|
+
})), $(() => g(c, v("flex flex-col", n.class))), c;
|
|
18
19
|
})();
|
|
19
20
|
}
|
|
20
|
-
function
|
|
21
|
-
const
|
|
22
|
-
return
|
|
21
|
+
function F(n) {
|
|
22
|
+
const i = w(() => n.items.filter((r) => r.type === "folder"));
|
|
23
|
+
return o(H, {
|
|
23
24
|
get each() {
|
|
24
|
-
return
|
|
25
|
+
return i();
|
|
25
26
|
},
|
|
26
|
-
children: (r) =>
|
|
27
|
+
children: (r) => o(V, {
|
|
27
28
|
item: r,
|
|
28
29
|
get depth() {
|
|
29
|
-
return
|
|
30
|
+
return n.depth;
|
|
30
31
|
}
|
|
31
32
|
})
|
|
32
33
|
});
|
|
33
34
|
}
|
|
34
|
-
function
|
|
35
|
-
const
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
35
|
+
function V(n) {
|
|
36
|
+
const i = T(), r = () => i.isExpanded(n.item.path), c = () => i.currentPath() === n.item.path, y = R(() => n.item), f = z(i, y, {
|
|
37
|
+
selectOnOpen: !1
|
|
38
|
+
});
|
|
39
|
+
let u;
|
|
40
|
+
const M = () => u === "touch" || u === "pen", P = w(() => {
|
|
41
|
+
var e;
|
|
42
|
+
return ((e = n.item.children) == null ? void 0 : e.filter((d) => d.type === "folder").length) ?? 0;
|
|
43
|
+
}), m = () => P() > 0, D = (e) => {
|
|
44
|
+
u = e.pointerType, f.onPointerDown(e);
|
|
45
|
+
}, E = (e) => {
|
|
46
|
+
u = e.pointerType, f.onPointerMove(e);
|
|
47
|
+
}, S = (e) => {
|
|
48
|
+
u = e.pointerType, f.onPointerUp();
|
|
49
|
+
}, I = (e) => {
|
|
50
|
+
u = e.pointerType, f.onPointerCancel();
|
|
51
|
+
}, L = (e) => {
|
|
52
|
+
f.consumeClickSuppression(e) || i.setCurrentPath(n.item.path);
|
|
53
|
+
}, N = (e) => {
|
|
54
|
+
e.preventDefault(), e.stopPropagation(), !M() && i.showContextMenu({
|
|
55
|
+
x: e.clientX,
|
|
56
|
+
y: e.clientY,
|
|
57
|
+
items: [n.item]
|
|
58
|
+
});
|
|
59
|
+
}, O = () => {
|
|
60
|
+
m() && i.toggleFolder(n.item.path);
|
|
42
61
|
};
|
|
43
62
|
return (() => {
|
|
44
|
-
var
|
|
45
|
-
return
|
|
63
|
+
var e = K(), d = e.firstChild, l = d.firstChild, C = l.firstChild, A = C.nextSibling;
|
|
64
|
+
return s(d, o(b, {
|
|
46
65
|
get when() {
|
|
47
|
-
return
|
|
66
|
+
return m();
|
|
48
67
|
},
|
|
49
68
|
get fallback() {
|
|
50
|
-
return
|
|
69
|
+
return Q();
|
|
51
70
|
},
|
|
52
71
|
get children() {
|
|
53
|
-
var
|
|
54
|
-
return
|
|
72
|
+
var t = G();
|
|
73
|
+
return t.$$click = O, s(t, o(q, {
|
|
55
74
|
class: "w-3 h-3 opacity-50"
|
|
56
|
-
})),
|
|
57
|
-
var
|
|
58
|
-
return
|
|
75
|
+
})), $((a) => {
|
|
76
|
+
var h = v("flex-shrink-0 w-3.5 h-3.5 flex items-center justify-center cursor-pointer", "transition-transform duration-150", r() && "rotate-90", "focus:outline-none focus-visible:ring-1 focus-visible:ring-inset focus-visible:ring-sidebar-ring"), p = r() ? "Collapse folder" : "Expand folder";
|
|
77
|
+
return h !== a.e && g(t, a.e = h), p !== a.t && j(t, "aria-label", a.t = p), a;
|
|
59
78
|
}, {
|
|
60
79
|
e: void 0,
|
|
61
80
|
t: void 0
|
|
62
|
-
}),
|
|
81
|
+
}), t;
|
|
63
82
|
}
|
|
64
|
-
}),
|
|
83
|
+
}), l), l.addEventListener("pointercancel", I), l.$$pointerup = S, l.$$pointermove = E, l.$$pointerdown = D, l.$$contextmenu = N, l.$$click = L, s(C, o(b, {
|
|
65
84
|
get when() {
|
|
66
|
-
return
|
|
85
|
+
return k(() => !!m())() && r();
|
|
67
86
|
},
|
|
68
87
|
get fallback() {
|
|
69
|
-
return
|
|
88
|
+
return o(Y, {
|
|
70
89
|
class: "w-4 h-4"
|
|
71
90
|
});
|
|
72
91
|
},
|
|
73
92
|
get children() {
|
|
74
|
-
return
|
|
93
|
+
return o(X, {
|
|
75
94
|
class: "w-4 h-4"
|
|
76
95
|
});
|
|
77
96
|
}
|
|
78
|
-
})),
|
|
97
|
+
})), s(A, () => n.item.name), s(l, o(b, {
|
|
79
98
|
get when() {
|
|
80
|
-
return
|
|
99
|
+
return m();
|
|
81
100
|
},
|
|
82
101
|
get children() {
|
|
83
|
-
var
|
|
84
|
-
return
|
|
102
|
+
var t = J();
|
|
103
|
+
return s(t, P), t;
|
|
85
104
|
}
|
|
86
|
-
}), null),
|
|
105
|
+
}), null), s(e, o(b, {
|
|
87
106
|
get when() {
|
|
88
|
-
return
|
|
107
|
+
return k(() => !!r())() && m();
|
|
89
108
|
},
|
|
90
109
|
get children() {
|
|
91
|
-
var
|
|
92
|
-
return
|
|
110
|
+
var t = _();
|
|
111
|
+
return s(t, o(F, {
|
|
93
112
|
get items() {
|
|
94
|
-
return
|
|
113
|
+
return n.item.children ?? [];
|
|
95
114
|
},
|
|
96
115
|
get depth() {
|
|
97
|
-
return
|
|
116
|
+
return n.depth + 1;
|
|
98
117
|
}
|
|
99
|
-
})),
|
|
118
|
+
})), $(() => g(t, v("overflow-hidden transition-all duration-200", r() ? "opacity-100" : "opacity-0"))), t;
|
|
100
119
|
}
|
|
101
|
-
}), null),
|
|
102
|
-
var
|
|
103
|
-
return
|
|
120
|
+
}), null), $((t) => {
|
|
121
|
+
var a = v("group flex items-center w-full py-1 text-xs", "transition-all duration-100", "hover:bg-sidebar-accent/60", c() && "bg-sidebar-accent text-sidebar-accent-foreground font-medium"), h = `${8 + n.depth * 12}px`, p = v("flex items-center gap-1 flex-1 min-w-0 text-left cursor-pointer pl-1", "focus:outline-none focus-visible:ring-1 focus-visible:ring-inset focus-visible:ring-sidebar-ring");
|
|
122
|
+
return a !== t.e && g(d, t.e = a), h !== t.t && B(d, "padding-left", t.t = h), p !== t.a && g(l, t.a = p), t;
|
|
104
123
|
}, {
|
|
105
124
|
e: void 0,
|
|
106
125
|
t: void 0,
|
|
107
126
|
a: void 0
|
|
108
|
-
}),
|
|
127
|
+
}), e;
|
|
109
128
|
})();
|
|
110
129
|
}
|
|
111
|
-
|
|
130
|
+
U(["contextmenu", "click", "pointerdown", "pointermove", "pointerup"]);
|
|
112
131
|
export {
|
|
113
|
-
|
|
132
|
+
ie as DirectoryTree
|
|
114
133
|
};
|
package/dist/index41.js
CHANGED
|
@@ -1,114 +1,131 @@
|
|
|
1
|
-
import { delegateEvents as
|
|
2
|
-
import { Show as
|
|
3
|
-
import { cn as
|
|
4
|
-
import { useFileBrowser as
|
|
5
|
-
import { FolderIcon as
|
|
6
|
-
import { ChevronDown as
|
|
7
|
-
import { createLongPressContextMenuHandlers as
|
|
8
|
-
var
|
|
9
|
-
function
|
|
10
|
-
const i =
|
|
11
|
-
const
|
|
1
|
+
import { delegateEvents as M, template as v, insert as s, createComponent as a, effect as S, className as k, Dynamic as z, memo as T, setStyleProperty as L } from "solid-js/web";
|
|
2
|
+
import { Show as A, For as B, untrack as K } from "solid-js";
|
|
3
|
+
import { cn as g } from "./index67.js";
|
|
4
|
+
import { useFileBrowser as F } from "./index39.js";
|
|
5
|
+
import { FolderIcon as U, getFileIcon as j } from "./index46.js";
|
|
6
|
+
import { ChevronDown as E } from "./index32.js";
|
|
7
|
+
import { createLongPressContextMenuHandlers as N } from "./index81.js";
|
|
8
|
+
var H = /* @__PURE__ */ v("<span>"), V = /* @__PURE__ */ v('<div><div class="flex items-center border-b border-border text-[11px] text-muted-foreground font-medium"><button type=button class="group flex items-center flex-1 min-w-0 px-3 py-2 cursor-pointer hover:bg-muted/50 transition-colors">Name</button><button type=button class="group hidden sm:flex items-center w-32 px-3 py-2 cursor-pointer hover:bg-muted/50 transition-colors">Modified</button><button type=button class="group hidden md:flex items-center w-24 px-3 py-2 text-right justify-end cursor-pointer hover:bg-muted/50 transition-colors">Size</button></div><div class="flex-1 min-h-0 overflow-auto">'), X = /* @__PURE__ */ v('<div class="flex items-center justify-center h-32 text-xs text-muted-foreground">This folder is empty'), Y = /* @__PURE__ */ v('<button type=button style=animation-fill-mode:backwards><div class="flex items-center gap-2 flex-1 min-w-0 px-3 py-1.5"><span class="flex-shrink-0 w-4 h-4"></span><span class=truncate></span></div><div class="hidden sm:block w-32 px-3 py-1.5 text-muted-foreground truncate"></div><div class="hidden md:block w-24 px-3 py-1.5 text-right text-muted-foreground">');
|
|
9
|
+
function ee(n) {
|
|
10
|
+
const i = F(), u = (t) => {
|
|
11
|
+
const o = i.sortConfig();
|
|
12
12
|
i.setSortConfig({
|
|
13
13
|
field: t,
|
|
14
|
-
direction:
|
|
14
|
+
direction: o.field === t && o.direction === "asc" ? "desc" : "asc"
|
|
15
15
|
});
|
|
16
|
-
}, $ = (t) => t === void 0 ? "-" : t < 1024 ? `${t} B` : t < 1024 * 1024 ? `${(t / 1024).toFixed(1)} KB` : `${(t / (1024 * 1024)).toFixed(1)} MB`,
|
|
16
|
+
}, $ = (t) => t === void 0 ? "-" : t < 1024 ? `${t} B` : t < 1024 * 1024 ? `${(t / 1024).toFixed(1)} KB` : `${(t / (1024 * 1024)).toFixed(1)} MB`, d = (t) => t ? t.toLocaleDateString("en-US", {
|
|
17
17
|
month: "short",
|
|
18
18
|
day: "numeric",
|
|
19
19
|
year: "numeric"
|
|
20
|
-
}) : "-",
|
|
21
|
-
const
|
|
20
|
+
}) : "-", r = (t) => {
|
|
21
|
+
const o = () => i.sortConfig(), c = () => o().field === t.field;
|
|
22
22
|
return (() => {
|
|
23
|
-
var
|
|
24
|
-
return
|
|
23
|
+
var l = H();
|
|
24
|
+
return s(l, a(E, {
|
|
25
25
|
get class() {
|
|
26
|
-
return
|
|
26
|
+
return g("w-3 h-3 transition-transform duration-150", c() && o().direction === "asc" && "rotate-180");
|
|
27
27
|
}
|
|
28
|
-
})),
|
|
28
|
+
})), S(() => k(l, g("ml-1 transition-all duration-150", c() ? "opacity-100" : "opacity-0 group-hover:opacity-40"))), l;
|
|
29
29
|
})();
|
|
30
30
|
};
|
|
31
31
|
return (() => {
|
|
32
|
-
var t =
|
|
33
|
-
|
|
34
|
-
var
|
|
35
|
-
e.firstChild;
|
|
36
|
-
var l = e.nextSibling;
|
|
32
|
+
var t = V(), o = t.firstChild, c = o.firstChild;
|
|
33
|
+
c.firstChild;
|
|
34
|
+
var l = c.nextSibling;
|
|
37
35
|
l.firstChild;
|
|
38
|
-
var
|
|
39
|
-
|
|
36
|
+
var f = l.nextSibling;
|
|
37
|
+
f.firstChild;
|
|
38
|
+
var b = o.nextSibling;
|
|
39
|
+
return c.$$click = () => u("name"), s(c, a(r, {
|
|
40
40
|
field: "name"
|
|
41
|
-
}), null),
|
|
41
|
+
}), null), l.$$click = () => u("modifiedAt"), s(l, a(r, {
|
|
42
42
|
field: "modifiedAt"
|
|
43
|
-
}), null),
|
|
43
|
+
}), null), f.$$click = () => u("size"), s(f, a(r, {
|
|
44
44
|
field: "size"
|
|
45
|
-
}), null),
|
|
45
|
+
}), null), s(b, a(A, {
|
|
46
46
|
get when() {
|
|
47
47
|
return i.currentFiles().length > 0;
|
|
48
48
|
},
|
|
49
49
|
get fallback() {
|
|
50
|
-
return
|
|
50
|
+
return X();
|
|
51
51
|
},
|
|
52
52
|
get children() {
|
|
53
|
-
return
|
|
53
|
+
return a(B, {
|
|
54
54
|
get each() {
|
|
55
55
|
return i.currentFiles();
|
|
56
56
|
},
|
|
57
|
-
children: (
|
|
58
|
-
item:
|
|
57
|
+
children: (y, w) => a(q, {
|
|
58
|
+
item: y,
|
|
59
59
|
formatSize: $,
|
|
60
|
-
formatDate:
|
|
60
|
+
formatDate: d,
|
|
61
61
|
get index() {
|
|
62
|
-
return
|
|
62
|
+
return w();
|
|
63
63
|
}
|
|
64
64
|
})
|
|
65
65
|
});
|
|
66
66
|
}
|
|
67
|
-
})),
|
|
67
|
+
})), S(() => k(t, g("flex flex-col h-full min-h-0", n.class))), t;
|
|
68
68
|
})();
|
|
69
69
|
}
|
|
70
|
-
function
|
|
71
|
-
const i =
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
},
|
|
76
|
-
|
|
77
|
-
|
|
70
|
+
function q(n) {
|
|
71
|
+
const i = F(), u = () => i.isSelected(n.item.id), $ = K(() => n.item), d = N(i, $);
|
|
72
|
+
let r;
|
|
73
|
+
const t = () => r === "touch" || r === "pen", o = (e) => {
|
|
74
|
+
r = e.pointerType, d.onPointerDown(e);
|
|
75
|
+
}, c = (e) => {
|
|
76
|
+
r = e.pointerType, d.onPointerMove(e);
|
|
77
|
+
}, l = (e) => {
|
|
78
|
+
r = e.pointerType, d.onPointerUp();
|
|
79
|
+
}, f = (e) => {
|
|
80
|
+
r = e.pointerType, d.onPointerCancel();
|
|
81
|
+
}, b = (e) => {
|
|
82
|
+
if (!d.consumeClickSuppression(e)) {
|
|
83
|
+
if (t()) {
|
|
84
|
+
i.openItem(n.item);
|
|
85
|
+
return;
|
|
86
|
+
}
|
|
87
|
+
i.selectItem(n.item.id, e.metaKey || e.ctrlKey);
|
|
88
|
+
}
|
|
89
|
+
}, y = () => {
|
|
90
|
+
t() || i.openItem(n.item);
|
|
91
|
+
}, w = (e) => {
|
|
92
|
+
if (e.preventDefault(), e.stopPropagation(), t()) return;
|
|
93
|
+
u() || i.selectItem(n.item.id, !1);
|
|
94
|
+
const x = i.selectedItems(), h = i.currentFiles(), C = x.size > 0 ? h.filter((p) => x.has(p.id)) : [n.item];
|
|
78
95
|
i.showContextMenu({
|
|
79
96
|
x: e.clientX,
|
|
80
97
|
y: e.clientY,
|
|
81
|
-
items:
|
|
98
|
+
items: C
|
|
82
99
|
});
|
|
83
|
-
},
|
|
100
|
+
}, I = () => n.item.type === "folder" ? U : j(n.item.extension);
|
|
84
101
|
return (() => {
|
|
85
|
-
var e =
|
|
86
|
-
return
|
|
102
|
+
var e = Y(), x = e.firstChild, h = x.firstChild, C = h.nextSibling, p = x.nextSibling, D = p.nextSibling;
|
|
103
|
+
return e.addEventListener("pointercancel", f), e.$$pointerup = l, e.$$pointermove = c, e.$$pointerdown = o, e.$$contextmenu = w, e.$$dblclick = y, e.$$click = b, s(h, a(z, {
|
|
87
104
|
get component() {
|
|
88
|
-
return
|
|
105
|
+
return I();
|
|
89
106
|
},
|
|
90
107
|
class: "w-4 h-4"
|
|
91
|
-
})),
|
|
92
|
-
var
|
|
93
|
-
return () =>
|
|
94
|
-
})()),
|
|
95
|
-
var
|
|
108
|
+
})), s(C, () => n.item.name), s(p, () => n.formatDate(n.item.modifiedAt)), s(D, (() => {
|
|
109
|
+
var m = T(() => n.item.type === "folder");
|
|
110
|
+
return () => m() ? "-" : n.formatSize(n.item.size);
|
|
111
|
+
})()), S((m) => {
|
|
112
|
+
var _ = g(
|
|
96
113
|
"group w-full flex items-center text-xs cursor-pointer",
|
|
97
114
|
"transition-all duration-100",
|
|
98
115
|
"hover:bg-accent/50",
|
|
99
116
|
"focus:outline-none focus-visible:ring-1 focus-visible:ring-inset focus-visible:ring-ring",
|
|
100
|
-
|
|
117
|
+
u() && "bg-accent text-accent-foreground",
|
|
101
118
|
// Staggered animation on mount
|
|
102
119
|
"animate-in fade-in slide-in-from-top-2"
|
|
103
|
-
),
|
|
104
|
-
return
|
|
120
|
+
), P = `${Math.min(n.index * 20, 200)}ms`;
|
|
121
|
+
return _ !== m.e && k(e, m.e = _), P !== m.t && L(e, "animation-delay", m.t = P), m;
|
|
105
122
|
}, {
|
|
106
123
|
e: void 0,
|
|
107
124
|
t: void 0
|
|
108
125
|
}), e;
|
|
109
126
|
})();
|
|
110
127
|
}
|
|
111
|
-
|
|
128
|
+
M(["click", "dblclick", "contextmenu", "pointerdown", "pointermove", "pointerup"]);
|
|
112
129
|
export {
|
|
113
|
-
|
|
130
|
+
ee as FileListView
|
|
114
131
|
};
|
package/dist/index42.js
CHANGED
|
@@ -1,68 +1,85 @@
|
|
|
1
|
-
import { delegateEvents as
|
|
2
|
-
import { Show as I, For as
|
|
3
|
-
import { cn as
|
|
4
|
-
import { useFileBrowser as
|
|
5
|
-
import { FolderIcon as
|
|
6
|
-
import { createLongPressContextMenuHandlers as
|
|
7
|
-
var
|
|
8
|
-
function
|
|
9
|
-
const i =
|
|
1
|
+
import { delegateEvents as B, template as g, insert as m, createComponent as u, effect as C, className as a, Dynamic as E, setStyleProperty as P, setAttribute as G } from "solid-js/web";
|
|
2
|
+
import { Show as I, For as K, untrack as U } from "solid-js";
|
|
3
|
+
import { cn as d } from "./index67.js";
|
|
4
|
+
import { useFileBrowser as F } from "./index39.js";
|
|
5
|
+
import { FolderIcon as A, getFileIcon as H } from "./index46.js";
|
|
6
|
+
import { createLongPressContextMenuHandlers as N } from "./index81.js";
|
|
7
|
+
var V = /* @__PURE__ */ g('<div class="grid grid-cols-2 sm:grid-cols-3 md:grid-cols-4 lg:grid-cols-5 xl:grid-cols-6 gap-2">'), X = /* @__PURE__ */ g("<div>"), Y = /* @__PURE__ */ g('<div class="flex items-center justify-center h-32 text-xs text-muted-foreground">This folder is empty'), q = /* @__PURE__ */ g('<div class="absolute top-1.5 right-1.5 w-4 h-4 rounded-full bg-primary flex items-center justify-center"><svg xmlns=http://www.w3.org/2000/svg viewBox="0 0 24 24"fill=none stroke=currentColor stroke-width=3 stroke-linecap=round stroke-linejoin=round class="w-2.5 h-2.5 text-primary-foreground"><polyline points="20 6 9 17 4 12">'), J = /* @__PURE__ */ g("<button type=button style=animation-fill-mode:backwards><div></div><span></span><div>");
|
|
8
|
+
function ne(n) {
|
|
9
|
+
const i = F();
|
|
10
10
|
return (() => {
|
|
11
|
-
var r =
|
|
12
|
-
return
|
|
11
|
+
var r = X();
|
|
12
|
+
return m(r, u(I, {
|
|
13
13
|
get when() {
|
|
14
14
|
return i.currentFiles().length > 0;
|
|
15
15
|
},
|
|
16
16
|
get fallback() {
|
|
17
|
-
return
|
|
17
|
+
return Y();
|
|
18
18
|
},
|
|
19
19
|
get children() {
|
|
20
|
-
var
|
|
21
|
-
return
|
|
20
|
+
var f = V();
|
|
21
|
+
return m(f, u(K, {
|
|
22
22
|
get each() {
|
|
23
23
|
return i.currentFiles();
|
|
24
24
|
},
|
|
25
|
-
children: (
|
|
26
|
-
item:
|
|
25
|
+
children: (l, o) => u(O, {
|
|
26
|
+
item: l,
|
|
27
27
|
get index() {
|
|
28
|
-
return
|
|
28
|
+
return o();
|
|
29
29
|
}
|
|
30
30
|
})
|
|
31
|
-
})),
|
|
31
|
+
})), f;
|
|
32
32
|
}
|
|
33
|
-
})),
|
|
33
|
+
})), C(() => a(r, d("h-full min-h-0 overflow-auto p-3", n.class))), r;
|
|
34
34
|
})();
|
|
35
35
|
}
|
|
36
|
-
function
|
|
37
|
-
const i =
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
36
|
+
function O(n) {
|
|
37
|
+
const i = F(), r = () => i.isSelected(n.item.id), f = U(() => n.item), l = N(i, f);
|
|
38
|
+
let o;
|
|
39
|
+
const p = () => o === "touch" || o === "pen", S = (e) => {
|
|
40
|
+
o = e.pointerType, l.onPointerDown(e);
|
|
41
|
+
}, T = (e) => {
|
|
42
|
+
o = e.pointerType, l.onPointerMove(e);
|
|
41
43
|
}, M = (e) => {
|
|
42
|
-
|
|
43
|
-
|
|
44
|
+
o = e.pointerType, l.onPointerUp();
|
|
45
|
+
}, D = (e) => {
|
|
46
|
+
o = e.pointerType, l.onPointerCancel();
|
|
47
|
+
}, j = (e) => {
|
|
48
|
+
if (!l.consumeClickSuppression(e)) {
|
|
49
|
+
if (p()) {
|
|
50
|
+
i.openItem(n.item);
|
|
51
|
+
return;
|
|
52
|
+
}
|
|
53
|
+
i.selectItem(n.item.id, e.metaKey || e.ctrlKey);
|
|
54
|
+
}
|
|
55
|
+
}, _ = () => {
|
|
56
|
+
p() || i.openItem(n.item);
|
|
57
|
+
}, L = (e) => {
|
|
58
|
+
if (e.preventDefault(), e.stopPropagation(), p()) return;
|
|
59
|
+
r() || i.selectItem(n.item.id, !1);
|
|
60
|
+
const c = i.selectedItems(), s = i.currentFiles(), v = c.size > 0 ? s.filter((t) => c.has(t.id)) : [n.item];
|
|
44
61
|
i.showContextMenu({
|
|
45
62
|
x: e.clientX,
|
|
46
63
|
y: e.clientY,
|
|
47
64
|
items: v
|
|
48
65
|
});
|
|
49
|
-
},
|
|
66
|
+
}, z = () => n.item.type === "folder" ? A : H(n.item.extension);
|
|
50
67
|
return (() => {
|
|
51
|
-
var e =
|
|
52
|
-
return
|
|
68
|
+
var e = J(), c = e.firstChild, s = c.nextSibling, v = s.nextSibling;
|
|
69
|
+
return e.addEventListener("pointercancel", D), e.$$pointerup = M, e.$$pointermove = T, e.$$pointerdown = S, e.$$contextmenu = L, e.$$dblclick = _, e.$$click = j, m(e, u(I, {
|
|
53
70
|
get when() {
|
|
54
71
|
return r();
|
|
55
72
|
},
|
|
56
73
|
get children() {
|
|
57
|
-
return
|
|
74
|
+
return q();
|
|
58
75
|
}
|
|
59
|
-
}),
|
|
76
|
+
}), c), m(c, u(E, {
|
|
60
77
|
get component() {
|
|
61
|
-
return
|
|
78
|
+
return z();
|
|
62
79
|
},
|
|
63
80
|
class: "w-8 h-8"
|
|
64
|
-
})),
|
|
65
|
-
var h =
|
|
81
|
+
})), m(s, () => n.item.name), C((t) => {
|
|
82
|
+
var h = d(
|
|
66
83
|
"group relative flex flex-col items-center gap-2 p-3 rounded-lg cursor-pointer",
|
|
67
84
|
"transition-all duration-150",
|
|
68
85
|
"hover:bg-accent/50 hover:scale-[1.02]",
|
|
@@ -71,8 +88,8 @@ function V(n) {
|
|
|
71
88
|
r() && "bg-accent ring-2 ring-primary/50",
|
|
72
89
|
// Staggered animation on mount
|
|
73
90
|
"animate-in fade-in zoom-in-95"
|
|
74
|
-
),
|
|
75
|
-
return h !== t.e &&
|
|
91
|
+
), x = `${Math.min(n.index * 30, 300)}ms`, y = d("w-12 h-12 flex items-center justify-center rounded-lg", "transition-transform duration-200", "group-hover:scale-110", n.item.type === "folder" ? "bg-warning/10" : "bg-muted/50"), w = d("text-xs text-center line-clamp-2 w-full px-1", "transition-colors duration-150", r() && "font-medium"), b = n.item.name, $ = d("absolute inset-0 rounded-lg opacity-0 transition-opacity duration-300", "group-hover:opacity-100", "pointer-events-none"), k = n.item.type === "folder" ? "radial-gradient(circle at 50% 30%, color-mix(in srgb, var(--warning) 8%, transparent), transparent 70%)" : "radial-gradient(circle at 50% 30%, color-mix(in srgb, var(--primary) 5%, transparent), transparent 70%)";
|
|
92
|
+
return h !== t.e && a(e, t.e = h), x !== t.t && P(e, "animation-delay", t.t = x), y !== t.a && a(c, t.a = y), w !== t.o && a(s, t.o = w), b !== t.i && G(s, "title", t.i = b), $ !== t.n && a(v, t.n = $), k !== t.s && P(v, "background", t.s = k), t;
|
|
76
93
|
}, {
|
|
77
94
|
e: void 0,
|
|
78
95
|
t: void 0,
|
|
@@ -84,7 +101,7 @@ function V(n) {
|
|
|
84
101
|
}), e;
|
|
85
102
|
})();
|
|
86
103
|
}
|
|
87
|
-
|
|
104
|
+
B(["click", "dblclick", "contextmenu", "pointerdown", "pointermove", "pointerup"]);
|
|
88
105
|
export {
|
|
89
|
-
|
|
106
|
+
ne as FileGridView
|
|
90
107
|
};
|
package/dist/index81.js
CHANGED
|
@@ -1,33 +1,42 @@
|
|
|
1
|
-
import { onCleanup as
|
|
2
|
-
function
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
const
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
},
|
|
18
|
-
},
|
|
19
|
-
if (
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
1
|
+
import { onCleanup as F } from "solid-js";
|
|
2
|
+
function g(t, i, n) {
|
|
3
|
+
const f = (n == null ? void 0 : n.delayMs) ?? 500, m = (n == null ? void 0 : n.moveTolerancePx) ?? 10, w = (n == null ? void 0 : n.selectOnOpen) ?? !0;
|
|
4
|
+
let l = null, c = null, u = !1;
|
|
5
|
+
const o = () => {
|
|
6
|
+
l !== null && typeof window < "u" && (window.clearTimeout(l), l = null), c = null;
|
|
7
|
+
}, a = () => {
|
|
8
|
+
u = !0;
|
|
9
|
+
}, y = (e, s) => {
|
|
10
|
+
if (!w) {
|
|
11
|
+
t.showContextMenu({ x: e, y: s, items: [i] }), a();
|
|
12
|
+
return;
|
|
13
|
+
}
|
|
14
|
+
const r = i.id;
|
|
15
|
+
t.isSelected(r) || t.selectItem(r, !1);
|
|
16
|
+
const x = t.selectedItems(), d = t.currentFiles().filter((v) => x.has(v.id)), T = d.length > 0 ? d : [i];
|
|
17
|
+
t.showContextMenu({ x: e, y: s, items: T }), a();
|
|
18
|
+
}, C = (e) => {
|
|
19
|
+
if (u = !1, e.pointerType === "mouse" || typeof window > "u") return;
|
|
20
|
+
o(), c = { x: e.clientX, y: e.clientY };
|
|
21
|
+
const s = e.clientX, r = e.clientY;
|
|
22
|
+
l = window.setTimeout(() => {
|
|
23
|
+
l = null, y(s, r);
|
|
24
|
+
}, f);
|
|
25
|
+
}, M = (e) => {
|
|
26
|
+
if (l === null || !c) return;
|
|
27
|
+
const s = e.clientX - c.x, r = e.clientY - c.y;
|
|
28
|
+
Math.hypot(s, r) > m && (o(), a());
|
|
29
|
+
}, P = () => o(), p = () => o(), h = (e) => u ? (u = !1, e.preventDefault(), e.stopPropagation(), !0) : !1;
|
|
30
|
+
return F(() => {
|
|
31
|
+
o();
|
|
32
|
+
}), {
|
|
33
|
+
onPointerDown: C,
|
|
34
|
+
onPointerMove: M,
|
|
35
|
+
onPointerUp: P,
|
|
36
|
+
onPointerCancel: p,
|
|
37
|
+
consumeClickSuppression: h
|
|
29
38
|
};
|
|
30
39
|
}
|
|
31
40
|
export {
|
|
32
|
-
|
|
41
|
+
g as createLongPressContextMenuHandlers
|
|
33
42
|
};
|