baaz-custom-components 5.1.2 → 5.2.0

package/dist/index.css

@@ -392,6 +392,9 @@
   .-mx-1 {
     margin-inline: calc(var(--spacing) * -1);
   }
+  .mx-1 {
+    margin-inline: calc(var(--spacing) * 1);
+  }
   .mx-2 {
     margin-inline: calc(var(--spacing) * 2);
   }
@@ -573,6 +576,9 @@
   .min-h-0 {
     min-height: calc(var(--spacing) * 0);
   }
+  .min-h-\[48px\] {
+    min-height: 48px;
+  }
   .\!w-0 {
     width: calc(var(--spacing) * 0) !important;
   }
@@ -645,6 +651,9 @@
   .w-max {
     width: max-content;
   }
+  .w-px {
+    width: 1px;
+  }
   .max-w-\(--skeleton-width\) {
     max-width: var(--skeleton-width);
   }
@@ -746,6 +755,9 @@
   .touch-none {
     touch-action: none;
   }
+  .resize {
+    resize: both;
+  }
   .scroll-my-1 {
     scroll-margin-block: calc(var(--spacing) * 1);
   }
@@ -826,6 +838,9 @@
   .overflow-y-auto {
     overflow-y: auto;
   }
+  .rounded {
+    border-radius: 0.25rem;
+  }
   .rounded-\[2px\] {
     border-radius: 2px;
   }
@@ -1015,6 +1030,12 @@
       background-color: color-mix(in oklab, var(--primary) 30%, transparent);
     }
   }
+  .bg-primary\/90 {
+    background-color: var(--primary);
+    @supports (color: color-mix(in lab, red, red)) {
+      background-color: color-mix(in oklab, var(--primary) 90%, transparent);
+    }
+  }
   .bg-red-700 {
     background-color: var(--color-red-700);
   }
@@ -1054,6 +1075,9 @@
   .p-1 {
     padding: calc(var(--spacing) * 1);
   }
+  .p-1\.5 {
+    padding: calc(var(--spacing) * 1.5);
+  }
   .p-2 {
     padding: calc(var(--spacing) * 2);
   }
@@ -1315,6 +1339,9 @@
     -webkit-font-smoothing: antialiased;
     -moz-osx-font-smoothing: grayscale;
   }
+  .accent-primary {
+    accent-color: var(--primary);
+  }
   .opacity-0 {
     opacity: 0%;
   }
@@ -1563,6 +1590,12 @@
     --tw-enter-scale: calc(95*1%);
     --tw-enter-scale: .95;
   }
+  .fade-in {
+    --tw-enter-opacity: 0;
+  }
+  .slide-in-from-left-2 {
+    --tw-enter-translate-x: calc(2*var(--spacing)*-1);
+  }
   .group-focus-within\/menu-item\:opacity-100 {
     &:is(:where(.group\/menu-item):focus-within *) {
       opacity: 100%;
@@ -1970,6 +2003,13 @@
       }
     }
   }
