tf-checkout-react 1.5.9 → 1.6.0

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 (56) hide show
  1. package/dist/adapters/customFields.d.ts +11 -0
  2. package/dist/adapters/index.d.ts +1 -0
  3. package/dist/api/index.d.ts +6 -0
  4. package/dist/components/billing-info-container/index.d.ts +5 -2
  5. package/dist/components/billing-info-container/utils.d.ts +7 -5
  6. package/dist/components/common/Checkbox.d.ts +11 -0
  7. package/dist/components/common/CheckboxField/index.d.ts +9 -0
  8. package/dist/components/common/index.d.ts +1 -0
  9. package/dist/components/orderDetailsContainer/CustomFieldsForm.d.ts +12 -0
  10. package/dist/components/orderDetailsContainer/TicketHolderCustomFields.d.ts +10 -0
  11. package/dist/components/orderDetailsContainer/index.d.ts +29 -1
  12. package/dist/components/orderDetailsContainer/ticketsTable.d.ts +4 -1
  13. package/dist/components/orderDetailsContainer/utils/index.d.ts +6 -0
  14. package/dist/hoc/CustomFields/index.d.ts +3 -0
  15. package/dist/hoc/index.d.ts +1 -0
  16. package/dist/images/edit.svg +10 -0
  17. package/dist/tf-checkout-react.cjs.development.js +922 -210
  18. package/dist/tf-checkout-react.cjs.development.js.map +1 -1
  19. package/dist/tf-checkout-react.cjs.production.min.js +1 -1
  20. package/dist/tf-checkout-react.cjs.production.min.js.map +1 -1
  21. package/dist/tf-checkout-react.esm.js +924 -212
  22. package/dist/tf-checkout-react.esm.js.map +1 -1
  23. package/dist/types/billing-info-data.d.ts +2 -2
  24. package/dist/utils/createCheckoutDataBodyWithDefaultHolder.d.ts +3 -0
  25. package/dist/utils/customFields.d.ts +24 -0
  26. package/dist/utils/index.d.ts +1 -0
  27. package/package.json +1 -1
  28. package/src/adapters/customFields.ts +79 -0
  29. package/src/adapters/index.ts +1 -0
  30. package/src/api/index.ts +43 -0
  31. package/src/assets/images/edit.svg +10 -0
  32. package/src/components/billing-info-container/index.tsx +106 -60
  33. package/src/components/billing-info-container/utils.ts +29 -5
  34. package/src/components/common/{CheckboxField.tsx → Checkbox.tsx} +3 -3
  35. package/src/components/common/CheckboxField/index.tsx +41 -0
  36. package/src/components/common/CustomField.tsx +1 -1
  37. package/src/components/common/RadioGroupField/index.tsx +1 -1
  38. package/src/components/common/SelectField/index.tsx +1 -1
  39. package/src/components/common/index.tsx +1 -0
  40. package/src/components/orderDetailsContainer/CustomFieldsForm.tsx +75 -0
  41. package/src/components/orderDetailsContainer/TicketHolderCustomFields.tsx +100 -0
  42. package/src/components/orderDetailsContainer/index.tsx +175 -20
  43. package/src/components/orderDetailsContainer/ticketsTable.tsx +55 -33
  44. package/src/components/orderDetailsContainer/utils/index.tsx +55 -0
  45. package/src/components/paymentContainer/PaymentPlanSection.tsx +52 -35
  46. package/src/components/paymentContainer/index.tsx +2 -2
  47. package/src/components/stripePayment/index.tsx +2 -2
  48. package/src/components/ticketResale/index.tsx +4 -1
  49. package/src/components/ticketsContainer/index.tsx +1 -0
  50. package/src/hoc/CustomFields/index.tsx +77 -0
  51. package/src/hoc/index.ts +1 -0
  52. package/src/types/billing-info-data.ts +2 -2
  53. package/src/utils/createCheckoutDataBodyWithDefaultHolder.ts +3 -0
  54. package/src/utils/customFields.ts +58 -0
  55. package/src/utils/index.ts +1 -0
  56. package/dist/components/common/CheckboxField.d.ts +0 -11
@@ -0,0 +1,11 @@
1
+ import { IGroupItem } from '../types';
2
+ export declare const optionsAdapter: (options: any) => {
3
+ id: any;
4
+ label: any;
5
+ value: any;
6
+ }[];
7
+ export declare const fieldDataAdapter: (field: IGroupItem) => IGroupItem;
8
+ export declare const customFieldsDataAdapter: (data: any) => {
9
+ ticketsFields: IGroupItem[];
10
+ orderFields: IGroupItem[];
11
+ };
@@ -0,0 +1 @@
1
+ export { customFieldsDataAdapter } from './customFields';
@@ -56,6 +56,12 @@ export interface ResponseConfigs {
56
56
  status: number;
57
57
  }
