@invopop/popui 0.1.4-beta.26 → 0.1.4-beta.28

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.
@@ -45,6 +45,7 @@
45
45
 
46
46
  export const clear = () => {
47
47
  value = ''
48
+ oninput?.('')
48
49
  }
49
50
 
50
51
  let shortcutKeys = $derived(shortcut.split(''))
@@ -38,7 +38,7 @@
38
38
  <Tooltip>
39
39
  <TooltipTrigger class="shrink-0">
40
40
  <div
41
- class="flex items-center justify-center text-icon font-medium text-base size-7 shrink-0 rounded-md bg-background-default-tertiary ml-[-1px]"
41
+ class="flex items-center justify-center text-icon font-medium text-sm size-7 shrink-0 rounded-md bg-background-default-tertiary ml-[-1px]"
42
42
  >
43
43
  +{restIcons.length}
44
44
  </div>
@@ -69,6 +69,7 @@ export interface DataTableProps<TData> {
69
69
  filters?: Snippet;
70
70
  paginationSelectedSlot?: Snippet;
71
71
  paginationUnselectedSlot?: Snippet;
72
+ children?: Snippet;
72
73
  manualPagination?: boolean;
73
74
  pageCount?: number;
74
75
  rowCount?: number;
@@ -61,7 +61,8 @@
61
61
  onSortingChange,
62
62
  onFilterChange,
63
63
  onFreezeChange,
64
- getRowClassName
64
+ getRowClassName,
65
+ children
65
66
  }: DataTableProps<TData> = $props()
66
67
 
67
68
  const enableSelection = !disableSelection
@@ -424,20 +425,23 @@
424
425
  <div class="flex flex-col h-full">
425
426
  <DataTableToolbar {table} {filters} {frozenColumns} onFreezeColumn={handleFreezeColumn} />
426
427
  <div class="flex-1 overflow-hidden flex flex-col">
427
- {#if data.length === 0}
428
- <div class="flex-1 flex items-center justify-center bg-background">
429
- <EmptyState
430
- iconSource={emptyState.iconSource}
431
- title={emptyState.title}
432
- description={emptyState.description}
433
- />
434
- </div>
435
- {:else}
436
- <div
437
- bind:this={containerRef}
438
- class="relative bg-background flex-1 overflow-auto"
439
- style="overscroll-behavior-x: none;"
440
- >
428
+ <div
429
+ bind:this={containerRef}
430
+ class="relative bg-background flex-1 overflow-auto"
431
+ style="overscroll-behavior-x: none;"
432
+ >
433
+ {#if data.length === 0}
434
+ <div class="absolute inset-0 flex items-center justify-center pointer-events-none">
435
+ <div class="pointer-events-auto">
436
+ <EmptyState
437
+ icon={children}
438
+ iconSource={emptyState.iconSource}
439
+ title={emptyState.title}
440
+ description={emptyState.description}
441
+ />
442
+ </div>
443
+ </div>
444
+ {:else}
441
445
  <Table.Root>
442
446
  <Table.Header>
443
447
  {#each table.getHeaderGroups() as headerGroup (headerGroup.id)}
@@ -588,8 +592,8 @@
588
592
  {/each}
589
593
  </Table.Body>
590
594
  </Table.Root>
595
+ {/if}
591
596
  </div>
592
- {/if}
593
597
  {#if enablePagination}
594
598
  <DataTablePagination
595
599
  {table}
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@invopop/popui",
3
3
  "license": "MIT",
4
- "version": "0.1.4-beta.26",
4
+ "version": "0.1.4-beta.28",
5
5
  "repository": {
6
6
  "url": "https://github.com/invopop/popui"
7
7
  },