@flexkit/studio 0.0.26 → 0.0.28

package/dist/index.css

@@ -48,6 +48,7 @@
     --fk-leading-relaxed: 1.625;
     --fk-radius-xs: 0.125rem;
     --fk-drop-shadow-md: 0 3px 3px rgb(0 0 0 / 0.12);
+    --fk-ease-out: cubic-bezier(0, 0, 0.2, 1);
     --fk-ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);
     --fk-animate-spin: spin 1s linear infinite;
     --fk-animate-pulse: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
@@ -233,6 +234,9 @@
   .fk\:relative {
     position: relative;
   }
+  .fk\:sticky {
+    position: sticky;
+  }
   .fk\:inset-0 {
     inset: calc(var(--fk-spacing) * 0);
   }
@@ -263,6 +267,9 @@
   .fk\:top-4 {
     top: calc(var(--fk-spacing) * 4);
   }
+  .fk\:top-10\.25 {
+    top: calc(var(--fk-spacing) * 10.25);
+  }
   .fk\:top-\[0\.1875rem\] {
     top: 0.1875rem;
   }
@@ -272,6 +279,9 @@
   .fk\:right-0 {
     right: calc(var(--fk-spacing) * 0);
   }
+  .fk\:right-0\.5 {
+    right: calc(var(--fk-spacing) * 0.5);
+  }
   .fk\:right-0\.75 {
     right: calc(var(--fk-spacing) * 0.75);
   }
@@ -293,6 +303,9 @@
   .fk\:right-\[0\.1875rem\] {
     right: 0.1875rem;
   }
+  .fk\:right-px {
+    right: 1px;
+  }
   .fk\:bottom-0 {
     bottom: calc(var(--fk-spacing) * 0);
   }
@@ -308,6 +321,9 @@
   .fk\:left-\[50\%\] {
     left: 50%;
   }
+  .fk\:left-px {
+    left: 1px;
+  }
   .fk\:z-10 {
     z-index: 10;
   }
@@ -348,6 +364,9 @@
       max-width: 1400px;
     }
   }
+  .fk\:-mx-0\.5 {
+    margin-inline: calc(var(--fk-spacing) * -0.5);
+  }
   .fk\:-mx-1 {
     margin-inline: calc(var(--fk-spacing) * -1);
   }
@@ -1063,6 +1082,9 @@
   .fk\:ml-0\! {
     margin-left: calc(var(--fk-spacing) * 0) !important;
   }
+  .fk\:ml-1 {
+    margin-left: calc(var(--fk-spacing) * 1);
+  }
   .fk\:ml-2 {
     margin-left: calc(var(--fk-spacing) * 2);
   }
@@ -1160,6 +1182,9 @@
   .fk\:h-\(--radix-select-trigger-height\) {
     height: var(--radix-select-trigger-height);
   }
+  .fk\:h-0\.5 {
+    height: calc(var(--fk-spacing) * 0.5);
+  }
   .fk\:h-1\.5 {
     height: calc(var(--fk-spacing) * 1.5);
   }
@@ -1211,6 +1236,9 @@
   .fk\:h-\[2\.375rem\] {
     height: 2.375rem;
   }
+  .fk\:h-\[17\.5rem\] {
+    height: 17.5rem;
+  }
   .fk\:h-\[20px\] {
     height: 20px;
   }
@@ -1253,9 +1281,6 @@
   .fk\:max-h-80 {
     max-height: calc(var(--fk-spacing) * 80);
   }
-  .fk\:max-h-\[17\.5rem\] {
-    max-height: 17.5rem;
-  }
   .fk\:max-h-\[220px\] {
     max-height: 220px;
   }
@@ -1289,9 +1314,6 @@
   .fk\:min-h-\[2\.5rem\] {
     min-height: 2.5rem;
   }
-  .fk\:min-h-\[2\.375rem\] {
-    min-height: 2.375rem;
-  }
   .fk\:min-h-\[3\.5rem\] {
     min-height: 3.5rem;
   }
