@willa-ui/shared 0.0.3-alpha.f3c50c9 → 0.0.4
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 +23 -0
- package/dist/index.cjs +705 -1
- package/dist/index.d.cts +225 -3
- package/dist/index.global.js +50100 -1
- package/dist/index.js +833 -2
- package/dist/index.mjs +651 -3
- package/package.json +4 -3
package/dist/index.d.cts
CHANGED
|
@@ -1,15 +1,145 @@
|
|
|
1
1
|
/*!
|
|
2
|
-
* @willa-ui/shared.js v0.0.
|
|
2
|
+
* @willa-ui/shared.js v0.0.4
|
|
3
3
|
* (c) 2026 chentao.arthur
|
|
4
4
|
*/
|
|
5
|
-
import { ReactNode } from "react";
|
|
5
|
+
import { ComponentPropsWithoutRef, ReactNode, Ref, RefObject, SetStateAction } from "react";
|
|
6
6
|
|
|
7
|
+
//#region src/css.d.ts
|
|
8
|
+
declare function formatCssSize(value?: number | string): string | undefined;
|
|
9
|
+
//#endregion
|
|
7
10
|
//#region src/clipboard.d.ts
|
|
8
11
|
declare function copyToClipboard(text: string): Promise<boolean>;
|
|
9
12
|
//#endregion
|
|
13
|
+
//#region src/controllableState.d.ts
|
|
14
|
+
type ControllableStateOptions<Value> = {
|
|
15
|
+
value?: Value;
|
|
16
|
+
defaultValue: Value | (() => Value);
|
|
17
|
+
onChange?: (value: Value) => void;
|
|
18
|
+
};
|
|
19
|
+
declare function useControllableState<Value>(options: ControllableStateOptions<Value>): readonly [Value, (nextValue: SetStateAction<Value>) => void, boolean];
|
|
20
|
+
//#endregion
|
|
21
|
+
//#region src/viewport.d.ts
|
|
22
|
+
declare const MOBILE_BREAKPOINT = 640;
|
|
23
|
+
declare function isMobileViewport(viewportWidth: number): boolean;
|
|
24
|
+
declare function isMobile(): boolean;
|
|
25
|
+
//#endregion
|
|
26
|
+
//#region src/copy.d.ts
|
|
27
|
+
type CopyStatus = "idle" | "copied" | "failed";
|
|
28
|
+
type CopyToClipboardOptions = {
|
|
29
|
+
resetDuration?: number;
|
|
30
|
+
onCopy?: (text: string) => void;
|
|
31
|
+
};
|
|
32
|
+
type CopyToClipboardActionOptions = {
|
|
33
|
+
resetDuration?: number;
|
|
34
|
+
onCopy?: (text: string) => void;
|
|
35
|
+
};
|
|
36
|
+
declare function useCopyToClipboard(options?: CopyToClipboardOptions): {
|
|
37
|
+
readonly status: CopyStatus;
|
|
38
|
+
readonly copied: boolean;
|
|
39
|
+
readonly failed: boolean;
|
|
40
|
+
readonly copy: (text: string, actionOptions?: CopyToClipboardActionOptions) => Promise<boolean>;
|
|
41
|
+
readonly reset: () => void;
|
|
42
|
+
};
|
|
43
|
+
//#endregion
|
|
44
|
+
//#region src/codeHighlight.d.ts
|
|
45
|
+
type CodeHighlightMeta = {
|
|
46
|
+
rawLanguage: string;
|
|
47
|
+
highlightLines: Set<number>;
|
|
48
|
+
showLineNumbers: boolean;
|
|
49
|
+
};
|
|
50
|
+
type HighlightedCode = {
|
|
51
|
+
html: string;
|
|
52
|
+
display: string;
|
|
53
|
+
};
|
|
54
|
+
declare const parseCodeMeta: (className?: string) => CodeHighlightMeta;
|
|
55
|
+
declare const normalizeHljsLanguage: (language: string) => string;
|
|
56
|
+
declare const highlightCodeToHtml: (code: string, rawLanguage: string) => HighlightedCode;
|
|
57
|
+
declare const createCodeHighlightLines: (ranges?: Array<number | readonly [start: number, end: number]>) => Set<number>;
|
|
58
|
+
//#endregion
|
|
59
|
+
//#region src/dom.d.ts
|
|
60
|
+
declare function getFocusableElements(container: HTMLElement): HTMLElement[];
|
|
61
|
+
//#endregion
|
|
62
|
+
//#region src/floating.d.ts
|
|
63
|
+
type FloatingPanelSide = "top" | "right" | "bottom" | "left";
|
|
64
|
+
type FloatingPanelAlign = "start" | "center" | "end";
|
|
65
|
+
type FloatingPanelRect = {
|
|
66
|
+
top: number;
|
|
67
|
+
right: number;
|
|
68
|
+
bottom: number;
|
|
69
|
+
left: number;
|
|
70
|
+
width: number;
|
|
71
|
+
height: number;
|
|
72
|
+
};
|
|
73
|
+
type FloatingPanelPoint = {
|
|
74
|
+
x: number;
|
|
75
|
+
y: number;
|
|
76
|
+
};
|
|
77
|
+
type FloatingPanelPosition = {
|
|
78
|
+
top: number;
|
|
79
|
+
left: number;
|
|
80
|
+
minWidth?: number;
|
|
81
|
+
};
|
|
82
|
+
type FloatingPanelPositionOptions = {
|
|
83
|
+
anchorRect?: FloatingPanelRect;
|
|
84
|
+
anchorPoint?: FloatingPanelPoint;
|
|
85
|
+
floatingRect: Pick<FloatingPanelRect, "width" | "height">;
|
|
86
|
+
side?: FloatingPanelSide;
|
|
87
|
+
align?: FloatingPanelAlign;
|
|
88
|
+
offset?: number;
|
|
89
|
+
viewportWidth?: number;
|
|
90
|
+
viewportHeight?: number;
|
|
91
|
+
viewportPadding?: number;
|
|
92
|
+
matchAnchorMinWidth?: boolean;
|
|
93
|
+
};
|
|
94
|
+
declare function getFloatingPanelPosition(options: FloatingPanelPositionOptions): FloatingPanelPosition;
|
|
95
|
+
//#endregion
|
|
96
|
+
//#region src/floatingLayer.d.ts
|
|
97
|
+
type FloatingLayerPosition = FloatingPanelPosition & {
|
|
98
|
+
anchorRect?: FloatingPanelRect;
|
|
99
|
+
width?: number;
|
|
100
|
+
};
|
|
101
|
+
type UseFloatingLayerOptions = {
|
|
102
|
+
open: boolean;
|
|
103
|
+
triggerRef?: RefObject<HTMLElement | null>;
|
|
104
|
+
floatingRef: RefObject<HTMLElement | null>;
|
|
105
|
+
anchorRect?: FloatingPanelRect | null;
|
|
106
|
+
anchorPoint?: FloatingPanelPoint | null;
|
|
107
|
+
side?: FloatingPanelSide;
|
|
108
|
+
align?: FloatingPanelAlign;
|
|
109
|
+
offset?: number;
|
|
110
|
+
viewportPadding?: number;
|
|
111
|
+
minWidth?: number;
|
|
112
|
+
fallbackWidth?: number;
|
|
113
|
+
fallbackHeight?: number;
|
|
114
|
+
matchAnchorWidth?: boolean;
|
|
115
|
+
matchAnchorMinWidth?: boolean;
|
|
116
|
+
fullWidthBelow?: number;
|
|
117
|
+
applyResolvedWidth?: boolean;
|
|
118
|
+
flipToFit?: boolean;
|
|
119
|
+
outsideRefs?: Array<RefObject<HTMLElement | null>>;
|
|
120
|
+
closeOnOutsidePointerDown?: boolean;
|
|
121
|
+
restoreFocus?: boolean;
|
|
122
|
+
onClose?: () => void;
|
|
123
|
+
onOpenAutoFocus?: () => void;
|
|
124
|
+
getAnchorRect?: () => FloatingPanelRect | null;
|
|
125
|
+
getAnchorPoint?: () => FloatingPanelPoint | null;
|
|
126
|
+
};
|
|
127
|
+
declare function useFloatingLayer(options: UseFloatingLayerOptions): {
|
|
128
|
+
position: FloatingLayerPosition | undefined;
|
|
129
|
+
updatePosition: () => void;
|
|
130
|
+
};
|
|
131
|
+
//#endregion
|
|
10
132
|
//#region src/nodes.d.ts
|
|
11
133
|
declare function isMediaOnlyParagraph(children: ReactNode): boolean;
|
|
12
134
|
//#endregion
|
|
135
|
+
//#region src/refs.d.ts
|
|
136
|
+
declare function assignRef<T>(ref: Ref<T> | undefined, value: T | null): void;
|
|
137
|
+
declare function composeRefs<T>(...refs: Array<Ref<T> | undefined>): (value: T | null) => void;
|
|
138
|
+
//#endregion
|
|
139
|
+
//#region src/number.d.ts
|
|
140
|
+
declare function clampNumber(value: number, min: number, max: number): number;
|
|
141
|
+
declare function createNumberRange(start: number, end: number): number[];
|
|
142
|
+
//#endregion
|
|
13
143
|
//#region src/types.d.ts
|
|
14
144
|
type Heading = {
|
|
15
145
|
level: 2 | 3;
|
|
@@ -32,9 +162,101 @@ type LightboxState = {
|
|
|
32
162
|
type OpenLightbox = (state: LightboxState | null) => void;
|
|
33
163
|
type ResolveAssetUrl = (articleSourcePath: string, assetPath: string) => string | undefined;
|
|
34
164
|
//#endregion
|
|
165
|
+
//#region src/media.d.ts
|
|
166
|
+
type MediaContextProps = {
|
|
167
|
+
articleSourcePath?: string;
|
|
168
|
+
resolveAssetUrl?: ResolveAssetUrl;
|
|
169
|
+
};
|
|
170
|
+
declare function resolveMediaAsset(props: MediaContextProps, assetPath?: string): string | undefined;
|
|
171
|
+
declare function resolveMediaVolume(volume?: number): number | undefined;
|
|
172
|
+
//#endregion
|
|
173
|
+
//#region src/link.d.ts
|
|
174
|
+
type WillaRenderLinkProps = Omit<ComponentPropsWithoutRef<"a">, "children" | "href"> & {
|
|
175
|
+
href: string;
|
|
176
|
+
children: ReactNode;
|
|
177
|
+
};
|
|
178
|
+
type WillaRenderLink = (props: WillaRenderLinkProps) => ReactNode;
|
|
179
|
+
//#endregion
|
|
180
|
+
//#region src/file.d.ts
|
|
181
|
+
type FileItemKind = "image" | "audio" | "video" | "file";
|
|
182
|
+
type FilePreviewMode = "dialog" | "link" | "download" | "none";
|
|
183
|
+
type FilePreviewType = "auto" | "image" | "video" | "audio" | "pdf" | "csv" | "code" | "text" | "download";
|
|
184
|
+
type FileItemStatus = "ready" | "uploading" | "error";
|
|
185
|
+
type ObjectFileItem = {
|
|
186
|
+
id: string;
|
|
187
|
+
file: File;
|
|
188
|
+
url: string;
|
|
189
|
+
kind: FileItemKind;
|
|
190
|
+
};
|
|
191
|
+
type FilePreviewDialogOptions = {
|
|
192
|
+
disabled?: boolean;
|
|
193
|
+
href?: string;
|
|
194
|
+
previewMode: FilePreviewMode;
|
|
195
|
+
status?: FileItemStatus;
|
|
196
|
+
};
|
|
197
|
+
type ResolveFilePreviewTypeOptions = {
|
|
198
|
+
name: string;
|
|
199
|
+
type: FilePreviewType;
|
|
200
|
+
mimeType?: string;
|
|
201
|
+
};
|
|
202
|
+
declare const createObjectFileItem: (file: File) => ObjectFileItem;
|
|
203
|
+
declare const resolveFileKind: (file: Pick<File, "type">) => FileItemKind;
|
|
204
|
+
declare const resolveFilePreviewType: (options: ResolveFilePreviewTypeOptions) => Exclude<FilePreviewType, "auto">;
|
|
205
|
+
declare const getFileExtension: (name: string) => string;
|
|
206
|
+
declare const getFileCodeLanguage: (name: string) => string;
|
|
207
|
+
declare const resolveFileKindLabel: (kind: FileItemKind) => "图片" | "音频" | "视频" | "文件";
|
|
208
|
+
declare const formatFileSize: (size: number) => string;
|
|
209
|
+
declare const normalizeFileProgress: (progress?: number) => number | undefined;
|
|
210
|
+
declare const resolveFilePreviewMode: (itemMode: FilePreviewMode | undefined, fallbackMode: FilePreviewMode) => FilePreviewMode;
|
|
211
|
+
declare const canOpenFilePreviewDialog: (options: FilePreviewDialogOptions) => boolean;
|
|
212
|
+
//#endregion
|
|
213
|
+
//#region src/request.d.ts
|
|
214
|
+
type RequestJsonOptions = RequestInit & {
|
|
215
|
+
dedupeKey?: string;
|
|
216
|
+
createError?: (response: Response) => Error | Promise<Error>;
|
|
217
|
+
};
|
|
218
|
+
declare function isAbortError(error: unknown): boolean;
|
|
219
|
+
declare function requestJson<T = unknown>(input: RequestInfo | URL, options?: RequestJsonOptions): Promise<T>;
|
|
220
|
+
//#endregion
|
|
35
221
|
//#region src/heading.d.ts
|
|
36
222
|
declare function flattenText(node: unknown): string;
|
|
37
223
|
declare function createHeadingIdFactory(): (text: string) => string;
|
|
38
224
|
declare function extractHeadings(source: string): Heading[];
|
|
39
225
|
//#endregion
|
|
40
|
-
|
|
226
|
+
//#region src/virtualScroll.d.ts
|
|
227
|
+
type VirtualScrollWindow = {
|
|
228
|
+
startIndex: number;
|
|
229
|
+
endIndex: number;
|
|
230
|
+
paddingTop: number;
|
|
231
|
+
paddingBottom: number;
|
|
232
|
+
totalHeight: number;
|
|
233
|
+
};
|
|
234
|
+
type VirtualScrollOptions = {
|
|
235
|
+
enabled?: boolean;
|
|
236
|
+
itemCount: number;
|
|
237
|
+
itemHeight: number;
|
|
238
|
+
overscan?: number;
|
|
239
|
+
container: HTMLElement | null;
|
|
240
|
+
};
|
|
241
|
+
declare const getVirtualScrollWindow: (options: {
|
|
242
|
+
itemCount: number;
|
|
243
|
+
itemHeight: number;
|
|
244
|
+
overscan: number;
|
|
245
|
+
scrollTop: number;
|
|
246
|
+
viewportHeight: number;
|
|
247
|
+
}) => {
|
|
248
|
+
startIndex: number;
|
|
249
|
+
endIndex: number;
|
|
250
|
+
paddingTop: number;
|
|
251
|
+
paddingBottom: number;
|
|
252
|
+
totalHeight: number;
|
|
253
|
+
};
|
|
254
|
+
declare const useVirtualScrollWindow: (options: VirtualScrollOptions) => {
|
|
255
|
+
startIndex: number;
|
|
256
|
+
endIndex: number;
|
|
257
|
+
paddingTop: number;
|
|
258
|
+
paddingBottom: number;
|
|
259
|
+
totalHeight: number;
|
|
260
|
+
};
|
|
261
|
+
//#endregion
|
|
262
|
+
export { type CodeHighlightMeta, type ControllableStateOptions, type CopyStatus, type CopyToClipboardActionOptions, type CopyToClipboardOptions, type FileItemKind, type FileItemStatus, type FilePreviewMode, type FilePreviewType, type FloatingLayerPosition, type FloatingPanelAlign, type FloatingPanelPoint, type FloatingPanelPosition, type FloatingPanelPositionOptions, type FloatingPanelRect, type FloatingPanelSide, type Heading, type HighlightedCode, type LightboxImage, type LightboxState, MOBILE_BREAKPOINT, type MediaContextProps, type ObjectFileItem, type OpenLightbox, type RequestJsonOptions, type ResolveAssetUrl, type ResolveFilePreviewTypeOptions, type UseFloatingLayerOptions, type VirtualScrollOptions, type VirtualScrollWindow, type WillaRenderLink, type WillaRenderLinkProps, assignRef, canOpenFilePreviewDialog, clampNumber, composeRefs, copyToClipboard, createCodeHighlightLines, createHeadingIdFactory, createNumberRange, createObjectFileItem, extractHeadings, flattenText, formatCssSize, formatFileSize, getFileCodeLanguage, getFileExtension, getFloatingPanelPosition, getFocusableElements, getVirtualScrollWindow, highlightCodeToHtml, isAbortError, isMediaOnlyParagraph, isMobile, isMobileViewport, normalizeFileProgress, normalizeHljsLanguage, parseCodeMeta, requestJson, resolveFileKind, resolveFileKindLabel, resolveFilePreviewMode, resolveFilePreviewType, resolveMediaAsset, resolveMediaVolume, useControllableState, useCopyToClipboard, useFloatingLayer, useVirtualScrollWindow };
|