@mittwald/flow-react-components 1.6.0-next.5 → 1.6.0-next.51

package/dist/js/packages/components/src/components/List/model/List.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"List.mjs","names":["BatchesController"],"sources":["../../../../../../../../src/components/List/model/List.ts"],"sourcesContent":["import { ItemCollection } from \"@/components/List/model/item/ItemCollection\";\nimport { BatchesController } from \"@/components/List/model/pagination/BatchesController\";\nimport { Filter } from \"./filter/Filter\";\nimport { Sorting } from \"@/components/List/model/sorting/Sorting\";\nimport ReactTable from \"@/components/List/model/ReactTable\";\nimport type {\n  EmptyViewType,\n  GetItemId,\n  ItemActionFn,\n  ListSettingsStorageDefaults,\n  ListShape,\n  ListSupportedComponentProps,\n} from \"@/components/List/model/types\";\nimport { IncrementalLoader } from \"@/components/List/model/loading/IncrementalLoader\";\nimport invariant from \"invariant\";\nimport { Search } from \"@/components/List/model/search/Search\";\nimport { ItemView } from \"@/components/List/model/item/ItemView\";\nimport { Table } from \"@/components/List/model/table/Table\";\nimport { useEffect, type ReactNode } from \"react\";\nimport { ListSettingsStore } from \"./ListSettingsStore\";\nimport { ListViewMode } from \"./ListViewMode\";\nimport { useSettings } from \"@/components/SettingsProvider/SettingsProvider\";\nimport { DateRangeFilter } from \"@/components/List/model/filter/DateRangeFilter\";\nimport { useWarnDeprecation } from \"@/components/DeprecationWarningProvider\";\nimport type {\n  ListModelContext,\n  ListSettingsPort,\n} from \"@mittwald/flow-components-base\";\nimport type { Table as ReactTableInstance } from \"@tanstack/table-core\";\n\nexport class List<T = unknown, TMeta = unknown> implements ListModelContext<T> {\n  public readonly filters: (\n    Filter<T, never, never> | DateRangeFilter<T, never>\n  )[];\n  public readonly itemView?: ItemView<T>;\n  public readonly table?: Table<T>;\n  public readonly search?: Search<T>;\n  public readonly sorting: Sorting<T>[];\n  public readonly items: ItemCollection<T>;\n  public readonly reactTable: ReactTable<T>;\n  public readonly batches: BatchesController<T>;\n  public readonly loader: IncrementalLoader<T>;\n  public readonly onAction?: ItemActionFn<T>;\n  public readonly accordion: boolean;\n  public readonly infiniteScroll: boolean;\n  public readonly getItemId?: GetItemId<T>;\n  public readonly componentProps: ListSupportedComponentProps;\n  public metadata?: TMeta;\n  public readonly settingsStorage?: ListSettingsStore<T>;\n  public readonly loadingItemsCount;\n  public readonly viewMode: ListViewMode<T>;\n  public readonly emptyView?: ReactNode;\n  public readonly emptySearchResultView?: ReactNode;\n  public readonly settingsStorageDefaults?: ListSettingsStorageDefaults;\n\n  public constructor(shape: ListShape<T, TMeta>) {\n    const {\n      settingStorageKey,\n      itemView,\n      table,\n      filters = [],\n      sorting = [],\n      batchesController,\n      onChange,\n      loader,\n      search,\n      onAction,\n      getItemId,\n      defaultViewMode,\n      accordion = false,\n      infiniteScroll = false,\n      loadingItemsCount = 5,\n      settingsStorageDefaults,\n      emptyView,\n      emptySearchResultView,\n      ...componentProps\n    } = shape;\n\n    const warnDeprecation = useWarnDeprecation();\n    if (itemView?.fallback !== undefined) {\n      warnDeprecation(\n        \"The 'fallback' prop is deprecated and will be removed in a future release. Use 'loadingView' instead.\",\n      );\n    }\n\n    this.settingsStorageDefaults = settingsStorageDefaults;\n    const generalSettingsStore = useSettings();\n\n    this.settingsStorage =\n      settingStorageKey && generalSettingsStore\n        ? new ListSettingsStore(this, generalSettingsStore, {\n            storageKey: settingStorageKey,\n          })\n        : undefined;\n\n    this.items = new ItemCollection(this);\n    this.filters = filters.map((shape) =>\n      shape.mode === \"dateRange\"\n        ? new DateRangeFilter(this, shape)\n        : new Filter(this, shape),\n    );\n    this.sorting = sorting.map((shape) => new Sorting<T>(this, shape));\n    this.search = search ? new Search(this, search) : undefined;\n    this.itemView = itemView ? new ItemView(this, itemView) : undefined;\n    this.accordion = accordion;\n    this.infiniteScroll = infiniteScroll;\n    this.table = table ? new Table(this, table) : undefined;\n    this.batches = new BatchesController(this, batchesController);\n\n    /*\n     * The controller no longer subscribes itself: the filters and the search\n     * are this list's, and handing a list of concrete filters to a shared\n     * model is the `Table<never>` variance trap. `IncrementalLoader` still\n     * subscribes in its own constructor, which runs right after this, so the\n     * order of the two resets is unchanged.\n     */\n    this.filters.forEach((f) => f.onFilterUpdated(() => this.batches.reset()));\n    this.search?.onUpdated(() => this.batches.reset());\n    this.componentProps = componentProps;\n    /*\n     * Before the loader: its state takes `getItemId` over in its constructor,\n     * and a loader built first would never deduplicate.\n     */\n    this.getItemId = getItemId;\n    this.loader = IncrementalLoader.useNew<T>(this, loader);\n    this.onAction = onAction;\n    this.loadingItemsCount = loadingItemsCount;\n    this.reactTable = ReactTable.useNew(this, onChange, {\n      manualFiltering: this.loader.manualFiltering,\n      manualPagination: this.loader.manualPagination,\n      manualSorting: this.loader.manualSorting,\n    });\n    this.viewMode = ListViewMode.useNew(this, { defaultViewMode });\n    this.emptyView = emptyView;\n    this.emptySearchResultView = emptySearchResultView;\n\n    useEffect(() => {\n      this.filters.forEach((f) => f.deleteUnknownFilterValues());\n    }, [this.filters]);\n  }\n\n  /*\n   * `ListModelContext` — what the shared model in\n   * `@mittwald/flow-components-base` reaches for, so `Sorting` and `Search` can\n   * keep being handed the list itself. Getters, because the model is built\n   * before the table is.\n   */\n  public get dataTable(): ReactTableInstance<T> {\n    return this.reactTable.table;\n  }\n\n  public get settings(): ListSettingsPort | undefined {\n    return this.settingsStorage;\n  }\n\n  public get settingsDefaults(): ListSettingsStorageDefaults | undefined {\n    return this.settingsStorageDefaults;\n  }\n\n  public getEmptyViewType(): EmptyViewType {\n    return this.hasActiveFilters || this.search?.isSet ? \"search\" : \"list\";\n  }\n\n  public get hasActiveFilters(): boolean {\n    return this.filters.some((f) => f.isActive());\n  }\n\n  public get visibleSorting() {\n    return this.sorting.filter((s) => s.initialEnabled !== \"hidden\");\n  }\n\n  public static useNew<T, TMeta = unknown>(\n    shape: ListShape<T, TMeta>,\n  ): List<T, TMeta> {\n    return new List<T, TMeta>(shape);\n  }\n\n  public getSorting(id: string): Sorting<T> {\n    const sorting = this.sorting.find((s) => s.id === id);\n    invariant(!!sorting, `Could not get Sorting (ID: ${id})`);\n    return sorting;\n  }\n\n  public clearSorting(): void {\n    return this.sorting.forEach((s) => s.clear());\n  }\n\n  public resetFilters(): void {\n    return this.filters.forEach((f) => f.resetValues());\n  }\n\n  public clearFilters(): void {\n    return this.filters.forEach((f) => f.clear());\n  }\n\n  public useIsEmpty(): boolean {\n    return !this.loader.useIsLoading() && this.items.entries.length === 0;\n  }\n}\n\nexport default List;\n"],"mappings":"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"}
+{"version":3,"file":"List.mjs","names":["BatchesController"],"sources":["../../../../../../../../src/components/List/model/List.ts"],"sourcesContent":["import { ItemCollection } from \"@/components/List/model/item/ItemCollection\";\nimport { BatchesController } from \"@/components/List/model/pagination/BatchesController\";\nimport { Filter } from \"./filter/Filter\";\nimport { Sorting } from \"@/components/List/model/sorting/Sorting\";\nimport ReactTable from \"@/components/List/model/ReactTable\";\nimport type {\n  EmptyViewType,\n  GetItemId,\n  ItemActionFn,\n  ListSettingsStorageDefaults,\n  ListShape,\n  ListSupportedComponentProps,\n} from \"@/components/List/model/types\";\nimport { IncrementalLoader } from \"@/components/List/model/loading/IncrementalLoader\";\nimport invariant from \"invariant\";\nimport { Search } from \"@/components/List/model/search/Search\";\nimport { ItemView } from \"@/components/List/model/item/ItemView\";\nimport { Table } from \"@/components/List/model/table/Table\";\nimport { useEffect, type ReactNode } from \"react\";\nimport { ListSettingsStore } from \"./ListSettingsStore\";\nimport { ListViewMode } from \"./ListViewMode\";\nimport { useSettings } from \"@/components/SettingsProvider/SettingsProvider\";\nimport { DateRangeFilter } from \"@/components/List/model/filter/DateRangeFilter\";\nimport { useWarnDeprecation } from \"@/components/DeprecationWarningProvider\";\nimport type {\n  ListModelContext,\n  ListSettingsPort,\n} from \"@mittwald/flow-components-base\";\nimport type { Table as ReactTableInstance } from \"@tanstack/table-core\";\n\nexport class List<T = unknown, TMeta = unknown> implements ListModelContext<T> {\n  public readonly filters: (\n    Filter<T, never, never> | DateRangeFilter<T, never>\n  )[];\n  public readonly itemView?: ItemView<T>;\n  public readonly table?: Table<T>;\n  public readonly search?: Search<T>;\n  public readonly sorting: Sorting<T>[];\n  public readonly items: ItemCollection<T>;\n  public readonly reactTable: ReactTable<T>;\n  public readonly batches: BatchesController<T>;\n  public readonly loader: IncrementalLoader<T>;\n  public readonly onAction?: ItemActionFn<T>;\n  public readonly accordion: boolean;\n  public readonly infiniteScroll: boolean;\n  public readonly getItemId?: GetItemId<T>;\n  public readonly componentProps: ListSupportedComponentProps;\n  public metadata?: TMeta;\n  public readonly settingsStorage?: ListSettingsStore<T>;\n  public readonly loadingItemsCount;\n  public readonly viewMode: ListViewMode<T>;\n  public readonly emptyView?: ReactNode;\n  public readonly emptySearchResultView?: ReactNode;\n  public readonly settingsStorageDefaults?: ListSettingsStorageDefaults;\n\n  public constructor(shape: ListShape<T, TMeta>) {\n    const {\n      settingStorageKey,\n      itemView,\n      table,\n      filters = [],\n      sorting = [],\n      batchesController,\n      onChange,\n      loader,\n      search,\n      onAction,\n      getItemId,\n      defaultViewMode,\n      accordion = false,\n      infiniteScroll = false,\n      loadingItemsCount = 5,\n      settingsStorageDefaults,\n      emptyView,\n      emptySearchResultView,\n      ...componentProps\n    } = shape;\n\n    const warnDeprecation = useWarnDeprecation();\n    if (itemView?.fallback !== undefined) {\n      warnDeprecation(\n        \"The 'fallback' prop is deprecated and will be removed in a future release. Use 'loadingView' instead.\",\n      );\n    }\n    if (itemView?.dependencies !== undefined) {\n      warnDeprecation(\n        \"The 'dependencies' prop of 'List.Item' is deprecated and will be removed in a future release. Use 'renderDependencies' instead.\",\n      );\n    }\n\n    this.settingsStorageDefaults = settingsStorageDefaults;\n    const generalSettingsStore = useSettings();\n\n    this.settingsStorage =\n      settingStorageKey && generalSettingsStore\n        ? new ListSettingsStore(this, generalSettingsStore, {\n            storageKey: settingStorageKey,\n          })\n        : undefined;\n\n    this.items = new ItemCollection(this);\n    this.filters = filters.map((shape) =>\n      shape.mode === \"dateRange\"\n        ? new DateRangeFilter(this, shape)\n        : new Filter(this, shape),\n    );\n    this.sorting = sorting.map((shape) => new Sorting<T>(this, shape));\n    this.search = search ? new Search(this, search) : undefined;\n    this.itemView = itemView ? new ItemView(this, itemView) : undefined;\n    this.accordion = accordion;\n    this.infiniteScroll = infiniteScroll;\n    this.table = table ? new Table(this, table) : undefined;\n    this.batches = new BatchesController(this, batchesController);\n\n    /*\n     * The controller no longer subscribes itself: the filters and the search\n     * are this list's, and handing a list of concrete filters to a shared\n     * model is the `Table<never>` variance trap. `IncrementalLoader` still\n     * subscribes in its own constructor, which runs right after this, so the\n     * order of the two resets is unchanged.\n     */\n    this.filters.forEach((f) => f.onFilterUpdated(() => this.batches.reset()));\n    this.search?.onUpdated(() => this.batches.reset());\n    this.componentProps = componentProps;\n    /*\n     * Before the loader: its state takes `getItemId` over in its constructor,\n     * and a loader built first would never deduplicate.\n     */\n    this.getItemId = getItemId;\n    this.loader = IncrementalLoader.useNew<T>(this, loader);\n    this.onAction = onAction;\n    this.loadingItemsCount = loadingItemsCount;\n    this.reactTable = ReactTable.useNew(this, onChange, {\n      manualFiltering: this.loader.manualFiltering,\n      manualPagination: this.loader.manualPagination,\n      manualSorting: this.loader.manualSorting,\n    });\n    this.viewMode = ListViewMode.useNew(this, { defaultViewMode });\n    this.emptyView = emptyView;\n    this.emptySearchResultView = emptySearchResultView;\n\n    useEffect(() => {\n      this.filters.forEach((f) => f.deleteUnknownFilterValues());\n    }, [this.filters]);\n  }\n\n  /*\n   * `ListModelContext` — what the shared model in\n   * `@mittwald/flow-components-base` reaches for, so `Sorting` and `Search` can\n   * keep being handed the list itself. Getters, because the model is built\n   * before the table is.\n   */\n  public get dataTable(): ReactTableInstance<T> {\n    return this.reactTable.table;\n  }\n\n  public get settings(): ListSettingsPort | undefined {\n    return this.settingsStorage;\n  }\n\n  public get settingsDefaults(): ListSettingsStorageDefaults | undefined {\n    return this.settingsStorageDefaults;\n  }\n\n  public getEmptyViewType(): EmptyViewType {\n    return this.hasActiveFilters || this.search?.isSet ? \"search\" : \"list\";\n  }\n\n  public get hasActiveFilters(): boolean {\n    return this.filters.some((f) => f.isActive());\n  }\n\n  public get visibleSorting() {\n    return this.sorting.filter((s) => s.initialEnabled !== \"hidden\");\n  }\n\n  public static useNew<T, TMeta = unknown>(\n    shape: ListShape<T, TMeta>,\n  ): List<T, TMeta> {\n    return new List<T, TMeta>(shape);\n  }\n\n  public getSorting(id: string): Sorting<T> {\n    const sorting = this.sorting.find((s) => s.id === id);\n    invariant(!!sorting, `Could not get Sorting (ID: ${id})`);\n    return sorting;\n  }\n\n  public clearSorting(): void {\n    return this.sorting.forEach((s) => s.clear());\n  }\n\n  public resetFilters(): void {\n    return this.filters.forEach((f) => f.resetValues());\n  }\n\n  public clearFilters(): void {\n    return this.filters.forEach((f) => f.clear());\n  }\n\n  public useIsEmpty(): boolean {\n    return !this.loader.useIsLoading() && this.items.entries.length === 0;\n  }\n}\n\nexport default List;\n"],"mappings":"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"}

