@macrowing/filepilot 0.1.1 → 1.0.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.
@@ -0,0 +1,169 @@
1
+ import {
2
+ createFilePilotRegistry
3
+ } from "./chunk-KCRUK7FG.js";
4
+
5
+ // src/react.tsx
6
+ import React, { Suspense, useEffect, useMemo, useRef } from "react";
7
+ import { Fragment, jsx, jsxs } from "react/jsx-runtime";
8
+ var loadingKeyframes = `
9
+ @keyframes fp-loading-spin {
10
+ to {
11
+ transform: rotate(360deg);
12
+ }
13
+ }
14
+
15
+ @keyframes fp-loading-line-pulse {
16
+ 0%,
17
+ 100% {
18
+ opacity: 0.45;
19
+ transform: scaleX(0.86);
20
+ transform-origin: left center;
21
+ }
22
+
23
+ 50% {
24
+ opacity: 1;
25
+ transform: scaleX(1);
26
+ }
27
+ }
28
+ `;
29
+ var FilePilotLoading = ({ stage = "\u89E3\u6790\u5668\u52A0\u8F7D\u4E2D", message = "\u6B63\u5728\u51C6\u5907\u6587\u4EF6\u9884\u89C8\u80FD\u529B", progress }) => {
30
+ const resolvedProgress = typeof progress === "number" && Number.isFinite(progress) ? Math.max(0, Math.min(1, progress)) : void 0;
31
+ const progressWidth = `${Math.round((resolvedProgress ?? 0.42) * 100)}%`;
32
+ return /* @__PURE__ */ jsxs("div", { style: {
33
+ display: "grid",
34
+ placeItems: "center",
35
+ alignContent: "center",
36
+ gap: 18,
37
+ width: "100%",
38
+ height: "100%",
39
+ minHeight: 480,
40
+ padding: 24,
41
+ color: "#1f2937",
42
+ textAlign: "center",
43
+ background: "radial-gradient(circle at center, rgba(56, 103, 214, 0.12), transparent 42%), #f8fafc"
44
+ }, children: [
45
+ /* @__PURE__ */ jsx("style", { children: loadingKeyframes }),
46
+ /* @__PURE__ */ jsxs("div", { style: { position: "relative", display: "grid", placeItems: "center", width: 112, height: 112 }, children: [
47
+ /* @__PURE__ */ jsx("div", { style: {
48
+ position: "absolute",
49
+ inset: 0,
50
+ border: "3px solid rgba(56, 103, 214, 0.14)",
51
+ borderTopColor: "#3867d6",
52
+ borderRightColor: "#7298f0",
53
+ borderRadius: 999,
54
+ boxShadow: "0 0 0 8px rgba(255, 255, 255, 0.58), 0 18px 42px rgba(56, 103, 214, 0.16)",
55
+ animation: "fp-loading-spin 0.92s linear infinite"
56
+ } }),
57
+ /* @__PURE__ */ jsxs("div", { style: {
58
+ position: "relative",
59
+ display: "block",
60
+ width: 56,
61
+ height: 66,
62
+ background: "#ffffff",
63
+ border: "1px solid rgba(56, 103, 214, 0.18)",
64
+ borderRadius: 8,
65
+ boxShadow: "0 14px 28px rgba(31, 41, 55, 0.12), inset 0 0 0 1px rgba(255, 255, 255, 0.68)"
66
+ }, children: [
67
+ /* @__PURE__ */ jsx("div", { style: {
68
+ position: "absolute",
69
+ left: -8,
70
+ bottom: 8,
71
+ width: 45,
72
+ height: 54,
73
+ background: "rgba(56, 103, 214, 0.08)",
74
+ border: "1px solid rgba(56, 103, 214, 0.12)",
75
+ borderRadius: 8,
76
+ transform: "rotate(-5deg)",
77
+ zIndex: -1
78
+ } }),
79
+ /* @__PURE__ */ jsx("div", { style: {
80
+ position: "absolute",
81
+ top: -1,
82
+ right: -1,
83
+ width: 18,
84
+ height: 18,
85
+ background: "linear-gradient(135deg, rgba(56, 103, 214, 0.18) 0 50%, transparent 50% 100%)",
86
+ borderTopRightRadius: 8
87
+ } }),
88
+ /* @__PURE__ */ jsxs("div", { style: { position: "absolute", top: 18, left: 12, right: 10, display: "grid", gap: 6 }, children: [
89
+ /* @__PURE__ */ jsx("span", { style: { display: "block", height: 5, background: "rgba(56, 103, 214, 0.16)", borderRadius: 999, animation: "fp-loading-line-pulse 1.25s ease-in-out infinite" } }),
90
+ /* @__PURE__ */ jsx("span", { style: { display: "block", height: 5, width: "78%", background: "rgba(56, 103, 214, 0.16)", borderRadius: 999, animation: "fp-loading-line-pulse 1.25s ease-in-out infinite", animationDelay: "0.12s" } }),
91
+ /* @__PURE__ */ jsx("span", { style: { display: "block", height: 5, width: "56%", background: "rgba(56, 103, 214, 0.16)", borderRadius: 999, animation: "fp-loading-line-pulse 1.25s ease-in-out infinite", animationDelay: "0.24s" } })
92
+ ] })
93
+ ] })
94
+ ] }),
95
+ /* @__PURE__ */ jsxs("div", { style: { display: "grid", gap: 6, maxWidth: "min(360px, 100%)" }, children: [
96
+ /* @__PURE__ */ jsx("strong", { style: { color: "#1f2937", fontSize: 16 }, children: "\u6B63\u5728\u52A0\u8F7D\u6587\u6863..." }),
97
+ /* @__PURE__ */ jsx("span", { style: { color: "#526173", fontSize: 13, lineHeight: 1.6 }, children: stage }),
98
+ message ? /* @__PURE__ */ jsx("span", { style: { color: "#526173", fontSize: 13, lineHeight: 1.6 }, children: message }) : null
99
+ ] }),
100
+ /* @__PURE__ */ jsxs("div", { style: { display: "grid", gap: 7, width: "min(320px, 76vw)", marginTop: 8 }, children: [
101
+ /* @__PURE__ */ jsx("div", { style: { position: "relative", height: 7, overflow: "hidden", background: "rgba(56, 103, 214, 0.1)", borderRadius: 999 }, children: /* @__PURE__ */ jsx("span", { style: {
102
+ position: "absolute",
103
+ inset: "0 auto 0 0",
104
+ width: progressWidth,
105
+ minWidth: 8,
106
+ background: "linear-gradient(90deg, #3867d6, #7298f0)",
107
+ borderRadius: "inherit",
108
+ transition: "width 0.16s ease",
109
+ animation: resolvedProgress == null ? "fp-loading-line-pulse 1.05s ease-in-out infinite" : void 0
110
+ } }) }),
111
+ /* @__PURE__ */ jsx("span", { style: { color: "#526173", fontSize: 12 }, children: resolvedProgress == null ? "\u51C6\u5907\u4E2D" : `${Math.round(resolvedProgress * 100)}%` })
112
+ ] })
113
+ ] });
114
+ };
115
+ var normalizeLocale = (locale) => locale?.startsWith("en") ? "en-US" : "zh-CN";
116
+ var defaultRegistry = createFilePilotRegistry();
117
+ var defaultFallback = /* @__PURE__ */ jsx(FilePilotLoading, {});
118
+ var viewerCache = /* @__PURE__ */ new WeakMap();
119
+ var getLazyViewerEntry = (parser) => {
120
+ const cached = viewerCache.get(parser);
121
+ if (cached) return cached;
122
+ const entry = {
123
+ Viewer: React.lazy(() => parser.load().catch((error) => {
124
+ entry.loadError = error;
125
+ entry.errorListeners.forEach((listener) => listener(error));
126
+ throw error;
127
+ })),
128
+ errorListeners: /* @__PURE__ */ new Set()
129
+ };
130
+ viewerCache.set(parser, entry);
131
+ return entry;
132
+ };
133
+ var FilePilot = ({
134
+ file,
135
+ registry = defaultRegistry,
136
+ parserId,
137
+ options,
138
+ locale,
139
+ className,
140
+ style,
141
+ fallback = defaultFallback,
142
+ unsupported = null,
143
+ onError
144
+ }) => {
145
+ const parser = registry.resolve(file, parserId);
146
+ const resolvedLocale = normalizeLocale(locale);
147
+ const viewerEntry = useMemo(() => parser ? getLazyViewerEntry(parser) : void 0, [parser]);
148
+ const onErrorRef = useRef(onError);
149
+ onErrorRef.current = onError;
150
+ useEffect(() => {
151
+ if (!viewerEntry) return;
152
+ const listener = (error) => onErrorRef.current?.(error);
153
+ viewerEntry.errorListeners.add(listener);
154
+ if (viewerEntry.loadError !== void 0) listener(viewerEntry.loadError);
155
+ return () => {
156
+ viewerEntry.errorListeners.delete(listener);
157
+ };
158
+ }, [viewerEntry]);
159
+ const Viewer = viewerEntry?.Viewer;
160
+ if (!Viewer) {
161
+ return /* @__PURE__ */ jsx(Fragment, { children: typeof unsupported === "function" ? unsupported(file) : unsupported });
162
+ }
163
+ return /* @__PURE__ */ jsx("div", { style: { position: "relative", display: "flex", flexDirection: "column", width: "100%", height: "100%", minHeight: 480, flex: "1 1 auto", ...style }, children: /* @__PURE__ */ jsx(Suspense, { fallback: /* @__PURE__ */ jsx("div", { style: { position: "absolute", inset: 0, display: "flex" }, children: fallback }), children: /* @__PURE__ */ jsx(Viewer, { file, options, locale: resolvedLocale, className, style }) }) });
164
+ };
165
+
166
+ export {
167
+ FilePilotLoading,
168
+ FilePilot
169
+ };
package/dist/index.cjs CHANGED
@@ -31,6 +31,7 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
31
31
  var index_exports = {};
