@ui-organized/svelte-table 0.0.0-stage → 0.1.0

package/dist/components/TableToolbar/TableScrollButtons.svelte.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TableScrollButtons.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/components/TableToolbar/TableScrollButtons.svelte.ts"],"names":[],"mappings":"AAQC,KAAK,gBAAgB,GAAI;IAAE,SAAS,CAAC,EAAE,MAAM,CAAC;IAAC,UAAU,CAAC,EAAE,MAAM,CAAC;IAAC,KAAK,CAAC,EAAE,MAAM,CAAA;CAAE,CAAC;AA4BtF,QAAA,MAAM,kBAAkB,sDAAwC,CAAC;AACjE,KAAK,kBAAkB,GAAG,UAAU,CAAC,OAAO,kBAAkB,CAAC,CAAC;AAChE,eAAe,kBAAkB,CAAC"}

package/dist/components/TableToolbar/TableSearch.svelte

@@ -0,0 +1,24 @@
+<script lang="ts">
+  import { clsx } from "clsx";
+  import { SearchInput } from "@ui-organized/svelte";
+  import { getTable } from "../../core/tableContext.js";
+
+  let {
+    placeholder = "Search",
+    label,
+    class: className,
+  }: { placeholder?: string; label?: string; class?: string } = $props();
+
+  const table = getTable();
+  const name = $derived(label ?? `Search ${table.label}`);
+</script>
+
+<SearchInput
+  class={clsx("data-table__search", className)}
+  size={table.size}
+  value={table.search}
+  {placeholder}
+  aria-label={name}
+  oninput={(event) => table.setSearch(event.currentTarget.value)}
+  onClear={() => table.setSearch("")}
+/>

package/dist/components/TableToolbar/TableSearch.svelte.d.ts

@@ -0,0 +1,9 @@
+type $$ComponentProps = {
+    placeholder?: string;
+    label?: string;
+    class?: string;
+};
+declare const TableSearch: import("svelte").Component<$$ComponentProps, {}, "">;
+type TableSearch = ReturnType<typeof TableSearch>;
+export default TableSearch;
+//# sourceMappingURL=TableSearch.svelte.d.ts.map

package/dist/components/TableToolbar/TableSearch.svelte.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TableSearch.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/components/TableToolbar/TableSearch.svelte.ts"],"names":[],"mappings":"AAOC,KAAK,gBAAgB,GAAI;IAAE,WAAW,CAAC,EAAE,MAAM,CAAC;IAAC,KAAK,CAAC,EAAE,MAAM,CAAC;IAAC,KAAK,CAAC,EAAE,MAAM,CAAA;CAAE,CAAC;AAoBnF,QAAA,MAAM,WAAW,sDAAwC,CAAC;AAC1D,KAAK,WAAW,GAAG,UAAU,CAAC,OAAO,WAAW,CAAC,CAAC;AAClD,eAAe,WAAW,CAAC"}

package/dist/components/TableToolbar/TableSortMenu.svelte