package/dist/js/packages/components/src/components/List/model/ListSettingsStore.mjs

@@ -1,7 +1,7 @@
 "use client"
 /* */
 import z from "zod";
-//#region src/components/List/model/ListSettingsStore.ts
+// src/components/List/model/ListSettingsStore.ts
 var supportedSettings = {
 	activeFilters: {
 		supports: {
@@ -65,7 +65,6 @@ var ListSettingsStore = class {
 		return (settings.supports.autosave && autosave ? getAutosavedValue() : void 0) ?? (settings.supports.manualSave && manualSave ? getManuallySavedValue() : void 0);
 	}
 };
-//#endregion
 export { ListSettingsStore };
 
 //# sourceMappingURL=ListSettingsStore.mjs.map

package/dist/js/packages/components/src/components/List/model/ListViewMode.mjs

@@ -1,10 +1,10 @@
 "use client"
 /* */
-import useSelector from "../../../lib/mobx/useSelector.mjs";
-import { useStatic } from "../../../lib/hooks/useStatic.mjs";
 import { ListViewMode as ListViewMode$1 } from "../../../../../components-base/src/list/viewMode/ListViewMode.mjs";
 import "../../../../../components-base/src/index.mjs";
-//#region src/components/List/model/ListViewMode.ts
+import useSelector from "../../../lib/mobx/useSelector.mjs";
+import { useStatic } from "../../../lib/hooks/useStatic.mjs";
+// src/components/List/model/ListViewMode.ts
 /**
 * React's view of the list's layout mode.
 *
@@ -41,7 +41,6 @@ var ListViewMode = class ListViewMode extends ListViewMode$1 {
 		return viewMode;
 	}
 };
-//#endregion
 export { ListViewMode };
 
 //# sourceMappingURL=ListViewMode.mjs.map

package/dist/js/packages/components/src/components/List/model/ReactTable.mjs

@@ -1,15 +1,15 @@
 "use client"
 /* */
-import useSelector from "../../../lib/mobx/useSelector.mjs";
-import { useStatic } from "../../../lib/hooks/useStatic.mjs";
 import { getListColumn } from "../../../../../components-base/src/list/ListModelContext.mjs";
 import { mergeHiddenSorting } from "../../../../../components-base/src/list/sorting/ListSorting.mjs";
 import { ListTable } from "../../../../../components-base/src/list/table/ListTable.mjs";
 import "../../../../../components-base/src/index.mjs";
+import useSelector from "../../../lib/mobx/useSelector.mjs";
+import { useStatic } from "../../../lib/hooks/useStatic.mjs";
 import { Filter } from "./filter/Filter.mjs";
 import { useEffect, useEffectEvent, useState } from "react";
 import { getCoreRowModel, getFacetedUniqueValues, getFilteredRowModel, getPaginationRowModel, getSortedRowModel } from "@tanstack/table-core";
-//#region src/components/List/model/ReactTable.ts
+// src/components/List/model/ReactTable.ts
 var ReactTable = class ReactTable {
 	list;
 	table;
@@ -103,7 +103,6 @@ var ReactTable = class ReactTable {
 		return Array.from(columnDefsMap.values());
 	}
 };
-//#endregion
 export { ReactTable, ReactTable as default };
 
 //# sourceMappingURL=ReactTable.mjs.map

package/dist/js/packages/components/src/components/List/model/filter/DateRangeFilter.mjs

@@ -2,14 +2,16 @@
 /* */
 import { ListDateRangeFilter } from "../../../../../../components-base/src/list/filter/ListDateRangeFilter.mjs";
 import "../../../../../../components-base/src/index.mjs";
-//#region src/components/List/model/filter/DateRangeFilter.tsx
+import { omit } from "remeda";
+// src/components/List/model/filter/DateRangeFilter.tsx
 /**
 * React's date-range filter.
 *
 * The column, the comparison and the stored value are `ListDateRangeFilter` in
 * `@mittwald/flow-components-base`, so the Vue binding filters the same dates
-* the same way. What is left here is the calendar's own options, which are
-* Flow's `RangeCalendar` props.
+* the same way. What is left here are the options of the fields that pick the
+* range: Flow's `RangeCalendar` props, or with `granularity: "minute"` those of
+* the date and time fields.
 */
 var DateRangeFilter = class extends ListDateRangeFilter {
 	dateRangeOptions;
@@ -17,6 +19,17 @@ var DateRangeFilter = class extends ListDateRangeFilter {
 		super(context, shape);
 		this.dateRangeOptions = shape.dateRangeOptions;
 	}
+	get granularity() {
+		return this.dateRangeOptions?.granularity ?? "day";
+	}
+	get rangeCalendarProps() {
+		const options = this.dateRangeOptions ?? {};
+		return options.granularity === "minute" ? {} : omit(options, ["granularity"]);
+	}
+	get dateTimeRangeOptions() {
+		const options = this.dateRangeOptions;
+		return options?.granularity === "minute" ? options : void 0;
+	}
 	getValue() {
 		return super.getValue();
 	}
@@ -34,7 +47,6 @@ var DateRangeFilter = class extends ListDateRangeFilter {
 		return super.getArrayValue();
 	}
 };
-//#endregion
 export { DateRangeFilter };
 
 //# sourceMappingURL=DateRangeFilter.mjs.map

package/dist/js/packages/components/src/components/List/model/filter/DateRangeFilter.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"DateRangeFilter.mjs","names":[],"sources":["../../../../../../../../../src/components/List/model/filter/DateRangeFilter.tsx"],"sourcesContent":["import { ListDateRangeFilter } from \"@mittwald/flow-components-base\";\nimport type { ListModelContext } from \"@mittwald/flow-components-base\";\nimport type { FilterShape } from \"@/components/List/model/filter/types\";\nimport type { PropertyName } from \"@/components/List/model/types\";\nimport type { RangeCalendarProps } from \"@/components/Calendar\";\nimport type { DateValue } from \"@internationalized/date\";\nimport type { DateRange, RangeValue } from \"react-aria-components\";\nimport type { ReactNode } from \"react\";\nimport type { List } from \"@/components/List/model/List\";\nimport type { FilterValue } from \"@/components/List/model/filter/FilterValue\";\n\n/**\n * React's date-range filter.\n *\n * The column, the comparison and the stored value are `ListDateRangeFilter` in\n * `@mittwald/flow-components-base`, so the Vue binding filters the same dates\n * the same way. What is left here is the calendar's own options, which are\n * Flow's `RangeCalendar` props.\n */\nexport class DateRangeFilter<\n  T = never,\n  TProp extends PropertyName<T> = never,\n> extends ListDateRangeFilter<T, TProp, ReactNode> {\n  public readonly dateRangeOptions?: RangeCalendarProps;\n\n  public constructor(\n    context: ListModelContext<T>,\n    shape: FilterShape<T, TProp, never>,\n  ) {\n    super(context, shape as never);\n    this.dateRangeOptions = shape.dateRangeOptions;\n  }\n\n  /*\n   * Narrowed back to react-aria's own types, because that is what the calendar\n   * takes and what this filter's consumers already have. The shared class is\n   * typed on the three numbers a date is made of, which every date library\n   * agrees on and nothing else does.\n   */\n  public override getValue(): DateRange | null {\n    return super.getValue() as DateRange | null;\n  }\n\n  public override setValue(range: RangeValue<DateValue> | null): void {\n    super.setValue(range as never);\n  }\n\n  /** The list this filter belongs to — `context`, typed as React's `List`. */\n  public get list(): List<T> {\n    return this.context as List<T>;\n  }\n\n  /* As in `Filter`: created by this filter, so each one's `filter` is React's. */\n  public override get values(): FilterValue[] {\n    return super.values as FilterValue[];\n  }\n\n  public override getArrayValue(): FilterValue[] {\n    return super.getArrayValue() as FilterValue[];\n  }\n}\n"],"mappings":";;;;;;;;;;;;;AAmBA,IAAa,kBAAb,cAGU,oBAAyC;CACjD;CAEA,YACE,SACA,OACA;EACA,MAAM,SAAS,KAAc;EAC7B,KAAK,mBAAmB,MAAM;CAChC;CAQA,WAA6C;EAC3C,OAAO,MAAM,SAAS;CACxB;CAEA,SAAyB,OAA2C;EAClE,MAAM,SAAS,KAAc;CAC/B;;CAGA,IAAW,OAAgB;EACzB,OAAO,KAAK;CACd;CAGA,IAAoB,SAAwB;EAC1C,OAAO,MAAM;CACf;CAEA,gBAA+C;EAC7C,OAAO,MAAM,cAAc;CAC7B;AACF"}
+{"version":3,"file":"DateRangeFilter.mjs","names":[],"sources":["../../../../../../../../../src/components/List/model/filter/DateRangeFilter.tsx"],"sourcesContent":["import { ListDateRangeFilter } from \"@mittwald/flow-components-base\";\nimport type { ListModelContext } from \"@mittwald/flow-components-base\";\nimport type {\n  DateRangeFilterOptions,\n  DateRangeFilterValue,\n  FilterShape,\n} from \"@/components/List/model/filter/types\";\nimport type { PropertyName } from \"@/components/List/model/types\";\nimport type { RangeCalendarProps } from \"@/components/Calendar\";\nimport type { ReactNode } from \"react\";\nimport { omit } from \"remeda\";\nimport type { List } from \"@/components/List/model/List\";\nimport type { FilterValue } from \"@/components/List/model/filter/FilterValue\";\n\n/**\n * React's date-range filter.\n *\n * The column, the comparison and the stored value are `ListDateRangeFilter` in\n * `@mittwald/flow-components-base`, so the Vue binding filters the same dates\n * the same way. What is left here are the options of the fields that pick the\n * range: Flow's `RangeCalendar` props, or with `granularity: \"minute\"` those of\n * the date and time fields.\n */\nexport class DateRangeFilter<\n  T = never,\n  TProp extends PropertyName<T> = never,\n> extends ListDateRangeFilter<T, TProp, ReactNode> {\n  public readonly dateRangeOptions?: DateRangeFilterOptions;\n\n  public constructor(\n    context: ListModelContext<T>,\n    shape: FilterShape<T, TProp, never>,\n  ) {\n    super(context, shape as never);\n    this.dateRangeOptions = shape.dateRangeOptions;\n  }\n\n  public get granularity(): \"day\" | \"minute\" {\n    return this.dateRangeOptions?.granularity ?? \"day\";\n  }\n\n  public get rangeCalendarProps(): RangeCalendarProps {\n    const options = this.dateRangeOptions ?? {};\n    return options.granularity === \"minute\"\n      ? {}\n      : omit(options, [\"granularity\"]);\n  }\n\n  public get dateTimeRangeOptions() {\n    const options = this.dateRangeOptions;\n    return options?.granularity === \"minute\" ? options : undefined;\n  }\n\n  /*\n   * Narrowed back to `@internationalized/date`'s types, because that is what\n   * the calendar and the date fields take. The shared class is typed on the\n   * numbers a date is made of, which every date library agrees on and nothing\n   * else does.\n   */\n  public override getValue(): DateRangeFilterValue | null {\n    return super.getValue() as DateRangeFilterValue | null;\n  }\n\n  public override setValue(range: DateRangeFilterValue | null): void {\n    super.setValue(range);\n  }\n\n  /** The list this filter belongs to — `context`, typed as React's `List`. */\n  public get list(): List<T> {\n    return this.context as List<T>;\n  }\n\n  /* As in `Filter`: created by this filter, so each one's `filter` is React's. */\n  public override get values(): FilterValue[] {\n    return super.values as FilterValue[];\n  }\n\n  public override getArrayValue(): FilterValue[] {\n    return super.getArrayValue() as FilterValue[];\n  }\n}\n"],"mappings":";;;;;;;;;;;;;;;AAuBA,IAAa,kBAAb,cAGU,oBAAyC;CACjD;CAEA,YACE,SACA,OACA;EACA,MAAM,SAAS,KAAc;EAC7B,KAAK,mBAAmB,MAAM;CAChC;CAEA,IAAW,cAAgC;EACzC,OAAO,KAAK,kBAAkB,eAAe;CAC/C;CAEA,IAAW,qBAAyC;EAClD,MAAM,UAAU,KAAK,oBAAoB,CAAC;EAC1C,OAAO,QAAQ,gBAAgB,WAC3B,CAAC,IACD,KAAK,SAAS,CAAC,aAAa,CAAC;CACnC;CAEA,IAAW,uBAAuB;EAChC,MAAM,UAAU,KAAK;EACrB,OAAO,SAAS,gBAAgB,WAAW,UAAU,KAAA;CACvD;CAQA,WAAwD;EACtD,OAAO,MAAM,SAAS;CACxB;CAEA,SAAyB,OAA0C;EACjE,MAAM,SAAS,KAAK;CACtB;;CAGA,IAAW,OAAgB;EACzB,OAAO,KAAK;CACd;CAGA,IAAoB,SAAwB;EAC1C,OAAO,MAAM;CACf;CAEA,gBAA+C;EAC7C,OAAO,MAAM,cAAc;CAC7B;AACF"}

package/dist/js/packages/components/src/components/List/model/filter/Filter.mjs

@@ -2,7 +2,7 @@
 /* */
 import { ListFilter } from "../../../../../../components-base/src/list/filter/ListFilter.mjs";
 import "../../../../../../components-base/src/index.mjs";
-//#region src/components/List/model/filter/Filter.ts
+// src/components/List/model/filter/Filter.ts
 /**
 * React's filter: the shared one, with `renderItem` narrowed.
 *
@@ -26,7 +26,6 @@ var Filter = class extends ListFilter {
 		return super.getArrayValue();
 	}
 };
-//#endregion
 export { Filter, Filter as default };
 
 //# sourceMappingURL=Filter.mjs.map

package/dist/js/packages/components/src/components/List/model/filter/resolveDateRangeFilterValue.mjs

@@ -0,0 +1,15 @@
+"use client"
+/* */
+import { resolveListDateRange } from "../../../../../../components-base/src/list/filter/dateRange.mjs";
+import "../../../../../../components-base/src/index.mjs";
+// src/components/List/model/filter/resolveDateRangeFilterValue.ts
+/**
+* Resolves the value of a date range filter to the instants it spans, for
+* filtering on the server side. Both bounds are inclusive: a date covers its
+* whole day and a date with time its whole minute, in the user's local time
+* zone. A missing side has no bound.
+*/
+var resolveDateRangeFilterValue = (range) => resolveListDateRange(range);
+export { resolveDateRangeFilterValue };
+
+//# sourceMappingURL=resolveDateRangeFilterValue.mjs.map

package/dist/js/packages/components/src/components/List/model/filter/resolveDateRangeFilterValue.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"resolveDateRangeFilterValue.mjs","names":[],"sources":["../../../../../../../../../src/components/List/model/filter/resolveDateRangeFilterValue.ts"],"sourcesContent":["import { resolveListDateRange } from \"@mittwald/flow-components-base\";\nimport type { DateRangeFilterValue } from \"@/components/List/model/filter/types\";\n\n/**\n * Resolves the value of a date range filter to the instants it spans, for\n * filtering on the server side. Both bounds are inclusive: a date covers its\n * whole day and a date with time its whole minute, in the user's local time\n * zone. A missing side has no bound.\n */\nexport const resolveDateRangeFilterValue = (\n  range: DateRangeFilterValue,\n): { start?: Date; end?: Date } => resolveListDateRange(range);\n"],"mappings":";;;;;;;;;;;AASA,IAAa,+BACX,UACiC,qBAAqB,KAAK"}