+  .hover\:bg-primary {
+    &:hover {
+      @media (hover: hover) {
+        background-color: var(--primary);
+      }
+    }
+  }
   .hover\:bg-primary\/90 {
     &:hover {
       @media (hover: hover) {
@@ -2106,6 +2146,17 @@
       color: var(--accent-foreground);
     }
   }
+  .focus\:ring-1 {
+    &:focus {
+      --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
+      box-shadow:
+        var(--tw-inset-shadow),
+        var(--tw-inset-ring-shadow),
+        var(--tw-ring-offset-shadow),
+        var(--tw-ring-shadow),
+        var(--tw-shadow);
+    }
+  }
   .focus\:ring-2 {
     &:focus {
       --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
@@ -2117,6 +2168,11 @@
         var(--tw-shadow);
     }
   }
+  .focus\:ring-primary {
+    &:focus {
+      --tw-ring-color: var(--primary);
+    }
+  }
   .focus\:ring-ring {
     &:focus {
       --tw-ring-color: var(--ring);

package/dist/index.d.mts

@@ -1,5 +1,5 @@
 import * as react from 'react';
-import { ReactNode } from 'react';
+import react__default, { ReactNode } from 'react';
 import { IApi } from '@svar-ui/react-grid';
 
 type NavbarData = NavbarEntry[];
@@ -84,11 +84,11 @@ type Filters = {
     }[];
 };
 type GridProps = {
-    data: Record<string, any>[];
+    data: AnyRow[];
+    select?: boolean;
     columns: GridColumn[];
     sortKey?: string | null;
     sortOrder?: SortOrder | null;
-    onSortChange?: (key: string, order: SortOrder) => void;
     multiselect?: boolean;
     reorder?: boolean;
     overlay?: React.FC | string;
@@ -102,14 +102,20 @@ type GridProps = {
     searchkey: string;
     searchValue: string;
     loading: boolean;
+    filterList: Filters[];
+    initialFilters?: any[];
+    children?: React.ReactNode;
+    onSortChange?: (key: string, order: SortOrder) => void;
     onExportPdf?: () => void;
     onExportExcel?: () => void;
     onSearch: (e: React.ChangeEvent<HTMLInputElement>) => void;
-    filterList: Filters[];
     onFilterChange?: (payload: MultiFilterPayload) => void;
     onApiReady?: (api: IApi) => void;
-    initialFilters?: any[];
-    children?: React.ReactNode;
+    onFocusCell?: (params: {
+        row?: string | number;
+        column?: string | number;
+        eventSource?: string;
+    }) => boolean | void;
 };
 type FilterCondition = ActiveFilter & {
     id: string;
@@ -131,7 +137,32 @@ type ActiveFilter = {
     value?: FilterValue;
 };
 
-declare const Grid: react.ForwardRefExoticComponent<GridProps & react.RefAttributes<IApi | null>>;
+type RowId = string | number;
+type AnyRow = {
+    id: RowId;
+    [key: string]: any;
+};
+interface SelectionAction {
+    id: string;
+    label: string;
+    icon?: react__default.ReactNode;
+    needsConfirmation?: boolean;
+}
+interface GridSelectionProps {
+    selectionEnabled?: boolean;
+    selectedIds?: RowId[];
+    onRowSelectionChange?: (id: RowId, rowData: AnyRow, checked: boolean) => void;
+    onSelectAllPage?: (pageData: AnyRow[], checked: boolean) => void;
+}
+interface GridHeaderSelectionProps {
+    selectedCount?: number;
+    selectedData?: AnyRow[];
+    selectionActions?: SelectionAction[];
+    onSelectionAction?: (actionId: string, selectedData: AnyRow[]) => void;
+    onClearSelection?: () => void;
+}
+
+declare const Grid: react.ForwardRefExoticComponent<GridProps & GridSelectionProps & GridHeaderSelectionProps & react.RefAttributes<IApi | null>>;
 
 type Props = {
     cell: {
@@ -142,7 +173,7 @@ type Props = {
     sortOrder?: SortOrder | null;
     onSortChange?: (key: string, order: SortOrder) => void;
 };
-declare function SortableHeaderCell({ cell, sortKey, sortOrder, onSortChange }: Props): react.JSX.Element;
+declare const _default: react__default.MemoExoticComponent<({ cell, sortKey, sortOrder, onSortChange }: Props) => react__default.JSX.Element>;
 
 type Pagination$1 = {
     totalCount: number;
@@ -176,4 +207,4 @@ interface SlideToolbarProps {
 
 declare const SlideToolbar: React.FC<SlideToolbarProps>;
 
-export { type BreadcrumbProps, CustomBreadcrumb, Grid, type GridProps, Navbar, type NavbarData, type NavbarEntry, type NavbarProps, type NotificationDataTypes, Pagination, type Pagination$1 as PaginationProps, type RouteTree, type RouterAdapter, SlideToolbar, type SlideToolbarProps, SortableHeaderCell, type ToolbarItem, type UserData };
+export { type BreadcrumbProps, CustomBreadcrumb, Grid, type GridProps, Navbar, type NavbarData, type NavbarEntry, type NavbarProps, type NotificationDataTypes, Pagination, type Pagination$1 as PaginationProps, type RouteTree, type RouterAdapter, SlideToolbar, type SlideToolbarProps, _default as SortableHeaderCell, type ToolbarItem, type UserData };

package/dist/index.d.ts

@@ -1,5 +1,5 @@
 import * as react from 'react';
-import { ReactNode } from 'react';
+import react__default, { ReactNode } from 'react';
 import { IApi } from '@svar-ui/react-grid';
 
 type NavbarData = NavbarEntry[];
@@ -84,11 +84,11 @@ type Filters = {
     }[];
 };
 type GridProps = {
-    data: Record<string, any>[];
+    data: AnyRow[];
+    select?: boolean;
     columns: GridColumn[];
     sortKey?: string | null;
     sortOrder?: SortOrder | null;
-    onSortChange?: (key: string, order: SortOrder) => void;
     multiselect?: boolean;
     reorder?: boolean;
     overlay?: React.FC | string;
@@ -102,14 +102,20 @@ type GridProps = {
     searchkey: string;
     searchValue: string;
     loading: boolean;
+    filterList: Filters[];
+    initialFilters?: any[];
+    children?: React.ReactNode;
+    onSortChange?: (key: string, order: SortOrder) => void;
     onExportPdf?: () => void;
     onExportExcel?: () => void;
     onSearch: (e: React.ChangeEvent<HTMLInputElement>) => void;
-    filterList: Filters[];
     onFilterChange?: (payload: MultiFilterPayload) => void;
     onApiReady?: (api: IApi) => void;
-    initialFilters?: any[];
-    children?: React.ReactNode;
+    onFocusCell?: (params: {
+        row?: string | number;
+        column?: string | number;
+        eventSource?: string;
+    }) => boolean | void;
 };
 type FilterCondition = ActiveFilter & {
     id: string;
@@ -131,7 +137,32 @@ type ActiveFilter = {
     value?: FilterValue;
 };
 
-declare const Grid: react.ForwardRefExoticComponent<GridProps & react.RefAttributes<IApi | null>>;
+type RowId = string | number;
+type AnyRow = {
+    id: RowId;
+    [key: string]: any;
+};
+interface SelectionAction {
+    id: string;
+    label: string;
+    icon?: react__default.ReactNode;
+    needsConfirmation?: boolean;
+}
+interface GridSelectionProps {
+    selectionEnabled?: boolean;
+    selectedIds?: RowId[];
+    onRowSelectionChange?: (id: RowId, rowData: AnyRow, checked: boolean) => void;
+    onSelectAllPage?: (pageData: AnyRow[], checked: boolean) => void;
+}
+interface GridHeaderSelectionProps {
+    selectedCount?: number;
+    selectedData?: AnyRow[];
+    selectionActions?: SelectionAction[];
+    onSelectionAction?: (actionId: string, selectedData: AnyRow[]) => void;
+    onClearSelection?: () => void;
+}
+
+declare const Grid: react.ForwardRefExoticComponent<GridProps & GridSelectionProps & GridHeaderSelectionProps & react.RefAttributes<IApi | null>>;
 
 type Props = {
     cell: {
@@ -142,7 +173,7 @@ type Props = {
     sortOrder?: SortOrder | null;
     onSortChange?: (key: string, order: SortOrder) => void;
 };
-declare function SortableHeaderCell({ cell, sortKey, sortOrder, onSortChange }: Props): react.JSX.Element;
+declare const _default: react__default.MemoExoticComponent<({ cell, sortKey, sortOrder, onSortChange }: Props) => react__default.JSX.Element>;
 
 type Pagination$1 = {
     totalCount: number;
@@ -176,4 +207,4 @@ interface SlideToolbarProps {
 
 declare const SlideToolbar: React.FC<SlideToolbarProps>;
 
-export { type BreadcrumbProps, CustomBreadcrumb, Grid, type GridProps, Navbar, type NavbarData, type NavbarEntry, type NavbarProps, type NotificationDataTypes, Pagination, type Pagination$1 as PaginationProps, type RouteTree, type RouterAdapter, SlideToolbar, type SlideToolbarProps, SortableHeaderCell, type ToolbarItem, type UserData };
+export { type BreadcrumbProps, CustomBreadcrumb, Grid, type GridProps, Navbar, type NavbarData, type NavbarEntry, type NavbarProps, type NotificationDataTypes, Pagination, type Pagination$1 as PaginationProps, type RouteTree, type RouterAdapter, SlideToolbar, type SlideToolbarProps, _default as SortableHeaderCell, type ToolbarItem, type UserData };