@brftech/filex-core 0.16.2 → 0.17.0
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.
- package/dist/filex-core.js +9 -9
- package/dist/filex-core.js.map +1 -1
- package/dist/filex-core.umd.cjs +2 -2
- package/dist/filex-core.umd.cjs.map +1 -1
- package/dist/index.d.ts +9 -7
- package/dist/style.css +1 -1
- package/package.json +1 -1
- package/src/FileExplorer.vue +6 -5
- package/src/components/TabBar.vue +11 -7
- package/src/styles/base.css +105 -62
- package/src/types/ExplorerConfig.ts +9 -7
package/src/styles/base.css
CHANGED
|
@@ -1,5 +1,70 @@
|
|
|
1
1
|
/* FileExplorer — unscoped stylesheet (lib consumers apply once). */
|
|
2
2
|
|
|
3
|
+
/* ⚠⚠ Bu blok dosyanın BAŞINDA durur, sonunda değil. Aynı özgüllükteki
|
|
4
|
+
(`.fe *` = 0,1,0) bileşen kuralları bunun ALTINDA kalırsa kaskadda kazanır;
|
|
5
|
+
sonda dururken sekme şeridinin kendi "çubuğu gizle" kuralını ezip tabların
|
|
6
|
+
altına bir kaydırma çubuğu düşürdü (2026-08-12, Burak bildirdi). Genel
|
|
7
|
+
varsayılan önce gelir, bileşen kendi istisnasını sonra yazar. */
|
|
8
|
+
|
|
9
|
+
/* === ui-fix — kaydırma çubukları ======================================
|
|
10
|
+
The platform scrollbar ignores the theme completely: on Terminal Green or
|
|
11
|
+
any dark variant it paints a wide light-grey slab down the edge of the
|
|
12
|
+
panel. Chromium/WebKit honour the -webkit pseudo-elements and Firefox the
|
|
13
|
+
two standard properties, so both are declared — the standard pair first, so
|
|
14
|
+
the rules survive an engine that drops the prefixed set.
|
|
15
|
+
|
|
16
|
+
⚠ SCOPED TO `.fe`, never to `*`. base.css is loaded by embedders (work,
|
|
17
|
+
fishapp, the admin SPA), and a bare `*` rule would repaint the HOST page's
|
|
18
|
+
scrollbars from inside an embedded file browser. The two teleported
|
|
19
|
+
surfaces are listed explicitly because they are children of <body>, not of
|
|
20
|
+
the explorer root.
|
|
21
|
+
|
|
22
|
+
Colours come from the existing tokens rather than from new ones, so every
|
|
23
|
+
theme — including ones added later — gets a matching bar for free. */
|
|
24
|
+
.fe,
|
|
25
|
+
.fe *,
|
|
26
|
+
.fe-ctx-backdrop,
|
|
27
|
+
.fe-ctx-backdrop *,
|
|
28
|
+
.fe-tour,
|
|
29
|
+
.fe-tour * {
|
|
30
|
+
scrollbar-width: thin;
|
|
31
|
+
scrollbar-color: var(--fe-border-strong) transparent;
|
|
32
|
+
}
|
|
33
|
+
.fe ::-webkit-scrollbar,
|
|
34
|
+
.fe-ctx-backdrop ::-webkit-scrollbar,
|
|
35
|
+
.fe-tour ::-webkit-scrollbar {
|
|
36
|
+
width: 10px;
|
|
37
|
+
height: 10px;
|
|
38
|
+
}
|
|
39
|
+
.fe ::-webkit-scrollbar-track,
|
|
40
|
+
.fe-ctx-backdrop ::-webkit-scrollbar-track,
|
|
41
|
+
.fe-tour ::-webkit-scrollbar-track {
|
|
42
|
+
background: transparent;
|
|
43
|
+
}
|
|
44
|
+
.fe ::-webkit-scrollbar-thumb,
|
|
45
|
+
.fe-ctx-backdrop ::-webkit-scrollbar-thumb,
|
|
46
|
+
.fe-tour ::-webkit-scrollbar-thumb {
|
|
47
|
+
background: var(--fe-border-strong);
|
|
48
|
+
/* Inset with a transparent border instead of a narrower width: a thin thumb
|
|
49
|
+
inside a wide gutter drifts away from the content edge. */
|
|
50
|
+
border: 2px solid transparent;
|
|
51
|
+
background-clip: padding-box;
|
|
52
|
+
border-radius: 8px;
|
|
53
|
+
}
|
|
54
|
+
.fe ::-webkit-scrollbar-thumb:hover,
|
|
55
|
+
.fe-ctx-backdrop ::-webkit-scrollbar-thumb:hover,
|
|
56
|
+
.fe-tour ::-webkit-scrollbar-thumb:hover {
|
|
57
|
+
background: var(--fe-text-muted);
|
|
58
|
+
background-clip: padding-box;
|
|
59
|
+
}
|
|
60
|
+
/* Unstyled, the meeting point of a vertical and a horizontal bar paints as a
|
|
61
|
+
white square in the corner of a dark panel. */
|
|
62
|
+
.fe ::-webkit-scrollbar-corner,
|
|
63
|
+
.fe-ctx-backdrop ::-webkit-scrollbar-corner,
|
|
64
|
+
.fe-tour ::-webkit-scrollbar-corner {
|
|
65
|
+
background: transparent;
|
|
66
|
+
}
|
|
67
|
+
|
|
3
68
|
.fe {
|
|
4
69
|
position: relative;
|
|
5
70
|
display: flex;
|
|
@@ -41,6 +106,16 @@
|
|
|
41
106
|
filex-explorer {
|
|
42
107
|
display: block;
|
|
43
108
|
height: 100%;
|
|
109
|
+
/* ⚠⚠ The host is almost always a FLEX ITEM (the desktop shell, work, the
|
|
110
|
+
* admin SPA all put it in a flex column/row). A flex item's default
|
|
111
|
+
* `min-width: auto` floors it at its content's min-content width, so a wide
|
|
112
|
+
* row of tabs pushed the host — and the whole page — sideways instead of
|
|
113
|
+
* letting the tab strip scroll: 63 tabs made a 3256px host inside a 1264px
|
|
114
|
+
* window (2026-08-12). Every embedder would otherwise have to know to write
|
|
115
|
+
* this themselves, which is the opposite of what shipping one component is
|
|
116
|
+
* for. Same reason for the width: a block that cannot exceed its box. */
|
|
117
|
+
min-width: 0;
|
|
118
|
+
max-width: 100%;
|
|
44
119
|
}
|
|
45
120
|
|
|
46
121
|
/* Live-presence strip (who else is in this folder) — shown under the breadcrumb. */
|
|
@@ -3091,6 +3166,14 @@ filex-explorer {
|
|
|
3091
3166
|
align-items: stretch;
|
|
3092
3167
|
gap: 4px;
|
|
3093
3168
|
flex: 0 0 auto;
|
|
3169
|
+
/* ⚠⚠ Without this the strip never scrolls — it GROWS. A flex item's default
|
|
3170
|
+
* `min-width: auto` floors it at its min-content width, so a row of tabs
|
|
3171
|
+
* wider than the window pushed the whole explorer sideways instead of
|
|
3172
|
+
* overflowing into `.fe-tabs__scroll`: measured 63 tabs → a 4903px strip in
|
|
3173
|
+
* a 1264px window, the layout running off the right edge with no scrollbar
|
|
3174
|
+
* anywhere (2026-08-12, Burak: "ekranı taştı, akıyor gidiyor"). Allowing the
|
|
3175
|
+
* strip to shrink is what hands the overflow to the scroller inside it. */
|
|
3176
|
+
min-width: 0;
|
|
3094
3177
|
padding: 4px 6px 0;
|
|
3095
3178
|
background: var(--fe-bg-elev);
|
|
3096
3179
|
border-bottom: 1px solid var(--fe-border);
|
|
@@ -3103,12 +3186,30 @@ filex-explorer {
|
|
|
3103
3186
|
flex: 1 1 auto;
|
|
3104
3187
|
min-width: 0;
|
|
3105
3188
|
overflow-x: auto;
|
|
3106
|
-
/*
|
|
3107
|
-
*
|
|
3108
|
-
|
|
3189
|
+
/* ⚠ EXPLICIT `hidden`, not left to default. `overflow-x: auto` alone makes
|
|
3190
|
+
* the other axis compute to `auto` too, so the strip grew a VERTICAL
|
|
3191
|
+
* scrollbar with nothing to scroll — a bar down the side of a row of tabs
|
|
3192
|
+
* (2026-08-12, Burak reported it). */
|
|
3193
|
+
overflow-y: hidden;
|
|
3194
|
+
/* Enough tabs and they run off the edge; a strip that scrolls without
|
|
3195
|
+
* saying so is a strip whose overflow is invisible. Thin, on its own axis,
|
|
3196
|
+
* and only when there is something to scroll. */
|
|
3197
|
+
scrollbar-width: thin;
|
|
3198
|
+
scrollbar-color: var(--fe-border-strong) transparent;
|
|
3109
3199
|
}
|
|
3110
3200
|
.fe-tabs__scroll::-webkit-scrollbar {
|
|
3111
|
-
|
|
3201
|
+
height: 6px;
|
|
3202
|
+
width: 0;
|
|
3203
|
+
}
|
|
3204
|
+
.fe-tabs__scroll::-webkit-scrollbar-track {
|
|
3205
|
+
background: transparent;
|
|
3206
|
+
}
|
|
3207
|
+
.fe-tabs__scroll::-webkit-scrollbar-thumb {
|
|
3208
|
+
background: var(--fe-border-strong);
|
|
3209
|
+
border-radius: 6px;
|
|
3210
|
+
}
|
|
3211
|
+
.fe-tabs__scroll::-webkit-scrollbar-thumb:hover {
|
|
3212
|
+
background: var(--fe-text-muted);
|
|
3112
3213
|
}
|
|
3113
3214
|
.fe-tabs__tab {
|
|
3114
3215
|
display: flex;
|
|
@@ -3761,64 +3862,6 @@ filex-explorer {
|
|
|
3761
3862
|
}
|
|
3762
3863
|
/* === /ui-fix ========================================================= */
|
|
3763
3864
|
|
|
3764
|
-
/* === ui-fix — kaydırma çubukları ======================================
|
|
3765
|
-
The platform scrollbar ignores the theme completely: on Terminal Green or
|
|
3766
|
-
any dark variant it paints a wide light-grey slab down the edge of the
|
|
3767
|
-
panel. Chromium/WebKit honour the -webkit pseudo-elements and Firefox the
|
|
3768
|
-
two standard properties, so both are declared — the standard pair first, so
|
|
3769
|
-
the rules survive an engine that drops the prefixed set.
|
|
3770
|
-
|
|
3771
|
-
⚠ SCOPED TO `.fe`, never to `*`. base.css is loaded by embedders (work,
|
|
3772
|
-
fishapp, the admin SPA), and a bare `*` rule would repaint the HOST page's
|
|
3773
|
-
scrollbars from inside an embedded file browser. The two teleported
|
|
3774
|
-
surfaces are listed explicitly because they are children of <body>, not of
|
|
3775
|
-
the explorer root.
|
|
3776
|
-
|
|
3777
|
-
Colours come from the existing tokens rather than from new ones, so every
|
|
3778
|
-
theme — including ones added later — gets a matching bar for free. */
|
|
3779
|
-
.fe,
|
|
3780
|
-
.fe *,
|
|
3781
|
-
.fe-ctx-backdrop,
|
|
3782
|
-
.fe-ctx-backdrop *,
|
|
3783
|
-
.fe-tour,
|
|
3784
|
-
.fe-tour * {
|
|
3785
|
-
scrollbar-width: thin;
|
|
3786
|
-
scrollbar-color: var(--fe-border-strong) transparent;
|
|
3787
|
-
}
|
|
3788
|
-
.fe ::-webkit-scrollbar,
|
|
3789
|
-
.fe-ctx-backdrop ::-webkit-scrollbar,
|
|
3790
|
-
.fe-tour ::-webkit-scrollbar {
|
|
3791
|
-
width: 10px;
|
|
3792
|
-
height: 10px;
|
|
3793
|
-
}
|
|
3794
|
-
.fe ::-webkit-scrollbar-track,
|
|
3795
|
-
.fe-ctx-backdrop ::-webkit-scrollbar-track,
|
|
3796
|
-
.fe-tour ::-webkit-scrollbar-track {
|
|
3797
|
-
background: transparent;
|
|
3798
|
-
}
|
|
3799
|
-
.fe ::-webkit-scrollbar-thumb,
|
|
3800
|
-
.fe-ctx-backdrop ::-webkit-scrollbar-thumb,
|
|
3801
|
-
.fe-tour ::-webkit-scrollbar-thumb {
|
|
3802
|
-
background: var(--fe-border-strong);
|
|
3803
|
-
/* Inset with a transparent border instead of a narrower width: a thin thumb
|
|
3804
|
-
inside a wide gutter drifts away from the content edge. */
|
|
3805
|
-
border: 2px solid transparent;
|
|
3806
|
-
background-clip: padding-box;
|
|
3807
|
-
border-radius: 8px;
|
|
3808
|
-
}
|
|
3809
|
-
.fe ::-webkit-scrollbar-thumb:hover,
|
|
3810
|
-
.fe-ctx-backdrop ::-webkit-scrollbar-thumb:hover,
|
|
3811
|
-
.fe-tour ::-webkit-scrollbar-thumb:hover {
|
|
3812
|
-
background: var(--fe-text-muted);
|
|
3813
|
-
background-clip: padding-box;
|
|
3814
|
-
}
|
|
3815
|
-
/* Unstyled, the meeting point of a vertical and a horizontal bar paints as a
|
|
3816
|
-
white square in the corner of a dark panel. */
|
|
3817
|
-
.fe ::-webkit-scrollbar-corner,
|
|
3818
|
-
.fe-ctx-backdrop ::-webkit-scrollbar-corner,
|
|
3819
|
-
.fe-tour ::-webkit-scrollbar-corner {
|
|
3820
|
-
background: transparent;
|
|
3821
|
-
}
|
|
3822
3865
|
|
|
3823
3866
|
/* === wiring:c1 — gündüz / gece / otomatik =============================
|
|
3824
3867
|
Lives at the top of the theme gallery: "night mode" is what people open the
|
|
@@ -208,15 +208,17 @@ export interface ExplorerConfig {
|
|
|
208
208
|
theme?: ThemeMode;
|
|
209
209
|
|
|
210
210
|
/**
|
|
211
|
-
* When the tab strip is on screen.
|
|
211
|
+
* When the tab strip is on screen. Default `'always'`.
|
|
212
212
|
*
|
|
213
|
-
*
|
|
214
|
-
*
|
|
215
|
-
*
|
|
213
|
+
* ⚠⚠ The default is the SAME on every surface on purpose. This package is
|
|
214
|
+
* the reason the desktop app, the web explorer and the embeds are one
|
|
215
|
+
* product; shipping a strip that appears in one of them and not the others
|
|
216
|
+
* turns it back into three. 0.16.0 defaulted this to `'auto'` and opted the
|
|
217
|
+
* desktop app in — so tabs were permanent in the app and came and went on
|
|
218
|
+
* the web, which is exactly the split the shared package exists to prevent.
|
|
216
219
|
*
|
|
217
|
-
* `'
|
|
218
|
-
*
|
|
219
|
-
* are a feature you can only find by guessing the keyboard shortcut.
|
|
220
|
+
* `'auto'` remains as a deliberate opt-OUT for an embed too short to spend
|
|
221
|
+
* a row on: it shows the strip only once a second tab exists.
|
|
220
222
|
*/
|
|
221
223
|
tabStrip?: 'auto' | 'always';
|
|
222
224
|
|