@brftech/filex-react 0.48.1 → 0.50.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/README.md +12 -12
- package/package.json +4 -4
package/README.md
CHANGED
|
@@ -4,12 +4,12 @@
|
|
|
4
4
|
|
|
5
5
|
React adapter for the [filex](https://github.com/BRF-Tech/filex)
|
|
6
6
|
file manager. Thin wrapper around `<filex-explorer>` (the
|
|
7
|
-
`@brftech/filex` Web Component)
|
|
7
|
+
`@brftech/filex` Web Component) - gives you proper React props and
|
|
8
8
|
camelCased event handlers via `@lit/react`'s `createComponent`.
|
|
9
9
|
|
|
10
|
-
> ⚠ This package wraps the **explorer** only. filex's other surface
|
|
10
|
+
> ⚠ This package wraps the **explorer** only. filex's other surface - the
|
|
11
11
|
> connections panel, where storages are added and the credentials for reaching
|
|
12
|
-
> the server over S3/SFTP/FTPS/NFS/WebDAV are minted
|
|
12
|
+
> the server over S3/SFTP/FTPS/NFS/WebDAV are minted - ships as
|
|
13
13
|
> `<filex-connections>` in [`@brftech/filex`](https://www.npmjs.com/package/@brftech/filex)
|
|
14
14
|
> and is a plain custom element: render it directly in JSX and set `config` on
|
|
15
15
|
> the ref, exactly as you would any non-React element.
|
|
@@ -36,14 +36,14 @@ export function App() {
|
|
|
36
36
|
// The navigation panel (the "+ New" menu · Home / Shared with me /
|
|
37
37
|
// My shares / Recent / Starred / Trash · your tags, personal and team ·
|
|
38
38
|
// an Apps section · storages) and how much of the
|
|
39
|
-
// explorer to draw. Both are ordinary config keys
|
|
39
|
+
// explorer to draw. Both are ordinary config keys - there is no
|
|
40
40
|
// React-specific switch for either.
|
|
41
41
|
sideNav: true,
|
|
42
42
|
connections: true,
|
|
43
|
-
// How much of the explorer to put on screen
|
|
43
|
+
// How much of the explorer to put on screen - a reduction, and only
|
|
44
44
|
// that. Two values: 'standard' (default) and 'simple' (one pane,
|
|
45
45
|
// list/grid only, no tab strip, no split pane). Anything else resolves
|
|
46
|
-
// to 'standard' with one console line naming it
|
|
46
|
+
// to 'standard' with one console line naming it - the 'drive' profile
|
|
47
47
|
// was removed after v0.40.0; pass 'simple' instead. It does NOT decide
|
|
48
48
|
// the look: the "+ New" menu, the header search field with its ⌘K hint,
|
|
49
49
|
// the filter row, the Folders/Files sections and Details/Activity are
|
|
@@ -77,12 +77,12 @@ has no stylesheet of its own and you do not need one from anywhere else.
|
|
|
77
77
|
carries the explorer's stylesheet *inside the JavaScript* and appends it to
|
|
78
78
|
`<head>` once, the first time an element mounts. The sheet is
|
|
79
79
|
`@brftech/filex-core`'s, byte for byte, so a React page and a Vue page render
|
|
80
|
-
the same explorer
|
|
80
|
+
the same explorer - the Vue wrapper is the only one that imports a
|
|
81
81
|
`style.css`, because mounting an SFC runs no registration step that could
|
|
82
82
|
inject it.
|
|
83
83
|
|
|
84
84
|
The look is the `--fe-*` custom properties. Set them on any scope above the
|
|
85
|
-
component
|
|
85
|
+
component - `:root`, a wrapper `div` - and the explorer follows:
|
|
86
86
|
|
|
87
87
|
```css
|
|
88
88
|
:root {
|
|
@@ -93,15 +93,15 @@ component — `:root`, a wrapper `div` — and the explorer follows:
|
|
|
93
93
|
|
|
94
94
|
Light/dark follows `config.theme` (`'light'` / `'dark'` / `'auto'`, and `auto`
|
|
95
95
|
reads the host's `prefers-color-scheme`). The shipped palettes are in
|
|
96
|
-
[`docs/INTEGRATION.md`](https://github.com/BRF-Tech/filex/blob/main/docs/INTEGRATION.md#themes)
|
|
97
|
-
|
|
96
|
+
[`docs/INTEGRATION.md`](https://github.com/BRF-Tech/filex/blob/main/docs/INTEGRATION.md#themes) -
|
|
97
|
+
and an operator's own themes, composed on the admin **Appearance** screen,
|
|
98
98
|
arrive through the same `--fe-*` tokens, so an embed wears the instance's
|
|
99
99
|
colours without being told about them.
|
|
100
100
|
|
|
101
101
|
> ⚠ The product mark in the top bar comes from `config.brand`
|
|
102
102
|
> (`{ name, markUrl }`), not from a slot. A host that mounts a custom element
|
|
103
|
-
> cannot fill a slot inside it
|
|
104
|
-
> an oversight
|
|
103
|
+
> cannot fill a slot inside it - that is a Vue custom-element limitation, not
|
|
104
|
+
> an oversight - so the config entry is the door.
|
|
105
105
|
|
|
106
106
|
## Bundler note
|
|
107
107
|
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@brftech/filex-react",
|
|
3
|
-
"version": "0.
|
|
4
|
-
"description": "filex React adapter
|
|
3
|
+
"version": "0.50.0",
|
|
4
|
+
"description": "filex React adapter - wraps <filex-explorer> for React idiom (props + camelCase event handlers)",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"main": "./dist/filex-react.cjs",
|
|
7
7
|
"module": "./dist/filex-react.js",
|
|
@@ -19,8 +19,8 @@
|
|
|
19
19
|
],
|
|
20
20
|
"dependencies": {
|
|
21
21
|
"@lit/react": "^1.0.5",
|
|
22
|
-
"@brftech/filex": "0.
|
|
23
|
-
"@brftech/filex-core": "0.
|
|
22
|
+
"@brftech/filex": "0.50.0",
|
|
23
|
+
"@brftech/filex-core": "0.50.0"
|
|
24
24
|
},
|
|
25
25
|
"peerDependencies": {
|
|
26
26
|
"react": "^18.0.0 || ^19.0.0",
|