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.

<html>
    <head>
        <title>My App</title>
    </head>
    <body>
        <!-- target parent node to render UI -->
        <h2>2022</h2>
        <div id="abound-ui-wrapper-2022"></div>
        <h2>2021</h2>
        <div id="abound-ui-wrapper-2021"></div>
      
        <script type="module">
            import { renderTaxDocuments } from "https://js.withabound.com/latest-major/abound-client-sdk.js";

            // define your custom theme object
            const customTheme = {
                color: {
                    text: "#000000",
                    weight: "bold",
                },
            };

            // render drop-in component
            renderTaxDocuments({
               accessToken: "<<testAccessToken_v4>>",
               targetId: "abound-ui-wrapper-2022",
               theme: customTheme,
               year: "2022",
            });

            // render drop-in component
            renderTaxDocuments({
               accessToken: "<<testAccessToken>>",
               targetId: "abound-ui-wrapper-2021",
               theme: customTheme,
               year: "2021",
            });
        </script>
    </body>
</html>

import SwiftUI
import Abound

@main
struct MyApp: App {
    
    public static func main() {
        Abound.accessToken = "<<testAccessToken_v4>>"
    }

    var body: some Scene {
        WindowGroup {
            ContentView()
        }
    }
}

struct ContentView: View {
    
    private var theme = AboundThemeConfig( color: AboundThemeColor(text:"#000000", borderColor: "#AAAAAA"))
    private func onSuccess() {
        //do on success logic
    }
  
    private func onError(error: TaxDocumentError) {
        //do on error logic
    }
  
    var body: some View {
        Text("Tax Document")
        AboundTaxDocuments(year: '2022', theme: self.theme, onSuccess: self.onSuccess, onError: self.onError)
    }
}

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

Properties

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

Property	Description
`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.