xxf_react 0.3.7 → 0.3.9

package/dist/layout/image/XImage.d.ts

@@ -0,0 +1,17 @@
+import { ImageProps } from "next/image";
+import React from "react";
+export interface XImageProps extends ImageProps {
+    /** 图片加载失败时显示的备用图片 URL */
+    fallback?: string;
+}
+/**
+ * 增强的 image 组件，支持加载失败时显示备用图片
+ * @param src - 图片地址
+ * @param fallback - 加载失败时显示的备用图片 URL
+ * @param onError - 加载失败回调
+ * @param className - 样式类名
+ * @param props - 其他 Next.js image 支持的属性
+ */
+export declare function XImage({ src, fallback, onError, ...props }: XImageProps): React.JSX.Element;
+export default XImage;
+//# sourceMappingURL=XImage.d.ts.map

package/dist/layout/image/XImage.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"XImage.d.ts","sourceRoot":"","sources":["../../../src/layout/image/XImage.tsx"],"names":[],"mappings":"AAEA,OAAc,EAAC,UAAU,EAAC,MAAM,YAAY,CAAC;AAC7C,OAAO,KAA4B,MAAM,OAAO,CAAC;AAEjD,MAAM,WAAW,WAAY,SAAQ,UAAU;IAC3C,yBAAyB;IACzB,QAAQ,CAAC,EAAE,MAAM,CAAC;CACrB;AAED;;;;;;;GAOG;AACH,wBAAgB,MAAM,CAAC,EACI,GAAG,EACH,QAAQ,EACR,OAAO,EACP,GAAG,KAAK,EACX,EAAE,WAAW,qBAsBpC;AAED,eAAe,MAAM,CAAC"}

package/dist/layout/image/XImage.js

@@ -0,0 +1,26 @@
+"use client";
+import Image from "next/image";
+import React, { useState, useEffect } from "react";
+/**
+ * 增强的 image 组件，支持加载失败时显示备用图片
+ * @param src - 图片地址
+ * @param fallback - 加载失败时显示的备用图片 URL
+ * @param onError - 加载失败回调
+ * @param className - 样式类名
+ * @param props - 其他 Next.js image 支持的属性
+ */
+export function XImage({ src, fallback, onError, ...props }) {
+    const [imgSrc, setImgSrc] = useState(src);
+    // src 变化时重置 imgSrc
+    useEffect(() => {
+        setImgSrc(src);
+    }, [src]);
+    const handleError = (e) => {
+        if (fallback && imgSrc !== fallback) {
+            setImgSrc(fallback);
+        }
+        onError === null || onError === void 0 ? void 0 : onError(e);
+    };
+    return (React.createElement(Image, { ...props, src: imgSrc, onError: handleError }));
+}
+export default XImage;

package/dist/layout/index.d.ts

@@ -3,4 +3,5 @@ export * from './resize/core/SizedLayoutContext';
 export * from './resize/core/ResizeObserverHook';
 export * from './resize/impl/SizedContainer';
 export * from './resize/impl/SizedLayout';
+export * from './image/XImage';
 //# sourceMappingURL=index.d.ts.map

package/dist/layout/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/layout/index.ts"],"names":[],"mappings":"AAAA,cAAc,gCAAgC,CAAA;AAC9C,cAAc,kCAAkC,CAAA;AAChD,cAAc,kCAAkC,CAAA;AAChD,cAAc,8BAA8B,CAAA;AAC5C,cAAc,2BAA2B,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/layout/index.ts"],"names":[],"mappings":"AAAA,cAAc,gCAAgC,CAAA;AAC9C,cAAc,kCAAkC,CAAA;AAChD,cAAc,kCAAkC,CAAA;AAChD,cAAc,8BAA8B,CAAA;AAC5C,cAAc,2BAA2B,CAAA;AACzC,cAAc,gBAAgB,CAAA"}

package/dist/layout/index.js

@@ -3,3 +3,4 @@ export * from './resize/core/SizedLayoutContext';
 export * from './resize/core/ResizeObserverHook';
 export * from './resize/impl/SizedContainer';
 export * from './resize/impl/SizedLayout';
+export * from './image/XImage';

package/dist/utils/index.d.ts

@@ -1,7 +1,4 @@
 export * from './ScrollToCenter';
 export * from './Reload';
-export * from '../layout/resize/core/ResizeObserverHook';
-export * from '../layout/resize/core/SizedLayoutContext';
-export * from '../layout/resize/impl/SizedLayout';
-export * from '../layout/resize/impl/SizedContainer';
+export * from './url-placholder';
 //# sourceMappingURL=index.d.ts.map

package/dist/utils/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/utils/index.ts"],"names":[],"mappings":"AAEA,cAAc,kBAAkB,CAAA;AAChC,cAAc,UAAU,CAAA;AACxB,cAAc,0CAA0C,CAAA;AACxD,cAAc,0CAA0C,CAAA;AACxD,cAAc,mCAAmC,CAAA;AACjD,cAAc,sCAAsC,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/utils/index.ts"],"names":[],"mappings":"AAEA,cAAc,kBAAkB,CAAA;AAChC,cAAc,UAAU,CAAA;AACxB,cAAc,kBAAkB,CAAA"}

package/dist/utils/index.js

@@ -1,7 +1,4 @@
 'use client';
 export * from './ScrollToCenter';
 export * from './Reload';
-export * from '../layout/resize/core/ResizeObserverHook';
-export * from '../layout/resize/core/SizedLayoutContext';
-export * from '../layout/resize/impl/SizedLayout';
-export * from '../layout/resize/impl/SizedContainer';
+export * from './url-placholder';

package/dist/utils/url-placholder.d.ts

@@ -0,0 +1,14 @@
+export declare const placeholderHost = "https://placehold.co";
+/**
+ * 占位图
+ * */
+export interface PlaceholderProps {
+    text?: string;
+    backgroundColor?: string;
+    textColor?: string;
+}
+/**
+ * 生成占位图 URL
+ */
+export declare function urlPlaceholder(width: number, height: number, props?: PlaceholderProps): string;
+//# sourceMappingURL=url-placholder.d.ts.map

package/dist/utils/url-placholder.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"url-placholder.d.ts","sourceRoot":"","sources":["../../src/utils/url-placholder.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,eAAe,yBAAyB,CAAA;AAErD;;KAEK;AACL,MAAM,WAAW,gBAAgB;IAC7B,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,SAAS,CAAC,EAAE,MAAM,CAAC;CACtB;AAED;;GAEG;AACH,wBAAgB,cAAc,CAC1B,KAAK,EAAE,MAAM,EACb,MAAM,EAAE,MAAM,EACd,KAAK,GAAE,gBAAqB,GAC7B,MAAM,CAgBR"}

package/dist/utils/url-placholder.js

@@ -0,0 +1,17 @@
+export const placeholderHost = "https://placehold.co";
+/**
+ * 生成占位图 URL
+ */
+export function urlPlaceholder(width, height, props = {}) {
+    const { text, backgroundColor, textColor } = props;
+    // 拼尺寸
+    const sizePart = `${width}x${height}`;
+    // 拼颜色参数（可选）
+    let colorPart = "";
+    if (backgroundColor && textColor) {
+        colorPart = `/${backgroundColor.replace("#", "")}/${textColor.replace("#", "")}`;
+    }
+    // 拼文字，如果没有 text 就显示默认尺寸
+    const textPart = `?text=${encodeURIComponent(text !== null && text !== void 0 ? text : `${width}x${height}`)}`;
+    return `https://placehold.co/${sizePart}${colorPart}${textPart}`;
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "xxf_react",
-  "version": "0.3.7",
+  "version": "0.3.9",
   "private": false,
   "type": "module",
   "main": "dist/index.js",
@@ -74,5 +74,8 @@
     "tailwind-variants": "^3.2.2",
     "tiny-lru": "^11.4.7",
     "use-debounce": "^10.0.6"
+  },
+  "devDependencies": {
+    "next": "^16.0.7"
   }
 }