@@ -1346,12 +1368,18 @@
   .fk\:w-28 {
     width: calc(var(--fk-spacing) * 28);
   }
+  .fk\:w-44 {
+    width: calc(var(--fk-spacing) * 44);
+  }
   .fk\:w-48 {
     width: calc(var(--fk-spacing) * 48);
   }
   .fk\:w-48\! {
     width: calc(var(--fk-spacing) * 48) !important;
   }
+  .fk\:w-50 {
+    width: calc(var(--fk-spacing) * 50);
+  }
   .fk\:w-52 {
     width: calc(var(--fk-spacing) * 52);
   }
@@ -1382,9 +1410,6 @@
   .fk\:w-\[150px\] {
     width: 150px;
   }
-  .fk\:w-\[200px\] {
-    width: 200px;
-  }
   .fk\:w-\[350px\] {
     width: 350px;
   }
@@ -1418,6 +1443,9 @@
   .fk\:max-w-screen-lg {
     max-width: var(--fk-breakpoint-lg);
   }
+  .fk\:max-w-xs {
+    max-width: var(--fk-container-xs);
+  }
   .fk\:min-w-\(--cell-size\) {
     min-width: var(--cell-size);
   }
@@ -1599,6 +1627,9 @@
   .fk\:justify-items-start {
     justify-items: start;
   }
+  .fk\:gap-0 {
+    gap: calc(var(--fk-spacing) * 0);
+  }
   .fk\:gap-0\.5 {
     gap: calc(var(--fk-spacing) * 0.5);
   }
@@ -1705,9 +1736,6 @@
   .fk\:overflow-visible {
     overflow: visible;
   }
-  .fk\:overflow-x-auto {
-    overflow-x: auto;
-  }
   .fk\:overflow-x-hidden {
     overflow-x: hidden;
   }
@@ -1896,6 +1924,12 @@
       background-color: color-mix(in oklab, hsl(var(--muted)) 50%, transparent);
     }
   }
