@invopop/popui 0.1.84 → 0.1.86

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -12,6 +12,7 @@
12
12
  focusedRowIndex,
13
13
  loading = false,
14
14
  onRowClick,
15
+ onFocusRow,
15
16
  getRowClassName,
16
17
  getRowState,
17
18
  StickyCellWrapper
@@ -21,8 +22,9 @@
21
22
  const isError = $derived(rowState?.isError ?? false)
22
23
  const isSuccess = $derived(rowState?.isSuccess ?? false)
23
24
  const isWarning = $derived(rowState?.isWarning ?? false)
25
+ const isSelected = $derived(rowState?.isSelected ?? false)
24
26
  const dataState = $derived.by(() => {
25
- if (row.getIsSelected()) return 'selected'
27
+ if (row.getIsSelected() || isSelected) return 'selected'
26
28
  if (isError) return 'error'
27
29
  if (isWarning) return 'warning'
28
30
  if (isSuccess) return 'success'
@@ -41,7 +43,11 @@
41
43
  }),
42
44
  getRowClassName?.(row.original as TData)
43
45
  )}
44
- onclick={() => !loading && onRowClick?.(row.original as TData)}
46
+ onclick={() => {
47
+ if (loading) return
48
+ onFocusRow?.()
49
+ onRowClick?.(row.original as TData)
50
+ }}
45
51
  >
46
52
  {#each row.getVisibleCells() as cell, index (cell.id)}
47
53
  <DataTableCell
@@ -102,11 +102,13 @@ export interface DataTableRowProps<TData> {
102
102
  focusedRowIndex: number;
103
103
  loading?: boolean;
104
104
  onRowClick?: (row: TData) => void;
105
+ onFocusRow?: () => void;
105
106
  getRowClassName?: (row: TData) => string;
106
107
  getRowState?: (row: TData) => {
107
108
  isSuccess?: boolean;
108
109
  isError?: boolean;
109
110
  isWarning?: boolean;
111
+ isSelected?: boolean;
110
112
  };
111
113
  StickyCellWrapper: StickyCellWrapperSnippet;
112
114
  }
@@ -133,6 +135,7 @@ export interface DataTableProps<TData> {
133
135
  pageSizeOptions?: number[];
134
136
  emptyState?: Omit<EmptyStateProps, 'children' | 'check'>;
135
137
  onRowClick?: (row: TData) => void;
138
+ onRowFocus?: (row: TData) => void;
136
139
  onSelectionChange?: (selectedRows: TData[]) => void;
137
140
  filters?: Snippet;
138
141
  paginationSlot?: Snippet;
@@ -154,6 +157,7 @@ export interface DataTableProps<TData> {
154
157
  isSuccess?: boolean;
155
158
  isError?: boolean;
156
159
  isWarning?: boolean;
160
+ isSelected?: boolean;
157
161
  };
158
162
  }
159
163
  export interface DateCellConfig {
@@ -60,6 +60,7 @@
60
60
  description: 'Try adjusting your filters or search query'
61
61
  },
62
62
  onRowClick,
63
+ onRowFocus,
63
64
  onSelectionChange,
64
65
  filters,
65
66
  paginationSlot,
@@ -159,6 +160,14 @@
159
160
  }
160
161
  })
161
162
 
163
+ // Track focused row changes (keyboard navigation or row click)
164
+ $effect(() => {
165
+ if (!onRowFocus || focusedRowIndex < 0) return
166
+ const rows = table.getRowModel().rows
167
+ const focusedRow = rows[focusedRowIndex]
168
+ if (focusedRow) onRowFocus(focusedRow.original)
169
+ })
170
+
162
171
  // Track column order changes
163
172
  $effect(() => {
164
173
  if (onColumnOrderChange && columnOrder.length > 0) {
@@ -410,6 +419,7 @@
410
419
  {focusedRowIndex}
411
420
  {loading}
412
421
  {onRowClick}
422
+ onFocusRow={() => (focusedRowIndex = rowIndex)}
413
423
  {getRowClassName}
414
424
  {getRowState}
415
425
  {StickyCellWrapper}
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@invopop/popui",
3
3
  "license": "MIT",
4
- "version": "0.1.84",
4
+ "version": "0.1.86",
5
5
  "repository": {
6
6
  "url": "https://github.com/invopop/popui"
7
7
  },