32
32
  __export(index_exports, {
33
33
  FilePilot: () => FilePilot,
34
+ FilePilotLoading: () => FilePilotLoading,
34
35
  createFilePilotRegistry: () => createFilePilotRegistry
35
36
  });
36
37
  module.exports = __toCommonJS(index_exports);
@@ -76,8 +77,116 @@ var createFilePilotRegistry = (initialParsers = []) => {
76
77
  // src/react.tsx
77
78
  var import_react = __toESM(require("react"), 1);
78
79
  var import_jsx_runtime = require("react/jsx-runtime");
80
+ var loadingKeyframes = `
81
+ @keyframes fp-loading-spin {
82
+ to {
83
+ transform: rotate(360deg);
84
+ }
85
+ }
86
+
87
+ @keyframes fp-loading-line-pulse {
88
+ 0%,
89
+ 100% {
90
+ opacity: 0.45;
91
+ transform: scaleX(0.86);
92
+ transform-origin: left center;
93
+ }
94
+
95
+ 50% {
96
+ opacity: 1;
97
+ transform: scaleX(1);
98
+ }
99
+ }
100
+ `;
101
+ var FilePilotLoading = ({ stage = "\u89E3\u6790\u5668\u52A0\u8F7D\u4E2D", message = "\u6B63\u5728\u51C6\u5907\u6587\u4EF6\u9884\u89C8\u80FD\u529B", progress }) => {
102
+ const resolvedProgress = typeof progress === "number" && Number.isFinite(progress) ? Math.max(0, Math.min(1, progress)) : void 0;
103
+ const progressWidth = `${Math.round((resolvedProgress ?? 0.42) * 100)}%`;
104
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { style: {
105
+ display: "grid",
106
+ placeItems: "center",
107
+ alignContent: "center",
108
+ gap: 18,
109
+ width: "100%",
110
+ height: "100%",
111
+ minHeight: 480,
112
+ padding: 24,
113
+ color: "#1f2937",
114
+ textAlign: "center",
115
+ background: "radial-gradient(circle at center, rgba(56, 103, 214, 0.12), transparent 42%), #f8fafc"
116
+ }, children: [
117
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("style", { children: loadingKeyframes }),
118
+ /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { style: { position: "relative", display: "grid", placeItems: "center", width: 112, height: 112 }, children: [
119
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { style: {
120
+ position: "absolute",
121
+ inset: 0,
122
+ border: "3px solid rgba(56, 103, 214, 0.14)",
123
+ borderTopColor: "#3867d6",
124
+ borderRightColor: "#7298f0",
125
+ borderRadius: 999,
126
+ boxShadow: "0 0 0 8px rgba(255, 255, 255, 0.58), 0 18px 42px rgba(56, 103, 214, 0.16)",
127
+ animation: "fp-loading-spin 0.92s linear infinite"
128
+ } }),
129
+ /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { style: {
130
+ position: "relative",
131
+ display: "block",
132
+ width: 56,
133
+ height: 66,
134
+ background: "#ffffff",
135
+ border: "1px solid rgba(56, 103, 214, 0.18)",
136
+ borderRadius: 8,
137
+ boxShadow: "0 14px 28px rgba(31, 41, 55, 0.12), inset 0 0 0 1px rgba(255, 255, 255, 0.68)"
138
+ }, children: [
139
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { style: {
140
+ position: "absolute",
141
+ left: -8,
142
+ bottom: 8,
143
+ width: 45,
144
+ height: 54,
145
+ background: "rgba(56, 103, 214, 0.08)",
146
+ border: "1px solid rgba(56, 103, 214, 0.12)",
147
+ borderRadius: 8,
148
+ transform: "rotate(-5deg)",
149
+ zIndex: -1
150
+ } }),
151
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { style: {
152
+ position: "absolute",
153
+ top: -1,
154
+ right: -1,
155
+ width: 18,
156
+ height: 18,
157
+ background: "linear-gradient(135deg, rgba(56, 103, 214, 0.18) 0 50%, transparent 50% 100%)",
158
+ borderTopRightRadius: 8
159
+ } }),
160
+ /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { style: { position: "absolute", top: 18, left: 12, right: 10, display: "grid", gap: 6 }, children: [
161
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { style: { display: "block", height: 5, background: "rgba(56, 103, 214, 0.16)", borderRadius: 999, animation: "fp-loading-line-pulse 1.25s ease-in-out infinite" } }),
162
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { style: { display: "block", height: 5, width: "78%", background: "rgba(56, 103, 214, 0.16)", borderRadius: 999, animation: "fp-loading-line-pulse 1.25s ease-in-out infinite", animationDelay: "0.12s" } }),
163
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { style: { display: "block", height: 5, width: "56%", background: "rgba(56, 103, 214, 0.16)", borderRadius: 999, animation: "fp-loading-line-pulse 1.25s ease-in-out infinite", animationDelay: "0.24s" } })
164
+ ] })
165
+ ] })
166
+ ] }),
167
+ /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { style: { display: "grid", gap: 6, maxWidth: "min(360px, 100%)" }, children: [
168
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("strong", { style: { color: "#1f2937", fontSize: 16 }, children: "\u6B63\u5728\u52A0\u8F7D\u6587\u6863..." }),
169
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { style: { color: "#526173", fontSize: 13, lineHeight: 1.6 }, children: stage }),
170
+ message ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { style: { color: "#526173", fontSize: 13, lineHeight: 1.6 }, children: message }) : null
171
+ ] }),
172
+ /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { style: { display: "grid", gap: 7, width: "min(320px, 76vw)", marginTop: 8 }, children: [
173
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { style: { position: "relative", height: 7, overflow: "hidden", background: "rgba(56, 103, 214, 0.1)", borderRadius: 999 }, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { style: {
174
+ position: "absolute",
175
+ inset: "0 auto 0 0",
176
+ width: progressWidth,
177
+ minWidth: 8,
178
+ background: "linear-gradient(90deg, #3867d6, #7298f0)",
179
+ borderRadius: "inherit",
180
+ transition: "width 0.16s ease",
181
+ animation: resolvedProgress == null ? "fp-loading-line-pulse 1.05s ease-in-out infinite" : void 0
182
+ } }) }),
183
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { style: { color: "#526173", fontSize: 12 }, children: resolvedProgress == null ? "\u51C6\u5907\u4E2D" : `${Math.round(resolvedProgress * 100)}%` })
184
+ ] })
185
+ ] });
186
+ };
79
187
  var normalizeLocale = (locale) => locale?.startsWith("en") ? "en-US" : "zh-CN";
