react-public-components 1.2.3 → 1.2.5

package/dist/LazyLoadBox/index.css

@@ -0,0 +1,57 @@
+/* LazyLoadBox/index.less */
+.rpc_lazy_load_box {
+  position: relative;
+  box-sizing: border-box;
+  width: 100%;
+}
+.rpc_lazy_load_box_fade_in {
+  animation: rpcLazyFadeIn 0.3s cubic-bezier(0.2, 0, 0, 1) forwards;
+}
+.rpc_lazy_load_placeholder {
+  position: relative;
+  width: 100%;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  border-radius: 6px;
+  background: #f5f5f7;
+  overflow: hidden;
+  box-sizing: border-box;
+}
+.rpc_lazy_load_placeholder_bordered {
+  border: 1px dashed #d9d9d9;
+}
+.rpc_lazy_load_skeleton {
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  background:
+    linear-gradient(
+      90deg,
+      rgba(255, 255, 255, 0) 0%,
+      rgba(255, 255, 255, 0.6) 50%,
+      rgba(255, 255, 255, 0) 100%);
+  background-size: 200% 100%;
+  animation: rpcLazyShimmer 1.6s infinite ease-in-out;
+}
+@keyframes rpcLazyFadeIn {
+  from {
+    opacity: 0;
+    transform: translateY(4px);
+  }
+  to {
+    opacity: 1;
+    transform: translateY(0);
+  }
+}
+@keyframes rpcLazyShimmer {
+  0% {
+    background-position: 200% 0;
+  }
+  100% {
+    background-position: -200% 0;
+  }
+}
+/*# sourceMappingURL=index.css.map */

