Tax Documents Drop-In

The Tax Documents Drop-In is a helpful and quick way to satisfy your electronic delivery responsibilities.

Rendering and Styling the Tax Documents Drop-In

Using an authenticated Client SDK, you can pass in your custom theme into the render command of the Tax Documents Drop-In.

1<html>
2    <head>
3        <title>My App</title>
4    </head>
5    <body>
6        <!-- target parent node to render UI -->
7        <h2>2022</h2>
8        <div id="abound-ui-wrapper-2022"></div>
9        <h2>2021</h2>
10        <div id="abound-ui-wrapper-2021"></div>
11
12        <script type="module">
13            import { renderTaxDocuments } from "https://js.withabound.com/latest-major/abound-client-sdk.js";
14
15            // define your custom theme object
16            const customTheme = {
17                color: {
18                    text: "#000000",
19                    weight: "bold",
20                },
21            };
22
23            // render drop-in component
24            renderTaxDocuments({
25               accessToken: "accessToken_sampleeyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpYXQiOjE2OTY5ODczNTcsImV4cCI6MTY5Njk4NzY1NywiYXVkIjoiYXBwSWRfc2FtcGxlcU5oVmNkWVFZVSIsImlzcyI6Imh0dHBzOi8vc2FuZGJveC1hcGkud2l0aGFib3VuZC5jb20vdjQiLCJzdWIiOiJ1c2VySWRfc2FtcGxlWEdNRm5oT3BlUiJ9.-NrPVQvsnM8vJouyuP5yeFGlYb1xGgR-gS3v87p5BQk",
26               targetId: "abound-ui-wrapper-2022",
27               theme: customTheme,
28               year: "2022",
29            });
30
31            // render drop-in component
32            renderTaxDocuments({
33               accessToken: "accessToken_testeyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJhcHBfaWQiOiJhcHBJZF90ZXN0NDhlN2VhYTMxNzVhNjYzNTRlMDA2MjY1NDJkMiIsImNyZWF0ZWRfdGltZXN0YW1wIjoxNjU1MDk2NDAwMDAwLCJlbnZpcm9ubWVudCI6Imh0dHBzOi8vc2FuZGJveC1hcGkud2l0aGFib3VuZC5jb20vdjMiLCJleHBpcmF0aW9uX3RpbWVzdGFtcCI6MzI1MDM3MDE2MDAwMDAsInN0YXR1cyI6IkFjdGl2ZSIsInVzZXJfaWQiOiJ1c2VySWRfdGVzdDI0YjA1ZDc2MWZmNThiNTkzMWJkMDc3NzhjNjdiNGU4MThlNCIsImlhdCI6MTY1NTEzMDMxM30.BRfaQwmvAJv1K3802FxlWzkNt13yAEPQ75OlrT85rlE",
34               targetId: "abound-ui-wrapper-2021",
35               theme: customTheme,
36               year: "2021",
37            });
38        </script>
39    </body>
40
41</html>

You should now see the stylized UI rendered in your app:


Properties

Rendering the Tax Documents Drop-In comes with the following properties:

PropertyDescription
accessToken (string, required)The user-specific accessToken.
targetId (string, required for js)The value of a node’s id attribute where the UI will be rendered.
theme (object, optional)Override default styling definitions with your own brand’s styling.
year (string, required)A parameter to filter Tax Documents for a specific tax year.