@unif/react-native-design 0.31.3 → 0.32.0

package/src/components/ui/shared/pulse/usePulseAnimation.ts

@@ -0,0 +1,29 @@
+import { useEffect, useMemo } from 'react';
+import type { createLogger } from '../../../../utils/logger';
+import type { PulseOptions } from '../../Pulse/types';
+import type { PulseDefaults } from './types';
+import { normalizePulseOptions } from './normalizePulseOptions';
+import { usePulseDriver } from './usePulseDriver';
+
+/** 共享参数解释与平台驱动；默认值和诊断 scope 由所属组件交付。 */
+export function usePulseAnimation(
+  { duration, delay, from, to }: PulseOptions = {},
+  defaults: Readonly<PulseDefaults>,
+  log: ReturnType<typeof createLogger>
+) {
+  // 各组件交付自己的固定默认值；内联 options 的新引用不重启动效。
+  const normalized = useMemo(
+    () => normalizePulseOptions({ duration, delay, from, to }, defaults),
+    [duration, delay, from, to, defaults]
+  );
+  useEffect(() => {
+    if (__DEV__) {
+      for (const item of normalized.diagnostics) {
+        log.warn(
+          `${item.field}=${String(item.received)} 无效,已回退为 ${item.fallback}`
+        );
+      }
+    }
+  }, [normalized.diagnostics, log]);
+  return usePulseDriver(normalized);
+}

package/src/components/ui/{Pulse → shared/pulse}/usePulseDriver.ts

@@ -8,9 +8,9 @@ import {
   withSequence,
   withTiming,
 } from 'react-native-reanimated';
-import { usePrefersReducedMotion } from '../../../theme';
+import { usePrefersReducedMotion } from '../../../../theme';
 import { shouldAnimatePulse } from './normalizePulseOptions';
-import type { NormalizedPulseOptions } from './normalizePulseOptions';
+import type { NormalizedPulseOptions } from './types';
 
 /**
  * native Pulse driver —— reanimated 4 worklet,整个动画在 UI 线程跑、不占 JS 桥。

package/src/components/ui/{Pulse → shared/pulse}/usePulseDriver.web.ts

@@ -1,21 +1,9 @@
 import { useEffect, useState } from 'react';
-import type { ImageStyle, TextStyle, ViewStyle } from 'react-native';
-import { usePrefersReducedMotion } from '../../../theme';
+import { usePrefersReducedMotion } from '../../../../theme';
 import { shouldAnimatePulse } from './normalizePulseOptions';
-import type { NormalizedPulseOptions } from './normalizePulseOptions';
+import type { NormalizedPulseOptions } from './types';
 
-/**
- * Web Pulse driver —— RN-Web 上 reanimated 的 `useAnimatedStyle` 链路会在
- * `_updatePropsJS` 里对 undefined 取 `Object.keys` 而抛 TypeError,pulse 卡死在初始值。
- * 故 web 走 **CSS transition 降级**(零 rAF JS 帧):
- *
- * - `setInterval` 每隔 `duration` ms 只在 from / to 两档翻转 opacity
- *   —— setState 频率从 ~60fps 降到 1 次/duration ms(参 ToastHost.web.tsx)
- * - 补间交给浏览器 CSS transition,JS 侧零插值
- *
- * **只接受归一化产物**:duration 已被验证在 `[1, 2^31)`,不会出现 `setInterval(0)`
- * 那种「每帧触发」的退化。web 端**不跑 worklet** —— 别在文档里宣称它跑。
- */
+/** Web 由 CSS 补间，timer 只按归一化后的半周期切换透明度；每个实例独立释放。 */
 export function usePulseDriver(options: NormalizedPulseOptions) {
   const reduced = usePrefersReducedMotion();
   const animate = shouldAnimatePulse(options, reduced);
@@ -54,13 +42,10 @@ export function usePulseDriver(options: NormalizedPulseOptions) {
     };
   }, [animate, from, to, duration, delay]);
 