package/dist/LazyLoadBox/index.css.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../LazyLoadBox/index.less"],"sourcesContent":[".rpc_lazy_load_box {\n  position: relative;\n  box-sizing: border-box;\n  width: 100%;\n}\n.rpc_lazy_load_box_fade_in {\n  animation: rpcLazyFadeIn 0.3s cubic-bezier(0.2, 0, 0, 1) forwards;\n}\n.rpc_lazy_load_placeholder {\n  position: relative;\n  width: 100%;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  border-radius: 6px;\n  background: #f5f5f7;\n  overflow: hidden;\n  box-sizing: border-box;\n}\n.rpc_lazy_load_placeholder_bordered {\n  border: 1px dashed #d9d9d9;\n}\n.rpc_lazy_load_skeleton {\n  position: absolute;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.6) 50%, rgba(255, 255, 255, 0) 100%);\n  background-size: 200% 100%;\n  animation: rpcLazyShimmer 1.6s infinite ease-in-out;\n}\n@keyframes rpcLazyFadeIn {\n  from {\n    opacity: 0;\n    transform: translateY(4px);\n  }\n  to {\n    opacity: 1;\n    transform: translateY(0);\n  }\n}\n@keyframes rpcLazyShimmer {\n  0% {\n    background-position: 200% 0;\n  }\n  100% {\n    background-position: -200% 0;\n  }\n}\n"],"mappings":";AAAA,CAAC;AACC,YAAU;AACV,cAAY;AACZ,SAAO;AACT;AACA,CAAC;AACC,aAAW,cAAc,KAAK,aAAa,GAAG,EAAE,CAAC,EAAE,CAAC,EAAE,GAAG;AAC3D;AACA,CAAC;AACC,YAAU;AACV,SAAO;AACP,WAAS;AACT,eAAa;AACb,mBAAiB;AACjB,iBAAe;AACf,cAAY;AACZ,YAAU;AACV,cAAY;AACd;AACA,CAAC;AACC,UAAQ,IAAI,OAAO;AACrB;AACA,CAAC;AACC,YAAU;AACV,OAAK;AACL,QAAM;AACN,SAAO;AACP,UAAQ;AACR;AAAA,IAAY;AAAA,MAAgB,KAAhB;AAAA,MAAuB,KAAK,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAA9C;AAAA,MAAkD,KAAK,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,KAAK,GAA3E;AAAA,MAAgF,KAAK,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG;AACnH,mBAAiB,KAAK;AACtB,aAAW,eAAe,KAAK,SAAS;AAC1C;AACA,WA1Ba;AA2BX;AACE,aAAS;AACT,eAAW,WAAW;AACxB;AACA;AACE,aAAS;AACT,eAAW,WAAW;AACxB;AACF;AACA,WAZa;AAaX;AACE,yBAAqB,KAAK;AAC5B;AACA;AACE,yBAAqB,MAAM;AAC7B;AACF;","names":[]}

package/dist/LazyLoadBox/index.d.ts

@@ -0,0 +1,104 @@
+import React, { CSSProperties, ReactNode, RefObject } from 'react';
+import './index.less';
+export interface LazyLoadBoxRef {
+    /** 立即强制触发加载真实内容 */
+    load: () => void;
+    /** 重置加载状态（仅在 once=false 或需要重新触发时可用） */
+    reset: () => void;
+    /** 获取当前元素是否在可视/预加载区域内 */
+    getInView: () => boolean;
+    /** 获取当前是否已经完成过加载 */
+    getHasLoaded: () => boolean;
+    /** 获取容器原生 DOM 节点 */
+    getDOMNode: () => HTMLDivElement | null;
+}
+export interface LazyRenderProps {
+    /** 当前是否在视口范围内 */
+    isInView: boolean;
+    /** 是否已经触发过加载并完成挂载 */
+    hasLoaded: boolean;
+    /** 重新触发加载函数 */
+    load: () => void;
+}
+export type LazyOffset = number | string | [number | string, number | string] | [number | string, number | string, number | string, number | string];
+export interface LazyLoadBoxProps {
+    /**
+     * 子组件或 Render Props
+     * 当为普通组件时：未进入视口时不渲染，进入视口预加载范围后挂载并触发其内部网络请求与渲染；
+     * 当为函数时：接收 ({ isInView, hasLoaded, load }) 回传参数
+     */
+    children?: ReactNode | ((props: LazyRenderProps) => ReactNode);
+    /**
+     * 距离视口/滚动条多远时提前触发加载（单位 px，或标准 rootMargin 字符串/数组）
+     * 例如：
+     * - 纯数字：offset={200} （表示上下预加载 200px）
+     * - 字符串：offset="200px 0px"
+     * - 数组：offset={[100, 200]} （表示上下预加载距离）
+     * 默认：150
+     */
+    offset?: LazyOffset;
+    /**
+     * 未加载前的预估高度/最小高度，防止页面未渲染时高度坍塌导致滚动条剧烈跳动（CLS）
+     * 默认：180
+     */
+    height?: number | string;
+    /**
+     * 预估宽度/最小宽度（可选）
+     */
+    width?: number | string;
+    /**
+     * 未加载时显示的占位内容（如骨架屏或加载动画）
+     * 默认提供内置的高品质流光呼吸骨架屏
+     */
+    placeholder?: ReactNode;
+    /**
+     * 是否显示默认占位骨架屏（当 placeholder 未指定时生效）
+     * 默认：true
+     */
+    skeleton?: boolean;
+    /**
+     * 骨架屏是否显示微边框
+     * 默认：false
+     */
+    bordered?: boolean;
+    /**
+     * 是否只加载一次（默认 true：进入视口后保持挂载，移出不会销毁与重复请求）
+     * 若设为 false，则移出视口时会自动卸载，再次移入时重新挂载
+     */
+    once?: boolean;
+    /**
+     * 强制立即渲染（忽略视口距离，用于一键展开、批量导出、页面打印等场景）
+     */
+    forceRender?: boolean;
+    /**
+     * 指定局部滚动容器（支持 DOM 节点、RefObject、选择器字符串或 getter 函数），默认监听 window 视口
+     */
+    scrollContainer?: HTMLElement | null | string | RefObject<HTMLElement | null> | (() => HTMLElement | null);
+    /**
+     * 交叉比例阈值（0 ~ 1），默认 0
+     */
+    threshold?: number | number[];
+    /**
+     * 是否在加载完成后启用平滑淡入动效
+     * 默认：true
+     */
+    animate?: boolean;
+    /**
+     * 服务端渲染（SSR）时是否直接渲染内容（默认为 false）
+     */
+    ssr?: boolean;
+    /**
+     * 首次进入可视/预加载区域触发加载时的回调
+     */
+    onVisible?: () => void;
+    /**
+     * 可见性变化时的实时回调
+     */
+    onInViewChange?: (inView: boolean) => void;
+    /** 自定义类名 */
+    className?: string;
+    /** 自定义样式 */
+    style?: CSSProperties;
+}
+export declare const LazyLoadBox: React.ForwardRefExoticComponent<LazyLoadBoxProps & React.RefAttributes<LazyLoadBoxRef>>;
+export default LazyLoadBox;

package/dist/LazyLoadBox/index.js

@@ -0,0 +1,3 @@
+export { LazyLoadBox, LazyLoadBox_default as default } from '../chunk-VYPIRVL4.js';
+//# sourceMappingURL=index.js.map
+//# sourceMappingURL=index.js.map

package/dist/LazyLoadBox/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"names":[],"mappings":"","file":"index.js"}

package/dist/PasswordStrength/index.cjs

@@ -2,18 +2,18 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var chunkOCN7L2ID_cjs = require('../chunk-OCN7L2ID.cjs');
-require('../chunk-MBOWSS4B.cjs');
+var chunk7ZBA4NHH_cjs = require('../chunk-7ZBA4NHH.cjs');
+require('../chunk-R4V3EJVP.cjs');
 
 
 
 Object.defineProperty(exports, "default", {
   enumerable: true,
-  get: function () { return chunkOCN7L2ID_cjs.PasswordStrength_default; }
+  get: function () { return chunk7ZBA4NHH_cjs.PasswordStrength_default; }
 });
 Object.defineProperty(exports, "evaluatePasswordStrength", {
   enumerable: true,
-  get: function () { return chunkOCN7L2ID_cjs.evaluatePasswordStrength; }
+  get: function () { return chunk7ZBA4NHH_cjs.evaluatePasswordStrength; }
 });
 //# sourceMappingURL=index.cjs.map
 //# sourceMappingURL=index.cjs.map

