@xyo-network/react-form-credit-card 3.0.1 → 3.0.3

package/dist/browser/index.d.ts

@@ -1,223 +1,6 @@
-import * as React from 'react';
-import React__default, { ComponentType, PropsWithChildren } from 'react';
-import { StandardTextFieldProps, ButtonProps, StackProps } from '@mui/material';
-import * as _xyo_network_react_form_group from '@xyo-network/react-form-group';
-import { FormControlBase, FormControl, ValidControlValue, ErrorSummary, FormGroupParams, FormGroupContextWithPayloadState, AbstractControl, SetOptions } from '@xyo-network/react-form-group';
-import { FlexBoxProps } from '@xylabs/react-flexbox';
-import * as _xyo_network_payload_model from '@xyo-network/payload-model';
-import { Payload } from '@xyo-network/payload-model';
-import * as _xylabs_react_promise from '@xylabs/react-promise';
-import * as _xyo_network_react_shared from '@xyo-network/react-shared';
-import { EmptyObject } from '@xylabs/object';
-
-interface WithFormControlProps extends StandardTextFieldProps {
-    fieldLabel?: string;
-    formControlName?: string;
-}
-
-declare const CreditCardCvvWithFormControl: React__default.FC<WithFormControlProps>;
-
-declare const useCreditCardCvvFormControl: (formControlName?: string, cardNumberControlName?: string, control?: new () => FormControlBase<StandardTextFieldProps>) => {
-    creditCardFormControl: FormControlBase<StandardTextFieldProps> | undefined;
-    error: string;
-    inputRef: React.RefObject<HTMLInputElement>;
-    value: _xyo_network_react_form_group.ValidControlValue;
-};
-
-declare const CreditCardEmailWithFormControl: React__default.FC<WithFormControlProps>;
-
-declare const CreditCardExpirationWithFormControl: React__default.FC<WithFormControlProps>;
-
-interface FormControlTextFieldProps extends StandardTextFieldProps {
-    fieldLabel: string;
-    formControl?: FormControl<StandardTextFieldProps>;
-    formControlError?: string;
-}
-declare const FormControlTextField: React__default.ForwardRefExoticComponent<Omit<FormControlTextFieldProps, "ref"> & React__default.RefAttributes<HTMLDivElement>>;
-
-interface NameWithFormControlProps extends WithFormControlProps {
-    autoCompleteLabel: string;
-}
-declare const NameWithFormControl: React__default.FC<NameWithFormControlProps>;
-
-declare const CreditCardNumberWithFormControl: React__default.FC<WithFormControlProps>;
-
-declare const useCreditCardNumberFormControl: (formControlName?: string, control?: new () => FormControlBase<StandardTextFieldProps>) => {
-    creditCardFormControl: FormControlBase<StandardTextFieldProps> | undefined;
-    error: string;
-    inputRef: React.RefObject<HTMLInputElement>;
-    type: "visa" | "mastercard" | "amex" | "discover";
-    value: _xyo_network_react_form_group.ValidControlValue;
-};
-
-interface CreditCardInfo {
-    icon: string;
-    name: string;
-}
-interface CreditCardOptions {
-    amex: CreditCardInfo;
-    discover: CreditCardInfo;
-    mastercard: CreditCardInfo;
-    visa: CreditCardInfo;
-}
-declare const CreditCardData: CreditCardOptions;
-
-declare const useCreditCardFormControl: (formControlName?: string, Control?: new (...args: any[]) => FormControlBase<StandardTextFieldProps>, args?: any[]) => {
-    creditCardFormControl: FormControlBase<StandardTextFieldProps> | undefined;
-    error: string;
-    inputRef: React.RefObject<HTMLInputElement>;
-    value: ValidControlValue;
-};
-
-declare const CreditCardZipWithFormControl: React__default.FC<WithFormControlProps>;
-
-declare const CreditCardInputSchema: "network.xyo.credit.card.input";
-type CreditCardInputSchema = typeof CreditCardInputSchema;
-type CreditCardInputFields = {
-    cardNumber: string;
-    cvc: string;
-    emailAddress: string;
-    expiration: string;
-    firstName: string;
-    lastName: string;
-    timestamp: number;
-    zip: string;
-};
-type CreditCardInput = Payload<CreditCardInputFields, CreditCardInputSchema>;
-declare const isCreditCardInput: (x?: unknown | null) => x is _xyo_network_payload_model.WithMeta<_xyo_network_payload_model.SchemaFields & _xyo_network_payload_model.PayloadFields & CreditCardInputFields & {
-    schema: "network.xyo.credit.card.input";
-}, void>;
-
-interface CreditCardFormProps extends FlexBoxProps {
-    ConfirmationButton?: ComponentType<ButtonProps>;
-    displayErrors?: boolean;
-    onErrorDuringSubmit?: (error: Error) => void;
-    onInvalidSubmit?: (errorSummary: ErrorSummary) => void;
-    onSuccessfulSubmit?: () => void;
-    onValidSubmit?: (values: CreditCardInput) => Promise<void>;
-}
-
-declare const CreditCardFormFlexbox: React__default.FC<CreditCardFormProps>;
-declare const CreditCardFormFlexboxWithFormGroupProvider: React__default.FC<CreditCardFormProps>;
-
-interface InputFieldsStackProps extends StackProps, PropsWithChildren {
-}
-declare const InputFieldsStack: React__default.FC<InputFieldsStackProps>;
-
-declare const useFormStorage: () => [FormGroupParams<_xyo_network_payload_model.SchemaFields & _xyo_network_payload_model.PayloadFields & CreditCardInputFields & {
-    schema: "network.xyo.credit.card.input";
-}> | undefined, Error | undefined, _xylabs_react_promise.State | undefined];
-
-declare const NameFields: readonly ["firstName", "lastName"];
-declare const NameLabels: readonly ["First", "Last"];
-type NameLabel = (typeof NameLabels)[number];
-
-type InputError = {
-    errorMessage: string;
-    invalidFields: string[];
-};
-
-declare const validateCreditCardInputs: (values: CreditCardInput) => CreditCardInput;
-
-declare const FormGroupCreditCardContext: React.Context<FormGroupContextWithPayloadState<_xyo_network_payload_model.SchemaFields & _xyo_network_payload_model.PayloadFields & CreditCardInputFields & {
-    schema: "network.xyo.credit.card.input";
-}, _xyo_network_payload_model.SchemaFields & _xyo_network_payload_model.PayloadFields & CreditCardInputFields & {
-    schema: "network.xyo.credit.card.input";
-}> & _xyo_network_react_shared.ContextExState>;
-
-interface FormGroupCreditCardProviderProps<TStorage extends Payload = Payload> extends PropsWithChildren {
-    params?: FormGroupParams<TStorage>;
-}
-declare const FormGroupCreditCardProvider: React__default.FC<FormGroupCreditCardProviderProps<CreditCardInput>>;
-
-declare const useFormGroupWithCreditCardInput: (required?: boolean) => Omit<_xyo_network_react_form_group.FormGroupContextWithPayloadState<_xyo_network_payload_model.SchemaFields & _xyo_network_payload_model.PayloadFields & CreditCardInputFields & {
-    schema: "network.xyo.credit.card.input";
-}, _xyo_network_payload_model.SchemaFields & _xyo_network_payload_model.PayloadFields & CreditCardInputFields & {
-    schema: "network.xyo.credit.card.input";
-}> & _xyo_network_react_shared.ContextExState, "provided">;
-
-declare function unmask(value: string): string;
-
-declare class CreditCardCvvFormControl<TProps extends EmptyObject = EmptyObject> extends FormControlBase<TProps> {
-    invalidMessage: string;
-    pattern: RegExp;
-    patternStrict: RegExp;
-    props: TProps;
-    required: boolean;
-    unmask: typeof unmask;
-    private _cardNumberFormControl;
-    constructor();
-    get cardNumberFormControl(): AbstractControl<_xyo_network_react_form_group.ValidControlValue>;
-    blurError(value: string): void;
-    changeError(value: string): void;
-    setCardNumberFormControl(cardNumberFormControl: AbstractControl): void;
-    private getCardNumberCvcMax;
-}
-
-declare class CreditCardExpirationFormControl<TProps extends EmptyObject = EmptyObject> extends FormControlBase {
-    invalidMessage: string;
-    pattern: RegExp;
-    patternStrict: RegExp;
-    props: TProps;
-    required: boolean;
-    unmask: typeof unmask;
-    private _cardNumberFormControl;
-    constructor();
-    get cardNumberFormControl(): AbstractControl<_xyo_network_react_form_group.ValidControlValue>;
-    get rawValue(): _xyo_network_react_form_group.ValidControlValue;
-    blurError(value: string): void;
-    changeError(value: string): void;
-    mask(value: string): string;
-    private makeMask;
-}
-
-declare class CreditCardNumberFormControl<TProps extends EmptyObject = EmptyObject> extends FormControlBase<TProps> {
-    creditCardType: string;
-    invalidMessage: string;
-    pattern: RegExp;
-    patternStrict: RegExp;
-    props: TProps;
-    required: boolean;
-    unmask: typeof unmask;
-    constructor();
-    blurError(value: string): void;
-    changeError(value: string): void;
-    earlyNumberCheck(number: string): void;
-    getCursorPosition(): number | undefined;
-    mask(value?: ValidControlValue): string;
-    onCreditCardTypeChange: (type: string) => void;
-    setCreditCardType(type: string): void;
-    setValue(value: string | undefined, options: SetOptions): void;
-}
-
-declare class CreditCardEmailFormControl<TProps extends EmptyObject = EmptyObject> extends FormControlBase<TProps> {
-    invalidMessage: string;
-    pattern: RegExp;
-    patternStrict: RegExp;
-    props: TProps;
-    required: boolean;
-    constructor();
-    blurError(value: string): void;
-    changeError(value: string): void;
-    private updateValidation;
-}
-
-declare class NameFormControl<TProps extends EmptyObject = EmptyObject> extends FormControlBase<TProps> {
-    private nameLabel;
-    required: boolean;
-    constructor(nameLabel: string, autoCompleteLabel: string, placeHolder: string);
-    blurError(value: string): void;
-    changeError(value: string): void;
-}
-
-declare class CreditCardZipFormControl<TProps extends EmptyObject = EmptyObject> extends FormControlBase<TProps> {
-    invalidMessage: string;
-    props: TProps;
-    required: boolean;
-    unmask: typeof unmask;
-    constructor();
-    blurError(value: string): void;
-    changeError(value: string): void;
-}
-
-export { CreditCardCvvFormControl, CreditCardCvvWithFormControl, CreditCardData, CreditCardEmailFormControl, CreditCardEmailWithFormControl, CreditCardExpirationFormControl, CreditCardExpirationWithFormControl, CreditCardFormFlexbox, CreditCardFormFlexboxWithFormGroupProvider, type CreditCardFormProps, type CreditCardInfo, type CreditCardInput, type CreditCardInputFields, CreditCardInputSchema, CreditCardNumberFormControl, CreditCardNumberWithFormControl, type CreditCardOptions, CreditCardZipFormControl, CreditCardZipWithFormControl, FormControlTextField, type FormControlTextFieldProps, FormGroupCreditCardContext, FormGroupCreditCardProvider, type FormGroupCreditCardProviderProps, type InputError, InputFieldsStack, type InputFieldsStackProps, NameFields, NameFormControl, type NameLabel, NameLabels, NameWithFormControl, type NameWithFormControlProps, type WithFormControlProps, isCreditCardInput, unmask, useCreditCardCvvFormControl, useCreditCardFormControl, useCreditCardNumberFormControl, useFormGroupWithCreditCardInput, useFormStorage, validateCreditCardInputs };
+export * from './components/index.ts';
+export * from './context/index.ts';
+export * from './controls/index.ts';
+export * from './models/index.ts';
+export * from './utils/index.ts';
+//# sourceMappingURL=index.d.ts.map