80
188
  var defaultRegistry = createFilePilotRegistry();
189
+ var defaultFallback = /* @__PURE__ */ (0, import_jsx_runtime.jsx)(FilePilotLoading, {});
81
190
  var viewerCache = /* @__PURE__ */ new WeakMap();
82
191
  var getLazyViewerEntry = (parser) => {
83
192
  const cached = viewerCache.get(parser);
@@ -101,7 +210,7 @@ var FilePilot = ({
101
210
  locale,
102
211
  className,
103
212
  style,
104
- fallback = null,
213
+ fallback = defaultFallback,
105
214
  unsupported = null,
106
215
  onError
107
216
  }) => {
@@ -123,10 +232,11 @@ var FilePilot = ({
123
232
  if (!Viewer) {
124
233
  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, { children: typeof unsupported === "function" ? unsupported(file) : unsupported });
125
234
  }
126
- return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react.Suspense, { fallback, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Viewer, { file, options, locale: resolvedLocale, className, style }) });
235
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { style: { position: "relative", display: "flex", flexDirection: "column", width: "100%", height: "100%", minHeight: 480, flex: "1 1 auto", ...style }, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react.Suspense, { fallback: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { style: { position: "absolute", inset: 0, display: "flex" }, children: fallback }), children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Viewer, { file, options, locale: resolvedLocale, className, style }) }) });
127
236
  };
