diff --git a/libs/deal-ticket/src/components/deal-ticket/deal-ticket-limit-amount.tsx b/libs/deal-ticket/src/components/deal-ticket/deal-ticket-limit-amount.tsx
index 80da15176..6691cd12c 100644
--- a/libs/deal-ticket/src/components/deal-ticket/deal-ticket-limit-amount.tsx
+++ b/libs/deal-ticket/src/components/deal-ticket/deal-ticket-limit-amount.tsx
@@ -59,7 +59,7 @@ export const DealTicketLimitAmount = ({
},
validate: validateAmount(sizeStep, 'Size'),
}}
- render={({ field }) => (
+ render={({ field, fieldState }) => (
e.currentTarget.blur()}
+ hasError={!!fieldState.error}
{...field}
/>
)}
@@ -93,7 +94,7 @@ export const DealTicketLimitAmount = ({
},
validate: validateAmount(priceStep, 'Price'),
}}
- render={({ field }) => (
+ render={({ field, fieldState }) => (
e.currentTarget.blur()}
+ hasError={!!fieldState.error}
{...field}
/>
)}
diff --git a/libs/deal-ticket/src/components/deal-ticket/deal-ticket-market-amount.tsx b/libs/deal-ticket/src/components/deal-ticket/deal-ticket-market-amount.tsx
index c8ab0c2c0..a370bc78a 100644
--- a/libs/deal-ticket/src/components/deal-ticket/deal-ticket-market-amount.tsx
+++ b/libs/deal-ticket/src/components/deal-ticket/deal-ticket-market-amount.tsx
@@ -45,7 +45,7 @@ export const DealTicketMarketAmount = ({
},
validate: validateAmount(sizeStep, 'Size'),
}}
- render={({ field }) => (
+ render={({ field, fieldState }) => (
e.currentTarget.blur()}
data-testid="order-size"
+ hasError={!!fieldState.error}
{...field}
/>
)}
diff --git a/libs/deal-ticket/src/components/deal-ticket/deal-ticket-stop-order.tsx b/libs/deal-ticket/src/components/deal-ticket/deal-ticket-stop-order.tsx
index 4cd48641c..754bf3a03 100644
--- a/libs/deal-ticket/src/components/deal-ticket/deal-ticket-stop-order.tsx
+++ b/libs/deal-ticket/src/components/deal-ticket/deal-ticket-stop-order.tsx
@@ -246,7 +246,7 @@ export const StopOrder = ({ market, marketPrice, submit }: StopOrderProps) => {
validate: validateAmount(priceStep, 'Price'),
}}
control={control}
- render={({ field }) => {
+ render={({ field, fieldState }) => {
const { value, ...props } = field;
return (
@@ -256,6 +256,7 @@ export const StopOrder = ({ market, marketPrice, submit }: StopOrderProps) => {
step={priceStep}
appendElement={asset.symbol}
value={value || ''}
+ hasError={!!fieldState.error}
{...props}
/>
@@ -294,7 +295,7 @@ export const StopOrder = ({ market, marketPrice, submit }: StopOrderProps) => {
'Trailing percentage offset'
),
}}
- render={({ field }) => {
+ render={({ field, fieldState }) => {
const { value, ...props } = field;
return (
@@ -304,6 +305,7 @@ export const StopOrder = ({ market, marketPrice, submit }: StopOrderProps) => {
appendElement="%"
data-testid="triggerTrailingPercentOffset"
value={value || ''}
+ hasError={!!fieldState.error}
{...props}
/>
@@ -358,7 +360,7 @@ export const StopOrder = ({ market, marketPrice, submit }: StopOrderProps) => {
},
validate: validateAmount(sizeStep, 'Size'),
}}
- render={({ field }) => {
+ render={({ field, fieldState }) => {
const { value, ...props } = field;
return (
{
onWheel={(e) => e.currentTarget.blur()}
data-testid="order-size"
value={value || ''}
+ hasError={!!fieldState.error}
{...props}
/>
);
@@ -397,7 +400,7 @@ export const StopOrder = ({ market, marketPrice, submit }: StopOrderProps) => {
},
validate: validateAmount(priceStep, 'Price'),
}}
- render={({ field }) => {
+ render={({ field, fieldState }) => {
const { value, ...props } = field;
return (
{
data-testid="order-price"
onWheel={(e) => e.currentTarget.blur()}
value={value || ''}
+ hasError={!!fieldState.error}
{...props}
/>
);
@@ -449,11 +453,12 @@ export const StopOrder = ({ market, marketPrice, submit }: StopOrderProps) => {
(
+ render={({ field, fieldState }) => (