@reown/appkit-react-native 2.0.0-alpha.3 → 2.0.0-alpha.4

package/src/views/w3m-wallet-compatible-networks-view/index.tsx

@@ -1,13 +1,18 @@
 import { ScrollView } from 'react-native';
 import { useSnapshot } from 'valtio';
-import { FlexView, Text, Banner, NetworkImage } from '@reown/appkit-ui-react-native';
+import {
+  FlexView,
+  Text,
+  Banner,
+  NetworkImage,
+  useCustomDimensions
+} from '@reown/appkit-ui-react-native';
 import {
   ApiController,
   AssetController,
   AssetUtil,
   ConnectionsController
 } from '@reown/appkit-core-react-native';
-import { useCustomDimensions } from '../../hooks/useCustomDimensions';
 import styles from './styles';
 
 export function WalletCompatibleNetworks() {

package/src/views/w3m-wallet-receive-view/index.tsx

@@ -7,7 +7,8 @@ import {
   QrCode,
   Spacing,
   Text,
-  UiUtil
+  UiUtil,
+  useCustomDimensions
 } from '@reown/appkit-ui-react-native';
 import {
   ApiController,
@@ -19,7 +20,6 @@ import {
   RouterController,
   SnackController
 } from '@reown/appkit-core-react-native';
-import { useCustomDimensions } from '../../hooks/useCustomDimensions';
 
 export function WalletReceiveView() {
   const { networkImages } = useSnapshot(AssetController.state);

package/src/views/w3m-wallet-send-preview-view/index.tsx

@@ -1,13 +1,21 @@
 import { useSnapshot } from 'valtio';
 import { ScrollView } from 'react-native';
-import { Avatar, Button, FlexView, Icon, Image, Text, UiUtil } from '@reown/appkit-ui-react-native';
+import {
+  Avatar,
+  Button,
+  FlexView,
+  Icon,
+  Image,
+  Text,
+  UiUtil,
+  useCustomDimensions
+} from '@reown/appkit-ui-react-native';
 import { NumberUtil } from '@reown/appkit-common-react-native';
 import {
   ConnectionsController,
   RouterController,
   SendController
 } from '@reown/appkit-core-react-native';
-import { useCustomDimensions } from '../../hooks/useCustomDimensions';
 import { PreviewSendPill } from './components/preview-send-pill';
 import styles from './styles';
 import { PreviewSendDetails } from './components/preview-send-details';

package/src/views/w3m-wallet-send-select-token-view/index.tsx

@@ -1,7 +1,13 @@
 import { useState } from 'react';
 import { useSnapshot } from 'valtio';
 import { ScrollView } from 'react-native';
-import { FlexView, InputText, ListToken, Text } from '@reown/appkit-ui-react-native';
+import {
+  FlexView,
+  InputText,
+  ListToken,
+  Text,
+  useCustomDimensions
+} from '@reown/appkit-ui-react-native';
 import {
   AssetController,
   AssetUtil,
@@ -11,7 +17,6 @@ import {
 } from '@reown/appkit-core-react-native';
 import type { Balance } from '@reown/appkit-common-react-native';
 
-import { useCustomDimensions } from '../../hooks/useCustomDimensions';
 import { Placeholder } from '../../partials/w3m-placeholder';
 import styles from './styles';
 

package/src/views/w3m-wallet-send-view/index.tsx

@@ -7,9 +7,8 @@ import {
   RouterController,
   SendController
 } from '@reown/appkit-core-react-native';
-import { Button, FlexView, IconBox } from '@reown/appkit-ui-react-native';
+import { Button, FlexView, IconBox, useCustomDimensions } from '@reown/appkit-ui-react-native';
 import { SendInputToken } from '../../partials/w3m-send-input-token';
-import { useCustomDimensions } from '../../hooks/useCustomDimensions';
 import { useKeyboard } from '../../hooks/useKeyboard';
 import { SendInputAddress } from '../../partials/w3m-send-input-address';
 import styles from './styles';

package/src/views/w3m-what-is-a-network-view/index.tsx

@@ -1,6 +1,5 @@
 import { Linking, ScrollView } from 'react-native';
-import { Button, FlexView, Text, Visual } from '@reown/appkit-ui-react-native';
-import { useCustomDimensions } from '../../hooks/useCustomDimensions';
+import { Button, FlexView, Text, Visual, useCustomDimensions } from '@reown/appkit-ui-react-native';
 import styles from './styles';
 
 export function WhatIsANetworkView() {

package/src/views/w3m-what-is-a-wallet-view/index.tsx

@@ -1,7 +1,6 @@
 import { ScrollView } from 'react-native';
-import { Button, FlexView, Text, Visual } from '@reown/appkit-ui-react-native';
+import { Button, FlexView, Text, Visual, useCustomDimensions } from '@reown/appkit-ui-react-native';
 import { EventsController, RouterController } from '@reown/appkit-core-react-native';
-import { useCustomDimensions } from '../../hooks/useCustomDimensions';
 import styles from './styles';
 
 export function WhatIsAWalletView() {

package/lib/commonjs/hooks/useCustomDimensions.js

@@ -1,33 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.useCustomDimensions = useCustomDimensions;
-var _react = require("react");
-var _reactNative = require("react-native");
-/**
- * Hook used to get the width of the screen and the padding needed to accomplish portrait and landscape modes.
- * @returns { width: number, isPortrait: boolean, isLandscape: boolean, padding: number }
- */
-function useCustomDimensions() {
-  const {
-    width,
-    height
-  } = (0, _reactNative.useWindowDimensions)();
-  const [maxWidth, setMaxWidth] = (0, _react.useState)(Math.min(width, height));
-  const [isPortrait, setIsPortrait] = (0, _react.useState)(height > width);
-  const [padding, setPadding] = (0, _react.useState)(0);
-  (0, _react.useEffect)(() => {
-    setMaxWidth(Math.min(width, height));
-    setIsPortrait(height > width);
-    setPadding(width < height ? 0 : (width - height) / 2);
-  }, [width, height]);
-  return {
-    maxWidth,
-    isPortrait,
-    isLandscape: !isPortrait,
-    padding
-  };
-}
-//# sourceMappingURL=useCustomDimensions.js.map

package/lib/commonjs/hooks/useCustomDimensions.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["_react","require","_reactNative","useCustomDimensions","width","height","useWindowDimensions","maxWidth","setMaxWidth","useState","Math","min","isPortrait","setIsPortrait","padding","setPadding","useEffect","isLandscape"],"sourceRoot":"../../../src","sources":["hooks/useCustomDimensions.ts"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,OAAA;AACA,IAAAC,YAAA,GAAAD,OAAA;AAEA;AACA;AACA;AACA;AACO,SAASE,mBAAmBA,CAAA,EAAG;EACpC,MAAM;IAAEC,KAAK;IAAEC;EAAO,CAAC,GAAG,IAAAC,gCAAmB,EAAC,CAAC;EAC/C,MAAM,CAACC,QAAQ,EAAEC,WAAW,CAAC,GAAG,IAAAC,eAAQ,EAASC,IAAI,CAACC,GAAG,CAACP,KAAK,EAAEC,MAAM,CAAC,CAAC;EACzE,MAAM,CAACO,UAAU,EAAEC,aAAa,CAAC,GAAG,IAAAJ,eAAQ,EAAUJ,MAAM,GAAGD,KAAK,CAAC;EACrE,MAAM,CAACU,OAAO,EAAEC,UAAU,CAAC,GAAG,IAAAN,eAAQ,EAAS,CAAC,CAAC;EAEjD,IAAAO,gBAAS,EAAC,MAAM;IACdR,WAAW,CAACE,IAAI,CAACC,GAAG,CAACP,KAAK,EAAEC,MAAM,CAAC,CAAC;IACpCQ,aAAa,CAACR,MAAM,GAAGD,KAAK,CAAC;IAC7BW,UAAU,CAACX,KAAK,GAAGC,MAAM,GAAG,CAAC,GAAG,CAACD,KAAK,GAAGC,MAAM,IAAI,CAAC,CAAC;EACvD,CAAC,EAAE,CAACD,KAAK,EAAEC,MAAM,CAAC,CAAC;EAEnB,OAAO;IAAEE,QAAQ;IAAEK,UAAU;IAAEK,WAAW,EAAE,CAACL,UAAU;IAAEE;EAAQ,CAAC;AACpE","ignoreList":[]}

package/lib/module/hooks/useCustomDimensions.js

@@ -1,30 +0,0 @@
-"use strict";
-
-import { useState, useEffect } from 'react';
-import { useWindowDimensions } from 'react-native';
-
-/**
- * Hook used to get the width of the screen and the padding needed to accomplish portrait and landscape modes.
- * @returns { width: number, isPortrait: boolean, isLandscape: boolean, padding: number }
- */
-export function useCustomDimensions() {
-  const {
-    width,
-    height
-  } = useWindowDimensions();
-  const [maxWidth, setMaxWidth] = useState(Math.min(width, height));
-  const [isPortrait, setIsPortrait] = useState(height > width);
-  const [padding, setPadding] = useState(0);
-  useEffect(() => {
-    setMaxWidth(Math.min(width, height));
-    setIsPortrait(height > width);
-    setPadding(width < height ? 0 : (width - height) / 2);
-  }, [width, height]);
-  return {
-    maxWidth,
-    isPortrait,
-    isLandscape: !isPortrait,
-    padding
-  };
-}
-//# sourceMappingURL=useCustomDimensions.js.map

package/lib/module/hooks/useCustomDimensions.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["useState","useEffect","useWindowDimensions","useCustomDimensions","width","height","maxWidth","setMaxWidth","Math","min","isPortrait","setIsPortrait","padding","setPadding","isLandscape"],"sourceRoot":"../../../src","sources":["hooks/useCustomDimensions.ts"],"mappings":";;AAAA,SAASA,QAAQ,EAAEC,SAAS,QAAQ,OAAO;AAC3C,SAASC,mBAAmB,QAAQ,cAAc;;AAElD;AACA;AACA;AACA;AACA,OAAO,SAASC,mBAAmBA,CAAA,EAAG;EACpC,MAAM;IAAEC,KAAK;IAAEC;EAAO,CAAC,GAAGH,mBAAmB,CAAC,CAAC;EAC/C,MAAM,CAACI,QAAQ,EAAEC,WAAW,CAAC,GAAGP,QAAQ,CAASQ,IAAI,CAACC,GAAG,CAACL,KAAK,EAAEC,MAAM,CAAC,CAAC;EACzE,MAAM,CAACK,UAAU,EAAEC,aAAa,CAAC,GAAGX,QAAQ,CAAUK,MAAM,GAAGD,KAAK,CAAC;EACrE,MAAM,CAACQ,OAAO,EAAEC,UAAU,CAAC,GAAGb,QAAQ,CAAS,CAAC,CAAC;EAEjDC,SAAS,CAAC,MAAM;IACdM,WAAW,CAACC,IAAI,CAACC,GAAG,CAACL,KAAK,EAAEC,MAAM,CAAC,CAAC;IACpCM,aAAa,CAACN,MAAM,GAAGD,KAAK,CAAC;IAC7BS,UAAU,CAACT,KAAK,GAAGC,MAAM,GAAG,CAAC,GAAG,CAACD,KAAK,GAAGC,MAAM,IAAI,CAAC,CAAC;EACvD,CAAC,EAAE,CAACD,KAAK,EAAEC,MAAM,CAAC,CAAC;EAEnB,OAAO;IAAEC,QAAQ;IAAEI,UAAU;IAAEI,WAAW,EAAE,CAACJ,UAAU;IAAEE;EAAQ,CAAC;AACpE","ignoreList":[]}

package/lib/typescript/hooks/useCustomDimensions.d.ts

@@ -1,11 +0,0 @@
-/**
- * Hook used to get the width of the screen and the padding needed to accomplish portrait and landscape modes.
- * @returns { width: number, isPortrait: boolean, isLandscape: boolean, padding: number }
- */
-export declare function useCustomDimensions(): {
-    maxWidth: number;
-    isPortrait: boolean;
-    isLandscape: boolean;
-    padding: number;
-};
-//# sourceMappingURL=useCustomDimensions.d.ts.map

package/lib/typescript/hooks/useCustomDimensions.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"useCustomDimensions.d.ts","sourceRoot":"","sources":["../../../src/hooks/useCustomDimensions.ts"],"names":[],"mappings":"AAGA;;;GAGG;AACH,wBAAgB,mBAAmB;;;;;EAalC"}

package/src/hooks/useCustomDimensions.ts

@@ -1,21 +0,0 @@
-import { useState, useEffect } from 'react';
-import { useWindowDimensions } from 'react-native';
-
-/**
- * Hook used to get the width of the screen and the padding needed to accomplish portrait and landscape modes.
- * @returns { width: number, isPortrait: boolean, isLandscape: boolean, padding: number }
- */
-export function useCustomDimensions() {
-  const { width, height } = useWindowDimensions();
-  const [maxWidth, setMaxWidth] = useState<number>(Math.min(width, height));
-  const [isPortrait, setIsPortrait] = useState<boolean>(height > width);
-  const [padding, setPadding] = useState<number>(0);
-
-  useEffect(() => {
-    setMaxWidth(Math.min(width, height));
-    setIsPortrait(height > width);
-    setPadding(width < height ? 0 : (width - height) / 2);
-  }, [width, height]);
-
-  return { maxWidth, isPortrait, isLandscape: !isPortrait, padding };
-}