-  // RN-Web 把 transition 字段透传到 DOM style,实现 CSS 级平滑过渡。
-  // RN 的 style typedef 没有 transition 字段,故用交叉类型补一个窄声明 ——
-  // 比整块 `as any` 精确:仍然保留 opacity 的类型检查。
   return {
     opacity,
     ...(animate
       ? { transition: `opacity ${duration}ms ease-in-out` }
       : undefined),
-  } as (ViewStyle | TextStyle | ImageStyle) & { transition?: string };
+  };
 }

package/lib/module/components/ui/Pulse/normalizePulseOptions.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["MAX_TIMER","normalizePulseOptions","input","defaults","diagnostics","pick","field","valid","received","undefined","push","fallback","duration","value","Number","isFinite","delay","from","to","isStatic","shouldAnimatePulse","options","reducedMotion"],"sourceRoot":"../../../../../src","sources":["components/ui/Pulse/normalizePulseOptions.ts"],"mappings":";;AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAqBA;AACA,MAAMA,SAAS,GAAG,CAAC,IAAI,EAAE;AAEzB,OAAO,SAASC,qBAAqBA,CACnCC,KAAmB,GAAG,CAAC,CAAC,EACxBC,QAAuB,EACC;EACxB,MAAMC,WAA8B,GAAG,EAAE;EACzC,MAAMC,IAAI,GAAGA,CACXC,KAA0B,EAC1BC,KAAiC,KACtB;IACX,MAAMC,QAAQ,GAAGN,KAAK,CAACI,KAAK,CAAC;IAC7B,IAAIE,QAAQ,KAAKC,SAAS,EAAE,OAAON,QAAQ,CAACG,KAAK,CAAC;IAClD,IAAI,OAAOE,QAAQ,KAAK,QAAQ,IAAID,KAAK,CAACC,QAAQ,CAAC,EAAE,OAAOA,QAAQ;IACpEJ,WAAW,CAACM,IAAI,CAAC;MAAEJ,KAAK;MAAEE,QAAQ;MAAEG,QAAQ,EAAER,QAAQ,CAACG,KAAK;IAAE,CAAC,CAAC;IAChE,OAAOH,QAAQ,CAACG,KAAK,CAAC;EACxB,CAAC;EACD,MAAMM,QAAQ,GAAGP,IAAI,CACnB,UAAU,EACTQ,KAAK,IAAKC,MAAM,CAACC,QAAQ,CAACF,KAAK,CAAC,IAAIA,KAAK,IAAI,CAAC,IAAIA,KAAK,GAAGb,SAC7D,CAAC;EACD,MAAMgB,KAAK,GAAGX,IAAI,CAChB,OAAO,EACNQ,KAAK,IAAKC,MAAM,CAACC,QAAQ,CAACF,KAAK,CAAC,IAAIA,KAAK,IAAI,CAAC,IAAIA,KAAK,GAAGb,SAC7D,CAAC;EACD,MAAMiB,IAAI,GAAGZ,IAAI,CACf,MAAM,EACLQ,KAAK,IAAKC,MAAM,CAACC,QAAQ,CAACF,KAAK,CAAC,IAAIA,KAAK,IAAI,CAAC,IAAIA,KAAK,IAAI,CAC9D,CAAC;EACD,MAAMK,EAAE,GAAGb,IAAI,CACb,IAAI,EACHQ,KAAK,IAAKC,MAAM,CAACC,QAAQ,CAACF,KAAK,CAAC,IAAIA,KAAK,IAAI,CAAC,IAAIA,KAAK,IAAI,CAC9D,CAAC;EACD,OAAO;IAAED,QAAQ;IAAEI,KAAK;IAAEC,IAAI;IAAEC,EAAE;IAAEC,QAAQ,EAAEF,IAAI,KAAKC,EAAE;IAAEd;EAAY,CAAC;AAC1E;;AAEA;AACA,OAAO,MAAMgB,kBAAkB,GAAGA,CAChCC,OAA+B,EAC/BC,aAAsB,KACV,CAACA,aAAa,IAAI,CAACD,OAAO,CAACF,QAAQ","ignoreList":[]}

