Ths P&L Detail chart allows exploring the drivers of costs and revenue within a specific month.

import { ProfitAndLoss } from "@layerfi/components";

<ProfitAndLoss>
  <ProfitAndLoss.DetailedCharts
    scope='expenses'
    hideClose={true}
    chartColorsList={['#FF0000', '#FFA500', '#FFFF00', '#008000']}
  />
</ProfitAndLoss>

ProfitAndLoss.DetailedCharts Properties

scope
string

Options are revenue or expenses.

showDatePicker
boolean

If true, shows a dedicated date picker for this component. If not, inherits the current P&L context date range.

chartColorsList
string[]

Overrides the colors of the pie chart. Slices will iterate through the specified color options in descending order by total value. If the list of colors is shorter than the number of slices, the colors will repeat with shifted opacity.