128
237
  // Annotate the CommonJS export names for ESM import in node:
129
238
  0 && (module.exports = {
130
239
  FilePilot,
240
+ FilePilotLoading,
131
241
  createFilePilotRegistry
132
242
  });
package/dist/index.d.cts CHANGED
@@ -1,6 +1,6 @@
1
1
  import { FilePilotParser, FilePilotRegistry } from '@macrowing/filepilot-types';
2
2
  export { FilePilotFile, FilePilotKind, FilePilotLocale, FilePilotParser, FilePilotProps, FilePilotRegistry, FilePilotRenderProps, FilePilotSource } from '@macrowing/filepilot-types';
3
- export { FilePilot } from './react.cjs';
3
+ export { FilePilot, FilePilotLoading } from './react.cjs';
4
4
  import 'react';
5
5
 
6
6
  declare const createFilePilotRegistry: (initialParsers?: FilePilotParser[]) => FilePilotRegistry;
package/dist/index.d.ts CHANGED
@@ -1,6 +1,6 @@
1
1
  import { FilePilotParser, FilePilotRegistry } from '@macrowing/filepilot-types';
2
2
  export { FilePilotFile, FilePilotKind, FilePilotLocale, FilePilotParser, FilePilotProps, FilePilotRegistry, FilePilotRenderProps, FilePilotSource } from '@macrowing/filepilot-types';