58
58
  export declare const getCheckoutPageConfigs: () => Promise<ResponseConfigs>;
59
+ export declare const getCustomFields: (eventId: string) => Promise<{
60
+ ticketsFields: import("../types").IGroupItem[];
61
+ orderFields: import("../types").IGroupItem[];
62
+ }>;
63
+ export declare const updateOrderCustomFields: (eventId: string, orderId: string, customFieldsData: Record<string, any>) => Promise<AxiosResponse<any, any>>;
64
+ export declare const updateTicketHoldersCustomFields: (eventId: string, customFieldsData: Record<string, any>, ticketHash: string) => Promise<AxiosResponse<any, any>>;
59
65
  export declare const confirmPreRegistration: (eventId: string | number, data: IConfirmPreRegistrationRequestData) => Promise<any>;
60
66
  export declare const getSeatMapData: (eventId: string | number) => Promise<SeatMapDataResponse>;
61
67
  export declare const getSeatMapStatuses: (eventId: string | number) => Promise<SeatMapStatusesResponse>;
@@ -1,9 +1,9 @@
1
+ /// <reference types="react" />
1
2
  import './style.css';
2
3
  import { ThemeOptions } from '@mui/material';
3
4
  import { CSSProperties } from '@mui/styles';
4
5
  import { AxiosError } from 'axios';
5
6
  import { FormikHelpers, FormikValues } from 'formik';
6
- import React from 'react';
7
7
  import { IBillingInfoData } from '../../types';
