+
= () => {
ticks={mockData as unknown as TickDataRaw[]}
/>
- )
-}
+ );
+};
diff --git a/packages/widgets-internal/swap/LiquidityChartRangeInput/index.tsx b/packages/widgets-internal/swap/LiquidityChartRangeInput/index.tsx
index d193a49ce6810..aa16c1ff5930d 100644
--- a/packages/widgets-internal/swap/LiquidityChartRangeInput/index.tsx
+++ b/packages/widgets-internal/swap/LiquidityChartRangeInput/index.tsx
@@ -1,3 +1,3 @@
-export * from './LiquidityChartRangeInput'
-export * from './Chart'
-export * from './types'
+export * from "./LiquidityChartRangeInput";
+export * from "./Chart";
+export * from "./types";
diff --git a/packages/widgets-internal/swap/LiquidityChartRangeInput/svg.tsx b/packages/widgets-internal/swap/LiquidityChartRangeInput/svg.tsx
index fb064ab2bb6af..5d7416cce57eb 100644
--- a/packages/widgets-internal/swap/LiquidityChartRangeInput/svg.tsx
+++ b/packages/widgets-internal/swap/LiquidityChartRangeInput/svg.tsx
@@ -18,37 +18,37 @@ export const brushHandlePath = (height: number) =>
// handle
`M 0 0`, // move to origin
`v ${height}`, // vertical line
- 'm 1 0', // move 1px to the right
+ "m 1 0", // move 1px to the right
`V 0`, // second vertical line
`M 0 1`, // move to origin
// head
- 'h 12', // horizontal line
- 'q 2 0, 2 2', // rounded corner
- 'v 22', // vertical line
- 'q 0 2 -2 2', // rounded corner
- 'h -12', // horizontal line
+ "h 12", // horizontal line
+ "q 2 0, 2 2", // rounded corner
+ "v 22", // vertical line
+ "q 0 2 -2 2", // rounded corner
+ "h -12", // horizontal line
`z`, // close path
- ].join(' ')
+ ].join(" ");
export const brushHandleAccentPath = () =>
[
- 'm 5 7', // move to first accent
- 'v 14', // vertical line
- 'M 0 0', // move to origin
- 'm 9 7', // move to second accent
- 'v 14', // vertical line
- 'z',
- ].join(' ')
+ "m 5 7", // move to first accent
+ "v 14", // vertical line
+ "M 0 0", // move to origin
+ "m 9 7", // move to second accent
+ "v 14", // vertical line
+ "z",
+ ].join(" ");
export const OffScreenHandle = ({
color,
size = 10,
margin = 10,
}: {
- color: string
- size?: number
- margin?: number
+ color: string;
+ size?: number;
+ margin?: number;
}) => (
-)
+);
diff --git a/packages/widgets-internal/swap/LiquidityChartRangeInput/types.ts b/packages/widgets-internal/swap/LiquidityChartRangeInput/types.ts
index 44f981024186b..d124eb3c7f6d8 100644
--- a/packages/widgets-internal/swap/LiquidityChartRangeInput/types.ts
+++ b/packages/widgets-internal/swap/LiquidityChartRangeInput/types.ts
@@ -1,84 +1,84 @@
-import { BigintIsh } from '@pancakeswap/sdk'
-import { FeeAmount } from '@pancakeswap/v3-sdk'
+import { BigintIsh } from "@pancakeswap/sdk";
+import { FeeAmount } from "@pancakeswap/v3-sdk";
export interface ChartEntry {
- activeLiquidity: number
- price0: number
+ activeLiquidity: number;
+ price0: number;
}
interface Dimensions {
- width: number
- height: number
+ width: number;
+ height: number;
}
interface Margins {
- top: number
- right: number
- bottom: number
- left: number
+ top: number;
+ right: number;
+ bottom: number;
+ left: number;
}
export interface ZoomLevels {
- initialMin: number
- initialMax: number
- min: number
- max: number
+ initialMin: number;
+ initialMax: number;
+ min: number;
+ max: number;
}
export interface LiquidityChartRangeInputProps {
// to distringuish between multiple charts in the DOM
- id?: string
+ id?: string;
data: {
- series: ChartEntry[]
- current: number
- }
- ticksAtLimit: { [bound in Bound]?: boolean | undefined }
+ series: ChartEntry[];
+ current: number;
+ };
+ ticksAtLimit: { [bound in Bound]?: boolean | undefined };
styles: {
area: {
// color of the ticks in range
- selection: string
- }
+ selection: string;
+ };
brush: {
handle: {
- west: string
- east: string
- }
- }
- }
+ west: string;
+ east: string;
+ };
+ };
+ };
- dimensions: Dimensions
- margins: Margins
+ dimensions: Dimensions;
+ margins: Margins;
- interactive?: boolean
+ interactive?: boolean;
- brushLabels: (d: 'w' | 'e', x: number) => string
- brushDomain: [number, number] | undefined
- onBrushDomainChange: (domain: [number, number], mode: string | undefined) => void
+ brushLabels: (d: "w" | "e", x: number) => string;
+ brushDomain: [number, number] | undefined;
+ onBrushDomainChange: (domain: [number, number], mode: string | undefined) => void;
- zoomLevels: ZoomLevels
- showZoomButtons?: boolean
+ zoomLevels: ZoomLevels;
+ showZoomButtons?: boolean;
}
export enum Bound {
- LOWER = 'LOWER',
- UPPER = 'UPPER',
+ LOWER = "LOWER",
+ UPPER = "UPPER",
}
export interface TickDataRaw {
- tick: string | number
- liquidityGross: BigintIsh
- liquidityNet: BigintIsh
+ tick: string | number;
+ liquidityGross: BigintIsh;
+ liquidityNet: BigintIsh;
}
// Tick with fields parsed to bigints, and active liquidity computed.
export interface TickProcessed {
- tick: number
- liquidityActive: bigint
- liquidityNet: bigint
- price0: string
+ tick: number;
+ liquidityActive: bigint;
+ liquidityNet: bigint;
+ price0: string;
}
export const ZOOM_LEVELS: Record
= {
@@ -106,4 +106,4 @@ export const ZOOM_LEVELS: Record = {
min: 0.00001,
max: 20,
},
-}
+};
diff --git a/packages/widgets-internal/swap/LiquidityChartRangeInput/utils.ts b/packages/widgets-internal/swap/LiquidityChartRangeInput/utils.ts
index 0e3ecdbcd5232..d95ff85a344e0 100644
--- a/packages/widgets-internal/swap/LiquidityChartRangeInput/utils.ts
+++ b/packages/widgets-internal/swap/LiquidityChartRangeInput/utils.ts
@@ -1,9 +1,9 @@
-import { Token } from '@pancakeswap/sdk'
-import { tickToPrice } from '@pancakeswap/v3-sdk'
+import { Token } from "@pancakeswap/sdk";
+import { tickToPrice } from "@pancakeswap/v3-sdk";
-import { TickProcessed, TickDataRaw } from './types'
+import { TickProcessed, TickDataRaw } from "./types";
-const PRICE_FIXED_DIGITS = 8
+const PRICE_FIXED_DIGITS = 8;
// Computes the numSurroundingTicks above or below the active tick.
export function computeSurroundingTicks(
@@ -12,22 +12,22 @@ export function computeSurroundingTicks(
activeTickProcessed: TickProcessed,
sortedTickData: TickDataRaw[],
pivot: number,
- ascending: boolean,
+ ascending: boolean
): TickProcessed[] {
let previousTickProcessed: TickProcessed = {
...activeTickProcessed,
- }
+ };
// Iterate outwards (either up or down depending on direction) from the active tick,
// building active liquidity for every tick.
- let processedTicks: TickProcessed[] = []
+ let processedTicks: TickProcessed[] = [];
for (let i = pivot + (ascending ? 1 : -1); ascending ? i < sortedTickData.length : i >= 0; ascending ? i++ : i--) {
- const tick = Number(sortedTickData[i].tick)
+ const tick = Number(sortedTickData[i].tick);
const currentTickProcessed: TickProcessed = {
liquidityActive: previousTickProcessed.liquidityActive,
tick,
liquidityNet: BigInt(sortedTickData[i].liquidityNet),
price0: tickToPrice(token0, token1, tick).toFixed(PRICE_FIXED_DIGITS),
- }
+ };
// Update the active liquidity.
// If we are iterating ascending and we found an initialized tick we immediately apply
@@ -35,19 +35,19 @@ export function computeSurroundingTicks(
// If we are iterating descending, we don't want to apply the net liquidity until the following tick.
if (ascending) {
currentTickProcessed.liquidityActive =
- previousTickProcessed.liquidityActive + BigInt(sortedTickData[i].liquidityNet)
+ previousTickProcessed.liquidityActive + BigInt(sortedTickData[i].liquidityNet);
} else if (!ascending && previousTickProcessed.liquidityNet !== 0n) {
// We are iterating descending, so look at the previous tick and apply any net liquidity.
- currentTickProcessed.liquidityActive = previousTickProcessed.liquidityActive - previousTickProcessed.liquidityNet
+ currentTickProcessed.liquidityActive = previousTickProcessed.liquidityActive - previousTickProcessed.liquidityNet;
}
- processedTicks.push(currentTickProcessed)
- previousTickProcessed = currentTickProcessed
+ processedTicks.push(currentTickProcessed);
+ previousTickProcessed = currentTickProcessed;
}
if (!ascending) {
- processedTicks = processedTicks.reverse()
+ processedTicks = processedTicks.reverse();
}
- return processedTicks
+ return processedTicks;
}
diff --git a/packages/widgets-internal/swap/ListLogo.tsx b/packages/widgets-internal/swap/ListLogo.tsx
index 9e140e32c560a..e946185437178 100644
--- a/packages/widgets-internal/swap/ListLogo.tsx
+++ b/packages/widgets-internal/swap/ListLogo.tsx
@@ -1,24 +1,24 @@
-import { styled } from 'styled-components'
-import { useHttpLocations } from '@pancakeswap/hooks'
-import { TokenLogo } from '@pancakeswap/uikit'
+import { styled } from "styled-components";
+import { useHttpLocations } from "@pancakeswap/hooks";
+import { TokenLogo } from "@pancakeswap/uikit";
const StyledListLogo = styled(TokenLogo)<{ size: string }>`
width: ${({ size }) => size};
height: ${({ size }) => size};
-`
+`;
export function ListLogo({
logoURI,
style,
- size = '24px',
+ size = "24px",
alt,
}: {
- logoURI: string
- size?: string
- style?: React.CSSProperties
- alt?: string
+ logoURI: string;
+ size?: string;
+ style?: React.CSSProperties;
+ alt?: string;
}) {
- const srcs: string[] = useHttpLocations(logoURI)
+ const srcs: string[] = useHttpLocations(logoURI);
- return
+ return ;
}
diff --git a/packages/widgets-internal/swap/NumericalInput.tsx b/packages/widgets-internal/swap/NumericalInput.tsx
index 967549e6a3457..14b19f09d9967 100644
--- a/packages/widgets-internal/swap/NumericalInput.tsx
+++ b/packages/widgets-internal/swap/NumericalInput.tsx
@@ -1,17 +1,17 @@
-import clsx from 'clsx'
-import { memo } from 'react'
-import { useTranslation } from '@pancakeswap/localization'
-import { escapeRegExp } from '@pancakeswap/utils/escapeRegExp'
-import { SwapCSS } from '@pancakeswap/uikit'
+import clsx from "clsx";
+import { memo } from "react";
+import { useTranslation } from "@pancakeswap/localization";
+import { escapeRegExp } from "@pancakeswap/utils/escapeRegExp";
+import { SwapCSS } from "@pancakeswap/uikit";
-const inputRegex = RegExp(`^\\d*(?:\\\\[.])?\\d*$`) // match escaped "." characters via in a non-capturing group
+const inputRegex = RegExp(`^\\d*(?:\\\\[.])?\\d*$`); // match escaped "." characters via in a non-capturing group
export type NumericalInputProps = {
- value: string | number
- onUserInput: (input: string) => void
- fontSize?: string
+ value: string | number;
+ onUserInput: (input: string) => void;
+ fontSize?: string;
} & SwapCSS.InputVariants &
- Omit, 'ref' | 'onChange' | 'as'>
+ Omit, "ref" | "onChange" | "as">;
export const NumericalInput = memo(function InnerInput({
value,
@@ -24,12 +24,12 @@ export const NumericalInput = memo(function InnerInput({
...rest
}: NumericalInputProps) {
const enforcer = (nextUserInput: string) => {
- if (nextUserInput === '' || inputRegex.test(escapeRegExp(nextUserInput))) {
- onUserInput(nextUserInput)
+ if (nextUserInput === "" || inputRegex.test(escapeRegExp(nextUserInput))) {
+ onUserInput(nextUserInput);
}
- }
+ };
- const { t } = useTranslation()
+ const { t } = useTranslation();
return (
{
// replace commas with periods, because we exclusively uses period as the decimal separator
- enforcer(event.target.value.replace(/,/g, '.'))
+ enforcer(event.target.value.replace(/,/g, "."));
}}
// universal input options
inputMode="decimal"
- title={t('Token Amount')}
+ title={t("Token Amount")}
autoComplete="off"
autoCorrect="off"
// text-specific options
type="text"
pattern="^[0-9]*[.,]?[0-9]*$"
- placeholder={placeholder || '0.0'}
+ placeholder={placeholder || "0.0"}
minLength={1}
maxLength={79}
spellCheck="false"
/>
- )
-})
+ );
+});
diff --git a/packages/widgets-internal/swap/Page.tsx b/packages/widgets-internal/swap/Page.tsx
index c272fadd04f78..4a2bc13e3d775 100644
--- a/packages/widgets-internal/swap/Page.tsx
+++ b/packages/widgets-internal/swap/Page.tsx
@@ -1,17 +1,17 @@
-import { ReactNode } from 'react'
-import { AtomBox, AtomBoxProps, SwapCSS } from '@pancakeswap/uikit'
+import { ReactNode } from "react";
+import { AtomBox, AtomBoxProps, SwapCSS } from "@pancakeswap/uikit";
-import { SwapFooter } from './Footer'
+import { SwapFooter } from "./Footer";
type SwapPageProps = AtomBoxProps & {
- removePadding?: boolean
- hideFooterOnDesktop?: boolean
- noMinHeight?: boolean
- helpUrl?: string
- helpImage?: ReactNode
- externalText?: string
- externalLinkUrl?: string
-}
+ removePadding?: boolean;
+ hideFooterOnDesktop?: boolean;
+ noMinHeight?: boolean;
+ helpUrl?: string;
+ helpImage?: ReactNode;
+ externalText?: string;
+ externalLinkUrl?: string;
+};
export const SwapPage = ({
removePadding,
@@ -27,7 +27,7 @@ export const SwapPage = ({
{children}
-
+
-)
+);
diff --git a/packages/widgets-internal/swap/SwapCallbackError.tsx b/packages/widgets-internal/swap/SwapCallbackError.tsx
index e4d0c0364706d..540de4ceb4c91 100644
--- a/packages/widgets-internal/swap/SwapCallbackError.tsx
+++ b/packages/widgets-internal/swap/SwapCallbackError.tsx
@@ -1,5 +1,5 @@
-import { styled } from 'styled-components'
-import { ErrorIcon } from '@pancakeswap/uikit'
+import { styled } from "styled-components";
+import { ErrorIcon } from "@pancakeswap/uikit";
const SwapCallbackErrorInner = styled.div`
background-color: ${({ theme }) => `${theme.colors.failure33}`};
@@ -17,7 +17,7 @@ const SwapCallbackErrorInner = styled.div`
margin: 0;
font-weight: 500;
}
-`
+`;
const SwapCallbackErrorInnerAlertTriangle = styled.div`
background-color: ${({ theme }) => `${theme.colors.failure33}`};
@@ -28,7 +28,7 @@ const SwapCallbackErrorInnerAlertTriangle = styled.div`
border-radius: 12px;
min-width: 48px;
height: 48px;
-`
+`;
export function SwapCallbackError({ error }: { error: string }) {
return (
@@ -38,5 +38,5 @@ export function SwapCallbackError({ error }: { error: string }) {
{error}
- )
+ );
}
diff --git a/packages/widgets-internal/swap/SwapInfo.tsx b/packages/widgets-internal/swap/SwapInfo.tsx
index 5605527473f53..a9737abef353c 100644
--- a/packages/widgets-internal/swap/SwapInfo.tsx
+++ b/packages/widgets-internal/swap/SwapInfo.tsx
@@ -1,30 +1,30 @@
-import { useTranslation } from '@pancakeswap/localization'
-import { useIsMounted } from '@pancakeswap/hooks'
-import { PropsWithChildren, ReactNode } from 'react'
-import { AutoColumn, RowBetween, Text, TextProps, IconButton, PencilIcon } from '@pancakeswap/uikit'
+import { useTranslation } from "@pancakeswap/localization";
+import { useIsMounted } from "@pancakeswap/hooks";
+import { PropsWithChildren, ReactNode } from "react";
+import { AutoColumn, RowBetween, Text, TextProps, IconButton, PencilIcon } from "@pancakeswap/uikit";
type SwapInfoType = {
- price: ReactNode
- allowedSlippage?: number
- onSlippageClick?: () => void
- allowedSlippageSlot?: React.ReactNode
-}
+ price: ReactNode;
+ allowedSlippage?: number;
+ onSlippageClick?: () => void;
+ allowedSlippageSlot?: React.ReactNode;
+};
export const SwapInfoLabel = (props: PropsWithChildren) => (
-)
+);
export const SwapInfo = ({ allowedSlippage, price, onSlippageClick, allowedSlippageSlot }: SwapInfoType) => {
- const { t } = useTranslation()
- const isMounted = useIsMounted()
+ const { t } = useTranslation();
+ const isMounted = useIsMounted();
return (
{price}
- {typeof allowedSlippage === 'number' && (
+ {typeof allowedSlippage === "number" && (
- {t('Slippage Tolerance')}
+ {t("Slippage Tolerance")}
{onSlippageClick ? (
@@ -40,5 +40,5 @@ export const SwapInfo = ({ allowedSlippage, price, onSlippageClick, allowedSlipp
)}
- )
-}
+ );
+};
diff --git a/packages/widgets-internal/swap/SwapPendingModalContent.tsx b/packages/widgets-internal/swap/SwapPendingModalContent.tsx
index a75de653892c5..6d8b69c5fd312 100644
--- a/packages/widgets-internal/swap/SwapPendingModalContent.tsx
+++ b/packages/widgets-internal/swap/SwapPendingModalContent.tsx
@@ -1,16 +1,16 @@
-import { ReactNode } from 'react'
-import { Currency } from '@pancakeswap/sdk'
-import { Spinner, Text, Box, ArrowUpIcon, ColumnCenter, AutoColumn } from '@pancakeswap/uikit'
-import TokenTransferInfo from './TokenTransferInfo'
+import { ReactNode } from "react";
+import { Currency } from "@pancakeswap/sdk";
+import { Spinner, Text, Box, ArrowUpIcon, ColumnCenter, AutoColumn } from "@pancakeswap/uikit";
+import TokenTransferInfo from "./TokenTransferInfo";
interface SwapPendingModalContentProps {
- title: string
- showIcon?: boolean
- currencyA: Currency
- currencyB: Currency
- amountA: string
- amountB: string
- children?: ReactNode
+ title: string;
+ showIcon?: boolean;
+ currencyA: Currency;
+ currencyB: Currency;
+ amountA: string;
+ amountB: string;
+ children?: ReactNode;
}
export const SwapPendingModalContent: React.FC = ({
@@ -22,8 +22,8 @@ export const SwapPendingModalContent: React.FC = (
amountB,
children,
}) => {
- const symbolA = currencyA?.symbol
- const symbolB = currencyB?.symbol
+ const symbolA = currencyA?.symbol;
+ const symbolB = currencyB?.symbol;
return (
@@ -53,5 +53,5 @@ export const SwapPendingModalContent: React.FC = (
{children}
- )
-}
+ );
+};
diff --git a/packages/widgets-internal/swap/SwapTransactionReceiptModalContent.tsx b/packages/widgets-internal/swap/SwapTransactionReceiptModalContent.tsx
index 6af8e22818783..80e81cd5c768c 100644
--- a/packages/widgets-internal/swap/SwapTransactionReceiptModalContent.tsx
+++ b/packages/widgets-internal/swap/SwapTransactionReceiptModalContent.tsx
@@ -1,9 +1,9 @@
-import { useTranslation } from '@pancakeswap/localization'
-import { PropsWithChildren } from 'react'
-import { Text, Box, CheckmarkCircleIcon, AutoColumn } from '@pancakeswap/uikit'
+import { useTranslation } from "@pancakeswap/localization";
+import { PropsWithChildren } from "react";
+import { Text, Box, CheckmarkCircleIcon, AutoColumn } from "@pancakeswap/uikit";
export const SwapTransactionReceiptModalContent: React.FC = ({ children }) => {
- const { t } = useTranslation()
+ const { t } = useTranslation();
return (
@@ -12,10 +12,10 @@ export const SwapTransactionReceiptModalContent: React.FC = (
- {t('Transaction receipt')}
+ {t("Transaction receipt")}
{children}
- )
-}
+ );
+};
diff --git a/packages/widgets-internal/swap/SwapWidget.tsx b/packages/widgets-internal/swap/SwapWidget.tsx
index 5a50a754c4f78..fcb37f0ff705c 100644
--- a/packages/widgets-internal/swap/SwapWidget.tsx
+++ b/packages/widgets-internal/swap/SwapWidget.tsx
@@ -1,12 +1,12 @@
-import { styled } from 'styled-components'
+import { styled } from "styled-components";
-import { ButtonProps, IconButton, ArrowUpDownIcon, ArrowDownIcon } from '@pancakeswap/uikit'
-import { CurrencyInputPanel } from './CurrencyInputPanel'
-import { CurrencyInputHeader, CurrencyInputHeaderSubTitle, CurrencyInputHeaderTitle } from './CurrencyInputHeader'
-import { SwapPage as Page } from './Page'
-import { SwapFooter as Footer } from './Footer'
-import { SwapInfo as Info, SwapInfoLabel as InfoLabel } from './SwapInfo'
-import { TradePrice } from './TradePrice'
+import { ButtonProps, IconButton, ArrowUpDownIcon, ArrowDownIcon } from "@pancakeswap/uikit";
+import { CurrencyInputPanel } from "./CurrencyInputPanel";
+import { CurrencyInputHeader, CurrencyInputHeaderSubTitle, CurrencyInputHeaderTitle } from "./CurrencyInputHeader";
+import { SwapPage as Page } from "./Page";
+import { SwapFooter as Footer } from "./Footer";
+import { SwapInfo as Info, SwapInfoLabel as InfoLabel } from "./SwapInfo";
+import { TradePrice } from "./TradePrice";
const SwitchIconButton = styled(IconButton)`
box-shadow: inset 0px -2px 0px rgba(0, 0, 0, 0.1);
@@ -24,14 +24,14 @@ const SwitchIconButton = styled(IconButton)`
fill: white;
}
}
-`
+`;
const SwitchButton = (props: ButtonProps) => (
-)
+);
export {
SwitchButton,
@@ -44,4 +44,4 @@ export {
Info,
InfoLabel,
TradePrice,
-}
+};
diff --git a/packages/widgets-internal/swap/TokenRowButton.tsx b/packages/widgets-internal/swap/TokenRowButton.tsx
index 5590e7203d798..8ed5cb1ff45b3 100644
--- a/packages/widgets-internal/swap/TokenRowButton.tsx
+++ b/packages/widgets-internal/swap/TokenRowButton.tsx
@@ -1,13 +1,13 @@
-import { styled } from 'styled-components'
-import { useTranslation } from '@pancakeswap/localization'
-import { Button, RowFixed, Text, CheckmarkCircleIcon, useMatchBreakpoints } from '@pancakeswap/uikit'
+import { styled } from "styled-components";
+import { useTranslation } from "@pancakeswap/localization";
+import { Button, RowFixed, Text, CheckmarkCircleIcon, useMatchBreakpoints } from "@pancakeswap/uikit";
const CheckIcon = styled(CheckmarkCircleIcon)`
height: 16px;
width: 16px;
margin-right: 6px;
stroke: ${({ theme }) => theme.colors.success};
-`
+`;
export function TokenRowButton({
token,
@@ -16,31 +16,31 @@ export function TokenRowButton({
setImportToken,
showImportView,
}: {
- token: T
- isActive: boolean
- isAdded: boolean
- setImportToken: (token: T) => void
- showImportView: () => void
+ token: T;
+ isActive: boolean;
+ isAdded: boolean;
+ setImportToken: (token: T) => void;
+ showImportView: () => void;
}) {
- const { t } = useTranslation()
- const { isMobile } = useMatchBreakpoints()
+ const { t } = useTranslation();
+ const { isMobile } = useMatchBreakpoints();
return !isActive && !isAdded ? (
{
if (setImportToken) {
- setImportToken(token)
+ setImportToken(token);
}
- showImportView()
+ showImportView();
}}
>
- {t('Import')}
+ {t("Import")}
) : (
-
+
Active
- )
+ );
}
diff --git a/packages/widgets-internal/swap/TokenTransferInfo.tsx b/packages/widgets-internal/swap/TokenTransferInfo.tsx
index 410dc54483a87..53d385a28d9d5 100644
--- a/packages/widgets-internal/swap/TokenTransferInfo.tsx
+++ b/packages/widgets-internal/swap/TokenTransferInfo.tsx
@@ -1,13 +1,14 @@
-import { Currency } from '@pancakeswap/sdk'
-import { Text, Box, Flex, ArrowForwardIcon, CurrencyLogo } from '@pancakeswap/uikit'
+import { Currency } from "@pancakeswap/sdk";
+import { Text, Box, Flex, ArrowForwardIcon } from "@pancakeswap/uikit";
+import { CurrencyLogo } from "../components/CurrencyLogo";
interface TokenTransferInfoProps {
- symbolA: string
- symbolB: string
- amountA: string
- amountB: string
- currencyA: Currency
- currencyB: Currency
+ symbolA: string;
+ symbolB: string;
+ amountA: string;
+ amountB: string;
+ currencyA: Currency;
+ currencyB: Currency;
}
const TokenTransferInfo: React.FC = ({
@@ -32,7 +33,7 @@ const TokenTransferInfo: React.FC = ({
- )
-}
+ );
+};
-export default TokenTransferInfo
+export default TokenTransferInfo;
diff --git a/packages/widgets-internal/swap/TradePrice.tsx b/packages/widgets-internal/swap/TradePrice.tsx
index 716000b27f2cb..9debcd8a40584 100644
--- a/packages/widgets-internal/swap/TradePrice.tsx
+++ b/packages/widgets-internal/swap/TradePrice.tsx
@@ -1,23 +1,23 @@
-import { Price, Currency } from '@pancakeswap/swap-sdk-core'
-import { formatPrice } from '@pancakeswap/utils/formatFractions'
-import { useState } from 'react'
-import { AtomBox, SyncAltIcon, AutoRenewIcon, Text, Loading, SwapCSS } from '@pancakeswap/uikit'
+import { Price, Currency } from "@pancakeswap/swap-sdk-core";
+import { formatPrice } from "@pancakeswap/utils/formatFractions";
+import { useState } from "react";
+import { AtomBox, SyncAltIcon, AutoRenewIcon, Text, Loading, SwapCSS } from "@pancakeswap/uikit";
interface TradePriceProps {
- price?: Price
- loading?: boolean
+ price?: Price;
+ loading?: boolean;
}
export function TradePrice({ price, loading }: TradePriceProps) {
- const [showInverted, setShowInverted] = useState(false)
+ const [showInverted, setShowInverted] = useState(false);
- const formattedPrice = showInverted ? formatPrice(price, 6) : formatPrice(price?.invert(), 6)
- const show = Boolean(price?.baseCurrency && price?.quoteCurrency)
+ const formattedPrice = showInverted ? formatPrice(price, 6) : formatPrice(price?.invert(), 6);
+ const show = Boolean(price?.baseCurrency && price?.quoteCurrency);
return (
{show ? (
<>
@@ -35,8 +35,8 @@ export function TradePrice({ price, loading }: TradePriceProps) {
)}
>
) : (
- '-'
+ "-"
)}
- )
+ );
}
diff --git a/packages/widgets-internal/swap/TransactionErrorContent.tsx b/packages/widgets-internal/swap/TransactionErrorContent.tsx
index 1f27086d4d1f6..09e7233cd4d22 100644
--- a/packages/widgets-internal/swap/TransactionErrorContent.tsx
+++ b/packages/widgets-internal/swap/TransactionErrorContent.tsx
@@ -1,34 +1,34 @@
-import { ReactElement } from 'react'
-import { useTranslation } from '@pancakeswap/localization'
-import { styled } from 'styled-components'
-import { AutoColumn, ErrorIcon, Text, Flex, Button } from '@pancakeswap/uikit'
+import { ReactElement } from "react";
+import { useTranslation } from "@pancakeswap/localization";
+import { styled } from "styled-components";
+import { AutoColumn, ErrorIcon, Text, Flex, Button } from "@pancakeswap/uikit";
const Wrapper = styled.div`
width: 100%;
-`
+`;
export function TransactionErrorContent({
message,
onDismiss,
}: {
- message: ReactElement | string
- onDismiss?: () => void
+ message: ReactElement | string;
+ onDismiss?: () => void;
}) {
- const { t } = useTranslation()
+ const { t } = useTranslation();
return (
-
+
{message}
{onDismiss ? (
- {t('Dismiss')}
+ {t("Dismiss")}
) : null}
- )
+ );
}
diff --git a/packages/widgets-internal/swap/confirmPriceImpactWithoutFee.ts b/packages/widgets-internal/swap/confirmPriceImpactWithoutFee.ts
index b58e8894edd65..a3704f723b312 100644
--- a/packages/widgets-internal/swap/confirmPriceImpactWithoutFee.ts
+++ b/packages/widgets-internal/swap/confirmPriceImpactWithoutFee.ts
@@ -1,5 +1,5 @@
-import { Percent } from '@pancakeswap/swap-sdk-core'
-import { ContextApi } from '@pancakeswap/localization'
+import { Percent } from "@pancakeswap/swap-sdk-core";
+import { ContextApi } from "@pancakeswap/localization";
/**
* Given the price impact, get user confirmation.
@@ -11,10 +11,10 @@ export function confirmPriceImpactWithoutFee(
priceImpactWithoutFee: Percent,
priceImpactWithoutFeeConfirmMin: Percent,
allowedPriceImpactHigh: Percent,
- t: ContextApi['t'],
+ t: ContextApi["t"]
): boolean {
if (!priceImpactWithoutFee.lessThan(priceImpactWithoutFeeConfirmMin)) {
- const confirmWord = 'confirm'
+ const confirmWord = "confirm";
return (
// eslint-disable-next-line no-alert
window.prompt(
@@ -23,21 +23,21 @@ export function confirmPriceImpactWithoutFee(
{
amount: priceImpactWithoutFeeConfirmMin.toFixed(0),
word: confirmWord,
- },
- ),
+ }
+ )
) === confirmWord
- )
+ );
}
if (!priceImpactWithoutFee.lessThan(allowedPriceImpactHigh)) {
// eslint-disable-next-line no-alert
return window.confirm(
t(
- 'This swap has a price impact of at least %amount%%. Please confirm that you would like to continue with this swap.',
+ "This swap has a price impact of at least %amount%%. Please confirm that you would like to continue with this swap.",
{
amount: allowedPriceImpactHigh.toFixed(0),
- },
- ),
- )
+ }
+ )
+ );
}
- return true
+ return true;
}
diff --git a/packages/widgets-internal/swap/index.ts b/packages/widgets-internal/swap/index.ts
index 36e493f52b19c..7715306d2f1f8 100644
--- a/packages/widgets-internal/swap/index.ts
+++ b/packages/widgets-internal/swap/index.ts
@@ -1,15 +1,15 @@
-export * from './confirmPriceImpactWithoutFee'
-export * from './ExpertModal'
-export * from './ImportList'
-export * from './ListLogo'
-export * from './NumericalInput'
-export * from './SwapCallbackError'
-export * as Swap from './SwapWidget'
-export * from './TransactionErrorContent'
-export * from './ConfirmationModalContent'
-export * from './ConfirmationPendingContent'
-export * from './withCurrencyLogo'
-export * from './TokenRowButton'
-export * from './ApproveModalContent'
-export * from './SwapPendingModalContent'
-export * from './SwapTransactionReceiptModalContent'
+export * from "./confirmPriceImpactWithoutFee";
+export * from "./ExpertModal";
+export * from "./ImportList";
+export * from "./ListLogo";
+export * from "./NumericalInput";
+export * from "./SwapCallbackError";
+export * as Swap from "./SwapWidget";
+export * from "./TransactionErrorContent";
+export * from "./ConfirmationModalContent";
+export * from "./ConfirmationPendingContent";
+export * from "./withCurrencyLogo";
+export * from "./TokenRowButton";
+export * from "./ApproveModalContent";
+export * from "./SwapPendingModalContent";
+export * from "./SwapTransactionReceiptModalContent";
diff --git a/packages/widgets-internal/swap/withCurrencyLogo.tsx b/packages/widgets-internal/swap/withCurrencyLogo.tsx
index 06bd2389ed432..518cc259f5608 100644
--- a/packages/widgets-internal/swap/withCurrencyLogo.tsx
+++ b/packages/widgets-internal/swap/withCurrencyLogo.tsx
@@ -1,9 +1,9 @@
-import { CSSProperties, ReactElement } from 'react'
-import { BaseCurrency } from '@pancakeswap/swap-sdk-core'
-import { useTranslation } from '@pancakeswap/localization'
-import { styled } from 'styled-components'
-import { AutoColumn, AutoRow, Button, Flex, RowFixed, Text, useMatchBreakpoints } from '@pancakeswap/uikit'
-import { ListLogo } from './ListLogo'
+import { CSSProperties, ReactElement } from "react";
+import { BaseCurrency } from "@pancakeswap/swap-sdk-core";
+import { useTranslation } from "@pancakeswap/localization";
+import { styled } from "styled-components";
+import { AutoColumn, AutoRow, Button, Flex, RowFixed, Text, useMatchBreakpoints } from "@pancakeswap/uikit";
+import { ListLogo } from "./ListLogo";
const TokenSection = styled.div<{ dim?: boolean }>`
padding: 4px 20px;
@@ -13,12 +13,12 @@ const TokenSection = styled.div<{ dim?: boolean }>`
grid-gap: 10px;
align-items: center;
- opacity: ${({ dim }) => (dim ? '0.4' : '1')};
+ opacity: ${({ dim }) => (dim ? "0.4" : "1")};
${({ theme }) => theme.mediaQueries.md} {
grid-gap: 16px;
}
-`
+`;
const NameOverflow = styled(Flex)`
white-space: nowrap;
@@ -27,16 +27,16 @@ const NameOverflow = styled(Flex)`
text-overflow: ellipsis;
max-width: 210px;
gap: 8px;
-`
+`;
interface CurrencyLogoPropsType {
- currency?: T
- size?: string
- style?: React.CSSProperties
+ currency?: T;
+ size?: string;
+ style?: React.CSSProperties;
}
export function withCurrencyLogo(
- CurrencyLogo: (props: CurrencyLogoPropsType) => ReactElement,
+ CurrencyLogo: (props: CurrencyLogoPropsType) => ReactElement
) {
return ({
token,
@@ -47,30 +47,30 @@ export function withCurrencyLogo(
isActive,
children,
}: {
- token: T
- style?: CSSProperties
- dim?: boolean
- onCurrencySelect?: (currency: T) => void
- list: any
- isActive: boolean
- children: ReactElement
+ token: T;
+ style?: CSSProperties;
+ dim?: boolean;
+ onCurrencySelect?: (currency: T) => void;
+ list: any;
+ isActive: boolean;
+ children: ReactElement;
}) => {
- const { t } = useTranslation()
- const { isMobile } = useMatchBreakpoints()
+ const { t } = useTranslation();
+ const { isMobile } = useMatchBreakpoints();
return (
{
if (isActive) {
- onCurrencySelect?.(token)
+ onCurrencySelect?.(token);
}
}}
>
-
-
+
+