compote-ui 0.81.1 → 0.83.0

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.
Files changed (14) hide show
  1. package/dist/components/data-table-v9/create-table.svelte.d.ts +0 -14
  2. package/dist/components/data-table-v9/data-table-utils.d.ts +0 -14
  3. package/dist/components/data-table-v9/data-table.svelte +6 -1
  4. package/dist/components/data-table-v9/data-table.svelte.d.ts +3 -0
  5. package/dist/components/data-table-v9/features.d.ts +0 -14
  6. package/dist/components/data-table-v9/features.js +18 -3
  7. package/dist/components/data-table-v9/table-view-state.svelte.d.ts +0 -56
  8. package/dist/components/data-table-v9/virtual/data-table-virtual-rows.svelte +13 -4
  9. package/dist/components/data-table-v9/virtual/data-table-virtual-rows.svelte.d.ts +2 -0
  10. package/dist/components/data-table-v9/virtual/data-table-virtualized.svelte +4 -0
  11. package/dist/components/data-table-v9/virtual/data-table-virtualized.svelte.d.ts +2 -0
  12. package/dist/components/image-cropper/image-cropper.svelte +3 -3
  13. package/package.json +14 -14
  14. package/skills/data-table/references/column-options.md +2 -0
package/dist/components/data-table-v9/create-table.svelte.d.ts CHANGED
@@ -45,30 +45,16 @@ export declare function createTable<T extends RowData>(options: CreateDataTableO
45
45
  facetedMinMaxValues: (table: import("@tanstack/table-core").Table<import("@tanstack/table-core").TableFeatures, any>, columnId: string) => () => undefined | [number, number];
46
46
  sortFns: {
47
47
  alphanumeric: import("@tanstack/table-core").CreatedSortFn<any, any>;
48
- alphanumericCaseSensitive: import("@tanstack/table-core").CreatedSortFn<any, any>;
49
48
  basic: import("@tanstack/table-core").CreatedSortFn<any, any>;
50
49
  datetime: import("@tanstack/table-core").CreatedSortFn<any, any>;
51
50
  text: import("@tanstack/table-core").CreatedSortFn<any, any>;
52
- textCaseSensitive: import("@tanstack/table-core").CreatedSortFn<any, any>;
53
51
  };
54
52
  filterFns: {
55
53
  arrIncludes: import("@tanstack/table-core").CreatedFilterFn<any, any>;
56
- arrIncludesAll: import("@tanstack/table-core").CreatedFilterFn<any, any>;
57
- arrHas: import("@tanstack/table-core").CreatedFilterFn<any, any>;
58
- arrIncludesSome: import("@tanstack/table-core").CreatedFilterFn<any, any>;
59
- between: import("@tanstack/table-core").CreatedFilterFn<any, any>;
60
- betweenInclusive: import("@tanstack/table-core").CreatedFilterFn<any, any>;
61
- empty: import("@tanstack/table-core").CreatedFilterFn<any, any>;
62
- endsWith: import("@tanstack/table-core").CreatedFilterFn<any, any>;
63
54
  equals: import("@tanstack/table-core").CreatedFilterFn<any, any>;
64
- equalsString: import("@tanstack/table-core").CreatedFilterFn<any, any>;
65
- equalsStringSensitive: import("@tanstack/table-core").CreatedFilterFn<any, any>;
66
55
  inDateRange: import("@tanstack/table-core").CreatedFilterFn<any, any>;
67
56
  inNumberRange: import("@tanstack/table-core").CreatedFilterFn<any, any>;
68
57
  includesString: import("@tanstack/table-core").CreatedFilterFn<any, any>;
69
- includesStringSensitive: import("@tanstack/table-core").CreatedFilterFn<any, any>;
70
- notEmpty: import("@tanstack/table-core").CreatedFilterFn<any, any>;
71
- startsWith: import("@tanstack/table-core").CreatedFilterFn<any, any>;
72
58
  weakEquals: import("@tanstack/table-core").CreatedFilterFn<any, any>;
73
59
  };
74
60
  columnMeta: DataTableColumnMeta;
package/dist/components/data-table-v9/data-table-utils.d.ts CHANGED
@@ -39,30 +39,16 @@ export declare function getRowCells<T extends RowData>(row: Row<DataTableFeature
39
39
  facetedMinMaxValues: (table: import("@tanstack/table-core").Table<import("@tanstack/table-core").TableFeatures, any>, columnId: string) => () => undefined | [number, number];
40
40
  sortFns: {
41
41
  alphanumeric: import("@tanstack/table-core").CreatedSortFn<any, any>;
42
- alphanumericCaseSensitive: import("@tanstack/table-core").CreatedSortFn<any, any>;
43
42
  basic: import("@tanstack/table-core").CreatedSortFn<any, any>;
44
43
  datetime: import("@tanstack/table-core").CreatedSortFn<any, any>;
45
44
  text: import("@tanstack/table-core").CreatedSortFn<any, any>;
46
- textCaseSensitive: import("@tanstack/table-core").CreatedSortFn<any, any>;
47
45
  };
48
46
  filterFns: {
49
47
  arrIncludes: import("@tanstack/table-core").CreatedFilterFn<any, any>;
50
- arrIncludesAll: import("@tanstack/table-core").CreatedFilterFn<any, any>;
51
- arrHas: import("@tanstack/table-core").CreatedFilterFn<any, any>;
52
- arrIncludesSome: import("@tanstack/table-core").CreatedFilterFn<any, any>;
53
- between: import("@tanstack/table-core").CreatedFilterFn<any, any>;
54
- betweenInclusive: import("@tanstack/table-core").CreatedFilterFn<any, any>;
55
- empty: import("@tanstack/table-core").CreatedFilterFn<any, any>;
56
- endsWith: import("@tanstack/table-core").CreatedFilterFn<any, any>;
57
48
  equals: import("@tanstack/table-core").CreatedFilterFn<any, any>;
58
- equalsString: import("@tanstack/table-core").CreatedFilterFn<any, any>;
59
- equalsStringSensitive: import("@tanstack/table-core").CreatedFilterFn<any, any>;
60
49
  inDateRange: import("@tanstack/table-core").CreatedFilterFn<any, any>;
61
50
  inNumberRange: import("@tanstack/table-core").CreatedFilterFn<any, any>;
62
51
  includesString: import("@tanstack/table-core").CreatedFilterFn<any, any>;
63
- includesStringSensitive: import("@tanstack/table-core").CreatedFilterFn<any, any>;
64
- notEmpty: import("@tanstack/table-core").CreatedFilterFn<any, any>;
65
- startsWith: import("@tanstack/table-core").CreatedFilterFn<any, any>;
66
52
  weakEquals: import("@tanstack/table-core").CreatedFilterFn<any, any>;
67
53
  };
68
54
  columnMeta: DataTableColumnMeta;
package/dist/components/data-table-v9/data-table.svelte CHANGED
@@ -26,6 +26,9 @@
26
26
  headerFilters?: boolean;
27
27
  onRowClick?: (details: { row: T; event: MouseEvent }) => void;
28
28
  onRowDoubleClick?: (details: { row: T; event: MouseEvent }) => void;
29
+ /** Extra classes for a row's `<tr>`; `row` is `row.original`. Set `--row-bg` too if the row has
30
+ * pinned or selection cells, so they match the tint. */
31
+ rowClass?: (row: T) => ClassValue;
29
32
  };
30
33
 
31
34
  let {
@@ -36,6 +39,7 @@
36
39
  headerFilters = false,
37
40
  onRowClick,
38
41
  onRowDoubleClick,
42
+ rowClass,
39
43
  ...rest
40
44
  }: Props = $props();
41
45
 
@@ -90,7 +94,8 @@
90
94
  '[--row-bg:var(--compote-surface-1)]',
91
95
  'hover:bg-well/60 hover:[--row-bg:color-mix(in_srgb,var(--compote-well)_60%,var(--compote-surface-1))]',
92
96
  rowSelected &&
93
- 'bg-well/60 [--row-bg:color-mix(in_srgb,var(--compote-well)_60%,var(--compote-surface-1))]'
97
+ 'bg-well/60 [--row-bg:color-mix(in_srgb,var(--compote-well)_60%,var(--compote-surface-1))]',
98
+ rowClass?.(row.original)
94
99
  )}
