@unif/react-native-design 0.34.0 → 0.36.0

package/lib/module/components/ui/BlurLayer/BlurLayer.web.js

@@ -1,46 +0,0 @@
-"use strict";
-
-/**
- * Web 端 BlurLayer —— CSS `backdrop-filter` 代替 native BlurView。
- *
- * `@sbaiahmed1/react-native-blur` 不支持 web(库内部 codegenNativeComponent
- * 在浏览器会炸 "is not a function",见上游 issue #79)。docusaurus-rnw plugin
- * 配 `extensions: ['.web.tsx', ...]` 优先,webpack 选这份;Metro 不识别该后缀,
- * iOS / Android 走原 `BlurLayer.tsx`。
- */
-import React from 'react';
-import { StyleSheet, View } from 'react-native';
-import { blur as blurTokens, useColors, useTheme } from "../../../theme/index.js";
-import { jsx as _jsx } from "react/jsx-runtime";
-export function BlurLayer({
-  intensity,
-  tint,
-  style,
-  testID
-}) {
-  const c = useColors();
-  const {
-    scheme
-  } = useTheme();
-  const blurAmount = blurTokens[intensity];
-  const defaultTint = intensity === 'strong' ? c.sheetBackdrop : c.glassTintLight;
-  // RN style typedef 不识别 web-only 属性,cast 绕过 TS;RN-Web 浏览器侧原样输出。
-  // [L-15] saturate(180%):苹果 HIG 玻璃效果的标准值,增强模糊后的颜色鲜艳度,
-  //   与 macOS / iOS 系统 vibrancy 视觉一致;降低会让玻璃面板显得灰暗脱色。
-  // [L-15] opacity:0.96(暗色):暗色 scheme 下 backdrop-filter 在 Chromium 中
-  //   opacity=1 时存在渲染 artifact(模糊层与底层内容边界锯齿),降到 0.96 消除;
-  //   亮色 scheme 不受影响故保持 1。native 端 BlurLayer.tsx 用双层 View 实现,
-  //   语义等价(tint 层覆盖 BlurView),无需此 opacity 补丁。
-  const webBlurStyle = {
-    backdropFilter: `blur(${blurAmount}px) saturate(180%)`,
-    WebkitBackdropFilter: `blur(${blurAmount}px) saturate(180%)`,
-    backgroundColor: tint ?? defaultTint,
-    opacity: scheme === 'dark' ? 0.96 : 1
-  };
-  return /*#__PURE__*/_jsx(View, {
-    style: [StyleSheet.absoluteFill, webBlurStyle, style],
-    pointerEvents: "none",
-    testID: testID
-  });
-}
-//# sourceMappingURL=BlurLayer.web.js.map

package/lib/module/components/ui/BlurLayer/BlurLayer.web.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["React","StyleSheet","View","blur","blurTokens","useColors","useTheme","jsx","_jsx","BlurLayer","intensity","tint","style","testID","c","scheme","blurAmount","defaultTint","sheetBackdrop","glassTintLight","webBlurStyle","backdropFilter","WebkitBackdropFilter","backgroundColor","opacity","absoluteFill","pointerEvents"],"sourceRoot":"../../../../../src","sources":["components/ui/BlurLayer/BlurLayer.web.tsx"],"mappings":";;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,UAAU,EAAEC,IAAI,QAAwC,cAAc;AAC/E,SAASC,IAAI,IAAIC,UAAU,EAAEC,SAAS,EAAEC,QAAQ,QAAQ,yBAAgB;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAGzE,OAAO,SAASC,SAASA,CAAC;EACxBC,SAAS;EACTC,IAAI;EACJC,KAAK;EACLC;AACc,CAAC,EAAqB;EACpC,MAAMC,CAAC,GAAGT,SAAS,CAAC,CAAC;EACrB,MAAM;IAAEU;EAAO,CAAC,GAAGT,QAAQ,CAAC,CAAC;EAC7B,MAAMU,UAAU,GAAGZ,UAAU,CAACM,SAAS,CAAC;EACxC,MAAMO,WAAW,GACfP,SAAS,KAAK,QAAQ,GAAGI,CAAC,CAACI,aAAa,GAAGJ,CAAC,CAACK,cAAc;EAC7D;EACA;EACA;EACA;EACA;EACA;EACA;EACA,MAAMC,YAAY,GAAG;IACnBC,cAAc,EAAE,QAAQL,UAAU,oBAAoB;IACtDM,oBAAoB,EAAE,QAAQN,UAAU,oBAAoB;IAC5DO,eAAe,EAAEZ,IAAI,IAAIM,WAAW;IACpCO,OAAO,EAAET,MAAM,KAAK,MAAM,GAAG,IAAI,GAAG;EACtC,CAAoC;EAEpC,oBACEP,IAAA,CAACN,IAAI;IACHU,KAAK,EAAE,CAACX,UAAU,CAACwB,YAAY,EAAEL,YAAY,EAAER,KAAK,CAAE;IACtDc,aAAa,EAAC,MAAM;IACpBb,MAAM,EAAEA;EAAO,CAChB,CAAC;AAEN","ignoreList":[]}

