@fangxinyan/lumina 0.6.17 → 0.6.18

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.
@@ -1,281 +0,0 @@
1
- 'use strict';
2
-
3
- var chunkQMX67CVT_cjs = require('./chunk-QMX67CVT.cjs');
4
- require('./tokens-RYJ3DFTU.css');
5
- require('./shared-NJHRNLRH.css');
6
- require('./Image-TDCXJISG.css');
7
- var React = require('react');
8
- var ReactDOM = require('react-dom');
9
- var jsxRuntime = require('react/jsx-runtime');
10
-
11
- function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
12
-
13
- function _interopNamespace(e) {
14
- if (e && e.__esModule) return e;
15
- var n = Object.create(null);
16
- if (e) {
17
- Object.keys(e).forEach(function (k) {
18
- if (k !== 'default') {
19
- var d = Object.getOwnPropertyDescriptor(e, k);
20
- Object.defineProperty(n, k, d.get ? d : {
21
- enumerable: true,
22
- get: function () { return e[k]; }
23
- });
24
- }
25
- });
26
- }
27
- n.default = e;
28
- return Object.freeze(n);
29
- }
30
-
31
- var React__namespace = /*#__PURE__*/_interopNamespace(React);
32
- var ReactDOM__default = /*#__PURE__*/_interopDefault(ReactDOM);
33
-
34
- var Image = React__namespace.forwardRef(({
35
- src,
36
- alt,
37
- width = 200,
38
- height,
39
- variant = "framed",
40
- frame,
41
- padding,
42
- objectFit,
43
- objectPosition,
44
- preview,
45
- previewClassName = "",
46
- previewStyle,
47
- hover = true,
48
- placeholder,
49
- imgProps,
50
- className = "",
51
- style,
52
- ...rest
53
- }, ref) => {
54
- const [loaded, setLoaded] = React__namespace.useState(false);
55
- const [err, setErr] = React__namespace.useState(false);
56
- const [open, setOpen] = React__namespace.useState(false);
57
- const visualFrame = frame ?? variant === "framed";
58
- const resolvedHeight = height ?? (variant === "icon" ? width : 140);
59
- const resolvedPadding = padding ?? (visualFrame ? void 0 : 0);
60
- const resolvedObjectFit = objectFit ?? (variant === "icon" ? "contain" : "cover");
61
- const canPreview = (preview ?? variant === "framed") && loaded && !err;
62
- const {
63
- className: imgClassName = "",
64
- style: imgStyle,
65
- onLoad,
66
- onError,
67
- ...imageRest
68
- } = imgProps ?? {};
69
- React__namespace.useEffect(() => {
70
- setLoaded(false);
71
- setErr(false);
72
- setOpen(false);
73
- }, [src]);
74
- return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
75
- /* @__PURE__ */ jsxRuntime.jsx(
76
- "div",
77
- {
78
- ref,
79
- className: `n-image ${variant} ${visualFrame ? "framed" : "unframed"} ${hover ? "hover" : ""} ${canPreview ? "clickable" : ""} ${className}`,
80
- style: { width, ...resolvedPadding !== void 0 ? { padding: resolvedPadding } : {}, ...style },
81
- onClick: () => canPreview && setOpen(true),
82
- ...rest,
83
- children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "n-image-frame", style: { width: "100%", height: resolvedHeight }, children: [
84
- !err && src && /* @__PURE__ */ jsxRuntime.jsx(
85
- "img",
86
- {
87
- ...imageRest,
88
- src,
89
- alt,
90
- className: imgClassName,
91
- style: { objectFit: resolvedObjectFit, objectPosition, ...imgStyle },
92
- onLoad: (event) => {
93
- setLoaded(true);
94
- onLoad?.(event);
95
- },
96
- onError: (event) => {
97
- setErr(true);
98
- onError?.(event);
99
- }
100
- }
101
- ),
102
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: `n-image-placeholder ${loaded && !err ? "loaded" : ""}`, children: placeholder ?? /* @__PURE__ */ jsxRuntime.jsx(chunkQMX67CVT_cjs.Icon, { name: "image", size: 28 }) }),
103
- canPreview && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
104
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "image-hint", children: [
105
- /* @__PURE__ */ jsxRuntime.jsx(chunkQMX67CVT_cjs.Icon, { name: "eye", size: 14 }),
106
- /* @__PURE__ */ jsxRuntime.jsx("span", { children: "\u70B9\u51FB\u67E5\u770B" })
107
- ] }),
108
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "image-actions", onClick: (e) => e.stopPropagation(), children: [
109
- /* @__PURE__ */ jsxRuntime.jsx(
110
- "button",
111
- {
112
- type: "button",
113
- className: "ia-btn",
114
- onClick: () => setOpen(true),
115
- "aria-label": "\u9884\u89C8",
116
- children: /* @__PURE__ */ jsxRuntime.jsx(chunkQMX67CVT_cjs.Icon, { name: "eye", size: 13 })
117
- }
118
- ),
119
- src && /* @__PURE__ */ jsxRuntime.jsx("a", { className: "ia-btn", href: src, download: true, "aria-label": "\u4E0B\u8F7D", children: /* @__PURE__ */ jsxRuntime.jsx(chunkQMX67CVT_cjs.Icon, { name: "download", size: 13 }) })
120
- ] })
121
- ] })
122
- ] })
123
- }
124
- ),
125
- open && typeof document !== "undefined" && ReactDOM__default.default.createPortal(
126
- /* @__PURE__ */ jsxRuntime.jsx(
127
- "div",
128
- {
129
- className: ["image-preview-overlay", previewClassName].filter(Boolean).join(" "),
130
- style: previewStyle,
131
- onClick: () => setOpen(false),
132
- children: /* @__PURE__ */ jsxRuntime.jsx("img", { src, alt, onClick: (e) => e.stopPropagation() })
133
- }
134
- ),
135
- document.body
136
- )
137
- ] });
138
- });
139
- Image.displayName = "Image";
140
- var ImageGrid = React__namespace.forwardRef(({
141
- images,
142
- columns,
143
- itemHeight = 130,
144
- minItemWidth = 160,
145
- gap = 14,
146
- imageProps,
147
- className = "",
148
- style,
149
- ...rest
150
- }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
151
- "div",
152
- {
153
- ref,
154
- className,
155
- style: {
156
- display: "grid",
157
- gap,
158
- gridTemplateColumns: columns ? `repeat(${columns}, 1fr)` : `repeat(auto-fill, minmax(${typeof minItemWidth === "number" ? `${minItemWidth}px` : minItemWidth}, 1fr))`,
159
- ...style
160
- },
161
- ...rest,
162
- children: images.map((img, i) => /* @__PURE__ */ jsxRuntime.jsx(
163
- Image,
164
- {
165
- ...imageProps,
166
- ...img,
167
- src: img.src,
168
- alt: img.alt,
169
- width: img.width ?? "100%",
170
- height: img.height ?? itemHeight
171
- },
172
- i
173
- ))
174
- }
175
- ));
176
- ImageGrid.displayName = "ImageGrid";
177
- var SpriteImage = React__namespace.forwardRef(({
178
- src,
179
- sprite,
180
- alt,
181
- width,
182
- height,
183
- scale = 1,
184
- backgroundSize,
185
- variant = "icon",
186
- frame,
187
- padding,
188
- className = "",
189
- style,
190
- ...rest
191
- }, ref) => {
192
- const visualFrame = frame ?? variant === "framed";
193
- const resolvedWidth = width ?? sprite.width * scale;
194
- const resolvedHeight = height ?? sprite.height * scale;
195
- const resolvedPadding = padding ?? (visualFrame ? void 0 : 0);
196
- return /* @__PURE__ */ jsxRuntime.jsx(
197
- "div",
198
- {
199
- ref,
200
- className: `n-sprite-image ${variant} ${visualFrame ? "framed" : "unframed"} ${className}`,
201
- role: alt ? "img" : void 0,
202
- "aria-label": alt || void 0,
203
- "aria-hidden": alt === "" ? true : void 0,
204
- style: { width: resolvedWidth, ...resolvedPadding !== void 0 ? { padding: resolvedPadding } : {}, ...style },
205
- ...rest,
206
- children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "n-sprite-image-frame", style: { height: resolvedHeight }, children: /* @__PURE__ */ jsxRuntime.jsx(
207
- "span",
208
- {
209
- className: "n-sprite-image-sprite",
210
- style: {
211
- width: sprite.width,
212
- height: sprite.height,
213
- backgroundImage: `url(${JSON.stringify(src)})`,
214
- backgroundPosition: `${-sprite.x}px ${-sprite.y}px`,
215
- backgroundSize,
216
- transform: scale !== 1 ? `scale(${scale})` : void 0
217
- }
218
- }
219
- ) })
220
- }
221
- );
222
- });
223
- SpriteImage.displayName = "SpriteImage";
224
- var insetStyle = (inset) => {
225
- if (inset == null) return { inset: 0 };
226
- if (typeof inset === "number" || typeof inset === "string") return { inset };
227
- return inset;
228
- };
229
- var LayeredImage = React__namespace.forwardRef(({
230
- layers,
231
- width = 64,
232
- height = 64,
233
- variant = "icon",
234
- frame,
235
- padding,
236
- className = "",
237
- style,
238
- ...rest
239
- }, ref) => {
240
- const visualFrame = frame ?? variant === "framed";
241
- const resolvedPadding = padding ?? (visualFrame ? void 0 : 0);
242
- return /* @__PURE__ */ jsxRuntime.jsx(
243
- "div",
244
- {
245
- ref,
246
- className: `n-layered-image ${variant} ${visualFrame ? "framed" : "unframed"} ${className}`,
247
- style: { width, ...resolvedPadding !== void 0 ? { padding: resolvedPadding } : {}, ...style },
248
- ...rest,
249
- children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "n-layered-image-frame", style: { height }, children: layers.map(({ src: layerSrc, alt: layerAlt = "", fit = "contain", inset, zIndex, className: layerClassName = "", style: layerStyle, ...layerRest }, index) => /* @__PURE__ */ jsxRuntime.jsx(
250
- "span",
251
- {
252
- className: "n-layered-image-layer",
253
- style: {
254
- zIndex,
255
- ...insetStyle(inset)
256
- },
257
- children: /* @__PURE__ */ jsxRuntime.jsx(
258
- "img",
259
- {
260
- ...layerRest,
261
- src: layerSrc,
262
- alt: layerAlt,
263
- className: layerClassName,
264
- style: {
265
- objectFit: fit,
266
- ...layerStyle
267
- }
268
- }
269
- )
270
- },
271
- `${layerSrc}-${index}`
272
- )) })
273
- }
274
- );
275
- });
276
- LayeredImage.displayName = "LayeredImage";
277
-
278
- exports.Image = Image;
279
- exports.ImageGrid = ImageGrid;
280
- exports.LayeredImage = LayeredImage;
281
- exports.SpriteImage = SpriteImage;