feat: Add SwapSettings

[0xAlec]

What changed? Why?

Add SwapSettings Component

This PR introduces a new SwapSettings component, providing a dropdown interface for users to customize slippage settings during swaps. The component is composed of several subcomponents that manage different aspects of the slippage settings.

Key changes and additions:

• Create SwapSettings component with subcomponents:
  • SwapSettingsSlippageDescription
  • SwapSettingsSlippageInput
  • SwapSettingsSlippageLayout
  • SwapSettingsSlippageLabel
  • SwapSettingsSlippageToggle
  • SwapSettingsSlippageLayoutBottomSheet for mobile view
• Add swapSettings SVG icon
• Update Swap component to include and render SwapSettings
• Implement click-outside functionality to close the dropdown
• Add full test coverage for all new files and components

Functionality:

• Display settings dropdown when the SVG icon is clicked
• Allow users to toggle between Auto and Custom slippage modes
• Enable custom slippage percentage input
• Provide styling and text override options for various subcomponents

This enhancement gives users more control over their swap settings while maintaining a clean and intuitive interface.
Recording:
https://www.loom.com/share/cd6e0e4954f648118ad90ef140f6b836

Notes to reviewers
see design in Slack

Fast follow PRs

• Add SwapSettingsBottomSheet for smaller screens
• Dynamically update max slippage percent using the custom input

How has it been tested?
locally

Idle states

Hover states

Override state

Responsive

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
onchainkit-coverage	❌ Failed (Inspect)			Aug 28, 2024 5:09am
onchainkit-playground	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Aug 28, 2024 5:09am
onchainkit-routes	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Aug 28, 2024 5:09am

[vercel]

Deployment failed with the following error:

You don't have permission to create a Preview Deployment for this project.

View Documentation: https://vercel.com/docs/accounts/team-members-and-roles

[cpcramer]

opened PR under my account #1176