@layerfi/components 0.1.2 → 0.1.3

package/dist/index.css

@@ -0,0 +1,106 @@
+/* src/components/Hello/Hello.css */
+.hello {
+  color: red;
+}
+
+/* src/components/Transactions/Transactions.css */
+.transactions {
+  --transaction-buttons-border-color: #D0D5DD;
+  --transaction-buttons-selected-background-color: #E0E9FF;
+  --transaction-table-background-color: white;
+  --transaction-table-border-color: #EAECF0;
+  --transaction-table-text-color: #101828;
+}
+.transactions {
+  margin: 3rem;
+  border-radius: 0.6rem;
+  border: 1px solid var(--transaction-table-border-color);
+  background-color: var(--transaction-table-background-color);
+  overflow: hidden;
+}
+.transactions header {
+  display: flex;
+  padding: 1rem;
+}
+.transactions header h1 {
+  display: flex;
+  align-items: center;
+  flex: 1;
+  justify-content: flex-start;
+  font-size: 1.5rem;
+  font-style: normal;
+  font-weight: 600;
+  line-height: 2rem;
+  margin: 0;
+}
+.transactions header div {
+  display: flex;
+  font-size: 1rem;
+  align-items: center;
+  flex: 1;
+  justify-content: flex-end;
+}
+.transactions .transaction-table {
+  display: grid;
+  grid-template-columns: auto repeat(4, 1fr) repeat(3, auto);
+  gap: 1px 0px;
+  background-color: var(--transaction-table-border-color);
+  border-top: 1px solid var(--transaction-table-border-color);
+  border-radius: 0.6rem;
+}
+.transactions .transaction-table div {
+  padding: 1rem;
+  background-color: white;
+  overflow: clip;
+  color: var(--transaction-table-text-color);
+  font-family: sans-serif;
+  font-size: 16px;
+  font-style: normal;
+  font-weight: 500;
+  line-height: 20px;
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+}
+.transactions .transaction-table div select {
+  border: 2px solid var(--transaction-table-border-color);
+  border-radius: 0.6rem;
+  background-color: var(--transaction-table-background-color);
+  padding: 0.6rem 0.8rem;
+}
+.transactions .transaction-table div.header {
+  font-weight: bold;
+}
+.transactions .transaction-table div.expand-area {
+  grid-column: 1 / -1;
+  margin-top: -1px;
+}
+.transactions .transaction-table div.expand-content {
+  padding: 1rem;
+  text-align: center;
+}
+.transactions .radio-group {
+}
+.transactions .radio-group input {
+  position: absolute;
+  opacity: 0;
+}
+.transactions .radio-group div {
+  padding: 0.6rem 1rem;
+  border: 1px solid var(--transaction-buttons-border-color);
+  border-right: 0;
+  border-radius: 0;
+}
+.transactions .radio-group label:first-of-type div {
+  border-start-start-radius: 0.6rem;
+  border-end-start-radius: 0.6rem;
+}
+.transactions .radio-group label:last-of-type div {
+  border-right: 1px solid var(--transaction-buttons-border-color);
+  border-start-end-radius: 0.6rem;
+  border-end-end-radius: 0.6rem;
+}
+.transactions .radio-group input:checked + div {
+  background: var(--transaction-buttons-selected-background-color);
+}
+/*# sourceMappingURL=index.css.map */