package/lib/module/components/ui/Pulse/usePulseDriver.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["useEffect","cancelAnimation","useAnimatedStyle","useSharedValue","withDelay","withRepeat","withSequence","withTiming","usePrefersReducedMotion","shouldAnimatePulse","usePulseDriver","options","reduced","animate","from","to","duration","delay","op","value","cycle","opacity"],"sourceRoot":"../../../../../src","sources":["components/ui/Pulse/usePulseDriver.ts"],"mappings":";;AAAA,SAASA,SAAS,QAAQ,OAAO;AACjC,SACEC,eAAe,EACfC,gBAAgB,EAChBC,cAAc,EACdC,SAAS,EACTC,UAAU,EACVC,YAAY,EACZC,UAAU,QACL,yBAAyB;AAChC,SAASC,uBAAuB,QAAQ,yBAAgB;AACxD,SAASC,kBAAkB,QAAQ,4BAAyB;AAG5D;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,SAASC,cAAcA,CAACC,OAA+B,EAAE;EAC9D,MAAMC,OAAO,GAAGJ,uBAAuB,CAAC,CAAC;EACzC,MAAMK,OAAO,GAAGJ,kBAAkB,CAACE,OAAO,EAAEC,OAAO,CAAC;EACpD,MAAM;IAAEE,IAAI;IAAEC,EAAE;IAAEC,QAAQ;IAAEC;EAAM,CAAC,GAAGN,OAAO;EAC7C,MAAMO,EAAE,GAAGf,cAAc,CAACU,OAAO,GAAGC,IAAI,GAAGC,EAAE,CAAC;EAE9Cf,SAAS,CAAC,MAAM;IACd,IAAI,CAACa,OAAO,EAAE;MACZ;MACAZ,eAAe,CAACiB,EAAE,CAAC;MACnBA,EAAE,CAACC,KAAK,GAAGJ,EAAE;MACb;IACF;IACA;IACAG,EAAE,CAACC,KAAK,GAAGL,IAAI;IACf,MAAMM,KAAK,GAAGf,UAAU,CACtBC,YAAY,CACVC,UAAU,CAACQ,EAAE,EAAE;MAAEC;IAAS,CAAC,CAAC,EAC5BT,UAAU,CAACO,IAAI,EAAE;MAAEE;IAAS,CAAC,CAC/B,CAAC,EACD,CAAC,CAAC,EACF,KACF,CAAC;IACDE,EAAE,CAACC,KAAK,GAAGF,KAAK,GAAG,CAAC,GAAGb,SAAS,CAACa,KAAK,EAAEG,KAAK,CAAC,GAAGA,KAAK;IACtD,OAAO,MAAMnB,eAAe,CAACiB,EAAE,CAAC;EAClC,CAAC,EAAE,CAACA,EAAE,EAAEL,OAAO,EAAEC,IAAI,EAAEC,EAAE,EAAEC,QAAQ,EAAEC,KAAK,CAAC,CAAC;EAE5C,OAAOf,gBAAgB,CAAC,OAAO;IAAEmB,OAAO,EAAEH,EAAE,CAACC;EAAM,CAAC,CAAC,CAAC;AACxD","ignoreList":[]}