+  .fk\:bg-muted\/80 {
+    background-color: hsl(var(--muted));
+    @supports (color: color-mix(in lab, red, red)) {
+      background-color: color-mix(in oklab, hsl(var(--muted)) 80%, transparent);
+    }
+  }
   .fk\:bg-overlay\/75 {
     background-color: hsl(var(--overlay));
     @supports (color: color-mix(in lab, red, red)) {
@@ -1956,6 +1990,9 @@
   .fk\:p-0 {
     padding: calc(var(--fk-spacing) * 0);
   }
+  .fk\:p-0\.5 {
+    padding: calc(var(--fk-spacing) * 0.5);
+  }
   .fk\:p-1 {
     padding: calc(var(--fk-spacing) * 1);
   }
@@ -1980,6 +2017,9 @@
   .fk\:px-\(--cell-size\) {
     padding-inline: var(--cell-size);
   }
+  .fk\:px-0\.5 {
+    padding-inline: calc(var(--fk-spacing) * 0.5);
+  }
   .fk\:px-1 {
     padding-inline: calc(var(--fk-spacing) * 1);
   }
@@ -2055,6 +2095,9 @@
   .fk\:pr-3 {
     padding-right: calc(var(--fk-spacing) * 3);
   }
+  .fk\:pr-4 {
+    padding-right: calc(var(--fk-spacing) * 4);
+  }
   .fk\:pr-6 {
     padding-right: calc(var(--fk-spacing) * 6);
   }
@@ -2064,8 +2107,8 @@
   .fk\:pr-9 {
     padding-right: calc(var(--fk-spacing) * 9);
   }
-  .fk\:pr-10 {
-    padding-right: calc(var(--fk-spacing) * 10);
+  .fk\:pb-0 {
+    padding-bottom: calc(var(--fk-spacing) * 0);
   }
   .fk\:pb-1\.5 {
     padding-bottom: calc(var(--fk-spacing) * 1.5);
@@ -2079,8 +2122,8 @@
   .fk\:pl-0 {
     padding-left: calc(var(--fk-spacing) * 0);
   }
-  .fk\:pl-0\! {
-    padding-left: calc(var(--fk-spacing) * 0) !important;
+  .fk\:pl-1\! {
+    padding-left: calc(var(--fk-spacing) * 1) !important;
   }
   .fk\:pl-2 {
     padding-left: calc(var(--fk-spacing) * 2);
@@ -2190,6 +2233,9 @@
   .fk\:text-balance {
     text-wrap: balance;
   }
+  .fk\:wrap-break-word {
+    overflow-wrap: break-word;
+  }
   .fk\:whitespace-nowrap {
     white-space: nowrap;
   }
@@ -2232,6 +2278,9 @@
       color: color-mix(in oklab, hsl(var(--foreground)) 60%, transparent);
     }
   }
+  .fk\:text-inherit {
+    color: inherit;
+  }
   .fk\:text-link {
     color: hsl(var(--link));
   }
@@ -2268,6 +2317,9 @@
       color: color-mix(in oklab, hsl(var(--sidebar-foreground)) 70%, transparent);
     }
   }
+  .fk\:text-success {
+    color: hsl(var(--success));
+  }
   .fk\:text-white {
     color: var(--fk-color-white);
   }
@@ -2296,6 +2348,9 @@
   .fk\:opacity-0 {
     opacity: 0%;
   }
+  .fk\:opacity-4 {
+    opacity: 4%;
+  }
   .fk\:opacity-40 {
     opacity: 40%;
   }
@@ -2305,6 +2360,9 @@
   .fk\:opacity-70 {
     opacity: 70%;
   }
+  .fk\:opacity-100 {
+    opacity: 100%;
+  }
   .fk\:shadow-\[0_0_0_1px_hsl\(var\(--sidebar-border\)\)\] {
     --tw-shadow: 0 0 0 1px var(--tw-shadow-color, hsl(var(--sidebar-border)));
     box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
@@ -2321,6 +2379,10 @@
     --tw-shadow: 0 0 #0000;
     box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
   }
+  .fk\:shadow-sm {
+    --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
+    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
+  }
   .fk\:shadow-xl {
     --tw-shadow: 0 20px 25px -5px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 8px 10px -6px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
     box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
@@ -2333,6 +2395,10 @@
     --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(0px + 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);
   }
+  .fk\:ring-1 {
+    --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);
+  }
   .fk\:ring-2 {
     --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + 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);
@@ -2340,6 +2406,12 @@
   .fk\:ring-background {
     --tw-ring-color: hsl(var(--background));
   }
+  .fk\:ring-border\/60 {
+    --tw-ring-color: hsl(var(--border));
+    @supports (color: color-mix(in lab, red, red)) {
+      --tw-ring-color: color-mix(in oklab, hsl(var(--border)) 60%, transparent);
+    }
+  }
   .fk\:ring-ring {
     --tw-ring-color: hsl(var(--ring));
   }
@@ -2391,6 +2463,11 @@
     transition-timing-function: var(--tw-ease, var(--fk-default-transition-timing-function));
     transition-duration: var(--tw-duration, var(--fk-default-transition-duration));
   }