package/lib/module/components/ui/BlurLayer/index.js

@@ -1,4 +0,0 @@
-"use strict";
-
-export { BlurLayer } from './BlurLayer';
-//# sourceMappingURL=index.js.map

package/lib/module/components/ui/BlurLayer/index.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["BlurLayer"],"sourceRoot":"../../../../../src","sources":["components/ui/BlurLayer/index.ts"],"mappings":";;AAAA,SAASA,SAAS,QAAQ,aAAa","ignoreList":[]}

package/lib/module/components/ui/BlurLayer/types.js.map

@@ -1 +0,0 @@
-{"version":3,"names":[],"sourceRoot":"../../../../../src","sources":["components/ui/BlurLayer/types.ts"],"mappings":"","ignoreList":[]}

package/lib/module/theme/blur.js

@@ -1,12 +0,0 @@
-"use strict";
-
-/** Blur intensity tokens —— backdrop-filter 二档语义化封装。
- *
- *  数值是 `@sbaiahmed1/react-native-blur` 的 BlurView `blurAmount` prop(0-100)。 */
-export const blur = {
-  /** 玻璃数据条 / 小区域玻璃感。 */
-  soft: 10,
-  /** 焦点引导大面积 backdrop。 */
-  strong: 40
-};
-//# sourceMappingURL=blur.js.map

package/lib/module/theme/blur.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["blur","soft","strong"],"sourceRoot":"../../../src","sources":["theme/blur.ts"],"mappings":";;AAAA;AACA;AACA;AACA,OAAO,MAAMA,IAAI,GAAG;EAClB;EACAC,IAAI,EAAE,EAAE;EACR;EACAC,MAAM,EAAE;AACV,CAAU","ignoreList":[]}

package/lib/typescript/src/components/ui/BlurLayer/BlurLayer.d.ts

@@ -1,10 +0,0 @@
-import React from 'react';
-import type { BlurLayerProps } from './types';
-/** Blur backdrop 双层 —— BlurView + tint。
- *
- *  blurType 跟 scheme 自动切(亮 'light' / 暗 'dark',避免暗色奶白雾)。
- *
- *  - `'soft'` 玻璃数据条 / 小区域
- *  - `'strong'` 焦点引导 backdrop(sheet 类浮层) */
-export declare function BlurLayer({ intensity, tint, style, testID, }: BlurLayerProps): React.JSX.Element;
-//# sourceMappingURL=BlurLayer.d.ts.map

package/lib/typescript/src/components/ui/BlurLayer/BlurLayer.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"BlurLayer.d.ts","sourceRoot":"","sources":["../../../../../../src/components/ui/BlurLayer/BlurLayer.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAE9C;;;;;4CAK4C;AAC5C,wBAAgB,SAAS,CAAC,EACxB,SAAS,EACT,IAAI,EACJ,KAAK,EACL,MAAM,GACP,EAAE,cAAc,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO,CA6BpC"}

package/lib/typescript/src/components/ui/BlurLayer/BlurLayer.web.d.ts

@@ -1,12 +0,0 @@
-/**
- * Web 端 BlurLayer —— CSS `backdrop-filter` 代替 native BlurView。
- *
- * `@sbaiahmed1/react-native-blur` 不支持 web(库内部 codegenNativeComponent
- * 在浏览器会炸 "is not a function",见上游 issue #79)。docusaurus-rnw plugin
- * 配 `extensions: ['.web.tsx', ...]` 优先,webpack 选这份;Metro 不识别该后缀,
- * iOS / Android 走原 `BlurLayer.tsx`。
- */
-import React from 'react';
-import type { BlurLayerProps } from './types';
-export declare function BlurLayer({ intensity, tint, style, testID, }: BlurLayerProps): React.JSX.Element;
-//# sourceMappingURL=BlurLayer.web.d.ts.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"BlurLayer.web.d.ts","sourceRoot":"","sources":["../../../../../../src/components/ui/BlurLayer/BlurLayer.web.tsx"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AACH,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAE9C,wBAAgB,SAAS,CAAC,EACxB,SAAS,EACT,IAAI,EACJ,KAAK,EACL,MAAM,GACP,EAAE,cAAc,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO,CA2BpC"}