package/dist/PasswordStrength/index.js

@@ -1,4 +1,4 @@
-export { PasswordStrength_default as default, evaluatePasswordStrength } from '../chunk-6FVAQECF.js';
-import '../chunk-ISUXPTLV.js';
+export { PasswordStrength_default as default, evaluatePasswordStrength } from '../chunk-2INP6NM4.js';
+import '../chunk-2IDVNTKR.js';
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map

package/dist/PdfViewer/index.cjs

@@ -1,10 +1,10 @@
 'use strict';
 
-var chunkKXZM322K_cjs = require('../chunk-KXZM322K.cjs');
-require('../chunk-MBOWSS4B.cjs');
+var chunkPYCSRJSF_cjs = require('../chunk-PYCSRJSF.cjs');
+require('../chunk-R4V3EJVP.cjs');
 
 
 
-module.exports = chunkKXZM322K_cjs.PdfViewer_default;
+module.exports = chunkPYCSRJSF_cjs.PdfViewer_default;
 //# sourceMappingURL=index.cjs.map
 //# sourceMappingURL=index.cjs.map

package/dist/PdfViewer/index.js

@@ -1,4 +1,4 @@
-export { PdfViewer_default as default } from '../chunk-MGUNFP6P.js';
-import '../chunk-ISUXPTLV.js';
+export { PdfViewer_default as default } from '../chunk-ZCBT56AG.js';
+import '../chunk-2IDVNTKR.js';
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map

package/dist/PeriodSelect/index.cjs

@@ -0,0 +1,22 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var chunkQU33CY3M_cjs = require('../chunk-QU33CY3M.cjs');
+
+
+
+Object.defineProperty(exports, "DEFAULT_PERIOD_OPTIONS", {
+  enumerable: true,
+  get: function () { return chunkQU33CY3M_cjs.DEFAULT_PERIOD_OPTIONS; }
+});
+Object.defineProperty(exports, "PeriodSelect", {
+  enumerable: true,
+  get: function () { return chunkQU33CY3M_cjs.PeriodSelect; }
+});
+Object.defineProperty(exports, "default", {
+  enumerable: true,
+  get: function () { return chunkQU33CY3M_cjs.PeriodSelect_default; }
+});
+//# sourceMappingURL=index.cjs.map
+//# sourceMappingURL=index.cjs.map

package/dist/PeriodSelect/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"names":[],"mappings":"","file":"index.cjs"}

package/dist/PeriodSelect/index.css

@@ -0,0 +1,88 @@
+/* PeriodSelect/index.less */
+.rpc_period_select {
+  --rpc-period-active-color: #1677ff;
+  display: inline-flex;
+  align-items: stretch;
+  border: 1px solid #d9d9d9;
+  border-radius: 4px;
+  background: #ffffff;
+  user-select: none;
+  box-sizing: border-box;
+  overflow: hidden;
+  position: relative;
+  transition: border-color 0.2s ease, box-shadow 0.2s ease;
+}
+.rpc_period_select_small {
+  height: 24px;
+}
+.rpc_period_select_small .rpc_period_select_item {
+  padding: 0 10px;
+  font-size: 12px;
+}
+.rpc_period_select_middle {
+  height: 28px;
+}
+.rpc_period_select_middle .rpc_period_select_item {
+  padding: 0 14px;
+  font-size: 14px;
+}
+.rpc_period_select_large {
+  height: 32px;
+}
+.rpc_period_select_large .rpc_period_select_item {
+  padding: 0 18px;
+  font-size: 15px;
+}
+.rpc_period_select_block {
+  display: flex;
+  width: 100%;
+}
+.rpc_period_select_block .rpc_period_select_item {
+  flex: 1;
+  text-align: center;
+}
+.rpc_period_select_disabled {
+  opacity: 0.55;
+  cursor: not-allowed;
+  background: #f5f5f5;
+  border-color: #d9d9d9;
+}
+.rpc_period_select_disabled .rpc_period_select_item {
+  cursor: not-allowed;
+  pointer-events: none;
+}
+.rpc_period_select_item {
+  position: relative;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  color: #333333;
+  cursor: pointer;
+  line-height: 1;
+  transition: color 0.15s ease, background-color 0.15s ease;
+}
+.rpc_period_select_item:hover:not(.rpc_period_select_item_disabled) {
+  color: var(--rpc-period-active-color);
+}
+.rpc_period_select_item_active {
+  color: var(--rpc-period-active-color);
+  font-weight: 500;
+}
+.rpc_period_select_item_disabled {
+  color: #bfbfbf;
+  cursor: not-allowed;
+}
+.rpc_period_select_text {
+  position: relative;
+  z-index: 2;
+}
+.rpc_period_select_active_line {
+  position: absolute;
+  left: 0;
+  top: 0;
+  bottom: 0;
+  width: 1px;
+  background-color: var(--rpc-period-active-color);
+  z-index: 3;
+}
+/*# sourceMappingURL=index.css.map */

