diff --git a/packages/toolkit/src/lib/use-instill-form/components/regular/BooleanField.tsx b/packages/toolkit/src/lib/use-instill-form/components/regular/BooleanField.tsx
index b9e74ad74..6079c86e9 100644
--- a/packages/toolkit/src/lib/use-instill-form/components/regular/BooleanField.tsx
+++ b/packages/toolkit/src/lib/use-instill-form/components/regular/BooleanField.tsx
@@ -14,6 +14,7 @@ export const BooleanField = ({
disabled,
size,
isHidden,
+ isRequired,
}: {
shortDescription?: string;
disabled?: boolean;
@@ -30,7 +31,7 @@ export const BooleanField = ({
- {title}
+ {isRequired ? `${title} *` : title}
diff --git a/packages/toolkit/src/lib/use-instill-form/components/regular/CredentialTextField.tsx b/packages/toolkit/src/lib/use-instill-form/components/regular/CredentialTextField.tsx
index 59f7bdb21..6d4e0802c 100644
--- a/packages/toolkit/src/lib/use-instill-form/components/regular/CredentialTextField.tsx
+++ b/packages/toolkit/src/lib/use-instill-form/components/regular/CredentialTextField.tsx
@@ -15,6 +15,7 @@ export const CredentialTextField = ({
disabled,
size,
isHidden,
+ isRequired,
}: {
shortDescription?: string;
disabled?: boolean;
@@ -33,7 +34,7 @@ export const CredentialTextField = ({
- {title}
+ {isRequired ? `${title} *` : title}
diff --git a/packages/toolkit/src/lib/use-instill-form/components/regular/ImageField.tsx b/packages/toolkit/src/lib/use-instill-form/components/regular/ImageField.tsx
index 1d5a9a62b..19c28419e 100644
--- a/packages/toolkit/src/lib/use-instill-form/components/regular/ImageField.tsx
+++ b/packages/toolkit/src/lib/use-instill-form/components/regular/ImageField.tsx
@@ -17,6 +17,7 @@ export const ImageField = ({
shortDescription,
disabled,
isHidden,
+ isRequired,
}: {
shortDescription?: string;
disabled?: boolean;
@@ -36,7 +37,7 @@ export const ImageField = ({
- {title}
+ {isRequired ? `${title} *` : title}
diff --git a/packages/toolkit/src/lib/use-instill-form/components/regular/OneOfConditionField.tsx b/packages/toolkit/src/lib/use-instill-form/components/regular/OneOfConditionField.tsx
index 880e91871..1ede4d3ce 100644
--- a/packages/toolkit/src/lib/use-instill-form/components/regular/OneOfConditionField.tsx
+++ b/packages/toolkit/src/lib/use-instill-form/components/regular/OneOfConditionField.tsx
@@ -25,6 +25,7 @@ export const OneOfConditionField = ({
disabled,
size,
isHidden,
+ isRequired,
}: {
tree: InstillFormTree;
selectedConditionMap: Nullable;
@@ -85,7 +86,7 @@ export const OneOfConditionField = ({
size === "sm" ? "!product-body-text-4-semibold" : ""
}
>
- {title}
+ {isRequired ? `${title} *` : title}
diff --git a/packages/toolkit/src/lib/use-instill-form/components/regular/SingleSelectField.tsx b/packages/toolkit/src/lib/use-instill-form/components/regular/SingleSelectField.tsx
index 408d60ec3..713042c64 100644
--- a/packages/toolkit/src/lib/use-instill-form/components/regular/SingleSelectField.tsx
+++ b/packages/toolkit/src/lib/use-instill-form/components/regular/SingleSelectField.tsx
@@ -28,6 +28,7 @@ export const SingleSelectField = ({
updateForceCloseCollapsibleFormGroups,
updateForceOpenCollapsibleFormGroups,
updateIsUsingInstillCredit,
+ isRequired,
}: {
tree: InstillFormTree;
options: string[];
@@ -187,7 +188,7 @@ export const SingleSelectField = ({
- {title}
+ {isRequired ? `${title} *` : title}
diff --git a/packages/toolkit/src/lib/use-instill-form/components/regular/TextAreaField.tsx b/packages/toolkit/src/lib/use-instill-form/components/regular/TextAreaField.tsx
index f46c131da..500266a95 100644
--- a/packages/toolkit/src/lib/use-instill-form/components/regular/TextAreaField.tsx
+++ b/packages/toolkit/src/lib/use-instill-form/components/regular/TextAreaField.tsx
@@ -14,6 +14,7 @@ export const TextAreaField = ({
disabled,
size,
isHidden,
+ isRequired,
}: {
shortDescription?: string;
disabled?: boolean;
@@ -29,7 +30,7 @@ export const TextAreaField = ({
- {title}
+ {isRequired ? `${title} *` : title}
diff --git a/packages/toolkit/src/lib/use-instill-form/components/regular/TextField.tsx b/packages/toolkit/src/lib/use-instill-form/components/regular/TextField.tsx
index 6c40286ec..0dae51478 100644
--- a/packages/toolkit/src/lib/use-instill-form/components/regular/TextField.tsx
+++ b/packages/toolkit/src/lib/use-instill-form/components/regular/TextField.tsx
@@ -14,6 +14,7 @@ export const TextField = ({
disabled,
size,
isHidden,
+ isRequired,
}: {
shortDescription?: string;
disabled?: boolean;
@@ -30,7 +31,7 @@ export const TextField = ({
- {title}
+ {isRequired ? `${title} *` : title}
diff --git a/packages/toolkit/src/lib/use-instill-form/pick/pickRegularFieldsFromInstillFormTree.tsx b/packages/toolkit/src/lib/use-instill-form/pick/pickRegularFieldsFromInstillFormTree.tsx
index 7837372c5..3bd5fbfe8 100644
--- a/packages/toolkit/src/lib/use-instill-form/pick/pickRegularFieldsFromInstillFormTree.tsx
+++ b/packages/toolkit/src/lib/use-instill-form/pick/pickRegularFieldsFromInstillFormTree.tsx
@@ -287,6 +287,7 @@ export function pickRegularFieldsFromInstillFormTree(
disabled={disabledAll}
size={size}
isHidden={tree.isHidden}
+ isRequired={tree.isRequired}
/>
);
}
@@ -305,6 +306,7 @@ export function pickRegularFieldsFromInstillFormTree(
disabled={disabledAll}
size={size}
isHidden={tree.isHidden}
+ isRequired={tree.isRequired}
/>
);
}
@@ -323,6 +325,7 @@ export function pickRegularFieldsFromInstillFormTree(
disabled={disabledAll}
size={size}
isHidden={tree.isHidden}
+ isRequired={tree.isRequired}
instillCredentialMap={tree.instillCredentialMap}
updateSupportInstillCredit={updateSupportInstillCredit}
updateIsUsingInstillCredit={updateIsUsingInstillCredit}
@@ -348,11 +351,11 @@ export function pickRegularFieldsFromInstillFormTree(
shortDescription={tree.instillShortDescription}
disabled={disabledAll}
instillAcceptFormats={tree.instillAcceptFormats ?? []}
- isRequired={tree.isRequired}
instillUpstreamTypes={tree.instillUpstreamTypes ?? []}
componentID={componentID}
size={size}
isHidden={tree.isHidden}
+ isRequired={tree.isRequired}
secrets={secrets}
instillSecret={tree.instillSecret}
instillCredential={tree.instillCredential}
@@ -373,6 +376,7 @@ export function pickRegularFieldsFromInstillFormTree(
disabled={disabledAll}
size={size}
isHidden={tree.isHidden}
+ isRequired={tree.isRequired}
/>
);
}
@@ -388,11 +392,11 @@ export function pickRegularFieldsFromInstillFormTree(
shortDescription={tree.instillShortDescription}
disabled={disabledAll}
instillAcceptFormats={tree.instillAcceptFormats ?? []}
- isRequired={tree.isRequired}
instillUpstreamTypes={tree.instillUpstreamTypes ?? []}
componentID={componentID}
size={size}
isHidden={tree.isHidden}
+ isRequired={tree.isRequired}
secrets={secrets}
instillSecret={tree.instillSecret}
instillCredential={tree.instillCredential}
@@ -413,6 +417,7 @@ export function pickRegularFieldsFromInstillFormTree(
disabled={disabledAll}
size={size}
isHidden={tree.isHidden}
+ isRequired={tree.isRequired}
/>
);
}
diff --git a/packages/toolkit/src/lib/use-instill-form/types.ts b/packages/toolkit/src/lib/use-instill-form/types.ts
index bf87ac1f3..f7a7f51d3 100644
--- a/packages/toolkit/src/lib/use-instill-form/types.ts
+++ b/packages/toolkit/src/lib/use-instill-form/types.ts
@@ -154,6 +154,7 @@ export type AutoFormFieldBaseProps = {
isHidden?: boolean;
disabled?: boolean;
keyPrefix?: string;
+ isRequired?: boolean;
};
export type ZodAnyValidatorSchema = z.ZodType;