package/lib/typescript/src/components/ui/BlurLayer/index.d.ts

@@ -1,3 +0,0 @@
-export { BlurLayer } from './BlurLayer';
-export type { BlurLayerProps } from './types';
-//# sourceMappingURL=index.d.ts.map

package/lib/typescript/src/components/ui/BlurLayer/index.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/components/ui/BlurLayer/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,YAAY,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC"}

package/lib/typescript/src/components/ui/BlurLayer/types.d.ts

@@ -1,15 +0,0 @@
-import type { StyleProp, ViewStyle } from 'react-native';
-import type { BlurIntensity } from '../../../theme';
-export type BlurLayerProps = {
-    /** 模糊强度,对齐设计稿 token:
-     *  - 'soft' = blurAmount 10,玻璃数据条 / 小区域玻璃感
-     *  - 'strong' = blurAmount 40,焦点引导 backdrop */
-    intensity: BlurIntensity;
-    /** Tint override(不传按 intensity 推:soft → c.glassTintLight / strong → c.sheetBackdrop) */
-    tint?: string;
-    /** 附加样式;默认 absoluteFill,caller 通常不需要传 */
-    style?: StyleProp<ViewStyle>;
-    /** E2E / 测试定位 */
-    testID?: string;
-};
-//# sourceMappingURL=types.d.ts.map

package/lib/typescript/src/components/ui/BlurLayer/types.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../../../src/components/ui/BlurLayer/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AACzD,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,gBAAgB,CAAC;AAEpD,MAAM,MAAM,cAAc,GAAG;IAC3B;;mDAE+C;IAC/C,SAAS,EAAE,aAAa,CAAC;IACzB,wFAAwF;IACxF,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,yCAAyC;IACzC,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAC7B,iBAAiB;IACjB,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB,CAAC"}

package/lib/typescript/src/theme/blur.d.ts

@@ -1,11 +0,0 @@
-/** Blur intensity tokens —— backdrop-filter 二档语义化封装。
- *
- *  数值是 `@sbaiahmed1/react-native-blur` 的 BlurView `blurAmount` prop(0-100)。 */
-export declare const blur: {
-    /** 玻璃数据条 / 小区域玻璃感。 */
-    readonly soft: 10;
-    /** 焦点引导大面积 backdrop。 */
-    readonly strong: 40;
-};
-export type BlurIntensity = keyof typeof blur;
-//# sourceMappingURL=blur.d.ts.map

package/lib/typescript/src/theme/blur.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"blur.d.ts","sourceRoot":"","sources":["../../../../src/theme/blur.ts"],"names":[],"mappings":"AAAA;;+EAE+E;AAC/E,eAAO,MAAM,IAAI;IACf,sBAAsB;;IAEtB,wBAAwB;;CAEhB,CAAC;AAEX,MAAM,MAAM,aAAa,GAAG,MAAM,OAAO,IAAI,CAAC"}

package/src/components/ui/BlurLayer/BlurLayer.tsx

@@ -1,47 +0,0 @@
-import React from 'react';
-import { StyleSheet, View } from 'react-native';
-import { BlurView } from '@sbaiahmed1/react-native-blur';
-import { blur as blurTokens, useColors, useTheme } from '../../../theme';
-import type { BlurLayerProps } from './types';
-
-/** Blur backdrop 双层 —— BlurView + tint。
- *
- *  blurType 跟 scheme 自动切(亮 'light' / 暗 'dark',避免暗色奶白雾)。
- *
- *  - `'soft'` 玻璃数据条 / 小区域
- *  - `'strong'` 焦点引导 backdrop(sheet 类浮层) */
-export function BlurLayer({
-  intensity,
-  tint,
-  style,
-  testID,
-}: BlurLayerProps): React.JSX.Element {
-  const c = useColors();
-  const { scheme } = useTheme();
-  const blurType = scheme === 'dark' ? 'dark' : 'light';
-  const defaultTint =
-    intensity === 'strong' ? c.sheetBackdrop : c.glassTintLight;
-
-  return (
-    <View
-      style={[StyleSheet.absoluteFill, style]}
-      pointerEvents="none"
-      testID={testID}
-    >
-      <BlurView
-        style={StyleSheet.absoluteFill}
-        blurType={blurType}
-        blurAmount={blurTokens[intensity]}
-        // iOS「降低透明度」开启时 BlurView 用纯色替换模糊;库默认 #FFFFFF 在暗色 scheme
-        // 下整面刺眼白底。传随 scheme 的 surface 色,与下方 tint 层视觉一致([M-6])。
-        reducedTransparencyFallbackColor={c.surface}
-      />
-      <View
-        style={[
-          StyleSheet.absoluteFill,
-          { backgroundColor: tint ?? defaultTint },
-        ]}
-      />
-    </View>
-  );
-}