95
100
  onclick={(event) => onRowClick?.({ row: row.original, event })}
96
101
  ondblclick={(event) => onRowDoubleClick?.({ row: row.original, event })}
package/dist/components/data-table-v9/data-table.svelte.d.ts CHANGED
@@ -18,6 +18,9 @@ declare function $$render<T extends RowData>(): {
18
18
  row: T;
19
19
  event: MouseEvent;
20
20
  }) => void;
21
+ /** Extra classes for a row's `<tr>`; `row` is `row.original`. Set `--row-bg` too if the row has
22
+ * pinned or selection cells, so they match the tint. */
23
+ rowClass?: (row: T) => ClassValue;
21
24
  };
22
25
  exports: {};
23
26
  bindings: "";
package/dist/components/data-table-v9/features.d.ts CHANGED
@@ -16,30 +16,16 @@ export declare const dataTableFeatures: {
16
16
  facetedMinMaxValues: (table: import("@tanstack/table-core").Table<import("@tanstack/table-core").TableFeatures, any>, columnId: string) => () => undefined | [number, number];
17
17
  sortFns: {
18
18
  alphanumeric: import("@tanstack/table-core").CreatedSortFn<any, any>;
19
- alphanumericCaseSensitive: import("@tanstack/table-core").CreatedSortFn<any, any>;
20
19
  basic: import("@tanstack/table-core").CreatedSortFn<any, any>;
21
20
  datetime: import("@tanstack/table-core").CreatedSortFn<any, any>;
22
21
  text: import("@tanstack/table-core").CreatedSortFn<any, any>;
23
- textCaseSensitive: import("@tanstack/table-core").CreatedSortFn<any, any>;
24
22
  };
25
23
  filterFns: {
26
24
  arrIncludes: import("@tanstack/table-core").CreatedFilterFn<any, any>;
27
- arrIncludesAll: import("@tanstack/table-core").CreatedFilterFn<any, any>;
28
- arrHas: import("@tanstack/table-core").CreatedFilterFn<any, any>;
29
- arrIncludesSome: import("@tanstack/table-core").CreatedFilterFn<any, any>;
30
- between: import("@tanstack/table-core").CreatedFilterFn<any, any>;
31
- betweenInclusive: import("@tanstack/table-core").CreatedFilterFn<any, any>;
32
- empty: import("@tanstack/table-core").CreatedFilterFn<any, any>;
33
- endsWith: import("@tanstack/table-core").CreatedFilterFn<any, any>;
34
25
  equals: import("@tanstack/table-core").CreatedFilterFn<any, any>;
35
- equalsString: import("@tanstack/table-core").CreatedFilterFn<any, any>;
36
- equalsStringSensitive: import("@tanstack/table-core").CreatedFilterFn<any, any>;
37
26
  inDateRange: import("@tanstack/table-core").CreatedFilterFn<any, any>;
38
27
  inNumberRange: import("@tanstack/table-core").CreatedFilterFn<any, any>;
39
28
  includesString: import("@tanstack/table-core").CreatedFilterFn<any, any>;
40
- includesStringSensitive: import("@tanstack/table-core").CreatedFilterFn<any, any>;
41
- notEmpty: import("@tanstack/table-core").CreatedFilterFn<any, any>;
42
- startsWith: import("@tanstack/table-core").CreatedFilterFn<any, any>;
43
29
  weakEquals: import("@tanstack/table-core").CreatedFilterFn<any, any>;
44
30
  };
45
31
  columnMeta: DataTableColumnMeta;
package/dist/components/data-table-v9/features.js CHANGED
@@ -1,4 +1,4 @@
1
- import { tableFeatures, metaHelper, rowSortingFeature, rowSelectionFeature, columnFilteringFeature, columnFacetingFeature, globalFilteringFeature, columnVisibilityFeature, columnPinningFeature, columnSizingFeature, columnResizingFeature, createSortedRowModel, createFilteredRowModel, createFacetedRowModel, createFacetedUniqueValues, createFacetedMinMaxValues, sortFns, filterFns } from '@tanstack/svelte-table';
1
+ import { tableFeatures, metaHelper, rowSortingFeature, rowSelectionFeature, columnFilteringFeature, columnFacetingFeature, globalFilteringFeature, columnVisibilityFeature, columnPinningFeature, columnSizingFeature, columnResizingFeature, createSortedRowModel, createFilteredRowModel, createFacetedRowModel, createFacetedUniqueValues, createFacetedMinMaxValues, sortFn_alphanumeric, sortFn_basic, sortFn_datetime, sortFn_text, filterFn_arrIncludes, filterFn_equals, filterFn_inDateRange, filterFn_inNumberRange, filterFn_includesString, filterFn_weakEquals } from '@tanstack/svelte-table';
2
2
  // Fixed feature registry for the data table. Declared once at module scope so the
3
3
  // reference is stable across instances (v9 requires a stable `features` object).
4
4
  export const dataTableFeatures = tableFeatures({
@@ -16,8 +16,23 @@ export const dataTableFeatures = tableFeatures({
16
16
  facetedRowModel: createFacetedRowModel(),
17
17
  facetedUniqueValues: createFacetedUniqueValues(),
18
18
  facetedMinMaxValues: createFacetedMinMaxValues(),
19
- sortFns,
20
- filterFns,
19
+ // Only the sort fns `sortFn: 'auto'` can resolve to; `sortFn` is not a public column option.
20
+ sortFns: {
21
+ alphanumeric: sortFn_alphanumeric,
22
+ basic: sortFn_basic,
23
+ datetime: sortFn_datetime,
24
+ text: sortFn_text
25
+ },
26
+ // Only the filter fns the data table uses: the type defaults plus what `filterFn: 'auto'`
27
+ // resolves to for text columns.
28
+ filterFns: {
29
+ arrIncludes: filterFn_arrIncludes,
30
+ equals: filterFn_equals,
31
+ inDateRange: filterFn_inDateRange,
32
+ inNumberRange: filterFn_inNumberRange,
33
+ includesString: filterFn_includesString,
34
+ weakEquals: filterFn_weakEquals
35
+ },
21
36
  // Type-only slot: types `columnDef.meta` as DataTableColumnMeta wherever
22
37
  // DataTableFeatures flows. Stripped at runtime by constructTable.
23
38
  columnMeta: metaHelper()
package/dist/components/data-table-v9/table-view-state.svelte.d.ts CHANGED
@@ -37,30 +37,16 @@ export declare function createTableViewState<T extends RowData>(getTable: () =>
37
37
  facetedMinMaxValues: (table: import("@tanstack/table-core").Table<import("@tanstack/table-core").TableFeatures, any>, columnId: string) => () => undefined | [number, number];
38
38
  sortFns: {
39
39
  alphanumeric: import("@tanstack/table-core").CreatedSortFn<any, any>;
40
- alphanumericCaseSensitive: import("@tanstack/table-core").CreatedSortFn<any, any>;
41
40
  basic: import("@tanstack/table-core").CreatedSortFn<any, any>;
42
41
  datetime: import("@tanstack/table-core").CreatedSortFn<any, any>;
43
42
  text: import("@tanstack/table-core").CreatedSortFn<any, any>;
44
- textCaseSensitive: import("@tanstack/table-core").CreatedSortFn<any, any>;
45
43
  };
46
44
  filterFns: {
47
45
  arrIncludes: import("@tanstack/table-core").CreatedFilterFn<any, any>;
48
- arrIncludesAll: import("@tanstack/table-core").CreatedFilterFn<any, any>;
49
- arrHas: import("@tanstack/table-core").CreatedFilterFn<any, any>;
50
- arrIncludesSome: import("@tanstack/table-core").CreatedFilterFn<any, any>;
51
- between: import("@tanstack/table-core").CreatedFilterFn<any, any>;
52
- betweenInclusive: import("@tanstack/table-core").CreatedFilterFn<any, any>;
53
- empty: import("@tanstack/table-core").CreatedFilterFn<any, any>;
54
- endsWith: import("@tanstack/table-core").CreatedFilterFn<any, any>;
55
46
  equals: import("@tanstack/table-core").CreatedFilterFn<any, any>;
56
- equalsString: import("@tanstack/table-core").CreatedFilterFn<any, any>;
57
- equalsStringSensitive: import("@tanstack/table-core").CreatedFilterFn<any, any>;
58
47
  inDateRange: import("@tanstack/table-core").CreatedFilterFn<any, any>;
59
48
  inNumberRange: import("@tanstack/table-core").CreatedFilterFn<any, any>;
60
49
  includesString: import("@tanstack/table-core").CreatedFilterFn<any, any>;
61
- includesStringSensitive: import("@tanstack/table-core").CreatedFilterFn<any, any>;
62
- notEmpty: import("@tanstack/table-core").CreatedFilterFn<any, any>;
63
- startsWith: import("@tanstack/table-core").CreatedFilterFn<any, any>;
64
50
  weakEquals: import("@tanstack/table-core").CreatedFilterFn<any, any>;
65
51
  };
66
52
  columnMeta: import("./types").DataTableColumnMeta;
@@ -82,30 +68,16 @@ export declare function createTableViewState<T extends RowData>(getTable: () =>
82
68
  facetedMinMaxValues: (table: import("@tanstack/table-core").Table<import("@tanstack/table-core").TableFeatures, any>, columnId: string) => () => undefined | [number, number];
83
69
  sortFns: {
84
70
  alphanumeric: import("@tanstack/table-core").CreatedSortFn<any, any>;
85
- alphanumericCaseSensitive: import("@tanstack/table-core").CreatedSortFn<any, any>;
86
71
  basic: import("@tanstack/table-core").CreatedSortFn<any, any>;
87
72
  datetime: import("@tanstack/table-core").CreatedSortFn<any, any>;
88
73
  text: import("@tanstack/table-core").CreatedSortFn<any, any>;
89
- textCaseSensitive: import("@tanstack/table-core").CreatedSortFn<any, any>;
90
74
  };
91
75
  filterFns: {
92
76
  arrIncludes: import("@tanstack/table-core").CreatedFilterFn<any, any>;
93
- arrIncludesAll: import("@tanstack/table-core").CreatedFilterFn<any, any>;
94
- arrHas: import("@tanstack/table-core").CreatedFilterFn<any, any>;
95
- arrIncludesSome: import("@tanstack/table-core").CreatedFilterFn<any, any>;
96
- between: import("@tanstack/table-core").CreatedFilterFn<any, any>;
97
- betweenInclusive: import("@tanstack/table-core").CreatedFilterFn<any, any>;
98
- empty: import("@tanstack/table-core").CreatedFilterFn<any, any>;
99
- endsWith: import("@tanstack/table-core").CreatedFilterFn<any, any>;
100
77
  equals: import("@tanstack/table-core").CreatedFilterFn<any, any>;
101
- equalsString: import("@tanstack/table-core").CreatedFilterFn<any, any>;
102
- equalsStringSensitive: import("@tanstack/table-core").CreatedFilterFn<any, any>;
103
78
  inDateRange: import("@tanstack/table-core").CreatedFilterFn<any, any>;
104
79
  inNumberRange: import("@tanstack/table-core").CreatedFilterFn<any, any>;
105
80
  includesString: import("@tanstack/table-core").CreatedFilterFn<any, any>;
106
- includesStringSensitive: import("@tanstack/table-core").CreatedFilterFn<any, any>;
107
- notEmpty: import("@tanstack/table-core").CreatedFilterFn<any, any>;
108
- startsWith: import("@tanstack/table-core").CreatedFilterFn<any, any>;
109
81
  weakEquals: import("@tanstack/table-core").CreatedFilterFn<any, any>;
110
82
  };
111
83
  columnMeta: import("./types").DataTableColumnMeta;
@@ -128,30 +100,16 @@ export declare function createTableViewState<T extends RowData>(getTable: () =>
128
100
  facetedMinMaxValues: (table: import("@tanstack/table-core").Table<import("@tanstack/table-core").TableFeatures, any>, columnId: string) => () => undefined | [number, number];
129
101
  sortFns: {
130
102
  alphanumeric: import("@tanstack/table-core").CreatedSortFn<any, any>;
131
- alphanumericCaseSensitive: import("@tanstack/table-core").CreatedSortFn<any, any>;
132
103
  basic: import("@tanstack/table-core").CreatedSortFn<any, any>;
133
104
  datetime: import("@tanstack/table-core").CreatedSortFn<any, any>;
134
105
  text: import("@tanstack/table-core").CreatedSortFn<any, any>;
135
- textCaseSensitive: import("@tanstack/table-core").CreatedSortFn<any, any>;
136
106
  };
137
107
  filterFns: {
138
108
  arrIncludes: import("@tanstack/table-core").CreatedFilterFn<any, any>;
139
- arrIncludesAll: import("@tanstack/table-core").CreatedFilterFn<any, any>;
140
- arrHas: import("@tanstack/table-core").CreatedFilterFn<any, any>;
141
- arrIncludesSome: import("@tanstack/table-core").CreatedFilterFn<any, any>;
142
- between: import("@tanstack/table-core").CreatedFilterFn<any, any>;
143
- betweenInclusive: import("@tanstack/table-core").CreatedFilterFn<any, any>;
144
- empty: import("@tanstack/table-core").CreatedFilterFn<any, any>;
145
- endsWith: import("@tanstack/table-core").CreatedFilterFn<any, any>;
146
109
  equals: import("@tanstack/table-core").CreatedFilterFn<any, any>;
147
- equalsString: import("@tanstack/table-core").CreatedFilterFn<any, any>;
148
- equalsStringSensitive: import("@tanstack/table-core").CreatedFilterFn<any, any>;
149
110
  inDateRange: import("@tanstack/table-core").CreatedFilterFn<any, any>;
150
111
  inNumberRange: import("@tanstack/table-core").CreatedFilterFn<any, any>;
151
112
  includesString: import("@tanstack/table-core").CreatedFilterFn<any, any>;
152
- includesStringSensitive: import("@tanstack/table-core").CreatedFilterFn<any, any>;
153
- notEmpty: import("@tanstack/table-core").CreatedFilterFn<any, any>;
154
- startsWith: import("@tanstack/table-core").CreatedFilterFn<any, any>;
155
113
  weakEquals: import("@tanstack/table-core").CreatedFilterFn<any, any>;
156
114
  };
157
115
  columnMeta: import("./types").DataTableColumnMeta;
@@ -173,30 +131,16 @@ export declare function createTableViewState<T extends RowData>(getTable: () =>
173
131
  facetedMinMaxValues: (table: import("@tanstack/table-core").Table<import("@tanstack/table-core").TableFeatures, any>, columnId: string) => () => undefined | [number, number];
174
132
  sortFns: {
175
133
  alphanumeric: import("@tanstack/table-core").CreatedSortFn<any, any>;
176
- alphanumericCaseSensitive: import("@tanstack/table-core").CreatedSortFn<any, any>;
177
134
  basic: import("@tanstack/table-core").CreatedSortFn<any, any>;
178
135
  datetime: import("@tanstack/table-core").CreatedSortFn<any, any>;
179
136
  text: import("@tanstack/table-core").CreatedSortFn<any, any>;
180
- textCaseSensitive: import("@tanstack/table-core").CreatedSortFn<any, any>;
181
137
  };
182
138
  filterFns: {
183
139
  arrIncludes: import("@tanstack/table-core").CreatedFilterFn<any, any>;
184
- arrIncludesAll: import("@tanstack/table-core").CreatedFilterFn<any, any>;
185
- arrHas: import("@tanstack/table-core").CreatedFilterFn<any, any>;
186
- arrIncludesSome: import("@tanstack/table-core").CreatedFilterFn<any, any>;
187
- between: import("@tanstack/table-core").CreatedFilterFn<any, any>;
188
- betweenInclusive: import("@tanstack/table-core").CreatedFilterFn<any, any>;
189
- empty: import("@tanstack/table-core").CreatedFilterFn<any, any>;
190
- endsWith: import("@tanstack/table-core").CreatedFilterFn<any, any>;
191
140
  equals: import("@tanstack/table-core").CreatedFilterFn<any, any>;
192
- equalsString: import("@tanstack/table-core").CreatedFilterFn<any, any>;
193
- equalsStringSensitive: import("@tanstack/table-core").CreatedFilterFn<any, any>;
194
141
  inDateRange: import("@tanstack/table-core").CreatedFilterFn<any, any>;
195
142
  inNumberRange: import("@tanstack/table-core").CreatedFilterFn<any, any>;
196
143
  includesString: import("@tanstack/table-core").CreatedFilterFn<any, any>;
197
- includesStringSensitive: import("@tanstack/table-core").CreatedFilterFn<any, any>;
198
- notEmpty: import("@tanstack/table-core").CreatedFilterFn<any, any>;
199
- startsWith: import("@tanstack/table-core").CreatedFilterFn<any, any>;
200
144
  weakEquals: import("@tanstack/table-core").CreatedFilterFn<any, any>;
201
145
  };
202
146
  columnMeta: import("./types").DataTableColumnMeta;
package/dist/components/data-table-v9/virtual/data-table-virtual-rows.svelte CHANGED
@@ -2,7 +2,7 @@
2
2
  import type { RowData } from '@tanstack/svelte-table';
3
3
  import { createVirtualizer } from '@tanstack/svelte-virtual';
4
4
  import { untrack } from 'svelte';
5
- import { cn } from 'tailwind-variants';
5
+ import { cn, type ClassValue } from 'tailwind-variants';
6
6
  import type { DataTableInstance } from '../data-table-utils';
7
7
  import type { DataTableViewState } from '../table-view-state.svelte';
8
8
  import DataTableCellContent from '../data-table-cell-content.svelte';
@@ -25,10 +25,18 @@
25
25
  emptyMessage: string;
26
26
  onRowClick?: (details: { row: T; event: MouseEvent }) => void;
27
27
  onRowDoubleClick?: (details: { row: T; event: MouseEvent }) => void;
28
+ rowClass?: (row: T) => ClassValue;
28
29
  };
29
30
 
30
- let { table, view, scrollContainer, emptyMessage, onRowClick, onRowDoubleClick }: Props =
31
- $props();
31
+ let {
32
+ table,
33
+ view,
34
+ scrollContainer,
35
+ emptyMessage,
36
+ onRowClick,
37
+ onRowDoubleClick,
38
+ rowClass
39
+ }: Props = $props();
32
40
 
33
41
  const rows = $derived(view.rowModel.rows);
34
42
 
@@ -79,7 +87,8 @@
79
87
  '[--row-bg:var(--compote-surface-1)]',
80
88
  'hover:bg-well/60 hover:[--row-bg:color-mix(in_srgb,var(--compote-well)_60%,var(--compote-surface-1))]',
81
89
  rowSelected &&
82
- 'bg-well/60 [--row-bg:color-mix(in_srgb,var(--compote-well)_60%,var(--compote-surface-1))]'
90
+ 'bg-well/60 [--row-bg:color-mix(in_srgb,var(--compote-well)_60%,var(--compote-surface-1))]',
91
+ rowClass?.(row.original)
83
92
  )}
84
93
  style="display: flex; position: absolute; transform: translateY({virtualRow.start}px); width: 100%"
85
94
  onclick={(event) => onRowClick?.({ row: row.original, event })}
package/dist/components/data-table-v9/virtual/data-table-virtual-rows.svelte.d.ts CHANGED
@@ -1,4 +1,5 @@
1
1
  import type { RowData } from '@tanstack/svelte-table';
2
+ import { type ClassValue } from 'tailwind-variants';
2
3
  import type { DataTableInstance } from '../data-table-utils';
3
4
  import type { DataTableViewState } from '../table-view-state.svelte';
4
5
  declare function $$render<T extends RowData>(): {
@@ -15,6 +16,7 @@ declare function $$render<T extends RowData>(): {
15
16
  row: T;
16
17
  event: MouseEvent;
17
18
  }) => void;
19
+ rowClass?: (row: T) => ClassValue;
18
20
  };
19
21
  exports: {};
20
22
  bindings: "";
package/dist/components/data-table-v9/virtual/data-table-virtualized.svelte CHANGED
@@ -18,6 +18,8 @@
18
18
  headerFilters?: boolean;
19
19
  onRowClick?: (details: { row: T; event: MouseEvent }) => void;
20
20
  onRowDoubleClick?: (details: { row: T; event: MouseEvent }) => void;
21
+ /** Extra classes for a row's `<tr>`; `row` is `row.original`. */
22
+ rowClass?: (row: T) => ClassValue;
21
23
  };
22
24
 
23
25
  let {
@@ -28,6 +30,7 @@
28
30
  headerFilters = false,
29
31
  onRowClick,
30
32
  onRowDoubleClick,
33
+ rowClass,
31
34
  ...rest
32
35
  }: Props = $props();
33
36
 
@@ -64,6 +67,7 @@
64
67
  {emptyMessage}
65
68
  {onRowClick}
66
69
  {onRowDoubleClick}
70
+ {rowClass}
67
71
  />
68
72
  {/if}
69
73
  {#if view.hasFooter}
package/dist/components/data-table-v9/virtual/data-table-virtualized.svelte.d.ts CHANGED
@@ -18,6 +18,8 @@ declare function $$render<T extends RowData>(): {
18
18
  row: T;
19
19
  event: MouseEvent;
20
20
  }) => void;
21
+ /** Extra classes for a row's `<tr>`; `row` is `row.original`. */
22
+ rowClass?: (row: T) => ClassValue;
21
23
  };
22
24
  exports: {};
23
25
  bindings: "";
package/dist/components/image-cropper/image-cropper.svelte CHANGED
@@ -55,11 +55,11 @@
55
55
  }
56
56
  }));
