@layerfi/components 0.1.18 → 0.1.20

package/.idea/layer-react.iml

@@ -0,0 +1,9 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<module type="JAVA_MODULE" version="4">
+  <component name="NewModuleRootManager" inherit-compiler-output="true">
+    <exclude-output />
+    <content url="file://$MODULE_DIR$" />
+    <orderEntry type="inheritedJdk" />
+    <orderEntry type="sourceFolder" forTests="false" />
+  </component>
+</module>

package/.idea/misc.xml

@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<project version="4">
+  <component name="ProjectRootManager" version="2" languageLevel="JDK_19" default="true" project-jdk-name="corretto-19" project-jdk-type="JavaSDK">
+    <output url="file://$PROJECT_DIR$/out" />
+  </component>
+</project>

package/.idea/modules.xml

@@ -0,0 +1,8 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<project version="4">
+  <component name="ProjectModuleManager">
+    <modules>
+      <module fileurl="file://$PROJECT_DIR$/.idea/layer-react.iml" filepath="$PROJECT_DIR$/.idea/layer-react.iml" />
+    </modules>
+  </component>
+</project>

package/.idea/vcs.xml

@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<project version="4">
+  <component name="VcsDirectoryMappings">
+    <mapping directory="" vcs="Git" />
+  </component>
+</project>

package/dist/esm/index.js

@@ -362,6 +362,7 @@ var LayerContext = createContext({
   apiUrl: "",
   theme: void 0,
   colors: {},
+  usePlaidSandbox: true,
   setTheme: () => void 0,
   getColor: (_shade) => void 0,
   setLightColor: () => void 0,
@@ -4472,11 +4473,11 @@ var LINKED_ACCOUNTS_MOCK_DATA = [
 import useSWR4 from "swr";
 var DEBUG = true;
 var USE_MOCK_RESPONSE_DATA = false;
-var USE_PLAID_SANDBOX = true;
 var useLinkedAccounts = () => {
-  const { auth, businessId, apiUrl } = useLayerContext();
+  const { auth, businessId, apiUrl, usePlaidSandbox } = useLayerContext();
   const [linkToken, setLinkToken] = useState12(null);
   const [loadingStatus, setLoadingStatus] = useState12("initial");
+  const USE_PLAID_SANDBOX = usePlaidSandbox ?? true;
   const {
     data: responseData,
     isLoading,
@@ -6923,7 +6924,7 @@ var SkeletonLoader = ({
 import React82 from "react";
 import { PieChart as PieChart2, Pie as Pie2, Cell as Cell3 } from "recharts";
 var MiniChart = ({ data }) => {
-  return /* @__PURE__ */ React82.createElement(PieChart2, { width: 48, height: 48, className: "mini-chart" }, /* @__PURE__ */ React82.createElement(
+  return /* @__PURE__ */ React82.createElement(PieChart2, { width: 52, height: 52, className: "mini-chart" }, /* @__PURE__ */ React82.createElement(
     Pie2,
     {
       data,
@@ -6933,7 +6934,7 @@ var MiniChart = ({ data }) => {
       cy: "50%",
       innerRadius: 10,
       outerRadius: 16,
-      paddingAngle: 0.2,
+      paddingAngle: 0.4,
       fill: "#8884d8",
       width: 24,
       height: 24,
@@ -8579,7 +8580,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__ */ React96.createElement("div", { className: "Layer__header__actions-col" }, /* @__PURE__ */ React96.createElement(
           Button,
@@ -9105,7 +9106,8 @@ var LayerProvider = ({
   children,
   businessAccessToken,
   environment = "production",
-  theme
+  theme,
+  usePlaidSandbox
 }) => {
   const defaultSWRConfig = {
     revalidateInterval: 0,
@@ -9127,6 +9129,7 @@ var LayerProvider = ({
     apiUrl,
     theme,
     colors,
+    usePlaidSandbox,
     onboardingStep: void 0
   });
   const { data: auth } = appId !== void 0 && appSecret !== void 0 ? useSWR8(
@@ -10423,7 +10426,7 @@ var OnboardingContent = ({
 };
 
 // src/views/AccountingOverview/AccountingOverview.tsx
-import React127 from "react";
+import React127, { useState as useState36 } from "react";
 
 // src/components/TransactionToReviewCard/TransactionToReviewCard.tsx
 import React124, { useEffect as useEffect22, useMemo as useMemo15, useState as useState35 } from "react";
@@ -10571,11 +10574,13 @@ var View3 = ({ title, children, headerControls }) => {
 };
 
 // src/views/AccountingOverview/AccountingOverview.tsx
+import classNames43 from "classnames";
 var AccountingOverview = ({
   title = "Accounting overview",
   enableOnboarding = false,
   onTransactionsToReviewClick
 }) => {
+  const [pnlToggle, setPnlToggle] = useState36("revenue");
   return /* @__PURE__ */ React127.createElement(ProfitAndLoss, { asContainer: false }, /* @__PURE__ */ React127.createElement(View3, { title, headerControls: /* @__PURE__ */ React127.createElement(ProfitAndLoss.DatePicker, null) }, enableOnboarding && /* @__PURE__ */ React127.createElement(Onboarding, null), /* @__PURE__ */ React127.createElement("div", { className: "Layer__accounting-overview__summaries-row" }, /* @__PURE__ */ React127.createElement(ProfitAndLoss.Summaries, { actionable: false }), /* @__PURE__ */ React127.createElement(TransactionToReviewCard, { onClick: onTransactionsToReviewClick })), /* @__PURE__ */ React127.createElement(
     Container,
     {
@@ -10585,7 +10590,42 @@ var AccountingOverview = ({
     },
     /* @__PURE__ */ React127.createElement(Header, null, /* @__PURE__ */ React127.createElement(Heading, { size: "secondary" /* secondary */ }, "Profit & Loss")),
     /* @__PURE__ */ React127.createElement(ProfitAndLoss.Chart, null)
-  ), /* @__PURE__ */ React127.createElement("div", { className: "accounting-overview-profit-and-loss-charts" }, /* @__PURE__ */ React127.createElement(Container, { name: "accounting-overview-profit-and-loss-chart" }, /* @__PURE__ */ React127.createElement(ProfitAndLoss.DetailedCharts, { scope: "revenue", hideClose: true })), /* @__PURE__ */ React127.createElement(Container, { name: "accounting-overview-profit-and-loss-chart" }, /* @__PURE__ */ React127.createElement(ProfitAndLoss.DetailedCharts, { scope: "expenses", hideClose: true })))));
+  ), /* @__PURE__ */ React127.createElement("div", { className: "accounting-overview-profit-and-loss-charts" }, /* @__PURE__ */ React127.createElement(
+    Toggle,
+    {
+      name: "pnl-detailed-charts",
+      options: [
+        {
+          value: "revenue",
+          label: "Revenue"
+        },
+        {
+          value: "expenses",
+          label: "Expenses"
+        }
+      ],
+      selected: pnlToggle,
+      onChange: (e) => setPnlToggle(e.target.value)
+    }
+  ), /* @__PURE__ */ React127.createElement(
+    Container,
+    {
+      name: classNames43(
+        "accounting-overview-profit-and-loss-chart",
+        pnlToggle !== "revenue" && "accounting-overview-profit-and-loss-chart--hidden"
+      )
+    },
+    /* @__PURE__ */ React127.createElement(ProfitAndLoss.DetailedCharts, { scope: "revenue", hideClose: true })
+  ), /* @__PURE__ */ React127.createElement(
+    Container,
+    {
+      name: classNames43(
+        "accounting-overview-profit-and-loss-chart",
+        pnlToggle !== "expenses" && "accounting-overview-profit-and-loss-chart--hidden"
+      )
+    },
+    /* @__PURE__ */ React127.createElement(ProfitAndLoss.DetailedCharts, { scope: "expenses", hideClose: true })
+  ))));
 };
 
 // src/views/BankTransactionsWithLinkedAccounts/BankTransactionsWithLinkedAccounts.tsx
@@ -10642,11 +10682,11 @@ var ReportsPanel = ({ containerRef }) => {
 };
 
 // src/views/GeneralLedger/GeneralLedger.tsx
-import React130, { useState as useState36 } from "react";
+import React130, { useState as useState37 } from "react";
 var GeneralLedgerView = ({
   title = "General Ledger"
 }) => {
-  const [activeTab, setActiveTab] = useState36("chartOfAccounts");
+  const [activeTab, setActiveTab] = useState37("chartOfAccounts");
   return /* @__PURE__ */ React130.createElement(ProfitAndLoss, { asContainer: false }, /* @__PURE__ */ React130.createElement(View3, { title }, /* @__PURE__ */ React130.createElement(
     Toggle,
     {