8
8
  export interface IBillingInfoPage {
9
9
  data?: IBillingInfoData[];
@@ -50,6 +50,9 @@ export interface IBillingInfoPage {
50
50
  brandOptIn?: boolean;
51
51
  showPoweredByImage?: boolean;
52
52
  isCountryCodeEditable?: boolean;
53
+ customFieldsOrderKeys?: string[];
54
+ customFieldsTicketHolderKeys?: string[];
53
55
  onPendingVerification?: () => void;
54
56
  }
55
- export declare const BillingInfoContainer: React.MemoExoticComponent<({ data, ticketHoldersFields, initialValues, buttonName, handleSubmit, theme, onRegisterSuccess, onRegisterError, onSubmitError, onGetCartSuccess, onGetCartError, onGetCountriesSuccess, onGetCountriesError, onGetStatesSuccess, onGetStatesError, onGetProfileDataSuccess, onGetProfileDataError, onLogin, onLoginSuccess, isLoggedIn: pIsLoggedIn, accountInfoTitle, hideLogo, themeOptions, onErrorClose, hideErrorsAlertSection, onSkipBillingPage, skipPage, canSkipHolderNames, onForgotPasswordSuccess, onForgotPasswordError, shouldFetchCountries, onCountdownFinish, enableTimer, logo, showForgotPasswordButton, showSignUpButton, brandOptIn, showPoweredByImage, isCountryCodeEditable, onPendingVerification, onGetCheckoutConfigsSuccess, onGetCheckoutConfigsError, }: IBillingInfoPage) => JSX.Element>;
57
+ declare const WithCustomFieldsBillingInfoContainer: (props: any) => JSX.Element;
58
+ export { WithCustomFieldsBillingInfoContainer as BillingInfoContainer };
@@ -10,23 +10,25 @@ export interface ILoggedInValues {
10
10
  export interface IValues {
11
11
  [key: string]: any;
12
12
  }
13
- export declare const getInitialValues: (data?: any, propsInitialValues?: IValues, userValues?: any) => IValues;
13
+ export declare const getInitialValues: (data?: any, propsInitialValues?: IValues, userValues?: any, ticketHoldersFields?: any, ticketsQuantity?: any) => IValues;
14
14
  export declare const createRegisterFormData: (values: IValues | undefined, checkoutBody: {
15
15
  attributes: {
16
16
  [key: string]: any;
17
17
  };
18
18
  }, flagFreeTicket?: boolean) => FormData;
19
- interface ICheckoutBody {
19
+ export interface ICheckoutBody {
20
20
  attributes: {
21
21
  [key: string]: any;
22
22
  };
23
+ data_capture?: {
24
+ [key: string]: any;
25
+ };
23
26
  }
24
27
  export declare const createCheckoutDataBody: (ticketsQuantity: number, values?: IValues, logedInValues?: ILoggedInValues, includeDob?: boolean) => ICheckoutBody;
25
28
  export declare const getValidateFunctions: (element: IGroupItem, states: {
26
29
  [key: string]: any;
27
30
  }[], values: FormikValues, errors: FormikErrors<any>) => (...value: any) => any;
28
31
  export declare const assingUniqueIds: (data: any) => any;
29
- export declare const isRequiredField: (element: IGroupItem, configs: null | AttributesConfig) => boolean;
30
- export declare const getFieldLabel: (element: IGroupItem, configs: null | AttributesConfig) => string | JSX.Element;
32
+ export declare const isRequiredField: (element: IGroupItem, configs?: AttributesConfig | null | undefined) => boolean;
33
+ export declare const getFieldLabel: (element: IGroupItem, configs?: AttributesConfig | null | undefined) => string | JSX.Element;
31
34
  export declare const getFieldComponent: (element: IGroupItem) => any;
32
- export {};
@@ -0,0 +1,11 @@
1
+ /// <reference types="react" />
2
+ import { FieldInputProps } from 'formik';
3
+ export interface ICheckboxField {
4
+ label: string | number | JSX.Element;
5
+ field?: FieldInputProps<any>;
6
+ }
7
+ interface IOtherProps {
8
+ [key: string]: any;
9
+ }
10
+ export declare const Checkbox: ({ label, field, selectOptions, theme, setFieldValue, disableDropdown, setPhoneValidationIsLoading, defaultCountry, required, uniqueId, dateFormat, datePlaceholder, isCountryCodeEditable, ...rest }: ICheckboxField & IOtherProps) => JSX.Element;
11
+ export {};
@@ -0,0 +1,9 @@
1
+ /// <reference types="react" />
2
+ import { FieldInputProps, FormikProps } from 'formik';
3
+ interface ICheckboxField {
4
+ label: string | number | JSX.Element;
5
+ field: FieldInputProps<any>;
6
+ form: FormikProps<any>;
7
+ }
8
+ export declare const CheckboxField: ({ label, field, form: { touched, errors }, }: ICheckboxField) => JSX.Element;
9
+ export {};
@@ -1,4 +1,5 @@
1
1
  export { CheckboxField } from './CheckboxField';
2
+ export { Checkbox } from './Checkbox';
2
3
  export { CustomField } from './CustomField';
3
4
  export { FormikPhoneNumberField } from './FormikPhoneNumberField';
4
5
  export { PhoneNumberField } from './PhoneNumberField';
@@ -0,0 +1,12 @@
1
+ /// <reference types="react" />
2
+ import { CustomFieldTypes } from './index';
3
+ interface HolderCustomFieldsProps {
4
+ initialValues: {
5
+ [key: string]: any;
6
+ };
7
+ fields: Array<CustomFieldTypes>;
8
+ handleFormSubmit?: (values: Record<string, any>) => void;
9
+ handleFormClose?: () => void;
10
+ }
11
+ declare const CustomFieldsForm: ({ initialValues, fields, handleFormSubmit, handleFormClose, }: HolderCustomFieldsProps) => JSX.Element;
12
+ export { CustomFieldsForm };
@@ -0,0 +1,10 @@
1
+ /// <reference types="react" />
2
+ import { CustomFieldTypes } from './index';
3
+ import { ITicketTypes } from './ticketsTable';
4
+ interface HolderCustomFieldsProps {
5
+ ticket: ITicketTypes;
6
+ holderCustomFields: CustomFieldTypes[];
7
+ handleTicketHoldersUpdate: (values: Record<string, any>, ticketHash: string) => void;
8
+ }
9
+ declare const TicketHolderCustomFields: ({ ticket, holderCustomFields, handleTicketHoldersUpdate, }: HolderCustomFieldsProps) => JSX.Element;
10
+ export { TicketHolderCustomFields };
@@ -12,6 +12,10 @@ interface OrderDetailsTypes {
12
12
  onRemoveFromResaleError: (err: any) => void;
13
13
  onResaleTicketSuccess: () => void;
14
14
  onResaleTicketError: (err: any) => void;
15
+ onUpdateOrderCustomFieldsSuccess: (val: any) => void;
16
+ onUpdateOrderCustomFieldsError: (err: any) => void;
17
+ onUpdateTicketHolderCustomFieldsSuccess: (val: any) => void;
18
+ onUpdateTicketHolderCustomFieldsError: (err: any) => void;
15
19
  personalLinkIcon?: string;
16
20
  displayColumnNameInRow?: boolean;
17
21
  canSellTicket?: boolean;
@@ -26,5 +30,29 @@ interface OrderDetailsTypes {
26
30
  itemsTitle?: string;
27
31
  ticketsTitle?: string;
28
32
  }
29
- export declare const OrderDetailsContainer: ({ columns, onGetOrdersSuccess, onGetOrdersError, onRemoveFromResaleSuccess, onRemoveFromResaleError, onResaleTicketSuccess, onResaleTicketError, onReturnButtonClick, personalLinkIcon, displayColumnNameInRow, canSellTicket, ticketsTableColumns, ordersPath, orderId: pOrderId, referralTitle, itemsTitle, ticketsTitle, }: OrderDetailsTypes) => JSX.Element;
33
+ export interface CustomFieldOption {
34
+ id: string;
35
+ name: string;
36
+ value: string;
37
+ order: string;
38
+ }
39
+ export interface CustomFieldTypes {
40
+ description: string;
41
+ enabled: string;
42
+ id: string;
43
+ label: string;
44
+ name: string;
45
+ orderId: string;
46
+ required: boolean;
47
+ settings: {
48
+ showOnMyTickets: boolean;
49
+ allowUpdate: boolean;
50
+ className: string;
51
+ };
52
+ type: string;
53
+ value: string | Array<string>;
54
+ ticketHash?: string;
55
+ options?: CustomFieldOption[];
56
+ }
57
+ export declare const OrderDetailsContainer: ({ columns, onGetOrdersSuccess, onGetOrdersError, onRemoveFromResaleSuccess, onRemoveFromResaleError, onResaleTicketSuccess, onResaleTicketError, onUpdateOrderCustomFieldsSuccess, onUpdateOrderCustomFieldsError, onUpdateTicketHolderCustomFieldsSuccess, onUpdateTicketHolderCustomFieldsError, onReturnButtonClick, personalLinkIcon, displayColumnNameInRow, canSellTicket, ticketsTableColumns, ordersPath, orderId: pOrderId, referralTitle, itemsTitle, ticketsTitle, }: OrderDetailsTypes) => JSX.Element;
30
58
  export {};
@@ -1,4 +1,5 @@
1
1
  /// <reference types="react" />
2
+ import { CustomFieldTypes } from './index';
2
3
  interface IAddOnTypes {
3
4
  name: string;
4
5
  groupName: string;
@@ -35,9 +36,11 @@ interface TicketsTableTypes {
35
36
  }>;
36
37
  handleSellTicket: (ticket: ITicketTypes) => void;
37
38
  handleRemoveFromResale: (ticket: ITicketTypes) => void;
39
+ handleTicketHoldersUpdate: (values: Record<string, any>, ticketHash: string) => void;
38
40
  icon?: string;
39
41
  displayColumnNameInRow?: boolean;
40
42
  ticketsTitle?: string;
43
+ ticketHoldersCustomFields?: Array<CustomFieldTypes>;
41
44
  }
42
- declare const TicketsTable: ({ tickets, columns, handleSellTicket, handleRemoveFromResale, icon, displayColumnNameInRow, canSellTicket, ticketsTitle, }: TicketsTableTypes) => JSX.Element;
45
+ declare const TicketsTable: ({ tickets, columns, icon, displayColumnNameInRow, canSellTicket, ticketsTitle, ticketHoldersCustomFields, handleSellTicket, handleRemoveFromResale, handleTicketHoldersUpdate, }: TicketsTableTypes) => JSX.Element;
43
46
  export default TicketsTable;
@@ -0,0 +1,6 @@
1
+ import { CustomFieldTypes } from '../index';
2
+ export declare const renderCustomFieldValue: (customField: CustomFieldTypes) => string | string[];
3
+ export declare const isFieldUpdatable: (field: CustomFieldTypes) => boolean;
4
+ export declare const createCustomFieldsUpdateBody: (updatedValues: Record<string, any>, notUpdatableCustomFieldsValues?: Array<CustomFieldTypes>) => {
5
+ [x: string]: any;
6
+ };
@@ -0,0 +1,3 @@
1
+ /// <reference types="react" />
2
+ declare const withCustomFields: (Children: any) => (props: any) => JSX.Element;
3
+ export { withCustomFields };
@@ -0,0 +1 @@
1
+ export { withCustomFields } from './CustomFields';
@@ -0,0 +1,10 @@
1
+ <svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
2
+ <g clip-path="url(#clip0_996_11495)">
3
+ <path d="M6.162 12.6667L5 13.6667L2 14.0001V11.1714L8.6 4.57139L11.428 7.40072L6.16133 12.6667H6.162ZM9.542 3.62939L10.9567 2.21472C11.0817 2.08974 11.2512 2.01953 11.428 2.01953C11.6048 2.01953 11.7743 2.08974 11.8993 2.21472L13.7853 4.10072C13.9103 4.22574 13.9805 4.39528 13.9805 4.57206C13.9805 4.74883 13.9103 4.91837 13.7853 5.04339L12.3707 6.45739L9.54267 3.62939H9.542Z" fill="#03053D"/>
4
+ </g>
5
+ <defs>
6
+ <clipPath id="clip0_996_11495">
7
+ <rect width="16" height="16" fill="white"/>
8
+ </clipPath>
9
+ </defs>
10
+ </svg>