3
- export { FilePilot } from './react.js';
3
+ export { FilePilot, FilePilotLoading } from './react.js';
4
4
  import 'react';
5
5
 
6
6
  declare const createFilePilotRegistry: (initialParsers?: FilePilotParser[]) => FilePilotRegistry;
package/dist/index.js CHANGED
@@ -1,10 +1,12 @@
1
1
  import {
2
- FilePilot
3
- } from "./chunk-MTBYBLJA.js";
2
+ FilePilot,
3
+ FilePilotLoading
4
+ } from "./chunk-CKS4FUE2.js";
4
5
  import {
5
6
  createFilePilotRegistry
6
7
  } from "./chunk-KCRUK7FG.js";
7
8
  export {
8
9
  FilePilot,
10
+ FilePilotLoading,
9
11
  createFilePilotRegistry
10
12
  };
package/dist/react.cjs CHANGED
@@ -30,7 +30,8 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
30
30
  // src/react.tsx
31
31
  var react_exports = {};
32
32
  __export(react_exports, {
33
- FilePilot: () => FilePilot
33
+ FilePilot: () => FilePilot,
34
+ FilePilotLoading: () => FilePilotLoading
34
35
  });
35
36
  module.exports = __toCommonJS(react_exports);
36
37
  var import_react = __toESM(require("react"), 1);