package/dist/js/packages/components/src/components/List/model/item/ItemCollection.mjs

@@ -2,7 +2,7 @@
 /* */
 import { ListItemCollection } from "../../../../../../components-base/src/list/item/ListItemCollection.mjs";
 import "../../../../../../components-base/src/index.mjs";
-//#region src/components/List/model/item/ItemCollection.ts
+// src/components/List/model/item/ItemCollection.ts
 /**
 * React's item collection: `ListItemCollection` from
 * `@mittwald/flow-components-base`, plus `list` — see `Sorting` for why.
@@ -15,7 +15,6 @@ var ItemCollection = class extends ListItemCollection {
 		return super.entries;
 	}
 };
-//#endregion
 export { ItemCollection, ItemCollection as default };
 
 //# sourceMappingURL=ItemCollection.mjs.map

package/dist/js/packages/components/src/components/List/model/item/ItemView.mjs

@@ -1,8 +1,8 @@
 "use client"
 /* */
 import { createElement } from "react";
-//#region src/components/List/model/item/ItemView.ts
-var dependenciesAreEqual = (a, b) => a === b || !!a && !!b && a.length === b.length && a.every((dependency, index) => Object.is(dependency, b[index]));
+import { isShallowEqual } from "remeda";
+// src/components/List/model/item/ItemView.ts
 var ItemView = class ItemView {
 	list;
 	textValue;
@@ -13,10 +13,12 @@ var ItemView = class ItemView {
 	showTiles;
 	showList;
 	tileMaxWidth;
+	renderDependencies;
 	dependencies;
 	renderFn;
+	lastComparison;
 	constructor(list, shape = {}) {
-		const { fallback, loadingView = fallback, textValue, href, target, defaultExpanded, renderFn, showTiles, showList = true, tileMaxWidth = 230, dependencies } = shape;
+		const { fallback, loadingView = fallback, textValue, href, target, defaultExpanded, renderFn, showTiles, showList = true, tileMaxWidth = 230, renderDependencies, dependencies } = shape;
 		this.list = list;
 		this.textValue = textValue;
 		this.renderFn = renderFn;
@@ -27,22 +29,32 @@ var ItemView = class ItemView {
 		this.showTiles = showTiles;
 		this.showList = showList;
 		this.tileMaxWidth = tileMaxWidth;
+		this.renderDependencies = renderDependencies;
 		this.dependencies = dependencies;
 	}
 	static fallbackRenderItemFn = (item) => createElement("pre", void 0, JSON.stringify(item));
 	/**
-	* Whether `other` would render this item identically — i.e. all render
-	* functions taken from the consumer's `ListItem` element are still the same,
-	* and the dependencies it declared have not changed.
+	* Whether `other` would render the item holding `data` identically. The
+	* render function counts by its `renderDependencies` where given, otherwise
+	* by its identity and the deprecated `dependencies`. `textValue` and `href`
+	* count by what they return for `data`, so inline functions do not re-render
+	* the item. `defaultExpanded` is read on mount only, so it does not count at
+	* all.
 	*/
-	rendersSameAs(other) {
-		return !!other && dependenciesAreEqual(this.dependencies, other.dependencies) && this.renderFn === other.renderFn && this.textValue === other.textValue && this.href === other.href && this.target === other.target && this.defaultExpanded === other.defaultExpanded;
+	rendersSameFor(other, data) {
+		return !!other && this.rendersSameContentAs(other) && this.textValue?.(data) === other.textValue?.(data) && this.href?.(data) === other.href?.(data) && this.target === other.target;
+	}
+	rendersSameContentAs(other) {
+		if (this.lastComparison?.other !== other) this.lastComparison = {
+			other,
+			result: this.renderDependencies || other.renderDependencies ? isShallowEqual(this.renderDependencies, other.renderDependencies) : this.renderFn === other.renderFn && isShallowEqual(this.dependencies, other.dependencies)
+		};
+		return this.lastComparison.result;
 	}
 	render(data) {
 		return (this.renderFn ?? ItemView.fallbackRenderItemFn)(data, this.list);
 	}
 };
-//#endregion
 export { ItemView };
 
 //# sourceMappingURL=ItemView.mjs.map

package/dist/js/packages/components/src/components/List/model/item/ItemView.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ItemView.mjs","names":[],"sources":["../../../../../../../../../src/components/List/model/item/ItemView.ts"],"sourcesContent":["import type {\n  DependencyList,\n  HTMLAttributeAnchorTarget,\n  ReactElement,\n  ReactNode,\n} from \"react\";\nimport { createElement } from \"react\";\nimport type { RenderItemFn } from \"@/components/List/model/item/types\";\nimport type List from \"@/components/List/model/List\";\n\nexport interface ItemViewShape<T> {\n  textValue?: (data: T) => string;\n  href?: (data: T) => string;\n  target?: HTMLAttributeAnchorTarget;\n  defaultExpanded?: (data: T) => boolean;\n  renderFn?: RenderItemFn<T>;\n  /** @deprecated Use loadingView instead */\n  fallback?: ReactElement;\n  loadingView?: ReactElement;\n  showList?: boolean;\n  showTiles?: boolean;\n  tileMaxWidth?: number;\n  /**\n   * Values this item's content depends on besides its own data.\n   *\n   * An item re-renders when its data changes, or when one of the render\n   * functions on its `List.Item` changes identity — which a function written\n   * inline in JSX does on every render of its parent. A render function with a\n   * stable identity (hoisted out of the component, wrapped in `useCallback`, or\n   * reading from an external store) has to list what it reads here, or the item\n   * keeps the values it first saw.\n   */\n  dependencies?: DependencyList;\n}\n\nconst dependenciesAreEqual = (a?: DependencyList, b?: DependencyList) =>\n  a === b ||\n  (!!a &&\n    !!b &&\n    a.length === b.length &&\n    a.every((dependency, index) => Object.is(dependency, b[index])));\n\nexport class ItemView<T> {\n  public readonly list: List<T>;\n  public readonly textValue?: (data: T) => string;\n  public readonly href?: (data: T) => string;\n  public readonly target?: HTMLAttributeAnchorTarget;\n  public readonly defaultExpanded?: (data: T) => boolean;\n  public readonly loadingView?: ReactElement;\n  public readonly showTiles?: boolean;\n  public readonly showList?: boolean;\n  public readonly tileMaxWidth: number;\n  public readonly dependencies?: DependencyList;\n  private readonly renderFn?: RenderItemFn<T>;\n\n  public constructor(list: List<T>, shape: ItemViewShape<T> = {}) {\n    const {\n      fallback,\n      loadingView = fallback,\n      textValue,\n      href,\n      target,\n      defaultExpanded,\n      renderFn,\n      showTiles,\n      showList = true,\n      tileMaxWidth = 230,\n      dependencies,\n    } = shape;\n    this.list = list;\n    this.textValue = textValue;\n    this.renderFn = renderFn;\n    this.href = href;\n    this.target = target;\n    this.defaultExpanded = defaultExpanded;\n    this.loadingView = loadingView;\n    this.showTiles = showTiles;\n    this.showList = showList;\n    this.tileMaxWidth = tileMaxWidth;\n    this.dependencies = dependencies;\n  }\n\n  private static fallbackRenderItemFn: RenderItemFn<never> = (item) =>\n    createElement(\"pre\", undefined, JSON.stringify(item));\n\n  /**\n   * Whether `other` would render this item identically — i.e. all render\n   * functions taken from the consumer's `ListItem` element are still the same,\n   * and the dependencies it declared have not changed.\n   */\n  public rendersSameAs(other?: ItemView<T>): boolean {\n    return (\n      !!other &&\n      dependenciesAreEqual(this.dependencies, other.dependencies) &&\n      this.renderFn === other.renderFn &&\n      this.textValue === other.textValue &&\n      this.href === other.href &&\n      this.target === other.target &&\n      this.defaultExpanded === other.defaultExpanded\n    );\n  }\n\n  public render(data: T): ReactNode {\n    const renderFn = (this.renderFn ??\n      ItemView.fallbackRenderItemFn) as RenderItemFn<T>;\n    return renderFn(data as never, this.list);\n  }\n}\n"],"mappings":";;;;AAmCA,IAAM,wBAAwB,GAAoB,MAChD,MAAM,KACL,CAAC,CAAC,KACD,CAAC,CAAC,KACF,EAAE,WAAW,EAAE,UACf,EAAE,OAAO,YAAY,UAAU,OAAO,GAAG,YAAY,EAAE,MAAM,CAAC;AAElE,IAAa,WAAb,MAAa,SAAY;CACvB;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CAEA,YAAmB,MAAe,QAA0B,CAAC,GAAG;EAC9D,MAAM,EACJ,UACA,cAAc,UACd,WACA,MACA,QACA,iBACA,UACA,WACA,WAAW,MACX,eAAe,KACf,iBACE;EACJ,KAAK,OAAO;EACZ,KAAK,YAAY;EACjB,KAAK,WAAW;EAChB,KAAK,OAAO;EACZ,KAAK,SAAS;EACd,KAAK,kBAAkB;EACvB,KAAK,cAAc;EACnB,KAAK,YAAY;EACjB,KAAK,WAAW;EAChB,KAAK,eAAe;EACpB,KAAK,eAAe;CACtB;CAEA,OAAe,wBAA6C,SAC1D,cAAc,OAAO,KAAA,GAAW,KAAK,UAAU,IAAI,CAAC;;;;;;CAOtD,cAAqB,OAA8B;EACjD,OACE,CAAC,CAAC,SACF,qBAAqB,KAAK,cAAc,MAAM,YAAY,KAC1D,KAAK,aAAa,MAAM,YACxB,KAAK,cAAc,MAAM,aACzB,KAAK,SAAS,MAAM,QACpB,KAAK,WAAW,MAAM,UACtB,KAAK,oBAAoB,MAAM;CAEnC;CAEA,OAAc,MAAoB;EAGhC,QAFkB,KAAK,YACrB,SAAS,qBAAA,CACK,MAAe,KAAK,IAAI;CAC1C;AACF"}
+{"version":3,"file":"ItemView.mjs","names":[],"sources":["../../../../../../../../../src/components/List/model/item/ItemView.ts"],"sourcesContent":["import type {\n  DependencyList,\n  HTMLAttributeAnchorTarget,\n  ReactElement,\n  ReactNode,\n} from \"react\";\nimport { createElement } from \"react\";\nimport type { RenderItemFn } from \"@/components/List/model/item/types\";\nimport type List from \"@/components/List/model/List\";\nimport { isShallowEqual } from \"remeda\";\n\nexport interface ItemViewShape<T> {\n  /**\n   * Runs on every render of the list to tell whether the item changed, so it\n   * should be cheap and pure.\n   */\n  textValue?: (data: T) => string;\n  /**\n   * Runs on every render of the list to tell whether the item changed, so it\n   * should be cheap and pure.\n   */\n  href?: (data: T) => string;\n  target?: HTMLAttributeAnchorTarget;\n  defaultExpanded?: (data: T) => boolean;\n  renderFn?: RenderItemFn<T>;\n  /** @deprecated Use loadingView instead */\n  fallback?: ReactElement;\n  loadingView?: ReactElement;\n  showList?: boolean;\n  showTiles?: boolean;\n  tileMaxWidth?: number;\n  /**\n   * Everything the render function reads besides the item's data.\n   *\n   * With `renderDependencies`, an item re-renders only when its data or one of\n   * these values changes. The render function's identity no longer counts, so a\n   * function written inline in JSX keeps the item from re-rendering on every\n   * render of its parent. List every value it reads from outside the item,\n   * including state read through the `list` argument — one left out keeps the\n   * item on the value it last rendered.\n   *\n   * Without it, an item re-renders whenever its render function changes\n   * identity, which an inline function does on every render of its parent.\n   */\n  renderDependencies?: DependencyList;\n  /**\n   * @deprecated Use `renderDependencies` instead. `dependencies` only adds to\n   *   the render function's identity, so an inline render function still\n   *   re-renders the item on every render of its parent.\n   */\n  dependencies?: DependencyList;\n}\n\nexport class ItemView<T> {\n  public readonly list: List<T>;\n  public readonly textValue?: (data: T) => string;\n  public readonly href?: (data: T) => string;\n  public readonly target?: HTMLAttributeAnchorTarget;\n  public readonly defaultExpanded?: (data: T) => boolean;\n  public readonly loadingView?: ReactElement;\n  public readonly showTiles?: boolean;\n  public readonly showList?: boolean;\n  public readonly tileMaxWidth: number;\n  public readonly renderDependencies?: DependencyList;\n  public readonly dependencies?: DependencyList;\n  private readonly renderFn?: RenderItemFn<T>;\n  private lastComparison?: { other: ItemView<T>; result: boolean };\n\n  public constructor(list: List<T>, shape: ItemViewShape<T> = {}) {\n    const {\n      fallback,\n      loadingView = fallback,\n      textValue,\n      href,\n      target,\n      defaultExpanded,\n      renderFn,\n      showTiles,\n      showList = true,\n      tileMaxWidth = 230,\n      renderDependencies,\n      dependencies,\n    } = shape;\n    this.list = list;\n    this.textValue = textValue;\n    this.renderFn = renderFn;\n    this.href = href;\n    this.target = target;\n    this.defaultExpanded = defaultExpanded;\n    this.loadingView = loadingView;\n    this.showTiles = showTiles;\n    this.showList = showList;\n    this.tileMaxWidth = tileMaxWidth;\n    this.renderDependencies = renderDependencies;\n    this.dependencies = dependencies;\n  }\n\n  private static fallbackRenderItemFn: RenderItemFn<never> = (item) =>\n    createElement(\"pre\", undefined, JSON.stringify(item));\n\n  /**\n   * Whether `other` would render the item holding `data` identically. The\n   * render function counts by its `renderDependencies` where given, otherwise\n   * by its identity and the deprecated `dependencies`. `textValue` and `href`\n   * count by what they return for `data`, so inline functions do not re-render\n   * the item. `defaultExpanded` is read on mount only, so it does not count at\n   * all.\n   */\n  public rendersSameFor(other: ItemView<T> | undefined, data: T): boolean {\n    return (\n      !!other &&\n      this.rendersSameContentAs(other) &&\n      this.textValue?.(data) === other.textValue?.(data) &&\n      this.href?.(data) === other.href?.(data) &&\n      this.target === other.target\n    );\n  }\n\n  // Every item of a render shares one item view, so the result is cached for\n  // the last `other`.\n  private rendersSameContentAs(other: ItemView<T>): boolean {\n    if (this.lastComparison?.other !== other) {\n      this.lastComparison = {\n        other,\n        result:\n          this.renderDependencies || other.renderDependencies\n            ? isShallowEqual(this.renderDependencies, other.renderDependencies)\n            : this.renderFn === other.renderFn &&\n              isShallowEqual(this.dependencies, other.dependencies),\n      };\n    }\n    return this.lastComparison.result;\n  }\n\n  public render(data: T): ReactNode {\n    const renderFn = (this.renderFn ??\n      ItemView.fallbackRenderItemFn) as RenderItemFn<T>;\n    return renderFn(data as never, this.list);\n  }\n}\n"],"mappings":";;;;;AAqDA,IAAa,WAAb,MAAa,SAAY;CACvB;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CAEA,YAAmB,MAAe,QAA0B,CAAC,GAAG;EAC9D,MAAM,EACJ,UACA,cAAc,UACd,WACA,MACA,QACA,iBACA,UACA,WACA,WAAW,MACX,eAAe,KACf,oBACA,iBACE;EACJ,KAAK,OAAO;EACZ,KAAK,YAAY;EACjB,KAAK,WAAW;EAChB,KAAK,OAAO;EACZ,KAAK,SAAS;EACd,KAAK,kBAAkB;EACvB,KAAK,cAAc;EACnB,KAAK,YAAY;EACjB,KAAK,WAAW;EAChB,KAAK,eAAe;EACpB,KAAK,qBAAqB;EAC1B,KAAK,eAAe;CACtB;CAEA,OAAe,wBAA6C,SAC1D,cAAc,OAAO,KAAA,GAAW,KAAK,UAAU,IAAI,CAAC;;;;;;;;;CAUtD,eAAsB,OAAgC,MAAkB;EACtE,OACE,CAAC,CAAC,SACF,KAAK,qBAAqB,KAAK,KAC/B,KAAK,YAAY,IAAI,MAAM,MAAM,YAAY,IAAI,KACjD,KAAK,OAAO,IAAI,MAAM,MAAM,OAAO,IAAI,KACvC,KAAK,WAAW,MAAM;CAE1B;CAIA,qBAA6B,OAA6B;EACxD,IAAI,KAAK,gBAAgB,UAAU,OACjC,KAAK,iBAAiB;GACpB;GACA,QACE,KAAK,sBAAsB,MAAM,qBAC7B,eAAe,KAAK,oBAAoB,MAAM,kBAAkB,IAChE,KAAK,aAAa,MAAM,YACxB,eAAe,KAAK,cAAc,MAAM,YAAY;EAC5D;EAEF,OAAO,KAAK,eAAe;CAC7B;CAEA,OAAc,MAAoB;EAGhC,QAFkB,KAAK,YACrB,SAAS,qBAAA,CACK,MAAe,KAAK,IAAI;CAC1C;AACF"}

package/dist/js/packages/components/src/components/List/model/loading/IncrementalLoader.mjs

@@ -8,7 +8,7 @@ import { useEffect, useMemo } from "react";
 import { times } from "remeda";
 import { hash } from "object-code";
 import { getAsyncResource, usePromise } from "@mittwald/react-use-promise";
-//#region src/components/List/model/loading/IncrementalLoader.ts
+// src/components/List/model/loading/IncrementalLoader.ts
 var emptyData = [];
 var IncrementalLoader = class IncrementalLoader {
 	list;
@@ -135,7 +135,6 @@ var IncrementalLoader = class IncrementalLoader {
 		throw new Error("Unknown data source");
 	}
 };
-//#endregion
 export { IncrementalLoader };
 
 //# sourceMappingURL=IncrementalLoader.mjs.map

package/dist/js/packages/components/src/components/List/model/loading/IncrementalLoaderState.mjs

@@ -1,10 +1,10 @@
 "use client"
 /* */
-import useSelector from "../../../../lib/mobx/useSelector.mjs";
-import { useStatic } from "../../../../lib/hooks/useStatic.mjs";
 import { ListLoaderState } from "../../../../../../components-base/src/list/loading/ListLoaderState.mjs";
 import "../../../../../../components-base/src/index.mjs";
-//#region src/components/List/model/loading/IncrementalLoaderState.ts
+import useSelector from "../../../../lib/mobx/useSelector.mjs";
+import { useStatic } from "../../../../lib/hooks/useStatic.mjs";
+// src/components/List/model/loading/IncrementalLoaderState.ts
 /**
 * React's view of the list's loading state.
 *
@@ -36,7 +36,6 @@ var IncrementalLoaderState = class IncrementalLoaderState extends ListLoaderStat
 		return useSelector(() => this.isInitiallyLoading);
 	}
 };
-//#endregion
 export { IncrementalLoaderState };
 
 //# sourceMappingURL=IncrementalLoaderState.mjs.map

package/dist/js/packages/components/src/components/List/model/search/Search.mjs

@@ -2,7 +2,7 @@
 /* */
 import { ListSearch } from "../../../../../../components-base/src/list/search/ListSearch.mjs";
 import "../../../../../../components-base/src/index.mjs";
-//#region src/components/List/model/search/Search.ts
+// src/components/List/model/search/Search.ts
 /**
 * React's search: the shared one plus how the field is rendered.
 *
@@ -24,7 +24,6 @@ var Search = class extends ListSearch {
 		return this.context;
 	}
 };
-//#endregion
 export { Search };
 
 //# sourceMappingURL=Search.mjs.map

package/dist/js/packages/components/src/components/List/model/sorting/Sorting.mjs

@@ -2,7 +2,7 @@
 /* */
 import { ListSorting } from "../../../../../../components-base/src/list/sorting/ListSorting.mjs";
 import "../../../../../../components-base/src/index.mjs";
-//#region src/components/List/model/sorting/Sorting.ts
+// src/components/List/model/sorting/Sorting.ts
 /**
 * React's sorting: the shared one, plus the list it belongs to.
 *
@@ -17,7 +17,6 @@ var Sorting = class extends ListSorting {
 		return this.context;
 	}
 };
-//#endregion
 export { Sorting, Sorting as default };
 
 //# sourceMappingURL=Sorting.mjs.map

package/dist/js/packages/components/src/components/List/model/sorting/SortingFunctions.mjs

@@ -1,7 +1,7 @@
 "use client"
 /* */
 import invariant from "invariant";
-//#region src/components/List/model/sorting/SortingFunctions.ts
+// src/components/List/model/sorting/SortingFunctions.ts
 var SortingFunctions = {
 	bigInt: ((rowA, rowB, columnId) => {
 		const valueA = rowA.getValue(columnId);
@@ -17,7 +17,6 @@ var SortingFunctions = {
 	}),
 	alphanumeric: "alphanumeric"
 };
-//#endregion
 export { SortingFunctions };
 
 //# sourceMappingURL=SortingFunctions.mjs.map

package/dist/js/packages/components/src/components/List/model/table/Table.mjs

@@ -2,21 +2,30 @@
 /* */
 import { TableHeader } from "./TableHeader.mjs";
 import { TableBody } from "./TableBody.mjs";
-//#region src/components/List/model/table/Table.ts
+import { isShallowEqual } from "remeda";
+// src/components/List/model/table/Table.ts
 var Table = class {
 	list;
 	header;
 	body;
 	componentProps;
 	constructor(list, shape = {}) {
-		const { header, body, ...restProps } = shape;
+		const { header, body, children: ignoredChildren, ...restProps } = shape;
 		this.list = list;
 		this.header = new TableHeader(this, header);
 		this.body = new TableBody(this, body);
 		this.componentProps = restProps;
 	}
+	/**
+	* Whether `other` would render the table identically, rows aside. Like
+	* `TableRow.rendersSameAs`, it only holds for rows that declare
+	* `renderDependencies`. Props count by identity, one by one, including the
+	* list's own.
+	*/
+	rendersSameAs(other) {
+		return !!other && isShallowEqual(this.list.componentProps, other.list.componentProps) && isShallowEqual(this.componentProps, other.componentProps) && this.header.rendersSameAs(other.header) && this.body.rendersSameAs(other.body);
+	}
 };
-//#endregion
 export { Table };
 
 //# sourceMappingURL=Table.mjs.map

package/dist/js/packages/components/src/components/List/model/table/Table.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Table.mjs","names":[],"sources":["../../../../../../../../../src/components/List/model/table/Table.ts"],"sourcesContent":["import type {\n  TableShape,\n  TableSupportedComponentProps,\n} from \"@/components/List/model/table/types\";\nimport type List from \"@/components/List/model/List\";\nimport { TableHeader } from \"@/components/List/model/table/TableHeader\";\nimport { TableBody } from \"@/components/List/model/table/TableBody\";\n\nexport class Table<T> {\n  public readonly list: List<T>;\n  public readonly header: TableHeader<T>;\n  public readonly body: TableBody<T>;\n  public readonly componentProps: TableSupportedComponentProps;\n\n  public constructor(list: List<T>, shape: TableShape<T> = {}) {\n    const { header, body, ...restProps } = shape;\n    this.list = list;\n    this.header = new TableHeader(this, header);\n    this.body = new TableBody(this, body);\n    this.componentProps = restProps;\n  }\n}\n"],"mappings":";;;;;AAQA,IAAa,QAAb,MAAsB;CACpB;CACA;CACA;CACA;CAEA,YAAmB,MAAe,QAAuB,CAAC,GAAG;EAC3D,MAAM,EAAE,QAAQ,MAAM,GAAG,cAAc;EACvC,KAAK,OAAO;EACZ,KAAK,SAAS,IAAI,YAAY,MAAM,MAAM;EAC1C,KAAK,OAAO,IAAI,UAAU,MAAM,IAAI;EACpC,KAAK,iBAAiB;CACxB;AACF"}
+{"version":3,"file":"Table.mjs","names":[],"sources":["../../../../../../../../../src/components/List/model/table/Table.ts"],"sourcesContent":["import type {\n  TableShape,\n  TableSupportedComponentProps,\n} from \"@/components/List/model/table/types\";\nimport type List from \"@/components/List/model/List\";\nimport { TableHeader } from \"@/components/List/model/table/TableHeader\";\nimport { TableBody } from \"@/components/List/model/table/TableBody\";\nimport { isShallowEqual } from \"remeda\";\n\nexport class Table<T> {\n  public readonly list: List<T>;\n  public readonly header: TableHeader<T>;\n  public readonly body: TableBody<T>;\n  public readonly componentProps: TableSupportedComponentProps;\n\n  public constructor(list: List<T>, shape: TableShape<T> = {}) {\n    // `children` holds the header and body elements, which arrive as `header`\n    // and `body`.\n    const { header, body, children: ignoredChildren, ...restProps } = shape;\n    this.list = list;\n    this.header = new TableHeader(this, header);\n    this.body = new TableBody(this, body);\n    this.componentProps = restProps;\n  }\n\n  /**\n   * Whether `other` would render the table identically, rows aside. Like\n   * `TableRow.rendersSameAs`, it only holds for rows that declare\n   * `renderDependencies`. Props count by identity, one by one, including the\n   * list's own.\n   */\n  public rendersSameAs(other?: Table<T>): boolean {\n    return (\n      !!other &&\n      isShallowEqual(this.list.componentProps, other.list.componentProps) &&\n      isShallowEqual(this.componentProps, other.componentProps) &&\n      this.header.rendersSameAs(other.header) &&\n      this.body.rendersSameAs(other.body)\n    );\n  }\n}\n"],"mappings":";;;;;;AASA,IAAa,QAAb,MAAsB;CACpB;CACA;CACA;CACA;CAEA,YAAmB,MAAe,QAAuB,CAAC,GAAG;EAG3D,MAAM,EAAE,QAAQ,MAAM,UAAU,iBAAiB,GAAG,cAAc;EAClE,KAAK,OAAO;EACZ,KAAK,SAAS,IAAI,YAAY,MAAM,MAAM;EAC1C,KAAK,OAAO,IAAI,UAAU,MAAM,IAAI;EACpC,KAAK,iBAAiB;CACxB;;;;;;;CAQA,cAAqB,OAA2B;EAC9C,OACE,CAAC,CAAC,SACF,eAAe,KAAK,KAAK,gBAAgB,MAAM,KAAK,cAAc,KAClE,eAAe,KAAK,gBAAgB,MAAM,cAAc,KACxD,KAAK,OAAO,cAAc,MAAM,MAAM,KACtC,KAAK,KAAK,cAAc,MAAM,IAAI;CAEtC;AACF"}