package/src/components/ui/BlurLayer/BlurLayer.web.tsx

@@ -1,46 +0,0 @@
-/**
- * Web 端 BlurLayer —— CSS `backdrop-filter` 代替 native BlurView。
- *
- * `@sbaiahmed1/react-native-blur` 不支持 web(库内部 codegenNativeComponent
- * 在浏览器会炸 "is not a function",见上游 issue #79)。docusaurus-rnw plugin
- * 配 `extensions: ['.web.tsx', ...]` 优先,webpack 选这份;Metro 不识别该后缀,
- * iOS / Android 走原 `BlurLayer.tsx`。
- */
-import React from 'react';
-import { StyleSheet, View, type StyleProp, type ViewStyle } from 'react-native';
-import { blur as blurTokens, useColors, useTheme } from '../../../theme';
-import type { BlurLayerProps } from './types';
-
-export function BlurLayer({
-  intensity,
-  tint,
-  style,
-  testID,
-}: BlurLayerProps): React.JSX.Element {
-  const c = useColors();
-  const { scheme } = useTheme();
-  const blurAmount = blurTokens[intensity];
-  const defaultTint =
-    intensity === 'strong' ? c.sheetBackdrop : c.glassTintLight;
-  // RN style typedef 不识别 web-only 属性,cast 绕过 TS;RN-Web 浏览器侧原样输出。
-  // [L-15] saturate(180%):苹果 HIG 玻璃效果的标准值,增强模糊后的颜色鲜艳度,
-  //   与 macOS / iOS 系统 vibrancy 视觉一致;降低会让玻璃面板显得灰暗脱色。
-  // [L-15] opacity:0.96(暗色):暗色 scheme 下 backdrop-filter 在 Chromium 中
-  //   opacity=1 时存在渲染 artifact(模糊层与底层内容边界锯齿),降到 0.96 消除;
-  //   亮色 scheme 不受影响故保持 1。native 端 BlurLayer.tsx 用双层 View 实现,
-  //   语义等价(tint 层覆盖 BlurView),无需此 opacity 补丁。
-  const webBlurStyle = {
-    backdropFilter: `blur(${blurAmount}px) saturate(180%)`,
-    WebkitBackdropFilter: `blur(${blurAmount}px) saturate(180%)`,
-    backgroundColor: tint ?? defaultTint,
-    opacity: scheme === 'dark' ? 0.96 : 1,
-  } as unknown as StyleProp<ViewStyle>;
-
-  return (
-    <View
-      style={[StyleSheet.absoluteFill, webBlurStyle, style]}
-      pointerEvents="none"
-      testID={testID}
-    />
-  );
-}

package/src/components/ui/BlurLayer/index.ts

@@ -1,2 +0,0 @@
-export { BlurLayer } from './BlurLayer';
-export type { BlurLayerProps } from './types';

package/src/components/ui/BlurLayer/types.ts

@@ -1,15 +0,0 @@
-import type { StyleProp, ViewStyle } from 'react-native';
-import type { BlurIntensity } from '../../../theme';
-
-export type BlurLayerProps = {
-  /** 模糊强度,对齐设计稿 token:
-   *  - 'soft' = blurAmount 10,玻璃数据条 / 小区域玻璃感
-   *  - 'strong' = blurAmount 40,焦点引导 backdrop */
-  intensity: BlurIntensity;
-  /** Tint override(不传按 intensity 推:soft → c.glassTintLight / strong → c.sheetBackdrop) */
-  tint?: string;
-  /** 附加样式;默认 absoluteFill,caller 通常不需要传 */
-  style?: StyleProp<ViewStyle>;
-  /** E2E / 测试定位 */
-  testID?: string;
-};

package/src/theme/blur.ts

@@ -1,11 +0,0 @@
-/** Blur intensity tokens —— backdrop-filter 二档语义化封装。
- *
- *  数值是 `@sbaiahmed1/react-native-blur` 的 BlurView `blurAmount` prop(0-100)。 */
-export const blur = {
-  /** 玻璃数据条 / 小区域玻璃感。 */
-  soft: 10,
-  /** 焦点引导大面积 backdrop。 */
-  strong: 40,
-} as const;
-
-export type BlurIntensity = keyof typeof blur;