Order Form

'use client'

import * as React from 'react'
import { ChevronDown, AlertCircle, CheckCircle, X } from 'lucide-react'
import { cn } from '@/lib/utils'

export type OrderType = 'market' | 'limit' | 'stop_loss'
export type OrderSide = 'buy' | 'sell'

export interface OrderFormValues {
  type: OrderType
  side: OrderSide
  price: number
  amount: number
  stopPrice: number
  stopLoss?: number
  takeProfit?: number
}

export interface OrderFormProps {
  symbol: string
  exchange?: string
  market?: string
  stepSize?: number
  available?: number
  maxAmount?: number
  minAmount?: number
  minPrice?: number
  onSubmit?: (values: OrderFormValues) => void
  className?: string
}

// Market/Limit/Stop tabs, price + quantity (with steppers) fields, advanced
// stop-loss/take-profit options, estimated cost & commission, and Buy/Sell
// buttons. State is local; emits onSubmit on a valid Buy/Sell click. Invalid
// fields show a red border and message after blur or submit (amount > 0 /
// >= minAmount; price > 0 / >= minPrice for limit & stop orders).