package/lib/module/components/ui/Pulse/usePulseDriver.web.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["useEffect","useState","usePrefersReducedMotion","shouldAnimatePulse","usePulseDriver","options","reduced","animate","from","to","duration","delay","opacity","setOpacity","timer","delayTimer","current","start","setInterval","setTimeout","clearTimeout","clearInterval","transition","undefined"],"sourceRoot":"../../../../../src","sources":["components/ui/Pulse/usePulseDriver.web.ts"],"mappings":";;AAAA,SAASA,SAAS,EAAEC,QAAQ,QAAQ,OAAO;AAE3C,SAASC,uBAAuB,QAAQ,yBAAgB;AACxD,SAASC,kBAAkB,QAAQ,4BAAyB;AAG5D;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,SAASC,cAAcA,CAACC,OAA+B,EAAE;EAC9D,MAAMC,OAAO,GAAGJ,uBAAuB,CAAC,CAAC;EACzC,MAAMK,OAAO,GAAGJ,kBAAkB,CAACE,OAAO,EAAEC,OAAO,CAAC;EACpD,MAAM;IAAEE,IAAI;IAAEC,EAAE;IAAEC,QAAQ;IAAEC;EAAM,CAAC,GAAGN,OAAO;EAC7C,MAAM,CAACO,OAAO,EAAEC,UAAU,CAAC,GAAGZ,QAAQ,CAACM,OAAO,GAAGC,IAAI,GAAGC,EAAE,CAAC;EAE3DT,SAAS,CAAC,MAAM;IACd,IAAI,CAACO,OAAO,EAAE;MACZ;MACAM,UAAU,CAACJ,EAAE,CAAC;MACd;IACF;IAEAI,UAAU,CAACL,IAAI,CAAC;IAChB,IAAIM,KAA4C,GAAG,IAAI;IACvD,IAAIC,UAAgD,GAAG,IAAI;IAC3D,IAAIC,OAAO,GAAGR,IAAI;IAElB,MAAMS,KAAK,GAAGA,CAAA,KAAM;MAClBH,KAAK,GAAGI,WAAW,CAAC,MAAM;QACxBF,OAAO,GAAGA,OAAO,KAAKR,IAAI,GAAGC,EAAE,GAAGD,IAAI;QACtCK,UAAU,CAACG,OAAO,CAAC;MACrB,CAAC,EAAEN,QAAQ,CAAC;IACd,CAAC;IAED,IAAIC,KAAK,GAAG,CAAC,EAAE;MACbI,UAAU,GAAGI,UAAU,CAACF,KAAK,EAAEN,KAAK,CAAC;IACvC,CAAC,MAAM;MACLM,KAAK,CAAC,CAAC;IACT;;IAEA;IACA,OAAO,MAAM;MACX,IAAIF,UAAU,IAAI,IAAI,EAAEK,YAAY,CAACL,UAAU,CAAC;MAChD,IAAID,KAAK,IAAI,IAAI,EAAEO,aAAa,CAACP,KAAK,CAAC;IACzC,CAAC;EACH,CAAC,EAAE,CAACP,OAAO,EAAEC,IAAI,EAAEC,EAAE,EAAEC,QAAQ,EAAEC,KAAK,CAAC,CAAC;;EAExC;EACA;EACA;EACA,OAAO;IACLC,OAAO;IACP,IAAIL,OAAO,GACP;MAAEe,UAAU,EAAE,WAAWZ,QAAQ;IAAiB,CAAC,GACnDa,SAAS;EACf,CAAC;AACH","ignoreList":[]}

package/lib/typescript/src/components/ui/Pulse/normalizePulseOptions.d.ts

@@ -1,32 +0,0 @@
-import type { PulseOptions } from './types';
-export type { PulseOptions };
-/**
- * Pulse 参数的**唯一**归一化入口 —— 公共 hook 先跑完这里,平台 driver 只消费产物。
- *
- * 为什么要单独一层:此前 native / web 两份 `usePulse` 各自读原始 props 并各自解释
- * 默认值,web 侧甚至把未校验的 `duration` 直接喂给 `setInterval`(0 或 2^31 会退化成
- * 「每帧触发」)。归一化收口后,两端拿到的一定是同一组已验证数值。
- *
- * 纪律:**不做 clamp、不做取整**。非法值一律整体回退到 defaults 并记一条诊断 ——
- * 悄悄把 `duration: 0` 夹成 `1` 会让调用方永远发现不了自己传错了。
- */
-export type PulseDefaults = {
-    duration: number;
-    delay: number;
-    from: number;
-    to: number;
-};
-export type PulseDiagnostic = {
-    field: keyof PulseDefaults;
-    received: unknown;
-    fallback: number;
-};
-export type NormalizedPulseOptions = PulseDefaults & {
-    /** 两端相等 —— 没有可播的动画,driver 直接停在 `to`。 */
-    isStatic: boolean;
-    diagnostics: readonly PulseDiagnostic[];
-};
-export declare function normalizePulseOptions(input: PulseOptions | undefined, defaults: PulseDefaults): NormalizedPulseOptions;
-/** driver 是否应当启动循环。静态或系统开启减弱动效时都不启动。 */
-export declare const shouldAnimatePulse: (options: NormalizedPulseOptions, reducedMotion: boolean) => boolean;
-//# sourceMappingURL=normalizePulseOptions.d.ts.map

