diff --git a/apps/analytics/components/Table/TableFilters/TableFiltersSearchToken.tsx b/apps/analytics/components/Table/TableFilters/TableFiltersSearchToken.tsx index aa13e2992..e839b6c13 100644 --- a/apps/analytics/components/Table/TableFilters/TableFiltersSearchToken.tsx +++ b/apps/analytics/components/Table/TableFilters/TableFiltersSearchToken.tsx @@ -48,7 +48,6 @@ export const TableFiltersSearchToken: FC = () => {
- setQuery(e.currentTarget.value)} @@ -58,6 +57,7 @@ export const TableFiltersSearchToken: FC = () => { /> { {
{ const { selectedNetworks, setFilters } = usePoolFilters() return ( -
- +
+
classNames( @@ -30,8 +30,8 @@ export const TableSection: FC = () => { Stats
- - + +
{ />
-
- + + - -
- + + +
) } diff --git a/apps/analytics/package.json b/apps/analytics/package.json index d8ceb14e6..fcd9d8619 100644 --- a/apps/analytics/package.json +++ b/apps/analytics/package.json @@ -18,7 +18,7 @@ "@ethersproject/experimental": "^5.7.0", "@ethersproject/providers": "^5.7.2", "@ethersproject/solidity": "^5.7.0", - "@headlessui/react": "1.7.17", + "@headlessui/react": "2.1.2", "@heroicons/react": "2.1.5", "@lingui/core": "4.11.3", "@lingui/macro": "4.11.3", diff --git a/apps/analytics/tailwind.config.js b/apps/analytics/tailwind.config.js index c523501f2..4a3a2c894 100644 --- a/apps/analytics/tailwind.config.js +++ b/apps/analytics/tailwind.config.js @@ -7,7 +7,6 @@ const tailwindConfig = { './components/**/*.{js,ts,jsx,tsx}', '../../packages/wagmi/{components,systems}/**/*.{js,ts,jsx,tsx}', '../../packages/compat/{components,systems}/**/*.{js,ts,jsx,tsx}', - '../../packages/parachains-impl/**/{components,systems}/**/*.{js,ts,jsx,tsx}', '../../packages/ui/{,!(node_modules)/**/}*.{js,ts,jsx,tsx}', ], theme: { diff --git a/apps/gauge/package.json b/apps/gauge/package.json index cb8cdde29..24ce3158f 100644 --- a/apps/gauge/package.json +++ b/apps/gauge/package.json @@ -9,7 +9,7 @@ "clean": "rm -rf .turbo && rm -rf node_modules && rm -rf .next && rm -rf .swc && rm -rf .graphclient" }, "dependencies": { - "@headlessui/react": "1.7.17", + "@headlessui/react": "2.1.2", "@heroicons/react": "2.1.5", "@lingui/core": "4.11.3", "@lingui/macro": "4.11.3", diff --git a/apps/market/components/MarketSection/MarketActions/MarketAdd/MarketAddZap.tsx b/apps/market/components/MarketSection/MarketActions/MarketAdd/MarketAddZap.tsx index 587a3d3de..d50655f9a 100644 --- a/apps/market/components/MarketSection/MarketActions/MarketAdd/MarketAddZap.tsx +++ b/apps/market/components/MarketSection/MarketActions/MarketAdd/MarketAddZap.tsx @@ -73,7 +73,6 @@ export const MarketAddZap: FC = ({ market }) => { )} - ) } @@ -181,6 +180,7 @@ export const MarketAddZapWidget: FC = ({ { return ( <> { { /> { {({ open }) => (
- @@ -79,9 +79,9 @@ export const SlippageToleranceDisclosure: FC = () => {
- - + { leaveTo="transform max-h-0" unmount={false} > - + updateSlippageToleranceType(index === 0 ? 'auto' : 'custom')} selectedIndex={slippageToleranceType === 'auto' ? 0 : 1} @@ -123,7 +123,7 @@ export const SlippageToleranceDisclosure: FC = () => { - + )} diff --git a/apps/market/package.json b/apps/market/package.json index eaca24695..8c5db7597 100644 --- a/apps/market/package.json +++ b/apps/market/package.json @@ -9,7 +9,7 @@ "clean": "rm -rf .turbo && rm -rf node_modules && rm -rf .next && rm -rf .swc && rm -rf .graphclient" }, "dependencies": { - "@headlessui/react": "1.7.17", + "@headlessui/react": "2.1.2", "@heroicons/react": "2.1.5", "@lingui/core": "4.11.3", "@lingui/macro": "4.11.3", diff --git a/apps/pool/components/AddSection/AddSectionStable.tsx b/apps/pool/components/AddSection/AddSectionStable.tsx index 239b0ddf3..8dec2c220 100644 --- a/apps/pool/components/AddSection/AddSectionStable.tsx +++ b/apps/pool/components/AddSection/AddSectionStable.tsx @@ -1,4 +1,4 @@ -import { Disclosure, Transition } from '@headlessui/react' +import { Disclosure, DisclosurePanel, Transition } from '@headlessui/react' import { InformationCircleIcon, PlusIcon } from '@heroicons/react/24/solid' import { Checker, Web3Input, useStableSwapWithBase } from '@zenlink-interface/compat' import type { Token } from '@zenlink-interface/currency' @@ -78,6 +78,7 @@ export const AddSectionStable: FC<{ pool: StableSwap }> = ({ pool }) => { )} /> = ({ pool }) => { leaveTo="transform max-h-0" unmount={false} > - + {!tokens.length && (
@@ -146,7 +147,7 @@ export const AddSectionStable: FC<{ pool: StableSwap }> = ({ pool }) => {
-
+
)} diff --git a/apps/pool/components/AddSection/AddSectionWidgetStandard.tsx b/apps/pool/components/AddSection/AddSectionWidgetStandard.tsx index 6187a9557..0de16cc7d 100644 --- a/apps/pool/components/AddSection/AddSectionWidgetStandard.tsx +++ b/apps/pool/components/AddSection/AddSectionWidgetStandard.tsx @@ -1,4 +1,4 @@ -import { Disclosure, Transition } from '@headlessui/react' +import { Disclosure, DisclosureButton, DisclosurePanel, Transition } from '@headlessui/react' import { ChevronDownIcon } from '@heroicons/react/20/solid' import { PlusIcon } from '@heroicons/react/24/solid' import type { ParachainId } from '@zenlink-interface/chain' @@ -55,7 +55,7 @@ export const AddSectionWidgetStandard: FC = ({
- +
= ({ />
-
+
) @@ -78,6 +78,7 @@ export const AddSectionWidgetStandard: FC = ({ )} = ({ leaveTo="transform max-h-0" unmount={false} > - + = ({ />
{children}
-
+
)} diff --git a/apps/pool/components/NewPositionSection/SelectNetworkWidget.tsx b/apps/pool/components/NewPositionSection/SelectNetworkWidget.tsx index 3888539e5..b96195001 100644 --- a/apps/pool/components/NewPositionSection/SelectNetworkWidget.tsx +++ b/apps/pool/components/NewPositionSection/SelectNetworkWidget.tsx @@ -1,4 +1,4 @@ -import { Disclosure, Transition } from '@headlessui/react' +import { Disclosure, DisclosureButton, DisclosurePanel, Transition } from '@headlessui/react' import type { ParachainId } from '@zenlink-interface/chain' import chains from '@zenlink-interface/chain' import { Network, NetworkIcon, Typography, classNames } from '@zenlink-interface/ui' @@ -21,15 +21,16 @@ export const SelectNetworkWidget: FC = memo(function S {() => ( <> - +
1. Select Network} />
-
+ = memo(function S leaveTo="transform max-h-0" unmount={false} > - +
Selected:{' '} @@ -56,7 +57,7 @@ export const SelectNetworkWidget: FC = memo(function S selectedNetworks={[selectedNetwork]} />
-
+
)} diff --git a/apps/pool/components/NewPositionSection/SelectPoolTypeWidget.tsx b/apps/pool/components/NewPositionSection/SelectPoolTypeWidget.tsx index 26d2fce1f..96209c5e8 100644 --- a/apps/pool/components/NewPositionSection/SelectPoolTypeWidget.tsx +++ b/apps/pool/components/NewPositionSection/SelectPoolTypeWidget.tsx @@ -1,4 +1,4 @@ -import { Disclosure, Transition } from '@headlessui/react' +import { Disclosure, DisclosureButton, DisclosurePanel, Transition } from '@headlessui/react' import type { ParachainId } from '@zenlink-interface/chain' import { PoolFinderType } from '@zenlink-interface/compat' import { Tab, Tooltip, Typography } from '@zenlink-interface/ui' @@ -50,6 +50,7 @@ export const SelectPoolTypeWidget: FC = memo( )} = memo( leaveTo="transform max-h-0" unmount={false} > - +
- +
@@ -74,8 +75,8 @@ export const SelectPoolTypeWidget: FC = memo(
-
- + +
@@ -86,11 +87,11 @@ export const SelectPoolTypeWidget: FC = memo(
-
+
-
+
)} diff --git a/apps/pool/components/NewPositionSection/SelectStablePoolWidget.tsx b/apps/pool/components/NewPositionSection/SelectStablePoolWidget.tsx index 3cfdb4330..039cadd04 100644 --- a/apps/pool/components/NewPositionSection/SelectStablePoolWidget.tsx +++ b/apps/pool/components/NewPositionSection/SelectStablePoolWidget.tsx @@ -1,4 +1,4 @@ -import { Disclosure, RadioGroup, Transition } from '@headlessui/react' +import { Description, Disclosure, DisclosureButton, DisclosurePanel, Label, Radio, RadioGroup, Transition } from '@headlessui/react' import { CheckCircleIcon } from '@heroicons/react/24/solid' import { Trans } from '@lingui/macro' import { Token } from '@zenlink-interface/currency' @@ -21,15 +21,16 @@ export const SelectStablePoolWidget: FC = memo( {() => ( <> - +
3. Select Pool} /> {!selectedStablePool ? : selectedStablePool?.name}
-
+ = memo( leaveTo="transform max-h-0" unmount={false} > - +
{stablePools?.map(pool => ( - classNames( checked ? 'bg-slate-300/75 dark:bg-slate-600/75' : 'bg-slate-100 dark:bg-slate-900', 'relative flex cursor-pointer hover:bg-slate-300 dark:hover:bg-slate-600 rounded-xl px-5 py-4 shadow-sm border border-slate-500/20', @@ -54,7 +55,7 @@ export const SelectStablePoolWidget: FC = memo( {({ checked }) => (
- + - + + {pool.tokens.map(token => token.symbol).join(' / ')} - +
{checked && ( )}
)} -
+ ))}
-
+
)} diff --git a/apps/pool/components/PoolSection/PoolChart.tsx b/apps/pool/components/PoolSection/PoolChart.tsx index 94cce6013..fc099db10 100644 --- a/apps/pool/components/PoolSection/PoolChart.tsx +++ b/apps/pool/components/PoolSection/PoolChart.tsx @@ -4,7 +4,7 @@ import type { FC } from 'react' import { useCallback, useEffect, useMemo, useState } from 'react' import resolveConfig from 'tailwindcss/resolveConfig' import type { EChartsOption } from 'echarts-for-react/lib/types' -import { AppearOnMount, Typography, classNames } from '@zenlink-interface/ui' +import { Typography, classNames } from '@zenlink-interface/ui' import ReactECharts from 'echarts-for-react' import type { Pool } from '@zenlink-interface/graph-client' import { POOL_TYPE } from '@zenlink-interface/graph-client' @@ -303,7 +303,7 @@ export const PoolChart: FC = ({ pool }) => { {xData.length && ( - {format(new Date(xData[xData.length - 1] * 1000), 'dd MMM yyyy HH:mm')} + {format(new Date(xData[xData.length - 1] * 1000), 'dd MMM yyyy HH:mm')} )} diff --git a/apps/pool/components/PoolsSection/Tables/TableFilters/TableFiltersSearchToken.tsx b/apps/pool/components/PoolsSection/Tables/TableFilters/TableFiltersSearchToken.tsx index ddd09d0e8..0d3296d94 100644 --- a/apps/pool/components/PoolsSection/Tables/TableFilters/TableFiltersSearchToken.tsx +++ b/apps/pool/components/PoolsSection/Tables/TableFilters/TableFiltersSearchToken.tsx @@ -53,6 +53,7 @@ export const TableFiltersSearchToken: FC = () => { /> = ({ pool }) => { <> = ({ pool }) => { leaveTo="transform max-h-0" unmount={false} > - +
@@ -227,6 +228,7 @@ export const RemoveSectionStable: FC = ({ pool }) => {
= ({ pool }) => { ))}
- = ({ pool }) => {
-
+
)} diff --git a/apps/pool/components/RemoveSection/RemoveSectionWidgetStandard.tsx b/apps/pool/components/RemoveSection/RemoveSectionWidgetStandard.tsx index 2c0a30bda..978b2caee 100644 --- a/apps/pool/components/RemoveSection/RemoveSectionWidgetStandard.tsx +++ b/apps/pool/components/RemoveSection/RemoveSectionWidgetStandard.tsx @@ -1,4 +1,4 @@ -import { Disclosure, Transition } from '@headlessui/react' +import { Disclosure, DisclosurePanel, Transition } from '@headlessui/react' import { ChevronDownIcon } from '@heroicons/react/20/solid' import type { ParachainId } from '@zenlink-interface/chain' import { useAccount } from '@zenlink-interface/compat' @@ -102,10 +102,9 @@ export const RemoveSectionWidgetStandard: FC =
) - : ( - - )} + : } = leaveTo="transform max-h-0" unmount={false} > - +
@@ -166,6 +165,7 @@ export const RemoveSectionWidgetStandard: FC =
= {children}
- + )} diff --git a/apps/pool/components/SettingsOverlay/SettingsOverlay.tsx b/apps/pool/components/SettingsOverlay/SettingsOverlay.tsx index dbf5559e9..98b0204b1 100644 --- a/apps/pool/components/SettingsOverlay/SettingsOverlay.tsx +++ b/apps/pool/components/SettingsOverlay/SettingsOverlay.tsx @@ -15,6 +15,7 @@ interface SettingsOverlayProps { export const SettingsOverlay: FC = ({ variant = 'overlay', chainId }) => { const [open, setOpen] = useState(false) + return ( <> setOpen(true)}> diff --git a/apps/pool/components/SettingsOverlay/SlippageToleranceDisclosure.tsx b/apps/pool/components/SettingsOverlay/SlippageToleranceDisclosure.tsx index 76e951000..263eaa89a 100644 --- a/apps/pool/components/SettingsOverlay/SlippageToleranceDisclosure.tsx +++ b/apps/pool/components/SettingsOverlay/SlippageToleranceDisclosure.tsx @@ -1,4 +1,4 @@ -import { Disclosure, Transition } from '@headlessui/react' +import { Disclosure, DisclosureButton, DisclosurePanel, Transition } from '@headlessui/react' import { AdjustmentsVerticalIcon, ChevronRightIcon, InformationCircleIcon } from '@heroicons/react/24/outline' import { Trans } from '@lingui/macro' import { useSettings } from '@zenlink-interface/shared' @@ -13,7 +13,7 @@ export const SlippageToleranceDisclosure: FC = () => { {({ open }) => (
- @@ -61,9 +61,9 @@ export const SlippageToleranceDisclosure: FC = () => {
- - + { leaveTo="transform max-h-0" unmount={false} > - + updateSlippageToleranceType(index === 0 ? 'auto' : 'custom')} selectedIndex={slippageToleranceType === 'auto' ? 0 : 1} @@ -105,7 +105,7 @@ export const SlippageToleranceDisclosure: FC = () => { - +
)} diff --git a/apps/pool/components/StakeSection/StakeSectionWidgetStandard.tsx b/apps/pool/components/StakeSection/StakeSectionWidgetStandard.tsx index 0639cb029..c5a9a1dca 100644 --- a/apps/pool/components/StakeSection/StakeSectionWidgetStandard.tsx +++ b/apps/pool/components/StakeSection/StakeSectionWidgetStandard.tsx @@ -1,4 +1,4 @@ -import { Disclosure, Transition } from '@headlessui/react' +import { Disclosure, DisclosureButton, DisclosurePanel, Transition } from '@headlessui/react' import { ChevronDownIcon } from '@heroicons/react/20/solid' import type { ParachainId } from '@zenlink-interface/chain' import { Approve, Checker, useAccount, useStakeLiquidityStandardReview } from '@zenlink-interface/compat' @@ -74,7 +74,7 @@ export const StakeSectionWidgetStandard: FC = ( ? ( Stake Liquidity}>
- +
= ( />
-
+
) @@ -97,6 +97,7 @@ export const StakeSectionWidgetStandard: FC = ( Stake Liquidity} /> )} = ( leaveTo="transform max-h-0" unmount={false} > - +
Stake your liquidity tokens to receive incentive rewards on top of your pool fee rewards @@ -132,7 +133,7 @@ export const StakeSectionWidgetStandard: FC = ( No farms found )} - + )} @@ -178,6 +179,7 @@ export const StakeSectionWidgetStandardItem: FC
diff --git a/apps/pool/components/UnStakeSection/UnStakeSectionWidgetStandard.tsx b/apps/pool/components/UnStakeSection/UnStakeSectionWidgetStandard.tsx index dad837215..1213a1c61 100644 --- a/apps/pool/components/UnStakeSection/UnStakeSectionWidgetStandard.tsx +++ b/apps/pool/components/UnStakeSection/UnStakeSectionWidgetStandard.tsx @@ -94,6 +94,7 @@ export const UnStakeSectionWidgetStandard: FC UnStake Liquidity} /> )} leave="transition-[max-height] duration-250 ease-in-out" leaveFrom="transform max-h-[380px]" leaveTo="transform max-h-0" + show unmount={false} > @@ -173,6 +175,7 @@ export const UnStakeSectionWidgetStandardItem: FC
diff --git a/apps/pool/package.json b/apps/pool/package.json index 96d9418be..1b9ae0e50 100644 --- a/apps/pool/package.json +++ b/apps/pool/package.json @@ -18,7 +18,7 @@ "@ethersproject/experimental": "^5.7.0", "@ethersproject/providers": "^5.7.2", "@ethersproject/solidity": "^5.7.0", - "@headlessui/react": "1.7.17", + "@headlessui/react": "2.1.2", "@heroicons/react": "2.1.5", "@lingui/core": "4.11.3", "@lingui/macro": "4.11.3", diff --git a/apps/pool/tailwind.config.js b/apps/pool/tailwind.config.js index c523501f2..4a3a2c894 100644 --- a/apps/pool/tailwind.config.js +++ b/apps/pool/tailwind.config.js @@ -7,7 +7,6 @@ const tailwindConfig = { './components/**/*.{js,ts,jsx,tsx}', '../../packages/wagmi/{components,systems}/**/*.{js,ts,jsx,tsx}', '../../packages/compat/{components,systems}/**/*.{js,ts,jsx,tsx}', - '../../packages/parachains-impl/**/{components,systems}/**/*.{js,ts,jsx,tsx}', '../../packages/ui/{,!(node_modules)/**/}*.{js,ts,jsx,tsx}', ], theme: { diff --git a/apps/referrals/package.json b/apps/referrals/package.json index fc4eb78e0..29f38afb2 100644 --- a/apps/referrals/package.json +++ b/apps/referrals/package.json @@ -12,7 +12,7 @@ "@ethersproject/address": "^5.7.0", "@ethersproject/constants": "^5.7.0", "@ethersproject/providers": "^5.7.2", - "@headlessui/react": "1.7.17", + "@headlessui/react": "2.1.2", "@heroicons/react": "2.1.5", "@lingui/core": "4.11.3", "@lingui/macro": "4.11.3", diff --git a/apps/swap/components/CrossTransfer/NetworkSelector/NetworkSelectorMenu.tsx b/apps/swap/components/CrossTransfer/NetworkSelector/NetworkSelectorMenu.tsx index e338bc01b..29bf11549 100644 --- a/apps/swap/components/CrossTransfer/NetworkSelector/NetworkSelectorMenu.tsx +++ b/apps/swap/components/CrossTransfer/NetworkSelector/NetworkSelectorMenu.tsx @@ -20,6 +20,7 @@ export function NetworkSelectorMenu({ <> {typeof children === 'function' ? children({ close, open }) : children} = ({ trade }) => { return (
-
+
= ({ chainId }) => { const [open, setOpen] = useState(false) + return ( <>
diff --git a/apps/swap/components/SettingsOverlay/SlippageToleranceDisclosure.tsx b/apps/swap/components/SettingsOverlay/SlippageToleranceDisclosure.tsx index c6cdaffc5..506476955 100644 --- a/apps/swap/components/SettingsOverlay/SlippageToleranceDisclosure.tsx +++ b/apps/swap/components/SettingsOverlay/SlippageToleranceDisclosure.tsx @@ -1,4 +1,4 @@ -import { Disclosure, Transition } from '@headlessui/react' +import { Disclosure, DisclosureButton, DisclosurePanel, Transition } from '@headlessui/react' import { ChevronRightIcon, InformationCircleIcon } from '@heroicons/react/24/outline' import { Trans, t } from '@lingui/macro' import { useSettings } from '@zenlink-interface/shared' @@ -15,7 +15,7 @@ export const SlippageToleranceDisclosure: FC = () => { {({ open }) => (
- @@ -68,7 +68,7 @@ export const SlippageToleranceDisclosure: FC = () => {
{
- - - - + + + updateSlippageToleranceType(index === 0 ? 'auto' : 'custom')} selectedIndex={slippageToleranceType === 'auto' ? 0 : 1} @@ -123,7 +113,7 @@ export const SlippageToleranceDisclosure: FC = () => { - +
)} diff --git a/apps/swap/components/SwapStatsDisclosure/SwapStatsDisclosure.tsx b/apps/swap/components/SwapStatsDisclosure/SwapStatsDisclosure.tsx index ae9f883df..0156753d1 100644 --- a/apps/swap/components/SwapStatsDisclosure/SwapStatsDisclosure.tsx +++ b/apps/swap/components/SwapStatsDisclosure/SwapStatsDisclosure.tsx @@ -1,4 +1,4 @@ -import { Disclosure, Transition } from '@headlessui/react' +import { Disclosure, DisclosureButton, DisclosurePanel, Transition } from '@headlessui/react' import { InformationCircleIcon } from '@heroicons/react/24/outline' import { ChevronDownIcon } from '@heroicons/react/20/solid' import { Percent } from '@zenlink-interface/math' @@ -78,18 +78,10 @@ export const SwapStatsDisclosure: FC = () => { {showRoute ? t`Hide` : t`Show`} {trade?.version === TradeVersion.LEGACY && ( - - + +
+ +
)} @@ -98,6 +90,7 @@ export const SwapStatsDisclosure: FC = () => { return ( <> {
)} - + { height={24} width={24} /> - +
- - + {stats} - + )} diff --git a/apps/swap/package.json b/apps/swap/package.json index 28d2cf22b..5ea54778f 100644 --- a/apps/swap/package.json +++ b/apps/swap/package.json @@ -12,7 +12,7 @@ "@ethersproject/address": "^5.7.0", "@ethersproject/constants": "^5.7.0", "@ethersproject/providers": "^5.7.2", - "@headlessui/react": "1.7.17", + "@headlessui/react": "2.1.2", "@heroicons/react": "2.1.5", "@lingui/core": "4.11.3", "@lingui/macro": "4.11.3", diff --git a/apps/swap/pages/_app.tsx b/apps/swap/pages/_app.tsx index e9e89ee8c..9c7066b49 100644 --- a/apps/swap/pages/_app.tsx +++ b/apps/swap/pages/_app.tsx @@ -31,12 +31,6 @@ const store = configureStore({ }, }) -declare global { - interface Window { - dataLayer: Record[] - } -} - const queryClient = new QueryClient() const MyApp: FC = ({ Component, pageProps }) => { diff --git a/apps/swap/tailwind.config.js b/apps/swap/tailwind.config.js index 9fd0a7a66..1947dea2e 100644 --- a/apps/swap/tailwind.config.js +++ b/apps/swap/tailwind.config.js @@ -5,7 +5,6 @@ const tailwindConfig = { './components/**/*.{js,ts,jsx,tsx}', '../../packages/wagmi/{components,systems}/**/*.{js,ts,jsx,tsx}', '../../packages/compat/{components,systems}/**/*.{js,ts,jsx,tsx}', - '../../packages/parachains-impl/**/{components,systems}/**/*.{js,ts,jsx,tsx}', '../../packages/ui/{,!(node_modules)/**/}*.{js,ts,jsx,tsx}', ], darkMode: 'class', diff --git a/packages/compat/package.json b/packages/compat/package.json index 56cdfc136..94d0f4403 100644 --- a/packages/compat/package.json +++ b/packages/compat/package.json @@ -24,7 +24,7 @@ }, "dependencies": { "@ethersproject/constants": "^5.7.0", - "@headlessui/react": "1.7.17", + "@headlessui/react": "2.1.2", "@heroicons/react": "2.1.5", "@lingui/core": "4.11.3", "@lingui/macro": "4.11.3", diff --git a/packages/parachains-impl/amplitude/package.json b/packages/parachains-impl/amplitude/package.json index 03a1177a4..1609f26f7 100644 --- a/packages/parachains-impl/amplitude/package.json +++ b/packages/parachains-impl/amplitude/package.json @@ -22,7 +22,7 @@ "react-dom": "^18.3.1" }, "dependencies": { - "@headlessui/react": "1.7.17", + "@headlessui/react": "2.1.2", "@heroicons/react": "2.1.5", "@lingui/core": "4.11.3", "@lingui/macro": "4.11.3", diff --git a/packages/parachains-impl/bifrost/package.json b/packages/parachains-impl/bifrost/package.json index 502b5c352..4fa2e0513 100644 --- a/packages/parachains-impl/bifrost/package.json +++ b/packages/parachains-impl/bifrost/package.json @@ -21,7 +21,7 @@ "react-dom": "^18.3.1" }, "dependencies": { - "@headlessui/react": "1.7.17", + "@headlessui/react": "2.1.2", "@heroicons/react": "2.1.5", "@lingui/core": "4.11.3", "@lingui/macro": "4.11.3", diff --git a/packages/ui/animation/AppearOnMount/AppearOnMount.tsx b/packages/ui/animation/AppearOnMount/AppearOnMount.tsx index 024d3aa31..c4272ef43 100644 --- a/packages/ui/animation/AppearOnMount/AppearOnMount.tsx +++ b/packages/ui/animation/AppearOnMount/AppearOnMount.tsx @@ -1,5 +1,6 @@ import { Transition } from '@headlessui/react' import { useIsMounted } from '@zenlink-interface/hooks' +import classNames from 'classnames' import type { ElementType, FC, ReactNode } from 'react' interface AppearOnMountProps { @@ -20,17 +21,15 @@ export const AppearOnMount: FC = ({ as = 'div', show, childr return ( - {typeof children === 'function' ? children(isMounted) : children} +
+ {typeof children === 'function' ? children(isMounted) : children} +
) } diff --git a/packages/ui/animation/SlideIn/FromBottom.tsx b/packages/ui/animation/SlideIn/FromBottom.tsx index ee26719a4..df00d17d9 100644 --- a/packages/ui/animation/SlideIn/FromBottom.tsx +++ b/packages/ui/animation/SlideIn/FromBottom.tsx @@ -1,4 +1,4 @@ -import { Transition } from '@headlessui/react' +import { Transition, TransitionChild } from '@headlessui/react' import { useIsSmScreen } from '@zenlink-interface/hooks' import classNames from 'classnames' import type { FC, ReactElement } from 'react' @@ -46,9 +46,9 @@ export const FromBottom: FC = ({ } return ReactDOM.createPortal( - +
- = ({ className="translate-y-[-100%] absolute inset-0 bg-black/70 transition-opacity" onClick={onClose} /> - - + = ({ unmount={false} > {children} - +
-
, +
, portal, ) } diff --git a/packages/ui/animation/SlideIn/FromLeft.tsx b/packages/ui/animation/SlideIn/FromLeft.tsx index 78f3af816..0ec34a95b 100644 --- a/packages/ui/animation/SlideIn/FromLeft.tsx +++ b/packages/ui/animation/SlideIn/FromLeft.tsx @@ -1,4 +1,4 @@ -import { Transition } from '@headlessui/react' +import { Transition, TransitionChild } from '@headlessui/react' import { useIsSmScreen } from '@zenlink-interface/hooks' import classNames from 'classnames' import type { FC, ReactElement } from 'react' @@ -46,42 +46,25 @@ export const FromLeft: FC = ({ } return ReactDOM.createPortal( - -
- -