@taxbit/react-sdk 1.0.0-beta.1 → 1.0.0-beta.3
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.
- package/README.md +69 -15
- package/dist/src/contexts/TaxDocumentation/useTaxDocumentation.d.ts +1 -1
- package/dist/src/entry/TaxbitQuestionnaire/TaxbitQuestionnaire.d.ts +5 -2
- package/dist/src/entry/index.d.ts +2 -0
- package/dist/src/hooks/useTaxbit/types/comprehensive.d.ts +6 -0
- package/dist/src/hooks/useTaxbit/types/w8.d.ts +29 -0
- package/dist/src/hooks/useTaxbit/types/w9.d.ts +22 -0
- package/dist/src/lookups/foreignAccountHolderAccountTypeOptions.d.ts +1 -1
- package/dist/src/lookups/foreignRegardedOwnerAccountTypeOptions.d.ts +1 -1
- package/dist/src/lookups/usAccountHolderAccountTypeOptions.d.ts +1 -1
- package/dist/src/lookups/usLlcAccountTypeOptions.d.ts +1 -1
- package/dist/src/lookups/usRegardedOwnerAccountTypeOptions.d.ts +1 -1
- package/dist/src/types/client/ClientTaxDocumentationStatus.d.ts +2 -4
- package/dist/src/types/server/TaxDocumentationStatus.d.ts +2 -4
- package/dist/taxbit-react-sdk.js +1708 -1640
- package/dist/taxbit-react-sdk.umd.cjs +9 -9
- package/package.json +1 -1
- package/style/basic.css +1 -1
- package/style/inline.css +1 -1
package/README.md
CHANGED
|
@@ -1,6 +1,12 @@
|
|
|
1
1
|
# Taxbit React SDK
|
|
2
2
|
|
|
3
|
-
A React
|
|
3
|
+
A React component and hook for gathering Tax Documentation data for US and EU Tax forms.
|
|
4
|
+
|
|
5
|
+
## Usage
|
|
6
|
+
|
|
7
|
+
The Taxbit React SDK provides a React component and hook for gathering tax documentation data from users. The component can be used to collect data for the Taxbit DPS (Digital Platform Sales) or W-Form (W-9, W-8BEN, W-8BEN-E) tax documentation forms. A hook provides more tools to understand the user's tax documentation status and download any pdf versions of the files that are created if eligible.
|
|
8
|
+
|
|
9
|
+
DPS (Digital Platform Sales) is a data standard and UI flow used by Taxbit to gather the information needed to report income as directed by the DAC7 for the European Union, and equivalent reporting requirements in Canada, New Zealand, and the United Kingdom.
|
|
4
10
|
|
|
5
11
|
## Installation
|
|
6
12
|
|
|
@@ -60,6 +66,8 @@ exampleData: ClientTaxDocumentation = {
|
|
|
60
66
|
};
|
|
61
67
|
```
|
|
62
68
|
|
|
69
|
+
The `questionnaire` prop determines the UI of the component. The `questionnaire` prop can be set to 'DPS' or 'W-FORM'.
|
|
70
|
+
|
|
63
71
|
```jsx
|
|
64
72
|
<TaxbitQuestionnaire
|
|
65
73
|
data={exampleData} // `data` is an optional prop
|
|
@@ -69,7 +77,7 @@ exampleData: ClientTaxDocumentation = {
|
|
|
69
77
|
/>
|
|
70
78
|
```
|
|
71
79
|
|
|
72
|
-
For W-9 W-8BEN and W-8BEN-E forms,
|
|
80
|
+
For W-9 W-8BEN and W-8BEN-E forms, the `questionnaire` prop is set like this...
|
|
73
81
|
|
|
74
82
|
```jsx
|
|
75
83
|
<TaxbitQuestionnaire
|
|
@@ -87,6 +95,7 @@ import { TaxbitQuestionnaire, ClientTaxDocumentation } from '@taxbit/react-sdk';
|
|
|
87
95
|
|
|
88
96
|
<TaxbitQuestionnaire
|
|
89
97
|
data={exampleData}
|
|
98
|
+
questionnaire="DPS"
|
|
90
99
|
onSubmit={(data: ClientTaxDocumentation) => alert(JSON.stringify(data))}
|
|
91
100
|
demoMode={true}
|
|
92
101
|
/>;
|
|
@@ -109,24 +118,43 @@ See the `Locale` type below.
|
|
|
109
118
|
The `useTaxbit` hook will return a `status` object that can be used to determine the status of the user's tax documentation. The `status` object will have the following shape:
|
|
110
119
|
|
|
111
120
|
```typescript
|
|
112
|
-
{
|
|
113
|
-
|
|
114
|
-
dpsQuestionnaire: {
|
|
121
|
+
type ClientTaxDocumentationStatus = {
|
|
122
|
+
dpsQuestionnaire?: {
|
|
115
123
|
dataCollectionStatus: 'COMPLETE' | 'INCOMPLETE';
|
|
116
|
-
|
|
117
|
-
'
|
|
118
|
-
'
|
|
119
|
-
'
|
|
120
|
-
'
|
|
121
|
-
|
|
122
|
-
|
|
124
|
+
vatStatus?:
|
|
125
|
+
| 'PENDING'
|
|
126
|
+
| 'VALID'
|
|
127
|
+
| 'INVALID'
|
|
128
|
+
| 'INSUFFICIENT_DATA'
|
|
129
|
+
| 'NOT_REQUIRED'
|
|
130
|
+
| 'NON_EU';
|
|
131
|
+
vatValidationDate?: string;
|
|
132
|
+
expirationDate?: string;
|
|
133
|
+
};
|
|
134
|
+
wFormQuestionnaire?: {
|
|
135
|
+
dataCollectionStatus: 'COMPLETE' | 'INCOMPLETE';
|
|
136
|
+
type: 'W-9' | 'W-8BEN' | 'W-8BEN-E';
|
|
137
|
+
expirationDate?: string;
|
|
138
|
+
tinStatus?:
|
|
139
|
+
| 'PENDING'
|
|
140
|
+
| 'FOREIGN'
|
|
141
|
+
| 'INVALID_DATA'
|
|
142
|
+
| 'VALID_SSN_MATCH'
|
|
143
|
+
| 'VALID_EIN_MATCH'
|
|
144
|
+
| 'VALID_SSN_EIN_MATCH'
|
|
145
|
+
| 'MISMATCH'
|
|
146
|
+
| 'TIN_NOT_ISSUED'
|
|
147
|
+
| 'ERROR';
|
|
148
|
+
tinValidationDate?: string;
|
|
149
|
+
needsResubmission: boolean;
|
|
150
|
+
};
|
|
151
|
+
};
|
|
123
152
|
```
|
|
124
153
|
|
|
125
154
|
an example is below.
|
|
126
155
|
|
|
127
156
|
```json
|
|
128
157
|
{
|
|
129
|
-
"submissionStatus": "SUBMITTED",
|
|
130
158
|
"dpsQuestionnaire": {
|
|
131
159
|
"dataCollectionStatus": "COMPLETE",
|
|
132
160
|
"expirationDate": "2026-11-20T00:00:00.000Z"
|
|
@@ -134,6 +162,19 @@ an example is below.
|
|
|
134
162
|
}
|
|
135
163
|
```
|
|
136
164
|
|
|
165
|
+
or for W-Form status
|
|
166
|
+
|
|
167
|
+
```json
|
|
168
|
+
{
|
|
169
|
+
"wFormQuestionnaire": {
|
|
170
|
+
"dataCollectionStatus": "COMPLETE",
|
|
171
|
+
"type": "W-9",
|
|
172
|
+
"tinValidationDate": "2027-11-01T17:09:05.962Z",
|
|
173
|
+
"needsResubmission": false
|
|
174
|
+
}
|
|
175
|
+
}
|
|
176
|
+
```
|
|
177
|
+
|
|
137
178
|
### CSS and Style Customization
|
|
138
179
|
|
|
139
180
|
The Taxbit React SDK renders a form for collecting user data. The form is structured with fairly semantic HTML and CSS classes and can be easily customized to closely match your client's style.
|
|
@@ -218,8 +259,21 @@ type Progress = {
|
|
|
218
259
|
};
|
|
219
260
|
```
|
|
220
261
|
|
|
262
|
+
```typescript
|
|
263
|
+
type QuestionnaireType = 'DPS' | 'W-FORM';
|
|
264
|
+
```
|
|
265
|
+
|
|
221
266
|
## Changelog
|
|
222
267
|
|
|
268
|
+
### Version 1.0.0-beta.3
|
|
269
|
+
|
|
270
|
+
1. Transforming deprecated tax documentation data types for import to SDK
|
|
271
|
+
2. More Readme documentation around Status and Questionnaire types
|
|
272
|
+
|
|
273
|
+
### Version 1.0.0-beta.2
|
|
274
|
+
|
|
275
|
+
1. The ClientTaxDocumentation type is exposed in the `useTaxbit` hook.
|
|
276
|
+
|
|
223
277
|
### Version 1.0.0-beta.1
|
|
224
278
|
|
|
225
279
|
1. Showing "\*" when required for Addresses on Summary
|
|
@@ -268,7 +322,7 @@ type Progress = {
|
|
|
268
322
|
|
|
269
323
|
### Version 0.4.1
|
|
270
324
|
|
|
271
|
-
1. Bug fix for onProgress callback not being triggered from the
|
|
325
|
+
1. Bug fix for onProgress callback not being triggered from the TaxBitDAC7Form component.
|
|
272
326
|
|
|
273
327
|
### Version 0.4.0
|
|
274
328
|
|
|
@@ -301,5 +355,5 @@ type Progress = {
|
|
|
301
355
|
1. Fix in package.json to expose UMD module as main.
|
|
302
356
|
2. Added specific CSS class names for each question and each screen of the form.
|
|
303
357
|
3. Added the new status structure into the useTaxbit hook.
|
|
304
|
-
4.
|
|
358
|
+
4. TaxBitDAC7Form component will now preload the form with previously submitted data.
|
|
305
359
|
5. Validation update to enforce that primary address country and tax residence country are the same.
|
|
@@ -13,7 +13,7 @@ export type UseTaxDocumentationProps = {
|
|
|
13
13
|
onSubmit: (data: ClientTaxDocumentation) => void | Promise<void>;
|
|
14
14
|
onProgress?: (progress: Progress) => void | Promise<void>;
|
|
15
15
|
step?: InputStep;
|
|
16
|
-
questionnaire
|
|
16
|
+
questionnaire: Questionnaire;
|
|
17
17
|
config?: InterviewConfig;
|
|
18
18
|
};
|
|
19
19
|
export declare const useTaxDocumentation: ({ data: startingData, language: initialLanguage, externalValidations, onSubmit, onProgress, step: initialStep, questionnaire, config, }: UseTaxDocumentationProps) => {
|
|
@@ -1,9 +1,12 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { TaxbitQuestionnairePersistProps } from 'widgets';
|
|
3
3
|
import { TaxbitQuestionnaireUIProps } from 'wizard';
|
|
4
|
-
|
|
4
|
+
import { Questionnaire } from '../../types';
|
|
5
|
+
export type TaxbitQuestionnaireProps = {
|
|
6
|
+
questionnaire: Questionnaire;
|
|
7
|
+
} & ((TaxbitQuestionnaireUIProps & {
|
|
5
8
|
demoMode: true;
|
|
6
9
|
}) | (TaxbitQuestionnairePersistProps & {
|
|
7
10
|
demoMode?: false | undefined;
|
|
8
|
-
});
|
|
11
|
+
}));
|
|
9
12
|
export declare const TaxbitQuestionnaire: ({ ...props }: TaxbitQuestionnaireProps) => React.JSX.Element;
|
|
@@ -1,6 +1,8 @@
|
|
|
1
|
+
import { ClientTaxDocumentation } from '@taxbit/utilities';
|
|
1
2
|
export * from '../hooks/useTaxbit';
|
|
2
3
|
export * from '../types/Locale';
|
|
3
4
|
export * from '../types/Progress';
|
|
4
5
|
export * from '../types/Questionnaire';
|
|
5
6
|
export * from '../types/client/ClientTaxDocumentationStatus';
|
|
6
7
|
export * from './TaxbitQuestionnaire';
|
|
8
|
+
export type { ClientTaxDocumentation };
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
import { SignedDatedComprehensiveTaxDocumentation } from '@taxbit/utilities';
|
|
2
|
+
export type Comprehensive = {
|
|
3
|
+
account_holder: SignedDatedComprehensiveTaxDocumentation['account_holder'];
|
|
4
|
+
regarded_owner?: SignedDatedComprehensiveTaxDocumentation['regarded_owner'];
|
|
5
|
+
document_type: 'COMPREHENSIVE';
|
|
6
|
+
};
|
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
import { Comprehensive } from './comprehensive';
|
|
2
|
+
import { W9 } from './w9';
|
|
3
|
+
export type W8 = {
|
|
4
|
+
name?: string;
|
|
5
|
+
country?: string;
|
|
6
|
+
tax_classification?: 'INDIVIDUAL' | 'CORPORATION' | 'PARTNERSHIP' | 'SIMPLE_TRUST' | 'COMPLEX_TRUST' | 'GRANTOR_TRUST' | 'ESTATE' | 'CENTRAL_BANK_OF_ISSUE' | 'FOREIGN_GOVERNMENT_CONTROLLED_ENTITY' | 'FOREIGN_GOVERNMENT_INTEGRAL_PART' | 'TAX_EXEMPT_ORGANIZATION' | 'PRIVATE_FOUNDATION' | 'INTERNATIONAL_ORGANIZATION';
|
|
7
|
+
permanent_address: {
|
|
8
|
+
first_line?: string;
|
|
9
|
+
city?: string;
|
|
10
|
+
state_or_province?: string;
|
|
11
|
+
postal_code?: string;
|
|
12
|
+
country?: string;
|
|
13
|
+
};
|
|
14
|
+
mailing_address?: {
|
|
15
|
+
first_line?: string;
|
|
16
|
+
city?: string;
|
|
17
|
+
state_or_province?: string;
|
|
18
|
+
postal_code?: string;
|
|
19
|
+
country?: string;
|
|
20
|
+
};
|
|
21
|
+
reference_numbers?: string;
|
|
22
|
+
tin?: string;
|
|
23
|
+
ftin?: string;
|
|
24
|
+
date_of_birth?: string;
|
|
25
|
+
ftin_not_legally_required?: true;
|
|
26
|
+
document_type: 'W-8BEN' | 'W-8BEN-E';
|
|
27
|
+
};
|
|
28
|
+
export declare const isW8TaxDocument: (taxDocument: Comprehensive | W9 | W8) => taxDocument is W8;
|
|
29
|
+
export declare const transformW8ToComprehensive: (taxDocument: W8) => Comprehensive;
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
import { Comprehensive } from './comprehensive';
|
|
2
|
+
import { W8 } from './w8';
|
|
3
|
+
export type W9 = {
|
|
4
|
+
name?: string;
|
|
5
|
+
tin?: string;
|
|
6
|
+
dba_name?: string;
|
|
7
|
+
tax_classification?: 'INDIVIDUAL' | 'LLC_S' | 'LLC_C' | 'LLC_P' | 'S_CORPORATION' | 'C_CORPORATION' | 'PARTNERSHIP' | 'TRUST_ESTATE' | 'OTHER';
|
|
8
|
+
address: {
|
|
9
|
+
first_line?: string;
|
|
10
|
+
second_line?: string;
|
|
11
|
+
city?: string;
|
|
12
|
+
state_or_province?: string;
|
|
13
|
+
postal_code?: string;
|
|
14
|
+
country?: string;
|
|
15
|
+
};
|
|
16
|
+
document_type: 'W-9';
|
|
17
|
+
other_tax_classification?: string;
|
|
18
|
+
exempt_payee_code?: string;
|
|
19
|
+
exempt_fatca_code?: string;
|
|
20
|
+
};
|
|
21
|
+
export declare const isW9TaxDocument: (taxDocument: Comprehensive | W9 | W8) => taxDocument is W9;
|
|
22
|
+
export declare const transformW9ToComprehensive: (taxDocument: W9) => Comprehensive;
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
export declare const usAccountHolderAccountTypeOptions: {
|
|
2
|
-
value: "INDIVIDUAL" | "
|
|
2
|
+
value: "INDIVIDUAL" | "SOLE_PROPRIETOR" | "LLC" | "SM_LLC" | "C_CORPORATION" | "S_CORPORATION" | "PARTNERSHIP" | "TRUST_ESTATE" | "OTHER" | "DISREGARDED_ENTITY";
|
|
3
3
|
}[];
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
export declare const usRegardedOwnerAccountTypeOptions: {
|
|
2
|
-
value: "INDIVIDUAL" | "
|
|
2
|
+
value: "INDIVIDUAL" | "LLC" | "C_CORPORATION" | "S_CORPORATION" | "PARTNERSHIP" | "TRUST_ESTATE" | "OTHER";
|
|
3
3
|
}[];
|
|
@@ -1,9 +1,7 @@
|
|
|
1
1
|
export type ClientTaxDocumentationStatus = {
|
|
2
|
-
status: 'UNDOCUMENTED' | 'UNDETERMINED';
|
|
3
|
-
submissionStatus: 'SUBMITTED' | 'NOT_SUBMITTED';
|
|
4
2
|
dpsQuestionnaire?: {
|
|
5
3
|
dataCollectionStatus: 'COMPLETE' | 'INCOMPLETE';
|
|
6
|
-
vatStatus?: 'PENDING' | 'VALID' | 'INVALID' | 'INSUFFICIENT_DATA' | 'NOT_REQUIRED';
|
|
4
|
+
vatStatus?: 'PENDING' | 'VALID' | 'INVALID' | 'INSUFFICIENT_DATA' | 'NOT_REQUIRED' | 'NON_EU';
|
|
7
5
|
vatValidationDate?: string;
|
|
8
6
|
expirationDate?: string;
|
|
9
7
|
};
|
|
@@ -11,7 +9,7 @@ export type ClientTaxDocumentationStatus = {
|
|
|
11
9
|
dataCollectionStatus: 'COMPLETE' | 'INCOMPLETE';
|
|
12
10
|
type: 'W-9' | 'W-8BEN' | 'W-8BEN-E';
|
|
13
11
|
expirationDate?: string;
|
|
14
|
-
tinStatus?:
|
|
12
|
+
tinStatus?: 'PENDING' | 'FOREIGN' | 'INVALID_DATA' | 'VALID_SSN_MATCH' | 'VALID_EIN_MATCH' | 'VALID_SSN_EIN_MATCH' | 'MISMATCH' | 'TIN_NOT_ISSUED' | 'ERROR';
|
|
15
13
|
tinValidationDate?: string;
|
|
16
14
|
needsResubmission: boolean;
|
|
17
15
|
};
|
|
@@ -1,9 +1,7 @@
|
|
|
1
1
|
export type TaxDocumentationStatus = {
|
|
2
|
-
status: 'UNDOCUMENTED' | 'UNDETERMINED';
|
|
3
|
-
submission_status: 'SUBMITTED' | 'NOT_SUBMITTED';
|
|
4
2
|
dps_questionnaire?: {
|
|
5
3
|
data_collection_status: 'COMPLETE' | 'INCOMPLETE';
|
|
6
|
-
vat_status?: 'PENDING' | 'VALID' | 'INVALID' | 'INSUFFICIENT_DATA' | 'NOT_REQUIRED';
|
|
4
|
+
vat_status?: 'PENDING' | 'VALID' | 'INVALID' | 'INSUFFICIENT_DATA' | 'NOT_REQUIRED' | 'NON_EU';
|
|
7
5
|
vat_validation_date?: string;
|
|
8
6
|
expiration_date?: string;
|
|
9
7
|
};
|
|
@@ -11,7 +9,7 @@ export type TaxDocumentationStatus = {
|
|
|
11
9
|
data_collection_status: 'COMPLETE' | 'INCOMPLETE';
|
|
12
10
|
type: 'W-9' | 'W-8BEN' | 'W-8BEN-E';
|
|
13
11
|
expiration_date?: string;
|
|
14
|
-
tin_status?:
|
|
12
|
+
tin_status?: 'PENDING' | 'FOREIGN' | 'INVALID_DATA' | 'VALID_SSN_MATCH' | 'VALID_EIN_MATCH' | 'VALID_SSN_EIN_MATCH' | 'MISMATCH' | 'TIN_NOT_ISSUED' | 'ERROR';
|
|
15
13
|
tin_validation_date?: string;
|
|
16
14
|
needs_resubmission: boolean;
|
|
17
15
|
};
|