package/dist/PeriodSelect/index.css.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../PeriodSelect/index.less"],"sourcesContent":[".rpc_period_select {\n  --rpc-period-active-color: #1677ff;\n  display: inline-flex;\n  align-items: stretch;\n  border: 1px solid #d9d9d9;\n  border-radius: 4px;\n  background: #ffffff;\n  user-select: none;\n  box-sizing: border-box;\n  overflow: hidden;\n  position: relative;\n  transition: border-color 0.2s ease, box-shadow 0.2s ease;\n}\n.rpc_period_select_small {\n  height: 24px;\n}\n.rpc_period_select_small .rpc_period_select_item {\n  padding: 0 10px;\n  font-size: 12px;\n}\n.rpc_period_select_middle {\n  height: 28px;\n}\n.rpc_period_select_middle .rpc_period_select_item {\n  padding: 0 14px;\n  font-size: 14px;\n}\n.rpc_period_select_large {\n  height: 32px;\n}\n.rpc_period_select_large .rpc_period_select_item {\n  padding: 0 18px;\n  font-size: 15px;\n}\n.rpc_period_select_block {\n  display: flex;\n  width: 100%;\n}\n.rpc_period_select_block .rpc_period_select_item {\n  flex: 1;\n  text-align: center;\n}\n.rpc_period_select_disabled {\n  opacity: 0.55;\n  cursor: not-allowed;\n  background: #f5f5f5;\n  border-color: #d9d9d9;\n}\n.rpc_period_select_disabled .rpc_period_select_item {\n  cursor: not-allowed;\n  pointer-events: none;\n}\n.rpc_period_select_item {\n  position: relative;\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  color: #333333;\n  cursor: pointer;\n  line-height: 1;\n  transition: color 0.15s ease, background-color 0.15s ease;\n}\n.rpc_period_select_item:hover:not(.rpc_period_select_item_disabled) {\n  color: var(--rpc-period-active-color);\n}\n.rpc_period_select_item_active {\n  color: var(--rpc-period-active-color);\n  font-weight: 500;\n}\n.rpc_period_select_item_disabled {\n  color: #bfbfbf;\n  cursor: not-allowed;\n}\n.rpc_period_select_text {\n  position: relative;\n  z-index: 2;\n}\n.rpc_period_select_active_line {\n  position: absolute;\n  left: 0;\n  top: 0;\n  bottom: 0;\n  width: 1px;\n  background-color: var(--rpc-period-active-color);\n  z-index: 3;\n}\n"],"mappings":";AAAA,CAAC;AACC,6BAA2B;AAC3B,WAAS;AACT,eAAa;AACb,UAAQ,IAAI,MAAM;AAClB,iBAAe;AACf,cAAY;AACZ,eAAa;AACb,cAAY;AACZ,YAAU;AACV,YAAU;AACV,cAAY,aAAa,KAAK,IAAI,EAAE,WAAW,KAAK;AACtD;AACA,CAAC;AACC,UAAQ;AACV;AACA,CAHC,wBAGwB,CAAC;AACxB,WAAS,EAAE;AACX,aAAW;AACb;AACA,CAAC;AACC,UAAQ;AACV;AACA,CAHC,yBAGyB,CAPA;AAQxB,WAAS,EAAE;AACX,aAAW;AACb;AACA,CAAC;AACC,UAAQ;AACV;AACA,CAHC,wBAGwB,CAdC;AAexB,WAAS,EAAE;AACX,aAAW;AACb;AACA,CAAC;AACC,WAAS;AACT,SAAO;AACT;AACA,CAJC,wBAIwB,CAtBC;AAuBxB,QAAM;AACN,cAAY;AACd;AACA,CAAC;AACC,WAAS;AACT,UAAQ;AACR,cAAY;AACZ,gBAAc;AAChB;AACA,CANC,2BAM2B,CAhCF;AAiCxB,UAAQ;AACR,kBAAgB;AAClB;AACA,CApC0B;AAqCxB,YAAU;AACV,WAAS;AACT,eAAa;AACb,mBAAiB;AACjB,SAAO;AACP,UAAQ;AACR,eAAa;AACb,cAAY,MAAM,MAAM,IAAI,EAAE,iBAAiB,MAAM;AACvD;AACA,CA9C0B,sBA8CH,MAAM,KAAK,CAAC;AACjC,SAAO,IAAI;AACb;AACA,CAAC;AACC,SAAO,IAAI;AACX,eAAa;AACf;AACA,CAPmC;AAQjC,SAAO;AACP,UAAQ;AACV;AACA,CAAC;AACC,YAAU;AACV,WAAS;AACX;AACA,CAAC;AACC,YAAU;AACV,QAAM;AACN,OAAK;AACL,UAAQ;AACR,SAAO;AACP,oBAAkB,IAAI;AACtB,WAAS;AACX;","names":[]}

package/dist/PeriodSelect/index.d.ts

@@ -0,0 +1,36 @@
+import React, { CSSProperties, ReactNode } from 'react';
+import './index.less';
+export interface PeriodSelectOption<T = string | number> {
+    /** 选项展示内容 */
+    label: ReactNode;
+    /** 选项值 */
+    value: T;
+    /** 是否禁用当前选项 */
+    disabled?: boolean;
+}
+export type PeriodSelectSize = 'small' | 'middle' | 'large';
+export interface PeriodSelectProps<T = string | number> {
+    /** 选项列表，默认提供【周度、月度、季度、年度】 */
+    options?: PeriodSelectOption<T>[];
+    /** 当前选中值（受控模式） */
+    value?: T;
+    /** 默认选中值（非受控模式） */
+    defaultValue?: T;
+    /** 切换选项时的回调函数 */
+    onChange?: (value: T, option: PeriodSelectOption<T>) => void;
+    /** 尺寸大小，默认为 'middle' */
+    size?: PeriodSelectSize;
+    /** 自定义高亮激活颜色（文字与高亮竖线） */
+    activeColor?: string;
+    /** 是否整体禁用 */
+    disabled?: boolean;
+    /** 是否等宽撑满父容器 */
+    block?: boolean;
+    /** 自定义容器类名 */
+    className?: string;
+    /** 自定义容器样式 */
+    style?: CSSProperties;
+}
+export declare const DEFAULT_PERIOD_OPTIONS: PeriodSelectOption<string>[];
+export declare function PeriodSelect<T = string | number>({ options, value: controlledValue, defaultValue, onChange, size, activeColor, disabled, block, className, style, }: PeriodSelectProps<T>): React.JSX.Element;
+export default PeriodSelect;

package/dist/PeriodSelect/index.js

@@ -0,0 +1,3 @@
+export { DEFAULT_PERIOD_OPTIONS, PeriodSelect, PeriodSelect_default as default } from '../chunk-RFTYEXKU.js';
+//# sourceMappingURL=index.js.map
+//# sourceMappingURL=index.js.map

package/dist/PeriodSelect/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"names":[],"mappings":"","file":"index.js"}