@@ -75,8 +76,116 @@ var createFilePilotRegistry = (initialParsers = []) => {
75
76
 
76
77
  // src/react.tsx
77
78
  var import_jsx_runtime = require("react/jsx-runtime");
79
+ var loadingKeyframes = `
80
+ @keyframes fp-loading-spin {
81
+ to {
82
+ transform: rotate(360deg);
83
+ }
84
+ }
85
+
86
+ @keyframes fp-loading-line-pulse {
87
+ 0%,
88
+ 100% {
89
+ opacity: 0.45;
90
+ transform: scaleX(0.86);
91
+ transform-origin: left center;
92
+ }
93
+
94
+ 50% {
95
+ opacity: 1;
96
+ transform: scaleX(1);
97
+ }
98
+ }
99
+ `;
100
+ var FilePilotLoading = ({ stage = "\u89E3\u6790\u5668\u52A0\u8F7D\u4E2D", message = "\u6B63\u5728\u51C6\u5907\u6587\u4EF6\u9884\u89C8\u80FD\u529B", progress }) => {
101
+ const resolvedProgress = typeof progress === "number" && Number.isFinite(progress) ? Math.max(0, Math.min(1, progress)) : void 0;
102
+ const progressWidth = `${Math.round((resolvedProgress ?? 0.42) * 100)}%`;
103
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { style: {
104
+ display: "grid",
105
+ placeItems: "center",
106
+ alignContent: "center",
107
+ gap: 18,
108
+ width: "100%",
109
+ height: "100%",
110
+ minHeight: 480,
111
+ padding: 24,
112
+ color: "#1f2937",
113
+ textAlign: "center",
114
+ background: "radial-gradient(circle at center, rgba(56, 103, 214, 0.12), transparent 42%), #f8fafc"
115
+ }, children: [
116
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("style", { children: loadingKeyframes }),
117
+ /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { style: { position: "relative", display: "grid", placeItems: "center", width: 112, height: 112 }, children: [
118
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { style: {
119
+ position: "absolute",
120
+ inset: 0,
121
+ border: "3px solid rgba(56, 103, 214, 0.14)",
122
+ borderTopColor: "#3867d6",
123
+ borderRightColor: "#7298f0",
124
+ borderRadius: 999,
125
+ boxShadow: "0 0 0 8px rgba(255, 255, 255, 0.58), 0 18px 42px rgba(56, 103, 214, 0.16)",
126
+ animation: "fp-loading-spin 0.92s linear infinite"
127
+ } }),
128
+ /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { style: {
129
+ position: "relative",
130
+ display: "block",
131
+ width: 56,
132
+ height: 66,
133
+ background: "#ffffff",
134
+ border: "1px solid rgba(56, 103, 214, 0.18)",
135
+ borderRadius: 8,
136
+ boxShadow: "0 14px 28px rgba(31, 41, 55, 0.12), inset 0 0 0 1px rgba(255, 255, 255, 0.68)"
137
+ }, children: [
138
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { style: {
139
+ position: "absolute",
140
+ left: -8,
141
+ bottom: 8,
142
+ width: 45,
143
+ height: 54,
144
+ background: "rgba(56, 103, 214, 0.08)",
145
+ border: "1px solid rgba(56, 103, 214, 0.12)",
146
+ borderRadius: 8,
147
+ transform: "rotate(-5deg)",
148
+ zIndex: -1
149
+ } }),
150
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { style: {
151
+ position: "absolute",
152
+ top: -1,
153
+ right: -1,
154
+ width: 18,
155
+ height: 18,
156
+ background: "linear-gradient(135deg, rgba(56, 103, 214, 0.18) 0 50%, transparent 50% 100%)",
157
+ borderTopRightRadius: 8
158
+ } }),
159
+ /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { style: { position: "absolute", top: 18, left: 12, right: 10, display: "grid", gap: 6 }, children: [
160
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { style: { display: "block", height: 5, background: "rgba(56, 103, 214, 0.16)", borderRadius: 999, animation: "fp-loading-line-pulse 1.25s ease-in-out infinite" } }),
161
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { style: { display: "block", height: 5, width: "78%", background: "rgba(56, 103, 214, 0.16)", borderRadius: 999, animation: "fp-loading-line-pulse 1.25s ease-in-out infinite", animationDelay: "0.12s" } }),
162
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { style: { display: "block", height: 5, width: "56%", background: "rgba(56, 103, 214, 0.16)", borderRadius: 999, animation: "fp-loading-line-pulse 1.25s ease-in-out infinite", animationDelay: "0.24s" } })
163
+ ] })
164
+ ] })
165
+ ] }),
166
+ /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { style: { display: "grid", gap: 6, maxWidth: "min(360px, 100%)" }, children: [
167
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("strong", { style: { color: "#1f2937", fontSize: 16 }, children: "\u6B63\u5728\u52A0\u8F7D\u6587\u6863..." }),
168
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { style: { color: "#526173", fontSize: 13, lineHeight: 1.6 }, children: stage }),
169
+ message ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { style: { color: "#526173", fontSize: 13, lineHeight: 1.6 }, children: message }) : null
170
+ ] }),
171
+ /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { style: { display: "grid", gap: 7, width: "min(320px, 76vw)", marginTop: 8 }, children: [
172
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { style: { position: "relative", height: 7, overflow: "hidden", background: "rgba(56, 103, 214, 0.1)", borderRadius: 999 }, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { style: {
173
+ position: "absolute",
174
+ inset: "0 auto 0 0",
175
+ width: progressWidth,
176
+ minWidth: 8,
177
+ background: "linear-gradient(90deg, #3867d6, #7298f0)",
178
+ borderRadius: "inherit",
179
+ transition: "width 0.16s ease",
180
+ animation: resolvedProgress == null ? "fp-loading-line-pulse 1.05s ease-in-out infinite" : void 0
181
+ } }) }),
182
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { style: { color: "#526173", fontSize: 12 }, children: resolvedProgress == null ? "\u51C6\u5907\u4E2D" : `${Math.round(resolvedProgress * 100)}%` })
183
+ ] })
184
+ ] });
185
+ };
78
186
  var normalizeLocale = (locale) => locale?.startsWith("en") ? "en-US" : "zh-CN";