package/dist/index.css.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../src/components/Hello/Hello.css", "../src/components/Transactions/Transactions.css"],
+  "sourcesContent": [".hello {\n  color: red;\n}\n", ".transactions {\n  --transaction-buttons-border-color: #D0D5DD;\n  --transaction-buttons-selected-background-color: #E0E9FF;\n  --transaction-table-background-color: white;\n  --transaction-table-border-color: #EAECF0;\n  --transaction-table-text-color: #101828;\n}\n\n.transactions {\n  margin: 3rem;\n  border-radius: 0.6rem;\n  border: 1px solid var(--transaction-table-border-color);\n  background-color: var(--transaction-table-background-color);\n  overflow: hidden;\n}\n\n.transactions header {\n  display: flex;\n  padding: 1rem;\n}\n\n.transactions header h1 {\n  display: flex;\n  align-items: center;\n  flex: 1;\n  justify-content: flex-start;\n  font-size: 1.5rem;\n  font-style: normal;\n  font-weight: 600;\n  line-height: 2rem;\n  margin: 0;\n}\n\n.transactions header div {\n  display: flex;\n  font-size: 1rem;\n  align-items: center;\n  flex: 1;\n  justify-content: flex-end;\n}\n\n.transactions .transaction-table {\n  display: grid;\n  grid-template-columns: auto repeat(4, 1fr) repeat(3, auto);\n  gap: 1px 0px;\n  background-color: var(--transaction-table-border-color);\n  border-top: 1px solid var(--transaction-table-border-color);\n  border-radius: 0.6rem;\n}\n\n.transactions .transaction-table div {\n  padding: 1rem;\n  background-color: white;\n  overflow: clip;\n  color: var(--transaction-table-text-color);\n  font-family: sans-serif;\n  font-size: 16px;\n  font-style: normal;\n  font-weight: 500;\n  line-height: 20px;\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n}\n\n.transactions .transaction-table div select {\n  border: 2px solid var(--transaction-table-border-color);\n  border-radius: 0.6rem;\n  background-color: var(--transaction-table-background-color);\n  padding: 0.6rem 0.8rem;\n}\n\n.transactions .transaction-table div.header {\n  font-weight: bold;\n}\n\n.transactions .transaction-table div.expand-area {\n  grid-column: 1 / -1;\n  margin-top: -1px;\n}\n\n.transactions .transaction-table div.expand-content {\n  padding: 1rem;\n  text-align: center;\n}\n\n.transactions .radio-group {\n}\n\n.transactions .radio-group input {\n  position: absolute;\n  opacity: 0;\n}\n\n.transactions .radio-group div {\n  padding: 0.6rem 1rem;\n  border: 1px solid var(--transaction-buttons-border-color);\n  border-right: 0;\n  border-radius: 0;\n}\n\n.transactions .radio-group label:first-of-type div {\n  border-start-start-radius: 0.6rem;\n  border-end-start-radius: 0.6rem;\n}\n\n.transactions .radio-group label:last-of-type div {\n  border-right: 1px solid var(--transaction-buttons-border-color);\n  border-start-end-radius: 0.6rem;\n  border-end-end-radius: 0.6rem;\n}\n\n.transactions .radio-group input:checked + div {\n  background: var(--transaction-buttons-selected-background-color);\n}\n"],
+  "mappings": ";AAAA,CAAC;AACC,SAAO;AACT;;;ACFA,CAAC;AACC,sCAAoC;AACpC,mDAAiD;AACjD,wCAAsC;AACtC,oCAAkC;AAClC,kCAAgC;AAClC;AAEA,CARC;AASC,UAAQ;AACR,iBAAe;AACf,UAAQ,IAAI,MAAM,IAAI;AACtB,oBAAkB,IAAI;AACtB,YAAU;AACZ;AAEA,CAhBC,aAgBa;AACZ,WAAS;AACT,WAAS;AACX;AAEA,CArBC,aAqBa,OAAO;AACnB,WAAS;AACT,eAAa;AACb,QAAM;AACN,mBAAiB;AACjB,aAAW;AACX,cAAY;AACZ,eAAa;AACb,eAAa;AACb,UAAQ;AACV;AAEA,CAjCC,aAiCa,OAAO;AACnB,WAAS;AACT,aAAW;AACX,eAAa;AACb,QAAM;AACN,mBAAiB;AACnB;AAEA,CAzCC,aAyCa,CAAC;AACb,WAAS;AACT,yBAAuB,KAAK,OAAO,CAAC,EAAE,KAAK,OAAO,CAAC,EAAE;AACrD,OAAK,IAAI;AACT,oBAAkB,IAAI;AACtB,cAAY,IAAI,MAAM,IAAI;AAC1B,iBAAe;AACjB;AAEA,CAlDC,aAkDa,CATC,kBASkB;AAC/B,WAAS;AACT,oBAAkB;AAClB,YAAU;AACV,SAAO,IAAI;AACX,eAAa;AACb,aAAW;AACX,cAAY;AACZ,eAAa;AACb,eAAa;AACb,WAAS;AACT,kBAAgB;AAChB,eAAa;AACf;AAEA,CAjEC,aAiEa,CAxBC,kBAwBkB,IAAI;AACnC,UAAQ,IAAI,MAAM,IAAI;AACtB,iBAAe;AACf,oBAAkB,IAAI;AACtB,WAAS,OAAO;AAClB;AAEA,CAxEC,aAwEa,CA/BC,kBA+BkB,GAAG,CAAC;AACnC,eAAa;AACf;AAEA,CA5EC,aA4Ea,CAnCC,kBAmCkB,GAAG,CAAC;AACnC,eAAa,EAAE,EAAE;AACjB,cAAY;AACd;AAEA,CAjFC,aAiFa,CAxCC,kBAwCkB,GAAG,CAAC;AACnC,WAAS;AACT,cAAY;AACd;AAEA,CAtFC,aAsFa,CAAC;AACf;AAEA,CAzFC,aAyFa,CAHC,YAGY;AACzB,YAAU;AACV,WAAS;AACX;AAEA,CA9FC,aA8Fa,CARC,YAQY;AACzB,WAAS,OAAO;AAChB,UAAQ,IAAI,MAAM,IAAI;AACtB,gBAAc;AACd,iBAAe;AACjB;AAEA,CArGC,aAqGa,CAfC,YAeY,KAAK,eAAe;AAC7C,6BAA2B;AAC3B,2BAAyB;AAC3B;AAEA,CA1GC,aA0Ga,CApBC,YAoBY,KAAK,cAAc;AAC5C,gBAAc,IAAI,MAAM,IAAI;AAC5B,2BAAyB;AACzB,yBAAuB;AACzB;AAEA,CAhHC,aAgHa,CA1BC,YA0BY,KAAK,SAAS,EAAE;AACzC,cAAY,IAAI;AAClB;",
+  "names": []
+}

package/dist/index.d.ts

