enr 2.0.4 → 2.0.6

package/{cjs/customHooks/useRipples/class-param.js → customHooks/useRipples/class-param.cjs.js}

@@ -1,19 +1,17 @@
 'use strict';
 
 var aTypeOfJs = require('a-type-of-js');
-var dataDefault = require('./data-default.js');
+var dataDefault = require('./data-default.cjs.js');
 
 /**
- * @packageDocumentation
  * @module @enr/class-param
  * @file class-param.ts
  * @description 参数类
  * @author MrMudBean <Mr.MudBean@outlook.com>
- * @license MIT
  * @copyright 2026 ©️ MrMudBean
  * @since 2026-01-22 02:40
  * @version 2.0.0-alpha.0
- * @lastModified 2026-02-05 19:20
+ * @lastModified 2026-03-25 20:27
  */
 /**
  * ## 传入参数

package/{es/src/customHooks → customHooks}/useRipples/class-param.d.ts

@@ -1,14 +1,12 @@
 /**
- * @packageDocumentation
  * @module @enr/class-param
  * @file class-param.ts
  * @description 参数类
  * @author MrMudBean <Mr.MudBean@outlook.com>
- * @license MIT
  * @copyright 2026 ©️ MrMudBean
  * @since 2026-01-22 02:40
  * @version 2.0.0-alpha.0
- * @lastModified 2026-02-05 19:20
+ * @lastModified 2026-03-25 20:27
  */
 import type { ImageCrossOrigin, RippleImgUrl, RipplesOptions } from './types';
 /**

package/{es/customHooks/useRipples/class-param.js → customHooks/useRipples/class-param.es.js}

@@ -1,17 +1,15 @@
 import { isBoolean, isUndefined, isArray, isString } from 'a-type-of-js';
-import { defaultData } from './data-default.js';
+import { defaultData } from './data-default.es.js';
 
 /**
- * @packageDocumentation
  * @module @enr/class-param
  * @file class-param.ts
  * @description 参数类
  * @author MrMudBean <Mr.MudBean@outlook.com>
- * @license MIT
  * @copyright 2026 ©️ MrMudBean
  * @since 2026-01-22 02:40
  * @version 2.0.0-alpha.0
- * @lastModified 2026-02-05 19:20
+ * @lastModified 2026-03-25 20:27
  */
 /**
  * ## 传入参数

package/{cjs/customHooks/useRipples/class-render-action.js → customHooks/useRipples/class-render-action.cjs.js}

@@ -1,19 +1,17 @@
 'use strict';
 
 var aTypeOfJs = require('a-type-of-js');
-var tools = require('./tools.js');
+var tools = require('./tools.cjs.js');
 
 /**
- * @packageDocumentation
  * @module @enr/class-render-action
  * @file class-render-action.ts
  * @description 渲染动作类
  * @author MrMudBean <Mr.MudBean@outlook.com>
- * @license MIT
  * @copyright 2026 ©️ MrMudBean
  * @since 2026-01-22 12:07
  * @version 2.0.0-alpha.0
- * @lastModified 2026-02-03 14:44
+ * @lastModified 2026-03-25 20:27
  */
 /**
  * ## 渲染执行类

package/{es/src/customHooks → customHooks}/useRipples/class-render-action.d.ts

@@ -1,14 +1,12 @@
 /**
- * @packageDocumentation
  * @module @enr/class-render-action
  * @file class-render-action.ts
  * @description 渲染动作类
  * @author MrMudBean <Mr.MudBean@outlook.com>
- * @license MIT
  * @copyright 2026 ©️ MrMudBean
  * @since 2026-01-22 12:07
  * @version 2.0.0-alpha.0
- * @lastModified 2026-02-03 14:44
+ * @lastModified 2026-03-25 20:27
  */
 import type { BuildBackground } from './class-build-background';
 import type { ElementEnvironment } from './class-element-environment';

package/{es/customHooks/useRipples/class-render-action.js → customHooks/useRipples/class-render-action.es.js}

@@ -1,17 +1,15 @@
 import { isUndefined, isEmptyArray, isNull, isBusinessEmptyString, isZero } from 'a-type-of-js';