79
187
  var defaultRegistry = createFilePilotRegistry();
188
+ var defaultFallback = /* @__PURE__ */ (0, import_jsx_runtime.jsx)(FilePilotLoading, {});
80
189
  var viewerCache = /* @__PURE__ */ new WeakMap();
81
190
  var getLazyViewerEntry = (parser) => {
82
191
  const cached = viewerCache.get(parser);
@@ -100,7 +209,7 @@ var FilePilot = ({
100
209
  locale,
101
210
  className,
102
211
  style,
103
- fallback = null,
212
+ fallback = defaultFallback,
104
213
  unsupported = null,
105
214
  onError
106
215
  }) => {
@@ -122,9 +231,10 @@ var FilePilot = ({
122
231
  if (!Viewer) {
123
232
  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, { children: typeof unsupported === "function" ? unsupported(file) : unsupported });
124
233
  }
125
- return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react.Suspense, { fallback, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Viewer, { file, options, locale: resolvedLocale, className, style }) });
234
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { style: { position: "relative", display: "flex", flexDirection: "column", width: "100%", height: "100%", minHeight: 480, flex: "1 1 auto", ...style }, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react.Suspense, { fallback: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { style: { position: "absolute", inset: 0, display: "flex" }, children: fallback }), children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Viewer, { file, options, locale: resolvedLocale, className, style }) }) });
126
235
  };
127
236
  // Annotate the CommonJS export names for ESM import in node:
128
237
  0 && (module.exports = {
129
- FilePilot
238
+ FilePilot,
239
+ FilePilotLoading
130
240
  });
package/dist/react.d.cts CHANGED
@@ -2,6 +2,12 @@ import React from 'react';
2
2
  import { FilePilotProps } from '@macrowing/filepilot-types';
3
3
  export { FilePilotLocale, FilePilotProps } from '@macrowing/filepilot-types';
4
4
 
5
+ type FilePilotLoadingProps = {
6
+ stage?: string;
7
+ message?: string;
8
+ progress?: number;
9
+ };
10
+ declare const FilePilotLoading: ({ stage, message, progress }: FilePilotLoadingProps) => React.JSX.Element;
5
11
  declare const FilePilot: ({ file, registry, parserId, options, locale, className, style, fallback, unsupported, onError }: FilePilotProps) => React.JSX.Element;
6
12
 
7
- export { FilePilot };
13
+ export { FilePilot, FilePilotLoading, type FilePilotLoadingProps };
package/dist/react.d.ts CHANGED
@@ -2,6 +2,12 @@ import React from 'react';
2
2
  import { FilePilotProps } from '@macrowing/filepilot-types';
3
3
  export { FilePilotLocale, FilePilotProps } from '@macrowing/filepilot-types';
4
4
 
5
+ type FilePilotLoadingProps = {
6
+ stage?: string;
7
+ message?: string;
8
+ progress?: number;
9
+ };
10
+ declare const FilePilotLoading: ({ stage, message, progress }: FilePilotLoadingProps) => React.JSX.Element;
5
11
  declare const FilePilot: ({ file, registry, parserId, options, locale, className, style, fallback, unsupported, onError }: FilePilotProps) => React.JSX.Element;
6
12
 
7
- export { FilePilot };
13
+ export { FilePilot, FilePilotLoading, type FilePilotLoadingProps };
package/dist/react.js CHANGED
@@ -1,7 +1,9 @@
1
1
  import {
2
- FilePilot
3
- } from "./chunk-MTBYBLJA.js";
2
+ FilePilot,
3
+ FilePilotLoading
4
+ } from "./chunk-CKS4FUE2.js";
4
5
  import "./chunk-KCRUK7FG.js";