package/dist/QrCodeCard/index.cjs

@@ -1,10 +1,10 @@
 'use strict';
 
-var chunkJEDW76LI_cjs = require('../chunk-JEDW76LI.cjs');
-require('../chunk-MBOWSS4B.cjs');
+var chunkZWKUHYTV_cjs = require('../chunk-ZWKUHYTV.cjs');
+require('../chunk-R4V3EJVP.cjs');
 
 
 
-module.exports = chunkJEDW76LI_cjs.QrCodeCard_default;
+module.exports = chunkZWKUHYTV_cjs.QrCodeCard_default;
 //# sourceMappingURL=index.cjs.map
 //# sourceMappingURL=index.cjs.map

package/dist/QrCodeCard/index.css

@@ -3,39 +3,48 @@
   display: inline-flex;
   flex-direction: column;
   align-items: center;
-  padding: 20px;
+  padding: 24px;
   background: #ffffff;
-  border: 1px solid #f0f0f0;
-  border-radius: 12px;
-  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.04);
+  border: 1px solid #ebeef5;
+  border-radius: 16px;
+  box-shadow: 0 6px 24px -4px rgba(0, 0, 0, 0.05), 0 2px 6px -2px rgba(0, 0, 0, 0.02);
   box-sizing: border-box;
   user-select: none;
+  transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
+}
+.rpc_qrcode_card:hover {
+  box-shadow: 0 10px 30px -4px rgba(0, 0, 0, 0.08), 0 4px 10px -2px rgba(0, 0, 0, 0.03);
 }
 .rpc_qrcode_card_wrap {
   position: relative;
   display: inline-flex;
   align-items: center;
   justify-content: center;
-  border: 1px solid #f0f0f0;
-  border-radius: 8px;
-  padding: 8px;
+  border: 1px solid #f0f2f5;
+  border-radius: 12px;
   background: #ffffff;
+  box-sizing: border-box;
+  overflow: hidden;
+  transition: all 0.2s ease;
+}
+.rpc_qrcode_card_wrap_bordered {
+  border: 1px dashed #d9d9d9;
 }
 .rpc_qrcode_card_canvas {
   display: block;
+  border-radius: 6px;
 }
 .rpc_qrcode_card_logo {
   position: absolute;
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
-  width: 32px;
-  height: 32px;
-  border-radius: 6px;
-  border: 2px solid #ffffff;
-  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15);
+  border-radius: 8px;
+  border: 2.5px solid #ffffff;
+  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12);
   background: #ffffff;
   object-fit: cover;
