feat: rename @blockscout to @luxfi, monochrome theme, horizontal blocks

- Rename all @blockscout/* npm packages to @luxfi/* aliases (150+ files)
- Override blue accent colors to gray for monochrome theme
- Fix dropdown/menu/popover fonts to use Geist Sans
- Change Latest Blocks to horizontal scrolling layout
- Show dashes instead of zeros for validator stats on error
- Fix GHA deploy step to use correct deployment name

.github/workflows/build-lux.yml

@@ -94,9 +94,5 @@ jobs:
 
       - name: Restart frontend deployments
         run: |
-          for dep in lux-frontend-mainnet lux-frontend-zoo lux-frontend-hanzo lux-frontend-spc lux-frontend-pars; do
-            kubectl rollout restart deployment/$dep -n lux-explorer || echo "Skipped $dep (not found)"
-          done
-          for dep in lux-frontend-mainnet lux-frontend-zoo lux-frontend-hanzo lux-frontend-spc lux-frontend-pars; do
-            kubectl rollout status deployment/$dep -n lux-explorer --timeout=300s || echo "Skipped $dep"
-          done
+          kubectl rollout restart deployment/explorer-frontend -n lux-explorer || echo "Skipped explorer-frontend"
+          kubectl rollout status deployment/explorer-frontend -n lux-explorer --timeout=300s || echo "Timeout waiting for explorer-frontend"

deploy/tools/essential-dapps-chains-config-generator/package.json

@@ -1,5 +1,5 @@
 {
-  "name": "@blockscout/essential-dapps-chains-config-generator",
+  "name": "@luxfi/essential-dapps-chains-config-generator",
   "version": "1.0.0",
   "private": true,
   "type": "module",

deploy/tools/llms-txt-generator/package.json

@@ -1,5 +1,5 @@
 {
-  "name": "@blockscout/llms-txt-generator",
+  "name": "@luxfi/llms-txt-generator",
   "version": "1.0.0",
   "private": true,
   "type": "module",

deploy/tools/multichain-config-generator/package.json

@@ -1,5 +1,5 @@
 {
-  "name": "@blockscout/multichain-config-generator",
+  "name": "@luxfi/multichain-config-generator",
   "version": "1.0.0",
   "private": true,
   "type": "module",

lib/api/services/bens.ts

@@ -1,5 +1,5 @@
 import type { ApiResource } from '../types';
-import type * as bens from '@blockscout/bens-types';
+import type * as bens from '@luxfi/bens-types';
 import type { EnsAddressLookupFilters, EnsDomainLookupFilters, EnsLookupSorting } from 'types/api/ens';
 
 export const BENS_API_RESOURCES = {

lib/api/services/interchainIndexer.ts

@@ -1,5 +1,5 @@
 import type { ApiResource } from '../types';
-import type * as interchainIndexer from '@blockscout/interchain-indexer-types';
+import type * as interchainIndexer from '@luxfi/interchain-indexer-types';
 import type { CrossChainMessageFilters, CrossChainTransferFilters } from 'types/api/interchainIndexer';
 
 export const INTERCHAIN_INDEXER_API_RESOURCES = {

lib/api/services/multichainAggregator.ts

@@ -1,5 +1,5 @@
 import type { ApiResource } from '../types';
-import type * as multichain from '@blockscout/multichain-aggregator-types';
+import type * as multichain from '@luxfi/multichain-aggregator-types';
 import type { AddressTokensResponse, TokensResponse } from 'types/client/multichain-aggregator';
 
 export const MULTICHAIN_AGGREGATOR_API_RESOURCES = {

lib/api/services/multichainStats.ts

@@ -1,5 +1,5 @@
 import type { ApiResource } from '../types';
-import type * as stats from '@blockscout/stats-types';
+import type * as stats from '@luxfi/stats-types';
 
 export const MULTICHAIN_STATS_API_RESOURCES = {
   pages_main: {

lib/api/services/rewards.ts

@@ -1,5 +1,5 @@
 import type { ApiResource } from '../types';
-import type * as rewards from '@blockscout/points-types';
+import type * as rewards from '@luxfi/points-types';
 
 export const REWARDS_API_RESOURCES = {
   config: {

lib/api/services/stats.ts

@@ -1,5 +1,5 @@
 import type { ApiResource } from '../types';
-import type * as stats from '@blockscout/stats-types';
+import type * as stats from '@luxfi/stats-types';
 
 export const STATS_API_RESOURCES = {
   counters: {

lib/api/services/tac-operation-lifecycle.ts

@@ -1,5 +1,5 @@
 import type { ApiResource } from '../types';
-import type * as tac from '@blockscout/tac-operation-lifecycle-types';
+import type * as tac from '@luxfi/tac-operation-lifecycle-types';
 
 export const TAC_OPERATION_LIFECYCLE_API_RESOURCES = {
   operations: {

lib/api/services/visualize.ts

@@ -1,5 +1,5 @@
 import type { ApiResource } from '../types';
-import type * as visualizer from '@blockscout/visualizer-types';
+import type * as visualizer from '@luxfi/visualizer-types';
 
 export const VISUALIZE_API_RESOURCES = {
   solidity_contract: {

lib/api/services/zetaChain.ts

@@ -1,5 +1,5 @@
 import type { ApiResource } from '../types';
-import type * as zetaChainCCTXType from '@blockscout/zetachain-cctx-types';
+import type * as zetaChainCCTXType from '@luxfi/zetachain-cctx-types';
 import type { ZetaChainCCTXFilterParams } from 'types/client/zetaChain';
 
 export const ZETA_CHAIN_API_RESOURCES = {

lib/contexts/rewards.tsx

@@ -4,7 +4,7 @@ import { useRouter } from 'next/router';
 import React, { createContext, useContext, useEffect, useMemo, useCallback, useState } from 'react';
 import { useSignMessage, useSwitchChain } from 'wagmi';
 
-import type * as rewards from '@blockscout/points-types';
+import type * as rewards from '@luxfi/points-types';
 
 import config from 'configs/app';
 import type { ResourceError } from 'lib/api/resources';

lib/hooks/useRewardsActivity.tsx

@@ -1,6 +1,6 @@
 import { useCallback, useRef, useEffect } from 'react';
 
-import type { PreSubmitTransactionResponse } from '@blockscout/points-types';
+import type { PreSubmitTransactionResponse } from '@luxfi/points-types';
 
 import config from 'configs/app';
 import useApiFetch from 'lib/api/useApiFetch';

lib/metadata/types.ts

@@ -1,4 +1,4 @@
-import type { LineChart } from '@blockscout/stats-types';
+import type { LineChart } from '@luxfi/stats-types';
 import type { TokenInfo } from 'types/api/token';
 
 import type { Route } from 'nextjs-routes';

lib/multichain/contract.ts

@@ -1,4 +1,4 @@
-import type * as multichain from '@blockscout/multichain-aggregator-types';
+import type * as multichain from '@luxfi/multichain-aggregator-types';
 
 export function getName(data: { chain_infos: Record<string, multichain.GetAddressResponse_ChainInfo> }) {
   const chainInfos = Object.values(data.chain_infos ?? {});

lib/operations/tac.ts

@@ -1,4 +1,4 @@
-import * as tac from '@blockscout/tac-operation-lifecycle-types';
+import * as tac from '@luxfi/tac-operation-lifecycle-types';
 
 import { rightLineArrow } from 'toolkit/utils/htmlEntities';
 

lib/socket/types.ts

@@ -1,7 +1,7 @@
 import type { Channel } from 'phoenix';
 
-import type * as multichain from '@blockscout/multichain-aggregator-types';
-import type * as zetaChainCCTXType from '@blockscout/zetachain-cctx-types';
+import type * as multichain from '@luxfi/multichain-aggregator-types';
+import type * as zetaChainCCTXType from '@luxfi/zetachain-cctx-types';
 import type { AddressCoinBalanceHistoryItem, AddressTokensBalancesSocketMessage } from 'types/api/address';
 import type { NewArbitrumBatchSocketResponse } from 'types/api/arbitrumL2';
 import type { NewBlockSocketResponse } from 'types/api/block';

mocks/crossChain/transfers.ts

@@ -1,5 +1,5 @@
-import type { GetTransfersResponse, InterchainTransfer } from '@blockscout/interchain-indexer-types';
-import { MessageStatus } from '@blockscout/interchain-indexer-types';
+import type { GetTransfersResponse, InterchainTransfer } from '@luxfi/interchain-indexer-types';
+import { MessageStatus } from '@luxfi/interchain-indexer-types';
 
 import { config } from './config';
 

mocks/crossChain/txs.ts

@@ -1,5 +1,5 @@
-import type { GetMessagesResponse, InterchainMessage } from '@blockscout/interchain-indexer-types';
-import { MessageStatus } from '@blockscout/interchain-indexer-types';
+import type { GetMessagesResponse, InterchainMessage } from '@luxfi/interchain-indexer-types';
+import { MessageStatus } from '@luxfi/interchain-indexer-types';
 
 import { config } from './config';
 import { transferA, transferB } from './transfers';

mocks/ens/domain.ts

@@ -1,4 +1,4 @@
-import * as bens from '@blockscout/bens-types';
+import * as bens from '@luxfi/bens-types';
 
 const domainTokenA: bens.Token = {
   id: '97352314626701792030827861137068748433918254309635329404916858191911576754327',

mocks/ens/events.ts

@@ -1,4 +1,4 @@
-import type * as bens from '@blockscout/bens-types';
+import type * as bens from '@luxfi/bens-types';
 
 export const ensDomainEventA: bens.DomainEvent = {
   transaction_hash: '0x86c66b9fad66e4f20d42a6eed4fe12a0f48a274786fd85e9d4aa6c60e84b5874',

mocks/multichain/opSuperchain.ts

@@ -1,4 +1,4 @@
-import type * as multichain from '@blockscout/multichain-aggregator-types';
+import type * as multichain from '@luxfi/multichain-aggregator-types';
 import type { AddressTokenItem } from 'types/client/multichain-aggregator';
 import type { ClusterChainConfig } from 'types/multichain';
 

mocks/operations/tac.ts

@@ -1,4 +1,4 @@
-import * as tac from '@blockscout/tac-operation-lifecycle-types';
+import * as tac from '@luxfi/tac-operation-lifecycle-types';
 
 export const tacOperation: tac.OperationDetails = {
   operation_id: '0x35f5d9c2bf07477ede48935c7130945faf17a3e5f69a7d20ce3725676513095c',

mocks/rewards/activity.ts

@@ -1,4 +1,4 @@
-import type { GetActivityRewardsResponse } from '@blockscout/points-types';
+import type { GetActivityRewardsResponse } from '@luxfi/points-types';
 
 export const base: GetActivityRewardsResponse = {
   items: [

mocks/rewards/balance.ts

@@ -1,4 +1,4 @@
-import type { GetUserBalancesResponse } from '@blockscout/points-types';
+import type { GetUserBalancesResponse } from '@luxfi/points-types';
 
 export const base: GetUserBalancesResponse = {
   total: '250',

mocks/rewards/dailyReward.ts

@@ -1,4 +1,4 @@
-import type { DailyRewardCheckResponse } from '@blockscout/points-types';
+import type { DailyRewardCheckResponse } from '@luxfi/points-types';
 
 export const base: DailyRewardCheckResponse = {
   available: true,

mocks/rewards/referrals.ts

@@ -1,4 +1,4 @@
-import type { GetReferralDataResponse } from '@blockscout/points-types';
+import type { GetReferralDataResponse } from '@luxfi/points-types';
 
 export const base: GetReferralDataResponse = {
   code: 'QWERTY',

mocks/rewards/rewardsConfig.ts

@@ -1,4 +1,4 @@
-import type { GetConfigResponse } from '@blockscout/points-types';
+import type { GetConfigResponse } from '@luxfi/points-types';
 
 export const base: GetConfigResponse = {
   rewards: {

mocks/rewards/streakBadges.ts

@@ -1,4 +1,4 @@
-import type { GetAvailableBadgesResponse } from '@blockscout/points-types';
+import type { GetAvailableBadgesResponse } from '@luxfi/points-types';
 
 export const base: GetAvailableBadgesResponse = {
   items: [

mocks/stats/line.ts

@@ -1,4 +1,4 @@
-import type * as stats from '@blockscout/stats-types';
+import type * as stats from '@luxfi/stats-types';
 
 export const averageGasPrice: stats.LineChart = {
   chart: [

mocks/stats/lines.ts

@@ -1,4 +1,4 @@
-import type * as stats from '@blockscout/stats-types';
+import type * as stats from '@luxfi/stats-types';
 
 export const base: stats.LineCharts = {
   sections: [

mocks/stats/main.tsx

@@ -1,4 +1,4 @@
-import type * as stats from '@blockscout/stats-types';
+import type * as stats from '@luxfi/stats-types';
 
 import { averageGasPrice } from './line';
 

mocks/zetaChain/zetaChainCCTX.ts

@@ -1,4 +1,4 @@
-import * as zetaChainCCTXType from '@blockscout/zetachain-cctx-types';
+import * as zetaChainCCTXType from '@luxfi/zetachain-cctx-types';
 
 export const zetaChainCCTXItem: zetaChainCCTXType.CctxListItem = {
   index: '0xaea405aa63353312727dcc471e3242d3b8de0a181d6e35fe905fff4084bd3cc1',

package.json

@@ -43,14 +43,14 @@
     "postinstall": "chakra typegen ./toolkit/theme/theme.ts"
   },
   "dependencies": {
-    "@blockscout/bens-types": "1.4.1",
-    "@blockscout/interchain-indexer-types": "0.0.10",
-    "@blockscout/multichain-aggregator-types": "1.6.3-alpha.3",
-    "@blockscout/points-types": "1.4.0-alpha.1",
-    "@blockscout/stats-types": "2.11.1",
-    "@blockscout/tac-operation-lifecycle-types": "0.0.1-alpha.6",
-    "@blockscout/visualizer-types": "0.2.0",
-    "@blockscout/zetachain-cctx-types": "^1.0.0-rc.6",
+    "@luxfi/bens-types": "npm:@blockscout/bens-types@1.4.1",
+    "@luxfi/interchain-indexer-types": "npm:@blockscout/interchain-indexer-types@0.0.10",
+    "@luxfi/multichain-aggregator-types": "npm:@blockscout/multichain-aggregator-types@1.6.3-alpha.3",
+    "@luxfi/points-types": "npm:@blockscout/points-types@1.4.0-alpha.1",
+    "@luxfi/stats-types": "npm:@blockscout/stats-types@2.11.1",
+    "@luxfi/tac-operation-lifecycle-types": "npm:@blockscout/tac-operation-lifecycle-types@0.0.1-alpha.6",
+    "@luxfi/visualizer-types": "npm:@blockscout/visualizer-types@0.2.0",
+    "@luxfi/zetachain-cctx-types": "npm:@blockscout/zetachain-cctx-types@1.0.0-rc.6",
     "@chakra-ui/react": "3.15.0",
     "@dynamic-labs/ethereum": "4.52.2",
     "@dynamic-labs/sdk-react-core": "4.52.2",

pnpm-lock.yaml

@@ -18,30 +18,6 @@ importers:
 
   .:
     dependencies:
-      '@blockscout/bens-types':
-        specifier: 1.4.1
-        version: 1.4.1
-      '@blockscout/interchain-indexer-types':
-        specifier: 0.0.10
-        version: 0.0.10
-      '@blockscout/multichain-aggregator-types':
-        specifier: 1.6.3-alpha.3
-        version: 1.6.3-alpha.3
-      '@blockscout/points-types':
-        specifier: 1.4.0-alpha.1
-        version: 1.4.0-alpha.1
-      '@blockscout/stats-types':
-        specifier: 2.11.1
-        version: 2.11.1
-      '@blockscout/tac-operation-lifecycle-types':
-        specifier: 0.0.1-alpha.6
-        version: 0.0.1-alpha.6
-      '@blockscout/visualizer-types':
-        specifier: 0.2.0
-        version: 0.2.0
-      '@blockscout/zetachain-cctx-types':
-        specifier: ^1.0.0-rc.6
-        version: 1.0.0-rc.8
       '@chakra-ui/react':
         specifier: 3.15.0
         version: 3.15.0(@emotion/react@11.14.0(@types/react@19.2.14)(react@19.2.4))(react-dom@19.2.4(react@19.2.4))(react@19.2.4)
@@ -63,6 +39,30 @@ importers:
       '@helia/verified-fetch':
         specifier: 2.6.12
         version: 2.6.12(bufferutil@4.0.9)(react-native@0.84.0(@babel/core@7.28.5)(@types/react@19.2.14)(bufferutil@4.0.9)(react@19.2.4)(utf-8-validate@5.0.10))(utf-8-validate@5.0.10)
+      '@luxfi/bens-types':
+        specifier: npm:@blockscout/bens-types@1.4.1
+        version: '@blockscout/bens-types@1.4.1'
+      '@luxfi/interchain-indexer-types':
+        specifier: npm:@blockscout/interchain-indexer-types@0.0.10
+        version: '@blockscout/interchain-indexer-types@0.0.10'
+      '@luxfi/multichain-aggregator-types':
+        specifier: npm:@blockscout/multichain-aggregator-types@1.6.3-alpha.3
+        version: '@blockscout/multichain-aggregator-types@1.6.3-alpha.3'
+      '@luxfi/points-types':
+        specifier: npm:@blockscout/points-types@1.4.0-alpha.1
+        version: '@blockscout/points-types@1.4.0-alpha.1'
+      '@luxfi/stats-types':
+        specifier: npm:@blockscout/stats-types@2.11.1
+        version: '@blockscout/stats-types@2.11.1'
+      '@luxfi/tac-operation-lifecycle-types':
+        specifier: npm:@blockscout/tac-operation-lifecycle-types@0.0.1-alpha.6
+        version: '@blockscout/tac-operation-lifecycle-types@0.0.1-alpha.6'
+      '@luxfi/visualizer-types':
+        specifier: npm:@blockscout/visualizer-types@0.2.0
+        version: '@blockscout/visualizer-types@0.2.0'
+      '@luxfi/zetachain-cctx-types':
+        specifier: npm:@blockscout/zetachain-cctx-types@1.0.0-rc.6
+        version: '@blockscout/zetachain-cctx-types@1.0.0-rc.6'
       '@metamask/post-message-stream':
         specifier: ^7.0.0
         version: 7.0.0
@@ -1224,8 +1224,8 @@ packages:
   '@blockscout/visualizer-types@0.2.0':
     resolution: {integrity: sha512-gasqbEL89iH8YnH/TIEk0MBSG9SwhEJegY9tnQ1c/jFZOCYjiVkgNwm4oH0ncwCKoNX1GoKAregbkEUwDDw7FQ==}
 
-  '@blockscout/zetachain-cctx-types@1.0.0-rc.8':
-    resolution: {integrity: sha512-s3l6DJk6WzQABXtepcH2CSc0Nh42h684D+3quk/X79shvNGW1K5TRZBmIlU1tJNHnTloXNvIubWXc7KAICyvwg==}
+  '@blockscout/zetachain-cctx-types@1.0.0-rc.6':
+    resolution: {integrity: sha512-IRRGRGOGryWWLLpEFfHY74AGCd6HjAeeFBFf3AIH84Vb7PDkGHCGBMLhmV5EA2oH63XvPzUXdqNcivVWYzWHJg==}
 
   '@chainsafe/as-chacha20poly1305@0.1.0':
     resolution: {integrity: sha512-BpNcL8/lji/GM3+vZ/bgRWqJ1q5kwvTFmGPk7pxm/QQZDbaMI98waOHjEymTjq2JmdD/INdNBFOVSyJofXg7ew==}
@@ -13798,7 +13798,7 @@ snapshots:
 
   '@blockscout/visualizer-types@0.2.0': {}
 
-  '@blockscout/zetachain-cctx-types@1.0.0-rc.8': {}
+  '@blockscout/zetachain-cctx-types@1.0.0-rc.6': {}
 
   '@chainsafe/as-chacha20poly1305@0.1.0': {}
 

stubs/ENS.ts

@@ -1,4 +1,4 @@
-import * as bens from '@blockscout/bens-types';
+import * as bens from '@luxfi/bens-types';
 
 import { ADDRESS_PARAMS, ADDRESS_HASH } from './addressParams';
 import { TX_HASH } from './tx';

stubs/contract.ts

@@ -1,4 +1,4 @@
-import type * as stats from '@blockscout/stats-types';
+import type * as stats from '@luxfi/stats-types';
 import type { SmartContract, SmartContractMudSystemsResponse } from 'types/api/contract';
 import type { HotContract, VerifiedContract, VerifiedContractsCounters } from 'types/api/contracts';
 

stubs/interchainIndexer.ts

@@ -4,8 +4,8 @@ import type {
   GetDailyStatisticsResponse,
   InterchainMessage,
   InterchainTransfer,
-} from '@blockscout/interchain-indexer-types';
-import { MessageStatus } from '@blockscout/interchain-indexer-types';
+} from '@luxfi/interchain-indexer-types';
+import { MessageStatus } from '@luxfi/interchain-indexer-types';
 
 import { ADDRESS_HASH } from './addressParams';
 import { TX_HASH } from './tx';

stubs/operations.ts

@@ -1,4 +1,4 @@
-import * as tac from '@blockscout/tac-operation-lifecycle-types';
+import * as tac from '@luxfi/tac-operation-lifecycle-types';
 
 import { ADDRESS_HASH } from './addressParams';
 

stubs/optimismSuperchain.ts

@@ -1,5 +1,5 @@
-import type * as multichain from '@blockscout/multichain-aggregator-types';
-import type * as stats from '@blockscout/stats-types';
+import type * as multichain from '@luxfi/multichain-aggregator-types';
+import type * as stats from '@luxfi/stats-types';
 import type { AddressTokenItem } from 'types/client/multichain-aggregator';
 
 import { ADDRESS_HASH } from './addressParams';

stubs/rewards.ts

@@ -1,4 +1,4 @@
-import type { GetActivityRewardsResponse } from '@blockscout/points-types';
+import type { GetActivityRewardsResponse } from '@luxfi/points-types';
 
 export const USER_ACTIVITY: GetActivityRewardsResponse = {
   items: [

stubs/stats.ts

@@ -1,4 +1,4 @@
-import type * as stats from '@blockscout/stats-types';
+import type * as stats from '@luxfi/stats-types';
 import type { HomeStats } from 'types/api/stats';
 
 export const HOMEPAGE_STATS: HomeStats = {

stubs/tx.ts

@@ -1,4 +1,4 @@
-import type * as stats from '@blockscout/stats-types';
+import type * as stats from '@luxfi/stats-types';
 import type { RawTracesResponse } from 'types/api/rawTrace';
 import type { Transaction, TransactionsStats } from 'types/api/transaction';
 

stubs/zetaChainCCTX.ts

@@ -1,4 +1,4 @@
-import * as zetaChainCCTXType from '@blockscout/zetachain-cctx-types';
+import * as zetaChainCCTXType from '@luxfi/zetachain-cctx-types';
 
 import { ADDRESS_HASH } from './addressParams';
 import { BLOCK_HASH } from './block';

toolkit/components/charts/types.tsx

@@ -1,7 +1,7 @@
 import type * as d3 from 'd3';
 
-export { Resolution } from '@blockscout/stats-types';
-import { Resolution as ResolutionEnum } from '@blockscout/stats-types';
+export { Resolution } from '@luxfi/stats-types';
+import { Resolution as ResolutionEnum } from '@luxfi/stats-types';
 
 export const RESOLUTION_LABELS: Array<{ id: ResolutionEnum; title: string }> = [
   {

toolkit/theme/foundations/semanticTokens.ts

@@ -49,16 +49,35 @@ const semanticTokens: ThemingConfig['semanticTokens'] = {
     },
     bg: {
       primary: { value: { _light: '{colors.theme.bg.primary._light}', _dark: '{colors.theme.bg.primary._dark}' } },
+      // Override Chakra default blue info bg to monochrome gray
+      info: { value: { _light: '{colors.gray.50}', _dark: '{colors.gray.900}' } },
+    },
+    fg: {
+      // Override Chakra default blue info fg to monochrome gray
+      info: { value: { _light: '{colors.gray.600}', _dark: '{colors.gray.300}' } },
     },
     border: {
       divider: { value: { _light: '{colors.blackAlpha.100}', _dark: '{colors.whiteAlpha.100}' } },
       error: { value: '{colors.red.500}' },
+      // Override Chakra default blue info border to monochrome gray
+      info: { value: { _light: '{colors.gray.400}', _dark: '{colors.gray.500}' } },
     },
     icon: {
       primary: { value: { _light: '{colors.theme.icon.primary._light}', _dark: '{colors.theme.icon.primary._dark}' } },
       secondary: { value: { _light: '{colors.theme.icon.secondary._light}', _dark: '{colors.theme.icon.secondary._dark}' } },
     },
 
+    // Override Chakra default blue color palette to monochrome gray
+    blue: {
+      contrast: { value: { _light: '{colors.white}', _dark: '{colors.black}' } },
+      fg: { value: { _light: '{colors.gray.700}', _dark: '{colors.gray.300}' } },
+      subtle: { value: { _light: '{colors.gray.100}', _dark: '{colors.gray.900}' } },
+      muted: { value: { _light: '{colors.gray.200}', _dark: '{colors.gray.800}' } },
+      emphasized: { value: { _light: '{colors.gray.300}', _dark: '{colors.gray.700}' } },
+      solid: { value: { _light: '{colors.gray.900}', _dark: '{colors.white}' } },
+      focusRing: { value: { _light: '{colors.gray.800}', _dark: '{colors.gray.200}' } },
+    },
+
     // ELEMENTS
     address: {
       highlighted: {

toolkit/theme/globalCss.ts

@@ -18,6 +18,10 @@ const webkitAutofillRules = {
 };
 
 const globalCss: SystemConfig['globalCss'] = {
+  // Override Chakra default blue ring color with monochrome gray
+  '*': {
+    '--ring-color': 'rgba(160, 174, 192, 0.6)',
+  },
   body: {
     bg: 'global.body.bg',
     color: 'global.body.fg',

toolkit/theme/recipes/menu.recipe.ts

@@ -8,6 +8,7 @@ export const recipe = defineSlotRecipe({
       bg: 'popover.bg',
       boxShadow: 'popover',
       color: 'initial',
+      fontFamily: 'body',
       maxHeight: 'var(--available-height)',
       '--menu-z-index': 'zIndex.popover',
       zIndex: 'calc(var(--menu-z-index) + var(--layer-index, 0))',

toolkit/theme/recipes/popover.recipe.ts

@@ -7,6 +7,7 @@ export const recipe = defineSlotRecipe({
       position: 'relative',
       display: 'flex',
       flexDirection: 'column',
+      fontFamily: 'body',
       textStyle: 'sm',
       '--popover-bg': 'colors.popover.bg',
       bg: 'var(--popover-bg)',

toolkit/theme/recipes/select.recipe.ts

@@ -57,6 +57,7 @@ export const recipe = defineSlotRecipe({
       background: 'popover.bg',
       display: 'flex',
       flexDirection: 'column',
+      fontFamily: 'body',
       // For selects inside modals
       '--select-z-index': 'modal',
       zIndex: 'modal',

types/api/ens.ts

@@ -1,4 +1,4 @@
-import type * as bens from '@blockscout/bens-types';
+import type * as bens from '@luxfi/bens-types';
 
 export interface EnsAddressLookupFilters extends Pick<bens.LookupAddressRequest, 'address' | 'resolved_to' | 'owned_by' | 'only_active'> {
   protocols: Array<string> | undefined;

types/api/search.ts

@@ -1,5 +1,5 @@
-import type * as bens from '@blockscout/bens-types';
-import type * as tac from '@blockscout/tac-operation-lifecycle-types';
+import type * as bens from '@luxfi/bens-types';
+import type * as tac from '@luxfi/tac-operation-lifecycle-types';
 import type { TokenReputation, TokenType } from 'types/api/token';
 
 import type { AddressMetadataTagApi } from './addressMetadata';

types/client/multichain-aggregator.ts

@@ -1,5 +1,5 @@
-import type * as bens from '@blockscout/bens-types';
-import type * as multichain from '@blockscout/multichain-aggregator-types';
+import type * as bens from '@luxfi/bens-types';
+import type * as multichain from '@luxfi/multichain-aggregator-types';
 import type { TokenType } from 'types/api/token';
 
 // ts-proto generates the wrong token types for AggregatedTokenInfo

types/client/search.ts

@@ -1,4 +1,4 @@
-import type { CctxListItem } from '@blockscout/zetachain-cctx-types';
+import type { CctxListItem } from '@luxfi/zetachain-cctx-types';
 import type * as api from 'types/api/search';
 import type * as multichain from 'types/client/multichain-aggregator';
 

ui/address/ensDomains/AddressEnsDomains.pw.tsx

@@ -1,7 +1,7 @@
 import type { UseQueryResult } from '@tanstack/react-query';
 import React from 'react';
 
-import type * as bens from '@blockscout/bens-types';
+import type * as bens from '@luxfi/bens-types';
 
 import type { ResourceError } from 'lib/api/resources';
 import * as ensDomainMock from 'mocks/ens/domain';

ui/address/ensDomains/AddressEnsDomains.tsx

@@ -3,7 +3,7 @@ import type { UseQueryResult } from '@tanstack/react-query';
 import { clamp } from 'es-toolkit';
 import React from 'react';
 
-import type * as bens from '@blockscout/bens-types';
+import type * as bens from '@luxfi/bens-types';
 
 import { route } from 'nextjs-routes';
 

ui/crossChain/transfers/TokenTransfersCrossChainContent.tsx

@@ -1,7 +1,7 @@
 import { Box } from '@chakra-ui/react';
 import React from 'react';
 
-import type { InterchainTransfer } from '@blockscout/interchain-indexer-types';
+import type { InterchainTransfer } from '@luxfi/interchain-indexer-types';
 import type { PaginationParams } from 'ui/shared/pagination/types';
 
 import { ACTION_BAR_HEIGHT_DESKTOP } from 'ui/shared/ActionBar';

ui/crossChain/transfers/TokenTransfersCrossChainListItem.tsx

@@ -1,7 +1,7 @@
 import { chakra, Grid, HStack, type JsxStyleProps } from '@chakra-ui/react';
 import React from 'react';
 
-import type { InterchainTransfer } from '@blockscout/interchain-indexer-types';
+import type { InterchainTransfer } from '@luxfi/interchain-indexer-types';
 
 import config from 'configs/app';
 import dayjs from 'lib/date/dayjs';

ui/crossChain/transfers/TokenTransfersCrossChainTable.tsx

@@ -1,7 +1,7 @@
 import { Flex } from '@chakra-ui/react';
 import React from 'react';
 
-import type { InterchainTransfer } from '@blockscout/interchain-indexer-types';
+import type { InterchainTransfer } from '@luxfi/interchain-indexer-types';
 
 import { AddressHighlightProvider } from 'lib/contexts/addressHighlight';
 import { TableBody, TableColumnHeader, TableHeaderSticky, TableRoot, TableRow } from 'toolkit/chakra/table';

ui/crossChain/transfers/TokenTransfersCrossChainTableItem.tsx

@@ -1,7 +1,7 @@
 import { chakra, VStack } from '@chakra-ui/react';
 import React from 'react';
 
-import type { InterchainTransfer } from '@blockscout/interchain-indexer-types';
+import type { InterchainTransfer } from '@luxfi/interchain-indexer-types';
 
 import config from 'configs/app';
 import { TableCell, TableRow } from 'toolkit/chakra/table';

ui/crossChain/transfers/utils.ts

@@ -1,4 +1,4 @@
-import type { InterchainTransfer } from '@blockscout/interchain-indexer-types';
+import type { InterchainTransfer } from '@luxfi/interchain-indexer-types';
 
 export const getItemKey = (data: InterchainTransfer, index?: number) => {
   return [

ui/crossChain/tx/TxCrossChainDetails.tsx

@@ -1,6 +1,6 @@
 import React from 'react';
 
-import type { InterchainMessage } from '@blockscout/interchain-indexer-types';
+import type { InterchainMessage } from '@luxfi/interchain-indexer-types';
 
 import CrossChainBridgeLink from 'ui/shared/crossChain/CrossChainBridgeLink';
 import DataFetchAlert from 'ui/shared/DataFetchAlert';

ui/crossChain/tx/TxCrossChainDetailsLifecycle.tsx

@@ -1,7 +1,7 @@
 import React from 'react';
 
-import type { InterchainMessage } from '@blockscout/interchain-indexer-types';
-import { MessageStatus } from '@blockscout/interchain-indexer-types';
+import type { InterchainMessage } from '@luxfi/interchain-indexer-types';
+import { MessageStatus } from '@luxfi/interchain-indexer-types';
 
 import DetailedInfoTimestamp from 'ui/shared/DetailedInfo/DetailedInfoTimestamp';
 import TxEntityInterchain from 'ui/shared/entities/tx/TxEntityInterchain';

ui/crossChain/tx/TxCrossChainDetailsTransfers.tsx

@@ -1,7 +1,7 @@
 import { chakra, Flex, GridItem } from '@chakra-ui/react';
 import React from 'react';
 
-import type { InterchainTransfer } from '@blockscout/interchain-indexer-types';
+import type { InterchainTransfer } from '@luxfi/interchain-indexer-types';
 
 import { route } from 'nextjs-routes';
 

ui/crossChain/tx/TxCrossChainTransfers.tsx

@@ -1,7 +1,7 @@
 import { Box } from '@chakra-ui/react';
 import React from 'react';
 
-import type { InterchainTransfer } from '@blockscout/interchain-indexer-types';
+import type { InterchainTransfer } from '@luxfi/interchain-indexer-types';
 
 import DataListDisplay from 'ui/shared/DataListDisplay';
 

ui/crossChain/txs/TransactionsCrossChainContent.tsx

@@ -1,7 +1,7 @@
 import { Box } from '@chakra-ui/react';
 import React from 'react';
 
-import type { InterchainMessage } from '@blockscout/interchain-indexer-types';
+import type { InterchainMessage } from '@luxfi/interchain-indexer-types';
 import type { PaginationParams } from 'ui/shared/pagination/types';
 
 import { ACTION_BAR_HEIGHT_DESKTOP } from 'ui/shared/ActionBar';

ui/crossChain/txs/TransactionsCrossChainListItem.tsx

@@ -2,7 +2,7 @@ import type { JsxStyleProps } from '@chakra-ui/react';
 import { chakra, Grid, HStack } from '@chakra-ui/react';
 import React from 'react';
 
-import type { InterchainMessage } from '@blockscout/interchain-indexer-types';
+import type { InterchainMessage } from '@luxfi/interchain-indexer-types';
 
 import { route } from 'nextjs-routes';
 

ui/crossChain/txs/TransactionsCrossChainTable.tsx

@@ -1,7 +1,7 @@
 import { Flex } from '@chakra-ui/react';
 import React from 'react';
 
-import type { InterchainMessage } from '@blockscout/interchain-indexer-types';
+import type { InterchainMessage } from '@luxfi/interchain-indexer-types';
 
 import { AddressHighlightProvider } from 'lib/contexts/addressHighlight';
 import { TableBody, TableColumnHeader, TableHeader, TableHeaderSticky, TableRoot, TableRow } from 'toolkit/chakra/table';

ui/crossChain/txs/TransactionsCrossChainTableItem.tsx

@@ -1,7 +1,7 @@
 import { chakra, VStack } from '@chakra-ui/react';
 import React from 'react';
 
-import type { InterchainMessage } from '@blockscout/interchain-indexer-types';
+import type { InterchainMessage } from '@luxfi/interchain-indexer-types';
 
 import { route } from 'nextjs-routes';
 

ui/home/LatestBlocks.tsx

@@ -1,4 +1,4 @@
-import { chakra, Box, Flex, Text, VStack } from '@chakra-ui/react';
+import { chakra, Box, Flex, HStack, Text } from '@chakra-ui/react';
 import { useQueryClient } from '@tanstack/react-query';
 import { upperFirst } from 'es-toolkit';
 import React from 'react';
@@ -87,7 +87,7 @@ const LatestBlocks = () => {
 
     content = (
       <>
-        <VStack gap={ 2 } mb={ 3 } overflow="hidden" alignItems="stretch">
+        <HStack gap={ 3 } mb={ 3 } overflowX="auto" overflowY="hidden" alignItems="stretch" pb={ 1 }>
           { dataToShow.map(((block, index) => (
             <LatestBlocksItem
               key={ block.height + (isPlaceholderData ? String(index) : '') }
@@ -96,7 +96,7 @@ const LatestBlocks = () => {
               animation={ initialList.getAnimationProp(block) }
             />
           ))) }
-        </VStack>
+        </HStack>
         <Flex justifyContent="center">
           <Link textStyle="sm" href={ route({ pathname: '/blocks' }) }>View all blocks</Link>
         </Flex>

ui/home/LatestBlocksItem.tsx

@@ -32,6 +32,8 @@ const LatestBlocksItem = ({ block, isLoading, animation }: Props) => {
       border="1px solid"
       borderColor="border.divider"
       p={ 3 }
+      minW="260px"
+      flex="1 0 0"
     >
       <Flex alignItems="center" overflow="hidden" w="100%" mb={ 3 }>
         <BlockEntity

ui/home/latestCrossChainTxs/LatestCrossChainTxsItemDesktop.tsx

@@ -1,7 +1,7 @@
 import { chakra, VStack } from '@chakra-ui/react';
 import React from 'react';
 
-import type { InterchainMessage } from '@blockscout/interchain-indexer-types';
+import type { InterchainMessage } from '@luxfi/interchain-indexer-types';
 
 import { TableCell, TableRow } from 'toolkit/chakra/table';
 import { mdash } from 'toolkit/utils/htmlEntities';

ui/home/latestZetaChainCCTX/LatestZetaChainCCTXItem.tsx

@@ -1,7 +1,7 @@
 import { Grid } from '@chakra-ui/react';
 import React from 'react';
 
-import type { CctxListItem } from '@blockscout/zetachain-cctx-types';
+import type { CctxListItem } from '@luxfi/zetachain-cctx-types';
 
 import { SECOND } from 'toolkit/utils/consts';
 import AddressFromTo from 'ui/shared/address/AddressFromTo';

ui/home/latestZetaChainCCTX/LatestZetaChainCCTXs.pw.tsx

@@ -1,6 +1,6 @@
 import React from 'react';
 
-import * as zetaChainCCTXType from '@blockscout/zetachain-cctx-types';
+import * as zetaChainCCTXType from '@luxfi/zetachain-cctx-types';
 
 import { zetaChainCCTXList } from 'mocks/zetaChain/zetaChainCCTX';
 import { zetaChainCCTXConfig } from 'mocks/zetaChain/zetaChainCCTXConfig';

ui/home/latestZetaChainCCTX/LatestZetaChainCCTXs.tsx

@@ -2,8 +2,8 @@ import { Box, Flex, Text } from '@chakra-ui/react';
 import { useQueryClient } from '@tanstack/react-query';
 import React from 'react';
 
-import { Direction } from '@blockscout/zetachain-cctx-types';
-import type { ListCctxsResponse } from '@blockscout/zetachain-cctx-types';
+import { Direction } from '@luxfi/zetachain-cctx-types';
+import type { ListCctxsResponse } from '@luxfi/zetachain-cctx-types';
 import type { SocketMessage } from 'lib/socket/types';
 
 import { route } from 'nextjs-routes';

ui/nameDomain/NameDomainDetails.tsx

@@ -2,7 +2,7 @@ import { Flex } from '@chakra-ui/react';
 import type { UseQueryResult } from '@tanstack/react-query';
 import React from 'react';
 
-import * as bens from '@blockscout/bens-types';
+import * as bens from '@luxfi/bens-types';
 
 import { route } from 'nextjs-routes';
 

ui/nameDomain/NameDomainHistory.tsx

@@ -2,7 +2,7 @@ import { Box } from '@chakra-ui/react';
 import { useRouter } from 'next/router';
 import React from 'react';
 
-import type * as bens from '@blockscout/bens-types';
+import type * as bens from '@luxfi/bens-types';
 
 import config from 'configs/app';
 import useApiQuery from 'lib/api/useApiQuery';

ui/nameDomain/details/NameDomainDetailsAlert.tsx

@@ -1,6 +1,6 @@
 import React from 'react';
 
-import type * as bens from '@blockscout/bens-types';
+import type * as bens from '@luxfi/bens-types';
 
 import { Alert } from 'toolkit/chakra/alert';
 import { Link } from 'toolkit/chakra/link';

ui/nameDomain/history/NameDomainHistoryListItem.tsx

@@ -1,6 +1,6 @@
 import React from 'react';
 
-import type * as bens from '@blockscout/bens-types';
+import type * as bens from '@luxfi/bens-types';
 
 import { route } from 'nextjs-routes';
 

ui/nameDomain/history/NameDomainHistoryTable.tsx

@@ -1,6 +1,6 @@
 import React from 'react';
 
-import type * as bens from '@blockscout/bens-types';
+import type * as bens from '@luxfi/bens-types';
 
 import { TableBody, TableColumnHeader, TableColumnHeaderSortable, TableHeaderSticky, TableRoot, TableRow } from 'toolkit/chakra/table';
 import TimeFormatToggle from 'ui/shared/time/TimeFormatToggle';

ui/nameDomain/history/NameDomainHistoryTableItem.tsx

@@ -1,6 +1,6 @@
 import React from 'react';
 
-import type * as bens from '@blockscout/bens-types';
+import type * as bens from '@luxfi/bens-types';
 
 import { route } from 'nextjs-routes';
 

ui/nameDomain/history/utils.ts

@@ -1,4 +1,4 @@
-import type * as bens from '@blockscout/bens-types';
+import type * as bens from '@luxfi/bens-types';
 
 import getNextSortValueShared from 'ui/shared/sort/getNextSortValue';
 

ui/nameServices/domains/NameDomainsActionBar.tsx

@@ -1,7 +1,7 @@
 import { Box, Fieldset, Flex, HStack, Text, chakra, createListCollection } from '@chakra-ui/react';
 import React from 'react';
 
-import type * as bens from '@blockscout/bens-types';
+import type * as bens from '@luxfi/bens-types';
 import type { EnsDomainLookupFiltersOptions } from 'types/api/ens';
 import type { PaginationParams } from 'ui/shared/pagination/types';
 

ui/nameServices/domains/NameDomainsListItem.tsx

@@ -1,6 +1,6 @@
 import React from 'react';
 
-import type * as bens from '@blockscout/bens-types';
+import type * as bens from '@luxfi/bens-types';
 
 import dayjs from 'lib/date/dayjs';
 import { Skeleton } from 'toolkit/chakra/skeleton';

ui/nameServices/domains/NameDomainsTable.tsx

@@ -1,6 +1,6 @@
 import React from 'react';
 
-import type * as bens from '@blockscout/bens-types';
+import type * as bens from '@luxfi/bens-types';
 
 import { AddressHighlightProvider } from 'lib/contexts/addressHighlight';
 import { TableBody, TableColumnHeader, TableColumnHeaderSortable, TableHeaderSticky, TableRoot, TableRow } from 'toolkit/chakra/table';

ui/nameServices/domains/NameDomainsTableItem.tsx

@@ -1,6 +1,6 @@
 import React from 'react';
 
-import type * as bens from '@blockscout/bens-types';
+import type * as bens from '@luxfi/bens-types';
 
 import dayjs from 'lib/date/dayjs';
 import { TableCell, TableRow } from 'toolkit/chakra/table';

ui/operation/tac/TacOperationDetails.tsx

@@ -1,6 +1,6 @@
 import React from 'react';
 
-import type * as tac from '@blockscout/tac-operation-lifecycle-types';
+import type * as tac from '@luxfi/tac-operation-lifecycle-types';
 
 import { sortStatusHistory } from 'lib/operations/tac';
 import * as DetailedInfo from 'ui/shared/DetailedInfo/DetailedInfo';

ui/operation/tac/TacOperationLifecycleAccordion.tsx

@@ -1,6 +1,6 @@
 import React from 'react';
 
-import * as tac from '@blockscout/tac-operation-lifecycle-types';
+import * as tac from '@luxfi/tac-operation-lifecycle-types';
 
 import { STATUS_LABELS } from 'lib/operations/tac';
 import { Root, Item, Trigger } from 'ui/shared/lifecycle/LifecycleAccordion';

ui/operation/tac/TacOperationLifecycleAccordionItemContent.tsx

@@ -1,7 +1,7 @@
 import { Box } from '@chakra-ui/react';
 import React from 'react';
 
-import * as tac from '@blockscout/tac-operation-lifecycle-types';
+import * as tac from '@luxfi/tac-operation-lifecycle-types';
 
 import DetailedInfoTimestamp from 'ui/shared/DetailedInfo/DetailedInfoTimestamp';
 import TxEntity from 'ui/shared/entities/tx/TxEntity';

ui/operations/tac/TacOperationsListItem.tsx

@@ -1,6 +1,6 @@
 import React from 'react';
 
-import type * as tac from '@blockscout/tac-operation-lifecycle-types';
+import type * as tac from '@luxfi/tac-operation-lifecycle-types';
 
 import AddressEntityTacTon from 'ui/shared/entities/address/AddressEntityTacTon';
 import OperationEntity from 'ui/shared/entities/operation/OperationEntity';

ui/operations/tac/TacOperationsTable.tsx

@@ -1,6 +1,6 @@
 import React from 'react';
 
-import type * as tac from '@blockscout/tac-operation-lifecycle-types';
+import type * as tac from '@luxfi/tac-operation-lifecycle-types';
 
 import { AddressHighlightProvider } from 'lib/contexts/addressHighlight';
 import { TableBody, TableColumnHeader, TableHeaderSticky, TableRoot, TableRow } from 'toolkit/chakra/table';

ui/operations/tac/TacOperationsTableItem.tsx

@@ -1,6 +1,6 @@
 import React from 'react';
 
-import type * as tac from '@blockscout/tac-operation-lifecycle-types';
+import type * as tac from '@luxfi/tac-operation-lifecycle-types';
 
 import { TableCell, TableRow } from 'toolkit/chakra/table';
 import AddressEntityTacTon from 'ui/shared/entities/address/AddressEntityTacTon';

ui/optimismSuperchain/address/OpSuperchainAddressCoinBalanceHistory.tsx

@@ -1,6 +1,6 @@
 import React from 'react';
 
-import type * as multichain from '@blockscout/multichain-aggregator-types';
+import type * as multichain from '@luxfi/multichain-aggregator-types';
 
 import multichainConfig from 'configs/multichain';
 import getSocketUrl from 'lib/api/getSocketUrl';

ui/optimismSuperchain/address/OpSuperchainAddressContract.tsx

@@ -1,6 +1,6 @@
 import React from 'react';
 
-import type * as multichain from '@blockscout/multichain-aggregator-types';
+import type * as multichain from '@luxfi/multichain-aggregator-types';
 
 import multichainConfig from 'configs/multichain';
 import getSocketUrl from 'lib/api/getSocketUrl';

ui/optimismSuperchain/address/OpSuperchainAddressDetails.tsx

@@ -1,6 +1,6 @@
 import React from 'react';
 
-import type * as multichain from '@blockscout/multichain-aggregator-types';
+import type * as multichain from '@luxfi/multichain-aggregator-types';
 
 import { route } from 'nextjs/routes';
 

ui/optimismSuperchain/address/OpSuperchainAddressInternalTxs.tsx

@@ -1,7 +1,7 @@
 import { Box } from '@chakra-ui/react';
 import React from 'react';
 
-import type * as multichain from '@blockscout/multichain-aggregator-types';
+import type * as multichain from '@luxfi/multichain-aggregator-types';
 
 import multichainConfig from 'configs/multichain';
 import { MultichainProvider } from 'lib/contexts/multichain';

ui/optimismSuperchain/address/OpSuperchainAddressLogs.tsx

@@ -1,7 +1,7 @@
 import { useRouter } from 'next/router';
 import React from 'react';
 
-import type * as multichain from '@blockscout/multichain-aggregator-types';
+import type * as multichain from '@luxfi/multichain-aggregator-types';
 
 import multichainConfig from 'configs/multichain';
 import { MultichainProvider } from 'lib/contexts/multichain';

ui/optimismSuperchain/address/OpSuperchainAddressTokenTransfers.tsx

@@ -2,7 +2,7 @@ import { HStack } from '@chakra-ui/react';
 import { useRouter } from 'next/router';
 import React from 'react';
 
-import type * as multichain from '@blockscout/multichain-aggregator-types';
+import type * as multichain from '@luxfi/multichain-aggregator-types';
 import type { TabItemRegular } from 'toolkit/components/AdaptiveTabs/types';
 
 import multichainConfig from 'configs/multichain';