package/dist/js/packages/components/src/components/List/model/table/TableBody.mjs

@@ -1,19 +1,22 @@
 "use client"
 /* */
 import { TableRow } from "./TableRow.mjs";
-//#region src/components/List/model/table/TableBody.ts
+import { isShallowEqual } from "remeda";
+// src/components/List/model/table/TableBody.ts
 var TableBody = class {
 	table;
 	componentProps;
 	row;
 	constructor(table, shape = {}) {
-		const { row, ...rest } = shape;
+		const { row, children: ignoredChildren, ...rest } = shape;
 		this.table = table;
 		this.row = new TableRow(this, row);
 		this.componentProps = rest;
 	}
+	rendersSameAs(other) {
+		return isShallowEqual(this.componentProps, other.componentProps) && this.row.rendersSameAs(other.row);
+	}
 };
-//#endregion
 export { TableBody };
 
 //# sourceMappingURL=TableBody.mjs.map

package/dist/js/packages/components/src/components/List/model/table/TableBody.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"TableBody.mjs","names":[],"sources":["../../../../../../../../../src/components/List/model/table/TableBody.ts"],"sourcesContent":["import type { Table } from \"@/components/List/model/table/Table\";\nimport type {\n  TableBodyShape,\n  TableBodySupportedComponentProps,\n} from \"@/components/List/model/table/types\";\nimport { TableRow } from \"@/components/List/model/table/TableRow\";\n\nexport class TableBody<T> {\n  public readonly table: Table<T>;\n  public readonly componentProps: TableBodySupportedComponentProps;\n  public readonly row: TableRow<T>;\n\n  public constructor(table: Table<T>, shape: TableBodyShape<T> = {}) {\n    const { row, ...rest } = shape;\n    this.table = table;\n    this.row = new TableRow(this, row);\n    this.componentProps = rest;\n  }\n}\n"],"mappings":";;;;AAOA,IAAa,YAAb,MAA0B;CACxB;CACA;CACA;CAEA,YAAmB,OAAiB,QAA2B,CAAC,GAAG;EACjE,MAAM,EAAE,KAAK,GAAG,SAAS;EACzB,KAAK,QAAQ;EACb,KAAK,MAAM,IAAI,SAAS,MAAM,GAAG;EACjC,KAAK,iBAAiB;CACxB;AACF"}
+{"version":3,"file":"TableBody.mjs","names":[],"sources":["../../../../../../../../../src/components/List/model/table/TableBody.ts"],"sourcesContent":["import type { Table } from \"@/components/List/model/table/Table\";\nimport type {\n  TableBodyShape,\n  TableBodySupportedComponentProps,\n} from \"@/components/List/model/table/types\";\nimport { TableRow } from \"@/components/List/model/table/TableRow\";\nimport { isShallowEqual } from \"remeda\";\n\nexport class TableBody<T> {\n  public readonly table: Table<T>;\n  public readonly componentProps: TableBodySupportedComponentProps;\n  public readonly row: TableRow<T>;\n\n  public constructor(table: Table<T>, shape: TableBodyShape<T> = {}) {\n    // `children` holds the row element, which arrives as `row`.\n    const { row, children: ignoredChildren, ...rest } = shape;\n    this.table = table;\n    this.row = new TableRow(this, row);\n    this.componentProps = rest;\n  }\n\n  public rendersSameAs(other: TableBody<T>): boolean {\n    return (\n      isShallowEqual(this.componentProps, other.componentProps) &&\n      this.row.rendersSameAs(other.row)\n    );\n  }\n}\n"],"mappings":";;;;;AAQA,IAAa,YAAb,MAA0B;CACxB;CACA;CACA;CAEA,YAAmB,OAAiB,QAA2B,CAAC,GAAG;EAEjE,MAAM,EAAE,KAAK,UAAU,iBAAiB,GAAG,SAAS;EACpD,KAAK,QAAQ;EACb,KAAK,MAAM,IAAI,SAAS,MAAM,GAAG;EACjC,KAAK,iBAAiB;CACxB;CAEA,cAAqB,OAA8B;EACjD,OACE,eAAe,KAAK,gBAAgB,MAAM,cAAc,KACxD,KAAK,IAAI,cAAc,MAAM,GAAG;CAEpC;AACF"}