57
57
 
58
- // eslint-disable-next-line no-useless-assignment, @typescript-eslint/no-unused-vars
58
+ // eslint-disable-next-line no-useless-assignment
59
59
  getCroppedImage = (options) => imageCropper().getCroppedImage(options);
60
- // eslint-disable-next-line no-useless-assignment, @typescript-eslint/no-unused-vars
60
+ // eslint-disable-next-line no-useless-assignment
61
61
  getCropData = () => imageCropper().getCropData();
62
- // eslint-disable-next-line no-useless-assignment, @typescript-eslint/no-unused-vars
62
+ // eslint-disable-next-line no-useless-assignment
63
63
  getProcessedImage = (opts?: ProcessImageOptions) =>
64
64
  cropImage(src, imageCropper().getCropData(), opts);
65
65
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "compote-ui",
3
- "version": "0.81.1",
3
+ "version": "0.83.0",
4
4
  "license": "MIT",
5
5
  "repository": {
6
6
  "type": "git",
@@ -69,19 +69,19 @@
69
69
  "@faker-js/faker": "^10.6.0",
70
70
  "@iconify-json/ph": "^1.2.2",
71
71
  "@sveltejs/adapter-auto": "^8.0.0",
72
- "@sveltejs/adapter-cloudflare": "^8.0.0",
73
- "@sveltejs/kit": "^3.0.1",
74
- "@sveltejs/package": "^3.0.0",
72
+ "@sveltejs/adapter-cloudflare": "^8.0.1",
73
+ "@sveltejs/kit": "^3.1.0",
74
+ "@sveltejs/package": "^3.0.1",
75
75
  "@sveltejs/vite-plugin-svelte": "^7.3.1",
76
76
  "@tailwindcss/vite": "^4.3.3",
77
- "@tanstack/intent": "^0.5.4",
78
- "@tanstack/svelte-table": "9.2.6",
79
- "@types/node": "^24.19.1",
77
+ "@tanstack/intent": "^0.5.5",
78
+ "@tanstack/svelte-table": "9.3.1",
79
+ "@types/node": "^24.19.2",
80
80
  "eslint": "^10.12.0",
81
81
  "eslint-config-prettier": "^10.1.8",
82
- "eslint-plugin-svelte": "^3.23.0",
82
+ "eslint-plugin-svelte": "^3.23.1",
83
83
  "globals": "^17.13.0",
84
- "prettier": "^3.9.9",
84
+ "prettier": "^3.9.10",
85
85
  "prettier-plugin-svelte": "^4.1.1",
86
86
  "prettier-plugin-tailwindcss": "^0.8.1",
87
87
  "publint": "^0.3.25",
@@ -90,11 +90,11 @@
90
90
  "tailwindcss": "^4.3.3",
91
91
  "tw-animate-css": "^1.4.0",
92
92
  "typescript": "^6.0.3",
93
- "typescript-eslint": "^8.71.1",
93
+ "typescript-eslint": "^8.71.2",
94
94
  "unplugin-icons": "^24.0.0",
95
- "vite": "^8.3.3",
96
- "vitest": "^5.0.3",
97
- "wrangler": "^4.118.0"
95
+ "vite": "^8.3.4",
96
+ "vitest": "^5.0.4",
97
+ "wrangler": "^4.151.0"
98
98
  },
