Skip to content
UI Kit
Accent color

Tax advisor

For tax advisors and accounting firms. Deadlines by client group, a client portal with document upload, a refund estimate, a document checklist and monthly retainers.

5 variants
Switch category

Tax advisor

Deadlines

Pick your client group, the next deadline counts down in days. Twelve months as a strip, every deadline a dot that pops in while scrolling, the next six as a list.

Open in Studio

Client portal

A live portal window with open document requests. Upload one, a bar runs, the file ticks off and the progress grows until everything is in.

Open in Studio

Refund estimate

Commute, office days, home office and equipment on sliders. A bar sets the work costs against the allowance line, what lies above it turns green and the refund glides.

Open in Studio

Document checklist

Tick what applies to you. The list of documents builds itself with every choice, the count pops, and the whole list copies as a checklist.

Open in Studio

Monthly retainers

Slide the yearly revenue, every package moves to its fee band and the prices glide. The fitting package takes the border and a badge.

Open in Studio

Details

What Tax advisor brings along, read from the registry and the source.

Area
Industries
Variants
5
Version
1.0.0 · since 1.1.0
File
components/ui/tax-advisor.tsx
Brings along
utilskitbuttonframeiconsectionmotionslider
npm packages
None
Languages
English and German, 36 texts of its own
Studio
All 5 variants editable
Build with AI
Over MCP in Claude, Cursor, Copilot and Codex

Props

The TaxAdvisorProps interface from components/ui/tax-advisor.tsx, with the comments from the code.

  • variantoptional
    TaxAdvisorVariant

    deadlinesclient-portalrefund-estimatedocumentsretainer

  • eyebrowoptional
    React.ReactNode
  • titleoptional
    React.ReactNode
  • descriptionoptional
    React.ReactNode
  • groupsoptional
    { id: string; label: string; icon?: IconName }[]

    deadlines: client groups and the deadlines

  • deadlinesoptional
    TaxDeadline[]
  • todayoptional
    string

    deadlines: the day to count from, YYYY-MM-DD. Defaults to the browser date.

  • portalUrloptional
    string

    client-portal: the address shown in the window, the client and the requests

  • clientoptional
    string
  • requestsoptional
    TaxRequest[]
  • featuresoptional
    { title: string; text?: string; icon?: IconName }[]

    client-portal: what the portal does

  • allowanceoptional
    number

    refund-estimate: allowance for work costs and rates per km

  • kmRateoptional
    number
  • kmRateFaroptional
    number
  • homeRateoptional
    number
  • homeMaxoptional
    number
  • ratesoptional
    number[]
  • situationsoptional
    TaxSituation[]

    documents

  • bandsoptional
    number[]

    retainer: revenue bands (upper limits) and packages with a fee per band

  • packagesoptional
    TaxPackage[]
  • currencyoptional
    string

Built-in texts

Tax advisor writes these texts itself. The language follows the KitProvider, the labels prop replaces single ones.

Show all 36 texts
groupEnglish You areGerman Du bist
nextEnglish Next deadlineGerman Nächste Frist
inDaysEnglish in {n} daysGerman in {n} Tagen
todayEnglish todayGerman heute
tomorrowEnglish tomorrowGerman morgen
yearEnglish The next twelve monthsGerman Die nächsten zwölf Monate
remindEnglish Remind me of my deadlinesGerman An meine Fristen erinnern
openEnglish Open requestsGerman Offene Anforderungen
uploadEnglish UploadGerman Hochladen
uploadingEnglish UploadingGerman Wird hochgeladen
uploadedEnglish ReceivedGerman Eingegangen
progressEnglish {n} of {total} documents inGerman {n} von {total} Unterlagen da
allInEnglish Everything is in. We start on your return.German Alles da. Wir beginnen mit deiner Erklärung.
loginEnglish Log in to the portalGerman Zum Portal anmelden
commuteEnglish Way to workGerman Arbeitsweg
kmEnglish {n} kmGerman {n} km
daysEnglish Days in the officeGerman Tage im Büro
daysNEnglish {n} daysGerman {n} Tage
homeEnglish Days at homeGerman Tage im Homeoffice
equipmentEnglish Work equipmentGerman Arbeitsmittel
rateEnglish Your tax rateGerman Dein Steuersatz
refundEnglish Possible refundGerman Mögliche Erstattung
costsEnglish Your work costsGerman Deine Werbungskosten
allowanceEnglish Covered by the allowanceGerman Durch die Pauschale abgedeckt
aboveEnglish Above the allowanceGerman Über der Pauschale
noteEnglish An estimate for employees, church tax and solidarity surcharge not included.German Schätzung für Angestellte, ohne Kirchensteuer und Solidaritätszuschlag.
startEnglish Have it calculated exactlyGerman Genau berechnen lassen
situationEnglish What applies to you?German Was trifft auf dich zu?
documentsEnglish Bring these documentsGerman Diese Unterlagen brauchen wir
docsNEnglish {n} documentsGerman {n} Unterlagen
copyEnglish Copy the listGerman Liste kopieren
copiedEnglish List copiedGerman Liste kopiert
revenueEnglish Yearly revenueGerman Jahresumsatz
perMonthEnglish / monthGerman / Monat
recommendedEnglish Fits your revenueGerman Passt zu deinem Umsatz
chooseEnglish Choose this packageGerman {name} wählen

Accessibility

Read from the source of the component.

  • Tax advisor handles the keys Arrow up, Arrow down, Arrow left and Arrow right itself.
  • Sets aria-checked, aria-label and aria-live, so screen readers announce purpose and state.
  • Uses the roles checkbox, radio, radiogroup and status.
  • Announces changes through a live region without moving focus.
  • Shows a visible focus ring when used with the keyboard.
  • The server renders the starting state in full, JavaScript only adds the interaction.

Motion

  • Brings animations of its own, calmly timed and without wobble.
  • With reduced motion (prefers-reduced-motion) it stays still. 4 places in the code switch motion off then.

Frequent questions

How do I install Tax advisor?

With aiw add @ai-website/tax-advisor. The command puts components/ui/tax-advisor.tsx into your project, the code is yours from then on. It brings along button, frame, icon, section, motion and slider. It needs no further npm packages.

Which variants does Tax advisor have?

5 variants, Deadlines, Client portal, Refund estimate, Document checklist and Monthly retainers. You pick one with the variant prop, for example variant="client-portal".

Can I translate the texts of Tax advisor?

Yes. Tax advisor carries 36 texts of its own in English and German, such as “You are”, “Next deadline” and “today”. The language follows the KitProvider, single texts change through the labels prop.

Can an AI assistant build with Tax advisor?

Yes. Through the MCP server of the aiw CLI, Claude, Cursor, GitHub Copilot, Windsurf, Codex and Gemini find Tax advisor with aiw_components and install it with aiw_add @ai-website/tax-advisor. Name the variant in your prompt, for example variant="deadlines", and the assistant writes your content straight into the props.

Can I adjust Tax advisor without code?

Yes, in the Studio. All 5 variants are editable there, texts, lists and switches. The Studio writes the matching TaxAdvisor code to copy.

Similar components

More from Industries, the same area of the kit.

Often combined with

Sections that usually sit next to Tax advisor on a page.

Often searched

Jump to

Copied to the clipboard