package/lib/typescript/src/components/ui/Pulse/normalizePulseOptions.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"normalizePulseOptions.d.ts","sourceRoot":"","sources":["../../../../../../src/components/ui/Pulse/normalizePulseOptions.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AAE5C,YAAY,EAAE,YAAY,EAAE,CAAC;AAE7B;;;;;;;;;GASG;AAEH,MAAM,MAAM,aAAa,GAAG;IAC1B,QAAQ,EAAE,MAAM,CAAC;IACjB,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,MAAM,CAAC;IACb,EAAE,EAAE,MAAM,CAAC;CACZ,CAAC;AAEF,MAAM,MAAM,eAAe,GAAG;IAC5B,KAAK,EAAE,MAAM,aAAa,CAAC;IAC3B,QAAQ,EAAE,OAAO,CAAC;IAClB,QAAQ,EAAE,MAAM,CAAC;CAClB,CAAC;AAEF,MAAM,MAAM,sBAAsB,GAAG,aAAa,GAAG;IACnD,wCAAwC;IACxC,QAAQ,EAAE,OAAO,CAAC;IAClB,WAAW,EAAE,SAAS,eAAe,EAAE,CAAC;CACzC,CAAC;AAKF,wBAAgB,qBAAqB,CACnC,KAAK,EAAE,YAAY,YAAK,EACxB,QAAQ,EAAE,aAAa,GACtB,sBAAsB,CA6BxB;AAED,wCAAwC;AACxC,eAAO,MAAM,kBAAkB,GAC7B,SAAS,sBAAsB,EAC/B,eAAe,OAAO,KACrB,OAA8C,CAAC"}

package/lib/typescript/src/components/ui/Pulse/usePulseDriver.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"usePulseDriver.d.ts","sourceRoot":"","sources":["../../../../../../src/components/ui/Pulse/usePulseDriver.ts"],"names":[],"mappings":"AAYA,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,yBAAyB,CAAC;AAEtE;;;;;GAKG;AACH,wBAAgB,cAAc,CAAC,OAAO,EAAE,sBAAsB;;GA4B7D"}

package/lib/typescript/src/components/ui/Pulse/usePulseDriver.web.d.ts

@@ -1,18 +0,0 @@
-import type { ImageStyle, TextStyle, ViewStyle } from 'react-native';
-import type { NormalizedPulseOptions } from './normalizePulseOptions';
-/**
- * Web Pulse driver —— RN-Web 上 reanimated 的 `useAnimatedStyle` 链路会在
- * `_updatePropsJS` 里对 undefined 取 `Object.keys` 而抛 TypeError,pulse 卡死在初始值。
- * 故 web 走 **CSS transition 降级**(零 rAF JS 帧):
- *
- * - `setInterval` 每隔 `duration` ms 只在 from / to 两档翻转 opacity
- *   —— setState 频率从 ~60fps 降到 1 次/duration ms(参 ToastHost.web.tsx)
- * - 补间交给浏览器 CSS transition,JS 侧零插值
- *
- * **只接受归一化产物**:duration 已被验证在 `[1, 2^31)`,不会出现 `setInterval(0)`
- * 那种「每帧触发」的退化。web 端**不跑 worklet** —— 别在文档里宣称它跑。
- */
-export declare function usePulseDriver(options: NormalizedPulseOptions): (ViewStyle | TextStyle | ImageStyle) & {
-    transition?: string;
-};
-//# sourceMappingURL=usePulseDriver.web.d.ts.map