99
99
  "keywords": [
100
100
  "svelte",
@@ -104,7 +104,7 @@
104
104
  "@ark-ui/svelte": "^5.24.3",
105
105
  "@fontsource-variable/nunito-sans": "^5.2.7",
106
106
  "@internationalized/date": "^3.12.4",
107
- "@tanstack/svelte-virtual": "^3.13.39",
107
+ "@tanstack/svelte-virtual": "^3.13.45",
108
108
  "runed": "^0.37.1",
109
109
  "svelte-tel-input": "^4.3.3",
110
110
  "tailwind-merge": "^3.7.0",
package/skills/data-table/references/column-options.md CHANGED
@@ -162,6 +162,8 @@ booleans and object-valued columns are excluded from global search. Also availab
162
162
  `onRowClick?: (details: { row: T; event: MouseEvent }) => void`,
163
163
  `onRowDoubleClick?: (details: { row: T; event: MouseEvent }) => void` — `row` is `row.original`.
164
164
  Clicks on the row-selection checkbox and url-cell buttons do **not** trigger either handler.
165
+ `rowClass?: (row: T) => ClassValue` adds classes to the row's `<tr>` (e.g. a tint; also set
166
+ `--row-bg` so pinned and selection cells match).
165
167
  `VirtualDataTable.Root` shares the same props.
166
168
 
167
169
  ```svelte