package/dist/js/packages/components/src/components/List/model/table/TableCell.mjs

@@ -1,20 +1,19 @@
 "use client"
 /* */
-//#region src/components/List/model/table/TableCell.ts
+// src/components/List/model/table/TableCell.ts
 var TableCell = class {
 	row;
 	renderFn;
 	componentProps;
 	loadingView;
 	constructor(row, shape = {}) {
-		const { renderFn, loadingView, ...rest } = shape;
+		const { renderFn, loadingView, children: ignoredChildren, ...rest } = shape;
 		this.row = row;
 		this.renderFn = renderFn;
 		this.componentProps = rest;
 		this.loadingView = loadingView;
 	}
 };
-//#endregion
 export { TableCell };
 
 //# sourceMappingURL=TableCell.mjs.map

package/dist/js/packages/components/src/components/List/model/table/TableCell.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"TableCell.mjs","names":[],"sources":["../../../../../../../../../src/components/List/model/table/TableCell.ts"],"sourcesContent":["import type {\n  TableCellShape,\n  TableCellSupportedComponentProps,\n} from \"@/components/List/model/table/types\";\nimport type { TableRow } from \"@/components/List/model/table/TableRow\";\nimport type { RenderItemFn } from \"@/components/List\";\nimport type { ReactElement } from \"react\";\n\nexport class TableCell<T> {\n  public readonly row: TableRow<T>;\n  public readonly renderFn?: RenderItemFn<T>;\n  public readonly componentProps: TableCellSupportedComponentProps;\n  loadingView?: ReactElement;\n\n  public constructor(row: TableRow<T>, shape: TableCellShape<T> = {}) {\n    const { renderFn, loadingView, ...rest } = shape;\n    this.row = row;\n    this.renderFn = renderFn;\n    this.componentProps = rest;\n    this.loadingView = loadingView;\n  }\n}\n"],"mappings":";;;AAQA,IAAa,YAAb,MAA0B;CACxB;CACA;CACA;CACA;CAEA,YAAmB,KAAkB,QAA2B,CAAC,GAAG;EAClE,MAAM,EAAE,UAAU,aAAa,GAAG,SAAS;EAC3C,KAAK,MAAM;EACX,KAAK,WAAW;EAChB,KAAK,iBAAiB;EACtB,KAAK,cAAc;CACrB;AACF"}
+{"version":3,"file":"TableCell.mjs","names":[],"sources":["../../../../../../../../../src/components/List/model/table/TableCell.ts"],"sourcesContent":["import type {\n  TableCellShape,\n  TableCellSupportedComponentProps,\n} from \"@/components/List/model/table/types\";\nimport type { TableRow } from \"@/components/List/model/table/TableRow\";\nimport type { RenderItemFn } from \"@/components/List\";\nimport type { ReactElement } from \"react\";\n\nexport class TableCell<T> {\n  public readonly row: TableRow<T>;\n  public readonly renderFn?: RenderItemFn<T>;\n  public readonly componentProps: TableCellSupportedComponentProps;\n  loadingView?: ReactElement;\n\n  public constructor(row: TableRow<T>, shape: TableCellShape<T> = {}) {\n    // `children` is the render function, which arrives as `renderFn`.\n    const {\n      renderFn,\n      loadingView,\n      children: ignoredChildren,\n      ...rest\n    } = shape as TableCellShape<T> & { children?: unknown };\n    this.row = row;\n    this.renderFn = renderFn;\n    this.componentProps = rest;\n    this.loadingView = loadingView;\n  }\n}\n"],"mappings":";;;AAQA,IAAa,YAAb,MAA0B;CACxB;CACA;CACA;CACA;CAEA,YAAmB,KAAkB,QAA2B,CAAC,GAAG;EAElE,MAAM,EACJ,UACA,aACA,UAAU,iBACV,GAAG,SACD;EACJ,KAAK,MAAM;EACX,KAAK,WAAW;EAChB,KAAK,iBAAiB;EACtB,KAAK,cAAc;CACrB;AACF"}

