@xyo-network/react-form-credit-card 4.1.8 → 4.1.9

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (4) hide show
  1. package/dist/browser/index.mjs +1 -1
  2. package/dist/browser/index.mjs.map +1 -1
  3. package/package.json +13 -11
  4. package/src/components/form/Form.tsx +1 -1
package/dist/browser/index.mjs CHANGED
@@ -791,8 +791,8 @@ var CreditCardZipWithFormControl = /* @__PURE__ */ __name(({ formControlName = "
791
791
 
792
792
  // src/components/form/Form.tsx
793
793
  import { Stack as Stack2 } from "@mui/material";
794
+ import { ErrorRender } from "@xylabs/react-error";
794
795
  import { FlexCol } from "@xylabs/react-flexbox";
795
- import { ErrorRender } from "@xyo-network/react-error";
796
796
  import React10, { useState as useState3 } from "react";
797
797
 
798
798
  // src/components/support/Fields.ts
package/dist/browser/index.mjs.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/components/controls/card/cvv/Cvv.tsx","../../src/controls/CreditCardCvv.ts","../../src/utils/umask.ts","../../src/controls/CreditCardExpiry.ts","../../src/controls/CreditCardNumber.ts","../../src/controls/Email.ts","../../src/controls/Name.ts","../../src/controls/Zip.ts","../../src/components/controls/card/FormControlTextField.tsx","../../src/components/controls/card/cvv/use.ts","../../src/context/FormGroupCreditCardContext.ts","../../src/context/FormGroupCreditCardProvider.tsx","../../src/context/useFormGroupWithCreditCard.tsx","../../src/components/controls/card/useCreditCardFormControl.tsx","../../src/components/controls/card/Email.tsx","../../src/components/controls/card/Expiration.tsx","../../src/components/controls/card/Name.tsx","../../src/components/controls/card/number/Number.tsx","../../src/components/img/index.ts","../../src/components/controls/card/Options.ts","../../src/components/controls/card/number/use.ts","../../src/components/controls/card/Zip.tsx","../../src/components/form/Form.tsx","../../src/components/support/Fields.ts","../../src/components/support/validateCreditCardInputs.ts","../../src/models/CreditCardInput.ts","../../src/components/form/InputFieldsStack.tsx","../../src/components/form/useFormStorage.tsx"],"sourcesContent":["import React from 'react'\n\nimport { CreditCardCvvFormControl } from '../../../../controls/index.ts'\nimport type { WithFormControlProps } from '../../WithFormControlProps.ts'\nimport { FormControlTextField } from '../FormControlTextField.tsx'\nimport { useCreditCardCvvFormControl } from './use.ts'\n\nexport const CreditCardCvvWithFormControl: React.FC<WithFormControlProps> = ({\n formControlName = 'cvc', fieldLabel = 'CVC', ...props\n}) => {\n const {\n creditCardFormControl, error, inputRef, value,\n } = useCreditCardCvvFormControl(formControlName, undefined, CreditCardCvvFormControl)\n const {\n autoComplete, autoCorrect, id, inputMode, name, spellCheck, ...cvcProps\n } = creditCardFormControl?.props ?? {}\n\n return (\n <FormControlTextField\n fieldLabel={fieldLabel}\n formControl={creditCardFormControl}\n formControlError={error}\n inputMode={inputMode}\n inputProps={{\n 'aria-label': `${fieldLabel} number on the back of your card`, autoComplete, autoCorrect, id, name, spellCheck,\n }}\n inputRef={inputRef}\n value={value}\n {...cvcProps}\n {...props}\n />\n )\n}\n","import { assertEx } from '@xylabs/assert'\nimport type { EmptyObject } from '@xylabs/object'\nimport type { AbstractControl } from '@xyo-network/react-form-group'\nimport { FormControlBase } from '@xyo-network/react-form-group'\nimport valid from 'card-validator'\n\nimport { unmask } from '../utils/index.ts'\n\nconst CONTROL_NAME = 'cvv'\n\nexport class CreditCardCvvFormControl<TProps extends EmptyObject = EmptyObject> extends FormControlBase<TProps> {\n override invalidMessage = 'Your card cvc is invalid.'\n\n override pattern = /^\\d{0,4}$/\n override patternStrict = /^\\d{1,4}$/\n\n override props = {\n autoComplete: 'cc-csc',\n autoCorrect: 'off',\n id: CONTROL_NAME,\n inputMode: 'numeric',\n name: CONTROL_NAME,\n placeholder: 'CVC',\n spellCheck: false,\n } as TProps\n\n override required = true\n\n override unmask = unmask\n\n private _cardNumberFormControl: AbstractControl | undefined = undefined\n\n constructor() {\n super()\n super.setName(CONTROL_NAME)\n this.setSerializeSettings({ sensitive: true, serializable: true })\n }\n\n get cardNumberFormControl() {\n return assertEx(this._cardNumberFormControl, () => 'Card number form control is not set')\n }\n\n override blurError(value: string) {\n const num = this.cardNumberFormControl.value\n const max = this.getCardNumberCvcMax(num)\n const cvvValidation = valid.cvv(value, max)\n if (cvvValidation.isValid) {\n this.setError('')\n this.setStatus('VALID')\n } else {\n this.setError(this.invalidMessage)\n this.setStatus('INVALID')\n }\n }\n\n override changeError(value: string) {\n const unmasked = this.unmask(value)\n const match = unmasked.match(this.patternStrict)\n if (match) {\n const num = this.cardNumberFormControl.value\n const max = this.getCardNumberCvcMax(num)\n const cvvValidation = valid.cvv(value, max)\n if (cvvValidation.isPotentiallyValid) {\n this.setError('')\n this.setStatus('VALID')\n } else {\n this.setError('Your card cvc is invalid.')\n this.setStatus('INVALID')\n }\n } else {\n this.setError(this.invalidMessage)\n this.setStatus('INVALID')\n }\n }\n\n setCardNumberFormControl(cardNumberFormControl: AbstractControl) {\n this._cardNumberFormControl = cardNumberFormControl\n }\n\n private getCardNumberCvcMax(num?: string) {\n if (!num) return 3\n const numberValidation = valid.number(num)\n return numberValidation.card ? numberValidation.card.code.size : 3\n }\n}\n","export function unmask(value: string) {\n return value.replaceAll(/\\D/g, '')\n}\n","import { assertEx } from '@xylabs/assert'\nimport type { EmptyObject } from '@xylabs/object'\nimport type { AbstractControl } from '@xyo-network/react-form-group'\nimport { FormControlBase } from '@xyo-network/react-form-group'\nimport valid from 'card-validator'\n\nimport { unmask } from '../utils/index.ts'\n\nconst CONTROL_NAME = 'expiration'\n\nexport class CreditCardExpirationFormControl<TProps extends EmptyObject = EmptyObject> extends FormControlBase {\n override invalidMessage = 'Card Expiration is invalid'\n\n override pattern = /^\\d{0,4}$/\n override patternStrict = /^\\d{1,4}$/\n\n override props = {\n autoComplete: 'cc-exp',\n autoCorrect: 'off',\n id: CONTROL_NAME,\n inputMode: 'numeric',\n name: CONTROL_NAME,\n placeholder: 'MM / YY',\n spellCheck: false,\n } as TProps\n\n override required = true\n\n override unmask = unmask\n\n private _cardNumberFormControl: AbstractControl | undefined = undefined\n\n constructor() {\n super()\n super.setName(CONTROL_NAME)\n this.setSerializeSettings({ sensitive: true, serializable: true })\n }\n\n get cardNumberFormControl() {\n return assertEx(this._cardNumberFormControl, () => 'Card number form control is not set')\n }\n\n // make it so the raw value is the same to preserve the / separator in the value\n override get rawValue() {\n return this.value\n }\n\n override blurError(value: string) {\n const unmasked = unmask(value)\n const expirationValid = valid.expirationDate(unmasked)\n if (!unmasked || (unmasked && unmasked.length !== 4)) {\n this.setErrorAndValidity('Your card expiration is incomplete.', 'INVALID')\n } else if (expirationValid.isValid) {\n this.setErrorAndValidity('', 'VALID')\n } else {\n this.setErrorAndValidity(\"Your card's expiration year is in the past.\", 'INVALID')\n }\n }\n\n override changeError(value: string) {\n const unmasked = this.unmask(value)\n const expirationValid = valid.expirationDate(unmasked)\n if (expirationValid.isPotentiallyValid) {\n this.setErrorAndValidity('', 'VALID')\n } else if (expirationValid.isValid) {\n this.setErrorAndValidity('', 'VALID')\n } else {\n this.setErrorAndValidity(\"Your card's expiration year is in the past.\", 'INVALID')\n }\n }\n\n override mask(value: string) {\n if (/^[2-9]/.test(unmask(value))) {\n return this.makeMask(' / ', 2)(`0${value}`)\n }\n return this.makeMask(' / ', 2)(value)\n }\n\n private makeMask(separator: string, limit: number) {\n return (value: string) => {\n const output: string[] = []\n // eslint-disable-next-line unicorn/no-for-loop\n for (let i = 0; i < value.length; i++) {\n if (i !== 0 && i % limit === 0) {\n output.push(separator)\n }\n\n output.push(value[i])\n }\n\n return output.join('')\n }\n }\n}\n","import type { EmptyObject } from '@xylabs/object'\nimport type { SetOptions, ValidControlValue } from '@xyo-network/react-form-group'\nimport { FormControlBase } from '@xyo-network/react-form-group'\nimport valid from 'card-validator'\n\nimport { unmask } from '../utils/index.ts'\n\nconst CONTROL_NAME = 'cardNumber2'\n\nexport class CreditCardNumberFormControl<TProps extends EmptyObject = EmptyObject> extends FormControlBase<TProps> {\n creditCardType: string = ''\n\n override invalidMessage = 'Card Number is invalid'\n\n override pattern = /^(\\d+)?$/\n override patternStrict = /^\\d+$/\n\n override props = {\n autoComplete: 'cc-number',\n autoCorrect: 'off',\n id: CONTROL_NAME,\n inputMode: 'numeric',\n name: CONTROL_NAME,\n placeholder: '1234 1234 1234 1234',\n spellCheck: false,\n } as TProps\n\n override required = true\n\n override unmask = unmask\n\n constructor() {\n super()\n super.setName(CONTROL_NAME)\n this.setSerializeSettings({ sensitive: true, serializable: true })\n }\n\n override blurError(value: string) {\n const unmasked = unmask(value)\n const numberValidation = valid.number(unmasked)\n if (!numberValidation.isValid) {\n this.setErrorAndValidity(this.invalidMessage, 'INVALID')\n return\n }\n this.setErrorAndValidity('', 'VALID')\n }\n\n override changeError(value: string) {\n const unmasked = unmask(value)\n const match = unmasked.match(this.patternStrict)\n if (match) {\n const numberValidation = valid.number(unmasked)\n if (!numberValidation.isPotentiallyValid) {\n this.setErrorAndValidity(this.invalidMessage, 'INVALID')\n return\n }\n this.setErrorAndValidity('', 'VALID')\n } else {\n this.setErrorAndValidity(this.invalidMessage, 'INVALID')\n }\n }\n\n earlyNumberCheck(number: string) {\n switch (number) {\n case '4': {\n this.setCreditCardType('visa')\n break\n }\n case '5': {\n this.setCreditCardType('mastercard')\n break\n }\n case '3': {\n this.setCreditCardType('amex')\n break\n }\n case '6': {\n this.setCreditCardType('discover')\n break\n }\n default: {\n this.setCreditCardType('')\n }\n }\n }\n\n override getCursorPosition() {\n if (this.value) {\n const previousValue = this.previousValue ?? ''\n const unmasked = unmask(this.value)\n const numberValidation = valid.number(unmasked)\n const card = numberValidation.card\n const lengthChange = this.value.length - (previousValue?.length ?? 0)\n const unmaskedChange = unmask(this.value).length - unmask(previousValue).length\n\n if (card) {\n const gaps = card.gaps\n const oldCursor = this.cursorPosition.previous ?? 0\n const oldSeparation = gaps.filter((gap, i) => gap + i < oldCursor).length\n const newSeparation = gaps.filter((gap, i) => gap + i < oldCursor + lengthChange).length\n const newCursor = oldCursor - oldSeparation + newSeparation + unmaskedChange\n return newCursor\n }\n }\n\n return\n }\n\n override mask(value: ValidControlValue = '') {\n const unmasked = unmask(value)\n const numberValidation = valid.number(unmasked)\n const card = numberValidation.card\n\n if (card) {\n const max = card.lengths.includes(16) ? 16 : card.lengths[0]\n const gaps = [...card.gaps, max]\n const newVal = gaps\n .map((gap, i) => unmasked.slice(gaps[i - 1] || 0, gap))\n .filter(Boolean)\n .join(' ')\n\n return newVal\n }\n\n return value\n }\n\n onCreditCardTypeChange: (type: string) => void = () => {}\n\n setCreditCardType(type: string) {\n this.creditCardType = type\n this.onCreditCardTypeChange(type)\n }\n\n override setValue(value = '', options: SetOptions) {\n const umMasked = this.unmask(value)\n super.setValue(umMasked, options)\n this.earlyNumberCheck(umMasked.charAt(0))\n }\n}\n","import type { EmptyObject } from '@xylabs/object'\nimport { FormControlBase } from '@xyo-network/react-form-group'\n\nconst CONTROL_NAME = 'Email'\n\nexport class CreditCardEmailFormControl<TProps extends EmptyObject = EmptyObject> extends FormControlBase<TProps> {\n override invalidMessage = 'Your email is invalid.'\n\n override pattern = /^.*$/\n override patternStrict = /^([\\w+.\\-])+@(([\\dA-Za-z-])+\\.)+([\\dA-Za-z]{2,4})+$/\n\n override props = {\n autoComplete: 'email',\n autoCorrect: 'off',\n id: CONTROL_NAME.toLocaleLowerCase(),\n name: CONTROL_NAME.toLocaleLowerCase(),\n placeholder: 'jerry.smith@email.com',\n spellCheck: false,\n } as TProps\n\n override required = true\n\n constructor() {\n super()\n super.setName(CONTROL_NAME)\n this.setSerializeSettings({ sensitive: false, serializable: true })\n }\n\n override blurError(value: string) {\n const match = value.match(this.patternStrict)\n this.updateValidation(match)\n }\n\n override changeError(value: string) {\n if (this.error) {\n this.blurError(value)\n }\n }\n\n private updateValidation(match: RegExpMatchArray | null) {\n if (match) {\n this.setErrorAndValidity('', 'VALID')\n } else {\n this.setErrorAndValidity(this.invalidMessage, 'INVALID')\n }\n }\n}\n","import type { EmptyObject } from '@xylabs/object'\nimport { FormControlBase } from '@xyo-network/react-form-group'\n\nexport class NameFormControl<TProps extends EmptyObject = EmptyObject> extends FormControlBase<TProps> {\n override required = true\n\n constructor(\n private nameLabel: string,\n autoCompleteLabel: string,\n placeHolder: string,\n ) {\n super()\n super.setName(nameLabel)\n this.setSerializeSettings({ sensitive: false, serializable: true })\n this.invalidMessage = `${nameLabel} name is missing.`\n this.props = {\n autoComplete: autoCompleteLabel,\n autoCorrect: 'off',\n id: this.nameLabel,\n name: this.nameLabel,\n placeholder: placeHolder,\n spellCheck: false,\n } as TProps\n }\n\n override blurError(value: string) {\n if (value) {\n this.setErrorAndValidity('', 'VALID')\n } else {\n this.setErrorAndValidity(this.invalidMessage, 'INVALID')\n }\n }\n\n override changeError(value: string): void {\n this.blurError(value)\n }\n}\n","import type { EmptyObject } from '@xylabs/object'\nimport { FormControlBase } from '@xyo-network/react-form-group'\nimport valid from 'card-validator'\n\nimport { unmask } from '../utils/index.ts'\n\nconst CONTROL_NAME = 'Zip'\n\nexport class CreditCardZipFormControl<TProps extends EmptyObject = EmptyObject> extends FormControlBase<TProps> {\n override invalidMessage = 'Your zip code is invalid.'\n\n override props = {\n autoComplete: 'postal-code',\n autoCorrect: 'off',\n id: CONTROL_NAME.toLocaleLowerCase(),\n name: CONTROL_NAME.toLocaleLowerCase(),\n placeholder: '12345',\n spellCheck: false,\n } as TProps\n\n override required = true\n\n override unmask = unmask\n\n constructor() {\n super()\n super.setName(CONTROL_NAME)\n this.setSerializeSettings({ sensitive: true, serializable: true })\n }\n\n override blurError(value: string) {\n const postalCodeValidation = valid.postalCode(value)\n if (postalCodeValidation.isValid) {\n this.setErrorAndValidity('', 'VALID')\n } else {\n this.setErrorAndValidity(this.invalidMessage, 'INVALID')\n }\n }\n\n override changeError(value: string) {\n const unmasked = this.unmask(value)\n const match = unmasked.match(this.patternStrict)\n if (match) {\n const postalCodeValidation = valid.postalCode(value)\n if (postalCodeValidation.isPotentiallyValid) {\n this.setErrorAndValidity('', 'VALID')\n } else {\n this.setErrorAndValidity('Your zip code is invalid.', 'INVALID')\n }\n } else {\n this.setErrorAndValidity(this.invalidMessage, 'INVALID')\n }\n }\n}\n","import type { StandardTextFieldProps } from '@mui/material'\nimport { FormControl as MuiFormControl, TextField } from '@mui/material'\nimport type { FormControl } from '@xyo-network/react-form-group'\nimport { LabeledTextFieldWrapper } from '@xyo-network/react-shared'\nimport type {\n ChangeEventHandler, FocusEventHandler, KeyboardEvent,\n} from 'react'\nimport React, { forwardRef } from 'react'\n\nexport interface FormControlTextFieldProps extends StandardTextFieldProps {\n fieldLabel: string\n formControl?: FormControl<StandardTextFieldProps>\n formControlError?: string\n}\n\nexport const FormControlTextField = forwardRef<HTMLDivElement, FormControlTextFieldProps>(\n ({\n formControl, formControlError, fieldLabel = '', ...props\n }, ref) => {\n const { name } = formControl?.props ?? {}\n\n const handleChange: ChangeEventHandler<HTMLInputElement> = (event) => {\n formControl?.setValue(event.target.value)\n }\n\n const handleBlur: FocusEventHandler<HTMLInputElement> = (event) => {\n formControl?.blurError?.(event.target.value)\n formControl?.setTouched(true)\n }\n\n return (\n <MuiFormControl fullWidth>\n <LabeledTextFieldWrapper label={fieldLabel}>\n <label htmlFor={name}>\n <TextField\n error={!!formControlError}\n helperText={formControlError || ' '}\n fullWidth\n hiddenLabel\n name={name}\n onBlur={handleBlur}\n onChange={handleChange}\n onKeyDown={(event: KeyboardEvent<HTMLInputElement>) => {\n // See - https://github.com/DefinitelyTyped/DefinitelyTyped/issues/11508#issuecomment-256045682\n // .currentTarget is the div in mui that emits the event, .target is the input element\n // Unfortunately, the type definitions do not let you pass a generic specifically for target, only currentTarget\n const selectionEnd = (event.target as HTMLInputElement).selectionEnd\n if (selectionEnd && formControl) {\n formControl.cursorPosition.previous = selectionEnd\n }\n }}\n ref={ref}\n required={formControl?.required}\n size=\"small\"\n variant=\"filled\"\n {...props}\n />\n </label>\n </LabeledTextFieldWrapper>\n </MuiFormControl>\n )\n },\n)\n\nFormControlTextField.displayName = 'FormControlTextField'\n","import type { StandardTextFieldProps } from '@mui/material'\nimport type { FormControlBase } from '@xyo-network/react-form-group'\nimport { useEffect } from 'react'\n\nimport { useFormGroupWithCreditCardInput } from '../../../../context/index.ts'\nimport type { CreditCardCvvFormControl } from '../../../../controls/index.ts'\nimport { useCreditCardFormControl } from '../useCreditCardFormControl.tsx'\n\nexport const useCreditCardCvvFormControl = (\n formControlName?: string,\n cardNumberControlName = 'cardNumber',\n control?: new () => FormControlBase<StandardTextFieldProps>,\n) => {\n const {\n creditCardFormControl, error, value, inputRef,\n } = useCreditCardFormControl(formControlName, control)\n\n // only use FormGroupContext when name is passed\n const { formGroup } = useFormGroupWithCreditCardInput(!!formControlName)\n\n const creditCardNumberFormControl = formGroup?.getControl?.(cardNumberControlName)\n\n useEffect(() => {\n if (creditCardNumberFormControl) {\n const castControl = creditCardFormControl as CreditCardCvvFormControl\n if (!castControl.setCardNumberFormControl) {\n console.error('cannot setCardNumberFormControl on control because it is not a CreditCardCvvFormControl')\n return\n }\n castControl.setCardNumberFormControl(creditCardNumberFormControl)\n }\n }, [creditCardFormControl, creditCardNumberFormControl])\n\n return {\n creditCardFormControl, error, inputRef, value,\n }\n}\n","import type { FormGroupContextWithPayloadState } from '@xyo-network/react-form-group'\nimport { createContextEx } from '@xyo-network/react-shared'\n\nimport type { CreditCardInput } from '../models/index.ts'\n\nexport const FormGroupCreditCardContext = createContextEx<FormGroupContextWithPayloadState<CreditCardInput, CreditCardInput>>()\n","import type { Payload } from '@xyo-network/payload-model'\nimport type { FormGroupParams } from '@xyo-network/react-form-group'\nimport { FormGroup } from '@xyo-network/react-form-group'\nimport type { PropsWithChildren } from 'react'\nimport React, { useMemo } from 'react'\n\nimport type { CreditCardInput } from '../models/index.ts'\nimport { FormGroupCreditCardContext } from './FormGroupCreditCardContext.ts'\n\nexport interface FormGroupCreditCardProviderProps<TStorage extends Payload = Payload> extends PropsWithChildren {\n params?: FormGroupParams<TStorage>\n}\n\nexport const FormGroupCreditCardProvider: React.FC<FormGroupCreditCardProviderProps<CreditCardInput>> = ({\n children, params, ...props\n}) => {\n const formGroup = useMemo(() => {\n const formGroup = new FormGroup<CreditCardInput, CreditCardInput>(params)\n return formGroup\n }, [params])\n\n const value = useMemo(() => ({ formGroup, provided: true }), [formGroup])\n\n return (\n\n <FormGroupCreditCardContext.Provider\n value={value}\n {...props}\n >\n {children}\n </FormGroupCreditCardContext.Provider>\n )\n}\n","import { useContextEx } from '@xyo-network/react-shared'\n\nimport { FormGroupCreditCardContext } from './FormGroupCreditCardContext.ts'\n\nexport const useFormGroupWithCreditCardInput = (required = false) => {\n return useContextEx(FormGroupCreditCardContext, 'FormGroupCreditCard', required)\n}\n","import type { StandardTextFieldProps } from '@mui/material'\nimport type { FormControlBase, ValidControlValue } from '@xyo-network/react-form-group'\nimport {\n useMemo, useRef, useState,\n} from 'react'\n\nimport { useFormGroupWithCreditCardInput } from '../../../context/index.ts'\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nconst STABLE_DEFAULT_ARGS: any[] = [] as const\n\nexport const useCreditCardFormControl = (\n formControlName?: string,\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n Control?: new (...args: any[]) => FormControlBase<StandardTextFieldProps>,\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n args: any[] = STABLE_DEFAULT_ARGS,\n) => {\n const [error, setError] = useState('')\n const [value, setValue] = useState<ValidControlValue>('')\n const inputRef = useRef<HTMLInputElement>(null)\n\n // only use FormGroupContext when name is passed\n const { formGroup } = useFormGroupWithCreditCardInput(!!formControlName)\n\n const creditCardFormControl = useMemo(() => {\n if (Control) {\n const control = new Control(...args)\n control.registerOnErrorChange((newError: string) => setError(newError))\n control.registerOnChange((value: ValidControlValue) => setValue(value))\n\n if (formControlName) formGroup?.registerControl(formControlName, control)\n return control\n }\n }, [Control, args, formControlName, formGroup])\n\n return {\n creditCardFormControl, error, inputRef, value,\n }\n}\n","import React from 'react'\n\nimport { CreditCardEmailFormControl } from '../../../controls/index.ts'\nimport type { WithFormControlProps } from '../WithFormControlProps.ts'\nimport { FormControlTextField } from './FormControlTextField.tsx'\nimport { useCreditCardFormControl } from './useCreditCardFormControl.tsx'\n\nexport const CreditCardEmailWithFormControl: React.FC<WithFormControlProps> = ({\n formControlName = 'emailAddress',\n fieldLabel = 'Email',\n ...props\n}) => {\n const {\n creditCardFormControl, error, inputRef, value,\n } = useCreditCardFormControl(formControlName, CreditCardEmailFormControl)\n const {\n autoComplete, autoCorrect, id, inputMode, name, spellCheck, ...cvcProps\n } = creditCardFormControl?.props ?? {}\n\n return (\n <FormControlTextField\n fieldLabel={fieldLabel}\n formControl={creditCardFormControl}\n formControlError={error}\n inputMode={inputMode}\n inputProps={{\n 'aria-label': `${fieldLabel} for your purchase`, autoComplete, autoCorrect, id, name, spellCheck,\n }}\n inputRef={inputRef}\n value={value}\n {...cvcProps}\n {...props}\n />\n )\n}\n","import React from 'react'\n\nimport { CreditCardExpirationFormControl } from '../../../controls/index.ts'\nimport type { WithFormControlProps } from '../WithFormControlProps.ts'\nimport { FormControlTextField } from './FormControlTextField.tsx'\nimport { useCreditCardFormControl } from './useCreditCardFormControl.tsx'\n\nexport const CreditCardExpirationWithFormControl: React.FC<WithFormControlProps> = ({\n formControlName = 'expiration',\n fieldLabel = 'Expiration',\n ...props\n}) => {\n const {\n creditCardFormControl, error, inputRef, value,\n } = useCreditCardFormControl(formControlName, CreditCardExpirationFormControl)\n const {\n autoComplete, autoCorrect, id, inputMode, name, spellCheck, ...expirationProps\n } = creditCardFormControl?.props ?? {}\n\n return (\n <FormControlTextField\n inputRef={inputRef}\n formControl={creditCardFormControl}\n fieldLabel={fieldLabel}\n formControlError={error}\n inputMode={inputMode}\n inputProps={{\n 'aria-label': `${fieldLabel} of the card`, autoComplete, autoCorrect, id, name, spellCheck,\n }}\n value={value}\n {...expirationProps}\n {...props}\n />\n )\n}\n","import React, { useMemo } from 'react'\n\nimport { NameFormControl } from '../../../controls/index.ts'\nimport type { WithFormControlProps } from '../WithFormControlProps.ts'\nimport { FormControlTextField } from './FormControlTextField.tsx'\nimport { useCreditCardFormControl } from './useCreditCardFormControl.tsx'\n\nexport interface NameWithFormControlProps extends WithFormControlProps {\n autoCompleteLabel: string\n}\n\nexport const NameWithFormControl: React.FC<NameWithFormControlProps> = ({\n autoCompleteLabel,\n fieldLabel = 'Name',\n formControlName,\n placeholder,\n tabIndex,\n ...props\n}) => {\n const args = useMemo(() => [fieldLabel, autoCompleteLabel, placeholder ?? ''], [autoCompleteLabel, fieldLabel, placeholder])\n const {\n creditCardFormControl, error, inputRef, value,\n } = useCreditCardFormControl(formControlName, NameFormControl, args)\n const {\n autoComplete, autoCorrect, id, inputMode, name, spellCheck, ...cvcProps\n } = creditCardFormControl?.props ?? {}\n return (\n <FormControlTextField\n fieldLabel={fieldLabel}\n formControl={creditCardFormControl}\n formControlError={error}\n inputMode={inputMode}\n inputProps={{\n 'aria-label': `${fieldLabel} name on your card`, autoComplete, autoCorrect, id, name, spellCheck, tabIndex,\n }}\n inputRef={inputRef}\n value={value}\n {...cvcProps}\n {...props}\n />\n )\n}\n","import { InputAdornment } from '@mui/material'\nimport React from 'react'\n\nimport { CreditCardNumberFormControl } from '../../../../controls/index.ts'\nimport type { WithFormControlProps } from '../../WithFormControlProps.ts'\nimport { FormControlTextField } from '../FormControlTextField.tsx'\nimport { CreditCardData } from '../Options.ts'\nimport { useCreditCardNumberFormControl } from './use.ts'\n\nexport const CreditCardNumberWithFormControl: React.FC<WithFormControlProps> = ({\n fieldLabel = 'Card Number',\n formControlName = 'cardNumber',\n ...props\n}) => {\n const {\n creditCardFormControl, error, inputRef, type, value,\n } = useCreditCardNumberFormControl(formControlName, CreditCardNumberFormControl)\n const {\n autoComplete, autoCorrect, id, inputMode, name, spellCheck, ...cardProps\n } = creditCardFormControl?.props ?? {}\n\n return (\n <FormControlTextField\n fieldLabel={fieldLabel}\n formControl={creditCardFormControl}\n formControlError={error}\n inputRef={inputRef}\n inputMode={inputMode}\n inputProps={{\n 'aria-label': fieldLabel, autoComplete, autoCorrect, id, inputMode, name, spellCheck,\n }}\n InputProps={{\n startAdornment:\n type.length > 0\n ? (\n <InputAdornment position=\"start\">\n <img height=\"30px\" width=\"40px\" src={CreditCardData[type].icon} />\n </InputAdornment>\n )\n : null,\n }}\n value={value}\n {...cardProps}\n {...props}\n />\n )\n}\n","export { default as AmexIcon } from './american-express.svg'\nexport { default as DiscoverIcon } from './discover.svg'\nexport { default as MastercardIcon } from './mastercard.svg'\nexport { default as VisaIcon } from './visa.svg'\n","import {\n AmexIcon, DiscoverIcon, MastercardIcon, VisaIcon,\n} from '../../img/index.ts'\n\nexport interface CreditCardInfo {\n icon: string\n name: string\n}\n\nexport interface CreditCardOptions {\n amex: CreditCardInfo\n discover: CreditCardInfo\n mastercard: CreditCardInfo\n visa: CreditCardInfo\n}\n\nexport const CreditCardData: CreditCardOptions = {\n amex: { icon: AmexIcon, name: 'American Express' },\n discover: { icon: DiscoverIcon, name: 'Discover' },\n mastercard: { icon: MastercardIcon, name: 'Mastercard' },\n visa: { icon: VisaIcon, name: 'Visa' },\n}\n","import type { StandardTextFieldProps } from '@mui/material'\nimport type { FormControlBase } from '@xyo-network/react-form-group'\nimport { useEffect, useState } from 'react'\n\nimport type { CreditCardNumberFormControl } from '../../../../controls/index.ts'\nimport type { CreditCardOptions } from '../Options.ts'\nimport { useCreditCardFormControl } from '../useCreditCardFormControl.tsx'\n\nexport const useCreditCardNumberFormControl = (formControlName?: string, control?: new () => FormControlBase<StandardTextFieldProps>) => {\n const {\n creditCardFormControl, error, inputRef, value,\n } = useCreditCardFormControl(formControlName, control)\n const [type, setType] = useState('' as keyof CreditCardOptions)\n\n useEffect(() => {\n if (creditCardFormControl) {\n const castControl = creditCardFormControl as CreditCardNumberFormControl<StandardTextFieldProps>\n if (!castControl.onCreditCardTypeChange) {\n console.error('cannot set onCreditCardTypeChange on control because it is not a CreditCardNumberFormControl')\n return\n }\n castControl.onCreditCardTypeChange = (type: string) => setType(type as keyof CreditCardOptions)\n castControl.onCursorChange = (cursor: number | undefined) => {\n if (inputRef.current && cursor) {\n inputRef.current.setSelectionRange(cursor, cursor)\n }\n }\n }\n }, [creditCardFormControl, inputRef])\n\n return {\n creditCardFormControl, error, inputRef, type, value,\n }\n}\n","import React from 'react'\n\nimport { CreditCardZipFormControl } from '../../../controls/index.ts'\nimport type { WithFormControlProps } from '../WithFormControlProps.ts'\nimport { FormControlTextField } from './FormControlTextField.tsx'\nimport { useCreditCardFormControl } from './useCreditCardFormControl.tsx'\n\nexport const CreditCardZipWithFormControl: React.FC<WithFormControlProps> = ({\n formControlName = 'zip', fieldLabel = 'Zip', ...props\n}) => {\n const {\n creditCardFormControl, error, inputRef, value,\n } = useCreditCardFormControl(formControlName, CreditCardZipFormControl)\n const {\n autoComplete, autoCorrect, id, inputMode, name, spellCheck, ...cvcProps\n } = creditCardFormControl?.props ?? {}\n\n return (\n <FormControlTextField\n fieldLabel={fieldLabel}\n formControl={creditCardFormControl}\n formControlError={error}\n inputMode={inputMode}\n inputProps={{\n 'aria-label': `${fieldLabel} code for your card`, autoComplete, autoCorrect, id, name, spellCheck,\n }}\n inputRef={inputRef}\n value={value}\n {...cvcProps}\n {...props}\n />\n )\n}\n","import { Stack } from '@mui/material'\nimport { FlexCol } from '@xylabs/react-flexbox'\nimport { ErrorRender } from '@xyo-network/react-error'\nimport React, { useState } from 'react'\n\nimport { FormGroupCreditCardProvider, useFormGroupWithCreditCardInput } from '../../context/index.ts'\nimport { validateCreditCardInputs } from '../support/index.ts'\nimport { InputFieldsStack } from './InputFieldsStack.tsx'\nimport type { CreditCardFormProps } from './Props.ts'\nimport { useFormStorage } from './useFormStorage.tsx'\n\nexport const CreditCardFormFlexbox: React.FC<CreditCardFormProps> = ({\n ConfirmationButton,\n displayErrors,\n onErrorDuringSubmit,\n onInvalidSubmit,\n onSuccessfulSubmit,\n onValidSubmit,\n ...props\n}) => {\n const { formGroup } = useFormGroupWithCreditCardInput(true)\n const [error, setError] = useState<Error>()\n\n const handleConfirmPayment = async () => {\n try {\n if (!formGroup) {\n throw new Error('formGroup is not defined')\n }\n\n formGroup.validateFields()\n\n const errorSummary = formGroup.errorSummary\n\n if (errorSummary.invalidFields.length > 0) {\n onInvalidSubmit?.(errorSummary)\n }\n\n if (errorSummary.invalidFields.length > 0) return\n\n const formOutput = validateCreditCardInputs(formGroup.values)\n\n await onValidSubmit?.(formOutput)\n\n onSuccessfulSubmit?.()\n } catch (error) {\n onErrorDuringSubmit?.(error as Error)\n if (displayErrors) setError(error as Error)\n }\n }\n\n return (\n <>\n <ErrorRender error={error} />\n <FlexCol\n sx={{ flexDirection: { md: 'row', xs: 'column' } }}\n width=\"100%\"\n gap={2}\n {...props}\n >\n <Stack flexDirection=\"column\" sx={{ width: '100%' }} gap={2}>\n <InputFieldsStack />\n {ConfirmationButton\n ? (\n <ConfirmationButton onClick={handleConfirmPayment} variant=\"contained\" sx={{ alignSelf: 'end' }}>\n Confirm Payment\n </ConfirmationButton>\n )\n : null}\n </Stack>\n </FlexCol>\n </>\n )\n}\n\nexport const CreditCardFormFlexboxWithFormGroupProvider: React.FC<CreditCardFormProps> = (props) => {\n const [params, error] = useFormStorage()\n return (\n <FormGroupCreditCardProvider params={params}>\n <ErrorRender error={error} />\n <CreditCardFormFlexbox {...props} />\n </FormGroupCreditCardProvider>\n )\n}\n","export const NameFields = ['firstName', 'lastName'] as const\nexport const NameLabels = ['First', 'Last'] as const\nexport type NameLabel = (typeof NameLabels)[number]\n","import { assertEx } from '@xylabs/assert'\n\nimport type { CreditCardInput } from '../../models/index.ts'\nimport { CreditCardInputSchema } from '../../models/index.ts'\n\nexport const validateCreditCardInputs = (values: CreditCardInput): CreditCardInput => {\n return {\n cardNumber: assertEx(values.cardNumber, () => 'card number is not a string') as string,\n cvc: assertEx(values.cvc, () => 'card cvc is not a string') as string,\n emailAddress: assertEx(values.emailAddress, () => 'emailAddress is not a string') as string,\n expiration: assertEx(values.expiration, () => 'card expiration is not a string') as string,\n firstName: assertEx(values.firstName, () => 'first name is not a string') as string,\n lastName: assertEx(values.lastName, () => 'last name is not a string') as string,\n schema: CreditCardInputSchema,\n timestamp: values.timestamp,\n zip: assertEx(values.zip, () => 'zip is not a string') as string,\n }\n}\n","import type { Payload } from '@xyo-network/payload-model'\nimport { isPayloadOfSchemaTypeWithMeta } from '@xyo-network/payload-model'\n\nexport const CreditCardInputSchema = 'network.xyo.credit.card.input' as const\nexport type CreditCardInputSchema = typeof CreditCardInputSchema\n\nexport type CreditCardInputFields = {\n cardNumber: string\n cvc: string\n emailAddress: string\n expiration: string\n firstName: string\n lastName: string\n timestamp: number\n zip: string\n}\n\nexport type CreditCardInput = Payload<CreditCardInputFields, CreditCardInputSchema>\n\nexport const isCreditCardInput = isPayloadOfSchemaTypeWithMeta<CreditCardInput>(CreditCardInputSchema)\n","import type { StackProps } from '@mui/material'\nimport { Stack } from '@mui/material'\nimport type { PropsWithChildren } from 'react'\nimport React from 'react'\n\nimport {\n CreditCardCvvWithFormControl,\n CreditCardEmailWithFormControl,\n CreditCardExpirationWithFormControl,\n CreditCardNumberWithFormControl,\n CreditCardZipWithFormControl,\n NameWithFormControl,\n} from '../controls/index.ts'\n\nexport interface InputFieldsStackProps extends StackProps, PropsWithChildren {}\n\nexport const InputFieldsStack: React.FC<InputFieldsStackProps> = (props) => {\n const { sx } = props\n return (\n <>\n <Stack\n gap={2}\n sx={{\n flexDirection: { md: 'row', xs: 'column' },\n ...sx,\n }}\n {...props}\n >\n <NameWithFormControl autoCompleteLabel=\"given-name\" fieldLabel=\"First\" formControlName=\"firstName\" placeholder=\"Jerry\" />\n <NameWithFormControl autoCompleteLabel=\"family-name\" fieldLabel=\"Last\" formControlName=\"lastName\" placeholder=\"Smith\" />\n </Stack>\n <Stack\n gap={2}\n sx={{\n flexDirection: { lg: 'row', xs: 'column' },\n ...sx,\n }}\n {...props}\n >\n <Stack width={{ lg: '50%', xs: '100%' }}>\n <CreditCardNumberWithFormControl />\n </Stack>\n <Stack\n direction={{ lg: 'row', xs: 'column' }}\n gap={2}\n width={{ lg: '50%', xs: '100%' }}\n >\n <CreditCardCvvWithFormControl />\n <CreditCardExpirationWithFormControl />\n </Stack>\n </Stack>\n <Stack\n gap={2}\n sx={{\n flexDirection: { md: 'row', xs: 'column' },\n ...sx,\n }}\n {...props}\n >\n <Stack width={{ md: '25%', xs: '100%' }}>\n <CreditCardZipWithFormControl />\n </Stack>\n <Stack width={{ md: '75%', xs: '100%' }}>\n <CreditCardEmailWithFormControl />\n </Stack>\n </Stack>\n </>\n )\n}\n","import { usePromise } from '@xylabs/react-promise'\nimport { StorageArchivist, StorageArchivistConfigSchema } from '@xyo-network/archivist-storage'\nimport type { FormGroupParams } from '@xyo-network/react-form-group'\nimport { ArchivistFormGroupStorage } from '@xyo-network/react-form-group'\n\nimport type { CreditCardInput } from '../../models/index.ts'\n\nconst STORAGE_NAME_SPACE = 'credit-card-fields' as const\n\nconst calculateTTL = (months = 6) => {\n const MS_PER_DAY = 24 * 60 * 60 * 1000\n const DAYS_PER_MONTH = 30.44\n return months * DAYS_PER_MONTH * MS_PER_DAY\n}\n\nexport const useFormStorage = () => {\n return usePromise(async () => {\n const localStorageArchivist = await StorageArchivist.create({\n account: 'random',\n config: {\n namespace: STORAGE_NAME_SPACE, schema: StorageArchivistConfigSchema, type: 'local',\n },\n })\n const sessionStorageArchivist = await StorageArchivist.create({\n account: 'random',\n config: {\n namespace: STORAGE_NAME_SPACE, schema: StorageArchivistConfigSchema, type: 'session',\n },\n })\n\n const storage = {\n sensitive: new ArchivistFormGroupStorage(sessionStorageArchivist),\n storage: new ArchivistFormGroupStorage(localStorageArchivist),\n }\n\n return {\n serialize: true, storage, ttlStorage: calculateTTL(),\n } as FormGroupParams<CreditCardInput>\n }, [])\n}\n"],"mappings":"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","names":["React","assertEx","FormControlBase","valid","unmask","value","replaceAll","CONTROL_NAME","CreditCardCvvFormControl","FormControlBase","invalidMessage","pattern","patternStrict","props","autoComplete","autoCorrect","id","inputMode","name","placeholder","spellCheck","required","unmask","_cardNumberFormControl","undefined","constructor","setName","setSerializeSettings","sensitive","serializable","cardNumberFormControl","assertEx","blurError","value","num","max","getCardNumberCvcMax","cvvValidation","valid","cvv","isValid","setError","setStatus","changeError","unmasked","match","isPotentiallyValid","setCardNumberFormControl","numberValidation","number","card","code","size","assertEx","FormControlBase","valid","CONTROL_NAME","CreditCardExpirationFormControl","FormControlBase","invalidMessage","pattern","patternStrict","props","autoComplete","autoCorrect","id","inputMode","name","placeholder","spellCheck","required","unmask","_cardNumberFormControl","undefined","constructor","setName","setSerializeSettings","sensitive","serializable","cardNumberFormControl","assertEx","rawValue","value","blurError","unmasked","expirationValid","valid","expirationDate","length","setErrorAndValidity","isValid","changeError","isPotentiallyValid","mask","test","makeMask","separator","limit","output","i","push","join","FormControlBase","valid","CONTROL_NAME","CreditCardNumberFormControl","FormControlBase","creditCardType","invalidMessage","pattern","patternStrict","props","autoComplete","autoCorrect","id","inputMode","name","placeholder","spellCheck","required","unmask","constructor","setName","setSerializeSettings","sensitive","serializable","blurError","value","unmasked","numberValidation","valid","number","isValid","setErrorAndValidity","changeError","match","isPotentiallyValid","earlyNumberCheck","setCreditCardType","getCursorPosition","previousValue","card","lengthChange","length","unmaskedChange","gaps","oldCursor","cursorPosition","previous","oldSeparation","filter","gap","i","newSeparation","newCursor","mask","max","lengths","includes","newVal","map","slice","Boolean","join","onCreditCardTypeChange","type","setValue","options","umMasked","charAt","FormControlBase","CONTROL_NAME","CreditCardEmailFormControl","FormControlBase","invalidMessage","pattern","patternStrict","props","autoComplete","autoCorrect","id","toLocaleLowerCase","name","placeholder","spellCheck","required","constructor","setName","setSerializeSettings","sensitive","serializable","blurError","value","match","updateValidation","changeError","error","setErrorAndValidity","FormControlBase","NameFormControl","FormControlBase","required","constructor","nameLabel","autoCompleteLabel","placeHolder","setName","setSerializeSettings","sensitive","serializable","invalidMessage","props","autoComplete","autoCorrect","id","name","placeholder","spellCheck","blurError","value","setErrorAndValidity","changeError","FormControlBase","valid","CONTROL_NAME","CreditCardZipFormControl","FormControlBase","invalidMessage","props","autoComplete","autoCorrect","id","toLocaleLowerCase","name","placeholder","spellCheck","required","unmask","constructor","setName","setSerializeSettings","sensitive","serializable","blurError","value","postalCodeValidation","valid","postalCode","isValid","setErrorAndValidity","changeError","unmasked","match","patternStrict","isPotentiallyValid","FormControl","MuiFormControl","TextField","LabeledTextFieldWrapper","React","forwardRef","FormControlTextField","forwardRef","formControl","formControlError","fieldLabel","props","ref","name","handleChange","event","setValue","target","value","handleBlur","blurError","setTouched","MuiFormControl","fullWidth","LabeledTextFieldWrapper","label","htmlFor","TextField","error","helperText","hiddenLabel","onBlur","onChange","onKeyDown","selectionEnd","cursorPosition","previous","required","size","variant","displayName","useEffect","createContextEx","FormGroupCreditCardContext","FormGroup","React","useMemo","FormGroupCreditCardProvider","children","params","props","formGroup","useMemo","FormGroup","value","provided","React","FormGroupCreditCardContext","Provider","useContextEx","useFormGroupWithCreditCardInput","required","useContextEx","FormGroupCreditCardContext","useMemo","useRef","useState","STABLE_DEFAULT_ARGS","useCreditCardFormControl","formControlName","Control","args","error","setError","useState","value","setValue","inputRef","useRef","formGroup","useFormGroupWithCreditCardInput","creditCardFormControl","useMemo","control","registerOnErrorChange","newError","registerOnChange","registerControl","useCreditCardCvvFormControl","formControlName","cardNumberControlName","control","creditCardFormControl","error","value","inputRef","useCreditCardFormControl","formGroup","useFormGroupWithCreditCardInput","creditCardNumberFormControl","getControl","useEffect","castControl","setCardNumberFormControl","console","CreditCardCvvWithFormControl","formControlName","fieldLabel","props","creditCardFormControl","error","inputRef","value","useCreditCardCvvFormControl","undefined","CreditCardCvvFormControl","autoComplete","autoCorrect","id","inputMode","name","spellCheck","cvcProps","React","FormControlTextField","formControl","formControlError","inputProps","React","CreditCardEmailWithFormControl","formControlName","fieldLabel","props","creditCardFormControl","error","inputRef","value","useCreditCardFormControl","CreditCardEmailFormControl","autoComplete","autoCorrect","id","inputMode","name","spellCheck","cvcProps","React","FormControlTextField","formControl","formControlError","inputProps","React","CreditCardExpirationWithFormControl","formControlName","fieldLabel","props","creditCardFormControl","error","inputRef","value","useCreditCardFormControl","CreditCardExpirationFormControl","autoComplete","autoCorrect","id","inputMode","name","spellCheck","expirationProps","React","FormControlTextField","formControl","formControlError","inputProps","React","useMemo","NameWithFormControl","autoCompleteLabel","fieldLabel","formControlName","placeholder","tabIndex","props","args","useMemo","creditCardFormControl","error","inputRef","value","useCreditCardFormControl","NameFormControl","autoComplete","autoCorrect","id","inputMode","name","spellCheck","cvcProps","React","FormControlTextField","formControl","formControlError","inputProps","InputAdornment","React","AmexIcon","default","DiscoverIcon","MastercardIcon","VisaIcon","CreditCardData","amex","icon","AmexIcon","name","discover","DiscoverIcon","mastercard","MastercardIcon","visa","VisaIcon","useEffect","useState","useCreditCardNumberFormControl","formControlName","control","creditCardFormControl","error","inputRef","value","useCreditCardFormControl","type","setType","useState","useEffect","castControl","onCreditCardTypeChange","console","onCursorChange","cursor","current","setSelectionRange","CreditCardNumberWithFormControl","fieldLabel","formControlName","props","creditCardFormControl","error","inputRef","type","value","useCreditCardNumberFormControl","CreditCardNumberFormControl","autoComplete","autoCorrect","id","inputMode","name","spellCheck","cardProps","React","FormControlTextField","formControl","formControlError","inputProps","InputProps","startAdornment","length","InputAdornment","position","img","height","width","src","CreditCardData","icon","React","CreditCardZipWithFormControl","formControlName","fieldLabel","props","creditCardFormControl","error","inputRef","value","useCreditCardFormControl","CreditCardZipFormControl","autoComplete","autoCorrect","id","inputMode","name","spellCheck","cvcProps","React","FormControlTextField","formControl","formControlError","inputProps","Stack","FlexCol","ErrorRender","React","useState","NameFields","NameLabels","assertEx","isPayloadOfSchemaTypeWithMeta","CreditCardInputSchema","isCreditCardInput","validateCreditCardInputs","values","cardNumber","assertEx","cvc","emailAddress","expiration","firstName","lastName","schema","CreditCardInputSchema","timestamp","zip","Stack","React","InputFieldsStack","props","sx","React","Stack","gap","flexDirection","md","xs","NameWithFormControl","autoCompleteLabel","fieldLabel","formControlName","placeholder","lg","width","CreditCardNumberWithFormControl","direction","CreditCardCvvWithFormControl","CreditCardExpirationWithFormControl","CreditCardZipWithFormControl","CreditCardEmailWithFormControl","usePromise","StorageArchivist","StorageArchivistConfigSchema","ArchivistFormGroupStorage","STORAGE_NAME_SPACE","calculateTTL","months","MS_PER_DAY","DAYS_PER_MONTH","useFormStorage","usePromise","localStorageArchivist","StorageArchivist","create","account","config","namespace","schema","StorageArchivistConfigSchema","type","sessionStorageArchivist","storage","sensitive","ArchivistFormGroupStorage","serialize","ttlStorage","CreditCardFormFlexbox","ConfirmationButton","displayErrors","onErrorDuringSubmit","onInvalidSubmit","onSuccessfulSubmit","onValidSubmit","props","formGroup","useFormGroupWithCreditCardInput","error","setError","useState","handleConfirmPayment","Error","validateFields","errorSummary","invalidFields","length","formOutput","validateCreditCardInputs","values","React","ErrorRender","FlexCol","sx","flexDirection","md","xs","width","gap","Stack","InputFieldsStack","onClick","variant","alignSelf","CreditCardFormFlexboxWithFormGroupProvider","params","useFormStorage","FormGroupCreditCardProvider"]}
1
+ {"version":3,"sources":["../../src/components/controls/card/cvv/Cvv.tsx","../../src/controls/CreditCardCvv.ts","../../src/utils/umask.ts","../../src/controls/CreditCardExpiry.ts","../../src/controls/CreditCardNumber.ts","../../src/controls/Email.ts","../../src/controls/Name.ts","../../src/controls/Zip.ts","../../src/components/controls/card/FormControlTextField.tsx","../../src/components/controls/card/cvv/use.ts","../../src/context/FormGroupCreditCardContext.ts","../../src/context/FormGroupCreditCardProvider.tsx","../../src/context/useFormGroupWithCreditCard.tsx","../../src/components/controls/card/useCreditCardFormControl.tsx","../../src/components/controls/card/Email.tsx","../../src/components/controls/card/Expiration.tsx","../../src/components/controls/card/Name.tsx","../../src/components/controls/card/number/Number.tsx","../../src/components/img/index.ts","../../src/components/controls/card/Options.ts","../../src/components/controls/card/number/use.ts","../../src/components/controls/card/Zip.tsx","../../src/components/form/Form.tsx","../../src/components/support/Fields.ts","../../src/components/support/validateCreditCardInputs.ts","../../src/models/CreditCardInput.ts","../../src/components/form/InputFieldsStack.tsx","../../src/components/form/useFormStorage.tsx"],"sourcesContent":["import React from 'react'\n\nimport { CreditCardCvvFormControl } from '../../../../controls/index.ts'\nimport type { WithFormControlProps } from '../../WithFormControlProps.ts'\nimport { FormControlTextField } from '../FormControlTextField.tsx'\nimport { useCreditCardCvvFormControl } from './use.ts'\n\nexport const CreditCardCvvWithFormControl: React.FC<WithFormControlProps> = ({\n formControlName = 'cvc', fieldLabel = 'CVC', ...props\n}) => {\n const {\n creditCardFormControl, error, inputRef, value,\n } = useCreditCardCvvFormControl(formControlName, undefined, CreditCardCvvFormControl)\n const {\n autoComplete, autoCorrect, id, inputMode, name, spellCheck, ...cvcProps\n } = creditCardFormControl?.props ?? {}\n\n return (\n <FormControlTextField\n fieldLabel={fieldLabel}\n formControl={creditCardFormControl}\n formControlError={error}\n inputMode={inputMode}\n inputProps={{\n 'aria-label': `${fieldLabel} number on the back of your card`, autoComplete, autoCorrect, id, name, spellCheck,\n }}\n inputRef={inputRef}\n value={value}\n {...cvcProps}\n {...props}\n />\n )\n}\n","import { assertEx } from '@xylabs/assert'\nimport type { EmptyObject } from '@xylabs/object'\nimport type { AbstractControl } from '@xyo-network/react-form-group'\nimport { FormControlBase } from '@xyo-network/react-form-group'\nimport valid from 'card-validator'\n\nimport { unmask } from '../utils/index.ts'\n\nconst CONTROL_NAME = 'cvv'\n\nexport class CreditCardCvvFormControl<TProps extends EmptyObject = EmptyObject> extends FormControlBase<TProps> {\n override invalidMessage = 'Your card cvc is invalid.'\n\n override pattern = /^\\d{0,4}$/\n override patternStrict = /^\\d{1,4}$/\n\n override props = {\n autoComplete: 'cc-csc',\n autoCorrect: 'off',\n id: CONTROL_NAME,\n inputMode: 'numeric',\n name: CONTROL_NAME,\n placeholder: 'CVC',\n spellCheck: false,\n } as TProps\n\n override required = true\n\n override unmask = unmask\n\n private _cardNumberFormControl: AbstractControl | undefined = undefined\n\n constructor() {\n super()\n super.setName(CONTROL_NAME)\n this.setSerializeSettings({ sensitive: true, serializable: true })\n }\n\n get cardNumberFormControl() {\n return assertEx(this._cardNumberFormControl, () => 'Card number form control is not set')\n }\n\n override blurError(value: string) {\n const num = this.cardNumberFormControl.value\n const max = this.getCardNumberCvcMax(num)\n const cvvValidation = valid.cvv(value, max)\n if (cvvValidation.isValid) {\n this.setError('')\n this.setStatus('VALID')\n } else {\n this.setError(this.invalidMessage)\n this.setStatus('INVALID')\n }\n }\n\n override changeError(value: string) {\n const unmasked = this.unmask(value)\n const match = unmasked.match(this.patternStrict)\n if (match) {\n const num = this.cardNumberFormControl.value\n const max = this.getCardNumberCvcMax(num)\n const cvvValidation = valid.cvv(value, max)\n if (cvvValidation.isPotentiallyValid) {\n this.setError('')\n this.setStatus('VALID')\n } else {\n this.setError('Your card cvc is invalid.')\n this.setStatus('INVALID')\n }\n } else {\n this.setError(this.invalidMessage)\n this.setStatus('INVALID')\n }\n }\n\n setCardNumberFormControl(cardNumberFormControl: AbstractControl) {\n this._cardNumberFormControl = cardNumberFormControl\n }\n\n private getCardNumberCvcMax(num?: string) {\n if (!num) return 3\n const numberValidation = valid.number(num)\n return numberValidation.card ? numberValidation.card.code.size : 3\n }\n}\n","export function unmask(value: string) {\n return value.replaceAll(/\\D/g, '')\n}\n","import { assertEx } from '@xylabs/assert'\nimport type { EmptyObject } from '@xylabs/object'\nimport type { AbstractControl } from '@xyo-network/react-form-group'\nimport { FormControlBase } from '@xyo-network/react-form-group'\nimport valid from 'card-validator'\n\nimport { unmask } from '../utils/index.ts'\n\nconst CONTROL_NAME = 'expiration'\n\nexport class CreditCardExpirationFormControl<TProps extends EmptyObject = EmptyObject> extends FormControlBase {\n override invalidMessage = 'Card Expiration is invalid'\n\n override pattern = /^\\d{0,4}$/\n override patternStrict = /^\\d{1,4}$/\n\n override props = {\n autoComplete: 'cc-exp',\n autoCorrect: 'off',\n id: CONTROL_NAME,\n inputMode: 'numeric',\n name: CONTROL_NAME,\n placeholder: 'MM / YY',\n spellCheck: false,\n } as TProps\n\n override required = true\n\n override unmask = unmask\n\n private _cardNumberFormControl: AbstractControl | undefined = undefined\n\n constructor() {\n super()\n super.setName(CONTROL_NAME)\n this.setSerializeSettings({ sensitive: true, serializable: true })\n }\n\n get cardNumberFormControl() {\n return assertEx(this._cardNumberFormControl, () => 'Card number form control is not set')\n }\n\n // make it so the raw value is the same to preserve the / separator in the value\n override get rawValue() {\n return this.value\n }\n\n override blurError(value: string) {\n const unmasked = unmask(value)\n const expirationValid = valid.expirationDate(unmasked)\n if (!unmasked || (unmasked && unmasked.length !== 4)) {\n this.setErrorAndValidity('Your card expiration is incomplete.', 'INVALID')\n } else if (expirationValid.isValid) {\n this.setErrorAndValidity('', 'VALID')\n } else {\n this.setErrorAndValidity(\"Your card's expiration year is in the past.\", 'INVALID')\n }\n }\n\n override changeError(value: string) {\n const unmasked = this.unmask(value)\n const expirationValid = valid.expirationDate(unmasked)\n if (expirationValid.isPotentiallyValid) {\n this.setErrorAndValidity('', 'VALID')\n } else if (expirationValid.isValid) {\n this.setErrorAndValidity('', 'VALID')\n } else {\n this.setErrorAndValidity(\"Your card's expiration year is in the past.\", 'INVALID')\n }\n }\n\n override mask(value: string) {\n if (/^[2-9]/.test(unmask(value))) {\n return this.makeMask(' / ', 2)(`0${value}`)\n }\n return this.makeMask(' / ', 2)(value)\n }\n\n private makeMask(separator: string, limit: number) {\n return (value: string) => {\n const output: string[] = []\n // eslint-disable-next-line unicorn/no-for-loop\n for (let i = 0; i < value.length; i++) {\n if (i !== 0 && i % limit === 0) {\n output.push(separator)\n }\n\n output.push(value[i])\n }\n\n return output.join('')\n }\n }\n}\n","import type { EmptyObject } from '@xylabs/object'\nimport type { SetOptions, ValidControlValue } from '@xyo-network/react-form-group'\nimport { FormControlBase } from '@xyo-network/react-form-group'\nimport valid from 'card-validator'\n\nimport { unmask } from '../utils/index.ts'\n\nconst CONTROL_NAME = 'cardNumber2'\n\nexport class CreditCardNumberFormControl<TProps extends EmptyObject = EmptyObject> extends FormControlBase<TProps> {\n creditCardType: string = ''\n\n override invalidMessage = 'Card Number is invalid'\n\n override pattern = /^(\\d+)?$/\n override patternStrict = /^\\d+$/\n\n override props = {\n autoComplete: 'cc-number',\n autoCorrect: 'off',\n id: CONTROL_NAME,\n inputMode: 'numeric',\n name: CONTROL_NAME,\n placeholder: '1234 1234 1234 1234',\n spellCheck: false,\n } as TProps\n\n override required = true\n\n override unmask = unmask\n\n constructor() {\n super()\n super.setName(CONTROL_NAME)\n this.setSerializeSettings({ sensitive: true, serializable: true })\n }\n\n override blurError(value: string) {\n const unmasked = unmask(value)\n const numberValidation = valid.number(unmasked)\n if (!numberValidation.isValid) {\n this.setErrorAndValidity(this.invalidMessage, 'INVALID')\n return\n }\n this.setErrorAndValidity('', 'VALID')\n }\n\n override changeError(value: string) {\n const unmasked = unmask(value)\n const match = unmasked.match(this.patternStrict)\n if (match) {\n const numberValidation = valid.number(unmasked)\n if (!numberValidation.isPotentiallyValid) {\n this.setErrorAndValidity(this.invalidMessage, 'INVALID')\n return\n }\n this.setErrorAndValidity('', 'VALID')\n } else {\n this.setErrorAndValidity(this.invalidMessage, 'INVALID')\n }\n }\n\n earlyNumberCheck(number: string) {\n switch (number) {\n case '4': {\n this.setCreditCardType('visa')\n break\n }\n case '5': {\n this.setCreditCardType('mastercard')\n break\n }\n case '3': {\n this.setCreditCardType('amex')\n break\n }\n case '6': {\n this.setCreditCardType('discover')\n break\n }\n default: {\n this.setCreditCardType('')\n }\n }\n }\n\n override getCursorPosition() {\n if (this.value) {\n const previousValue = this.previousValue ?? ''\n const unmasked = unmask(this.value)\n const numberValidation = valid.number(unmasked)\n const card = numberValidation.card\n const lengthChange = this.value.length - (previousValue?.length ?? 0)\n const unmaskedChange = unmask(this.value).length - unmask(previousValue).length\n\n if (card) {\n const gaps = card.gaps\n const oldCursor = this.cursorPosition.previous ?? 0\n const oldSeparation = gaps.filter((gap, i) => gap + i < oldCursor).length\n const newSeparation = gaps.filter((gap, i) => gap + i < oldCursor + lengthChange).length\n const newCursor = oldCursor - oldSeparation + newSeparation + unmaskedChange\n return newCursor\n }\n }\n\n return\n }\n\n override mask(value: ValidControlValue = '') {\n const unmasked = unmask(value)\n const numberValidation = valid.number(unmasked)\n const card = numberValidation.card\n\n if (card) {\n const max = card.lengths.includes(16) ? 16 : card.lengths[0]\n const gaps = [...card.gaps, max]\n const newVal = gaps\n .map((gap, i) => unmasked.slice(gaps[i - 1] || 0, gap))\n .filter(Boolean)\n .join(' ')\n\n return newVal\n }\n\n return value\n }\n\n onCreditCardTypeChange: (type: string) => void = () => {}\n\n setCreditCardType(type: string) {\n this.creditCardType = type\n this.onCreditCardTypeChange(type)\n }\n\n override setValue(value = '', options: SetOptions) {\n const umMasked = this.unmask(value)\n super.setValue(umMasked, options)\n this.earlyNumberCheck(umMasked.charAt(0))\n }\n}\n","import type { EmptyObject } from '@xylabs/object'\nimport { FormControlBase } from '@xyo-network/react-form-group'\n\nconst CONTROL_NAME = 'Email'\n\nexport class CreditCardEmailFormControl<TProps extends EmptyObject = EmptyObject> extends FormControlBase<TProps> {\n override invalidMessage = 'Your email is invalid.'\n\n override pattern = /^.*$/\n override patternStrict = /^([\\w+.\\-])+@(([\\dA-Za-z-])+\\.)+([\\dA-Za-z]{2,4})+$/\n\n override props = {\n autoComplete: 'email',\n autoCorrect: 'off',\n id: CONTROL_NAME.toLocaleLowerCase(),\n name: CONTROL_NAME.toLocaleLowerCase(),\n placeholder: 'jerry.smith@email.com',\n spellCheck: false,\n } as TProps\n\n override required = true\n\n constructor() {\n super()\n super.setName(CONTROL_NAME)\n this.setSerializeSettings({ sensitive: false, serializable: true })\n }\n\n override blurError(value: string) {\n const match = value.match(this.patternStrict)\n this.updateValidation(match)\n }\n\n override changeError(value: string) {\n if (this.error) {\n this.blurError(value)\n }\n }\n\n private updateValidation(match: RegExpMatchArray | null) {\n if (match) {\n this.setErrorAndValidity('', 'VALID')\n } else {\n this.setErrorAndValidity(this.invalidMessage, 'INVALID')\n }\n }\n}\n","import type { EmptyObject } from '@xylabs/object'\nimport { FormControlBase } from '@xyo-network/react-form-group'\n\nexport class NameFormControl<TProps extends EmptyObject = EmptyObject> extends FormControlBase<TProps> {\n override required = true\n\n constructor(\n private nameLabel: string,\n autoCompleteLabel: string,\n placeHolder: string,\n ) {\n super()\n super.setName(nameLabel)\n this.setSerializeSettings({ sensitive: false, serializable: true })\n this.invalidMessage = `${nameLabel} name is missing.`\n this.props = {\n autoComplete: autoCompleteLabel,\n autoCorrect: 'off',\n id: this.nameLabel,\n name: this.nameLabel,\n placeholder: placeHolder,\n spellCheck: false,\n } as TProps\n }\n\n override blurError(value: string) {\n if (value) {\n this.setErrorAndValidity('', 'VALID')\n } else {\n this.setErrorAndValidity(this.invalidMessage, 'INVALID')\n }\n }\n\n override changeError(value: string): void {\n this.blurError(value)\n }\n}\n","import type { EmptyObject } from '@xylabs/object'\nimport { FormControlBase } from '@xyo-network/react-form-group'\nimport valid from 'card-validator'\n\nimport { unmask } from '../utils/index.ts'\n\nconst CONTROL_NAME = 'Zip'\n\nexport class CreditCardZipFormControl<TProps extends EmptyObject = EmptyObject> extends FormControlBase<TProps> {\n override invalidMessage = 'Your zip code is invalid.'\n\n override props = {\n autoComplete: 'postal-code',\n autoCorrect: 'off',\n id: CONTROL_NAME.toLocaleLowerCase(),\n name: CONTROL_NAME.toLocaleLowerCase(),\n placeholder: '12345',\n spellCheck: false,\n } as TProps\n\n override required = true\n\n override unmask = unmask\n\n constructor() {\n super()\n super.setName(CONTROL_NAME)\n this.setSerializeSettings({ sensitive: true, serializable: true })\n }\n\n override blurError(value: string) {\n const postalCodeValidation = valid.postalCode(value)\n if (postalCodeValidation.isValid) {\n this.setErrorAndValidity('', 'VALID')\n } else {\n this.setErrorAndValidity(this.invalidMessage, 'INVALID')\n }\n }\n\n override changeError(value: string) {\n const unmasked = this.unmask(value)\n const match = unmasked.match(this.patternStrict)\n if (match) {\n const postalCodeValidation = valid.postalCode(value)\n if (postalCodeValidation.isPotentiallyValid) {\n this.setErrorAndValidity('', 'VALID')\n } else {\n this.setErrorAndValidity('Your zip code is invalid.', 'INVALID')\n }\n } else {\n this.setErrorAndValidity(this.invalidMessage, 'INVALID')\n }\n }\n}\n","import type { StandardTextFieldProps } from '@mui/material'\nimport { FormControl as MuiFormControl, TextField } from '@mui/material'\nimport type { FormControl } from '@xyo-network/react-form-group'\nimport { LabeledTextFieldWrapper } from '@xyo-network/react-shared'\nimport type {\n ChangeEventHandler, FocusEventHandler, KeyboardEvent,\n} from 'react'\nimport React, { forwardRef } from 'react'\n\nexport interface FormControlTextFieldProps extends StandardTextFieldProps {\n fieldLabel: string\n formControl?: FormControl<StandardTextFieldProps>\n formControlError?: string\n}\n\nexport const FormControlTextField = forwardRef<HTMLDivElement, FormControlTextFieldProps>(\n ({\n formControl, formControlError, fieldLabel = '', ...props\n }, ref) => {\n const { name } = formControl?.props ?? {}\n\n const handleChange: ChangeEventHandler<HTMLInputElement> = (event) => {\n formControl?.setValue(event.target.value)\n }\n\n const handleBlur: FocusEventHandler<HTMLInputElement> = (event) => {\n formControl?.blurError?.(event.target.value)\n formControl?.setTouched(true)\n }\n\n return (\n <MuiFormControl fullWidth>\n <LabeledTextFieldWrapper label={fieldLabel}>\n <label htmlFor={name}>\n <TextField\n error={!!formControlError}\n helperText={formControlError || ' '}\n fullWidth\n hiddenLabel\n name={name}\n onBlur={handleBlur}\n onChange={handleChange}\n onKeyDown={(event: KeyboardEvent<HTMLInputElement>) => {\n // See - https://github.com/DefinitelyTyped/DefinitelyTyped/issues/11508#issuecomment-256045682\n // .currentTarget is the div in mui that emits the event, .target is the input element\n // Unfortunately, the type definitions do not let you pass a generic specifically for target, only currentTarget\n const selectionEnd = (event.target as HTMLInputElement).selectionEnd\n if (selectionEnd && formControl) {\n formControl.cursorPosition.previous = selectionEnd\n }\n }}\n ref={ref}\n required={formControl?.required}\n size=\"small\"\n variant=\"filled\"\n {...props}\n />\n </label>\n </LabeledTextFieldWrapper>\n </MuiFormControl>\n )\n },\n)\n\nFormControlTextField.displayName = 'FormControlTextField'\n","import type { StandardTextFieldProps } from '@mui/material'\nimport type { FormControlBase } from '@xyo-network/react-form-group'\nimport { useEffect } from 'react'\n\nimport { useFormGroupWithCreditCardInput } from '../../../../context/index.ts'\nimport type { CreditCardCvvFormControl } from '../../../../controls/index.ts'\nimport { useCreditCardFormControl } from '../useCreditCardFormControl.tsx'\n\nexport const useCreditCardCvvFormControl = (\n formControlName?: string,\n cardNumberControlName = 'cardNumber',\n control?: new () => FormControlBase<StandardTextFieldProps>,\n) => {\n const {\n creditCardFormControl, error, value, inputRef,\n } = useCreditCardFormControl(formControlName, control)\n\n // only use FormGroupContext when name is passed\n const { formGroup } = useFormGroupWithCreditCardInput(!!formControlName)\n\n const creditCardNumberFormControl = formGroup?.getControl?.(cardNumberControlName)\n\n useEffect(() => {\n if (creditCardNumberFormControl) {\n const castControl = creditCardFormControl as CreditCardCvvFormControl\n if (!castControl.setCardNumberFormControl) {\n console.error('cannot setCardNumberFormControl on control because it is not a CreditCardCvvFormControl')\n return\n }\n castControl.setCardNumberFormControl(creditCardNumberFormControl)\n }\n }, [creditCardFormControl, creditCardNumberFormControl])\n\n return {\n creditCardFormControl, error, inputRef, value,\n }\n}\n","import type { FormGroupContextWithPayloadState } from '@xyo-network/react-form-group'\nimport { createContextEx } from '@xyo-network/react-shared'\n\nimport type { CreditCardInput } from '../models/index.ts'\n\nexport const FormGroupCreditCardContext = createContextEx<FormGroupContextWithPayloadState<CreditCardInput, CreditCardInput>>()\n","import type { Payload } from '@xyo-network/payload-model'\nimport type { FormGroupParams } from '@xyo-network/react-form-group'\nimport { FormGroup } from '@xyo-network/react-form-group'\nimport type { PropsWithChildren } from 'react'\nimport React, { useMemo } from 'react'\n\nimport type { CreditCardInput } from '../models/index.ts'\nimport { FormGroupCreditCardContext } from './FormGroupCreditCardContext.ts'\n\nexport interface FormGroupCreditCardProviderProps<TStorage extends Payload = Payload> extends PropsWithChildren {\n params?: FormGroupParams<TStorage>\n}\n\nexport const FormGroupCreditCardProvider: React.FC<FormGroupCreditCardProviderProps<CreditCardInput>> = ({\n children, params, ...props\n}) => {\n const formGroup = useMemo(() => {\n const formGroup = new FormGroup<CreditCardInput, CreditCardInput>(params)\n return formGroup\n }, [params])\n\n const value = useMemo(() => ({ formGroup, provided: true }), [formGroup])\n\n return (\n\n <FormGroupCreditCardContext.Provider\n value={value}\n {...props}\n >\n {children}\n </FormGroupCreditCardContext.Provider>\n )\n}\n","import { useContextEx } from '@xyo-network/react-shared'\n\nimport { FormGroupCreditCardContext } from './FormGroupCreditCardContext.ts'\n\nexport const useFormGroupWithCreditCardInput = (required = false) => {\n return useContextEx(FormGroupCreditCardContext, 'FormGroupCreditCard', required)\n}\n","import type { StandardTextFieldProps } from '@mui/material'\nimport type { FormControlBase, ValidControlValue } from '@xyo-network/react-form-group'\nimport {\n useMemo, useRef, useState,\n} from 'react'\n\nimport { useFormGroupWithCreditCardInput } from '../../../context/index.ts'\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nconst STABLE_DEFAULT_ARGS: any[] = [] as const\n\nexport const useCreditCardFormControl = (\n formControlName?: string,\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n Control?: new (...args: any[]) => FormControlBase<StandardTextFieldProps>,\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n args: any[] = STABLE_DEFAULT_ARGS,\n) => {\n const [error, setError] = useState('')\n const [value, setValue] = useState<ValidControlValue>('')\n const inputRef = useRef<HTMLInputElement>(null)\n\n // only use FormGroupContext when name is passed\n const { formGroup } = useFormGroupWithCreditCardInput(!!formControlName)\n\n const creditCardFormControl = useMemo(() => {\n if (Control) {\n const control = new Control(...args)\n control.registerOnErrorChange((newError: string) => setError(newError))\n control.registerOnChange((value: ValidControlValue) => setValue(value))\n\n if (formControlName) formGroup?.registerControl(formControlName, control)\n return control\n }\n }, [Control, args, formControlName, formGroup])\n\n return {\n creditCardFormControl, error, inputRef, value,\n }\n}\n","import React from 'react'\n\nimport { CreditCardEmailFormControl } from '../../../controls/index.ts'\nimport type { WithFormControlProps } from '../WithFormControlProps.ts'\nimport { FormControlTextField } from './FormControlTextField.tsx'\nimport { useCreditCardFormControl } from './useCreditCardFormControl.tsx'\n\nexport const CreditCardEmailWithFormControl: React.FC<WithFormControlProps> = ({\n formControlName = 'emailAddress',\n fieldLabel = 'Email',\n ...props\n}) => {\n const {\n creditCardFormControl, error, inputRef, value,\n } = useCreditCardFormControl(formControlName, CreditCardEmailFormControl)\n const {\n autoComplete, autoCorrect, id, inputMode, name, spellCheck, ...cvcProps\n } = creditCardFormControl?.props ?? {}\n\n return (\n <FormControlTextField\n fieldLabel={fieldLabel}\n formControl={creditCardFormControl}\n formControlError={error}\n inputMode={inputMode}\n inputProps={{\n 'aria-label': `${fieldLabel} for your purchase`, autoComplete, autoCorrect, id, name, spellCheck,\n }}\n inputRef={inputRef}\n value={value}\n {...cvcProps}\n {...props}\n />\n )\n}\n","import React from 'react'\n\nimport { CreditCardExpirationFormControl } from '../../../controls/index.ts'\nimport type { WithFormControlProps } from '../WithFormControlProps.ts'\nimport { FormControlTextField } from './FormControlTextField.tsx'\nimport { useCreditCardFormControl } from './useCreditCardFormControl.tsx'\n\nexport const CreditCardExpirationWithFormControl: React.FC<WithFormControlProps> = ({\n formControlName = 'expiration',\n fieldLabel = 'Expiration',\n ...props\n}) => {\n const {\n creditCardFormControl, error, inputRef, value,\n } = useCreditCardFormControl(formControlName, CreditCardExpirationFormControl)\n const {\n autoComplete, autoCorrect, id, inputMode, name, spellCheck, ...expirationProps\n } = creditCardFormControl?.props ?? {}\n\n return (\n <FormControlTextField\n inputRef={inputRef}\n formControl={creditCardFormControl}\n fieldLabel={fieldLabel}\n formControlError={error}\n inputMode={inputMode}\n inputProps={{\n 'aria-label': `${fieldLabel} of the card`, autoComplete, autoCorrect, id, name, spellCheck,\n }}\n value={value}\n {...expirationProps}\n {...props}\n />\n )\n}\n","import React, { useMemo } from 'react'\n\nimport { NameFormControl } from '../../../controls/index.ts'\nimport type { WithFormControlProps } from '../WithFormControlProps.ts'\nimport { FormControlTextField } from './FormControlTextField.tsx'\nimport { useCreditCardFormControl } from './useCreditCardFormControl.tsx'\n\nexport interface NameWithFormControlProps extends WithFormControlProps {\n autoCompleteLabel: string\n}\n\nexport const NameWithFormControl: React.FC<NameWithFormControlProps> = ({\n autoCompleteLabel,\n fieldLabel = 'Name',\n formControlName,\n placeholder,\n tabIndex,\n ...props\n}) => {\n const args = useMemo(() => [fieldLabel, autoCompleteLabel, placeholder ?? ''], [autoCompleteLabel, fieldLabel, placeholder])\n const {\n creditCardFormControl, error, inputRef, value,\n } = useCreditCardFormControl(formControlName, NameFormControl, args)\n const {\n autoComplete, autoCorrect, id, inputMode, name, spellCheck, ...cvcProps\n } = creditCardFormControl?.props ?? {}\n return (\n <FormControlTextField\n fieldLabel={fieldLabel}\n formControl={creditCardFormControl}\n formControlError={error}\n inputMode={inputMode}\n inputProps={{\n 'aria-label': `${fieldLabel} name on your card`, autoComplete, autoCorrect, id, name, spellCheck, tabIndex,\n }}\n inputRef={inputRef}\n value={value}\n {...cvcProps}\n {...props}\n />\n )\n}\n","import { InputAdornment } from '@mui/material'\nimport React from 'react'\n\nimport { CreditCardNumberFormControl } from '../../../../controls/index.ts'\nimport type { WithFormControlProps } from '../../WithFormControlProps.ts'\nimport { FormControlTextField } from '../FormControlTextField.tsx'\nimport { CreditCardData } from '../Options.ts'\nimport { useCreditCardNumberFormControl } from './use.ts'\n\nexport const CreditCardNumberWithFormControl: React.FC<WithFormControlProps> = ({\n fieldLabel = 'Card Number',\n formControlName = 'cardNumber',\n ...props\n}) => {\n const {\n creditCardFormControl, error, inputRef, type, value,\n } = useCreditCardNumberFormControl(formControlName, CreditCardNumberFormControl)\n const {\n autoComplete, autoCorrect, id, inputMode, name, spellCheck, ...cardProps\n } = creditCardFormControl?.props ?? {}\n\n return (\n <FormControlTextField\n fieldLabel={fieldLabel}\n formControl={creditCardFormControl}\n formControlError={error}\n inputRef={inputRef}\n inputMode={inputMode}\n inputProps={{\n 'aria-label': fieldLabel, autoComplete, autoCorrect, id, inputMode, name, spellCheck,\n }}\n InputProps={{\n startAdornment:\n type.length > 0\n ? (\n <InputAdornment position=\"start\">\n <img height=\"30px\" width=\"40px\" src={CreditCardData[type].icon} />\n </InputAdornment>\n )\n : null,\n }}\n value={value}\n {...cardProps}\n {...props}\n />\n )\n}\n","export { default as AmexIcon } from './american-express.svg'\nexport { default as DiscoverIcon } from './discover.svg'\nexport { default as MastercardIcon } from './mastercard.svg'\nexport { default as VisaIcon } from './visa.svg'\n","import {\n AmexIcon, DiscoverIcon, MastercardIcon, VisaIcon,\n} from '../../img/index.ts'\n\nexport interface CreditCardInfo {\n icon: string\n name: string\n}\n\nexport interface CreditCardOptions {\n amex: CreditCardInfo\n discover: CreditCardInfo\n mastercard: CreditCardInfo\n visa: CreditCardInfo\n}\n\nexport const CreditCardData: CreditCardOptions = {\n amex: { icon: AmexIcon, name: 'American Express' },\n discover: { icon: DiscoverIcon, name: 'Discover' },\n mastercard: { icon: MastercardIcon, name: 'Mastercard' },\n visa: { icon: VisaIcon, name: 'Visa' },\n}\n","import type { StandardTextFieldProps } from '@mui/material'\nimport type { FormControlBase } from '@xyo-network/react-form-group'\nimport { useEffect, useState } from 'react'\n\nimport type { CreditCardNumberFormControl } from '../../../../controls/index.ts'\nimport type { CreditCardOptions } from '../Options.ts'\nimport { useCreditCardFormControl } from '../useCreditCardFormControl.tsx'\n\nexport const useCreditCardNumberFormControl = (formControlName?: string, control?: new () => FormControlBase<StandardTextFieldProps>) => {\n const {\n creditCardFormControl, error, inputRef, value,\n } = useCreditCardFormControl(formControlName, control)\n const [type, setType] = useState('' as keyof CreditCardOptions)\n\n useEffect(() => {\n if (creditCardFormControl) {\n const castControl = creditCardFormControl as CreditCardNumberFormControl<StandardTextFieldProps>\n if (!castControl.onCreditCardTypeChange) {\n console.error('cannot set onCreditCardTypeChange on control because it is not a CreditCardNumberFormControl')\n return\n }\n castControl.onCreditCardTypeChange = (type: string) => setType(type as keyof CreditCardOptions)\n castControl.onCursorChange = (cursor: number | undefined) => {\n if (inputRef.current && cursor) {\n inputRef.current.setSelectionRange(cursor, cursor)\n }\n }\n }\n }, [creditCardFormControl, inputRef])\n\n return {\n creditCardFormControl, error, inputRef, type, value,\n }\n}\n","import React from 'react'\n\nimport { CreditCardZipFormControl } from '../../../controls/index.ts'\nimport type { WithFormControlProps } from '../WithFormControlProps.ts'\nimport { FormControlTextField } from './FormControlTextField.tsx'\nimport { useCreditCardFormControl } from './useCreditCardFormControl.tsx'\n\nexport const CreditCardZipWithFormControl: React.FC<WithFormControlProps> = ({\n formControlName = 'zip', fieldLabel = 'Zip', ...props\n}) => {\n const {\n creditCardFormControl, error, inputRef, value,\n } = useCreditCardFormControl(formControlName, CreditCardZipFormControl)\n const {\n autoComplete, autoCorrect, id, inputMode, name, spellCheck, ...cvcProps\n } = creditCardFormControl?.props ?? {}\n\n return (\n <FormControlTextField\n fieldLabel={fieldLabel}\n formControl={creditCardFormControl}\n formControlError={error}\n inputMode={inputMode}\n inputProps={{\n 'aria-label': `${fieldLabel} code for your card`, autoComplete, autoCorrect, id, name, spellCheck,\n }}\n inputRef={inputRef}\n value={value}\n {...cvcProps}\n {...props}\n />\n )\n}\n","import { Stack } from '@mui/material'\nimport { ErrorRender } from '@xylabs/react-error'\nimport { FlexCol } from '@xylabs/react-flexbox'\nimport React, { useState } from 'react'\n\nimport { FormGroupCreditCardProvider, useFormGroupWithCreditCardInput } from '../../context/index.ts'\nimport { validateCreditCardInputs } from '../support/index.ts'\nimport { InputFieldsStack } from './InputFieldsStack.tsx'\nimport type { CreditCardFormProps } from './Props.ts'\nimport { useFormStorage } from './useFormStorage.tsx'\n\nexport const CreditCardFormFlexbox: React.FC<CreditCardFormProps> = ({\n ConfirmationButton,\n displayErrors,\n onErrorDuringSubmit,\n onInvalidSubmit,\n onSuccessfulSubmit,\n onValidSubmit,\n ...props\n}) => {\n const { formGroup } = useFormGroupWithCreditCardInput(true)\n const [error, setError] = useState<Error>()\n\n const handleConfirmPayment = async () => {\n try {\n if (!formGroup) {\n throw new Error('formGroup is not defined')\n }\n\n formGroup.validateFields()\n\n const errorSummary = formGroup.errorSummary\n\n if (errorSummary.invalidFields.length > 0) {\n onInvalidSubmit?.(errorSummary)\n }\n\n if (errorSummary.invalidFields.length > 0) return\n\n const formOutput = validateCreditCardInputs(formGroup.values)\n\n await onValidSubmit?.(formOutput)\n\n onSuccessfulSubmit?.()\n } catch (error) {\n onErrorDuringSubmit?.(error as Error)\n if (displayErrors) setError(error as Error)\n }\n }\n\n return (\n <>\n <ErrorRender error={error} />\n <FlexCol\n sx={{ flexDirection: { md: 'row', xs: 'column' } }}\n width=\"100%\"\n gap={2}\n {...props}\n >\n <Stack flexDirection=\"column\" sx={{ width: '100%' }} gap={2}>\n <InputFieldsStack />\n {ConfirmationButton\n ? (\n <ConfirmationButton onClick={handleConfirmPayment} variant=\"contained\" sx={{ alignSelf: 'end' }}>\n Confirm Payment\n </ConfirmationButton>\n )\n : null}\n </Stack>\n </FlexCol>\n </>\n )\n}\n\nexport const CreditCardFormFlexboxWithFormGroupProvider: React.FC<CreditCardFormProps> = (props) => {\n const [params, error] = useFormStorage()\n return (\n <FormGroupCreditCardProvider params={params}>\n <ErrorRender error={error} />\n <CreditCardFormFlexbox {...props} />\n </FormGroupCreditCardProvider>\n )\n}\n","export const NameFields = ['firstName', 'lastName'] as const\nexport const NameLabels = ['First', 'Last'] as const\nexport type NameLabel = (typeof NameLabels)[number]\n","import { assertEx } from '@xylabs/assert'\n\nimport type { CreditCardInput } from '../../models/index.ts'\nimport { CreditCardInputSchema } from '../../models/index.ts'\n\nexport const validateCreditCardInputs = (values: CreditCardInput): CreditCardInput => {\n return {\n cardNumber: assertEx(values.cardNumber, () => 'card number is not a string') as string,\n cvc: assertEx(values.cvc, () => 'card cvc is not a string') as string,\n emailAddress: assertEx(values.emailAddress, () => 'emailAddress is not a string') as string,\n expiration: assertEx(values.expiration, () => 'card expiration is not a string') as string,\n firstName: assertEx(values.firstName, () => 'first name is not a string') as string,\n lastName: assertEx(values.lastName, () => 'last name is not a string') as string,\n schema: CreditCardInputSchema,\n timestamp: values.timestamp,\n zip: assertEx(values.zip, () => 'zip is not a string') as string,\n }\n}\n","import type { Payload } from '@xyo-network/payload-model'\nimport { isPayloadOfSchemaTypeWithMeta } from '@xyo-network/payload-model'\n\nexport const CreditCardInputSchema = 'network.xyo.credit.card.input' as const\nexport type CreditCardInputSchema = typeof CreditCardInputSchema\n\nexport type CreditCardInputFields = {\n cardNumber: string\n cvc: string\n emailAddress: string\n expiration: string\n firstName: string\n lastName: string\n timestamp: number\n zip: string\n}\n\nexport type CreditCardInput = Payload<CreditCardInputFields, CreditCardInputSchema>\n\nexport const isCreditCardInput = isPayloadOfSchemaTypeWithMeta<CreditCardInput>(CreditCardInputSchema)\n","import type { StackProps } from '@mui/material'\nimport { Stack } from '@mui/material'\nimport type { PropsWithChildren } from 'react'\nimport React from 'react'\n\nimport {\n CreditCardCvvWithFormControl,\n CreditCardEmailWithFormControl,\n CreditCardExpirationWithFormControl,\n CreditCardNumberWithFormControl,\n CreditCardZipWithFormControl,\n NameWithFormControl,\n} from '../controls/index.ts'\n\nexport interface InputFieldsStackProps extends StackProps, PropsWithChildren {}\n\nexport const InputFieldsStack: React.FC<InputFieldsStackProps> = (props) => {\n const { sx } = props\n return (\n <>\n <Stack\n gap={2}\n sx={{\n flexDirection: { md: 'row', xs: 'column' },\n ...sx,\n }}\n {...props}\n >\n <NameWithFormControl autoCompleteLabel=\"given-name\" fieldLabel=\"First\" formControlName=\"firstName\" placeholder=\"Jerry\" />\n <NameWithFormControl autoCompleteLabel=\"family-name\" fieldLabel=\"Last\" formControlName=\"lastName\" placeholder=\"Smith\" />\n </Stack>\n <Stack\n gap={2}\n sx={{\n flexDirection: { lg: 'row', xs: 'column' },\n ...sx,\n }}\n {...props}\n >\n <Stack width={{ lg: '50%', xs: '100%' }}>\n <CreditCardNumberWithFormControl />\n </Stack>\n <Stack\n direction={{ lg: 'row', xs: 'column' }}\n gap={2}\n width={{ lg: '50%', xs: '100%' }}\n >\n <CreditCardCvvWithFormControl />\n <CreditCardExpirationWithFormControl />\n </Stack>\n </Stack>\n <Stack\n gap={2}\n sx={{\n flexDirection: { md: 'row', xs: 'column' },\n ...sx,\n }}\n {...props}\n >\n <Stack width={{ md: '25%', xs: '100%' }}>\n <CreditCardZipWithFormControl />\n </Stack>\n <Stack width={{ md: '75%', xs: '100%' }}>\n <CreditCardEmailWithFormControl />\n </Stack>\n </Stack>\n </>\n )\n}\n","import { usePromise } from '@xylabs/react-promise'\nimport { StorageArchivist, StorageArchivistConfigSchema } from '@xyo-network/archivist-storage'\nimport type { FormGroupParams } from '@xyo-network/react-form-group'\nimport { ArchivistFormGroupStorage } from '@xyo-network/react-form-group'\n\nimport type { CreditCardInput } from '../../models/index.ts'\n\nconst STORAGE_NAME_SPACE = 'credit-card-fields' as const\n\nconst calculateTTL = (months = 6) => {\n const MS_PER_DAY = 24 * 60 * 60 * 1000\n const DAYS_PER_MONTH = 30.44\n return months * DAYS_PER_MONTH * MS_PER_DAY\n}\n\nexport const useFormStorage = () => {\n return usePromise(async () => {\n const localStorageArchivist = await StorageArchivist.create({\n account: 'random',\n config: {\n namespace: STORAGE_NAME_SPACE, schema: StorageArchivistConfigSchema, type: 'local',\n },\n })\n const sessionStorageArchivist = await StorageArchivist.create({\n account: 'random',\n config: {\n namespace: STORAGE_NAME_SPACE, schema: StorageArchivistConfigSchema, type: 'session',\n },\n })\n\n const storage = {\n sensitive: new ArchivistFormGroupStorage(sessionStorageArchivist),\n storage: new ArchivistFormGroupStorage(localStorageArchivist),\n }\n\n return {\n serialize: true, storage, ttlStorage: calculateTTL(),\n } as FormGroupParams<CreditCardInput>\n }, [])\n}\n"],"mappings":"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","names":["React","assertEx","FormControlBase","valid","unmask","value","replaceAll","CONTROL_NAME","CreditCardCvvFormControl","FormControlBase","invalidMessage","pattern","patternStrict","props","autoComplete","autoCorrect","id","inputMode","name","placeholder","spellCheck","required","unmask","_cardNumberFormControl","undefined","constructor","setName","setSerializeSettings","sensitive","serializable","cardNumberFormControl","assertEx","blurError","value","num","max","getCardNumberCvcMax","cvvValidation","valid","cvv","isValid","setError","setStatus","changeError","unmasked","match","isPotentiallyValid","setCardNumberFormControl","numberValidation","number","card","code","size","assertEx","FormControlBase","valid","CONTROL_NAME","CreditCardExpirationFormControl","FormControlBase","invalidMessage","pattern","patternStrict","props","autoComplete","autoCorrect","id","inputMode","name","placeholder","spellCheck","required","unmask","_cardNumberFormControl","undefined","constructor","setName","setSerializeSettings","sensitive","serializable","cardNumberFormControl","assertEx","rawValue","value","blurError","unmasked","expirationValid","valid","expirationDate","length","setErrorAndValidity","isValid","changeError","isPotentiallyValid","mask","test","makeMask","separator","limit","output","i","push","join","FormControlBase","valid","CONTROL_NAME","CreditCardNumberFormControl","FormControlBase","creditCardType","invalidMessage","pattern","patternStrict","props","autoComplete","autoCorrect","id","inputMode","name","placeholder","spellCheck","required","unmask","constructor","setName","setSerializeSettings","sensitive","serializable","blurError","value","unmasked","numberValidation","valid","number","isValid","setErrorAndValidity","changeError","match","isPotentiallyValid","earlyNumberCheck","setCreditCardType","getCursorPosition","previousValue","card","lengthChange","length","unmaskedChange","gaps","oldCursor","cursorPosition","previous","oldSeparation","filter","gap","i","newSeparation","newCursor","mask","max","lengths","includes","newVal","map","slice","Boolean","join","onCreditCardTypeChange","type","setValue","options","umMasked","charAt","FormControlBase","CONTROL_NAME","CreditCardEmailFormControl","FormControlBase","invalidMessage","pattern","patternStrict","props","autoComplete","autoCorrect","id","toLocaleLowerCase","name","placeholder","spellCheck","required","constructor","setName","setSerializeSettings","sensitive","serializable","blurError","value","match","updateValidation","changeError","error","setErrorAndValidity","FormControlBase","NameFormControl","FormControlBase","required","constructor","nameLabel","autoCompleteLabel","placeHolder","setName","setSerializeSettings","sensitive","serializable","invalidMessage","props","autoComplete","autoCorrect","id","name","placeholder","spellCheck","blurError","value","setErrorAndValidity","changeError","FormControlBase","valid","CONTROL_NAME","CreditCardZipFormControl","FormControlBase","invalidMessage","props","autoComplete","autoCorrect","id","toLocaleLowerCase","name","placeholder","spellCheck","required","unmask","constructor","setName","setSerializeSettings","sensitive","serializable","blurError","value","postalCodeValidation","valid","postalCode","isValid","setErrorAndValidity","changeError","unmasked","match","patternStrict","isPotentiallyValid","FormControl","MuiFormControl","TextField","LabeledTextFieldWrapper","React","forwardRef","FormControlTextField","forwardRef","formControl","formControlError","fieldLabel","props","ref","name","handleChange","event","setValue","target","value","handleBlur","blurError","setTouched","MuiFormControl","fullWidth","LabeledTextFieldWrapper","label","htmlFor","TextField","error","helperText","hiddenLabel","onBlur","onChange","onKeyDown","selectionEnd","cursorPosition","previous","required","size","variant","displayName","useEffect","createContextEx","FormGroupCreditCardContext","FormGroup","React","useMemo","FormGroupCreditCardProvider","children","params","props","formGroup","useMemo","FormGroup","value","provided","React","FormGroupCreditCardContext","Provider","useContextEx","useFormGroupWithCreditCardInput","required","useContextEx","FormGroupCreditCardContext","useMemo","useRef","useState","STABLE_DEFAULT_ARGS","useCreditCardFormControl","formControlName","Control","args","error","setError","useState","value","setValue","inputRef","useRef","formGroup","useFormGroupWithCreditCardInput","creditCardFormControl","useMemo","control","registerOnErrorChange","newError","registerOnChange","registerControl","useCreditCardCvvFormControl","formControlName","cardNumberControlName","control","creditCardFormControl","error","value","inputRef","useCreditCardFormControl","formGroup","useFormGroupWithCreditCardInput","creditCardNumberFormControl","getControl","useEffect","castControl","setCardNumberFormControl","console","CreditCardCvvWithFormControl","formControlName","fieldLabel","props","creditCardFormControl","error","inputRef","value","useCreditCardCvvFormControl","undefined","CreditCardCvvFormControl","autoComplete","autoCorrect","id","inputMode","name","spellCheck","cvcProps","React","FormControlTextField","formControl","formControlError","inputProps","React","CreditCardEmailWithFormControl","formControlName","fieldLabel","props","creditCardFormControl","error","inputRef","value","useCreditCardFormControl","CreditCardEmailFormControl","autoComplete","autoCorrect","id","inputMode","name","spellCheck","cvcProps","React","FormControlTextField","formControl","formControlError","inputProps","React","CreditCardExpirationWithFormControl","formControlName","fieldLabel","props","creditCardFormControl","error","inputRef","value","useCreditCardFormControl","CreditCardExpirationFormControl","autoComplete","autoCorrect","id","inputMode","name","spellCheck","expirationProps","React","FormControlTextField","formControl","formControlError","inputProps","React","useMemo","NameWithFormControl","autoCompleteLabel","fieldLabel","formControlName","placeholder","tabIndex","props","args","useMemo","creditCardFormControl","error","inputRef","value","useCreditCardFormControl","NameFormControl","autoComplete","autoCorrect","id","inputMode","name","spellCheck","cvcProps","React","FormControlTextField","formControl","formControlError","inputProps","InputAdornment","React","AmexIcon","default","DiscoverIcon","MastercardIcon","VisaIcon","CreditCardData","amex","icon","AmexIcon","name","discover","DiscoverIcon","mastercard","MastercardIcon","visa","VisaIcon","useEffect","useState","useCreditCardNumberFormControl","formControlName","control","creditCardFormControl","error","inputRef","value","useCreditCardFormControl","type","setType","useState","useEffect","castControl","onCreditCardTypeChange","console","onCursorChange","cursor","current","setSelectionRange","CreditCardNumberWithFormControl","fieldLabel","formControlName","props","creditCardFormControl","error","inputRef","type","value","useCreditCardNumberFormControl","CreditCardNumberFormControl","autoComplete","autoCorrect","id","inputMode","name","spellCheck","cardProps","React","FormControlTextField","formControl","formControlError","inputProps","InputProps","startAdornment","length","InputAdornment","position","img","height","width","src","CreditCardData","icon","React","CreditCardZipWithFormControl","formControlName","fieldLabel","props","creditCardFormControl","error","inputRef","value","useCreditCardFormControl","CreditCardZipFormControl","autoComplete","autoCorrect","id","inputMode","name","spellCheck","cvcProps","React","FormControlTextField","formControl","formControlError","inputProps","Stack","ErrorRender","FlexCol","React","useState","NameFields","NameLabels","assertEx","isPayloadOfSchemaTypeWithMeta","CreditCardInputSchema","isCreditCardInput","validateCreditCardInputs","values","cardNumber","assertEx","cvc","emailAddress","expiration","firstName","lastName","schema","CreditCardInputSchema","timestamp","zip","Stack","React","InputFieldsStack","props","sx","React","Stack","gap","flexDirection","md","xs","NameWithFormControl","autoCompleteLabel","fieldLabel","formControlName","placeholder","lg","width","CreditCardNumberWithFormControl","direction","CreditCardCvvWithFormControl","CreditCardExpirationWithFormControl","CreditCardZipWithFormControl","CreditCardEmailWithFormControl","usePromise","StorageArchivist","StorageArchivistConfigSchema","ArchivistFormGroupStorage","STORAGE_NAME_SPACE","calculateTTL","months","MS_PER_DAY","DAYS_PER_MONTH","useFormStorage","usePromise","localStorageArchivist","StorageArchivist","create","account","config","namespace","schema","StorageArchivistConfigSchema","type","sessionStorageArchivist","storage","sensitive","ArchivistFormGroupStorage","serialize","ttlStorage","CreditCardFormFlexbox","ConfirmationButton","displayErrors","onErrorDuringSubmit","onInvalidSubmit","onSuccessfulSubmit","onValidSubmit","props","formGroup","useFormGroupWithCreditCardInput","error","setError","useState","handleConfirmPayment","Error","validateFields","errorSummary","invalidFields","length","formOutput","validateCreditCardInputs","values","React","ErrorRender","FlexCol","sx","flexDirection","md","xs","width","gap","Stack","InputFieldsStack","onClick","variant","alignSelf","CreditCardFormFlexboxWithFormGroupProvider","params","useFormStorage","FormGroupCreditCardProvider"]}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@xyo-network/react-form-credit-card",
3
- "version": "4.1.8",
3
+ "version": "4.1.9",
4
4
  "description": "Common React library for all XYO projects that use React",
5
5
  "keywords": [
6
6
  "xyo",
@@ -44,15 +44,15 @@
44
44
  },
45
45
  "dependencies": {
46
46
  "@mui/icons-material": "^6.1.5",
47
- "@xylabs/assert": "^4.3.2",
48
- "@xylabs/object": "^4.3.2",
49
- "@xylabs/react-flexbox": "^5.2.4",
50
- "@xylabs/react-promise": "^5.2.4",
51
- "@xyo-network/archivist-storage": "^3.3.1",
52
- "@xyo-network/payload-model": "^3.3.1",
53
- "@xyo-network/react-error": "^4.1.8",
54
- "@xyo-network/react-form-group": "^4.1.8",
55
- "@xyo-network/react-shared": "^4.1.8",
47
+ "@xylabs/assert": "^4.3.3",
48
+ "@xylabs/object": "^4.3.3",
49
+ "@xylabs/react-error": "^5.2.7",
50
+ "@xylabs/react-flexbox": "^5.2.7",
51
+ "@xylabs/react-promise": "^5.2.7",
52
+ "@xyo-network/archivist-storage": "^3.3.2",
53
+ "@xyo-network/payload-model": "^3.3.2",
54
+ "@xyo-network/react-form-group": "^4.1.9",
55
+ "@xyo-network/react-shared": "^4.1.9",
56
56
  "card-validator": "^10.0.0"
57
57
  },
58
58
  "devDependencies": {
@@ -63,6 +63,7 @@
63
63
  "@xylabs/tsconfig-react": "^4.2.3",
64
64
  "react": "^18.3.1",
65
65
  "react-dom": "^18.3.1",
66
+ "react-router-dom": "^6.27.0",
66
67
  "storybook": "^8.3.6",
67
68
  "typescript": "^5.6.3"
68
69
  },
@@ -70,7 +71,8 @@
70
71
  "@mui/material": "^6",
71
72
  "@mui/styles": "^6",
72
73
  "react": "^18",
73
- "react-dom": "^18"
74
+ "react-dom": "^18",
75
+ "react-router-dom": "^6"
74
76
  },
75
77
  "publishConfig": {
76
78
  "access": "public"
package/src/components/form/Form.tsx CHANGED
@@ -1,6 +1,6 @@
1
1
  import { Stack } from '@mui/material'
2
+ import { ErrorRender } from '@xylabs/react-error'
2
3
  import { FlexCol } from '@xylabs/react-flexbox'
3
- import { ErrorRender } from '@xyo-network/react-error'
4
4
  import React, { useState } from 'react'
5
5
 
6
6
  import { FormGroupCreditCardProvider, useFormGroupWithCreditCardInput } from '../../context/index.ts'