From b427e8dedfb4bd4aaf289e101ff6f0d660d0425d Mon Sep 17 00:00:00 2001
From: Lucas Chociay <lucas@basistheory.com>
Date: Fri, 7 Oct 2022 12:23:18 -0300
Subject: [PATCH] feat: add value prop to elements create and update objects
 (#237)

---
 src/types/elements/options.ts | 29 +++++++++++++++++++++++++----
 1 file changed, 25 insertions(+), 4 deletions(-)

diff --git a/src/types/elements/options.ts b/src/types/elements/options.ts
index b5d7d05c..1e069dba 100644
--- a/src/types/elements/options.ts
+++ b/src/types/elements/options.ts
@@ -30,6 +30,7 @@ interface SanitizedElementOptions {
   iconPosition?: string;
   cardBrand?: string;
   autoComplete?: string;
+  value?: string;
 }
 
 type ElementOptions = ElementInternalOptions & SanitizedElementOptions;
@@ -47,12 +48,29 @@ interface AutoCompleteOption {
 type CustomizableElementOptions = Pick<ElementOptions, 'style' | 'disabled'> &
   AutoCompleteOption;
 
-type CreateCardElementOptions = CustomizableElementOptions;
+interface CardElementValue {
+  number?: string;
+  // disabling camecalse so that the element value matches the API data
+  /* eslint-disable camelcase */
+  expiration_month?: number;
+  expiration_year?: number;
+  /* eslint-enable camelcase */
+  cvc?: string;
+}
+
+interface CardExpirationDateValue {
+  month: number;
+  year: number;
+}
+
+type CreateCardElementOptions = CustomizableElementOptions & {
+  value?: CardElementValue;
+};
 
 type UpdateCardElementOptions = CreateCardElementOptions;
 
 type CreateTextElementOptions = CustomizableElementOptions &
-  Pick<ElementOptions, 'placeholder' | 'mask' | 'password'> &
+  Pick<ElementOptions, 'placeholder' | 'mask' | 'password' | 'value'> &
   TransformOption &
   Required<Pick<ElementOptions, 'targetId'>> & {
     'aria-label'?: string;
@@ -64,7 +82,7 @@ type UpdateTextElementOptions = Omit<
 >;
 
 type CreateCardNumberElementOptions = CustomizableElementOptions &
-  Pick<ElementOptions, 'placeholder' | 'iconPosition'> &
+  Pick<ElementOptions, 'placeholder' | 'iconPosition' | 'value'> &
   Required<Pick<ElementOptions, 'targetId'>> & {
     'aria-label'?: string;
   };
@@ -78,6 +96,7 @@ type CreateCardExpirationDateElementOptions = CustomizableElementOptions &
   Pick<ElementOptions, 'placeholder'> &
   Required<Pick<ElementOptions, 'targetId'>> & {
     'aria-label'?: string;
+    value?: CardExpirationDateValue;
   };
 
 type UpdateCardExpirationDateElementOptions = Omit<
@@ -86,7 +105,7 @@ type UpdateCardExpirationDateElementOptions = Omit<
 >;
 
 type CreateCardVerificationCodeElementOptions = CustomizableElementOptions &
-  Pick<ElementOptions, 'placeholder' | 'cardBrand'> &
+  Pick<ElementOptions, 'placeholder' | 'cardBrand' | 'value'> &
   Required<Pick<ElementOptions, 'targetId'>> & {
     'aria-label'?: string;
   };
@@ -113,6 +132,8 @@ export type {
   UpdateCardExpirationDateElementOptions,
   CreateCardVerificationCodeElementOptions,
   UpdateCardVerificationCodeElementOptions,
+  CardElementValue,
+  CardExpirationDateValue,
 };
 
 export { ELEMENTS_TYPES };