package/lib/typescript/src/components/ui/Pulse/usePulseDriver.web.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"usePulseDriver.web.d.ts","sourceRoot":"","sources":["../../../../../../src/components/ui/Pulse/usePulseDriver.web.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,UAAU,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAGrE,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,yBAAyB,CAAC;AAEtE;;;;;;;;;;;GAWG;AACH,wBAAgB,cAAc,CAAC,OAAO,EAAE,sBAAsB,GA8CvD,CAAC,SAAS,GAAG,SAAS,GAAG,UAAU,CAAC,GAAG;IAAE,UAAU,CAAC,EAAE,MAAM,CAAA;CAAE,CACpE"}

package/src/components/ui/Pulse/normalizePulseOptions.ts

@@ -1,76 +0,0 @@
-import type { PulseOptions } from './types';
-
-export type { PulseOptions };
-
-/**
- * Pulse 参数的**唯一**归一化入口 —— 公共 hook 先跑完这里,平台 driver 只消费产物。
- *
- * 为什么要单独一层:此前 native / web 两份 `usePulse` 各自读原始 props 并各自解释
- * 默认值,web 侧甚至把未校验的 `duration` 直接喂给 `setInterval`(0 或 2^31 会退化成
- * 「每帧触发」)。归一化收口后,两端拿到的一定是同一组已验证数值。
- *
- * 纪律:**不做 clamp、不做取整**。非法值一律整体回退到 defaults 并记一条诊断 ——
- * 悄悄把 `duration: 0` 夹成 `1` 会让调用方永远发现不了自己传错了。
- */
-
-export type PulseDefaults = {
-  duration: number;
-  delay: number;
-  from: number;
-  to: number;
-};
-
-export type PulseDiagnostic = {
-  field: keyof PulseDefaults;
-  received: unknown;
-  fallback: number;
-};
-
-export type NormalizedPulseOptions = PulseDefaults & {
-  /** 两端相等 —— 没有可播的动画,driver 直接停在 `to`。 */
-  isStatic: boolean;
-  diagnostics: readonly PulseDiagnostic[];
-};
-
-// setTimeout / setInterval 内部用 int32 存时长,>= 2^31 会溢出成 0 变「每帧触发」。
-const MAX_TIMER = 2 ** 31;
-
-export function normalizePulseOptions(
-  input: PulseOptions = {},
-  defaults: PulseDefaults
-): NormalizedPulseOptions {
-  const diagnostics: PulseDiagnostic[] = [];
-  const pick = (
-    field: keyof PulseDefaults,
-    valid: (value: number) => boolean
-  ): number => {
-    const received = input[field];
-    if (received === undefined) return defaults[field];
-    if (typeof received === 'number' && valid(received)) return received;
-    diagnostics.push({ field, received, fallback: defaults[field] });
-    return defaults[field];
-  };
-  const duration = pick(
-    'duration',
-    (value) => Number.isFinite(value) && value >= 1 && value < MAX_TIMER
-  );
-  const delay = pick(
-    'delay',
-    (value) => Number.isFinite(value) && value >= 0 && value < MAX_TIMER
-  );
-  const from = pick(
-    'from',
-    (value) => Number.isFinite(value) && value >= 0 && value <= 1
-  );
-  const to = pick(
-    'to',
-    (value) => Number.isFinite(value) && value >= 0 && value <= 1
-  );
-  return { duration, delay, from, to, isStatic: from === to, diagnostics };
-}
-
-/** driver 是否应当启动循环。静态或系统开启减弱动效时都不启动。 */
-export const shouldAnimatePulse = (
-  options: NormalizedPulseOptions,
-  reducedMotion: boolean
-): boolean => !reducedMotion && !options.isStatic;