enr 2.0.4 → 2.0.6

package/README.md

@@ -136,7 +136,3 @@ export function Home() {
 
 - `css`、`scss` 的直接导出仅是 `common.css`、`common.scss` 的别名
 - `reset.css`、`reset.scss` 不建议在非项目中使用，因为使用 `*` 修改了所有元素为 `border-box` 且定位为 `relative`。旧项目引入该文件可能会覆盖所有的已配置好的盒样式
-
-## 文档
-
-更多参阅 [enr](https://lmssee.com/quickUse/)

package/{cjs/components/ThemeContext/index.js → components/ThemeContext/index.cjs.js}

@@ -3,9 +3,9 @@
 
 var jsxRuntime = require('react/jsx-runtime');
 var react = require('react');
-var storageStore = require('../../shared/dist/es/storage-store.js');
-var sys = require('../../shared/dist/es/sys.js');
-var cookie = require('../../shared/dist/es/cookie.js');
+var storageStore = require('../../shared/dist/es/storage-store.cjs.js');
+var sys = require('../../shared/dist/es/sys.cjs.js');
+var cookie = require('../../shared/dist/es/cookie.cjs.js');
 
 /**  用于判断是否正确放置的  */
 const defaultCall = () => {
@@ -128,9 +128,7 @@ function ThemeColorModeProvider({ children, initialTheme }) {
     react.useEffect(() => {
         autoChange(colorMode);
     }, [colorMode]);
-    return (
-    /**  派发数据  */
-    jsxRuntime.jsx(ThemeColorModeContext, { value: {
+    return (jsxRuntime.jsx(ThemeColorModeContext, { value: {
             colorMode,
             colorModeClassName: `en-${colorMode}`,
             toggleColorMode,

package/{es/components/ThemeContext/index.js → components/ThemeContext/index.es.js}

@@ -1,9 +1,9 @@
 'use client';
 import { jsx } from 'react/jsx-runtime';
 import { createContext, useState, useEffect, useContext } from 'react';
-import { storageStore } from '../../shared/dist/es/storage-store.js';
-import { sysInfo } from '../../shared/dist/es/sys.js';
-import { manageCookie } from '../../shared/dist/es/cookie.js';
+import { storageStore } from '../../shared/dist/es/storage-store.es.js';
+import { sysInfo } from '../../shared/dist/es/sys.es.js';
+import { manageCookie } from '../../shared/dist/es/cookie.es.js';
 
 /**  用于判断是否正确放置的  */
 const defaultCall = () => {
@@ -126,9 +126,7 @@ function ThemeColorModeProvider({ children, initialTheme }) {
     useEffect(() => {
         autoChange(colorMode);
     }, [colorMode]);
-    return (
-    /**  派发数据  */
-    jsx(ThemeColorModeContext, { value: {
+    return (jsx(ThemeColorModeContext, { value: {
             colorMode,
             colorModeClassName: `en-${colorMode}`,
             toggleColorMode,

package/{cjs/components/image/index.js → components/image/index.cjs.js}

@@ -5,8 +5,8 @@ var jsxRuntime = require('react/jsx-runtime');
 var react = require('react');
 var styled = require('styled-components');
 var xcn = require('xcn');
-var _default = require('./default.png.js');
-var useSrcChange = require('./useSrcChange.js');
+var _default = require('./default.png.cjs.js');
+var useSrcChange = require('./useSrcChange.cjs.js');
 
 /**  片  */
 const Content = styled.styled.img `

package/{es/components/image/index.js → components/image/index.es.js}

@@ -3,8 +3,8 @@ import { jsx } from 'react/jsx-runtime';
 import { memo } from 'react';
 import { styled } from 'styled-components';
 import { xcn } from 'xcn';
-import defaultImgSrc from './default.png.js';
-import { useSrcChange } from './useSrcChange.js';
+import defaultImgSrc from './default.png.es.js';
+import { useSrcChange } from './useSrcChange.es.js';
 
 /**  片  */
 const Content = styled.img `

package/{cjs/components/image/useSrcChange.js → components/image/useSrcChange.cjs.js}

@@ -2,7 +2,7 @@
 
 var aTypeOfJs = require('a-type-of-js');
 var react = require('react');
-var _default = require('./default.png.js');
+var _default = require('./default.png.cjs.js');
 
 /**
  * 当地址触发变更

package/{es/components/image/useSrcChange.js → components/image/useSrcChange.es.js}

@@ -1,6 +1,6 @@
 import { isString } from 'a-type-of-js';
 import { useState, useEffect } from 'react';
-import defaultImgSrc from './default.png.js';
+import defaultImgSrc from './default.png.es.js';
 
 /**
  * 当地址触发变更

package/{cjs/components/layout/content.js → components/layout/content.cjs.js}

@@ -2,7 +2,7 @@
 
 var jsxRuntime = require('react/jsx-runtime');
 var xcn = require('xcn');
-var index = require('../shared/EnLayoutContent/index.js');
+var index = require('../shared/EnLayoutContent/index.cjs.js');
 
 /**
  * ## 内容区

package/{es/components/layout/content.js → components/layout/content.es.js}

@@ -1,6 +1,6 @@
 import { jsx } from 'react/jsx-runtime';
 import { xcn } from 'xcn';
-import { LayoutContentContainer } from '../shared/EnLayoutContent/index.js';
+import { LayoutContentContainer } from '../shared/EnLayoutContent/index.es.js';
 
 /**
  * ## 内容区

package/{cjs/components/layout/footer.js → components/layout/footer.cjs.js}

@@ -2,7 +2,7 @@
 
 var jsxRuntime = require('react/jsx-runtime');
 var xcn = require('xcn');
-var index = require('../shared/EnLayoutContent/index.js');
+var index = require('../shared/EnLayoutContent/index.cjs.js');
 
 /**
  * ## 布局底部

package/{es/components/layout/footer.js → components/layout/footer.es.js}

@@ -1,6 +1,6 @@
 import { jsx } from 'react/jsx-runtime';
 import { xcn } from 'xcn';
-import { LayoutFooterContent } from '../shared/EnLayoutContent/index.js';
+import { LayoutFooterContent } from '../shared/EnLayoutContent/index.es.js';
 
 /**
  * ## 布局底部

package/{cjs/components/layout/header.js → components/layout/header.cjs.js}

@@ -2,7 +2,7 @@
 
 var jsxRuntime = require('react/jsx-runtime');
 var xcn = require('xcn');
-var index = require('../shared/EnLayoutContent/index.js');
+var index = require('../shared/EnLayoutContent/index.cjs.js');
 
 /**
  * ## 布局头部

package/{es/components/layout/header.js → components/layout/header.es.js}

@@ -1,6 +1,6 @@
 import { jsx } from 'react/jsx-runtime';
 import { xcn } from 'xcn';
-import { LayoutHeaderContainer } from '../shared/EnLayoutContent/index.js';
+import { LayoutHeaderContainer } from '../shared/EnLayoutContent/index.es.js';
 
 /**
  * ## 布局头部

package/{cjs/components/layout/layout.js → components/layout/layout.cjs.js}

@@ -4,12 +4,12 @@ var jsxRuntime = require('react/jsx-runtime');
 var aTypeOfJs = require('a-type-of-js');
 var react = require('react');
 var xcn = require('xcn');
-var index = require('../shared/EnLayoutContent/index.js');
-var content = require('./content.js');
-var footer = require('./footer.js');
-var header = require('./header.js');
-var sidebar = require('./sidebar.js');
-var utils = require('./utils.js');
+var index = require('../shared/EnLayoutContent/index.cjs.js');
+var content = require('./content.cjs.js');
+var footer = require('./footer.cjs.js');
+var header = require('./header.cjs.js');
+var sidebar = require('./sidebar.cjs.js');
+var utils = require('./utils.cjs.js');
 
 /**  TODO ： 将框架元素改写成多态模式 */
 /**
@@ -230,9 +230,7 @@ const Layout = ({ width = '100%', height = '100%', ...props }) => {
             '--layout-header-height': utils.getValue(headerHeight),
             '--layout-footer-height': utils.getValue(footerHeight),
             ...style,
-        }, theme: theme, ..._props, "data-enr-ui": "layout", "data-enr-layout-type": layoutType, children: shouldUseOnlySideLayout ? (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [Sidebar, " ", Content] })) : !shouldUseSideFullLayout ? (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [Header, jsxRuntime.jsxs("div", { className: xcn.xcn($content), "data-enr-ui": "layout-side-no-full-content", children: [Sidebar, Content] }), Footer] })) : (
-        // 特殊布局
-        jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [Sidebar, jsxRuntime.jsxs("div", { className: xcn.xcn($content), "data-enr-ui": "layout-side-full-container", children: [Header, Content, Footer] })] })) }));
+        }, theme: theme, ..._props, "data-enr-ui": "layout", "data-enr-layout-type": layoutType, children: shouldUseOnlySideLayout ? (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [Sidebar, " ", Content] })) : !shouldUseSideFullLayout ? (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [Header, jsxRuntime.jsxs("div", { className: xcn.xcn($content), "data-enr-ui": "layout-side-no-full-content", children: [Sidebar, Content] }), Footer] })) : (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [Sidebar, jsxRuntime.jsxs("div", { className: xcn.xcn($content), "data-enr-ui": "layout-side-full-container", children: [Header, Content, Footer] })] })) }));
 };
 // / 渲染名 Component definition is missing display name
 Layout.displayName = 'Layout';

package/{es/components/layout/layout.js → components/layout/layout.es.js}

@@ -2,12 +2,12 @@ import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import { isString, isNumber } from 'a-type-of-js';
 import { Children, isValidElement, cloneElement } from 'react';
 import { xcn } from 'xcn';
-import { LayoutContentWrapper, EnLayoutContent } from '../shared/EnLayoutContent/index.js';
-import { InternalValueC } from './content.js';
-import { InternalValueF } from './footer.js';
-import { InternalValueH } from './header.js';
-import { InternalValueS } from './sidebar.js';
-import { isFragment, getValue } from './utils.js';
+import { LayoutContentWrapper, EnLayoutContent } from '../shared/EnLayoutContent/index.es.js';
+import { InternalValueC } from './content.es.js';
+import { InternalValueF } from './footer.es.js';
+import { InternalValueH } from './header.es.js';
+import { InternalValueS } from './sidebar.es.js';
+import { isFragment, getValue } from './utils.es.js';
 
 /**  TODO ： 将框架元素改写成多态模式 */
 /**
@@ -228,9 +228,7 @@ const Layout = ({ width = '100%', height = '100%', ...props }) => {
             '--layout-header-height': getValue(headerHeight),
             '--layout-footer-height': getValue(footerHeight),
             ...style,
-        }, theme: theme, ..._props, "data-enr-ui": "layout", "data-enr-layout-type": layoutType, children: shouldUseOnlySideLayout ? (jsxs(Fragment, { children: [Sidebar, " ", Content] })) : !shouldUseSideFullLayout ? (jsxs(Fragment, { children: [Header, jsxs("div", { className: xcn($content), "data-enr-ui": "layout-side-no-full-content", children: [Sidebar, Content] }), Footer] })) : (
-        // 特殊布局
-        jsxs(Fragment, { children: [Sidebar, jsxs("div", { className: xcn($content), "data-enr-ui": "layout-side-full-container", children: [Header, Content, Footer] })] })) }));
+        }, theme: theme, ..._props, "data-enr-ui": "layout", "data-enr-layout-type": layoutType, children: shouldUseOnlySideLayout ? (jsxs(Fragment, { children: [Sidebar, " ", Content] })) : !shouldUseSideFullLayout ? (jsxs(Fragment, { children: [Header, jsxs("div", { className: xcn($content), "data-enr-ui": "layout-side-no-full-content", children: [Sidebar, Content] }), Footer] })) : (jsxs(Fragment, { children: [Sidebar, jsxs("div", { className: xcn($content), "data-enr-ui": "layout-side-full-container", children: [Header, Content, Footer] })] })) }));
 };
 // / 渲染名 Component definition is missing display name
 Layout.displayName = 'Layout';

package/{cjs/components/layout/sidebar.js → components/layout/sidebar.cjs.js}

@@ -2,7 +2,7 @@
 
 var jsxRuntime = require('react/jsx-runtime');
 var xcn = require('xcn');
-var index = require('../shared/EnLayoutContent/index.js');
+var index = require('../shared/EnLayoutContent/index.cjs.js');
 
 /**
  * ## 侧边栏

package/{es/components/layout/sidebar.js → components/layout/sidebar.es.js}

@@ -1,6 +1,6 @@
 import { jsx } from 'react/jsx-runtime';
 import { xcn } from 'xcn';
-import { LayoutSideBarContainer } from '../shared/EnLayoutContent/index.js';
+import { LayoutSideBarContainer } from '../shared/EnLayoutContent/index.es.js';
 
 /**
  * ## 侧边栏

package/{es/src/components → components}/marquee/MarqueeEle.d.ts

@@ -1,5 +1,4 @@
 import type { PropsWithTagName } from '../type';
-import './index.scss';
 /**
  *  一个跑马灯一样的东东
  *

package/{es/src/components → components}/menu/index.d.ts

@@ -1,12 +1,10 @@
 /**
- * @packageDocumentation
  * @module @enr/index
  * @file index.ts
- * @description _
+ * @description 未开发
  * @author MrMudBean <Mr.MudBean@outlook.com>
- * @license MIT
  * @copyright 2026 ©️ MrMudBean
  * @since 2026-01-19 22:56
  * @version 2.0.0-alpha.0
- * @lastModified 2026-01-19 22:56
+ * @lastModified 2026-03-25 23:10
  */

package/{es/src/components → components}/menu/menu.d.ts

@@ -1,12 +1,10 @@
 /**
- * @packageDocumentation
  * @module @enr/menu
  * @file menu.tsx
- * @description _
+ * @description 未开发
  * @author MrMudBean <Mr.MudBean@outlook.com>
- * @license MIT
  * @copyright 2026 ©️ MrMudBean
  * @since 2026-01-19 22:56
  * @version 2.0.0-alpha.0
- * @lastModified 2026-01-19 22:56
+ * @lastModified 2026-03-25 23:10
  */

package/{cjs/components/ripples/Content.js → components/ripples/Content.cjs.js}

@@ -3,8 +3,8 @@
 var jsxRuntime = require('react/jsx-runtime');
 var react = require('react');
 var styled = require('styled-components');
-var imperativeHandle = require('./imperative-handle.js');
-var useOptionUpdate = require('./use-option-update.js');
+var imperativeHandle = require('./imperative-handle.cjs.js');
+var useOptionUpdate = require('./use-option-update.cjs.js');
 
 /**  内容组件  */
 const Content = styled.styled.div `
@@ -19,6 +19,7 @@ const Content = styled.styled.div `
   contain: layout paint style;
   will-change: transform, opacity;
 `;
+/** 公共使用部分 */
 const ComponentContent = ({ option, ripplesRef, canvas, ...props }) => {
     const { children, style, ref, ..._props } = props;
     ///  使用 配置更新

package/{es/src/components → components}/ripples/Content.d.ts

@@ -4,6 +4,7 @@ import type { JSXComponent } from '../type';
 import type { BackgroundRipplesProps } from './types';
 /**  内容组件  */
 export declare const Content: JSXComponent;
+/** 公共使用部分 */
 export declare const ComponentContent: ({ option, ripplesRef, canvas, ...props }: BackgroundRipplesProps & {
     ripplesRef: RefObject<Ripples | null>;
     canvas: RefObject<HTMLCanvasElement | null>;

package/{es/components/ripples/Content.js → components/ripples/Content.es.js}

@@ -1,8 +1,8 @@
 import { jsxs, jsx } from 'react/jsx-runtime';
 import { useImperativeHandle } from 'react';
 import { styled } from 'styled-components';
-import { createImperativeHandle } from './imperative-handle.js';
-import { useOptionUpdate } from './use-option-update.js';
+import { createImperativeHandle } from './imperative-handle.es.js';
+import { useOptionUpdate } from './use-option-update.es.js';
 
 /**  内容组件  */
 const Content = styled.div `
@@ -17,6 +17,7 @@ const Content = styled.div `
   contain: layout paint style;
   will-change: transform, opacity;
 `;
+/** 公共使用部分 */
 const ComponentContent = ({ option, ripplesRef, canvas, ...props }) => {
     const { children, style, ref, ..._props } = props;
     ///  使用 配置更新

package/{cjs/components/ripples/LazyRippleEle.js → components/ripples/LazyRippleEle.cjs.js}

@@ -3,15 +3,16 @@
 
 var jsxRuntime = require('react/jsx-runtime');
 var react = require('react');
-var useLazyRipple = require('../../customHooks/useRipples/use-lazy-ripple.js');
-var Content = require('./Content.js');
+var useLazyRipple = require('../../customHooks/useRipples/use-lazy-ripple.cjs.js');
+var Content = require('./Content.cjs.js');
 
 /**
+ * ## 一个 ripple 背景组件
+ * *需要为该组件或父组件设置背景，否则即便的渲染了，效果不明显*
  *
- * ### 一个 ripple 背景组件
- *
+ * 请**等待组件加载后**再使用其方法，否则可能出现未初始化的可能。
  *
- * *需要为该组件或父组件设置背景，否则即便的渲染了，效果不明显*
+ * 所以，可以直接更改初始化参数，而不是在未获取到组件元素节点时使用方法或属性
  *
  *  参数 props 属性：
  * - children 内嵌的 ReactNode
@@ -22,8 +23,6 @@ var Content = require('./Content.js');
  * @version 0.0.1
  * @see https://lmssee.com/lazy-background-ripple
  * @example
- * 使用：
- *
  * ```ts
  *  import { LazyBackgroundRipple } from 'enr/LazyBackgroundRipple';
  *  // 也可以全量导入
@@ -35,7 +34,6 @@ var Content = require('./Content.js');
  *            ...
  *         </LazyBackgroundRipple>
  * ```
- *
  */
 const LazyBackgroundRipple = ({ option, ...props }) => {
     /**  canvas 元素  */

package/{es/src/components → components}/ripples/LazyRippleEle.d.ts

@@ -3,19 +3,19 @@
  * @file LazyRippleEle.tsx
  * @description 涟漪
  * @author MrMudBean <Mr.MudBean@outlook.com>
- * @license MIT
  * @copyright 2026 ©️ MrMudBean
  * @since 2024-12-12 12:11
  * @version 2.0.0-alpha.0
- * @lastModified 2026-02-07 08:11
+ * @lastModified 2026-03-25 23:29
  */
 import type { BackgroundRipplesProps } from './types';
 /**
+ * ## 一个 ripple 背景组件
+ * *需要为该组件或父组件设置背景，否则即便的渲染了，效果不明显*
  *
- * ### 一个 ripple 背景组件
- *
+ * 请**等待组件加载后**再使用其方法，否则可能出现未初始化的可能。
  *
- * *需要为该组件或父组件设置背景，否则即便的渲染了，效果不明显*
+ * 所以，可以直接更改初始化参数，而不是在未获取到组件元素节点时使用方法或属性
  *
  *  参数 props 属性：
  * - children 内嵌的 ReactNode
@@ -26,8 +26,6 @@ import type { BackgroundRipplesProps } from './types';
  * @version 0.0.1
  * @see https://lmssee.com/lazy-background-ripple
  * @example
- * 使用：
- *
  * ```ts
  *  import { LazyBackgroundRipple } from 'enr/LazyBackgroundRipple';
  *  // 也可以全量导入
@@ -39,7 +37,6 @@ import type { BackgroundRipplesProps } from './types';
  *            ...
  *         </LazyBackgroundRipple>
  * ```
- *
  */
 declare const LazyBackgroundRipple: {
     ({ option, ...props }: BackgroundRipplesProps): import("react/jsx-runtime").JSX.Element;

package/{es/components/ripples/LazyRippleEle.js → components/ripples/LazyRippleEle.es.js}

@@ -1,15 +1,16 @@
 'use client';
 import { jsx } from 'react/jsx-runtime';
 import { useRef } from 'react';
-import { useLazyRipples } from '../../customHooks/useRipples/use-lazy-ripple.js';
-import { ComponentContent } from './Content.js';
+import { useLazyRipples } from '../../customHooks/useRipples/use-lazy-ripple.es.js';
+import { ComponentContent } from './Content.es.js';
 
 /**
+ * ## 一个 ripple 背景组件
+ * *需要为该组件或父组件设置背景，否则即便的渲染了，效果不明显*
  *
- * ### 一个 ripple 背景组件
- *
+ * 请**等待组件加载后**再使用其方法，否则可能出现未初始化的可能。
  *
- * *需要为该组件或父组件设置背景，否则即便的渲染了，效果不明显*
+ * 所以，可以直接更改初始化参数，而不是在未获取到组件元素节点时使用方法或属性
  *
  *  参数 props 属性：
  * - children 内嵌的 ReactNode
@@ -20,8 +21,6 @@ import { ComponentContent } from './Content.js';
  * @version 0.0.1
  * @see https://lmssee.com/lazy-background-ripple
  * @example
- * 使用：
- *
  * ```ts
  *  import { LazyBackgroundRipple } from 'enr/LazyBackgroundRipple';
  *  // 也可以全量导入
@@ -33,7 +32,6 @@ import { ComponentContent } from './Content.js';
  *            ...
  *         </LazyBackgroundRipple>
  * ```
- *
  */
 const LazyBackgroundRipple = ({ option, ...props }) => {
     /**  canvas 元素  */

package/{cjs/components/ripples/RipplesEle.js → components/ripples/RipplesEle.cjs.js}

@@ -3,14 +3,11 @@
 
 var jsxRuntime = require('react/jsx-runtime');
 var react = require('react');
-var index = require('../../customHooks/useRipples/index.js');
-var Content = require('./Content.js');
+var index = require('../../customHooks/useRipples/index.cjs.js');
+var Content = require('./Content.cjs.js');
 
 /**
- *
- * ### 一个 ripple 背景组件
- *
- *
+ * ## 一个 ripple 背景组件
  * *需要为该组件或父组件设置背景，否则即便的渲染了，效果不明显*
  *
  *  参数 props 属性：
@@ -20,8 +17,6 @@ var Content = require('./Content.js');
  * @version 0.0.1
  * @see https://lmssee.com/background-ripple
  * @example
- * 使用：
- *
  * ```ts
  *  import { BackgroundRipple } from 'enr/';
  *  // 也可以全量导入
@@ -33,7 +28,6 @@ var Content = require('./Content.js');
  *            ...
  *         </BackgroundRipple>
  * ```
- *
  */
 const BackgroundRipple = ({ option, ...props }) => {
     /**  canvas 元素  */

package/{es/src/components → components}/ripples/RipplesEle.d.ts

@@ -3,18 +3,14 @@
  * @file RipplesEle.tsx
  * @description 涟漪
  * @author MrMudBean <Mr.MudBean@outlook.com>
- * @license MIT
  * @copyright 2026 ©️ MrMudBean
  * @since 2024-12-12 12:18
  * @version 2.0.0-alpha.0
- * @lastModified 2026-02-07 08:11
+ * @lastModified 2026-03-25 20:30
  */
 import type { BackgroundRipplesProps } from './types';
 /**
- *
- * ### 一个 ripple 背景组件
- *
- *
+ * ## 一个 ripple 背景组件
  * *需要为该组件或父组件设置背景，否则即便的渲染了，效果不明显*
  *
  *  参数 props 属性：
@@ -24,8 +20,6 @@ import type { BackgroundRipplesProps } from './types';
  * @version 0.0.1
  * @see https://lmssee.com/background-ripple
  * @example
- * 使用：
- *
  * ```ts
  *  import { BackgroundRipple } from 'enr/';
  *  // 也可以全量导入
@@ -37,7 +31,6 @@ import type { BackgroundRipplesProps } from './types';
  *            ...
  *         </BackgroundRipple>
  * ```
- *
  */
 declare const BackgroundRipple: {
     ({ option, ...props }: BackgroundRipplesProps): import("react/jsx-runtime").JSX.Element;

package/{es/components/ripples/RipplesEle.js → components/ripples/RipplesEle.es.js}

@@ -1,14 +1,11 @@
 'use client';
 import { jsx } from 'react/jsx-runtime';
 import { useRef } from 'react';
-import { useRipples } from '../../customHooks/useRipples/index.js';
-import { ComponentContent } from './Content.js';
+import { useRipples } from '../../customHooks/useRipples/index.es.js';
+import { ComponentContent } from './Content.es.js';
 
 /**
- *
- * ### 一个 ripple 背景组件
- *
- *
+ * ## 一个 ripple 背景组件
  * *需要为该组件或父组件设置背景，否则即便的渲染了，效果不明显*
  *
  *  参数 props 属性：
@@ -18,8 +15,6 @@ import { ComponentContent } from './Content.js';
  * @version 0.0.1
  * @see https://lmssee.com/background-ripple
  * @example
- * 使用：
- *
  * ```ts
  *  import { BackgroundRipple } from 'enr/';
  *  // 也可以全量导入
@@ -31,7 +26,6 @@ import { ComponentContent } from './Content.js';
  *            ...
  *         </BackgroundRipple>
  * ```
- *
  */
 const BackgroundRipple = ({ option, ...props }) => {
     /**  canvas 元素  */

package/{cjs/components/ripples/imperative-handle.js → components/ripples/imperative-handle.cjs.js}

@@ -1,18 +1,17 @@
 'use strict';
 
 var aTypeOfJs = require('a-type-of-js');
-var dataDefault = require('../../customHooks/useRipples/data-default.js');
+var dataDefault = require('../../customHooks/useRipples/data-default.cjs.js');
 
 /**
  * @module @enr/imperative-handle
  * @file imperative-handle.ts
  * @description 公共的命令句柄
  * @author Mr.MudBean <Mr.MudBean@outlook.com>
- * @license MIT
  * @copyright 2026 ©️ Mr.MudBean
  * @since 2026-02-04 06:52
  * @version 2.0.1
- * @lastModified 2026-02-04 07:57
+ * @lastModified 2026-03-25 20:31
  */
 /**
  * ## 通过函数构建公共的命令句柄

package/{es/src/components → components}/ripples/imperative-handle.d.ts

@@ -3,11 +3,10 @@
  * @file imperative-handle.ts
  * @description 公共的命令句柄
  * @author Mr.MudBean <Mr.MudBean@outlook.com>
- * @license MIT
  * @copyright 2026 ©️ Mr.MudBean
  * @since 2026-02-04 06:52
  * @version 2.0.1
- * @lastModified 2026-02-04 07:57
+ * @lastModified 2026-03-25 20:31
  */
 import type { RefObject } from 'react';
 import type { Ripples } from '../../customHooks/useRipples/class-ripple';

package/{es/components/ripples/imperative-handle.js → components/ripples/imperative-handle.es.js}

@@ -1,16 +1,15 @@
 import { isUndefined } from 'a-type-of-js';
-import { defaultData } from '../../customHooks/useRipples/data-default.js';
+import { defaultData } from '../../customHooks/useRipples/data-default.es.js';
 
 /**
  * @module @enr/imperative-handle
  * @file imperative-handle.ts
  * @description 公共的命令句柄
  * @author Mr.MudBean <Mr.MudBean@outlook.com>
- * @license MIT
  * @copyright 2026 ©️ Mr.MudBean
  * @since 2026-02-04 06:52
  * @version 2.0.1
- * @lastModified 2026-02-04 07:57
+ * @lastModified 2026-03-25 20:31
  */
 /**
  * ## 通过函数构建公共的命令句柄

package/{es/src/components → components}/ripples/types.d.ts

@@ -3,18 +3,15 @@
  * @file types.ts
  * @description 类型文件
  * @author Mr.MudBean <Mr.MudBean@outlook.com>
- * @license MIT
  * @copyright 2026 ©️ Mr.MudBean
  * @since 2026-02-02 16:55
  * @version 2.0.0-alpha.4
- * @lastModified 2026-02-07 08:08
+ * @lastModified 2026-03-25 20:30
  */
 import type { RipplesOptions } from '../../customHooks/useRipples/types';
 import type { PropsWithTagNameCustomRef } from '../type';
 /**
- *
- *  背景涟漪的 props 类型
- *
+ * ## 背景涟漪的 props 类型
  * - children  可选属性，定义子组件或子组件们
  * - style     可选属性，定义自定义外壳的样式，在内含 `children` 时生效
  * - option    可选属性，自定义涟漪的初始化属性

package/{cjs/components/ripples/use-option-update.js → components/ripples/use-option-update.cjs.js}

@@ -2,7 +2,7 @@
 
 var aTypeOfJs = require('a-type-of-js');
 var react = require('react');
-var dataDefault = require('../../customHooks/useRipples/data-default.js');
+var dataDefault = require('../../customHooks/useRipples/data-default.cjs.js');
 
 /**
  * 更新参数数据