@@ -0,0 +1,97 @@
+<!--
+  Sorting, from the header rather than from a column.
+
+  The column headers already sort, so in table mode this is a convenience. In
+  **card mode it is the only sort control there is** — there are no headers to
+  click — and a table that silently loses the ability to sort at 640px is a table
+  that is broken on phones.
+
+  One column at a time. Multi-column sort stays where it is discoverable and
+  cheap: shift-clicking headers.
+-->
+<script lang="ts">
+  import {
+    Button,
+    Menu,
+    MenuContent,
+    MenuGroup,
+    MenuGroupLabel,
+    MenuItem,
+    MenuRadioGroup,
+    MenuRadioItem,
+    MenuSeparator,
+    MenuTrigger,
+  } from "@ui-organized/svelte";
+  import { getTable } from "../../core/tableContext.js";
+  import { internalGlyph as glyph } from "@ui-organized/svelte";
+
+  let { label = "Sort", class: className }: { label?: string; class?: string } = $props();
+  const table = getTable();
+
+  const columns = $derived(table.table.getAllLeafColumns().filter((c) => c.getCanSort()));
+  const active = $derived(table.state.sorting?.[0]);
+  const activeId = $derived(active?.id ?? "");
+  const direction = $derived(active?.desc ? "desc" : "asc");
+  const triggerIcon = $derived(glyph(activeId ? (active?.desc ? "sort-desc" : "sort-asc") : "sort"));
+
+  const headerOf = (column: (typeof columns)[number]) =>
+    typeof column.columnDef.header === "string" ? column.columnDef.header : column.id;
+</script>
+
+{#if columns.length > 0}
+  <Menu>
+    <MenuTrigger>
+      {#snippet asChild(props)}
+        <Button
+          {...(props() as Record<string, never>)}
+          intent="secondary"
+          size={table.size}
+          icon={triggerIcon}
+          aria-label={label}
+          class={className}
+        />
+      {/snippet}
+    </MenuTrigger>
+    <MenuContent align="end" class="data-table__sort-menu">
+      <MenuGroup>
+        <MenuGroupLabel>Sort by</MenuGroupLabel>
+        <MenuRadioGroup
+          value={activeId}
+          onValueChange={(id) =>
+            table.table.setSorting(id ? [{ id, desc: direction === "desc" }] : [])}
+        >
+          {#each columns as column (column.id)}
+            <MenuRadioItem value={column.id}>{headerOf(column)}</MenuRadioItem>
+          {/each}
+        </MenuRadioGroup>
+      </MenuGroup>
+
+      <MenuSeparator />
+
+      <MenuGroup>
+        <MenuGroupLabel>Direction</MenuGroupLabel>
+        <MenuRadioGroup
+          value={direction}
+          onValueChange={(next) => {
+            if (activeId) table.table.setSorting([{ id: activeId, desc: next === "desc" }]);
+          }}
+        >
+          <!--
+            Disabled rather than hidden: the choice is always part of the menu's
+            shape, and a menu that changes length as you use it is harder to aim
+            at the second time.
+          -->
+          <MenuRadioItem value="asc" disabled={!activeId}>Ascending</MenuRadioItem>
+          <MenuRadioItem value="desc" disabled={!activeId}>Descending</MenuRadioItem>
+        </MenuRadioGroup>
+      </MenuGroup>
+
+      {#if activeId}
+        <MenuSeparator />
+        <MenuItem value="clear-sorting" onSelect={() => table.table.setSorting([])}>
+          Clear sorting
+        </MenuItem>
+      {/if}
+    </MenuContent>
+  </Menu>
+{/if}

package/dist/components/TableToolbar/TableSortMenu.svelte.d.ts

@@ -0,0 +1,8 @@
+type $$ComponentProps = {
+    label?: string;
+    class?: string;
+};
+declare const TableSortMenu: import("svelte").Component<$$ComponentProps, {}, "">;
+type TableSortMenu = ReturnType<typeof TableSortMenu>;
+export default TableSortMenu;
+//# sourceMappingURL=TableSortMenu.svelte.d.ts.map

package/dist/components/TableToolbar/TableSortMenu.svelte.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TableSortMenu.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/components/TableToolbar/TableSortMenu.svelte.ts"],"names":[],"mappings":"AAkBC,KAAK,gBAAgB,GAAI;IAAE,KAAK,CAAC,EAAE,MAAM,CAAC;IAAC,KAAK,CAAC,EAAE,MAAM,CAAA;CAAE,CAAC;AA+D7D,QAAA,MAAM,aAAa,sDAAwC,CAAC;AAC5D,KAAK,aAAa,GAAG,UAAU,CAAC,OAAO,aAAa,CAAC,CAAC;AACtD,eAAe,aAAa,CAAC"}

package/dist/components/TableToolbar/TableToolbar.svelte

@@ -0,0 +1,113 @@
+<!--
+  The row above the table: search, filters, and the controls that change what the
+  table shows rather than what it contains.
+
+  Not a `Toolbar` — that component is a `role="toolbar"` with roving focus, which
+  is right for a cluster of icon buttons and wrong for a row containing a text
+  input.
+-->
+<script lang="ts">
+  import type { Snippet } from "svelte";
+  import { clsx } from "clsx";
+  import { Divider } from "@ui-organized/svelte";
+  import { getTable } from "../../core/tableContext.js";
+  import { TableFilterAdd } from "../TableFilters/index.js";
+  import { TableSelectionBar } from "../TableSelectionBar/index.js";
+  import { TableFilterSheet, TableSortSheet } from "../TableSheets/index.js";
+  import TableActions from "./TableActions.svelte";
+  import TableExportMenu from "./TableExportMenu.svelte";
+  import TableScrollButtons from "./TableScrollButtons.svelte";
+  import TableSearch from "./TableSearch.svelte";
+  import TableSortMenu from "./TableSortMenu.svelte";
+  import TableViewOptions from "./TableViewOptions.svelte";
+  import TableReorderToggle from "./TableReorderToggle.svelte";
+
+  let { class: className, children }: { class?: string; children?: Snippet } = $props();
+  const table = getTable();
+
+  const searchable = $derived(table.options.searchable ?? true);
+  const hideable = $derived(table.options.hideableColumns ?? false);
+  const exportable = $derived(table.options.exportable ?? false);
+  const filterable = $derived(table.options.filterable ?? true);
+  const actions = $derived(table.options.actions ?? []);
+  const sortMenu = $derived(
+    (table.options.sortMenu ?? true) &&
+      (table.options.sortable ?? true) &&
+      table.table.getAllLeafColumns().some((column) => column.getCanSort()),
+  );
+
+  const selecting = $derived(table.selection.count > 0);
+
+  /**
+   * `scroll.overflowing` counts: a table whose only chrome is the two scroll
+   * buttons still needs the row to put them in — columns off the right edge are
+   * no less hidden for the table having no search box. So does a selection: its
+   * bulk actions live in this row.
+   */
+  const render = $derived(
+    selecting ||
+      searchable ||
+      hideable ||
+      exportable ||
+      filterable ||
+      sortMenu ||
+      table.scroll.state.overflowing ||
+      table.reorder.mode === "toggle" ||
+      actions.length > 0,
+  );
+</script>
+
+{#if children}
+  <div class={clsx("data-table__toolbar", className)}>{@render children()}</div>
+{:else if render}
+  <!--
+    One row. The filter chips sit on the line below, in `TableSubBar`: they
+    wrap, often onto a second and third line, and sharing this row with them
+    would shunt the controls around every time a filter is added.
+
+    While rows are selected, the bulk actions take the place of the table's own
+    controls. What to do with the selection is the decision in front of the
+    user, and sorting or adding a filter underneath it would change which rows
+    it means. Clearing the selection brings the controls back.
+  -->
+  <div class={clsx("data-table__toolbar", className)}>
+    {#if searchable}<TableSearch />{/if}
+    <div class="data-table__toolbar-spacer"></div>
+
+    {#if selecting}
+      <TableSelectionBar />
+      <!-- Stays: "Download selected rows" and "Copy selection" are actions on
+           the selection, and live nowhere else. -->
+      {#if exportable}<TableExportMenu />{/if}
+    {:else}
+      <TableActions />
+      <!--
+        Only when there is something on both sides of it. A rule with nothing to
+        its left is a rule separating the toolbar from its own edge, which says
+        nothing.
+      -->
+      {#if actions.length > 0}
+        <Divider orientation="vertical" class="data-table__toolbar-divider" />
+      {/if}
+
+      <!--
+        Card mode trades the two menus for labelled buttons that open a bottom
+        sheet each, with what is applied counted on the button: there are no
+        column headers to sort from and no room for a row of chips above the
+        cards.
+      -->
+      {#if table.mode === "cards"}
+        {#if sortMenu}<TableSortSheet />{/if}
+        {#if filterable}<TableFilterSheet />{/if}
+      {:else}
+        {#if sortMenu}<TableSortMenu />{/if}
+        {#if filterable}<TableFilterAdd iconOnly />{/if}
+      {/if}
+      {#if exportable}<TableExportMenu />{/if}
+      {#if hideable}<TableViewOptions />{/if}
+      <TableReorderToggle />
+    {/if}
+    <!-- Last, and only while the viewport is actually hiding columns. -->
+    <TableScrollButtons />
+  </div>
+{/if}

package/dist/components/TableToolbar/TableToolbar.svelte.d.ts

@@ -0,0 +1,9 @@
+import type { Snippet } from "svelte";
+type $$ComponentProps = {
+    class?: string;
+    children?: Snippet;
+};
+declare const TableToolbar: import("svelte").Component<$$ComponentProps, {}, "">;
+type TableToolbar = ReturnType<typeof TableToolbar>;
+export default TableToolbar;
+//# sourceMappingURL=TableToolbar.svelte.d.ts.map

package/dist/components/TableToolbar/TableToolbar.svelte.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TableToolbar.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/components/TableToolbar/TableToolbar.svelte.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,QAAQ,CAAC;AAerC,KAAK,gBAAgB,GAAI;IAAE,KAAK,CAAC,EAAE,MAAM,CAAC;IAAC,QAAQ,CAAC,EAAE,OAAO,CAAA;CAAE,CAAC;AA2FjE,QAAA,MAAM,YAAY,sDAAwC,CAAC;AAC3D,KAAK,YAAY,GAAG,UAAU,CAAC,OAAO,YAAY,CAAC,CAAC;AACpD,eAAe,YAAY,CAAC"}

package/dist/components/TableToolbar/TableViewOptions.svelte

@@ -0,0 +1,69 @@
+<!--
+  Column visibility, and — when reordering is on — the keyboard-reachable half of
+  reordering. A drag-only affordance fails the a11y gate, so the menu is the
+  primary control and the drag is the enhancement.
+-->
+<script lang="ts">
+  import {
+    Button,
+    Menu,
+    MenuCheckboxItem,
+    MenuContent,
+    MenuGroup,
+    MenuGroupLabel,
+    MenuItem,
+    MenuSeparator,
+    MenuTrigger,
+  } from "@ui-organized/svelte";
+  import { toggleableColumns } from "@ui-organized/table-core";
+  import { getTable } from "../../core/tableContext.js";
+  import { internalGlyph as glyph } from "@ui-organized/svelte";
+
+  let { label = "Columns", class: className }: { label?: string; class?: string } = $props();
+  const table = getTable();
+  const columns = $derived(toggleableColumns(table.table.getAllLeafColumns()));
+  const headerOf = (column: (typeof columns)[number]) =>
+    typeof column.columnDef.header === "string" ? column.columnDef.header : column.id;
+</script>
+
+{#if columns.length > 0}
+  <Menu>
+    <MenuTrigger>
+      {#snippet asChild(props)}
+        <Button
+          {...(props() as Record<string, never>)}
+          intent="secondary"
+          size={table.size}
+          icon={glyph("settings")}
+          aria-label={label}
+        />
+      {/snippet}
+    </MenuTrigger>
+    <MenuContent align="end" class={className}>
+      <MenuGroup>
+        <MenuGroupLabel>Visible columns</MenuGroupLabel>
+        {#each columns as column (column.id)}
+          <MenuCheckboxItem
+            value={column.id}
+            checked={column.getIsVisible()}
+            onCheckedChange={(checked) => column.toggleVisibility(checked)}
+          >
+            {headerOf(column)}
+          </MenuCheckboxItem>
+        {/each}
+      </MenuGroup>
+      {#if table.options.reorderable}
+        <MenuSeparator />
+        <MenuGroup>
+          <MenuGroupLabel>Reset</MenuGroupLabel>
+          <MenuItem value="reset-order" onSelect={() => table.table.resetColumnOrder()}>
+            Reset column order
+          </MenuItem>
+          <MenuItem value="reset-sizing" onSelect={() => table.table.resetColumnSizing()}>
+            Reset column widths
+          </MenuItem>
+        </MenuGroup>
+      {/if}
+    </MenuContent>
+  </Menu>
+{/if}

package/dist/components/TableToolbar/TableViewOptions.svelte.d.ts

@@ -0,0 +1,8 @@
+type $$ComponentProps = {
+    label?: string;
+    class?: string;
+};
+declare const TableViewOptions: import("svelte").Component<$$ComponentProps, {}, "">;
+type TableViewOptions = ReturnType<typeof TableViewOptions>;
+export default TableViewOptions;
+//# sourceMappingURL=TableViewOptions.svelte.d.ts.map

package/dist/components/TableToolbar/TableViewOptions.svelte.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TableViewOptions.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/components/TableToolbar/TableViewOptions.svelte.ts"],"names":[],"mappings":"AAkBC,KAAK,gBAAgB,GAAI;IAAE,KAAK,CAAC,EAAE,MAAM,CAAC;IAAC,KAAK,CAAC,EAAE,MAAM,CAAA;CAAE,CAAC;AAiD7D,QAAA,MAAM,gBAAgB,sDAAwC,CAAC;AAC/D,KAAK,gBAAgB,GAAG,UAAU,CAAC,OAAO,gBAAgB,CAAC,CAAC;AAC5D,eAAe,gBAAgB,CAAC"}

package/dist/components/TableToolbar/index.d.ts

@@ -0,0 +1,9 @@
+export { default as TableToolbar } from "./TableToolbar.svelte";
+export { default as TableActions } from "./TableActions.svelte";
+export { default as TableSearch } from "./TableSearch.svelte";
+export { default as TableSortMenu } from "./TableSortMenu.svelte";
+export { default as TableViewOptions } from "./TableViewOptions.svelte";
+export { default as TableReorderToggle } from "./TableReorderToggle.svelte";
+export { default as TableExportMenu } from "./TableExportMenu.svelte";
+export { default as TableScrollButtons } from "./TableScrollButtons.svelte";
+//# sourceMappingURL=index.d.ts.map

package/dist/components/TableToolbar/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/lib/components/TableToolbar/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,uBAAuB,CAAC;AAChE,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,uBAAuB,CAAC;AAChE,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,sBAAsB,CAAC;AAC9D,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,wBAAwB,CAAC;AAClE,OAAO,EAAE,OAAO,IAAI,gBAAgB,EAAE,MAAM,2BAA2B,CAAC;AACxE,OAAO,EAAE,OAAO,IAAI,kBAAkB,EAAE,MAAM,6BAA6B,CAAC;AAC5E,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,0BAA0B,CAAC;AACtE,OAAO,EAAE,OAAO,IAAI,kBAAkB,EAAE,MAAM,6BAA6B,CAAC"}

package/dist/components/TableToolbar/index.js

@@ -0,0 +1,8 @@
+export { default as TableToolbar } from "./TableToolbar.svelte";
+export { default as TableActions } from "./TableActions.svelte";
+export { default as TableSearch } from "./TableSearch.svelte";
+export { default as TableSortMenu } from "./TableSortMenu.svelte";
+export { default as TableViewOptions } from "./TableViewOptions.svelte";
+export { default as TableReorderToggle } from "./TableReorderToggle.svelte";
+export { default as TableExportMenu } from "./TableExportMenu.svelte";
+export { default as TableScrollButtons } from "./TableScrollButtons.svelte";

package/dist/core/ActionsHeader.svelte

@@ -0,0 +1,8 @@
+<!--
+  The actions column's header: a name for assistive tech and nothing visible.
+
+  A component rather than a plain string, because the string would be *shown* —
+  a column of ellipsis buttons under a visible "Actions" heading is not what the
+  design draws, and a column with no accessible name at all is worse.
+-->
+<span class="data-table__sr-only">Actions</span>

package/dist/core/ActionsHeader.svelte.d.ts

@@ -0,0 +1,27 @@
+export default ActionsHeader;
+type ActionsHeader = SvelteComponent<{
+    [x: string]: never;
+}, {
+    [evt: string]: CustomEvent<any>;
+}, {}> & {
+    $$bindings?: string | undefined;
+};
+declare const ActionsHeader: $$__sveltets_2_IsomorphicComponent<{
+    [x: string]: never;
+}, {
+    [evt: string]: CustomEvent<any>;
+}, {}, {}, string>;
+interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
+    new (options: import("svelte").ComponentConstructorOptions<Props>): import("svelte").SvelteComponent<Props, Events, Slots> & {
+        $$bindings?: Bindings;
+    } & Exports;
+    (internal: unknown, props: {
+        $$events?: Events;
+        $$slots?: Slots;
+    }): Exports & {
+        $set?: any;
+        $on?: any;
+    };
+    z_$$bindings?: Bindings;
+}
+//# sourceMappingURL=ActionsHeader.svelte.d.ts.map

package/dist/core/ActionsHeader.svelte.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ActionsHeader.svelte.d.ts","sourceRoot":"","sources":["../../src/lib/core/ActionsHeader.svelte.js"],"names":[],"mappings":";;;;;;;;AAgBA;;;;mBAAyH;6CAT5E,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,QAAQ,MAAM,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,QAAQ,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,QAAQ,OAAO,OAAO,QAAQ;IAC3L,cAAc,OAAO,QAAQ,EAAE,2BAA2B,CAAC,KAAK,CAAC,GAAG,OAAO,QAAQ,EAAE,eAAe,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,CAAC,GAAG;QAAE,UAAU,CAAC,EAAE,QAAQ,CAAA;KAAE,GAAG,OAAO,CAAC;IACjK,WAAW,OAAO,SAAS;QAAC,QAAQ,CAAC,EAAE,MAAM,CAAC;QAAC,OAAO,CAAC,EAAE,KAAK,CAAA;KAAC,GAAG,OAAO,GAAG;QAAE,IAAI,CAAC,EAAE,GAAG,CAAC;QAAC,GAAG,CAAC,EAAE,GAAG,CAAA;KAAE,CAAC;IACtG,eAAe,QAAQ,CAAC"}

package/dist/core/SelectAllCell.svelte

@@ -0,0 +1,21 @@
+<!--
+  The header's tri-state checkbox: from empty it selects the rows on screen;
+  from checked or mixed it clears the selection. What the box shows decides the
+  click, not the box's own next state — see `headerToggleTarget`.
+-->
+<script lang="ts">
+  import { Checkbox } from "@ui-organized/svelte";
+  import { headerToggleTarget } from "@ui-organized/table-core";
+  import { getTable } from "./tableContext.js";
+
+  const table = getTable();
+</script>
+
+<span class="data-table__select-hit">
+  <Checkbox
+    checked={table.selection.header.checked}
+    indeterminate={table.selection.header.indeterminate}
+    aria-label={`Select the rows shown in ${table.label}`}
+    onCheckedChange={() => table.selection.togglePage(headerToggleTarget(table.selection.header))}
+  />
+</span>

package/dist/core/SelectAllCell.svelte.d.ts

@@ -0,0 +1,19 @@
+interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
+    new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
+        $$bindings?: Bindings;
+    } & Exports;
+    (internal: unknown, props: {
+        $$events?: Events;
+        $$slots?: Slots;
+    }): Exports & {
+        $set?: any;
+        $on?: any;
+    };
+    z_$$bindings?: Bindings;
+}
+declare const SelectAllCell: $$__sveltets_2_IsomorphicComponent<Record<string, never>, {
+    [evt: string]: CustomEvent<any>;
+}, {}, {}, string>;
+type SelectAllCell = InstanceType<typeof SelectAllCell>;
+export default SelectAllCell;
+//# sourceMappingURL=SelectAllCell.svelte.d.ts.map

package/dist/core/SelectAllCell.svelte.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SelectAllCell.svelte.d.ts","sourceRoot":"","sources":["../../src/lib/core/SelectAllCell.svelte.ts"],"names":[],"mappings":"AAsBA,UAAU,kCAAkC,CAAC,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,GAAG,EAAE,MAAM,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,GAAG,EAAE,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,GAAG,EAAE,OAAO,GAAG,EAAE,EAAE,QAAQ,GAAG,MAAM;IACpM,KAAK,OAAO,EAAE,OAAO,QAAQ,EAAE,2BAA2B,CAAC,KAAK,CAAC,GAAG,OAAO,QAAQ,EAAE,eAAe,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,CAAC,GAAG;QAAE,UAAU,CAAC,EAAE,QAAQ,CAAA;KAAE,GAAG,OAAO,CAAC;IACjK,CAAC,QAAQ,EAAE,OAAO,EAAE,KAAK,EAAE;QAAC,QAAQ,CAAC,EAAE,MAAM,CAAC;QAAC,OAAO,CAAC,EAAE,KAAK,CAAA;KAAC,GAAG,OAAO,GAAG;QAAE,IAAI,CAAC,EAAE,GAAG,CAAC;QAAC,GAAG,CAAC,EAAE,GAAG,CAAA;KAAE,CAAC;IACtG,YAAY,CAAC,EAAE,QAAQ,CAAC;CAC3B;AAKD,QAAA,MAAM,aAAa;;kBAA+E,CAAC;AACjF,KAAK,aAAa,GAAG,YAAY,CAAC,OAAO,aAAa,CAAC,CAAC;AAC1D,eAAe,aAAa,CAAC"}

package/dist/core/SelectCell.svelte

@@ -0,0 +1,37 @@
+<!--
+  A row's selection checkbox, with shift-click range selection.
+
+  Given a `Checkbox` with a closed prop API — no ref, no `onclick`, no `data-*`
+  passthrough — the wrapper records `shiftKey` from the pointer or keyboard event
+  that *precedes* the change, which the change handler then reads. It needs no
+  change to `@ui-organized/svelte`, which is the point: widening a component's
+  API to serve one consumer is how a design system's props turn into a junk
+  drawer.
+-->
+<script lang="ts">
+  import { Checkbox } from "@ui-organized/svelte";
+  import { getTable } from "./tableContext.js";
+
+  let { rowId, rowLabel }: { rowId: string; rowLabel: string } = $props();
+  const table = getTable();
+
+  let shift = false;
+  const remember = (event: MouseEvent | KeyboardEvent) => {
+    shift = event.shiftKey;
+  };
+</script>
+
+<span
+  class="data-table__select-hit"
+  onmousedowncapture={remember}
+  onkeydowncapture={remember}
+>
+  <Checkbox
+    checked={table.selection.isSelected(rowId)}
+    aria-label={rowLabel}
+    onCheckedChange={(checked) => {
+      table.selection.toggle(rowId, checked, shift);
+      shift = false;
+    }}
+  />
+</span>

package/dist/core/SelectCell.svelte.d.ts

@@ -0,0 +1,8 @@
+type $$ComponentProps = {
+    rowId: string;
+    rowLabel: string;
+};
+declare const SelectCell: import("svelte").Component<$$ComponentProps, {}, "">;
+type SelectCell = ReturnType<typeof SelectCell>;
+export default SelectCell;
+//# sourceMappingURL=SelectCell.svelte.d.ts.map

package/dist/core/SelectCell.svelte.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SelectCell.svelte.d.ts","sourceRoot":"","sources":["../../src/lib/core/SelectCell.svelte.ts"],"names":[],"mappings":"AAMC,KAAK,gBAAgB,GAAI;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,QAAQ,EAAE,MAAM,CAAA;CAAE,CAAC;AAwB9D,QAAA,MAAM,UAAU,sDAAwC,CAAC;AACzD,KAAK,UAAU,GAAG,UAAU,CAAC,OAAO,UAAU,CAAC,CAAC;AAChD,eAAe,UAAU,CAAC"}

package/dist/core/createDataTable.svelte.d.ts

@@ -0,0 +1,4 @@
+import { type RowData } from "@ui-organized/table-core";
+import type { DataTableApi, UseDataTableOptions } from "./types.js";
+export declare function createDataTable<T extends RowData>(options: () => UseDataTableOptions<T>): DataTableApi<T>;
+//# sourceMappingURL=createDataTable.svelte.d.ts.map

package/dist/core/createDataTable.svelte.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"createDataTable.svelte.d.ts","sourceRoot":"","sources":["../../src/lib/core/createDataTable.svelte.ts"],"names":[],"mappings":"AA0CA,OAAO,EAmDL,KAAK,OAAO,EAoBb,MAAM,0BAA0B,CAAC;AAIlC,OAAO,KAAK,EAEV,YAAY,EAIZ,mBAAmB,EACpB,MAAM,YAAY,CAAC;AA6EpB,wBAAgB,eAAe,CAAC,CAAC,SAAS,OAAO,EAC/C,OAAO,EAAE,MAAM,mBAAmB,CAAC,CAAC,CAAC,GACpC,YAAY,CAAC,CAAC,CAAC,CA6nCjB"}