@xhsreds/reds-rn-next 0.0.4 → 0.0.8

package/src/components/Button/index.tsx

@@ -1,7 +1,7 @@
 import React, { forwardRef } from "react";
 import { Text, View } from "react-native";
 
-export default forwardRef<View>((props: any, ref) => {
+const Button: React.FC<any> = forwardRef<View>((props: any, ref) => {
   return (
     <View
       ref={ref}
@@ -21,3 +21,5 @@ export default forwardRef<View>((props: any, ref) => {
     </View>
   );
 });
+
+export default Button;

package/src/components/Button/interface/index.ts

@@ -16,3 +16,9 @@ export const defaultProps: RedsButton = {
   trackOnColor: lightColor.Primary,
   trackOffColor: lightColor.Fill2,
 };
+export const ButtonDefaultProps: RedsButton = {
+  defaultValue: false,
+  disabled: false,
+  trackOnColor: lightColor.Primary,
+  trackOffColor: lightColor.Fill2,
+};

package/src/components/Button/test/index.bench.tsx

@@ -7,7 +7,7 @@ import Button from "../index";
 describe("Button", () => {
   it(":base", async () => {
     let isOn = false;
-    const wrapper = render(<Button onChange={(v) => (isOn = v)}></Button>);
+    const wrapper = render(<Button></Button>);
     expect(wrapper.UNSAFE_root.props.defaultValue).toBe(false);
     await fireEvent(wrapper.UNSAFE_root.children[0], "press");
     expect(isOn).toBe(true);

package/src/components/Button/test/index.test.tsx

@@ -2,7 +2,6 @@ import { describe, it, expect } from "vitest";
 import { render, fireEvent, userEvent } from "@testing-library/react-native";
 import "@testing-library/react-native/extend-expect";
 import { Pressable, Text, View } from "react-native";
-import Button from "../index";
 
 describe("Button", () => {
   it(":base", async () => {});

package/src/components/ConfigProvider/ConfigProvider.tsx

@@ -1,8 +1,9 @@
 import { ConfigProviderProps } from "./interface";
 import { configCache } from "./hooks/ConfigCache/ConfigCache";
 import { ConfigProviderContext, IConfigProviderContext } from "./hooks/ConfigContext/ConfigContext";
+import React from "react";
 
-const ConfigProvider = (props: ConfigProviderProps) => {
+const ConfigProvider: React.FC<ConfigProviderProps> = (props: ConfigProviderProps) => {
   const {
     id = "root",
     theme = {

package/src/components/ConfigProvider/demo/index.tsx

@@ -1,6 +1,6 @@
 import React, { useRef, useEffect, useState } from "react";
 import { View, Text, StyleSheet, FlatList, ScrollView } from "react-native";
-import { ConfigProvider } from "@xhs/reds-rn-next";
+import { Button } from "@xhs/reds-rn-next";
 
 const styles = StyleSheet.create({
   container: {
@@ -20,30 +20,30 @@ const styles = StyleSheet.create({
 const Desc = ({ children = "" }) => {
   return <Text>{children}</Text>;
 };
-const Br = (props) => <View style={{ height: props.height || 20 }}></View>;
+const Br = (props: { height?: number }) => <View style={{ height: props.height || 20 }}></View>;
 
 export default function App() {
   const [value, setValue] = useState(false);
   const [valueStr, setValueStr] = useState(value.toString());
-  const onClick = (e) => setValue((v) => !v);
-  const onChange = (v) => setValueStr(v.toString());
+  const onClick = (_e: any) => setValue((v) => !v);
+  const onChange = (v: boolean) => setValueStr(v.toString());
   return (
     <View style={styles.container}>
       <Desc>默认用法</Desc>
-      <ConfigProvider></ConfigProvider>
+      <Button></Button>
       <Br />
 
       <Desc>设置默认值</Desc>
-      <ConfigProvider defaultValue={true}></ConfigProvider>
+      <Button></Button>
       <Br />
 
       <Desc>修改开关颜色</Desc>
-      <ConfigProvider trackOnColor={"#1b8bcd"} trackOffColor={"#da36c9"}></ConfigProvider>
+      <Button></Button>
       <Br />
 
       <Desc>受控用法</Desc>
       <Text>当前值:{valueStr}</Text>
-      <ConfigProvider value={value} onClick={onClick} onChange={onChange}></ConfigProvider>
+      <Button></Button>
       <Br />
     </View>
   );

package/src/components/ConfigProvider/index.ts

@@ -1,4 +1,4 @@
-import * as ConfigProvider from "./ConfigProvider";
+import ConfigProvider from "./ConfigProvider";
 
 export { useThemeColor } from "./hooks/themeToken/useThemeToken";
 export default ConfigProvider;

package/src/components/ConfigProvider/interface/index.ts

@@ -52,3 +52,19 @@ export const defaultProps: RedsConfigProvider = {
   inherit: true,
   token: {},
 };
+export const ConfigProviderDefaultProps: RedsConfigProvider = {
+  id: "root",
+  parentId: "root",
+  theme: {
+    colorMode: "light",
+    inherit: true,
+    token: {
+      lightColor: {},
+      darkColor: {},
+      alwaysColor: {},
+    },
+  },
+  colorMode: "light",
+  inherit: true,
+  token: {},
+};

package/src/components/ConfigProvider/test/index.bench.tsx

@@ -7,7 +7,7 @@ import ConfigProvider from "../index";
 describe("ConfigProvider", () => {
   it(":base", async () => {
     let isOn = false;
-    const wrapper = render(<ConfigProvider onChange={(v) => (isOn = v)}></ConfigProvider>);
+    const wrapper = render(<ConfigProvider>123</ConfigProvider>);
     expect(wrapper.UNSAFE_root.props.defaultValue).toBe(false);
     await fireEvent(wrapper.UNSAFE_root.children[0], "press");
     expect(isOn).toBe(true);

package/src/components/Popover/demo/index.tsx

@@ -1,6 +1,6 @@
 import React, { useRef, useEffect, useState, forwardRef } from "react";
 import { View, Text, StyleSheet, FlatList, ScrollView } from "react-native";
-import { Popover, Button } from "@xhs/reds-rn-next";
+import { Popover, Button, RedsPopover } from "@xhs/reds-rn-next";
 
 const styles = StyleSheet.create({
   container: {
@@ -62,7 +62,7 @@ export default function App() {
 
       <Br />
 
-      <Popover content={placement} placement={placement} visible>
+      <Popover content={placement} placement={placement as RedsPopover["placement"]} visible>
         <Button>{"气泡位置"}</Button>
       </Popover>
     </View>

package/src/components/Popover/doc/index.mdx

@@ -12,17 +12,17 @@ import BaseDemo from "!!raw-loader!../demo/index.tsx";
 
 ### Props
 
-| 属性                 | 描述                   | 类型                   | 默认值    |
-| -------------------- | ---------------------- | ---------------------- | --------- |
-| visible              | 是否显示气泡           | boolean                | undefined |
-| placement            | 气泡方向               | "top" | "bottom"  | top       |
-| content              | 弹出内容               | string                 |           |
-| opacity              | 遮罩透明度             | number                 | 0         |
-| mode                 | 主题色                 | "light" | "dark"  | light     |
-| trigger              | 触发方式               | "click" | "touch" | click     |
-| z-index              | 层级                   | number                 | 1000      |
-| close-on-click-again | 再次点击关闭           | boolean                | true      |
-| children             | popover 作用的目标节点 | ReactNode              |           |
+| 属性                 | 描述                   | 类型                                                                                                | 默认值    |
+| -------------------- | ---------------------- | --------------------------------------------------------------------------------------------------- | --------- |
+| visible              | 是否显示气泡           | boolean                                                                                             | undefined |
+| placement            | 气泡方向               | "top-start" | "top" | "top-end" | "bottom-start" | "bottom" | "bottom-end" | top       |
+| content              | 弹出内容               | string                                                                                              |           |
+| opacity              | 遮罩透明度             | number                                                                                              | 0         |
+| mode                 | 主题色                 | "light" | "dark"                                                                               |           |
+| trigger              | 触发方式               | "click" | "touch"                                                                              | click     |
+| z-index              | 层级                   | number                                                                                              | 1000      |
+| close-on-click-again | 再次点击关闭           | boolean                                                                                             | true      |
+| children             | popover 作用的目标节点 | ReactNode                                                                                           |           |
 
 ### Events
 

package/src/components/Popover/hook.ts

@@ -2,8 +2,9 @@ import { useRef } from "react";
 import { Platform, View } from "react-native";
 import type { MeasureOnSuccessCallback, NativeMethods, LayoutChangeEvent } from "react-native";
 import { useFloating as useFloatingUI, shift, limitShift, flip, offset, arrow } from "@floating-ui/react-native";
+import { RedsPopover } from "./interface";
 
-export const useFloating = ({ placement, needModal }: { placement: "top" | "bottom"; needModal: boolean }) => {
+export const useFloating = ({ placement, needModal }: { placement: RedsPopover["placement"]; needModal: boolean }) => {
   const arrowRef = useRef(null);
   const floatingHeight = useRef(0);
   const referenceX = useRef(0);

package/src/components/Popover/interface/index.ts

@@ -1,7 +1,7 @@
 import { ReactNode } from "react";
 export interface RedsPopover {
   visible?: boolean;
-  placement?: "top" | "bottom";
+  placement?: "top-start" | "top" | "top-end" | "bottom-start" | "bottom" | "bottom-end";
   content?: string;
   opacity?: number;
   mode?: "light" | "dark";
@@ -14,12 +14,11 @@ export interface RedsPopover {
 }
 
 export interface RedsPopoverEvent {}
-export const defaultProps: RedsPopover = {
+export const PopoverDefaultProps: RedsPopover = {
   visible: undefined,
   placement: "top",
   content: "",
   opacity: 0,
-  mode: "light",
   trigger: "click",
   zIndex: 1000,
   closeOnClickAgain: true,

package/src/components/Switch/demo/index.tsx

@@ -20,19 +20,20 @@ const styles = StyleSheet.create({
 const Desc = ({ children = "" }) => {
   return <Text>{children}</Text>;
 };
-const Br = (props) => <View style={{ height: props.height || 20 }}></View>;
+const Br = (props: { height?: number }) => <View style={{ height: props.height || 20 }}></View>;
 
 export default function App() {
   const [value, setValue] = useState(false);
   const [valueStr, setValueStr] = useState(value.toString());
-  const onClick = (e) => setValue((v) => !v);
-  const onChange = (v) => {
+  const onClick = (e: any) => setValue((v) => !v);
+  const onChange = (v: boolean) => {
     console.log(v);
     setValueStr(v.toString());
   };
   return (
     <View style={styles.container}>
       <Desc>默认用法</Desc>
+      <Text>{"children"}</Text>
       <Switch></Switch>
       <Br />
 

package/src/components/Switch/doc/index.mdx

@@ -18,7 +18,7 @@ import BaseDemo from "!!raw-loader!../demo/index.tsx";
 
 ### Events
 
-| 事件   | 描述               | 类型                                   | 默认值 |
-| ------ | ------------------ | -------------------------------------- | ------ |
-| change | 当值发生变化时触发 | (value: boolean) => void               |        |
-| click  | 被点击时触发       | (value: GestureResponderEvent) => void |        |
+| 事件   | 描述               | 类型                                  | 默认值 |
+| ------ | ------------------ | ------------------------------------- | ------ |
+| change | 当值发生变化时触发 | (value: boolean) => any               |        |
+| click  | 被点击时触发       | (value: GestureResponderEvent) => any |        |

package/src/components/Switch/index.tsx

@@ -1,6 +1,6 @@
 import React, { useState, useRef, useEffect, useMemo } from "react";
 import { View, TouchableWithoutFeedback, StyleSheet, Animated, GestureResponderEvent } from "react-native";
-import { RedsSwitch, defaultProps } from "./interface/index";
+import { RedsSwitch, SwitchDefaultProps } from "./interface/index";
 import { alwaysColor } from "@xhs/reds-token-next";
 
 const Switch = ({ value: isOn, defaultValue, onChange, onClick, trackOnColor, trackOffColor }: RedsSwitch) => {
@@ -37,7 +37,7 @@ const Switch = ({ value: isOn, defaultValue, onChange, onClick, trackOnColor, tr
   );
 };
 
-Switch.defaultProps = defaultProps;
+Switch.defaultProps = SwitchDefaultProps;
 
 const styles = StyleSheet.create({
   switchContainer: {

package/src/components/Switch/interface/index.ts

@@ -6,16 +6,15 @@ export interface RedsSwitch {
   disabled?: boolean;
   trackOnColor?: string;
   trackOffColor?: string;
-  onChange?: (value: boolean) => void;
-  onClick?: (value: GestureResponderEvent) => void;
+  onChange?: (value: boolean) => any;
+  onClick?: (value: GestureResponderEvent) => any;
 }
 
-export const defaultProps: RedsSwitch = {
+export interface RedsSwitchEvent {}
+export const SwitchDefaultProps: RedsSwitch = {
   value: undefined,
   defaultValue: false,
   disabled: false,
   trackOnColor: lightColor.Primary,
   trackOffColor: lightColor.Fill2,
 };
-
-export interface RedsSwitchEvent {}

package/src/index.ts

@@ -2,4 +2,6 @@ import Button from "./components/Button";
 import Popover from "./components/Popover";
 import Switch from "./components/Switch";
 import ConfigProvider, { useThemeColor } from "./components/ConfigProvider";
+
+export * from "./components/Popover/interface";
 export { Button, Popover, Switch, ConfigProvider, useThemeColor };

package/tsconfig.json

@@ -2,8 +2,12 @@
   "extends": "../../tsconfig.json",
   "compilerOptions": {
     "outDir": "./lib",
-    "rootDir": "./"
+    "baseUrl": ".",
+    "paths": {
+      "@xhs/reds-rn-next": ["src/index"],
+      "~root/utils/*": ["../../utils/*"]
+    }
   },
   "include": ["src"],
-  "exclude": ["node_modules", "lib", "src/**/demo/**", "src/**/test/**"]
+  "exclude": ["node_modules", "lib"]
 }

package/lib/cjs/_chunks/DiJl2cva.js

@@ -1,49 +0,0 @@
-'use strict';
-
-var _rollupPluginBabelHelpers = require('./CAyGJuk1.js');
-var components_ConfigProvider_hooks_ConfigCache_ConfigCache = require('../components/ConfigProvider/hooks/ConfigCache/ConfigCache.js');
-var components_ConfigProvider_hooks_ConfigContext_ConfigContext = require('../components/ConfigProvider/hooks/ConfigContext/ConfigContext.js');
-
-var ConfigProvider = function ConfigProvider(props) {
-  var _theme$token, _theme$token2, _theme$token3, _theme$token4;
-  var _props$id = props.id,
-    id = _props$id === void 0 ? "root" : _props$id,
-    _props$theme = props.theme,
-    theme = _props$theme === void 0 ? {
-      colorMode: "light",
-      inherit: true
-    } : _props$theme,
-    _props$parentId = props.parentId,
-    parentId = _props$parentId === void 0 ? "root" : _props$parentId,
-    children = props.children;
-  var themeCache = {
-    colorMode: theme.colorMode || "light",
-    token: {
-      lightColor: _rollupPluginBabelHelpers._objectSpread2({}, (_theme$token = theme.token) === null || _theme$token === void 0 ? void 0 : _theme$token.lightColor),
-      darkColor: _rollupPluginBabelHelpers._objectSpread2({}, (_theme$token2 = theme.token) === null || _theme$token2 === void 0 ? void 0 : _theme$token2.darkColor),
-      alwaysColor: _rollupPluginBabelHelpers._objectSpread2({}, (_theme$token3 = theme.token) === null || _theme$token3 === void 0 ? void 0 : _theme$token3.alwaysColor),
-      components: _rollupPluginBabelHelpers._objectSpread2({}, (_theme$token4 = theme.token) === null || _theme$token4 === void 0 ? void 0 : _theme$token4.components)
-    },
-    inherit: theme.inherit
-  };
-  components_ConfigProvider_hooks_ConfigCache_ConfigCache.configCache.addNewConfigCache({
-    id: id,
-    themeCache: themeCache,
-    parentId: parentId
-  });
-  var configProviderContextValue = {
-    id: id
-  };
-  return /* @__PURE__ */React.createElement(components_ConfigProvider_hooks_ConfigContext_ConfigContext.ConfigProviderContext.Provider, {
-    value: configProviderContextValue
-  }, children);
-};
-
-var ConfigProvider$1 = /*#__PURE__*/Object.freeze({
-  __proto__: null,
-  default: ConfigProvider
-});
-
-exports.ConfigProvider = ConfigProvider$1;
-exports.ConfigProvider$1 = ConfigProvider;
-//# sourceMappingURL=DiJl2cva.js.map

package/lib/cjs/_chunks/DiJl2cva.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"DiJl2cva.js","sources":["../../../src/components/ConfigProvider/ConfigProvider.tsx"],"sourcesContent":["import { ConfigProviderProps } from \"./interface\";\nimport { configCache } from \"./hooks/ConfigCache/ConfigCache\";\nimport { ConfigProviderContext, IConfigProviderContext } from \"./hooks/ConfigContext/ConfigContext\";\n\nconst ConfigProvider = (props: ConfigProviderProps) => {\n  const {\n    id = \"root\",\n    theme = {\n      colorMode: \"light\",\n      inherit: true,\n    },\n    parentId = \"root\",\n    children,\n  } = props;\n\n  const themeCache = {\n    colorMode: theme.colorMode || \"light\",\n    token: {\n      lightColor: {\n        ...theme.token?.lightColor,\n      },\n      darkColor: {\n        ...theme.token?.darkColor,\n      },\n      alwaysColor: {\n        ...theme.token?.alwaysColor,\n      },\n      components: {\n        ...theme.token?.components,\n      },\n    },\n    inherit: theme.inherit,\n  };\n\n  configCache.addNewConfigCache({\n    id,\n    themeCache,\n    parentId,\n  });\n\n  const configProviderContextValue: IConfigProviderContext = {\n    id: id,\n  };\n\n  return <ConfigProviderContext.Provider value={configProviderContextValue}>{children}</ConfigProviderContext.Provider>;\n};\n\nexport default ConfigProvider;\n"],"names":["ConfigProvider","props","_theme$token","_theme$token2","_theme$token3","_theme$token4","_props$id","id","_props$theme","theme","colorMode","inherit","_props$parentId","parentId","children","themeCache","token","lightColor","_objectSpread","darkColor","alwaysColor","components","configCache","addNewConfigCache","configProviderContextValue","ConfigProviderContext","Provider","value"],"mappings":";;;;;;AAIA,IAAMA,cAAA,GAAiB,SAAjBA,cAAAA,CAAkBC,KAA+B,EAAA;AAAA,EAAA,IAAAC,YAAA,EAAAC,aAAA,EAAAC,aAAA,EAAAC,aAAA,CAAA;AAC/C,EAAA,IAAAC,SAAA,GAQFL,KAAA,CAPFM,EAAK;AAALA,IAAAA,EAAK,GAAAD,SAAA,KAAA,KAAA,CAAA,GAAA,MAAA,GAAAA,SAAA;IAAAE,YAAA,GAOHP,KAAA,CANFQ,KAAQ;IAARA,KAAQ,GAAAD,YAAA,KAAA,KAAA,CAAA,GAAA;AACNE,MAAAA,SAAW,EAAA,OAAA;AACXC,MAAAA,OAAS,EAAA,IAAA;AACX,KAAA,GAAAH,YAAA;IAAAI,eAAA,GAGEX,KAAA,CAFFY,QAAW;AAAXA,IAAAA,QAAW,GAAAD,eAAA,KAAA,KAAA,CAAA,GAAA,MAAA,GAAAA,eAAA;IACXE,QAAA,GACEb,KAAA,CADFa,QAAA,CAAA;AAGF,EAAA,IAAMC,UAAa,GAAA;AACjBL,IAAAA,SAAA,EAAWD,MAAMC,SAAa,IAAA,OAAA;AAC9BM,IAAAA,KAAO,EAAA;AACLC,MAAAA,UAAY,EAAAC,wCAAA,CAAAhB,EAAAA,EAAAA,CAAAA,YAAA,GACPO,MAAMO,KAAO,MAAA,IAAA,IAAAd,YAAA,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAbA,YAAA,CAAae,UAAA,CAClB;AACAE,MAAAA,SAAW,EAAAD,wCAAA,CAAAf,EAAAA,EAAAA,CAAAA,aAAA,GACNM,MAAMO,KAAO,MAAA,IAAA,IAAAb,aAAA,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAbA,aAAA,CAAagB,SAAA,CAClB;AACAC,MAAAA,WAAa,EAAAF,wCAAA,CAAAd,EAAAA,EAAAA,CAAAA,aAAA,GACRK,MAAMO,KAAO,MAAA,IAAA,IAAAZ,aAAA,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAbA,aAAA,CAAagB,WAAA,CAClB;AACAC,MAAAA,UAAY,EAAAH,wCAAA,CAAAb,EAAAA,EAAAA,CAAAA,aAAA,GACPI,MAAMO,KAAO,MAAAX,IAAAA,IAAAA,aAAA,KAAbA,KAAAA,CAAAA,GAAAA,KAAAA,CAAAA,GAAAA,aAAA,CAAagB,UAAA,CAAA;KAEpB;IACAV,SAASF,KAAM,CAAAE,OAAAA;GACjB,CAAA;EAEAW,mEAAA,CAAYC,iBAAkB,CAAA;AAC5BhB,IAAAA,EAAA,EAAAA,EAAA;AACAQ,IAAAA,UAAA,EAAAA,UAAA;AACAF,IAAAA,QAAA,EAAAA,QAAAA;AACF,GAAC,CAAA,CAAA;AAED,EAAA,IAAMW,0BAAqD,GAAA;AACzDjB,IAAAA,EAAA,EAAAA,EAAAA;GACF,CAAA;EAEA,0CAAQkB,iFAAsB,CAAAC,QAAA,EAAtB;AAA+BC,IAAAA,KAAA,EAAOH,0BAAAA;KAA6BV,QAAS,CAAA,CAAA;AACtF;;;;;;;;;;"}

package/lib/cjs/components/NN/index.js

@@ -1,83 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var _rollupPluginBabelHelpers = require('../../_chunks/CAyGJuk1.js');
-var React = require('react');
-var reactNative = require('react-native');
-var components_NN_interface_index = require('./interface/index.js');
-var redsTokenNext = require('@xhs/reds-token-next');
-
-var NN = function NN(_ref) {
-  var cValue = _ref.value,
-    defaultValue = _ref.defaultValue,
-    onChange = _ref.onChange,
-    onClick = _ref.onClick,
-    trackOnColor = _ref.trackOnColor,
-    trackOffColor = _ref.trackOffColor;
-  var isControlled = cValue !== void 0;
-  var _useState = React.useState(defaultValue),
-    _useState2 = _rollupPluginBabelHelpers._slicedToArray(_useState, 2),
-    value = _useState2[0],
-    setValue = _useState2[1];
-  var animatedValue = React.useRef(new reactNative.Animated.Value(defaultValue ? 18 : 2)).current;
-  var thumbTranslateX = React.useMemo(function () {
-    return animatedValue.interpolate({
-      inputRange: [2, 18],
-      outputRange: [2, 18]
-    });
-  }, []);
-  React.useEffect(function () {
-    isControlled && setValue(cValue);
-    onChange === null || onChange === void 0 || onChange(!!value);
-    reactNative.Animated.timing(animatedValue, {
-      toValue: value ? 18 : 2,
-      duration: 200,
-      useNativeDriver: true
-    }).start();
-  }, [value, cValue]);
-  var toggleNN = function toggleNN(e) {
-    onClick === null || onClick === void 0 || onClick(e);
-    !isControlled && setValue(function (v) {
-      return !v;
-    });
-  };
-  return /* @__PURE__ */React.createElement(reactNative.TouchableWithoutFeedback, {
-    onPress: function onPress(e) {
-      return toggleNN(e);
-    }
-  }, /* @__PURE__ */React.createElement(reactNative.View, {
-    style: [styles.container, {
-      backgroundColor: value ? trackOnColor : trackOffColor
-    }]
-  }, /* @__PURE__ */React.createElement(reactNative.Animated.View, {
-    style: [styles.thumb, {
-      transform: [{
-        translateX: thumbTranslateX
-      }]
-    }]
-  })));
-};
-NN.defaultProps = components_NN_interface_index.defaultProps;
-var styles = reactNative.StyleSheet.create({
-  container: {
-    width: 40,
-    height: 24,
-    borderRadius: 15,
-    justifyContent: "center",
-    alignItems: "center"
-  },
-  thumb: {
-    width: 20,
-    height: 20,
-    borderRadius: 10,
-    backgroundColor: redsTokenNext.alwaysColor.White,
-    justifyContent: "center",
-    alignItems: "center",
-    position: "absolute",
-    left: 0
-  }
-});
-
-exports.default = NN;
-//# sourceMappingURL=index.js.map

package/lib/cjs/components/NN/index.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","sources":["../../../../src/components/NN/index.tsx"],"sourcesContent":["import React, { useState, useRef, useEffect, useMemo } from \"react\";\nimport { View, TouchableWithoutFeedback, StyleSheet, Animated, GestureResponderEvent } from \"react-native\";\nimport { RedsNN, defaultProps } from \"./interface/index\";\nimport { alwaysColor } from \"@xhs/reds-token-next\";\n\nconst NN = ({ value: cValue, defaultValue, onChange, onClick, trackOnColor, trackOffColor }: RedsNN) => {\n  const isControlled = cValue !== undefined;\n  const [value, setValue] = useState(defaultValue);\n\n  const animatedValue = useRef(new Animated.Value(defaultValue ? 18 : 2)).current;\n\n  const thumbTranslateX = useMemo(() => animatedValue.interpolate({ inputRange: [2, 18], outputRange: [2, 18] }), []);\n\n  useEffect(() => {\n    isControlled && setValue(cValue);\n    onChange?.(!!value);\n    Animated.timing(animatedValue, {\n      toValue: value ? 18 : 2,\n      duration: 200,\n      useNativeDriver: true,\n    }).start();\n  }, [value, cValue]);\n\n  const toggleNN = (e: GestureResponderEvent) => {\n    onClick?.(e);\n    !isControlled && setValue((v) => !v);\n  };\n\n  return (\n    <TouchableWithoutFeedback onPress={(e) => toggleNN(e)}>\n      <View style={[styles.container, { backgroundColor: value ? trackOnColor : trackOffColor }]}>\n        <Animated.View style={[styles.thumb, { transform: [{ translateX: thumbTranslateX }] }]}></Animated.View>\n      </View>\n    </TouchableWithoutFeedback>\n  );\n};\n\nNN.defaultProps = defaultProps;\n\nconst styles = StyleSheet.create({\n  container: {\n    width: 40,\n    height: 24,\n    borderRadius: 15,\n    justifyContent: \"center\",\n    alignItems: \"center\",\n  },\n  thumb: {\n    width: 20,\n    height: 20,\n    borderRadius: 10,\n    backgroundColor: alwaysColor.White,\n    justifyContent: \"center\",\n    alignItems: \"center\",\n    position: \"absolute\",\n    left: 0,\n  },\n});\n\nexport default NN;\n"],"names":["NN","_ref","cValue","value","defaultValue","onChange","onClick","trackOnColor","trackOffColor","isControlled","_useState","useState","_useState2","_slicedToArray","setValue","animatedValue","useRef","Animated","Value","current","thumbTranslateX","useMemo","interpolate","inputRange","outputRange","useEffect","timing","toValue","duration","useNativeDriver","start","toggleNN","e","v","TouchableWithoutFeedback","onPress","React","createElement","View","style","styles","container","backgroundColor","thumb","transform","translateX","defaultProps","StyleSheet","create","width","height","borderRadius","justifyContent","alignItems","alwaysColor","White","position","left"],"mappings":"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"}

package/lib/cjs/components/NN/interface/index.js

@@ -1,13 +0,0 @@
-'use strict';
-
-var redsTokenNext = require('@xhs/reds-token-next');
-
-var defaultProps = {
-  defaultValue: false,
-  disabled: false,
-  trackOnColor: redsTokenNext.lightColor.Primary,
-  trackOffColor: redsTokenNext.lightColor.Fill2
-};
-
-exports.defaultProps = defaultProps;
-//# sourceMappingURL=index.js.map

package/lib/cjs/components/NN/interface/index.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","sources":["../../../../../src/components/NN/interface/index.ts"],"sourcesContent":["import { GestureResponderEvent } from \"react-native\";\nimport { lightColor } from \"@xhs/reds-token-next\";\nexport interface RedsNN {\n  value?: boolean;\n  defaultValue?: boolean;\n  disabled?: boolean;\n  trackOnColor?: string;\n  trackOffColor?: string;\n  onChange?: (value: boolean) => void;\n  onClick?: (value: Event) => void;\n}\n\nexport const defaultProps: RedsNN = {\n  defaultValue: false,\n  disabled: false,\n  trackOnColor: lightColor.Primary,\n  trackOffColor: lightColor.Fill2,\n};\n"],"names":["defaultProps","defaultValue","disabled","trackOnColor","lightColor","Primary","trackOffColor","Fill2"],"mappings":";;;;AAYO,IAAMA,YAAuB,GAAA;AAClCC,EAAAA,YAAc,EAAA,KAAA;AACdC,EAAAA,QAAU,EAAA,KAAA;EACVC,cAAcC,wBAAW,CAAAC,OAAA;EACzBC,eAAeF,wBAAW,CAAAG,KAAAA;AAC5B;;;;"}

package/lib/cjs/components/NNNN/index.js

@@ -1,83 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var _rollupPluginBabelHelpers = require('../../_chunks/CAyGJuk1.js');
-var React = require('react');
-var reactNative = require('react-native');
-var components_NNNN_interface_index = require('./interface/index.js');
-var redsTokenNext = require('@xhs/reds-token-next');
-
-var NNNN = function NNNN(_ref) {
-  var cValue = _ref.value,
-    defaultValue = _ref.defaultValue,
-    onChange = _ref.onChange,
-    onClick = _ref.onClick,
-    trackOnColor = _ref.trackOnColor,
-    trackOffColor = _ref.trackOffColor;
-  var isControlled = cValue !== void 0;
-  var _useState = React.useState(defaultValue),
-    _useState2 = _rollupPluginBabelHelpers._slicedToArray(_useState, 2),
-    value = _useState2[0],
-    setValue = _useState2[1];
-  var animatedValue = React.useRef(new reactNative.Animated.Value(defaultValue ? 18 : 2)).current;
-  var thumbTranslateX = React.useMemo(function () {
-    return animatedValue.interpolate({
-      inputRange: [2, 18],
-      outputRange: [2, 18]
-    });
-  }, []);
-  React.useEffect(function () {
-    isControlled && setValue(cValue);
-    onChange === null || onChange === void 0 || onChange(!!value);
-    reactNative.Animated.timing(animatedValue, {
-      toValue: value ? 18 : 2,
-      duration: 200,
-      useNativeDriver: true
-    }).start();
-  }, [value, cValue]);
-  var toggleNNNN = function toggleNNNN(e) {
-    onClick === null || onClick === void 0 || onClick(e);
-    !isControlled && setValue(function (v) {
-      return !v;
-    });
-  };
-  return /* @__PURE__ */React.createElement(reactNative.TouchableWithoutFeedback, {
-    onPress: function onPress(e) {
-      return toggleNNNN(e);
-    }
-  }, /* @__PURE__ */React.createElement(reactNative.View, {
-    style: [styles.container, {
-      backgroundColor: value ? trackOnColor : trackOffColor
-    }]
-  }, /* @__PURE__ */React.createElement(reactNative.Animated.View, {
-    style: [styles.thumb, {
-      transform: [{
-        translateX: thumbTranslateX
-      }]
-    }]
-  })));
-};
-NNNN.defaultProps = components_NNNN_interface_index.defaultProps;
-var styles = reactNative.StyleSheet.create({
-  container: {
-    width: 40,
-    height: 24,
-    borderRadius: 15,
-    justifyContent: "center",
-    alignItems: "center"
-  },
-  thumb: {
-    width: 20,
-    height: 20,
-    borderRadius: 10,
-    backgroundColor: redsTokenNext.alwaysColor.White,
-    justifyContent: "center",
-    alignItems: "center",
-    position: "absolute",
-    left: 0
-  }
-});
-
-exports.default = NNNN;
-//# sourceMappingURL=index.js.map

package/lib/cjs/components/NNNN/index.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","sources":["../../../../src/components/NNNN/index.tsx"],"sourcesContent":["import React, { useState, useRef, useEffect, useMemo } from \"react\";\nimport { View, TouchableWithoutFeedback, StyleSheet, Animated, GestureResponderEvent } from \"react-native\";\nimport { RedsNNNN, defaultProps } from \"./interface/index\";\nimport { alwaysColor } from \"@xhs/reds-token-next\";\n\nconst NNNN = ({ value: cValue, defaultValue, onChange, onClick, trackOnColor, trackOffColor }: RedsNNNN) => {\n  const isControlled = cValue !== undefined;\n  const [value, setValue] = useState(defaultValue);\n\n  const animatedValue = useRef(new Animated.Value(defaultValue ? 18 : 2)).current;\n\n  const thumbTranslateX = useMemo(() => animatedValue.interpolate({ inputRange: [2, 18], outputRange: [2, 18] }), []);\n\n  useEffect(() => {\n    isControlled && setValue(cValue);\n    onChange?.(!!value);\n    Animated.timing(animatedValue, {\n      toValue: value ? 18 : 2,\n      duration: 200,\n      useNativeDriver: true,\n    }).start();\n  }, [value, cValue]);\n\n  const toggleNNNN = (e: GestureResponderEvent) => {\n    onClick?.(e);\n    !isControlled && setValue((v) => !v);\n  };\n\n  return (\n    <TouchableWithoutFeedback onPress={(e) => toggleNNNN(e)}>\n      <View style={[styles.container, { backgroundColor: value ? trackOnColor : trackOffColor }]}>\n        <Animated.View style={[styles.thumb, { transform: [{ translateX: thumbTranslateX }] }]}></Animated.View>\n      </View>\n    </TouchableWithoutFeedback>\n  );\n};\n\nNNNN.defaultProps = defaultProps;\n\nconst styles = StyleSheet.create({\n  container: {\n    width: 40,\n    height: 24,\n    borderRadius: 15,\n    justifyContent: \"center\",\n    alignItems: \"center\",\n  },\n  thumb: {\n    width: 20,\n    height: 20,\n    borderRadius: 10,\n    backgroundColor: alwaysColor.White,\n    justifyContent: \"center\",\n    alignItems: \"center\",\n    position: \"absolute\",\n    left: 0,\n  },\n});\n\nexport default NNNN;\n"],"names":["NNNN","_ref","cValue","value","defaultValue","onChange","onClick","trackOnColor","trackOffColor","isControlled","_useState","useState","_useState2","_slicedToArray","setValue","animatedValue","useRef","Animated","Value","current","thumbTranslateX","useMemo","interpolate","inputRange","outputRange","useEffect","timing","toValue","duration","useNativeDriver","start","toggleNNNN","e","v","TouchableWithoutFeedback","onPress","React","createElement","View","style","styles","container","backgroundColor","thumb","transform","translateX","defaultProps","StyleSheet","create","width","height","borderRadius","justifyContent","alignItems","alwaysColor","White","position","left"],"mappings":"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"}

package/lib/cjs/components/NNNN/interface/index.js

@@ -1,13 +0,0 @@
-'use strict';
-
-var redsTokenNext = require('@xhs/reds-token-next');
-
-var defaultProps = {
-  defaultValue: false,
-  disabled: false,
-  trackOnColor: redsTokenNext.lightColor.Primary,
-  trackOffColor: redsTokenNext.lightColor.Fill2
-};
-
-exports.defaultProps = defaultProps;
-//# sourceMappingURL=index.js.map

package/lib/cjs/components/NNNN/interface/index.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","sources":["../../../../../src/components/NNNN/interface/index.ts"],"sourcesContent":["import { GestureResponderEvent } from \"react-native\";\nimport { lightColor } from \"@xhs/reds-token-next\";\nexport interface RedsNNNN {\n  value?: boolean;\n  defaultValue?: boolean;\n  disabled?: boolean;\n  trackOnColor?: string;\n  trackOffColor?: string;\n  onChange?: (value: boolean) => void;\n  onClick?: (value: Event) => void;\n}\n\nexport const defaultProps: RedsNNNN = {\n  defaultValue: false,\n  disabled: false,\n  trackOnColor: lightColor.Primary,\n  trackOffColor: lightColor.Fill2,\n};\n"],"names":["defaultProps","defaultValue","disabled","trackOnColor","lightColor","Primary","trackOffColor","Fill2"],"mappings":";;;;AAYO,IAAMA,YAAyB,GAAA;AACpCC,EAAAA,YAAc,EAAA,KAAA;AACdC,EAAAA,QAAU,EAAA,KAAA;EACVC,cAAcC,wBAAW,CAAAC,OAAA;EACzBC,eAAeF,wBAAW,CAAAG,KAAAA;AAC5B;;;;"}