+  z-index: 5;
 }
 .rpc_qrcode_card_mask {
   position: absolute;
@@ -43,19 +52,28 @@
   left: 0;
   right: 0;
   bottom: 0;
-  background: rgba(255, 255, 255, 0.94);
-  backdrop-filter: blur(3px);
-  border-radius: 8px;
+  background: rgba(255, 255, 255, 0.92);
+  backdrop-filter: blur(8px);
+  -webkit-backdrop-filter: blur(8px);
+  border-radius: 11px;
   display: flex;
   flex-direction: column;
   align-items: center;
   justify-content: center;
+  padding: 12px;
+  box-sizing: border-box;
+  z-index: 10;
+  animation: rpcQrFadeIn 0.25s ease-out;
+}
+.rpc_qrcode_card_mask_expired {
+  cursor: pointer;
   gap: 8px;
+}
+.rpc_qrcode_card_mask_title {
   font-size: 13px;
-  color: #595959;
-  cursor: pointer;
-  z-index: 10;
-  transition: all 0.2s ease-in-out;
+  font-weight: 500;
+  color: #333333;
+  letter-spacing: 0.2px;
 }
 .rpc_qrcode_card_mask_loading {
   cursor: default;
@@ -70,40 +88,112 @@
 .rpc_qrcode_card_refresh_btn {
   display: inline-flex;
   align-items: center;
-  gap: 4px;
-  padding: 4px 12px;
-  border-radius: 4px;
-  background: #1677ff;
+  justify-content: center;
+  gap: 6px;
+  padding: 6px 16px;
+  border-radius: 20px;
+  background:
+    linear-gradient(
+      135deg,
+      #1677ff 0%,
+      #0958d9 100%);
   color: #ffffff;
   border: none;
   font-size: 12px;
+  font-weight: 500;
   cursor: pointer;
-  margin-top: 4px;
+  box-shadow: 0 3px 10px rgba(22, 119, 255, 0.32);
+  transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
+  outline: none;
+}
+.rpc_qrcode_card_refresh_btn:hover {
+  transform: translateY(-1px);
+  box-shadow: 0 5px 14px rgba(22, 119, 255, 0.42);
+  background:
+    linear-gradient(
+      135deg,
+      #4096ff 0%,
+      #1677ff 100%);
+}
+.rpc_qrcode_card_refresh_btn:hover .rpc_qrcode_card_refresh_icon {
+  transform: rotate(180deg);
+}
+.rpc_qrcode_card_refresh_btn:active {
+  transform: translateY(0);
+  box-shadow: 0 2px 6px rgba(22, 119, 255, 0.28);
+}
+.rpc_qrcode_card_refresh_icon {
+  font-size: 13px;
+  transition: transform 0.35s ease;
+}
+.rpc_qrcode_card_spinner_wrap {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+.rpc_qrcode_card_spinner {
+  font-size: 28px;
+  color: #1677ff;
+  animation: rpcQrRotate 1s linear infinite;
 }
 .rpc_qrcode_card_info {
-  margin-top: 14px;
+  margin-top: 16px;
   text-align: center;
   display: flex;
   flex-direction: column;
-  gap: 4px;
+  gap: 5px;
+  max-width: 220px;
 }
 .rpc_qrcode_card_title {
-  font-size: 14px;
+  font-size: 15px;
   font-weight: 600;
-  color: #1f1f1f;
+  color: #1a1a1a;
+  line-height: 1.4;
 }
 .rpc_qrcode_card_description {
-  font-size: 12px;
+  font-size: 13px;
   color: #8c8c8c;
+  line-height: 1.4;
 }
 .rpc_qrcode_card_download {
-  margin-top: 10px;
+  margin-top: 14px;
+  display: inline-flex;
+  align-items: center;
+  padding: 4px 12px;
+  border-radius: 6px;
   color: #1677ff;
   font-size: 12px;
+  font-weight: 500;
   cursor: pointer;
-  text-decoration: underline;
+  background: #f0f7ff;
+  border: 1px solid #d6e4ff;
+  transition: all 0.2s ease;
+  outline: none;
 }
 .rpc_qrcode_card_download:hover {
-  color: #4096ff;
+  color: #0958d9;
+  background: #e6f0ff;
+  border-color: #adc6ff;
+}
+.rpc_qrcode_card_download:active {
+  background: #d6e4ff;
+}
+@keyframes rpcQrRotate {
+  from {
+    transform: rotate(0deg);
+  }
+  to {
+    transform: rotate(360deg);
+  }
+}
+@keyframes rpcQrFadeIn {
+  from {
+    opacity: 0;
+    transform: scale(0.97);
+  }
+  to {
+    opacity: 1;
+    transform: scale(1);
+  }
 }
 /*# sourceMappingURL=index.css.map */

package/dist/QrCodeCard/index.css.map

@@ -1 +1 @@
-{"version":3,"sources":["../../QrCodeCard/index.less"],"sourcesContent":[".rpc_qrcode_card {\n  display: inline-flex;\n  flex-direction: column;\n  align-items: center;\n  padding: 20px;\n  background: #ffffff;\n  border: 1px solid #f0f0f0;\n  border-radius: 12px;\n  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.04);\n  box-sizing: border-box;\n  user-select: none;\n}\n.rpc_qrcode_card_wrap {\n  position: relative;\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  border: 1px solid #f0f0f0;\n  border-radius: 8px;\n  padding: 8px;\n  background: #ffffff;\n}\n.rpc_qrcode_card_canvas {\n  display: block;\n}\n.rpc_qrcode_card_logo {\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  transform: translate(-50%, -50%);\n  width: 32px;\n  height: 32px;\n  border-radius: 6px;\n  border: 2px solid #ffffff;\n  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15);\n  background: #ffffff;\n  object-fit: cover;\n}\n.rpc_qrcode_card_mask {\n  position: absolute;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  background: rgba(255, 255, 255, 0.94);\n  backdrop-filter: blur(3px);\n  border-radius: 8px;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  gap: 8px;\n  font-size: 13px;\n  color: #595959;\n  cursor: pointer;\n  z-index: 10;\n  transition: all 0.2s ease-in-out;\n}\n.rpc_qrcode_card_mask_loading {\n  cursor: default;\n  gap: 10px;\n}\n.rpc_qrcode_card_mask_text {\n  font-size: 13px;\n  font-weight: 500;\n  color: #595959;\n  letter-spacing: 0.2px;\n}\n.rpc_qrcode_card_refresh_btn {\n  display: inline-flex;\n  align-items: center;\n  gap: 4px;\n  padding: 4px 12px;\n  border-radius: 4px;\n  background: #1677ff;\n  color: #ffffff;\n  border: none;\n  font-size: 12px;\n  cursor: pointer;\n  margin-top: 4px;\n}\n.rpc_qrcode_card_info {\n  margin-top: 14px;\n  text-align: center;\n  display: flex;\n  flex-direction: column;\n  gap: 4px;\n}\n.rpc_qrcode_card_title {\n  font-size: 14px;\n  font-weight: 600;\n  color: #1f1f1f;\n}\n.rpc_qrcode_card_description {\n  font-size: 12px;\n  color: #8c8c8c;\n}\n.rpc_qrcode_card_download {\n  margin-top: 10px;\n  color: #1677ff;\n  font-size: 12px;\n  cursor: pointer;\n  text-decoration: underline;\n}\n.rpc_qrcode_card_download:hover {\n  color: #4096ff;\n}\n"],"mappings":";AAAA,CAAC;AACC,WAAS;AACT,kBAAgB;AAChB,eAAa;AACb,WAAS;AACT,cAAY;AACZ,UAAQ,IAAI,MAAM;AAClB,iBAAe;AACf,cAAY,EAAE,IAAI,KAAK,KAAK,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE;AACrC,cAAY;AACZ,eAAa;AACf;AACA,CAAC;AACC,YAAU;AACV,WAAS;AACT,eAAa;AACb,mBAAiB;AACjB,UAAQ,IAAI,MAAM;AAClB,iBAAe;AACf,WAAS;AACT,cAAY;AACd;AACA,CAAC;AACC,WAAS;AACX;AACA,CAAC;AACC,YAAU;AACV,OAAK;AACL,QAAM;AACN,aAAW,UAAU,IAAI,EAAE;AAC3B,SAAO;AACP,UAAQ;AACR,iBAAe;AACf,UAAQ,IAAI,MAAM;AAClB,cAAY,EAAE,IAAI,IAAI,KAAK,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE;AACpC,cAAY;AACZ,cAAY;AACd;AACA,CAAC;AACC,YAAU;AACV,OAAK;AACL,QAAM;AACN,SAAO;AACP,UAAQ;AACR,cAAY,KAAK,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE;AAChC,mBAAiB,KAAK;AACtB,iBAAe;AACf,WAAS;AACT,kBAAgB;AAChB,eAAa;AACb,mBAAiB;AACjB,OAAK;AACL,aAAW;AACX,SAAO;AACP,UAAQ;AACR,WAAS;AACT,cAAY,IAAI,KAAK;AACvB;AACA,CAAC;AACC,UAAQ;AACR,OAAK;AACP;AACA,CAAC;AACC,aAAW;AACX,eAAa;AACb,SAAO;AACP,kBAAgB;AAClB;AACA,CAAC;AACC,WAAS;AACT,eAAa;AACb,OAAK;AACL,WAAS,IAAI;AACb,iBAAe;AACf,cAAY;AACZ,SAAO;AACP,UAAQ;AACR,aAAW;AACX,UAAQ;AACR,cAAY;AACd;AACA,CAAC;AACC,cAAY;AACZ,cAAY;AACZ,WAAS;AACT,kBAAgB;AAChB,OAAK;AACP;AACA,CAAC;AACC,aAAW;AACX,eAAa;AACb,SAAO;AACT;AACA,CAAC;AACC,aAAW;AACX,SAAO;AACT;AACA,CAAC;AACC,cAAY;AACZ,SAAO;AACP,aAAW;AACX,UAAQ;AACR,mBAAiB;AACnB;AACA,CAPC,wBAOwB;AACvB,SAAO;AACT;","names":[]}
+{"version":3,"sources":["../../QrCodeCard/index.less"],"sourcesContent":[".rpc_qrcode_card {\n  display: inline-flex;\n  flex-direction: column;\n  align-items: center;\n  padding: 24px;\n  background: #ffffff;\n  border: 1px solid #ebeef5;\n  border-radius: 16px;\n  box-shadow: 0 6px 24px -4px rgba(0, 0, 0, 0.05), 0 2px 6px -2px rgba(0, 0, 0, 0.02);\n  box-sizing: border-box;\n  user-select: none;\n  transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);\n}\n.rpc_qrcode_card:hover {\n  box-shadow: 0 10px 30px -4px rgba(0, 0, 0, 0.08), 0 4px 10px -2px rgba(0, 0, 0, 0.03);\n}\n.rpc_qrcode_card_wrap {\n  position: relative;\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  border: 1px solid #f0f2f5;\n  border-radius: 12px;\n  background: #ffffff;\n  box-sizing: border-box;\n  overflow: hidden;\n  transition: all 0.2s ease;\n}\n.rpc_qrcode_card_wrap_bordered {\n  border: 1px dashed #d9d9d9;\n}\n.rpc_qrcode_card_canvas {\n  display: block;\n  border-radius: 6px;\n}\n.rpc_qrcode_card_logo {\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  transform: translate(-50%, -50%);\n  border-radius: 8px;\n  border: 2.5px solid #ffffff;\n  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12);\n  background: #ffffff;\n  object-fit: cover;\n  z-index: 5;\n}\n.rpc_qrcode_card_mask {\n  position: absolute;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  background: rgba(255, 255, 255, 0.92);\n  backdrop-filter: blur(8px);\n  -webkit-backdrop-filter: blur(8px);\n  border-radius: 11px;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  padding: 12px;\n  box-sizing: border-box;\n  z-index: 10;\n  animation: rpcQrFadeIn 0.25s ease-out;\n}\n.rpc_qrcode_card_mask_expired {\n  cursor: pointer;\n  gap: 8px;\n}\n.rpc_qrcode_card_mask_title {\n  font-size: 13px;\n  font-weight: 500;\n  color: #333333;\n  letter-spacing: 0.2px;\n}\n.rpc_qrcode_card_mask_loading {\n  cursor: default;\n  gap: 10px;\n}\n.rpc_qrcode_card_mask_text {\n  font-size: 13px;\n  font-weight: 500;\n  color: #595959;\n  letter-spacing: 0.2px;\n}\n.rpc_qrcode_card_refresh_btn {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  gap: 6px;\n  padding: 6px 16px;\n  border-radius: 20px;\n  background: linear-gradient(135deg, #1677ff 0%, #0958d9 100%);\n  color: #ffffff;\n  border: none;\n  font-size: 12px;\n  font-weight: 500;\n  cursor: pointer;\n  box-shadow: 0 3px 10px rgba(22, 119, 255, 0.32);\n  transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);\n  outline: none;\n}\n.rpc_qrcode_card_refresh_btn:hover {\n  transform: translateY(-1px);\n  box-shadow: 0 5px 14px rgba(22, 119, 255, 0.42);\n  background: linear-gradient(135deg, #4096ff 0%, #1677ff 100%);\n}\n.rpc_qrcode_card_refresh_btn:hover .rpc_qrcode_card_refresh_icon {\n  transform: rotate(180deg);\n}\n.rpc_qrcode_card_refresh_btn:active {\n  transform: translateY(0);\n  box-shadow: 0 2px 6px rgba(22, 119, 255, 0.28);\n}\n.rpc_qrcode_card_refresh_icon {\n  font-size: 13px;\n  transition: transform 0.35s ease;\n}\n.rpc_qrcode_card_spinner_wrap {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n.rpc_qrcode_card_spinner {\n  font-size: 28px;\n  color: #1677ff;\n  animation: rpcQrRotate 1s linear infinite;\n}\n.rpc_qrcode_card_info {\n  margin-top: 16px;\n  text-align: center;\n  display: flex;\n  flex-direction: column;\n  gap: 5px;\n  max-width: 220px;\n}\n.rpc_qrcode_card_title {\n  font-size: 15px;\n  font-weight: 600;\n  color: #1a1a1a;\n  line-height: 1.4;\n}\n.rpc_qrcode_card_description {\n  font-size: 13px;\n  color: #8c8c8c;\n  line-height: 1.4;\n}\n.rpc_qrcode_card_download {\n  margin-top: 14px;\n  display: inline-flex;\n  align-items: center;\n  padding: 4px 12px;\n  border-radius: 6px;\n  color: #1677ff;\n  font-size: 12px;\n  font-weight: 500;\n  cursor: pointer;\n  background: #f0f7ff;\n  border: 1px solid #d6e4ff;\n  transition: all 0.2s ease;\n  outline: none;\n}\n.rpc_qrcode_card_download:hover {\n  color: #0958d9;\n  background: #e6f0ff;\n  border-color: #adc6ff;\n}\n.rpc_qrcode_card_download:active {\n  background: #d6e4ff;\n}\n@keyframes rpcQrRotate {\n  from {\n    transform: rotate(0deg);\n  }\n  to {\n    transform: rotate(360deg);\n  }\n}\n@keyframes rpcQrFadeIn {\n  from {\n    opacity: 0;\n    transform: scale(0.97);\n  }\n  to {\n    opacity: 1;\n    transform: scale(1);\n  }\n}\n"],"mappings":"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","names":[]}