5
6
  export {
6
- FilePilot
7
+ FilePilot,
8
+ FilePilotLoading
7
9
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@macrowing/filepilot",
3
- "version": "0.1.1",
3
+ "version": "1.0.0",
4
4
  "description": "Extensible, lazy-loaded React file preview toolkit.",
5
5
  "type": "module",
6
6
  "sideEffects": false,
@@ -28,15 +28,15 @@
28
28
  "dist"
29
29
  ],
30
30
  "dependencies": {
31
- "@macrowing/filepilot-types": "0.1.0"
31
+ "@macrowing/filepilot-types": "0.2.0"
32
32
  },
33
33
  "peerDependencies": {
34
- "@macrowing/filepilot-parser-drawio": "^0.1.0",
35
- "@macrowing/filepilot-parser-mdoc": "^0.1.0",
36
- "@macrowing/filepilot-parser-mmind": "^0.1.0",
37
- "@macrowing/filepilot-parser-office": "^0.1.0",
38
- "@macrowing/filepilot-parser-pdf": "^0.1.0",
39
- "@macrowing/filepilot-parser-viewer": "^0.1.0",
34
+ "@macrowing/filepilot-parser-drawio": "^1.0.0",
35
+ "@macrowing/filepilot-parser-mdoc": "^1.0.0",
36
+ "@macrowing/filepilot-parser-mmind": "^1.0.0",
37
+ "@macrowing/filepilot-parser-office": "^1.0.0",
38
+ "@macrowing/filepilot-parser-pdf": "^1.0.0",
39
+ "@macrowing/filepilot-parser-viewer": "^1.0.0",
40
40
  "react": ">=18.2.0 || >=19.0.0",
41
41
  "react-dom": ">=18.2.0 || >=19.0.0"
42
42
  },
@@ -1,60 +0,0 @@
1
- import {
2
- createFilePilotRegistry
3
- } from "./chunk-KCRUK7FG.js";
4
-
5
- // src/react.tsx
6
- import React, { Suspense, useEffect, useMemo, useRef } from "react";
7
- import { Fragment, jsx } from "react/jsx-runtime";
8
- var normalizeLocale = (locale) => locale?.startsWith("en") ? "en-US" : "zh-CN";
9
- var defaultRegistry = createFilePilotRegistry();
10
- var viewerCache = /* @__PURE__ */ new WeakMap();
11
- var getLazyViewerEntry = (parser) => {
12
- const cached = viewerCache.get(parser);
13
- if (cached) return cached;
14
- const entry = {
15
- Viewer: React.lazy(() => parser.load().catch((error) => {
16
- entry.loadError = error;
17
- entry.errorListeners.forEach((listener) => listener(error));
18
- throw error;
19
- })),
20
- errorListeners: /* @__PURE__ */ new Set()
21
- };
22
- viewerCache.set(parser, entry);
23
- return entry;
24
- };
25
- var FilePilot = ({
26
- file,
27
- registry = defaultRegistry,
28
- parserId,
29
- options,
30
- locale,
31
- className,
32
- style,
33
- fallback = null,
34
- unsupported = null,
35
- onError
36
- }) => {
37
- const parser = registry.resolve(file, parserId);
38
- const resolvedLocale = normalizeLocale(locale);
39
- const viewerEntry = useMemo(() => parser ? getLazyViewerEntry(parser) : void 0, [parser]);
40
- const onErrorRef = useRef(onError);
41
- onErrorRef.current = onError;
42
- useEffect(() => {
43
- if (!viewerEntry) return;
44
- const listener = (error) => onErrorRef.current?.(error);
45
- viewerEntry.errorListeners.add(listener);
46
- if (viewerEntry.loadError !== void 0) listener(viewerEntry.loadError);
47
- return () => {
48
- viewerEntry.errorListeners.delete(listener);
49
- };
50
- }, [viewerEntry]);
51
- const Viewer = viewerEntry?.Viewer;
52
- if (!Viewer) {
53
- return /* @__PURE__ */ jsx(Fragment, { children: typeof unsupported === "function" ? unsupported(file) : unsupported });
54
- }
55
- return /* @__PURE__ */ jsx(Suspense, { fallback, children: /* @__PURE__ */ jsx(Viewer, { file, options, locale: resolvedLocale, className, style }) });
56
- };
57
-
58
- export {
59
- FilePilot
60
- };