+  .fk\:transition-\[transform\,background-color\] {
+    transition-property: transform,background-color;
+    transition-timing-function: var(--tw-ease, var(--fk-default-transition-timing-function));
+    transition-duration: var(--tw-duration, var(--fk-default-transition-duration));
+  }
   .fk\:transition-\[width\,height\,padding\] {
     transition-property: width,height,padding;
     transition-timing-function: var(--tw-ease, var(--fk-default-transition-timing-function));
@@ -2429,6 +2506,14 @@
   .fk\:transition-none {
     transition-property: none;
   }
+  .fk\:duration-75 {
+    --tw-duration: 75ms;
+    transition-duration: 75ms;
+  }
+  .fk\:duration-100 {
+    --tw-duration: 100ms;
+    transition-duration: 100ms;
+  }
   .fk\:duration-200 {
     --tw-duration: 200ms;
     transition-duration: 200ms;
@@ -2441,6 +2526,10 @@
     --tw-ease: linear;
     transition-timing-function: linear;
   }
+  .fk\:ease-out {
+    --tw-ease: var(--fk-ease-out);
+    transition-timing-function: var(--fk-ease-out);
+  }
   .fk\:animate-in {
     animation-name: enter;
     animation-duration: 150ms;
@@ -2461,6 +2550,12 @@
   .fk\:\[--cell-size\:--spacing\(8\)\] {
     --cell-size: calc(var(--fk-spacing) * 8);
   }
+  .fk\:duration-75 {
+    animation-duration: 75ms;
+  }
+  .fk\:duration-100 {
+    animation-duration: 100ms;
+  }
   .fk\:duration-200 {
     animation-duration: 200ms;
   }
@@ -2470,6 +2565,9 @@
   .fk\:ease-linear {
     animation-timing-function: linear;
   }
+  .fk\:ease-out {
+    animation-timing-function: cubic-bezier(0, 0, 0.2, 1);
+  }
   .fk\:fade-in-0 {
     --tw-enter-opacity: 0;
   }
@@ -2481,6 +2579,13 @@
       opacity: 100%;
     }
   }
+  .fk\:group-hover\/copyable\:opacity-100 {
+    &:is(:where(.fk\:group\/copyable):hover *) {
+      @media (hover: hover) {
+        opacity: 100%;
+      }
+    }
+  }
   .fk\:group-hover\/menu-item\:opacity-100 {
     &:is(:where(.fk\:group\/menu-item):hover *) {
       @media (hover: hover) {
@@ -2488,6 +2593,11 @@
       }
     }
   }
+  .fk\:group-focus-visible\/copyable\:opacity-100 {
+    &:is(:where(.fk\:group\/copyable):focus-visible *) {
+      opacity: 100%;
+    }
+  }
   .fk\:group-has-data-\[sidebar\=menu-action\]\/menu-item\:pr-8 {
     &:is(:where(.fk\:group\/menu-item):has(*[data-sidebar="menu-action"]) *) {
       padding-right: calc(var(--fk-spacing) * 8);
@@ -3491,6 +3601,25 @@
       outline-color: hsl(var(--ring));
     }
   }
+  .fk\:active\:translate-y-px {
+    &:active {
+      --tw-translate-y: 1px;
+      translate: var(--tw-translate-x) var(--tw-translate-y);
+    }
+  }
+  .fk\:active\:scale-\[0\.98\] {
+    &:active {
+      scale: 0.98;
+    }
+  }
+  .fk\:active\:bg-muted\/70 {
+    &:active {
+      background-color: hsl(var(--muted));
+      @supports (color: color-mix(in lab, red, red)) {
+        background-color: color-mix(in oklab, hsl(var(--muted)) 70%, transparent);
+      }
+    }
+  }
   .fk\:active\:bg-sidebar-accent {
     &:active {
       background-color: hsl(var(--sidebar-accent));
@@ -4625,6 +4754,11 @@
       padding-inline: calc(var(--fk-spacing) * 0);
     }
   }