package/dist/js/packages/components/src/components/List/model/table/TableColumn.mjs

@@ -1,6 +1,7 @@
 "use client"
 /* */
-//#region src/components/List/model/table/TableColumn.ts
+import { isShallowEqual } from "remeda";
+// src/components/List/model/table/TableColumn.ts
 var TableColumn = class {
 	tableHeader;
 	componentProps;
@@ -8,8 +9,10 @@ var TableColumn = class {
 		this.tableHeader = tableHeader;
 		this.componentProps = shape;
 	}
+	rendersSameAs(other) {
+		return isShallowEqual(this.componentProps, other.componentProps);
+	}
 };
-//#endregion
 export { TableColumn };
 
 //# sourceMappingURL=TableColumn.mjs.map

package/dist/js/packages/components/src/components/List/model/table/TableColumn.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"TableColumn.mjs","names":[],"sources":["../../../../../../../../../src/components/List/model/table/TableColumn.ts"],"sourcesContent":["import type {\n  TableColumnShape,\n  TableColumnSupportedComponentProps,\n} from \"@/components/List/model/table/types\";\nimport type { TableHeader } from \"@/components/List/model/table/TableHeader\";\n\nexport class TableColumn<T> {\n  public readonly tableHeader: TableHeader<T>;\n  public readonly componentProps: TableColumnSupportedComponentProps;\n\n  public constructor(\n    tableHeader: TableHeader<T>,\n    shape: TableColumnShape = {},\n  ) {\n    this.tableHeader = tableHeader;\n    this.componentProps = shape;\n  }\n}\n"],"mappings":";;;AAMA,IAAa,cAAb,MAA4B;CAC1B;CACA;CAEA,YACE,aACA,QAA0B,CAAC,GAC3B;EACA,KAAK,cAAc;EACnB,KAAK,iBAAiB;CACxB;AACF"}
+{"version":3,"file":"TableColumn.mjs","names":[],"sources":["../../../../../../../../../src/components/List/model/table/TableColumn.ts"],"sourcesContent":["import type {\n  TableColumnShape,\n  TableColumnSupportedComponentProps,\n} from \"@/components/List/model/table/types\";\nimport type { TableHeader } from \"@/components/List/model/table/TableHeader\";\nimport { isShallowEqual } from \"remeda\";\n\nexport class TableColumn<T> {\n  public readonly tableHeader: TableHeader<T>;\n  public readonly componentProps: TableColumnSupportedComponentProps;\n\n  public constructor(\n    tableHeader: TableHeader<T>,\n    shape: TableColumnShape = {},\n  ) {\n    this.tableHeader = tableHeader;\n    this.componentProps = shape;\n  }\n\n  public rendersSameAs(other: TableColumn<T>): boolean {\n    return isShallowEqual(this.componentProps, other.componentProps);\n  }\n}\n"],"mappings":";;;;AAOA,IAAa,cAAb,MAA4B;CAC1B;CACA;CAEA,YACE,aACA,QAA0B,CAAC,GAC3B;EACA,KAAK,cAAc;EACnB,KAAK,iBAAiB;CACxB;CAEA,cAAqB,OAAgC;EACnD,OAAO,eAAe,KAAK,gBAAgB,MAAM,cAAc;CACjE;AACF"}

package/dist/js/packages/components/src/components/List/model/table/TableHeader.mjs

@@ -1,19 +1,25 @@
 "use client"
 /* */
 import { TableColumn } from "./TableColumn.mjs";
-//#region src/components/List/model/table/TableHeader.ts
+import { isShallowEqual } from "remeda";
+// src/components/List/model/table/TableHeader.ts
 var TableHeader = class {
 	table;
 	componentProps;
 	columns;
 	constructor(table, shape = {}) {
-		const { columns = [], ...rest } = shape;
+		const { columns = [], children: ignoredChildren, ...rest } = shape;
 		this.table = table;
 		this.columns = columns.map((colShape) => new TableColumn(this, colShape));
 		this.componentProps = rest;
 	}
+	rendersSameAs(other) {
+		return isShallowEqual(this.componentProps, other.componentProps) && this.columns.length === other.columns.length && this.columns.every((column, index) => {
+			const otherColumn = other.columns[index];
+			return !!otherColumn && column.rendersSameAs(otherColumn);
+		});
+	}
 };
-//#endregion
 export { TableHeader };
 
 //# sourceMappingURL=TableHeader.mjs.map