@layerfi/components 0.1.18 → 0.1.19

package/dist/index.js

@@ -6925,7 +6925,7 @@ var SkeletonLoader = ({
 var import_react68 = __toESM(require("react"));
 var import_recharts3 = require("recharts");
 var MiniChart = ({ data }) => {
-  return /* @__PURE__ */ import_react68.default.createElement(import_recharts3.PieChart, { width: 48, height: 48, className: "mini-chart" }, /* @__PURE__ */ import_react68.default.createElement(
+  return /* @__PURE__ */ import_react68.default.createElement(import_recharts3.PieChart, { width: 52, height: 52, className: "mini-chart" }, /* @__PURE__ */ import_react68.default.createElement(
     import_recharts3.Pie,
     {
       data,
@@ -6935,7 +6935,7 @@ var MiniChart = ({ data }) => {
       cy: "50%",
       innerRadius: 10,
       outerRadius: 16,
-      paddingAngle: 0.2,
+      paddingAngle: 0.4,
       fill: "#8884d8",
       width: 24,
       height: 24,
@@ -8581,7 +8581,7 @@ var ChartOfAccountsTable = ({
               !expandAll || expandAll === "collapsed" ? "expanded" : "collapsed"
             )
           },
-          !expandAll || expandAll === "collapsed" ? "Expand all rows" : "Collpase all rows"
+          !expandAll || expandAll === "collapsed" ? "Expand all rows" : "Collapse all rows"
         )) : null,
         /* @__PURE__ */ import_react84.default.createElement("div", { className: "Layer__header__actions-col" }, /* @__PURE__ */ import_react84.default.createElement(
           Button,
@@ -10565,11 +10565,13 @@ var View3 = ({ title, children, headerControls }) => {
 };
 
 // src/views/AccountingOverview/AccountingOverview.tsx
+var import_classnames44 = __toESM(require("classnames"));
 var AccountingOverview = ({
   title = "Accounting overview",
   enableOnboarding = false,
   onTransactionsToReviewClick
 }) => {
+  const [pnlToggle, setPnlToggle] = (0, import_react112.useState)("revenue");
   return /* @__PURE__ */ import_react112.default.createElement(ProfitAndLoss, { asContainer: false }, /* @__PURE__ */ import_react112.default.createElement(View3, { title, headerControls: /* @__PURE__ */ import_react112.default.createElement(ProfitAndLoss.DatePicker, null) }, enableOnboarding && /* @__PURE__ */ import_react112.default.createElement(Onboarding, null), /* @__PURE__ */ import_react112.default.createElement("div", { className: "Layer__accounting-overview__summaries-row" }, /* @__PURE__ */ import_react112.default.createElement(ProfitAndLoss.Summaries, { actionable: false }), /* @__PURE__ */ import_react112.default.createElement(TransactionToReviewCard, { onClick: onTransactionsToReviewClick })), /* @__PURE__ */ import_react112.default.createElement(
     Container,
     {
@@ -10579,7 +10581,42 @@ var AccountingOverview = ({
     },
     /* @__PURE__ */ import_react112.default.createElement(Header, null, /* @__PURE__ */ import_react112.default.createElement(Heading, { size: "secondary" /* secondary */ }, "Profit & Loss")),
     /* @__PURE__ */ import_react112.default.createElement(ProfitAndLoss.Chart, null)
-  ), /* @__PURE__ */ import_react112.default.createElement("div", { className: "accounting-overview-profit-and-loss-charts" }, /* @__PURE__ */ import_react112.default.createElement(Container, { name: "accounting-overview-profit-and-loss-chart" }, /* @__PURE__ */ import_react112.default.createElement(ProfitAndLoss.DetailedCharts, { scope: "revenue", hideClose: true })), /* @__PURE__ */ import_react112.default.createElement(Container, { name: "accounting-overview-profit-and-loss-chart" }, /* @__PURE__ */ import_react112.default.createElement(ProfitAndLoss.DetailedCharts, { scope: "expenses", hideClose: true })))));
+  ), /* @__PURE__ */ import_react112.default.createElement("div", { className: "accounting-overview-profit-and-loss-charts" }, /* @__PURE__ */ import_react112.default.createElement(
+    Toggle,
+    {
+      name: "pnl-detailed-charts",
+      options: [
+        {
+          value: "revenue",
+          label: "Revenue"
+        },
+        {
+          value: "expenses",
+          label: "Expenses"
+        }
+      ],
+      selected: pnlToggle,
+      onChange: (e) => setPnlToggle(e.target.value)
+    }
+  ), /* @__PURE__ */ import_react112.default.createElement(
+    Container,
+    {
+      name: (0, import_classnames44.default)(
+        "accounting-overview-profit-and-loss-chart",
+        pnlToggle !== "revenue" && "accounting-overview-profit-and-loss-chart--hidden"
+      )
+    },
+    /* @__PURE__ */ import_react112.default.createElement(ProfitAndLoss.DetailedCharts, { scope: "revenue", hideClose: true })
+  ), /* @__PURE__ */ import_react112.default.createElement(
+    Container,
+    {
+      name: (0, import_classnames44.default)(
+        "accounting-overview-profit-and-loss-chart",
+        pnlToggle !== "expenses" && "accounting-overview-profit-and-loss-chart--hidden"
+      )
+    },
+    /* @__PURE__ */ import_react112.default.createElement(ProfitAndLoss.DetailedCharts, { scope: "expenses", hideClose: true })
+  ))));
 };
 
 // src/views/BankTransactionsWithLinkedAccounts/BankTransactionsWithLinkedAccounts.tsx