chore: polish

.changeset/fuzzy-eggs-cross.md

@@ -2,4 +2,4 @@
 "@coinbase/onchainkit": patch
 ---
 
-- **feat**: introduce Inter font-family and internal text components. By @kyhyco #506
+- **feat**: introduce `Inter` font-family and internal text components. By @kyhyco #506

src/internal/text/TextBody.tsx

@@ -1,12 +1,12 @@
-import { ReactNode } from 'react';
+import type { ReactNode } from 'react';
 
 type TextBodyReact = {
   children: ReactNode;
 };
 
 export function TextBody({ children }: TextBodyReact) {
   return (
-    <span className="text-sans text-base leading-normal text-black">
+    <span className='text-base text-black text-sans leading-normal'>
       {children}
     </span>
   );

src/internal/text/TextCaption.tsx

@@ -1,4 +1,4 @@
-import { ReactNode } from 'react';
+import type { ReactNode } from 'react';
 
 type TextCaptionReact = {
   children: ReactNode;
@@ -7,6 +7,6 @@ type TextCaptionReact = {
 /* istanbul ignore next */
 export function TextCaption({ children }: TextCaptionReact) {
   return (
-    <span className="text-sans text-bold text-xs leading-4">{children}</span>
+    <span className='text-bold text-sans text-xs leading-4'>{children}</span>
   );
 }

src/internal/text/TextHeadline.tsx

@@ -1,12 +1,12 @@
-import { ReactNode } from 'react';
+import type { ReactNode } from 'react';
 
 type TextHeadlineReact = {
   children: ReactNode;
 };
 
 export function TextHeadline({ children }: TextHeadlineReact) {
   return (
-    <span className="text-sans text-base leading-normal text-bold text-[#0A0B0D]">
+    <span className='text-[#0A0B0D] text-base text-bold text-sans leading-normal'>
       {children}
     </span>
   );

src/internal/text/TextLabel1.tsx

@@ -1,4 +1,4 @@
-import { ReactNode } from 'react';
+import type { ReactNode } from 'react';
 
 type TextLabel1React = {
   children: ReactNode;
@@ -7,7 +7,7 @@ type TextLabel1React = {
 /* istanbul ignore next */
 export function TextLabel1({ children }: TextLabel1React) {
   return (
-    <span className="text-sans text-bold text-sm leading-5 text-[#0A0B0D]">
+    <span className='text-[#0A0B0D] text-bold text-sans text-sm leading-5'>
       {children}
     </span>
   );

src/internal/text/TextLabel2.tsx

@@ -1,4 +1,4 @@
-import { ReactNode } from 'react';
+import type { ReactNode } from 'react';
 
 type TextLabel2React = {
   children: ReactNode;
@@ -7,7 +7,7 @@ type TextLabel2React = {
 /* istanbul ignore next */
 export function TextLabel2({ children }: TextLabel2React) {
   return (
-    <span className="text-sans text-sm leading-5 text-[#0A0B0D]">
+    <span className='text-[#0A0B0D] text-sans text-sm leading-5'>
       {children}
     </span>
   );

src/internal/text/TextLegal.tsx

@@ -1,4 +1,4 @@
-import { ReactNode } from 'react';
+import type { ReactNode } from 'react';
 
 type TextLegalReact = {
   children: ReactNode;

src/swap/components/SwapAmountInput.test.tsx

@@ -6,7 +6,7 @@ import { render, screen, fireEvent } from '@testing-library/react';
 import '@testing-library/jest-dom';
 import { SwapAmountInput } from './SwapAmountInput';
 import { SwapContext } from '../context';
-import { type Token } from '../../token';
+import type { Token } from '../../token';
 import type { SwapContextType } from '../types';
 import type { Address } from 'viem';
 

src/swap/components/SwapAmountInput.tsx

@@ -83,7 +83,7 @@ export function SwapAmountInput({ label, token, type }: SwapAmountInputReact) {
       <div className="flex w-full items-center justify-between">
         <label className="font-semibold text-[#030712] text-sm">{label}</label>
         {roundedBalance && (
-          <label className="text-sm font-normal text-gray-400">{`Balance: ${roundedBalance}`}</label>
+          <label className='font-normal text-gray-400 text-sm'>{`Balance: ${roundedBalance}`}</label>
         )}
       </div>
       <div className="flex w-full items-center justify-between">
@@ -92,8 +92,8 @@ export function SwapAmountInput({ label, token, type }: SwapAmountInputReact) {
           <button
             className={cn(
               'flex h-8 w-[58px] max-w-[200px] items-center rounded-[40px]',
-              'bg-gray-100 px-3 py-2 text-base font-medium',
-              'not-italic leading-6 text-gray-500',
+              'bg-gray-100 px-3 py-2 font-medium text-base',
+              'text-gray-500 not-italic leading-6',
             )}
             data-testid="ockSwapAmountInput_MaxButton"
             disabled={roundedBalance === undefined}

src/swap/utils.ts

@@ -17,11 +17,11 @@ export function isSwapError(response: unknown): response is SwapError {
 
 export function formatTokenAmount(amount: string, decimals: number) {
   // Convert the string amount to a number using decimals value
-  const numberAmount = Number(amount) / Math.pow(10, decimals);
+  const numberAmount = Number(amount) / 10 ** decimals;
   return numberAmount.toString();
 }
 
 export function getRoundedAmount(balance: string, fractionDigits: number) {
-  const parsedBalance = parseFloat(balance);
+  const parsedBalance = Number.parseFloat(balance);
   return Number(parsedBalance)?.toFixed(fractionDigits).replace(/0+$/, '');
 }

src/version.ts

@@ -1 +1 @@
-export const version = '0.20.6';
+export const version = '0.20.7';