package/dist/browser/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,uBAAuB,CAAA;AACrC,cAAc,oBAAoB,CAAA;AAClC,cAAc,qBAAqB,CAAA;AACnC,cAAc,mBAAmB,CAAA;AACjC,cAAc,kBAAkB,CAAA"}

package/dist/browser/index.mjs

@@ -487,16 +487,16 @@ var FormGroupCreditCardProvider = /* @__PURE__ */ __name(({ children, params, ..
   }, [
     params
   ]);
-  return (
-    // eslint-disable-next-line @eslint-react/no-unstable-context-value
-    /* @__PURE__ */ React2.createElement(FormGroupCreditCardContext.Provider, {
-      value: {
-        formGroup,
-        provided: true
-      },
-      ...props
-    }, children)
-  );
+  const value = useMemo(() => ({
+    formGroup,
+    provided: true
+  }), [
+    formGroup
+  ]);
+  return /* @__PURE__ */ React2.createElement(FormGroupCreditCardContext.Provider, {
+    value,
+    ...props
+  }, children);
 }, "FormGroupCreditCardProvider");
 
 // src/context/useFormGroupWithCreditCard.tsx
@@ -507,8 +507,8 @@ var useFormGroupWithCreditCardInput = /* @__PURE__ */ __name((required = false)
 
 // src/components/controls/card/useCreditCardFormControl.tsx
 import { useMemo as useMemo2, useRef, useState } from "react";
-var StableDefaultArgs = [];
-var useCreditCardFormControl = /* @__PURE__ */ __name((formControlName, Control, args = StableDefaultArgs) => {
+var STABLE_DEFAULT_ARGS = [];
+var useCreditCardFormControl = /* @__PURE__ */ __name((formControlName, Control, args = STABLE_DEFAULT_ARGS) => {
   const [error, setError] = useState("");
   const [value, setValue] = useState("");
   const inputRef = useRef(null);
@@ -907,7 +907,7 @@ var InputFieldsStack = /* @__PURE__ */ __name((props) => {
 import { usePromise } from "@xylabs/react-promise";
 import { StorageArchivist, StorageArchivistConfigSchema } from "@xyo-network/archivist-storage";
 import { ArchivistFormGroupStorage } from "@xyo-network/react-form-group";
-var StorageNameSpace = "credit-card-fields";
+var STORAGE_NAME_SPACE = "credit-card-fields";
 var calculateTTL = /* @__PURE__ */ __name((months = 6) => {
   const MS_PER_DAY = 24 * 60 * 60 * 1e3;
   const DAYS_PER_MONTH = 30.44;
@@ -918,7 +918,7 @@ var useFormStorage = /* @__PURE__ */ __name(() => {
     const localStorageArchivist = await StorageArchivist.create({
       account: "random",
       config: {
-        namespace: StorageNameSpace,
+        namespace: STORAGE_NAME_SPACE,
         schema: StorageArchivistConfigSchema,
         type: "local"
       }
@@ -926,7 +926,7 @@ var useFormStorage = /* @__PURE__ */ __name(() => {
     const sessionStorageArchivist = await StorageArchivist.create({
       account: "random",
       config: {
-        namespace: StorageNameSpace,
+        namespace: STORAGE_NAME_SPACE,
         schema: StorageArchivistConfigSchema,
         type: "session"
       }