+  .fk\:lg\:px-3 {
+    @media (width >= 64rem) {
+      padding-inline: calc(var(--fk-spacing) * 3);
+    }
+  }
   .fk\:dark\:border-input {
     &:is([style="color-scheme: dark;"] *) {
       border-color: hsl(var(--input));

package/dist/index.d.ts

@@ -1,11 +1,11 @@
 import * as React$1 from 'react';
 import React__default, { Dispatch, JSX, SetStateAction, UIEvent, ReactElement } from 'react';
-import { A as AppContextType, a as ActionSetRelationship, b as ActionSetScope, C as Config, c as AppOptions, E as Entity, P as PluginOptions, d as ProjectOptions, O as OrderedAssetValue, e as SearchRequestProps, f as SearchResultItem, U as UseEntityQueryParams, M as MappedEntityItem, F as FormEntityItem, I as ImageValue, g as Schema, h as EntityData, i as AttributeValue, j as Attribute, k as MultipleRelationshipConnection, l as SingleRelationshipConnection } from './types.d-Da7sP-Fn.js';
-export { D as DataType, m as FormFieldParams, n as FormFieldProps, o as FormFieldValue, L as LogoProps, p as ScopeType, S as SingleProject } from './types.d-Da7sP-Fn.js';
+import { A as AppContextType, a as ActionSetRelationship, b as ActionSetScope, C as Config, c as AppOptions, E as Entity, P as PluginOptions, d as ProjectOptions, O as OrderedAssetValue, e as SearchRequestProps, f as SearchResultItem, U as UseEntityQueryParams, M as MappedEntityItem, F as FormEntityItem, I as ImageValue, g as Schema, h as AttributeValue, i as Attribute, j as MultipleRelationshipConnection, k as SingleRelationshipConnection } from './types.d-DiQPwK_q.js';
+export { D as DataType, l as DefaultValue, m as DefaultValueByDataType, n as EntityData, o as FormFieldParams, p as FormFieldProps, q as FormFieldValue, L as LogoProps, r as ScopeType, S as SingleProject } from './types.d-DiQPwK_q.js';
 export { Outlet, useLocation, useParams } from 'react-router-dom';
 import { OperationVariables, DocumentNode, ErrorLike } from '@apollo/client';
 export { gql } from '@apollo/client';
-import { Column, Row, ColumnDef, Table, RowSelectionState } from '@tanstack/react-table';
+import { Column, Row, ColumnDef, Table, RowSelectionState, OnChangeFn, SortingState } from '@tanstack/react-table';
 export { ColumnDef, ColumnFiltersState, Table as ReactTable, Row, RowSelectionState, SortingState, TableMeta, Updater, VisibilityState, flexRender, getCoreRowModel, getFacetedRowModel, getFacetedUniqueValues, getFilteredRowModel, getPaginationRowModel, getSortedRowModel, useReactTable } from '@tanstack/react-table';
 export { useVirtualizer } from '@tanstack/react-virtual';
 import * as react_jsx_runtime from 'react/jsx-runtime';
@@ -122,13 +122,15 @@ type FetchMoreOptions = {
         limit: number;
     };
 };
-declare function useEntityQuery({ entityNamePlural, schema, scope, variables, isForm }: UseEntityQueryParams): {
+declare function useEntityQuery({ entityNamePlural, schema, scope, variables, isForm, selection, }: UseEntityQueryParams): {
     count: number;
     data: MappedEntityItem[] | FormEntityItem[] | ImageValue[] | undefined;
     fetchMore: (args: FetchMoreOptions) => void;
     isLoading: boolean;
+    isLoadingMore: boolean;
     isProjectDisabled: boolean;
     isProjectReadOnly: boolean;
+    reload: () => void;
     schemaErrorMessage: string | null;
 };
 
@@ -146,20 +148,52 @@ type EntityMutationResponse = [
 ];
 declare function useEntityMutation(): EntityMutationResponse;
 
+/**
+ * Soft-refetch active list queries for an entity without clearing the current rows first.
+ * Prefer this after mutations; use `useEntityQuery().reload` when an explicit loading state is desired.
+ */
+declare function useRefreshEntityList(entityNameOrPlural: string): () => Promise<void>;
+
+type EntityListRowPatch = {
+    _id: string;
+    attributes: {
+        [key: string]: string;
+    };
+};
+
+/**
+ * Patch active list rows for an entity without a soft-refetch.
+ * Prefer this after mutations that only change row fields (e.g. tag connect/disconnect).
+ */
+declare function usePatchEntityList(entityNameOrPlural: string): (patches: EntityListRowPatch[]) => void;
+
 type EntityQuery = {
     queryEntityName: string;
     query: string;
 };
-declare function getEntityQuery(entityNamePlural: string, scope: string, schema: Schema): EntityQuery;
+declare function getEntityQuery(entityNamePlural: string, scope: string, schema: Schema, options?: {
+    selection?: 'list' | 'full';
+}): EntityQuery;
 /**
  * Returns a string with the GraphQl query needed to mutate the dataToMutate object for the given entity and scope.
  */
-declare function getEntityUpdateMutation(entityNamePlural: string, entityId: string, scope: string, schema: Schema, originalData: FormEntityItem, dataToMutate: EntityData): string;
+declare function getEntityUpdateMutation(entityNamePlural: string, entityId: string, scope: string, schema: Schema, originalData: FormEntityItem, dataToMutate: FormEntityItem, options?: {
+    responseFields?: string;
+}): string;
 /**
- * Returns a string with the GraphQl mutation needed to delete an entity.
+ * Returns a string with the GraphQl mutation needed to delete one or more entities.
  */
-declare function getEntityDeleteMutation(entityName: string, schema: Schema, _id: string): string;
-declare function getEntityCreateMutation(entityNamePlural: string, schema: Schema, entityData: EntityData, _id: string): string;
+declare function getEntityDeleteMutation(entityName: string, schema: Schema, ids: string | readonly string[]): string;
+declare function getEntityDeleteWhere(ids: string | readonly string[]): {
+    _id: {
+        eq: string;
+    };
+} | {
+    _id: {
+        in: string[];
+    };
+};
+declare function getEntityCreateMutation(entityNamePlural: string, schema: Schema, entityData: FormEntityItem, _id: string): string;
 declare function getEntitySchema(schema: Schema, entityNamePlural: string): Entity | undefined;
 
 interface DataTableFacetedFilterProps<TData, TValue> {
@@ -179,12 +213,20 @@ type Props<TData> = {
     attributesSchema: Attribute[];
     checkboxSelect?: 'single' | 'multiple';
     actionsComponent?: (row: Row<TData>) => JSX.Element;
+    enableColumnSorting?: boolean;
 };
 type ColumnDefinition<TData extends AttributeValue, TValue> = ColumnDef<TData, TValue> & {
     id?: string;
     size: number;
 };
-declare function useGridColumnsDefinition<TData extends AttributeValue, TValue>({ attributesSchema, checkboxSelect, actionsComponent, }: Props<TData>): ColumnDefinition<TData, TValue>[];
+declare function useGridColumnsDefinition<TData extends AttributeValue, TValue>({ attributesSchema, checkboxSelect, actionsComponent, enableColumnSorting, }: Props<TData>): ColumnDefinition<TData, TValue>[];
+
+interface DataTableColumnHeaderProps<TData, TValue> {
+    column: Column<TData, TValue>;
+    title: string;
+    className?: string;
+}
+declare function DataTableColumnHeader<TData, TValue>({ column, title, className, }: DataTableColumnHeaderProps<TData, TValue>): JSX.Element;
 
 interface DataTableRowActionsProps<TData> {
     entityName: string;
@@ -197,11 +239,18 @@ interface DataTableRowActionsProps<TData> {
 }
 declare function DataTableRowActions<TData>({ entityName, entityNamePlural, row, options, }: DataTableRowActionsProps<TData>): JSX.Element;
 
+interface DataTableSortedByProps<TData> {
+    table: Table<TData>;
+}
+declare function DataTableSortedBy<TData>({ table }: DataTableSortedByProps<TData>): JSX.Element | null;
+
 interface DataTableToolbarProps<TData> {
     entityName: string;
+    isReloading?: boolean;
+    onReload?: () => void;
     table: Table<TData>;
 }
-declare function DataTableToolbar<TData>({ entityName, table }: DataTableToolbarProps<TData>): JSX.Element;
+declare function DataTableToolbar<TData>({ entityName, isReloading, onReload, table, }: DataTableToolbarProps<TData>): JSX.Element;
 
 interface DataTableViewOptionsProps<TData> {
     table: Table<TData>;
@@ -212,21 +261,28 @@ interface DataTableProps<TData extends AttributeValue, TValue> {
     classNames?: {
         wrapper?: string;
         table?: string;
+        tableContainer?: string;
         row?: string;
     };
     columns: ColumnDef<AttributeValue, TValue>[];
     data: TData[];
     entityName: string;
+    hasMore?: boolean;
     initialSelectionState?: RowSelectionState;
+    isLoadingMore?: boolean;
     onEntitySelectionChange?: (rowSelection: string[]) => void;
+    onLoadMore?: () => void;
     onScroll?: (event: UIEvent<HTMLDivElement>) => void;
+    onSortingChange?: OnChangeFn<SortingState>;
     pageSize?: number;
     rowHeightEstimate?: number;
     rowAdditionState?: MultipleRelationshipConnection;
     rowDeletionState?: string[];
+    scrollToTopKey?: number;
+    sorting?: SortingState;
     toolbarComponent?: (table: Table<AttributeValue>) => ReactElement;
 }
-declare function DataTable<TData extends AttributeValue, TValue>({ classNames, columns, data, initialSelectionState, onEntitySelectionChange, onScroll, pageSize, rowHeightEstimate, rowAdditionState, rowDeletionState, toolbarComponent, }: DataTableProps<TData, TValue>): JSX.Element;
+declare function DataTable<TData extends AttributeValue, TValue>({ classNames, columns, data, entityName, hasMore, initialSelectionState, isLoadingMore, onEntitySelectionChange, onLoadMore, onScroll, onSortingChange, pageSize, rowHeightEstimate, rowAdditionState, rowDeletionState, scrollToTopKey, sorting: sortingProp, toolbarComponent, }: DataTableProps<TData, TValue>): JSX.Element;
 
 type Action = ActionAddEntity | ActionEditEntity | ActionEditRelationship | ActionDeleteEntity | ActionDismiss | ActionAlertDialog;
 type ActionAddEntity = {
@@ -263,7 +319,8 @@ type ActionDeleteEntity = {
     _id?: string;
     type: 'DeleteEntity';
     payload: {
-        entityId: string;
+        /** One id, or many ids for a single batch delete mutation. */
+        entityId: string | string[];
         entityName: string;
         silent?: boolean;
     };
@@ -297,4 +354,4 @@ declare const assetSchema: Entity;
 
 declare const tagSchema: Entity;
 
-export { AppOptions, Attribute, AttributeValue, type ConfigContext, DataTable, DataTableFacetedFilter, DataTableRowActions, DataTableToolbar, DataTableViewOptions, DefaultValueSwitch, Entity, EntityData, FlexkitStudio, FormEntityItem, IMAGES_BASE_URL, MappedEntityItem, PluginOptions, ProjectDisabled, Schema, SchemaError, SearchRequestProps, SearchResultItem, type UploadedFileResult, assetSchema, defineConfig, defineEntity, getEntityCreateMutation, getEntityDeleteMutation, getEntityQuery, getEntitySchema, getEntityUpdateMutation, tagSchema, useAppContext, useAppDispatch, useAuth, useConfig, useDispatch, useEntityMutation, useEntityQuery, useGraphQLError, useGridColumnsDefinition, useSearch, useUploadAssets };
+export { AppOptions, Attribute, AttributeValue, type ConfigContext, DataTable, DataTableColumnHeader, DataTableFacetedFilter, DataTableRowActions, DataTableSortedBy, DataTableToolbar, DataTableViewOptions, DefaultValueSwitch, Entity, type EntityListRowPatch, FlexkitStudio, FormEntityItem, IMAGES_BASE_URL, MappedEntityItem, PluginOptions, ProjectDisabled, Schema, SchemaError, SearchRequestProps, SearchResultItem, type UploadedFileResult, assetSchema, defineConfig, defineEntity, getEntityCreateMutation, getEntityDeleteMutation, getEntityDeleteWhere, getEntityQuery, getEntitySchema, getEntityUpdateMutation, tagSchema, useAppContext, useAppDispatch, useAuth, useConfig, useDispatch, useEntityMutation, useEntityQuery, useGraphQLError, useGridColumnsDefinition, usePatchEntityList, useRefreshEntityList, useSearch, useUploadAssets };