-import { isNoneBackGroundColor, isNoneBackgroundImage, translateBackgroundPosition, isPercentage } from './tools.js';
+import { isNoneBackGroundColor, isNoneBackgroundImage, translateBackgroundPosition, isPercentage } from './tools.es.js';
 
 /**
- * @packageDocumentation
  * @module @enr/class-render-action
  * @file class-render-action.ts
  * @description 渲染动作类
  * @author MrMudBean <Mr.MudBean@outlook.com>
- * @license MIT
  * @copyright 2026 ©️ MrMudBean
  * @since 2026-01-22 12:07
  * @version 2.0.0-alpha.0
- * @lastModified 2026-02-03 14:44
+ * @lastModified 2026-03-25 20:27
  */
 /**
  * ## 渲染执行类

package/{cjs/customHooks/useRipples/class-render-data.js → customHooks/useRipples/class-render-data.cjs.js}

@@ -1,16 +1,14 @@
 'use strict';
 
 /**
- * @packageDocumentation
  * @module @enr/class-render-data
  * @file class-render-data.ts
  * @description 渲染数据类
  * @author MrMudBean <Mr.MudBean@outlook.com>
- * @license MIT
  * @copyright 2026 ©️ MrMudBean
  * @since 2026-01-22 02:56
  * @version 2.0.0-alpha.0
- * @lastModified 2026-02-03 17:52
+ * @lastModified 2026-03-25 20:27
  */
 /**
  * ## 原始数据类

package/{es/src/customHooks → customHooks}/useRipples/class-render-data.d.ts

@@ -1,14 +1,12 @@
 /**
- * @packageDocumentation
  * @module @enr/class-render-data
  * @file class-render-data.ts
  * @description 渲染数据类
  * @author MrMudBean <Mr.MudBean@outlook.com>
- * @license MIT
  * @copyright 2026 ©️ MrMudBean
  * @since 2026-01-22 02:56
  * @version 2.0.0-alpha.0
- * @lastModified 2026-02-03 17:52
+ * @lastModified 2026-03-25 20:27
  */
 /**
  * ## 原始数据类
@@ -35,7 +33,7 @@ export declare class RenderData {
     /**  渲染 id  */
     animationFrameId: number;
     /**  缺省背景图时的 id  */
-    transparentId: NodeJS.Timeout;
+    transparentId: number;
     /**  绘制进度 (千分制)*/
     drawProgress: number;
     /**  是否处于绘制过渡状态  */

package/{es/customHooks/useRipples/class-render-data.js → customHooks/useRipples/class-render-data.es.js}

