View Components
Pre-built UI components for financial interfaces.
OpenLedgerView
A comprehensive component that integrates all financial views in a tabbed interface, giving your users access to the complete Open Ledger experience.
DashboardView
A data visualization dashboard displaying key financial metrics including cash balance, profit/loss, revenue, and expenses.
TransactionsView
A component for displaying and managing financial transactions with advanced filtering and AI-powered categorization.
LedgerView
A double-entry accounting ledger view showing journal entries and the chart of accounts with balance calculations.
ReportView
A financial reporting component for generating and displaying standardized reports like Profit & Loss, Balance Sheet, and Cash Flow statements.
ChatView
An AI-powered financial assistant interface for natural language interaction with accounting data, with responsive design for both desktop and mobile.
OnboardingView
A guided onboarding experience to help users set up their financial accounts and preferences.
SettingsView
A component for managing application settings, account preferences, and integration configurations.
Context Hooks
Open Ledger provides several hooks to access financial data and functionality within your custom components.
useOpenLedgerContext
Access the OpenLedgerContext
within your components.
useTransactions
Access transaction-related data and functions.
useAccounts
Access account-related data and functions.
useGeneralLedger
Access general ledger data including journal entries and account balances.
useFinancialReports
Access financial report data and functions for generating reports.
useChatApi
Access the financial assistant chat API for natural language interactions.
useFinancialOverview
Access key financial metrics and trend data for dashboard displays.
Customization
Open Ledger components can be customized using themes to match your application’s design. The theme object can be passed to the OpenLedgerProvider
to modify colors, typography, and spacing throughout the UI.
Next Steps
For detailed information on individual components, please refer to these sections: