@layerfi/components 0.1.108-alpha.1 → 0.1.108

package/dist/index.css

@@ -4513,6 +4513,9 @@ tbody .Layer__table__empty-row:first-child {
 }
 .Layer__UI__Button[data-variant=text] {
   --size: inherit;
+  display: inline-block;
+  overflow: hidden;
+  text-overflow: ellipsis;
   padding-inline: 0;
   border: none;
   background-color: transparent;
@@ -5475,6 +5478,9 @@ tbody .Layer__table__empty-row:first-child {
 .Layer__UI__Table-TableHeader:not(:last-child) .Layer__UI__Table-Column {
   border-bottom: 1px solid var(--color-base-300);
 }
+.Layer__UI__Table-TableHeader > tr {
+  height: inherit;
+}
 .Layer__UI__Table-Row {
   height: 3.25rem;
 }
@@ -5483,6 +5489,9 @@ tbody .Layer__table__empty-row:first-child {
 }
 .Layer__UI__Table-Column {
   box-sizing: border-box;
+  display: flex;
+  align-items: center;
+  height: inherit;
   padding: var(--spacing-xs) var(--spacing-sm);
   font-size: var(--text-sm);
   font-weight: var(--font-weight-normal);
@@ -5504,6 +5513,10 @@ tbody .Layer__table__empty-row:first-child {
   text-align: right;
 }
 .Layer__UI__Table-Cell {
+  box-sizing: border-box;
+  display: flex;
+  align-items: center;
+  height: inherit;
   padding: var(--spacing-xs) var(--spacing-sm);
   font-size: var(--text-md);
   font-weight: var(--font-weight-normal);
@@ -5567,6 +5580,11 @@ tbody .Layer__table__empty-row:first-child {
 .Layer__UI__Heading[data-variant=subtle] {
   color: var(--fg-subtle);
 }
+.Layer__UI__Heading[data-ellipsis] {
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
 .Layer__UI__Heading[data-pbe="3xs"] {
   padding-block-end: var(--spacing-3xs);
 }
@@ -6806,41 +6824,33 @@ tbody .Layer__table__empty-row:first-child {
 }
 .Layer__UI__Table__InvoiceTable {
   table-layout: fixed;
+  width: 100%;
 }
-.Layer__UI__Table__InvoiceTable .Layer__UI__Table-Column__InvoiceTable--SentAt {
-  width: 15%;
-  min-width: 8rem;
-}
-.Layer__UI__Table__InvoiceTable .Layer__UI__Table-Column__InvoiceTable--InvoiceNo {
-  width: 10%;
-  min-width: 6.75rem;
-}
-.Layer__UI__Table__InvoiceTable .Layer__UI__Table-Column__InvoiceTable--Customer {
-  width: 35%;
-  min-width: 11.75rem;
-}
-.Layer__UI__Table__InvoiceTable .Layer__UI__Table-Column__InvoiceTable--Total {
-  width: 15%;
-  min-width: 7.75rem;
-  border-right: 1px solid var(--color-base-300);
-  text-align: end;
-}
-.Layer__UI__Table__InvoiceTable .Layer__UI__Table-Column__InvoiceTable--Status {
-  width: 25%;
-  min-width: 10rem;
+.Layer__UI__Table__InvoiceTable .Layer__UI__Table-Row,
+.Layer__UI__Table__InvoiceTable .Layer__UI__Table-TableHeader > tr {
+  display: grid;
+  grid-template-columns: minmax(8rem, 10%) minmax(6.75rem, 15%) minmax(11.75rem, 35%) minmax(7.75rem, 15%) minmax(10rem, 25%) 3.75rem;
 }
+.Layer__UI__Table__InvoiceTable .Layer__UI__Table-Column__InvoiceTable--Total,
 .Layer__UI__Table__InvoiceTable .Layer__UI__Table-Cell__InvoiceTable--Total {
+  justify-content: flex-end;
   border-right: 1px solid var(--color-base-300);
 }
 .Layer__InvoiceTable__StatusFilter {
   width: 11rem;
 }
+.Layer__InvoiceDetail {
+  width: clamp(56rem, 100%, 1406px);
+}
 .Layer__InvoiceDetail__SubHeader {
   align-items: center;
   height: 5.5rem;
   padding-left: 2.25rem;
   border-bottom: 1px solid var(--border-color);
 }
+.Layer__InvoiceDetail__Heading {
+  max-inline-size: 30rem;
+}
 .Layer__InvoiceForm {
   min-width: 54rem;
 }
@@ -6996,6 +7006,13 @@ tbody .Layer__table__empty-row:first-child {
 .Layer__PaginatedDataTable__Pagination {
   border-top: 1px solid var(--border-color);
 }
+.Layer__DataTable__EmptyState__Row {
+  height: fit-content;
+}
+.Layer__DataTable__EmptyState__Cell {
+  grid-column: 1/-1;
+  justify-content: center;
+}
 .Layer__UI__VirtualizedTable__container {
   position: relative;
   overflow: auto;
@@ -7014,12 +7031,6 @@ tbody .Layer__table__empty-row:first-child {
   top: 0;
   display: grid;
 }
-.Layer__UI__VirtualizedTable__cell,
-.Layer__UI__VirtualizedTable__header-cell {
-  display: flex;
-  flex-wrap: wrap;
-  align-content: center;
-}
 .Layer__UI__VirtualizedTable__header-cell {
   background-color: var(--color-base-0);
 }
@@ -7850,7 +7861,7 @@ tbody .Layer__table__empty-row:first-child {
   margin-block-start: var(--spacing-5xl);
 }
 .Layer__ProfitAndLossDetailReport {
-  --pnl-detail-table-cols: minmax(7rem, 12%) minmax(7rem, 12%) minmax(10rem, 18%) minmax(12rem, 38%) minmax(7.5rem, 10%) minmax(7.5rem, 10%);
+  --pnl-detail-table-cols: minmax(7.5rem, 8%) minmax(7rem, 18%) minmax(10rem, 18%) minmax(12rem, 36%) minmax(7.5rem, 10%) minmax(7.5rem, 10%);
 }
 .Layer__ProfitAndLossDetailReport .Layer__UI__Table__ProfitAndLossDetailReport {
   table-layout: fixed;
@@ -7885,7 +7896,7 @@ tbody .Layer__table__empty-row:first-child {
   grid-column: 5;
   justify-content: flex-end;
 }
-@media (max-width: 768px) {
+@container (width <= 840px) {
   .Layer__ProfitAndLossDetailReport {
     --pnl-detail-table-cols: minmax(4rem, 25%) minmax(8rem, 55%) minmax(4rem, 20%);
   }

package/dist/index.d.ts

@@ -6084,14 +6084,15 @@ declare module '@layerfi/components/components/ui/Modal/ModalSlots' {
       onClose?: () => void;
   };
   export const ModalTitleWithClose: import("react").ForwardRefExoticComponent<ModalTitleWithCloseProps & import("react").RefAttributes<HTMLDivElement>>;
-  export const ModalHeading: import("react").ForwardRefExoticComponent<Omit<Omit<Omit<Omit<import("react-aria-components").HeadingProps & import("react").RefAttributes<HTMLHeadingElement>, "className"> & {
+  export const ModalHeading: import("react").ForwardRefExoticComponent<Omit<Omit<import("react-aria-components").HeadingProps & {
       align?: "center";
       pbe?: import("@layerfi/components/components/ui/sharedUITypes").Spacing;
       pie?: import("@layerfi/components/components/ui/sharedUITypes").Spacing;
       size?: "2xs" | "xs" | "sm" | "lg" | "xl";
       variant?: "subtle";
       weight?: "normal" | "bold";
-  }, "ref"> & import("react").RefAttributes<HTMLHeadingElement>, "slot" | "level">, "ref"> & import("react").RefAttributes<HTMLHeadingElement>>;
+      ellipsis?: true;
+  } & import("react").RefAttributes<HTMLHeadingElement>, "slot" | "level">, "ref"> & import("react").RefAttributes<HTMLHeadingElement>>;
   export const ModalDescription: import("react").ForwardRefExoticComponent<Omit<Omit<Pick<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, "ref">, "id" | "slot"> & {
       nonAria?: true;
   } & import("@layerfi/components/components/ui/Typography/Text").TextStyleProps & {
@@ -6240,6 +6241,7 @@ declare module '@layerfi/components/components/ui/TagGroup/TagGroup' {
 
 }
 declare module '@layerfi/components/components/ui/Typography/Heading' {
+  import { HeadingProps as ReactAriaHeadingProps } from 'react-aria-components';
   import type { Spacing } from '@layerfi/components/components/ui/sharedUITypes';
   type HeadingDataProps = {
       align?: 'center';
@@ -6248,8 +6250,9 @@ declare module '@layerfi/components/components/ui/Typography/Heading' {
       size?: '2xs' | 'xs' | 'sm' | 'lg' | 'xl';
       variant?: 'subtle';
       weight?: 'normal' | 'bold';
+      ellipsis?: true;
   };
-  const Heading: import("react").ForwardRefExoticComponent<Omit<Omit<import("react-aria-components").HeadingProps & import("react").RefAttributes<HTMLHeadingElement>, "className"> & HeadingDataProps, "ref"> & import("react").RefAttributes<HTMLHeadingElement>>;
+  const Heading: import("react").ForwardRefExoticComponent<ReactAriaHeadingProps & HeadingDataProps & import("react").RefAttributes<HTMLHeadingElement>>;
   export { Heading };
 
 }
@@ -7221,6 +7224,11 @@ declare module '@layerfi/components/features/customers/components/CustomerSelect
   export function CustomerSelector({ selectedCustomer, onSelectedCustomerChange, placeholder, isReadOnly, inline, className, }: CustomerSelectorProps): import("react/jsx-runtime").JSX.Element;
   export {};
 
+}
+declare module '@layerfi/components/features/customers/util' {
+  import type { Customer } from '@layerfi/components/schemas/customer';
+  export function getCustomerName(customer?: Customer | null): string;
+
 }
 declare module '@layerfi/components/features/forms/components/BaseFormTextField' {
   import type { PropsWithChildren } from 'react';
@@ -11325,6 +11333,7 @@ declare module '@layerfi/components/hooks/useProfitAndLoss/schemas' {
 }
 declare module '@layerfi/components/hooks/useProfitAndLoss/useProfitAndLoss' {
   import { ReportingBasis, SortDirection } from '@layerfi/components/types';
+  import { type PnlChartLineItem } from '@layerfi/components/utils/profitAndLossUtils';
   export type Scope = 'expenses' | 'revenue';
   export type SidebarScope = Scope | undefined;
   export type PnlTagFilter = {
@@ -11426,9 +11435,9 @@ declare module '@layerfi/components/hooks/useProfitAndLoss/useProfitAndLoss' {
               readonly lineItems: readonly import("@layerfi/components/utils/schema/utils").LineItem[];
           } | null;
       } | undefined;
-      filteredDataRevenue: never[] | import("@layerfi/components/utils/profitAndLossUtils").PnlChartLineItem[];
+      filteredDataRevenue: never[] | PnlChartLineItem[];
       filteredTotalRevenue: number | undefined;
-      filteredDataExpenses: never[] | import("@layerfi/components/utils/profitAndLossUtils").PnlChartLineItem[];
+      filteredDataExpenses: never[] | PnlChartLineItem[];
       filteredTotalExpenses: number | undefined;
       isLoading: boolean;
       isValidating: boolean;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@layerfi/components",
-  "version": "0.1.108-alpha.1",
+  "version": "0.1.108",
   "description": "Layer React Components",
   "main": "dist/cjs/index.cjs",
   "module": "dist/esm/index.mjs",