@accelbooks-react/accelbooks-react

AccelBooks React Library

AccelBooks React is a comprehensive library for building financial dashboards and managing accounting data. It provides a set of React components and hooks for easy integration into your application.

Installation

npm install @accelbooks-react/accelbooks-react

Usage

To use the AccelBooks React library, you need to wrap your application with the AccelProvider and then use the exported components and hooks.

Setting up the Provider

import { AccelProvider } from "@accelbooks-react/accelbooks-react";

function App() {
  return (
    <AccelProvider
      companyId="your-company-id"
      enterpriseId="your-enterprise-id"
      enterpriseSecret="your-enterprise-secret"
      environment="development"
      theme={yourThemeObject}
      apiUrl={"your-api-url"}
    >
      {/* Your app components */}
    </AccelProvider>
  );
}

Warning: Without valid keys (companyId, enterpriseId, and enterpriseSecret), the package will throw errors. If you need to obtain these keys or have any issues, please reach out to the AccelBooks team at [e-mail] for assistance.

Main Exports

1. AccelProvider: The main provider component that wraps your application.
2. useAccelContext: A hook to access the Accel context within your components.
3. useTransactionContext: A hook to access transaction-related data and functions.
4. useAccountContext: A hook to access account-related data and functions.
5. TransactionTable: A component to display transaction data in a table format.
6. Dashboard: A pre-built dashboard view component.
7. AccelView: A comprehensive view component that includes various financial views.
8. TransactionsView: A component for displaying and managing transactions.
9. SettingsView: A component for managing application settings.
10. ReportView: A component for generating and displaying financial reports.

Using Components

import {
  AccelView,
  TransactionTable,
  DashboardBox,
} from "@accelbooks-react/accelbooks-react";

function MyComponent() {
  return (
    <div>
      <AccelView />
        {/* Custom widget content */}
      </DashboardBox>
    </div>
  );
}

Using Hooks

import {
  useAccelContext,
  useTransactionContext,
  useAccountContext,
} from "@accelbooks-react/accelbooks-react";

function MyCustomComponent() {
  const { auth, companyId, theme } = useAccelContext();
  const { transactions } = useTransactionContext();
  const { accounts } = useAccountContext();

  // Use the data in your component
}

Features

• Comprehensive financial dashboard
• Transaction management
• Account management
• Profit and Loss reporting
• Balance Sheet reporting
• Cash Flow Statement
• AI-powered financial reports
• Plaid integration for bank account connections
• Customizable theming

Configuration

The AccelProvider accepts the following props:

• companyId: Your company's unique identifier
• enterpriseId: Your enterprise ID for authentication
• enterpriseSecret: Your enterprise secret for authentication
• accessToken: (Optional) An access token if you're not using enterpriseId/secret
• environment: The environment to use ('development' or 'production')
• theme: A theme object to customize the appearance
• apiUrl: The URL of your API (required)

Contributing

Please read our contributing guidelines before submitting pull requests.

License

This project is licensed under the MIT License.