@@ -233,7 +233,10 @@ declare module '@layerfi/components/components/BankTransactionRow/index' {
 }
 declare module '@layerfi/components/components/BankTransactions/BankTransactions' {
   import React from 'react';
-  export const BankTransactions: () => React.JSX.Element;
+  export interface BankTransactionsProps {
+      asWidget?: boolean;
+  }
+  export const BankTransactions: ({ asWidget, }: BankTransactionsProps) => React.JSX.Element;
 
 }
 declare module '@layerfi/components/components/BankTransactions/index' {
@@ -329,9 +332,10 @@ declare module '@layerfi/components/components/Container/Container' {
   export interface ContainerProps {
       name: string;
       className?: string;
+      asWidget?: boolean;
       children: ReactNode;
   }
-  export const Container: ({ name, className, children }: ContainerProps) => React.JSX.Element;
+  export const Container: ({ name, className, children, asWidget, }: ContainerProps) => React.JSX.Element;
 
 }
 declare module '@layerfi/components/components/Container/Header' {
@@ -348,6 +352,26 @@ declare module '@layerfi/components/components/Container/index' {
   export { Container } from '@layerfi/components/components/Container/Container';
   export { Header } from '@layerfi/components/components/Container/Header';
 
+}
+declare module '@layerfi/components/components/DataState/DataState' {
+  import React from 'react';
+  export enum DataStateStatus {
+      allDone = "allDone",
+      failed = "failed"
+  }
+  export interface DataStateProps {
+      status: DataStateStatus;
+      title?: string;
+      description?: string;
+      onRefresh?: () => void;
+      isLoading?: boolean;
+  }
+  export const DataState: ({ status, title, description, onRefresh, isLoading, }: DataStateProps) => React.JSX.Element;
+
+}
+declare module '@layerfi/components/components/DataState/index' {
+  export { DataState, DataStateStatus } from '@layerfi/components/components/DataState/DataState';
+
 }
 declare module '@layerfi/components/components/ExpandedBankTransactionRow/ExpandedBankTransactionRow' {
   import React from 'react';
@@ -357,7 +381,7 @@ declare module '@layerfi/components/components/ExpandedBankTransactionRow/Expand
       close?: () => void;
       isOpen?: boolean;
       asListItem?: boolean;
-      showSubmitButton?: boolean;
+      submitBtnText?: string;
   };
   export type SaveHandle = {
       save: () => void;
@@ -727,6 +751,7 @@ declare module '@layerfi/components/components/Typography/Heading' {
 declare module '@layerfi/components/components/Typography/Text' {
   import React, { ReactNode } from 'react';
   export enum TextSize {
+      lg = "lg",
       md = "md",
       sm = "sm"
   }
@@ -799,12 +824,14 @@ declare module '@layerfi/components/hooks/useBankTransactions/index' {
 declare module '@layerfi/components/hooks/useBankTransactions/useBankTransactions' {
   import { BankTransaction, CategoryUpdate, Metadata } from '@layerfi/components/types';
   type UseBankTransactions = () => {
-      data: BankTransaction[];
+      data?: BankTransaction[];
       metadata: Metadata;
       isLoading: boolean;
+      isValidating: boolean;
       error: unknown;
       categorize: (id: BankTransaction['id'], newCategory: CategoryUpdate) => Promise<void>;
       updateOneLocal: (bankTransaction: BankTransaction) => void;
+      refetch: () => void;
   };
   export const useBankTransactions: UseBankTransactions;
   export {};
@@ -872,6 +899,13 @@ declare module '@layerfi/components/icons/AlertCircle' {
   const AlertCircle: ({ size, ...props }: IconSvgProps) => React.JSX.Element;
   export default AlertCircle;
 
+}
+declare module '@layerfi/components/icons/AlertOctagon' {
+  import * as React from 'react';
+  import { IconSvgProps } from '@layerfi/components/icons/types';
+  const AlertOctagon: ({ size, ...props }: IconSvgProps) => React.JSX.Element;
+  export default AlertOctagon;
+
 }
 declare module '@layerfi/components/icons/Calendar' {
   import * as React from 'react';
@@ -957,11 +991,11 @@ declare module '@layerfi/components/icons/RefreshCcw' {
   export default RefreshCcw;
 
 }
-declare module '@layerfi/components/icons/ScissorsFullOpen' {
+declare module '@layerfi/components/icons/Scissors' {
   import * as React from 'react';
   import { IconSvgProps } from '@layerfi/components/icons/types';
-  const ScissorsFullOpen: ({ size, ...props }: IconSvgProps) => React.JSX.Element;
-  export default ScissorsFullOpen;
+  const Scissors: ({ size, ...props }: IconSvgProps) => React.JSX.Element;
+  export default Scissors;
 
 }
 declare module '@layerfi/components/icons/UploadCloud' {

package/dist/index.esm.css

@@ -0,0 +1,106 @@
+/* src/components/Hello/Hello.css */
+.hello {
+  color: red;
+}
+
+/* src/components/Transactions/Transactions.css */
+.transactions {
+  --transaction-buttons-border-color: #D0D5DD;
+  --transaction-buttons-selected-background-color: #E0E9FF;
+  --transaction-table-background-color: white;
+  --transaction-table-border-color: #EAECF0;
+  --transaction-table-text-color: #101828;
+}
+.transactions {
+  margin: 3rem;
+  border-radius: 0.6rem;
+  border: 1px solid var(--transaction-table-border-color);
+  background-color: var(--transaction-table-background-color);
+  overflow: hidden;
+}
+.transactions header {
+  display: flex;
+  padding: 1rem;
+}
+.transactions header h1 {
+  display: flex;
+  align-items: center;
+  flex: 1;
+  justify-content: flex-start;
+  font-size: 1.5rem;
+  font-style: normal;
+  font-weight: 600;
+  line-height: 2rem;
+  margin: 0;
+}
+.transactions header div {
+  display: flex;
+  font-size: 1rem;
+  align-items: center;
+  flex: 1;
+  justify-content: flex-end;
+}
+.transactions .transaction-table {
+  display: grid;
+  grid-template-columns: auto repeat(4, 1fr) repeat(3, auto);
+  gap: 1px 0px;
+  background-color: var(--transaction-table-border-color);
+  border-top: 1px solid var(--transaction-table-border-color);
+  border-radius: 0.6rem;
+}
+.transactions .transaction-table div {
+  padding: 1rem;
+  background-color: white;
+  overflow: clip;
+  color: var(--transaction-table-text-color);
+  font-family: sans-serif;
+  font-size: 16px;
+  font-style: normal;
+  font-weight: 500;
+  line-height: 20px;
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+}
+.transactions .transaction-table div select {
+  border: 2px solid var(--transaction-table-border-color);
+  border-radius: 0.6rem;
+  background-color: var(--transaction-table-background-color);
+  padding: 0.6rem 0.8rem;
+}
+.transactions .transaction-table div.header {
+  font-weight: bold;
+}
+.transactions .transaction-table div.expand-area {
+  grid-column: 1 / -1;
+  margin-top: -1px;
+}
+.transactions .transaction-table div.expand-content {
+  padding: 1rem;
+  text-align: center;
+}
+.transactions .radio-group {
+}
+.transactions .radio-group input {
+  position: absolute;
+  opacity: 0;
+}
+.transactions .radio-group div {
+  padding: 0.6rem 1rem;
+  border: 1px solid var(--transaction-buttons-border-color);
+  border-right: 0;
+  border-radius: 0;
+}
+.transactions .radio-group label:first-of-type div {
+  border-start-start-radius: 0.6rem;
+  border-end-start-radius: 0.6rem;
+}
+.transactions .radio-group label:last-of-type div {
+  border-right: 1px solid var(--transaction-buttons-border-color);
+  border-start-end-radius: 0.6rem;
+  border-end-end-radius: 0.6rem;
+}
+.transactions .radio-group input:checked + div {
+  background: var(--transaction-buttons-selected-background-color);
+}
+/*# sourceMappingURL=index.esm.css.map */

package/dist/index.esm.css.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../src/components/Hello/Hello.css", "../src/components/Transactions/Transactions.css"],
+  "sourcesContent": [".hello {\n  color: red;\n}\n", ".transactions {\n  --transaction-buttons-border-color: #D0D5DD;\n  --transaction-buttons-selected-background-color: #E0E9FF;\n  --transaction-table-background-color: white;\n  --transaction-table-border-color: #EAECF0;\n  --transaction-table-text-color: #101828;\n}\n\n.transactions {\n  margin: 3rem;\n  border-radius: 0.6rem;\n  border: 1px solid var(--transaction-table-border-color);\n  background-color: var(--transaction-table-background-color);\n  overflow: hidden;\n}\n\n.transactions header {\n  display: flex;\n  padding: 1rem;\n}\n\n.transactions header h1 {\n  display: flex;\n  align-items: center;\n  flex: 1;\n  justify-content: flex-start;\n  font-size: 1.5rem;\n  font-style: normal;\n  font-weight: 600;\n  line-height: 2rem;\n  margin: 0;\n}\n\n.transactions header div {\n  display: flex;\n  font-size: 1rem;\n  align-items: center;\n  flex: 1;\n  justify-content: flex-end;\n}\n\n.transactions .transaction-table {\n  display: grid;\n  grid-template-columns: auto repeat(4, 1fr) repeat(3, auto);\n  gap: 1px 0px;\n  background-color: var(--transaction-table-border-color);\n  border-top: 1px solid var(--transaction-table-border-color);\n  border-radius: 0.6rem;\n}\n\n.transactions .transaction-table div {\n  padding: 1rem;\n  background-color: white;\n  overflow: clip;\n  color: var(--transaction-table-text-color);\n  font-family: sans-serif;\n  font-size: 16px;\n  font-style: normal;\n  font-weight: 500;\n  line-height: 20px;\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n}\n\n.transactions .transaction-table div select {\n  border: 2px solid var(--transaction-table-border-color);\n  border-radius: 0.6rem;\n  background-color: var(--transaction-table-background-color);\n  padding: 0.6rem 0.8rem;\n}\n\n.transactions .transaction-table div.header {\n  font-weight: bold;\n}\n\n.transactions .transaction-table div.expand-area {\n  grid-column: 1 / -1;\n  margin-top: -1px;\n}\n\n.transactions .transaction-table div.expand-content {\n  padding: 1rem;\n  text-align: center;\n}\n\n.transactions .radio-group {\n}\n\n.transactions .radio-group input {\n  position: absolute;\n  opacity: 0;\n}\n\n.transactions .radio-group div {\n  padding: 0.6rem 1rem;\n  border: 1px solid var(--transaction-buttons-border-color);\n  border-right: 0;\n  border-radius: 0;\n}\n\n.transactions .radio-group label:first-of-type div {\n  border-start-start-radius: 0.6rem;\n  border-end-start-radius: 0.6rem;\n}\n\n.transactions .radio-group label:last-of-type div {\n  border-right: 1px solid var(--transaction-buttons-border-color);\n  border-start-end-radius: 0.6rem;\n  border-end-end-radius: 0.6rem;\n}\n\n.transactions .radio-group input:checked + div {\n  background: var(--transaction-buttons-selected-background-color);\n}\n"],
+  "mappings": ";AAAA,CAAC;AACC,SAAO;AACT;;;ACFA,CAAC;AACC,sCAAoC;AACpC,mDAAiD;AACjD,wCAAsC;AACtC,oCAAkC;AAClC,kCAAgC;AAClC;AAEA,CARC;AASC,UAAQ;AACR,iBAAe;AACf,UAAQ,IAAI,MAAM,IAAI;AACtB,oBAAkB,IAAI;AACtB,YAAU;AACZ;AAEA,CAhBC,aAgBa;AACZ,WAAS;AACT,WAAS;AACX;AAEA,CArBC,aAqBa,OAAO;AACnB,WAAS;AACT,eAAa;AACb,QAAM;AACN,mBAAiB;AACjB,aAAW;AACX,cAAY;AACZ,eAAa;AACb,eAAa;AACb,UAAQ;AACV;AAEA,CAjCC,aAiCa,OAAO;AACnB,WAAS;AACT,aAAW;AACX,eAAa;AACb,QAAM;AACN,mBAAiB;AACnB;AAEA,CAzCC,aAyCa,CAAC;AACb,WAAS;AACT,yBAAuB,KAAK,OAAO,CAAC,EAAE,KAAK,OAAO,CAAC,EAAE;AACrD,OAAK,IAAI;AACT,oBAAkB,IAAI;AACtB,cAAY,IAAI,MAAM,IAAI;AAC1B,iBAAe;AACjB;AAEA,CAlDC,aAkDa,CATC,kBASkB;AAC/B,WAAS;AACT,oBAAkB;AAClB,YAAU;AACV,SAAO,IAAI;AACX,eAAa;AACb,aAAW;AACX,cAAY;AACZ,eAAa;AACb,eAAa;AACb,WAAS;AACT,kBAAgB;AAChB,eAAa;AACf;AAEA,CAjEC,aAiEa,CAxBC,kBAwBkB,IAAI;AACnC,UAAQ,IAAI,MAAM,IAAI;AACtB,iBAAe;AACf,oBAAkB,IAAI;AACtB,WAAS,OAAO;AAClB;AAEA,CAxEC,aAwEa,CA/BC,kBA+BkB,GAAG,CAAC;AACnC,eAAa;AACf;AAEA,CA5EC,aA4Ea,CAnCC,kBAmCkB,GAAG,CAAC;AACnC,eAAa,EAAE,EAAE;AACjB,cAAY;AACd;AAEA,CAjFC,aAiFa,CAxCC,kBAwCkB,GAAG,CAAC;AACnC,WAAS;AACT,cAAY;AACd;AAEA,CAtFC,aAsFa,CAAC;AACf;AAEA,CAzFC,aAyFa,CAHC,YAGY;AACzB,YAAU;AACV,WAAS;AACX;AAEA,CA9FC,aA8Fa,CARC,YAQY;AACzB,WAAS,OAAO;AAChB,UAAQ,IAAI,MAAM,IAAI;AACtB,gBAAc;AACd,iBAAe;AACjB;AAEA,CArGC,aAqGa,CAfC,YAeY,KAAK,eAAe;AAC7C,6BAA2B;AAC3B,2BAAyB;AAC3B;AAEA,CA1GC,aA0Ga,CApBC,YAoBY,KAAK,cAAc;AAC5C,gBAAc,IAAI,MAAM,IAAI;AAC5B,2BAAyB;AACzB,yBAAuB;AACzB;AAEA,CAhHC,aAgHa,CA1BC,YA0BY,KAAK,SAAS,EAAE;AACzC,cAAY,IAAI;AAClB;",
+  "names": []
+}

package/dist/index.esm.js

@@ -0,0 +1,252 @@
+// src/components/Hello/Hello.tsx
+import React from "react";
+import useSWR from "swr";
+var fetcher = (url) => fetch(url).then((res) => res.json());
+var Hello = ({ user }) => {
+  const { data, isLoading } = useSWR(
+    `https://api.github.com/users/${user || "jyurek"}`,
+    fetcher
+  );
+  const name = (isLoading ? "..." : data?.name) || "User";
+  return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement("div", { className: "hello" }, "Hello, ", name, "!"));
+};
+
+// src/components/Transactions/Transactions.tsx
+import React7, { useState as useState2, useContext as useContext3 } from "react";
+
+// src/contexts/LayerContext/LayerContext.tsx
+import { createContext } from "react";
+var LayerContext = createContext({
+  auth: void 0,
+  businessId: "",
+  categories: []
+});
+
+// src/components/RadioButtonGroup/RadioButtonGroup.tsx
+import React3 from "react";
+
+// src/components/RadioButtonGroup/RadioButton.tsx
+import React2 from "react";
+var RadioButton = ({
+  checked,
+  label,
+  name,
+  onChange,
+  value
+}) => {
+  return /* @__PURE__ */ React2.createElement("label", null, /* @__PURE__ */ React2.createElement(
+    "input",
+    {
+      type: "radio",
+      checked,
+      name,
+      onChange,
+      value
+    }
+  ), /* @__PURE__ */ React2.createElement("div", null, label));
+};
+
+// src/components/RadioButtonGroup/RadioButtonGroup.tsx
+var RadioButtonGroup = ({
+  name,
+  buttons,
+  onChange,
+  selected
+}) => {
+  const selectedValue = selected || buttons[0].value;
+  return /* @__PURE__ */ React3.createElement("div", { className: "radio-group" }, buttons.map((button) => /* @__PURE__ */ React3.createElement(
+    RadioButton,
+    {
+      ...button,
+      key: button.value,
+      name,
+      checked: selectedValue === button.value,
+      onChange
+    }
+  )));
+};
+
+// src/components/Transactions/TransactionRow.tsx
+import React6 from "react";
+
+// src/models/Money.ts
+var format = ({ amount, direction }) => (direction === "CREDIT" ? "+" : "-") + Intl.NumberFormat("en-US", { style: "currency", currency: "USD" }).format(
+  amount / 100
+);
+var Money = {
+  format
+};
+
+// src/components/CategoryMenu/CategoryMenu.tsx
+import React5, { useContext as useContext2 } from "react";
+
+// src/components/CategoryMenu/CategoryMenuItem.tsx
+import React4 from "react";
+var CategoryMenuItem = ({
+  selectedCategory,
+  category,
+  maxDepth = 1
+}) => {
+  if (category.hasOwnProperty("subCategories") && maxDepth > 0) {
+    return /* @__PURE__ */ React4.createElement("optgroup", { label: category.display_name }, category.subCategories.map((category2) => /* @__PURE__ */ React4.createElement(
+      CategoryMenuItem,
+      {
+        category: category2,
+        selectedCategory,
+        maxDepth: maxDepth - 1
+      }
+    )));
+  } else {
+    return /* @__PURE__ */ React4.createElement(
+      "option",
+      {
+        key: category.category,
+        value: category.category,
+        selected: selectedCategory === category.category
+      },
+      category.display_name
+    );
+  }
+};
+
+// src/components/CategoryMenu/CategoryMenu.tsx
+var CategoryMenu = ({ selectedCategory }) => {
+  const { categories } = useContext2(LayerContext);
+  return /* @__PURE__ */ React5.createElement("select", null, categories.map((category) => /* @__PURE__ */ React5.createElement(
+    CategoryMenuItem,
+    {
+      category,
+      selectedCategory
+    }
+  )));
+};
+
+// src/components/Transactions/TransactionRow.tsx
+import { parseISO, format as formatTime } from "date-fns";
+var TransactionRow = ({
+  dateFormat: dateFormat2,
+  transaction,
+  isOpen,
+  toggleOpen
+}) => /* @__PURE__ */ React6.createElement(React6.Fragment, null, /* @__PURE__ */ React6.createElement("div", null, /* @__PURE__ */ React6.createElement("input", { type: "checkbox" })), /* @__PURE__ */ React6.createElement("div", null, formatTime(parseISO(transaction.date), dateFormat2)), /* @__PURE__ */ React6.createElement("div", null, Money.format(transaction)), /* @__PURE__ */ React6.createElement("div", null, "Business Checking"), /* @__PURE__ */ React6.createElement("div", null, transaction.counterparty_name), /* @__PURE__ */ React6.createElement("div", { "data-selected": transaction?.category?.category }, /* @__PURE__ */ React6.createElement(CategoryMenu, { selectedCategory: transaction?.category?.category })), /* @__PURE__ */ React6.createElement("div", null), /* @__PURE__ */ React6.createElement(
+  "div",
+  {
+    onClick: () => toggleOpen(transaction.id),
+    style: { cursor: "pointer" }
+  },
+  "\u{1F3AF}"
+), isOpen && /* @__PURE__ */ React6.createElement("div", { className: "expand-area" }, /* @__PURE__ */ React6.createElement("div", { className: "expand-content" }, "Hello!")));
+
+// src/components/Transactions/Transactions.tsx
+import useSWR2 from "swr";
+var dateFormat = "MM/dd/yyyy";
+var fetchTransactions = (accessToken) => (url) => fetch(url, {
+  headers: {
+    Authorization: "Bearer " + accessToken,
+    "Content-Type": "application/json"
+  },
+  method: "GET"
+}).then((res) => res.json());
+var filterVisibility = (display) => (transaction) => {
+  const categorized = [
+    "CATEGORIZED" /* CATEGORIZED */,
+    "JOURNALING" /* JOURNALING */,
+    "SPLIT" /* SPLIT */
+  ].includes(transaction.categorization_status);
+  const inReview = [
+    "READY_FOR_INPUT" /* READY_FOR_INPUT */,
+    "LAYER_REVIEW" /* LAYER_REVIEW */
+  ].includes(transaction.categorization_status);
+  return display === "review" && inReview || display === "categorized" && categorized;
+};
+var Transactions = (props) => {
+  const { auth, businessId } = useContext3(LayerContext);
+  const [display, setDisplay] = useState2("review");
+  const { data, isLoading } = useSWR2(
+    auth?.access_token && `https://sandbox.layerfi.com/v1/businesses/${businessId}/bank-transactions`,
+    fetchTransactions(auth?.access_token)
+  );
+  const transactions = (!isLoading && data?.data || []).filter(
+    filterVisibility(display)
+  );
+  const onCategorizationDisplayChange = (event) => setDisplay(event.target.value);
+  const [openRows, setOpenRows] = useState2({});
+  const toggleOpen = (id) => setOpenRows({ ...openRows, [id]: !openRows[id] });
+  return /* @__PURE__ */ React7.createElement("div", { className: "transactions", "data-display": display }, /* @__PURE__ */ React7.createElement("header", null, /* @__PURE__ */ React7.createElement("h1", null, "Transactions"), /* @__PURE__ */ React7.createElement(
+    RadioButtonGroup,
+    {
+      name: "transaction-display",
+      buttons: [
+        { label: "To Review", value: "review" },
+        { label: "Categorized", value: "categorized" }
+      ],
+      selected: display,
+      onChange: onCategorizationDisplayChange
+    }
+  )), /* @__PURE__ */ React7.createElement("div", { className: "transaction-table" }, /* @__PURE__ */ React7.createElement("div", { className: "header" }, /* @__PURE__ */ React7.createElement("input", { type: "checkbox" })), /* @__PURE__ */ React7.createElement("div", { className: "header" }, "Date"), /* @__PURE__ */ React7.createElement("div", { className: "header" }, "Transaction"), /* @__PURE__ */ React7.createElement("div", { className: "header" }, "Account"), /* @__PURE__ */ React7.createElement("div", { className: "header" }, "Amount"), /* @__PURE__ */ React7.createElement("div", { className: "header" }, "Category"), /* @__PURE__ */ React7.createElement("div", { className: "header" }, "Action"), /* @__PURE__ */ React7.createElement("div", { className: "header" }), transactions.map((transaction) => /* @__PURE__ */ React7.createElement(
+    TransactionRow,
+    {
+      key: transaction.id,
+      dateFormat,
+      transaction,
+      isOpen: openRows[transaction.id],
+      toggleOpen
+    }
+  ))));
+};
+
+// src/providers/LayerProvider/LayerProvider.tsx
+import React8 from "react";
+import useSWR3 from "swr";
+var appId = "1pskub33qd9qt19406hi4d1j6f";
+var appSecret = "1k7up1ia2m0ino8el6md2l1isq3t7fdj1eq6firmkui8757lk6r6";
+async function getAccessToken() {
+  var details = {
+    grant_type: "client_credentials",
+    scope: "https://sandbox.layerfi.com/sandbox",
+    client_id: "canaryAppId"
+  };
+  const formBody = Object.entries(details).map((key) => encodeURIComponent(key[0]) + "=" + encodeURIComponent(key[1])).join("&");
+  const authRequest = fetch("https://auth.layerfi.com/oauth2/token", {
+    method: "POST",
+    headers: {
+      Authorization: "Basic " + btoa(appId + ":" + appSecret),
+      "Content-Type": "application/x-www-form-urlencoded"
+    },
+    body: formBody
+  });
+  return await (await authRequest).json();
+}
+var getCategories = (accessToken) => (url) => fetch(url, {
+  headers: {
+    Authorization: "Bearer " + accessToken,
+    "Content-Type": "application/json"
+  },
+  method: "GET"
+}).then((res) => res.json());
+var LayerProvider = ({
+  businessId,
+  children
+}) => {
+  const { data: auth } = useSWR3(
+    "https://auth.layerfi.com/oauth2/token",
+    getAccessToken
+  );
+  const { data: categories } = useSWR3(
+    businessId && auth?.access_token && `https://sandbox.layerfi.com/v1/businesses/${businessId}/categories`,
+    getCategories(auth?.access_token)
+  );
+  const value = {
+    auth,
+    businessId,
+    categories: categories?.data?.categories || []
+  };
+  return /* @__PURE__ */ React8.createElement(LayerContext.Provider, { value }, children);
+};
+export {
+  Hello,
+  LayerContext,
+  LayerProvider,
+  Transactions
+};
+//# sourceMappingURL=index.esm.js.map

package/dist/index.esm.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../src/components/Hello/Hello.tsx", "../src/components/Transactions/Transactions.tsx", "../src/contexts/LayerContext/LayerContext.tsx", "../src/components/RadioButtonGroup/RadioButtonGroup.tsx", "../src/components/RadioButtonGroup/RadioButton.tsx", "../src/components/Transactions/TransactionRow.tsx", "../src/models/Money.ts", "../src/components/CategoryMenu/CategoryMenu.tsx", "../src/components/CategoryMenu/CategoryMenuItem.tsx", "../src/providers/LayerProvider/LayerProvider.tsx"],
+  "sourcesContent": ["import React from 'react'\nimport './Hello.css'\nimport useSWR from 'swr'\n\ntype Props = {\n  user?: string | undefined\n}\n\nconst fetcher = url => fetch(url).then(res => res.json())\n\nexport const Hello = ({ user }: Props) => {\n  const { data, isLoading } = useSWR(\n    `https://api.github.com/users/${user || 'jyurek'}`,\n    fetcher,\n  )\n  const name = (isLoading ? '...' : data?.name) || 'User'\n  return (\n    <>\n      <div className=\"hello\">Hello, {name}!</div>\n    </>\n  )\n}\n", "import React, { useState, useContext } from 'react'\nimport { LayerContext } from '../../contexts/LayerContext'\nimport { Transaction, CategorizationStatus } from '../../types'\nimport { RadioButtonGroup } from '../RadioButtonGroup'\nimport { TransactionRow } from './TransactionRow'\nimport './Transactions.css'\nimport useSWR from 'swr'\n\nconst dateFormat = 'MM/dd/yyyy'\n\nconst fetchTransactions = (accessToken: string) => (url: string) =>\n  fetch(url, {\n    headers: {\n      Authorization: 'Bearer ' + accessToken,\n      'Content-Type': 'application/json',\n    },\n    method: 'GET',\n  }).then(res => res.json())\n\nconst filterVisibility = (display: Display) => (transaction: Transaction) => {\n  const categorized = [\n    CategorizationStatus.CATEGORIZED,\n    CategorizationStatus.JOURNALING,\n    CategorizationStatus.SPLIT,\n  ].includes(transaction.categorization_status)\n  const inReview = [\n    CategorizationStatus.READY_FOR_INPUT,\n    CategorizationStatus.LAYER_REVIEW,\n  ].includes(transaction.categorization_status)\n  return (\n    (display === 'review' && inReview) ||\n    (display === 'categorized' && categorized)\n  )\n}\n\ntype Props = {}\n\nexport const Transactions = (props: Props) => {\n  const { auth, businessId } = useContext(LayerContext)\n  const [display, setDisplay] = useState<'review' | 'categorized'>('review')\n  const { data, isLoading } = useSWR(\n    auth?.access_token &&\n      `https://sandbox.layerfi.com/v1/businesses/${businessId}/bank-transactions`,\n    fetchTransactions(auth?.access_token),\n  )\n  const transactions = ((!isLoading && data?.data) || []).filter(\n    filterVisibility(display),\n  )\n  const onCategorizationDisplayChange = (\n    event: React.ChangeEvent<HTMLInputElement>,\n  ) => setDisplay(event.target.value)\n  const [openRows, setOpenRows] = useState<Record<string, boolean>>({})\n  const toggleOpen = (id: string) =>\n    setOpenRows({ ...openRows, [id]: !openRows[id] })\n  return (\n    <div className=\"transactions\" data-display={display}>\n      <header>\n        <h1>Transactions</h1>\n        <RadioButtonGroup\n          name=\"transaction-display\"\n          buttons={[\n            { label: 'To Review', value: 'review' },\n            { label: 'Categorized', value: 'categorized' },\n          ]}\n          selected={display}\n          onChange={onCategorizationDisplayChange}\n        />\n      </header>\n      <div className=\"transaction-table\">\n        <div className=\"header\">\n          <input type=\"checkbox\" />\n        </div>\n        <div className=\"header\">Date</div>\n        <div className=\"header\">Transaction</div>\n        <div className=\"header\">Account</div>\n        <div className=\"header\">Amount</div>\n        <div className=\"header\">Category</div>\n        <div className=\"header\">Action</div>\n        <div className=\"header\"></div>\n        {transactions.map(transaction => (\n          <TransactionRow\n            key={transaction.id}\n            dateFormat={dateFormat}\n            transaction={transaction}\n            isOpen={openRows[transaction.id]}\n            toggleOpen={toggleOpen}\n          />\n        ))}\n      </div>\n    </div>\n  )\n}\n", "import { createContext } from 'react'\nimport { LayerExecutionContext } from '../../types'\n\nexport const LayerContext = createContext<LayerExecutionContext>({\n  auth: undefined,\n  businessId: '',\n  categories: [],\n})\n", "import React, { useState } from 'react'\nimport { RadioButton } from './RadioButton'\n\nexport type RadioButtonLabel = {\n  label: string\n  value: string\n}\n\ntype Props = {\n  name: string\n  buttons: RadioButtonLabel[]\n  selected?: Pick<RadioButtonLabel, 'value'>\n  onChange: (event: React.ChangeEvent<HTMLInputElement>) => void\n}\n\nexport const RadioButtonGroup = ({\n  name,\n  buttons,\n  onChange,\n  selected,\n}: Props) => {\n  const selectedValue = selected || buttons[0].value\n  return (\n    <div className=\"radio-group\">\n      {buttons.map(button => (\n        <RadioButton\n          {...button}\n          key={button.value}\n          name={name}\n          checked={selectedValue === button.value}\n          onChange={onChange}\n        />\n      ))}\n    </div>\n  )\n}\n", "import React from 'react'\n\ntype Props = {\n  checked: boolean\n  label: string\n  name: string\n  onChange: (event: React.ChangeEvent<HTMLInputElement>) => void\n  value: string\n}\n\nexport const RadioButton = ({\n  checked,\n  label,\n  name,\n  onChange,\n  value,\n}: Props) => {\n  return (\n    <label>\n      <input\n        type=\"radio\"\n        checked={checked}\n        name={name}\n        onChange={onChange}\n        value={value}\n      />\n      <div>{label}</div>\n    </label>\n  )\n}\n", "import React from 'react'\nimport { Money } from '../../models/Money'\nimport { Transaction } from '../../types'\nimport { CategoryMenu } from '../CategoryMenu'\nimport { parseISO, format as formatTime } from 'date-fns'\n\ntype Props = {\n  dateFormat: string\n  transaction: Transaction\n  isOpen: boolean\n  toggleOpen: (id: string) => void\n}\n\nexport const TransactionRow = ({\n  dateFormat,\n  transaction,\n  isOpen,\n  toggleOpen,\n}: Props) => (\n  <>\n    <div>\n      <input type=\"checkbox\" />\n    </div>\n    <div>{formatTime(parseISO(transaction.date), dateFormat)}</div>\n    <div>{Money.format(transaction)}</div>\n    <div>Business Checking</div>\n    <div>{transaction.counterparty_name}</div>\n    <div data-selected={transaction?.category?.category}>\n      <CategoryMenu selectedCategory={transaction?.category?.category} />\n    </div>\n    <div></div>\n    <div\n      onClick={() => toggleOpen(transaction.id)}\n      style={{ cursor: 'pointer' }}\n    >\n      &#x1F3AF;\n    </div>\n    {isOpen && (\n      <div className=\"expand-area\">\n        <div className=\"expand-content\">Hello!</div>\n      </div>\n    )}\n  </>\n)\n", "import { Transaction } from '../types'\n\ntype FormatParameters = Pick<Transaction, 'amount'> &\n  Pick<Partial<Transaction>, 'direction'>\nconst format = ({ amount, direction }: FormatParameters) =>\n  (direction === 'CREDIT' ? '+' : '-') +\n  Intl.NumberFormat('en-US', { style: 'currency', currency: 'USD' }).format(\n    amount / 100,\n  )\n\nexport const Money = {\n  format,\n}\n", "import React, { useContext } from 'react'\nimport { LayerContext } from '../../contexts/LayerContext'\nimport { CategoryMenuItem } from './CategoryMenuItem'\n\ntype Props = {\n  selectedCategory: string\n}\n\nexport const CategoryMenu = ({ selectedCategory }: Props) => {\n  const { categories } = useContext(LayerContext)\n  return (\n    <select>\n      {categories.map(category => (\n        <CategoryMenuItem\n          category={category}\n          selectedCategory={selectedCategory}\n        />\n      ))}\n    </select>\n  )\n}\n", "import React, { useContext } from 'react'\nimport { Category } from '../../types'\n\ntype Props = {\n  selectedCategory: string\n  category: Category\n  maxDepth?: number\n}\n\nexport const CategoryMenuItem = ({\n  selectedCategory,\n  category,\n  maxDepth = 1,\n}: Props) => {\n  if (category.hasOwnProperty('subCategories') && maxDepth > 0) {\n    return (\n      <optgroup label={category.display_name}>\n        {category.subCategories.map(category => (\n          <CategoryMenuItem\n            category={category}\n            selectedCategory={selectedCategory}\n            maxDepth={maxDepth - 1}\n          />\n        ))}\n      </optgroup>\n    )\n  } else {\n    return (\n      <option\n        key={category.category}\n        value={category.category}\n        selected={selectedCategory === category.category}\n      >\n        {category.display_name}\n      </option>\n    )\n  }\n}\n", "import React, { PropsWithChildren } from 'react'\nimport { LayerContext } from '../../contexts/LayerContext'\nimport { LayerExecutionContext } from '../../types'\nimport useSWR from 'swr'\n\nconst appId = '1pskub33qd9qt19406hi4d1j6f'\nconst appSecret = '1k7up1ia2m0ino8el6md2l1isq3t7fdj1eq6firmkui8757lk6r6'\n\nexport async function getAccessToken(): Promise<OAuthResponse> {\n  var details = {\n    grant_type: 'client_credentials',\n    scope: 'https://sandbox.layerfi.com/sandbox',\n    client_id: 'canaryAppId',\n  }\n\n  const formBody = Object.entries(details)\n    .map(key => encodeURIComponent(key[0]) + '=' + encodeURIComponent(key[1]))\n    .join('&')\n  const authRequest = fetch('https://auth.layerfi.com/oauth2/token', {\n    method: 'POST',\n    headers: {\n      Authorization: 'Basic ' + btoa(appId + ':' + appSecret),\n      'Content-Type': 'application/x-www-form-urlencoded',\n    },\n    body: formBody,\n  })\n  return (await (await authRequest).json()) as OAuthResponse\n}\n\nconst getCategories = (accessToken: string) => (url: string) =>\n  fetch(url, {\n    headers: {\n      Authorization: 'Bearer ' + accessToken,\n      'Content-Type': 'application/json',\n    },\n    method: 'GET',\n  }).then(res => res.json())\n\ntype Props = {\n  businessId: string\n}\n\nexport const LayerProvider = ({\n  businessId,\n  children,\n}: PropsWithChildren<Props>) => {\n  const { data: auth } = useSWR(\n    'https://auth.layerfi.com/oauth2/token',\n    getAccessToken,\n  )\n  const { data: categories } = useSWR(\n    businessId &&\n      auth?.access_token &&\n      `https://sandbox.layerfi.com/v1/businesses/${businessId}/categories`,\n    getCategories(auth?.access_token),\n  )\n  const value: LayerExecutionContext = {\n    auth,\n    businessId,\n    categories: categories?.data?.categories || [],\n  }\n  return <LayerContext.Provider value={value}>{children}</LayerContext.Provider>\n}\n"],
+  "mappings": "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",
+  "names": ["React", "useState", "useContext", "React", "React", "React", "React", "React", "useContext", "React", "category", "useContext", "React", "dateFormat", "React", "useSWR", "useContext", "useState", "React", "React", "useSWR", "React"]
+}