@@ -1,14 +1,12 @@
 /**
- * @packageDocumentation
  * @module @enr/class-render-data
  * @file class-render-data.ts
  * @description 渲染数据类
  * @author MrMudBean <Mr.MudBean@outlook.com>
- * @license MIT
  * @copyright 2026 ©️ MrMudBean
  * @since 2026-01-22 02:56
  * @version 2.0.0-alpha.0
- * @lastModified 2026-02-03 17:52
+ * @lastModified 2026-03-25 20:27
  */
 /**
  * ## 原始数据类

package/{cjs/customHooks/useRipples/class-ripple.js → customHooks/useRipples/class-ripple.cjs.js}

@@ -1,33 +1,28 @@
 'use strict';
 
 var state = require('@qqi/state');
-var classBuildBackground = require('./class-build-background.js');
-var classElementEnvironment = require('./class-element-environment.js');
-var classEventAction = require('./class-event-action.js');
-var classHtmlElementMeta = require('./class-html-element-meta.js');
-var classParam = require('./class-param.js');
-var classRenderAction = require('./class-render-action.js');
-var classRenderData = require('./class-render-data.js');
-var classWebgl = require('./class-webgl.js');
-var dataDefault = require('./data-default.js');
+var classBuildBackground = require('./class-build-background.cjs.js');
+var classElementEnvironment = require('./class-element-environment.cjs.js');
+var classEventAction = require('./class-event-action.cjs.js');
+var classHtmlElementMeta = require('./class-html-element-meta.cjs.js');
+var classParam = require('./class-param.cjs.js');
+var classRenderAction = require('./class-render-action.cjs.js');
+var classRenderData = require('./class-render-data.cjs.js');
+var classWebgl = require('./class-webgl.cjs.js');
+var dataDefault = require('./data-default.cjs.js');
 
 /**
- * @packageDocumentation
  * @module @enr/class-ripple
  * @file class-ripple.ts
  * @description ripple 类，整合其他类
  * @author MrMudBean <Mr.MudBean@outlook.com>
- * @license MIT
  * @copyright 2026 ©️ MrMudBean
  * @since 2026-01-22 03:03
  * @version 2.0.0-alpha.0
- * @lastModified 2026-02-05 19:24
- *
+ * @lastModified 2026-03-25 20:26
  */
 /**
- *
  * ## 水波动涟漪的效果
- *
  * 魔改自大佬的[jQuey 代码](https://github.com/sirxemic/jquery.ripples)
  */
 class Ripples {

package/{es/src/customHooks → customHooks}/useRipples/class-ripple.d.ts

@@ -1,22 +1,17 @@
 /**
- * @packageDocumentation
  * @module @enr/class-ripple
  * @file class-ripple.ts
  * @description ripple 类，整合其他类
  * @author MrMudBean <Mr.MudBean@outlook.com>
- * @license MIT
  * @copyright 2026 ©️ MrMudBean
  * @since 2026-01-22 03:03
  * @version 2.0.0-alpha.0
- * @lastModified 2026-02-05 19:24
- *
+ * @lastModified 2026-03-25 20:26
  */
 import { RippleParam } from './class-param';
 import type { RipplesOptions } from './types';
 /**
- *
  * ## 水波动涟漪的效果
- *
  * 魔改自大佬的[jQuey 代码](https://github.com/sirxemic/jquery.ripples)
  */
 export declare class Ripples {

package/{es/customHooks/useRipples/class-ripple.js → customHooks/useRipples/class-ripple.es.js}

@@ -1,31 +1,26 @@
 import { StateManager } from '@qqi/state';
-import { BuildBackground } from './class-build-background.js';
-import { ElementEnvironment } from './class-element-environment.js';
-import { EventAction } from './class-event-action.js';
-import { ElementMeta } from './class-html-element-meta.js';
-import { RippleParam } from './class-param.js';
-import { RenderAction } from './class-render-action.js';
-import { RenderData } from './class-render-data.js';
-import { RippleGl } from './class-webgl.js';
-import { defaultData } from './data-default.js';
+import { BuildBackground } from './class-build-background.es.js';
+import { ElementEnvironment } from './class-element-environment.es.js';
+import { EventAction } from './class-event-action.es.js';
+import { ElementMeta } from './class-html-element-meta.es.js';
+import { RippleParam } from './class-param.es.js';
+import { RenderAction } from './class-render-action.es.js';
+import { RenderData } from './class-render-data.es.js';
+import { RippleGl } from './class-webgl.es.js';
+import { defaultData } from './data-default.es.js';
 
 /**
- * @packageDocumentation
  * @module @enr/class-ripple
  * @file class-ripple.ts
  * @description ripple 类，整合其他类
  * @author MrMudBean <Mr.MudBean@outlook.com>
- * @license MIT
  * @copyright 2026 ©️ MrMudBean
  * @since 2026-01-22 03:03
  * @version 2.0.0-alpha.0
- * @lastModified 2026-02-05 19:24
- *
+ * @lastModified 2026-03-25 20:26
  */
 /**
- *
  * ## 水波动涟漪的效果
- *
  * 魔改自大佬的[jQuey 代码](https://github.com/sirxemic/jquery.ripples)
  */
 class Ripples {

package/{cjs/customHooks/useRipples/class-webgl.js → customHooks/useRipples/class-webgl.cjs.js}

@@ -3,16 +3,14 @@
 var aTypeOfJs = require('a-type-of-js');
 
 /**
- * @packageDocumentation
  * @module @enr/class-webgl
  * @file class-webgl.ts
  * @description 构建 webGl
  * @author MrMudBean <Mr.MudBean@outlook.com>
- * @license MIT
  * @copyright 2026 ©️ MrMudBean
  * @since 2026-01-22 02:44
  * @version 2.0.0-alpha.0
- * @lastModified 2026-02-04 06:51
+ * @lastModified 2026-03-25 20:26
  */
 /**
  * ## webGl

package/{es/src/customHooks → customHooks}/useRipples/class-webgl.d.ts

@@ -1,14 +1,12 @@
 /**
- * @packageDocumentation
  * @module @enr/class-webgl
  * @file class-webgl.ts
  * @description 构建 webGl
  * @author MrMudBean <Mr.MudBean@outlook.com>
- * @license MIT
  * @copyright 2026 ©️ MrMudBean
  * @since 2026-01-22 02:44
  * @version 2.0.0-alpha.0
- * @lastModified 2026-02-04 06:51
+ * @lastModified 2026-03-25 20:26
  */
 import type { BuildBackground } from './class-build-background';
 import type { ElementEnvironment } from './class-element-environment';

package/{es/customHooks/useRipples/class-webgl.js → customHooks/useRipples/class-webgl.es.js}

@@ -1,16 +1,14 @@
 import { isNull, isZero } from 'a-type-of-js';
 
 /**
- * @packageDocumentation
  * @module @enr/class-webgl
  * @file class-webgl.ts
  * @description 构建 webGl
  * @author MrMudBean <Mr.MudBean@outlook.com>
- * @license MIT
  * @copyright 2026 ©️ MrMudBean
  * @since 2026-01-22 02:44
  * @version 2.0.0-alpha.0
- * @lastModified 2026-02-04 06:51
+ * @lastModified 2026-03-25 20:26
  */
 /**
  * ## webGl

package/{cjs/customHooks/useRipples/data-default.js → customHooks/useRipples/data-default.cjs.js}

@@ -10,8 +10,10 @@
  * @copyright 2026 ©️ MrMudBean
  * @since 2026-01-22 11:55
  * @version 2.0.0-alpha.0
- * @lastModified 2026-02-05 17:22
+ * @lastModified 2026-03-25 20:26
  */
+/**  TODO ： 对象改函数式编程在下一个阶段进行处理 */
+/** 默认的图像 URL */
 /**
  * ## 默认值
  */

package/{es/src/customHooks → customHooks}/useRipples/data-default.d.ts

@@ -8,9 +8,18 @@
  * @copyright 2026 ©️ MrMudBean
  * @since 2026-01-22 11:55
  * @version 2.0.0-alpha.0
- * @lastModified 2026-02-05 17:22
+ * @lastModified 2026-03-25 20:26
  */
 import type { RipplesDefaultData } from './types';
+/**  TODO ： 对象改函数式编程在下一个阶段进行处理 */
+/** 默认的图像 URL */
+export declare const defaultImgUrl: null;
+/** 默认的波速值 */
+export declare const defaultResolution = 360;
+/** 默认的波动强度 */
+export declare const defaultDropRadius = 12;
+/** 默认的扰动系数 */
+export declare const defaultPerturbation = 0.01;
 /**
  * ## 默认值
  */

package/{es/customHooks/useRipples/data-default.js → customHooks/useRipples/data-default.es.js}

@@ -8,8 +8,10 @@
  * @copyright 2026 ©️ MrMudBean
  * @since 2026-01-22 11:55
  * @version 2.0.0-alpha.0
- * @lastModified 2026-02-05 17:22
+ * @lastModified 2026-03-25 20:26
  */
+/**  TODO ： 对象改函数式编程在下一个阶段进行处理 */
+/** 默认的图像 URL */
 /**
  * ## 默认值
  */

package/{cjs/customHooks/useRipples/index.js → customHooks/useRipples/index.cjs.js}

@@ -3,34 +3,27 @@
 
 var aTypeOfJs = require('a-type-of-js');
 var react = require('react');
-var classRipple = require('./class-ripple.js');
+var classRipple = require('./class-ripple.cjs.js');
 
 /**
- * @packageDocumentation
  * @module @enr/index
  * @file index.ts
  * @description   ripple 的主要核心逻辑
  * @author MrMudBean <Mr.MudBean@outlook.com>
- * @license MIT
  * @copyright 2026 ©️ MrMudBean
  * @since 2025-06-20 01:37
  * @version 2.0.0-alpha.0
- * @lastModified 2026-02-07 08:12
+ * @lastModified 2026-03-25 19:59
  */
 /**
- *
  * ## 使用绘制 ripples 上一层
- *
- *
  * @param canvas `usrRef` 包裹的 `HTMLCanvasElement`，用于绘制图像
  * @param option  初始化的
  * @version 0.0.3
  * @see  https://lmssee.com/custom-hooks/use-ripples
  * @see  JQuery https://github.com/sirxemic/jquery.ripples
  * @example
- *
  * 下面是在 <BackgroundRipple> 中使用
- *
  * ```ts
  * import { useRipples } from 'enr';
  *
@@ -47,9 +40,7 @@ var classRipple = require('./class-ripple.js');
  *     {props.children}
  *  </>);
  *  }
- *
  * ```
- *
  */
 function useRipples(canvas, option) {
     /**  react dom  */

package/{es/src/customHooks → customHooks}/useRipples/index.d.ts

@@ -1,32 +1,15 @@
-/**
- * @packageDocumentation
- * @module @enr/index
- * @file index.ts
- * @description   ripple 的主要核心逻辑
- * @author MrMudBean <Mr.MudBean@outlook.com>
- * @license MIT
- * @copyright 2026 ©️ MrMudBean
- * @since 2025-06-20 01:37
- * @version 2.0.0-alpha.0
- * @lastModified 2026-02-07 08:12
- */
 import type { RefObject } from 'react';
 import { Ripples } from './class-ripple';
 import type { RippleImgUrl, RipplesOptions } from './types';
 /**
- *
  * ## 使用绘制 ripples 上一层
- *
- *
  * @param canvas `usrRef` 包裹的 `HTMLCanvasElement`，用于绘制图像
  * @param option  初始化的
  * @version 0.0.3
  * @see  https://lmssee.com/custom-hooks/use-ripples
  * @see  JQuery https://github.com/sirxemic/jquery.ripples
  * @example
- *
  * 下面是在 <BackgroundRipple> 中使用
- *
  * ```ts
  * import { useRipples } from 'enr';
  *
@@ -43,9 +26,7 @@ import type { RippleImgUrl, RipplesOptions } from './types';
  *     {props.children}
  *  </>);
  *  }
- *
  * ```
- *
  */
 export declare function useRipples(canvas: RefObject<HTMLCanvasElement | null>, option?: RipplesOptions): RefObject<Ripples | null>;
 export { Ripples };

package/{es/customHooks/useRipples/index.js → customHooks/useRipples/index.es.js}

@@ -1,34 +1,27 @@
 'use client';
 import { isNull } from 'a-type-of-js';
 import { useRef, useEffect } from 'react';
-import { Ripples } from './class-ripple.js';
+import { Ripples } from './class-ripple.es.js';
 
 /**
- * @packageDocumentation
  * @module @enr/index
  * @file index.ts
  * @description   ripple 的主要核心逻辑
  * @author MrMudBean <Mr.MudBean@outlook.com>
- * @license MIT
  * @copyright 2026 ©️ MrMudBean
  * @since 2025-06-20 01:37
  * @version 2.0.0-alpha.0
- * @lastModified 2026-02-07 08:12
+ * @lastModified 2026-03-25 19:59
  */
 /**
- *
  * ## 使用绘制 ripples 上一层
- *
- *
  * @param canvas `usrRef` 包裹的 `HTMLCanvasElement`，用于绘制图像
  * @param option  初始化的
  * @version 0.0.3
  * @see  https://lmssee.com/custom-hooks/use-ripples
  * @see  JQuery https://github.com/sirxemic/jquery.ripples
  * @example
- *
  * 下面是在 <BackgroundRipple> 中使用
- *
  * ```ts
  * import { useRipples } from 'enr';
  *
@@ -45,9 +38,7 @@ import { Ripples } from './class-ripple.js';
  *     {props.children}
  *  </>);
  *  }
- *
  * ```
- *
  */
 function useRipples(canvas, option) {
     /**  react dom  */

package/{cjs/customHooks/useRipples/tools.js → customHooks/useRipples/tools.cjs.js}

@@ -7,11 +7,10 @@ var aTypeOfJs = require('a-type-of-js');
  * @file tools.ts
  * @description 工具
  * @author MrMudBean <Mr.MudBean@outlook.com>
- * @license MIT
  * @copyright 2026 ©️ MrMudBean
  * @since 2024-12-07 01:36
  * @version 2.0.0-alpha.0
- * @lastModified 2026-01-25 01:37
+ * @lastModified 2026-03-25 19:31
  */
 /**
  *  背景色值为空

package/{es/src/customHooks → customHooks}/useRipples/tools.d.ts

@@ -3,11 +3,10 @@
  * @file tools.ts
  * @description 工具
  * @author MrMudBean <Mr.MudBean@outlook.com>
- * @license MIT
  * @copyright 2026 ©️ MrMudBean
  * @since 2024-12-07 01:36
  * @version 2.0.0-alpha.0
- * @lastModified 2026-01-25 01:37
+ * @lastModified 2026-03-25 19:31
  */
 /**
  *  背景色值为空

package/{es/customHooks/useRipples/tools.js → customHooks/useRipples/tools.es.js}

@@ -5,11 +5,10 @@ import { isUndefined, isNull } from 'a-type-of-js';
  * @file tools.ts
  * @description 工具
  * @author MrMudBean <Mr.MudBean@outlook.com>
- * @license MIT
  * @copyright 2026 ©️ MrMudBean
  * @since 2024-12-07 01:36
  * @version 2.0.0-alpha.0
- * @lastModified 2026-01-25 01:37
+ * @lastModified 2026-03-25 19:31
  */
 /**
  *  背景色值为空

package/{cjs/customHooks/useRipples/use-lazy-ripple.js → customHooks/useRipples/use-lazy-ripple.cjs.js}

@@ -5,7 +5,7 @@ var aTypeOfJs = require('a-type-of-js');
 var react = require('react');
 
 /**
- *  动态加载包含的自定义的钩子
+ * ## 懒加载使用涟漪 hook
  * @param canvas
  * @param option
  */
@@ -20,6 +20,8 @@ function useLazyRipples(canvas, option) {
     const [isLoading, setIsLoading] = react.useState(false);
     // 错误状态
     const [error, setError] = react.useState(null);
+    // 参数
+    const optionRef = react.useRef(option);
     /**  卸载  */
     function unmounted() {
         isUnmounted.current = true;
@@ -30,6 +32,10 @@ function useLazyRipples(canvas, option) {
             }
         }, 0);
     }
+    // 更新 option，防止加载 option 为旧数据
+    react.useEffect(() => {
+        optionRef.current = option;
+    }, [option]);
     react.useEffect(() => {
         isUnmounted.current = false;
         /**  非空检验（这里一般都是有值的，除非故障）  */
@@ -39,12 +45,12 @@ function useLazyRipples(canvas, option) {
         // 设置加载状态
         setIsLoading(true);
         isLoaded.current = true;
-        Promise.resolve().then(function () { return require('./class-ripple.js'); })
+        Promise.resolve().then(function () { return require('./class-ripple.cjs.js'); })
             .then(module => {
             if (aTypeOfJs.isNull(canvas.current) || isUnmounted.current) {
                 return;
             }
-            ripples.current = new module.Ripples(canvas.current, option);
+            ripples.current = new module.Ripples(canvas.current, optionRef.current);
             return;
         })
             .catch(err => {

package/{es/src/customHooks → customHooks}/useRipples/use-lazy-ripple.d.ts

@@ -2,7 +2,7 @@ import type { RefObject } from 'react';
 import type { Ripples } from './class-ripple';
 import type { RipplesOptions } from './types';
 /**
- *  动态加载包含的自定义的钩子
+ * ## 懒加载使用涟漪 hook
  * @param canvas
  * @param option
  */